/* A26 Web Design System — Semantic Tokens — v1.0.0-alpha.0005 */

@layer a26.tokens.semantic {
  :root {
    color-scheme: light;

    --a26-text-primary: var(--a26-label-light-primary);
    --a26-text-secondary: var(--a26-label-light-secondary);
    --a26-text-tertiary: var(--a26-label-light-tertiary);
    --a26-text-quaternary: var(--a26-label-light-quaternary);

    --a26-bg-app: var(--a26-bg-grouped-light-primary);
    --a26-bg-pane: var(--a26-bg-grouped-light-primary);
    --a26-bg-surface: var(--a26-bg-grouped-light-secondary);
    --a26-bg-surface-secondary: var(--a26-bg-grouped-light-tertiary);
    --a26-bg-elevated: var(--a26-bg-light-primary);

    --a26-fill-primary: var(--a26-fill-light-primary);
    --a26-fill-secondary: var(--a26-fill-light-secondary);
    --a26-fill-tertiary: var(--a26-fill-light-tertiary);
    --a26-fill-quaternary: var(--a26-fill-light-quaternary);

    --a26-separator: var(--a26-separator-light-nonopaque);
    --a26-separator-opaque: var(--a26-separator-light-opaque);

    --a26-accent: var(--a26-accent-light-blue);
    --a26-accent-red: var(--a26-accent-light-red);
    --a26-accent-orange: var(--a26-accent-light-orange);
    --a26-accent-yellow: var(--a26-accent-light-yellow);
    --a26-accent-green: var(--a26-accent-light-green);
    --a26-accent-mint: var(--a26-accent-light-mint);
    --a26-accent-teal: var(--a26-accent-light-teal);
    --a26-accent-cyan: var(--a26-accent-light-cyan);
    --a26-accent-blue: var(--a26-accent-light-blue);
    --a26-accent-indigo: var(--a26-accent-light-indigo);
    --a26-accent-purple: var(--a26-accent-light-purple);
    --a26-accent-pink: var(--a26-accent-light-pink);
    --a26-accent-brown: var(--a26-accent-light-brown);
    --a26-material-regular-fill: var(--a26-material-light-regular-fill);
    --a26-material-thin-fill: var(--a26-material-light-thin-fill);
    --a26-glass-clear-fill: var(--a26-glass-clear-fill-source);
    --a26-status-danger: var(--a26-accent-light-red);
    --a26-status-warning: var(--a26-accent-light-orange);
    --a26-status-success: var(--a26-accent-light-green);
    --a26-status-info: var(--a26-accent-light-blue);
  }

  @media (prefers-color-scheme: dark) {
    :root:not([data-theme="light"]) {
      color-scheme: dark;

      --a26-text-primary: var(--a26-label-dark-primary);
      --a26-text-secondary: var(--a26-label-dark-secondary);
      --a26-text-tertiary: var(--a26-label-dark-tertiary);
      --a26-text-quaternary: var(--a26-label-dark-quaternary);

      --a26-bg-app: var(--a26-bg-dark-base-primary);
      --a26-bg-pane: var(--a26-bg-dark-base-secondary);
      --a26-bg-surface: var(--a26-bg-dark-base-tertiary);
      --a26-bg-surface-secondary: var(--a26-bg-dark-elevated-primary);
      --a26-bg-elevated: var(--a26-bg-dark-elevated-primary);

      --a26-fill-primary: var(--a26-fill-dark-primary);
      --a26-fill-secondary: var(--a26-fill-dark-secondary);
      --a26-fill-tertiary: var(--a26-fill-dark-tertiary);
      --a26-fill-quaternary: var(--a26-fill-dark-quaternary);

      --a26-separator: var(--a26-separator-dark-nonopaque);
      --a26-separator-opaque: var(--a26-separator-dark-opaque);

      --a26-accent: var(--a26-accent-dark-blue);
      --a26-accent-red: var(--a26-accent-dark-red);
      --a26-accent-orange: var(--a26-accent-dark-orange);
      --a26-accent-yellow: var(--a26-accent-dark-yellow);
      --a26-accent-green: var(--a26-accent-dark-green);
      --a26-accent-mint: var(--a26-accent-dark-mint);
      --a26-accent-teal: var(--a26-accent-dark-teal);
      --a26-accent-cyan: var(--a26-accent-dark-cyan);
      --a26-accent-blue: var(--a26-accent-dark-blue);
      --a26-accent-indigo: var(--a26-accent-dark-indigo);
      --a26-accent-purple: var(--a26-accent-dark-purple);
      --a26-accent-pink: var(--a26-accent-dark-pink);
      --a26-accent-brown: var(--a26-accent-dark-brown);
      --a26-status-danger: var(--a26-accent-dark-red);
      --a26-status-warning: var(--a26-accent-dark-orange);
      --a26-status-success: var(--a26-accent-dark-green);
      --a26-status-info: var(--a26-accent-dark-blue);
    }
  }
}