/* generated — edit design/tokens.json */
/* ═══════════════════════════════════════════════════════════════════
   LEADFINN UNIFIED THEME TOKENS — CSS CUSTOM PROPERTIES
   WCAG AA Compliant — Normal text >= 4.5:1, Large text >= 3.0:1
═══════════════════════════════════════════════════════════════════ */

:root {
  color-scheme: dark;

  /* ── Color Neutrals (Dark) ── */
  --bg:              #0F1117;
  --surface:         #1A1D26;
  --card:            #1E2130;
  --card-raised:     #252838;
  --border:          #2A2D3A;
  --border-hover:    #3A3D4E;
  --border-strong:   #3A3D4E;
  --text-1:          #F0F2F5;
  --text-2:          #A0A8B8;
  --text-3:          #6B7280;
  --text-dis:        #4A4F5C;
  --text-disabled:   #4A4F5C;
  --text-placeholder: #6B7280;
  --hover:           rgba(255, 255, 255, 0.06);
  --row-hover:       rgba(255, 255, 255, 0.03);
  --scrim:           rgba(0, 0, 0, 0.60);

  /* ── Brand & Action (Dark) ── */
  --primary:         #8D99F6;
  --primary-hover:   #A9B2F9;
  --primary-solid:   #3448D4;
  --primary-dim:     rgba(141, 153, 246, 0.16);
  --purple:          #A78BFA;
  --purple-dim:      rgba(167, 139, 250, 0.16);
  --accent-purple:   #A78BFA;
  --logo-grad-1:     #8D99F6;
  --logo-grad-2:     #C4B5FD;

  /* ── Market Semantics (Dark) ── */
  --success:         #34D399;
  --success-dim:     rgba(52, 211, 153, 0.14);
  --up:              #34D399;
  --up-dim:          rgba(52, 211, 153, 0.14);
  --danger:          #F87171;
  --danger-hover:    #FCA5A5;
  --danger-dim:      rgba(248, 113, 113, 0.14);
  --down:            #F87171;
  --down-dim:        rgba(248, 113, 113, 0.14);
  --warning:         #FBBF24;
  --warning-dim:     rgba(251, 191, 36, 0.14);
  --warn:            #FBBF24;
  --warn-dim:        rgba(251, 191, 36, 0.14);
  --info:            #8D99F6;
  --neutral-change:  #A0A8B8;

  /* ── Chart Palette (Dark) ── */
  --chart-bg:        #0F1117;
  --chart-grid:      #22252F;
  --chart-axis-text: #6B7280;
  --chart-text:      #6B7280;
  --chart-crosshair: rgba(107, 114, 128, 0.60);
  --chart-crosshair-bg: #252838;
  --candle-up:       #34D399;
  --candle-down:     #F87171;
  --volume-up:       rgba(52, 211, 153, 0.25);
  --volume-down:     rgba(248, 113, 113, 0.25);
  --series-1:       #3448D4;
  --series-2:       #F5A623;
  --series-3:       #0D9F6E;
  --series-4:       #E5484D;
  --series-5:       #8B5CF6;
  --series-6:       #06B6D4;
  --series-7:       #EC4899;
  --series-8:       #84CC16;
  --series-9:       #67E8F9;
  --series-10:       #F9A8D4;
  --series-11:       #D9F99D;
  --series-12:       #FDBA74;
  --zone-sup-fill:   rgba(52, 211, 153, 0.12);
  --zone-sup-edge:   rgba(52, 211, 153, 0.60);
  --zone-res-fill:   rgba(248, 113, 113, 0.12);
  --zone-res-edge:   rgba(248, 113, 113, 0.60);
  --level-sl:        #F87171;
  --level-tp:        #34D399;
  --level-trail:     #FBBF24;

  /* ── UI Surfaces & Controls (Dark) ── */
  --accent-gold: #FFC033;
  --accent-gold-soft: rgba(245, 166, 35, 0.08);
  --accent-gold-border: #F5A623;
  --input-bg: #161922;
  --input-border: #3A3D4E;
  --focus-ring: rgba(141, 153, 246, 0.40);
  --on-brand: #FFFFFF;
  --on-up: #0F1117;
  --on-down: #0F1117;
  --on-warn: #0F1117;
  --btn-sheen: rgba(255, 255, 255, 0.45);
  --btn-sheen-soft: rgba(255, 255, 255, 0.18);
  --btn-glow: rgba(52, 72, 212, 0.32);
  --btn-glow-hover: rgba(52, 72, 212, 0.55);
  --btn-shadow: rgba(0, 0, 0, 0.35);
  --up-glow: rgba(52, 211, 153, 0.28);
  --down-glow: rgba(248, 113, 113, 0.28);
  --chip-bg: #1E2130;
  --chip-bg-active: rgba(141, 153, 246, 0.16);
  --nav-active-bg: rgba(141, 153, 246, 0.14);
  --tooltip-bg: #252838;
  --tooltip-text: #F0F2F5;
  --table-header-bg: #1A1D26;
  --table-header-text: #A0A8B8;
  --kpi-card-bg: #1E2130;
  --legend-text: #F0F2F5;
  --legend-value: #A0A8B8;
  --skeleton-base: #252838;
  --skeleton-shine: #2F3345;

  /* ── Semantic Aliases & Backward Compatibility ── */
  --text:            var(--text-1);
  --muted:           var(--text-2);
  --bar:             var(--surface);
  --line:            var(--border);
  --panel:           var(--surface);
  --menu:            var(--card);
  --menu-bd:         var(--border);
  --menu-hover:      var(--hover);
  --sep:             var(--border);
  --icon:            var(--text-2);
  --accent-txt:      var(--primary);
  --chip:            transparent;
  --chip-bd:         var(--border);
  --chip-hover:      var(--hover);
  --green:           var(--up);
  --red:             var(--down);
  --amber:           var(--warn);
  --cyan:            var(--series-4);
  --indigo:          var(--primary);

  /* ── Typography Fonts ── */
  --font:            Inter, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
  --mono:            'JetBrains Mono', 'Fira Code', Menlo, Monaco, Consolas, monospace;
  --font-display:    'Inter Tight', Inter, -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
  --font-devanagari: 'Noto Sans Devanagari', Inter, sans-serif;

  /* ── Radius & Spacing ── */
  --r-sm:            6px;
  --r:               12px;
  --r-md:            16px;
  --r-lg:            20px;
  --r-xl:            24px;
  --r-pill:          9999px;
  --space-2:         2px;
  --space-4:         4px;
  --space-8:         8px;
  --space-12:         12px;
  --space-16:         16px;
  --space-20:         20px;
  --space-24:         24px;
  --space-32:         32px;
  --space-40:         40px;
  --space-48:         48px;

  /* ── Elevation & Shadow (Dark) ── */
  --shadow:          0 2px 8px rgba(0, 0, 0, 0.30);
  --shadow-sm:       0 2px 8px rgba(0, 0, 0, 0.30);
  --shadow-lg:       0 16px 48px rgba(0, 0, 0, 0.60);

  /* ── Motion & Animation ── */
  --t:               200ms cubic-bezier(0.4, 0, 0.2, 1);
  --motion-fast:     120ms cubic-bezier(0.4, 0, 0.2, 1);
  --motion-base:     200ms cubic-bezier(0.4, 0, 0.2, 1);
  --motion-enter:    220ms cubic-bezier(0, 0, 0.2, 1);
  --motion-exit:     160ms cubic-bezier(0.4, 0, 1, 1);
  --motion-flash:    500ms ease;

  /* ── Layout & Structure ── */
  --sidebar-w:       232px;
  --sidebar-cw:      56px;
  --header-h:        56px;
  --sb-h:            28px;
  --bottom-nav-h:    60px;
  --content-max-w:   1440px;
}

