/**
 * HuntEngine - Design Tokens & Centralized Theming Variables
 * Designed for 1080p OBS Browser Source (transparent canvas)
 */

:root {
  --glass-surface: rgba(15, 23, 42, 0.65);
  --brand-wash: rgba(161, 230, 188, 0.04);
  --brand-soft: rgba(161, 230, 188, 0.1);
  --brand-line: rgba(161, 230, 188, 0.26);

  /* ==========================================================================
     CORE BRAND & CASINO SPONSOR THEMES (Easily swapped via data-theme attribute)
     Default: "Stake Carbon & Emerald"
     ========================================================================== */
  --accent-primary: #a1e6bc; /* Independent mint */
  --accent-primary-glow: rgba(161, 230, 188, 0.25);
  --accent-secondary: #00c0f0; /* Cyan accent for informational metrics */
  --accent-warning: #f59e0b; /* Amber for high multiplier warnings/break-even */
  --accent-danger: #ef4444; /* Red for loss / negative ROI */
  --accent-gold: #fbbf24; /* Gold for 500x+ and Max Wins */

  /* Surface & Glassmorphism Colors */
  --bg-hud: rgba(11, 15, 23, 0.88); /* Deep Matte Obsidian Slate */
  --bg-hud-gradient: linear-gradient(180deg, rgba(17, 24, 39, 0.94) 0%, rgba(11, 15, 23, 0.9) 100%);
  --bg-card: rgba(22, 30, 46, 0.7); /* Card surface */
  --bg-card-hover: rgba(30, 41, 59, 0.85);
  --bg-subtle: rgba(255, 255, 255, 0.04); /* Micro-containers, inputs */
  --bg-pill: rgba(255, 255, 255, 0.08);

  /* Borders & Separation (Fine 1px matte borders) */
  --border-subtle: rgba(255, 255, 255, 0.07);
  --border-card: rgba(255, 255, 255, 0.12);
  --border-highlight: rgba(0, 231, 1, 0.4);
  --border-radius-sm: 6px;
  --border-radius-md: 10px;
  --border-radius-lg: 14px;
  --border-radius-full: 9999px;

  /* Typography */
  --font-sans: 'Inter', system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
  --font-mono: 'JetBrains Mono', 'Chakra Petch', SFMono-Regular, Consolas, monospace;

  --text-primary: #f8fafc; /* Ultra-crisp off-white */
  --text-secondary: #94a3b8; /* Muted Slate Gray */
  --text-tertiary: #64748b; /* Darker secondary labels */
  --text-accent: var(--accent-primary);

  /* Dynamic Multiplier Tier Colors */
  --tier-dud: #64748b; /* < 20x (Slate / Dead spin) */
  --tier-normal: #38bdf8; /* 20x - 99x (Sky Blue) */
  --tier-good: #00e701; /* 100x - 499x (Vibrant Emerald) */
  --tier-super: #c084fc; /* 500x - 999x (Electric Amethyst) */
  --tier-mega: #f59e0b; /* 1000x+ (Golden Supernova) */

  /* Shadows & Depth */
  --shadow-hud: 0 20px 40px -15px rgba(0, 0, 0, 0.8), 0 0 1px 1px rgba(255, 255, 255, 0.05);
  --shadow-card: 0 8px 16px -4px rgba(0, 0, 0, 0.5);
  --shadow-accent-glow: 0 0 20px var(--accent-primary-glow);

  /* Performance & Backdrop Filters */
  --backdrop-blur: blur(12px);
  --transition-smooth: all 0.25s cubic-bezier(0.16, 1, 0.3, 1);
  --transition-fast: all 0.15s ease-out;

  /* Layout dimensions */
  --hud-width: 340px;
  --screen-margin-x: 28px;
  --screen-margin-y: 28px;
}

/* ==========================================================================
   THEME PRESETS (Instant white-label swap via <html data-theme="...">)
   ========================================================================== */

