@import url('https://fonts.googleapis.com/css2?family=Nunito+Sans:wght@400;500;600;700;800&display=swap');

:root {
  --page-bg: #f6efe3;
  --surface: rgba(255,252,247,0.96);
  --surface-strong: #fcfbf8;
  --surface-muted: #f8f3ea;
  --text: #19324a;
  --muted: #111827;
  --accent: #2f5d62;
  --accent-2: #4c7b83;
  --accent-soft: rgba(47,93,98,0.1);
  --accent-soft-2: rgba(76,123,131,0.1);
  --border: rgba(25,50,74,0.1);
  --shadow: 0 12px 32px rgba(25,50,74,0.06);
  --success: #0f9d73;
  --warning: #d97706;
  --danger: #dc2626;
}

.dark {
  /* Light-only mode: keep tokens identical so any `.dark` class does not switch to a dark palette. */
  --page-bg: #f6efe3;
  --surface: rgba(255,252,247,0.96);
  --surface-strong: #fcfbf8;
  --surface-muted: #f8f3ea;
  --text: #19324a;
  --muted: #111827;
  --accent: #2f5d62;
  --accent-2: #4c7b83;
  --accent-soft: rgba(47,93,98,0.1);
  --accent-soft-2: rgba(76,123,131,0.1);
  --border: rgba(25,50,74,0.1);
  --shadow: 0 12px 32px rgba(25,50,74,0.06);
}


html {
  color-scheme: light;
  scroll-behavior: smooth;
}

body {
  background: var(--page-bg) !important;
  color: var(--text) !important;
  font-family: 'Nunito Sans', sans-serif;
  transition: background 0.25s ease, color 0.25s ease;
  position: relative;
  overflow-x: hidden;
}

body.font-sans,
body .font-sans {
  font-family: 'Nunito Sans', sans-serif;
}

body::before,
body::after {
  display: none;
}

/* Force light look even if pages use `.dark:` Tailwind classes */
.dark,
.dark * {
  color-scheme: light !important;
}

.dark {
  background: var(--page-bg) !important;
  color: var(--text) !important;
}

.dark input,
.dark select,
.dark textarea {
  background-color: var(--surface-muted) !important;
  color: var(--text) !important;
}

.dark table,
.dark thead,
.dark tbody,
.dark tr,
.dark th,
.dark td {
  background: transparent !important;
  color: var(--text) !important;
}


main,
nav,
header,
section,
form,
.card,
.glass-card {
  position: relative;
  z-index: 1;
}

body,
body * {
  color: var(--text) !important;
}

::selection {
  background: rgba(37,99,235,0.2);
  color: var(--text);
}

::placeholder {
  color: var(--text) !important;
  opacity: 0.7;
}

.glass-card {
  background: var(--surface-strong) !important;
  border: 1px solid var(--border) !important;
  box-shadow: var(--shadow) !important;
  backdrop-filter: blur(10px);
  -webkit-backdrop-filter: blur(10px);
  border-radius: 1rem !important;
}

.rounded-\[2\.5rem\],
.rounded-\[3rem\],
.rounded-\[3\.5rem\],
.rounded-\[2rem\] {
  border-radius: 1rem !important;
}

.rounded-2xl {
  border-radius: 0.9rem !important;
}

.rounded-xl {
  border-radius: 0.75rem !important;
}

.glass-card:hover {
  transform: none;
  box-shadow: 0 16px 40px rgba(15,23,42,0.1) !important;
}

input,
select,
textarea {
  background-color: var(--surface-muted) !important;
  border-color: var(--border) !important;
  color: var(--text) !important;
  transition: border-color 0.2s ease, box-shadow 0.2s ease;
}

input:focus,
select:focus,
textarea:focus {
  border-color: var(--accent) !important;
  box-shadow: 0 0 0 4px rgba(47,93,98,0.14) !important;
}

/* Light-only background for inputs in case `.dark` class exists */
.dark input,
.dark select,
.dark textarea {
  background-color: var(--surface-muted) !important;
  color: var(--text) !important;
}


.bg-indigo-600,
.bg-indigo-500,
.from-indigo-500,
.to-indigo-500,
.bg-violet-600,
.bg-blue-600,
.bg-emerald-500,
.bg-rose-500 {
  box-shadow: 0 10px 24px -12px rgba(47,93,98,0.22) !important;
}

