/* TradeControl BR2049 Enhanced Theme Tokens */

:root {
  /* Font stacks */
  --tc-font-sans: "Space Grotesk", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
  --tc-font-mono: "JetBrains Mono", "Cascadia Code", "Fira Code", ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, monospace;

  /* Radii */
  --tc-radius-sm: 8px;
  --tc-radius-md: 12px;
  --tc-radius-lg: 16px;
  --tc-radius-xl: 20px;

  /* Spacing */
  --tc-space-1: 4px;
  --tc-space-2: 8px;
  --tc-space-3: 12px;
  --tc-space-4: 16px;
  --tc-space-5: 24px;
  --tc-space-6: 32px;
  --tc-space-7: 48px;

  /* Base colors (deep noir) */
  --tc-bg-0: #020308;
  --tc-bg-1: #050712;
  --tc-bg-2: #080C1A;
  --tc-bg-3: #0B1020;

  /* Surfaces with transparency */
  --tc-surface-0: rgba(8, 12, 26, 0.85);
  --tc-surface-1: rgba(12, 18, 36, 0.75);
  --tc-surface-2: rgba(17, 26, 52, 0.65);

  /* Text hierarchy */
  --tc-text-0: #F0F4FF;
  --tc-text-1: #D4DCEE;
  --tc-text-2: #A8B4D0;
  --tc-text-3: #6E7A94;
  --tc-text-4: #4A5468;

  /* Lines and borders */
  --tc-line-0: rgba(173, 198, 255, 0.08);
  --tc-line-1: rgba(173, 198, 255, 0.12);
  --tc-line-2: rgba(173, 198, 255, 0.20);
  --tc-line-3: rgba(173, 198, 255, 0.30);

  /* BR2049 Signature Colors */
  --tc-amber: #FFB300;
  --tc-amber-bright: #FFD966;
  --tc-amber-dark: #CC8F00;

  --tc-cyan: #3DF5FF;
  --tc-cyan-bright: #B8FCFF;
  --tc-cyan-dark: #00C8D4;

  --tc-magenta: #FF3D8A;
  --tc-magenta-bright: #FF8AB8;
  --tc-magenta-dark: #D4005C;

  --tc-purple: #B366FF;
  --tc-purple-bright: #D9B3FF;

  /* Semantic colors */
  --tc-success: #3DFFB2;
  --tc-success-bg: rgba(61, 255, 178, 0.12);
  --tc-warning: #FFB84D;
  --tc-warning-bg: rgba(255, 184, 77, 0.12);
  --tc-danger: #FF3D5A;
  --tc-danger-bg: rgba(255, 61, 90, 0.12);
  --tc-info: #4DA6FF;
  --tc-info-bg: rgba(77, 166, 255, 0.12);

  /* Shadows */
  --tc-shadow-sm: 0 2px 8px rgba(0, 0, 0, 0.3);
  --tc-shadow-md: 0 8px 24px rgba(0, 0, 0, 0.4);
  --tc-shadow-lg: 0 16px 48px rgba(0, 0, 0, 0.5);
  --tc-shadow-xl: 0 24px 64px rgba(0, 0, 0, 0.6);

  /* Glass effects */
  --tc-blur-sm: 8px;
  --tc-blur-md: 12px;
  --tc-blur-lg: 20px;

  /* Focus effects */
  --tc-focus-cyan: 0 0 0 3px rgba(61, 245, 255, 0.25), 0 0 16px rgba(61, 245, 255, 0.15);
  --tc-focus-amber: 0 0 0 3px rgba(255, 179, 0, 0.25), 0 0 16px rgba(255, 179, 0, 0.15);

  /* Glow effects */
  --tc-glow-ambient: 0 0 32px rgba(61, 245, 255, 0.08);
  --tc-glow-amber: 0 0 24px rgba(255, 179, 0, 0.25), 0 0 48px rgba(255, 179, 0, 0.12);
  --tc-glow-cyan: 0 0 24px rgba(61, 245, 255, 0.25), 0 0 48px rgba(61, 245, 255, 0.12);
  --tc-glow-magenta: 0 0 24px rgba(255, 61, 138, 0.25), 0 0 48px rgba(255, 61, 138, 0.12);
  --tc-glow-purple: 0 0 24px rgba(179, 102, 255, 0.25), 0 0 48px rgba(179, 102, 255, 0.12);

  /* Motion */
  --tc-ease-smooth: cubic-bezier(0.4, 0, 0.2, 1);
  --tc-ease-in: cubic-bezier(0.4, 0, 1, 1);
  --tc-ease-out: cubic-bezier(0, 0, 0.2, 1);
  --tc-ease-bounce: cubic-bezier(0.68, -0.55, 0.265, 1.55);
  --tc-dur-1: 150ms;
  --tc-dur-2: 250ms;
  --tc-dur-3: 350ms;
  --tc-dur-4: 500ms;
}

html[data-theme="br2049"] {
  color-scheme: dark;

  /* Primary accent */
  --tc-accent-0: var(--tc-amber);
  --tc-accent-bright: var(--tc-amber-bright);
  --tc-accent-dark: var(--tc-amber-dark);

  /* Secondary accent */
  --tc-accent-secondary: var(--tc-cyan);
  --tc-accent-secondary-bright: var(--tc-cyan-bright);
  --tc-accent-secondary-dark: var(--tc-cyan-dark);

  /* Tertiary */
  --tc-accent-tertiary: var(--tc-magenta);
}
