/* =========================================================
   ElektroNyheter – CONFIG
   Endre verdiene her for å styre farger, skrift og animasjon
   på hele nettsiden. Du trenger ikke røre style.css.
   ========================================================= */

:root {
  /* ---------- Farger (lys modus) ---------- */
  --color-bg: #E6EBEE;          /* Bakgrunn på hele siden */
  --color-surface: #F4F7F9;     /* Topplinja */
  --color-text: #14213D;        /* Hovedtekst og overskrifter */
  --color-muted: #55627A;       /* Ingresser, datoer, menylenker */
  --color-line: rgba(20, 33, 61, 0.12);   /* Skillelinjer */
  --color-accent: #B87333;      /* Kobberfarge: linja, kategorier, aktiv meny */
  --color-accent-dark: #8A5524; /* Endepunktene på kobberlinja */
  --color-grid: rgba(20, 33, 61, 0.06);   /* Rutenettet i bakgrunnen */
  --color-image: #C9D3DA;       /* Plassholder for bilder */

  /* ---------- Skrift ---------- */
  --font-main: "Bricolage Grotesque", "Segoe UI", system-ui, sans-serif;
  --font-size-base: 16px;
  --font-size-intro: clamp(2.6rem, 9vw, 6.5rem); /* Den store teksten i introen */
  --font-size-logo: 1.3rem;

  /* ---------- Layout ---------- */
  --page-width: 1120px;         /* Maks bredde på innholdet */
  --topbar-height: 64px;
  --radius: 6px;                /* Hjørner på små bilder */
  --radius-large: 10px;         /* Hjørner på hovedbildet */

  /* ---------- Intro-animasjon ---------- */
  --intro-draw-time: 0.25s;     /* Hvor lang tid kobberlinja bruker */
  --intro-fade-time: 0.2s;      /* Hvor lang tid overgangen til siden tar */
  --intro-max-time: 500;        /* Maks tid før siden vises (millisekunder, uten "s") */
  --intro-enabled: 1;           /* Sett til 0 for å skru av introen */
}

/* ---------- Farger (mørk modus) ---------- */
@media (prefers-color-scheme: dark) {
  :root {
    --color-bg: #0E1A2B;
    --color-surface: #142338;
    --color-text: #E9EEF2;
    --color-muted: #9AA7B8;
    --color-line: rgba(233, 238, 242, 0.12);
    --color-accent: #D08A4A;
    --color-accent-dark: #E7A86B;
    --color-grid: rgba(233, 238, 242, 0.05);
    --color-image: #1D3049;
  }
}