/* =========================================================================
   EDAXO.ro — NADPISANY CSS (wersja uporządkowana / zoptymalizowana)
   Szablon: IdoSell / IAI + Bootstrap (kontener bazowy 1170px)

   ZASADY:
   - Breakpointy ujednolicone do: 550 / 768 / 980 / 1024 / 1400 / 1600 px
   - Reguły zgrupowane TEMATYCZNIE, a nie wg kolejności wklejania
   - Zmienne motywu w :root (łatwa konfiguracja per-sklep)
   - !important pozostawione tylko tam, gdzie realnie nadpisuje motyw
   - Selektory zależne od konkretnych grafik/URL oznaczone [EDAXO-ONLY]
   ========================================================================= */

:root {
  /* Konfiguracja per-sklep — zmień tutaj, nie w regułach */
  --edx-container-max: 1900px;     /* szerokość głównego kontenera */
  --edx-accent: #379e9d;           /* kolor przycisku "czytaj więcej" */
  --edx-accent-hover: #000000;
  --edx-tile-h: 420px;             /* wysokość kafelka menu na dużych ekranach */
  --edx-grid-gap: 10px;            /* odstęp w siatce produktów */
}

/* =========================================================================
   1. KONTENER GŁÓWNY — poszerzenie z 1170px do 1900px
   ========================================================================= */
.variable-max-width,
.max-width-1200,
.container,
.payment_tunnel .container,
.order_process .container,
.container.basketedit_page,
.container.prepaid_page {
  max-width: var(--edx-container-max) !important;
}

#content {
  padding-left: 20px !important;
  padding-right: 20px !important;
}

@media (max-width: 1024px) {
  main#content {
    padding-left: 15px !important;
    padding-right: 15px !important;
  }
}

/* =========================================================================
   2. SIATKA PRODUKTÓW (listing / kategoria .products)
   Mobile/tablet: 2 kolumny · desktop: 3 · bardzo szerokie: 4
   ========================================================================= */
@media (min-width: 758px) {
  .products {
    display: grid !important;
    grid-template-columns: repeat(3, 1fr) !important;
  }
}
@media (min-width: 1600px) {
  .products {
    grid-template-columns: repeat(4, 1fr) !important;
  }
}

/* Wyniki wyszukiwania (#search): wymuszone 2 kolumny do 979px */
@media (max-width: 979px) {
  #search.products {
    display: grid !important;
    grid-template-columns: repeat(2, 1fr) !important;
    gap: var(--edx-grid-gap) !important;
  }
  #search .product {
    width: 100% !important;
    max-width: 100% !important;
    flex: auto !important;
  }
}
@media (max-width: 550px) {
  #search.products { gap: 5px !important; }
}

/* =========================================================================
   3. KARUZELE PRODUKTÓW (.products.hotspot__products.swiper-wrapper)
   Mobile: 2 widoczne + scroll-snap · Desktop: 5 obok siebie
   ========================================================================= */
.swiper-wrapper { align-items: stretch !important; }
.swiper-slide   { height: auto !important; }

/* Ukrycie domyślnych strzałek swipera */
.swiper-button-prev.--rounded,
.swiper-button-next.--rounded {
  display: none !important;
}

/* --- Mobile / tablet (<=979px): 2 kafelki + przewijanie poziome --- */
@media (max-width: 979px) {
  .products.hotspot__products.swiper-wrapper {
    display: flex !important;
    flex-wrap: nowrap !important;
    overflow-x: auto !important;
    -webkit-overflow-scrolling: touch !important;
    scroll-snap-type: x mandatory !important;
    gap: var(--edx-grid-gap) !important;
  }
  .products.hotspot__products.swiper-wrapper .product.hotspot__product {
    flex-shrink: 0 !important;
    scroll-snap-align: start !important;
    width: calc(50% - 5px) !important;
    max-width: calc(50% - 5px) !important;
    box-sizing: border-box !important;
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
  }
}
@media (max-width: 550px) {
  .products.hotspot__products.swiper-wrapper { gap: 5px !important; }
  .products.hotspot__products.swiper-wrapper .product.hotspot__product {
    width: calc(50% - 2.5px) !important;
    max-width: calc(50% - 2.5px) !important;
  }
}

/* --- Desktop (>=980px): 5 produktów w rzędzie --- */
@media (min-width: 980px) {
  .products.hotspot__products.swiper-wrapper {
    display: flex !important;
    flex-wrap: wrap !important;
    justify-content: space-between !important;
    align-items: stretch !important;
    gap: var(--edx-grid-gap) !important;
  }
  .products.hotspot__products.swiper-wrapper .product.hotspot__product {
    flex: 0 0 calc(20% - 8px) !important;
    max-width: calc(20% - 8px) !important;
    box-sizing: border-box !important;
    display: flex !important;
    flex-direction: column !important;
    justify-content: flex-start !important;
    align-items: center !important;
  }
  .products.hotspot__products.swiper-wrapper .product.hotspot__product img {
    width: 100% !important;
    height: 100% !important;
    object-fit: contain !important;
    display: block !important;
  }
}

/* --- Wygląd kafelka produktu w karuzeli --- */
.products.hotspot__products.swiper-wrapper .product.hotspot__product.swiper-slide.d-flex.flex-column {
  background-color: #f1f1f1 !important;
  border-radius: 6px;
  padding: 1px;
  box-sizing: border-box;
  box-shadow: 0 2px 6px rgba(0, 0, 0, 0.1);
  transition: transform 0.2s ease;
}
.products.hotspot__products.swiper-wrapper .product.hotspot__product.swiper-slide.d-flex.flex-column:hover {
  transform: translateY(-3px);
}

/* Wyrównanie treści kafelka do lewej */
.product.hotspot__product.swiper-slide.d-flex.flex-column .product__content_wrapper {
  align-self: flex-start !important;
  align-items: flex-start !important;
  justify-content: flex-start !important;
  text-align: left !important;
  margin-left: 0 !important;
  width: 100%;
}
.product.hotspot__product.swiper-slide.d-flex.flex-column .product__content_wrapper .product__name,
.product.hotspot__product.swiper-slide.d-flex.flex-column .product__content_wrapper .price,
.product.hotspot__product.swiper-slide.d-flex.flex-column .product__content_wrapper .price * {
  text-align: left !important;
  margin-left: 0 !important;
}

/* Odstępy wrappera karuzeli */
.products__wrapper {
  margin-left: 5px !important;
  margin-right: 5px !important;
}
.hotspot__name.headline__wrapper { padding-left: 15px !important; }
.product.hotspot__product.swiper-slide {
  padding-left: 0 !important;
  padding-right: 0 !important;
}

