/* ==========================================================================
   Mandantenportal – Mandantenbereich, Mitarbeiterportal, Anmeldung,
   Signierseite (2.3.0, Phase 4c)
   Voraussetzung: ../ds/tokens.css und ../ds/components.css (vorher geladen).
   Rahmen (Kopfzeile, Seitenleiste, Bottom-Navigation) kommt aus dem
   Design-System; hier stehen nur die Ergänzungen des Portals (mp-*),
   die fachlichen Bausteine (bwa-*, op-*, bf-*, doc-*, sg-* …) und
   Utility-Klassen u-* auf dem Token-Raster.
   Keine Hex-, rgb()- oder rgba()-Werte in dieser Datei – nur var(--…).
   Doku: docs/design-system.md, Abschnitt 8
   ========================================================================== */

/* ---------- Übergangs-Aliase ----------------------------------------------
   Für Stellen, die alte Variablen noch im Inline-Style oder per JS setzen
   (z. B. el.style.background="var(--ptd)"). Neue Stellen nutzen die Tokens. */
:root{
  --pt:var(--pt-primary); --ptd:var(--pt-primary-dark); --sage:var(--pt-accent-2);
  --bg:var(--pt-bg); --bg2:var(--pt-tint); --card:var(--pt-surface); --tx:var(--pt-text);
  --mu:var(--pt-muted); --bd:var(--pt-line); --rd:var(--crit); --am:var(--warn); --dark:var(--pt-head);
  --sab:var(--safe-b); --sat:var(--safe-t);
  --pt-04:var(--pt-tint); --pt-06:var(--pt-tint); --pt-07:var(--pt-tint); --pt-08:var(--pt-soft); --pt-10:var(--pt-soft); --pt-12:var(--pt-soft);
  --pt-20:var(--pt-line); --pt-40:var(--pt-accent-2); --pt-75:var(--pt-accent);
  --bd-08:var(--pt-tint); --bd-30:var(--pt-line-soft); --bd-35:var(--pt-line-soft); --bd-40:var(--pt-line-soft);
  --bg-grp:var(--pt-tint); --bg-grp2:var(--pt-soft);
  /* Signierseite (vorher ptKzFarben) */
  --sz:var(--pt-primary-dark); --sz-bg:var(--pt-soft); --sz-bd:var(--pt-line); --sz-l:var(--pt-line-soft); --sz-tab:var(--pt-tint);
}

/* ==========================================================================
   1. Rahmen Mandantenbereich / Mitarbeiterportal
   ========================================================================== */
.mp-logo{font-family:var(--font-serif); font-weight:400; font-size:var(--fs-5); line-height:1; letter-spacing:-.01em; white-space:nowrap}
.mp-logo span{color:var(--pt-accent-2)}
.pt-head-brand .mp-logo + span{display:flex; flex-direction:column; line-height:1.15}
.mp-head-mandant{display:flex; align-items:center; gap:var(--sp-2); min-width:0; flex:0 1 auto}
.mp-head-mandant form{display:flex; align-items:center; gap:var(--sp-2); margin:0; min-width:0}
.mp-head-mandant .pt-input{min-width:200px; max-width:340px; font-size:var(--fs-2)}
.mp-head-name{font-size:var(--fs-2); color:var(--pt-head-muted); white-space:nowrap; overflow:hidden; text-overflow:ellipsis; min-width:0}
.mp-head-name b{color:var(--pt-head-text); font-weight:600}
.mp-head-user{font-size:var(--fs-2); color:var(--pt-head-muted); white-space:nowrap; padding-left:var(--sp-3); border-left:var(--line-w) solid var(--pt-head-line)}
.mp-head-user b{color:var(--pt-head-text); font-weight:600}
a.mp-head-user{text-decoration:none}
a.mp-head-user:hover,a.mp-head-user:focus-visible{color:var(--pt-head-text); text-decoration:underline}
.mp-head-actions{display:flex; align-items:center; gap:var(--sp-2); margin-left:auto; flex:none}
.mp-head-role{font-size:var(--fs-1); font-weight:700; letter-spacing:.06em; text-transform:uppercase; color:var(--pt-head-muted); border:var(--line-w) solid var(--pt-head-line); border-radius:var(--radius-pill); padding:1px var(--sp-2); white-space:nowrap}

/* Hinweisleiste Mitarbeiter-Vorschau („Mandantenansicht – nur lesend“) */
.mp-preview{position:sticky; top:var(--head-h); z-index:calc(var(--z-head) - 1); display:flex; flex-wrap:wrap; align-items:center; gap:var(--sp-2) var(--sp-4); padding:var(--sp-2) var(--sp-5); background:var(--warn-bg); color:var(--warn); border-bottom:var(--line-w) solid var(--warn-line); font-size:var(--fs-2)}
.mp-preview strong{color:var(--pt-text)}
.mp-preview form{margin:0 0 0 auto}

/* Seitenleiste: Mandantenblock, Zähler, Zusatzlinks */
.mp-side-mandant{padding:var(--sp-1) var(--sp-2) var(--sp-3); margin-bottom:var(--sp-2); border-bottom:var(--line-w) solid var(--pt-line-soft)}
.mp-side-mandant b{display:block; font-size:var(--fs-3); color:var(--pt-text); line-height:1.3}
.mp-side-mandant small{display:block; font-size:var(--fs-2); color:var(--pt-muted)}
.pt-side-link .pt-badge{margin-left:auto}
.pt-side-foot .pt-side-link{font-size:var(--fs-2)}
.pt-bottomnav-link .pt-badge{position:absolute; top:4px; left:calc(50% + 6px); padding:0 5px; font-size:10px; line-height:15px}

/* Inhalt */
.mp-main{max-width:calc(var(--content-max) + var(--nav-w))}
.mp-view{max-width:1040px; margin:0 auto}
.mp-view--wide{max-width:none}
.mp-view > .pt-note{margin-bottom:var(--sp-3)}
.mp-view .pt-card{margin-bottom:var(--sp-4)}
.mp-view .pt-grid > .pt-card, .mp-view .pt-kpis .pt-card, .mp-view .pt-card .pt-card, .mp-view .pt-row > .pt-card, .mp-view .u-grid > .pt-card, .mp-view .u-flex > .pt-card, .mp-view .sm-grid .pt-card:last-child{margin-bottom:0}
.mp-view .sm-col > .pt-card{margin-bottom:var(--sp-4)}
.mp-view .pt-kpis{margin-bottom:var(--sp-4)}
.mp-view .pt-card--flush > .pt-card-head{font-size:var(--fs-3); font-weight:700; color:var(--pt-primary-dark)}
.mp-view .pt-card--flush > .pt-card-body{padding:var(--sp-3) var(--sp-4)}
.mp-view h2.pt-h1, .mp-view .pt-h1{margin-bottom:var(--sp-4)}
.mp-view .pt-pagehead .pt-h1{margin-bottom:0}
.mp-import{display:flex; align-items:center; gap:var(--sp-2); font-size:var(--fs-2); color:var(--pt-muted); margin-bottom:var(--sp-3)}
.mp-import strong{color:var(--pt-primary-dark)}
[id]{scroll-margin-top:calc(var(--head-h) + var(--sp-4))}

/* Staff: Seitentitel über dem Inhalt */
.mp-pagetitle{font-family:var(--font-serif); font-weight:400; font-size:var(--fs-6); color:var(--pt-primary-dark); margin:0 0 var(--sp-4); padding-bottom:var(--sp-3); border-bottom:var(--line-w) solid var(--pt-line-soft)}

/* Karten-Liste mit Link-Zeilen (Offene Punkte) */
.mp-list-card .pt-list-row{padding:var(--sp-2) var(--sp-4)}
.mp-list-card .pt-list-row .pt-list-text b{display:block; font-size:var(--fs-3); font-weight:700}
.mp-list-card .pt-list-row--crit b{color:var(--crit)}
.mp-list-card .pt-list-row--warn b{color:var(--warn)}
.mp-list-card .pt-list-row--info b{color:var(--info)}
.mp-list-card .pt-list-row--ok b{color:var(--pt-primary-dark)}
.pt-list-icon--info{background:var(--info-bg); color:var(--info)}
.pt-list-end .mp-aktion{font-size:var(--fs-2); font-weight:600; color:var(--pt-primary-dark); white-space:nowrap}

/* Definitionsraster (Unternehmensdaten, Stammdaten) */
.mp-dl{display:grid; grid-template-columns:repeat(auto-fit, minmax(min(200px,100%),1fr)); gap:var(--sp-3) var(--sp-5); margin:0}
.mp-dl > div{min-width:0}
.mp-dl dt{font-size:var(--fs-1); font-weight:700; letter-spacing:var(--tracking-caps); text-transform:uppercase; color:var(--pt-muted); margin:0 0 2px}
.mp-dl dd{margin:0; font-size:var(--fs-3); overflow-wrap:anywhere}

/* Fläche (ruhig oder getönt) für Formulare, Kommentare, Hinweise ohne Icon */
.mp-box{background:var(--pt-tint); border:var(--line-w) solid var(--pt-line-soft); border-radius:var(--radius-s); padding:var(--sp-2) var(--sp-3)}
.mp-box--soft{background:var(--pt-soft); border-color:var(--pt-line)}
.mp-box--crit{background:var(--crit-bg); border-color:var(--crit); color:var(--pt-text)}
.mp-box--warn{background:var(--warn-bg); border-color:var(--warn-line); color:var(--pt-text)}
.mp-box--ok{background:var(--ok-bg); border-color:transparent; color:var(--pt-text)}
.mp-box--info{background:var(--info-bg); border-color:transparent; color:var(--pt-text)}
.mp-badge--brand{background:var(--pt-primary-dark); color:var(--pt-on-primary)}

/* Chips: alter Zustand .on/.active wie is-on */
.pt-chip.on,.pt-chip.active{background:var(--pt-primary-dark); border-color:var(--pt-primary-dark); color:var(--pt-on-primary)}

/* Tabellen */
.mp-compare{table-layout:fixed}
.mp-compare th:first-child{width:42%}
.mp-compare th:not(:first-child),.mp-compare td:not(:first-child){text-align:right; font-variant-numeric:tabular-nums; white-space:nowrap}
.mp-compare tr.group > td{font-weight:600; background:var(--pt-tint)}
.staff-table tr{cursor:pointer}
.staff-table tbody tr:hover td{background:var(--pt-tint)}

/* Nachrichten */
.mp-chat{display:flex; flex-direction:column; gap:var(--sp-2); max-height:min(60vh, 520px); overflow-y:auto; padding:var(--sp-4); overscroll-behavior:contain}
.mp-chat-row{display:flex; justify-content:flex-start}
.mp-chat-row.is-out{justify-content:flex-end}
.mp-chat-row > div{max-width:min(78%, 560px)}
.chat-bubble-in,.chat-bubble-out{padding:var(--sp-2) var(--sp-3); border-radius:var(--radius); font-size:var(--fs-3); line-height:1.45; overflow-wrap:anywhere}
.chat-bubble-in{background:var(--pt-surface); border:var(--line-w) solid var(--pt-line); border-bottom-left-radius:var(--radius-s)}
.chat-bubble-out{background:var(--pt-soft); color:var(--pt-text); border-bottom-right-radius:var(--radius-s)}
.chat-meta{font-size:var(--fs-1); color:var(--pt-muted); margin-top:2px}
.mp-chat-row.is-out .chat-meta{text-align:right}
.mp-chat-form{display:flex; gap:var(--sp-2); align-items:flex-end}
.mp-chat-form textarea{flex:1; min-height:54px}

/* Balken (Kostenstruktur) – Breite bleibt Laufzeitwert */
.bar-wrap{margin-bottom:var(--sp-3)}
.bar-labels{display:flex; justify-content:space-between; gap:var(--sp-2); margin-bottom:3px; font-size:var(--fs-2)}
.bar-track{height:7px; background:var(--pt-line-soft); border-radius:4px; overflow:hidden}
.bar-fill{height:100%; border-radius:4px; background:var(--pt-primary); transition:width .5s ease}
.bar-fill--2{background:var(--pt-accent)} .bar-fill--3{background:var(--pt-accent-2)} .bar-fill--4{background:var(--pt-primary-dark)} .bar-fill--5{background:var(--pt-muted)} .bar-fill--6{background:var(--pt-line)}

/* Mini-Balken (Umsatzverlauf auf der Übersicht) – Höhe/Lage bleiben Laufzeitwerte */
.mp-spark{position:relative; margin-top:var(--sp-2)}
.mp-spark-q{position:absolute; top:0; bottom:18px; background:var(--pt-tint); border:var(--line-w) solid var(--pt-line-soft); border-radius:3px; pointer-events:none}
.mp-spark-avg{position:absolute; left:0; right:0; border-top:1px dashed var(--pt-accent-2)}
.mp-spark-bars{display:flex; align-items:flex-end; gap:3px; height:24px; position:relative; z-index:1}
.mp-spark-bars > div{flex:1; background:var(--pt-accent-2); border-radius:2px 2px 0 0; min-height:4px}
.mp-spark-bars > div.is-cur{background:var(--pt-primary-dark)}
.mp-spark-lbl{display:flex; gap:3px; margin-top:2px}
.mp-spark-lbl > div{flex:1; text-align:center; font-size:10px; color:var(--pt-muted); overflow:hidden; white-space:nowrap}
.mp-spark-lbl > div.is-cur{font-weight:700; color:var(--pt-primary-dark)}

