/* Semantic aliases — components reference THESE, not raw scale steps.
   Swapping a brand or a theme means editing this file, not the components. */
:root {
  /* Text */
  --text-strong: var(--color-neutral-900);
  --text-body-color: var(--color-neutral-700);
  --text-muted: var(--color-neutral-500);
  --text-subtle: var(--color-neutral-400);
  --text-inverse: var(--color-white);
  --text-brand: var(--color-primary-600);
  --text-link: var(--color-primary-600);
  --text-link-hover: var(--color-primary-700);
  --text-danger: var(--color-danger-600);
  --text-success: var(--color-success-700);

  /* Surfaces */
  --surface-page: var(--color-white);
  --surface-subtle: var(--color-neutral-50);
  --surface-card: var(--color-white);
  --surface-raised: var(--color-white);
  --surface-inverse: var(--color-neutral-900);
  --surface-brand-soft: var(--color-primary-50);
  --surface-accent-soft: var(--color-accent-50);
  --surface-scrim: oklch(17% 0.006 250 / 0.5);

  /* Borders */
  --border-default: var(--color-neutral-200);
  --border-strong: var(--color-neutral-300);
  --border-subtle: var(--color-neutral-100);
  --border-brand: var(--color-primary-600);
  --border-danger: var(--color-danger-500);

  /* Actions */
  --action-primary-bg: var(--color-primary-600);
  --action-primary-bg-hover: var(--color-primary-700);
  --action-primary-fg: var(--color-white);
  --action-secondary-bg: var(--color-secondary-100);
  --action-secondary-bg-hover: var(--color-secondary-200);
  --action-secondary-fg: var(--color-secondary-900);
  --action-ghost-fg: var(--color-neutral-700);
  --action-ghost-bg-hover: var(--color-neutral-100);
  --action-danger-bg: var(--color-danger-600);
  --action-danger-bg-hover: var(--color-danger-700);

  /* Focus */
  --focus-ring: var(--color-primary-600);

  /* Fields */
  --field-bg: var(--color-white);
  --field-border: var(--color-neutral-300);
  --field-border-focus: var(--color-primary-500);
  --field-ring-focus: var(--color-primary-100);
  --field-placeholder: var(--color-neutral-400);
  --field-disabled-bg: var(--color-neutral-50);
  --field-disabled-fg: var(--color-neutral-400);
  --field-height: 2.5rem;
}