/* Mobile: ciasny układ wrappera produktów */
@media (max-width: 767.98px) {
  .products__wrapper.swiper {
    display: flex !important;
    flex-wrap: wrap !important;
    gap: 2px !important;
    box-sizing: border-box !important;
    overflow: hidden !important;
    padding: 0 !important;
  }
  .products__wrapper .product.hotspot__product.swiper-slide {
    box-sizing: border-box !important;
    padding: 0 !important;
    margin: 2px !important;
  }
}

/* Pulsujące strzałki ‹ › jako podpowiedź przewijania (tylko dotyk/mobile) */
@media (hover: none) and (pointer: coarse), (max-width: 767.98px) {
  .products.hotspot__products.swiper-wrapper {
    position: relative !important;
    isolation: isolate !important;
    overflow-x: auto !important;
    -webkit-overflow-scrolling: touch !important;
    scroll-snap-type: x mandatory !important;
  }
  .products.hotspot__products.swiper-wrapper::before,
  .products.hotspot__products.swiper-wrapper::after {
    position: absolute;
    top: 50%;
    font-size: 22px;
    font-weight: 700;
    color: rgba(120, 120, 120, 0.9);
    z-index: 9999;
    pointer-events: none;
    transform: translateY(-50%);
  }
  .products.hotspot__products.swiper-wrapper::before {
    content: "\2039"; left: 2px;
    animation: edxArrowPulse 2s ease-in-out infinite;
  }
  .products.hotspot__products.swiper-wrapper::after {
    content: "\203A"; right: 2px;
    animation: edxArrowPulse 3s ease-in-out infinite;
  }
  @keyframes edxArrowPulse {
    0%, 100% { opacity: 0.3; transform: translateY(-50%) scale(1); }
    50%      { opacity: 1;   transform: translateY(-50%) scale(1.2); }
  }
}

/* =========================================================================
   4. CENY I ETYKIETY PRODUKTU
   ========================================================================= */
.price__sub { font-size: 2rem !important; }

/* Ukrycie cen Omnibus */
.price.--omnibus.omnibus_price,
.product__prices .omnibus_label {
  display: none !important;
}

/* Procent rabatu w rogu kafelka */
.product.hotspot__product .price_percent {
  position: absolute !important;
  right: 5px !important;
  bottom: 5px !important;
  font-size: 1.2em !important;
  font-weight: 550 !important;
  color: #287963 !important;
  padding: 2px 6px 0 !important;
  border-radius: 3px !important;
}

/* Etykiety produktu — kontener w lewym dolnym rogu */
.labels-container {
  position: absolute !important;
  bottom: 6px !important;
  left: 6px !important;
  display: flex !important;
  flex-wrap: wrap !important;
  gap: 4px !important;
  z-index: 999 !important;
}
.label {
  position: static !important;       /* pozycję kontroluje kontener */
  display: inline-flex !important;
  align-items: center;
  justify-content: center;
  white-space: nowrap;
}

/* Ukrycie etykiet w blokach Luigi (autocomplete / rekomendacje) */
.luigi-ac-rest-main .label,
.luigi-ac-products .label {
  display: none !important;
}

/* Ikony etykiet bez wcięcia */
.label_icons {
  position: absolute !important;
  left: 0 !important;
  padding-left: 0 !important;
  margin-left: 0 !important;
}

/* =========================================================================
   5. MENU KAFLOWE (#menu_buttons2) — 3 banery
   Mobile: 1 kolumna · Tablet: 2+1 · Desktop: rząd · 1400+: stała proporcja
   ========================================================================= */
#menu_buttons2 {
  display: flex !important;
  flex-wrap: nowrap !important;
  justify-content: flex-start !important;
  align-items: center !important;
  gap: 0 !important;
}
#menu_buttons2 > div {
  padding: 0 2px !important;
  display: flex !important;
  justify-content: center !important;
  align-items: center !important;
  box-sizing: border-box !important;
}
#menu_buttons2 > div img {
  display: block !important;
  max-width: 100% !important;
  height: auto !important;
}

/* --- Mobile (<=757px): jedna kolumna, pełna szerokość --- */
@media (max-width: 757px) {
  #menu_buttons2 {
    flex-direction: column !important;
    align-items: center !important;
    width: 100% !important;
    gap: 5px !important;
    margin: 0 auto !important;
    padding-bottom: 30px !important;
    box-sizing: border-box !important;
  }
  #menu_buttons2 .menu_button_wrapper,
  #menu_buttons2 .col-md-4,
  #menu_buttons2 .col-6 {
    flex: 0 0 100% !important;
    width: 100% !important;
    max-width: 100% !important;
    padding: 10px !important;
    margin: 0 auto !important;
    box-sizing: border-box !important;
  }
  #menu_buttons2 .menu_button_wrapper > a,
  #menu_buttons2 .menu_button_wrapper > picture,
  #menu_buttons2 .menu_button_wrapper img {
    display: block !important;
    width: 100% !important;
    max-width: 100% !important;
    height: auto !important;
  }
}

/* --- Tablet (758–979px): pierwsze dwa po 50%, trzeci pełna szerokość --- */
@media (min-width: 758px) and (max-width: 979px) {
  #menu_buttons2 {
    flex-wrap: wrap !important;
    justify-content: center !important;
    align-items: stretch !important;
    gap: 5px !important;
    width: 100% !important;
    padding-left: 5px !important;
    padding-right: 5px !important;
    box-sizing: border-box !important;
  }
  #menu_buttons2 .menu_button_wrapper {
    margin: 0 auto !important;
    padding: 5px !important;
    box-sizing: border-box !important;
    display: flex !important;
    justify-content: center !important;
    align-items: stretch !important;
  }
  #menu_buttons2 .menu_button_wrapper:nth-child(1),
  #menu_buttons2 .menu_button_wrapper:nth-child(2) {
    flex: 0 0 calc(50% - 2.5px) !important;
    max-width: calc(50% - 2.5px) !important;
  }
  #menu_buttons2 .menu_button_wrapper:nth-child(3) {
    flex: 0 0 100% !important;
    max-width: 100% !important;
    width: 100% !important;
  }
  #menu_buttons2 .menu_button_wrapper a,
  #menu_buttons2 .menu_button_wrapper picture {
    display: block !important;
    width: 100% !important;
    height: 100% !important;
  }
  #menu_buttons2 .menu_button_wrapper img {
    display: block !important;
    width: 100% !important;
    height: 100% !important;
    object-fit: cover !important;
  }
}

