/* ============================================================
   AIModelHub 手机端适配层（注入式，不动原产物）
   策略：<768px 时侧边栏抽屉化 + 顶栏汉堡按钮 + 表格横滚 + 间距压缩
   ============================================================ */

/* ---- 1. 汉堡按钮（JS 注入到 header） ---- */
.gw-hamburger {
  display: none;
  width: 38px; height: 38px;
  margin-left: -6px;
  border: none; border-radius: 10px;
  background: transparent;
  cursor: pointer;
  align-items: center; justify-content: center;
  color: #475569;
  flex: none;
}
.gw-hamburger svg { width: 22px; height: 22px; }
.gw-hamburger:active { background: #f1f5f9; }

/* ---- 2. 遮罩 ---- */
.gw-scrim {
  display: none;
  position: fixed; inset: 0;
  background: rgba(15, 23, 42, .45);
  z-index: 30;
  opacity: 0;
  transition: opacity .25s ease;
}
.gw-scrim.gw-show { opacity: 1; }

@media (max-width: 767px) {
  /* ---- 3. 侧边栏抽屉化 ---- */
  aside.fixed {
    transform: translateX(-100%);
    transition: transform .28s cubic-bezier(.4, 0, .2, 1);
    box-shadow: none;
    width: 260px !important;
  }
  aside.fixed.gw-open { transform: translateX(0); box-shadow: 0 8px 40px rgba(0,0,0,.25); }

  /* ---- 4. 顶栏：左侧让位汉堡，压缩内边距 ---- */
  header.fixed {
    left: 0 !important;
    padding: 0 10px 0 8px !important;
    height: 60px !important;
  }
  header.fixed > div:first-child { min-width: 0; }
  .gw-hamburger { display: inline-flex; }

  /* 顶栏文字溢出处理（“企业 AI 首页”/额度） */
  header.fixed span, header.fixed div {
    max-width: 100%;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
  }

  /* ---- 5. 主内容区：贴边不留白 ---- */
  main.flex-1 {
    padding: 14px 12px 24px !important;
    padding-top: 74px !important;
  }

  /* ---- 6. 表格横滚（所有列表页通用） ---- */
  main .overflow-x-auto { -webkit-overflow-scrolling: touch; }
  main table { min-width: 640px; }
  main table th, main table td {
    white-space: nowrap;
    padding: 10px 10px !important;
  }

  /* ---- 7. 页头操作行（标题+按钮）换行 ---- */
  main > div > div.flex { flex-wrap: wrap; gap: 8px; }
  main h1 { font-size: 1.25rem !important; }

  /* ---- 8. 卡片网格（仪表盘统计卡）单列 ---- */
  main .grid { grid-template-columns: repeat(2, minmax(0, 1fr)) !important; gap: 10px !important; }
  main .grid > div { padding: 12px !important; }

  /* ---- 9. 弹窗/抽屉表单适配 ---- */
  [role="dialog"], .fixed.inset-0 {
    padding: 0 !important;
    align-items: flex-end !important;
  }
  [role="dialog"] > div {
    max-width: 100% !important;
    width: 100% !important;
    max-height: 88vh !important;
    border-radius: 16px 16px 0 0 !important;
    margin: 0 !important;
  }

  /* ---- 10. 分页条换行 ---- */
  main .flex.items-center.justify-between { flex-wrap: wrap; gap: 8px; justify-content: center !important; }

  /* ---- 11. 登录页 ---- */
  .min-h-screen { min-height: 100dvh; }
  form .input { font-size: 16px !important; } /* 防 iOS 聚焦缩放 */

  /* ---- 12. 模型广场卡片 ---- */
  main .grid.grid-cols-2, main .grid.grid-cols-3 { grid-template-columns: 1fr !important; }
}
