/* Kundenakte: Bereich „Fortschritt“ unter den Aktivitäten (assets/customer-progress.js) – dezentes Hellgrün */
.prog-sec { --ps-bg: #eef6f0; --ps-line: #c6e0cd; --ps-green: #398354; --ps-ink: #24613a; margin: 8px 0 4px; border: 1px solid var(--ps-line); border-left: 3px solid var(--ps-green); border-radius: var(--r); background: var(--ps-bg); scroll-margin-top: calc(var(--nav-h, 52px) + 64px); min-width: 0; }
.prog-sec-head { display: flex; align-items: center; gap: 8px; padding: 4px 10px 4px 4px; cursor: pointer; }
.prog-sec-toggle { flex: 1 1 auto; min-width: 0; display: flex; align-items: center; flex-wrap: wrap; gap: 4px 8px; border: 0; background: none; padding: 7px 6px; font: inherit; font-size: 13px; color: var(--text); text-align: left; cursor: pointer; border-radius: 6px; }
.prog-sec-toggle:hover { background: rgba(57, 131, 84, .08); }
.prog-sec-toggle:focus-visible { outline: 2px solid var(--yellow); outline-offset: 1px; }
.prog-sec-toggle b { font-weight: 600; color: var(--ps-ink); }
.prog-sec-toggle > svg { flex: none; color: var(--ps-green); }
.prog-sec-chev { transition: transform .15s ease; }
.prog-sec-toggle[aria-expanded="true"] .prog-sec-chev { transform: rotate(90deg); }
.prog-sec-sum { color: #44514a; font-size: 12.5px; min-width: 0; overflow-wrap: anywhere; }
.prog-sec-sum .late { color: #c0262d; font-weight: 600; }
.prog-mini { flex: 0 0 90px; height: 6px; border-radius: 999px; background: #d7e8dc; overflow: hidden; }
.prog-mini i { display: block; height: 100%; width: 0; background: var(--ps-green); border-radius: 999px; transition: width .2s ease; }
.prog-sec-body { border-top: 1px solid var(--ps-line); padding: 12px 14px 14px; min-width: 0; }
.prog-sec-body[hidden] { display: none; }
/* Alte Zeitleiste/Phasenliste werden durch den datengetriebenen Baum ersetzt (bleiben als Rechenbasis im DOM) */
.prog-sec-body .crm-progress, .prog-sec-body .tl { display: none !important; }
.ps-tools { display: flex; flex-wrap: wrap; align-items: center; justify-content: flex-end; gap: 6px 10px; margin: -4px 0 6px; }
.ps-tools-btns { display: flex; flex-wrap: wrap; gap: 4px 10px; margin-left: auto; }
.prog-sec-sum .ps-sum-sp { font-weight: 600; color: var(--ps-ink); }
.prog-sec-sum .ps-sum-sep { color: #9bb8a4; }
/* Sparten-Auswahl (Farben wie die Sparten-Kacheln der Pipeline) */
.ps-sp-switch { display: inline-flex; flex-wrap: wrap; gap: 0; border: 1px solid var(--ps-line); border-radius: 8px; background: var(--card); overflow: hidden; max-width: 100%; margin-right: auto; }
.ps-sp { --c: #555; --spbg: #f1f1f1; display: inline-flex; align-items: center; gap: 5px; min-height: 32px; padding: 0 11px; border: 0; border-right: 1px solid var(--ps-line); background: none; color: var(--text); font: 600 12.5px/1 Inter, sans-serif; cursor: pointer; }
.ps-sp:last-child { border-right: 0; }
.ps-sp svg { flex: none; color: var(--c); }
.ps-sp:hover { background: var(--spbg); }
.ps-sp[aria-pressed="true"] { background: var(--spbg); color: var(--c); box-shadow: inset 0 -2px 0 var(--c); }
.ps-sp:focus-visible { outline: 2px solid var(--yellow); outline-offset: -2px; }
.ps-sp.sp-PV { --c: #8a6400; --spbg: #fff1b8; }
.ps-sp.sp-WP { --c: #c2410c; --spbg: #ffe4d6; }
.ps-sp.sp-Klima { --c: #1d5fd1; --spbg: #dfeaff; }
.ps-sp.sp-Dach { --c: #7a4a1e; --spbg: #f3e3d0; }
.ps-sp.all { --c: var(--ps-ink); --spbg: #dcefe2; }
/* Ansicht „Alle“: je Sparte ein eigener Block */
.ps-sparte { border-top: 2px solid var(--ps-line); padding-top: 8px; }
.ps-sparte + .ps-sparte { margin-top: 16px; }
.ps-sparte > h4 { display: flex; align-items: center; flex-wrap: wrap; gap: 4px 8px; margin: 0 0 8px; font-size: 14px; font-weight: 600; color: var(--ps-ink); }
.ps-sparte > h4 small { font-size: 12px; font-weight: 500; color: var(--muted); min-width: 0; overflow-wrap: anywhere; }
.ps-note { flex: 0 1 auto; min-width: 0; overflow: hidden; text-overflow: ellipsis; font-size: 11.5px; color: var(--muted); background: #f1f1ef; border-radius: 999px; padding: 2px 8px; white-space: nowrap; }
.ps-link { flex: none; display: inline-flex; align-items: center; gap: 4px; font-size: 12px; font-weight: 600; color: var(--link, #017e84); text-decoration: none; border: 1px solid var(--line-2); border-radius: 6px; padding: 3px 7px; background: var(--card); white-space: nowrap; }
.ps-link:hover { text-decoration: underline; }
.ps-link-row { display: contents; }
.ps-group + .ps-group { margin-top: 12px; }
.ps-group h5 { margin: 0 0 6px; font-size: 11.5px; font-weight: 600; color: var(--ps-ink); text-transform: uppercase; letter-spacing: .05em; }
.ps-phase { background: var(--card); border: 1px solid var(--ps-line); border-radius: var(--r); margin-bottom: 6px; }
.ps-phase > summary { display: flex; align-items: center; gap: 8px; padding: 8px 12px; cursor: pointer; font-size: 13px; list-style: none; }
.ps-phase > summary::-webkit-details-marker { display: none; }
.ps-phase > summary::after { content: ""; width: 7px; height: 7px; border-right: 2px solid var(--muted); border-bottom: 2px solid var(--muted); transform: rotate(-45deg); margin-left: 4px; transition: transform .15s ease; flex: none; }
.ps-phase[open] > summary::after { transform: rotate(45deg); }
.ps-phase > summary b { font-weight: 600; min-width: 0; overflow-wrap: anywhere; }
.ps-phase > summary:focus-visible { outline: 2px solid var(--yellow); outline-offset: -2px; border-radius: var(--r); }
.ps-count { margin-left: auto; color: var(--muted); font-size: 12px; white-space: nowrap; }
.ps-phase.open > summary b { color: var(--muted); font-weight: 500; }
.ps-phase.cur { border-color: #e9c46a; box-shadow: inset 3px 0 0 var(--yellow); }
.ps-ico { flex: none; width: 20px; height: 20px; border-radius: 50%; display: grid; place-items: center; font-size: 11px; font-weight: 700; background: #ececea; color: var(--muted); }
.done > summary > .ps-ico, .ps-step.done > .ps-ico { background: var(--ps-green); color: #fff; }
.cur > summary > .ps-ico, .ps-step.cur > .ps-ico { background: var(--yellow); color: var(--ink); }
.ps-step.warn > .ps-ico { background: #c0262d; color: #fff; }
.ps-steps { list-style: none; margin: 0; padding: 0 12px 8px 40px; }
.ps-step { display: grid; grid-template-columns: 20px minmax(0, 1fr) auto; gap: 10px; align-items: start; padding: 7px 0; border-top: 1px solid var(--line-2); font-size: 13px; }
.ps-step b { font-weight: 600; overflow-wrap: anywhere; }
.ps-step b .link { font: inherit; font-weight: 600; background: none; border: 0; padding: 0; cursor: pointer; text-align: left; }
.ps-step.open b { color: var(--muted); font-weight: 500; }
.ps-step small { display: block; color: var(--muted); font-size: 12px; overflow-wrap: anywhere; }
.ps-meta { text-align: right; color: var(--muted); font-size: 12px; white-space: nowrap; }
.ps-step.cur .ps-meta { color: var(--yellow-text); font-weight: 600; }
.ps-step.warn .ps-meta { color: #c0262d; }
@media (max-width: 480px) {
  .prog-sec-head { padding: 4px 8px 6px 4px; }
  .prog-mini { flex-basis: 100%; margin-left: 26px; flex-shrink: 1; max-width: calc(100% - 26px); }
  .prog-sec-body { padding: 10px; }
  .ps-steps { padding: 0 10px 6px 12px; }
  .ps-step { grid-template-columns: 20px minmax(0, 1fr); }
  .ps-meta { grid-column: 2; text-align: left; white-space: normal; }
  .ps-meta small { display: inline; margin-left: 6px; }
  .ps-sp-switch { width: 100%; }
  .ps-phase > summary { flex-wrap: wrap; row-gap: 4px; }
  .ps-phase > summary b { flex: 1 1 0; }
  .ps-link-row { display: block; order: 10; flex: 1 0 100%; padding-left: 28px; }
  .ps-link { display: inline-flex; padding: 3px 6px; }
  .ps-sp { flex: 1 1 0; justify-content: center; padding: 0 6px; }
  .ps-tools-btns { width: 100%; justify-content: flex-end; }
}