/* --- Duże ekrany (>=1400px): stała proporcja kafelka, bez bocznych paddingów --- */
@media (min-width: 1400px) {
  #menu_buttons2 {
    align-items: stretch !important;
    padding-left: 0 !important;
    padding-right: 0 !important;
  }
  #menu_buttons2 .menu_button_wrapper {
    aspect-ratio: 1.95 / 1 !important;   /* zastępuje stałą wysokość --edx-tile-h */
    height: auto !important;
    padding-left: 0 !important;
    padding-right: 0 !important;
    display: flex !important;
    align-items: stretch !important;
    justify-content: center !important;
    box-sizing: border-box !important;
  }
  #menu_buttons2 .menu_button_wrapper a,
  #menu_buttons2 .menu_button_wrapper picture {
    display: block !important;
    width: 100% !important;
    height: 100% !important;
  }
  #menu_buttons2 .menu_button_wrapper img {
    display: block !important;
    width: 100% !important;
    height: 100% !important;
    object-fit: cover !important;
  }
}

/* =========================================================================
   6. SEKCJA ARTYKUŁÓW / BLOG (.article__block)
   Mobile: 1 kolumna · >=768px: auto-fit 3 kolumny
   ========================================================================= */
.article__block {
  display: grid;
  grid-template-columns: 1fr;
  gap: 16px;
  padding: 0 1rem;
  box-sizing: border-box;
}
@media (min-width: 768px) {
  .article__block {
    grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
    gap: 24px;
    max-width: 100vw;
    overflow-x: hidden;
    align-items: stretch;
  }
  .article__item { min-width: 0; }
}

.article__image_wrapper {
  position: relative;
  width: 100%;
  aspect-ratio: 16 / 9;
  overflow: hidden;
}
.article__image_wrapper .article__image {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center;
  display: block;
}
.article__item img {
  width: 100%;
  height: auto;
  display: block;
}

/* Ukrycie obrazka w podglądzie wpisu bloga */
#blog-item .blog-item_sub.cm img.blog_image { display: none !important; }

/* =========================================================================
   7. "CZYTAJ WIĘCEJ" — rozwijany opis (czysty CSS, checkbox toggle)
   ========================================================================= */
.css-toggle-input { display: none; }

.hidden-content-for-css {
  max-height: 0;
  overflow: hidden;
  transition: max-height 0.7s ease-in-out;
}
#read-more-toggle-css:checked ~ .read-more-content-container .hidden-content-for-css {
  max-height: 5000px;
}

.read-more-button-css .label-text-hide { display: none; }
#read-more-toggle-css:checked ~ .read-more-trigger-wrapper .label-text-hide { display: inline; }
#read-more-toggle-css:checked ~ .read-more-trigger-wrapper .label-text-show { display: none; }

.read-more-trigger-wrapper { text-align: center; margin: 20px 0; }
.read-more-button-css {
  display: inline-block;
  background-color: var(--edx-accent);
  color: #fff;
  border: 1px solid var(--edx-accent);
  padding: 10px 20px;
  font-size: 14px;
  font-weight: 600;
  cursor: pointer;
  border-radius: 4px;
  transition: all 0.2s;
}
.read-more-button-css:hover {
  background-color: var(--edx-accent-hover);
  border-color: var(--edx-accent-hover);
}

/* =========================================================================
   8. KARTA PRODUKTU (projector) — marginesy i ukrycia
   ========================================================================= */
#projector_productname,
#projector_form,
#details_wrapper,
#product_questions_list {
  margin-right: 15px !important;
}
#projector_photos,
#dynamic_tabs_handler,
#details_wrapper,
#product_questions_list {
  margin-left: 15px !important;
}

@media (max-width: 767.98px) {
  #projector_photos,
  #GalleryModalTemplate,
  #projector_productname,
  #projector_form,
  #dynamic_tabs_handler,
  #details_wrapper,
  #product_questions_list {
    margin-left: 10px !important;
    margin-right: 10px !important;
  }
}

@media (max-width: 768px) {
  .product_name__block.--label { display: none !important; }

  #dynamic_tabs_handler {
    max-width: 100vw !important;
    overflow-x: hidden !important;
    margin: 0 auto !important;
    padding: 0 10px !important;
    box-sizing: border-box !important;
  }
  #dynamic_tabs_handler .tabs__item {
    width: 100% !important;
    max-width: 100% !important;
    margin: 0 auto !important;
  }
  #details_wrapper_mobile,
  #product_questions_list_mobile,
  #opinions_section_mobile {
    max-width: 100% !important;
    overflow-x: hidden !important;
  }
}

/* Ukrycia elementów karty produktu */
#projector_status,
#design_preview_window { display: none !important; }
#projector_dictionary > div > div:nth-child(3) { display: none !important; }

section#Progress.progress[style] { margin: 30px !important; }

@media (min-width: 1024px) {
  .responsive-img-wrapper {
    height: 700px !important;
    overflow: hidden;
  }
}

/* [EDAXO-ONLY] Ukrycie wiersza "video" (link .mp4) — karta i listing */
#projector_producttraits .traits__item:has(a[href*="mp4"]),
#search .product__traits li.trait:has(a.trait__value[href*="mp4"]) {
  display: none !important;
}

/* =========================================================================
   10. CHECKOUT (form#COP) — floating label na ramce pól adresowych
   ========================================================================= */
