/* ============================================================
   MD FORM — champs "Material Design" (label flottant + icône)
   Style partagé (page Contact & wizard de sourcing).
   Accent orange AEZ.
   ============================================================ */
:root {
    --md-primary:      #FF5630;
    --md-primary-dark: #E8491C;
    --md-surface:      #ffffff;
    --md-bg:           #F8FAFC;
    --md-border:       #CBD5E1;
    --md-text:         #0F172A;
    --md-muted:        #64748B;
    --md-error:        #DC2626;
    --md-radius:       10px;
    --md-transition:   all 0.22s cubic-bezier(0.4, 0, 0.2, 1);
}

/* ── Champ ── */
.md-field {
    position: relative;
    margin-bottom: 1.5rem;
}
.md-field .md-input,
.md-field .md-textarea {
    width: 100%;
    padding: 1rem 1rem 1rem 3rem;
    font-size: 0.95rem;
    font-family: inherit;
    color: var(--md-text);
    background: var(--md-surface);
    border: 1.5px solid var(--md-border);
    border-radius: var(--md-radius);
    outline: none;
    transition: var(--md-transition);
    appearance: none;
    line-height: 1.5;
}
.md-field .md-textarea {
    resize: vertical;
    min-height: 130px;
}
.md-field.no-icon .md-input,
.md-field.no-icon .md-textarea { padding-left: 1rem; }
.md-field .md-input:focus,
.md-field .md-textarea:focus {
    border-color: var(--md-primary);
    box-shadow: 0 0 0 3.5px rgba(255, 86, 48, 0.13);
}
.md-field.has-error .md-input,
.md-field.has-error .md-textarea,
.md-field.has-error .select2-selection--single {
    border-color: var(--md-error) !important;
}

/* ── Icône ──
   Ancrée sur le centre de l'INPUT (≈1.8rem depuis le haut), pas sur le centre
   du champ : sinon un texte d'aide (.szw-help) allonge le champ et pousse
   l'icône vers le bas. */
.md-icon {
    position: absolute;
    left: 1rem;
    top: 1.8rem;
    transform: translateY(-50%);
    color: var(--md-muted);
    font-size: 0.9rem;
    transition: var(--md-transition);
    pointer-events: none;
    z-index: 2;
}
.md-icon-area {
    position: absolute;
    left: 1rem;
    top: 1.05rem;
    color: var(--md-muted);
    font-size: 0.9rem;
    pointer-events: none;
    z-index: 2;
}
.md-field:focus-within .md-icon,
.md-field:focus-within .md-icon-area { color: var(--md-primary); }

/* ── Label flottant ── */
.md-label {
    position: absolute;
    left: 3rem;
    top: 1.8rem;
    transform: translateY(-50%);
    font-size: 0.93rem;
    color: var(--md-muted);
    pointer-events: none;
    transition: var(--md-transition);
    background: var(--md-surface);
    padding: 0 5px;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    max-width: calc(100% - 4rem);
}
.md-field.no-icon .md-label { left: 1rem; }
.md-field .md-input:focus ~ .md-label,
.md-field .md-input:not(:placeholder-shown) ~ .md-label {
    top: 0;
    font-size: 0.72rem;
    font-weight: 600;
    color: var(--md-primary);
    letter-spacing: 0.02em;
    max-width: 90%;
}

/* Label textarea */
.md-label-area {
    position: absolute;
    left: 3rem;
    top: 1.05rem;
    font-size: 0.93rem;
    color: var(--md-muted);
    pointer-events: none;
    transition: var(--md-transition);
    background: var(--md-surface);
    padding: 0 5px;
}
.md-field.no-icon .md-label-area { left: 1rem; }
.md-field .md-textarea:focus ~ .md-label-area,
.md-field .md-textarea:not(:placeholder-shown) ~ .md-label-area {
    top: 0;
    transform: translateY(-50%);
    font-size: 0.72rem;
    font-weight: 600;
    color: var(--md-primary);
}

/* Label fixe (selects & dates) */
.md-label-top {
    position: absolute;
    top: 0;
    transform: translateY(-50%);
    left: 3rem;
    font-size: 0.72rem;
    font-weight: 600;
    color: var(--md-primary);
    background: var(--md-surface);
    padding: 0 5px;
    pointer-events: none;
    z-index: 2;
    white-space: nowrap;
}
.md-field.no-icon .md-label-top { left: 1rem; }

/* ── Select2 ── */
.md-field .select2-container { display: block !important; width: 100% !important; }
.select2-container--default .select2-selection--single {
    height: auto !important;
    border: 1.5px solid var(--md-border);
    border-radius: var(--md-radius);
    background: var(--md-surface);
    transition: border-color 0.2s, box-shadow 0.2s;
    position: relative;
}
.select2-container--default .select2-selection--single .select2-selection__rendered {
    padding: 1rem 2.5rem 1rem 3rem;
    line-height: 1.5;
    font-size: 0.95rem;
    font-family: inherit;
    color: var(--md-text);
    display: block;
}
.select2-container--default .select2-selection--single .select2-selection__placeholder { color: var(--md-muted); }
.select2-container--default .select2-selection--single .select2-selection__arrow {
    position: absolute; top: 0; bottom: 0; right: 10px;
    width: 20px; height: auto;
    display: flex; align-items: center; justify-content: center;
}
.select2-container--default .select2-selection--single .select2-selection__arrow b {
    border-color: #94A3B8 transparent transparent transparent;
    border-width: 5px 4px 0 4px; margin: 0;
}
.select2-container--default.select2-container--open .select2-selection--single .select2-selection__arrow b {
    border-color: var(--md-primary) transparent transparent transparent;
}
.select2-container--default.select2-container--open .select2-selection--single,
.select2-container--default.select2-container--focus .select2-selection--single {
    border-color: var(--md-primary);
    box-shadow: 0 0 0 3.5px rgba(255, 86, 48, 0.13);
    outline: none;
}
.select2-dropdown {
    border: 1.5px solid var(--md-border);
    border-radius: 10px;
    box-shadow: 0 8px 32px rgba(0, 0, 0, 0.13);
    font-family: inherit;
    overflow: hidden;
}
.select2-container--default .select2-results__option { padding: 0.65rem 1rem; font-size: 0.93rem; color: var(--md-text); }
.select2-container--default .select2-results__option--highlighted.select2-results__option--selectable { background-color: var(--md-primary); color: #fff; }
.select2-container--default .select2-results__option--selected { background-color: rgba(255, 86, 48, 0.08); color: var(--md-primary); font-weight: 600; }
.select2-search--dropdown { padding: 8px 8px 4px; }
.select2-search--dropdown .select2-search__field {
    border: 1.5px solid var(--md-border);
    border-radius: 8px;
    padding: 0.45rem 0.75rem;
    font-family: inherit; font-size: 0.9rem;
    outline: none; width: 100%; box-sizing: border-box;
}
.select2-search--dropdown .select2-search__field:focus {
    border-color: var(--md-primary);
    box-shadow: 0 0 0 3px rgba(255, 86, 48, 0.11);
}

/* ── Erreurs & aide ── */
.md-error-msg { color: var(--md-error); font-size: 0.78rem; margin-top: 0.3rem; display: block; }

/* ── Option pays avec drapeau ── */
.szw-flag-opt { display: inline-flex; align-items: center; gap: 9px; }
.szw-flag { width: 22px; height: 16px; object-fit: cover; border-radius: 3px; box-shadow: 0 0 0 1px rgba(0, 0, 0, 0.08); flex-shrink: 0; }
.szw-flag-globe { color: var(--md-primary); width: 22px; text-align: center; flex-shrink: 0; }
