/**
 * Univers Nuisibles — Refonte CSS du formulaire Gravity Forms #6
 * v2.7.3 — Charte UN avec spécificité haute pour battre UAEL Gravity Forms Styler
 *
 * Stratégie : préfixe `.uael-gf-style .un-form` (et fallback `.un-form_wrapper`)
 * + !important sur règles critiques pour battre le widget Elementor UAEL.
 */

/* ════════════════════════════════════════════════════════════════
   Variables CSS — Charte UN (haute spé pour override UAEL)
   ════════════════════════════════════════════════════════════════ */
.uael-gf-style .un-form,
.un-form_wrapper.gform_wrapper {
    --un-green:        #2C5F2D;
    --un-green-l:      #5b9f44;
    --un-green-bg:     #eaf5e3;
    --un-dark:         #1a1a1a;
    --un-red:          #dc2626;
    --un-orange:       #f59e0b;
    --un-border:       #d1d5db;
    --un-border-strong:#1a1a1a;
    --un-bg:           #fafafa;
    --un-text:         #1a1a1a;
    --un-text-muted:   #6b7280;
    --un-radius:       6px;
    --un-radius-lg:    10px;
    --un-shadow-focus: 0 0 0 3px rgba(91,159,68,0.25);
}

/* Override les variables Gravity Forms theme orbital — ciblé par CLASSE (pas ID, qui peut changer au réimport) */
.un-form_wrapper.gform_wrapper,
.uael-gf-style .un-form_wrapper {
    --gf-color-primary:           #2C5F2D !important;
    --gf-color-primary-rgb:       44, 95, 45 !important;
    --gf-color-primary-darker:    #1f4a20 !important;
    --gf-color-primary-lighter:   #5b9f44 !important;
    --gf-color-secondary-contrast: #1a1a1a !important;
    --gf-color-out-ctrl-dark:     #1a1a1a !important;
    --gf-color-out-ctrl-dark-darker: #1a1a1a !important;
    --gf-color-in-ctrl-primary:   #2C5F2D !important;
    --gf-color-in-ctrl-primary-darker: #1f4a20 !important;
    --gf-color-in-ctrl-primary-lighter: #5b9f44 !important;
    --gf-radius:                  6px !important;
    --gf-ctrl-border-color:       #1a1a1a !important;
    --gf-ctrl-label-color-primary: #1a1a1a !important;
    --gf-ctrl-label-color-secondary: #1a1a1a !important;
}

/* ════════════════════════════════════════════════════════════════
   1. Conteneur form — typo
   ════════════════════════════════════════════════════════════════ */
.uael-gf-style .un-form_wrapper.gform_wrapper,
.un-form_wrapper.gform_wrapper {
    max-width: 760px !important;
    margin: 0 auto !important;
    font-family: 'Syne', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif !important;
    color: #1a1a1a !important;
}

.uael-gf-style #gform_fields_6,
#gform_fields_6 {
    gap: 0 !important;
}

/* ════════════════════════════════════════════════════════════════
   2. SECTION BREAKS — Cards visuelles
   ════════════════════════════════════════════════════════════════ */
.uael-gf-style .un-form .gfield--type-section,
.un-form_wrapper .gfield--type-section {
    background: #fff !important;
    border: 1px solid #1a1a1a !important;
    border-radius: 8px !important;
    padding: 14px 18px 8px !important;
    margin: 18px 0 0 !important;
    box-shadow: 2px 2px 0 #1a1a1a !important;
}

.uael-gf-style .un-form .gfield--type-section .gsection_title,
.uael-gf-style .un-form .gfield--type-section legend,
.un-form_wrapper .gfield--type-section .gsection_title,
.un-form_wrapper .gfield--type-section legend {
    font-family: 'Syne', sans-serif !important;
    font-size: 14px !important;
    font-weight: 700 !important;
    text-transform: none !important;
    letter-spacing: 0 !important;
    color: #2C5F2D !important;
    margin: 0 0 2px !important;
    border: none !important;
    padding: 0 !important;
}

