/* Geschenkgutschein-Shop (/geschenkgutschein): Betrags-Kacheln, Schritte, Bedingungen. Formularfelder erbt die Seite von pages.css. */
.gs-form .gs-amounts{border:0;padding:0;margin:0 0 14px;min-inline-size:0}
.gs-form .gs-amounts legend{font-weight:800;font-size:calc(13.5px * var(--font-scale,1));padding:0;margin-block-end:8px}
.gs-tiles{display:grid;grid-template-columns:repeat(auto-fit,minmax(110px,1fr));gap:10px}
.gs-tile{position:relative;display:block;cursor:pointer}
.gs-tile input{position:absolute;opacity:0;inset:0;inline-size:100%;block-size:100%;margin:0;cursor:pointer}
.gs-tile span{display:flex;align-items:center;justify-content:center;min-block-size:56px;padding:10px 12px;border-radius:14px;border:2px solid var(--home-line-strong);background:var(--field-bg,rgba(var(--home-tint,3,20,36),.55));font-weight:800;font-size:calc(20px * var(--font-scale,1));text-align:center;transition:border-color .15s,background .15s,transform .15s}
.gs-tile-custom span{font-size:calc(15px * var(--font-scale,1))}
.gs-tile input:checked + span{border-color:var(--brand-accent);background:color-mix(in srgb,var(--brand-accent) 16%,transparent);transform:translateY(-1px)}
.gs-tile input:focus-visible + span{outline:2px solid var(--brand-accent);outline-offset:2px}
.gs-custom{margin-block-start:12px;max-inline-size:260px}
.gs-custom label{display:block;font-weight:700;font-size:calc(13px * var(--font-scale,1));margin-block-end:4px}
.gs-custom input{inline-size:100%;padding-block:10px;padding-inline:14px;border-radius:12px;border:1px solid var(--home-line-strong);background:var(--field-bg,rgba(var(--home-tint,3,20,36),.55));color:var(--home-text);font:inherit;font-size:16px}
.gs-custom input:focus{outline:2px solid var(--brand-accent);outline-offset:1px;border-color:transparent}
.gs-optional{font-weight:400;color:var(--home-muted);font-size:calc(12.5px * var(--font-scale,1))}
.gs-steps{margin:0 0 14px;padding-inline-start:1.2em;display:grid;gap:8px}
.gs-secure{color:var(--home-muted);font-size:calc(13.5px * var(--font-scale,1));margin:0}
.gs-terms{margin-block-start:22px}
.gs-terms h2{margin-block-start:0}
.gs-terms h3{margin-block-start:16px}
.gs-terms p{color:var(--home-muted)}
.gs-result{max-inline-size:640px;margin-inline:auto}
.gs-form button[disabled]{opacity:.6;cursor:wait}
@media (prefers-reduced-motion:reduce){.gs-tile span{transition:none}}

