/* ==========================================================================
   Barre de défilement personnalisée (piste fixe 5px + curseur piloté en JS)
   Style repris à l'identique de la démo. Logique : assets/js/scrollbar.js
   ========================================================================== */
/* Couleur adaptative : la piste et le curseur sont blancs translucides avec
   mix-blend-mode:difference → ils deviennent sombres sur les fonds clairs et
   clairs sur les fonds sombres (photos comprises), pixel par pixel, sans JS. */
:root{
  --scroll-track:rgba(255,255,255,.12);
  --scroll-thumb:rgba(255,255,255,.55);
  --scroll-thumb-hover:rgba(255,255,255,.85);
  /* repli fixe pour les barres des éléments internes */
  --scroll-track-solid:#1a1a1a;
  --scroll-thumb-solid:#555555;
  --scroll-thumb-solid-hover:#888888;
}

/* barre native de la page masquée : remplacée entièrement par la nôtre */
html{ scrollbar-width:none; -ms-overflow-style:none; }
html::-webkit-scrollbar,
body::-webkit-scrollbar{ display:none; width:0; height:0; }

/* piste, fixe sur toute la hauteur de l'écran, à droite */
.scrollbar-track{
  position:fixed;
  top:0; right:0;
  width:5px;
  height:100vh;
  background:var(--scroll-track);
  mix-blend-mode:difference;
  z-index:1000;
}

/* curseur, positionné/dimensionné dynamiquement en JS selon le scroll réel */
.scrollbar-thumb{
  position:absolute;
  right:0;
  width:5px;
  background:var(--scroll-thumb);
  border-radius:0;
  transition:background .2s ease;
  cursor:grab;
}
.scrollbar-thumb:hover,
.scrollbar-thumb.dragging{ background:var(--scroll-thumb-hover); }
.scrollbar-thumb.dragging{ cursor:grabbing; }

/* barres des éléments internes (listes, fenêtres modales…) : même palette */
*{ scrollbar-width:thin; scrollbar-color:var(--scroll-thumb-solid) var(--scroll-track-solid); }
*::-webkit-scrollbar{ width:5px; height:5px; }
*::-webkit-scrollbar-track{ background:var(--scroll-track-solid); }
*::-webkit-scrollbar-thumb{ background:var(--scroll-thumb-solid); border-radius:0; }
*::-webkit-scrollbar-thumb:hover{ background:var(--scroll-thumb-solid-hover); }
html::-webkit-scrollbar, body::-webkit-scrollbar{ display:none; }