/* 重置 bxSlider 自带的边框、阴影和背景 */
.site-banner {
  overflow: hidden;
  margin-top: var(--site-header-height);
  position: relative;
  z-index: 1;
  isolation: isolate;
}

/* 有 Banner 的页面由 Banner 自身让出顶栏高度，避免与 .main 内边距叠加或被遮挡 */
.main:has(.site-banner):not(:has(.cate-list-shell)) {
  padding-top: 0;
}

/* 分类列表/详情页：由 .main 统一让出顶栏，Banner 不再叠加 margin-top，便于 sticky 吸附 */
.main:has(.cate-list-shell) {
  padding-top: var(--site-header-height);
}

.cate-list-shell .site-banner {
  margin-top: 0;
}

.site-carousel {
  position: relative;
  z-index: 1;
}

.site-carousel__slide img {
  width: 100%;
  height: 400px;
  object-fit: cover;
  display: block;
}
/* 隐藏原生箭头/圆点（用slick自带控件），也可保留自己的 */
.site-carousel__arrow, .site-carousel__dots {
  display: none;
}

.bx-wrapper {
  border: none !important;
  background: transparent !important;
  box-shadow: none !important;
  margin: 0 !important;
  overflow: hidden !important;
  position: relative !important;
  z-index: 1 !important;
}

/* bxSlider 默认箭头 z-index 极高，滚动时会浮在固定顶栏之上 */
.bx-wrapper .bx-controls,
.bx-wrapper .bx-controls-direction,
.bx-wrapper .bx-controls-direction a,
.bx-wrapper .bx-controls-auto,
.bx-wrapper .bx-pager,
.bx-wrapper .bx-pager-item,
.bx-wrapper .bx-pager-link {
  z-index: 2 !important;
}
.bx-wrapper img {
  border: none !important;
  box-shadow: none !important;
  width: 100% !important;
  height: auto !important;
  display: block !important;
}
.bx-wrapper .bx-pager {
  position: absolute !important;
  bottom: 15px !important; /* 距离底部的距离，可根据需要调整 */
  left: 50% !important;
  transform: translateX(-50%) !important;
  text-align: center !important;
  width: auto !important;
}

.bx-wrapper .bx-pager.bx-default-pager a {
  background: rgba(255,255,255,0.5) !important;
  border-radius: 50% !important;
  width: 12px !important;
  height: 12px !important;
  margin: 0 5px !important;
}

.bx-wrapper .bx-pager.bx-default-pager a.active {
  background: #fff !important;
}

@media (max-width: 768px) {
  .site-carousel__slide img {
    height: auto;
    min-height: 120px;
    max-height: 168px;
    object-fit: cover;
  }

  .bx-wrapper img {
    min-height: 120px;
    max-height: 168px;
    object-fit: cover !important;
  }
}