:root {
  --theme-bg: #f9fafb;
  --theme-card: #ffffff;
  --theme-card-border: #e5e7eb;
  --theme-text: #111827;
  --theme-muted: #6b7280;
  --theme-primary: #4f46e5;
  --theme-primary-contrast: #ffffff;
}

body {
  background: var(--theme-bg);
  color: var(--theme-text);
}

/* Slate (dark) theme */
body.theme-slate {
  --theme-bg: #0b1220;
  --theme-card: #0f172a;
  --theme-card-border: #1f2937;
  --theme-text: #e2e8f0;
  --theme-muted: #94a3b8;
  --theme-primary: #38bdf8;
  --theme-primary-contrast: #0b1220;
}

/* Sunrise (warm) theme */
body.theme-sunrise {
  --theme-bg: linear-gradient(135deg, #fff7ed 0%, #ffe4e6 100%);
  --theme-card: #fff7ed;
  --theme-card-border: #fed7aa;
  --theme-text: #4c1d95;
  --theme-muted: #9a3412;
  --theme-primary: #f97316;
  --theme-primary-contrast: #ffffff;
}

/* Shared overrides using existing utility classes */
body.theme-slate .bg-white,
body.theme-sunrise .bg-white {
  background-color: var(--theme-card) !important;
}

body.theme-slate .border,
body.theme-slate .border-gray-100,
body.theme-slate .border-gray-200,
body.theme-slate .border-indigo-200,
body.theme-slate .border-emerald-200,
body.theme-slate .border-blue-200,
body.theme-slate .border-purple-200,
body.theme-sunrise .border,
body.theme-sunrise .border-gray-100,
body.theme-sunrise .border-gray-200,
body.theme-sunrise .border-indigo-200,
body.theme-sunrise .border-emerald-200,
body.theme-sunrise .border-blue-200,
body.theme-sunrise .border-purple-200 {
  border-color: var(--theme-card-border) !important;
}

body.theme-slate .text-gray-800,
body.theme-slate .text-gray-700,
body.theme-slate .text-gray-600,
body.theme-slate .text-gray-500,
body.theme-slate .text-gray-400,
body.theme-sunrise .text-gray-800,
body.theme-sunrise .text-gray-700,
body.theme-sunrise .text-gray-600,
body.theme-sunrise .text-gray-500,
body.theme-sunrise .text-gray-400 {
  color: var(--theme-muted) !important;
}

body.theme-slate .text-gray-900,
body.theme-sunrise .text-gray-900 {
  color: var(--theme-text) !important;
}

body.theme-slate .text-indigo-600,
body.theme-sunrise .text-indigo-600,
body.theme-slate .text-indigo-700,
body.theme-sunrise .text-indigo-700 {
  color: var(--theme-primary) !important;
}

body.theme-slate .bg-indigo-600,
body.theme-sunrise .bg-indigo-600,
body.theme-slate .bg-indigo-700,
body.theme-sunrise .bg-indigo-700 {
  background-color: var(--theme-primary) !important;
  color: var(--theme-primary-contrast) !important;
}

body.theme-slate .bg-gray-50,
body.theme-sunrise .bg-gray-50 {
  background-color: color-mix(in srgb, var(--theme-card) 88%, transparent) !important;
}

body.theme-slate .bg-indigo-50,
body.theme-sunrise .bg-indigo-50,
body.theme-slate .bg-blue-50,
body.theme-sunrise .bg-blue-50,
body.theme-slate .bg-purple-50,
body.theme-sunrise .bg-purple-50,
body.theme-slate .bg-emerald-50,
body.theme-sunrise .bg-emerald-50 {
  background-color: color-mix(in srgb, var(--theme-card) 92%, transparent) !important;
}

body.theme-slate .shadow-lg,
body.theme-sunrise .shadow-lg,
body.theme-slate .shadow-sm,
body.theme-sunrise .shadow-sm {
  box-shadow: 0 10px 25px rgba(0, 0, 0, 0.15) !important;
}

/* Unique layout accents */
body.theme-slate .theme-shell {
  padding: 24px;
}

body.theme-slate .theme-card {
  background: linear-gradient(145deg, #0f172a 0%, #111827 100%) !important;
  color: #e2e8f0 !important;
  border: 1px solid #1f2937 !important;
}

body.theme-slate .theme-hero {
  background: linear-gradient(135deg, #0f172a 0%, #1e293b 50%, #0b1220 100%) !important;
  border-bottom: 1px solid #1f2937;
}

body.theme-slate .theme-card input,
body.theme-slate .theme-card textarea,
body.theme-slate .theme-card select {
  background-color: #0b1220 !important;
  border-color: #1f2937 !important;
  color: #e2e8f0 !important;
}

body.theme-sunrise .theme-shell {
  padding: 20px;
}

body.theme-sunrise .theme-card {
  background: linear-gradient(160deg, #fff7ed 0%, #fff1f2 100%) !important;
  border: 1px solid #fed7aa !important;
  box-shadow: 0 18px 35px rgba(249, 115, 22, 0.15) !important;
}

body.theme-sunrise .theme-hero {
  background: linear-gradient(135deg, #f97316 0%, #fb7185 50%, #f59e0b 100%) !important;
  color: #ffffff !important;
}

body.theme-sunrise .theme-card input,
body.theme-sunrise .theme-card textarea,
body.theme-sunrise .theme-card select {
  background-color: #fff7ed !important;
  border-color: #fdba74 !important;
  color: #9a3412 !important;
}

/* Holi (festive) theme */
body.theme-holi {
  --theme-bg: radial-gradient(circle at 12% 10%, #ffe2f3 0%, #ffe2f3 18%, transparent 42%),
    radial-gradient(circle at 86% 8%, #d8f7ff 0%, #d8f7ff 16%, transparent 40%),
    radial-gradient(circle at 50% 92%, #fff0d6 0%, #fff0d6 20%, transparent 45%),
    linear-gradient(135deg, #fff8f1 0%, #fff3fa 50%, #f4fcff 100%);
  --theme-card: #fff9f5;
  --theme-card-border: #ffd9ec;
  --theme-text: #2f1640;
  --theme-muted: #6d3b69;
  --theme-primary: #ff3f8e;
  --theme-primary-contrast: #ffffff;
}

body.theme-holi .theme-shell {
  padding: 22px;
  border-radius: 30px;
  background: linear-gradient(145deg, rgba(255, 243, 252, 0.65), rgba(237, 250, 255, 0.6)) !important;
  border: 1px solid #ffd8e6;
  box-shadow: 0 20px 42px rgba(255, 105, 168, 0.18);
}

body.theme-holi .theme-hero {
  background: linear-gradient(135deg, #0f172a 0%, #064e3b 50%, #0f766e 100%) !important;
  color: #ffffff !important;
}

body.theme-holi .theme-card {
  background: linear-gradient(160deg, #fff9f3 0%, #fff8fb 38%, #f5fbff 100%) !important;
  border: 1px solid #ffd8eb !important;
  box-shadow: 0 16px 35px rgba(255, 92, 160, 0.16) !important;
}

body.theme-holi .bg-white {
  background-color: var(--theme-card) !important;
}

body.theme-holi .bg-gray-50 {
  background: linear-gradient(135deg, #fff6fb 0%, #f8fbff 100%) !important;
}

body.theme-holi .border,
body.theme-holi .border-gray-100,
body.theme-holi .border-gray-200,
body.theme-holi .border-indigo-200,
body.theme-holi .border-emerald-200,
body.theme-holi .border-blue-200,
body.theme-holi .border-purple-200 {
  border-color: var(--theme-card-border) !important;
}

body.theme-holi .text-gray-900,
body.theme-holi .text-gray-800,
body.theme-holi .text-gray-700 {
  color: var(--theme-text) !important;
}

body.theme-holi .text-gray-600,
body.theme-holi .text-gray-500,
body.theme-holi .text-gray-400 {
  color: var(--theme-muted) !important;
}

body.theme-holi .text-indigo-600,
body.theme-holi .text-indigo-700 {
  color: #ff3f8e !important;
}

body.theme-holi .bg-indigo-600,
body.theme-holi .bg-indigo-700 {
  background: linear-gradient(130deg, #ff3f8e 0%, #ff6f3c 45%, #1a9cff 100%) !important;
  color: #ffffff !important;
}

body.theme-holi .theme-card input,
body.theme-holi .theme-card textarea,
body.theme-holi .theme-card select {
  background: linear-gradient(130deg, #fff9fd 0%, #f7fcff 100%) !important;
  border-color: #ffcae0 !important;
  color: #3b2452 !important;
}

/* Ocean (cool) theme */
body.theme-ocean {
  --theme-bg: linear-gradient(135deg, #f0f9ff 0%, #e0f2f1 100%);
  --theme-card: #ffffff;
  --theme-card-border: #b2dfdb;
  --theme-text: #004d40;
  --theme-muted: #00796b;
  --theme-primary: #00acc1;
  --theme-primary-contrast: #ffffff;
}

body.theme-ocean .theme-shell {
  padding: 20px;
}

body.theme-ocean .theme-card {
  background: linear-gradient(160deg, #ffffff 0%, #f0f9ff 100%) !important;
  border: 1px solid #b2dfdb !important;
  box-shadow: 0 18px 35px rgba(0, 172, 193, 0.15) !important;
}

body.theme-ocean .theme-hero {
  background: linear-gradient(135deg, #00acc1 0%, #00838f 50%, #006064 100%) !important;
  color: #ffffff !important;
}

body.theme-ocean .theme-card input,
body.theme-ocean .theme-card textarea,
body.theme-ocean .theme-card select {
  background-color: #f0f9ff !important;
  border-color: #b2dfdb !important;
  color: #004d40 !important;
}