/**
 * 移动端溢出修复
 * 解决新闻内容撑开页面导致广告弹窗误判为 PC 端的问题
 */

/* 防止页面横向溢出 */
html, body {
    overflow-x: hidden !important;
    max-width: 100vw !important;
}

/* 确保容器不会被内容撑开 */
.container {
    max-width: 100% !important;
    overflow-x: hidden;
}

/* 新闻内容区域限制 */
.prose-content {
    max-width: 100% !important;
    overflow-x: auto;
    word-wrap: break-word;
    overflow-wrap: break-word;
}

/* 确保内容中的图片不会撑开容器 */
.prose-content img {
    max-width: 100% !important;
    height: auto !important;
}

/* 确保 iframe、video 等媒体元素也不会撑开容器 */
.prose-content iframe,
.prose-content video,
.prose-content embed,
.prose-content object {
    max-width: 100% !important;
}

/* 确保预格式化文本不会撑开容器 */
.prose-content pre,
.prose-content code {
    max-width: 100%;
    overflow-x: auto;
    white-space: pre-wrap;
    word-wrap: break-word;
}

/* 表格响应式 */
.prose-content table {
    max-width: 100%;
    overflow-x: auto;
    display: block;
}

/* 详情页面板不溢出 */
#news-content {
    max-width: 100%;
    overflow-x: hidden;
}

#news-content img {
    max-width: 100% !important;
    height: auto !important;
}

/* =====================================================
   分类页面卡片溢出修复
   ===================================================== */

/* 卡片容器限制溢出 */
[data-content="card_view"] > div,
[data-content="list_view"] > div {
    overflow: hidden;
    max-width: 100%;
}

/* 新闻卡片内容区域 */
[data-content="card_view"] .p-3,
[data-content="list_view"] .col-span-3 {
    overflow: hidden;
    max-width: 100%;
}

/* 新闻标题强制换行并限制溢出 */
[data-content="card_view"] a.text-xl,
[data-content="list_view"] a.text-xl {
    word-wrap: break-word !important;
    overflow-wrap: break-word !important;
    overflow: hidden !important;
    max-width: 100% !important;
    display: block !important;
}

/* 移动端特定修复 */
@media (max-width: 768px) {
    /* 卡片区域强制不溢出 */
    [data-content="card_view"],
    [data-content="list_view"] {
        overflow: hidden;
        max-width: 100vw;
    }
    
    /* 卡片内文字强制换行 */
    [data-content="card_view"] .p-3 *,
    [data-content="list_view"] .col-span-3 * {
        word-wrap: break-word;
        overflow-wrap: break-word;
        max-width: 100%;
    }
    
    /* 分类页面容器限制 */
    .container {
        overflow-x: hidden !important;
        max-width: 100vw !important;
    }
}