/* =================================================================== FORMS global css =================================================================== */
.form {
    display: grid;
    gap: var(--sp15);

    & .form__row { display: grid; grid-template-columns: 1fr 1fr; gap: var(--sp15); }

    & .form__field { display: grid; gap: var(--sp8); }

    & .form__label { font-size: var(--f14); font-weight: 600; color: var(--ink); }

    & .form__input,
    & .form__textarea,
    & .form__select {
        width: 100%;
        min-height: 56px;
        padding: var(--sp12) var(--sp25);
        background: var(--white);
        border: 1px solid var(--line);
        border-radius: 0;
        font-size: var(--f15);
        color: var(--ink);
        outline: 0;
        transition: var(--transition);

        &::placeholder { color: var(--muted); }
        &:focus { border-color: var(--primary); box-shadow: 0 0 0 4px var(--blue-50); }
    }

    & .form__textarea { min-height: 140px; border-radius: 0; resize: vertical; }

    & .form__check {
        display: flex; align-items: flex-start;
        gap: var(--sp10);
        font-size: var(--f14);
        line-height: 1.5;
        color: var(--body);
        cursor: pointer;

        & input { flex: 0 0 auto; width: 18px; height: 18px; margin-top: 2px; accent-color: var(--primary); }
    }

    & .form__note { font-size: var(--f13); color: var(--muted); }

    & .btn { width: 100%; }

    &.form--inline {
        grid-template-columns: 1fr auto;
        align-items: center;
        & .btn { width: auto; }
    }
}

/* White card that wraps a form (registration, sign-up) */
.form-card {
    padding: var(--sp50);
    background: var(--white);
    border-radius: var(--r-md);
    box-shadow: var(--shadow-sm);

    & .form-card__tag { margin-bottom: var(--sp15); }

    & .form-card__title { margin-bottom: var(--sp10); font-size: var(--f32); }

    & .form-card__sub { margin-bottom: var(--sp30); }

    & .form-card__foot { margin-top: var(--sp20); font-size: var(--f14); text-align: center; }
}

/* =================================================================== GRAVITY FORMS — mirrors .form above
   The wrapper class is doubled to outrank Gravity Forms' own sheets
   (this file already prints after them — see inc/enqueue.php).
   =================================================================== */
.gform_wrapper.gform_wrapper {
    width: 100%;
    margin: 0;

    & form { margin: 0; }

    & .gform_heading { display: none; }

    & .gform_fields {
        display: grid;
        grid-template-columns: 1fr;
        gap: var(--sp15);
    }

    & .gfield { margin: 0; padding: 0; grid-column: 1 / -1; }
    & .gfield--width-half { grid-column: span 1; }

    & .gfield_label,
    & .gform-field-label:not(.gform-field-label--type-inline) {
        display: block;
        margin: 0 0 var(--sp8);
        padding: 0;
        font-size: var(--f14);
        font-weight: 600;
        color: var(--ink);
    }
    & .gfield_required { margin-left: 2px; color: var(--coral-500); font-size: inherit; }
    & .hidden_label > .gfield_label,
    & .gfield_visibility_hidden { position: absolute !important; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); }

    & .ginput_container { margin: 0; }

    & input[type="text"],
    & input[type="email"],
    & input[type="tel"],
    & input[type="url"],
    & input[type="number"],
    & textarea,
    & select {
        width: 100%;
        min-height: 56px;
        margin: 0;
        padding: var(--sp12) var(--sp25) !important;
        background: var(--white);
        border: 1px solid var(--line);
        border-radius: 8px;
        box-shadow: none;
        font-family: var(--font-body);
        font-size: var(--f15);
        line-height: 1.4;
        color: var(--ink);
        outline: 0;
        transition: var(--transition);

        &::placeholder { color: var(--muted); opacity: 1; }
        &:focus { border-color: var(--primary); box-shadow: 0 0 0 4px var(--blue-50); }
    }

    & textarea { min-height: 140px; resize: vertical; }

    /* Name field (first / last) */
    & .ginput_complex { display: grid; grid-template-columns: 1fr 1fr; gap: var(--sp15); }
    & .ginput_complex > span { width: auto; margin: 0; padding: 0; }

    /* Checkbox / consent */
    & .gfield_checkbox,
    & .gfield_radio { display: grid; gap: var(--sp8); }
    & .gchoice,
    & .ginput_container_consent {
        display: flex; align-items: flex-start;
        gap: var(--sp10);
        font-size: var(--f14);
        line-height: 1.5;
        color: var(--body);

        & input { flex: 0 0 auto; width: 18px; height: 18px; margin: 2px 0 0; accent-color: var(--primary); }
        & label { margin: 0; font-size: inherit; font-weight: 400; color: inherit; cursor: pointer; }
    }

    & .gfield_description { 
        padding: 0 0 !important;
        font-size: var(--f13) !important;
        color: var(--muted);
        border: 0 !important;
        background: transparent !important;
     }

    /* Submit */
    & .gform_footer,
    & .gform_page_footer { margin: var(--sp15) 0 0; padding: 0; }
    & .gform_ajax_spinner { margin-left: var(--sp10); }

    /* Validation */
    & .gform_validation_errors {
        margin: 0 0 var(--sp15);
        padding: var(--sp12) var(--sp20);
        background: #fff4f2;
        border: 1px solid var(--coral-500);
        border-radius: var(--r-md);
        box-shadow: none;
        & h2 { margin: 0; font-size: var(--f14); font-weight: 600; color: var(--coral-500); }
        & .gform-icon { display: none; }
    }
    & .gfield_error input,
    & .gfield_error textarea,
    & .gfield_error select { border-color: var(--coral-500); }
    & .gfield_validation_message,
    & .validation_message {
        margin: var(--sp8) 0 0; padding: 0;
        background: none; border: 0;
        font-size: var(--f13);
        color: var(--coral-500);
    }
}

