/**
 * Loaded after Tailwind CDN so light-mode text overrides win specificity wars.
 */
html[data-theme="light"] body,
html[data-theme="light"] #app-root {
  color: var(--text-primary);
}

html[data-theme="light"] #app-root [class*="text-white/"] {
  color: var(--text-muted) !important;
}

html[data-theme="light"] #app-root .text-white {
  color: var(--text-primary) !important;
}

html[data-theme="light"] #app-root [class*="text-white/80"],
html[data-theme="light"] #app-root [class*="text-white/70"] {
  color: var(--text-soft) !important;
}

html[data-theme="light"] #app-root [class*="text-white/40"],
html[data-theme="light"] #app-root [class*="text-white/45"] {
  color: var(--text-faint) !important;
}

html[data-theme="light"] #app-root [class*="border-white"] {
  border-color: var(--glass-border) !important;
}

html[data-theme="light"] #app-root [class*="bg-white"] {
  background-color: var(--section-tint) !important;
}

html[data-theme="light"] #app-root [class*="hover:text-white"]:hover {
  color: var(--text-primary) !important;
}

html[data-theme="light"] #app-root [class*="hover:bg-white"]:hover {
  background-color: var(--section-tint-hover) !important;
}

html[data-theme="light"] #app-root .text-brand-200 {
  color: #2475d9 !important;
}

html[data-theme="light"] #app-root .text-brand-300 {
  color: var(--brand-text, #0747a3) !important;
}

html[data-theme="light"] #app-root .group:hover .group-hover\:text-brand-200 {
  color: #0959c8 !important;
}

html[data-theme="light"] .btn-ghost {
  color: var(--ghost-text) !important;
}

html[data-theme="light"] .glass-panel,
html[data-theme="light"] .glass-nav {
  color: var(--text-primary);
}

html[data-theme="light"] #main-content p,
html[data-theme="light"] #main-content li,
html[data-theme="light"] #main-content h3,
html[data-theme="light"] #main-content h4,
html[data-theme="light"] #main-content blockquote,
html[data-theme="light"] #main-content cite {
  color: inherit;
}

html[data-theme="light"] footer a {
  color: var(--text-muted);
}

html[data-theme="light"] footer a:hover {
  color: var(--text-primary);
}