/**
 * 移动端横向滚动修复
 * Fix mobile horizontal scrolling issues
 */

/* 全局响应式容器 */
body {
    overflow-x: hidden !important;
}

html {
    overflow-x: hidden !important;
}

/* 确保所有容器不超出屏幕宽度 */
* {
    box-sizing: border-box !important;
}

/* 主要布局容器 */
.container,
.container-fluid,
.main-container {
    max-width: 100% !important;
    overflow-x: hidden !important;
}

/* 论坛三栏布局修复 */
.forum-three-column-layout {
    max-width: 100% !important;
    width: 100% !important;
}

/* 导航栏修复 */
.navbar,
.navbar-nav,
#absolute-top-nav,
#bottom-nav-fixed {
    max-width: 100vw !important;
    overflow-x: hidden !important;
}

/* 移动端响应式布局 */
@media (max-width: 768px) {
    /* 强制单栏布局 */
    .forum-three-column-layout {
        display: block !important;
        width: 100% !important;
        max-width: 100% !important;
    }
    
    /* 侧边栏在移动端隐藏或堆叠 */
    .forum-left-sidebar,
    .forum-right-sidebar {
        width: 100% !important;
        max-width: 100% !important;
        margin-bottom: 15px !important;
    }
    
    /* 主内容区 */
    .forum-main-content {
        width: 100% !important;
        max-width: 100% !important;
        padding: 0 10px !important;
    }
    
    /* 表格响应式 */
    .table-responsive {
        overflow-x: auto !important;
        -webkit-overflow-scrolling: touch !important;
    }
    
    /* 防止固定宽度元素导致横向滚动 */
    .fixed-width-element {
        width: 100% !important;
        max-width: 100% !important;
    }
    
    /* 图片响应式 */
    img {
        max-width: 100% !important;
        height: auto !important;
    }
    
    /* 文本和内容不换行的修复 */
    .text-nowrap {
        white-space: normal !important;
    }
    
    /* 超长内容的处理 */
    pre,
    code {
        white-space: pre-wrap !important;
        word-wrap: break-word !important;
        overflow-x: auto !important;
    }
    
    /* 小工具容器 */
    .widget,
    .zib-widget {
        width: 100% !important;
        max-width: 100% !important;
        margin: 0 0 15px 0 !important;
    }
}

/* 超小屏幕设备 */
@media (max-width: 480px) {
    /* 进一步减少内边距 */
    .container,
    .main-container {
        padding-left: 5px !important;
        padding-right: 5px !important;
    }
    
    .forum-main-content {
        padding: 0 5px !important;
    }
    
    /* 按钮和表单元素响应式 */
    .btn,
    .button,
    input[type="text"],
    input[type="email"],
    textarea {
        width: 100% !important;
        max-width: 100% !important;
    }
}

/* 特殊情况：处理可能导致横向滚动的特定元素 */
.forum-header,
.forum-content,
.post-content {
    max-width: 100% !important;
    overflow-x: hidden !important;
}

/* 修复可能的绝对定位元素 */
.position-absolute,
.position-fixed {
    max-width: 100vw !important;
}

/* 调试：临时边框来识别问题元素（可在生产环境中移除） */
/*
@media (max-width: 768px) {
    * {
        outline: 1px solid red !important;
    }
}
*/