/* ============================================================
   Kanban · patterns partages entre les tableaux avec colonnes
   ------------------------------------------------------------
   Fichier partage · linke APRES la CSS de la page.

   Probleme resolu ici · les colonnes .kanban-scroll sont tres
   hautes (des centaines de cartes empilees · l element fait
   facilement 40 000px de haut). La scrollbar horizontale native
   d un element se colle a SON PROPRE bas · donc a 40 000px sous
   l ecran, totalement inatteignable a la souris. C est pour ca
   que les pages la cachent (scrollbar-width:none) et utilisent
   le drag-to-pan.

   Solution · une barre de defilement horizontale STICKY, collee
   en bas du viewport (position:fixed), qui pilote le scroll
   horizontal du kanban. Creee et synchronisee par
   assets/kanban-scrollbar.js. Desktop souris uniquement.

   Pages qui l importent :
     - projets/index.html (Demandes d estimation)
     - projets/nouveaux-contrats.html
     - projets/production.html
     - projets/termine.html (grille aujourd hui, prete pour colonnes)
     - projets/annulees.html (grille aujourd hui, prete pour colonnes)
   ============================================================ */

/* Barre sticky · positionnee en fixed par le JS (left/width/display
   calcules dynamiquement). On ne style ici que l apparence. La barre
   elle-meme scrolle horizontalement · son enfant .inner (1px de haut)
   est aussi large que le contenu du kanban, ce qui genere une vraie
   scrollbar native dans la barre. */
.kanban-sticky-scrollbar {
  position: fixed;
  bottom: 0;
  z-index: 50;
  overflow-x: scroll;
  overflow-y: hidden;
  height: 12px;                      /* mince au repos */
  background: transparent;           /* pas de bloc blanc · seul le thumb gris se voit */
  transition: height 0.12s ease;     /* grossit en douceur au survol */
  /* IMPORTANT · NE PAS mettre scrollbar-width ni scrollbar-color ici.
     Chrome 121+ · des que scrollbar-width est defini (meme 'auto'), Chrome
     IGNORE les regles ::-webkit-scrollbar · le conteneur grossit mais le
     thumb reste a sa taille standard (~15px). En les retirant, Chrome
     honore les hauteurs ::-webkit-scrollbar ci-dessous et le thumb grossit
     bien au survol. Firefox montre une scrollbar par defaut (fonctionnelle). */
}
/* Au survol · la barre grossit (grandit vers le haut car ancree en bas) ·
   plus facile a saisir et a scroller vite. */
.kanban-sticky-scrollbar:hover {
  height: 20px;
}
.kanban-sticky-scrollbar-inner {
  height: 1px;
}
/* Chrome/Safari/Edge · le thumb gris remplit TOUTE la hauteur de la barre
   (pas de border qui laisserait du vide autour · c est ca qui donnait
   l impression d un gros fond avec un thumb mince). */
.kanban-sticky-scrollbar::-webkit-scrollbar {
  height: 12px;
  background: transparent;
}
.kanban-sticky-scrollbar:hover::-webkit-scrollbar {
  height: 20px;                      /* thumb un peu plus gros au survol */
}
.kanban-sticky-scrollbar::-webkit-scrollbar-track {
  background: transparent;
}
.kanban-sticky-scrollbar::-webkit-scrollbar-thumb {
  background: var(--muted-soft);
  border-radius: var(--r-pill);
  border: none;                      /* thumb plein hauteur · gris franc */
}
.kanban-sticky-scrollbar:hover::-webkit-scrollbar-thumb {
  background: var(--muted);          /* plus contraste au survol */
}
.kanban-sticky-scrollbar::-webkit-scrollbar-thumb:hover {
  background: var(--muted);
}

/* ── Firefox ─────────────────────────────────────────────────
   Firefox ne comprend PAS ::-webkit-scrollbar · il faut son systeme
   natif scrollbar-width / scrollbar-color. Mais on ne peut pas mettre
   scrollbar-width globalement (Chrome 121+ ignorerait alors les regles
   webkit ci-dessus). On isole donc ce reglage a Firefox via
   @supports (-moz-appearance: none) · verifie faux sur Chrome moderne.

   Limite Firefox · scrollbar-width ne prend que auto|thin|none, pas de
   pixels · donc pas de grossissement au survol. On donne au moins une
   barre coloree, visible et attrapable (auto = largeur normale), avec
   une hauteur de conteneur stable pour qu elle ne soit pas coupee. */
@supports (-moz-appearance: none) {
  .kanban-sticky-scrollbar,
  .kanban-sticky-scrollbar:hover {
    height: 17px;
    scrollbar-width: auto;
    scrollbar-color: var(--muted-soft) transparent;
  }
}
