/**
 * Dearhunter：系列页 / 商品详情页
 * 依赖 body[data-dh-page]（layout 输出）+ [data-template] 兜底
 * 筛选/排序完全由区块 settings 控制，不用 CSS 强藏（避免与 theme serve 默认值混淆）
 */

/* ---------- 固定视口背景（不随页面滚动） ---------- */
html.dh-fixed-theme-bg,
body.dh-fixed-theme-bg {
  background-color: transparent !important;
}

body.dh-fixed-theme-bg {
  position: relative;
  isolation: isolate;
}

body.dh-fixed-theme-bg::before {
  content: "";
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  z-index: -1;
  background-image: var(--dh-fixed-theme-bg, none);
  background-position: center top;
  background-size: cover;
  background-repeat: no-repeat;
  pointer-events: none;
}

body.dh-fixed-theme-bg--product::before {
  filter: blur(2px);
  transform: scale(1.05);
}

body.dh-fixed-theme-bg--product::after {
  content: "";
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  z-index: -1;
  background: rgba(0, 0, 0, 0.48);
  pointer-events: none;
}

body.dh-fixed-theme-bg #MainContent.content-for-layout {
  position: relative;
  z-index: 1;
  background: transparent;
}

body.dh-fixed-theme-bg #shopline-section-header {
  position: relative;
  z-index: 2;
}

/*
 * 透明顶栏内层为 position:absolute 时，外层会塌成 0 高，主内容会顶到视口最上缘。
 * 给 header 区块最小高度占位，与主题 .header min-height 对齐（移动 60px / 桌面约一行菜单更高）。
 */
body[data-dh-page="collection"] #shopline-section-header,
body[data-dh-page="product"] #shopline-section-header,
body[data-template="collection"] #shopline-section-header,
body[data-template="product"] #shopline-section-header {
  min-height: 60px;
}
@media screen and (min-width: 960px) {
  body[data-dh-page="collection"] #shopline-section-header,
  body[data-dh-page="product"] #shopline-section-header,
  body[data-template="collection"] #shopline-section-header,
  body[data-template="product"] #shopline-section-header {
    /* 桌面常见：Logo 行 + 菜单行 */
    min-height: 120px;
  }
}

body.dh-fixed-theme-bg .collection-themed-bg::before,
body.dh-fixed-theme-bg .collection-themed-bg::after,
body.dh-fixed-theme-bg .main-product-themed-bg::before,
body.dh-fixed-theme-bg .main-product-themed-bg::after {
  display: none !important;
  opacity: 0 !important;
  content: none !important;
}

/* ---------- 公告栏 ---------- */
body[data-dh-page="collection"] #shopline-section-announcement-bar,
body[data-dh-page="product"] #shopline-section-announcement-bar,
body[data-template="collection"] #shopline-section-announcement-bar,
body[data-template="product"] #shopline-section-announcement-bar {
  display: none !important;
}

/* ---------- 系列页：整块系列横幅（避免与 absolute 顶栏叠字） ---------- */
body[data-dh-page="collection"] .collection-hero,
body[data-template="collection"] .collection-hero {
  display: none !important;
}

/* ---------- 系列页：商品标题最多一行 ---------- */
/* component-card.css 已改为 1 行，这里保持一致并覆盖其它规则 */
body[data-dh-page="collection"] .product-card-wrapper .product__title,
body[data-dh-page="collection"] .product-card-wrapper h3.product__title,
body[data-template="collection"] .product-card-wrapper .product__title,
body[data-template="collection"] .product-card-wrapper h3.product__title {
  display: block !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
  white-space: nowrap !important;
  word-break: normal !important;
}

/* ---------- 系列页：深色背景上的白字（标题、价格等） ---------- */
body[data-dh-page="collection"] .product-card-wrapper,
body[data-template="collection"] .product-card-wrapper {
  --color-text: 255, 255, 255;
  --color-sale: 255, 255, 255;
  --color-light-text: 200, 200, 200;
  --color-discount: 255, 200, 200;
}

body[data-dh-page="collection"] .product-card-wrapper .product__title,
body[data-dh-page="collection"] .product-card-wrapper h3.product__title,
body[data-template="collection"] .product-card-wrapper .product__title,
body[data-template="collection"] .product-card-wrapper h3.product__title {
  color: rgb(255, 255, 255) !important;
}

