/* Le Fil — Autorisations parentales, suivi par jeune (js/autorisations/, #/projet/<id>/autorisations). Préfixe fau-, kit du budget (.fb, .fb-bouton, .fb-saisie, .fb-feuille), jetons --f-*
   (css/fil.css) et lavis du domaine Jeunes (--mv-l / --mv-t, posés par .fmv-t-orchidee). Aucune couleur en dur. La couleur a un sens : sapin (--f-fait) = reçue, ambre (--f-attention) =
   à relancer, rouge (--f-urgent) = refusée ; une autorisation manquante reste à l'encre, en pointillé (l'état normal d'un séjour qui démarre : 192 pastilles ambre seraient un mensonge).
   Pas de lueur ni d'ombre colorée sur les cartes : le focus passe par l'élévation et un contour. */
[data-interface="fil"] .fau { max-width: 980px; display: grid; gap: 14px; align-content: start; --fau-haut: 68px; }

/* ---------- En-tête : la feuille d'autorisation qui se coche, le séjour, la phrase du moment ---------- */
[data-interface="fil"] .fau-tete { display: flex; align-items: center; gap: 16px; padding: 14px 18px; border-radius: 24px; background: var(--mv-l); }
[data-interface="fil"] .fau-tete-texte { min-width: 0; }
[data-interface="fil"] .fau-colo { margin: 0 0 2px; color: var(--mv-t); font: 600 13px/1.3 Inter, system-ui, sans-serif; letter-spacing: .02em; overflow-wrap: anywhere; }
[data-interface="fil"] .fau-resume { margin: 0; color: var(--f-encre); font: 500 17px/1.35 Inter, system-ui, sans-serif; text-wrap: balance; }
[data-interface="fil"] .fau-scene { flex: none; width: 84px; }
[data-interface="fil"] .fau-dessin { display: block; width: 100%; height: auto; overflow: visible; fill: none; stroke: var(--mv-t); stroke-width: 3; stroke-linecap: round; stroke-linejoin: round; }
[data-interface="fil"] .fau-d-page { fill: var(--f-surface); }
[data-interface="fil"] .fau-d-pli { opacity: .5; }
[data-interface="fil"] .fau-d-case { fill: var(--f-surface); stroke-width: 2.4; }
[data-interface="fil"] .fau-d-ligne { opacity: .35; stroke-width: 2.6; }
[data-interface="fil"] .fau-d-coche { stroke-width: 2.8; stroke-dasharray: 1; stroke-dashoffset: 1; transition: stroke-dashoffset .45s cubic-bezier(.6, 0, .2, 1); }
[data-interface="fil"] .fau[data-complet~="sortie"] .fau-d-c-sortie,
[data-interface="fil"] .fau[data-complet~="image"] .fau-d-c-image,
[data-interface="fil"] .fau[data-complet~="transport"] .fau-d-c-transport,
[data-interface="fil"] .fau[data-complet~="soins"] .fau-d-c-soins { stroke-dashoffset: 0; }
[data-interface="fil"] .fau-d-sceau { fill: var(--mv-t); stroke: none; transform-box: fill-box; transform-origin: 50% 50%; transform: scale(0); transition: transform .5s var(--f-spring); }
[data-interface="fil"] .fau-d-sceau-coche { stroke: var(--f-surface); stroke-width: 3.6; stroke-dasharray: 1; stroke-dashoffset: 1; transition: stroke-dashoffset .4s cubic-bezier(.6, 0, .2, 1) .25s; }
[data-interface="fil"] .fau[data-tout] .fau-d-sceau { transform: scale(1); }
[data-interface="fil"] .fau[data-tout] .fau-d-sceau-coche { stroke-dashoffset: 0; }

