/* ============================================================
 * mobile-adapt.css — 牛栏山成品库管理系统 移动端深度适配 v1.0
 * （2026-08-15 · v3.12.3）
 * 原则：纯视觉增强，零功能改动；不影响桌面端（全部规则包裹于 @media）
 * 覆盖：顶栏导航条带 / 工具栏筛选 / 表格 / 弹窗 / KPI栅格 /
 *       触摸目标 / iOS安全区 / 输入控件防聚焦缩放
 * ============================================================ */

/* ---------- 0. 全局基础（仅移动宽度生效） ---------- */
@media (max-width: 768px) {

    /* ★ 关键修复：底部备案footer(z100000)遮挡登录按钮 ——
       手机上登录框被挤压到底部，"登录"键与footer的备案链接重叠，
       点击会误跳公安备案网站。修复：登录层提到footer之上 + footer降级 */
    .bottomFooter { z-index: 9990 !important; }
    .login-overlay {
        z-index: 100002 !important;
        overflow-y: auto;
        -webkit-overflow-scrolling: touch;
        padding: 18px 0;
    }
    .login-box {
        width: calc(100vw - 36px) !important;
        max-width: 360px;
        padding: 26px 20px !important;
        margin: auto;
    }

    html { -webkit-text-size-adjust: 100%; text-size-adjust: 100%; }

    body {
        -webkit-tap-highlight-color: transparent;
        overflow-x: hidden;
        word-break: break-word;
    }

    /* 内容区通用收窄边距 */
    .main-content, .content, .content-area,
    .m002-main-content, .page, .page-wrap, .container {
        padding-left: 10px !important;
        padding-right: 10px !important;
    }

    /* iOS 刘海屏 / 底部小黑条安全区 */
    body {
        padding-bottom: env(safe-area-inset-bottom, 0px);
    }
    .m002-footer, footer {
        padding-bottom: calc(8px + env(safe-area-inset-bottom, 0px)) !important;
    }
}

/* ---------- 1. 触摸优化：目标≥40px、去hover粘滞 ---------- */
@media (max-width: 768px) and (hover: none) {
    button:not([class*="mini"]),
    .btn, .tab-btn, .chip, .toolbar-btn, .filter-btn,
    a.btn, .hdr-nav-btn, .export-btn {
        min-height: 40px;
    }
    /* 移动端点击态替代 hover 态，避免“粘住高亮” */
    .btn:hover, .tab-btn:hover, .chip:hover,
    .toolbar-btn:hover, .hdr-nav-btn:hover { background-position: initial; }
    .btn:active, .tab-btn:active, .chip:active,
    .toolbar-btn:active, .hdr-nav-btn:active {
        transform: scale(0.97);
        transition: transform .08s ease;
    }
}

