/* zakladka-stopka.css – style zakładki „Stopka” (zakladka-stopka.js; kontener dostaje klasę .zakladka-stopka).
   Uzupełnienie kreator.css (paleta, typografia i elementy szablonu Orisa: karty, kafelki, pigułki, znaczniki, okna)
   i pin.css (PIN cyfra po cyfrze). KAŻDA reguła jest ograniczona do zakładki – :where(.zakladka-stopka) – więc nie
   zmienia kreatora, Edytora, linków ani rejestru; :where() nie dodaje specyficzności (ten plik wczytywany po kreator.css).
   Okna (dialog) są w kontenerze zakładki, więc te same reguły obejmują okno PIN i okno potwierdzenia.
   Karta „Dane pracownika”: pierwsze pole – e-mail z „Sprawdź” i komunikatem pod spodem, zwijane „Szukaj po nazwisku”,
   pole wyboru „Ukryj w książce adresowej”; karta list i zespołów: pola wyboru kreatora (label.pozycja z kreator.css),
   rozwijane kanały zespołu, „Dodaj do zaznaczonych (N)” i wynik każdej pozycji.
   Telefon 320 px: wszystko w jednej kolumnie, długie adresy i nazwy się łamią, przyciski zawijają napis. */

/* ---------------------------------------------------------------- wybór firmy */
:where(.zakladka-stopka) .zs-pusto { margin: 0; padding: 44px 16px; text-align: center; color: var(--muted); font-weight: 500; }
:where(.zakladka-stopka) .kafelek .kafelek-opis b { color: var(--tekst); font-weight: 600; }

/* ---------------------------------------------------------------- pasek wybranej firmy i banery */
:where(.zakladka-stopka) .zs-pasek { margin-bottom: 20px; }
:where(.zakladka-stopka) .zs-pasek-akcje { display: flex; flex-wrap: wrap; align-items: center; justify-content: flex-end; gap: 10px 12px; min-width: 0; }
:where(.zakladka-stopka) .zs-info-blokady { max-width: 380px; }
:where(.zakladka-stopka) .zs-info-blokady:empty { display: none; }
:where(.zakladka-stopka) .zs-banery { display: grid; gap: 8px; margin-bottom: 20px; }
:where(.zakladka-stopka) .zs-banery:empty { display: none; }
:where(.zakladka-stopka) .zs-banery .baner { margin: 0; overflow-wrap: anywhere; }
:where(.zakladka-stopka) .baner .zs-do-edytora { margin: 8px 0 0; padding: 8px 14px; font-size: 14px; vertical-align: middle; }
:where(.zakladka-stopka) .zs-test { margin: 8px 0 0; padding: 0 0 0 18px; display: grid; gap: 4px; }
:where(.zakladka-stopka) .zs-test li.blad { color: var(--at-czerwien-ciemna); }

/* ---------------------------------------------------------------- układ: formularz z lewej, stopka i wizytówka z prawej */
:where(.zakladka-stopka) .zs-uklad { display: grid; grid-template-columns: minmax(0, 1fr); gap: 24px; align-items: start; }
:where(.zakladka-stopka) .zs-kolumna { display: grid; gap: 24px; min-width: 0; }
/* od 1200 px: stopka i wizytówka obok formularza (bez przyklejania – obie karty zawsze widoczne w zwykłym przewijaniu) */
@media (min-width: 1200px) {
  :where(.zakladka-stopka) .zs-uklad { grid-template-columns: minmax(0, 1fr) minmax(0, 520px); }
}

:where(.zakladka-stopka) .zs-karta { display: grid; gap: 16px; align-content: start; }
:where(.zakladka-stopka) .zs-karta > h2, :where(.zakladka-stopka) .zs-karta .naglowek-sekcji h2 { font-size: 24px; line-height: 1.1; letter-spacing: -0.05em; margin: 0; }
:where(.zakladka-stopka) .zs-karta .naglowek-sekcji { margin-bottom: 0; align-items: center; }
:where(.zakladka-stopka) .zs-info:empty, :where(.zakladka-stopka) .zs-info-zmian:empty { display: none; }
:where(.zakladka-stopka) .zs-info { overflow-wrap: anywhere; }
:where(.zakladka-stopka) .zs-podpowiedz { font-size: 13px; line-height: 1.5; }
:where(.zakladka-stopka) .zs-info-zmian { color: var(--tekst-2); }

