/* Retell Design System — Brand palette aliases
   Friendly names layered on top of the raw Figma variable import
   (tokens/fig-tokens.css). The raw import already defines the full
   ramps (--electric-blue-*, --lavender-gray-*, --neutral-*) and the
   semantic light/dark tokens (--text-*, --bg-*, --border-*,
   --status-*). This file adds short brand aliases used by components
   and gives the canonical hex values as a stable reference. */

:root {
  /* ---- Primary: Electric Blue ---- */
  --brand-50:  rgb(239,243,255);
  --brand-100: rgb(222,231,255);
  --brand-200: rgb(186,204,255);
  --brand-300: rgb(143,170,252);
  --brand-400: rgb(102,137,245);
  --brand-500: rgb(62,106,239);   /* primary brand */
  --brand-600: rgb(47,81,196);
  --brand-700: rgb(36,61,150);
  --brand-800: rgb(24,39,105);

  --brand: var(--brand-500);
  --brand-hover: var(--brand-600);
  --brand-pressed: var(--brand-700);

  /* ---- Neutral: Lavender Gray (cool UI gray) ---- */
  --lg-25:  rgba(255,255,255,0.98);
  --lg-100: rgb(245,245,250);
  --lg-200: rgb(242,242,250);
  --lg-300: rgb(229,229,242);
  --lg-400: rgb(212,212,230);
  --lg-500: rgb(189,189,212);
  --lg-600: rgb(156,158,184);
  --lg-700: rgb(117,119,144);
  --lg-800: rgb(78,80,99);
  --lg-900: rgb(52,54,71);
  --lg-950: rgb(34,35,49);

  /* ---- Ink (near-black brand text) ---- */
  --ink: rgb(23,33,49);          /* = --text-primary */
  --ink-soft: rgb(96,106,120);   /* = --text-secondary */

  /* ---- Status base values (light mode) ---- */
  --success: rgb(46,161,33);
  --warning: rgb(255,136,0);
  --danger:  rgb(245,74,69);
  --info:    rgb(51,112,255);
}