/* theme.css - Centralized Design Tokens & Color Variables
   Contents:
   1. Core Theme (Dark Default)
   2. Brand Colors
   3. Status & Feedback
   4. Glassmorphism Tokens
   5. Layout & Spacing
   6. Admin System Aliases
   7. Home Page Palette
   8. Light Mode Overrides
*/

:root {
    /* ----------------------------------------------------------------------- */
    /*                       1. CORE THEME (DARK DEFAULT)                      */
    /* ----------------------------------------------------------------------- */
    --bg-body: #020617;
    --bg-card: #0f172a;
    --text-main: #f8fafc;
    --text-muted: #94a3b8;

    /* ----------------------------------------------------------------------- */
    /*                             2. BRAND COLORS                             */
    /* ----------------------------------------------------------------------- */
    --primary: #6366f1;
    --primary-hover: #4f46e5;
    --accent: #ec4899;

    /* ----------------------------------------------------------------------- */
    /*                           3. STATUS & FEEDBACK                          */
    /* ----------------------------------------------------------------------- */
    --success: #10b981;
    --warning: #f59e0b;
    --error: #ef4444;
    --danger: var(--error);
    /* Alias for semantic consistency */

    /* ----------------------------------------------------------------------- */
    /*                         4. GLASSMORPHISM TOKENS                         */
    /* ----------------------------------------------------------------------- */
    --glass-bg: rgba(15, 23, 42, 0.6);
    --glass-border: rgba(255, 255, 255, 0.08);
    --glass-blur: 12px;
    --glass-shine: rgba(255, 255, 255, 0.03);

    /* ----------------------------------------------------------------------- */
    /*                          5. LAYOUT & SPACING                            */
    /* ----------------------------------------------------------------------- */
    --container-width: 1200px;
    --header-height: 80px;
    --radius: 12px;

    /* ----------------------------------------------------------------------- */
    /*                        6. ADMIN SYSTEM ALIASES                          */
    /* ----------------------------------------------------------------------- */
    /* Maps generic names to specific context for semantic clarity */
    --bg-app: var(--bg-body);
    --bg-panel: var(--bg-card);
    --text-dim: #64748b;
    --primary-glow: rgba(99, 102, 241, 0.3);
    --backdrop-blur: var(--glass-blur);

    /* ----------------------------------------------------------------------- */
    /*                          7. HOME PAGE PALETTE                           */
    /* ----------------------------------------------------------------------- */
    --home-bg: #09090b;
    --home-bg-secondary: #0f0f11;
    --home-primary: #5a35de;
    --home-primary-hover: #4c2bb5;
    --home-accent: #a527be;

    --home-text-main: #ffffff;
    --home-text-muted: #a1a1aa;

    --home-border: rgba(255, 255, 255, 0.08);
    --home-card-bg: rgba(255, 255, 255, 0.03);
    --home-card-hover: rgba(255, 255, 255, 0.06);

    --home-gradient: linear-gradient(135deg, #5a35de 0%, #a527be 100%);
    --home-border-radius: 24px;
    --home-border-radius-sm: 12px;
}

/* -------------------------------------------------------------------------- */
/*                          8. LIGHT MODE OVERRIDES                           */
/* -------------------------------------------------------------------------- */

html.theme-light,
.theme-light {
    /* Core Replacements */
    --bg-body: #ffffff;
    --bg-card: #f1f5f9;
    --text-main: #0f172a;
    --text-muted: #64748b;

    /* Glass Adjustments for Light Backgrounds */
    --glass-bg: rgba(255, 255, 255, 0.8);
    --glass-border: rgba(0, 0, 0, 0.05);
    --glass-shine: rgba(0, 0, 0, 0.03);

    /* Admin Light Mode Adjustments */
    --text-dim: #94a3b8;

    /* Home Light Mode */
    --home-bg: #ffffff;
    --home-bg-secondary: #f8fafc;
    --home-text-main: #020617;
    --home-text-muted: #64748b;

    --home-border: rgba(0, 0, 0, 0.1);
    --home-card-bg: rgba(255, 255, 255, 0.8);
    --home-card-hover: rgba(0, 0, 0, 0.03);
}