/* SupportHero - Custom Styles */

/* Prose fuer Kommentar-HTML */
.prose a { color: #2563eb; text-decoration: underline; }
.prose img { max-width: 100%; height: auto; border-radius: 0.5rem; }
.prose blockquote { border-left: 3px solid #d1d5db; padding-left: 1rem; color: #6b7280; }
.prose pre { background: #111827; color: #f9fafb; padding: 1rem; border-radius: 0.5rem; overflow-x: auto; font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, monospace; font-size: 0.875em; }
.prose pre code { background: transparent; color: inherit; padding: 0; font-size: inherit; }
.prose code { background: #f3f4f6; padding: 0.125rem 0.25rem; border-radius: 0.25rem; font-size: 0.875em; font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, monospace; }
.prose ul, .prose ol { padding-left: 1.5rem; margin: 0.75em 0; }
.prose ul { list-style-type: disc; }
.prose ol { list-style-type: decimal; }
.prose li { margin: 0.25em 0; }

/* Quill-Sub-Listen (Indent-Levels) — alphabetische/roemische Marker bei eingerueckten <li> */
.prose ol li.ql-indent-1, .ql-editor ol li.ql-indent-1 { list-style-type: lower-alpha; margin-left: 1.5em; }
.prose ol li.ql-indent-2, .ql-editor ol li.ql-indent-2 { list-style-type: lower-roman; margin-left: 3em; }
.prose ol li.ql-indent-3, .ql-editor ol li.ql-indent-3 { list-style-type: decimal;     margin-left: 4.5em; }
.prose ul li.ql-indent-1, .ql-editor ul li.ql-indent-1 { list-style-type: circle;  margin-left: 1.5em; }
.prose ul li.ql-indent-2, .ql-editor ul li.ql-indent-2 { list-style-type: square;  margin-left: 3em; }
.prose p { margin: 0.75em 0; }
.prose h1 { font-size: 1.875em; font-weight: 700; line-height: 1.2; margin: 1em 0 0.5em; }
.prose h2 { font-size: 1.5em;   font-weight: 700; line-height: 1.25; margin: 1em 0 0.5em; }
.prose h3 { font-size: 1.25em;  font-weight: 600; line-height: 1.3;  margin: 1em 0 0.5em; }
.prose h4 { font-size: 1.1em;   font-weight: 600; line-height: 1.35; margin: 1em 0 0.5em; }
.prose h5, .prose h6 { font-size: 1em; font-weight: 600; margin: 1em 0 0.5em; }
.prose strong, .prose b { font-weight: 700; }
.prose em, .prose i { font-style: italic; }
.prose u { text-decoration: underline; }
.prose s, .prose strike, .prose del { text-decoration: line-through; }
.prose hr { border: 0; border-top: 1px solid #e5e7eb; margin: 1.5em 0; }

/* Quill 2.x Code-Block-Container (erzeugt <div class="ql-code-block-container"><div class="ql-code-block">...</div></div>) */
.prose .ql-code-block-container { background: #111827; color: #f9fafb; padding: 1rem; border-radius: 0.5rem; overflow-x: auto; font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, monospace; font-size: 0.875em; margin: 0.75em 0; }
.prose .ql-code-block { white-space: pre; color: inherit; }

/* Wiki-Artikel Styles */
.prose figure { margin: 20px 0; text-align: center; }
.prose figure img { display: inline-block; }
.prose figcaption { font-size: 13px; color: #6b7280; margin-top: 8px; font-style: italic; }
.prose .wiki-hint { background: #eff6ff; border-left: 4px solid #3b82f6; padding: 12px 16px; border-radius: 0 8px 8px 0; margin: 16px 0; }
.prose .wiki-warning { background: #fef2f2; border-left: 4px solid #ef4444; padding: 12px 16px; border-radius: 0 8px 8px 0; margin: 16px 0; }
.prose table { border-collapse: collapse; width: 100%; margin: 16px 0; }
.prose td, .prose th { border: 1px solid #e2e8f0; padding: 8px 12px; text-align: left; }
.prose th { background: #f8fafc; font-weight: 600; }

/* Tabellen-Zeilen klickbar */
tr[onclick] { cursor: pointer; }

/* Smooth Transitions */
* { transition-property: color, background-color, border-color, box-shadow; transition-duration: 150ms; }

/* Scrollbar */
::-webkit-scrollbar { width: 8px; }
::-webkit-scrollbar-track { background: #f1f5f9; }
::-webkit-scrollbar-thumb { background: #94a3b8; border-radius: 4px; }
::-webkit-scrollbar-thumb:hover { background: #64748b; }

/* ===== DARK MODE ===== */
html.dark body { background: #0f172a; color: #e2e8f0; }

/* Hintergruende */
html.dark .bg-white { background: #1e293b !important; }
html.dark .bg-gray-50 { background: #0f172a !important; }
html.dark .bg-gray-100 { background: #1e293b !important; }

/* Texte */
html.dark .text-gray-900 { color: #f1f5f9 !important; }
html.dark .text-gray-800 { color: #e2e8f0 !important; }
html.dark .text-gray-700 { color: #cbd5e1 !important; }
html.dark .text-gray-600 { color: #94a3b8 !important; }
html.dark .text-gray-500 { color: #94a3b8 !important; }
html.dark .text-gray-400 { color: #64748b !important; }

/* Borders */
html.dark .border-gray-200 { border-color: #334155 !important; }
html.dark .border-gray-300 { border-color: #475569 !important; }
html.dark .border-gray-100 { border-color: #1e293b !important; }

/* Formularelemente */
html.dark input:not([type="checkbox"]):not([type="radio"]):not([type="file"]),
html.dark textarea,
html.dark select {
    background: #1e293b !important;
    border-color: #475569 !important;
    color: #e2e8f0 !important;
}
html.dark input::placeholder,
html.dark textarea::placeholder {
    color: #64748b !important;
}

/* Shadow-Cards */
html.dark .shadow-sm { box-shadow: 0 1px 2px rgba(0,0,0,0.3) !important; }
html.dark .shadow-lg { box-shadow: 0 4px 12px rgba(0,0,0,0.4) !important; }
html.dark .shadow-2xl { box-shadow: 0 8px 24px rgba(0,0,0,0.5) !important; }
html.dark .rounded-xl.shadow-sm { box-shadow: 0 1px 3px rgba(0,0,0,0.3) !important; }

/* Kommentar-Bubbles */
html.dark .bg-blue-50 { background: #1e3a5f !important; }
html.dark .bg-yellow-50 { background: #3d2e0a !important; }
/* Wand-Bildschirm (Einstellungen > System): Text auf den Pastellkarten. NUR in Verbindung mit dem Grund - ein globales
   .text-blue-800 haette die Rollen-Plaketten (bg-blue-100 text-blue-800, bleiben hell) unlesbar gemacht. */
html.dark .bg-blue-50.text-blue-800 { color: #bfdbfe !important; }
html.dark .bg-yellow-50.text-yellow-900 { color: #fef3c7 !important; }
html.dark .bg-blue-50.border-blue-200 { border-color: #1d4ed8 !important; }
html.dark .bg-yellow-50.border-yellow-200 { border-color: #854d0e !important; }
html.dark .bg-gray-50.border-gray-200 { background: #1e293b !important; }

/* Amber (Interne Notizen + Fortsetzungs-Hinweise): heller Pastell-Grund blieb
   hell, der aufgehellte gray-Text darauf war unlesbar -> Grund abdunkeln,
   amber-Akzentfarben anheben, damit sie auf dunklem Grund lesbar bleiben. */
html.dark .bg-amber-50     { background: #3d2e0a !important; }
html.dark .bg-amber-100    { background: #4a3a12 !important; }
html.dark .bg-amber-200    { background: #5a4a14 !important; }
html.dark .border-amber-200 { border-color: #854d0e !important; }
html.dark .text-amber-700  { color: #fbbf24 !important; }
html.dark .text-amber-800  { color: #fcd34d !important; }

/* Orange (v2.32.0, "Kunde nur telefonisch erreichbar"): gleiche Falle wie bei Amber -
   Pastellgrund bleibt sonst hell und der Text darauf unlesbar. */
html.dark .bg-orange-50      { background: #43260c !important; }
html.dark .bg-orange-100     { background: #52300f !important; }
html.dark .border-orange-200 { border-color: #9a3412 !important; }
html.dark .text-orange-700   { color: #fdba74 !important; }
html.dark .text-orange-800   { color: #fed7aa !important; }
html.dark .text-orange-900   { color: #ffedd5 !important; }

/* SLA-Highlights in Tickets-Liste (rot=ueberschritten, gelb=Risiko) */
html.dark .bg-red-50                  { background: #4c1d24 !important; }
html.dark .hover\:bg-red-100:hover    { background: #6b2229 !important; }
html.dark .hover\:bg-yellow-100:hover { background: #5a4310 !important; }
html.dark .border-red-400             { border-color: #dc2626 !important; }
html.dark .border-yellow-400          { border-color: #ca8a04 !important; }

/* Status-Badges (beibehalten — farbige Badges bleiben lesbar) */

/* Prose Dark */
html.dark .prose pre { background: #0f172a; }
html.dark .prose code { background: #334155; color: #e2e8f0; }
html.dark .prose blockquote { border-color: #475569; color: #94a3b8; }
html.dark .prose td, html.dark .prose th { border-color: #334155; }
html.dark .prose th { background: #1e293b; }
html.dark .prose .wiki-hint { background: #1e293b; border-color: #3b82f6; }
html.dark .prose .wiki-warning { background: #2d1b1b; border-color: #ef4444; }

/* Extern geliefertes E-Mail-/KI-HTML (z.B. AI-Voice-Receptionist) ist fuer
   HELLEN Grund gebaut: Tabellen-Layout mit inline background auf <td>/<table>,
   eigene Akzentfarben (oranger Header). Im Darkmode hellt html.dark den
   GEERBTEN Text (z.B. <ul><li> ohne eigene color) auf -> hell auf hellem
   Inline-Grund = unlesbar. Loesung: Grund belassen, Text auf JEDER inline-
   eingefaerbten Flaeche (td, table, div, p, ...) zurueck auf dunkel -> die Mail
   rendert wie im Lightmode. Kinder mit eigener color (weisser Text auf orangem
   Header, oranger Titel) bleiben unveraendert. */
html.dark .prose [style*="background"] {
    color: #1f2937 !important;
}
/* Der globale Tabellen-Hover (fuer echte Daten-Tabellen) darf die Zellen einer
   eingebetteten Mail OHNE eigenen Inline-Grund nicht beim Ueberfahren
   abdunkeln (sonst dunkler Fleck im sonst hellen Mail-Block). */
html.dark .prose tr:hover td {
    background-color: transparent;
}

/* Scrollbar Dark */
html.dark ::-webkit-scrollbar-track { background: #1e293b; }
html.dark ::-webkit-scrollbar-thumb { background: #475569; }
html.dark ::-webkit-scrollbar-thumb:hover { background: #64748b; }

/* Dropdown / Modals */
html.dark [class*="bg-white/"] { background: rgba(30,41,59,0.9) !important; }

/* Tabellen-Zeilen Hover */
html.dark tr:hover td { background: #1e293b; }

/* TKW-Referenztabelle */
html.dark .reftab th,
html.dark .reftab td                          { border-color: #334155; }
html.dark .reftab thead th                    { background: #1e293b; color: #cbd5e1; }
html.dark .reftab tbody tr:nth-child(odd) td  { background: #1a2436; }
html.dark .reftab tbody tr:nth-child(even) td { background: #0f172a; }
html.dark .reftab td.copy-cell:hover          { background: #1e3a5f !important; }
html.dark .reftab td.copy-cell.flash          { background: #14532d !important; }

/* Drag & Drop Zone */
.drop-zone-active {
    border: 2px dashed #3b82f6 !important;
    background: rgba(59,130,246,0.05) !important;
}
html.dark .drop-zone-active {
    background: rgba(59,130,246,0.15) !important;
}

/* ===== TEAM-CHAT (js/chat.js, seit 2.53.0) ===== */
.chat-ansicht { display: flex; flex-direction: column; min-height: 0; height: 100%; }
/* flex: none + nowrap: sonst schrumpft der Stand neben einer langen Online-Liste mit, und "verbunden" bricht unter den Punkt (2.57.0) */
.chat-liste { flex: 1; overflow-y: auto; padding: 12px 16px; display: flex; flex-direction: column; gap: 2px; }
.chat-leer { margin: auto; color: #94a3b8; font-size: 14px; text-align: center; }
.chat-tag { align-self: center; font-size: 11px; color: #64748b; background: #f1f5f9; border-radius: 999px; padding: 2px 10px; margin: 10px 0 6px; }
.chat-neu { display: flex; align-items: center; gap: 8px; color: #dc2626; font-size: 11px; font-weight: 600; margin: 6px 0; }
.chat-n { max-width: 85%; align-self: flex-start; margin-top: 8px; }
.chat-n.is-folge { margin-top: 2px; }
.chat-n.is-eigen { align-self: flex-end; }
.chat-n-hinweis { font-size: 11px; color: #94a3b8; text-align: right; margin-top: 2px; }
.chat-n.is-fehler .chat-n-hinweis { color: #dc2626; }
.chat-n-weg { text-decoration: underline; color: inherit; }
.chat-eingabe { display: flex; gap: 8px; padding: 10px 12px; border-top: 1px solid #e2e8f0; align-items: flex-end; }
.chat-feld { flex: 1; resize: none; border: 1px solid #cbd5e1; border-radius: 10px; padding: 8px 10px; font-size: 14px; line-height: 1.4; max-height: 140px; }
.chat-feld:focus { outline: 2px solid #3b82f6; outline-offset: -1px; border-color: transparent; }
.chat-senden { background: #2563eb; color: #fff; border-radius: 10px; padding: 8px 14px; font-size: 14px; font-weight: 500; }
.chat-senden:hover { background: #1d4ed8; }
.chat-karte-koerper { height: 520px; }
.chat-leiste { position: fixed; top: 0; right: 0; bottom: 0; width: min(400px, 100vw); background: #fff; box-shadow: -8px 0 24px rgba(15,23,42,.18); z-index: 60; display: flex; flex-direction: column; transform: translateX(105%); transition: transform 180ms ease; }
.chat-leiste.is-offen { transform: none; }
.chat-leiste-oben { display: flex; justify-content: space-between; align-items: center; padding: 12px 16px; background: #1d4ed8; color: #fff; }
.chat-leiste-zu { font-size: 22px; line-height: 1; color: #fff; padding: 0 4px; }
.chat-leiste-koerper { flex: 1; min-height: 0; }
.chat-zahl { position: absolute; top: -4px; right: -6px; min-width: 18px; height: 18px; padding: 0 4px; border-radius: 999px; background: #dc2626; color: #fff; font-size: 11px; font-weight: 700; line-height: 18px; text-align: center; }
.dash-tab { padding: 14px 4px; margin-bottom: -1px; border-bottom: 2px solid transparent; font-size: 15px; font-weight: 600; color: #64748b; display: inline-flex; align-items: center; gap: 6px; }
.dash-tab[aria-selected="true"] { color: #0f172a; border-bottom-color: #2563eb; }
.dash-tab-zahl { font-size: 11px; font-weight: 700; border-radius: 999px; padding: 1px 7px; background: #e2e8f0; color: #334155; }
.dash-tab-zahl.is-rot { background: #dc2626; color: #fff; }
@media (prefers-reduced-motion: reduce) { .chat-leiste { transition: none; } }
html.dark .chat-tag { background: #1e293b; color: #94a3b8; }
html.dark .chat-eingabe { border-color: #334155; }
html.dark .chat-leiste { background: #0f172a; }
html.dark .dash-tab[aria-selected="true"] { color: #f1f5f9; }
html.dark .dash-tab-zahl { background: #334155; color: #e2e8f0; }
.chat-n { position: relative; }
/* Dateien im Team-Chat (seit 2.54.0) */
.chat-anhang { font-size: 18px; line-height: 1; padding: 8px 6px; border-radius: 10px; color: #475569; }
.chat-anhang:hover { background: #f1f5f9; }
.chat-anhang:disabled { opacity: .4; cursor: not-allowed; }
.chat-ansicht.is-ziehen .chat-liste { outline: 2px dashed #3b82f6; outline-offset: -8px; background: #eff6ff; }
.chat-datei { display: flex; flex-direction: column; gap: 4px; max-width: 280px; }
.chat-bild { max-width: 280px; max-height: 200px; border-radius: 10px; cursor: zoom-in; object-fit: contain; background: #f1f5f9; }
.chat-datei-knopf { box-sizing: border-box; display: flex; align-items: center; gap: 8px; width: 100%; text-align: left; background: #fff; border: 1px solid #e2e8f0; border-radius: 10px; padding: 7px 10px; font-size: 13px; color: #0f172a; }
button.chat-datei-knopf:hover:not(:disabled) { border-color: #3b82f6; background: #eff6ff; }
/* 2.60.0: PDF - Dateizeile (Herunterladen) und "Ansehen" (neuer Tab) nebeneinander */
.chat-datei-zeile { display: flex; gap: 6px; align-items: stretch; }
.chat-datei-zeile .chat-datei-knopf { flex: 1; min-width: 0; }
.chat-datei-ansehen { flex: none; background: #fff; border: 1px solid #e2e8f0; border-radius: 10px; padding: 0 10px; font-size: 12px; font-weight: 500; color: #1d4ed8; cursor: pointer; }
.chat-datei-ansehen:hover { border-color: #3b82f6; background: #eff6ff; }
.chat-datei-symbol { font-size: 18px; line-height: 1; }
.chat-datei-name { flex: 1; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-weight: 500; }
.chat-datei-groesse { color: #64748b; font-size: 11px; white-space: nowrap; }
.chat-datei.is-abgelaufen .chat-datei-knopf { color: #94a3b8; border-style: dashed; cursor: default; }
.chat-datei.is-abgelaufen .chat-datei-name { text-decoration: line-through; font-weight: 400; }
.chat-balken { height: 4px; border-radius: 999px; background: #e2e8f0; overflow: hidden; }
.chat-balken-fuellung { height: 100%; width: 0; background: #2563eb; transition: width 150ms linear; }
.chat-n.is-fehler .chat-datei-knopf { border-color: #fecaca; background: #fef2f2; }
html.dark .chat-anhang { color: #94a3b8; }
html.dark .chat-anhang:hover { background: #1e293b; }
html.dark .chat-ansicht.is-ziehen .chat-liste { background: #172554; }
html.dark .chat-bild { background: #1e293b; }
html.dark .chat-datei-knopf { background: #1e293b; border-color: #334155; color: #f1f5f9; }
html.dark button.chat-datei-knopf:hover:not(:disabled) { background: #172554; border-color: #3b82f6; }
html.dark .chat-datei-groesse { color: #94a3b8; }
html.dark .chat-datei-ansehen { background: #1e293b; border-color: #334155; color: #93c5fd; }
html.dark .chat-datei-ansehen:hover { background: #172554; border-color: #3b82f6; }
html.dark .chat-datei.is-abgelaufen .chat-datei-knopf { color: #64748b; }
html.dark .chat-balken { background: #334155; }
html.dark .chat-n.is-fehler .chat-datei-knopf { background: #450a0a; border-color: #7f1d1d; }
/* Loesch-Rueckfrage im Chat statt confirm() (2.54.2) */
.chat-n-frage { display: flex; justify-content: flex-end; align-items: center; gap: 6px; flex-wrap: wrap; margin-top: 4px; font-size: 12px; color: #475569; }
.chat-n-ja { background: #dc2626; color: #fff; border-radius: 6px; padding: 2px 10px; font-size: 12px; font-weight: 600; }
.chat-n-ja:hover { background: #b91c1c; }
html.dark .chat-n-frage { color: #cbd5e1; }
/* Dashboard: Chat fuellt die ganze Karte (Grid streckt sie auf die Hoehe der rechten Spalte).
   Absolut positioniert, damit ein langer Verlauf die Zeile nicht aufblaeht (2.54.2). */
.dash-chat-karte { display: flex; flex-direction: column; }
.dash-chat-karte #dashPanelChat { flex: 1 1 auto; height: auto; min-height: 520px; position: relative; }
.dash-chat-karte #dashPanelChat > #chatKarte { position: absolute; inset: 0; height: auto; }
/* Team-Chat Etappe 2 (2.55.0): Gespraechsliste, Direkt/Gruppe, @Erwaehnungen, #1234 */
.chat-rumpf { flex: 1; min-height: 0; display: flex; }
/* Knoepfe ohne Tailwind-Preflight nicht dem Browser-Standard ueberlassen (hell auf hell im Darkmode) */
.chat-gzeile, .chat-neu-knopf, .chat-zurueck, .chat-vorschlag-eintrag { background: transparent; border: 0; color: inherit; font: inherit; cursor: pointer; }
.chat-seite { display: flex; flex-direction: column; min-height: 0; width: 100%; }
.chat-haupt { display: flex; flex-direction: column; min-height: 0; min-width: 0; flex: 1; }
.chat-ansicht.is-breit .chat-seite { flex: 0 0 240px; width: 240px; border-right: 1px solid #e2e8f0; }
.chat-ansicht[data-ebene="liste"] .chat-haupt { display: none; }
.chat-ansicht[data-ebene="gespraech"] .chat-seite { display: none; }
.chat-seite-oben { display: flex; justify-content: space-between; align-items: center; padding: 8px 12px 6px; font-size: 13px; color: #334155; }
.chat-neu-knopf { font-size: 12px; font-weight: 600; color: #2563eb; padding: 3px 8px; border-radius: 6px; }
.chat-neu-knopf:hover { background: #eff6ff; }
.chat-gliste { flex: 1; min-height: 0; overflow-y: auto; padding: 0 6px 8px; }
.chat-gzeile { display: flex; flex-direction: column; gap: 2px; width: 100%; text-align: left; padding: 8px 10px; border-radius: 8px; }
.chat-gzeile:hover { background: #f1f5f9; }
.chat-gzeile.is-aktiv { background: #eff6ff; }
.chat-gzeile-oben, .chat-gzeile-unten { display: flex; gap: 6px; align-items: center; min-width: 0; }
.chat-gzeile-oben { justify-content: space-between; }
.chat-gzeile-name { display: flex; align-items: center; gap: 6px; min-width: 0; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; font-size: 14px; font-weight: 500; color: #0f172a; }
.chat-gzeile.is-ungelesen .chat-gzeile-name { font-weight: 700; }
.chat-gzeile-zeit { flex: none; font-size: 11px; color: #94a3b8; }
.chat-gzeile-text { flex: 1; min-width: 0; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; font-size: 12px; color: #64748b; }
.chat-gzeile-zahl, .chat-gzeile-erw { flex: none; min-width: 18px; height: 18px; padding: 0 5px; border-radius: 999px; background: #dc2626; color: #fff; font-size: 11px; font-weight: 700; line-height: 18px; text-align: center; }
.chat-gzeile-erw { background: #f59e0b; }
.chat-punkt { display: inline-block; flex: none; width: 8px; height: 8px; border-radius: 50%; background: #cbd5e1; }
.chat-punkt.is-an { background: #16a34a; }
.chat-gkopf { display: flex; align-items: center; gap: 10px; padding: 6px 12px; border-bottom: 1px solid #f1f5f9; min-height: 40px; }
.chat-gkopf-name { display: flex; align-items: center; gap: 6px; flex: 1; min-width: 0; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; font-size: 14px; font-weight: 600; color: #0f172a; }
.chat-gkopf-info { font-size: 12px; color: #16a34a; }
.chat-zurueck { flex: none; font-size: 13px; font-weight: 500; color: #2563eb; white-space: nowrap; }
.chat-zurueck:hover { text-decoration: underline; }
.chat-knopf-leise, .chat-knopf-rot-leise { flex: none; font-size: 12px; color: #475569; background: #fff; border: 1px solid #e2e8f0; border-radius: 6px; padding: 3px 9px; }
.chat-knopf-leise:hover { border-color: #94a3b8; }
.chat-knopf-rot-leise { color: #dc2626; }
.chat-knopf-rot-leise:hover { border-color: #fca5a5; background: #fef2f2; }
.chat-knopf-haupt, .chat-knopf-rot { flex: none; font-size: 13px; font-weight: 600; color: #fff; background: #2563eb; border-radius: 8px; padding: 5px 12px; }
.chat-knopf-haupt:hover { background: #1d4ed8; }
.chat-knopf-haupt:disabled { opacity: .5; cursor: not-allowed; }
.chat-knopf-rot { background: #dc2626; }
.chat-knopf-rot:hover { background: #b91c1c; }
.chat-tafel { display: flex; flex-direction: column; gap: 8px; max-height: 60%; overflow-y: auto; padding: 10px 12px; border-bottom: 1px solid #e2e8f0; background: #f8fafc; font-size: 13px; color: #334155; }
.chat-tafel[hidden], .chat-vorschlag[hidden], .chat-wahl-zeile[hidden] { display: none; }
.chat-seite .chat-tafel { max-height: none; flex: none; }
.chat-tafel-titel { font-weight: 600; color: #0f172a; }
.chat-tafel-zeile { display: flex; gap: 8px; }
.chat-tafel-zeile .chat-suche { flex: 1; }
.chat-tafel-knoepfe { display: flex; justify-content: flex-end; align-items: center; gap: 8px; flex-wrap: wrap; }
.chat-tafel-hinweis { font-size: 12px; color: #64748b; }
.chat-suche { box-sizing: border-box; width: 100%; border: 1px solid #cbd5e1; border-radius: 8px; padding: 5px 9px; font-size: 13px; background: #fff; color: #0f172a; }
.chat-suche:focus { outline: 2px solid #3b82f6; outline-offset: -1px; border-color: transparent; }
.chat-wahl { display: flex; flex-direction: column; gap: 6px; }
.chat-wahl-liste { max-height: 180px; overflow-y: auto; padding: 4px; border: 1px solid #e2e8f0; border-radius: 8px; background: #fff; }
.chat-wahl-zeile { display: flex; align-items: center; gap: 8px; padding: 4px 6px; border-radius: 6px; cursor: pointer; }
.chat-wahl-zeile:hover { background: #f1f5f9; }
.chat-leer-klein { padding: 6px; font-size: 12px; color: #94a3b8; }
.chat-mitglieder { display: flex; flex-direction: column; gap: 4px; }
.chat-mitglied { display: flex; align-items: center; gap: 8px; }
.chat-mitglied-name { flex: 1; min-width: 0; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; }
.chat-mitglied-rolle { font-size: 11px; color: #64748b; }
.chat-hinzu > summary { cursor: pointer; color: #2563eb; font-weight: 500; }
.chat-hinzu[open] > summary { margin-bottom: 6px; }
.chat-hinzu .chat-knopf-haupt { margin-top: 6px; }
.chat-eingabe { position: relative; }
.chat-vorschlag { position: absolute; left: 12px; right: 12px; bottom: 100%; margin-bottom: 4px; z-index: 5; display: flex; flex-direction: column; padding: 4px; background: #fff; border: 1px solid #e2e8f0; border-radius: 10px; box-shadow: 0 8px 24px rgba(15,23,42,.15); }
.chat-vorschlag-eintrag { text-align: left; padding: 6px 10px; border-radius: 6px; font-size: 13px; color: #0f172a; }
.chat-vorschlag-eintrag.is-aktiv { background: #eff6ff; color: #1d4ed8; }
.chat-erw { font-weight: 600; color: #1d4ed8; }
.chat-erw.is-ich { background: #fef3c7; color: #92400e; border-radius: 4px; padding: 0 2px; }
.chat-ticket { font-weight: 600; color: #1d4ed8; text-decoration: underline; }
.chat-ticketkarte { box-sizing: border-box; display: flex; flex-wrap: wrap; align-items: baseline; gap: 2px 8px; max-width: 320px; margin-top: 4px; padding: 6px 10px; border: 1px solid #e2e8f0; border-radius: 10px; background: #fff; font-size: 12px; color: #0f172a; text-decoration: none; }
.chat-ticketkarte:hover { border-color: #3b82f6; background: #eff6ff; }
.chat-ticketkarte-nr { font-weight: 700; color: #1d4ed8; }
.chat-ticketkarte-betreff { flex: 1; min-width: 0; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; }
.chat-ticketkarte-status { border-radius: 999px; padding: 0 7px; font-size: 11px; font-weight: 600; background: #f1f5f9; color: #475569; }
.chat-ticketkarte-status.is-offen { background: #dbeafe; color: #1e40af; }
.chat-ticketkarte-status.is-arbeit { background: #fef9c3; color: #854d0e; }
.chat-ticketkarte-status.is-wartend { background: #f3e8ff; color: #6b21a8; }
.chat-ticketkarte-status.is-geloest { background: #dcfce7; color: #166534; }
.chat-ticketkarte-kunde { width: 100%; color: #64748b; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; }
html.dark .chat-ansicht.is-breit .chat-seite { border-color: #334155; }
html.dark .chat-seite-oben { color: #cbd5e1; }
html.dark .chat-neu-knopf { color: #93c5fd; }
html.dark .chat-neu-knopf:hover, html.dark .chat-gzeile:hover { background: #1e293b; }
html.dark .chat-gzeile.is-aktiv { background: #172554; }
html.dark .chat-gzeile-name, html.dark .chat-gkopf-name, html.dark .chat-tafel-titel { color: #f1f5f9; }
html.dark .chat-gzeile-text { color: #94a3b8; }
html.dark .chat-punkt { background: #475569; }
html.dark .chat-punkt.is-an { background: #22c55e; }
html.dark .chat-gkopf { border-color: #1e293b; }
html.dark .chat-zurueck, html.dark .chat-hinzu > summary { color: #93c5fd; }
html.dark .chat-knopf-leise, html.dark .chat-knopf-rot-leise { background: #1e293b; border-color: #334155; color: #cbd5e1; }
html.dark .chat-knopf-rot-leise { color: #fca5a5; }
html.dark .chat-knopf-rot-leise:hover { background: #450a0a; border-color: #7f1d1d; }
html.dark .chat-tafel { background: #0b1222; border-color: #334155; color: #cbd5e1; }
html.dark .chat-tafel-hinweis, html.dark .chat-mitglied-rolle { color: #94a3b8; }
html.dark .chat-suche, html.dark .chat-wahl-liste { background: #1e293b; border-color: #334155; color: #f1f5f9; }
html.dark .chat-wahl-zeile:hover { background: #334155; }
html.dark .chat-vorschlag { background: #1e293b; border-color: #334155; }
html.dark .chat-vorschlag-eintrag { color: #f1f5f9; }
html.dark .chat-vorschlag-eintrag.is-aktiv { background: #172554; color: #bfdbfe; }
html.dark .chat-erw, html.dark .chat-ticket { color: #93c5fd; }
html.dark .chat-erw.is-ich { background: #78350f; color: #fef3c7; }
html.dark .chat-ticketkarte { background: #1e293b; border-color: #334155; color: #f1f5f9; }
html.dark .chat-ticketkarte:hover { background: #172554; border-color: #3b82f6; }
html.dark .chat-ticketkarte-nr { color: #93c5fd; }
html.dark .chat-ticketkarte-kunde { color: #94a3b8; }
html.dark .chat-ticketkarte-status { background: #334155; color: #e2e8f0; }
html.dark .chat-ticketkarte-status.is-offen { background: #1e3a8a; color: #dbeafe; }
html.dark .chat-ticketkarte-status.is-arbeit { background: #713f12; color: #fef9c3; }
html.dark .chat-ticketkarte-status.is-wartend { background: #581c87; color: #f3e8ff; }
html.dark .chat-ticketkarte-status.is-geloest { background: #14532d; color: #dcfce7; }
/* Team-Chat Etappe 3 "Wer ist woran" (2.57.0): Reiter Team, eigener Status, Kopf im Direktgespraech */
.chat-reiter-knopf, .chat-tzeile-name { background: transparent; border: 0; color: inherit; font: inherit; cursor: pointer; }
.chat-reiter { display: flex; gap: 2px; }
.chat-reiter-knopf { font-size: 13px; font-weight: 600; color: #64748b; padding: 3px 8px; border-radius: 6px; }
.chat-reiter-knopf:hover { background: #f1f5f9; }
.chat-reiter-knopf.is-aktiv { color: #0f172a; background: #eff6ff; box-shadow: inset 0 -2px 0 #2563eb; }
.chat-team[hidden], .chat-gliste[hidden], .chat-neu-knopf[hidden] { display: none; }
.chat-team { flex: 1; min-height: 0; display: flex; flex-direction: column; overflow-y: auto; }
.chat-meinstatus { display: flex; flex-direction: column; gap: 6px; margin: 0 6px 8px; padding: 8px 10px; border: 1px solid #e2e8f0; border-radius: 10px; background: #f8fafc; font-size: 13px; color: #334155; }
.chat-status-wahl { flex: 1; min-width: 0; }
.chat-status-ok { min-height: 14px; font-size: 11px; color: #16a34a; }
.chat-tliste { display: flex; flex-direction: column; padding: 0 6px; }
.chat-tzeile { display: flex; flex-direction: column; gap: 2px; padding: 6px 10px; border-radius: 8px; }
.chat-tzeile:hover { background: #f8fafc; }
.chat-tzeile-name { display: flex; align-items: center; gap: 6px; min-width: 0; padding: 0; text-align: left; font-size: 14px; font-weight: 500; color: #0f172a; }
.chat-tzeile-name:hover .chat-tzeile-text { text-decoration: underline; }
.chat-tzeile-text { min-width: 0; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; }
.chat-tzeile.is-weg .chat-tzeile-name { color: #94a3b8; font-weight: 400; }
.chat-tzeile-unten { display: flex; flex-wrap: wrap; align-items: center; gap: 4px 8px; padding-left: 14px; font-size: 12px; color: #64748b; min-width: 0; }
.chat-tstatus { border-radius: 999px; padding: 0 7px; background: #f1f5f9; color: #475569; max-width: 100%; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; }
.chat-tstatus.is-telefon { background: #dbeafe; color: #1e40af; }
.chat-tstatus.is-pause { background: #fef9c3; color: #854d0e; }
.chat-tstatus.is-termin { background: #f3e8ff; color: #6b21a8; }
.chat-tstatus.is-ausser_haus { background: #fee2e2; color: #991b1b; }
.chat-woran { min-width: 0; max-width: 100%; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; }
.chat-woran-ticket { color: #1d4ed8; text-decoration: none; }
.chat-woran-ticket:hover { text-decoration: underline; }
.chat-team-hinweis { margin: auto 12px 8px; padding-top: 10px; font-size: 11px; color: #94a3b8; }
.chat-gkopf-mitte { display: flex; flex-direction: column; flex: 1; min-width: 0; }
.chat-gkopf-mitte .chat-gkopf-name { flex: none; }
.chat-gkopf-info { font-size: 12px; color: #64748b; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; min-width: 0; }
.chat-gkopf-online { color: #16a34a; }
html.dark .chat-reiter-knopf { color: #94a3b8; }
html.dark .chat-reiter-knopf:hover { background: #1e293b; }
html.dark .chat-reiter-knopf.is-aktiv { color: #f1f5f9; background: #172554; }
html.dark .chat-meinstatus { background: #0b1222; border-color: #334155; color: #cbd5e1; }
html.dark .chat-tzeile:hover { background: #1e293b; }
html.dark .chat-tzeile-name { color: #f1f5f9; }
html.dark .chat-tzeile.is-weg .chat-tzeile-name { color: #64748b; }
html.dark .chat-tzeile-unten, html.dark .chat-gkopf-info { color: #94a3b8; }
html.dark .chat-tstatus { background: #334155; color: #e2e8f0; }
html.dark .chat-tstatus.is-telefon { background: #1e3a8a; color: #dbeafe; }
html.dark .chat-tstatus.is-pause { background: #713f12; color: #fef9c3; }
html.dark .chat-tstatus.is-termin { background: #581c87; color: #f3e8ff; }
html.dark .chat-tstatus.is-ausser_haus { background: #7f1d1d; color: #fee2e2; }
html.dark .chat-woran-ticket { color: #93c5fd; }
html.dark .chat-gkopf-online { color: #22c55e; }
/* Ticketliste: wer hat das Ticket gerade vorn offen (js/woran.js, 2.57.0) */
.woran-plaetze { display: inline-flex; gap: 3px; margin-left: 6px; vertical-align: middle; }
.woran-plaetze:empty { display: none; }
.woran-kuerzel { display: inline-block; min-width: 22px; height: 18px; padding: 0 5px; border-radius: 999px; background: #dbeafe; color: #1e40af; font-size: 10px; font-weight: 700; line-height: 18px; text-align: center; letter-spacing: .02em; }
.woran-kuerzel.is-schreibt { background: #fed7aa; color: #9a3412; }
html.dark .woran-kuerzel { background: #1e3a8a; color: #dbeafe; }
html.dark .woran-kuerzel.is-schreibt { background: #7c2d12; color: #ffedd5; }
/* Team-Chat Etappe 4 (2.58.0): Reiter Heute, Pin-Streifen, Anheften, Uebergabe */
.chat-reiter-zahl { margin-left: 5px; min-width: 16px; height: 16px; padding: 0 4px; border-radius: 999px; background: #dc2626; color: #fff; font-size: 10px; font-weight: 700; line-height: 16px; display: inline-block; text-align: center; }
.chat-reiter-zahl[hidden], .chat-heute[hidden], .chat-pins[hidden] { display: none; }
/* Praxis-Chat (2.59.0, Etappe 6): Reiter Praxen, wartende Praxen, Nachrichten der Praxis */
.chat-gzeile.is-wartet .chat-gzeile-text { color: #b45309; }
.chat-gzeile.is-rot { background: #fef2f2; box-shadow: inset 3px 0 0 #dc2626; }
.chat-gzeile.is-rot .chat-gzeile-text { color: #b91c1c; font-weight: 600; }
.chat-n-ticket { font-weight: 600; }
html.dark .chat-gzeile.is-rot { background: #450a0a; }
html.dark .chat-gzeile.is-wartet .chat-gzeile-text { color: #fbbf24; }
html.dark .chat-gzeile.is-rot .chat-gzeile-text { color: #fca5a5; }   /* nach is-wartet: rot gewinnt */
/* Praxis-Uebersicht (2.62.0): wartende Praxen sofort sichtbar, Filter, Gruppen, Erledigt/Zustaendig */
.chat-gzeile.is-wartet { background: #fffbeb; box-shadow: inset 3px 0 0 #f59e0b; }
.chat-gzeile.is-wartet .chat-gzeile-text { font-weight: 600; }
.chat-gzeile.is-wartet.is-aktiv { background: #fef3c7; }
.chat-gzeile.is-wartet.is-rot { background: #fef2f2; box-shadow: inset 3px 0 0 #dc2626; }   /* rot gewinnt ueber wartet */
.chat-gzeile.is-rot.is-aktiv { background: #fee2e2; }
.chat-gzeile.is-erledigt .chat-gzeile-name, .chat-gzeile.is-erledigt .chat-gzeile-text { color: #94a3b8; }
.chat-gzeile-wer { flex: none; font-size: 10px; font-weight: 600; color: #475569; background: #f1f5f9; border-radius: 999px; padding: 1px 6px; max-width: 70px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.chat-gzeile-wer.is-ich { background: #dbeafe; color: #1d4ed8; }
.chat-gzeile-oben .chat-gzeile-name { flex: 1; }
.chat-reiter-zahl.is-praxis { background: #f59e0b; }
.chat-reiter-zahl.is-praxis.is-rot { background: #dc2626; }
.chat-pgruppe { font-size: 11px; font-weight: 600; text-transform: uppercase; letter-spacing: .04em; color: #94a3b8; padding: 8px 10px 2px; }
.chat-pgruppe.is-wartet { color: #b45309; }
.chat-pmehr { width: 100%; font-size: 12px; color: #2563eb; padding: 8px; border: 0; border-radius: 8px; background: transparent; }
.chat-pmehr:hover { background: #eff6ff; }
.chat-praxis-knopf { display: inline-flex; align-items: center; gap: 3px; font-size: 12px; font-weight: 700; line-height: 1; padding: 4px 8px; border-radius: 999px; background: #f59e0b; color: #fff; animation: chat-praxis-puls 2s ease-in-out infinite; }
.chat-praxis-knopf.is-rot { background: #dc2626; }
.chat-praxis-knopf[hidden] { display: none; }
@keyframes chat-praxis-puls { 50% { box-shadow: 0 0 0 4px rgba(245, 158, 11, .35); } }
@media (prefers-reduced-motion: reduce) { .chat-praxis-knopf { animation: none; } }
.dash-tab-zahl.is-praxis { background: #f59e0b; color: #fff; }
.dash-tab-zahl.is-praxis.is-rot { background: #dc2626; }
html.dark .chat-gzeile.is-wartet { background: #422006; }
html.dark .chat-gzeile.is-wartet.is-aktiv { background: #573010; }
html.dark .chat-gzeile.is-rot, html.dark .chat-gzeile.is-rot.is-aktiv { background: #450a0a; }
html.dark .chat-gzeile.is-erledigt .chat-gzeile-name, html.dark .chat-gzeile.is-erledigt .chat-gzeile-text { color: #64748b; }
html.dark .chat-gzeile-wer { background: #334155; color: #cbd5e1; }
html.dark .chat-gzeile-wer.is-ich { background: #1e3a8a; color: #bfdbfe; }
html.dark .chat-pmehr:hover { background: #1e293b; }
html.dark .chat-pgruppe { color: #64748b; }
html.dark .chat-pgruppe.is-wartet { color: #fbbf24; }
.chat-heute { flex: 1; min-height: 0; overflow-y: auto; display: flex; flex-direction: column; gap: 6px; padding: 0 8px 10px; }
.chat-uebergabe-neu { align-self: flex-start; }
.chat-heute .chat-tafel { border: 1px solid #e2e8f0; border-radius: 10px; }
.chat-heute-inhalt { display: flex; flex-direction: column; gap: 6px; }
.chat-heute-titel { margin-top: 8px; font-size: 11px; font-weight: 700; letter-spacing: .04em; text-transform: uppercase; color: #64748b; }
.chat-heute-gespraech { font-size: 12px; font-weight: 600; color: #334155; margin-top: 2px; }
.chat-uebergabe { border: 1px solid #fcd34d; background: #fffbeb; border-radius: 10px; padding: 8px 10px; display: flex; flex-direction: column; gap: 6px; font-size: 13px; color: #0f172a; }
.chat-uebergabe-kopf { display: flex; flex-wrap: wrap; gap: 4px 8px; font-size: 12px; color: #92400e; }
.chat-uebergabe-wer { font-weight: 600; }
.chat-uebergabe-text { white-space: pre-wrap; overflow-wrap: anywhere; line-height: 1.4; max-height: 220px; overflow-y: auto; }
.chat-uebernahme { display: flex; flex-wrap: wrap; align-items: center; gap: 6px 10px; font-size: 12px; color: #15803d; }
.chat-uebernahme-offen { color: #b45309; }
.chat-uebernehmen { font-size: 12px; padding: 3px 10px; }
.chat-uebergabe-feld { display: flex; flex-direction: column; gap: 3px; font-size: 12px; font-weight: 600; color: #334155; }
.chat-uebergabe-feld textarea { resize: vertical; font-weight: 400; font-family: inherit; line-height: 1.4; }
.chat-uebergabe-zaehler { font-size: 11px; color: #94a3b8; margin-right: auto; }
.chat-uebergabe-zaehler.is-zuviel { color: #dc2626; font-weight: 700; }
.chat-wv { display: grid; grid-template-columns: auto auto 1fr; gap: 0 8px; align-items: baseline; padding: 5px 8px; border-radius: 8px; border: 1px solid #e2e8f0; text-decoration: none; color: #0f172a; font-size: 13px; }
.chat-wv:hover { border-color: #93c5fd; background: #eff6ff; }
.chat-wv-zeit { font-variant-numeric: tabular-nums; color: #64748b; font-size: 12px; }
.chat-wv-nr { font-family: ui-monospace, monospace; font-size: 12px; color: #1d4ed8; }
.chat-wv-betreff { min-width: 0; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; }
.chat-wv-unten { grid-column: 2 / -1; font-size: 11px; color: #64748b; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; }
.chat-wv.is-faellig { border-color: #fca5a5; background: #fef2f2; }
.chat-wv.is-faellig .chat-wv-zeit, .chat-wv.is-faellig .chat-wv-unten { color: #b91c1c; font-weight: 600; }
.chat-heute-team summary { cursor: pointer; font-size: 12px; color: #475569; padding: 2px 0 4px; }
.chat-heute-team { display: flex; flex-direction: column; gap: 4px; }
.chat-heute-team > .chat-wv { margin-top: 4px; }
.chat-heute-pin { display: flex; flex-direction: column; gap: 1px; text-align: left; background: #fff; border: 1px solid #e2e8f0; border-radius: 8px; padding: 5px 8px; font: inherit; font-size: 13px; color: #0f172a; cursor: pointer; }
.chat-heute-pin:hover { border-color: #fcd34d; background: #fffbeb; }
.chat-heute-pin-wer { font-size: 11px; color: #64748b; }
.chat-heute-pin-text { overflow: hidden; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; white-space: pre-wrap; overflow-wrap: anywhere; }
.chat-pins { border-bottom: 1px solid #fde68a; background: #fffbeb; font-size: 13px; }
.chat-pins-knopf { display: flex; align-items: center; gap: 8px; width: 100%; padding: 5px 14px; background: transparent; border: 0; font: inherit; color: #92400e; cursor: pointer; text-align: left; }
.chat-pins-zahl { flex: none; font-weight: 600; }
.chat-pins-vorschau { flex: 1; min-width: 0; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; color: #78350f; }
.chat-pins-pfeil { margin-left: auto; }
.chat-pins-liste { max-height: 40vh; overflow-y: auto; display: flex; flex-direction: column; gap: 6px; padding: 0 12px 8px; }
.chat-pin { background: #fff; border: 1px solid #fde68a; border-radius: 8px; padding: 6px 9px; }
.chat-pin.is-uebergabe { border-color: #fbbf24; }
.chat-pin-kopf { font-size: 11px; font-weight: 600; color: #92400e; }
.chat-pin-text { white-space: pre-wrap; overflow-wrap: anywhere; line-height: 1.4; color: #0f172a; }
.chat-pin-unten { font-size: 11px; color: #94a3b8; margin-top: 2px; }
.chat-n.is-uebergabe { max-width: 92%; }
.chat-n-uebergabe-titel { font-size: 12px; font-weight: 700; color: #92400e; margin-bottom: 2px; }
.chat-n.is-eigen .chat-n-uebergabe-titel { text-align: right; }
.chat-n.is-uebergabe .chat-uebernahme { margin-top: 4px; }
html.dark .chat-heute-titel { color: #94a3b8; }
html.dark .chat-heute-gespraech { color: #cbd5e1; }
html.dark .chat-heute .chat-tafel { border-color: #334155; }
html.dark .chat-uebergabe { background: #2a1f06; border-color: #92400e; color: #fef3c7; }
html.dark .chat-uebergabe-kopf, html.dark .chat-n-uebergabe-titel, html.dark .chat-pin-kopf { color: #fcd34d; }
html.dark .chat-uebernahme { color: #86efac; }
html.dark .chat-uebernahme-offen { color: #fcd34d; }
html.dark .chat-uebergabe-feld { color: #cbd5e1; }
html.dark .chat-wv, html.dark .chat-heute-pin { border-color: #334155; color: #f1f5f9; background: transparent; }
html.dark .chat-wv:hover { background: #172554; border-color: #1d4ed8; }
html.dark .chat-wv-nr { color: #93c5fd; }
html.dark .chat-wv.is-faellig { background: #450a0a; border-color: #991b1b; }
html.dark .chat-wv.is-faellig .chat-wv-zeit, html.dark .chat-wv.is-faellig .chat-wv-unten { color: #fca5a5; }
html.dark .chat-heute-pin:hover { background: #2a1f06; border-color: #92400e; }
html.dark .chat-pins { background: #1c1403; border-color: #78350f; }
html.dark .chat-pins-knopf, html.dark .chat-pins-vorschau { color: #fcd34d; }
html.dark .chat-pin { background: #0f172a; border-color: #78350f; }
html.dark .chat-pin-text { color: #f1f5f9; }
/* Drei Reiter + Zahl + "+ Neu" muessen in die 240-px-Spalte der Karte passen, sonst brechen sie um */
.chat-seite-oben { flex-wrap: wrap; gap: 4px; padding-left: 8px; padding-right: 8px; }
.chat-reiter-knopf, .chat-neu-knopf { white-space: nowrap; }
.chat-reiter-knopf { padding: 3px 4px; font-size: 12px; }
.chat-reiter { gap: 0; }
.chat-neu-knopf { margin-left: auto; }
.chat-neu-knopf { padding: 3px 4px; }
/* Eigene Uebergabe steht auf Gelb statt Blau - die weissen Eigen-Links waeren dort unsichtbar */
.chat-n.is-eigen .chat-uebernahme { justify-content: flex-end; }
/* ===== Team-Chat im WhatsApp-Stil (2.63.0): eine Chatliste, Avatare, Blasen, Menues =====
   Steht NACH den alten Chat-Regeln und gewinnt dort, wo sie sich ueberschneiden (gleiche Spezifitaet). */
.chat-ansicht { background: #fff; color: #111b21; }
.chat-streifen { flex: none; padding: 6px 14px; font-size: 13px; background: #fff3c4; color: #54410a; border-bottom: 1px solid #f5d77a; }
.chat-streifen[hidden], .chat-chats[hidden], .chat-chips[hidden], .chat-ton[hidden] { display: none; }
.chat-streifen.is-aus { background: #f1f5f9; color: #475569; border-color: #e2e8f0; }
.chat-ansicht.is-breit .chat-seite { flex: 0 0 300px; width: 300px; border-right: 1px solid #e9edef; }
/* Symbolleiste: Chats · Heute · Team, Ton, + Neu */
.chat-seite-oben { flex-wrap: nowrap; gap: 4px; padding: 8px 10px; background: #f0f2f5; border-bottom: 1px solid #e9edef; }
.chat-reiter { flex: 1; min-width: 0; gap: 2px; }
.chat-reiter-knopf { position: relative; display: inline-flex; align-items: center; gap: 5px; padding: 5px 9px; border-radius: 999px; font-size: 13px; font-weight: 600; color: #54656f; box-shadow: none; }
.chat-reiter-knopf:hover { background: #e9edef; }
.chat-reiter-knopf.is-aktiv { background: #d9fdd3; color: #008069; box-shadow: none; }
.chat-reiter-symbol { font-size: 15px; line-height: 1; }
/* In der 300-px-Spalte nur beim gewaehlten Symbol die Beschriftung, sonst passt "+ Neu" nicht mehr daneben */
.chat-ansicht.is-breit .chat-reiter-knopf:not(.is-aktiv) .chat-reiter-text { display: none; }
.chat-reiter-zahl { margin-left: 0; background: #25d366; }
.chat-reiter-zahl.is-praxis { background: #f59e0b; }
.chat-reiter-zahl.is-praxis.is-rot { background: #dc2626; }
.chat-ton { flex: none; font-size: 15px; line-height: 1; padding: 5px 6px; border-radius: 999px; background: transparent; border: 0; cursor: pointer; }
.chat-ton:hover { background: #e9edef; }
.chat-neu-knopf { flex: none; font-size: 12px; font-weight: 600; color: #008069; padding: 5px 10px; border-radius: 999px; background: #fff; border: 1px solid #d1d7db; margin-left: 0; }
.chat-neu-knopf:hover { background: #f5f6f6; }
/* Suche und Filter-Chips */
.chat-chats { flex: 1; min-height: 0; display: flex; flex-direction: column; }
.chat-suche-rund { flex: none; width: auto; font-family: inherit; margin: 8px 10px 4px; border: 0; border-radius: 8px; background: #f0f2f5; padding: 7px 12px; font-size: 14px; }
.chat-suche-rund:focus { outline: 2px solid #00a884; outline-offset: -2px; }
.chat-chips { display: flex; flex-wrap: nowrap; gap: 5px; padding: 4px 10px 8px; overflow-x: auto; scrollbar-width: none; }
.chat-chip { flex: none; font: inherit; font-size: 12.5px; padding: 4px 10px; border-radius: 999px; background: #f0f2f5; color: #54656f; border: 0; cursor: pointer; }
.chat-chip:hover { background: #e9edef; }
.chat-chip.is-aktiv { background: #d9fdd3; color: #008069; font-weight: 600; }
/* Chatliste */
.chat-gliste { padding: 0; }
.chat-gzeile { flex-direction: row; align-items: center; gap: 12px; padding: 0 0 0 12px; border-radius: 0; }
.chat-gzeile-mitte { flex: 1; min-width: 0; display: flex; flex-direction: column; gap: 2px; padding: 10px 12px 10px 0; border-bottom: 1px solid #e9edef; }
.chat-gzeile:hover { background: #f5f6f6; }
.chat-gzeile.is-aktiv { background: #f0f2f5; }
.chat-gzeile-name { font-size: 15px; font-weight: 400; color: #111b21; }
.chat-gzeile.is-ungelesen .chat-gzeile-name { font-weight: 600; }
.chat-gzeile-zeit { font-size: 12px; color: #667781; }
.chat-gzeile.is-ungelesen .chat-gzeile-zeit { color: #1fa855; font-weight: 600; }
.chat-gzeile-text { font-size: 13px; color: #667781; }
.chat-gzeile-zahl { min-width: 20px; height: 20px; line-height: 20px; padding: 0 6px; background: #25d366; }
.chat-gzeile-erw { min-width: 20px; height: 20px; line-height: 20px; }
.chat-gzeile.is-wartet .chat-gzeile-zahl { background: #f59e0b; }
.chat-gzeile.is-rot .chat-gzeile-zahl { background: #dc2626; }
.chat-gzeile.is-wartet .chat-gzeile-text, .chat-gzeile.is-rot .chat-gzeile-text { color: #667781; font-weight: 400; }
.chat-gzeile.is-wartet.is-ungelesen .chat-gzeile-text { color: #111b21; font-weight: 600; }
.chat-gzeile-wartet { flex: none; font-size: 11px; font-weight: 700; color: #b45309; background: #fef3c7; border-radius: 999px; padding: 1px 7px; }
.chat-gzeile.is-rot .chat-gzeile-wartet { color: #b91c1c; background: #fee2e2; }
.chat-gzeile-haken { flex: none; font-size: 12px; font-weight: 700; color: #16a34a; }
/* Haekchen an eigenen Nachrichten (2.64.0): ✓ gesendet, ✓✓ grau zugestellt, ✓✓ blau gelesen - die zwei Haken ueberlappen wie bei WhatsApp */
.chat-haken { display: inline-block; margin-left: 3px; padding-right: 4px; font-size: 12px; font-weight: 700; letter-spacing: -4px; color: #8696a0; }
.chat-haken.is-gelesen { color: #53bdeb; }
.chat-gzeile-unten .chat-haken { flex: none; margin: 0 3px 0 0; font-size: 13px; }
/* "schreibt …" in Kopf und Liste (2.64.0) */
.chat-tippt { color: #1fa855; font-style: italic; }
.chat-gzeile-text.chat-tippt { color: #1fa855; font-weight: 400; }
.chat-gzeile.is-praxis .chat-gzeile-name { color: #0f766e; }
.chat-gzeile.is-praxis.is-erledigt .chat-gzeile-name { color: #64748b; }
/* Avatare: Kollegen in fester Farbe (f0..f9), Gruppe grau, Praxis tuerkis */
.chat-avatar { position: relative; flex: none; width: 44px; height: 44px; border-radius: 50%; display: inline-flex; align-items: center; justify-content: center; font-size: 15px; font-weight: 600; color: #fff; background: #dfe5e7; letter-spacing: .02em; user-select: none; line-height: 1; }
.chat-avatar.is-gruppe { color: #54656f; font-size: 20px; }
.chat-avatar.is-praxis { background: #14b8a6; font-size: 20px; box-shadow: 0 0 0 2px #99f6e4; }
.chat-avatar.is-klein { width: 30px; height: 30px; font-size: 11px; }
.chat-gkopf .chat-avatar { width: 40px; height: 40px; font-size: 14px; }
.chat-avatar-punkt { position: absolute; right: -1px; bottom: -1px; width: 12px; height: 12px; border-radius: 50%; background: #25d366; border: 2px solid #fff; }
.chat-avatar.is-klein .chat-avatar-punkt { width: 10px; height: 10px; }
.chat-avatar.f0 { background: #e17076; } .chat-avatar.f1 { background: #5fb94a; } .chat-avatar.f2 { background: #4f9fdc; }
.chat-avatar.f3 { background: #9483e0; } .chat-avatar.f4 { background: #e56aa3; } .chat-avatar.f5 { background: #3fb5b7; }
.chat-avatar.f6 { background: #f08c4f; } .chat-avatar.f7 { background: #5d8fc2; } .chat-avatar.f8 { background: #c0843e; }
.chat-avatar.f9 { background: #7c72e6; }
/* Archiv "Erledigte Praxen" */
.chat-archiv-zeile { display: flex; align-items: center; gap: 14px; width: 100%; padding: 11px 16px 11px 22px; background: transparent; border: 0; border-bottom: 1px solid #e9edef; cursor: pointer; font: inherit; color: #111b21; text-align: left; }
.chat-archiv-zeile:hover { background: #f5f6f6; }
.chat-archiv-zeile.is-offen { background: #f0f2f5; font-weight: 600; }
.chat-archiv-symbol { width: 22px; text-align: center; font-size: 17px; color: #008069; }
.chat-archiv-text { flex: 1; font-size: 15px; }
.chat-archiv-zahl { font-size: 12px; font-weight: 600; color: #1fa855; }
.chat-archiv-hinweis { padding: 8px 16px; font-size: 12px; color: #667781; text-align: center; }
.chat-pgruppe { color: #008069; padding: 12px 16px 6px; }
/* Kopf des Gespraechs */
.chat-gkopf { background: #f0f2f5; border-bottom: 1px solid #e9edef; padding: 8px 12px; min-height: 56px; gap: 10px; }
.chat-gkopf-name { font-size: 15px; font-weight: 600; color: #111b21; }
.chat-gkopf-info { font-size: 12.5px; color: #667781; }
.chat-gkopf-online { color: #008069; }
.chat-gkopf-praxis { color: #0f766e; font-weight: 600; }
.chat-zurueck { display: inline-flex; align-items: center; gap: 3px; font-size: 26px; line-height: 1; color: #54656f; padding: 0 2px 2px; }
.chat-zurueck:hover { text-decoration: none; color: #111b21; }
.chat-zurueck-zahl { font-size: 11px; font-weight: 700; background: #25d366; color: #fff; border-radius: 999px; min-width: 18px; height: 18px; line-height: 18px; padding: 0 5px; text-align: center; }
.chat-kopf-chips { display: flex; gap: 6px; flex: none; }
.chat-kopf-chip { font: inherit; font-size: 12.5px; font-weight: 600; padding: 5px 12px; border-radius: 999px; border: 1px solid #d1d7db; background: #fff; color: #111b21; cursor: pointer; white-space: nowrap; }
.chat-kopf-chip:hover { background: #f5f6f6; }
.chat-kopf-chip.is-erledigt { background: #00a884; border-color: #00a884; color: #fff; }
.chat-kopf-chip.is-erledigt:hover { background: #008069; }
/* Schmal (Seitenleiste): kleinere Chips, "Erledigt" nur als ✓ - sonst bleibt vom Praxisnamen nichts */
.chat-ansicht:not(.is-breit) .chat-kopf-chip { padding: 4px 9px; font-size: 12px; }
.chat-ansicht:not(.is-breit) .chat-kopf-chip-text { display: none; }
.chat-ansicht:not(.is-breit) .chat-gkopf { gap: 8px; padding-left: 6px; }
.chat-kopf-mehr { flex: none; font-size: 20px; line-height: 1; padding: 4px 9px; border-radius: 999px; color: #54656f; background: transparent; border: 0; cursor: pointer; }
.chat-kopf-mehr:hover, .chat-kopf-mehr[aria-expanded="true"], .chat-kopf-mehr.is-an { background: #e2e6e9; }
/* Verlauf: Blasen */
.chat-liste { background: #efeae2; padding: 10px 7% 12px; gap: 2px; }
.chat-ansicht:not(.is-breit) .chat-liste { padding: 8px 12px 10px; }
.chat-tag { background: #fff; color: #54656f; box-shadow: 0 1px .5px rgba(11, 20, 26, .13); font-size: 12px; padding: 4px 12px; border-radius: 8px; }
.chat-neu { align-self: center; background: rgba(255, 255, 255, .9); color: #54656f; padding: 4px 14px; border-radius: 999px; font-size: 12px; font-weight: 600; margin: 10px 0; }
.chat-n { max-width: 78%; margin-top: 8px; }
.chat-n.is-folge { margin-top: 2px; }
.chat-blase { position: relative; background: #fff; color: #111b21; border-radius: 8px; padding: 6px 9px 7px; box-shadow: 0 1px .5px rgba(11, 20, 26, .13); min-width: 70px; font-size: 14px; line-height: 1.4; }
.chat-n.is-eigen .chat-blase { background: #d9fdd3; }
.chat-blase.is-ecke { border-top-left-radius: 0; }
.chat-n.is-eigen .chat-blase.is-ecke { border-top-left-radius: 8px; border-top-right-radius: 0; }
/* Ecke: kleines Dreieck in der Farbe der Blase (background: inherit) */
.chat-blase.is-ecke::before { content: ''; position: absolute; top: 0; left: -7px; width: 8px; height: 12px; background: inherit; clip-path: polygon(0 0, 100% 0, 100% 100%); }
.chat-n.is-eigen .chat-blase.is-ecke::before { left: auto; right: -7px; clip-path: polygon(0 0, 100% 0, 0 100%); }
/* flow-root: die schwimmende Uhrzeit bleibt IN der Blase, auch wenn sie in eine eigene Zeile rutscht */
.chat-n-text { white-space: pre-wrap; overflow-wrap: anywhere; display: flow-root; }
.chat-n-text.is-geloescht { font-style: italic; color: #667781; }
/* Uhrzeit unten rechts: schwimmt ans Ende der letzten Zeile, bricht bei Platzmangel darunter */
.chat-n-meta { float: right; margin: 6px 0 -5px 10px; font-size: 11px; line-height: 15px; color: #667781; white-space: nowrap; user-select: none; font-style: normal; }
.chat-n-meta-zeile { text-align: right; margin-top: 3px; }
.chat-n-meta-zeile .chat-n-meta { float: none; margin: 0; }
.chat-n-name { font-size: 12.5px; font-weight: 600; line-height: 1.3; margin-bottom: 2px; color: #54656f; }
.chat-n-name.is-praxis { color: #0f766e; }
/* Automatische Antwort ausserhalb der Geschaeftszeiten (2.69.0): gedaempft, damit niemand sie fuer eine Kollegen-Antwort haelt */
.chat-n.is-system .chat-blase { background: #f0f2f5; color: #54656f; font-style: italic; }
.chat-n-name.is-system { color: #667781; font-style: normal; }
.chat-n-name.f0 { color: #c0392b; } .chat-n-name.f1 { color: #2e7d32; } .chat-n-name.f2 { color: #1565c0; }
.chat-n-name.f3 { color: #6a4bc4; } .chat-n-name.f4 { color: #c2185b; } .chat-n-name.f5 { color: #00838f; }
.chat-n-name.f6 { color: #c2530f; } .chat-n-name.f7 { color: #2c5d9c; } .chat-n-name.f8 { color: #8d5a1c; }
.chat-n-name.f9 { color: #4b3fc9; }
.chat-n.is-wartend .chat-blase { opacity: .7; }
.chat-n.is-fehler .chat-blase { background: #fee2e2; color: #991b1b; opacity: 1; }
.chat-n.is-erwaehnt:not(.is-eigen) .chat-blase { box-shadow: inset 3px 0 0 #f59e0b, 0 1px .5px rgba(11, 20, 26, .13); }
.chat-n.is-uebergabe { max-width: 92%; }
.chat-n.is-uebergabe .chat-blase { background: #fffbeb; border: 1px solid #fcd34d; }
.chat-n.is-uebergabe .chat-blase.is-ecke::before { display: none; }
.chat-n.is-blitz .chat-blase { outline: 3px solid #fbbf24; outline-offset: 2px; transition: outline-color 1.2s; }
.chat-erw, .chat-ticket { color: #027eb5; }
.chat-blase .chat-ticketkarte { margin-top: 6px; }
.chat-blase .chat-datei { max-width: 100%; }
.chat-blase .chat-bild { display: block; max-width: 100%; border-radius: 6px; }
.chat-blase .chat-datei-knopf, .chat-blase .chat-datei-ansehen { background: rgba(11, 20, 26, .05); border-color: transparent; }
.chat-n-frage { margin-top: 4px; }
.chat-n.is-eigen .chat-n-hinweis { text-align: right; }
.chat-n:not(.is-eigen) .chat-n-frage { justify-content: flex-start; }
/* ▾ an der Blase: erscheint beim Ueberfahren (Touch: immer, Dateien: immer - dort suchte man das Loeschen) */
.chat-blase-mehr { position: absolute; top: 2px; right: 2px; width: 24px; height: 20px; padding: 0; border: 0; border-radius: 0 6px 0 10px; background: inherit; color: #667781; font-size: 12px; line-height: 20px; cursor: pointer; opacity: 0; }
.chat-blase:hover .chat-blase-mehr, .chat-blase-mehr:focus-visible, .chat-blase-mehr[aria-expanded="true"], .chat-blase.is-datei .chat-blase-mehr { opacity: 1; }
@media (hover: none) { .chat-blase-mehr { opacity: .85; } .chat-blase.is-mehr { padding-right: 30px; } }
/* Wo das ▾ immer steht (Dateien, Touch), haelt die Blase Platz frei - sonst deckt es Namen/Dateinamen ab (Review 2.63.0) */
.chat-blase.is-mehr.is-datei { padding-right: 30px; }
/* Aufklappmenue (am body) */
.chat-menue { position: fixed; z-index: 80; min-width: 200px; max-width: 280px; padding: 6px 0; background: #fff; border-radius: 8px; box-shadow: 0 4px 18px rgba(11, 20, 26, .22); display: flex; flex-direction: column; }
.chat-menue-eintrag { font: inherit; font-size: 14px; text-align: left; padding: 9px 18px; color: #3b4a54; background: transparent; border: 0; cursor: pointer; }
.chat-menue-eintrag:hover, .chat-menue-eintrag:focus-visible { background: #f5f6f6; outline: none; }
.chat-menue-eintrag.is-rot { color: #dc2626; }
/* Eingabe: runde Zeile mit 📎, Feld, runder Senden-Knopf */
.chat-eingabe { background: #f0f2f5; border-top: 0; padding: 8px 12px; gap: 8px; align-items: flex-end; }
.chat-feld-rund { flex: 1; min-width: 0; display: flex; align-items: flex-end; gap: 2px; background: #fff; border-radius: 22px; padding: 3px 10px 3px 4px; }
.chat-feld-rund .chat-feld { border: 0; background: transparent; padding: 8px 4px; font: inherit; font-size: 14px; color: inherit; }
.chat-feld-rund .chat-feld:focus { outline: none; }
.chat-anhang { border: 0; background: transparent; border-radius: 999px; padding: 7px 8px; color: #54656f; cursor: pointer; }
.chat-anhang:hover { background: #f0f2f5; }
.chat-senden { flex: none; border: 0; cursor: pointer; width: 42px; height: 42px; border-radius: 50%; padding: 0; background: #00a884; color: #fff; font-size: 17px; display: inline-flex; align-items: center; justify-content: center; }
.chat-senden:hover { background: #008069; }
.chat-senden:disabled { opacity: .5; cursor: not-allowed; }
.chat-tzeile-unten { padding-left: 38px; }
.chat-tzeile-name { gap: 8px; }
/* Darkmode im WhatsApp-Dunkel-Stil */
html.dark .chat-ansicht, html.dark .chat-leiste { background: #111b21; color: #e9edef; }
html.dark .chat-streifen { background: #3b3212; color: #fde68a; border-color: #5c4a12; }
html.dark .chat-streifen.is-aus { background: #1e293b; color: #94a3b8; border-color: #334155; }
html.dark .chat-ansicht.is-breit .chat-seite { border-color: #222d34; }
html.dark .chat-seite-oben, html.dark .chat-gkopf, html.dark .chat-eingabe { background: #202c33; border-color: #222d34; }
html.dark .chat-reiter-knopf { color: #aebac1; }
html.dark .chat-reiter-knopf:hover, html.dark .chat-ton:hover { background: #2a3942; }
html.dark .chat-reiter-knopf.is-aktiv { background: #0a332c; color: #00a884; }
html.dark .chat-neu-knopf { background: #2a3942; border-color: #2a3942; color: #00a884; }
html.dark .chat-neu-knopf:hover { background: #374248; }
html.dark .chat-suche-rund { background: #202c33 !important; color: #e9edef !important; border-color: transparent !important; }
html.dark .chat-chip { background: #202c33; color: #aebac1; }
html.dark .chat-chip:hover { background: #2a3942; }
html.dark .chat-chip.is-aktiv { background: #0a332c; color: #00a884; }
html.dark .chat-gzeile-mitte, html.dark .chat-archiv-zeile { border-color: #222d34; }
html.dark .chat-gzeile:hover, html.dark .chat-archiv-zeile:hover { background: #202c33; }
html.dark .chat-gzeile.is-aktiv, html.dark .chat-archiv-zeile.is-offen { background: #2a3942; }
html.dark .chat-gzeile-name, html.dark .chat-archiv-zeile { color: #e9edef; }
html.dark .chat-gzeile-text, html.dark .chat-gzeile-zeit, html.dark .chat-archiv-hinweis { color: #8696a0; }
html.dark .chat-gzeile.is-ungelesen .chat-gzeile-zeit, html.dark .chat-archiv-zahl, html.dark .chat-archiv-symbol, html.dark .chat-pgruppe { color: #00a884; }
html.dark .chat-gzeile-zahl { background: #00a884; color: #111b21; }
html.dark .chat-gzeile.is-wartet .chat-gzeile-zahl { background: #f59e0b; color: #111b21; }
html.dark .chat-gzeile.is-rot .chat-gzeile-zahl { background: #ef4444; color: #fff; }
html.dark .chat-gzeile.is-wartet, html.dark .chat-gzeile.is-wartet.is-aktiv { background: #2b230c; }
html.dark .chat-gzeile.is-rot, html.dark .chat-gzeile.is-rot.is-aktiv { background: #3a1212; }
html.dark .chat-gzeile.is-wartet .chat-gzeile-text, html.dark .chat-gzeile.is-rot .chat-gzeile-text { color: #8696a0; }
html.dark .chat-gzeile.is-wartet.is-ungelesen .chat-gzeile-text { color: #e9edef; }
html.dark .chat-gzeile-wartet { background: #422006; color: #fbbf24; }
html.dark .chat-gzeile.is-rot .chat-gzeile-wartet { background: #450a0a; color: #fca5a5; }
html.dark .chat-gzeile.is-praxis .chat-gzeile-name { color: #5eead4; }
html.dark .chat-gzeile.is-praxis.is-erledigt .chat-gzeile-name { color: #8696a0; }
html.dark .chat-avatar.is-gruppe { background: #374248; color: #aebac1; }
html.dark .chat-avatar.is-praxis { background: #0f766e; box-shadow: 0 0 0 2px #134e4a; }
html.dark .chat-avatar-punkt { border-color: #111b21; }
html.dark .chat-gkopf .chat-avatar-punkt { border-color: #202c33; }
html.dark .chat-gkopf-name { color: #e9edef; }
html.dark .chat-gkopf-info { color: #8696a0; }
html.dark .chat-gkopf-online { color: #00a884; }
html.dark .chat-gkopf-praxis { color: #5eead4; }
html.dark .chat-zurueck { color: #aebac1; }
html.dark .chat-zurueck:hover { color: #e9edef; }
html.dark .chat-kopf-chip { background: #2a3942; border-color: #2a3942; color: #e9edef; }
html.dark .chat-kopf-chip:hover { background: #374248; }
html.dark .chat-kopf-chip.is-erledigt { background: #00a884; border-color: #00a884; color: #111b21; }
html.dark .chat-kopf-mehr { color: #aebac1; }
html.dark .chat-kopf-mehr:hover, html.dark .chat-kopf-mehr[aria-expanded="true"], html.dark .chat-kopf-mehr.is-an { background: #374248; }
html.dark .chat-liste { background: #0b141a; }
html.dark .chat-tag, html.dark .chat-neu { background: #182229; color: #8696a0; box-shadow: none; }
html.dark .chat-blase { background: #202c33; color: #e9edef; box-shadow: none; }
html.dark .chat-n.is-eigen .chat-blase { background: #005c4b; }
html.dark .chat-n-meta, html.dark .chat-blase-mehr { color: rgba(233, 237, 239, .6); }
html.dark .chat-haken { color: rgba(233, 237, 239, .6); }
html.dark .chat-haken.is-gelesen { color: #53bdeb; }
html.dark .chat-tippt, html.dark .chat-gzeile-text.chat-tippt { color: #00a884; }
html.dark .chat-n-text.is-geloescht { color: #8696a0; }
html.dark .chat-n-name { color: #aebac1; }
html.dark .chat-n-name.is-praxis { color: #5eead4; }
html.dark .chat-n.is-system .chat-blase { background: #182229; color: #aebac1; }
html.dark .chat-n-name.is-system { color: #8696a0; }
html.dark .chat-n-name.f0 { color: #f28b91; } html.dark .chat-n-name.f1 { color: #7fd36b; } html.dark .chat-n-name.f2 { color: #71b7ee; }
html.dark .chat-n-name.f3 { color: #b3a6f2; } html.dark .chat-n-name.f4 { color: #f28dbd; } html.dark .chat-n-name.f5 { color: #5fd3d5; }
html.dark .chat-n-name.f6 { color: #f7a672; } html.dark .chat-n-name.f7 { color: #86b1e0; } html.dark .chat-n-name.f8 { color: #deae6e; }
html.dark .chat-n-name.f9 { color: #a49df5; }
html.dark .chat-n.is-fehler .chat-blase { background: #450a0a; color: #fecaca; }
html.dark .chat-n.is-erwaehnt:not(.is-eigen) .chat-blase { box-shadow: inset 3px 0 0 #f59e0b; }
html.dark .chat-n.is-uebergabe .chat-blase { background: #2a1f06; border-color: #92400e; color: #fef3c7; }
html.dark .chat-erw, html.dark .chat-ticket { color: #53bdeb; }
html.dark .chat-erw.is-ich { background: #78350f; color: #fef3c7; }
html.dark .chat-blase .chat-datei-knopf, html.dark .chat-blase .chat-datei-ansehen { background: rgba(255, 255, 255, .06); border-color: transparent; color: inherit; }
html.dark .chat-menue { background: #233138; box-shadow: 0 4px 18px rgba(0, 0, 0, .5); }
html.dark .chat-menue-eintrag { color: #d1d7db; }
html.dark .chat-menue-eintrag:hover, html.dark .chat-menue-eintrag:focus-visible { background: #182229; }
html.dark .chat-menue-eintrag.is-rot { color: #f87171; }
html.dark .chat-feld-rund { background: #2a3942; }
/* Die globalen Formular-Regeln fuer den Darkmode tragen !important - hier gegenhalten */
html.dark .chat-feld-rund .chat-feld { color: #e9edef !important; background: transparent !important; border-color: transparent !important; }
html.dark .chat-feld-rund .chat-feld::placeholder, html.dark .chat-suche-rund::placeholder { color: #8696a0 !important; }
html.dark .chat-anhang { color: #aebac1; }
html.dark .chat-anhang:hover { background: #374248; }
html.dark .chat-senden { background: #00a884; color: #111b21; }
html.dark .chat-senden:hover { background: #06cf9c; }
/* Team-Kommentare unter einer Nachricht (ticket.php, 2.61.0) - eigene Klassen statt violet-Utilities,
   damit die Darkmode-Farben nicht auf andere violette Elemente (KI-Vorschlag) durchschlagen */
.notiz-eintrag { border-left: 2px solid #c4b5fd; background: rgba(245, 243, 255, 0.75); }
.notiz-eintrag:target { box-shadow: 0 0 0 2px #c4b5fd; }
.notiz-pfeil { color: #a78bfa; }
.notiz-name { color: #5b21b6; }
.notiz-marke { background: #ede9fe; color: #6d28d9; }
.notiz-feld { border-color: #c4b5fd; }
html.dark .notiz-eintrag { background: #1e1b3a; border-left-color: #6d28d9; }
html.dark .notiz-eintrag:target { box-shadow: 0 0 0 2px #7c3aed; }
html.dark .notiz-pfeil { color: #8b5cf6; }
html.dark .notiz-name { color: #c4b5fd; }
html.dark .notiz-marke { background: #2e1065; color: #ddd6fe; }
html.dark .notiz-feld { border-color: #6d28d9 !important; }