/* ===========================
   Dark Mode Overrides
   =========================== */

/* ── Login Page ──────────────────────────────────────────── */
body.dark-mode {
    background: linear-gradient(135deg, #1a1a2e 0%, #16213e 100%);
}

body.dark-mode .login-container {
    background: #1e293b;
    box-shadow: 0 15px 35px rgba(0,0,0,0.3);
}

body.dark-mode .login-header {
    background: linear-gradient(135deg, #0f172a 0%, #1e293b 100%);
}

body.dark-mode .login-header h1 {
    color: #f8fafc;
}

body.dark-mode .login-header p {
    color: #94a3b8;
}

body.dark-mode .login-form {
    background: #1e293b;
}

body.dark-mode .form-group label {
    color: #f8fafc;
}

body.dark-mode .input-with-icon input {
    background: #334155;
    border-color: #475569;
    color: #f8fafc;
}

body.dark-mode .input-with-icon input:focus {
    border-color: #d9822b;
    background: #1e293b;
    box-shadow: 0 0 0 3px rgba(217, 130, 43, 0.15);
}

body.dark-mode .input-with-icon i {
    color: #94a3b8;
}

body.dark-mode .error-message {
    background: rgba(239, 68, 68, 0.15);
    border-color: rgba(239, 68, 68, 0.3);
    color: #fca5a5;
}

body.dark-mode .success-message {
    background: rgba(16, 185, 129, 0.15);
    border-color: rgba(16, 185, 129, 0.3);
    color: #6ee7b7;
}

body.dark-mode .rate-limit-warning {
    background: rgba(245, 158, 11, 0.15);
    border-color: rgba(245, 158, 11, 0.3);
    color: #fcd34d;
}

body.dark-mode .footer-links {
    border-top-color: rgba(255, 255, 255, 0.06);
}

body.dark-mode .footer-links a {
    color: #f4b350;
}

/* ── Error Pages ──────────────────────────────────────────── */
body.dark-mode {
    background: linear-gradient(135deg, #1a1a2e 0%, #0f0f23 100%);
}

body.dark-mode .error-container {
    background: #1e293b;
    box-shadow: 0 20px 60px rgba(0,0,0,0.3);
}

body.dark-mode .error-title {
    color: #f8fafc;
}

body.dark-mode .error-message {
    color: #94a3b8;
}

body.dark-mode .error-body {
    background: #0f172a;
}

body.dark-mode .error-details {
    background: #1e293b;
    border-color: rgba(255, 255, 255, 0.06);
}

body.dark-mode .error-detail-item {
    border-bottom-color: rgba(255, 255, 255, 0.06);
}

body.dark-mode .error-detail-label {
    color: #94a3b8;
}

body.dark-mode .error-detail-value {
    color: #f8fafc;
}

body.dark-mode .btn-secondary {
    background: #334155;
    color: #f8fafc;
}

body.dark-mode .btn-secondary:hover {
    background: #475569;
}

body.dark-mode .btn-outline {
    color: #f8fafc;
    border-color: rgba(255, 255, 255, 0.06);
}

body.dark-mode .btn-outline:hover {
    border-color: #667eea;
    color: #667eea;
}

body.dark-mode .error-footer {
    background: #0f172a;
}

/* ── Legacy style.css overrides ──────────────────────────── */
body.dark-mode {
    background: #0f172a;
}

body.dark-mode .header {
    background: #0f172a;
}

body.dark-mode .sidebar {
    background: #1e293b;
}

body.dark-mode .main-content {
    background: #1e293b;
    box-shadow: 0 2px 12px rgba(0,0,0,0.2);
}

body.dark-mode .form-group label {
    color: #f8fafc;
}

body.dark-mode .form-group input,
body.dark-mode .form-group select,
body.dark-mode .form-group textarea {
    background: #334155;
    border-color: #475569;
    color: #f8fafc;
}

body.dark-mode .form-group input:focus,
body.dark-mode .form-group select:focus,
body.dark-mode .form-group textarea:focus {
    border-color: #d9822b;
    outline: none;
}

body.dark-mode table {
    background: #1e293b;
}

body.dark-mode table th {
    background: #0f172a;
    color: #f8fafc;
    border-color: rgba(255, 255, 255, 0.06);
}

body.dark-mode table td {
    border-color: rgba(255, 255, 255, 0.06);
    color: #e2e8f0;
}

body.dark-mode table tr:hover td {
    background: rgba(255, 255, 255, 0.02);
}

body.dark-mode table tr:nth-child(even) td {
    background: rgba(255, 255, 255, 0.02);
}

body.dark-mode .btn {
    background: #334155;
    color: #f8fafc;
}

body.dark-mode .btn:hover {
    background: #475569;
}

body.dark-mode .form-grid {
    border-color: transparent;
}

/* ── Attendance Status Badges (keep contrast) ────────────── */
body.dark-mode .status-active,
body.dark-mode .status-paid,
body.dark-mode .status-present {
    background: rgba(16, 185, 129, 0.15);
    color: #6ee7b7;
    border-color: rgba(16, 185, 129, 0.3);
}

body.dark-mode .status-inactive,
body.dark-mode .status-overdue,
body.dark-mode .status-absent {
    background: rgba(239, 68, 68, 0.15);
    color: #fca5a5;
    border-color: rgba(239, 68, 68, 0.3);
}

body.dark-mode .status-transferred,
body.dark-mode .status-pending,
body.dark-mode .status-excused {
    background: rgba(245, 158, 11, 0.15);
    color: #fcd34d;
    border-color: rgba(245, 158, 11, 0.3);
}

body.dark-mode .status-cancelled {
    background: rgba(100, 116, 139, 0.15);
    color: #94a3b8;
    border-color: rgba(100, 116, 139, 0.3);
}

/* ── Financial / Reports ────────────────────────────────── */
body.dark-mode .leave-info {
    background: rgba(59, 130, 246, 0.1);
    border-color: rgba(59, 130, 246, 0.3);
}

body.dark-mode .leave-info h4 {
    color: #f8fafc;
}

body.dark-mode .leave-note {
    background: rgba(245, 158, 11, 0.1);
    border-color: rgba(245, 158, 11, 0.3);
}

body.dark-mode .attendance-stat-card {
    background: #1e293b;
    box-shadow: 0 2px 12px rgba(0,0,0,0.2);
}

body.dark-mode h2,
body.dark-mode h3,
body.dark-mode h4 {
    color: #f8fafc;
}

body.dark-mode p,
body.dark-mode span:not(.badge *) {
    color: #e2e8f0;
}

/* ── Misc helpers ────────────────────────────────────────── */
body.dark-mode .section-card,
body.dark-mode .std-card,
body.dark-mode .plan-card,
body.dark-mode .report-card {
    background: #1e293b;
    border-color: rgba(255, 255, 255, 0.06);
}

body.dark-mode .filter-section {
    background: #0f172a;
    border-color: rgba(255, 255, 255, 0.06);
}

body.dark-mode .filter-section label {
    color: #f8fafc;
}
