/* CAIE 移动端 H5 共享基础样式 · 单一来源
 *
 * 统一断点系统：1024px / 768px / 480px
 * 所有页面通用：Footer响应式、触摸目标、safe-area、WebView修复
 * 每页引入：<link rel="stylesheet" href="assets/caie-mobile.css">
 */

/* ========== 全局移动端基础 ========== */
html { -webkit-text-size-adjust: 100%; }
body { overscroll-behavior: none; }
* { -webkit-tap-highlight-color: transparent; }
img, button, a { -webkit-touch-callout: none; }

/* 横向滚动防护 — 仅移动端，且不设在 html 上以免影响PC端纵向滚动 */
@media (max-width: 768px) {
  body { overflow-x: hidden; max-width: 100vw; }
}

/* ========== 触摸目标最小尺寸 ========== */
@media (max-width: 768px) {
  button, [role="button"],
  .btn, .pd-cta, .level-cta, .pr-btn,
  .iv-btn-primary, .iv-btn-secondary,
  .caie-sticky-bar-btn, .share-btn {
    min-height: 44px;
  }
}

/* ========== Footer 移动端隐藏 ========== */
@media (max-width: 768px) {
  footer.footer { display: none; }
}

/* ========== Safe-Area 处理 ========== */
@supports (padding: max(0px)) {
  footer.footer .footer_main {
    padding-bottom: max(24px, env(safe-area-inset-bottom));
  }
  body.caie-has-sticky {
    padding-bottom: calc(64px + env(safe-area-inset-bottom));
  }
}

/* ========== Modal 弹窗移动端适配 ========== */
@media (max-width: 768px) {
  .modal-overlay .modal,
  .ceping-qr-modal,
  .learning-qr-modal,
  .community-qr-modal,
  .iv-qr-modal,
  .sl-qr-modal {
    width: calc(100% - 32px);
    max-height: 85vh;
    overflow-y: auto;
    -webkit-overflow-scrolling: touch;
  }
}

/* ========== body 滚动锁定（配合 JS 使用） ========== */
body.caie-body-locked {
  overflow: hidden !important;
  position: fixed;
  width: 100%;
  top: 0;
  left: 0;
}