:root {
  --slider-height:450px;
  --transition-time:0.3s;
  --blur-effect:saturate(2) blur(15px);
  --overlay-bg:rgba(0,0,0,0.3);
  --button-bg:rgb(225 225 225 / 50%);
  --white-border:1px solid rgb(255,255,255,0.5);
}
.slider,.swiper.star-slider {
  position:relative;
  width:100%;
  overflow:hidden;
  border-radius:var(--theme-border-radius);
  box-shadow:0 4px 12px rgba(0,0,0,0.1);
}
.swiper.star-slider[data-height-mode="fixed"] {
  height:var(--slider-height);
}
.swiper.star-slider[data-height-mode="fixed"] .swiper-slide {
  height:100%;
}
.swiper.star-slider[data-height-mode="fixed"] .swiper-slide img {
  width:100%;
  height:100%;
  object-fit:cover;
}
.swiper.star-slider[data-height-mode="adaptive"] {
  height:auto;
  transition:height 0.3s ease;
}
.swiper.star-slider[data-height-mode="adaptive"] .swiper-slide {
  height:auto;
}
.swiper.star-slider[data-height-mode="adaptive"] .swiper-slide img {
  width:100%;
  height:auto;
  display:block;
}
.slider-indicators {
  position:absolute;
  bottom:10px;
  left:50%;
  transform:translateX(-50%);
  text-align:center;
  z-index:10;
}
.slider-indicator {
  display:inline-block;
  width:7px;
  height:7px;
  background:var(--button-bg);
  border-radius:50%;
  margin:0 3px;
  cursor:pointer;
  transition:background-color var(--transition-time) ease,width var(--transition-time) ease,height var(--transition-time) ease;
  backdrop-filter:var(--blur-effect);
}
.slider-indicator.active {
  width:15px;
  height:7px;
  border-radius:100px;
  background:var(--focus-color);
  backdrop-filter:var(--blur-effect);
}
.slide-track {
  display:flex;
  transition:transform 0.5s ease-in-out;
}
.star-slider .swiper-slide {
  position:relative;
  width:100%;
  height:100%;
  overflow:hidden;
}
.slide.hidden,.swiper-slide-invisible-blank {
  pointer-events:none;
}
.star-slider .swiper-slide img {
  width:100%;
  height:100%;
  object-fit:cover;
  transition:transform 0.3s ease;
  will-change:transform;
}
.star-slider:hover .swiper-slide img {
  transform:scale(1.05);
}
.swiper.star-slider .arrow {
  position:absolute;
  top:50%;
  user-select:none;
  transform:translateY(-50%);
  background:var(--button-bg);
  border:var(--white-border);
  color:#fff;
  cursor:pointer;
  z-index:50;
  border-radius:var(--theme-border-radius-md);
  backdrop-filter:var(--blur-effect);
  width:30px;
  height:60px;
  display:flex;
  align-items:center;
  justify-content:center;
  transition:all 0.3s ease;
  will-change:left,right;
}
.arrow span,.arrow i {
  display:flex;
  align-items:center;
  justify-content:center;
  width:100%;
  height:100%;
  font-size:20px;
  line-height:1;
}
.arrow.left {
  left:-30px;
}
.arrow.right {
  right:-30px;
}
.swiper.star-slider:hover .arrow.left {
  left:10px;
}
.swiper.star-slider:hover .arrow.right {
  right:10px;
}
.star-slider .swiper-slide::before {
  content:"";
  position:absolute;
  top:0;
  left:0;
  right:0;
  bottom:0;
  background-color:var(--overlay-bg);
  opacity:0;
  z-index:2;
  transition:opacity var(--transition-time);
}
.star-slider .swiper-slide:hover::before {
  opacity:1;
}
.one-button button,.many-button button {
  background:var(--button-bg);
  color:white;
  border:var(--white-border);
  backdrop-filter:var(--blur-effect);
  padding:5px 15px;
  border-radius:var(--theme-border-radius-xxl);
  cursor:pointer;
  opacity:0;
  z-index:3;
  transition:opacity var(--transition-time),background-color var(--transition-time);
}
.one-button button {
  position:absolute;
  top:50%;
  left:50%;
  transform:translate(-50%,-50%);
}
.many-button {
  display:flex;
  flex-direction:column;
  gap:10px;
  position:absolute;
  left:50%;
  top:50%;
  transform:translate(-50%,-50%);
  z-index:3;
}
.slide:hover button,.swiper-slide:hover button {
  opacity:1;
}
.slide button:hover,.swiper-slide button:hover {
  background-color:rgb(189 189 189 / 50%);
}
.description {
  position:absolute;
  bottom:35px;
  left:50%;
  transform:translateX(-50%);
  font-size:12px;
  padding:4px 10px;
  background:var(--button-bg);
  border:var(--white-border);
  backdrop-filter:var(--blur-effect);
  border-radius:var(--theme-border-radius-xxl);
  color:#fff;
  z-index:2;
  white-space:nowrap;
  transition:opacity 0.3s ease;
}
.swiper-slide:hover .description {
  opacity:0;
}
.swiper-3d .swiper-slide-shadow-left,.swiper-3d .swiper-slide-shadow-right {
  background-image:none;
}
.swiper-cards .swiper-slide {
  transform-origin:center bottom;
  backface-visibility:hidden;
}
.swiper-flip .swiper-slide {
  backface-visibility:hidden;
}
.swiper-fade .swiper-slide {
  pointer-events:none;
  transition-property:opacity;
}
.swiper-fade .swiper-slide-active {
  pointer-events:auto;
}
