/**
 * ODL LMS - Dark Mode (CSS Variables)
 */

[data-theme="dark"] {
    --body-bg: #0f1419;
    --card-bg: #1a2332;
    --text-primary: #e8eaed;
    --text-secondary: #9aa0a6;
    --border-color: #2d3748;
    --shadow-sm: 0 1px 3px rgba(0, 0, 0, 0.3);
    --shadow-md: 0 4px 12px rgba(0, 0, 0, 0.4);
}

[data-theme="dark"] .app-navbar,
[data-theme="dark"] .app-footer {
    background: var(--card-bg);
    border-color: var(--border-color);
}

[data-theme="dark"] .stat-card,
[data-theme="dark"] .card {
    background: var(--card-bg);
    color: var(--text-primary);
}

[data-theme="dark"] .form-control,
[data-theme="dark"] .form-select {
    background: #0f1419;
    border-color: var(--border-color);
    color: var(--text-primary);
}

[data-theme="dark"] .auth-form-panel {
    background: var(--card-bg);
}

[data-theme="dark"] .quick-link-btn {
    background: #0f1419;
    color: var(--text-primary);
}

[data-theme="dark"] .dropdown-menu {
    background: var(--card-bg);
    border-color: var(--border-color);
}

[data-theme="dark"] .dropdown-item {
    color: var(--text-primary);
}

[data-theme="dark"] .dropdown-item:hover {
    background: #0f1419;
}

[data-theme="dark"] .table {
    --bs-table-bg: var(--card-bg);
    --bs-table-color: var(--text-primary);
    --bs-table-border-color: var(--border-color);
}

[data-theme="dark"] #darkModeToggle .fa-moon::before {
    content: "\f185";
}