/* CSS Variables - Moonlit Forest Theme */

/* ====================================
   CSS CUSTOM PROPERTIES (Variables)
   ==================================== */
:root {
    /* Color Palette - Moonlit Forest (default) */
    --bg-primary: #0b0d13;           /* Deep midnight */
    --bg-secondary: #111520;         /* Dark forest floor */
    --bg-tertiary: #1a1f2e;          /* Moonlit panel */

    /* Dynamic Accent Color - Moonlight amber default */
    --accent-primary: #d4a44c;
    --accent-primary-rgb: 212, 164, 76;

    /* Themed accent colors */
    --accent-moonlight: #d4a44c;
    --accent-frost: #5ba3c9;
    --accent-forest: #5a8a5a;
    --accent-twilight: #8b6baa;
    --accent-ember: #c47832;
    --accent-blood: #c44040;

    /* Glow variants (soft, warm - not neon) */
    --glow-primary: 0 0 8px rgba(var(--accent-primary-rgb), 0.35), 0 0 16px rgba(var(--accent-primary-rgb), 0.15);
    --glow-moonlight: 0 0 8px rgba(212, 164, 76, 0.35), 0 0 16px rgba(212, 164, 76, 0.15);
    --glow-forest: 0 0 8px rgba(90, 138, 90, 0.35), 0 0 16px rgba(90, 138, 90, 0.15);

    /* Text Colors */
    --text-primary: #d8dce4;
    --text-secondary: #8b949e;
    --text-muted: #5c6370;

    /* Functional Colors */
    --error: #c44040;
    --success: #5a8a5a;
    --warning: #c47832;

    /* Discord brand color */
    --discord-blurple: #5865F2;

    /* Glass effect - warm forest tint */
    --glass-bg: rgba(17, 21, 32, 0.78);
    --glass-border: rgba(212, 164, 76, 0.12);

    /* Typography */
    --font-display: 'Cormorant Garamond', 'Garamond', 'Georgia', serif;
    --font-body: 'Inter', 'Segoe UI', system-ui, -apple-system, sans-serif;
    --font-mono: 'Fira Code', 'JetBrains Mono', 'Cascadia Code', monospace;

    /* Spacing */
    --spacing-xs: 0.25rem;
    --spacing-sm: 0.5rem;
    --spacing-md: 1rem;
    --spacing-lg: 1.5rem;
    --spacing-xl: 2rem;

    /* Border Radius */
    --radius-sm: 4px;
    --radius-md: 8px;
    --radius-lg: 14px;

    /* Transitions */
    --transition-fast: 150ms ease;
    --transition-normal: 250ms ease;
}

/* ====================================
   THEME VARIANTS
   ==================================== */

/* Light Theme - Warm parchment */
[data-theme="light"] {
    --bg-primary: #f5f0e8;
    --bg-secondary: #ebe5d8;
    --bg-tertiary: #ddd6c8;
    --text-primary: #1f2328;
    --text-secondary: #555d66;
    --text-muted: #8b949e;
    --glass-bg: rgba(235, 229, 216, 0.9);
    --glass-border: rgba(212, 164, 76, 0.2);
}

/* Midnight Theme - Deep indigo */
[data-theme="midnight"] {
    --bg-primary: #080a14;
    --bg-secondary: #0e1028;
    --bg-tertiary: #161838;
    --glass-bg: rgba(14, 16, 40, 0.8);
    --glass-border: rgba(212, 164, 76, 0.1);
}

/* Accent Color Variants - Thematic names */
[data-accent="cyan"],
[data-accent="moonlight"] {
    --accent-primary: #d4a44c;
    --accent-primary-rgb: 212, 164, 76;
}

[data-accent="green"],
[data-accent="frost"] {
    --accent-primary: #5ba3c9;
    --accent-primary-rgb: 91, 163, 201;
}

[data-accent="purple"],
[data-accent="forest"] {
    --accent-primary: #5a8a5a;
    --accent-primary-rgb: 90, 138, 90;
}

[data-accent="orange"],
[data-accent="twilight"] {
    --accent-primary: #8b6baa;
    --accent-primary-rgb: 139, 107, 170;
}

[data-accent="pink"],
[data-accent="ember"] {
    --accent-primary: #c47832;
    --accent-primary-rgb: 196, 120, 50;
}

[data-accent="red"],
[data-accent="blood"] {
    --accent-primary: #c44040;
    --accent-primary-rgb: 196, 64, 64;
}
