/* ==================== 轮播图插件样式 ==================== */
/* 通用按钮设定 */
*[class*="ax-swiper"] .ax-prev,
*[class*="ax-swiper"] .ax-next{font-family: 'ax-iconfont'; font-size: 28px; color: var(--color-primary-fg); width: 54px; height: 54px; box-sizing: border-box; line-height: 54px; text-align: center; margin-top: -27px; cursor: pointer; transition: color 100ms linear, background-color 100ms linear; display: flex; align-items: center; justify-content: center; position: absolute; top: 50%; z-index: 10;}
*[class*="ax-swiper"] .ax-prev:before{content: 'left';}
*[class*="ax-swiper"] .ax-next{right: 0; left: auto;}
*[class*="ax-swiper"] .ax-next:before{content: 'right';}
/* 轮播点（分页器）通用样式 */
*[class*="ax-swiper"] .ax-pages{line-height: 1rem; position: absolute; text-align: center; transition: 300ms opacity; transform: translate3d(0, 0, 0); z-index: 10;}
*[class*="ax-swiper"] .ax-pages.ax-pages-hidden{opacity: 0;}
*[class*="ax-swiper"] .ax-pages .ax-pages-bullet{width: 1rem; height: 1rem; margin: 0 0.4rem; display: inline-block; border-radius: 100%; background: rgba(0, 0, 0, 0.5); opacity: 0.2; transition: all 100ms linear;}
/* 轮播图容器与项通用样式 */
.ax-wrapper{display: flex; flex-shrink: 0; /* 图片不被压缩 */}
.ax-slide{flex-shrink: 0; /* 图片保持原尺寸 */ width: 100%;}
/* 轮播图中下部轮播点定位 */
.ax-swiper .ax-pages-fraction,
.ax-swiper .ax-pages-custom,
.ax-swiper .ax-horizontal > .ax-pages-bullets,
.ax-swiper .ax-pages-bullets.ax-pages-horizontal{bottom: 2rem; left: 0; width: 100%;}
/* ==================== 针对特定轮播器 (#swiper1) 的样式 ==================== */
/* 1. 确保轮播图容器宽度为100%视口宽度 */
#swiper1.ax-swiper{width: 100vw !important; margin-left: 0; /* 抵消外层容器的padding，使轮播图占满屏幕宽度 */ position: relative; left: 0; overflow: hidden;}
/* 2. 控制轮播图内部包装器 */
#swiper1 .ax-wrapper{width: 100% !important; height: auto; /* 高度自适应 */ aspect-ratio: 3 / 1; /* 关键：设置固定的宽高比，例如3:1，可根据实际图片比例调整 */}
/* 3. 每个轮播项占满容器 */
#swiper1 .ax-slide{width: 100% !important; height: 100%; float: left; /* 确保横向排列 */}
/* 4. 核心修复：控制背景图片的显示方式 */
#swiper1 .ax-slide a{display: block; width: 100%; height: 100%; background-size: cover; /* 或 contain，根据需求选择 */ background-position: center center; background-repeat: no-repeat; background-attachment: scroll;}
/* ==================== 状态与交互样式 (优先级覆盖) ==================== */
/* 激活的轮播点样式 */
[class*="ax-swiper"] .ax-pages .ax-pages-bullet-active{opacity: 1; background: rgba(255, 90, 0, 0.8);}
/* 导航按钮颜色覆盖 */
*[class*="ax-swiper"] .ax-prev,
*[class*="ax-swiper"] .ax-next{color: rgba(255, 255, 255, 0.5);}