/* ==========================================================================
   Zee Pharmaceuticals ERP — Design Tokens
   Single source of truth for colour, type, space, radius, elevation, motion.
   One designed light theme on a brand-tinted canvas. There is no dark mode.
   ========================================================================== */

:root {
  color-scheme: light;

  /* ---- Brand ramp (pine teal) ------------------------------------------ */
  --brand-50:  #e9f7f2;
  --brand-100: #ccebe1;
  --brand-200: #9dd8c6;
  --brand-300: #63bfa6;
  --brand-400: #2ba184;
  --brand-500: #0d7a63;
  --brand-600: #0a6552;
  --brand-700: #085243;
  --brand-800: #084235;
  --brand-900: #06332a;

  /* ---- Neutral ramp ---------------------------------------------------- */
  --n-0:   #ffffff;
  --n-25:  #fcfdfd;
  --n-50:  #f7f8fa;
  --n-100: #eff1f4;
  --n-150: #e6e9ee;
  --n-200: #dbdfe6;
  --n-300: #c3c9d3;
  --n-400: #9aa3b1;
  --n-500: #737d8c;
  --n-600: #56606e;
  --n-700: #3e4753;
  --n-800: #2a323c;
  --n-900: #1a212a;
  --n-950: #0e141b;

  /* ---- Surfaces & ink -------------------------------------------------- */
  --canvas:        #dcf0e8;
  --surface:       #ffffff;
  --surface-2:     #f2f9f6;
  --surface-3:     #dfece7;
  --surface-inset: #eaf5f1;
  --surface-inv:   #10241e;

  --ink:        #10161e;
  --ink-2:      #414b57;
  --ink-3:      #57616e;
  --ink-muted:  #6a7482;
  --ink-inv:    #f2f9f6;
  --ink-on-brand: #ffffff;

  --border:        #c9e2d8;
  --border-strong: #a9d0c2;
  --border-subtle: #dcece5;
  --ring: rgba(13, 122, 99, 0.32);

  /* ---- Status (reserved — never reused as a series colour) ------------- */
  --good:      #0ca30c;
  --good-bg:   #e8f7e8;
  --good-ink:  #146c14;
  --warning:     #fab219;
  --warning-bg:  #fdf3dd;
  --warning-ink: #85570a;
  --serious:     #ec835a;
  --serious-bg:  #fdeee7;
  --serious-ink: #96400f;
  --critical:     #d03b3b;
  --critical-bg:  #fdeaea;
  --critical-ink: #9b1f1f;
  --info:      #2a78d6;
  --info-bg:   #e7f0fc;
  --info-ink:  #17508f;
  --neutral-bg:  #e6f0ec;
  --neutral-ink: #56606e;

  /* ---- Categorical series (validated: light surface #ffffff) ----------- */
  --series-1: #2a78d6; /* blue    */
  --series-2: #eb6834; /* orange  */
  --series-3: #1baf7a; /* aqua    */
  --series-4: #eda100; /* yellow  */
  --series-5: #e87ba4; /* magenta */
  --series-6: #008300; /* green   */
  --series-7: #4a3aa7; /* violet  */
  --series-8: #e34948; /* red     */

  /* ---- Sequential ramp (blue, light -> dark) --------------------------- */
  --seq-100: #cde2fb;
  --seq-200: #9ec5f4;
  --seq-300: #6da7ec;
  --seq-400: #3987e5;
  --seq-500: #256abf;
  --seq-600: #184f95;
  --seq-700: #0d366b;

  /* ---- Diverging ------------------------------------------------------- */
  --div-neg: #d03b3b;
  --div-mid: #eceef1;
  --div-pos: #2a78d6;

  /* ---- Chart chrome ---------------------------------------------------- */
  --chart-surface: #ffffff;
  --grid:     #ebeef2;
  --axis:     #cfd5de;
  --axis-ink: #8b95a3;
  --delta-up:   #006300;
  --delta-down: #b02a2a;

  /* ---- Type ------------------------------------------------------------ */
  --font-sans: system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
  --font-mono: ui-monospace, SFMono-Regular, "SF Mono", Menlo, Consolas, monospace;

  --fs-2xs: 10.5px;
  --fs-xs:  11.5px;
  --fs-sm:  12.5px;
  --fs-md:  13.5px;
  --fs-base:14px;
  --fs-lg:  16px;
  --fs-xl:  19px;
  --fs-2xl: 23px;
  --fs-3xl: 29px;
  --fs-4xl: 38px;
  --fs-hero:52px;

  --lh-tight: 1.15;
  --lh-snug:  1.35;
  --lh-base:  1.5;

  --fw-normal: 400;
  --fw-medium: 500;
  --fw-semi:   600;
  --fw-bold:   700;

  /* ---- Space ----------------------------------------------------------- */
  --sp-1: 4px;
  --sp-2: 6px;
  --sp-3: 8px;
  --sp-4: 12px;
  --sp-5: 16px;
  --sp-6: 20px;
  --sp-7: 24px;
  --sp-8: 32px;
  --sp-9: 40px;
  --sp-10: 56px;

  /* ---- Radius ---------------------------------------------------------- */
  --r-xs: 4px;
  --r-sm: 6px;
  --r-md: 8px;
  --r-lg: 12px;
  --r-xl: 16px;
  --r-2xl: 22px;
  --r-full: 999px;

  /* ---- Elevation ------------------------------------------------------- */
  --sh-xs: 0 1px 2px rgba(16, 22, 30, 0.05);
  --sh-sm: 0 1px 2px rgba(16, 22, 30, 0.06), 0 1px 3px rgba(16, 22, 30, 0.04);
  --sh-md: 0 2px 4px rgba(16, 22, 30, 0.05), 0 6px 16px rgba(16, 22, 30, 0.07);
  --sh-lg: 0 8px 24px rgba(16, 22, 30, 0.10), 0 2px 6px rgba(16, 22, 30, 0.05);
  --sh-xl: 0 24px 56px rgba(16, 22, 30, 0.16), 0 4px 12px rgba(16, 22, 30, 0.07);
  --sh-inset: inset 0 1px 0 rgba(255, 255, 255, 0.6);

  /* ---- Layout ---------------------------------------------------------- */
  --sidebar-w: 252px;
  --sidebar-w-collapsed: 62px;
  --topbar-h: 56px;
  --subbar-h: 44px;
  --content-max: 1560px;

  /* ---- Motion ---------------------------------------------------------- */
  --ease: cubic-bezier(0.2, 0.6, 0.25, 1);
  --ease-out: cubic-bezier(0.16, 1, 0.3, 1);
  --dur-1: 90ms;
  --dur-2: 160ms;
  --dur-3: 260ms;
  --dur-4: 420ms;

  --z-sticky: 20;
  --z-topbar: 40;
  --z-drawer: 60;
  --z-modal: 80;
  --z-toast: 100;
  --z-palette: 120;
}