/*
 * ILM Components -- Breadcrumbs.
 *
 * An ordered list laid out on one line, with the separator drawn rather than
 * written. A `/` typed into the markup would be read aloud between every pair
 * of crumbs; a `::after` is not in the accessibility tree at all, and the list
 * structure carries the meaning instead.
 */

.ilm-component--wordpress-breadcrumbs {
	display: block;
	margin-block: 0 var(--ilm-c-space-sm);
	font-size: 0.9em;
}

.ilm-breadcrumbs__list {
	display: flex;
	flex-wrap: wrap;
	align-items: baseline;
	gap: 0.5em;
	margin: 0;
	padding: 0;
	list-style: none;
	justify-content: var(--ilm-c-text);
}

.ilm-breadcrumbs__item {
	margin: 0;
}

.ilm-breadcrumbs__item:not(:last-child)::after {
	content: "/";
	margin-inline-start: 0.5em;
	opacity: 0.5;
}

.ilm-breadcrumbs__link {
	color: inherit;
}

.ilm-breadcrumbs__item--current {
	opacity: 0.75;
}
