/* Cohere Design System — Color tokens
   Base values first, semantic aliases below. */
:root {
  /* --- Base brand & accent --- */
  --color-cohere-black: #000000;
  --color-primary: #17171c;        /* near-black — primary CTAs, dark cards, footer */
  --color-deep-green: #003c33;     /* enterprise product bands */
  --color-dark-navy: #071829;      /* security / financial-services bands */
  --color-action-blue: #1863dc;    /* editorial links, pagination */
  --color-coral: #ff7759;          /* blog taxonomy, warm accents */
  --color-coral-soft: #ffad9b;     /* pale chip borders */

  /* --- Base surface / background --- */
  --color-canvas: #ffffff;
  --color-soft-stone: #eeece7;
  --color-pale-green: #edfce9;
  --color-pale-blue: #f1f5ff;
  --color-card-border: #f2f2f2;

  /* --- Base text / rules --- */
  --color-ink: #212121;
  --color-muted: #93939f;
  --color-slate: #75758a;
  --color-body-muted: #616161;
  --color-hairline: #d9d9dd;
  --color-border-light: #e5e7eb;

  /* --- Base semantic --- */
  --color-focus-blue: #4c6ee6;
  --color-form-focus: #9b60aa;
  --color-error: #b30000;
  --color-on-primary: #ffffff;
  --color-on-dark: #ffffff;

  /* ============ Semantic aliases ============ */
  --surface-page: var(--color-canvas);
  --surface-card: var(--color-canvas);
  --surface-card-warm: var(--color-soft-stone);
  --surface-section-green: var(--color-deep-green);
  --surface-section-navy: var(--color-dark-navy);
  --surface-wash-green: var(--color-pale-green);
  --surface-wash-blue: var(--color-pale-blue);

  --text-primary: var(--color-ink);
  --text-on-dark: var(--color-on-dark);
  --text-muted: var(--color-muted);
  --text-tertiary: var(--color-slate);
  --text-body-muted: var(--color-body-muted);
  --text-link: var(--color-action-blue);
  --text-error: var(--color-error);

  --border-hairline: var(--color-hairline);
  --border-light: var(--color-border-light);
  --border-card: var(--color-card-border);

  --action-primary-bg: var(--color-primary);
  --action-primary-text: var(--color-on-primary);
  --action-accent: var(--color-coral);
  --action-focus-ring: var(--color-focus-blue);
  --action-focus-border: var(--color-form-focus);
}
