/* ============================================================
   dark-mode.css — token overrides for [data-theme="dark"]
   ============================================================ */
[data-theme="dark"]{
  --bg:var(--slate-950);
  --bg-subtle:#0d1424;
  --bg-sunken:#0a1120;
  --surface:#121b2e;
  --surface-2:#0f1726;
  --border:#243149;
  --border-strong:#33425e;
  --text:#eaeff8;
  --text-muted:#a7b6cf;
  --text-subtle:#7e8eaa;
  --text-inverse:#0a1120;

  --primary:var(--blue-400);
  --primary-hover:var(--blue-300);
  --primary-soft:rgba(91,132,246,.14);
  --primary-ring:rgba(91,132,246,.40);
  --on-primary:#0a1120;

  --accent:var(--teal-400);
  --accent-strong:#34d3a0;
  --accent-soft:rgba(31,185,138,.14);

  --code-bg:#0a1120;
  --code-text:#cdd8ec;
  --code-inline-bg:#1a2640;
  --code-inline-text:#cdd8ec;

  --warning-soft:rgba(181,116,10,.16);

  --sh-sm:0 1px 2px rgba(0,0,0,.40);
  --sh-md:0 4px 14px rgba(0,0,0,.45);
  --sh-lg:0 16px 38px rgba(0,0,0,.55);
  --sh-xl:0 28px 64px rgba(0,0,0,.60);
}
/* Primary buttons keep white text in dark for contrast on the blue */
[data-theme="dark"] .btn--primary{color:#0a1120;}
[data-theme="dark"] .badge--popular{color:#0a1120;}
