/* ============================================================
 * 手机端强适配样式（用户侧页面共用）
 * 在 style_v3.css 之后引入；仅对小屏生效
 * ============================================================ */

/* 底部 Tab 导航（仅手机端显示） */
.mobile-tabbar { display: none; }

@media (max-width: 768px) {
    /* 防止横向溢出 */
    html, body { overflow-x: hidden !important; }
    img, video, canvas, svg, table { max-width: 100% !important; }
    table { height: auto !important; }

    /* 隐藏桌面侧边栏，主内容占满 */
    .sidebar { display: none !important; }
    .main-content { margin-left: 0 !important; }

    /* 顶栏精简 */
    .topbar { padding: 0 1rem !important; height: 56px !important; }
    .content-body { padding: 1rem !important; }

    /* 栅格全部改单列卡片 */
    .grid-2, .grid-4 { grid-template-columns: 1fr !important; }

    /* 步骤条压缩（适合拇指扫视） */
    .steps { gap: 0.25rem !important; }
    .step { min-width: 0; flex: 0 1 auto; }
    .step-number { width: 30px !important; height: 30px !important; font-size: 0.8rem !important; }
    .step-label { font-size: 0.7rem !important; white-space: normal !important; text-align: center; line-height: 1.2; }
    .step-line { max-width: 24px !important; min-width: 12px !important; margin-bottom: 1.25rem !important; }

    /* 上传区改手机端点选（不提示拖拽） */
    .upload-zone { padding: 2rem 1rem !important; }

    /* 大按钮、大触控区（拇指可达 44px） */
    .btn { min-height: 44px; }
    .btn-sm { min-height: 38px; }
    .speed-options { flex-direction: column !important; }

    /* 文件列表：长文件名截断、按钮不挤压 */
    .file-preview { flex-wrap: nowrap; gap: 0.5rem; }
    .file-preview-info { min-width: 0; flex: 1 1 auto; }
    .file-preview-name { max-width: 100%; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
    .file-preview .btn { flex: 0 0 auto; }

    /* 报告纸面更紧凑 */
    .report-container { margin: 8px auto !important; padding: 0 4px !important; }
    .report-paper { padding: 16px 12px !important; border-radius: 12px !important; }
    .report-title { font-size: 22px !important; }
    .report-subtitle { font-size: 13px !important; }
    .report-meta { font-size: 12px !important; }
    .section-header { font-size: 15px !important; }
    .rt-detailed, .findings-list, .alert-box { font-size: 14px; }

    /* 结果表格可横滚且不破版 */
    .table-scroll {
        display: block;
        max-width: 100%;
        overflow-x: auto;
        -webkit-overflow-scrolling: touch;
    }
    .table-scroll .data-table { min-width: 480px; }
    .data-table { font-size: 13px; }

    /* 筛选控件全宽 */
    .filter-bar .form-input,
    .filter-bar .form-select { width: 100% !important; min-width: 0 !important; }

    /* 报告卡片操作按钮换行 */
    .report-card { flex-wrap: wrap; }
    .report-actions { width: 100%; justify-content: flex-end; flex-wrap: wrap; gap: 0.5rem; }

    /* 底部留出 Tab 高度 + 安全区，避免遮挡内容 */
    body { padding-bottom: calc(64px + env(safe-area-inset-bottom, 0px)) !important; }

    /* 底部 Tab 导航 */
    .mobile-tabbar {
        display: flex;
        position: fixed;
        left: 0; right: 0; bottom: 0;
        height: calc(60px + env(safe-area-inset-bottom, 0px));
        background: #fff;
        border-top: 1px solid #e2e8f0;
        box-shadow: 0 -2px 12px rgba(0,0,0,0.06);
        z-index: 100;
        padding-bottom: env(safe-area-inset-bottom, 0);
    }
    .mobile-tabbar a {
        flex: 1;
        display: flex;
        flex-direction: column;
        align-items: center;
        justify-content: center;
        gap: 2px;
        font-size: 11px;
        color: #64748b;
        text-decoration: none;
        min-height: 44px;
    }
    .mobile-tabbar a.active { color: #2563eb; font-weight: 600; }
    .mobile-tabbar a svg { width: 22px; height: 22px; }
}


/* 分析页手机端修复：文件列表不顶破版、主按钮固定且不偏移 */
@media (max-width: 768px) {
    #batchFilesList { max-height: 34vh; overflow-y: auto; -webkit-overflow-scrolling: touch; }
    .analyze-actions {
        position: sticky;
        bottom: calc(64px + env(safe-area-inset-bottom, 0px));
        z-index: 70;
        display: flex;
        justify-content: stretch !important;
        padding: 0.6rem 0 calc(0.6rem + env(safe-area-inset-bottom, 0px));
        background: linear-gradient(180deg, rgba(248,250,252,0), #f8fafc 42%);
    }
    .analyze-actions .btn { width: 100%; justify-content: center; }
    .speed-options { gap: 0.5rem !important; }
    .speed-option { padding: 0.75rem !important; }
}


/* 手机端防右侧裁切：所有报告/上传文本强制换行，报告纸面不横向溢出 */
@media (max-width: 768px) {
    .content-body, .card, .card-body, .mdt-info, .upload-zone, .step-content { max-width: 100% !important; }
    .mdt-info, .mdt-info-desc, .upload-title, .upload-desc, .file-preview-name,
    .report-result, .report-result p, .report-result li, .report-result div,
    .report-result td, .report-result th, .disclaimer, .finding-title, .finding-desc {
        overflow-wrap: anywhere !important;
        word-break: break-word !important;
        white-space: normal !important;
    }
    .report-container { width: 100% !important; max-width: 100% !important; margin: 0 auto !important; padding: 0 !important; }
    .report-paper { width: 100% !important; max-width: 100% !important; overflow-x: hidden !important; }
    .section, .report-header, .report-footer { max-width: 100% !important; }
}


/* report=9 类长表格修复：内部表格可横滚，表头中文化后不挤压 */
@media (max-width: 768px) {
    .table-scroll { width: 100% !important; max-width: 100% !important; }
    .table-scroll .data-table { min-width: 520px; }
    .abnormal-table th, .abnormal-table td { white-space: normal !important; overflow-wrap: anywhere !important; }
    .rt-detailed { overflow-wrap: anywhere !important; word-break: break-word !important; }
    .rt-detailed table { display: block; max-width: 100% !important; overflow-x: auto; }
}


/* report=10 同类问题：手机端表格不再设置最小宽度，异常指标改卡片，报告纸面强制收敛到视口内 */
@media (max-width: 768px) {
    .report-result .report-container,
    .report-result .report-paper {
        max-width: calc(100vw - 20px) !important;
        margin-left: 0 !important;
        margin-right: 0 !important;
    }
    .report-result .section,
    .report-result .report-header,
    .report-result .disclaimer,
    .report-result .findings-list,
    .report-result .alert-box { max-width: 100% !important; }
    .findings-list li { padding-right: 14px !important; }
    .table-scroll .data-table { min-width: 0 !important; width: 100% !important; }
    .table-scroll .data-table th,
    .table-scroll .data-table td { white-space: normal !important; overflow-wrap: anywhere !important; }
    .abnormal-cards .finding-desc div { margin: 2px 0; }
}