form#COP .cop_client_data__item.--firstname,
form#COP .cop_client_data__item.--lastname,
form#COP .cop_client_data__item.--street,
form#COP .cop_client_data__item.--street-number,
form#COP .cop_client_data__item.--zipcode,
form#COP .cop_client_data__item.--city,
form#COP .cop_client_data__item.--firm,
form#COP .cop_client_data__item.--nip {
  position: relative;
  margin-top: 18px;
}
form#COP .cop_client_data__item.--firstname > .f-label,
form#COP .cop_client_data__item.--lastname > .f-label,
form#COP .cop_client_data__item.--street > .f-label,
form#COP .cop_client_data__item.--street-number > .f-label,
form#COP .cop_client_data__item.--zipcode > .f-label,
form#COP .cop_client_data__item.--city > .f-label,
form#COP .cop_client_data__item.--firm > .f-label,
form#COP .cop_client_data__item.--nip > .f-label {
  position: absolute !important;
  top: -8px !important;
  left: 14px !important;
  z-index: 3 !important;
  display: inline-block !important;
  width: auto !important;
  max-width: calc(100% - 28px) !important;
  margin: 0 !important;
  padding: 0 6px !important;
  background: #fff !important;
  border: 0 !important;
  box-shadow: none !important;
  transform: none !important;
  white-space: nowrap !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
  font-size: 12px !important;
  line-height: 1 !important;
  font-weight: 400 !important;
  color: #000 !important;
  pointer-events: none !important;
}
form#COP .cop_client_data__item.--firstname > .f-control,
form#COP .cop_client_data__item.--lastname > .f-control,
form#COP .cop_client_data__item.--street > .f-control,
form#COP .cop_client_data__item.--street-number > .f-control,
form#COP .cop_client_data__item.--zipcode > .f-control,
form#COP .cop_client_data__item.--city > .f-control,
form#COP .cop_client_data__item.--firm > .f-control,
form#COP .cop_client_data__item.--nip > .f-control {
  padding-top: 18px !important;
}
form#COP .cop_client_data__item.--firstname > .f-message,
form#COP .cop_client_data__item.--lastname > .f-message,
form#COP .cop_client_data__item.--street > .f-message,
form#COP .cop_client_data__item.--street-number > .f-message,
form#COP .cop_client_data__item.--zipcode > .f-message,
form#COP .cop_client_data__item.--city > .f-message,
form#COP .cop_client_data__item.--firm > .f-message,
form#COP .cop_client_data__item.--nip > .f-message {
  margin-top: 6px;
}

/* =========================================================================
   11. BANERY I SEKCJE GLOBALNE
   ========================================================================= */
#main_banner1.section,
#main_banner1 .main_slider { margin-bottom: 0 !important; }

.main_slider__item.swiper-slide {
  margin-left: 0 !important;
  margin-right: 0 !important;
}

/* Ukrycie tekstu (zachowane dla SEO/czytników) */
.article__text {
  position: absolute !important;
  width: 1px !important;
  height: 1px !important;
  padding: 0 !important;
  overflow: hidden !important;
  clip: rect(0, 0, 0, 0) !important;
  white-space: nowrap !important;
  border: 0 !important;
}

/* #main_cms na pełną szerokość */
#main_cms {
  width: 100% !important;
  position: relative !important;
  padding-left: 0 !important;
  padding-right: 0 !important;
}

@media (max-width: 480px) {
  #ecdp_banner_2 { display: none !important; }   /* [EDAXO-ONLY?] sprawdź ID */
}

/* [EDAXO-ONLY] Baner promocji zależny od nazwy pliku grafiki */
img[src*="RUMUNIA_WSZYSTKIE_WIELKOSCI_54.jpg"] { display: none !important; }
img[src*="RUMUNIA_WSZYSTKIE_WIELKOSCI_53.jpg"] {
  display: block !important;
  width: 100vw !important;
  max-width: 100vw !important;
  height: auto !important;
  border: 0 !important;
  margin-left: calc(50% - 50vw) !important;
  margin-right: calc(50% - 50vw) !important;
}
@media (max-width: 767px) {
  img[src*="RUMUNIA_WSZYSTKIE_WIELKOSCI_54.jpg"] {
    display: block !important;
    width: 100% !important;
    max-width: 100% !important;
    height: auto !important;
    border: 0 !important;
    margin: 0 auto !important;
  }
  img[src*="RUMUNIA_WSZYSTKIE_WIELKOSCI_53.jpg"] { display: none !important; }
}

/* [EDAXO-ONLY] Opis kategorii z dwoma grafikami (desktop / mobile switch) */
.search_description .search_description__wrapper {
  width: 100% !important;
  max-width: 100% !important;
  margin: 0 auto !important;
  padding: 0 !important;
  text-align: center !important;
}
.search_description .search_description__wrapper p { margin: 0 !important; padding: 0 !important; }
.search_description .search_description__wrapper img {
  width: 100% !important;
  max-width: 100% !important;
  height: auto !important;
  margin: 0 auto !important;
}
@media (max-width: 767px) {
  .search_description .search_description__wrapper p img:first-of-type { display: block !important; }
  .search_description .search_description__wrapper p img:last-of-type  { display: none  !important; }
}
@media (min-width: 768px) {
  .search_description .search_description__wrapper p img:first-of-type { display: none  !important; }
  .search_description .search_description__wrapper p img:last-of-type  { display: block !important; }
}
/* =========================================================================
   12. NAWIGACJA — aktywny link L1 na czerwono
   ========================================================================= */
.nav-link.--l1.active,
.nav-link.--l1.active:hover {
  color: red !important;
}

/* =========================================================================
   13. BOOTSTRAP — korekta kolumny lg
   UWAGA: max-width:100% nadpisuje typowe col-lg-3 (25%). Zweryfikuj efekt.
   ========================================================================= */
@media (min-width: 1200px) {
  .col-lg-3 {
    flex: 0 0 25%;
    max-width: 100%;
  }
}
.article__block {
  display: flex;
  flex-direction: row;
  gap: 1rem;
}

.article__item {
  flex: 1;
}

.article__image {
  width: 100%;
  height: auto;
}

/* Tablet */
@media (max-width: 768px) {
  .article__block {
    flex-direction: column;
  }
}
.products.hotspot__products.swiper-wrapper .product.hotspot__product .product__icon img {
  width: 100% !important;
  height: auto !important;
  object-fit: contain !important;
}
.products__wrapper.swiper,
.products__wrapper {
  overflow: visible !important;
}
.products.hotspot__products.swiper-wrapper .product.hotspot__product.swiper-slide {
  visibility: visible !important;
  opacity: 1 !important;
}
/* Test — celuje w swiper-wrapper bezpośrednio */
.products.hotspot__products.swiper-wrapper {
  display: flex !important;
  flex-wrap: nowrap !important;
  gap: 10px !important;
  height: auto !important;
  transform: none !important;
  justify-content: space-between !important;
  overflow: visible !important;
}

@media (min-width: 980px) {
  .products.hotspot__products.swiper-wrapper > .product.hotspot__product {
    flex: 0 0 calc(20% - 8px) !important;
    width: calc(20% - 8px) !important;
    max-width: calc(20% - 8px) !important;
    min-width: 0 !important;
    margin: 0 !important;
  }
}

