/* CN-beheer · het factuurvel en de schermen eromheen (ONTWERP-V2 §4.8-4.9, §5.1, §6). Laadt als laatste.
   fv-  het vel (sjabloon C "Signatuur", factuur-sjabloon/c-signatuur/signatuur.css; BESLUITEN-JORDY 2). Altijd licht papier, ook in het
        donker (een vel op een donkere tafel); op het scherm de warme papiertoon, bij afdrukken wit.
        De houder (.fv-houder) is een container:
        · smal (< 640 px, de telefoon of een blad): een rustige lijst, zonder de kolommen Prijs en Btw;
        · breed (≥ 640 px, ook het afgedrukte vel van 174 mm): een getrouwe verkleining van het A4. Alle maten van het sjabloon staan hier in --mm (één millimeter op de
          schaal van het vel), zodat het scherm en het papier dezelfde opbouw hebben;
        · afdrukken: het echte A4 (--mm = 1mm), de pagina "factuur" met marges 18/18/21 mm, "pagina 1 van 2" rechtsonder en (via
          CN.vel.paginaKop) het nummer rechtsboven op de vervolgpagina's.
   fv-mini  het kleine vel (Dienst, Nieuwe relatie, Dienst toevoegen) in dezelfde vorm.
   fa-  het scherm van één factuur en de bladen (Maak definitief, Crediteren) · fm- Factuur maken · nr- Nieuwe relatie.
   Contrast op het vel (tests/contrast.mjs): inkt 15,5 · tekst 10,9 · fijn 5,5 : 1 op de papiertoon; op wit hoger. */