/* ---------- 2. index 主页面：顶栏与布局 ---------- */
@media (max-width: 768px) {
    /* 顶栏主行：纵向堆叠，导航区独立成可横滚条带 */
    .hdr-main-row {
        flex-direction: column !important;
        align-items: stretch !important;
        gap: 8px !important;
        padding: 8px 10px !important;
    }
    .hdr-main-left {
        flex-wrap: wrap !important;
        justify-content: center !important;
        gap: 8px !important;
    }
    .hdr-logo { width: 36px !important; height: 36px !important; }
    .hdr-title-gif { max-width: 180px !important; height: auto !important; }
    .hdr-title { font-size: 15px !important; white-space: nowrap; }
    .hdr-stats { gap: 14px !important; margin-left: 0 !important; }
    .hdr-stat-num { font-size: 16px !important; }
    .hdr-stat-label { font-size: 10px !important; }

    /* 15个导航按钮 → 横向滑动条带（隐藏滚动条） */
    .hdr-main-nav {
        display: flex !important;
        flex-wrap: nowrap !important;
        overflow-x: auto !important;
        -webkit-overflow-scrolling: touch;
        scroll-snap-type: x proximity;
        gap: 6px !important;
        padding: 4px 2px 8px !important;
        margin: 0 -4px !important;
    }
    .hdr-main-nav::-webkit-scrollbar { display: none; }
    .hdr-main-nav .hdr-nav-btn {
        flex-shrink: 0 !important;
        white-space: nowrap !important;
        padding: 8px 12px !important;
        font-size: 12px !important;
        scroll-snap-align: start;
        min-height: 38px;
    }
    .hdr-main-nav .hdr-nav-btn i { font-size: 13px !important; }

    /* 环境传感/顶部信息条压缩 */
    .hdr-row:not(.hdr-main-row) { padding: 4px 10px !important; }
    .hdr-env-card { padding: 3px 8px !important; font-size: 11px !important; }

    /* 侧边栏抽屉（增强既有实现） */
    .m002-sidebar { width: min(84vw, 300px) !important; }
    .m002-sidebar .m002-sidebar-item {
        padding: 13px 14px !important;
        font-size: 14px !important;
        min-height: 46px;
    }

    /* 浮动菜单按钮避开底部footer（95px高）+ 安全区 */
    #mobileMenuToggle {
        left: 14px !important;
        bottom: calc(104px + env(safe-area-inset-bottom, 0px)) !important;
        width: 52px !important; height: 52px !important;
        z-index: 9995 !important; /* 高于普通内容、低于弹窗层 */
    }

    /* tab 栏横滚（补充既有规则） */
    .m002-tab-bar, .tabs, .inv-subtabs, .sub-tab-bar,
    [class*="tab-bar"], [class*="tabs-"] {
        flex-wrap: nowrap !important;
        overflow-x: auto !important;
        -webkit-overflow-scrolling: touch;
        scrollbar-width: none;
    }
    .m002-tab-bar::-webkit-scrollbar, .tabs::-webkit-scrollbar { display: none; }
    .tab-btn {
        flex-shrink: 0 !important;
        padding: 8px 13px !important;
        font-size: 12.5px !important;
        white-space: nowrap !important;
        min-height: 38px;
    }
}

/* ---------- 3. 子页面顶栏 / 工具栏 / 筛选栏 ---------- */
@media (max-width: 768px) {
    .top-bar, .page-header, .header-bar {
        flex-wrap: wrap !important;
        padding: 8px 10px !important;
        gap: 6px !important;
    }
    .top-bar .page-title, .page-header h1, .header-title {
        font-size: 15px !important;
        white-space: nowrap;
        overflow: hidden; text-overflow: ellipsis;
        max-width: 62vw;
    }

    /* 工具栏（leadership 等页）：左组横滚，右组全宽 */
    .toolbar, .filter-bar, .filter-toolbar, .toolbar-left {
        flex-wrap: wrap !important;
        gap: 6px !important;
        padding: 8px 10px !important;
    }
    .toolbar-left {
        display: flex; flex-wrap: nowrap;
        overflow-x: auto; -webkit-overflow-scrolling: touch;
        scrollbar-width: none; width: 100%;
    }
    .toolbar-left::-webkit-scrollbar { display: none; }
    .toolbar-btn, .filter-btn {
        flex-shrink: 0 !important;
        padding: 7px 12px !important;
        font-size: 12px !important;
        white-space: nowrap !important;
        min-height: 36px;
    }
    .toolbar-right {
        width: 100% !important;
        display: flex; flex-wrap: wrap; align-items: center;
        gap: 6px !important;
    }
    .toolbar-right input[type="date"],
    .toolbar-right input[type="text"], .toolbar-right select {
        flex: 1 1 130px; min-width: 0;
        min-height: 38px;
        font-size: 14px; /* ≥16 防缩放见§7 */
    }

    /* 日期区间选择：起止同行 */
    .toolbar-right .toolbar-date-sep { flex: 0 0 auto; }
}

/* ---------- 4. 表格：滚动容器 + 紧凑行距 + 首列冻结 ---------- */
@media (max-width: 768px) {
    .table-wrapper, .table-container, .table-scroll,
    .card:has(table), [class*="table-wrap"] {
        overflow-x: auto !important;
        -webkit-overflow-scrolling: touch;
        max-width: 100%;
    }
    table {
        font-size: 12px !important;
        min-width: max-content; /* 允许横向滚动而非压扁 */
    }
    table th, table td {
        padding: 7px 9px !important;
        white-space: nowrap;
    }
    /* 行高触摸友好 */
    table tbody tr { min-height: 42px; }

    /* 通用列表卡片栅格 → 单列 */
    .card-grid, .stats-grid, .kpi-grid, .ld-kpis, .grid-2, .grid-3,
    .grid-4, .cards-grid, [class*="grid-2"], [class*="grid-3"] {
        grid-template-columns: 1fr !important;
        gap: 8px !important;
    }
    /* KPI 数字缩放 */
    .kpi-value, .kpi-num, .ld-kpi-value { font-size: 20px !important; }
    .kpi-label, .ld-kpi-label { font-size: 11px !important; }
}