/* 系列页：售价等纯 #FFF + 粗体（不动卡片右上角加购按钮/图标） */
body[data-dh-page="collection"] .product-card-wrapper .price,
body[data-dh-page="collection"] .product-card-wrapper .price .price-item,
body[data-dh-page="collection"] .product-card-wrapper .price .price-item--sale,
body[data-dh-page="collection"] .product-card-wrapper .price .price-item--regular,
body[data-dh-page="collection"] .product-card-wrapper .price .price__sale,
body[data-template="collection"] .product-card-wrapper .price,
body[data-template="collection"] .product-card-wrapper .price .price-item,
body[data-template="collection"] .product-card-wrapper .price .price-item--sale,
body[data-template="collection"] .product-card-wrapper .price .price-item--regular,
body[data-template="collection"] .product-card-wrapper .price .price__sale {
  color: #ffffff !important;
  font-weight: 700 !important;
  -webkit-font-smoothing: antialiased;
}

/*
 * 加购圆钮：component-card 里 .quick-add-icon__opener 使用 color: rgb(var(--color-text))，
 * 系列页/推荐卡片把 --color-text 改为白色后，SVG(currentColor) 与白底圆钮同色 → 看不见图标。
 */
body[data-dh-page="collection"] .card .quick-add-icon__opener,
body[data-template="collection"] .card .quick-add-icon__opener,
body[data-dh-page="product"] product-recommendations .card .quick-add-icon__opener,
body[data-template="product"] product-recommendations .card .quick-add-icon__opener {
  color: #1a1a1a !important;
  border-color: rgba(0, 0, 0, 0.12) !important;
}

body[data-dh-page="collection"] .card .quick-add-icon__opener svg,
body[data-template="collection"] .card .quick-add-icon__opener svg,
body[data-dh-page="product"] product-recommendations .card .quick-add-icon__opener svg,
body[data-template="product"] product-recommendations .card .quick-add-icon__opener svg {
  color: inherit;
}

/* ---------- 商品详情页：标题、价格、描述等为白色 ---------- */
body[data-dh-page="product"] .product,
body[data-template="product"] .product {
  --color-text: 255, 255, 255;
  --color-sale: 255, 255, 255;
  --color-light-text: 200, 200, 200;
  --color-discount: 255, 200, 200;
}

body[data-dh-page="product"] .product .product-title,
body[data-template="product"] .product .product-title {
  color: rgb(255, 255, 255) !important;
}

/* PDP 主价格区：纯 #FFF + 粗体 */
body[data-dh-page="product"] .product .price,
body[data-dh-page="product"] .product .price .price-item,
body[data-dh-page="product"] .product .price .price-item--sale,
body[data-dh-page="product"] .product .price .price-item--regular,
body[data-dh-page="product"] .product .price .price__sale,
body[data-template="product"] .product .price,
body[data-template="product"] .product .price .price-item,
body[data-template="product"] .product .price .price-item--sale,
body[data-template="product"] .product .price .price-item--regular,
body[data-template="product"] .product .price .price__sale {
  color: #ffffff !important;
  font-weight: 700 !important;
  -webkit-font-smoothing: antialiased;
}

/* 价格下运费句已在 main-product 模板中移除；若其它区块仍有类似文案可临时用控制台查节点 */

/* ---------- PDP：You may also like（product-recommendations）标题与卡片 ---------- */
body[data-dh-page="product"] product-recommendations .product-recommendations-title,
body[data-template="product"] product-recommendations .product-recommendations-title {
  color: #ffffff !important;
}

body[data-dh-page="product"] product-recommendations .product-card-wrapper,
body[data-template="product"] product-recommendations .product-card-wrapper {
  --color-text: 255, 255, 255;
  --color-sale: 255, 255, 255;
  --color-light-text: 220, 220, 220;
  --color-discount: 255, 220, 220;
}

body[data-dh-page="product"] product-recommendations .product-card-wrapper .product__title,
body[data-dh-page="product"] product-recommendations .product-card-wrapper h3.product__title,
body[data-template="product"] product-recommendations .product-card-wrapper .product__title,
body[data-template="product"] product-recommendations .product-card-wrapper h3.product__title {
  color: #ffffff !important;
}

