/* Root Theme Variables */
:root {
  --color-bg-primary: #FDFDFB;
  --color-bg-secondary: #f6f6f3;
  --color-text-primary: #222222;
  --color-text-secondary: #222222b3;
  --color-border-subtle: #EAEAEA;
  --color-accent: #B49B6F;
}

/* Dark Mode Variables (auto) */
@media (prefers-color-scheme: dark) {
  :root {
    --color-bg-primary: #121212;
    --color-bg-secondary: #1E1E1E;
    --color-text-primary: #FDFDFB;
    --color-text-secondary: #FDFDFBcc;
    --color-border-subtle: #333333;
  }
}

/* Manual "dark" class override */
.dark {
  --color-bg-primary: #121212;
  --color-bg-secondary: #1E1E1E;
  --color-text-primary: #FDFDFB;
  --color-text-secondary: #FDFDFBcc;
  --color-border-subtle: #333333;
}

/* Basic typography + transitions */
body {
  font-family: 'Inter', sans-serif;
  background-color: var(--color-bg-primary);
  color: var(--color-text-primary);
  transition: background-color 0.3s, color 0.3s;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

/* Utility classes (optional) */
.font-serif { font-family: 'Cormorant Garamond', serif; }
.font-sans { font-family: 'Inter', sans-serif; }

.text-charcoal-primary { color: var(--color-text-primary); }
.text-charcoal-secondary { color: var(--color-text-secondary); }
.text-cream-primary { color: var(--color-bg-primary); }

.bg-charcoal-primary { background-color: var(--color-text-primary); }
.bg-cream-primary { background-color: var(--color-bg-primary); }
.bg-cream-secondary { background-color: var(--color-bg-secondary); }

.text-accent { color: var(--color-accent); }
.bg-accent { background-color: var(--color-accent); }
.border-accent { border-color: var(--color-accent); }
.border-subtle { border-color: var(--color-border-subtle); }