/* ---------------------------------------------------------------- e-mail pracownika z „Sprawdź” (pierwsze pole karty) */
:where(.zakladka-stopka) .zs-email { display: grid; gap: 10px; }
:where(.zakladka-stopka) :is(.zs-email, .zs-szukaj) .pole { gap: 12px; }
:where(.zakladka-stopka) :is(.zs-email, .zs-szukaj) .z-przyciskiem { flex-wrap: wrap; }
:where(.zakladka-stopka) :is(.zs-email, .zs-szukaj) .z-przyciskiem input { flex: 1 1 220px; }
:where(.zakladka-stopka) :is(.zs-email, .zs-szukaj) .z-przyciskiem button { flex: none; height: 56px; padding: 0 24px; }
:where(.zakladka-stopka) .zs-email input[type="email"] { font-size: 16px; font-weight: 600; }
/* komunikat pod polem: kropka w kolorze stanu jak znacznik szablonu (.stock-dot) */
:where(.zakladka-stopka) .zs-komunikat { position: relative; padding-left: 16px; overflow-wrap: anywhere; color: var(--tekst-2); }
:where(.zakladka-stopka) .zs-komunikat:empty { display: none; }
:where(.zakladka-stopka) .zs-komunikat::before {
  content: ''; position: absolute; left: 0; top: .62em; width: 6px; height: 6px; border-radius: 50%; background: var(--ramka-mocna);
}
:where(.zakladka-stopka) .zs-komunikat.ok::before { background: var(--at-zielen-jasna); }
:where(.zakladka-stopka) .zs-komunikat.uwaga::before { background: var(--at-bursztyn); }
:where(.zakladka-stopka) .zs-komunikat.blad { color: var(--at-czerwien-ciemna); }
:where(.zakladka-stopka) .zs-komunikat.blad::before { background: var(--at-czerwien); }
:where(.zakladka-stopka) .zs-komunikat-akcja { display: flex; flex-wrap: wrap; gap: 8px; padding-left: 16px; }
:where(.zakladka-stopka) .zs-komunikat-akcja .zs-do-edytora { margin: 0; padding: 8px 14px; font-size: 14px; }
:where(.zakladka-stopka) .zs-upn { padding-left: 16px; font-size: 13px; overflow-wrap: anywhere; }

/* „Szukaj po nazwisku” – zwijana sekcja pod polem e-mail (mniejsza wersja pytania FAQ szablonu: znak + / −) */
:where(.zakladka-stopka) .zs-szukaj-nazwisko { border-top: 1px solid var(--ramka); border-bottom: 1px solid var(--ramka); }
:where(.zakladka-stopka) .zs-szukaj-nazwisko > summary {
  display: flex; align-items: center; justify-content: space-between; gap: 12px; min-height: var(--dotyk); padding: 6px 0;
  list-style: none; cursor: pointer; font-size: 16px; font-weight: 600; letter-spacing: -0.02em; color: var(--tekst);
}
:where(.zakladka-stopka) .zs-szukaj-nazwisko > summary::-webkit-details-marker { display: none; }
:where(.zakladka-stopka) .zs-szukaj-nazwisko > summary::after {
  content: ''; flex: none; width: 28px; height: 28px;
  background:
    linear-gradient(var(--at-common-black), var(--at-common-black)) center / 12px 1.5px no-repeat,
    linear-gradient(var(--at-common-black), var(--at-common-black)) center / 1.5px 12px no-repeat;
  transition: transform .4s ease;
}
:where(.zakladka-stopka) .zs-szukaj-nazwisko[open] > summary::after { background: linear-gradient(var(--at-common-black), var(--at-common-black)) center / 12px 1.5px no-repeat; transform: rotate(180deg); }
:where(.zakladka-stopka) .zs-szukaj-nazwisko > summary:focus-visible { outline: 2px solid var(--at-neutral-900); outline-offset: 2px; border-radius: 6px; }
:where(.zakladka-stopka) .zs-szukaj-tresc { display: grid; gap: 12px; padding: 4px 0 16px; }

