/* ═══════════════════════════════════════
   THEMES · 明暗主题
   ═══════════════════════════════════════ */

[data-theme="dark"] {
  --color-bg-primary: #121212;
  --color-bg-secondary: #1E1E1E;
  --color-bg-tertiary: #2A2A2A;
  --color-bg-elevated: #252525;
  --color-text-primary: #EAE4DA;
  --color-text-secondary: #A8A098;
  --color-text-tertiary: #6E6860;
  --color-accent: #D4AF37;
  --color-accent-hover: #E8C84A;
  --color-accent-subtle: rgba(212, 175, 55, 0.1);
  --color-border: #2E2E2E;
  --color-border-light: #252525;
  --color-shadow: rgba(0, 0, 0, 0.3);
  --color-shadow-hover: rgba(0, 0, 0, 0.5);
  --color-overlay: rgba(0, 0, 0, 0.6);
}

html {
  transition: background-color var(--duration-slow) var(--ease-in-out),
              color var(--duration-slow) var(--ease-in-out);
}

body {
  transition: background-color var(--duration-slow) var(--ease-in-out),
              color var(--duration-slow) var(--ease-in-out);
}

*, *::before, *::after {
  transition: background-color var(--duration-normal) var(--ease-in-out),
              border-color var(--duration-normal) var(--ease-in-out),
              box-shadow var(--duration-normal) var(--ease-in-out);
}