/* Add this to your CSS file or style tag */
.equal-height-cards {
  display: flex;
  flex-wrap: nowrap;
  align-items: stretch;
}

.equal-height-cards > div {
  display: flex;
  flex-direction: column;
  flex: 1 0 auto;
}

.equal-height-cards .card-content {
  display: flex;
  flex-direction: column;
  flex: 1;
}

.equal-height-cards .card-footer {
  margin-top: auto;
}

/* Hide scrollbar */
.no-scrollbar::-webkit-scrollbar {
  display: none;
}

.no-scrollbar {
  -ms-overflow-style: none;
  scrollbar-width: none;
}

/*  */

/* Force all product cards to have same height and button position */
.product-card {
  display: flex;
  flex-direction: column;
  height: auto;
  min-height: 340px; /* Adjust as needed */
}

.product-card .product-content {
  display: flex;
  flex-direction: column;
  flex: 1;
  padding: 0.5rem 0.625rem 0.5rem 0.625rem;
}

.product-card .product-spacer {
  flex: 1;
  min-height: 8px;
}

.product-card .product-button {
  flex-shrink: 0;
  width: 100%;
  margin-top: 0.5rem;
}

/* Equal height for all cards in slider */
.equal-height-cards {
  display: flex;
  flex-wrap: nowrap;
  align-items: stretch;
}

.equal-height-cards > div {
  display: flex;
  flex-direction: column;
  flex: 1 0 auto;
}

/* Hide scrollbar */
.no-scrollbar::-webkit-scrollbar {
  display: none;
}
.no-scrollbar {
  -ms-overflow-style: none;
  scrollbar-width: none;
}


button.relative:hover span.absolute {
  transform: translateX(0);
}
button.relative span.absolute {
  transition: transform 0.3s ease-in-out;
}
button.relative span.z-10 {
  position: relative;
}

/* Timer Styles */
  .time-box {
    @apply bg-gray-100 rounded-xl w-16 h-16 md:w-20 md:h-20 flex items-center justify-center shadow-inner;
  }

  .time-box span {
    @apply text-2xl md:text-3xl font-bold text-[#1D3C4A];
    transition: transform 0.25s ease, opacity 0.25s ease;
  }

  .time-separator {
    @apply text-2xl md:text-3xl font-bold text-gray-700;
  }

  .tick {
    transform: translateY(-6px);
    opacity: 0.6;
  }

/* Scrollbar Hide */
.scrollbar-hide::-webkit-scrollbar {
    display: none;
}
.scrollbar-hide {
    -ms-overflow-style: none;
    scrollbar-width: none;
}

.line-clamp-2 {
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

/*photoframe scrollbar hide*/
.hide-scrollbar::-webkit-scrollbar {
    display: none; /* for Chrome, Safari, Edge */
  }
  .hide-scrollbar {
    -ms-overflow-style: none; /* for IE and Edge */
    scrollbar-width: none; /* for Firefox */
  }

  /*discovery scrollbar hide*/
  .no-scrollbar::-webkit-scrollbar{
display:none;
}