:root {
    --swiper-navigation-size: clamp(30px, 6vw, 44px) !important;
}

.swiper-scrollbar {
  background: #ffffff33;
  border-radius: 10px;
}

.swiper-pagination-bullet-active {
  background-color: #a58100 !important;
}

.swiper-pagination-bullet {
  transition: all 0.3s ease;
  background-color: #ffffff !important;
}
.swiper-button-next,
.swiper-button-prev {
  color: #fff !important;
  transition: all 0.3s ease;
}

.swiper {
  padding-bottom: 40px !important;
}

.swiper-wrapper {
  align-items: center;
}

.swiper-button-next {
  right: var(--padding-on-sides) !important;

}
.swiper-button-prev {
  left: var(--padding-on-sides) !important;
}

#timeLeft {
  appearance: none;
  -webkit-appearance: none;
  width: 160px;
  height: 7px;
  background: rgba(192, 154, 4, 0.6);
  border-radius: 5px;
  --slider-color: #ffee996e;
  background-image: linear-gradient(var(--slider-color), var(--slider-color));
  background-size: auto 100%;
  background-repeat: no-repeat;
}

#timeLeft::-webkit-slider-thumb {
  -webkit-appearance: none;
  appearance: none;
}

#timeLeft::-webkit-slider-runnable-track {
  -webkit-appearance: none;
  appearance: none;
  box-shadow: none;
  border: none;
  background: transparent;
}