/* ============================================================
 * mobile.css — PC 站点手机端最快适配覆盖层（仅 <=768px 生效）
 * 只做"能看能用"：防横向溢出、单列化、表格横滑、后台组件兜底
 * PC 端不受任何影响。回滚：删除 HTML 中的 <link mobile.css>
 * ============================================================ */
@media (max-width: 768px) {
  html, body {
    width: 100% !important;
    max-width: 100% !important;
    overflow-x: hidden !important;
    -webkit-text-size-adjust: 100%;
    font-size: 15px;
  }

  *, *::before, *::after {
    box-sizing: border-box;
  }

  /* 媒体与宽元素不撑破屏幕 */
  img, video, svg, canvas, iframe, embed, object {
    max-width: 100% !important;
    height: auto;
  }

  /* 宽表格 / 代码 / 预格式化：内部横向滚动 */
  pre, code, xmp {
    max-width: 100%;
    white-space: pre-wrap;
    word-break: break-word;
  }
  table {
    max-width: 100% !important;
    display: block;
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
  }
  /* 但 ant 表格用自身滚动容器，避免双重滚动 */
  .ant-table-wrapper,
  .ant-table-content,
  .vxe-table--render-default {
    overflow-x: auto !important;
    -webkit-overflow-scrolling: touch;
  }
  .ant-table-wrapper table,
  .ant-table-content table {
    display: table;
  }

  /* 常见定宽容器限宽 */
  .container, .wrapper, .layout, .main, .content, .page,
  .app-container, .page-container, .app-wrapper,
  main, section, article, header, footer, nav {
    width: 100% !important;
    max-width: 100% !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
    padding-left: 12px !important;
    padding-right: 12px !important;
  }

  /* 通用多列 flex 行：常见导航/工具栏/卡片行 -> 单列 */
  .row, .flex, .flex-row, .toolbar, .toolbar-left,
  .header-right, .nav, .navbar, .menu,
  .card-list, .list, .grid-list, .items {
    flex-direction: column !important;
    align-items: stretch !important;
    gap: 8px !important;
  }

  /* 通用 grid 多列 -> 单列 */
  .grid, .grid-cols-2, .grid-cols-3, .grid-cols-4,
  [class*="col-"] {
    display: block !important;
    width: 100% !important;
    max-width: 100% !important;
  }

  /* ---------- ant-design-vue / vben 后台兜底 ---------- */
  /* 侧边栏不再悬浮挤压，改为页首块 */
  .ant-layout {
    flex-direction: column !important;
  }
  .ant-layout-sider,
  .vben-layout__sider,
  .vben-sider {
    position: static !important;
    width: 100% !important;
    max-width: 100% !important;
    min-width: 0 !important;
    flex: none !important;
  }
  .ant-layout-sider-children {
    height: auto !important;
    max-height: 40vh;
    overflow-y: auto;
  }
  .ant-layout-content,
  .vben-layout__content {
    margin: 0 !important;
    padding: 10px !important;
  }
  .ant-layout-header,
  .vben-layout__header {
    height: auto !important;
    min-height: 48px;
    line-height: 1.4 !important;
    padding: 0 10px !important;
    flex-wrap: wrap;
    gap: 8px;
  }

  /* 查询表单：label 与控件各占一行 */
  .ant-form-horizontal .ant-form-item,
  .ant-form .ant-row {
    flex-direction: column;
    align-items: stretch !important;
  }
  .ant-form-item-label,
  .ant-form-item-control {
    width: 100% !important;
    max-width: 100% !important;
    text-align: left !important;
  }
  .ant-form-item-control-input-content {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
  }
  .ant-form-item-control-input-content .ant-select,
  .ant-form-item-control-input-content .ant-picker,
  .ant-input,
  .ant-input-number,
  .ant-select {
    width: 100% !important;
    max-width: 100% !important;
  }

  /* 弹窗 / 抽屉 / 确认框 满屏宽 */
  .ant-modal,
  .ant-modal-content {
    max-width: calc(100vw - 16px) !important;
    margin: 8px auto !important;
  }
  .ant-drawer-content-wrapper {
    width: 92vw !important;
    max-width: 92vw !important;
  }
  .ant-modal-body {
    max-height: 60vh;
    overflow-y: auto;
  }

  /* 分页器换行不溢出 */
  .ant-pagination {
    flex-wrap: wrap;
    gap: 4px;
  }

  /* 标签/描述列表防溢出 */
  .ant-tabs-nav {
    max-width: 100%;
  }
  .ant-tabs-nav-list {
    max-width: 100%;
    overflow-x: auto;
  }
  .ant-descriptions-view {
    overflow-x: auto;
  }

  /* ---------- 通用按钮 / 链接可点性 ---------- */
  button, .btn, a.button, input[type="button"], input[type="submit"] {
    min-height: 36px;
    max-width: 100%;
    white-space: normal;
  }
  a, .link {
    word-break: break-all;
  }

  /* 超长文本换行 */
  p, span, div, td, th, li, label, h1, h2, h3, h4, h5, h6 {
    overflow-wrap: break-word;
    word-break: break-word;
  }
  h1 { font-size: clamp(20px, 6vw, 28px); }
  h2 { font-size: clamp(18px, 5vw, 24px); }
  h3 { font-size: clamp(16px, 4.5vw, 20px); }

  /* position:fixed 宽条限宽，避免 left/right 同时定值时溢出 */
  .fixed, .sticky, [style*="position: fixed"], [style*="position:fixed"] {
    max-width: 100vw;
  }
}