body[data-dh-page="product"] product-recommendations .product-card-wrapper .price,
body[data-dh-page="product"] product-recommendations .product-card-wrapper .price .price-item,
body[data-dh-page="product"] product-recommendations .product-card-wrapper .price .price-item--sale,
body[data-dh-page="product"] product-recommendations .product-card-wrapper .price .price-item--regular,
body[data-dh-page="product"] product-recommendations .product-card-wrapper .price .price__sale,
body[data-template="product"] product-recommendations .product-card-wrapper .price,
body[data-template="product"] product-recommendations .product-card-wrapper .price .price-item,
body[data-template="product"] product-recommendations .product-card-wrapper .price .price-item--sale,
body[data-template="product"] product-recommendations .product-card-wrapper .price .price-item--regular,
body[data-template="product"] product-recommendations .product-card-wrapper .price .price__sale {
  color: #ffffff !important;
  font-weight: 700 !important;
  -webkit-font-smoothing: antialiased;
}

body[data-dh-page="product"] .product .product__info-description,
body[data-dh-page="product"] .product .product__info-description *,
body[data-dh-page="product"] .product .rte,
body[data-dh-page="product"] .product .rte *,
body[data-template="product"] .product .product__info-description,
body[data-template="product"] .product .product__info-description *,
body[data-template="product"] .product .rte,
body[data-template="product"] .product .rte * {
  color: rgb(255, 255, 255) !important;
}

body[data-dh-page="product"] .product .accordion__title,
body[data-dh-page="product"] .product .accordion__content,
body[data-dh-page="product"] .product .accordion__content *,
body[data-dh-page="product"] .product .product-form__label,
body[data-dh-page="product"] .product .form__label,
body[data-dh-page="product"] .product .product__sku,
body[data-template="product"] .product .accordion__title,
body[data-template="product"] .product .accordion__content,
body[data-template="product"] .product .accordion__content *,
body[data-template="product"] .product .product-form__label,
body[data-template="product"] .product .form__label,
body[data-template="product"] .product .product__sku {
  color: rgb(255, 255, 255) !important;
}

/* PDP 描述折叠：默认行数加倍 + Read more/less 居中白色 */
body[data-dh-page="product"] .product .product__info-description-expand-container.expand-limit-height .expand-wrapper,
body[data-template="product"] .product .product__info-description-expand-container.expand-limit-height .expand-wrapper {
  max-height: 300px;
}

body[data-dh-page="product"] .product .expand-view-more-box,
body[data-template="product"] .product .expand-view-more-box {
  display: flex;
  justify-content: center;
  text-align: center;
}

body[data-dh-page="product"] .product .expand-view-more-box .expand-view-more-button,
body[data-dh-page="product"] .product .expand-view-more-box .expand-view-less-button,
body[data-template="product"] .product .expand-view-more-box .expand-view-more-button,
body[data-template="product"] .product .expand-view-more-box .expand-view-less-button {
  color: #ffffff !important;
  justify-content: center;
}

body[data-dh-page="product"] .product .expand-view-more-box .expand-view-more-button svg,
body[data-dh-page="product"] .product .expand-view-more-box .expand-view-less-button svg,
body[data-template="product"] .product .expand-view-more-box .expand-view-more-button svg,
body[data-template="product"] .product .expand-view-more-box .expand-view-less-button svg {
  color: #ffffff !important;
}

/* 链接在描述里保持可辨：浅色下划线 */
body[data-dh-page="product"] .product .rte a,
body[data-template="product"] .product .rte a {
  color: rgba(200, 220, 255, 0.95) !important;
  text-decoration: underline;
}

/* ---------- 顶栏：透明 + 暗化 + 白字 ---------- */
body[data-dh-page="collection"] .header.is-transparent,
body[data-dh-page="product"] .header.is-transparent,
body[data-template="collection"] .header.is-transparent,
body[data-template="product"] .header.is-transparent {
  --transparent-color-text: 255, 255, 255;
}

body[data-dh-page="collection"] .header.is-transparent::before,
body[data-dh-page="product"] .header.is-transparent::before,
body[data-template="collection"] .header.is-transparent::before,
body[data-template="product"] .header.is-transparent::before {
  transform: scaleY(1) !important;
  background: rgba(0, 0, 0, 0.38) !important;
  transition: none !important;
}

body[data-dh-page="collection"] .header.is-transparent.is-transparent--active::before,
body[data-dh-page="product"] .header.is-transparent.is-transparent--active::before,
body[data-template="collection"] .header.is-transparent.is-transparent--active::before,
body[data-template="product"] .header.is-transparent.is-transparent--active::before {
  background: rgba(0, 0, 0, 0.42) !important;
}

body[data-dh-page="collection"] .header.is-transparent .header__heading-logo,
body[data-dh-page="product"] .header.is-transparent .header__heading-logo,
body[data-template="collection"] .header.is-transparent .header__heading-logo,
body[data-template="product"] .header.is-transparent .header__heading-logo {
  filter: brightness(0) invert(1);
}

