/* Wochendispo — Oberfläche
   Kühle Graphit-Neutraltöne, Signal-Amber als einziger Akzent,
   Grün/Blau nur zur Unterscheidung von Betreuung und Auslieferung. */

:root{
  --ground:#EBEEF2; --surface:#FFFFFF; --surface-2:#F5F7F9;
  --ink:#161A21; --ink-2:#3D4653; --muted:#6C7787;
  --line:#D6DCE4; --line-soft:#E5EAF0;
  --signal:#C96412; --signal-soft:#FBEEE1; --signal-line:#EBC79E;
  --va:#3F6B1E; --va-soft:#EDF4E3; --va-line:#C4DCA8;
  --del:#2F5E93; --del-soft:#E4ECF6; --del-line:#B3C9E1;
  /* Diagrammflächen: gegen scripts/validate_palette.js geprüft */
  --mark-va:#3F7A24; --mark-del:#2F5E93;
  --warn:#A93B12; --warn-soft:#FBE9E2; --warn-line:#EBB79F;
  --ok:#186B4E; --ok-soft:#E2F1EA; --ok-line:#A8D4C0;
  /* Auftragsfarben: helle Tönung als Zeilenhintergrund, kräftiger Punkt zur Auswahl */
  --f-rot:#FBE6E1;      --f-rot-p:#C0442A;
  --f-orange:#FBEEDD;   --f-orange-p:#C87A17;
  --f-gelb:#F8F2D6;     --f-gelb-p:#9C8611;
  --f-gruen:#E7F2DE;    --f-gruen-p:#3F7A24;
  --f-tuerkis:#DEF0EE;  --f-tuerkis-p:#12756B;
  --f-blau:#E2ECF7;     --f-blau-p:#2F5E93;
  --f-lila:#EDE6F5;     --f-lila-p:#6B4E9E;
  --f-grau:#E8EAEE;     --f-grau-p:#5C6675;
  --shadow:0 1px 2px rgba(20,26,36,.05), 0 6px 18px -10px rgba(20,26,36,.18);
  --r:7px;
}
@media (prefers-color-scheme: dark){ :root:not([data-theme="light"]){
  --ground:#10141A; --surface:#191E26; --surface-2:#1F252E;
  --ink:#E7EBF0; --ink-2:#BFC8D4; --muted:#8B96A6;
  --line:#2B333E; --line-soft:#232A34;
  --signal:#E9903C; --signal-soft:#2E2114; --signal-line:#4E3620;
  --va:#8FCB63; --va-soft:#17240F; --va-line:#31481D;
  --del:#7FAEE0; --del-soft:#141F2C; --del-line:#28394D;
  --mark-va:#57A82F; --mark-del:#5590D2;
  --warn:#E8896A; --warn-soft:#2C1710; --warn-line:#4C291D;
  --ok:#63C69C; --ok-soft:#12241B; --ok-line:#27452F;
  --f-rot:#2E1712;      --f-rot-p:#E08065;
  --f-orange:#2E2112;   --f-orange-p:#E09B45;
  --f-gelb:#2A2711;     --f-gelb-p:#CBB43C;
  --f-gruen:#182611;    --f-gruen-p:#7FBF57;
  --f-tuerkis:#112625;  --f-tuerkis-p:#4FBDB0;
  --f-blau:#131F2C;     --f-blau-p:#6E9FD8;
  --f-lila:#211A2E;     --f-lila-p:#A88BD6;
  --f-grau:#1E222A;     --f-grau-p:#93A0B2;
  --shadow:0 1px 2px rgba(0,0,0,.3), 0 8px 24px -12px rgba(0,0,0,.6);
}}
:root[data-theme="dark"]{
  --ground:#10141A; --surface:#191E26; --surface-2:#1F252E;
  --ink:#E7EBF0; --ink-2:#BFC8D4; --muted:#8B96A6;
  --line:#2B333E; --line-soft:#232A34;
  --signal:#E9903C; --signal-soft:#2E2114; --signal-line:#4E3620;
  --va:#8FCB63; --va-soft:#17240F; --va-line:#31481D;
  --del:#7FAEE0; --del-soft:#141F2C; --del-line:#28394D;
  --mark-va:#57A82F; --mark-del:#5590D2;
  --warn:#E8896A; --warn-soft:#2C1710; --warn-line:#4C291D;
  --ok:#63C69C; --ok-soft:#12241B; --ok-line:#27452F;
  --f-rot:#2E1712;      --f-rot-p:#E08065;
  --f-orange:#2E2112;   --f-orange-p:#E09B45;
  --f-gelb:#2A2711;     --f-gelb-p:#CBB43C;
  --f-gruen:#182611;    --f-gruen-p:#7FBF57;
  --f-tuerkis:#112625;  --f-tuerkis-p:#4FBDB0;
  --f-blau:#131F2C;     --f-blau-p:#6E9FD8;
  --f-lila:#211A2E;     --f-lila-p:#A88BD6;
  --f-grau:#1E222A;     --f-grau-p:#93A0B2;
  --shadow:0 1px 2px rgba(0,0,0,.3), 0 8px 24px -12px rgba(0,0,0,.6);
}

*{box-sizing:border-box}
html,body{margin:0}
body{background:var(--ground);color:var(--ink);
  font-family:"IBM Plex Sans",-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;
  font-size:14px;line-height:1.5;-webkit-font-smoothing:antialiased}
h1,h2,h3,h4{font-family:Archivo,"IBM Plex Sans",sans-serif;margin:0;text-wrap:balance;letter-spacing:-.015em}
a{color:inherit}
button,input,select,textarea{font:inherit;color:inherit}
:focus-visible{outline:2px solid var(--signal);outline-offset:2px;border-radius:4px}
@media (prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important}}
.mono{font-family:"IBM Plex Mono",monospace;font-variant-numeric:tabular-nums}

/* ---------- Kopf ---------- */
.top{position:sticky;top:0;z-index:40;background:var(--surface);
  border-bottom:1px solid var(--line);box-shadow:var(--shadow)}
.top-in{max-width:1560px;margin:0 auto;padding:11px 20px;display:flex;align-items:center;gap:22px;flex-wrap:wrap}
.brand{text-decoration:none;display:flex;align-items:baseline;gap:9px}
.brand strong{font-family:Archivo,sans-serif;font-size:18px;font-weight:800;color:var(--signal)}
.brand .sub{font-size:10.5px;text-transform:uppercase;letter-spacing:.11em;color:var(--muted);font-weight:600}
.mainnav{display:flex;gap:2px;margin-right:auto;flex-wrap:wrap}
.mainnav a{text-decoration:none;color:var(--muted);padding:6px 11px;border-radius:var(--r);font-weight:500}
.mainnav a:hover{background:var(--surface-2);color:var(--ink)}
.mainnav a.on{background:var(--signal-soft);color:var(--signal);font-weight:600}
.userbox{display:flex;align-items:center;gap:10px;font-size:13px;color:var(--muted)}
.rolle{display:inline-block;margin-left:6px;font-size:10px;text-transform:uppercase;letter-spacing:.07em;
  font-weight:700;background:var(--del-soft);color:var(--del);border:1px solid var(--del-line);
  border-radius:20px;padding:1px 7px;vertical-align:1px}
.chip.fest,.farbknopf.fest{cursor:default}
.chip.fest:hover{border-color:var(--line);background:var(--surface-2)}
.hak input:disabled{opacity:.55;cursor:default}
.hak label:has(input:disabled){cursor:default}

.subbar{max-width:1560px;margin:0 auto;padding:0 20px 10px;display:flex;gap:12px;
  align-items:center;flex-wrap:wrap;border-top:1px solid var(--line-soft);padding-top:10px}

main{max-width:1560px;margin:0 auto;padding:20px}
.page-h{display:flex;align-items:baseline;gap:14px;flex-wrap:wrap;margin-bottom:16px}
.page-h h1{font-size:20px;font-weight:700}
.page-h .lead{color:var(--muted);font-size:13.5px}

/* ---------- Bedienelemente ---------- */
.btn{border:1px solid var(--line);background:var(--surface);border-radius:var(--r);
  padding:7px 13px;font-size:13px;font-weight:500;cursor:pointer;text-decoration:none;
  display:inline-flex;align-items:center;gap:7px;transition:.14s;white-space:nowrap}
