/* ============================================================================
   25f-plany-okno-zakladki.css — OKNO „EDYTUJ PLANY” wg artefaktu v102 (GUI-PLANY, 18.10.2026)
   ----------------------------------------------------------------------------
   Zakładki jak w oknie Design (Plan i harmonogram | Konstrukcje | Uwagi i pliki | Czat), status „W toku | Gotowy” w nagłówku,
   linia „Zakres planów”, chipy inżynierów (kółko + imię w 2 liniach — klasy .dsg-zav z 25c), pasek osi „Plany | Dziś” i −/30 dni/+,
   karta „Uwagi i pliki”, czat etapu jako zakładka. Wzór: PROJEKT-OKIEN\artefakt\okna_css.txt B40–B44 (tokeny artefaktu → programu:
   --linia = --line, --pow = --surface, --pow-2/-3 = --surface-2/-3, --tusz = --text, --tusz-2/-3 = --text-muted/-faint, --ak = --accent).
   Reguły starsze (układ okna, oś, tabela, BOM): 25b-plany-okno.css. Telefon: 9-telefon/2b-plany-okno.css i 2d-plany-okno-zakladki.css.
   ============================================================================ */
/* --- nagłówek: tytuł, „?”, [zakładki — tylko telefon poziomo], status, ✕ w jednej osi --- */
.modal.pln-wz > header { align-items: flex-start; }   /* wzór: elementy nagłówka przy górnej krawędzi (padding 16 px), nie na środku */
.modal.pln-wz > header .dsg-st { margin-left: 0; margin-right: var(--s-2); }
/* --- zakładki (komputer, tablet): podkreślenie jak w Design; telefon ma własne .pln-zakl --- */
.pln-tabsd { display: none; }
:root:not([data-ui="mobile"]) .pln2 .pln-tabsd { display: flex; }
.pln-tabsd .dsg-n { margin-left: var(--s-2); font-weight: var(--w-strong); }   /* wzór: licznik na zakładce 700 (ogólne .dsg-n z 25c ma 600 — Design zostaje) */
.pln-tabsd .dsg-tab { font-size: var(--t-base); }   /* wzór: .dsg-tab = --t-3 (14 px); ogólne .dsg-tab z 25c (16 px) zostaje dla Design */
:root:not([data-ui="mobile"]) .pln2 .pln-s { display: none; }
:root:not([data-ui="mobile"]) .pln2.zak-plan .pln-s-plan, :root:not([data-ui="mobile"]) .pln2.zak-kon .pln-s-kon, :root:not([data-ui="mobile"]) .pln2.zak-uw .pln-s-uw { display: flex; }
/* --- „Uwagi i pliki”: karta na całą wysokość okna, edytor rośnie, ramka „Pliki” stoi pod nim --- */
.pln-cialo > .pln2.zak-uw { min-height: 100%; }
.pln2.zak-uw .pln-s-uw { flex: 1 1 auto; min-height: 0; }
.pln-s-uw > .pln-uw { flex: 1 1 auto; min-height: 0; }
.pln-uw .dsg-opis-ed { min-height: 220px; }
.pln-pl { border-radius: var(--r); }   /* wzór: .dsg-pl{border-radius:var(--r)} — ramka „Pliki” ma zaokrąglone narożniki */
.pln-pl.is-dragover { border-top-color: var(--accent); background: var(--accent-soft); }
.pln-pl .pln-btn .icon { width: 16px; height: 16px; }
.pln-pl .dsg-pl-q { width: 220px; }
.pln-pl .dsg-pl-l { height: calc(3 * var(--h-control) + 5 * var(--s-2)); }   /* wzór (.dsg-opis .dsg-pl-l): 3 wiersze + 5 odstępów (148 px), nie 6 odstępów jak w Design; na dotyku wysokość „auto” zostaje (25c) */
.pln-pl .dsg-pw .pln-ik { width: var(--h-control-sm); height: var(--h-control-sm); }
.pln-pl .dsg-pw .pln-ik.us:hover { background: var(--danger-soft); color: var(--danger); }
/* --- czat etapu jako zakładka (zamiast szuflady z prawej) --- */
:root:not([data-ui="mobile"]) .pln-cialo > .pln2.zak-czat { height: 100%; min-height: 0; }
:root:not([data-ui="mobile"]) .pln2.zak-czat .pln-czat { display: flex; flex-direction: column; flex: 1 1 0; min-height: 0; border: 1px solid var(--line); border-radius: var(--r); background: var(--surface); overflow: hidden; }
.pln2.zak-czat .pln-czat .project-chat-panel { flex: 1 1 auto; min-height: 0; }
/* --- „Plan i harmonogram”: linia zakresu planów (liczy ją okno z terminów konstrukcji) --- */
.pln-zr { display: flex; flex-wrap: wrap; align-items: baseline; gap: var(--s-1) var(--s-3); margin: 0; padding: var(--s-2) var(--s-3); border: 1px solid var(--line); border-radius: var(--r-sm); background: var(--surface-2); font-size: var(--t-sm); color: var(--text-muted); }
.pln-zr > b, .pln-zr .pln-zd b { font-size: var(--t-base); font-weight: var(--w-strong); color: var(--text); }   /* wzór: 14 px, cyfry bez tabeli */
.pln-zr small { margin-left: auto; font-size: var(--t-xs); color: var(--text-faint); }
/* --- inżynierowie planów: chipy (kółko + imię i nazwisko w 2 liniach) i „+” --- */
.pln-har { --dsg-chip: var(--h-control); }   /* wzór: chip = wysokość kontrolki (36 px na komputerze, 44 px na dotyku) */
.pln-inz { align-items: center; }
.pln-inz > .dsg-zav-w { flex: 1 1 0; min-width: 0; }
.pln-har .dsg-zav .avatar.pln-aw { border: 0; }
.avatar.pln-aw-32 { --avatar-d: 32px; }
.avatar.pln-aw-36 { --avatar-d: 36px; font-size: var(--t-base); }   /* wzór: inicjały w chipie 14 px */
.pln-mn.dsg-mn .avatar.pln-aw { border: 0; }
/* --- pasek osi: „Plany | Dziś” i skala (tylko tam, gdzie widać oś) --- */
.pln-onar { display: none; align-items: center; flex-wrap: wrap; gap: var(--s-2) var(--s-3); margin-top: var(--s-1); }
:root:not([data-ui="mobile"]) .pln-onar { display: flex; }
.pln-oz { display: inline-flex; align-items: center; gap: var(--s-1); margin-left: auto; }
.pln-oz .pln-btn { min-width: 0; }
.pln-oz .pln-ik .icon { width: 16px; height: 16px; }
.pln-har .pos { margin-top: 0; }
/* --- tabela konstrukcji: kafle „Termin” i „Inżynier” są tylko na telefonie (karta) --- */
.pln-sumw { display: none; }
.pln-sl { grid-area: l; }
