/* ── App scrollbars (ONE definition for the whole dashboard) ──────────────
   Every scrollbar in the BI app — the page itself, the chat thread, the
   glossary panes and modals, and the users/usage tables — is themed here.
   Do NOT restyle a scrollbar inside a page's own <style>: a second
   definition drifts from this one and the two then disagree.

   Palette: teal thumb (--primary) on a pale-teal track (--primary-light),
   deepening to --primary-dark on hover. Same tokens as the chips and the
   selected row, so nothing here competes with the rest of the theme.

   WHY THE @supports SPLIT — this is load-bearing, do not "simplify" it.
   Chromium 121+ implements the standard `scrollbar-width` / `scrollbar-color`
   properties, and when EITHER is set to a non-auto value Chromium ignores
   the ::-webkit-scrollbar pseudo-elements entirely. Setting both is the
   common advice and it is wrong: the width and radius below get silently
   dropped and Chrome renders a default-width square bar. Verified on Chrome
   148 — the unguarded combination gave a 10px bar with a 6px thumb and no
   radius, exactly the "unthemed" look this file exists to remove.
   So the standard properties are handed ONLY to engines that have no
   ::-webkit-scrollbar (Firefox), and WebKit/Blink gets the pseudo-elements
   it actually honours. Result: identical treatment in both.

   Custom properties come from each page's own :root — var() resolves at
   computed-value time, so link order does not matter.
   ---------------------------------------------------------------------- */

/* Firefox (and any engine without ::-webkit-scrollbar). */
@supports not selector(::-webkit-scrollbar) {
  * {
    scrollbar-width: thin;
    scrollbar-color: var(--primary) var(--primary-light);
  }
}

/* WebKit / Blink — full control over width, radius and hover. */
*::-webkit-scrollbar { width: 8px; height: 8px; }
*::-webkit-scrollbar-track { background: var(--primary-light); border-radius: 999px; }
*::-webkit-scrollbar-thumb { background: var(--primary); border-radius: 999px; }
*::-webkit-scrollbar-thumb:hover { background: var(--primary-dark); }
/* Where a horizontal and a vertical bar meet — e.g. a table that scrolls
   both ways. Left unset it is white, which shows up as a notch. */
*::-webkit-scrollbar-corner { background: var(--primary-light); }