/* ---- Submit button = .btn.btn-primary. Self-contained so it works whether
   Gravity Forms prints <input> or <button>, and outranks Orbital's
   .gform-theme--framework button rules (selector is 0,5,0). */
.gform_wrapper.gform_wrapper :is(.gform_footer, .gform_page_footer) .gform_button.gform_button {
    position: relative;
    isolation: isolate;
    display: inline-flex; align-items: center; justify-content: center;
    gap: var(--sp10);
    width: 100%; max-width: 100%;
    height: auto;
    min-height: 54px;
    margin: 0;
    padding: var(--sp12) var(--sp30);
    background-color: var(--blue-500);
    background-image: var(--gradient1);
    border: 0;
    border-radius: var(--r-md);
    box-shadow: none;
    overflow: hidden;
    font-family: var(--font-body);
    font-size: var(--f15);
    font-weight: 600;
    line-height: 1.2;
    text-align: center;
    text-decoration: none;
    text-shadow: none;
    color: var(--white);
    cursor: pointer;
    appearance: none;
    -webkit-appearance: none;
    transition: var(--transition);

    &:hover, &:focus-visible {
        background-color: var(--coral-500);
        background-image: var(--gradient-hover);
        color: var(--white);
        outline: 0;
    }
    /* <button> version (theme filter): keep the smooth ::before fade */
    &.btn:hover, &.btn:focus-visible { background-image: var(--gradient1); }

    & svg { flex: 0 0 auto; width: 18px; height: 18px; transition: var(--transition); }
    &:hover svg.btn__arrow { transform: translateX(4px); }
}

.gform_confirmation_message {
    padding: var(--sp20);
    background: var(--blue-50);
    border-radius: var(--r-md);
    font-size: var(--f15);
    color: var(--ink);
}

/* ---- Footer: dark field, labels hidden */
.site-footer .gform_wrapper.gform_wrapper {
    & .gform_fields { gap: var(--sp12); }
    & .gfield_label { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); }
    & input[type="email"],
    & input[type="text"] {
        background: var(--dark-800);
        border-color: var(--line-dark);
        border-radius: var(--r-md);
        color: var(--white);
        &::placeholder { color: rgba(255, 255, 255, .5); }
        &:focus { border-color: var(--primary); box-shadow: none; }
    }
    & .gform_footer { margin-top: var(--sp12); }
    & .gchoice, & .ginput_container_consent { color: rgba(255, 255, 255, .7); }
    & .gform_confirmation_message { background: var(--dark-800); color: var(--white); }
}

/* ---- Blog post sidebar card: compact, dark button */
.post-body__card--news .gform_wrapper.gform_wrapper {
    & .gform_fields { gap: var(--sp10); }
    & .gfield_label { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); }
    & input[type="email"],
    & input[type="text"] { min-height: 48px; }
    & .gform_footer { margin-top: var(--sp10); }
    & .gform_footer .gform_button.gform_button {
        min-height: 44px;
        padding: var(--sp8) var(--sp20);
        background: var(--navy-900);
        font-size: var(--f14);
        &:hover, &:focus-visible { background: var(--coral-500) var(--gradient-hover); }
        & .btn__arrow { display: none; }
    }
}

/* =================================================================== RESPONSIVE =================================================================== */
@media (max-width: 767.98px) {
    .form {
        & .form__row { grid-template-columns: 1fr; }
        &.form--inline { grid-template-columns: 1fr; & .btn { width: 100%; } }
    }
    .form-card { padding: var(--sp30) var(--sp20); }
    .gform_wrapper.gform_wrapper {
        & .gfield--width-half { grid-column: 1 / -1; }
        & .ginput_complex { grid-template-columns: 1fr; }
    }
}