/* ═══════════════════════════════════════════════════════════
   ZAD — Global themed scrollbars (all themes, all pages)
   ═══════════════════════════════════════════════════════════ */

:root, .theme-zad-light {
    --scrollbar-size: 8px;
    --scrollbar-track: rgba(15, 23, 42, 0.07);
    --scrollbar-thumb-color: #0078d4;
    --scrollbar-thumb-hover: #005a9e;
}

.theme-zad {
    --scrollbar-track: rgba(15, 23, 42, 0.08);
    --scrollbar-thumb-color: #1e3a5f;
    --scrollbar-thumb-hover: #d97706;
}

.theme-obsidian {
    --scrollbar-track: rgba(255, 255, 255, 0.06);
    --scrollbar-thumb-color: #818cf8;
    --scrollbar-thumb-hover: #a5b4fc;
}

.theme-copper {
    --scrollbar-track: rgba(67, 20, 7, 0.08);
    --scrollbar-thumb-color: #ea580c;
    --scrollbar-thumb-hover: #fb923c;
}

/* Firefox */
html,
body,
.app-shell,
.app-shell *,
.login-page,
.login-page * {
    scrollbar-width: thin;
    scrollbar-color: var(--scrollbar-thumb-color) var(--scrollbar-track);
}

/* WebKit — all scrollable areas */
html::-webkit-scrollbar,
body::-webkit-scrollbar,
.app-shell ::-webkit-scrollbar,
.login-page ::-webkit-scrollbar,
.settings-drawer::-webkit-scrollbar,
.modal-card::-webkit-scrollbar,
.receipt-panel::-webkit-scrollbar {
    width: var(--scrollbar-size);
    height: var(--scrollbar-size);
}

html::-webkit-scrollbar-track,
body::-webkit-scrollbar-track,
.app-shell ::-webkit-scrollbar-track,
.login-page ::-webkit-scrollbar-track,
.settings-drawer::-webkit-scrollbar-track,
.modal-card::-webkit-scrollbar-track,
.receipt-panel::-webkit-scrollbar-track {
    background: var(--scrollbar-track);
    border-radius: 10px;
}

html::-webkit-scrollbar-thumb,
body::-webkit-scrollbar-thumb,
.app-shell ::-webkit-scrollbar-thumb,
.login-page ::-webkit-scrollbar-thumb,
.settings-drawer::-webkit-scrollbar-thumb,
.modal-card::-webkit-scrollbar-thumb,
.receipt-panel::-webkit-scrollbar-thumb {
    background: linear-gradient(180deg, var(--scrollbar-thumb-color), var(--scrollbar-thumb-hover));
    border-radius: 10px;
    border: 2px solid transparent;
    background-clip: padding-box;
    min-height: 32px;
}

html::-webkit-scrollbar-thumb:hover,
body::-webkit-scrollbar-thumb:hover,
.app-shell ::-webkit-scrollbar-thumb:hover,
.login-page ::-webkit-scrollbar-thumb:hover,
.settings-drawer::-webkit-scrollbar-thumb:hover,
.modal-card::-webkit-scrollbar-thumb:hover,
.receipt-panel::-webkit-scrollbar-thumb:hover {
    background: linear-gradient(180deg, var(--scrollbar-thumb-hover), var(--scrollbar-thumb-color));
    background-clip: padding-box;
}

html::-webkit-scrollbar-corner,
body::-webkit-scrollbar-corner,
.app-shell ::-webkit-scrollbar-corner,
.login-page ::-webkit-scrollbar-corner {
    background: transparent;
}

/* ─── Prevent stray horizontal page scroll ─── */
html,
body,
#app {
    overflow-x: hidden;
    max-width: 100%;
}

.app-shell,
.main-wrapper,
.page-body,
.panel-card,
.pos-left,
.pos-right,
.pos-screen,
.split-panel,
.report-document,
.modal-card,
.settings-drawer {
    max-width: 100%;
    box-sizing: border-box;
}

/* Vertical-only scroll regions */
.page-body,
.nav-menu,
.perm-grid,
.notification-list,
.notification-panel,
.settings-drawer,
.modal-card,
.purchase-history-panel .table-wrap,
.label-preview-wrap {
    overflow-x: hidden;
    overflow-y: auto;
}

/* Products scroll inside grid; cart lines expand with content */
.pos-left {
    overflow: hidden;
}
.pos-right {
    overflow: visible;
}
.pos-right .cart-lines,
.pos-workspace .cart-lines {
    overflow-x: hidden;
    overflow-y: visible;
}
.pos-left .touch-grid,
.pos-workspace .touch-grid {
    overflow-x: hidden;
    overflow-y: auto;
}

/* Tables: horizontal scroll only — never trap vertical mouse-wheel */
.table-wrap {
    overflow-x: auto;
    overflow-y: visible;
    max-width: 100%;
    -webkit-overflow-scrolling: touch;
}

@media (min-width: 769px) {
    .table-wrap:not(.force-x-scroll):not(.acc-tb-scroll) {
        overflow-x: auto;
    }
}

/* Thin horizontal scrollbar when table must scroll on mobile */
.table-wrap::-webkit-scrollbar:horizontal {
    height: 6px;
}

/* Hide horizontal scrollbar on cart / POS panels — layout should not overflow */
.cart-lines,
.touch-grid,
.product-grid,
.pos-totals,
.pos-actions,
.pos-supplier-row {
    overflow-x: hidden;
}
