/**
 * 全站注入内容移动端响应式样式
 * 适用于所有 inject-*.js 注入的页面内容
 * 确保内容不超出手机屏幕范围
 */

/* ========================================
   全局基础样式 - 防止溢出
   ======================================== */
/* 注意：不对 html/body 设置 overflow-x: hidden，以免影响导航栏滚动 */

.home-injected-content,
.articles-injected-content,
.article-detail-injected-content,
.combat-fraud-injected-content,
.query-platform-injected-content,
.report-form-injected-content,
.guideline-injected-content {
    max-width: 100vw;
    overflow-x: hidden;
    box-sizing: border-box;
    width: 100%;
}

/* 全局兜底：避免正文长文本/长URL把页面撑出屏幕 */
.home-injected-content,
.articles-injected-content,
.article-detail-injected-content,
.combat-fraud-injected-content,
.query-platform-injected-content,
.report-form-injected-content,
.guideline-injected-content {
    overflow-wrap: anywhere;
    word-break: break-word;
}

.home-injected-content *,
.articles-injected-content *,
.article-detail-injected-content *,
.combat-fraud-injected-content *,
.query-platform-injected-content *,
.report-form-injected-content *,
.guideline-injected-content * {
    box-sizing: border-box;
    max-width: 100%;
}

/* 媒体元素强制不溢出 */
.home-injected-content img,
.articles-injected-content img,
.article-detail-injected-content img,
.combat-fraud-injected-content img,
.query-platform-injected-content img,
.report-form-injected-content img,
.guideline-injected-content img,
.home-injected-content video,
.articles-injected-content video,
.article-detail-injected-content video,
.combat-fraud-injected-content video,
.query-platform-injected-content video,
.report-form-injected-content video,
.guideline-injected-content video,
.home-injected-content iframe,
.articles-injected-content iframe,
.article-detail-injected-content iframe,
.combat-fraud-injected-content iframe,
.query-platform-injected-content iframe,
.report-form-injected-content iframe,
.guideline-injected-content iframe,
.home-injected-content svg,
.articles-injected-content svg,
.article-detail-injected-content svg,
.combat-fraud-injected-content svg,
.query-platform-injected-content svg,
.report-form-injected-content svg,
.guideline-injected-content svg {
    max-width: 100% !important;
}

/* 表格：允许横向滚动，不撑破屏幕 */
.article-detail-injected-content table,
.articles-injected-content table,
.report-form-injected-content table,
.guideline-injected-content table,
.query-platform-injected-content table {
    display: block;
    width: 100% !important;
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
}

/* 代码块/预格式化文本：允许换行或横向滚动 */
.article-detail-injected-content pre,
.articles-injected-content pre,
.report-form-injected-content pre,
.guideline-injected-content pre,
.query-platform-injected-content pre,
.article-detail-injected-content code,
.articles-injected-content code {
    max-width: 100%;
    overflow-x: auto;
    white-space: pre-wrap;
    word-break: break-word;
}

/* 导航栏样式由 media-ya.css 控制，这里只调整间距和颜色统一 */

/* 全局统一导航链接颜色 - 不受媒体查询限制 */
/* 强制所有导航链接使用相同颜色，无论是否有text-dark类 */
.navbar-nav .nav-item .nav-link,
.navbar-nav .nav-item > a,
.navbar-nav > li > a,
.navbar-nav > li a,
#menu.navbar-nav > li a,
#menu.navbar-nav > li > a,
#menu > li > a,
#menu a.nav-link,
#menu a.dropdown-toggle,
nav.navbar .nav-link,
.navbar.bg-warning .nav-link,
.navbar.bg-warning .navbar-nav a,
.navbar-collapse .nav-link,
.navbar-collapse a.nav-link,
.navbar-collapse a,
.navbar-collapse.justify-content-xl-center a,
.navbar-collapse.justify-content-xl-center .nav-link,
ul#menu > li > a,
ul#menu li a.nav-link,
ul#menu li a,
.nav-link.text-dark,
.nav-link:not(.text-dark),
a.nav-link.dropdown-toggle,
a.nav-link.dropdown-toggle.text-dark {
    color: #252A2F !important;
}

