@media (max-width: 768px) {
  .banner .swiper-button-prev {
    display: none;
  }

  .banner .swiper-button-next {
    display: none;
  }
}
.banner .swiper-button-prev {
  display: none;
}
.app-bar .toobar-gutters {
    padding: 26px !important;
}
.banner .swiper-button-next {
  display: none;
}
.sh-header-main {
  box-shadow: 0 3px 5px rgba(57, 63, 72, 0.3) !important;
}
.sh-categories-container > div > h2 {
  display: none !important;
}
.sh-categories-container > div > hr {
  display: none !important;
}
.sh-banner-collection-card > a > div > div > p {
  display: none;
}
.sh-banner-collection-card > a > div > div > p > svg {
  display: none;
}
.sh-product-card:hover {
  box-shadow: 0 3px 10px rgb(0 0 0 / 0.2);
}
.sh-product-card-discount-tag {
  display : none;
}
.sh-product-discount-tag {
  display : none;
}

@media (max-width: 768px) {
  .banner .swiper-button-prev {
    display: none;
  }

  .banner .swiper-button-next {
    display: none;
  }
}
/* Checkout / cart-review header logo → keep it centred.
   The theme centres this container with left:50% + transform:translate(-50%),
   but a script overrides it with an inline `left:0; transform:none`, so the
   toolbar's flex-1 left cluster shoves the logo to the right. We re-center it by
   absolutely positioning it in the (position:relative) toolbar and overriding
   the inline style with !important. On mobile this container is empty/hidden
   (the mobile header uses a separate .logo-ctn), so this only affects desktop. */
.app-bar-center-logo-ctn {
  position: absolute !important;
  left: 50% !important;
  transform: translateX(-50%) !important;
}
.about-description h1,
.about-description h2,
.about-description h3,
.about-description h4,
.about-description h5,
.about-description h6,
.about-description p,
.about-description ul,
.about-description ol,
.about-description li,
.about-description pre,
.about-description figure,
.about-description dl,
.about-description dd {
  font-size: revert;
  font-weight: revert;
  margin: revert;
}
@media (max-width: 768px) {
  .app-bar-main {
    position: relative;
  }
  .logo-ctn {
    position: absolute;
    left: 50%;
    transform: translateX(-50%);
  }
  
}