/* Dark Mode Refinements */

/* 1. Dashboard Icon Backgrounds */
.icon-bg-primary {
    background-color: #EEF2FF;
    color: var(--primary);
}

.icon-bg-success {
    background-color: #ECFDF5;
    color: var(--success);
}

.icon-bg-warning {
    background-color: #FFFBEB;
    color: var(--accent);
}

body.dark-mode .icon-bg-primary {
    background-color: rgba(37, 99, 235, 0.15);
    /* Primary with opacity */
    color: #60A5FA;
    /* Lighter Blue */
}

body.dark-mode .icon-bg-success {
    background-color: rgba(16, 185, 129, 0.15);
    color: #34D399;
    /* Lighter Green */
}

body.dark-mode .icon-bg-warning {
    background-color: rgba(245, 158, 11, 0.15);
    color: #FBBF24;
    /* Lighter Yellow */
}

/* 2. Settings Inputs */
.settings-input {
    background-color: #f9fafb;
    border: 1px solid transparent;
    color: var(--text-main);
}

body.dark-mode .settings-input {
    background-color: #374151;
    /* Dark gray */
    color: #F9FAFB;
}

/* 3. Table Headers */
.table-header {
    border-bottom: 2px solid #E5E7EB;
    color: var(--text-muted);
}

body.dark-mode .table-header {
    border-bottom-color: #374151;
    color: #9CA3AF;
}

/* 4. General Table Rows */
body.dark-mode .data-table td {
    border-bottom-color: #374151;
    color: #F3F4F6;
}

/* 5. Profile Card Data Rows */
body.dark-mode .data-row {
    border-bottom-color: #374151;
    /* If they have borders */
}

body.dark-mode .data-value {
    color: #F3F4F6;
}

/* 6. Mobile Nav */
body.dark-mode .mobile-nav {
    background: #1F2937;
    border-top: 1px solid #374151;
}

body.dark-mode .mobile-nav-item span {
    color: #9CA3AF;
}

body.dark-mode .mobile-nav-item.active span {
    color: var(--primary);
}

/* 7. Dropdowns */
body.dark-mode .profile-dropdown,
body.dark-mode .notif-dropdown {
    background-color: #1F2937;
    border-color: #374151;
    color: #F3F4F6;
}

body.dark-mode .dropdown-item:hover {
    background-color: #374151;
}

/* 8. Loaders and Empty States */
body.dark-mode .loader-spinner {
    border-color: #374151;
    border-top-color: var(--primary);
}

/* 9. Scrollbars */
body.dark-mode ::-webkit-scrollbar-track {
    background: #111827;
}

body.dark-mode ::-webkit-scrollbar-thumb {
    background: #4B5563;
}

body.dark-mode ::-webkit-scrollbar-thumb:hover {
    background: #6B7280;
}