/**
 * Breadcrumb — compact, toegankelijk
 */

.breadcrumb {
	padding-block: var(--space-4);
	background: var(--color-surface);
	border-bottom: 1px solid rgba(22, 59, 109, 0.06);
}

.breadcrumb__list {
	list-style: none;
	margin: 0;
	padding: 0;
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: var(--space-2) var(--space-3);
	font-size: var(--text-breadcrumb);
}

.breadcrumb__item {
	display: inline-flex;
	align-items: center;
	gap: var(--space-2);
}

.breadcrumb__item:not(:last-child)::after {
	content: "/";
	color: var(--color-text-muted);
	opacity: 0.45;
	font-weight: 400;
	margin-left: var(--space-2);
}

.breadcrumb__link {
	color: var(--color-brand);
	text-decoration: none;
	font-weight: 600;
}

.breadcrumb__link:hover {
	text-decoration: underline;
}

.breadcrumb__item--current .breadcrumb__text {
	color: var(--color-text-muted);
	font-weight: 500;
}

/* Alias local-service breadcrumb */
.local-service-breadcrumb__list {
	list-style: none;
	margin: 0;
	padding: 0 0 var(--space-4);
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: var(--space-2) var(--space-3);
	font-size: var(--text-breadcrumb);
}

.local-service-breadcrumb__item:not(:last-child)::after {
	content: "/";
	color: var(--color-text-muted);
	opacity: 0.45;
	margin-left: var(--space-2);
}

.local-service-breadcrumb__link {
	color: var(--color-brand);
	font-weight: 600;
	text-decoration: none;
}

.local-service-breadcrumb__link:hover {
	text-decoration: underline;
}

.local-service-breadcrumb__item--current .local-service-breadcrumb__text {
	color: var(--color-text-muted);
	font-weight: 500;
}