/* Chef-Ansicht (v2.102.0) – eigene, schlanke Stilschicht fürs Handy.
   Farben aus shared/theme.css (CI-Gelb nur für die EINE Hauptaktion je Bildschirm,
   Anthrazit für Kopf und aktive Zustände, Statusfarben wie auf der Plantafel). */
* { box-sizing: border-box; }
html, body { margin: 0; padding: 0; }
body {
  font-family: 'Inter', system-ui, -apple-system, sans-serif;
  background: var(--cab-bg, #f8fafc); color: var(--cab-text, #0f172a);
  font-size: 15px; line-height: 1.4; -webkit-text-size-adjust: 100%;
  -webkit-tap-highlight-color: transparent;
}
a { color: inherit; text-decoration: none; }
button, input, textarea, select { font: inherit; color: inherit; }
button { cursor: pointer; }
.mono { font-variant-numeric: tabular-nums; }

.ch-app { min-height: 100vh; min-height: 100dvh; display: flex; flex-direction: column; max-width: 640px; margin: 0 auto; background: var(--cab-bg, #f8fafc); }
.ch-laden { padding: 48px 16px; text-align: center; color: #64748b; }

/* Kopf */
.ch-kopf { background: #1a1a1a; color: #fff; padding: calc(env(safe-area-inset-top, 0px) + 10px) 16px 14px; position: sticky; top: 0; z-index: 20; }
.ch-kopf-zeile { display: flex; align-items: center; justify-content: space-between; gap: 8px; min-height: 44px; }
.ch-kopf h1 { margin: 0; font-size: 22px; font-weight: 700; line-height: 1.2; }
.ch-kopf .ch-unter { font-size: 13px; color: #cbd5e1; margin-top: 2px; }
.ch-kopf .ch-stand { background: none; border: 0; padding: 4px 0; margin: 0; font: inherit; color: inherit; text-decoration: underline dotted; cursor: pointer; }
.ch-zurueck { display: inline-flex; align-items: center; gap: 2px; min-height: 44px; padding: 0 10px 0 0; color: #e2e8f0; font-size: 15px; background: none; border: 0; }
.ch-kopf-knopf { min-height: 40px; padding: 0 12px; border-radius: 10px; border: 1px solid #3f3f46; background: transparent; color: #e2e8f0; font-size: 13px; display: inline-flex; align-items: center; gap: 6px; }
.ch-marke { display: flex; align-items: center; gap: 8px; font-weight: 600; }
.ch-marke img { width: 26px; height: 26px; border-radius: 7px; }

/* Inhalt */
.ch-body { flex: 1; padding: 14px 16px calc(env(safe-area-inset-bottom, 0px) + 92px); display: flex; flex-direction: column; gap: 18px; }
.ch-sektion { display: flex; flex-direction: column; gap: 8px; }
.ch-sektion-titel { font-size: 11px; font-weight: 600; letter-spacing: .08em; text-transform: uppercase; color: #64748b; display: flex; justify-content: space-between; align-items: baseline; }
.ch-sektion-titel a, .ch-sektion-titel button { text-transform: none; letter-spacing: 0; font-size: 13px; color: #0f172a; background: none; border: 0; padding: 6px 0; }
.ch-leer { padding: 20px 14px; text-align: center; color: #64748b; font-size: 14px; background: #fff; border: 1px dashed #e2e8f0; border-radius: 14px; }
.ch-hinweis { font-size: 13px; color: #475569; background: #f1f5f9; border-radius: 10px; padding: 10px 12px; }

.ch-karte { background: #fff; border: 1px solid #e2e8f0; border-radius: 14px; }
.ch-karte-pad { padding: 14px; display: flex; flex-direction: column; gap: 8px; }
.ch-liste { background: #fff; border: 1px solid #e2e8f0; border-radius: 14px; overflow: hidden; }
.ch-zeile { display: flex; align-items: center; gap: 12px; padding: 10px 14px; min-height: 56px; border-bottom: 1px solid #f1f5f9; width: 100%; background: none; border-left: 0; border-right: 0; border-top: 0; text-align: left; }
.ch-zeile:last-child { border-bottom: 0; }
.ch-zeile-text { flex: 1; min-width: 0; display: flex; flex-direction: column; gap: 2px; }
.ch-zeile-titel { font-size: 15px; font-weight: 600; overflow: hidden; text-overflow: ellipsis; }
.ch-zeile-sub { font-size: 12px; color: #64748b; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.ch-zeile-sub.umbruch { white-space: normal; }
.ch-pfeil { color: #94a3b8; flex-shrink: 0; }
.ch-avatar { width: 36px; height: 36px; border-radius: 999px; background: #f1f5f9; display: flex; align-items: center; justify-content: center; font-size: 13px; font-weight: 600; flex-shrink: 0; }

/* Kacheln */
.ch-kacheln { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; }
.ch-kachel { background: #fff; border: 1px solid #e2e8f0; border-radius: 14px; padding: 14px; display: flex; flex-direction: column; gap: 3px; min-height: 100px; }
.ch-kachel-zahl { font-size: 30px; font-weight: 700; line-height: 1; display: flex; justify-content: space-between; align-items: center; }
.ch-kachel-name { font-size: 15px; font-weight: 600; }
.ch-kachel-satz { font-size: 12px; color: #64748b; }
.ch-kachel.ruhig .ch-kachel-zahl { color: #94a3b8; }
.ch-punkt { width: 10px; height: 10px; border-radius: 999px; display: inline-block; flex-shrink: 0; }

/* Chips & Knöpfe */
.ch-chip { font-size: 12px; font-weight: 600; padding: 3px 10px; border-radius: 999px; background: #f1f5f9; color: #334155; white-space: nowrap; flex-shrink: 0; }
.ch-chip.rot { background: #fee2e2; color: #b91c1c; }
.ch-chip.gelb { background: #fef3c7; color: #92400e; }
.ch-chip.gruen { background: #dcfce7; color: #15803d; }
.ch-notdienst { display: inline-flex; align-items: center; gap: 8px; min-height: 36px; padding: 0 14px 0 6px; border-radius: 999px; background: #dc2626; color: #fff; font-size: 13px; font-weight: 600; margin-top: 10px; }
.ch-notdienst span.kreis { width: 24px; height: 24px; border-radius: 999px; background: #fff; color: #dc2626; display: flex; align-items: center; justify-content: center; }
.ch-filter { display: flex; gap: 8px; overflow-x: auto; margin-top: 10px; scrollbar-width: none; }
.ch-filter button { min-height: 36px; padding: 0 14px; border-radius: 999px; border: 1px solid #52525b; background: transparent; color: #e2e8f0; font-size: 13px; font-weight: 600; white-space: nowrap; }
.ch-filter button.an { background: #fff; color: #1a1a1a; border-color: #fff; }
.ch-btn { min-height: 44px; padding: 0 14px; border-radius: 10px; border: 1px solid #e2e8f0; background: #fff; color: #0f172a; font-size: 14px; font-weight: 600; display: inline-flex; align-items: center; justify-content: center; gap: 6px; }
.ch-btn.klar { border-color: #1a1a1a; }
.ch-btn-haupt { width: 100%; min-height: 50px; border-radius: 12px; border: 0; background: var(--cab-brand-500, #f5c800); color: #1a1a1a; font-size: 16px; font-weight: 700; }
.ch-btn-haupt:disabled { background: #e2e8f0; color: #64748b; }
.ch-btn-reihe { display: grid; grid-template-columns: repeat(auto-fit, minmax(0, 1fr)); gap: 8px; }
.ch-rund { width: 44px; height: 44px; border-radius: 12px; border: 1px solid #e2e8f0; background: #fff; display: flex; align-items: center; justify-content: center; flex-shrink: 0; color: #0f172a; }

/* Suche */
.ch-suche { display: flex; align-items: center; gap: 8px; background: #fff; border-radius: 12px; padding: 0 12px; min-height: 46px; color: #64748b; margin-top: 10px; }
.ch-suche input { flex: 1; border: 0; outline: none; font-size: 16px; color: #0f172a; background: transparent; min-width: 0; }

/* Kalender */
.ch-tagwahl { display: flex; align-items: center; gap: 8px; margin-top: 10px; }
.ch-tagwahl button { min-height: 40px; min-width: 40px; border-radius: 10px; border: 1px solid #52525b; background: transparent; color: #e2e8f0; }
.ch-tagwahl .ch-tagname { flex: 1; text-align: center; font-weight: 600; }
.ch-termin { display: flex; gap: 12px; padding: 12px 14px; border-bottom: 1px solid #f1f5f9; }
.ch-termin:last-child { border-bottom: 0; }
.ch-termin-zeit { width: 50px; flex-shrink: 0; font-size: 13px; color: #475569; font-weight: 600; }
.ch-termin-balken { width: 4px; border-radius: 2px; align-self: stretch; flex-shrink: 0; background: #94a3b8; }

/* Chat */
.ch-nachrichten { display: flex; flex-direction: column; gap: 8px; }
.ch-nachricht { max-width: 82%; padding: 8px 12px; border-radius: 14px; background: #fff; border: 1px solid #e2e8f0; align-self: flex-start; white-space: pre-wrap; word-wrap: break-word; }
.ch-nachricht.meine { align-self: flex-end; background: #1a1a1a; color: #fff; border-color: #1a1a1a; }
.ch-nachricht .wer { font-size: 12px; font-weight: 600; color: #64748b; margin-bottom: 2px; }
.ch-nachricht.meine .wer { color: #cbd5e1; }
.ch-nachricht .wann { font-size: 11px; color: #94a3b8; margin-top: 2px; text-align: right; }
.ch-nachricht img { max-width: 100%; border-radius: 8px; display: block; margin-top: 4px; }
.ch-schreiben { position: fixed; left: 0; right: 0; bottom: calc(env(safe-area-inset-bottom, 0px) + 64px); background: #fff; border-top: 1px solid #e2e8f0; padding: 8px 12px; display: flex; gap: 8px; max-width: 640px; margin: 0 auto; z-index: 25; }
.ch-schreiben textarea { flex: 1; resize: none; border: 1px solid #e2e8f0; border-radius: 12px; padding: 10px 12px; font-size: 16px; min-height: 44px; max-height: 120px; outline: none; }
.ch-textfeld { width: 100%; resize: vertical; border: 1px solid #e2e8f0; border-radius: 12px; padding: 10px 12px; font-size: 16px; min-height: 80px; outline: none; }

/* Code-Anzeige */
.ch-code { font-size: 28px; font-weight: 700; letter-spacing: .12em; text-align: center; padding: 12px; background: #fef9c3; border-radius: 12px; }

/* Leiste unten */
.ch-nav { position: fixed; left: 0; right: 0; bottom: 0; z-index: 30; background: #fff; border-top: 1px solid #e2e8f0; display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); padding-bottom: env(safe-area-inset-bottom, 0px); max-width: 640px; margin: 0 auto; }
.ch-nav a { display: flex; flex-direction: column; align-items: center; gap: 2px; padding-top: 7px; min-height: 60px; color: #64748b; font-size: 11px; font-weight: 500; border-top: 3px solid transparent; margin-top: -1px; position: relative; }
.ch-nav a.an { color: #0f172a; font-weight: 600; border-top-color: var(--cab-brand-500, #f5c800); }
.ch-badge { position: absolute; top: 3px; left: 55%; min-width: 18px; height: 18px; padding: 0 5px; border-radius: 999px; background: #dc2626; color: #fff; font-size: 11px; font-weight: 700; display: flex; align-items: center; justify-content: center; }

/* Anmeldung */
.ch-login { min-height: 100vh; min-height: 100dvh; background: #1a1a1a; color: #fff; display: flex; flex-direction: column; justify-content: center; padding: 24px; gap: 14px; }
.ch-login h1 { margin: 0 0 8px; font-size: 26px; }
.ch-login input { width: 100%; min-height: 50px; border-radius: 12px; border: 1px solid #3f3f46; background: #27272a; color: #fff; padding: 0 14px; font-size: 16px; }
.ch-login .fehler { color: #fca5a5; font-size: 14px; min-height: 20px; }

.ch-toast { position: fixed; left: 16px; right: 16px; bottom: calc(env(safe-area-inset-bottom, 0px) + 76px); z-index: 50; background: #1a1a1a; color: #fff; border-radius: 12px; padding: 12px 14px; font-size: 14px; opacity: 0; transform: translateY(8px); transition: opacity .2s, transform .2s; pointer-events: none; max-width: 608px; margin: 0 auto; }
.ch-toast.an { opacity: 1; transform: none; }

/* Unternehmensberater (v2.132.0) */
.ch-fokus { background: #1a1a1a; color: #fff; border-radius: 14px; padding: 14px; display: flex; flex-direction: column; gap: 6px; font-weight: 600; }
.ch-fokus .ch-sektion-titel { color: #cbd5e1; }
.ch-kpi { min-height: 0; gap: 4px; position: relative; overflow: hidden; }
.ch-kpi .ch-kachel-name { font-size: 12px; font-weight: 600; color: #64748b; text-transform: uppercase; letter-spacing: .04em; }
.ch-kpi .ch-kachel-zahl { font-size: 24px; }
.ch-kpi.crit { border-left: 4px solid #dc2626; }
.ch-kpi.warn { border-left: 4px solid #d97706; }
.ch-kpi.crit .ch-spark { color: #dc2626; } .ch-kpi.warn .ch-spark { color: #d97706; }
.ch-spark { width: 100%; height: 30px; color: #475569; margin-top: 4px; overflow: visible; }
.ch-kpi-achse { display: flex; justify-content: space-between; font-size: 11px; color: #94a3b8; }
.ch-zeile-titel.umbruch { white-space: normal; overflow: visible; }
.ch-zeile-titel.durch { text-decoration: line-through; color: #94a3b8; }
.ch-nachricht.ch-md { white-space: normal; max-width: 92%; }
.ch-nachricht.ch-md p { margin: 0 0 .5em; } .ch-nachricht.ch-md p:last-of-type { margin-bottom: 0; }
.ch-nachricht.ch-md ul, .ch-nachricht.ch-md ol { margin: .2em 0 .5em; padding-left: 1.2em; }
.ch-sektion-titel button:disabled { color: #94a3b8; }

/* E-Mail (v2.133.0) */
.ch-mailtext { white-space: pre-wrap; word-wrap: break-word; overflow-wrap: anywhere; font-size: 15px; line-height: 1.5; }
.ch-kopf .ch-suche { margin-top: 10px; }

/* Berater-Ausbau (v2.136.0) */
a.ch-kpi { color: inherit; }
.ch-kpi.gut { border-left: 4px solid #16a34a; }
.ch-kpi.gut .ch-spark { color: #16a34a; }
.ch-kpi-ziel { color: #0f172a; font-weight: 600; }
.ch-mini { margin-top: 6px; background: none; border: 1px solid #e2e8f0; border-radius: 999px; padding: 4px 10px; font-size: 12px; font-weight: 600; color: #334155; }
.ch-liste .ch-zeile .ch-btn { min-height: 38px; padding: 0 10px; font-size: 13px; flex-shrink: 0; }

/* v2.197.0: cab-Telefon-Knopf (#ctDock) und Telefon-Fenster sitzen über der Leiste unten – sonst verdeckt der Knopf „Mehr".
   Leiste = 60px + 3px Rand + iPhone-Rand unten (safe-area). Ein von Hand verschobenes Fenster (top: im Stil) bleibt, wo es ist. */
body:has(.ch-nav) #ctDock { bottom: calc(76px + env(safe-area-inset-bottom, 0px)) !important; }
body:has(.ch-nav) #cabTelefonPop:not([style*="top:"]) { bottom: calc(140px + env(safe-area-inset-bottom, 0px)) !important; }
/* v2.230.0: Der Knopf verdeckte „Senden" (Chat, Berater), „Speichern" im Check-in und den letzten Knopf einer Seite.
   Seitenende bekommt Luft bis über den Knopf (76 + 52 + 12); die Schreibleiste Platz rechts – nur solange sie
   bis unter den Knopf reicht (Leiste max. 640 px mittig). Meldung (#toast) weicht per Regel aus cab-telefon.js aus. */
body:has(#ctDock) .ch-body { padding-bottom: calc(env(safe-area-inset-bottom, 0px) + 140px); }
@media (max-width: 776px) { body:has(#ctDock) .ch-schreiben { padding-right: 76px; } }

/* v2.221.0 Bereich „Ich“: Recovery-Karte, Auswahlknöpfe im Check-in, Ziel-Felder, Verlaufsgrafik */
.ch-ich-heute { display: flex; align-items: center; gap: 14px; color: inherit; text-decoration: none; }
.ch-ich-rec { text-align: center; min-width: 72px; }
.ch-ich-rec .mono { font-size: 28px; font-weight: 700; line-height: 1.1; }
.ch-ich-knopf { display: flex; align-items: center; justify-content: center; text-decoration: none; }
.ch-wahl { display: flex; flex-wrap: wrap; gap: 8px; }
.ch-wahl button { min-height: 44px; min-width: 44px; padding: 0 16px; border-radius: 12px; border: 1px solid #cbd5e1; background: #fff; color: #0f172a; font-size: 16px; font-weight: 600; }
.ch-wahl button.an { background: #1a1a1a; color: #fff; border-color: #1a1a1a; }
.ch-ich-feld { min-height: 44px; padding: 0 12px; border: 1px solid #cbd5e1; border-radius: 10px; font-size: 16px; background: #fff; color: #0f172a; }
.ch-ich-zeile { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 8px 14px; border-bottom: 1px solid #f1f5f9; font-size: 15px; }
.ch-ich-zeile:last-child { border-bottom: 0; }
.ch-ich-zeile .ch-ich-feld { width: 130px; text-align: right; }
.ch-ich-grafik { width: 100%; height: 90px; display: block; margin: 8px 0 4px; overflow: visible; }
.ch-tagwahl button:disabled { opacity: .35; }