/* ==========================================================================
   Neo-Brutalist Light Mode Theme Overrides
   Applied ONLY when <html class="light"> is active.
   Dark mode retains 100% native Stitch Tailwind styling.
   ========================================================================== */

html.light body,
html.light main {
  background-color: #f7f6f9 !important;
  color: #18181b !important;
}

html.light header {
  background-color: rgba(255, 255, 255, 0.95) !important;
  border-color: #e4e4e7 !important;
  box-shadow: 0 4px 20px rgba(0, 0, 0, 0.05) !important;
}

html.light header nav {
  background-color: #f4f4f5 !important;
  border-color: #e4e4e7 !important;
}

html.light header nav a:not(.bg-primary-container):not(.bg-orange-500) {
  color: #52525b !important;
}

html.light header nav a:not(.bg-primary-container):not(.bg-orange-500):hover {
  background-color: #e4e4e7 !important;
  color: #18181b !important;
}

html.light .bg-\[\#18181b\] {
  background-color: #ffffff !important;
  border-color: #e4e4e7 !important;
}

html.light .bg-\[\#121214\],
html.light .bg-\[\#09090b\] {
  background-color: #f4f4f6 !important;
  border-color: #e4e4e7 !important;
}

html.light .bg-\[\#1c1b1d\] {
  background-color: #ffffff !important;
  border-color: #e4e4e7 !important;
}

html.light .bg-\[\#201f22\],
html.light .bg-\[\#27272a\] {
  background-color: #f4f4f5 !important;
  border-color: #d4d4d8 !important;
  color: #18181b !important;
}

html.light .text-white,
html.light .text-\[\#fafafa\],
html.light .text-zinc-100 {
  color: #18181b !important;
}

html.light .text-zinc-200 {
  color: #27272a !important;
}

html.light .text-zinc-300,
html.light .text-zinc-400,
html.light .text-\[\#a1a1aa\] {
  color: #52525b !important;
}

html.light .border-\[\#27272a\],
html.light .border-zinc-800,
html.light .border-zinc-800\/80,
html.light .border-zinc-800\/90 {
  border-color: #e4e4e7 !important;
}

html.light footer {
  background-color: #ffffff !important;
  border-color: #e4e4e7 !important;
}

/* Maintain crisp tactile brutalist drop shadows */
html.light .shadow-\[4px_4px_0px_\#000000\],
html.light .shadow-\[3px_3px_0px_\#000000\],
html.light .shadow-\[2px_2px_0px_\#000000\] {
  box-shadow: 3px 3px 0px #18181b !important;
}