/* 注释：禁用门户内置轮播修复样式，避免干扰自定义轮播 */
/* 轮播图修复样式 - 解决空白页面问题 */

/* 重置jSlider样式，避免干扰Bootstrap轮播图 */
.jSlider {
    position: static !important;
    height: auto !important;
    width: 100% !important;
    overflow: visible !important;
}

.jSlider > div > * {
    width: auto !important;
    height: auto !important;
    overflow: visible !important;
    display: block !important;
}

.jSlider > img:first-child {
    visibility: visible !important;
    opacity: 1 !important;
    filter: none !important;
}

/* 轮播图基础样式 */
.jSlider { 
    display: block !important; 
    width: 100% !important;
    height: 400px !important;
    overflow: hidden !important;
    position: relative !important;
}

/* 轮播图容器样式 */
#mainCarousel {
    width: 100% !important;
    height: 400px !important;
    overflow: hidden !important;
    display: block !important;
    position: relative !important;
    visibility: visible !important;
    opacity: 1 !important;
}

/* 轮播图内容区域 */
.carousel-inner {
    width: 100% !important;
    height: 400px !important;
    display: block !important;
    overflow: hidden !important;
    position: relative !important;
    visibility: visible !important;
    opacity: 1 !important;
}

/* 轮播图项目样式 */
.carousel-inner .item {
    width: 100% !important;
    height: 400px !important;
    display: block !important;
    overflow: hidden !important;
    position: relative !important;
    visibility: visible !important;
    opacity: 1 !important;
}

.carousel-inner .item.active {
    display: block !important;
    visibility: visible !important;
    opacity: 1 !important;
}

/* 轮播图图片样式 */
.carousel-inner .item img {
    width: 100% !important;
    height: 400px !important;
    object-fit: cover !important;
    display: block !important;
    min-height: 400px !important;
    max-width: 100% !important;
    max-height: 100% !important;
    position: relative !important;
    visibility: visible !important;
    opacity: 1 !important;
}

/* 轮播图切换动画 */
.carousel-inner .item {
    transition: transform 0.6s ease-in-out !important;
    backface-visibility: hidden !important;
    perspective: 1000px !important;
}

/* 防止轮播图切换时出现空白 */
.carousel-inner {
    background: #f8f9fa !important;
    min-height: 400px !important;
}

/* 轮播图控制按钮样式 */
.carousel-control {
    background: rgba(0,0,0,0.3) !important;
    border: none !important;
    width: 50px !important;
    height: 50px !important;
    top: 50% !important;
    transform: translateY(-50%) !important;
    border-radius: 50% !important;
    z-index: 10 !important;
    visibility: visible !important;
    opacity: 1 !important;
}

.carousel-control:hover {
    background: rgba(0,0,0,0.5) !important;
}

/* 轮播图指示器样式 */
.carousel-indicators {
    bottom: 20px !important;
    z-index: 10 !important;
    visibility: visible !important;
    opacity: 1 !important;
}

.carousel-indicators li {
    width: 12px !important;
    height: 12px !important;
    border-radius: 50% !important;
    border: 2px solid #fff !important;
    background: transparent !important;
    margin: 0 5px !important;
    visibility: visible !important;
    opacity: 1 !important;
}

.carousel-indicators li.active {
    background: #fff !important;
}

/* 加载指示器样式 */
.loading-indicator {
    position: absolute !important;
    top: 50% !important;
    left: 50% !important;
    transform: translate(-50%, -50%) !important;
    color: #666 !important;
    font-size: 14px !important;
    background: rgba(255,255,255,0.8) !important;
    padding: 10px 20px !important;
    border-radius: 5px !important;
    z-index: 5 !important;
    visibility: visible !important;
    opacity: 1 !important;
}

/* 响应式设计 */
@media (max-width: 768px) {
    .jSlider, #mainCarousel, .carousel-inner, .carousel-inner .item, .carousel-inner .item img {
        height: 300px !important;
        min-height: 300px !important;
    }
}

@media (max-width: 480px) {
    .jSlider, #mainCarousel, .carousel-inner, .carousel-inner .item, .carousel-inner .item img {
        height: 250px !important;
        min-height: 250px !important;
    }
}

/* 确保轮播图在所有情况下都可见 */
.jSlider, #mainCarousel, .carousel-inner, .carousel-inner .item, .carousel-inner .item img {
    visibility: visible !important;
    opacity: 1 !important;
    display: block !important;
}

/* 强制覆盖其他可能的隐藏样式 */
.jSlider *,
#mainCarousel *,
.carousel-inner *,
.carousel-inner .item *,
.carousel-inner .item img {
    visibility: visible !important;
    opacity: 1 !important;
}

/* 防止CSS动画干扰 */
.carousel-inner .item {
    animation: none !important;
    -webkit-animation: none !important;
    -moz-animation: none !important;
    -o-animation: none !important;
}

/* 确保图片正确显示 */
.carousel-inner .item img {
    image-rendering: auto !important;
    -webkit-image-rendering: auto !important;
    -moz-image-rendering: auto !important;
    -o-image-rendering: auto !important;
}