/* ============================================================
   工作台（smart-procurement）移动端适配层
   加载方式：由后端 after_request 自动注入到所有 HTML 页面
   作用域：仅 ≤1024px / ≤720px / ≤480px 生效，桌面端不变
   ============================================================ */

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

@media (max-width: 1024px) {
  /* 取消原有的“小屏缩字号”，手机端保持可读 */
  html { font-size: 15px; }
  html { overflow-x: hidden; }
  body { overflow-x: hidden; }
  img, svg, video, canvas { max-width: 100%; }
  iframe { max-width: 100%; }

  .page,
  .page-container { max-width: 100%; padding: 12px; }
  .card, .repo-card, .login-card { padding: 14px; }
  .section-head { font-size: 16px; padding: 12px 14px; }
  .section-title { font-size: 16px; }
  .section-body { padding: 12px; }

  /* 弹窗 */
  .modal-overlay { padding: 12px; align-items: flex-start; }
  .modal { width: calc(100% - 24px); max-width: 100%; padding: 16px; max-height: 88vh; }
  .modal-actions { flex-wrap: wrap; }
  .modal-actions > * { flex: 1 1 auto; }

  /* 提示条 */
  .toast-container { left: 12px; right: 12px; top: 12px; }
  .toast { max-width: none; }

  /* 宽表：由 mobile.js 自动加 .mob-table-wrap 外壳，横向滚动不破版 */
  .mob-table-wrap { width: 100%; overflow-x: auto; -webkit-overflow-scrolling: touch; }
  .mob-table-wrap.mob-table-wide > table { min-width: 560px; }
  thead th { position: static; }
  table { font-size: 0.9rem; }
  thead th { padding: 10px 12px; }
  tbody td { padding: 10px 12px; }

  /* 手机端卡片化表格（由 mobile.js 自动打标） */
  table.mob-cardified { display: block; min-width: 0 !important; width: 100%; border: 0; }
  table.mob-cardified thead { display: none; }
  table.mob-cardified tbody { display: block; }
  table.mob-cardified tr {
    display: block;
    background: var(--surface, #fff);
    border: 1px solid var(--border);
    border-radius: 8px;
    margin-bottom: 10px;
    padding: 10px 12px;
  }
  table.mob-cardified tbody tr:nth-child(even) td { background: transparent; }
  table.mob-cardified td {
    display: flex; align-items: flex-start; gap: 8px;
    width: auto !important; max-width: none !important;
    padding: 3px 0 !important; border: 0;
    font-size: 14px; line-height: 1.6; text-align: left !important;
    white-space: normal !important; word-break: break-word;
  }
  table.mob-cardified td::before {
    content: attr(data-label) "：";
    flex: 0 0 5.2em;
    color: var(--text-muted, #6B8A7E);
    font-size: 13px;
  }
  table.mob-cardified td[data-label=""]::before { content: ""; flex: 0 0 0; }
  table.mob-cardified td:last-child { margin-top: 6px; flex-wrap: wrap; }
  /* 卡片内所有内容允许换行，避免内联 nowrap 撑破手机屏 */
  table.mob-cardified td,
  table.mob-cardified td * {
    white-space: normal !important;
    overflow-wrap: anywhere;
    word-break: break-word;
    max-width: 100%;
  }

  /* 分页条：手机端换行显示 */
  .pagination, .pager-actions, .pager { flex-wrap: wrap !important; gap: 8px; }

  /* 法规库（Tailwind 工具类布局）：顶部栏换行、侧栏与内容纵向堆叠 */
  body.h-screen { height: auto !important; min-height: 100vh; overflow: auto !important; }
  div.h-16 { height: auto !important; flex-wrap: wrap; padding: 8px 12px !important; gap: 8px; }
  div.h-16 > div:first-child,
  div.h-16 .w-80 { width: auto !important; max-width: 100%; }
  div.h-16 .flex-1 { flex: 1 1 100%; max-width: 100% !important; padding: 0 !important; }
  div.flex-1.flex.overflow-hidden { flex-direction: column !important; overflow: auto !important; }

  /* 表单：小屏一行一列 */
  .form-row { grid-template-columns: 1fr; gap: 6px; }

  /* 左右分栏工作区 */
  .layout-sidebar { flex-direction: column; }
  .file-pool-panel { width: 100% !important; border-left: 0; border-top: 1px solid var(--border); }
}

@media (max-width: 720px) {
  /* 输入控件用 16px，避免 iOS 聚焦自动放大 */
  input, select, textarea,
  .form-input, .form-select, .form-control { font-size: 16px; }
  input[type="checkbox"], input[type="radio"] { min-height: 0; }

  /* 触控目标加大（图标按钮除外） */
  button:not(.btn-icon):not(.sidebar-toggle):not(.tab-close):not(.close),
  .btn:not(.btn-icon),
  .btn-view, .refresh-btn, .btn-outline, .btn-secondary, .btn-mini { min-height: 40px; }
  .btn-icon { min-width: 40px; min-height: 40px; }

  /* 顶部栏（index.html 应用外壳） */
  .topbar { padding: 0 10px; }
  .topbar-brand { margin-right: 8px; padding-right: 10px; font-size: 0.95rem; }
  .topbar-nav { display: none; }
  .topbar-user { display: none; }
  .topbar-btn { padding: 6px 12px; font-size: 0.85rem; }

  /* 侧边栏改为抽屉 + 遮罩（index.html） */
  .app-body { position: relative; }
  .sidebar {
    position: fixed; top: var(--topbar-h); left: 0; bottom: 0;
    width: min(82vw, 320px) !important; z-index: 400;
    box-shadow: 0 12px 32px rgba(0, 0, 0, .22);
    transition: transform .22s ease;
  }
  .sidebar.collapsed { width: min(82vw, 320px) !important; transform: translateX(-100%); box-shadow: none; }
  .mob-backdrop {
    position: fixed; inset: var(--topbar-h) 0 0 0; z-index: 300;
    background: rgba(15, 42, 35, .38);
    opacity: 0; pointer-events: none; transition: opacity .22s ease;
  }
  .mob-backdrop.show { opacity: 1; pointer-events: auto; }

  /* 固定宽度侧栏/面板统一铺满 */
  .cal-sidebar { width: 100% !important; border-right: 0; border-bottom: 1px solid var(--border); }
  .calendar-layout { flex-direction: column !important; height: auto !important; }
  .file-pool-panel { width: 100% !important; }

  /* 底部操作条 */
  .sticky-action-bar { padding: 10px 0 0; gap: 8px; }
  .sticky-action-bar > * { flex: 1 1 auto; }

  /* 标签栏横向滚动，不换行挤压 */
  .tabs, .nav-tabs, .tab-bar { overflow-x: auto; -webkit-overflow-scrolling: touch; flex-wrap: nowrap !important; }
  .tabs > *, .nav-tabs > *, .tab-bar > * { flex: 0 0 auto; }

  /* 页面主标题与统计信息：手机端纵向排列，避免被挤压成竖排文字 */
  .page > h1,
  .page > h2,
  .page > .header { flex-direction: column !important; align-items: flex-start !important; gap: 6px; }
  .page > h2 > span:last-child { font-size: 13px !important; line-height: 1.9; }
  .page .header { flex-wrap: wrap; gap: 8px; }
  .page .header .title { flex: 1 1 100%; }

  /* 顶部标签按钮（信息数据库等）：手机端整行排列 */
  .top-tab-row { flex-wrap: wrap !important; }
  .top-tab-row .top-tab-btn { flex: 1 1 100%; justify-content: flex-start; }
  .toolbar, .filter-bar { flex-wrap: wrap !important; }
  .toolbar .search-box, .filter-bar .search-box { flex: 1 1 100%; }

  /* 卡片内表格/代码块 */
  .card, .section, .section-body { overflow-x: auto; }
}

@media (max-width: 480px) {
  .page, .page-container { padding: 10px; }
  .card, .repo-card, .login-card { padding: 12px; }
  .section-body { padding: 10px; }
  h1 { font-size: 1.45rem; }
  h2 { font-size: 1.25rem; }
}