/* ============================================================
   OAS 移动端覆盖（最后加载，只影响 ≤768px）
   原则：不改桌面端；表格默认横向滚动，只有显式 .mobile-card-table 才卡片化
   ============================================================ */
@media (max-width: 768px) {
    /* 顶栏固定 52px，和 #pageFrame 的高度公式对齐；刘海安全区在下方单独补 */
    :root { --topbar-height: 52px; }

    .topbar { gap: 8px; padding: 0 10px; overflow: hidden; }
    .topbar .page-title {
        flex: 1 1 auto;
        min-width: 0;
        font-size: 15px;
        white-space: nowrap;
        overflow: hidden;
        text-overflow: ellipsis;
    }
    .topbar .topbar-right { gap: 6px; flex-shrink: 0; }
    .topbar .user-info { padding: 4px 6px; }
    .topbar .user-role { display: none; }

    /* 通知面板：固定在屏幕内，不再从铃铛右侧出屏 */
    .notification-panel {
        position: fixed;
        left: 10px;
        right: 10px;
        width: auto;
        top: calc(var(--topbar-height) + 6px);
        max-height: 70dvh;
    }

    /* iframe 高度：与顶栏一致（安全区在 @supports 里补） */
    #pageFrame { height: calc(100dvh - var(--topbar-height)); }

    /* 侧边栏抽屉：占屏 84%，tab 面板自适应 */
    .sidebar { width: min(84vw, 320px) !important; }
    .tab-panel { width: auto; flex: 1 1 auto; min-width: 0; }
    .sidebar-overlay { background: rgba(15, 23, 42, .45); }

    /* 表格：默认恢复为表格 + 横向滚动（不再全站卡片化） */
    table.data-table:not(.mobile-card-table) { display: table; min-width: max-content; }
    table.data-table:not(.mobile-card-table) thead { display: table-header-group; }
    table.data-table:not(.mobile-card-table) tbody { display: table-row-group; }
    table.data-table:not(.mobile-card-table) tr { display: table-row; }
    table.data-table:not(.mobile-card-table) th,
    table.data-table:not(.mobile-card-table) td {
        display: table-cell;
        width: auto !important;
        white-space: nowrap;
        padding: 8px 10px;
    }
    table.data-table:not(.mobile-card-table) td::before { content: none; }

    .table-wrapper, .card-body, .oa-panel-body { overflow-x: auto; -webkit-overflow-scrolling: touch; }
    .st-table { min-width: 640px; }
    .settlement-preview { padding: 14px 12px; overflow-x: auto; }

    /* 页内 Tab：横向滚动，不换行 */
    .tabs {
        padding: 0 10px;
        overflow-x: auto;
        flex-wrap: nowrap;
        scrollbar-width: none;
    }
    .tabs::-webkit-scrollbar { display: none; }
    .tab { padding: 10px 12px; font-size: 12.5px; white-space: nowrap; }

    /* 内容页留白与触控 */
    body.embed-body { padding: 12px; }
    .card-body { padding: 14px !important; }
    .btn { min-height: 38px; padding: 8px 12px; font-size: 13px; }

    /* 16px 防 iOS 聚焦缩放 */
    .form-control, .oa-inp, .oa-form-inline input, .oa-form-inline select,
    .oa-toolbar select, .form-inline-input {
        font-size: 16px;
        min-height: 38px;
    }
    .form-row, .oa-grid-2, .ar-region-row { grid-template-columns: minmax(0, 1fr); }
    .form-row-inline { flex-wrap: wrap; gap: 10px; }
    .form-row-inline .form-group { flex: 1 1 140px; min-width: 0; }

    /* 公告 / 消息列表：标题与元信息分两行，不再把“阅读/时间”挤成竖排 */
    .oa-notice-row { flex-direction: column; align-items: stretch; gap: 6px; }
    .oa-notice-title { display: flex; flex-wrap: wrap; align-items: center; gap: 6px; }
    .oa-notice-meta { flex-wrap: wrap; gap: 6px 10px; flex-shrink: 1; }
    .oa-notice-meta .muted { white-space: nowrap; }
    .oa-notice-meta .oa-inline-form { display: inline-flex; margin: 0; }
    .oa-panel-head { flex-wrap: wrap; gap: 6px; }
    .oa-form-grid { grid-template-columns: 1fr !important; }

    /* 登录页 */
    .login-page { padding: 16px; align-items: center; padding-top: 0; }
    .login-card { padding: 22px 16px; max-width: 100%; }
    .login-card .form-control { font-size: 16px; }
    .login-card .logo { width: 48px; height: 48px; font-size: 20px; margin-bottom: 16px; }
    .login-card h2 { font-size: 18px; }
    .wechat-qr-box { min-height: 0; }
}

/* 刘海屏：顶栏加安全区，iframe 同步减去 */
@supports (padding: env(safe-area-inset-top)) {
    @media (max-width: 768px) {
        :root { --topbar-height: calc(52px + env(safe-area-inset-top)); }
        .topbar { height: calc(52px + env(safe-area-inset-top)); }
        #pageFrame { height: calc(100dvh - 52px - env(safe-area-inset-top)); }
    }
}

/* 窄屏（iPhone SE / 小屏安卓）：行内表单改单列，覆盖模板里的固定像素宽 */
@media (max-width: 419px) {
    .form-row-inline .form-group { flex: 1 1 100%; }
    .form-row-inline .form-inline-input { width: 100% !important; }
}