/**
 * h5-adaptive.css —— 全设备适配热补丁（2026-09-14）
 * 覆盖范围：
 *   1. iOS 刘海屏/灵动岛/刘海安全区（env(safe-area-inset-*)），同时兼容安卓挖孔屏
 *   2. iPad / 折叠屏宽屏断点（768px / 1024px），头部与按钮锁定尺寸防放大变形
 *   3. 深色模式跟随系统（页面级背景/文字）
 *   4. ProMotion 120Hz 渲染优化 + 系统字体放大防护
 * 前提：index.html 的 viewport 已含 viewport-fit=cover（已存在）
 * 说明：本文件直接补丁编译产物；源码工程已同步修改（wt-header.vue / adaptive.scss / safe-area.js），
 *       下次用 HBuilderX 重新编译后本文件可保留（选择器一致，不冲突）。
 */

/* ================= 1. 安全区适配（优先级高于编译产物里的内联样式） ================= */

/* 顶部状态栏 / 刘海 / 灵动岛：头部高度 = 安全区顶部 + 44px 内容区
   普通浏览器 env()=0 时高度仍为 44px，观感与原来完全一致；
   全屏 PWA / 添加到主屏幕 / App WebView 内自动抬高，按钮不被遮挡 */
.header-box {
  height: calc(env(safe-area-inset-top, 0px) + 44px) !important;
  padding-top: env(safe-area-inset-top, 0px) !important;
  /* 注意：原生 CSS 不支持 rpx，基础内边距按 375px 视口下 30rpx≈15px 换算并与安全区相加 */
  padding-right: calc(15px + env(safe-area-inset-right, 0px)) !important;
  box-sizing: border-box !important;
}

/* 头部占位元素同步抬高，防止页面内容钻到头部底下 */
.space {
  height: calc(env(safe-area-inset-top, 0px) + 44px) !important;
  padding-top: env(safe-area-inset-top, 0px) !important;
  box-sizing: border-box !important;
}

/* 左侧抽屉导航：从安全区下方开始展开 */
.draw-wrap {
  top: env(safe-area-inset-top, 0px) !important;
}

/* 底部操作条 / Home Indicator 留白（iOS 全面屏、安卓手势条通用） */
.uni-tabbar,
.uni-tabbar-bottom,
tabbar,
.uni-page-footer,
.tabbar-safe {
  padding-bottom: constant(safe-area-inset-bottom);
  padding-bottom: env(safe-area-inset-bottom) !important;
  box-sizing: border-box !important;
}

/* 横屏时右侧圆角裁切防护（按钮不被手机圆角切掉） */
.right1 {
  margin-right: max(0px, env(safe-area-inset-right, 0px));
  line-height: 1.2;
  white-space: nowrap;
}

/* ================= 2. ProMotion 120Hz 渲染优化 =================
   动画只走 transform/opacity 合成层，减少掉帧 */
.draw-wrap,
.shadow,
.uni-popup,
.uni-mask {
  will-change: transform, opacity;
  backface-visibility: hidden;
}

.uni-scroll-view,
.uni-scrollbar {
  -webkit-overflow-scrolling: touch;
}

/* ================= 3. 系统字体放大防护（安卓字体 110%~200% 不撑爆布局） ================= */
.text-wrap {
  word-break: break-word;
  overflow-wrap: anywhere;
}
.header-box .title,
.header-box .right1 {
  overflow: visible;
}

/* ================= 4. 宽屏断点：iPad / 折叠屏展开 / 横屏 ================= */

@media screen and (min-width: 768px) {
  /* --- 头部与按钮锁定 px 尺寸：rpx 在大屏等比放大导致按钮巨大化，这里固定 --- */
  .header-box .img {
    width: 26px !important;
    height: 26px !important;
  }
  .header-box .title {
    font-size: 19px !important;
  }
  .header-box .right1 {
    height: 44px !important;
    padding: 0 20px !important;
    font-size: 15px !important;
    border-radius: 22px !important;
  }
  .header-box .right .img {
    width: 26px !important;
    height: 26px !important;
    margin-left: 18px !important;
  }
  .draw-wrap {
    width: 300px !important;
  }

  /* --- 内容区限宽居中，防止 21:9 / iPad 全屏拉伸变形 ---
     选择器必须与 h5-fullscreen-layout.css 的
     "uni-page-body > .container, uni-page-body > uni-view.container"(特异性更高) 对齐，
     否则 !important 同权重下按特异性比较会输，限宽不生效（二次验证实测发现）。
     若某页面视觉异常，注释掉 .container/.containers 一组即可快速回退。 */
  uni-page-body > .container,
  uni-page-body > uni-view.container,
  .container,
  .containers,
  uni-page-body > .containers {
    max-width: 720px !important;
    margin-left: auto !important;
    margin-right: auto !important;
  }
  /* fixed 头部与居中内容对齐 */
  .header-box {
    max-width: 720px !important;
    left: 50% !important;
    transform: translateX(-50%) !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
  }
}

@media screen and (min-width: 1024px) {
  uni-page-body > .container,
  uni-page-body > uni-view.container,
  .container,
  .containers,
  uni-page-body > .containers {
    max-width: 1100px !important;
  }
  .header-box {
    max-width: 1100px !important;
  }
}

/* ================= 5. 深色模式（已迁移） =================
   2026-10-26 美式主题改造：深色/白天/跟随系统三主题统一由
   h5-theme-us.css 以 html[data-theme="dark|light"] 驱动（原
   @media (prefers-color-scheme: dark) 段已整体迁出并重写为美式
   深蓝配色，避免与强制白天模式冲突）。本文件仅保留安全区/断点/性能段。 */