/**
 * 背景视频层叠 SSOT（华为 / 荣耀 / MagicOS / 鸿蒙 WebView）
 *
 * 踩坑：
 * - 2026-07 · MagicOS 10 / 骁龙 8 Gen2 折叠屏 vs 一代 MagicOS 9：
 *   对 <video> 使用 transform/translateZ 会把原生视频层抬到正文之上（一代机可能仍正常）
 * - z-index:-1 同样会盖住正文
 * - 2026-08 · 荣耀 V5 折叠屏：仅清 video 不够，**容器**上的 translateZ(0) 也会抬原生层
 *
 * 正确做法：容器与 video 均为 z-index:0 且不做 transform；遮罩/正文 translate3d + 更高 z-index
 */

/* —— 区块内 hero（OPC / AI+ 总览）—— */
.opc-hero-media,
.hero-media {
  position: absolute !important;
  inset: 0 !important;
  z-index: 0 !important;
  overflow: hidden !important;
  pointer-events: none !important;
  -webkit-transform: none !important;
  transform: none !important;
}

/* —— 全屏 fixed 背景（录入 / 财神详情 / 答疑等）—— */
.video-background-container,
.zx-bg-video-stage {
  position: fixed !important;
  top: 0 !important;
  left: 0 !important;
  width: 100% !important;
  height: 100% !important;
  z-index: 0 !important;
  overflow: hidden !important;
  pointer-events: none !important;
  /* 荣耀 V5 / MagicOS 二代：容器禁止合成层抬升 */
  -webkit-transform: none !important;
  transform: none !important;
  will-change: auto !important;
  -webkit-backface-visibility: visible !important;
  backface-visibility: visible !important;
}

/* 贴牌首页 stage：层叠加固；居中用 margin，禁止 transform/translateZ（荣耀 V5） */
.fd-video-stage {
  z-index: 0 !important;
  pointer-events: none !important;
  overflow: hidden !important;
  -webkit-transform: none !important;
  transform: none !important;
  will-change: auto !important;
}

.video-background-container video,
.zx-bg-video-stage video,
.opc-hero-media video,
.hero-media video,
.fd-video-stage .fd-video,
.fd-video-stage video,
video.video-background,
video.caishen-background-video,
#video-background,
#backgroundVideo,
#bg-video,
#opcHeroVid,
#hero-video {
  position: absolute !important;
  inset: 0 !important;
  width: 100% !important;
  height: 100% !important;
  object-fit: cover !important;
  z-index: 0 !important;
  pointer-events: none !important;
  /* MagicOS 10 / 荣耀 V5：禁止给 video 上 transform */
  -webkit-transform: none !important;
  transform: none !important;
  will-change: auto !important;
  -webkit-backface-visibility: visible !important;
  backface-visibility: visible !important;
}

.opc-hero-shade,
.hero-shade,
.fd-video-dim {
  position: absolute !important;
  inset: 0 !important;
  z-index: 1 !important;
  pointer-events: none !important;
  -webkit-transform: translate3d(0, 0, 0);
  transform: translate3d(0, 0, 0);
}

/* 正文必须高于视频层；禁止 isolation:isolate 与背景 video 同页抢层 */
.content-wrapper,
.page-content-layer,
.zx-bg-video-content,
.opc-hero-copy,
.hero-copy,
.container,
.main-content,
body.fd-has-hero-video .page-wrap {
  position: relative !important;
  z-index: 2 !important;
  -webkit-transform: translate3d(0, 0, 0);
  transform: translate3d(0, 0, 0);
  isolation: auto !important;
}

/* fixed 顶栏/底栏/输入条：华为系同样需合成层，避免被原生 video 盖住 */
html.zx-hw-video .opc-top-bar,
html.zx-hw-video .top-bar,
html.zx-hw-video .opc-hero-copy,
html.zx-hw-video .hero-copy,
html.zx-hw-video .wisdom-header,
html.zx-hw-video .chat-input-container,
html.zx-hw-video .bottom-nav,
html.zx-hw-video #bottomNav,
html.zx-hw-video body.fd-has-hero-video .page-wrap,
html.zx-hw-video .content-wrapper,
html.zx-hw-video .main-content,
html.zx-hw-video .container {
  -webkit-transform: translate3d(0, 0, 0) !important;
  transform: translate3d(0, 0, 0) !important;
  isolation: auto !important;
}

html.zx-hw-video .wisdom-header,
html.zx-hw-video .chat-input-container,
html.zx-hw-video .bottom-nav,
html.zx-hw-video #bottomNav {
  z-index: 1000 !important;
}

/*
 * 荣耀 V5 等：原生 video 层不可压。demote 模式下直接隐藏 video，
 * 由 .zx-hw-bg-static 用 background-image / poster 承载画面。
 */
html.zx-hw-video-demote .video-background-container video,
html.zx-hw-video-demote .zx-bg-video-stage video,
html.zx-hw-video-demote .fd-video-stage video,
html.zx-hw-video-demote video.fd-video,
html.zx-hw-video-demote #hero-video,
html.zx-hw-video-demote #video-background,
html.zx-hw-video-demote video.video-background,
html.zx-hw-video-demote video.caishen-background-video {
  display: none !important;
  width: 0 !important;
  height: 0 !important;
  opacity: 0 !important;
  pointer-events: none !important;
  position: fixed !important;
  left: -9999px !important;
  top: -9999px !important;
}

html.zx-hw-video-demote .fd-video-stage.zx-hw-bg-static,
html.zx-hw-video-demote .video-background-container.zx-hw-bg-static {
  background-color: #1a1510;
  background-size: cover !important;
  background-position: center center !important;
  background-repeat: no-repeat !important;
}

html.zx-hw-video-demote .fd-video-stage.zx-hw-bg-static #hero-poster-fallback,
html.zx-hw-video-demote .fd-video-stage.zx-hw-bg-static .fd-video-poster {
  display: block !important;
  visibility: visible !important;
  opacity: 1 !important;
  position: absolute !important;
  inset: 0 !important;
  z-index: 0 !important;
  pointer-events: none !important;
  background-size: cover !important;
  background-position: center !important;
}