/**
 * Breadcrumb Navigation — Product Page
 * Styles Blocksy's built-in .ct-breadcrumbs to match Figma node 23583:50871
 *
 * @see ClickUp Task: 86ewyqyw9
 */

/* Hero section wrapper: remove default margin, set height */
.single-product .hero-section {
	margin-bottom: 12px !important;
}

.single-product .hero-section .entry-header {
	display: flex;
	align-items: center;
}

/* Breadcrumb nav container */
.single-product .ct-breadcrumbs {
	display: flex;
	align-items: center;
	font-family: 'Barlow', sans-serif;
	font-weight: 400;
	font-size: 14px;
	color: #4a4a4a;
	width: 100%;
}

/* Breadcrumb links */
.single-product .ct-breadcrumbs a {
	font-size: 14px;
	color: #4a4a4a;
	text-decoration: none;
	transition: text-decoration 0.2s ease;
}

.single-product .ct-breadcrumbs a:hover {
	text-decoration: underline;
}

/* Breadcrumb text spans */
.single-product .ct-breadcrumbs span {
	font-size: 14px;
	color: #4a4a4a;
}

/* Separator */
.single-product .ct-breadcrumbs .ct-separator {
	margin: 0 6px;
	color: #4a4a4a;
}

/* Current page (last item) */
.single-product .ct-breadcrumbs .last-item span {
	color: #4a4a4a;
}

/* Match header left/right spacing on mobile and tablet */
@media (max-width: 1024px) {
	.single-product .hero-section.is-width-constrained,
	.single-product .product-entry-wrapper.is-width-constrained {
		width: calc(100% - 32px) !important;
		margin-inline: auto !important;
	}
}

/* Responsive — mobile: horizontal scroll for long breadcrumbs to save vertical space */
@media (max-width: 689px) {
	.single-product .hero-section .entry-header {
		min-height: 36px;
	}

	.single-product .ct-breadcrumbs {
		flex-wrap: nowrap;
		overflow-x: auto;
		overflow-y: hidden;
		white-space: nowrap;
		-webkit-overflow-scrolling: touch;
		scrollbar-width: none;
		-ms-overflow-style: none;
	}

	.single-product .ct-breadcrumbs::-webkit-scrollbar {
		display: none;
	}

	.single-product .ct-breadcrumbs > * {
		flex-shrink: 0;
	}
}