/* ============================================== */
/* SCWF Slider Core Styles */
/* ============================================== */

/* 轮播图外部容器 (设置高度和边界) */
.scwf-slider-wrapper {
    position: relative;
    width: 100%;
    height: 800px; /* 桌面端高度 */
    overflow: hidden;
    margin-bottom: 40px;
    background-color: #f0f0f0;
    border-radius: 8px; /* 桌面端可能保持圆角 */
}

/* 轨道：包含所有 Slide */
.scwf-slider-track {
    display: flex;
    height: 100%;
    transition: transform 0.5s ease-in-out;
    width: 100%; /* 宽度将由 JS 动态设置 */
}

/* 单个 Slide */
.scwf-slide {
    min-width: 100%;
    height: 100%;
    background-size: cover;
    background-position: center center;
    background-repeat: no-repeat;
    position: relative;
}

/* 标题和导航样式 (保持不变) */
.scwf-caption {
    position: absolute; bottom: 40px; left: 50%; transform: translateX(-50%);
    background: rgba(0, 0, 0, 0.6); color: #fff; padding: 15px 30px;
    border-radius: 4px; z-index: 2; text-align: center;
}
.scwf-caption h3 { margin: 0; font-size: 24px; color: #fff; }

.scwf-btn {
    position: absolute; top: 50%; transform: translateY(-50%);
    background: rgba(0,0,0,0.3); color: white; border: none; font-size: 24px;
    padding: 15px; cursor: pointer; z-index: 10; border-radius: 50%;
}
.scwf-prev { left: 10px; } .scwf-next { right: 10px; }
.scwf-dots {
    position: absolute; bottom: 15px; left: 50%; transform: translateX(-50%);
    display: flex; gap: 10px; z-index: 10;
}
.scwf-dot {
    width: 12px; height: 12px; background-color: rgba(255,255,255,0.5);
    border-radius: 50%; cursor: pointer;
}
.scwf-dot.active { background-color: #fff; transform: scale(1.2); }


/* ============================================== */
/* 移动端全宽度和高度优化修复 */
/* ============================================== */

@media (max-width: 768px) {
    /* 1. 移动端高度优化 */
    .scwf-slider-wrapper {
        height: 300px; /* 移动端高度降低 */
        border-radius: 0; /* 移除边角，实现全宽度贴边 */
    }

    /* 2. 全宽度修复：强制突破主题容器限制 */
    .scwf-slider-wrapper {
        width: 100vw; 
        position: relative; 
        left: 50%; 
        right: 50%;
        margin-left: -50vw; /* 调整左侧负边距 */
        margin-right: -50vw; /* 调整右侧负边距 */
        /* 确保上下边距正确 */
        margin-bottom: 20px !important;
        margin-top: -1px; /* 修复可能出现的顶部小缝隙 */
    }
}


/* ============================================== */
/* 箭头悬停显示逻辑 */
/* ============================================== */

/* 1. 默认隐藏左右箭头（scwf-btn 是左右箭头的通用类） */
.scwf-slider-wrapper .scwf-btn {
    /* 将不透明度设为 0 */
    opacity: 0;
    /* 确保它们不会被点击或选中 */
    visibility: hidden;
    /* 添加平滑过渡效果 */
    transition: opacity 0.3s ease-in-out, visibility 0.3s ease-in-out; 
}

/* 2. 当鼠标悬停在整个 Slider 容器上时，显示箭头 */
.scwf-slider-wrapper:hover .scwf-btn {
    opacity: 1;
    visibility: visible;
}

/* 3. 在移动端或触摸屏设备上，为方便操作，通常保持箭头常驻 */
@media (max-width: 768px) {
    .scwf-slider-wrapper .scwf-btn {
        opacity: 0.8; /* 移动端默认略微透明或常驻 */
        visibility: visible;
    }
}