@media (max-width: 979px) {
  .products.hotspot__products.swiper-wrapper {
    overflow-x: auto !important;
    scroll-snap-type: x mandatory !important;
    justify-content: flex-start !important;
  }
  .products.hotspot__products.swiper-wrapper > .product.hotspot__product {
    flex: 0 0 calc(50% - 5px) !important;
    width: calc(50% - 5px) !important;
    max-width: calc(50% - 5px) !important;
    min-width: 0 !important;
    margin: 0 !important;
    scroll-snap-align: start !important;
  }
}
/* Ukrycie tylko procentu z Omnibus, zostaw procent od ceny standardowej */
#projector_omnibus_percent {
  display: none !important;
}
/* =========================================================
   Karta produktu — układ cen jak we wzorze
   Górny wiersz: Preț standard przekreślony + -20%
   Pod spodem: duża cena aktualna (czarna)
   Na dole: szara linijka Omnibus
   ========================================================= */
#projector_prices_section {
  display: flex !important;
  flex-direction: column !important;
  gap: 2px !important;
  margin-top: 24px !important;
  margin-bottom: 24px !important;
}

/* Kolejność: (1) Preț standard + %, (2) cena aktualna, (3) Omnibus, (4) reszta */
#projector_prices_section #projector_price_maxprice_wrapper { order: 1 !important; }
#projector_prices_section .projector_prices__price_wrapper  { order: 2 !important; }
#projector_prices_section .projector_prices__lowest_price   { order: 3 !important; }
#projector_prices_section #projector_price_srp_wrapper      { order: 4 !important; }
#projector_prices_section #projector_points_wrapper         { order: 5 !important; }

/* --- Górny wiersz: Preț standard + procent w jednej linii --- */
#projector_prices_section #projector_price_maxprice_wrapper {
  display: flex !important;
  align-items: center !important;
  gap: 8px !important;
  margin: 0 0 2px 0 !important;
}

/* Ukryj etykietę "Preț standard:" i jednostki, żeby wiersz był czysty jak we wzorze */
#projector_prices_section #projector_price_maxprice_wrapper .projector_prices__maxprice_label,
#projector_prices_section #projector_price_maxprice_wrapper .projector_prices__unit_sep,
#projector_prices_section #projector_price_maxprice_wrapper .projector_prices__unit_sellby,
#projector_prices_section #projector_price_maxprice_wrapper .projector_prices__unit {
  display: none !important;
}

/* Stara cena — przekreślona, szara */
#projector_prices_section #projector_price_maxprice {
  color: #888 !important;
  font-size: 1.5rem !important;
  font-weight: 400 !important;
  text-decoration: line-through !important;
}

/* Procent -20% — zielony, jak we wzorze */
#projector_prices_section #projector_maxprice_percent {
  display: inline-block !important;
  color: #2e8b3d !important;
  background: transparent !important;
  font-size: 1.5rem !important;
  font-weight: 600 !important;
  padding: 0 !important;
}

/* --- Cena aktualna: duża, wyrazista, czarna --- */
#projector_prices_section .projector_prices__price {
  font-size: 3.3rem !important;
  font-weight: 700 !important;
  line-height: 1.1 !important;
  margin: 0 !important;
  color: #000 !important;
}

/* Dopisek "brut / buc." przy cenie aktualnej */
#projector_prices_section .projector_prices__info,
#projector_prices_section .projector_prices__vat,
#projector_prices_section .projector_prices__unit,
#projector_prices_section .projector_prices__unit_sep {
  font-size: 1.35rem !important;
}

/* --- Linijka Omnibus: mała, szara, na dole --- */
#projector_prices_section .projector_prices__lowest_price {
  color: #999 !important;
  font-size: 1.2rem !important;
  margin-top: 2px !important;
}

/* Przekreślona cena wewnątrz linijki Omnibus */
#projector_prices_section .projector_prices__lowest_price .omnibus_price__value {
  font-size: 1.2rem !important;
}

/* Ukryj procent omnibusa (-16%) — zostaje tylko -20% w górnym wierszu */
#projector_prices_section #projector_omnibus_percent {
  display: none !important;
}

/* --- Brak wyprzedaży: ukryj zielony procent i pusty wiersz maxprice --- */
#projector_prices_section .projector_prices__maxprice_wrapper:not(.--active) {
  display: none !important;
}
#projector_prices_section .projector_prices__maxprice_wrapper:not(.--active) #projector_maxprice_percent {
  display: none !important;
}
.product__icon {
  display: flex;
  flex-wrap: wrap;
  align-content: flex-start;
}
.product__compare_item.--add {
    display: none !important;
}

/* =========================================================================
   14. DOOFINDER — wyniki wyszukiwania osadzone na stronie kategorii
   [DO WERYFIKACJI NA EDAXO.RO]
   Mechanizm jak na wenko-sklep.pl: Doofinder montuje wyniki jako
   <main data-dfd-display="wrapper"> obok oryginalnego
   <main data-dfd-display="wrapper-source" hidden>. Atrybut
   data-dfd-display="wrapper" istnieje w DOM WYŁĄCZNIE wtedy, gdy aktywne
   jest wyszukiwanie (hash #.../embedded/products/...&q=...).
   Na zwykłej stronie kategorii atrybut ten nie występuje.

   UWAGA: mechanizm potwierdzony w DevTools na wenko-sklep.pl. Na edaxo.ro
   strukturę DOM warto zweryfikować analogicznie (przejść na kategorię
   z aktywnym wyszukiwaniem Doofindera i sprawdzić w Elements, czy <main>
   faktycznie dostaje atrybut data-dfd-display="wrapper") — różne
   wdrożenia/integracje Doofindera mogą generować inny markup.
   ========================================================================= */

@media (min-width: 979px) {
  /* Chowamy cały panel boczny (podkategorie + natywne filtry cech),
     tylko gdy obok w DOM jest aktywny wrapper wyników Doofindera */
  aside:has(+ main[data-dfd-display="wrapper"]) {
    display: none !important;
  }

  /* Rozciągamy kontener z wynikami Doofindera na całą szerokość,
     skoro panel boczny został ukryty */
  main[data-dfd-display="wrapper"] {
    flex: 0 0 100% !important;
    max-width: 100% !important;
  }
}

/* =========================================================================
   15. DOOFINDER — liczba kolumn w siatce wyników wyszukiwania
   Potwierdzone w DevTools na edaxo.ro: siatka kart produktów renderuje się
   jako <div class="dfd-results-grid" id="dfd-results-products-...">
   (id zawiera dynamiczny hash, ale klasa "dfd-results-grid" jest stała -
   to jej używamy jako selektora). Po rozciągnięciu kontenera na 100%
   (sekcja 14 powyżej) Doofinder sam dokładał kolejne kolumny, więc liczbę
   kolumn wymuszamy jawnie na 4, niezależnie od dostępnej szerokości.
   ========================================================================= */

