/* 罗湖西数据看板 · 全站手机端共享样式（2026-10-17） */
@media (max-width: 768px) {
  html, body { width: 100%; overflow-x: hidden !important; }
  body { -webkit-text-size-adjust: 100%; }

  /* 页面容器与抬头 */
  .container { max-width: none !important; padding: 12px 12px 28px !important; }
  .header { padding: 10px 12px !important; gap: 8px !important; flex-wrap: wrap !important; }
  .header h1 { font-size: 16px !important; }
  .header-right { margin-left: auto; }
  .page-head { margin-bottom: 10px !important; }
  .page-head h2 { font-size: 18px !important; }
  .page-head p { padding-left: 0 !important; font-size: 12px !important; }
  .group-title { font-size: 15px !important; margin: 14px 0 8px !important; }

  /* 首页 KPI 网格：手机两列 */
  .grid { grid-template-columns: repeat(2, minmax(0, 1fr)) !important; gap: 8px !important; }
  .kpi { padding: 12px !important; }
  .kpi .kl { font-size: 11px !important; }
  .kpi .kv { font-size: 20px !important; }
  .kpi .km { font-size: 10px !important; }

  /* 看板 KPI */
  .kpi-row { grid-template-columns: repeat(2, minmax(0, 1fr)) !important; gap: 8px !important; }
  .kpi-row .kpi-card { flex: 0 0 calc(50% - 8px) !important; min-width: 0 !important; box-sizing: border-box; }
  .kpi-card { padding: 12px 14px !important; }
  .kpi-card .value { font-size: 28px !important; }
  .chart-grid { grid-template-columns: 1fr !important; }
  .chart-box { height: 300px !important; }
  .card-grid { grid-template-columns: 1fr !important; }
  .sec, .panel-title { font-size: 15px !important; }

  /* 筛选/工具条换行 */
  .filters, .toolbar, .filter-bar, .bar, .date-bar, .dd-bar, .m-bar { flex-wrap: wrap !important; gap: 8px !important; }
  input, select, textarea, .btn, button { font-size: 14px; }
  .btn, button { min-height: 38px; }

  /* 表格容器：卡片模式下不再限制高度 */
  .table-wrap, .tw { max-height: none !important; overflow: visible !important; }

  /* 表格 -> 卡片（由 mobile.js 加 m-card 类） */
  table.m-card { border: 0 !important; width: 100% !important; }
  table.m-card thead { display: none !important; }
  table.m-card tbody, table.m-card tr, table.m-card td { display: block !important; width: 100% !important; }
  table.m-card tr { background: #fff; border: 1px solid #eef0f3; border-radius: 12px; margin: 8px 0; padding: 10px 12px; box-shadow: 0 1px 6px rgba(0,0,0,.05); }
  table.m-card td { display: flex !important; justify-content: space-between; align-items: flex-start; gap: 12px; padding: 6px 0 !important; border: 0 !important; white-space: normal !important; text-align: right !important; position: static !important; }
  table.m-card td::before { content: attr(data-label); color: #999; font-size: 12px; font-weight: 600; text-align: left; flex: 0 0 42%; }
  table.m-card tr.m-group { background: #fffbe6; border-color: #f5e6a8; }
  table.m-card tr.m-group td { display: block !important; text-align: left !important; font-weight: 700; color: #7a5b00; }
  table.m-card tr.m-group td::before { content: ''; display: none; }
  table.m-card td[colspan] { display: block !important; text-align: left !important; }
  table.m-card td[colspan]::before { content: ''; display: none; }

  /* 宽表/透视表：保留横向滚动 */
  .table-wrap.m-wide-wrap, .tw.m-wide-wrap { overflow-x: auto !important; overflow-y: visible !important; max-height: none !important; -webkit-overflow-scrolling: touch; }
  .table-wrap.m-wide-wrap table, .tw.m-wide-wrap table { min-width: 700px; }

  /* 独立页面的左侧菜单：变成抽屉 */
  #appSidebar { top: 56px !important; bottom: 0 !important; width: 250px !important; max-width: 82vw; transform: translateX(-102%) !important; transition: transform .25s ease !important; z-index: 9992 !important; }
  #appSidebar.open { transform: translateX(0) !important; }
  #appSidebar.collapsed { width: 250px !important; }
  #appSidebar.collapsed .app-text { display: flex !important; }
  #appSidebar.collapsed .app-sub { display: flex !important; }
  #appSidebar.collapsed .app-group.collapsed .app-sub { display: none !important; }
  #appSidebar.collapsed .app-item { justify-content: flex-start !important; padding: 8px 10px !important; }
  #appSidebar.collapsed .app-cat { justify-content: flex-start !important; padding: 9px 12px !important; }
  #appSidebar .app-toggle { display: none !important; }
  body.m-has-apptopbar { margin-left: 0 !important; padding-top: 56px !important; }
  .m-sidebar-backdrop { position: fixed; inset: 0; background: rgba(0,0,0,.45); z-index: 9991; display: none; }
  .m-sidebar-backdrop.show { display: block; }
  .m-menu-btn { position: fixed; left: 10px; top: 64px; z-index: 9993; width: 42px; height: 40px; border: 1px solid #e4e6ea; border-radius: 10px; background: rgba(255,255,255,.96); box-shadow: 0 2px 8px rgba(0,0,0,.12); font-size: 20px; color: #333; }
  .app-topbar .m-menu-btn { position: absolute; right: 10px; left: auto; top: 50%; transform: translateY(-50%); width: 40px; height: 34px; }

  /* 看板快捷分类（概览/图表/明细） */
  .m-tabs { position: sticky; top: 0; z-index: 80; display: flex; gap: 6px; background: rgba(244,245,247,.97); padding: 8px 12px; margin: 0 -12px 8px; border-bottom: 1px solid #e4e6ea; }
  .m-tabs button { flex: 0 0 auto; border: 1px solid #e4e6ea; background: #fff; border-radius: 999px; padding: 6px 14px; font-size: 13px; color: #555; }
  .m-tabs button.on { background: #f5c400; border-color: #f5c400; color: #3d2a00; font-weight: 700; }
  .kpi-row, .kpi-grid, .kpi-cards, .chart-grid, .chart-panel, .chart-card, .table-panel, .table-wrap, .tw, table { scroll-margin-top: 56px; }
}