/* 商品页画廊修复：主题把整个画廊盒子设成 1:1 且 overflow:hidden，
   结果主图下方的缩略图条被裁掉，前台看起来只有一张图。
   这里只还原容器高度，主图仍按 1:1 预留空间（保留主题原本的 CLS 优化）。 */

.woocommerce div.product div.images {
	aspect-ratio: auto !important;
	height: auto !important;
}

.woocommerce div.product div.images .woocommerce-product-gallery {
	aspect-ratio: auto !important;
	height: auto !important;
	overflow: visible !important;
}

/* 主图区域继续锁 1:1，避免加载后高度跳动 */
.woocommerce div.product div.images .flex-viewport {
	aspect-ratio: 1 / 1;
	overflow: hidden;
}

/* 缩略图条 */
.woocommerce div.product div.images .flex-control-thumbs {
	display: flex !important;
	flex-wrap: wrap;
	gap: 10px;
	margin: 10px 0 0 !important;
	padding: 0;
	list-style: none;
}

.woocommerce div.product div.images .flex-control-thumbs li {
	width: 72px;
	height: 72px;
	float: none !important;
	margin: 0;
	cursor: pointer;
}

.woocommerce div.product div.images .flex-control-thumbs img {
	width: 100% !important;
	height: 100% !important;
	aspect-ratio: 1 / 1;
	object-fit: cover;
	border-radius: 4px;
	border: 2px solid transparent;
	opacity: .65;
	transition: opacity .15s ease, border-color .15s ease;
}

.woocommerce div.product div.images .flex-control-thumbs img.flex-active,
.woocommerce div.product div.images .flex-control-thumbs img:hover {
	border-color: var(--pati-primary, #2F4A3C);
	opacity: 1;
}

@media (max-width: 640px) {
	.woocommerce div.product div.images .flex-control-thumbs li {
		width: 60px;
		height: 60px;
	}
}

/* 评价区标题：主题把 h2 统一设成 35px，长商品名会撑成 3 行、压过商品主标题。
   这里降到 20px，并把「N reviews for」与商品名做出层级差。 */
.woocommerce div.product #reviews h2.woocommerce-Reviews-title,
.woocommerce div.product .woocommerce-Reviews .woocommerce-Reviews-title {
	font-size: 20px !important;
	line-height: 1.45 !important;
	font-weight: 400 !important;
	letter-spacing: 0 !important;
	color: #5b6b62 !important;
	margin: 0 0 18px !important;
	padding: 0 !important;
	text-transform: none !important;
}

.woocommerce div.product #reviews h2.woocommerce-Reviews-title strong,
.woocommerce div.product .woocommerce-Reviews .woocommerce-Reviews-title strong,
.woocommerce div.product #reviews h2.woocommerce-Reviews-title > span,
.woocommerce div.product .woocommerce-Reviews .woocommerce-Reviews-title > span {
	font-weight: 600 !important;
	color: #1a201c !important;
}

@media (max-width: 768px) {
	.woocommerce div.product #reviews h2.woocommerce-Reviews-title,
	.woocommerce div.product .woocommerce-Reviews .woocommerce-Reviews-title {
		font-size: 17px !important;
		line-height: 1.5 !important;
		margin-bottom: 14px !important;
	}

	/* 手机窄屏下商品名很长，加粗会显得厚重，只保留颜色差异 */
	.woocommerce div.product #reviews h2.woocommerce-Reviews-title > span,
	.woocommerce div.product .woocommerce-Reviews .woocommerce-Reviews-title > span {
		font-weight: 500 !important;
	}
}