/* ---------------------------------------------------------------- wyniki szukania */
:where(.zakladka-stopka) .zs-wyniki { list-style: none; margin: 0; padding: 0; display: grid; gap: 8px; }
:where(.zakladka-stopka) .zs-wyniki:empty { display: none; }
/* przycisk-karta wyniku: treść od lewej (przyciski kreatora mają justify-content: center) */
:where(.zakladka-stopka) button.zs-wynik {
  display: grid; grid-template-columns: minmax(0, 1fr); gap: 4px; justify-content: stretch; justify-items: start; align-items: start;
  width: 100%; padding: 14px 18px; border-radius: 14px;
  text-align: left; white-space: normal; letter-spacing: -0.02em; font-weight: 500; line-height: 1.35;
}
:where(.zakladka-stopka) button.zs-wynik.wybrany { border-color: var(--at-neutral-900); box-shadow: inset 3px 0 0 var(--at-neutral-900); }
:where(.zakladka-stopka) button.zs-wynik.wylaczone { background: var(--panel); }
:where(.zakladka-stopka) .zs-wynik-nazwa { display: flex; flex-wrap: wrap; align-items: center; gap: 6px 10px; font-size: 16px; font-weight: 600; overflow-wrap: anywhere; }
:where(.zakladka-stopka) .zs-wynik-adres { font-size: 14px; color: var(--tekst-2); overflow-wrap: anywhere; }
:where(.zakladka-stopka) .zs-wynik-opis { font-size: 13px; color: var(--muted); overflow-wrap: anywhere; }
:where(.zakladka-stopka) .zs-wynik .znacznik { padding: 5px 10px 5px 9px; font-size: 11px; }
@media (hover: hover) {
  :where(.zakladka-stopka) button.zs-wynik:hover { background: var(--podswietlenie); color: var(--tekst); border-color: var(--at-neutral-900); }
  :where(.zakladka-stopka) button.zs-wynik:hover .zs-wynik-adres { color: var(--tekst-2); }
}

/* ---------------------------------------------------------------- formularz danych pracownika */
:where(.zakladka-stopka) .zs-formularz { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 22px 20px; }
:where(.zakladka-stopka) .zs-formularz .pole { gap: 10px; }
:where(.zakladka-stopka) .zs-formularz .pole.szeroka { grid-column: 1 / -1; }
:where(.zakladka-stopka) .zs-formularz .etykieta { font-size: 14px; }
:where(.zakladka-stopka) .zs-formularz input:not([type="checkbox"]) { height: 50px; padding: 0 20px; }
:where(.zakladka-stopka) .zs-formularz input[readonly] { background: var(--panel); color: var(--tekst-2); cursor: default; }
:where(.zakladka-stopka) .zs-formularz .opis { font-size: 13px; line-height: 1.4; overflow-wrap: anywhere; }
:where(.zakladka-stopka) .zs-przyciski { margin-top: 4px; }
:where(.zakladka-stopka) .zs-karta > .baner { margin: 0; }
/* „Ukryj w książce adresowej (Outlook, Teams)” – pole wyboru kreatora (24 px) z opisem stanu pod spodem */
:where(.zakladka-stopka) .zs-ukryj { grid-column: 1 / -1; display: grid; gap: 6px; padding: 14px 16px; border: 1px solid var(--ramka); border-radius: 12px; }
:where(.zakladka-stopka) .zs-ukryj .opcja { align-items: flex-start; gap: 12px; font-size: 15px; font-weight: 600; color: var(--tekst); line-height: 1.4; }
:where(.zakladka-stopka) .zs-ukryj .opcja input { margin-top: -2px; }
:where(.zakladka-stopka) .zs-ukryj:has(input:disabled) .opcja { cursor: not-allowed; color: var(--tekst-2); }
:where(.zakladka-stopka) .zs-ukryj > .opis { padding-left: 36px; }

