/* ── ProVI-Header (1:1 wie Desktop ProviHeader.xaml — bleibt bewusst hell) ── */
:root { --toolbar: #1E1E1E;
  --b-gruen-bg:#1A3A1A; --b-gruen:#7AAE7A; --b-blau-bg:#1A2A3A; --b-blau:#89B4FA; }
@media (prefers-color-scheme: light) {
  :root:not([data-theme="dunkel"]) { --toolbar: #FAFAFA;
    --b-gruen-bg:#E3F4E5; --b-gruen:#4A8E5A; --b-blau-bg:#E3EFFB; --b-blau:#1F6FB5; }
}
:root[data-theme="hell"] { --toolbar: #FAFAFA;
  --b-gruen-bg:#E3F4E5; --b-gruen:#4A8E5A; --b-blau-bg:#E3EFFB; --b-blau:#1F6FB5; }
/* Icon-Font: dieselbe tabler-icons.ttf wie der Desktop (AppIcon-Style) —
   die &#xE…;-Codepoints sind Tabler-Codepoints, NICHT Segoe MDL2. */
@font-face {
  font-family: "tabler-icons";
  src: url("../fonts/tabler-icons.ttf") format("truetype");
  font-display: block;
}
/* Icon-Glyphen. Sie skalieren ueber body{zoom} mit der Schriftgroesse mit, waren
   aber absolut zu klein angesetzt (urspruenglich 15px bei 14px Basistext).
   Zweimal angehoben: 15→18→22px (Nutzerwunsch nochmals x1.25). Der Schriftgroessen-
   Zoom wirkt weiterhin zusaetzlich obendrauf (bei „Gross" also ~29px). */
.mdl2 { font-family: "tabler-icons", "Segoe MDL2 Assets", "Segoe Fluent Icons";
  font-size: 22px; line-height: 1; }
.mdl2.gross { font-size: 26px; }
.cm-ico.mdl2 { font-size: 19px; }

.pv-header { position: relative; height: 140px; background: var(--bg-tief);
  font-family: "Segoe UI", system-ui, sans-serif; flex: none; }
/* Shapes leben in einer eigenen geclippten Ebene — der Header selbst darf NICHT
   overflow:hidden sein, sonst werden die Dropdown-Menüs (Import/Export/…) abgeschnitten. */
.pv-shapes { position: absolute; inset: 0; overflow: hidden; pointer-events: none; }
.pv-shapes::before { content: ""; position: absolute; left: 0; right: 0; top: 0;
  height: 85px; background: #E7E9EC; }
/* Shapes wie WPF-SvgViewbox: Uniform skaliert, links oben im Viewport */
.pv-shape { position: absolute; pointer-events: none;
  object-fit: contain; object-position: left top; }
.pv-sh-ha1  { left: -80px; top: 20px; width: 2000px; height: 100px; z-index: 0; }
.pv-sh-ha2  { left: -80px; top: 0;    width: 2000px; height: 100px; z-index: 0; }
.pv-sh-flag { left: 230px; top: 40px; width: 130px;  height: 40px;  z-index: 1; }
.pv-sh-dark { left: -80px; top: 15px; width: 690px;  height: 120px; z-index: 2; }
.pv-sh-grey { left: -70px; top: -5px; width: 700px;  height: 150px; z-index: 3; }
.pv-sh-right{ left: 265px; right: 290px; top: -20px; height: 36px;  z-index: 10;
  width: calc(100% - 555px); object-fit: fill; }
.pv-logo { position: absolute; left: 40px; top: 30px; height: 40px; z-index: 20; }
/* Projektname MITTIG wie Desktop-ProviHeader (HorizontalAlignment=Center,
   Margin 200 links wegen Logo; Titel y=28, Abschnitt y=60) */
.pv-projektname { position: absolute; left: 200px; right: 0; top: 26px; text-align: center;
  font-size: 24px; font-weight: 300; font-style: italic; color: #595959; z-index: 20;
  white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.pv-abschnitt { position: absolute; left: 200px; right: 0; top: 60px; text-align: center;
  font-size: 12px; color: #595959; z-index: 20; display: flex; justify-content: center;
  align-items: center; gap: 8px; }
.pv-titelleiste { position: absolute; left: 230px; right: 0; bottom: 6px; display: flex; gap: 2px;
  align-items: center; z-index: 30; }
/* z-index über der Titelleiste (30): sonst legt sich das später im DOM stehende
   Pillen-Band über das aufgeklappte IFC-Menü (pv-liste). */
.pv-rechts { position: absolute; top: 8px; right: 12px; display: flex; gap: 2px;
  align-items: center; z-index: 40; }

/* Trefferflaeche ~1.5x der Glyphengroesse (26px Icon → 40px Knopf). Der sichtbare
   Abstand zwischen den Icons entsteht fast nur hier, nicht ueber gap (das ist 2px). */
.pv-icon { position: relative; width: 40px; height: 40px; display: inline-flex;
  align-items: center; justify-content: center; background: transparent; border: 0;
  border-radius: 6px; color: var(--text); cursor: pointer; text-decoration: none; }
.pv-header .pv-icon:hover:not(:disabled) { background: var(--hover); }
.pv-icon:disabled, .pv-icon.deaktiv { opacity: .38; cursor: default; }
.pv-icon.klein { width: 34px; height: 34px; color: var(--text); }
.pv-icon-img { width: 25px; height: 25px; }
.pv-dirty { position: absolute; top: 4px; right: 4px; width: 7px; height: 7px;
  border-radius: 4px; background: #F10033; }
/* Trenner an die groesseren Icons angepasst (war 20px neben 26px-Glyphen). */
.pv-sep { width: 1px; height: 26px; background: var(--rand); margin: 0 4px; }
.pv-sep.hell { background: #00000022; }

.pv-toggle-lbl { font-size: 11px; font-weight: 400; color: #595959; }
.pv-toggle-lbl.aktiv-lbl { font-weight: 700; color: #2E2E2E; }
.pv-toggle { width: 44px; height: 22px; border-radius: 11px; background: #8A8A8E;
  display: inline-flex; align-items: center; margin: 0 6px; }
.pv-toggle-thumb { width: 18px; height: 18px; border-radius: 9px; background: #fff;
  margin-left: 2px; }
.pv-abmelden-form { display: inline; }

/* Kompakter Markenkopf der Verwaltungsseiten (ohne Titelleiste/Buttons) */
/* Verwaltungsseiten-Kopf: volle Hoehe wie die Projektseite — die Schraeg-Shapes
   sind fuer 140px gezeichnet; bei 100px kappte die Clipping-Ebene sie unten ab
   (sichtbar als fehlendes Stueck am unteren Header-Rand). */
.pv-header.klein { height: 140px; }
.login-buehne.mit-kopf { min-height: calc(100vh - 230px); }
.pvk-benutzer { font-size: 11px; color: #595959; text-decoration: none; margin-right: 8px; }
.pvk-benutzer:hover { color: #2E2E2E; text-decoration: underline; }
.pvk-abmelden { background: transparent; border: 1px solid #00000033; border-radius: 6px;
  color: #2E2E2E; font-size: 11px; padding: 4px 10px; cursor: pointer; }
.pvk-abmelden:hover { background: #00000010; }

/* Konto/Abmelden dezent in der Statusleiste (ProVI-Band bleibt wie am Desktop) */
.st-konto-sep { color: var(--text-3); }
.st-konto { color: var(--text-2); text-decoration: none; }
.st-konto:hover { color: var(--text); text-decoration: underline; }
/* Tour-Knopf: farbig umrandete Pille (Petrol wie die Tour-Sprechblase),
   damit er in der Statusleiste ins Auge springt. */
.st-tour { background: transparent; cursor: pointer; font-size: inherit;
  color: var(--kkk-fg); border: 1px solid var(--kkk-fg); border-radius: 9px;
  padding: 1px 10px; line-height: 1.4; }
.st-tour:hover { background: var(--kkk-bg); }
.st-abmelden { background: transparent; border: 0; padding: 0; cursor: pointer;
  color: var(--text-3); font-size: inherit; font-family: inherit; }
.st-abmelden:hover { color: var(--gefahr); text-decoration: underline; }

/* Dropdown-Menüs im Desktop-Stil (Badges links) */
.pv-menue { position: relative; }
.pv-menue summary { list-style: none; }
.pv-menue summary::-webkit-details-marker { display: none; }
.pv-liste { position: absolute; top: 38px; left: 0; background: var(--bg);
  border: 1px solid var(--rand); border-radius: 8px; padding: 6px; min-width: 240px;
  z-index: 200; box-shadow: 0 10px 28px #00000055; }
.pv-liste.rechts { left: auto; right: 0; }
.pv-liste-titel { font-size: 10.5px; color: var(--text-3); padding: 4px 10px 3px;
  text-transform: uppercase; letter-spacing: .04em; }
/* Mehrere Gruppen in einer Liste (z. B. Export): Folge-Überschriften mit feiner
   Trennlinie + Abstand absetzen, damit die Gruppen klar erkennbar sind. */
.pv-liste-titel:not(:first-child) { margin-top: 3px; padding-top: 7px;
  border-top: 1px solid var(--rand-fein); }
.pv-eintrag { display: flex; align-items: center; gap: 9px; width: 100%; padding: 6px 10px;
  background: transparent; border: 0; color: var(--text); font-size: 12.5px;
  border-radius: 5px; cursor: pointer; text-align: left; }
.pv-eintrag:hover:not(:disabled) { background: var(--hover); }
.pv-eintrag:disabled, .pv-eintrag.deaktiv { opacity: .45; cursor: default; }
.pv-eintrag input[type=file] { display: none; }
.pv-eintrag .bald { margin-left: auto; font-size: 10.5px; color: var(--text-3); }
.mini-badge { flex: none; width: 44px; text-align: center; font-size: 10px;
  font-weight: 600; border-radius: 4px; padding: 2px 0; }
.mini-badge.gruen { background: var(--b-gruen-bg); color: var(--b-gruen); }
.mini-badge.blau  { background: var(--b-blau-bg);  color: var(--b-blau); }
.mini-badge.grau  { background: var(--badge-grau-bg); color: var(--badge-grau-fg); }
.mini-badge.akvs  { background: var(--akvs-bg); color: var(--akvs-fg); }
.mini-badge.oeko  { background: var(--oeko-bg); color: var(--oeko-fg); }

/* Toolbar-Zeile 2 (wie Desktop BrToolbar) */
.pv-toolbar { display: flex; align-items: center; gap: 2px; padding: 4px 12px;
  background: var(--toolbar); border-bottom: 1px solid var(--rand-fein); flex: none; }
.pv-toolbar .lv-suche { max-width: 220px; }

/* Inhalt ohne Layout-Padding (LeerLayout) */
.lv-flaeche { padding: 8px 16px 0; }
.seite-projekt .lv-banner, .seite-projekt .kt-streifen,
.seite-projekt > .hinweis-text, .seite-projekt > p.hinweis-text { margin: 6px 16px 0; }
.lv-statusbar { margin-top: 6px; }

/* P2/P3-Feinschliff aus dem Optik-Prüfbericht */
:root { --menu-bg: #252528; --menu-hover: #38383D; }
@media (prefers-color-scheme: light) { :root:not([data-theme="dunkel"]) { --menu-bg: #F0F0F2; --menu-hover: #DDDDE4; } }
:root[data-theme="hell"] { --menu-bg: #F0F0F2; --menu-hover: #DDDDE4; }
.cm-menu, .pv-liste { background: var(--menu-bg); }
.cm-deaktiv { opacity: .45; pointer-events: none; }
.cm-item.cm-modus.modus-akvs { background: var(--akvs-bg); border-left: 3px solid var(--akvs-fg); }
/* Ökobaudat-Editor (/daten/oekobaudat) */
.obd-kopf { display: flex; align-items: center; gap: 12px; margin: 10px 0; }
.obd-suche { max-width: 340px; }
.obd-tab { border: 1px solid var(--rand-fein); border-radius: 6px; max-height: 60vh; overflow: auto; }
.obd-zeile { display: grid; grid-template-columns: minmax(220px,1.4fr) minmax(160px,1fr) 90px 90px 100px 40px;
  gap: 10px; align-items: center; padding: 5px 10px; font-size: 12.5px;
  border-bottom: 1px solid var(--rand-fein); cursor: pointer; }
.obd-zeile:hover { background: color-mix(in srgb, var(--text) 5%, transparent); }
.obd-zeile.obd-eigen { background: var(--oeko-bg); }
.obd-kopfzeile { font-size: 10.5px; font-weight: 600; letter-spacing: .4px; color: var(--text-2);
  cursor: default; position: sticky; top: 0; background: var(--flaeche, var(--bg)); }
.obd-zeile .fort-name, .obd-kat { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.obd-form { display: flex; flex-direction: column; gap: 6px; }
.obd-form-reihe { display: grid; grid-template-columns: repeat(4, 1fr); gap: 10px; }

.st-kt-ok { color: var(--b-gruen); }
.st-kt-warn { color: var(--akzent); font-weight: 600; }
.cm-modus-titel.modus-blau { color: var(--b-blau); border-left: 3px solid var(--b-blau); background: var(--b-blau-bg); }
.cm-item.cm-modus.modus-blau { background: var(--b-blau-bg); border-left: 3px solid var(--b-blau); }
.cm-modus-titel.modus-oeko { color: var(--oeko-fg); border-left: 3px solid var(--oeko-fg); background: var(--oeko-bg); }
.cm-item.cm-modus.modus-oeko { background: var(--oeko-bg); border-left: 3px solid var(--oeko-fg); }
.cm-modus-titel.modus-akvs { background: var(--akvs-bg); }

/* Modusabhängige Grid-Spalten */
.lv-grid { overflow-x: auto; }
.lv-zeile { grid-template-columns: var(--gridcols,
  44px 40px 110px minmax(220px,1fr) 80px 120px 70px 80px 110px 100px 70px 110px 120px); }
.dialog-zelle { color: var(--text-2); cursor: default; }
.katalog-zelle { color: var(--text-2); font-style: italic; }
.kalk-zelltext { font-size: 11.5px; }
.modal-karte.schmal { max-width: 380px; }

/* Objekt-Dialog → ausgelagert nach dialog-objekt.css */

/* Filter-Dialog → ausgelagert nach dialog-filter.css */
select.feld { appearance: auto; }

/* Sidebar-Fuß + Suchen-Dialog */
.sb-fuss { display: block; width: calc(100% - 8px); margin: 8px 4px 4px; padding: 6px;
  background: transparent; border: 1px dashed var(--rand); border-radius: 6px;
  color: var(--text-2); font-size: 11.5px; cursor: pointer; }
.sb-fuss:hover { background: var(--hover); color: var(--text); }
.modal-karte.breit { max-width: 640px; width: 92vw; }

/* Excel-Import: Spalten-Mapping + Rohdaten-Vorschau */
.modal-karte.xls { max-width: 820px; width: 94vw; }
.xls-mapping { display: grid; grid-template-columns: repeat(3, 1fr); gap: 8px; margin: 10px 0 4px; }
.xls-feld { display: flex; flex-direction: column; gap: 3px; font-size: 11px; color: var(--text-2); }
.xls-feld .feld { width: 100%; }
.xls-zeilen { display: flex; gap: 8px; margin: 4px 0 8px; }
.xls-zeilen .xls-feld { flex: 0 0 120px; }
.xls-optionen { margin-bottom: 6px; }
.xls-vorschau { max-height: 200px; overflow: auto; border: 1px solid var(--rand);
  border-radius: 6px; margin-top: 8px; font-size: 11px; }
.xls-vorschau table { border-collapse: collapse; width: 100%; }
.xls-vorschau th, .xls-vorschau td { border-bottom: 1px solid var(--rand-fein);
  padding: 2px 7px; text-align: left; white-space: nowrap; max-width: 180px;
  overflow: hidden; text-overflow: ellipsis; }
.xls-vorschau th { position: sticky; top: 0; background: var(--menu-bg);
  color: var(--text-2); font-weight: 600; }
.xls-vorschau .xls-nr { color: var(--text-3); text-align: right; }

/* ⚠ in der Objekt-Spalte: verknüpfte IFC-Objekte fehlen im Modell */
.obj-warn { color: var(--akvs-fg); margin-right: 3px; font-size: 11px; }

/* Datenverwaltung (/daten): Kacheln je Ablage */
.dv-kacheln { display: grid; grid-template-columns: repeat(auto-fill, minmax(340px, 1fr));
  gap: 14px; margin: 14px 0; }
.dv-kachel { background: var(--bg); border: 1px solid var(--rand-fein); border-radius: 10px;
  padding: 16px 18px; display: flex; flex-direction: column; gap: 8px; }
.dv-titel { font-size: 14px; font-weight: 600; }
.dv-text { font-size: 12px; color: var(--text-2); margin: 0; }
.dv-text a { color: var(--text); }
.dv-liste { border: 1px solid var(--rand-fein); border-radius: 6px; max-height: 180px; overflow-y: auto; }
.dv-zeile { display: flex; align-items: center; gap: 8px; padding: 6px 10px;
  border-bottom: 1px solid var(--rand-fein); font-size: 12.5px; }
.dv-zeile .fort-name { flex: 1; }
/* Zweistufige Fachdaten: "persoenlich"-Kennzeichen an Eintraegen der eigenen Ebene
   und der Ebenen-Banner oben auf /daten. */
.dv-badge { font-size: 11px; padding: 1px 7px; border-radius: 9px;
    background: #2E2E2E; color: #fff; white-space: nowrap; }
.dv-ebene-banner { border-left: 3px solid #2E2E2E; padding-left: 10px; }
.dv-aktionen { display: flex; gap: 8px; align-items: center; }
.dv-kachel .import-knopf { align-self: flex-start; }

/* Material-Mapping: Match-Tabelle mit Güte-Badges */
.map-liste { max-height: 420px; }
.map-zeile { display: grid; grid-template-columns: 70px 1.4fr 90px 130px 1.4fr 70px; gap: 8px;
  align-items: center; padding: 6px 10px; border-bottom: 1px solid var(--rand-fein);
  font-size: 12.5px; cursor: pointer; }
.map-zeile:hover { background: var(--hover); }
.map-zeile.map-kopf { position: sticky; top: 0; background: var(--bg); cursor: default;
  color: var(--text-2); font-size: 10.5px; font-weight: 600; }
.map-guete { font-size: 9.5px; font-weight: 700; border-radius: 4px; padding: 1px 6px; }
.map-guete.g-sicher   { background: var(--oeko-bg);   color: var(--oeko-fg); }
.map-guete.g-unsicher { background: var(--akvs-bg);   color: var(--akvs-fg); }
.map-guete.g-kein     { background: var(--badge-grau-bg); color: var(--badge-grau-fg); }
.map-guete.g-gesetzt  { background: var(--termin-bg); color: var(--termin-fg); }
.map-guete.g-manuell  { background: var(--termin-bg); color: var(--termin-fg); }

/* Stand-Historie (Etappe 3): Stände mit Zeit/Benutzer/Größe + Wiederherstellen */
.modal-karte.hist-modal { max-width: 640px; width: 92vw; }
.hist-liste { max-height: 380px; overflow-y: auto; border: 1px solid var(--rand-fein);
  border-radius: 6px; margin-top: 8px; }
.hist-zeile { display: grid; grid-template-columns: 150px 1fr 70px 130px auto; gap: 8px;
  align-items: center; padding: 6px 10px; border-bottom: 1px solid var(--rand-fein);
  font-size: 12.5px; }
.hist-zeile.hist-kopf { position: sticky; top: 0; background: var(--bg);
  color: var(--text-2); font-size: 10.5px; font-weight: 600; }
.hist-zeile .re { text-align: right; }

/* Papierkorb der Projektliste (Etappe 3): weich gelöschte Projekte zurückholen */
.pk-liste { max-height: 60vh; overflow-y: auto; border: 1px solid var(--rand-fein);
  border-radius: 6px; margin-top: 8px; }
.pk-zeile { display: grid; grid-template-columns: 1fr 170px auto; gap: 10px;
  align-items: center; padding: 7px 10px; border-bottom: 1px solid var(--rand-fein);
  font-size: 13px; }
.pk-name { font-weight: 600; }
.pk-zeit { color: var(--text-2); font-size: 12px; }

/* Verwaltung (/verwaltung) und Firma (/firma) — Etappe 4 */
.vw-mandant-zeile { display: grid; grid-template-columns: 110px 1fr 80px 150px 150px 70px auto;
  gap: 8px; align-items: center; padding: 6px 0; border-bottom: 1px solid var(--rand-fein);
  font-size: 13px; }
.vw-benutzer-zeile { display: grid; grid-template-columns: 150px 1fr 140px 70px auto;
  gap: 8px; align-items: center; padding: 6px 0; border-bottom: 1px solid var(--rand-fein);
  font-size: 13px; }
.vw-audit-zeile { display: grid; grid-template-columns: 125px 110px 100px 1fr; gap: 8px;
  padding: 4px 0; border-bottom: 1px solid var(--rand-fein); font-size: 12.5px; }
.vw-tab-kopf { color: var(--text-2); font-size: 10.5px; font-weight: 600; border-bottom-width: 2px; }
.vw-neu-zeile { display: flex; gap: 8px; flex-wrap: wrap; align-items: center; }
.vw-aktionen { display: flex; gap: 6px; justify-content: flex-end; }
.vw-einmal { font-family: Consolas, monospace; font-size: 15px; letter-spacing: 1px; }

/* Firmen-zentrierte Verwaltung: links Firmenliste, rechts Detail. */
.vw-layout { display: grid; grid-template-columns: 320px 1fr; gap: 16px; align-items: start; }
.vw-firma-karte { border: 1px solid var(--rand, #D4D4D8); border-radius: 8px; padding: 10px 12px;
  margin-bottom: 8px; cursor: pointer; background: var(--karte, #fff); }
.vw-firma-karte:hover { border-color: #999; }
.vw-firma-karte.aktiv { border-color: #C20000; box-shadow: 0 0 0 1px #C20000 inset; }
.vw-firma-kopf { display: flex; justify-content: space-between; align-items: center; gap: 8px; }
.vw-firma-unter { font-size: 12px; color: #888; }
.vw-firma-fakten { display: flex; justify-content: space-between; gap: 8px; font-size: 12px;
  color: #555; margin-top: 6px; }
.vw-badge { font-size: 11px; padding: 1px 8px; border-radius: 9px; white-space: nowrap; }
.vw-badge-aktiv { background: #E3F2E5; color: #1F7A2E; }
.vw-badge-testphase { background: #E3EDF9; color: #1D5FA8; }
.vw-badge-abgelaufen { background: #FBE4E4; color: #B3261E; }
.vw-badge-gekuendigt { background: #ECECEE; color: #666; }
.vw-ablauf-rot { color: #B3261E; font-weight: 600; }
.vw-ablauf-warn { color: #A8681D; font-weight: 600; }
.vw-neu-karte .feld { width: 100%; margin-bottom: 6px; }
.vw-lizenz-zeile { display: grid; grid-template-columns: auto 1fr auto 90px; gap: 8px 10px;
  align-items: center; }
.vw-lizenz-fuss { display: flex; justify-content: space-between; align-items: center; margin-top: 10px; }
.vw-benutzer-neu { display: flex; gap: 8px; flex-wrap: wrap; align-items: center;
  border-top: 1px solid var(--rand, #E4E4E7); padding-top: 10px; margin-top: 10px; }
.feld.schmal { width: auto; min-width: 110px; }
.app-inhalt .konto-karte + .konto-karte { margin-top: 14px; }

/* Ökobaudat-Picker */
.obd-kategorie { display: block; font-size: 10px; color: var(--text-3);
  font-weight: 400; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }

/* Katalog-Quellen-Pills + Fremdprojekt-Liste */
.stlk-quellen { margin: 6px 0 10px; }
.stlk-projekt-select { width: 100%; }
.stlk-fremd-liste { max-height: 380px; }

/* STLK-Katalog-Picker (Desktop StlkDialog): Liste links, Baukasten rechts */
.modal-karte.stlk-modal { max-width: 900px; width: 96vw; }
.stlk-spalten { display: grid; grid-template-columns: 1fr 1.4fr; gap: 14px; margin-top: 8px; }
.stlk-liste { max-height: 420px; overflow-y: auto; border: 1px solid var(--rand-fein);
  border-radius: 6px; margin-top: 8px; }
.stlk-eintrag { display: flex; gap: 8px; align-items: baseline; padding: 7px 10px;
  border-bottom: 1px solid var(--rand-fein); cursor: pointer; font-size: 12.5px; }
.stlk-eintrag:hover { background: var(--hover); }
.stlk-eintrag.aktiv { background: var(--bg-alt); box-shadow: inset 3px 0 0 var(--akzent); }
.stlk-nr { font-weight: 600; flex: none; }
.stlk-kurz { flex: 1; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.stlk-detail { max-height: 460px; overflow-y: auto; padding-right: 4px; }
.stlk-grundtext p { font-size: 12px; margin: 2px 0 8px; }
.stlk-gruppe-block { margin-bottom: 10px; }
.stlk-gruppe-titel { font-size: 11.5px; font-weight: 600; color: var(--text-2);
  margin-bottom: 3px; display: flex; gap: 8px; align-items: center; }
.stlk-pflicht { font-size: 9.5px; font-weight: 700; color: var(--akvs-fg);
  background: var(--akvs-bg); border-radius: 4px; padding: 1px 6px; }
.stlk-optional { font-size: 9.5px; color: var(--text-3); border: 1px solid var(--rand-fein);
  border-radius: 4px; padding: 0 6px; }
.stlk-leer { color: var(--text-3); font-style: italic; }
.stlk-freitext { margin: 2px 0 6px 24px; width: calc(100% - 24px); padding: 5px 8px; font-size: 12px; }
.stlk-vorschau { border-top: 1px solid var(--rand-fein); padding-top: 8px; margin-top: 4px; }
.stlk-vorschau pre { font-family: inherit; font-size: 12px; white-space: pre-wrap;
  background: var(--bg-alt); border: 1px solid var(--rand-fein); border-radius: 6px;
  padding: 8px 10px; margin: 4px 0 0; max-height: 140px; overflow-y: auto; }

/* Neues Projekt: Typwahl wie Desktop-NeuesProjektDialog (Liste links, Detail rechts) */
.modal-karte.np-modal { max-width: 720px; width: 94vw; }
.np-spalten { display: grid; grid-template-columns: 1fr 1.5fr; border: 1px solid var(--rand-fein);
  border-radius: 8px; overflow: hidden; margin-top: 8px; }
.np-typen { background: var(--bg-alt); border-right: 1px solid var(--rand-fein);
  padding: 2px 0 8px; max-height: 420px; overflow-y: auto; }
.np-gruppe { font-size: 10px; font-weight: 600; letter-spacing: .4px; color: var(--text-3);
  padding: 10px 14px 3px; }
.np-typ { --np-bg: var(--badge-grau-bg); --np-fg: var(--text);
  display: grid; grid-template-columns: 18px 1fr auto; column-gap: 9px; align-items: center;
  padding: 7px 14px; cursor: pointer; }
.np-typ.modus-akvs   { --np-bg: var(--akvs-bg);   --np-fg: var(--akvs-fg); }
.np-typ.modus-oenorm { --np-bg: var(--oenorm-bg); --np-fg: var(--oenorm-fg); }
.np-typ.modus-oeko   { --np-bg: var(--oeko-bg);   --np-fg: var(--oeko-fg); }
.np-typ.modus-termin { --np-bg: var(--termin-bg); --np-fg: var(--termin-fg); }
.np-typ.modus-db_lv  { --np-bg: var(--dblv-bg);   --np-fg: var(--dblv-fg); }
.np-typ:hover { background: var(--hover); }
.np-typ.aktiv { background: var(--np-bg); box-shadow: inset 3px 0 0 var(--np-fg); }
.np-typ.aktiv .np-typ-name, .np-typ.aktiv .np-ico { color: var(--np-fg); }
.np-ico { width: 18px; height: 18px; color: var(--text-2); grid-row: span 2; }
.np-ico path { fill: none; stroke: currentColor; stroke-width: 1.5;
  stroke-linecap: round; stroke-linejoin: round; }
.np-ico.gross { width: 26px; height: 26px; }
.np-typ-name { font-size: 12.5px; font-weight: 600; }
.np-typ-unter { font-size: 10.5px; color: var(--text-2); grid-column: 2; }
.np-neu { grid-column: 3; grid-row: 1 / span 2; font-size: 9px; font-weight: 700;
  color: var(--oeko-fg); background: var(--oeko-bg); border-radius: 4px; padding: 1px 5px; }
.np-detail { padding: 16px 20px; }
.np-kopf { display: flex; gap: 10px; align-items: center; }
.np-kopf .np-ico { color: var(--np-fg, var(--text)); }
.np-kopf.modus-akvs   { --np-fg: var(--akvs-fg); }
.np-kopf.modus-oenorm { --np-fg: var(--oenorm-fg); }
.np-kopf.modus-oeko   { --np-fg: var(--oeko-fg); }
.np-kopf.modus-termin { --np-fg: var(--termin-fg); }
.np-kopf.modus-db_lv  { --np-fg: var(--dblv-fg); }
.np-detail-name { font-size: 15px; font-weight: 600; }
.np-beschreibung { font-size: 11.5px; color: var(--text-2); min-height: 32px; margin: 8px 0 4px; }
.np-vorschau { font-size: 11px; color: var(--text-3); margin: 8px 0 0; min-height: 15px;
  overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.np-anlegen { width: 100%; margin-top: 12px; }

/* Öko-Dashboard (Desktop OekoDashboardDialog): KPI-Karten + Balken */
.oeko-streifen .od-knopf { padding: 3px 10px; font-size: 11.5px; }
/* Dashboard als Panel (Desktop OekoDashboardPanel), nicht als Dialog */
.oeko-dash-panel { flex: 1; min-width: 0; overflow: auto; padding: 16px;
  background: var(--bg); border: 1px solid var(--rand-fein); border-radius: 8px; }
.od-panel-titel { font-size: 18px; font-weight: 600; margin-bottom: 12px; }
.od-hinweis { margin-top: 12px; color: var(--text-3); font-size: 11.5px; }
.od-kpis { display: grid; grid-template-columns: repeat(4, 1fr); gap: 8px; margin: 10px 0 14px; }
.od-kpi { background: var(--bg-alt); border: 1px solid var(--rand-fein); border-radius: 8px;
  padding: 12px 14px; display: flex; flex-direction: column; gap: 2px; }
.od-kpi strong { font-size: 21px; font-weight: 700; }
.od-kpi span { font-size: 10.5px; color: var(--text-2); }
.od-spalten { display: grid; grid-template-columns: 1fr 1fr; gap: 18px;
  max-height: 320px; overflow-y: auto; }
.od-titel { font-weight: 600; font-size: 12.5px; margin-bottom: 8px; }
.od-zeile { margin-bottom: 9px; }
.od-kopf { display: flex; justify-content: space-between; font-size: 12px; }
.od-kopf span { color: var(--text-2); }
.od-kopf em { font-style: normal; font-weight: 600; }
.od-spur { height: 8px; background: var(--bg-alt); border-radius: 4px; margin-top: 3px; }
.od-balken { height: 8px; background: var(--oeko-fg); border-radius: 4px; }
.od-balken.neg { background: var(--akzent); }
/* Trefferliste von Suchen&Ersetzen: eigener Scrollbereich, damit <Virtualize> greift
   und ALLE Treffer erreichbar bleiben (keine Kappung). */
.such-treffer { max-height: 300px; overflow-y: auto; }
.such-zeile { display: flex; align-items: center; gap: 8px; margin-bottom: 6px; }
.such-zeile .feld { flex: 1; }
.such-zeile .such-modus { flex: 0 0 140px; }
.such-opt { display: inline-flex; align-items: center; gap: 4px; font-size: 12px;
  color: var(--text-2); white-space: nowrap; }
.such-spalten { flex-wrap: wrap; }

/* Fly-out-Untermenüs (wie Desktop Placement=Right).
   Immer im DOM; Sichtbarkeit steuert CSS beim Hover — so klappen sie sofort auf
   (kein Server-Roundtrip) und schließen beim Wegbewegen von selbst. */
.cm-wrap { position: relative; }
.cm-flyout { position: absolute; left: calc(100% - 4px); top: 0; min-width: 160px;
  background: var(--menu-bg); border: 1px solid var(--rand); border-radius: 8px;
  padding: 4px; box-shadow: 0 10px 28px #00000055; z-index: 220;
  display: none; }
.cm-wrap:hover > .cm-flyout { display: block; }
/* Elterneintrag markiert lassen, solange man im Untermenü ist. */
.cm-wrap:hover > .cm-item { background: var(--menu-hover); }
/* Auch die farbigen Modus-Einträge beim Hovern deutlich markieren. */
.cm-item.cm-modus:hover { background: var(--menu-hover); }
/* Am rechten Fensterrand: Fly-outs nach links öffnen (JS setzt die Klasse). */
.cm-menu.cm-flyout-links .cm-flyout { left: auto; right: calc(100% - 4px); }

/* Langtext-Platzhalter-Chips + GAEB-Vorschau */
.lt-chips { display: flex; align-items: center; gap: 6px; flex-wrap: wrap; margin-bottom: 8px; }
.gaeb-vorschau { max-height: 260px; overflow-y: auto; margin-top: 8px;
  border: 1px solid var(--rand-fein); border-radius: 6px; font-size: 12px; }
.gaeb-zeile { display: grid; grid-template-columns: 40px 90px 1fr 90px 60px 90px;
  border-bottom: 1px solid var(--rand-fein); padding: 4px 8px; gap: 6px; }
.gaeb-zeile.gaeb-kopf { position: sticky; top: 0; background: var(--bg);
  font-weight: 600; font-size: 10.5px; color: var(--text-2); }
.gaeb-zeile .gaeb-kurz { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.gaeb-zeile .re { text-align: right; }

/* Modus-Pills (Ausschreiben/Auswerten/Abrechnen) + Preisspiegel */
/* Pill-Umschalter: Maße wie Desktop-PnlModusSwitch (Kapsel h32/r20/p3, Pills p16/r17/13px SemiBold) */
.pv-pills { display: inline-flex; align-items: center; background: #00000012;
  border: 0.5px solid #00000022; border-radius: 20px; padding: 3px; height: 32px;
  box-sizing: border-box; }
.pv-pills.modus-switch { margin-left: auto; margin-right: 16px; }
/* Sekundär-Umschalter in der Tool-Zeile: rechtsbündig, etwas kompakter als oben. */
.pv-pills.tool-pills { margin-left: auto; height: 26px; }
.pv-pills.tool-pills .pv-pill { height: 20px; padding: 0 12px; font-size: 12px; }
.pv-pill { border: 0; background: transparent; color: #7A7A7E; font-size: 13px;
  font-weight: 600; height: 24px; line-height: 1;
  padding: 0 16px; border-radius: 17px; cursor: pointer; }
.pv-pill.aktiv { background: #2E2E2E; color: #fff; }
.pv-pill.deaktiv { opacity: .4; cursor: default; }
.preisspiegel .kt-chip.guenstig { background: var(--oeko-bg); color: var(--oeko-fg); }
.preisspiegel .kt-chip.teuer { background: transparent; color: var(--gefahr);
  border: 1px solid var(--gefahr); }
.pp-x { border: 0; background: transparent; color: inherit; cursor: pointer;
  font-size: 10px; margin-left: 4px; padding: 0; }

/* Abrechnen: Differenz-Farben + Auftragsbieter-Auswahl */
.diff-rot, .lv-zeile .zelle.diff-rot { color: var(--gefahr); }
.diff-gruen, .lv-zeile .zelle.diff-gruen { color: var(--oeko-fg); }
.auftrag-select { width: auto; min-width: 150px; padding: 4px 8px; font-size: 12px; }

/* Projektverwaltung */
.modal-karte.pvw { max-width: 760px; }
.pvw-inhalt { max-height: 56vh; overflow-y: auto; padding: 4px 2px; }
.pvw-gitter { display: grid; grid-template-columns: 220px 1fr; gap: 8px 14px;
  align-items: center; }
.pvw-gitter .feld-label { margin: 0; }
.pvw-spalten { display: grid; grid-template-columns: 1fr 1fr; gap: 14px 18px; }
.pvw-spalten .feld { margin-bottom: 6px; }
.pvw-schriftfeld { display: grid; grid-template-columns: 150px 1fr 170px; gap: 8px;
  align-items: center; margin-bottom: 6px; }
.pvw-schriftfeld .feld-label { margin: 0; }
.pvw-vermerke { min-height: 90px; }

/* Drag&Drop: Einfüge-Linie + End-Zone */
.lv-zeile.drop-ziel { box-shadow: inset 0 2px 0 var(--akzent); }
.drop-ende { padding: 10px; text-align: center; font-size: 11.5px; color: var(--text-3);
  border: 1px dashed var(--rand); border-radius: 6px; margin: 6px; }
.drop-ende.drop-ziel { border-color: var(--akzent); color: var(--text); }

/* Terminplanung: Vorgangs-Grid + Gantt */
.termin-flaeche { display: flex; flex: 1; border: 1px solid var(--rand-fein);
  border-radius: 8px; background: var(--bg-alt); height: calc(100vh - 252px);
  overflow-y: auto; }
.termin-links { flex: 0 0 1162px; border-right: 1px solid var(--rand-fein);
  overflow-x: auto; min-width: 320px; }
/* Beim schmalen Ziehen behalten die Zeilen ihre natürliche Breite — die Tabelle
   scrollt dann horizontal (Anwender-Feedback: Gantt größer ziehen können). */
.termin-links .termin-zeile { min-width: 1162px; }
.termin-splitter { flex: 0 0 6px; cursor: col-resize; background: var(--rand-fein);
  transition: background .15s; }
.termin-splitter:hover { background: var(--akzent); }
.termin-zeile { display: grid;
  /* Reihenfolge wie das Desktop-Grid: RELEVANZ, ID, TYP, VORGANG, OBJEKT, FILTER, MENGE,
     EINHEIT, DAUER, VORGÄNGER, STAT. VON/BIS, ANFANG/ENDE, % FERTIG */
  grid-template-columns: 34px 40px 36px minmax(180px,1fr) 130px 90px 80px 60px 80px 90px 64px 64px 74px 74px 66px;
  border-bottom: 1px solid var(--rand-fein); height: 28px; align-items: center;
  font-size: 12px; }
.termin-zeile > div { padding: 0 6px; overflow: hidden; text-overflow: ellipsis;
  white-space: nowrap; }
.termin-zeile.termin-kopf { position: sticky; top: 0; z-index: 2; background: var(--bg);
  color: var(--text-2); font-size: 10.5px; font-weight: 600; }
.termin-zeile.gruppe { font-weight: 600; background: color-mix(in srgb, var(--bg) 85%, var(--text) 6%); }
.termin-zeile .re { text-align: right; }

/* Termin-Bearbeitung (W8): Toolbar, editierbare Zellen, Lösch-✕, kritischer Pfad */
.termin-wrap { flex: 1; min-width: 0; display: flex; flex-direction: column; }
.termin-toolbar { display: flex; align-items: center; gap: 8px; margin-bottom: 6px; }
.termin-toolbar .feld { width: auto; padding: 4px 8px; font-size: 12px; }
.termin-toolbar .btn-leise { padding: 4px 10px; font-size: 12px; }
.termin-zeile { position: relative; }
.termin-zeile .t-edit:hover { background: var(--hover); cursor: text; border-radius: 3px; }
.termin-zeile .zell-edit { width: 100%; height: 24px; box-sizing: border-box;
  background: var(--bg); color: var(--text); border: 1px solid var(--akzent);
  border-radius: 3px; font-size: 12px; padding: 0 5px; }
.termin-zeile .t-loeschen { position: absolute; right: 2px; top: 4px; width: 20px; height: 20px;
  border: 0; border-radius: 4px; background: transparent; color: var(--text-3);
  font-size: 11px; cursor: pointer; opacity: 0; padding: 0; }
.termin-zeile:hover .t-loeschen { opacity: 1; }
.termin-zeile .t-loeschen:hover { background: var(--hover); color: var(--gefahr); }
.termin-zeile.kritisch { box-shadow: inset 3px 0 0 var(--gefahr); }
.termin-zeile.sel { background: color-mix(in srgb, var(--akzent) 16%, transparent); }
.termin-zeile .t-name { display: flex; align-items: center; gap: 0; }
.termin-zeile .t-klapp { color: var(--text-2); cursor: pointer; padding-right: 4px; }
.termin-zeile .t-name-text { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.termin-zeile .t-editor { margin-left: auto; padding: 0 2px 0 6px; font-weight: 700;
  color: var(--text-2); cursor: pointer; opacity: 0; }
.termin-zeile:hover .t-editor { opacity: 1; }

/* Gantt-Werkzeugleiste (Desktop GanttToolBtn / GanttToolToggle) */
.gantt-werkzeuge { display: flex; align-items: center; gap: 4px; padding: 4px 6px;
  background: var(--bg-alt); border: 1px solid var(--rand-fein);
  border-radius: 8px 8px 0 0; border-bottom: 0; }
.gantt-werkzeuge .g-btn { min-width: 26px; padding: 3px 8px; cursor: pointer;
  background: transparent; color: var(--text); font-size: 12px;
  border: 1px solid var(--rand); border-radius: 4px; }
.gantt-werkzeuge .g-btn:hover { background: var(--hover); }
.gantt-werkzeuge .g-btn.aktiv { background: var(--akzent); color: #fff; border-color: var(--akzent); }
.gantt-werkzeuge .g-zoom { min-width: 42px; text-align: center; font-size: 12px;
  color: var(--text-2); margin-right: 4px; }
.gantt-werkzeuge .g-sep { width: 1px; align-self: stretch; margin: 2px 4px; background: var(--rand); }
.gantt-werkzeuge + .termin-flaeche { border-radius: 0 0 8px 8px; }

/* Datumskopf der Timeline (Desktop RenderGanttHeader) */
.gantt-kopf-trenner { stroke: var(--rand-fein); stroke-width: .4; opacity: .4; }
.gantt-kopf-trenner.dick { stroke: var(--rand); stroke-width: 1; opacity: .7; }
.gantt-kopf-label { fill: var(--text); font-size: 10px; font-weight: 600; }
.gantt-kopf-tag { fill: var(--text-2); font-size: 9px; text-anchor: middle; opacity: .85; }
.gantt-kopf-tag.we { opacity: .4; }
.gantt-heute { stroke: var(--gefahr); stroke-width: 1; stroke-dasharray: 4 3; }

/* Timeline-Hintergrund + Deko (Desktop RenderGantt) */
.gantt-sel { fill: var(--akzent); opacity: .16; }
.gantt-heute-spalte { fill: var(--akzent); opacity: .10; }
.gantt-lane { fill: var(--akzent); opacity: .06; }
.gantt-zeilenlinie { stroke: var(--rand-fein); stroke-width: .4; opacity: .55; }
.gantt-zelllinie { stroke: var(--rand-fein); stroke-width: .4; opacity: .35; }
.gantt-zelllinie.dick { stroke: var(--rand); stroke-width: 1; opacity: .5; }
.gantt-pfeil { fill: none; stroke: var(--text-2); stroke-width: 1; opacity: .7; }
.gantt-pfeilspitze { fill: var(--text-2); opacity: .7; }
.gantt-info { fill: var(--text-2); font-size: 9px; opacity: .85; }
.gantt-info.stark { fill: var(--text); }
.gantt-balken-text { fill: #fff; font-size: 9px; pointer-events: none; }
.gantt-status { fill: none; stroke: var(--gefahr); stroke-width: 1.6; opacity: .85; }
.gantt-balken.blass, .gantt-fertig.blass, .gantt-ms.blass, .gantt-gruppe.blass { opacity: .3; }

/* Weg-Zeit-Diagramm (Desktop RenderWegZeit) */
.termin-ansicht-pills { margin-left: 6px; }
.termin-gantt.wegzeit { overflow: auto; padding: 8px; }
.wz-achse { stroke: var(--rand); stroke-width: 1; }
.wz-label { fill: var(--text-2); font-size: 10px; }
.wz-sperre { fill: var(--akvs-fg); opacity: .12; }
.wz-heute { stroke: var(--gefahr); stroke-width: 1; stroke-dasharray: 4 3; }
.wz-band { fill: var(--termin-fg); opacity: .9; }
.wz-band.kritisch { fill: var(--gefahr); }
.wz-name { fill: var(--text); font-size: 10px; }

/* Gantt-Drag: Balken greifbar, Geist beim Ziehen, Datums-Hinweis */
.gantt-balken, .gantt-ms { cursor: grab; }
.gantt-griff { fill: var(--termin-fg); opacity: 0; cursor: ew-resize; }
.termin-gantt:hover .gantt-griff { opacity: .5; }
.gantt-griff:hover { opacity: 1; }
.termin-gantt.am-ziehen { cursor: grabbing; user-select: none; touch-action: none; }
.gantt-balken.geist, .gantt-ms.geist, .gantt-fertig.geist { opacity: .55; }
.gantt-drag-datum { fill: var(--text); font-size: 10.5px; font-weight: 600; }

/* Sperrzeiten: Gantt-Band + Verwaltungs-Modal */
.gantt-sperre { fill: var(--akvs-fg); opacity: .14; }
.sperr-zeile { display: flex; align-items: center; gap: 8px; padding: 5px 8px;
  border-bottom: 1px solid var(--rand-fein); font-size: 12.5px; position: relative; }
.sperr-zeile .fort-name { flex: 1; }
.sperr-loeschen { position: static; opacity: 1; }
.sperr-neu { margin-top: 10px; display: flex; flex-direction: column; gap: 6px; }
.sperr-daten { display: flex; align-items: center; gap: 8px; font-size: 12px;
  color: var(--text-2); }

/* Termin: LV-Übernahme + Aufwand-Zuordnung + Abgleich-Historie */
.tlv-liste { margin-top: 10px; max-height: 340px; overflow: auto;
  border: 1px solid var(--rand-fein); border-radius: 6px; }
.tlv-zeile { display: flex; align-items: center; gap: 8px; padding: 4px 10px 4px 8px;
  font-size: 12.5px; cursor: pointer; border-bottom: 1px solid var(--rand-fein); }
.tlv-zeile:last-child { border-bottom: none; }
.tlv-zeile:hover { background: color-mix(in srgb, var(--text) 5%, transparent); }
.tlv-zeile.kapitel { font-weight: 600; background: color-mix(in srgb, var(--text) 4%, transparent); }
.tlv-zeile .fort-name { flex: 1; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.tlv-oz { font-variant-numeric: tabular-nums; color: var(--text-2); min-width: 64px; }
.tlv-verkn { display: flex; align-items: center; gap: 8px; margin-top: 10px;
  font-size: 12.5px; cursor: pointer; }
.tlv-check-platz { width: 13px; flex: none; }
.vg-freitext { display: flex; align-items: center; gap: 8px; margin-top: 8px; }
.vg-freitext .feld { flex: 1; }
.aufw-liste { max-height: 340px; overflow: auto; }
.aufw-zeile { display: grid; grid-template-columns: 1fr 70px 130px 110px;
  gap: 10px; align-items: center; padding: 5px 8px;
  border-bottom: 1px solid var(--rand-fein); font-size: 12.5px; }
.aufw-zeile .fort-name { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.aufw-kopf { font-size: 10.5px; font-weight: 600; letter-spacing: .4px;
  color: var(--text-2); border-bottom: 1px solid var(--rand); }
.aufw-wert { width: 100%; text-align: right; }
.thist-liste { max-height: 380px; overflow: auto; }
.thist-zeile { display: grid; grid-template-columns: 92px 80px 1fr 64px 110px 110px;
  gap: 8px; align-items: center; padding: 4px 8px;
  border-bottom: 1px solid var(--rand-fein); font-size: 12px; }
.thist-zeile .fort-name { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.thist-kopf { font-size: 10.5px; font-weight: 600; letter-spacing: .4px;
  color: var(--text-2); border-bottom: 1px solid var(--rand); }

/* LV-Vergleich: Δ-Spalten (kursiv wie die Desktop-Consolas-Zellen) */
.vgl-kopf { font-style: italic; }
.vgl-zelle { font-family: Consolas, "Cascadia Mono", monospace; font-style: italic;
  font-size: 12px; color: var(--text-2); }
.vgl-zelle.vgl-teuer { color: var(--gefahr); }
.vgl-zelle.vgl-guenstig { color: var(--oeko-fg); }
.vgl-zelle.vgl-neu { color: var(--akzent); }
.cm-item input[type=file] { display: none; }

/* Dialog-Zellen wie Desktop: Aktionstext kursiv, Wert mit gepunktetem Unterstrich,
   Chevron erst bei Hover (DgPlatzhalter/DgUnterstrich/DgChevron) */
.dialog-zelle { display: flex; align-items: center; cursor: pointer; }
.dz-platzhalter { color: var(--text-3); font-style: italic; }
.dz-wert { display: inline-block; max-width: 100%; overflow: hidden; text-overflow: ellipsis;
  white-space: nowrap; border-bottom: 1.5px dotted color-mix(in srgb, var(--text-2) 65%, transparent);
  padding-bottom: 1px; }
.dz-wert.mono { font-family: Consolas, "Cascadia Mono", monospace; font-size: 12px; }
.dz-wert.dz-fehler { color: var(--gefahr); }
.dz-wert.dz-katalog { color: var(--text-3); font-style: italic; }
.dz-chevron { margin-left: auto; padding-left: 4px; font-size: 10px; color: var(--text-2);
  opacity: 0; flex: none; }
.dialog-zelle:hover .dz-chevron { opacity: 1; }

/* Modell-Term-Editor → ausgelagert nach dialog-kalkulation.css */
.termin-gantt { flex: 1; overflow-x: auto; }
.gantt-we { fill: color-mix(in srgb, var(--text) 6%, transparent); }
.gantt-woche { stroke: var(--rand-fein); stroke-width: 1; }
.gantt-datum { fill: var(--text-2); font-size: 9.5px; }
.gantt-balken { fill: var(--termin-fg); opacity: .45; }
.gantt-fertig { fill: var(--termin-fg); }
.gantt-gruppe { fill: var(--text); }
.gantt-ms { fill: var(--text); }

/* Feedback-Floating-Button + Konto */
.fb-knopf { position: fixed; right: 18px; bottom: 46px; width: 42px; height: 42px;
  border-radius: 21px; border: 1px solid var(--rand); background: var(--bg);
  font-size: 18px; cursor: pointer; z-index: 150; box-shadow: 0 4px 14px #00000033; }
.fb-knopf:hover { filter: brightness(1.1); }
.konto-karte { max-width: 420px; background: var(--bg); border: 1px solid var(--rand-fein);
  border-radius: 10px; padding: 20px 24px; margin-top: 14px; }
a.pv-benutzer { text-decoration: none; }
a.pv-benutzer:hover { text-decoration: underline; }

/* Ökobaudat-Picker: Suchzeile mit Kategorie-Filter (Desktop OekobaudatPickerDialog) */
.obd-suchzeile { display: flex; gap: 8px; align-items: center; }
.obd-suchzeile .feld { height: 30px; }
.obd-kat-filter { flex: 0 0 240px; padding-top: 2px; padding-bottom: 2px; line-height: 1.3; }

/* „Vorgänge mit verschieben?" (Desktop VorgangVerschiebenDialog) */
.vv-liste { max-height: 300px; }
.vv-zeile { display: grid; grid-template-columns: 50px 1fr 90px 100px 100px; gap: 8px;
  padding: 5px 10px; font-size: 12.5px; border-bottom: 1px solid var(--rand-fein); }
.vv-zeile.vv-kopf { position: sticky; top: 0; background: var(--bg);
  font-size: 10.5px; font-weight: 600; color: var(--text-2); }

/* Verketten per Link-Knoten (Desktop StarteLinkDrag) */
.gantt-knoten { fill: var(--akzent); opacity: 0; cursor: crosshair; }
.termin-gantt:hover .gantt-knoten { opacity: .55; }
.gantt-knoten:hover { opacity: 1; }
.gantt-linkband { stroke: var(--akzent); stroke-width: 1.4; stroke-dasharray: 4 3; pointer-events: none; }
.gantt-fanglinie { stroke: var(--akzent); stroke-width: 1; pointer-events: none; }
/* Datumskopf bleibt beim vertikalen Scrollen stehen (Desktop: eigener Header-Scroller) */
.gantt-kopf-bg { fill: var(--bg); }

/* Öko-Module-Dialog: Modul-Haken mit GWP rechts */
.oeko-modul-liste { max-height:50vh; overflow:auto; margin:4px 0 8px; }
.oeko-modul-liste .fort-quelle { display:flex; align-items:center; gap:8px; }
.oeko-modul-liste .fort-name { flex:1; }
.oeko-modul-liste .sb-zahl { color:var(--text-2); font-variant-numeric:tabular-nums; }