[data-theme="dark"],
.dark {
  --color-bg: #0F172A;
  --color-bg-secondary: #1E293B;
  --color-text: #F1F5F9;
  --color-text-secondary: #94A3B8;
  --color-border: #334155;
  --color-card-bg: #1E293B;

  --color-teal: #14B8A6;
  --color-teal-light: #2DD4BF;
  --color-teal-dark: #0D9488;
  --color-primary: var(--color-teal);
  --color-primary-light: rgba(20, 184, 166, 0.15);
  --color-primary-dark: var(--color-teal-dark);
  --color-text-tertiary: #64748B;

  --shadow-xs: 0 1px 2px rgba(0,0,0,0.2);
  --shadow-sm: 0 2px 8px rgba(0,0,0,0.2);
  --shadow-md: 0 4px 24px rgba(0,0,0,0.25);
  --shadow-lg: 0 8px 40px rgba(0,0,0,0.3);
  --shadow-xl: 0 16px 64px rgba(0,0,0,0.4);
}

[data-theme="dark"] .landing-nav,
.dark .landing-nav {
  background: rgba(15,23,42,0.95);
}

[data-theme="dark"] .form-input,
.dark .form-input {
  background: var(--color-bg);
  color: var(--color-text);
  border-color: var(--color-border);
}

[data-theme="dark"] .table th,
.dark .table th {
  background: var(--color-bg-secondary);
  color: var(--color-text-secondary);
}

[data-theme="dark"] .table tr:hover td,
.dark .table tr:hover td {
  background: rgba(51,65,85,0.5);
}

[data-theme="dark"] .loading-overlay,
.dark .loading-overlay {
  background: rgba(15,23,42,0.8);
}

[data-theme="dark"] .hero-bg,
.dark .hero-bg {
  background: linear-gradient(135deg, rgba(20,184,166,0.06) 0%, rgba(167,243,208,0.04) 50%, rgba(20,184,166,0.02) 100%);
}

[data-theme="dark"] code,
.dark code {
  background: var(--color-bg-secondary);
}

[data-theme="dark"] .accordion-trigger:hover,
.dark .accordion-trigger:hover {
  background: var(--color-bg-secondary);
}

[data-theme="dark"] .btn-secondary,
.dark .btn-secondary {
  color: var(--color-teal-light);
  border-color: var(--color-teal-light);
}

[data-theme="dark"] .btn-ghost:hover:not(:disabled),
.dark .btn-ghost:hover:not(:disabled) {
  background: var(--color-bg-secondary);
}

@media (prefers-color-scheme: dark) {
  :root:not([data-theme="light"]) {
    --color-bg: #0F172A;
    --color-bg-secondary: #1E293B;
    --color-text: #F1F5F9;
    --color-text-secondary: #94A3B8;
    --color-border: #334155;
    --color-card-bg: #1E293B;
    --color-teal: #14B8A6;
    --color-teal-light: #2DD4BF;
    --shadow-xs: 0 1px 2px rgba(0,0,0,0.2);
    --shadow-sm: 0 2px 8px rgba(0,0,0,0.2);
    --shadow-md: 0 4px 24px rgba(0,0,0,0.25);
    --shadow-lg: 0 8px 40px rgba(0,0,0,0.3);
    --shadow-xl: 0 16px 64px rgba(0,0,0,0.4);
  }
}
