/* ==========================================================================
   1. THEME DEFINITIONS (The "DNA")
   ========================================================================== */

/* ESTATE THEME (Default Luxury Branding) */
:root, .theme-estate {
  --color-bg-primary: #FDFDFB;
  --color-bg-secondary: #f6f6f3;
  --color-text-primary: #222222;
  --color-text-secondary: #222222b3;
  --color-border-subtle: #EAEAEA;
  --color-accent: #B49B6F;
}

/* Estate Dark Mode (Auto & Manual) */
@media (prefers-color-scheme: dark) {
  :root:not([class*='theme-']) {
    --color-bg-primary: #121212;
    --color-bg-secondary: #1E1E1E;
    --color-text-primary: #FDFDFB;
    --color-text-secondary: #FDFDFBcc;
    --color-border-subtle: #333333;
  }
}

.theme-estate.dark, .dark:not([class*='theme-']) {
  --color-bg-primary: #121212;
  --color-bg-secondary: #1E1E1E;
  --color-text-primary: #FDFDFB;
  --color-text-secondary: #FDFDFBcc;
  --color-border-subtle: #333333;
}

/* SAKURA THEME (Anime / Girly Pop) */
.theme-sakura {
  --color-bg-primary: #FFF5F9;        /* Softest Pastel Pink */
  --color-bg-secondary: #FFE4EF;      /* Marshmallow Pink */
  --color-text-primary: #5E203C;      /* Deep Wine */
  --color-text-secondary: #A64471;    /* Muted Rose */
  --color-border-subtle: #FFD1E3;     /* Cotton Candy Border */
  --color-accent: #FF7EB9;           /* Bubblegum Pink */
}

/* Sakura Dark Mode */
.theme-sakura.dark {
  --color-bg-primary: #1A0B12;        /* Deep Midnight Berry */
  --color-bg-secondary: #2D121D;      /* Dark Plum */
  --color-text-primary: #FFD1E3;      /* Light Sakura Pink */
  --color-text-secondary: #FF7EB9cc;  /* Glowing Bubblegum */
  --color-border-subtle: #4D1A2F;     /* Muted Velvet Border */
  --color-accent: #FF007A;           /* Neon Cyber Pink */
}

/* 3. LCARS VOYAGER (Star Trek) */
/* Bold, high-contrast, LCARS primary colors */
.theme-lcars {
  --color-bg-primary: #FF9C59;        /* Iconic LCARS Orange-Tan */
  --color-bg-secondary: #C681FD;      /* LCARS Soft Purple */
  --color-text-primary: #221144;      /* Deep Space Indigo */
  --color-accent: #99CCFF;            /* LCARS Blue Accent */
  --color-border-subtle: #DE552C;     /* Red-Alert Border */
}
.theme-lcars.dark {
  --color-bg-primary: #000000;
  --color-bg-secondary: #1A1A1A;
  --color-text-primary: #FF9C59;      /* Orange Text on Black */
  --color-accent: #C681FD;            /* Purple UI Highlights */
  --color-border-subtle: #444444;
}

/* 4. ONYX & EMERALD (Vogue / High-Fashion) */
/* Think deep, saturated forest and high-contrast gold */
.theme-emerald {
  --color-bg-primary: #064E3B;        /* Deep Forest Green (Even in light mode) */
  --color-bg-secondary: #042F24;
  --color-text-primary: #ECFDF5;      /* Mint White Text */
  --color-accent: #FDE047;            /* Bright Gold Accent */
  --color-border-subtle: #065F46;
}
.theme-emerald.dark {
  --color-bg-primary: #01120B;        /* Near Black-Green */
  --color-bg-secondary: #022115;
  --color-text-primary: #34D399;      /* Neon Emerald Text */
  --color-accent: #FDE047;
  --color-border-subtle: #064E3B;
}

/* 5. MIDNIGHT ARCHIVE (Old Money / Oxford) */
/* Deep Navy and Parchment Gold */
.theme-archive {
  --color-bg-primary: #1E293B;        /* Navy Library Wall */
  --color-bg-secondary: #0F172A;
  --color-text-primary: #F8FAFC;      /* Crisp Off-White */
  --color-accent: #EAB308;            /* Brass/Gold */
  --color-border-subtle: #334155;
}
.theme-archive.dark {
  --color-bg-primary: #020617;        /* Black Hole Navy */
  --color-bg-secondary: #0F172A;
  --color-text-primary: #94A3B8;      /* Slate Text */
  --color-accent: #EAB308;
  --color-border-subtle: #1E293B;
}

/* 6. VIPER (The Matrix / Hacker) */
/* Pure high-contrast terminal glow */
.theme-viper {
  --color-bg-primary: #000000;
  --color-bg-secondary: #050505;
  --color-text-primary: #00FF41;      /* Matrix Neon Green */
  --color-accent: #008F11;            /* Darker Green */
  --color-border-subtle: #003B00;
}
.theme-viper.dark {
  --color-bg-primary: #000000;
  --color-bg-secondary: #080808;
  --color-text-primary: #00FF41;
  --color-accent: #FFFFFF;            /* White highlights for extra punch */
  --color-border-subtle: #00FF41;
}

/* 7. DESERT MODERN (Mars / Dune) */
/* Deep rust and sand high-contrast */
.theme-desert {
  --color-bg-primary: #7C2D12;        /* Burnt Terracotta */
  --color-bg-secondary: #431407;
  --color-text-primary: #FFEDD5;      /* Sand Text */
  --color-accent: #FDBA74;            /* Soft Sun Accent */
  --color-border-subtle: #9A3412;
}
.theme-desert.dark {
  --color-bg-primary: #1C1917;        /* Basalt Rock */
  --color-bg-secondary: #0C0A09;
  --color-text-primary: #D97706;      /* Glowing Ember Text */
  --color-accent: #F59E0B;
  --color-border-subtle: #44403C;
}

/* ==========================================================================
   2. CORE BODY STYLES
   ========================================================================== */

body {
  font-family: 'Inter', sans-serif;
  background-color: var(--color-bg-primary);
  color: var(--color-text-primary);
  transition: background-color 0.3s ease, color 0.3s ease;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  margin: 0;
}

/* ==========================================================================
   3. ARCHETYPAL UTILITY CLASSES
   ========================================================================== */

/* Typography */
.font-serif { font-family: 'Cormorant Garamond', serif; }
.font-sans { font-family: 'Inter', sans-serif; }

/* Text Colors (Mapped to Variables) */
.text-charcoal-primary   { color: var(--color-text-primary); }
.text-charcoal-secondary { color: var(--color-text-secondary); }
.text-cream-primary      { color: var(--color-bg-primary); }
.text-accent             { color: var(--color-accent); }

/* Background Colors (Mapped to Variables) */
.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); }
.bg-accent             { background-color: var(--color-accent); }

/* Borders */
.border-accent { border-color: var(--color-accent); }
.border-subtle { border-color: var(--color-border-subtle); }

/* Interactive States */
.hover-bg-accent:hover { background-color: var(--color-accent); opacity: 0.9; }