/* ---------- 系列页：全宽模糊带（商品卡宽度不变，与 page-width 对齐） ---------- */
/*
 * 模糊在 .dh-collection-glass-stack::before 全宽铺满，但 top 与 __gap 同高，
 * 留白区仅显示固定背景图，模糊从 __panel（商品模块）顶边开始。
 * 底部分区 padding 挪到本栈，避免页脚前露出一截未模糊背景。
 */
body[data-dh-page="collection"] #MainContent.content-for-layout,
body[data-template="collection"] #MainContent.content-for-layout {
  overflow-x: hidden;
}

body[data-dh-page="collection"] [id^="MainCollection-"].section-padding,
body[data-template="collection"] [id^="MainCollection-"].section-padding {
  padding-bottom: 0 !important;
}

body[data-dh-page="collection"] .dh-collection-glass-stack,
body[data-template="collection"] .dh-collection-glass-stack {
  position: relative;
  z-index: 1;
  /* 突破 page-width，全屏宽模糊底 */
  width: 100vw;
  max-width: none;
  margin-left: calc(50% - 50vw);
  margin-right: calc(50% - 50vw);
  box-sizing: border-box;
  /* 承接原分区 padding-bottom（移动端为主题一半） */
  padding-bottom: 40px;
  isolation: isolate;
}

@media screen and (min-width: 960px) {
  body[data-dh-page="collection"] .dh-collection-glass-stack,
  body[data-template="collection"] .dh-collection-glass-stack {
    padding-bottom: 80px;
  }
}

body[data-dh-page="collection"] .dh-collection-glass-stack::before,
body[data-template="collection"] .dh-collection-glass-stack::before {
  content: "";
  position: absolute;
  left: 0;
  right: 0;
  bottom: 0;
  /* 与 .dh-collection-glass-stack__gap 同高：模糊从 panel 顶开始，不盖住上方留白 */
  top: var(--dh-glass-gap-m, 400px);
  z-index: 0;
  pointer-events: none;
  border-radius: 0;
}

@media screen and (min-width: 960px) {
  body[data-dh-page="collection"] .dh-collection-glass-stack::before,
  body[data-template="collection"] .dh-collection-glass-stack::before {
    top: var(--dh-glass-gap-d, 360px);
  }
}

body[data-dh-page="collection"] .dh-collection-glass-stack:not(.dh-collection-glass-stack--no-blur)::before,
body[data-template="collection"] .dh-collection-glass-stack:not(.dh-collection-glass-stack--no-blur)::before {
  background: rgba(12, 12, 16, 0.38);
  -webkit-backdrop-filter: blur(var(--dh-glass-blur, 18px)) saturate(1.15);
  backdrop-filter: blur(var(--dh-glass-blur, 18px)) saturate(1.15);
}

body[data-dh-page="collection"] .dh-collection-glass-stack--no-blur::before,
body[data-template="collection"] .dh-collection-glass-stack--no-blur::before {
  background: rgba(10, 10, 14, 0.55);
  -webkit-backdrop-filter: none;
  backdrop-filter: none;
}

body[data-dh-page="collection"] .dh-collection-glass-stack__gap,
body[data-template="collection"] .dh-collection-glass-stack__gap {
  display: block;
  position: relative;
  z-index: 1;
  width: 100%;
  height: var(--dh-glass-gap-m, 400px);
  flex-shrink: 0;
  pointer-events: none;
}

@media screen and (min-width: 960px) {
  body[data-dh-page="collection"] .dh-collection-glass-stack__gap,
  body[data-template="collection"] .dh-collection-glass-stack__gap {
    height: var(--dh-glass-gap-d, 360px);
  }
}

body[data-dh-page="collection"] .dh-collection-glass-stack__panel,
body[data-template="collection"] .dh-collection-glass-stack__panel {
  position: relative;
  z-index: 1;
  /* 与 .page-width 横向留白一致，商品卡视觉宽度与改前一致 */
  padding: 16px var(--page-padding, 20px) 20px;
  border-radius: 0;
  background: transparent !important;
  box-shadow: none;
}

@media screen and (min-width: 960px) {
  body[data-dh-page="collection"] .dh-collection-glass-stack__panel,
  body[data-template="collection"] .dh-collection-glass-stack__panel {
    padding: 20px var(--page-padding, 20px) 28px;
  }
}

