.cwa-circular-charts {
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	gap: 20px;
	--cwa-track-color: #d9d9d9;
}

.cwa-circular-charts__item {
	display: flex;
	flex-direction: column;
	align-items: center;
	flex: 0 1 auto;
	max-width: 180px;
	text-align: center;
}

.cwa-circular-charts__ring {
	position: relative;
	display: flex;
	align-items: center;
	justify-content: center;
	width: 126px;
	height: 126px;
	border-radius: 50%;
	background: conic-gradient(
		var(--cwa-chart-color, #0b3a70) calc(var(--cwa-percentage, 0) * 1%),
		var(--cwa-track-color, #d9d9d9) 0
	);
}

.cwa-circular-charts__ring::before {
	content: "";
	position: absolute;
	inset: 6px;
	border-radius: 50%;
	background-color: #fff;
}

.cwa-circular-charts__value {
	position: relative;
	z-index: 1;
	color: #0b3a70;
	font-size: 33px;
	font-weight: 400;
	line-height: 1;
}

.cwa-circular-charts__label {
	margin-top: 12px;
	color: #0b3a70;
	font-size: 15px;
	line-height: 1.2;
}

@media (max-width: 767px) {
	.cwa-circular-charts__item {
		max-width: 160px;
	}

	.cwa-circular-charts__value {
		font-size: 28px;
	}

	.cwa-circular-charts__label {
		font-size: 14px;
	}
}
