

/* Start:/local/templates/promolink/components/bitrix/breadcrumb/.default/style.css?17478358452132*/
.breadcrumbs {
	display: flex;
	flex-wrap: wrap;
	gap: 8px;
	align-items: center;
}

.breadcrumb_item {
	display: flex;
	align-items: center;
	gap: 8px;
	position: relative;
	cursor: pointer;
}

.breadcrumb_item::after {
	content: "|";
	font-size: 18px;
	color: var(--chern);
}

.breadcrumb_title {
	display: flex;
	align-items: center;
	gap: 5px;
	color: var(--chern);
	font-size: 14px;
	line-height: 20px;
	font-weight: 500;
}

.breadcrumb_item:has(.breadcrumb_sublist) .breadcrumb_title::after {
	transition: transform .2s;

	content: "";
	width: 14px;
	height: 14px;

	background: url(/local/templates/promolink/components/bitrix/breadcrumb/.default/./icons/arrow.svg) no-repeat center/contain;
}

.breadcrumb_sublist {
	display: flex;
	visibility: hidden;
	position: absolute;
	top: 100%;
	flex-direction: column;
	gap: 7px;
	padding: 12px 0 16px;
	width: 240px;
	z-index: 10;
	background: var(--white);
	border-radius: 10px;
	box-shadow: 0px 4px 10px 0px rgba(32, 64, 147, 0.051);
	max-height: 60vh;
	overflow: auto;
}

.breadcrumb_subitem {
	display: flex;
	justify-content: space-between;
	gap: 10px;
	padding: 0 12px 7px;
	color: var(--chern);
	border-bottom: 1px solid var(--chern);
	cursor: pointer;
}

.breadcrumb_subitem::after {
	content: "";
	display: block;

	width: 14px;
	height: 14px;

	background: url(/local/templates/promolink/components/bitrix/breadcrumb/.default/./icons/arrow.svg) no-repeat center/contain;
	transform: rotate(-90deg);
}

.breadcrumb_subitem:last-child {
	border-bottom: none;
	padding-bottom: 0;
}

.breadcrumb_item.last::after {
	content: none;
}

.breadcrumb_item.last .breadcrumb_title {
	color: var(--blue);
}

@media (min-width:1023px) {

	.breadcrumb_item:has(.breadcrumb_sublist):hover .breadcrumb_title::after {
		transform: rotate3d(1, 0, 0, 180deg);
	}

	.breadcrumb_item:has(.breadcrumb_sublist):hover .breadcrumb_sublist {
		/* display: flex; */
		visibility: visible;
	}

	.breadcrumb_sublist:hover {
		visibility: visible;

	}

}

@media(max-width:1024px) {

	.breadcrumb_item:has(.breadcrumb_sublist).--active .breadcrumb_title::after {
		transform: rotate3d(1, 0, 0, 180deg);
	}

	.breadcrumb_item:has(.breadcrumb_sublist).--active .breadcrumb_sublist {
		/* display: flex; */
		visibility: visible;
	}
}
/* End */
/* /local/templates/promolink/components/bitrix/breadcrumb/.default/style.css?17478358452132 */
