/* Dostępność skórki bsxstart (WCAG 2.1 AA), kontrakt: Docs/Modules/Accessibility/README.md */

/* ---------- Link „Przejdź do treści” ---------- */

.bsx-skip-link {
  position: fixed;
  top: 0;
  left: 16px;
  z-index: 100001;
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 10px 18px 11px;
  border-radius: 0 0 10px 10px;
  background: #1a1a1a;
  color: #fff !important;
  font-family: inherit;
  font-size: 15px;
  font-weight: 600;
  line-height: 1.4;
  text-decoration: none !important;
  transform: translateY(-120%);
  transition: transform .15s ease-out;
}

.bsx-skip-link i {
  font-size: .85em;
}

.bsx-skip-link:focus {
  transform: none;
}

/* ---------- Fokus ---------- */

/* Porto zdejmuje obrys; ramka dwukolorowa (C40), warianty przez zmienne i klasy z BSXA11y.Focus */
/* interfejs edytora i konsola debug (.bsx-cms-ui) mają ramkę jak bez trybu kontrastu */
html.bsx-a11y,
html.bsx-a11y.bsx-contrast .bsx-cms-ui {
  --bsx-focus-width: 2px;
  --bsx-focus-inner: #fff;
  --bsx-focus-outer: #1a1a1a;
}

/* tryb ciemny: jasny pierścień zewnętrzny, bo leży na tle strony */
html.bsx-a11y.dark,
html.bsx-a11y.bsx-contrast.dark .bsx-cms-ui {
  --bsx-focus-inner: #1a1a1a;
  --bsx-focus-outer: #fff;
}

html.bsx-a11y.bsx-contrast {
  --bsx-focus-width: 3px;
  --bsx-focus-inner: #000;
  --bsx-focus-outer: #fff;
}

html.bsx-a11y body :is(a, button, input, select, summary, [tabindex], [role="button"], .btn):not(input:not([type="checkbox"], [type="radio"], [type="button"], [type="submit"], [type="reset"], [type="range"], [type="file"], [type="image"], [type="color"]), textarea, [contenteditable]):focus-visible,
html.bsx-a11y body .switch input:focus-visible + .slider,
html.bsx-a11y body .bsx-focus-child:focus-visible > * {
  outline: var(--bsx-focus-width) var(--bsx-focus-style, solid) var(--bsx-focus-outer) !important;
  outline-offset: var(--bsx-focus-offset, var(--bsx-focus-width)) !important;
  box-shadow: var(--bsx-focus-shadow, 0 0 0 var(--bsx-focus-width) var(--bsx-focus-inner)) !important;
  -webkit-box-decoration-break: clone;
  box-decoration-break: clone;
}

html.bsx-a11y .bsx-focus-child {
  --bsx-focus-style: none;
  --bsx-focus-shadow: none;
}

html.bsx-a11y .bsx-focus-child > * {
  --bsx-focus-style: solid;
  --bsx-focus-shadow: initial;
}

/* po bsx-focus-child: obraz w linku też może wymagać ramki wewnątrz */
html.bsx-a11y .bsx-focus-inset {
  --bsx-focus-offset: calc(var(--bsx-focus-width) * -1);
  --bsx-focus-shadow: inset 0 0 0 calc(var(--bsx-focus-width) * 2) var(--bsx-focus-inner);
}

/* krzyżyk okna BSX: margines jak padding nagłówka (12 px), ramka wewnątrz */
html.bsx-a11y .modal-header .close {
  margin-top: -12px;
  margin-right: -12px;
  margin-bottom: -12px;
  --bsx-focus-offset: calc(var(--bsx-focus-width) * -1);
  --bsx-focus-shadow: inset 0 0 0 calc(var(--bsx-focus-width) * 2) var(--bsx-focus-inner);
}

/* niewidoczny checkbox .custom-checkbox-1 leży nad kwadratem z label::before */
html.bsx-a11y body .custom-checkbox-1 input[type="checkbox"]:focus-visible + label::before {
  outline: var(--bsx-focus-width) solid var(--bsx-focus-outer) !important;
  outline-offset: var(--bsx-focus-width) !important;
  box-shadow: 0 0 0 var(--bsx-focus-width) var(--bsx-focus-inner) !important;
}

/* cel linku „Przejdź do treści” bez obrysu */
html.bsx-a11y body #main-content:focus {
  outline: none !important;
  box-shadow: none !important;
}

/* przyklejony nagłówek nie zasłania elementu z fokusem (2.4.11); wysokość mierzy BSXA11y.Sticky */
html.bsx-a11y {
  scroll-padding-top: var(--bsx-sticky-offset, 0px);
}

/* ---------- Elementy pokazywane po najechaniu myszą: widoczne także przy fokusie ---------- */

/* strzałki i kropki karuzel show-nav-hover / show-dots-hover */
html.bsx-a11y .owl-carousel.show-nav-hover:focus-within .owl-nav {
  opacity: 1;
}

html.bsx-a11y .owl-carousel.show-dots-hover:focus-within .owl-dots {
  opacity: 1;
  visibility: visible;
}

/* „Szybki podgląd” w kafelku produktu */
html.bsx-a11y .shop .products .product:focus-within .quick-view {
  opacity: 1;
  transform: translate3d(0, 0, 0);
}

/* „Dodaj do koszyka” w kafelku: motyw ukrywa go do najechania (visibility) */
html.bsx-a11y .product .product-thumb-info .addtocart-btn-wrapper .addtocart-btn {
  visibility: visible;
}

html.bsx-a11y .product:focus-within .product-thumb-info .addtocart-btn-wrapper .addtocart-btn {
  opacity: 1;
  transform: translate3d(0, 0, 0);
}

/* tabele na koncie przy większej czcionce lub odstępach: komórki łamią tekst, także kwoty */
html.bsx-a11y:is(.bsx-font-1, .bsx-font-2, .bsx-spacing) .scroll-x:where(:not(.bsx-cms-ui *)) > .table .no-wrap {
  white-space: normal;
}

html.bsx-a11y:is(.bsx-font-1, .bsx-font-2, .bsx-spacing) .scroll-x:where(:not(.bsx-cms-ui *)) > .table > :not(caption) > * > * {
  padding-left: 4px;
  padding-right: 4px;
}

/* ikony społecznościowe w stopce: rozmiar w px/rem, środkowanie przez line-height */
html.bsx-a11y:is(.bsx-font-1, .bsx-font-2, .bsx-spacing) #footer .social-icons li a {
  display: flex;
  align-items: center;
  justify-content: center;
}

html.bsx-a11y.bsx-font-1 #footer .social-icons {
  zoom: 1.25;
}

html.bsx-a11y.bsx-font-2 #footer .social-icons {
  zoom: 1.5;
}

/*
 * sortowanie i „Pokaż” w sklepie: w stałej kolumnie lista ucinała wybraną wartość (1.4.12) — szerokość z treści;
 * minimalną szerokość przy odstępach liter ustawia BSXA11y.fitSelects; na telefonie jedna pod drugą jak w motywie
 */
