/* Shared scrollbar treatment. These rules style existing overflow surfaces only;
   they never create a scroll container or alter data/layout behavior. */
:root{
  scrollbar-color:#69788a #edf1f5;
  scrollbar-width:auto;
}

html,
body,
.table-wrap,
.booking-list-table,
.detail-table-wrap,
.train-table-wrap,
.account-tabs,
.advance-quick,
.sidebar nav,
#dialog,
#dialog form,
#dialog:has(.staff-editor) #form-fields{
  scrollbar-color:#69788a #edf1f5;
  scrollbar-width:auto;
}

@media (pointer:fine){
  ::-webkit-scrollbar{width:13px;height:13px}
  ::-webkit-scrollbar-track{background:#edf1f5;border-radius:12px}
  ::-webkit-scrollbar-thumb{min-height:44px;border:3px solid #edf1f5;border-radius:12px;background:#69788a;background-clip:padding-box}
  ::-webkit-scrollbar-thumb:hover{background:#465567;background-clip:padding-box}
  ::-webkit-scrollbar-thumb:active{background:#334155;background-clip:padding-box}
  ::-webkit-scrollbar-corner{background:#edf1f5}
}

/* The booking table is the primary two-axis scroll surface. Reserve its gutter
   so the sticky header remains aligned while it scrolls. */
.booking-list-table{
  scrollbar-gutter:stable;
  overscroll-behavior:contain;
}

.booking-list-table::-webkit-scrollbar-track{background:#edf3fb}
.booking-list-table::-webkit-scrollbar-thumb{border-color:#edf3fb;background:#65789a;background-clip:padding-box}
.booking-list-table::-webkit-scrollbar-thumb:hover{background:#405773;background-clip:padding-box}
.booking-list-table::-webkit-scrollbar-thumb:active{background:#2d4159;background-clip:padding-box}
.booking-list-table::-webkit-scrollbar-corner{background:#edf3fb}

@media (pointer:coarse){
  .booking-list-table,.detail-table-wrap,.train-table-wrap{-webkit-overflow-scrolling:touch}
}