/* ==========================================================================
   fc-form.css — Free Consultation Multi-Step WPForms
   ========================================================================== */

:root {
    --fcf-navy:   var(--color-navy, #0c1e4a);
    --fcf-gold:   var(--color-gold, #c5a049);
    --fcf-white:  #ffffff;
    --fcf-light:  #f4f6fb;
    --fcf-border: #e2e8f4;
    --fcf-text:   #374151;
    --fcf-muted:  #6b7280;
    --fcf-radius: 10px;
}

/* ── Reset container ─────────────────────────────────────────────────────────── */
.fc-form-wrap .wpforms-container {
    margin: 0 !important;
}

/* ── Hide honeypot fields ────────────────────────────────────────────────────── */
.fc-form-wrap #wpforms-112-field_13-container,
.fc-form-wrap #wpforms-112-field_9-container {
    display: none !important;
}

/* ── Progress indicator ──────────────────────────────────────────────────────── */
.fc-form-wrap .wpforms-page-indicator {
    margin-bottom: 2rem !important;
    padding: 0 !important;
    border: none !important;
    background: none !important;
}

.fc-form-wrap .wpforms-page-indicator-page-title,
.fc-form-wrap .wpforms-page-indicator-page-title-sep,
.fc-form-wrap .wpforms-page-indicator-steps {
    display: inline !important;
    font-size: 0.85rem !important;
    font-weight: 600 !important;
    color: var(--fcf-navy) !important;
    letter-spacing: 0.02em !important;
}

.fc-form-wrap .wpforms-page-indicator-page-title {
    color: var(--fcf-navy) !important;
    font-weight: 700 !important;
    font-size: 0.9rem !important;
    text-transform: uppercase !important;
    letter-spacing: 0.08em !important;
}

.fc-form-wrap .wpforms-page-indicator-page-title-sep {
    color: var(--fcf-muted) !important;
    margin: 0 0.3rem !important;
}

.fc-form-wrap .wpforms-page-indicator-steps {
    color: var(--fcf-muted) !important;
    font-weight: 500 !important;
}

/* Progress bar track */
.fc-form-wrap .wpforms-page-indicator-page-progress-wrap {
    margin-top: 0.65rem !important;
    height: 6px !important;
    background: var(--fcf-border) !important;
    border-radius: 50px !important;
    overflow: hidden !important;
}

/* Progress bar fill — override inline color */
.fc-form-wrap .wpforms-page-indicator-page-progress {
    height: 100% !important;
    background: var(--fcf-gold) !important;
    border-radius: 50px !important;
    transition: width 0.4s ease !important;
}

/* ── Field spacing ───────────────────────────────────────────────────────────── */
.fc-form-wrap .wpforms-field {
    padding: 0 0 1.5rem !important;
}

/* ── Legend / question label ─────────────────────────────────────────────────── */
.fc-form-wrap .wpforms-field-radio fieldset legend.wpforms-field-label,
.fc-form-wrap .wpforms-field-date-time fieldset legend.wpforms-field-label {
    display: block !important;
    color: var(--fcf-navy) !important;
    font-size: clamp(1rem, 2vw, 1.15rem) !important;
    font-weight: 700 !important;
    font-family: var(--font-heading, serif) !important;
    margin-bottom: 1rem !important;
    padding: 0 !important;
    border: none !important;
    line-height: 1.4 !important;
    width: 100% !important;
}

/* Regular labels (text/email) */
.fc-form-wrap .wpforms-field-label {
    display: block !important;
    color: var(--fcf-navy) !important;
    font-size: 0.85rem !important;
    font-weight: 600 !important;
    margin-bottom: 0.4rem !important;
    padding: 0 !important;
    border: none !important;
}

.fc-form-wrap .wpforms-required-label {
    color: var(--fcf-gold) !important;
}

/* ── Radio cards ─────────────────────────────────────────────────────────────── */
.fc-form-wrap .wpforms-field-radio ul {
    list-style: none !important;
    margin: 0 !important;
    padding: 0 !important;
    display: grid !important;
    grid-template-columns: repeat(2, 1fr) !important;
    gap: 0.65rem !important;
}

.fc-form-wrap .wpforms-field-radio li {
    position: relative !important;
    margin: 0 !important;
    padding: 0 !important;
}

/* Hide native radio */
.fc-form-wrap .wpforms-field-radio input[type="radio"] {
    position: absolute !important;
    opacity: 0 !important;
    width: 0 !important;
    height: 0 !important;
    pointer-events: none !important;
}

/* Card label */
.fc-form-wrap .wpforms-field-radio .wpforms-field-label-inline {
    display: flex !important;
    align-items: center !important;
    gap: 0.75rem !important;
    padding: 0.85rem 1rem !important;
    border: 1.5px solid var(--fcf-border) !important;
    border-radius: var(--fcf-radius) !important;
    background: var(--fcf-white) !important;
    color: var(--fcf-text) !important;
    font-size: 0.92rem !important;
    font-weight: 500 !important;
    cursor: pointer !important;
    transition: border-color 0.2s, background 0.2s, color 0.2s !important;
    line-height: 1.4 !important;
    min-height: 52px !important;
    width: 100% !important;
    box-sizing: border-box !important;
}

/* Custom radio circle before label */
.fc-form-wrap .wpforms-field-radio .wpforms-field-label-inline::before {
    content: '' !important;
    flex-shrink: 0 !important;
    width: 18px !important;
    height: 18px !important;
    border: 2px solid var(--fcf-border) !important;
    border-radius: 50% !important;
    background: var(--fcf-white) !important;
    transition: border-color 0.2s, background 0.2s, box-shadow 0.2s !important;
}

/* Hover state */
.fc-form-wrap .wpforms-field-radio .wpforms-field-label-inline:hover {
    border-color: var(--fcf-navy) !important;
    background: rgba(12,30,74,0.02) !important;
}

.fc-form-wrap .wpforms-field-radio .wpforms-field-label-inline:hover::before {
    border-color: var(--fcf-navy) !important;
}

/* Selected state */
.fc-form-wrap .wpforms-field-radio input[type="radio"]:checked + .wpforms-field-label-inline {
    border-color: var(--fcf-navy) !important;
    background: rgba(12,30,74,0.04) !important;
    color: var(--fcf-navy) !important;
    font-weight: 600 !important;
}

.fc-form-wrap .wpforms-field-radio input[type="radio"]:checked + .wpforms-field-label-inline::before {
    border-color: var(--fcf-navy) !important;
    background: var(--fcf-navy) !important;
    box-shadow: inset 0 0 0 3px var(--fcf-white) !important;
}

/* Focus visible */
.fc-form-wrap .wpforms-field-radio input[type="radio"]:focus-visible + .wpforms-field-label-inline {
    outline: 2px solid var(--fcf-gold) !important;
    outline-offset: 2px !important;
}

/* ── Layout columns (Step 3 — Name + Phone) ──────────────────────────────────── */
.fc-form-wrap .wpforms-field-layout .wpforms-field-layout-rows {
    width: 100% !important;
}

.fc-form-wrap .wpforms-field-layout .wpforms-layout-row {
    display: grid !important;
    grid-template-columns: 1fr 1fr !important;
    gap: 0.75rem !important;
    margin: 0 !important;
}

.fc-form-wrap .wpforms-field-layout .wpforms-layout-column {
    width: 100% !important;
    float: none !important;
    padding: 0 !important;
}

.fc-form-wrap .wpforms-field-layout .wpforms-layout-column .wpforms-field {
    padding: 0 !important;
}

/* ── Text / Email inputs ─────────────────────────────────────────────────────── */
.fc-form-wrap .wpforms-field input.wpforms-field-large,
.fc-form-wrap .wpforms-field input.wpforms-field-medium {
    width: 100% !important;
    max-width: 100% !important;
    border: 1.5px solid var(--fcf-border) !important;
    border-radius: 8px !important;
    padding: 0.75rem 1rem !important;
    font-size: 0.93rem !important;
    font-family: inherit !important;
    color: var(--fcf-text) !important;
    background: var(--fcf-white) !important;
    box-shadow: none !important;
    box-sizing: border-box !important;
    transition: border-color 0.2s, box-shadow 0.2s !important;
    -webkit-appearance: none !important;
    appearance: none !important;
}

.fc-form-wrap .wpforms-field input:focus {
    outline: none !important;
    border-color: var(--fcf-navy) !important;
    box-shadow: 0 0 0 3px rgba(12,30,74,0.1) !important;
}

/* ── Phone — intl-tel-input ──────────────────────────────────────────────────── */
.fc-form-wrap .wpforms-field-phone .iti {
    display: block !important;
    width: 100% !important;
}

.fc-form-wrap .wpforms-field-phone .iti input[type="tel"] {
    width: 100% !important;
}

/* ── Textarea ────────────────────────────────────────────────────────────────── */
.fc-form-wrap .wpforms-field textarea.wpforms-field-medium,
.fc-form-wrap .wpforms-field textarea.wpforms-field-large {
    width: 100% !important;
    max-width: 100% !important;
    border: 1.5px solid var(--fcf-border) !important;
    border-radius: 8px !important;
    padding: 0.75rem 1rem !important;
    font-size: 0.93rem !important;
    font-family: inherit !important;
    color: var(--fcf-text) !important;
    background: var(--fcf-white) !important;
    box-shadow: none !important;
    box-sizing: border-box !important;
    min-height: 110px !important;
    resize: vertical !important;
    transition: border-color 0.2s, box-shadow 0.2s !important;
}

.fc-form-wrap .wpforms-field textarea:focus {
    outline: none !important;
    border-color: var(--fcf-navy) !important;
    box-shadow: 0 0 0 3px rgba(12,30,74,0.1) !important;
}

/* ── Date / Time picker (Step 4 conditional) ─────────────────────────────────── */
.fc-form-wrap .wpforms-field-date-time .wpforms-field-row {
    display: grid !important;
    grid-template-columns: 1fr 1fr !important;
    gap: 0.75rem !important;
    margin: 0 !important;
    padding: 0 !important;
}

.fc-form-wrap .wpforms-field-date-time .wpforms-field-row-block {
    float: none !important;
    width: 100% !important;
    padding: 0 !important;
}

.fc-form-wrap .wpforms-field-date-time .wpforms-field-row-block input {
    width: 100% !important;
    border: 1.5px solid var(--fcf-border) !important;
    border-radius: 8px !important;
    padding: 0.75rem 1rem !important;
    font-size: 0.93rem !important;
    font-family: inherit !important;
    color: var(--fcf-text) !important;
    background: var(--fcf-white) !important;
    box-shadow: none !important;
    box-sizing: border-box !important;
    cursor: pointer !important;
}

.fc-form-wrap .wpforms-field-date-time .wpforms-field-row-block input:focus {
    outline: none !important;
    border-color: var(--fcf-navy) !important;
    box-shadow: 0 0 0 3px rgba(12,30,74,0.1) !important;
}

.fc-form-wrap .wpforms-field-date-time .wpforms-field-sublabel {
    color: var(--fcf-muted) !important;
    font-size: 0.75rem !important;
    font-weight: 500 !important;
    margin-top: 0.3rem !important;
    display: block !important;
}

/* ── Error messages ──────────────────────────────────────────────────────────── */
.fc-form-wrap label.wpforms-error,
.fc-form-wrap .wpforms-error-container {
    color: #dc2626 !important;
    font-size: 0.78rem !important;
    margin-top: 0.3rem !important;
    display: block !important;
}

.fc-form-wrap input.wpforms-error,
.fc-form-wrap textarea.wpforms-error {
    border-color: #dc2626 !important;
}

/* ── Page navigation buttons ─────────────────────────────────────────────────── */
.fc-form-wrap .wpforms-field-pagebreak {
    padding: 0 !important;
    margin-top: 0.5rem !important;
}

.fc-form-wrap .wpforms-clear.wpforms-pagebreak-left {
    display: flex !important;
    gap: 0.75rem !important;
    align-items: center !important;
}

/* Both buttons base */
.fc-form-wrap .wpforms-page-button {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 0.4rem !important;
    padding: 0.75rem 1.75rem !important;
    border-radius: 50px !important;
    font-size: 0.93rem !important;
    font-weight: 600 !important;
    font-family: inherit !important;
    cursor: pointer !important;
    transition: background 0.2s, color 0.2s, border-color 0.2s, transform 0.15s !important;
    letter-spacing: 0.02em !important;
}

/* Next button — solid navy */
.fc-form-wrap .wpforms-page-next {
    background: var(--fcf-navy) !important;
    color: var(--fcf-white) !important;
    border: 2px solid var(--fcf-navy) !important;
}

.fc-form-wrap .wpforms-page-next:hover {
    background: var(--fcf-gold) !important;
    border-color: var(--fcf-gold) !important;
    transform: translateY(-1px) !important;
}

/* Previous button — outline */
.fc-form-wrap .wpforms-page-prev {
    background: transparent !important;
    color: var(--fcf-navy) !important;
    border: 2px solid var(--fcf-border) !important;
}

.fc-form-wrap .wpforms-page-prev:hover {
    border-color: var(--fcf-navy) !important;
    background: rgba(12,30,74,0.04) !important;
}

/* ── Submit button ───────────────────────────────────────────────────────────── */

/* Pull submit up alongside Previous (they're in different DOM parents) */
.fc-form-wrap .wpforms-page.last .wpforms-field-pagebreak {
    padding: 0 !important;
    margin: 0 !important;
}

.fc-form-wrap .wpforms-submit-container {
    text-align: right !important;
    padding: 0 !important;
    margin-top: -2.6rem !important;
    pointer-events: none !important;
}

.fc-form-wrap .wpforms-submit {
    pointer-events: auto !important;
}

.fc-form-wrap .wpforms-submit {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    width: auto !important;
    min-width: 160px !important;
    background: var(--fcf-gold) !important;
    color: var(--fcf-navy) !important;
    border: none !important;
    border-radius: 50px !important;
    padding: 0.75rem 2rem !important;
    font-size: 0.93rem !important;
    font-weight: 700 !important;
    font-family: inherit !important;
    cursor: pointer !important;
    letter-spacing: 0.02em !important;
    transition: background 0.2s, transform 0.15s !important;
}

.fc-form-wrap .wpforms-submit:hover {
    background: var(--fcf-navy) !important;
    color: var(--fcf-white) !important;
    transform: translateY(-1px) !important;
}

/* ── Success confirmation ─────────────────────────────────────────────────────── */
.fc-form-wrap .wpforms-confirmation-container-full {
    background: #f0fdf4 !important;
    border: 1.5px solid #86efac !important;
    border-radius: var(--fcf-radius) !important;
    padding: 1.5rem !important;
    color: #166534 !important;
    font-size: 0.95rem !important;
    line-height: 1.6 !important;
}

/* ── Mobile ──────────────────────────────────────────────────────────────────── */
@media (max-width: 600px) {
    .fc-form-wrap .wpforms-field-radio ul {
        grid-template-columns: 1fr !important;
    }

    .fc-form-wrap .wpforms-field-layout .wpforms-layout-row {
        grid-template-columns: 1fr !important;
    }

    .fc-form-wrap .wpforms-field-date-time .wpforms-field-row {
        grid-template-columns: 1fr !important;
    }

    .fc-form-wrap .wpforms-page-next {
        flex: 1 !important;
    }
}