.btn:hover{border-color:var(--muted);background:var(--surface-2)}
.btn.primary{background:var(--signal);border-color:var(--signal);color:#fff;font-weight:600}
.btn.primary:hover{filter:brightness(1.07)}
.btn.ghost{border-color:transparent;background:transparent;color:var(--muted)}
.btn.ghost:hover{background:var(--surface-2);color:var(--ink)}
.btn[disabled]{opacity:.45;cursor:default}
select,input[type=text],input[type=email],input[type=password],input[type=search],textarea{
  border:1px solid var(--line);background:var(--surface);border-radius:var(--r);padding:7px 10px}
select:focus,input:focus,textarea:focus{outline:none;border-color:var(--signal);
  box-shadow:0 0 0 3px var(--signal-soft)}
label{font-size:12.5px;font-weight:600;color:var(--ink-2)}

.chips{display:flex;gap:6px;flex-wrap:wrap}
.chipbtn{border:1px solid var(--line);background:var(--surface);border-radius:20px;
  padding:4px 12px;font-size:12.5px;cursor:pointer;color:var(--muted)}
.chipbtn.on{background:var(--signal-soft);border-color:var(--signal-line);color:var(--signal);font-weight:600}

/* ---------- Kennzahlen ---------- */
.stats{display:flex;border:1px solid var(--line);border-radius:var(--r);
  overflow:hidden;background:var(--surface)}
.stat{padding:6px 14px;border-right:1px solid var(--line-soft);display:flex;flex-direction:column}
.stat:last-child{border-right:0}
.stat b{font-family:"IBM Plex Mono",monospace;font-size:16px;font-weight:600;font-variant-numeric:tabular-nums;line-height:1.15}
.stat span{font-size:10px;text-transform:uppercase;letter-spacing:.07em;color:var(--muted);font-weight:600}
.stat.va b{color:var(--va)} .stat.del b{color:var(--del)}
.stat.ok b{color:var(--ink)}
.stat.warn b{color:var(--warn)}

/* ---------- Wochentabelle ---------- */
.card{background:var(--surface);border:1px solid var(--line);border-radius:10px;box-shadow:var(--shadow)}
.board{overflow:auto;overscroll-behavior:contain;max-height:min(74vh,1000px);border-radius:10px}
.grid{min-width:1260px}
.row{display:grid;
  grid-template-columns:112px 134px minmax(180px,1.2fr) minmax(115px,.75fr) 88px 86px minmax(230px,1.5fr) minmax(125px,.85fr) 66px minmax(180px,1.15fr);
  border-bottom:1px solid var(--line-soft)}
.row>*{padding:9px 10px;border-right:1px solid var(--line-soft);min-width:0}
.row>*:last-child{border-right:0}
.head{position:sticky;top:0;z-index:20;background:var(--surface-2);border-bottom:1px solid var(--line)}
.head>*{font-size:10.5px;text-transform:uppercase;letter-spacing:.08em;font-weight:600;
  color:var(--muted);padding-top:8px;padding-bottom:8px}
.day{grid-column:1/-1;border-right:0;background:var(--surface-2);display:flex;align-items:baseline;
  gap:12px;padding:7px 12px;border-top:1px solid var(--line);border-bottom:1px solid var(--line-soft)}
.day .wd{font-family:Archivo,sans-serif;font-weight:700;font-size:13px}
.day .dt{font-family:"IBM Plex Mono",monospace;font-size:12px;color:var(--muted);font-variant-numeric:tabular-nums}
.day .cnt{margin-left:auto;font-size:11px;color:var(--muted);font-weight:500}
.day.leer .wd{color:var(--muted)}
.day.we .wd,.day.we .dt{color:var(--warn)}
.row[hidden]{display:none}
.day.klappbar{cursor:pointer;user-select:none}
.day.klappbar::before{content:"▾";color:var(--muted);font-size:11px;line-height:1;
  transition:transform .15s;flex:none;margin-right:-2px}
.day.klappbar.zu::before{transform:rotate(-90deg)}
.day.klappbar:hover{background:var(--ground)}
.day.klappbar:hover .cnt{color:var(--signal)}
.day.klappbar.zu .wd,.day.klappbar.zu .dt{color:var(--muted)}
.day.klappbar.zu.we .wd,.day.klappbar.zu.we .dt{color:var(--warn);opacity:.7}
.day.heute{box-shadow:inset 3px 0 0 var(--signal)}
.day .jetzt{font-size:9.5px;text-transform:uppercase;letter-spacing:.08em;font-weight:700;
  color:var(--signal);background:var(--signal-soft);border-radius:20px;padding:2px 7px}

.ev{align-items:start}
.ev:hover{background:var(--surface-2)}
.ev.f-rot{background:var(--f-rot)} .ev.f-orange{background:var(--f-orange)}
.ev.f-gelb{background:var(--f-gelb)} .ev.f-gruen{background:var(--f-gruen)}
.ev.f-tuerkis{background:var(--f-tuerkis)} .ev.f-blau{background:var(--f-blau)}
.ev.f-lila{background:var(--f-lila)} .ev.f-grau{background:var(--f-grau)}
.ev.fertig{background:var(--surface-2)}
.ev.fertig .f{color:var(--muted)}
.ev.fertig .f[data-f="datum"]{color:var(--ink-2)}
.ev.entfallen{opacity:.55}
.ev.entfallen .f{text-decoration:line-through}
.ev.pruef{box-shadow:inset 3px 0 0 var(--warn)}
.ev.doppelt{box-shadow:inset 3px 0 0 var(--warn);background:var(--warn-soft)}
.ev.doppelt:hover{filter:brightness(.99)}
.chip.konflikt{border-color:var(--warn);background:var(--warn-soft);color:var(--warn);font-weight:600}
.badge.doppelt{background:var(--warn);color:#fff;border-color:var(--warn);letter-spacing:.06em}
.konflikt-tag{border-top:1px solid var(--line-soft);padding-top:12px;margin-top:12px}
.konflikt-tag:first-of-type{border-top:0;margin-top:0;padding-top:0}
.konflikt-tag h3{font-size:13px;font-weight:700;margin-bottom:8px}
.konflikt{border:1px solid var(--warn-line);background:var(--warn-soft);border-radius:8px;
  padding:9px 12px;margin-bottom:8px}
.konflikt-kopf{display:flex;gap:9px;align-items:center;flex-wrap:wrap;font-size:13px}
.konflikt-kopf .mono{color:var(--warn);font-size:12px}
.konflikt ul{margin:7px 0 0;padding-left:18px;font-size:12.5px;line-height:1.8}
.ev>.we .f{color:var(--warn);font-weight:600}

.hak{display:flex;flex-direction:column;gap:3px;padding-top:8px}
.hak label{display:flex;align-items:center;gap:6px;font-size:10.5px;font-weight:600;
  color:var(--muted);text-transform:uppercase;letter-spacing:.04em;cursor:pointer;line-height:1.2}
.hak label:hover{color:var(--ink-2)}
.hak input{width:15px;height:15px;accent-color:var(--signal);cursor:pointer;margin:0;flex:none}
.hak input[data-merkmal="info"]{accent-color:var(--del)}
.hak input[data-merkmal="briefing"]{accent-color:var(--va)}

/* Farbauswahl */
.farbwahl{position:relative;margin-bottom:5px}
.farbknopf{width:100%;height:16px;border:1px solid var(--line);border-radius:4px;cursor:pointer;
  background:var(--surface-2);padding:0;display:block}
.farbknopf:hover{border-color:var(--muted)}
.farbknopf[data-hat="1"]{border-color:transparent}
.palette{position:absolute;z-index:30;top:20px;left:0;background:var(--surface);
  border:1px solid var(--line);border-radius:8px;box-shadow:var(--shadow);padding:7px;
  display:grid;grid-template-columns:repeat(3,20px);gap:5px}
.palette button{width:20px;height:20px;border-radius:4px;border:1px solid var(--line);cursor:pointer;padding:0}
.palette button:hover{outline:2px solid var(--signal);outline-offset:1px}
.palette button.ohne{background:var(--surface-2);position:relative}
.palette button.ohne::after{content:"";position:absolute;inset:3px;border-top:1.5px solid var(--warn);
  transform:rotate(45deg);transform-origin:center}

.f{display:block;width:100%;border:1px solid transparent;background:transparent;border-radius:5px;
  padding:2px 5px;margin:-2px -5px;min-height:22px;white-space:pre-wrap;word-break:break-word}
.f:hover{background:var(--ground);border-color:var(--line-soft)}
.f:focus{background:var(--surface);border-color:var(--signal);outline:none;box-shadow:0 0 0 3px var(--signal-soft)}
.f.mono{font-family:"IBM Plex Mono",monospace;font-variant-numeric:tabular-nums}
.f[data-f="datum"]{white-space:nowrap;font-size:12.5px;letter-spacing:-.02em}
.f:empty::before{content:attr(data-ph);color:var(--muted);opacity:.6}
.sub{font-size:11.5px;color:var(--muted);margin-top:3px;display:block}
.sub.range{color:var(--signal);font-weight:600}
.sub.korr{color:var(--signal)}

.pill{border:1px solid;border-radius:20px;padding:2px 10px;font-size:11.5px;font-weight:600;
  cursor:pointer;background:none}
.pill.va{color:var(--va);background:var(--va-soft);border-color:var(--va-line)}
.pill.del{color:var(--del);background:var(--del-soft);border-color:var(--del-line)}
.mods{display:flex;flex-direction:column;gap:4px;align-items:flex-start}
.chip{border:1px solid var(--line);background:var(--surface-2);border-radius:5px;padding:2px 8px;
  font-size:12.5px;cursor:pointer;text-align:left;max-width:100%;display:flex;gap:6px;align-items:center}
.chip:hover{border-color:var(--signal);background:var(--signal-soft)}
.chip .q{font-family:"IBM Plex Mono",monospace;font-size:11px;color:var(--signal);font-weight:600}
.chip.short{border-color:var(--signal-line);background:var(--signal-soft)}
.chip.getauscht{border-color:var(--va-line);background:var(--va-soft);color:var(--va);font-weight:600}
.chip.getauscht::before{content:"⇄ ";font-weight:400}
.chip.getauscht.konflikt{border-color:var(--warn);background:var(--warn-soft);color:var(--warn)}

.modmenu{position:fixed;z-index:60;min-width:270px;max-width:330px;
  background:var(--surface);border:1px solid var(--line);border-radius:9px;
  box-shadow:var(--shadow);padding:11px 12px}
.modmenu-kopf{font-size:12px;color:var(--muted);margin-bottom:9px;line-height:1.4}
.modmenu-kopf strong{color:var(--ink);font-weight:600}
.modmenu-lab{display:block;font-size:10.5px;text-transform:uppercase;letter-spacing:.06em;
  font-weight:600;color:var(--muted);margin-bottom:4px}
.modmenu-feld{width:100%;box-sizing:border-box;padding:6px 8px;font-size:13px;
  border:1px solid var(--line);border-radius:5px;background:var(--surface-2);color:var(--ink)}
.modmenu-feld:focus{outline:none;border-color:var(--signal);background:var(--surface)}
.modmenu-reihe{display:flex;gap:6px;margin:7px 0 0;flex-wrap:wrap}
.modmenu-reihe .btn{font-size:12px;padding:5px 10px}
.modmenu-trenn{border-top:1px solid var(--line-soft);margin:12px 0 10px}

.chip-edit{font-size:12.5px;font-family:"IBM Plex Mono",monospace;border:1px solid var(--signal);
  border-radius:5px;padding:2px 7px;width:100%;max-width:210px;background:var(--surface);
  outline:none;box-shadow:0 0 0 3px var(--signal-soft)}
.badge{font-size:10.5px;font-weight:600;letter-spacing:.04em;text-transform:uppercase;display:inline-block;
  margin-top:5px;padding:1px 6px;border-radius:4px;background:var(--warn-soft);color:var(--warn);
  border:1px solid var(--warn-line)}
.badge.d{background:var(--del-soft);color:var(--del);border-color:var(--del-line)}
.statusbtn{display:inline-block;margin-top:5px;border:1px solid var(--line);background:var(--surface);
  border-radius:5px;padding:2px 8px;font-size:11.5px;cursor:pointer;color:var(--ink-2)}
.statusbtn:hover{border-color:var(--signal);color:var(--signal);background:var(--signal-soft)}
.statusbtn.leise{border-color:transparent;background:transparent;color:var(--muted);opacity:0;
  transition:opacity .12s}
.ev:hover .statusbtn.leise,.statusbtn.leise:focus-visible{opacity:1}
.ev.entfallen .statusbtn{text-decoration:none}

/* ---------- Meldungen ---------- */
.hinweis{border-radius:var(--r);padding:11px 14px;margin-bottom:14px;font-size:13.5px;
  border:1px solid var(--line);background:var(--surface)}
.hinweis.warn{background:var(--warn-soft);border-color:var(--warn-line);color:var(--warn)}
.hinweis.ok{background:var(--ok-soft);border-color:var(--ok-line);color:var(--ok)}
.toast{position:fixed;left:50%;bottom:26px;transform:translateX(-50%);z-index:80;background:var(--ink);
  color:var(--ground);padding:10px 18px;border-radius:8px;font-size:13px;font-weight:500;
  box-shadow:var(--shadow);opacity:0;pointer-events:none;transition:opacity .2s,transform .2s}
.toast.on{opacity:1;transform:translateX(-50%) translateY(-4px)}
.leerzustand{text-align:center;padding:60px 24px;color:var(--muted)}
.leerzustand h2{font-size:19px;color:var(--ink);margin-bottom:8px}

/* ---------- Anmeldung ---------- */
.login-wrap{min-height:100vh;display:grid;place-items:center;padding:24px;background:var(--ground)}
.login{width:100%;max-width:380px;background:var(--surface);border:1px solid var(--line);
  border-radius:12px;box-shadow:var(--shadow);padding:28px}
.login h1{font-size:21px;font-weight:800;margin-bottom:4px}
.login p.lead{color:var(--muted);font-size:13px;margin:0 0 20px}
.login .feld{display:flex;flex-direction:column;gap:5px;margin-bottom:14px}
.login input{width:100%}
.login .btn{width:100%;justify-content:center;margin-top:6px}

/* ---------- Auswertung ---------- */
.kacheln{display:grid;grid-template-columns:repeat(auto-fit,minmax(190px,1fr));gap:12px;margin-bottom:20px}
.kachel{background:var(--surface);border:1px solid var(--line);border-radius:10px;padding:14px 16px;box-shadow:var(--shadow)}
.kachel .zahl{font-family:"IBM Plex Mono",monospace;font-size:26px;font-weight:600;
  font-variant-numeric:tabular-nums;line-height:1.1}
.kachel .lab{font-size:11px;text-transform:uppercase;letter-spacing:.07em;color:var(--muted);font-weight:600;margin-top:2px}
.kachel .fuss{font-size:12px;color:var(--muted);margin-top:6px}
.panel{background:var(--surface);border:1px solid var(--line);border-radius:10px;
  box-shadow:var(--shadow);padding:16px 18px;margin-bottom:18px}
.panel h2{font-size:15px;font-weight:700;margin-bottom:2px}
.panel .unter{font-size:12.5px;color:var(--muted);margin-bottom:14px}
.balken{display:flex;flex-direction:column;gap:7px}
.balken .zeile{display:grid;grid-template-columns:112px 1fr 62px;gap:10px;align-items:center;font-size:12.5px}
.balken .lab{color:var(--ink-2);font-weight:500}
.balken .track{background:var(--surface-2);border-radius:4px;height:20px;position:relative;
  border:1px solid var(--line-soft);display:flex;gap:2px;padding:0;overflow:hidden}
.balken .seg{height:100%;min-width:2px}
.balken .seg:last-of-type{border-top-right-radius:4px;border-bottom-right-radius:4px}
.balken .zeile:hover .track{outline:1px solid var(--line);outline-offset:1px}
.balken .seg.va{background:var(--mark-va)} .balken .seg.del{background:var(--mark-del)}
.balken .wert{text-align:right;font-family:"IBM Plex Mono",monospace;font-variant-numeric:tabular-nums;color:var(--muted)}
.legende{display:flex;gap:16px;font-size:12px;color:var(--muted);margin-top:12px;flex-wrap:wrap}
.legende i{width:10px;height:10px;border-radius:2px;display:inline-block;margin-right:5px}

/* ---------- Karte ---------- */
#map{height:min(70vh,780px);border-radius:10px;border:1px solid var(--line);z-index:1}
.hof-weg{font-size:11.5px;color:var(--signal);font-weight:600}

/* ---------- Verschachteln ---------- */
.touren{display:flex;flex-direction:column;gap:14px}
.tour{border:1px solid var(--line);border-radius:9px;overflow:hidden;background:var(--surface-2)}
.tour-kopf{display:flex;gap:14px;align-items:baseline;padding:8px 12px;background:var(--surface);
  border-bottom:1px solid var(--line-soft);font-size:13px}
.tour-kopf strong{font-family:Archivo,sans-serif}
.tour-kopf span{color:var(--muted);font-size:12px}
.tour .tour-stop{padding:7px 12px;background:var(--surface)}
.tour .tour-stop.hof{background:var(--signal-soft)}
.tour .tour-stop.hof .zeit{color:var(--signal);font-weight:600}
.tour .tour-weg{padding:4px 12px 4px 70px;background:var(--surface-2);font-size:11.5px;
  color:var(--muted);font-weight:500}
.tour .tour-weg strong{color:var(--ink-2)}
.tour .tour-weg.knapp{background:var(--warn-soft);color:var(--warn)}
.tour .tour-weg.knapp strong{color:var(--warn)}
details.raus{margin-top:14px;font-size:13px}
details.raus summary{cursor:pointer;color:var(--muted);font-weight:500}
details.raus ul{margin:8px 0 0;padding-left:20px;color:var(--ink-2);line-height:1.7}
.tourliste{display:flex;flex-direction:column;gap:0}
.tour-tag{border-top:1px solid var(--line-soft);padding-top:10px;margin-top:10px}
.tour-tag:first-child{border-top:0;margin-top:0;padding-top:0}
.tour-tag h3{font-size:13px;font-weight:700;margin-bottom:6px}
.tour-stop{display:grid;grid-template-columns:58px 1fr auto;gap:10px;padding:5px 0;font-size:13px;align-items:baseline}
.tour-stop .zeit{font-family:"IBM Plex Mono",monospace;color:var(--muted);font-size:12px}
.tour-weg{font-size:11.5px;color:var(--signal);padding:2px 0 2px 68px;font-weight:500}
.leaflet-popup-content{font-family:"IBM Plex Sans",sans-serif;font-size:13px}

.spalten{display:grid;gap:18px;align-items:start;
  grid-template-columns:repeat(auto-fit,minmax(min(var(--min,320px),100%),1fr))}
.zweispalten{display:grid;gap:18px;align-items:start;grid-template-columns:var(--zwei)}
.spalten > *,.zweispalten > *{min-width:0}

table.liste{width:100%;border-collapse:collapse;font-size:13px}
table.liste th{text-align:left;font-size:10.5px;text-transform:uppercase;letter-spacing:.07em;
  color:var(--muted);font-weight:600;padding:6px 8px;border-bottom:1px solid var(--line)}
table.liste td{padding:6px 8px;border-bottom:1px solid var(--line-soft);vertical-align:top}
table.liste tr:last-child td{border-bottom:0}

/* ---------- Verfügbarkeit der Mitarbeiter ---------- */
.verfuegbarkeit{padding:0}
.verfuegbarkeit > summary{cursor:pointer;padding:12px 18px;display:flex;align-items:center;gap:14px;
  flex-wrap:wrap;list-style:none}
.verfuegbarkeit > summary::-webkit-details-marker{display:none}
.verfuegbarkeit > summary::before{content:"▸";color:var(--muted);font-size:12px;transition:transform .15s}
.verfuegbarkeit[open] > summary::before{transform:rotate(90deg)}
.verfuegbarkeit > summary strong{font-family:Archivo,sans-serif;font-size:15px}
.vkurz{display:inline-block;margin-right:8px;font-family:"IBM Plex Mono",monospace;font-size:12px;
  color:var(--muted);font-variant-numeric:tabular-nums}
.vkurz.knapp{color:var(--warn);font-weight:600}
.panel.vtag{padding:14px 18px}
.panel.vtag.we .vkopf strong{color:var(--warn)}
.veingeteilt{font-size:12px;color:var(--muted);margin:10px 0 0;line-height:1.7}
.veingeteilt strong{color:var(--ink-2)}
.vtag.we .vkopf strong{color:var(--warn)}
.vkopf{display:flex;align-items:baseline;gap:12px;margin-bottom:10px;flex-wrap:wrap}
.vkopf strong{font-family:Archivo,sans-serif;font-size:13px}
.vkopf .mono{font-size:12px;color:var(--muted)}
.vzahl{font-size:12px;color:var(--muted);margin-left:auto}
.vzahl.knapp{color:var(--warn);font-weight:600}
.vleute{display:flex;flex-wrap:wrap;gap:4px}

.vchip{border:1px solid var(--line);background:var(--surface);border-radius:20px;padding:2px 10px;
  font-size:12px;cursor:pointer;color:var(--muted);position:relative;line-height:1.6}
.vchip.aus{display:none}
.vchip:hover:not(:disabled){border-color:var(--muted);color:var(--ink)}
.vchip.an{background:var(--va-soft);border-color:var(--va-line);color:var(--va);font-weight:600}
.vchip:disabled{cursor:default;opacity:.7}
.vpunkt{display:inline-block;width:5px;height:5px;border-radius:50%;background:var(--signal);
  margin-left:5px;vertical-align:2px}
.vnotiz{margin-top:9px}
.vnotiz .f{font-size:12.5px;color:var(--ink-2);border:1px dashed var(--line);border-radius:5px;
  padding:5px 8px;margin:0;min-height:26px}
.vnotiz .f:hover{border-style:solid;background:var(--surface-2)}
.vnotiz .f:focus{border-style:solid;background:var(--surface)}

/* Namensauswahl im Mitarbeiterfeld */
.mawahl{position:absolute;z-index:50;top:100%;left:-5px;min-width:240px;max-width:310px;
  background:var(--surface);border:1px solid var(--line);
  border-radius:8px;box-shadow:var(--shadow);padding:5px;margin-top:3px}
.mawahl-liste{max-height:238px;overflow:auto}
.mawahl-suche{width:100%;box-sizing:border-box;margin:2px 0 5px;padding:5px 8px;font:inherit;
  font-size:13px;color:var(--ink);background:var(--surface-2);border:1px solid var(--line);
  border-radius:5px}
.mawahl-suche:focus{outline:none;border-color:var(--signal);background:var(--surface)}
.mawahl-leer{font-size:12.5px;color:var(--muted);padding:6px 8px}
.mawahl-kopf,.mawahl-fuss{font-size:11px;color:var(--muted);padding:4px 8px;
  text-transform:uppercase;letter-spacing:.05em;font-weight:600}
.mawahl-fuss{text-transform:none;letter-spacing:0;font-weight:400;border-top:1px solid var(--line-soft);
  margin-top:4px;padding-top:6px}
.mawahl-name{display:flex;justify-content:space-between;align-items:baseline;gap:8px;width:100%;
  border:0;background:none;text-align:left;padding:4px 8px;border-radius:5px;cursor:pointer;
  font-size:13px;color:var(--ink)}
.mawahl-name[hidden]{display:none}
.mawahl-name:hover{background:var(--surface-2)}
.mawahl-name em{font-style:normal;font-size:11px;color:var(--muted);flex:none}
.mawahl-name.verplant em{color:var(--signal)}
.mawahl-name em.kollision{color:var(--warn);font-weight:600}
.mawahl-name.nichtfrei{color:var(--muted)}
.mawahl-name.gewaehlt{background:var(--va-soft);color:var(--va);font-weight:600}
.mawahl-name.gewaehlt::after{content:"✓";color:var(--va);font-weight:700}

/* ---------- Glocke ---------- */
.glockebtn{position:relative;border:1px solid transparent;background:none;cursor:pointer;
  color:var(--muted);font-size:17px;line-height:1;padding:4px 7px;border-radius:var(--r)}
.glockebtn:hover{background:var(--surface-2);color:var(--ink)}
.glockebtn.hat{color:var(--signal)}
.gzahl{position:absolute;top:-1px;right:-2px;background:var(--signal);color:#fff;font-size:9.5px;
  font-weight:700;border-radius:20px;padding:0 4px;min-width:14px;line-height:14px;text-align:center}
.gliste{position:fixed;z-index:70;width:340px;max-width:calc(100vw - 16px);max-height:70vh;
  background:var(--surface);border:1px solid var(--line);border-radius:9px;box-shadow:var(--shadow);
  display:flex;flex-direction:column}
.gliste-kopf{display:flex;align-items:center;gap:10px;padding:10px 12px;border-bottom:1px solid var(--line-soft)}
.gliste-kopf strong{font-family:Archivo,sans-serif;font-size:14px}
.gliste-kopf .btn{margin-left:auto;font-size:11.5px;padding:3px 9px}
.gliste-inhalt{overflow:auto;padding:4px 0}
.gmeldung{display:block;padding:8px 12px;border-bottom:1px solid var(--line-soft);font-size:13px;
  color:var(--ink);text-decoration:none}
.gmeldung:last-child{border-bottom:0}
.gmeldung:hover{background:var(--surface-2)}
.gmeldung .wann{display:block;font-size:11px;color:var(--muted);margin-top:2px}
.gleer{padding:16px 12px;font-size:13px;color:var(--muted);text-align:center}

/* ---------- Freigabe, Abfahrt, Besetzungsstand ---------- */
.hak label.frei input{accent-color:var(--ok)}
.hak label.frei.an{color:var(--ok)}
.hak label.frei.zu{opacity:.5;cursor:help}
.abfahrt{display:flex;align-items:baseline;gap:5px;margin-top:3px}
.abfahrt > span{font-size:10px;text-transform:uppercase;letter-spacing:.06em;color:var(--muted);
  font-weight:600;flex:none}
.abfahrt .f{font-size:12px;padding:1px 4px;width:auto;min-width:46px;white-space:nowrap}
.stand{display:inline-block;margin-top:3px;font-family:"IBM Plex Mono",monospace;font-size:12px;
  font-weight:600;color:var(--signal);background:var(--signal-soft);border:1px solid var(--signal-line);
  border-radius:20px;padding:1px 8px;text-decoration:none}
.stand:hover{filter:brightness(.95)}
.stand.voll{color:var(--ok);background:var(--ok-soft);border-color:var(--ok-line)}
.besetzt{font-size:13px;color:var(--ink);line-height:1.35}
.besetzt.leer{color:var(--muted);font-style:italic;font-size:12px}
.f.klein{font-size:12px;margin-top:3px;color:var(--ink-2)}

/* ---------- Kleine Wahlschalter (Anhängerfrage, Führerschein) ---------- */
.ahwahl,.scheinwahl{display:inline-flex;gap:3px;align-items:center}
.ahbtn,.scheinbtn{border:1px solid var(--line);background:var(--surface);border-radius:5px;
  padding:3px 9px;font-size:12px;cursor:pointer;color:var(--ink-2);min-width:34px}
.ahbtn:hover,.scheinbtn:hover{border-color:var(--muted)}
.ahbtn.on,.scheinbtn.on{background:var(--signal-soft);border-color:var(--signal-line);
  color:var(--signal);font-weight:600}
.ahbtn:disabled,.scheinbtn:disabled{opacity:.5;cursor:default}
.ahoffen{font-size:10.5px;text-transform:uppercase;letter-spacing:.06em;font-weight:600;
  color:var(--warn);margin-left:4px}
.ahwahl.offen .ahbtn{border-color:var(--warn-line)}

/* ---------- Stand der Terminliste ---------- */
.standzeile{font-size:11.5px;color:var(--muted);align-self:center;white-space:nowrap}
.standzeile strong{color:var(--ink-2);font-family:"IBM Plex Mono",monospace}
.standzeile.alt{color:var(--warn)}
.standzeile.alt strong{color:var(--warn)}

/* ---------- Änderungen und Lücken ---------- */
.hinweisboxen{display:flex;flex-direction:column;gap:10px;margin-bottom:14px}
.hinweisboxen .panel{margin-bottom:0;padding:0}
.hinweisboxen summary{cursor:pointer;padding:11px 16px;display:flex;align-items:center;gap:12px;
  flex-wrap:wrap;list-style:none}
.hinweisboxen summary::-webkit-details-marker{display:none}
.hinweisboxen summary::before{content:"▸";color:var(--muted);font-size:12px;transition:transform .15s;flex:none}
.hinweisboxen details[open] > summary::before{transform:rotate(90deg)}
.hinweisboxen summary strong{font-family:Archivo,sans-serif;font-size:14px}
.hinweisboxen summary span{font-size:12.5px;color:var(--muted)}
.hinweisboxen summary .btn{margin-left:auto;font-size:12px;padding:4px 10px}
.panel.merker{border-color:var(--signal-line);background:var(--signal-soft)}
.panel.merker summary strong{color:var(--signal)}
.panel.luecken{border-color:var(--line)}
.aendliste,.lueckenliste{list-style:none;margin:0;padding:0 16px 13px;
  display:flex;flex-direction:column;gap:6px;font-size:13px}
.aendliste li{display:flex;gap:9px;align-items:baseline;flex-wrap:wrap;
  border-top:1px solid var(--line-soft);padding-top:6px}
.aendliste li:first-child{border-top:0;padding-top:0}
.aendliste .mono{font-size:12px;color:var(--muted);flex:none}
.aendliste .was{color:var(--ink-2);font-size:12.5px}
.lueckenliste li{border-top:1px solid var(--line-soft);padding-top:6px;color:var(--ink-2)}
.lueckenliste li:first-child{border-top:0;padding-top:0}
.lueckenliste b{color:var(--ink)}
.lueckenliste a{color:var(--signal);font-weight:600}

.ev.neu-geaendert:not(.doppelt){box-shadow:inset 3px 0 0 var(--signal)}
.badge.aend{background:var(--signal);color:#fff;border-color:var(--signal)}
.badge.makonf{background:var(--warn);color:#fff;border-color:var(--warn);letter-spacing:.06em}
.aendbox{margin-top:6px;padding-top:6px;border-top:1px dashed var(--signal-line)}
.sub.aend-text{color:var(--signal)}
.sub.makonf-text{color:var(--warn)}
.sub.makonf-text strong{font-weight:700}

/* ================= Handy / schmale Bildschirme ================= */
/* Ohne Hover-Zeiger: alles Wichtige sichtbar lassen */
/* Wechseltexte je nach Bedienung */
.nur-touch{display:none}
@media (hover:none){
  .statusbtn.leise{opacity:1;color:var(--muted);border-color:var(--line);background:var(--surface)}
  .nur-maus{display:none}
  .nur-touch{display:inline}
  p.nur-touch{display:block}
}

@media (max-width:860px){
  main{padding:12px 12px 40px}
  body{font-size:14.5px}

  /* --- Kopf: Marke oben, Menü als Streifen darunter --- */
  .top{position:static}
  .top-in{padding:9px 12px;gap:10px;row-gap:8px}
  .brand{order:1}
  .brand strong{font-size:16px}
  .brand .sub{display:none}
  .userbox{order:2;margin-left:auto;font-size:12px;gap:6px}
  .userbox .btn{padding:5px 9px}
  .mainnav{order:3;flex:1 0 100%;min-width:0;margin:0;flex-wrap:nowrap;overflow-x:auto;
    -webkit-overflow-scrolling:touch;scrollbar-width:none;gap:4px;padding-bottom:2px}
  .mainnav::-webkit-scrollbar{display:none}
  .mainnav a{white-space:nowrap;padding:7px 12px;font-size:13.5px}

  /* --- Leiste unter dem Kopf --- */
  .subbar{padding:0 12px 9px;gap:9px;row-gap:9px}
  .subbar .kw{flex:1 0 100%;min-width:0}
  .subbar .kw select{flex:1;min-width:0}
  .subbar .btn{padding:8px 12px}
  .chips{flex:1 0 100%;min-width:0;flex-wrap:nowrap;overflow-x:auto;scrollbar-width:none;padding-bottom:2px}
  .chips::-webkit-scrollbar{display:none}
  .chipbtn{white-space:nowrap;padding:6px 12px}
  .stats{flex:1 0 100%;min-width:0;margin-left:0!important;overflow-x:auto;scrollbar-width:none}
  .stats::-webkit-scrollbar{display:none}
  .stat{padding:6px 12px;flex:none}
  .subbar > .btn.primary{flex:1 0 100%;justify-content:center}
  .standzeile{flex:1 0 100%;white-space:normal;text-align:center}
  .hinweisboxen summary{padding:11px 13px}
  .hinweisboxen summary .btn{margin-left:0;flex:1 0 100%;justify-content:center;
    border-color:var(--line);background:var(--surface);color:var(--ink-2)}
  .aendliste,.lueckenliste{padding:0 13px 12px}

  /* --- Wochenliste: aus der Tabelle werden Karten --- */
  .board{overflow:visible;max-height:none;border:0;background:none;box-shadow:none;border-radius:0}
  .grid{min-width:0;display:flex;flex-direction:column;gap:10px}
  .row{display:block}
  .row.head{display:none}

  .row:has(> .day){position:sticky;top:0;z-index:15}
  .day{border-radius:8px;border:1px solid var(--line);padding:8px 12px;
    background:var(--surface-2);box-shadow:var(--shadow)}
  .day .wd{font-size:14px}

  .ev{display:grid;background:var(--surface);border:1px solid var(--line);border-radius:10px;
    box-shadow:var(--shadow);overflow:visible;
    grid-template-columns:minmax(0,1fr) auto;
    grid-template-areas:
      "kunde kunde"
      "datum art"
      "ort   uhrzeit"
      "module module"
      "mitarbeiter ma"
      "besonderheiten besonderheiten"
      "merkmale merkmale";
    align-items:start;row-gap:0}
  .ev:hover{background:var(--surface)}
  .ev.fertig{background:var(--surface-2)}
  .ev > *{border-right:0;padding:7px 13px}
  .ev > [data-lab="Kunde"]{grid-area:kunde;padding-top:11px;padding-bottom:2px}
  .ev > [data-lab="Datum"]{grid-area:datum}
  .ev > [data-lab="Art"]{grid-area:art;text-align:right;padding-top:9px}
  .ev > [data-lab="Ort"]{grid-area:ort;padding-top:2px}
  .ev > [data-lab="Uhrzeit"]{grid-area:uhrzeit;text-align:right;padding-top:2px}
  .ev > [data-lab="Module"]{grid-area:module}
  .ev > [data-lab="Mitarbeiter"]{grid-area:mitarbeiter}
  .ev > [data-lab="MA"]{grid-area:ma;min-width:64px}
  .ev > [data-lab="Besonderheiten"]{grid-area:besonderheiten}
  .ev > [data-lab="Merkmale"]{grid-area:merkmale}
  /* leere Felder kosten auf dem Handy nur Platz */
  .ev > [data-lab="Besonderheiten"]:has(.f:empty):not(:has(.badge)):not(:has(.sub)){display:none}
  .ev > [data-lab="MA"]:has(.f:empty){display:none}
  .ev:has(> [data-lab="MA"] .f:empty) > [data-lab="Mitarbeiter"]{grid-column:1/-1}
  .ev > [data-lab="Ort"]:has(.f:empty) .f{font-size:13px}

  /* Beschriftung nur da, wo sie nicht selbsterklärend ist */
  .ev > [data-lab="Module"]::before,
  .ev > [data-lab="Mitarbeiter"]::before,
  .ev > [data-lab="MA"]::before,
  .ev > [data-lab="Besonderheiten"]::before{
    content:attr(data-lab);display:block;font-size:10px;text-transform:uppercase;
    letter-spacing:.08em;font-weight:600;color:var(--muted);margin-bottom:3px}
  .ev > [data-lab="Module"],
  .ev > [data-lab="Mitarbeiter"],
  .ev > [data-lab="Besonderheiten"]{border-top:1px solid var(--line-soft)}
  .ev > [data-lab="MA"]{border-top:1px solid var(--line-soft);text-align:left!important}
  .ev > [data-lab="MA"] .f{text-align:left!important}

  .ev > [data-lab="Kunde"] .f{font-size:16px;font-weight:600;line-height:1.3}
  .ev > [data-lab="Datum"] .f[data-f="datum"]{font-size:14px}
  .ev > [data-lab="Uhrzeit"] .f{font-size:15px;font-weight:600;text-align:right}
  .ev > [data-lab="Ort"] .f{color:var(--ink-2)}
  .mods{flex-direction:row;flex-wrap:wrap;gap:5px}
  .mods{max-width:100%}
  .mods::before{flex:1 0 100%}
  .mods .chip{padding:5px 10px;font-size:12.5px;max-width:100%;
    white-space:normal;text-align:left;line-height:1.35}

  /* Haken unten als Reihe, mit fingerfreundlicher Größe */
  .hak{flex-direction:row;align-items:center;flex-wrap:wrap;gap:14px;padding:9px 13px 11px;
    border-top:1px solid var(--line-soft);background:var(--ground)}
  .ev.fertig .hak{background:transparent}
  .hak label{font-size:11.5px;gap:8px}
  .hak input{width:20px;height:20px}
  .farbwahl{margin:0;order:9;margin-left:auto}
  .farbknopf{width:34px;height:24px}
  .palette{top:auto;bottom:28px;left:auto;right:0;grid-template-columns:repeat(3,30px)}
  .palette button{width:30px;height:30px}

  /* Eingabefelder: 16px verhindert das Reinzoomen auf dem iPhone */
  .f,select,input[type=text],input[type=email],input[type=password],input[type=search],textarea{font-size:16px}
  .f{padding:5px 7px}
  .f[data-f="datum"],.f[data-f="ma_soll"]{font-size:15px}
  .statusbtn{padding:5px 10px;font-size:12px}
  .statusbtn.leise{display:none}
  .pill{padding:4px 12px;font-size:13px}

  /* Namensauswahl bekommt mehr Platz */
  .modmenu{min-width:0;max-width:calc(100vw - 16px);width:calc(100vw - 16px)}
  .modmenu-feld{font-size:16px}
  .mawahl{left:0;right:0;min-width:0;max-width:none}
  .mawahl-liste{max-height:40vh}
  .mawahl-name{padding:9px 8px}

  /* --- Mitarbeiter-Seite --- */
  .panel{padding:13px 14px}
  .vchip{padding:8px 13px}
  .vkopf{gap:8px}

  /* --- Übrige Seiten --- */
  .page-h{gap:8px}
  .kacheln{grid-template-columns:repeat(auto-fit,minmax(140px,1fr));gap:9px}
  .balken .zeile{grid-template-columns:92px 1fr 52px;gap:7px;font-size:12px}
  .tour-stop{grid-template-columns:52px 1fr;row-gap:2px}
  .tour-stop > :last-child{grid-column:2}
  .tour-weg,.tour .tour-weg{padding-left:52px}
  #map{height:62vh}
  .zweispalten{grid-template-columns:minmax(0,1fr)}
  .spalten{gap:12px}
  .tabellenrahmen{overflow-x:auto;-webkit-overflow-scrolling:touch}
  table.liste{min-width:520px}
  .login-wrap{padding:16px}
}

@media (max-width:420px){
  .ev{grid-template-columns:minmax(0,1fr) auto}
  .stat{padding:5px 10px}
  .stat b{font-size:15px}
  .hak{gap:11px}
}

/* ================= Besetzung ================= */
.panel.btag{padding:0;overflow:hidden}
.bkopf{display:flex;align-items:baseline;gap:12px;flex-wrap:wrap;padding:11px 16px;
  background:var(--surface-2);border-bottom:1px solid var(--line)}
.bkopf strong{font-family:Archivo,sans-serif;font-size:15px}
.bkopf .mono{font-size:12.5px;color:var(--muted)}
.ampel{font-family:"IBM Plex Mono",monospace;font-size:12px;font-weight:600;border-radius:20px;
  padding:2px 10px;border:1px solid}
.ampel.leer{color:var(--warn);background:var(--warn-soft);border-color:var(--warn-line)}
.ampel.teil{color:var(--signal);background:var(--signal-soft);border-color:var(--signal-line)}
.ampel.voll{color:var(--ok);background:var(--ok-soft);border-color:var(--ok-line)}
.bersatz-zahl{font-size:12px;color:var(--muted);margin-left:auto}

.bspalten{display:grid;grid-template-columns:minmax(0,1fr) minmax(220px,300px)}
.bliste{padding:4px 0}
.beintrag{padding:11px 16px;border-bottom:1px solid var(--line-soft)}
.beintrag:last-child{border-bottom:0}
.bzeile{display:flex;align-items:baseline;gap:10px;flex-wrap:wrap;margin-bottom:8px}
.bzeile strong{font-size:14px}
.bort{color:var(--ink-2);font-size:13px}
.bzeit,.babf{font-size:12px;color:var(--muted)}
.bstand{font-family:"IBM Plex Mono",monospace;font-size:12px;font-weight:600;color:var(--signal);
  background:var(--signal-soft);border:1px solid var(--signal-line);border-radius:20px;padding:1px 9px}
.bstand.voll{color:var(--ok);background:var(--ok-soft);border-color:var(--ok-line)}
.badge.v{background:var(--ok-soft);color:var(--ok);border-color:var(--ok-line)}
.badge.nichtfrei{background:var(--surface-2);color:var(--muted);border-color:var(--line)}
.bplan{margin-left:auto;font-size:11.5px;color:var(--muted);text-decoration:none;
  border-bottom:1px dotted var(--line)}
.bplan:hover{color:var(--signal)}
.bzusage{margin-top:7px;font-size:12px;color:var(--warn);font-weight:500}

.bplaetze{display:flex;flex-wrap:wrap;gap:6px}
.platz{display:inline-flex;align-items:center;gap:7px;border:1px solid var(--line);
  border-radius:20px;padding:4px 11px;font-size:13px;background:var(--surface)}
.platz.offen{border-style:dashed;cursor:pointer;color:var(--muted)}
.platz.offen:hover{border-color:var(--signal);color:var(--signal);background:var(--signal-soft)}
.platz.besetzt{background:var(--ok-soft);border-color:var(--ok-line);color:var(--ok);font-weight:600}
.platz .panf{font-family:"IBM Plex Mono",monospace;font-size:10.5px;font-weight:700;
  background:var(--surface);border:1px solid currentColor;border-radius:4px;padding:0 4px;opacity:.8}
.platz .panf.grau{border-color:var(--line);color:var(--muted)}
.platz .praus,.platz .pmenu{border:0;background:none;cursor:pointer;color:inherit;opacity:.6;
  font-size:14px;line-height:1;padding:0 2px}
.platz .praus:hover,.platz .pmenu:hover{opacity:1}
.platzneu{border:1px dashed var(--line);background:none;border-radius:20px;padding:4px 11px;
  font-size:12.5px;color:var(--muted);cursor:pointer}
.platzneu:hover{border-color:var(--signal);color:var(--signal)}

.bersatz{border-left:1px solid var(--line-soft);padding:12px 16px;background:var(--ground)}
.bersatz h3{font-size:12px;text-transform:uppercase;letter-spacing:.07em;color:var(--muted);
  font-weight:600;margin-bottom:9px}
.bersatz .leer{font-size:12.5px;color:var(--muted);line-height:1.5}
.ersatzliste{display:flex;flex-direction:column;gap:5px}
.ersatzmann{display:flex;align-items:center;gap:7px;flex-wrap:wrap;background:var(--surface);
  border:1px solid var(--line);border-radius:7px;padding:5px 9px;font-size:13px}
.ersatzmann .name{font-weight:600}
.ersatzmann .schein{font-family:"IBM Plex Mono",monospace;font-size:10.5px;color:var(--muted)}
.mini{border:1px solid var(--line);background:var(--surface);border-radius:5px;padding:2px 7px;
  font-size:11px;cursor:pointer;color:var(--ink-2)}
.mini:hover{border-color:var(--signal);color:var(--signal)}
.mini.leise{border-color:transparent;color:var(--muted)}
.mini.leise:hover{border-color:var(--line)}

/* Menü für Zuordnen, Platzarten und Veröffentlichen */
.bmenu{position:fixed;z-index:60;min-width:250px;max-width:380px;background:var(--surface);
  border:1px solid var(--line);border-radius:9px;box-shadow:var(--shadow);padding:10px 11px}
.bmenu-kopf{font-size:11px;text-transform:uppercase;letter-spacing:.06em;font-weight:600;
  color:var(--muted);margin-bottom:6px}
.bmenu-suche,.bmenu-text{width:100%;box-sizing:border-box;padding:6px 8px;font-size:13px;
  border:1px solid var(--line);border-radius:5px;background:var(--surface-2);color:var(--ink);
  font-family:inherit}
.bmenu-suche:focus,.bmenu-text:focus{outline:none;border-color:var(--signal);background:var(--surface)}
.bmenu-text{margin:8px 0;font-family:"IBM Plex Mono",monospace;font-size:12px;line-height:1.5;resize:vertical}
.bmenu-liste{max-height:240px;overflow:auto;margin-top:5px}
.bmenu-name{display:flex;justify-content:space-between;align-items:baseline;gap:8px;width:100%;
  border:0;background:none;text-align:left;padding:5px 8px;border-radius:5px;cursor:pointer;
  font-size:13px;color:var(--ink)}
.bmenu-name:hover{background:var(--surface-2)}
.bmenu-name[disabled]{opacity:.45;cursor:default}
.bmenu-name em{font-style:normal;font-size:11px;color:var(--muted);flex:none}
.bmenu-name em.nix{color:var(--warn)}
.bmenu-leer{font-size:12.5px;color:var(--muted);padding:6px 8px}
.bmenu-trenn{border-top:1px solid var(--line-soft);margin:9px 0 8px}
.bmenu-reihe{display:flex;gap:5px;align-items:center;flex-wrap:wrap}
.bmenu-reihe.wrap{margin-bottom:4px}
.bmenu-anf{border:1px solid var(--line);background:var(--surface);border-radius:5px;padding:3px 10px;
  font-size:12px;cursor:pointer;color:var(--ink-2)}
.bmenu-anf.on{background:var(--signal-soft);border-color:var(--signal-line);color:var(--signal);font-weight:600}
.bmenu-weg{border:1px solid transparent;background:none;color:var(--muted);font-size:11.5px;
  cursor:pointer;margin-left:auto;padding:3px 6px;border-radius:5px}
.bmenu-weg:hover{color:var(--warn);border-color:var(--warn-line)}
.bmenu-fuss{font-size:11.5px;color:var(--muted);margin-top:8px;line-height:1.45}

@media (max-width:860px){
  .bspalten{grid-template-columns:minmax(0,1fr)}
  .bersatz{border-left:0;border-top:1px solid var(--line-soft)}
  .bkopf{padding:10px 13px}
  .beintrag{padding:10px 13px}
  .bersatz-zahl{margin-left:0;flex:1 0 100%}
  .platz{padding:6px 12px;font-size:13.5px}
  .platzneu{padding:6px 12px}
  .bmenu{min-width:0;max-width:calc(100vw - 16px);width:calc(100vw - 16px)}
  .bmenu-suche,.bmenu-text{font-size:16px}
  .bmenu-name{padding:8px}
}

/* ================= Eintragsseite (Mitarbeiter, öffentlich) ================= */
body.eseite{background:var(--ground)}
.ekopf{background:var(--surface);border-bottom:1px solid var(--line);position:sticky;top:0;z-index:20}
.ekopf-in{display:flex;align-items:center;gap:12px;padding:12px 16px;max-width:640px;margin:0 auto}
.ekopf .brand strong{font-size:17px}
.ewer{order:3;margin-left:auto;font-size:13px;color:var(--muted);font-weight:500}
.eseite .brand{order:1}
.ereiter{display:flex;gap:4px;max-width:640px;margin:0 auto;padding:0 12px 9px}
.ereiter a{flex:1;text-align:center;text-decoration:none;color:var(--muted);font-weight:600;
  font-size:14px;padding:9px 10px;border-radius:7px}
.ereiter a.on{background:var(--signal-soft);color:var(--signal)}
.ezahl{display:inline-block;min-width:18px;font-size:11px;background:var(--signal);color:#fff;
  border-radius:20px;padding:0 5px;font-weight:700;vertical-align:1px}

.emain{max-width:640px;margin:0 auto;padding:14px 12px 60px}
.etag{font-family:Archivo,sans-serif;font-size:15px;margin:20px 0 9px;color:var(--ink)}
.etag:first-child{margin-top:4px}
.etag span{color:var(--muted);font-family:"IBM Plex Mono",monospace;font-size:13px;font-weight:400}

.ekarte{background:var(--surface);border:1px solid var(--line);border-radius:11px;
  box-shadow:var(--shadow);padding:15px 16px;margin-bottom:11px}
.ekarte h1{font-size:21px;margin-bottom:4px}
.ekarte h2{font-size:17px;margin-bottom:6px}
.ekarte h3{font-size:17px;line-height:1.25;margin:2px 0 10px}
.eart{font-size:11px;text-transform:uppercase;letter-spacing:.07em;font-weight:700;color:var(--signal)}
.etermin.drauf{border-color:var(--ok-line);background:var(--ok-soft)}
.emein.offen{border-color:var(--warn-line)}
.emein.ersatz{opacity:.92}
.elead{color:var(--muted);font-size:14px;margin-bottom:16px}

.eliste{margin:0 0 12px;display:flex;flex-direction:column;gap:5px}
.eliste > div{display:flex;gap:10px;align-items:baseline}
.eliste dt{flex:0 0 116px;font-size:12px;color:var(--muted);font-weight:600}
.eliste dd{margin:0;font-size:14.5px;color:var(--ink)}

.eplaetze{display:flex;flex-wrap:wrap;gap:6px;margin-bottom:12px}
.epl{font-size:12px;border-radius:20px;padding:3px 10px;border:1px solid var(--line);color:var(--muted)}
.epl.frei{border-color:var(--signal-line);background:var(--signal-soft);color:var(--signal);font-weight:600}
.epl.nix{opacity:.6}
.epl.weg{background:var(--surface-2);text-decoration:line-through}
.epl em{font-style:normal;font-size:11px;opacity:.85;margin-left:4px}

.ebtn{display:inline-flex;align-items:center;justify-content:center;gap:7px;width:100%;
  border:1px solid var(--signal);background:var(--signal);color:#fff;font-weight:600;font-size:15px;
  border-radius:9px;padding:13px 16px;cursor:pointer;text-decoration:none;margin-top:4px}
.ebtn:hover{filter:brightness(1.06)}
.ebtn[disabled]{opacity:.55;cursor:default}
.ebtn.leise{background:var(--surface);color:var(--ink-2);border-color:var(--line);font-weight:500;font-size:14px}
.ebtn.leise:hover{border-color:var(--muted);filter:none}
.ebtn.gross{font-size:16px;padding:15px 16px}
.ereihe{display:flex;gap:8px;flex-wrap:wrap}
.ereihe .ebtn{flex:1;min-width:140px;width:auto}

.ehinweis{border-radius:8px;padding:10px 12px;font-size:13.5px;margin-bottom:10px;
  background:var(--surface-2);color:var(--ink-2);border:1px solid var(--line-soft)}
.ehinweis.ok{background:var(--ok-soft);border-color:var(--ok-line);color:var(--ok)}
.ehinweis.warn{background:var(--warn-soft);border-color:var(--warn-line);color:var(--warn)}
.efuss{font-size:12.5px;color:var(--muted);margin-top:9px;line-height:1.45}
.eleer{text-align:center;padding:38px 20px;color:var(--muted)}
.eleer h2{color:var(--ink)}

.elabel{display:block;font-size:12px;text-transform:uppercase;letter-spacing:.06em;
  font-weight:700;color:var(--muted);margin-bottom:5px}
.efeld{width:100%;box-sizing:border-box;font-size:16px;padding:13px 13px;border-radius:9px;
  border:1px solid var(--line);background:var(--surface-2);color:var(--ink)}
.efeld:focus{outline:none;border-color:var(--signal);background:var(--surface)}
.efehler{margin-top:10px;font-size:13.5px;color:var(--warn);font-weight:500}
.etreffer{margin-top:12px;display:flex;flex-direction:column;gap:6px}

.etoast{position:fixed;left:12px;right:12px;bottom:16px;z-index:80;background:var(--ink);
  color:var(--ground);border-radius:9px;padding:12px 14px;font-size:14px;text-align:center;
  opacity:0;pointer-events:none;transition:opacity .18s}
.etoast.on{opacity:1}
.etoast.fehler{background:var(--warn);color:#fff}

.eblende{position:fixed;inset:0;z-index:90;background:rgba(0,0,0,.45);display:flex;
  align-items:flex-end;justify-content:center;padding:14px}
.eblende[hidden]{display:none}
.eabsage{max-width:460px;width:100%;margin:0}
.eabsage p{font-size:14px;line-height:1.5;margin-bottom:14px;color:var(--ink-2)}
@media (min-width:600px){ .eblende{align-items:center} }

/* Herkunft der Führerschein-Angabe */
.scheinquelle{font-size:10px;margin-top:3px;display:flex;align-items:center;gap:5px;flex-wrap:wrap}
.scheinquelle.offen{color:var(--warn);font-weight:600}
.scheinquelle.ok{color:var(--ok)}
.scheinquelle.leer{color:var(--muted)}
.miniok{border:1px solid var(--warn-line);background:var(--warn-soft);color:var(--warn);
  border-radius:4px;padding:1px 6px;font-size:10px;cursor:pointer;font-weight:600}
.miniok:hover{background:var(--warn);color:#fff}

/* Führerscheinfrage auf der Eintragsseite */
.escheinfrage{border-color:var(--signal-line);background:var(--signal-soft)}
.escheinfrage .ebtn{margin-top:7px}
.emeinschein{text-align:center;font-size:12.5px;color:var(--muted);margin:18px 0 0}
.emeinschein strong{color:var(--ink-2)}
.eklein{border:0;background:none;color:var(--signal);font-size:12.5px;cursor:pointer;
  text-decoration:underline;padding:0 3px}

/* ================= Touren bauen ================= */
.offenestopps{border-color:var(--warn-line);background:var(--warn-soft)}
.offenestopps h2{color:var(--warn)}
.stoppreihe{display:flex;flex-wrap:wrap;gap:6px;align-items:center}
.stoppchip{display:inline-flex;align-items:baseline;gap:7px;border:1px solid var(--line);
  background:var(--surface);border-radius:20px;padding:5px 12px;font-size:12.5px;cursor:pointer;
  color:var(--ink);text-align:left}
.stoppchip:hover{border-color:var(--signal)}
.stoppchip[disabled]{cursor:default;opacity:.75}
.stoppchip .nr{font-family:"IBM Plex Mono",monospace;font-size:10.5px;font-weight:700;color:#fff;
  background:var(--ink-2);border-radius:20px;min-width:16px;text-align:center;padding:0 4px}
.stoppchip .typ{font-size:10px;text-transform:uppercase;letter-spacing:.06em;font-weight:700;
  color:var(--del)}
.stoppchip.hol .typ{color:var(--va)}
.stoppchip .wen{font-weight:600}
/* Sehr lange Kundennamen duerfen den Chip nicht breiter als das Handy machen */
.stoppchip{max-width:100%}
.stoppchip .wen,.stoppchip .wo{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.stoppchip .wo,.stoppchip .wann{color:var(--muted);font-size:11.5px}
.stoppchip.offen{border-color:var(--warn-line);background:var(--warn-soft)}
.stoppchip.offen .wen{color:var(--warn)}

.tourliste2{display:flex;flex-direction:column;gap:0}
.tourbox{padding:12px 16px;border-bottom:1px solid var(--line-soft)}
.tourbox:last-child{border-bottom:0}
.tourbox.offen{background:var(--ground)}
.tourkopf{display:flex;align-items:center;gap:10px;flex-wrap:wrap;margin-bottom:9px}
.tourkopf > .f{font-family:Archivo,sans-serif;font-weight:700;font-size:14px;width:auto;min-width:70px}
.tourzeit{font-size:12px;color:var(--muted);display:flex;align-items:baseline;gap:5px}
.tourzeit .f{width:auto;min-width:50px;font-size:12.5px;padding:1px 5px}
.tourdauer{font-size:12px;padding:3px 7px}
.tourleer{font-size:12.5px;color:var(--muted);font-style:italic}
.tourwege{margin-top:8px}
.wegzeile{font-size:11.5px;color:var(--signal);line-height:1.6}
.tourkopf label.frei{display:flex;align-items:center;gap:6px;font-size:10.5px;font-weight:600;
  text-transform:uppercase;letter-spacing:.06em;color:var(--muted);cursor:pointer}
.tourkopf label.frei input{width:15px;height:15px;accent-color:var(--ok);margin:0}
.tourkopf label.frei.an{color:var(--ok)}
.tourkopf label.frei.zu{opacity:.5;cursor:help}
.tourkopf .mini{margin-left:auto}

@media (max-width:860px){
  .tourbox{padding:11px 13px}
  .tourkopf .mini{margin-left:0}
  .stoppchip{padding:7px 12px;font-size:13px}
}

/* Versandweg und SMTP-Protokoll */
.wegwahl{display:inline-flex;align-items:center;gap:7px;border:1px solid var(--line);
  background:var(--surface);border-radius:7px;padding:7px 13px;font-size:13px;cursor:pointer}
.wegwahl.on{border-color:var(--signal-line);background:var(--signal-soft);color:var(--signal);font-weight:600}
.wegwahl input{width:15px;height:15px;accent-color:var(--signal);margin:0}
.smtplog{background:var(--surface-2);border:1px solid var(--line);border-radius:7px;
  padding:10px 12px;font-family:"IBM Plex Mono",monospace;font-size:11.5px;line-height:1.55;
  color:var(--ink-2);overflow-x:auto;white-space:pre-wrap;word-break:break-word;margin:0;max-height:320px}

/* Warum die Freigabe noch nicht geht */
.freifehlt{display:block;font-size:10px;line-height:1.35;color:var(--warn);font-weight:600;
  margin-top:1px;overflow:hidden;display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical}
.hak label.frei.zu{opacity:1;color:var(--muted);cursor:pointer}
.hak label.frei.zu input{opacity:.55}
@media (max-width:860px){ .freifehlt{-webkit-line-clamp:none;font-size:11px} }
.fehltliste{list-style:none;margin:6px 0 0;padding:0;display:flex;flex-direction:column;gap:3px}
.fehltliste li{border-top:0;padding-top:0;font-size:12.5px;color:var(--ink-2)}
.fehltliste .mono{font-size:11.5px;color:var(--muted);margin-right:4px}
