/**
 * doc-a4.css — A4-Dokumentmodus für kanonische HA4/HA5/HA6-A4-Seiten.
 * Dateien: 04b, 04d, 05b, 06a, 06b, 06c — jeweils base + subpage + doc-a4; Formular-/Tabellen-Seiten mit ergänzendem Seiten-<style> (nur 8.25pt / 11pt).
 * Gerüst je A4-HTML: Skip-Link, .top-nav-zone, .page-chrome, <main id="main">, .meta-bar, .doc-mode, pro Blatt <article class="doc-a4"> mit .doc-header / .doc-body / .doc-footer, Seiten-footer .source-note.
 * Fußzeile (.doc-footer): für jedes Blatt jeder dieser Seiten gleich — am unteren Blattrand (Flex-Spalte + margin-top: auto), nicht direkt unter dem letzten Inhalt; gilt Bildschirm und Druck (Druck: @media print ergänzt min-height/Breite).
 * Zwei-Stufen-System: 11pt (GROSS) / 8.25pt (KLEIN)
 * Regel: Keine anderen Schriftgrößen in lokalen <style>-Blöcken oder inline —
 *   weder in bestehenden noch in neuen A4-Dokumenten.
 * Bildschirm: .meta-bar weiter 0.9rem (nicht gedruckt).
 */

/* ─── A4-Rahmen: Seitenlayout; A4-Modus nur im Hauptinhalt ─── */
body { padding: 0 3rem 4rem; max-width: 1200px; margin: 0 auto; }

/* ─── Dokumentmodus: Farben und Maßsystem (am Altformular orientiert) ─── */
.doc-mode {
  --doc-text:  #1a1a1a;
  --doc-mid:   #444;
  --doc-soft:  #777;
  --doc-bdr:   #c8c8c8;
  --doc-light: #f2f2f2;
  --doc-head:  #2a3a3a;
  --doc-acc:   #4a7c59;
  --doc-open:  #8a5a6a;
  --doc-open-bg:      #f9f0f3;
  --doc-open-bg-soft: rgba(249,240,243,0.5);
  --doc-review:       #2d5a3d;
  --doc-review-bg:    #e8f2eb;
  /* Schmale Viewports: Blätter bleiben 210mm breit, seitlich scrollen statt Breite zu zerquetschen */
  overflow-x: auto;
}

/* ─── A4-Dokumentblock ─── */
.doc-a4 {
  width: 210mm;
  /* Etwas unter voller A4-Höhe: wirkt im Bildschirm weniger „gestreckt“, Fuß bleibt unten (Flex) */
  min-height: 288mm;
  box-sizing: border-box;
  margin-left: auto;
  margin-right: auto;
  background: #fff;
  box-shadow: 0 4px 24px rgba(0,0,0,0.18);
  padding: 14mm 18mm;
  position: relative;
  page-break-after: always;
  margin-bottom: 2rem;
  font-family: 'Helvetica Neue', Helvetica, Arial, sans-serif;
  font-size: 11pt;
  color: var(--doc-text);
  /* Fußzeile immer am unteren Blattrand: Flex-Spalte, .doc-body füllt Zwischenraum */
  display: flex;
  flex-direction: column;
}
.doc-a4:last-of-type { margin-bottom: 0; }

/* ─── Dokumentkopf (pro Blatt) ─── */
.doc-header {
  flex-shrink: 0;
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  border-bottom: 2.5px solid var(--doc-head);
  padding-bottom: 6pt;
  margin-bottom: 10pt;
}
.doc-header__left h1 {
  font-size: 11pt;
  font-weight: 700;
  color: var(--doc-head);
  letter-spacing: .02em;
  margin: 0;
}
.doc-header__left p {
  font-size: 8.25pt;
  color: var(--doc-soft);
  margin-top: 2pt;
}
.doc-header__right {
  text-align: right;
  font-size: 8.25pt;
  color: var(--doc-soft);
  line-height: 1.6;
}
.doc-header__right strong { color: var(--doc-text); }

/* ─── Feature-Streifen ─── */
.doc-feature-strip {
  flex-shrink: 0;
  background: var(--doc-head);
  color: #fff;
  padding: 5pt 0 5pt 10pt;
  font-size: 11pt;
  font-weight: 700;
  letter-spacing: .04em;
  margin-bottom: 8pt;
  display: flex;
  align-items: center;
  gap: 12pt;
}
.doc-feature-strip__num {
  font-size: 8.25pt;
  font-weight: 700;
  letter-spacing: .14em;
  text-transform: uppercase;
  opacity: .8;
}

