.pisell-image-carousel {
  position: relative;
  overflow: hidden;

  .swiper {
    width: 100%;
    height: 100%;
  }

  .swiper-slide {
    display: flex;
    align-items: center;
    justify-content: center;

    img {
      width: 100%;
      height: 100%;
      object-fit: cover;
    }
  }

  // 导航箭头样式
  .pisell-carousel-prev,
  .pisell-carousel-next {
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    width: 44px;
    height: 44px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    z-index: 10;
    transition: all 0.3s;
    padding: 10px;
    background: rgba(255, 255, 255, 0.6);
    backdrop-filter: blur(4px);

    &:hover {
      background: rgba(255, 255, 255, 1);
    }

    .carousel-arrow {
      color: #344054;
      font-size: 24px;
      line-height: 1;
    }
  }

  .pisell-carousel-prev {
    left: 20px;
  }

  .pisell-carousel-next {
    right: 20px;
  }

  // 分页点样式
  .pisell-carousel-pagination {
    position: absolute;
    bottom: 16px;
    left: 50%;
    transform: translateX(-50%);
    z-index: 10;
    display: inline-flex;
    padding: 12px;
    justify-content: center;
    align-items: center;
    gap: 6px;
    border-radius: 17px;
    background: rgba(255, 255, 255, 0.9);
    backdrop-filter: blur(4px);
    width: max-content;

    .swiper-pagination-bullet {
      width: 10px;
      height: 10px;
      border-radius: 50%;
      cursor: pointer;
      background: var(--Gray-300, #d0d5dd);
      mix-blend-mode: multiply;
      margin: 0;
      opacity: 1;

      &-active {
        background: var(--Primary-700, #6941c6);
      }
    }
  }
}