.material-symbols-outlined {
  font-variation-settings: 'FILL' 0, 'wght' 400, 'GRAD' 0, 'opsz' 24;
  display: inline-block;
  vertical-align: middle;
}

body {
  background-color: #f8f9fc;
  color: #111827;
}

/* Theme Overrides for Emerald Calm & Cosmic Night */
html.theme-emerald body {
  background-color: #f0fdf4;
  color: #064e3b;
}

html.theme-emerald .bg-surface-container-lowest {
  background-color: #ffffff;
}

html.theme-emerald .bg-surface-container {
  background-color: #ecfdf5;
}

html.theme-emerald .text-primary {
  color: #047857;
}

html.theme-emerald .bg-primary {
  background-color: #059669;
  color: #ffffff;
}

html.theme-emerald .border-outline-variant {
  border-color: #a7f3d0;
}

html.theme-cosmic body,
html.dark body {
  background-color: #0f172a;
  color: #f8fafc;
}

html.theme-cosmic .bg-surface-container-lowest,
html.dark .bg-surface-container-lowest {
  background-color: #1e293b;
}

html.theme-cosmic .bg-surface-container,
html.dark .bg-surface-container {
  background-color: #0f172a;
}

html.theme-cosmic .text-primary,
html.dark .text-primary {
  color: #D4AF37;
}

html.theme-cosmic .bg-primary,
html.dark .bg-primary {
  background-color: #D4AF37;
  color: #0A2540;
}

html.theme-cosmic .border-outline-variant,
html.dark .border-outline-variant {
  border-color: #334155;
}