:root { --rot:#C8001A; --rot-dunkel:#9E0015; --text:#1C1F24; --grau:#5A6068; --linie:#D9DCE0; --flaeche:#F4F5F6; --gruen:#1E7B3C; --gelb:#B26A00; --blau:#1F5FA8; }
* { box-sizing: border-box; }
html, body { margin: 0; }
body { background: #FFFFFF; color: var(--text); font-family: "Segoe UI", Calibri, Arial, sans-serif; font-size: 15px; line-height: 1.45; }
a { color: var(--blau); }
h1 { font-size: 22px; margin: 0 0 14px; }
h2 { font-size: 17px; margin: 22px 0 8px; }
p { margin: 0 0 10px; }

/* Kopf und Rahmen */
.kopf { background: var(--text); color: #FFFFFF; display: flex; justify-content: space-between; align-items: center; gap: 12px; padding: 9px 16px; flex-wrap: wrap; }
.kopf a, .kopf .link { color: #FFFFFF; text-decoration: none; }
.kopf a:hover, .kopf .link:hover { text-decoration: underline; }
.marke-name b { color: #FFFFFF; }
.kopf-rechts { display: flex; align-items: center; gap: 16px; font-size: 14px; }
.kopf-rechts form { margin: 0; }
button.link { background: none; border: 0; padding: 0; font: inherit; cursor: pointer; }
.rahmen { display: grid; grid-template-columns: 210px 1fr; min-height: calc(100vh - 42px); }
.rahmen:not(:has(.nav)) { grid-template-columns: 1fr; }
.nav { background: var(--flaeche); border-right: 1px solid var(--linie); padding: 10px 0; }
.nav a { display: flex; justify-content: space-between; padding: 7px 14px; color: var(--text); text-decoration: none; border-left: 3px solid transparent; }
.nav a:hover { background: #E9EBED; }
.nav a.an { background: #FFFFFF; border-left-color: var(--rot); font-weight: 600; }
.nav a span { color: var(--grau); font-weight: 400; }
.nav a.neu { margin-top: 8px; color: var(--rot); font-weight: 600; }
.nav-titel { margin: 16px 14px 4px; font-size: 12px; text-transform: uppercase; letter-spacing: .04em; color: var(--grau); }
.inhalt { padding: 18px 22px 40px; min-width: 0; }

/* Meldungen */
.meldung { background: #E9F5EC; border-left: 4px solid var(--gruen); padding: 9px 12px; margin: 0 0 14px; }
.fehler { background: #FDECEE; border-left: 4px solid var(--rot); padding: 9px 12px; margin: 0 0 14px; }
.hinweis { background: #FFF7E0; border-left: 4px solid var(--gelb); padding: 9px 12px; margin: 0 0 14px; }
.leer { color: var(--grau); padding: 18px 0; }
.klein { font-size: 13px; color: var(--grau); }

/* Tabellen */
table.liste { border-collapse: collapse; width: 100%; }
table.liste th, table.liste td { text-align: left; vertical-align: top; padding: 7px 10px; border-bottom: 1px solid var(--linie); }
table.liste th { background: var(--flaeche); font-weight: 600; white-space: nowrap; }
table.liste tr:hover td { background: #FAFAFB; }
table.liste td.eng { white-space: nowrap; }
table.liste a.zeile { color: var(--text); text-decoration: none; font-weight: 600; }
table.liste a.zeile:hover { text-decoration: underline; }
.tabellen-rahmen { overflow-x: auto; }

/* Marken */
.marke { display: inline-block; padding: 1px 8px; border-radius: 9px; font-size: 12px; color: #FFFFFF; white-space: nowrap; }
.m-neu { background: var(--rot); } .m-arbeit { background: var(--blau); } .m-wartet { background: var(--gelb); } .m-fertig { background: var(--gruen); } .m-grau { background: var(--grau); } .m-privat { background: #5b2a86; }

/* Formulare */
label { display: block; font-size: 13px; color: var(--grau); margin: 0 0 3px; }
input[type=text], input[type=password], input[type=email], input[type=tel], input[type=date], input[type=number], select, textarea {
  width: 100%; padding: 7px 9px; border: 1px solid #B8BDC4; border-radius: 4px; font: inherit; color: var(--text); background: #FFFFFF; }
input:focus, select:focus, textarea:focus { outline: 2px solid var(--blau); outline-offset: 0; border-color: var(--blau); }
textarea { min-height: 90px; resize: vertical; }
.feld { margin: 0 0 12px; }
.felder { display: grid; grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)); gap: 0 16px; }
.haken { display: flex; align-items: flex-start; gap: 8px; margin: 0 0 10px; }
.haken input { margin-top: 3px; }
.haken label { font-size: 15px; color: var(--text); margin: 0; }
.haken small { display: block; color: var(--grau); }
.knopf { display: inline-block; border: 1px solid var(--text); border-radius: 4px; padding: 6px 13px; background: #FFFFFF; color: var(--text); font: inherit; cursor: pointer; text-decoration: none; }
.knopf:hover { background: var(--flaeche); }
.knopf.rot { background: var(--rot); border-color: var(--rot); color: #FFFFFF; }
.knopf.rot:hover { background: var(--rot-dunkel); }
.knopf.klein { padding: 3px 9px; font-size: 13px; }
.knopfzeile { display: flex; gap: 8px; flex-wrap: wrap; align-items: center; margin-top: 6px; }
form.inline { display: inline; margin: 0; }
.abschnitt { border: 1px solid var(--linie); border-radius: 6px; padding: 14px 16px; margin: 0 0 16px; }
.abschnitt > h2:first-child { margin-top: 0; }
.kopfzeile { display: flex; justify-content: space-between; align-items: center; gap: 12px; flex-wrap: wrap; margin-bottom: 12px; }
.kopfzeile h1 { margin: 0; }
.suche { display: flex; gap: 6px; }
.suche input { width: 230px; }

/* Ticket */
.ticket { display: grid; grid-template-columns: 1fr 290px; gap: 18px; align-items: start; }
.eintrag { border: 1px solid var(--linie); border-radius: 5px; padding: 8px 11px; margin-bottom: 9px; white-space: pre-wrap; overflow-wrap: anywhere; }
.eintrag small { color: var(--grau); display: block; white-space: normal; margin-bottom: 2px; }
.eintrag.wir { background: #EEF4FB; } .eintrag.notiz { background: #FFF7E0; } .eintrag.system { background: var(--flaeche); color: var(--grau); padding: 5px 11px; font-size: 13px; }
.eintrag.system small { display: inline; margin-right: 8px; }
.belege { display: grid; grid-template-columns: 250px 1fr; gap: 18px; align-items: start; }
.lieferanten { border: 1px solid var(--linie); border-radius: 6px; padding: 5px 0; font-size: 14px; }
.lieferanten a { display: flex; justify-content: space-between; gap: 8px; padding: 4px 11px; color: var(--text); text-decoration: none; }
.lieferanten a:hover { background: var(--flaeche); }
.lieferanten a.an { background: var(--flaeche); font-weight: 600; border-left: 3px solid var(--rot); padding-left: 8px; }
.lieferanten a span { color: var(--grau); font-weight: 400; }
@media screen and (max-width: 800px) { .belege { grid-template-columns: 1fr; } }
.ordnerbaum { max-height: 420px; overflow: auto; border: 1px solid var(--linie); border-radius: 5px; padding: 8px 12px; }
.ordnerbaum .haken { margin-top: 2px; margin-bottom: 2px; }
.freigaben { display: grid; grid-template-columns: repeat(auto-fill, minmax(230px, 1fr)); gap: 2px 18px; }
.frage { border: 1px solid var(--linie); border-left: 4px solid var(--rot); border-radius: 5px; padding: 10px 14px; margin-bottom: 12px; max-width: 980px; }
.frage p { margin: 6px 0; }
.frage form { margin-top: 10px; }
.frage details { white-space: pre-wrap; margin: 0 0 6px; }
.regel { border: 1px solid var(--linie); border-radius: 5px; padding: 8px 12px; margin-bottom: 7px; max-width: 820px; }
.regel summary { cursor: pointer; }
.regel summary .klein { margin: 2px 0 0 16px; }
.regel.aus summary { color: var(--grau); }
.regel form { margin-top: 12px; padding-top: 10px; border-top: 1px dashed var(--linie); }
.eintrag.ungelesen { border-left: 4px solid var(--rot); }
.zitat { margin-top: 8px; color: var(--grau); font-size: 13px; }
.zitat summary { cursor: pointer; white-space: normal; }
.anhaenge { white-space: normal; display: flex; flex-wrap: wrap; gap: 8px; margin-top: 10px; padding-top: 9px; border-top: 1px dashed var(--linie); }
.anhang { display: flex; flex-direction: column; gap: 2px; max-width: 230px; border: 1px solid var(--linie); border-radius: 5px; padding: 6px 9px; background: #FFFFFF; color: var(--text); text-decoration: none; font-size: 14px; }
.anhang:hover { border-color: var(--text); }
.anhang img { max-width: 100%; max-height: 130px; object-fit: contain; border-radius: 3px; margin-bottom: 3px; }
.anhang span { text-decoration: underline; }
.anhang small { margin: 0; }
.anhang-fehlt { white-space: normal; margin-top: 8px; font-size: 13px; color: var(--grau); display: flex; gap: 8px; flex-wrap: wrap; align-items: center; }
.daten { background: var(--flaeche); border: 1px solid var(--linie); border-radius: 6px; padding: 12px 14px; }
.daten h2 { margin-top: 0; }

/* Schmale Seiten (Anmeldung) */
body.schmal { background: var(--flaeche); min-height: 100vh; display: flex; align-items: flex-start; justify-content: center; padding: 8vh 14px 20px; }
.karte-mitte { background: #FFFFFF; border: 1px solid var(--linie); border-top: 4px solid var(--rot); border-radius: 6px; padding: 22px 24px; width: 100%; max-width: 400px; }
.karte-kopf { margin-bottom: 16px; } .karte-kopf b { font-size: 20px; display: block; } .karte-kopf span { color: var(--grau); }
.kennzahl { font-size: 40px; font-weight: 700; letter-spacing: .12em; text-align: center; margin: 10px 0 14px; color: var(--rot); }

/* Notdienst-Seite (Handy) */
.nd-karte { border: 1px solid var(--linie); border-left: 5px solid var(--rot); border-radius: 6px; padding: 12px 14px; margin-bottom: 12px; max-width: 560px; }
.nd-karte.fertig { border-left-color: var(--gruen); opacity: .8; }
.nd-karte b.name { display: block; font-size: 17px; }
.nd-karte .grund { margin: 6px 0; white-space: pre-wrap; }
.nd-karte .knopf { padding: 9px 14px; }
/* Kundenprüfung gegen TAIFUN (04.10.2026) */
.nd-pruefung { margin: 6px 0 8px; padding: 8px 10px; border-radius: 6px; }
.nd-pruefung.gut { background: #E6F4EC; color: #155D38; }
.nd-pruefung.pruefen { background: #FFF4D6; color: #6B4A00; border: 1px solid #E8C766; }
.nd-pruefung .klein { margin-top: 3px; white-space: normal; }

.menu-knopf { display: none; }
.nur-handy { display: none; }
.kurzkarte { border: 1px solid var(--linie); border-left: 5px solid var(--rot); border-radius: 8px; padding: 10px 12px; margin-bottom: 14px; }
.kurzkarte b { font-size: 17px; }
.kurzkarte .knopfzeile { margin-top: 8px; }

/* Handy: Menü hinter einem Knopf, Listen als Karten statt breiter Tabellen. */
@media screen and (max-width: 760px) {
  .kopf { padding: 8px 12px; flex-wrap: nowrap; }
  .kopf .firma { display: none; }
  .nur-handy { display: block; }
  .knopf { padding: 9px 14px; }
  .knopf.klein { padding: 7px 11px; }
  .menu-knopf { display: inline-block; background: transparent; color: #FFFFFF; border: 1px solid rgba(255,255,255,.5); border-radius: 6px; padding: 7px 12px; font: inherit; font-size: 15px; cursor: pointer; }
  .kopf-rechts { display: none; }
  body.menu-offen .kopf { flex-wrap: wrap; }
  body.menu-offen .kopf-rechts { display: flex; flex-wrap: wrap; width: 100%; gap: 6px 16px; padding-top: 8px; }
  .rahmen { grid-template-columns: 1fr; min-height: 0; }
  .nav { display: none; border-right: 0; border-bottom: 1px solid var(--linie); padding: 4px 0 10px; }
  body.menu-offen .nav { display: block; }
  .nav a { padding: 11px 16px; font-size: 16px; }
  .nav a.neu { margin-top: 4px; }
  .nav-titel { margin: 14px 16px 4px; }
  .ticket { grid-template-columns: 1fr; }
  .inhalt { padding: 14px 12px 30px; }
  h1 { font-size: 21px; }
  .suche { display: flex; gap: 6px; width: 100%; }
  .suche input { width: auto; flex: 1; min-width: 0; }
  .filter select { flex: 1 1 45%; min-width: 0; }
  input[type=text], input[type=email], input[type=search], input[type=password], select, textarea { font-size: 16px; max-width: 100%; }

  /* Tabellen werden Karten: jede Zeile ein Kasten, die Spaltenköpfe entfallen. */
  .tabellen-rahmen { overflow-x: visible; }
  table.liste, table.liste tbody, table.liste tr, table.liste td { display: block; width: auto; }
  table.liste tr:has(th) { display: none; }
  table.liste tr { border: 1px solid var(--linie); border-radius: 8px; padding: 8px 10px; margin-bottom: 10px; background: #FFFFFF; }
  table.liste tr:hover td { background: transparent; }
  table.liste td { border: 0; padding: 2px 0; }
  table.liste td.eng { display: inline-block; white-space: normal; margin-right: 10px; }
  table.liste td:empty { display: none; }
  table.liste a.zeile { font-size: 16px; }
}
.anhang-block { display: flex; flex-direction: column; gap: 4px; align-items: flex-start; }
.anhang-knoepfe { display: flex; gap: 6px; flex-wrap: wrap; }
.anhang-knoepfe:empty { display: none; }
.anhaenge form.anhang-allepdf { display: flex; align-items: flex-end; }

/* Drucken: nur der Inhalt, ohne Menü, Knöpfe und Formulare. */
@media print {
  .kopf, .nav, .knopf, .meldung, .fehler, .hinweis, .zitat summary { display: none !important; }
  /* Eingabe-Formulare fallen weg – aber nicht, wenn eine Liste darin steht (z. B. Ticketliste mit Häkchen „löschen“;
     07.10.2026: Ausdruck war leer). Dort entfallen nur Häkchen-Spalte und Knopfzeile. */
  form:where(:not(:has(table.liste))) { display: none !important; } /* :where = so schwach wie früher „form“, Ausnahmen wie form[data-dokument] greifen weiter */
  form:has(table.liste) > .knopfzeile, form:has(table.liste) table.liste :is(th, td).eng:has(> input[type=checkbox]) { display: none !important; }
  .rahmen { display: block; min-height: 0; }
  .inhalt { padding: 0; }
  .ticket { display: block; }
  .eintrag { break-inside: avoid; }
  a { color: #000; text-decoration: none; }
  /* Breite Listen passen aufs Blatt: kein Bildlauf, etwas kleiner, Spaltenköpfe dürfen umbrechen. */
  .tabellen-rahmen, .tm-dispo-rahmen { overflow: visible; }
  table.liste { font-size: 12px; }
  table.liste th, table.liste td { padding: 4px 6px; }
  table.liste th { white-space: normal; }
  table.liste tr { break-inside: avoid; }
}

/* KI-Hilfe über dem Textfeld */
[hidden] { display: none !important; }
.ki { border: 1px dashed var(--linie); border-radius: 5px; padding: 8px 11px 2px; margin-bottom: 12px; background: var(--flaeche); }
.ki .feld { margin-bottom: 6px; }

/* Spaltenüberschriften zum Sortieren */
.sortieren { color: inherit; text-decoration: none; white-space: nowrap; }
.sortieren:hover { text-decoration: underline; }
.sortieren.an { color: var(--rot); }

/* Kasten unten rechts: was es Neues gibt */
.neuigkeiten { position: fixed; right: 16px; bottom: 16px; z-index: 50; width: min(380px, calc(100vw - 32px)); max-height: 60vh; overflow: auto; background: #FFFFFF; border: 2px solid var(--rot); border-radius: 6px; padding: 8px 12px 10px; box-shadow: 0 4px 18px rgba(0, 0, 0, .25); display: flex; flex-direction: column; gap: 7px; font-size: 14px; }
.neuigkeiten .link { align-self: flex-end; color: var(--grau); background: none; border: 0; cursor: pointer; font-size: 13px; padding: 0; }
.neuigkeiten a { color: var(--text); text-decoration: none; display: flex; flex-direction: column; border-top: 1px solid var(--linie); padding-top: 6px; }
.neuigkeiten a:hover span { text-decoration: underline; }
@media print { .neuigkeiten { display: none !important; } }

/* Filterzeile über den Ticketlisten */
.filter { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; margin: 0 0 12px; }
.filter select { width: auto; padding: 4px 6px; font-size: 14px; }
.filter .klein { margin: 0; }

/* Ticket abschließen: eigener, gut sichtbarer Block */
.erledigen { margin-top: 12px; padding-top: 10px; border-top: 1px dashed var(--linie); display: flex; flex-wrap: wrap; gap: 6px; align-items: center; }
.erledigen .klein { flex-basis: 100%; margin: 0; }

/* Vorschlag: Mail oder Ticket passt zu einem vorhandenen Ticket */
.passend { margin: 6px 0 0; padding: 6px 9px; border: 1px dashed var(--linie); border-radius: 5px; background: var(--flaeche); }
.passend .knopf { margin-top: 4px; }

/* Mail im Original (HTML mit Bildern) im Ticket */
.mailhtml { display: block; width: 100%; height: 260px; border: 1px solid var(--linie); border-radius: 4px; background: #FFFFFF; margin-top: 4px; }
@media print { .mailhtml { display: none; } .eintrag details.zitat { display: block; } }

/* Adressbuch: Vorschläge unter dem Adressfeld */
.adress-liste { display: none; position: absolute; z-index: 1000; background: #FFFFFF; border: 1px solid var(--linie); box-shadow: 0 4px 14px rgba(0,0,0,.15); max-height: 320px; overflow-y: auto; }
.adress-zeile { padding: 7px 10px; cursor: pointer; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.adress-zeile b { font-weight: 600; }
.adress-zeile span { color: var(--grau); font-size: 13px; }
.adress-zeile.an, .adress-zeile:hover { background: var(--flaeche); }
.neuigkeiten-kopf { display: flex; justify-content: space-between; align-items: center; gap: 10px; }
.neuigkeiten-kopf .link { align-self: auto; }
.neuigkeiten { max-height: 45vh; }
.neuigkeiten.zu { width: auto; padding: 0; border: 0; overflow: visible; }
.neuigkeiten-knopf { background: var(--rot); color: #FFFFFF; border: 0; border-radius: 4px; padding: 7px 14px; font: inherit; font-weight: 600; cursor: pointer; }
.neuigkeiten-knopf:hover { background: var(--rot-dunkel); }
.neuigkeiten-kopf { position: sticky; top: -8px; background: #FFFFFF; padding: 4px 0; margin-top: -4px; z-index: 1; }
.neuigkeiten-knoepfe { display: flex; gap: 14px; }
.eintrag.uebergabe { border-left: 4px solid var(--gelb); font-weight: 600; }
/* Statuswechsel und andere Vermerke im Verlauf: gut lesbar, aber ruhiger als Mails (Karsten, 02.10.2026). */
.eintrag.system { background: #F7F9FC; color: var(--text); font-size: 14px; border-left: 4px solid var(--blau); padding: 7px 11px; }
.eintrag.system small { font-size: 13px; }
.statuswechsel { display: inline-flex; align-items: center; gap: 6px; }
.statuswechsel .marke { font-size: 13px; padding: 2px 10px; }
.statuswechsel .pfeil { color: var(--grau); font-weight: 600; }
.eintrag.v-angelegt { border-left-color: var(--gruen); }
.eintrag.v-status { border-left-color: var(--blau); }
.eintrag.v-wiedervorlage { border-left-color: var(--gelb); background: #FFFBEF; }
.eintrag.v-geloescht { border-left-color: var(--rot); }
.eintrag.v-privat { border-left-color: #5b2a86; }
.eintrag.v-zusammen { border-left-color: var(--blau); background: #EEF4FB; }
.eintrag.v-ablage { border-left-color: var(--grau); }
.eintrag.v-info { border-left-color: var(--linie); color: var(--grau); }
.eintrag.system .marke { font-size: 13px; padding: 1px 9px; }
/* Aufklappbare Gruppen in der linken Leiste */
.nav-gruppe > summary { list-style: none; cursor: pointer; display: flex; justify-content: space-between; align-items: center; padding-right: 14px; user-select: none; }
.nav-gruppe > summary::-webkit-details-marker { display: none; }
.nav-gruppe > summary::after { content: "▸"; font-size: 13px; color: var(--grau); }
.nav-gruppe[open] > summary::after { content: "▾"; }
.nav-gruppe > summary:hover { color: var(--text); }
/* Teamarbeit im Ticket */
.team { border-top: 1px solid var(--linie); border-bottom: 1px solid var(--linie); padding: 8px 0; margin: 4px 0 10px; }
.team-person { display: inline-flex; align-items: center; gap: 4px; margin: 3px 10px 3px 0; background: #EEF4FB; border-radius: 12px; padding: 2px 10px; }
.team-person .link { color: var(--grau); font-size: 16px; line-height: 1; }
.team-dazu { display: flex; gap: 6px; margin-top: 6px; flex-wrap: wrap; }
.team-dazu select { min-width: 140px; }
.aufgabe { background: #FFF7E0; border-left: 4px solid var(--gelb); border-radius: 4px; padding: 6px 9px; margin-top: 6px; }
.aufgabe-text { white-space: pre-wrap; margin: 3px 0 5px; font-size: 14px; }
.praesenz { background: #FDECEE; border-left: 4px solid var(--rot); padding: 8px 12px; margin: 0 0 12px; font-weight: 600; }
.team-wahl { display: inline-flex; align-items: center; gap: 4px; margin-right: 10px; font-size: 14px; white-space: nowrap; }

/* Handbuch und Schulungsvideo (Karsten, 02.10.2026) */
.nav a.hilfe-link { margin-top: 18px; border-top: 1px solid var(--linie); padding-top: 11px; color: var(--blau); font-weight: 600; }
.hilfe-kopf { display: flex; justify-content: space-between; align-items: center; gap: 12px; flex-wrap: wrap; }
.hilfe-suche { position: sticky; top: 0; z-index: 5; background: #FFFFFF; padding: 10px 0 12px; border-bottom: 1px solid var(--linie); margin-bottom: 14px; }
.hilfe-suche input { width: 100%; max-width: 760px; font: inherit; font-size: 18px; padding: 11px 14px; border: 2px solid var(--text); border-radius: 8px; }
.hilfe-suche input:focus { outline: none; border-color: var(--rot); box-shadow: 0 0 0 3px rgba(200,0,26,.15); }
.hilfe-suche .klein { margin-top: 6px; }
.hilfe-rahmen { display: grid; grid-template-columns: 250px 1fr; gap: 26px; align-items: start; }
.hilfe-inhalt { position: sticky; top: 92px; max-height: calc(100vh - 110px); overflow: auto; font-size: 14px; border-right: 1px solid var(--linie); padding-right: 12px; }
.hilfe-inhalt .gruppe { margin: 12px 0 4px; font-size: 12px; text-transform: uppercase; letter-spacing: .04em; color: var(--grau); }
.hilfe-inhalt a { display: block; padding: 3px 0 3px 8px; color: var(--text); text-decoration: none; border-left: 3px solid transparent; }
.hilfe-inhalt a:hover { border-left-color: var(--rot); background: var(--flaeche); }
.hilfe-themen { max-width: 860px; }
.hilfe-gruppe { font-size: 13px; text-transform: uppercase; letter-spacing: .05em; color: var(--rot); margin: 26px 0 8px; }
.hilfe-thema { border: 1px solid var(--linie); border-radius: 8px; padding: 14px 18px 12px; margin: 0 0 14px; scroll-margin-top: 100px; }
.hilfe-thema h3 { font-size: 18px; margin: 0 0 8px; }
.hilfe-thema ol, .hilfe-thema ul { margin: 0 0 10px; padding-left: 22px; }
.hilfe-thema li { margin: 3px 0; }
.hilfe-liste dt { font-weight: 600; margin-top: 8px; }
.hilfe-liste dd { margin: 2px 0 0 0; padding-left: 14px; border-left: 3px solid var(--linie); }
.hilfe-tipp { background: #EEF4FB; border-left: 4px solid var(--blau); padding: 8px 12px; border-radius: 4px; }
.hilfe-wichtig { background: #FFF6E5; border-left: 4px solid var(--gelb); padding: 8px 12px; border-radius: 4px; }
.hilfe-video { display: inline-block; margin-top: 4px; font-weight: 600; color: var(--rot); text-decoration: none; }
.hilfe-video:hover { text-decoration: underline; }
.hilfe-thema mark { background: #FFE58A; padding: 0 1px; border-radius: 2px; }
.hilfe-thema.treffer { border-color: var(--rot); box-shadow: 0 0 0 2px rgba(200,0,26,.08); }
@media screen and (max-width: 900px) { .hilfe-rahmen { grid-template-columns: 1fr; } .hilfe-inhalt { display: none; } }
.video-rahmen { display: grid; grid-template-columns: minmax(0, 1fr) 300px; gap: 20px; align-items: start; }
.video-buehne video { width: 100%; background: #000; border-radius: 8px; display: block; aspect-ratio: 16 / 9; }
.video-knoepfe { margin: 10px 0; }
.video-knoepfe .knopf.an { background: var(--text); color: #FFFFFF; }
.video-kapitel { border: 1px solid var(--linie); border-radius: 8px; max-height: calc(100vh - 140px); overflow: auto; }
.video-kapitel .nav-titel { margin: 10px 14px 6px; }
.video-kapitel button { display: grid; grid-template-columns: 26px 1fr auto; gap: 8px; width: 100%; text-align: left; background: none; border: 0; border-left: 3px solid transparent; padding: 8px 12px; font: inherit; font-size: 14px; cursor: pointer; color: var(--text); }
.video-kapitel button:hover { background: var(--flaeche); }
.video-kapitel button.an { background: #FFF1F2; border-left-color: var(--rot); font-weight: 600; }
.video-kapitel .nr { color: var(--grau); }
.video-kapitel .zeit { color: var(--grau); font-variant-numeric: tabular-nums; }
@media screen and (max-width: 1000px) { .video-rahmen { grid-template-columns: 1fr; } }
/* Zurück zur Seite davor */
.zurueck-knopf { display: inline-block; margin: 0 0 10px; text-decoration: none; }
.zurueck-knopf[hidden] { display: none; }
/* Versionsnummer, Fragen & Support, Schulung (Karsten, 03.10.2026) */
.kopf .version { margin-right: auto; font-size: 12px; padding: 1px 8px; border: 1px solid rgba(255,255,255,.45); border-radius: 9px; color: #FFFFFF; opacity: .9; white-space: nowrap; }
.nav a.hilfe-link + a.hilfe-link { margin-top: 0; border-top: 0; padding-top: 7px; }
.support-paar { margin-bottom: 14px; }
[data-schulung-stand].fertig { color: var(--gruen); font-weight: 600; }

/* Dokumente zum Bearbeiten (Karsten, 03.10.2026) */
.dokument-kopf { align-items: center; }
.dokument-titel { font-size: 20px; font-weight: 600; flex: 1; min-width: 240px; max-width: 640px; }
.dokument-werkzeuge { position: sticky; top: 0; z-index: 5; background: #FFFFFF; padding: 6px 0; border-bottom: 1px solid var(--linie); margin-bottom: 10px; flex-wrap: wrap; }
.dokument { background: #FFFFFF; border: 1px solid var(--linie); border-radius: 6px; padding: 24px 28px; max-width: 1000px; min-height: 60vh; line-height: 1.5; outline: none; overflow-wrap: anywhere; }
.dokument:focus { border-color: var(--blau); }
.dokument h1 { font-size: 24px; margin: 0 0 12px; }
.dokument h2 { font-size: 19px; margin: 22px 0 8px; border-bottom: 1px solid var(--linie); padding-bottom: 3px; }
.dokument h3 { font-size: 16px; margin: 16px 0 6px; }
.dokument table { border-collapse: collapse; width: 100%; margin: 8px 0 14px; font-size: 14px; }
.dokument th, .dokument td { border: 1px solid var(--linie); padding: 4px 7px; text-align: left; vertical-align: top; }
.dokument th { background: var(--flaeche); }
.dokument mark { background: #FFF3A0; }
.dokument section[data-auto] { border-left: 3px solid var(--blau); padding-left: 12px; margin: 14px 0; }
.dokument-teilnehmer { max-width: 1000px; margin-top: 14px; border: 1px solid var(--linie); border-radius: 6px; padding: 8px 14px 12px; }
.dokument-teilnehmer legend { font-weight: 600; padding: 0 4px; }
.dokument-teilnehmer .knopfzeile { flex-wrap: wrap; gap: 6px 16px; margin-bottom: 10px; }
@media print {
    .dokument-teilnehmer { display: none !important; }
    .kopf, .nav, .menu-knopf, .zurueck-knopf, .dokument-werkzeuge, .dokument-kopf .knopfzeile, .meldung, .fehler { display: none !important; }
    /* Die allgemeine Druckregel blendet jedes form aus – das Dokument steht aber in einem form (06.10.2026: leere Seite). */
    form[data-dokument] { display: block !important; }
    .dokument-kopf { display: none !important; }
    .dokument { border: 0; padding: 0; max-width: none; min-height: 0; }
    .dokument-titel { border: 0; }
    .dokument section[data-auto] { border-left: 0; padding-left: 0; }
    body, .rahmen, .inhalt { background: #FFFFFF; display: block; padding: 0; margin: 0; }
}

/* KI im Notdienst (04.10.2026): Kurzinfo, Fehlerhilfe, Bericht aus Stichworten */
.nd-kurzinfo { margin: 6px 0 8px; padding: 8px 10px; border-radius: 6px; background: #EEF3FB; color: #1C3B66; border: 1px solid #C9D8EE; }
.nd-kurzinfo > div { white-space: pre-line; margin-top: 3px; }
.nd-auftraggeber { margin: 6px 0 8px; padding: 8px 10px; border-radius: 6px; background: #F4F1EA; color: #4A3B1C; border: 1px solid #E2D8C2; }
.nd-hilfe { margin-top: 10px; }
.nd-hilfe summary { cursor: pointer; font-weight: 600; padding: 4px 0; }
.nd-hilfe textarea, textarea[name="notiz"] { min-height: 60px; }
.nd-ki-antwort { white-space: pre-line; margin-top: 6px; padding: 8px 10px; border-radius: 6px; background: var(--flaeche); border: 1px solid var(--linie); }
.nd-bericht { margin-top: 6px; }

/* Neukunden-Formular für Kunden (04.10.2026) */
.karte-breit { max-width: 760px; }
body.kunde { padding-top: 3vh; }
.nk-abschnitt { border-top: 1px solid var(--linie); margin-top: 16px; padding-top: 10px; }
.nk-abschnitt h2 { margin: 0 0 8px; font-size: 18px; }
.nk-raster { display: grid; grid-template-columns: repeat(auto-fit, minmax(200px, 1fr)); gap: 6px 14px; }
.nk-wahl { display: flex; flex-wrap: wrap; gap: 6px 16px; margin: 4px 0 8px; }
.nk-wahl label { display: flex; align-items: center; gap: 6px; font-weight: normal; }
.nk-haken { display: flex; gap: 8px; align-items: flex-start; margin: 8px 0; }
.nk-haken input { margin-top: 3px; flex: 0 0 auto; width: 20px; height: 20px; }
.nk-pflicht { color: var(--rot); font-weight: 700; }
.nk-text { font-size: 13px; line-height: 1.45; }
.nk-unterschrift { border: 2px dashed var(--linie); border-radius: 6px; background: #FFFFFF; width: 100%; height: 180px; touch-action: none; display: block; }
.nk-fehler { background: #FDECEC; border: 1px solid #E8A3A3; color: #8A1C1C; padding: 8px 12px; border-radius: 6px; margin: 10px 0; }
@media print {
  body.kunde { padding: 0; background: #FFFFFF; }
  .karte-mitte { border: 0; max-width: none; padding: 0; }
  .nk-nicht-drucken { display: none !important; }
  .nk-unterschrift { border: 1px solid #000; }
  input, select, textarea { border: 0 !important; border-bottom: 1px solid #000 !important; border-radius: 0 !important; }
}
@media print { [data-nk-liegenschaft] { display: grid !important; } }
.nk-ticket { margin: 10px 0; }
.knopf.nk-knopf { background: #1C3B66; border-color: #1C3B66; color: #FFFFFF; }
.knopf.nk-knopf:disabled { opacity: .45; cursor: not-allowed; }

/* ---------------------------------------------------------------------------------------------
   Handwerkerprogramm (Karsten, 05.10.2026): Modulleiste, Masken mit Titelzeile, Werkzeugleiste,
   Reitern und kleinen Unterfenstern – Aufbau wie TAIFUN, Optik wie das Ticketsystem.
   --------------------------------------------------------------------------------------------- */
.nav a.hw-nav { font-weight: 600; }
.hw-leiste { display: flex; flex-wrap: wrap; align-items: center; gap: 4px; padding: 6px; margin: 0 0 14px; background: var(--flaeche); border: 1px solid var(--linie); border-radius: 6px; }
.hw-leiste a { padding: 5px 10px; border-radius: 4px; color: var(--text); text-decoration: none; font-size: 14px; }
.hw-leiste a:hover { background: #FFFFFF; }
.hw-leiste a.an { background: var(--text); color: #FFFFFF; }
.hw-leiste a.bald { color: var(--grau); }
.hw-leiste a.hw-start { font-weight: 700; }
.hw-ki-suche { display: flex; gap: 6px; margin-left: auto; flex: 1 1 320px; max-width: 520px; }
.hw-ki-suche input { flex: 1; min-width: 0; }
.hw-kacheln { display: grid; grid-template-columns: repeat(auto-fill, minmax(240px, 1fr)); gap: 12px; max-width: 1100px; }
.hw-kachel { display: flex; flex-direction: column; gap: 4px; padding: 14px 16px; border: 1px solid var(--linie); border-radius: 6px; color: var(--text); text-decoration: none; background: #FFFFFF; }
.hw-kachel:hover { border-color: var(--text); }
.hw-kachel b { font-size: 16px; }
.hw-kachel span { font-size: 13px; color: var(--grau); }
.hw-kachel small { margin-top: 4px; font-size: 12px; color: var(--blau); }
.hw-kachel.bald { background: var(--flaeche); }
.hw-kachel.bald small { color: var(--grau); }
.hw-maske { border: 1px solid var(--linie); border-radius: 6px; background: #FFFFFF; max-width: 1200px; }
.hw-titel { padding: 7px 12px; background: var(--text); color: #FFFFFF; font-weight: 600; border-radius: 6px 6px 0 0; display: flex; gap: 10px; align-items: center; }
.hw-modus { margin-left: auto; font-size: 12px; font-weight: 600; padding: 2px 8px; border-radius: 10px; background: var(--rot); }
.hw-modus.lesen { background: #5A6068; }
.hw-werkzeug { display: flex; flex-wrap: wrap; gap: 6px; align-items: center; padding: 8px 12px; border-bottom: 1px solid var(--linie); background: var(--flaeche); }
.hw-werkzeug form.inline { display: inline; margin: 0; }
.hw-trenner { width: 1px; align-self: stretch; background: var(--linie); margin: 0 4px; }
.hw-suche { display: flex; flex-wrap: wrap; gap: 8px; align-items: center; padding: 10px 12px; border-bottom: 1px solid var(--linie); }
.hw-suche input, .hw-suche select, .hw-ki-suche input { width: auto; }
.hw-suche input[name=q] { flex: 1 1 280px; }
.hw-maske > .leer, .hw-maske > p.klein { padding: 0 12px; }
.hw-reiter { display: flex; flex-wrap: wrap; gap: 2px; padding: 8px 12px 0; border-bottom: 1px solid var(--linie); }
.hw-reiter a, .hw-reiter span { padding: 6px 12px; border: 1px solid transparent; border-bottom: 0; border-radius: 5px 5px 0 0; color: var(--text); text-decoration: none; font-size: 14px; }
.hw-reiter a.an { border-color: var(--linie); background: #FFFFFF; font-weight: 600; margin-bottom: -1px; }
.hw-reiter a:not(.an):hover { background: var(--flaeche); }
.hw-reiter .bald { color: var(--grau); cursor: default; }
.hw-seite { padding: 12px; }
.hw-felder { display: grid; grid-template-columns: repeat(auto-fit, minmax(210px, 1fr)); gap: 2px 16px; }
.hw-felder .feld { margin: 0 0 8px; }
.hw-felder label { font-size: 12px; color: var(--grau); }
.hw-wert { min-height: 30px; padding: 5px 8px; border: 1px solid var(--linie); border-radius: 4px; background: var(--flaeche); }
.hw-wert.geaendert { background: #FFF4D6; border-color: #E0B44C; }
.hw-fuss { display: flex; flex-wrap: wrap; gap: 8px; align-items: center; padding-top: 8px; margin-top: 4px; border-top: 1px solid var(--linie); }
.hw-raster tr[data-href] { cursor: pointer; }
.hw-raster tr.gewaehlt td, .hw-raster tr:focus td { background: #E7EEF8; outline: none; }
.hw-fenster { margin: 12px; border: 1px solid var(--text); border-radius: 6px; box-shadow: 0 6px 24px rgba(0,0,0,.15); background: #FFFFFF; max-width: 760px; }
.hw-fenster-titel { display: flex; justify-content: space-between; padding: 6px 10px; background: var(--text); color: #FFFFFF; font-weight: 600; border-radius: 5px 5px 0 0; }
.hw-fenster-titel a { color: #FFFFFF; text-decoration: none; }
.hw-fenster form { padding: 10px 12px; }
.hw-baum { padding: 3px 0; }
.hw-ki { margin: 10px 12px 0; padding: 10px 12px; border: 1px solid #B9CDEA; border-radius: 6px; background: #F1F6FD; }
@media screen and (max-width: 700px) {
  .hw-ki-suche { max-width: none; margin-left: 0; }
  .hw-raster th:nth-child(n+5), .hw-raster td:nth-child(n+5) { display: none; }
}
/* Sprachnachrichten (Anrufbeantworter) direkt abspielen – Karsten, 05.10.2026. */
.anhang-ton { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; }
.anhang-ton audio { width: 340px; max-width: 100%; height: 40px; }

/* Handwerk – Positionsfenster (H2) */
.hw-pos td.r, .hw-pos th.r, .liste .r { text-align: right; white-space: nowrap; }
.hw-pos tr.hw-pos-titel td { background: var(--flaeche); font-weight: 700; }
.hw-pos tr.hw-pos-text td { font-style: italic; color: var(--grau); }
.hw-pos tr.hw-pos-neben td { color: var(--grau); }
.hw-ki-marke { display: inline-block; margin-left: 6px; padding: 0 5px; border-radius: 3px; background: #DCE8F8; color: var(--blau); font-size: 11px; font-weight: 700; vertical-align: middle; }
.hw-hinweis { font-size: 12px; color: #6B4A00; background: #FFF4D6; border-radius: 3px; padding: 1px 6px; margin-top: 3px; display: inline-block; }
.hw-summe { display: flex; flex-wrap: wrap; gap: 6px 22px; align-items: baseline; justify-content: flex-end; padding: 10px 12px; margin-top: 6px; background: var(--flaeche); border: 1px solid var(--linie); border-radius: 6px; }
.hw-summe .gesamt b { font-size: 17px; }
.hw-summe .klein { flex-basis: 100%; text-align: right; }
.hw-einfuegen { display: flex; flex-wrap: wrap; gap: 6px; align-items: center; padding: 10px 0; }
.hw-einfuegen form.inline { display: inline-flex; gap: 6px; align-items: center; margin: 0; }
.hw-einfuegen input, .hw-einfuegen select { width: auto; }
.hw-ki summary { cursor: pointer; }
.hw-ki textarea { width: 100%; margin: 6px 0; }
/* Handwerk – TAIFUN-Angleich Verkauf (05.10.2026): Gültigkeit, Festpreis, Textbausteine, „Aus Angebot …“. */
.hw-abgelaufen { color: var(--rot); font-weight: 600; }
.hw-schloss { display: flex; align-items: center; gap: 6px; min-height: 34px; font-size: 14px; color: var(--text); }
.hw-schloss input { width: auto; }
.hw-baustein { display: flex; flex-wrap: wrap; gap: 6px; align-items: center; margin: 2px 0 6px; }
.hw-baustein select { width: auto; }
.hw-textbaustein { margin: 0 0 12px; padding: 10px 12px; box-shadow: none; border-color: var(--linie); }
.hw-textbaustein.aus { opacity: .6; }
.hw-quelle { margin: 10px 0 4px; padding: 8px 10px; background: var(--flaeche); border: 1px solid var(--linie); border-radius: 6px; }

/* ---------- Handwerk: Adressmaske wie TAIFUN (H1 eigene Datenhaltung, 05.10.2026) ----------
   Kopfbereich, Gruppen-Kästen mit blauer Überschrift, Registerkarten unten, Fußleiste, Menüleiste, Unterfenster. */
.hw-adresse { background: #E9F0F7; max-width: 1280px; }
.hw-marke { font-size: 12px; font-weight: 600; padding: 1px 8px; border-radius: 10px; background: #5A6068; color: #FFFFFF; }
.hw-marke.rot { background: var(--rot); }
.hw-menue { display: flex; flex-wrap: wrap; gap: 2px; align-items: center; padding: 2px 8px; background: #FFFFFF; border-bottom: 1px solid var(--linie); font-size: 14px; }
.hw-menue details { position: relative; }
.hw-menue summary { list-style: none; cursor: pointer; padding: 4px 9px; border-radius: 4px; user-select: none; }
.hw-menue summary::-webkit-details-marker { display: none; }
.hw-menue summary:hover, .hw-menue details[open] > summary { background: #DCE8F8; }
.hw-menue > .aus { padding: 4px 9px; color: #9AA0A8; }
.hw-menue-liste { position: absolute; z-index: 30; top: 100%; left: 0; min-width: 240px; max-height: 70vh; overflow: auto; background: #FFFFFF; border: 1px solid #9AA0A8; box-shadow: 0 6px 18px rgba(0,0,0,.18); padding: 4px 0; }
.hw-menue-liste a, .hw-menue-liste span, .hw-menue-liste button { display: flex; justify-content: space-between; gap: 14px; width: 100%; padding: 4px 14px 4px 28px; color: var(--text); text-decoration: none; background: none; border: 0; font: inherit; text-align: left; cursor: pointer; white-space: nowrap; }
.hw-menue-liste a:hover, .hw-menue-liste button:hover { background: #DCE8F8; }
.hw-menue-liste .aus { color: #9AA0A8; cursor: default; }
.hw-menue-liste small { font-size: 11px; color: #9AA0A8; }
.hw-menue-liste hr { border: 0; border-top: 1px solid var(--linie); margin: 3px 0; }
.hw-menue-rechts { margin-left: auto; }
.hw-menue-rechts form { margin: 0; }
.hw-probe { margin: 8px 8px 0; padding: 6px 10px; font-size: 13px; background: #FFF4D6; border: 1px solid #E0B44C; border-radius: 4px; color: #6B4A00; }
.hw-adresse > .hw-ki { margin: 8px 8px 0; background: #FFFFFF; }
.hw-kopf { display: flex; flex-wrap: wrap; gap: 4px 28px; align-items: flex-start; margin: 8px; padding: 8px 12px 5px; background: #FFFFFF; border-radius: 6px; }
.hw-kopf .hw-gruppe { padding: 0; margin: 0; flex: 0 1 330px; }
.hw-kopf .hw-gruppe.hw-suche-frei { flex: 1 1 460px; }
.hw-kopf-hinweis { align-self: center; flex: 1 1 280px; }
/* H1 Paket 1a: Meldungsfenster wie TAIFUN („6000-1 …“, „Adresse löschen?“) und die Konstanten-Seite (Baum links, Gruppen rechts). */
dialog.hw-meldung { max-width: 460px; padding: 16px 18px 12px; border: 1px solid #9AA0A8; border-radius: 6px; box-shadow: 0 8px 24px rgba(0,0,0,.25); }
dialog.hw-meldung p { margin: 0 0 14px; white-space: pre-line; }
dialog.hw-meldung > div { display: flex; justify-content: flex-end; gap: 8px; }
/* H1 Paket 2 – P15: Fenster „Straße auswählen“ (Foto 033) und Land-Auswahlliste „ISO · Land“ (Foto 034). */
dialog.hw-strassenwahl { width: 520px; max-width: calc(100vw - 32px); padding: 0 0 10px; }
.hw-strassenwahl-titel { padding: 8px 12px; font-size: 14px; border-bottom: 1px solid var(--linie); }
.hw-strassenwahl-liste { max-height: 300px; overflow: auto; margin: 0 0 10px; outline: none; }
.hw-strassenwahl table, .hw-landliste table { width: 100%; border-collapse: collapse; font-size: 14px; }
.hw-strassenwahl th, .hw-landliste th { position: sticky; top: 0; background: #1F5FA8; color: #FFFFFF; font-weight: 400; text-align: left; padding: 3px 8px; }
.hw-strassenwahl td, .hw-landliste td { padding: 3px 8px; border-bottom: 1px solid #E3E8EE; white-space: nowrap; cursor: default; }
.hw-strassenwahl .r { text-align: right; width: 44px; }
.hw-strassenwahl tr.an td, .hw-landliste tr.an td { background: #B3DBF7; }
dialog.hw-strassenwahl > div:last-child { padding: 0 12px; }
dialog.hw-strassenwahl > .hw-strassenwahl-titel, dialog.hw-strassenwahl > .hw-strassenwahl-liste { display: block; }
.hw-landliste { position: absolute; z-index: 1000; width: 340px; max-width: calc(100vw - 32px); max-height: 200px; overflow: auto; background: #FFFFFF; border: 1px solid #9AA0A8; box-shadow: 0 6px 18px rgba(0,0,0,.2); }
.hw-landliste td:first-child, .hw-landliste th:first-child { width: 36px; }
.hw-landliste tr:hover td { background: #DCE8F8; }
.hw-konst { display: flex; flex-wrap: wrap; gap: 8px; padding: 8px; }
.hw-konst-baum { flex: 0 0 220px; background: #FFFFFF; border-radius: 6px; padding: 8px 10px; font-size: 14px; }
.hw-konst-baum ul { list-style: none; margin: 0; padding-left: 16px; }
.hw-konst-baum > ul { padding-left: 0; }
.hw-konst-baum a.an { font-weight: 600; background: #DCE8F8; }
.hw-konst-rechts { flex: 1 1 520px; min-width: 0; max-width: 820px; }
.hw-konst-rechts .hw-zeile { grid-template-columns: minmax(0, 400px) minmax(0, 1fr); }
@media screen and (max-width: 640px) { .hw-konst-rechts .hw-zeile > label { white-space: normal; } }
/* H1 Paket 1b: Rechtsklick-Menü der Fußleiste (Foto 177). */
.hw-fussleiste { position: relative; }
.hw-fuss-kontext { position: absolute; bottom: 100%; z-index: 30; min-width: 190px; background: #FFFFFF; border: 1px solid #9AA0A8; border-radius: 4px; box-shadow: 0 6px 18px rgba(0,0,0,.2); padding: 4px 0; }
.hw-fuss-kontext a { display: block; padding: 5px 14px; color: inherit; text-decoration: none; white-space: nowrap; }
.hw-fuss-kontext a:hover, .hw-fuss-kontext a:focus { background: #DCE8F8; outline: none; }
.hw-seiten { min-height: 440px; }
.hw-adresse .hw-seite { padding: 0 8px; }
.hw-adresse .hw-seite h3 { margin: 4px 0 6px; font-size: 16px; color: var(--blau); }
.hw-spalten { display: grid; grid-template-columns: minmax(330px, 420px) minmax(0, 1fr); gap: 8px; align-items: start; }
.hw-spalten.gleich { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.hw-gruppe { border: 0; border-radius: 6px; background: #FFFFFF; margin: 0 0 8px; padding: 6px 12px 10px; min-width: 0; }
.hw-gruppe legend { float: left; width: 100%; padding: 0; margin: 0 0 6px; color: var(--blau); font-size: 16px; font-weight: 600; }
.hw-gruppe legend + * { clear: both; }
.hw-gruppe p.klein { margin: 6px 0 0; }
.hw-zeile { display: grid; grid-template-columns: 106px minmax(0, 1fr); gap: 6px; align-items: center; margin-bottom: 3px; }
.hw-spalten.gleich .hw-zeile { grid-template-columns: 134px minmax(0, 1fr); }
.hw-zeile.breit, .hw-spalten.gleich .hw-zeile.breit { grid-template-columns: 236px minmax(0, 1fr); }
.hw-spalten.gleich .hw-zeile.ohne { grid-template-columns: minmax(0, 1fr); }
.hw-zeile.ohne { grid-template-columns: minmax(0, 1fr); }
.hw-zeile > label { margin: 0; font-size: 13.5px; font-weight: 600; color: var(--text); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.hw-zeile > label a { color: inherit; }
.hw-zelle { display: flex; gap: 4px; align-items: center; min-width: 0; }
.hw-zelle > * { flex: 1 1 auto; min-width: 0; }
.hw-zelle > .kurz { flex: 0 0 66px; }
.hw-zelle > .mittel { flex: 0 0 124px; }
.hw-zelle > .plz { flex: 0 0 62px; }
.hw-zelle > .land { flex: 0 0 58px; }   /* H1 Paket 2: „DE ▼“ ganz lesbar (Foto 034) */
.hw-zelle > .datum { flex: 0 0 150px; }
.hw-zelle > .zeit { flex: 0 0 104px; }
.hw-zelle > .hw-zwischen { flex: 0 0 auto; font-size: 13.5px; font-weight: 600; padding: 0 4px 0 14px; }
.hw-adresse .hw-wert, .hw-schleier .hw-wert { min-height: 25px; padding: 2px 6px; border: 0; border-radius: 2px; background: #DFEAF6; font-size: 14px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.hw-adresse .hw-wert.mehr, .hw-schleier .hw-wert.mehr { white-space: pre-wrap; overflow: auto; overflow-wrap: anywhere; }
.hw-wert.anrede { min-height: 44px; }
.hw-adresse .hw-wert.kartei { min-height: 448px; max-height: 640px; background: #FFFFFF; border: 1px solid var(--linie); font-family: Arial, sans-serif; }
.hw-adresse .hw-wert.text, .hw-schleier .hw-wert.text { min-height: 150px; background: #FFFFFF; border: 1px solid var(--linie); }
.hw-wert.r, .hw-adresse input.r, .hw-schleier input.r { text-align: right; }
.hw-adresse input[type=text], .hw-adresse input[type=date], .hw-adresse input[type=time], .hw-adresse input[type=search], .hw-adresse select, .hw-adresse textarea,
.hw-schleier input[type=text], .hw-schleier input[type=date], .hw-schleier input[type=time], .hw-schleier select, .hw-schleier textarea {
  width: 100%; min-height: 26px; padding: 2px 6px; font: inherit; font-size: 14px; border: 1px solid #9DB7D3; border-radius: 2px; background: #FFFFFF; }
.hw-adresse input:focus, .hw-adresse select:focus, .hw-adresse textarea:focus, .hw-schleier input:focus, .hw-schleier select:focus, .hw-schleier textarea:focus { background: #FFF9C4; }
input.gross { text-transform: uppercase; }
.hw-adresse textarea.kartei { min-height: 448px; }
textarea.anrede { min-height: 44px; }
.hw-schleier textarea.text, .hw-adresse textarea.text { min-height: 150px; }
.hw-unten { position: sticky; bottom: 0; z-index: 20; border-radius: 0 0 6px 6px; box-shadow: 0 -3px 8px rgba(28,31,36,.10); }
body:has(.neuigkeiten) .hw-unten .hw-fussleiste { padding-right: 150px; }
.hw-reiter.unten { border-bottom: 0; padding: 0 8px 6px; background: #D5E3F2; gap: 2px; margin-top: 4px; }
.hw-reiter.unten a, .hw-reiter.unten span { border: 0; border-radius: 0 0 5px 5px; background: var(--blau); color: #FFFFFF; padding: 4px 9px; margin: 0; font-size: 13.5px; white-space: nowrap; }
.hw-reiter.unten a.an { background: #FFFFFF; color: var(--blau); font-weight: 600; margin: 0; box-shadow: 0 2px 3px rgba(0,0,0,.2); }
.hw-reiter.unten a:not(.an):hover { background: #17497F; }
.hw-reiter.unten .bald { background: #9DB7D3; color: #EAF1F8; }
.hw-reiter.unten a.wichtig { font-weight: 700; }   /* H1 Paket 5 – P20: Kennzeichen fett (TAIFUN) statt Zahl/rotem Reiter */
.hw-fussleiste { margin: 0; padding: 6px 8px; background: #FFFFFF; border-top: 1px solid var(--linie); border-radius: 0 0 6px 6px; justify-content: flex-end; }
.hw-fussleiste form.inline { display: inline; margin: 0; }
.hw-status { margin-right: auto; }
.knopf.aus { color: #B5BAC0; border-color: var(--linie); cursor: default; }
.knopf.aus:hover { background: #FFFFFF; }
.hw-listenkopf { display: flex; flex-wrap: wrap; gap: 8px; align-items: center; padding: 2px 0 8px; }
.hw-listenkopf form.inline { margin: 0; }
.hw-adresse input.hw-filter { max-width: 260px; margin-left: auto; background: #FFF9C4; }
.hw-adresse .hw-seite > table.liste, .hw-adresse > div > table.liste, .hw-schleier .hw-fenster > table.liste { background: #FFFFFF; }
.hw-adresse .hw-seite > .leer, .hw-adresse .hw-seite > .eintrag { background: #FFFFFF; padding: 10px 12px; border-radius: 6px; }
#hw-baum { background: #FFFFFF; border-radius: 6px; padding: 6px 10px; }
.hw-baum { padding: 3px 0; }
.hw-baum.wurzel { color: var(--blau); margin-top: 4px; }
.hw-punkt { display: inline-block; width: 10px; height: 10px; border-radius: 50%; background: #9AA0A8; margin-right: 6px; }
.hw-baum-knoepfe { margin-left: 10px; font-size: 12px; visibility: hidden; white-space: nowrap; }
.hw-baum:hover .hw-baum-knoepfe, .hw-baum:focus-within .hw-baum-knoepfe { visibility: visible; }
.hw-baum-knoepfe a, .hw-baum-knoepfe button.link { color: var(--blau); margin-left: 7px; font-size: 12px; }
.hw-baum-knoepfe form.inline { display: inline; margin: 0; }
.hw-wichtig { display: grid; grid-template-columns: 220px minmax(0, 1fr); gap: 8px; align-items: start; }
.hw-kategorien { background: #FFFFFF; border-radius: 6px; padding: 6px 0; display: flex; flex-direction: column; }
.hw-kategorien a { padding: 4px 12px; color: var(--text); text-decoration: none; }
.hw-kategorien a.an { background: #DCE8F8; font-weight: 600; }
.hw-kategorien a.voll { font-weight: 700; }
.hw-wichtig form { background: #FFFFFF; border-radius: 6px; padding: 10px 12px; margin: 0; }
.hw-wichtig textarea { min-height: 300px; margin-bottom: 8px; }
.hw-unter-gruppe { margin: 4px 0 10px; }
.hw-wichtig .hw-unter-gruppe { margin: 8px 0 0; }
form.hw-unter-gruppe { margin: -2px 0 8px; padding: 0 12px; }
.hw-haken { display: inline-flex; gap: 6px; align-items: center; margin: 0 auto 0 0; font-size: 13.5px; color: var(--text); }
.hw-haken input { width: auto; }
.hw-still td { color: var(--grau); }
.hw-suchmaske { margin: 0; }
.hw-adresse > .leer, .hw-adresse > p.klein { padding: 4px 12px; }
.hw-adresse > div > table.liste { margin: 0; }
.hw-schleier { position: fixed; inset: 0; z-index: 60; background: rgba(28,31,36,.45); display: flex; align-items: flex-start; justify-content: center; overflow: auto; padding: 5vh 12px; }
.hw-schleier .hw-fenster { margin: 0; width: 100%; max-width: 580px; background: #E9F0F7; }
.hw-schleier .hw-fenster.breit { max-width: 1000px; }
.hw-schleier .hw-fenster form { padding: 8px 8px 0; margin: 0; }
.hw-schleier .hw-fenster > .fehler { margin: 8px; }
.hw-schleier .hw-fenster > .leer, .hw-schleier .hw-fenster > p.klein { margin: 8px; padding: 8px 12px; background: #FFFFFF; border-radius: 6px; }
.hw-schleier .hw-fenster > table.liste { margin: 8px; width: calc(100% - 16px); }
.hw-schleier .hw-fuss { padding: 8px; margin: 0 -8px; background: #FFFFFF; justify-content: flex-end; border-radius: 0 0 6px 6px; }
.hw-schleier .hw-fenster > .hw-fuss { margin: 0; }
.hw-schleier form p.klein { margin: 0 4px 8px; }
.hw-schleier form.hw-fenster-neben { position: relative; margin-top: -42px; padding: 0 8px 8px; width: fit-content; }
.hw-alt { color: var(--grau); }
.hw-wichtig-beleg { max-width: 1200px; }
@media screen and (max-width: 900px) {
  .hw-spalten, .hw-spalten.gleich, .hw-wichtig { grid-template-columns: minmax(0, 1fr); }
  .hw-zeile.breit { grid-template-columns: 150px minmax(0, 1fr); }
}
@media print {
  body:has(.hw-adresse) .kopf, body:has(.hw-adresse) .nav, body:has(.hw-adresse) .hw-leiste, .hw-adresse .hw-menue, .hw-adresse .hw-fussleiste, .hw-adresse .hw-reiter,
  .hw-adresse .hw-listenkopf, .hw-adresse .hw-baum-knoepfe, .hw-adresse [data-hw-seite="tickets"], .hw-adresse [data-hw-seite="belege"], .hw-adresse form.hw-unter-gruppe { display: none !important; }
  body:has(.hw-adresse) .rahmen { display: block; }
  body:has(.hw-adresse) .inhalt { padding: 0; }
  .hw-adresse { background: #FFFFFF; border: 0; max-width: none; }
  .hw-adresse .hw-seite[hidden] { display: block !important; }
  .hw-adresse .hw-seite { break-inside: avoid; margin-bottom: 6px; }
  .hw-adresse .hw-wert.kartei { min-height: 0; max-height: none; }
  .hw-gruppe { border: 1px solid #C8CDD3; }
}
/* H1 Paket 3: Fenster Ansprechpartner/Kontakt – Menüleiste, Reiter unten, Selektion (30 Kästchen), Erledigen/Löschen, „Erinnerungs Datum“. */
.hw-fenster-menue { border-bottom: 1px solid var(--linie); }
.hw-fenster-reiter { display: flex; gap: 2px; margin: 6px 8px 0; }
.hw-fenster-reiter button, .hw-fenster-reiter a { padding: 3px 12px; border: 0; border-radius: 3px 3px 0 0; background: #1F5FA8; color: #FFFFFF; font: inherit; font-size: 13px; cursor: pointer; }
.hw-fenster-reiter button.an, .hw-fenster-reiter a.an { background: #FFFFFF; color: #1F5FA8; font-weight: 600; box-shadow: inset 0 -2px 0 #1F5FA8; }
.hw-wv-knoepfe { display: flex; gap: 6px; flex-wrap: wrap; }
.hw-wv-knoepfe form { margin: 0; }
.hw-selektion { display: grid; grid-template-columns: repeat(30, minmax(0, 1fr)); gap: 2px; }
.hw-selektion span { min-height: 18px; background: #E3ECF7; font-family: Consolas, monospace; font-size: 12px; text-align: center; line-height: 18px; }
dialog.hw-erinnerung { width: 380px; max-width: calc(100vw - 32px); padding: 0 0 10px; }
dialog.hw-erinnerung > .hw-erinnerung-titel { display: block; padding: 8px 12px; font-size: 14px; border-bottom: 1px solid var(--linie); }
dialog.hw-erinnerung .hw-gruppe { margin: 8px 12px; }
dialog.hw-erinnerung > .hw-erinnerung-fuss { padding: 0 12px; }
@media screen and (max-width: 640px) { .hw-selektion { grid-template-columns: repeat(15, minmax(0, 1fr)); } }
/* H1 Paket 4 – P01/P80: Suchmaske „Adresse suchen“ und Auswahldialog wie TAIFUN (Fotos 009, 049, 145): Suchfelder dunkler, alle anderen Felder hell und leer. */
.hw-adresse input.hw-suchfeld, .hw-adresse select.hw-suchfeld, .hw-wahl input.hw-suchfeld { background: #B5DCF6; border: 1px solid #8DC3EA; border-radius: 2px; min-height: 25px; padding: 2px 6px; font-size: 14px; }
.hw-adresse input.hw-suchfeld:focus, .hw-adresse select.hw-suchfeld:focus, .hw-wahl input.hw-suchfeld:focus { background: #FFF9C4; outline: 2px solid #1F5AA6; }
.hw-adresse .hw-wert.hw-such-hell, .hw-schleier .hw-wert.hw-such-hell { background: #EAF1F9; }
.hw-adresse .hw-wert.hw-such-hell.hw-rtf, .hw-wahl .hw-wert.kartei { min-height: 200px; }
.hw-wahl input.hw-suchfeld.land { flex: 0 0 48px; max-width: 48px; }
.hw-wahl input.hw-suchfeld.plz { flex: 0 0 76px; max-width: 76px; }
.hw-wahl-blatt { outline: none; }
.hw-wahl-blatt.gewaehlt { background: transparent; }
.hw-wahl-blatt-fuss { position: sticky; bottom: 0; background: var(--flaeche, #F3F7FC); }
/* H1 Paket 5 – P14: Karteikarte – Rechtsklick-Menü wie TAIFUN (Fotos 040–042), Fenster Schriftart/Tabulatoren/Zoom/Suchen/Ersetzen/Textblock,
   Lineal, Statuszeile (Foto 035), Formatierungszeichen. Dasselbe Menü nutzt der Verknüpfungsbaum (P40, Fotos 043/053). */
.hw-rtf-menue { position: fixed; z-index: 3000; min-width: 250px; padding: 3px 0; background: #FFFFFF; border: 1px solid #A9B8C8; box-shadow: 2px 3px 8px rgba(0,0,0,.25); font-size: 13px; }
.hw-rtf-menuepunkt { position: relative; display: grid; grid-template-columns: 22px 1fr auto; align-items: center; width: 100%; padding: 4px 10px 4px 6px; border: 0; background: transparent; font: inherit; color: var(--text); text-align: left; cursor: pointer; }
.hw-rtf-menuepunkt:hover, .hw-rtf-menuepunkt:focus { background: #DCE8F6; outline: none; }
.hw-rtf-menuepunkt.aus { color: #A0A6AD; cursor: default; }
.hw-rtf-menuepunkt.aus:hover { background: transparent; }
.hw-rtf-menuepunkt .haken { color: #1F5FA8; }
.hw-rtf-menuepunkt .kuerzel { margin-left: 28px; color: #4A5560; white-space: nowrap; }
.hw-rtf-untermenue { position: absolute; left: 100%; top: -4px; }
.hw-rtf-untermenue.links { left: auto; right: 100%; }
.hw-rtf-menue-trenner { height: 1px; margin: 3px 8px 3px 30px; background: #1F5FA8; }
.hw-rtf-dialog-schleier { position: fixed; inset: 0; z-index: 3100; display: flex; align-items: center; justify-content: center; background: rgba(20,30,45,.25); }
.hw-rtf-dialog { width: 440px; max-width: calc(100vw - 32px); max-height: calc(100vh - 32px); overflow: auto; background: #FFFFFF; border: 1px solid #A9B8C8; border-radius: 3px; box-shadow: 0 6px 24px rgba(0,0,0,.3); }
.hw-rtf-dialog-titel { padding: 8px 12px; border-bottom: 1px solid var(--linie); font-weight: 600; }
.hw-rtf-dialog-inhalt { display: grid; gap: 6px; padding: 10px 12px; }
.hw-rtf-dialog-zeile { display: grid; grid-template-columns: 170px minmax(0, 1fr); gap: 8px; align-items: center; font-size: 13px; }
.hw-rtf-dialog-knoepfe { display: flex; gap: 6px; flex-wrap: wrap; }
.hw-rtf-dialog-fuss { display: flex; gap: 6px; justify-content: flex-end; flex-wrap: wrap; padding: 8px 12px; border-top: 1px solid var(--linie); }
.hw-rtf-dialog-meldung { min-height: 1.2em; color: var(--rot); }
.hw-rtf-tabliste, .hw-rtf-textblockliste { width: 100%; }
.hw-rtf-vorschau { max-height: 170px; overflow: auto; padding: 4px 6px; border: 1px solid #C9D7E6; background: #FBFCFE; }
.hw-rtf-lineal { position: relative; height: 15px; margin: 0 6px; overflow: hidden; border-bottom: 1px solid #C9D7E6; font-size: 9px; color: #4A5560;
  background-image: repeating-linear-gradient(90deg, #9DB7D3 0, #9DB7D3 1px, transparent 1px, transparent 0.5cm); background-size: 100% 4px; background-repeat: repeat-x; background-position: 0 100%; }
.hw-rtf-lineal span { position: absolute; top: 0; transform: translateX(-50%); }
.hw-rtf-status { padding: 1px 6px; border-top: 1px solid #C9D7E6; background: #EEF3F9; color: #4A5560; font-size: 12px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.hw-rtf-zeichen div::after, .hw-rtf-zeichen li::after, .hw-rtf-zeichen p::after { content: "¶"; color: #8AA2BE; }
.hw-rtf ul, .hw-rtf ol { margin: 0; padding-left: 24px; }
@media screen and (max-width: 640px) { .hw-rtf-dialog-zeile { grid-template-columns: minmax(0, 1fr); } .hw-rtf-menue { min-width: 0; max-width: calc(100vw - 8px); } .hw-rtf-untermenue { position: static; box-shadow: none; } }
@media print { .hw-rtf-status, .hw-rtf-lineal { display: none !important; } }
/* H1 Paket 5 – P40: Verknüpfungsbaum wie TAIFUN (Fotos 026, 043, 052, 053): Kopf „Verknüpfungen“ mit gelbem Filterfeld und Trichter,
   Zeile „Typ Matchcode (Hinweis) – Anschrift“, „Kostenträger selbst“ rot/fett mit Symbol, aufklappen/zuklappen. */
.hw-verkn-kopf { display: flex; align-items: center; gap: 8px; margin-bottom: 4px; }
.hw-verkn-kopf h3 { margin: 0; color: var(--blau); font-size: 16px; font-weight: 600; }
.hw-verkn-kopf .hw-trichter { margin-left: auto; color: var(--blau); }
.hw-verkn-kopf input.hw-filter { margin-left: 0; max-width: 280px; background: #FFF59D; }
.hw-baum-zeile { display: flex; align-items: center; gap: 4px; padding: 1px 4px; white-space: nowrap; cursor: default; border-radius: 2px; outline: none; }
.hw-baum-zeile.gewaehlt { background: #CFE0F5; }
.hw-baum-zeile:focus-visible { outline: 1px dotted #1F5FA8; }
.hw-baum-zeile.selbst { color: var(--blau); font-weight: 700; }
.hw-baum-auf { width: 14px; flex: 0 0 14px; padding: 0; border: 0; background: transparent; color: #4A5560; font-size: 11px; cursor: pointer; }
.hw-baum-symbol { flex: 0 0 auto; font-size: 13px; }
.hw-verkn-leer { text-align: center; color: var(--blau); padding: 18px 0; }
.hw-verkn-fusshilfe { margin-top: 6px; }
/* H1 Paket 5 – P12: Reiter „Bild“ der Adresse (Foto 027) – ein Bildfeld. */
.hw-adresse .hw-bildreiter .hw-bild-gross { max-width: 100%; max-height: 520px; object-fit: contain; }
.hw-bild-knoepfe { display: flex; flex-wrap: wrap; gap: 6px; align-items: center; margin-top: 6px; }
.hw-bild-knoepfe form { margin: 0; display: flex; gap: 6px; align-items: center; flex-wrap: wrap; }
/* H1 Paket 5 – P20: Wichtige Informationen – Kategorien mit Symbol (Foto 028), mit Inhalt fett; Reitertitel fett statt Zahl. */
.hw-kategorien a .sym { display: inline-block; width: 20px; text-align: center; color: var(--blau); }
.hw-zelle > .hw-nachschlagen { flex: 0 0 24px; min-width: 24px; width: 24px; padding: 0; font-size: 11px; line-height: 1; align-self: stretch; }   /* H1 Paket 9a: ••• schmal wie TAIFUN (Foto 044) */
#hw-verkn-form .hw-zelle > .mittel, .hw-zelle > input[data-hw-adresse-anzeige] { flex-basis: 176px; }   /* H1 Paket 9a: Typ/Adresse so breit wie Foto 044, 18 Zeichen Matchcode lesbar */
.hw-schleier.hw-wahl { z-index: 70; }   /* Auswahldialog aus einem Fenster (Verknüpfung ••• ) liegt über dem Fenster */
/* H1 Paket 5 – P37: Fenster „Objekt auswählen“ zur Objektzuordnung des Kontakts. */
.hw-objektwahl-liste { width: 100%; }
/* H1 Paket 6a – P43: Textblock-Auswahl mit Spalten „Matchcode · Text · Beschreibung“ (Foto 120); P49: Historie – Baum links, Angaben rechts (Foto 140). */
.hw-landliste.breit { width: 760px; max-height: 260px; }
.hw-landliste.breit td { max-width: 360px; overflow: hidden; text-overflow: ellipsis; }
.hw-landliste.breit td:first-child, .hw-landliste.breit th:first-child { width: auto; }
.hw-historie { display: flex; flex-wrap: wrap; gap: 8px; padding: 8px; }
.hw-historie-baum { flex: 1 1 380px; min-height: 260px; max-height: 60vh; overflow: auto; background: #FFFFFF; border: 1px solid var(--linie); border-radius: 6px; padding: 6px 8px; font-size: 14px; }
.hw-historie-baum ul { list-style: none; margin: 2px 0 6px 14px; padding: 0; }
.hw-historie-baum li { padding: 2px 6px; cursor: default; white-space: nowrap; border-radius: 3px; }
.hw-historie-baum li.an { background: #B3DBF7; }
.hw-historie-angaben { flex: 1 1 260px; background: #FFFFFF; border: 1px solid var(--linie); border-radius: 6px; padding: 8px 10px; font-size: 14px; }
.hw-fenster-menue form { margin: 0; }
/* H1 Paket 6b – Info-Fenster: leere Liste mit Kopf wie TAIFUN (Foto 146), Archiv mit Ordnerbaum (Foto 166), Posteingänge mit Filterbaum (Foto 162). */
.hw-infoliste { min-width: 100%; }
.hw-fenster-reiter a { text-decoration: none; }
.hw-infoliste tr.hw-leerzeile td { height: 120px; background: #FFFFFF; }
.hw-infohinweis { margin: 6px 2px; color: #555; }
.hw-zweiteilig { display: flex; gap: 8px; align-items: flex-start; }
.hw-zweiteilig > div { flex: 1 1 auto; min-width: 0; }
.hw-ordnerbaum, .hw-filterbaum { flex: 0 0 190px; display: flex; flex-direction: column; gap: 4px; background: #FFFFFF; border: 1px solid var(--linie); border-radius: 6px; padding: 6px; font-size: 14px; }
.hw-ordnerbaum a { padding: 2px 6px; border-radius: 3px; text-decoration: none; color: inherit; }
.hw-ordnerbaum a.unter { margin-left: 14px; }
.hw-ordnerbaum a.an { background: #B3DBF7; }
.hw-filterbaum a { padding: 5px 10px; border-radius: 5px; text-decoration: none; color: #222; font-weight: 600; }
.hw-filterbaum a.gelb { background: #F0DC00; }
.hw-filterbaum a.gruen { background: #B5D334; }
.hw-filterbaum a.an { outline: 2px solid #1A5FA8; }
.hw-schnellfilter input { width: 100%; box-sizing: border-box; }
.hw-archiv-unten { min-height: 90px; background: #FFFFFF; border: 1px solid var(--linie); border-radius: 0 0 6px 6px; padding: 6px 10px; }
/* H1 Paket 7a – Drucken: Report auswählen (Foto 147/224), Report drucken (148), Bereich auswählen (225). */
.hw-reportwahl tr[data-ad-zeile] { cursor: default; }
.hw-reportwahl tr.an td { background: #B3DBF7; }
.hw-reportwahl .ad-wahl-knopf { width: 22px; text-align: center; }
.hw-reportwahl label { cursor: default; font-weight: normal; }
.ad-druck .ad-wahl, .hw-adresse .ad-wahl { display: block; margin: 2px 0; }
.ad-neben { margin: 0 6px 0 14px; font-weight: 600; }
.ad-hinweis { margin: 4px 0 0; color: #555; }
.ad-listbox { width: 100%; min-height: 110px; }
.ad-auswahlliste { list-style: none; margin: 0 0 4px; padding: 0; min-height: 60px; border: 1px solid #c9d3df; background: #FFFFFF; }
.ad-auswahlliste li { display: flex; justify-content: space-between; gap: 6px; padding: 1px 4px; }
.ad-hinzu { display: flex; gap: 4px; align-items: center; flex-wrap: wrap; }
.ad-vorlage { display: flex; gap: 4px; justify-content: flex-end; margin: -4px 0 4px; }   /* H1 Paket 9b – P62: Ordner/Diskette wie Foto 222 */
.ad-eig-dialog { border: 1px solid #c9d3df; padding: 6px; margin-top: 4px; background: #f7f9fc; }
@media screen and (max-width: 700px) {
    .ad-neben { display: block; margin: 4px 0 2px; }
    .hw-zweiteilig { flex-direction: column; }
    .hw-ordnerbaum, .hw-filterbaum { flex-basis: auto; width: 100%; box-sizing: border-box; }
}
/* H1 Paket 7b – Word, Dienste, Verteiler (Fotos 213–222), Regionen (223), Archiv „Neu“ (166). */
form.hw-inline { display: inline; margin: 0; }
.hw-trefferliste { list-style: none; margin: 6px 0; padding: 0; max-height: 50vh; overflow: auto; }
.hw-trefferliste li { padding: 2px 4px; border-bottom: 1px solid #e3e8ef; }
.hw-archiv-unten textarea.lang, .hw-archiv-unten input.lang { width: 100%; box-sizing: border-box; }

/* H1 Paket 8: Stammfenster – graue Registerkarten (noch nicht gebaut) und Fenstermenü (Kunden-Gruppe, Länder). */
.hw-reiter span.aus { opacity: .45; cursor: default; }
.hw-fenstermenue { display: flex; gap: 14px; padding: 4px 8px; }
.hw-fenstermenue .aus { color: #8A9099; }

/* H1 Paket 8b – P62: Routenplaner im Adressen-Verteiler (gleiche Klassen wie der Service-Tourenplaner, dort im Seitenstil). */
[data-tp-fenster].tp-fenster { max-width: 760px; }
[data-tp-fenster] .tp-leiste { display: flex; gap: 6px; align-items: center; padding: 6px 12px; flex-wrap: wrap; }
[data-tp-fenster] .tp-liste, [data-tp-fenster] .tp-route { margin: 4px 12px 8px 36px; padding: 0; }
[data-tp-fenster] .tp-liste li { margin: 3px 0; padding: 2px 4px; }
[data-tp-fenster] .tp-liste li.gewaehlt { background: #fff7b0; }
[data-tp-fenster] .tp-liste input { width: calc(100% - 60px); }
@media screen and (max-width: 700px) { [data-tp-fenster] .tp-liste, [data-tp-fenster] .tp-route { margin-left: 22px; } [data-tp-fenster] .tp-liste input { width: 100%; } }

/* H1 Paket 9b – P34: Rechtsklickmenü der Ansprechpartner-Liste (Foto 055). */
.hw-apk-menue { position: fixed; z-index: 3000; background: #FFFFFF; border: 1px solid #9AA9BB; box-shadow: 2px 2px 6px rgba(0,0,0,.25); min-width: 250px; padding: 3px 0; font-size: 14px; }
.hw-apk-menue button, .hw-apk-menue span { display: flex; justify-content: space-between; gap: 12px; width: 100%; padding: 3px 14px 3px 22px; border: 0; background: none; font: inherit; color: var(--text); text-align: left; cursor: pointer; box-sizing: border-box; }
.hw-apk-menue button:hover:not(:disabled) { background: #CFE3F7; }
.hw-apk-menue .aus, .hw-apk-menue button:disabled { color: #8A9099; cursor: default; }
.hw-apk-menue small { color: #555; }
.hw-apk-menue hr { margin: 3px 4px; border: 0; border-top: 1px solid #C9D3DF; }
.hw-apk-fix th:first-child, .hw-apk-fix td:first-child { position: sticky; left: 0; background: #F3F7FB; z-index: 1; }

/* ---------- Handwerk: Dublettenhinweis und Debitor-Vorschlag in der Adressmaske (H1 Nr. 7, 05.10.2026) ---------- */
.hw-dubletten { margin: 8px 8px 0; padding: 8px 12px 10px; background: #FFF4D6; border: 1px solid #E0B44C; border-radius: 6px; font-size: 14px; }
.hw-dubletten > b { color: #6B4A00; margin-right: 6px; }
.hw-dubletten table.liste { margin: 6px 0; background: #FFFFFF; }
.hw-dubletten .hw-marke { margin-left: 6px; }
.hw-dubletten p.klein { margin: 0 0 6px; }
.hw-dubletten-fuss { display: flex; flex-wrap: wrap; gap: 10px; align-items: center; }
.hw-adresse select.hw-kreis { width: auto; min-height: 22px; padding: 0 4px; font-size: 13px; }
.hw-vorschlag { font-weight: 600; color: var(--blau); }
.hw-vorschlag:empty { display: none; }
@media print { .hw-dubletten { display: none !important; } }
/* ---------- Handwerk: Stammdaten-Pflege (H1 Nr. 1 und Nr. 10, 05.10.2026) ----------
   Links die Liste der Stämme, daneben die Übersicht; Neu/Ändern im kleinen Fenster (.hw-schleier wie bei der Adresse). */
.hw-stammrahmen { display: grid; grid-template-columns: 236px minmax(0, 1fr); gap: 8px; align-items: start; padding: 8px; min-height: 420px; }
.hw-stammliste { position: sticky; top: 8px; }
.hw-stammbereich { padding: 8px 12px 2px; font-size: 12px; font-weight: 700; color: var(--blau); text-transform: uppercase; letter-spacing: .04em; }
.hw-stammbereich:first-child { padding-top: 2px; }
.hw-stamminhalt { min-width: 0; }
.hw-stamminhalt .hw-listenkopf { background: #FFFFFF; border-radius: 6px; padding: 6px 10px; margin-bottom: 8px; }
.hw-stamminhalt table.liste { background: #FFFFFF; border-radius: 6px; }
.hw-stamminhalt > .leer { background: #FFFFFF; border-radius: 6px; padding: 14px 12px; }
.hw-stamminhalt td .hw-punkt { vertical-align: baseline; }
.hw-stammhinweis { margin: 8px 2px 0; max-width: 900px; }
.hw-stammbaum tr.ebene0 td { background: #F3F7FB; }
.hw-stammbaum tr.ebene0 a.zeile { color: var(--blau); }
.hw-stammbaum tr.ebene2 a.zeile { font-weight: 400; }
.hw-stammbaum td .klein { margin-left: 8px; font-size: 12px; }
.hw-stammknoepfe form.inline { display: inline; margin: 0; }
.hw-stammknoepfe a, .hw-stammknoepfe button.link { color: var(--blau); margin-right: 8px; font-size: 13px; }
.hw-stammknoepfe button.link:disabled { color: #C3C8CE; cursor: default; }
.hw-stammfenster .hw-zeile, .hw-stammfenster .hw-spalten.gleich .hw-zeile { grid-template-columns: 150px minmax(0, 1fr); }
.hw-stammfenster .hw-zeile.ohne, .hw-stammfenster .hw-spalten.gleich .hw-zeile.ohne { grid-template-columns: minmax(0, 1fr); }
.hw-stammfenster .hw-stammnurlesen { padding: 8px 8px 0; }
.hw-stammfenster p.hw-stammmeldung { background: #E6F4EA; color: #155D38; }
.hw-stammkasten { margin: 8px; padding: 8px 12px; background: #FFFFFF; border-radius: 6px; font-size: 14px; }
.hw-stammkasten > b { color: var(--blau); }
.hw-stammkasten table.liste { margin: 6px 0; }
.hw-stammkasten p.klein { margin: 6px 0 0; }
.hw-stammverwendung { margin: 4px 0 0; padding-left: 20px; }
.hw-stammneben { display: flex; flex-wrap: wrap; gap: 8px; align-items: center; margin-top: 8px; padding-top: 8px; border-top: 1px solid var(--linie); }
.hw-stammneben form.inline { display: inline; margin: 0; }
.hw-schleier .hw-fenster form.hw-stammzeile { display: flex; flex-wrap: wrap; gap: 6px; align-items: center; padding: 0; margin: 6px 0 0; }
.hw-stammzeile select { flex: 1 1 220px; }
.hw-stammzeile select.mittel { flex: 0 0 140px; }
.hw-stammlinks { margin: 6px 0 0; line-height: 1.9; }
.hw-stammlinks a { margin-right: 14px; white-space: nowrap; }
@media screen and (max-width: 900px) {
  .hw-stammrahmen { grid-template-columns: minmax(0, 1fr); }
  .hw-stammliste { position: static; flex-direction: row; flex-wrap: wrap; }
}
.hw-schutz { font-size: 12px; color: var(--grau); border: 1px solid var(--linie); border-radius: 10px; padding: 0 7px; cursor: help; }
/* ---------- Handwerk: Übersicht mit Spaltenwahl je Benutzer (H1 Nr. 5, 05.10.2026) ----------
   Klick auf den Spaltenkopf sortiert; Fenster „Spalten“ (welche Spalten, Reihenfolge, Zeilen je Seite); Blättern in Seiten. */
.hw-schleier[hidden] { display: none; }
.hw-listeninfo { display: flex; flex-wrap: wrap; gap: 6px 14px; align-items: center; justify-content: space-between; padding: 4px 12px; }
.hw-blaettern { display: inline-flex; gap: 4px; align-items: center; white-space: nowrap; }
.hw-blaettern > span:not(.knopf) { padding: 0 6px; }
button.hw-sortkopf { font-weight: 600; color: var(--text); white-space: nowrap; }
button.hw-sortkopf:hover, button.hw-sortkopf:focus-visible { color: var(--blau); text-decoration: underline; }
button.hw-sortkopf.an { color: var(--blau); }
.hw-spaltenliste { list-style: none; margin: 0 0 8px; padding: 4px 0; background: #FFFFFF; border-radius: 6px; max-height: 52vh; overflow: auto; }
.hw-spaltenliste li { display: flex; gap: 10px; align-items: center; padding: 2px 10px; }
.hw-spaltenliste li:hover, .hw-spaltenliste li:focus-within { background: #E7EEF8; }
.hw-spaltenliste label { display: inline-flex; gap: 6px; align-items: center; flex: 0 0 200px; margin: 0; font-size: 14px; font-weight: 600; color: var(--text); cursor: pointer; }
.hw-spaltenliste input[type=checkbox] { width: auto; min-height: 0; }
.hw-spaltenliste .klein { flex: 1 1 auto; min-width: 0; }
.hw-spaltenknoepfe { white-space: nowrap; }
.hw-spaltenknoepfe button.link { color: var(--blau); padding: 0 5px; font-size: 13px; }
@media print { .hw-listeninfo .hw-blaettern { display: none; } }
/* ---------- Handwerk: Auswahlfenster „Adresse wählen“ für Belege (H1 Nr. 26, 05.10.2026) ----------
   Teilansicht _HwAdressWahl + wwwroot/js/hw-adresswahl.js: Suchbegriffe oben, Treffer darunter, Fußleiste Übernehmen/Schließen. */
.hw-wahl .hw-fenster.breit { max-width: 1100px; }
.hw-wahl .hw-fenster-titel button.link { color: #FFFFFF; }
.hw-wahl [hidden] { display: none !important; }
.hw-wahl-raster { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 0 18px; }
.hw-wahl-raster .hw-zeile { grid-template-columns: 128px minmax(0, 1fr); }
.hw-wahl .hw-haken { flex: 0 0 auto; margin: 0 0 0 8px; white-space: nowrap; }
.hw-wahl input[type=radio], .hw-wahl input[type=checkbox] { width: auto; min-height: 0; flex: 0 0 auto; }
.hw-wahl-inhalt { margin: 0 8px 8px; min-height: 190px; max-height: 58vh; overflow: auto; }
.hw-wahl-inhalt table.liste { background: #FFFFFF; }
.hw-wahl-inhalt .leer, .hw-wahl-inhalt p.klein { margin: 0 0 8px; padding: 10px 12px; background: #FFFFFF; border-radius: 6px; }
.hw-wahl-inhalt .hw-gruppe p.klein { padding: 0; margin: 4px 0 0; }
.hw-wahl-inhalt .fehler, .hw-wahl-inhalt .hinweis { margin: 0 0 8px; }
.hw-wahl-liste tr[data-hw-wahl-zeile] { cursor: pointer; }
.hw-wahl-liste td .hw-marke, .hw-wahl-matrix td .hw-marke { margin-left: 6px; }
.hw-wahl-abschnitt { display: flex; flex-wrap: wrap; gap: 6px 12px; align-items: center; justify-content: space-between; padding: 2px 2px 6px; color: var(--blau); }
.hw-wahl-abschnitt input.hw-filter { max-width: 260px; margin-left: auto; background: #FFF9C4; }
.hw-wahl-kunde { display: flex; flex-wrap: wrap; gap: 6px 12px; align-items: center; justify-content: space-between; margin: 0 0 8px; padding: 8px 12px; background: #FFFFFF; border-radius: 6px; }
.hw-wahl-kunde b { font-size: 16px; margin-right: 8px; }
.hw-wahl-punkt { display: flex; gap: 8px; align-items: baseline; margin: 0 0 3px; font-size: 14px; color: var(--text); cursor: pointer; }
.hw-wahl-bei { display: flex; flex-wrap: wrap; gap: 6px 12px; align-items: center; justify-content: space-between; margin: 0 0 4px; font-size: 14px; }
.hw-wahl-matrix th:nth-child(-n+2), .hw-wahl-matrix td.mitte { text-align: center; width: 1%; white-space: nowrap; }
.hw-wahl-matrix tr:has(input:checked) td { background: #E7EEF8; }
.hw-feldwahl { display: flex; flex-wrap: wrap; gap: 6px 10px; align-items: center; margin-top: 4px; font-size: 13px; }
.hw-felder label.hw-feld-zwei { margin-top: 8px; }
@media screen and (max-width: 900px) { .hw-wahl-raster { grid-template-columns: minmax(0, 1fr); } }
@media print { .hw-feldwahl { display: none !important; } }
/* ---------- Handwerk: Karteikarte mit Formatierung (H1 Nr. 6, 06.10.2026) ----------
   Anzeige und Editor zeigen das HTML aus Dienste\Handwerk\RtfHtml.cs (Absätze als div, Tabulatoren und Leerzeichen bleiben stehen).
   Editor: wwwroot\js\hw-kartei.js (Fett, Kursiv, Unterstrichen, feste Farben, Datum/Kürzel). */
.hw-rtf { white-space: pre-wrap; overflow-wrap: anywhere; font-family: Arial, sans-serif; font-size: 10pt; line-height: 1.35; tab-size: 8; text-align: left; }
.hw-adresse .hw-wert.hw-rtf, .hw-schleier .hw-wert.hw-rtf { white-space: pre-wrap; overflow: auto; text-overflow: clip; font-size: 10pt; }
.hw-rtf a { color: var(--blau); }
.hw-rtf-editor { display: flex; flex-direction: column; min-width: 0; border: 1px solid #9DB7D3; border-radius: 2px; background: #FFFFFF; }
.hw-rtf-leiste { display: flex; flex-wrap: wrap; gap: 2px; align-items: center; padding: 2px 4px; background: #EEF3F9; border-bottom: 1px solid #C9D7E6; }
.hw-rtf-leiste button { min-width: 26px; height: 24px; padding: 0 6px; border: 1px solid transparent; border-radius: 3px; background: transparent; font: inherit; font-size: 13px; color: var(--text); cursor: pointer; }
.hw-rtf-leiste button:hover, .hw-rtf-leiste button:focus-visible { border-color: #9DB7D3; background: #FFFFFF; }
.hw-rtf-farbe { display: inline-block; width: 13px; height: 13px; border-radius: 2px; border: 1px solid rgba(0,0,0,.25); vertical-align: middle; }
.hw-rtf-trenner { flex: 0 0 1px; height: 18px; background: #C9D7E6; margin: 0 4px; }
.hw-rtf-feld { padding: 4px 6px; outline: none; overflow: auto; }
.hw-rtf-feld:focus { background: #FFFDF0; }
.hw-rtf-editor.kartei .hw-rtf-feld { min-height: 418px; max-height: 640px; }
.hw-rtf-editor.text .hw-rtf-feld { min-height: 150px; max-height: 420px; }
@media print { .hw-rtf-leiste { display: none !important; } }

/* Hervorheben in E-Mails (Wunsch 3, 05.10.2026) */
.mail-leiste { display: flex; flex-wrap: wrap; gap: 4px; margin: 2px 0 4px; }
.mail-leiste button { min-width: 32px; height: 30px; padding: 0 8px; border: 1px solid #C9CDD2; border-radius: 6px; background: #fff; color: #1C1F24; font-size: 14px; cursor: pointer; }
.mail-leiste button:hover { background: #F1F3F5; }
.mail-farbe { display: inline-block; width: 14px; height: 14px; border-radius: 3px; vertical-align: middle; }
.mail-editor { width: 100%; box-sizing: border-box; padding: 7px 9px; border: 1px solid #B8BDC4; border-radius: 4px; background: #FFFFFF; color: var(--text); font: inherit; line-height: 1.45; overflow-y: auto; max-height: 60vh; resize: vertical; white-space: pre-wrap; word-wrap: break-word; }
.mail-editor:focus { outline: 2px solid var(--blau); outline-offset: 0; border-color: var(--blau); }

/* Ticket suchen und anklicken (06.10.2026) */
.ticketsuche input[type=search] { width: 100%; padding: 7px 9px; border: 1px solid #B8BDC4; border-radius: 4px; font: inherit; color: var(--text); background: #FFFFFF; box-sizing: border-box; }
.ticketsuche input[type=search]:focus { outline: 2px solid var(--blau); outline-offset: 0; border-color: var(--blau); }
.ticketsuche-liste { margin-top: 6px; max-height: 360px; overflow-y: auto; }
.ticketsuche-treffer { display: flex; align-items: flex-start; gap: 8px; border: 1px solid #D9DCE0; border-radius: 4px; margin: 0 0 4px; background: #FFFFFF; }
.ticketsuche-treffer.erledigt { opacity: .75; }
.ticketsuche-knopf { flex: 1; text-align: left; background: none; border: 0; padding: 6px 8px; font: inherit; color: var(--text); cursor: pointer; }
.ticketsuche-knopf:hover { background: #F1F3F5; }
.ticketsuche-knopf small { display: block; color: var(--grau); font-size: 12px; margin-top: 2px; }
.ticketsuche-treffer a { padding: 6px 8px; font-size: 13px; white-space: nowrap; }
.ticketsuche-wahl { margin-top: 6px; padding: 6px 8px; border-left: 3px solid var(--blau); background: #F4F7FB; }

/* Updateliste: umgesetzte Wünsche grün, nur lesen (06.10.2026) */
.wunsch-umgesetzt { background: #EAF6EC; border-left: 4px solid #1E7B34; }
.wunsch-marke { background: #1E7B34; color: #FFFFFF; }

/* ===== Update 1.4: Messenger und Online-Status ===== */
.nav a span[data-chat-zahl] { background: var(--rot); color: #FFFFFF; border-radius: 10px; padding: 0 7px; font-size: 12px; font-weight: 600; }
.chat-online > div[data-chat-online] a { justify-content: flex-start; gap: 7px; padding: 4px 14px; font-size: 14px; }
.chat-punkt { display: inline-block; width: 10px; height: 10px; border-radius: 50%; flex: 0 0 10px; margin-top: 5px; background: #A7ACB2; font-style: normal; }
.chat-punkt.gruen { background: #23A047; } .chat-punkt.gelb { background: #E8B400; } .chat-punkt.orange { background: #E5770F; }
.chat-punkt.rot { background: #C8001A; } .chat-punkt.grau { background: #A7ACB2; } .chat-punkt.lila { background: #7B4FB8; }
.chat-punkt.gruppe { background: none; width: auto; height: auto; margin-top: 0; font-size: 15px; flex: 0 0 auto; }
.chat { display: grid; grid-template-columns: 300px 1fr; gap: 0; height: calc(100vh - 110px); min-height: 480px; border: 1px solid var(--linie); border-radius: 6px; overflow: hidden; }
.chat-seite { background: var(--flaeche); border-right: 1px solid var(--linie); overflow-y: auto; padding: 10px; }
.chat-seite h2 { font-size: 13px; text-transform: uppercase; letter-spacing: .04em; color: var(--grau); margin: 14px 4px 6px; }
.chat-status-wahl { display: block; font-size: 13px; color: var(--grau); padding: 0 4px; }
.chat-status-wahl select { display: block; width: 100%; margin-top: 3px; font: inherit; padding: 4px; }
.chat-kopf-zeile { display: flex; justify-content: space-between; align-items: center; }
.chat-kollegen, .chat-raeume { list-style: none; margin: 0; padding: 0; }
.chat-zeile { display: flex; gap: 9px; width: 100%; text-align: left; background: none; border: 0; border-radius: 5px; padding: 7px 8px; font: inherit; cursor: pointer; color: var(--text); align-items: flex-start; }
.chat-zeile:hover { background: #E7E9EC; }
.chat-zeile.an { background: #FFFFFF; box-shadow: inset 3px 0 0 var(--rot); }
.chat-zeile > span { flex: 1; min-width: 0; }
.chat-zeile b { display: block; font-weight: 600; }
.chat-zeile small { display: block; color: var(--grau); font-size: 12.5px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.chat-zeile.neu small { color: var(--text); font-weight: 600; }
.chat-zeile em { font-style: normal; font-size: 12px; color: var(--grau); text-align: right; white-space: nowrap; }
.chat-zahl { display: block; margin-top: 3px; margin-left: auto; width: max-content; background: var(--rot); color: #FFFFFF; border-radius: 10px; padding: 0 7px; font-style: normal; font-weight: 600; }
.chat-haupt { display: flex; flex-direction: column; min-width: 0; min-height: 0; }
.chat-leer { margin: auto; color: var(--grau); padding: 20px; text-align: center; }
.chat-fenster { display: flex; flex-direction: column; flex: 1; min-height: 0; }
.chat-fenster[hidden] { display: none; }
.chat-titel { display: flex; justify-content: space-between; align-items: center; gap: 10px; padding: 9px 14px; border-bottom: 1px solid var(--linie); }
.chat-titel b { font-size: 16px; margin-right: 8px; }
.chat-menue { position: relative; }
.chat-menue > summary { list-style: none; }
.chat-menue > summary::-webkit-details-marker { display: none; }
.chat-menue-liste { position: absolute; right: 0; top: 30px; z-index: 20; background: #FFFFFF; border: 1px solid var(--linie); border-radius: 6px; box-shadow: 0 4px 16px rgba(0,0,0,.15); padding: 6px; min-width: 280px; }
.chat-menue-liste button { display: block; width: 100%; text-align: left; padding: 7px 9px; border-radius: 4px; color: var(--text); }
.chat-menue-liste button:hover { background: var(--flaeche); }
.chat-verlauf { flex: 1; overflow-y: auto; padding: 12px 16px; background: #FBFBFC; min-height: 0; }
.chat-tag { text-align: center; margin: 12px 0 8px; }
.chat-tag span { background: #E7E9EC; border-radius: 10px; padding: 2px 10px; font-size: 12px; color: var(--grau); }
.chat-hinweis { text-align: center; font-style: italic; font-size: 13px; color: var(--grau); margin: 6px 0; }
.chat-msg { position: relative; max-width: 72%; margin: 6px 0; padding: 7px 11px 8px; background: #FFFFFF; border: 1px solid var(--linie); border-radius: 10px; }
.chat-msg.eigen { margin-left: auto; background: #EAF2FC; border-color: #CFE0F5; }
.chat-msg-kopf { font-size: 13px; }
.chat-msg-kopf small { color: var(--grau); }
.chat-msg-text { white-space: normal; overflow-wrap: anywhere; margin-top: 2px; }
.chat-msg-text.geloescht { font-style: italic; color: var(--grau); }
.chat-zitat { border-left: 3px solid var(--blau); background: rgba(31,95,168,.06); padding: 3px 8px; margin: 4px 0; font-size: 13px; color: var(--grau); }
.chat-ticket, .chat-datei { display: inline-block; margin-top: 5px; padding: 4px 9px; border: 1px solid var(--linie); border-radius: 5px; background: #FFFFFF; text-decoration: none; }
.chat-bild img { display: block; max-width: 260px; max-height: 220px; margin-top: 5px; border-radius: 6px; }
.chat-reaktionen { display: flex; gap: 4px; margin-top: 5px; flex-wrap: wrap; }
.chat-reaktionen button { border: 1px solid var(--linie); background: #FFFFFF; border-radius: 12px; padding: 0 7px; font-size: 13px; cursor: pointer; }
.chat-reaktionen button.meins { border-color: var(--blau); background: #EAF2FC; }
.chat-msg-aktionen { display: none; position: absolute; top: -14px; right: 8px; background: #FFFFFF; border: 1px solid var(--linie); border-radius: 14px; padding: 1px 4px; box-shadow: 0 2px 6px rgba(0,0,0,.12); }
.chat-msg:hover .chat-msg-aktionen, .chat-msg:focus-within .chat-msg-aktionen { display: flex; }
.chat-msg-aktionen button { border: 0; background: none; cursor: pointer; font-size: 15px; padding: 2px 4px; }
.chat-gelesen { font-size: 12px; color: var(--gruen); text-align: right; }
.chat-weiter { margin-top: 6px; }
.chat-aelter { text-align: center; }
.chat-eingabe { border-top: 1px solid var(--linie); padding: 9px 12px; background: #FFFFFF; }
.chat-eingabe textarea { width: 100%; font: inherit; padding: 7px 9px; border: 1px solid var(--linie); border-radius: 6px; resize: vertical; min-height: 54px; }
.chat-knoepfe { display: flex; gap: 8px; align-items: center; margin-top: 6px; flex-wrap: wrap; }
.chat-knoepfe [type=submit] { margin-left: auto; }
.chat-bezug { font-size: 13px; color: var(--grau); border-left: 3px solid var(--blau); padding: 3px 8px; margin-bottom: 6px; }
.chat-ticketsuche input { width: 100%; font: inherit; padding: 6px 8px; margin-top: 6px; }
.chat-ticketsuche ul { list-style: none; margin: 4px 0 0; padding: 0; max-height: 220px; overflow-y: auto; }
.chat-dialog { border: 1px solid var(--linie); border-radius: 8px; padding: 18px 22px; min-width: 340px; }
.chat-dialog label { display: block; margin-bottom: 10px; }
.chat-dialog input[type=text] { display: block; width: 100%; font: inherit; padding: 6px 8px; margin-top: 3px; }
.chat-dialog fieldset { border: 1px solid var(--linie); border-radius: 6px; margin: 0 0 12px; }
.chat-meldungen { position: fixed; right: 18px; bottom: 18px; z-index: 50; display: flex; flex-direction: column; gap: 8px; max-width: 360px; }
.chat-meldung { display: block; background: #FFFFFF; border: 1px solid var(--linie); border-left: 4px solid var(--blau); border-radius: 6px; box-shadow: 0 6px 18px rgba(0,0,0,.18); padding: 9px 12px; color: var(--text); text-decoration: none; transition: opacity .5s; }
.chat-meldung b { display: block; }
.chat-meldung span { display: block; font-size: 14px; color: var(--grau); overflow: hidden; text-overflow: ellipsis; display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; }
.chat-meldung.weg { opacity: 0; }
@media screen and (max-width: 800px) { .chat { grid-template-columns: 1fr; height: auto; } .chat-seite { max-height: 260px; } .chat-verlauf { min-height: 50vh; } .chat-msg { max-width: 92%; } }
@media print { .chat-meldungen, .chat-online { display: none !important; } }

/* ===== Update 1.4: Teammeeting ===== */
.tm-anwesend { display: flex; flex-wrap: wrap; gap: 4px 16px; align-items: center; background: var(--flaeche); padding: 8px 12px; border-radius: 6px; margin-bottom: 8px; }
.tm-anwesend .haken, .tm-neu .haken, .tm-aufgaben .haken { display: inline-flex; margin: 0; }
.tm-kacheln { display: grid; grid-template-columns: repeat(auto-fill, minmax(150px, 1fr)); gap: 10px; margin-bottom: 10px; }
.tm-kachel { display: block; border: 1px solid var(--linie); border-radius: 8px; padding: 10px 12px; text-decoration: none; color: var(--text); background: #FFFFFF; }
.tm-kachel b { display: block; font-size: 26px; line-height: 1.1; }
.tm-kachel span { font-size: 13px; color: var(--grau); }
.tm-kachel.warn { border-color: #E5A100; background: #FFF8E6; }
.tm-kachel.gut { border-color: #9FD3AE; background: #EFF8F1; }
.tm-blick { margin: 0 0 6px; padding-left: 20px; }
.tm-blick li { margin: 3px 0; }
.tm-neu { display: flex; flex-wrap: wrap; gap: 8px; align-items: center; margin-bottom: 10px; }
.tm-neu input[type=text], .tm-neu textarea { flex: 1 1 320px; font: inherit; padding: 6px 8px; border: 1px solid var(--linie); border-radius: 5px; }
.tm-neu select, .tm-neu input[type=date] { font: inherit; padding: 4px; }
.tm-aufgaben, .tm-notizen { list-style: none; margin: 0 0 8px; padding: 0; max-width: 1000px; }
.tm-aufgaben li, .tm-notizen li { display: flex; flex-wrap: wrap; gap: 4px 12px; align-items: baseline; padding: 7px 10px; border-bottom: 1px solid var(--linie); }
.tm-aufgaben li .klein, .tm-notizen li .klein { margin-left: auto; }
.tm-aufgaben li.erledigt .tm-text { text-decoration: line-through; color: var(--grau); }
.tm-aufgaben li.ueber { background: #FFF4F4; }
.tm-notizen li.wichtig { background: #FFF8E6; border-left: 3px solid #E5A100; }
.tm-notizen .tm-text { flex: 1 1 100%; white-space: pre-wrap; }
.tm-auswertung { margin: 8px 0 14px; max-width: 1000px; }
.tm-auswertung td.warn { color: var(--rot); font-weight: 600; }
.tm-dispo-rahmen { overflow-x: auto; }
.tm-dispo-filter { width: 100%; max-width: 480px; font: inherit; padding: 6px 8px; margin-bottom: 6px; }
table.tm-dispo { font-size: 13.5px; }
.tm-stand { width: 100%; min-width: 180px; font: inherit; font-size: 13.5px; padding: 4px 6px; border: 1px solid var(--linie); border-radius: 4px; }
.tm-stand.gespeichert { border-color: #9FD3AE; background: #EFF8F1; }
.tm-bericht { min-height: 0; }
@media print { .tm-neu, .tm-anwesend, .tm-dispo-filter, .tm form, .tm .knopfzeile { display: none !important; } .tm-stand { border: 0; } }

/* ===== Update 1.4: Schreibhilfe (Diktieren, Rechtschreibung) ===== */
.schreibhilfe { display: flex; flex-wrap: wrap; gap: 6px; align-items: center; margin: 3px 0 8px; }
.schreibhilfe.in-leiste { display: inline-flex; margin: 0 0 0 10px; }
.schreibhilfe button[data-sh-diktat], .schreibhilfe button[data-sh-rs] { border: 1px solid var(--linie); background: #FFFFFF; border-radius: 4px; padding: 2px 8px; font: inherit; font-size: 13px; cursor: pointer; color: var(--text); }
.schreibhilfe button:hover { background: var(--flaeche); }
.schreibhilfe button:disabled { opacity: .6; cursor: wait; }
.schreibhilfe button.laeuft { background: #FDECEE; border-color: var(--rot); color: var(--rot); font-weight: 600; animation: sh-puls 1.2s infinite; }
@keyframes sh-puls { 50% { box-shadow: 0 0 0 4px rgba(200,0,26,.15); } }
.schreibhilfe-info { font-size: 13px; color: var(--grau); }
@media print { .schreibhilfe { display: none !important; } }
/* Kollegen-Liste direkt unter „Nachrichten“ (07.10.2026) */
.nav .chat-online { padding: 0 0 6px 14px; }
.nav .chat-online a { justify-content: flex-start; gap: 7px; padding: 3px 14px 3px 10px; font-size: 13.5px; border-left: 0; }
/* „Dringend zu erledigen“ im Teammeeting: echtes Abhakfeld (07.10.2026) */
.tm-bericht td.tm-haken { text-align: center; }
.tm-bericht td.tm-haken input { width: 20px; height: 20px; cursor: pointer; }
.tm-bericht tr.erledigt td { color: var(--grau); text-decoration: line-through; background: #F3F8F4; }
.tm-bericht tr.erledigt td.tm-haken { text-decoration: none; }
/* Messenger: Emojis, Datum/Uhrzeit und „gelesen“ unter jeder eigenen Nachricht (07.10.2026) */
.chat-emojis { border: 1px solid var(--linie); border-radius: 8px; background: #FFFFFF; padding: 6px 8px; margin-top: 6px; max-height: 220px; overflow-y: auto; box-shadow: 0 4px 14px rgba(0,0,0,.12); }
.chat-emoji-gruppe small { display: block; color: var(--grau); margin: 4px 2px 2px; }
.chat-emojis button { border: 0; background: none; font-size: 22px; line-height: 1; padding: 4px; cursor: pointer; border-radius: 4px; }
.chat-emojis button:hover { background: var(--flaeche); }
.chat-msg-text { font-family: "Segoe UI", "Segoe UI Emoji", "Apple Color Emoji", "Noto Color Emoji", Calibri, Arial, sans-serif; }
.chat-gelesen { font-size: 12px; color: var(--blau); text-align: right; margin-top: 3px; }
.chat-gelesen.offen { color: var(--grau); }

/* Scan-Upload (08.10.2026) */
.scan-text { max-width: 900px; }
.scan-form { max-width: 900px; margin: 0 0 22px; }
.scan-feld { display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 6px; min-height: 150px; padding: 22px 16px; border: 2px dashed var(--linie); border-radius: 8px; background: var(--flaeche); color: var(--text); font-size: 15px; text-align: center; cursor: pointer; }
.scan-feld:hover, .scan-feld.drueber { border-color: var(--rot); background: #FFF5F6; }
.scan-feld input[type=file] { position: absolute; width: 1px; height: 1px; opacity: 0; }
.scan-gross { font-size: 20px; font-weight: 600; }
.scan-liste { list-style: none; margin: 12px 0 0; padding: 0; }
.scan-liste li { display: grid; grid-template-columns: minmax(0, 1fr) 140px minmax(0, 1fr); gap: 10px; align-items: center; padding: 6px 0; border-bottom: 1px solid var(--linie); font-size: 14px; }
.scan-liste .scan-name { overflow-wrap: anywhere; }
.scan-liste progress { width: 100%; }
.scan-liste li.gut .scan-stand { color: var(--gruen); }
.scan-liste li.schlecht .scan-stand { color: var(--rot); font-weight: 600; }
.scan-tabelle { overflow-x: auto; max-width: 900px; }
.scan-tabelle td { overflow-wrap: anywhere; }
.scan-admin { max-width: 900px; margin-top: 22px; }
@media screen and (max-width: 760px) { .scan-liste li { grid-template-columns: 1fr; gap: 3px; } }

/* Notdienstplaner / Bereitschaftsdienst (11.10.2026) */
.bd-jetzt { font-size: 17px; margin: 0 0 12px; }
.bd-plan tr.bd-meine, .bd-plan tr.bd-meine td { background: #FFF7E0; }
.bd-inline { display: inline; }
/* Bereitschaft: Monatskalender (11.10.2026) */
.bd-kal-kopf { display: flex; align-items: center; gap: 10px; margin: 6px 0 8px; }
.bd-kal-kopf h2 { margin: 0; min-width: 170px; text-align: center; }
.bd-kal { display: grid; grid-template-columns: repeat(7, minmax(0, 1fr)); gap: 3px; margin: 0 0 6px; }
.bd-kal-wt { font-size: 12px; color: var(--grau); text-align: center; padding: 2px 0; }
.bd-kal-tag { min-height: 58px; border-radius: 4px; padding: 3px 5px; border-left: 3px solid transparent; overflow: hidden; }
.bd-kal-tag.bd-fr { border-left-color: #1C3B66; }
.bd-kal-tag.bd-heute { outline: 2px solid var(--rot); outline-offset: -2px; }
.bd-kal-tag.bd-ich .bd-kal-name { text-decoration: underline; }
.bd-kal-nr { display: block; font-size: 12px; color: #555; }
.bd-kal-name { display: block; font-weight: 600; font-size: 13px; line-height: 1.2; word-break: break-word; }
.bd-f-frei { background: #F2F2F2; color: #999; }
.bd-f0 { background: #DCEBFA; } .bd-f1 { background: #E3F4DF; } .bd-f2 { background: #FDEBD3; } .bd-f3 { background: #EEE2F7; }
.bd-f4 { background: #FCE1E1; } .bd-f5 { background: #DDF3F1; } .bd-f6 { background: #F6F1CF; } .bd-f7 { background: #E6E6E6; }
.bd-liste { margin: 14px 0; }
.bd-liste > summary { cursor: pointer; font-weight: 600; padding: 6px 0; }
@media (max-width: 600px) {
    .bd-kal-tag { min-height: 44px; padding: 2px 3px; }
    .bd-kal-name { font-size: 10.5px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
}
/* Bereitschaft: Monat/Woche, Bearbeiten im Kalender, Änderungsangaben (11.10.2026) */
.bd-umschalter { display: inline-flex; gap: 4px; margin-right: 8px; }
a.bd-kal-tag { color: inherit; text-decoration: none; cursor: pointer; }
a.bd-kal-tag:hover { filter: brightness(.95); }
.bd-kal-tag.bd-auswahl, tr.bd-auswahl td { outline: 2px solid #1C3B66; outline-offset: -2px; }
.bd-kal-aend { display: block; font-size: 10px; color: #555; margin-top: 2px; line-height: 1.15; }
.bd-chip { display: inline-block; padding: 2px 8px; border-radius: 4px; font-weight: 600; }
tr.bd-heute-zeile td { font-weight: 600; }
.bd-bearbeiten { border: 2px solid #1C3B66; border-radius: 6px; padding: 10px 14px; margin: 10px 0 14px; background: #FFFFFF; }
.bd-bearbeiten h2 { margin-top: 0; }
@media (max-width: 600px) { .bd-kal-aend { display: none; } .bd-kal-kopf { flex-wrap: wrap; } }
.bd-antrag { padding: 8px 0; border-bottom: 1px solid var(--linie); }
.bd-antrag:last-child { border-bottom: 0; }
.bd-umfang { display: flex; flex-direction: column; gap: 6px; margin: 4px 0 10px; }
.bd-umfang input[type=date] { width: auto; display: inline-block; }
.bd-kal-vt { display: block; font-size: 11px; line-height: 1.2; }
.bd-offen { color: #9A6700; font-style: italic; }
.bd-bitte { border-color: var(--rot); }
.bd-umfang input[type=time] { width: auto; display: inline-block; }
.bd-druck { display: inline-flex; gap: 4px; margin-left: auto; order: 9; }
