/* RKBV e.V. – Bestellsystem Balık Festivali
   Farben aus dem Vereinslogo: Blau + Gold, Flächen in warmem Beige */

@font-face{font-family:"Figtree";font-weight:400;font-display:swap;src:url(fonts/figtree-400-latin.woff2) format("woff2");unicode-range:U+0000-00FF,U+2000-206F,U+20AC,U+2190-21FF,U+2212,U+00D7}
@font-face{font-family:"Figtree";font-weight:400;font-display:swap;src:url(fonts/figtree-400-latin-ext.woff2) format("woff2");unicode-range:U+0100-02AF,U+1E00-1EFF}
@font-face{font-family:"Figtree";font-weight:600;font-display:swap;src:url(fonts/figtree-600-latin.woff2) format("woff2");unicode-range:U+0000-00FF,U+2000-206F,U+20AC,U+2190-21FF,U+2212,U+00D7}
@font-face{font-family:"Figtree";font-weight:600;font-display:swap;src:url(fonts/figtree-600-latin-ext.woff2) format("woff2");unicode-range:U+0100-02AF,U+1E00-1EFF}
@font-face{font-family:"Literata";font-weight:600;font-display:swap;src:url(fonts/literata-600-latin.woff2) format("woff2");unicode-range:U+0000-00FF,U+2000-206F,U+20AC}
@font-face{font-family:"Literata";font-weight:600;font-display:swap;src:url(fonts/literata-600-latin-ext.woff2) format("woff2");unicode-range:U+0100-02AF,U+1E00-1EFF}

:root{
  --bg:oklch(0.965 0.012 75);
  --sand:oklch(0.92 0.025 75);
  --sand-tief:oklch(0.85 0.04 70);
  --weiss:oklch(0.995 0.004 80);
  --ink:oklch(0.25 0.03 262);
  --ink-leise:oklch(0.47 0.03 262);
  --blau:oklch(0.36 0.11 262);
  --blau-tief:oklch(0.29 0.10 262);
  --nacht:oklch(0.21 0.055 262);
  --nacht-2:oklch(0.27 0.06 262);
  --blau-hell:oklch(0.93 0.025 262);
  --gold:oklch(0.80 0.16 80);
  --gold-hell:oklch(0.95 0.05 85);
  --gold-tief:oklch(0.45 0.10 75);
  --rosa:oklch(0.60 0.15 0);
  --rosa-hell:oklch(0.95 0.03 0);
  --rosa-tief:oklch(0.33 0.09 0);
  --gruen:oklch(0.50 0.12 150);
  --gruen-hell:oklch(0.94 0.04 150);
  --rot:oklch(0.53 0.17 25);
  --linie:oklch(0.83 0.03 70);
  --font:"Figtree",system-ui,-apple-system,"Segoe UI",sans-serif;
  --font-titel:"Literata",Georgia,serif;
  --r:10px;
}
*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{margin:0;background:var(--bg);color:var(--ink);font-family:var(--font);font-size:17px;line-height:1.45}
h1,h2,h3{font-family:var(--font-titel);font-weight:600;line-height:1.15;margin:0;color:var(--blau-tief)}
button,input,select{font:inherit;color:inherit}
button{cursor:pointer;border:0;border-radius:8px;background:none}
input,select{padding:10px 12px;border:1px solid var(--linie);border-radius:8px;background:var(--weiss);min-width:0}
input:focus,select:focus{outline:none;border-color:var(--blau);box-shadow:0 0 0 3px var(--blau-hell)}
:focus-visible{outline:3px solid var(--gold);outline-offset:2px}
a{color:var(--blau)}
img{max-width:100%}
.zahl{font-variant-numeric:tabular-nums}