/* =========================================================== het vel: vaste, lichte tokens */
.fv, .fv-mini {
  --fv-inkt: #1b1918; --fv-tekst: #3a332e; --fv-fijn: #6b5f55; --fv-lijn: #8c7e71; --fv-vel: #f6f1ea; --fv-rood: #84291c;
  --fv-min: 11px; --fv-min-s: 9.5px; --fv-min-l: 1px;
}
.fv-houder { container: vel / inline-size; width: 100%; min-width: 0; }
.fv {
  --mm: 1mm;
  position: relative; display: block; background: var(--fv-vel); color: var(--fv-tekst);
  font: 400 15px/1.5 var(--cn-f-sans); font-kerning: normal; font-variant-numeric: lining-nums;
  padding: 24px 18px 22px; border-radius: 4px; overflow-wrap: anywhere;
  -webkit-print-color-adjust: exact; print-color-adjust: exact;
}
.fv strong { font-weight: 500; color: var(--fv-inkt); }
.fv img { display: block; }
.fv-heel { white-space: nowrap; }
.fv-band {
  display: flex; align-items: center; gap: 8px; margin: -8px 0 18px; padding: 8px 12px; border-radius: 10px;
  background: color-mix(in srgb, #d9c3b4 55%, var(--fv-vel)); color: #4f3d31; font-size: 13.5px; line-height: 1.35;
}
.fv-band .icon { flex: none; color: #4f3d31; }

/* ---------- smal (de standaard): de telefoon en de bladen ---------- */
.fv-kop { display: flex; align-items: flex-end; gap: 14px; }
.fv-kop .fv-rail { flex: none; }
.fv-monogram { width: 66px; height: auto; }
.fv-titel { margin: 0; font: 340 36px/1 var(--cn-f-display); letter-spacing: -.012em; color: var(--fv-inkt); }
.fv-label { display: block; margin: 0 0 4px; font: 500 11.5px/1.45 var(--cn-f-sans); letter-spacing: .12em; text-transform: uppercase; color: var(--fv-fijn); }
.fv-partijen { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 18px 16px; margin-top: 24px; }
.fv-partijen-hoofd { display: contents; }
.fv-adres { margin: 0; font-size: 14.5px; line-height: 1.45; }
.fv-mist { color: var(--fv-rood); font-style: italic; }
.fv-meta { grid-column: 1 / -1; margin: 2px 0 0; }
.fv-meta > div { display: flex; justify-content: space-between; align-items: baseline; gap: 14px; padding: 6px 0; border-top: 1px solid rgb(140 126 113 / .35); }
.fv-meta > div:last-child { border-bottom: 1px solid rgb(140 126 113 / .35); }
.fv-meta dt { color: var(--fv-fijn); }
.fv-meta dd { margin: 0; color: var(--fv-inkt); text-align: right; }
.fv-volgt { font: italic 400 15px/1.2 var(--cn-f-serif); color: var(--fv-fijn); }
.fv-regels { margin-top: 26px; }
.fv-regels .fv-rail, .fv-slot .fv-rail { display: none; }
.fv-posten { display: none; }
.fv-smal { list-style: none; margin: 0; padding: 0; border-top: 1px solid var(--fv-inkt); }
.fv-smal ul { list-style: none; margin: 0; padding: 0; }
.fv-groep { padding: 11px 0; border-bottom: 1px solid rgb(140 126 113 / .55); }
.fv-r { display: flex; justify-content: space-between; align-items: baseline; gap: 16px; }
.fv-r + .fv-r { margin-top: 6px; }
.fv-r-o { min-width: 0; }
.fv-r-o .wat { display: block; color: var(--fv-inkt); }
.fv-r-o .extra { display: block; font-size: 13.5px; line-height: 1.4; color: var(--fv-fijn); }
.fv-r-b { flex: none; white-space: nowrap; color: var(--fv-inkt); font-variant-numeric: tabular-nums; }
.fv-r.korting .fv-r-o { font-size: 14px; color: var(--fv-tekst); }
.fv-totaalblok { display: flex; justify-content: flex-end; align-items: flex-start; gap: 12px; margin-top: 12px; }
.fv-totalen { flex: 1 1 auto; max-width: 330px; margin: 0; padding-bottom: 2px; border-bottom: 1px solid var(--fv-inkt); }
.fv-totalen > div { display: flex; justify-content: space-between; align-items: baseline; gap: 14px; padding: 4px 0; }
.fv-totalen dt { color: var(--fv-tekst); }
.fv-totalen dd { margin: 0; white-space: nowrap; color: var(--fv-inkt); font-variant-numeric: tabular-nums; }
.fv-totalen .fv-totaal { margin-top: 6px; padding: 11px 0 10px; border-top: 1px solid var(--fv-inkt); border-bottom: 1px solid var(--fv-inkt); }
.fv-totaal dt { font: italic 400 23px/1 var(--cn-f-serif); color: var(--fv-inkt); }
.fv-totaal dd { font: 500 19px/1 var(--cn-f-sans); letter-spacing: .01em; }
.fv-stempel { --s: 82px; flex: none; margin-top: 4px; }
.fv-slot { margin-top: 24px; }
.fv-betaal { margin: 0; max-width: 46ch; text-wrap: pretty; }
.fv-betaal strong { white-space: nowrap; }
.fv-ster { display: inline-block !important; width: 10px; height: 10px; margin: 0 8px 1px 0; vertical-align: baseline; }
.fv-voet { display: flex; justify-content: space-between; align-items: flex-end; gap: 16px; margin-top: 30px; padding-top: 16px; }
.fv-colofon { font-size: 12.5px; line-height: 1.5; min-width: 0; }
.fv-colofon p, .fv-colofon dl { margin: 0; }
.fv-colofon .fv-contact { margin-bottom: 6px; }
.fv-colofon dl > div { display: grid; grid-template-columns: 38px auto; }
.fv-colofon dt { color: var(--fv-fijn); }
.fv-colofon dd { margin: 0; white-space: nowrap; font-variant-numeric: tabular-nums; }
.fv-groet { flex: 0 1 44%; display: flex; justify-content: flex-end; }
.fv-handtekening { width: 100%; max-width: 210px; height: auto; }

/* ---------- breed (≥ 640 px): het A4, op schaal (en bij afdrukken: 174 mm = 658 px) ---------- */
@container vel (min-width: 640px) {
  .fv {
    --mm: calc(100cqi / 210);
    display: flex; flex-direction: column; min-height: calc(297 * var(--mm));
    padding: calc(18 * var(--mm)) calc(18 * var(--mm)) calc(21.5 * var(--mm));
    font-size: max(var(--fv-min), calc(3.351 * var(--mm)));        /* 9,5 pt */
    line-height: 1.42;                                               /* 13,5 pt */
    overflow-wrap: normal;
  }
  .fv-band { position: absolute; top: calc(5.5 * var(--mm)); left: calc(18 * var(--mm)); right: calc(18 * var(--mm)); margin: 0; padding: calc(1.6 * var(--mm)) calc(3 * var(--mm)); font-size: max(var(--fv-min-s), calc(2.82 * var(--mm))); border-radius: calc(2 * var(--mm)); }
  .fv-rij { display: grid; grid-template-columns: calc(44 * var(--mm)) minmax(0, 1fr); column-gap: calc(8 * var(--mm)); }
  .fv-kop { align-items: end; gap: 0 calc(8 * var(--mm)); }
  .fv-monogram { width: calc(34 * var(--mm)); }
  .fv-titel { font-size: calc(14.111 * var(--mm)); }               /* 40 pt */
  .fv-label { font-size: max(var(--fv-min-s), calc(2.381 * var(--mm))); line-height: 1.48; margin-bottom: calc(1.2 * var(--mm)); }
  .fv-partijen { margin-top: calc(12 * var(--mm)); gap: 0 calc(8 * var(--mm)); }
  .fv-partijen-hoofd { display: grid; grid-template-columns: minmax(0, 1fr) calc(62 * var(--mm)); column-gap: calc(8 * var(--mm)); }
  .fv-adres { font-size: inherit; line-height: inherit; }
  .fv-van .fv-adres { font-size: max(var(--fv-min-s), calc(2.999 * var(--mm))); }   /* 8,5 pt */
  .fv-meta { grid-column: auto; margin: 0; padding-top: calc(4.728 * var(--mm)); }
  .fv-meta > div, .fv-meta > div:last-child { padding: 0; border: 0; column-gap: calc(4 * var(--mm)); }
  .fv-meta dd { white-space: nowrap; }
  .fv-volgt { font-size: inherit; }
  .fv-regels { margin-top: calc(10 * var(--mm)); }
  .fv-regels .fv-rail, .fv-slot .fv-rail { display: block; }
  .fv-smal { display: none; }
  .fv-posten { display: table; width: calc(100% + 15 * var(--mm)); margin-left: calc(-15 * var(--mm)); border-collapse: collapse; table-layout: fixed; }
  .fv-posten .c-aantal { width: calc(15 * var(--mm)); }
  .fv-posten .c-prijs { width: calc(21 * var(--mm)); }
  .fv-posten .c-btw { width: calc(11.5 * var(--mm)); }
  .fv-posten .c-bedrag { width: calc(22 * var(--mm)); }
  .fv-posten th {
    padding: 0 0 calc(2 * var(--mm)); text-align: left; vertical-align: bottom;
    font: 500 max(var(--fv-min-s), calc(2.381 * var(--mm)))/1.48 var(--cn-f-sans); letter-spacing: .12em; text-transform: uppercase; color: var(--fv-fijn);
  }
  .fv-posten th:not(.aantal) { border-bottom: max(var(--fv-min-l), calc(.212 * var(--mm))) solid var(--fv-inkt); }
  .fv-posten td { padding: 0; vertical-align: top; }
  .fv-posten .aantal { padding-right: calc(3.5 * var(--mm)); text-align: right; }
  .fv-posten .prijs, .fv-posten .btw, .fv-posten .bedrag { text-align: right; }
  .fv-posten td.aantal, .fv-posten td.prijs, .fv-posten td.bedrag { font-variant-numeric: tabular-nums; color: var(--fv-inkt); }
  .fv-posten td.btw { font-variant-numeric: tabular-nums; color: var(--fv-fijn); }
  .fv-posten td.aantal, .fv-posten td.prijs, .fv-posten td.btw, .fv-posten td.bedrag { white-space: nowrap; }
  .fv-posten td.oms { padding-right: calc(2.5 * var(--mm)); }
  .fv-posten tbody { break-inside: avoid; }
  .fv-posten tbody tr:first-child td { padding-top: calc(2.6 * var(--mm)); }
  .fv-posten tbody tr:last-child td { padding-bottom: calc(2.6 * var(--mm)); }
  .fv-posten tbody + tbody tr:first-child td:not(.aantal) { border-top: max(var(--fv-min-l), calc(.176 * var(--mm))) solid var(--fv-lijn); }
  .fv-posten tbody:last-child tr:last-child td:not(.aantal) { border-bottom: max(var(--fv-min-l), calc(.176 * var(--mm))) solid var(--fv-lijn); }
  .fv-posten .wat { display: block; color: var(--fv-inkt); }
  .fv-posten .extra { display: block; margin-top: calc(.3 * var(--mm)); font-size: max(var(--fv-min-s), calc(2.999 * var(--mm))); line-height: calc(4.233 * var(--mm)); color: var(--fv-fijn); }
  .fv-posten .korting td { padding-top: calc(1.4 * var(--mm)); }
  .fv-posten .korting .oms { color: var(--fv-tekst); }
  .fv-posten .korting td.bedrag { color: var(--fv-inkt); }
  .fv-totaalblok { position: relative; display: block; margin: 0; }
  .fv-totalen { width: calc(62 * var(--mm)); max-width: none; margin: calc(1.6 * var(--mm)) 0 0 auto; padding-bottom: calc(.564 * var(--mm)); border-bottom-width: max(var(--fv-min-l), calc(.212 * var(--mm))); break-inside: avoid; }
  .fv-totalen > div { padding: calc(.8 * var(--mm)) 0; column-gap: calc(4 * var(--mm)); }
  .fv-totalen dt { white-space: nowrap; }
  .fv-totalen .fv-totaal { margin-top: calc(1.6 * var(--mm)); padding: calc(2.6 * var(--mm)) 0 calc(2.4 * var(--mm)); border-width: max(var(--fv-min-l), calc(.212 * var(--mm))); }
  .fv-totaal dt { font-size: calc(6.35 * var(--mm)); }              /* 18 pt */
  .fv-totaal dd { font-size: calc(5.292 * var(--mm)); }             /* 15 pt */
  .fv-stempel { --s: calc(27 * var(--mm)); position: absolute; left: calc(12 * var(--mm)); top: calc(1 * var(--mm)); margin: 0; }
  .fv-slot { margin-top: calc(8 * var(--mm)); break-inside: avoid; }
  .fv-betaal { max-width: calc(106 * var(--mm)); }
  .fv-ster { float: left; width: calc(2.3 * var(--mm)); height: calc(2.3 * var(--mm)); margin: calc(1.05 * var(--mm)) 0 0 calc(-5.8 * var(--mm)); }
  .fv-voet { display: grid; margin-top: auto; padding-top: calc(9 * var(--mm)); align-items: last baseline; break-inside: avoid; }
  .fv-colofon { font-size: max(var(--fv-min-s), calc(2.822 * var(--mm))); line-height: calc(4.233 * var(--mm)); }   /* 8 / 12 pt */
  .fv-colofon .fv-contact { margin-bottom: calc(1.6 * var(--mm)); }
  .fv-colofon dl > div { grid-template-columns: calc(7.8 * var(--mm)) auto; }
  .fv-groet { display: flex; justify-content: flex-end; align-items: baseline; padding-bottom: calc(6.73 * var(--mm)); }
  .fv-handtekening { position: relative; top: calc(4.64 * var(--mm)); width: calc(62 * var(--mm)); max-width: none; }
}

/* ---------- het kleine vel (voorbeeld van de volgende of eerste factuur) ---------- */
.rl-minivel.fv-mini { max-width: 560px; padding: 20px 20px 16px; background: var(--fv-vel); color: var(--fv-tekst); font-size: 14px; line-height: 1.45; }
.fv-mini-kop { display: flex; align-items: flex-end; gap: 12px; margin: 0 0 14px; }
.fv-mini-mono { display: block; width: 42px; height: auto; flex: none; }
.fv-mini-titel { display: flex; flex: 1; justify-content: space-between; align-items: flex-end; gap: 12px; margin: 0; }
.fv-mini-woord { font: 340 26px/1 var(--cn-f-display); letter-spacing: -.01em; color: var(--fv-inkt); }
.fv-mini-meta { text-align: right; font-size: 12.5px; line-height: 1.35; color: var(--fv-fijn); }
.fv-mini-regels { list-style: none; margin: 0; padding: 0; border-top: 1px solid var(--fv-inkt); }
.fv-mini-groep { padding: 8px 0; border-bottom: 1px solid rgb(140 126 113 / .5); }
.fv-mini-r { display: flex; justify-content: space-between; align-items: baseline; gap: 14px; }
.fv-mini-r + .fv-mini-r { margin-top: 4px; }
.fv-mini-o { min-width: 0; }
.fv-mini-o .wat { display: block; color: var(--fv-inkt); }
.fv-mini-o .extra { display: block; font-size: 12.5px; color: var(--fv-fijn); }
.fv-mini-r.min .fv-mini-o .wat { color: var(--fv-tekst); }
.fv-mini-b { flex: none; white-space: nowrap; color: var(--fv-inkt); font-variant-numeric: tabular-nums; }
.fv-mini-tot { max-width: 300px; margin: 10px 0 0 auto; padding-bottom: 2px; border-bottom: 1px solid var(--fv-inkt); font-variant-numeric: tabular-nums lining-nums; }
.fv-mini-tot > div { display: flex; justify-content: space-between; gap: 12px; padding: 3px 0; }
.fv-mini-tot dt { color: var(--fv-tekst); }
.fv-mini-tot dd { margin: 0; white-space: nowrap; color: var(--fv-inkt); }
.fv-mini-tot .tot { margin-top: 4px; padding: 8px 0 7px; border-top: 1px solid var(--fv-inkt); border-bottom: 1px solid var(--fv-inkt); }
.fv-mini-tot .tot dt { font: italic 400 19px/1 var(--cn-f-serif); color: var(--fv-inkt); }
.fv-mini-tot .tot dd { font: 500 16px/1 var(--cn-f-sans); }
.fv-mini-zin { margin: 14px 0 0; font-size: 14px; color: var(--fv-tekst); }
.fv-mini-zin .fv-ster { width: 9px; height: 9px; }
.fv-mini .rl-minivel-let { color: #74490c; }

/* =========================================================== het scherm van één factuur */
.fa-grid { display: grid; grid-template-columns: minmax(0, 1fr); gap: 16px; margin-top: 4px; }
.fa-velkant { min-width: 0; display: grid; gap: 12px; align-content: start; }
.fa-velkant > .callout { margin: 0; }
.fa-paneel { display: contents; }
.fa-stand { order: -1; }
.fa-verloop, .fa-fisc { order: 1; }
.fa-grid .card + .card { margin-top: 0; }
.fa-stand .card-head { align-items: center; }
.fa-stand .card-head h2 { margin: 0; font-size: 21px; }
.fa-zin { margin: 0 0 14px; font: 400 17px/1.45 var(--cn-f-serif); color: var(--cn-text-2); text-wrap: pretty; }
.fa-stand .btn-row + .btn-row { margin-top: 8px; }
.fa-pdf { margin: 12px 0 0; font-size: var(--cn-fs-xs); }
.fa-verloop .timeline { margin-top: 4px; }
.fa-fisc .small { color: var(--cn-text-2); }
@media (max-width: 559px) {
  .fa-stand .btn-row { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .fa-stand .btn-row > .btn:only-child, .fa-stand .btn-row > .btn:last-child:nth-child(odd) { grid-column: 1 / -1; }
}
@media (min-width: 1024px) {
  .fa-grid { grid-template-columns: minmax(0, 1fr) minmax(300px, 360px); gap: 28px; align-items: start; }
  .fa-paneel { display: grid; gap: 14px; align-content: start; position: sticky; top: calc(var(--cn-top-h) + 12px); }
  .fa-stand, .fa-verloop, .fa-fisc { order: 0; }
}

/* de bladen: Maak definitief, Crediteren */
.fa-fkop { margin: 0 0 10px; font: 500 var(--cn-fs-label)/1.4 var(--cn-f-sans); letter-spacing: var(--cn-track); text-transform: uppercase; color: var(--cn-muted); }
.fa-def .callout { margin: 0 0 14px; }
.fa-rc-blok { opacity: .62; cursor: not-allowed; }
.fa-rc-blok .d { color: var(--cn-bad-ink); }
.fa-blad .lede-s { font: 400 18px/1.4 var(--cn-f-serif); margin: 0 0 14px; }

/* =========================================================== Factuur maken */
.fm { display: grid; gap: 8px; }
.fm-groep { padding: 0 0 14px; margin: 0 0 14px; border-bottom: 1px solid var(--cn-hair); }
.fm-groep > .callout { margin: 0 0 12px; }
.fm-chips { margin: 0 0 4px; }
.fm-chips .chip { max-width: 100%; }
.fm-chips .note { margin: 0; }
.fm-regel { padding: 10px 14px 2px; margin: 0 0 10px; border: 1px solid var(--cn-line); border-radius: var(--cn-r-s); background: var(--cn-field); }
.fm-regel.korting { border-style: dashed; border-color: var(--cn-line-2); }
.fm-regel-kop { display: flex; justify-content: space-between; align-items: center; min-height: 28px; margin: 0 0 2px; }
.fm-regel-nr { font: italic 17px/1 var(--cn-f-serif); color: var(--cn-muted); }
.fm-weg { margin-right: -8px; }
.fm-herkomst { display: flex; flex-wrap: wrap; align-items: center; gap: 6px; margin: -6px 0 12px; font-size: var(--cn-fs-xs); color: var(--cn-muted); }
.fm-regel-getal { display: grid; grid-template-columns: minmax(64px, .6fr) minmax(0, 1.3fr) minmax(84px, .8fr); gap: 0 10px; }
@media (max-width: 400px) { .fm-regel-getal { grid-template-columns: minmax(0, 1fr) minmax(0, 1.4fr); } .fm-regel-getal > :last-child { grid-column: 1 / -1; } }
.fm-erbij { margin: 2px 0 14px; }
.fm-snel-kop { margin: 0 0 8px; }
.fm-totalen { max-width: 360px; margin: 0 0 0 auto; }
.fm-totalen > div { display: flex; justify-content: space-between; gap: 12px; padding: 4px 0; font-variant-numeric: tabular-nums lining-nums; }
.fm-totalen dt { color: var(--cn-text-2); }
.fm-totalen dd { margin: 0; color: var(--cn-text); white-space: nowrap; }
.fm-totalen .tot { margin-top: 4px; padding-top: 9px; border-top: 1px solid var(--cn-text); }
.fm-totalen .tot dt { font: italic 400 20px/1 var(--cn-f-serif); color: var(--cn-text); }
.fm-totalen .tot dd { font-weight: 500; font-size: 18px; }
.fm-let { display: flex; gap: 6px; align-items: flex-start; margin: 10px 0 0; font-size: var(--cn-fs-xs); color: var(--cn-warn-ink); }
.fm-nummer { margin: 12px 0 0; text-align: right; }
.fm-slot { border-bottom: 0; margin-bottom: 0; }
.fm-datumnoot .callout { margin: 0 0 12px; }
.fm-details { min-width: 0; }
.fm-details > summary { display: inline-flex; align-items: center; gap: 8px; min-height: 44px; padding: 0 4px; cursor: pointer; font-size: var(--cn-fs-s); color: var(--cn-text-2); }
.fm-preview { margin-top: 8px; }
.fm-fout { flex: 1 1 100%; margin: 0 0 4px; font-size: var(--cn-fs-s); color: var(--cn-bad-ink); }
.fm-fout:empty { display: none; }
.fm-fout p { display: inline; margin: 0; }
@media (min-width: 1180px) {
  dialog.sheet.fm-blad { max-width: min(1320px, 96vw); }
  .fm-blad .fm { grid-template-columns: minmax(380px, 1fr) minmax(0, 1.55fr); gap: 0 28px; align-items: start; }
  .fm-blad .fm-details { position: sticky; top: 0; }
  .fm-blad .fm-details > summary { display: none; }
}

/* =========================================================== Nieuwe relatie (§5.1) */
.nr { display: grid; gap: 0; }
.nr-deel { padding: 0 0 16px; margin: 0 0 16px; border-bottom: 1px solid var(--cn-hair); }
.nr-deel:last-child { border-bottom: 0; margin-bottom: 0; }
.nr-adres { margin: -6px 0 12px; }
.nr-vraag { margin-bottom: 16px; }
.nr-vraag > .label.nr-vraag-l { font: 400 20px/1.3 var(--cn-f-serif); color: var(--cn-text); }
.nr-grootte .radio-cards { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 8px; }
.nr-grootte .radio-card { flex-direction: column; gap: 2px; padding: 12px 12px 10px; min-height: 64px; }
.nr-grootte .radio-card .t { font: 400 18px/1.2 var(--cn-f-serif); }
.nr-grootte .radio-card .d { font-size: var(--cn-fs-xs); }
.nr-dom-apart { margin-top: -4px; }
.nr-extra { align-items: end; }
.nr-app .switch { min-height: 48px; }
.nr-korting { margin: 4px 0 14px; padding: 0 14px; border: 1px dashed var(--cn-line-2); border-radius: var(--cn-r-s); background: var(--cn-field); }
.nr-korting > summary { display: flex; align-items: center; gap: 8px; min-height: 48px; cursor: pointer; font-size: var(--cn-fs-s); color: var(--cn-text); }
.nr-korting[open] > summary { border-bottom: 1px solid var(--cn-hair); margin-bottom: 12px; }
.nr-korting-in .seg { align-self: flex-start; }
.nr-incasso-noot { margin: 10px 0 0; }
@media (min-width: 1024px) {
  dialog.sheet.nr-blad { max-width: min(1180px, 94vw); }
  .nr-blad .nr { grid-template-columns: minmax(0, 1.1fr) minmax(320px, 1fr); grid-template-areas: "wie vel" "site vel"; column-gap: 32px; align-items: start; }
  .nr-blad .nr-deel:nth-child(1) { grid-area: wie; }
  .nr-blad .nr-deel:nth-child(2) { grid-area: site; border-bottom: 0; margin-bottom: 0; }
  .nr-blad .nr-vel { grid-area: vel; position: sticky; top: 0; border-bottom: 0; }
}

/* =========================================================== Instellingen › Bedrijf en Facturen */
.hr-paar { display: grid; gap: 0 16px; }
@media (min-width: 480px) { .hr-paar { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); } }
.hr-van { display: flex; flex-direction: column; gap: 2px; font-style: normal; background: var(--cn-nude); color: var(--cn-text); border-radius: var(--cn-r-s); padding: 14px 16px; margin: 0 0 8px; max-width: 44ch; overflow-wrap: anywhere; }
.hr-van strong { font-weight: 500; }
.hr-van-fijn { font-size: var(--cn-fs-xs); color: var(--cn-text-2); font-variant-numeric: tabular-nums; }

/* =========================================================== afdrukken: alleen het vel, op A4, wit */
@page factuur {
  size: A4;
  margin: 18mm 18mm 21mm;
  @top-right { font: 400 7pt/1 "CN Tekst", Arial, sans-serif; letter-spacing: .02em; color: #6b5f55; vertical-align: bottom; padding-bottom: 8mm; }
  @bottom-right { content: "pagina " counter(page) " van " counter(pages); font: 400 7pt/1 "CN Tekst", Arial, sans-serif; letter-spacing: .02em; color: #6b5f55; vertical-align: top; padding-top: 7mm; }
}
@media print {
  main.view:has(.fa-grid) > :not(.fa-grid) { display: none !important; }
  .fa-grid { display: block !important; margin: 0; }
  .fa-paneel, .fa-stand, .fa-verloop, .fa-fisc, .fa-velkant > :not(.fv-houder) { display: none !important; }
  .fv-houder { width: 174mm; }
  .fv { page: factuur; --mm: 1mm; --fv-min: 0px; --fv-min-s: 0px; --fv-min-l: 0px; --fv-vel: #fff; background: #fff; padding: 0; min-height: 257.5mm; box-shadow: none; border-radius: 0; font-size: 9.5pt; }
  .fv::after { display: none; }
  .fv-band, .fv-stempel { display: none !important; }
}
/* Keuring M1 punt 1 (22 okt): op een smalle telefoon passen "Markeer als betaald" en "Crediteren" niet naast elkaar: dan onder elkaar */
@media (max-width: 419px) {
  .fa-stand .btn-row { grid-template-columns: minmax(0, 1fr); }
  .fa-stand .btn-row > .btn:only-child, .fa-stand .btn-row > .btn:last-child:nth-child(odd) { grid-column: auto; }
}
