/* SD ONE lot 71 (24/10/2026) : barre de suivi sous le menu principal. Bleu nuit / bleu / argent, jamais doré.
   Fichier NOUVEAU, chargé après toutes les autres feuilles. Ne touche ni la recherche ni la météo / l'heure de l'en-tête. */
:root { --sd71-h: 56px; --sd71-menu: 50px; --sd71-nuit: #0b1b33; --sd71-nuit2: #102846; --sd71-bleu: #1e5aa8; --sd71-bleu2: #3b7dd8; --sd71-argent: #c9d1dc; --sd71-rouge: #c62828; }

/* place réservée : --barre = menu (50 px) + barre de suivi ; tout ce qui se cale sur --haut + --barre suit tout seul */
body.sd71-on { --barre: calc(var(--sd71-menu) + var(--sd71-h)); }
body.sd71-on .v2-menu { height: var(--sd71-menu); }
body.sd71-on .v2-m1 { min-height: var(--sd71-menu); }
body.sd71-on[data-vue="graphique"] { --barre: var(--sd71-h); } /* planning visuel : le menu est masqué, la barre prend sa place */
body.sd71-on.cx-ouvert { --barre: var(--sd71-menu); }
/* essai 1 : mêmes réglages même si une autre feuille ou un script retouche les classes de body (on s'appuie aussi sur la présence de la barre) */
html:root:has(#sd71-bar) body:not(.cx-ouvert) { --barre: calc(var(--sd71-menu) + var(--sd71-h)) !important; }
html:root:has(#sd71-bar) body[data-vue="graphique"]:not(.cx-ouvert) { --barre: var(--sd71-h) !important; }
html:root:has(#sd71-bar) body .v2-menu { height: var(--sd71-menu); }
html:root:has(#sd71-bar) body .v2-m1 { min-height: var(--sd71-menu); }
/* essai 1 : écart mesuré par le script quand un écran remonte volontairement sous le menu (planning : bandeau et calendrier rond) */
html:root:has(#sd71-bar) body:not(.cx-ouvert) #v2-contenu { margin-top: var(--sd71-plus, 0px) !important; }
/* le calendrier rond du planning passe sous la barre et les menus (il ne la recouvre plus ; il est replacé juste en dessous) */
html:root:has(#sd71-bar) #sdx-cal-portail { z-index: 44 !important; }

.sd71-bar { position: fixed; left: 0; right: 0; top: calc(var(--haut) + var(--sd71-menu)); height: var(--sd71-h); z-index: 45;
  overflow-x: auto; overflow-y: hidden; -webkit-overflow-scrolling: touch; scrollbar-width: thin; scrollbar-color: rgba(201, 209, 220, .45) transparent;
  background-color: var(--sd71-nuit);
  background-image: linear-gradient(rgba(201, 209, 220, .06) 1px, transparent 1px), linear-gradient(90deg, rgba(201, 209, 220, .06) 1px, transparent 1px),
    linear-gradient(180deg, var(--sd71-nuit2), var(--sd71-nuit));
  background-size: 14px 14px, 14px 14px, 100% 100%;
  border-top: 1px solid rgba(201, 209, 220, .18); border-bottom: 1px solid rgba(201, 209, 220, .35);
  box-shadow: 0 8px 20px rgba(8, 24, 48, .28); }
body[data-vue="graphique"] .sd71-bar { top: var(--haut); }
body.cx-ouvert .sd71-bar { visibility: hidden; }
.sd71-in { display: flex; align-items: center; gap: 8px; width: max-content; min-width: 100%; justify-content: center; height: 100%; padding: 0 14px; box-sizing: border-box; }
.sd71-z, #sd71-bar #sd57-bar, #sd71-bar #sd59-grp { display: contents; }
.sd71-fondu { display: none; } /* fondu de droite : téléphone seulement */

/* ---------- les pastilles (mêmes boutons qu'avant, habillés) ---------- */
#sd71-bar .sd71-p { position: relative; overflow: hidden; flex: none; display: inline-flex; align-items: center; gap: 8px;
  width: auto; min-width: 0; height: 40px; margin: 0; padding: 0 12px 0 11px; box-sizing: border-box;
  border-radius: 12px; border: 1px solid rgba(201, 209, 220, .45); color: #fff; cursor: pointer;
  font: 700 13px/1 Manrope, system-ui, sans-serif; letter-spacing: .01em; text-decoration: none; white-space: nowrap;
  background-color: rgba(16, 40, 70, .9);
  background-image: linear-gradient(rgba(201, 209, 220, .10) 1px, transparent 1px), linear-gradient(90deg, rgba(201, 209, 220, .10) 1px, transparent 1px),
    linear-gradient(180deg, rgba(59, 125, 216, .22), rgba(11, 27, 51, .2));
  background-size: 10px 10px, 10px 10px, 100% 100%; background-position: 0 0, 0 0, 0 0;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .10), 0 3px 10px rgba(3, 10, 22, .30);
  transition: box-shadow .16s ease, border-color .16s ease, filter .16s ease; } /* revue 2 : rien ne bouge au survol */
#sd71-bar .sd71-p svg { flex: none; width: 17px; height: 17px; color: var(--sd71-argent); }
/* revue 2 : plus de reflet qui traverse le bouton */
#sd71-bar .sd71-p:hover, #sd71-bar .sd71-p:focus-visible { border-color: var(--sd71-argent); filter: brightness(1.12);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .14), 0 8px 18px rgba(30, 90, 168, .38); outline: none; }
#sd71-bar .sd71-p:focus-visible { box-shadow: 0 0 0 2px var(--sd71-argent), 0 8px 18px rgba(30, 90, 168, .38); }
#sd71-bar .sd71-p:active { filter: brightness(.95); }

/* bouton principal : Nouveau dossier */
#sd71-bar .sd71-p[data-sd71="dossier"] { margin-right: 6px; padding: 0 16px 0 13px; border-color: rgba(201, 209, 220, .7);
  background-color: var(--sd71-bleu);
  background-image: linear-gradient(rgba(255, 255, 255, .14) 1px, transparent 1px), linear-gradient(90deg, rgba(255, 255, 255, .14) 1px, transparent 1px),
    linear-gradient(180deg, var(--sd71-bleu2) 0%, var(--sd71-bleu) 55%, #163f78 100%);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .25), 0 4px 14px rgba(30, 90, 168, .45); }
#sd71-bar .sd71-p[data-sd71="dossier"] svg { color: #fff; }
/* Planning visuel : bouton argent quadrillé, texte bleu nuit (essai 1 : il paraissait grisé) */
#sd71-bar .sd71-p[data-sd71="planning"] { margin-left: 6px; opacity: 1 !important; color: var(--sd71-nuit) !important; border-color: #e8edf3;
  background-color: var(--sd71-argent);
  background-image: linear-gradient(rgba(11, 27, 51, .10) 1px, transparent 1px), linear-gradient(90deg, rgba(11, 27, 51, .10) 1px, transparent 1px),
    linear-gradient(180deg, #f4f7fb 0%, var(--sd71-argent) 60%, #aeb9c8 100%);
  box-shadow: inset 0 1px 0 #fff, 0 4px 12px rgba(3, 10, 22, .35); }
#sd71-bar .sd71-p[data-sd71="planning"] svg { color: var(--sd71-bleu) !important; stroke: currentColor; }

/* libellés et chiffres d'origine masqués dans la barre (les lots les tiennent toujours à jour, on recopie leur chiffre) */
#sd71-bar .sd57-l, #sd71-bar .sd57-c, #sd71-bar .sd59-l, #sd71-bar .sd59-c,
#sd71-bar .sd57-b em, #sd71-bar .sd59-n, #sd71-bar #v2-cloche .sd60-nb, #sd71-bar #v2-cloche .fil-badge, #sd71-bar #v2-cloche .v2-pastille { display: none !important; }
#sd71-bar .sd71-l { display: inline-block; line-height: 1.35; } /* 1.35 : l'accent de « À » n'est pas coupé */

/* le nombre : gris à 0, bleu dès qu'il y a quelque chose (rouge seulement pour « Sans chauffeur », l'urgence du jour) */
#sd71-bar .sd71-n { display: inline-grid; place-items: center; min-width: 24px; height: 22px; padding: 0 7px; box-sizing: border-box; border-radius: 11px;
  font: 800 12px/1 Manrope, system-ui, sans-serif; font-variant-numeric: tabular-nums; background: var(--sd71-bleu2); color: #fff;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .25); }
#sd71-bar .sd71-n:empty { visibility: hidden; } /* revue 2 : la place est gardée, la pastille ne bouge pas quand le chiffre arrive */
#sd71-bar .sd71-p[data-sd71-etat="rouge"] .sd71-n { background: var(--sd71-rouge); }
#sd71-bar .sd71-p[data-sd71-etat="rouge"] { border-color: rgba(198, 40, 40, .75); }
#sd71-bar .sd71-p[data-sd71-etat="bleu"] { border-color: rgba(59, 125, 216, .85); }
#sd71-bar .sd71-p[data-sd71-etat="zero"], #sd71-bar .sd71-p[data-sd71-etat="vide"] { color: rgba(232, 236, 241, .62); border-color: rgba(201, 209, 220, .22); background-color: rgba(16, 40, 70, .55); box-shadow: none; }
#sd71-bar .sd71-p[data-sd71-etat="zero"] svg, #sd71-bar .sd71-p[data-sd71-etat="vide"] svg { color: rgba(201, 209, 220, .5); }
#sd71-bar .sd71-p[data-sd71-etat="zero"] .sd71-n { background: rgba(201, 209, 220, .22); color: rgba(232, 236, 241, .75); box-shadow: none; }
#sd71-bar .sd71-p[data-sd71-etat="zero"]:hover, #sd71-bar .sd71-p[data-sd71-etat="vide"]:hover { color: #fff; }

@media (prefers-reduced-motion: reduce) {
  #sd71-bar .sd71-p { transition: none; }
}

/* écran moyen : barre un peu plus serrée */
@media (min-width: 761px) and (max-width: 1700px) {
  .sd71-in { gap: 6px; padding: 0 10px; }
  #sd71-bar .sd71-p { padding: 0 9px 0 8px; gap: 6px; font-size: 12.5px; }
  #sd71-bar .sd71-p svg { width: 15px; height: 15px; }
  #sd71-bar .sd71-p[data-sd71="dossier"] { margin-right: 2px; padding: 0 12px 0 10px; }
  #sd71-bar .sd71-p[data-sd71="planning"] { margin-left: 2px; }
}
/* jusqu'à 1400 px : icônes gardées seulement sur « Nouveau dossier » et « Planning visuel », pour que tout tienne sur une ligne */
@media (min-width: 761px) and (max-width: 1400px) { #sd71-bar .sd71-p:not([data-sd71="dossier"]):not([data-sd71="planning"]) svg { display: none; } }
@media (min-width: 761px) and (max-width: 1280px) { .sd71-in { justify-content: flex-start; } }

/* ---------- téléphone ---------- */
@media (max-width: 760px) {
  :root { --sd71-h: 60px; }
  body.sd71-on { --barre: var(--sd71-h); }           /* pas de menu sous l'en-tête au téléphone : la barre est juste sous l'en-tête */
  body.sd71-on.cx-ouvert { --barre: 0px; }
  body.sd71-on[data-vue="graphique"] { --barre: var(--sd71-h); }
  html:root:has(#sd71-bar) body:not(.cx-ouvert), html:root:has(#sd71-bar) body[data-vue="graphique"]:not(.cx-ouvert) { --barre: var(--sd71-h) !important; }
  html:root:has(#sd71-bar) body .v2-contenu { padding-top: calc(var(--haut) + var(--barre) + 10px); }
  .sd71-bar { top: var(--haut); }
  /* les boutons ne sont plus dans l'en-tête : il reprend sa hauteur d'avant (60 px), au lieu des 2e et 3e rangées des lots 57 et 59 */
  html.sd71-libre:root { --haut: calc(60px + env(safe-area-inset-top)) !important; }
  html.sd71-on body.sd71-on .v2-contenu { padding-top: calc(var(--haut) + var(--barre) + 10px); }
  html.sd71-on:root #v2-retour { top: calc(var(--haut) + var(--barre) + 12px) !important; }
  html.sd71-on:root body.sd71-on #v2-retour:not([hidden]) + .v2-contenu { padding-top: calc(var(--haut) + var(--barre) + 66px); }
  .sd71-in { justify-content: flex-start; gap: 8px; padding: 0 40px 0 12px; } /* 40 px à droite : la dernière pastille sort du fondu */
  /* revue 2 : fondu à droite de la barre qui défile (aucune pastille ne paraît coupée net) */
  .sd71-fondu { display: block; position: fixed; right: 0; top: var(--haut); width: 40px; height: var(--sd71-h); z-index: 45; pointer-events: none;
    background: linear-gradient(90deg, rgba(11, 27, 51, 0), var(--sd71-nuit) 85%); transition: opacity .2s ease; }
  .sd71-fondu.sd71-fin, body.cx-ouvert .sd71-fondu, body.menu-ouvert .sd71-fondu { opacity: 0; }
  #sd71-bar .sd71-p { height: 44px; min-height: 44px; padding: 0 12px; font-size: 13px; }
  #sd71-bar .sd71-p[data-sd71="dossier"] { padding: 0 14px; }
}

@media print { .sd71-bar { display: none !important; } body.sd71-on, html:root:has(#sd71-bar) body:not(.cx-ouvert) { --barre: 0px !important; } html:root:has(#sd71-bar) body #v2-contenu { margin-top: 0 !important; } }