@media (min-width: 768px) {
  html.bsx-a11y:is(.bsx-font-1, .bsx-font-2, .bsx-spacing) .form-shop-topbar .row > .form-group {
    flex: 0 0 auto;
    width: auto;
    max-width: 100%;
  }
}

/* uchwyt suwaka ceny: noUiSlider przesuwa go o -.3em, a rozmiar ma w px — przy większej czcionce wychodził nad tor */
html.bsx-a11y:is(.bsx-font-1, .bsx-font-2) .noUi-horizontal .noUi-handle {
  top: -4px;
}

/* strzałka kategorii ma top w px pod interlinię motywu — środek pierwszej linii (1lh liczony na linku dzięki @property) */
@property --bsx-nav-line {
  syntax: '<length>';
  inherits: true;
  initial-value: 20px;
}

html.bsx-a11y:is(.bsx-font-1, .bsx-font-2, .bsx-spacing) ul.nav-list li.has-children > a {
  --bsx-nav-line: 1lh;
}

html.bsx-a11y:is(.bsx-font-1, .bsx-font-2, .bsx-spacing) ul.nav-list li.has-children > a::before {
  top: calc(8px + var(--bsx-nav-line) / 2);
  translate: 0 -50%;
}

/* podmenu schowane klawiszem Escape (BSXA11y.Header) do chwili, gdy wskaźnik i fokus opuszczą pozycję */
html.bsx-a11y #header .header-nav-main nav > ul > li.bsx-submenu-closed > .dropdown-menu {
  display: none !important;
}

/* „Zobacz więcej” w karcie galerii w wariancie „elegancki” (opacity: 0 do najechania) */
html.bsx-a11y .thumb-info.thumb-info-show-hidden-content-hover:focus-within .thumb-info-content-inner {
  transform: translate3d(0, -50px, 0);
}

html.bsx-a11y .thumb-info.thumb-info-show-hidden-content-hover:focus-within .thumb-info-content-inner-hidden {
  opacity: 1;
}

/* ---------- Elementy schowane: poza kolejnością Tab, dopóki są niewidoczne ---------- */

/* dropdown wyszukiwarki i koszyka w nagłówku (zamknięty jest przesunięty poza ekran) */
html.bsx-a11y #header .header-nav-features .header-nav-features-dropdown:not(.show) {
  visibility: hidden;
}

/* przycisk „do góry” na początku strony ma opacity: 0 */
html.bsx-a11y .scroll-to-top {
  transition: opacity .3s, visibility .3s;
}

html.bsx-a11y .scroll-to-top:not(.visible) {
  visibility: hidden;
}

/* panel filtrów sklepu (zamknięty jest przesunięty poza prawą krawędź) */
html.bsx-a11y .shop-sidebar-panel:not(.open) {
  visibility: hidden;
  transition: right .3s ease, visibility 0s linear .3s;
}

/* ---------- Kolory i nagłówki domyślne ---------- */

/* #777 na białym tle ma 4,48:1, #767676 — 4,54:1 */
html.bsx-a11y:not(.dark) body {
  color: #767676;
}

/* odstęp przy ikonie w linku (separateIconSpacing) bez podkreślenia */
.bsx-icon-gap {
  display: inline-block;
  width: .28em;
}

/* ---------- Menu główne z klawiatury ---------- */

/* pozycja z fokusem (accessibility-open) jak po najechaniu; :is(*, :focus) przebija reguły trybu ciemnego */
@media (min-width: 992px) {
  html.bsx-a11y #header .header-nav-main nav > ul > li.accessibility-open > a:is(*, :focus) {
    background-color: var(--bsx-color-primary, #0088cc);
    color: var(--bsx-autotext-primary, #fff);
  }

  html.bsx-a11y #header .header-nav-main nav > ul > li.dropdown.accessibility-open > a::before {
    border-bottom-color: var(--bsx-color-primary, #0088cc);
  }
}

/* nagłówki header-variant-color: po najechaniu zmienia się tylko kolor tekstu (custom.css, :hover) */
html.bsx-a11y #header .header-variant-color li:not(.social-icons-twitter) a.dropdown-item:focus-visible {
  color: var(--bsx-color-primary, var(--color-primary)) !important;
}

/* ---------- Podmenu na urządzeniach mobilnych ---------- */

.bsx-submenu-toggle {
  display: none;
}

@media (max-width: 991px) {
  #header .header-nav-main nav > ul li.bsx-has-submenu-toggle {
    display: flex;
    flex-wrap: wrap;
    align-items: stretch;
  }

  #header .header-nav-main nav > ul li.bsx-has-submenu-toggle > a {
    flex: 1 1 0;
    min-width: 0;
  }

  #header .header-nav-main nav > ul li.bsx-has-submenu-toggle > a > .fa-chevron-down {
    display: none !important;
  }

  #header .header-nav-main nav > ul li.bsx-has-submenu-toggle > .dropdown-menu {
    flex: 0 0 100%;
  }

  #header .header-nav-main nav > ul li.bsx-has-submenu-toggle > .bsx-submenu-toggle {
    display: flex;
    flex: 0 0 44px;
    align-items: center;
    justify-content: center;
    min-height: 44px;
    padding: 0;
    border: 0;
    background: transparent;
    color: inherit;
    font-size: .7rem;
  }

  #header .header-nav-main nav > ul li.bsx-has-submenu-toggle > .bsx-submenu-toggle[aria-expanded="true"] i {
    transform: rotate(180deg);
  }
}

/* ---------- Panel ustawień dostępności ---------- */

.bsx-a11y-panel {
  font-family: "Poppins", Arial, sans-serif;
  font-size: 15px;
  line-height: 1.4;
  letter-spacing: normal;
  word-spacing: normal;
}

/* nad banerem cookies: kontrast trzeba móc włączyć przed zgodą */
.bsx-a11y-trigger {
  position: fixed;
  top: 22%;
  right: 0;
  z-index: 10001;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 46px;
  height: 46px;
  padding: 0;
  border: 0;
  border-radius: 6px 0 0 6px;
  background: #1c1c1e;
  box-shadow: 0 2px 8px rgba(0, 0, 0, .3);
  color: #fff;
  font-size: 18px;
  cursor: pointer;
  transition: right .25s ease;
}

.bsx-a11y-dialog {
  position: fixed;
  top: 0;
  right: 0;
  bottom: 0;
  z-index: 10002;
  width: 300px;
  max-width: 100vw;
  padding: 20px;
  overflow-y: auto;
  background: #1c1c1e;
  color: #fff;
  text-align: left;
  visibility: hidden;
  transform: translateX(100%);
  transition: transform .25s ease, visibility 0s linear .25s;
}

.bsx-a11y-panel.is-open .bsx-a11y-dialog {
  visibility: visible;
  transform: none;
  transition: transform .25s ease;
}

.bsx-a11y-panel.is-open .bsx-a11y-trigger {
  right: 300px;
}

