/* ==================== DARK MODE STYLES ==================== */

body.dark-mode {
  background: #0f172a;
  color: #e2e8f0;
}

/* Login Screen */
body.dark-mode #loginScreen {
  background: linear-gradient(135deg, #1e293b 0%, #0f172a 100%);
}

body.dark-mode .login-container {
  background: rgba(30, 41, 59, 0.9);
  backdrop-filter: blur(20px);
}

body.dark-mode .login-form {
  background: #1e293b;
}

body.dark-mode .form-input {
  background: #0f172a;
  border-color: #334155;
  color: #e2e8f0;
}

body.dark-mode .form-input:focus {
  border-color: #60a5fa;
  background: #1e293b;
}

body.dark-mode .form-input::placeholder {
  color: #64748b;
}

/* Main Portal */
body.dark-mode .portal-header {
  background: #1e293b;
  border-bottom-color: #334155;
}

body.dark-mode .sidebar {
  background: #1e293b;
  border-right-color: #334155;
}

body.dark-mode .nav-item {
  color: #cbd5e1;
}

body.dark-mode .nav-item:hover {
  background: #334155;
  color: #ffffff;
}

body.dark-mode .nav-item.active {
  background: #3b82f6;
  color: white;
}

body.dark-mode .content-area {
  background: #0f172a;
}

body.dark-mode .content-title {
  color: #f1f5f9;
}

body.dark-mode .content-subtitle {
  color: #94a3b8;
}

/* Cards & Boxes */
body.dark-mode [style*="background:white"],
body.dark-mode [style*="background: white"] {
  background: #1e293b !important;
}

body.dark-mode [style*="background:#f8fafc"],
body.dark-mode [style*="background: #f8fafc"] {
  background: #334155 !important;
}

body.dark-mode [style*="color:#0f172a"],
body.dark-mode [style*="color: #0f172a"] {
  color: #f1f5f9 !important;
}

body.dark-mode [style*="color:#64748b"],
body.dark-mode [style*="color: #64748b"] {
  color: #94a3b8 !important;
}

body.dark-mode [style*="border:2px solid #e2e8f0"],
body.dark-mode [style*="border: 2px solid #e2e8f0"] {
  border-color: #334155 !important;
}

/* Modals */
body.dark-mode [id*="Modal"] > div {
  background: #1e293b !important;
  color: #e2e8f0 !important;
}

/* Inputs in dark mode */
body.dark-mode input[type="text"],
body.dark-mode input[type="number"],
body.dark-mode input[type="date"],
body.dark-mode input[type="email"],
body.dark-mode input[type="password"],
body.dark-mode textarea,
body.dark-mode select {
  background: #0f172a;
  border-color: #334155;
  color: #e2e8f0;
}

body.dark-mode input::placeholder,
body.dark-mode textarea::placeholder {
  color: #64748b;
}

/* Tables */
body.dark-mode table {
  background: #1e293b;
}

body.dark-mode th {
  background: #334155 !important;
  color: #f1f5f9 !important;
}

body.dark-mode td {
  border-color: #334155 !important;
  color: #cbd5e1 !important;
}

body.dark-mode tr:hover {
  background: #334155 !important;
}

/* Buttons */
body.dark-mode .btn {
  background: #334155;
  color: #e2e8f0;
  border-color: #475569;
}

body.dark-mode .btn:hover {
  background: #475569;
}

body.dark-mode .btn-primary {
  background: #3b82f6;
  color: white;
}

body.dark-mode .btn-primary:hover {
  background: #2563eb;
}

/* Notifications */
body.dark-mode .notification {
  background: #1e293b;
  border-color: #334155;
  color: #e2e8f0;
}

/* Loading overlay */
body.dark-mode #loadingOverlay {
  background: rgba(15, 23, 42, 0.95);
}

/* Scrollbar */
body.dark-mode ::-webkit-scrollbar {
  width: 10px;
  background: #0f172a;
}

body.dark-mode ::-webkit-scrollbar-thumb {
  background: #334155;
  border-radius: 5px;
}

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