/* ============================================================
   Tælleliste (arbejdsark LS-401) — supplement til style.css.
   Genbruger brand-tokens: --ink/--paper/--accent/--line/--mono.
   Ingen JS. Print er førsteklasses output: sort på hvidt,
   forsideark + én varegruppe pr. side.
   ============================================================ */

/* spring-til-indhold (.skip bor i forside.css, ikke i style.css,
   derfor gentaget her som på de andre undersider) */
.skip {
  position: absolute;
  left: 12px;
  top: -60px;
  z-index: 30;
  background: var(--paper);
  border: 1px solid var(--ink);
  padding: 10px 16px;
  font-family: var(--mono);
  font-size: 0.8rem;
  text-decoration: none;
  transition: top 160ms ease;
}
.skip:focus { top: 12px; }

/* ---------- forsideark ---------- */

.ark-hoved { padding-bottom: 56px; }

.print-vink {
  margin: 18px 0 0;
  font-family: var(--mono);
  font-size: 0.8rem;
  line-height: 1.7;
  color: var(--ink-soft);
  max-width: 62ch;
}

/* udfyldningsfelter: dato / rum / talt af / ark nr. */
.ark-felter {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 1px;
  margin: 36px 0 0;
  background: var(--line);
  border: 1px solid var(--line);
}

.felt {
  background: var(--paper);
  padding: 12px 16px 18px;
  min-width: 0;
}

.felt dt {
  font-family: var(--mono);
  font-size: 0.62rem;
  letter-spacing: 0.16em;
  text-transform: uppercase;
  color: var(--ink-soft);
  margin-bottom: 22px;
}

.felt dd { margin: 0; }

.skrivelinje {
  display: block;
  height: 1px;
  background: var(--line);
}

/* ---------- fremgangsmåde ---------- */

.instruks {
  border: 1px solid var(--line);
  padding: 26px 30px 24px;
  max-width: 720px;
}

.instruks-titel {
  font-size: 1.15rem;
  margin: 0 0 18px;
}

.instruks-liste {
  list-style: none;
  counter-reset: raad;
  margin: 0;
  padding: 0;
}

.instruks-liste li {
  counter-increment: raad;
  position: relative;
  padding: 12px 0 12px 46px;
  border-top: 1px solid var(--line-faint);
  font-size: 0.98rem;
  line-height: 1.55;
  max-width: 62ch;
}
.instruks-liste li:last-child { border-bottom: 1px solid var(--line-faint); }

.instruks-liste li::before {
  content: counter(raad, decimal-leading-zero);
  position: absolute;
  left: 2px;
  top: 14px;
  font-family: var(--mono);
  font-size: 0.78rem;
  font-weight: 600;
  letter-spacing: 0.06em;
  color: var(--accent);
}

.instruks-note {
  margin: 16px 0 0;
  font-family: var(--mono);
  font-size: 0.78rem;
  color: var(--ink-soft);
}

/* ---------- tælletabeller ---------- */

/* smalle skærme: tabellen ruller i sin egen beholder, ikke i siden */
.tabel-rul { overflow-x: auto; }

.taelle-tabel {
  width: 100%;
  min-width: 640px;
  border-collapse: collapse;
  border: 1px solid var(--line);
}

.taelle-tabel caption {
  caption-side: top;
  text-align: left;
  font-family: var(--mono);
  font-size: 0.78rem;
  font-weight: 600;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: var(--ink);
  padding: 0 0 12px 2px;
}

.taelle-tabel th,
.taelle-tabel td {
  border: 1px solid var(--line-faint);
  padding: 7px 10px;
  text-align: left;
  vertical-align: bottom;
}

.taelle-tabel thead th {
  font-family: var(--mono);
  font-size: 0.64rem;
  font-weight: 600;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: var(--ink-soft);
  border-bottom: 1px solid var(--line);
  vertical-align: middle;
  white-space: nowrap;
}

/* tomme skriverækker */
.taelle-tabel tbody td { height: 2.3rem; }

/* hårfin gruppering: optælling (kol. 3) og økonomi (kol. 6) markeres
   med en kraftigere lodret linje */
.taelle-tabel th:nth-child(3),
.taelle-tabel td:nth-child(3),
.taelle-tabel th:nth-child(6),
.taelle-tabel td:nth-child(6) {
  border-left: 1px solid var(--line);
}

/* sumrække */
.taelle-tabel tfoot th {
  font-family: var(--mono);
  font-size: 0.66rem;
  font-weight: 600;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: var(--ink);
  text-align: right;
  border-top: 1px solid var(--line);
  vertical-align: middle;
}
.taelle-tabel tfoot td {
  height: 2.3rem;
  border-top: 1px solid var(--line);
  border-left: 1px solid var(--line);
}

/* kolonnebredder */
.c-vare { width: 28%; }
.c-str  { width: 12%; }
.c-tal  { width: 11%; }
.c-kr   { width: 13.5%; }

/* opsummering på forsidearket */
.opsummering { min-width: 420px; max-width: 560px; margin-top: 44px; }
.opsummering .c-sektion { width: 62%; }
.opsummering .c-vaerdi  { width: 38%; }
.opsummering tbody th,
.opsummering tfoot th {
  font-family: var(--mono);
  font-size: 0.8rem;
  font-weight: 400;
  letter-spacing: 0.04em;
  text-transform: none;
  text-align: left;
  color: var(--ink);
  vertical-align: middle;
}
.opsummering tfoot th { font-weight: 600; }
.opsummering tbody td,
.opsummering tfoot td { border-left: 1px solid var(--line); }