/* 语录：白字居中 */
body[data-dh-page="collection"] .dh-collection-quote,
body[data-template="collection"] .dh-collection-quote,
body[data-dh-page="product"] .dh-collection-quote,
body[data-template="product"] .dh-collection-quote {
  margin: 20px 0 0;
  padding: 0 8px;
  border: 0;
  color: #ffffff !important;
  text-align: center;
  font-style: italic;
  line-height: 1.55;
  -webkit-font-smoothing: antialiased;
}

/* Select Companion 条 */
body[data-dh-page="collection"] .dh-companion-bar,
body[data-template="collection"] .dh-companion-bar,
body[data-dh-page="product"] .dh-companion-bar,
body[data-template="product"] .dh-companion-bar {
  margin-top: 16px;
}

body[data-dh-page="collection"] .dh-companion-trigger,
body[data-template="collection"] .dh-companion-trigger,
body[data-dh-page="product"] .dh-companion-trigger,
body[data-template="product"] .dh-companion-trigger {
  display: flex;
  align-items: center;
  justify-content: space-between;
  width: 100%;
  min-height: 48px;
  padding: 10px 18px;
  border: 1px solid rgba(255, 255, 255, 0.14);
  border-radius: 999px;
  background: rgba(0, 0, 0, 0.35);
  color: #fff !important;
  font-size: 15px;
  font-weight: 500;
  letter-spacing: 0.02em;
  cursor: pointer;
  -webkit-backdrop-filter: blur(8px);
  backdrop-filter: blur(8px);
}

body[data-dh-page="collection"] .dh-companion-trigger__dots,
body[data-template="collection"] .dh-companion-trigger__dots,
body[data-dh-page="product"] .dh-companion-trigger__dots,
body[data-template="product"] .dh-companion-trigger__dots {
  display: inline-flex;
  gap: 4px;
  align-items: center;
}

body[data-dh-page="collection"] .dh-companion-trigger__dots span,
body[data-template="collection"] .dh-companion-trigger__dots span,
body[data-dh-page="product"] .dh-companion-trigger__dots span,
body[data-template="product"] .dh-companion-trigger__dots span {
  width: 4px;
  height: 4px;
  border-radius: 50%;
  background: #fff;
  opacity: 0.9;
}

/* 弹窗 */
.dh-companion-dialog {
  position: fixed;
  inset: auto 0 0 0;
  margin: 0;
  padding: 0;
  border: none;
  max-width: none;
  width: 100%;
  background: transparent;
  color: #fff;
}

.dh-companion-dialog::backdrop {
  background: rgba(0, 0, 0, 0.55);
  -webkit-backdrop-filter: blur(4px);
  backdrop-filter: blur(4px);
}

.dh-companion-dialog__panel {
  position: relative;
  width: 100%;
  max-height: min(72vh, 560px);
  overflow: hidden;
  padding: 18px 16px calc(20px + env(safe-area-inset-bottom));
  border-radius: 18px 18px 0 0;
  background: rgba(12, 12, 18, 0.95);
  border: 1px solid rgba(255, 255, 255, 0.12);
  border-bottom: none;
  box-shadow: 0 -16px 48px rgba(0, 0, 0, 0.55);
}

@media screen and (min-width: 960px) {
  .dh-companion-dialog {
    inset: auto 50% 0 auto;
    width: min(560px, 100vw);
    transform: translateX(50%);
  }
}

@media (prefers-reduced-motion: no-preference) {
  .dh-companion-dialog[open] .dh-companion-dialog__panel {
    animation: dh-companion-sheet-in 220ms cubic-bezier(0.2, 0.8, 0.2, 1) both;
  }
}

@keyframes dh-companion-sheet-in {
  from {
    transform: translateY(24px);
    opacity: 0;
  }
  to {
    transform: translateY(0);
    opacity: 1;
  }
}

.dh-companion-dialog__close {
  position: absolute;
  top: 10px;
  right: 12px;
  width: 36px;
  height: 36px;
  border: none;
  border-radius: 50%;
  background: rgba(255, 255, 255, 0.08);
  color: #fff;
  font-size: 22px;
  line-height: 1;
  cursor: pointer;
}

.dh-companion-dialog__heading {
  margin: 0 0 12px;
  padding-right: 36px;
  font-size: 20px;
  font-weight: 600;
  color: #fff;
}

.dh-companion-dialog__list {
  margin: 0;
  padding: 0;
  max-height: calc(min(72vh, 560px) - 84px);
  overflow: auto;
}

