/* Huisstijl Daily Bit News, volgens de instructies van Just (14 okt 2026).
   Eén bestand voor alle openbare schermen. Het staat NA de eigen <style> van
   een scherm, zodat de tokens hieronder de oude kleurnamen overschrijven.

   Tokens (donker; licht staat op de schermen die meebewegen):
     paper #000000 · ink #FFFFFF · gold #FBB040 · gold-text #FBB040 · brand-band #000000
   Gouden verloop uit het logo: #FEC458 (boven) via #FBB040 naar #F69518 (onder).
   Vormen: rechte hoeken (zoals de D in het logo), rond alleen voor knooppunten
   en munticonen (class "rond"), geen slagschaduwen. */
@import url("/lettertypen/lettertypen.css");

:root {
  --paper: #000000;
  --ink: #FFFFFF;
  --gold: #FBB040;
  --gold-text: #FBB040;
  --brand-band: #000000;
  --goud-verloop: linear-gradient(180deg, #FEC458 0%, #FBB040 50%, #F69518 100%);
  --font-kop: Montserrat, Arial, Helvetica, sans-serif;
  --font-tekst: Inter, Arial, Helvetica, sans-serif;

  /* De oude namen in de bestaande schermen, naar de nieuwe tokens. */
  --inkt: var(--paper);
  --inkt-op: #111111;
  --papier: var(--ink);
  --papier-dof: #B5B0A6;
  --grijs: #8C887E;
  --messing: var(--gold);
  --messing-diep: #F69518;
  --display: var(--font-kop);
  --ui: var(--font-tekst);
  --data: var(--font-tekst);
}

body { font-family: var(--font-tekst); background-image: none; }
h1, h2, h3, h4, button, .knop, label, .merk, .label { font-family: var(--font-kop); }
h1, h2, h3 { letter-spacing: 0; }
/* Koersen en bedragen: cijfers even breed, zodat ze netjes onder elkaar staan. */
.data, .prijs, .getal, .koers, .cijfer, .n, td { font-variant-numeric: tabular-nums; }

*:not(.rond) { border-radius: 0 !important; }
* { box-shadow: none !important; text-shadow: none !important; }

/* Gouden knop: bij hover het verloop uit het logo. */
.knop:not(.zacht):not(.gevaar):hover,
button[type=submit]:not(.zacht):not(.gevaar):not(.link):hover { background-image: var(--goud-verloop); }

/* De merkband bovenaan elk openbaar scherm, ook in het lichte thema. Het logo
   komt hier zodra de bestanden uit het design system er zijn; tot dan de naam. */
.merkband { position: absolute; top: 0; left: 0; right: 0; background: var(--brand-band);
  text-align: center; padding: 15px 16px 13px; z-index: 5; }
.merkband a { font-family: var(--font-kop); font-weight: 800; font-size: 15px; letter-spacing: .16em;
  text-transform: uppercase; color: #FFFFFF; text-decoration: none; }
.merkband .menu { position: absolute; right: 16px; top: 50%; transform: translateY(-50%);
  font-family: var(--font-kop); font-size: 13px; font-weight: 600; letter-spacing: 0;
  text-transform: none; color: #FFFFFF; }
.goudstrook { position: absolute; left: 0; right: 0; bottom: -3px; height: 3px; background: var(--goud-verloop); }
body.met-band { padding-top: 84px !important; position: relative; flex-direction: column; }
/* Het oude kompasroos-merk: niet van het design system, dus weg. */
.kop:has(svg) { display: none !important; }

/* De disclaimer onderaan elke pagina. */
.voorbehoud { max-width: 640px; margin: 28px auto 0; padding: 14px 4px 0; border-top: 1px solid #262626;
  font-family: var(--font-tekst); font-size: 12px; line-height: 1.6; color: #8C887E; text-align: center; }