/*
 * Token-driven, same rule as assets/css/components.css — only the cart
 * link badge and content wrapper spacing are framework-specific here;
 * WooCommerce's own product/cart/checkout markup is left untouched.
 */

.sfe-cart-link__anchor {
	display: inline-flex;
	align-items: center;
	gap: 0.35rem;
}

.sfe-cart-link__count {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-width: 1.35rem;
	height: 1.35rem;
	padding-inline: 0.3rem;
	border-radius: 999px;
	background: var(--color-accent);
	color: #fff;
	font-size: var(--text-xs);
	font-weight: 600;
}

.woocommerce-content .woocommerce-breadcrumb {
	margin-block-end: 1rem;
	color: var(--color-text-muted);
	font-size: var(--text-sm);
}

.woocommerce-content ul.products {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(260px, 1fr));
	gap: 1.5rem;
}

.woocommerce-content ul.products li.product {
	background: var(--color-surface);
	border: 1px solid var(--color-border);
	border-radius: 10px;
	padding: 1rem;
}