/* General Styling & Scrollbar */
:root {
    color-scheme: light dark;
}
::-webkit-scrollbar { width: 6px; }
::-webkit-scrollbar-track { background: #f1f5f9; }
.dark ::-webkit-scrollbar-track { background: #1e293b; } /* slate-800 */
::-webkit-scrollbar-thumb { background: #cbd5e1; border-radius: 3px; }
.dark ::-webkit-scrollbar-thumb { background: #475569; } /* slate-600 */
::-webkit-scrollbar-thumb:hover { background: #94a3b8; }
.dark ::-webkit-scrollbar-thumb:hover { background: #64748b; } /* slate-500 */

/* Input Date Picker Styling */
input[type="date"]::-webkit-calendar-picker-indicator { filter: invert(0.5); }
.dark input[type="date"]::-webkit-calendar-picker-indicator { filter: invert(0.8); }

/* Element Transitions */
#side-menu, #toast-notification { transition: transform 0.3s ease-in-out, opacity 0.3s; }

/* Animations */
@keyframes fadeInUp {
    from { opacity: 0; transform: translateY(10px); }
    to { opacity: 1; transform: translateY(0); }
}
.fade-in-up {
    animation: fadeInUp 0.5s ease-out forwards;
    opacity: 0;
}

/* Subtle Background Pattern */
.subtle-bg {
    background-image: radial-gradient(#cbd5e1 0.5px, transparent 0.5px);
    background-size: 15px 15px;
}
.dark .subtle-bg {
    background-image: radial-gradient(#334155 0.5px, transparent 0.5px);
}

/* Toggle Switch Styling */
.toggle-checkbox:checked {
    right: 0;
    border-color: #14b8a6;
}
.toggle-checkbox:checked + .toggle-label {
    background-color: #14b8a6;
}

/* Accent Text */
.gradient-text {
    color: #22d3ee;
}

/* [UI UPGRADE] Animated Notification Bell Styling */
.notification-button {
    position: relative;
    border-radius: 100%;
    border: none;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    transition: all 0.2s ease;
}
.notification-button:active { transform: scale(0.9); }