/*
 * WooCommerce product listing & prices (charte §4, §5, §6).
 * Loaded on every page: product grids also appear outside shop pages (method §1.3).
 */

/*
 * Product and category cards = shop tags (geometry in components/tag.css, wrapper from
 * inc/woocommerce-loop.php). The `li` is the tag, `.ba-tag__face` its face. Kadence's card
 * background, shadow and padding are removed; the photo sits in an Écru frame like on the home page.
 */
.woocommerce ul.products li.product {
	overflow: visible;
	background: transparent;
	box-shadow: none;
	border-radius: 0;
}
.woocommerce ul.products li.product:nth-child(odd) { --tag-turn: -1.2deg; }
.woocommerce ul.products li.product:nth-child(even) { --tag-turn: 1deg; }
.woocommerce ul.products li.product:hover { --tag-turn: 0deg; }

.woocommerce ul.products li.product .ba-tag__face {
	gap: 14px;
	padding: 56px 16px 18px;
}
.woocommerce ul.products li.product a {
	text-decoration: none;
}
.woocommerce ul.products li.product .woocommerce-loop-image-link,
.woocommerce ul.products li.product.product-category > .ba-tag__face > a {
	display: flex;
	flex-direction: column;
	gap: 14px;
}
.woocommerce ul.products li.product img {
	box-sizing: border-box;
	width: 100%;
	height: auto;
	aspect-ratio: 1 / 1;
	object-fit: cover;
	padding: 9%;
	border-radius: 4px;
	background: var(--ba-ecru);
}
.woocommerce ul.products li.product .product-details {
	padding: 0;
	background: transparent;
}
.woocommerce ul.products li.product .woocommerce-loop-product__title,
.woocommerce ul.products li.product .woocommerce-loop-category__title {
	margin: 0;
	padding: 0;
	font-family: var(--ba-font-heading);
	font-size: 20px;
	line-height: 1.2;
	letter-spacing: -0.01em;
	color: var(--ba-encre);
}
.woocommerce ul.products li.product .woocommerce-loop-category__title .count {
	background: none;
	color: var(--ba-texte-doux);
	font-family: var(--ba-font-body);
	font-size: 16px;
	font-weight: 400;
}
.woocommerce ul.products li.product .price {
	display: block;
	margin-top: 12px;
	padding-top: 12px;
	border-top: var(--ba-stitch-width) dashed var(--ba-lin);
}
.woocommerce ul.products li.product .product-excerpt {
	display: none;
}

@media (max-width: 719px) {
	.woocommerce ul.products li.product {
		--tag-pad: 28px;
		--tag-eye: 18px;
		--tag-eye-top: 14px;
		--tag-eye-border: 3px;
		--tag-corner: 10px;
	}
	.woocommerce ul.products li.product:nth-child(4n+1),
	.woocommerce ul.products li.product:nth-child(4n) { --tag-turn: -1deg; }
	.woocommerce ul.products li.product:nth-child(4n+2),
	.woocommerce ul.products li.product:nth-child(4n+3) { --tag-turn: 1deg; }
	.woocommerce ul.products li.product .ba-tag__face {
		gap: 10px;
		padding: 42px 10px 12px;
	}
	.woocommerce ul.products li.product .woocommerce-loop-product__title,
	.woocommerce ul.products li.product .woocommerce-loop-category__title {
		font-size: 16px;
	}
}

/* Sale badge: Brique (promotions only). */
.woocommerce span.onsale {
	background: var(--ba-brique);
	color: var(--ba-blanc);
	border-radius: var(--ba-radius);
}

/* Prices: bold, Encre. */
.woocommerce .price,
.woocommerce .amount {
	font-weight: 700;
	color: var(--ba-encre);
}