/* Für Browser, die noch die Seite von vor dem 11.10.2026 im Zwischenspeicher haben (dort fehlt der <link> auf
   konto-app.css): die gemeinsame Gestaltung hier nachladen. Doppelt geladen schadet sie nicht. */
@import url("/css/konto-app.css");

/* ====================  css/kundenportal-leads.css  ====================
   Nur das Besondere der Lead-Übersicht /kunden/admin/leads/ (V2, 10.10.2026). Rahmen, Karten, Board, Marken,
   Meldungen und Farben kommen aus konto-app.css (seit 11.10.2026 eigene Datei für alle Seiten hinter dem Login).
   Hier: die Farbe je Stand eines Leads (wie im Lead-Board von Section Monsters), die Marken für die Herkunft, die
   Tabellen der Auswertung und die Teile des Seitenpanels, die es nur bei Leads gibt. */

/* Verkaufsstufen (11.10.2026) in der Farblogik der Login-Seiten: Blau offen, Violett im Gespräch, Orange Angebot, Türkis
   Besprechung, Gelb wartet auf den Kunden, Grün gewonnen, Grau abgelegt. „neu“ = Schnellfilter „Noch nicht angefasst“. */
.ld-ton--neu, .ld-ton--erstkontakt{ --ton: #3b82f6 }
.ld-ton--erstgespraech{ --ton: #7c3aed }
.ld-ton--angebot_erstellen{ --ton: #ea6c10 }
.ld-ton--angebotsbesprechung{ --ton: #0891b2 }
.ld-ton--rueckmeldung{ --ton: #d4a106 }
.ld-ton--gewonnen{ --ton: #16a34a }
.ld-ton--verloren, .ld-ton--uninteressant{ --ton: #8a91a3 }
.ld-kz.ld-ton--verloren, .ld-kz.ld-ton--uninteressant{ opacity: .78 }
.ld-marke--befund{ --m: #3b82f6; --m-text: #1d4ed8 }
.ld-marke--section-monsters{ --m: #7c3aed; --m-text: #5b21b6 }
.ld-marke--kunde{ --m: #16a34a; --m-text: #146c35 }
.ld-marke--fehler{ --m: #dc2626; --m-text: #a51c1c }
.ld-marke--doppelt{ --m: #d4a106; --m-text: #7a5300; border-style: dashed }
.ld-marke--bestandskunde{ --m: #16a34a; --m-text: #146c35 }
.ld-marke--wert{ --m: var(--ld-text); --m-text: var(--ld-text); font-variant-numeric: tabular-nums }   /* 01.11.2026: war weiß auf hellem Grund (Rest des dunklen Designs) */
.ld-kz-thema{ margin: -4px 0 0; font-size: 14.5px; font-weight: 600; color: var(--ld-text-2) }
.ld-karte-thema{ color: var(--ld-text-2) }
.ld-spalte-summe{ margin: 0; padding: 0 12px 6px; font-size: 13px; font-weight: 700; color: var(--ld-text); font-variant-numeric: tabular-nums }
.ld-chip--anzeige, .ld-chip--kampagne{ border-style: solid; color: var(--ld-text) }
.ld-auswertung-kopf{ padding: 14px 16px; border-radius: 12px; background: var(--ld-flaeche); border: 1px solid var(--ld-rand) }
.ld-auswertung-kopf .kp-text{ margin: 0; max-width: 80ch; color: var(--ld-text-2); font-size: 14px }
.ld-app .amc-abschnitt{ margin: 26px 0 10px; font-family: inherit; font-size: 18px; font-weight: 700; letter-spacing: 0; text-transform: none; color: var(--ld-text) }
.ld-abschnitt-kopf{ display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 8px 20px; margin: 26px 0 10px }
.ld-abschnitt-kopf .amc-abschnitt{ margin: 0 }
.ld-zeitraum{ flex: 0 1 240px }
.ld-tabelle-rahmen{ position: relative; max-width: 100%; overflow-x: auto; margin-bottom: 6px; padding: 6px 16px; border-radius: 12px; background: var(--ld-flaeche); border: 1px solid var(--ld-rand) }
.ld-tabelle{ width: 100%; border-collapse: collapse; font-size: 14px; font-variant-numeric: tabular-nums }
.ld-tabelle th{ padding: 8px 0 8px 16px; border-bottom: 1px solid var(--ld-rand-stark); text-align: right; white-space: nowrap; font-size: 12px; font-weight: 600; color: var(--ld-text-2) }
.ld-tabelle td{ padding: 10px 0 10px 16px; border-bottom: 1px solid var(--ld-rand); text-align: right; white-space: nowrap; color: var(--ld-text) }
.ld-tabelle th:first-child, .ld-tabelle td:first-child{ padding-left: 0; text-align: left; white-space: normal; min-width: 170px }
.ld-tabelle td:first-child{ overflow-wrap: anywhere }
.ld-tabelle tbody tr:last-child td{ border-bottom: 0 }
.ld-tabelle tfoot td{ border-bottom: 0; border-top: 1px solid var(--ld-rand-stark); color: var(--ld-text-2) }
.ld-tabelle .ld-gewaehlt td{ background: rgba(124,58,237,.10) }
.ld-tabelle .ld-gruppe td{ border-top: 1px solid var(--ld-rand-stark); font-weight: 600 }
.ld-tabelle .ld-unter td{ padding-top: 7px; padding-bottom: 7px; color: var(--ld-text-2); font-size: 13px; font-weight: 400 }
.ld-tabelle .ld-unter td:first-child{ padding-left: 16px }
.ld-tabelle-knopf{ padding: 0; background: none; border: 0; cursor: pointer; text-align: left; font: inherit; color: var(--ld-link); text-decoration: underline; text-decoration-color: rgba(29,78,216,.4); text-underline-offset: 4px }
.ld-tabelle-knopf:hover{ text-decoration-color: currentColor }
.ld-tabelle-knopf:focus-visible{ outline: 2px solid var(--zk-akzent); outline-offset: 3px }
.ld-balken{ display: block; height: 4px; margin-top: 7px; border-radius: 2px; background: #7c3aed }
.ld-anzeigen{ display: block; margin-top: 2px; font-size: 12.5px; color: var(--ld-text-3) }
.ld-auswertung-fuss{ margin-top: 12px; color: var(--ld-text-3) }
.ld-panel-stand{ margin: -4px 0 18px }
.ld-panel-stand .mk-meldung{ margin-top: 6px }
.ld-kanaele{ display: flex; flex-direction: column; border-top: 1px solid var(--ld-rand, rgba(11,13,22,.16)); margin-bottom: 4px }
.ld-kanal{
  display: grid; grid-template-columns: 76px minmax(0, 1fr); gap: 12px; align-items: baseline; padding: 10px 0;
  border-bottom: 1px solid var(--ld-rand, rgba(11,13,22,.09)); color: var(--ld-text, var(--ld-text)); text-decoration: none; overflow-wrap: anywhere; font-size: .94rem;
}
.ld-kanal span{ font-size: .68rem; font-weight: 600; letter-spacing: .12em; text-transform: uppercase; color: var(--ld-text-3, var(--ld-text-3)) }
.ld-kanal:hover{ color: var(--ld-text) }
.ld-herkunft{ margin: 0; padding: 10px 14px; border-left: 3px solid var(--ld-rand-stark, var(--ld-rand-stark)); border-radius: 0 8px 8px 0; background: var(--ld-flaeche-2, var(--ld-flaeche-2));
  color: var(--ld-text, var(--ld-text)); font-size: .9rem; line-height: 1.6; white-space: pre-line; overflow-wrap: anywhere }
.ld-herkunft--anzeige{ border-left-color: #3b82f6 }
.ld-herkunft--kampagne{ border-left-color: #0891b2 }
.ld-herkunft--sm{ border-left-color: #7c3aed }
.ld-stand--fehler{ border-left-color: #dc2626 }
.ld-notizen{ margin-top: 16px }
.ld-notiz-weg{ float: right; font-size: .74rem }
.ld-loeschhinweis{ margin-top: 22px; padding-top: 12px; border-top: 1px solid var(--ld-rand, rgba(11,13,22,.16)) }
@media (max-width: 720px){
  .ld-tabelle{ font-size: 13px}
  .ld-tabelle th, .ld-tabelle td{ padding-left: 10px}
  .ld-tabelle th:first-child, .ld-tabelle td:first-child{ min-width: 128px}
}
/* Zurückgezogene Notiz (Löschsperre, 17.10.2026): bleibt im Verlauf, blass und durchgestrichen */
.ld-notiz--zurueck{ opacity: .6 }
.ld-unterlagen{ list-style: none; margin: 0 0 .6rem; padding: 0 }
.ld-unterlagen li{ display: flex; flex-wrap: wrap; gap: .25rem .9rem; align-items: baseline; padding: .45rem 0; border-bottom: 1px solid rgba(128,128,128,.25) }
.ld-dokform{ margin-top: .6rem }
.ld-dokform select, .ld-dokform input[type=text], .ld-dokform input[type=file]{ max-width: 100% }
.ld-unterlagen li > span{ flex: 1 1 14rem; min-width: 0; overflow-wrap: anywhere }

/* ---------- Wizard „Angebot angenommen“ (09.11.2026, René; angebot-angenommen.js). aa-wahl stammt vom früheren Auftrags-Assistenten. ---------- */
.aa-wahl{ margin: 0 0 12px; padding: 10px 12px; border: 1px solid var(--ld-rand); border-radius: 10px; display: flex; flex-direction: column; gap: 8px; min-width: 0 }
.aa-wahl legend{ padding: 0 4px; font-size: 13px; color: var(--ld-text-2) }
.aa-wahl .kp-haken{ align-items: flex-start }
.aa-wahl small{ color: var(--ld-text-2) }
.aw-gesperrt{ opacity: .55 }
.aw-karten-knopf{ white-space: normal }
.aw-karten-knopf:disabled{ opacity: .55; cursor: default }
.aw-panel-knopf{ margin: 10px 0 0 }
.ld-app .zk-knopf.aw-gruen, html:has(.ld-app) .kp-panel .zk-knopf.aw-gruen{ background: #15803d; color: #fff }
.ld-app .zk-knopf.aw-gruen:hover, html:has(.ld-app) .kp-panel .zk-knopf.aw-gruen:hover{ background: #116b32 }
.aw .kp-feld input, .aw .kp-feld select, .aw .kp-feld textarea{ width: 100%; min-width: 0; font-size: 16px }
.aw-pflicht{ font-style: normal; font-size: 11.5px; font-weight: 700; color: #b45309 }
.aw .aw-fehlt, .aw .aw-fehlt:focus{ border-color: #c22b2b; outline: 2px solid rgba(194,43,43,.35) }
.aw-projekt{ margin: 0 0 14px; padding: 14px; border: 1px solid var(--ld-rand); border-radius: 12px; background: var(--ld-flaeche-2); min-width: 0 }
.aw-projekt-kopf{ display: flex; justify-content: space-between; align-items: center; gap: 10px; margin: 0 0 8px }
.aw-projekt-kopf h4{ margin: 0; font-size: 15px; color: var(--ld-text) }
.aw-summe{ margin: 8px 0 12px; font-size: 14px; font-weight: 600; color: #146c35 }
.aw-summe--falsch{ color: #b91c1c }
.aw-raten{ list-style: none; margin: 0 0 6px; padding: 0; display: grid; gap: 6px }
.aw-raten li{ display: grid; grid-template-columns: 26px minmax(0, 1.3fr) minmax(0, 1fr); gap: 8px; align-items: center }
.aw-raten .kp-feld{ margin: 0 }
.aw-rate-nr{ font-size: 13px; color: var(--ld-text-2) }
.aw-unsichtbar{ position: absolute; width: 1px; height: 1px; overflow: hidden; clip-path: inset(50%); white-space: nowrap }
.aw-erledigt{ margin: 0 0 12px; font-size: 18px; font-weight: 700; color: #146c35 }
.aw-offen{ list-style: none; margin: 0 0 8px; padding: 0; display: grid; gap: 8px }
.aw-offen li{ display: grid; gap: 3px; padding: 10px 12px; border: 1px solid var(--ld-rand); border-radius: 10px; background: var(--ld-flaeche-2); font-size: 14.5px; overflow-wrap: anywhere }
.aw-offen span{ color: var(--ld-text-2); font-size: 13.5px }
.aw-offen a{ justify-self: start; font-size: 13.5px }

/* P5 „Vertrieb“ (24.10.2026, Plan autonomes KI-Büro): neue Quellen, Herkunft Ratgeber/Kanal und Lenas Einordnung (leads-lena.js).
   A grün, B blau, C grau wie die abgelegten Stufen; Widerspruch gelb. */
.ld-marke--termin{ --m: #0891b2; --m-text: #0e6a80 }
.ld-marke--felix, .ld-marke--jule{ --m: #7c3aed; --m-text: #5b21b6 }
.ld-marke--lena-a{ --m: #16a34a; --m-text: #146c35; font-variant-numeric: tabular-nums }
.ld-marke--lena-b{ --m: #3b82f6; --m-text: #1d4ed8; font-variant-numeric: tabular-nums }
.ld-marke--lena-c{ --m: #8a91a3; --m-text: #4a5266; font-variant-numeric: tabular-nums }
.ld-marke--lena-w{ --m: #d4a106; --m-text: #7a5300 }
.ld-herkunft--ratgeber{ border-left-color: #16a34a }
.ld-herkunft--kanal{ border-left-color: #7c3aed }
.ld-lena{ display: grid; gap: 10px }
.ld-lena-kopf{ display: flex; align-items: center; gap: 12px; margin: 0 }
.ld-lena-kopf small{ display: block; color: var(--ld-text-2); font-size: 12.5px }
.ld-lena-klasse{ display: inline-grid; place-items: center; flex: 0 0 auto; width: 40px; height: 40px; border-radius: 10px; font-size: 20px; font-weight: 800;
  color: #0d1020; background: #8a91a3 }
.ld-lena-klasse--a{ background: #16a34a }
.ld-lena-klasse--b{ background: #3b82f6 }
.ld-lena-gruende{ margin: 0; padding-left: 1.1em; display: grid; gap: 4px; font-size: 14px; color: var(--ld-text-2) }
/* Lenas Einordnung Fassung 2 (13.11.2026, Schritt 6): zwei Sätze, zwei Fragen, alle Prüfungen zum Aufklappen */
.ld-lena-satz{ margin: 0; font-size: 15px; line-height: 1.5 }
.ld-lena-fragen{ margin: 0; padding-left: 1.1em; display: grid; gap: 2px; font-size: 14px }
.ld-lena-fragen small{ color: var(--ld-text-2) }
.ld-lena-mehr summary{ cursor: pointer; font-size: 14px; color: var(--ld-text-2) }
.ld-lena-mehr[open] summary{ margin-bottom: 6px }
.ld-lena-vorschlag{ padding: 10px 14px; border-left: 3px solid #8a91a3; border-radius: 0 8px 8px 0; background: var(--ld-flaeche-2, var(--ld-flaeche-2)) }
.ld-lena-vorschlag p{ margin: 0 0 8px }
.ld-lena-fakten{ margin: 0 }
.ld-lena-knoepfe{ margin: 0 }

/* P5 Büro-Oberfläche (25.10.2026): Angebot (Paul) für Interessenten ohne Kunde (leads-lena.js) */
.ld-marke--angebot{ --m: #c026d3; --m-text: #86198f }
.ld-angebot{ display: grid; gap: 10px }
.ld-angebot-eintrag{ padding: 10px 14px; border-left: 3px solid #c026d3; border-radius: 0 8px 8px 0; background: var(--ld-flaeche-2, var(--ld-flaeche-2)) }
.ld-angebot-eintrag--weg{ border-left-color: #8a91a3; opacity: .75 }
.ld-angebot-eintrag p{ margin: 0 0 6px }
.ld-angebot-eintrag p:last-child{ margin-bottom: 0 }
.ld-angebot-kopf small{ display: block; color: var(--ld-text-2); font-size: 12.5px }
.ld-angebot-aus{ display: grid; gap: 6px }
.ld-angebot-aus p{ margin: 0 }
.ld-angebot textarea{ width: 100%; min-height: 72px }
/* Zweiklang (30.10.2026): Stand immer als Auswahlfeld statt zehn Knöpfen nebeneinander (vorher nur auf dem Handy) */
.ld-statusfilter{ display: none !important }
.ld-statuswahl{ display: flex !important; max-width: 360px }

/* ---------- Vertriebsweg (01.11.2026): Detail-Panel neu und Assistenten (leads-vertriebsweg.js) ----------
   René: „das slide-in-panel mit Details muss viel viel strukturierter und intuitiver sein!“ — oben der Weg als Schrittleiste, dann
   „Als Nächstes“ mit einem Knopf, Audit und Angebot, Kontakt, Notizen; Seltenes zum Aufklappen. */
.vw-panel{ display: flex; flex-direction: column; gap: 14px }
.vw-panel .ld-panel-stand{ margin: 0 }
.vw-weg{ display: flex; gap: 0; margin: 0; padding: 0; list-style: none }
.vw-weg-stufe{ flex: 1 1 0; min-width: 0; display: flex; flex-direction: column; align-items: center; gap: 5px; position: relative; font-size: 11.5px; font-weight: 600; color: var(--ld-text-3); text-align: center }
.vw-weg-stufe + .vw-weg-stufe::before{ content: ""; position: absolute; top: 12px; right: calc(50% + 14px); left: calc(-50% + 14px); height: 2px; border-radius: 1px; background: var(--ld-rand-stark) }
.vw-weg-stufe--fertig + .vw-weg-stufe::before{ background: var(--zk-ring) }
.vw-weg-punkt{ display: inline-flex; align-items: center; justify-content: center; width: 26px; height: 26px; border-radius: 50%; box-shadow: inset 0 0 0 2px var(--ld-rand-stark); background: #fff; font-size: 12px; font-weight: 700 }
.vw-weg-stufe--fertig{ color: var(--ld-text-2) }
.vw-weg-stufe--fertig .vw-weg-punkt{ background: var(--zk-akzent-hell); box-shadow: none; color: var(--zk-akzent) }
.vw-weg-stufe--jetzt{ color: var(--ld-text) }
.vw-weg-stufe--jetzt .vw-weg-punkt{ background: var(--zk-akzent); box-shadow: none; color: #fff }
.vw-weg-name{ max-width: 100%; overflow: hidden; text-overflow: ellipsis; white-space: nowrap }
.vw-raus{ margin: 6px 0 0; font-size: 13.5px; font-weight: 600; color: #a51c1c }

.vw-jetzt{ padding: 16px 18px; border-radius: 16px; background: var(--zk-akzent-hell); border: 1px solid var(--zk-ring) }
.vw-jetzt-titel{ margin: 0; font-family: var(--zk-titel); font-size: 17px; font-weight: 600; color: #2a1260 }
.vw-jetzt-text{ margin: 6px 0 0; font-size: 14.5px; line-height: 1.5; color: #3b1a85 }
.vw-jetzt .mk-meldung:empty{ display: none }
.vw-jetzt-warnung{ color: #8a4b00 }
.vw-knoepfe{ display: flex; flex-wrap: wrap; gap: 8px; margin-top: 12px }
.vw-wv-form{ display: flex; flex-wrap: wrap; align-items: flex-end; gap: 8px 12px; margin-top: -4px; padding: 12px 16px; border-radius: 14px; border: 1px solid var(--ld-rand) }
.vw-wv-form .kp-feld{ flex: 1 1 140px; margin: 0 }

.vw-karte{ padding: 16px 18px; border-radius: 16px; background: var(--ld-flaeche); border: 1px solid var(--ld-rand); box-shadow: var(--zk-schatten) }
html:has(.ld-app) .kp-panel .vw-titel{ margin: 0 0 10px; font-family: var(--zk-schrift); font-size: 13px; font-weight: 700; letter-spacing: .06em; text-transform: uppercase; color: var(--ld-text-3) }
.vw-titel-zeile{ display: flex; align-items: baseline; justify-content: space-between; gap: 10px }
.vw-unter{ margin: 12px 0 4px; font-size: 14px }
.vw-daten{ margin: 0; display: grid; grid-template-columns: 112px minmax(0, 1fr); gap: 7px 12px; font-size: 15px }
.vw-daten > div{ display: contents }
.vw-daten dt{ color: var(--ld-text-2); font-size: 13.5px; padding-top: 1px }
.vw-daten dd{ margin: 0; color: var(--ld-text); overflow-wrap: anywhere }
.vw-daten a{ color: var(--ld-link); text-decoration: none; font-weight: 600 }
.vw-klein{ margin: 10px 0 0; font-size: 13.5px; color: var(--ld-text-2) }
.vw-warnung{ background: #fff4e5; color: #8a4b00 }
.vw-unterlagen li{ align-items: center; border-bottom-color: var(--ld-rand) }
.vw-dok{ display: flex; flex-direction: column; gap: 1px }
.vw-klein-knopf{ min-height: 34px; padding: 0 12px; font-size: 13.5px }
.vw-aufklapp{ margin-top: 10px }
.vw-aufklapp > summary{ cursor: pointer; font-size: 14.5px; font-weight: 600; color: var(--ld-link); list-style-position: inside }
.vw-aufklapp[open] > summary{ margin-bottom: 10px }
.vw-mehr{ margin: 0; padding: 14px 18px; border-radius: 16px; border: 1px solid var(--ld-rand); background: var(--ld-flaeche) }
.vw-mehr > summary{ color: var(--ld-text) }
.vw-fuss{ justify-content: space-between; align-items: center }
.vw-loeschen{ color: #a51c1c !important }

/* Fortschritt von Ida/Paul */
.vw-ki{ margin: 0 0 12px; padding: 12px 14px; border-radius: 12px; font-size: 14.5px; line-height: 1.45 }
.vw-ki--laeuft{ background: var(--ld-flaeche-2); border: 1px solid var(--ld-rand) }
.vw-ki--fertig{ background: #eaf7ef; color: #146c35 }
.vw-ki--fehler{ background: #fdecec; color: #8a1c1c }
.vw-ki-kopf{ display: flex; flex-wrap: wrap; align-items: center; gap: 4px 10px; margin: 0 0 8px }
.vw-ki-kopf span{ margin-left: auto; font-size: 13px; color: var(--ld-text-2) }
.vw-ki-text{ margin: 0; color: var(--ld-text); overflow-wrap: anywhere }
.vw-ki-leise{ margin: 8px 0 0; font-size: 13px; color: var(--ld-text-2) }
.vw-puls{ display: inline-block; width: 9px; height: 9px; border-radius: 50%; background: #7c3aed; animation: vw-puls 1.6s ease-in-out infinite }
@keyframes vw-puls{ 0%, 100%{ opacity: 1; transform: scale(1) } 50%{ opacity: .35; transform: scale(.75) } }
@media (prefers-reduced-motion: reduce){ .vw-puls{ animation: none } }

/* Marken in Liste und Board */
.vw-marke{ --m: #0891b2; --m-text: #0e6a80 }
.vw-marke--laeuft{ --m: #7c3aed; --m-text: #5b21b6; display: inline-flex; align-items: center; gap: 6px }
.vw-marke--laeuft .vw-puls{ width: 7px; height: 7px }
.vw-marke--bereit{ --m: #16a34a; --m-text: #146c35 }
.vw-marke--fehler{ --m: #dc2626; --m-text: #a51c1c }
.vw-marke--faellig{ --m: #ea6c10; --m-text: #9a4208 }

/* Assistenten */
.vw-assistent .kp-haken{ align-items: flex-start }
.vw-anhaenge{ margin: 4px 0 0; padding: 12px 14px; border: 1px solid var(--ld-rand); border-radius: 14px; display: flex; flex-direction: column; gap: 6px }
.vw-anhaenge legend{ padding: 0 4px; font-size: 13.5px; font-weight: 600; color: var(--ld-text-2) }
.vw-mailvorschau{ display: block; width: 100%; height: 520px; border: 1px solid var(--ld-rand); border-radius: 14px; background: #eef0f5 }
@media (max-width: 600px){
  .vw-weg-name{ display: none }
  .vw-weg-stufe--jetzt .vw-weg-name{ display: block; position: absolute; top: 30px; white-space: nowrap; overflow: visible }
  .vw-weg{ padding-bottom: 18px }
  .vw-daten{ grid-template-columns: minmax(0, 1fr); gap: 0 }
  .vw-daten dd{ margin-bottom: 8px }
  .vw-mailvorschau{ height: 440px }
}

/* Schalter „Gewonnene & verlorene zeigen“ (02.11.2026) */
.ld-schalter{
  display: inline-flex; align-items: center; gap: 10px; min-height: 44px; padding: 0 14px 0 12px; cursor: pointer; white-space: nowrap;
  border: 1px solid var(--ld-rand-stark); border-radius: 12px; background: var(--ld-flaeche); color: var(--ld-text); font: inherit; font-size: 14px;
}
.ld-schalter:focus-visible{ outline: none; border-color: var(--zk-akzent); box-shadow: 0 0 0 3px rgba(106,44,216,.18) }
.ld-schalter-bahn{ position: relative; flex: none; width: 34px; height: 20px; border-radius: 999px; background: var(--ld-rand-stark); transition: background .18s }
.ld-schalter-bahn::after{ content: ""; position: absolute; top: 2px; left: 2px; width: 16px; height: 16px; border-radius: 50%; background: #fff;
  box-shadow: 0 1px 2px rgba(11,13,22,.25); transition: transform .18s }
.ld-schalter[aria-checked="true"] .ld-schalter-bahn{ background: var(--zk-akzent) }
.ld-schalter[aria-checked="true"] .ld-schalter-bahn::after{ transform: translateX(14px) }

/* Sterne 0–3 und Anrede du/Sie (02.11.2026) */
.ld-sterne{ display: inline-flex; align-items: center; gap: 0; margin-left: 6px; vertical-align: middle }
.ld-stern{
  display: inline-grid; place-items: center; width: 26px; height: 26px; padding: 0; border: 0; border-radius: 6px;
  background: none; color: var(--ld-rand-stark); cursor: pointer;
}
.ld-stern svg{ width: 17px; height: 17px; fill: currentColor }
.ld-stern--an{ color: #e0a400 }
.ld-sterne:hover .ld-stern{ color: #f2c94c }
.ld-sterne .ld-stern:hover ~ .ld-stern{ color: var(--ld-rand-stark) }
.ld-stern:focus-visible{ outline: 2px solid var(--zk-akzent); outline-offset: 1px }
.ld-sterne--gross{ margin-left: -4px }
.ld-sterne--gross .ld-stern{ width: 36px; height: 36px }
.ld-sterne--gross .ld-stern svg{ width: 24px; height: 24px }
.ld-karte .ld-sterne{ display: flex; margin: -2px 0 2px -4px }
.ld-panel-merkmal{ margin-top: 12px }
.ld-anrede-platz:empty{ display: none }
.ld-marke--anrede{ --m: #0f766e; --m-text: #0f5f58 }
.ld-anrede-wahl{ display: inline-flex; border: 1px solid var(--ld-rand-stark); border-radius: 10px; overflow: hidden }
.ld-anrede-knopf{ min-height: 34px; padding: 0 14px; border: 0; background: var(--ld-flaeche); color: var(--ld-text-2, var(--ld-text)); font: inherit; font-size: 14px; cursor: pointer }
.ld-anrede-knopf + .ld-anrede-knopf{ border-left: 1px solid var(--ld-rand-stark) }
.ld-anrede-knopf--an{ background: var(--zk-akzent); color: #fff }
.ld-anrede-knopf:focus-visible{ outline: 2px solid var(--zk-akzent); outline-offset: -2px }