/* BC.Game Theme (Neon Green & Deep Violet-Black) */
[data-theme='bcgame'] {
  --glass-surface: rgba(22, 17, 39, 0.65);
  --brand-wash: rgba(0, 231, 1, 0.04);
  --brand-soft: rgba(0, 231, 1, 0.1);
  --brand-line: rgba(0, 231, 1, 0.26);

  --accent-primary: #00e701;
  --accent-primary-glow: rgba(0, 231, 1, 0.3);
  --accent-secondary: #a855f7;
  --bg-hud: rgba(15, 12, 28, 0.9);
  --bg-hud-gradient: linear-gradient(180deg, rgba(22, 17, 43, 0.94) 0%, rgba(12, 10, 22, 0.9) 100%);
  --bg-card: rgba(28, 22, 54, 0.7);
  --border-highlight: rgba(0, 231, 1, 0.5);
}

/* Roobet Theme (Gold & Sleek Navy) */
[data-theme='roobet'] {
  --glass-surface: rgba(16, 24, 42, 0.65);
  --brand-wash: rgba(255, 196, 0, 0.04);
  --brand-soft: rgba(255, 196, 0, 0.1);
  --brand-line: rgba(255, 196, 0, 0.26);

  --accent-primary: #ffc400;
  --accent-primary-glow: rgba(255, 196, 0, 0.28);
  --accent-secondary: #6366f1;
  --bg-hud: rgba(9, 14, 26, 0.9);
  --bg-hud-gradient: linear-gradient(180deg, rgba(16, 24, 46, 0.94) 0%, rgba(9, 14, 26, 0.9) 100%);
  --bg-card: rgba(23, 33, 61, 0.72);
  --border-highlight: rgba(255, 196, 0, 0.45);
}

/* Rollbit Theme (Solar Yellow / Cyber Gold) */
[data-theme='rollbit'] {
  --glass-surface: rgba(27, 24, 30, 0.65);
  --brand-wash: rgba(250, 204, 21, 0.04);
  --brand-soft: rgba(250, 204, 21, 0.1);
  --brand-line: rgba(250, 204, 21, 0.26);

  --accent-primary: #facc15;
  --accent-primary-glow: rgba(250, 204, 21, 0.25);
  --accent-secondary: #3b82f6;
  --bg-hud: rgba(14, 18, 27, 0.9);
  --bg-hud-gradient: linear-gradient(180deg, rgba(20, 26, 40, 0.94) 0%, rgba(12, 16, 24, 0.9) 100%);
  --bg-card: rgba(27, 34, 51, 0.72);
  --border-highlight: rgba(250, 204, 21, 0.4);
}

/* Minimalist Titanium (For high-roller, mature streamers) */
[data-theme='titanium'] {
  --accent-primary: #e2e8f0;
  --accent-primary-glow: rgba(255, 255, 255, 0.15);
  --accent-secondary: #64748b;
  --bg-hud: rgba(15, 15, 18, 0.92);
  --bg-hud-gradient: linear-gradient(180deg, rgba(24, 24, 28, 0.95) 0%, rgba(12, 12, 15, 0.92) 100%);
  --bg-card: rgba(30, 30, 36, 0.75);
  --border-highlight: rgba(255, 255, 255, 0.3);
}

[data-theme='none'] {
  --glass-surface: rgba(15, 23, 42, 0.65);
  --brand-wash: rgba(161, 230, 188, 0.04);
  --brand-soft: rgba(161, 230, 188, 0.1);
  --brand-line: rgba(161, 230, 188, 0.26);

  --accent-primary: #a1e6bc;
  --accent-primary-glow: #a1e6bc25;
  --border-highlight: #a1e6bc66;
}
[data-theme='shuffle'] {
  --glass-surface: rgba(24, 18, 42, 0.65);
  --brand-wash: rgba(183, 138, 246, 0.04);
  --brand-soft: rgba(183, 138, 246, 0.1);
  --brand-line: rgba(183, 138, 246, 0.26);

  --accent-primary: #b78af6;
  --accent-primary-glow: #b78af630;
  --border-highlight: #b78af677;
  --bg-hud: #141023ed;
}

[data-theme='stake'] {
  --glass-surface: rgba(12, 27, 33, 0.65);
  --brand-wash: rgba(0, 231, 1, 0.04);
  --brand-soft: rgba(0, 231, 1, 0.1);
  --brand-line: rgba(0, 231, 1, 0.26);
  --accent-primary: #00e701;
  --accent-primary-glow: rgba(0, 231, 1, 0.25);
}