/* REW Rechnung – Oberfläche, nur was die App allein hat.
   Farben, Schriften, Kopf, Karten, Knöpfe, Felder, Tabellen, Schilder und Meldungen stehen in
   rew-core/rew.css (wird vorher geladen); Grundteile übernommen aus REW-Portal v0.5.1 (assets/portal.css). */
.kopfzeile{margin-bottom:18px}
.raster{display:grid;grid-template-columns:repeat(auto-fit,minmax(300px,1fr));gap:18px;align-items:start}
.karte.gedaempft{background:#fafcfb}
.karte.schmal{max-width:430px;margin:28px auto}
.karte.mittel{max-width:720px;margin:10px auto}
.hilfe{color:var(--rc-grau)}
.klein{font-size:13px}
/* Anmeldung */
.anmeldung{text-align:left;border-top:4px solid var(--rc-akzent)}
.anmeldung .logo-gross{height:54px;width:auto;display:block;margin:4px 0 18px}
.wortmarke-gross{font:800 24px var(--rc-schrift-marke);color:var(--rc-petrol-900);text-transform:uppercase}
.zeile{display:flex;gap:12px;flex-wrap:wrap}
.zeile > label{flex:1 1 200px}
.zeile > label.schmal{flex:0 1 120px}
.zeile > label.breit{flex:3 1 240px}
/* Einrichtung */
.schritte{display:flex;gap:8px;margin:0 0 16px}
.schritte span{padding:4px 12px;border-radius:999px;background:var(--rc-salbei);color:var(--rc-grau);font-size:13px;font-weight:600}
.schritte span.on{background:var(--rc-petrol-800);color:#fff}
.schritte span.fertig{background:var(--rc-akzent-hauch);color:var(--rc-akzent-text)}
.pruefliste{width:100%;border-collapse:collapse;margin:8px 0 6px;font-size:14px}
.pruefliste td{padding:6px 8px;border-bottom:1px solid var(--rc-linie-weich);vertical-align:top}
.pruefliste tr.ok td:first-child{color:var(--rc-gut);font-weight:700}
.pruefliste tr.nein td:first-child,.pruefliste tr.nein td:nth-child(2){color:var(--rc-warn);font-weight:700}
/* Angaben und Listen */
.angaben{display:grid;grid-template-columns:max-content 1fr;gap:6px 16px;margin:0 0 14px}
.angaben dt{color:var(--rc-grau)}
.angaben dd{margin:0;word-break:break-word}
.nowrap{white-space:nowrap}
label.haken{display:flex;align-items:center;gap:10px;font-weight:600;min-height:44px}
label.haken input{width:22px;height:22px;min-height:0;margin:0;flex:0 0 auto}
.kopfzeile.mit-knopf{display:flex;align-items:flex-end;justify-content:space-between;gap:12px;flex-wrap:wrap}
.suche{display:flex;gap:8px;flex-wrap:wrap;margin:0 0 14px}
.suche input{flex:1 1 220px;width:auto;margin:0}
.suche select{flex:0 1 160px;width:auto;margin:0}
.umbruch{overflow-wrap:anywhere}
form.inline{display:flex;gap:6px;align-items:center;margin:0;flex-wrap:wrap;justify-content:inherit}
td.rechts form.inline{justify-content:flex-end}
.abstand-oben{margin-top:18px}
.leer{padding:18px 20px;margin:0}
.knoepfe{display:flex;gap:6px;flex-wrap:wrap;justify-content:flex-end}
/* v0.1.4 – Zwei-Faktor-Anmeldung */
.knopf-link{background:none;border:0;padding:10px 0;min-height:44px;color:var(--rc-akzent-text);text-decoration:underline;
  cursor:pointer;font:inherit;font-size:13px}
.anmeldung-neu{margin:4px 0 0}
.karte.zwei{margin-top:18px}
.karte.zwei h2 .schild{vertical-align:middle;margin-left:8px}
.karte.zwei h3{margin:20px 0 8px;font-size:16px}
.zweischritte{padding-left:20px;margin:0 0 10px}
.zweischritte > li{margin-bottom:16px}
.zweischritte .zeile{margin-top:10px;align-items:flex-end}
.qrfeld{display:flex;flex-wrap:wrap;gap:18px;align-items:flex-start;margin-top:10px}
.qr{flex:0 0 auto;background:#fff;border:1px solid var(--rc-linie,#dfe5e4);border-radius:8px;padding:6px;line-height:0}
.qr svg{width:220px;height:220px;max-width:100%}
.qrneben{flex:1 1 240px;min-width:0}
code.geheim{display:inline-block;font-size:15px;letter-spacing:.04em;word-break:break-all;padding:6px 8px}
.codes-neu{border:2px solid var(--rc-warn);border-radius:10px;padding:14px 16px;margin:6px 0 18px;background:var(--rc-warn-hell)}
.codes-neu h3{margin-top:0}
.codeliste{display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:6px 18px;padding-left:24px;margin:10px 0 0}
.codeliste code{font-size:15px;letter-spacing:.05em;background:#fff}
.zweiaktionen{display:flex;flex-wrap:wrap;gap:10px;margin:10px 0 14px}
.zwei form.zeile{align-items:flex-end;margin-top:6px}
@media print{
  body *{visibility:hidden}
  .codes-neu,.codes-neu *{visibility:visible}
  .codes-neu{position:absolute;left:0;top:0;border:0;background:#fff}
}
.zwei form.zeile > .btn{margin-bottom:14px}
/* ------------------------- REW Rechnung (v0.1.0) ------------------------ */
.muster-band{margin:0 0 16px}
.muster-band a{font-weight:600}
.kz-raster{display:grid;grid-template-columns:repeat(auto-fit,minmax(190px,1fr));gap:14px;margin:0 0 18px}
.kz{border:1px solid var(--rc-linie);border-radius:12px;background:#fff;padding:14px 16px;box-shadow:inset 0 3px 0 var(--rc-akzent)}
.kz b{display:block;font:800 24px var(--rc-schrift-marke);color:var(--rc-petrol-900)}
.kz span{color:var(--rc-grau);font-size:13px}
.kz.warn{box-shadow:inset 0 3px 0 var(--rc-warn)}
.luecken{margin:6px 0 0;padding-left:20px}
.luecken li{margin:2px 0}
/* Positionen eines Entwurfs: auf breiten Schirmen eine Tabelle, auf dem Telefon Blöcke */
.positionen{width:100%;border-collapse:collapse;font-size:14px}
.positionen th{text-align:left;font-weight:600;color:var(--rc-grau);background:var(--rc-salbei);padding:8px 6px}
.positionen td{padding:6px;border-top:1px solid var(--rc-linie-weich);vertical-align:top}
.positionen input,.positionen textarea,.positionen select{margin:0;width:100%}
.positionen textarea{min-height:44px;font-size:14px}
.positionen .p-nr{width:58px}
.positionen .p-menge{width:96px}
.positionen .p-einheit{width:124px}
.positionen .p-einzel{width:120px}
.positionen .p-summe{width:120px;text-align:right;white-space:nowrap;padding-top:16px}
.positionen .p-weg{width:70px;text-align:center}
.positionen .p-weg input{width:22px;height:22px;min-height:0;margin-top:11px}
.positionen tr.neu td{background:#fafcfb}
.positionen tfoot td{font-weight:700;border-top:2px solid var(--rc-petrol-800);padding-top:10px}
@media (max-width:820px){
  .positionen thead{display:none}
  .positionen,.positionen tbody,.positionen tr,.positionen td{display:block;width:100%}
  .positionen tr{border:1px solid var(--rc-linie);border-radius:10px;padding:8px;margin:0 0 10px;background:#fff}
  .positionen td{border:0;padding:4px 2px}
  .positionen td[data-titel]::before{content:attr(data-titel);display:block;font-size:12px;color:var(--rc-grau);font-weight:600}
  .positionen .p-nr,.positionen .p-menge,.positionen .p-einheit,.positionen .p-einzel,.positionen .p-summe,.positionen .p-weg{width:100%;text-align:left}
  .positionen tfoot tr{border:0;background:none}
}
.aktionen{display:flex;gap:10px;flex-wrap:wrap;align-items:center;margin:14px 0 0}
.aktionen form{margin:0}
.ausstellen{border-top:4px solid var(--rc-akzent)}
.ausstellen.gesperrt{border-top-color:var(--rc-warn)}
.pruef-ok{color:var(--rc-gut);font-weight:700}
.pruef-fehler{color:var(--rc-warn);font-weight:700}
.hash{font:12px/1.4 ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;word-break:break-all;color:var(--rc-grau)}
textarea.kurz{min-height:70px}
.raster.breit-links{grid-template-columns:minmax(0,3fr) minmax(280px,2fr)}
@media (max-width:820px){.raster.breit-links{grid-template-columns:1fr}}
.brotkrume{margin:0 0 4px;font-size:13px}
.brotkrume a{text-decoration:none}
.brotkrume a::after{content:' ›';color:var(--rc-grau)}
.aktionen select{width:auto;margin:0;max-width:100%}

/* v0.2 – Versandweg, Leistungsorte, Storno */
.versand-hinweis{background:var(--rc-salbei,#eef5f4);border-left:4px solid var(--rc-akzent);padding:8px 12px;border-radius:6px;margin:10px 0 0;font-size:15px}
.versand-hinweis.gross{margin:0 0 16px;font-size:16px}
.ort-liste{display:flex;flex-direction:column;gap:6px;margin:0 0 10px}
details.ort{border:1px solid var(--rc-linie,#d5e0de);border-radius:8px;padding:10px 12px}
details.ort>summary{cursor:pointer;min-height:32px;line-height:1.5}
details.ort.inaktiv>summary{color:#6b7776}
details.ort form{margin-top:10px}
.karte.storno{border-top:4px solid #b03024}
.karte h3{font-size:15px;margin:18px 0 6px}
/* ------------------------- REW Rechnung (v0.2.1) ------------------------ */
.zahl-stand{margin-bottom:12px}
.buchungen tr.zurueck td{color:var(--rc-grau)}
.buchungen tr.zurueck td.zahl{text-decoration:line-through}
.zurueck-form summary{cursor:pointer;color:var(--rc-petrol-700,#1f5f63);font-size:14px}
.zurueck-form form{margin-top:8px;min-width:220px}
.zahl-form h3,.guthaben h3{margin-top:0}
.guthaben{border:1px solid var(--rc-warn);border-radius:10px;padding:12px 14px;background:var(--rc-warn-hell)}
.op-stufen{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:10px;margin:0 0 16px}
.op-stufen .kz b{font-size:19px}
.blatt-kopf{display:flex;flex-wrap:wrap;justify-content:space-between;gap:12px;margin-bottom:10px}
.blatt-kopf address{font-style:normal}
.kontoblatt td.zahl,.kontoblatt th.zahl{white-space:nowrap}
.kontoblatt tr.zurueck td{color:var(--rc-grau)}
.kontoblatt tr.zurueck td.zahl{text-decoration:line-through}
.kontoblatt tfoot td{font-weight:700}
.nur-druck{display:none}
@media print{
  .blatt,.blatt *{visibility:visible}
  .blatt{position:absolute;left:0;top:0;width:100%}
  .blatt .nicht-drucken{display:none!important}
  .blatt .nur-druck{display:block}
  .blatt .karte{border:0;box-shadow:none;padding:0}
  .blatt a{color:inherit;text-decoration:none}
}
a.kz{display:block;color:inherit;text-decoration:none}
a.kz:hover{border-color:var(--rc-akzent)}