/* ─── Dokumentinhalt (Dokumentstruktur, Dokumentoptik) ─── */
.doc-body {
  padding: 0;
  flex: 1 1 auto;
  /* Flex-Default min-width:auto lässt breite Tabellen (z. B. 04b) die Blattbreite sprengen */
  min-width: 0;
  overflow-x: auto;
}

.doc-body .form-meta {
  display: grid;
  grid-template-columns: 2fr 1.1fr 1fr 1.1fr;
  gap: 0;
  border: 1px solid var(--doc-bdr);
  margin-bottom: 8pt;
}
.doc-body .form-meta__cell {
  padding: 4pt 7pt;
  border-right: 1px solid var(--doc-bdr);
}
.doc-body .form-meta__cell:last-child { border-right: none; }
.doc-body .form-meta__label {
  font-size: 8.25pt;
  font-weight: 700;
  letter-spacing: .1em;
  text-transform: uppercase;
  color: var(--doc-soft);
  margin-bottom: 2pt;
}
.doc-body .form-meta__value {
  font-size: 8.25pt;
  color: var(--doc-text);
  font-weight: 600;
}
.doc-body .form-meta__value.light { font-weight: 400; color: var(--doc-mid); font-style: italic; }

/* Formular-Meta: Zelle über mehrere Spalten (ersetzt wiederkehrendes inline grid-column) */
.doc-body .form-meta__cell--span-2 { grid-column: span 2; }
.doc-body .form-meta__cell--span-full { grid-column: 1 / -1; }

/* Erklärtext in Formularfeldern (ersetzt inline font-size/color für 8.25pt-Zweitfarbe) */
.doc-body .doc-soft-note {
  font-size: 8.25pt;
  color: var(--doc-soft);
  margin-top: 2pt;
}
.doc-body .doc-soft-note--inline {
  font-size: 8.25pt;
  color: var(--doc-soft);
  font-weight: 400;
}

/* Abstand vor Formularblock (wo kein eigener Seiten-<style> nötig sein soll) */
.doc-body .form-field--spacing-top { margin-top: 6pt; }

.doc-body .vague-block {
  border: 1px solid var(--doc-bdr);
  border-left: 3px solid var(--doc-soft);
  padding: 5pt 8pt;
  margin-bottom: 8pt;
  background: var(--doc-light);
}
.doc-body .vague-block__label {
  font-size: 8.25pt;
  font-weight: 700;
  letter-spacing: .1em;
  text-transform: uppercase;
  color: var(--doc-soft);
  margin-bottom: 2pt;
}
.doc-body .vague-block__text {
  font-size: 8.25pt;
  color: var(--doc-mid);
  font-style: italic;
  margin: 0;
}

.doc-body .section__subhead {
  font-size: 8.25pt;
  font-weight: 700;
  letter-spacing: .14em;
  text-transform: uppercase;
  color: var(--doc-soft);
  margin: 10pt 0 4pt;
}
.doc-body .section__subhead:first-of-type { margin-top: 0; }

