/* ============================================================
   NeuBit VMS — panel fit support styles
   ------------------------------------------------------------
   Works with ui-fit.js, which adds .nb-scrollable to any panel whose
   content does not fit the space its layout gives it.

   The scrollbar is deliberately quiet: these are dense operator
   screens, and a loud browser scrollbar inside a card reads as a
   defect. It sits in the console's own palette and only picks up
   colour when the panel is hovered.
   ============================================================ */

.nb-scrollable {
  scrollbar-width: thin;
  scrollbar-color: rgba(150, 180, 245, .3) transparent;
  overscroll-behavior: contain;      /* don't chain to the page behind it */
}

.nb-scrollable::-webkit-scrollbar {
  width: 8px;
  height: 8px;
}

.nb-scrollable::-webkit-scrollbar-track {
  background: transparent;
}

.nb-scrollable::-webkit-scrollbar-thumb {
  background: rgba(150, 180, 245, .22);
  border-radius: 4px;
  border: 2px solid transparent;
  background-clip: content-box;
}

.nb-scrollable:hover::-webkit-scrollbar-thumb {
  background: rgba(150, 180, 245, .42);
  background-clip: content-box;
}

.nb-scrollable::-webkit-scrollbar-thumb:hover {
  background: rgba(34, 211, 238, .55);
  background-clip: content-box;
}