/* ============================================================
   Kabelstaat (PDF-export) — verborgen op scherm, zichtbaar bij print
   ============================================================ */
#norma-print-host { display: none; }

/* Tijdens het printen moet het rapport wél opgemaakt zijn (de schaling naar één A4 meet het),
   maar op het scherm buiten beeld — anders verspringt de app achter het printvenster. */
.norma-printing #norma-print-host {
  display: block;
  position: fixed; left: -300vw; top: 0; width: 100vw; z-index: -1;
  background: #fff; pointer-events: none;
}

.ks-doc {
  font-family: var(--ff-sans, system-ui, sans-serif);
  color: #1a1a1a;
  max-width: 1100px;
  margin: 0 auto;
  padding: 28px 32px;
  --kb-accent: #13294B; --kb-line: #e4e7ee; --kb-muted: #6b7280;
  -webkit-print-color-adjust: exact; print-color-adjust: exact;
}
/* Gedeelde kop (kabelstaat + volledig rapport) */
.kb-brand { display: flex; align-items: flex-start; gap: 14px; min-width: 0; }
.kb-logo { flex: none; width: 40px; height: 40px; display: flex; align-items: center; justify-content: center; -webkit-print-color-adjust: exact; print-color-adjust: exact; }
.kb-head .kb-subtitle { font-size: 13px; color: #5a6172; }
.ks-doc .kbf-meta { grid-template-columns: repeat(3, 1fr); }
.ks-meta4 { grid-template-columns: repeat(4, 1fr) !important; }
.ks-head { display: flex; justify-content: space-between; align-items: flex-start; gap: 24px; border-bottom: 2px solid #1a1a1a; padding-bottom: 14px; }
.ks-brand { display: flex; align-items: center; gap: 12px; }
.ks-logo {
  width: 40px; height: 40px; border-radius: 8px;
  background: #3a4d8f; color: #fff;
  display: flex; align-items: center; justify-content: center;
  font-weight: 700; font-size: 22px;
}
.ks-title { font-size: 21px; font-weight: 700; letter-spacing: -0.01em; }
.ks-sub { font-size: 12px; color: #666; }
.ks-meta { display: grid; grid-template-columns: auto auto; gap: 3px 18px; font-size: 11.5px; text-align: right; white-space: nowrap; }
.ks-meta > div { display: flex; gap: 8px; justify-content: flex-end; }
.ks-meta span { color: #888; }
.ks-meta b { font-weight: 600; }

.ks-supply {
  display: flex; gap: 28px; flex-wrap: wrap;
  margin: 14px 0 18px; padding: 10px 14px;
  background: #f4f5f8; border-radius: 6px; font-size: 12px;
}
.ks-supply > div { display: flex; flex-direction: column; gap: 2px; }
.ks-supply span { color: #888; font-size: 10.5px; text-transform: uppercase; letter-spacing: 0.04em; }

.ks-table { width: 100%; border-collapse: collapse; font-size: 11.5px; }
.ks-table thead th {
  text-align: left; padding: 7px 8px;
  background: var(--kb-accent, #13294B); border-bottom: 2px solid #F5C400;
  font-size: 10px; text-transform: uppercase; letter-spacing: 0.04em; color: #fff;
  font-weight: 700;
  -webkit-print-color-adjust: exact; print-color-adjust: exact;
}
.ks-table th.num, .ks-table td.num { text-align: right; }
.ks-table tbody td { padding: 7px 8px; border-bottom: 1px solid #e6e8ee; vertical-align: top; }
.ks-table tbody tr:nth-child(even) { background: #fafbfc; }
.ks-table .mono { font-family: var(--ff-mono, ui-monospace, monospace); }
.ks-table .cellsub { font-size: 9.5px; color: #999; margin-top: 1px; }
.ks-table .sub { color: #3a4d8f; }
.ks-table td.status { text-align: center; font-weight: 700; font-size: 14px; }
.ks-table td.status.ok { color: #2F7D5B; }
.ks-table td.status.bad { color: #B23A3A; }
.ks-table td.bad { color: #B23A3A; font-weight: 600; }
.ks-table tr.row-err { background: #fbf0f0 !important; }

.ks-summary { display: flex; gap: 14px; align-items: stretch; margin-top: 20px; flex-wrap: wrap; }
.ks-sumcard {
  padding: 12px 18px; border-radius: 8px; border: 1.5px solid #cfd3dd;
  min-width: 150px;
}
.ks-sumcard.all-ok { border-color: #2F7D5B; background: #eef6f1; }
.ks-sumcard.err { border-color: #B23A3A; background: #fbf0f0; }
.ks-sumnum { font-size: 24px; font-weight: 700; font-family: var(--ff-mono, monospace); }
.ks-sumcard.all-ok .ks-sumnum { color: #2F7D5B; }
.ks-sumcard.err .ks-sumnum { color: #B23A3A; }
.ks-sumlbl { font-size: 11px; color: #666; }
.ks-note { flex: 1; min-width: 220px; font-size: 10.5px; color: #777; line-height: 1.5; align-self: center; }

.ks-foot { margin-top: 22px; padding-top: 10px; border-top: 1px solid #ddd; font-size: 9.5px; color: #999; text-align: center; }

/* Per-groep sheet */
.ks-page { font-family: var(--ff-sans, system-ui, sans-serif); color: #1a1a1a; max-width: 1000px; margin: 0 auto; padding: 26px 30px; }
.ks-cabletitle { display: flex; align-items: center; justify-content: space-between; margin: 16px 0 14px; padding: 10px 14px; background: #f4f5f8; border-radius: 6px; }
.ks-cabletitle .mono { font-size: 15px; font-weight: 700; font-family: var(--ff-mono, monospace); }
.ks-status { font-size: 12px; font-weight: 600; padding: 3px 10px; border-radius: 20px; }
.ks-status.ok { background: #e4f4ea; color: #1f7a47; }
.ks-status.bad { background: #fbe6e6; color: #b23a3a; }
.ks-cols { display: grid; grid-template-columns: 1fr 1fr; gap: 14px; }
.ks-block { border: 1px solid #e2e0da; border-radius: 8px; padding: 10px 12px; }
.ks-block-result { grid-column: 1 / -1; }
.ks-block-result table { column-count: 2; column-gap: 28px; }
.ks-bt { font-size: 10.5px; text-transform: uppercase; letter-spacing: 0.05em; color: #777; font-weight: 600; margin-bottom: 6px; }
.ks-block table { width: 100%; border-collapse: collapse; font-size: 12px; }
.ks-block td { padding: 3px 0; vertical-align: baseline; }
.ks-block td.lbl { color: #444; }
.ks-block td.val { text-align: right; font-weight: 600; white-space: nowrap; padding-left: 10px; }
.ks-block td.unit { color: #999; width: 34px; padding-left: 5px; font-size: 11px; }
.ks-block .sym { color: #aaa; font-family: var(--ff-mono, monospace); font-size: 10.5px; }
.ks-checks { margin-top: 16px; border: 1px solid #e2e0da; border-radius: 8px; padding: 10px 12px; }
.ks-chk, .chk { display: flex; align-items: center; gap: 10px; padding: 5px 0; font-size: 12px; border-bottom: 1px solid #f0eee9; }
.chk:last-child { border-bottom: none; }
.chk-ic { width: 18px; height: 18px; border-radius: 50%; display: inline-flex; align-items: center; justify-content: center; color: #fff; font-size: 11px; font-weight: 700; flex: none; }
.chk.ok .chk-ic { background: #1f8a4d; }
.chk.bad .chk-ic { background: #b23a3a; }
.chk.na .chk-ic { background: #bbb; }
.chk-lbl { flex: 1; }
.chk-detail { color: #666; }

@media print {
  .ks-page { padding: 0; }
  .ks-page { page-break-after: always; }
}

@media print {
  /* Marge op 0 met de witruimte als padding in het blad: zonder papiermarge heeft
     de browser geen ruimte voor zijn eigen kop-/voettekst (URL, datum, paginanummer)
     en laat hij die weg. */
  @page { size: A4 landscape; margin: 0; }
  .norma-app, .np-overlay, .fm-modal, .tweaks-panel { display: none !important; }
  body.norma-printing #root { display: none !important; }
  body.norma-printing { height: auto !important; }
  body.norma-printing #norma-print-host { position: static; width: auto; }
  .norma-printing #norma-print-host { display: block; }
  .ks-table thead { display: table-header-group; }
  .ks-table tr { break-inside: avoid; }
  .ks-doc { padding: 12mm; max-width: none; box-sizing: border-box; }
}

/* ============================================================
   Per-groep kabelberekening-blad — clean rapport (kb-)
   ============================================================ */
.kb-doc {
  font-family: var(--ff-sans, system-ui, -apple-system, sans-serif);
  color: #1a1f2b;
  background: #fff;
  font-size: 10.5px;
  line-height: 1.32;
  --kb-accent: #13294B;
  --kb-line: #e4e7ee;
  --kb-muted: #6b7280;
}
.kb-page {
  max-width: 760px;
  margin: 0 auto;
  padding: 12px 20px 8px;
  position: relative;
}
.kb-page + .kb-page { page-break-before: always; }

/* Header */
.kb-head { display: flex; justify-content: space-between; align-items: flex-start; gap: 20px; padding-bottom: 9px; border-bottom: 2px solid var(--kb-accent); box-shadow: 0 2px 0 #F5C400; -webkit-print-color-adjust: exact; print-color-adjust: exact; }
.kb-kicker { font-size: 10.5px; font-weight: 600; letter-spacing: .06em; text-transform: uppercase; color: var(--kb-accent); }
.kb-head h1 { margin: 3px 0 1px; font-size: 17px; font-weight: 700; letter-spacing: -0.01em; white-space: nowrap; }
.kb-cable { display: inline-flex; align-items: center; box-sizing: border-box; height: 52px; padding: 0 14px; border-radius: 7px; background: #13294B; border: 1.5px solid #13294B; color: #ffffff; font-size: 19px; font-weight: 700; font-family: var(--ff-mono, ui-monospace, monospace); white-space: nowrap; -webkit-print-color-adjust: exact; print-color-adjust: exact; }
.kb-cable-sub { margin-top: 4px; font-size: 12px; font-weight: 600; color: #13294B; max-width: 360px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.kb-cable-row { display: flex; align-items: center; gap: 10px; margin-top: 6px; }
.kb-cable-txt { min-width: 0; }
/* Kabelvlak en de twee plaatjes even hoog, op één lijn. */
.kb-vis-media.kb-vis-lg { width: 72px; height: 52px; box-sizing: border-box; }
.kb-head-r { flex: none; }
/* Groepsblad-kop: dunne bovenregel (logo · soort blad · oordeel), daaronder vier even hoge vakken. */
.kb-head.kb-gh { display: block; }
.kb-gh-top { display: flex; justify-content: space-between; align-items: center; gap: 12px; }
.kb-gh-brand { display: flex; align-items: center; gap: 8px; min-width: 0; }
.kb-gh-logo { width: 24px; height: 24px; }
.kb-gh-top .kb-status { padding: 4px 10px; }
.kb-gh-row { display: grid; grid-template-columns: minmax(0, 1.3fr) minmax(0, 1.2fr) 78px 78px; gap: 8px; margin-top: 8px; }
.kb-gh-cell { box-sizing: border-box; height: 64px; border: 1px solid var(--kb-line); border-radius: 7px; background: #fff; padding: 6px 10px; display: flex; flex-direction: column; justify-content: center; gap: 2px; min-width: 0; overflow: hidden; }
.kb-gh-l { font-size: 8.5px; font-weight: 700; letter-spacing: .07em; text-transform: uppercase; color: var(--kb-muted); }
/* Altijd één regel; te lang → de fit-laag (fitSheet) maakt de letter kleiner, nooit afkappen. */
.kb-head .kb-gh-v { margin: 0; white-space: nowrap; font-size: 14px; font-weight: 700; line-height: 1.2; letter-spacing: -0.01em; overflow: hidden; }
.kb-gh-cable { background: #13294B; border-color: #13294B; -webkit-print-color-adjust: exact; print-color-adjust: exact; }
.kb-gh-cable .kb-gh-l { color: #aab6cc; }
.kb-gh-cable .kb-gh-v { color: #fff; font-family: var(--ff-mono, ui-monospace, monospace); font-size: 13px; }
/* Lange groeps- of kabelnaam: over twee regels in het vak in plaats van eruit te lopen. */
.kb-head .kb-gh-group .kb-gh-v, .kb-head .kb-gh-cable .kb-gh-v { white-space: normal; overflow-wrap: anywhere; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; }
.kb-gh-pic { padding: 4px; align-items: center; }
.kb-gh-pic .kb-vis-img, .kb-gh-pic svg { max-height: 40px; max-width: 100%; }
.kb-gh-cap { font-size: 8.5px; font-weight: 600; color: var(--kb-muted); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; max-width: 100%; }
.kb-status { display: inline-flex; align-items: center; gap: 6px; padding: 6px 12px; border-radius: 999px; font-size: 11px; font-weight: 700; white-space: nowrap; border: 1.5px solid transparent; -webkit-print-color-adjust: exact; print-color-adjust: exact; color-adjust: exact; }
.kb-status.ok { background: #1c7a45; color: #ffffff; border-color: #1c7a45; }
.kb-status.bad { background: #b23a3a; color: #ffffff; border-color: #b23a3a; }

/* Meta strip */
.kb-meta { display: flex; flex-wrap: wrap; gap: 3px 28px; margin: 6px 0 7px; }
.kb-meta > div { display: flex; flex-direction: column; gap: 1px; }
.kb-meta span { font-size: 10px; letter-spacing: .04em; text-transform: uppercase; color: var(--kb-muted); }
.kb-meta b { font-size: 11px; font-weight: 600; white-space: nowrap; }

/* Visuele band: installatiemethode + aderconfiguratie */
.kb-vis-media { flex: none; width: 58px; height: 46px; border: 1px solid var(--kb-line); border-radius: 6px; background: #fff; display: flex; align-items: center; justify-content: center; overflow: hidden; }
.kb-vis-img { max-width: 100%; max-height: 100%; object-fit: contain; }
.kb-cc { width: 50px; height: 38px; display: block; }
.kb-vis-empty { color: #c2c7d0; font-size: 18px; }

/* Cards grid */
.kb-card { border: 1px solid var(--kb-line); border-radius: 8px; padding: 7px 10px; break-inside: avoid; }
.kb-card h3 { margin: 0 0 4px; font-size: 9.5px; font-weight: 700; letter-spacing: .05em; text-transform: uppercase; color: var(--kb-accent); }
.kb-kvs { display: flex; flex-direction: column; }
.kb-kv {
  display: flex; align-items: baseline; justify-content: space-between; gap: 12px;
  padding: 1px 0; border-bottom: 1px solid var(--kb-line);
  white-space: nowrap;
}
.kb-kv.wrap { white-space: normal; align-items: flex-start; }
.kb-kv.wrap .kb-k { flex: 0 0 auto; }
.kb-kv.wrap .kb-v { flex: 1 1 auto; min-width: 0; text-align: right; overflow-wrap: anywhere; }
.kb-kv:last-child { border-bottom: none; }
.kb-k { color: var(--kb-muted); }
.kb-k em { font-style: normal; font-family: var(--ff-mono, monospace); font-size: 9px; color: #9aa1ad; }
.kb-v { font-weight: 600; text-align: right; font-variant-numeric: tabular-nums; flex: none; }
/* Doorlopende tekst als regel in een blok (omschrijving installatiemethode): zelfde letter als de termen. */
.kb-kv.kb-kv-tekst { display: block; white-space: normal; color: var(--kb-muted); }
.kb-u { font-weight: 400; color: var(--kb-muted); font-size: 9.5px; }


/* Checks */
.kb-checks { margin-top: 0; border: 1px solid var(--kb-line); border-radius: 8px; padding: 7px 10px 4px; break-inside: avoid; }
.kb-checks h3 { margin: 0 0 4px; font-size: 9.5px; font-weight: 700; letter-spacing: .05em; text-transform: uppercase; color: var(--kb-accent); }
.kb-chk { display: flex; align-items: baseline; gap: 8px; padding: 2.5px 0; border-bottom: 1px solid var(--kb-line); }
.kb-chk:last-child { border-bottom: none; }
.kb-chk-ic { flex: none; width: 14px; height: 14px; border-radius: 50%; display: flex; align-items: center; justify-content: center; font-size: 9px; font-weight: 700; }
.kb-chk.ok .kb-chk-ic { background: #e6f4ec; color: #1c7a45; }
.kb-chk.bad .kb-chk-ic { background: #fbe7e7; color: #b23a3a; }
.kb-chk.na .kb-chk-ic { background: #eef0f4; color: #9aa1ad; }
.kb-chk-l { flex: 1; min-width: 0; }
.kb-chk-d { color: var(--kb-muted); font-family: var(--ff-mono, monospace); font-size: 9.5px; flex: none; max-width: 42%; text-align: right; }
/* ── Blad 9-10: kerngetallen, toetsing, invoer | berekening ── */
.kb-chk-grid { display: block; }
/* Toetsnaam altijd op één regel (namen zijn kort gehouden in NORMA_CHECKS); uitleg rechts mag doorlopen. */
.kb-checks .kb-chk { display: grid; grid-template-columns: 14px minmax(0, 40%) minmax(0, 1fr); align-items: baseline; column-gap: 8px; }
.kb-checks .kb-chk-l, .kb-checks .kb-chk-d { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.kb-chk.warn .kb-chk-ic { background: #fdf3e2; color: #9a5b00; }
.kb-checks .kb-chk.bad { background: #fdf3f3; margin: 0 -6px; padding-left: 6px; padding-right: 6px; border-radius: 4px; }
.kb-checks .kb-chk.bad .kb-chk-l { color: #b23a3a; font-weight: 600; }
.kb-checks .kb-chk-d { max-width: none; white-space: normal; text-align: left; font-family: inherit; font-size: 9px; }
/* Adviezen (geen normeis): zelfde letter en kleur als de toetsen erboven, alleen een stippellijn ertussen. */
.kb-advice { border-top: 1px dashed var(--kb-line); } /* zelfde ritme als de regels erboven: alleen de lijn is gestippeld */
.kb-note { margin-top: 5px; font-size: 8.5px; line-height: 1.4; color: #5b6570; }
.kb-note.bad { color: #b23a3a; }
.kb-cols { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; margin-top: 8px; align-items: start; }
.kb-col { display: flex; flex-direction: column; gap: 6px; min-width: 0; }
.kb-col-h { font-size: 9px; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; color: var(--kb-muted); padding-bottom: 1px; border-bottom: 2px solid var(--kb-accent); }
.kb-ref { font-style: normal; font-size: 8.5px; color: #9aa1ad; margin-left: 3px; }

/* Footer */
.kb-foot { margin-top: 3px; padding-top: 2px; border-top: 1px solid var(--kb-line); display: flex; justify-content: space-between; gap: 12px; font-size: 7.5px; color: var(--kb-muted); }
.kb-foot span:first-child { font-weight: 700; color: var(--kb-accent); }

@media print {
  .norma-printing-group #norma-print-host { position: static; width: auto; }
  .kb-doc, .kb-doc * { -webkit-print-color-adjust: exact; print-color-adjust: exact; color-adjust: exact; }
}
.norma-printing-group #norma-print-host .ks-doc { display: none; }

/* ============================================================
   Volledig projectrapport (kbf-) — voorblad + per-groep blad
   ============================================================ */
.kbf-page { page-break-after: always; break-after: page; }
.kbf-page:last-child { page-break-after: auto; break-after: auto; }
.kbf-cover .kb-title { font-size: 26px; margin: 2px 0 2px; }
.kbf-cover .kb-subtitle { font-size: 14px; color: #5a6172; }
.kbf-meta {
  display: grid; grid-template-columns: repeat(3, 1fr); gap: 10px 18px;
  margin: 18px 0 6px; padding: 14px 16px;
  background: #f7f6f3; border: 1px solid #e6e2d8; border-radius: 8px;
}
.kbf-meta > div { display: flex; flex-direction: column; gap: 2px; }
.kbf-meta span { font-size: 10px; text-transform: uppercase; letter-spacing: 0.06em; color: #8a8578; }
.kbf-meta b { font-size: 12.5px; }
.kbf-h2 { font-size: 13px; margin: 18px 0 8px; text-transform: uppercase; letter-spacing: 0.05em; color: #5a6172; }
.kbf-toc { width: 100%; border-collapse: collapse; font-size: 11.5px; }
.kbf-toc th { text-align: left; padding: 6px 8px; border-bottom: 1.5px solid #1a1f2b; font-size: 10px; text-transform: uppercase; letter-spacing: 0.05em; }
.kbf-toc td { padding: 5px 8px; border-bottom: 1px solid #eceae4; }
.kbf-toc .kbf-tag { font-size: 9.5px; background: #eef1f6; color: #4a5468; border-radius: 999px; padding: 1px 7px; margin-left: 6px; }
.kbf-st { font-weight: 700; }
.kbf-st.ok { color: #1c7a45; }
.kbf-st.bad { color: #b23a3a; }
.kbf-st.warn { color: #a86a12; }
.kbf-matrix { font-size: 9px; }
.kbf-matrix th { font-size: 7.5px; padding: 4px 3px; }
.kbf-matrix td { padding: 3px; }
.kbf-matrix td.kbf-st, .kbf-matrix th:nth-child(n+3) { text-align: center; }
.kbf-legend { font-size: 8.5px; color: #6b7280; margin-top: 4px; }
.kbf-fails { font-size: 9.5px; margin: 0; padding-left: 16px; line-height: 1.45; }
/* Selectiviteitscurve als staand blad in het rapport: vaste hoogte, de grafiek vult de rest. */
.kbf-selp .selp-page { height: 160mm; }
.kbf-an-sub { font-size: 9.5px; color: #6b7280; margin: -4px 0 8px; }
.kbf-an table { width: 100% !important; min-width: 0 !important; table-layout: auto !important; border-collapse: collapse; font-size: 8.5px; margin-bottom: 10px; }
/* De app-tabellen hebben vaste kolombreedtes; in het rapport verdeelt de tabel de breedte zelf. */
.kbf-an th, .kbf-an td, .kbf-an col { width: auto !important; min-width: 0 !important; max-width: none !important; }
.kbf-an .ig-fill { display: none !important; }
.kbf-an th { text-align: left; font-size: 7.5px; padding: 4px 4px; border-bottom: 1.5px solid #1a1f2b; white-space: nowrap; }
.kbf-an td { padding: 3px 4px; border-bottom: 1px solid #eceae4; }
.kbf-an button { all: unset; }
.kbf-an svg { width: 10px; height: 10px; }

/* Bèta-disclaimer op elk exportblad */
/* Disclaimer en voettekst hebben op scherm en bij printen exact dezelfde maten.
   De fit-laag in export_group.jsx meet de hoogte in de schermweergave; wijkt de
   printweergave daarvan af, dan snijdt hij de onderkant van het blad af — en dat
   is precies waar deze twee staan. */
.kb-disc { display: block; width: 100%; box-sizing: border-box; margin-top: 5px; padding: 4px 6px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; border-left: 2.5pt solid #8a4b12; background: #fdf6ee; font-size: 8pt; line-height: 1.35; color: #43392e; text-wrap: pretty; break-inside: avoid; }

/* Het groepsblad past op één A4 en mag niet doorlopen */
@media print {
  .kb-page { max-height: none; overflow: hidden; page-break-inside: avoid; break-inside: avoid; }
  .kb-page > * { break-inside: avoid; }
}