/**
 * Каталог: карточки товара одного размера независимо от того,
 * есть ли у товара фотография и сколько строк в названии.
 */

/*
 * Кадр под фото всегда одинаковый: заглушка занимает столько же места.
 * Содержимое кладём абсолютно — иначе высокая картинка растягивает кадр,
 * потому что aspect-ratio уступает размеру содержимого.
 */
.wd-loop-prod-thumb {
	position: relative;
	display: block;
	aspect-ratio: 16 / 9;
	min-block-size: 0;
	overflow: hidden;
	background: var(--pb-surface, #f0f2f5);
}

.wd-loop-prod-thumb .wd-product-img-link,
.wd-loop-prod-thumb .wd-product-img-hover {
	position: absolute;
	inset: 0;
	display: block;
	inline-size: 100%;
	block-size: 100%;
}

.wd-loop-prod-thumb img {
	inline-size: 100%;
	block-size: 100%;
	max-inline-size: none;
	object-fit: cover;
}

/* Заглушку не растягиваем — показываем по центру в исходном виде. */
.wd-loop-prod-thumb img[src*="woocommerce-placeholder"] {
	object-fit: contain;
	padding: 18%;
	opacity: .45;
}

.wd-product .wd-product-wrapper,
.wd-product .wp-block-wd-li-product-card {
	display: flex;
	flex-direction: column;
	block-size: 100%;
}

/* Две строки под название и категорию — соседние карточки не разъезжаются. */
.wd-product .wd-entities-title {
	display: -webkit-box;
	-webkit-line-clamp: 2;
	-webkit-box-orient: vertical;
	min-block-size: 2.6em;
	overflow: hidden;
}

.wd-product .wd-product-cats {
	display: -webkit-box;
	-webkit-line-clamp: 2;
	-webkit-box-orient: vertical;
	min-block-size: 2.6em;
	overflow: hidden;
}

/* Кнопка прижата к низу карточки. */
.wd-product .wd-add-btn,
.wd-product .wd-product-cta {
	margin-block-start: auto;
}