/* Wolke Pay – der Beleg (Bildschirm, Kundenanzeige, Druck auf Bon 80 mm oder A4). Auch für die öffentliche Abrufseite beleg.html. */
.beleg-blatt { box-sizing: border-box; width: 100%; max-width: 360px; margin: 0 auto; padding: 18px 18px 22px; background: #fff; color: #111; border: 1px solid #e4e1d8; border-radius: 10px;
  font: 13px/1.45 ui-monospace, "SFMono-Regular", Menlo, Consolas, monospace; }
.beleg-blatt .b-kopf { font: 600 16px/1.3 system-ui, -apple-system, "Segoe UI", sans-serif; text-align: center; }
.beleg-blatt .b-klein { text-align: center; font-size: 12px; color: #444; }
.beleg-blatt .b-klein2 { font-size: 11.5px; color: #444; margin-top: 2px; }
.beleg-blatt .b-titel { text-align: center; font-weight: 700; margin: 4px 0 6px; letter-spacing: .3px; }
.beleg-blatt .b-warn { text-align: center; font-weight: 700; color: #b3261e; border: 1.5px solid #b3261e; border-radius: 6px; padding: 3px 6px; margin: 4px 0 8px; }
.beleg-blatt .b-abstand { height: 8px; }
.beleg-blatt .b-linie { border: 0; border-top: 1px dashed #999; margin: 8px 0; }
.beleg-blatt .b-paar, .beleg-blatt .b-pos, .beleg-blatt .b-summe { display: flex; justify-content: space-between; gap: 12px; }
.beleg-blatt .b-pos small { color: #666; }
.beleg-blatt .b-pos span:last-child, .beleg-blatt .b-paar span:last-child { white-space: nowrap; text-align: right; }
.beleg-blatt .b-summe { font-weight: 700; font-size: 15px; margin: 2px 0 4px; }
.beleg-blatt .b-qr, .beleg-blatt .b-link { display: flex; flex-direction: column; align-items: center; margin-top: 12px; }
.beleg-blatt .b-qr svg, .beleg-blatt .b-link svg { width: 170px; height: auto; }
.beleg-blatt .b-link { border-top: 1px dashed #999; padding-top: 10px; }
.beleg-blatt.bericht { max-width: 560px; font-family: system-ui, sans-serif; }

.kundenanzeige { position: fixed; inset: 0; width: 100%; height: 100%; max-width: none; max-height: none; margin: 0; border: 0; background: #f7f6f1;
  overflow: auto; padding: 24px 12px; }
.kundenanzeige[open] { display: flex; justify-content: center; align-items: flex-start; }
.kundenanzeige .ka-innen { max-width: 420px; width: 100%; text-align: center; }
.kundenanzeige h2 { margin: 6px 0 14px; font-size: 24px; }
.kundenanzeige .ka-link { background: #fff; border-radius: 14px; padding: 16px; margin-bottom: 16px; }
.kundenanzeige .ka-link svg { width: 260px; height: auto; }
.kundenanzeige h2:focus { outline: none; }
.kundenanzeige .ka-text { font-size: 15px; color: #4d5f5a; }

#druckbereich { display: none; }
@media print {
  @page { margin: 6mm; }
  body.druck-beleg > *:not(#druckbereich) { display: none !important; }
  body.druck-beleg #druckbereich { display: block; }
  body.druck-beleg .beleg-blatt { border: 0; max-width: 72mm; padding: 0; margin: 0; font-size: 11px; }
  body.druck-beleg .beleg-blatt .b-link { display: none; }
  body.druck-beleg .beleg-blatt .b-qr svg { width: 42mm; }
  body.druck-beleg .beleg-blatt.bericht { max-width: 100%; }
}
.beleg-blatt .b-logo { display: block; max-width: 62%; max-height: 64px; margin: 0 auto 10px; object-fit: contain; }

/* Wertgutschein zum Ausdrucken (kasse.gutscheinDrucken): Karte 148 × 105 mm (A6 quer) */
.gutschein-druck { width: 148mm; min-height: 105mm; box-sizing: border-box; padding: 9mm 10mm; border: 1px solid #c8c3b8; border-radius: 4mm;
  font-family: Georgia, "Times New Roman", serif; color: #2b2a27; display: flex; flex-direction: column; gap: 2mm; position: relative; }
.gutschein-druck .gd-logo { position: absolute; top: 8mm; right: 10mm; max-height: 16mm; max-width: 40mm; }
.gutschein-druck .gd-titel { font-size: 13pt; letter-spacing: .25em; text-transform: uppercase; color: #6f9a7e; }
.gutschein-druck .gd-wert { font-size: 34pt; font-weight: 700; line-height: 1.1; }
.gutschein-druck .gd-text { font-size: 13pt; }
.gutschein-druck .gd-fuer { font-size: 12pt; font-style: italic; }
.gutschein-druck .gd-fuss { margin-top: auto; display: flex; justify-content: space-between; align-items: flex-end; gap: 8mm; font: 9pt/1.35 sans-serif; }
.gutschein-druck .gd-code { text-align: center; font: 10pt/1.3 monospace; }
.gutschein-druck .gd-code svg { width: 24mm; height: 24mm; }
.gutschein-druck .gd-code small { font: 7.5pt sans-serif; color: #6b675f; }