/**
 * WooCommerce 产品卡 — 首图 + 标题 + 属性值（2 列网格）
 * 模板：子主题 woocommerce/content-product.php
 */

/* WooCommerce 在 ul.products 上用 ::before/::after 做清浮动；现代布局可去掉 */
.woocommerce ul.products::before,
.woocommerce ul.products::after {
  content: none !important;
  display: none !important;
}

/* 去掉本卡片及内部任意元素上的 ::before / ::after（主题/插件装饰） */
.woocommerce ul.products li.product.hec-product-card::before,
.woocommerce ul.products li.product.hec-product-card::after,
.woocommerce ul.products li.product.hec-product-card *::before,
.woocommerce ul.products li.product.hec-product-card *::after {
  content: none !important;
  display: none !important;
}

.woocommerce ul.products li.product.hec-product-card {
  list-style: none;
  margin-bottom: 0;
}

.woocommerce ul.products li.product.hec-product-card .hec-product-card__inner {
  height: 100%;
  min-height: 100%;
  background: #fff;
  border: 1px solid rgba(0, 0, 0, 0.08);
  border-radius: 12px;
  padding: 12px;
  box-sizing: border-box;
  transition: box-shadow 0.25s ease, border-color 0.25s ease, transform 0.25s ease;
}

.woocommerce ul.products li.product.hec-product-card:hover .hec-product-card__inner {
  border-color: rgba(0, 0, 0, 0.12);
  box-shadow: 0 8px 24px rgba(0, 0, 0, 0.08);
  transform: translateY(-2px);
}

.woocommerce ul.products li.product.hec-product-card .hec-product-card__link {
  display: flex;
  flex-direction: column;
  height: 100%;
  min-height: 0;
  text-decoration: none;
  color: inherit;
}

.woocommerce ul.products li.product.hec-product-card .hec-product-card__media {
  border-radius: 8px;
  overflow: hidden;
  flex-shrink: 0;
}

.woocommerce ul.products li.product.hec-product-card .hec-product-card__media img {
  display: block;
  width: 100% !important;
  height: auto !important;
  aspect-ratio: 3 / 2;
  object-fit: cover;
  margin: 0 !important;
  transform: scale(1);
  transform-origin: center center;
  transition: transform 0.45s ease;
}

.woocommerce ul.products li.product.hec-product-card .hec-product-card__media:hover img {
  transform: scale(1.08);
}

@media (prefers-reduced-motion: reduce) {
  .woocommerce ul.products li.product.hec-product-card .hec-product-card__media img {
    transition: none;
  }

  .woocommerce ul.products li.product.hec-product-card .hec-product-card__media:hover img {
    transform: scale(1);
  }
}

.woocommerce ul.products li.product.hec-product-card .hec-product-card__title {
  font-size: 1rem;
  font-weight: 600;
  line-height: 1.35;
  margin: 12px 0 10px;
  padding: 0;
  color: #1a1a1a;
}

/* 属性：默认（非 Parts）仍保持原来的两列网格 + 上键下值 */
.woocommerce ul.products li.product.hec-product-card:not(.hec-product-card--parts) .hec-product-card__attrs {
  list-style: none;
  margin: 0;
  padding: 0;
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 10px 12px;
  border: none;
  background: none;
}

.woocommerce ul.products li.product.hec-product-card:not(.hec-product-card--parts) .hec-product-card__attr {
  display: flex;
  flex-direction: column;
  gap: 4px;
  margin: 0;
  padding: 0;
  word-break: break-word;
  line-height: 1.35;
  border: none;
  background: none;
}

/* 第一行属性与下一行之间：仅此一条横线（2px 实线），跨两列 */
.woocommerce ul.products li.product.hec-product-card .hec-product-card__attr-divider {
  grid-column: 1 / -1;
  list-style: none;
  padding: 0;
  height: 0;
  border: none;
  border-bottom: 1px solid rgba(0, 0, 0, 0.15);
  background: none;
}

.woocommerce ul.products li.product.hec-product-card:not(.hec-product-card--parts) .hec-product-card__attr-key {
  font-size: 0.75rem;
  font-weight: 600;
  color: #888;
}

.woocommerce ul.products li.product.hec-product-card:not(.hec-product-card--parts) .hec-product-card__attr-val {
  font-size: 0.8125rem;
  color: #333;
}

/* =========================
 * Parts（配件）专用样式（只影响 hec-product-card--parts）
 * ========================= */
.woocommerce ul.products li.product.hec-product-card.hec-product-card--parts:hover .hec-product-card__inner {
  transform: none;
}

.woocommerce ul.products li.product.hec-product-card.hec-product-card--parts .hec-product-card__media:hover img {
  transform: scale(1);
}

/* Parts 描述：最多 4 行 */
.woocommerce ul.products li.product.hec-product-card.hec-product-card--parts .hec-product-card__desc {
  margin: 0;
  color: #333;
  font-size: 0.875rem;
  line-height: 1.5;
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 4;
  line-clamp: 4;
  overflow: hidden;
}

