/* Finales Design, Bereich Ablauf (Michael 26.10.2026, Anleitung docs/design-final.md): Aufgaben, Meldungen, Dringend, Nachrichten,
   Benachrichtigungen, Freigaben, Gäste, Gästebuch, Guide, Rechnungen, Infocenter, Forderungen.
   Lädt automatisch nach design2.css (design2ExtraCss). Nur Variablen, keine festen Farben; Selektoren mit .d2 bzw. html.d2.
   Statusfarben: Grün nur erledigt · Blau läuft/in Arbeit · Grau offen · Rot nur offene Probleme/Fehler/überfällig · Orange nur knapp. */

/* ================================================================ Aufgaben (app/pages/tasks.php, Markup aus app/lib/tasks_ui.php) */
/* Breite nutzen: keine 1400-px-Mittelspalte; Seitenfläche wie überall (--bg), Karte ruhig ohne Rahmen und Schatten */
html.d2 body:has(.tk-app),html.d2 body:has(.tk-page){background:var(--bg)}
html.d2 main:has(.tk-app){max-width:none}
html.d2 main:has(.tk-page){max-width:760px}
html.d2 .tk-card{border:0;box-shadow:none;border-radius:var(--r-panel)}
/* Kopf: Zahlen als ein Satz statt Pillen — beantwortet „Was ist überfällig / heute fällig?" */
.d2 .tk-hd{margin:0 0 var(--sec-gap);row-gap:6px}
.d2 .tk-hd h1{font-size:1.5rem;font-weight:800}
/* Aufgaben-Kopf selbst: Befund-Satz .tk-sum.d2-find > .tk-sn (d2-kern.css). Hier nur noch die übrigen Pillen (.tk-sp: Treffer im Archiv, „meine" in der Team-Karte) als Schrift */
.d2 .tk-sum:not(.d2-find){order:3;flex-basis:100%;gap:4px 0;font-size:14px}
.d2 .tk-sp{height:auto;padding:0;border:0;background:none;border-radius:0;font-size:14px;font-weight:500;color:var(--muted)}
.d2 .tk-sp b{font-weight:800;color:var(--ink)}
.d2 .tk-hd-r{order:2}
/* keine kleinen Großbuchstaben-Labels */
.d2 :is(.tk-colh,.tk-sh,.tk-tg,.tk-afl,.tk-pop-t){text-transform:none;letter-spacing:0}
.d2 .tk-colh{font-size:12.5px;font-weight:650;color:var(--muted)}
.d2 :is(.tk-sh,.tk-tg){font-size:13px;font-weight:700;color:var(--muted)}
.d2 .tk-afl{font-size:12.5px;font-weight:650}
.d2 .tk-pop-t{font-size:13px;font-weight:700}
/* Gruppen: Überfällig rot (überfällig), Heute normal dunkel, Erledigt grün; Zähler ruhig */
.d2 .tk-gl{font-size:14px;font-weight:800}
.d2 .g-today .tk-gl{color:var(--ink)}
.d2 .g-overdue .tk-gl{color:var(--s-prob)}
.d2 .g-done .tk-gl,.d2 .g-donetoday .tk-gl{color:var(--s-done)}
.d2 .tk-gc{background:var(--surface-3);color:var(--muted)}
.d2 .g-overdue .tk-gc{background:var(--s-prob-soft);color:var(--s-prob)}
/* Erledigt: grün abgehakt und durchgestrichen (Michael mag das) */
.d2 .is-done .tk-title{color:var(--muted);text-decoration:line-through;text-decoration-color:color-mix(in srgb,var(--muted) 60%,transparent)}
.d2 :is(.is-done .tk-check,.tk-check.is-on,.is-checking .tk-check){background:var(--s-done);border-color:var(--s-done)}
.d2 .tk-due.today{color:var(--ink)}
.d2 .tk-due.over{color:var(--s-prob)}
.d2 .overdue .tk-check{border-color:var(--s-prob)}
/* Info-Aufgaben: Blau heißt „läuft" — Infos neutral */
.d2 .is-info .tk-title{color:var(--ink)}
.d2 :is(.tk-check.info,.tk-av.info){background:var(--surface-3);color:var(--muted)}
/* Priorität mit den Prioritäts-Tönen (Dringend = Navy statt Rot; Rot bleibt Problemen vorbehalten) */
.d2 .tk-prio.p4,.d2 .tk-prio.p4 .ui-i{color:var(--prio-a-ink)}
.d2 .tk-prio.p4{font-weight:750}
.d2 .tk-prio.p3 .ui-i{color:var(--prio-b-ink)}
.d2 .tk-prio.p2 .ui-i{color:var(--muted)}
.d2 .tk-prio.p1 .ui-i{color:var(--soft)}
/* Personen-Kürzel: keine Statusfarben als Personenfarbe */
.d2 .tk-av:is(.c0,.c1,.c2,.c3,.c4,.c5,.c6,.c7){background:var(--navy-soft);color:var(--navy-text)}
/* Knöpfe: Grün und Gold nicht als Knopffarbe (Grün = erledigt, Gold = Fokus) → Navy */
.d2 :is(.tk-btn.ok,.tk-btn.gold,.tk-pill.gold){background:var(--primary);border-color:var(--primary);color:#fff}
.d2 .tk-team .tk-row.mine{box-shadow:inset 3px 0 0 var(--primary)}
.d2 .tk-chip.today{background:var(--surface-3);color:var(--ink)}
.d2 .tk-chip.over{background:var(--s-prob-soft);color:var(--s-prob)}
.d2 .tk-chip.ok{background:var(--s-done-soft);color:var(--s-done)}
.d2 .tk-stc.open{background:var(--surface-3);color:var(--muted)}
.d2 .tk-stc.done{background:var(--s-done-soft);color:var(--s-done)}
.d2 .tk-grp-hint{color:var(--muted);background:var(--surface-2)}   /* Hinweis, keine Warnung */
@media(max-width:759px){.d2 .tk-hd h1{font-size:1.25rem}}
/* Einzelansicht (task_view.php): Fläche statt Rahmen, linksbündig wie die übrigen Formularseiten */
html.d2 main:has(.tk-page){margin-left:0}
.d2 .tk-page .tk-det{border:0;background:var(--surface);border-radius:var(--r-panel)}

/* Befund-Satz im Kopf: .d2-head>.d2-find regelt design2.css zentral; Köpfe mit .hd (Rechnungen, Dringend) brauchen noch die volle Breite */
.d2 .hd>.d2-find{max-width:none}

/* ================================================================ Turno-Probleme (app/pages/problems.php) */
.d2 .pb-filter{margin:0 0 var(--sec-gap)}
.d2 .pb-list{gap:16px;grid-template-columns:repeat(auto-fill,minmax(min(100%,420px),1fr));align-items:start}
.d2 .pb-list>.card{margin:0;box-shadow:none}
html.d2 .card.probcard{border:0;border-left:4px solid var(--s-prob);border-radius:var(--r-panel)}
html.d2 .card.probcard.is-solved{border-left-color:var(--s-done)}
.d2 .probtitle{font-size:17px;font-weight:800;color:var(--ink)}
.d2 .is-solved .probtitle{color:var(--muted);text-decoration:line-through;text-decoration-color:color-mix(in srgb,var(--muted) 60%,transparent)}
.d2 .probapt{font-size:13px;font-weight:700;color:var(--muted)}
.d2 .probhead>.muted{font-variant-numeric:tabular-nums}
.d2 .probactions{display:flex;flex-wrap:wrap;gap:8px;margin-top:12px}

/* ================================================================ Dringend (app/modules/urgent) */
.d2 .esc-list{gap:16px;margin:0 0 var(--sec-gap);grid-template-columns:repeat(auto-fill,minmax(min(100%,460px),1fr));align-items:start}
html.d2 .esc-inc{margin:0;border:0;border-left:4px solid var(--s-todo);border-radius:var(--r-panel);box-shadow:none;padding:16px 18px}
.d2 .esc-inc.sev-critical.st-open{border-left-color:var(--s-prob)}
.d2 .esc-inc.sev-normal.st-open{border-left-color:var(--s-warn)}
.d2 .esc-inc.st-acked{border-left-color:var(--s-run)}
.d2 .esc-inc.st-solved{border-left-color:var(--s-done);opacity:1}
.d2 .esc-inc.st-solved .esc-title{text-decoration:line-through;text-decoration-color:color-mix(in srgb,var(--muted) 60%,transparent);color:var(--muted)}
.d2 .esc-inc.hl{box-shadow:0 0 0 2px var(--gold)}
.d2 .esc-top{gap:6px 8px;color:var(--ink)}
.d2 .esc-top b{font-size:15px;font-weight:800}
.d2 .esc-title{font-size:16px;font-weight:800;color:var(--ink);margin-top:8px}
.d2 .esc-meta{font-variant-numeric:tabular-nums}
.d2 .esc-hint{color:var(--s-warn)}
.d2 .esc-text{background:var(--surface-2)}

/* ================================================================ Team-Nachrichten (app/pages/messages.php) */
.d2 .msgpick{gap:6px 8px;margin-top:6px}
.d2 .msgperson{min-height:40px;padding:4px 12px 4px 8px;border-radius:999px;background:var(--surface-2)}
.d2 .msgperson:has(input:checked){background:var(--navy-soft);color:var(--navy-text)}
.d2 .msgitem{padding:12px 0}
.d2 .msgbody{margin-top:4px;max-width:var(--measure)}
/* „noch nicht gelesen" ist kein Fehler: fett dunkel statt rot */
.d2 .msgitem .neg{color:var(--ink);font-weight:650}
.d2 .histbox summary::before{color:var(--soft)}

/* ================================================================ Benachrichtigungen (app/pages/notifications.php) */
.d2 .nt-colh{text-transform:none;letter-spacing:0;font-size:12.5px;font-weight:650}

/* ================================================================ Rechnungen (app/modules/invoice) */
.d2 .inv-st-x{text-decoration:line-through}
.d2 .inv-list th{font-size:12.5px;font-weight:650;color:var(--muted);border-bottom-color:var(--line-2)}
.d2 .inv-list td{font-variant-numeric:tabular-nums}

/* ================================================================ Forderungen (app/modules/receivables — nur CSS, Fach-PR #258 läuft)
   Zweispaltig am Desktop bleibt (.rcv-detail). Stand: offen grau, überfällig rot, bezahlt grün, erlassen grau durchgestrichen.
   Überfällige Zeile nicht mehr ganz eingefärbt, sondern roter Rand links (rot = überfällig). */
.d2 :is(.rcv-tbl,.rcv-detail,.rcv-row) .badge{display:inline-flex;align-items:center;gap:6px;font-size:12.5px;font-weight:700;line-height:1.5;padding:1px 9px;border-radius:999px;
 background:var(--surface-3);color:var(--muted);border:0;white-space:nowrap}
.d2 :is(.rcv-tbl,.rcv-detail,.rcv-row) .badge::before{content:'';width:7px;height:7px;border-radius:50%;background:currentColor;flex:0 0 auto}
.d2 :is(.rcv-tbl,.rcv-detail,.rcv-row) .badge.rejected{background:var(--s-prob-soft);color:var(--s-prob)}
.d2 :is(.rcv-tbl,.rcv-detail,.rcv-row) .badge.approved{background:var(--s-done-soft);color:var(--s-done)}
.d2 :is(.rcv-tbl,.rcv-detail,.rcv-row) .badge.cancelled{text-decoration:line-through}
.d2 .rcv-tbl tr.is-over td{background:none}
.d2 .rcv-tbl tr.is-over td:first-child{box-shadow:inset 3px 0 0 var(--s-prob)}
.d2 .rcv-tbl th{font-size:12.5px;font-weight:650}
.d2 .rcv-tbl tr.is-over input[name=due_date]{color:var(--s-prob)}
.d2 .rcv-tbl tr.is-over input[name=remind_on]{color:var(--ink)}
.d2 .rcv-due.over{color:var(--s-prob)}
.d2 .rcv-srchint{color:var(--s-warn)!important}
/* Kennzahlen als Schrift statt Kacheln */
.d2 .rcv-kpis{gap:16px 24px;margin:4px 0 16px}
.d2 .rcv-kpi{background:none;border:0;padding:0}
.d2 .rcv-kpi b{font-size:26px;font-weight:800;line-height:1.1}
.d2 .rcv-kpi small{display:block;font-size:12.5px}
.d2 .rcv-kpi.over{background:none}.d2 .rcv-kpi.over b{color:var(--s-prob)}
.d2 .rcv-apt{background:var(--navy-soft);color:var(--navy-text)}
.d2 .rcv-pre{border:0;background:var(--surface-2)}
@media(max-width:760px){
 .d2 .rcv-tbl tr{border:0;background:var(--surface-2);border-radius:var(--r-tile);padding:10px 12px}
 .d2 .rcv-tbl tr.is-over{box-shadow:inset 3px 0 0 var(--s-prob)}
 .d2 .rcv-tbl tr.is-over td:first-child{box-shadow:none}
}

/* ================================================================ Gästenachrichten (app/modules/guest, Posteingang ?p=guest)
   Gruppen-Überschriften normal geschrieben; Zeilen ruhig (keine Schatten), Rot nur „dringend" (offenes Problem), ungelesen Navy-Rand. */
.d2 :is(.gm-grp,.gm-uxc-sub,.gma-phase){text-transform:none;letter-spacing:0}
.d2 .gm-grp{font-size:14px;font-weight:800;color:var(--ink)}
.d2 .gm-grp .gm-grp-n{background:var(--surface-3);color:var(--muted)}
.d2 .gm-grp-urgent{color:var(--s-prob)}.d2 .gm-grp-urgent .gm-grp-n{background:var(--s-prob-soft);color:var(--s-prob)}
.d2 .gm-grp-waiting .gm-grp-n{background:var(--navy-bg);color:var(--on-navy)}
.d2.dk .gm-grp-waiting .gm-grp-n{background:var(--primary);color:#fff}
.d2 :is(.gm-uxc-sub,.gma-phase){font-size:13px;font-weight:700}
html.d2 .gm-row.gm-ux{border:0;box-shadow:none;border-radius:var(--r-tile)}
html.d2 .gm-row.gm-ux:hover{box-shadow:none;background:var(--surface-2)}
html.d2 .gm-row.gm-ux.g-urgent{box-shadow:inset 4px 0 0 var(--s-prob)}
html.d2 .gm-row.gm-ux.unread:not(.g-urgent){box-shadow:inset 4px 0 0 var(--primary)}
.d2 .gm-row.gm-ux.g-urgent .gm-ux-av{background:var(--s-prob)}
.d2 .gm-row.gm-ux.g-closed .gm-prev{text-decoration:line-through;text-decoration-color:color-mix(in srgb,var(--soft) 60%,transparent)}
.d2 .gm-ux-acts .btn.sm.green{box-shadow:none}
.d2 .gm-autohint{font-size:14px;color:var(--ink);max-width:none}
.d2 .gm-uxchip.ok{background:var(--s-done-soft);color:var(--s-done);border-color:transparent}
.d2 .gm-uxchip.warn{background:var(--s-warn-soft);color:var(--s-warn);border-color:transparent}

/* ================================================================ Gästemappe-Verwaltung (app/modules/guestbook): Zähler „Bestellungen" Navy — offene Bestellung ist kein Problem */
.d2 .tabs a[href$="p=gb_orders"] .cnt{background:var(--navy-bg);color:var(--on-navy)}
.d2.dk .tabs a[href$="p=gb_orders"] .cnt{background:var(--primary);color:#fff}

/* ================================================================ Guide (app/modules/guide): Einschulung — Fortschritt blau (läuft), grün erst bei 100 % */
.d2 .gd-bar{height:6px;background:var(--s-todo-soft)}
.d2 .gd-bar i{background:var(--s-run)}
.d2 .gd-bar i[style*="width:100%"]{background:var(--s-done)}

/* ================================================================ Reinigungs-Infocenter (app/modules/cleaninfo, ?p=ic)
   Kennzahlen als Schrift; Karten ruhig (Tonstufe statt Rahmen/Schatten), Status: läuft/unterbrochen blau, fertig grün,
   noch nicht gestartet grau, nicht bestätigt orange (Warnung), Probleme rot. */
.d2 .ic-head h1{font-size:1.5rem;font-weight:800}
.d2 .ic-kpis{grid-template-columns:repeat(auto-fit,minmax(min(100%,130px),1fr));gap:14px 24px;background:var(--surface);border-radius:var(--r-panel);padding:18px 20px;margin:0 0 var(--sec-gap)}
.d2 .ic-kpi{background:none;border:0;border-radius:0;padding:0;font-size:13.5px;font-weight:650;color:var(--ink)}
.d2 .ic-kpi b{font-size:30px;font-weight:800;line-height:1.1;font-variant-numeric:tabular-nums}
.d2 .ic-kpi.run b{color:var(--s-run)}
.d2 .ic-kpi.warn{background:none;border:0;box-shadow:none}.d2 .ic-kpi.warn b{color:var(--s-warn)}
html.d2[data-da] .ic-kpis .ic-kpi{background:none!important;border:0!important;padding:0!important;color:var(--ink)!important;font-size:13.5px}
html.d2[data-da] .ic-kpis .ic-kpi b{font-size:30px;font-weight:800}
html.d2[data-da] .ic-kpis .ic-kpi.run b{color:var(--s-run)!important}
html.d2[data-da] .ic-kpis .ic-kpi.warn b{color:var(--s-warn)!important}
.d2 .ic-flags,.d2 .ic-ai{margin:0 0 var(--sec-gap)}
.d2 .ic-sev.red{background:var(--s-prob)}.d2 .ic-sev.amber{background:var(--s-warn)}.d2 .ic-sev.info{background:var(--s-run)}
.d2 .ic-grid,.d2 .ic-week{gap:16px}
@media(min-width:1800px){.d2 .ic-grid{grid-template-columns:repeat(4,minmax(0,1fr))}}
html.d2 .ic-job{border:0;box-shadow:none;background:var(--surface);border-top:4px solid var(--s-todo);border-radius:var(--r-tile)}
html.d2 .ic-job.running{border-top-color:var(--s-run);box-shadow:none}
html.d2 .ic-job.paused{border-top-color:color-mix(in srgb,var(--s-run) 45%,var(--surface))}
html.d2 .ic-job.prep{border-top-color:var(--s-todo)}
html.d2 .ic-job.not_accepted{border-top-color:var(--s-warn)}
html.d2 .ic-job.done{border-top-color:var(--s-done);background:var(--surface)}
html.d2 .ic-job.test{border-top-style:dashed}
.d2 .ic-apt{color:var(--ink)}
.d2 .ic-b.s-running{background:var(--s-run-soft);color:var(--s-run)}
.d2 .ic-b.s-paused{background:var(--s-run-soft);color:var(--s-run);opacity:.75}
.d2 .ic-b.s-done{background:var(--s-done-soft);color:var(--s-done)}
.d2 .ic-b.s-prep,.d2 .ic-b.s-accepted{background:var(--surface-3);color:var(--muted)}
.d2 .ic-b.s-not_accepted{background:var(--s-warn-soft);color:var(--s-warn)}
.d2 .ic-b.late,.d2 .ic-b.early{background:var(--s-warn-soft);color:var(--s-warn)}
.d2 .ic-b.p-pre,.d2 .ic-b.p-final,.d2 .ic-b.p-run{background:var(--surface-3);color:var(--muted)}
.d2 .ic-b.a-wait{background:var(--surface-3);color:var(--muted)}.d2 .ic-b.a-yes{background:var(--s-done-soft);color:var(--s-done)}
.d2 .ic-b.a-no{background:var(--s-warn-soft);color:var(--s-warn)}
.d2 .ic-bar{height:5px;background:var(--s-todo-soft)}
.d2 .ic-bar i{background:var(--s-run)}
.d2 .ic-job.done .ic-bar i{background:var(--s-done)}
.d2 .ic-chip{border:0;background:var(--surface-2)}
.d2 .ic-chip.bad{background:var(--s-prob-soft);color:var(--s-prob)}
.d2 .ic-alerts{border-left-color:var(--s-prob)}
.d2 .ic-wd .acc.yes{color:var(--s-done)}.d2 .ic-wd .acc.no{color:var(--s-warn)}