@media (min-width: 979px) {
  .dfd-results-grid {
    grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
  }
}

/* =========================================================================
   16. LABELE PRODUKTÓW — GLOBALNY SYSTEM / JEDNO ŹRÓDŁO PRAWDY
   Dotyczy natywnych labeli IdoSell na:
   - listingach kategorii i wynikach wyszukiwania
   - stronie głównej
   - hotspotach / ramkach rekomendacji / karuzelach
   - kartach produktów
   - sekcjach rekomendacji na stronie produktu

   Założenia:
   - wszystkie labele na kafelkach: 18 px wysokości, font 10 px
   - każdy tekst jest centrowany pionowo i poziomo tym samym mechanizmem FLEX
   - dotyczy zarówno zwykłego tekstu HTML (np. RECOMANDAT), jak i ::after
   - CHILIPIR: #7a6a5f / biały
   - CEL MAI VÂNDUT: #efebe5 / czarny
   - ALEGERE TOP: #e5e1dc / #111
   - pozostałe labele zachowują własne kolory
   - priorytet: CHILIPIR > CEL MAI VÂNDUT
   ========================================================================= */

:root {
  --edx-list-label-height: 18px;
  --edx-list-label-font-size: 10px;
  --edx-list-label-padding-x: 6px;

  --edx-projector-label-height: 22px;
  --edx-projector-label-font-size: 12px;
  --edx-projector-label-padding-x: 8px;
}

/* -------------------------------------------------------------------------
   16.1. POZYCJA I UKŁAD KONTENERÓW LABELI
   ------------------------------------------------------------------------- */
body .product,
body .hotspot .product,
body .hotspot__product,
body #search .product,
body .search .product,
body .products__wrapper .product,
body .products.hotspot__products .product {
  --label-container-top: auto !important;
  --label-container-bottom: 6px !important;
  --label-container-left: 6px !important;
  --label-container-right: auto !important;
}

body .product .label_icons,
body .hotspot .product .label_icons,
body .hotspot__product .label_icons,
body #search .product .label_icons,
body .search .product .label_icons,
body .products__wrapper .product .label_icons,
body .products.hotspot__products .product .label_icons,
body .product .labels-container,
body .hotspot__product .labels-container {
  top: auto !important;
  bottom: 6px !important;
  left: 6px !important;
  right: auto !important;

  display: flex !important;
  flex-direction: row !important;
  flex-wrap: wrap !important;
  align-items: center !important;
  justify-content: flex-start !important;
  gap: 4px !important;

  padding: 0 !important;
  margin: 0 !important;
  line-height: normal !important;
}

/* -------------------------------------------------------------------------
   16.2. KAŻDY LABEL NA KAFELKU — JEDNA GEOMETRIA I TYPOGRAFIA
   Obejmuje też RECOMANDAT i inne labele z tekstem zapisanym w HTML.
   1 px paddingu u góry koryguje optycznie metrykę fontu, ale jest stosowany
   IDENTYCZNIE do każdego labela, więc nie powstają różnice między typami.
   ------------------------------------------------------------------------- */
body .product .label,
body .hotspot .product .label,
body .hotspot__product .label,
body .products__wrapper .product .label,
body .products.hotspot__products .product .label,
body #search .product .label,
body .search .product .label,
body .product__icon .label {
  position: relative !important;

  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;

  flex: 0 0 auto !important;
  width: auto !important;
  min-width: 0 !important;

  height: var(--edx-list-label-height) !important;
  min-height: var(--edx-list-label-height) !important;
  max-height: var(--edx-list-label-height) !important;

  padding: 1px var(--edx-list-label-padding-x) 0 !important;
  margin: 0 !important;
  box-sizing: border-box !important;

  border: 0 !important;
  border-radius: 0 !important;
  box-shadow: none !important;

  font-family: inherit !important;
  font-size: var(--edx-list-label-font-size) !important;
  font-weight: 700 !important;
  line-height: 1 !important;
  letter-spacing: 0 !important;

  text-align: center !important;
  text-transform: uppercase !important;
  white-space: nowrap !important;
  vertical-align: middle !important;

  overflow: hidden !important;
  transform: none !important;
}

/* Wszystkie elementy wewnątrz zwykłych labeli korzystają z tej samej geometrii.
   To zabezpiecza np. RECOMANDAT, jeśli szablon opakuje tekst w span/a/strong. */
body .product .label > *,
body .hotspot .product .label > *,
body .hotspot__product .label > *,
body .products__wrapper .product .label > *,
body .products.hotspot__products .product .label > *,
body #search .product .label > *,
body .search .product .label > *,
body .product__icon .label > * {
  align-self: stretch !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;

  height: 100% !important;
  min-height: 100% !important;
  max-height: 100% !important;

  padding: 0 !important;
  margin: 0 !important;

  font-family: inherit !important;
  font-size: inherit !important;
  font-weight: inherit !important;
  line-height: 1 !important;
  letter-spacing: inherit !important;

  text-align: center !important;
  vertical-align: middle !important;
  transform: none !important;
}

/* -------------------------------------------------------------------------
   16.3. LABELE, KTÓRYCH TEKST ODTWARZAMY PRZEZ ::after
   ------------------------------------------------------------------------- */
body .product .label.--bargain,
body .product .label.--promo,
body .product .label.--bestseller,
body .product .label.--discount,
body .hotspot__product .label.--bargain,
body .hotspot__product .label.--promo,
body .hotspot__product .label.--bestseller,
body .hotspot__product .label.--discount,
body .products__wrapper .product .label.--bargain,
body .products__wrapper .product .label.--promo,
body .products__wrapper .product .label.--bestseller,
body .products__wrapper .product .label.--discount,
body .products.hotspot__products .product .label.--bargain,
body .products.hotspot__products .product .label.--promo,
body .products.hotspot__products .product .label.--bestseller,
body .products.hotspot__products .product .label.--discount,
body #search .product .label.--bargain,
body #search .product .label.--promo,
body #search .product .label.--bestseller,
body #search .product .label.--discount,
body .search .product .label.--bargain,
body .search .product .label.--promo,
body .search .product .label.--bestseller,
body .search .product .label.--discount {
  font-size: 0 !important;
  line-height: 0 !important;
}

