/* =============================================================
 * NexAI 共享手机端响应式
 * 分级断点：
 *   <=1180  侧栏抽屉 + 主体满宽（含平板）
 *   <=900   topbar 堆叠、6/5/4 列 → 2，3列→2
 *   <=640   小屏：全部多列 → 1，modal 底栏化、表格卡片化
 *   <=420   超小屏微调
 * ============================================================= */

body.nex-mobile-ready { --nex-mobile-side-gap: 14px; }

.nex-mobile-backdrop,
.nex-mobile-menu-btn { display: none; }

body.nex-mobile-ready.nex-mobile-active { display: block !important; overflow-x: hidden; }
body.nex-mobile-ready.nex-mobile-active.sidebar-open { overflow: hidden; }

body.nex-mobile-ready.nex-mobile-active .sidebar {
  width: min(84vw, 320px) !important;
  max-width: 320px;
  transform: translateX(-110%);
  transition: transform 0.28s ease;
  box-shadow: 0 24px 48px rgba(15, 23, 42, 0.34);
  z-index: 70 !important;
}
body.nex-mobile-ready.nex-mobile-active.sidebar-open .sidebar { transform: translateX(0); }

body.nex-mobile-ready.nex-mobile-active .nex-mobile-backdrop {
  position: fixed; inset: 0; border: 0;
  background: rgba(15, 23, 42, 0.52);
  opacity: 0; pointer-events: none;
  transition: opacity 0.28s ease;
  z-index: 65; display: block;
}
body.nex-mobile-ready.nex-mobile-active.sidebar-open .nex-mobile-backdrop {
  opacity: 1; pointer-events: auto;
}

body.nex-mobile-ready.nex-mobile-active .nex-mobile-menu-btn {
  position: fixed; top: 12px; left: 12px;
  width: 40px; height: 40px;
  display: inline-flex; align-items: center; justify-content: center;
  border: 0; border-radius: 12px;
  background: #0f172a; color: #fff;
  box-shadow: 0 8px 24px rgba(15, 23, 42, 0.24);
  z-index: 72;
}

/* 主体满宽（兼容显式 240px margin） */
body.nex-mobile-ready.nex-mobile-active .nex-mobile-main,
body.nex-mobile-ready.nex-mobile-active > .flex-1.flex.flex-col[style*="margin-left:240px"],
body.nex-mobile-ready.nex-mobile-active > .flex-1.flex.flex-col[style*="margin-left: 240px"] {
  width: 100% !important;
  min-width: 0;
  margin-left: 0 !important;
}

/* 顶栏 */
body.nex-mobile-ready.nex-mobile-active .nex-mobile-main > :first-child,
body.nex-mobile-ready.nex-mobile-active > .flex-1.flex.flex-col[style*="margin-left:240px"] > :first-child {
  padding: 12px 14px 12px 60px !important;
  gap: 10px;
  flex-wrap: wrap;
  align-items: center !important;
}
body.nex-mobile-ready.nex-mobile-active .nex-mobile-main > :first-child > :first-child,
body.nex-mobile-ready.nex-mobile-active > .flex-1.flex.flex-col[style*="margin-left:240px"] > :first-child > :first-child {
  min-width: 0; flex: 1 1 auto;
}
body.nex-mobile-ready.nex-mobile-active .nex-mobile-main > :first-child > :last-child,
body.nex-mobile-ready.nex-mobile-active > .flex-1.flex.flex-col[style*="margin-left:240px"] > :first-child > :last-child {
  display: flex; flex-wrap: wrap; gap: 8px;
}

body.nex-mobile-ready.nex-mobile-active .nex-mobile-content,
body.nex-mobile-ready.nex-mobile-active > .flex-1.flex.flex-col[style*="margin-left:240px"] > :nth-child(2) {
  padding: 14px !important;
}

/* 双栏分屏（agents/login）转单栏 */
body.nex-mobile-ready.nex-mobile-active .flex.flex-1.overflow-hidden {
  flex-direction: column !important;
  overflow: visible !important;
}
body.nex-mobile-ready.nex-mobile-active .flex.flex-1.overflow-hidden > .bg-white.border-r,
body.nex-mobile-ready.nex-mobile-active .flex.flex-1.overflow-hidden > div[style*="width:260px"],
body.nex-mobile-ready.nex-mobile-active .flex.flex-1.overflow-hidden > div[style*="width:240px"] {
  width: 100% !important;
  max-height: none !important;
  border-right: none !important;
  border-bottom: 1px solid #e2e8f0;
}
body.nex-mobile-ready.nex-mobile-active .flex.flex-1.overflow-hidden > .flex-1 {
  width: 100%; overflow: visible !important;
}
body.nex-mobile-ready.nex-mobile-active .min-h-screen.grid.lg\:grid-cols-2 { display: block !important; }
body.nex-mobile-ready.nex-mobile-active .min-h-screen.grid.lg\:grid-cols-2 > * { width: 100%; }

