.kits {
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	gap: var(--s-2);
	list-style: none;
	padding: 0;
	margin: 0;
}

.kit {
	display: inline-flex;
	align-items: center;
	gap: var(--s-2);
	font-size: var(--font-xs);
	font-weight: var(--weight-bold);
	background-color: var(--color-bg-high);
	border: var(--border-style);
	border-radius: var(--radius-field);
	padding: var(--s-1) var(--s-3);
}

.kitName {
	overflow-x: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
}

.kitGear {
	display: inline-flex;
	align-items: center;
	gap: var(--s-1);
	margin-inline-start: var(--s-1);
}

.gearLink {
	display: inline-flex;
	align-items: center;
	border-radius: var(--radius-rounded);

	&:hover {
		filter: brightness(1.2);
	}
}
