/* =================================================================
 * GRAVITY FORMS — Mindfacts Theme
 * -----------------------------------------------------------------
 * Migriert aus style.css Section 8.0–8.5 (am 2026-04-26).
 * Inhalt:
 *   1) Form 1 — Footer-Embed mit Neumorphic-Look (unverändert)
 *   2) Allgemein — Form-übergreifende Helfer
 *   3) Modern Forms — DS-basiertes Styling für alle Forms außer Form 1
 *
 * Tokens stammen aus dem Mindfacts Design-System
 * (design-system/project/colors_and_type.css).
 * Globale Token-Quelle ist Elementor — Fallbacks sind hier hinterlegt.
 * Enqueue-Handle: 'mf-gravityforms' (functions.php).
 * ================================================================= */


/* =================================================================
 * 1) FORM 1 — Neumorphic (Footer-Embed)
 * Selektoren: #gform_wrapper_1, #gform_1
 * Bleibt visuell unverändert gegenüber bisherigem Theme.
 * ================================================================= */

/* Framework Variables (gilt für alle GF-Themes) */
body .gform-theme--framework .gform-field-label:where(:not(.gform-theme__disable):not(.gform-theme__disable *):not(.gform-theme__disable-framework):not(.gform-theme__disable-framework *)) {
    --gf-local-color: var(--text-inverted);
    --gf-local-font-family: var(--text-font);
    --gf-local-font-size: var(--fs-base);
    --gf-local-line-height: 1.4;
}

body .gform-theme--api,
body .gform-theme--framework {
    --gf-font-family-primary: var(--text-font);
    --gf-ctrl-outline-color-focus: var(--ci-accent);
    --gf-ctrl-outline-width-focus: 1px;
    --gf-form-gap-y: var(--spacing-md);
    --gf-font-family-base: var(--text-font);
}

body #gform_wrapper_1[data-form-index="0"].gform-theme {
    --gf-color-primary: var(--ci-accent);
    --gf-radius: var(--border-radius-md);
}

#gform_submit_button_1 {
    padding-block-start: 6px;
    padding-block-end: 6px;
    padding-inline-start: 20px;
    padding-inline-end: 6px;

    box-shadow: 4px 4px 13px 0px rgba(0, 0, 0, 0.24);
    gap: var(--spacing-xs);
    border-radius: 96px;

    &:hover {
        background-color: var(--ci-accent);
    }

    &:after {
        content: url("https://mindfacts.um-dev.de/wp-content/uploads/2026/02/chevron.svg");
        width: 24px;
        height: 24px;
        color: var(--text-accent);
        background: white;
    }
}

#gform_wrapper_1 .gform_footer {
    visibility: hidden;
    position: absolute;
    left: -100vw;
}

/* Form 1 — Inputs & Textareas (Neumorphic) */

#gform_1 .neo-input.gfield :where(.ginput_container input, .ginput_container textarea) {
    background: var(--neo-bg);
    color: var(--neo-text);
    border-radius: var(--neo-radius) !important;
    border: 1px solid var(--neo-border);
    box-shadow: inset 3px 3px 8px var(--neo-shadow-dark),
    inset -3px -3px 8px var(--neo-shadow-light);
    outline: none;
    transition: box-shadow var(--neo-dur) var(--neo-ease),
    border-color var(--neo-dur) var(--neo-ease),
    transform var(--neo-dur) var(--neo-ease);
}

#gform_1 .neo-input.gfield :where(.ginput_container input:hover, .ginput_container textarea:hover):not(:focus):not(:disabled) {
    box-shadow: inset 3px 3px 8px var(--neo-shadow-dark),
    inset -3px -3px 8px var(--neo-shadow-light),
    inset 0 0 0 1px rgba(120, 190, 255, 0.18),
    inset 0 0 10px rgba(120, 190, 255, 0.18);
}

#gform_1 .neo-input.gfield :where(.ginput_container input::placeholder, .ginput_container textarea::placeholder) {
    color: var(--neo-muted);
}

#gform_1 .neo-input.gfield :where(.ginput_container input:focus, .ginput_container textarea:focus) {
    border-color: var(--neo-border-strong);
    box-shadow: inset 2px 2px 7px var(--neo-shadow-dark),
    inset -2px -2px 7px var(--neo-shadow-light),
    0 0 0 4px var(--neo-focus);
}

#gform_1 .neo-input.gfield .ginput_container input:disabled,
#gform_1 .neo-input.gfield .ginput_container textarea:disabled {
    opacity: 0.6;
    cursor: not-allowed;
}

#gform_1 .neo-input.gfield :where(.ginput_container input[aria-invalid="true"], .ginput_container input.is-invalid, .ginput_container textarea[aria-invalid="true"], .ginput_container textarea.is-invalid) {
    border-color: rgba(255, 120, 120, 0.35);
    box-shadow: inset 3px 3px 8px var(--neo-shadow-dark),
    inset -3px -3px 8px var(--neo-shadow-light),
    0 0 0 4px rgba(255, 120, 120, 0.14);
}

/* Form 1 — Choice Labels (Neumorphic) */

#gform_1 .neo-label.gfield .ginput_container label {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    background: var(--neo-bg);
    color: var(--neo-text);
    border: 1px solid var(--neo-border);
    box-shadow: -3px -3px 8px var(--neo-shadow-light),
    3px 3px 8px var(--neo-shadow-dark);
    transform: translateY(0) scale(1);
    transition: box-shadow var(--neo-dur) var(--neo-ease),
    border-color var(--neo-dur) var(--neo-ease),
    transform var(--neo-dur) var(--neo-ease),
    filter var(--neo-dur) var(--neo-ease);
}

#gform_1 .neo-label.gfield .ginput_container label:hover {
    transform: translateY(-1px);
    border-color: var(--neo-border-strong);
    box-shadow: -4px -4px 10px rgba(255, 255, 255, 0.10),
    4px 4px 10px rgba(0, 0, 0, 0.50);
    filter: saturate(1.02);
}

#gform_1 .neo-label.gfield .ginput_container input:checked + label {
    border-color: var(--neo-border-strong);
    box-shadow: inset 3px 3px 8px var(--neo-shadow-dark),
    inset -3px -3px 8px var(--neo-shadow-light);
    transform: translateY(0) scale(0.99);
    color: var(--text-inverted) !important;
}