/* 标签条横向滚动 */
body.nex-mobile-ready.nex-mobile-active .flex.gap-2.bg-white.rounded-xl.p-1\.5.w-fit,
body.nex-mobile-ready.nex-mobile-active .flex.gap-2.bg-white.rounded-xl.p-1\.5.w-fit.shadow-sm,
body.nex-mobile-ready.nex-mobile-active .card.p-2.flex.gap-2.flex-wrap.w-fit,
body.nex-mobile-ready.nex-mobile-active .flex.gap-1.bg-slate-100.p-1\.5.rounded-2xl.overflow-x-auto {
  width: 100% !important;
  max-width: 100% !important;
  overflow-x: auto !important;
  white-space: nowrap;
  flex-wrap: nowrap !important;
  justify-content: flex-start;
  -webkit-overflow-scrolling: touch;
  scrollbar-width: thin;
}
body.nex-mobile-ready.nex-mobile-active .flex.gap-2.bg-white.rounded-xl.p-1\.5.w-fit > *,
body.nex-mobile-ready.nex-mobile-active .flex.gap-2.bg-white.rounded-xl.p-1\.5.w-fit.shadow-sm > *,
body.nex-mobile-ready.nex-mobile-active .card.p-2.flex.gap-2.flex-wrap.w-fit > * { flex: 0 0 auto; }

body.nex-mobile-ready.nex-mobile-active img,
body.nex-mobile-ready.nex-mobile-active canvas { max-width: 100%; height: auto; }

body.nex-mobile-ready.nex-mobile-active input,
body.nex-mobile-ready.nex-mobile-active select,
body.nex-mobile-ready.nex-mobile-active textarea { max-width: 100%; }

body.nex-mobile-ready.nex-mobile-active #toast-container { left: 12px; right: 12px; top: 12px; }
body.nex-mobile-ready.nex-mobile-active .toast { min-width: 0; max-width: none; width: 100%; }

/* ============ <=1180 平板 ============ */
@media (max-width: 1180px) {
  body.nex-mobile-ready.nex-mobile-active .grid.grid-cols-6 { grid-template-columns: repeat(3, minmax(0,1fr)) !important; }
  body.nex-mobile-ready.nex-mobile-active .grid.grid-cols-5 { grid-template-columns: repeat(3, minmax(0,1fr)) !important; }
  body.nex-mobile-ready.nex-mobile-active .grid.grid-cols-4 { grid-template-columns: repeat(2, minmax(0,1fr)) !important; }
  body.nex-mobile-ready.nex-mobile-active .grid.grid-cols-3 { grid-template-columns: repeat(2, minmax(0,1fr)) !important; }
  body.nex-mobile-ready.nex-mobile-active .grid.grid-cols-2 { grid-template-columns: repeat(2, minmax(0,1fr)) !important; }
  body.nex-mobile-ready.nex-mobile-active .table-wrap,
  body.nex-mobile-ready.nex-mobile-active .overflow-x-auto { overflow-x: auto !important; -webkit-overflow-scrolling: touch; }
}

/* ============ <=900 小平板 / 横屏手机 ============ */
@media (max-width: 900px) {
  html { font-size: 16px !important; }

  body.nex-mobile-ready.nex-mobile-active .grid.grid-cols-6,
  body.nex-mobile-ready.nex-mobile-active .grid.grid-cols-5,
  body.nex-mobile-ready.nex-mobile-active .grid.grid-cols-4,
  body.nex-mobile-ready.nex-mobile-active .grid.grid-cols-3 { grid-template-columns: repeat(2, minmax(0,1fr)) !important; }

  body.nex-mobile-ready.nex-mobile-active [class*="col-span-"] { grid-column: span 1 / span 1 !important; }

  body.nex-mobile-ready.nex-mobile-active .nex-mobile-main > :first-child > :last-child,
  body.nex-mobile-ready.nex-mobile-active > .flex-1.flex.flex-col[style*="margin-left:240px"] > :first-child > :last-child { width: 100%; }

  body.nex-mobile-ready.nex-mobile-active .text-3xl { font-size: 1.5rem !important; line-height: 1.25 !important; }
  body.nex-mobile-ready.nex-mobile-active .text-2xl { font-size: 1.25rem !important; line-height: 1.3 !important; }
  body.nex-mobile-ready.nex-mobile-active .text-xl { font-size: 1.1rem !important; }

  body.nex-mobile-ready.nex-mobile-active .ml-auto { margin-left: 0 !important; }

  body.nex-mobile-ready.nex-mobile-active .card,
  body.nex-mobile-ready.nex-mobile-active .stat-card { padding: 16px; }
  body.nex-mobile-ready.nex-mobile-active .p-6 { padding: 16px !important; }
  body.nex-mobile-ready.nex-mobile-active .p-5 { padding: 14px !important; }
}