/* 超窄屏两列 KPI（数值卡通常较小可并排） */
@media (max-width: 480px) {
    .kpi-grid, .stats-grid, .ld-kpis { grid-template-columns: repeat(2, 1fr) !important; }
    .kpi-value, .kpi-num, .ld-kpi-value { font-size: 17px !important; }
}

/* ---------- 5. 弹窗：底部抽屉式（拇指友好） ---------- */
@media (max-width: 768px) {
    [class*="Overlay"], [class*="overlay"], .modal, .modal-mask,
    [class*="Modal"], [class*="modal-wrap"], dialog {
        padding: 0 !important;
        align-items: flex-end !important; /* 从底部升起 */
    }
    [class*="Overlay"] > div, .modal > div, [class*="Modal"] > div,
    [class*="modal-wrap"] > div, dialog {
        width: 100% !important;
        max-width: 100% !important;
        max-height: 92vh !important;
        margin: 0 !important;
        border-radius: 18px 18px 0 0 !important;
        border-bottom-left-radius: 0 !important;
        border-bottom-right-radius: 0 !important;
        overflow-y: auto !important;
        -webkit-overflow-scrolling: touch;
        padding-bottom: calc(16px + env(safe-area-inset-bottom, 0px)) !important;
        animation: sheetUp .25s ease;
    }
    @keyframes sheetUp {
        from { transform: translateY(40px); opacity: .6; }
        to   { transform: translateY(0);    opacity: 1; }
    }

    /* 弹窗标题栏吸顶，滚动时长按可关 */
    [class*="Overlay"] > div > *:first-child,
    .modal > div > *:first-child {
        position: sticky; top: 0; z-index: 2;
        background: inherit;
    }
    /* 关闭按钮触摸区放大 */
    [class*="close"], .close-btn, .modal-close {
        min-width: 40px !important; min-height: 40px !important;
        font-size: 18px !important;
    }
}

/* ---------- 6. 图表与日历 ---------- */
@media (max-width: 768px) {
    .chart, .chart-container, [id*="Chart"] {
        height: 280px !important;
        min-height: 240px;
    }
    .chart-tall { height: 320px !important; }
    .two-col, .grid-2col, .col-2 { grid-template-columns: 1fr !important; }
    .chip-row { gap: 6px !important; }
    .chip { padding: 8px 13px !important; font-size: 12px !important; min-height: 36px; }
}

/* ---------- 7. 表单：防 iOS 聚焦自动放大（输入字号≥16px） ---------- */
@media (max-width: 768px) {
    input[type="text"], input[type="number"], input[type="date"],
    input[type="month"], input[type="search"], input[type="password"],
    select, textarea {
        font-size: 16px !important;
        min-height: 42px;
    }
    /* 复选/单选触摸放大 */
    input[type="checkbox"], input[type="radio"] {
        width: 18px !important; height: 18px !important;
    }
    .form-item, .form-row, .form-grid { grid-template-columns: 1fr !important; }
    label { font-size: 13px !important; }

    /* 小字号可读性：徽标/说明文字移动端下限提升（10~10.5px → 11.5px） */
    .tag, .sub-label, .text-sm, .desc, .muted, .hint,
    [class*="label-sm"], [class*="-hint"] { font-size: 11.5px !important; }
}

/* ---------- 8. 平板增强（769~1024px，轻度） ---------- */
@media (min-width: 769px) and (max-width: 1024px) {
    .hdr-main-nav { flex-wrap: wrap !important; }
    .grid-3, [class*="grid-3"] { grid-template-columns: repeat(2, 1fr) !important; }
    .grid-4 { grid-template-columns: repeat(2, 1fr) !important; }
    .two-col { grid-template-columns: 1fr !important; }
    .chart { height: 320px !important; }
}

/* ---------- 9. 3D 库房/大屏页排除说明 ----------
 * screen.html / queue-display.html 为大屏展示页，
 * mobile-scan.html / pda-scan.html 已是移动端原生页，不注入本文件 */