@media (max-width: 768px) {
  #carousel {
    overflow: hidden;
  }
  #carousel .carousel-inner {
    display: flex !important;
    flex-wrap: nowrap;
    overflow-x: auto;
    scroll-snap-type: x mandatory;
    -webkit-overflow-scrolling: touch;
    gap: 12px;
    padding: 0 12px;
  }
  #carousel .carousel-inner .item {
    display: block !important;
    flex: 0 0 85%;
    scroll-snap-align: start;
  }
  #carousel .carousel-inner img {
    width: 100%;
    height: auto;
    border-radius: 8px;
  }
  #carousel .carousel-control,
  #carousel .carousel-indicators {
    display: none !important;
  }
  #carousel .carousel-inner::-webkit-scrollbar {
    display: none;
  }
  #carousel .carousel-inner {
    scrollbar-width: none;
  }
  .top-category-block {
    margin-top: -30px;
  }
}