/* ── Light Theme Overrides ── */
html[data-theme="light"] {
  color-scheme: light;
  --bg:              #FAFBFC;
  --surface:         #FFFFFF;
  --card:            #FFFFFF;
  --card-raised:     #FFFFFF;
  --border:          #E8ECF0;
  --border-hover:    #D1D8E0;
  --border-strong:   #D1D8E0;
  --text-1:          #1A1D26;
  --text-2:          #5A6275;
  --text-3:          #8C95A6;
  --text-dis:        #B8BFC9;
  --text-disabled:   #B8BFC9;
  --text-placeholder: #8C95A6;
  --hover:           rgba(26, 29, 38, 0.05);
  --row-hover:       rgba(26, 29, 38, 0.03);
  --scrim:           rgba(10, 15, 68, 0.40);

  /* ── Brand & Action (Light) ── */
  --primary:         #3448D4;
  --primary-hover:   #2A3AB0;
  --primary-solid:   #3448D4;
  --primary-dim:     rgba(52, 72, 212, 0.10);
  --purple:          #6D45D9;
  --purple-dim:      rgba(109, 69, 217, 0.10);
  --accent-purple:   #6D45D9;
  --logo-grad-1:     #3448D4;
  --logo-grad-2:     #8B5CF6;

  /* ── Market Semantics (Light) ── */
  --success:         #067B53;
  --success-dim:     rgba(13, 159, 110, 0.12);
  --up:              #067B53;
  --up-dim:          rgba(13, 159, 110, 0.12);
  --danger:          #C62828;
  --danger-hover:    #A51D28;
  --danger-dim:      rgba(229, 72, 77, 0.12);
  --down:            #C62828;
  --down-dim:        rgba(229, 72, 77, 0.12);
  --warning:         #8B5E00;
  --warning-dim:     rgba(245, 166, 35, 0.16);
  --warn:            #8B5E00;
  --warn-dim:        rgba(245, 166, 35, 0.16);
  --info:            #3448D4;
  --neutral-change:  #5A6275;

  /* ── Chart Palette (Light) ── */
  --chart-bg:        #FAFBFC;
  --chart-grid:      #F0F2F5;
  --chart-axis-text: #8C95A6;
  --chart-text:      #8C95A6;
  --chart-crosshair: rgba(140, 149, 166, 0.60);
  --chart-crosshair-bg: #1A1D26;
  --candle-up:       #0D9F6E;
  --candle-down:     #E5484D;
  --volume-up:       rgba(13, 159, 110, 0.30);
  --volume-down:     rgba(229, 72, 77, 0.30);
  --series-1:       #3448D4;
  --series-2:       #F5A623;
  --series-3:       #0D9F6E;
  --series-4:       #E5484D;
  --series-5:       #8B5CF6;
  --series-6:       #06B6D4;
  --series-7:       #EC4899;
  --series-8:       #84CC16;
  --series-9:       #0F766E;
  --series-10:       #BE185D;
  --series-11:       #A16207;
  --series-12:       #C2410C;
  --zone-sup-fill:   rgba(13, 159, 110, 0.12);
  --zone-sup-edge:   rgba(6, 123, 83, 0.60);
  --zone-res-fill:   rgba(229, 72, 77, 0.10);
  --zone-res-edge:   rgba(198, 40, 40, 0.60);
  --level-sl:        #C62828;
  --level-tp:        #067B53;
  --level-trail:     #8B5E00;

  /* ── UI Surfaces & Controls (Light) ── */
  --accent-gold: #A36E12;
  --accent-gold-soft: #FFF9EB;
  --accent-gold-border: #F5A623;
  --input-bg: #FFFFFF;
  --input-border: #D1D8E0;
  --focus-ring: rgba(52, 72, 212, 0.30);
  --on-brand: #FFFFFF;
  --on-up: #FFFFFF;
  --on-down: #FFFFFF;
  --on-warn: #FFFFFF;
  --btn-sheen: rgba(255, 255, 255, 0.55);
  --btn-sheen-soft: rgba(255, 255, 255, 0.35);
  --btn-glow: rgba(52, 72, 212, 0.24);
  --btn-glow-hover: rgba(52, 72, 212, 0.38);
  --btn-shadow: rgba(10, 15, 68, 0.18);
  --up-glow: rgba(6, 123, 83, 0.20);
  --down-glow: rgba(198, 40, 40, 0.20);
  --chip-bg: #FFFFFF;
  --chip-bg-active: #EEF0FE;
  --nav-active-bg: #EEF0FE;
  --tooltip-bg: #1A1D26;
  --tooltip-text: #FFFFFF;
  --table-header-bg: #F4F6F8;
  --table-header-text: #5A6275;
  --kpi-card-bg: #FFFFFF;
  --legend-text: #1A1D26;
  --legend-value: #5A6275;
  --skeleton-base: #EEF1F5;
  --skeleton-shine: #F8FAFC;

  /* ── Elevation & Shadow (Light) ── */
  --shadow:          0 2px 8px rgba(10, 15, 68, 0.06);
  --shadow-sm:       0 2px 8px rgba(10, 15, 68, 0.06);
  --shadow-lg:       0 16px 48px rgba(10, 15, 68, 0.16);
}

/* Browser form control color-scheme */
html { color-scheme: dark; }
html[data-theme="light"] { color-scheme: light; }
