/* ==========================================================================
   かなさホーム — パンくず（template-parts/kanasa/breadcrumb.php。Figma c-breadcrumb）
   - PC: Kanasa/PC/Body-S（15px）。ハウス 14px・区切りの › 12px。いまのページは濃い文字
   - SP: 行の高さ 44px（押しやすさ）・Kanasa/SP/Body-S（14px）。1行に収め、最後の項目（記事の題名など）は末尾を「…」で省く
   ========================================================================== */

.c-breadcrumb__list {
	display: flex;
	flex-wrap: wrap;
	gap: var(--space-2xs) var(--space-xs);
	align-items: center;
	font: var(--text-kanasa-body-s);
	letter-spacing: var(--ls-kanasa);
	color: var(--kanasa-text-secondary);
}

.c-breadcrumb__item {
	display: inline-flex;
	gap: var(--space-xs);
	align-items: center;
	min-width: 0;
}

.c-breadcrumb__link {
	display: inline-flex;
	gap: var(--space-xs);
	align-items: center;
	color: inherit;
	text-decoration: none;
}

.c-breadcrumb__home {
	width: 14px;
	height: 14px;
}

.c-breadcrumb__separator {
	width: 12px;
	height: 12px;
}

.c-breadcrumb__item--current .c-breadcrumb__text {
	color: var(--kanasa-text-primary);
}

@media (hover: hover) {
	.c-breadcrumb__link:hover span {
		color: var(--kanasa-text-green);
		text-decoration: underline;
		text-underline-offset: 4px;
	}
}

@media (max-width: 767px) {
	.c-breadcrumb__list {
		flex-wrap: nowrap;
		gap: 6px;
		min-height: 44px;
		white-space: nowrap;
	}

	.c-breadcrumb__item {
		flex-shrink: 0;
		gap: 6px;
	}

	.c-breadcrumb__link {
		gap: 6px;
		min-height: 44px;
	}

	.c-breadcrumb__home {
		width: 16px;
		height: 16px;
	}

	.c-breadcrumb__separator {
		width: 14px;
		height: 14px;
	}

	/* 最後の項目は残りの幅に入るだけ出し、末尾を「…」に */
	.c-breadcrumb__item--current {
		flex: 0 1 auto;
		overflow: hidden;
	}

	.c-breadcrumb__item--current .c-breadcrumb__text {
		overflow: hidden;
		text-overflow: ellipsis;
	}
}