/* Universal Scrollbar Styling for All Pages */
/* This matches the EventManagement scrollbar exactly - thick gradient scrollbar */

/* Custom Scrollbar for Webkit browsers (Chrome, Safari, Edge) */
::-webkit-scrollbar {
    width: 10px;
}

::-webkit-scrollbar-track {
    background: var(--overlay-light, rgba(255, 255, 255, 0.1));
}

::-webkit-scrollbar-thumb {
    background: var(--primary-gradient, linear-gradient(135deg, #E31837 0%, #1E3A8A 50%, #DC2626 100%));
  border-radius: 5px;
}

::-webkit-scrollbar-thumb:hover {
    background: var(--secondary-gradient, linear-gradient(135deg, #E31837 0%, #1E3A8A 100%));
}

/* Firefox scrollbar */
html {
    scrollbar-width: thin;
    scrollbar-color: #E31837 rgba(255, 255, 255, 0.1);
}

/* Scrollbar for specific containers (modals, tables, etc.) */
.modal-content::-webkit-scrollbar,
.table-wrapper::-webkit-scrollbar,
.events-section::-webkit-scrollbar,
.attendee-list::-webkit-scrollbar,
.mobile-nav::-webkit-scrollbar {
    width: 10px;
}

.modal-content::-webkit-scrollbar-track,
.table-wrapper::-webkit-scrollbar-track,
.events-section::-webkit-scrollbar-track,
.attendee-list::-webkit-scrollbar-track,
.mobile-nav::-webkit-scrollbar-track {
    background: rgba(255, 255, 255, 0.1);
}

.modal-content::-webkit-scrollbar-thumb,
.table-wrapper::-webkit-scrollbar-thumb,
.events-section::-webkit-scrollbar-thumb,
.attendee-list::-webkit-scrollbar-thumb,
.mobile-nav::-webkit-scrollbar-thumb {
 background: linear-gradient(135deg, #E31837 0%, #1E3A8A 50%, #DC2626 100%);
    border-radius: 5px;
}

.modal-content::-webkit-scrollbar-thumb:hover,
.table-wrapper::-webkit-scrollbar-thumb:hover,
.events-section::-webkit-scrollbar-thumb:hover,
.attendee-list::-webkit-scrollbar-thumb:hover,
.mobile-nav::-webkit-scrollbar-thumb:hover {
    background: linear-gradient(135deg, #E31837 0%, #1E3A8A 100%);
}