.uael-gf-style .un-form .gfield--type-section .gsection_description,
.un-form_wrapper .gfield--type-section .gsection_description {
    font-size: 12px !important;
    color: #6b7280 !important;
    margin: 0 !important;
    font-weight: 400 !important;
    line-height: 1.45 !important;
}

.uael-gf-style .un-form .gfield--type-section + .gfield,
.un-form_wrapper .gfield--type-section + .gfield {
    margin-top: 12px !important;
}

/* ════════════════════════════════════════════════════════════════
   3. LABELS — typo Syne
   ════════════════════════════════════════════════════════════════ */
.uael-gf-style .un-form .gfield_label,
.uael-gf-style .un-form .gform-field-label,
.un-form_wrapper .gfield_label,
.un-form_wrapper .gform-field-label {
    font-family: 'Syne', sans-serif !important;
    font-size: 13.5px !important;
    font-weight: 700 !important;
    color: #1a1a1a !important;
    margin-bottom: 6px !important;
    display: block !important;
}

.uael-gf-style .un-form .gform-field-label--type-sub,
.un-form_wrapper .gform-field-label--type-sub {
    font-size: 11px !important;
    font-weight: 600 !important;
    color: #6b7280 !important;
    text-transform: uppercase !important;
    letter-spacing: 0.5px !important;
    margin-top: 0 !important;
    margin-bottom: 4px !important;
}

/* ════════════════════════════════════════════════════════════════
   4. (Nécessaire) → astérisque rouge (CSS only)
   ════════════════════════════════════════════════════════════════ */
.uael-gf-style .un-form .gfield_required_text,
.un-form_wrapper .gfield_required_text {
    display: none !important;
    visibility: hidden !important;
    width: 0 !important;
    height: 0 !important;
    overflow: hidden !important;
    font-size: 0 !important;
}
.uael-gf-style .un-form .gfield_required,
.un-form_wrapper .gfield_required {
    margin-left: 4px !important;
    font-size: 0 !important; /* hide any text content */
}
.uael-gf-style .un-form .gfield_required::after,
.un-form_wrapper .gfield_required::after {
    content: '*' !important;
    color: #dc2626 !important;
    font-size: 18px !important;
    font-weight: 800 !important;
    line-height: 1 !important;
    display: inline-block !important;
    margin-left: 2px !important;
}

/* ════════════════════════════════════════════════════════════════
   5. INPUTS, TEXTAREAS, SELECTS
   ════════════════════════════════════════════════════════════════ */
.uael-gf-style .un-form input[type="text"],
.uael-gf-style .un-form input[type="email"],
.uael-gf-style .un-form input[type="tel"],
.uael-gf-style .un-form input[type="number"],
.uael-gf-style .un-form input[type="url"],
.uael-gf-style .un-form textarea,
.uael-gf-style .un-form select,
.un-form_wrapper input[type="text"],
.un-form_wrapper input[type="email"],
.un-form_wrapper input[type="tel"],
.un-form_wrapper input[type="number"],
.un-form_wrapper input[type="url"],
.un-form_wrapper textarea,
.un-form_wrapper select {
    width: 100% !important;
    padding: 9px 12px !important;
    font-size: 14px !important;
    font-family: 'Syne', sans-serif !important;
    color: #1a1a1a !important;
    background: #fff !important;
    border: 1px solid #1a1a1a !important;
    border-radius: 5px !important;
    transition: border-color .15s, box-shadow .15s !important;
    line-height: 1.4 !important;
    box-shadow: none !important;
    height: auto !important;
    min-height: 38px !important;
}

.uael-gf-style .un-form input::placeholder,
.uael-gf-style .un-form textarea::placeholder,
.un-form_wrapper input::placeholder,
.un-form_wrapper textarea::placeholder {
    color: #9ca3af !important;
    font-weight: 400 !important;
}

