/**
 * Globale Scrollbars: maximal 3px breit, einfaches Design, einheitliches Dunkelgrau (#282A2E).
 * Gilt in allen Menüs und überall, wo es eine Scroll-View mit Handle gibt.
 * !important damit keine spezifischen Regeln (z. B. in chat.css, media.css) breitere/andere Scrollbars erzwingen.
 * Ausnahme: Stellen, die Scrollbar komplett ausblenden (width: 0 / display: none), bleiben unverändert.
 */

/* WebKit (Chrome, Safari, Edge) – alle scrollbaren Elemente */
*::-webkit-scrollbar {
    width: 3px !important;
    height: 3px !important;
    background: transparent !important;
}

*::-webkit-scrollbar-track,
*::-webkit-scrollbar-track-piece {
    background: transparent !important;
    border: none !important;
    box-shadow: none !important;
}

*::-webkit-scrollbar-thumb {
    background: #282A2E !important;
    border-radius: 0 !important;
}

*::-webkit-scrollbar-thumb:hover {
    background: #282A2E !important;
}

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

/* Viewport-Scroll (manche Browser stylen html/body separat) */
html::-webkit-scrollbar,
body::-webkit-scrollbar {
    width: 3px !important;
    height: 3px !important;
    background: transparent !important;
}

html::-webkit-scrollbar-track,
html::-webkit-scrollbar-track-piece,
body::-webkit-scrollbar-track,
body::-webkit-scrollbar-track-piece {
    background: transparent !important;
}

/* Firefox */
* {
    scrollbar-width: thin !important;
    scrollbar-color: #282A2E transparent !important;
}

html,
body {
    scrollbar-color: #282A2E transparent !important;
}