/* Shared by the web app and the desktop app's remote content.
   Important declarations intentionally replace legacy per-panel scrollbar skins.
   Keep scrolling native: no wheel handlers, overlays or scroll-position resets. */
:root {
    --kavare-scroll-track: #111111;
    --kavare-scroll-thumb: #0060ff;
    --kavare-scroll-hover: #3380ff;
    --kavare-scroll-active: #80b1ff;
    --kavare-scroll-size: 8px;
}
:root, :root * {
    scrollbar-width: thin !important;
    scrollbar-color: var(--kavare-scroll-thumb) var(--kavare-scroll-track) !important;
}
/* Chromium/Electron: standard non-auto values override the pseudo-element
   skin, so use auto here to retain rounded thumbs and individual hover states. */
@supports selector(::-webkit-scrollbar) {
    :root, :root * { scrollbar-width: auto !important; scrollbar-color: auto !important; }
}
::-webkit-scrollbar {
    width: var(--kavare-scroll-size) !important;
    height: var(--kavare-scroll-size) !important;
    background: var(--kavare-scroll-track) !important;
}
::-webkit-scrollbar-track {
    background: var(--kavare-scroll-track) !important;
    border-radius: 999px !important;
    margin: 4px !important;
}
::-webkit-scrollbar-thumb {
    min-width: 32px !important;
    min-height: 32px !important;
    background: var(--kavare-scroll-thumb) !important;
    border: 2px solid var(--kavare-scroll-track) !important;
    background-clip: padding-box !important;
    border-radius: 999px !important;
    box-shadow: none !important;
}
::-webkit-scrollbar-thumb:hover { background-color: var(--kavare-scroll-hover) !important; }
::-webkit-scrollbar-thumb:active { background-color: var(--kavare-scroll-active) !important; }
::-webkit-scrollbar-corner { background: var(--kavare-scroll-track) !important; }
::-webkit-scrollbar-button { display: none !important; width: 0 !important; height: 0 !important; }
/* The compact server icon rail intentionally has no visible track. */
:root .workspace-server-list { scrollbar-width: none !important; }
.workspace-server-list::-webkit-scrollbar { width: 0 !important; height: 0 !important; display: none !important; }
@media (pointer: coarse) {
    :root { --kavare-scroll-size: 12px; }
    :root, :root * { scrollbar-width: auto !important; }
    :root .workspace-server-list { scrollbar-width: none !important; }
}
@media (forced-colors: active) {
    :root, :root * { scrollbar-color: auto !important; scrollbar-width: auto !important; }
    ::-webkit-scrollbar { width: auto !important; height: auto !important; background: Canvas !important; }
    ::-webkit-scrollbar-track, ::-webkit-scrollbar-corner { background: Canvas !important; }
    ::-webkit-scrollbar-thumb { background: ButtonText !important; border-color: Canvas !important; }
    ::-webkit-scrollbar-thumb:hover, ::-webkit-scrollbar-thumb:active { background: Highlight !important; }
}