.uael-gf-style .un-form input:focus,
.uael-gf-style .un-form textarea:focus,
.uael-gf-style .un-form select:focus,
.un-form_wrapper input:focus,
.un-form_wrapper textarea:focus,
.un-form_wrapper select:focus {
    outline: none !important;
    border-color: #2C5F2D !important;
    box-shadow: 0 0 0 2px rgba(91,159,68,0.22) !important;
}

.uael-gf-style .un-form textarea,
.un-form_wrapper textarea {
    resize: vertical !important;
    min-height: 110px !important;
}

/* SELECT — chevron custom */
.uael-gf-style .un-form select,
.uael-gf-style .un-form .uael-gf-select-custom select,
.un-form_wrapper select,
.un-form_wrapper .uael-gf-select-custom select {
    appearance: none !important;
    -webkit-appearance: none !important;
    -moz-appearance: none !important;
    background-image: url("data:image/svg+xml,%3Csvg width='12' height='8' viewBox='0 0 12 8' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M1 1.5L6 6.5L11 1.5' stroke='%231a1a1a' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") !important;
    background-repeat: no-repeat !important;
    background-position: right 14px center !important;
    padding-right: 38px !important;
    cursor: pointer !important;
}
.uael-gf-style .un-form .uael-gf-select-custom,
.un-form_wrapper .uael-gf-select-custom {
    width: 100% !important;
    display: block !important;
}
.uael-gf-style .un-form .uael-gf-select-custom::after,
.un-form_wrapper .uael-gf-select-custom::after {
    display: none !important;
}

/* ════════════════════════════════════════════════════════════════
   6. RADIOS — Style "pill"
   ════════════════════════════════════════════════════════════════ */
.uael-gf-style .un-form .gfield_radio,
.un-form_wrapper .gfield_radio {
    display: flex !important;
    flex-wrap: wrap !important;
    gap: 8px !important;
}
.uael-gf-style .un-form .gchoice,
.un-form_wrapper .gchoice {
    flex: 1 1 auto !important;
    min-width: 140px !important;
    margin: 0 !important;
}
.uael-gf-style .un-form .gchoice input[type="radio"],
.un-form_wrapper .gchoice input[type="radio"] {
    position: absolute !important;
    opacity: 0 !important;
    pointer-events: none !important;
    width: 0 !important;
    height: 0 !important;
}
.uael-gf-style .un-form .gchoice label,
.un-form_wrapper .gchoice label {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 6px !important;
    padding: 10px 14px !important;
    background: #fff !important;
    border: 1px solid #1a1a1a !important;
    border-radius: 5px !important;
    cursor: pointer !important;
    font-weight: 600 !important;
    font-size: 13px !important;
    text-align: center !important;
    transition: all .15s !important;
    margin: 0 !important;
    line-height: 1.3 !important;
    color: #1a1a1a !important;
}
.uael-gf-style .un-form .gchoice label:hover,
.un-form_wrapper .gchoice label:hover {
    background: #fafafa !important;
    border-color: #2C5F2D !important;
}
.uael-gf-style .un-form .gchoice input[type="radio"]:checked + label,
.un-form_wrapper .gchoice input[type="radio"]:checked + label {
    background: #eaf5e3 !important;
    border-color: #2C5F2D !important;
    color: #2C5F2D !important;
    font-weight: 700 !important;
}
.uael-gf-style .un-form .gchoice input[type="radio"]:checked + label::before,
.un-form_wrapper .gchoice input[type="radio"]:checked + label::before {
    content: '✓' !important;
    color: #2C5F2D !important;
    font-weight: 900 !important;
    font-size: 15px !important;
    margin-right: 4px !important;
}

/* ════════════════════════════════════════════════════════════════
   7. CONSENTEMENT (checkbox)
   ════════════════════════════════════════════════════════════════ */
