/* ==========================================================================
   Productkaarten in lijsten (Product Collection, zoekresultaten, FacetWP)
   Site-breed: productkaarten staan op veel pagina's (shop, zoeken,
   gerelateerde producten). Logica: includes/product-loop.php
   ========================================================================== */

/* --- Klassieke add-to-cart knop: icoon en tekst naast elkaar --- */
.blossom-loop-atc a {
	display: inline-flex;
	align-items: center;
	gap: 8px;
}

/* Geen extra regelhoogte in de knop: hoogte komt alleen uit de padding,
   zodat icoon en tekst precies in het midden staan. Specifieker dan
   WooCommerce' eigen regel (line-height: inherit). */
.blossom-loop-atc.wp-block-button.wc-block-components-product-button .wc-block-components-product-button__button {
	line-height: 0;
}

/* WooCommerce zet na toevoegen een "Bekijk winkelwagen"-link naast de knop
   en een vinkje via ::after. Beide staan niet in het ontwerp. */
.blossom-loop-atc .added_to_cart {
	display: none !important;
}

.blossom-loop-atc a.added::after {
	display: none !important;
}

/* --- Prijs + formaat links uitgelijnd.
   :has() beperkt dit tot prijzen met een formaat eronder (de kaarten). --- */
.wp-block-woocommerce-product-price:has(.blossom-loop-format),
.wp-block-woocommerce-product-price:has(.blossom-loop-format) * {
	text-align: left !important;
	justify-content: flex-start !important;
	align-items: flex-start !important;
	margin-left: 0 !important;
	padding-left: 0 !important;
	text-indent: 0 !important;
}

/* --- Formaat onder de prijs --- */
.blossom-loop-format {
	display: block;
	color: #68707A;
	font-weight: 400;
	font-size: 16px;
	line-height: 1.4;
}