/* ==========================================================================
   Nebenkosten (js/views/nebenkosten.js): Übersicht, Assistent, Ergebnis, PDF.
   Nur Variablen aus der Skala (css/app.css, css/einheit.css). Nachzahlung rot,
   Guthaben grün, Frist überfällig rot, bald fällig orange (Bedeutungsfarben).
   ========================================================================== */
.nk-haupt { margin-bottom: var(--gap, 16px); }
.nk-hz { font-size: 18px; color: var(--ink-2); margin-bottom: 4px; }
.nk-hz b { font-size: 26px; font-weight: 700; letter-spacing: -.03em; color: var(--ink); }
.nk-frist.crit { color: var(--crit-text, var(--neg)); font-weight: 600; }
.nk-frist.warn { color: var(--warn); font-weight: 600; }
.nk-raster { display: grid; grid-template-columns: repeat(auto-fill, minmax(280px, 1fr)); gap: var(--gap, 16px); margin-top: var(--gap, 16px); }
.nk-karte { display: flex; flex-direction: column; gap: 8px; }
.nk-k-kopf { display: flex; justify-content: space-between; align-items: flex-start; gap: 10px; margin-bottom: 4px; }
.nk-k-kopf .sub { margin: 2px 0 0; }
.nk-zeile { display: flex; justify-content: space-between; gap: 10px; font-size: 13.5px; }
.nk-k-fuss { margin-top: auto; padding-top: 8px; }
.nk-status.offen { background: var(--inset); color: var(--ink-2); }
.nk-status.entwurf { background: var(--warn-soft, var(--inset)); color: var(--warn); }
.nk-status.fertig { background: transparent; color: var(--ink); box-shadow: inset 0 0 0 1px var(--ink-3); }
.nk-status.versendet { background: transparent; color: var(--pos); box-shadow: inset 0 0 0 1px var(--pos); }
.nk-stand { margin-left: 6px; }

/* Assistent */
.nk-hinweis { display: flex; gap: 8px; align-items: flex-start; margin: 0; padding: 10px 12px; border-radius: var(--r-mittel); background: var(--inset); color: var(--ink-2); font-size: 13px; }
.nk-hinweis .ic { flex: none; margin-top: 2px; }
.nk-kosten { display: flex; flex-direction: column; gap: 8px; }
.nk-kost { display: flex; flex-direction: column; gap: 6px; padding: 10px 12px; border-radius: var(--r-mittel); background: var(--inset); }
.nk-kost.aus { opacity: .8; }
.nk-kost.zuordnen { box-shadow: inset 0 0 0 1.5px var(--warn); }
.nk-kost-zeile { display: grid; grid-template-columns: minmax(0, 1fr) 150px auto auto; gap: 8px; align-items: center; }
.nk-kost-zeile .select, .nk-kost-zeile .input { background: var(--card); }
.nk-um { white-space: nowrap; }
.nk-bitte { color: var(--warn); font-size: 12.5px; }
.nk-buchungen summary { cursor: pointer; font-size: 12.5px; color: var(--ink-2); }
.nk-buchungen ul { list-style: none; margin: 6px 0 0; padding: 0; display: flex; flex-direction: column; gap: 4px; font-size: 12.5px; }
.nk-buchungen li { display: grid; grid-template-columns: 84px minmax(0, 1fr) auto; gap: 8px; }
.nk-summe { margin: 6px 0 0; font-size: 15px; }
.nk-einheiten .input { width: 100px; text-align: right; background: var(--card); }
.nk-mieter { display: grid; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); gap: 12px; }
.nk-mk { display: flex; flex-direction: column; gap: 10px; padding: 14px 16px; border-radius: var(--r-gross); background: var(--card); box-shadow: var(--shadow); border: 1px solid var(--line); }
.nk-saldo { display: flex; flex-direction: column; gap: 2px; padding: 10px 12px; border-radius: var(--r-mittel); background: var(--inset); }
.nk-saldo b { font-size: 28px; font-weight: 700; letter-spacing: -.03em; font-variant-numeric: tabular-nums; }
.nk-saldo.neg b { color: var(--neg); }
.nk-saldo.pos b { color: var(--pos); }
.nk-mk .nk-s td { font-weight: 650; border-top: 1px solid var(--line-2); }
.nk-leer { display: grid; grid-template-columns: auto minmax(0, 1fr) auto; gap: 10px; align-items: baseline; margin-top: 12px; padding: 10px 14px; border-radius: var(--r-mittel); background: var(--inset); }
.nk-pdfs { display: flex; flex-wrap: wrap; gap: 8px; }
.nk-vz { display: flex; flex-wrap: wrap; align-items: flex-end; gap: 12px; }
.nk-vz .field { width: 180px; }
.nk-fest .select[disabled], .nk-fest .input[disabled] { opacity: .8; }
@media (max-width: 640px) {
  .nk-kost-zeile { grid-template-columns: minmax(0, 1fr) auto; }
  .nk-kost-zeile .nk-betrag { grid-column: 1; }
  .nk-nav { position: sticky; bottom: calc(var(--tb-h, 64px) + 24px + env(safe-area-inset-bottom, 0px)); z-index: 5; background: var(--card); margin: 18px -18px -18px; padding: 12px 18px; border-radius: 0 0 var(--r-gross) var(--r-gross); }
}

/* PDF */
.nk-doc { max-width: 760px; margin: 0 auto; color: var(--ink); }
.nk-doc-seite + .nk-doc-seite { margin-top: 40px; padding-top: 30px; border-top: 1px solid var(--line); }
.nk-doc-an { margin: 22px 0; line-height: 1.5; }
.nk-doc .t td, .nk-doc .t th { font-size: 13px; }
.nk-doc .nk-s td { border-top: 1px solid var(--line-2); }
.nk-doc-erl { margin: 0; padding-left: 18px; font-size: 13px; color: var(--ink-2); }
.nk-doc-fuss { margin-top: 18px; }
@media print {
  .nk-doc { color: #000; }
  .nk-doc-seite + .nk-doc-seite { break-before: page; border: 0; margin: 0; padding: 0; }
}

/* ---------- Zählerstände (Unterpunkt der Nebenkosten) ---------- */
.nk-ansicht { margin: 0 0 16px; border-bottom: 1px solid var(--line); }
