/* Neurobusiness — Color Tokens */
:root {

  /* ─── Brand Primitives ──────────────────────────────────── */
  --color-magenta:       #FF0B72;
  --color-magenta-light: #FE4599;
  --color-red:           #F60738;
  --color-blue:          #008CFF;
  --color-cyan:          #03A0FD;
  --color-deep-blue:     #0540F2;
  --color-violet:        #8B5CF6;
  --color-black:         #050508;
  --color-graphite:      #20242A;
  --color-slate:         #5A6472;
  --color-mist:          #F5F7FA;
  --color-white:         #FFFFFF;

  /* ─── Magenta Scale ─────────────────────────────────────── */
  --color-magenta-50:    #FFF0F6;
  --color-magenta-100:   #FFD6E8;
  --color-magenta-200:   #FFADD3;
  --color-magenta-300:   #FF79B7;
  --color-magenta-400:   #FF4598;
  --color-magenta-500:   #FF0B72;
  --color-magenta-600:   #D40060;
  --color-magenta-700:   #AA004D;
  --color-magenta-800:   #7A0038;
  --color-magenta-900:   #4D0022;

  /* ─── Blue Scale ────────────────────────────────────────── */
  --color-blue-50:    #EFF8FF;
  --color-blue-100:   #D6EEFF;
  --color-blue-200:   #ADDDFF;
  --color-blue-300:   #79C7FF;
  --color-blue-400:   #45ACFF;
  --color-blue-500:   #008CFF;
  --color-blue-600:   #006DCC;
  --color-blue-700:   #0054A3;
  --color-blue-800:   #003C75;
  --color-blue-900:   #00234A;

  /* ─── Violet Scale ──────────────────────────────────────── */
  --color-violet-50:  #F5F3FF;
  --color-violet-100: #EDE9FE;
  --color-violet-200: #DDD6FE;
  --color-violet-300: #C4B5FD;
  --color-violet-400: #A78BFA;
  --color-violet-500: #8B5CF6;
  --color-violet-600: #7C3AED;
  --color-violet-700: #6D28D9;
  --color-violet-800: #5B21B6;
  --color-violet-900: #4C1D95;

  /* ─── Neutral Scale ─────────────────────────────────────── */
  --color-neutral-50:  #F5F7FA;
  --color-neutral-100: #EEF1F5;
  --color-neutral-200: #DDE2EA;
  --color-neutral-300: #C5CDD6;
  --color-neutral-400: #8A94A0;
  --color-neutral-500: #5A6472;
  --color-neutral-600: #3E4653;
  --color-neutral-700: #20242A;
  --color-neutral-800: #131620;
  --color-neutral-900: #050508;

  /* ─── Functional / Status ───────────────────────────────── */
  --color-success:         #10B981;
  --color-success-subtle:  #D1FAE5;
  --color-success-fg:      #065F46;
  --color-warning:         #F59E0B;
  --color-warning-subtle:  #FEF3C7;
  --color-warning-fg:      #78350F;
  --color-error:           #EF4444;
  --color-error-subtle:    #FEE2E2;
  --color-error-fg:        #7F1D1D;
  --color-info:            #008CFF;
  --color-info-subtle:     #EFF8FF;
  --color-info-fg:         #00294A;

  /* ─── Data Visualization ────────────────────────────────── */
  --dataviz-1: #008CFF;
  --dataviz-2: #FF0B72;
  --dataviz-3: #8B5CF6;
  --dataviz-4: #03A0FD;
  --dataviz-5: #F59E0B;
  --dataviz-6: #10B981;
  --dataviz-neutral: #5A6472;
  --dataviz-grid: #E4E8ED;

  /* ─── Semantic — Light Mode (default) ───────────────────── */
  --bg-primary:    var(--color-white);
  --bg-secondary:  var(--color-mist);
  --bg-tertiary:   var(--color-neutral-100);
  --bg-inverse:    var(--color-black);

  --fg-primary:    var(--color-black);
  --fg-secondary:  var(--color-graphite);
  --fg-muted:      var(--color-slate);
  --fg-subtle:     var(--color-neutral-400);
  --fg-inverse:    var(--color-white);
  --fg-on-brand:   var(--color-white);

  --accent-primary:   var(--color-magenta);
  --accent-secondary: var(--color-blue);
  --accent-violet:    var(--color-violet);

  --surface-card:      var(--color-white);
  --surface-overlay:   rgba(5, 5, 8, 0.06);
  --surface-raised:    var(--color-white);

  --border-default:  #E4E8ED;
  --border-strong:   var(--color-neutral-300);
  --border-brand:    var(--color-magenta);
}

/* ─── Dark Mode ─────────────────────────────────────────────── */
[data-theme="dark"] {
  --bg-primary:   var(--color-black);
  --bg-secondary: var(--color-neutral-800);
  --bg-tertiary:  var(--color-graphite);
  --bg-inverse:   var(--color-mist);

  --fg-primary:   var(--color-mist);
  --fg-secondary: var(--color-neutral-300);
  --fg-muted:     var(--color-neutral-400);
  --fg-subtle:    var(--color-neutral-500);
  --fg-inverse:   var(--color-black);
  --fg-on-brand:  var(--color-white);

  --surface-card:    var(--color-neutral-800);
  --surface-overlay: rgba(255, 255, 255, 0.08);
  --surface-raised:  var(--color-graphite);

  --border-default: rgba(255, 255, 255, 0.10);
  --border-strong:  rgba(255, 255, 255, 0.20);
  --border-brand:   var(--color-magenta);
}
