/* ============ iBlue Smart — 移动端增强（在所有页面样式之后加载） ============ */

/* ---------- 基础：防止横向滚动、提升可读性 ---------- */
html, body { overflow-x: hidden; }
body { -webkit-text-size-adjust: 100%; }
img, video, table { max-width: 100%; }

/* ---------- 移动模式下的全局调整 ---------- */
html.is-mobile body { font-size: 17px; line-height: 1.75; }

/* 点击区域 ≥44px、输入框 ≥16px（iOS 不会自动放大） */
html.is-mobile .btn,
html.is-mobile button,
html.is-mobile .qty-input button { min-height: 48px; padding-left: 18px; padding-right: 18px; }
html.is-mobile input,
html.is-mobile select,
html.is-mobile textarea { font-size: 16px; min-height: 48px; }

/* ---------- 单列与间距 ---------- */
@media (max-width: 768px) {
  .container { padding: 0 14px; }
  .product-grid { grid-template-columns: 1fr !important; gap: 14px; }
  .footer-grid, .contact-grid, .about-grid, .service-grid,
  .stats-grid, .why-grid { grid-template-columns: 1fr !important; }
  section { padding: 40px 0 !important; }
  h1 { font-size: 26px !important; line-height: 1.3 !important; }
  h2 { font-size: 21px !important; }
  h3 { font-size: 18px !important; }
  .hero { min-height: auto !important; padding: 70px 0 40px !important; }
  .hero h1 { font-size: 28px !important; }
  /* 表格改为可横向滚动，避免挤爆布局 */
  .spec-table, table { display: block; overflow-x: auto; white-space: nowrap; }
  /* 顶部导航横向滚动，不换行 */
  .main-nav { overflow-x: auto; -webkit-overflow-scrolling: touch; flex-wrap: nowrap !important; }
  .main-nav a, .main-nav button { white-space: nowrap; }
  /* 图片高度自适应 */
  .p-img img { height: auto !important; aspect-ratio: 4 / 3; object-fit: contain; }
}

/* ---------- 移动端底部导航栏 ---------- */
.mobile-tabbar {
  display: none;
  position: fixed; left: 0; right: 0; bottom: 0; z-index: 999;
  background: #fff; border-top: 1px solid var(--line, #e3e9f0);
  padding-bottom: env(safe-area-inset-bottom);
  box-shadow: 0 -2px 16px rgba(11, 58, 107, .08);
}
html.is-mobile .mobile-tabbar { display: flex; }
.mobile-tabbar a {
  flex: 1; display: flex; flex-direction: column; align-items: center; justify-content: center;
  gap: 3px; min-height: 58px; font-size: 11px; color: var(--muted, #5a6b7d); padding: 6px 2px;
}
.mobile-tabbar a.active { color: var(--blue-bright, #29abe2); }
.mobile-tabbar a svg { width: 22px; height: 22px; fill: currentColor; }
/* 有底栏时页面留出空间，避免内容被遮住 */
html.is-mobile body { padding-bottom: 72px; }

/* ---------- 移动端悬浮询价按钮 ---------- */
.mobile-cta {
  display: none; position: fixed; right: 14px; bottom: 84px; z-index: 998;
  width: 54px; height: 54px; border-radius: 50%;
  background: var(--gold, #e8a33d); color: #fff;
  align-items: center; justify-content: center; box-shadow: 0 6px 18px rgba(0,0,0,.18);
}
html.is-mobile .mobile-cta { display: flex; }
.mobile-cta svg { width: 24px; height: 24px; fill: currentColor; }

/* ---------- 版本切换提示条 ---------- */
.mode-switch {
  position: fixed; left: 12px; bottom: 84px; z-index: 997;
  background: rgba(11,58,107,.9); color: #fff; font-size: 12px;
  padding: 6px 12px; border-radius: 999px; display: none;
}
html.is-mobile .mode-switch { display: block; }
@media (max-width: 480px) {
  html.is-mobile body { font-size: 16px; }
  .mobile-tabbar a { font-size: 10px; }
}