/* Parts 属性列表：单列 + “名：值” 横向 */
.woocommerce ul.products li.product.hec-product-card.hec-product-card--parts .hec-product-card__attrs {
  grid-template-columns: 1fr;
  margin: 0;
  list-style: none;
  margin: 0;
  padding: 0;
  display: grid;
  border: none;
  background: none;
}

.woocommerce ul.products li.product.hec-product-card.hec-product-card--parts .hec-product-card__attr {
  flex-direction: row;
  align-items: baseline;
  flex-wrap: wrap;
  gap: 2px;
}

.woocommerce ul.products li.product.hec-product-card.hec-product-card--parts .hec-product-card__attr-key {
  font-size: 0.875rem;
  font-weight: 600;
  flex: 0 0 auto;
}

.woocommerce ul.products li.product.hec-product-card.hec-product-card--parts .hec-product-card__attr-key::after {
  content: "：";
}

.woocommerce ul.products li.product.hec-product-card.hec-product-card--parts .hec-product-card__attr-val {
  font-size: 0.75rem;
  min-width: 0;
  flex: 1 1 auto;
  white-space: normal;
}

/* Parts 第一条属性强调显示 */
.woocommerce ul.products li.product.hec-product-card.hec-product-card--parts
  .hec-product-card__attrs
  > li.hec-product-card__attr:first-child
  .hec-product-card__attr-key,
.woocommerce ul.products li.product.hec-product-card.hec-product-card--parts
  .hec-product-card__attrs
  > li.hec-product-card__attr:first-child
  .hec-product-card__attr-val {
  font-size: 0.875rem;
  font-weight: 600;
  color: #000;
}

/* 列布局下卡片等高 */
.woocommerce ul.products.columns-4 li.product.hec-product-card,
.woocommerce ul.products.columns-3 li.product.hec-product-card,
.woocommerce ul.products.columns-2 li.product.hec-product-card {
  display: flex;
}

.woocommerce ul.products li.product.hec-product-card .hec-product-card__inner {
  width: 100%;
}

/* ========== 区块产品网格（未使用本模板时，样式独立） ========== */
.wc-block-grid__product {
  background: #fff;
  border: 1px solid rgba(0, 0, 0, 0.08);
  border-radius: 12px;
  padding: 12px;
}

.wc-block-grid__product .wc-block-grid__product-image img {
  border-radius: 8px;
  width: 100%;
  aspect-ratio: 3 / 2;
  object-fit: cover;
}

/* ========== 产品页：主图随媒体原始比例（不强制 1:1） ========== */
/* 主图略小于「图」一栏整宽；窄屏仍撑满可用宽度 */
.woocommerce div.product div.images .woocommerce-product-gallery,
.elementor-widget-woocommerce-product-images .woocommerce-product-gallery {
  position: relative;
  width: 100%;
  margin-left: auto;
  margin-right: auto;
}

/* 主图 Flexslider 左右箭头（方向导航移入 .flex-viewport 后叠在图上，见 custom.js） */
.woocommerce-product-gallery .flex-viewport {
  position: relative;
}

.woocommerce-product-gallery .flex-viewport .flex-direction-nav {
  list-style: none;
  margin: 0;
  padding: 0;
  position: absolute;
  inset: 0;
  z-index: 4;
  pointer-events: none;
}

.woocommerce-product-gallery .flex-viewport .flex-direction-nav li {
  margin: 0;
  padding: 0;
}

.woocommerce-product-gallery .flex-viewport .flex-direction-nav a {
  box-sizing: border-box;
  pointer-events: auto;
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  width: 38px;
  height: 38px;
  margin: 0;
  padding: 0;
  border: 1px solid rgba(0, 0, 0, 0.1);
  border-radius: 50%;
  background: rgba(255, 255, 255, 0.94);
  box-shadow: 0 2px 10px rgba(0, 0, 0, 0.12);
  color: #1a1a1a;
  font-size: 2rem;
  font-weight: 600;
  line-height: 30px;
  text-decoration: none !important;
  overflow: hidden;
  opacity: 1;
  display: flex;
  justify-content: center;
  transition: background 0.2s ease, border-color 0.2s ease, opacity 0.2s ease, box-shadow 0.2s ease;
}

.woocommerce-product-gallery .flex-viewport .flex-direction-nav a.flex-prev {
  left: 4px;
}

.woocommerce-product-gallery .flex-viewport .flex-direction-nav a.flex-next {
  right: 4px;
}

.woocommerce-product-gallery .flex-viewport .flex-direction-nav a:hover:not(.flex-disabled) {
  border-color: rgba(0, 64, 133, 0.45);
  background: rgba(0, 64, 133, 0.06);
}

.woocommerce-product-gallery .flex-viewport .flex-direction-nav a.flex-disabled {
  opacity: 0.35;
  cursor: default;
  pointer-events: none;
}