#gform_1 .neo-label.gfield .ginput_container input:focus-visible + label {
    border-color: var(--neo-border-strong);
    box-shadow: inset 2px 2px 7px var(--neo-shadow-dark),
    inset -2px -2px 7px var(--neo-shadow-light),
    0 0 0 4px var(--neo-focus);
}

/* Form 1 — Consent Checkbox (Neumorphic) */

#gform_1 .neo-consent.gfield .ginput_container_consent {
    display: flex;
    align-items: flex-start;
    gap: 12px;
}

#gform_1 .neo-consent.gfield .ginput_container_consent input[type="checkbox"] {
    position: absolute;
    opacity: 0;
    width: 1px;
    height: 1px;
    margin: 0;
    pointer-events: none;
}

#gform_1 .neo-consent.gfield .ginput_container_consent label.gfield_consent_label {
    position: relative;
    display: inline-block;
    padding-left: 34px;
    line-height: 1.35;
    margin: 0 !important;
    font-size: 0.75rem;
    color: var(--neo-text);
    cursor: pointer;
}

#gform_1 .neo-consent.gfield .ginput_container_consent label.gfield_consent_label::before {
    content: "";
    position: absolute;
    left: 0;
    top: 2px;
    width: 22px;
    height: 22px;
    border-radius: 7px;
    background: var(--neo-bg);
    border: 1px solid var(--neo-border);
    box-shadow: -3px -3px 8px var(--neo-shadow-light),
    3px 3px 8px var(--neo-shadow-dark);
    transform: translateY(0);
    transition: box-shadow var(--neo-dur) var(--neo-ease),
    border-color var(--neo-dur) var(--neo-ease),
    transform var(--neo-dur) var(--neo-ease);
}

#gform_1 .neo-consent.gfield .ginput_container_consent label.gfield_consent_label:hover::before {
    transform: translateY(-1px);
    border-color: var(--neo-border-strong);
}

#gform_1 .neo-consent.gfield .ginput_container_consent input[type="checkbox"]:checked + label.gfield_consent_label::before {
    border-color: var(--neo-border-strong);
    box-shadow: inset 3px 3px 8px var(--neo-shadow-dark),
    inset -3px -3px 8px var(--neo-shadow-light);
    transform: translateY(0);
}

#gform_1 .neo-consent.gfield .ginput_container_consent label.gfield_consent_label::after {
    content: "";
    position: absolute;
    left: 7px;
    top: 8px;
    width: 8px;
    height: 4px;
    border-left: 2px solid transparent;
    border-bottom: 2px solid transparent;
    transform: rotate(-45deg);
    opacity: 0;
    transition: opacity 120ms ease;
}

#gform_1 .neo-consent.gfield .ginput_container_consent input[type="checkbox"]:checked + label.gfield_consent_label::after {
    border-left-color: rgba(255, 255, 255, 0.9);
    border-bottom-color: rgba(255, 255, 255, 0.9);
    opacity: 1;
}

#gform_1 .neo-consent.gfield .ginput_container_consent input[type="checkbox"]:focus-visible + label.gfield_consent_label::before {
    border-color: var(--neo-border-strong);
    box-shadow: inset 2px 2px 7px var(--neo-shadow-dark),
    inset -2px -2px 7px var(--neo-shadow-light),
    0 0 0 4px var(--neo-focus);
}

#gform_1 .neo-consent.gfield .ginput_container_consent input[type="checkbox"][aria-invalid="true"] + label.gfield_consent_label::before {
    border-color: rgba(255, 120, 120, 0.35);
    box-shadow: -3px -3px 8px var(--neo-shadow-light),
    3px 3px 8px var(--neo-shadow-dark),
    0 0 0 4px rgba(255, 120, 120, 0.12);
}


/* =================================================================
 * 2) ALLGEMEIN — Form-übergreifende Helfer
 * ================================================================= */

.custom-input-fields input,
.gform_required_legend {
    display: none !important;
}

.custom-input-fields.gfield--type-choice .gfield_checkbox,
.custom-input-fields.gfield--type-choice .gfield_radio {
    display: flex;
    flex-direction: row !important;
    flex-wrap: wrap;
}

.custom-input-fields.gfield label.gform-field-label.gform-field-label--type-inline {
    padding: 4px 12px;
    border-radius: 24px;
    margin: 0 !important;
    font-size: 0.75rem;
}

@media (prefers-reduced-motion: reduce) {
    .neo-label.gfield .ginput_container label,
    .neo-consent.gfield .ginput_container_consent label.gfield_consent_label::before {
        transition: none;
        transform: none;
    }
}


/* =================================================================
 * 3) MODERN FORMS — Mindfacts Design System (Form 2 + alle weiteren)
 * Selektor-Scope: body .gform_wrapper:not(#gform_wrapper_1)
 * Persona: UX-Tester, vergütete Selbst-Anmelder.
 * Tokens: design-system/project/colors_and_type.css
 * ================================================================= */

/* ----- 3.1  Wrapper & lokale Tokens ----- */

