.component-breadcrumb {
	padding-top: 20px;
	padding-bottom: 4px;
	font-family: var(--component-font-family);
}

.component-breadcrumb__list {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 8px;
	margin: 0;
	padding: 0;
	list-style: none;
	font-size: 13px;
	color: var(--component-color-meta);
}

.component-breadcrumb__link {
	color: var(--component-color-meta);
	text-decoration: none;
}

.component-breadcrumb__link:hover,
.component-breadcrumb__link:focus-visible {
	color: var(--component-color-primary);
	text-decoration: underline;
}

.component-breadcrumb__item--current {
	color: var(--component-color-text);
	font-weight: 600;
}