/* ---------- diskret fod ---------- */

.ark-fod-sektion { border-bottom: none; padding-top: 36px; padding-bottom: 44px; }

.ark-fod {
  margin: 0;
  font-family: var(--mono);
  font-size: 0.78rem;
  letter-spacing: 0.04em;
  color: var(--ink-soft);
}
.ark-fod a {
  color: var(--accent);
  text-decoration: none;
  border-bottom: 1px solid var(--line);
}
.ark-fod a:hover { border-bottom-color: var(--accent); }

/* ---------- små skærme ---------- */

@media (max-width: 900px) {
  .ark-felter { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

@media (max-width: 560px) {
  .ark-felter { grid-template-columns: 1fr; }
  .instruks { padding: 20px 18px 18px; }
}

/* ============================================================
   PRINT — det egentlige produkt. Rent sort på hvidt, ingen
   pynt: forsideark (felter + fremgangsmåde + opsummering),
   derefter én varegruppe pr. side med skrivevenlige rækker.
   ============================================================ */

@page {
  size: A4 portrait;
  margin: 13mm 12mm 15mm;
}

@media print {

  :root {
    --paper: #fff;
    --ink: #000;
    --ink-soft: #333;
    --line: #000;
    --line-faint: #888;
    --accent: #000;
    --grid-minor: transparent;
    --grid-major: transparent;
  }

  html { scroll-behavior: auto; }

  body {
    background: #fff;
    background-image: none;
    color: #000;
    font-size: 10pt;
    line-height: 1.4;
  }

  /* skærm-krom væk: nav, beskæringsmærker, titelblok, print-vink */
  .skip,
  .cropmark,
  .topbar,
  .titleblock,
  .print-vink { display: none; }

  .sheet {
    max-width: none;
    margin: 0;
    border: none;
  }

  /* ---------- forsideark ---------- */

  .hero,
  .section {
    padding: 0;
    border-bottom: none;
  }

  .ark-hoved { padding: 0 0 8mm; }

  .annot {
    font-size: 7pt;
    margin-bottom: 3mm;
    color: #000;
  }

  .hero h1 { font-size: 22pt; line-height: 1.05; }

  .hero-lead {
    margin-top: 4mm;
    font-size: 9.5pt;
    color: #000;
    max-width: none;
  }

  .ark-felter {
    margin-top: 7mm;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    background: #000;
    border-color: #000;
  }
  .felt { background: #fff; padding: 2.5mm 3mm 5mm; }
  .felt dt { color: #000; margin-bottom: 9mm; }
  .skrivelinje { background: #000; }

  .instruks-sektion { padding-bottom: 0; }

  .instruks {
    border-color: #000;
    padding: 5mm 6mm 4mm;
    max-width: none;
    break-inside: avoid;
  }
  .instruks-titel { font-size: 12pt; margin-bottom: 3mm; }
  .instruks-liste li {
    font-size: 9pt;
    line-height: 1.45;
    padding: 2.2mm 0 2.2mm 11mm;
    max-width: none;
  }
  .instruks-liste li::before { color: #000; top: 2.4mm; font-size: 8pt; }
  .instruks-note { font-size: 8pt; color: #000; margin-top: 3mm; }

  /* ---------- tabeller ---------- */

  .tabel-rul { overflow: visible; }

  .taelle-tabel {
    min-width: 0;
    border-color: #000;
  }

  .taelle-tabel caption {
    font-size: 9pt;
    color: #000;
    padding-bottom: 2.5mm;
  }

  .taelle-tabel th,
  .taelle-tabel td { border-color: #888; padding: 1.8mm 2.5mm; }

  .taelle-tabel thead th {
    font-size: 6.5pt;
    color: #000;
    border-bottom-color: #000;
  }

  /* skrivevenlig rækkehøjde: ca. 11 mm pr. række */
  .taelle-tabel tbody td { height: 11mm; }

  .taelle-tabel th:nth-child(3),
  .taelle-tabel td:nth-child(3),
  .taelle-tabel th:nth-child(6),
  .taelle-tabel td:nth-child(6) { border-left-color: #000; }

  .taelle-tabel tfoot th {
    font-size: 7pt;
    color: #000;
    border-top-color: #000;
  }
  .taelle-tabel tfoot td {
    height: 9mm;
    border-top-color: #000;
    border-left-color: #000;
  }

  .opsummering { margin-top: 8mm; max-width: 120mm; }
  .opsummering tbody td { height: 8mm; }
  .opsummering tbody th,
  .opsummering tfoot th { font-size: 9pt; color: #000; }

  /* sideskift: forsidearket samlet, derefter én varegruppe pr. side */
  .taelle-sektion {
    break-before: page;
    page-break-before: always;
  }
  .taelle-tabel { break-inside: avoid-page; }

  /* ---------- diskret fod (printes med) ---------- */

  .ark-fod-sektion { padding: 6mm 0 0; }

  .ark-fod { font-size: 7.5pt; color: #000; }
  .ark-fod a {
    color: #000;
    border-bottom: none;
    text-decoration: none;
  }
}