/* Uniform height for all carousel items (featured, new, offers, brands) */

/* Set a min-height and flex layout for all carousel items */
.featured-products-carousel .item,
.new-products-carousel .item,
.offers-products-carousel .item,
.brand-carousel .item {
  display: flex;
  flex-direction: column;
  justify-content: stretch;
  align-items: stretch;
  min-height: 340px; /* adjust as needed for your design */
  height: 100%;
}

/* Make product cards fill the item */
.featured-products-carousel .item > *,
.new-products-carousel .item > *,
.offers-products-carousel .item > *,
.brand-carousel .item > * {
  flex: 1 1 auto;
  height: 100%;
  display: flex;
  flex-direction: column;
}

/* Optional: force images inside cards to scale and fill */
.featured-products-carousel .item img,
.new-products-carousel .item img,
.offers-products-carousel .item img,
.brand-carousel .item img {
  object-fit: contain;
  width: 100%;
  height: 180px; /* adjust as needed */
  max-height: 180px;
  margin-bottom: 10px;
}

/* Optional: fix card body to fill remaining space */
.card-body {
  flex: 1 1 auto;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
}

/* Responsive: adjust min-height for mobile */
@media (max-width: 576px) {
  .featured-products-carousel .item,
  .new-products-carousel .item,
  .offers-products-carousel .item,
  .brand-carousel .item {
    min-height: 220px;
  }
  .featured-products-carousel .item img,
  .new-products-carousel .item img,
  .offers-products-carousel .item img,
  .brand-carousel .item img {
    height: 100px;
    max-height: 100px;
  }
}

/* ===== Featured Products Carousel (Simple Slide) ===== */
.featured-products-wrapper {
  width: 100%;
  overflow: hidden;
}

.featured-products-track {
  display: flex;
  transition: transform 0.4s ease;
}

.featured-product-item {
  flex: 0 0 20%; /* 5 items on desktop */
  max-width: 20%;
  padding: 0 12px;
  box-sizing: border-box;
}

.featured-product-item > * {
  height: 100%;
  display: flex;
  flex-direction: column;
}

/* Responsive */
@media (max-width: 1200px) {
  .featured-product-item {
    flex: 0 0 25%; /* 4 items */
    max-width: 25%;
  }
}

@media (max-width: 992px) {
  .featured-product-item {
    flex: 0 0 33.333%; /* 3 items */
    max-width: 33.333%;
  }
}

@media (max-width: 768px) {
  .featured-product-item {
    flex: 0 0 50%; /* 2 items */
    max-width: 50%;
  }
}

@media (max-width: 576px) {
  .featured-product-item {
    flex: 0 0 50%; /* 2 items */
    max-width: 50%;
    padding: 0 5px;
  }
}

/* ===== Brand Marquee (Infinite Scroll) ===== */
.brand-marquee-wrapper {
  width: 100%;
  overflow: hidden;
  padding: 20px 0;
}

.brand-marquee {
  display: flex;
  animation: brand-scroll 25s linear infinite;
  width: max-content;
}

.brand-marquee:hover {
  animation-play-state: paused;
}

.brand-marquee-item {
  flex-shrink: 0;
  width: 200px;
  padding: 0 30px;
  display: flex;
  align-items: center;
  justify-content: center;
}

.brand-marquee-item img {
  max-height: 80px;
  max-width: 100%;
  object-fit: contain;
  transition: transform 0.3s ease;
}

.brand-marquee-item img:hover {
  transform: scale(1.05);
}

@keyframes brand-scroll {
  0% {
    transform: translateX(0);
  }
  100% {
    transform: translateX(-50%);
  }
}

/* Responsive */
@media (max-width: 768px) {
  .brand-marquee-item {
    width: 150px;
    padding: 0 20px;
  }
  
  .brand-marquee-item img {
    max-height: 60px;
  }
  
  .brand-marquee {
    animation-duration: 20s;
  }
}

@media (max-width: 576px) {
  .brand-marquee-item {
    width: 120px;
    padding: 0 15px;
  }
  
  .brand-marquee-item img {
    max-height: 50px;
  }
  
  .brand-marquee {
    animation-duration: 15s;
  }
}

.brand-carousel-flickity .brand-carousel-cell {
  width: 20%; /* 5 items on desktop */
  padding: 0 15px;
  display: flex;
  align-items: center;
  justify-content: center;
}

.brand-carousel-flickity .brand-carousel-cell img {
  max-height: 80px;
  max-width: 100%;
  object-fit: contain;
  transition: transform 0.3s ease;
}

.brand-carousel-flickity .brand-carousel-cell img:hover {
  transform: scale(1.05);
}

/* Hide Flickity page dots and buttons */
.brand-carousel-flickity .flickity-page-dots,
.brand-carousel-flickity .flickity-prev-next-button {
  display: none;
}

/* Responsive */
@media (max-width: 992px) {
  .brand-carousel-flickity .brand-carousel-cell {
    width: 25%; /* 4 items */
  }
}

@media (max-width: 768px) {
  .brand-carousel-flickity .brand-carousel-cell {
    width: 33.333%; /* 3 items */
  }
}

@media (max-width: 576px) {
  .brand-carousel-flickity .brand-carousel-cell {
    width: 50%; /* 2 items */
    padding: 0 10px;
  }
  
  .brand-carousel-flickity .brand-carousel-cell img {
    max-height: 60px;
  }
}