/* View-spezifische Styles (wächst pro Modul) */

/* Login */
.login-screen, .login-box {
  min-height: 100vh; display: flex; align-items: center; justify-content: center;
  padding: var(--sp-5); background: linear-gradient(160deg, var(--green-50), var(--blue-50));
}
.login-card {
  background: var(--surface); border: 1px solid var(--border); border-radius: var(--r-lg);
  box-shadow: var(--sh-2); padding: var(--sp-6); width: 100%; max-width: 460px;
}
.login-brand { display: flex; align-items: center; gap: var(--sp-4); margin-bottom: var(--sp-4); }
.login-brand .logo { width: 56px; height: 56px; border-radius: 14px; background: linear-gradient(135deg, var(--green-600), var(--green-900)); color: #fff; display: grid; place-items: center; font-weight: 800; font-size: 26px; }
.login-brand h1 { font-size: var(--fs-xl); margin: 0; color: var(--primary-dark); }
.login-brand p { margin: 0; }
.login-users { display: flex; flex-direction: column; gap: var(--sp-2); margin-top: var(--sp-3); }
.login-user {
  display: flex; align-items: center; gap: var(--sp-3); width: 100%; text-align: left;
  padding: var(--sp-3); border: 1px solid var(--border); border-radius: var(--r-md);
  background: var(--surface); cursor: pointer; min-height: 64px; transition: border-color .12s, box-shadow .12s;
}
.login-user:hover { border-color: var(--green-500); box-shadow: var(--sh-1); }
.lu-meta { display: flex; flex-direction: column; line-height: 1.2; }
.lu-meta b { font-size: var(--fs-md); }

/* Zeiterfassung */
.ze-status { border-left: 6px solid var(--gray-300); }
.ze-status.st-work { border-left-color: var(--green-600); background: linear-gradient(90deg, var(--green-50), var(--surface) 40%); }
.ze-status.st-pause { border-left-color: var(--st-in_arbeit); background: linear-gradient(90deg, #fff7ed, var(--surface) 40%); }
.ze-status.st-done { border-left-color: var(--gray-400); }
.ze-status-row { display: flex; justify-content: space-between; align-items: flex-start; gap: var(--sp-4); }
.ze-state { font-size: var(--fs-xl); font-weight: 800; }
.ze-clock-box { text-align: right; }
.ze-clock { font-size: 40px; font-weight: 800; font-variant-numeric: tabular-nums; color: var(--primary-dark); line-height: 1; }
.ze-actions { display: flex; gap: var(--sp-3); margin: var(--sp-5) 0 var(--sp-4); flex-wrap: wrap; }
.ze-actions .btn { flex: 1; min-width: 160px; }
.ze-sums { display: flex; gap: var(--sp-4); align-items: center; flex-wrap: wrap; border-top: 1px solid var(--border); padding-top: var(--sp-3); }
.ze-sum { display: flex; flex-direction: column; }
.ze-sum b { font-size: var(--fs-lg); }
.ze-week { display: grid; grid-template-columns: repeat(7, 1fr); gap: 6px; }
.ze-day { text-align: center; border: 1px solid var(--border); border-radius: var(--r-md); padding: 8px 4px; }
.ze-day.is-today { border-color: var(--primary); background: var(--green-50); }
.ze-day.is-sel { outline: 3px solid var(--primary); outline-offset: 1px; }
.ze-day:hover { border-color: var(--primary); }
.ze-day.is-off { background: var(--gray-50); color: var(--text-muted); }
.ze-day-wd { font-size: var(--fs-xs); color: var(--text-muted); font-weight: 700; }
.ze-day-dt { font-size: var(--fs-lg); font-weight: 700; }
.ze-day-h { font-size: var(--fs-xs); margin-top: 2px; }
@media (max-width: 900px) {
  .view .grid[style] { grid-template-columns: 1fr !important; }
}

/* Urlaub */
.vac-acc { display: grid; grid-template-columns: repeat(2, 1fr); gap: var(--sp-4); }
.vac-acc-cell { background: var(--gray-50); border-radius: var(--r-md); padding: var(--sp-3) var(--sp-4); }
.vac-acc-val { font-size: var(--fs-xl); font-weight: 800; }
.vac-acc-val.big { color: var(--primary-dark); }
.vac-preview { display: flex; flex-direction: column; gap: 6px; }

/* Kalender */
.cal-card { padding: var(--sp-4); }
.cal-toolbar { display: flex; align-items: center; justify-content: space-between; gap: var(--sp-3); flex-wrap: wrap; margin-bottom: var(--sp-3); }
.cal-toolbar .btn { min-height: 40px; }
.cal-title { font-size: var(--fs-lg); margin-left: var(--sp-2); }
.cal-legend { display: flex; flex-wrap: wrap; gap: var(--sp-3); padding: 6px 2px var(--sp-3); }
.cal-leg { display: inline-flex; align-items: center; gap: 6px; font-size: var(--fs-sm); color: var(--text-muted); }
.cal-dot { width: 12px; height: 12px; border-radius: 50%; display: inline-block; flex: none; }

.cal-month-head { display: grid; grid-template-columns: repeat(7, 1fr); }
.cal-wd { text-align: center; font-weight: 700; color: var(--text-muted); font-size: var(--fs-sm); padding: 6px 0; }
.cal-weeks { display: flex; flex-direction: column; border: 1px solid var(--border); border-radius: var(--r-md); overflow: hidden; }
.cal-week { position: relative; border-top: 1px solid var(--border); }
.cal-week:first-child { border-top: 0; }
.cal-week-days { display: grid; grid-template-columns: repeat(7, 1fr); height: 100%; position: absolute; inset: 0; }
.cal-day { border-left: 1px solid var(--border); padding: 4px 6px; cursor: pointer; }
.cal-day:first-child { border-left: 0; }
.cal-day.other { background: var(--gray-50); color: var(--gray-400); }
.cal-day.off { background: #fafbfa; }
.cal-day.today .cal-dnum { background: var(--primary); color: #fff; }
.cal-day:hover { background: var(--green-50); }
.cal-dnum { display: inline-grid; place-items: center; min-width: 24px; height: 24px; border-radius: 50%; font-weight: 700; font-size: var(--fs-sm); }
.cal-hol { font-size: 10px; color: var(--st-storniert); line-height: 1.1; margin-top: 2px; }
.cal-bar { position: absolute; height: 19px; margin-left: 3px; border-radius: 5px; border: 1.5px solid; font-size: 11px; font-weight: 700; line-height: 16px; padding: 0 6px; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; cursor: pointer; z-index: 2; }
.cal-bar.pending { border-style: dashed; background: transparent !important; }

.cal-weekview { display: grid; grid-template-columns: repeat(7, 1fr); border: 1px solid var(--border); border-radius: var(--r-md); overflow: hidden; min-height: 320px; }
.cal-col { border-left: 1px solid var(--border); min-height: 320px; cursor: pointer; }
.cal-col:first-child { border-left: 0; }
.cal-col.off { background: #fafbfa; }
.cal-col.today { background: var(--green-50); }
.cal-col-head { text-align: center; padding: 8px 4px; border-bottom: 1px solid var(--border); }
.cal-col-head b { display: block; color: var(--text-muted); font-size: var(--fs-xs); }
.cal-col-head span { font-size: var(--fs-lg); font-weight: 700; }
.cal-col-body { padding: 6px; display: flex; flex-direction: column; gap: 4px; }
.cal-chip { border: 1.5px solid; border-radius: 6px; padding: 4px 8px; font-size: 12px; font-weight: 700; cursor: pointer; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.cal-chip.pending { border-style: dashed; }
.cal-day-banner { background: var(--warn-bg); color: var(--warn); padding: 8px 12px; border-radius: var(--r-md); font-weight: 700; margin-bottom: var(--sp-3); }
.cal-agenda .list-item { cursor: pointer; }
@media (max-width: 700px) {
  .cal-hol { display: none; }
  .cal-bar { font-size: 0; padding: 0; }
  .cal-weekview { min-height: 240px; }
}

/* Disposition */
.dispo-hint { background: var(--info-bg); color: var(--blue-700); border: 1px solid var(--blue-100); border-radius: var(--r-md); padding: 10px 14px; margin-bottom: var(--sp-4); font-weight: 600; display: flex; align-items: center; gap: var(--sp-3); }
.dispo-grid { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1.3fr); gap: var(--sp-4); align-items: start; }
.dispo-orders { position: sticky; top: 0; }
.order-card .li-title { font-weight: 700; }
.dispo-techs { display: grid; grid-template-columns: repeat(auto-fill, minmax(280px, 1fr)); gap: var(--sp-4); }
.tech-box { background: var(--surface); border: 1px solid var(--border); border-top: 4px solid var(--tc, var(--primary)); border-radius: var(--r-md); padding: var(--sp-4); box-shadow: var(--sh-1); }
.tech-box.armed { box-shadow: var(--sh-1), 0 0 0 2px var(--green-100); }
.tb-head { display: flex; align-items: center; gap: var(--sp-3); padding-bottom: var(--sp-3); border-bottom: 1px solid var(--border); margin-bottom: var(--sp-3); }
.tb-label { font-size: var(--fs-xs); text-transform: uppercase; letter-spacing: .04em; color: var(--gray-500); font-weight: 700; margin-bottom: 6px; }
.slot-row { display: flex; flex-wrap: wrap; gap: 6px; }
.slot-chip { display: inline-flex; flex-direction: column; align-items: center; min-width: 56px; min-height: 48px; justify-content: center; border: 1px solid var(--border); border-radius: var(--r-md); background: var(--gray-50); cursor: pointer; padding: 4px 8px; line-height: 1.1; }
.slot-chip b { font-size: var(--fs-xs); color: var(--text-muted); }
.slot-chip span { font-weight: 700; }
.slot-chip.armed { border-color: var(--green-500); background: var(--green-50); }
.slot-chip.armed:hover { background: var(--green-100); transform: translateY(-1px); }
.tb-planned { margin-top: var(--sp-3); border-top: 1px dashed var(--border); padding-top: var(--sp-3); display: flex; flex-direction: column; gap: 6px; }
.tb-order { display: flex; align-items: center; gap: 8px; font-size: var(--fs-sm); cursor: pointer; padding: 4px 6px; border-radius: 8px; }
.tb-order:hover { background: var(--gray-50); }
.tb-order.conflict { background: var(--danger-bg); }
.tb-date { font-weight: 700; min-width: 52px; }
.tb-cust { flex: 1; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
@media (max-width: 1000px) { .dispo-grid { grid-template-columns: 1fr; } .dispo-orders { position: static; } }

/* Montage-Detail */
.montage { padding-bottom: 90px; }
.kv { display: flex; justify-content: space-between; gap: var(--sp-4); padding: 5px 0; border-bottom: 1px dashed var(--gray-100); }
.kv > span:first-child { color: var(--text-muted); }
.photo-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(120px, 1fr)); gap: 8px; margin-top: 8px; }
.photo-grid img { width: 100%; height: 110px; object-fit: cover; border-radius: var(--r-md); border: 1px solid var(--border); }
.media-cell { position: relative; display: block; }
.media-thumb { width: 100%; height: 110px; object-fit: cover; border-radius: var(--r-md); border: 1px solid var(--border); background: #000; }
.media-badge { position: absolute; top: 4px; left: 4px; font-size: 14px; background: rgba(0,0,0,.55); border-radius: 6px; padding: 0 4px; line-height: 1.4; }
.sig-row { display: grid; grid-template-columns: 1fr 1fr; gap: var(--sp-4); }
.sig-box { display: flex; flex-direction: column; gap: 8px; align-items: flex-start; border: 1px solid var(--border); border-radius: var(--r-md); padding: var(--sp-3); }
.sig-thumb { width: 100%; max-width: 260px; height: 90px; object-fit: contain; border: 1px solid var(--border); border-radius: 8px; background: #fff; }
.sig-empty { width: 100%; max-width: 260px; height: 90px; display: grid; place-items: center; color: var(--gray-400); border: 2px dashed var(--gray-200); border-radius: 8px; font-size: var(--fs-sm); }
.action-bar { position: fixed; left: 0; right: 0; bottom: 0; background: var(--surface); border-top: 1px solid var(--border); padding: 12px 20px; display: flex; gap: var(--sp-3); justify-content: center; z-index: 30; box-shadow: 0 -4px 16px rgba(0,0,0,.06); }
.action-bar .btn { flex: 1 1 0; max-width: 320px; min-width: 180px; }
@media (max-width: 900px) { .action-bar { bottom: 64px; } .sig-row { grid-template-columns: 1fr; } }

/* Arbeitszeit-Sessions */
.sess-list { display: flex; flex-direction: column; gap: 4px; }
.sess-row { display: flex; align-items: center; gap: 10px; padding: 6px 4px; border-bottom: 1px dashed var(--gray-100); }
.sess-row.running { color: var(--st-in_arbeit); font-weight: 700; }
.sess-idx { color: var(--text-muted); font-size: var(--fs-sm); min-width: 28px; }
.sess-time { flex: 1; }
.sess-total { margin-top: 8px; border-top: 1px solid var(--border); padding-top: 8px; }
.sess-total b { font-size: var(--fs-lg); color: var(--primary-dark); }

/* Abschluss-Warnungen */
.warn-list { margin: 8px 0; padding-left: 4px; list-style: none; display: flex; flex-direction: column; gap: 8px; }
.warn-list li { background: var(--warn-bg); color: var(--warn); border-radius: var(--r-sm); padding: 8px 12px; font-weight: 600; }
.warn-list li::before { content: "⚠ "; }

/* Signatur-Pad */
.sig-wrap { border: 2px dashed var(--gray-300); border-radius: var(--r-md); overflow: hidden; background: #fff; }
.sig-canvas { width: 100%; height: auto; touch-action: none; display: block; }

/* Anlagen-Modal */
.anlagen-grid { display: grid; grid-template-columns: 190px minmax(0, 1fr); gap: var(--sp-4); }
.anl-list { display: flex; flex-direction: column; gap: 6px; }
.anl-item { padding: 10px 12px; border: 1px solid var(--border); border-radius: var(--r-md); cursor: pointer; }
.anl-item.active { border-color: var(--primary); background: var(--green-50); }
.anl-sec { margin-top: var(--sp-4); }
.kunde-card { cursor: pointer; transition: box-shadow .12s, border-color .12s; }
.kunde-card:hover { box-shadow: var(--sh-1); border-color: var(--green-500); }
@media (max-width: 700px) { .anlagen-grid { grid-template-columns: 1fr; } }
.anl-detail { display: flex; flex-direction: column; gap: var(--sp-3); }
.anl-hero { position: relative; border-radius: var(--r-md); overflow: hidden; background: var(--gray-100); min-height: 180px; }
.anl-hero-img { width: 100%; height: 220px; object-fit: cover; display: block; }
.anl-hero.empty { display: grid; place-items: center; min-height: 180px; border: 2px dashed var(--gray-300); }
.anl-hero-ph { display: flex; flex-direction: column; align-items: center; gap: 6px; color: var(--gray-400); font-size: 40px; }
.anl-hero-ph span { font-size: var(--fs-sm); }
.anl-hero-cap { position: absolute; left: 0; right: 0; bottom: 0; padding: 14px 16px 10px; background: linear-gradient(transparent, rgba(0,0,0,.72)); color: #fff; }
.anl-hero.empty .anl-hero-cap { position: static; background: none; color: var(--text); padding: 10px 4px 0; }
.anl-hero-title { font-size: var(--fs-lg); font-weight: 800; display: flex; align-items: center; gap: 8px; }
.anl-hero-sub { font-size: var(--fs-sm); opacity: .9; }
.anl-chip { font-size: 11px; background: rgba(255,255,255,.25); border-radius: 6px; padding: 1px 6px; font-weight: 700; }
.anl-hero.empty .anl-chip { background: var(--blue-100); color: var(--blue-700); }
.anl-actions { display: flex; gap: 8px; flex-wrap: wrap; }
.anl-timeline { display: flex; flex-direction: column; gap: 0; margin-top: 6px; }
.anl-detail2 { display: grid; grid-template-columns: minmax(0, 1.5fr) minmax(0, 1fr); gap: var(--sp-4); align-items: start; }
.anl-main { display: flex; flex-direction: column; gap: var(--sp-3); min-width: 0; }
.anl-history-col { border-left: 1px solid var(--border); padding-left: var(--sp-4); max-height: 72vh; overflow: auto; min-width: 0; }
.anl-history-head { position: sticky; top: 0; background: var(--surface); display: flex; align-items: center; justify-content: space-between; padding-bottom: 8px; z-index: 1; }
@media (max-width: 820px) { .anl-detail2 { grid-template-columns: 1fr; } .anl-history-col { border-left: 0; padding-left: 0; border-top: 1px solid var(--border); padding-top: var(--sp-3); max-height: none; } }
.anl-tl-item { display: flex; gap: 12px; padding: 10px 0; border-bottom: 1px solid var(--gray-100); cursor: pointer; border-radius: 8px; }
.anl-tl-item:hover { background: var(--green-50); }
.anl-tl-item:last-child { border-bottom: 0; }
.anl-tl-thumb { flex: none; }
.anl-tl-thumb img { width: 64px; height: 64px; object-fit: cover; border-radius: var(--r-md); border: 1px solid var(--border); display: block; }
.anl-tl-ic { flex: none; width: 64px; height: 64px; display: grid; place-items: center; font-size: 26px; background: var(--gray-50); border-radius: var(--r-md); }
.anl-tl-body { flex: 1; min-width: 0; }
.anl-tl-head { display: flex; align-items: baseline; justify-content: space-between; gap: 10px; }
.anl-tl-text { font-size: var(--fs-sm); margin-top: 2px; white-space: pre-wrap; }

/* Störungsmeldung (strukturiert) */
.stoer-box { background: #fff8e1; border: 1px solid #ffe082; border-radius: var(--r-md); padding: 10px 12px; margin-bottom: 12px; }
.stoer-head { font-weight: 800; display: flex; justify-content: space-between; align-items: baseline; gap: 10px; margin-bottom: 4px; }
.stoer-box .kv { border-bottom-color: #ffecb3; }
.stoer-fehler-list { margin: 4px 0 2px; padding-left: 18px; font-size: var(--fs-sm); }
.stoer-fehler-list li { margin-bottom: 2px; }

/* Tätigkeiten: Status-Buttons + Bemerkung je Punkt (Stundenzettel-Optik) */
.arb-list { display: flex; flex-direction: column; gap: 10px; }
.arb-item2 { border: 2px solid var(--border); border-radius: var(--r-md); padding: 12px; background: var(--surface); display: flex; flex-direction: column; gap: 8px; }
.arb-item2.st-erledigt { border-color: var(--green-500); background: var(--green-50); }
.arb-item2.st-teilweise { border-color: #ffb300; background: #fff8e1; }
.arb-item2.st-nicht_moeglich { border-color: var(--st-storniert); background: var(--danger-bg); }
.arb-head { display: flex; align-items: baseline; gap: 10px; }
.arb-head .arb-text { flex: 1; font-weight: 600; }
.arb-item2.st-erledigt .arb-text { text-decoration: line-through; color: var(--text-muted); }
.arb-state-chip { font-size: 11px; font-weight: 800; border-radius: 6px; padding: 1px 8px; background: var(--gray-100); color: var(--text-muted); white-space: nowrap; }
.arb-state-chip.st-erledigt { background: var(--green-600); color: #fff; }
.arb-state-chip.st-teilweise { background: #ffb300; color: #fff; }
.arb-state-chip.st-nicht_moeglich { background: var(--st-storniert); color: #fff; }
.arb-status { flex-wrap: wrap; }
.arb-status button { min-height: 38px; padding: 0 12px; font-size: var(--fs-sm); }
.arb-status button.active.st-erledigt { background: var(--green-600); color: #fff; }
.arb-status button.active.st-teilweise { background: #ffb300; color: #fff; }
.arb-status button.active.st-nicht_moeglich { background: var(--st-storniert); color: #fff; }
.arb-bem { min-height: 52px; font-size: 15px; }
.arb-del { border: 0; background: none; color: var(--gray-400); cursor: pointer; font-size: 14px; padding: 2px 6px; border-radius: 4px; flex: none; }
.arb-del:hover { color: var(--st-storniert); background: var(--danger-bg); }
.arb-list > .input { margin-top: 2px; padding: 12px; font-size: 16px; }

/* Material: Icon-Schnellauswahl + Untermenü + Teilesuche */
.mat-icons { display: flex; flex-wrap: wrap; gap: 10px; }
.mat-icon { display: flex; flex-direction: column; align-items: center; gap: 2px; min-width: 76px; padding: 10px 8px; border: 2px solid var(--border); border-radius: var(--r-md); background: var(--surface); cursor: pointer; transition: transform .15s, border-color .15s, box-shadow .15s; }
.mat-icon:hover { transform: translateY(-2px); border-color: var(--green-500); box-shadow: var(--sh-1); }
.mat-icon-em { font-size: 26px; line-height: 1; }
.mat-icon-lbl { font-size: 11px; font-weight: 700; color: var(--text-muted); }
.mat-sub-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(190px, 1fr)); gap: 8px; }
.mat-sub-btn { padding: 14px 12px; border: 2px solid var(--border); border-radius: var(--r-md); background: var(--surface); cursor: pointer; font-size: 15px; font-weight: 600; text-align: left; }
.mat-sub-btn:hover { border-color: var(--green-500); background: var(--green-50); }
.teile-search { position: relative; margin-bottom: 8px; }
.teile-search > .input { padding: 12px 14px; font-size: 16px; }
.teile-results { display: flex; flex-direction: column; }
.teile-hit { display: flex; align-items: center; gap: 10px; padding: 10px 12px; border: 1px solid var(--border); border-top: 0; background: var(--surface); cursor: pointer; text-align: left; font-size: var(--fs-sm); }
.teile-hit:hover { background: var(--green-50); }
.teile-hit-t { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; flex: 1; }
.teile-hit-meta { color: var(--text-muted); font-size: var(--fs-xs); white-space: nowrap; }

/* Monteur-Schein: größere Eingaben (Tablet/Diktat) */
.montage .textarea { min-height: 90px; font-size: 16px; padding: 12px; }
.montage .field > label { font-weight: 700; }

/* Dashboard-Aufgaben (Startseite) */
.aufg-list { display: flex; flex-direction: column; gap: 10px; }
.aufg-item { display: flex; align-items: center; gap: 12px; border: 1px solid var(--border); border-radius: var(--r-md); padding: 10px 12px; }
.aufg-item.warn { border-color: var(--st-in_arbeit, #d97706); background: #fffaf0; }
.aufg-item .li-body { flex: 1; min-width: 0; }

/* Monteur: nächste Termine als Karten */
.term-cards { display: grid; grid-template-columns: repeat(auto-fill, minmax(260px, 1fr)); gap: 12px; }
.term-card { display: flex; align-items: center; gap: 14px; border: 1px solid var(--border); border-radius: var(--r-md); padding: 12px 14px; cursor: pointer; background: var(--surface); }
.term-card:hover { border-color: var(--primary); box-shadow: var(--sh-1, 0 2px 8px rgba(0,0,0,.06)); }
.term-date { text-align: center; min-width: 92px; border-right: 1px solid var(--border); padding-right: 14px; display: flex; flex-direction: column; gap: 2px; flex: none; }
.term-date b { font-size: var(--fs-sm); white-space: nowrap; }
.term-body { flex: 1 1 auto; min-width: 0; }
.term-name { font-weight: 700; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.term-sub { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; margin-top: 2px; }
.term-status { flex: none; margin-left: auto; }
.term-status .badge { white-space: nowrap; }

/* Stempeluhr: persönliches Konto-Dashboard */
.konto-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; }
.konto-kpi { display: flex; flex-direction: column; gap: 2px; padding: 12px; border: 1px solid var(--border); border-radius: var(--r-md); background: var(--gray-50); }
.konto-kpi b { font-size: 22px; line-height: 1.1; }
.konto-kpi.big { padding: 16px; }
.konto-kpi.big b { font-size: 28px; }
.konto-kpi .pos { color: var(--st-geplant, #2e7d32); }
.konto-kpi .neg { color: var(--st-storniert, #c62828); }

/* Auswertung: Übersicht-Boxen + editierbare/markierte Zeilen */
.ov-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(280px, 1fr)); gap: 14px; }
.ov-box { border: 1px solid var(--border); border-radius: var(--r-md); padding: 14px; cursor: pointer; background: var(--surface); }
.ov-box:hover { border-color: var(--primary); box-shadow: var(--sh-1, 0 2px 8px rgba(0,0,0,.06)); }
.ov-box-head { display: flex; align-items: center; gap: 10px; margin-bottom: 10px; }
.ovb-kpis { display: grid; grid-template-columns: repeat(5, 1fr); gap: 6px; text-align: center; }
.ovb-kpi { display: flex; flex-direction: column; gap: 1px; }
.ovb-kpi b { font-size: var(--fs-sm); }
.ovb-kpi .pos { color: var(--st-geplant, #2e7d32); }
.ovb-kpi .neg { color: var(--st-storniert, #c62828); }
.aus-table td.aus-edit { cursor: pointer; }
.aus-table td.aus-edit:hover { background: var(--blue-50, #e8f0fe); outline: 1px solid var(--blue-700, #1565c0); }
.aus-table tr.manuell { background: #fffaf0; }
.aus-table tr.manuell td:first-child { color: var(--st-in_arbeit, #b45309); font-weight: 700; }
/* Disponenten-Ampel: fertig gemeldet = grün, unfertig/in Arbeit = rot */
.aus-table tr.row-done td { background: #eaf7ea; }
.aus-table tr.row-open td { background: #fdecec; }
.aus-table tr.row-done:hover td, .aus-table tr.row-open:hover td { filter: brightness(0.97); }

/* Wizard-Ansicht (Schritt-für-Schritt) */
.wiz-tabs { display: flex; flex-wrap: wrap; gap: 6px; margin-bottom: 16px; }
.wiz-tab { border: 1px solid var(--border); background: var(--surface); border-radius: 999px; padding: 7px 14px; font-size: var(--fs-sm); font-weight: 600; cursor: pointer; color: var(--text-muted); }
.wiz-tab.active { background: var(--primary, #2f7d32); color: #fff; border-color: var(--primary, #2f7d32); }
.wiz-foot { display: flex; align-items: center; justify-content: space-between; gap: 12px; margin-top: 18px; padding-top: 14px; border-top: 1px solid var(--border); position: sticky; bottom: 0; background: var(--bg, #fff); }

/* Karten-Trenner (z.B. innerhalb der zusammengefassten Auftraggeber/Maschine-Karte) */
.card-sep { border: 0; border-top: 1px solid var(--border); margin: 14px 0 12px; }

/* Ausgeführte Leistungen: Composer + Einträge je Monteur */
.leist-composer { padding: 12px; border: 1px dashed var(--border); border-radius: var(--r-md); background: var(--gray-50); margin-bottom: 12px; }
.leist-list { display: flex; flex-direction: column; gap: 10px; }
.leist-entry { border: 1px solid var(--border); border-radius: var(--r-md); padding: 10px; }
.leist-entry-head { display: flex; align-items: center; gap: 6px; margin-bottom: 6px; }

/* Ausgeführte Leistungen: blaue Bubbles (bestellte Positionen) */
.leist-chips { display: flex; flex-wrap: wrap; gap: 8px; margin-bottom: 10px; }
.leist-chip { background: var(--blue-700, #1565c0); color: #fff; border: 0; border-radius: 999px; padding: 6px 12px; font-size: var(--fs-sm); font-weight: 600; cursor: pointer; max-width: 100%; }
/* Teile-/Maschinen-Trefferliste scrollbar (mehr als 20 Einträge) */
.teile-results.scroll { max-height: 320px; overflow-y: auto; border: 1px solid var(--border); border-radius: var(--r-md); }
.teile-results.scroll:empty { border: 0; }
.leist-chip:hover { filter: brightness(1.08); }
/* Zeiterfassungs-Tätigkeiten als Bubbles */
.leist-chip.ze-act { font-size: var(--fs-md); padding: 9px 14px; }
.leist-chip.chip-pause { background: var(--st-in_arbeit, #d97706); }
.leist-chip.disabled { opacity: .4; cursor: not-allowed; }
.leist-chip.disabled:hover { filter: none; }
.leist-chip.active { outline: 3px solid var(--primary, #14532d); outline-offset: 1px; }
/* Tätigkeits-Buttons: weiches Ein-/Ausblenden beim Wechsel */
.ze-fade .btn { animation: zeFadeIn .25s ease; }
.btn-fade-out { opacity: 0 !important; transform: scale(.92); transition: opacity .2s ease, transform .2s ease; pointer-events: none; }
@keyframes zeFadeIn { from { opacity: 0; transform: scale(.95); } to { opacity: 1; transform: scale(1); } }
.pdf-link { margin-top: 8px; display: flex; align-items: center; gap: 8px; flex-wrap: wrap; }
.pdf-link a { word-break: break-all; }
/* Wartungsverträge: lange Leistungstexte lesbar (Umbrüche statt aneinandergereiht) */
.wv-item { align-items: flex-start; }
.wv-item .li-sub { white-space: normal; }
.wv-scope { margin-top: 6px; display: flex; flex-direction: column; gap: 3px; max-width: 72ch; }
/* Nur an Wortgrenzen umbrechen (kein Bruch mitten im Wort) */
.wv-scope-line { font-size: var(--fs-sm); color: var(--text-muted); line-height: 1.45; white-space: normal; overflow-wrap: break-word; hyphens: auto; }
.wv-scope-head { font-size: var(--fs-sm); font-weight: 700; color: var(--text); margin-top: 8px; line-height: 1.45; overflow-wrap: break-word; }
.wv-scope-head:first-child { margin-top: 0; }
.wv-scope-li { font-size: var(--fs-sm); color: var(--text-muted); line-height: 1.5; position: relative; padding-left: 18px; overflow-wrap: break-word; hyphens: auto; }
.wv-scope-li::before { content: '•'; position: absolute; left: 6px; color: var(--primary, #14532d); font-weight: 700; }

/* An- und Abfahrt-Editor (OSM-Vorschlag) */
.azt-fahrt { margin-top: 16px; border-top: 1px solid var(--border); padding-top: 12px; }
.azt-fahrt h4 { margin-bottom: 6px; }
.fahrt-legs { display: grid; grid-template-columns: 1fr 1fr; gap: 14px; }
@media (max-width: 760px) { .fahrt-legs { grid-template-columns: 1fr; } }
.fahrt-leg { border: 1px solid var(--border); border-radius: var(--r-md); padding: 12px; background: var(--gray-50); }
.fahrt-leg-head { display: flex; align-items: baseline; justify-content: space-between; gap: 8px; margin-bottom: 8px; }
.fahrt-inputs { display: flex; gap: 12px; }
.fahrt-inputs label { display: flex; flex-direction: column; gap: 4px; font-size: var(--fs-sm); color: var(--text-muted); font-weight: 600; }
.fahrt-num { width: 110px; padding: 10px; font-size: 16px; font-weight: 700; }
.fahrt-num.sm { width: 64px; }
.fahrt-time { flex: 1; }
.fahrt-hm { display: flex; align-items: center; gap: 6px; }
.fahrt-hm-sep { font-size: var(--fs-sm); color: var(--text-muted); font-weight: 600; }
.fahrt-grund { margin-top: 8px; display: flex; flex-direction: column; gap: 4px; }
.fahrt-grund label { color: var(--st-storniert); font-weight: 700; font-size: var(--fs-sm); }
.fahrt-hotel { display: flex; align-items: center; gap: 10px; margin-top: 6px; }
.fahrt-hotel .fahrt-num { width: 90px; }
.ue-block { margin-top: 14px; border-top: 1px solid var(--border); padding-top: 12px; }
.ue-list { display: flex; flex-direction: column; gap: 10px; }
.ue-entry { border: 1px solid var(--border); border-radius: var(--r-md); padding: 10px; background: var(--gray-50); }
.ue-entry-head { display: flex; align-items: center; gap: 8px; margin-bottom: 6px; }

/* Maschinen-Neuanlage im Einplanen-Dialog */
.masch-new { background: var(--gray-50); border: 1px dashed var(--gray-300); border-radius: var(--r-md); padding: 10px 12px; margin: 8px 0; }

/* Maschinenübersicht */
.masch-search { width: 100%; padding: 10px 14px; font-size: var(--fs-md); margin-bottom: var(--sp-4); }
.masch-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(290px, 1fr)); gap: var(--sp-4); }
.masch-card { display: flex; gap: 12px; border: 1px solid var(--border); border-radius: var(--r-md); padding: 10px; cursor: pointer; transition: box-shadow .12s, border-color .12s; background: var(--surface); }
.masch-card:hover { border-color: var(--green-500); box-shadow: var(--sh-1); }
.masch-img { width: 76px; height: 76px; object-fit: cover; border-radius: var(--r-md); flex: none; border: 1px solid var(--border); }
.masch-img.ph { display: grid; place-items: center; font-size: 30px; background: var(--gray-50); }
.masch-body { min-width: 0; flex: 1; }
.masch-title { font-weight: 800; display: flex; align-items: center; gap: 6px; flex-wrap: wrap; }
.masch-nums { display: flex; align-items: center; gap: 8px; margin: 2px 0; }
.masch-bj { font-size: var(--fs-xs); font-weight: 700; color: var(--blue-700); background: var(--blue-100); border-radius: 6px; padding: 0 6px; }
.masch-sub, .masch-cust { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }

/* Planungsübersicht (wer ist wann wo) */
.planung .view-head p { margin: 2px 0 0; }
.pl-legend { display: flex; flex-wrap: wrap; align-items: center; gap: var(--sp-3); padding: 6px 2px var(--sp-3); }
.pl-leg { display: inline-flex; align-items: center; gap: 6px; font-size: var(--fs-sm); color: var(--text-muted); }
.pl-swatch { width: 14px; height: 14px; border-radius: 4px; display: inline-block; flex: none; border: 1.5px solid transparent; }
.pl-swatch.urlaub { background: var(--blue-100); border-color: var(--blue-700); }
.pl-swatch.sonder { background: #ede7f6; border-color: #4527a0; }
.pl-swatch.krank { background: var(--danger-bg); border-color: var(--st-storniert); }
.pl-swatch.auftrag { background: var(--green-50); border-color: var(--green-600); }

.pl-scroll { overflow-x: auto; }
.pl-grid { min-width: 760px; border: 1px solid var(--border); border-radius: var(--r-md); overflow: hidden; }
.pl-row { display: grid; grid-template-columns: 150px repeat(7, 1fr); border-top: 1px solid var(--border); }
.pl-row:first-child { border-top: 0; }
.pl-head { position: sticky; top: 0; z-index: 2; background: var(--gray-50); }
.pl-name { display: flex; align-items: center; gap: 8px; padding: 8px 10px; border-right: 1px solid var(--border); font-weight: 700; background: var(--surface); overflow: hidden; }
.pl-name span { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.pl-corner { background: var(--gray-50); color: var(--text-muted); }
.pl-dayhead { text-align: center; padding: 6px 4px; border-left: 1px solid var(--border); line-height: 1.15; }
.pl-dayhead b { display: block; font-size: var(--fs-xs); color: var(--text-muted); }
.pl-dayhead span { font-size: var(--fs-sm); font-weight: 700; }
.pl-dayhead.off { background: #fafbfa; }
.pl-dayhead.today { background: var(--green-50); }
.pl-dayhead.today span { color: var(--primary-dark); }
.pl-hol { display: block; font-size: 10px; color: var(--st-storniert); font-style: normal; line-height: 1.1; }
.pl-cell { border-left: 1px solid var(--border); padding: 5px; min-height: 52px; display: flex; flex-direction: column; gap: 4px; }
.pl-cell.off { background: #fafbfa; }
.pl-cell.today { background: var(--green-50); }
.pl-empty { color: var(--gray-300); font-size: var(--fs-sm); text-align: center; }
.pl-chip { border: 1.5px solid; border-radius: 6px; padding: 3px 7px; font-size: 12px; font-weight: 700; line-height: 1.2; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.pl-chip.urlaub { background: var(--blue-100); border-color: var(--blue-700); color: var(--blue-700); }
.pl-chip.sonder { background: #ede7f6; border-color: #4527a0; color: #4527a0; }
.pl-chip.krank { background: var(--danger-bg); border-color: var(--st-storniert); color: var(--st-storniert); }
.pl-chip.auftrag { background: var(--green-50); border-color: var(--green-600); color: var(--primary-dark); cursor: pointer; }
.pl-chip.auftrag:hover { background: var(--green-100); }
.pl-chip.pending { border-style: dashed; background: transparent; }

/* Monteursteuerung (Zeitstrahl-Disposition) */
.dispo-tl { --dt-lh: 150px; }
.dispo-tl .view-head p { margin: 2px 0 0; }
.dt-layout { display: grid; grid-template-columns: 240px minmax(0, 1fr); gap: var(--sp-4); align-items: start; }
@media (max-width: 1000px) { .dt-layout { grid-template-columns: 1fr; } }

/* Linke Auftragsliste (kompakt) */
.dt-orders { border: 1px solid var(--border); border-radius: var(--r-md); overflow: hidden; position: sticky; top: 0; }
.dt-orders-head { padding: 8px 10px; font-weight: 700; font-size: var(--fs-sm); background: var(--gray-50); border-bottom: 1px solid var(--border); display: flex; flex-direction: column; gap: 2px; }
.dt-hint { font-weight: 600; color: var(--primary); font-size: var(--fs-xs); }
.dt-orders-list { max-height: 70vh; overflow-y: auto; }
.dt-ord { padding: 6px 9px; border-bottom: 1px solid var(--gray-100); cursor: pointer; font-size: var(--fs-xs); line-height: 1.25; }
.dt-ord:hover { background: var(--green-50); }
.dt-ord.sel { background: var(--green-100); box-shadow: inset 3px 0 0 var(--green-600); }
.dt-ord-top { display: flex; justify-content: space-between; align-items: center; gap: 6px; }
.dt-km { color: var(--text-muted); font-size: 10px; white-space: nowrap; }
.dt-ord-cust { font-weight: 700; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.dt-ord-sub { color: var(--text-muted); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.li-num.sm { font-size: 10px; padding: 0 4px; margin: 0; }
.empty.sm { padding: var(--sp-4); font-size: var(--fs-sm); color: var(--text-muted); text-align: center; }

/* Rechtes Board: scrollbare Grid-Zeitachse */
.dt-board { overflow-x: auto; border: 1px solid var(--border); border-radius: var(--r-md); }
.dt-grid { display: grid; align-items: stretch; }
.dt-corner { position: sticky; left: 0; z-index: 3; background: var(--gray-50); border-bottom: 1px solid var(--border); border-right: 1px solid var(--border); padding: 6px 8px; font-size: var(--fs-xs); font-weight: 700; color: var(--text-muted); display: flex; align-items: center; }
.dt-dayhead { border-bottom: 1px solid var(--border); border-left: 1px solid var(--gray-100); text-align: center; padding: 4px 2px; line-height: 1.1; background: var(--surface); }
.dt-dayhead.off { background: #fafbfa; }
.dt-dayhead.today { background: var(--green-50); }
.dt-dayhead.today span { color: var(--primary-dark); font-weight: 800; }
.dt-dayhead.wsep { border-left: 2px solid var(--border); }
.dt-dayhead b { display: block; font-size: 10px; color: var(--text-muted); }
.dt-dayhead span { font-size: var(--fs-xs); font-weight: 700; }
.dt-lanehead { position: sticky; left: 0; z-index: 2; background: var(--surface); border-top: 1px solid var(--border); border-right: 1px solid var(--border); border-left: 4px solid var(--gray-300); padding: 6px 8px; display: flex; align-items: center; gap: 8px; font-weight: 700; font-size: var(--fs-sm); overflow: hidden; }
.dt-lanehead span { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.dt-cell { border-top: 1px solid var(--border); border-left: 1px solid var(--gray-100); min-height: 64px; padding: 4px; display: flex; flex-direction: column; gap: 3px; }
/* Monteursteuerung füllt die Höhe bis unten */
.view.dispo-tl { height: 100%; display: flex; flex-direction: column; }
.dispo-tl > .view-head { flex: none; }
.dispo-tl > .cal-card { flex: 1 1 auto; min-height: 0; display: flex; flex-direction: column; }
.dispo-tl .cal-toolbar { flex: none; }
.dispo-tl .dt-layout { flex: 1 1 auto; min-height: 0; align-items: stretch; }
/* Board und Unverplant-Liste gleiche Höhe + jeweils eigener Scroll, damit auch lange Listen rübergezogen werden können. */
.dispo-tl .dt-board { max-height: calc(100vh - 140px); height: 100%; overflow: auto; }
.dispo-tl .dt-orders { position: sticky; top: 8px; max-height: calc(100vh - 140px); display: flex; flex-direction: column; min-height: 0; }
.dispo-tl .dt-orders-list { flex: 1 1 auto; max-height: none; overflow-y: auto; }
.dt-cell.span-sel { outline: 2px solid var(--green-600); outline-offset: -2px; background: var(--green-100); }
.dt-span-preview { position: fixed; z-index: 400; background: var(--primary-dark); color: #fff; font-weight: 800; font-size: var(--fs-sm); padding: 4px 10px; border-radius: 8px; pointer-events: none; box-shadow: var(--sh-2); display: none; }
.dt-bar-team { font-size: 10px; font-weight: 800; background: rgba(0,0,0,.18); border-radius: 6px; padding: 0 4px; margin-left: 4px; }
/* Kontextmenü (Rechtsklick auf geplanten Termin) */
.ctx-menu { position: fixed; z-index: 500; background: var(--surface); border: 1px solid var(--border); border-radius: var(--r-md); box-shadow: var(--sh-3, 0 8px 24px rgba(0,0,0,.18)); padding: 4px; min-width: 210px; display: flex; flex-direction: column; }
.ctx-item { display: block; width: 100%; text-align: left; background: none; border: 0; padding: 9px 12px; border-radius: 8px; font-size: var(--fs-sm); cursor: pointer; color: var(--text); }
.ctx-item:hover { background: var(--gray-100); }
.ctx-item.danger { color: var(--st-storniert); }
/* Weitere Mitarbeiter im Einplanen-Dialog */
.mit-list { display: flex; flex-wrap: wrap; gap: 6px; margin-top: 8px; }
.mit-chip { display: inline-flex; align-items: center; gap: 6px; background: var(--gray-100); border: 1px solid var(--border); border-radius: 999px; padding: 3px 6px 3px 10px; font-size: var(--fs-sm); }
.mit-chip.conflict { background: var(--danger-bg); border-color: var(--st-storniert); }
.mit-warn { color: var(--st-storniert); font-size: var(--fs-xs); font-weight: 700; }
.mit-x { border: 0; background: none; cursor: pointer; font-size: 14px; line-height: 1; color: var(--text-muted); }
.aus-list { display: flex; flex-direction: column; gap: 6px; margin-top: 6px; }
.aus-row { display: flex; align-items: center; gap: 8px; font-size: var(--fs-sm); }
.aus-row .btn { min-height: 28px; padding: 0 8px; margin-left: auto; }
.aus-badge { font-size: 11px; font-weight: 700; border-radius: 6px; padding: 1px 6px; }
.aus-badge.urlaub { background: var(--blue-100); color: var(--blue-700); }
.aus-badge.krank { background: var(--danger-bg); color: var(--st-storniert); }
.aus-badge.sonstiges { background: var(--gray-100); color: var(--text-muted); }
.aus-add { display: grid; grid-template-columns: 1fr 1fr 1fr 1.4fr auto; gap: 6px; margin-top: 4px; }
.aus-add input, .aus-add select { padding: 6px 8px; border: 1px solid var(--border); border-radius: var(--r-md); width: 100%; }
.uf-section { border-top: 1px solid var(--border); margin-top: 10px; padding-top: 10px; }
.dt-ord-datum { font-size: 10px; color: var(--blue-700); font-weight: 700; cursor: pointer; padding: 0 4px; border-radius: 4px; background: var(--blue-100); }
.dt-ord-datum:hover { background: var(--blue-700); color: #fff; }
.dt-ord.planned { opacity: .85; background: repeating-linear-gradient(45deg, transparent, transparent 6px, rgba(0,0,0,.02) 6px, rgba(0,0,0,.02) 12px); }
.dt-showplanned { display: flex; align-items: center; gap: 8px; padding: 8px 10px; border-top: 1px solid var(--border); font-size: var(--fs-sm); background: var(--gray-50); cursor: pointer; }
.dt-showplanned input { width: 16px; height: 16px; }
.peek { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1.15fr); gap: var(--sp-4); align-items: start; }
.peek-info .kv { padding: 4px 0; }
.peek-text { margin-top: 8px; font-size: var(--fs-sm); color: var(--text-muted); white-space: pre-wrap; }
.peek-map { height: 340px; border-radius: var(--r-md); overflow: hidden; border: 1px solid var(--border); background: var(--gray-50); }
@media (max-width: 760px) { .peek { grid-template-columns: 1fr; } .peek-map { height: 240px; } }
.dt-cell.wsep { border-left: 2px solid var(--border); }
.dt-cell.off { background: #fafbfa; }
.dt-cell.today { background: rgba(47,125,50,.05); }
.dt-cell.abs.urlaub { background: var(--blue-100); }
.dt-cell.abs.sonder { background: #ede7f6; }
.dt-cell.abs.krank { background: var(--danger-bg); }
.dt-cell.armable { cursor: pointer; }
.dt-cell.armable:hover { outline: 2px dashed var(--green-500); outline-offset: -2px; background: var(--green-50); }
.dt-abs-lbl { font-size: 10px; font-weight: 700; color: var(--text-muted); text-align: center; align-self: center; }
/* Freitext-Chip: liegt über den Auftragsbalken, blockiert den Tag nicht */
.dt-frei-chip { font-size: 10px; font-weight: 700; color: #92400e; background: #fef3c7; border: 1px solid #fcd34d; border-radius: 6px; padding: 1px 5px; margin-bottom: 3px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
/* Statusfarben für neue Status auf den Balken */
.dt-bar.status-warte_ersatzteile { border-left-color: var(--st-warte_ersatzteile); background: #fff1e6; }
.dt-bar.status-zur_pruefung { border-left-color: var(--st-zur_pruefung); background: #f5e8ff; }
.dt-bar { display: flex; align-items: center; gap: 4px; border-radius: 5px; border-left: 3px solid var(--green-600); background: var(--green-50); color: var(--primary-dark); padding: 2px 4px; font-size: 11px; line-height: 1.2; cursor: pointer; overflow: hidden; }
.dt-bar:hover { background: var(--green-100); }
.dt-bar.status-in_arbeit { border-left-color: var(--st-in_arbeit); background: #fff7ed; }
.dt-bar.status-teilabgeschlossen { border-left-color: var(--blue-700); background: var(--blue-100); }
.dt-bar.status-abgeschlossen { border-left-color: var(--gray-400); background: var(--gray-50); color: var(--text-muted); }
.dt-bar.conflict { border-color: var(--st-storniert); background: var(--danger-bg); color: var(--st-storniert); }
.dt-bar-nr { font-weight: 800; font-variant-numeric: tabular-nums; }
.dt-bar-t { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.dt-bar-x { order: 3; margin-left: auto; color: var(--text-muted); font-weight: 700; padding: 0 2px; border-radius: 4px; }
.dt-bar-x:hover { background: rgba(0,0,0,.08); color: var(--st-storniert); }
.dt-durwrap { display: inline-flex; align-items: center; gap: 4px; font-size: var(--fs-xs); color: var(--text-muted); font-weight: 600; }
.dt-dur { font-size: var(--fs-xs); padding: 2px 4px; border: 1px solid var(--border); border-radius: 6px; background: var(--surface); }
.dt-bar-dur { order: 2; margin-left: auto; font-size: 10px; font-weight: 800; background: rgba(0,0,0,.06); border-radius: 4px; padding: 0 4px; white-space: nowrap; }
.dt-ord { cursor: grab; }
.dt-ord:active { cursor: grabbing; }
.dt-ord-meta { display: inline-flex; align-items: center; gap: 6px; }
.dt-est { color: var(--primary-dark); font-weight: 700; font-size: 10px; white-space: nowrap; }
.dt-est.wait { color: var(--gray-400); font-weight: 600; }
.dt-cell.drop-ok { outline: 2px solid var(--green-600); outline-offset: -2px; background: var(--green-100) !important; }
/* Mehrere Termine je Tag nebeneinander */
.dt-bars { display: flex; flex-wrap: wrap; gap: 3px; align-content: flex-start; }
.dt-bar { flex: 1 1 auto; min-width: 0; max-width: 100%; }
.dt-bar-time { font-weight: 800; font-size: 10px; font-variant-numeric: tabular-nums; background: rgba(0,0,0,.06); border-radius: 4px; padding: 0 3px; white-space: nowrap; }
.dt-bar--mit { opacity: .85; border-left-style: dashed; cursor: pointer; }
.dt-bar-team { order: 4; font-size: 10px; font-weight: 800; background: rgba(0,0,0,.12); border-radius: 6px; padding: 0 4px; }
/* Markierte leere Zellen (für Krank/Urlaub/Freitext per Rechtsklick) */
.dt-cell.marked { outline: 2px solid var(--blue-700, #1565c0); outline-offset: -2px; background: var(--blue-50, #e8f0fe); }
.dt-lanehead--click { cursor: pointer; }
.dt-lanehead--click:hover { background: var(--gray-100); }
.days-dlg .li-num { font-size: var(--fs-sm); }
.days-field { display: flex; flex-direction: column; gap: 6px; font-weight: 700; margin-top: var(--sp-2); }
.days-input { width: 120px; font-size: var(--fs-lg); padding: 8px 10px; border: 1px solid var(--border); border-radius: var(--r-md); font-weight: 700; }
.est-line { margin-top: 10px; font-size: var(--fs-sm); }

/* Montageauftrag: Arbeits-/Fahrzeit-Tabelle + Material-Editor */
.azt-scroll { overflow-x: auto; }
.azt { width: 100%; border-collapse: collapse; font-size: var(--fs-sm); }
.azt th, .azt td { border: 1px solid var(--border); padding: 5px 7px; text-align: left; white-space: nowrap; }
.azt th { background: var(--gray-50); font-size: var(--fs-xs); color: var(--text-muted); }
.mat-table { display: flex; flex-direction: column; gap: 4px; }
.mat-row { display: grid; grid-template-columns: 80px 130px 1fr 36px; gap: 6px; align-items: center; }
.mat-row.mat-head { font-size: var(--fs-xs); color: var(--text-muted); font-weight: 700; }
.mat-row input { padding: 6px 8px; border: 1px solid var(--border); border-radius: var(--r-md); width: 100%; }
.mat-row .btn { min-height: 30px; padding: 0 8px; }

/* Arbeitszeit-Auswertung */
.aus-kpis { display: flex; flex-wrap: wrap; gap: var(--sp-3); padding: var(--sp-3) 0; }
.aus-kpi { display: flex; flex-direction: column; min-width: 92px; background: var(--gray-50); border-radius: var(--r-md); padding: 6px 10px; }
.aus-kpi b { font-size: var(--fs-lg); }
/* Auswertung: Tabelle vertikal scrollbar mit fixierter Kopfzeile */
.auswertung .azt-scroll { max-height: 62vh; overflow: auto; }
.aus-table thead th { position: sticky; top: 0; z-index: 3; background: var(--gray-50); }
.aus-table tfoot td { position: sticky; bottom: 0; background: var(--surface); z-index: 2; }
.aus-table td, .aus-table th { text-align: right; }
.aus-table td:first-child, .aus-table th:first-child, .aus-table td:nth-child(2), .aus-table th:nth-child(2), .aus-table td:last-child, .aus-table th:last-child { text-align: left; }
.aus-table tr.off td { background: #fafbfa; color: var(--text-muted); }
.aus-table tr.vac td { background: var(--blue-100); }
.aus-table .sumrow td { font-weight: 800; background: var(--gray-50); border-top: 2px solid var(--border); }
.pos { color: var(--green-700, var(--primary-dark)); }
.neg { color: var(--st-storniert); }

/* Anlagen-Stammdaten + Dienstleister-Lanes + Leihgeräte */
.stamm-grid { display: grid; grid-template-columns: repeat(2, 1fr); gap: 8px 12px; }
@media (max-width: 700px) { .stamm-grid { grid-template-columns: 1fr; } }
.dt-lanehead--prov { font-style: normal; }
.dt-bar--prov { background: #f3e5f5; border-left-color: #8e24aa; color: #6a1b9a; }
.dt-rent { font-size: 10px; background: #fff3e0; color: #e65100; border: 1px solid #ffcc80; border-radius: 4px; padding: 0 4px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }

/* Messprotokoll-Formular */
.messprot { padding-bottom: 90px; }
.mp-headgrid { display: grid; grid-template-columns: repeat(5, 1fr); gap: 12px; }
@media (max-width: 900px) { .mp-headgrid { grid-template-columns: repeat(2, 1fr); } }
.mp-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px 24px; padding: 6px 2px; }
.mp-grid-1 { grid-template-columns: 1fr; }
@media (max-width: 800px) { .mp-grid { grid-template-columns: 1fr; } }
.mp-field { display: flex; flex-direction: column; gap: 4px; }
.mp-field.mp-wide { grid-column: 1 / -1; }
.mp-field > label { font-size: var(--fs-sm); color: var(--text-muted); font-weight: 600; }
.mp-field .input, .mp-field .select, .mp-field .textarea { padding: 7px 9px; border: 1px solid var(--border); border-radius: var(--r-md); width: 100%; }
.mp-numwrap { display: flex; align-items: center; gap: 6px; }
.mp-num { max-width: 120px; }
.mp-unit { color: var(--text-muted); font-size: var(--fs-sm); }
.mp-seg { align-self: flex-start; }
.mp-seg button { min-width: 56px; padding: 8px 12px; font-weight: 700; }
.mp-seg button.active { background: var(--primary, #14532d); color: #fff; }

/* Protokoll-Formular: hochwertigere Optik */
.mp-status-banner { display: flex; align-items: center; gap: 10px; padding: 10px 14px; border-radius: var(--r-md); font-weight: 700; margin-bottom: 14px; }
.mp-status-banner.entwurf { background: #fef9c3; border: 1px solid #facc15; color: #854d0e; }
.mp-status-banner.fertig { background: #eaf7ea; border: 1px solid #86efac; color: #166534; }
.mp-progressbar { flex: 1; height: 8px; background: rgba(0,0,0,.08); border-radius: 999px; overflow: hidden; min-width: 80px; }
.mp-progressbar > i { display: block; height: 100%; background: currentColor; opacity: .55; border-radius: 999px; }
.mp-progresstxt { font-size: var(--fs-sm); font-weight: 700; white-space: nowrap; }
/* Eingabefelder als kleine Karten; ausgefüllt = grün angehaucht */
.mp-grid .mp-field { background: var(--gray-50, #fafafa); border: 1px solid var(--border); border-radius: var(--r-md); padding: 9px 11px; }
.mp-field.filled { background: #f2f9f2; border-color: #bfe3bf; }
/* Checklisten-Zeilen (ja/nein, i.O./Mangel …): Label links, Buttons rechts */
.mp-rows { display: flex; flex-direction: column; gap: 8px; grid-column: 1 / -1; }
.mp-row { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 10px 12px; border: 1px solid var(--border); border-radius: var(--r-md); background: var(--surface); flex-wrap: wrap; }
.mp-row.filled { background: #f2f9f2; border-color: #bfe3bf; }
.mp-row > label { font-size: var(--fs-md); color: var(--text); font-weight: 600; margin: 0; flex: 1 1 auto; }
.mp-row .mp-seg { align-self: center; }

/* Login mit Passwort */
.login-user.active { border-color: var(--green-600); box-shadow: 0 0 0 2px var(--green-100); }
.login-form { max-height: 0; overflow: hidden; opacity: 0; transition: max-height .2s, opacity .2s; display: flex; flex-direction: column; gap: var(--sp-2); }
.login-form.open { max-height: 420px; opacity: 1; margin-top: var(--sp-3); }
.login-pw { padding: 12px 14px; border: 1px solid var(--border); border-radius: var(--r-md); font-size: var(--fs-md); }
.login-err { color: var(--st-storniert); font-size: var(--fs-sm); min-height: 18px; }
.login-remember { display: flex; align-items: center; gap: 8px; font-size: var(--fs-sm); cursor: pointer; }
.login-remember input { width: 18px; height: 18px; }
.login-form.open .field label { font-size: var(--fs-sm); color: var(--text-muted); font-weight: 600; }

/* Benutzerverwaltung */
.users .view-head { display: flex; align-items: center; gap: var(--sp-3); }
.user-row.inactive { opacity: .55; }
.user-actions { display: flex; gap: 6px; flex-wrap: wrap; justify-content: flex-end; }
.user-actions .btn { min-height: 34px; }
.user-form { display: flex; flex-direction: column; gap: 10px; }
.uf-row { display: grid; grid-template-columns: 120px 1fr; align-items: center; gap: 12px; }
.uf-row > span { color: var(--text-muted); font-size: var(--fs-sm); }
.uf-row input[type=text], .uf-row input[type=email], .uf-row select { padding: 8px 10px; border: 1px solid var(--border); border-radius: var(--r-md); width: 100%; }
.uf-row input[type=color] { width: 48px; height: 32px; padding: 0; border: 1px solid var(--border); border-radius: 6px; }
.uf-row input[type=checkbox] { width: 20px; height: 20px; }

/* ---- Disponentenansicht eines Auftrags (#/auftrag-dispo/:id) -------------------------
   Aufgeräumte Lesesicht: zeigt nur, was vom Feld tatsächlich zurückkam. */
.auftrag-dispo { display: flex; flex-direction: column; gap: var(--sp-4); }
.dv-hero { display: flex; align-items: flex-start; gap: var(--sp-4); flex-wrap: wrap;
  background: linear-gradient(135deg, var(--green-50), var(--surface) 60%);
  border: 1px solid var(--green-100); border-radius: var(--r-lg); padding: var(--sp-5); }
.dv-hero-main { flex: 1 1 320px; min-width: 0; }
.dv-hero-top { display: flex; align-items: center; gap: var(--sp-2); flex-wrap: wrap; margin-bottom: 6px; }
.dv-hero h1 { margin: 0 0 2px; font-size: 1.45rem; line-height: 1.2; overflow-wrap: break-word; }
.dv-hero p { margin: 0; }
.dv-hero-actions { display: flex; gap: var(--sp-2); flex-wrap: wrap; align-items: center; }

.dv-banner { display: flex; align-items: center; gap: var(--sp-4); flex-wrap: wrap;
  background: var(--blue-50); border: 1px solid var(--blue-100); border-left: 5px solid var(--accent);
  border-radius: var(--r-md); padding: var(--sp-4); }
.dv-banner > div:first-child { flex: 1 1 260px; }
.dv-banner.warn { background: var(--warn-bg); border-color: #fcd34d; border-left-color: var(--warn); }

.dv-kpis { display: flex; gap: var(--sp-3); flex-wrap: wrap; }
.dv-kpi { flex: 1 1 120px; background: var(--surface); border: 1px solid var(--border); border-radius: var(--r-md);
  padding: var(--sp-3) var(--sp-4); display: flex; flex-direction: column; gap: 2px; }
.dv-kpi b { font-size: 1.25rem; color: var(--primary-dark); }

.dv-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(340px, 1fr)); gap: var(--sp-4); align-items: start; }
.dv-card { margin: 0; }
.dv-card.dv-wide { grid-column: 1 / -1; }
.dv-total { border-bottom: 0; margin-top: 4px; padding-top: 8px; border-top: 2px solid var(--green-100); }
.dv-sub { margin-top: var(--sp-3); }
.dv-sub h4 { margin: 0 0 6px; font-size: var(--fs-sm); color: var(--text-muted); }
.dv-text { white-space: pre-wrap; overflow-wrap: break-word; hyphens: auto; background: var(--surface-2);
  border: 1px solid var(--border); border-radius: var(--r-md); padding: var(--sp-3); }

.dv-notes { display: flex; flex-direction: column; gap: var(--sp-3); }
.dv-note { border-left: 3px solid var(--green-100); background: var(--surface-2); border-radius: var(--r-md); padding: var(--sp-3); }
.dv-note-head { display: flex; align-items: baseline; gap: var(--sp-2); margin-bottom: 4px; }
.dv-note-body { white-space: pre-wrap; overflow-wrap: break-word; }

.dv-sigs { display: grid; grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)); gap: var(--sp-4); }
.dv-sig { display: flex; flex-direction: column; align-items: center; gap: 4px; }
.dv-sig img { width: 100%; max-height: 120px; object-fit: contain; background: #fff;
  border: 1px solid var(--border); border-radius: var(--r-md); }

.dv-hist { display: flex; flex-direction: column; gap: 4px; max-height: 260px; overflow: auto; }
.dv-hist-row { display: flex; gap: var(--sp-3); flex-wrap: wrap; align-items: baseline;
  padding: 4px 0; border-bottom: 1px dashed var(--gray-100); }

.dv-empty { text-align: center; padding: var(--sp-6) var(--sp-4); background: var(--surface);
  border: 1px dashed var(--border); border-radius: var(--r-lg); margin-top: var(--sp-4); }
.dv-empty .big { font-size: 40px; margin-bottom: var(--sp-2); }
.dv-empty p { margin: 4px 0 0; }

/* ---- Tages-Korrektur: Uhrzeit- statt Minuten-Eingabe (Auswertung) ---- */
.tag-korr { display: flex; flex-direction: column; gap: var(--sp-3); }
.tk-tabs { display: flex; gap: 6px; background: var(--surface-2); border: 1px solid var(--border);
  border-radius: var(--r-pill); padding: 4px; align-self: flex-start; }
.tk-tab { border: 0; background: transparent; padding: 6px 14px; border-radius: var(--r-pill);
  font: inherit; font-weight: 600; color: var(--text-muted); cursor: pointer; }
.tk-tab.active { background: var(--surface); color: var(--primary-dark); box-shadow: 0 1px 3px rgba(0,0,0,.12); }
.tk-box { display: flex; flex-direction: column; gap: 6px; }
.tk-row { display: grid; grid-template-columns: 1fr auto auto auto 62px; align-items: center; gap: 8px;
  padding: 6px 8px; border: 1px solid var(--border); border-radius: var(--r-md); background: var(--surface); }
.tk-lbl { font-weight: 600; min-width: 0; overflow-wrap: anywhere; }
.tk-time { width: 108px; padding: 6px 8px; }
.tk-bis { color: var(--text-muted); font-size: var(--fs-sm); }
.tk-dur { text-align: right; font-variant-numeric: tabular-nums; color: var(--primary-dark); }
.tk-tot { display: flex; flex-wrap: wrap; gap: var(--sp-2); }
.tk-chip { display: flex; flex-direction: column; align-items: center; min-width: 68px;
  background: var(--green-50); border: 1px solid var(--green-100); border-radius: var(--r-md); padding: 6px 10px; }
@media (max-width: 560px) {
  .tk-row { grid-template-columns: 1fr auto; grid-auto-rows: auto; }
  .tk-lbl { grid-column: 1 / -1; }
  .tk-dur { grid-column: 1 / -1; text-align: left; }
}
.dv-run { color: var(--st-in_arbeit); font-weight: 700; font-size: var(--fs-sm); white-space: nowrap; }
.dv-laeuft td { background: #fffaf0; }

/* ---- Protokoll-Auswahl: Kacheln statt Zeilenliste ---- */
.prot-pick { display: grid; grid-template-columns: repeat(auto-fit, minmax(148px, 1fr)); gap: var(--sp-3); }
.prot-tile { display: flex; flex-direction: column; align-items: center; justify-content: flex-start; gap: var(--sp-2);
  min-height: 124px; padding: var(--sp-4) var(--sp-3); text-align: center; cursor: pointer;
  background: var(--surface); border: 1px solid var(--border); border-radius: var(--r-md);
  font: inherit; color: var(--text); transition: transform .12s ease, box-shadow .12s ease, border-color .12s ease; }
.prot-tile:hover, .prot-tile:focus-visible { border-color: var(--primary); background: var(--green-50);
  transform: translateY(-2px); box-shadow: 0 4px 14px rgba(0,0,0,.10); outline: none; }
.prot-tile:active { transform: translateY(0); }
.prot-tile-ic { font-size: 34px; line-height: 1.1; }
.prot-tile-t { font-weight: 700; font-size: var(--fs-sm); line-height: 1.25; overflow-wrap: break-word; hyphens: auto; }
@media (max-width: 480px) { .prot-pick { grid-template-columns: repeat(auto-fit, minmax(124px, 1fr)); } }