/* ---------- Knöpfe ---------- */
.knopf{display:inline-flex;align-items:center;justify-content:center;gap:8px;padding:12px 18px;font-weight:600;border-radius:9px;text-decoration:none;transition:background .15s}
.knopf.haupt{background:var(--blau);color:#fff}
.knopf.haupt:hover{background:var(--blau-tief)}
.knopf.haupt[disabled]{background:var(--sand-tief);color:var(--ink-leise);cursor:not-allowed}
.knopf.gold{background:var(--gold);color:var(--blau-tief)}
.knopf.leise{background:var(--sand);color:var(--blau-tief)}
.knopf.leise:hover{background:var(--sand-tief)}
.knopf.gruen{background:var(--gruen);color:#fff}
.knopf.gefahr{background:transparent;color:var(--rot);padding:8px 10px}
.knopf.voll{width:100%}
.knopf.gross{padding:17px 20px;font-size:19px}

/* ---------- Kopfzeile ---------- */
.kopf{background:var(--blau-tief);color:#fff;display:flex;align-items:center;gap:14px;padding:10px 18px;min-height:60px;position:sticky;top:0;z-index:20}
.kopf .logo{height:36px;width:auto;display:block}
.kopf h1{color:#fff;font-size:20px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.kopf .trenner{width:1px;align-self:stretch;background:rgba(255,255,255,.18);margin:4px 0}
.kopf .rechts{margin-left:auto;display:flex;align-items:center;gap:10px;font-size:15px}
.kopf a,.kopf .kopf-knopf{color:#fff;text-decoration:none;background:rgba(255,255,255,.1);padding:8px 12px;border-radius:8px;font-weight:600;font-size:15px;white-space:nowrap}
.kopf a:hover,.kopf .kopf-knopf:hover{background:rgba(255,255,255,.2)}
.kopf .zurueck{font-size:22px;line-height:1;padding:6px 12px}
.kopf .uhr{opacity:.8;font-variant-numeric:tabular-nums}
.kopf .goldstrich,.goldstrich{height:4px;background:var(--gold)}
body.frauen .kopf{background:var(--rosa-tief)}
.badge{display:inline-grid;place-items:center;min-width:24px;height:24px;padding:0 7px;border-radius:12px;background:var(--gold);color:var(--blau-tief);font-size:14px;font-weight:600}
.badge.rot{background:var(--rot);color:#fff}

/* ---------- Login ---------- */
body.login{min-height:100vh;display:grid;place-items:center;background:var(--blau-tief);padding:16px}
.loginbox{background:var(--weiss);padding:28px;border-radius:14px;width:min(360px,100%);display:grid;gap:12px;box-shadow:0 20px 50px rgba(0,0,30,.35)}
.login-logo{width:190px;margin:0 auto 6px;display:block}
.loginbox h1{font-size:22px;text-align:center}
.loginbox label{font-size:15px;color:var(--ink-leise)}
.loginbox input{font-size:28px;text-align:center;letter-spacing:8px;padding:12px}
.fehler{color:var(--rot);margin:0;font-size:15px}
.zurueck-login{text-align:center;font-size:15px;margin-top:2px}

/* ---------- Übersicht ---------- */
.seite{max-width:960px;margin:0 auto;padding:24px 16px 48px}
.hero{display:flex;align-items:center;gap:20px;padding:26px 0 8px}
.hero img{height:64px}
.hero h1{font-size:30px}
.hero p{margin:4px 0 0;color:var(--ink-leise)}
.bereich-titel{font-size:19px;margin:30px 0 10px;display:flex;align-items:center;gap:10px}
.bereich-titel::after{content:"";flex:1;height:1px;background:var(--linie)}
.links{display:grid;grid-template-columns:repeat(auto-fill,minmax(210px,1fr));gap:10px}
.link-karte{background:var(--weiss);border:1px solid var(--linie);border-left:5px solid var(--blau);border-radius:var(--r);padding:13px 15px;text-decoration:none;color:var(--ink);display:flex;flex-direction:column;gap:2px}
.link-karte b{font-size:17px;color:var(--blau-tief)}
.link-karte small{color:var(--ink-leise);font-size:14px}
.link-karte.f{border-left-color:var(--rosa)}
.link-karte.gold{border-left-color:var(--gold)}
.link-karte .doppel{display:flex;gap:12px;margin-top:4px}
.link-karte .doppel a{font-size:15px;font-weight:600}
a.link-karte:hover{border-color:var(--blau)}

/* ---------- Kasse ---------- */
.kasse{display:grid;grid-template-columns:1fr 390px;height:calc(100vh - 64px)}
.produkte{overflow:auto;padding:16px 18px 40px}
.gruppe{margin-bottom:16px}
.gruppe h2{font-family:var(--font);font-size:14px;font-weight:600;color:var(--ink-leise);margin:4px 0 8px;display:flex;align-items:center;gap:8px}
.gruppe h2 .art{font-size:12px;padding:2px 8px;border-radius:10px;background:var(--sand);color:var(--ink-leise);font-weight:600}
.gruppe h2 .art.warte{background:var(--blau-hell);color:var(--blau)}
.kacheln{display:grid;grid-template-columns:repeat(auto-fill,minmax(155px,1fr));gap:10px}
.kachel{position:relative;background:var(--weiss);border:1px solid var(--linie);border-radius:var(--r);padding:12px 12px 11px;min-height:84px;text-align:left;display:flex;flex-direction:column;justify-content:space-between;gap:6px;transition:border-color .12s, transform .06s}
.kachel:hover{border-color:var(--blau)}
.kachel:active{transform:scale(.98)}
.kachel b{font-weight:600;font-size:16px;line-height:1.2;color:var(--ink)}
.kachel .preis{font-size:15px;color:var(--blau);font-weight:600}
.kachel .info{font-size:12.5px;color:var(--ink-leise)}
.kachel .im{position:absolute;top:-8px;right:-8px;min-width:28px;height:28px;border-radius:14px;background:var(--blau);color:#fff;display:grid;place-items:center;font-weight:600;font-size:15px;box-shadow:0 2px 6px rgba(0,0,40,.25)}
.kachel.rueber{border-color:var(--rosa);background:var(--rosa-hell)}
.kachel[disabled]{opacity:.4;cursor:not-allowed}
.korb{background:var(--weiss);border-left:1px solid var(--linie);display:flex;flex-direction:column;min-height:0}
.korb-kopf{padding:14px 16px;border-bottom:1px solid var(--linie);display:flex;align-items:center;gap:8px}
.korb-kopf h2{font-size:19px}
.vb-hinweis{margin:10px 16px 0;padding:9px 12px;border-radius:8px;background:var(--gold-hell);border:1px solid var(--gold);font-size:14.5px;display:flex;align-items:center;gap:8px}
.vb-hinweis button{margin-left:auto;font-size:20px;line-height:1;color:var(--ink-leise)}
.korbliste{flex:1;overflow:auto;padding:4px 16px}
.posten{border-bottom:1px dashed var(--linie);padding:8px 0}
.posten-zeile{display:flex;align-items:center;gap:8px}
.posten-zeile .n{flex:1;font-weight:600;font-size:15.5px;line-height:1.2}
.posten-zeile .p{color:var(--ink-leise);font-size:14.5px;min-width:66px;text-align:right}
.menge{display:flex;align-items:center;gap:2px;background:var(--sand);border-radius:9px;padding:2px}
.menge button{width:36px;height:36px;font-size:22px;color:var(--blau-tief);border-radius:7px}
.menge button:hover{background:var(--sand-tief)}
.menge span{min-width:26px;text-align:center;font-weight:600;font-size:17px}
.hinweis-feld{width:100%;margin-top:5px;font-size:14.5px;padding:7px 10px;background:var(--gold-hell);border-color:oklch(0.86 0.07 85)}
.leer{color:var(--ink-leise);padding:24px 0;text-align:center;font-size:15px}
.korb-fuss{padding:12px 16px 14px;border-top:1px solid var(--linie);display:grid;gap:9px;background:var(--bg)}
.summe{display:flex;justify-content:space-between;align-items:baseline}
.summe b{font-family:var(--font-titel);font-size:28px;color:var(--blau-tief)}
.bon-info{font-size:13.5px;color:var(--ink-leise)}
@media (max-width:860px){.kasse{grid-template-columns:1fr;height:auto}.korb{border-left:0;border-top:1px solid var(--linie)}}

/* ---------- Overlays ---------- */
.overlay{position:fixed;inset:0;background:rgba(15,20,50,.6);display:none;z-index:50;padding:16px}
.overlay.an{display:grid;place-items:center}
.dialog{background:var(--weiss);border-radius:14px;padding:26px 30px;text-align:center;max-width:440px;width:100%}
.dialog .gross-nr{font-family:var(--font-titel);font-size:92px;line-height:1;color:var(--blau-tief);margin:6px 0}
.dialog p{margin:6px 0}
.panel{background:var(--weiss);border-radius:14px;width:min(640px,100%);max-height:86vh;display:flex;flex-direction:column;overflow:hidden}
.panel-kopf{display:flex;align-items:center;gap:10px;padding:16px 18px;border-bottom:1px solid var(--linie)}
.panel-kopf h2{font-size:20px}
.panel-kopf input{margin-left:auto;width:170px}
.panel-inhalt{overflow:auto;padding:10px 18px 18px;display:grid;gap:10px}
.vb{border:1px solid var(--linie);border-radius:var(--r);padding:12px 14px;display:grid;gap:6px;background:var(--bg)}
.vb-oben{display:flex;align-items:baseline;gap:10px}
.vb-oben .vnr{font-family:var(--font-titel);font-size:24px;color:var(--blau-tief)}
.vb-oben .vname{font-weight:600;font-size:17px}
.vb-oben .vzeit{margin-left:auto;color:var(--ink-leise);font-size:14px}
.vb ul{margin:0;padding-left:18px;font-size:15px}
.vb-unten{display:flex;align-items:center;gap:8px}
.vb-unten b{margin-right:auto;font-size:17px}
.toast{position:fixed;bottom:18px;left:50%;transform:translateX(-50%);background:var(--rot);color:#fff;padding:12px 18px;border-radius:10px;display:none;z-index:60;font-weight:600;max-width:calc(100% - 32px)}
.toast.an{display:block}
.toast.ok{background:var(--gruen)}

/* ---------- Stand / Läufer (dunkel) ---------- */
body.dunkel{background:var(--nacht);color:#fff}
body.dunkel .kopf{background:var(--blau-tief)}
body.dunkel.frauen .kopf{background:var(--rosa-tief)}
.reiter{display:flex;gap:6px;padding:8px 10px;background:var(--nacht);position:sticky;top:60px;z-index:15}
.reiter button{flex:1;background:var(--nacht-2);color:#cdd6ea;padding:11px 4px;font-size:15.5px;font-weight:600;display:flex;align-items:center;justify-content:center;gap:6px}
.reiter button .badge{background:rgba(255,255,255,.15);color:#fff}
.reiter button.an{background:var(--weiss);color:var(--blau-tief)}
.reiter button.an .badge{background:var(--rot);color:#fff}
.liste{display:grid;grid-template-columns:repeat(auto-fill,minmax(300px,1fr));gap:8px;padding:8px 10px 40px;align-content:start}
.leerstand{color:#8e9bbb;font-size:18px;padding:30px 4px;grid-column:1/-1}
.tk{background:var(--weiss);color:var(--ink);border-radius:9px;border-left:7px solid var(--rot);padding:8px 8px 8px 12px;display:flex;gap:10px;align-items:stretch}
.tk.fertig{border-left-color:var(--gruen)}
.tk.erledigt{border-left-color:#9aa5bd;opacity:.75}
.tk.rosa{background:var(--rosa-hell);border-left-color:var(--rosa)}
.tk.rosa.fertig{border-left-color:var(--gruen)}
.tk.alt{box-shadow:0 0 0 3px var(--gold)}
.tk-inhalt{flex:1;min-width:0;display:flex;flex-direction:column;gap:2px}
.tk-oben{display:flex;align-items:baseline;gap:8px}
.tk-nr{font-family:var(--font-titel);font-size:26px;line-height:1;color:var(--blau-tief);font-variant-numeric:tabular-nums}
.tk-name{flex:1;font-weight:600;color:var(--ink-leise);font-size:14.5px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.tk-zeit{font-size:13px;color:var(--ink-leise);white-space:nowrap}
.tk-produkt{font-size:18px;font-weight:600;line-height:1.25}
.tk-notiz{align-self:flex-start;font-size:14px;font-weight:600;color:var(--gold-tief);background:var(--gold-hell);padding:1px 7px;border-radius:5px}
.tk-fuer{align-self:flex-start;font-size:11.5px;font-weight:600;color:#fff;background:var(--rosa);padding:1px 6px;border-radius:4px}
.tk-knoepfe{display:flex;flex-direction:column;gap:5px;width:104px}
.tk-knoepfe button{flex:1;min-height:46px;font-weight:600;font-size:15.5px;padding:6px}
.tk-knoepfe .b-fertig{background:var(--gruen);color:#fff}
.tk-knoepfe .b-ab{background:var(--blau);color:#fff}
.tk-knoepfe .b-zurueck{background:var(--sand);color:var(--blau-tief);flex:0 0 auto;min-height:34px;font-size:13.5px}
.tk-knoepfe .b-zurueck.breit{flex:1;font-size:14.5px}

/* Monitor-Ansicht (nur anzeigen) */
.spalten{display:grid;grid-template-columns:2fr 1fr;gap:16px;padding:14px}
.spalte h2{color:#b9c4de;font-family:var(--font);font-size:18px;font-weight:600;margin:0 0 10px}
.karten{display:grid;grid-template-columns:repeat(auto-fill,minmax(230px,1fr));gap:10px;align-content:start}
body.monitor .tk{padding:12px 14px;border-left-width:9px}
body.monitor .tk-nr{font-size:46px}
body.monitor .tk-name{font-size:19px}
body.monitor .tk-produkt{font-size:24px}
body.monitor .tk-notiz{font-size:18px}
@media (max-width:860px){.spalten{grid-template-columns:1fr}}

/* ---------- Gäste-Seiten: Abholung + Wartezeit ---------- */
body.gast-monitor{background:var(--nacht);color:#fff;min-height:100vh}
.gm-kopf{display:flex;align-items:center;gap:20px;padding:20px 28px 16px;border-bottom:4px solid var(--gold)}
.gm-kopf img{height:52px}
.gm-kopf h1{color:#fff;font-size:34px}
.gm-kopf p{margin:2px 0 0;color:#b9c4de;font-size:18px}
.gm-kopf .uhr{margin-left:auto;font-size:28px;font-weight:600;font-variant-numeric:tabular-nums}
.nummern{display:grid;grid-template-columns:repeat(auto-fill,minmax(200px,1fr));gap:14px;padding:22px 28px}
.nummer{background:var(--weiss);color:var(--blau-tief);border-radius:12px;text-align:center;padding:14px 8px 12px;border-bottom:8px solid var(--gruen)}
.nummer b{display:block;font-family:var(--font-titel);font-size:62px;line-height:1}
.nummer em{display:block;font-style:normal;font-size:19px;color:var(--ink);font-weight:600;margin-top:4px}
.nummer span{display:block;font-size:15px;color:var(--ink-leise)}
.nummer.neu{animation:aufleuchten 1s 3}
@keyframes aufleuchten{50%{background:var(--gruen-hell)}}
.gm-leer{grid-column:1/-1;text-align:center;color:#8e9bbb;font-size:22px;padding:40px}

.wz{padding:18px 28px 30px}
.wz-gruppe{margin-bottom:22px}
.wz-gruppe h2{color:#fff;font-size:24px;margin-bottom:2px}
.wz-gruppe .tr{color:#b9c4de;font-size:16px;margin:0 0 12px}
.wz-liste{display:grid;grid-template-columns:repeat(auto-fill,minmax(250px,1fr));gap:12px}
.wz-stand{background:var(--nacht-2);border-radius:12px;padding:16px 18px;display:grid;grid-template-columns:1fr auto;align-items:center;gap:4px 12px;border:2px solid transparent}
.wz-stand .name{font-size:23px;font-weight:600}
.wz-stand .name small{display:block;font-size:15px;font-weight:400;color:#b9c4de}
.wz-stand .zahl-gross{grid-row:span 2;font-family:var(--font-titel);font-size:52px;line-height:1;text-align:right}
.wz-stand .zahl-gross small{display:block;font-family:var(--font);font-size:13px;color:#b9c4de;font-weight:400}
.wz-balken{grid-column:1/-1;height:8px;border-radius:4px;background:rgba(255,255,255,.1);overflow:hidden;margin-top:8px}
.wz-balken i{display:block;height:100%;border-radius:4px}
.wz-stand.wenig .wz-balken i{background:var(--gruen)}
.wz-stand.mittel .wz-balken i{background:var(--gold)}
.wz-stand.viel .wz-balken i{background:var(--rot)}
.wz-stand.tipp{border-color:var(--gold)}
.tipp-marke{grid-column:1/-1;justify-self:start;background:var(--gold);color:var(--blau-tief);font-size:13px;font-weight:600;padding:2px 9px;border-radius:10px;margin-bottom:4px}
.legende{display:flex;gap:18px;color:#b9c4de;font-size:15px;padding:0 28px 24px;flex-wrap:wrap}
.legende i{display:inline-block;width:12px;height:12px;border-radius:3px;margin-right:6px;vertical-align:-1px}

/* ---------- Gäste: Menü + Status (Handy) ---------- */
body.gast{background:var(--bg)}
.g-kopf{background:var(--blau-tief);color:#fff;text-align:center;padding:18px 16px 16px;position:relative}
.g-kopf img{height:40px;display:block;margin:0 auto 8px}
.g-kopf h1{color:#fff;font-size:24px}
.g-kopf p{margin:3px 0 0;color:#c5cfe6;font-size:15px}
body.gast.frauen .g-kopf{background:var(--rosa-tief)}
.g-sprachen{position:absolute;top:12px;right:12px;display:flex;gap:4px}
.g-sprachen button{color:#fff;background:rgba(255,255,255,.12);padding:5px 9px;font-size:13px;font-weight:600;border-radius:6px}
.g-sprachen button.an{background:#fff;color:var(--blau-tief)}
.g-inhalt{max-width:640px;margin:0 auto;padding:12px 12px 120px}
.g-nav{display:flex;gap:6px;overflow-x:auto;padding:10px 12px;position:sticky;top:0;background:var(--bg);z-index:10;border-bottom:1px solid var(--linie);scrollbar-width:none}
.g-nav::-webkit-scrollbar{display:none}
.g-nav a{flex:0 0 auto;text-decoration:none;color:var(--blau-tief);background:var(--weiss);border:1px solid var(--linie);padding:7px 12px;border-radius:18px;font-size:14.5px;font-weight:600}
.g-gruppe{scroll-margin-top:60px;margin-top:18px}
.g-gruppe-kopf{display:flex;align-items:baseline;gap:8px;margin:0 2px 8px}
.g-gruppe-kopf h2{font-size:21px}
.g-gruppe-kopf small{color:var(--ink-leise);font-size:14px}
.g-gruppe-kopf .wartet{margin-left:auto;font-size:13px;font-weight:600;padding:3px 9px;border-radius:10px;white-space:nowrap}
.wartet.wenig{background:var(--gruen-hell);color:var(--gruen)}
.wartet.mittel{background:var(--gold-hell);color:var(--gold-tief)}
.wartet.viel{background:oklch(0.94 0.04 25);color:var(--rot)}
.g-karten{display:grid;gap:8px}
.g-karte{background:var(--weiss);border:1px solid var(--linie);border-radius:12px;display:flex;gap:12px;padding:8px;align-items:center}
.g-bild{width:78px;height:78px;border-radius:9px;flex:0 0 auto;object-fit:cover;background:var(--sand)}
.g-bild.platzhalter{display:grid;place-items:center;background:var(--blau-hell);color:var(--blau);font-family:var(--font-titel);font-size:30px}
.g-text{flex:1;min-width:0}
.g-text b{display:block;font-size:16.5px;line-height:1.2}
.g-text .preis{color:var(--blau);font-weight:600;margin-top:3px}
.g-text .rueber{font-size:12.5px;color:var(--rosa);font-weight:600}
.g-plus{width:44px;height:44px;border-radius:22px;background:var(--blau);color:#fff;font-size:26px;line-height:1;flex:0 0 auto}
.g-karte .menge{background:var(--blau-hell)}
.g-leiste{position:fixed;left:0;right:0;bottom:0;padding:10px 12px calc(10px + env(safe-area-inset-bottom));background:var(--weiss);border-top:1px solid var(--linie);z-index:20;display:none}
.g-leiste.an{display:block}
.g-leiste .knopf{width:100%;max-width:616px;margin:0 auto;display:flex;justify-content:space-between;font-size:17px}
.g-blatt{position:fixed;inset:0;background:rgba(15,20,50,.55);z-index:40;display:none;align-items:flex-end;justify-content:center}
.g-blatt.an{display:flex}
.g-blatt-inhalt{background:var(--weiss);width:100%;max-width:640px;max-height:92vh;border-radius:16px 16px 0 0;display:flex;flex-direction:column}
.g-blatt-kopf{display:flex;align-items:center;padding:16px 18px 10px;border-bottom:1px solid var(--linie)}
.g-blatt-kopf h2{font-size:21px}
.g-blatt-kopf button{margin-left:auto;font-size:26px;line-height:1;color:var(--ink-leise);padding:4px 8px}
.g-blatt-mitte{overflow:auto;padding:8px 18px}
.g-blatt-fuss{padding:12px 18px calc(14px + env(safe-area-inset-bottom));border-top:1px solid var(--linie);display:grid;gap:10px}
.g-blatt-fuss label{font-size:14.5px;font-weight:600}
.g-blatt-fuss input{width:100%;font-size:17px}
.g-hinweis{font-size:13.5px;color:var(--ink-leise);margin:0}
.fertig-seite{text-align:center;padding:28px 18px}
.fertig-seite .vnr{font-family:var(--font-titel);font-size:76px;line-height:1;color:var(--blau-tief);margin:8px 0}
.zur-kasse{background:var(--gold-hell);border:2px solid var(--gold);border-radius:14px;padding:16px;margin:16px 0;text-align:left}
.zur-kasse b{display:block;font-size:19px;color:var(--blau-tief);margin-bottom:4px}
.zur-kasse p{margin:0 0 6px}
.zur-kasse .tr{color:var(--ink-leise);font-size:15px}

.st-nr{font-family:var(--font-titel);font-size:62px;line-height:1}
.st-teil{background:var(--weiss);border-radius:12px;padding:14px 16px;border-left:7px solid var(--gold);margin-bottom:10px}
.st-teil.bereit{border-left-color:var(--gruen);background:var(--gruen-hell)}
.st-teil.unterwegs{border-left-color:var(--rosa)}
.st-teil.erledigt{border-left-color:#9aa5bd;opacity:.7}
.st-teil.sofort{border-left-color:var(--blau)}
.st-kopf{display:flex;align-items:baseline;gap:10px}
.st-kopf .tnr{font-family:var(--font-titel);font-size:22px;color:var(--blau-tief)}
.st-kopf .prod{font-weight:600;font-size:17px}
.st-status{font-size:18px;font-weight:600;margin-top:4px}
.st-status small{display:block;font-size:14.5px;font-weight:400;color:var(--ink-leise)}
.st-notiz{font-size:14px;color:var(--gold-tief);font-weight:600}

/* ---------- Admin ---------- */
.admin{max-width:1180px;margin:0 auto;padding:18px 16px 50px}
.tabs{display:flex;gap:6px;margin-bottom:16px;flex-wrap:wrap}
.tabs button{background:var(--weiss);border:1px solid var(--linie);color:var(--blau-tief);padding:10px 16px;font-weight:600}
.tabs button.an{background:var(--blau);border-color:var(--blau);color:#fff}
table{width:100%;border-collapse:collapse;background:var(--weiss);border-radius:var(--r);overflow:hidden;border:1px solid var(--linie)}
th,td{padding:8px 9px;border-bottom:1px solid var(--linie);text-align:left;vertical-align:middle}
th{font-size:13.5px;color:var(--ink-leise);font-weight:600;background:var(--bg)}
td input[type=text]{width:100%}
td input.preis{width:88px}
td input[type=number]{width:80px}
td select{max-width:230px}
.mini-bild{width:52px;height:52px;border-radius:7px;object-fit:cover;display:block;background:var(--sand)}
.bild-zelle{display:flex;align-items:center;gap:6px}
.bild-zelle label{font-size:13px;color:var(--blau);cursor:pointer;font-weight:600}
.bild-zelle input{display:none}
.storniert td{color:#9aa5bd;text-decoration:line-through}
.zahlen{display:grid;grid-template-columns:repeat(auto-fill,minmax(200px,1fr));gap:12px;margin-bottom:16px}
.zahlen div{background:var(--weiss);border:1px solid var(--linie);padding:14px 18px;border-radius:var(--r)}
.zahlen b{display:block;font-family:var(--font-titel);font-size:28px;color:var(--blau-tief)}
.gefahr-box{margin-top:30px;padding:16px;background:oklch(0.95 0.03 25);border-radius:var(--r)}
.leise-text{color:var(--ink-leise);font-size:14px}

/* ---------- QR-Aushang ---------- */
.aushang{display:grid;grid-template-columns:1fr 1fr;gap:20px;padding:20px}
.aushang-karte{background:var(--weiss);border:2px solid var(--blau);border-radius:18px;padding:26px;text-align:center;break-inside:avoid}
.aushang-karte.f{border-color:var(--rosa)}
.aushang-karte img.logo{height:54px;margin:0 auto 12px;display:block}
.aushang-karte h2{font-size:30px}
.aushang-karte .tr{color:var(--ink-leise);font-size:18px;margin:4px 0 14px}
.aushang-karte .qr svg{width:240px;height:240px}
.aushang-karte .url{font-size:15px;color:var(--ink-leise);margin-top:10px;word-break:break-all}
@media print{.kein-druck{display:none!important}body{background:#fff}.aushang{padding:0}}
@media (max-width:700px){.aushang{grid-template-columns:1fr}}
@media (prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important}}

/* ===================== FERNSEHER (TV) =====================
   Alles in vh/vw, damit es auf jedem Fernseher gleich aussieht:
   pro Stand 4 Bestellungen nebeneinander, 3 Reihen = 12 sichtbar */
body.tv{background:var(--nacht);color:#fff;height:100vh;overflow:hidden;margin:0}
.tv-kopf{height:8vh;display:flex;align-items:center;gap:1.6vw;padding:0 1.4vw;background:var(--blau-tief);border-bottom:.5vh solid var(--gold)}
body.tv.frauen .tv-kopf{background:var(--rosa-tief);border-bottom-color:var(--rosa)}
.tv-kopf img{height:5vh}
.tv-kopf h1{color:#fff;font-size:3.6vh;flex:1;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.tv-uhr{font-size:3.4vh;font-weight:600;font-variant-numeric:tabular-nums}
.tv-raster{display:grid;grid-template-columns:3fr 1fr;gap:1vw;padding:1.2vh 1vw;height:92vh}
.tv-offen{display:grid;grid-template-columns:repeat(var(--n),minmax(0,1fr));gap:1vw;min-height:0}
.tv-block{display:flex;flex-direction:column;min-height:0;overflow:hidden}
.tv-block + .tv-block{border-left:.3vw solid var(--nacht-2);padding-left:1vw}
.tv-block h2,.tv-fertig h2{font-family:var(--font);font-weight:600;font-size:2.4vh;color:#c5cfe6;margin:0 0 1vh;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.tv-block h2 b,.tv-fertig h2 b{color:var(--gold)}
.tv-karten{display:grid;gap:1vh .7vw;grid-auto-rows:25vh;align-content:start;overflow:hidden;min-height:0}
.tv-k{background:var(--weiss);color:var(--ink);border-radius:.9vh;border-top:1vh solid var(--rot);padding:1vh .8vw;display:flex;flex-direction:column;gap:.4vh;overflow:hidden;min-width:0}
.tv-k.rosa{background:var(--rosa-hell);border-top-color:var(--rosa)}
.tv-k.alt{box-shadow:0 0 0 .5vh var(--gold)}
.tv-k-oben{display:flex;align-items:baseline;justify-content:space-between;gap:.4vw}
.tv-nr{font-family:var(--font-titel);font-size:5.4vh;line-height:1;color:var(--blau-tief);font-variant-numeric:tabular-nums;white-space:nowrap}
.tv-min{font-size:2vh;color:var(--ink-leise);font-weight:600}
.tv-name{font-size:2.3vh;font-weight:600;color:var(--ink-leise);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.tv-fuer{align-self:flex-start;background:var(--rosa);color:#fff;font-size:1.7vh;font-weight:600;padding:.1vh .5vw;border-radius:.5vh}
.tv-prod{font-size:3vh;font-weight:600;line-height:1.15;overflow:hidden;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical}
.tv-notiz{align-self:flex-start;font-size:2.3vh;font-weight:600;color:var(--gold-tief);background:var(--gold-hell);padding:.2vh .5vw;border-radius:.5vh;max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.tv-leer{color:#8e9bbb;font-size:2.6vh;margin:1vh 0}
.tv-fertig{background:var(--nacht-2);border-radius:1vh;padding:1.2vh .9vw;overflow:hidden;min-height:0}
.tv-f{display:grid;grid-template-columns:auto 1fr;grid-template-rows:auto auto;column-gap:.8vw;align-items:center;background:var(--weiss);color:var(--ink);border-left:.6vw solid var(--gruen);border-radius:.8vh;padding:.8vh .7vw;margin-bottom:.9vh}
.tv-f.rosa{background:var(--rosa-hell)}
.tv-f .tv-nr{grid-row:span 2;font-size:4.4vh}
.tv-f span:not(.tv-nr){font-size:2.4vh;font-weight:600;line-height:1.15;overflow:hidden;white-space:nowrap;text-overflow:ellipsis}
.tv-f small{display:block;font-size:1.8vh;color:var(--ink-leise);font-weight:400}
.tv-f em{font-style:normal;font-size:2vh;color:var(--ink-leise);overflow:hidden;white-space:nowrap;text-overflow:ellipsis}

/* ===================== ABHOLUNG (TV) ===================== */
.ab-raster{display:grid;gap:1.4vw;padding:1.6vh 1.4vw;height:calc(100vh - 11vh)}
.ab-raster.zwei{grid-template-columns:1fr 1fr}
.ab-spalte{min-height:0;overflow:hidden;display:flex;flex-direction:column}
.ab-spalte h2{color:#fff;font-size:3.4vh;margin-bottom:.4vh}
.ab-spalte .tr{color:#c5cfe6;font-size:2.2vh;margin:0 0 1.4vh}
.ab-nummern{display:grid;grid-template-columns:repeat(var(--sp,6),minmax(0,1fr));gap:1.2vh .8vw;align-content:start;overflow:hidden}
.ab-n{background:var(--weiss);color:var(--blau-tief);border-radius:1vh;text-align:center;padding:1.2vh .4vw 1vh;border-bottom:.9vh solid var(--gruen);min-width:0}
.ab-n.mitte{border-bottom-color:var(--rosa)}
.ab-n b{display:block;font-family:var(--font-titel);font-size:7vh;line-height:1;font-variant-numeric:tabular-nums}
.ab-n em{display:block;font-style:normal;font-size:2.3vh;color:var(--ink);font-weight:600;margin-top:.5vh;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.ab-n span{display:block;font-size:1.9vh;color:var(--ink-leise);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.ab-n.neu{animation:aufleuchten 1s 3}
.ab-leer{color:#8e9bbb;font-size:2.8vh;grid-column:1/-1}

/* ===================== SPONSOREN-LEISTE ===================== */
.sponsoren{position:fixed;left:0;right:0;bottom:0;display:flex;align-items:center;justify-content:center;gap:3vw;padding:1.6vh 2vw;background:var(--weiss);border-top:.6vh solid var(--gold)}
.sponsoren span{color:var(--ink-leise);font-size:2.2vh;font-weight:600;text-align:right;line-height:1.25}
.sponsoren img{height:17vh;max-width:42vw;object-fit:contain;border-radius:1vh}
body.mit-sponsoren .wz{padding-bottom:18vh}
body.mit-sponsoren .legende{display:none}

/* Wartezeit-Monitor: in vh, damit auf jedem Fernseher alle Stände
   (4 pro Reihe) über die Sponsorenleiste passen */
body.gast-monitor{height:100vh;overflow:hidden}
body.gast-monitor .gm-kopf{padding:1.8vh 2vw 1.4vh;gap:1.6vw;border-bottom-width:.5vh}
body.gast-monitor .gm-kopf img{height:6vh}
body.gast-monitor .gm-kopf h1{font-size:4.6vh}
body.gast-monitor .gm-kopf p{font-size:2.4vh}
body.gast-monitor .gm-kopf .uhr{font-size:4vh}
body.gast-monitor .wz{padding:2vh 2vw}
body.gast-monitor .wz-gruppe{margin-bottom:2vh}
body.gast-monitor .wz-gruppe h2{font-size:3.4vh}
body.gast-monitor .wz-gruppe .tr{font-size:2.1vh;margin-bottom:1.2vh}
body.gast-monitor .wz-liste{grid-template-columns:repeat(4,minmax(0,1fr));gap:1.4vh 1vw}
body.gast-monitor .wz-stand{padding:1.6vh 1.2vw;border-radius:1.2vh;border-width:.3vh}
body.gast-monitor .wz-stand .name{font-size:3.3vh}
body.gast-monitor .wz-stand .name small{font-size:2vh}
body.gast-monitor .wz-stand .zahl-gross{font-size:7.5vh}
body.gast-monitor .wz-stand .zahl-gross small{font-size:1.7vh}
body.gast-monitor .wz-balken{height:1vh;margin-top:1vh}
body.gast-monitor .tipp-marke{font-size:1.8vh;padding:.2vh .7vw;margin-bottom:.6vh}
body.gast-monitor .legende{font-size:2vh;padding:0 2vw}
body.mit-sponsoren .wz{padding-bottom:0}
body.gast-monitor.mit-sponsoren .wz-gruppe .tr{margin-bottom:1vh}
body.wz-frauen .wz-liste{grid-template-columns:repeat(5,minmax(0,1fr))}
body.wz-frauen .wz-stand .zahl-gross{font-size:6.5vh}
body.wz-frauen .wz-stand .name{font-size:3vh}

/* Admin: Öffnen/Schließen */
.offen-leiste{display:flex;align-items:center;gap:16px;padding:14px 18px;border-radius:var(--r);margin-bottom:16px;border:2px solid}
.offen-leiste div{flex:1;display:flex;flex-direction:column;gap:2px}
.offen-leiste b{font-size:18px}
.offen-leiste span{font-size:14px;color:var(--ink-leise)}
.offen-leiste.ist-offen{background:var(--gruen-hell);border-color:var(--gruen)}
.offen-leiste.ist-offen b{color:var(--gruen)}
.offen-leiste.ist-zu{background:oklch(0.95 0.03 25);border-color:var(--rot)}
.offen-leiste.ist-zu b{color:var(--rot)}
