/* ===================================
   UNIVERSAL SCROLLBAR STYLING
   Konsisten dengan desain scrollbar pagination
   =================================== */

/* Default scrollbar styling untuk semua elemen yang scrollable */
::-webkit-scrollbar {
    width: 8px;
    height: 8px;
}

::-webkit-scrollbar-track {
    background: rgba(0, 0, 0, 0.1);
    border-radius: 4px;
}

::-webkit-scrollbar-thumb {
    background: rgba(59, 130, 246, 0.6);
    border-radius: 4px;
    border: 1px solid rgba(59, 130, 246, 0.3);
}

::-webkit-scrollbar-thumb:hover {
    background: rgba(59, 130, 246, 0.8);
}

::-webkit-scrollbar-corner {
    background: rgba(0, 0, 0, 0.1);
}

/* Firefox scrollbar */
* {
    scrollbar-width: thin;
    scrollbar-color: rgba(59, 130, 246, 0.6) rgba(0, 0, 0, 0.1);
}

/* Dark mode scrollbar */
.dark ::-webkit-scrollbar-track {
    background: rgba(255, 255, 255, 0.1);
}

.dark ::-webkit-scrollbar-thumb {
    background: rgba(59, 130, 246, 0.7);
    border-color: rgba(59, 130, 246, 0.4);
}

.dark ::-webkit-scrollbar-thumb:hover {
    background: rgba(59, 130, 246, 0.9);
}

.dark ::-webkit-scrollbar-corner {
    background: rgba(255, 255, 255, 0.1);
}

.dark * {
    scrollbar-color: rgba(59, 130, 246, 0.7) rgba(255, 255, 255, 0.1);
}

/* Specific scrollbar untuk elemen-elemen tertentu */
.table-container::-webkit-scrollbar,
.overflow-x-auto::-webkit-scrollbar,
.overflow-y-auto::-webkit-scrollbar,
.overflow-auto::-webkit-scrollbar,
.custom-scrollbar::-webkit-scrollbar {
    width: 8px;
    height: 8px;
}

.table-container::-webkit-scrollbar-track,
.overflow-x-auto::-webkit-scrollbar-track,
.overflow-y-auto::-webkit-scrollbar-track,
.overflow-auto::-webkit-scrollbar-track,
.custom-scrollbar::-webkit-scrollbar-track {
    background: rgba(0, 0, 0, 0.1);
    border-radius: 4px;
}

.table-container::-webkit-scrollbar-thumb,
.overflow-x-auto::-webkit-scrollbar-thumb,
.overflow-y-auto::-webkit-scrollbar-thumb,
.overflow-auto::-webkit-scrollbar-thumb,
.custom-scrollbar::-webkit-scrollbar-thumb {
    background: rgba(59, 130, 246, 0.6);
    border-radius: 4px;
    border: 1px solid rgba(59, 130, 246, 0.3);
}

.table-container::-webkit-scrollbar-thumb:hover,
.overflow-x-auto::-webkit-scrollbar-thumb:hover,
.overflow-y-auto::-webkit-scrollbar-thumb:hover,
.overflow-auto::-webkit-scrollbar-thumb:hover,
.custom-scrollbar::-webkit-scrollbar-thumb:hover {
    background: rgba(59, 130, 246, 0.8);
}

/* Dark mode untuk specific elements */
.dark .table-container::-webkit-scrollbar-track,
.dark .overflow-x-auto::-webkit-scrollbar-track,
.dark .overflow-y-auto::-webkit-scrollbar-track,
.dark .overflow-auto::-webkit-scrollbar-track,
.dark .custom-scrollbar::-webkit-scrollbar-track {
    background: rgba(255, 255, 255, 0.1);
}

.dark .table-container::-webkit-scrollbar-thumb,
.dark .overflow-x-auto::-webkit-scrollbar-thumb,
.dark .overflow-y-auto::-webkit-scrollbar-thumb,
.dark .overflow-auto::-webkit-scrollbar-thumb,
.dark .custom-scrollbar::-webkit-scrollbar-thumb {
    background: rgba(59, 130, 246, 0.7);
    border-color: rgba(59, 130, 246, 0.4);
}

.dark .table-container::-webkit-scrollbar-thumb:hover,
.dark .overflow-x-auto::-webkit-scrollbar-thumb:hover,
.dark .overflow-y-auto::-webkit-scrollbar-thumb:hover,
.dark .overflow-auto::-webkit-scrollbar-thumb:hover,
.dark .custom-scrollbar::-webkit-scrollbar-thumb:hover {
    background: rgba(59, 130, 246, 0.9);
}

/* Scrollbar untuk textarea dan select */
textarea::-webkit-scrollbar,
select::-webkit-scrollbar {
    width: 8px;
    height: 8px;
}

