.badges {
	display: flex;
	gap: var(--nova-space-2xs);
}

.badges__item {
	align-items: flex-start;
	border-radius: var(--nova-border-rounded);
	background: var(--badge-bg-color, transparent);
	color: var(--badge-color, var(--nova-color-text));
	border: 1px solid var(--badge-border-color, var(--nova-color-text));
	display: flex;
	font: 700 10px / 120% var(--nova-font-sans-bold);
	padding: var(--nova-space-2xs, 10px) 15px;
	text-transform: uppercase;
	pointer-events: none;
}

.badges--hovered .badges__item {
	background: var(--nova-color-brand-charcoal);
	border-color: var(--nova-color-text);
	color: var(--nova-color-brand-reverse);
}