.uael-gf-style .un-form .gfield--type-consent,
.un-form_wrapper .gfield--type-consent {
    margin-top: 18px !important;
}
.uael-gf-style .un-form .ginput_container_consent,
.un-form_wrapper .ginput_container_consent {
    display: flex !important;
    align-items: flex-start !important;
    gap: 10px !important;
    background: #fafafa !important;
    padding: 14px 16px !important;
    border-radius: 6px !important;
    border: 1px solid #d1d5db !important;
}
.uael-gf-style .un-form .ginput_container_consent input[type="checkbox"],
.un-form_wrapper .ginput_container_consent input[type="checkbox"] {
    width: 20px !important;
    height: 20px !important;
    accent-color: #2C5F2D !important;
    margin: 0 !important;
    flex-shrink: 0 !important;
    margin-top: 1px !important;
    cursor: pointer !important;
}
.uael-gf-style .un-form .ginput_container_consent label,
.un-form_wrapper .ginput_container_consent label {
    font-size: 13px !important;
    line-height: 1.5 !important;
    color: #6b7280 !important;
    margin: 0 !important;
    cursor: pointer !important;
    font-weight: 400 !important;
}
.uael-gf-style .un-form .ginput_container_consent label a,
.un-form_wrapper .ginput_container_consent label a {
    color: #2C5F2D !important;
    text-decoration: underline !important;
    font-weight: 600 !important;
}
.uael-gf-style .un-form .gfield--type-consent legend,
.un-form_wrapper .gfield--type-consent legend {
    display: none !important;
}

/* ════════════════════════════════════════════════════════════════
   8. DESCRIPTIONS / HELPER TEXTS
   ════════════════════════════════════════════════════════════════ */
.uael-gf-style .un-form .gfield_description,
.un-form_wrapper .gfield_description {
    font-size: 12.5px !important;
    color: #6b7280 !important;
    font-style: italic !important;
    margin-top: 6px !important;
    line-height: 1.4 !important;
}
.uael-gf-style .un-form .gfield_description.instruction,
.un-form_wrapper .gfield_description.instruction {
    font-size: 11px !important;
    font-style: normal !important;
    opacity: 0.7 !important;
}

/* ════════════════════════════════════════════════════════════════
   9. GRID (prénom+nom / ville+CP)
   ════════════════════════════════════════════════════════════════ */
.uael-gf-style .un-form .gform-grid-row,
.un-form_wrapper .gform-grid-row {
    display: grid !important;
    grid-template-columns: 1fr 1fr !important;
    gap: 14px !important;
}
.uael-gf-style .un-form .gform-grid-col,
.un-form_wrapper .gform-grid-col {
    width: auto !important;
}
.uael-gf-style .un-form .gform-grid-col.ginput_full,
.uael-gf-style .un-form .gform-grid-col.address_line_1,
.un-form_wrapper .gform-grid-col.ginput_full,
.un-form_wrapper .gform-grid-col.address_line_1 {
    grid-column: 1 / -1 !important;
}

/* ════════════════════════════════════════════════════════════════
   10. ESPACEMENT GLOBAL
   ════════════════════════════════════════════════════════════════ */
.uael-gf-style .un-form .gfield,
.un-form_wrapper .gfield {
    margin-bottom: 12px !important;
}
.uael-gf-style .un-form .gfield--type-section,
.un-form_wrapper .gfield--type-section {
    margin-bottom: 0 !important;
}

/* Cacher labels redondants des fields name + address */
.uael-gf-style .un-form .gfield--type-name > .gfield_label,
.uael-gf-style .un-form .gfield--type-address > .gfield_label,
.un-form_wrapper .gfield--type-name > .gfield_label,
.un-form_wrapper .gfield--type-address > .gfield_label {
    display: none !important;
}

/* ════════════════════════════════════════════════════════════════
   11. BOUTON SUBMIT — Full width vert UN avec shadow décalée
   ════════════════════════════════════════════════════════════════ */
