/* =====================================================================
 * ez-scroll.css — premium, lightweight scroll-polish layer (v3.47)
 * ---------------------------------------------------------------------
 * Loaded LAST in all three shells (app / public / platform-admin) so it
 * can layer on top of eazydev.css / public-premium.css / platform-admin.css.
 *
 * Pure CSS — no JS, no library, no scroll hijacking. It only:
 *   1. Adds smooth document scrolling + sticky-aware anchor offsets.
 *   2. Contains overscroll on INNER scroll regions (so a scroll inside a
 *      modal / sidebar / dropdown / switch-panel never chains to the page).
 *   3. Gives the surfaces that lacked one a consistent brand scrollbar +
 *      iOS momentum scrolling (table-wrap / sidebar-nav / tabs already had
 *      tuned scrollbars and are NOT overridden here).
 *   4. Keeps the native page feel — root pull-to-refresh / rubber-band is
 *      left intact; only inner containers are contained.
 *
 * Fully `prefers-reduced-motion` aware: smooth scrolling is disabled when
 * the user asks for reduced motion.
 * ===================================================================== */

/* ---------------------------------------------------------------------
 * 1. Document: smooth scroll + sticky-aware anchor offset
 * ------------------------------------------------------------------- */
html {
    scroll-behavior: smooth;
    /* Keep #anchor targets clear of the sticky topbar / public nav. */
    scroll-padding-top: 84px;
}
/* Per-shell offset tuning (modern :has(); silently falls back to 84px). */
html:has(body.app-shell) { scroll-padding-top: 80px; }
html:has(body.pa-shell)  { scroll-padding-top: 74px; }

/* iOS momentum scrolling for the main document + auth shell scroller. */
html, body { -webkit-overflow-scrolling: touch; }

/* ---------------------------------------------------------------------
 * 2. Consistent premium page scrollbar (desktop pointers only).
 *    Touch devices keep their native auto-hiding scrollbars.
 * ------------------------------------------------------------------- */
@media (pointer: fine) {
    html {
        scrollbar-width: thin;
        scrollbar-color: rgba(99, 102, 241, 0.38) transparent;
    }
    html::-webkit-scrollbar { width: 13px; height: 13px; }
    html::-webkit-scrollbar-track { background: transparent; }
    html::-webkit-scrollbar-thumb {
        background: rgba(99, 102, 241, 0.32);
        border-radius: 999px;
        border: 3px solid transparent;
        background-clip: content-box;
    }
    html::-webkit-scrollbar-thumb:hover {
        background: rgba(99, 102, 241, 0.52);
        background-clip: content-box;
    }
    html::-webkit-scrollbar-thumb:active {
        background: rgba(99, 102, 241, 0.62);
        background-clip: content-box;
    }
}

/* ---------------------------------------------------------------------
 * 3. Inner scroll regions — momentum + contained overscroll.
 *    `.ez-smooth` is a reusable hook for any new scrollable element.
 * ------------------------------------------------------------------- */
.ez-smooth,
.modal-body,
.modal-dialog-scrollable .modal-body,
.offcanvas-body,
.dropdown-menu,
.ez-fab__list,
.ez-fab__sheet,
.table-wrap,
.table-responsive,
.ez-scrollbar,
.subnav,
.ez-scroll-tabs,
.ai-range,
.health-range,
.sidebar-nav,
.pa-nav,
.pa-content,
.pa-table-wrap {
    -webkit-overflow-scrolling: touch;
    overscroll-behavior: contain;
}

/* ---------------------------------------------------------------------
 * 4. Premium scrollbar for the surfaces that DID NOT already define one
 *    (modal / offcanvas / dropdown / FAB switch-panel). The table-wrap,
 *    sidebar-nav, pa-table-wrap and tab rows keep their existing tuned
 *    scrollbars — they are intentionally excluded below.
 * ------------------------------------------------------------------- */
.ez-smooth,
.modal-body,
.offcanvas-body,
.dropdown-menu,
.ez-fab__list,
.ez-fab__sheet {
    scrollbar-width: thin;
    scrollbar-color: rgba(99, 102, 241, 0.35) transparent;
}
.ez-smooth::-webkit-scrollbar,
.modal-body::-webkit-scrollbar,
.offcanvas-body::-webkit-scrollbar,
.dropdown-menu::-webkit-scrollbar,
.ez-fab__list::-webkit-scrollbar,
.ez-fab__sheet::-webkit-scrollbar {
    width: 9px;
    height: 9px;
}
.ez-smooth::-webkit-scrollbar-track,
.modal-body::-webkit-scrollbar-track,
.offcanvas-body::-webkit-scrollbar-track,
.dropdown-menu::-webkit-scrollbar-track,
.ez-fab__list::-webkit-scrollbar-track,
.ez-fab__sheet::-webkit-scrollbar-track {
    background: transparent;
    margin: 4px 0;
}
.ez-smooth::-webkit-scrollbar-thumb,
.modal-body::-webkit-scrollbar-thumb,
.offcanvas-body::-webkit-scrollbar-thumb,
.dropdown-menu::-webkit-scrollbar-thumb,
.ez-fab__list::-webkit-scrollbar-thumb,
.ez-fab__sheet::-webkit-scrollbar-thumb {
    background: rgba(99, 102, 241, 0.32);
    border-radius: 999px;
    border: 2px solid transparent;
    background-clip: content-box;
}
.ez-smooth::-webkit-scrollbar-thumb:hover,
.modal-body::-webkit-scrollbar-thumb:hover,
.offcanvas-body::-webkit-scrollbar-thumb:hover,
.dropdown-menu::-webkit-scrollbar-thumb:hover,
.ez-fab__list::-webkit-scrollbar-thumb:hover,
.ez-fab__sheet::-webkit-scrollbar-thumb:hover {
    background: rgba(99, 102, 241, 0.50);
    background-clip: content-box;
}

/* ---------------------------------------------------------------------
 * 5. Horizontal scroll regions — momentum + reachable first/last item.
 *    (Tabs/subnav already set scroll-behavior + scroll-padding-inline in
 *    eazydev.css; we only reinforce the touch + edge-padding contract so
 *    long filter rows never trap the first/last chip under an edge.)
 * ------------------------------------------------------------------- */
.table-wrap,
.table-responsive {
    overscroll-behavior-x: contain;
}
.ez-scroll-tabs,
.subnav,
.ai-range,
.health-range {
    scroll-padding-inline: 16px;
    overscroll-behavior-x: contain;
}

/* ---------------------------------------------------------------------
 * 6. Touch sliders (reviews / carousels) — let vertical page scroll pass
 *    through while still allowing horizontal swipe of the slide.
 * ------------------------------------------------------------------- */
.carousel-item,
.ez-rev-slide,
.ez-rev-carousel .carousel-inner {
    touch-action: pan-y;
}

/* ---------------------------------------------------------------------
 * 7. Accessibility — never force smooth/animated scroll when the user
 *    prefers reduced motion.
 * ------------------------------------------------------------------- */
@media (prefers-reduced-motion: reduce) {
    html { scroll-behavior: auto; }
}