/* WSPÓLNY PRZEŁĄCZNIK STATUSU „W toku | Gotowy” (GUI-PLANY, 18.10.2026) — znacznik: js/okna/status-seg.js (statusSegHtml).
   Układ nagłówka (.dsg-st: po prawej, ikona ✓, kolory aktywnego przycisku dla data-dsg-st) mieszka w 4-widoki/25c-design-okno.css;
   tu: ten sam wygląd dla przycisków z atrybutem data-st (Plany, Gwarancja). Telefon: 9-telefon/2b-plany-okno.css. */
.dsg-st > [data-st] { display: inline-flex; align-items: center; gap: var(--s-1); cursor: pointer; }
.dsg-st > [data-st] .icon { width: 16px; height: 16px; }
/* Kształt jak we wzorze (.ui-seg.dsg-st): róg --r (12 px), 3 px odstępu między przyciskami, ikona ✓ 16 px — reguła ogólna `.modal .segmented`
   daje róg 8 px i brak odstępu, więc tu z wyższą wagą (tylko przełącznik z data-st; Design ma własny, data-dsg-st). */
.segmented.dsg-st:has(> [data-st]) { gap: 3px; border-radius: var(--r); background: var(--surface-3); }
.dsg-st > [data-st="W toku"][aria-pressed="true"] { background: var(--accent-soft); color: var(--accent-strong); box-shadow: none; }
.dsg-st > [data-st="Gotowy"][aria-pressed="true"] { background: var(--ok-soft); color: var(--ok); box-shadow: none; }
.dsg-st > [data-st]:focus-visible { outline: 2px solid var(--accent); outline-offset: 2px; }