/* ============================================================
   Norvicus Spellenmaker - afdruk / PDF stijl
   Dit bestand wordt gebruikt door:
   - de live voorbeeldweergave in de browser (via Paged.js)
   - de definitieve PDF (gerenderd door Puppeteer/Chromium)
   Zo blijft het voorbeeld altijd zoveel mogelijk gelijk aan de PDF.
   ============================================================ */

@page {
  size: A4;
  margin: 18mm 16mm 20mm 16mm;
}

:root {
  --norvicus-primary: #2f6e51;
  --norvicus-primary-dark: #1f4d38;
  --norvicus-accent: #d6484a;
  --norvicus-accent-soft: #fbe9e9;
  --tekst: #262624;
  --tekst-zacht: #5b5b58;
  --lijn: #dfe3de;
  --vlak-zacht: #f4f7f4;
}

* {
  box-sizing: border-box;
}

.pdf-document {
  font-family: "Segoe UI", "Helvetica Neue", Arial, sans-serif;
  color: var(--tekst);
  font-size: 10.6pt;
  line-height: 1.5;
}

.pdf-document h1,
.pdf-document h2,
.pdf-document h3 {
  font-family: "Segoe UI", "Helvetica Neue", Arial, sans-serif;
  color: var(--norvicus-primary-dark);
  margin: 0 0 4mm 0;
}

/* --- Kop van het document --- */
.pdf-kop {
  border-bottom: 1.2mm solid var(--norvicus-primary);
  padding-bottom: 5mm;
  margin-bottom: 6mm;
}

.pdf-kop-boven {
  margin-bottom: 3mm;
}

.pdf-merk {
  font-size: 9pt;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: var(--norvicus-primary);
  font-weight: 700;
}

.pdf-titel {
  font-size: 22pt;
  font-weight: 800;
  color: var(--norvicus-primary-dark);
  margin: 1mm 0 4mm 0;
  line-height: 1.15;
  word-wrap: break-word;
}

.pdf-metagrid {
  display: flex;
  flex-wrap: wrap;
  gap: 3mm;
}

.pdf-metaitem {
  background: var(--vlak-zacht);
  border: 0.3mm solid var(--lijn);
  border-radius: 10px;
  padding: 2mm 4mm;
  font-size: 9.2pt;
  color: var(--tekst-zacht);
}

.pdf-metaitem b {
  color: var(--tekst);
  font-weight: 700;
}

/* --- Secties algemeen --- */
.pdf-blok {
  margin-bottom: 6mm;
  break-inside: avoid;
}

.pdf-blok-kop {
  display: flex;
  align-items: center;
  gap: 2.5mm;
  font-size: 12.5pt;
  font-weight: 800;
  color: var(--norvicus-primary-dark);
  margin-bottom: 2.5mm;
  break-after: avoid;
}

.pdf-blok-kop::before {
  content: "";
  display: inline-block;
  width: 3.2mm;
  height: 3.2mm;
  border-radius: 50%;
  background: var(--norvicus-accent);
  flex: none;
}

.pdf-blok-inhoud {
  font-size: 10.6pt;
  color: var(--tekst);
  white-space: normal;
}

.pdf-blok-inhoud p {
  margin: 0 0 2.4mm 0;
}

.pdf-blok-inhoud p:last-child {
  margin-bottom: 0;
}

.pdf-leeg {
  color: var(--tekst-zacht);
  font-style: italic;
}

/* --- Materiaaltabel --- */
.pdf-materiaal-tabel {
  width: 100%;
  border-collapse: collapse;
  font-size: 10pt;
  break-inside: auto;
}

.pdf-materiaal-tabel thead {
  display: table-header-group;
}

.pdf-materiaal-tabel tr {
  break-inside: avoid;
}

.pdf-materiaal-tabel th {
  text-align: left;
  background: var(--norvicus-primary);
  color: #fff;
  font-weight: 700;
  padding: 2.4mm 4mm;
  font-size: 9.2pt;
  text-transform: uppercase;
  letter-spacing: 0.04em;
}

.pdf-materiaal-tabel th.pdf-kolom-aantal,
.pdf-materiaal-tabel td.pdf-kolom-aantal {
  text-align: right;
  width: 24mm;
}

.pdf-materiaal-tabel td {
  padding: 2.2mm 4mm;
  border-bottom: 0.25mm solid var(--lijn);
}

.pdf-materiaal-tabel tr:nth-child(even) td {
  background: var(--vlak-zacht);
}

/* --- Sectiekop hoofdsectie "Spelbeschrijving" --- */
.pdf-hoofdkop {
  font-size: 14pt;
  font-weight: 800;
  color: var(--norvicus-primary-dark);
  margin: 2mm 0 4mm 0;
  padding-bottom: 1.5mm;
  border-bottom: 0.4mm solid var(--norvicus-accent);
  break-after: avoid;
}

/* --- Paginanummering (alleen relevant voor live voorbeeld; de PDF
       gebruikt Puppeteer's eigen footerTemplate) --- */
.pagedjs_page_content .pdf-paginanummer {
  display: none;
}

/* --- Fotopagina's -------------------------------------------------
   Los van de doorlopende spelbeschrijving: elke fotopagina begint
   altijd op een nieuwe afdrukpagina (break-before: page), zodat
   foto's nooit tussen de uitleg-secties belanden. De afmetingen
   (178mm x 259mm) komen overeen met het afdrukbare gebied van één
   A4-pagina binnen de @page-marges hierboven. --- */
.pdf-fotopagina {
  position: relative;
  width: 178mm;
  height: 259mm;
  break-before: page;
  overflow: hidden;
}

.pdf-foto-paginakop {
  position: absolute;
  top: 0;
  left: 0;
  font-size: 9pt;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: var(--norvicus-primary);
  font-weight: 700;
}

.pdf-foto {
  position: absolute;
  overflow: hidden;
  border-radius: 4px;
  box-shadow: 0 1mm 3mm rgba(0, 0, 0, 0.18);
}

.pdf-foto img {
  width: 100%;
  height: 100%;
  object-fit: contain;
  display: block;
}