/**
 * LZX VM shared design tokens — Forgejo, InvenTree, Authentik.
 *
 * Authority: marketing/brand/tokens.yaml (web) + brand_guide.md §2.
 * Synced from tooling/brand/lzx-vm-tokens.css on deploy (configure-branding.sh).
 */
:root {
  /* Ink ladder */
  --lzx-ink: #1A1713;
  --lzx-panel: #221F1A;
  --lzx-field: #35312C;
  --lzx-rule: #6D6963;
  --lzx-mute: #A4A199;
  --lzx-paper: #EEEBE3;
  --lzx-moonwax: #FBF7EF;
  --lzx-sunken: #0E0B08;

  /* Legacy aliases (existing theme CSS) */
  --lzx-dark: var(--lzx-ink);
  --lzx-card: var(--lzx-panel);
  --lzx-border: var(--lzx-rule);
  --lzx-light: var(--lzx-paper);
  --lzx-muted: var(--lzx-mute);

  /* Canonical surfaces */
  --lzx-bg-page: var(--lzx-ink);
  --lzx-bg-panel: var(--lzx-panel);
  --lzx-bg-elevated: var(--lzx-field);
  --lzx-bg-page-light: var(--lzx-paper);
  --lzx-bg-panel-light: var(--lzx-moonwax);
  --lzx-bg-elevated-light: var(--lzx-paper);

  /* Ambient page gradient — warm ink, no #000 / #FFF */
  --lzx-bg-gradient-dark: linear-gradient(
    165deg,
    #1A1713 0%,
    #221F1A 38%,
    #35312C 50%,
    #221F1A 62%,
    #1A1713 100%
  );
  --lzx-bg-gradient-light: linear-gradient(
    165deg,
    #EEEBE3 0%,
    #FBF7EF 38%,
    #FBF7EF 50%,
    #FBF7EF 62%,
    #EEEBE3 100%
  );

  /* Four accents (role ladder) */
  --lzx-red: #E23B1E;
  --lzx-yellow: #F2B012;
  --lzx-green: #42A251;
  --lzx-blue: #0F4E9C;

  /* Spectral series aliases — PLM / taxonomy only */
  --lzx-orange: #EC7514;
  --lzx-purple: #46205E;
  --lzx-teal: #10757A;
  --lzx-chartreuse: #9DB833;

  /* Product accents */
  --lzx-mystic: #46205E;
  --lzx-party-hat: #E23B1E;
  --lzx-on-colour: var(--lzx-paper);

  /* Highlight palette slots */
  --lzx-h1: var(--lzx-red);
  --lzx-h2: var(--lzx-orange);
  --lzx-h3: var(--lzx-yellow);
  --lzx-h4: var(--lzx-green);
  --lzx-h5: var(--lzx-blue);
  --lzx-h6: var(--lzx-purple);
  --lzx-h7: var(--lzx-mystic);

  /* Primary UI accent — Blue owns click */
  --lzx-primary: var(--lzx-blue);
  --lzx-primary-hover: #11427E;
  --lzx-primary-active: #0E386B;
  --lzx-primary-contrast: var(--lzx-on-colour);

  --lzx-spectrum: linear-gradient(
    90deg,
    var(--lzx-red),
    var(--lzx-orange),
    var(--lzx-yellow),
    var(--lzx-green),
    var(--lzx-blue),
    var(--lzx-purple)
  );
}
