/* =============================================================================
   styl-cookieyes.css · baner zgód CookieYes w kolorach strony, dzień i noc (zadanie Przemka 24.10.2026)
   Ładowany WYŁĄCZNIE razem ze skryptem banera: znacznikCookieYes (src/uslugi/cookieyes.ts) wstawia <link> do <head> stron publicznych,
   gdy COOKIEYES_ID jest ustawiony; panel i API go nie dostają. Plik jest z tej samej domeny (CSP style-src 'self'), bez url() i bez
   żadnych adresów zewnętrznych (pilnuje test/uslugi/cookieyes_styl.test.ts).

   Dlaczego !important: CookieYes wstawia własny <style> PO naszych arkuszach i kolory z panelu jako atrybuty style="color:…;
   background-color:…; border-color:…" na elementach z data-cky-tag. Atrybut style przegrywa tylko z deklaracją !important w arkuszu.
   Klasy: markup CookieYes v3 (cky-consent-container, cky-consent-bar, cky-notice, cky-btn-accept/-reject/-customize, cky-modal,
   cky-preference-center, cky-switch, cky-btn-revisit-wrapper…). Ten markup NIE jest opisany w oficjalnej dokumentacji, a skrypt ładujący
   (script.js) go nie zawiera (jest w banner.js), więc każdy element łapiemy też po atrybucie data-cky-tag. Po wdrożeniu sprawdzić w DevTools
   (instrukcje/COOKIEYES-USTAWIENIA.md, krok 9); makieta: makiety/v12-cookieyes/.

   Dzień i noc: na stronie publicznej (styl C „Złota nić”) noc jest domyślna, także przy systemowym trybie jasnym; dzień = html[data-scena="jasna"]
   (ręczny wybór przełącznikiem, src/strony/skrypt_motywu.ts). Baner idzie za tym samym atrybutem, więc w każdej kombinacji data-motyw
   i prefers-color-scheme wygląda jak strona pod nim. Kolory to tokeny --cky-* liczone ze stałych styl.css (scena i krem), bez przejść
   kolorów: zmiana motywu przełącza baner w tej samej klatce co stronę (kurtyna View Transition w motyw.js obejmuje i baner).
   Złoto tylko jako linia i obręcz, nigdy tekst na kremie. Akceptuj i Odrzuć mają identyczny wygląd (bez ciemnych wzorców).

   Układ: pasek-karta przy dolnej krawędzi, ten sam dla układów CookieYes „Box” (cky-box-*, dziś na produkcji) i „Banner” (cky-banner-*).
   Telefon: tytuł 18 px, tekst bez wcięcia, pod nim [Odrzuć][Akceptuj] w jednym rzędzie w równych kolumnach, pod nimi „Dostosuj” na całą
   szerokość, „Powered by” małe (466x678: wysokość ≤ 45% okna, główny przycisk hero nad banerem). Box na telefonie dokłada własne reguły
   (wcięcia 0 24px, opis z max-height 40vh i przewijaniem, kolejność Akceptuj/Dostosuj/Odrzuć przez order): stąd jawne miejsca w siatce
   i zerowe wcięcia z !important (A10, 24.10.2026). 768-1023 (Duo rozłożony): karta w prawej połówce, za pasem zgięcia x 421-469,
   lewa połówka z tytułem i przyciskiem hero odsłonięta. Od 1024: tekst i trzy przyciski w jednej linii na dole.
   Warstwy: treść < pasek zamówienia (25) < pigułka dolna (30) < baner (35); przy otwartym menu mobilnym baner schodzi pod nagłówek (20).
   Okno urlopu i okno informacyjne to natywny <dialog> (warstwa top layer), więc są zawsze nad banerem i nad centrum preferencji.
   ============================================================================= */