@media (max-width: 768px) {
    /* 覆盖Bootstrap的margin-right类 */
    .navbar-nav .nav-item,
    .navbar-nav > li {
        margin: 0 !important;
        margin-right: 0.4rem !important;
    }
    
    /* 覆盖mr-lg-3, mr-4等Bootstrap类 */
    .navbar-nav .mr-lg-3,
    .navbar-nav .mr-4,
    .navbar-nav .mx-4,
    .navbar-nav [class*="mr-"] {
        margin-right: 0.4rem !important;
    }
    
    .nav-link {
        padding: 0.5rem 0.6rem !important;
        font-size: 15px !important;
        white-space: nowrap !important;
    }
    
    /* 统一导航链接文字颜色 - 使用更强的选择器 */
    .navbar-nav .nav-item .nav-link,
    .navbar-nav .nav-item a,
    .navbar-nav > li > a,
    .navbar-nav > li a,
    #menu.navbar-nav > li a,
    #menu.navbar-nav > li > a,
    #menu > li > a,
    #menu a.nav-link,
    #menu a.dropdown-toggle,
    nav.navbar .nav-link,
    .navbar.bg-warning .nav-link,
    .navbar.bg-warning a {
        color: #252A2F !important;
    }
}

/* ========================================
   識詐宣導（#/articles/6）手机端：左右留白一致、整体更居中更宽
   不影响PC（仅小屏生效）
   ======================================== */
@media (max-width: 900px) {
    .combat-fraud-injected-content,
    .combat-fraud-page {
        width: 100vw !important;
        max-width: 100vw !important;
        margin: 0 !important;
        padding-left: 0 !important;
        padding-right: 0 !important;
    }

    .combat-fraud-videos-wrap {
        max-width: none !important;
        width: calc(100vw - 30px) !important;
        margin: -20px 15px 0 !important;
        padding: 20px 15px 35px !important;
        border-radius: 8px !important;
        box-sizing: border-box !important;
    }

    .combat-fraud-videos-grid {
        grid-template-columns: 1fr !important;
        gap: 15px !important;
    }
}

@media (max-width: 480px) {
    .navbar-nav .nav-item,
    .navbar-nav > li {
        margin-right: 0.25rem !important;
    }
    
    .navbar-nav .mr-lg-3,
    .navbar-nav .mr-4,
    .navbar-nav .mx-4,
    .navbar-nav [class*="mr-"] {
        margin-right: 0.25rem !important;
    }
    
    .nav-link {
        padding: 0.4rem 0.5rem !important;
        font-size: 14px !important;
    }
    
    /* 统一导航链接文字颜色 - 使用更强的选择器 */
    .navbar-nav .nav-item .nav-link,
    .navbar-nav .nav-item a,
    .navbar-nav > li > a,
    .navbar-nav > li a,
    #menu.navbar-nav > li a,
    #menu.navbar-nav > li > a,
    #menu > li > a,
    #menu a.nav-link,
    #menu a.dropdown-toggle,
    nav.navbar .nav-link,
    .navbar.bg-warning .nav-link,
    .navbar.bg-warning a {
        color: #252A2F !important;
    }
}

/* 所有图片响应式 */
.home-injected-content img,
.articles-injected-content img,
.article-detail-injected-content img,
.combat-fraud-injected-content img,
.query-platform-injected-content img,
.report-form-injected-content img,
.guideline-injected-content img {
    max-width: 100%;
    height: auto;
}

/* ========================================
   平板端适配 (768px - 1024px)
   ======================================== */
@media (max-width: 1024px) {
    /* 首页轮播 */
    .home-injected-content .carousel-item img {
        height: auto;
        min-height: 300px;
        object-fit: cover;
    }
    
    /* 首页新闻区块 */
    .home-injected-content .news-section-grid {
        grid-template-columns: repeat(2, 1fr) !important;
        gap: 20px !important;
    }
    
    /* 首页二维码区域 */
    #home-footer-qrcodes {
        gap: 20px !important;
    }
    
    #home-footer-qrcodes > div img {
        width: 80px !important;
        height: 80px !important;
    }
}

/* ========================================
   手机端适配 (max-width: 768px)
   ======================================== */