/* ---------------------------------------------------------------- grupy */
:where(.zakladka-stopka) .zs-chipy { list-style: none; margin: 0; padding: 0; display: flex; flex-wrap: wrap; gap: 8px; }
:where(.zakladka-stopka) .zs-chipy:empty { display: none; }
:where(.zakladka-stopka) .zs-chip {
  --kropka: var(--ramka-mocna);
  display: inline-grid; gap: 2px; max-width: 100%; padding: 8px 14px; border: 1px solid var(--ramka); border-radius: 14px; background: var(--karta);
}
:where(.zakladka-stopka) .zs-chip-typ { display: inline-flex; align-items: center; gap: 6px; font-size: 11px; font-weight: 600; letter-spacing: .02em; text-transform: uppercase; color: var(--muted); }
:where(.zakladka-stopka) .zs-chip-typ::before { content: ''; width: 6px; height: 6px; border-radius: 50%; background: var(--kropka); }
:where(.zakladka-stopka) .zs-chip-nazwa { font-size: 14px; font-weight: 600; overflow-wrap: anywhere; }
:where(.zakladka-stopka) .zs-chip.typ-teams { --kropka: #5b5fc7; }
:where(.zakladka-stopka) .zs-chip.typ-m365 { --kropka: var(--at-zielen); }
:where(.zakladka-stopka) .zs-chip.typ-dystrybucyjna { --kropka: var(--at-theme-primary); }
:where(.zakladka-stopka) .zs-chip.typ-zabezpieczen { --kropka: var(--at-neutral-900); background: var(--panel); }
/* listy obok siebie tylko, gdy każda ma co najmniej 300 px (wąska kolumna formularza przy 1200–1400 px – jedna pod drugą) */
:where(.zakladka-stopka) .zs-grupy { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(300px, 100%), 1fr)); gap: 20px; }
:where(.zakladka-stopka) .zs-grupy-kolumna { display: grid; gap: 10px; align-content: start; min-width: 0; }
:where(.zakladka-stopka) .zs-grupy-naglowek { display: flex; flex-wrap: wrap; align-items: baseline; justify-content: space-between; gap: 4px 10px; }
:where(.zakladka-stopka) .zs-grupy-naglowek h3 { margin: 0; font-size: 18px; }
:where(.zakladka-stopka) .zs-grupy-kolumna input[type="search"] { height: 46px; }
:where(.zakladka-stopka) .zs-grupy-lista {
  list-style: none; margin: 0; padding: 4px; display: grid; gap: 2px; max-height: 420px; overflow-y: auto; overscroll-behavior: contain;
  border: 1px solid var(--ramka); border-radius: 14px; scrollbar-width: thin;
}
:where(.zakladka-stopka) .zs-grupy-lista:empty { display: none; }
/* wiersz: pole wyboru kreatora (label.pozycja: 24 px, czarne z białym ✓) + nazwa i adres; zespół – przycisk „Kanały”,
   pod wierszem rozwinięte kanały */
