/* ==========================================================================
   ORIGINAL BRAND BASELINE (Green & Gold Preserved)
   ========================================================================== */
/* Base Variables & Reset */
:root {
    --primary-color: #11331d;
    --secondary-color: #d1a461; /* Replaced orange with Warm Gold */
    --secondary-dark: #aa7d44;  /* Deep Bronze Accent */
    --text-dark: #333333;
    --text-muted: #666666;
    --text-light: #ffffff;
    --bg-light: #f8f9fa;
    --bg-body: #ffffff;
    --font-primary: 'Segoe UI', system-ui, -apple-system, sans-serif;

    /* Defaults */
    --card-bg: #ffffff;
    --card-border: 1px solid #e2e8f0;
    --card-shadow: 0 4px 6px rgba(0, 0, 0, 0.05);
    --border-radius: 8px;
}
/* ==========================================================================
   THEME: HYPER-GLASS (Gold & Emerald Refinement)
   ========================================================================== */
html[data-theme="hyper-glass"] {
    --bg-body: #080f0a;
    --text-dark: #ffffff;
    --text-main: #f8fafc;
    --text-muted: #cbd5e1;
    --card-bg: rgba(17, 51, 29, 0.55);
    --card-border: 1px solid rgba(255, 255, 255, 0.2);
    --card-shadow: 0 30px 60px -12px rgba(0, 0, 0, 0.7), 
                   inset 0 1px 0 0 rgba(255, 255, 255, 0.3);
    --border-radius: 20px;
    --btn-bg: linear-gradient(135deg, #d1a461 0%, #aa7d44 100%);
    --btn-border: 1px solid rgba(255, 255, 255, 0.4);
    --secondary-color: #d1a461;
}

/* Background Radial Glow Update */
html[data-theme="hyper-glass"] body {
    background-color: var(--bg-body);
    background-image: 
        radial-gradient(at 15% 15%, rgba(17, 51, 29, 0.9) 0px, transparent 55%),
        radial-gradient(at 85% 85%, rgba(209, 164, 97, 0.14) 0px, transparent 55%);
    background-attachment: fixed;
    color: #f8fafc !important;
}
/* ==========================================================================
   THEME 1: FOREST LUX (High-End Luxury Editorial)
   ========================================================================== */
html[data-theme="forest-lux"] {
    --bg-body: #f4f7f4;
    --card-bg: linear-gradient(145deg, #ffffff 0%, #f8fbf8 100%);
    --card-border: 1px solid rgba(243, 156, 18, 0.3);
    --card-shadow: 0 20px 40px -15px rgba(17, 51, 29, 0.12), 0 0 0 1px rgba(243, 156, 18, 0.15);
    --border-radius: 16px;
    --card-hover-transform: translateY(-8px) scale(1.01);
    --card-hover-shadow: 0 30px 60px -12px rgba(17, 51, 29, 0.22), 0 0 20px rgba(243, 156, 18, 0.25);
    --btn-bg: linear-gradient(135deg, #11331d 0%, #1e4d2b 100%);
    --btn-border: 1px solid #f39c12;
}

/* ==========================================================================
   THEME 2: CYBER TIMBER (Neo-Brutalist High-Contrast)
   ========================================================================== */
html[data-theme="cyber-timber"] {
    --bg-body: #f0f3f0;
    --card-bg: #ffffff;
    --card-border: 3px solid #11331d;
    --card-shadow: 6px 6px 0px #11331d, 12px 12px 0px #f39c12;
    --border-radius: 0px;
    --card-hover-transform: translate(-3px, -3px);
    --card-hover-shadow: 9px 9px 0px #11331d, 16px 16px 0px #f39c12;
    --btn-bg: #f39c12;
    --btn-border: 3px solid #11331d;
}

/* ==========================================================================
   THEME 3: EMERALD GLOW (Aurora Mesh & Glass Depth)
   ========================================================================== */
html[data-theme="emerald-glow"] {
    --bg-body: #eef4f0;
    --card-bg: rgba(255, 255, 255, 0.85);
    --card-border: 1px solid rgba(255, 255, 255, 0.8);
    --card-shadow: 0 8px 32px 0 rgba(17, 51, 29, 0.08), inset 0 0 0 1px rgba(243, 156, 18, 0.2);
    --border-radius: 24px;
    --card-hover-transform: translateY(-6px);
    --card-hover-shadow: 0 20px 40px 0 rgba(17, 51, 29, 0.18), inset 0 0 0 2px #f39c12;
    --btn-bg: linear-gradient(135deg, #11331d 0%, #275936 100%);
    --btn-border: none;
}

/* ==========================================================================
   THEME 4: RUGGED TACTICAL (Heavy Contractor Pro)
   ========================================================================== */
html[data-theme="rugged-tactical"] {
    --bg-body: #e5e8e5;
    --card-bg: repeating-linear-gradient(45deg, #ffffff, #ffffff 10px, #f9fbf9 10px, #f9fbf9 20px);
    --card-border: 2px solid #2d3748;
    --card-shadow: inset 0 2px 4px rgba(255, 255, 255, 0.8), 0 4px 12px rgba(0,0,0,0.15);
    --border-radius: 4px;
    --card-hover-transform: translateY(-4px);
    --card-hover-shadow: inset 0 2px 4px rgba(255, 255, 255, 0.9), 0 12px 24px rgba(17, 51, 29, 0.25);
    --btn-bg: #11331d;
    --btn-border: 2px solid #f39c12;
}

/* ==========================================================================
   THEME 5: BENTO ZEN (Apple Grid Modular)
   ========================================================================== */
html[data-theme="bento-zen"] {
    --bg-body: #f2f4f2;
    --card-bg: #ffffff;
    --card-border: 1px solid rgba(0, 0, 0, 0.06);
    --card-shadow: 0 4px 20px rgba(0, 0, 0, 0.03), inset 0 1px 0 rgba(255, 255, 255, 1);
    --border-radius: 20px;
    --card-hover-transform: scale(1.02);
    --card-hover-shadow: 0 20px 40px rgba(17, 51, 29, 0.1);
    --btn-bg: #11331d;
    --btn-border: 1px solid rgba(0,0,0,0.1);
}

* {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
}

body {
    font-family: var(--font-primary);
    color: var(--text-dark);
    background-color: var(--bg-light);
    line-height: 1.6;
    -webkit-font-smoothing: antialiased;
}

a {
    text-decoration: none;
    color: inherit;
}

ul {
    list-style: none;
}
/* ==========================================================================
   THEME: HYPER-GLASS (High-Contrast Obsidian + Gloss)
   ========================================================================== */
html[data-theme="hyper-glass"] {
    --bg-body: #080f0a; /* Obsidian Deep Forest */
    --text-dark: #ffffff;
    --text-main: #f8fafc;
    --text-muted: #cbd5e1;
    --card-bg: rgba(17, 51, 29, 0.55);
    --card-border: 1px solid rgba(255, 255, 255, 0.2);
    --card-shadow: 0 30px 60px -12px rgba(0, 0, 0, 0.7), 
                   inset 0 1px 0 0 rgba(255, 255, 255, 0.3);
    --border-radius: 20px;
    --btn-bg: linear-gradient(135deg, #f39c12 0%, #d35400 100%);
    --btn-border: 1px solid rgba(255, 255, 255, 0.4);
}

/* --- Global Background & Universal White Text Overrides --- */
html[data-theme="hyper-glass"] body {
    background-color: var(--bg-body);
    background-image: 
        radial-gradient(at 15% 15%, rgba(17, 51, 29, 0.9) 0px, transparent 55%),
        radial-gradient(at 85% 85%, rgba(243, 156, 18, 0.12) 0px, transparent 55%);
    background-attachment: fixed;
    color: #f8fafc !important;
}

/* Force all headers, body text, lists, and paragraphs to white/light */
html[data-theme="hyper-glass"] h1, 
html[data-theme="hyper-glass"] h2, 
html[data-theme="hyper-glass"] h3,
html[data-theme="hyper-glass"] h4,
html[data-theme="hyper-glass"] h5,
html[data-theme="hyper-glass"] h6,
html[data-theme="hyper-glass"] .section-title {
    color: #ffffff !important;
}

html[data-theme="hyper-glass"] p,
html[data-theme="hyper-glass"] span,
html[data-theme="hyper-glass"] li,
html[data-theme="hyper-glass"] label,
html[data-theme="hyper-glass"] div {
    color: #e2e8f0;
}

/* Convert default white section blocks to dark glass */
html[data-theme="hyper-glass"] .bg-light,
html[data-theme="hyper-glass"] section.bg-light {
    background-color: rgba(0, 0, 0, 0.35) !important;
}