/* Canonical design tokens for the whole workbench.
   The shell and the three embedded consoles are separate documents, so they
   each link this file and map their own local variable names onto `--ds-*`.
   Nothing here is app specific; change a colour once and all four follow.
   Desktop only: the product is an operations console, never a phone screen. */

:root {
  /* Surfaces, layered light to dark rather than separated by hue. */
  --ds-bg: #f2faff;
  --ds-surface: #ffffff;
  --ds-surface-2: #f7fcff;
  --ds-surface-3: #e8f4ff;
  --ds-white: #ffffff;

  /* Navigation is the only large tinted region. */
  --ds-nav-bg: #ffffff;
  --ds-nav-fg: #52708f;
  --ds-nav-fg-strong: #173a5e;
  --ds-nav-hover: #e8f4ff;
  --ds-nav-active: #1c67dc;
  --ds-nav-line: #d9e9f5;

  --ds-line: #e4e7e9;
  --ds-line-strong: #d2d8db;

  --ds-fg: #173a5e;
  --ds-fg-2: #52708f;
  --ds-fg-3: #5f7896;

  /* Colour carries meaning only: primary action, selection, status.
     Every semantic value is text weight and clears 4.5:1 on its own soft
     background, so badges and inline labels can use the pair directly. */
  --ds-accent: #2f7cf6;
  --ds-accent-hover: #1c67dc;
  --ds-accent-soft: #e8f4ff;
  --ds-success: #18794e;
  --ds-success-soft: #e8f4ed;
  --ds-warning: #8a5d00;
  --ds-warning-soft: #fbf1da;
  --ds-danger: #b3323c;
  --ds-danger-soft: #fbebec;
  --ds-info: #1f5aa8;
  --ds-info-soft: #eaf1fa;

  --ds-control-h: 32px;
  --ds-control-h-sm: 26px;
  --ds-row-h: 38px;
  --ds-sidebar-expanded: 232px;
  --ds-sidebar-collapsed: 64px;
  --ds-page-min: 1280px;
  --ds-page-max: 1600px;
  /* Gutters scale with the viewport so the same layout works from a 1280px
     laptop to an ultrawide without a breakpoint. */
  --ds-page-pad-x: clamp(16px, 1.6vw, 40px);
  --ds-page-pad-y: 18px;

  --ds-radius: 6px;
  --ds-radius-sm: 4px;
  --ds-radius-pill: 999px;

  --ds-gap-1: 4px;
  --ds-gap-2: 8px;
  --ds-gap-3: 12px;
  --ds-gap-4: 16px;
  --ds-gap-5: 20px;
  --ds-gap-6: 24px;

  --ds-shadow-1: 0 1px 2px rgba(16, 24, 28, .06);
  --ds-shadow-2: 0 4px 12px rgba(16, 24, 28, .08);
  --ds-shadow-overlay: 0 12px 32px rgba(16, 24, 28, .18);

  --ds-fs-h1: 18px;
  --ds-fs-h2: 14px;
  --ds-fs-body: 13px;
  --ds-fs-sm: 12px;
  --ds-fs-xs: 11px;

  --ds-focus-ring: 0 0 0 3px rgba(47, 124, 246, .28);
  --ds-overlay: rgba(17, 24, 28, .38);

  /* No webfont is loaded anywhere: these consoles sit behind a login wall and
     the fallback stack already covers Chinese and Latin text. */
  --ds-font: "Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", "PingFang SC", "Microsoft YaHei", sans-serif;
  --ds-mono: ui-monospace, SFMono-Regular, Menlo, Consolas, "Liberation Mono", monospace;

  --ds-ease: cubic-bezier(0.2, 0.8, 0.2, 1);
  --ds-fast: 120ms;
}