/* Anmelde-Fenster (Betreiber-Entwurf daily-cashback 08.10.2026): Fenster ueber der Seite (#af-fenster.af-overlay), eigene Seite (#af-seite.af-seite) und eingebettet (#af-ein, B19 Gutschein-Ticket).
   Regeln mit Kennung (#af-...) als Bereich, damit Seitenregeln (z. B. .sbv-c7 .c7h p/a) nicht hineinwirken. Farben aus den Design-Tokens des Portals (--sb-*),
   Werte hinter dem Komma = Entwurf. Text auf Orange und orange Links mit dunklerem Ton (Kontrast >= 4.5:1). */
.af-overlay,.af-seite,.af-ein{
  --af-o:var(--sb-akzent,#e26a4c);
  --af-o-text:#b5553d; --af-o-text:color-mix(in srgb,var(--sb-akzent,#e26a4c) 80%,#000);
  --af-o-text-2:#9e4a35; --af-o-text-2:color-mix(in srgb,var(--sb-akzent,#e26a4c) 70%,#000);
  --af-o-ring:rgba(226,106,76,.16); --af-o-ring:color-mix(in srgb,var(--sb-akzent,#e26a4c) 16%,transparent);
  --af-creme:var(--sb-hintergrund,#f6f5f1); --af-card:var(--sb-karte,#fff);
  --af-ink:var(--sb-text,#20222b); --af-ink-2:var(--sb-text2,#5d6070); --af-ink-3:#6b6f7c; --af-icon:var(--sb-text3,#969aa6);
  --af-line:var(--sb-rand,#e7e5df); --af-line-2:var(--sb-rand2,#d7d4cc);
  --af-gruen:var(--sb-erfolg,#0e6b4a); --af-gruen-bg:var(--sb-erfolg-hell,#e8f4ee); --af-gruen-line:var(--sb-erfolg-rand,#bfe0d2);
  --af-rot:#a33a1f; --af-rot-bg:#fdeee8; --af-rot-line:#f3d3c4;
  --af-google:#1b1917;
}
:is(#af-fenster,#af-seite,#af-ein) :where(*){box-sizing:border-box;margin:0;min-width:0}
:is(#af-fenster,#af-seite,#af-ein) .af-modal{font:400 15.5px/1.55 Inter,ui-sans-serif,-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Arial,sans-serif;-webkit-font-smoothing:antialiased;color:var(--af-ink);text-align:left}
:is(#af-fenster,#af-seite,#af-ein) :where(h1,h2){font-family:inherit;font-weight:700;letter-spacing:-.03em;line-height:1.18;color:var(--af-ink);outline:0}
:is(#af-fenster,#af-seite,#af-ein) :where(p){font-size:inherit;line-height:inherit}
:is(#af-fenster,#af-seite,#af-ein) :where(a){color:inherit;text-decoration:none}
:is(#af-fenster,#af-seite,#af-ein) :where(button,input){font:inherit;color:inherit}
:is(#af-fenster,#af-seite,#af-ein) [hidden]{display:none!important}
:is(#af-fenster,#af-seite,#af-ein) .af-vh{position:absolute!important;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;border:0}

/* ---------- Overlay ---------- */
html.af-offen{overflow:hidden}
.af-overlay{position:fixed;inset:0;background:rgba(27,25,23,.5);-webkit-backdrop-filter:blur(3px);backdrop-filter:blur(3px);
  display:grid;place-items:center;padding:24px 16px;overflow:auto;overscroll-behavior:contain;z-index:10000}
.af-overlay[hidden]{display:none}
:is(#af-fenster,#af-seite,#af-ein) .af-modal{position:relative;width:100%;max-width:436px;background:var(--af-card);border-radius:22px;
  box-shadow:0 30px 70px rgba(27,25,23,.3);padding:30px 30px 26px}
:is(#af-fenster,#af-seite,#af-ein) .af-zu{position:absolute;top:14px;right:14px;width:34px;height:34px;border-radius:50%;border:0;padding:0;
  background:var(--af-creme);color:var(--af-ink-2);display:grid;place-items:center;cursor:pointer}
:is(#af-fenster,#af-seite,#af-ein) .af-zu:hover{background:#f0ebe4;color:var(--af-ink)}

/* ---------- eigene Seite (/konto/, /konto/registrieren/) ---------- */
.af-seite{background:var(--af-creme);padding:40px 16px 56px;display:grid;place-items:start center}
#af-seite .af-modal{box-shadow:0 18px 50px rgba(27,25,23,.12)}

/* ---------- Marke ---------- */
:is(#af-fenster,#af-seite,#af-ein) .af-marke{display:flex;align-items:center;justify-content:center;gap:9px;font-size:21px;font-weight:800;letter-spacing:-.045em}
:is(#af-fenster,#af-seite,#af-ein) .af-marke .af-m{width:30px;height:30px;border-radius:9px;background:var(--af-o);color:#fff;display:grid;place-items:center;font-size:15px;font-weight:800;letter-spacing:0}
:is(#af-fenster,#af-seite,#af-ein) .af-marke .af-b{color:var(--af-ink)}
:is(#af-fenster,#af-seite,#af-ein) .af-marke .af-o{color:var(--af-o)}

:is(#af-fenster,#af-seite,#af-ein) .af-kopf{text-align:center;margin:20px 0}
:is(#af-fenster,#af-seite,#af-ein) .af-kopf h1,:is(#af-fenster,#af-seite,#af-ein) .af-kopf h2{font-size:24px}
:is(#af-fenster,#af-seite,#af-ein) .af-kopf p{font-size:14.5px;color:var(--af-ink-2);margin-top:8px;line-height:1.5}

/* ---------- Meldungen ---------- */
:is(#af-fenster,#af-seite,#af-ein) .af-meldung{border-radius:12px;padding:11px 14px;margin:-6px 0 16px;font-size:14px;line-height:1.45;border:1px solid var(--af-rot-line);background:var(--af-rot-bg);color:var(--af-rot)}
:is(#af-fenster,#af-seite,#af-ein) .af-meldung.ok{border-color:var(--af-gruen-line);background:var(--af-gruen-bg);color:var(--af-gruen)}
:is(#af-fenster,#af-seite,#af-ein) .af-meldung:empty{display:none}
:is(#af-fenster,#af-seite,#af-ein) .af-meldung a,:is(#af-fenster,#af-seite,#af-ein) .af-meldung button{font-weight:700;text-decoration:underline;background:none;border:0;padding:0;cursor:pointer;color:inherit}

/* ---------- Google ---------- */
:is(#af-fenster,#af-seite,#af-ein) .af-google{display:flex;align-items:center;justify-content:center;gap:11px;width:100%;
  background:var(--af-google);color:#fff;border:0;border-radius:12px;padding:14px;font-size:15px;font-weight:700;cursor:pointer;line-height:1.55}
:is(#af-fenster,#af-seite,#af-ein) .af-google:hover{background:#000;color:#fff}
:is(#af-fenster,#af-seite,#af-ein) .af-google .af-g{width:26px;height:26px;border-radius:50%;background:#fff;display:grid;place-items:center;flex:none}

:is(#af-fenster,#af-seite,#af-ein) .af-oder{display:flex;align-items:center;gap:12px;margin:18px 0;font-size:11.5px;font-weight:700;letter-spacing:.11em;color:var(--af-ink-3)}
:is(#af-fenster,#af-seite,#af-ein) .af-oder::before,:is(#af-fenster,#af-seite,#af-ein) .af-oder::after{content:"";height:1px;background:var(--af-line);flex:1}

/* ---------- Felder ---------- */
:is(#af-fenster,#af-seite,#af-ein) .af-feld{display:flex;align-items:center;gap:11px;border:1.5px solid var(--af-line);border-radius:12px;
  padding:13px 15px;margin-bottom:11px;background:#fdfcfb;cursor:text}
:is(#af-fenster,#af-seite,#af-ein) .af-feld:focus-within{border-color:var(--af-o);background:#fff;box-shadow:0 0 0 3px var(--af-o-ring)}
:is(#af-fenster,#af-seite,#af-ein) .af-feld.af-falsch{border-color:var(--af-rot)}
:is(#af-fenster,#af-seite,#af-ein) .af-feld svg{color:var(--af-icon);flex:none}
:is(#af-fenster,#af-seite,#af-ein) .af-feld:focus-within svg{color:var(--af-o)}
:is(#af-fenster,#af-seite,#af-ein) .af-feld input{border:0;outline:0;background:none;flex:1;font-size:15px;width:100%;height:auto;min-height:0;padding:1px 2px;margin:0;line-height:1.55;border-radius:0;-webkit-appearance:none;appearance:none;box-shadow:none}
:is(#af-fenster,#af-seite,#af-ein) .af-feld input::placeholder{color:var(--af-ink-3);opacity:1}
:is(#af-fenster,#af-seite,#af-ein) .af-feld .af-aug{border:0;background:none;color:var(--af-icon);cursor:pointer;padding:0;display:grid;place-items:center;width:24px;height:24px;flex:none;border-radius:6px}
:is(#af-fenster,#af-seite,#af-ein) .af-feld .af-aug[aria-pressed="true"],:is(#af-fenster,#af-seite,#af-ein) .af-feld .af-aug[aria-pressed="true"] svg{color:var(--af-o-text)}
:is(#af-fenster,#af-seite,#af-ein) .af-feld .af-aug:focus-visible{outline:2px solid var(--af-o-text);outline-offset:2px}

/* ---------- Haken ---------- */
:is(#af-fenster,#af-seite,#af-ein) .af-haken{position:relative;display:flex;gap:11px;align-items:flex-start;margin:15px 0 13px;font-size:14px;color:var(--af-ink-2);line-height:1.45;cursor:pointer}
:is(#af-fenster,#af-seite,#af-ein) .af-haken.af-ohne{margin:0}
:is(#af-fenster,#af-seite,#af-ein) .af-box{width:20px;height:20px;border-radius:6px;border:1.5px solid var(--af-line-2);background:#fff;flex:none;display:grid;place-items:center;margin-top:1px}
:is(#af-fenster,#af-seite,#af-ein) .af-haken input{position:absolute;left:0;top:0;width:20px;height:20px;opacity:0;margin:0;cursor:pointer}
:is(#af-fenster,#af-seite,#af-ein) .af-haken input:checked + .af-box{background:var(--af-o);border-color:var(--af-o)}
:is(#af-fenster,#af-seite,#af-ein) .af-box svg{opacity:0}
:is(#af-fenster,#af-seite,#af-ein) .af-haken input:checked + .af-box svg{opacity:1}
:is(#af-fenster,#af-seite,#af-ein) .af-haken input:focus-visible + .af-box{outline:2px solid var(--af-o-text);outline-offset:2px}
:is(#af-fenster,#af-seite,#af-ein) .af-haken.af-falsch .af-box{border-color:var(--af-rot)}
:is(#af-fenster,#af-seite,#af-ein) .af-haken a{color:var(--af-o-text);font-weight:700}
:is(#af-fenster,#af-seite,#af-ein) .af-haken a:hover{text-decoration:underline}

/* reCAPTCHA v2 an der Stelle des Platzhalters "I'm not a robot" */
:is(#af-fenster,#af-seite,#af-ein) .af-robo{margin-bottom:13px;min-height:78px;overflow:hidden}
:is(#af-fenster,#af-seite,#af-ein) .af-robo:empty{display:none}
:is(#af-fenster,#af-seite,#af-ein) .af-robo>div{transform-origin:0 0}

/* ---------- Empfehlung ---------- */
:is(#af-fenster,#af-seite,#af-ein) .af-refz{border:1px dashed var(--af-line-2);border-radius:12px;background:#fdfcfb;margin-bottom:16px}
:is(#af-fenster,#af-seite,#af-ein) .af-refz summary{list-style:none;cursor:pointer;display:flex;align-items:center;gap:10px;padding:12px 15px;font-size:14px;color:var(--af-ink-2);border-radius:12px}
:is(#af-fenster,#af-seite,#af-ein) .af-refz summary::-webkit-details-marker{display:none}
:is(#af-fenster,#af-seite,#af-ein) .af-refz summary:hover{color:var(--af-ink)}
:is(#af-fenster,#af-seite,#af-ein) .af-refz summary:focus-visible{outline:2px solid var(--af-o-text);outline-offset:2px}
:is(#af-fenster,#af-seite,#af-ein) .af-refz summary .af-ch{margin-left:auto;color:var(--af-icon);transition:transform .15s;display:grid}
:is(#af-fenster,#af-seite,#af-ein) .af-refz[open] summary .af-ch{transform:rotate(180deg)}
:is(#af-fenster,#af-seite,#af-ein) .af-refz .af-inner{padding:0 15px 14px}
:is(#af-fenster,#af-seite,#af-ein) .af-refz input{width:100%;border:1.5px solid var(--af-line);border-radius:10px;padding:11px 13px;font-size:14.5px;background:#fff;letter-spacing:.06em;font-weight:700}
:is(#af-fenster,#af-seite,#af-ein) .af-refz input::placeholder{color:var(--af-ink-3);opacity:1;font-weight:400;letter-spacing:0}
:is(#af-fenster,#af-seite,#af-ein) .af-refz input:focus{outline:0;border-color:var(--af-o);box-shadow:0 0 0 3px var(--af-o-ring)}

/* ---------- Knopf ---------- */
:is(#af-fenster,#af-seite,#af-ein) .af-join{width:100%;background:var(--af-o-text);color:#fff;border:0;border-radius:12px;padding:16px;font-size:16px;font-weight:800;line-height:1.55;
  cursor:pointer;display:flex;align-items:center;justify-content:center;gap:9px}
:is(#af-fenster,#af-seite,#af-ein) .af-join:hover{background:var(--af-o-text-2)}
:is(#af-fenster,#af-seite,#af-ein) .af-join:disabled{opacity:.7;cursor:progress}
:is(#af-fenster,#af-seite,#af-ein) .af-join:focus-visible,:is(#af-fenster,#af-seite,#af-ein) .af-google:focus-visible,:is(#af-fenster,#af-seite,#af-ein) .af-zu:focus-visible,:is(#af-fenster,#af-seite,#af-ein) .af-vz.af-leise:focus-visible{outline:3px solid var(--af-o-text);outline-offset:2px}
:is(#af-fenster,#af-seite,#af-ein) .af-login{text-align:center;margin-top:15px;font-size:14.5px;color:var(--af-ink-2)}
:is(#af-fenster,#af-seite,#af-ein) .af-login a{color:var(--af-o-text);font-weight:700}
:is(#af-fenster,#af-seite,#af-ein) .af-login a:hover{text-decoration:underline}
:is(#af-fenster,#af-seite,#af-ein) .af-abstand{margin-top:16px}

:is(#af-fenster,#af-seite,#af-ein) .af-zeile{display:flex;align-items:center;gap:12px;flex-wrap:wrap;margin-top:4px}
:is(#af-fenster,#af-seite,#af-ein) .af-zeile .af-vergessen{margin-left:auto;font-size:14px;font-weight:700;color:var(--af-o-text)}
:is(#af-fenster,#af-seite,#af-ein) .af-zeile .af-vergessen:hover{text-decoration:underline}

/* ---------- Vertrauen ---------- */
:is(#af-fenster,#af-seite,#af-ein) .af-vert{display:flex;gap:7px;justify-content:center;flex-wrap:wrap;margin-top:18px;padding-top:16px;border-top:1px solid var(--af-line)}
:is(#af-fenster,#af-seite,#af-ein) .af-vz{display:inline-flex;align-items:center;gap:6px;font-size:12.5px;font-weight:600;color:var(--af-ink-2);background:var(--af-creme);border-radius:100px;padding:6px 12px;line-height:1.55}
:is(#af-fenster,#af-seite,#af-ein) .af-vz svg{color:var(--af-gruen);flex:none}
:is(#af-fenster,#af-seite,#af-ein) .af-vz.af-leise{border:0;cursor:pointer;font-family:inherit}
:is(#af-fenster,#af-seite,#af-ein) .af-vz.af-leise svg{color:var(--af-icon)}
:is(#af-fenster,#af-seite,#af-ein) .af-vz.af-leise:hover,:is(#af-fenster,#af-seite,#af-ein) .af-vz.af-leise:hover svg{color:var(--af-o-text)}

@media(max-width:460px){
  .af-overlay{padding:14px 12px;place-items:start center}
  :is(#af-fenster,#af-seite,#af-ein) .af-modal{padding:26px 20px 22px;border-radius:18px}
  :is(#af-fenster,#af-seite,#af-ein) .af-kopf h1,:is(#af-fenster,#af-seite,#af-ein) .af-kopf h2{font-size:21px}
  .af-seite{padding:14px 12px 32px}
}
@media(prefers-reduced-motion:reduce){:is(#af-fenster,#af-seite,#af-ein) .af-refz summary .af-ch{transition:none}}

/* ---------- eingebettet (#af-ein, z. B. Registrieren-Block des Gutschein-Tickets): ohne Kasten, Marke und Schliessen ---------- */
#af-ein .af-modal{max-width:none;background:none;border-radius:0;box-shadow:none;padding:0}
#af-ein .af-kopf{margin:0 0 18px}
#af-ein .af-ansicht{padding:0;margin:0}
@media(max-width:460px){#af-ein .af-modal{padding:0;border-radius:0}}