/* ---------- Les quatre compteurs ---------- */
[data-interface="fil"] .fau-bande { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); border: 1px solid var(--f-filet); border-radius: 20px; background: var(--f-surface); }
[data-interface="fil"] .fau-stat { display: grid; gap: 3px; align-content: start; min-width: 0; padding: 12px 6px 12px 10px; border-left: 1px solid var(--f-filet); border-radius: 0; }
[data-interface="fil"] .fau-stat:first-child { border-left: 0; }
[data-interface="fil"] .fau-stat-lib { color: var(--f-encre-2); font: 600 12px/1.2 Inter, system-ui, sans-serif; }
[data-interface="fil"] .fau-stat-val { font: 600 18px/1.2 Inter, system-ui, sans-serif; font-variant-numeric: tabular-nums; white-space: nowrap; }
[data-interface="fil"] .fau-stat-barre { display: block; height: 4px; margin: 3px 0 2px; border-radius: 2px; background: var(--f-filet); overflow: hidden; }
[data-interface="fil"] .fau-stat-barre i { display: block; height: 100%; width: calc(var(--p, 0) * 100%); background: var(--f-fait); transition: width .6s var(--f-spring); }
[data-interface="fil"] .fau-stat-sous { color: var(--f-encre-2); font: 500 11px/1.25 Inter, system-ui, sans-serif; }
[data-interface="fil"] .fau-stat[data-etat="relancer"] .fau-stat-sous { color: var(--f-attention); font-weight: 600; }
[data-interface="fil"] .fau-stat[data-etat="refus"] .fau-stat-sous { color: var(--f-urgent); font-weight: 600; }
[data-interface="fil"] .fau-stat[data-etat="complet"] .fau-stat-sous { color: var(--f-fait); font-weight: 600; }

/* ---------- Ne pas photographier ---------- */
[data-interface="fil"] .fau-photo { display: flex; flex-wrap: wrap; align-items: baseline; gap: 2px 10px; padding: 12px 14px; border: 1px solid var(--f-filet); border-left: 5px solid var(--f-urgent); border-radius: 16px; background: var(--f-surface); }
[data-interface="fil"] .fau-photo[hidden] { display: none; }
[data-interface="fil"] .fau-photo-titre { color: var(--f-urgent); font: 700 14px/1.3 Inter, system-ui, sans-serif; }
[data-interface="fil"] .fau-photo-noms { min-width: 0; font: 500 14px/1.4 Inter, system-ui, sans-serif; overflow-wrap: anywhere; }

/* ---------- Filtres et liste à copier ---------- */
[data-interface="fil"] .fau-outils { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 10px 12px; }
[data-interface="fil"] .fau-filtres { display: inline-flex; gap: 4px; padding: 3px; border: 1px solid var(--f-filet); border-radius: 999px; background: var(--f-surface); }
[data-interface="fil"] .fau-filtre { display: inline-flex; align-items: center; gap: 6px; min-height: 44px; padding: 0 14px; border: 0; border-radius: 999px; background: transparent; color: var(--f-encre-2); font: 600 14px/1.2 Inter, system-ui, sans-serif; cursor: pointer; transition: background .2s, color .2s; }
[data-interface="fil"] .fau-filtre:hover { color: var(--f-encre); }
[data-interface="fil"] .fau-filtre[aria-pressed="true"] { background: var(--f-encre); color: var(--f-surface); }
[data-interface="fil"] .fau-filtre-n { font-variant-numeric: tabular-nums; opacity: .8; }
[data-interface="fil"] .fau-copier[hidden] { display: none; }
[data-interface="fil"] .fau-etat-ligne { display: flex; align-items: center; gap: 10px; min-height: 20px; margin: -8px 0 -6px; }
[data-interface="fil"] .fau-etat { margin: 0; color: var(--f-encre-2); font: 400 14px/1.4 Inter, system-ui, sans-serif; }
[data-interface="fil"] .fau-etat[data-etat="erreur"] { color: var(--f-urgent); font-weight: 600; }
[data-interface="fil"] .fau-etat[data-etat="ok"] { color: var(--f-fait); }
[data-interface="fil"] .fau-reessayer[hidden] { display: none; }

