/**
 * Counter: .mk-counter (templates/components/counter.php).
 * 14×14 circle, accent background, white Inter Bold 8/100% centred.
 * The WooCommerce Mini-Cart badge gets the same look (woo-mini-cart.css).
 */

.mk-counter {
	display: inline-grid;
	place-items: center;
	box-sizing: border-box;
	min-inline-size: var(--wp--custom--counter--size);
	block-size: var(--wp--custom--counter--size);
	padding-inline: var(--wp--preset--spacing--2);
	border-radius: var(--wp--custom--counter--radius);
	background-color: var(--wp--custom--color--action--primary--default);
	color: var(--wp--custom--color--text--on-action);
	font-family: var(--wp--custom--text--counter--font-family);
	font-size: var(--wp--custom--text--counter--font-size);
	font-weight: var(--wp--custom--text--counter--font-weight);
	line-height: var(--wp--custom--text--counter--line-height);
	letter-spacing: var(--wp--custom--text--counter--letter-spacing);
	text-align: center;
	pointer-events: none;
}

.mk-counter[hidden] {
	display: none;
}