/* ===== 站内广告位（容器 class 刻意不用 ad/banner，降低被 AdBlock 误伤的概率） ===== */

.hg-promo {
  position: relative;
  display: block;
  margin: 14px 0;
  border-radius: 12px;
  overflow: hidden;
  background: rgba(255, 255, 255, .03);
  border: 1px solid rgba(255, 255, 255, .06);
}

.hg-promo__link {
  display: block;
  position: relative;
  text-decoration: none;
}

.hg-promo__img {
  display: block;
  width: 100%;
  height: auto;
  object-fit: cover !important;
}

.hg-promo__tag {
  position: absolute;
  left: 8px;
  bottom: 8px;
  padding: 2px 7px;
  border-radius: 4px;
  font-size: 10px;
  line-height: 1.6;
  color: rgba(255, 255, 255, .78);
  background: rgba(0, 0, 0, .55);
  -webkit-backdrop-filter: blur(4px);
  backdrop-filter: blur(4px);
  pointer-events: none;
}

.hg-promo__inner {
  padding: 0;
  line-height: 0;
}

.hg-promo__inner img,
.hg-promo__inner iframe {
  display: block;
  max-width: 100%;
  border: 0;
}

/* --- 横幅：贴边、无外边距（放在内容容器里由容器控制） --- */
.hg-promo--banner {
  margin: 12px 0;
  border-radius: 10px;
}
.hg-promo--banner .hg-promo__img {
  aspect-ratio: 32 / 5;   /* 640×100 */
  width: 100%;
  object-fit: cover !important;
}
@media (min-width: 1024px) {
  .hg-promo--banner .hg-promo__img { aspect-ratio: 97 / 9; }  /* 970×90 */
}

/* --- 原生卡：与视频卡/剧卡同尺寸 --- */
.hg-promo--native .hg-promo__img {
  aspect-ratio: 2 / 3;
  width: 100%;
  object-fit: cover !important;
}

/* --- 视频流原生卡（竖屏 9:16，占满一屏） --- */
.hg-promo--home_feed_native {
  margin: 0;
  border-radius: 0;
  border: 0;
  background: #0b0b0d;
  height: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
}
.hg-promo--home_feed_native .hg-promo__link {
  width: 100%;
  height: 100%;
}
.hg-promo--home_feed_native .hg-promo__img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

/* --- 详情页侧栏（暂不做 PC 单独版，保留样式） --- */
.hg-promo--sidebar .hg-promo__img {
  aspect-ratio: 300 / 250;
}

/* --- 播放前贴片 --- */
.hg-preroll {
  position: absolute;
  inset: 0;
  z-index: 30;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  background: #000;
  color: #fff;
}
.hg-preroll__stage {
  position: relative;
  width: 100%;
  height: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
  overflow: hidden;
}
.hg-preroll__stage img {
  max-width: 100%;
  max-height: 100%;
  object-fit: contain;
}
.hg-preroll__stage .hg-promo__inner {
  width: 100%;
  text-align: center;
}
.hg-preroll__tag {
  position: absolute;
  top: 12px;
  left: 12px;
  padding: 3px 8px;
  border-radius: 4px;
  font-size: 11px;
  color: rgba(255, 255, 255, .8);
  background: rgba(0, 0, 0, .5);
}
.hg-preroll__skip {
  position: absolute;
  top: 12px;
  right: 12px;
  padding: 7px 14px;
  border-radius: 999px;
  border: 1px solid rgba(255, 255, 255, .25);
  background: rgba(0, 0, 0, .55);
  color: #fff;
  font-size: 12px;
  line-height: 1;
  cursor: pointer;
}
.hg-preroll__skip:disabled {
  opacity: .55;
  cursor: default;
}
.hg-preroll__skip:hover:not(:disabled) {
  background: rgba(0, 0, 0, .75);
}

/* --- 视频流里的广告卡（feed.js 渲染） --- */
.ff-item--ad {
  display: flex;
  align-items: center;
  justify-content: center;
  background: #08080a;
}
.ff-item--ad .hg-promo {
  margin: 0;
  width: 100%;
  height: 100%;
  border: 0;
  border-radius: 0;
}