.dh-companion-dialog__item + .dh-companion-dialog__item {
  border-top: 1px solid rgba(255, 255, 255, 0.1);
}

.dh-companion-dialog__link {
  display: block;
  padding: 12px 14px;
  border: 1px solid rgba(255, 255, 255, 0.2);
  border-radius: 12px;
  margin-bottom: 8px;
  background: rgba(0, 0, 0, 0.35);
  color: #fff !important;
  text-decoration: none;
}

.dh-companion-dialog__link:hover {
  color: rgba(255, 255, 255, 0.85) !important;
}

/* PDP：移除描述与 You may also like 之间的异常大留白 */
body[data-dh-page="product"] .dh-product-recommendations-wrap,
body[data-template="product"] .dh-product-recommendations-wrap {
  padding-top: 0 !important;
  margin-top: 0 !important;
}

/* PDP：避免双列布局把右侧信息列拉伸，导致描述后出现大面积空白 */
@media screen and (min-width: 960px) {
  body[data-dh-page="product"] main-product-detail.product,
  body[data-template="product"] main-product-detail.product {
    align-items: start;
  }

  body[data-dh-page="product"] main-product-detail.product .product__info-wrapper,
  body[data-template="product"] main-product-detail.product .product__info-wrapper {
    align-self: start;
  }
}

/* PDP 修复：某些模板输出 <product-modal>（而非 modal-dialog）时会留在文档流占位 */
body[data-dh-page="product"] product-modal.product-media-modal,
body[data-template="product"] product-modal.product-media-modal {
  position: fixed !important;
  inset: 0 !important;
  display: block !important;
  width: 100% !important;
  height: 100vh !important;
  margin: 0 !important;
  padding: 0 !important;
  visibility: hidden !important;
  opacity: 0 !important;
  z-index: -1 !important;
  pointer-events: none !important;
}

body[data-dh-page="product"] product-modal.product-media-modal[open],
body[data-template="product"] product-modal.product-media-modal[open] {
  visibility: visible !important;
  opacity: 1 !important;
  z-index: 101 !important;
  pointer-events: auto !important;
}

/* =============================================================================
 * 系列页 + PDP：顶栏底部无分割线（覆盖 header 主题设置里的 border-bottom 内联样式）
 * ============================================================================= */
body[data-dh-page="collection"] #shopline-section-header .header,
body[data-dh-page="product"] #shopline-section-header .header,
body[data-template="collection"] #shopline-section-header .header,
body[data-template="product"] #shopline-section-header .header {
  border-bottom: none !important;
  box-shadow: none !important;
}

/* =============================================================================
 * PDP 移动端：主图贴顶栏、左右贴屏（仅移动端 ≤959px）
 * 后续要微调：只改 body[data-dh-page="product"] 上这两个变量即可。
 *   --dh-pdp-mobile-media-top-gap：主区块顶内边距（越大主图越靠下）
 *   --dh-pdp-mobile-media-inline-gutter：主图左右各留多少 px（0 = 全宽贴边）
 *   --dh-pdp-mobile-media-list-margin-top：主题在 section-main-product-media-gallery 里给
 *     .product__media-list.grid 写了 margin-top:20px，这里改为可调（默认 0 贴顶栏）
 * ============================================================================= */
body[data-dh-page="product"],
body[data-template="product"] {
  --dh-pdp-mobile-media-top-gap: 10px;
  /* 恢复左右边距（原主题视觉）：只保留“贴顶”，不再全宽贴边 */
  --dh-pdp-mobile-media-inline-gutter: 20px;
  --dh-pdp-mobile-media-list-margin-top: 0px;
}