.bg-indigo-600,
.bg-indigo-500,
.from-indigo-500,
.to-indigo-500,
.from-violet-500,
.to-violet-500,
.from-blue-500,
.to-blue-500,
.from-sky-500,
.to-sky-500,
.bg-violet-600,
.bg-blue-600 {
  background: linear-gradient(135deg, var(--accent), var(--accent-2)) !important;
  background-color: var(--accent) !important;
  color: white !important;
}

.bg-emerald-500 {
  background: linear-gradient(135deg, #0f9d73, #34d399) !important;
  background-color: #0f9d73 !important;
}

.bg-rose-500 {
  background: linear-gradient(135deg, #dc2626, #fb7185) !important;
  background-color: #dc2626 !important;
}

.hover\:bg-indigo-600:hover,
.hover\:bg-indigo-500:hover,
.hover\:bg-violet-600:hover,
.hover\:bg-blue-600:hover,
.hover\:from-indigo-500:hover,
.hover\:to-violet-500:hover,
.hover\:from-violet-500:hover,
.hover\:to-indigo-500:hover {
  background-color: var(--accent) !important;
  background-image: linear-gradient(135deg, var(--accent), var(--accent-2)) !important;
}

.text-indigo-500,
.text-indigo-600,
.text-blue-500,
.text-sky-500,
.text-violet-500 {
  color: var(--accent) !important;
}

.border-indigo-500,
.border-indigo-600,
.border-blue-500,
.border-violet-500 {
  border-color: var(--accent) !important;
}

.text-slate-500,
.text-slate-400,
.text-slate-600,
.text-slate-300,
.text-slate-700,
.text-slate-800,
.text-gray-500,
.text-gray-400,
.text-gray-600,
.text-gray-300,
.text-gray-700,
.text-zinc-500,
.text-zinc-400,
.text-zinc-600,
.text-zinc-300,
.text-stone-500,
.text-stone-400,
.text-stone-600,
.text-stone-300 {
  color: var(--text) !important;
}

.text-white {
  color: var(--text) !important;
}

.bg-indigo-600.text-white,
.bg-indigo-500.text-white,
.bg-violet-600.text-white,
.bg-blue-600.text-white,
.bg-emerald-500.text-white,
.bg-rose-500.text-white,
.bg-orange-500.text-white,
.from-indigo-600.text-white,
.to-indigo-600.text-white,
.from-indigo-500.text-white,
.to-indigo-500.text-white,
.from-violet-500.text-white,
.to-violet-500.text-white,
.from-blue-500.text-white,
.to-blue-500.text-white,
.from-sky-500.text-white,
.to-sky-500.text-white,
.bg-gradient-to-r.text-white,
.bg-gradient-to-br.text-white {
  color: white !important;
}

.bg-white.text-white,
.bg-white\/10.text-white,
.bg-white\/5.text-white,
.bg-white\/\[0\.02\].text-white,
.bg-white\/\[0\.03\].text-white,
.bg-white\/\[0\.05\].text-white,
.bg-slate-50.text-white,
.bg-slate-100.text-white,
.bg-slate-200.text-white,
.bg-slate-50\/10.text-white,
.bg-slate-100\/10.text-white,
.bg-slate-100\/5.text-white,
.bg-slate-200\/10.text-white {
  color: var(--text) !important;
}

.bg-slate-100,
.bg-slate-50,
.bg-slate-600,
.bg-slate-700,
.bg-slate-800,
.bg-slate-900,
.bg-slate-900\/10,
.bg-slate-900\/20,
.bg-slate-900\/30,
.bg-slate-900\/50,
.bg-slate-900\/80,
.bg-slate-950,
.bg-slate-950\/20,
.bg-slate-950\/30,
.bg-slate-950\/50,
.bg-slate-950\/80,
.dark\:bg-slate-900,
.dark\:bg-slate-950,
.dark\:bg-\[\#0d121f\],
.dark\:bg-\[\#0d1324\] {
  background-color: var(--surface-strong) !important;
  color: var(--text) !important;
}

.text-slate-100,
.text-slate-200 {
  color: var(--text) !important;
}

.border-white\/5,
.border-white\/10,
.border-white\/20 {
  border-color: var(--border) !important;
}

.badge,
.stat-badge,
.rounded-full {
  border-color: var(--border) !important;
  background: var(--surface-muted) !important;
  color: var(--muted) !important;
}

button,
a {
  transition: all 0.2s ease;
}

button:hover,
a:hover {
  transform: translateY(-1px);
}

body button,
body input[type="button"],
body input[type="submit"],
body input[type="reset"],
body [role="button"],
body a.btn-teal,
body a.btn-ghost,
body a.action-btn,
body a.sidebar-logout,
body a[class~="bg-indigo-600"],
body a[class~="bg-indigo-500"],
body a[class~="bg-violet-600"],
body a[class~="bg-blue-600"],
body a[class~="bg-rose-500"],
body a[class~="bg-rose-600"],
body a[class~="bg-slate-100"],
body a[class~="bg-white"],
body a[class~="bg-white/5"],
body a[class~="bg-transparent"],
body a[class~="from-indigo-600"],
body a[class~="from-violet-600"] {
  background: #1e3a8a !important;
  border-color: #1e3a8a !important;
  color: #fff !important;
  transition: box-shadow 0.18s ease !important;
}

body button *,
body input[type="button"] *,
body input[type="submit"] *,
body input[type="reset"] *,
body [role="button"] *,
body a.btn-teal *,
body a.btn-ghost *,
body a.action-btn *,
body a.sidebar-logout *,
body a[class~="bg-indigo-600"] *,
body a[class~="bg-indigo-500"] *,
body a[class~="bg-violet-600"] *,
body a[class~="bg-blue-600"] *,
body a[class~="bg-rose-500"] *,
body a[class~="bg-rose-600"] *,
body a[class~="bg-slate-100"] *,
body a[class~="bg-white"] *,
body a[class~="bg-white/5"] *,
body a[class~="bg-transparent"] *,
body a[class~="from-indigo-600"] *,
body a[class~="from-violet-600"] * {
  color: #fff !important;
}

body button:hover,
body input[type="button"]:hover,
body input[type="submit"]:hover,
body input[type="reset"]:hover,
body [role="button"]:hover,
body a.btn-teal:hover,
body a.btn-ghost:hover,
body a.action-btn:hover,
body a.sidebar-logout:hover,
body a[class~="bg-indigo-600"]:hover,
body a[class~="bg-indigo-500"]:hover,
body a[class~="bg-violet-600"]:hover,
body a[class~="bg-blue-600"]:hover,
body a[class~="bg-rose-500"]:hover,
body a[class~="bg-rose-600"]:hover,
body a[class~="bg-slate-100"]:hover,
body a[class~="bg-white"]:hover,
body a[class~="bg-white/5"]:hover,
body a[class~="bg-transparent"]:hover,
body a[class~="from-indigo-600"]:hover,
body a[class~="from-violet-600"]:hover {
  background: #1e3a8a !important;
  border-color: #1e3a8a !important;
  box-shadow: 0 0 0 3px rgba(30, 58, 138, 0.24) !important;
  color: #fff !important;
  transform: none !important;
}

body button:focus-visible,
body input[type="button"]:focus-visible,
body input[type="submit"]:focus-visible,
body input[type="reset"]:focus-visible,
body [role="button"]:focus-visible,
body a.btn-teal:focus-visible,
body a.btn-ghost:focus-visible,
body a.action-btn:focus-visible,
body a.sidebar-logout:focus-visible,
body a[class~="bg-indigo-600"]:focus-visible,
body a[class~="bg-indigo-500"]:focus-visible,
body a[class~="bg-violet-600"]:focus-visible,
body a[class~="bg-blue-600"]:focus-visible,
body a[class~="bg-rose-500"]:focus-visible,
body a[class~="bg-rose-600"]:focus-visible,
body a[class~="bg-slate-100"]:focus-visible,
body a[class~="bg-white"]:focus-visible,
body a[class~="bg-white/5"]:focus-visible,
body a[class~="bg-transparent"]:focus-visible,
body a[class~="from-indigo-600"]:focus-visible,
body a[class~="from-violet-600"]:focus-visible {
  outline: 3px solid rgba(30, 58, 138, 0.35) !important;
  outline-offset: 2px;
}

body button:disabled,
body input[type="button"]:disabled,
body input[type="submit"]:disabled,
body input[type="reset"]:disabled {
  cursor: not-allowed;
  opacity: 0.6;
}