/* ============ <=640 手机 ============ */
@media (max-width: 640px) {
  body.nex-mobile-ready.nex-mobile-active .grid.grid-cols-6,
  body.nex-mobile-ready.nex-mobile-active .grid.grid-cols-5,
  body.nex-mobile-ready.nex-mobile-active .grid.grid-cols-4,
  body.nex-mobile-ready.nex-mobile-active .grid.grid-cols-3,
  body.nex-mobile-ready.nex-mobile-active .grid.grid-cols-2 { grid-template-columns: minmax(0,1fr) !important; }

  body.nex-mobile-ready.nex-mobile-active .nex-mobile-main > :first-child > :first-child,
  body.nex-mobile-ready.nex-mobile-active > .flex-1.flex.flex-col[style*="margin-left:240px"] > :first-child > :first-child { width: 100%; }
  body.nex-mobile-ready.nex-mobile-active .nex-mobile-main > :first-child > :last-child > *,
  body.nex-mobile-ready.nex-mobile-active > .flex-1.flex.flex-col[style*="margin-left:240px"] > :first-child > :last-child > * { flex: 1 1 calc(50% - 8px); min-width: 0; }

  body.nex-mobile-ready.nex-mobile-active .sticky.top-0 { position: relative !important; top: auto !important; }

  body.nex-mobile-ready.nex-mobile-active .flex.items-center.justify-between,
  body.nex-mobile-ready.nex-mobile-active .flex.justify-between.items-center { flex-wrap: wrap; gap: 8px; }

  /* 弹窗：底部抽屉 */
  body.nex-mobile-ready.nex-mobile-active .modal { align-items: flex-end; padding: 0; }
  body.nex-mobile-ready.nex-mobile-active .modal > div,
  body.nex-mobile-ready.nex-mobile-active .modal > .modal-panel {
    width: 100% !important;
    min-width: 0 !important;
    max-width: 100% !important;
    max-height: 92vh;
    overflow-y: auto;
    margin: 0 !important;
    border-radius: 20px 20px 0 0 !important;
    box-shadow: 0 -16px 40px rgba(15, 23, 42, 0.22);
  }

  /* 全屏业务页 */
  body.nex-mobile-ready.nex-mobile-active .cust-page.open,
  body.nex-mobile-ready.nex-mobile-active .quote-page.open,
  body.nex-mobile-ready.nex-mobile-active .order-page.open,
  body.nex-mobile-ready.nex-mobile-active .compare-page.open { padding: 0; overflow-x: hidden; }
  body.nex-mobile-ready.nex-mobile-active .cust-page.open > div,
  body.nex-mobile-ready.nex-mobile-active .quote-page.open > div,
  body.nex-mobile-ready.nex-mobile-active .order-page.open > div,
  body.nex-mobile-ready.nex-mobile-active .compare-page.open > div {
    min-height: 100vh;
    border-radius: 0 !important;
    padding: 14px !important;
  }

  /* 表格卡片化（仅小屏） */
  body.nex-mobile-ready.nex-mobile-active table.nex-mobile-table-card,
  body.nex-mobile-ready.nex-mobile-active .nex-mobile-table-card table { display: block; white-space: normal; overflow: visible; }
  body.nex-mobile-ready.nex-mobile-active table.nex-mobile-table-card thead,
  body.nex-mobile-ready.nex-mobile-active .nex-mobile-table-card thead { display: none; }
  body.nex-mobile-ready.nex-mobile-active table.nex-mobile-table-card tbody,
  body.nex-mobile-ready.nex-mobile-active table.nex-mobile-table-card tr,
  body.nex-mobile-ready.nex-mobile-active .nex-mobile-table-card tbody,
  body.nex-mobile-ready.nex-mobile-active .nex-mobile-table-card tr { display: block; width: 100%; }
  body.nex-mobile-ready.nex-mobile-active table.nex-mobile-table-card tr,
  body.nex-mobile-ready.nex-mobile-active .nex-mobile-table-card tr {
    background: #fff;
    border: 1px solid #e2e8f0;
    border-radius: 14px;
    padding: 10px 12px;
    margin-bottom: 10px;
    box-shadow: 0 6px 18px rgba(15, 23, 42, 0.05);
  }
  body.nex-mobile-ready.nex-mobile-active table.nex-mobile-table-card td,
  body.nex-mobile-ready.nex-mobile-active .nex-mobile-table-card td {
    display: flex; justify-content: space-between; align-items: flex-start;
    gap: 10px; width: 100%;
    padding: 6px 0 !important; border: 0 !important;
    text-align: right !important;
  }
  body.nex-mobile-ready.nex-mobile-active table.nex-mobile-table-card td::before,
  body.nex-mobile-ready.nex-mobile-active .nex-mobile-table-card td::before {
    content: attr(data-th);
    flex: 0 0 38%;
    text-align: left;
    color: #64748b;
    font-size: 12px; line-height: 1.4; font-weight: 600;
  }
  body.nex-mobile-ready.nex-mobile-active table.nex-mobile-table-card td[data-th=""]::before,
  body.nex-mobile-ready.nex-mobile-active .nex-mobile-table-card td[data-th=""]::before { display: none; }
  body.nex-mobile-ready.nex-mobile-active table.nex-mobile-table-card td[data-th=""],
  body.nex-mobile-ready.nex-mobile-active .nex-mobile-table-card td[data-th=""] { justify-content: flex-end; }
  body.nex-mobile-ready.nex-mobile-active table.nex-mobile-table-card td > *,
  body.nex-mobile-ready.nex-mobile-active .nex-mobile-table-card td > * { max-width: 60%; margin-left: auto; }
  body.nex-mobile-ready.nex-mobile-active table.nex-mobile-table-card td img,
  body.nex-mobile-ready.nex-mobile-active .nex-mobile-table-card td img { max-width: 64px; border-radius: 10px; }

  body.nex-mobile-ready.nex-mobile-active table:not(.nex-mobile-table-card) {
    display: block; width: 100%;
    overflow-x: auto; white-space: nowrap;
    -webkit-overflow-scrolling: touch;
  }

  body.nex-mobile-ready.nex-mobile-active .text-3xl { font-size: 1.4rem !important; }
  body.nex-mobile-ready.nex-mobile-active .text-2xl { font-size: 1.15rem !important; }
  body.nex-mobile-ready.nex-mobile-active .text-xl { font-size: 1.05rem !important; }

  body.nex-mobile-ready.nex-mobile-active .w-14 { width: 3rem !important; }
  body.nex-mobile-ready.nex-mobile-active .h-14 { height: 3rem !important; }
  body.nex-mobile-ready.nex-mobile-active .w-12 { width: 2.5rem !important; }
  body.nex-mobile-ready.nex-mobile-active .h-12 { height: 2.5rem !important; }

  body.nex-mobile-ready.nex-mobile-active .lang-bar { padding: 8px 10px; flex-wrap: wrap; }
}

/* ============ <=420 超小屏 ============ */
@media (max-width: 420px) {
  body.nex-mobile-ready.nex-mobile-active .nex-mobile-content,
  body.nex-mobile-ready.nex-mobile-active > .flex-1.flex.flex-col[style*="margin-left:240px"] > :nth-child(2) { padding: 12px !important; }
  body.nex-mobile-ready.nex-mobile-active .card,
  body.nex-mobile-ready.nex-mobile-active .stat-card { padding: 14px; }
  body.nex-mobile-ready.nex-mobile-active .p-6 { padding: 12px !important; }
  body.nex-mobile-ready.nex-mobile-active .p-5 { padding: 12px !important; }
  body.nex-mobile-ready.nex-mobile-active .p-4 { padding: 12px !important; }
  body.nex-mobile-ready.nex-mobile-active .nex-mobile-main > :first-child > :last-child > *,
  body.nex-mobile-ready.nex-mobile-active > .flex-1.flex.flex-col[style*="margin-left:240px"] > :first-child > :last-child > * { flex: 1 1 100%; }
}