/* =============================================================================
   Proactos — ONE scrollbar style for the WHOLE app (build once, use everywhere).

   Link this into every first-party surface (the PWA shell + every iframed/standalone
   view: operations graph, galaxy, doc-review, schema-builder, …) so scrollbars are
   identical instead of each surface falling back to its own OS default — which read
   as a mismatched, "Frankenstein" patchwork.

   Self-contained: it defines its own tokens (no dependency on each surface's token
   names) and is theme-aware via [data-theme]. A slim, pill-shaped, semi-transparent
   thumb that sits unobtrusively on any dark or light Proactos surface.
   ============================================================================ */
:root{
  --pa-sb-size: 10px;                         /* track width/height */
  --pa-sb-thumb: rgba(120,150,190,.42);       /* default (dark surfaces) */
  --pa-sb-thumb-hover: rgba(120,150,190,.72);
}
[data-theme="light"]{
  --pa-sb-thumb: rgba(70,95,130,.36);
  --pa-sb-thumb-hover: rgba(70,95,130,.62);
}

/* Firefox */
*{ scrollbar-width: thin; scrollbar-color: var(--pa-sb-thumb) transparent; }

/* WebKit / Chromium / Safari */
::-webkit-scrollbar{ width: var(--pa-sb-size); height: var(--pa-sb-size); }
::-webkit-scrollbar-track{ background: transparent; }
::-webkit-scrollbar-thumb{
  background: var(--pa-sb-thumb);
  border-radius: 999px;
  border: 3px solid transparent;              /* inset padding → slim ~4px pill */
  background-clip: padding-box;
}
::-webkit-scrollbar-thumb:hover{ background: var(--pa-sb-thumb-hover); }
::-webkit-scrollbar-corner{ background: transparent; }