/* 07-material.css · Teil 7 von 19 · Material (Auslastung, Reservierungen, Wunschmaterial). Reihenfolge der Dateien = Kaskade (index.html), nicht umsortieren. */
/* Material nach Vorlage projektil-material.html: Arbeitsspalte + Panel rechts,
   beide scrollen fuer sich (wie Home). Eigene Klassen mt-*. */
.mt { flex:1 1 0; min-height:0; display:grid; grid-template-columns:minmax(0,1fr) 340px; grid-template-rows:minmax(0,1fr); }
.mt-main { padding:24px var(--fx) 56px; display:flex; flex-direction:column; gap:18px; min-width:0; min-height:0;
  overflow-y:auto; overscroll-behavior:contain; }
.mt-rail { background:#fff; border-left:1px solid var(--border); padding:24px 26px 56px; min-width:0; min-height:0;
  overflow-y:auto; overscroll-behavior:contain; }
.mt-rail > section + section { margin-top:26px; padding-top:22px; border-top:1px solid var(--border); }
.mt-main > .empty-state { padding:24px 0; }
/* Knoepfe ohne Browser-Optik; :where() haelt die Spezifitaet bei 0,1,0 */
.mt :where(.mt-stat, .mt-seg button, .mt-ib, .mt-issue, .mt-wish, .mt-dl, .mt-lnk, .mt-cat button) {
  font:inherit; color:inherit; background:none; border:0; padding:0; margin:0; text-align:left; cursor:pointer; }
