/**
 * [INPUT]: 依赖 product/detail.html 输出的标准 PDP 列结构、布局 data attribute 与 Theme Editor 间距变量。
 * [OUTPUT]: 提供商品详情页的响应式列宽、桌面吸顶信息栏和移动端单列回退样式。
 * [POS]: product 详情组件的布局层；让标准 PDP 的商品信息与左侧媒体列在各自职责内滚动。
 * [PROTOCOL]: 变更时更新此头部，然后检查 CLAUDE.md
 */
.product-detail-wrapper {
  background-color: rgba(var(--color-background, var(--color-page-background)));
}

.product-detail {
  background-color: rgba(var(--color-background, var(--color-page-background)));
}

.product-detail__row {
  display: flex;
  flex-direction: column;
  gap: 10px;
}

#lf-quick-add-modal-content {
  padding-inline: var(--page-padding);
}

@media (max-width: 959px) {
  .product-detail__info {
    width: 100%;
  }
}

@media (min-width: 960px) {
  .product-detail__info {
    width: 100%;
  }

  .product-detail[data-desktop-direction="row"] {
    z-index: var(--z-index-focus);
  }

  .product-detail[data-section-type="main-product"][data-desktop-direction="row"]
    > .product-detail__info {
    align-self: flex-start;
  }

  .product-detail[data-desktop-direction="row"] .product-detail__info,
  .product-detail[data-desktop-direction="row"] .product-detail__media {
    position: sticky;
    inset-block-start: var(--detail-padding-block-start, 0);
    z-index: var(--z-index-hover);
  }
  .product-detail[data-desktop-direction="row"] .product-detail__col--small {
    width: 34%;
  }

  .product-detail[data-desktop-direction="row"]
    .product-detail__col--small
    + .product-detail__col {
    width: 66%;
  }

  .product-detail[data-desktop-direction="row"] .product-detail__col--medium {
    width: 50%;
  }

  .product-detail[data-desktop-direction="row"]
    .product-detail__col--medium
    + .product-detail__col {
    width: 50%;
  }

  .product-detail[data-desktop-direction="row"] .product-detail__col--large {
    width: 66%;
  }

  .product-detail[data-desktop-direction="row"]
    .product-detail__col--large
    + .product-detail__col {
    width: 34%;
  }
}