/* 1. 强制清空外层所有可能的背景、边框和阴影 */
#swiperBox, 
#swiper_container, 
.blog-slider,
.swiper-container {
    padding: 0 !important;
    margin: 0 auto !important;
    background: none !important; /* 彻底删掉白色底色 */
    border: none !important;
    box-shadow: none !important;
    width: 100% !important;
    overflow: hidden !important;
}

/* 2. 针对容器下方的白边进行“零间距”处理 */
div#swiperBox {
    margin-bottom: 20px !important; /* 只保留外部下边距，内部不留白 */
}

div#swiper_container {
    height: 250px !important;
    display: block !important;
    border-radius: 12px;
}

/* 3. 彻底隐藏那个奇怪的橙色方块 */
/* 那个方块通常是 swiper-pagination-bullet-active 或导航按钮的背景 */
.blog-slider__pagination .swiper-pagination-bullet,
.swiper-pagination-bullet,
.swiper-button-next,
.swiper-button-prev {
    outline: none !important;
}

/* 如果你不需要底部的圆点，直接用下面这行彻底删掉它 */
.blog-slider__pagination, .swiper-pagination {
    display: none !important; 
}

/* 4. 修复图片和内容的覆盖，确保不露底色 */
.blog-slider__item {
    width: 100% !important;
    height: 100% !important;
    background-size: cover !important;
    background-position: center !important;
    margin: 0 !important;
    padding: 0 !important;
}

/* 5. 修正文字布局，防止重叠 */
.blog-slider__content {
    background: rgba(0, 0, 0, 0.45); /* 黑色半透明遮罩 */
    width: 100% !important;
    height: 100% !important;
    padding: 0 40px !important;
    display: flex !important;
    flex-direction: column;
    justify-content: center;
    align-items: center;
}

a.blog-slider__title {
    font-size: 1.5rem !important;
    color: #fff !important;
    margin: 5px 0 !important;
    display: block !important;
}

/* 6. 解决左右箭头样式异常 */
.swiper-button-next::after, .swiper-button-prev::after {
    font-size: 1.2rem !important;
    color: #fff !important;
    background: none !important; /* 彻底去掉背景色 */
}