@media (max-width: 768px) {
    /* === 通用容器 === */
    .home-injected-content > div,
    .articles-injected-content > div,
    .article-detail-injected-content > div,
    .combat-fraud-injected-content > div {
        padding-left: 15px !important;
        padding-right: 15px !important;
    }
    
    /* === 首页 === */
    /* 轮播图 */
    .home-injected-content .carousel-item {
        height: auto !important;
    }
    
    .home-injected-content .carousel-item img {
        height: auto !important;
        min-height: 200px;
        object-fit: cover;
    }
    
    /* 搜索区域 */
    .home-injected-content .search-section {
        padding: 20px 15px !important;
    }
    
    .home-injected-content .search-section input {
        width: 100% !important;
        max-width: none !important;
    }
    
    /* 新闻区块 - 单列显示 */
    .home-injected-content .news-section-grid {
        grid-template-columns: 1fr !important;
        gap: 15px !important;
    }
    
    /* 新闻卡片 */
    .home-injected-content .news-card {
        padding: 15px !important;
    }
    
    .home-injected-content .news-card h3 {
        font-size: 16px !important;
    }
    
    /* 链接按钮区域 */
    .home-injected-content .related-links-bar {
        flex-direction: column !important;
        gap: 10px !important;
        padding: 15px 10px !important;
    }
    
    .home-injected-content .related-links-bar a {
        width: 100% !important;
        text-align: center !important;
        padding: 12px 15px !important;
        font-size: 14px !important;
    }
    
    /* 底部页脚 */
    .home-injected-content footer > div {
        padding: 0 15px !important;
    }
    
    .home-injected-content footer > div > div {
        flex-direction: column !important;
        gap: 30px !important;
        align-items: center !important;
        text-align: center !important;
    }
    
    #home-footer-qrcodes {
        flex-wrap: wrap !important;
        justify-content: center !important;
        gap: 15px !important;
    }
    
    #home-footer-qrcodes > div {
        flex: 0 0 calc(50% - 10px) !important;
    }
    
    #home-footer-qrcodes > div img {
        width: 70px !important;
        height: 70px !important;
    }
    
    #home-footer-badges {
        flex-direction: row !important;
        gap: 15px !important;
    }
    
    /* === 文章列表页 === */
    .articles-injected-content .page-header {
        padding: 30px 15px !important;
        min-height: auto !important;
    }
    
    .articles-injected-content .page-header h1 {
        font-size: 24px !important;
    }
    
    .articles-injected-content .main-content {
        padding: 0 10px !important;
        margin-top: -20px !important;
    }
    
    .articles-injected-content .article-item {
        padding: 15px !important;
        flex-direction: column !important;
        gap: 10px !important;
    }
    
    .articles-injected-content .article-item .date {
        font-size: 12px !important;
    }
    
    .articles-injected-content .article-item .title {
        font-size: 15px !important;
        line-height: 1.5 !important;
    }
    
    /* 分页 */
    .articles-injected-content .pagination {
        flex-wrap: wrap !important;
        gap: 5px !important;
    }
    
    .articles-injected-content .pagination button {
        padding: 8px 12px !important;
        font-size: 13px !important;
    }
    
    /* === 文章详情页 === */
    .article-detail-injected-content .page-header {
        padding: 25px 15px !important;
        min-height: auto !important;
    }
    
    .article-detail-injected-content .page-header h1 {
        font-size: 20px !important;
        line-height: 1.4 !important;
    }
    
    .article-detail-injected-content .main-content {
        padding: 0 10px !important;
        margin-top: -20px !important;
    }
    
    .article-detail-injected-content .article-content {
        padding: 20px 15px !important;
    }
    
    .article-detail-injected-content .article-content img {
        max-width: 100% !important;
        height: auto !important;
    }
    
    /* 详情页grid布局改为单列 */
    .article-detail-injected-content .content-grid {
        grid-template-columns: 1fr !important;
        gap: 20px !important;
    }
    
    /* 侧边栏隐藏或移到下方 */
    .article-detail-injected-content .sidebar {
        display: none !important;
    }
    
    /* === 识诈宣导页 === */
    .combat-fraud-injected-content .page-header {
        padding: 30px 15px !important;
        min-height: auto !important;
    }
    
    .combat-fraud-injected-content .page-header h1 {
        font-size: 24px !important;
    }
    
    .combat-fraud-injected-content .video-grid {
        grid-template-columns: 1fr !important;
        gap: 20px !important;
    }
    
    .combat-fraud-injected-content .video-item iframe {
        height: 200px !important;
    }
    
    .combat-fraud-injected-content .content-area {
        padding: 20px 15px 40px !important;
        margin-top: -15px !important;
    }
    
    /* 识诈宣导底部 */
    .combat-fraud-injected-content footer > div {
        padding: 0 15px !important;
    }
    
    .combat-fraud-injected-content footer > div > div {
        flex-direction: column !important;
        gap: 25px !important;
        align-items: center !important;
        text-align: center !important;
    }
    
    #combat-fraud-footer-qrcodes {
        flex-wrap: wrap !important;
        justify-content: center !important;
        gap: 12px !important;
    }
    
    #combat-fraud-footer-qrcodes > div {
        flex: 0 0 calc(50% - 8px) !important;
    }
    
    #combat-fraud-footer-qrcodes > div img {
        width: 70px !important;
        height: 70px !important;
    }
    
    #combat-fraud-footer-badges {
        flex-direction: row !important;
        gap: 15px !important;
    }
    
    /* === 查询平台页 === */
    .query-platform-injected-content .page-container {
        padding: 30px 15px !important;
        margin: 0 10px !important;
    }
    
    .query-platform-injected-content .search-form {
        flex-direction: column !important;
        gap: 10px !important;
    }
    
    .query-platform-injected-content .search-form input,
    .query-platform-injected-content .search-form select {
        width: 100% !important;
    }
    
    .query-platform-injected-content .search-form button {
        width: 100% !important;
    }
    
    /* === 报案须知页 === */
    .guideline-injected-content .page-header {
        padding: 25px 15px !important;
    }
    
    .guideline-injected-content .page-header h1 {
        font-size: 22px !important;
    }
    
    .guideline-injected-content .content-section {
        padding: 20px 15px !important;
    }
    
    .guideline-injected-content .content-wrapper {
        flex-direction: column !important;
        gap: 20px !important;
    }
    
    /* === 表格响应式 === */
    .home-injected-content table,
    .articles-injected-content table,
    .article-detail-injected-content table {
        display: block;
        overflow-x: auto;
        white-space: nowrap;
        max-width: 100%;
    }
    
    /* === 按钮响应式 === */
    .home-injected-content button,
    .articles-injected-content button,
    .article-detail-injected-content button {
        min-height: 44px; /* 触摸友好 */
    }
}