@media screen and (max-width: 959px) {
  /* 主图贴顶时，header 的透明态遮罩（::before）会盖住主图顶部圆角。
     PDP 这里让遮罩透明，避免把圆角“压成直角”。 */
  body[data-dh-page="product"] .header.is-transparent::before,
  body[data-template="product"] .header.is-transparent::before,
  body[data-dh-page="product"] .header.is-transparent.is-transparent--active::before,
  body[data-template="product"] .header.is-transparent.is-transparent--active::before {
    background: transparent !important;
  }

  body[data-dh-page="product"] #MainContent.content-for-layout,
  body[data-template="product"] #MainContent.content-for-layout {
    overflow-x: hidden;
  }

  /* 主图区缩略图 → 标题：info 区默认 margin-top 22px；缩略图条 ul 另有 slider--mobile 的 margin-bottom:20px，一并收掉 */
  body[data-dh-page="product"] .product .product__info-wrapper,
  body[data-template="product"] .product .product__info-wrapper {
    margin-top: 10px !important;
  }

  body[data-dh-page="product"] .product__media-wrapper ul.thumbnail-list.slider.slider--mobile,
  body[data-template="product"] .product__media-wrapper ul.thumbnail-list.slider.slider--mobile {
    margin-bottom: 0 !important;
    padding-right: var(--page-padding) !important;
    box-sizing: border-box;
    scroll-padding-right: var(--page-padding) !important;
    -webkit-overflow-scrolling: touch;
    touch-action: pan-x;
    overscroll-behavior-x: contain;
  }

  body[data-dh-page="product"] [id^="MainProduct-"].section-padding.main-product-themed-bg,
  body[data-template="product"] [id^="MainProduct-"].section-padding.main-product-themed-bg {
    padding-top: var(--dh-pdp-mobile-media-top-gap) !important;
  }

  body[data-dh-page="product"] main-product-detail.product.grid > .product__media-wrapper,
  body[data-template="product"] main-product-detail.product.grid > .product__media-wrapper {
    --dh-g: var(--dh-pdp-mobile-media-inline-gutter, 0px);
    width: calc(100vw - (var(--dh-g) * 2));
    max-width: none;
    margin-left: calc(50% - 50vw + var(--dh-g)) !important;
    margin-right: calc(50% - 50vw + var(--dh-g)) !important;
    margin-top: 0 !important;
    padding-left: 0 !important;
    padding-right: 0 !important;
    box-sizing: border-box;
  }

  /* PDP 移动端：主图/视频圆角（沿用之前可生效的方法，只调大一点点） */
  body[data-dh-page="product"] main-product-detail.product .product__media-wrapper,
  body[data-template="product"] main-product-detail.product .product__media-wrapper {
    /* 仅主图保留圆角，避免缩略图组继承到底部外角 */
    border-radius: 0;
    overflow: visible;
  }

  /* 主题实际把媒体放在 .product__media-item 里的 .deferred-media / .product__media 上，给这些“承载层”也打圆角 */
  body[data-dh-page="product"] main-product-detail.product .product__media-item,
  body[data-template="product"] main-product-detail.product .product__media-item {
    border-radius: calc(var(--product-card-border-radius, 16px) + 3px) !important;
    overflow: hidden;
  }

  body[data-dh-page="product"] main-product-detail.product .product__media-item .deferred-media,
  body[data-template="product"] main-product-detail.product .product__media-item .deferred-media,
  body[data-dh-page="product"] main-product-detail.product .product__media-item .product__media,
  body[data-template="product"] main-product-detail.product .product__media-item .product__media,
  body[data-dh-page="product"] main-product-detail.product .product__media-item .deferred-media__poster,
  body[data-template="product"] main-product-detail.product .product__media-item .deferred-media__poster,
  body[data-dh-page="product"] main-product-detail.product .product__media-item .media,
  body[data-template="product"] main-product-detail.product .product__media-item .media {
    border-radius: calc(var(--product-card-border-radius, 16px) + 3px) !important;
    overflow: hidden;
  }

  body[data-dh-page="product"] main-product-detail.product .product__media-item img,
  body[data-template="product"] main-product-detail.product .product__media-item img,
  body[data-dh-page="product"] main-product-detail.product .product__media-item video,
  body[data-template="product"] main-product-detail.product .product__media-item video,
  body[data-dh-page="product"] main-product-detail.product .product__media-item iframe,
  body[data-template="product"] main-product-detail.product .product__media-item iframe {
    border-radius: calc(var(--product-card-border-radius, 16px) + 3px) !important;
  }

  /* 控制台量到的 10px：来自 .product__media-list.grid { margin-top: 20px } 与顶栏叠边后的可视差 */
  body[data-dh-page="product"] .product__media-wrapper .product__media-list.grid,
  body[data-template="product"] .product__media-wrapper .product__media-list.grid {
    margin-top: var(--dh-pdp-mobile-media-list-margin-top) !important;
  }

  /* 缩略图组底角去除：不依赖 body data-*，避免页面标记不一致导致失效 */
  main-product-detail.product .product__thumbnail-slider-group.product__thumbnail--bottom .thumbnail-slider,
  main-product-detail.product .product__thumbnail-slider-group.product__thumbnail--bottom .thumbnail-list.slider.slider--mobile {
    border-bottom-left-radius: 0 !important;
    border-bottom-right-radius: 0 !important;
    overflow-x: auto !important;
    overflow-y: hidden !important;
    -webkit-overflow-scrolling: touch !important;
    touch-action: pan-x !important;
  }
}