/* ---------- Le tableau : jeunes × quatre types ---------- */
[data-interface="fil"] .fau-table { width: 100%; table-layout: fixed; border-collapse: separate; border-spacing: 0; border: 1px solid var(--f-filet); border-radius: 20px; background: var(--f-surface); }
[data-interface="fil"] .fau-th-jeune, [data-interface="fil"] .fau-th-type { position: sticky; top: var(--fau-haut); z-index: 4; background: var(--f-surface); border-bottom: 1px solid var(--f-filet); vertical-align: bottom; }
[data-interface="fil"] .fau-th-jeune { padding: 0 12px 10px; border-top-left-radius: 19px; text-align: left; color: var(--f-encre-2); font: 600 12px/1.2 Inter, system-ui, sans-serif; }
[data-interface="fil"] .fau-th-type { width: clamp(48px, 14vw, 56px); padding: 6px 0 6px; text-align: center; }
[data-interface="fil"] .fau-th-type:last-child { border-top-right-radius: 19px; }
[data-interface="fil"] .fau-th-lib--court { display: none !important; }
[data-interface="fil"] .fau-th-lib { display: block; padding: 4px 0 2px; color: var(--f-encre-2); font: 600 12px/1.2 Inter, system-ui, sans-serif; }
[data-interface="fil"] .fau-tout { display: block; width: calc(100% - 6px); margin: 4px 3px 0; min-height: 44px; padding: 2px; border: 1px solid var(--f-filet); border-radius: 12px; background: var(--f-surface-2); color: var(--f-encre); font: 600 11px/1.15 Inter, system-ui, sans-serif; white-space: normal; cursor: pointer; transition: background .2s, color .2s, transform .3s var(--f-spring); }
[data-interface="fil"] .fau-tout:hover:not(:disabled), [data-interface="fil"] .fau-tout:focus-visible:not(:disabled) { background: var(--f-encre); color: var(--f-surface); transform: translateY(-1px); }
[data-interface="fil"] .fau-tout:active:not(:disabled) { transform: scale(.97); }
[data-interface="fil"] .fau-tout:disabled { opacity: .45; cursor: default; }
[data-interface="fil"] .fau-groupe-ligne > th { padding: 16px 12px 6px; text-align: left; color: var(--f-encre-2); font: 600 13px/1.2 Inter, system-ui, sans-serif; }
[data-interface="fil"] .fau-groupe-n { margin-left: 8px; font-weight: 500; font-variant-numeric: tabular-nums; opacity: .8; }
[data-interface="fil"] .fau-ligne > * { border-top: 1px solid var(--f-filet); }
[data-interface="fil"] .fau-nom { padding: 0; text-align: left; font-weight: 500; }
[data-interface="fil"] .fau-nom-bouton { display: flex; align-items: center; width: 100%; min-height: 52px; padding: 6px 6px 6px 12px; border: 0; border-radius: 0; background: transparent; color: var(--f-encre); text-align: left; font: 500 15px/1.25 Inter, system-ui, sans-serif; cursor: pointer; overflow-wrap: anywhere; transition: background .2s; }
[data-interface="fil"] .fau-nom-bouton:hover, [data-interface="fil"] .fau-nom-bouton:focus-visible { background: var(--f-surface-2); }
[data-interface="fil"] .fau-td { padding: 0; text-align: center; }
[data-interface="fil"] .fau-cellule { position: relative; display: flex; align-items: center; justify-content: center; gap: 8px; width: 100%; min-height: 52px; padding: 0; border: 0; border-radius: 0; background: transparent; color: var(--f-encre); font: 500 13px/1.2 Inter, system-ui, sans-serif; cursor: pointer; }
[data-interface="fil"] .fau-cellule--lecture { cursor: default; }
[data-interface="fil"] .fau-cellule:focus-visible { outline: 2px solid var(--f-encre); outline-offset: -4px; border-radius: 14px; }
[data-interface="fil"] .fau-pastille { flex: none; display: grid; place-items: center; width: 30px; height: 30px; border: 2px dashed var(--f-encre-3); border-radius: 50%; background: transparent; color: var(--f-encre-3); transition: background-color .22s, color .22s, transform .3s var(--f-spring); }
[data-interface="fil"] .fau-pastille svg { width: 18px; height: 18px; fill: none; stroke: currentColor; stroke-width: 2.4; stroke-linecap: round; stroke-linejoin: round; }
[data-interface="fil"] .fau-i-trait { stroke-dasharray: 1; stroke-dashoffset: 0; }
[data-interface="fil"] .fau-cellule[data-statut="recue"] .fau-pastille { border-style: solid; border-color: var(--f-fait); background: var(--f-fait); color: var(--f-surface); }
[data-interface="fil"] .fau-cellule[data-statut="refusee"] .fau-pastille { border-style: solid; border-color: var(--f-urgent); background: var(--f-urgent); color: var(--f-surface); }
[data-interface="fil"] .fau-cellule:not(.fau-cellule--lecture):hover .fau-pastille { transform: scale(1.08); }
[data-interface="fil"] .fau-cellule:not(.fau-cellule--lecture):active .fau-pastille { transform: scale(.94); }
[data-interface="fil"] .fau-lib { display: none; color: var(--f-encre-2); }
[data-interface="fil"] .fau-cellule[data-statut="recue"] .fau-lib { color: var(--f-fait); font-weight: 600; }
[data-interface="fil"] .fau-cellule[data-statut="refusee"] .fau-lib { color: var(--f-urgent); font-weight: 600; }
[data-interface="fil"] .fau-cellule--note::after { content: ""; position: absolute; top: 9px; right: 9px; width: 7px; height: 7px; border-radius: 50%; background: var(--f-encre-2); }
[data-interface="fil"] .fau-pop { animation: fau-pop .42s var(--f-spring) both; }
[data-interface="fil"] .fau-pop .fau-i-trait { animation: fau-trace .38s cubic-bezier(.6, 0, .2, 1) both; }
@keyframes fau-pop { 0% { transform: scale(.72); } 60% { transform: scale(1.14); } 100% { transform: scale(1); } }
@keyframes fau-trace { from { stroke-dashoffset: 1; } to { stroke-dashoffset: 0; } }