.bsx-a11y-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-bottom: 16px;
}

.bsx-a11y-panel .bsx-a11y-title {
  margin: 0;
  color: #fff;
  font-size: 18px;
  font-weight: 700;
  line-height: 1.3;
  letter-spacing: normal;
}

.bsx-a11y-close {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 40px;
  height: 40px;
  padding: 0;
  border: 0;
  background: transparent;
  color: #fff;
  font-size: 20px;
  cursor: pointer;
}

.bsx-a11y-options {
  margin: 0 0 20px;
  padding: 0;
  list-style: none;
}

.bsx-a11y-options li {
  margin: 0 0 8px;
  padding: 0;
}

.bsx-a11y-option {
  display: flex;
  align-items: center;
  gap: 12px;
  width: 100%;
  min-height: 44px;
  padding: 8px 12px;
  border: 2px solid #8e8e93;
  border-radius: 6px;
  background: transparent;
  color: #fff;
  font: inherit;
  text-align: left;
  cursor: pointer;
}

.bsx-a11y-option i {
  width: 20px;
  font-size: 18px;
  text-align: center;
}

.bsx-a11y-option span {
  flex: 1;
}

/* stan włączenia: kolor, obramowanie i znacznik — nie tylko kolor */
.bsx-a11y-option[aria-pressed="true"],
.bsx-a11y-font[aria-pressed="true"] {
  border-color: #ffd60a;
  background: #ffd60a;
  color: #000;
  font-weight: 700;
}

.bsx-a11y-option[aria-pressed="true"]::after {
  content: "\2713";
  font-weight: 700;
}

.bsx-a11y-label {
  margin: 0 0 8px;
  color: #fff;
  font-weight: 600;
}

.bsx-a11y-fonts {
  margin-bottom: 20px;
}

/* różne rozmiary litery „A” — wyrównanie do góry i wyśrodkowanie, bo linia bazowa przesuwałaby przyciski */
.bsx-a11y-font {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  vertical-align: top;
  min-width: 48px;
  height: 44px;
  margin-right: 6px;
  padding: 0 10px;
  border: 2px solid #8e8e93;
  border-radius: 6px;
  background: transparent;
  color: #fff;
  font-family: inherit;
  font-weight: 600;
  line-height: 1;
  cursor: pointer;
}

.bsx-a11y-font-0 { font-size: 15px; }
.bsx-a11y-font-1 { font-size: 20px; }
.bsx-a11y-font-2 { font-size: 25px; }

.bsx-a11y-footer {
  display: flex;
  flex-direction: column;
  gap: 12px;
  padding-top: 16px;
  border-top: 1px solid #48484a;
}

.bsx-a11y-reset {
  min-height: 44px;
  padding: 8px 12px;
  border: 2px solid #fff;
  border-radius: 6px;
  background: transparent;
  color: #fff;
  font: inherit;
  cursor: pointer;
}

.bsx-a11y-panel .bsx-a11y-statement {
  color: #fff !important;
  text-decoration: underline !important;
}

/* panel jest ciemny: żółta ramka, pierścień wewnętrzny w kolorze tła panelu */
html.bsx-a11y .bsx-a11y-panel {
  --bsx-focus-inner: #1c1c1e;
  --bsx-focus-outer: #ffd60a;
}

@media (max-width: 420px) {
  .bsx-a11y-dialog {
    width: 100vw;
  }

  .bsx-a11y-panel.is-open .bsx-a11y-trigger {
    visibility: hidden;
  }
}

/* ---------- Opcja: wielkość czcionki ---------- */

html.bsx-font-1 { --bsx-font-scale: 1.25; }
html.bsx-font-2 { --bsx-font-scale: 1.5; }

/* skalujemy tekst (em względem body), nie rem — nagłówek Porto ma stałe wysokości */
html.bsx-font-1 body,
html.bsx-font-2 body {
  font-size: calc(14px * var(--bsx-font-scale));
  line-height: 1.6;
}

html.bsx-font-1 #header,
html.bsx-font-2 #header {
  font-size: 14px;
  line-height: 26px;
}

/* interfejs edytora i konsola debug: rozmiar body motywu, ich własne reguły wygrywają */
:where(html.bsx-font-1, html.bsx-font-2) :where(.bsx-cms-ui:not(.bsx-cms-ui *)) {
  font-size: 14px;
  line-height: 26px;
}