/* Design-Auswahl und Vorschau-Karte. Farben spiegeln fs_gift_designs() in inc/giftcards.php (PDF). */
.gcard,.gs-design{--bg:#03141f;--fg:#fff;--sub:#d1e0f2;--acc:#ffb35c;--bar:#ff8c00;--box:#f4f7fb;--boxink:#0a1c2b;--boxmuted:#5c6b80}
.d-fuehrerschein{--bg:#03141f}
.d-geburtstag{--bg:#3d1266;--sub:#e6d6fa;--acc:#ffcc4d;--bar:#ff5a8c;--box:#fdf8ff;--boxink:#3d1266;--boxmuted:#73618c}
.d-weihnachten{--bg:#0a3326;--sub:#d6ede0;--acc:#f7cc61;--bar:#cc1f26;--box:#faf7ee;--boxink:#0a3326;--boxmuted:#617a6b}
.d-ostern{--bg:#fcf5d6;--fg:#0a1c2b;--sub:#4d5c6b;--acc:#b35400;--bar:#8cc773;--box:#fff;--boxink:#0a1c2b;--boxmuted:#5c6b80}
.d-karte{--bg:#d1e6fa;--fg:#0a1c2b;--sub:#40526b;--acc:#0f3d85;--bar:#0f3d85;--box:#fff;--boxink:#0a1c2b;--boxmuted:#5c6b80}
.gs-form .gs-designs{border:0;padding:0;margin:0 0 14px;min-inline-size:0}
.gs-form .gs-designs legend{font-weight:800;font-size:calc(13.5px * var(--font-scale,1));padding:0;margin-block-end:8px}
.gs-design-tiles{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px;margin-block-end:14px}
.gs-design{position:relative;display:block;cursor:pointer}
.gs-design input{position:absolute;opacity:0;inset:0;inline-size:100%;block-size:100%;margin:0;cursor:pointer}
.gs-design .gs-swatch{display:block;block-size:34px;border-radius:10px 10px 0 0;background:var(--bg);border:2px solid var(--home-line-strong);border-block-end:0;border-inline-start:8px solid var(--bar)}
.gs-design .gs-dname{display:flex;align-items:center;justify-content:center;min-block-size:36px;padding:4px 6px;border:2px solid var(--home-line-strong);border-block-start:0;border-radius:0 0 10px 10px;font-weight:700;font-size:calc(12.5px * var(--font-scale,1));text-align:center;line-height:1.2;background:var(--field-bg,rgba(var(--home-tint,3,20,36),.55))}
.gs-design input:checked ~ .gs-swatch,.gs-design input:checked ~ .gs-dname{border-color:var(--brand-accent)}
.gs-design input:checked ~ .gs-dname{background:color-mix(in srgb,var(--brand-accent) 16%,transparent)}
.gs-design input:focus-visible ~ .gs-dname{outline:2px solid var(--brand-accent);outline-offset:2px}
.gcard{position:relative;overflow:hidden;border-radius:16px;background:var(--bg);color:var(--fg);border-inline-start:8px solid var(--bar);box-shadow:0 10px 30px rgba(0,0,0,.35);max-inline-size:520px;margin-inline:auto;margin-block-end:8px;text-align:start}
.gc-photo{display:none;block-size:170px;background:#0a1c2b url(/assets/uploads/fahrzeuge/auto1.jpg) center 60%/cover no-repeat}
.d-fuehrerschein .gc-photo{display:block}
.gc-deco{position:absolute;inset-block-start:0;inset-inline-end:0;inline-size:52%;block-size:104px;pointer-events:none}
.d-fuehrerschein .gc-deco{inset-block-start:170px}
.d-geburtstag .gc-deco{background-image:radial-gradient(circle 3px at 12% 18%,#ff5a8c 98%,transparent),radial-gradient(circle 2.5px at 30% 52%,#ffcc4d 98%,transparent),radial-gradient(circle 3px at 48% 14%,#4dd1f2 98%,transparent),radial-gradient(circle 2px at 62% 70%,#ff8c00 98%,transparent),radial-gradient(circle 3px at 78% 30%,#8c73f2 98%,transparent),radial-gradient(circle 2.5px at 90% 62%,#ff5a8c 98%,transparent),radial-gradient(circle 2px at 20% 86%,#4dd1f2 98%,transparent),radial-gradient(circle 3px at 70% 8%,#ffcc4d 98%,transparent),radial-gradient(circle 2px at 40% 90%,#f5f5ff 98%,transparent),radial-gradient(circle 2.5px at 94% 12%,#ff8c00 98%,transparent)}
.d-weihnachten .gc-deco{background-image:radial-gradient(circle 2px at 10% 20%,#cde6d6 98%,transparent),radial-gradient(circle 3px at 28% 56%,#f7faf8 98%,transparent),radial-gradient(circle 1.5px at 46% 16%,#cde6d6 98%,transparent),radial-gradient(circle 2.5px at 64% 72%,#f7faf8 98%,transparent),radial-gradient(circle 2px at 80% 34%,#cde6d6 98%,transparent),radial-gradient(circle 3.5px at 92% 60%,#f7faf8 98%,transparent),radial-gradient(circle 2px at 20% 88%,#cde6d6 98%,transparent),radial-gradient(circle 2.5px at 72% 10%,#f7faf8 98%,transparent),radial-gradient(circle 9px at 88% 28%,#f7cc61 98%,transparent)}
.d-ostern .gc-deco{background-image:radial-gradient(ellipse 14px 19px at 62% 52%,#f7a8c4 98%,transparent),radial-gradient(ellipse 14px 19px at 80% 40%,#99d699 98%,transparent),radial-gradient(ellipse 14px 19px at 96% 54%,#8cc7f2 98%,transparent),radial-gradient(circle 3px at 20% 30%,#f7a8c4 98%,transparent),radial-gradient(circle 3px at 36% 78%,#ffd166 98%,transparent),radial-gradient(circle 2.5px at 48% 22%,#99d699 98%,transparent)}
.gc-body{position:relative;padding:18px 22px 16px}
.gc-top{display:flex;justify-content:space-between;gap:10px;align-items:baseline;margin-block-end:8px}
.gc-title{font-weight:800;font-size:calc(11.5px * var(--font-scale,1));letter-spacing:.06em;color:var(--acc)}
.gc-brand{font-weight:700;font-size:calc(11px * var(--font-scale,1));color:var(--sub);white-space:nowrap}
.gc-f small,.gc-id{display:none}
.gc-f-valid{display:none}
.gc-amount{display:block;font-size:calc(40px * var(--font-scale,1));line-height:1.1;font-weight:800;color:var(--fg)}
.gc-for{display:block;font-size:calc(15px * var(--font-scale,1));font-weight:800;margin-block-start:2px;overflow-wrap:anywhere}
.gc-for::before{content:attr(data-pre)}
.gc-f-for{order:2}
.gc-f-amount{order:1}
.gc-fields{display:flex;flex-direction:column}
.gc-f-for:has(.gc-for:empty){display:none}
.gc-msg{margin:8px 0 0;color:var(--sub);font-size:calc(13px * var(--font-scale,1));line-height:1.45;overflow-wrap:anywhere;white-space:pre-line}
.gc-msg:empty{display:none}
.gc-code{margin-block-start:14px;background:var(--box);color:var(--boxink);border-radius:8px;padding:8px 12px}
.gc-code small{display:block;font-size:calc(10px * var(--font-scale,1));color:var(--boxmuted)}
.gc-code b{font-size:calc(19px * var(--font-scale,1));letter-spacing:.03em}
.gc-foot{display:flex;justify-content:space-between;gap:8px;flex-wrap:wrap;margin-block-start:10px;font-size:calc(12px * var(--font-scale,1));font-weight:700}
.gc-valid{color:var(--acc)}
.gc-team{color:var(--sub)}
/* Führerschein-Karte */
.d-karte .gc-main{display:flex;gap:14px;margin-block-start:4px}
.d-karte .gc-id{display:grid;place-items:center;flex:0 0 74px;block-size:92px;background:#fff;border-radius:4px}
.d-karte .gc-id i{display:grid;place-items:center;inline-size:28px;block-size:28px;background:#ff8c00;color:#1a1200;font-style:normal;font-weight:800}
.d-karte .gc-fields{flex:1;min-inline-size:0;gap:6px}
.d-karte .gc-f small{display:block;font-size:calc(10px * var(--font-scale,1));color:var(--sub)}
.d-karte .gc-f-for{order:1}
.d-karte .gc-f-amount{order:2}
.d-karte .gc-f-valid{display:block;order:3}
.d-karte .gc-f-for:has(.gc-for:empty){display:block}
.d-karte .gc-for::before{content:none}
.d-karte .gc-for:empty::after{content:'–'}
.d-karte .gc-amount{font-size:calc(24px * var(--font-scale,1));color:var(--acc)}
.d-karte .gc-f-valid b{font-size:calc(13px * var(--font-scale,1))}
.d-karte .gc-valid{display:none}
@media (max-width:480px){.gc-amount{font-size:calc(34px * var(--font-scale,1))}.gc-top{flex-direction:column;gap:2px}}