/* ---------- États vides et erreurs ---------- */
[data-interface="fil"] .fau-vide { margin: 0; padding: 22px 18px; border: 1px dashed var(--f-filet); border-radius: 20px; color: var(--f-encre-2); font: 400 15px/1.5 Inter, system-ui, sans-serif; text-align: center; }
[data-interface="fil"] .fau-vide[hidden] { display: none; }
[data-interface="fil"] .fau-vide--depart { display: grid; gap: 14px; justify-items: center; }
[data-interface="fil"] .fau-vide--depart p { margin: 0; max-width: 46ch; }
[data-interface="fil"] .fau-erreur { display: grid; gap: 12px; justify-items: start; }

/* ---------- La feuille d'un jeune ---------- */
[data-interface="fil"] .fau-feuille-groupe { margin: -2px 0 10px; color: var(--f-encre-2); font: 500 14px/1.3 Inter, system-ui, sans-serif; }
[data-interface="fil"] .fau-feuille-alerte { margin: 0 0 12px; padding: 10px 12px; border: 1px solid var(--f-urgent); border-radius: 12px; color: var(--f-urgent); font: 700 14px/1.3 Inter, system-ui, sans-serif; }
[data-interface="fil"] .fau-feuille-alerte[hidden] { display: none; }
[data-interface="fil"] .fau-feuille-tout { margin-bottom: 4px; }
[data-interface="fil"] .fau-feuille-type { display: grid; gap: 8px; padding: 12px 0; border-top: 1px solid var(--f-filet); }
[data-interface="fil"] .fau-feuille-lib { margin: 0; font: 600 15px/1.3 Inter, system-ui, sans-serif; }
[data-interface="fil"] .fau-feuille-choix { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 6px; }
[data-interface="fil"] .fau-feuille-option { min-height: 44px; padding: 0 6px; border: 1px solid var(--f-filet); border-radius: 12px; background: var(--f-surface); color: var(--f-encre-2); font: 600 14px/1.2 Inter, system-ui, sans-serif; cursor: pointer; transition: background .2s, color .2s, border-color .2s, transform .3s var(--f-spring); }
[data-interface="fil"] .fau-feuille-option:active { transform: scale(.97); }
[data-interface="fil"] .fau-feuille-option[data-actif="1"][data-statut="recue"] { border-color: var(--f-fait); background: var(--f-fait); color: var(--f-surface); }
[data-interface="fil"] .fau-feuille-option[data-actif="1"][data-statut="refusee"] { border-color: var(--f-urgent); background: var(--f-urgent); color: var(--f-surface); }
[data-interface="fil"] .fau-feuille-option[data-actif="1"][data-statut="manquante"] { border-color: var(--f-encre); background: var(--f-surface-2); color: var(--f-encre); }
[data-interface="fil"] .fau-feuille-etat { margin: 0; font: 600 14px/1.3 Inter, system-ui, sans-serif; }
[data-interface="fil"] .fau-feuille-etat[hidden] { display: none; }
[data-interface="fil"] .fau-feuille-etat[data-statut="recue"] { color: var(--f-fait); }
[data-interface="fil"] .fau-feuille-etat[data-statut="refusee"] { color: var(--f-urgent); }
[data-interface="fil"] .fau-feuille-note[hidden] { display: none; }
[data-interface="fil"] .fau-copie { min-height: 180px; font-size: 14px; }

