/* Gutschein-Generator: nur eigene Gestaltung, keine Fremdbilder/-schriften */
/* Schriftgrössen in mm und skaliert über --u (1mm der Karte) damit die Vorschau auf dem Handy gleich aussieht wie der Druck */
.gs{container-type:inline-size;margin:12px auto;position:relative;overflow:hidden;border-radius:10px;box-shadow:0 2px 10px rgba(0,0,0,.15);font-family:Georgia,"Times New Roman",serif;color:#1b1f24;-webkit-print-color-adjust:exact;print-color-adjust:exact}
.gs.a6{--u:calc(100cqw / 148);width:148mm;aspect-ratio:148/105;max-width:100%}
.gs.a5{--u:calc(100cqw / 210);width:210mm;aspect-ratio:210/148;max-width:100%}
.gs-in{position:absolute;inset:6mm;border:.6mm solid var(--gc,#1b2f66);border-radius:6px;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;padding:3mm 8mm 9mm;background:rgba(255,255,255,.88);z-index:2;overflow:hidden;box-sizing:border-box}
.gs-in>*{flex-shrink:0}
.gs-deko{position:absolute;inset:0;z-index:1}
.gs-deko svg{width:100%;height:100%;display:block}
.gs-logo{max-height:calc(18 * var(--u));max-width:calc(50 * var(--u));object-fit:contain;margin-bottom:2mm}
.gs-betrieb,.gs-titel,.gs-wert,.gs-leist,.gs-von,.gs-text{max-width:100%;overflow-wrap:anywhere;overflow:hidden;display:-webkit-box;-webkit-box-orient:vertical}
.gs-betrieb{font-size:calc(4.2 * var(--u));letter-spacing:.2mm;color:var(--gc,#1b2f66);font-weight:700;-webkit-line-clamp:2}
.gs-titel{font-size:calc(11 * var(--u));line-height:1.1;margin:2mm 0;color:var(--gc,#1b2f66);font-weight:700;-webkit-line-clamp:2}
.gs-wert{font-size:calc(8 * var(--u));font-weight:700;-webkit-line-clamp:2}
.gs-leist{font-size:calc(4.5 * var(--u));margin-top:1mm;-webkit-line-clamp:2}
.gs-von{font-size:calc(4 * var(--u));margin-top:2mm;font-style:italic;-webkit-line-clamp:1}
.gs-text{font-size:calc(3 * var(--u));margin-top:2mm;color:#444;-webkit-line-clamp:3}
.gs-fuss{position:absolute;left:8mm;right:8mm;bottom:3mm;display:flex;justify-content:space-between;gap:4mm;font-size:calc(3 * var(--u));color:#444;font-family:var(--schrift)}
.gs-fuss span{overflow-wrap:anywhere;min-width:0}
.gs.a5 .gs-betrieb{font-size:calc(5.5 * var(--u))}
.gs.a5 .gs-titel{font-size:calc(15 * var(--u))}
.gs.a5 .gs-wert{font-size:calc(11 * var(--u))}
.gs.a5 .gs-leist{font-size:calc(6 * var(--u))}
.gs.a5 .gs-von{font-size:calc(5 * var(--u))}
.gs.a5 .gs-text{font-size:calc(3.8 * var(--u))}
.gs.a5 .gs-fuss{font-size:calc(3.6 * var(--u));bottom:4mm}
.gs.a5 .gs-logo{max-height:calc(24 * var(--u));max-width:calc(65 * var(--u))}
.gs.neutral{--gc:#1b2f66;background:linear-gradient(135deg,#dbe7f5,#f4f8fd)}
.gs.warm{--gc:#8a4b12;background:linear-gradient(135deg,#f7e1c4,#fff6e8)}
.gs.weihnacht{--gc:#9b1c2c;background:linear-gradient(135deg,#d9ecdc,#f9f1e6)}
.gs.geschenk{--gc:#5b2a86;background:linear-gradient(135deg,#eadcf7,#fff4fb)}
@media print{
.gs{margin:0;box-shadow:none;border-radius:0}
.gs.a6{max-width:none}.gs.a5{max-width:none}
/* Seitenformat nur beim Druck des Gutscheins (benannte Seiten, wie @page zahlteil in qr.css). Der Name gilt für das ganze Dokument,
   damit keine leere Zusatzseite entsteht; andere Module (A4) bleiben unberührt, weil :has() nur bei sichtbarem Gutschein-Modul trifft. */
@page gs-a6{size:148mm 105mm;margin:0}
@page gs-a5{size:210mm 148mm;margin:0}
body:has(#v-gutschein.aktiv .gs.a6){page:gs-a6}
body:has(#v-gutschein.aktiv .gs.a5){page:gs-a5}
}

/* Zeilenaktionen im Register: auf dem Handy umbrechen statt über den Rand laufen */
@media (max-width:700px){.tabelle.karten td.aktionen{flex-wrap:wrap;justify-content:flex-end;gap:8px}}