/* ========================================
   小屏手机适配 (max-width: 480px)
   ======================================== */
@media (max-width: 480px) {
    /* 首页 */
    .home-injected-content .carousel-item img {
        min-height: 180px;
    }
    
    .home-injected-content .news-card h3 {
        font-size: 14px !important;
    }
    
    .home-injected-content .news-card .date {
        font-size: 11px !important;
    }
    
    /* 二维码更紧凑 */
    #home-footer-qrcodes > div img,
    #combat-fraud-footer-qrcodes > div img {
        width: 60px !important;
        height: 60px !important;
    }
    
    #home-footer-qrcodes > div > div,
    #combat-fraud-footer-qrcodes > div > div {
        font-size: 10px !important;
    }
    
    /* 文章列表 */
    .articles-injected-content .page-header h1 {
        font-size: 20px !important;
    }
    
    .articles-injected-content .article-item .title {
        font-size: 14px !important;
    }
    
    /* 文章详情 */
    .article-detail-injected-content .page-header h1 {
        font-size: 18px !important;
    }
    
    .article-detail-injected-content .article-content {
        font-size: 14px !important;
        line-height: 1.7 !important;
    }
    
    /* 识诈宣导 */
    .combat-fraud-injected-content .page-header h1 {
        font-size: 20px !important;
    }
    
    .combat-fraud-injected-content .video-item iframe {
        height: 180px !important;
    }
    
    /* 底部信息区 */
    .home-injected-content footer h3,
    .combat-fraud-injected-content footer h3 {
        font-size: 14px !important;
    }
    
    .home-injected-content footer p,
    .combat-fraud-injected-content footer p {
        font-size: 12px !important;
    }
}

/* ========================================
   超小屏幕 (max-width: 360px)
   ======================================== */
@media (max-width: 360px) {
    .home-injected-content > div,
    .articles-injected-content > div,
    .article-detail-injected-content > div,
    .combat-fraud-injected-content > div {
        padding-left: 10px !important;
        padding-right: 10px !important;
    }
    
    /* 二维码单列显示 */
    #home-footer-qrcodes,
    #combat-fraud-footer-qrcodes {
        flex-direction: column !important;
        align-items: center !important;
    }
    
    #home-footer-qrcodes > div,
    #combat-fraud-footer-qrcodes > div {
        flex: 0 0 auto !important;
    }
    
    .home-injected-content .related-links-bar a {
        font-size: 12px !important;
        padding: 10px 12px !important;
    }
}

