/**
 * 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(7px);
  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: -webkit-box !important;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 1;
  overflow: hidden;
  word-break: break-word;
}

/* ---------- 系列页：深色背景上的白字（标题、价格等） ---------- */
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;
}