/**
 * 修复水平滚动问题
 * 确保页面只能上下滚动，不能左右滑动
 * 采用温和策略，避免过度强制设置
 * 保持页面协调的宽度布局
 */

/* ===== 全局修复 ===== */

/* 1. 根元素和body修复 - 使用温和策略 */
html, body {
    overflow-x: hidden;
    /* 移除过度的宽度设置，保持页面协调 */
    width: auto;
    max-width: none;
}

/* 2. 所有容器元素修复 */
* {
    box-sizing: border-box;
}

/* 3. 主要容器修复 - 已移至main.css */
/* .container,
.page-container,
.main-container,
.content-container {
    overflow-x: hidden;
    padding-left: 15px;
    padding-right: 15px;
} */

/* 4. 导航栏修复 - 已移至navbar-optimization.css */
/* .navbar,
.nav-container {
    overflow-x: hidden;
} */

/* 5. 页面头部修复 - 已移至navbar-optimization.css */
/* .page-header,
.hero-section,
.contact-hero {
    overflow-x: hidden;
} */

/* 6. 内容区域修复 - 保持原有设计 */
.contact-content,
.services-section,
.cases-section,
.about-content,
.news-content {
    /* 保持原有的内容区域宽度设置 */
    overflow-x: hidden;
}

/* 7. 页脚修复 - 已移至main.css */
/* .footer {
    overflow-x: hidden;
} */

/* 8. 移动端导航修复 - 保持原有设计 */
.mobile-nav-overlay-v2 {
    /* 保持原有的移动端导航宽度设置 */
    overflow-x: hidden;
}

/* 移动端菜单本身不需要强制100%宽度，保持其设计宽度 */
.mobile-nav-v2 {
    overflow-x: hidden;
}

/* 9. 卡片和网格修复 - 已移至main.css */
/* .contact-cards,
.services-grid,
.cases-grid,
.advantages-grid {
    overflow-x: hidden;
    flex-wrap: wrap;
} */

/* 10. 响应式修复 */
@media (max-width: 768px) {
    /* 移动端特别修复 */
    .container {
        padding-left: 10px;
        padding-right: 10px;
    }
    
    /* 卡片样式已移至main.css */
    /* .contact-card,
    .service-card,
    .case-card,
    .advantage-item {
        margin-left: 0;
        margin-right: 0;
    }
    
    .contact-cards,
    .services-grid,
    .cases-grid,
    .advantages-grid {
        margin-left: 0;
        margin-right: 0;
        padding-left: 0;
        padding-right: 0;
    } */
}

@media (max-width: 480px) {
    /* 小屏幕特别修复 */
    .container {
        padding-left: 5px;
        padding-right: 5px;
    }
    
    /* 确保文字不会超出 */
    h1, h2, h3, h4, h5, h6, p, span, div {
        word-wrap: break-word;
        overflow-wrap: break-word;
    }
}

/* 11. 特殊元素修复 - 保持原有设计 */
/* 修复可能的绝对定位问题 */
.absolute-element,
.fixed-element {
    /* 保持原有的宽度设置 */
    left: 0;
    right: auto;
}

/* 修复可能的transform问题 */
.transformed-element {
    transform-origin: left top;
}

/* 12. 表格修复 */
table {
    max-width: 100%;
    width: 100%;
    overflow-x: auto;
}

/* 13. 图片修复 */
img {
    max-width: 100%;
    height: auto;
}

/* 14. 表单元素修复 */
input, textarea, select {
    max-width: 100%;
    width: 100%;
    box-sizing: border-box;
}

/* 15. 按钮修复 */
.btn, .contact-btn, .service-btn {
    max-width: 100%;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

/* 16. 动画和过渡修复 - 保持原有设计 */
.animated-element,
.transition-element {
    /* 保持原有的宽度设置 */
    overflow-x: hidden;
}

/* 17. 媒体查询修复 - 已移至main.css */
/* @media (min-width: 769px) {
    .container {
        max-width: 1200px;
        margin-left: auto;
        margin-right: auto;
    }
} */

/* 18. 打印样式修复 */
@media print {
    html, body {
        overflow-x: visible;
        width: auto;
    }
    
    .container {
        max-width: none;
        width: auto;
    }
}

/* 19. 新增：防止页面加载时的闪烁 */
body {
    /* 防止页面加载时的水平滚动条闪烁 */
    overflow-x: hidden;
    /* 移除可能导致垂直滚动条问题的min-height设置 */
    /* min-height: 100vh; */
}

/* 20. 新增：优化移动端体验 */
@media (max-width: 768px) {
    body {
        /* 移动端特别优化 */
        overflow-x: hidden;
        /* 防止触摸滑动时的水平滚动 */
        touch-action: pan-y;
    }
}

/* 21. 页面整体宽度协调性 - 已移至main.css */
/* .advantages-section,
.media-section,
.services-overview {
    overflow-x: hidden;
}

.advantages-grid,
.media-grid,
.services-grid {
    overflow-x: hidden;
} */