/* kontrolki Bootstrapa mają rozmiar w rem, więc same by nie urosły */
html.bsx-font-1 body :is(.btn, .form-control, .form-select, .input-group-text, .dropdown-item, .alert, input, select, textarea):not(#header *, .bsx-cms-ui, .bsx-cms-ui *),
html.bsx-font-2 body :is(.btn, .form-control, .form-select, .input-group-text, .dropdown-item, .alert, input, select, textarea):not(#header *, .bsx-cms-ui, .bsx-cms-ui *) {
  font-size: 1em;
}

/* wysokości linii motywu są w px */
html.bsx-font-1 body :is(p, li, dd, dt, td, th, label, blockquote, .bsx-text):not(#header *, .bsx-cms-ui, .bsx-cms-ui *),
html.bsx-font-2 body :is(p, li, dd, dt, td, th, label, blockquote, .bsx-text):not(#header *, .bsx-cms-ui, .bsx-cms-ui *) {
  line-height: 1.6 !important;
}

html.bsx-font-1 body :is(h1, h2, h3, h4, h5, h6, :where(.bsx-h2-style, .bsx-h3-style, .bsx-h4-style, .bsx-h5-style)):not(#header *, .bsx-cms-ui, .bsx-cms-ui *),
html.bsx-font-2 body :is(h1, h2, h3, h4, h5, h6, :where(.bsx-h2-style, .bsx-h3-style, .bsx-h4-style, .bsx-h5-style)):not(#header *, .bsx-cms-ui, .bsx-cms-ui *) {
  line-height: 1.25 !important;
}

/* ---------- Opcja: zatrzymaj animacje (także ustawienie systemowe) ---------- */

html.bsx-motion-off :where(:not(.bsx-cms-ui, .bsx-cms-ui *)),
html.bsx-motion-off :where(:not(.bsx-cms-ui, .bsx-cms-ui *))::before,
html.bsx-motion-off :where(:not(.bsx-cms-ui, .bsx-cms-ui *))::after {
  animation-duration: .01ms !important;
  animation-delay: 0s !important;
  animation-iteration-count: 1 !important;
  transition-duration: .01ms !important;
  transition-delay: 0s !important;
  scroll-behavior: auto !important;
}

html.bsx-motion-off .appear-animation {
  opacity: 1 !important;
}

@media (prefers-reduced-motion: reduce) {
  html.bsx-a11y *,
  html.bsx-a11y *::before,
  html.bsx-a11y *::after {
    animation-duration: .01ms !important;
    animation-delay: 0s !important;
    animation-iteration-count: 1 !important;
    transition-duration: .01ms !important;
    scroll-behavior: auto !important;
  }

  html.bsx-a11y .appear-animation {
    opacity: 1 !important;
  }
}

/* ---------- Opcja: podkreślenie linków ---------- */

html.bsx-links body a:not(.btn):not(.bsx-skip-link):where(:not(.bsx-cms-ui, .bsx-cms-ui *)) {
  text-decoration: underline !important;
  text-underline-offset: .15em;
}

/* link z samą ikoną w kółku (ikony społecznościowe) — podkreślenie pod znakiem niczego nie odróżnia */
html.bsx-links body .social-icons li a:not(.btn) {
  text-decoration: none !important;
}

/* ---------- Opcja: odstępy w tekście (wartości z kryterium 1.4.12) ---------- */

html.bsx-spacing body *:not(i):not(.bsx-a11y-panel):not(.bsx-a11y-panel *):where(:not(.bsx-cms-ui, .bsx-cms-ui *)) {
  line-height: 1.5 !important;
  letter-spacing: .12em !important;
  word-spacing: .16em !important;
}

/* interfejs edytora w treści nie dziedziczy odstępów */
:where(html.bsx-spacing) :where(.bsx-cms-ui:not(.bsx-cms-ui *)) {
  line-height: 26px;
  letter-spacing: normal;
  word-spacing: normal;
}

html.bsx-spacing body p:not(.bsx-a11y-panel *):where(:not(.bsx-cms-ui *)) {
  margin-bottom: 2em !important;
}

/* pomiar zwykłego wyglądu dla trybu kontrastu (BSXA11y.Contrast.mark) — bez przejść CSS */
html.bsx-measure,
html.bsx-measure *,
html.bsx-measure *::before,
html.bsx-measure *::after {
  transition: none !important;
}

/* ---------- Opcja: wysoki kontrast — czarne tło, biały tekst, żółte linki i kontrolki ---------- */

/* warstwa bsx-contrast: jej !important wygrywa z motywem i CMS, kolejność w niej ustala #bsx-c w :is(); powierzchnie i kolory: README */

html.bsx-contrast {
  --bsx-hc-text: #fff;
  --bsx-hc-action: #ffd60a;
  --bsx-hc-line: #8c8c8c;
  --bsx-hc-surface-1: #161616;
  --bsx-hc-surface-2: #222;
  --bsx-hc-surface-3: #2e2e2e;
  --bsx-hc-surface-0: #000;
  --bsx-hc-surface: var(--bsx-hc-surface-0);
  --bsx-hc-color: var(--bsx-hc-text);
}

@layer bsx-contrast {
  /* linki i kontrolki przekazują żółty kolor zawartości */
  html.bsx-contrast body :is(a, button, .btn, [role="button"], [role="tab"], summary, select, input:is([type="button"], [type="submit"], [type="reset"])) {
    --bsx-hc-color: var(--bsx-hc-action);
  }

  /* gwiazdki w formularzu oceny są kontrolką (klikane), w opiniach — tylko wartością */
  html.bsx-contrast body .rating-form .rating-stars {
    --bsx-hc-color: var(--bsx-hc-action);
  }

  /* bez koloru tekstu, bo dziedziczą go okna edytora i konsola debug w <body> */
  html.bsx-contrast,
  html.bsx-contrast body {
    background: #000 !important;
  }

  html.bsx-contrast body :is(*, #bsx-c#bsx-c#bsx-c):where(:not(.bsx-cms-ui, .bsx-cms-ui *)),
  html.bsx-contrast body :is(*, #bsx-c#bsx-c#bsx-c):where(:not(.bsx-cms-ui, .bsx-cms-ui *))::before,
  html.bsx-contrast body :is(*, #bsx-c#bsx-c#bsx-c):where(:not(.bsx-cms-ui, .bsx-cms-ui *))::after {
    background-color: transparent !important;
    color: var(--bsx-hc-color) !important;
    -webkit-text-fill-color: currentColor !important;
    text-shadow: none !important;
    box-shadow: none !important;
  }

  /* pierwsza litera i linia oraz znaczniki list mają kolor elementu (motyw barwi je osobno) */
  html.bsx-contrast body :is(*, #bsx-c#bsx-c#bsx-c):where(:not(.bsx-cms-ui, .bsx-cms-ui *))::first-letter,
  html.bsx-contrast body :is(*, #bsx-c#bsx-c#bsx-c):where(:not(.bsx-cms-ui, .bsx-cms-ui *))::first-line,
  html.bsx-contrast body :is(*, #bsx-c#bsx-c#bsx-c):where(:not(.bsx-cms-ui, .bsx-cms-ui *))::marker {
    color: inherit !important;
    -webkit-text-fill-color: currentColor !important;
  }

  /* ozdobne kształty z obramowań pseudoelementów ukryte, strzałki menu zostają */
  html.bsx-contrast body :is(*, #bsx-c#bsx-c#bsx-c):not(.dropdown-toggle, .dropdown-submenu > a):where(:not(.bsx-cms-ui, .bsx-cms-ui *))::before,
  html.bsx-contrast body :is(*, #bsx-c#bsx-c#bsx-c):not(.dropdown-toggle, .dropdown-submenu > a):where(:not(.bsx-cms-ui, .bsx-cms-ui *))::after {
    border-color: transparent !important;
  }

  /* bloki tekstu na tle powierzchni, czytelne także na zdjęciach w tle */
  html.bsx-contrast body :is(h1, h2, h3, h4, h5, h6, :where(.bsx-h2-style, .bsx-h3-style, .bsx-h4-style, .bsx-h5-style), p, li, dt, dd, blockquote, figcaption, caption, legend, label, td, th, #bsx-c#bsx-c#bsx-c):where(:not(.bsx-cms-ui, .bsx-cms-ui *)) {
    background-color: var(--bsx-hc-surface) !important;
  }

  /* nakładki nad treścią muszą zasłaniać to, co pod nimi: nagłówek i stopka (powierzchnia 1) */
  html.bsx-contrast body :is(#header .header-body, .header-nav-main nav, #footer, .footer-ribbon, #bsx-c#bsx-c#bsx-c):where(:not(.bsx-cms-ui, .bsx-cms-ui *)) {
    --bsx-hc-surface: var(--bsx-hc-surface-1);
    background-color: var(--bsx-hc-surface) !important;
  }

  /* menu, okna, dymki i panele nad stroną (powierzchnia 2) */
  html.bsx-contrast body :is(.dropdown-menu, .header-nav-features-dropdown, .modal-content, .offcanvas, [class*="offcanvas"], .shop-sidebar-panel, .popover, .tooltip-inner, .mfp-content, .ui-pnotify-container, .cookies-block, .leaflet-popup-content-wrapper, .leaflet-popup-tip, .leaflet-bar a, .leaflet-control-attribution, .bsx-skip-link, .bsx-a11y-dialog, .bsx-a11y-trigger, .scroll-to-top, option, #bsx-c#bsx-c#bsx-c):where(:not(.bsx-cms-ui, .bsx-cms-ui *)) {
    --bsx-hc-surface: var(--bsx-hc-surface-2);
    background-color: var(--bsx-hc-surface) !important;
  }

  html.bsx-contrast body :is(.body-loading, #bsx-c#bsx-c#bsx-c):where(:not(.bsx-cms-ui, .bsx-cms-ui *)) {
    background-color: #000 !important;
  }

  /* powierzchnie z pomiaru BSXA11y.Contrast */
  html.bsx-contrast body :is(.bsx-c-surface, #bsx-c#bsx-c#bsx-c):where(:not(.bsx-cms-ui, .bsx-cms-ui *)) {
    --bsx-hc-surface: var(--bsx-hc-surface-2);
    background-color: var(--bsx-hc-surface) !important;
  }

  html.bsx-contrast body :is(.bsx-c-band.bsx-c-surface, #bsx-c#bsx-c#bsx-c):where(:not(.bsx-cms-ui, .bsx-cms-ui *)) {
    --bsx-hc-surface: var(--bsx-hc-surface-1);
  }

  html.bsx-contrast body :is(.bsx-c-surface:not(.bsx-c-band), .dropdown-menu, .modal-content, .shop-sidebar-panel, .mfp-content, .popover) :is(.bsx-c-surface:not(.bsx-c-band), #bsx-c#bsx-c#bsx-c):where(:not(.bsx-cms-ui, .bsx-cms-ui *)) {
    --bsx-hc-surface: var(--bsx-hc-surface-3);
  }

  /* pasek „Odpowiadasz na komentarz” czarny, bo #2e2e2e na #222 się zlewa */
  html.bsx-contrast body :is(.reply-context, #bsx-c#bsx-c#bsx-c#bsx-c):where(:not(.bsx-cms-ui, .bsx-cms-ui *)) {
    --bsx-hc-surface: var(--bsx-hc-surface-0);
    background-color: var(--bsx-hc-surface) !important;
  }

  html.bsx-contrast body :is(#cookies-box-back, .mfp-bg, .modal-backdrop, .shop-sidebar-backdrop, #bsx-c#bsx-c#bsx-c):where(:not(.bsx-cms-ui, .bsx-cms-ui *)) {
    background-color: rgba(0, 0, 0, .85) !important;
  }

  /* zdjęcia w tle przyciemnione o 65% (biały tekst ≥ 7:1) */
  html.bsx-contrast body :is([style*="url("], .parallax-background, .bsx-parallax-background, #bsx-c#bsx-c#bsx-c):where(:not(.bsx-cms-ui, .bsx-cms-ui *)) {
    box-shadow: inset 0 0 0 100vmax rgba(0, 0, 0, .65) !important;
  }

  html.bsx-contrast body [style*="url("] :is(h1, h2, h3, h4, h5, h6, :where(.bsx-h2-style, .bsx-h3-style, .bsx-h4-style, .bsx-h5-style), p, li, dt, dd, blockquote, figcaption, caption, legend, label, td, th, #bsx-c#bsx-c#bsx-c):where(:not(.bsx-cms-ui, .bsx-cms-ui *)) {
    background-color: transparent !important;
  }

  html.bsx-contrast body [style*="url("] :is(*, #bsx-c#bsx-c#bsx-c#bsx-c):where(:not(.bsx-cms-ui, .bsx-cms-ui *)) {
    text-shadow: 0 0 2px #000, 0 0 8px #000 !important;
  }

  /* logotypy i zdjęcia produktów (często przezroczyste PNG) na jasnym tle */
  html.bsx-contrast body :is(#header .header-logo img, #footer a.logo img, .logos-component img, #bsx-c#bsx-c#bsx-c#bsx-c):where(:not(.bsx-cms-ui, .bsx-cms-ui *)) {
    padding: 4px 8px !important;
    border-radius: 4px !important;
    background-color: #fff !important;
    object-fit: contain !important;
    opacity: 1 !important;
    filter: none !important;
  }

  html.bsx-contrast body :is(.product-thumb-info-image img, .thumb-gallery-wrapper img, .product-thumbnail img, .product-thumbnail-image img, .product-image img, img.subproduct-image, #bsx-c#bsx-c#bsx-c#bsx-c):where(:not(.bsx-cms-ui, .bsx-cms-ui *)) {
    background-color: #fff !important;
  }

  /* karuzela logotypów przygasza wszystkie poza środkowym — tu tła logotypów są jednakowe */
  html.bsx-contrast body .carousel-center-active-item :is(.owl-item, #bsx-c#bsx-c#bsx-c):where(:not(.bsx-cms-ui, .bsx-cms-ui *)) {
    opacity: 1 !important;
  }

  /* przyciski na zdjęciu produktu tracą tło motywu */
  html.bsx-contrast body :is(.quick-view, .addtocart-btn, #bsx-c#bsx-c#bsx-c#bsx-c):where(:not(.bsx-cms-ui, .bsx-cms-ui *)) {
    background-color: #000 !important;
    text-decoration: none !important;
  }

  html.bsx-contrast body :is(.addtocart-btn, #bsx-c#bsx-c#bsx-c#bsx-c):where(:not(.bsx-cms-ui, .bsx-cms-ui *)) {
    border: 2px solid var(--bsx-hc-action) !important;
  }

  /* „Usuń z koszyka”: czarne kółko 24 px (2.5.8) */
  html.bsx-contrast body :is(.btn-remove, .product-thumbnail-remove, #bsx-c#bsx-c#bsx-c#bsx-c):where(:not(.bsx-cms-ui, .bsx-cms-ui *)) {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    width: 24px !important;
    height: 24px !important;
    border: 2px solid var(--bsx-hc-action) !important;
    background-color: #000 !important;
    font-size: 12px !important;
    line-height: 1 !important;
    text-decoration: none !important;
  }

  /* licznik koszyka: żółte kółko z czarną cyfrą */
  html.bsx-contrast body :is(.cart-qty, #bsx-c#bsx-c#bsx-c#bsx-c):where(:not(.bsx-cms-ui, .bsx-cms-ui *)) {
    top: -14px !important;
    right: -12px !important;
    width: auto !important;
    min-width: 18px !important;
    height: 18px !important;
    padding: 0 4px !important;
    border-radius: 9px !important;
    background-color: var(--bsx-hc-action) !important;
    box-shadow: 0 0 0 2px var(--bsx-hc-surface) !important;
    color: #000 !important;
    font-size: 11px !important;
    font-weight: 700 !important;
    line-height: 18px !important;
  }

  /* dymek z nazwą przycisku (content: attr(title)) */
  html.bsx-contrast body :is(.addtocart-btn, #bsx-c#bsx-c#bsx-c#bsx-c):where(:not(.bsx-cms-ui, .bsx-cms-ui *))::before {
    border: 1px solid var(--bsx-hc-line) !important;
    background-color: #000 !important;
    color: var(--bsx-hc-text) !important;
  }

  /* krzyżyki zamknięcia (Bootstrap 4, lightbox) przygaszone przez motyw */
  html.bsx-contrast body :is(.close, .mfp-close, #bsx-c#bsx-c#bsx-c#bsx-c):where(:not(.bsx-cms-ui, .bsx-cms-ui *)) {
    opacity: 1 !important;
  }

  /* krzyżyk zamknięcia Bootstrapa 5 jest ciemnym obrazkiem tła */
  html.bsx-contrast body :is(.btn-close, #bsx-c#bsx-c#bsx-c#bsx-c):where(:not(.bsx-cms-ui, .bsx-cms-ui *)) {
    background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='%23ffd60a'%3e%3cpath d='M.293.293a1 1 0 011.414 0L8 6.586 14.293.293a1 1 0 111.414 1.414L9.414 8l6.293 6.293a1 1 0 01-1.414 1.414L8 9.414l-6.293 6.293a1 1 0 01-1.414-1.414L6.586 8 .293 1.707a1 1 0 010-1.414z'/%3e%3c/svg%3e") !important;
    opacity: 1 !important;
    filter: none !important;
  }

  /* filtry sklepu: pole rysuje ::before linku, obwódka cieniem */
  html.bsx-contrast body :is(.checkbox-filtr, #bsx-c#bsx-c#bsx-c#bsx-c):where(:not(.bsx-cms-ui, .bsx-cms-ui *)) {
    text-decoration: none !important;
  }

  html.bsx-contrast body :is(.checkbox-filtr, #bsx-c#bsx-c#bsx-c#bsx-c):where(:not(.bsx-cms-ui, .bsx-cms-ui *))::before {
    box-shadow: inset 0 0 0 2px var(--bsx-hc-action) !important;
    background-color: transparent !important;
    color: transparent !important;
  }

  html.bsx-contrast body .checkmarked :is(.checkbox-filtr, #bsx-c#bsx-c#bsx-c#bsx-c):where(:not(.bsx-cms-ui, .bsx-cms-ui *))::before {
    background-color: var(--bsx-hc-action) !important;
    color: #000 !important;
  }

  /* pole .custom-checkbox-1 rysują label::before i ::after */
  html.bsx-contrast body .custom-checkbox-1 :is(label, #bsx-c#bsx-c#bsx-c#bsx-c):where(:not(.bsx-cms-ui, .bsx-cms-ui *))::before {
    border: 2px solid var(--bsx-hc-action) !important;
    background-color: #000 !important;
  }

  html.bsx-contrast body .custom-checkbox-1 input[type="checkbox"]:checked + :is(label, #bsx-c#bsx-c#bsx-c#bsx-c):where(:not(.bsx-cms-ui, .bsx-cms-ui *))::before {
    background-color: var(--bsx-hc-action) !important;
  }

  html.bsx-contrast body .custom-checkbox-1 input[type="checkbox"]:checked + :is(label, #bsx-c#bsx-c#bsx-c#bsx-c):where(:not(.bsx-cms-ui, .bsx-cms-ui *))::after {
    color: #000 !important;
  }

  html.bsx-contrast body .custom-checkbox-1 input[type="checkbox"]:disabled + :is(label, #bsx-c#bsx-c#bsx-c#bsx-c#bsx-c):where(:not(.bsx-cms-ui, .bsx-cms-ui *))::before {
    border-color: var(--bsx-hc-line) !important;
  }

  html.bsx-contrast body .custom-checkbox-1 input[type="checkbox"]:focus-visible + :is(label, #bsx-c#bsx-c#bsx-c#bsx-c#bsx-c):where(:not(.bsx-cms-ui, .bsx-cms-ui *))::before {
    outline: var(--bsx-focus-width) solid var(--bsx-focus-outer) !important;
    outline-offset: var(--bsx-focus-width) !important;
    box-shadow: 0 0 0 var(--bsx-focus-width) var(--bsx-focus-inner) !important;
  }

  /* lupa na zdjęciu produktu na czarnym kole */
  html.bsx-contrast body :is(.prod-full-screen, #bsx-c#bsx-c#bsx-c#bsx-c):where(:not(.bsx-cms-ui, .bsx-cms-ui *)) {
    /* bez tego koło z interlinii byłoby owalem */
    line-height: 1 !important;
    border-radius: 50% !important;
    background-color: #000 !important;
    box-shadow: 0 0 0 .4em #000 !important;
    --bsx-hc-color: var(--bsx-hc-action);
  }

  /* żółta ramka kontrolek; bez ramki przyciski-linki, krzyżyki i przyciski-ikony */
  html.bsx-contrast body :is(.btn, button, input, select, textarea, #bsx-c#bsx-c#bsx-c#bsx-c):not(.btn-link, .close, .btn-close, .mfp-close, .owl-dot, .owl-prev, .owl-next, .prod-full-screen, .change-parcel, [type="checkbox"], [type="radio"]):where(:not(.bsx-cms-ui, .bsx-cms-ui *)) {
    background-color: #000 !important;
    border: 2px solid var(--bsx-hc-action) !important;
  }

  /* link w tekście (bsx-c-textlink) podkreślony — 1.4.1 */
  html.bsx-contrast body :is(a.bsx-c-textlink, #bsx-c#bsx-c#bsx-c):where(:not(.bsx-cms-ui, .bsx-cms-ui *)) {
    text-decoration: underline !important;
  }

  /* bieżąca pozycja menu i języka — inaczej niż kolorem tła z CMS, który tu znika */
  html.bsx-contrast body :is([aria-current="page"], .dropdown-item[aria-current="true"], #bsx-c#bsx-c#bsx-c#bsx-c#bsx-c):where(:not(.bsx-cms-ui, .bsx-cms-ui *)) {
    text-decoration: underline !important;
    text-decoration-thickness: 3px !important;
    text-underline-offset: .35em !important;
  }

  /* ramki i linie elementów z tłem lub cieniem (pomiar BSXA11y.Contrast) */
  html.bsx-contrast body :is(.bsx-c-box, #bsx-c#bsx-c#bsx-c):where(:not(.bsx-cms-ui, .bsx-cms-ui *)) {
    outline: 1px solid var(--bsx-hc-line) !important;
    outline-offset: -1px !important;
  }

  html.bsx-contrast body :is(.bsx-c-band, #bsx-c#bsx-c#bsx-c):where(:not(.bsx-cms-ui, .bsx-cms-ui *)) {
    box-shadow: inset 0 1px 0 var(--bsx-hc-line), inset 0 -1px 0 var(--bsx-hc-line) !important;
  }

  html.bsx-contrast body :is(.bsx-c-band.bsx-c-flush, #bsx-c#bsx-c#bsx-c):where(:not(.bsx-cms-ui, .bsx-cms-ui *)) {
    box-shadow: inset 0 -1px 0 var(--bsx-hc-line) !important;
  }

  /* pod elementem, nie wewnątrz — wnętrze zakrywa czarne tło nagłówka czy akapitu w środku */
  html.bsx-contrast body :is(.bsx-c-sep, #bsx-c#bsx-c#bsx-c):where(:not(.bsx-cms-ui, .bsx-cms-ui *)) {
    box-shadow: 0 1px 0 var(--bsx-hc-line) !important;
  }

  /* widoczne w zwykłym wyglądzie boki obramowań (pomiar BSXA11y.Contrast) */
  html.bsx-contrast body :is(.bsx-c-bt, #bsx-c#bsx-c#bsx-c):where(:not(.bsx-cms-ui, .bsx-cms-ui *)) { border-top-color: var(--bsx-hc-line) !important; }
  html.bsx-contrast body :is(.bsx-c-br, #bsx-c#bsx-c#bsx-c):where(:not(.bsx-cms-ui, .bsx-cms-ui *)) { border-right-color: var(--bsx-hc-line) !important; }
  html.bsx-contrast body :is(.bsx-c-bb, #bsx-c#bsx-c#bsx-c):where(:not(.bsx-cms-ui, .bsx-cms-ui *)) { border-bottom-color: var(--bsx-hc-line) !important; }
  html.bsx-contrast body :is(.bsx-c-bl, #bsx-c#bsx-c#bsx-c):where(:not(.bsx-cms-ui, .bsx-cms-ui *)) { border-left-color: var(--bsx-hc-line) !important; }

  /* cienkie elementy z tłem (separatory, tor suwaka) — linie; małe wypełnienia bez tekstu (kropki) — kolor tekstu */
  html.bsx-contrast body :is(.bsx-c-line, #bsx-c#bsx-c#bsx-c):where(:not(.bsx-cms-ui, .bsx-cms-ui *)),
  html.bsx-contrast body :is(.bsx-c-line-before, #bsx-c#bsx-c#bsx-c):where(:not(.bsx-cms-ui, .bsx-cms-ui *))::before,
  html.bsx-contrast body :is(.bsx-c-line-after, #bsx-c#bsx-c#bsx-c):where(:not(.bsx-cms-ui, .bsx-cms-ui *))::after {
    background-color: var(--bsx-hc-line) !important;
  }

  html.bsx-contrast body :is(.bsx-c-fill, #bsx-c#bsx-c#bsx-c):where(:not(.bsx-cms-ui, .bsx-cms-ui *)) {
    background-color: var(--bsx-hc-color) !important;
  }

  /* suwak noUiSlider po klasie, nie po roli — gwiazdki oceny też są role="slider" */
  html.bsx-contrast body :is(.noUi-connect, .noUi-handle, #bsx-c#bsx-c#bsx-c#bsx-c):where(:not(.bsx-cms-ui, .bsx-cms-ui *)) {
    background-color: var(--bsx-hc-action) !important;
  }

  /* linie poziome: motyw rysuje je gradientem tła */
  html.bsx-contrast body :is(hr, #bsx-c#bsx-c#bsx-c):where(:not(.bsx-cms-ui, .bsx-cms-ui *)) {
    height: 1px !important;
    border: 0 !important;
    background-image: none !important;
    background-color: var(--bsx-hc-line) !important;
    opacity: 1 !important;
  }

  /* aktywna zakładka i bieżąca strona paginacji — tło z CMS znika, więc wyróżnienie jak włączonej opcji */
  html.bsx-contrast body :is(.nav-tabs .nav-link.active, .nav-tabs .active > .nav-link, .page-item.active .page-link, .pagination .active > :is(a, span), #bsx-c#bsx-c#bsx-c#bsx-c):where(:not(.bsx-cms-ui, .bsx-cms-ui *)) {
    border-color: var(--bsx-hc-action) !important;
    background-color: var(--bsx-hc-action) !important;
    color: #000 !important;
    --bsx-hc-color: #000;
  }

  /* krawędzie nieaktywnych zakładek szare — żółta wyglądałaby jak zaznaczenie */
  html.bsx-contrast body :is(.nav-tabs .nav-link, #bsx-c#bsx-c#bsx-c):where(:not(.bsx-cms-ui, .bsx-cms-ui *)) {
    border-color: var(--bsx-hc-line) !important;
  }

  /* wyłączona strzałka paginacji (pierwsza lub ostatnia strona) szara — żółta wyglądałaby jak aktywny link */
  html.bsx-contrast body :is(.page-item.disabled .page-link, #bsx-c#bsx-c#bsx-c#bsx-c):where(:not(.bsx-cms-ui, .bsx-cms-ui *)) {
    border-color: var(--bsx-hc-line) !important;
    --bsx-hc-color: var(--bsx-hc-line);
  }

  /* wybrana miniatura galerii produktu: zwykłą ciemną ramkę pomiar rysuje szaro jak pozostałe */
  html.bsx-contrast body :is(.thumb-gallery-thumbs .owl-item.selected, #bsx-c#bsx-c#bsx-c#bsx-c):where(:not(.bsx-cms-ui, .bsx-cms-ui *)) {
    outline: 3px solid var(--bsx-hc-action) !important;
    outline-offset: -3px !important;
  }

  /* dzisiejszy dzień w kalendarzu wyróżnia tło, które tu znika */
  html.bsx-contrast body :is(.fc-day-today, #bsx-c#bsx-c#bsx-c#bsx-c):where(:not(.bsx-cms-ui, .bsx-cms-ui *)) {
    box-shadow: inset 0 0 0 2px var(--bsx-hc-text) !important;
  }

  html.bsx-contrast body :is([class*="bsx-border-right-"], #bsx-c#bsx-c#bsx-c):where(:not(.bsx-cms-ui, .bsx-cms-ui *)) {
    border-right-color: var(--bsx-hc-line) !important;
  }

  /* strzałki dymków (komentarze, opinie) — kolorem tła dymka, jak ogonek */
  html.bsx-contrast body :is(.comment-arrow, #bsx-c#bsx-c#bsx-c):where(:not(.bsx-cms-ui, .bsx-cms-ui *)) {
    border-right-color: var(--bsx-hc-surface-2) !important;
  }

  /* obramowania w kolorach skórki (klasy bsx-border-*) — tylko boki, które klasa koloruje */
  html.bsx-contrast body :is([class~="bsx-border-primary"], [class~="bsx-border-secondary"], [class~="bsx-border-third"], [class~="bsx-border-fourth"], #bsx-c#bsx-c#bsx-c):where(:not(.bsx-cms-ui, .bsx-cms-ui *)) {
    border-color: var(--bsx-hc-line) !important;
  }

  html.bsx-contrast body :is([class*="bsx-border-top-"], #bsx-c#bsx-c#bsx-c):where(:not(.bsx-cms-ui, .bsx-cms-ui *)) {
    border-top-color: var(--bsx-hc-line) !important;
  }

  html.bsx-contrast body :is(.testimonial-arrow-down, #bsx-c#bsx-c#bsx-c):where(:not(.bsx-cms-ui, .bsx-cms-ui *)) {
    border-top-color: var(--bsx-hc-surface-2) !important;
  }

  html.bsx-contrast body :is([class*="bsx-border-bottom-"], #bsx-c#bsx-c#bsx-c):where(:not(.bsx-cms-ui, .bsx-cms-ui *)) {
    border-bottom-color: var(--bsx-hc-line) !important;
  }

  html.bsx-contrast body :is([class*="bsx-border-left-"], #bsx-c#bsx-c#bsx-c):where(:not(.bsx-cms-ui, .bsx-cms-ui *)) {
    border-left-color: var(--bsx-hc-line) !important;
  }

  html.bsx-contrast body :is(#header .header-body, #bsx-c#bsx-c#bsx-c):where(:not(.bsx-cms-ui, .bsx-cms-ui *)) {
    border-bottom: 1px solid var(--bsx-hc-line) !important;
  }

  html.bsx-contrast body :is(#footer, #bsx-c#bsx-c#bsx-c):where(:not(.bsx-cms-ui, .bsx-cms-ui *)) {
    border-top: 1px solid var(--bsx-hc-line) !important;
  }

  /* tryb ciemny nie ma znaczenia przy kontraście */
  html.bsx-contrast body :is(.switch, #bsx-c#bsx-c#bsx-c):where(:not(.bsx-cms-ui, .bsx-cms-ui *)) {
    display: none !important;
  }

  /* pola wyboru rysuje przeglądarka (Bootstrap rysuje znaczniki obrazem tła, który tu ginie) */
  html.bsx-contrast body :is(input[type="checkbox"], input[type="radio"], #bsx-c#bsx-c#bsx-c):where(:not(.bsx-cms-ui, .bsx-cms-ui *)) {
    appearance: auto !important;
    -webkit-appearance: auto !important;
    background-image: none !important;
    accent-color: var(--bsx-hc-action) !important;
  }

  /* strzałka listy wyboru Bootstrapa w kolorze kontrolki (natywny wygląd ucinał wybraną wartość) */
  html.bsx-contrast body :is(.form-select, #bsx-c#bsx-c#bsx-c):where(:not(.bsx-cms-ui, .bsx-cms-ui *)) {
    background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3e%3cpath fill='none' stroke='%23ffd60a' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='M2 5l6 6 6-6'/%3e%3c/svg%3e") !important;
    background-repeat: no-repeat !important;
    background-position: right .75rem center !important;
    background-size: 16px 12px !important;
  }

  html.bsx-contrast body :where(:not(.bsx-cms-ui, .bsx-cms-ui *))::placeholder {
    color: #a6a6a6 !important;
    opacity: 1 !important;
  }

  html.bsx-contrast body [class*="opacity-"]:not(.opacity-0):where(:not(.bsx-cms-ui, .bsx-cms-ui *)) {
    opacity: 1 !important;
  }

  html.bsx-contrast body :is(iframe, video, #bsx-c#bsx-c#bsx-c):where(:not(.bsx-cms-ui, .bsx-cms-ui *)) {
    border: 1px solid var(--bsx-hc-line) !important;
  }

  /* kropki karuzel rysowane są tłem, które tu znika */
  html.bsx-contrast body .owl-dot :is(span, #bsx-c#bsx-c#bsx-c#bsx-c):where(:not(.bsx-cms-ui, .bsx-cms-ui *)) {
    border: 2px solid var(--bsx-hc-action) !important;
    background-color: transparent !important;
  }

  html.bsx-contrast body .owl-dot.active :is(span, #bsx-c#bsx-c#bsx-c#bsx-c):where(:not(.bsx-cms-ui, .bsx-cms-ui *)) {
    background-color: var(--bsx-hc-action) !important;
  }

  /* fokus w warstwie, bo jej box-shadow: none !important wygrywa z regułami spoza niej */
  html.bsx-contrast body :is(*, #bsx-c#bsx-c#bsx-c#bsx-c):not(#main-content):not(input:not([type="checkbox"], [type="radio"], [type="button"], [type="submit"], [type="reset"], [type="range"], [type="file"], [type="image"], [type="color"]), textarea, [contenteditable]):focus-visible:where(:not(.bsx-cms-ui, .bsx-cms-ui *)),
  html.bsx-contrast body .bsx-focus-child:focus-visible > :is(*, #bsx-c#bsx-c#bsx-c#bsx-c):where(:not(.bsx-cms-ui, .bsx-cms-ui *)) {
    outline: var(--bsx-focus-width) var(--bsx-focus-style, solid) var(--bsx-focus-outer) !important;
    outline-offset: var(--bsx-focus-offset, var(--bsx-focus-width)) !important;
    box-shadow: var(--bsx-focus-shadow, 0 0 0 var(--bsx-focus-width) var(--bsx-focus-inner)) !important;
  }

  /* następny element listy lub komórka nie zasłania ramki */
  html.bsx-contrast body :is(li, dt, dd, td, th, #bsx-c#bsx-c#bsx-c#bsx-c):focus-within + :is(li, dt, dd, td, th):where(:not(.bsx-cms-ui, .bsx-cms-ui *)),
  html.bsx-contrast body :is(tr, #bsx-c#bsx-c#bsx-c#bsx-c):focus-within + tr > :is(td, th):where(:not(.bsx-cms-ui, .bsx-cms-ui *)) {
    background-color: transparent !important;
  }

  /* poprzedni element zasłania ramkę, gdy jest pozycjonowany; osobno, bo :has() nie jest wyrozumiałe */
  html.bsx-contrast body :is(li, dt, dd, td, th, #bsx-c#bsx-c#bsx-c#bsx-c):has(+ :is(li, dt, dd, td, th):focus-within):where(:not(.bsx-cms-ui, .bsx-cms-ui *)) {
    background-color: transparent !important;
  }

  html.bsx-contrast body :is(input:not([type="checkbox"], [type="radio"], [type="button"], [type="submit"], [type="reset"], [type="range"], [type="file"], [type="image"], [type="color"]), textarea, [contenteditable], #bsx-c#bsx-c#bsx-c#bsx-c):focus-visible:where(:not(.bsx-cms-ui, .bsx-cms-ui *)) {
    outline: none !important;
    border-color: #fff !important;
  }

  /* włączone opcje panelu */
  html.bsx-contrast body :is(.bsx-a11y-option, .bsx-a11y-font, #bsx-c#bsx-c#bsx-c#bsx-c)[aria-pressed="true"]:where(:not(.bsx-cms-ui, .bsx-cms-ui *)) {
    border-color: var(--bsx-hc-action) !important;
    background-color: var(--bsx-hc-action) !important;
    color: #000 !important;
    --bsx-hc-color: #000;
  }

  html.bsx-contrast body :is(.bsx-a11y-option, .bsx-a11y-font, #bsx-c#bsx-c#bsx-c#bsx-c)[aria-pressed="true"] *:where(:not(.bsx-cms-ui, .bsx-cms-ui *)),
  html.bsx-contrast body :is(.bsx-a11y-option, #bsx-c#bsx-c#bsx-c#bsx-c)[aria-pressed="true"]:where(:not(.bsx-cms-ui, .bsx-cms-ui *))::after {
    background-color: transparent !important;
    color: #000 !important;
  }

}