/* Modul „billing“ – nur, was die Bausteine aus app.css nicht abdecken. */

/* Spalten der Stapel begrenzen, damit breite Tabellen innerhalb von .table-wrap scrollen statt die Seite zu verbreitern */
.stack, .stack-lg { grid-template-columns: minmax(0, 1fr); }
.split > * { min-width: 0; }

/* Positionseditor (Vertrag anlegen/bearbeiten) */
.items-editor { display: grid; gap: 12px; }
.item-card { position: relative; padding: 14px 16px 4px; border: 1px solid var(--rule); border-radius: var(--r-box); background: var(--sheet-2); }
.item-card .item-head { display: flex; align-items: center; justify-content: space-between; gap: 10px; margin-bottom: 10px; }
.item-card .item-head .label { color: var(--muted); font-size: .84rem; }
.item-grid { display: grid; grid-template-columns: 2fr 3fr; gap: 0 14px; }
.item-grid-2 { display: grid; grid-template-columns: minmax(0, .8fr) minmax(0, 1fr) minmax(0, 1.25fr) minmax(0, 1.45fr) minmax(0, .95fr) minmax(0, .95fr); gap: 0 12px; }
/* Felder im Raster nicht strecken (sonst wachsen Eingaben neben Feldern mit Hinweistext) */
.fields > .field, .fields-3 > .field, .item-grid > .field, .item-grid-2 > .field { align-content: start; }
.item-card details { margin: 0 0 10px; }
.item-card summary { cursor: pointer; color: var(--signal); font-size: .88rem; margin-bottom: 8px; }
.item-card .line-sum { font-variant-numeric: tabular-nums; color: var(--ink-2); font-size: .88rem; }

/* Zusammenfassung / Vorschau */
.totals-box { display: grid; gap: 6px; }
.totals-box .row { display: flex; justify-content: space-between; gap: 12px; font-variant-numeric: tabular-nums; }
.totals-box .row strong { font-weight: 650; }
.totals-box .row.muted { color: var(--muted); font-size: .88rem; }
.terms-preview dl { margin-top: 4px; }
.sticky-aside { position: sticky; top: 76px; }

/* Zeitleiste */
.timeline { list-style: none; margin: 0; padding: 0 20px 6px; }
.timeline li { position: relative; padding: 10px 0 10px 22px; border-left: 1px solid var(--rule); margin-left: 4px; }
.timeline li::before { content: ""; position: absolute; left: -5px; top: 15px; width: 9px; height: 9px; border-radius: 50%; background: var(--sheet); border: 2px solid var(--idle); }
.timeline li.ev-cancelled::before, .timeline li.ev-ended::before { border-color: var(--warn); }
.timeline li.ev-accepted::before, .timeline li.ev-activated::before, .timeline li.ev-provisioned::before { border-color: var(--ok); }
.timeline li.ev-provision_failed::before, .timeline li.ev-mail_failed::before { border-color: var(--bad); }
.timeline li.ev-note::before { border-color: var(--signal); }
.timeline .ev-text { overflow-wrap: anywhere; }
.timeline .ev-meta { font-size: .82rem; color: var(--muted); margin-top: 2px; }

/* Angebot annehmen (§ 312j BGB: wesentliche Angaben direkt über der Schaltfläche) */
.doc-embed { max-height: min(70vh, 640px); overflow-y: auto; padding: 22px 24px; border-bottom: 1px solid var(--rule); }
.accept-box { padding: 18px 20px; display: grid; gap: 14px; }
.accept-facts { display: grid; grid-template-columns: repeat(auto-fit, minmax(170px, 1fr)); gap: 10px 18px; margin: 0; }
.accept-facts dt { font-size: .82rem; color: var(--muted); }
.accept-facts dd { margin: 0; font-weight: 620; font-variant-numeric: tabular-nums; }

/* Kündigung (§ 312k BGB) */
.cancel-cta { display: flex; align-items: center; justify-content: space-between; gap: 14px; flex-wrap: wrap; padding: 14px 20px; }
.cancel-cta p { margin: 0; }
.step-label { display: inline-block; font-size: .84rem; color: var(--muted); margin-bottom: 6px; }
.choice-list { display: grid; gap: 8px; }
.choice-list .check { padding: 12px 14px; border: 1px solid var(--rule); border-radius: var(--r-ctl); background: var(--sheet); margin: 0; }
.choice-list .check:has(input:checked) { border-color: var(--signal); background: var(--signal-wash); }
.hp { position: absolute !important; left: -10000px !important; width: 1px; height: 1px; overflow: hidden; }
.receipt-card { border: 1px solid var(--rule); border-radius: var(--r-box); background: var(--sheet); }
.receipt-card .panel-head h2 { display: flex; align-items: center; gap: 10px; }
.receipt-card .panel-head .ico { color: var(--ok); width: 22px; height: 22px; }

/* Listen/Tabellen */
.amount-neg { color: var(--ok); }
.cell-sub { display: block; font-size: .84rem; color: var(--muted); font-weight: 400; white-space: pre-line; }
.table td.wrap { white-space: pre-line; }
.table td.nowrap { white-space: nowrap; }
.table tfoot.totals-foot tr + tr td { border-top: 1px solid var(--rule); }
.table tfoot.totals-foot tr:last-child td { font-size: 1.02rem; }
.inline-actions { display: inline-flex; gap: 6px; flex-wrap: wrap; justify-content: flex-end; }
.filter-bar { display: flex; flex-wrap: wrap; gap: 10px; align-items: flex-end; padding: 14px 20px; border-bottom: 1px solid var(--rule); }
.filter-bar .field { margin: 0; min-width: 160px; }
.filter-bar .check { margin: 0 0 9px; }
.preview-customer + .preview-customer { margin-top: 18px; }
.preview-customer .panel-head label { display: flex; align-items: center; gap: 10px; cursor: pointer; }
.preview-customer .panel-head input { width: 17px; height: 17px; accent-color: var(--signal); }
.kv-compact { grid-template-columns: minmax(120px, max-content) 1fr; gap: 6px 16px; font-size: .93rem; }
.big-figure { font-size: 1.6rem; font-weight: 650; font-stretch: 114%; font-variant-numeric: tabular-nums; line-height: 1.15; }
.mandate-text { padding: 12px 14px; border: 1px solid var(--rule); border-radius: var(--r-ctl); background: var(--sheet-2); font-size: .88rem; color: var(--ink-2); margin-bottom: 12px; }
.secret-row { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; }
.secret-row code { padding: 4px 8px; border-radius: 5px; background: var(--sheet-2); border: 1px solid var(--rule); overflow-wrap: anywhere; }

@media (max-width: 900px) {
  .item-grid { grid-template-columns: minmax(0, 1fr); }
  .item-grid-2 { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .sticky-aside { position: static; }
}
@media (max-width: 680px) {
  .item-grid-2 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .doc-embed { padding: 14px; max-height: 480px; }
  .filter-bar { padding: 12px 14px; }
  .filter-bar .field { min-width: 0; flex: 1 1 140px; }
  .cancel-cta { padding: 12px 14px; }
}
@media print {
  .receipt-card { border-color: #bbb; }
}