/* ════════════════════════════════════════════════════════════════
   bandeaux-v1-colle.css — COLLE des bandeaux système (tâche 11.97, lot F2b, 24/10/2026) : placement RÉEL dans l'app de la
   barre du haut de la maquette (systeme2.css, copie verbatim bandeaux-v1.css). La maquette pose ses barres dans une colonne
   pleine hauteur (nav, barre, contenu qui défile) ; l'app a une nav FIXE et des pages qui défilent avec le corps : la barre
   se colle sous la nav, dans le flux (la page descend d'autant, rien n'est recouvert). Hauteurs mesurées par
   js/bandeaux-app.js : --bdx-nav (bas réel de la nav, plus bas pendant une observation ou sous le bandeau des conditions),
   --bdx-h (hauteur de la barre), --bdx-pied (barre du bas de l'app) et --bdx-bas-h (bas d'écran, F3a), posées sur <html>
   avec les classes bdx-haut / bdx-bas. Chaque règle est déclarée dans
   outil/maquettes/bandeaux.mjs (COLLE).
   ════════════════════════════════════════════════════════════════ */
/* barre du haut : collée sous la nav (z-index 200), au-dessus des pages */
#mx-bandeau-haut { position: sticky; top: var(--bdx-nav, 52px); z-index: 199; }
#mx-bandeau-haut[hidden] { display: none; }
/* reset des boutons de la charte (:where(.mx), poids nul) : l'app n'a pas la portée .mx à la racine — sans lui, la croix
   « Fermer / Masquer pour aujourd'hui » (.s2-x) prend le style par défaut du navigateur (disque gris, bordure en relief) */
:where(#mx-bandeau-haut, #mx-bandeau-fenetre) :where(button, input, select, textarea) { font: inherit; color: inherit; margin: 0; }
:where(#mx-bandeau-haut, #mx-bandeau-fenetre) :where(button) { cursor: pointer; background: none; border: 0; padding: 0; }
:where(#mx-bandeau-haut, #mx-bandeau-fenetre) :where(a) { color: var(--mx-ink); text-decoration: underline; text-decoration-thickness: 1.5px; text-underline-offset: 3px; font-weight: var(--mx-fw-semi); }
:where(#mx-bandeau-haut, #mx-bandeau-fenetre) :where(a:hover) { color: var(--mx-red-text); }
/* éléments collants et hauteurs des pages (calc(var(--mx-nav-h) + …) dans les feuilles des écrans) : sous la barre ; les
   racines d'écran qui redéfinissent --mx-nav-h (agenda, bilan, bibliothèque, programme) suivent */
html.bdx-haut .page,
html.bdx-haut :is(#agv-racine, #bil-racine, #bbv-racine, #pgv-racine) { --mx-nav-h: calc(var(--bdx-nav, 52px) + var(--bdx-h, 0px)); }
/* pages qui réservent la nav par --mx-nav-h : la barre est déjà dans le flux, la réserve reste celle de la nav */
html.bdx-haut :is(#page-messagerie, #page-comptes-bloques, #page-paiements, #page-paiements-client) { padding-top: var(--bdx-nav, 52px); }
/* défilement au clavier (AC-7, 11.78) : un élément atteint n'est jamais sous la barre */
html.bdx-haut { scroll-padding-top: calc(64px + var(--bdx-h, 0px)); }
@media (max-width: 767.98px) { html.bdx-haut { scroll-padding-top: calc(60px + var(--bdx-h, 0px)); } }
@media print { #mx-bandeau-haut { display: none; } }
/* bas d'écran (F3a) : fixé au-dessus de la barre du bas de l'app (--bdx-pied mesuré, 0 sur ordinateur), sous les fenêtres
   (9999) et la barre du bas (9998) ; la page gagne sa hauteur en fin de corps — rien n'est recouvert (la planche le pose dans
   la colonne pleine hauteur, « la page rétrécit ») */
#mx-bandeau-bas { position: fixed; left: env(safe-area-inset-left, 0px); right: env(safe-area-inset-right, 0px); bottom: max(var(--bdx-pied, 0px), env(safe-area-inset-bottom, 0px)); z-index: 9997; }   /* 11.113 ① : zones sûres (sans barre du bas : au-dessus de la barre d'accueil) */
#mx-bandeau-bas[hidden] { display: none; }
html.bdx-bas body::after { content: ''; display: block; height: var(--bdx-bas-h, 0px); }
/* messagerie (hauteur calée sur la fenêtre ; --mx-nav-h n'y sert qu'aux hauteurs) : le bas d'écran est retiré de sa hauteur */
html.bdx-bas #msv-racine { --mx-nav-h: calc(var(--bdx-nav, 52px) + var(--bdx-h, 0px) + var(--bdx-bas-h, 0px)); }
html.bdx-bas { scroll-padding-bottom: calc(var(--bdx-pied, 0px) + var(--bdx-bas-h, 0px) + 12px); }
@media print { #mx-bandeau-bas { display: none; } }
/* fenêtres (F2c) : au-dessus de la nav et des barres (9998), sous les toasts (10000) et les confirmations, comme les autres
   fenêtres de l'app (la planche les met à 80 / 81) */
#mx-bandeau-fenetre .s2-scrim, #mx-bandeau-fenetre .s2-modal { z-index: 9999; }
#mx-bandeau-fenetre[hidden] { display: none; }
/* note de pied et version des documents : `.pc-h` du parcours (parcours.css, non porté), valeurs de la maquette */
#mx-bandeau-fenetre .pc-h { font-size: 13px; line-height: 1.45; color: var(--mx-muted); }
/* notifications (F3b) : push.js (fichier protégé) pose encore son bandeau #push-banner quand il propose ; la file des bandeaux
   montre le sien à la place (« Activer » = _activatePush, la croix = _dismissPushBanner) — celui de push.js n'est jamais vu */
#push-banner { display: none !important; }
/* bas d'écran sur téléphone (07/11, CTO 0 h 10) : titre seul (« Une nouvelle version de Marx est prête. ») → la croix (44 px) et
   la zone de toucher des boutons de la 2e ligne (46 px pour 32 dessinés) se chevauchaient de 5 px : la 2e ligne descend de 8 px
   quand le bandeau a une croix (garde bandeaux-garde ecran, bas d'écran 390) */
@media (max-width: 767.98px) { #mx-bandeau-bas .s2-bb:has(> .s2-x) .s2-a { margin-top: 8px; } }
/* D-092 (recette ALE-010, 07/11) : une fenêtre de l'app ouverte (html.mx-defil-bloque, posé par le verrou commun defilement.js)
   passe devant le bas d'écran — au téléphone, le bandeau des cookies (9997) couvrait le pied de la feuille « Ajouter un client »
   (« Ajouter le client » intouchable tant qu'on n'avait pas répondu) ; il revient à la fermeture de la fenêtre */
html.mx-defil-bloque #mx-bandeau-bas { visibility: hidden; }
/* D-128 (recette ALE-003, 10/11) : la carte de fin de séance (« Ton poids du jour ? », #post-session-popup, posée au bas de l'écran
   sans verrou) passe aussi devant le bas d'écran — le bandeau des cookies couvrait son champ ; il revient à sa fermeture */
body:has(#post-session-popup.show) #mx-bandeau-bas { visibility: hidden; }