/* Werkbank — Bereich kunden (Vorlage docs/werkbank-vorlage/). Nur html.wb.
   Kunden-Liste (#viewKunden) und Kundenakte (#kundeDetailView, Klassen ak-* / wbk-*).
   Markup dazu: crm-customers.js (Zweig WB()). */

/* ---------- Kürzelfelder (Liste, Berater) — vier Töne der Vorlage, stabil je Name ---------- */
html.wb .wbk-av{width:38px;height:38px;flex:none;display:inline-flex;align-items:center;justify-content:center;font-size:12.5px;font-weight:700;background:var(--wbk-t0-bg);color:var(--wbk-t0-fg)}
html.wb{--wbk-t0-bg:#F1F2EE;--wbk-t0-fg:#3A443E;--wbk-t1-bg:#E9DCC4;--wbk-t1-fg:#5B4320;--wbk-t2-bg:#E3F0E8;--wbk-t2-fg:#14513A;--wbk-t3-bg:#16201B;--wbk-t3-fg:#FFFFFF;--wbk-ico-line:color-mix(in srgb,var(--accent) 22%,#fff);--wbk-note-bg:#FAFBF8}
html.wb[data-theme="dark"]{--wbk-t0-bg:#232A25;--wbk-t0-fg:#CBD3CC;--wbk-t1-bg:#3A3122;--wbk-t1-fg:#F1DDB6;--wbk-t2-bg:#16301F;--wbk-t2-fg:#8FD9B2;--wbk-t3-bg:#EDF1EC;--wbk-t3-fg:#16201B;--wbk-ico-line:color-mix(in srgb,var(--accent) 35%,var(--surface));--wbk-note-bg:#1C241E}
html.wb .wbk-av.t1{background:var(--wbk-t1-bg);color:var(--wbk-t1-fg)}
html.wb .wbk-av.t2{background:var(--wbk-t2-bg);color:var(--wbk-t2-fg)}
html.wb .wbk-av.t3{background:var(--wbk-t3-bg);color:var(--wbk-t3-fg)}
/* Berater: klein, nur Grün oder Sand (wie Vorlage) */
html.wb .wbk-av.sm{width:28px;height:28px;font-size:11px}
html.wb .wbk-av.sm.t0,html.wb .wbk-av.sm.t2{background:var(--wbk-t2-bg);color:var(--wbk-t2-fg)}
html.wb .wbk-av.sm.t1,html.wb .wbk-av.sm.t3{background:var(--wbk-t1-bg);color:var(--wbk-t1-fg)}

/* ---------- Kunden-Liste: Suchzeile + Tabelle als eine weiße Karte ---------- */
html.wb #viewKunden .page-actions{flex-wrap:wrap}
html.wb #viewKunden #kundenFilterBtn svg{display:none}
html.wb #viewKunden .kunden-filter{margin:0 0 14px;padding:22px 24px;border:0;background:var(--surface)}
html.wb #viewKunden .kunden-filter input,html.wb #viewKunden .kunden-filter select{background:var(--wb-work);border:1px solid var(--field-line);color:var(--ink);height:40px;padding:0 10px}
html.wb #viewKunden .kunden-filter .field span{font-size:12.5px;font-weight:600;color:var(--ink-mid)}

html.wb #viewKunden .qbar{background:var(--surface);margin:0;padding:22px 24px 14px;gap:10px}
html.wb #viewKunden .qbar-search{flex:0 1 300px;min-width:200px}
html.wb #viewKunden .qbar-search input{height:42px;padding:0 14px 0 39px;border:0;background:var(--wb-work);color:var(--ink);font-size:14px}
html.wb #viewKunden .qbar-search input::placeholder{color:var(--ink-faint)}
html.wb #viewKunden .qbar-search input:focus{outline:2px solid var(--accent-dark);outline-offset:-2px}
html.wb #viewKunden .qbar-search svg{left:14px;color:var(--ink-faint)}
html.wb #viewKunden .qbar-pills{gap:6px}
html.wb #viewKunden .qpill{height:38px;padding:0 13px;gap:7px;border:1px solid var(--field-line);background:var(--surface);color:var(--ink);font-size:13.5px;font-weight:600;transition:none}
html.wb #viewKunden .qpill:hover{background:var(--wb-soft);border-color:var(--field-line)}
html.wb #viewKunden .qpill .n{font-size:13.5px;font-weight:600;color:var(--ink-faint)}
html.wb #viewKunden .qpill.active{background:var(--wb-dark);border-color:var(--wb-dark);color:var(--wb-frame)}
html.wb #viewKunden .qpill.active .n{color:var(--wb-frame);opacity:.72}
html.wb #viewKunden .qbar-count{font-size:13.5px;color:var(--ink-faint)}

html.wb #kundenList{background:var(--surface);padding:0 24px 10px;min-height:60px}
html.wb #kundenList>p.muted{margin:0;padding:10px 0 16px}
html.wb #kundenList .lead-table-wrap{margin:0;background:transparent}
html.wb #kundenList .lead-table{font-size:13.5px}
html.wb #kundenList .lead-table th{padding:10px 12px;font-size:12.5px;font-weight:500;color:var(--ink-faint);border-bottom:1px solid var(--line)}
html.wb #kundenList .lead-table td{padding:12px;border-bottom:1px solid var(--line);color:var(--ink);vertical-align:middle}
html.wb #kundenList .lead-table tbody tr:hover td{background:var(--wb-soft)}
html.wb #kundenList .lead-table .dot-col{width:26px;padding-left:0;padding-right:0!important}
html.wb #kundenList .pin-dot{padding:9px}
html.wb #kundenList .pin-dot .dot{border-color:var(--field-line)}
html.wb #kundenList .lead-table tr.pinned td{background:transparent}
html.wb #kundenList .lead-table tr.pinned:hover td{background:var(--wb-soft)}
html.wb #kundenList .lead-table tbody tr.is-new td{background:var(--accent-soft)}
html.wb #kundenList .tbl-section td{padding:14px 12px 6px;font-size:12.5px;font-weight:600;color:var(--ink-faint);background:transparent!important;border-bottom:1px solid var(--line)}
html.wb #kundenList .cust-cell{gap:12px}
html.wb #kundenList .cust-name{font-size:14.5px;font-weight:600;line-height:1.25;overflow:hidden;text-overflow:ellipsis}
html.wb #kundenList .cust-role{font-size:12.5px;color:var(--ink-faint);margin-top:2px}
html.wb #kundenList .wbk-cell{display:block;min-width:0}
html.wb #kundenList .wbk-l1,html.wb #kundenList .wbk-l2{display:block}
html.wb #kundenList .wbk-l2,html.wb #kundenList td .muted{font-size:12.5px;color:var(--ink-faint);margin-top:2px}
html.wb #kundenList .adv-cell{gap:9px}
html.wb #kundenList .link-btn{font-size:13.5px}
html.wb #kundenList .acc-empty,html.wb #kundenList .es{border:0;background:transparent}

/* Status-Etiketten (Liste und Kopf der Akte) */
html.wb #viewKunden .sub-badge{display:inline-block;font-size:12px;font-weight:700;padding:4px 9px;border:0;white-space:nowrap;background:var(--wb-pill-neu-bg);color:var(--wb-pill-neu-fg)}
html.wb #viewKunden .sub-badge.ok,html.wb #viewKunden .sub-badge.koop{background:var(--wb-pill-frei-bg);color:var(--wb-pill-frei-fg)}
html.wb #viewKunden .sub-badge.expired{background:var(--wb-warn-bg);color:var(--wb-warn)}
html.wb #viewKunden .sub-badge.wait{background:var(--wb-pill-res-bg);color:var(--wb-pill-res-fg)}
html.wb #viewKunden .sub-badge.website{background:var(--wb-pill-kont-bg);color:var(--wb-pill-kont-fg)}

/* ---------- Kundenakte: Kopf ---------- */
html.wb .ak-top{display:flex;align-items:flex-start;gap:14px;flex-wrap:wrap;margin:0 0 22px}
html.wb .ak-top .ak-back{height:44px;padding:0 14px;gap:7px;border:0;background:var(--surface);color:var(--ink-mid);font-size:14px;font-weight:600}
html.wb .ak-top .ak-back:hover{background:var(--wb-soft);color:var(--ink)}
html.wb .ak-id{flex:1 1 260px;min-width:0}
html.wb .ak-headline{gap:8px}
html.wb .ak-name{font-family:var(--font-body);font-size:30px;font-weight:600;letter-spacing:-.02em;line-height:1.15;margin-right:4px}
html.wb .ak-subline{font-size:14px;color:var(--ink-soft);margin-top:8px;white-space:normal;overflow:visible}
html.wb .ak-referrer,html.wb .ak-referred-to,html.wb .ak-consent{font-size:12px;font-weight:600;padding:4px 9px;border:0;background:var(--surface);color:var(--ink-mid)}
html.wb .ak-referrer.is-koop{background:var(--wb-pill-frei-bg);color:var(--wb-pill-frei-fg)}
html.wb .ak-consent{cursor:pointer}
html.wb .ak-consent:hover{background:var(--wb-soft);color:var(--ink)}

html.wb .ak-toolbar{margin:0;gap:8px;flex-wrap:wrap}
html.wb .btn-akx{height:44px;width:auto;padding:0 14px;gap:6px;border:0;background:var(--surface);color:var(--ink);font:600 14px/1 var(--font-body);white-space:nowrap;transition:none}
html.wb .btn-akx:hover{background:var(--wb-soft);color:var(--ink)}
html.wb .btn-akx .lbl{display:inline}
html.wb #akIntake>svg:first-child,html.wb #akMail>svg:first-child{display:none}
html.wb #akNewProject>svg:first-child{width:13px;height:13px}
html.wb .btn-akx.primary{background:var(--accent);color:var(--accent-ink);padding:0 16px}
html.wb .btn-akx.primary:hover{background:var(--accent-hover);color:var(--accent-ink)}
html.wb .btn-akx .ak-lock{color:var(--ink-faint)}
html.wb .btn-ak{width:44px;height:44px;border:0;background:var(--surface);color:var(--ink-mid);transition:none}
html.wb .btn-ak:hover{background:var(--wb-soft);color:var(--ink)}
html.wb #akDelete,html.wb #akDelete:hover{color:var(--wb-warn)}
html.wb .ak-tb-sep{display:none}

/* Reiter: Segmentleiste kommt aus werkbank.css; hier nur Abstand und Zähler */
html.wb .ak-tabs{margin:0 0 22px;gap:2px}
html.wb .ak-tabs .ak-tab{margin:0;display:inline-flex;align-items:baseline;gap:6px}
html.wb .ak-tabn,html.wb .ak-tab.on .ak-tabn{font-size:12.5px;font-weight:600;color:var(--ink-faint)}
html.wb .ak-tab.is-live,html.wb .ak-tab.is-live.on{color:var(--accent-dark)}
html.wb .ak-tablive{font-size:11px;font-weight:700;color:var(--accent-dark);background:var(--accent-soft);padding:2px 6px}

/* ---------- Kundenakte: Inhalt ---------- */
html.wb .ak-body{background:var(--surface);border:0;padding:22px 24px 26px}
html.wb .ak-body.wbk-flat{background:transparent;padding:0}
html.wb .ak-timeline,html.wb .ak-composer{max-width:none}

html.wb .wbk-cols{display:flex;flex-wrap:wrap;gap:22px;align-items:flex-start}
html.wb .wbk-main{flex:1 1 600px;min-width:0;display:flex;flex-direction:column;gap:22px}
html.wb .wbk-side{flex:1 1 300px;max-width:360px;min-width:0;display:flex;flex-direction:column;gap:22px}
html.wb .wbk-card{background:var(--surface);padding:22px 24px;display:flex;flex-direction:column;gap:12px;min-width:0}
html.wb .wbk-h{margin:0;font-size:19px;font-weight:600;letter-spacing:-.01em;color:var(--ink)}
html.wb .wbk-hrow{display:flex;align-items:center;gap:10px}
html.wb .wbk-hrow .wbk-h{flex:1}
html.wb .wbk-leer{font-size:14px;color:var(--ink-soft)}
html.wb .ak-link{font:600 13px var(--font-body);color:var(--accent-dark)}

/* Kontakt + Suchprofil */
html.wb .wbk-kv{display:grid;grid-template-columns:auto 1fr;gap:10px 14px;font-size:13.5px}
html.wb .wbk-k{color:var(--ink-faint)}
html.wb .wbk-v{min-width:0;overflow:hidden;text-overflow:ellipsis;color:var(--ink)}
html.wb .wbk-v a{color:inherit;text-decoration:none}
html.wb .wbk-v a:hover{text-decoration:underline}
html.wb .wbk-chips{display:flex;gap:6px;flex-wrap:wrap}
html.wb .wbk-chips span{font-size:12.5px;padding:4px 9px;background:var(--wb-work);color:var(--ink-mid)}

/* Offene Rückfragen / Freigaben als eigene Karten */
html.wb .wbk-frcard .ak-frstrip{margin:0;gap:12px}
html.wb .wbk-frcard .ak-frstrip-h{font-size:19px;font-weight:600;letter-spacing:-.01em;color:var(--ink)}
html.wb .ak-fr{background:var(--accent-soft);border:0;padding:14px 16px}
html.wb .ak-fr-h{font-size:12.5px;color:var(--ink-soft)}
html.wb .ak-fr-h b{font-size:14.5px;font-weight:600}
html.wb .ak-fr-t{font-size:14.5px}
html.wb .ak-fr .link-btn{font-weight:600;color:var(--accent-dark)}
html.wb .ak-fr-in{border:1px solid var(--field-line)}
html.wb .wbk-advcard{gap:14px}
html.wb .wbk-advcard .adv-strip{margin:0;padding:0;border:0;background:transparent}

/* Reserviert & gekauft */
html.wb .ak-immos{margin:0}
html.wb .ak-immos-lbl{font-size:12.5px;font-weight:600;color:var(--ink-faint);margin:0 0 8px}
html.wb #akImmoCard .ak-immos:has([data-immo]) .ak-immos-lbl{display:none}
html.wb #akImmoCard .ak-immos + .ak-immos:has([data-immo]) .ak-immos-lbl{display:block}   /* neben Eigentum braucht die zweite Gruppe ihren Namen */
html.wb .ak-immos-list{gap:8px}
html.wb .ak-immo{gap:14px;padding:12px 14px;border:1px solid var(--field-line);background:var(--surface);cursor:pointer;flex-wrap:wrap}
html.wb .ak-immo:hover{background:var(--wb-soft);border-color:var(--field-line)}
html.wb .ak-immo-media{width:56px;height:56px;background:var(--wb-work)}
html.wb .ak-immo-main{flex:1 1 220px;gap:3px}
html.wb .ak-immo-t{font-size:15px;font-weight:600;white-space:normal}
html.wb .ak-immo-unit{font-weight:600;color:var(--ink)}
html.wb .ak-immo-s{font-size:13px;color:var(--ink-soft);white-space:normal}
html.wb .ak-immo-tag{font-size:12px;font-weight:700;padding:4px 9px;border:0;white-space:nowrap;background:var(--wb-pill-res-bg);color:var(--wb-pill-res-fg)}
html.wb .ak-immo-tag.is-gelb{background:var(--wb-pill-res-bg);color:var(--wb-pill-res-fg)}
html.wb .ak-immo-tag.is-rot{background:var(--wb-warn-bg);color:var(--wb-warn)}
html.wb .ak-immo-tag.is-sold{background:var(--wb-pill-frei-bg);color:var(--wb-pill-frei-fg)}
html.wb .ak-immo-tag.is-owned{background:var(--accent);color:var(--accent-ink)}
html.wb .ak-immo-go{flex:none;color:var(--ink-faint)}

/* Aktivität: Filter, Suche, Notizfeld */
html.wb .wbk-akt{gap:16px}
html.wb .ak-filters{gap:8px;margin:0}
html.wb .ak-filters .wbk-h{margin-right:8px}
html.wb .ak-chip{height:34px;padding:0 11px;border:1px solid var(--field-line);background:var(--surface);color:var(--ink);font:600 13px/1 var(--font-body);white-space:nowrap;transition:none}
html.wb .ak-chip:hover{background:var(--wb-soft);border-color:var(--field-line);color:var(--ink)}
html.wb .ak-chip.on{background:var(--wb-dark);border-color:var(--wb-dark);color:var(--wb-frame)}
html.wb .ak-search{flex:0 1 220px;width:auto;min-width:160px;height:34px;padding:0 11px;gap:8px;border:0;background:var(--wb-work);color:var(--ink-faint)}
html.wb .ak-search input{font-size:13px;padding:0;height:100%}
html.wb .ak-search input::placeholder{color:var(--ink-faint)}
html.wb .ak-search:focus-within{outline:2px solid var(--accent-dark);outline-offset:-2px;border:0}
html.wb .ak-composer-wrap{margin:0}
html.wb .ak-composer{align-items:center;gap:10px;padding:8px 8px 8px 10px;border:1px solid var(--field-line);background:var(--surface)}
html.wb .ak-composer:focus-within{border-color:var(--accent-dark)}
html.wb .ak-composer-av{width:32px;height:32px;background:var(--accent);color:var(--accent-ink);font-size:11.5px;font-weight:700;align-self:flex-start}
html.wb .ak-composer textarea{font-size:14px;padding:6px 0}
html.wb .ak-composer textarea::placeholder{color:var(--ink-faint)}
html.wb .ak-composer-clip{padding:7px;color:var(--ink-faint)}
html.wb .ak-composer-clip:hover{background:var(--wb-hover);color:var(--ink)}
html.wb .ak-composer-clip svg{width:17px;height:17px}
html.wb .ak-composer .btn{height:36px;padding:0 15px!important;font-size:13.5px!important}
html.wb .ak-attstage{padding:8px 0 0 52px}
html.wb .ak-fchip{border:1px solid var(--field-line);background:var(--surface);font-size:13px}

/* Zeitleiste */
html.wb .ak-daygroup{font-size:12px;font-weight:700;color:var(--ink-faint);margin:18px 0 14px}
html.wb .ak-daygroup:first-child{margin-top:0}
html.wb .ak-entry{grid-template-columns:30px minmax(0,1fr);gap:14px;padding-bottom:18px}
html.wb .ak-entry::before{left:14px;top:30px;bottom:0;width:1.5px;background:var(--field-line)}
html.wb .ak-ico,html.wb .ak-mail>.ak-ico,html.wb .ak-note>.ak-ico{width:30px;height:30px;border:1.5px solid var(--wbk-ico-line);background:var(--surface);color:var(--green)}
html.wb .ak-ico svg{width:14px;height:14px}
html.wb .ak-task.done>.ak-ico{background:var(--accent);border-color:var(--accent);color:var(--accent-ink)}
html.wb .ak-line{align-items:baseline;gap:10px;padding-top:4px;min-height:30px}
html.wb .ak-line-t{font-size:14.5px;font-weight:400;color:var(--ink)}
html.wb .ak-line-sub{font-size:13px;color:var(--ink-faint)}
html.wb .ak-time{font-size:12.5px;color:var(--ink-faint)}
html.wb .ak-dl{font-size:14.5px;font-weight:600;color:var(--accent-dark)}
html.wb .ak-due{font-size:12px;font-weight:700;padding:2px 7px;background:var(--wb-warn-bg);color:var(--wb-warn)}
html.wb .ak-task.done .ak-due{background:var(--wb-pill-neu-bg);color:var(--wb-pill-neu-fg)}
html.wb .ak-task .ak-line{align-items:center}
html.wb .ak-task-btn{height:32px;padding:0 12px;border:1px solid var(--field-line);background:var(--surface);color:var(--ink);font:600 13px/1 var(--font-body);white-space:nowrap;transition:none}
html.wb .ak-task-btn:hover{background:var(--wb-soft);border-color:var(--field-line);color:var(--ink)}
html.wb .ak-card{border:1px solid var(--line);background:var(--surface)}
html.wb .ak-notecard{max-width:none;background:var(--wbk-note-bg)}
html.wb .ak-note-body{padding:14px 16px 0;font-size:14.5px;line-height:1.5}
html.wb .ak-note-files{padding:10px 16px 0}
html.wb .ak-note-foot{padding:8px 16px 14px;font-size:12.5px;color:var(--ink-faint)}
html.wb .ak-note-foot .link-btn{font-size:12.5px;color:var(--wb-warn)}
html.wb .ak-mhead{padding:10px 14px;gap:10px}
html.wb .ak-mhead:hover{background:var(--wb-soft)}
html.wb .ak-mfrom{font-size:14.5px;font-weight:600}
html.wb .ak-msubj{font-size:13.5px;color:var(--ink-soft)}
html.wb .ak-mbadge{font-size:11.5px;font-weight:700;padding:3px 8px}
html.wb .ak-mbadge.in{background:var(--wb-pill-frei-bg);color:var(--wb-pill-frei-fg)}
html.wb .ak-mbadge.out,html.wb[data-theme="dark"] .ak-mbadge.out{background:var(--wb-pill-res-bg);color:var(--wb-pill-res-fg)}
html.wb .ak-mbody{border-top:1px solid var(--line)}
html.wb .ak-mtext{font-size:14px}
html.wb .ak-reply-ed{border:1px solid var(--field-line);background:var(--wb-work)}
html.wb .ak-reply-ed:focus{border-color:var(--accent-dark)}
html.wb .ak-fmtbar button:hover{background:var(--wb-hover)}
html.wb .ak-empty{font-size:14px;color:var(--ink-soft);text-align:left;padding:6px 0}
html.wb .ak-more{justify-content:flex-start;padding:4px 0 0 44px}

/* ---------- Reiter Vorgänge / Stammdaten / Beratungsstand ---------- */
html.wb .ak-vglist{gap:8px}
html.wb .ak-vg{padding:12px 14px;border:1px solid var(--field-line);background:var(--surface);transition:none}
html.wb .ak-vg:hover{background:var(--wb-soft);border-color:var(--field-line)}
html.wb .ak-vg-t{font-size:15px;font-weight:600}
html.wb .ak-vg-o{font-size:13px;color:var(--ink-soft)}
html.wb .ak-body .ov-sec{margin-top:26px}
html.wb .ak-body .ov-sec:first-child{margin-top:0}
html.wb .ak-body .ov-sec-t{font-size:19px;font-weight:600;letter-spacing:-.01em;color:var(--ink);margin:0 0 6px}
html.wb .ak-body .ov-row{padding:10px 0;gap:3px;border-bottom:1px solid var(--line)}
html.wb .ak-body .ov-k{font-size:12.5px;color:var(--ink-faint)}
html.wb .ak-body .ov-v{font-size:14px;font-weight:500;color:var(--ink)}
html.wb .ak-body .ov-v.empty{color:var(--ink-faint);font-weight:400}
html.wb .ak-body .ov-link{color:var(--accent-dark)}
html.wb .ak-body #akStammEdit{margin-top:22px}
html.wb .ak-body .adv-h{font-size:19px;font-weight:600}

/* ---------- Schmal ---------- */
@media (max-width:900px){
  html.wb .wbk-side{max-width:none;flex-basis:100%}
}
@media (max-width:720px){
  html.wb #viewKunden .qbar{padding:16px 14px 12px}
  html.wb #viewKunden .qbar-search{flex:1 1 100%}
  html.wb #kundenList{padding:0 14px 10px}
  html.wb .ak-name{font-size:24px}
  html.wb .ak-id{flex-basis:100%}
  html.wb .btn-akx,html.wb .btn-ak{height:42px;border-radius:0}
  html.wb .btn-ak{width:42px}
  html.wb .wbk-card,html.wb .ak-body{padding:18px 16px}
  html.wb .ak-body.wbk-flat{padding:0}
  html.wb .ak-search{flex:1 1 100%;margin-left:0}
  html.wb .ak-msubj{white-space:normal;flex:1 1 100%;order:5}
  html.wb .ak-mfrom{flex:1 1 100%}
  html.wb #kundenList .wbk-cell{text-align:right;min-width:0;overflow-wrap:anywhere}
}

/* ---------- Dialoge aus crm-customers.js (Kunde anlegen/bearbeiten) ---------- */
html.wb .modal-card .ov-sec-t,html.wb #modalBody .cf-sec,html.wb .acc-fv .cf-sec{color:var(--ink);font-size:14px;font-weight:600}

/* ---------- Kunden-Tags (02.11.2026): abgerundet, kursiv, vollflächig in erdigen Pastelltönen. Ausnahme von Radius 0, siehe DESIGN.md ---------- */
html.wb{--kt-ink:#1F2A24;--kt-0:#EBC4A0;--kt-1:#CDD2DF;--kt-2:#C3DABF;--kt-3:#B9D4E8;--kt-4:#E6DAC3;--kt-5:#B3DBD5;--kt-6:#E9B3A8;--kt-7:#F3E39A}
html.wb[data-theme="dark"]{--kt-0:#DDB896;--kt-1:#C0C5D2;--kt-2:#B5CCB1;--kt-3:#ABC6DA;--kt-4:#D6CBB5;--kt-5:#A5CDC7;--kt-6:#DAA69B;--kt-7:#E3D48E}
html.wb .kt-tag{display:inline-flex;align-items:center;gap:4px;height:24px;max-width:100%;padding:0 9px;border:0;border-radius:6px;color:var(--kt-ink);font-family:var(--font-body);font-size:12.5px;font-weight:600;font-style:italic;line-height:1;white-space:nowrap}
html.wb button.kt-tag{cursor:pointer}
html.wb .kt-0{background:var(--kt-0)}html.wb .kt-1{background:var(--kt-1)}html.wb .kt-2{background:var(--kt-2)}html.wb .kt-3{background:var(--kt-3)}
html.wb .kt-4{background:var(--kt-4)}html.wb .kt-5{background:var(--kt-5)}html.wb .kt-6{background:var(--kt-6)}html.wb .kt-7{background:var(--kt-7)}
html.wb .kt-tag.ist-ohne{background:transparent;box-shadow:inset 0 0 0 1px var(--field-line);color:var(--ink)}
html.wb .kt-tag.ist-gewaehlt{outline:2px solid var(--ink);outline-offset:1px}
html.wb .kt-tag.ist-gross{height:28px;font-size:13px}
html.wb .kt-tag.mit-weg{padding-right:2px}
html.wb .kt-weg{width:24px;height:24px;display:flex;align-items:center;justify-content:center;padding:0;border:0;background:none;color:inherit;cursor:pointer}
html.wb .kt-zelle{display:flex;flex-wrap:wrap;gap:7px;align-items:center}
html.wb #viewKunden .qbar-pills{flex:0 1 auto}
html.wb #viewKunden .qbar-count{margin-left:auto}
html.wb .kt-mehr{font-size:12.5px;font-weight:600;color:var(--ink-faint);padding:0 2px}
/* Aufklappliste: Filter und Akte */
html.wb .kt-filter,html.wb .kt-anker{position:relative}
html.wb .kt-menu{position:absolute;z-index:30;top:calc(100% + 6px);left:0;width:340px;max-width:calc(100vw - 40px);background:var(--surface);box-shadow:var(--shadow)}
html.wb .kt-suche{padding:12px 12px 8px}
html.wb .kt-suche input{width:100%;box-sizing:border-box;height:40px;padding:0 12px;border:1.5px solid transparent;background:var(--wb-work);color:var(--ink);font-size:14px}
html.wb .kt-suche input:focus{outline:0;border-color:var(--accent-dark)}
html.wb .kt-zeilen{display:flex;flex-direction:column;max-height:390px;overflow-y:auto;padding:0 4px 6px}
html.wb .kt-zeile{display:flex;align-items:center;gap:10px;width:100%;min-height:42px;padding:0 10px;border:0;background:transparent;color:var(--ink);text-align:left;cursor:pointer}
html.wb .kt-zeile:hover,html.wb .kt-zeile.on{background:var(--wb-soft)}
html.wb .kt-zeile small{margin-left:auto;font-size:13px;color:var(--ink-faint)}
html.wb .kt-kasten{width:18px;height:18px;flex:none;box-sizing:border-box;display:flex;align-items:center;justify-content:center;border:1.5px solid var(--field-line);background:var(--surface);color:var(--accent-ink)}
html.wb .kt-zeile.on .kt-kasten{background:var(--accent);border-color:var(--accent)}
html.wb .kt-leer{margin:0;padding:6px 14px 14px;font-size:13.5px;line-height:1.5;color:var(--ink-soft)}
html.wb .kt-menufuss{padding:10px 14px 12px;border-top:1px solid var(--line);font-size:13.5px;font-weight:600}
html.wb .kt-menufuss a{color:var(--accent-dark);text-decoration:none}
html.wb .kt-neu{display:flex;flex-direction:column;gap:10px;padding:12px 14px 14px;background:var(--wb-soft)}
html.wb .kt-neu p{margin:0;font-size:14px;font-weight:600}
html.wb .kt-farben{display:flex;flex-wrap:wrap;gap:4px}
html.wb .kt-farbe{width:32px;height:32px;display:flex;align-items:center;justify-content:center;padding:0;border:0;background:transparent;cursor:pointer}
html.wb .kt-farbe.on{background:var(--wb-seg);box-shadow:inset 0 0 0 1.5px var(--ink-soft)}
html.wb .kt-farbe i{display:block;width:18px;height:18px;border-radius:5px}
/* Leiste mit aktivem Filter in der Kundenliste */
html.wb #kundenTagLeiste{background:var(--surface);padding:0 24px}
html.wb .kt-leiste{display:flex;flex-wrap:wrap;align-items:center;gap:8px;margin-bottom:14px;padding:10px 12px;background:var(--wb-soft)}
html.wb .kt-seg{display:inline-flex;gap:2px;padding:3px;margin-left:6px;background:var(--wb-seg)}
html.wb .kt-seg button{height:26px;padding:0 10px;border:0;background:transparent;color:var(--ink-soft);font-size:13px;font-weight:600;cursor:pointer}
html.wb .kt-seg button.on{background:var(--surface);color:var(--ink)}
html.wb .kt-link{height:30px;padding:0 8px;border:0;background:none;color:var(--ink-soft);font-size:13px;font-weight:600;cursor:pointer}
html.wb .kt-schreiben{margin-left:auto;display:inline-flex;align-items:center;height:34px;padding:0 13px;border:0;background:var(--accent-soft);color:var(--accent-dark);font-size:13.5px;font-weight:600;cursor:pointer}
/* Akte */
/* Tags stehen in der Zeile der Reiter, rechts daneben: So rutscht der Inhalt nicht nach unten */
html.wb .kt-reiterzeile{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:10px 16px;margin:0 0 22px}
html.wb .kt-reiterzeile .ak-tabs{margin:0}
html.wb .kt-akte{display:flex;flex-wrap:wrap;align-items:center;justify-content:flex-end;gap:6px;min-width:0}
html.wb .kt-akte .kt-tag.ist-gross{height:26px}
html.wb .kt-akte .kt-menu{left:auto;right:0}
@media (max-width:900px){html.wb .kt-akte{justify-content:flex-start}html.wb .kt-akte .kt-menu{right:auto;left:0}}
html.wb .kt-dazu{display:inline-flex;align-items:center;gap:5px;height:26px;padding:0 10px;border:0;background:var(--accent-soft);color:var(--accent-dark);font-size:13px;font-weight:600;cursor:pointer}
/* Einstellungen */
html.wb .kt-set-kopf{display:flex;justify-content:flex-end;margin-bottom:10px}
html.wb .kt-set-zeile{display:flex;flex-wrap:wrap;align-items:center;gap:8px 12px;min-height:50px;border-bottom:1px solid var(--line)}
html.wb .kt-set-zeile>span:first-child{flex:1 1 180px;min-width:0}
html.wb .kt-set-zeile small{font-size:13.5px;color:var(--ink-soft)}
html.wb .kt-set-form{display:flex;flex-direction:column;gap:14px;padding:16px;margin:0 0 8px;background:var(--wb-soft)}
html.wb .kt-set-form .field{margin:0}
html.wb .kt-set-acts{display:flex;flex-wrap:wrap;gap:8px;align-items:center}
html.wb .kt-set-acts .kt-loeschen{margin-left:auto;height:38px;padding:0 12px;border:0;background:var(--wb-warn-bg);color:var(--wb-warn);font-weight:600;cursor:pointer}
html.wb .kt-sperre{display:flex;gap:12px;padding:14px;margin-bottom:12px;background:repeating-linear-gradient(-45deg,var(--wb-warn-bg),var(--wb-warn-bg) 5px,color-mix(in srgb,var(--wb-warn-bg) 88%,var(--wb-warn)) 5px,color-mix(in srgb,var(--wb-warn-bg) 88%,var(--wb-warn)) 10px)}
html.wb .kt-sperre>i{width:24px;height:24px;flex:none;display:flex;align-items:center;justify-content:center;background:var(--wb-warn);color:var(--surface);font-style:normal;font-weight:700}
html.wb .kt-sperre b{display:block;color:var(--wb-warn)}
html.wb .kt-sperre p{margin:4px 0 0;font-size:14px;line-height:1.5;color:var(--ink)}
html.wb .kt-sperre a{color:var(--wb-warn);font-weight:700}
/* Mitteilungen, Schritt Empfänger */
html.wb .kt-wahl{display:flex;flex-direction:column;gap:10px;margin-top:10px}
html.wb .kt-wahl-satz{display:flex;flex-wrap:wrap;align-items:center;gap:8px;font-size:14.5px}
html.wb .kt-wahl .kt-seg{margin-left:0}
html.wb .kt-wahl-liste{display:flex;flex-direction:column;border-top:1px solid var(--line)}
html.wb .kt-wahl-zeile{display:flex;flex-wrap:wrap;align-items:center;gap:4px 12px;min-height:46px;border-bottom:1px solid var(--line)}
html.wb .kt-wahl-zeile.on{background:var(--wb-soft)}
html.wb .kt-wahl-zeile label{flex:1 1 200px;min-width:0;display:flex;align-items:center;gap:10px;min-height:46px;padding-left:8px;cursor:pointer}
html.wb .kt-wahl-zeile input{width:18px;height:18px;margin:0;flex:none}
html.wb .kt-wahl-zeile small{font-size:13.5px;color:var(--ink-soft)}
html.wb .kt-wahl-zeile.ist-aus .kt-tag{opacity:.6}
html.wb .kt-aus{padding:3px 8px;background:var(--wb-warn-bg);color:var(--wb-warn);font-size:12.5px;font-weight:700}
html.wb .kt-wahl-zeile button{height:34px;padding:0 8px;border:0;background:none;color:var(--ink-soft);font-size:13px;font-weight:600;cursor:pointer}
html.wb .kt-wahl-zeile.ist-aus button{color:var(--accent-dark)}