/* ═══════════════════════════════════════════════════════════════════════
   panel-v14.css — wygląd v14 (strona główna) w panelu (20.10.2026)

   Panel czytał stare nazwy tokenów (`--paper`, `--gold`, `--ink`…) z palety
   ciepłej kości i złota, a strona główna — nowe (`--powierzchnia`, `--akcent`,
   `--tusz`…). Ten arkusz mapuje stare nazwy na wartości v14 (to samo robi
   `wspolne.css` na podstronach, panel go nie ładuje) i poprawia kształty,
   których same zmienne nie ruszają: przycisk-pigułka, karty o dużych
   promieniach, jeden pasek powiadomień. Ładuje się ostatni.
   ═══════════════════════════════════════════════════════════════════════ */
:root:root{
  --paper:var(--powierzchnia);--white:#fff;--karta:#fff;--bok:var(--powierzchnia);
  --ink:var(--tusz);--ink2:var(--tusz2);--ink3:var(--tusz3);
  --t1:var(--tusz);--t2:var(--tekst2);--t3:var(--tekst3);
  --gold:var(--akcent);--gold-m:var(--akcent);--gold-d:var(--akcent-d);--gold-l:var(--akcent-l);
  --line:var(--linia);--line2:var(--linia2);
  --risk:var(--koszt);--risk-l:var(--koszt-l);
  --fd:var(--f);
}
html,body{background:#fff}
::selection{background:oklch(58.5% .132 257/.22);color:var(--tusz)}
:focus-visible{outline-color:var(--akcent)}

/* ── tokeny: tylko motyw jasny (ciemny zostaje z panel-c.css) ───────── */
:root:root:not([data-theme=dark]){
  --f:"Inter","Segoe UI Variable Text","Segoe UI",system-ui,-apple-system,Arial,sans-serif;
  --fm:var(--f);
  --paper:var(--powierzchnia);--white:#fff;--karta:#fff;--bok:var(--powierzchnia);--pow-3:oklch(95.5% .003 300);
  --t1:var(--tusz);--t2:var(--tekst2);--t3:var(--tekst3);
  --gold:var(--akcent);--gold-m:var(--akcent);--gold-d:var(--akcent-d);--gold-l:var(--akcent-l);
  --ink:var(--tusz);--ink2:var(--tusz2);--ink3:var(--tusz3);
  --line:var(--linia);--line2:var(--linia2);
  --ok:#137046;--warn:#8a5a00;--risk:var(--koszt);--risk-l:var(--koszt-l);
  --fokus:var(--akcent);
  --r-kontrolka:12px;--r-wewn:12px;--r-powierzchnia:20px;--r-pigulka:99px;
}
:root:root[data-theme=dark]{--f:"Inter","Segoe UI Variable Text","Segoe UI",system-ui,-apple-system,Arial,sans-serif;--fm:var(--f);
  --r-kontrolka:12px;--r-wewn:12px;--r-powierzchnia:20px;--r-pigulka:99px}
:root:root:not([data-theme=dark]) html,:root:root:not([data-theme=dark]) body{background:#fff}
.num,table td,.d10 [class*=liczba],.d10-war{font-variant-numeric:tabular-nums}

/* ── przyciski jak na stronie głównej: pigułka, główny czarny, drugi z obrysem ── */
:root:root .btn,:root:root .btn.mini{min-height:44px;padding:0 20px;border-radius:99px;font-size:var(--fs-2);font-weight:500}
:root:root .btn.zwarty,:root:root .lupa{min-height:44px;padding:0 16px;border-radius:99px}
:root:root:not([data-theme=dark]) .btn.g{background:var(--tusz);border-color:var(--tusz);color:#fff}
:root:root:not([data-theme=dark]) .btn.g:hover:not(:disabled){background:var(--tusz3);border-color:var(--tusz3)}
:root:root:not([data-theme=dark]) .btn.g:active:not(:disabled){background:var(--tusz2)}
:root:root:not([data-theme=dark]) .btn.g:disabled{background:var(--linia);border-color:transparent;color:var(--tekst3)}
:root:root:not([data-theme=dark]) .btn.o{background:#fff;border-color:var(--linia2);color:var(--tusz)}
:root:root:not([data-theme=dark]) .btn.o:hover:not(:disabled){background:var(--powierzchnia);border-color:var(--tusz)}
:root:root .btn.t{border-radius:99px}

/* Inter nie potrzebuje ściśniętej spacji z kroju o stałej szerokości */
:root:root .dc-v b,.dc-z b,.dc-n [data-d10-liczba],.dc .dc-tab .num{word-spacing:0}

/* ── JEDEN pasek powiadomień: przykładowy gabinet, awaria zapisu, zmiana karty ──
   Dotąd trzy różne paski: czarny/kremowy na całą szerokość z przyciskiem przy
   krawędzi okna, bordowy z białym tekstem i trzeci bez obramowania. Teraz jedna
   karta o tym samym promieniu co reszta panelu, wcięta od krawędzi, z tekstem
   po lewej i przyciskiem tuż obok, nie na końcu 1440 px. */
:root:root .przyklad-pas,:root:root .awaria,:root:root .zmiana-karty{
  display:flex;flex-wrap:wrap;align-items:center;gap:8px 16px;box-sizing:border-box;
  margin:10px 12px 0;padding:6px 8px 6px 16px;min-height:52px;
  border:1px solid var(--linia);border-radius:16px;
  background:var(--powierzchnia);color:var(--tusz);font-size:var(--fs-2);line-height:1.5}
:root:root .przyklad-pas{grid-column:1/-1;justify-content:flex-start}
:root:root .przyklad-pas b,:root:root .awaria b{color:var(--tusz);font-weight:600}
:root:root .przyklad-pas>span{flex:0 1 auto;min-width:0}
:root:root .przyklad-pas .btn{margin-left:4px}
:root:root .awaria{background:oklch(97% .02 25);border-color:oklch(85% .06 25)}
:root:root .awaria b{color:var(--koszt)}
:root:root .awaria .btn{border-color:var(--linia2);color:var(--tusz);background:#fff}
:root:root .awaria .btn:hover{background:var(--powierzchnia);color:var(--tusz);border-color:var(--tusz)}
:root:root .zmiana-karty{background:oklch(97% .02 257);border-color:oklch(87% .05 257)}
:root:root .zmiana-karty .btn,:root:root .awaria .awaria-akcje{margin-left:4px}
:root:root .przyklad-pas,:root:root .awaria,:root:root .zmiana-karty{justify-self:center;width:fit-content;max-width:calc(100% - 24px)}
:root:root .awaria[hidden],:root:root .zmiana-karty[hidden]{display:none}
@media(max-width:900px){
  :root:root .przyklad-pas,:root:root .awaria,:root:root .zmiana-karty{margin:8px 8px 0;padding:4px 6px 4px 12px;min-height:52px;flex-wrap:nowrap;width:auto;max-width:none;justify-self:stretch}
  :root:root .awaria,:root:root .zmiana-karty{flex-wrap:wrap}
}

/* Belka na telefonie: tytuł ekranu ma się mieścić, a przycisk akcji nie wchodzić pod ikony.
   „Wgraj dane" zostaje w dolnym menu („Więcej") i w ekranie Dane. */
@media(max-width:600px){
  :root:root .gora #wgraj-dane{display:none}
  :root:root .gora .prawo{flex:0 0 auto}
  :root:root .gora .prawo .btn{padding:0 14px;white-space:nowrap}
}

/* ═══════════════════════════════════════════════════════════════════════
   Pulpit „Dziś” i lewy pasek wg makiety zaakceptowanej 20.10.2026
   Pasek: 272 px, pozycje 44 px, aktywna w obramowaniu, pod pozycjami grup
   żadnych szarych podpisów (podstrony mówią, co w środku). Pulpit: pięć
   kart liczb, „Wymaga uwagi” obok kaskady, wykres pod spodem.
   ═══════════════════════════════════════════════════════════════════════ */
@media(min-width:901px){
  :root:root.c-rozw{--szyna:272px}
  html.c-rozw .bok{padding:16px 14px 12px;gap:2px;background:#fff}
  html.c-rozw .bok .znak{height:36px;margin-bottom:10px;padding:0 6px}
  html.c-rozw .bok .znak>span{font-size:18px;font-weight:600;letter-spacing:-.02em}
  html.c-rozw .bok a.men-glowa,html.c-rozw .c-menu-przycisk{min-height:44px;height:44px;padding:0 12px;border-radius:14px;gap:12px;font-weight:500;color:var(--tusz2)}
  html.c-rozw .bok a.men-glowa .men-ik{width:20px;height:20px;stroke-width:1.7}
  html.c-rozw .bok a.men-glowa .c-nazwa{font-size:14px}
  html.c-rozw .bok a.men-glowa:hover,html.c-rozw .bok a.men:hover,html.c-rozw .c-menu-przycisk:hover{background:var(--powierzchnia)}
  html.c-rozw .bok a.men-glowa[aria-current]{background:#fff;box-shadow:inset 0 0 0 1px var(--linia2);color:var(--tusz)}
  html.c-rozw .bok .men-pod{margin:4px 0 6px 21px;padding-left:12px}
  html.c-rozw .bok .men-pod a.men{min-height:40px;height:40px;padding:0 12px;border-radius:12px;font-size:14px;color:var(--tusz2)}
  html.c-rozw .bok a.men[aria-current=page]{background:#fff;box-shadow:inset 0 0 0 1px var(--linia2);color:var(--tusz);font-weight:600}
  html.c-rozw .bok a.men[aria-current=page]::before{left:-13px;top:10px;bottom:10px;width:2px;border-radius:2px;background:var(--akcent)}
  html.c-rozw .bok .c-lic{margin-left:auto;min-width:22px;height:22px;padding:0 7px;border-radius:99px;background:var(--akcent);color:#fff;font-size:12px;font-weight:600;display:inline-grid;place-items:center}
  html.c-rozw .bok .c-dol{display:grid;gap:8px;margin-top:auto;padding:12px 0 8px;border-top:1px solid var(--linia)}
  html.c-rozw .bok .c-dol~.stopka{margin-top:0}
  html.c-rozw .bok .c-wgraj,html.c-rozw .bok .c-faktury{display:flex;align-items:center;justify-content:center;gap:8px;min-height:44px;padding:0 18px;border-radius:99px;border:1px solid var(--tusz);font-weight:600;font-size:14px;background:#fff;color:var(--tusz);text-decoration:none}
  html.c-rozw .bok .c-wgraj{background:var(--tusz);color:#fff}
  html.c-rozw .bok .c-wgraj .men-ik{color:#fff}
  html.c-rozw .bok .c-wgraj:hover{border-color:var(--tusz);background:var(--tusz2)}
  html.c-rozw .bok .c-faktury .men-ik{width:16px;height:16px;flex:0 0 auto}
  html.c-rozw .bok .uzyt{height:52px;border-radius:14px}
  html.c-rozw .bok .c-konto-ik{width:34px;height:34px;padding:8px;border-radius:50%;background:var(--powierzchnia);box-shadow:inset 0 0 0 1px var(--linia2);flex:none}
}
body[data-rola="recepcja"] .bok .c-faktury{display:none!important}
.c-faktury{display:none}

/* ── pulpit ── */
:root:root .dc-kpi{gap:12px;background:none;border:0;border-radius:0;margin-bottom:16px}
:root:root .dc-k{padding:16px 18px 14px;border:1px solid var(--linia);border-radius:20px;background:#fff;align-content:start}
:root:root .dc-k:first-child,:root:root .dc-k:last-child,:root:root .dc-k:nth-child(3){border-radius:20px}
:root:root .dc-k:hover{background:#fff}
:root:root .dc-k:first-child{background:var(--tusz);border-color:var(--tusz);color:#fff}
:root:root .dc-k:first-child :is(.dc-k-n,.dc-z,.dc-n,.dc-v span,.c-zl,.dc-i){color:rgba(255,255,255,.72)}
:root:root .dc-k:first-child .dc-v{color:#fff}
:root:root .dc-k:first-child .dc-chip{background:rgba(255,255,255,.14);color:#fff;border-color:transparent}
:root:root .dc-k-n{font-size:12px;letter-spacing:.06em}
:root:root .dc-v{font-size:32px;line-height:1.15;font-weight:600;letter-spacing:-.035em;margin-top:4px}
:root:root .dc-v span,:root:root .dc-v .c-zl{font-size:15px;font-weight:500;letter-spacing:0}
:root:root .dc-s,:root:root .dc-k .dc-b{display:none}
:root:root .dc-z,:root:root .dc-n{font-size:12px}
:root:root .dc-k:first-child .d10-delta.minus{color:#ffb3a8}
:root:root .dc-k:first-child .d10-delta.plus{color:#8fe3b4}

:root:root .dc-siatka{gap:16px}
@media(min-width:901px){
  :root:root .dc-siatka>.dc-uw{grid-column:span 7;order:-2;min-height:0}
  :root:root .dc-siatka>[data-d10-sekcja="kaskada"]{grid-column:span 5;order:-1}
  :root:root .dc-siatka>.dc-trend{grid-column:span 12}
}
:root:root .dc-siatka>.d10-k{border-radius:24px;border-color:var(--linia)}
:root:root .dc-siatka .d10-k-g{min-height:0;padding:20px 22px 0;border-bottom:0}
:root:root .dc-siatka .d10-k-g>div{align-items:baseline}
:root:root .dc-siatka .d10-oko{font-size:18px;font-weight:600;letter-spacing:-.02em;text-transform:none;color:var(--tusz)}
:root:root .dc-siatka .d10-k-g h2{font-size:14px;color:var(--tekst2)}
:root:root .dc-siatka .d10-odn{color:var(--akcent-d);font-weight:600}
:root:root .dc-siatka>.d10-k>.dc-t{padding:8px 22px 18px}
:root:root .dc-siatka>.d10-k>.dc-uw-t{padding:0 22px}
:root:root .dc-siatka>.d10-k>.d10-pokaz,:root:root .dc-siatka>.d10-k>.d10-jeszcze,:root:root .dc-siatka>.d10-k>.d10-przypis{margin-left:22px;margin-right:22px}
:root:root .dc .d10-przycisk{min-height:44px;height:auto;padding:0 18px;border-radius:99px;font-weight:500;font-size:14px;word-spacing:0}
@media(min-width:901px){
  :root:root .dc-uw .d10-dz{display:grid;grid-template-columns:minmax(0,1fr) auto;grid-template-areas:"t k";align-items:center;column-gap:16px;padding:14px 0}
  :root:root .dc-uw .d10-dz>.d10-dz-tresc{grid-area:t}
  :root:root .dc-uw .d10-dz>.d10-dz-kw{grid-area:k;margin:0;display:flex;flex-direction:column;align-items:flex-end;gap:2px;text-align:right}
  :root:root .dc-uw .d10-dz .d10-dz-kw .d10-przycisk{margin:0}
}
:root:root .dc .d10-przycisk.glowny{background:#fff;color:var(--tusz);border-color:var(--linia2)}
:root:root .dc-siatka>.dc-trend>.dc-t{min-height:220px}

/* pasek nad pulpitem: jedna linia, bez ucinania */
:root:root .d10-gora{margin-bottom:12px}

/* Podpisy w lewym pasku: bez wielokropka, zawijają się do 2 linii */
:root:root html.c-rozw .bok .c-konto-pod,
:root:root .bok .c-konto-pod,
:root:root .bok .c-konto-nagl b{white-space:normal;text-overflow:clip;overflow:visible;display:-webkit-box;-webkit-line-clamp:unset;line-height:1.25}

/* Telefon: przycisk „Otwórz przypadek” pod tekstem, treść na pełną szerokość */
@media(max-width:700px){
  :root:root .dc-uw .d10-dz{grid-template-columns:minmax(0,1fr)}
  :root:root .dc-uw .d10-dz .d10-przycisk{width:100%;justify-self:stretch}
}

/* Tryb przykładu: informacja „przykład” stoi tylko w górnym pasku z przyciskiem „Załóż konto” */
body:has(.przyklad-pas:not([hidden])) :is(.d10-demo,.d10-sync,.d10-przypis,.dm-p,.rm-zapis,.rm-adn,.rm-oko,.or-demo,.c-konto-pod,.c-okruch,.cen-przyklad){display:none!important}

/* Kwota i opis w działaniach: panel-c.css dawał całemu kontenerowi word-spacing:-.3em (zlepione słowa,
   „1862złponadlimitwmiesiącu”). Odstęp słów wraca do normy; opis może się zawinąć; przycisk się nie ściska. */
:root:root .d10-dz-kw,:root:root .d10-dz-kw b,:root:root .d10-dz-kw small{word-spacing:0}
:root:root .dc .d10-dz-kw small{white-space:normal;max-width:22ch}
:root:root .dc .d10-dz-kw .d10-przycisk{flex:none;white-space:nowrap;max-width:none;overflow:visible;text-overflow:clip}
/* Tekst opisowy w komórkach i akapitach z liczbami: ścieśnienie (-.3em) jest dla samych liczb,
   w zdaniach zjadało spacje. Nagłówki kolumn i opisy w środku wracają do normalnego odstępu. */
:root:root th,:root:root th *,:root:root td.k,
:root:root :is(td.k,.ce-wart,.wo-suma,.lk-l) :is(span,small,i,em):not(.c-zl):not(.num){word-spacing:0}