body.is-loaded .flag.flag-discount {
  display: none;
}

@media (min-width: 1500px) {
  body.columns-4 .products-block > div {
    width: calc(16.667%);
  }
}

@media (min-width: 1200px) {
  .next-to-carousel-banners.desktop-1 .banner-wrapper {
    width: 100%;
    max-width: 100%;
    flex: 0 0 100%;
  }
  .next-to-carousel-banners.desktop-2 .banner-wrapper {
    width: calc(100% / 2);
    max-width: calc(100% / 2);
    flex: 0 0 calc(100% / 2);
  }
  .next-to-carousel-banners.desktop-3 .banner-wrapper {
    width: calc(100% / 3);
    max-width: calc(100% / 3);
    flex: 0 0 calc(100% / 3);
  }
  .next-to-carousel-banners.desktop-4 .banner-wrapper {
    width: calc(100% / 4);
    max-width: calc(100% / 4);
    flex: 0 0 calc(100% / 4);
  }
  .next-to-carousel-banners.desktop-5 .banner-wrapper {
    width: calc(100% / 5);
    max-width: calc(100% / 5);
    flex: 0 0 calc(100% / 5);
  }
  .next-to-carousel-banners.desktop-6 .banner-wrapper {
    width: calc(100% / 6);
    max-width: calc(100% / 6);
    flex: 0 0 calc(100% / 6);
  }
  .next-to-carousel-banners.desktop-7 .banner-wrapper {
    width: calc(100% / 7);
    max-width: calc(100% / 7);
    flex: 0 0 calc(100% / 7);
  }
  .next-to-carousel-banners.desktop-8 .banner-wrapper {
    width: calc(100% / 8);
    max-width: calc(100% / 8);
    flex: 0 0 calc(100% / 8);
  }
}

@media (min-width: 768px) and (max-width: 1199px) {
  .next-to-carousel-banners.tablet-1 .banner-wrapper {
    width: 100%;
    max-width: 100%;
    flex: 0 0 100%;
  }
  .next-to-carousel-banners.tablet-2 .banner-wrapper {
    width: calc(100% / 2);
    max-width: calc(100% / 2);
    flex: 0 0 calc(100% / 2);
  }
  .next-to-carousel-banners.tablet-3 .banner-wrapper {
    width: calc(100% / 3);
    max-width: calc(100% / 3);
    flex: 0 0 calc(100% / 3);
  }
  .next-to-carousel-banners.tablet-4 .banner-wrapper {
    width: calc(100% / 4);
    max-width: calc(100% / 4);
    flex: 0 0 calc(100% / 4);
  }
  .next-to-carousel-banners.tablet-5 .banner-wrapper {
    width: calc(100% / 5);
    max-width: calc(100% / 5);
    flex: 0 0 calc(100% / 5);
  }
  .next-to-carousel-banners.tablet-6 .banner-wrapper {
    width: calc(100% / 6);
    max-width: calc(100% / 6);
    flex: 0 0 calc(100% / 6);
  }
  .next-to-carousel-banners.tablet-7 .banner-wrapper {
    width: calc(100% / 7);
    max-width: calc(100% / 7);
    flex: 0 0 calc(100% / 7);
  }
  .next-to-carousel-banners.tablet-8 .banner-wrapper {
    width: calc(100% / 8);
    max-width: calc(100% / 8);
    flex: 0 0 calc(100% / 8);
  }
}

