/* ==============================================================
   CUSTOM SCROLLBARS
   Centralized scrollbar styling for the entire system
   ============================================================== */

/* Global Scrollbar */
::-webkit-scrollbar {
    width: 6px;
    height: 6px; /* For horizontal scrollbars */
}

::-webkit-scrollbar-track {
    background: var(--bg-dark);
}

::-webkit-scrollbar-thumb {
    background: var(--border);
    border-radius: 10px;
    transition: var(--transition);
}

::-webkit-scrollbar-thumb:hover {
    background: var(--text-muted);
}

/* Specific Fine Scrollbars (for tables and overflow containers) */
.table-responsive::-webkit-scrollbar,
.custom-scroll::-webkit-scrollbar,
.sidebar-nav::-webkit-scrollbar {
    width: 6px;
    height: 6px;
}

.table-responsive::-webkit-scrollbar-track,
.custom-scroll::-webkit-scrollbar-track,
.sidebar-nav::-webkit-scrollbar-track {
    background: rgba(var(--white-rgb), 0.02);
}

.table-responsive::-webkit-scrollbar-thumb,
.custom-scroll::-webkit-scrollbar-thumb,
.sidebar-nav::-webkit-scrollbar-thumb {
    background: rgba(var(--primary-rgb), 0.2);
    border-radius: 10px;
}

.table-responsive::-webkit-scrollbar-thumb:hover,
.custom-scroll::-webkit-scrollbar-thumb:hover,
.sidebar-nav::-webkit-scrollbar-thumb:hover {
    background: var(--primary);
}