/* Les messages du système (toast, « Annuler »), natifs Le Fil : js/fil/message.js. Préfixe fmsg-, jetons --f-* de css/fil.css (repli sur les jetons de css/tokens.css : le secours
   ?interface=classique garde un message lisible). Remplace `.anima-toast*` de css/styles.css (supprimé).
   Téléphone : la pile se pose au-dessus de la barre basse ; bureau (pas de barre basse) : en bas à droite. Une feuille ouverte (.fb-voile, .f-voile) ne
   cache jamais le message : il passe en haut de l'écran, au-dessus d'elle (z-index 400 > 200), sans couvrir aucune de ses actions. */
.fmsg-pile {
  position: fixed; z-index: 400; left: 50%; bottom: calc(92px + env(safe-area-inset-bottom, 0px)); transform: translateX(-50%);
  display: flex; flex-direction: column; align-items: center; gap: 8px; width: min(calc(100vw - 32px), 460px); pointer-events: none;
}
.fmsg {
  position: relative; display: flex; align-items: center; gap: 10px; width: 100%; min-height: 48px; padding: 10px 16px 10px 14px;
  background: var(--f-surface, var(--s1)); color: var(--f-encre, var(--texte)); border: 1px solid var(--f-filet, var(--ligne)); border-left: 4px solid var(--f-encre-2, var(--texte-2)); border-radius: 14px;
  box-shadow: 0 10px 28px color-mix(in srgb, var(--f-encre, var(--texte)) 18%, transparent);
  font: 500 14px/1.4 Inter, system-ui, sans-serif; pointer-events: auto; overflow-wrap: anywhere;
  opacity: 0; transform: translateY(12px); transition: opacity 180ms ease, transform 280ms var(--f-spring, ease);
}
.fmsg-in { opacity: 1; transform: none; }
.fmsg-out { opacity: 0; transform: translateY(8px); pointer-events: none; }
.fmsg-error { border-left-color: var(--f-urgent, var(--crit)); }
.fmsg-error .fmsg-ico { color: var(--f-urgent, var(--crit)); }
.fmsg-success { border-left-color: var(--f-fait, var(--ok)); }
.fmsg-success .fmsg-ico { color: var(--f-fait, var(--ok)); }
.fmsg-ico { display: inline-flex; flex: none; color: var(--f-encre-2, var(--texte-2)); }
.fmsg-texte { flex: 1 1 auto; min-width: 0; }
.fmsg-bouton {
  flex: none; min-height: 44px; padding: 0 16px; border: 1px solid var(--f-filet, var(--ligne)); border-radius: 12px; background: var(--f-encre, var(--texte)); color: var(--f-fond, var(--bg-0));
  font: 600 14px/1 Inter, system-ui, sans-serif; cursor: pointer;
}
.fmsg-bouton:hover { opacity: .9; }
.fmsg-bouton:focus-visible { outline: 2px solid var(--f-encre, var(--texte)); outline-offset: 3px; }
/* Une feuille ouverte : la pile passe en haut de l'écran ET la feuille lui laisse la place (elle perd la hauteur du message tant qu'il est là) :
   le message est au-dessus d'elle, jamais posé sur son titre, son bouton « Fermer » ou ses actions. */
body:has(.fb-voile, .f-voile) .fmsg-pile { bottom: auto; top: calc(12px + env(safe-area-inset-top, 0px)); }
body:has(.fb-voile, .f-voile) .fmsg { transform: translateY(-12px); }
body:has(.fb-voile, .f-voile) .fmsg-in { transform: none; }
body:has(.fb-voile, .f-voile) .fmsg-out { transform: translateY(-8px); }
body:has(.fmsg-in):has(.fb-voile) .fb-voile, body:has(.fmsg-in):has(.f-voile) .f-voile { padding-top: calc(14px + var(--fmsg-place, 76px) + env(safe-area-inset-top, 0px)); }
body:has(.fmsg-in):has(.fb-voile) .fb-feuille, body:has(.fmsg-in):has(.f-voile) .f-feuille { max-height: calc(100dvh - 28px - var(--fmsg-place, 76px) - env(safe-area-inset-top, 0px)); }
@media (min-width: 900px) {
  .fmsg-pile { left: auto; right: 28px; bottom: 28px; transform: none; align-items: flex-end; width: min(calc(100vw - 56px), 460px); }
}
@media (prefers-reduced-motion: reduce) { .fmsg { transition: opacity 120ms linear; transform: none !important; } }
@media print { .fmsg-pile { display: none !important; } }