/* tokens.css — lankultur.no
   Den ENESTE fila med fargeverdier. Alt annet bruker var(--…).
   Fasit: docs/STYLEGUIDE.md §4 og stilguiden «Lankultur nettside». Navnene følger Lanhubben (ADR-0001).
   Temaet settes på <html data-theme="neon|lys">. Neon er standard. */

:root,
[data-theme="neon"] {
  color-scheme: dark;

  /* Flater */
  --bg-main: #0c0717;
  --card-bg: #170d2a;
  --surface-raised: #241540;
  --border-color: #3a2760;

  /* Tekst */
  --text-main: #f4effd;
  --text-muted: #c3b6dc;
  --text-invert: #ffffff;
  --text-on-gold: #1b0f00;

  /* Merkevare */
  --brand-primary: #620099;
  --brand-purple: #8b4dff;
  --brand-accent: #ff3fa4;
  --brand-highlight: #2fd6ff;
  --brand-gold: #ffa62b;
  --btn-grad-start: #d6127f;
  --discord: #5865f2;

  /* Merkefarge som tekst */
  --ink-accent: #ff5cb2;
  --ink-gold: #ffb347;

  /* Status (alltid sammen med ord) */
  --status-live: #ff4d7a;
  --status-success: #3ddc84;
  --status-danger: #ff5a6e;

  /* Lysfelt og overlegg */
  --glow-accent: rgba(255, 63, 164, 0.22);
  --glow-purple: rgba(139, 77, 255, 0.22);
  --glow-highlight: rgba(47, 214, 255, 0.16);
  --overlay-tag: rgba(12, 7, 23, 0.85);
  --nav-bg: rgba(12, 7, 23, 0.85);
  --nav-panel-bg: rgba(12, 7, 23, 0.94); /* mobilpanelet under menyen */
  --focus-ring: var(--brand-highlight);

  /* Skygger */
  --shadow-glow-accent: 0 8px 28px rgba(255, 63, 164, 0.35);
  --shadow-poster: 0 24px 60px rgba(0, 0, 0, 0.6), 0 0 60px rgba(139, 77, 255, 0.35);
  --shadow-nav: 0 10px 30px rgba(0, 0, 0, 0.45);

  /* Bakgrunnsmønster (bare i Neon) */
  --page-pattern: url("../img/bg-kontrollere.png");
}

[data-theme="lys"] {
  color-scheme: light;
  --bg-main: #f7f4fb;
  --card-bg: #ffffff;
  --surface-raised: #efe8f7;
  --border-color: #ddd0ec;
  --text-main: #1a0a24;
  --text-muted: #5a4a68;
  --brand-purple: #7a2ee0;
  --brand-accent: #e0218a;
  --brand-highlight: #07698a;
  --ink-accent: #a3006b;
  --ink-gold: #9a4b00;
  --status-live: #d1003f;
  --status-success: #1e7a3c;
  --status-danger: #c0183d;
  --glow-accent: rgba(224, 33, 138, 0.10);
  --glow-purple: rgba(122, 46, 224, 0.10);
  --glow-highlight: rgba(7, 105, 138, 0.08);
  --nav-bg: rgba(247, 244, 251, 0.88);
  --nav-panel-bg: rgba(247, 244, 251, 0.98);
  --shadow-glow-accent: 0 8px 22px rgba(224, 33, 138, 0.22);
  --shadow-poster: 0 18px 40px rgba(26, 10, 36, 0.18);
  --shadow-nav: 0 10px 30px rgba(26, 10, 36, 0.10);
  --page-pattern: none;
}

:root {
  /* Skrift */
  --font-display: "Russo One", "Nunito", system-ui, sans-serif;
  --font-body: "Nunito", system-ui, -apple-system, "Segoe UI", Arial, sans-serif;

  /* Avstand */
  --space-1: 4px;
  --space-2: 8px;
  --space-3: 12px;
  --space-4: 16px;
  --space-5: 20px;
  --space-6: 24px;
  --space-8: 32px;
  --space-10: 40px;
  --space-14: 56px;

  /* Radius */
  --radius-sm: 8px;
  --radius-md: 12px;
  --radius-lg: 16px;
  --radius-xl: 20px;
  --radius-2xl: 24px;
  --radius-pill: 999px;

  /* Layout (brytepunkter skrives som tall i media queries: 640 / 980 / 1440) */
  --container-max: 1440px;
  --grid-gap: 24px;
  --gutter-desktop: 32px;
  --gutter-mobile: 16px;
  --nav-h: 80px; /* toppmenyen, ADR-0004 (64px i mobil.css) */
}