/* ============================================================
   BACFUTURES CRM V2.0 — variables.css
   Tất cả design tokens (Digi-system mục 1)
   Mọi giá trị định nghĩa 1 lần duy nhất tại :root
   ============================================================ */

:root {
  /* ── Brand ── */
  --bac-brand: #00a859;
  --bac-brand-hover: #009150;
  --bac-brand-active: #007a42;
  --bac-brand-light: rgba(0, 168, 89, 0.12);
  --bac-brand-glow: rgba(0, 168, 89, 0.25);

  /* ── Surface (Material 3 elevation) ── */
  --bac-surface-0: #0a0e14;
  --bac-surface-1: #111820;
  --bac-surface-2: #161e2a;
  --bac-surface-3: #1a2332;
  --bac-surface-input: #0d1319;

  /* ── On-surface text (WCAG 2.2 AA verified) ── */
  --bac-text-primary: #f1f5f9;
  --bac-text-secondary: #b4c2d0;
  --bac-text-tertiary: #8b9bab;
  --bac-text-disabled: #5a6b7e;

  /* ── Outline / Border ── */
  --bac-outline: #1e2936;
  --bac-outline-variant: #2a3a4e;
  --bac-outline-focus: var(--bac-brand);

  /* ── Semantic ── */
  --bac-success: #00a859;
  --bac-warning: #f5a623;
  --bac-danger: #ef4444;
  --bac-info: #3b82f6;
  --bac-neutral: #64748b;

  /* ── Semantic container (tint background) ── */
  --bac-success-container: rgba(0, 168, 89, 0.12);
  --bac-warning-container: rgba(245, 166, 35, 0.12);
  --bac-danger-container: rgba(239, 68, 68, 0.12);
  --bac-info-container: rgba(59, 130, 246, 0.12);
  --bac-neutral-container: rgba(100, 116, 139, 0.12);

  /* ── Trust Tiers ── */
  --bac-trust-new: #64748b;
  --bac-trust-verified: #3b82f6;
  --bac-trust-trusted: #00a859;
  --bac-trust-watch: #f5a623;
  --bac-trust-suspended: #ef4444;

  /* ── Account Status (Broker/Firm API) ── */
  --bac-account-active: #00a859;
  --bac-account-paused: #f5a623;
  --bac-account-stopped: #ef4444;

  /* ── 8pt Grid Scale ── */
  --bac-space-0: 0px;
  --bac-space-1: 4px;
  --bac-space-2: 8px;
  --bac-space-3: 12px;
  --bac-space-4: 16px;
  --bac-space-5: 20px;
  --bac-space-6: 24px;
  --bac-space-7: 32px;
  --bac-space-8: 40px;
  --bac-space-9: 48px;
  --bac-space-10: 64px;

  /* ── Font Family ── */
  --bac-font-sans: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
  --bac-font-mono: 'JetBrains Mono', 'Fira Code', ui-monospace, monospace;

  /* ── Type Scale (Major Third — 1.25 ratio) ── */
  --bac-text-xs: 0.75rem;
  --bac-text-sm: 0.875rem;
  --bac-text-base: 1rem;
  --bac-text-md: 1.125rem;
  --bac-text-lg: 1.25rem;
  --bac-text-xl: 1.5rem;
  --bac-text-2xl: 1.875rem;
  --bac-text-3xl: 2.25rem;

  /* ── Font Weight ── */
  --bac-fw-normal: 400;
  --bac-fw-medium: 500;
  --bac-fw-semibold: 600;
  --bac-fw-bold: 700;

  /* ── Line Height ── */
  --bac-lh-tight: 1.25;
  --bac-lh-snug: 1.375;
  --bac-lh-normal: 1.5;
  --bac-lh-relaxed: 1.625;

  /* ── Letter Spacing ── */
  --bac-ls-tight: -0.01em;
  --bac-ls-normal: 0;
  --bac-ls-wide: 0.025em;
  --bac-ls-wider: 0.05em;

  /* ── Radius ── */
  --bac-radius-xs: 4px;
  --bac-radius-sm: 6px;
  --bac-radius-md: 8px;
  --bac-radius-lg: 12px;
  --bac-radius-xl: 16px;
  --bac-radius-full: 9999px;

  /* ── Elevation / Shadow (Material 3) ── */
  --bac-elevation-1: 0 1px 3px rgba(0, 0, 0, 0.30), 0 1px 2px rgba(0, 0, 0, 0.20);
  --bac-elevation-2: 0 2px 6px rgba(0, 0, 0, 0.35), 0 1px 2px rgba(0, 0, 0, 0.20);
  --bac-elevation-3: 0 4px 12px rgba(0, 0, 0, 0.35), 0 2px 4px rgba(0, 0, 0, 0.20);
  --bac-elevation-4: 0 8px 24px rgba(0, 0, 0, 0.40), 0 4px 8px rgba(0, 0, 0, 0.20);
  --bac-elevation-5: 0 16px 48px rgba(0, 0, 0, 0.45), 0 8px 16px rgba(0, 0, 0, 0.20);

  /* ── Brand glow — hover accent ── */
  --bac-glow-brand: 0 0 0 3px var(--bac-brand-glow);
  --bac-glow-focus: 0 0 0 3px var(--bac-brand-glow);

  /* ── Layout Dimensions ── */
  --bac-sidebar-width: 256px;
  --bac-sidebar-collapsed: 64px;
  --bac-header-height: 64px;
  --bac-view-padding-x: var(--bac-space-6);
  --bac-view-padding-y: var(--bac-space-6);
  --bac-content-max-width: 1440px;
  --bac-content-narrow: 768px;
  --bac-bp-mobile: 1024px;
  --bac-bp-tablet: 768px;
  --bac-mobile-tabbar-height: 56px;

  /* ── Motion / Transition (Material 3) ── */
  --bac-duration-instant: 50ms;
  --bac-duration-fast: 150ms;
  --bac-duration-normal: 250ms;
  --bac-duration-slow: 400ms;
  --bac-duration-slower: 500ms;

  --bac-ease-standard: cubic-bezier(0.2, 0, 0, 1);
  --bac-ease-emphasized: cubic-bezier(0.3, 0, 0, 1);
  --bac-ease-decelerated: cubic-bezier(0, 0, 0, 1);
  --bac-ease-accelerated: cubic-bezier(0.3, 0, 1, 1);

  --bac-transition-fast: var(--bac-duration-fast) var(--bac-ease-standard);
  --bac-transition-normal: var(--bac-duration-normal) var(--bac-ease-emphasized);
  --bac-transition-slow: var(--bac-duration-slow) var(--bac-ease-emphasized);

  /* ── Z-Index Scale ── */
  --bac-z-base: 0;
  --bac-z-sticky: 10;
  --bac-z-sidebar: 20;
  --bac-z-dropdown: 30;
  --bac-z-drawer: 40;
  --bac-z-modal-backdrop: 50;
  --bac-z-modal: 60;
  --bac-z-toast: 70;
  --bac-z-tooltip: 80;
}