/*
 * Design System - AELITA
 * components/breadcrumbs.css - cars category catalog breadcrumbs.
 *
 * Scoped to .a-catalog (added to the catalog breadcrumb container only). It
 * reproduces the legacy catalog breadcrumb appearance 1:1. The legacy
 * .breadcrumbs* rules stay in main.css/media.css and keep serving every other
 * template; they are not removed. Scoped selectors have higher specificity, so
 * they win on the catalog only.
 *
 * Tokens are used only where the value matches exactly (--fs-small 14px,
 * --fs-body 16px, --c-ink-300 #8c98ad). Literals kept as token debt:
 * #33343e breadcrumb text, 20px link size, 20px vertical padding.
 *
 * Loaded on cars_category archives only (see inc/enqueue.php).
 */

.a-catalog.breadcrumbs {
	padding-bottom: 20px;
	font-size: var(--fs-small); /* 14px */
	color: #33343e;
}

.a-catalog .breadcrumbs-link,
.a-catalog .breadcrumbs span {
	color: var(--c-ink-300); /* #8c98ad */
	text-transform: capitalize;
	font-size: 20px;
}

.a-catalog .breadcrumbs-wrapper {
	font-size: var(--fs-body); /* 16px */
}

@media (max-width: 768px) {
	.a-catalog.breadcrumbs {
		padding-top: 20px;
	}
}