/* Ninja Forms Turnstile Styles */

.nf-field-container .cf-turnstile {
    margin: 10px 0!important;
    min-height: 65px; /* Normal size height */
    display: flex;
    justify-content: flex-start;
    align-items: center;
}

/* Target both possible container class combinations */
.nf-field-container.turnstile-container input[type="hidden"],
.nf-field-container.textbox-container input[type="hidden"].nf-element {
    display: none;
}

/* Make sure Turnstile container takes full width */
.nf-field-container.turnstile-container .nf-field-element,
.nf-field-container.textbox-container .nf-field-element {
    width: 100%;
}

.nf-field-container.turnstile-container .field-wrap,
.nf-field-container.textbox-container .turnstile-wrap {
    display: block;
}

/* Specific styling for when field has textbox classes but contains Turnstile */
.nf-field-container.textbox-container:has(.cf-turnstile) .nf-field-element,
.textbox-wrap:has(.cf-turnstile) {
    display: block;
}

/* Hide text input appearance when it's actually a Turnstile field */
.nf-field-container.textbox-container .cf-turnstile + input[type="text"],
.nf-field-container.textbox-container input[type="text"]:has(+ .cf-turnstile) {
    display: none !important;
}

.nf-field-container .cf-turnstile[data-size="compact"] {
    min-height: 45px; /* Compact size height */
}

/* Responsive adjustments */
@media (max-width: 480px) {
    .nf-field-container .cf-turnstile {
        justify-content: center;
    }
}

/* Loading state */
.cf-turnstile.loading::before {
    content: "Loading Turnstile...";
    color: #666;
    font-size: 14px;
    font-style: italic;
}

/* Error state styling */
.nf-field-container .nf-error .cf-turnstile {
    border-left: 3px solid #d63638;
    padding-left: 10px;
}

/* Hide the Turnstile widget until it's properly loaded */
.cf-turnstile:empty {
    background: #f9f9f9;
    border: 1px dashed #ccc;
    border-radius: 4px;
    min-height: 65px;
    display: flex;
    align-items: center;
    justify-content: center;
    position: relative;
}

.cf-turnstile:empty::after {
    content: "Loading security check...";
    color: #666;
    font-size: 14px;
    font-style: italic;
}

/* Ensure proper spacing in form */
.nf-field-container .field-wrap .cf-turnstile {
    width: 100%;
    box-sizing: border-box;
}

/* Dark theme adjustments */
.cf-turnstile[data-theme="dark"]:empty {
    background: #2d2d2d;
    border-color: #555;
    color: #ccc;
}

.cf-turnstile[data-theme="dark"]:empty::after {
    color: #ccc;
}

/* Force hide any text inputs in Turnstile containers - backup rule */
.nf-field-container:has(.cf-turnstile) input[type="text"]:not(.cf-turnstile) {
    display: none !important;
}

/* Ensure Turnstile widget is properly displayed */
.cf-turnstile {
    display: block !important;
    width: auto !important;
    min-width: 300px;
} 