.woocommerce div.product div.images .woocommerce-product-gallery .flex-viewport,
.elementor-widget-woocommerce-product-images .woocommerce-product-gallery .flex-viewport {
  height: auto !important;
  max-height: none !important;
}

.woocommerce div.product div.images .flex-viewport .woocommerce-product-gallery__wrapper,
.elementor-widget-woocommerce-product-images .flex-viewport .woocommerce-product-gallery__wrapper {
  height: auto !important;
  min-height: 0 !important;
}

.woocommerce div.product div.images .flex-viewport .woocommerce-product-gallery__image,
.elementor-widget-woocommerce-product-images .flex-viewport .woocommerce-product-gallery__image {
  height: auto;
  min-height: 0;
}

.woocommerce div.product div.images .woocommerce-product-gallery__image,
.elementor-widget-woocommerce-product-images .woocommerce-product-gallery__image {
  position: relative;
  box-sizing: border-box;
}

.woocommerce div.product div.images .woocommerce-product-gallery__image > a,
.elementor-widget-woocommerce-product-images .woocommerce-product-gallery__image > a {
  display: block;
  position: relative;
  left: auto;
  top: auto;
  width: 100%;
  height: auto;
}

.woocommerce div.product div.images .woocommerce-product-gallery__image img,
.elementor-widget-woocommerce-product-images .woocommerce-product-gallery__image img {
  width: 100% !important;
  height: auto !important;
  max-height: none !important;
  display: block;
}

/* Flexslider 初始化前 / 未启用主图轮播：wrapper 直接挂在 gallery 下 */
.woocommerce div.product div.images .woocommerce-product-gallery > .woocommerce-product-gallery__wrapper {
  overflow: hidden;
  position: relative;
}

.woocommerce div.product div.images .woocommerce-product-gallery > .woocommerce-product-gallery__wrapper > .woocommerce-product-gallery__image {
  height: auto;
}

/* ========== 产品页：缩略图一行 5 个 + 左右箭头叠在缩略图上 ========== */
.hec-product-thumb-strip {
  position: relative;
  width: 100%;
  margin: 12px 0 0;
  box-sizing: border-box;
}

.hec-product-thumb-strip__viewport {
  width: 100%;
  min-width: 0;
  overflow-x: auto;
  overflow-y: hidden;
  -webkit-overflow-scrolling: touch;
  scroll-behavior: smooth;
  scrollbar-width: none;
}

.hec-product-thumb-strip__viewport::-webkit-scrollbar {
  display: none;
}

.hec-product-thumb-strip__btn {
  box-sizing: border-box;
  position: absolute;
  top: 50%;
  z-index: 2;
  transform: translateY(-50%);
  width: 38px;
  height: 38px;
  padding: 0;
  margin: 0;
  border: 1px solid rgba(0, 0, 0, 0.1);
  border-radius: 50%;
  background: rgba(255, 255, 255, 0.94);
  box-shadow: 0 2px 10px rgba(0, 0, 0, 0.12);
  color: #1a1a1a;
  font-size: 2rem;
  font-weight: 600;
  line-height: 1;
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: center;
  transition: background 0.2s ease, border-color 0.2s ease, opacity 0.2s ease, box-shadow 0.2s ease;
}

.hec-product-thumb-strip__btn--prev {
  left: 4px;
}

.hec-product-thumb-strip__btn--next {
  right: 4px;
}

.hec-product-thumb-strip__btn:hover:not(:disabled) {
  border-color: rgba(0, 64, 133, 0.45);
  background: rgba(0, 64, 133, 0.06);
}

.hec-product-thumb-strip__btn:disabled {
  opacity: 0.35;
  cursor: default;
}

.hec-product-thumb-strip:not(.hec-product-thumb-strip--scrollable) .hec-product-thumb-strip__btn {
  display: none;
}

.hec-product-thumb-strip .flex-control-thumbs,
.woocommerce-product-gallery .hec-product-thumb-strip .flex-control-thumbs {
  display: flex !important;
  flex-wrap: nowrap !important;
  align-items: center;
  gap: 8px;
  float: none !important;
  width: max-content !important;
  min-width: 100%;
  max-width: none !important;
  margin: 0 !important;
  padding: 0 !important;
  overflow: visible;
}

.hec-product-thumb-strip .flex-control-thumbs li {
  float: none !important;
  box-sizing: border-box;
  margin: 0 !important;
  padding: 0 !important;
}

.hec-product-thumb-strip .flex-control-thumbs li img {
  display: block;
  width: 100% !important;
  height: auto !important;
  aspect-ratio: 1 / 1;
  max-width: none !important;
  object-fit: cover;
  border-radius: 6px;
  opacity: 0.72;
  transition: opacity 0.2s ease, box-shadow 0.2s ease;
}

.hec-product-thumb-strip .flex-control-thumbs li:hover img,
.hec-product-thumb-strip .flex-control-thumbs li.flex-active img {
  opacity: 1;
  box-shadow: 0 0 0 2px rgba(0, 64, 133, 0.45);
}