/* ============================================================ THEME DEFINITIONS Each theme is a set of CSS custom properties applied to . Switch themes via the dropdown in the header (see theme-switcher.js). ============================================================ */ /* ---- Default / Slate Blue --------------------------------- */ body[data-theme="default"] { --color-bg: #f4f6f9; --color-surface: #ffffff; --color-primary: #2c3e50; --color-accent: #3498db; --color-text: #2c2c2c; --color-text-soft: #6b7280; --color-border: #d8dde3; --color-header-bg: #2c3e50; --color-header-fg: #ffffff; --color-menu-bg: #34495e; --color-menu-fg: #ecf0f1; --color-menu-hover:#3b5066; --color-card-shadow: rgba(0,0,0,0.08); } /* ---- Dark Mode ---------------------------------------------*/ body[data-theme="dark"] { --color-bg: #1a1d23; --color-surface: #242832; --color-primary: #e0e0e0; --color-accent: #5dade2; --color-text: #e8e8e8; --color-text-soft: #a0a4ab; --color-border: #3a3f4b; --color-header-bg: #11141a; --color-header-fg: #f0f0f0; --color-menu-bg: #1f232c; --color-menu-fg: #d6d9de; --color-menu-hover:#2c313d; --color-card-shadow: rgba(0,0,0,0.4); } /* ---- Forest / Earthy ----------------------------------------*/ body[data-theme="forest"] { --color-bg: #f1f4ee; --color-surface: #ffffff; --color-primary: #2f3e2e; --color-accent: #6a994e; --color-text: #2b2b26; --color-text-soft: #6f7a64; --color-border: #d6ddcd; --color-header-bg: #386641; --color-header-fg: #f4f4f0; --color-menu-bg: #4f6f52; --color-menu-fg: #f1f4ee; --color-menu-hover:#5d7e5f; --color-card-shadow: rgba(0,0,0,0.08); } /* ---- Royal / Purple-Gold --------------------------------------*/ body[data-theme="royal"] { --color-bg: #f7f3fb; --color-surface: #ffffff; --color-primary: #3c1361; --color-accent: #d4af37; --color-text: #2a1a3a; --color-text-soft: #7c6a8c; --color-border: #e0d4ec; --color-header-bg: #3c1361; --color-header-fg: #f7f3fb; --color-menu-bg: #4c1d7c; --color-menu-fg: #f0e6fb; --color-menu-hover:#5e2a94; --color-card-shadow: rgba(60,19,97,0.15); }