/* Ampelpunkt */
.mp-dot{display:inline-block; width:8px; height:8px; border-radius:50%; background:currentColor; flex:none}

/* Serverseitige SVG-Diagramme: Achsen, Beschriftung, Reihen über Tokens */
.mp-chart{display:block; width:100%; height:auto; max-height:200px; overflow:visible}
.mp-chart text{font-family:var(--font-sans); fill:var(--pt-muted)}
.mp-chart .title{font-family:var(--font-serif); fill:var(--pt-text)}
.mp-chart .lbl{fill:var(--pt-text-2)} .mp-chart .val{fill:var(--pt-text)}
.mp-chart .ax{stroke:var(--pt-muted)}
.mp-chart .grid{stroke:var(--pt-line-soft)}
.mp-chart .s2{fill:var(--pt-accent-2)}
.mp-chart .line{stroke:var(--pt-primary-dark)}
.mp-chart .area{fill:var(--pt-primary-dark); fill-opacity:.12}
.mp-chart .dot{fill:var(--pt-primary-dark); stroke:var(--pt-surface)}
.mp-chart .neg{fill:var(--crit)} .mp-chart .pos{fill:var(--ok)}
.mp-chart .c0{fill:var(--pt-primary-dark)} .mp-chart .c1{fill:var(--pt-primary)} .mp-chart .c2{fill:var(--pt-accent)} .mp-chart .c3{fill:var(--pt-accent-2)} .mp-chart .c4{fill:var(--chart-3)} .mp-chart .c5{fill:var(--pt-line)}
.mp-chart--donut{max-height:170px}

/* Tabellenzeilen mit Zustand */
.pt-table tr.mp-row--crit td{background:var(--crit-bg)}
.pt-table tr.mp-row--warn td{background:var(--warn-bg)}

/* Ansprechpartner */
.mp-avatar{width:52px; height:52px; border-radius:50%; overflow:hidden; flex:none; display:inline-flex; align-items:center; justify-content:center; background:var(--pt-soft); color:var(--pt-primary-dark); font-weight:700; font-size:var(--fs-4); border:2px solid var(--pt-line)}
.mp-avatar img{width:100%; height:100%; object-fit:cover}
.pt-card--flush > .mp-card-head--dark{background:var(--pt-head); border-bottom-color:var(--pt-head-line)}
.mp-card-head--dark .pt-card-title{color:var(--pt-head-text)}

/* KPI-Zeile in einer Karte, Kachelzustände mit Akzentkante */
.pt-card--flush > .pt-kpis{border:0; border-radius:0; margin:0}
.mp-view .pt-card--flush > .pt-kpis{margin-bottom:0}
.pt-kpis--apart .pt-kpi--warn{border-bottom-color:var(--warn-line)}
.pt-kpis--apart .pt-kpi--crit{border-bottom-color:var(--crit)}
.pt-kpis--apart .pt-kpi--ok{border-bottom-color:var(--ok)}
.pt-kpi--warn .pt-kpi-label{color:var(--warn)}

/* ==========================================================================
   2. Fachliche Bausteine Mandantenbereich
   ========================================================================== */
/* Kennzahl-Kacheln BWA (Tooltip per JS, Text per textContent – V4) */
.kz-tile{text-align:center; padding:var(--sp-3) var(--sp-2); background:var(--pt-tint); border:var(--line-w) solid var(--pt-line-soft); border-radius:var(--radius); position:relative; cursor:default; min-width:0; overflow:hidden}
.kz-tile:hover,.kz-tile:focus-visible{border-color:var(--pt-accent)}
.kz-label{font-size:var(--fs-1); text-transform:uppercase; letter-spacing:.06em; color:var(--pt-muted); font-weight:700; margin-bottom:var(--sp-1); display:flex; align-items:center; justify-content:center; gap:var(--sp-1)}
.kz-info{color:var(--pt-accent); cursor:help; flex:none; display:inline-flex}
.kz-value{font-size:clamp(1.1rem,4vw,1.5rem); font-family:var(--font-serif); font-weight:400; line-height:1.1; font-variant-numeric:tabular-nums}
.kz-sub{font-size:var(--fs-1); color:var(--pt-muted); margin-top:3px}
.kz-tile--ok .kz-value{color:var(--ok)} .kz-tile--warn .kz-value{color:var(--warn)} .kz-tile--crit .kz-value{color:var(--crit)}
#kz-global-tooltip{position:absolute; background:var(--pt-head); color:var(--pt-head-text); font-size:var(--fs-2); line-height:1.5; padding:var(--sp-2) var(--sp-3); border-radius:var(--radius); width:260px; max-width:90vw; z-index:var(--z-toast); pointer-events:none; display:none; text-align:left; box-shadow:var(--shadow-2)}
#kz-global-tooltip::after{content:""; position:absolute; left:50%; transform:translateX(-50%); border:6px solid transparent}
#kz-global-tooltip.tip-above::after{top:100%; border-top-color:var(--pt-head)}
#kz-global-tooltip.tip-below::after{bottom:100%; border-bottom-color:var(--pt-head)}