.doc-body .ref-table table {
  width: 100%;
  border-collapse: collapse;
  border: 1px solid var(--doc-bdr);
  margin-bottom: 8pt;
  font-size: 8.25pt;
}
.doc-body .ref-table thead tr { background: var(--doc-head); color: #fff; }
.doc-body .ref-table thead th {
  padding: 4pt 7pt;
  text-align: left;
  font-size: 8.25pt;
  font-weight: 700;
  letter-spacing: .08em;
  text-transform: uppercase;
}
.doc-body .ref-table thead th.col-ac-nr { width: 2rem; }
.doc-body .ref-table tbody tr { border-bottom: 1px solid var(--doc-bdr); }
.doc-body .ref-table tbody tr:last-child { border-bottom: none; }
.doc-body .ref-table tbody tr:nth-child(even) { background: var(--doc-light); }
.doc-body .ref-table tbody td {
  padding: 4.5pt 7pt;
  vertical-align: top;
  line-height: 1.45;
}
.doc-body .ref-table .cell-nr {
  font-weight: 700;
  color: var(--doc-soft);
  width: 1.5rem;
  text-align: center;
  font-size: 8.25pt;
}
.doc-body .ref-table .cell-q { color: var(--doc-text); }
.doc-body .ref-table .cell-a { color: var(--doc-acc); }
.doc-body .ref-table .cell-a::before { content: "→ "; font-weight: 700; }

/* ─── GM-F01 / GM-F02 / GM-F03: 5-Spalten-Tabelle (Kategorie | # | Kurztitel | Testfrage | Antwort) für A4 ─── */
.doc-mode .doc-a4 .ref-table table.questions-5col {
  table-layout: fixed;
  font-size: 8.25pt;
}
.doc-mode .doc-a4 .ref-table table.questions-5col th,
.doc-mode .doc-a4 .ref-table table.questions-5col td {
  word-wrap: break-word;
  overflow-wrap: break-word;
}
.doc-mode .doc-a4 .ref-table table.questions-5col th:nth-child(1),
.doc-mode .doc-a4 .ref-table table.questions-5col td:nth-child(1) { width: 13%; } /* Kategorie */
.doc-mode .doc-a4 .ref-table table.questions-5col th:nth-child(2),
.doc-mode .doc-a4 .ref-table table.questions-5col td:nth-child(2) { width: 5%; }  /* # */
.doc-mode .doc-a4 .ref-table table.questions-5col th:nth-child(3),
.doc-mode .doc-a4 .ref-table table.questions-5col td:nth-child(3) { width: 16%; } /* Kurztitel */
.doc-mode .doc-a4 .ref-table table.questions-5col th:nth-child(4),
.doc-mode .doc-a4 .ref-table table.questions-5col td:nth-child(4) { width: 36%; }  /* Testfrage */
.doc-mode .doc-a4 .ref-table table.questions-5col th:nth-child(5),
.doc-mode .doc-a4 .ref-table table.questions-5col td:nth-child(5) { width: 30%; } /* Antwort */

/* Kopf „Kategorie“: nicht umbrechen (break-word + schmale 13%-Spalte + letter-spacing → „Kategori/e“) */
.doc-mode .doc-a4 .ref-table table.questions-5col thead th:nth-child(1) {
  white-space: nowrap;
  overflow-wrap: normal;
  word-wrap: normal;
}

/* Akzeptanzkriterien (HA4 A4, .form-two-col): gleiche Körperschrift wie übrige Tabellen */
.doc-mode .doc-a4 .form-two-col .ref-table table:not(.questions-5col) {
  font-size: 8.25pt;
}

.doc-body .form-two-col {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 8pt;
  margin-bottom: 8pt;
}
.doc-body .boundary-box {
  border: 1px solid var(--doc-bdr);
  padding: 5pt 7pt;
  margin-bottom: 8pt;
}
.doc-body .boundary-box__label {
  font-size: 8.25pt;
  font-weight: 700;
  letter-spacing: .1em;
  text-transform: uppercase;
  color: var(--doc-soft);
  margin-bottom: 4pt;
}
.doc-body .chip-row { display: flex; flex-wrap: wrap; gap: 3pt; }
.doc-body .chip {
  font-size: 8.25pt;
  padding: 1.5pt 6pt;
  border: 1px solid var(--doc-bdr);
  background: var(--doc-light);
  color: var(--doc-text);
}
.doc-body .open-box {
  border: 1px solid var(--doc-bdr);
  border-left: 3px solid var(--doc-open);
  padding: 5pt 8pt;
}
.doc-body .open-box__label {
  font-size: 8.25pt;
  font-weight: 700;
  letter-spacing: .1em;
  text-transform: uppercase;
  color: var(--doc-open);
  margin-bottom: 4pt;
}
.doc-body .open-list { list-style: none; margin: 0; padding: 0; }
.doc-body .open-list li {
  font-size: 8.25pt;
  color: var(--doc-open);
  padding: 1.5pt 0;
  display: flex;
  gap: 5pt;
  border-bottom: 1px solid rgba(138,90,106,0.15);
  line-height: 1.4;
}
.doc-body .open-list li:last-child { border-bottom: none; }
.doc-body .open-list li::before { content: "?"; font-weight: 800; font-size: 8.25pt; }

.doc-body .status-badge {
  font-size: 8.25pt;
  font-weight: 700;
  padding: 2pt 8pt;
  border: 1px solid;
  white-space: nowrap;
}
.doc-body .status-badge--open {
  color: var(--doc-open);
  border-color: var(--doc-open);
  background: var(--doc-open-bg);
}
.doc-body .status-badge--review {
  color: var(--doc-review);
  border-color: var(--doc-review);
  background: var(--doc-review-bg);
}
.doc-body .status-badge--done {
  color: var(--doc-acc);
  border-color: var(--doc-acc);
  background: #eaf4ee;
}

/* ─── Zusammenfassungsseite: Summentabelle + Leseanleitung ─── */
.doc-body .ref-table table.sum-table { margin-top: 10pt; }
.doc-body .ref-table table.sum-table thead tr { background: var(--doc-head); color: #fff; }
.doc-body .ref-table table.sum-table thead th {
  padding: 5pt 8pt;
  font-size: 8.25pt;
  letter-spacing: .08em;
  text-transform: uppercase;
}
.doc-body .ref-table table.sum-table tbody td { padding: 5pt 8pt; }
.doc-body .ref-table table.sum-table tbody td:first-child { font-weight: 700; }

.doc-body .read-guide-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  border: 1px solid var(--doc-bdr);
  margin-top: 14pt;
  font-size: 8.25pt;
}
.doc-body .read-guide__cell {
  padding: 6pt 8pt;
  border-right: 1px solid var(--doc-bdr);
  line-height: 1.5;
  color: var(--doc-mid);
}
.doc-body .read-guide__cell:last-child { border-right: none; }
.doc-body .read-guide__cell strong { color: var(--doc-text); display: block; margin-bottom: 2pt; }
.doc-body .read-guide__note {
  padding: 5pt 8pt;
  border-top: 1px solid var(--doc-bdr);
  color: var(--doc-open);
  font-size: 8.25pt;
  line-height: 1.5;
  background: var(--doc-open-bg-soft);
}
.doc-body .read-guide__note strong { color: var(--doc-open); }

/* Zusammenfassungsseite: zweite Hinweiszeile (HA5-Anschluss) — gleiche Maße wie .read-guide__note, Akzentfarbe wie Tabellen-Antworten */
.doc-body .read-guide__note.read-guide__note--follow {
  color: var(--doc-acc);
  background: rgba(74, 124, 89, 0.1);
}
.doc-body .read-guide__note.read-guide__note--follow strong { color: var(--doc-acc); }

/* ─── Seitenfuß pro A4-Blatt (am unteren Rand des Blatts, nicht am Ende des Inhalts) ─── */
.doc-footer {
  flex-shrink: 0;
  margin-top: auto;
  width: 100%;
  padding-top: 1mm;
  border-top: 1px solid var(--doc-bdr);
  font-size: 8.25pt;
  color: var(--doc-soft);
  line-height: 1.35;
  display: block;
  text-align: left;
  box-sizing: border-box;
}

/* ─── Meta-Bar (nur Bildschirm, Hinweis auf Dokumentmodus) ─── */
.meta-bar {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 1rem;
  padding: .6rem 1rem;
  margin-bottom: 1rem;
  background: rgba(255,255,255,0.55);
  border: 1px solid var(--bdr);
  border-radius: 8px;
  font-size: 0.9rem;
  color: var(--mid);
}
.meta-bar strong { color: var(--text); }

/* ─── Druck: Rahmen ausblenden, A4-Blöcke als Seiten ─── */
@media print {
  /*
   * Papierformat & Mindestrand zum nicht druckbaren Bereich des Browsers.
   * Innenpadding von .doc-a4 (Print) ergibt sich daraus: ca. 12mm @page + 14–16mm Padding
   * ≈ optisch vergleichbar mit Screen (16mm/18mm) ohne 210mm-Breite aus dem bedruckbaren Bereich zu schieben.
   */
  @page {
    size: A4;
    margin: 12mm;
  }

  .top-nav-zone,
  .page-chrome,
  .meta-bar,
  main > footer,
  /* Site-Fuß unterhalb von <main> (nicht main > footer) — sonst zweite Druckseite nur mit Quellenzeile */
  body > footer { display: none !important; }

  body { padding: 0; margin: 0; background: #fff; }
  main { max-width: none; }

  .doc-a4 {
    box-shadow: none;
    margin: 0;
    page-break-after: always;
    /* Etwas unter druckbarer Vollhöhe (≈273mm bei 12mm @page) — weniger Leerraum, kompakter */
    min-height: 265mm;
    /* Volle Breite des durch @page freigegebenen Bereichs (nicht fix 210mm → kein seitlicher Überlauf) */
    width: 100%;
    max-width: none;
    box-sizing: border-box;
    padding: 14mm 16mm;
    display: flex;
    flex-direction: column;
  }
  .doc-a4:last-of-type { page-break-after: auto; }

  .doc-body {
    padding-bottom: 0;
  }

  /*
   * Hintergrundfarben beibehalten (Chrome: „Hintergrundgrafiken“, Firefox: „Hintergrund drucken“).
   * WebKit-Präfix + Standard für breite Unterstützung.
   */
  .doc-body .ref-table thead tr,
  .doc-body .ref-table thead th,
  .doc-feature-strip {
    -webkit-print-color-adjust: exact;
    print-color-adjust: exact;
  }

  /*
   * Tabellen: Kopfzeile auf Folgeseiten wiederholen; Zeile möglichst nicht zerreißen.
   * Trade-off: sehr hohe/mehrzeilige Zeilen können größere Lücken vor einem Umbruch erzeugen.
   */
  .doc-body .ref-table thead {
    display: table-header-group;
  }
  .doc-body .ref-table tbody tr {
    break-inside: avoid;
    page-break-inside: avoid;
  }
}