/* ============================================================================
   no-pull-refresh.css - global overscroll / pull-to-refresh control.

   Linked from every shared layout (_Layout, _LayoutAdmin, _LayoutOperator,
   _LayoutPublic, _LayoutPublicMobile, _LayoutAuth, _LayoutSignUpSignIn) so it
   applies app-wide instead of being patched page by page.

   Problem: on mobile, dragging down at the top of the page - or at the end of
   an inner scroller (sidebar/offcanvas, modal, DataTable, long list) - chains
   up to the document and fires the browser's pull-to-refresh, reloading the
   whole app.

   Fix, in two parts:
     1. html/body: `overscroll-behavior-y: none` switches the browser's pull-to-
        refresh (and overscroll glow/bounce) off for the main document. This is
        the property Chrome for Android honours; it only affects the *overscroll
        reaction*, never normal scrolling, so sticky/fixed headers and the fixed
        bottom nav are unaffected. (iOS Safari has no in-page pull-to-refresh to
        begin with; 16+ also understands this property, older versions ignore it
        harmlessly.)
     2. Overlay scrollers (offcanvas, modal, sidebar, bottom sheet...): `overscroll-behavior: contain`
        keeps their scroll inside themselves - reaching the end no longer chains to the page
        behind. Tables are NOT overlays: they are contained sideways only (see below), so the page
        keeps scrolling when the pointer / finger is over a table.

   Deliberately NOT done: no `touch-action` on html/body and no `overflow:hidden`
   on the document. `touch-action: none/pan-y` would block horizontal swipes and
   pinch-zoom, and locking document overflow breaks normal page scrolling; neither
   is needed to stop pull-to-refresh.
   ========================================================================== */

html,
body {
    overscroll-behavior-y: none;
}

/* Scroll containers - contain overscroll (both axes) so it never reaches the page. */
.offcanvas,
.offcanvas-body,
.modal,
.modal-body,
.sidebar,
.sidebar-links,
.custom-nav-offcanvas,
.custom-nav-body,
.cal-popup,
.cal-months-wrapper,
.mobile-bottom-sheet {
    overscroll-behavior: contain;
}

/* Tables (Bootstrap .table-responsive, DataTables incl. the scrollY body) sit INSIDE the page, they are not overlays: contain them only
   sideways. With `contain` on the vertical axis too, a wheel / touch scroll that began over the table - or reached the table's own
   end - never continued to the page, so the page "stopped scrolling" while the pointer was over a table (desktop and mobile app).
   Pull-to-refresh stays off through `html, body { overscroll-behavior-y: none }` above, which is the part that actually disables it. */
.table-responsive,
.dataTables_wrapper,
.dataTables_scroll,
.dataTables_scrollBody,
.dt-container,
.dt-scroll,
.dt-scroll-body {
    overscroll-behavior-x: contain;
    overscroll-behavior-y: auto;
}

/* Momentum scrolling for the vertically scrolling panels on older iOS (a no-op on
   current versions, where it is the default). */
.offcanvas-body,
.modal,
.modal-body,
.sidebar-links,
.custom-nav-body,
.dataTables_scrollBody,
.dt-scroll-body {
    -webkit-overflow-scrolling: touch;
}