/* =============================================================================
 * PDP：右侧信息区「每一大块」纵向间距统一 10px（与 section-main-product.css 末尾一致）
 * 用 flex row-gap + 直子项 margin 清零，避免块上 .m-26/.m-10 与 section 57–103 行 margin
 * 在支付按钮晚挂载时叠出大缝；layout-shift 诊断里位移源曾指向 .product__info-item.m-26。
 * 仅主商品 main-product-detail + product-info；不依赖 body[data-dh-page]，避免预览不命中。
 * ============================================================================= */
main-product-detail.product product-info.product__info-container {
  display: flex !important;
  flex-direction: column !important;
  gap: 10px !important;
  row-gap: 10px !important;
  column-gap: 0 !important;
}

main-product-detail.product product-info.product__info-container > * {
  margin-top: 0 !important;
  margin-bottom: 0 !important;
}

main-product-detail.product product-info.product__info-container > div:not(.product__info-item) {
  display: none !important;
}

/* 第三方移动端悬浮加购（addToCartPluginMobile）白描边 */
body[data-dh-page="product"] #addToCartPluginMobile button,
body[data-template="product"] #addToCartPluginMobile button,
body[data-dh-page="product"] #addToCartPluginMobile [role="button"],
body[data-template="product"] #addToCartPluginMobile [role="button"],
body[data-dh-page="product"] .addToCartPluginWithTheme button,
body[data-template="product"] .addToCartPluginWithTheme button {
  border: 1.5px solid #fff !important;
  box-shadow: 0 0 0 1px rgba(255, 255, 255, 0.35) inset !important;
}

/* 兜底：第三方插件常把可点击层挂在容器本身，不是 button */
body[data-dh-page="product"] #addToCartPluginMobile,
body[data-template="product"] #addToCartPluginMobile,
body[data-dh-page="product"] #addToCartPluginMobile .addToCartPluginWithTheme,
body[data-template="product"] #addToCartPluginMobile .addToCartPluginWithTheme {
  border: 1.5px solid #fff !important;
  box-shadow: 0 0 0 1px rgba(255, 255, 255, 0.35) inset !important;
  box-sizing: border-box !important;
}

/* 商品卡顶部白边修复：改掉 50% + translate 的亚像素缝 */
.product-card-wrapper .card__media > img {
  top: 0 !important;
  transform: none !important;
}

body[data-dh-page="product"] .product .product__info-container variant-radios fieldset.product-form__input,
body[data-template="product"] .product .product__info-container variant-radios fieldset.product-form__input {
  margin-bottom: 10px !important;
}

body[data-dh-page="product"]
  .product
  .product__info-container
  variant-radios
  fieldset.product-form__input:last-of-type,
body[data-template="product"]
  .product
  .product__info-container
  variant-radios
  fieldset.product-form__input:last-of-type {
  margin-bottom: 0 !important;
}

body[data-dh-page="product"] .product .product__info-container variant-selects .variant-input-wrapper,
body[data-template="product"] .product .product__info-container variant-selects .variant-input-wrapper {
  margin-bottom: 10px !important;
}

body[data-dh-page="product"]
  .product
  .product__info-container
  variant-selects
  .variant-input-wrapper:last-of-type,
body[data-template="product"]
  .product
  .product__info-container
  variant-selects
  .variant-input-wrapper:last-of-type {
  margin-bottom: 0 !important;
}

body[data-dh-page="product"] .product .product__info-container .product-form__input--engraving,
body[data-template="product"] .product .product__info-container .product-form__input--engraving {
  margin: 0 !important;
}

/* 价格→规格：收紧首行规格图上方内边距 */
body[data-dh-page="product"]
  .product__info-container
  variant-radios
  fieldset.product-form__input--image-variant
  .variant-image-options,
body[data-template="product"]
  .product__info-container
  variant-radios
  fieldset.product-form__input--image-variant
  .variant-image-options {
  padding-top: 0 !important;
}

/* Size→刻字：横向 Size 行里 legend 的 margin-bottom 会撑高整个 fieldset，底部多出一条「假空白」 */
body[data-dh-page="product"]
  .product__info-container
  variant-radios
  fieldset.product-form__input--size-modal
  .form__label,
body[data-template="product"]
  .product__info-container
  variant-radios
  fieldset.product-form__input--size-modal
  .form__label {
  margin-bottom: 0 !important;
}
