/*
 * LifeHUD standard scrollbars.
 * Keep scrollbar treatment here instead of page-specific CSS so HUD, vehicles,
 * drawers, tables, grocery shopping mode, and planner scrollers all behave the same.
 *
 * This pass is intentionally flat: no gutter shadow, no track border, no thumb glow.
 */
:root {
    --standard-scrollbar-track: transparent;
    --standard-scrollbar-thumb: rgba(154, 174, 132, .62);
    --standard-scrollbar-thumb-hover: rgba(184, 205, 152, .78);
}

html,
body,
* {
    scrollbar-gutter: auto !important;
}

* {
    scrollbar-color: var(--standard-scrollbar-thumb) transparent !important;
    scrollbar-width: thin !important;
}

*::-webkit-scrollbar {
    width: 9px;
    height: 9px;
}

*::-webkit-scrollbar-track,
*::-webkit-scrollbar-track-piece {
    background: transparent !important;
    border: 0 !important;
    box-shadow: none !important;
}

*::-webkit-scrollbar-thumb {
    min-height: 34px;
    background: var(--standard-scrollbar-thumb) !important;
    background-clip: padding-box !important;
    border: 2px solid transparent !important;
    border-radius: 0 !important;
    box-shadow: none !important;
}

*::-webkit-scrollbar-thumb:hover {
    background: var(--standard-scrollbar-thumb-hover) !important;
    background-clip: padding-box !important;
    box-shadow: none !important;
}

*::-webkit-scrollbar-corner {
    background: transparent !important;
}

body,
.standard-page-wrap,
.standard-main,
.standard-page-content,
.standard-drawer-body,
.left-drawer .drawer-inner,
.standard-nav,
.standard-card-scroll,
.hud-card-scroll,
.grocery-shopping-list,
.life-planner-scroll {
    overscroll-behavior: contain;
}

/* The meal-planner week strip is a horizontal scroller. Do not contain vertical
   wheel overscroll here, or normal page scrolling gets trapped when the mouse is
   over the planner grid/cards. */
.planner-user-week-scroll {
    overscroll-behavior-x: contain !important;
    overscroll-behavior-y: auto !important;
}

/*
 * Table wrappers are usually horizontal scrollers only. If vertical overscroll is
 * contained here, mouse-wheel / trackpad scroll gets trapped while hovering over
 * a table. Keep horizontal containment, but let vertical wheel movement bubble to
 * the page or drawer body.
 */
.standard-table-wrap,
.table-wrap,
.grocery-table-wrap,
.planner-table-wrap,
.health-target-table-wrap,
.health-history-table-wrap,
.vehicle-info-table-wrap,
.vehicle-documents-table-wrap,
.vehicle-maintenance-table-wrap,
.vehicle-view-parts-wrap {
    overflow-x: auto !important;
    overscroll-behavior-x: contain !important;
    overscroll-behavior-y: auto !important;
}

/* V3 edge-shadow cleanup.
   The dark vertical band beside the browser scrollbar was not coming from a real
   scrollbar shadow. It was the page vignette/background bleeding through the
   transparent scrollbar gutter. Keep this file last in layout.php. */
html,
body {
    scrollbar-gutter: auto !important;
    background-color: #1e2224 !important;
}

body {
    overflow-y: auto !important;
}

body::after {
    display: none !important;
    content: none !important;
}

body::-webkit-scrollbar,
html::-webkit-scrollbar,
*::-webkit-scrollbar {
    background: transparent !important;
    box-shadow: none !important;
}

body::-webkit-scrollbar-track,
html::-webkit-scrollbar-track,
*::-webkit-scrollbar-track,
body::-webkit-scrollbar-track-piece,
html::-webkit-scrollbar-track-piece,
*::-webkit-scrollbar-track-piece {
    background: transparent !important;
    border: 0 !important;
    box-shadow: none !important;
}

.standard-page-wrap,
.standard-main,
.standard-page-content {
    filter: none !important;
}

.standard-page-wrap::before,
.standard-page-wrap::after,
.standard-main::before,
.standard-main::after,
.standard-page-content::before,
.standard-page-content::after {
    box-shadow: none !important;
    filter: none !important;
}

/*
 * Off-canvas drawer shadow bleed fix.
 * The right-edge "scrollbar shadow" was coming from closed .side-panel drawers:
 * they are translated off-screen, but their negative left box-shadow can still bleed
 * back into the viewport. Keep closed drawers invisible and shadowless; restore the
 * drawer chrome only once JS adds .is-open.
 */
.side-panel:not(.is-open),
.side-panel.standard-fullscreen-drawer:not(.is-open),
.side-panel.large-width:not(.is-open),
.side-panel.standard-wide-drawer:not(.is-open) {
    visibility: hidden !important;
    pointer-events: none !important;
    box-shadow: none !important;
    filter: none !important;
}

.side-panel.is-open,
.side-panel.standard-fullscreen-drawer.is-open,
.side-panel.large-width.is-open,
.side-panel.standard-wide-drawer.is-open {
    visibility: visible !important;
    pointer-events: auto !important;
}

.side-panel:not(.is-open)::before,
.side-panel:not(.is-open)::after {
    box-shadow: none !important;
    filter: none !important;
}

@media (max-width: 1024px) {
    .left-drawer:not(.is-open) {
        visibility: hidden !important;
        pointer-events: none !important;
        box-shadow: none !important;
        filter: none !important;
    }

    .left-drawer.is-open {
        visibility: visible !important;
        pointer-events: auto !important;
    }
}

/* Remove residual page-edge lighting/vignettes after every page-specific CSS file. */
html,
body {
    background: #121617 !important;
}

body {
    background-image: none !important;
}

body::after {
    display: none !important;
    content: none !important;
}