/**
 * force-fix.css - 强制修复样式
 * 解决z-index层级和pointer-events点击穿透问题
 * 仅在移动端加载
 */

/* ========================================
   强制修复 - 最高优先级
   ======================================== */

/* 确保所有按钮可点击 */
.cta-button,
button:not(.modal-close):not(.carousel-nav),
.btn,
#openPromoNew,
#joinNowBtn,
#joinNowFinal,
#learnMoreSystem {
    position: relative !important;
    z-index: 999 !important;
    pointer-events: auto !important;
    touch-action: manipulation !important;
    -webkit-tap-highlight-color: rgba(102, 126, 234, 0.3) !important;
}

/* 汉堡菜单最高优先级 */
.hamburger,
#hamburger {
    position: relative !important;
    z-index: 9999 !important;
    pointer-events: auto !important;
    touch-action: manipulation !important;
}

/* ========================================
   容器pointer-events控制
   ======================================== */

/* 禁用容器的pointer-events,防止阻挡点击 */
.hero-section,
.carousel-container,
.carousel-slides,
.carousel-slide {
    pointer-events: none !important;
}

/* 启用轮播控制的pointer-events */
.carousel-nav,
.carousel-indicators,
.indicator {
    pointer-events: auto !important;
    z-index: 50 !important;
}

/* 禁用内容区域的pointer-events */
.hero-cta,
.hero-content-below,
.system-content,
.join {
    pointer-events: none !important;
}

/* 启用内容区域内按钮的pointer-events */
.hero-cta .cta-button,
.hero-cta button,
.hero-content-below .cta-button,
.hero-content-below button,
.system-content .cta-button,
.system-content button,
.join .cta-button,
.join button {
    pointer-events: auto !important;
    z-index: 999 !important;
}

/* ========================================
   移动端特殊修复
   ======================================== */

@media (max-width: 768px) {
    /* 禁用主要容器的pointer-events */
    .site-main,
    section,
    .container {
        pointer-events: none !important;
    }
    
    /* 启用所有交互元素的pointer-events */
    .site-main a,
    .site-main button,
    .site-main .cta-button,
    .site-main .btn,
    .site-main .hamburger,
    section a,
    section button,
    section .cta-button,
    section .btn,
    .container a,
    .container button,
    .container .cta-button,
    .container .btn {
        pointer-events: auto !important;
        position: relative !important;
        z-index: 999 !important;
    }
    
    /* 确保header和导航可交互 */
    .site-header,
    .header-inner,
    .site-nav,
    .nav-list,
    .mobile-menu {
        pointer-events: auto !important;
    }
    
    /* 确保卡片和链接可点击 */
    .card,
    .nav-card,
    .advantage-card {
        pointer-events: auto !important;
    }
}

/* ========================================
   按钮调试样式(可选)
   ======================================== */

/* 按钮按下时显示边框(帮助调试) */
.cta-button:active,
button:active,
.btn:active {
    outline: 2px solid rgba(0, 176, 255, 0.5) !important;
    outline-offset: 2px !important;
}

/* ========================================
   模态框z-index修复
   ======================================== */

.modal {
    z-index: 99999 !important;
}

.modal-backdrop {
    z-index: 99998 !important;
}

.modal-body {
    z-index: 100000 !important;
}

.modal-close {
    z-index: 100001 !important;
    pointer-events: auto !important;
}

/* ========================================
   小臻机器人z-index修复
   ======================================== */

#xiaozhen-container {
    z-index: 10000 !important;
}

.xiaozhen-avatar {
    z-index: 10001 !important;
    pointer-events: auto !important;
}

.xiaozhen-dialog {
    z-index: 10002 !important;
    pointer-events: auto !important;
}

.xiaozhen-dialog * {
    pointer-events: auto !important;
}

/* ========================================
   输入框和表单元素修复
   ======================================== */

input,
textarea,
select,
.xiaozhen-input,
.xiaozhen-send-btn {
    pointer-events: auto !important;
    touch-action: manipulation !important;
}

/* ========================================
   链接修复
   ======================================== */

a {
    pointer-events: auto !important;
    -webkit-tap-highlight-color: rgba(0, 176, 255, 0.2);
}

/* ========================================
   滚动修复
   ======================================== */

/* 防止body滚动被禁用 */
body {
    overflow-x: hidden !important;
    overflow-y: auto !important;
}

/* 模态框打开时禁用body滚动 */
body.modal-open {
    overflow: hidden !important;
}

/* ========================================
   触摸优化
   ======================================== */

@media (max-width: 768px) {
    /* 优化触摸响应 */
    button,
    .cta-button,
    .btn,
    a {
        -webkit-tap-highlight-color: rgba(0, 176, 255, 0.2);
        -webkit-touch-callout: none;
    }
    
    /* 防止长按选择文本 */
    .hamburger,
    .cta-button,
    .btn {
        -webkit-user-select: none;
        -moz-user-select: none;
        -ms-user-select: none;
        user-select: none;
    }
}

/* ========================================
   性能优化
   ======================================== */

/* 使用GPU加速 */
.hamburger,
.mobile-menu,
.modal,
.xiaozhen-dialog {
    -webkit-transform: translateZ(0);
    transform: translateZ(0);
    -webkit-backface-visibility: hidden;
    backface-visibility: hidden;
}