/* Shared scrollbar tokens for every scrollable application surface. */
:root,
[data-bs-theme="light"] {
    --imx-scroll-track: #edf1f5;
    --imx-scroll-thumb: #a3adb8;
    --imx-scroll-thumb-hover: #64748b;
    --imx-scroll-border: rgba(255, 255, 255, .82);
}

[data-bs-theme="dark"] {
    --imx-scroll-track: #20262d;
    --imx-scroll-thumb: #59636e;
    --imx-scroll-thumb-hover: #8793a1;
    --imx-scroll-border: rgba(15, 23, 42, .9);
}

/* Never change overflow on html/body/app layout: AdminLTE's fixed sidebar relies
   on the original document scrolling context. Only style known scroll surfaces. */
html,
body,
:where(.table-responsive, .overflow-auto, .overflow-scroll, .sidebar-wrapper,
    .os-viewport, .dropdown-menu, .modal-body, .offcanvas-body,
    .cr-matrix-scroll, .cr-list, .mw-body, .cc-multi-list,
    .cd-drawer, .bd-map-panel, .report-pages, .select2-results__options) {
    scrollbar-width: thin;
    scrollbar-color: var(--imx-scroll-thumb) var(--imx-scroll-track);
}

.table-responsive {
    max-width: 100%;
    overscroll-behavior-inline: contain;
}

.table-responsive:focus-visible {
    outline: 2px solid rgba(var(--bs-primary-rgb), .55);
    outline-offset: -2px;
}

html::-webkit-scrollbar,
body::-webkit-scrollbar,
:where(.table-responsive, .overflow-auto, .overflow-scroll, .sidebar-wrapper,
    .os-viewport, .dropdown-menu, .modal-body, .offcanvas-body,
    .cr-matrix-scroll, .cr-list, .mw-body, .cc-multi-list,
    .cd-drawer, .bd-map-panel, .report-pages, .select2-results__options)::-webkit-scrollbar {
    width: 10px;
    height: 10px;
}

html::-webkit-scrollbar-track,
body::-webkit-scrollbar-track,
:where(.table-responsive, .overflow-auto, .overflow-scroll, .sidebar-wrapper,
    .os-viewport, .dropdown-menu, .modal-body, .offcanvas-body,
    .cr-matrix-scroll, .cr-list, .mw-body, .cc-multi-list,
    .cd-drawer, .bd-map-panel, .report-pages, .select2-results__options)::-webkit-scrollbar-track {
    background: var(--imx-scroll-track);
    border-radius: 999px;
}

html::-webkit-scrollbar-thumb,
body::-webkit-scrollbar-thumb,
:where(.table-responsive, .overflow-auto, .overflow-scroll, .sidebar-wrapper,
    .os-viewport, .dropdown-menu, .modal-body, .offcanvas-body,
    .cr-matrix-scroll, .cr-list, .mw-body, .cc-multi-list,
    .cd-drawer, .bd-map-panel, .report-pages, .select2-results__options)::-webkit-scrollbar-thumb {
    min-height: 30px;
    background: var(--imx-scroll-thumb);
    border: 2px solid var(--imx-scroll-border);
    border-radius: 999px;
}

html::-webkit-scrollbar-thumb:hover,
body::-webkit-scrollbar-thumb:hover,
:where(.table-responsive, .overflow-auto, .overflow-scroll, .sidebar-wrapper,
    .os-viewport, .dropdown-menu, .modal-body, .offcanvas-body,
    .cr-matrix-scroll, .cr-list, .mw-body, .cc-multi-list,
    .cd-drawer, .bd-map-panel, .report-pages, .select2-results__options)::-webkit-scrollbar-thumb:hover {
    background: var(--imx-scroll-thumb-hover);
}

html::-webkit-scrollbar-corner,
body::-webkit-scrollbar-corner,
:where(.table-responsive, .overflow-auto, .overflow-scroll, .sidebar-wrapper,
    .os-viewport, .dropdown-menu, .modal-body, .offcanvas-body,
    .cr-matrix-scroll, .cr-list, .mw-body, .cc-multi-list,
    .cd-drawer, .bd-map-panel, .report-pages, .select2-results__options)::-webkit-scrollbar-corner {
    background: var(--imx-scroll-track);
}

/* Third-party sidebar scrollbar follows the same colors. */
.os-theme-light,
.os-theme-dark {
    --os-handle-bg: var(--imx-scroll-thumb);
    --os-handle-bg-hover: var(--imx-scroll-thumb-hover);
    --os-handle-bg-active: var(--imx-scroll-thumb-hover);
    --os-track-bg: var(--imx-scroll-track);
}