/**
 * [wct_stats] — publiczny licznik stanu katalogu.
 * Zmienne --wct-* jak w reszcie frontu (wct-search.css, wct-device.css):
 * bez wtyczki "whatcartool-style" dziedziczą domyślny wygląd z fallbacków,
 * z nią przejmują kolory/typografię/promienie ustawione tam przez klienta.
 */
.wct-stats {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(190px, 1fr));
	gap: 16px;
	margin: 24px 0;
}

.wct-stats__card {
	display: flex;
	flex-direction: column;
	gap: 4px;
	padding: 22px 20px;
	background: var(--wct-surface, #fff);
	border: 1px solid var(--wct-border, #e4e8ee);
	border-radius: var(--wct-radius-card, 14px);
	text-decoration: none;
	transition: border-color .15s ease, box-shadow .15s ease, transform .15s ease;
}

a.wct-stats__card:hover,
a.wct-stats__card:focus-visible {
	border-color: var(--wct-accent, #1769ff);
	box-shadow: 0 6px 18px rgba(0, 0, 0, .06);
	transform: translateY(-2px);
}

.wct-stats__value {
	font-size: 34px;
	font-weight: 700;
	line-height: 1.15;
	color: var(--wct-accent, #1769ff);
	font-variant-numeric: tabular-nums;
}

.wct-stats__label {
	font-size: var(--wct-font-size, 15px);
	font-weight: 600;
	color: var(--wct-ink, #1c2530);
}

.wct-stats__sub {
	font-size: var(--wct-font-size-sm, 13px);
	color: var(--wct-muted, #5a6675);
}

@media (max-width: 480px) {
	.wct-stats {
		grid-template-columns: repeat(2, 1fr);
		gap: 10px;
	}
	.wct-stats__card { padding: 16px 14px; }
	.wct-stats__value { font-size: 26px; }
}