.mt-stand { display:inline-flex; align-items:center; gap:8px; font-size:13px; color:var(--muted); }
.mt-stand i { width:8px; height:8px; border-radius:50%; background:#1D7F55; }
.mt-stand.alt i { background:#E5A93A; }
.btn.mt-kbtn { display:inline-flex; align-items:center; gap:8px; font-size:14px; font-weight:500; padding:8px 14px; border-radius:10px; }
.btn.mt-kbtn .psub-i { width:15px; height:15px; }
.psub-n { font-style:normal; font-size:11.5px; font-weight:600; background:#EBEAFB; color:#4640C4; border-radius:999px; padding:0 7px; margin-left:6px; }

.mt-sh { display:flex; align-items:center; justify-content:space-between; gap:8px 12px; flex-wrap:wrap; margin:0 0 10px; }
.mt-sh h2 { margin:0; font-size:16px; font-weight:600; color:#1C1B22; }
.mt-sh h2 small { color:#9B98A8; font-weight:500; margin-left:6px; font-size:14px; }
.mt-sh .btn.sec { display:inline-flex; align-items:center; gap:6px; font-size:13px; padding:6px 12px; }
.mt-sh .btn.sec .psub-i { width:14px; height:14px; }
.mt-lnk { color:var(--pink); font-weight:500; font-size:14px; }
.mt-lnk:hover { text-decoration:underline; }
.mt-card { background:#fff; border:1px solid var(--border); border-radius:14px; }
.mt-leer { padding:28px; text-align:center; color:var(--muted); font-size:13.5px; line-height:1.6; }
.mt-leer.klein { padding:4px 0; text-align:left; }
.mt-note { font-size:12px; color:#9B98A8; margin:10px 0 0; }
.mt-muted { color:var(--muted); font-size:12.5px; }
.mt-warn { color:#8A5300; }

/* Status-Leiste = Filter */
.mt-stats { display:flex; flex-wrap:wrap; background:#fff; border:1px solid var(--border); border-radius:14px; overflow:hidden; }
.mt-stat { flex:1 1 140px; display:flex; flex-direction:column; gap:2px; padding:12px 18px; border-right:1px solid var(--border); position:relative; }
.mt-stat:last-child { border-right:0; }
.mt-stat:hover, .mt-stat[aria-pressed="true"] { background:#FAF8F5; }
.mt-stat[aria-pressed="true"]::after { content:""; position:absolute; left:0; right:0; bottom:0; height:2px; background:var(--pink); }
.mt-stat .n { font-size:22px; font-weight:700; font-variant-numeric:tabular-nums; color:#1C1B22; }
.mt-stat .l { font-size:13px; color:var(--muted); display:flex; align-items:center; gap:6px; }
.mt-sw { width:9px; height:9px; border-radius:3px; display:inline-block; flex:none; }
.mt-sw.frei { background:#1D7F55; } .mt-sw.aus { background:#E5A93A; } .mt-sw.ueber { background:#D7263D; } .mt-sw.ohne { background:#9FA0B8; }

/* Werkzeugleiste */
.mt-tools, .mt-nav { display:flex; flex-wrap:wrap; align-items:center; gap:10px 14px; }
.mt-seg { display:inline-flex; background:#fff; border:1px solid var(--border); border-radius:9px; padding:3px; gap:2px; }
.mt-seg button { padding:5px 12px; border-radius:6px; font-size:14px; font-weight:500; color:var(--muted); white-space:nowrap; }
.mt-seg button[aria-pressed="true"] { background:#1C1B22; color:#fff; }
.mt-mnav { display:flex; align-items:center; gap:6px; }
.mt-ib { width:32px; height:32px; display:grid; place-items:center; border:1px solid #D8D2C9; border-radius:8px; background:#fff; }
.mt-ib .psub-i { width:16px; height:16px; }
.mt-mt { font-weight:600; min-width:150px; text-align:center; }
.mt-mnav .btn.sec { font-size:13px; padding:6px 12px; }
.mt-sp { flex:1; }
.mt-field { display:flex; align-items:center; gap:8px; border:1px solid #D8D2C9; border-radius:8px; background:#fff; padding:0 10px; height:34px; color:var(--muted); }
.mt-field .psub-i { width:15px; height:15px; flex:none; }
.mt-field input, .mt-field select { border:0; background:transparent; outline:none; height:100%; min-width:0; font:inherit; font-size:14px; color:#1C1B22; }
.mt-field input { width:170px; }

/* Auslastungs-Raster: Spalte 1 klebt beim waagrechten Scrollen */
.mt-raster { overflow-x:auto; border-radius:14px 14px 0 0; }
.mt-grid { min-width:max-content; }
.mt-r { display:grid; grid-template-columns:260px var(--cols); align-items:stretch; }
.mt-r + .mt-r { border-top:1px solid var(--border); }
.mt-lbl { position:sticky; left:0; z-index:2; background:#fff; padding:9px 16px; border-right:1px solid var(--border);
  display:grid; grid-template-columns:minmax(0,1fr) auto; gap:2px 10px; align-items:center; }
.mt-lbl b { font-weight:600; font-size:14px; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.mt-lbl > span { font-size:12px; color:var(--muted); grid-column:1; }
.mt-lbl .mt-badge { grid-row:1 / span 2; grid-column:2; }
.mt-badge { font-size:12px; font-weight:700; border-radius:6px; padding:2px 7px; font-variant-numeric:tabular-nums; white-space:nowrap; }
.mt-badge.frei { background:#E3F3EA; color:#1D7F55; }
.mt-badge.aus { background:#FBF0DA; color:#A86D12; }
.mt-badge.ueber { background:#D7263D; color:#fff; }
.mt-badge.ohne { background:#EEEEF4; color:var(--muted); }
.mt-cells { display:grid; grid-template-columns:var(--cols); padding:6px 0; }
.mt-c { height:26px; margin:0 1px; display:grid; place-items:center; font-size:12px; font-weight:600; font-variant-numeric:tabular-nums;
  border-radius:4px; position:relative; }
.mt-c.frei { background:#E3F3EA; color:#1D7F55; }
.mt-c.aus { background:#E5A93A; color:#fff; }
.mt-c.ueber { background:#D7263D; color:#fff; }
.mt-c.ohne { background:#9FA0B8; color:#fff; }
.mt-c.rl { border-top-left-radius:0; border-bottom-left-radius:0; margin-left:0; }
.mt-c.rr { border-top-right-radius:0; border-bottom-right-radius:0; margin-right:0; }
.mt-c.td::after { content:""; position:absolute; top:-6px; bottom:-6px; left:50%; border-left:2px solid var(--cyan); opacity:.55; pointer-events:none; }
.mt-hdr, .mt-hdr .mt-lbl { background:#FAF8F5; }
.mt-hdr .mt-lbl { font-size:13px; font-weight:600; color:var(--muted); }
.mt-dh { display:flex; flex-direction:column; align-items:center; line-height:1.1; font-size:12px; color:var(--muted); padding:2px 0; border-radius:6px; }
.mt-dh b { font-size:13px; color:#1C1B22; font-weight:600; }
.mt-dh.we, .mt-dh.we b { color:#9B98A8; }
.mt-dh.td { background:var(--pink); color:#fff; }
.mt-dh.td b { color:#fff; }
.mt-dh.mo { font-size:13px; font-weight:600; color:#1C1B22; padding:6px 0; }
.mt-dh.mo.cur { color:var(--pink); }
.mt-cat, .mt-cat .mt-lbl { background:#FAF8F5; }
.mt-cat .mt-lbl { grid-column:1 / -1; border-right:0; position:static; display:flex; align-items:center; gap:10px; }
.mt-cat button { display:flex; align-items:center; gap:8px; font-weight:600; font-size:14px; }
.mt-cat button .psub-i { width:15px; height:15px; transition:transform .15s; }
.mt-cat button[aria-expanded="false"] .psub-i { transform:rotate(-90deg); }
.mt-cat .mt-lbl > span { font-size:13px; }
.mt-foot { display:flex; flex-wrap:wrap; gap:6px 14px; align-items:center; padding:10px 16px; border-top:1px solid var(--border); font-size:13px; color:var(--muted); }
.mt-foot > span { display:inline-flex; align-items:center; gap:6px; }
.mt-foot .mt-lnk { margin-left:auto; font-size:13px; }
.mt-tip { position:fixed; z-index:200; pointer-events:none; background:#1C1B22; color:#fff; font-size:12px; border-radius:8px; padding:8px 10px;
  max-width:270px; box-shadow:0 8px 24px rgba(0,0,0,.18); line-height:1.45; }
.mt-tip b { display:block; font-size:13px; margin-bottom:2px; }
.mt-tip[hidden] { display:none; }

/* Panel rechts: Engpässe + Wunschmaterial */
.mt-issue { display:grid; grid-template-columns:auto minmax(0,1fr); gap:4px 10px; padding:12px 0; width:100%; align-items:start; }
.mt-issue + .mt-issue { border-top:1px solid var(--border); }
.mt-issue b { font-weight:600; font-size:14px; }
.mt-issue p { margin:0; font-size:13px; color:var(--muted); grid-column:2; }
.mt-issue:hover b { text-decoration:underline; }
.mt-proj { grid-column:2; display:flex; flex-wrap:wrap; gap:4px; margin-top:2px; }
.mt-proj span { font-size:12px; background:#EBEAFB; color:#4640C4; border-radius:5px; padding:1px 6px; }
.mt-proj span.rm { background:#F3F1EC; color:var(--muted); }
.mt-wish { display:grid; grid-template-columns:minmax(0,1fr) auto; gap:2px 10px; padding:10px 0; align-items:center; width:100%; }
.mt-wish + .mt-wish { border-top:1px solid var(--border); }
.mt-wish b { font-weight:600; font-size:14px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.mt-wish > span:not(.mt-badge) { font-size:13px; color:var(--muted); }
.mt-wish .mt-badge { grid-row:1 / span 2; grid-column:2; }
.mt-wish:hover b { color:var(--pink); }

/* Reservierungen */
.mt-tscroll { overflow-x:auto; }
.mt-table { width:100%; border-collapse:collapse; font-size:14px; }
.mt-table th { text-align:left; font-size:12px; font-weight:600; color:#9B98A8; padding:10px 16px; background:#FAF8F5; white-space:nowrap; }
.mt-table td { padding:11px 16px; border-top:1px solid var(--border); vertical-align:middle; }
.mt-table tr:hover td { background:#FAF8F5; }
.mt-table tr.uml td { color:var(--muted); }
.mt-table .num { text-align:right; font-variant-numeric:tabular-nums; }
.mt-table td.akt { text-align:right; white-space:nowrap; }
.mt-table td.akt .mt-ib { width:28px; height:28px; display:inline-grid; margin-left:4px; }
.mt-table td.akt .mt-ib .psub-i { width:14px; height:14px; }
.mt-pill { display:inline-flex; align-items:center; font-size:12px; font-weight:600; padding:2px 9px; border-radius:999px; white-space:nowrap; }
.mt-pill.laeuft { background:#E3F3EA; color:#1D7F55; }
.mt-pill.hub, .mt-pill.offen { background:#EBEAFB; color:#4640C4; }
.mt-pill.pruef { background:#FBF0DA; color:#A86D12; }
.mt-pill.src { background:#FAF8F5; color:var(--muted); border:1px solid var(--border); }

/* Wunschmaterial: je Projekt eine aufklappbare Karte */
.mt-wcard + .mt-wcard { margin-top:14px; }
.mt-wcard summary { list-style:none; display:grid; grid-template-columns:auto minmax(0,1fr) auto auto auto; gap:12px; align-items:center; padding:14px 18px; cursor:pointer; }
.mt-wcard summary::-webkit-details-marker { display:none; }
.mt-wcard summary h3 { margin:0; font-size:16px; font-weight:600; }
.mt-wcard summary > .psub-i { width:16px; height:16px; color:#9B98A8; transition:transform .15s; }
.mt-wcard[open] summary > .psub-i { transform:rotate(180deg); }
.mt-wcard[open] summary { border-bottom:1px solid var(--border); }
.mt-code { font-family:'IBM Plex Mono',monospace; font-size:12px; font-weight:600; color:var(--pink); background:#FDE9EC; border-radius:5px; padding:2px 6px; white-space:nowrap; }
.mt-when { font-size:13px; color:var(--muted); text-align:right; white-space:nowrap; }
.mt-when b { color:#1C1B22; font-weight:600; }
.mt-when .bald { color:var(--pink); font-weight:600; }
.mt-wscroll { overflow-x:auto; }
.mt-wscroll > div { min-width:640px; }
.mt-wrow { display:grid; grid-template-columns:56px minmax(180px,1fr) 130px minmax(120px,.8fr) 160px; gap:12px; align-items:center; padding:10px 18px; }
.mt-wrow + .mt-wrow { border-top:1px solid var(--border); }
.mt-wrow .q { font-weight:700; text-align:right; font-variant-numeric:tabular-nums; }
.mt-wrow .n { font-weight:600; }
.mt-wrow .who { font-size:13px; color:var(--muted); text-align:right; }
.mt-wrow .cm { font-size:13px; color:#9B98A8; }
.mt-wrow.hd, .mt-wrow.hd .q, .mt-wrow.hd .who { font-size:12px; font-weight:600; color:#9B98A8; padding-top:8px; padding-bottom:8px; }
.mt-wsel { font:inherit; font-size:12px; font-weight:600; border:0; border-radius:999px; padding:3px 8px; cursor:pointer; }
.mt-wsel.offen { background:#EBEAFB; color:#4640C4; }
.mt-wsel.pruef { background:#FBF0DA; color:#A86D12; }
/* Materialdeadline je Projekt (Karte + Panel) und Nachtraege nach der Deadline */
.mt-md { display:inline-flex; align-items:center; gap:4px; font-size:12px; font-weight:600; padding:2px 9px; border-radius:999px; white-space:nowrap;
  background:#FAF8F5; color:var(--muted); border:1px solid var(--border); }
.mt-md.md-offen { background:#E3F3EA; color:#1D7F55; border-color:transparent; }
.mt-md.md-bald { background:#FBF0DA; color:#A86D12; border-color:transparent; }
.mt-md.md-abgelaufen { background:#FDE9EC; color:#B4232A; border-color:transparent; }
.mt-nt { display:inline-block; margin-right:6px; font-size:10.5px; font-weight:700; text-transform:uppercase; letter-spacing:.04em;
  padding:1px 6px; border-radius:999px; background:#FDE9EC; color:#B4232A; vertical-align:1px; }
.mt-wrow .grund { display:block; font-size:12px; font-weight:400; color:var(--muted); margin-top:2px; }
.mt-dl { display:grid; grid-template-columns:minmax(0,1fr) auto; gap:2px 10px; padding:9px 0; align-items:center; width:100%; }
.mt-dl + .mt-dl { border-top:1px solid var(--border); }
.mt-dl b { font-weight:600; font-size:14px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.mt-dl > span:not(.mt-md) { font-size:13px; color:var(--muted); }
.mt-dl .mt-md { grid-row:1 / span 2; grid-column:2; }
.mt-dl:hover b { color:var(--pink); }

/* Unter 1280 px rutscht das Panel unter die Arbeitsspalte, dann scrollt die
   ganze Seite */
@media (max-width:1280px) {
  .mt { display:block; flex:1 0 auto; min-height:auto; }
  .mt-main, .mt-rail { overflow:visible; }
  .mt-rail { border-left:0; border-top:1px solid var(--border); display:grid; grid-template-columns:repeat(auto-fit,minmax(280px,1fr));
    gap:28px; padding:24px var(--fx) 40px; }
  .mt-rail > section + section { margin-top:0; padding-top:0; border-top:0; }
}
@media (max-width:860px) {
  .mt-stat { flex-basis:50%; border-bottom:1px solid var(--border); }
  .mt-r { grid-template-columns:170px var(--cols); }
  .mt-field input { width:120px; }
}

/* Zumietungen (view-zumietung.js): Liste nach „Ordnern" Von → Nach; eigene Klassen mz-* */
.mz { flex:1 1 0; min-height:0; overflow-y:auto; overscroll-behavior:contain; padding:16px var(--fx) 40px; display:flex; flex-direction:column; gap:12px; }
.mz-leiste { display:flex; align-items:center; flex-wrap:wrap; gap:8px 14px; }
.fl-suche.mz-such { width:340px; }
.mz-seg { display:flex; flex-wrap:wrap; gap:10px; }
.mz-liste { display:flex; flex-direction:column; gap:10px; min-width:0; }
.mz-ordner { background:#fff; border:1px solid var(--border); border-radius:12px; overflow:hidden; }
.mz-ordner > summary { display:flex; align-items:center; justify-content:space-between; gap:12px; padding:8px 16px; cursor:pointer;
  background:#FAF9F6; font-weight:600; font-size:14px; color:#1C1B22; list-style:none; }
.mz-ordner > summary::-webkit-details-marker { display:none; }
.mz-ordner:not([open]) > summary { border-bottom:0; }
.mz-ordner[open] > summary { border-bottom:1px solid var(--border); }
.mz-o-t { display:inline-flex; align-items:center; gap:8px; min-width:0; }
.mz-o-t i, .mz-pfeil { display:inline-flex; color:var(--muted); }
.mz-o-t .psub-i, .mz-pfeil .psub-i { width:15px; height:15px; }
.mz-o-n { font-size:12px; font-weight:600; background:#EBEAFB; color:#4640C4; border-radius:999px; padding:1px 9px; }
.mz-z { display:grid; grid-template-columns:170px minmax(0,1.4fr) minmax(0,1.3fr) minmax(0,1.5fr); gap:3px 20px; padding:10px 16px;
  border-top:1px solid #F0EEE8; align-items:start; font-size:13px; line-height:1.35; }
.mz-reihen > .mz-z:first-child { border-top:0; }
/* Je Ordner zwei Spalten (23.10.2026): laufend links, kommend rechts, der nächste jeweils oben; Vergangene darunter über die ganze Breite */
.mz-spalten { display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1fr); }
.mz-sp { min-width:0; }
.mz-sp + .mz-sp { border-left:1px solid var(--border); }
.mz-sp-k, .mz-vorbei > summary { display:flex; align-items:center; justify-content:space-between; gap:12px; padding:6px 16px; background:#FAF9F6;
  border-bottom:1px solid #F0EEE8; font-size:12px; font-weight:600; text-transform:uppercase; letter-spacing:.05em; color:var(--muted); }
.mz-sp-k b, .mz-vorbei > summary b { font-size:11.5px; letter-spacing:0; background:#F3F1EC; color:#45434F; border-radius:999px; padding:0 8px; }
.mz-sp-laeuft .mz-sp-k span { color:#1D7F55; }
.mz-sp-kommt .mz-sp-k span { color:#4640C4; }
.mz-sp-leer { padding:12px 16px; color:var(--muted); font-style:italic; font-size:13px; }
.mz-sp .mz-z { grid-template-columns:132px minmax(0,1fr); gap:3px 14px; padding:10px 16px; }
.mz-sp .mz-route, .mz-sp .mz-pos { grid-column:2; }
.mz-vorbei { border-top:1px solid var(--border); }
.mz-ordner > summary + .mz-vorbei { border-top:0; }
.mz-vorbei > summary { cursor:pointer; list-style:none; }
.mz-vorbei > summary::-webkit-details-marker { display:none; }
.mz-vorbei:not([open]) > summary { border-bottom:0; }
.mz-z.vorbei { opacity:.62; }
.mz-z.storno .mz-t b { text-decoration:line-through; }
.mz-z small { display:block; color:var(--muted); font-size:12px; margin-top:1px; }
.mz-wann b { display:block; color:#1C1B22; font-weight:600; }
.mz-rel { display:inline-block; margin-top:2px; font-size:12px; font-weight:600; color:#4640C4; background:#EBEAFB; border-radius:999px; padding:0 8px; }
.mz-rel.laeuft { color:#1D7F55; background:#E3F3EA; }
.mz-rel.vorbei { color:var(--muted); background:#F3F1EC; }
.mz-t b { font-size:14px; font-weight:600; color:#1C1B22; overflow-wrap:anywhere; }
.mz-m { display:flex; flex-wrap:wrap; align-items:center; gap:3px 6px; margin-top:2px; color:var(--muted); font-size:12.5px; }
.mz-pill { font-size:11.5px; font-weight:600; padding:0 8px; border-radius:999px; background:#F3F1EC; color:#45434F; }
.mz-pill.ex { background:#FEF3E2; color:#8A4B0B; }
.mz-pill.in { background:#EBEAFB; color:#4640C4; }
.mz-pill.st.storno { background:#FBE6E8; color:#B4232A; }
.mz-proj, .mz-notiz { overflow-wrap:anywhere; }
.mz-route { display:grid; grid-template-columns:minmax(0,1fr) auto minmax(0,1fr); gap:6px; align-items:start; margin-top:2px; }
.mz-route span { display:inline; margin-right:5px; font-size:10.5px; font-weight:600; text-transform:uppercase; letter-spacing:.05em; color:#9B98A8; }
.mz-route b { display:inline; font-weight:600; color:#1C1B22; overflow-wrap:anywhere; }
.mz-route small { display:inline; margin:0; }
.mz-route small::before { content:' · '; }
.mz-pfeil { padding-top:1px; }
.mz-leer { color:var(--muted); font-weight:400; font-style:italic; }
.mz-pos { display:flex; flex-wrap:wrap; align-items:baseline; gap:0 10px; margin-top:2px; }
.mz-pos > ul, .mz-pos details[open] { flex:1 0 100%; }
.mz-pos > small { display:inline; margin:0; }
.mz-pos ul { margin:0; padding:0; list-style:none; }
.mz-pos li { padding:0; overflow-wrap:anywhere; }
.mz-pos li b { font-weight:600; color:#1C1B22; }
.mz-pos details summary { cursor:pointer; color:var(--navy); font-weight:600; font-size:12.5px; }
.mz-hinweis { font-size:12.5px; color:#8A4B0B; background:#FEF3E2; border-radius:10px; padding:8px 14px; }
.mz-err { color:#B4232A; }
.mz-hinweis.mz-err { background:#FBE6E8; }
.mz-hub { overflow-wrap:anywhere; }
.mz-hub a { color:var(--navy); font-weight:600; text-decoration:none; }
.mz-hub a:hover { text-decoration:underline; }
.mz-akt { display:flex; flex-wrap:wrap; gap:4px 6px; margin-top:4px; }
.mz-akt-b { font:inherit; font-size:12.5px; font-weight:600; color:var(--navy); background:#fff; border:1px solid var(--border); border-radius:8px; padding:2px 9px; cursor:pointer; }
.mz-akt-b:hover { border-color:#C9C6D6; background:#FAF9F6; }
/* Mehrere Hub-Projekte je interner Zumietung (16.10.2026): je Projekt eine Pille mit Link und × (löst nur dieses) */
.mz-hubp { display:inline-flex; align-items:center; gap:2px; max-width:100%; font-size:12.5px; background:#EEF0FB; border-radius:8px; padding:1px 4px 1px 8px; }
.mz-hubp a { color:var(--navy); font-weight:600; text-decoration:none; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.mz-hubp a:hover { text-decoration:underline; }
.mz-hubx { font:inherit; font-size:14px; line-height:1; color:var(--muted); background:none; border:0; border-radius:6px; padding:2px 5px; cursor:pointer; }
.mz-hubx:hover { color:#B4232A; background:#fff; }
.mz-wahl { display:flex; flex-direction:column; max-height:44vh; overflow-y:auto; margin-top:10px; border:1px solid var(--border); border-radius:10px; }
.mz-wahl-i { display:flex; flex-direction:column; gap:1px; font:inherit; text-align:left; background:none; border:0; border-bottom:1px solid #F0EEE8; padding:9px 12px; cursor:pointer; color:#1C1B22; }
.mz-wahl-i:last-child { border-bottom:0; }
.mz-wahl-i:hover { background:#F3F1EC; }
.mz-wahl-i small { color:var(--muted); font-size:12px; }
.mz-wahl-i .mz-kand { color:var(--muted); font-size:12px; }
.mz-im-projekt { border:1px solid var(--border); border-radius:12px; overflow:hidden; margin-top:10px; background:#fff; }
@media (max-width:1280px) {
  .mz { flex:1 0 auto; min-height:auto; overflow:visible; }
  .mz-z { grid-template-columns:170px minmax(0,1fr); }
  .mz-route, .mz-pos { grid-column:2; }
}
@media (max-width:1180px) {
  .mz-spalten { grid-template-columns:minmax(0,1fr); }
  .mz-sp + .mz-sp { border-left:0; border-top:1px solid var(--border); }
}
@media (max-width:640px) {
  .mz-z, .mz-sp .mz-z { grid-template-columns:minmax(0,1fr); }
  .mz-route, .mz-pos, .mz-sp .mz-route, .mz-sp .mz-pos { grid-column:auto; }
  .fl-suche.mz-such { width:100%; }
}

/* Crossloads (view-crossloads.js, 21.10.2026): Material zwischen aufeinanderfolgenden Projekten eines Tourplan-Sets; eigene Klassen cl-* */
/* Oben fest (Teamwunsch 21.10.2026): .cl-oben bleibt stehen, nur .cl-inhalt scrollt — darin klebt der Tabellenkopf. Auf kleinen Bildschirmen (unten) fliesst alles normal. */
.cl-seite { flex:1 1 0; min-height:0; overflow:hidden; padding:12px var(--fx) 0; display:flex; flex-direction:column; gap:8px; }
.cl-oben { flex:0 0 auto; display:flex; flex-direction:column; gap:8px; }
.cl-oben > :empty { display:none; }
.cl-leiste { display:flex; align-items:flex-end; flex-wrap:wrap; gap:6px 12px; }
.cl-sel { display:flex; flex-direction:column; gap:2px; font-size:10.5px; font-weight:600; text-transform:uppercase; letter-spacing:.05em; color:#9B98A8; }
.cl-sel select { font:inherit; font-size:14px; font-weight:500; text-transform:none; letter-spacing:0; color:#1C1B22; background:#fff; border:1px solid var(--border); border-radius:10px; padding:5px 10px; min-width:220px; max-width:100%; }
.cl-sel-ue select { min-width:400px; }
.cl-touren { display:inline-flex; align-items:center; gap:8px; }
.cl-tstand { font-size:11.5px; color:#9B98A8; white-space:nowrap; }
.cl-sel-set select { width:420px; }     /* die Projekte stehen im Namen: zugeklappt gekürzt, aufgeklappt ganz */
.cl-uk { display:grid; grid-template-columns:minmax(0,1fr) auto minmax(0,1fr); gap:8px 16px; align-items:center; background:#fff; border:1px solid var(--border); border-radius:12px; padding:10px 16px; }
.cl-pj-t { display:flex; align-items:baseline; flex-wrap:wrap; gap:4px 8px; }
.cl-pj-t a { font-size:14.5px; font-weight:600; color:var(--navy); text-decoration:none; overflow-wrap:anywhere; }
.cl-pj-t a:hover { text-decoration:underline; }
.cl-pj-t small, .cl-pj-i { color:var(--muted); font-size:12px; }
.cl-ab { display:inline-flex; align-items:center; justify-content:center; width:20px; height:20px; border-radius:6px; background:var(--navy); color:#fff; font-size:11px; font-weight:700; }
.cl-pj-d { margin-top:2px; font-size:13px; color:#45434F; }
.cl-pj-d b { color:#1C1B22; font-weight:600; }
.cl-pj-i { margin-top:1px; }
.cl-stern { color:#8A4B0B; cursor:help; }
.cl-fehlt { color:#B4232A; font-weight:600; }
.cl-mitte { display:flex; flex-direction:column; align-items:center; gap:0; text-align:center; font-size:13px; line-height:1.3; padding:4px 12px; border-radius:10px; background:#F3F1EC; color:#45434F; }
.cl-mitte i { display:none; }
.cl-mitte .psub-i { width:16px; height:16px; }
.cl-mitte.cl-ok { background:#E3F3EA; color:#1D7F55; }
.cl-mitte.cl-ueber { background:#FBE6E8; color:#B4232A; }
.cl-mitte.cl-fehlt { background:#FEF3E2; color:#8A4B0B; font-weight:400; }
/* Mitte der Kopfkarte: Crossload-Zeitfenster (Abbau-Ende A bis Aufbau-Beginn B), darunter das Lager (Rückrüsten A bis Rüsten B) */
.cl-mitte .cl-mt { font-size:10.5px; font-weight:600; text-transform:uppercase; letter-spacing:.06em; opacity:.85; }
.cl-mitte small { font-size:12px; }
.cl-mitte .cl-lager { margin-top:2px; padding-top:2px; border-top:1px solid rgba(0,0,0,.08); color:#45434F; font-weight:400; }
.cl-mitte .cl-lager.cl-lager-ueber { color:#B4232A; }
.cl-mitte .cl-lager.cl-lager-fehlt { color:#8A4B0B; }
.cl-sum { display:grid; grid-template-columns:repeat(4, minmax(0,1fr)); gap:8px; }
.cl-su { display:flex; flex-wrap:wrap; align-items:baseline; gap:0 10px; font:inherit; text-align:left; background:#fff; border:1px solid var(--border); border-radius:10px; padding:6px 12px; cursor:pointer; color:#1C1B22; }
.cl-su:hover { border-color:#C9C6D6; }
.cl-su span { font-size:11px; font-weight:600; text-transform:uppercase; letter-spacing:.05em; color:#9B98A8; }
.cl-su b { font-size:16px; font-weight:600; }
.cl-su small { color:var(--muted); font-size:12px; }
.cl-kgs { font-size:12.5px; color:#8A4B0B; }
.cl-stand { display:flex; align-items:center; gap:8px; margin:2px 4px; font-size:12.5px; color:var(--muted); }
.cl-stand i { flex:0 0 auto; width:8px; height:8px; border-radius:50%; background:#1D7F55; }
.cl-stand.alt { color:#8A4B0B; }
.cl-stand.alt i { background:#E5A93A; }
.cl-tabs { display:flex; }
.cl-tabs .seg-filter { flex-wrap:wrap; }
.cl-inhalt { flex:1 1 0; min-height:0; min-width:0; overflow:auto; overscroll-behavior:contain; padding-bottom:56px; display:flex; flex-direction:column; gap:12px; }
.cl-inhalt > * { flex:0 0 auto; }
.cl-hinweis { font-size:12.5px; color:#8A4B0B; background:#FEF3E2; border-radius:10px; padding:5px 12px; overflow-wrap:anywhere; }
.cl-hinweis.cl-err { color:#B4232A; background:#FBE6E8; }
.cl-hinweis.cl-warn { color:#8A4B0B; background:#FEF3E2; }
.cl-hinweis.cl-ok { color:#0A6B49; background:#E7F6EF; }
.cl-ohne { font-size:12.5px; color:#6B6A75; margin:6px 0 0; }
.cl-ohne summary { cursor:pointer; font-weight:500; color:#4A4955; }
.cl-ohne p { margin:6px 0 4px; }
.cl-ohne ul { margin:0; padding-left:18px; }
.cl-ohne li { margin:2px 0; overflow-wrap:anywhere; }
.cl-hb { font-size:12.5px; font-weight:600; padding:3px 10px; border-radius:8px; margin-left:8px; }
.cl-tw { background:#fff; border:1px solid var(--border); border-radius:14px; width:max-content; min-width:100%; }
.cl-tab { width:100%; border-collapse:collapse; font-size:13.5px; }
.cl-tab th { position:sticky; top:0; z-index:1; background:var(--th-bg); color:var(--muted); text-align:left; font-size:11.5px; font-weight:600; padding:0 12px; border-bottom:1px solid var(--border); box-shadow:inset 0 -1px 0 var(--border); white-space:nowrap; }
.cl-tab th.cl-n { text-align:right; }
.cl-tab thead th:first-child { border-top-left-radius:13px; }
.cl-tab thead th:last-child { border-top-right-radius:13px; }
.cl-sort { font:inherit; font-size:11.5px; font-weight:600; color:inherit; background:none; border:0; padding:9px 0; cursor:pointer; text-transform:none; }
.cl-sort:hover, .cl-sort.aktiv { color:var(--navy); }
.cl-sort i { font-style:normal; font-size:9px; margin-left:4px; }
.cl-tab td { padding:7px 12px; border-bottom:1px solid #F0EEE8; vertical-align:top; }
.cl-tab td.cl-n { text-align:right; white-space:nowrap; font-variant-numeric:tabular-nums; }
.cl-tab tr.cl-gr td { background:#FAF9F6; font-weight:600; color:var(--navy); border-top:1px solid var(--border); }
.cl-tab tr.cl-gr small, .cl-tab tr.cl-ges small { color:var(--muted); font-weight:400; margin-left:4px; }
.cl-tab tr.cl-ges td { font-weight:600; border-top:2px solid var(--navy); border-bottom:0; }
.cl-tab tr.cl-kind td.cl-name { padding-left:34px; color:#45434F; }
.cl-tab tr.cl-kind td.cl-name small { color:var(--muted); margin-left:4px; }
.cl-tab tr.cl-warnzeile td:first-child { box-shadow:inset 3px 0 0 #B4232A; }
.cl-name { overflow-wrap:anywhere; }
.cl-tg { position:relative; width:20px; height:20px; margin:0 6px 0 -4px; padding:0; vertical-align:middle; background:none; border:0; border-radius:6px; cursor:pointer; }
.cl-tg::before { content:''; position:absolute; left:6px; top:6px; width:6px; height:6px; border-right:2px solid var(--muted); border-bottom:2px solid var(--muted); transform:rotate(-45deg); }
.cl-tg.offen::before { top:4px; transform:rotate(45deg); }
.cl-tg:hover { background:#F3F1EC; }
.cl-teile { margin-left:8px; color:var(--muted); font-size:12px; font-weight:400; }
.cl-tw-k { display:flex; justify-content:flex-end; }
.cl-pill { font-size:11px; font-weight:600; padding:0 7px; border-radius:999px; background:#EBEAFB; color:#4640C4; }
.cl-neg { color:#B4232A; }
.cl-pos { color:#1D7F55; }
.cl-leer { color:var(--muted); }
.cl-davon { color:var(--muted); }
.cl-hin { font-size:12.5px; color:#45434F; }
.cl-chip { display:inline-block; font-size:11.5px; font-weight:600; padding:1px 8px; border-radius:999px; background:#F3F1EC; color:#45434F; margin-right:4px; cursor:help; }
.cl-chip-rot { background:#FBE6E8; color:#B4232A; }
.cl-chip-gruen { background:#E3F3EA; color:#1D7F55; }
/* Übersicht (View crossloads): alle Crossloads mit Zeitfenster */
.cl-ueb-seg { display:flex; }
.cl-ueb-wann b { display:block; color:#1C1B22; font-weight:600; white-space:nowrap; }
.cl-ueb-wann small { color:var(--muted); font-size:12px; }
.cl-ueb-wann.cl-fehlt { color:#8A4B0B; font-weight:400; }
.cl-ueb-wann.cl-fehlt b { color:#8A4B0B; font-weight:500; }
.cl-ueb-wann.cl-ueber b { color:#B4232A; }
.cl-ueb-weg a { color:var(--navy); font-weight:600; text-decoration:none; }
.cl-ueb-weg a:hover { text-decoration:underline; }
.cl-ueb-weg i { font-style:normal; color:var(--muted); margin:0 6px; }
.cl-ueb-vorbei td { opacity:.6; }
.cl-chip.cl-lager-ok { background:#E3F3EA; color:#1D7F55; }
.cl-chip.cl-lager-ueber { background:#FBE6E8; color:#B4232A; }
.cl-chip.cl-lager-fehlt { background:#FEF3E2; color:#8A4B0B; }
.cl-fuss { font-size:12px; color:var(--muted); }
.cl-kl { display:flex; flex-direction:column; gap:8px; }
.cl-kl-i { display:flex; align-items:flex-start; gap:12px; background:#fff; border:1px solid var(--border); border-radius:12px; padding:12px 16px; }
.cl-kl-t { flex:1 1 auto; min-width:0; }
.cl-kl-t p { margin:3px 0 0; font-size:13px; color:#45434F; overflow-wrap:anywhere; }
.cl-kl-t small { color:var(--muted); font-size:12px; margin-left:4px; }
.cl-kl-t small.cl-wer { display:block; margin:3px 0 0; }
.cl-kl-i .btn { flex:0 0 auto; margin-left:0; }
.cl-art { flex:0 0 auto; font-size:11.5px; font-weight:600; padding:2px 10px; border-radius:999px; background:#F3F1EC; color:#45434F; white-space:nowrap; }
.cl-art-fehlt { background:#FBE6E8; color:#B4232A; }
.cl-art-paar { background:#FEF3E2; color:#8A4B0B; }
.cl-art-zusatz, .cl-art-lose { background:#EBEAFB; color:#4640C4; }
.cl-bewusst { background:#fff; border:1px solid var(--border); border-radius:12px; padding:0 16px 12px; }
.cl-bewusst > summary { cursor:pointer; padding:12px 0; font-weight:600; font-size:13.5px; color:var(--navy); }
.cl-bewusst .cl-kl-i { margin-top:8px; background:#FAF9F6; }
@media (max-width:1280px) {
  .cl-sum { grid-template-columns:repeat(2, minmax(0,1fr)); }
}
@media (max-width:860px), (max-height:760px) {
  .cl-seite { flex:1 0 auto; min-height:auto; overflow:visible; padding-bottom:56px; }
  .cl-inhalt { flex:0 0 auto; overflow:visible; padding-bottom:0; }
  .cl-tw { width:auto; overflow-x:auto; }
  .cl-tab th { position:static; }
}
@media (max-width:760px) {
  .cl-uk { grid-template-columns:minmax(0,1fr); }
  .cl-sel, .cl-sel select, .cl-sel-ue select { width:100%; min-width:0; }
  .cl-kl-i { flex-wrap:wrap; }
}