@media (max-width: 380px) {
  [data-interface="fil"] .fau-th-lib--long { display: none; }
  [data-interface="fil"] .fau-th-lib--court { display: block !important; }
  [data-interface="fil"] .fau-scene { width: 70px; }
  [data-interface="fil"] .fau-resume { font-size: 16px; }
}
@media (min-width: 900px) {
  [data-interface="fil"] .fau { padding-top: 12px; }
  [data-interface="fil"] .fau-tete { padding: 18px 24px; gap: 22px; }
  [data-interface="fil"] .fau-scene { width: 108px; }
  [data-interface="fil"] .fau-resume { font-size: 20px; }
  [data-interface="fil"] .fau-stat { padding: 14px 16px; }
  [data-interface="fil"] .fau-stat-val { font-size: 24px; }
  [data-interface="fil"] .fau-stat-sous { font-size: 12px; }
  [data-interface="fil"] .fau-th-type { width: 138px; }
  [data-interface="fil"] .fau-th-jeune { padding-left: 16px; }
  [data-interface="fil"] .fau-nom-bouton { padding-left: 16px; }
  [data-interface="fil"] .fau-lib { display: inline; }
  [data-interface="fil"] .fau-tout { font-size: 12px; width: calc(100% - 20px); margin: 4px 10px 0; }
}
@media (prefers-reduced-motion: reduce) {
  [data-interface="fil"] .fau *, [data-interface="fil"] .fau-pop { transition: none !important; animation: none !important; }
}

/* ---------- « Ne pas photographier » ailleurs que sur l'écran des autorisations (lot M1) : trombinoscope (vignette d'un jeune) et fiche du jeune. Même mot que le journal et
   l'infirmerie ; le rouge dit un enfant à protéger. ---------- */
[data-interface="fil"] .fau-refus-photo { display: block; margin: 2px 0 0; color: var(--f-urgent); font: 700 12px/1.25 Inter, system-ui, sans-serif; text-align: center; }
[data-interface="fil"] .fau-refus-photo--fiche { margin: 6px 0 0; text-align: left; font-size: 13px; }
[data-interface="fil"] .fau-refus-photo[hidden] { display: none; }
[data-interface="fil"] .feq-vignette[data-refus-image] .feq-vignette-face { outline: 2px solid var(--f-urgent); outline-offset: 2px; }