/* BWA: Filter, Detailpositionen */
.bwa-filter-bar{background:var(--pt-surface); border:var(--line-w) solid var(--pt-line); border-radius:var(--radius); padding:var(--sp-3) var(--sp-4); margin-bottom:var(--sp-4); box-shadow:var(--shadow-1)}
.bwa-filter-row{display:flex; align-items:center; gap:var(--sp-2) var(--sp-3); flex-wrap:wrap; margin-bottom:var(--sp-2)}
.bwa-filter-row:last-child{margin-bottom:0}
.bwa-filter-label{font-size:var(--fs-1); font-weight:700; color:var(--pt-muted); text-transform:uppercase; letter-spacing:var(--tracking-caps); min-width:56px; flex:none}
.bwa-cat-head{padding:var(--sp-2) var(--sp-4); background:var(--pt-tint); font-size:var(--fs-1); font-weight:700; color:var(--pt-muted); letter-spacing:var(--tracking-caps); text-transform:uppercase; border-bottom:var(--line-w) solid var(--pt-line)}
.bwa-grp-sum,.bwa-sub-row,.bwa-hdr-row{display:grid; grid-template-columns:minmax(0,1fr) 110px 110px 64px 16px; align-items:center; column-gap:var(--sp-2)}
.bwa-grp-sum{padding:var(--sp-2) var(--sp-4); background:var(--pt-tint); border-bottom:var(--line-w) solid var(--pt-line); list-style:none; min-height:var(--tap)}
details > .bwa-grp-sum{cursor:pointer}
details[open] > .bwa-grp-sum{background:var(--pt-soft)}
.bwa-grp-name{font-weight:600; font-size:var(--fs-3); min-width:0; overflow:hidden; text-overflow:ellipsis; white-space:nowrap}
.bwa-grp-right{display:contents}
.bwa-grp-amt{font-weight:700; font-size:var(--fs-2); white-space:nowrap; font-variant-numeric:tabular-nums; text-align:right}
.bwa-delta{white-space:nowrap}
.bwa-chevron{width:12px; height:12px; color:var(--pt-muted); transition:transform .2s; flex:none}
details[open] .bwa-chevron, details[open] .op-chevron{transform:rotate(180deg)}
.bwa-sub-row{padding:var(--sp-1) var(--sp-4) var(--sp-1) var(--sp-6); border-bottom:var(--line-w) solid var(--pt-line-soft)}
.bwa-sub-name{font-size:var(--fs-2); color:var(--pt-text-2); min-width:0; overflow:hidden; text-overflow:ellipsis; white-space:nowrap}
.bwa-sub-amt{font-size:var(--fs-2); font-weight:600; white-space:nowrap; text-align:right; font-variant-numeric:tabular-nums}
.bwa-kto{font-size:var(--fs-1); color:var(--pt-muted); margin-right:var(--sp-1)}
.bwa-hdr-row{padding:var(--sp-1) var(--sp-4); background:var(--pt-tint); border-bottom:var(--line-w) solid var(--pt-line); font-size:var(--fs-1); font-weight:700; letter-spacing:.05em; text-transform:uppercase; color:var(--pt-muted)}
.bwa-sph-row{background:var(--pt-tint)} .bwa-sph-row .bwa-sub-name{font-weight:600; color:var(--pt-text)} .bwa-sph-row .bwa-sub-amt{font-weight:700}
.bwa-grp-sum.bwa-sph-tab,.bwa-sub-row.bwa-sph-tab,.bwa-hdr-row.bwa-sph-tab{grid-template-columns:minmax(0,1fr) 110px 110px 110px 120px}
.bwa-sub-row.bwa-sph-tab{padding-left:var(--sp-4)}
.bwa-sph-tab .u-neg{color:var(--pt-danger, #b42318)}
.bwa-sph-hinweis{font-size:var(--fs-1); color:var(--pt-muted); padding:var(--sp-2) var(--sp-4)}
.bwa-portrait-hint{display:none; align-items:center; gap:var(--sp-2); font-size:var(--fs-1); color:var(--pt-muted); padding:var(--sp-1) var(--sp-4); background:var(--pt-tint); border-bottom:var(--line-w) solid var(--pt-line)}
details summary::-webkit-details-marker{display:none}
details summary::marker{content:""}
@media (max-width:599.98px){
  .bwa-ytd{display:none!important}
  .bwa-grp-sum,.bwa-sub-row,.bwa-hdr-row{grid-template-columns:minmax(0,1fr) 92px 56px 14px!important}
  .bwa-sub-row{padding-left:var(--sp-4)}
  .bwa-portrait-hint{display:flex}
  .bwa-grp-sum.bwa-sph-tab,.bwa-sub-row.bwa-sph-tab,.bwa-hdr-row.bwa-sph-tab{grid-template-columns:minmax(0,1fr) 84px 84px 88px!important}
}
.import-stamp{font-size:var(--fs-1); color:var(--pt-muted)}
.detail-sub{display:flex; justify-content:space-between; align-items:center; padding:var(--sp-1) var(--sp-4) var(--sp-1) var(--sp-6); border-bottom:var(--line-w) solid var(--pt-line-soft); font-size:var(--fs-2); color:var(--pt-muted); gap:var(--sp-3)}

/* Offene Posten */
.op-sort-bar{display:flex; gap:var(--sp-1); margin-bottom:var(--sp-3); align-items:center; flex-wrap:wrap}
.op-card{border:var(--line-w) solid var(--pt-line); border-radius:var(--radius-s); margin-bottom:var(--sp-2); overflow:hidden; background:var(--pt-surface)}
.op-card-head{padding:var(--sp-2) var(--sp-3); display:flex; justify-content:space-between; align-items:flex-start; gap:var(--sp-3)}
.op-card-body{padding:var(--sp-2) var(--sp-3); border-top:var(--line-w) solid var(--pt-line-soft); display:flex; gap:var(--sp-2); flex-wrap:wrap}
.op-chevron{transition:transform .2s; color:var(--pt-muted); flex:none}
.op-status-btn{display:inline-flex; align-items:center; gap:var(--sp-1); min-height:30px; padding:0 var(--sp-2); border-radius:var(--radius-s); border:var(--line-w) solid var(--pt-line); background:var(--pt-surface); color:var(--pt-text-2); font-size:var(--fs-2); font-weight:600; cursor:pointer}
.op-btn-mahnen{color:var(--warn); border-color:var(--warn-line)}
.op-btn-erinnern{color:var(--info); border-color:var(--info)}
.op-btn-bezahlt{color:var(--ok); border-color:var(--ok)}
.op-btn-mahnen.active{background:var(--warn); border-color:var(--warn); color:var(--pt-on-primary)}
.op-btn-erinnern.active{background:var(--info); border-color:var(--info); color:var(--pt-on-primary)}
.op-btn-bezahlt.active{background:var(--ok); border-color:var(--ok); color:var(--pt-on-primary)}
.op-stamp{margin-top:3px}
.op-grp > summary{display:flex; align-items:center; gap:var(--sp-2); padding:var(--sp-2) var(--sp-3); cursor:pointer; list-style:none; min-height:var(--tap)}
@media (max-width:899.98px){ .op-status-btn{min-height:var(--tap)} }

/* Aufgaben */
.task-item{border:var(--line-w) solid var(--pt-line); border-radius:var(--radius-s); margin-bottom:var(--sp-2); overflow:hidden; background:var(--pt-surface)}
.task-prio{width:4px; flex:none; align-self:stretch; background:var(--pt-line)}
.task-prio.h{background:var(--crit)} .task-prio.m{background:var(--warn-line)} .task-prio.l{background:var(--pt-accent-2)}
.task-done .task-title{text-decoration:line-through; color:var(--pt-muted)}

/* Schalter (Einstellungen) */
.toggle-row{display:flex; align-items:center; justify-content:space-between; gap:var(--sp-3); padding:var(--sp-3) 0; border-bottom:var(--line-w) solid var(--pt-line-soft)}
.toggle-row:last-of-type{border-bottom:0}
.toggle-lbl{font-size:var(--fs-3); font-weight:600}
.toggle-desc{font-size:var(--fs-2); color:var(--pt-muted); margin-top:2px}
.toggle{position:relative; display:inline-block; width:44px; height:26px; flex:none}
.toggle input{position:absolute; opacity:0; width:100%; height:100%; margin:0; cursor:pointer; z-index:1}
.toggle-sl{position:absolute; inset:0; background:var(--pt-line); border-radius:var(--radius-pill); transition:background .2s}
.toggle-sl::before{content:""; position:absolute; height:20px; width:20px; left:3px; bottom:3px; background:var(--pt-surface); border-radius:50%; transition:transform .2s; box-shadow:var(--shadow-1)}
.toggle input:checked + .toggle-sl{background:var(--pt-primary)}
.toggle input:checked + .toggle-sl::before{transform:translateX(18px)}
.toggle input:focus-visible + .toggle-sl{outline:2px solid var(--focus); outline-offset:2px}

/* Fehlende Belege (vorher eigene orange Insel) */
.bf-section{margin-top:var(--sp-5); border:var(--line-w) solid var(--warn-line); border-radius:var(--radius); overflow:clip; background:var(--pt-surface); box-shadow:var(--shadow-1)}
.bf-header{background:var(--warn-bg); color:var(--warn); padding:var(--sp-2) var(--sp-4); display:flex; align-items:center; gap:var(--sp-2); border-bottom:var(--line-w) solid var(--warn-line)}
.bf-title{font-weight:700; font-size:var(--fs-3); display:flex; align-items:center; gap:var(--sp-2)}
.bf-badge{margin-left:auto}
.bf-filters{background:var(--pt-surface); border-bottom:var(--line-w) solid var(--pt-line-soft); padding:var(--sp-2) var(--sp-3); display:flex; gap:var(--sp-2); flex-wrap:wrap; align-items:center; position:sticky; top:var(--head-h); z-index:5}
.bf-search{flex:1 1 180px; min-width:140px}
.bf-info{font-size:var(--fs-2); color:var(--pt-muted); padding:var(--sp-2) var(--sp-4); border-bottom:var(--line-w) solid var(--pt-line-soft)}
.bf-item{border-bottom:var(--line-w) solid var(--pt-line-soft)}
.bf-item:last-child{border-bottom:0}
.bf-item summary{display:flex; align-items:center; gap:var(--sp-3); padding:var(--sp-2) var(--sp-4); cursor:pointer; list-style:none; min-height:var(--tap)}
.bf-item summary:hover{background:var(--pt-tint)}
.bf-dot{width:8px; height:8px; border-radius:50%; flex:none; background:var(--warn)}
.bf-dot--crit{background:var(--crit)} .bf-dot--info{background:var(--info)} .bf-dot--ok{background:var(--ok)} .bf-dot--muted{background:var(--pt-line)}
.bf-main{flex:1; min-width:0}
.bf-name{font-weight:600; font-size:var(--fs-3); white-space:nowrap; overflow:hidden; text-overflow:ellipsis}
.bf-meta{font-size:var(--fs-2); color:var(--pt-muted); margin-top:1px}
.bf-re{color:var(--pt-text-2); font-weight:500}
.bf-hint-preview{font-size:var(--fs-2); color:var(--pt-muted); font-style:italic; margin-top:1px; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; max-width:320px}
.bf-right{text-align:right; flex:none}
.bf-amount{font-weight:700; font-size:var(--fs-3); font-variant-numeric:tabular-nums; white-space:nowrap}
.bf-status{font-size:var(--fs-1); font-weight:700; margin-top:2px}
.bf-status--crit{color:var(--crit)} .bf-status--warn{color:var(--warn)} .bf-status--info{color:var(--info)} .bf-status--ok{color:var(--ok)}
.bf-chevron{color:var(--pt-muted); transition:transform .2s; flex:none}

.bf-body{padding:var(--sp-3) var(--sp-4) var(--sp-4); background:var(--pt-tint); border-top:var(--line-w) solid var(--pt-line-soft)}
.bf-kanzlei{background:var(--pt-surface); border-left:3px solid var(--pt-primary); border-radius:0 var(--radius-s) var(--radius-s) 0; padding:var(--sp-2) var(--sp-3); font-size:var(--fs-2); margin-bottom:var(--sp-2)}
.bf-kanzlei-lbl{font-size:var(--fs-1); font-weight:700; color:var(--pt-primary-dark); text-transform:uppercase; letter-spacing:.06em; display:block; margin-bottom:2px}
.bf-since{font-size:var(--fs-2); color:var(--pt-muted); margin-bottom:var(--sp-2)}
.bf-prev-kom{font-size:var(--fs-2); color:var(--pt-primary-dark); background:var(--pt-soft); border-radius:var(--radius-s); padding:var(--sp-2) var(--sp-3); margin-bottom:var(--sp-2)}
.bf-dropzone{border:2px dashed var(--pt-line); border-radius:var(--radius); padding:var(--sp-4) var(--sp-3); text-align:center; cursor:pointer; transition:border-color .15s, background .15s; background:var(--pt-surface); margin-top:var(--sp-2)}
.bf-dropzone:hover,.bf-dz-over{border-color:var(--pt-primary); background:var(--pt-tint)}
.bf-dz-sel{border-color:var(--info)!important; background:var(--info-bg)!important}
.bf-dz-name{font-size:var(--fs-2); color:var(--pt-text-2); font-weight:600; word-break:break-all}
.bf-dz-hint{font-size:var(--fs-1); color:var(--pt-muted); margin-top:3px}
.bf-uploaded{font-size:var(--fs-2); color:var(--info); background:var(--info-bg); border-radius:var(--radius-s); padding:var(--sp-2) var(--sp-3); margin-top:var(--sp-2); display:flex; align-items:center; gap:var(--sp-2)}
.bf-no-result{padding:var(--sp-7); text-align:center; color:var(--pt-muted); font-size:var(--fs-3)}
.bf-month-head{padding:var(--sp-1) var(--sp-4); background:var(--pt-tint); font-size:var(--fs-1); font-weight:700; color:var(--warn); text-transform:uppercase; letter-spacing:var(--tracking-caps); border-bottom:var(--line-w) solid var(--pt-line-soft)}
@media (max-width:899.98px){ .bf-filters{top:52px} }

/* Dokumente */
.doc-grid{display:grid; grid-template-columns:repeat(auto-fill, minmax(min(300px,100%),1fr)); gap:var(--sp-4)}
.doc-cat{background:var(--pt-surface); border:var(--line-w) solid var(--pt-line); border-radius:var(--radius); overflow:hidden; box-shadow:var(--shadow-1)}
.doc-cat-h{padding:var(--sp-2) var(--sp-4); border-bottom:var(--line-w) solid var(--pt-line); display:flex; align-items:center; gap:var(--sp-2)}
.doc-cat-icon{color:var(--pt-primary); display:inline-flex}
.doc-cat-name{font-weight:700; font-size:var(--fs-3); flex:1; color:var(--pt-primary-dark)}
.doc-yr-h{padding:var(--sp-1) var(--sp-4); background:var(--pt-tint); font-size:var(--fs-1); font-weight:700; color:var(--pt-muted); text-transform:uppercase; letter-spacing:.07em; border-bottom:var(--line-w) solid var(--pt-line-soft)}
.doc-itm{display:flex; align-items:center; gap:var(--sp-3); padding:var(--sp-2) var(--sp-4); border-bottom:var(--line-w) solid var(--pt-line-soft)}
.doc-itm:last-child{border-bottom:0}
.doc-itm:hover{background:var(--pt-tint)}
.doc-ext{width:34px; height:34px; border-radius:var(--radius-s); display:flex; align-items:center; justify-content:center; font-size:9px; font-weight:700; flex:none; letter-spacing:.03em; background:var(--pt-soft); color:var(--pt-primary-dark)}
.doc-info{flex:1; min-width:0}
.doc-fname{font-size:var(--fs-2); font-weight:600; white-space:nowrap; overflow:hidden; text-overflow:ellipsis}
.doc-meta{font-size:var(--fs-1); color:var(--pt-muted); margin-top:2px}

/* ==========================================================================
   3. Mitarbeiterportal – fachliche Bausteine
   ========================================================================== */
.sm-grid{display:grid; grid-template-columns:minmax(0,1fr); gap:var(--sp-4)}
@media (min-width:1100px){ .sm-grid{grid-template-columns:minmax(0,3fr) minmax(0,2fr); align-items:start} }
.av-chip.av-on{background:var(--pt-primary-dark); border-color:var(--pt-primary-dark); color:var(--pt-on-primary)}
.ms-card td{border-bottom:var(--line-w) solid var(--pt-line-soft)}

/* Unterschriften (staff_sign): seit 2.24.0 im Kanzleiportal – Regeln mit 2.25.0 entfernt */

/* ==========================================================================
   4. Anmeldung, Passwort, Zwei-Faktor, Mandantenwahl (eigenständige Seiten)
   ========================================================================== */
[data-seite~="mp-auth"] body{min-height:100vh; min-height:100svh; display:flex; flex-direction:column; align-items:center; justify-content:center; gap:var(--sp-4); padding:calc(var(--sp-6) + var(--safe-t)) var(--sp-4) calc(var(--sp-6) + var(--safe-b)); background:var(--pt-head); color:var(--pt-head-text)}
.mp-auth-brand{text-align:center; display:flex; flex-direction:column; align-items:center; gap:var(--sp-2)}
.mp-auth-brand .mp-logo{font-size:1.9rem; color:var(--pt-head-text)}
.mp-auth-brand .pt-eyebrow{color:var(--pt-head-muted); letter-spacing:.2em}
.mp-auth-mark{width:72px; height:72px; background:var(--pt-surface); border-radius:18px; display:flex; align-items:center; justify-content:center; overflow:hidden}
.mp-auth-mark img{width:64px; height:64px; border-radius:12px}
.mp-auth-mark--gup{background:var(--pt-head-2); border:var(--line-w) solid var(--pt-head-line); color:var(--pt-accent-2)}
.mp-auth-mark--gup span{font-family:var(--font-serif); font-size:1.9rem; line-height:1}
.mp-auth-card{width:100%; max-width:400px; background:var(--pt-surface); color:var(--pt-text); border-radius:var(--radius-l); box-shadow:var(--shadow-2); padding:var(--sp-6)}
.mp-auth-card--wide{max-width:460px}
.mp-auth-card .pt-form{grid-template-columns:minmax(0,1fr)}
.mp-auth-title{font-size:var(--fs-4); font-weight:700; color:var(--pt-primary-dark); margin:0 0 var(--sp-1)}
.mp-auth-sub{font-size:var(--fs-2); color:var(--pt-muted); margin:0 0 var(--sp-4); line-height:1.5}
.mp-auth-links{text-align:center; margin-top:var(--sp-4); font-size:var(--fs-2)}
.mp-auth-links a,.mp-auth-links button{color:var(--pt-primary); background:none; border:0; padding:0; font:inherit; cursor:pointer; text-decoration:none}
.mp-auth-links a:hover,.mp-auth-links button:hover{text-decoration:underline}
.mp-auth-msgs{width:100%; max-width:400px; display:flex; flex-direction:column; gap:var(--sp-2)}
[data-seite~="mp-auth"] .pt-input.mp-code{font-size:1.5rem; letter-spacing:.35em; text-align:center; font-variant-numeric:tabular-nums}
[data-seite~="mp-auth"] .pt-input.mp-code--rc{font-size:1.2rem; letter-spacing:.15em}
.mp-auth-steps{display:flex; gap:var(--sp-2); justify-content:center; margin-bottom:var(--sp-4)}
.mp-qr{background:var(--pt-surface); border:var(--line-w) solid var(--pt-line); border-radius:var(--radius); padding:var(--sp-2); width:200px; height:200px; margin:0 auto var(--sp-4); display:flex; align-items:center; justify-content:center}
.mp-qr svg{width:180px; height:180px; display:block}
.mp-secret{font-family:var(--font-mono); font-size:var(--fs-3); letter-spacing:.08em; background:var(--pt-tint); border:var(--line-w) solid var(--pt-line); border-radius:var(--radius-s); padding:var(--sp-2) var(--sp-3); text-align:center; word-break:break-all; user-select:all}
.mp-steps{font-size:var(--fs-2); color:var(--pt-text-2); line-height:1.55; margin:0 0 var(--sp-4); padding-left:var(--sp-5)}
.mp-steps li{margin-bottom:var(--sp-1)}
.mp-rc{display:grid; grid-template-columns:1fr 1fr; gap:var(--sp-2); margin:var(--sp-3) 0 var(--sp-4)}
.mp-rc div{font-family:var(--font-mono); font-size:var(--fs-3); letter-spacing:.06em; background:var(--pt-tint); border:var(--line-w) solid var(--pt-line); border-radius:var(--radius-s); padding:var(--sp-2) var(--sp-1); text-align:center; user-select:all}
[data-seite~="mp-auth"] details summary{cursor:pointer; font-size:var(--fs-2); color:var(--pt-muted); list-style:none}
.mp-auth-sep{margin-top:var(--sp-4); padding-top:var(--sp-4); border-top:var(--line-w) solid var(--pt-line-soft)}
@media print{
  [data-seite~="mp-auth"] body{background:var(--pt-surface); color:var(--pt-text)}
  .mp-auth-card{box-shadow:none; border:var(--line-w) solid var(--pt-line)}
  [data-seite~="mp-auth"] .pt-btn,.mp-auth-links{display:none}
}

/* Mandantenwahl */
.mp-select{min-height:100vh; padding:calc(var(--sp-5) + var(--safe-t)) var(--sp-4) calc(var(--sp-7) + var(--safe-b)); max-width:1100px; margin:0 auto}
.mp-select-head{display:flex; flex-wrap:wrap; align-items:center; justify-content:space-between; gap:var(--sp-3); margin-bottom:var(--sp-4)}
.mp-select-grid{display:grid; grid-template-columns:repeat(auto-fill, minmax(min(220px,100%),1fr)); gap:var(--sp-3); margin-bottom:var(--sp-5)}
.mp-select-grid form{margin:0; display:flex}
.mp-select-card{width:100%; text-align:left; font:inherit; color:inherit; cursor:pointer; display:flex; flex-direction:column; gap:2px; border-top:3px solid var(--pt-accent)}
.mp-select-card[data-kanzlei="gup"]{border-top-color:var(--chart-2)}
.mp-select-card:hover{border-color:var(--pt-primary)}
.mp-select-card .pt-icon{color:var(--pt-primary); width:28px; height:28px; margin-bottom:var(--sp-1)}
.mp-select-card b{font-size:var(--fs-3); color:var(--pt-text)}
.mp-select-grp{margin:var(--sp-5) 0 var(--sp-2)}

/* ==========================================================================
   5. Signierseite (sign_extern) – 2.6.0: Stellen als Schaltflächen im Dokument,
   Unterschriftsfenster (Handy: Blatt von unten), Vorschau in der Stelle, fester
   Abschlussbereich, Mappenübersicht. Logik: media/com_proftax/sign/signieren.js
   ========================================================================== */
[data-seite~="sz-body"] body{background:var(--pt-bg); color:var(--pt-text); min-height:100vh}
[data-seite~="sz-body"] input:not([type=checkbox]):not([type=radio]):not([type=file]){font-family:inherit}
html.sz-gesperrt,html.sz-gesperrt body{overflow:hidden}
/* Der feste Abschlussbereich darf angesprungene Elemente (Fokus, „Zur Unterschriftsstelle“) nicht verdecken */
html[data-seite~="sz-body"]{scroll-padding-top:var(--sp-4); scroll-padding-bottom:210px}
/* Kein Doppeltipp-Zoom auf Schaltflächen (sonst geht ein schneller Tipp nach dem Zeichnen verloren) */
[data-seite~="sz-body"] :is(button,a,label,summary,input){touch-action:manipulation}
.sz-wrap{width:100%; max-width:760px; margin:0 auto; padding:var(--sp-5) var(--sp-4) 0; box-sizing:border-box}  /* Joomla-body ist Flex-Spalte: ohne width schrumpft der Rahmen auf den Inhalt */
.sz-header{background:var(--pt-head); color:var(--pt-head-text); border-radius:var(--radius); padding:var(--sp-4) var(--sp-5); margin-bottom:var(--sp-4)}
.sz-header h1{font-family:var(--font-serif); font-weight:400; font-size:var(--fs-5); margin:0 0 2px}
.sz-header .sz-sub{font-size:var(--fs-2); color:var(--pt-head-muted)}
.sz-card{background:var(--pt-surface); border:var(--line-w) solid var(--pt-line); border-radius:var(--radius); box-shadow:var(--shadow-1); padding:var(--sp-5); margin-bottom:var(--sp-4)}
.sz-card[hidden]{display:none}
.sz-titel{font-family:var(--font-serif); font-weight:400; font-size:var(--fs-6); line-height:var(--lh-tight); color:var(--pt-primary-dark); margin:0 0 var(--sp-2); overflow-wrap:anywhere}
.sz-titel--klein{font-size:var(--fs-5)}
.sz-titel:focus{outline:none}
.sz-titel:focus-visible{outline:2px solid var(--focus); outline-offset:2px}
.sz-lead{font-size:var(--fs-4); line-height:var(--lh); margin:0 0 var(--sp-2)}
.sz-notiz{margin-bottom:var(--sp-4); font-size:var(--fs-3); line-height:var(--lh)}
.sz-err{background:var(--crit-bg); border:var(--line-w) solid var(--crit); color:var(--crit); border-radius:var(--radius); padding:var(--sp-4) var(--sp-5); font-size:var(--fs-3); line-height:1.5}
.sz-gross{min-height:52px; font-size:var(--fs-4); white-space:normal}

/* Schrittanzeige 1 Dokument ansehen · 2 Unterschreiben · 3 Absenden */
.sz-schritte{display:flex; gap:var(--sp-2); list-style:none; margin:0 0 var(--sp-4); padding:0}
.sz-schritte li{flex:1 1 0; display:flex; align-items:center; gap:var(--sp-2); min-height:var(--tap); padding:var(--sp-2) var(--sp-3); border:var(--line-w) solid var(--pt-line); border-radius:var(--radius-s); background:var(--pt-surface); font-size:var(--fs-2); font-weight:600; color:var(--pt-text-2); line-height:var(--lh-tight)}
.sz-schritt-nr{flex:none; display:inline-flex; align-items:center; justify-content:center; width:26px; height:26px; border-radius:50%; border:1px solid var(--pt-line); background:var(--pt-tint); font-weight:700}
.sz-schritte li.is-aktiv{border-color:var(--pt-primary-dark); color:var(--pt-primary-dark); box-shadow:inset 0 -3px 0 var(--pt-primary-dark)}
.sz-schritte li.is-aktiv .sz-schritt-nr{background:var(--pt-primary-dark); border-color:var(--pt-primary-dark); color:var(--pt-on-primary)}
.sz-schritte li.is-fertig{color:var(--ok)}
.sz-schritte li.is-fertig .sz-schritt-nr{background:var(--ok-bg); border-color:var(--ok); color:var(--ok)}

/* Dokumentansicht */
.sz-viewer{padding:var(--sp-4)}
.sz-viewer-kopf{display:flex; flex-direction:column; gap:var(--sp-1); margin-bottom:var(--sp-3)}
.sz-viewer-kopf > .pt-btn{align-self:flex-start; min-height:var(--tap); margin-bottom:var(--sp-1)}
.sz-viewer-kopf .pt-eyebrow{margin:0}
.sz-viewer-kopf .pt-eyebrow:empty{display:none}
.sz-anleitung{flex-wrap:wrap; align-items:center; margin-bottom:var(--sp-3); font-size:var(--fs-3); line-height:var(--lh)}
.sz-anleitung > span{flex:1 1 240px}
.sz-anleitung-knopf{min-height:var(--tap); white-space:normal}
.sz-werkzeug{display:flex; flex-wrap:wrap; align-items:center; justify-content:space-between; gap:var(--sp-2) var(--sp-4); margin-bottom:var(--sp-2)}
.sz-stellennav,.sz-zoom{display:flex; align-items:center; gap:var(--sp-2)}
.sz-stellennav[hidden]{display:none}
.sz-stellennav span{font-size:var(--fs-3); font-weight:600; color:var(--pt-primary-dark)}
.sz-zoom{margin-left:auto}
.sz-zoom-wert{min-width:52px; text-align:center; font-size:var(--fs-2); color:var(--pt-text-2)}
.sz-werkzeug .pt-btn{min-height:var(--tap); min-width:var(--tap); font-size:var(--fs-4)}
.sz-werkzeug .pt-btn--small{font-size:var(--fs-2)}
.sz-dokument{overflow-x:auto; overflow-y:visible; -webkit-overflow-scrolling:touch; background:var(--pt-muted); border-radius:var(--radius-s); padding:var(--sp-2)}
.sz-dokument:empty{display:none}
.sz-seite{position:relative; margin:var(--sp-6) auto 0; background:var(--pt-surface); box-shadow:var(--shadow-1)}
.sz-seite:first-child{margin-top:var(--sp-5)}
.sz-seite-bild{display:block; width:100%; height:100%}
.sz-ebene{position:absolute; inset:0}
.sz-ebene.is-platzieren{cursor:crosshair; outline:3px dashed var(--warn); outline-offset:-3px}
.sz-seite-nr{position:absolute; left:0; bottom:100%; padding:0 0 2px; color:var(--pt-on-primary); font-size:var(--fs-2); font-weight:600; line-height:1.4; pointer-events:none}
.sz-laden{display:flex; flex-direction:column; align-items:center; padding:var(--sp-7) var(--sp-4); color:var(--pt-text-2); font-size:var(--fs-3); text-align:center}
.sz-laden[hidden]{display:none}
.sz-viewer-fuss{display:grid; gap:var(--sp-2); margin-top:var(--sp-4)}

/* Unterschriftsstelle als Schaltfläche über dem Dokument */
.sz-feld{position:absolute; z-index:2; display:flex; align-items:center; justify-content:center; gap:var(--sp-1); padding:var(--sp-1) var(--sp-2); border:3px solid var(--pt-primary-dark); border-radius:var(--radius-s); background:color-mix(in srgb, var(--pt-soft) 90%, transparent); color:var(--pt-primary-dark); font:inherit; font-size:var(--fs-2); font-weight:700; line-height:1.2; text-align:center; cursor:pointer; box-shadow:var(--shadow-1); touch-action:manipulation; animation:sz-puls 2.4s ease-in-out infinite}
.sz-feld:hover{background:var(--pt-soft)}
.sz-feld .pt-icon{flex:none; width:1.5em; height:1.5em}
.sz-feld.is-aktiv{border-style:solid; box-shadow:0 0 0 3px var(--pt-surface), var(--shadow-1)}
.sz-feld-nr{flex:none; display:inline-flex; align-items:center; justify-content:center; width:24px; height:24px; border-radius:50%; background:var(--pt-primary-dark); color:var(--pt-on-primary); font-size:var(--fs-2)}
.sz-feld.is-fertig{z-index:3; min-height:var(--tap); padding:var(--sp-1) var(--sp-3); border:2px solid var(--ok); background:var(--ok-bg); color:var(--ok); font-weight:600; box-shadow:none; animation:none; white-space:nowrap}
.sz-feld.is-fertig .pt-icon{width:1.1em; height:1.1em}
.sz-vorschau{position:absolute; z-index:1; pointer-events:none; object-fit:contain; object-position:left bottom}
.sz-abdeckung{position:absolute; z-index:1; background:var(--pt-surface); pointer-events:none}
@keyframes sz-puls{
  0%,100%{box-shadow:0 0 0 0 color-mix(in srgb, var(--pt-primary) 45%, transparent), var(--shadow-1)}
  50%{box-shadow:0 0 0 9px color-mix(in srgb, var(--pt-primary) 0%, transparent), var(--shadow-1)}
}

/* Mappenübersicht */
.sz-mappe .pt-eyebrow{margin:0 0 var(--sp-1)}
.sz-mappe-liste{list-style:none; margin:var(--sp-4) 0 0; padding:0; display:grid; gap:var(--sp-2)}
.sz-mappe-dok{display:grid; grid-template-columns:auto 1fr auto; grid-template-areas:"nr text status" "nr text knopf"; align-items:center; gap:var(--sp-1) var(--sp-3); padding:var(--sp-3); border:var(--line-w) solid var(--pt-line); border-radius:var(--radius); background:var(--pt-tint)}
.sz-mappe-nr{grid-area:nr; display:inline-flex; align-items:center; justify-content:center; width:34px; height:34px; border-radius:50%; border:1px solid var(--pt-line); background:var(--pt-surface); color:var(--pt-primary-dark); font-weight:700}
.sz-mappe-text{grid-area:text; min-width:0}
.sz-mappe-text b{display:block; font-size:var(--fs-4); line-height:var(--lh-tight); overflow-wrap:anywhere}
.sz-mappe-text small{display:flex; flex-wrap:wrap; gap:0 var(--sp-3); margin-top:var(--sp-1); font-size:var(--fs-2); color:var(--pt-text-2)}
.sz-mappe-text small span:empty{display:none}
.sz-mappe-status{grid-area:status; justify-self:end; white-space:normal; text-align:center}
.sz-mappe-ansehen{grid-area:knopf; justify-self:end; min-height:var(--tap)}
.sz-mappe-dok.is-angesehen .sz-mappe-nr{background:var(--ok-bg); border-color:var(--ok); color:var(--ok)}
.sz-mappe-dok.is-fertig{background:var(--pt-surface)}
.sz-meine-vorschau{display:flex; justify-content:center; margin:var(--sp-3) 0; padding:var(--sp-3); border:var(--line-w) solid var(--pt-line); border-radius:var(--radius-s); background:var(--pt-surface)}
.sz-meine-vorschau[hidden]{display:none}
.sz-meine-vorschau img{max-width:100%; max-height:96px}
.sz-meine .pt-btn{margin-top:var(--sp-2)}

/* Kopie per E-Mail, von Hand unterschreiben */
.sz-optionen{display:grid; gap:var(--sp-3)}
.sz-check{align-items:center; min-height:var(--tap); font-size:var(--fs-3); line-height:var(--lh)}
.sz-check input{width:22px; height:22px; margin:0}
.sz-kopie{display:grid; gap:var(--sp-1); padding-left:calc(22px + var(--sp-2))}
.sz-kopie[hidden]{display:none}
.sz-hand summary{display:flex; align-items:center; min-height:var(--tap); font-weight:600; color:var(--pt-primary-dark); cursor:pointer}
.sz-hand a{color:var(--pt-primary-dark)}
.sz-downloads{display:flex; flex-wrap:wrap; gap:var(--sp-2); margin:var(--sp-2) 0 0; padding:0; list-style:none}
.sz-downloads .pt-btn{min-height:var(--tap); white-space:normal; text-align:left}

/* Fester Abschlussbereich unten */
.sz-abschluss{position:sticky; bottom:0; z-index:20; display:grid; gap:var(--sp-2); margin:var(--sp-4) calc(-1 * var(--sp-4)) 0; padding:var(--sp-3) var(--sp-4) calc(var(--sp-3) + var(--safe-b)); border-top:var(--line-w) solid var(--pt-line); background:var(--pt-surface); box-shadow:var(--shadow-up)}
.sz-abschluss-status{margin:0; font-size:var(--fs-3); font-weight:700; color:var(--warn)}
.sz-abschluss-status.is-bereit{color:var(--ok)}
.sz-abschluss-status.is-arbeitet{color:var(--pt-text-2)}
.sz-absenden{min-height:52px; font-size:var(--fs-4); white-space:normal}
.sz-bestaetigung{font-weight:600}
/* Bestätigung und Kleingedrucktes erst im Schritt „Absenden“ – so bleibt der feste Bereich auf dem Handy klein */
.sz-abschluss:not([data-schritt="3"]) :is(.sz-bestaetigung,.sz-kleingedruckt){display:none}
.sz-kleingedruckt{margin:0; font-size:var(--fs-1); line-height:1.45; color:var(--pt-text-2)}
.sz-kleingedruckt a{color:var(--pt-primary-dark)}
.sz-fehler{margin:0; font-size:var(--fs-3); color:var(--crit)}
.sz-fehler:empty{display:none}

/* Unterschriftsfenster */
.sz-overlay{z-index:var(--z-modal); touch-action:manipulation}
.sz-dialog{display:flex; flex-direction:column; width:min(720px, 100%); max-height:calc(100vh - 2 * var(--sp-8))}
.sz-dialog .pt-modal-title:focus{outline:none}
.sz-dialog .pt-modal-title:focus-visible{outline:2px solid var(--focus); outline-offset:2px}
.sz-dialog-body{display:flex; flex-direction:column; gap:var(--sp-3); overflow:auto}
.sz-dialog .pt-modal-foot .pt-btn{min-height:var(--tap); min-width:120px}
.sz-name{display:grid; gap:var(--sp-1)}
.sz-panel[hidden]{display:none!important}
.sz-zeichenflaeche{position:relative; height:240px; border:2px dashed var(--pt-line); border-radius:var(--radius-s); background:var(--pt-surface); touch-action:none}
.sz-zeichenflaeche canvas{position:absolute; inset:0; z-index:1; width:100%; height:100%; touch-action:none; cursor:crosshair}
.sz-linie{position:absolute; left:9%; right:6%; bottom:27%; border-bottom:2px solid var(--pt-line); pointer-events:none}
.sz-kreuz{position:absolute; left:3%; bottom:calc(27% - 4px); font-size:28px; line-height:1; color:var(--pt-muted); pointer-events:none}
.sz-hinweis{margin:var(--sp-1) 0 0; font-size:var(--fs-2); color:var(--pt-text-2)}
.sz-hinweis[hidden]{display:none}
.sz-quer{display:none}
.sz-andere{display:flex; flex-wrap:wrap; align-items:center; gap:0 var(--sp-3); margin:0; font-size:var(--fs-2); color:var(--pt-text-2)}
.sz-link{min-height:var(--tap); padding:0; border:0; background:none; color:var(--pt-primary-dark); font:inherit; font-weight:600; text-decoration:underline; cursor:pointer}
.sz-link[hidden]{display:none}
.sz-getippt{font-size:20px}
.sz-getippt-bild{display:block; width:100%; height:auto; max-height:160px; margin-top:var(--sp-2); border:var(--line-w) solid var(--pt-line-soft); border-radius:var(--radius-s); background:var(--pt-surface)}
.sz-hochladen{position:relative; display:flex; align-items:center; gap:var(--sp-3); padding:var(--sp-5); border:2px dashed var(--pt-line); border-radius:var(--radius-s); background:var(--pt-tint); font-weight:600; cursor:pointer}
.sz-hochladen:focus-within{outline:2px solid var(--focus); outline-offset:2px}
.sz-hochladen input{position:absolute; width:1px; height:1px; opacity:0}
.sz-hochladen small{display:block; font-weight:400; color:var(--pt-text-2)}
.sz-hochladen .pt-icon{width:28px; height:28px; flex:none}
/* Handy: bildschirmfüllendes Blatt von unten; Zeichenfläche nimmt den Rest ein */
@media (max-width:599.98px){
  .sz-overlay{padding:0; align-items:stretch}
  .sz-dialog{width:100%; height:100%; max-height:none; border-radius:0}
  .sz-dialog-body{flex:1}
  .sz-panel[data-panel="zeichnen"]{display:flex; flex-direction:column; flex:1; min-height:0}
  .sz-zeichenflaeche{flex:1; min-height:200px; height:auto}
}
@media (max-width:599.98px) and (orientation:portrait){ .sz-quer{display:block} }
/* Querformat auf dem Handy: möglichst viel Platz zum Zeichnen */
@media (max-height:520px){
  .sz-overlay{padding:0; align-items:stretch}
  .sz-dialog{width:100%; height:100%; max-height:none; border-radius:0}
  .sz-dialog .pt-modal-head{padding-top:var(--sp-2)}
  .sz-dialog-body{flex:1; gap:var(--sp-2); padding-top:var(--sp-1); padding-bottom:var(--sp-1)}
  .sz-name{grid-template-columns:auto 1fr; align-items:center; gap:var(--sp-2)}
  .sz-panel[data-panel="zeichnen"]{display:flex; flex-direction:column; flex:1; min-height:0}
  .sz-zeichenflaeche{flex:1; min-height:110px; height:auto}
  .sz-dialog .pt-modal-foot{padding-top:var(--sp-2); padding-bottom:var(--sp-2)}
}

/* Abschluss */
.sz-erfolg{display:grid; gap:var(--sp-3); padding-bottom:var(--sp-7)}
.sz-erfolg[hidden]{display:none}
.sz-erfolg:focus{outline:none}
.sz-success{background:var(--pt-soft); border:var(--line-w) solid var(--pt-line); color:var(--pt-primary-dark); border-radius:var(--radius); padding:var(--sp-5); text-align:center; font-size:var(--fs-3); line-height:1.6}
.sz-success h2{display:flex; flex-direction:column; align-items:center; gap:var(--sp-2); margin:0 0 var(--sp-2); font-size:var(--fs-5); line-height:var(--lh-tight)}
.sz-success h2 .pt-icon{width:44px; height:44px; color:var(--ok)}
.sz-success p{margin:0 0 var(--sp-2)}
.sz-success .sz-klein{font-size:var(--fs-3); color:var(--pt-text)}
.sz-success .sz-gross{margin-top:var(--sp-2)}
.sz-trenner{display:flex; align-items:center; gap:var(--sp-3); margin:var(--sp-4) 0 var(--sp-2); font-size:var(--fs-2); color:var(--pt-text-2)}
.sz-trenner::before,.sz-trenner::after{content:""; flex:1 1 0; border-top:var(--line-w) solid var(--pt-line)}
.sz-einladen{display:grid; gap:var(--sp-2); text-align:left}
.sz-einladen .pt-btn{min-height:var(--tap)}
.sz-ok{margin:0; color:var(--ok); font-weight:600}
.sz-karte{text-align:center}
.sz-karte-name{font-size:var(--fs-4); font-weight:700; color:var(--pt-primary-dark)}
.sz-karte-adresse,.sz-karte-kontakt{margin-top:var(--sp-3); font-size:var(--fs-2); line-height:var(--lh)}
.sz-karte a{color:var(--pt-primary-dark)}
.sz-zurueck{min-height:var(--tap)}

@media (max-width:599.98px){
  .sz-wrap{padding:var(--sp-3) var(--sp-3) 0}
  .sz-card{padding:var(--sp-4)}
  .sz-viewer{padding:var(--sp-3)}
  .sz-dokument{padding:var(--sp-1); margin:0 calc(-1 * var(--sp-2))}
  .sz-abschluss{margin-left:calc(-1 * var(--sp-3)); margin-right:calc(-1 * var(--sp-3)); padding-left:var(--sp-3); padding-right:var(--sp-3)}
  .sz-schritte{gap:var(--sp-1)}
  .sz-schritte li{flex-direction:column; justify-content:center; gap:2px; padding:var(--sp-1); font-size:var(--fs-1); text-align:center}
  .sz-titel{font-size:var(--fs-5)}
  .sz-mappe-dok{grid-template-columns:auto 1fr; grid-template-areas:"nr text" "nr status" "knopf knopf"}
  .sz-mappe-status{justify-self:start}
  .sz-mappe-ansehen{justify-self:stretch}
  .sz-zoom{margin-left:0}
}

/* ==========================================================================
   6. Utility-Klassen (Token-Raster). Nur für Einzelfälle in bestehendem
   Markup; neue Bausteine nutzen Komponenten (pt-*) bzw. pt-stack/pt-row.
   Abstände: -h = 2 px, -0 … -8 = --sp-0 … --sp-8.
   ========================================================================== */
.u-m-h{margin:2px} .u-m-0{margin:0} .u-m-1{margin:var(--sp-1)} .u-m-2{margin:var(--sp-2)} .u-m-3{margin:var(--sp-3)} .u-m-4{margin:var(--sp-4)} .u-m-5{margin:var(--sp-5)} .u-m-6{margin:var(--sp-6)} .u-m-7{margin:var(--sp-7)} .u-m-8{margin:var(--sp-8)} .u-m-auto{margin:auto}
.u-mx-h{margin-left:2px;margin-right:2px} .u-mx-0{margin-left:0;margin-right:0} .u-mx-1{margin-left:var(--sp-1);margin-right:var(--sp-1)} .u-mx-2{margin-left:var(--sp-2);margin-right:var(--sp-2)} .u-mx-3{margin-left:var(--sp-3);margin-right:var(--sp-3)} .u-mx-4{margin-left:var(--sp-4);margin-right:var(--sp-4)} .u-mx-5{margin-left:var(--sp-5);margin-right:var(--sp-5)} .u-mx-6{margin-left:var(--sp-6);margin-right:var(--sp-6)} .u-mx-7{margin-left:var(--sp-7);margin-right:var(--sp-7)} .u-mx-8{margin-left:var(--sp-8);margin-right:var(--sp-8)} .u-mx-auto{margin-left:auto;margin-right:auto}
.u-my-h{margin-top:2px;margin-bottom:2px} .u-my-0{margin-top:0;margin-bottom:0} .u-my-1{margin-top:var(--sp-1);margin-bottom:var(--sp-1)} .u-my-2{margin-top:var(--sp-2);margin-bottom:var(--sp-2)} .u-my-3{margin-top:var(--sp-3);margin-bottom:var(--sp-3)} .u-my-4{margin-top:var(--sp-4);margin-bottom:var(--sp-4)} .u-my-5{margin-top:var(--sp-5);margin-bottom:var(--sp-5)} .u-my-6{margin-top:var(--sp-6);margin-bottom:var(--sp-6)} .u-my-7{margin-top:var(--sp-7);margin-bottom:var(--sp-7)} .u-my-8{margin-top:var(--sp-8);margin-bottom:var(--sp-8)} .u-my-auto{margin-top:auto;margin-bottom:auto}
.u-mt-h{margin-top:2px} .u-mt-0{margin-top:0} .u-mt-1{margin-top:var(--sp-1)} .u-mt-2{margin-top:var(--sp-2)} .u-mt-3{margin-top:var(--sp-3)} .u-mt-4{margin-top:var(--sp-4)} .u-mt-5{margin-top:var(--sp-5)} .u-mt-6{margin-top:var(--sp-6)} .u-mt-7{margin-top:var(--sp-7)} .u-mt-8{margin-top:var(--sp-8)} .u-mt-auto{margin-top:auto}
.u-mr-h{margin-right:2px} .u-mr-0{margin-right:0} .u-mr-1{margin-right:var(--sp-1)} .u-mr-2{margin-right:var(--sp-2)} .u-mr-3{margin-right:var(--sp-3)} .u-mr-4{margin-right:var(--sp-4)} .u-mr-5{margin-right:var(--sp-5)} .u-mr-6{margin-right:var(--sp-6)} .u-mr-7{margin-right:var(--sp-7)} .u-mr-8{margin-right:var(--sp-8)} .u-mr-auto{margin-right:auto}
.u-mb-h{margin-bottom:2px} .u-mb-0{margin-bottom:0} .u-mb-1{margin-bottom:var(--sp-1)} .u-mb-2{margin-bottom:var(--sp-2)} .u-mb-3{margin-bottom:var(--sp-3)} .u-mb-4{margin-bottom:var(--sp-4)} .u-mb-5{margin-bottom:var(--sp-5)} .u-mb-6{margin-bottom:var(--sp-6)} .u-mb-7{margin-bottom:var(--sp-7)} .u-mb-8{margin-bottom:var(--sp-8)} .u-mb-auto{margin-bottom:auto}
.u-ml-h{margin-left:2px} .u-ml-0{margin-left:0} .u-ml-1{margin-left:var(--sp-1)} .u-ml-2{margin-left:var(--sp-2)} .u-ml-3{margin-left:var(--sp-3)} .u-ml-4{margin-left:var(--sp-4)} .u-ml-5{margin-left:var(--sp-5)} .u-ml-6{margin-left:var(--sp-6)} .u-ml-7{margin-left:var(--sp-7)} .u-ml-8{margin-left:var(--sp-8)} .u-ml-auto{margin-left:auto}
.u-p-h{padding:2px} .u-p-0{padding:0} .u-p-1{padding:var(--sp-1)} .u-p-2{padding:var(--sp-2)} .u-p-3{padding:var(--sp-3)} .u-p-4{padding:var(--sp-4)} .u-p-5{padding:var(--sp-5)} .u-p-6{padding:var(--sp-6)} .u-p-7{padding:var(--sp-7)} .u-p-8{padding:var(--sp-8)}
.u-px-h{padding-left:2px;padding-right:2px} .u-px-0{padding-left:0;padding-right:0} .u-px-1{padding-left:var(--sp-1);padding-right:var(--sp-1)} .u-px-2{padding-left:var(--sp-2);padding-right:var(--sp-2)} .u-px-3{padding-left:var(--sp-3);padding-right:var(--sp-3)} .u-px-4{padding-left:var(--sp-4);padding-right:var(--sp-4)} .u-px-5{padding-left:var(--sp-5);padding-right:var(--sp-5)} .u-px-6{padding-left:var(--sp-6);padding-right:var(--sp-6)} .u-px-7{padding-left:var(--sp-7);padding-right:var(--sp-7)} .u-px-8{padding-left:var(--sp-8);padding-right:var(--sp-8)}
.u-py-h{padding-top:2px;padding-bottom:2px} .u-py-0{padding-top:0;padding-bottom:0} .u-py-1{padding-top:var(--sp-1);padding-bottom:var(--sp-1)} .u-py-2{padding-top:var(--sp-2);padding-bottom:var(--sp-2)} .u-py-3{padding-top:var(--sp-3);padding-bottom:var(--sp-3)} .u-py-4{padding-top:var(--sp-4);padding-bottom:var(--sp-4)} .u-py-5{padding-top:var(--sp-5);padding-bottom:var(--sp-5)} .u-py-6{padding-top:var(--sp-6);padding-bottom:var(--sp-6)} .u-py-7{padding-top:var(--sp-7);padding-bottom:var(--sp-7)} .u-py-8{padding-top:var(--sp-8);padding-bottom:var(--sp-8)}
.u-pt-h{padding-top:2px} .u-pt-0{padding-top:0} .u-pt-1{padding-top:var(--sp-1)} .u-pt-2{padding-top:var(--sp-2)} .u-pt-3{padding-top:var(--sp-3)} .u-pt-4{padding-top:var(--sp-4)} .u-pt-5{padding-top:var(--sp-5)} .u-pt-6{padding-top:var(--sp-6)} .u-pt-7{padding-top:var(--sp-7)} .u-pt-8{padding-top:var(--sp-8)}
.u-pr-h{padding-right:2px} .u-pr-0{padding-right:0} .u-pr-1{padding-right:var(--sp-1)} .u-pr-2{padding-right:var(--sp-2)} .u-pr-3{padding-right:var(--sp-3)} .u-pr-4{padding-right:var(--sp-4)} .u-pr-5{padding-right:var(--sp-5)} .u-pr-6{padding-right:var(--sp-6)} .u-pr-7{padding-right:var(--sp-7)} .u-pr-8{padding-right:var(--sp-8)}
.u-pb-h{padding-bottom:2px} .u-pb-0{padding-bottom:0} .u-pb-1{padding-bottom:var(--sp-1)} .u-pb-2{padding-bottom:var(--sp-2)} .u-pb-3{padding-bottom:var(--sp-3)} .u-pb-4{padding-bottom:var(--sp-4)} .u-pb-5{padding-bottom:var(--sp-5)} .u-pb-6{padding-bottom:var(--sp-6)} .u-pb-7{padding-bottom:var(--sp-7)} .u-pb-8{padding-bottom:var(--sp-8)}
.u-pl-h{padding-left:2px} .u-pl-0{padding-left:0} .u-pl-1{padding-left:var(--sp-1)} .u-pl-2{padding-left:var(--sp-2)} .u-pl-3{padding-left:var(--sp-3)} .u-pl-4{padding-left:var(--sp-4)} .u-pl-5{padding-left:var(--sp-5)} .u-pl-6{padding-left:var(--sp-6)} .u-pl-7{padding-left:var(--sp-7)} .u-pl-8{padding-left:var(--sp-8)}
.u-gap-h{gap:2px} .u-gap-0{gap:0} .u-gap-1{gap:var(--sp-1)} .u-gap-2{gap:var(--sp-2)} .u-gap-3{gap:var(--sp-3)} .u-gap-4{gap:var(--sp-4)} .u-gap-5{gap:var(--sp-5)} .u-gap-6{gap:var(--sp-6)} .u-gap-7{gap:var(--sp-7)} .u-gap-8{gap:var(--sp-8)}
.u-gapx-h{column-gap:2px} .u-gapx-0{column-gap:0} .u-gapx-1{column-gap:var(--sp-1)} .u-gapx-2{column-gap:var(--sp-2)} .u-gapx-3{column-gap:var(--sp-3)} .u-gapx-4{column-gap:var(--sp-4)} .u-gapx-5{column-gap:var(--sp-5)} .u-gapx-6{column-gap:var(--sp-6)} .u-gapx-7{column-gap:var(--sp-7)} .u-gapx-8{column-gap:var(--sp-8)}
.u-gapy-h{row-gap:2px} .u-gapy-0{row-gap:0} .u-gapy-1{row-gap:var(--sp-1)} .u-gapy-2{row-gap:var(--sp-2)} .u-gapy-3{row-gap:var(--sp-3)} .u-gapy-4{row-gap:var(--sp-4)} .u-gapy-5{row-gap:var(--sp-5)} .u-gapy-6{row-gap:var(--sp-6)} .u-gapy-7{row-gap:var(--sp-7)} .u-gapy-8{row-gap:var(--sp-8)}
.u-fs-1{font-size:var(--fs-1)} .u-fs-2{font-size:var(--fs-2)} .u-fs-3{font-size:var(--fs-3)} .u-fs-4{font-size:var(--fs-4)} .u-fs-5{font-size:var(--fs-5)} .u-fs-6{font-size:var(--fs-6)}
.u-fw-4{font-weight:400} .u-fw-5{font-weight:500} .u-fw-6{font-weight:600} .u-fw-7{font-weight:700}
.u-serif{font-family:var(--font-serif); font-weight:400} .u-mono{font-family:var(--font-mono)} .u-italic{font-style:italic} .u-caps{text-transform:uppercase} .u-track{letter-spacing:.06em} .u-tnum{font-variant-numeric:tabular-nums}
.u-lh-1{line-height:1} .u-lh-tight{line-height:var(--lh-tight)} .u-lh{line-height:var(--lh)}
.u-text{color:var(--pt-text)} .u-text-2{color:var(--pt-text-2)} .u-muted{color:var(--pt-muted)} .u-primary{color:var(--pt-primary)} .u-primary-dark{color:var(--pt-primary-dark)} .u-accent-2{color:var(--pt-accent-2)} .u-inherit{color:inherit} .u-head-muted{color:var(--pt-head-muted)} .u-on-primary{color:var(--pt-on-primary)}
.u-crit{color:var(--crit)} .u-warn{color:var(--warn)} .u-ok{color:var(--ok)} .u-info{color:var(--info)}
.u-bg-surface{background:var(--pt-surface)} .u-bg-tint{background:var(--pt-tint)} .u-bg-soft{background:var(--pt-soft)} .u-bg-none{background:transparent} .u-bg-primary{background:var(--pt-primary-dark); color:var(--pt-on-primary)} .u-bg-head{background:var(--pt-head); color:var(--pt-head-text)} .u-bg-line{background:var(--pt-line)} .u-bg-onhead{background:var(--pt-head-2)}
.u-bg-crit{background:var(--crit-bg)} .u-bg-warn{background:var(--warn-bg)} .u-bg-ok{background:var(--ok-bg)} .u-bg-info{background:var(--info-bg)}
.u-bd{border:var(--line-w) solid var(--pt-line)} .u-bd-soft{border:var(--line-w) solid var(--pt-line-soft)} .u-bd-crit{border:var(--line-w) solid var(--crit)} .u-bd-warn{border:var(--line-w) solid var(--warn-line)} .u-bd-ok{border:var(--line-w) solid var(--ok)} .u-bd-info{border:var(--line-w) solid var(--info)} .u-bd-primary{border:var(--line-w) solid var(--pt-primary)} .u-bd-head{border:var(--line-w) solid var(--pt-head-line)} .u-bd-0{border:0}
.u-bdt{border-top:var(--line-w) solid var(--pt-line)} .u-bdt-soft{border-top:var(--line-w) solid var(--pt-line-soft)} .u-bdt-crit{border-top:var(--line-w) solid var(--crit)} .u-bdt-warn{border-top:var(--line-w) solid var(--warn-line)} .u-bdt-ok{border-top:var(--line-w) solid var(--ok)} .u-bdt-info{border-top:var(--line-w) solid var(--info)} .u-bdt-primary{border-top:var(--line-w) solid var(--pt-primary)} .u-bdt-head{border-top:var(--line-w) solid var(--pt-head-line)} .u-bdt-0{border-top:0}
.u-bdb{border-bottom:var(--line-w) solid var(--pt-line)} .u-bdb-soft{border-bottom:var(--line-w) solid var(--pt-line-soft)} .u-bdb-crit{border-bottom:var(--line-w) solid var(--crit)} .u-bdb-warn{border-bottom:var(--line-w) solid var(--warn-line)} .u-bdb-ok{border-bottom:var(--line-w) solid var(--ok)} .u-bdb-info{border-bottom:var(--line-w) solid var(--info)} .u-bdb-primary{border-bottom:var(--line-w) solid var(--pt-primary)} .u-bdb-head{border-bottom:var(--line-w) solid var(--pt-head-line)} .u-bdb-0{border-bottom:0}
.u-bdl{border-left:var(--line-w) solid var(--pt-line)} .u-bdl-soft{border-left:var(--line-w) solid var(--pt-line-soft)} .u-bdl-crit{border-left:var(--line-w) solid var(--crit)} .u-bdl-warn{border-left:var(--line-w) solid var(--warn-line)} .u-bdl-ok{border-left:var(--line-w) solid var(--ok)} .u-bdl-info{border-left:var(--line-w) solid var(--info)} .u-bdl-primary{border-left:var(--line-w) solid var(--pt-primary)} .u-bdl-head{border-left:var(--line-w) solid var(--pt-head-line)} .u-bdl-0{border-left:0}
.u-bdr{border-right:var(--line-w) solid var(--pt-line)} .u-bdr-soft{border-right:var(--line-w) solid var(--pt-line-soft)} .u-bdr-crit{border-right:var(--line-w) solid var(--crit)} .u-bdr-warn{border-right:var(--line-w) solid var(--warn-line)} .u-bdr-ok{border-right:var(--line-w) solid var(--ok)} .u-bdr-info{border-right:var(--line-w) solid var(--info)} .u-bdr-primary{border-right:var(--line-w) solid var(--pt-primary)} .u-bdr-head{border-right:var(--line-w) solid var(--pt-head-line)} .u-bdr-0{border-right:0}
.u-bdc-soft{border-color:var(--pt-line-soft)} .u-bdc-crit{border-color:var(--crit)} .u-bdc-warn{border-color:var(--warn-line)} .u-bdc-ok{border-color:var(--ok)} .u-bdc-info{border-color:var(--info)} .u-bdc-primary{border-color:var(--pt-primary)} .u-bdc-head{border-color:var(--pt-head-line)}
.u-bd-thick{border-width:2px} .u-bdl-thick{border-left-width:3px} .u-bdt-thick{border-top-width:3px} .u-bdb-thick{border-bottom-width:3px} .u-bdr-thick{border-right-width:3px} .u-bd-dashed{border-style:dashed}
.u-r-0{border-radius:0} .u-r-xs{border-radius:3px} .u-r-s{border-radius:var(--radius-s)} .u-r{border-radius:var(--radius)} .u-r-l{border-radius:var(--radius-l)} .u-r-pill{border-radius:var(--radius-pill)} .u-r-top{border-radius:var(--radius) var(--radius) 0 0}
.u-flex{display:flex} .u-iflex{display:inline-flex} .u-grid{display:grid} .u-block{display:block} .u-iblock{display:inline-block} .u-inline{display:inline} .u-contents{display:contents}
.u-items-center{align-items:center} .u-items-start{align-items:flex-start} .u-items-end{align-items:flex-end} .u-items-baseline{align-items:baseline} .u-items-stretch{align-items:stretch}
.u-justify-between{justify-content:space-between} .u-justify-center{justify-content:center} .u-justify-end{justify-content:flex-end} .u-justify-start{justify-content:flex-start}
.u-wrap{flex-wrap:wrap} .u-nowrap-flex{flex-wrap:nowrap} .u-col{flex-direction:column} .u-grow{flex:1 1 0%; min-width:0} .u-grow-2{flex:2 1 0%; min-width:0} .u-noshrink{flex-shrink:0} .u-self-start{align-self:flex-start} .u-self-end{align-self:flex-end} .u-self-center{align-self:center}
.u-span-all{grid-column:1 / -1} .u-span-2{grid-column:span 2} .u-cols-2{grid-template-columns:repeat(2,minmax(0,1fr))} .u-cols-3{grid-template-columns:repeat(3,minmax(0,1fr))}
.u-right{text-align:right} .u-center{text-align:center} .u-left{text-align:left}
.u-nowrap{white-space:nowrap} .u-prewrap{white-space:pre-wrap} .u-preline{white-space:pre-line} .u-wrap-text{white-space:normal} .u-ellipsis{overflow:hidden; text-overflow:ellipsis; white-space:nowrap} .u-break{overflow-wrap:anywhere} .u-strike{text-decoration:line-through}
.u-nodeco{text-decoration:none} .u-underline{text-decoration:underline} .u-pointer{cursor:pointer} .u-help{cursor:help} .u-noevents{pointer-events:none} .u-select-all{user-select:all} .u-noresize{resize:none}
.u-clip{overflow:hidden} .u-scroll{overflow:auto} .u-scroll-x{overflow-x:auto; -webkit-overflow-scrolling:touch} .u-scroll-y{overflow-y:auto; overscroll-behavior:contain}
.u-min0{min-width:0} .u-minh-0{min-height:0} .u-w-full{width:100%} .u-w-auto{width:auto} .u-w-fit{width:fit-content} .u-maxw-full{max-width:100%} .u-h-full{height:100%} .u-cover{object-fit:cover}
.u-minw-s{min-width:min(120px,100%)} .u-minw-m{min-width:min(160px,100%)} .u-minw-l{min-width:min(200px,100%)} .u-maxw-m{max-width:380px} .u-maxw-l{max-width:460px} .u-w-num{width:110px}
.u-nolist{list-style:none} .u-rel{position:relative} .u-abs{position:absolute} .u-sticky{position:sticky; top:var(--head-h)} .u-va-middle{vertical-align:middle} .u-va-top{vertical-align:top} .u-collapse{border-collapse:collapse} .u-fixed{table-layout:fixed} .u-shadow-0{box-shadow:none}
.u-o-50{opacity:.5} .u-o-60{opacity:.6} .u-o-70{opacity:.7} .u-o-80{opacity:.8}

/* ---------- Sichtbarkeit ---------- */
[hidden]{display:none!important}
@media (max-width:599.98px){ .mp-hide-phone{display:none!important} }
@media (min-width:600px){ .mp-only-phone{display:none!important} }

/* ---------- Korrekturen Handy ---------- */
/* components.css setzt unter 600 px .pt-card{padding} nach .pt-card--flush → Flush wiederherstellen */
@media (max-width:599.98px){
  .pt-card--flush{padding:0}
  .pt-card--flush > .pt-kpis > .pt-kpi:last-child:nth-child(odd){grid-column:1 / -1}
}
.mp-view .pt-kpis--apart{grid-template-columns:repeat(auto-fit, minmax(min(210px,100%),1fr))}
@media (max-width:599.98px){ .mp-view .pt-kpis--apart{grid-template-columns:repeat(2,minmax(0,1fr))} }

/* ---------- BWA/OP: Bänder, Mini-Balken, Wasserfall (Lage/Breite = Laufzeitwerte) ---------- */
.mp-kz-grid{display:grid; grid-template-columns:repeat(auto-fit, minmax(min(130px,100%),1fr)); gap:var(--sp-3)}
.mp-kz-grid--2{grid-template-columns:repeat(2,minmax(0,1fr))}
.mp-bandbar{position:relative; height:13px; border-radius:var(--radius-s); overflow:hidden; background:var(--pt-tint)}
.mp-band{position:absolute; top:0; bottom:0}
.mp-band--ok{background:var(--ok-bg)} .mp-band--warn{background:var(--warn-bg)} .mp-band--crit{background:var(--crit-bg)}
.mp-legend{display:inline-block; width:10px; height:10px; border-radius:3px; vertical-align:-1px; border:var(--line-w) solid var(--pt-line)}
.mp-bandmark{position:relative; height:11px}
.mp-bandmark > div{position:absolute; top:-3px; transform:translateX(-50%); font-size:var(--fs-2); line-height:1}
.mp-minibar{height:6px; border-radius:3px; background:var(--pt-tint); overflow:hidden}
.mp-minibar > div{height:100%}
.mp-minibar--pos{background:var(--pt-accent)} .mp-minibar--neg{background:var(--crit)}
.mp-bebar{position:relative; height:10px; border-radius:var(--radius-s); background:var(--pt-tint); overflow:hidden}
.mp-bebar-ist{position:absolute; left:0; top:0; bottom:0; opacity:.75}
.mp-bebar-mark{position:absolute; top:0; bottom:0; width:2px; background:var(--pt-text)}
.mp-chart--wf{min-width:520px; max-height:none}
.mp-chart .wf-tot{fill:var(--pt-primary)} .mp-chart .wf-plus{fill:var(--pt-accent)} .mp-chart .wf-min{fill:var(--crit); fill-opacity:.55} .mp-chart .wf-neg{fill:var(--crit)}
.mp-chart .val{fill:var(--pt-text); font-weight:600}
.bwa-span2{grid-column:2 / 4}
.mp-chevron{transition:transform .2s; transform:rotate(90deg)}
details[open] > summary .mp-chevron{transform:rotate(-90deg)}
.mp-op-kpi{border:var(--line-w) solid var(--pt-line); border-bottom:3px solid var(--pt-accent); border-radius:var(--radius) var(--radius) 0 0}
.mp-op-kpi--kred{border-bottom-color:var(--crit)}
.mp-view .mp-op-list{border-top:0; border-radius:0 0 var(--radius) var(--radius); margin-bottom:0}
.mp-op-partner{list-style:none; display:flex; justify-content:space-between; align-items:center; gap:var(--sp-3); flex-wrap:wrap; padding:var(--sp-2) var(--sp-4); cursor:pointer; background:var(--pt-tint); min-height:var(--tap)}
.mp-op-partner.is-bezahlt{background:var(--pt-surface)}
.op-stamp-gemahnt{background:var(--crit-bg); color:var(--crit)} .op-stamp-erinnert{background:var(--warn-bg); color:var(--warn)} .op-stamp-bezahlt{background:var(--ok-bg); color:var(--ok)}
.op-stamp{display:inline-flex; align-items:center; font-size:var(--fs-1); font-weight:700; letter-spacing:.04em; padding:1px var(--sp-2); border-radius:var(--radius-pill); white-space:nowrap}

/* ---------- Aufgaben, Belege, Einstellungen ---------- */
.mp-btn--ok{background:var(--ok-bg); border-color:transparent; color:var(--ok)}
.bf-item[data-erledigt="1"] summary{opacity:.6}
.bf-uploaded--ok{background:var(--ok-bg); color:var(--ok)}
.mp-bf-partner{max-width:180px}
.mp-input--tage{width:76px; text-align:center}
.mp-input--code{width:160px}
.mp-card--soft{background:var(--pt-tint)}
.bf-chevron .pt-icon{transition:transform .2s}

/* ---------- Mitarbeiterportal: Ergänzungen ---------- */
.u-r-bottom{border-radius:0 0 var(--radius) var(--radius)}
.u-basis-s{flex:1 1 150px; min-width:0} .u-basis-m{flex:1 1 230px; min-width:0}
.u-maxh-m{max-height:340px} .u-maxh-l{max-height:420px} .u-maxh-vh{max-height:70vh}
.mp-check{width:18px; height:18px; accent-color:var(--pt-primary)}
.mp-w-spacer{width:25px} .mp-w-icon{width:14px; display:inline-block}
.mp-search-ico{position:absolute; left:var(--sp-3); top:50%; transform:translateY(-50%); color:var(--pt-muted); pointer-events:none; display:inline-flex}
.mp-av-sum{cursor:pointer; list-style:none; display:flex; align-items:center; gap:var(--sp-2); padding:var(--sp-2) var(--sp-4); border:var(--line-w) solid; border-radius:var(--radius-s); font-size:var(--fs-2); font-weight:700; min-height:var(--tap)}
.mp-av-sum--crit{background:var(--crit-bg); border-color:var(--crit); color:var(--crit)}
.mp-av-sum--warn{background:var(--warn-bg); border-color:var(--warn-line); color:var(--warn)}
.mp-av-name{font-weight:700; font-size:var(--fs-2); flex:none; min-width:min(150px,40%)}
.pt-list-icon--muted{background:var(--pt-line-soft); color:var(--pt-text-2)}
.mp-col-fav{width:34px} .mp-col-ampel{width:4px; padding:0!important}
.mp-ampel--red{background:var(--crit)} .mp-ampel--yellow{background:var(--warn-line)} .mp-ampel--green{background:var(--ok)} .mp-ampel--grey{background:var(--pt-line)}
.mp-fav{background:none; border:0; cursor:pointer; font-size:var(--fs-4); padding:var(--sp-2) 2px; color:var(--pt-line); line-height:1; min-width:var(--tap); min-height:var(--tap)}
.mp-fav.is-on,.mp-fav-btn.is-on{color:var(--chart-3)}
.mp-mini-kpi{border-radius:var(--radius); padding:var(--sp-3); text-align:center; background:var(--pt-soft); color:var(--pt-primary-dark)}
.mp-mini-kpi--warn{background:var(--warn-bg); color:var(--warn)} .mp-mini-kpi--info{background:var(--info-bg); color:var(--info)}
.mp-mini-kpi-v{font-family:var(--font-serif); font-size:var(--fs-6); line-height:1.1}
.mp-mini-kpi-l{font-size:var(--fs-1); font-weight:700; margin-top:2px; display:flex; align-items:center; justify-content:center; gap:var(--sp-1)}
[data-seite~="mp-staff"] .mp-chat-row > div{max-width:88%}
@media (max-width:599.98px){ .staff-table{font-size:var(--fs-2)} }
.mp-chat-col{display:flex; flex-direction:column; align-items:flex-start; gap:2px}
.mp-chat-col.is-out{align-items:flex-end}
.mp-chat-col > .chat-bubble-in,.mp-chat-col > .chat-bubble-out{max-width:88%}
.mp-badge--warn-solid{background:var(--warn); color:var(--pt-on-primary)}
.mp-badge--info-solid{background:var(--info); color:var(--pt-on-primary)}

/* ---------- 2.6.0: DATEV Unternehmen online (Navigation, Seite Belege, offene Punkte) ---------- */
.mp-extern{width:1.05em!important; height:1.05em!important; margin-left:auto; flex:none}
.mp-duo-text{display:flex; flex-direction:column; min-width:0}
.mp-duo-text small{font-size:var(--fs-1); font-weight:400; color:var(--pt-muted); line-height:var(--lh-tight)}
.mp-duo-hinweis{display:flex; align-items:center; gap:var(--sp-1); margin:var(--sp-1) 0 0; font-size:var(--fs-1); color:var(--pt-muted)}
.mp-duo-hinweis .pt-icon{flex:none}
.pt-side-link.mp-duo-nav > .mp-duo-text{flex:1 1 auto; min-width:0; white-space:normal; line-height:var(--lh-tight)}
.mp-duo{display:grid; gap:var(--sp-3); margin-bottom:var(--sp-4)}
.mp-duo-kopf{display:flex; align-items:center; gap:var(--sp-3)}
.mp-duo-kopf .pt-card-title{margin:0}
.mp-duo-icon{flex:none; display:flex; align-items:center; justify-content:center; width:44px; height:44px; border-radius:50%; background:var(--pt-soft); color:var(--pt-primary-dark)}
.mp-duo-icon .pt-icon{width:26px; height:26px; margin:0!important}
.mp-duo p{margin:0; color:var(--pt-text-2); line-height:var(--lh)}
.mp-duo .pt-btn{justify-self:start; min-height:var(--tap); white-space:normal}
.mp-duo .pt-btn .mp-extern{margin-left:var(--sp-2)}
.mp-duo .pt-btn .mp-duo-text{flex-direction:row}
.mp-op-duo{display:flex; align-items:center; gap:var(--sp-2); min-height:var(--tap); padding:0 var(--sp-4) var(--sp-2) calc(var(--sp-4) + 32px + var(--sp-3)); border-bottom:var(--line-w) solid var(--pt-line-soft); font-size:var(--fs-2); font-weight:600; color:var(--pt-primary-dark); text-decoration:none}
.mp-op-duo:hover span{text-decoration:underline}
.mp-op-duo .mp-extern{margin-left:0}
@media (max-width:599.98px){ .mp-duo .pt-btn{justify-self:stretch} }

/* ---------- 2.6.0: Mitarbeitersicht – Mappen-Fortschritt je Unterzeichner ---------- */

/* ---------- Anmeldung/Mandantenwahl: Ergänzungen ---------- */
.mp-auth-card .pt-label{display:block; margin:var(--sp-3) 0 var(--sp-1)}
.mp-auth-card .pt-field .pt-label{margin:0}
.mp-auth-card .pt-btn--block{margin-top:var(--sp-4)}
.mp-auth-card .pt-form .pt-btn--block{margin-top:var(--sp-1)}
.mp-auth-card .mp-auth-title + .mp-auth-sub{margin-top:var(--sp-1)}
.mp-search-inp{padding-left:calc(var(--sp-3) + 1.6em)}
[data-seite~="mp-select-body"] body{background:var(--pt-bg)}
.mp-select-head .mp-logo{font-size:var(--fs-5)}

/* Icons vor Text in Fließtext/Köpfen (ehemals Emoji) – Abstand; Komponenten mit gap bleiben unberührt */
.mp-view .pt-icon:not(:only-child){margin-right:.3em}
.mp-view :is(.pt-btn,.pt-chip,.pt-badge,.pt-note,.pt-card-title,.pt-list-icon,.pt-list-end,.pt-kpi-label,.u-flex,.u-iflex,.pt-row,.mp-av-sum,.bf-title,.doc-cat-icon,.mp-import,.pt-eyebrow) > .pt-icon{margin-right:0}

/* ── 2.5.0: Passkeys (Anmeldung mit Fingerabdruck, Gesichtserkennung oder Geräte-PIN) ── */
.mp-auth-oder{display:flex; align-items:center; gap:var(--sp-3); margin:var(--sp-4) 0 0; color:var(--pt-muted); font-size:var(--fs-2)}
.mp-auth-oder::before,.mp-auth-oder::after{content:""; flex:1 1 0; border-top:var(--line-w) solid var(--pt-line)}
.mp-auth-card .mp-auth-oder + .pt-btn--block{margin-top:var(--sp-3)}
.mp-auth-card .mp-pk-erst{margin-top:0}
.mp-auth-card .mp-pk-erst + .mp-auth-oder{margin-bottom:var(--sp-1)}
.mp-pk-btn,.mp-pk-erst{white-space:normal; line-height:var(--lh-tight); text-align:center; gap:var(--sp-1); padding:var(--sp-2)}
.mp-pk-btn .pt-icon,.mp-pk-erst .pt-icon{width:1.35em; height:1.35em; flex:none}
.mp-pk-angebot{background:var(--pt-tint); border:var(--line-w) solid var(--pt-line); border-left:3px solid var(--pt-accent)}
.mp-auth-card .mp-pk-angebot{margin:var(--sp-2) 0 var(--sp-4); box-shadow:none}
.mp-pk-kopf{display:flex; align-items:center; gap:var(--sp-3)}
.mp-pk-kopf .pt-card-title{margin:0}
.mp-pk-symbol{flex:none; width:44px; height:44px; border-radius:50%; display:flex; align-items:center; justify-content:center; background:var(--pt-soft); color:var(--pt-primary-dark)}
.mp-pk-symbol .pt-icon{width:26px; height:26px; margin:0}
.mp-pk-symbol--ok{background:var(--ok-bg); color:var(--ok)}
.mp-pk-angebot .pt-row{gap:var(--sp-2)}
.mp-pk-aktionen{display:flex; align-items:flex-start; gap:var(--sp-1); flex-wrap:wrap; justify-content:flex-end}
.mp-pk-umbenennen summary{list-style:none}
.mp-pk-umbenennen summary::-webkit-details-marker{display:none}
.mp-pk-umbenennen[open] summary{display:none}
.mp-pk-umbenennen .pt-input{min-width:0; flex:1 1 12rem}
[data-pk-bereich] [data-pk-reauth] .pt-input{flex:1 1 12rem; min-width:0}
@media (max-width:599px){
  .mp-pk-aktionen{justify-content:flex-start}
  .pt-list-row:has(.mp-pk-aktionen){flex-wrap:wrap}
  .pt-list-row .mp-pk-aktionen{width:100%; padding-left:calc(var(--tap) + var(--sp-2))}
}

/* ═══════════════════════════════════════════════════════════════════════════
   9. Abschlussfreigabe (view=freigabe, 2.9.0) – nutzt Signierseiten-Rahmen (sz-*)
   ═══════════════════════════════════════════════════════════════════════════ */
.fg-kopf .pt-eyebrow{margin:0 0 var(--sp-1)}
.fg-meta{margin:0 0 var(--sp-2); font-size:var(--fs-3); color:var(--pt-text-2)}
.fg-h{font-family:var(--font-serif); font-weight:400; font-size:var(--fs-5); color:var(--pt-primary-dark); margin:0 0 var(--sp-3)}
.fg-label{display:block; margin:var(--sp-4) 0 var(--sp-2); font-size:var(--fs-2); font-weight:700; text-transform:uppercase; letter-spacing:.04em; color:var(--pt-text-2)}
.fg-dateien{list-style:none; margin:0; padding:0; border:var(--line-w) solid var(--pt-line); border-radius:var(--radius-s)}
.fg-dateien li{display:flex; flex-wrap:wrap; align-items:center; gap:var(--sp-2) var(--sp-3); padding:var(--sp-3); border-top:var(--line-w) solid var(--pt-line)}
.fg-dateien li:first-child{border-top:0}
.fg-datei-name{flex:1 1 220px; font-size:var(--fs-3); font-weight:600; overflow-wrap:anywhere}
.fg-datei-name small{font-weight:400; color:var(--pt-text-2)}
.fg-dateien .pt-btn{min-height:var(--tap)}
.fg-hinweis{margin:var(--sp-4) 0 0; font-size:var(--fs-3); line-height:var(--lh); color:var(--pt-text-2)}
.fg-aktionen{display:flex; flex-wrap:wrap; justify-content:flex-end; gap:var(--sp-3); margin-top:var(--sp-5)}
.fg-aktionen .pt-btn{min-height:var(--tap)}
.fg-note{border-radius:var(--radius-s); padding:var(--sp-3) var(--sp-4); margin:var(--sp-3) 0; font-size:var(--fs-3); line-height:var(--lh); background:var(--pt-tint); border:var(--line-w) solid var(--pt-line)}
.fg-note--ok{background:var(--ok-bg); border-color:var(--ok); color:var(--ok)}
.fg-note--warn{background:var(--warn-bg); border-color:var(--warn-line); color:var(--warn)}
.fg-abschnitt{margin-top:var(--sp-5); padding-top:var(--sp-4); border-top:var(--line-w) solid var(--pt-line)}
.fg-abschnitt h4{margin:0 0 var(--sp-3); font-size:var(--fs-4); color:var(--pt-primary-dark)}
.fg-text{margin:0 0 var(--sp-3); font-size:var(--fs-3); line-height:var(--lh)}
.fg-erkl{margin:0 0 var(--sp-3); padding:var(--sp-3) var(--sp-4); background:var(--pt-tint); border-left:3px solid var(--pt-primary); border-radius:var(--radius-s)}
.fg-erkl .fg-text{margin-bottom:var(--sp-2)}
.fg-erkl-liste{margin:0; padding-left:1.4em; font-size:var(--fs-3); line-height:var(--lh)}
.fg-erkl-liste li{margin:0 0 var(--sp-2)}
.fg-frage{margin:0 0 var(--sp-4); padding:var(--sp-3); border-radius:var(--radius-s); border:var(--line-w) solid transparent}
.fg-frage.is-fehlt{border-color:var(--crit); background:var(--crit-bg)}
.fg-frage-titel{display:block; margin:0 0 var(--sp-2); font-size:var(--fs-3); font-weight:700}
.fg-frage textarea,.fg-frage input[type=text]{width:100%; box-sizing:border-box; min-height:var(--tap); padding:var(--sp-2) var(--sp-3); border:var(--line-w) solid var(--pt-line); border-radius:var(--radius-s); font:inherit; font-size:var(--fs-3); background:var(--pt-surface); color:var(--pt-text)}
.fg-check{display:flex; gap:var(--sp-3); align-items:flex-start}
.fg-check input{flex:none; width:22px; height:22px; margin-top:2px; accent-color:var(--pt-primary-dark)}
.fg-check label{display:flex; flex-direction:column; gap:var(--sp-1); font-size:var(--fs-3); line-height:var(--lh)}
.fg-auswahl{border:0; margin:0; padding:0; min-width:0}
.fg-auswahl legend{padding:0; margin:0 0 var(--sp-2); font-size:var(--fs-3); line-height:var(--lh)}
.fg-option{display:flex; gap:var(--sp-3); align-items:flex-start; min-height:var(--tap); padding:var(--sp-1) 0}
.fg-option input{flex:none; width:20px; height:20px; margin-top:3px; accent-color:var(--pt-primary-dark)}
.fg-option label{font-size:var(--fs-3); line-height:var(--lh); cursor:pointer}
.fg-zusatz:empty{display:none}
.fg-zusatz{margin:var(--sp-2) 0 0 calc(20px + var(--sp-3))}
.fg-upload{display:flex; flex-direction:column; gap:var(--sp-2); margin-top:var(--sp-2)}
.fg-upload-info{font-size:var(--fs-2); color:var(--pt-text-2)}
.fg-info{margin-top:var(--sp-2); font-size:var(--fs-2); color:var(--pt-text-2)}
/* 2.21.0: weitere Beteiligte – Adresse angeben/ändern */
.fg-weitere{margin-top:var(--sp-5); padding-top:var(--sp-4); border-top:var(--line-w) solid var(--pt-line)}
.fg-person{margin:0 0 var(--sp-4)}
.fg-person .fg-stand{margin:0 0 var(--sp-2); text-align:left; font-size:var(--fs-3); line-height:var(--lh); color:var(--pt-text)}
.fg-adresse .pt-input{width:100%; box-sizing:border-box; min-height:var(--tap)}
.fg-adresse .fg-aktionen{margin-top:var(--sp-3)}
.fg-info summary{cursor:pointer; min-height:var(--tap); display:flex; align-items:center}
.fg-info p{margin:var(--sp-1) 0 0; line-height:var(--lh)}
.fg-stand{margin:var(--sp-3) 0 0; text-align:right; font-size:var(--fs-2); color:var(--pt-text-2)}
@media (max-width:599px){
  .fg-aktionen{flex-direction:column-reverse}
  .fg-aktionen .pt-btn{width:100%}
  .fg-zusatz{margin-left:0}
}
/* 2.10.2: Abschlussfreigabe – Ablauf, Hinweisknopf, Vorbelegung */
.fg-ablauf{border-left:4px solid var(--pt-primary)}
.fg-ablauf-titel{margin:0 0 var(--sp-2); font-weight:700; font-size:var(--fs-3)}
.fg-ablauf-liste{margin:0; padding-left:1.4em; line-height:var(--lh)}
.fg-ablauf-liste li{margin:var(--sp-1) 0}
.fg-ablauf-hinweis{margin:var(--sp-3) 0 0; padding:var(--sp-2) var(--sp-3); border-radius:var(--radius-m, 8px); background:var(--pt-soft); font-size:var(--fs-3); line-height:var(--lh)}
.fg-frage-kopf{display:flex; align-items:baseline; justify-content:space-between; gap:var(--sp-2); flex-wrap:wrap}
.fg-frage-kopf .fg-frage-titel{margin-bottom:var(--sp-1)}
.fg-info-knopf{appearance:none; border:1px solid var(--pt-border, #d0deca); background:transparent; color:var(--pt-primary); border-radius:999px; padding:2px 10px; min-height:32px; font:inherit; font-size:var(--fs-2); cursor:pointer}
.fg-info-knopf::before{content:"i"; display:inline-flex; align-items:center; justify-content:center; width:16px; height:16px; margin-right:6px; border-radius:50%; background:var(--pt-primary); color:var(--pt-on-primary, #fff); font-weight:700; font-size:11px; font-style:italic}
.fg-info-knopf[aria-expanded="true"]{background:var(--pt-soft)}
.fg-check + .fg-info-knopf{margin-top:var(--sp-2)}
.fg-info-box{margin:var(--sp-2) 0; padding:var(--sp-3); border-radius:var(--radius-m, 8px); background:var(--pt-soft); font-size:var(--fs-2); line-height:var(--lh); color:var(--pt-text)}
.fg-info-box p{margin:0}
.fg-info-box p + p{margin-top:var(--sp-2)}
.fg-info-zusatz{color:var(--pt-text-2)}
.fg-vorbelegt{margin:0 0 var(--sp-2); font-size:var(--fs-2); color:var(--pt-primary-dark, #3A5233); font-style:italic}
.fg-zu-sign{margin:0 0 var(--sp-3); padding-left:1.2em; line-height:var(--lh)}

/* 2.12.0: Download gesammelt, Freigabe Einkommensteuer (Bestätigung, Rückfrage) */
.sz-download{margin-top:var(--sp-3)}
.fg-aktionen .pt-btn[download]{text-decoration:none}
.fg-rueckfrage{margin-top:var(--sp-5); border-top:var(--line-w) solid var(--pt-line); padding-top:var(--sp-3)}
.fg-rueckfrage summary{cursor:pointer; font-weight:600; color:var(--pt-primary-dark)}
.fg-rueckfrage textarea{width:100%; margin-top:var(--sp-1)}
[data-t="fg-bestaetigung"] .fg-check{margin:var(--sp-3) 0}
[data-t="fg-bestaetigung"] .pt-input{width:100%; max-width:28rem}
