/**
 * ChatGPT-like overlay scrollbars — site-wide.
 * Thin pill thumb (~6px), transparent track, sits over content.
 */

:root,
html[data-theme="light"] {
    --chatgpt-scroll-size: 6px;
    --chatgpt-scroll-thumb: #d1d1d1;
    --chatgpt-scroll-thumb-hover: #b4b4b4;
    --chatgpt-scroll-thumb-active: #9a9a9a;
    --chatgpt-scroll-track: transparent;
}

html[data-theme="dark"] {
    --chatgpt-scroll-thumb: rgba(255, 255, 255, 0.28);
    --chatgpt-scroll-thumb-hover: rgba(255, 255, 255, 0.42);
    --chatgpt-scroll-thumb-active: rgba(255, 255, 255, 0.55);
}

/* Firefox */
* {
    scrollbar-width: thin;
    scrollbar-color: var(--chatgpt-scroll-thumb) var(--chatgpt-scroll-track);
}

/* Chromium / Safari / Edge */
*::-webkit-scrollbar {
    width: var(--chatgpt-scroll-size);
    height: var(--chatgpt-scroll-size);
}

*::-webkit-scrollbar-button {
    display: none;
    width: 0;
    height: 0;
}

*::-webkit-scrollbar-track {
    background: var(--chatgpt-scroll-track);
}

*::-webkit-scrollbar-thumb {
    background-color: var(--chatgpt-scroll-thumb);
    border-radius: 999px;
    border: 0;
    min-height: 40px;
}

*::-webkit-scrollbar-thumb:hover {
    background-color: var(--chatgpt-scroll-thumb-hover);
}

*::-webkit-scrollbar-thumb:active {
    background-color: var(--chatgpt-scroll-thumb-active);
}

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

/* ChatGPT panes: independent scroll regions (not the whole document) */
.chat-sidebar__scroll,
.chat-thread__scroll,
.chat-stage,
.prmta-scroll {
    overscroll-behavior: contain;
    scrollbar-gutter: auto;
    scrollbar-width: thin;
    scrollbar-color: var(--chatgpt-scroll-thumb) transparent;
}

.chat-sidebar__scroll::-webkit-scrollbar,
.chat-thread__scroll::-webkit-scrollbar,
.prmta-scroll::-webkit-scrollbar {
    width: var(--chatgpt-scroll-size);
    height: var(--chatgpt-scroll-size);
}

.chat-sidebar__scroll::-webkit-scrollbar-thumb,
.chat-thread__scroll::-webkit-scrollbar-thumb,
.prmta-scroll::-webkit-scrollbar-thumb {
    background-color: var(--chatgpt-scroll-thumb);
    border-radius: 999px;
}

.chat-sidebar__scroll::-webkit-scrollbar-thumb:hover,
.chat-thread__scroll::-webkit-scrollbar-thumb:hover,
.prmta-scroll::-webkit-scrollbar-thumb:hover {
    background-color: var(--chatgpt-scroll-thumb-hover);
}

/* Touch: hide chrome, keep native momentum scroll */
@media (pointer: coarse) {
    .chat-sidebar__scroll,
    .chat-thread__scroll,
    .prmta-scroll {
        scrollbar-width: none;
    }

    .chat-sidebar__scroll::-webkit-scrollbar,
    .chat-thread__scroll::-webkit-scrollbar,
    .prmta-scroll::-webkit-scrollbar {
        width: 0;
        height: 0;
    }
}