/* /public/lib/styles/variables.css */
/* CSS Custom Properties for consistent theming */

:root {
  /* Colors - Light theme */
  --bg: #f6f7fb;
  --text: #0b0b0c;
  --muted: #60636b;
  --card: #ffffff;
  --subcard: #ffffff;
  --chip: #f1f3f7;
  --border: #e7e8ec;
  --accent: #2563eb;
  --accent2: #7c3aed;
  --success: #22c55e;
  --warning: #f59e0b;
  --error: #ef4444;
  --shadow: 0 8px 24px rgba(0,0,0,.08);
  
  /* Spacing */
  --space-xs: 4px;
  --space-sm: 8px;
  --space-md: 12px;
  --space-lg: 16px;
  --space-xl: 20px;
  --space-2xl: 24px;
  --space-3xl: 32px;
  
  /* Border radius */
  --radius-sm: 4px;
  --radius-md: 8px;
  --radius-lg: 12px;
  --radius-xl: 16px;
  --radius-full: 50%;
  
  /* Typography */
  --font-family: Inter, system-ui, -apple-system, Segoe UI, Roboto, Arial, sans-serif;
  --font-size-xs: 12px;
  --font-size-sm: 14px;
  --font-size-md: 16px;
  --font-size-lg: 18px;
  --font-size-xl: 20px;
  --font-size-2xl: 24px;
  --font-size-3xl: 32px;
  
  /* Font weights */
  --font-weight-normal: 400;
  --font-weight-medium: 500;
  --font-weight-semibold: 600;
  --font-weight-bold: 700;
  --font-weight-extrabold: 800;
  
  /* Line heights */
  --line-height-tight: 1.25;
  --line-height-normal: 1.5;
  --line-height-relaxed: 1.75;
  
  /* Transitions */
  --transition-fast: 0.15s ease;
  --transition-normal: 0.2s ease;
  --transition-slow: 0.3s ease;
  
  /* Z-indexes */
  --z-dropdown: 100;
  --z-sticky: 200;
  --z-fixed: 300;
  --z-modal-backdrop: 400;
  --z-modal: 500;
  --z-popover: 600;
  --z-tooltip: 700;
  --z-toast: 800;
}

/* Dark theme */
@media (prefers-color-scheme: dark) {
  :root {
    --bg: #0b0b0c;
    --text: #fff;
    --muted: #b6b7bd;
    --card: #151516;
    --subcard: #101012;
    --chip: #1c1c20;
    --border: #26262a;
    --accent: #0a84ff;
    --accent2: #4f46e5;
    --success: #22c55e;
    --warning: #f59e0b;
    --error: #ef4444;
    --shadow: 0 10px 30px rgba(0,0,0,.35);
  }
}

/* Force dark theme for games */
.game-theme-dark {
  --bg: #0b0b0c !important;
  --text: #fff !important;
  --muted: #b6b7bd !important;
  --card: #151516 !important;
  --subcard: #101012 !important;
  --chip: #1c1c20 !important;
  --border: #26262a !important;
  --accent: #0a84ff !important;
  --accent2: #4f46e5 !important;
  --shadow: 0 10px 30px rgba(0,0,0,.35) !important;
}