/* Bestell-App: dunkles Navy-Geruest, helle Karten (Entwurf vom 17.10.2026) */
:root{--tx:#f7fafc;--tx2:#cbd5e0;--mu:#b4c0d0;--am:#68d391;--gr:#68d391;--rot:#fc8181;--ln:#3b475c;--btn:#25734a;--btnt:#fff;--chip:#3b475c;
  --grund:#1a202c;--panel:#2d3748;--karte:#2d3748;--leiste:#111827;--sel:#1c3d2c;--selt:#c6f0d8;--ring:#3fb27f;--feld:#1a202c}
.card{color:var(--tx);background:var(--karte);border-radius:10px}
*{box-sizing:border-box}
html,body{margin:0;height:100%}
body{background:var(--grund);color:var(--tx);font:17px/1.35 system-ui,sans-serif;-webkit-tap-highlight-color:transparent}
h1,h2,.titel{font-family:system-ui,sans-serif;letter-spacing:-.5px;margin:0}
h1{font-size:28px;font-weight:800}h2{font-size:20px;font-weight:700}
button,input,select{font:inherit}
.b{font-weight:600;border:0;border-radius:12px;min-height:48px;padding:0 18px;cursor:pointer;background:var(--btn);color:var(--btnt)}
.b.leise{background:transparent;color:var(--tx2);box-shadow:inset 0 0 0 1px var(--ln)}
.b.gefahr{background:transparent;color:var(--rot);box-shadow:inset 0 0 0 1px currentColor}
.b:disabled{opacity:.5;cursor:default}
label{display:flex;flex-direction:column;gap:6px;font-weight:600;font-size:14px;color:var(--tx2)}
input,select{min-height:48px;border-radius:12px;border:1px solid var(--ln);background:#fff;color:#1a202c;padding:0 14px;font-size:16px}
.fehler{color:var(--rot);font-weight:600;min-height:1.4em}
.mu{color:var(--mu)}
.offline{position:fixed;inset:0 0 auto 0;z-index:10;background:#c53030;color:#fff;font-weight:700;text-align:center;padding:10px 16px}

/* Einstieg: Einrichtung, Koppeln, Anmeldung */
.einstieg{min-height:100%;display:flex;align-items:center;justify-content:center;padding:24px 16px}
.einstieg .card{width:100%;max-width:440px;padding:28px;display:flex;flex-direction:column;gap:16px}
.marke{font:800 30px/1 system-ui,sans-serif;color:var(--am);letter-spacing:-.5px}
.kacheln{display:grid;grid-template-columns:repeat(auto-fill,minmax(130px,1fr));gap:12px;width:100%;max-width:720px}
.kachel{min-height:96px;border:0;border-radius:18px;background:var(--karte);color:#1a202c;cursor:pointer;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:4px;font-weight:700;font-size:17px}
.kachel small{font-weight:500;color:#5a6577;font-size:13px}
.pinfeld{font:800 32px/1 system-ui,sans-serif;letter-spacing:12px;text-align:center;min-height:40px}
.pad{display:grid;grid-template-columns:repeat(3,1fr);gap:10px}
.pad button{min-height:64px;border-radius:14px;border:0;background:var(--chip);color:var(--tx);font-size:24px;font-weight:700;cursor:pointer}
.code{font:800 56px/1 system-ui,sans-serif;letter-spacing:10px;text-align:center;color:var(--tx)}

/* Arbeitsflaeche */
.shell{height:100%;display:flex;flex-direction:column}
.kopf{height:64px;flex:none;display:flex;align-items:center;gap:14px;padding:0 16px 0 0;border-bottom:1px solid var(--ln)}
.kopf .marke{width:84px;display:flex;justify-content:center;font-size:22px}
.kopf .seite{font:700 18px/1 system-ui,sans-serif}
.kopf .platz{flex:1}
.kopf .wer{color:var(--tx2);font-weight:600}
.koerper{flex:1;min-height:0;display:flex}
.rail{width:84px;flex:none;display:flex;flex-direction:column;gap:6px;padding:12px 8px;border-right:1px solid var(--ln)}
.rail a{display:flex;flex-direction:column;align-items:center;gap:6px;padding:12px 4px;border-radius:14px;color:var(--mu);font-size:12px;font-weight:600;text-decoration:none}
.rail a.on{background:var(--chip);color:var(--am)}
.rail .platz{flex:1}
main{flex:1;min-width:0;overflow:auto;padding:20px 24px;display:flex;flex-direction:column;gap:16px}
.leer{flex:1;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:8px;color:var(--mu);text-align:center}
.leer .titel{font-size:22px;color:var(--tx2)}
.raster{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(320px,100%),1fr));gap:16px;align-items:start}
.card.block{padding:18px;display:flex;flex-direction:column;gap:12px}
.zeile{display:flex;align-items:center;gap:10px;padding:10px 0;border-top:1px solid var(--ln);flex-wrap:wrap}
.zeile:first-of-type{border-top:0}
.zeile .name{flex:1;font-weight:600}
.chip{display:inline-flex;align-items:center;font-size:12px;font-weight:700;letter-spacing:.6px;padding:4px 9px;border-radius:999px;background:var(--chip);color:var(--tx2)}
.formular{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.formular .voll{grid-column:1/-1}

@media (max-width:700px){
  .koerper{flex-direction:column-reverse}
  .rail{width:auto;flex-direction:row;border-right:0;border-top:1px solid var(--ln);padding:6px 8px calc(6px + env(safe-area-inset-bottom))}
  .rail a{flex:1}.rail .platz{display:none}
  .kopf .marke{width:auto;padding-left:16px}
  main{padding:16px}
  .formular{grid-template-columns:1fr}
}
.spalte{display:flex;flex-direction:column;align-items:center;gap:20px;width:100%}
.einstieg .card.schmal{max-width:360px}
.aus{opacity:.5}
.b.klein{min-height:36px;padding:0 12px}
.mitte{text-align:center;margin:0}
#app{height:100%}
.kacheln{grid-template-columns:repeat(auto-fit,140px);justify-content:center}

/* ---------- Bausteine ---------- */
textarea{font:inherit;font-size:16px;border-radius:12px;border:1px solid var(--ln);background:#fff;color:#1a202c;padding:10px 14px;resize:vertical}
.platz{flex:1}
.klein{font-size:13px}
.chip.rot{background:#e5534b;color:#fff}
.chip.bar{background:#E2A03D;color:#1a1209}
.chip.onl{background:transparent;color:var(--gr);box-shadow:inset 0 0 0 1.5px #7cbf9b}
.chip.src{background:var(--chip);color:var(--tx2)}
.chip.rahmen{background:transparent;color:var(--mu);box-shadow:inset 0 0 0 1px #4a5568}
.chip.spaet{background:#e5534b;color:#fff}
.b.akzent{background:#E2A03D;color:#1a1209;font-weight:700}
.b.dunkel{background:var(--btn);color:var(--btnt)}
.b.rahmen{background:transparent;color:var(--tx2);box-shadow:inset 0 0 0 1px var(--ln)}
.b.hoch{min-height:56px}
.b.breit{flex:1}
.b.an{background:var(--btn);color:var(--btnt)}
.akzent-text{color:var(--am);font-weight:600}
.pruefen{color:#b42318;font-weight:600;font-size:14px;margin:0}
.wahl{display:flex;flex-wrap:wrap;gap:6px}
.knoepfe{display:flex;gap:10px;justify-content:flex-end;flex-wrap:wrap}
.segment{display:flex;flex-wrap:wrap;background:var(--karte);border-radius:14px;padding:4px;gap:4px}
.segment .b{min-height:44px;background:transparent;color:var(--tx2)}
.segment .b.an{background:var(--btn);color:var(--btnt)}
.etikett{color:var(--mu);font-size:12px;font-weight:700;letter-spacing:.8px}
.betrag{font-variant-numeric:tabular-nums;text-align:right;white-space:nowrap}
.kopfzeile{display:flex;align-items:center;gap:10px;padding:4px 4px 0;flex-wrap:wrap}
.kopfzeile h1{font:700 17px/1 system-ui,sans-serif}
main.ohne-rand{padding:0}
.kopf-extra{display:flex;align-items:center}
.kopf .uhr{font-variant-numeric:tabular-nums}
.rail .icon{position:relative;display:flex}
.rail .zahl{position:absolute;top:-6px;right:-10px;background:#e5534b;color:#fff;font-size:11px;font-weight:700;border-radius:999px;padding:0 6px;line-height:17px}
.banner{background:#c53030;color:#fff;padding:10px 16px;border-radius:12px;display:flex;align-items:center;gap:10px;flex-wrap:wrap}
.banner .mu{color:#fde2e2}
.banner .b{background:#fff;color:#1a202c;margin-left:auto}
.toast{position:fixed;left:50%;top:16px;transform:translateX(-50%);z-index:50;background:#f5f7fa;color:#1a202c;font-weight:600;padding:12px 18px;border-radius:12px;box-shadow:0 6px 24px rgba(0,0,0,.35);max-width:calc(100% - 32px)}
.toast.rot{background:#c53030;color:#fff}

/* Dialoge */
.dlg{border:0;padding:0;background:transparent;max-width:min(560px,calc(100% - 24px));width:100%}
.dlg.gross{max-width:min(1100px,calc(100% - 24px))}
.dlg::backdrop{background:rgba(10,14,22,.7)}
.dlg-innen{padding:22px;display:flex;flex-direction:column;gap:14px;max-height:calc(100vh - 48px);overflow:auto}
.dlg-kopf{display:flex;align-items:center;gap:12px;flex-wrap:wrap}

/* ---------- Eingang ---------- */
.eingang{flex:1;min-height:0;display:flex}
.liste{width:392px;flex:none;overflow:auto;display:flex;flex-direction:column;gap:10px;padding:18px 16px;border-right:1px solid var(--ln);background:var(--panel)}
.eintrag{all:unset;box-sizing:border-box;cursor:pointer;background:var(--karte);color:#1a202c;border-radius:16px;padding:14px 16px;display:flex;flex-direction:column;gap:8px;box-shadow:0 1px 3px rgba(0,0,0,.2)}
.eintrag .chip.src{background:#e2e8f0;color:#3b4658}
.eintrag.wartet{background:#fbf1dc}
.eintrag.gewaehlt{box-shadow:inset 0 0 0 2px #E2A03D}
.eintrag:focus-visible{outline:3px solid #F6C55E;outline-offset:2px}
.eintrag .oben,.eintrag .unten{display:flex;align-items:center;gap:8px}
.eintrag .nr{font:800 20px/1 system-ui,sans-serif}
.eintrag .adr{font-weight:600}
.eintrag .unten{color:#5a6577;font-size:14px}
.eintrag .uhrzeit{font-weight:700;font-variant-numeric:tabular-nums;color:#9a5d0c}
.eintrag .chip{background:#e2e8f0;color:#3b4658}
.eintrag .chip.bar{background:#E2A03D;color:#1a1209}
.eintrag .chip.onl{background:transparent;color:#1f7349;box-shadow:inset 0 0 0 1.5px #7cbf9b}
.eintrag .chip.spaet{background:#e5534b;color:#fff}
.eintrag .pruefen{font-size:13px}
.rechts{flex:1;min-width:0;overflow:auto;display:flex;flex-direction:column;gap:12px;padding:22px 28px 20px}
.detail{flex:1;display:flex;flex-direction:column;gap:16px}
.dkopf{display:flex;align-items:flex-end;gap:16px;flex-wrap:wrap}
.gross-nr{font:800 52px/.9 system-ui,sans-serif;letter-spacing:-1.5px}
.dinfo{display:flex;flex-direction:column;gap:2px;padding-bottom:3px}
.dinfo .mu{font-size:14px}
.dkopf .chip{font-size:15px;padding:8px 14px}
.zwei{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px}
.card.feld{padding:16px 18px;display:flex;flex-direction:column;gap:4px}
.feld .gr{font-size:17px}
.feld .tel{color:var(--tx);font-variant-numeric:tabular-nums}
.positionen{padding:6px 18px}
.pz{display:grid;grid-template-columns:44px 1fr auto;gap:10px;padding:12px 0;border-bottom:1px solid var(--ln)}
.pz:last-child{border-bottom:0}
.pz.summe{font-weight:700;font-size:17px}
.aktionen{margin-top:auto;display:flex;align-items:center;gap:12px;flex-wrap:wrap}

/* Bon-Vorschau */
.bondlg{max-width:440px}
.bonrahmen{background:#fff;color:#000;border-radius:6px;padding:16px 12px;overflow:auto}
.bon{font:13px/1.35 ui-monospace,'Cascadia Mono',Consolas,monospace;width:48ch;margin:0 auto;white-space:pre-wrap;word-break:break-word}
.bon .mitte{text-align:center}
.bon .fett{font-weight:700}
.bon .gross{font-size:22px;line-height:1.2}
.bon .hoch{font-size:17px}
.bon .invers{background:#000;color:#fff}
.bon .qr{text-align:center;padding:6px 0}
.bon .strich{border-top:1px solid #000;margin:3px 0}
.bon .qrnr{display:flex;align-items:center;justify-content:center;gap:24px;padding:6px 0}
.bon .tagesnr{font:700 64px/1 system-ui,sans-serif}
.bonlogo{image-rendering:pixelated;max-width:100%;height:auto;display:inline-block}
.logo-vorschau{background:#fff;border-radius:6px;padding:10px;text-align:center;margin:6px 0}
.logo-vorschau .mu{color:#555}
.logo-regler{display:grid;gap:6px}
.logo-regler input[type=range]{width:100%}

/* Telefonbestellung */
.telefon{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.2fr);gap:20px}
.spalte-links,.spalte-rechts{display:flex;flex-direction:column;gap:12px}
.adresse[hidden]{display:none}
.treffer{display:flex;flex-direction:column;gap:4px}
.treff{all:unset;box-sizing:border-box;cursor:pointer;display:grid;grid-template-columns:56px 1fr auto;gap:10px;padding:10px 12px;border-radius:10px;background:#e2e8f0}
.treff:hover,.treff:focus-visible{background:#d5dbe3}
.treff.aus{opacity:.5;text-decoration:line-through}
.korb{display:flex;flex-direction:column;gap:6px;min-height:60px}
.kz{display:grid;grid-template-columns:auto 1fr auto;gap:12px;align-items:start;padding:8px 0;border-bottom:1px solid var(--ln)}
.kz .menge{display:flex;align-items:center;gap:6px}
.kz .menge .b{min-width:36px;padding:0}
.kz .kname{display:flex;flex-direction:column;gap:6px}
.kz select{min-height:40px}
.summenzeile{display:flex;align-items:center;gap:8px;font-size:17px}

/* ---------- Kueche ---------- */
.kueche{flex:1;min-height:0;display:flex;gap:16px;padding:16px;overflow:auto}
.zumachen{width:240px;flex:none;background:var(--panel);border-radius:18px;padding:16px;display:flex;flex-direction:column;gap:12px;align-self:flex-start}
.zm{display:flex;justify-content:space-between;align-items:baseline;gap:10px}
.zm strong{font:800 26px/1 system-ui,sans-serif;color:var(--am)}
.spalte-neu{width:300px;flex:none;display:flex;flex-direction:column;gap:12px}
.spalte-arbeit{flex:1;min-width:0;display:flex;flex-direction:column;gap:12px}
.raster-k{display:grid;grid-template-columns:repeat(auto-fill,minmax(min(250px,100%),1fr));gap:12px}
.kkarte{padding:16px;display:flex;flex-direction:column;gap:10px}
.kkarte.bald{box-shadow:inset 0 0 0 2px #E2A03D}
.kkarte.spaet{box-shadow:inset 0 3px 0 #e5534b}
.kkarte .oben{display:flex;align-items:center;gap:8px}
.kkarte .nr{font:800 24px/1 system-ui,sans-serif}
.kkarte .zeit{font-weight:700;color:var(--am)}
.kkarte.spaet .zeit{color:#c2412f}
.line{display:grid;grid-template-columns:36px 1fr;gap:6px;font-size:17px;font-weight:600}
.line b{color:var(--am)}
.line .extra{font-size:14px;color:var(--mu);font-weight:500}
.notiz{background:#f6e7c8;color:#7a4808;border-radius:10px;padding:8px 10px;font-weight:600;font-size:15px}
.kkarte .b{margin-top:auto}

/* Verwaltung */
.schluessel{display:block;background:#1a202c;color:#F6C55E;padding:10px 12px;border-radius:10px;word-break:break-all;font-size:13px}

@media (max-width:900px){
  .eingang{flex-direction:column}
  .liste{width:auto;max-height:45vh;border-right:0;border-bottom:1px solid var(--ln)}
  .rechts{padding:16px}
  .telefon,.zwei{grid-template-columns:1fr}
  .kueche{flex-direction:column}
  .zumachen,.spalte-neu{width:auto}
  .kopf .chip.rahmen,.kopf .wer{display:none}
}
[hidden]{display:none!important}
.b{white-space:nowrap}
.toast{pointer-events:none}
.formular input,.formular select{width:100%;min-width:0}

/* Touren */
.fahrerbereich{flex:1;min-width:0;overflow:auto;display:grid;grid-template-columns:repeat(auto-fill,minmax(min(300px,100%),1fr));gap:16px;padding:18px;align-content:start}
.fahrerbox{background:var(--panel);border-radius:18px;padding:14px;display:flex;flex-direction:column;gap:10px}
.tkarte,.fkarte{padding:14px 16px;display:flex;flex-direction:column;gap:8px}
.tkarte.spaet{box-shadow:inset 0 3px 0 #e5534b}
.tkarte .oben,.tkarte .unten,.fkarte .oben{display:flex;align-items:center;gap:8px}
.tkarte .nr,.fkarte .nr{font:800 20px/1 system-ui,sans-serif}
.tkarte .zeit,.fkarte .zeit{font-weight:700;color:var(--am)}
.tkarte .adr{font-weight:700;color:var(--tx)}
.fliste{display:flex;flex-direction:column;gap:12px;max-width:560px;width:100%;margin:0 auto}
.fadr{font:700 22px/1.2 system-ui,sans-serif}
.fkarte .kunde{display:flex;align-items:center;gap:10px;justify-content:space-between}
.kassieren{background:#E2A03D;color:#1a1209;font-weight:800;font-size:18px;text-align:center;border-radius:12px;padding:12px}
.bezahlt{color:var(--gr);font-weight:700;text-align:center;border-radius:12px;padding:10px;box-shadow:inset 0 0 0 1.5px #7cbf9b}
.knoepfe.voll>*{flex:1;display:inline-flex;align-items:center;justify-content:center;text-decoration:none}
a.b{display:inline-flex;align-items:center;justify-content:center;text-decoration:none}

/* Tagesliste */
.datumwahl{display:flex;align-items:center;gap:6px;margin-left:12px}
.datumwahl input{min-height:40px}
.tag{display:flex;flex-direction:column;gap:16px}
.kennzahlen{display:grid;grid-template-columns:repeat(auto-fill,minmax(min(200px,100%),1fr));gap:12px}
.kennzahl{padding:14px 16px;display:flex;flex-direction:column;gap:4px}
.kennzahl strong{font:800 26px/1.1 system-ui,sans-serif}
.tabelle{padding:16px 18px;overflow:auto}
.tkopf{display:flex;align-items:center;gap:10px;margin-bottom:8px}
table{width:100%;border-collapse:collapse;font-size:14px}
th{text-align:left;color:var(--mu);font-size:12px;letter-spacing:.6px;padding:8px 10px;border-bottom:1px solid var(--ln)}
td{padding:10px;border-bottom:1px solid var(--ln)}
tbody tr{cursor:pointer}
tbody tr:hover,tbody tr:focus-visible{background:#e8edf3;outline:none}
tr.storno td{color:var(--mu);text-decoration:line-through}
tr.storno td:nth-child(7){text-decoration:none}
@media (max-width:900px){.fahrerbereich{grid-template-columns:1fr}.datumwahl{margin-left:0}.datumwahl .b{display:none}}

/* Drucker-Tablet (Android-App) */
.druckanzeige{position:fixed;right:12px;bottom:12px;z-index:40;font-size:12px;font-weight:700;padding:6px 10px;border-radius:999px;background:#2d3748;color:#cbd5e0;pointer-events:none}
.druckanzeige.ok{color:#8fd6b0}
.druckanzeige.fehler{background:#c53030;color:#fff}
.druckanzeige.aus{opacity:.6}
@media (max-width:700px){.druckanzeige{bottom:76px}}
/* Android-App: neue Version (tablet-app.js) */
.app-update{position:fixed;top:8px;left:50%;transform:translateX(-50%);z-index:60;display:flex;align-items:center;gap:10px;max-width:calc(100% - 24px);padding:8px 10px 8px 14px;border-radius:12px;background:#1d4ed8;color:#fff;font-weight:600;box-shadow:0 6px 20px rgba(0,0,0,.3)}
.app-update .b.leise{color:#fff}

/* Speisekarte */
.sk{flex:1;min-height:0;display:flex;flex-direction:column;overflow:auto;padding:16px}
.sk-drei{flex:1;min-height:0;display:grid;grid-template-columns:var(--sk-gruppen,280px) var(--sk-artikel,minmax(min(360px,100%),1fr)) minmax(420px,1.3fr);gap:16px;padding:12px 16px;position:relative}
.sk-gruppen,.sk-artikel{display:flex;flex-direction:column;gap:6px;overflow:auto;min-height:0}
.sk-editor{display:flex;flex-direction:column;gap:16px;overflow:auto;min-height:0}
.sk-eintrag{display:flex;align-items:center;gap:8px;width:100%;min-height:44px;border:0;border-radius:12px;padding:0 12px;background:var(--panel);color:var(--tx);font-weight:600;text-align:left;cursor:pointer}
.sk-eintrag span:not(.chip):not(.betrag){flex:1}
.sk-eintrag strong{color:var(--am);min-width:2.4em}
.sk-eintrag.unter{margin-left:18px;width:calc(100% - 18px);font-weight:500}
.sk-eintrag.an,.sk-zeile.an .sk-eintrag{background:var(--chip);color:var(--am);box-shadow:inset 0 0 0 1px var(--am)}
.sk-zeile{display:flex;gap:4px;align-items:center}
.sk-zeile .sk-eintrag{flex:1;min-width:0}
.sk-zeile .b.klein{padding:0 10px}
.sk-form textarea{border-radius:12px;border:1px solid var(--ln);padding:10px 14px;font:inherit;font-size:16px;resize:vertical}
.haken{flex-direction:row;align-items:center;gap:8px;min-height:40px;padding:0 12px;border-radius:12px;box-shadow:inset 0 0 0 1px var(--ln);font-weight:600}
.haken input{min-height:0;width:20px;height:20px}
.sk-rahmen{width:100%;max-width:360px;aspect-ratio:4/3;border-radius:14px;overflow:hidden;background:#e2e8f0}
.sk-foto{width:100%;height:100%;display:block}
.sk-gebiete{padding:18px;display:flex;flex-direction:column;gap:10px;overflow:auto}
.sk-gebiete input{width:100%;min-width:70px}
input[type=range]{min-height:32px;padding:0}
@media (max-width:1100px){.sk-drei{grid-template-columns:var(--sk-gruppen,240px) minmax(0,1fr);overflow:auto}.sk-editor{grid-column:1/-1}.sk-drei .spalten-griff.nur-breit{display:none}}
@media (max-width:700px){.sk-drei{grid-template-columns:1fr}}

/* Station-Displays und Monitor */
.akopf{display:flex;align-items:center;gap:8px}
.pille{min-height:32px;border-radius:999px;font-size:13px;padding:0 12px}
.zumachen .pille{color:var(--tx2)}
.abschnitt{border-top:1px solid var(--ln);padding-top:8px;display:flex;flex-direction:column;gap:6px}
.abschnitt.st-fertig .line{opacity:.45;text-decoration:line-through}
.chip.st-neu{background:#e2e8f0;color:#3b4658}
.chip.st-in_arbeit{background:#fdecc8;color:#8a4b06}
.chip.st-fertig{background:#d3f0de;color:#1f7349}
.andere{display:flex;flex-wrap:wrap;gap:6px}
.zeile:has(.dsp){flex-wrap:wrap}
.wahl.dsp{flex-basis:100%}
.wahl.dsp .haken{min-height:36px;font-size:13px}

/* Formular-Dialog, Web-Shop, Kunden */
.fform{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.ffeld{display:flex;flex-direction:column;gap:4px}
.ffeld.voll{grid-column:1/-1}
.ffeld textarea,.ws textarea,.sk-gebiete textarea{border-radius:12px;border:1px solid var(--ln);padding:10px 14px;font:inherit;font-size:16px;resize:vertical}
.multi-liste{display:grid;grid-template-columns:repeat(auto-fill,minmax(min(220px,100%),1fr));gap:6px;max-height:280px;overflow:auto}
.haken.multi{justify-content:flex-start;font-weight:600}
.haken.multi small{margin-left:auto;font-weight:500}
.stile{display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:10px}
.stilwahl{display:flex;flex-direction:column;gap:4px;text-align:left;border:0;border-radius:14px;padding:8px;background:#fff;box-shadow:inset 0 0 0 1px var(--ln);cursor:pointer;color:#1a202c}
.stilwahl img{width:100%;aspect-ratio:9/10;object-fit:cover;border-radius:10px;background:#e2e8f0}
.stilwahl small{font-size:12px;line-height:1.3}
.stilwahl.an{box-shadow:inset 0 0 0 3px #E2A03D}
.ws{flex:1;min-height:0;overflow:auto;padding:16px;display:flex;flex-direction:column;gap:16px}
.ws-spalte{display:flex;flex-direction:column;gap:12px;max-width:900px}
main .ws-spalte{width:100%}
.akgruppe{padding:6px 12px;display:flex;flex-direction:column;gap:2px}
.akzeile{display:flex;align-items:center;gap:12px;padding:6px 0}
.akzeile input{width:22px;height:22px;min-height:0;flex:none}
.akinfo{flex:1;min-width:0;display:flex;flex-direction:column;align-items:flex-start;gap:2px;border:0;background:transparent;text-align:left;cursor:pointer;padding:6px 0;color:var(--tx);font:inherit}
.akinfo .mu{font-size:13px}
.knopfzeile{width:100%;border:0;background:transparent;font:inherit;color:inherit;cursor:pointer;text-align:left}
.knopfzeile.aus{opacity:.55}
.knopfzeile .name small{font-weight:500}
table.zeiten th{text-align:left;padding-right:10px;font-weight:600;color:var(--tx2)}
table.zeiten td{padding:3px 6px 3px 0;white-space:nowrap}
input.zeit{width:84px;min-height:40px;padding:0 10px}
.kopf-extra input[type=search]{min-height:40px;width:min(320px,40vw)}
@media (max-width:700px){.fform{grid-template-columns:1fr}}

/* Karte (aus Kass) */
.karte { position:relative; flex:1; overflow:hidden; border-radius:14px; background:#202938; user-select:none; touch-action:none; cursor:grab; }
.karte:active { cursor:grabbing; }
.karte .kflaeche { position:absolute; inset:0; }
.karte.leer { display:flex; align-items:center; justify-content:center; padding:20px; text-align:center; }
.karte .kachel { position:absolute; width:256px; height:256px; filter:brightness(.82) saturate(.85); pointer-events:none; }
.karte.stil-einfach .kachel { filter:grayscale(1) brightness(1.08) contrast(.75); opacity:.55; }
.karte.stil-einfach, .karte.stil-route { background:#1f2633; }
.karte .klinie { position:absolute; height:5px; margin-top:-2.5px; transform-origin:0 50%; border-radius:3px; opacity:.9; pointer-events:none; box-shadow:0 0 0 1px rgba(26,32,44,.55); }
.karte .klinie.gestr { height:0; margin-top:0; background:none; border-top:3px dashed; box-shadow:none; }
.karte .klinie.dim { opacity:.15; }
.karte .kring { position:absolute; border:1.5px dashed #4a5870; border-radius:50%; pointer-events:none; }
.karte .kring span { position:absolute; right:-2px; top:50%; transform:translate(100%,-50%); font-size:11px; color:#8a97ab; }
.karte .kknoepfe { position:absolute; top:8px; right:8px; display:flex; gap:6px; align-items:center; z-index:2; }
.karte .kknoepfe button { min-width:40px; min-height:40px; padding:0 10px; border-radius:10px; background:rgba(17,24,39,.9); color:#f7fafc; font-size:18px; }
.karte .kknoepfe .kalle { font-size:14px; }
.karte .kknoepfe select { min-height:40px; border-radius:10px; background:rgba(17,24,39,.9); color:#f7fafc; padding:0 8px; }
.karte .kpin { position:absolute; transform:translate(-50%,-50%); min-width:30px; height:30px; padding:0 6px; box-sizing:border-box; border-radius:15px; display:flex; align-items:center; justify-content:center; font-weight:800; font-size:13px; color:#1a202c; border:2px solid #1a202c; box-shadow:0 2px 6px rgba(0,0,0,.45); }
.karte .kpin.lokal { background:#25734a; color:#fff; border-color:#c6f0d8; width:34px; height:34px; border-radius:50%; }
.karte .kpin.dim { opacity:.25; }
.karte .osm { position:absolute; right:6px; bottom:6px; padding:2px 6px; border-radius:6px; background:rgba(17,24,39,.85); color:#cbd5e0; font-size:11px; }
/* Touren mit Karte */
.tour-rechts{flex:1;min-width:0;display:flex;flex-direction:column;overflow:auto}
.tour-karte{flex:none;height:min(46vh,440px);display:flex;padding:18px 18px 0}
.tour-karte .karte{min-height:260px}
.tour-rechts .fahrerbereich{flex:none;overflow:visible}
.tourblock{display:flex;flex-direction:column;gap:8px;padding:10px;border:2px solid var(--ln);border-radius:16px}
.tbadge{min-width:28px;height:28px;border-radius:14px;display:inline-flex;align-items:center;justify-content:center;font-weight:800;color:#1a202c}
.tstrich{width:6px;align-self:stretch;border-radius:3px}
.tourblock .zeit{font-weight:700;color:var(--am);font-size:13px}
.tourblock .zeit.jetzt{color:var(--rot)}
.tkarte.an{box-shadow:inset 0 0 0 2px #E2A03D}
.ktour{white-space:nowrap;font-weight:800;border-radius:8px;padding:2px 8px;color:#1a202c}
@media (max-width:900px){.tour-karte{height:300px}}
.oben .mu.klein{white-space:nowrap}
.strassen{display:flex;align-items:center;gap:8px;flex-wrap:wrap}
/* Sicherung */
.sicherung{grid-column:1/-1}
.sicherung h3{margin:8px 0 0;font-size:16px}
.sicherung p.ok{color:#25734a;font-weight:700}
.knoepfe.links{justify-content:flex-start;flex-wrap:wrap}
.chip.ok{background:#d7f2e3;color:#25734a}.chip.rot{background:#fde2e2;color:#c53030}
code.schluessel{display:block;font:700 18px/1.6 ui-monospace,monospace;letter-spacing:.04em;background:#f1f4f8;color:#1a202c;border-radius:12px;padding:12px;word-break:break-all}
/* QR fuers Handy */
.qrbox{display:flex;justify-content:center;background:#fff;border-radius:16px;padding:12px}
.umbruch{word-break:break-all}
.fahrerkopf{grid-column:1/-1;display:flex;align-items:center;gap:10px}
.fahrerkopf h1{margin:0;font-size:20px}
/* ---------- Aussehen wie die Kasse (20.10.2026) ---------- */
.b{border-radius:10px;min-height:52px;padding:0 18px;background:var(--btn);color:var(--btnt)}
.b:active{transform:translateY(1px);background:#1d5c3b}
.b:focus-visible,.eintrag:focus-visible{outline:3px solid var(--ring);outline-offset:2px}
.b.leise,.b.rahmen{background:transparent;color:var(--tx);box-shadow:inset 0 0 0 1.5px #5a6b85}
.b.leise:active,.b.rahmen:active{background:var(--panel)}
.b.gefahr{background:#c53030;color:#fff;box-shadow:none}
.b.akzent{background:var(--btn);color:#fff}
.b.dunkel{background:#3b475c;color:var(--tx)}
.b.an,.segment .b.an{background:var(--btn);color:#fff}
.b.klein{min-height:40px;padding:0 12px}
.segment{background:transparent;padding:0;gap:8px}
.segment .b{background:#3b475c;color:var(--tx);min-height:48px}
input,select,textarea,.sk-form textarea,.ffeld textarea,.ws textarea,.sk-gebiete textarea{background:var(--feld);color:var(--tx);border:1px solid #4a5870;border-radius:10px}
label{color:var(--mu);font-size:15px}
.kopf{background:var(--leiste);border-bottom:1px solid var(--ln)}
.kopf .marke,.marke{color:var(--tx)}
.koerper .rail{background:var(--leiste);border-right:1px solid var(--ln);width:96px}
.rail a{min-height:76px;justify-content:center;border-radius:10px;font-size:13px;color:var(--mu)}
.rail a.on{background:var(--sel);color:var(--selt);box-shadow:inset 3px 0 0 var(--ring)}
@media (max-width:700px){.koerper .rail{width:auto;border-right:0;border-top:1px solid var(--ln)}.rail a{min-height:60px;font-size:11px}.rail a.on{box-shadow:inset 0 3px 0 var(--ring)}}
.chip{background:#3b475c;color:var(--tx);border-radius:20px}
.chip.bar{background:#b54708;color:#fff}
.chip.onl{color:var(--gr);box-shadow:inset 0 0 0 1.5px var(--gr)}
.chip.rot,.chip.spaet{background:#c53030;color:#fff}
.chip.ok{background:#25734a;color:#fff}
.chip.st-neu{background:#2b6cb0;color:#fff}.chip.st-in_arbeit{background:#b54708;color:#fff}.chip.st-fertig{background:#25734a;color:#fff}
.pruefen{color:#feb2b2}
.toast{background:#25734a;color:#fff;border-radius:10px}
.toast.rot{background:#c53030}
.banner .b{background:#fff;color:#1a202c}
.pad button{background:#3b475c;border-radius:10px;min-height:70px;font-size:26px}
.kachel{background:var(--panel);color:var(--tx);border-radius:10px}
.kachel small{color:var(--mu)}
.liste{background:#151c28}
.eintrag{background:var(--panel);color:var(--tx);border-radius:10px;box-shadow:none}
.eintrag .chip{background:#3b475c;color:var(--tx)}
.eintrag .chip.bar{background:#b54708;color:#fff}
.eintrag .chip.onl{background:transparent;color:var(--gr)}
.eintrag .chip.spaet{background:#c53030;color:#fff}
.eintrag .chip.src{background:#1e3a8a;color:#fff}
.eintrag.wartet{background:#3a2a12;box-shadow:inset 6px 0 0 #b54708}
.eintrag.gewaehlt{box-shadow:inset 0 0 0 2px var(--ring)}
.eintrag.wartet.gewaehlt{box-shadow:inset 6px 0 0 #b54708,inset 0 0 0 2px var(--ring)}
.eintrag .unten{color:var(--mu)}
.eintrag .uhrzeit{color:#fbd38d}
.kkarte{border-left:6px solid #25734a}
.kkarte.bald{box-shadow:none;border-left-color:#b54708}
.kkarte.spaet{box-shadow:none;border-left-color:#c53030}
.kkarte .zeit,.tkarte .zeit,.fkarte .zeit,.tourblock .zeit{color:#fbd38d}
.kkarte.spaet .zeit{color:#feb2b2}
.line b,.zm strong{color:var(--gr)}
.notiz{background:#44403c;color:#fcd34d}
.zumachen,.fahrerbox{border-radius:10px}
.tkarte.spaet{box-shadow:inset 0 3px 0 #c53030}
.tkarte.an{box-shadow:inset 0 0 0 2px var(--ring)}
.kassieren{background:#b54708;color:#fff;border-radius:10px}
.bezahlt{box-shadow:inset 0 0 0 1.5px var(--gr)}
.treff{background:var(--feld);color:var(--tx)}
.treff:hover,.treff:focus-visible{background:#3b475c}
tbody tr:hover,tbody tr:focus-visible{background:#3b475c}
th{color:var(--mu)}
.sk-eintrag{background:var(--panel);border-radius:10px;min-height:48px}
.sk-eintrag strong{color:#fbd38d}
.sk-eintrag.an,.sk-zeile.an .sk-eintrag{background:var(--sel);color:var(--selt);box-shadow:inset 3px 0 0 var(--ring)}
.sk-rahmen{background:var(--feld);border-radius:10px}
.haken{box-shadow:inset 0 0 0 1px #4a5870;border-radius:10px;color:var(--tx)}
.stilwahl{background:var(--feld);color:var(--tx);border-radius:10px;box-shadow:inset 0 0 0 1px #4a5870}
.stilwahl.an{box-shadow:inset 0 0 0 3px var(--ring)}
.sicherung p.ok{color:var(--gr)}
code.schluessel,.schluessel{background:var(--feld);color:#fbd38d}
.tourblock{border-radius:10px}
.karte{border-radius:10px}

.unterblock{margin:10px 0;padding:12px;display:flex;flex-direction:column;gap:8px}

/* Touren: Ziehen & Ablegen (Maus, Stift, Finger) wie "Lieferung" in Kass */
.griff{cursor:grab;touch-action:none;user-select:none;font-size:20px;line-height:1;padding:4px 6px;margin:-4px 0 -4px -6px;color:var(--mu)}
.tkarte,.tourblock .kopfzeile{user-select:none}
.wird-gezogen{opacity:.4}
.ablage-an{outline:3px solid #22c55e;outline-offset:2px}
.fahrerbox.ablage-an{background:#052e16}
.karte .kpin.ablage-an{outline:3px solid #22c55e;outline-offset:2px}
.karte .kpin.kbon{cursor:pointer;touch-action:none}
.karte .kpin.an{box-shadow:0 0 0 4px #E2A03D,0 2px 6px rgba(0,0,0,.45);z-index:2}
.ziehbild{position:fixed;z-index:1000;pointer-events:none;background:#25734a;color:#fff;padding:6px 12px;border-radius:10px;font-weight:700;box-shadow:0 4px 14px #0008}

/* Kueche wie in Kass: Gericht antippen -> Portionen einzeln fertig; Farben nach Wartezeit */
button.zm{width:100%;border:0;border-radius:10px;background:var(--grund);color:var(--tx);font:inherit;padding:10px 12px;cursor:pointer;text-align:left}
button.zm:active{transform:translateY(1px)}
.kkarte .alter{font-weight:800;font-size:15px}
.line.erledigt{opacity:.45;text-decoration:line-through}
.line .fertigzahl{color:var(--gr);font-weight:800;font-size:14px}
.portionen{display:flex;flex-direction:column;gap:8px;max-height:60vh;overflow:auto;min-width:min(420px,80vw)}
.portion{display:flex;flex-direction:column;align-items:flex-start;gap:2px;min-height:56px;padding:8px 14px;border:0;border-radius:10px;background:var(--panel);color:var(--tx);font:inherit;cursor:pointer;text-align:left}
.portion:active{transform:translateY(1px)}
.kz-zeile{display:flex;align-items:center;gap:10px;flex-wrap:wrap}
.kz-zeile input[type=number]{width:80px}
.kz-zeile input[type=color]{width:52px;height:40px;padding:2px}
.kkarte .oben{flex-wrap:wrap;row-gap:4px}

/* =================== Entwurf 20.10.2026: Bestellungen, Uebersicht, Kueche, Verwaltung, Speisekarte =================== */
.kchip{display:inline-flex;align-items:center;font-size:11px;font-weight:800;letter-spacing:.6px;padding:3px 8px;border-radius:999px;color:var(--kh,#cbd5e0);box-shadow:inset 0 0 0 1.5px currentColor;white-space:nowrap}
.pille{min-height:36px;padding:0 12px;border:0;border-radius:18px;background:#3b475c;color:var(--tx);font:inherit;font-size:13px;cursor:pointer;white-space:nowrap}
.pille.an{background:var(--btn);color:#fff;font-weight:700}
.warn{color:#fc8181;font-weight:800;font-variant-numeric:tabular-nums}
.rot{color:#fc8181}
.vor{box-shadow:inset 0 3px 0 #22c55e !important}
.nach{box-shadow:inset 0 -3px 0 #22c55e !important}

/* ---------- Bestellungen ---------- */
/* PC: Liste | Fahrer, darunter die gewaehlte Bestellung (kurzer Weg zum Ziehen) | Karte ueber die ganze Hoehe */
.best{flex:1;min-height:0;display:grid;grid-template-columns:var(--b-liste,380px) var(--b-fahrer,400px) minmax(0,1fr);grid-template-rows:auto minmax(0,1fr);height:100%;position:relative}
.best>.b-liste{grid-column:1;grid-row:1/3}
.best>.b-mitte{display:contents}
.best>.b-fahrer{grid-column:2;grid-row:1;max-height:55vh}
.best .b-detail{grid-column:2;grid-row:2;overflow:auto;margin:0 12px 12px;border-right:0}
.best .b-karte{grid-column:3;grid-row:1/3;margin:12px;min-height:0;flex:none}
.b-liste{overflow:auto;padding:14px 12px;display:flex;flex-direction:column;gap:10px;border-right:1px solid var(--ln);background:var(--panel)}
.b-filter{display:flex;gap:6px;flex-wrap:wrap}
.abschnitt-titel{font-size:12px;font-weight:800;letter-spacing:.8px;color:var(--mu);padding:6px 4px 0}
.abschnitt-titel.rot{color:#fc8181}
.b-mitte{min-width:0;min-height:0;display:flex;flex-direction:column;gap:12px;padding:12px;overflow:auto}
.b-karte{flex:0 0 50vh;min-height:280px;display:flex}
.b-karte .karte{flex:1}
.b-detail{background:var(--panel);border-radius:12px;padding:16px;display:flex;flex-direction:column;gap:10px}
.b-detail .dkopf{display:flex;align-items:center;gap:10px;flex-wrap:wrap}
.b-detail .dkopf .zu{display:none}
.dinfo{display:flex;flex-direction:column;gap:4px}
.dpos{display:flex;flex-direction:column;gap:3px;font-size:15px}
.dpos>div{display:flex;gap:10px;justify-content:space-between}
.dpos .summe{font-weight:800;border-top:1px solid var(--ln);padding-top:6px;margin-top:2px}
.minuten{display:flex;flex-wrap:wrap;gap:8px;background:transparent;padding:0}
.minuten .b{min-height:52px;font-weight:800}
.aktionen{display:flex;flex-wrap:wrap;gap:8px;align-items:center}
.b-fahrer{overflow:auto;padding:12px;display:flex;flex-direction:column;gap:10px;border-right:1px solid var(--ln)}
.b-umschalter{display:none}
.bkarte{background:rgba(255,255,255,.06);border-radius:10px;padding:10px 12px;display:flex;flex-direction:column;gap:5px;cursor:pointer;user-select:none;-webkit-user-select:none}
.bkarte.ziehbar{cursor:grab}
.bkarte.an{box-shadow:inset 0 0 0 2px #E2A03D}
.bkarte.spaet .zeit{color:#fc8181}
.bkarte.wartet{box-shadow:inset 0 0 0 2px #fc8181}
.bkarte .oben,.bkarte .unten{display:flex;align-items:center;gap:6px;flex-wrap:wrap}
.bkarte .nr{font:800 18px/1 system-ui,sans-serif}
.bkarte .zeit{font-weight:700;color:#fbd38d;font-size:14px}
.bkarte .adr{font-weight:600;font-size:15px}
.bkarte .unten{font-size:13px}
.tpos{width:24px;height:24px;border-radius:50%;color:#1a202c;font-weight:800;font-size:13px;display:inline-flex;align-items:center;justify-content:center}
.tourblock .tzeit{font-size:15px;font-weight:800;color:#fbd38d}
.tourblock .tzeit.jetzt{color:#fc8181}
.fahrerbox.ablage-an,.tourblock.ablage-an,.b-liste.ablage-an{outline:3px solid #22c55e;outline-offset:-3px}
@media (max-width:1300px){
  /* Tablet: rechts untereinander Karte, Fahrer, Bestellung (scrollen gemeinsam), die Liste bleibt stehen */
  .best{grid-template-columns:var(--b-liste,360px) minmax(0,1fr);grid-template-rows:max-content max-content max-content;align-content:start;overflow:auto;height:100%}
  .spalten-griff.nur-breit{display:none}
  .best>.b-liste{grid-column:1;grid-row:1/4;position:sticky;top:0;max-height:calc(100vh - 64px)}
  .best>.b-mitte{display:contents}
  .best .b-karte{grid-column:2;grid-row:1;margin:12px 12px 0;min-height:50vh;height:50vh}
  .best>.b-fahrer{grid-column:2;grid-row:2;overflow:visible;border-right:0;padding:12px 12px 0;max-height:none}
  .best .b-detail{grid-column:2;grid-row:3;margin:12px;overflow:visible}
}
@media (max-width:700px){
  .b-umschalter{display:flex;gap:6px;padding:8px 10px;border-bottom:1px solid var(--ln)}
  .best{display:flex;flex-direction:column}
  .best>*,.best>.b-mitte{display:none}
  .b-karte,.b-detail{margin:0}
  .best[data-ansicht=liste] .b-liste{display:flex;border:0}
  .best[data-ansicht=karte] .b-mitte,.best[data-ansicht=fahrer] .b-fahrer{display:flex}
  .best[data-ansicht=karte] .b-detail{display:none}
  .best[data-ansicht=karte] .b-karte{flex:1 1 auto;min-height:60vh}
  .best.detail-offen .b-mitte{display:flex;position:fixed;inset:0;z-index:50;background:var(--grund)}
  .best.detail-offen .b-karte{display:none}
  .best.detail-offen .b-detail{display:flex}
  .b-detail .dkopf .zu{display:inline-flex}
}

/* ---------- Popup Web-Shop und Hinweis anderer Kanaele ---------- */
.webshop-popup{max-width:min(680px,calc(100% - 24px))}
.webshop-popup .oben{display:flex;align-items:center;gap:10px;flex-wrap:wrap}
.webshop-popup .gross{font-size:19px}
.webshop-popup .b.gross{min-height:60px;font-size:18px}
.kanal-hinweis{position:fixed;right:20px;top:76px;z-index:60;width:min(360px,calc(100% - 40px));border-radius:12px;padding:12px 14px;display:flex;flex-direction:column;gap:4px;color:var(--tx)}
.kanal-hinweis .oben{display:flex;align-items:center;gap:8px}

/* ---------- Uebersicht ---------- */
.ue{flex:1;min-height:0;display:grid;grid-template-columns:minmax(0,1fr) min(var(--ue-rechts,500px),calc(100% - 360px));height:100%;position:relative}
.ue-haupt{min-width:0;display:flex;flex-direction:column;border-right:1px solid var(--ln)}
.ue-kopf{display:flex;align-items:center;gap:10px;padding:12px 16px;flex-wrap:wrap}
.ue-kopf input[type=search]{width:min(300px,100%)}
.ue-zahlen{display:flex;align-items:baseline;gap:18px;flex-wrap:wrap;padding:0 16px 8px;color:var(--tx2)}
.ue-zahlen b{color:var(--tx)}
.ue-zahlen .gross{font-size:22px}
.ue-diff{color:#68d391;font-weight:700}
.ue-diff.neg{color:#fc8181}
.warn-pille{background:#b45309;color:#fff;font-weight:700}
.ue-filter{display:flex;flex-direction:column;gap:6px;padding:0 16px 10px;border-bottom:1px solid var(--ln)}
.ue-seg{display:flex;gap:6px;flex-wrap:wrap}
.ue-liste{flex:1;overflow:auto;display:flex;flex-direction:column}
.ue-zeile{display:flex;align-items:center;gap:12px;min-height:62px;padding:8px 16px;border:0;background:transparent;border-bottom:1px solid rgba(255,255,255,.06);color:var(--tx);font:inherit;text-align:left;cursor:pointer}
.ue-zeile.an{box-shadow:inset 4px 0 0 #E2A03D}
.ue-zeile.storno{opacity:.55}
.ue-zeile .kchip{width:92px;justify-content:center}
.ue-zeit{display:flex;flex-direction:column;width:52px}
.ue-zeit small{color:var(--mu)}
.ue-wer{flex:1;min-width:0;display:flex;flex-direction:column}
.ue-wer b{font-weight:600;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.ue-wer small{color:var(--mu)}
.ue-wer small.warn{color:#fbd38d;font-weight:600}
.ue-betrag{display:flex;flex-direction:column;align-items:flex-end;gap:4px}
.ue-stand{font-size:12px;font-weight:700;padding:2px 8px;border-radius:999px;color:#fff}
.ue-rechts{overflow:auto;padding:14px 18px;display:flex;flex-direction:column;gap:10px}
.ue-kartenrahmen{position:relative;height:var(--ue-karte,260px);flex:none;display:flex;margin-bottom:6px}
.ue-kartenrahmen .karte{flex:1}
.ue-kartenwahl{position:absolute;left:10px;bottom:28px;display:flex;gap:6px;z-index:3}
.ue-kartenzahl{position:absolute;left:10px;top:10px;font-size:12px;background:rgba(17,24,39,.8);padding:4px 8px;border-radius:8px;z-index:3}
.ue-gross{display:flex;align-items:baseline;gap:12px;flex-wrap:wrap}
.ue-gross b{font-size:30px}
.ue-rechts h3{margin:4px 0 0;font-size:14px;color:var(--mu)}
.ue-balken-reihe{display:flex;align-items:flex-end;gap:5px;height:64px}
.ue-balken{flex:1;border-radius:3px 3px 0 0;background:#4a5870}
.ue-balken.top{background:#68d391}
.ue-achse{display:flex;justify-content:space-between;font-size:12px;color:var(--mu)}
.ue-stapel{display:flex;height:14px;border-radius:7px;overflow:hidden;background:#2d3748}
.ue-kanal{display:flex;align-items:center;gap:10px;font-size:14px}
.ue-kanal i{width:12px;height:12px;border-radius:3px}
.ue-kacheln{display:grid;grid-template-columns:repeat(auto-fill,minmax(130px,1fr));gap:8px}
.ue-kacheln .card{padding:10px;display:flex;flex-direction:column;gap:2px}
.ue-info{display:grid;grid-template-columns:auto 1fr;gap:4px 12px;font-size:14px}
@media (max-width:1100px){
  .ue{display:flex;flex-direction:column;overflow:auto}
  .ue-haupt{border-right:0}
  .ue-liste,.ue-rechts{overflow:visible}
}

/* ---------- Kueche (Raster grosser Karten) ---------- */
.k-kopf{display:flex;align-items:center;gap:14px;flex-wrap:wrap}
.k-zahlen{display:flex;align-items:center;gap:14px;font-size:15px;color:var(--tx2);flex-wrap:wrap}
.k-zahlen b{color:var(--tx)}
.kueche.k-neu{display:flex;gap:14px;padding:14px;overflow:auto;position:relative}
.kueche.k-neu .zumachen{width:var(--k-summe,260px);flex:none}
.k-raster{flex:1;min-width:0;display:grid;grid-template-columns:repeat(auto-fill,minmax(min(260px,100%),1fr));gap:12px;align-content:start}
.kueche.k-neu .kkarte{padding:0;overflow:hidden;background:var(--panel);border-radius:12px;display:flex;flex-direction:column;gap:0}
.kkarte .k-band{display:flex;align-items:center;gap:8px;padding:8px 12px;color:#fff;background:rgba(255,255,255,.07);border-bottom:1px solid var(--ln)}
.kkarte .k-band .nr{font:800 22px/1 system-ui,sans-serif}
.kkarte .k-band .zeit{color:#fff;font-weight:800;font-size:18px}
.kkarte .k-kanal{font-size:12px;font-weight:800;letter-spacing:.5px}
.kueche.k-neu .kkarte .oben{padding:8px 12px 0}
.kkarte .k-inhalt{padding:8px 12px;display:flex;flex-direction:column;gap:6px;flex:1}
.kkarte .k-inhalt .line{font-size:18px}
.kkarte .k-knopf{margin:0 10px 10px;min-height:56px;font-size:18px;font-weight:800}
.kkarte .k-knopfreihe{padding:0 10px 10px;gap:8px}
.kkarte .k-knopfreihe .k-knopf{margin:0;flex:1}
.kkarte.vor{opacity:.5}
.kkarte.st-fertig{opacity:.6}
.kueche.k-neu .kkarte.spaet{box-shadow:0 0 0 3px #fc8181}
@media (max-width:700px){.kueche.k-neu{flex-direction:column}.k-raster{grid-template-columns:1fr}}

/* ---------- Verwaltung (Menue links) ---------- */
.verw{flex:1;min-height:0;display:grid;grid-template-columns:var(--v-menue,290px) minmax(0,1fr);height:100%;position:relative}
.v-menue{border-right:1px solid var(--ln);padding:16px 12px;display:flex;flex-direction:column;gap:4px;overflow:auto;background:var(--panel)}
.v-menue h1{margin:0 0 6px 8px}
.v-gruppe{font-size:12px;font-weight:800;letter-spacing:.8px;color:var(--mu);padding:12px 8px 4px}
.v-punkt{min-height:48px;padding:0 12px;border-radius:10px;display:flex;align-items:center;gap:10px;text-decoration:none;color:var(--tx)}
.v-punkt span:first-child{flex:1}
.v-punkt.an{background:var(--sel);color:var(--selt);font-weight:700}
.warn-chip{background:#b45309;color:#fff;font-size:12px}
.v-inhalt{overflow:auto;padding:20px 24px;display:flex;flex-direction:column;gap:16px}
.v-inhalt>.block{max-width:900px}
.kanalzeile{background:rgba(255,255,255,.04);border-radius:10px;padding:10px 12px;border-top:0;margin-bottom:8px}
@media (max-width:700px){.verw{display:flex;flex-direction:column;overflow:auto}.v-menue{border-right:0;border-bottom:1px solid var(--ln)}.v-inhalt{overflow:visible;padding:14px}}

/* ---------- Speisekarte ---------- */
.sk-gruppe,.sk-art{user-select:none;-webkit-user-select:none;cursor:grab}
.sk-farbe{width:14px;height:14px;border-radius:4px;flex:none;display:inline-block}
.sk-art{display:flex;flex-direction:row;align-items:center;gap:10px;min-height:58px;padding:6px 10px;width:100%;text-align:left}
.sk-art:nth-child(odd){filter:brightness(1.1)}
.sk-art.aus{opacity:.5}
.sk-mini{width:44px;height:44px;border-radius:8px;object-fit:cover;flex:none}
.sk-mini.leer{display:inline-flex;align-items:center;justify-content:center;background:#3b475c;font-size:9px;color:var(--mu);text-align:center}
.sk-plu{min-width:40px;text-align:center;font-size:13px;font-weight:800;padding:3px 6px;border-radius:6px;background:#3b475c;color:#fff !important}
.sk-name{flex:1;min-width:0;display:flex;flex-direction:column}
.sk-name b{font-weight:600}
.sk-name small{font-size:12px;color:var(--mu)}
.sk-name small.rot{color:#fc8181;font-weight:700}
.sk-name small.gelb{color:#fbd38d}
.sk-farbwahl{display:flex;gap:8px;flex-wrap:wrap}
.sk-farbknopf{width:40px;height:40px;border-radius:50%;border:0;cursor:pointer;color:var(--tx);background:#3b475c}
.sk-farbknopf.an{box-shadow:0 0 0 3px #fff}
.sk-fokus{position:relative;height:320px;border-radius:12px;overflow:hidden;background:#111827;touch-action:none;cursor:crosshair}
.sk-fokusbild{width:100%;height:100%;object-fit:contain;pointer-events:none}
.sk-ausschnitt{position:absolute;border:3px solid #fff;border-radius:6px;box-shadow:0 0 0 2000px rgba(0,0,0,.45);pointer-events:none}
.sk-kreuz{position:absolute;width:24px;height:24px;margin:-12px 0 0 -12px;border-radius:50%;border:3px solid #fff;background:rgba(255,255,255,.25);pointer-events:none}
.sk-fokus-hilfe{position:absolute;left:10px;bottom:10px;font-size:12px;background:rgba(17,24,39,.8);padding:4px 8px;border-radius:6px;pointer-events:none}
.sk-zoom{display:flex;align-items:center;gap:12px;flex-direction:row}
.sk-zoom input{flex:1}
.sk-vorschauen{display:flex;gap:14px;align-items:flex-end;flex-wrap:wrap}
.sk-vorschau{display:flex;flex-direction:column;gap:4px}
.sk-v{overflow:hidden;border-radius:10px;background:#111827}
.sk-v img{width:100%;height:100%;display:block}
.sk-v.v43{width:200px;height:150px}
.sk-v.v11{width:96px;height:96px}
.sk-v.v169{width:128px;height:72px}

/* Fahrer antippen: Tour zeigen */
.fahrerbox{cursor:pointer}
.fahrerbox.an{box-shadow:inset 0 0 0 2px #E2A03D}
.tourstopps{margin:0;padding:0;list-style:none;display:flex;flex-direction:column;gap:6px}
.tourstopps li{display:flex;align-items:center;gap:8px;padding:8px 10px;border-radius:10px;background:var(--grund);cursor:pointer;font-size:14px;flex-wrap:wrap}
.tourstopps .zeit{color:#fbd38d;font-weight:700}

/* Kopfzeile: Reiter (z. B. Speisekarte) bleiben in einer Zeile und scrollen seitlich statt aus der Leiste zu laufen */
.kopf-extra{min-width:0;overflow-x:auto;scrollbar-width:none}
.kopf-extra::-webkit-scrollbar{display:none}
.kopf-extra .segment{flex-wrap:nowrap}
.kopf-extra .b{white-space:nowrap;min-height:44px}
@media (max-width:1000px){.kopf .seite,.kopf .uhr{display:none}}

/* ---------- Spaltenbreite per Griff, Schriftgroesse, Kopfzeile auf schmalen Bildschirmen (20.10.2026) ---------- */
.spalten-griff{position:absolute;width:12px;z-index:20;cursor:col-resize;touch-action:none}
.spalten-griff::after{content:'';position:absolute;left:5px;top:0;bottom:0;width:2px;background:transparent;transition:background .15s}
.spalten-griff:hover::after,.spalten-griff.zieht::after,.spalten-griff:focus-visible::after{background:#3fb27f}
/* Hoehe ziehen (Karte): Leiste an der Unterkante, immer sichtbar als kleiner Strich */
.hoehen-griff{position:absolute;left:0;right:0;bottom:-10px;height:16px;z-index:4;cursor:row-resize;touch-action:none;display:flex;align-items:center;justify-content:center}
.hoehen-griff::after{content:'';width:48px;height:5px;border-radius:3px;background:#4a5870;transition:background .15s}
.hoehen-griff:hover::after,.hoehen-griff.zieht::after,.hoehen-griff:focus-visible::after{background:#3fb27f;width:100%;height:3px}
.schrift-reihe{display:flex;align-items:center;justify-content:center;gap:16px}
.schrift-reihe .b{min-width:72px;font-size:20px;font-weight:800}
.schrift-wert{font-size:22px;min-width:80px;text-align:center}
.schrift-knopf{font-weight:800;min-width:44px}
@media (max-width:1200px){
  /* Werkzeuge der Seite (Reiter, Display-Wahl, Suche) in eine eigene Zeile unter der Kopfzeile, seitlich scrollbar */
  .kopf{flex-wrap:wrap;height:auto;min-height:56px;row-gap:6px;padding:6px 8px}
  .kopf-extra{order:10;flex:1 1 100%;padding-bottom:2px}
  .kopf-extra:empty{display:none}
  .kopf .wer{display:none}
  .kopf .b{min-height:40px;padding:0 12px}
}
@media (max-width:700px){
  .spalten-griff{display:none}
  .koerper .rail{overflow-x:auto;scrollbar-width:none}
  .koerper .rail::-webkit-scrollbar{display:none}
  .rail a{flex:0 0 auto;min-width:68px}
  .kueche.k-neu .zumachen{width:auto;max-height:32vh;overflow:auto}
  .ue-zeile{flex-wrap:wrap;gap:6px 10px}
  .ue-zeile .kchip{width:auto}
  .ue-wer{flex:1 1 100%;order:3}
  .ue-wer b{white-space:normal}
  .ue-betrag{margin-left:auto}
}

/* Kopfzeile nie abschneiden (auch bei grosser Schrift): bei Platzmangel zweite Zeile */
.kopf{height:auto;min-height:64px;flex-wrap:wrap;row-gap:6px}

/* Kueche: "In Arbeit" kraeftig blau (nur Vorbestellungen, die noch nicht dran sind, grau und blass) */
.b.k-start{background:#2563eb;color:#fff}
.b.k-start:active{background:#1d4ed8}

/* Zu machen: Bons je Gericht wie in Kass */
.zm{align-items:flex-start}
.zm-name{display:flex;flex-direction:column;gap:6px;flex:1;min-width:0}
.zm-bons{display:flex;flex-wrap:wrap;gap:4px}
.zm-bon{display:inline-flex;gap:4px;align-items:center;font-size:12px;padding:2px 7px;border-radius:999px;border:1.5px solid;background:rgba(0,0,0,.25)}
.zm-bon b{color:var(--tx)}

/* Kueche: Abschnitte Neu / In Arbeit / Fertig, Monitor-Filter, kleiner Zurueck-Knopf, "in Arbeit" je Gericht (wie Kass) */
.k-abschnitt{grid-column:1/-1;display:flex;align-items:center;gap:8px;font-size:13px;font-weight:800;letter-spacing:.8px;color:var(--mu);padding:4px 2px 0}
.k-abschnitt.neu span:first-child{color:#93c5fd}
.k-abschnitt.arbeit span:first-child{color:#fbd38d}
.k-abschnitt.fertig span:first-child{color:#68d391}
.k-filter{grid-column:1/-1;display:flex;gap:6px;flex-wrap:wrap}
.k-knopfreihe{display:flex;align-items:center;gap:8px}
.k-zurueck{min-height:44px;min-width:44px;padding:0;font-size:18px}
.zm-zahl{display:flex;flex-direction:column;align-items:flex-end;gap:2px}
.zm-arbeit{font-size:11px;font-weight:700;color:#fbd38d;white-space:nowrap}
.voll{flex-basis:100%}

/* Kueche: Karten nie abschneiden (Knopf blieb bei langen Bons verdeckt) */
.k-raster{grid-auto-rows:max-content}
.k-raster>.kkarte{min-height:max-content}

/* ---------- Einstellungen (Entwurf 21.10.2026): 8 farbige Bereiche, links mit Suche, rechts Kopf mit Reitern ---------- */
.shop-knopf{background:#475569;color:#fff}
.shop-knopf[data-stand=offen]{background:#16a34a}
.shop-knopf[data-stand=pause]{background:#c2410c}
.einst{flex:1;min-height:0;display:grid;height:100%;position:relative}
/* A · Bereiche */
.einst-a{grid-template-columns:var(--ea-liste,290px) minmax(0,1fr)}
.ea-liste{background:var(--panel);border-right:1px solid var(--ln);padding:16px 12px;display:flex;flex-direction:column;gap:6px;overflow:auto}
.ea-liste h1{margin:0 0 8px 8px;font-size:22px}
.ea-suche{min-height:44px;margin-bottom:6px;padding:0 12px;font:inherit}
.ea-eintraege{display:flex;flex-direction:column;gap:6px}
.ea-treffer{font-size:12px;font-weight:600;opacity:.85}
.ea-leer{margin:6px 8px}
.ea-bereich{display:flex;align-items:center;gap:10px;min-height:54px;padding:0 12px;border-radius:12px;text-decoration:none;color:var(--tx);font-weight:600}
.ea-bereich:hover{background:var(--gt)}
.ea-bereich:focus-visible{outline:3px solid var(--ring);outline-offset:1px}
.ea-farbe{width:12px;height:30px;border-radius:4px;background:var(--g);flex:none}
.ea-name{flex:1;min-width:0;display:flex;flex-direction:column;line-height:1.25}
.ea-stand{font-size:12px;font-weight:700}
.ea-bereich.an{background:var(--g);color:#fff}
.ea-bereich.an .ea-farbe{background:#fff}
.ea-rechts{display:flex;flex-direction:column;min-height:0;overflow:auto}
.ea-rechts.breit{overflow:hidden}
.ea-kopf{display:flex;align-items:center;gap:12px;flex-wrap:wrap;padding:18px 24px;background:linear-gradient(90deg,var(--gt),transparent 80%);border-bottom:4px solid var(--g);flex:none}
.ea-kopf h2{margin:0;font-size:22px;color:#fff}
.ea-kopf div span{color:var(--tx2)}
.ea-kopf .ea-chip{background:var(--g);color:#fff;font-size:13px}
.ea-reiter{padding:12px 24px 0;flex:none}
.ea-reiter .b.an{background:var(--g)}
.ea-feld{padding:16px 24px 24px;display:flex;flex-direction:column;gap:16px;flex:1 0 auto}
.ea-feld>.block,.ea-feld>.raster,.ea-feld>.ws-spalte{max-width:1100px}
.ea-feld.breit{padding:0;flex:1 1 0;min-height:0;display:flex}
/* B · Eine Seite (hell) */
/* Bestellannahme & Druck */
.anb{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(440px,100%),1fr));gap:16px;align-items:start;max-width:1200px}
.anb h3{margin:6px 0 0;font-size:16px}
.an-fuss{grid-column:1/-1;display:flex;gap:12px;align-items:center;justify-content:flex-end;flex-wrap:wrap}
.an-modus{display:flex;flex-direction:column;gap:8px}
.an-wahl{display:flex;gap:12px;align-items:flex-start;text-align:left;padding:12px 14px;border-radius:12px;border:0;background:var(--feld);color:var(--tx);box-shadow:inset 0 0 0 1px var(--ln);cursor:pointer;font:inherit}
.an-wahl span{display:flex;flex-direction:column;gap:2px}
.an-wahl small{color:var(--mu)}
.an-wahl:focus-visible{outline:3px solid #ea7317;outline-offset:2px}
.an-punkt{width:18px;height:18px;border-radius:50%;box-shadow:inset 0 0 0 2px var(--mu);flex:none;margin-top:2px}
.an-wahl.an{box-shadow:inset 0 0 0 2px #ea7317;background:rgba(234,115,23,.14)}
.an-wahl.an .an-punkt{box-shadow:inset 0 0 0 5px #ea7317}
.an-zeiten{display:flex;flex-direction:column;gap:8px;align-items:flex-start}
.an-zeiten[hidden]{display:none}
.an-fenster{display:flex;flex-wrap:wrap;align-items:center;gap:8px;padding:8px;border-radius:10px;background:var(--panel);align-self:stretch}
.an-tage{display:flex;gap:4px;flex-wrap:wrap}
.an-tag{min-width:42px;min-height:42px;border-radius:8px;border:0;background:var(--chip);color:var(--tx);font-weight:700;cursor:pointer;font:inherit}
.an-tag.an{background:#ea7317;color:#fff}
.an-uhr{display:flex;align-items:center;gap:6px}
.an-uhr input{min-height:42px;width:7.5em;padding:0 8px;font:inherit}
.an-minuten{display:flex;gap:12px;flex-wrap:wrap}
.an-minuten label{display:flex;flex-direction:column;gap:4px}
.an-minuten select{min-height:46px;min-width:9em;padding:0 10px;font:inherit}
.an-druck{display:flex;flex-direction:column;gap:6px}
.an-zeile{display:flex;align-items:center;gap:10px;padding:8px 10px;border-radius:10px;background:var(--panel);flex-wrap:wrap}
.an-zeile .kchip{min-width:92px;justify-content:center}
.an-zeile.aus{opacity:.6}
.an-art{flex:1;min-width:110px;display:flex;flex-direction:column;font-weight:600}
.an-art small{color:var(--mu);font-size:12px;font-weight:500}
.an-anzahl{font-size:13px;color:var(--tx2);text-align:right}
.an-stepper{display:flex;align-items:center;gap:4px;margin-left:auto}
.an-stepper .b{min-width:42px;padding:0;font-size:20px}
.an-stepper b{width:24px;text-align:center;font-size:18px}
@media (max-width:700px){
  .einst-a{display:flex;flex-direction:column;overflow:auto}
  .ea-liste{flex-direction:row;overflow-x:auto;border-right:0;border-bottom:1px solid var(--ln);padding:8px;flex:none;scrollbar-width:none}
  .ea-liste h1{display:none}
  .ea-suche{flex:0 0 170px;margin:0}
  .ea-eintraege{flex-direction:row}
  .ea-bereich{flex:0 0 auto;min-height:48px}
  .ea-rechts,.ea-rechts.breit{overflow:visible}
  .ea-kopf{padding:12px 14px}
  .ea-reiter{padding:10px 14px 0;overflow-x:auto;flex-wrap:nowrap}
  .ea-feld{padding:12px 14px 20px}
  .ea-feld.breit{height:auto;min-height:80vh}
  .an-anzahl{flex-basis:100%;text-align:left;order:5}
}

/* Kueche (21.10.2026): Spalten wie Kass - Zu machen | NEU | IN ARBEIT; Tour je Bon unter dem Gericht */
.k-bons{flex:1;min-width:0;display:flex;flex-direction:column;gap:10px}
.k-spalten{flex:1;min-height:0;display:grid;grid-template-columns:var(--k-neu,minmax(0,1fr)) minmax(240px,1fr);gap:14px;align-items:start;position:relative}
.k-filterleiste:empty{display:none}
.k-spalte{display:flex;flex-direction:column;gap:8px;min-width:0;border-radius:12px;padding:8px;background:rgba(255,255,255,.03)}
.k-spalte.neu{box-shadow:inset 0 3px 0 #3b82f6}
.k-spalte.arbeit{box-shadow:inset 0 3px 0 #f6ad55}
.k-spalte .k-raster{grid-template-columns:repeat(auto-fill,minmax(min(240px,100%),1fr))}
.k-leer{padding:12px 4px}
.zm-bon span{white-space:nowrap}
.zm-tour{font-size:11px;font-weight:800;color:#1a202c;border-radius:6px;padding:0 5px;white-space:nowrap}
@media (max-width:900px){.k-spalten{grid-template-columns:1fr}.k-spalten>.spalten-griff{display:none}}

/* Kueche: Stand der anderen Stationen oben im Bon (wie Kass) */
.kueche.k-neu .kkarte .andere{display:flex;flex-direction:column;gap:3px;padding:6px 12px 0}
.aline{padding:4px 8px;border-radius:6px;font-size:.9em}
.aline.wait{background:#44403c;color:#fcd34d}
.aline.ok{background:#14532d;color:#bbf7d0}

/* Fahrer-Stand (wie Kass): frei / wartet / unterwegs / Rueckweg */
.fstand{padding:6px 10px;border-radius:8px;font-size:13px;font-weight:600;background:#3b475c;color:var(--tx)}
.fstand.unterwegs{background:#1e3a8a;color:#dbeafe}
.fstand.rueckweg{background:#14532d;color:#bbf7d0}
.fstand.wartet{background:#44403c;color:#fcd34d}
.fstand.gross{font-size:15px;padding:10px 12px}
.chip.fs-unterwegs{background:#2563eb;color:#fff}.chip.fs-rueckweg{background:#16a34a;color:#fff}.chip.fs-wartet{background:#b45309;color:#fff}
.f-summe{display:flex;flex-wrap:wrap;gap:6px 14px;font-size:14px;color:var(--mu)}
.f-summe b{color:var(--tx)}
.f-kurz{opacity:.75;font-weight:500}
.f-heute{display:flex;flex-direction:column;gap:6px;padding:12px 14px}
.f-heute h2,.f-heute h3{margin:0;font-size:16px}
.f-hzeile{display:flex;align-items:center;gap:8px;font-size:14px}
.f-hzeile .zeit{color:var(--mu);min-width:3.2em}
.f-nr{display:flex;gap:8px}
.f-nr input{flex:1;min-width:0;min-height:48px;font-size:18px;padding:0 12px}
.f-stopp{display:inline-flex;align-items:center;justify-content:center;min-width:30px;height:30px;border-radius:50%;background:var(--btn);color:#fff;font-weight:800}
.f-pfeile{display:flex;gap:6px;justify-content:flex-end}
.f-pfeile .b{min-width:44px;padding:0;font-size:18px}

/* ---------- Anmeldung mit Benutzername, Rollen & Rechte, E-Mail (Entwurf 21.10.2026) ---------- */
.card.anm{max-width:440px;border-radius:16px;padding:32px;gap:18px}
.anm h1{font-size:26px}
.anm p{margin:0;line-height:1.5}
.anm .b{min-height:52px;font-size:17px}
.anm .b.klein{min-height:44px;font-size:14px}
.anm-merken{box-shadow:none;padding:0;font-size:15px;font-weight:500}
.anm-merken input{width:22px;height:22px;accent-color:var(--ring)}
.anm-link{align-self:center;box-shadow:none!important;color:var(--am)!important;min-height:44px}
.anm-symbol{width:56px;height:56px;border-radius:50%;background:var(--sel);color:var(--am);display:flex;align-items:center;justify-content:center;font-size:28px}
b.hell{color:var(--tx)}
.pw-zeile{display:flex;gap:8px}
.pw-zeile input{flex:1;min-width:0}
.pw-auge{width:52px;padding:0;display:inline-flex;align-items:center;justify-content:center;flex:none}
.pw-auge[aria-pressed="true"]{color:var(--am)}
.pw-regeln{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:6px;font-size:14px;color:var(--mu)}
.pw-regeln li::before{content:'○';display:inline-block;width:20px;font-weight:800}
.pw-regeln li.ok{color:var(--selt)}
.pw-regeln li.ok::before{content:'✓';color:var(--am)}
.anm-pin{gap:16px}
.anm-wer{display:flex;align-items:center;gap:12px;background:var(--grund);border-radius:14px;padding:12px 14px}
.anm-avatar{width:44px;height:44px;border-radius:50%;background:var(--sel);color:var(--selt);display:flex;align-items:center;justify-content:center;font-weight:800;font-size:18px;flex:none}
.anm-wername{flex:1;display:flex;flex-direction:column;gap:2px;min-width:0}
.anm-wername b{overflow:hidden;text-overflow:ellipsis}
.anm-wername small{font-size:13px;color:var(--mu)}
.anm-hinweis{font-size:15px;font-weight:600;color:var(--tx2)}
.pin-punkte{display:flex;justify-content:center;gap:18px;min-height:18px}
.pin-punkte i{width:18px;height:18px;border-radius:50%;box-shadow:inset 0 0 0 2px var(--ln)}
.pin-punkte i.an{background:var(--am);box-shadow:none}
.pad button.ok{background:var(--btn);color:#fff;font-size:17px}
.pad button.leise{background:transparent;color:var(--tx2);font-size:16px}
.chip.anm-art.pw{background:#4a3b1f;color:#fbd38d}
.chip.anm-art.pin{background:var(--sel);color:var(--selt)}
.chip.warn{background:#4a3b1f;color:#fbd38d}
.dlg.mittel{max-width:min(680px,calc(100% - 24px))}
.bn-zeile .name small{font-weight:500}
.bn-rollen{gap:8px}
.b.rolle-chip{min-height:44px;border-radius:22px;background:#3b475c;color:var(--tx);padding:0 18px}
.b.rolle-chip.an{background:var(--sel);color:var(--selt);box-shadow:inset 0 0 0 2px var(--ring)}
.bn-kasten{display:flex;flex-direction:column;gap:14px;background:var(--grund);border-radius:14px;padding:16px}
.bn-kopf{display:flex;align-items:center;gap:10px;color:var(--tx2);font-size:14px}
.bn-kasten .haken.multi{box-shadow:none;padding:0;align-items:flex-start;color:var(--tx);font-weight:500}
.bn-kasten .haken.multi input{width:22px;height:22px;margin-top:1px;flex:none;accent-color:var(--ring)}
/* Rollen & Rechte: links die Rollen, rechts die Rechte in Gruppen */
.rr{display:flex;flex-wrap:wrap;gap:20px;align-items:flex-start;padding:16px 24px 24px;overflow:auto;width:100%}
.rr-links{flex:1 1 240px;max-width:320px;display:flex;flex-direction:column;gap:10px}
.rr-rolle{min-height:64px;border:0;border-radius:14px;padding:10px 14px;display:flex;align-items:center;justify-content:space-between;gap:10px;cursor:pointer;font:inherit;color:var(--tx);background:var(--panel);text-align:left}
.rr-rolle.an{background:var(--sel);box-shadow:inset 0 0 0 2px var(--ring)}
.rr-rolle:focus-visible{outline:3px solid var(--ring);outline-offset:2px}
.rr-name{display:flex;flex-direction:column;gap:3px;min-width:0}
.rr-name b{font-size:17px}
.rr-name small{font-size:13px;color:var(--mu)}
.rr-neu{min-height:52px;color:var(--am)!important}
.rr-rechts{flex:999 1 520px;min-width:0;border-radius:16px;padding:24px;display:flex;flex-direction:column;gap:18px}
.rr-kopf{display:flex;flex-wrap:wrap;align-items:center;gap:12px}
.rr-kopf h2{font-size:22px;font-weight:800}
.rr-fest{margin:0;background:var(--grund);border-radius:12px;padding:12px 14px;font-size:14px;color:var(--tx2)}
.rr-gruppen{display:grid;grid-template-columns:repeat(auto-fill,minmax(280px,1fr));gap:16px}
.rr-gruppe{background:var(--grund);border-radius:14px;padding:16px;display:flex;flex-direction:column;gap:6px}
.rr-gkopf{font-size:13px;font-weight:800;letter-spacing:.6px;text-transform:uppercase;color:var(--g);padding-bottom:4px}
.rr-recht{flex-direction:row;align-items:flex-start;gap:12px;min-height:44px;padding:6px 0;cursor:pointer}
.rr-recht input{width:22px;height:22px;min-height:0;margin:2px 0 0;accent-color:var(--ring);flex:none}
.rr-recht span{display:flex;flex-direction:column;gap:2px}
.rr-recht b{font-size:15px;color:var(--tx)}
.rr-recht small{font-size:13px;font-weight:500;color:var(--mu)}
.rr-sens{margin-left:8px;font-size:12px;font-weight:700;font-style:normal;color:#fbd38d}
b.rr-sens{margin:0}
/* Sicherheit der Anmeldung, E-Mail */
.sa-raster{display:grid;grid-template-columns:repeat(auto-fill,minmax(260px,1fr));gap:16px}
.sa-karte{background:var(--grund);border-radius:14px;padding:16px;display:flex;flex-direction:column;gap:6px;color:var(--tx)}
.sa-karte b{font-size:15px}
.sa-karte small{font-size:13px;line-height:1.45;color:var(--mu);font-weight:500}
.sa-karte .b{align-self:flex-start;margin-top:4px}
.sa-schalter{flex-direction:row;align-items:flex-start;gap:14px;cursor:pointer}
.sa-schalter input{width:22px;height:22px;min-height:0;margin:2px 0 0;accent-color:var(--ring);flex:none}
.sa-schalter span{display:flex;flex-direction:column;gap:4px}
.mail-server{display:grid;grid-template-columns:2fr 1fr 1fr;gap:14px;background:var(--grund);border-radius:14px;padding:16px}
.mail-gmail{margin:0;background:#4a3b1f;color:#fbd38d;border-radius:12px;padding:12px 14px;font-size:14px;line-height:1.5}
.mail-stand{font-size:14px;font-weight:600}
.mail-stand.ok{color:var(--am)}
@media (max-width:600px){
  .card.anm{padding:24px 18px}
  .mail-server{grid-template-columns:1fr 1fr}.mail-server label:first-child{grid-column:1/-1}
  .rr{padding:12px}.rr-links{max-width:none}
}

/* Einstellungen > Web-Shop > Online-Bezahlung */
.ob-kopf{display:flex;align-items:center;gap:10px}
.ob-kopf h2{flex:1}
.chip.ob-test{background:#744210;color:#fefcbf;font-weight:700}
.chip.ob-live{background:#9b2c2c;color:#fff;font-weight:700}
.ob-liste{display:flex;flex-direction:column;gap:8px}
.ob-zeile{display:flex;align-items:center;gap:10px}
.ob-zeile span{flex:1}
.ob-punkt{width:10px;height:10px;border-radius:50%;background:#718096}
.ob-punkt.an{background:var(--gr)}
.ob-an{color:var(--gr)}
/* Kueche/Monitor: Kopf eines Stations-Abschnitts (Name, Stand, ↩, Fertig) darf nicht aus der Karte ragen.
   Schmale Karte: Name, Stand und ↩ oben (↩ bleibt weit weg von Fertig), der grosse Knopf darunter ueber die ganze Breite. */
.abschnitt{container-type:inline-size;min-width:0}
.akopf{min-width:0}
.akopf .chip{white-space:nowrap;flex:none}
.akopf strong{min-width:0;overflow-wrap:anywhere}
.akopf .b{flex:none}
@container (max-width:330px){
  .akopf{flex-wrap:wrap;row-gap:8px}
  .akopf .k-zurueck{order:1;min-width:44px;margin-left:auto}
  .akopf::after{content:'';order:2;flex-basis:100%}
  .akopf .b:not(.k-zurueck){order:3;flex:1 1 100%;min-height:48px;font-size:17px}
}

/* Bon-Karte: Strecke Lokal -> Kunde */
.bkarte .unten .km{font-weight:700;color:var(--tx2);white-space:nowrap;font-variant-numeric:tabular-nums}

/* Import & Export (Einstellungen -> Daten & Sicherung): Kacheln je Bereich, unten die Leiste. Keine Kanalfarben. */
.daten{grid-column:1/-1}
.daten [hidden]{display:none!important}
.daten-raster{display:grid;grid-template-columns:repeat(auto-fill,minmax(260px,1fr));gap:12px;margin:12px 0}
.daten-kachel{display:flex;flex-direction:column;gap:6px;text-align:left;align-items:stretch;padding:14px;border-radius:12px;box-shadow:inset 0 0 0 1px var(--ln)}
.daten-kachel.gesperrt{opacity:.55}
.daten-kopf{display:flex;flex-direction:row;justify-content:flex-start;align-items:center;gap:10px;font-size:16px;cursor:pointer}
.daten-kopf input{width:20px;height:20px;min-height:0}
.daten-zahl{font-weight:700;font-variant-numeric:tabular-nums}
.daten-filter{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}
.daten-filter select,.daten-filter input{width:100%;min-width:0}
.daten-filter label{font-size:13px}
.daten-filter label:first-child,.daten-filter .haken{grid-column:1/-1}
.daten-fuss{display:flex;gap:8px;align-items:center;justify-content:space-between;margin-top:auto;padding-top:6px}
.daten-menue{position:relative}
.daten-menue summary{list-style:none;display:inline-flex;align-items:center;cursor:pointer}
.daten-menue summary::-webkit-details-marker{display:none}
.daten-menue-liste{position:absolute;z-index:5;left:0;top:calc(100% + 4px);display:flex;flex-direction:column;gap:4px;padding:6px;border-radius:10px;background:var(--panel);box-shadow:0 4px 14px rgba(0,0,0,.3);min-width:170px}
.daten-leiste{display:flex;flex-wrap:wrap;gap:10px;align-items:flex-end;padding-top:12px;border-top:1px solid var(--ln)}
.daten-format{flex:1 1 260px}
.daten-leiste .b{white-space:normal;max-width:100%;height:auto;min-height:44px}
@media (max-width:600px){.daten-raster{grid-template-columns:1fr}.daten-leiste{flex-direction:column;align-items:stretch}.daten-format{flex:none}.daten-leiste .knoepfe .b{flex:1 1 100%}}

/* Sicherung: Ziele (Ordner, USB, Cloud-Ordner, NAS, E-Mail, WebDAV) und Speicherplatz */
.ziele{display:flex;flex-direction:column;gap:8px}
.ziele h3{margin:8px 0 0;font-size:16px}
.ziel{display:flex;gap:12px;align-items:center;justify-content:space-between;flex-wrap:wrap;padding:10px 12px;border-radius:10px;box-shadow:inset 0 0 0 1px var(--ln)}
.ziel.aus{opacity:.6}
.ziel-text{display:flex;flex-direction:column;gap:2px;min-width:0;flex:1 1 280px}
.ziel-wo{overflow-wrap:anywhere}
.ziel-knoepfe{display:flex;gap:6px;align-items:center;flex-wrap:wrap}
.speicher{margin:4px 0;font-size:14px}
.ziel-hilfe{margin:0;color:var(--mu);font-size:13px}
.ziel-dlg [hidden],.ziele [hidden]{display:none!important}
@media (max-width:600px){.ziel-knoepfe{width:100%}.ziel-knoepfe .b{flex:1 1 auto}}
/* Sicherung: "Dieses Gerät" oben in der Liste, Passwort-Dialog */
.ziel.geraet{box-shadow:inset 0 0 0 2px var(--ring)}
.ziel-dlg small.ok{color:var(--gr);font-weight:700}
.warnkasten{padding:10px 12px;border-radius:10px;background:#fef3c7;color:#92400e;font-weight:600;font-size:14px}
/* Import (Daten & Sicherung -> Import & Export): Dialog mit Vorschau */
.imp-dlg .dlg-innen{max-width:760px;width:100%}
.imp{display:flex;flex-direction:column;gap:10px;min-width:0}
.imp [hidden]{display:none!important}
.imp-datei{margin:0;overflow-wrap:anywhere}
.imp h3{margin:6px 0 0;font-size:16px}
.imp-bereich{display:flex;flex-direction:column;gap:6px;padding:10px 12px;border-radius:10px;box-shadow:inset 0 0 0 1px var(--ln)}
.imp-zahlen{display:flex;flex-wrap:wrap;gap:6px}
.imp-zahlen .chip.neu{background:#d7f2e3;color:#25734a}
.imp-zahlen .chip.geaendert{background:#fdecc8;color:#8a4b06}
.imp-zahlen .chip.aus{background:#e2e8f0;color:#3b4658}
.imp-liste summary{cursor:pointer;font-weight:600;font-size:14px}
.imp-liste ul{margin:6px 0 0;padding-left:18px;max-height:240px;overflow:auto;font-size:13px;overflow-wrap:anywhere}
.imp-liste.rot summary{color:var(--rot)}
.imp-todo{margin:0;padding-left:18px}
/* DATEV (Import & Export, Firma & Rechnung) */
.datev-zeile{display:flex;flex-wrap:wrap;gap:8px;align-items:center;justify-content:space-between}
.datev-zeile small{flex:1 1 200px}
.datev-haken{display:flex;flex-wrap:wrap;gap:8px}
.datev-haken .haken{flex:0 1 auto}
.datev h3{margin:8px 0 0;font-size:16px}
/* Einstellungen -> Web-Shop -> Kopfbild (shop-kopf.js): Regler links, Vorschau Handy/PC rechts; Masse wie im Shop */
.kv-seite{display:grid;grid-template-columns:minmax(280px,380px) minmax(0,1fr);gap:16px;align-items:start}
.kv-regeln h3{margin:6px 0 0;font-size:15px}
.kv-regler{gap:4px}
.kv-regler>span{display:flex;justify-content:space-between}
.kv-regler input[type=range]{width:100%;accent-color:#E2A03D;min-height:28px}
.kv-zahl{color:var(--tx);font-variant-numeric:tabular-nums}
.kv-stand{margin-right:auto;align-self:center}
.kv-vorschau{position:sticky;top:12px}
.kv-geraet{display:flex;flex-direction:column;gap:6px}
.kv-rahmen{width:100%;overflow:hidden;border-radius:14px}
.kv-handy{max-width:390px}
.kv-innen{transform-origin:0 0;background:#0f0d0b;font-family:"DM Sans",system-ui,sans-serif;color:#f6efe4;padding-bottom:1px}
.kv-held{position:relative;overflow:hidden;background:#1c1915;border-radius:0 0 26px 26px;touch-action:none}
.kv-pc .kv-held{border-radius:22px}
.kv-foto{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;user-select:none}
.kv-dunkel{position:absolute;inset:0;background:#0f0d0b}
.kv-konto{position:absolute;top:12px;right:14px;width:44px;height:44px;border-radius:50%;background:rgba(15,13,11,.55);border:1px solid rgba(255,255,255,.18)}
.kv-logoblock{position:absolute;transform:translate(-50%,-50%);display:flex;flex-direction:column;align-items:center;gap:8px;cursor:grab;touch-action:none}
.kv-logoblock.zieht{cursor:grabbing;outline:2px dashed #E2A03D;outline-offset:6px;border-radius:8px}
.kv-logo{width:auto;max-width:80vw;display:block;filter:drop-shadow(0 4px 14px rgba(0,0,0,.55));user-select:none;pointer-events:none}
.kv-punkt{width:8px;height:8px;border-radius:50%;background:#4ade80}
.kv-unten{margin:12px 16px 14px;background:#1c1915;border:1px solid #3a332b;border-radius:20px;padding:6px;display:flex;flex-direction:column;gap:6px;font-size:14px}
.kv-modus{display:grid;grid-template-columns:1fr 1fr;gap:6px}
.kv-modus span{height:44px;border-radius:14px;display:grid;place-items:center}
.kv-modus .an{background:#E2A03D;color:#1a1206;font-weight:700}
.kv-zeile2{display:grid;grid-template-columns:1fr 3fr;gap:6px}
.kv-status{position:absolute;top:12px;left:14px;width:44px;height:44px;border-radius:50%;border:1px solid rgba(255,255,255,.18);background:rgba(15,13,11,.55);display:grid;place-items:center}
.kv-status .kv-punkt{width:14px;height:14px;box-shadow:0 0 0 4px rgba(74,222,128,.22)}
.kv-zeile2 span{height:44px;border-radius:14px;background:#26221d;font-weight:700;display:flex;align-items:center;justify-content:center;gap:6px;white-space:nowrap}
.kv-zeile2 .kv-sterne{color:#F6C55E}
.kv-zeile2 .kv-ort{justify-content:flex-start;padding:0 10px}
@media (max-width:900px){.kv-seite{grid-template-columns:minmax(0,1fr)}.kv-vorschau{order:-1;position:sticky;top:0;z-index:3;padding:10px 12px;box-shadow:0 8px 20px rgba(0,0,0,.35)}.kv-vorschau h2,.kv-g-pc{display:none}}

/* ---------- Bewertungen aus dem Web-Shop (Kunden -> Bewertungen, Entwurf 23.10.2026) ---------- */
.segment.reiter{margin-bottom:12px;max-width:420px}
.segment.reiter .b{flex:1;display:inline-flex;align-items:center;justify-content:center;text-decoration:none}
.bw-summe{display:flex;align-items:center;gap:16px}
.bw-wert{font-size:44px;font-weight:800;line-height:1;color:#F6C55E}
.bw-liste{display:flex;flex-direction:column;gap:12px;margin-top:12px}
.bw-karte{gap:8px}
.bw-karte.schlecht{box-shadow:inset 4px 0 0 var(--rot)}
.bw-karte.aus{opacity:.65}
.bw-zeile{display:flex;align-items:center;gap:10px 16px;flex-wrap:wrap}
.bw-zeile .platz{flex:1}
.bw-sterne{color:#F6C55E;letter-spacing:1px;white-space:nowrap;display:inline-block}
.bw-sterne .leer{color:var(--ln)}
.bw-text{margin:0;white-space:pre-line;overflow-wrap:anywhere}
.bw-gerichte{display:flex;flex-wrap:wrap;gap:6px}
.bw-antwort{border-left:3px solid var(--ring);padding:2px 0 2px 10px}
.bw-antwort p{margin:2px 0 0;white-space:pre-line;overflow-wrap:anywhere}
.bw-karte .knoepfe{display:flex;gap:8px;flex-wrap:wrap;justify-content:flex-end}
.dlg textarea{width:100%;min-height:110px;border-radius:12px;border:1px solid var(--ln);padding:10px 14px;font:inherit;font-size:16px}

/* Rechnungen (nur auf Wunsch, eigener Nummernkreis R26-0001) */
.kopf-reiter{margin:0;max-width:260px}
.re-leiste{display:flex;gap:8px;align-items:center;flex-wrap:wrap}
.re-leiste input[type=search]{flex:1;min-width:180px}
.re-ansicht{display:flex;flex-direction:column;gap:12px}
.re-ansicht .ue-info{gap:6px 16px}
.re-empf{display:grid;grid-template-columns:1fr 1fr;gap:8px 12px}
.re-mail{display:flex;gap:8px;flex-wrap:wrap}
.re-mail input{flex:1;min-width:200px}
.re-kopf,.re-zeile{display:grid;grid-template-columns:64px minmax(0,1fr) 92px 76px 36px;gap:6px;align-items:center}
.re-kopf{font-size:13px;color:var(--mu)}
.re-summe{display:flex;align-items:center;gap:10px}
.re-summe b{font-size:18px}
.re-zeilen{display:flex;flex-direction:column;gap:6px}
.re-zeile input,.re-zeile select{width:100%;min-width:0}
@media (max-width:560px){
  .re-empf{grid-template-columns:1fr}
  .re-kopf{display:none}
  .re-zeile{grid-template-columns:56px 1fr 1fr 36px;padding-bottom:6px;border-bottom:1px solid var(--ln)}
  .re-zeile>:nth-child(2){grid-column:2/5}
  .re-zeile>:nth-child(3){grid-column:1/3}
}