/**
 * Rounded media: .mk-rounded-media (templates/components/rounded-media.php).
 * 237 × 350 at most (keeps the ratio when narrower), radius 10.
 */

.mk-rounded-media {
	inline-size: min(100%, var(--wp--custom--rounded-media--width));
	margin: 0;
	aspect-ratio: var(--wp--custom--rounded-media--ratio);
	overflow: hidden;
	border-radius: var(--wp--custom--rounded-media--radius);
	background-color: var(--wp--custom--color--surface--hover);
}

/* Two classes: beats WooCommerce's `.woocommerce img { height: auto }`. */
.mk-rounded-media .mk-rounded-media__item {
	display: block;
	inline-size: 100%;
	block-size: 100%;
	object-fit: cover;
}