/**
 * Site-wide modern scrollbar treatment. Loaded once via includes/client_boot.php
 * so every page that boots through it (which is effectively every page on the
 * site) gets the same scrollbar styling — no per-page CSS edits needed.
 */

html {
    scroll-behavior: smooth;
}

* {
    scrollbar-width: thin;
    scrollbar-color: #7c8cff transparent;
}

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

*::-webkit-scrollbar-track {
    background: transparent;
}

*::-webkit-scrollbar-thumb {
    background-color: #6c7bff;
    background-image: linear-gradient(180deg, #6c7bff, #a06cff);
    background-clip: padding-box;
    border: 2px solid transparent;
    border-radius: 999px;
    transition: background-image .2s ease, box-shadow .2s ease;
}

*::-webkit-scrollbar-thumb:hover {
    background-image: linear-gradient(180deg, #8b97ff, #ba8dff);
    box-shadow: 0 0 10px rgba(124, 140, 255, .55);
}

*::-webkit-scrollbar-thumb:active {
    background-image: linear-gradient(180deg, #a06cff, #6c7bff);
}

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

/* Scrolling the sidebar to its top/bottom must not hand the leftover scroll
   delta off to the main page (or any other ancestor scroll container) —
   without this, reaching the end of the sidebar's own content keeps scrolling
   whatever's behind it. */
.sidebar {
    overscroll-behavior: contain;
}

/* Auto-hide the sidebar nav's scrollbar: invisible at rest, fades in only
   while hovering or keyboard-focused inside it — the thumb still reserves
   its usual width, so nothing shifts when it appears. */
.sidebar {
    scrollbar-color: transparent transparent;
}
.sidebar:hover,
.sidebar:focus-within {
    scrollbar-color: #7c8cff transparent;
}
.sidebar::-webkit-scrollbar-thumb {
    background-color: transparent;
    background-image: none;
}
.sidebar:hover::-webkit-scrollbar-thumb,
.sidebar:focus-within::-webkit-scrollbar-thumb {
    background-color: #6c7bff;
    background-image: linear-gradient(180deg, #6c7bff, #a06cff);
}

@media (prefers-reduced-motion: reduce) {
    html { scroll-behavior: auto; }
    *::-webkit-scrollbar-thumb { transition: none; }
}