:where(.zakladka-stopka) .zs-grupa { display: flex; flex-wrap: wrap; align-items: center; gap: 2px 8px; min-width: 0; }
:where(.zakladka-stopka) .zs-pozycja { flex: 1 1 200px; gap: 12px; padding: 8px 10px; border-radius: 10px; }
:where(.zakladka-stopka) .zs-pozycja .pozycja-tekst { gap: 2px; }
:where(.zakladka-stopka) .zs-pozycja .pozycja-tekst .nazwa { font-size: 14px; overflow-wrap: anywhere; }
:where(.zakladka-stopka) .zs-pozycja .pozycja-tekst .opis { font-size: 12px; line-height: 1.4; white-space: normal; overflow: visible; overflow-wrap: anywhere; }
:where(.zakladka-stopka) .zs-pozycja .pozycja-tekst .zs-dopisek { color: var(--tekst-2); }
/* „już członek” pod nazwą (w kolumnie tekstu, nie obok niej) */
:where(.zakladka-stopka) .zs-pozycja .zs-znaczniki { flex-basis: auto; justify-content: flex-start; max-width: none; margin-top: 4px; padding-left: 0; }
:where(.zakladka-stopka) .zs-pozycja .znacznik { padding: 5px 10px 5px 9px; font-size: 11px; }
:where(.zakladka-stopka) .zs-pozycja:has(input:checked:disabled) { cursor: default; }
:where(.zakladka-stopka) .zs-grupa > .zs-kanaly-przycisk { flex: none; gap: 6px; margin-right: 6px; padding: 8px 14px; font-size: 14px; }
:where(.zakladka-stopka) .zs-kanaly {
  flex: 1 1 100%; display: grid; gap: 6px; min-width: 0; margin: 0 6px 8px 34px; padding: 6px 0 6px 12px; border-left: 2px solid var(--ramka);
}
:where(.zakladka-stopka) .zs-kanaly > .opis { font-size: 13px; line-height: 1.45; overflow-wrap: anywhere; }
:where(.zakladka-stopka) .zs-kanaly > .blad-tekst { margin: 0; font-size: 13px; overflow-wrap: anywhere; }
:where(.zakladka-stopka) .zs-kanaly > button { justify-self: start; padding: 8px 14px; font-size: 14px; }
:where(.zakladka-stopka) .zs-kanaly-lista { list-style: none; margin: 0; padding: 0; display: grid; gap: 2px; }
:where(.zakladka-stopka) .zs-kanal { display: flex; min-width: 0; }

/* „Dodaj do zaznaczonych (N)” i wynik każdej pozycji */
:where(.zakladka-stopka) .zs-dodawanie { display: flex; flex-wrap: wrap; align-items: center; gap: 10px 16px; }
:where(.zakladka-stopka) .zs-dodawanie > button { flex: none; }
:where(.zakladka-stopka) .zs-dodawanie > .opis { flex: 1 1 240px; min-width: 0; }
:where(.zakladka-stopka) .zs-wyniki-dodawania { list-style: none; margin: 0; padding: 0; display: grid; gap: 6px; }
:where(.zakladka-stopka) .zs-wyniki-dodawania:empty { display: none; }
/* wynik pozycji: nazwa i typ z lewej, stan (znacznik) z prawej, opis błędu pod spodem; telefon – wszystko jedno pod drugim */
:where(.zakladka-stopka) .zs-wynik-dodania {
  display: grid; grid-template-columns: minmax(0, 1fr) auto; grid-template-areas: "nazwa stan" "typ stan" "opis opis"; gap: 2px 12px; align-items: center;
  padding: 10px 14px; border: 1px solid var(--ramka); border-radius: 12px; font-size: 14px; line-height: 1.4;
}
:where(.zakladka-stopka) .zs-wynik-dodania.blad { border-color: rgba(239, 65, 54, .3); }
:where(.zakladka-stopka) .zs-wynik-dodania.trwa { border-color: var(--at-neutral-900); }
:where(.zakladka-stopka) .zs-wd-nazwa { grid-area: nazwa; font-weight: 600; color: var(--tekst); overflow-wrap: anywhere; }
:where(.zakladka-stopka) .zs-wd-typ { grid-area: typ; font-size: 12px; color: var(--muted); overflow-wrap: anywhere; }
:where(.zakladka-stopka) .zs-wynik-dodania .znacznik { grid-area: stan; justify-self: end; padding: 5px 10px 5px 9px; font-size: 11px; }
:where(.zakladka-stopka) .zs-wd-opis { grid-area: opis; color: var(--tekst-2); overflow-wrap: anywhere; }
:where(.zakladka-stopka) .zs-wynik-dodania.blad .zs-wd-opis { color: var(--at-czerwien-ciemna); }

/* znaczniki stanu (kreator.css: .znacznik) */
:where(.zakladka-stopka) .znacznik.ok { --kropka: var(--at-zielen-jasna); }
:where(.zakladka-stopka) .znacznik.blad { --kropka: var(--at-czerwien); background: rgba(239, 65, 54, .06); border-color: rgba(239, 65, 54, .3); color: var(--at-czerwien-ciemna); }

