body {
  font-family: 'Inter', system-ui, -apple-system, BlinkMacSystemFont, sans-serif;
  transition: background-color 0.2s ease, color 0.2s ease;
}

/* Crisp Light Mode Overrides when html has class "light" */
html.light body {
  background-color: #f8fafc !important;
  color: #0f172a !important;
}

html.light #loginGateScreen {
  background: linear-gradient(135deg, #f1f5f9 0%, #e2e8f0 50%, #eef2ff 100%) !important;
}

html.light .bg-slate-950,
html.light .bg-slate-950\/90,
html.light .bg-slate-950\/85 {
  background-color: #ffffff !important;
}

html.light .bg-slate-900,
html.light .bg-slate-900\/95,
html.light .bg-slate-900\/90,
html.light .bg-slate-900\/60 {
  background-color: #f1f5f9 !important;
}

html.light .bg-slate-800 {
  background-color: #e2e8f0 !important;
}

html.light .text-white,
html.light .text-slate-100,
html.light .text-slate-200 {
  color: #0f172a !important;
}

html.light .text-slate-300 {
  color: #334155 !important;
}

html.light .text-slate-400,
html.light .text-slate-500 {
  color: #475569 !important;
}

html.light .border-slate-800,
html.light .border-slate-800\/80,
html.light .border-slate-900,
html.light .border-slate-700 {
  border-color: #cbd5e1 !important;
}

html.light .text-emerald-300,
html.light .text-emerald-400,
html.light .text-emerald-200 {
  color: #047857 !important;
}

html.light .text-indigo-300,
html.light .text-indigo-400,
html.light .text-indigo-200 {
  color: #4338ca !important;
}

html.light .text-sky-300,
html.light .text-sky-400 {
  color: #0369a1 !important;
}

html.light .text-amber-300,
html.light .text-amber-400,
html.light .text-amber-200 {
  color: #b45309 !important;
}

html.light .text-rose-300,
html.light .text-rose-200 {
  color: #be123c !important;
}

html.light .text-violet-300,
html.light .text-purple-300 {
  color: #6d28d9 !important;
}

html.light .text-cyan-300,
html.light .text-teal-300 {
  color: #0e7490 !important;
}

html.light .text-pink-300 {
  color: #be185d !important;
}

html.light .text-orange-300 {
  color: #c2410c !important;
}

html.light .text-lime-300 {
  color: #3f6212 !important;
}

/* Keep white text on solid accent buttons in Light Mode */
html.light .bg-indigo-500,
html.light .bg-rose-500,
html.light .from-indigo-500 {
  color: #ffffff !important;
}