/* Oryginalna treść tych czterech labeli jest ukryta, tekst pokazuje ::after. */
body .product .label.--bargain > *,
body .product .label.--promo > *,
body .product .label.--bestseller > *,
body .product .label.--discount > *,
body .hotspot__product .label.--bargain > *,
body .hotspot__product .label.--promo > *,
body .hotspot__product .label.--bestseller > *,
body .hotspot__product .label.--discount > * {
  display: none !important;
}

/* Jedna, globalna geometria ::after — bez zależności od #content.
   Dzięki temu działa również w ramkach rekomendacji na stronie głównej. */
body .product .label.--bargain::after,
body .product .label.--promo::after,
body .product .label.--bestseller::after,
body .product .label.--discount::after,
body .hotspot__product .label.--bargain::after,
body .hotspot__product .label.--promo::after,
body .hotspot__product .label.--bestseller::after,
body .hotspot__product .label.--discount::after,
body .products__wrapper .product .label.--bargain::after,
body .products__wrapper .product .label.--promo::after,
body .products__wrapper .product .label.--bestseller::after,
body .products__wrapper .product .label.--discount::after,
body .products.hotspot__products .product .label.--bargain::after,
body .products.hotspot__products .product .label.--promo::after,
body .products.hotspot__products .product .label.--bestseller::after,
body .products.hotspot__products .product .label.--discount::after,
body #search .product .label.--bargain::after,
body #search .product .label.--promo::after,
body #search .product .label.--bestseller::after,
body #search .product .label.--discount::after,
body .search .product .label.--bargain::after,
body .search .product .label.--promo::after,
body .search .product .label.--bestseller::after,
body .search .product .label.--discount::after {
  position: static !important;

  align-self: stretch !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;

  width: auto !important;
  height: 100% !important;
  min-height: 100% !important;
  max-height: 100% !important;

  padding: 0 !important;
  margin: 0 !important;
  box-sizing: border-box !important;

  font-family: inherit !important;
  font-size: var(--edx-list-label-font-size) !important;
  font-weight: 700 !important;
  line-height: 1 !important;
  letter-spacing: 0 !important;

  text-align: center !important;
  text-transform: uppercase !important;
  white-space: nowrap !important;
  vertical-align: middle !important;

  top: auto !important;
  right: auto !important;
  bottom: auto !important;
  left: auto !important;
  transform: none !important;
}

/* Usuwamy dekoracyjne ::before wyłącznie z labeli produktowych. */
body .product .label::before,
body .hotspot__product .label::before,
body .products__wrapper .product .label::before,
body .products.hotspot__products .product .label::before,
body #search .product .label::before,
body .search .product .label::before {
  content: none !important;
  display: none !important;
}

/* -------------------------------------------------------------------------
   16.4. TREŚCI I KOLORY
   ------------------------------------------------------------------------- */
/* CHILIPIR */
body .product .label.--bargain,
body .product .label.--promo,
body .hotspot__product .label.--bargain,
body .hotspot__product .label.--promo,
body .products__wrapper .product .label.--bargain,
body .products__wrapper .product .label.--promo,
body .products.hotspot__products .product .label.--bargain,
body .products.hotspot__products .product .label.--promo,
body #search .product .label.--bargain,
body #search .product .label.--promo,
body .search .product .label.--bargain,
body .search .product .label.--promo {
  background: #7a6a5f !important;
  background-color: #7a6a5f !important;
  color: #ffffff !important;
}

body .product .label.--bargain::after,
body .product .label.--promo::after,
body .hotspot__product .label.--bargain::after,
body .hotspot__product .label.--promo::after,
body .products__wrapper .product .label.--bargain::after,
body .products__wrapper .product .label.--promo::after,
body .products.hotspot__products .product .label.--bargain::after,
body .products.hotspot__products .product .label.--promo::after,
body #search .product .label.--bargain::after,
body #search .product .label.--promo::after,
body .search .product .label.--bargain::after,
body .search .product .label.--promo::after {
  content: "CHILIPIR" !important;
  color: #ffffff !important;
}

/* CEL MAI VÂNDUT */
body .product .label.--bestseller,
body .hotspot__product .label.--bestseller,
body .products__wrapper .product .label.--bestseller,
body .products.hotspot__products .product .label.--bestseller,
body #search .product .label.--bestseller,
body .search .product .label.--bestseller {
  background: #efebe5 !important;
  background-color: #efebe5 !important;
  color: #000000 !important;
}

body .product .label.--bestseller::after,
body .hotspot__product .label.--bestseller::after,
body .products__wrapper .product .label.--bestseller::after,
body .products.hotspot__products .product .label.--bestseller::after,
body #search .product .label.--bestseller::after,
body .search .product .label.--bestseller::after {
  content: "CEL MAI VÂNDUT" !important;
  color: #000000 !important;
}

/* ALEGERE TOP */
body .product .label.--discount,
body .hotspot__product .label.--discount,
body .products__wrapper .product .label.--discount,
body .products.hotspot__products .product .label.--discount,
body #search .product .label.--discount,
body .search .product .label.--discount {
  background: #e5e1dc !important;
  background-color: #e5e1dc !important;
  color: #111111 !important;
}

body .product .label.--discount::after,
body .hotspot__product .label.--discount::after,
body .products__wrapper .product .label.--discount::after,
body .products.hotspot__products .product .label.--discount::after,
body #search .product .label.--discount::after,
body .search .product .label.--discount::after {
  content: "ALEGERE TOP" !important;
  color: #111111 !important;
}

/* -------------------------------------------------------------------------
   16.5. PRIORYTETY
   ------------------------------------------------------------------------- */
body .product:has(.label.--bargain) .label.--bestseller,
body .product:has(.label.--promo) .label.--bestseller,
body .hotspot__product:has(.label.--bargain) .label.--bestseller,
body .hotspot__product:has(.label.--promo) .label.--bestseller,
body .products__wrapper .product:has(.label.--bargain) .label.--bestseller,
body .products__wrapper .product:has(.label.--promo) .label.--bestseller,
body #search .product:has(.label.--bargain) .label.--bestseller,
body #search .product:has(.label.--promo) .label.--bestseller,
body .search .product:has(.label.--bargain) .label.--bestseller,
body .search .product:has(.label.--promo) .label.--bestseller {
  display: none !important;
}

body .product:has(.label.--bargain) .label.--promo,
body .hotspot__product:has(.label.--bargain) .label.--promo,
body .products__wrapper .product:has(.label.--bargain) .label.--promo,
body #search .product:has(.label.--bargain) .label.--promo,
body .search .product:has(.label.--bargain) .label.--promo {
  display: none !important;
}

