i ta warstwa przebiera stare elementy panelu (karty, tabele, formularze, plakietki). Trzy zasady tej warstwy: - zakres to WYŁĄCZNIE `main.pw` (plus kilka elementów poza nim, nazwanych wprost niżej) — strony zbudowane od razu w stylu www (trening, rejestr, nowy klient) mają `main.tr` i tej warstwy nie widzą; - stare zmienne palety (--navy, --muted, --border…) są wewnątrz `main.pw` PRZEMAPOWANE na paletę www, więc reguły style.css oparte na zmiennych przebierają się same; niżej są tylko te, które miały kolor wpisany na sztywno; - selektory w :where() — nie przebijają klas .tr-* i .rw-* tam, gdzie się spotkają, a z regułami style.css o tej samej wadze wygrywają kolejnością (ten plik jest dołączany PO style.css). ============================================================================ */ main.pw{ --navy:var(--t-akc); --navy-dark:var(--t-txt); --teal-hover:#ff7d38; --brand-orange:var(--t-akc); --bg:var(--t-bg); --card:var(--t-sur); --text:var(--t-txt); --muted:var(--t-mut); --border:var(--t-lin); --green:var(--t-ok); --amber:var(--t-ost); --red:var(--t-zle); max-width:880px; padding:16px 14px 28px; color:var(--t-txt); } main.pw.pw-szeroki{max-width:1240px} :where(main.pw) a{color:var(--t-akc)} :where(main.pw) h1,:where(main.pw) h2,:where(main.pw) h3{color:var(--t-txt)} :where(main.pw) .card{background:var(--t-sur);border:1px solid var(--t-lin);border-radius:16px;padding:16px} :where(main.pw) .card h2{font-size:18px;font-weight:800;letter-spacing:-.01em;margin:0 0 12px} :where(main.pw) .card .card{background:var(--t-sur2)} :where(main.pw) .stat{background:var(--t-sur);border:1px solid var(--t-lin);border-radius:16px} :where(main.pw) .stat .value{color:var(--t-txt);font-weight:800} :where(main.pw) .error{background:var(--t-zle-tlo);color:var(--t-zle);border:1px solid var(--t-zle);border-radius:10px} /* tabele */ :where(main.pw) th{background:var(--t-sur2);color:var(--t-mut);border-bottom:1px solid var(--t-lin)} :where(main.pw) td{border-bottom:1px solid var(--t-lin)} :where(main.pw) tbody tr:hover td,:where(main.pw) table tr:hover td{background:rgba(255,255,255,.025)} :where(main.pw) .client-list tr:hover{background:rgba(255,255,255,.025)} :where(main.pw) .client-list a{color:var(--t-txt);font-weight:600} @media(max-width:700px){ :where(main.pw) table.tabela-mobilne-karty tr{background:var(--t-sur2);border-color:var(--t-lin);border-radius:14px} :where(main.pw) table.tabela-mobilne-karty tr:hover{background:var(--t-sur2)} :where(main.pw) table.tabela-mobilne-karty tr:hover td{background:transparent} } /* formularze — pola pod kciuk (min. 44 px; 16 px czcionki, żeby iPhone nie powiększał strony) */ :where(main.pw) input:where(:not([type=checkbox],[type=radio],[type=file],[type=hidden])), :where(main.pw) select,:where(main.pw) textarea{ background:var(--t-bg);color:var(--t-txt);border:1px solid var(--t-lin);border-radius:10px; min-height:44px;padding:8px 10px;font-size:16px;color-scheme:dark} :where(main.pw) textarea{min-height:64px} :where(main.pw) input:focus,:where(main.pw) select:focus,:where(main.pw) textarea:focus{outline:none;border-color:var(--t-akc)} :where(main.pw) input[type=checkbox],:where(main.pw) input[type=radio]{accent-color:var(--t-akc);width:20px;height:20px} :where(main.pw) label{color:var(--t-mut);font-size:13px} :where(main.pw) button{min-height:44px;border-radius:12px;border:1px solid var(--t-akc);background:var(--t-akc); color:#0a0b0d;font-weight:700;font-size:15px;padding:0 16px} :where(main.pw) button:hover{background:#ff7d38} :where(main.pw) button.secondary{background:transparent;color:var(--t-txt);border:1px solid var(--t-lin)} :where(main.pw) button.secondary:hover{background:var(--t-sur2)} :where(main.pw) button.link-btn{min-height:0;border:0;background:none;color:var(--t-zle);font-weight:600;padding:0} :where(main.pw) button.link-btn:hover{background:none;color:#ff6f73} :where(main.pw) details>summary{cursor:pointer;color:var(--t-akc);font-weight:600} :where(main.pw) details.pomoc-box>summary{color:var(--t-mut)} :where(main.pw) details.pomoc-box .pomoc-znak{background:var(--t-sur2);color:var(--t-mut);border:1px solid var(--t-lin)} /* plakietki */ :where(main.pw) .tag{background:transparent;border:1px solid var(--t-lin);color:var(--t-mut)} :where(main.pw) .tag.ok{background:rgba(52,211,153,.1);border-color:rgba(52,211,153,.45);color:var(--t-ok)} :where(main.pw) .tag.warn{background:var(--t-ost-tlo);border-color:#6b4a14;color:var(--t-ost)} :where(main.pw) .tag.bad{background:var(--t-zle-tlo);border-color:rgba(229,72,77,.5);color:var(--t-zle)} :where(main.pw) .wariant-plakietka{background:var(--t-sur2);color:var(--t-txt)} :where(main.pw) .rej-prow{background:var(--t-akc-tlo)} /* serie i kaskada treningów (portal, podgląd rozpiski) */ :where(main.pw) details.rej-klient{background:var(--t-sur);border-color:var(--t-lin)} :where(main.pw) details.rej-klient>summary{background:var(--t-sur2)} :where(main.pw) details.rej-sesja{background:var(--t-sur2);border-color:var(--t-lin);border-radius:14px} :where(main.pw) .rej-cwiczenie{background:var(--t-bg);border-color:var(--t-lin);border-left-color:var(--t-akc);border-radius:12px} :where(main.pw) .rej-cw-uwagi{background:var(--t-sur2)} :where(main.pw) .seria-chip{background:var(--t-bg);border-color:var(--t-lin);border-radius:10px} :where(main.pw) .seria-nr{color:#0a0b0d} :where(main.pw) .seria-uwaga{background:var(--t-ost-tlo);color:var(--t-ost)} :where(main.pw) .seria-przerwa{background:transparent;border-color:var(--t-lin)} :where(main.pw) .kf-wiersz-podgladu>td{background:var(--t-sur2)} :where(main.pw) button.skala-chip{background:transparent;color:var(--t-txt);border-color:var(--t-lin)} :where(main.pw) .skala-opcje span{background:var(--t-bg)} :where(main.pw) .skala-opcje input:checked+span{color:#0a0b0d} /* wykres postępów — kolory rysunku biorą się z tych samych zmiennych (postepy_widget.php) */ :where(main.pw) .postepy-miary{border-color:var(--t-lin);border-radius:12px} :where(main.pw) .postepy-miary button{min-height:40px;border:0;border-left:1px solid var(--t-lin);border-radius:0; background:var(--t-sur2);color:var(--t-txt);font-weight:600} :where(main.pw) .postepy-miary button:first-child{border-left:0} :where(main.pw) .postepy-miary button:hover{background:#262b33} :where(main.pw) .postepy-miary button.aktywna{background:var(--t-akc);color:#0a0b0d} :where(main.pw) .postepy-tip{background:var(--t-sur2);border-color:var(--t-lin);color:var(--t-txt)} :where(main.pw) .postepy-kafelek{min-height:0;background:var(--t-sur2);border:1px solid var(--t-lin);color:var(--t-txt);font-weight:400;padding:8px 10px;border-radius:12px} :where(main.pw) .postepy-kafelek:hover{background:#262b33;border-color:#3a414d} :where(main.pw) .postepy-kafelek.aktywny{background:var(--t-akc-tlo);border-color:var(--t-akc);box-shadow:none} :where(main.pw) .postepy-kpi-kafel{background:var(--t-sur2);border-color:var(--t-lin);border-left-color:var(--t-akc);border-radius:12px} :where(main.pw) .postepy-kpi-kafel.ostrzega{background:var(--t-ost-tlo);border-left-color:var(--t-ost)} /* Grafik */ :where(main.pw) .widok-przelacznik{border-color:var(--t-lin);border-radius:12px} :where(main.pw) .widok-przelacznik a{background:var(--t-sur2);color:var(--t-txt);border-left-color:var(--t-lin);padding:10px 16px} :where(main.pw) .widok-przelacznik a:hover{background:#262b33} :where(main.pw) .widok-przelacznik a.aktywny{background:var(--t-akc);color:#0a0b0d} :where(main.pw) .grafik-nawigacja a{background:var(--t-sur2);border-color:var(--t-lin);color:var(--t-txt);height:40px;min-width:40px;border-radius:10px} :where(main.pw) .grafik-nawigacja a:hover{border-color:var(--t-akc);color:var(--t-akc)} :where(main.pw) .grafik-siatka{background:var(--t-lin);border-color:var(--t-lin);border-radius:14px} :where(main.pw) .grafik-naglowek{background:var(--t-sur2);color:var(--t-mut)} :where(main.pw) .grafik-dzien{background:var(--t-sur)} :where(main.pw) .grafik-komorka{background:var(--t-bg)} :where(main.pw) .grafik-dzien.grafik-dzis,:where(main.pw) .grafik-komorka.grafik-dzis{background:var(--t-akc-tlo)} :where(main.pw) .grafik-termin{background:var(--t-sur2);border-color:var(--t-lin);border-left-color:var(--t-akc)} :where(main.pw) .grafik-termin.status-odbyta{border-left-color:var(--t-ok)} :where(main.pw) .grafik-termin.status-odwolana{border-left-color:var(--t-mut)} /* odwołana szara — to nie błąd (A49, v66) */ :where(main.pw) .grafik-dodaj:hover{background:var(--t-akc);color:#0a0b0d} :where(main.pw) .grafik-przelacznik button{min-height:36px;background:transparent;border-color:var(--t-lin);color:var(--t-txt);border-radius:999px} :where(main.pw) .grafik-przelacznik button.aktywny{background:var(--t-akc);border-color:var(--t-akc);color:#0a0b0d} :where(main.pw) .akcja-ikona{min-height:0;border:0;background:transparent;color:var(--t-mut)} :where(main.pw) .akcja-ikona:hover{background:var(--t-sur2);color:var(--t-akc)} :where(main.pw) .akcja-ikona.akcja-usun:hover{background:var(--t-zle-tlo);color:var(--t-zle)} :where(main.pw) .akcja-glowna{background:var(--t-akc-tlo);color:var(--t-akc)} :where(main.pw) .akcja-glowna:hover{background:var(--t-akc);color:#0a0b0d} :where(main.pw) .grafik-termin.status-nieobecnosc{border-left-color:var(--t-ost)} :where(main.pw) .grafik-termin.przerwa{border-left-color:var(--t-lin);background:var(--t-bg);font-style:italic;color:var(--t-mut)} :where(main.pw) .grafik-termin.bez-kodu{border-left-color:var(--t-ost)} :where(main.pw) .grafik-termin a{color:inherit} :where(main.pw) .grafik-termin .gw-plakietki{margin-top:4px} /* Grafik ze skoroszytu (fala 1, krok 5, 24.09.2026): źródło danych, widok Dziś, plakietki wpisów. Kolory znaczą to samo co w starym panelu: zielony = odbyta, pomarańcz marki = zaplanowana, czerwony = odwołana, żółty = nieobecność albo rzecz do sprawdzenia, szary = poza treningami. */ .gw-zrodlo{margin:0 0 12px;font-size:13px} .gw-dzis-pusto{margin:0 0 14px;padding:10px 12px;border:1px dashed var(--t-lin);border-radius:12px;color:var(--t-mut)} .gw-dzien{margin:0 0 18px} .gw-dzien-glowa{display:flex;align-items:baseline;flex-wrap:wrap;gap:8px;margin:0 0 8px;font-size:13px;font-weight:700; text-transform:uppercase;letter-spacing:.04em;color:var(--t-mut)} .gw-dzien-nazwa{color:var(--t-txt)} .gw-tag-dzis{padding:1px 8px;border-radius:999px;background:var(--t-akc);color:#0a0b0d;font-size:11px} .gw-licznik{margin-left:auto;font-weight:600;text-transform:none;letter-spacing:0} .gw-lista{display:flex;flex-direction:column;gap:8px} .gw-wpis{display:flex;align-items:flex-start;gap:12px;padding:10px 12px;background:var(--t-sur);border:1px solid var(--t-lin); border-left:4px solid var(--t-akc);border-radius:12px} .gw-wpis.status-odbyta{border-left-color:var(--t-ok)} .gw-wpis.status-odwolana{border-left-color:var(--t-mut);background:var(--t-bg)} .gw-wpis.status-odwolana .gw-kto{color:var(--t-mut)} .gw-wpis.status-nieobecnosc{border-left-color:var(--t-ost)} .gw-wpis.przerwa{border-left-color:var(--t-lin);background:var(--t-bg)} .gw-wpis.przerwa .gw-kto{font-style:italic;font-weight:500;color:var(--t-mut)} .gw-wpis.bez-kodu{border-left-color:var(--t-ost)} .gw-czas{flex:0 0 50px;display:flex;flex-direction:column;font-variant-numeric:tabular-nums} .gw-czas strong{font-size:16px;color:var(--t-txt)} .gw-czas small{font-size:12px;color:var(--t-mut)} .gw-tresc{flex:1;min-width:0} .gw-kto{font-size:16px;font-weight:700;color:var(--t-txt);overflow-wrap:anywhere} .gw-kto a{color:inherit;text-decoration:none} .gw-meta{margin-top:2px;font-size:13px;color:var(--t-mut)} .gw-trener{font-weight:700;color:var(--t-txt)} .gw-plakietki{display:flex;flex-wrap:wrap;gap:4px;margin-top:6px} td .gw-plakietki{display:inline-flex;margin-top:0} .gw-plak{display:inline-block;padding:1px 8px;border:1px solid var(--t-lin);border-radius:999px;font-size:11.5px;line-height:1.6; font-style:normal;color:var(--t-mut);white-space:nowrap} .gw-plak.pula{border-color:transparent;background:var(--t-akc-tlo);color:var(--t-akc)} .gw-plak.st-odbyta{border-color:var(--t-ok);color:var(--t-ok)} .gw-plak.st-odwolana{border-color:var(--t-mut);color:var(--t-mut)} .gw-plak.st-nieobecnosc,.gw-plak.ost{border-color:var(--t-ost);color:var(--t-ost)} .gw-plak.nakladka{border-style:dashed} .gw-plak.nie-przychodzi{white-space:normal} /* imiona osób, które nie przychodzą, zawijają się — na 390 px plakietka wychodziła poza ekran (v66) */ .gw-trening{flex:0 0 auto;align-self:center;display:inline-flex;align-items:center;min-height:40px;padding:0 12px;border-radius:10px; background:var(--t-akc-tlo);color:var(--t-akc);font-size:13px;font-weight:700;text-decoration:none} .gw-trening:hover{background:var(--t-akc);color:#0a0b0d} .gw-dalej{margin:4px 0 0} /* listy w stylu www: klienci, najbliższe terminy — cały wiersz to jeden cel pod kciuk */ .pw-naglowek{align-items:center;margin-bottom:12px} .pw-naglowek .tr-tytul{margin-bottom:0} .pw-szukaj{margin:0 0 12px} .pw-sekcja{margin:22px 0 8px} .pw-lista{display:flex;flex-direction:column;gap:8px;margin-bottom:12px} a.pw-osoba{display:flex;align-items:center;gap:12px;min-height:60px;padding:10px 12px;background:var(--t-sur); border:1px solid var(--t-lin);border-radius:14px;color:var(--t-txt);text-decoration:none} a.pw-osoba:hover{border-color:#3a414d;background:var(--t-sur2)} a.pw-osoba.zakonczony{opacity:.55} .pw-osoba-tekst{flex:1;min-width:0;display:flex;flex-direction:column} .pw-osoba-nazwa{font-size:16px;font-weight:700;color:var(--t-txt);overflow:hidden;text-overflow:ellipsis;white-space:nowrap} .pw-osoba-meta{font-size:12.5px;color:var(--t-mut);margin-top:2px} .pw-uwaga{color:var(--t-ost)} .pw-strzalka{flex:0 0 auto;color:var(--t-mut);font-size:22px;line-height:1} /* elementy POZA main.pw na tych stronach — nazwane wprost */ body.ekran-trening .sekcja-nav{background:rgba(10,11,13,.94);border-bottom:1px solid var(--t-lin);box-shadow:none; -webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px)} body.ekran-trening .sekcja-nav a{color:var(--t-mut);opacity:1;border:1px solid var(--t-lin);padding:6px 13px} body.ekran-trening .sekcja-nav a:hover{background:var(--t-sur2);color:var(--t-txt)} body.ekran-trening .sekcja-nav a.aktywna{background:var(--t-akc);border-color:var(--t-akc);color:#0a0b0d} body.ekran-trening header.topbar{background:var(--t-bg);border-bottom:1px solid var(--t-lin)} body.ekran-trening header.topbar a{color:var(--t-akc)} /* Belka przybornika (23.09): skróty modułów zostają w kolorze ramy, pomarańcz tylko jako znacznik aktywnego. */ body.ekran-trening header.belka .belka-skroty a{color:var(--t-mut)} body.ekran-trening header.belka .belka-skroty a:hover,body.ekran-trening header.belka .belka-skroty a.aktywny{color:var(--t-txt)} body.ekran-trening .minutnik-fab{background:var(--t-akc);color:#0a0b0d} body.ekran-trening .minutnik-fab:hover{background:#ff7d38} body.ekran-trening .minutnik-panel{background:var(--t-sur);border-color:var(--t-lin);color:var(--t-txt)} body.ekran-trening .minutnik-naglowek{color:var(--t-txt)} body.ekran-trening .minutnik-przyciski button{background:var(--t-sur2);color:var(--t-txt);border:1px solid var(--t-lin);border-radius:10px} body.ekran-trening .okno-panel{background:var(--t-sur);border:1px solid var(--t-lin)} body.ekran-trening .okno-glowa{color:var(--t-txt);border-bottom-color:var(--t-lin)} body.ekran-trening .okno-wiersz{border-bottom-color:var(--t-lin)} body.ekran-trening .okno-etyk{color:var(--t-mut)} body.ekran-trening .okno-wart{color:var(--t-txt)} body.ekran-trening .okno-wiersz.okno-uwaga{background:var(--t-ost-tlo)} body.ekran-trening .okno-wiersz.okno-uwaga .okno-wart{color:var(--t-ost)} body.ekran-trening .okno-akcje{background:var(--t-sur2);border-top-color:var(--t-lin)} body.ekran-trening .okno-akcja{background:transparent;border-color:var(--t-lin);color:var(--t-txt)} body.ekran-trening .okno-akcja:hover{border-color:var(--t-akc);color:var(--t-akc)} body.ekran-trening .okno-akcja.glowna{background:var(--t-akc);border-color:var(--t-akc);color:#0a0b0d} body.ekran-trening .okno-akcja.glowna:hover{background:#ff7d38;color:#0a0b0d} body.ekran-trening .login-box{background:var(--t-sur);border:1px solid var(--t-lin);border-radius:16px} body.ekran-trening .login-box h1{color:var(--t-txt)} body.ekran-trening .login-box label{color:var(--t-mut)} body.ekran-trening .login-box input{background:var(--t-bg);color:var(--t-txt);border:1px solid var(--t-lin);border-radius:10px;min-height:48px;font-size:16px} body.ekran-trening .login-box button{width:100%;min-height:48px;border-radius:12px;background:var(--t-akc);color:#0a0b0d;font-weight:700;font-size:15px} body.ekran-trening .login-box .error{background:var(--t-zle-tlo);color:var(--t-zle);border:1px solid var(--t-zle)} body.ekran-trening .login-box .muted{color:var(--t-mut)} body.ekran-trening .login-box a{color:var(--t-akc)} /* Konto — logowanie i 2FA (fala 1, krok 2 — 24.09.2026) */ .konto-form{display:grid;gap:10px;max-width:420px} .konto-kroki{padding-left:20px} .konto-kroki li{margin-bottom:10px} /* Klienci i karta osoby — karnety, skład i Stan klienta ze skoroszytu (fala 1, krok 6 — 25.09.2026) */ .pw-karnety{margin-top:5px} .pw-karnety .gw-plak{white-space:normal} :where(main.pw) tr.karnet-zamkniety td{opacity:.55} .ks-sklad{margin:0 0 12px} .ks-sklad-wiersz{margin:0 0 6px;overflow-wrap:anywhere} .ks-sklad-wiersz a{margin-left:4px;font-weight:700} .ks-tytul{font-size:15px;font-weight:800;margin:18px 0 8px;color:var(--t-txt)} .ks-tytul .muted{font-weight:500;font-size:13px} .ks-meta{margin:0 0 8px;font-size:13px;color:var(--t-mut)} .ks-meta .gw-plak{margin-left:4px;white-space:normal} .ks-ograniczenia{margin-top:0} .ks-skala{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:5px} .ks-skala li{display:flex;gap:8px;align-items:flex-start} .ks-skala .tag{white-space:normal;height:auto;min-height:24px;padding-top:2px;padding-bottom:2px} .ks-data{min-width:44px;font-weight:700;color:var(--t-txt);font-variant-numeric:tabular-nums} .ks-lista{display:grid;grid-template-columns:minmax(150px,max-content) 1fr;gap:6px 14px;margin:0} .ks-lista dt{color:var(--t-mut);font-size:13px} .ks-lista dd{margin:0;color:var(--t-txt);overflow-wrap:anywhere} .ks-lista dd .gw-plak{margin-left:4px;white-space:normal} .ks-przypis{margin:6px 0 0;font-size:12.5px} .ks-wzorce{display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:6px} .ks-wzorzec{display:flex;flex-direction:column;padding:6px 10px;border:1px solid var(--t-lin);border-radius:10px;background:var(--t-sur2)} .ks-wzorzec-nazwa{font-size:12px;color:var(--t-mut)} .ks-wzorzec-stan{font-size:14px;font-weight:700;color:var(--t-txt)} .ks-wzorzec.ost{border-color:#6b4a14;background:var(--t-ost-tlo)} .ks-wzorzec.ost .ks-wzorzec-stan{color:var(--t-ost)} @media(max-width:560px){ .ks-lista{grid-template-columns:1fr;gap:2px 0} .ks-lista dd{margin-bottom:8px} .ks-wzorce{grid-template-columns:repeat(2,minmax(0,1fr))} } /* Konfiguracje w stylu www i historia zmian rozpiski (fala R4a — 25.09.2026). Plakietki superserii i zamiany mają klasy zamiast kolorów w style="" (style.css trzyma jasną wersję dla starych stron); tu ciemna — także w oknie podglądu rozpiski, które stoi poza main.pw. */ body.ekran-trening .tag.kf-superseria,.www .tag.kf-superseria{background:var(--t-akc-tlo);border-color:transparent;color:var(--t-akc)} body.ekran-trening .tag.kf-zamiana,.www .tag.kf-zamiana{background:var(--t-ost-tlo);border-color:#6b4a14;color:var(--t-ost)} body.ekran-trening .kf-zamiana-tekst,.www .kf-zamiana-tekst{color:var(--t-ost)} :where(main.pw) .blok-cwiczenia-konfig,:where(main.pw) .blok-konfiguracji{border-color:var(--t-lin)} /* strzałki kolejności to przyciski .link-btn — bez tej reguły świeciłyby czerwienią „usuń” */ :where(main.pw) button.link-btn.akcja-ikona:not(.akcja-usun){color:var(--t-mut);font-size:17px} :where(main.pw) button.link-btn.akcja-ikona:not(.akcja-usun):hover{color:var(--t-akc);background:var(--t-sur2)} :where(main.pw) .tabela-serie input{min-height:40px} details.kh{margin-top:16px} details.kh>summary{padding:6px 0} .kh-tabela td{vertical-align:top} .kh-kiedy{white-space:nowrap;font-variant-numeric:tabular-nums} .kh-op{display:inline-block;margin-left:6px;padding:0 8px;border:1px solid var(--t-lin,#e2e6ec);border-radius:999px;font-size:11.5px;line-height:1.6;color:var(--t-mut,#5b6472);white-space:nowrap} .kh-usunieta .kh-op{border-color:var(--t-zle,#c0392b);color:var(--t-zle,#c0392b)} .kh-wyjsciowy .kh-op{border-style:dashed} .kh-zmiana{overflow-wrap:anywhere;white-space:normal} .kh-zmiany{margin:0;padding-left:16px} .kh-zmiany li{margin:0 0 3px} .kh-pole{color:var(--t-mut,#5b6472)} .kh-przed{color:var(--t-mut,#5b6472);text-decoration:line-through;text-decoration-color:rgba(155,163,175,.6)} .kh-po{font-weight:600} .kh-powod{margin-top:4px;font-size:13px;color:var(--t-ost,#7a5b00)} .kh-wiecej{margin:8px 0 0} /* ---- Polecenia dla skoroszytu (fala 2, krok 1, 26.09.2026) — nakładka „czeka na skoroszyt” na widokach grafiku, formularz admin/polecenie.php i strona admin/polecenia.php. Przerywana ramka = prośba, nie fakt ze skoroszytu. ---- */ .gw-pol{margin-top:6px;font-size:12.5px;line-height:1.45;color:var(--t-mut);overflow-wrap:anywhere} .gw-pol-stan{font-weight:700;color:var(--t-ost)} .gw-pol-nowe .gw-pol-stan,.gw-pol-pobrane .gw-pol-stan{color:var(--t-akc)} .gw-pol-odrzucone .gw-pol-stan,.gw-pol-niezgodne .gw-pol-stan{color:var(--t-zle)} .gw-pol-zmiana strong{color:var(--t-txt)} .gw-pol-link{display:inline-block;padding:6px 2px;color:var(--t-akc);font-weight:600;white-space:nowrap} .gw-wpis.pol-czeka,:where(main.pw) .grafik-termin.pol-czeka,.pol-sesja.pol-czeka{border-style:dashed;border-color:var(--t-akc)} .gw-pol-naglowek{margin-top:-6px} .pol-sesja{background:var(--t-sur);border:1px solid var(--t-lin);border-left:4px solid var(--t-akc);border-radius:14px;padding:12px 14px;margin:0 0 12px} .pol-sesja.status-odbyta{border-left-color:var(--t-ok)} .pol-sesja.status-odwolana{border-left-color:var(--t-mut)} .pol-sesja.status-nieobecnosc{border-left-color:var(--t-ost)} .pol-kiedy{display:flex;flex-wrap:wrap;gap:4px 12px;align-items:baseline;font-size:14px;color:var(--t-mut)} .pol-kiedy strong{color:var(--t-txt)} .pol-obecny{margin-top:8px;font-size:13px;color:var(--t-mut)} .pol-otwarte form{display:block;margin:8px 0 0} .pol-kto{font-size:12.5px} .pol-uwaga{margin:6px 0 0;font-size:13px} .pol-form{margin:0 0 14px} .pol-opcje{border:0;margin:0 0 6px;padding:0;display:grid;gap:8px} .pol-opcje legend{padding:0;margin:0 0 8px;font-size:13px;letter-spacing:.04em;text-transform:uppercase;color:var(--t-mut)} .pol-opcja{display:grid;grid-template-columns:auto 1fr;gap:2px 10px;align-items:center;min-height:56px;padding:10px 12px; background:var(--t-sur);border:1px solid var(--t-lin);border-radius:12px;cursor:pointer} .pol-opcja input{width:22px;height:22px;margin:0;accent-color:var(--t-akc);grid-row:span 2} .pol-opcja-nazwa{font-size:16px;font-weight:700;color:var(--t-txt)} .pol-opcja-skutek{font-size:12.5px;color:var(--t-mut)} .pol-opcja:has(input:checked){border-color:var(--t-akc);background:var(--t-akc-tlo)} .pol-form button[disabled]{opacity:.45;cursor:not-allowed} .pol-akcja{display:inline-block;margin:0 6px 6px 0} .pol-grupa{margin-bottom:6px} .gw-plak.pol-st-nowe,.gw-plak.pol-st-pobrane{border-color:var(--t-akc);color:var(--t-akc)} .gw-plak.pol-st-do_decyzji{border-color:var(--t-ost);color:var(--t-ost)} .gw-plak.pol-st-potwierdzone{border-color:var(--t-ok);color:var(--t-ok)} .gw-plak.pol-st-niezgodne,.gw-plak.pol-st-odrzucone,.gw-plak.pol-st-utracone{border-color:var(--t-zle);color:var(--t-zle)} /* ---- Pełny grafik z telefonu, dostawa 1 (04.10.2026): „Zmień…” (cel dotyku ≥ 48 px), „+ termin” w nagłówku dnia, „+” w kratce tygodnia, duchy (nowy termin, miejsce przesunięcia — przerywana ramka jak każda prośba), wybór czynności i pola formularzy przesunięcia, nowego terminu i usunięcia. Przełącznik „sesja klienta / przerwa” chowa pola przez :has() — bez niego widać oba zestawy, a serwer i tak bierze tylko ten, który wskazuje „rodzaj”. ---- */ .gw-pol-zmien{display:inline-flex;align-items:center;justify-content:center;min-height:48px;min-width:48px;margin-top:6px;padding:0 16px; border:1px solid var(--t-akc);border-radius:12px;font-size:14px;text-decoration:none} .gw-pol-zmien:hover{background:var(--t-akc);color:#0a0b0d} .gw-dodaj{display:inline-flex;align-items:center;min-height:44px;padding:0 14px;border:1px dashed var(--t-akc);border-radius:999px; color:var(--t-akc);font-size:13px;font-weight:700;letter-spacing:0;text-transform:none;text-decoration:none;white-space:nowrap} .gw-dodaj:hover{background:var(--t-akc);color:#0a0b0d} .grafik-plus{display:flex;align-items:center;justify-content:center;min-height:32px;margin-top:auto;border:1px dashed var(--t-lin); border-radius:8px;color:var(--t-mut);font-size:16px;font-weight:700;text-decoration:none} .grafik-plus:hover{border-color:var(--t-akc);color:var(--t-akc)} @media(max-width:900px){ .grafik-plus{min-height:44px} } .gw-duch{background:transparent;opacity:.92} .gw-wpis.gw-duch .gw-kto{color:var(--t-txt)} .gw-plak.pol-duch{border-style:dashed;border-color:var(--t-akc);color:var(--t-akc)} .pol-czynnosci{display:grid;gap:8px;margin:0 0 14px} a.pol-opcja{grid-template-columns:1fr;text-decoration:none;color:inherit} a.pol-opcja:hover{border-color:var(--t-akc);background:var(--t-akc-tlo)} .pol-pole{border:0;margin:0 0 14px;padding:0;display:grid;gap:8px} .pol-pole legend,.pol-przelacznik legend{padding:0;margin:0 0 8px;font-size:13px;letter-spacing:.04em;text-transform:uppercase;color:var(--t-mut)} .pol-skroty{display:flex;flex-wrap:wrap;gap:6px} .pol-skroty .tr-chip{min-height:44px;text-decoration:none} .pol-kafle{grid-template-columns:repeat(auto-fill,minmax(120px,1fr))} .pol-kafel{display:flex;align-items:center;gap:10px;min-height:48px;padding:0 12px;background:var(--t-sur);border:1px solid var(--t-lin); border-radius:12px;cursor:pointer;font-weight:700;color:var(--t-txt)} .pol-kafel input{width:20px;height:20px;margin:0;accent-color:var(--t-akc)} .pol-kafel:has(input:checked){border-color:var(--t-akc);background:var(--t-akc-tlo)} .pol-przelacznik{border:0;margin:0 0 14px;padding:0;display:grid;grid-template-columns:1fr 1fr;gap:6px} .pol-przelacznik legend{grid-column:1 / -1} .pol-przelacznik label{display:flex;align-items:center;justify-content:center;gap:8px;min-height:48px;border:1px solid var(--t-lin); border-radius:12px;background:var(--t-sur);font-weight:700;color:var(--t-txt);cursor:pointer} .pol-przelacznik label:has(input:checked){border-color:var(--t-akc);background:var(--t-akc-tlo)} .pol-przelacznik input{accent-color:var(--t-akc)} .pol-form:has(input[name="rodzaj"][value="przerwa"]:checked) .pol-tylko-klient{display:none} .pol-form:has(input[name="rodzaj"][value="klient"]:checked) .pol-tylko-przerwa{display:none} .pol-tylko-klient,.pol-tylko-przerwa{margin:0 0 14px} .pol-klienci{max-height:40vh} .pol-klienci [hidden]{display:none} .pol-wybrany{margin:0 0 8px;font-size:14px;color:var(--t-mut)} .pol-wybrany strong{color:var(--t-tekst,inherit)} .pol-wybrany[hidden]{display:none} .pol-form select.tr-pole,.pol-form input.tr-pole{margin:0} .pol-ostrzezenia ul{margin:6px 0;padding-left:18px} .pol-usun p{margin:0 0 10px;font-size:14px;color:var(--t-mut)} .pol-usun strong{color:var(--t-txt)} .pol-czeka-biurko{padding:10px 12px;border:1px dashed var(--t-ost);border-radius:12px} /* ---- Nowa osoba z telefonu (kontrakt v48, 05.10.2026): przełącznik „od razu klient (solo)” (jedno pole wyboru, cel pod kciuk), „+ nowa osoba” w nagłówku listy klientów i karta-duch na liście (przerywana ramka = prośba, nie osoba z lustra). ---- */ .pol-wlacznik{display:flex;align-items:center;gap:12px;min-height:56px;margin:0 0 10px;padding:10px 12px;background:var(--t-sur); border:1px solid var(--t-lin);border-radius:12px;cursor:pointer;color:var(--t-txt)} .pol-wlacznik:hover{border-color:var(--t-akc)} .pol-wlacznik input{flex:0 0 auto;width:22px;height:22px;margin:0;accent-color:var(--t-akc)} .pol-wlacznik span{display:flex;flex-direction:column;gap:2px;font-size:15px} .pol-wlacznik em{font-style:normal;font-size:12.5px;color:var(--t-mut)} .pol-wlacznik:has(input:checked){border-color:var(--t-akc);background:var(--t-akc-tlo)} .pw-naglowek{flex-wrap:wrap} .pw-akcje{display:flex;flex-wrap:wrap;gap:8px;justify-content:flex-end} .pw-akcje a.tr-btn{display:inline-flex;align-items:center;justify-content:center;text-decoration:none} .pw-akcje a.tr-btn-glowny:hover{background:#ff7d38;color:#0a0b0d} .pw-akcje a.tr-btn-obrys:hover{background:var(--t-akc-tlo)} a.pw-osoba.pw-duch{background:transparent;border-style:dashed;border-color:var(--t-akc)} a.pw-osoba.pw-duch:hover{background:var(--t-sur2)} a.pw-osoba.pw-duch-ok{border-color:var(--t-ok)} a.pw-osoba.pw-duch-zle{border-color:var(--t-zle)} .pw-duch .pw-osoba-nazwa{white-space:normal} .pw-duch .rw-inicjaly{background:transparent;border:1px dashed var(--t-akc);color:var(--t-akc)} /* Historia planu (fala R4c — 25.09.2026): wykonanie rozpiski, plan w wybranym dniu, flaga ruchu w dzienniku i „aktywna po terminie” na listach. Wszystko INFORMUJE: żaden stan nie jest czerwony, licznik podmian to liczba, nie alarm, a pozycja bez zapisu nie ma koloru (rozpiska to pula). Kolory tylko w klasach — nic w style="". */ details.kw{margin-top:16px} details.kw>summary{padding:6px 0} .kw-tabela td{vertical-align:top} .kw-usunieta td{opacity:.8} .kw-licznik{margin-top:6px;padding:6px 10px;border:1px solid var(--t-lin,#e2e6ec);border-radius:10px;font-size:13px;line-height:1.45} .kw-zmien{display:inline-flex;align-items:center;min-height:36px;margin-left:4px;font-weight:700;white-space:nowrap} .kw-daty{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:6px} .kw-daty li{display:flex;flex-wrap:wrap;align-items:baseline;gap:4px 10px;font-size:13px;line-height:1.5;overflow-wrap:anywhere} .kw-daty a{font-weight:700;font-variant-numeric:tabular-nums;min-width:38px} .kw-os{display:inline-flex;flex-wrap:wrap;align-items:baseline;gap:4px;min-width:0} .kw-daty .rw-tag{border-radius:10px} .kw-kto{color:var(--t-mut,#5b6472)} .kw-zamiast{overflow-wrap:anywhere} .kw-daty li.kw-grupa{display:block;margin-top:4px;padding-top:6px;border-top:1px dashed var(--t-lin,#e2e6ec);font-size:12px;color:var(--t-mut,#5b6472)} @media(min-width:701px){ .kw-tabela th:first-child{width:24%} .kw-tabela th:nth-child(2){width:26%} } .kd-form{display:flex;flex-wrap:wrap;align-items:flex-end;gap:8px;margin:8px 0 12px} .kd-naglowek{font-size:13.5px;color:var(--t-mut,#5b6472);margin:10px 0 8px;overflow-wrap:anywhere} .kd-naglowek strong{color:var(--t-txt,#16242f)} .kd-zmiany{margin-top:12px;font-size:13.5px;overflow-wrap:anywhere} .kd-zmiany ul{margin:4px 0 0;padding-left:18px} .kd-przypis{margin:6px 0 0;font-size:12.5px} .kh-ruch{margin-top:4px} .kh-ruch .rw-tag{border-radius:10px;white-space:normal;height:auto;min-height:22px} .kh-plan{display:inline-block;margin-top:4px;font-size:12.5px} .tag.kf-po-terminie{border-style:dashed;white-space:normal;border-radius:10px;margin-top:3px} /* ---- Cennik dla trenera (fala 1, krok 7, 26.09.2026) — admin/cennik.php: cena zawsze z dopiskiem „za osobę / za grupę” ---- */ .cn-cena{font-weight:800;font-size:16px;color:var(--t-txt);white-space:nowrap;font-variant-numeric:tabular-nums} .cn-za{display:inline-block;margin-left:4px;font-weight:500;font-size:13px;color:var(--t-mut);white-space:nowrap} .cn-nast{font-size:13px;color:var(--t-mut)} .cn-nast strong{color:var(--t-txt);font-variant-numeric:tabular-nums} .cn-brak{color:var(--t-mut);font-style:italic} .cn-kod{font-size:12.5px;color:var(--t-mut);overflow-wrap:anywhere} :where(main.pw) tr.cn-nieaktywna td{opacity:.6} .cn-zrodlo{margin:0 0 12px} .cn-czas{white-space:nowrap} /* ---- Archiwum sesji (krok 9 fali 1, dopisek Piotra 26.09.2026) — blok na karcie klienta i admin/sesje_archiwum.php. Tylko odczyt: żadnych przycisków zapisu; notatki trenera w całości, z podziałem linii. ---- */ .as-blok{margin-top:18px;padding-top:14px;border-top:1px dashed var(--t-lin)} .as-tytul{font-size:15px;font-weight:800;margin:0 0 10px} .as-tabela td{vertical-align:top} .as-tabela td.as-bez-zawijania{white-space:nowrap} /* Dopiski w komórce (rozpiska, druga osoba pary, „też w rejestrze”) — własna linia; na komputerze bez łamania w środku, żeby wąska kolumna nie cięła „rozpiska SA1” na trzy linie (przegląd 26.09). Na telefonie (karty) zawijają się normalnie. */ .as-tabela .as-dop{display:block;font-size:12.5px;line-height:1.4;margin-top:2px} @media(min-width:701px){.as-tabela .as-dop{white-space:nowrap}} .as-notatka{font-size:13.5px;line-height:1.45;overflow-wrap:anywhere} .as-notatka+.as-notatka{margin-top:4px} .as-etyk{color:var(--t-mut);font-size:12px;font-weight:600} .as-filtr{display:flex;flex-wrap:wrap;align-items:flex-end;gap:10px;margin:4px 0 12px} .as-filtr>div{display:flex;flex-direction:column;gap:4px;flex:1 1 160px;min-width:0} .as-filtr select,.as-filtr input{max-width:100%} .as-filtr>div.as-filtr-przyciski{flex:0 0 auto;flex-direction:row;gap:8px} .as-filtr a.tr-btn{display:inline-flex;align-items:center;justify-content:center;text-decoration:none;color:var(--t-txt)} .as-podsumowanie{margin:0 0 10px} .as-zrodla{margin-top:10px;font-size:12.5px} /* ---- Ograniczenia zdrowotne, opiekun i „korzysta z” na platformie (kontrakt v42, 27.09.2026) ---- Etykieta (pomarańczowa ramka tylko przy wpisie; nowe linie przez nl2br), podpis „zmienione DD.MM · kto”, plakietka „nie wiem” bez pomarańczu, „Zmień” w bloku Stan (przyciski pod kciuk ≥ 44 px, pole tekstu 16 px), karta przejęcia na stronie lustra. */ .kl-ogr-podpis,.ks-ogr-podpis{display:block;margin-top:6px;font-size:12px;opacity:.85;font-weight:500} .ks-ogr-podpis{color:var(--t-mut);margin:4px 0 0} .kl-ogr-podpis a,.ks-ogr-podpis a{color:inherit;text-decoration:underline} .rw-chip-niewiem{color:var(--t-mut);border-style:dashed;text-decoration:none} a.rw-chip-niewiem:hover{color:var(--t-txt)} .ks-ogr-brak{margin:0;color:var(--t-txt)} .ks-zmien{margin:8px 0 4px} .ks-zmien>summary{display:flex;align-items:center;min-height:44px;padding:0 2px} .ks-zmien-form{display:flex;flex-direction:column;gap:8px;margin-top:6px} .ks-zmien-form textarea,.ks-zmien-form select,.ks-zmien-form input:not([type=hidden]){width:100%;box-sizing:border-box;font-size:16px} .ks-ogr-przyciski{display:flex;flex-wrap:wrap;gap:8px} .ks-ogr-przyciski button{flex:1 1 180px} .ks-ogr-stany{display:flex;flex-direction:column;gap:4px} .ks-ogr-stan{display:flex;align-items:center;gap:8px;min-height:40px;padding:0 4px} .ks-wersja{margin:0;font-size:13px;font-weight:700;color:var(--t-ost)} .ks-crm-uwaga{margin:8px 0 0} .ks .tr-baner{margin:8px 0 0} .lp-przejecie dl{margin:0} .lp-przejecie .lp-liczby{display:grid;grid-template-columns:minmax(150px,max-content) 1fr;gap:6px 14px;margin:0 0 10px} .lp-przejecie .lp-liczby dt{color:var(--t-mut);font-size:13px} .lp-przejecie .lp-liczby dd{margin:0;overflow-wrap:anywhere} .lp-przejecie form button{width:100%;max-width:420px} .lp-komorka-linie{white-space:pre-line} @media(max-width:560px){ .lp-przejecie .lp-liczby{grid-template-columns:1fr;gap:2px 0} .lp-przejecie .lp-liczby dd{margin-bottom:8px} } body.ekran-trening .okno-podpis{color:var(--t-mut)} /* v75 (ZP5): przeciwwskazania i zalecenia w podglądzie osoby — słowo w etykiecie i jasna czerwień (kontrast na ciemnym tle) */ body.ekran-trening .okno-wiersz.okno-przeciw .okno-wart,body.ekran-trening .okno-wiersz.okno-przeciw .okno-etyk{color:#ff8a8d} body.ekran-trening .okno-zp-do{color:var(--t-mut)} body.ekran-trening .okno-wiersz.okno-nie-wiem .okno-wart{color:#c9ced6} /* ---- Konfiguracje w układzie Rejestru (03.10.2026, prośba Piotra: „popraw panel konfiguracje zgodnie z layoutem rejestru”). Lista rozpisek stoi na klasach Rejestru (.tr-glowa, .rw-filtr, .rw-klient, .rw-sesja, .rw-data, .rw-chip, .rw-akcje); tu tylko to, czego Rejestr nie ma: szerokość kolumny Rejestru na samej liście, plakietki statusu, ważność z rozpiska_waznosc_html() jako chip (bez czerwieni — R4c), podgląd ćwiczeń w rozwiniętej karcie, formularze dodawania i edycji w kartach oraz nagłówek widoku rozpiski. Strona zostaje w main.pw (widok rozpiski stoi na tej warstwie). ---- */ main.pw:has(> .kf-lista-strona.kf-waska){max-width:760px} /* sama lista = kolumna Rejestru; bez :has — szerzej, nic nie pęka */ .kf-opis{font-weight:500;color:var(--t-mut)} .rw-chip-ok{color:var(--t-ok);border-color:rgba(52,211,153,.45)} .rw-chip.kf-szkic{border-style:dashed;color:var(--t-txt)} .kf-archiwalna .rw-skrot,.kf-archiwalna .rw-dd{color:var(--t-mut)} .kf-waznosc{display:contents} .kf-waznosc>.tag,.kf-waznosc>.muted{white-space:nowrap} /* reszta wyglądu = .rw-chip (ten sam selektor wyżej) */ .kf-waznosc>.tag:first-child::before{content:"do\00a0"} .kf-waznosc>.tag.kf-po-terminie{border-style:dashed;border-radius:999px;margin:0} /* karta klienta daje tej plakietce ramkę 10 px (.tag.kf-po-terminie wyżej) — w liście chip */ .kf-podglad{border-top:1px solid var(--t-lin)} .kf-podglad .rej-cwiczenia{margin-top:0} .kf-pusta{display:block;margin:0;padding:12px} .kf-uwagi{margin:0;padding:0 12px 10px;overflow-wrap:anywhere} .kf-plik{overflow-wrap:anywhere} /* długi link ze starego pola „Plik” łamie się w karcie, nie ucina */ .kf-status-form{display:inline-flex;margin:0} .kf-status{display:inline-flex;align-items:center;gap:6px;margin:0;color:var(--t-mut);font-size:13px;font-weight:600} .kf-status .tr-pole{width:auto;min-height:36px;padding:0 10px} /* 16 px z .tr-pole — mniej = powiększanie strony na iPhonie */ .rw-siatka>.rw-cala{grid-column:1 / -1} .kf-form .rw-filtr-akcje{flex-wrap:wrap} .kf-karta-tytul{display:block;margin:2px 0 12px;font-size:20px;font-weight:800;line-height:1.2;color:var(--t-txt);letter-spacing:-.01em} .kf-dodaj:not([open]){display:none} /* zwinięty formularz otwiera „+ Nowa rozpiska” albo kotwica #dodaj */ .kf-dodaj>summary{display:flex;justify-content:space-between;align-items:center;gap:10px;list-style:none;cursor:pointer} .kf-dodaj>summary::-webkit-details-marker{display:none} .kf-dodaj>summary .kf-karta-tytul{margin:0} .kf-dodaj>summary:focus-visible{outline:2px solid var(--t-akc);outline-offset:4px;border-radius:8px} /* fokus po otwarciu (dostępność) */ .kf-zwin{flex:0 0 auto;display:inline-flex;align-items:center;min-height:36px;font-size:13px;font-weight:600;color:var(--t-mut)} .kf-blok{background:var(--t-sur2);border:1px solid var(--t-lin);border-radius:14px;padding:12px;margin-top:10px} .kf-blok .kf-szukaj-osoby{margin:4px 0 6px} .kf-blok .kf-osoby{height:auto;min-height:0;padding:6px} .kf-licznik{margin:4px 0 0;font-size:12px} .kf-blok-usun{margin:10px 0 0;font-size:13px} .kf-blok-usun a{color:var(--t-mut)} .kf-naglowek{margin:0 0 10px} .kf-naglowek .tr-tytul{margin-bottom:4px} .kf-naglowek .tr-meta{margin-top:0} .kf-wroc{display:inline-flex;align-items:center;min-height:32px;margin-bottom:4px;font-size:13px;font-weight:600;color:var(--t-mut);text-decoration:none} .kf-wroc:hover{color:var(--t-txt)} @media(max-width:520px){ .kf-karta-tytul{font-size:18px} } /* ==== PRZECIWWSKAZANIA I ZALECENIA (dostawa 7b, kontrakt v75; ZP1–ZP10, UX_zalecenia_przeciwwskazania; makiety rząd 10 kanwy) ==== Nagłówek treningu: dwie ramki — słowo nad listą („Przeciwwskazania”, „Zalecenia”) niesie znaczenie, czerwień i zieleń je tylko wzmacniają (WCAG 1.4.1); wpis to przycisk 52 px (treść 3 linie, pełna w arkuszu); „+” 44 px w rogu ramki; po 3 wpisy i „jeszcze N”. Arkusz wpisu i „Zakończ trening” to klocek .kk-arkusz otwierany klasą .otwarty (skrypt ekranu, nie kotwica). Karta klienta: pasek .kk-zp w nagłówku na każdej zakładce, wiersz .zp-wpis w zakładce Zdrowie. Termin: krótka lista .zp-lista. ============================================================================ */ .tr-zp{display:flex;flex-direction:column;gap:8px;margin-top:10px} .tr-zp-ramka{border:1px solid rgba(229,72,77,.55);background:rgba(229,72,77,.08);border-radius:14px;padding:2px 10px 4px} .tr-zp-zalecenie{border-color:rgba(52,211,153,.45);background:rgba(52,211,153,.06)} .tr-zp-gora{display:flex;justify-content:space-between;align-items:center;min-height:44px;gap:8px} .tr-zp-tytul{margin:0!important;font-size:12.5px!important;letter-spacing:.06em;text-transform:uppercase;font-weight:700!important;color:#ff8a8d!important} .tr-zp-zalecenie .tr-zp-tytul{color:#6ee7b7!important} .tr-zp-plus{flex:0 0 44px;width:44px;height:44px;min-height:44px;padding:0;border-radius:10px;border:1px solid rgba(229,72,77,.55);background:transparent; color:#ff8a8d;font-size:20px;line-height:1;cursor:pointer} .tr-zp-plus:hover{background:rgba(229,72,77,.15);border-color:rgba(229,72,77,.8)} .tr-zp-zalecenie .tr-zp-plus{border-color:rgba(52,211,153,.45);color:#6ee7b7} .tr-zp-zalecenie .tr-zp-plus:hover{background:rgba(52,211,153,.12);border-color:rgba(52,211,153,.7)} .tr-zp-wpis{width:100%;min-height:52px;display:grid;grid-template-columns:minmax(0,1fr) auto;gap:8px;align-items:center;margin:0;padding:6px 0;border:0;border-radius:0; border-top:1px solid rgba(229,72,77,.25);background:transparent;color:var(--t-txt);font:inherit;font-size:14.5px;text-align:left;cursor:pointer} .tr-zp-wpis:hover{background:transparent;color:var(--t-txt)} .tr-zp-zalecenie .tr-zp-wpis{border-top-color:rgba(52,211,153,.2)} .tr-zp-tekst{min-width:0;display:flex;flex-direction:column;gap:1px} .tr-zp-tresc{font-weight:700;line-height:1.3;overflow-wrap:anywhere;display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:3;line-clamp:3;overflow:hidden} .tr-zp-podpis{color:#c9a3a5;font-size:12.5px;font-weight:400} .tr-zp-zalecenie .tr-zp-podpis{color:#9fc9b7} .tr-zp-do{font-size:12.5px;padding:3px 8px;border-radius:999px;white-space:nowrap;border:1px solid #3a404b;color:#c9ced6} .tr-zp-do.data{border-color:rgba(251,191,36,.55);color:#fbbf24} .tr-zp-wiecej{display:inline-flex;align-items:center;min-height:44px;margin:0;padding:0 2px;border:0;background:transparent;color:#ff8a47;font:inherit;font-size:14px;font-weight:600;cursor:pointer} .tr-zp-wiecej:hover{background:transparent;text-decoration:underline} .tr-zp-pusto{margin:0 0 8px;font-size:13.5px;line-height:1.35;color:var(--t-mut)} .tr-zp-pusto.nie-wiem{color:#c9ced6} .tr-zp-uwaga{margin:0;font-size:13px;color:var(--t-mut)} .tr-zp-uwaga.ost{color:var(--t-ost)} /* arkusz (wpis, nowy wpis, „Zakończ trening”) — ten sam klocek co na karcie, otwierany klasą */ .kk-arkusz.otwarty{display:flex;flex-direction:column;justify-content:flex-end} .tr-zp-ark-gora{display:flex;justify-content:space-between;align-items:baseline;gap:8px} .tr-zp-zamknij{min-height:44px;padding:0 6px;border:0;background:transparent;color:var(--t-mut);font:inherit;font-size:14px;cursor:pointer} .tr-zp-zamknij:hover{background:transparent;color:var(--t-txt)} .tr-zp-pola{display:flex;flex-direction:column;gap:6px} .tr-zp-pole{display:flex;flex-direction:column;gap:6px;margin-top:4px} .tr-zp-czas{display:flex;flex-direction:column;gap:4px} .tr-zp-skutek{margin:2px 0 0;font-size:12.5px;color:var(--t-mut)} .tr-zp-blad:empty{display:none} .tr-zp-szczegoly{margin:0;display:flex;flex-direction:column} .tr-zp-szcz{display:flex;justify-content:space-between;gap:12px;padding:6px 0;border-top:1px solid var(--t-lin);font-size:14px} .tr-zp-szcz dt{color:var(--t-mut);flex:0 0 auto} .tr-zp-szcz dd{margin:0;text-align:right;overflow-wrap:anywhere;white-space:pre-line} .tr-zp-akcje{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px;margin-top:4px} .tr-zp-akcje .tr-btn{min-height:48px} .tr-zp-czynnosc{display:flex;flex-direction:column;gap:6px} .tr-zp-rozpisz-uwaga{margin:0;padding:10px 12px;border-radius:12px;border:1px solid rgba(251,191,36,.5);background:rgba(251,191,36,.08);color:var(--t-ost);font-size:13.5px;line-height:1.4} a.tr-btn.tr-btn-pelny{display:flex;align-items:center;justify-content:center;text-decoration:none} .tr-zp-podsum{display:grid;grid-template-columns:repeat(auto-fit,minmax(90px,1fr));gap:8px} .tr-zp-kafel{display:flex;flex-direction:column;padding:8px 10px;border-radius:12px;background:var(--t-bg);border:1px solid var(--t-lin)} .tr-zp-kafel strong{font-size:18px} .tr-zp-kafel.ost strong{color:var(--t-ost)} .tr-zp-kafel-etyk{font-size:12px;color:var(--t-mut)} .tr-zp-blok{display:flex;flex-direction:column;gap:8px;padding:10px 12px;border:1px solid var(--t-lin);border-radius:14px} .tr-zp-blok-gora{display:flex;justify-content:space-between;align-items:baseline;gap:8px;flex-wrap:wrap} .tr-zp-blok-pod{font-size:12.5px;color:var(--t-mut)} .tr-zp-lista{display:flex;flex-direction:column} .tr-zp-poz{display:grid;grid-template-columns:auto minmax(0,1fr) auto;gap:8px;align-items:center;min-height:48px;border-top:1px solid var(--t-lin)} .tr-zp-pil{font-size:12px;padding:3px 8px;border-radius:999px;border:1px solid rgba(229,72,77,.55);color:#ff8a8d;white-space:nowrap} .tr-zp-pil-zalecenie{border-color:rgba(52,211,153,.5);color:#6ee7b7} .tr-zp-usun{min-width:44px;min-height:44px;padding:0;border:0;background:transparent;color:var(--t-mut);font-size:20px;cursor:pointer} .tr-zp-usun:hover{background:transparent;color:var(--t-zle)} .tr-zp-plusy{display:grid;grid-template-columns:1fr 1fr;gap:8px} .tr-zp-nowy{min-height:46px} .tr-zp-nowy-przeciwwskazanie{border-color:rgba(229,72,77,.55);color:#ff8a8d} .tr-zp-nowy-zalecenie{border-color:rgba(52,211,153,.5);color:#6ee7b7} .tr-zp-nowy-przeciwwskazanie:hover{background:rgba(229,72,77,.12);border-color:rgba(229,72,77,.8);color:#ff8a8d} .tr-zp-nowy-zalecenie:hover{background:rgba(52,211,153,.1);border-color:rgba(52,211,153,.7);color:#6ee7b7} /* karta klienta: pasek w nagłówku na każdej zakładce (ZP5) — zwykły odnośnik do zakładki Zdrowie */ .kk-zp{display:block;margin-top:8px;padding:8px 12px;min-height:44px;box-sizing:border-box;border-radius:10px;border:1px solid var(--t-lin);color:#c9ced6!important; font-size:13.5px;line-height:1.35;text-decoration:none;overflow-wrap:anywhere} .kk-zp-sa{border-color:rgba(229,72,77,.55);background:rgba(229,72,77,.08);color:#ff8a8d!important} .kk-zp-nie_wiem{border-style:dashed} .kk-zp:hover{border-color:var(--t-akc)} /* karta klienta, zakładka Zdrowie: wiersz wpisu z rodzajem słowem (nie samym kolorem), treścią, podpisem i ważnością */ .zp-wpis{display:grid;grid-template-columns:auto minmax(0,1fr) auto;gap:8px;align-items:center;min-height:56px;box-sizing:border-box;padding:4px 0;border-top:1px solid #1e222a; color:var(--t-txt)!important;text-decoration:none} a.zp-wpis:hover .zp-wpis-tresc{text-decoration:underline} .zp-wpis-rodzaj{font-size:11.5px;padding:3px 8px;border-radius:999px;border:1px solid rgba(229,72,77,.55);color:#ff8a8d;white-space:nowrap} .zp-wpis-zalecenie .zp-wpis-rodzaj{border-color:rgba(52,211,153,.5);color:#6ee7b7} .zp-wpis-tekst{min-width:0;display:flex;flex-direction:column;gap:1px} .zp-wpis-tresc{font-weight:700;line-height:1.3;overflow-wrap:anywhere;white-space:pre-line} .zp-wpis-pod{color:var(--t-mut);font-size:12.5px} .zp-wpis-do{font-size:12.5px;white-space:nowrap;color:var(--t-mut)} .zp-wpis-do.data{color:#fbbf24} .zp-wpis.koniec{color:var(--t-mut)!important} .zp-wpis.koniec .zp-wpis-tresc{font-weight:400;text-decoration:line-through;text-decoration-color:#5f6672} .zp-stan{margin:6px 0 2px;font-size:14px;color:var(--t-mut)} .zp-stan-nie_wiem{color:#c9ced6} .zp-sprawdzone{margin:4px 0 0} .zp-rozpisz-wiersz{display:flex;flex-direction:column;gap:6px;padding:10px 0;border-top:1px solid var(--t-lin)} .zp-stary{margin:0;padding:10px 12px;border-radius:12px;border:1px solid var(--t-lin);background:var(--t-bg);color:#c9ced6;font-size:13.5px;line-height:1.4;white-space:pre-line;overflow-wrap:anywhere} .zp-czas .zp-do{display:none} .zp-czas:has(input[value="data"]:checked) .zp-do,.zp-czas .zp-do.blad{display:block} .tr-zp-akcje form{display:contents} .zp-usun{align-self:flex-start;margin-top:4px} /* termin (strona i arkusz): krótka lista ważnych dziś — słowo rodzaju nad listą */ .zp-lista{margin:6px 0 0} .zp-lista-tytul{display:block;font-size:12px;letter-spacing:.06em;text-transform:uppercase;font-weight:700;color:#ff8a8d} .zp-zalecenie .zp-lista-tytul{color:#6ee7b7} .zp-lista ul{margin:2px 0 0;padding:0 0 0 18px} .zp-lista li{margin:2px 0;font-size:14px;line-height:1.35;overflow-wrap:anywhere} .zp-lista-do{color:var(--t-mut);font-size:12.5px;white-space:nowrap} .zp-lista-stan{margin:6px 0 0;font-size:13.5px;color:var(--t-mut)} .zp-lista-stan.zp-stan-nie_wiem{color:#c9ced6} .zp-termin{margin:4px 0 8px} .kk-arkusz-panel .zp-termin{padding:6px 10px 8px;border:1px solid var(--t-lin);border-radius:12px} @media(min-width:901px){ .kk-arkusz.otwarty{justify-content:flex-start;align-items:flex-end} } /* „Ostatnio” przy wierszu serii (krok F) — pod wierszem, w linii pól (jak .tr-seria-cechy), wygaszone: to historia, nie plan. */ .tr-seria-ost{margin:-2px 0 8px 40px;font-size:12.5px;color:var(--t-mut);overflow-wrap:anywhere} /* Sprzedaż z telefonu (dostawa S): przełączniki ceny, wpłaty i kwoty pokazują tylko potrzebne pole; bez kwot ze skoroszytu. */ .pol-przelacznik.sp-trzy{grid-template-columns:repeat(3,1fr)} .sp-form:has(input[name="cena_tryb"][value="skoroszyt"]:checked) .sp-tylko-reczna{display:none} .sp-form:has(input[name="cena_tryb"][value="reczna"]:checked) .sp-tylko-skoroszyt{display:none} .sp-form:has(input[name="wplata_tryb"]:not([value="kwota"]):checked) .sp-tylko-czesc{display:none} .sp-form:has(input[name="wplata_tryb"][value="nie"]:checked) .sp-tylko-wplata{display:none} .sp-form:has(input[name="kwota_tryb"][value="calosc"]:checked) .sp-tylko-kwota{display:none} .sp-tylko-reczna,.sp-tylko-czesc,.sp-tylko-kwota,.sp-tylko-wplata{margin:0 0 14px} .sp-rodzaje{margin:0 0 14px} .sp-czeka{margin:0 0 16px} .gw-plak.bez-karnetu{border-color:var(--t-ost);color:var(--t-ost)} a.gw-plak.bez-karnetu{display:inline-flex;align-items:center;min-height:44px;padding:0 14px;font-weight:700;text-decoration:none} /* cel dotyku jak „Zmień…” */ a.gw-plak.bez-karnetu:hover{background:var(--t-ost-tlo)} .tr-chip.sp-wplata{min-height:44px;text-decoration:none;margin-left:6px} .pol-uwaga.sp-tylko-skoroszyt{margin:6px 0 14px} .sp-akcje{display:flex;flex-wrap:wrap;gap:6px;margin:8px 0} .sp-akcje .tr-chip,.kk .tr-baner .tr-chip{min-height:44px;text-decoration:none} /* v63: chipy pod kciuk (Spójność, banery karty); czynności Pulpitu od v69 — .pu-czynnosc */ /* ==== KARTA KLIENTA W ZAKŁADKACH (dostawa 2 „karta klienta i osoba”, kontrakt v67; Piotr 17.10: KK1–KK8, UX_karta_klienta) ==== Telefon najpierw: nagłówek z jedną linią ograniczeń na każdej zakładce, pasek zakładek przewijany w bok (cele 44 px), treść tylko otwartej zakładki, przybornik — wiszący przycisk z główną akcją i „⋯” nad paskiem dolnym; na komputerze (≥901 px) ten sam HTML jako pasek narzędzi w rzędzie zakładek, a bloki zakładki w siatce. Zero rozwijaczy: formularze to arkusze `.kk-arkusz` z własnym adresem (#arkusz-…), otwierane samym CSS (:target) — od dołu (1–3 pola) albo na pełnym ekranie (`.kk-pelny`, pasek akcji zamiast paska dolnego). Kolory tylko ze zmiennych --t-*; czerwień tylko dla błędu i usuwania. „Przybornik” karty ≠ szuflada nawigacji (#przybornik). */ main.pw.kk{padding-bottom:calc(120px + var(--t-dol))} .kk-wroc{margin:0 0 6px} .kk-wroc a{display:inline-flex;align-items:center;min-height:44px;text-decoration:none} .kk-glowa{padding:0;margin:0 0 4px;background:transparent;border:0} .kk-glowa-rzad{display:flex;gap:12px;align-items:center} .kk-glowa .rw-inicjaly{flex:0 0 44px;height:44px;font-size:16px} .kk-glowa-tekst{flex:1;min-width:0} .kk-nazwa{margin:0;font-size:21px;font-weight:800;line-height:1.15;color:var(--t-txt);letter-spacing:-.01em;overflow-wrap:anywhere} .kk-glowa .rw-chipy{margin-top:4px} .rw-chip.kk-status-aktywny{color:var(--t-ok);border-color:rgba(52,211,153,.45)} .rw-chip.kk-status-pauza,.rw-chip.kk-chip-ost{color:var(--t-ost);border-color:#6b4a14} .rw-chip.kk-status-zakonczony,.rw-chip.kk-kod{color:var(--t-mut)} .kk-zadzwon{flex:0 0 44px;width:44px;height:44px;border-radius:12px;border:1px solid var(--t-lin);background:var(--t-sur);color:var(--t-txt)!important;display:flex;align-items:center;justify-content:center} .kk-zadzwon:hover{border-color:var(--t-akc)} .kk-zakladki-rzad{position:sticky;top:0;z-index:30;margin:8px -16px 12px;padding:0 4px;background:var(--t-bg);border-bottom:1px solid var(--t-lin)} .kk-zakladki{display:flex;gap:2px;overflow-x:auto;scrollbar-width:none;-webkit-overflow-scrolling:touch} .kk-zakladki::-webkit-scrollbar{display:none} .kk-zakladka{flex:0 0 auto;display:inline-flex;align-items:center;min-height:44px;padding:0 12px;font-size:15px;color:var(--t-mut)!important;text-decoration:none;white-space:nowrap} .kk-zakladka[aria-selected="true"]{color:var(--t-txt)!important;font-weight:700;box-shadow:inset 0 -3px 0 var(--t-akc)} .kk-zakladka:hover{color:var(--t-txt)!important} .kk-zakladka:focus-visible,.kk-zp:focus-visible,.kk-wiersz-link:focus-visible{outline:2px solid var(--t-akc);outline-offset:-2px} .kk-mini{display:none;align-items:center;gap:8px;padding:2px 12px 0} main.kk-zwiniety .kk-mini{display:flex} .kk-mini-nazwa{flex:1;min-width:0;font-weight:700;color:var(--t-txt);white-space:nowrap;overflow:hidden;text-overflow:ellipsis} .kk-zp-znak{display:inline-flex;align-items:center;min-height:44px;padding:0 12px;border-radius:999px;border:1px solid rgba(229,72,77,.55);background:rgba(229,72,77,.08);color:#ff8a8d!important;font-size:13px;font-weight:700;text-decoration:none} .kk-panel{display:flex;flex-direction:column;gap:12px} .kk-panel:focus{outline:none} .kk-blok{background:var(--t-sur);border:1px solid var(--t-lin);border-radius:14px;padding:10px 14px 4px} .kk-blok-tytul{margin:0 0 4px!important;font-size:13px!important;font-weight:600!important;letter-spacing:.05em;text-transform:uppercase;color:var(--t-mut)!important} .kk-wiersz{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:10px;align-items:center;min-height:52px;box-sizing:border-box;padding:4px 0;border-top:1px solid var(--t-sur2);color:var(--t-txt)} .kk-blok-tytul+.kk-wiersz,.kk-blok-tytul+div>.kk-wiersz:first-child{border-top:0} a.kk-wiersz-link{text-decoration:none;color:var(--t-txt)!important} a.kk-wiersz-link:hover,a.kk-wiersz-tekst:hover{background:rgba(255,255,255,.025)} .kk-wiersz-tekst{display:flex;flex-direction:column;justify-content:center;min-width:0;min-height:44px} a.kk-wiersz-tekst{text-decoration:none;color:var(--t-txt)!important} .kk-wiersz-opis{font-weight:600;overflow-wrap:anywhere} .kk-wiersz-pod{color:var(--t-mut);font-size:13px;overflow-wrap:anywhere} .kk-wiersz-wart{font-size:14px;font-variant-numeric:tabular-nums;color:#c9ced6;text-align:right} a.kk-wiersz-link .kk-wiersz-wart::after,a.kk-wiersz-link:not(:has(.kk-wiersz-wart))::after{content:"›";margin-left:8px;color:var(--t-mut)} .kk-wiersz .gw-pol{grid-column:1 / -1} .kk-wiersz.karnet-zamkniety{opacity:.55} .kk-praca-wiersz{display:block;margin-top:2px} .kk-praca{display:inline-flex;align-items:center;min-height:44px;padding:0 4px} .kk-stopka{display:flex;align-items:center;min-height:44px;border-top:1px solid var(--t-sur2);font-size:14px;text-decoration:none} .kk-stopka.kk-stopka-zle{border:0;color:var(--t-zle)!important;padding:0 2px} .kk-kafle{display:flex;gap:8px;overflow-x:auto;padding-bottom:2px;scrollbar-width:none} .kk-kafle::-webkit-scrollbar{display:none} .kk-kafel{flex:0 0 auto;display:flex;flex-direction:column;min-width:112px;padding:10px 12px;border-radius:14px;background:var(--t-sur);border:1px solid var(--t-lin);color:var(--t-txt)!important;text-decoration:none} a.kk-kafel:hover{border-color:var(--t-akc)} .kk-kafel-etyk{font-size:11.5px;letter-spacing:.05em;text-transform:uppercase;color:var(--t-mut)} .kk-kafel-wart{font-size:19px;font-weight:800;font-variant-numeric:tabular-nums;margin-top:2px} .kk-kafel-pod{font-size:12px;color:var(--t-mut)} .kk-dl{margin:0;padding:0 0 8px} .kk-dl dt{margin:8px 0 0;font-size:13px;color:var(--t-mut)} .kk-dl dd{margin:2px 0 0;font-size:14px;color:var(--t-txt);overflow-wrap:anywhere} .kk-dl.kk-dl-liczby{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:0 12px} .kk-dl.kk-dl-liczby dt,.kk-dl.kk-dl-liczby dd{margin:0;padding:7px 0;border-top:1px solid var(--t-sur2)} .kk-dl.kk-dl-liczby dd{text-align:right;font-variant-numeric:tabular-nums} .kk-lista{list-style:none;margin:0;padding:0} .kk-lista li{padding:8px 0;border-top:1px solid var(--t-sur2);font-size:14px} .kk-lista li:first-child{border-top:0} .kk-data{color:var(--t-mut);font-size:13px;margin-right:6px} .kk-zapisano{display:flex;flex-wrap:wrap;align-items:center;gap:8px;margin:0 0 12px;padding:8px 12px;border-radius:12px;border:1px solid rgba(52,211,153,.45);background:rgba(52,211,153,.08);color:var(--t-ok);font-size:14px} .kk-zapisano.ost{border-color:#6b4a14;background:var(--t-ost-tlo);color:var(--t-ost)} .kk-zapisano.zle{border-color:var(--t-zle);background:var(--t-zle-tlo);color:var(--t-zle)} .kk-zapisano>span{flex:1 1 auto} .kk-zapisano .tr-chip{min-height:44px;text-decoration:none} .kk-cofnij{margin:0} :where(main.pw) button.kk-cofnij-btn{min-height:44px;padding:0 14px;border-radius:999px;border:1px solid currentColor;background:transparent;color:inherit;font-weight:700} :where(main.pw) button.kk-cofnij-btn:hover{background:rgba(255,255,255,.06)} :where(main.pw) button.kk-usun{min-height:44px;padding:0 10px;border:0;background:none;color:var(--t-zle);font-weight:600} :where(main.pw) button.kk-usun:hover{background:var(--t-zle-tlo)} .kk-tel{display:inline-flex;align-items:center;min-height:44px} /* v64 (N10), od v67 na zakładce Dane: numer pod kciuk, jak „Zadzwoń” */ /* przybornik: telefon — wiszący przycisk z główną akcją i „⋯” nad paskiem dolnym (z-index pod szufladą 190) */ .kk-pasek{position:fixed;right:16px;bottom:calc(var(--t-dol) + 16px);z-index:185;display:flex;gap:8px;align-items:center} .kk-pasek .tr-btn{min-height:52px;border-radius:16px;box-shadow:0 6px 18px rgba(0,0,0,.5);text-decoration:none;white-space:nowrap} .kk-pasek .kk-glowna{padding:0 18px;font-weight:800} .kk-pasek .kk-wiecej{width:52px;padding:0;border-color:var(--t-akc);color:#ff8a47!important;font-size:22px;line-height:1;background:var(--t-sur)} .kk-pasek .kk-wiecej:hover{background:var(--t-sur2)} .kk-pasek a.tr-btn{display:inline-flex;align-items:center;justify-content:center} .kk-pasek a.kk-pasek-akcja{display:none} /* telefon: tylko główna akcja i „⋯” — reszta w arkuszu */ /* arkusz od dołu i pełny ekran: element z adresem #arkusz-…, widoczny tylko jako cel kotwicy (bez JS działa tak samo) */ .kk-arkusz{display:none;position:fixed;inset:0;z-index:198} .kk-arkusz:target{display:flex;flex-direction:column;justify-content:flex-end} html.kk-arkusz-otwarty,html:has(.kk-arkusz:target){overflow:hidden} .kk-arkusz-tlo{position:absolute;inset:0;background:rgba(0,0,0,.6)} .kk-arkusz-panel{position:relative;box-sizing:border-box;width:100%;max-height:88vh;overflow-y:auto;padding:10px 16px calc(16px + env(safe-area-inset-bottom, 0px)); background:var(--t-sur);border-top:1px solid var(--t-lin);border-radius:20px 20px 0 0;display:flex;flex-direction:column;gap:8px;color:var(--t-txt)} .kk-arkusz-panel:focus{outline:none} .kk-arkusz-uchwyt{width:40px;height:4px;border-radius:4px;background:#3a3f48;align-self:center;margin-bottom:2px} .kk-arkusz-tytul{margin:0!important;font-size:18px!important;font-weight:800!important;color:var(--t-txt)!important} .kk-arkusz-pod{margin:2px 0 0;color:var(--t-mut);font-size:13px} .kk-arkusz-etyk{margin:6px 0 0;font-size:12px;letter-spacing:.06em;text-transform:uppercase;color:var(--t-mut)} .kk-ukryte{position:absolute!important;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap} .kk-akcja{display:flex;flex-direction:column;justify-content:center;gap:1px;min-height:56px;box-sizing:border-box;padding:6px 12px;border-radius:12px;border:1px solid var(--t-lin); background:var(--t-bg);color:var(--t-txt)!important;text-decoration:none} .kk-akcja:hover,.kk-akcja-karty:hover{border-color:var(--t-akc)} .kk-akcja-nazwa{font-weight:700;font-size:15px} .kk-akcja-opis{font-size:12.5px;color:var(--t-mut)} .kk-akcje-karty{display:grid;grid-template-columns:repeat(auto-fit,minmax(70px,1fr));gap:6px} .kk-akcja-karty{display:flex;align-items:center;justify-content:center;text-align:center;min-height:56px;padding:0 6px;border-radius:12px;border:1px solid var(--t-lin);background:var(--t-bg); color:var(--t-txt)!important;font-size:13px;text-decoration:none} .kk-zamknij{margin-top:6px;width:100%;color:var(--t-mut)!important;background:transparent} .kk-pelny .kk-arkusz-panel{max-height:none;height:100%;border-radius:0;border:0;padding-top:0} .kk-pelny-glowa{position:sticky;top:0;z-index:2;margin:0 -16px;padding:4px 16px 10px;background:var(--t-sur);border-bottom:1px solid var(--t-lin)} .kk-wstecz{display:inline-flex;align-items:center;min-height:44px;text-decoration:none} .kk-pelny .kk-forma-akcje{position:sticky;bottom:0;margin:12px -16px 0;padding:10px 16px calc(10px + env(safe-area-inset-bottom, 0px));background:var(--t-sur);border-top:1px solid var(--t-lin)} /* pola wzorca G: etykieta nad polem (14 px), pole 48 px / 16 px (.tr-pole), błąd jednym zdaniem pod polem */ .kk-forma{display:flex;flex-direction:column;gap:2px;margin:0} .kk-pole{margin:8px 0 0} .kk-pole-opis{display:block;margin:0 0 4px;font-size:14px!important;color:var(--t-mut)!important} .kk-pole-pod{margin:4px 0 0;font-size:13px;color:var(--t-mut)} .kk-pole.blad .tr-pole{border-color:var(--t-zle)} .kk-blad{margin:6px 0 0;font-size:14px;color:var(--t-zle)} .kk-blad-skrot{margin:4px 0 0;font-size:14px;color:var(--t-zle)} .kk-siatka2{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:0 10px} .kk-forma-akcje{display:flex;gap:8px;margin-top:12px} .kk-forma-akcje .tr-btn{flex:1 1 auto} .kk-forma-akcje a.tr-btn{display:inline-flex;align-items:center;justify-content:center;text-decoration:none} .kk-forma .pol-opcje{margin-top:4px} .kk-forma textarea.tr-pole{min-height:96px} .kk-akcja-brak{margin:4px 0} .postepy-k-reszta{flex-basis:100%;margin:4px 0 0;font-size:13px} @media(min-width:901px){ .kk-nazwa{font-size:26px} .kk-glowa .rw-inicjaly{flex-basis:56px;height:56px;font-size:19px} .kk-zakladki-rzad{display:flex;flex-wrap:wrap;justify-content:space-between;align-items:flex-end;gap:8px 12px;margin:12px 0 14px;padding:0;top:var(--belka-wys, 56px)} .kk-mini{flex-basis:100%;padding:4px 0 0} .kk-zakladki{flex-wrap:wrap;overflow:visible} /* komputer: przybornik jako pasek narzędzi w rzędzie zakładek — wszystkie akcje zakładki widać, „⋯” zostaje dla akcji karty */ .kk-pasek{position:static;padding-bottom:6px;flex-wrap:wrap} .kk-pasek .tr-btn{min-height:44px;border-radius:10px;box-shadow:none} .kk-pasek a.kk-pasek-akcja{display:inline-flex} .kk-pasek .kk-wiecej{width:44px;font-size:18px} .kk-panel{display:grid;grid-template-columns:repeat(auto-fit,minmax(320px,1fr));align-items:start} .kk-panel>.kk-kafle,.kk-panel>.tr-baner,.kk-panel>.kk-zapisano,.kk-panel>.tr-pusto{grid-column:1 / -1} .kk-kafle{overflow:visible;flex-wrap:wrap} /* arkusz na komputerze: panel z boku obok karty (UX_formularze §5f) */ .kk-arkusz:target{justify-content:flex-start;align-items:flex-end} .kk-arkusz-panel{width:min(480px,100%);height:100%;max-height:none;border-radius:0;border-top:0;border-left:1px solid var(--t-lin)} } /* ============================================================================ WZORZEC G — FORMULARZ I CZYNNOŚĆ (dostawa 3 „nowy termin”, kontrakt v68; UX_formularze §5, WZORZEC_ekranow §4 G) Pierwsze egzemplarze wspólnych klocków: pełny ekran z paskiem akcji zamiast paska dolnego (UF10), sekcja z etykietą, wybrana osoba, lista osób z szukaniem, kafle wyboru (radio), linia płatności, błąd przy polu i skrót „Popraw N pól”, „Więcej” 48 px, pasek „Zapisano · Cofnij” (komunikat jednorazowy z sesji). Fala 1 bierze je gotowe — nowy klocek dopisuje się tu, nie obok. ============================================================================ */ main.pw.g-ekran{max-width:640px} /* wygrywa z main.pw (880 px) — formularz G nie rozjeżdża się na komputerze (N13) */ .g-glowa{margin:0 0 6px} .g-wstecz{display:inline-flex;align-items:center;min-height:44px;color:var(--t-akc);text-decoration:none;font-size:15px} .g-glowa .tr-tytul{margin:0} .g-kontekst{margin:2px 0 0;color:var(--t-mut);font-size:13px} .g-forma{margin:0} .g-sekcja{border:0;margin:18px 0 0;padding:0;min-width:0;display:flex;flex-direction:column;gap:8px} .g-etyk{margin:0;padding:0;font-size:12px!important;font-weight:400!important;letter-spacing:.06em;text-transform:uppercase;color:var(--t-mut)!important} .g-etyk-pod{text-transform:none;letter-spacing:0;font-size:12.5px;margin-left:6px} .g-etyk-mala{margin:4px 0 0;font-size:13px;color:#c9ced6} .g-pole{display:flex;flex-direction:column;gap:4px;margin:6px 0 0} .g-pole-opis{display:block;margin:0;font-size:14px!important;color:var(--t-mut)!important} .g-sekcja.blad .tr-pole,.g-pole.blad .tr-pole,.tr-pole[aria-invalid="true"]{border-color:var(--t-zle)} .g-blad{margin:2px 0 0;font-size:14px;color:var(--t-zle)} .g-blad-skrot{margin:8px 0 0;padding:10px 12px;border:1px solid var(--t-zle);border-radius:12px;background:var(--t-zle-tlo);color:var(--t-zle);font-size:14px} .g-blad-skrot a{color:var(--t-zle)!important;font-weight:700;margin-left:6px} .g-wybrany{display:flex;align-items:center;justify-content:space-between;gap:8px;min-height:56px;box-sizing:border-box;padding:6px 6px 6px 14px; border:1px solid var(--t-akc);border-radius:12px;background:var(--t-akc-tlo)} .g-wybrany-tekst{display:flex;flex-direction:column;min-width:0} .g-wybrany-nazwa{font-weight:700;color:var(--t-txt)} .g-wybrany-pod{font-size:12.5px;color:var(--t-mut)} .g-zmien{display:inline-flex;align-items:center;min-height:44px;padding:0 12px;color:#ff8a47!important;font-weight:600;font-size:14px;text-decoration:none;white-space:nowrap} .g-link{display:inline-flex;align-items:center;align-self:flex-start;min-height:44px;color:#ff8a47!important;font-size:14px;text-decoration:none} .g-jak{display:flex;align-items:center;min-height:52px;box-sizing:border-box;padding:8px 14px;border:1px dashed var(--t-akc);border-radius:12px;color:#ff8a47!important; font-weight:700;font-size:14px;text-decoration:none} .g-jak.wpisane{border-style:solid;border-color:rgba(52,211,153,.6);background:rgba(52,211,153,.08);color:var(--t-ok)!important;font-weight:600} .g-szukaj{margin:0} .g-szukaj-rzad{display:flex;gap:8px} .g-szukaj-rzad .tr-pole{flex:1 1 auto;min-width:0} .g-szukaj-rzad .tr-btn{flex:0 0 auto} .g-osoby{display:flex;flex-direction:column;border:1px solid var(--t-lin);border-radius:12px;overflow-x:hidden;overflow-y:auto;max-height:60vh} .g-osoby-etyk{margin:0;padding:8px 14px 4px;font-size:12.5px;color:var(--t-mut);background:var(--t-bg)} .g-osoba{display:flex;flex-direction:column;justify-content:center;gap:2px;min-height:56px;box-sizing:border-box;padding:6px 14px;border-top:1px solid var(--t-lin); background:var(--t-sur);color:var(--t-txt)!important;text-decoration:none} .g-osoba:hover{background:var(--t-sur2)} .g-osoba[hidden]{display:none} .g-osoba-nazwa{font-weight:600;font-size:15px} .g-osoba-pod{font-size:12.5px;color:var(--t-mut)} .g-pusto{margin:0;color:var(--t-mut);font-size:14px} /* kafle wyboru: radio w etykiecie (klawiatura i czytnik jak zwykłe radio), zaznaczony — obrys akcentu, niedostępny — przerywany */ .g-kafle{display:grid;grid-template-columns:repeat(auto-fill,minmax(80px,1fr));gap:8px} .g-kafle-2{grid-template-columns:repeat(2,minmax(0,1fr))} .g-kafle-3{grid-template-columns:repeat(3,minmax(0,1fr))} .g-kafle-4{grid-template-columns:repeat(4,minmax(0,1fr))} .g-kafle-5{grid-template-columns:repeat(5,minmax(0,1fr))} .g-kafel{position:relative;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:2px;min-height:48px;box-sizing:border-box;padding:4px;margin:0; border:1px solid var(--t-lin);border-radius:12px;background:var(--t-sur);color:var(--t-txt)!important;font-size:15px!important;font-weight:normal;text-align:center;cursor:pointer} .g-kafel-z-podpisem{min-height:58px} .g-kafel input{position:absolute;opacity:0;width:1px!important;height:1px!important;margin:0;pointer-events:none} .g-kafel:has(input:checked){border-color:var(--t-akc);background:rgba(255,107,26,.14);font-weight:700} .g-kafel:has(input:focus-visible){outline:2px solid var(--t-akc);outline-offset:2px} .g-kafel:has(input:disabled){border-style:dashed;background:transparent;color:#5f6672!important;cursor:default} .g-kafel-nazwa{font-variant-numeric:tabular-nums} .g-kafel-pod{font-size:11.5px;color:var(--t-mut);font-weight:400} .g-inna-godzina{display:none} .g-forma:has(input[data-godzina-inna]:checked) .g-inna-godzina{display:block} /* linia płatności (TO1): z karnetu — zielona, bez karnetu — bursztyn; wariant miejsca i dopłatę przełącza kafel „Gdzie” bez przeładowania */ .g-linia{padding:10px 14px;border-radius:12px;display:flex;flex-direction:column;gap:3px} .g-linia.karnet{border:1px solid rgba(52,211,153,.45);background:rgba(52,211,153,.06)} .g-linia.bez{border:1px solid rgba(251,191,36,.5);background:rgba(251,191,36,.08)} .g-linia p{margin:0} .g-linia-gora{display:flex;justify-content:space-between;align-items:baseline;gap:8px} .g-linia-tytul{font-weight:700;color:var(--t-txt)} .g-linia-kod{font-size:12px;color:var(--t-mut);font-variant-numeric:tabular-nums} .g-linia-opis{font-size:13px;color:#c9ced6;line-height:1.4} .g-linia-uwaga{font-size:12.5px;color:var(--t-ost)} .g-doplata{display:none} .g-forma:has(input[name="gdzie"][value="dojazd"]:checked) .g-doplata{display:block} .g-forma:has(input[name="gdzie"]) [data-gdzie-wariant]{display:none} .g-forma:has(input[name="gdzie"][value="sala"]:checked) [data-gdzie-wariant="sala"], .g-forma:has(input[name="gdzie"][value="online"]:checked) [data-gdzie-wariant="online"], .g-forma:has(input[name="gdzie"][value="dojazd"]:checked) [data-gdzie-wariant="dojazd"]{display:flex} .g-sprzedaj{align-self:flex-start;min-height:48px} .g-pod-przyciskiem{margin:0;font-size:12.5px;color:var(--t-mut)} .g-przelicz{align-self:flex-start;min-height:48px} /* „Więcej” na końcu (G6): rozwijacz 48 px */ .g-wiecej{margin:14px 0 0;border:1px solid var(--t-lin);border-radius:12px;background:var(--t-sur)} .g-wiecej>summary{display:flex;align-items:center;min-height:48px;padding:0 14px;cursor:pointer;color:#c9ced6!important;font-size:14px;font-weight:400!important;list-style:none} .g-wiecej>summary::-webkit-details-marker{display:none} .g-wiecej>summary::after{content:"+";margin-left:auto;color:var(--t-mut)} .g-wiecej[open]>summary::after{content:"−"} .g-wiecej>*:not(summary){margin-left:14px;margin-right:14px} .g-wiecej>*:last-child{margin-bottom:14px} .g-inne-karnety{margin:0} .g-ostrzezenia{margin:14px 0 0} .g-domyslny{position:absolute;left:-9999px;width:1px;height:1px;overflow:hidden} /* pasek akcji zamiast paska dolnego (UF10, na bazie .tr-dol): przyklejony do dołu, przycisk główny z nazwą skutku i „Anuluj” */ .g-pasek-akcji{position:sticky;bottom:0;z-index:40;display:grid;grid-template-columns:minmax(0,1fr) auto;gap:8px;margin:16px -14px 0; padding:10px 14px calc(12px + env(safe-area-inset-bottom, 0px));background:#111318;border-top:1px solid var(--t-lin)} .g-pasek-akcji .tr-btn{min-height:52px} .g-pasek-akcji a.tr-btn{display:inline-flex;align-items:center;justify-content:center;text-decoration:none;color:var(--t-txt)} .g-arkusz .g-sekcja{margin-top:6px} .g-akcja-terminu{margin:10px 0 0} .g-akcja-terminu .tr-btn{display:inline-flex;align-items:center;justify-content:center;text-decoration:none} @media(max-width:900px){ body.g-forma-pelna{padding-bottom:0;--t-dol:0px} body.g-forma-pelna .pasek-dolny{display:none} } /* pasek „Zapisano · Cofnij” — w assets/style.css: rysuje go admin/_nav.php na każdej stronie panelu, także bez tego pliku (recenzja v68 Ś2) */ @media(min-width:901px){ .g-pasek-akcji{margin:16px 0 0;border-radius:12px;border:1px solid var(--t-lin)} } /* ============================================================================ PULPIT (dostawa 4, kontrakt v69; UX_pulpit, PU1–PU6; WZORZEC_ekranow §4 H): liczniki Dziś · Klienci · Pieniądze · Do zrobienia (telefon — siatka 2 × 2, wybrany z obrysem akcentu), lista po 5, wiersz w dwóch poziomach (kto · sprawa pogrubione, szczegół szary), pole do odhaczenia 48 px, jedna czynność 44 px, „⋯” → arkusz „Odłóż” (klocek `.kk-arkusz`); komputer — cztery listy naraz w siatce 2 × 2 z liczbą w nagłówku karty (rząd liczników schowany). Kolory tylko ze zmiennych www; czerwień — wyłącznie błąd zapisu (U8). ============================================================================ */ main.pw.pu{padding-bottom:calc(96px + var(--t-dol))} .pu .pw-naglowek .tr-tytul{margin-bottom:10px} .pu-bez-patcha{margin:0 0 10px} .pu-liczniki{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px;margin:0 0 12px} .pu-licznik{display:flex;flex-direction:column;justify-content:center;gap:1px;min-height:74px;box-sizing:border-box;padding:8px 12px;border-radius:14px; background:var(--t-sur);border:1px solid var(--t-lin);color:var(--t-txt)!important;text-decoration:none!important} .pu-licznik.wybrany{border-color:var(--t-akc)} .pu-licznik:hover{border-color:var(--t-mut)} .pu-licznik.wybrany:hover{border-color:var(--t-akc)} .pu-licznik-nazwa{font-size:12px;letter-spacing:.05em;text-transform:uppercase;color:var(--t-mut)} .pu-licznik-liczba{font-size:24px;font-weight:800;font-variant-numeric:tabular-nums;line-height:1.15} .pu-licznik-podpis,.pu-panel-podpis{font-size:12.5px;color:var(--t-mut)} .pu-licznik-podpis.ost,.pu-panel-podpis.ost{color:var(--t-ost)} .pu-licznik-podpis.zle,.pu-panel-podpis.zle{color:var(--t-zle)} .pu-panel{scroll-margin-top:calc(var(--belka-wys, 0px) + 8px)} .pu-panel:not(.wybrany){display:none} .pu-panel-glowa{display:none} .pu-jedna .pu-panel-glowa{display:flex;align-items:baseline;flex-wrap:wrap;gap:4px 10px;margin:0 0 6px} .pu-jedna .pu-panel-nazwa{margin:0;font-size:13px!important;letter-spacing:.05em;text-transform:uppercase;color:var(--t-mut)!important;font-weight:600!important} .pu-jedna .pu-panel-liczba{display:none} .pu-panel-wroc{margin-left:auto;display:inline-flex;align-items:center;min-height:44px;color:var(--t-akc)!important;text-decoration:none;font-size:14px} .pu-lista{display:flex;flex-direction:column} /* wiersz sprawy: pole | tekst | czynność i „⋯”; linia podziału zamiast kropek wypunktowania (PU3) */ .pu-wiersz{display:grid;grid-template-columns:48px minmax(0,1fr) auto;gap:6px;align-items:center;min-height:64px;padding:4px 0;border-top:1px solid var(--t-lin)} .pu-wiersz.bez-pola,.pu .pu-wiersz.bez-pola{grid-template-columns:minmax(0,1fr) auto} .pu-lewo{width:48px;height:48px;display:flex;align-items:center;justify-content:center;margin:0} .pu-odhacz{width:48px;height:48px;border:0;border-radius:12px;background:transparent;padding:0;display:flex;align-items:center;justify-content:center;cursor:pointer} .pu-odhacz:hover,.pu-odhacz:focus{background:transparent} .pu-pole{width:26px;height:26px;border:2px solid var(--t-mut);border-radius:8px;box-sizing:border-box;display:flex;align-items:center;justify-content:center} .pu-odhacz:hover .pu-pole,.pu-odhacz:focus-visible .pu-pole{border-color:var(--t-akc)} .pu-wybierz{position:relative;cursor:pointer} .pu-wybierz input{position:absolute;opacity:0;width:1px!important;height:1px!important;margin:0} .pu-wybierz:has(input:checked) .pu-pole{background:var(--t-akc);border-color:var(--t-akc)} .pu-wybierz:has(input:checked) .pu-pole::after{content:"";width:12px;height:7px;border:solid var(--t-bg);border-width:0 0 3px 3px;transform:translateY(-2px) rotate(-45deg)} .pu-wybierz:has(input:focus-visible) .pu-pole{outline:2px solid var(--t-akc);outline-offset:2px} .pu-wiersz:has(.pu-wybierz input:checked){background:var(--t-akc-tlo)} .pu-znak-bledu{color:var(--t-zle);font-weight:800;font-size:20px} .pu-sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);clip-path:inset(50%);white-space:nowrap} .pu-tekst{display:flex;flex-direction:column;justify-content:center;gap:2px;min-height:48px;min-width:0;color:var(--t-txt)!important;text-decoration:none!important} .pu-linia1{font-weight:700;line-height:1.3;font-size:16px;overflow-wrap:anywhere} .pu-kto,.pu-sprawa{font-weight:700;color:var(--t-txt)} .pu-kropka{color:var(--t-mut);font-weight:400} .pu-wiersz.pilna .pu-sprawa{color:var(--t-ost)} .pu-wiersz.blad .pu-sprawa{color:var(--t-zle)} .pu-szczegol{color:var(--t-mut);font-size:13.5px;line-height:1.35;font-weight:400;overflow-wrap:anywhere} .pu-nw{white-space:nowrap} .pu-wrocilo{display:inline-block;padding:0 6px;border-radius:6px;background:var(--t-ost-tlo);color:var(--t-ost);font-size:12px;line-height:18px} .pu-prawo{display:flex;align-items:center;gap:2px} .pu-czynnosc{min-height:44px;display:inline-flex;align-items:center;padding:0 12px;border-radius:999px;border:1px solid var(--t-akc);color:var(--t-akc)!important; text-decoration:none!important;font-size:13.5px;font-weight:600;white-space:nowrap} .pu-czynnosc[data-czynnosc="zadzwon"]{color:var(--t-txt)!important;border-color:var(--t-mut)} .pu-wiecej{min-width:44px;min-height:48px;display:inline-flex;align-items:center;justify-content:center;color:var(--t-mut)!important;text-decoration:none!important; font-size:22px;line-height:1;border-radius:10px} .pu-wiecej:hover{color:var(--t-txt)!important} /* Dziś: godzina | kto i co | „Odbyta” i „Nieob.” (szybki status — termin.php) albo plakietka statusu */ .pu-termin{display:grid;grid-template-columns:52px minmax(0,1fr) auto;gap:10px;align-items:center;min-height:64px;padding:4px 0;border-top:1px solid var(--t-lin)} .pu-czas{display:flex;flex-direction:column;font-variant-numeric:tabular-nums;line-height:1.25} .pu-czas small{color:var(--t-mut);font-size:12.5px} .pu-termin.czeka .pu-czas strong{color:var(--t-ost)} .pu-termin .pu-prawo{flex-wrap:wrap;justify-content:flex-end;gap:6px} /* para i grupa: przyciski „Anna K.: Odbyta” w drugim rzędzie pod osobami — kolumna „kto · co” nie zapada się do zera (recenzja v69 Ś5) */ .pu-termin.wiele{grid-template-columns:52px minmax(0,1fr)} .pu-termin.wiele .pu-prawo{grid-column:2;justify-content:flex-start;padding-bottom:6px} .pu-status-form{margin:0} .pu-status-btn{min-height:44px;padding:0 10px;border-radius:10px;border:1px solid var(--t-lin);background:transparent;color:var(--t-txt);font-size:13px;cursor:pointer;font-family:inherit} .pu-status-btn:hover{background:transparent;border-color:var(--t-mut)} .pu-status-btn.glowny{background:var(--t-akc);border-color:var(--t-akc);color:var(--t-bg);font-weight:700} .pu-status-btn.glowny:hover{background:var(--t-akc);filter:brightness(1.1)} .pu-status{font-size:12px;padding:3px 10px;border-radius:999px;border:1px solid var(--t-lin);color:var(--t-mut);white-space:nowrap} .pu-status.ok{color:var(--t-ok);border-color:var(--t-ok)} .pu-status.ost{color:var(--t-ost);border-color:var(--t-ost)} .pu-status.odw{text-decoration:line-through} .pu-pusto{color:var(--t-mut);padding:18px 0;border-top:1px solid var(--t-lin);margin:0} .pu-stopka{display:flex;flex-wrap:wrap;gap:8px;margin:8px 0 0} .pu-wszystkie{flex:1 1 160px;display:flex;align-items:center;justify-content:center;min-height:48px;box-sizing:border-box;padding:0 12px;border-radius:12px; border:1px solid var(--t-lin);background:var(--t-sur);color:var(--t-txt)!important;text-decoration:none!important;font-weight:600;font-size:14.5px} .pu-wszystkie.pu-drugi{font-weight:400;color:var(--t-mut)!important} .pu-filtr{display:flex;flex-wrap:wrap;gap:6px;margin:0 0 10px} .pu-filtr .tr-chip{min-height:44px;text-decoration:none} .pu-baza{margin:10px 0 0;padding:12px 0 0;border-top:1px solid var(--t-lin);color:var(--t-mut);font-size:13.5px;line-height:1.5} .pu-baza a{display:inline-flex;align-items:center;min-height:44px;color:var(--t-akc)} .pu-odhaczone{margin:10px 0 0;border-top:1px solid var(--t-lin)} .pu-odhaczone>summary{min-height:48px;display:flex;align-items:center;color:var(--t-mut);font-size:13.5px;cursor:pointer} .pu-odhaczone-lista{list-style:none;margin:0;padding:0} .pu-odhaczona{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:10px;align-items:center;padding:8px 0;border-top:1px solid var(--t-sur2)} .pu-odhaczona form{margin:0} .pu-tekst-stary{display:flex;flex-direction:column;gap:2px;color:var(--t-txt);min-width:0} .pu-szary{color:var(--t-mut)} .pu-przywroc{min-height:44px;padding:0 12px;border-radius:999px;border:1px solid var(--t-lin);background:transparent;color:var(--t-txt);font-size:13px;cursor:pointer;font-family:inherit} .pu-przywroc:hover{background:transparent;border-color:var(--t-mut)} /* arkusz „Odłóż” — jutro, za 3 dni, za tydzień jednym dotknięciem (U7) */ .pu-odloz-kafle{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px;margin:10px 0 4px} .pu-odloz-kafel{min-height:56px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:1px;padding:4px;border-radius:12px;border:1px solid var(--t-lin); background:var(--t-bg);color:var(--t-txt);font-size:15px;font-weight:600;cursor:pointer;font-family:inherit} .pu-odloz-kafel small{font-size:12px;color:var(--t-mut);font-weight:400} .pu-odloz-kafel:hover,.pu-odloz-kafel:focus{background:var(--t-bg);border-color:var(--t-akc)} .pu-odloz-zamknij{display:flex;align-items:center;justify-content:center;text-decoration:none;color:var(--t-txt)!important;margin-top:4px} .pu-pasek-zaznacz{grid-template-columns:minmax(0,1.3fr) minmax(0,1fr) auto} .pu-pasek-zaznacz a.tr-btn{display:inline-flex;align-items:center;justify-content:center;text-decoration:none} .pu-pasek-zaznacz .tr-btn-obrys{color:var(--t-akc)!important} .pu-pasek-zaznacz .tr-btn[disabled]{opacity:.5;cursor:default} @media(min-width:901px){ .pu-liczniki{display:none} .pu-panele{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px;align-items:start} .pu-jedna .pu-panele{grid-template-columns:minmax(0,1fr)} .pu-panel,.pu-panel:not(.wybrany){display:block;background:var(--t-sur);border:1px solid var(--t-lin);border-radius:16px;padding:12px 16px 14px} .pu-panel-glowa,.pu-jedna .pu-panel-glowa{display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:baseline;gap:2px 10px;margin:0 0 4px} .pu-panel-nazwa{margin:0;font-size:13px!important;letter-spacing:.05em;text-transform:uppercase;color:var(--t-mut)!important;font-weight:600!important} .pu-panel-podpis{grid-column:2;grid-row:1;text-align:right} .pu-panel-liczba,.pu-jedna .pu-panel-liczba{display:block;grid-column:1 / -1;font-size:30px;font-weight:800;font-variant-numeric:tabular-nums;line-height:1.1} .pu-panel-wroc{grid-column:1 / -1;justify-self:start;margin:0} .pu-wiersz{grid-template-columns:40px minmax(0,1fr) auto;min-height:54px} .pu-lewo,.pu-odhacz{width:40px;height:40px} .pu-pole{width:22px;height:22px;border-radius:7px} .pu-linia1{white-space:nowrap;overflow:hidden;text-overflow:ellipsis} .pu-szczegol{font-size:13px} .pu-czynnosc{min-height:36px;font-size:13px} .pu-wiecej{min-height:40px} .pu-wszystkie{flex:0 0 auto;min-height:36px;border:0;background:transparent;color:var(--t-akc)!important;padding:0;justify-content:flex-start;font-size:13.5px} .pu-wszystkie::after{content:"\00a0→"} .pu-wszystkie.pu-drugi{color:var(--t-mut)!important} .pu-pasek-zaznacz{max-width:640px} } /* ============================================================================ PIENIĄDZE (dostawa 5, kontrakt v70; UX_pieniadze, FI1–FI9; WZORZEC_ekranow §4 I): jeden ekran zamiast trzech pozycji menu — miesiąc strzałkami, cztery liczniki z kwotą (telefon — siatka 2 × 2, komputer — rząd), zakładki Kasa · Rozrachunki · Do wyjaśnienia (klocek .kk-zakladki karty), przybornik karty (główna czynność i „⋯”), wiersz z kwotą (co · kto pogrubione, kwota po prawej cyframi tabelarycznymi, szczegół szary; cały wiersz celem dotyku) z jedną czynnością, arkusze wzorca G (.kk-arkusz). Komputer: Kasa w dwóch kolumnach — dziennik i „Zaległe” · „Do podpięcia” po 5. Cele dotyku 48 px (UF3). Pola zależne od wyboru (sposób rozliczenia, „inna…”) chowa :has() tylko tam, gdzie przeglądarka go zna — bez niego widać wszystko, a serwer bierze tylko to, co wskazuje wybór. Kolory tylko ze zmiennych www; zielony = wpływ, bursztyn = zaległe i sprawa, czerwień wyłącznie błąd i anulowanie. ============================================================================ */ main.pw.pien{padding-bottom:calc(120px + var(--t-dol))} .pien-glowa{display:flex;align-items:flex-end;justify-content:space-between;gap:8px;margin:0 0 10px} .pien-glowa .tr-tytul{margin:2px 0 0} .pien-miesiace{display:flex;gap:6px;flex:0 0 auto} .pien-mies{display:inline-flex;align-items:center;justify-content:center;width:48px;height:48px;box-sizing:border-box;border-radius:12px;border:1px solid var(--t-lin); background:var(--t-sur);color:var(--t-txt)!important;text-decoration:none!important;font-size:24px;line-height:1} a.pien-mies:hover{border-color:var(--t-akc)} .pien-mies-nie{opacity:.3} .pien-liczniki{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px;margin:0 0 4px} .pien-licznik{display:flex;flex-direction:column;justify-content:center;gap:1px;min-width:0;min-height:76px;box-sizing:border-box;padding:8px 12px;border-radius:14px; background:var(--t-sur);border:1px solid var(--t-lin);color:var(--t-txt)!important;text-decoration:none!important} .pien-licznik:hover{border-color:var(--t-mut)} .pien-licznik.wybrany,.pien-licznik.wybrany:hover{border-color:var(--t-akc)} .pien-licznik-nazwa{font-size:12px;letter-spacing:.05em;text-transform:uppercase;color:var(--t-mut)} .pien-licznik-kwota{font-size:20px;font-weight:800;font-variant-numeric:tabular-nums;line-height:1.2;white-space:nowrap;overflow:hidden;text-overflow:ellipsis} .pien-licznik-kwota.ost{color:var(--t-ost)} .pien-licznik-kwota.plus{color:var(--t-ok)} .pien-licznik-podpis{font-size:12.5px;color:var(--t-mut);white-space:nowrap;overflow:hidden;text-overflow:ellipsis} .pien-zakladki-rzad .kk-zakladka{min-height:48px} .pien-panel{display:flex;flex-direction:column;gap:10px} .pien-pusto{margin:0;padding:18px 0;border-top:1px solid var(--t-lin);color:var(--t-mut)} .pien-nic{color:var(--t-ok)} /* wiersz z kwotą (FI2): tekst | jedna czynność */ .pien-lista{display:flex;flex-direction:column} .pien-wiersz{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:8px;align-items:center;min-height:56px;border-top:1px solid var(--t-lin)} .pien-wiersz.bez-czynnosci{grid-template-columns:minmax(0,1fr)} .pien-tekst{display:flex;flex-direction:column;justify-content:center;gap:2px;min-width:0;min-height:56px;box-sizing:border-box;padding:6px 0;color:var(--t-txt)!important;text-decoration:none!important} a.pien-tekst:hover{background:rgba(255,255,255,.025)} a.pien-tekst:focus-visible{outline:2px solid var(--t-akc);outline-offset:-2px} .pien-linia1{display:flex;align-items:baseline;gap:10px;font-weight:700;font-size:15.5px;line-height:1.3} .pien-co{flex:1 1 auto;min-width:0;overflow-wrap:anywhere} .pien-kropka{color:var(--t-mut);font-weight:400} .pien-sprawa{color:var(--t-ost)} .pien-kwota{flex:0 0 auto;font-variant-numeric:tabular-nums;white-space:nowrap} .pien-kwota.plus,.pien-plus{color:var(--t-ok)} .pien-kwota.ost,.pien-ost{color:var(--t-ost)} .pien-szczegol{color:var(--t-mut);font-size:13.5px;line-height:1.35;font-weight:400;overflow-wrap:anywhere} .pien-wiersz.anulowany .pien-linia1{color:var(--t-mut);text-decoration:line-through} .pien-prawo{display:flex;align-items:center;gap:6px} .pien-czynnosc{display:inline-flex;align-items:center;justify-content:center;min-height:48px;box-sizing:border-box;padding:0 14px;border-radius:999px;border:1px solid var(--t-akc); background:transparent;color:var(--t-akc)!important;text-decoration:none!important;font-size:14px;font-weight:600;white-space:nowrap;cursor:pointer;font-family:inherit} .pien-czynnosc:hover{background:var(--t-akc-tlo)} .pien-forma-wiersz,.pien-status-form{margin:0} .pien-statusy{display:flex;gap:6px} .pien-status-btn{min-height:48px;padding:0 12px;border-radius:12px;border:1px solid var(--t-lin);background:transparent;color:var(--t-txt);font-size:14px;font-weight:600;cursor:pointer;font-family:inherit} .pien-status-btn:hover{background:transparent;border-color:var(--t-mut)} .pien-status-btn.glowny{background:var(--t-akc);border-color:var(--t-akc);color:var(--t-bg);font-weight:700} .pien-status-btn.glowny:hover{background:var(--t-akc);filter:brightness(1.1)} /* Kasa: konta jako chipy ze stanem, dziennik w grupach dni z sumą dnia */ .pien-konta{display:flex;gap:6px;overflow-x:auto;scrollbar-width:none;margin:0 0 6px;padding-bottom:2px} .pien-konta::-webkit-scrollbar{display:none} .pien-konto{flex:0 0 auto;display:inline-flex;align-items:center;gap:6px;min-height:48px;box-sizing:border-box;padding:0 14px;border-radius:999px;border:1px solid var(--t-lin); color:var(--t-mut)!important;text-decoration:none!important;font-size:14px;white-space:nowrap} .pien-konto strong{color:var(--t-txt);font-variant-numeric:tabular-nums} .pien-konto strong.pien-minus{color:var(--t-zle)} .pien-konto.wybrane{border-color:var(--t-akc);color:var(--t-txt)!important;background:var(--t-akc-tlo)} .pien-mies-stan{margin:0 0 6px;color:var(--t-mut);font-size:14px} .pien-mies-stan a{display:inline-flex;align-items:center;min-height:48px} .pien-mies-stan .tr-chip{min-height:48px;text-decoration:none;color:var(--t-akc)!important;border-color:var(--t-akc)} .pien-dzien{margin:0} .pien-dzien-glowa{display:flex;justify-content:space-between;align-items:baseline;gap:8px;margin:14px 0 2px!important;font-size:13px!important;font-weight:600!important; letter-spacing:.04em;text-transform:uppercase;color:var(--t-mut)!important} .pien-dzien:first-child .pien-dzien-glowa{margin-top:4px!important} .pien-dzien-suma{font-variant-numeric:tabular-nums;text-transform:none;letter-spacing:0;white-space:nowrap} .pien-bok{display:none} .pien-stopka{display:flex;align-items:center;min-height:48px;border-top:1px solid var(--t-lin);font-size:14px;text-decoration:none} /* Rozrachunki: segmenty Zaległe · Do podpięcia · Salda z kwotą i liczbą, osoba z saldem i osią */ .pien-segmenty{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:6px;margin:0 0 6px} .pien-segment{display:flex;flex-direction:column;justify-content:center;align-items:center;gap:1px;min-height:56px;box-sizing:border-box;padding:4px 6px;border-radius:12px; border:1px solid var(--t-lin);background:var(--t-sur);color:var(--t-txt)!important;text-decoration:none!important;text-align:center;min-width:0} .pien-segment.wybrany{border-color:var(--t-akc);background:var(--t-akc-tlo)} .pien-segment-nazwa{font-size:14px;font-weight:700} .pien-segment-ile{font-size:12px;color:var(--t-mut);font-variant-numeric:tabular-nums;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:100%} .pien-wroc{margin:0} .pien-wroc a{display:inline-flex;align-items:center;min-height:48px;text-decoration:none} .pien-osoba{padding:4px 0 8px} .pien-osoba-nazwa{margin:0!important;font-size:20px!important;font-weight:800!important} .pien-osoba-nazwa a{color:var(--t-txt)!important;text-decoration:none;display:inline-flex;align-items:center;min-height:48px} .pien-osoba-kod{font-size:13px;font-weight:400;color:var(--t-mut)} .pien-saldo{margin:4px 0 0;font-size:18px;font-weight:800;font-variant-numeric:tabular-nums} .pien-saldo.plus{color:var(--t-ok)} .pien-saldo.ost{color:var(--t-ost)} .pien-saldo-pod{margin:2px 0 0;color:var(--t-mut);font-size:13.5px} .pien-blok{margin:6px 0 0} .pien-blok-tytul{margin:10px 0 2px!important;font-size:13px!important;font-weight:600!important;letter-spacing:.05em;text-transform:uppercase;color:var(--t-mut)!important} /* arkusze: wpłata, zwrot, rozliczenie, przedłużenie, podpięcie, wpis (Popraw · Korekta · Anuluj), zamknięcie miesiąca */ .pien-arkusz .g-sekcja:first-of-type{margin-top:4px} .pien-arkusz a.kk-zamknij{display:flex;align-items:center;justify-content:center;text-decoration:none} .pien-pole-kwoty{font-size:22px!important;font-weight:700;font-variant-numeric:tabular-nums} .pien-konto-linia{margin:2px 0 0;color:var(--t-mut);font-size:14px} .pien-konto-linia strong{color:var(--t-txt)} .pien-konto-wybor{display:flex;flex-direction:column;gap:6px} .pien-konto-wybor[hidden],.pien-konto-linia[hidden]{display:none} .pien-platnik{display:flex;align-items:center;justify-content:space-between;gap:8px;margin:10px 0 0;min-height:48px;padding:0 0 0 2px;color:var(--t-mut);font-size:14px} .pien-platnik strong{color:var(--t-txt)} .pien-platnik .g-zmien,.pien-arkusz .g-link{min-height:48px} .pien-pewno{margin:12px 0 0;padding:10px 12px;border-radius:12px;border:1px solid #6b4a14;background:var(--t-ost-tlo);color:#f3d38a;font-size:14px;line-height:1.45} .pien-pewno strong{color:var(--t-ost)} .pien-pewno-nie{margin:6px 0;color:var(--t-mut);font-size:15px} .pien-wlacznik{margin:12px 0 0} .pien-dl{margin-top:4px} .pien-stan{margin:6px 0 0;padding:8px 12px;border-radius:12px;background:var(--t-sur2);color:#c9ced6;font-size:13.5px} .pien-czynnosci{display:grid;grid-template-columns:repeat(auto-fit,minmax(90px,1fr));gap:8px;margin:10px 0 0} .pien-czynnosc-wpisu{display:inline-flex;align-items:center;justify-content:center;text-decoration:none!important;color:var(--t-txt)!important} .pien-czynnosc-wpisu.tr-btn-zle{color:var(--t-zle)!important} .pien-czynnosc-wpisu.wybrana{border-color:var(--t-akc);background:var(--t-akc-tlo)} .pien-czynnosc-wpisu.tr-btn-zle.wybrana{border-color:var(--t-zle);background:var(--t-zle-tlo)} .pien-czynnosc-forma[hidden]{display:none} .pien-historia{margin-top:2px} /* v71 (dostawa 5b): arkusz karnetu — odnośniki obok, „Usuń” przy przedłużeniu, raty w poprawce sprzedaży; karnet na karcie klienta */ .pien-obok{display:flex;flex-wrap:wrap;gap:0 14px;margin:6px 0 0} .pien-historia .pien-zd-usun{display:inline-flex;align-items:center;min-height:48px;margin-left:10px;padding:0 6px;color:var(--t-zle)!important;font-size:14px;text-decoration:none} .pien-historia li{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:4px} .pien-raty{display:flex;flex-direction:column;gap:8px;margin-top:10px} .pien-rata{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:8px} .kp-karnet-link{display:inline-flex;align-items:center;min-height:48px;text-decoration:none} /* cele dotyku 48 px na telefonie (recenzja v71 N5): „Popraw · Usuń…” na osi, „Wpłata · Przedłuż · Rozlicz” w arkuszu karnetu, „Przenieś nadpłatę” */ .pien-obok .g-link{min-height:48px} .pien-saldo-pod .tr-chip{min-height:48px;text-decoration:none} .pien-nikt[hidden],.g-osoby-etyk[hidden]{display:none} /* nowy wpis w Kasie (pełny ekran G) */ .pien-wpis .g-wstecz{min-height:48px} .pien-wpis .pol-skroty .tr-chip{min-height:48px} .pien-kat-inna{margin-top:8px} @supports selector(:has(*)){ .pien-rozlicz .pien-tylko-zwrot,.pien-rozlicz .pien-tylko-saldo,.pien-rozlicz .pien-tylko-bez{display:none} .pien-rozlicz:has(input[name="tryb"][value="zwrot"]:checked) .pien-tylko-zwrot, .pien-rozlicz:has(input[name="tryb"][value="saldo"]:checked) .pien-tylko-saldo, .pien-rozlicz:has(input[name="tryb"][value="bez"]:checked) .pien-tylko-bez{display:revert} .pien-rozlicz:has(input[name="tryb"][value="bez"]:checked) .pien-tylko-kwota{display:none} .pien-dni-inne{display:none} .pien-forma:has(input[data-pien-dni-inne]:checked) .pien-dni-inne{display:block} .pien-kat-inna{display:none} .pien-kat-inna.zawsze,.g-forma:has(input[name="kategoria"][value="inna"]:checked) .pien-kat-inna{display:block} .pien-forma:has(input[name="platnosc"][value="termin"]:checked) .pien-raty, .pien-forma:has(input[name="platnosc"][value="raty"]:checked) .pien-tylko-termin{display:none} } @media(min-width:901px){ .pien-liczniki{grid-template-columns:repeat(4,minmax(0,1fr));gap:12px} .pien-licznik{min-height:84px;padding:10px 16px} .pien-licznik-kwota{font-size:24px} .pien .kk-pasek .tr-btn{min-height:48px} .pien .kk-pasek .kk-wiecej{width:48px} .pien-kasa{display:grid;grid-template-columns:minmax(0,1fr) minmax(300px,380px);gap:24px;align-items:start} .pien-bok{display:flex;flex-direction:column;gap:14px;position:sticky;top:calc(var(--belka-wys, 56px) + 72px)} .pien-bok-blok{background:var(--t-sur);border:1px solid var(--t-lin);border-radius:16px;padding:10px 16px 6px} .pien-bok-tytul{display:flex;justify-content:space-between;align-items:baseline;gap:8px;margin:0 0 2px!important;font-size:13px!important;font-weight:600!important; letter-spacing:.05em;text-transform:uppercase;color:var(--t-mut)!important} .pien-bok-suma{font-variant-numeric:tabular-nums;text-transform:none;letter-spacing:0} .pien-bok .pien-wiersz:first-of-type{border-top:0} .pien-bok .pien-linia1{font-size:14.5px} .pien-segmenty{grid-template-columns:repeat(3,minmax(0,220px))} .pien-wiersz,.pien-tekst{min-height:52px} .pien-linia1{white-space:nowrap} .pien-co{overflow:hidden;text-overflow:ellipsis} } /* ============================================================================ OFERTA (dostawa 6 „Oferta, cennik i sprzedaż”, kontrakt v72; TO6–TO8; WZORZEC_ekranow §4 J): siatka cen zamiast tabeli 40 pozycji — grupy usług, karty pul z wierszami Sesja / Karnet N i kolumnami Sala · Online · U klienta. Telefon: przełącznik miejsca nad listą (radio + :has — bez skryptu i bez przeładowania), karta pokazuje jedną kolumnę, a karta pozycji zajmuje cały ekran; komputer: trzy kolumny obok siebie i karta pozycji w panelu z boku. Stany komórki: cena, „czeka … od …” (bursztyn), „brak ceny” (bursztyn), wycofana (przygaszona). Bez :has (stara przeglądarka) na telefonie widać wszystkie trzy kolumny — nic się nie chowa przed nikim. ============================================================================ */ main.pw.of{padding-bottom:calc(96px + var(--t-dol))} .of-glowa{display:flex;flex-wrap:wrap;align-items:flex-end;justify-content:space-between;gap:8px 12px;margin:0 0 8px} .of-glowa .tr-tytul{margin:2px 0 0} .of-podtytul{margin:2px 0 0;color:var(--t-mut);font-size:13px} .of-pasek{display:none;gap:8px} .of-pasek .tr-btn{display:inline-flex;align-items:center;justify-content:center;text-decoration:none!important;min-height:48px} .of-chipy{display:flex;flex-wrap:wrap;gap:8px;margin:0 0 10px} .of-chip{display:inline-flex;align-items:center;min-height:48px;box-sizing:border-box;padding:0 14px;border-radius:999px;border:1px solid var(--t-lin);background:transparent; color:#c9ced6!important;font-size:14px;text-decoration:none!important;white-space:nowrap} .of-chip.ost{border-color:#6b4a14;color:var(--t-ost)!important} .of-chip.wybrany{border-color:var(--t-akc);background:var(--t-akc-tlo);color:var(--t-txt)!important;font-weight:700} .of-chip:hover{border-color:var(--t-mut)} .of-gdzie{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:4px;margin:0 0 12px;padding:4px;border-radius:12px;background:var(--t-sur);border:1px solid var(--t-lin)} .of-gdzie-kafel{position:relative;display:flex;align-items:center;justify-content:center;min-height:48px;border-radius:9px;color:#c9ced6;font-size:15px;cursor:pointer;margin:0} .of-gdzie-kafel input{position:absolute;opacity:0;width:1px!important;height:1px!important;margin:0;pointer-events:none} .of-gdzie-kafel:has(input:checked){background:var(--t-akc);color:#0a0b0d;font-weight:800} .of-gdzie-kafel:has(input:focus-visible){outline:2px solid var(--t-akc);outline-offset:2px} .of-uklad{display:block} .of-grupa{margin:0 0 16px} .of-grupa-tytul{margin:6px 0 8px!important;font-size:13px!important;font-weight:600!important;letter-spacing:.05em;text-transform:uppercase;color:var(--t-mut)!important} .of-karty{display:flex;flex-direction:column;gap:12px} .of-karta{border:1px solid var(--t-lin);border-radius:14px;background:var(--t-sur);overflow:hidden} .of-karta-glowa{display:flex;justify-content:space-between;align-items:baseline;gap:8px;padding:10px 14px 6px} .of-karta-nazwa{margin:0!important;font-size:15.5px!important;font-weight:700!important;color:var(--t-txt)!important} .of-karta-za{flex:0 0 auto;color:var(--t-mut);font-size:12px} .of-siatka{display:flex;flex-direction:column} .of-rzad{display:grid;grid-template-columns:minmax(76px,.8fr) repeat(3,minmax(0,1fr));gap:4px;align-items:stretch;padding:0 10px 0 14px;border-top:1px solid var(--t-sur2)} .of-rzad-glowa{border-top:0;padding-bottom:2px} .of-rzad-glowa .of-kol{font-size:11.5px;letter-spacing:.05em;text-transform:uppercase;color:var(--t-mut);padding:0 8px} .of-wiersz-nazwa{display:flex;align-items:center;min-height:52px;color:#c9ced6;font-size:14px;font-weight:600} .of-rzad-glowa .of-wiersz-nazwa{min-height:0} .of-komorka{display:flex;flex-direction:column;justify-content:center;gap:1px;min-width:0;min-height:52px;box-sizing:border-box;padding:4px 8px;border-radius:9px; color:var(--t-txt)!important;text-decoration:none!important} a.of-komorka:hover{background:var(--t-sur2)} a.of-komorka:focus-visible{outline:2px solid var(--t-akc);outline-offset:-2px} .of-komorka.wybrana{box-shadow:inset 0 0 0 2px var(--t-akc);background:var(--t-akc-tlo)} .of-cena{font-weight:700;font-size:14.5px;font-variant-numeric:tabular-nums;white-space:nowrap} .of-pod{font-size:12px;color:var(--t-mut);overflow-wrap:anywhere} .of-komorka.czeka .of-pod,.of-komorka.brak .of-pod,.of-komorka.brak .of-cena{color:var(--t-ost)} .of-komorka.brak .of-cena{font-weight:600;font-size:13px} .of-komorka.wycofana{opacity:.55} .of-pusta{color:#5f6672;font-size:12.5px} .of-komorki{display:flex;flex-direction:column;gap:2px} .of-stopka{margin:4px 2px 0;color:var(--t-mut);font-size:13px} .of-pusto{border-top:0} .of-dol{margin:6px 0 0} .of-dol .tr-btn{display:inline-flex;align-items:center;min-height:48px;text-decoration:none!important} /* karta pozycji: pełny ekran na telefonie (lista schowana), panel z boku na komputerze */ .of-pozycja{display:flex;flex-direction:column;gap:10px} .of-wroc{margin:0} .of-wroc .g-wstecz{min-height:48px} .of-poz-tytul{margin:0!important;font-size:22px!important;font-weight:800!important;line-height:1.2;color:var(--t-txt)!important} .of-poz-meta{margin:2px 0 0;color:var(--t-mut);font-size:13px} .of-sekcja{padding:12px 14px;border-radius:14px;background:var(--t-sur);border:1px solid var(--t-lin);display:flex;flex-direction:column;gap:4px} .of-sekcja p{margin:0} .of-etyk{font-size:12px;letter-spacing:.06em;text-transform:uppercase;color:var(--t-mut)} .of-etyk.ost{color:var(--t-ost)} .of-cena-duza{font-size:26px;font-weight:800;font-variant-numeric:tabular-nums;line-height:1.2} .of-cena-duza.ost{font-size:18px;color:var(--t-ost)} .of-za{font-size:13px;font-weight:400;color:var(--t-mut)} .of-czeka{border-color:rgba(251,191,36,.5);background:rgba(251,191,36,.08);gap:8px} .of-czeka-kwota{font-size:18px;font-weight:800;font-variant-numeric:tabular-nums} .of-skutek{color:#c9ced6;font-size:13.5px;line-height:1.45} .of-czeka form,.of-nastepna form,.of-cena-dzis form{margin:0} .of-forma-usun button.of-usun{min-height:48px} /* ponad :where(main.pw) button.kk-usun (44 px) — cel dotyku 48 px (recenzja v72 N16) */ :where(main.pw) button.of-btn-drugi,.of-btn-drugi{min-height:48px;background:transparent;border:1px solid var(--t-lin);color:var(--t-txt)} :where(main.pw) button.of-btn-wycofaj,.of-btn-wycofaj{min-height:48px;background:transparent;border:1px solid rgba(229,72,77,.6);color:var(--t-zle)} .of-historia-lista{list-style:none;margin:0;padding:0} .of-historia-wiersz{display:grid;grid-template-columns:96px minmax(0,1fr) auto;gap:8px;align-items:center;min-height:44px;border-top:1px solid var(--t-sur2);font-size:14px} .of-historia-wiersz:first-child{border-top:0} .of-historia-wiersz.czeka .of-hist-stan{color:var(--t-ost)} .of-hist-data{font-variant-numeric:tabular-nums;color:#c9ced6} .of-hist-stan{color:var(--t-mut);font-size:12.5px} .of-hist-cena{font-weight:700;font-variant-numeric:tabular-nums;text-align:right} .of-czynnosci{display:flex;flex-wrap:wrap;gap:8px} .of-czynnosci .tr-btn{display:inline-flex;align-items:center;justify-content:center;min-height:48px;text-decoration:none!important} .of-dl{background:var(--t-sur);border:1px solid var(--t-lin);border-radius:14px;padding:4px 14px} .of-forma-wycofaj{margin:4px 0 0;display:flex;flex-direction:column;gap:4px;align-items:flex-start} .of-forma-wycofaj .of-pod{font-size:12.5px} /* „Nowa cena” — „inna data…” pokazuje pole daty (:has); nowa pozycja — „inny…” czas i „inna…” liczba wejść */ .of-od-inna,.of-czas-inny,.of-ile-inna{margin-top:6px} .of-propozycja{padding:12px 14px;border-radius:14px;background:var(--t-sur);border:1px solid var(--t-lin)} .of-propozycja .of-pod{margin:6px 0 0;font-size:13px} .of-nowa .g-kafle-5{grid-template-columns:repeat(3,minmax(0,1fr))} /* usługi i podtypy */ .of-uslugi{display:flex;flex-direction:column;gap:12px} .of-podtyp{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:8px;align-items:center;padding:6px 0;border-top:1px solid var(--t-sur2)} .of-podtyp.wycofany .tr-pole{opacity:.6} .of-podtyp form{margin:0} .of-podtyp-nazwa,.of-podtyp-nowy{display:flex;gap:8px;align-items:center} .of-podtyp-nazwa .tr-pole,.of-podtyp-nowy .tr-pole{flex:1 1 auto;min-width:0} .of-podtyp-nowy{margin:10px 0 8px} @supports selector(:has(*)){ .of-od-inna{display:none} .of-forma-cena:has(input[data-of-od-inna]:checked) .of-od-inna{display:block} .of-czas-inny{display:none} .of-nowa-forma:has(input[name="czas"][value="inny"]:checked) .of-czas-inny{display:block} .of-ile-inna{display:none} .of-nowa-forma:has(input[name="ile"][value="inna"]:checked) .of-ile-inna{display:block} } @media(max-width:900px){ main.of.z-pozycja .of-lista,main.of.z-pozycja .of-chipy,main.of.z-pozycja .of-glowa,main.of.z-pozycja .of-dol{display:none} @supports selector(:has(*)){ .of-rzad{grid-template-columns:minmax(0,1fr) minmax(0,1.3fr)} main.of:has([data-of-gdzie][value="sala"]:checked) [data-of-kol]:not([data-of-kol="sala"]), main.of:has([data-of-gdzie][value="online"]:checked) [data-of-kol]:not([data-of-kol="online"]), main.of:has([data-of-gdzie][value="dojazd"]:checked) [data-of-kol]:not([data-of-kol="dojazd"]){display:none} main.of:has([data-of-gdzie][value="sala"]:checked) .of-karta:not([data-of-formy~="sala"]), main.of:has([data-of-gdzie][value="online"]:checked) .of-karta:not([data-of-formy~="online"]), main.of:has([data-of-gdzie][value="dojazd"]:checked) .of-karta:not([data-of-formy~="dojazd"]){display:none} /* grupa bez żadnej karty z wybranym miejscem (Badania i terapia, Dopłaty przy „Online”; Dopłaty przy „Sala”) — bez pustego nagłówka */ main.of:has([data-of-gdzie][value="sala"]:checked) .of-grupa:not(:has(.of-karta[data-of-formy~="sala"])), main.of:has([data-of-gdzie][value="online"]:checked) .of-grupa:not(:has(.of-karta[data-of-formy~="online"])), main.of:has([data-of-gdzie][value="dojazd"]:checked) .of-grupa:not(:has(.of-karta[data-of-formy~="dojazd"])){display:none} main.of:has([data-of-gdzie][value="sala"]:checked) .of-stopka[data-of-tylko-sala]{display:none} .of-rzad-glowa{display:none} } } @media(min-width:901px){ .of-pasek{display:flex} .of-dol{display:none} .of-gdzie{display:none} .of-uklad{display:grid;grid-template-columns:minmax(0,1fr);gap:20px;align-items:start} main.of.z-pozycja .of-uklad{grid-template-columns:minmax(0,1fr) minmax(320px,420px)} .of-karty{display:grid;grid-template-columns:repeat(auto-fill,minmax(360px,1fr));gap:14px} .of-pozycja{position:sticky;top:calc(var(--belka-wys, 56px) + 12px);max-height:calc(100vh - var(--belka-wys, 56px) - 24px);overflow-y:auto; padding:16px;border-radius:16px;background:#111318;border:1px solid var(--t-lin)} .of-pozycja .of-wroc{display:none} } /* ============================================================================ SPRZEDAŻ KLOCKIEM WYBORU (dostawa 6, kontrakt v72; TO5; WZORZEC_ekranow §4 G — tryb sprzedaży): pełny ekran wzorca G — kto, zajęcia (Co · Czas · Gdzie · Ile z ceną na kaflu), cena z „Inna kwota”, terminy do pokrycia, płatność kaflami (Później · Całość · Część), forma z kontem, „Więcej”, pasek akcji z przyciskiem mówiącym skutek. Pola zależne od płatności chowa :has (bez niego widać wszystkie, a serwer bierze tylko to, co wskazuje wybór). ============================================================================ */ .sp .sp-ile .g-kafel{min-height:62px} .sp-cena{padding:12px 14px;border-radius:14px;background:var(--t-sur);border:1px solid var(--t-lin)} .sp-cena-duza{margin:0;font-size:26px;font-weight:800;font-variant-numeric:tabular-nums;line-height:1.2} .sp-cena-brak{margin:0;color:var(--t-ost);font-weight:700} .sp-cena .g-wiecej{margin-top:10px} .sp-pokryj .sp-termin{margin:0} .sp-sklady{margin-top:4px;max-height:none} .sp-sklady-etyk{margin-top:12px;border-radius:12px 12px 0 0} .sp-teraz{margin-top:10px} .sp-tylko-czesc,.sp-tylko-teraz{margin-top:4px} @supports selector(:has(*)){ .sp-tylko-czesc{display:none} .sp-forma:has(input[name="wplac"][value="czesc"]:checked) .sp-tylko-czesc{display:block} .sp-forma:has(input[name="wplac"][value="nic"]:checked) .sp-tylko-teraz{display:none} } /* ============================================================================ PLAN I RAPORT jako zakładki Pieniędzy (dostawa 6, kontrakt v72; FI1, FI2, FI4 — UX_pieniadze §2, §5 F2): segment Plan miesiąca · Prognoza, wiersz z kwotą (miesiąc miniony przygaszony, „Razem” roku), pełny ekran pozycji planu (stała albo jednorazowa — pola przełącza samo CSS, osoba szukaniem), czynności karnetu na karcie klienta (AU7). ============================================================================ */ .pien-segmenty-2{grid-template-columns:repeat(2,minmax(0,1fr))} .pien-plan-suma{font-variant-numeric:tabular-nums} .pien-wiersz.pien-przeszly .pien-tekst{opacity:.7} .pien-wiersz.pien-razem{border-top:2px solid var(--t-lin)} .pien-wiersz.pien-razem .pien-co{font-weight:800} .pien-prognoza-suma,.pien-raport-stan{margin:0 0 8px} .pien-plan-ekran .g-wstecz{min-height:48px} .pien-plan-ekran .pol-skroty .tr-chip{min-height:48px} .pien-plan-osoba .g-osoby{margin-top:8px;max-height:50vh} .pien-plan-osoby label.g-osoba{cursor:pointer} .pien-plan-osoby .g-osoba-nazwa{display:flex;align-items:center;gap:10px} .pien-plan-osoby input[type=radio]{width:20px;height:20px;margin:0;flex:none;accent-color:var(--t-akc)} .pien-plan-osoby .g-osoba[hidden]{display:none} .kp-czynnosci{display:flex;flex-wrap:wrap;gap:6px;margin-top:6px} .kp-czynnosci .tr-chip{min-height:44px;text-decoration:none} @supports selector(:has(*)){ .pien-plan-forma:has(input[name="rodzaj"][value="stala"]:checked) .pien-tylko-jedn, .pien-plan-forma:has(input[name="rodzaj"][value="jedn"]:checked) .pien-tylko-stala{display:none} .pien-co-ile-inna{display:none} .pien-plan-forma:has(input[name="co_ile"][value="inna"]:checked) .pien-co-ile-inna{display:block} } @media(min-width:901px){ .pien-segmenty-2{grid-template-columns:repeat(2,minmax(0,220px))} .pien-prognoza-suma,.pien-raport-stan{max-width:560px} } /* rząd zakładek Pieniędzy do krawędzi ekranu bez przewijania w bok: main.pw ma 14 px, klocek karty wychodzi o 16 px (2 px poza ekran od v70) */ @media(max-width:900px){.pien-zakladki-rzad{margin-left:-14px;margin-right:-14px}} /* A13 (v72): „Cena” w wierszu „Bez ceny” — odnośnik w kształcie przycisku szybkiej czynności */ a.pien-status-btn.pien-status-link{display:inline-flex;align-items:center;justify-content:center;box-sizing:border-box;text-decoration:none!important} /* ============================================================================ GRAFIK (dostawa 6c, kontrakt v74; GR1–GR13 — UX_grafik §2; WZORZEC_ekranow §4 D): tydzień jako siatka godzin — termin stoi W SWOJEJ MINUCIE (--od i --dl w minutach od północy, --os początek osi; 17:10 rysuje się w 17:10), nachodzące obok siebie (--tor z --torow); telefon — pasek 7 dni i jeden dzień na osi, „Lista dnia” przełącza na wiersze; warstwa „może” (okno z dyspozycji — przerywana ramka, „zwykle” z historii — kropkowana); „Zaznacz” — wolne miejsca polami wyboru (komputer w siatce, telefon i Lista dnia kaflami) i pasek „Umów zaznaczone”. Wiersz w dwóch poziomach (Dziś, Lista, Lista dnia), odwołane zwinięte, filtry Listy w chipach; arkusze terminu (Przesuń z kaflami, Odwołaj, Przywróć) i podgląd serii w nowym terminie. Geometria siatki w zmiennych z atrybutu style (precedens --grafik-kolumn) — bez skryptu; skrypt tylko przełącza dzień i liczy zaznaczone. ============================================================================ */ .gt{--gt-min:.7333px;--gt-glowa:48px;--gt-os-szer:48px} /* 44 px na godzinę (makieta GrafikTydzienKomputer) */ .gt a.tr-btn,.g-akcje-terminu a.tr-btn,.g-arkusz-czynnosci a.tr-btn{display:inline-flex;align-items:center;justify-content:center;text-align:center;text-decoration:none} .gt a.tr-btn-glowny{color:#0a0b0d} .gt-pasek{display:flex;align-items:center;flex-wrap:wrap;gap:8px 12px;margin:4px 0 10px} .gt-pasek .grafik-licznik{margin-left:auto} .gt-narzedzia{display:flex;flex-wrap:wrap;align-items:center;gap:6px;margin:0 0 12px} .gt-chipy{display:flex;flex-wrap:wrap;gap:6px} .gt-narzedzia .tr-chip{min-height:44px;text-decoration:none} .gt-narzedzia .gt-zaznacz{margin-left:auto;min-height:44px;padding:0 16px;font-weight:700} .gt-pusto{margin:0 0 10px} .gt-dni{display:none} /* siatka: kolumna godzin + 7 dni; dzień = nagłówek o stałej wysokości (oś zaczyna się wszędzie na tej samej wysokości), oś, odwołane pod nią */ .gt-siatka{display:grid;grid-template-columns:var(--gt-os-szer) repeat(7,minmax(0,1fr));border:1px solid var(--t-lin);border-radius:14px;overflow:hidden;background:var(--t-bg)} .gt-os{position:relative;margin-top:var(--gt-glowa);height:calc((var(--os-do) - var(--os)) * var(--gt-min))} .gt-os-godz{position:absolute;left:0;right:6px;top:calc((var(--od) - var(--os)) * var(--gt-min));transform:translateY(-50%);text-align:right; font-size:11.5px;color:#6b7280;font-variant-numeric:tabular-nums} .gt-dzien{display:grid;grid-template-rows:var(--gt-glowa) auto auto auto;grid-template-areas:"glowa" "os" "odw" "lista";min-width:0;border-left:1px solid var(--t-lin)} .gt-dzien-glowa{grid-area:glowa;display:flex;align-items:center;gap:6px;box-sizing:border-box;height:var(--gt-glowa);margin:0;padding:0 6px 0 8px; border-bottom:1px solid var(--t-lin);background:var(--t-sur);font-size:13px;font-weight:700;color:var(--t-txt)} .gt-dzien.dzis .gt-dzien-glowa{background:var(--t-akc-tlo)} .gt-dg-data{color:var(--t-mut);font-weight:500;font-variant-numeric:tabular-nums} .gt-dg-ile{margin-left:auto;font-size:11.5px;font-weight:600;color:var(--t-mut)} .gt-plus{display:inline-flex;align-items:center;justify-content:center;flex:none;width:32px;height:32px;border:1px dashed var(--t-lin);border-radius:8px; color:var(--t-mut);font-size:18px;font-weight:700;text-decoration:none} .gt-plus:hover{border-color:var(--t-akc);color:var(--t-akc)} .gt-dzien-os{grid-area:os;position:relative;height:calc((var(--os-do) - var(--os)) * var(--gt-min)); background-image:repeating-linear-gradient(to bottom,var(--t-sur2) 0,var(--t-sur2) 1px,transparent 1px,transparent calc(60 * var(--gt-min)))} .gt-dzien.dzis .gt-dzien-os{background-color:rgba(255,107,26,.03)} .gt-dzien>.gw-odwolane{grid-area:odw;margin:0;padding:2px 6px;border-top:1px solid var(--t-lin)} .gt-lista-dnia{grid-area:lista;display:none} /* elementy osi: góra = minuta startu, wysokość = czas trwania, szerokość = tor */ .gt-blok,.gt-okno,.gt-zwykle,.gt-wolne,.gt-slot{position:absolute;box-sizing:border-box;top:calc((var(--od) - var(--os)) * var(--gt-min));height:calc(var(--dl) * var(--gt-min)); left:calc(var(--tor, 0) / var(--torow, 1) * 100% + 2px);width:calc(100% / var(--torow, 1) - 4px)} .gt-wolne{z-index:0;display:flex;align-items:center;justify-content:center;border-radius:6px;color:transparent;font-size:11.5px;text-decoration:none} .gt-wolne:hover,.gt-wolne:focus-visible{background:var(--t-akc-tlo);color:var(--t-akc);outline:1px dashed var(--t-akc);outline-offset:-1px} .gt-blok{z-index:2;display:flex;flex-direction:column;gap:1px;overflow:hidden;padding:3px 6px;border:1px solid var(--t-akc);border-radius:8px;background:#2a1d14; color:var(--t-txt);font-size:12px;line-height:1.25;text-decoration:none;box-shadow:0 2px 8px rgba(0,0,0,.4)} a.gt-blok:hover{background:#3a2616;color:var(--t-txt)} .gt-blok-1,.gt-blok-2{overflow:hidden;text-overflow:ellipsis;white-space:nowrap} .gt-blok-1 strong{font-variant-numeric:tabular-nums} .gt-blok-2{color:#c9ced6;font-size:11.5px} .gt-blok.status-odbyta{border-color:var(--t-ok);background:rgba(52,211,153,.10)} .gt-blok.status-nieobecnosc,.gt-blok.bez-kodu{border-color:var(--t-ost);background:var(--t-ost-tlo)} .gt-blok.gt-blokada,.gt-blok.przerwa{border-color:#3a414d;background:repeating-linear-gradient(135deg,var(--t-sur) 0 6px,var(--t-bg) 6px 12px);color:var(--t-mut); font-style:italic;box-shadow:none} .gt-blok.pol-czeka{border-style:dashed} .gt-okno{z-index:1;display:flex;flex-direction:column;justify-content:space-between;gap:2px;overflow:hidden;padding:4px 6px;border:1.5px dashed #c2703a;border-radius:10px; background:rgba(255,107,26,.06);color:#f0d9c6;font-size:12px;line-height:1.25} .gt-okno.umowione{opacity:.45} .gt-okno-kto{font-weight:700;overflow:hidden;text-overflow:ellipsis;white-space:nowrap} .gt-okno-opis{color:#c9a88e;font-size:11.5px} .gt-okno-umow{align-self:flex-start;display:inline-flex;align-items:center;min-height:28px;padding:0 10px;border:1px solid var(--t-akc);border-radius:999px; color:#ff8a47;font-size:12px;font-weight:600;text-decoration:none;cursor:pointer} .gt-okno-umow:hover{background:var(--t-akc);color:#0a0b0d} .gt-zwykle{z-index:1;display:block;overflow:hidden;padding:4px 6px;margin:0;border:1.5px dotted #5f6672;border-radius:10px;background:transparent;color:#aab2bd; font-size:12px;line-height:1.25;text-decoration:none;cursor:pointer} .gt-zwykle strong{color:#c9ced6} .gt-zwykle-et{color:var(--t-mut)} .gt-zwykle:hover{border-color:var(--t-akc);color:#aab2bd} .gt-bez-moze .gt-okno,.gt-bez-moze .gt-zwykle{display:none} /* „Zaznacz” (GR5): na komputerze wolne miejsca leżą na osi dnia (ta sama komórka siatki), dotknięcie zaznacza */ .gt-dzien>.gt-sloty{grid-area:os;position:relative;z-index:4;height:calc((var(--os-do) - var(--os)) * var(--gt-min));pointer-events:none} .gt-slot{pointer-events:auto;display:flex;align-items:center;justify-content:center;margin:0;border:1px dashed rgba(255,107,26,.5);border-radius:8px; background:rgba(10,11,13,.72);color:#ff8a47;font-size:12px;font-weight:700;font-variant-numeric:tabular-nums;cursor:pointer} .gt-slot input{position:absolute;opacity:0;width:1px!important;height:1px!important;margin:0;pointer-events:none} .gt-slot:has(input:checked){border:2px solid var(--t-akc);background:rgba(255,107,26,.25);color:var(--t-txt)} .gt-slot:has(input:checked) .gt-slot-godz::before{content:"✓ "} .gt-slot:has(input:focus-visible){outline:2px solid var(--t-akc);outline-offset:1px} /* kafel w oknie „może” albo przy „zwykle” mówi, kto wtedy może (recenzja v74 Ś6); na komputerze kafle na prawej połowie dnia — okna, „zwykle” i terminy innych prowadzących zostają widoczne z lewej */ .gt-slot{flex-direction:column;gap:0;line-height:1.15;overflow:hidden} .gt-slot-kto{display:block;max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:11px;font-weight:600;color:#f0d9c6} .gt-slot-moze{border-style:solid;border-color:#c2703a} @media(min-width:901px){ .gt:not(.gt-uklad-lista) .gt-dzien>.gt-sloty .gt-slot{left:50%;width:calc(50% - 2px)} .gt:not(.gt-uklad-lista) .gt-slot-kto{display:none} } .gt-zaznacz-pasek{position:sticky;bottom:0;z-index:30;display:flex;align-items:center;gap:10px;margin:12px 0 0;padding:10px 14px;border:1px solid var(--t-lin); border-radius:14px;background:var(--t-sur);box-shadow:0 -8px 24px rgba(0,0,0,.5)} .gt-zaznacz-opis{flex:1 1 auto;margin:0;font-size:13px;color:#c9ced6} .gt-zaznacz-pasek .tr-btn{flex:0 0 auto;min-height:50px;font-weight:800} .gt-legenda{display:flex;flex-wrap:wrap;gap:4px 14px;list-style:none;margin:10px 0 0;padding:0;font-size:12.5px} .gt-legenda li{display:flex;align-items:center;gap:6px} .gt-leg{display:inline-block;box-sizing:border-box;width:18px;height:12px;border-radius:4px} .gt-leg-termin{border:1px solid var(--t-akc);background:#2a1d14} .gt-leg-okno{border:1.5px dashed #c2703a;background:rgba(255,107,26,.06)} .gt-leg-zwykle{border:1.5px dotted #5f6672} .gt-leg-zazn{border:2px solid var(--t-akc);background:rgba(255,107,26,.25)} /* „Lista dnia”: zamiast osi — wolne miejsca kaflami (przy zaznaczaniu) i wiersze terminów w dwóch poziomach */ .gt-uklad-lista .gt-siatka{display:block;border:0;border-radius:0;background:transparent;overflow:visible} .gt-uklad-lista .gt-os,.gt-uklad-lista .gt-dzien-os{display:none} .gt-uklad-lista .gt-dzien{display:flex;flex-direction:column;margin:0 0 14px;border-left:0} .gt-uklad-lista .gt-dzien>.gw-odwolane{order:9} /* odwołane pod wierszami, jak w Dziś i Liście (recenzja v74 N11) */ .gt-uklad-lista .gt-dzien-glowa{height:auto;min-height:44px;padding:0;border-bottom:0;background:transparent;font-size:13px;text-transform:uppercase;letter-spacing:.04em} .gt-uklad-lista .gt-dzien.dzis .gt-dzien-glowa{background:transparent;color:var(--t-akc)} .gt-uklad-lista .gt-dzien>.gw-odwolane{border-top:0;padding:0} .gt-uklad-lista .gt-lista-dnia{display:flex;margin:4px 0 0} .gt-uklad-lista .gt-dzien>.gt-sloty{position:static;height:auto;pointer-events:auto;display:grid;grid-template-columns:repeat(auto-fill,minmax(64px,1fr));gap:6px;margin:4px 0 8px} .gt-uklad-lista .gt-slot{position:relative;top:auto;left:auto;width:auto;height:auto;min-height:44px;font-size:14px} @media(max-width:900px){ .gt{--gt-min:.8px;--gt-glowa:44px;--gt-os-szer:40px} /* 48 px na godzinę (makieta GrafikTydzienTelefon) */ .gt-pasek .grafik-zakres{font-size:14px} .gt-dni{display:grid;grid-template-columns:repeat(7,minmax(0,1fr));gap:4px;margin:0 0 10px} .gt-dzien-przycisk{display:flex;flex-direction:column;align-items:center;justify-content:center;min-height:56px;padding:2px 0;border:1px solid var(--t-lin); border-radius:12px;background:var(--t-sur);color:var(--t-txt);text-decoration:none;font-variant-numeric:tabular-nums} .gt-dzien-przycisk:hover{color:var(--t-txt)} .gt-dzien-przycisk.dzis{border-color:#3a414d} .gt-dzien-przycisk.wybrany{border-color:var(--t-akc);background:rgba(255,107,26,.14)} .gt-dp-nazwa{font-size:11.5px;opacity:.8} .gt-dp-dzien{font-size:17px;font-weight:800;line-height:1.15} .gt-dp-ile{font-size:11px;color:var(--t-mut)} .gt-dp-ile:not([data-dzien-zaznaczone="0"]){color:var(--t-akc);font-weight:800} .gt-siatka{grid-template-columns:var(--gt-os-szer) minmax(0,1fr);border:0;border-radius:0;background:transparent;overflow:visible} .gt-dzien{display:none;border-left:0;grid-template-rows:var(--gt-glowa) auto auto auto auto;grid-template-areas:"glowa" "sloty" "os" "lista" "odw"} .gt-dzien.wybrany{display:grid} .gt-dzien-glowa{padding:0 0 0 2px;border-bottom:0;background:transparent;font-size:14px} .gt-dzien.dzis .gt-dzien-glowa{background:transparent} .gt-dzien-os{border-left:1px solid var(--t-lin)} .gt-dzien>.gw-odwolane{border-top:0;padding:4px 0 0} .gt-plus{width:44px;height:44px} .gt-okno-umow{min-height:44px;padding:0 14px} .gt-wolne{left:0;width:100%} /* pełna godzina wolnego miejsca na 60 min (48 px), pół godziny pod nią się chowa (recenzja v74 N1) */ .gt-wolne{height:calc(60 * var(--gt-min))} .gt-wolne-pol{display:none} .gt-uklad-lista .gt-dzien{display:none} .gt-uklad-lista .gt-dzien.wybrany{display:flex} /* telefon przy zaznaczaniu: oś ustępuje kaflom wolnych godzin dnia (cel 44 px) i wierszom jego terminów */ .gt-zaznaczanie .gt-siatka{display:block} .gt-zaznaczanie .gt-os,.gt-zaznaczanie .gt-dzien-os{display:none} .gt-zaznaczanie .gt-dzien.wybrany{display:flex;flex-direction:column} .gt-zaznaczanie .gt-dzien>.gw-odwolane{order:9} .gt-zaznaczanie .gt-lista-dnia{display:flex;margin:4px 0 0} .gt-zaznaczanie .gt-dzien>.gt-sloty{position:static;height:auto;pointer-events:auto;display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:6px;margin:4px 0 8px} .gt-zaznaczanie .gt-slot{position:relative;top:auto;left:auto;width:auto;height:auto;min-height:44px;font-size:14px} .gt-zaznacz-pasek{bottom:var(--t-dol);flex-direction:column;align-items:stretch;margin:12px -14px 0;border-radius:16px 16px 0 0;border-width:1px 0 0} /* kafel przewinięty do widoku (fokus z klawiatury) nie chowa się pod paskiem „Umów zaznaczone” i paskiem dolnym */ html:has(.gt-zaznaczanie){scroll-padding-bottom:calc(var(--t-dol) + 140px)} .gt-legenda{display:none} } /* wiersz terminu w dwóch poziomach (GR2): godzina i osoba pogrubione, stan po prawej; zajęcia · prowadzący · karnet szaro; cały wiersz otwiera termin */ .gw-wiersz{display:flex;flex-wrap:wrap;align-items:stretch;min-width:0;background:var(--t-sur);border:1px solid var(--t-lin);border-left:4px solid var(--t-akc);border-radius:12px} .gw-wiersz.status-odbyta{border-left-color:var(--t-ok)} .gw-wiersz.status-odwolana{border-left-color:var(--t-mut);background:var(--t-bg)} .gw-wiersz.status-odwolana .gw-kto,.gw-wiersz.status-odwolana .gw-godz{color:var(--t-mut)} .gw-wiersz.status-nieobecnosc,.gw-wiersz.bez-kodu{border-left-color:var(--t-ost)} .gw-wiersz.przerwa{border-left-color:var(--t-lin);background:var(--t-bg)} .gw-wiersz.przerwa .gw-kto{font-style:italic;font-weight:500;color:var(--t-mut)} .gw-wiersz.pol-czeka{border-style:dashed;border-color:var(--t-akc)} .gw-wiersz-link{flex:1 1 220px;min-width:0;display:flex;flex-direction:column;justify-content:center;gap:2px;box-sizing:border-box;min-height:56px;padding:8px 12px; border-radius:10px;color:var(--t-txt);text-decoration:none} a.gw-wiersz-link:hover{background:var(--t-sur2);color:var(--t-txt)} .gw-w1{display:flex;align-items:baseline;flex-wrap:wrap;gap:2px 6px;min-width:0} .gw-godz{font-size:16px;font-variant-numeric:tabular-nums;color:var(--t-txt)} .gw-godz-do{margin-left:-4px;font-size:12.5px;color:var(--t-mut);font-variant-numeric:tabular-nums} .gw-w1 .gw-kto{flex:1 1 auto;min-width:0} .gw-stan{margin-left:auto} .gw-stan .gw-plakietki,.gw-w2 .gw-plakietki{display:inline-flex;margin-top:0;vertical-align:middle} .gw-w2{font-size:13px;color:var(--t-mut);overflow-wrap:anywhere} .gw-seria{color:var(--t-akc);font-weight:700;font-style:normal} .gw-wiersz>.gw-trening{align-self:center;min-height:44px;margin:6px 10px 6px 0} .gw-wiersz>.gw-wiersz-sprzedaj{align-self:center;display:flex;flex-wrap:wrap;gap:4px;margin:6px 10px 6px 0} .gw-wiersz>.gw-pol,.gw-wiersz>.gw-szybki,.gw-wiersz>.gw-pol-zmien{flex:1 0 100%} .gw-wiersz>.gw-pol{margin:0;padding:0 12px 10px} .gw-szybki{display:flex;flex-wrap:wrap;gap:6px;padding:0 12px 10px} .gw-szybki form{margin:0} .gw-szybki-btn{min-height:44px;padding:0 14px;border-radius:10px;border:1px solid var(--t-ok);background:rgba(52,211,153,.12);color:var(--t-ok);font-size:14px;font-weight:700;cursor:pointer} .gw-szybki-btn:hover{background:rgba(52,211,153,.22)} .gw-szybki-btn.wtorny{border-color:var(--t-lin);background:transparent;color:var(--t-txt)} .gw-szybki-btn.wtorny:hover{background:var(--t-sur2)} .gw-odwolane{margin:6px 0 0} .gw-odwolane>summary{display:inline-flex;align-items:center;min-height:44px;padding:0 4px;color:var(--t-mut);font-size:13px;font-weight:600;list-style:none;cursor:pointer} .gw-odwolane>summary::-webkit-details-marker{display:none} .gw-odwolane>summary::before{content:"▸";margin-right:6px} .gw-odwolane[open]>summary::before{content:"▾"} .gw-odwolane .gw-lista{margin:4px 0 6px} .gw-tylko-odwolane{margin:0 0 6px;font-size:13px} /* Lista: filtry w chipach nad listą (GR2) — status, prowadzący, osoba szukaniem, zakres 14 dni strzałkami */ .gw-filtry{display:flex;flex-direction:column;gap:8px;margin:0 0 14px} .gw-filtr-rzad{display:flex;flex-wrap:wrap;align-items:center;gap:6px} .gw-filtr-rzad .tr-chip{min-height:44px;text-decoration:none} .gw-filtr-szukaj{display:flex;gap:8px;margin:0} .gw-filtr-szukaj .tr-pole{flex:1 1 auto;min-width:0} .gw-filtr-szukaj .tr-btn{flex:0 0 auto} .gw-zakres{padding:0 6px;font-size:14px;font-weight:700;color:var(--t-txt);font-variant-numeric:tabular-nums} /* strona terminu i jej arkusze (GR11, A17, AU5): czynności w przyciskach, Przesuń kaflami ze skutkiem, seria — dopisek i podgląd */ .g-akcje-terminu{display:flex;flex-wrap:wrap;gap:8px} .g-akcje-terminu .tr-btn{flex:1 1 140px} .tr-btn.g-btn-zle{border-color:rgba(229,72,77,.6);color:var(--t-zle)} .g-arkusz-czynnosci{display:grid;grid-template-columns:repeat(auto-fit,minmax(96px,1fr));gap:8px;margin-top:12px} .g-arkusz-czynnosci .tr-btn{padding:0 8px;font-size:13.5px} .g-seria-dopisek{margin:8px 0 0;padding:10px 12px;border:1px solid var(--t-lin);border-radius:12px;background:#0f1115;font-size:13.5px;line-height:1.4;color:#c9ced6} .g-seria-dopisek a{color:#ff8a47} .g-kafel.g-kafel-kolizja{border-style:dashed;border-color:rgba(229,72,77,.6)} .g-kafel.g-kafel-kolizja .g-kafel-pod{color:var(--t-zle)} .g-kafel.g-kafel-ost .g-kafel-pod{color:var(--t-ost)} .g-przesun-inny{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:0 10px} @supports selector(:has(*)){ .g-przesun-inny{display:none} .g-forma:has(input[name="na"][value="inna"]:checked) .g-przesun-inny, .g-forma:has(input[name="na"][value="dzien"]:checked) .g-przesun-inny{display:grid} } .g-przesun-skutek{min-height:1.4em;margin:8px 0 0;font-size:13.5px;color:var(--t-ok)} .g-przesun-skutek.ost{color:var(--t-ost)} .g-przesun-skutek.zle{color:var(--t-zle)} .g-pole-godzina{font-variant-numeric:tabular-nums;letter-spacing:.02em} .g-podglad-lista{list-style:none;margin:8px 0 0;padding:0;border-top:1px solid var(--t-lin)} .g-podglad-lista li{display:flex;align-items:center;min-height:44px;box-sizing:border-box;padding:6px 0;border-bottom:1px solid var(--t-lin);font-size:13.5px; font-variant-numeric:tabular-nums;color:var(--t-txt)} .g-podglad-lista li.zle{color:var(--t-zle)} .g-podglad-lista li.pominiety{color:var(--t-mut)} .g-wlacznik{display:flex;align-items:center;gap:10px;min-height:48px;margin:6px 0 0;font-size:14px;color:var(--t-txt)} .g-wlacznik input{width:22px;height:22px;margin:0;accent-color:var(--t-akc)} /* nowy termin: zaznaczone w Tygodniu, powtarzanie (dni tygodnia 7 kafli), podgląd każdego terminu serii z polem wyboru */ p.g-wybrany.g-sloty{margin:0} .g-kafle-7{grid-template-columns:repeat(7,minmax(0,1fr));gap:6px} .g-kafle-7 .g-kafel{min-height:44px;padding:2px;font-size:14px!important} .g-podglad{display:flex;flex-direction:column;border:1px solid var(--t-lin);border-radius:12px;overflow:hidden} .g-pg-wiersz{display:flex;align-items:center;gap:12px;box-sizing:border-box;min-height:56px;margin:0;padding:8px 14px;border-top:1px solid var(--t-lin);background:var(--t-sur); color:var(--t-txt);font-size:14px;cursor:pointer} .g-pg-wiersz:first-of-type{border-top:0} .g-pg-wiersz input{flex:none;width:22px;height:22px;margin:0;accent-color:var(--t-akc)} .g-pg-tekst{display:flex;flex-direction:column;gap:1px;min-width:0} .g-pg-kiedy{font-weight:700;font-variant-numeric:tabular-nums} .g-pg-opis{font-size:12.5px;color:var(--t-ok);overflow-wrap:anywhere} .g-pg-wiersz.bez .g-pg-opis{color:var(--t-ost)} .g-pg-wiersz.kolizja{background:var(--t-zle-tlo);cursor:default} .g-pg-wiersz.kolizja .g-pg-opis{color:var(--t-zle)} .g-pg-wiersz.pominiety .g-pg-opis{color:var(--t-mut)} .g-pg-wiersz:has(input:not(:checked)) .g-pg-kiedy{color:var(--t-mut);text-decoration:line-through} .g-pg-bez{margin:0;border:0;border-top:1px solid #6b4a14;border-radius:0} .g-pg-bez p{margin:0} /* ============================================================================ MEDIA (dostawa M-A, kontrakt v76; UX_media §2b, makiety rząd 11) — prefiks md-. Klocki wspólne biorą Media gotowe: zakładki kk-zakladki, bloki kk-blok i wiersze kk-wiersz, arkusze kk-arkusz, liczniki pu-licznik, chipy tr-chip. Tu tylko to, czego nie było: siatka kalendarza z kropkami nurtów, pasek 8 etapów, plakietki etapów i nurtów, wiersz z kilkoma małymi formularzami. ============================================================================ */ main.md .md-zakladki-rzad{margin-top:4px} /* recenzja v76 (druga N2, N3): pasek „Zapisano” nie zasłania dołu strony; małe przyciski i chipy na drodze z sali — 44 px pod kciuk */ main.pw.md{padding-bottom:calc(96px + var(--t-dol))} main.md .tr-btn-maly,main.md .md-kal-pasek .tr-btn{min-height:44px;min-width:44px;display:inline-flex;align-items:center;justify-content:center} main.md .md-liczniki{grid-template-columns:repeat(2,minmax(0,1fr))} @media(min-width:901px){ main.md .md-liczniki{display:grid;grid-template-columns:repeat(4,minmax(0,1fr))} } .md-cykl{margin:0 0 12px;color:var(--t-mut);font-size:13.5px} .md-rzad{display:flex;flex-wrap:wrap;gap:8px;align-items:center} .md-rzad>.tr-pole{flex:1 1 180px;min-width:0} .md-akcje{display:flex;flex-wrap:wrap;gap:6px;align-items:center;justify-content:flex-end} .md-akcje form{margin:0} main.md form{margin:0} .md-pole-dlugie{min-height:96px;resize:vertical;line-height:1.4} .md-wlacznik{display:inline-flex;align-items:center;gap:8px;min-height:44px;font-size:14px;color:var(--t-txt)} .md-wlacznik input{width:22px;height:22px} .md-pod{display:flex;flex-wrap:wrap;gap:6px;margin:0 0 12px} .md-pod .tr-chip{min-height:44px;display:inline-flex;align-items:center;text-decoration:none} .md-crm{margin:0 0 12px;padding:10px 12px;border:1px dashed var(--t-lin);border-radius:12px;color:var(--t-mut);font-size:13.5px} /* plakietki etapu i nurtu */ .md-etap{font-size:12px;white-space:nowrap} .md-etap-akceptacja{color:#ff8a47;border-color:rgba(255,107,26,.6)} .md-etap-nagranie{color:var(--t-ost);border-color:#6b4a14} .md-etap-gotowe,.md-etap-zaplanowane{color:var(--t-ok);border-color:rgba(52,211,153,.45)} .md-etap-opublikowane{color:var(--t-mut)} .md-nurt{font-size:12px} .md-nurt-niebieski{--md-k:#60a5fa}.md-nurt-zolty{--md-k:#fbbf24}.md-nurt-pomaranczowy{--md-k:#ff6b1a}.md-nurt-zielony{--md-k:#34d399}.md-nurt-fioletowy{--md-k:#a78bfa}.md-nurt-szary{--md-k:#6b7280} .tr-chip.md-nurt{color:var(--md-k);border-color:var(--md-k)} /* kalendarz: telefon — kropki, komputer — tytuły */ .md-kal-pasek{display:flex;align-items:center;gap:8px;margin:0 0 10px} .md-kal-miesiac{flex:1;text-align:center;font-size:16px} .md-plus{text-decoration:none} .md-kal{display:grid;grid-template-columns:repeat(7,minmax(0,1fr));gap:3px;margin:0 0 8px;padding:8px;background:var(--t-sur);border:1px solid var(--t-lin);border-radius:14px} .md-kal-nazwa{text-align:center;font-size:11.5px;color:var(--t-mut);padding-bottom:4px} .md-kal-dzien{display:flex;flex-direction:column;align-items:center;gap:3px;min-height:48px;padding:5px 2px;border-radius:8px;border:1px solid transparent; color:#c9ced6!important;text-decoration:none;font-size:13px;min-width:0;box-sizing:border-box} .md-kal-dzien:hover{border-color:var(--t-lin)} .md-kal-dzien.minione{color:#6b7280!important} .md-kal-dzien.dzis{background:#22262e;border-color:#3a404b;color:var(--t-txt)!important;font-weight:700} .md-kal-dzien.wybrany{border:2px solid var(--t-akc);background:var(--t-sur2);color:var(--t-txt)!important} .md-kal-kropki{display:flex;gap:3px;flex-wrap:wrap;justify-content:center} .md-kropka{width:7px;height:7px;border-radius:50%;background:var(--md-k,#6b7280);box-sizing:border-box;display:inline-block} .md-kropka-nagranie{background:transparent;border:1.5px solid #c9ced6} .md-kropka-luka{background:transparent;border:1.5px dashed var(--t-mut)} .md-kal-tytuly{display:none} .md-legenda{display:flex;flex-wrap:wrap;gap:6px 14px;margin:0 0 12px;font-size:12.5px;color:#c9ced6} .md-legenda>span{display:inline-flex;align-items:center;gap:6px} @media(min-width:901px){ .md-kal-dzien{align-items:stretch;min-height:96px;padding:5px} .md-kal-kropki{display:none} .md-kal-tytuly{display:flex;flex-direction:column;gap:3px} .md-kal-tytul{font-size:11.5px;line-height:1.25;padding:3px 5px;border-radius:5px;background:color-mix(in srgb,var(--md-k,#6b7280) 16%,transparent); color:var(--t-txt);overflow:hidden;text-overflow:ellipsis;white-space:nowrap} .md-kal-tytul.md-luka{background:transparent;border:1px dashed #5f6672;color:var(--t-mut)} .md-kal-tytul.md-sezon{background:transparent;color:var(--t-mut)} } .md-luka-wiersz{border-top:1px solid var(--t-sur2)} .md-luka-forma,.md-pomysl-wstaw{padding:0 0 8px} .md-pomysl-wstaw{display:flex;flex-wrap:wrap;gap:8px;align-items:center;justify-content:space-between} .md-pomysl{grid-template-columns:minmax(0,1fr)} @media(min-width:601px){ .md-pomysl{grid-template-columns:minmax(0,1fr) auto} } /* karta pozycji: pasek 8 etapów */ .md-glowa .tr-tytul{margin-bottom:6px} .md-chipy{display:flex;flex-wrap:wrap;gap:6px;margin:0 0 10px} .md-etapy{display:flex;gap:3px;margin:4px 0 2px} .md-etapy-krok{flex:1 1 0;height:5px;border-radius:3px;background:var(--t-lin)} .md-etapy-krok.zrobione{background:var(--t-ok)} .md-etapy-pod{display:flex;justify-content:space-between;margin:0 0 8px;font-size:12px;color:var(--t-mut)} .md-etapy-pod strong{color:var(--t-ok)} .md-czynnosci{display:flex;flex-wrap:wrap;gap:8px;align-items:center;margin:0 0 12px} .md-czynnosci .tr-btn{text-decoration:none} .md-czynnosci a.tr-btn{display:inline-flex;align-items:center;justify-content:center} .md-paczka{border-color:rgba(52,211,153,.45)} /* M-B: wersja próbna na telefonie — pion 9:16 mieści się w ekranie razem z przyciskami pod nim */ .md-proba{border-color:var(--t-akc)} .md-wideo,.md-obraz{display:block;width:100%;max-width:420px;height:auto;max-height:68vh;margin:0 auto 10px;border-radius:10px;background:#000;object-fit:contain} .md-uwagi{margin:0 0 8px} .md-proba form+form{margin-top:4px} .md-pliki .kk-wiersz-wart{display:flex;gap:6px;flex-wrap:wrap;justify-content:flex-end} .md-pliki .kk-wiersz-wart form{display:inline} /* M-C: karuzela — podgląd slajdów przesuwany palcem (przewija się tylko pasek, nie strona), siatka zdjęć z telefonu, przycisk wgrywania 44 px */ .md-karuzela{display:flex;gap:10px;overflow-x:auto;scroll-snap-type:x mandatory;-webkit-overflow-scrolling:touch;margin:0 0 10px;padding-bottom:6px;overscroll-behavior-x:contain} .md-karuzela-slajd{flex:0 0 86%;max-width:420px;margin:0;scroll-snap-align:center} .md-karuzela-slajd .md-obraz{width:100%;max-height:none;margin:0} .md-karuzela-slajd figcaption{text-align:center;font-size:13px;color:var(--t-mut);margin-top:4px} .md-zdjecia{display:grid;grid-template-columns:repeat(auto-fill,minmax(96px,1fr));gap:8px;margin:0 0 10px} .md-zdjecie{margin:0;min-width:0} .md-zdjecie img{display:block;width:100%;aspect-ratio:1;object-fit:cover;border-radius:8px;background:#000} .md-zdjecie figcaption{display:flex;flex-direction:column;gap:4px;font-size:13px;margin-top:4px} .md-zdjecie-akcje{display:flex;gap:4px;flex-wrap:wrap} .md-zdjecie figcaption form{display:inline} .md-zdjecie[data-media-zdjecie-zgoda=""] figcaption>span:first-child{color:var(--t-ost)} .md-zdjecie[data-media-zdjecie-zgoda="nie"] figcaption>span:first-child{color:var(--t-zle)} .md-zdjecie-duze{max-height:40vh;margin:0 auto 10px} .md-wgraj{position:relative;display:inline-flex;align-items:center;justify-content:center;min-height:44px;cursor:pointer;margin:4px 0} .md-wgraj input{position:absolute;inset:0;width:100%;opacity:0;cursor:pointer} .md-slajd .kk-wiersz-wart{display:flex;gap:6px;flex-wrap:wrap;justify-content:flex-end} .md-slajd .kk-wiersz-wart form{display:inline} .md-slajd .tr-btn-maly{min-width:44px;min-height:44px} /* strzałki kolejności — palcem na sali (recenzja v78 N5) */ /* v79 (M-D): publikacja automatyczna — zaznaczenie „Sprawdziłem” przy ponowieniu przerwanej publikacji, 44 px palcem */ .md-zaznacz{display:inline-flex;align-items:center;gap:8px;min-height:44px;font-size:14px} .md-hook{margin:4px 0 8px;font-weight:700;line-height:1.4} .md-md{line-height:1.55;overflow-wrap:anywhere} .md-md h2,.md-md h3,.md-md h4{margin:14px 0 6px;font-size:16px} .md-md mark{background:var(--t-ost-tlo);color:var(--t-ost)} .md-md code{font-size:13px;background:var(--t-sur2);padding:0 4px;border-radius:4px} .md-md blockquote{margin:8px 0;padding-left:10px;border-left:3px solid var(--t-lin);color:#c9ced6} .md-praca{padding:10px 0;border-top:1px solid var(--t-sur2)} .md-praca p{margin:0 0 4px} .md-sila{font-size:13px;color:#c9ced6} .md-sila-najmocniejszy,.md-sila-mocny{color:var(--t-ok)} .md-sila-slaby{color:var(--t-zle)} .md-wycofana,.md-pilne{color:var(--t-zle)!important;border-color:var(--t-zle)!important} .md-sprawdz{margin:8px 0 4px} .md-opis-licznik.md-za-duzo{color:var(--t-zle)} main.md button.tr-btn:hover,main.md a.tr-btn:hover{border-color:var(--t-akc)} /* ============================================================================ ANATOMIA (dostawa A-1, kontrakt v80; AN1–AN12) — słownik ciała, karta hasła, mapa, ruchy. Przedrostek an-. Klocki www z góry pliku (tr-glowa, tr-chip, tr-pole, tr-karta, kk-zakladki); tu tylko to, czego nie ma. Kolory partii na mapie — te same co w prototypie z 11.11 (MAPA_CIALA_proba_bodyparts3d). ============================================================================ */ .an a.an-link{color:var(--t-akc);text-decoration:none} .an a.an-link:hover{text-decoration:underline} .an-wroc{margin:0 0 8px;font-size:14px} .an-ile{color:var(--t-mut);font-size:13px;margin:4px 2px 8px} .an-h2{font-size:15px;font-weight:700;margin:16px 0 8px;color:var(--t-txt)} .an-meta{color:var(--t-mut);font-size:12.5px;margin:3px 0 0} .an-la{font-style:italic;color:var(--t-txt);opacity:.86;margin:3px 0 0} .an-en{color:var(--t-txt);margin:1px 0 0} .an-lab{display:inline-block;width:32px;font-size:11px;font-style:normal;font-weight:600;letter-spacing:.04em;color:var(--t-mut)} .an-lab-dl{color:var(--t-mut);font-weight:600;font-size:12.5px;margin-right:4px} .an-stopka{color:var(--t-mut);font-size:12px;margin:18px 2px 0} .an-dzialy{flex-wrap:nowrap;overflow-x:auto;scrollbar-width:none;padding-bottom:2px} .an-dzialy::-webkit-scrollbar{display:none} .an-dzialy .tr-chip{flex:0 0 auto} .an-szukaj .tr-pole{margin-top:4px} /* hasło na liście */ .an-haslo{display:block;background:var(--t-sur);border:1px solid var(--t-lin);border-radius:16px;padding:12px 14px;margin-bottom:10px;color:var(--t-txt);text-decoration:none} a.an-haslo:hover{border-color:#3a414d} .an-haslo-glowa{display:flex;justify-content:space-between;align-items:flex-start;gap:10px} .an-haslo-nazwa{font-size:16px;font-weight:700;line-height:1.25} .an-haslo-dzial{flex:0 0 auto;max-width:42%;text-align:right;font-size:12px;color:var(--t-mut);border:1px solid var(--t-lin);border-radius:999px;padding:2px 9px;line-height:1.3} .an-niesprawdzona{color:var(--t-ost)} .an mark{background:var(--t-akc-tlo);color:inherit;border-radius:3px;padding:0 1px} /* karta hasła */ .an-karta-glowa{display:flex;justify-content:space-between;align-items:flex-start;gap:10px} .an-nazwa{margin:0;font-size:20px;font-weight:800;line-height:1.2} .an-karta .tr-chipy .tr-chip{color:var(--t-txt)} .an-kropka{width:10px;height:10px;border-radius:50%;display:inline-block;flex:0 0 auto} .an-rel{display:grid;grid-template-columns:max-content 1fr;gap:6px 12px;margin:14px 0 6px;font-size:14px} .an-rel dt{color:var(--t-mut);font-size:12.5px;font-weight:600;padding-top:2px} .an-rel dd{margin:0;line-height:1.45} @media (max-width:420px){ .an-rel{grid-template-columns:1fr;gap:2px} .an-rel dd{margin-bottom:8px} } .an-form{border-top:1px solid var(--t-lin);margin-top:14px;padding-top:12px;display:grid;gap:10px} .an-form-akcje{display:flex;flex-wrap:wrap;gap:8px} .an-kolejka{margin:0;padding:0 0 0 18px;line-height:1.6} /* ruchy */ .an-akcja{border-top:1px solid var(--t-lin);padding:10px 0} .an-akcja:first-child{border-top:0;padding-top:0} .an-akcja p{margin:3px 0} .an-akcja-nazwa{font-weight:700} /* mapa */ .an-mapa-rzad{display:flex;flex-wrap:wrap;gap:6px;margin:0 0 8px} .an-legenda{margin:0 0 10px} .an-legenda .tr-chip{color:var(--t-txt)} .an-grupa-wybor{display:block;margin:0 0 12px} .an-widoki{display:flex;gap:16px;justify-content:center} .an-widok{flex:1 1 0;max-width:420px} .an .mc{width:100%;height:auto;max-height:78vh;display:block;margin:0 auto;touch-action:manipulation} .an .mc .mc-cialo{fill:#3a3f48} .an .mc .mc-kosci{fill:#d9d4c7} .an .mc g path{fill:#8a8585;stroke:#0a0b0d;stroke-width:.6;cursor:pointer;transition:opacity .15s} .an .mc.an-wybor g path{opacity:.14} .an .mc.an-wybor g path.an-g{opacity:1;stroke:#fff;stroke-width:1.2} .an .mc.an-wybor g path.an-p{opacity:.6} .an-info{position:sticky;bottom:calc(var(--t-dol) + 8px);background:var(--t-sur);border:1px solid var(--t-lin);border-radius:14px;padding:12px 14px;margin:12px 0 0;min-height:64px;display:grid;gap:4px} .an-info strong{font-size:16px} .an-info .tr-btn{justify-self:start;margin-top:6px;min-height:44px} @media (max-width:767px){ .an-widoki{display:block} .an-widok{max-width:none} .an-widok[hidden]{display:none} } @media (min-width:768px){ [data-an-widok]{display:none} .an-widok[hidden]{display:block} } .an-kropka[data-an-kolor="Barki"],.an .mc g[data-partia="Barki"] path{background:#f08c26;fill:#f08c26} .an-kropka[data-an-kolor="Klatka piersiowa"],.an .mc g[data-partia="Klatka piersiowa"] path{background:#d94040;fill:#d94040} .an-kropka[data-an-kolor="Plecy"],.an .mc g[data-partia="Plecy"] path{background:#4073d9;fill:#4073d9} .an-kropka[data-an-kolor="Brzuch"],.an .mc g[data-partia="Brzuch"] path{background:#f2cc33;fill:#f2cc33} .an-kropka[data-an-kolor="Biceps"],.an .mc g[data-partia="Biceps"] path{background:#8c4dcc;fill:#8c4dcc} .an-kropka[data-an-kolor="Triceps"],.an .mc g[data-partia="Triceps"] path{background:#4db3bf;fill:#4db3bf} .an-kropka[data-an-kolor="Przedramiona"],.an .mc g[data-partia="Przedramiona"] path{background:#73bf59;fill:#73bf59} .an-kropka[data-an-kolor="Czworogłowe Uda"],.an .mc g[data-partia="Czworogłowe Uda"] path{background:#e6668c;fill:#e6668c} .an-kropka[data-an-kolor="Dwugłowe Uda/Pośladki"],.an .mc g[data-partia="Dwugłowe Uda/Pośladki"] path{background:#59998c;fill:#59998c} .an-kropka[data-an-kolor="Łydki"],.an .mc g[data-partia="Łydki"] path{background:#b38c59;fill:#b38c59} .an-kropka[data-an-kolor="Szyja"],.an .mc g[data-partia="Szyja"] path{background:#bf9ed9;fill:#bf9ed9} /* ANATOMIA A-2 (kontrakt v81): mała mapa na kartach, ćwiczenia mięśnia, lista i karta ćwiczenia */ .an-mini-rzad{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin:14px 0 4px} .an-mini-widok{text-align:center;background:var(--t-bg);border:1px solid var(--t-lin);border-radius:12px;padding:6px 4px} .an-mini-widok .an-meta{display:block;margin:0 0 2px} .an .mc.an-mini{max-height:300px;pointer-events:none} .an-mini-akcje{margin:6px 0 0} .an-mini-akcje .tr-btn,.an-propozycja .tr-btn{min-height:44px} .an-h3{font-size:14px;font-weight:700;margin:16px 0 4px;color:var(--t-txt)} .an-cw-miesnia{margin:6px 0} .an-cw-lista{margin:2px 0 0;padding:0 0 0 18px} .an-cw-lista a{display:inline-flex;align-items:center;min-height:44px} .an-filtr{background:var(--t-sur);border:1px solid var(--t-lin);border-radius:12px;padding:10px 12px;margin:0 0 10px;font-size:14px} .an-polacz{margin-bottom:12px} .an-propozycja{margin:12px 0 0} .an-propozycja p{margin:0 0 8px} .an-akcje{display:flex;flex-wrap:wrap;gap:6px} .an-akcja-chip,.an-cel-chip{color:var(--t-txt);gap:2px;padding-right:2px;min-height:44px} .an-inline{display:inline;margin:0} .an-x{min-width:44px;min-height:44px;border:0;background:transparent;color:var(--t-mut);font-size:18px;line-height:1;cursor:pointer;border-radius:999px;font-family:inherit} .an-x:hover{color:var(--t-zle);background:transparent} .an-x.potwierdz{color:var(--t-zle);font-size:14px;font-weight:700;padding:0 8px} .an-rola{display:flex;gap:16px;font-size:15px} .an-rola label{display:inline-flex;align-items:center;gap:6px;min-height:44px} .an-rola input{width:20px;height:20px;accent-color:var(--t-akc)} /* ANATOMIA 3D (kontrakt v82): model na Mapie, na karcie hasła i ćwiczenia; „Za co odpowiada” */ .an-3d{margin:14px 0 4px;display:flex;flex-direction:column;gap:8px} .an-3d-scena{position:relative;border:1px solid var(--t-lin);border-radius:16px;overflow:hidden;background:radial-gradient(120% 80% at 50% 30%,#1a1e25 0%,var(--t-bg) 70%);height:min(52vh,460px);min-height:320px;touch-action:pan-y} .an-3d-scena.an-3d-duza{height:min(68vh,640px);min-height:380px;touch-action:none} .an-3d-scena canvas{display:block;width:100%;height:100%} .an-3d-komunikat[hidden]{display:none} .an-3d-komunikat{position:absolute;inset:0;display:grid;place-items:center;margin:0;padding:16px;text-align:center;color:var(--t-mut);font-size:14px} .an-3d-widoki{position:absolute;top:8px;right:8px;display:flex;flex-direction:row;gap:6px} .an-3d-widoki .tr-chip{min-height:44px;min-width:56px;justify-content:center;background:rgba(10,11,13,.72)} .an-3d-info{min-height:24px;font-size:15px} .an-3d-nazwa{font-weight:700;color:var(--t-txt)} .an-3d-zrodlo{margin:0} .an-3d-reszta,.an-3d-przelacz{margin-top:0;align-items:center} .an-3d-reszta .tr-chip,.an-3d-przelacz .tr-chip,.an-3d .an-legenda .tr-chip,.an-3d-pokaz .tr-chip{min-height:44px} /* v84: warstwy mięśni na modelu (lewy górny róg — dolny chowa się na telefonie pod paskiem nawigacji) */ .an-3d-warstwy{position:absolute;left:8px;top:8px;display:flex;flex-direction:column;align-items:flex-start;gap:6px} .an-3d-warstwy .an-3d-krok{min-width:48px;min-height:48px;justify-content:center;font-size:24px;line-height:1;background:rgba(10,11,13,.72)} .an-3d-warstwy .an-3d-krok:disabled{opacity:.4} .an-3d-pokaz .tr-chip[hidden]{display:none} .an-3d-warstwa-nr{padding:6px 10px;border-radius:10px;background:rgba(10,11,13,.72);color:var(--t-txt);font-size:13px;font-weight:600;white-space:nowrap} .an-3d[data-an-3d-stan="wczytuje"] .an-3d-warstwy,.an-3d[data-an-3d-stan="blad"] .an-3d-warstwy, .an-3d[data-an-3d-stan="wczytuje"] .an-3d-pokaz,.an-3d[data-an-3d-stan="blad"] .an-3d-pokaz{display:none} .an-3d-przelacz{margin:4px 0 2px} .an-3d-zdejmij{display:flex;flex-wrap:wrap;gap:8px;align-items:center} .an-3d-zdejmij .tr-btn{min-height:44px} .an-3d-probnik{position:absolute;width:1px;height:1px;opacity:0;pointer-events:none} /* v87: wybór kilku struktur na Mapie — wyszukiwarka, lista wybranych z krzyżykiem, reszta ciała; „+ Do wyboru” przy nazwie dotkniętej części */ .an-3d-wybor{display:flex;flex-direction:column;gap:8px} .an-3d-wybor[hidden]{display:none} .an-3d-wyniki{display:flex;flex-direction:column;gap:6px} .an-3d-wyniki:empty{display:none} .an-3d-wynik{display:flex;flex-direction:column;align-items:flex-start;gap:2px;width:100%;min-height:48px;padding:8px 12px;border:1px solid var(--t-lin);border-radius:12px;background:var(--t-sur);color:var(--t-txt);font:inherit;text-align:left;cursor:pointer} .an-3d-wynik:disabled{opacity:.55;cursor:default} .an-3d-wynik-nazwa{font-size:15px;font-weight:700;line-height:1.25} .an-3d-wybrane[hidden]{display:none} .an-3d-wybrane{display:flex;flex-direction:column;gap:8px;padding:10px 12px;border:1px solid var(--t-lin);border-radius:14px;background:var(--t-sur)} .an-3d-wybrane .an-meta{margin:0} .an-3d-wybrane .tr-chip,.an-3d-dodaj{min-height:44px} .an-3d-wybrany{max-width:100%;text-align:left} .an-3d-x{margin-left:2px;font-size:12px;opacity:.75} .an-3d-wybrane .tr-btn{align-self:flex-start;min-height:44px} .an-3d-dodaj{vertical-align:middle} /* przy ukrytej reszcie (albo samych kościach) warstwy i tkanki nic nie zmieniają — chowamy je */ .an-3d[data-an-3d-reszta-stan="ukryj"] .an-3d-warstwy,.an-3d[data-an-3d-reszta-stan="ukryj"] .an-3d-pokaz [data-an-3d-pokaz], .an-3d[data-an-3d-reszta-stan="kosci"] .an-3d-warstwy,.an-3d[data-an-3d-reszta-stan="kosci"] .an-3d-pokaz [data-an-3d-pokaz]{display:none} /* v88: narzędzia w polu modelu (Piotr 12.11: „opcje … dostępne stricte w polu czy tam panelu modelu”) — dymek z nazwą, arkusze, pasek; pełny ekran */ .an-3d-dol{position:absolute;left:8px;right:8px;bottom:8px;display:flex;flex-direction:column;gap:6px;pointer-events:none} .an-3d-dol>*{pointer-events:auto} .an-3d-pasek{display:flex;gap:4px;padding:4px;background:rgba(10,11,13,.78);border:1px solid var(--t-lin);border-radius:14px} .an-3d-narzedzie{flex:1 1 0;min-width:0;min-height:44px;padding:0 6px;border:0;border-radius:10px;background:transparent;color:var(--t-txt);font:inherit;font-size:13px;font-weight:600; display:inline-flex;align-items:center;justify-content:center;text-decoration:none;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;cursor:pointer} .an-3d-narzedzie.wl{background:var(--t-akc);color:#0a0b0d} .an-3d-narzedzie[hidden]{display:none} .an-3d-narzedzie-ikona{flex:0 0 48px;font-size:18px} .an-3d-arkusz{display:flex;flex-direction:column;gap:8px;max-height:min(46vh,340px);overflow:auto;overscroll-behavior:contain;padding:10px 12px; background:rgba(22,25,31,.95);border:1px solid var(--t-lin);border-radius:14px} .an-3d-arkusz[hidden]{display:none} .an-3d-arkusz-tytul{margin:0;font-size:13px;font-weight:700;color:var(--t-mut)} .an-3d-arkusz .an-3d-wybrane{padding:0;border:0;background:none} .an-3d-info-rzad{display:flex;flex-wrap:wrap;align-items:center;gap:6px;padding:6px 10px;background:rgba(10,11,13,.82);border:1px solid var(--t-lin);border-radius:12px} .an-3d-info-rzad[hidden]{display:none} .an-3d-info-rzad .an-3d-info{flex:1 1 auto;min-height:0} .an-3d-info-rzad [data-an-3d-zdejmij][hidden]{display:none} .an-3d[data-an-3d-stan="wczytuje"] .an-3d-dol,.an-3d[data-an-3d-stan="blad"] .an-3d-dol{display:none} .an-3d.an-3d-pelny{position:fixed;inset:0;z-index:197;margin:0;padding:calc(env(safe-area-inset-top) + 8px) 8px calc(env(safe-area-inset-bottom) + 8px);background:var(--t-bg)} .an-3d.an-3d-pelny .an-3d-scena{flex:1 1 auto;height:auto;min-height:0} .an-3d.an-3d-pelny .an-stopka,.an-3d.an-3d-pelny .an-3d-zrodlo{display:none} html.an-3d-bez-przewijania,html.an-3d-bez-przewijania body{overflow:hidden} .tr-link-anatomia{display:inline-flex;align-items:center;min-height:44px;margin:2px 0 4px;color:var(--t-akc);font-size:14px;text-decoration:none} .an-opis{margin:12px 0 4px;padding:12px 0 0;border-top:1px solid var(--t-lin)} .an-opis .an-h3{margin-top:0} .an-opis-zdanie{margin:0 0 8px;color:var(--t-txt)} .an-opis-lista{margin:0 0 8px;line-height:1.6} .an-obszar{margin:10px 0 0} .an-obszar-nazwa{margin:0 0 4px;font-size:13px;letter-spacing:.04em;text-transform:uppercase;color:var(--t-mut)} .an-ruchy{display:flex;flex-wrap:wrap;gap:6px} .an-ruch-chip{min-height:44px;color:var(--t-txt);text-decoration:none;gap:8px} .an-ruch-chip.an-ruch-g{border-color:var(--t-akc);background:var(--t-akc-tlo)} .an-ruch-chip.an-ruch-p{border-style:dashed} .an-rola-txt{font-size:12px;color:var(--t-mut)} /* ===== v83 — UX Mediów po wgraniu (MU1–MU5; UX_media_przeglad §3) ===== */ /* MU1: jeden wygląd przycisku — przyciski-linki bez podkreślenia, jak w innych modułach */ main.md a.tr-btn,main.md a.tr-btn:hover{text-decoration:none;display:inline-flex;align-items:center;justify-content:center} /* MU1: nagłówek bloku widoczny po skoku z Dziś — odstęp na lepki pasek zakładek (na karcie pozycji zakładek nie ma) */ main.md:not(.md-karta) [id]{scroll-margin-top:60px} main.md.md-karta [id]{scroll-margin-top:8px} @media(min-width:901px){ main.md:not(.md-karta) [id]{scroll-margin-top:calc(var(--belka-wys, 56px) + 64px)} main.md.md-karta [id]{scroll-margin-top:calc(var(--belka-wys, 56px) + 8px)} } /* MU1: wyraźne strzałki miesiąca; luka w kolorze nurtu */ .md-kal-strzalka{font-size:24px;font-weight:700;line-height:1} .md-kropka-luka{border-color:var(--md-k,var(--t-mut))} @media(min-width:901px){ .md-kal-tytul.md-luka[class*="md-nurt-"]{border-color:var(--md-k);color:var(--md-k)} } /* MU3: „⚙ Ustawienia” obok tytułu */ .md-glowa-ekranu{display:flex;align-items:center;justify-content:space-between;gap:8px} .md-glowa-ekranu .tr-tytul{margin-bottom:0} .md-ustawienia-link{white-space:nowrap;color:var(--t-txt)} /* MU2: liczniki z zerem wyszarzone; szybki pomysł w jednym rzędzie pod licznikami */ .md-licznik-zero{opacity:.5} .md-szybki{margin:0 0 12px} .md-szybki .tr-pole{flex:1 1 180px;min-width:0} /* MU4: Miesiąc / Lista, dni w Liście, linia „Bez daty” */ .md-widoki{margin:0 0 10px} .md-lista-dzien{margin:12px 0 0;padding-top:8px;border-top:1px solid var(--t-lin);font-size:13px;font-weight:700;color:var(--t-txt)} .kk-blok-tytul+.md-lista-dzien{margin-top:2px;padding-top:0;border-top:0} .md-lista-dzien+.kk-wiersz{border-top:0} .md-bez-daty{margin:0 0 12px} /* MU5: karta pozycji — etap nad paskiem, „⋯”, bloki zwinięte do jednej linii, miniatura jako przycisk, film do 55% ekranu */ main.md .md-etapy-pod{margin:2px 0 4px} main.md .md-etapy{margin:0 0 8px} .md-wiecej{display:inline-block} .md-wiecej[open]{flex-basis:100%} .md-wiecej>summary{list-style:none;cursor:pointer;font-size:18px;letter-spacing:.05em} .md-wiecej>summary::-webkit-details-marker{display:none} .md-wiecej-menu{margin-top:6px;max-width:320px;padding:8px;background:var(--t-sur2);border:1px solid var(--t-lin);border-radius:12px;box-shadow:0 8px 24px rgba(0,0,0,.45)} .md-wiecej-menu form{margin:0} .md-wiecej-menu .tr-btn{width:100%;justify-content:flex-start} details.kk-blok>summary.kk-blok-tytul{display:flex;align-items:center;gap:8px;min-height:44px;cursor:pointer;list-style:none} details.kk-blok>summary.kk-blok-tytul::-webkit-details-marker{display:none} details.kk-blok>summary.kk-blok-tytul::after{content:"+";margin-left:auto;font-size:16px} details.kk-blok[open]>summary.kk-blok-tytul::after{content:"−"} details.kk-blok:not([open]){padding-bottom:0} .md-zdjecie-link{display:block;border-radius:8px} .md-zdjecie-link:focus-visible{outline:2px solid var(--t-akc);outline-offset:2px} main.md .md-wideo{max-height:55vh;max-height:55svh;width:auto;max-width:100%}