/* ---------------------------------------------------------------- historia zmian (rozwijana jak pomoc kreatora) */
:where(.zakladka-stopka) .zs-historia { display: block; }
:where(.zakladka-stopka) .zs-historia > .opis { padding-bottom: 10px; }
:where(.zakladka-stopka) .zs-historia-lista { list-style: none; margin: 0 0 14px; padding: 0; display: grid; gap: 8px; }
:where(.zakladka-stopka) .zs-historia-lista:empty { display: none; }
:where(.zakladka-stopka) .zs-wpis {
  display: grid; grid-template-columns: auto minmax(0, 1fr) auto; grid-template-areas: "czas akcja wynik" "cel cel cel" "opis opis opis";
  gap: 4px 12px; padding: 12px 14px; border: 1px solid var(--ramka); border-radius: 12px; font-size: 14px; line-height: 1.4;
}
:where(.zakladka-stopka) .zs-wpis-czas { grid-area: czas; color: var(--muted); font-variant-numeric: tabular-nums; white-space: nowrap; }
:where(.zakladka-stopka) .zs-wpis-akcja { grid-area: akcja; font-weight: 600; min-width: 0; }
:where(.zakladka-stopka) .zs-wpis .znacznik { grid-area: wynik; justify-self: end; padding: 5px 10px 5px 9px; font-size: 11px; }
:where(.zakladka-stopka) .zs-wpis-cel { grid-area: cel; overflow-wrap: anywhere; }
:where(.zakladka-stopka) .zs-wpis-opis { grid-area: opis; color: var(--tekst-2); overflow-wrap: anywhere; }

/* ---------------------------------------------------------------- stopka: podgląd, telefon, akcje */
:where(.zakladka-stopka) .zs-segment { flex: none; }
:where(.zakladka-stopka) .zs-segment input { height: auto; }
:where(.zakladka-stopka) .zs-panel-stopki { display: grid; gap: 12px; min-width: 0; }
:where(.zakladka-stopka) .zs-podglad {
  display: block; width: 100%; height: 220px; border: 1px solid var(--ramka); border-radius: 12px; background: var(--at-common-white);
}
:where(.zakladka-stopka) .zs-telefon {
  margin: 0; padding: 16px 18px; min-height: 140px; border: 1px solid var(--ramka); border-radius: 12px; background: var(--at-common-white);
  font: 500 15px/1.6 var(--at-ff-body); color: var(--tekst); white-space: pre-wrap; overflow-wrap: anywhere;
}
:where(.zakladka-stopka) .zs-telefon.zs-pusty { color: var(--muted); font-size: 14px; }
:where(.zakladka-stopka) .zs-telefon:focus-visible { outline: 2px solid var(--at-neutral-900); outline-offset: 2px; }
:where(.zakladka-stopka) .zs-akcje { display: grid; grid-template-columns: repeat(auto-fit, minmax(150px, 1fr)); gap: 8px; }
:where(.zakladka-stopka) .zs-akcje button { gap: 6px; padding: 10px 14px; font-size: 14px; letter-spacing: -0.03em; white-space: normal; text-align: center; }
:where(.zakladka-stopka) .zs-akcje .zs-szeroki { grid-column: 1 / -1; }

/* wizytówka QR: kod zawsze ciemny na białym (czytnik potrzebuje kontrastu) */
:where(.zakladka-stopka) .zs-qr-ramka { display: grid; place-items: center; min-height: 180px; padding: 16px; border: 1px solid var(--ramka); border-radius: 12px; background: var(--at-common-white); }
:where(.zakladka-stopka) .zs-qr { display: block; width: 216px; max-width: 100%; height: auto; image-rendering: pixelated; }
:where(.zakladka-stopka) .zs-qr-pusto { text-align: center; max-width: 320px; }

