/**
 * theme.css
 * Semantic token mapping only.
 *
 * Components MUST use semantic tokens ONLY:
 * --color-bg
 * --color-text-primary
 * --color-text-secondary
 * --color-border
 * --color-surface
 * --color-accent
 * --color-accent-strong
 * --color-focus-ring
 *
 * Raw tokens live in variables.css.
 */

/* Default mapping; raw tokens are Style B from variables.css (:root) */
:root {
  --color-bg: var(--color-neutral-100);
  --color-surface: var(--color-neutral-0);

  --color-text-primary: var(--color-neutral-800);
  --color-text-secondary: var(--color-neutral-700);

  --color-border: var(--color-neutral-300);

  /* Accent strategy */
  --color-accent: var(--color-brand-navy);
  --color-accent-strong: var(--color-accent-yellow);

  /* Focus ring should be very visible but still brand-aligned */
  --color-focus-ring: var(--color-accent-cyan);

  /* Section 01 (Hero) background / ground color (semantic) */
  --color-hero-ground: var(--color-accent-lime);
}

/* Back-compat aliases for existing CSS (gradually migrate to *-primary/*-secondary) */
:root {
  --color-text: var(--color-text-primary);
  --color-text-muted: var(--color-text-secondary);
}