/* Dark theme overrides */

html[data-theme='dark'] {
  color-scheme: dark;
}

html[data-theme='dark'] body {
  --bg: #0b1220;
  --panel: #111a2e;
  --text: #e5edf9;
  --muted: #93a4bf;
  --line: #1f2d49;
  --primary: #3b82f6;
  --primary-soft: #1d4ed8;
  --shadow: 0 10px 28px rgba(2, 6, 23, 0.45);
}

html[data-theme='dark'] .theme-switch {
  border-color: #365278;
  background: linear-gradient(180deg, #15223a, #0f1a2d);
  color: #d6e4f8;
}

html[data-theme='dark'] .theme-switch-track {
  border-color: #3d5a81;
  background: #172740;
}

html[data-theme='dark'] .theme-switch-thumb {
  background: #dbeafe;
}

html[data-theme='dark'] .topbar-right .logout-btn {
  border-color: #3a4b66;
  background: linear-gradient(180deg, #1f2b3f, #162236);
  color: #dbeafe;
}

html[data-theme='dark'] .topbar-right .logout-btn:hover {
  border-color: #4e6587;
  background: linear-gradient(180deg, #26364f, #1d2b42);
}

html[data-theme='dark'] .logout-icon {
  color: #9dc2ff;
}

html[data-theme='dark'] .brand-logo-dark {
  display: inline-block;
}

html[data-theme='dark'] .brand-logo-light {
  display: none;
}

html[data-theme='dark'] .login-card .login-form button[type='submit'] {
  color: #f2f7ff;
  background: linear-gradient(135deg, #2d67bf 0%, #3f81d4 48%, #5e9ae0 100%);
  border-color: rgba(149, 185, 238, 0.48);
}

html[data-theme='dark'] .login-captcha-image {
  color: #d4e5ff;
  border-color: rgba(150, 182, 226, 0.55);
  background: rgba(13, 24, 42, 0.55);
}

html[data-theme='dark'] .login-captcha-image svg {
  filter: brightness(0) invert(1) contrast(1.2);
}

html[data-theme='dark'] .login-captcha-refresh {
  color: #c9deff;
  border-color: rgba(132, 168, 219, 0.52);
  background: linear-gradient(180deg, rgba(25, 42, 70, 0.95), rgba(16, 30, 51, 0.95));
}

html[data-theme='dark'] tbody tr:hover {
  background: rgba(59, 130, 246, 0.14);
}

html[data-theme='dark'] .toolbar button:hover,
html[data-theme='dark'] .ghost-btn:hover,
html[data-theme='dark'] .table-controls button:hover,
html[data-theme='dark'] .pager button:hover,
html[data-theme='dark'] .mini-btn:hover {
  border-color: #5b78a6;
  color: #eff6ff;
}