/* zapasowe kopiowanie stopki (kreator.css: .schowek-ukryty) */
:where(.zakladka-stopka) .zs-schowek { color: #000; }

/* ---------------------------------------------------------------- okna */
:where(.zakladka-stopka) .zs-okno-szerokie { width: min(640px, calc(100vw - 24px)); }
:where(.zakladka-stopka) .zs-okno .okno-naglowek h2 { overflow-wrap: anywhere; }
:where(.zakladka-stopka) .zs-okno .okno-naglowek .opis { overflow-wrap: anywhere; }
:where(.zakladka-stopka) .zs-pin-slaby { display: grid; gap: 12px; margin-top: 14px; padding: 14px 16px; border-radius: 12px; background: rgba(245, 158, 11, .12); }
:where(.zakladka-stopka) .zs-pin-slaby .przyciski-rzad button { white-space: normal; }
:where(.zakladka-stopka) .zs-potw-tresc:empty { display: none; }
:where(.zakladka-stopka) .zs-roznice { list-style: none; margin: 0; padding: 0; display: grid; gap: 8px; }
:where(.zakladka-stopka) .zs-roznice li { display: grid; gap: 4px; padding: 12px 14px; border: 1px solid var(--ramka); border-radius: 12px; }
:where(.zakladka-stopka) .zs-roznica-pole { font-size: 12px; font-weight: 600; letter-spacing: .02em; text-transform: uppercase; color: var(--muted); }
:where(.zakladka-stopka) .zs-roznica-wartosci { font-size: 15px; line-height: 1.45; overflow-wrap: anywhere; }
:where(.zakladka-stopka) .zs-roznica-wartosci del { color: var(--muted); text-decoration-thickness: 1px; }
:where(.zakladka-stopka) .zs-roznica-wartosci ins { text-decoration: none; font-weight: 600; color: var(--tekst); }
:where(.zakladka-stopka) .zs-strzalka { color: var(--muted); }
:where(.zakladka-stopka) .zs-potw-grupa { font-size: 15px; line-height: 1.5; overflow-wrap: anywhere; }
:where(.zakladka-stopka) .zs-okno .przyciski-rzad.prawo button { white-space: normal; }

/* ---------------------------------------------------------------- tablet i telefon */
@media (max-width: 767.98px) {
  :where(.zakladka-stopka) .zs-grupy { grid-template-columns: minmax(0, 1fr); }
  :where(.zakladka-stopka) .zs-pasek-akcje { justify-content: flex-start; }
}
@media (max-width: 575.98px) {
  :where(.zakladka-stopka) .zs-pusto { padding: 32px 12px; }
  :where(.zakladka-stopka) .zs-formularz { grid-template-columns: minmax(0, 1fr); gap: 18px; }
  :where(.zakladka-stopka) .zs-pasek-akcje { width: 100%; }
  :where(.zakladka-stopka) .zs-pasek-akcje button { flex: 1 1 auto; }
  :where(.zakladka-stopka) .zs-info-blokady { flex-basis: 100%; max-width: none; }
  :where(.zakladka-stopka) button { white-space: normal; }
  :where(.zakladka-stopka) .zs-przyciski button { flex: 1 1 100%; }
  :where(.zakladka-stopka) :is(.zs-email, .zs-szukaj) .z-przyciskiem button { flex: 1 1 100%; height: 48px; }
  :where(.zakladka-stopka) .zs-grupa > .zs-kanaly-przycisk { margin: 0 0 6px 46px; }
  :where(.zakladka-stopka) .zs-kanaly { margin-left: 12px; }
  :where(.zakladka-stopka) .zs-dodawanie > button { flex: 1 1 100%; }
  :where(.zakladka-stopka) .zs-wynik-dodania { grid-template-columns: minmax(0, 1fr); grid-template-areas: "nazwa" "typ" "stan" "opis"; gap: 4px; }
  :where(.zakladka-stopka) .zs-wynik-dodania .znacznik { justify-self: start; }
  :where(.zakladka-stopka) .zs-ukryj { padding: 12px 14px; }
  :where(.zakladka-stopka) .zs-akcje { grid-template-columns: minmax(0, 1fr); }
  :where(.zakladka-stopka) .zs-karta .naglowek-sekcji { gap: 12px; }
  :where(.zakladka-stopka) .zs-wpis { grid-template-columns: minmax(0, 1fr) auto; grid-template-areas: "czas wynik" "akcja akcja" "cel cel" "opis opis"; }
  :where(.zakladka-stopka) .zs-telefon { padding: 14px; }
}