/* ==========================================================================
   FANALYTICS THEME TOKENS — dark only (Fanalytics navy)
   ========================================================================== */

:root {
  --fa-bg: #0A1628;
  --fa-surface: #101D33;
  --fa-surface-2: #13233D;
  --fa-surface-3: rgba(255, 255, 255, 0.03);
  --fa-border: rgba(255, 255, 255, 0.10);
  --fa-border-subtle: rgba(255, 255, 255, 0.06);
  --fa-text: #FFFFFF;
  --fa-text-secondary: rgba(255, 255, 255, 0.88);
  --fa-muted: #9CA9BD;
  --fa-muted-2: rgba(255, 255, 255, 0.45);
  --fa-primary: #00C2CB;
  --fa-primary-soft: rgba(0, 194, 203, 0.15);
  --fa-primary-hover: rgba(0, 194, 203, 0.10);
  --fa-danger: #FF4D4F;
  --fa-warning: #F5B301;
  --fa-success: #18C37E;

  --fa-card: rgba(255, 255, 255, 0.03);
  --fa-card-hover: rgba(0, 194, 203, 0.04);
  --fa-card-border: rgba(255, 255, 255, 0.07);
  --fa-input-bg: rgba(255, 255, 255, 0.05);
  --fa-input-border: rgba(255, 255, 255, 0.14);
  --fa-input-text: rgba(255, 255, 255, 0.9);
  --fa-input-placeholder: rgba(255, 255, 255, 0.42);
  --fa-header-bg: rgba(10, 22, 40, 0.92);
  --fa-shadow: 0 2px 8px rgba(0, 0, 0, 0.3);
  --fa-glow: 0 0 12px rgba(0, 194, 203, 0.15);
  --fa-table-header: rgba(10, 22, 40, 0.95);
  --fa-table-row: transparent;
  --fa-table-row-hover: rgba(0, 194, 203, 0.03);
  --fa-table-border: rgba(255, 255, 255, 0.04);
  --fa-badge-bg: rgba(255, 255, 255, 0.06);
  --fa-badge-text: rgba(255, 255, 255, 0.5);

  /* Scrollbars — global dark + cyan accent */
  --scrollbar-track: rgba(7, 17, 31, 0.9);
  --scrollbar-thumb: rgba(0, 194, 203, 0.38);
  --scrollbar-thumb-hover: rgba(0, 194, 203, 0.7);
  --scrollbar-size: 8px;
  --scrollbar-size-thin: 6px;
  --fa-scrollbar-thumb: var(--scrollbar-thumb);

  --fa-overlay: rgba(0, 0, 0, 0.6);

  --fa-font-body: 'Inter', system-ui, -apple-system, sans-serif;
  --fa-font-display: 'Barlow Condensed', 'Arial Narrow', sans-serif;

  --fa-control-bg: var(--fa-input-bg);
  --fa-control-border: var(--fa-input-border);
  --fa-control-text: var(--fa-input-text);
  --fa-control-placeholder: var(--fa-input-placeholder);
}

body {
  background-color: var(--fa-bg);
  color: var(--fa-text-secondary);
}