/*
 * CryptoTerminal UI tokens
 * Foundation layer only. Feature CSS should consume these variables instead of
 * introducing new colors, radii, shadows, spacing, or typography values.
 */
:root {
  color-scheme: light;

  /* Brand */
  --ct-color-brand-50: #eff6ff;
  --ct-color-brand-100: #dbeafe;
  --ct-color-brand-200: #bfdbfe;
  --ct-color-brand-300: #93c5fd;
  --ct-color-brand-500: #126dff;
  --ct-color-brand-600: #0756d8;
  --ct-color-brand-700: #0647ae;

  /* Surfaces */
  --ct-color-page: #f4f7fb;
  --ct-color-page-soft: #f8fbff;
  --ct-color-surface: #ffffff;
  --ct-color-surface-soft: #f7faff;
  --ct-color-surface-raised: #ffffff;
  --ct-color-border: #d9e4f3;
  --ct-color-border-soft: #edf1f7;
  --ct-color-divider: #e8eef7;

  /* Text */
  --ct-color-text: #101828;
  --ct-color-text-strong: #161a25;
  --ct-color-text-muted: #667085;
  --ct-color-text-soft: #98a2b3;
  --ct-color-text-inverse: #ffffff;

  /* Semantic */
  --ct-color-success-50: #ecfdf3;
  --ct-color-success-100: #dcfae6;
  --ct-color-success-200: #abefc6;
  --ct-color-success-600: #039855;
  --ct-color-success-700: #067647;

  --ct-color-warning-50: #fffaeb;
  --ct-color-warning-100: #fef0c7;
  --ct-color-warning-200: #fedf89;
  --ct-color-warning-600: #dc6803;
  --ct-color-warning-700: #b54708;

  --ct-color-danger-50: #fef3f2;
  --ct-color-danger-100: #fee4e2;
  --ct-color-danger-200: #fecaca;
  --ct-color-danger-600: #d92d20;
  --ct-color-danger-700: #b42318;

  --ct-color-neutral-50: #f3f6fb;
  --ct-color-neutral-100: #eef2f7;
  --ct-color-neutral-200: #d8e3f2;
  --ct-color-neutral-500: #667085;
  --ct-color-neutral-700: #344054;

  --ct-color-premium-50: #f5f3ff;
  --ct-color-premium-100: #ede9fe;
  --ct-color-premium-200: #ddd6fe;
  --ct-color-premium-600: #7c3aed;
  --ct-color-premium-700: #6d28d9;

  --ct-color-dev-50: #fff7ed;
  --ct-color-dev-100: #ffedd5;
  --ct-color-dev-600: #ea580c;
  --ct-color-dev-700: #c2410c;

  /* Trading semantics */
  --ct-status-bullish: var(--ct-color-success-600);
  --ct-status-bearish: var(--ct-color-danger-600);
  --ct-status-neutral: var(--ct-color-neutral-500);
  --ct-status-wait: var(--ct-color-warning-600);
  --ct-status-opportunity: var(--ct-color-success-600);
  --ct-status-no-trade: var(--ct-color-neutral-500);

  /* Typography */
  --ct-font-body: "Space Grotesk", system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  --ct-font-mono: "IBM Plex Mono", "SFMono-Regular", Consolas, monospace;
  --ct-font-weight-regular: 500;
  --ct-font-weight-semibold: 700;
  --ct-font-weight-bold: 800;
  --ct-font-weight-black: 900;

  --ct-font-size-xs: 0.72rem;
  --ct-font-size-sm: 0.82rem;
  --ct-font-size-md: 0.94rem;
  --ct-font-size-lg: 1rem;
  --ct-font-size-xl: 1.2rem;
  --ct-font-size-2xl: 1.62rem;
  --ct-font-size-3xl: clamp(1.9rem, 3vw, 2.45rem);

  --ct-line-tight: 1.08;
  --ct-line-title: 1.16;
  --ct-line-body: 1.48;

  --ct-letter-tight: -0.045em;
  --ct-letter-title: -0.03em;
  --ct-letter-label: 0.08em;

  /* Radius */
  --ct-radius-xs: 6px;
  --ct-radius-sm: 8px;
  --ct-radius-md: 10px;
  --ct-radius-lg: 14px;
  --ct-radius-xl: 18px;
  --ct-radius-2xl: 22px;
  --ct-radius-pill: 999px;

  /* Spacing */
  --ct-space-1: 0.25rem;
  --ct-space-2: 0.5rem;
  --ct-space-3: 0.75rem;
  --ct-space-4: 1rem;
  --ct-space-5: 1.25rem;
  --ct-space-6: 1.5rem;
  --ct-space-8: 2rem;

  /* Shadows */
  --ct-shadow-xs: 0 1px 2px rgba(16, 24, 40, 0.04);
  --ct-shadow-sm: 0 8px 18px rgba(23, 37, 63, 0.08);
  --ct-shadow-card: 0 12px 34px rgba(31, 48, 76, 0.06);
  --ct-shadow-card-hover: 0 16px 44px rgba(31, 48, 76, 0.1);
  --ct-shadow-modal: 0 30px 90px rgba(23, 37, 63, 0.2);

  /* Component sizing */
  --ct-button-height: 42px;
  --ct-button-height-sm: 34px;
  --ct-input-height: 42px;
  --ct-card-padding: 1rem;
  --ct-card-padding-lg: 1.25rem;

  /* Motion */
  --ct-transition-fast: 140ms ease;
  --ct-transition-base: 190ms ease;
}