/* ===============================================
   iPad Safari 完整修复方案
   修复所有已知的 iPad Safari 布局差异
   =============================================== */

/* 1. 防止文本自动缩放（iPad Safari 默认会放大文本） */
html {
  -webkit-text-size-adjust: 100% !important;
  text-size-adjust: 100% !important;
}

/* 2. 防止任何水平溢出 */
html, body {
  overflow-x: hidden !important;
  width: 100% !important;
  max-width: 100vw !important;
}
html, body, #root {
  width: 100% !important;
  max-width: 100vw !important;
}
body { margin: 0 !important; }

/* 3. 全屏容器：iOS 12 用 JS 注入的 --app-height（精确排除工具栏），
   iOS 15.4+ 用 100dvh，其他用 100vh 后备 */
[class*=min-h-][class*=dvh] {
  min-height: 100vh !important;
  min-height: var(--app-height, 100vh) !important;
}
[class*=min-h-screen] {
  min-height: 100vh !important;
  min-height: var(--app-height, 100vh) !important;
}
html, body, #root {
  min-height: 100vh !important;
  min-height: var(--app-height, 100vh) !important;
}
@supports (height: 100dvh) {
  html, body, #root,
  [class*=min-h-][class*=dvh],
  [class*=min-h-screen] {
    min-height: 100dvh !important;
  }
}

/* 4. 容器宽度保护 - 防止任何元素撑出父容器（仅作用于类选择器，不干扰元素布局） */
.max-w-7xl, .max-w-5xl, .max-w-3xl, .max-w-2xl,
.w-full {
  max-width: 100vw !important;
  box-sizing: border-box !important;
}

/* 5. iPad 竖屏(768-1023px)优化网格 */
@media (width >= 768px) and (width < 1024px) {
  .md\:grid-cols-3 {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  }
}

/* 6. 所有图片/媒体不突破容器 */
img, video, svg, canvas, picture, iframe {
  max-width: 100% !important;
  height: auto !important;
}