/* Tüm uygulamada ince, yuvarlak kaydırma çubuğu (sayfa, pencereler, tablolar, açılır listeler).
   Görünüm temanın SimpleBar çubuğuyla aynı (app.css: .simplebar-scrollbar:before). JS yok; SimpleBar kullanan
   alanlar (menü, bildirimler) kendi çubuğunu gizlediği için etkilenmez. */
:root {
    --wb-scrollbar-thumb: #a2adb7;
    --wb-scrollbar-thumb-hover: #878a99;
}

[data-layout-mode=dark] {
    --wb-scrollbar-thumb: rgba(255, 255, 255, 0.25);
    --wb-scrollbar-thumb-hover: rgba(255, 255, 255, 0.4);
}

/* Chrome, Edge, Safari */
::-webkit-scrollbar {
    width: 8px;
    height: 8px;
}

::-webkit-scrollbar-track,
::-webkit-scrollbar-corner {
    background: transparent;
}

::-webkit-scrollbar-thumb {
    background-color: var(--wb-scrollbar-thumb);
    border-radius: 7px;
    border: 2px solid transparent; /* çubuğu kenarlardan içeri çeker: SimpleBar'daki gibi ince görünür */
    background-clip: padding-box;
}

::-webkit-scrollbar-thumb:hover {
    background-color: var(--wb-scrollbar-thumb-hover);
}

/* Firefox. Chrome 121+ bu iki özelliği görünce yukarıdaki ::-webkit-scrollbar kurallarını yok saydığı için
   yalnız ::-webkit-scrollbar desteklemeyen tarayıcılarda uygulanır. */
@supports not selector(::-webkit-scrollbar) {
    * {
        scrollbar-width: thin;
        scrollbar-color: var(--wb-scrollbar-thumb) transparent;
    }
}