/* =========================================================================
   17. STRONA PRODUKTU — LABEL NA GŁÓWNYM ZDJĘCIU
   Ten label jest osobnym pseudo-elementem galerii, dlatego ma własną geometrię,
   ale używa dokładnie tego samego mechanizmu centrowania FLEX.
   ========================================================================= */

/* Oryginalne labele przy nazwie pozostają w DOM jako źródło dla :has(). */
#projector_productname .product_name_block.--label,
#projector_productname .product_name_block.--label .label_icons,
#projector_productname .label_icons {
  display: none !important;
  visibility: hidden !important;
}

/* Usunięcie innych pseudo-labeli galerii. */
#projector_photos .photos__slider::after,
#projector_photos .photos__sliders::after {
  content: none !important;
  display: none !important;
}

#projector_photos,
#projector_photos .photos__sliders,
#projector_photos .photos__slider,
#projector_photos .photos__slider .swiper-slide,
#projector_photos .photos__slider .swiper-slide-active {
  position: relative !important;
}

/* Wspólna geometria labela na zdjęciu produktu. */
#content:has(#projector_productname .label.--bargain)
#projector_photos .photos__slider .swiper-slide-active::after,
#content:has(#projector_productname .label.--promo)
#projector_photos .photos__slider .swiper-slide-active::after,
#content:not(:has(#projector_productname .label.--bargain))
:not(:has(#projector_productname .label.--promo))
:has(#projector_productname .label.--bestseller)
#projector_photos .photos__slider .swiper-slide-active::after {
  position: absolute !important;
  left: 0 !important;
  bottom: 0 !important;
  top: auto !important;
  right: auto !important;
  z-index: 50 !important;

  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;

  width: auto !important;
  min-width: 0 !important;

  height: var(--edx-projector-label-height) !important;
  min-height: var(--edx-projector-label-height) !important;
  max-height: var(--edx-projector-label-height) !important;

  padding: 1px var(--edx-projector-label-padding-x) 0 !important;
  margin: 0 !important;
  box-sizing: border-box !important;

  border: 0 !important;
  border-radius: 0 !important;
  box-shadow: none !important;

  font-family: inherit !important;
  font-size: var(--edx-projector-label-font-size) !important;
  font-weight: 700 !important;
  line-height: 1 !important;
  letter-spacing: 0 !important;

  text-align: center !important;
  text-transform: uppercase !important;
  white-space: nowrap !important;
  vertical-align: middle !important;

  pointer-events: none !important;
  transform: none !important;
}

/* CHILIPIR — zdjęcie produktu */
#content:has(#projector_productname .label.--bargain)
#projector_photos .photos__slider .swiper-slide-active::after,
#content:has(#projector_productname .label.--promo)
#projector_photos .photos__slider .swiper-slide-active::after {
  content: "CHILIPIR" !important;
  background: #7a6a5f !important;
  background-color: #7a6a5f !important;
  color: #ffffff !important;
}

/* CEL MAI VÂNDUT — zdjęcie produktu, tylko gdy brak CHILIPIR */
#content:not(:has(#projector_productname .label.--bargain))
:not(:has(#projector_productname .label.--promo))
:has(#projector_productname .label.--bestseller)
#projector_photos .photos__slider .swiper-slide-active::after {
  content: "CEL MAI VÂNDUT" !important;
  background: #efebe5 !important;
  background-color: #efebe5 !important;
  color: #000000 !important;
}

/* =========================================================================
   18. KARTA PRODUKTU — TŁO GALERII
   ========================================================================= */

#projector_photos.photos:not(.--gallery-modal)::before {
  content: none !important;
  display: none !important;
  background: transparent !important;
}

#projector_photos.photos:not(.--gallery-modal),
#projector_photos.photos:not(.--gallery-modal) .photos__sliders,
#projector_photos.photos:not(.--gallery-modal) .photos__slider,
#projector_photos.photos:not(.--gallery-modal) .swiper,
#projector_photos.photos:not(.--gallery-modal) .swiper-wrapper {
  background: #ffffff !important;
}

#projector_photos.photos:not(.--gallery-modal)
.photos__slider .swiper-slide:not(.--more):not(.--video) {
  background: #f1f1f1 !important;
}

#projector_photos.photos:not(.--gallery-modal)
.photos__slider .swiper-slide:not(.--more):not(.--video) img {
  mix-blend-mode: multiply !important;
}
/* === Etykieta CHILIPIR → BLACK FRIDAY (czarna) === */
:root {
  --color-label-bargain-background: #000;
  --color-label-bargain: #fff;
}

/* Listy produktów, wyszukiwarka, hotspoty */
html body :is(#search, .product, .product__icon, .hotspot__product, .products__wrapper) .label.label.--bargain,
html body .label.label.--bargain {
  background: #000 !important;
  background-color: #000 !important;
  color: #fff !important;
}

html body :is(#search, .product, .product__icon, .hotspot__product, .products__wrapper) .label.label.--bargain::after,
html body .label.label.--bargain::after {
  content: "BLACK FRIDAY" !important;
  color: #fff !important;
}

/* Karta produktu – etykieta na zdjęciu */
html body #content:has(#projector_productname .label.label.--bargain) #projector_photos .photos__slider .swiper-slide-active::after {
  content: "BLACK FRIDAY" !important;
  background: #000 !important;
  color: #fff !important;
}
/* BLACK FRIDAY – flaga Promocja (--promo) jak Okazja (--bargain) */
:root {
  --color-label-promo-background: #000;
  --color-label-promo: #fff;
}

/* tło labela – listingi, wyszukiwarka, hotspoty */
html body :is(#search, .product, .product__icon, .hotspot__product, .products__wrapper) .label.label.--promo,
html body .label.label.--promo {
  background: rgb(0, 0, 0) !important;
  color: rgb(255, 255, 255) !important;
}

/* tekst labela */
html body :is(#search, .product, .product__icon, .hotspot__product, .products__wrapper) .label.label.--promo::after,
html body .label.label.--promo::after {
  content: "BLACK FRIDAY" !important;
  color: rgb(255, 255, 255) !important;
}

/* karta produktu – label na zdjęciu */
html body #content:has(#projector_productname .label.label.--promo) #projector_photos .photos__slider .swiper-slide-active::after {
  content: "BLACK FRIDAY" !important;
  background: rgb(0, 0, 0) !important;
  color: rgb(255, 255, 255) !important;
}