/* Espace licencié — remplir un formulaire (remarque n° 230, js/appli-formulaires.js). Préfixe afo-.
   Couleurs de la charte seulement : Klein #001CA8, Midnight #191970, noir #120D16, White Smoke #F5F5F5, Cranberry #950714,
   rouge #F32837, blanc — et leurs transparences. Variables du thème commun (--app-*) quand elles existent ; mode sombre :
   html.app-sombre ou html[data-theme="sombre"]. Téléphone d'abord : plein écran, cibles de 48 px, champs à 16 px (pas de zoom
   sur iPhone) ; ordinateur : fenêtre centrée. prefers-reduced-motion respecté. */
.afo-feuille,.afo-zone{--afo-klein:#001CA8;--afo-minuit:#191970;--afo-cranberry:#950714;--afo-rouge:#F32837;
  --afo-surface:var(--app-surface,#fff);--afo-surface-2:var(--app-surface-2,#F5F5F5);--afo-texte:var(--app-texte,#120D16);--afo-doux:var(--app-texte-doux,rgba(18,13,22,.68));
  --afo-titre:var(--app-titre,#191970);--afo-accent:var(--app-accent,#001CA8);--afo-trait:var(--app-trait,rgba(18,13,22,.16));--afo-voile:rgba(0,28,168,.07);--afo-erreur:#950714;
  --afo-disp:var(--app-police-titre,var(--police-display,Montserrat,system-ui,sans-serif));--afo-txt:var(--app-police-texte,Cabin,system-ui,sans-serif)}
html.app-sombre .afo-feuille,html.app-sombre .afo-zone,html[data-theme="sombre"] .afo-feuille,html[data-theme="sombre"] .afo-zone{
  --afo-surface:var(--app-surface,#1C1830);--afo-surface-2:var(--app-surface-2,#262140);--afo-texte:var(--app-texte,#F5F5F5);--afo-doux:var(--app-texte-doux,rgba(245,245,245,.74));
  --afo-titre:var(--app-titre,#fff);--afo-accent:var(--app-accent,#fff);--afo-trait:var(--app-trait,rgba(255,255,255,.2));--afo-voile:rgba(255,255,255,.08);--afo-erreur:#F32837}
html.afo-sans-defilement,html.afo-sans-defilement body{overflow:hidden}
.afo-feuille *,.afo-zone *{box-sizing:border-box}
.afo-ico{width:1.15em;height:1.15em;flex:none;vertical-align:-.2em}
.afo-cache{position:absolute!important;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}

/* ── La fenêtre ── (animations sans transparence : un onglet en arrière-plan qui les fige garde une fenêtre lisible) */
.afo-feuille{position:fixed;inset:0;z-index:2147483000;display:flex;align-items:stretch;justify-content:center;background:rgba(18,13,22,.55);animation:afo-fondu .2s ease-out}
.afo-cadre{display:flex;flex-direction:column;width:100%;height:100%;background:var(--afo-surface);color:var(--afo-texte);animation:afo-monte .28s cubic-bezier(.2,.8,.2,1)}
@media (min-width:760px){.afo-feuille{align-items:center;padding:2rem}.afo-cadre{max-width:44rem;height:auto;max-height:calc(100vh - 4rem);border-radius:24px;box-shadow:0 30px 80px -20px rgba(18,13,22,.55)}}
.afo-barre{display:flex;align-items:center;justify-content:space-between;gap:.6rem;padding:calc(.55rem + env(safe-area-inset-top,0px)) .7rem .55rem 1.1rem;border-bottom:1px solid var(--afo-trait);flex:none}
.afo-barre-titre{display:inline-flex;gap:.45rem;align-items:center;font:800 .78rem/1.2 var(--afo-disp);letter-spacing:.08em;text-transform:uppercase;color:var(--afo-accent)}
.afo-fermer{display:grid;place-items:center;width:48px;height:48px;border:0;border-radius:50%;background:transparent;color:var(--afo-texte);cursor:pointer;font-size:1.25rem}
.afo-fermer:hover{background:var(--afo-voile)}
.afo-fermer:focus-visible{outline:3px solid rgba(0,28,168,.5);outline-offset:1px}
.afo-defile{flex:1;overflow-y:auto;-webkit-overflow-scrolling:touch;overscroll-behavior:contain;outline:0}
.afo-feuille .afo-zone{padding:1.2rem 1.15rem calc(1.6rem + env(safe-area-inset-bottom,0px));max-width:40rem;margin:0 auto}
@keyframes afo-fondu{from{background-color:rgba(18,13,22,0)}to{background-color:rgba(18,13,22,.55)}}
@keyframes afo-monte{from{transform:translateY(24px)}to{transform:none}}
@media (prefers-reduced-motion:reduce){.afo-feuille,.afo-cadre,.afo-merci-rond{animation:none!important}}

/* ── En-tête du formulaire ── */
.afo-zone{font-family:var(--afo-txt);color:var(--afo-texte);line-height:1.5}
.afo-tete{margin:0 0 1.1rem}
.afo-sur{display:inline-flex;gap:.35rem;align-items:center;font:800 .7rem/1.2 var(--afo-disp);letter-spacing:.08em;text-transform:uppercase;color:var(--afo-accent)}
.afo-titre{margin:.35rem 0 .5rem;font:800 1.45rem/1.2 var(--afo-disp);color:var(--afo-titre);outline:0}
.afo-texte{color:var(--afo-texte)}.afo-texte p{margin:0 0 .6rem}
.afo-infos{display:flex;flex-wrap:wrap;gap:.4rem .9rem;margin:.6rem 0 0;padding:0;list-style:none;font:700 .8rem/1.3 var(--afo-disp);color:var(--afo-doux)}
.afo-infos li{display:inline-flex;gap:.3rem;align-items:center}
.afo-legende{margin:0 0 1rem;font-size:.85rem;color:var(--afo-doux)}
.afo-obl{color:var(--afo-erreur);font-weight:800}

/* ── Questions ── */
.afo-form{display:grid;gap:1.15rem}
.afo-q{margin:0;padding:0;border:0;min-width:0;display:grid;gap:.4rem}
.afo-lib{display:block;padding:0;font:800 1rem/1.35 var(--afo-disp);color:var(--afo-titre)}
.afo-aide{margin:-.15rem 0 0;font-size:.88rem;color:var(--afo-doux)}
.afo-q input[type=text],.afo-q input[type=email],.afo-q input[type=tel],.afo-q input[type=date],.afo-q textarea,.afo-q select{width:100%;min-height:48px;padding:.7rem .85rem;border-radius:14px;border:1.5px solid var(--afo-trait);
  background:var(--afo-surface);color:var(--afo-texte);font:400 16px/1.4 var(--afo-txt);transition:border-color .15s,box-shadow .15s;-webkit-appearance:none;appearance:none}
.afo-q textarea{min-height:8rem;resize:vertical}
.afo-q input:focus,.afo-q textarea:focus,.afo-q select:focus{outline:0;border-color:var(--afo-klein);box-shadow:0 0 0 3px rgba(0,28,168,.2)}
html.app-sombre .afo-q input:focus,html[data-theme="sombre"] .afo-q input:focus{border-color:#fff}
.afo-select{position:relative}.afo-select::after{content:"";position:absolute;right:1rem;top:50%;width:.55rem;height:.55rem;border-right:2px solid currentColor;border-bottom:2px solid currentColor;transform:translateY(-70%) rotate(45deg);pointer-events:none;color:var(--afo-doux)}
.afo-select select{padding-right:2.4rem}
.afo-nombre{max-width:14rem}
.afo-compte{justify-self:end;font-size:.78rem;color:var(--afo-doux)}
.afo-opts{display:grid;gap:.45rem}
.afo-opts-oui-non{grid-template-columns:repeat(2,minmax(0,8.5rem))}
.afo-opt{position:relative;display:flex;gap:.7rem;align-items:center;min-height:48px;padding:.55rem .85rem;border-radius:14px;border:1.5px solid var(--afo-trait);background:var(--afo-surface);cursor:pointer;transition:border-color .15s,background .15s}
.afo-opt input{position:absolute;opacity:0;width:1px;height:1px}
.afo-opt-marque{flex:none;width:1.3rem;height:1.3rem;border:2px solid var(--afo-doux);border-radius:50%;display:grid;place-items:center;transition:border-color .15s,background .15s}
.afo-q-choix_multiple .afo-opt-marque{border-radius:6px}
.afo-opt input:checked+.afo-opt-marque{border-color:var(--afo-klein);background:var(--afo-klein)}
.afo-opt input:checked+.afo-opt-marque::after{content:"";width:.45rem;height:.45rem;border-radius:50%;background:#fff}
.afo-q-choix_multiple .afo-opt input:checked+.afo-opt-marque::after{width:.35rem;height:.65rem;border-radius:0;background:none;border:solid #fff;border-width:0 2.5px 2.5px 0;transform:translateY(-1px) rotate(45deg)}
.afo-opt:has(input:checked){border-color:var(--afo-klein);background:var(--afo-voile)}
.afo-opt:has(input:focus-visible){box-shadow:0 0 0 3px rgba(0,28,168,.3)}
.afo-opt input:focus-visible+.afo-opt-marque{outline:3px solid rgba(0,28,168,.45);outline-offset:2px}
.afo-opt-lib{font-size:1rem}
.afo-fichier{display:flex;flex-wrap:wrap;gap:.6rem;align-items:center}
.afo-fichier-input{position:absolute;opacity:0;width:1px;height:1px}
.afo-fichier-bouton{display:inline-flex;gap:.45rem;align-items:center;min-height:48px;padding:.6rem 1.1rem;border-radius:999px;border:1.5px solid var(--afo-accent);color:var(--afo-accent);font:800 .9rem/1.2 var(--afo-disp);cursor:pointer}
.afo-fichier-input:focus-visible+.afo-fichier-bouton{outline:3px solid rgba(0,28,168,.45);outline-offset:2px}
.afo-fichier-nom{font-size:.9rem;color:var(--afo-doux);overflow-wrap:anywhere}
.afo-indispo{display:flex;gap:.55rem;align-items:flex-start;margin:0;padding:.75rem .9rem;border-radius:14px;background:var(--afo-surface-2);font-size:.9rem}
.afo-err{margin:0;display:flex;gap:.4rem;align-items:flex-start;color:var(--afo-erreur);font-weight:700;font-size:.9rem}
.afo-err:empty{display:none}
.afo-q.est-erreur input,.afo-q.est-erreur textarea,.afo-q.est-erreur select,.afo-q.est-erreur .afo-opt{border-color:var(--afo-erreur)}
.afo-piege{position:absolute!important;left:-9999px;width:1px;height:1px;overflow:hidden}
.afo-vide{padding:1.4rem;border-radius:16px;border:1.5px dashed var(--afo-trait);text-align:center;color:var(--afo-doux)}

/* ── Récapitulatif des erreurs, pied, états ── */
.afo-resume{padding:.85rem 1rem;border-radius:14px;border:2px solid var(--afo-erreur);background:rgba(149,7,20,.06);outline:0}
.afo-resume p{margin:0 0 .35rem;color:var(--afo-erreur)}
.afo-resume ul{margin:0;padding-left:1.1rem}.afo-resume a{color:var(--afo-texte);font-weight:600}
.afo-pied{display:flex;flex-wrap:wrap;gap:.6rem;align-items:center;margin-top:.4rem}
.afo-envoyer,.afo-secondaire{display:inline-flex;gap:.45rem;align-items:center;justify-content:center;min-height:50px;padding:.7rem 1.4rem;border-radius:999px;font:800 .95rem/1.2 var(--afo-disp);cursor:pointer;transition:transform .2s cubic-bezier(.34,1.56,.64,1),background .2s}
.afo-envoyer{border:0;background:var(--afo-klein);color:#fff;box-shadow:0 10px 24px -10px rgba(0,28,168,.6)}
.afo-envoyer:hover{background:var(--afo-minuit)}
.afo-envoyer:disabled{opacity:.6;cursor:progress}
.afo-secondaire{border:1.5px solid var(--afo-trait);background:transparent;color:var(--afo-texte)}
.afo-envoyer:active,.afo-secondaire:active{transform:scale(.97)}
.afo-envoyer:focus-visible,.afo-secondaire:focus-visible{outline:3px solid rgba(0,28,168,.45);outline-offset:2px}
@media (max-width:520px){.afo-pied .afo-envoyer{flex:1 1 100%}}
.afo-statut{flex:1 1 100%;margin:0;font-size:.9rem;color:var(--afo-doux)}
.afo-statut:empty{display:none}
.afo-etat{display:flex;gap:.7rem;align-items:flex-start;padding:1rem 1.1rem;border-radius:16px;background:var(--afo-surface-2)}
.afo-etat p{margin:0}
.afo-charge{display:flex;gap:.7rem;align-items:center;padding:2rem 0;color:var(--afo-doux)}
.afo-roue{width:1.4rem;height:1.4rem;border-radius:50%;border:3px solid var(--afo-trait);border-top-color:var(--afo-klein);animation:afo-tourne .8s linear infinite}
@keyframes afo-tourne{to{transform:rotate(360deg)}}

/* ── Ma réponse, confirmation ── */
.afo-ma{padding:1rem 1.1rem;border-radius:18px;background:var(--afo-surface-2)}
.afo-ma-titre{display:flex;gap:.45rem;align-items:center;margin:0 0 .2rem;font:800 1.05rem/1.3 var(--afo-disp);color:var(--afo-titre)}
.afo-ma-titre .afo-ico{color:var(--afo-accent)}
.afo-ma-date{margin:0 0 .8rem;font-size:.85rem;color:var(--afo-doux)}
.afo-reponse{margin:0;display:grid;gap:.7rem}
.afo-rep-ligne dt{font:800 .82rem/1.3 var(--afo-disp);color:var(--afo-doux)}
.afo-rep-ligne dd{margin:.15rem 0 0;overflow-wrap:anywhere}.afo-rep-ligne dd p{margin:0 0 .4rem}
.afo-sans{color:var(--afo-doux);font-style:italic}
.afo-note{margin:.9rem 0 0;font-size:.88rem;color:var(--afo-doux)}
.afo-pied-ma{margin-top:1rem}
.afo-merci{display:grid;justify-items:center;text-align:center;gap:.6rem;padding:2rem .5rem 1rem}
.afo-merci-rond{display:grid;place-items:center;width:4.2rem;height:4.2rem;border-radius:50%;background:var(--afo-klein);color:#fff;font-size:2rem;animation:afo-pop .45s cubic-bezier(.34,1.56,.64,1)}
.afo-merci-rond .afo-ico{stroke-width:2.6}
.afo-merci-titre{margin:.2rem 0 0;font:800 1.4rem/1.2 var(--afo-disp);color:var(--afo-titre);outline:0}
.afo-merci-texte{max-width:30rem}.afo-merci-texte p{margin:0 0 .5rem}
.afo-pied-merci{justify-content:center}
@keyframes afo-pop{from{transform:scale(.4)}to{transform:none}}

/* ── Formulaires du site (js/formulaires-partout.js, migration 133) : case d'accord, en-tête court (le bloc porte le titre) ── */
.afo-q-accord .afo-opt{align-items:flex-start}
.afo-q-accord .afo-opt-marque{border-radius:6px;margin-top:.1rem}
.afo-q-accord .afo-opt input:checked+.afo-opt-marque::after{width:.35rem;height:.65rem;border-radius:0;background:none;border:solid #fff;border-width:0 2.5px 2.5px 0;transform:translateY(-1px) rotate(45deg)}
.afo-q-accord .afo-opt-lib{font-size:.92rem;line-height:1.45}
.afo-tete-courte{margin:0 0 1rem}.afo-tete-courte .afo-infos{margin:0}