.uael-gf-style .un-form .gform_footer,
.un-form_wrapper .gform_footer {
    margin-top: 18px !important;
    padding: 0 !important;
}
.uael-gf-style .un-form .gform_button,
.uael-gf-style .un-form input[type="submit"].gform_button,
.un-form_wrapper .gform_button,
.un-form_wrapper input[type="submit"].gform_button {
    width: 100% !important;
    background: #2C5F2D !important;
    background-color: #2C5F2D !important;
    color: #fff !important;
    border: 1px solid #1a1a1a !important;
    border-radius: 5px !important;
    padding: 14px 20px !important;
    font-family: 'Syne', sans-serif !important;
    font-size: 15px !important;
    font-weight: 700 !important;
    text-transform: uppercase !important;
    letter-spacing: 0.6px !important;
    cursor: pointer !important;
    transition: all .15s !important;
    box-shadow: 2px 2px 0 #1a1a1a !important;
    line-height: 1.2 !important;
    height: auto !important;
    min-height: 48px !important;
}
.uael-gf-style .un-form .gform_button:hover,
.un-form_wrapper .gform_button:hover {
    background: #1f4a20 !important;
    transform: translate(-1px, -1px) !important;
    box-shadow: 3px 3px 0 #1a1a1a !important;
}
.uael-gf-style .un-form .gform_button:active,
.un-form_wrapper .gform_button:active {
    transform: translate(1px, 1px) !important;
    box-shadow: 0 0 0 #1a1a1a !important;
}

/* ════════════════════════════════════════════════════════════════
   12. ÉTATS D'ERREUR
   ════════════════════════════════════════════════════════════════ */
.uael-gf-style .un-form .gfield_error input,
.uael-gf-style .un-form .gfield_error textarea,
.uael-gf-style .un-form .gfield_error select,
.un-form_wrapper .gfield_error input,
.un-form_wrapper .gfield_error textarea,
.un-form_wrapper .gfield_error select {
    border-color: #dc2626 !important;
    background: #fef2f2 !important;
}
.uael-gf-style .un-form .gfield_validation_message,
.uael-gf-style .un-form .validation_message,
.un-form_wrapper .gfield_validation_message,
.un-form_wrapper .validation_message {
    color: #dc2626 !important;
    font-size: 12.5px !important;
    font-weight: 600 !important;
    margin-top: 6px !important;
}
.uael-gf-style .un-form .gform_validation_errors,
.un-form_wrapper .gform_validation_errors {
    background: #fef2f2 !important;
    border: 2px solid #dc2626 !important;
    border-radius: 6px !important;
    padding: 14px 18px !important;
    margin-bottom: 24px !important;
    color: #dc2626 !important;
}

/* ════════════════════════════════════════════════════════════════
   13. CONFIRMATION
   ════════════════════════════════════════════════════════════════ */
.un-form_wrapper .gform_confirmation_message,
.uael-gf-style .gform_confirmation_message {
    background: #eaf5e3 !important;
    border: 1px solid #2C5F2D !important;
    border-radius: 8px !important;
    padding: 22px 26px !important;
    color: #2C5F2D !important;
    font-size: 15px !important;
    font-weight: 600 !important;
    text-align: center !important;
    box-shadow: 2px 2px 0 #1a1a1a !important;
}

/* ════════════════════════════════════════════════════════════════
   14. RESPONSIVE — < 640px
   ════════════════════════════════════════════════════════════════ */
@media (max-width: 640px) {
    .uael-gf-style .un-form .gform-grid-row,
    .un-form_wrapper .gform-grid-row {
        grid-template-columns: 1fr !important;
        gap: 12px !important;
    }
    .uael-gf-style .un-form .gfield_radio,
    .un-form_wrapper .gfield_radio {
        flex-direction: column !important;
    }
    .uael-gf-style .un-form .gchoice,
    .un-form_wrapper .gchoice {
        min-width: 0 !important;
    }
    .uael-gf-style .un-form .gchoice label,
    .un-form_wrapper .gchoice label {
        padding: 14px 16px !important;
    }
    .uael-gf-style .un-form .gfield--type-section,
    .un-form_wrapper .gfield--type-section {
        padding: 18px 16px 4px !important;
    }
    .uael-gf-style .un-form .gform_button,
    .un-form_wrapper .gform_button {
        padding: 16px 20px !important;
        font-size: 14px !important;
    }
}