/* ========================================
   横屏模式
   ======================================== */
@media (max-width: 768px) and (orientation: landscape) {
    .home-injected-content .carousel-item img {
        min-height: 250px;
        max-height: 300px;
    }
    
    .combat-fraud-injected-content .video-item iframe {
        height: 250px !important;
    }
    
    /* 横屏时二维码水平排列 */
    #home-footer-qrcodes,
    #combat-fraud-footer-qrcodes {
        flex-wrap: nowrap !important;
    }
    
    #home-footer-qrcodes > div,
    #combat-fraud-footer-qrcodes > div {
        flex: 0 0 auto !important;
    }
}

/* ========================================
   通用内联样式覆盖 - 手机端
   确保内联样式的容器也能响应式
   ======================================== */
@media (max-width: 768px) {
    /* 覆盖所有1200px宽度容器 */
    [style*="max-width: 1200px"],
    [style*="max-width:1200px"] {
        max-width: 100% !important;
        padding-left: 15px !important;
        padding-right: 15px !important;
        box-sizing: border-box !important;
    }
    
    /* grid布局在手机上改为单列 */
    [style*="grid-template-columns: repeat(2"],
    [style*="grid-template-columns:repeat(2"] {
        grid-template-columns: 1fr !important;
    }
    
    [style*="grid-template-columns: 1fr auto auto"],
    [style*="grid-template-columns:1fr auto auto"] {
        grid-template-columns: 1fr !important;
    }
    
    /* flex布局自动换行 */
    [style*="display: flex"][style*="gap: 40px"],
    [style*="display:flex"][style*="gap:40px"],
    [style*="display: flex"][style*="gap: 30px"],
    [style*="display:flex"][style*="gap:30px"] {
        flex-wrap: wrap !important;
        gap: 20px !important;
    }
    
    /* 首页信息卡片 - 由inject-home.js内部样式控制 */
    /* 这里不覆盖，避免样式冲突 */
    
    /* 底部区域 */
    footer [style*="display: flex"][style*="justify-content: space-between"],
    footer [style*="display:flex"][style*="justify-content:space-between"] {
        flex-direction: column !important;
        align-items: center !important;
        text-align: center !important;
    }
    
    footer [style*="flex: 0 0 280px"],
    footer [style*="flex:0 0 280px"] {
        flex: 1 1 100% !important;
        width: 100% !important;
    }
    
    /* 底部二维码 */
    footer [style*="flex: 1"][style*="display: flex"][style*="gap: 30px"],
    footer [style*="flex:1"][style*="display:flex"][style*="gap:30px"] {
        width: 100% !important;
        justify-content: center !important;
    }
    
    /* 文章详情底部grid */
    [style*="display: grid"][style*="grid-template-columns: 1fr auto auto"] {
        display: flex !important;
        flex-direction: column !important;
        gap: 30px !important;
    }
    
    /* 相关链接栏 */
    .related-links-bar,
    [style*="display: flex"][style*="justify-content: center"][style*="gap: 8px"] {
        flex-direction: column !important;
        gap: 10px !important;
    }
    
    .related-links-bar span[style*="color: rgba(255,255,255,0.5)"] {
        display: none !important;
    }
    
    .related-links-bar a {
        padding: 12px 20px !important;
        background: rgba(255,255,255,0.1) !important;
        border-radius: 4px !important;
        text-align: center !important;
    }
}

@media (max-width: 480px) {
    /* 更小屏幕的额外调整 */
    [style*="max-width: 1200px"],
    [style*="max-width:1200px"] {
        padding-left: 10px !important;
        padding-right: 10px !important;
    }
    
    /* 首页信息卡片圆形图标 */
    .info-card-item [style*="width: 80px"][style*="height: 80px"][style*="border-radius: 50%"],
    .info-card-item [style*="width:80px"][style*="height:80px"][style*="border-radius:50%"] {
        width: 60px !important;
        height: 60px !important;
    }
    
    /* 标题栏高度 */
    .info-card-item [style*="height: 110px"],
    .info-card-item [style*="height:110px"] {
        height: auto !important;
        min-height: auto !important;
        max-height: none !important;
        padding: 30px 15px 15px !important;
    }
}