body .gform_wrapper:not(#gform_wrapper_1) {
    --mf-input-h: 44px;
    --mf-input-pad-x: 14px;
    --mf-input-radius: 8px;
    --mf-touch-min: 44px;
    --mf-input-border-color: #E2E5EA;
    --mf-input-border-color-focus: var(--mf-accent);
    --mf-input-bg: #FFFFFF;
    --mf-input-color: #1F2937;
    --mf-input-font: var(--font-body, "Poppins", -apple-system, BlinkMacSystemFont, sans-serif);

    --mf-card-bg: #FFFFFF;
    --mf-card-border: #E2E5EA;
    --mf-card-radius: 8px;
    --mf-page-bg: #F4F5F7;
    --mf-muted: #6B7280;
    --mf-accent: var(--e-global-color-300aa0f, #122C4A);
    --mf-accent-soft: rgba(18, 44, 74, 0.06);
    --mf-accent-ring: rgba(18, 44, 74, 0.18);

    font-family: var(--mf-input-font);
    color: var(--mf-input-color);
}

/* ----- 3.2  Inputs (Text, Email, Tel, Number, Date, Select, Textarea) ----- */

body .gform_wrapper:not(#gform_wrapper_1) .ginput_container input[type="text"],
body .gform_wrapper:not(#gform_wrapper_1) .ginput_container input[type="email"],
body .gform_wrapper:not(#gform_wrapper_1) .ginput_container input[type="tel"],
body .gform_wrapper:not(#gform_wrapper_1) .ginput_container input[type="number"],
body .gform_wrapper:not(#gform_wrapper_1) .ginput_container input[type="date"],
body .gform_wrapper:not(#gform_wrapper_1) .ginput_container select,
body .gform_wrapper:not(#gform_wrapper_1) .ginput_container textarea {
    min-height: var(--mf-input-h);
    width: 100%;
    font-size: 0.9375rem;          /* 15px — einheitlich für Inputs + Selects (Kunde: "1 Pt. weniger") */
    line-height: 3; /* nicht ändern */
    font-family: var(--mf-input-font);
    padding: 10px var(--mf-input-pad-x);
    border-radius: var(--mf-input-radius);
    border: 1px solid var(--mf-input-border-color);
    background: var(--mf-input-bg);
    color: var(--mf-input-color);
    box-sizing: border-box;
    transition: border-color 200ms ease, box-shadow 200ms ease;
}

body .gform_wrapper:not(#gform_wrapper_1) .ginput_container textarea {
    min-height: 120px;
    resize: vertical;
    line-height: 1.5;
    padding-top: 12px;
    padding-bottom: 12px;
}

body .gform_wrapper:not(#gform_wrapper_1) .ginput_container input:focus,
body .gform_wrapper:not(#gform_wrapper_1) .ginput_container select:focus,
body .gform_wrapper:not(#gform_wrapper_1) .ginput_container textarea:focus {
    border-color: var(--mf-input-border-color-focus);
    box-shadow: 0 0 0 3px var(--mf-accent-ring);
    outline: none;
}

body .gform_wrapper:not(#gform_wrapper_1) .ginput_container input[aria-invalid="true"],
body .gform_wrapper:not(#gform_wrapper_1) .ginput_container select[aria-invalid="true"],
body .gform_wrapper:not(#gform_wrapper_1) .ginput_container textarea[aria-invalid="true"] {
    border-color: var(--color-error, rgba(255, 120, 120, 0.75));
    box-shadow: 0 0 0 3px rgba(255, 120, 120, 0.15);
}

body .gform_wrapper:not(#gform_wrapper_1) .ginput_container input::placeholder,
body .gform_wrapper:not(#gform_wrapper_1) .ginput_container textarea::placeholder {
    color: var(--bg-muted, #A9B5C7);
    opacity: 1;
}

/* CSS-02: Hover-State fuer Form 2/3 Inputs (Audit 2026-04-30) */
body .gform_wrapper:not(#gform_wrapper_1) .ginput_container input:hover:not(:focus):not(:disabled):not([aria-invalid="true"]),
body .gform_wrapper:not(#gform_wrapper_1) .ginput_container select:hover:not(:focus):not(:disabled),
body .gform_wrapper:not(#gform_wrapper_1) .ginput_container textarea:hover:not(:focus):not(:disabled):not([aria-invalid="true"]) {
    border-color: color-mix(in srgb, var(--mf-input-border-color-focus) 40%, var(--mf-input-border-color));
}

/* CSS-03: Disabled-State fuer Form 2/3 Inputs (Audit 2026-04-30) */
body .gform_wrapper:not(#gform_wrapper_1) .ginput_container input:disabled,
body .gform_wrapper:not(#gform_wrapper_1) .ginput_container select:disabled,
body .gform_wrapper:not(#gform_wrapper_1) .ginput_container textarea:disabled {
    opacity: 0.6;
    cursor: not-allowed;
    background: var(--bg-light, #F3F5F8);
}

/* CSS-35: Browser-Autofill-Reset (Brand-Konsistenz, Audit 2026-04-30) */
body .gform_wrapper:not(#gform_wrapper_1) .ginput_container input:-webkit-autofill,
body .gform_wrapper:not(#gform_wrapper_1) .ginput_container input:-webkit-autofill:hover,
body .gform_wrapper:not(#gform_wrapper_1) .ginput_container input:-webkit-autofill:focus,
body .gform_wrapper:not(#gform_wrapper_1) .ginput_container textarea:-webkit-autofill,
body .gform_wrapper:not(#gform_wrapper_1) .ginput_container select:-webkit-autofill {
    -webkit-box-shadow: 0 0 0 1000px var(--mf-input-bg) inset;
    -webkit-text-fill-color: var(--mf-input-color);
    transition: background-color 5000s ease-in-out 0s;
}

/* ----- 3.2a  Select (Dropdown) — vertikal zentriert + Custom Chevron ----- */

body .gform_wrapper:not(#gform_wrapper_1) .ginput_container select {
    /* Vertikale Zentrierung (Fix gegen abgeschnittene Descender wie 'g', 'p', 'y') —
       font-size + line-height stammen aus dem Sammel-Selektor (3.2). */
    padding-top: 0;
    padding-bottom: 0;

    /* Native Browser-Pfeil entfernen */
    appearance: none;
    -webkit-appearance: none;
    -moz-appearance: none;

    /* Custom Chevron als inline SVG (Stroke = #1F2937, passt zu --mf-input-color) */
    background-image: url("data:image/svg+xml;charset=UTF-8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 16 16' fill='none'%3E%3Cpath d='M4 6L8 10L12 6' stroke='%231F2937' stroke-width='1.75' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
    background-repeat: no-repeat;
    background-position: right 16px center;
    background-size: 16px 16px;

    /* Platz rechts für Chevron + visuelle Absetzung von Text-Inputs */
    padding-right: 44px;

    cursor: pointer;
}

/* IE/Edge Legacy: Default-Pfeil entfernen */
body .gform_wrapper:not(#gform_wrapper_1) .ginput_container select::-ms-expand {
    display: none;
}

/* Hover/Focus: Chevron-Farbe folgt dem Border-Akzent (Navy) */
body .gform_wrapper:not(#gform_wrapper_1) .ginput_container select:hover,
body .gform_wrapper:not(#gform_wrapper_1) .ginput_container select:focus {
    background-image: url("data:image/svg+xml;charset=UTF-8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 16 16' fill='none'%3E%3Cpath d='M4 6L8 10L12 6' stroke='%23122C4A' stroke-width='1.75' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
}

/* ----- 3.3  Labels ----- */

body .gform_wrapper:not(#gform_wrapper_1) .gfield_label,
body .gform_wrapper:not(#gform_wrapper_1) .gform-field-label {
    font-size: var(--fs-base);
    font-weight: 600;
    color: var(--mf-input-color);
    margin-bottom: 6px;
    line-height: 1.35;
    display: block;
}

body .gform_wrapper:not(#gform_wrapper_1) .gfield_required {
    color: var(--ci-accent, #F7B037);
    margin-left: 4px;
}

/* ----- 3.4  Radio + Checkbox als Chip-Cards ----- */

body .gform_wrapper:not(#gform_wrapper_1) .gfield_radio,
body .gform_wrapper:not(#gform_wrapper_1) .gfield_checkbox {
    display: flex;
    flex-wrap: wrap;
    flex-direction: row;
    gap: 8px;
    list-style: none;
    padding: 0;
    margin: 0;
}

body .gform_wrapper:not(#gform_wrapper_1) .gfield_radio .gchoice label,
body .gform_wrapper:not(#gform_wrapper_1) .gfield_checkbox .gchoice label {
    min-height: var(--mf-touch-min);
    padding: 8px 16px;
    border-radius: 8px;
    border: 1px solid var(--mf-card-border);
    background: var(--mf-card-bg);
    color: var(--mf-input-color);
    cursor: pointer;
    display: inline-flex;
    align-items: center;
    gap: 10px;
    font-size: var(--fs-base);
    font-weight: 400;
    transition: background 200ms ease, border-color 200ms ease, color 200ms ease;
    user-select: none;
    margin: 0;
}

body .gform_wrapper:not(#gform_wrapper_1) .gfield_radio .gchoice label:hover,
body .gform_wrapper:not(#gform_wrapper_1) .gfield_checkbox .gchoice label:hover {
    border-color: var(--mf-accent);
    background: var(--mf-accent-soft);
}

body .gform_wrapper:not(#gform_wrapper_1) .gfield_radio .gchoice input:checked + label,
body .gform_wrapper:not(#gform_wrapper_1) .gfield_checkbox .gchoice input:checked + label {
    background: var(--mf-accent);
    border-color: var(--mf-accent);
    color: #FFFFFF;
    font-weight: 500;
}

body .gform_wrapper:not(#gform_wrapper_1) .gfield_radio .gchoice input:focus-visible + label,
body .gform_wrapper:not(#gform_wrapper_1) .gfield_checkbox .gchoice input:focus-visible + label {
    box-shadow: 0 0 0 3px var(--mf-accent-ring);
    outline: none;
}

body .gform_wrapper:not(#gform_wrapper_1) .gfield_radio .gchoice input,
body .gform_wrapper:not(#gform_wrapper_1) .gfield_checkbox .gchoice input {
    position: absolute;
    opacity: 0;
    /* CSS-19: pointer-events:none entfernt, sonst Tab-Focus unsicher (Audit 2026-04-30) */
    width: 1px;
    height: 1px;
}

/* CSS-09: Disabled-State fuer Choice-Cards (Audit 2026-04-30) */
body .gform_wrapper:not(#gform_wrapper_1) .gfield_radio .gchoice input:disabled + label,
body .gform_wrapper:not(#gform_wrapper_1) .gfield_checkbox .gchoice input:disabled + label {
    opacity: 0.5;
    cursor: not-allowed;
    background: var(--bg-light, #F3F5F8);
}

/* CSS-23: Aria-Invalid-State fuer Choice-Cards (Audit 2026-04-30) */
body .gform_wrapper:not(#gform_wrapper_1) .gfield_radio[aria-invalid="true"] .gchoice label,
body .gform_wrapper:not(#gform_wrapper_1) .gfield_checkbox[aria-invalid="true"] .gchoice label {
    border-color: var(--color-error, rgba(255, 120, 120, 0.75));
    box-shadow: 0 0 0 2px rgba(255, 120, 120, 0.18);
}

/* ----- 3.5  Submit-Button (Pill / Modern) ----- */

body .gform_wrapper:not(#gform_wrapper_1) .gform_footer {
    display: flex;
    justify-content: flex-end;
    margin-top: var(--spacing-lg, 1.5rem);
    gap: var(--spacing-sm);
}

body .gform_wrapper:not(#gform_wrapper_1) .gform_button {
    background: var(--ci-accent, #F7B037);
    color: var(--text-regular, #0B1A2B);
    border: none;
    border-radius: 8px;
    padding: 12px 24px;
    min-height: var(--mf-touch-min);
    font-size: var(--fs-base);
    font-weight: 600;
    font-family: var(--mf-input-font);
    cursor: pointer;
    box-shadow: 0 1px 2px rgba(0, 0, 0, 0.06);
    transition: background 200ms ease, transform 80ms, box-shadow 200ms ease;
}

body .gform_wrapper:not(#gform_wrapper_1) .gform_button:hover {
    background: #E09E26;
}

body .gform_wrapper:not(#gform_wrapper_1) .gform_button:active {
    transform: translateY(1px);
}

/* CSS-10: Disabled-State fuer Submit-Button (Audit 2026-04-30) */
body .gform_wrapper:not(#gform_wrapper_1) .gform_button:disabled {
    opacity: 0.6;
    cursor: not-allowed;
    box-shadow: none;
    transform: none;
}

body .gform_wrapper:not(#gform_wrapper_1) .gform_button:disabled:hover {
    background: var(--ci-accent, #F7B037);
}

body .gform_wrapper:not(#gform_wrapper_1) .gform_button:focus-visible {
    outline: none;
    box-shadow: 0 1px 2px rgba(0, 0, 0, 0.06),
                0 0 0 3px var(--mf-accent-ring);
}

/* ----- 3.6  Section-Header & Farb-Wechsel ----- */

body .gform_wrapper:not(#gform_wrapper_1) .gsection.mf-section-header {
    border-radius: 0;
    padding: 0 0 12px;
    margin: 0 0 20px;
    border-bottom: 1px solid var(--mf-card-border);
}

body .gform_wrapper:not(#gform_wrapper_1) .gsection.mf-section-header .gsection_title {
    font-family: var(--font-display, "DIN Alternate", "Poppins", sans-serif);
    font-size: var(--fs-lg);
    font-weight: 700;
    color: var(--mf-accent);
    margin: 0 0 4px;
    line-height: 1.2;
    letter-spacing: -0.01em;
}

body .gform_wrapper:not(#gform_wrapper_1) .gsection.mf-section-header .gsection_description {
    color: var(--mf-muted);
    font-size: var(--fs-base);
    margin: 0;
}

/* Farb-Wechsel: Header markiert die Section visuell.
   Felder darunter bleiben weiß (Section-Color-Banding über alle Felder
   würde JS brauchen — siehe Out-of-Scope). */
/*body .gform_wrapper:not(#gform_wrapper_1) .gsection.mf-section-a {*/
/*    background: var(--bg-light, #F3F5F8);*/
/*}*/

/*body .gform_wrapper:not(#gform_wrapper_1) .gsection.mf-section-b {*/
/*    background: rgba(18, 120, 199, 0.10);*/
/*}*/

/*body .gform_wrapper:not(#gform_wrapper_1) .gsection.mf-section-c {*/
/*    background: rgba(247, 176, 55, 0.12);*/
/*}*/

/*body .gform_wrapper:not(#gform_wrapper_1) .gsection.mf-section-d {*/
/*    background: var(--bg-white, #FFFFFF);*/
/*    border: 1.5px solid var(--mf-input-border-color);*/
/*}*/

/* Sub-Sections (z.B. Einwilligungserklärung, Widerruf) ohne Color-Modifier */
body .gform_wrapper:not(#gform_wrapper_1) .gsection:not(.mf-section-header) {
    border-top: 1px solid var(--mf-card-border);
    border-bottom: none;
    padding: 16px 0 0;
    margin-top: 16px;
}

body .gform_wrapper:not(#gform_wrapper_1) .gsection:not(.mf-section-header) .gsection_title {
    font-family: var(--font-display, "DIN Alternate", "Poppins", sans-serif);
    font-size: var(--fs-md);
    font-weight: 700;
    color: var(--mf-accent);
    margin: 0 0 var(--spacing-xs, 0.5rem);
}

/* ----- 3.7  Consent (Modern, statt Neumorphic) ----- */

body .gform_wrapper:not(#gform_wrapper_1) .ginput_container_consent {
    display: flex;
    align-items: flex-start;
    gap: 12px;
    min-height: var(--mf-touch-min);
}

body .gform_wrapper:not(#gform_wrapper_1) .ginput_container_consent input[type="checkbox"] {
    width: 22px;
    height: 22px;
    margin: 4px 0 0 0;
    cursor: pointer;
    accent-color: var(--ci-primary, #1278C7);
    flex: 0 0 auto;
}

body .gform_wrapper:not(#gform_wrapper_1) .ginput_container_consent label.gfield_consent_label {
    font-size: var(--fs-sm);
    line-height: 1.5;
    color: var(--text-regular, #0B1A2B);
    cursor: pointer;
    margin: 0;
}

/* ----- 3.8  Validation Summary (oben über Form) ----- */

body .gform_wrapper:not(#gform_wrapper_1) .gform_validation_errors {
    background: rgba(255, 120, 120, 0.08);
    border: 1px solid var(--color-error, rgba(255, 120, 120, 0.75));
    border-radius: 8px;
    padding: 16px;
    margin-bottom: 20px;
    color: var(--mf-input-color);
}

body .gform_wrapper:not(#gform_wrapper_1) .gform_validation_errors h2 {
    font-size: var(--fs-md);
    color: var(--text-regular, #0B1A2B);
    margin: 0 0 var(--spacing-xs, 0.5rem);
    font-weight: 700;
}

body .gform_wrapper:not(#gform_wrapper_1) .gfield_validation_message,
body .gform_wrapper:not(#gform_wrapper_1) .validation_message {
    color: var(--color-error, rgba(255, 120, 120, 0.75));
    font-size: var(--fs-sm);
    margin-top: var(--spacing-xs, 0.5rem);
}

/* ----- 3.9  Helper-Spacing & Save-Continue-Link ----- */

body .gform_wrapper:not(#gform_wrapper_1) .gfield {
    margin-bottom: 16px;
}

body .gform_wrapper:not(#gform_wrapper_1) .gfield_description {
    font-size: var(--fs-sm);
    color: var(--mf-muted);
    margin-top: 4px;
    line-height: 1.45;
}

body .gform_wrapper:not(#gform_wrapper_1) .gform_save_link {
    display: inline-block;
    color: var(--mf-accent);
    font-size: var(--fs-sm);
    margin-top: var(--spacing-sm, 0.875rem);
    text-decoration: underline;
    cursor: pointer;
}

body .gform_wrapper:not(#gform_wrapper_1) .gform_save_link:hover {
    color: var(--mf-accent);
    opacity: 0.8;
}

/* ----- 3.10  Reduced Motion ----- */

@media (prefers-reduced-motion: reduce) {
    body .gform_wrapper:not(#gform_wrapper_1) * {
        transition: none !important;
    }
}


/* zum einsortieren */

/* gf nested forms */

.gpnf-nested-entries {
    width: 100%;
}

/* =================================================================
 * 4) BOOKING-FORM CARD-LAYOUT (analog booking-preview.css)
 *    Form 2 (und alle weiteren Forms ausser Form 1) sollen die gleiche
 *    Card-Optik wie Step 4 (Summary) tragen.
 * ================================================================= */

/* ----- 4.1  Form-Pages als Cards ----- */

body .gform_wrapper:not(#gform_wrapper_1) .gform_page,
body .gform_wrapper:not(#gform_wrapper_1) form > .gform_body,
body .gform_wrapper:not(#gform_wrapper_1) .gform_body > .gform_fields {
    /* Single-Page-Forms (ohne .gform_page) bekommen den Card-Look am Body. */
}

body .gform_wrapper:not(#gform_wrapper_1) .gform_page {
    background: var(--mf-card-bg);
    border: 1px solid var(--mf-card-border);
    border-radius: var(--mf-card-radius);
    padding: 24px;
    margin-bottom: 24px;
}

/* Footer (Buttons) der Page bündig schließen */
body .gform_wrapper:not(#gform_wrapper_1) .gform_page_footer {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 12px;
    margin-top: 24px;
    padding-top: 20px;
    border-top: 1px solid var(--mf-card-border);
}

body .gform_wrapper:not(#gform_wrapper_1) .gform_page_footer .gform_previous_button {
    margin-right: auto;
}

/* Previous-Button als Ghost — Submit/Next bleibt orange */
body .gform_wrapper:not(#gform_wrapper_1) .gform_previous_button {
    background: transparent;
    color: var(--mf-accent);
    border: 1px solid var(--mf-card-border);
    border-radius: 8px;
    padding: 10px 20px;
    min-height: var(--mf-touch-min);
    font-size: var(--fs-base);
    font-weight: 500;
    font-family: var(--mf-input-font);
    cursor: pointer;
    box-shadow: none;
    transition: background 200ms ease, border-color 200ms ease;
}

body .gform_wrapper:not(#gform_wrapper_1) .gform_previous_button:hover {
    background: var(--mf-accent-soft);
    border-color: var(--mf-accent);
}

body .gform_wrapper:not(#gform_wrapper_1) .gform_previous_button:focus-visible {
    outline: none;
    box-shadow: 0 0 0 3px var(--mf-accent-ring);
}

/* ----- 4.2  Multi-Page-Stepper -----
 * Selektoren decken sowohl Standard-GF (.gf_step) als auch GP-Multi-Page
 * (.gpmpn-step / .gpnp-step) ab. Falls live andere Klassen genutzt werden,
 * ergänzen wir sie hier — die Tokens bleiben gleich. */

body .gform_wrapper:not(#gform_wrapper_1) .gf_page_steps,
body .gform_wrapper:not(#gform_wrapper_1) .gform_pagination,
body .gform_wrapper:not(#gform_wrapper_1) .gpnp-stepper,
body .gform_wrapper:not(#gform_wrapper_1) .gpmpn-stepper {
    display: flex;
    align-items: center;
    justify-content: center;
    flex-wrap: wrap;
    gap: 0;
    margin: 0 0 24px;
    padding: 0;
    list-style: none;
}

body .gform_wrapper:not(#gform_wrapper_1) .gf_step,
body .gform_wrapper:not(#gform_wrapper_1) .gpmpn-step,
body .gform_wrapper:not(#gform_wrapper_1) .gpnp-step {
    display: inline-flex;
    align-items: center;
    gap: 10px;
    padding: 0 16px;
    font-size: 0.875rem;
    font-weight: 600;
    color: var(--mf-muted);
    text-transform: uppercase;
    letter-spacing: 0.04em;
    position: relative;
}

body .gform_wrapper:not(#gform_wrapper_1) .gf_step .gf_step_number,
body .gform_wrapper:not(#gform_wrapper_1) .gpmpn-step .gpmpn-step-number,
body .gform_wrapper:not(#gform_wrapper_1) .gpnp-step .gpnp-step-number {
    width: 32px;
    height: 32px;
    border-radius: 50%;
    background: var(--mf-card-bg);
    border: 1.5px solid var(--mf-card-border);
    color: var(--mf-muted);
    display: inline-flex;
    align-items: center;
    justify-content: center;
    font-size: 0.875rem;
    font-weight: 600;
    flex-shrink: 0;
    transition: background 200ms ease, border-color 200ms ease, color 200ms ease;
}

body .gform_wrapper:not(#gform_wrapper_1) .gf_step_active,
body .gform_wrapper:not(#gform_wrapper_1) .gf_step_completed,
body .gform_wrapper:not(#gform_wrapper_1) .gpmpn-step.is-active,
body .gform_wrapper:not(#gform_wrapper_1) .gpmpn-step.is-complete,
body .gform_wrapper:not(#gform_wrapper_1) .gpnp-step.is-active,
body .gform_wrapper:not(#gform_wrapper_1) .gpnp-step.is-complete {
    color: var(--mf-accent);
}

body .gform_wrapper:not(#gform_wrapper_1) .gf_step_active .gf_step_number,
body .gform_wrapper:not(#gform_wrapper_1) .gf_step_completed .gf_step_number,
body .gform_wrapper:not(#gform_wrapper_1) .gpmpn-step.is-active .gpmpn-step-number,
body .gform_wrapper:not(#gform_wrapper_1) .gpmpn-step.is-complete .gpmpn-step-number,
body .gform_wrapper:not(#gform_wrapper_1) .gpnp-step.is-active .gpnp-step-number,
body .gform_wrapper:not(#gform_wrapper_1) .gpnp-step.is-complete .gpnp-step-number {
    background: var(--mf-accent);
    border-color: var(--mf-accent);
    color: #FFFFFF;
}

/* Verbinder-Linie zwischen Steps */
body .gform_wrapper:not(#gform_wrapper_1) .gf_step + .gf_step::before,
body .gform_wrapper:not(#gform_wrapper_1) .gpmpn-step + .gpmpn-step::before,
body .gform_wrapper:not(#gform_wrapper_1) .gpnp-step + .gpnp-step::before {
    content: "";
    display: inline-block;
    width: 24px;
    height: 2px;
    background: var(--mf-card-border);
    margin-right: 10px;
    flex-shrink: 0;
}

body .gform_wrapper:not(#gform_wrapper_1) .gf_step_completed + .gf_step::before,
body .gform_wrapper:not(#gform_wrapper_1) .gpmpn-step.is-complete + .gpmpn-step::before,
body .gform_wrapper:not(#gform_wrapper_1) .gpnp-step.is-complete + .gpnp-step::before {
    background: var(--mf-accent);
}

/* ----- 4.3  Custom Form-Hook-Klassen aus dem Booking-Plugin -----
 * (class-field-config.php :: CSS_HOOK_*; class-form-hooks.php hooked these
 * into gform_field_container/gform_field_content). */

body .gform_wrapper:not(#gform_wrapper_1) .um_wrapper {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
    gap: 16px 24px;
}

body .gform_wrapper:not(#gform_wrapper_1) .um_container {
    display: flex;
    flex-direction: column;
    gap: 12px;
}

body .gform_wrapper:not(#gform_wrapper_1) .um_email_container {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
    gap: 16px 24px;
}

/* Innerhalb der Hook-Wrapper sollen Felder ihren eigenen unteren Margin
   nicht doppelt mit dem Grid-Gap kumulieren. */
body .gform_wrapper:not(#gform_wrapper_1) .um_wrapper .gfield,
body .gform_wrapper:not(#gform_wrapper_1) .um_email_container .gfield {
    margin-bottom: 0;
}

/* Legend → Div Replacement: Reset von Browser-Legend-Defaults. */
body .gform_wrapper:not(#gform_wrapper_1) .change-legend-to-div {
    display: block;
    width: 100%;
    padding: 0;
    margin: 0 0 6px;
    border: 0;
}

/* ----- 4.4  GP Nested Forms — Teilnehmer-Tabelle (Bearbeiten/Löschen) ----- */

body .gform_wrapper:not(#gform_wrapper_1) .gpnf-nested-entries {
    border: 1px solid var(--mf-card-border);
    border-radius: var(--mf-card-radius);
    overflow: hidden;
    margin-bottom: 16px;
}

body .gform_wrapper:not(#gform_wrapper_1) .gpnf-nested-entries thead th {
    background: #F4F5F7;
    color: var(--mf-input-color);
    font-weight: 600;
    text-align: left;
    padding: 12px 16px;
    border: 0;
}

body .gform_wrapper:not(#gform_wrapper_1) .gpnf-nested-entries tbody td {
    padding: 12px 16px;
    border-top: 1px solid var(--mf-card-border);
    vertical-align: middle;
}

/* Bearbeiten/Löschen — Text optisch durch FA-Icons ersetzen */
body .gform_wrapper:not(#gform_wrapper_1) .gpnf-row-actions a {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 32px;
    height: 32px;
    margin: 0 4px;
    border-radius: 50%;
    border: 1px solid var(--mf-card-border);
    background: var(--mf-card-bg);
    color: var(--mf-accent);
    font-size: 0;             /* Original-Linktext optisch ausblenden */
    text-decoration: none;
    transition: background 200ms ease, border-color 200ms ease, color 200ms ease;
    vertical-align: middle;
}

body .gform_wrapper:not(#gform_wrapper_1) .gpnf-row-actions a::before {
    font: normal normal normal 14px/1 FontAwesome;
    font-size: 14px;
    line-height: 1;
}

body .gform_wrapper:not(#gform_wrapper_1) .gpnf-row-actions .gpnf-edit-entry::before { content: "\f040"; /* fa-pencil */ }
body .gform_wrapper:not(#gform_wrapper_1) .gpnf-row-actions .gpnf-delete-entry::before { content: "\f1f8"; /* fa-trash */ }

body .gform_wrapper:not(#gform_wrapper_1) .gpnf-row-actions a:hover {
    background: var(--mf-accent-soft);
    border-color: var(--mf-accent);
}

body .gform_wrapper:not(#gform_wrapper_1) .gpnf-row-actions .gpnf-delete-entry { color: #B12A2A; }
body .gform_wrapper:not(#gform_wrapper_1) .gpnf-row-actions .gpnf-delete-entry:hover {
    background: rgba(177, 42, 42, 0.08);
    border-color: #B12A2A;
}

/* "Weiteren Teilnehmer hinzufügen" Button — Ghost in Accent */
body .gform_wrapper:not(#gform_wrapper_1) .gpnf-add-entry {
    background: var(--mf-accent);
    color: #FFFFFF;
    border: 0;
    border-radius: 8px;
    padding: 10px 18px;
    font-size: var(--fs-base);
    font-weight: 600;
    cursor: pointer;
    transition: background 200ms ease, transform 80ms;
    margin-top: 4px;
}

body .gform_wrapper:not(#gform_wrapper_1) .gpnf-add-entry:hover {
    background: #0c1e35;
}

body .gform_wrapper:not(#gform_wrapper_1) .gpnf-add-entry:disabled {
    opacity: 0.55;
    cursor: not-allowed;
}

body .gform_wrapper:not(#gform_wrapper_1) .gpnf-add-entry-disabled {
    display: block;
    color: #B12A2A;
    font-size: var(--fs-sm);
    margin-top: 8px;
}

/* ----- 4.5  Subtotal- & Coupon-Block (Page „Teilnehmer") ----- */

/* Field 34 = „Kosten (zzgl. Mwst.) Preis", Field 56 = „Kosten (netto) inkl. Rabattcode",
 * Field 57 = Coupon-Input. IDs sind GF-Standard `#field_<formId>_<fieldId>`. */

body .gform_wrapper:not(#gform_wrapper_1) #field_2_34,
body .gform_wrapper:not(#gform_wrapper_1) #field_2_56 {
    background: var(--mf-card-bg);
    border: 1px solid var(--mf-card-border);
    border-radius: var(--mf-card-radius);
    padding: 14px 20px;
    margin-left: auto;
    width: fit-content;
    min-width: 280px;
    text-align: right;
    margin-bottom: 16px;
}

body .gform_wrapper:not(#gform_wrapper_1) #field_2_34 .gfield_label,
body .gform_wrapper:not(#gform_wrapper_1) #field_2_56 .gfield_label {
    color: var(--mf-muted);
    font-weight: 500;
    margin: 0;
    display: inline-block;
    margin-right: 12px;
}

body .gform_wrapper:not(#gform_wrapper_1) #field_2_34 .ginput_container,
body .gform_wrapper:not(#gform_wrapper_1) #field_2_56 .ginput_container {
    display: inline-block;
}

/* Field 34/56 sind Anzeige-Felder — Inputs visuell als reiner Text */
body .gform_wrapper:not(#gform_wrapper_1) #field_2_34 input,
body .gform_wrapper:not(#gform_wrapper_1) #field_2_56 input {
    border: 0;
    background: transparent;
    padding: 0;
    min-height: 0;
    font-size: 1.125rem;
    font-weight: 700;
    color: var(--mf-accent);
    text-align: right;
    width: auto;
    pointer-events: none;
    box-shadow: none;
    font-variant-numeric: tabular-nums;
}

body .gform_wrapper:not(#gform_wrapper_1) #field_2_34 input:focus,
body .gform_wrapper:not(#gform_wrapper_1) #field_2_56 input:focus {
    box-shadow: none;
    border: 0;
}

/* Field 56 default versteckt — JS macht es sichtbar wenn Coupon aktiv */
body .gform_wrapper:not(#gform_wrapper_1) #field_2_56 {
    display: none;
}

body .gform_wrapper:not(#gform_wrapper_1) #field_2_56.mf-coupon-active {
    display: block;
}

/* Coupon-Block (GF Coupons Add-On rendert .ginput_container_coupon) */
body .gform_wrapper:not(#gform_wrapper_1) .ginput_container_coupon {
    display: flex;
    gap: 8px;
    align-items: center;
    margin-left: auto;
    max-width: 360px;
    flex-wrap: wrap;
}

body .gform_wrapper:not(#gform_wrapper_1) .ginput_container_coupon .gf_coupon_code,
body .gform_wrapper:not(#gform_wrapper_1) .ginput_container_coupon input[type="text"] {
    flex: 1 1 200px;
    min-width: 0;
    margin: 0;
}

body .gform_wrapper:not(#gform_wrapper_1) .ginput_container_coupon .gform_button.gf_coupon_apply,
body .gform_wrapper:not(#gform_wrapper_1) .ginput_container_coupon button.gf_coupon_apply,
body .gform_wrapper:not(#gform_wrapper_1) .ginput_container_coupon input.gf_coupon_apply {
    background: var(--mf-accent);
    color: #FFFFFF;
    border: 0;
    border-radius: 8px;
    padding: 10px 18px;
    font-size: var(--fs-base);
    font-weight: 600;
    cursor: pointer;
    min-height: 44px;
    flex: 0 0 auto;
}

body .gform_wrapper:not(#gform_wrapper_1) .ginput_container_coupon .gf_coupon_apply:hover { background: #0c1e35; }
body .gform_wrapper:not(#gform_wrapper_1) .ginput_container_coupon .gf_coupon_apply:disabled { opacity: 0.55; cursor: not-allowed; }

/* Coupon-Field-Wrapper rechtsbündig anordnen, Label kompakt */
body .gform_wrapper:not(#gform_wrapper_1) .gfield--type-coupon,
body .gform_wrapper:not(#gform_wrapper_1) #field_2_57 {
    margin-left: auto;
    max-width: 380px;
    text-align: left;
}

body .gform_wrapper:not(#gform_wrapper_1) #field_2_57 .gfield_label {
    text-align: right;
    display: block;
}

/* GF Coupons rendert nach Apply ggf. eine Container-Liste der aktiven Codes */
body .gform_wrapper:not(#gform_wrapper_1) .gf_coupons_container,
body .gform_wrapper:not(#gform_wrapper_1) .gform_coupons_total {
    text-align: right;
    margin-left: auto;
    max-width: 380px;
    color: var(--mf-muted);
    font-size: var(--fs-sm);
    margin-top: 6px;
}

/* ----- 4.6  Page-Footer-Buttons — Hierarchie sicherstellen ----- */

/* Standard "Weiter" / "Absenden" als Primary (Brand-Orange) — bereits in 3.5 gestylt.
 * Hier nur sicherstellen, dass GF-eigene Klassen nicht durchschlagen.            */
body .gform_wrapper:not(#gform_wrapper_1) .gform_next_button,
body .gform_wrapper:not(#gform_wrapper_1) input[type="submit"].gform_button {
    background: var(--ci-accent, #F7B037);
    color: var(--text-regular, #0B1A2B);
    border-radius: 8px;
    padding: 12px 24px;
    font-weight: 600;
    border: 0;
    box-shadow: 0 1px 2px rgba(0, 0, 0, 0.06);
}

body .gform_wrapper:not(#gform_wrapper_1) .gform_next_button:hover,
body .gform_wrapper:not(#gform_wrapper_1) input[type="submit"].gform_button:hover {
    background: #E09E26;
}

/* "Zurück / lastPageButton" als Secondary Ghost (überschreibt evtl. GF-Theme Defaults) */
body .gform_wrapper:not(#gform_wrapper_1) .gform-theme-button--secondary,
body .gform_wrapper:not(#gform_wrapper_1) .gform_previous_button {
    background: transparent !important;
    color: var(--mf-accent) !important;
    border: 1px solid var(--mf-card-border) !important;
    border-radius: 8px;
    padding: 10px 20px;
    font-weight: 500;
    box-shadow: none !important;
}

body .gform_wrapper:not(#gform_wrapper_1) .gform-theme-button--secondary:hover,
body .gform_wrapper:not(#gform_wrapper_1) .gform_previous_button:hover {
    background: var(--mf-accent-soft) !important;
    border-color: var(--mf-accent) !important;
}

/* ----- 4.7  Mobile ----- */

@media (max-width: 720px) {
    body .gform_wrapper:not(#gform_wrapper_1) .gform_page {
        padding: 16px;
    }

    body .gform_wrapper:not(#gform_wrapper_1) .gf_page_steps,
    body .gform_wrapper:not(#gform_wrapper_1) .gform_pagination,
    body .gform_wrapper:not(#gform_wrapper_1) .gpnp-stepper,
    body .gform_wrapper:not(#gform_wrapper_1) .gpmpn-stepper {
        gap: 4px;
    }

    body .gform_wrapper:not(#gform_wrapper_1) .gf_step,
    body .gform_wrapper:not(#gform_wrapper_1) .gpmpn-step,
    body .gform_wrapper:not(#gform_wrapper_1) .gpnp-step {
        padding: 0 6px;
        font-size: 0.75rem;
    }

    body .gform_wrapper:not(#gform_wrapper_1) .gf_step + .gf_step::before,
    body .gform_wrapper:not(#gform_wrapper_1) .gpmpn-step + .gpmpn-step::before,
    body .gform_wrapper:not(#gform_wrapper_1) .gpnp-step + .gpnp-step::before {
        width: 12px;
        margin-right: 4px;
    }

    body .gform_wrapper:not(#gform_wrapper_1) .gform_page_footer {
        flex-wrap: wrap;
    }
}