/* Kitamura Design System — Semantic color aliases
   Built on top of the raw Figma Variable tokens in fig-tokens.css.
   Palette families: Sumi (墨 / ink-grayscale), Sun (red), Sea (blue),
   Forest (green), Wood (gold/brown). The brand red is the Kitamura logo red. */

:root {
  /* ---- Brand ---- */
  --kit-brand-red: var(--kit-logo-color);      /* rgb(216,11,36) — #D80B24 */
  --kit-brand-red-strong: rgb(185,19,41);      /* flagship logo red */
  --kit-line-green: var(--kit-line-logo-color);

  /* ---- Text ---- */
  --text-body: var(--kit-body);                /* default body text */
  --text-description: var(--kit-description);  /* secondary / muted */
  --text-placeholder: var(--kit-place-holder);
  --text-disabled: var(--kit-disabled);
  --text-on-fill: var(--kit-on-fill);          /* text on dark/colored fills */
  --text-link: var(--kit-link);
  --text-link-hover: var(--kit-link-hover);
  --text-link-active: var(--kit-link-active);
  --text-link-visited: var(--kit-link-visited);

  /* ---- Surfaces ---- */
  --surface-page: var(--kit-white);
  --surface-card: var(--kit-white);
  --surface-subtle: var(--sumi-50);            /* rgb(248,248,248) */
  --surface-muted: var(--sumi-100);            /* rgb(241,241,241) */
  --surface-inverse: var(--sumi-900);          /* near-black */

  /* ---- Borders / dividers ---- */
  --border-default: var(--sumi-300);           /* rgb(216,216,216) */
  --border-strong: var(--sumi-500);
  --border-subtle: var(--sumi-200);

  /* ---- Status ---- */
  --status-alert: var(--kit-alert);            /* error red */
  --status-success: var(--kit-success);
  --status-info: var(--sea-700);

  /* ---- Action / buttons ---- */
  --action-primary-bg: var(--kit-logo-color);
  --action-primary-bg-hover: var(--sun-900);   /* rgb(213,0,0) darker */
  --action-primary-bg-active: var(--sun-1000); /* rgb(175,0,0) */
  --action-primary-fg: var(--kit-on-fill);
  --action-tertiary-bg: rgb(26,26,28);         /* near-black tertiary */
  --action-disabled-bg: var(--sumi-500);
  --action-focus-ring: var(--wood-500);        /* gold focus outline */
}