textarea::-webkit-scrollbar-track,
select::-webkit-scrollbar-track {
    background: rgba(0, 0, 0, 0.1);
    border-radius: 4px;
}

textarea::-webkit-scrollbar-thumb,
select::-webkit-scrollbar-thumb {
    background: rgba(59, 130, 246, 0.6);
    border-radius: 4px;
    border: 1px solid rgba(59, 130, 246, 0.3);
}

textarea::-webkit-scrollbar-thumb:hover,
select::-webkit-scrollbar-thumb:hover {
    background: rgba(59, 130, 246, 0.8);
}

.dark textarea::-webkit-scrollbar-track,
.dark select::-webkit-scrollbar-track {
    background: rgba(255, 255, 255, 0.1);
}

.dark textarea::-webkit-scrollbar-thumb,
.dark select::-webkit-scrollbar-thumb {
    background: rgba(59, 130, 246, 0.7);
    border-color: rgba(59, 130, 246, 0.4);
}

.dark textarea::-webkit-scrollbar-thumb:hover,
.dark select::-webkit-scrollbar-thumb:hover {
    background: rgba(59, 130, 246, 0.9);
}

/* Scrollbar untuk modal content */
.modal-content::-webkit-scrollbar,
.modal-box::-webkit-scrollbar,
.modal-body::-webkit-scrollbar {
    width: 8px;
}

.modal-content::-webkit-scrollbar-track,
.modal-box::-webkit-scrollbar-track,
.modal-body::-webkit-scrollbar-track {
    background: rgba(0, 0, 0, 0.1);
    border-radius: 4px;
}

.modal-content::-webkit-scrollbar-thumb,
.modal-box::-webkit-scrollbar-thumb,
.modal-body::-webkit-scrollbar-thumb {
    background: rgba(59, 130, 246, 0.6);
    border-radius: 4px;
    border: 1px solid rgba(59, 130, 246, 0.3);
}

.modal-content::-webkit-scrollbar-thumb:hover,
.modal-box::-webkit-scrollbar-thumb:hover,
.modal-body::-webkit-scrollbar-thumb:hover {
    background: rgba(59, 130, 246, 0.8);
}

.dark .modal-content::-webkit-scrollbar-track,
.dark .modal-box::-webkit-scrollbar-track,
.dark .modal-body::-webkit-scrollbar-track {
    background: rgba(255, 255, 255, 0.1);
}

.dark .modal-content::-webkit-scrollbar-thumb,
.dark .modal-box::-webkit-scrollbar-thumb,
.dark .modal-body::-webkit-scrollbar-thumb {
    background: rgba(59, 130, 246, 0.7);
    border-color: rgba(59, 130, 246, 0.4);
}

.dark .modal-content::-webkit-scrollbar-thumb:hover,
.dark .modal-box::-webkit-scrollbar-thumb:hover,
.dark .modal-body::-webkit-scrollbar-thumb:hover {
    background: rgba(59, 130, 246, 0.9);
}

/* Scrollbar untuk dropdown dan menu */
.dropdown-content::-webkit-scrollbar,
.menu::-webkit-scrollbar,
.nav-menu::-webkit-scrollbar {
    width: 8px;
}

.dropdown-content::-webkit-scrollbar-track,
.menu::-webkit-scrollbar-track,
.nav-menu::-webkit-scrollbar-track {
    background: rgba(0, 0, 0, 0.1);
    border-radius: 4px;
}

.dropdown-content::-webkit-scrollbar-thumb,
.menu::-webkit-scrollbar-thumb,
.nav-menu::-webkit-scrollbar-thumb {
    background: rgba(59, 130, 246, 0.6);
    border-radius: 4px;
    border: 1px solid rgba(59, 130, 246, 0.3);
}

.dropdown-content::-webkit-scrollbar-thumb:hover,
.menu::-webkit-scrollbar-thumb:hover,
.nav-menu::-webkit-scrollbar-thumb:hover {
    background: rgba(59, 130, 246, 0.8);
}

.dark .dropdown-content::-webkit-scrollbar-track,
.dark .menu::-webkit-scrollbar-track,
.dark .nav-menu::-webkit-scrollbar-track {
    background: rgba(255, 255, 255, 0.1);
}

.dark .dropdown-content::-webkit-scrollbar-thumb,
.dark .menu::-webkit-scrollbar-thumb,
.dark .nav-menu::-webkit-scrollbar-thumb {
    background: rgba(59, 130, 246, 0.7);
    border-color: rgba(59, 130, 246, 0.4);
}

.dark .dropdown-content::-webkit-scrollbar-thumb:hover,
.dark .menu::-webkit-scrollbar-thumb:hover,
.dark .nav-menu::-webkit-scrollbar-thumb:hover {
    background: rgba(59, 130, 246, 0.9);
}