/* ---------- Tokeny: noc (domyślna scena) ---------- */
:root {
  --cky-tlo: #1d0446;                                   /* --scena-tlo-jasniejsze: powierzchnia na scenie */
  --cky-tlo-2: #2a0d5e;                                 /* tabela ciasteczek, pole opisu kategorii */
  --cky-tekst: var(--krem-karty, #faf6ee);              /* 16,8:1 na --cky-tlo (pomiar makiety v12) */
  --cky-tekst-2: #cdc2e2;                               /* opis: 10,7:1 */
  --cky-naglowek: var(--krem-karty, #faf6ee);
  --cky-link: #dccbff;                                  /* 12,1:1 */
  --cky-linia: color-mix(in srgb, #f0c010 58%, transparent); /* złota nić: obwódka karty i przycisku „Dostosuj” */
  --cky-linia-cicha: color-mix(in srgb, #faf6ee 14%, transparent);
  --cky-przycisk-tlo: #faf6ee;                          /* perła jak .przycisk na scenie */
  --cky-przycisk-tekst: var(--sliwka-atrament, #300070);/* 14,3:1 na #faf6ee */
  --cky-przycisk-obrecz: 0 0 0 1px #f0c010;
  --cky-przycisk-tlo-hover: #ffffff;
  --cky-drugi-tekst: var(--krem-karty, #faf6ee);
  --cky-drugi-ramka: #f0c010;                           /* obręcz „Dostosuj”: 11:1 do tła, element nietekstowy */
  --cky-focus: #f0c010;                                 /* złoto na śliwce 10,6:1 */
  --cky-przelacznik-wl: #c9b3ff;                        /* akcent sceny (--sliwka-500) */
  --cky-przelacznik-wl-galka: #1d0446;
  --cky-przelacznik-wyl: #3e2272;
  --cky-przelacznik-wyl-ramka: #a99bc9;                 /* 7,1:1 do tła karty (próg 3:1) */
  --cky-przelacznik-wyl-galka: #cdc2e2;
  --cky-cien: 0 0 0 1px var(--cky-linia), 0 24px 48px -16px rgb(0 0 0 / 0.75);
  --cky-zaslona: rgb(19 2 44 / 0.72);                   /* jak tło okna informacyjnego */
  --cky-ikona-filtr: brightness(0) invert(1);           /* ikony CookieYes (zamknij, strzałka) na jasno */
  --cky-revisit-tlo: #faf6ee;
  --cky-revisit-ikona: brightness(0) saturate(100%);    /* ciemna ikona na perle */
  --cky-revisit-obrecz: 0 0 0 1px #f0c010, 0 0 0 4px var(--scena-tlo, #13022c), 0 0 0 5px color-mix(in srgb, #f0c010 58%, transparent);
}

/* ---------- Tokeny: dzień (ręczny wybór trybu jasnego) ---------- */
:root[data-scena="jasna"] {
  --cky-tlo: var(--krem-karty, #faf6ee);
  --cky-tlo-2: #f3ede2;
  --cky-tekst: #1d1530;                                 /* 16,2:1 */
  --cky-tekst-2: #5c5470;                               /* 6,6:1 */
  --cky-naglowek: #2a0a52;                              /* 15,4:1 */
  --cky-link: #3f1283;                                  /* 12,0:1, zawsze podkreślony */
  --cky-linia: #b8901a;                                 /* złoto jako linia (nie tekst) */
  --cky-linia-cicha: #e7dfd0;
  --cky-przycisk-tlo: #2a0a52;
  --cky-przycisk-tekst: #ffffff;                        /* 16,6:1 */
  --cky-przycisk-obrecz: 0 0 0 0 transparent;
  --cky-przycisk-tlo-hover: #3f1283;
  --cky-drugi-tekst: #2a0a52;
  --cky-drugi-ramka: #2a0a52;
  --cky-focus: #5a1fb8;                                 /* 8,4:1 na kremie (złoto na kremie to tylko 1,6:1) */
  --cky-przelacznik-wl: #5a1fb8;
  --cky-przelacznik-wl-galka: #ffffff;
  --cky-przelacznik-wyl: #e7dfd0;
  --cky-przelacznik-wyl-ramka: #7a7290;                 /* 4,2:1 do kremu (próg 3:1) */
  --cky-przelacznik-wyl-galka: #5c5470;
  --cky-cien: 0 0 0 1px var(--cky-linia), 0 20px 50px -18px rgb(42 10 82 / 0.45);
  --cky-zaslona: rgb(42 10 82 / 0.45);
  --cky-ikona-filtr: brightness(0) saturate(100%);
  --cky-revisit-tlo: #2a0a52;
  --cky-revisit-ikona: brightness(0) invert(1);
  --cky-revisit-obrecz: 0 0 0 1px #b8901a, 0 8px 20px -8px rgb(42 10 82 / 0.5);
}

/* ---------- Wspólne: kroje, kolory tekstu, bez przejść kolorów ---------- */
:is(.cky-consent-container, .cky-modal, .cky-btn-revisit-wrapper),
:is(.cky-consent-container, .cky-modal, .cky-btn-revisit-wrapper) * {
  font-family: var(--czcionka-ui, system-ui, sans-serif) !important;
  letter-spacing: normal;
  transition: none !important;
  box-sizing: border-box;
}
:is(.cky-consent-container, .cky-modal) :is(p, span, div, li, label, td, th, h1, h2, h3, h4) {
  color: var(--cky-tekst) !important;
}

/* ---------- Pasek zgody (pierwsza warstwa) ---------- */
.cky-consent-container {
  position: fixed !important;
  z-index: 35 !important;
  top: auto !important;
  left: 8px !important;
  right: 8px !important;
  bottom: calc(8px + env(safe-area-inset-bottom, 0px)) !important;
  width: auto !important;
  max-width: none !important;
  margin: 0 !important;
  transform: none !important;
  border-radius: var(--promien-l, 20px) !important;
}
.cky-consent-container .cky-consent-bar,
[data-cky-tag="notice"] {
  width: 100% !important;
  max-height: calc(100dvh - 16px);
  overflow-y: auto;
  margin: 0 !important;
  padding: 12px 16px 14px !important;
  border: 0 !important;
  border-top: 2px solid var(--cky-linia) !important;
  border-radius: var(--promien-l, 20px) !important;
  background: var(--cky-tlo) !important;
  background-image: none !important;
  color: var(--cky-tekst) !important;
  box-shadow: var(--cky-cien) !important;
}
.cky-consent-container .cky-notice { position: relative; }
.cky-consent-container :is(.cky-title, [data-cky-tag="title"]) {
  margin: 0 44px 4px 0 !important;
  padding: 0 !important;
  font-family: var(--czcionka-naglowki, Georgia, serif) !important;
  font-size: 19px !important;
  font-weight: 600 !important;
  line-height: 1.2 !important;
  color: var(--cky-naglowek) !important;
}
.cky-consent-container :is(.cky-notice-des, [data-cky-tag="description"]),
.cky-consent-container :is(.cky-notice-des, [data-cky-tag="description"]) * {
  margin: 0 !important;
  padding: 0 !important;      /* Box na telefonie: padding 0 24px na opisie = „dziwne wcięcie” */
  font-size: 15px !important;
  font-weight: 400 !important;
  line-height: 1.45 !important;
  color: var(--cky-tekst-2) !important;
}
.cky-consent-container :is(.cky-notice-des, [data-cky-tag="description"]) {
  max-height: none !important;  /* Box na telefonie: max-height 40vh i overflow-y: scroll (pasek przewijania w karcie) */
  overflow: visible !important;
}
.cky-consent-container :is(.cky-notice-group, .cky-notice-content-wrapper) { display: block !important; margin: 0 !important; padding: 0 !important; }

/* link do polityki cookies: podkreślony, w kolorze linku (nie złoty) */
:is(.cky-consent-container, .cky-modal) a,
:is(.cky-consent-container, .cky-modal) :is(.cky-policy, [data-cky-tag="readmore-button"]) {
  display: inline !important;
  min-height: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  background: none !important;
  color: var(--cky-link) !important;
  font-size: inherit !important;
  font-weight: 700 !important;
  text-decoration: underline !important;
  text-underline-offset: 3px;
  text-decoration-thickness: 1px;
}

/* przyciski pierwszej warstwy: telefon = [Odrzuć][Akceptuj] w rzędzie, „Dostosuj” pod nimi na całą szerokość */
.cky-consent-container :is(.cky-notice-btn-wrapper, [data-cky-tag="notice-buttons"]) {
  display: grid !important;
  grid-template-columns: 1fr 1fr;
  align-items: stretch !important; /* Akceptuj i Odrzuć zawsze tej samej wysokości, także gdy jeden napis się zawinie */
  gap: 8px !important;
  margin: 12px 0 0 !important;
  padding: 0 !important;
}
/* jawne miejsca w siatce z !important: Box na telefonie ustawia order (Akceptuj 1, Dostosuj 2, Odrzuć 3) regułą wstawianą PO naszym arkuszu,
   co bez tego dawało trzy rzędy: wąskie Akceptuj, szerokie Dostosuj, wąskie Odrzuć (zrzut Przemka z iPhone'a, 24.10) */
.cky-consent-container :is(.cky-btn-reject, [data-cky-tag="reject-button"]) { order: 1 !important; grid-column: 1 !important; grid-row: 1 !important; }
.cky-consent-container :is(.cky-btn-accept, [data-cky-tag="accept-button"]) { order: 2 !important; grid-column: 2 !important; grid-row: 1 !important; }
.cky-consent-container :is(.cky-btn-customize, [data-cky-tag="settings-button"]) { order: 3 !important; grid-column: 1 / -1 !important; grid-row: 2 !important; }

/* ---------- Przyciski (obie warstwy): Akceptuj = Odrzuć (ta sama waga), Dostosuj / Zapisz = obrys ---------- */
:is(.cky-consent-container, .cky-modal) .cky-btn,
:is(.cky-consent-container, .cky-modal) :is([data-cky-tag="accept-button"], [data-cky-tag="reject-button"], [data-cky-tag="settings-button"],
  [data-cky-tag="detail-accept-button"], [data-cky-tag="detail-reject-button"], [data-cky-tag="detail-save-button"]) {
  display: inline-flex !important;
  align-items: center;
  justify-content: center;
  flex: none !important;
  width: 100% !important;
  min-width: 0 !important;
  max-width: none !important;
  min-height: 44px !important;
  margin: 0 !important;
  padding: 8px 14px !important;
  border: 1.5px solid transparent !important;
  border-radius: var(--promien-pelny, 999px) !important;
  font-size: 15px !important;
  font-weight: 700 !important;
  line-height: 1.2 !important;
  text-align: center;
  white-space: normal !important;
  text-wrap: balance;
  text-decoration: none !important;
  cursor: pointer;
  opacity: 1 !important;
}
:is(.cky-consent-container, .cky-modal) :is(.cky-btn-accept, .cky-btn-reject, .cky-btn-preferences,
  [data-cky-tag="accept-button"], [data-cky-tag="reject-button"],
  [data-cky-tag="detail-accept-button"], [data-cky-tag="detail-reject-button"], [data-cky-tag="detail-save-button"]) {
  background: var(--cky-przycisk-tlo) !important;
  background-image: none !important;
  border-color: transparent !important;
  color: var(--cky-przycisk-tekst) !important;
  box-shadow: var(--cky-przycisk-obrecz) !important;
}
:is(.cky-consent-container, .cky-modal) :is(.cky-btn-accept, .cky-btn-reject, .cky-btn-preferences,
  [data-cky-tag="accept-button"], [data-cky-tag="reject-button"],
  [data-cky-tag="detail-accept-button"], [data-cky-tag="detail-reject-button"], [data-cky-tag="detail-save-button"]):hover {
  background: var(--cky-przycisk-tlo-hover) !important;
}
.cky-consent-container :is(.cky-btn-customize, [data-cky-tag="settings-button"]) {
  background: transparent !important;
  border-color: var(--cky-drugi-ramka) !important;
  color: var(--cky-drugi-tekst) !important;
  box-shadow: none !important;
}
.cky-consent-container :is(.cky-btn-customize, [data-cky-tag="settings-button"]):hover { background: var(--cky-tlo-2) !important; }
/* strzałka przy „Dostosuj” w układzie z rozwijaniem (Banner + Push down) */
.cky-consent-container .cky-btn-customize img,
.cky-consent-container .cky-btn-customize svg { width: 12px; height: 12px; margin-left: 6px; filter: var(--cky-ikona-filtr); }

/* ---------- Zamknij (X): cel 44 x 44, ikona w kolorze tekstu ---------- */
:is(.cky-consent-container, .cky-modal) :is(.cky-banner-btn-close, .cky-btn-close, [data-cky-tag="close-button"], [data-cky-tag="detail-close"]) {
  display: inline-grid !important;
  place-items: center;
  width: 44px !important;
  height: 44px !important;
  min-width: 44px !important;
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  border-radius: var(--promien-pelny, 999px) !important;
  background: transparent !important;
  box-shadow: none !important;
  cursor: pointer;
}
.cky-consent-container :is(.cky-banner-btn-close, [data-cky-tag="close-button"]) {
  position: absolute !important;
  top: 4px !important;
  right: 4px !important;
}
:is(.cky-consent-container, .cky-modal) :is(.cky-banner-btn-close, .cky-btn-close, [data-cky-tag="close-button"], [data-cky-tag="detail-close"]) :is(img, svg) {
  width: 14px !important;
  height: 14px !important;
  filter: var(--cky-ikona-filtr);
}

/* ---------- Fokus z klawiatury: zawsze widoczny ---------- */
:is(.cky-consent-container, .cky-modal, .cky-btn-revisit-wrapper) :is(button, a, input, [tabindex]):focus-visible,
.cky-btn-revisit-wrapper:focus-visible {
  outline: 3px solid var(--cky-focus) !important;
  outline-offset: 3px !important;
}
:is(.cky-consent-container, .cky-modal) :focus:not(:focus-visible) { outline: none; }

/* ---------- Centrum preferencji (druga warstwa, okno na środku) ---------- */
.cky-overlay {
  position: fixed !important;
  inset: 0 !important;
  z-index: 44 !important;
  background: var(--cky-zaslona) !important;
  opacity: 1 !important;
}
.cky-overlay.cky-hide { display: none !important; }
.cky-modal {
  position: fixed !important;
  z-index: 45 !important;
  top: 50% !important;
  left: 50% !important;
  right: auto !important;
  bottom: auto !important;
  width: min(640px, calc(100vw - 16px)) !important;
  max-width: none !important;
  max-height: calc(100dvh - 16px) !important;
  margin: 0 !important;
  transform: translate(-50%, -50%) !important;
  background: transparent !important;
  box-shadow: none !important;
}
.cky-modal:not(.cky-modal-open) { visibility: hidden !important; opacity: 0 !important; pointer-events: none !important; }
.cky-modal.cky-modal-open { visibility: visible !important; opacity: 1 !important; }
.cky-modal :is(.cky-preference-center, [data-cky-tag="detail"]) {
  display: flex !important;
  flex-direction: column;
  width: 100% !important;
  max-width: none !important;
  max-height: calc(100dvh - 16px) !important;
  margin: 0 !important;
  overflow: hidden !important;
  border: 0 !important;
  border-top: 2px solid var(--cky-linia) !important;
  border-radius: var(--promien-l, 20px) !important;
  background: var(--cky-tlo) !important;
  background-image: none !important;
  color: var(--cky-tekst) !important;
  box-shadow: var(--cky-cien) !important;
}
.cky-modal .cky-preference-header {
  display: flex !important;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  padding: 10px 8px 10px 20px !important;
  border-bottom: 1px solid var(--cky-linia-cicha) !important;
}
.cky-modal :is(.cky-preference-title, [data-cky-tag="detail-title"]) {
  margin: 0 !important;
  font-family: var(--czcionka-naglowki, Georgia, serif) !important;
  font-size: 24px !important;
  font-weight: 600 !important;
  line-height: 1.2 !important;
  color: var(--cky-naglowek) !important;
}
.cky-modal .cky-preference-body-wrapper {
  flex: 1 1 auto;
  min-height: 0;
  overflow-y: auto !important;
  padding: 14px 20px 8px !important;
}
.cky-modal :is(.cky-preference-content-wrapper, [data-cky-tag="detail-description"]),
.cky-modal :is(.cky-preference-content-wrapper, [data-cky-tag="detail-description"]) * {
  font-size: 15px !important;
  line-height: 1.5 !important;
  color: var(--cky-tekst-2) !important;
}
.cky-modal :is(.cky-show-desc-btn, [data-cky-tag="show-desc-button"]) {
  min-height: 44px;
  padding: 0 !important;
  border: 0 !important;
  background: none !important;
  color: var(--cky-link) !important;
  font-size: 15px !important;
  font-weight: 700 !important;
  text-decoration: underline !important;
  text-underline-offset: 3px;
  cursor: pointer;
}
.cky-modal .cky-horizontal-separator { height: 1px !important; margin: 8px 0 !important; background: var(--cky-linia-cicha) !important; }

/* kategorie (akordeon) */
.cky-modal .cky-accordion {
  margin: 0 !important;
  padding: 10px 0 !important;
  border: 0 !important;
  border-bottom: 1px solid var(--cky-linia-cicha) !important;
  background: transparent !important;
}
.cky-modal .cky-accordion:last-child { border-bottom: 0 !important; }
.cky-modal .cky-accordion-item { display: flex !important; align-items: flex-start; gap: 8px; }
.cky-modal .cky-accordion-header-wrapper { flex: 1 1 auto; min-width: 0; }
.cky-modal .cky-accordion-header { display: flex !important; align-items: center; justify-content: space-between; gap: 12px; min-height: 44px; }
.cky-modal :is(.cky-accordion-btn, [data-cky-tag="detail-category-title"]) {
  flex: 1 1 auto;
  min-height: 44px;
  padding: 0 !important;
  border: 0 !important;
  background: none !important;
  color: var(--cky-tekst) !important;
  font-size: 16px !important;
  font-weight: 700 !important;
  line-height: 1.25 !important;
  text-align: left;
  cursor: pointer;
}
.cky-modal :is(.cky-accordion-header-des, [data-cky-tag="detail-category-description"]),
.cky-modal :is(.cky-accordion-header-des, [data-cky-tag="detail-category-description"]) * {
  font-size: 14px !important;
  line-height: 1.5 !important;
  color: var(--cky-tekst-2) !important;
}
.cky-modal .cky-accordion-chevron { color: var(--cky-tekst) !important; min-width: 20px; min-height: 44px; display: grid; place-items: center; }
.cky-modal .cky-accordion-chevron i::before,
.cky-modal .cky-chevron-right::before { border-color: currentColor !important; }
.cky-modal .cky-always-active {
  flex: none;
  font-size: 14px !important;
  font-weight: 700 !important;
  color: var(--cky-tekst) !important;
  white-space: nowrap;
}
/* tabela ciasteczek pod kategorią */
.cky-modal :is(.cky-audit-table, [data-cky-tag="audit-table"]) {
  margin: 8px 0 4px !important;
  padding: 10px 12px !important;
  border: 1px solid var(--cky-linia-cicha) !important;
  border-radius: var(--promien-m, 12px) !important;
  background: var(--cky-tlo-2) !important;
  color: var(--cky-tekst) !important;
}
.cky-modal .cky-cookie-des-table li { display: flex; gap: 12px; padding: 2px 0; font-size: 13px !important; line-height: 1.45 !important; }
.cky-modal .cky-cookie-des-table li > div:first-child { flex: 0 0 96px; font-weight: 700 !important; }
.cky-modal :is(.cky-empty-cookies-text) { font-size: 14px !important; color: var(--cky-tekst-2) !important; }

/* przełączniki kategorii: akcent strony, cel dotykowy 44 x 44 (sam przełącznik 44 x 24 ma otok) */
.cky-modal :is(.cky-switch, [data-cky-tag="detail-category-toggle"]) {
  display: inline-grid !important;
  place-items: center;
  flex: none;
  min-width: 52px;
  min-height: 44px;
}
.cky-modal .cky-switch input[type="checkbox"],
.cky-modal [data-cky-tag="detail-category-toggle"] input[type="checkbox"] {
  -webkit-appearance: none !important;
  appearance: none !important;
  position: relative !important;
  width: 44px !important;
  height: 24px !important;
  margin: 0 !important;
  border: 1.5px solid var(--cky-przelacznik-wyl-ramka) !important;
  border-radius: var(--promien-pelny, 999px) !important;
  background: var(--cky-przelacznik-wyl) !important;
  background-image: none !important;
  cursor: pointer;
  opacity: 1 !important;
}
.cky-modal .cky-switch input[type="checkbox"]::before,
.cky-modal [data-cky-tag="detail-category-toggle"] input[type="checkbox"]::before {
  content: "" !important;
  position: absolute !important;
  top: 50% !important;
  left: 3px !important;
  width: 16px !important;
  height: 16px !important;
  margin: 0 !important;
  border-radius: 50% !important;
  background: var(--cky-przelacznik-wyl-galka) !important;
  transform: translateY(-50%) !important;
  box-shadow: none !important;
}
.cky-modal .cky-switch input[type="checkbox"]:checked,
.cky-modal [data-cky-tag="detail-category-toggle"] input[type="checkbox"]:checked {
  border-color: var(--cky-przelacznik-wl) !important;
  background: var(--cky-przelacznik-wl) !important;
}
.cky-modal .cky-switch input[type="checkbox"]:checked::before,
.cky-modal [data-cky-tag="detail-category-toggle"] input[type="checkbox"]:checked::before {
  left: auto !important;
  right: 3px !important;
  background: var(--cky-przelacznik-wl-galka) !important;
}

/* stopka okna: Odrzuć / Zapisz / Akceptuj o tej samej wadze; telefon w kolumnie, od 560 px w jednym rzędzie */
.cky-modal .cky-footer-wrapper {
  position: relative;
  flex: none;
  padding: 0 !important;
  border-top: 1px solid var(--cky-linia-cicha) !important;
  background: var(--cky-tlo) !important;
}
.cky-modal .cky-footer-shadow { display: none !important; }
.cky-modal :is(.cky-prefrence-btn-wrapper, .cky-preference-btn-wrapper, [data-cky-tag="detail-buttons"]) {
  display: grid !important;
  grid-template-columns: 1fr;
  gap: 8px !important;
  margin: 0 !important;
  padding: 12px 20px !important;
  border: 0 !important;
}
.cky-modal [data-cky-tag="detail-powered-by"],
.cky-modal [data-cky-tag="detail-powered-by"] * {
  background: transparent !important;
  color: var(--cky-tekst-2) !important;
  font-size: 12px !important;
}
.cky-modal [data-cky-tag="detail-powered-by"] { padding: 4px 20px 10px !important; text-align: right; }
.cky-modal [data-cky-tag="detail-powered-by"] img { filter: var(--cky-ikona-filtr); opacity: 0.8; }
@media (min-width: 560px) {
  .cky-modal :is(.cky-prefrence-btn-wrapper, .cky-preference-btn-wrapper, [data-cky-tag="detail-buttons"]) { grid-template-columns: repeat(3, 1fr); }
}

/* „Powered by CookieYes” na pierwszej warstwie (plan darmowy, układ Box): mały, do prawej, bez własnego szarego tła i wcięć 28 px */
.cky-consent-container [data-cky-tag="powered-by"],
.cky-consent-container [data-cky-tag="powered-by"] * { background: transparent !important; color: var(--cky-tekst-2) !important; font-size: 11px !important; font-weight: 400 !important; line-height: 1.2 !important; }
.cky-consent-container [data-cky-tag="powered-by"] {
  display: flex !important;
  justify-content: flex-end;
  align-items: center;
  gap: 4px;
  margin: 4px 0 -8px !important;
  padding: 0 !important;
  border: 0 !important;
  border-radius: 0 !important;
}
.cky-consent-container [data-cky-tag="powered-by"] a {
  display: inline-flex !important;
  align-items: center;
  min-height: 24px !important;   /* cel 24 px (WCAG 2.5.8): to podpis dostawcy, nie czynność zgody */
  text-decoration: none !important;
}
.cky-consent-container [data-cky-tag="powered-by"] img { width: auto !important; height: 12px !important; filter: var(--cky-ikona-filtr); opacity: 0.8; }
/* gdyby CookieYes wstawił podpis obok karty, a nie w niej: to samo tło co karta, żeby nie wisiał na zdjęciu strony */
.cky-consent-container > [data-cky-tag="powered-by"] { margin: -12px 0 0 !important; padding: 12px 16px 6px !important; border-radius: 0 0 var(--promien-l, 20px) var(--promien-l, 20px) !important; background: var(--cky-tlo) !important; }

/* ---------- Przycisk ponownej zgody (Revisit consent): prawy dolny róg, nad pigułką, paskiem zamówienia i pigułką edytora ---------- */
.cky-btn-revisit-wrapper {
  position: fixed !important;
  z-index: 28 !important;
  top: auto !important;
  left: auto !important;
  right: calc(16px + env(safe-area-inset-right, 0px)) !important;
  bottom: calc(16px + env(safe-area-inset-bottom, 0px)) !important;
  display: grid !important;
  place-items: center;
  width: 44px !important;
  height: 44px !important;
  border-radius: 50% !important;
  background: var(--cky-revisit-tlo) !important;
  background-image: none !important;
  box-shadow: var(--cky-revisit-obrecz) !important;
}
.cky-btn-revisit-wrapper.cky-revisit-hide { display: none !important; }
.cky-btn-revisit-wrapper :is(.cky-btn-revisit, button) {
  display: grid !important;
  place-items: center;
  width: 44px !important;
  height: 44px !important;
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  border-radius: 50% !important;
  background: transparent !important;
  cursor: pointer;
}
.cky-btn-revisit-wrapper :is(img, svg) { width: 24px !important; height: 24px !important; filter: var(--cky-revisit-ikona); }
/* pigułka edytora tekstów (tylko zalogowany admin) siedzi w tym samym rogu: przycisk zgody nad nią */
:root:has(.edytor-pigula) .cky-btn-revisit-wrapper { bottom: calc(16px + 48px + 12px + env(safe-area-inset-bottom, 0px)) !important; }
/* przy pisaniu w formularzu przycisk znika (nie zasłania pola ani przycisku wysyłki); wraca po zejściu z pola */
:root:has(:is(input:not([type="checkbox"], [type="radio"], [type="submit"], [type="button"], [type="hidden"]), textarea, select):focus) .cky-btn-revisit-wrapper {
  visibility: hidden !important;
}

/* ---------- Menu mobilne otwarte: baner i przycisk zgody pod nagłówkiem (z-index 20) ---------- */
:root:has(.menu-mobilne[open]) :is(.cky-consent-container, .cky-btn-revisit-wrapper) { z-index: 19 !important; }

/* ---------- Telefon (do 767 px) ---------- */
@media (max-width: 767px) {
  /* pigułka dolna (główna i Kontakt, styl-widget.css): kapsuła 48 px + 4 px + 14 px od dołu, przycisk zgody 6 px nad nią */
  body.z-ambientem .cky-btn-revisit-wrapper { bottom: calc(76px + env(safe-area-inset-bottom, 0px)) !important; }
  /* przyklejony pasek zamówienia (podsumowanie) ma ~100 px */
  html.z-paskiem-zamow .cky-btn-revisit-wrapper { bottom: calc(var(--pasek-zamow-wys, 100px) + 16px + env(safe-area-inset-bottom, 0px)) !important; }
}
@media (max-width: 359px) {
  .cky-consent-container .cky-consent-bar, .cky-consent-container [data-cky-tag="notice"] { padding: 12px 12px 14px !important; }
  /* najmniejsze telefony (320 px): bez tytułu (region banera ma własną etykietę aria-label), żeby główny przycisk hero został nad banerem */
  .cky-consent-container :is(.cky-title, [data-cky-tag="title"]) { display: none !important; }
  .cky-consent-container :is(.cky-notice-des, [data-cky-tag="description"]),
  .cky-consent-container :is(.cky-notice-des, [data-cky-tag="description"]) * { font-size: 14px !important; }
  :is(.cky-consent-container, .cky-modal) .cky-btn { padding-inline: 10px !important; font-size: 14px !important; }
}

/* ---------- 768-1023 (Duo rozłożony 890 x 626): baner jako karta w PRAWEJ połówce ----------
   Hero trzyma tytuł i główny przycisk w lewej połówce (prawa to medalion), więc karta zgody po prawej nie zasłania przycisku „Zamów”,
   a cała leży za pasem zgięcia x 421-469 (lewa krawędź = połowa okna + pół rynny). Centrum preferencji: lewa połówka jak okno informacyjne. */
@media (min-width: 768px) {
  .cky-consent-container {
    left: calc(50% + var(--rynna, 48px) / 2) !important;
    right: var(--gutter, 32px) !important;
    bottom: calc(16px + env(safe-area-inset-bottom, 0px)) !important;
  }
  .cky-consent-container .cky-consent-bar,
  .cky-consent-container [data-cky-tag="notice"] { padding: 16px 20px 18px !important; }
  .cky-consent-container :is(.cky-title, [data-cky-tag="title"]) { font-size: 22px !important; }
  .cky-modal {
    left: var(--gutter, 32px) !important;
    width: calc((100vw - var(--rynna, 48px)) / 2 - var(--gutter, 32px)) !important;
    transform: translateY(-50%) !important;
  }
  .cky-modal :is(.cky-prefrence-btn-wrapper, .cky-preference-btn-wrapper, [data-cky-tag="detail-buttons"]) { grid-template-columns: 1fr; }
}

/* ---------- Od 1024: jedna linia (tekst | Dostosuj  Odrzuć  Akceptuj), okno preferencji na środku ---------- */
@media (min-width: 1024px) {
  .cky-consent-container .cky-consent-bar,
  .cky-consent-container [data-cky-tag="notice"] { padding: 18px 24px !important; }
  .cky-consent-container :is(.cky-notice-group, .cky-notice-content-wrapper) { display: grid !important; align-items: center; }
  .cky-consent-container :is(.cky-notice-btn-wrapper, [data-cky-tag="notice-buttons"]) { margin: 0 !important; }
  .cky-consent-container {
    left: 50% !important;
    right: auto !important;
    width: min(1200px, calc(100vw - 2 * var(--gutter, 48px))) !important;
    transform: translateX(-50%) !important;
  }
  .cky-consent-container :is(.cky-notice-group, .cky-notice-content-wrapper) {
    grid-template-columns: minmax(0, 1fr) auto;
    column-gap: 32px;
  }
  .cky-consent-container :is(.cky-notice-btn-wrapper, [data-cky-tag="notice-buttons"]) {
    grid-template-columns: repeat(3, 1fr); /* równe kolumny: Akceptuj i Odrzuć tej samej szerokości */
    grid-auto-flow: column;
  }
  .cky-consent-container :is(.cky-btn-customize, [data-cky-tag="settings-button"]) { order: 0 !important; grid-column: 1 !important; grid-row: 1 !important; }
  .cky-consent-container :is(.cky-btn-reject, [data-cky-tag="reject-button"]) { grid-column: 2 !important; }
  .cky-consent-container :is(.cky-btn-accept, [data-cky-tag="accept-button"]) { grid-column: 3 !important; }
  .cky-consent-container .cky-btn,
  .cky-consent-container :is([data-cky-tag="accept-button"], [data-cky-tag="reject-button"], [data-cky-tag="settings-button"]) {
    width: auto !important;
    min-width: 168px !important;
    padding-inline: 22px !important;
    white-space: nowrap !important;
  }
  .cky-modal {
    left: 50% !important;
    width: min(680px, calc(100vw - 2 * var(--gutter, 48px))) !important;
    transform: translate(-50%, -50%) !important;
  }
  .cky-modal :is(.cky-prefrence-btn-wrapper, .cky-preference-btn-wrapper, [data-cky-tag="detail-buttons"]) { grid-template-columns: repeat(3, 1fr); }
}

/* ---------- Ruch: wejście z mgły tylko przy dozwolonym ruchu; prefers-reduced-motion = zero animacji ---------- */
@media (prefers-reduced-motion: no-preference) {
  .cky-consent-container:not(.cky-hide) :is(.cky-consent-bar, [data-cky-tag="notice"]) {
    animation: cky-z-mgly 600ms cubic-bezier(0.16, 1, 0.3, 1) both;
  }
  .cky-modal.cky-modal-open :is(.cky-preference-center, [data-cky-tag="detail"]) {
    animation: cky-z-mgly 420ms cubic-bezier(0.16, 1, 0.3, 1) both;
  }
}
@keyframes cky-z-mgly {
  from { opacity: 0; filter: blur(6px); transform: translateY(12px); }
  to { opacity: 1; filter: none; transform: none; }
}
@media (prefers-reduced-motion: reduce) {
  :is(.cky-consent-container, .cky-modal, .cky-overlay, .cky-btn-revisit-wrapper),
  :is(.cky-consent-container, .cky-modal, .cky-overlay, .cky-btn-revisit-wrapper) * {
    animation: none !important;
    transition: none !important;
  }
}

/* ---------- Druk: bez banera i przycisku zgody ---------- */
@media print {
  :is(.cky-consent-container, .cky-modal, .cky-overlay, .cky-btn-revisit-wrapper) { display: none !important; }
}
