/* 15-formulare-transporte-teams.css · Teil 15 von 19 · Dialoge, Formularfelder, Transport-Formular/-Liste, Kontakte, Teams-Kalender. Reihenfolge der Dateien = Kaskade (index.html), nicht umsortieren. */
/* Dialogfenster */
.modal-overlay { position:fixed; inset:0; background:rgba(26,27,75,.42); z-index:1000;
  display:flex; align-items:flex-start; justify-content:center; padding:40px 16px; overflow-y:auto; }
.modal { background:#fff; border-radius:16px; width:100%; max-width:560px;
  box-shadow:0 20px 60px rgba(26,27,75,.3); padding:24px 26px; }
.modal.modal-breit { max-width:940px; }
.modal h3 { margin:0 0 4px; font-size:19px; color:var(--navy); font-weight:800; }
.modal .m-sub { font-size:12px; color:var(--muted); margin-bottom:18px; }
.frm-row { margin-bottom:13px; }
.frm-row label { display:block; font-size:11px; font-weight:700; text-transform:uppercase;
  letter-spacing:.03em; color:var(--muted); margin-bottom:4px; }
.frm-row label .pflicht { color:var(--pink); }
.frm-row input, .frm-row textarea { width:100%; padding:9px 11px; border:1px solid var(--border);
  border-radius:8px; font-size:14px; font-family:inherit; background:#fff; }
.frm-row input:focus, .frm-row textarea:focus { outline:none; border-color:var(--cyan); }
.frm-row textarea { resize:vertical; min-height:56px; }
.frm-2 { display:grid; grid-template-columns:1fr 1fr; gap:0 14px; }
/* Zwei Felder, von denen eines ueber dem Eingabeelement noch etwas traegt
   (die PoA-Chips): ohne Zutun stuende das Gegenstueck rechts weiter oben.
   Die Felder werden darum zu Flex-Spalten, das **letzte** Element sinkt per
   `margin-top:auto` nach unten — Beschriftungen fluchten oben, Eingabe-
   felder unten, egal wie viele Chips links stehen. */
.frm-unten > .frm-row { display:flex; flex-direction:column; }
.frm-unten > .frm-row > :last-child { margin-top:auto; }
.frm-3 { display:grid; grid-template-columns:1fr 1fr 1fr; gap:0 14px; }
.frm-4 { display:grid; grid-template-columns:1fr 1fr 1fr 1fr; gap:0 14px; }
@media (max-width:780px){ .frm-3, .frm-4 { grid-template-columns:1fr 1fr; } }
@media (max-width:520px){ .frm-2, .frm-3, .frm-4 { grid-template-columns:1fr; } }

/* Transport-Formular: abgesetzte Abschnitte */
.tf-form .tf-sec { border:1px solid var(--border); border-radius:10px; background:#FCFCFE;
  padding:12px 14px 0; margin-bottom:12px; }
.tf-form .tf-sec-t { display:flex; align-items:baseline; gap:8px; font-size:11.5px; font-weight:800;
  color:var(--navy); text-transform:uppercase; letter-spacing:.05em; margin-bottom:10px; }
.tf-sec-z { font-weight:400; text-transform:none; letter-spacing:0; color:var(--muted); font-size:11.5px; }
.frm-hint { font-weight:400; text-transform:none; letter-spacing:0; color:var(--muted); font-size:10.5px; }
.frm-static { font-size:13px; padding:2px 0; }
/* URL-Feld mit Oeffnen-Knopf */
.frm-link { display:flex; gap:6px; align-items:stretch; }
.frm-link input { flex:1; min-width:0; }
.frm-link-o { flex:none; display:inline-flex; align-items:center; justify-content:center; width:34px;
  border:1px solid var(--border); border-radius:8px; background:#fff; color:var(--pink);
  text-decoration:none; font-size:14px; }
.frm-link-o:hover { border-color:var(--pink); }
.frm-hb { flex:none; width:34px; border:1px solid var(--border); border-radius:8px;
  background:#fff; cursor:pointer; font-size:14px; line-height:1; font-family:inherit; }
.frm-hb:hover { border-color:var(--pink); }
/* Mehrfachauswahl als Chips */
/* Transport-Dokumente: hochgeladene Anhaenge (frueher blosse Drive-Links) */
.tf-dok-list { display:flex; flex-direction:column; gap:4px; margin-bottom:6px; }
.tf-dok, .tf-dok-neu { display:flex; align-items:center; gap:8px; background:#fff;
  border:1px solid var(--border); border-radius:8px; padding:5px 8px; font-size:13px; }
.tf-dok-neu { background:#FFF9FA; border-color:var(--pink); }
.tf-dok-i { font-size:13px; }
.tf-dok-n { flex:1; min-width:0; overflow:hidden; text-overflow:ellipsis; white-space:nowrap;
  color:var(--navy); font-weight:600; }
.tf-dok-neu input[type="text"], .tf-dok input[type="text"] { flex:1; min-width:0; font-family:inherit;
  font-size:13px; padding:5px 8px; border:1px solid var(--border); border-radius:6px; }
.tf-dok-g { color:var(--muted); font-size:11.5px; font-variant-numeric:tabular-nums; white-space:nowrap; }
.tf-dok-b { border:0; background:none; cursor:pointer; font-size:13px; line-height:1; padding:4px 6px;
  border-radius:6px; font-family:inherit; color:var(--navy2); text-decoration:none; }
.tf-dok-b:hover { background:#EEF0FB; }
.tf-dok-x:hover { background:#FDECEE; color:#B3261E; }
.tf-dok-up { padding:5px 12px; font-size:12.5px; border-radius:7px; }
.tf-dok-add { padding:6px 12px; font-size:12.5px; border-radius:8px; margin-top:2px; }
.tf-dok-leer, .tf-dok-hint { font-size:12.5px; color:var(--muted); font-style:italic; margin-bottom:6px; }
.tf-dok-hint { font-style:normal; }
.tf-dok-msg { font-size:12px; color:var(--muted); margin-top:4px; min-height:15px; }
.tf-dok-msg.fehler { color:#B3261E; }
/* Altbestand (die drei fruehren Linkfelder) bewusst zurueckhaltend */
.tf-dok-alt { margin-top:10px; padding-top:8px; border-top:1px dashed var(--border); opacity:.85; }
.tf-chips { display:flex; flex-wrap:wrap; align-items:center; gap:6px; margin-bottom:6px;
  min-height:27px; }
.tf-chips.leer { font-size:12px; color:var(--muted); font-style:italic; }
.tf-chip { display:inline-flex; align-items:center; gap:6px; background:#EEF0FB; color:var(--navy2);
  border-radius:20px; padding:3px 6px 3px 11px; font-size:12.5px; }
.tf-chip button { border:0; background:none; color:var(--muted); cursor:pointer; font-size:11px;
  line-height:1; padding:2px 4px; border-radius:50%; font-family:inherit; }
.tf-chip button:hover { color:var(--pink); background:#fff; }

/* Transportuebersicht: Werkzeugleiste + vergangene Zeilen */
.tr-tools { display:flex; gap:10px; align-items:flex-start; margin-bottom:12px; }
.tr-tools .filter { flex:1; margin-bottom:0; }
.tr-tools .btn { flex:none; white-space:nowrap; padding:9px 14px; }
/* Partner-Sheets: Stand des Abgleichs, Hinweis „vom Partner angepasst" */
.tr-partner { font-size:12px; color:var(--muted); margin:-4px 0 10px; }
.tr-partner:empty { display:none; }
.tr-p-err { color:#B3261E; }
.trd-partner, .tf-partner { font-size:12px; color:#8A5300; background:#FFF6E8; border-left:3px solid #E8A33D;
  padding:5px 9px; border-radius:0 6px 6px 0; margin:0 0 8px; }
.tf-fahrer-p { font-size:12px; color:#8A5300; margin:-2px 0 4px; }
/* Kontakte: Kategorie intern/extern + Teams */
.kt-tools { align-items:center; flex-wrap:wrap; }
.kt-tools .filter { min-width:200px; }
.kt-kat.intern { background:#EEEDFE; color:#3C3489; }
.kt-dot { display:inline-block; width:9px; height:9px; border-radius:50%; margin-right:6px; vertical-align:middle; flex:none; }
.kt-leer { color:#9794A0; font-size:12px; }
.kt-hint { font-size:11px; color:var(--muted); margin-top:3px; }
/* Teams eines Kontakts: Mehrfachauswahl im Formular, mehrere Teams in der Liste */
.kt-tws { display:flex; flex-wrap:wrap; gap:6px; }
.kt-tw { display:inline-flex; align-items:center; gap:2px; padding:5px 10px; border:1px solid var(--border); border-radius:8px;
  font-size:13px; text-transform:none; letter-spacing:0; font-weight:500; color:#1C1B22; cursor:pointer; background:#fff; }
.frm-row label.kt-tw { display:inline-flex; margin:0; font-size:13px; font-weight:500; color:#1C1B22; text-transform:none; letter-spacing:0; }
.frm-row .kt-tw input { width:auto; padding:0; margin:0 6px 0 0; border:0; }
.kt-tw:has(input:checked) { border-color:var(--cyan); background:#EEF0FB; }
.kt-tz { white-space:nowrap; margin-right:4px; }
.kt-alt { display:flex; align-items:center; justify-content:space-between; gap:12px; background:#FBF3E4; color:#7A4F05;
  border-radius:8px; padding:8px 12px; font-size:13px; margin-bottom:12px; }
.kt-alt .btn { flex:none; }
.kt-liste { margin:8px 0; padding-left:18px; }
.kt-tms { display:flex; flex-direction:column; gap:8px; margin:14px 0 10px; }
.kt-tm { display:flex; flex-wrap:wrap; align-items:center; gap:8px; }
.kt-tm input { flex:1; min-width:140px; padding:7px 10px; border:1px solid var(--border); border-radius:8px; font:inherit; font-size:13px; }
.kt-tm select { padding:7px 8px; border:1px solid var(--border); border-radius:8px; font:inherit; font-size:13px; background:#fff; }
.kt-tm .kt-dot { width:12px; height:12px; margin:0; }
.kt-tm-n { font-size:12px; color:var(--muted); white-space:nowrap; min-width:74px; }
.kt-tm.neu { border-top:1px solid var(--border); padding-top:12px; margin-bottom:6px; }
.kt-tm .btn { padding:7px 12px; }
.kt-tm .btn.kt-weg { color:#B4232A; }
/* Teams: Monatskalender (view-teams.js). Je Woche ein Raster: Spalte 1 das
   Team (Zeile „Projekte" + eine Zeile je Person, klebt beim waagrechten
   Scrollen), dann Mo–So. Die Tageszellen spannen alle Zeilen (grid-row 1 / -1,
   geht nur mit expliziten grid-template-rows), die Termine liegen als Balken
   in den Zeilen der Person. */
.psub .psub-dot { width:9px; height:9px; margin:0 1px; }
.tk-tools { display:flex; flex-wrap:wrap; align-items:center; gap:10px 16px; margin-bottom:10px; }
.tk-nav { display:flex; align-items:center; gap:6px; }
.tk-nav h2 { margin:0 6px; font-size:17px; font-weight:600; min-width:150px; text-align:center; }
.tk-nav .btn.sec { padding:5px 11px; font-size:13px; }
.tk-typen { display:flex; flex-wrap:wrap; gap:6px; margin-left:auto; }
.tk-typ { display:inline-flex; align-items:center; gap:6px; border:1px solid var(--border); background:#fff; border-radius:99px;
  padding:4px 11px; font:inherit; font-size:12.5px; color:#45434F; cursor:pointer; }
.tk-typ i { display:inline-block; width:10px; height:10px; border-radius:3px; }
.tk-typ.crew i { background:#5468D9; }
.tk-typ.transport i { background:#8E93C9; }
.tk-typ.opening i { background:#E6304E; transform:rotate(45deg) scale(.8); border-radius:1px; }
.tk-typ.ferien i { background:#8B93A5; }
.tk-typ b { font-weight:600; }
.tk-typ:not(.aktiv) { opacity:.5; }
.tk-typ:not(.aktiv) i { background:#C4C1B8; }
.tk-mg { display:flex; flex-wrap:wrap; gap:4px 18px; font-size:13px; color:#45434F; margin:0 0 12px; }
.tk-mg .kt-dot { margin-right:5px; }
.tk-mg b { font-weight:600; margin-right:3px; }
.tk-mg-t { font-size:11px; font-weight:600; color:var(--muted); text-transform:uppercase; letter-spacing:.05em; margin-right:-6px; }
.tk-arb { margin-top:-4px; }
.tk-arb-f { display:inline-block; width:16px; height:11px; border-radius:2px; border-left:3px solid var(--tk-f); margin-right:6px; vertical-align:-1px; }
/* Teams: Kopf (Monat, Typen, Legende) steht fest, nur #tkList scrollt — in
   BEIDE Richtungen. Darum darf dazwischen kein weiterer Scrollbereich liegen:
   .tk-scroll ist hier nicht scrollbar, und .tk-kal schneidet mit overflow:clip
   statt hidden (hidden ist fuer position:sticky ein eigener Scrollbereich —
   Wochentagszeile und Team-Spalte bleiben sonst nicht stehen). */
.tk-scroll { overflow-x:auto; }
.tk-list .tk-scroll { overflow:visible; }
.tk-kal { --tk-sp:150px; min-width:820px; border:1px solid var(--border); border-radius:10px; overflow:clip; background:#fff; }
.tk-list .tk-wt { position:sticky; top:0; z-index:5; }
.tk-wt { display:grid; grid-template-columns:var(--tk-sp) repeat(7,minmax(0,1fr)); background:var(--th-bg); border-bottom:1px solid var(--border); }
.tk-wt div { padding:6px 8px; font-size:11px; font-weight:600; color:var(--muted); text-transform:uppercase; letter-spacing:.05em; }
.tk-wt div:first-child { position:sticky; left:0; z-index:2; background:var(--th-bg); border-right:1px solid var(--border); padding-left:12px; }
.tk-woche { display:grid; grid-template-columns:var(--tk-sp) repeat(7,minmax(0,1fr)); border-bottom:2px solid var(--border); }
.tk-woche:last-child { border-bottom:0; }
.tk-kw { grid-column:1; grid-row:1; position:sticky; left:0; z-index:2; background:#fff; border-right:1px solid var(--border);
  padding:6px 12px; font-size:11px; font-weight:600; color:var(--muted); letter-spacing:.03em; }
.tk-tag { grid-row:1 / -1; border-right:1px solid #F0EEE8; }
.tk-tag.so { border-right:0; }
.tk-zeile { grid-column:1 / -1; border-top:1px solid #EFEDE8; pointer-events:none; }
.tk-name { grid-column:1; position:sticky; left:0; z-index:2; background:#fff; border-right:1px solid var(--border);
  border-top:1px solid #EFEDE8; box-shadow:inset 3px 0 0 var(--tk-f, transparent); padding:3px 10px 0 12px;
  font-size:12.5px; font-weight:600; color:#1C1B22; line-height:17px; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.tk-name.proj { background:#FAF9F6; color:var(--muted); font-size:11px; font-weight:600; text-transform:uppercase; letter-spacing:.05em; }
/* Person in mehreren Teams: je Team ein kleiner Farbpunkt hinter dem Namen */
.tk-mehr { display:inline-flex; gap:2px; margin-left:5px; vertical-align:1px; }
.tk-mehr i { width:6px; height:6px; border-radius:50%; }
.tk-tag.we { background:#FBFAF7; }
.tk-nr { display:inline-block; margin:4px 6px; min-width:20px; height:20px; line-height:20px; border-radius:10px; padding:0 4px;
  text-align:center; font-size:12px; font-weight:600; color:#45434F; }
.tk-tag.aus .tk-nr { color:#C4C1B8; font-weight:500; }
.tk-tag.heute .tk-nr { background:var(--pink); color:#fff; }
.tk-ev { position:relative; z-index:1; align-self:center; margin:0 3px; height:21px; line-height:21px; padding:0 7px; border-radius:5px; font-size:11.5px;
  color:#1C1B22; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; cursor:pointer; }
.tk-ev b { font-weight:600; margin-right:5px; }
.tk-ev:hover { filter:brightness(.95); }
.tk-ev.crew { border-left:3px solid var(--tk-f); }
.tk-ev.crew.wl { border-left-width:0; }
/* Funktionen (view-funktionen.js): Termin je Projekt und Phase, im Balken die Eingeteilten */
.tk-ev.funktion { border-left:3px solid var(--tk-f); }
.tk-ev.funktion.wl { border-left-width:0; }
.tk-ev .tk-niemand { font-style:normal; color:var(--muted); }
.psub .fk-dot { display:inline-block; border-radius:2px; flex:none; }
.tk-ev.transport { background:#ECEDF6; color:#2E3178; }
.tk-ev.transport .psub-i { width:12px; height:12px; vertical-align:-2px; margin-right:4px; }
.tk-ev.opening { background:#FBE9EE; color:#B01E44; }
/* Ferien (MOCO): schraffiert und ohne Klick — Abwesenheit, keine Arbeit */
.tk-ev.ferien { background:repeating-linear-gradient(135deg,#EEF0F4 0 6px,#E2E5EC 6px 12px); color:#4A5568; cursor:default; }
.tk-ev.ferien:hover { filter:none; }
.tk-ev.ferien .tk-halb { font-weight:400; font-size:10.5px; opacity:.8; }
.tk-raute { display:inline-block; width:7px; height:7px; margin-right:6px; background:currentColor; transform:rotate(45deg); vertical-align:1px; }
.tk-ev.wl { margin-left:0; border-top-left-radius:0; border-bottom-left-radius:0; }
.tk-ev.wr { margin-right:0; border-top-right-radius:0; border-bottom-right-radius:0; }
.tk-ev.storno { opacity:.5; text-decoration:line-through; }
.tk-ev .tk-uhr { font-variant-numeric:tabular-nums; }
.tk-ri { display:inline-block; margin-right:5px; padding:0 4px; border-radius:3px; line-height:15px; font-size:9.5px; font-weight:700;
  text-transform:uppercase; letter-spacing:.04em; vertical-align:1px; }
.tk-ri.raus { background:#fff; color:#2E3178; box-shadow:inset 0 0 0 1px #C9CCE8; }
.tk-ri.rein { background:#2E3178; color:#fff; }
.wb-table tr.tr-alt > td { background:#FAFAFC; color:#6B7280; }
.wb-table tr.tr-alt > td b { color:#6B7280; }
/* Transportuebersicht: zwei Spalten nach Richtung (aus-/eingehend) */
.tr-2sp { display:grid; grid-template-columns:1fr 1fr; gap:14px; align-items:start; }
@media (max-width:1150px) { .tr-2sp { grid-template-columns:1fr; } }
.tr-sp { border:1px solid var(--border); border-radius:10px; background:#fff;
  overflow:hidden; margin-bottom:14px; }
.tr-sp-t { display:flex; align-items:center; gap:8px; padding:8px 12px; font-size:12.5px;
  font-weight:800; color:var(--navy); background:#F3F4F8; border-bottom:1px solid var(--border); }
.tr-sp-n { background:var(--navy); color:#fff; border-radius:99px; font-size:11px;
  font-weight:700; padding:1px 8px; }
.tr-sp-h { margin-left:auto; font-weight:400; font-size:11px; color:var(--muted);
  overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.tr-sp.tr-aus .tr-sp-t { background:#EEF0FB; }
.tr-sp.tr-ein .tr-sp-t { background:#E7F6EF; }
.tr-sp.tr-ueb .tr-sp-t { background:#FFF3E0; }
.tr-sp .wb-table { font-size:12.5px; }
.tr-sp .wb-table thead th { padding:6px 10px; font-size:10.5px; }
.tr-sp .wb-table tbody td { padding:6px 10px; }
.tr-leer { padding:14px 12px; font-size:12.5px; color:var(--muted); }
.tr-firma { font-size:11px; color:var(--muted); }
.tr-nach { font-size:11.5px; color:var(--muted); }
.tr-zl { display:inline-block; width:18px; color:#9AA0AE; }
.tr-mehr { padding:2px 8px; }
.m-foot { display:flex; justify-content:space-between; align-items:center; gap:10px; margin-top:20px; }
.m-msg { font-size:13px; }
.m-msg.err { color:#B4232A; }
.m-msg.ok { color:var(--ok); }

/* Pensen aus MOCO im Teams-Kalender: Pensum beim Namen, freie Werktage grau hinter den Balken, halbe schraffiert */
.tk-pensum { margin-left:6px; padding:0 5px; border-radius:6px; background:#ECEAE4; color:var(--muted); font-size:10.5px; font-weight:600; white-space:nowrap; }
.tk-frei { background:#E9E7E1; z-index:0; pointer-events:none; }
.tk-frei.halb { background:repeating-linear-gradient(135deg, #EFEDE8 0 5px, transparent 5px 10px); }