@media (max-width: 767px) {
  .next-to-carousel-banners.mobile-1 .banner-wrapper {
    width: 100%;
    max-width: 100%;
    flex: 0 0 100%;
  }
  .next-to-carousel-banners.mobile-2 .banner-wrapper {
    width: calc(100% / 2);
    max-width: calc(100% / 2);
    flex: 0 0 calc(100% / 2);
  }
  .next-to-carousel-banners.mobile-3 .banner-wrapper {
    width: calc(100% / 3);
    max-width: calc(100% / 3);
    flex: 0 0 calc(100% / 3);
  }
  .next-to-carousel-banners.mobile-4 .banner-wrapper {
    width: calc(100% / 4);
    max-width: calc(100% / 4);
    flex: 0 0 calc(100% / 4);
  }
  .next-to-carousel-banners.mobile-5 .banner-wrapper {
    width: calc(100% / 5);
    max-width: calc(100% / 5);
    flex: 0 0 calc(100% / 5);
  }
  .next-to-carousel-banners.mobile-6 .banner-wrapper {
    width: calc(100% / 6);
    max-width: calc(100% / 6);
    flex: 0 0 calc(100% / 6);
  }
  .next-to-carousel-banners.mobile-7 .banner-wrapper {
    width: calc(100% / 7);
    max-width: calc(100% / 7);
    flex: 0 0 calc(100% / 7);
  }
  .next-to-carousel-banners.mobile-8 .banner-wrapper {
    width: calc(100% / 8);
    max-width: calc(100% / 8);
    flex: 0 0 calc(100% / 8);
  }
}

@media (min-width: 768px) {
  .products-block.products .p .name {
    font-size: 15px;
  }
  .products-block .p-in-in {
    min-height: 70px;
  }
}

@media (min-width: 768px) {
  .banners-top-block {
    margin-top: 0;
  }
}

@media (min-width: 768px) {
  .subcategories li a .text {
    font-size: 13px;
  }
}

.subcategories li a {
  padding: 0 !important;
  overflow: hidden;
}

.top-category-block .h4.homepage-group-title {
  margin-top: 40px;
}

.category-header input[type="radio"] + label {
  color: black;
}

.subcategories li a {
  box-shadow: 7px 9px 12px 0px rgb(0 0 0 / 25%);
}

.subcategories li a:hover {
  background: var(--color-primary-hover);
}

.benefitBanner__item {
  flex-wrap: wrap;
  text-align: center;
  justify-content: center;
}
.benefitBanner__picture {
  padding-left: 0;
  margin-right: auto;
  margin-left: auto;
}
.benefitBanner__link {
  flex-wrap: wrap;
}
.benefitBanner__content {
  margin-top: 15px;
  justify-content: center;
  padding-right: 0;
  width: 100%;
}
.benefitBanner__picture img {
  max-height: 70px;
  max-width: 75px;
}
.benefitBanner__picture {
  height: 70px;
}

/* flip card */
.banners-top-block .next-to-carousel-banners .banner-wrapper {
  position: relative;
  display: block;
  width: 50%;
}

.banners-top-block .next-to-carousel-banners .banner-wrapper a {
  display: block;
  width: 100%;
}

/* Flip card nastavenia */
.banners-top-block .next-to-carousel-banners .flip-card {
  perspective: 1000px;
  width: 100%;
  height: 100%;
  display: block;
  overflow: visible;
}

.banners-top-block .next-to-carousel-banners .flip-card-inner {
  position: relative;
  width: 100%;
  height: 100%;
  transition: transform 0.6s;
  transform-style: preserve-3d;
}

/* Hover efekt */
.banners-top-block
  .next-to-carousel-banners
  .banner-wrapper
  a:hover
  .flip-card-inner {
  transform: rotateY(180deg);
}

/* Predná strana – NEBUDE absolute, nech určuje výšku */
.banners-top-block .next-to-carousel-banners .flip-card-front {
  position: relative;
  z-index: 2;
  backface-visibility: hidden;
}

.banners-top-block .next-to-carousel-banners .flip-card-front img {
  display: block;
  width: 100%;
  height: auto; /* výška podľa obrázka */
}

/* Zadná strana – prekryje obrázok */
.banners-top-block .next-to-carousel-banners .flip-card-back {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  backface-visibility: hidden;
  transform: rotateY(180deg);
  overflow: visible;

  background: var(--color-secondary);
  color: #fff;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  padding: 20px;
  text-align: center;
  border-radius: 20px;
}

.banners-top-block .banner-wrapper {
  overflow: visible;
}

.banners-top-block .banner-wrapper a,
.banners-top-block .banner-wrapper img {
  overflow: visible;
}
.banners-top-block .banner-wrapper img {
  overflow: hidden;
  border-radius: 20px;
}