/**
 * BERDL design tokens — light
 *
 * The names are the KBase design system's vocabulary (@dauglyon/design-system);
 * the values are interim ones matching KIND*AI. Replace this file wholesale
 * with the DS's tokens.css on adoption. No literal color below this layer.
 *
 * Two deliberate drifts from the DS, whose density is not approved: --r-button
 * is 6px (DS 7px) and body is 14px/--fs-5 (DS 15px/--fs-6).
 */

:root,
[data-bs-theme="light"] {
  /* type — system stacks, no external load */
  --f-sans: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
  --f-mono: ui-monospace, SFMono-Regular, "SF Mono", Menlo, Consolas, monospace;

  /* surfaces (KIND --bg / --panel / --panel2 / --line) */
  --c-bg: #f6f8fa;
  --c-surface: #ffffff;
  --c-raised: #eef1f5;
  --c-border: #d8dee6;
  --c-border2: color-mix(in srgb, var(--c-border) 65%, var(--c-ink4));

  /* ink scale, darkest first. --c-ink is the darkest; there is no --c-ink1.
     --c-ink3 is KIND --slate, --c-ink4 is KIND --muted (4.6:1 on --c-bg). */
  --c-ink: #1f2733;
  --c-ink2: color-mix(in srgb, var(--c-ink) 70%, var(--c-ink3));
  --c-ink3: #57606a;
  --c-ink4: #66707d;
  --c-ink5: color-mix(in srgb, var(--c-ink4) 60%, var(--c-surface));

  /* semantic. KIND --accent / --green / --red; --c-yellow is a fill and has no
     KIND counterpart, so it keeps the DS value (KIND --amber is text-weight
     and maps to --ct-yellow below). */
  --c-primary: #1f6feb;
  --c-green: #1a7f37;
  --c-yellow: #ffd200;
  --c-red: #d1242f;

  /* aux — no KIND counterpart, DS value retained */
  --c-teal: #009688;

  /* text-on-tint (KIND --blue is the link/text weight of --accent) */
  --ct-primary: #0969da;
  --ct-green: #1a7f37;
  --ct-yellow: #9a6700;
  --ct-red: #d1242f;

  /* tints, derived so the dark theme gets them for free. KIND's own idiom
     (see .ws-tag: color-mix(in srgb, var(--accent) 12%, transparent)). */
  --bg-primary: color-mix(in srgb, var(--c-primary) 10%, var(--c-surface));
  --bg-green: color-mix(in srgb, var(--c-green) 10%, var(--c-surface));
  --bg-yellow: color-mix(in srgb, var(--c-yellow) 16%, var(--c-surface));
  --bg-red: color-mix(in srgb, var(--c-red) 10%, var(--c-surface));

  --bo-primary: color-mix(in srgb, var(--c-primary) 28%, var(--c-surface));
  --bo-green: color-mix(in srgb, var(--c-green) 28%, var(--c-surface));
  --bo-yellow: color-mix(in srgb, var(--c-yellow) 40%, var(--c-surface));
  --bo-red: color-mix(in srgb, var(--c-red) 28%, var(--c-surface));

  /* spacing — already the DS ladder verbatim; KIND uses the low end */
  --s-1: 4px;
  --s-2: 6px;
  --s-3: 8px;
  --s-4: 10px;
  --s-5: 12px;
  --s-6: 14px;
  --s-7: 18px;
  --s-8: 22px;

  /* radii — 4/8/12/999 already match the DS; --r-button is the one drift */
  --r-sm: 4px;
  --r-button: 6px;
  --r-md: 8px;
  --r-lg: 12px;
  --r-full: 999px;

  /* font sizes. KIND's body is 14px = --fs-5; the DS's body is --fs-6. */
  --fs-1: 10px;
  --fs-2: 11px;
  --fs-3: 12px;
  --fs-4: 13px;
  --fs-5: 14px;
  --fs-6: 15px;
  --fs-7: 16px;
  --fs-8: 17px;
  --fs-9: 18px;
}
