/* 产品价格组件样式 - 根据 Figma 设计 */

.product-price {
  display: inline-flex;
  flex-direction: column;
  flex-wrap: wrap;
  gap: 12px;
  align-items: baseline; /* 基线对齐 */
  visibility: visible !important;
  opacity: 1 !important;
  display: inline-flex !important;
}

/* 确保即使添加了_hideOriginPrice_13rl3_1类名，元素仍然可见 */
.product-price._hideOriginPrice_13rl3_1 {
  visibility: visible !important;
  opacity: 1 !important;
  display: inline-flex !important;
}

/* 商品列表页价格样式 */
.block-product-card__price-row .product-price {
  display: flex !important;
  flex-direction: row;
  flex-wrap: wrap;
  gap: 6px;
  align-items: center;
  visibility: visible !important;
  opacity: 1 !important;
}

/* 确保商品列表页中即使添加了_hideOriginPrice_13rl3_1类名，元素仍然可见 */
.block-product-card__price-row .product-price._hideOriginPrice_13rl3_1 {
  display: flex !important;
  visibility: visible !important;
  opacity: 1 !important;
}

.block-product-card__price-row .product-price__item {
  font-size: 18px;
  line-height: 1.4;
}

.block-product-card__price-row .product-price__item .currency-symbol {
  font-size: 14px;
}

.block-product-card__price-row .product-price__item .price-amount {
  font-size: 18px;
}

.block-product-card__price-row .product-price__item--compare {
  font-size: 12px;
  margin-top: 0;
}

.block-product-card__price-row .product-price__discount-badge {
  font-size: 12px;
  padding: 2px 6px;
  margin-top: 0;
}

/* 当前价格（促销价） */
.product-price__item {
  font-size: 42px; /* 主要数字大小 */
  font-weight: 700; /* Bold */
  /* 默认使用主题色（无折扣时） */
  line-height: 1; /* 紧凑行高 */
  color: rgb(var(--color-sale));
}

/* 有折扣时使用折扣色，并保持在一行 */
.product-price.has-discount {
  flex-wrap: wrap;
}

.product-price.has-discount .product-price__item {
  /* color: #fa3e3e; 红色 */
  color: rgb(var(--color-sale));
}

/* 货币符号样式 - 由 JS 动态添加 */
.product-price__item .currency-symbol {
  font-size: 34px; /* $ 符号较小 */
  font-weight: 700; /* Bold */
  /* 默认使用主题色（无折扣时） */
  color: rgba(var(--color-sale));
  /* color: #c68635; */
}

/* 有折扣时使用折扣色 */
.product-price.has-discount .product-price__item .currency-symbol {
  /* color: rgba(var(--color-discount)); */
  /* color: #fa3e3e; */
}

/* 价格数字 - 由 JS 动态添加 */
.product-price__item .price-amount {
  font-size: 42px;
  font-weight: 700; /* Bold */
  /* 默认使用主题色（无折扣时） */
  /* color: #c68635; */
}

/* 有折扣时使用折扣色 */
.product-price.has-discount .product-price__item .price-amount {
  /* color: rgba(var(--color-discount)); */
  /* color: #fa3e3e; */
}

/* 原价（对比价格） */
.product-price__item--compare {
  font-size: 24px;
  font-weight: 400; /* Regular */
  line-height: 1;
  color: #999; /* 灰色 */
  text-decoration: line-through;
  text-decoration-skip-ink: none;
  text-underline-position: from-font;
}

/* 折扣标签 */
.product-price__discount-badge {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 2px 8px; /* 调整内边距 */
  font-size: 16px; /* 稍微调大 */
  font-weight: 400; /* Regular */
  line-height: 1;
  color: #fa3e3e; /* 红色文字 */
  background-color: transparent; /* 透明背景 */
  border: 1px solid #fa3e3e; /* 红色边框 */
  border-radius: 4px;
  white-space: nowrap;
}

/* 响应式：移动端 */
@media (max-width: 768px) {
  .product-price__item {
    font-size: 32px;
  }

  .product-price__item .currency-symbol {
    font-size: 26px;
  }

  .product-price__item .price-amount {
    font-size: 24px;
  }

  .product-price__item--compare {
    font-size: 18px;
    margin-top: 8px;
  }

  .product-price__discount-badge {
    font-size: 14px;
    padding: 2px 6px;
    margin-top: 8px;
  }

  .product-price {
    gap: 8px;
    align-items: center;
  }
}


