.component.breadcrumb {
	position: relative;
	background-color: transparent;
	display: flex;
	flex-wrap: wrap;
	list-style: none
}

.component.breadcrumb>.component-content {
	max-width: 100%
}

.component.breadcrumb * {
	font-size: 14px
}

.component.breadcrumb ol {
	scrollbar-width: none;
	display: flex;
	white-space: nowrap;
	overflow-x: auto;
	padding: 10px 0;
	margin: 0
}

.component.breadcrumb ol::-webkit-scrollbar {
	display: none
}

.component.breadcrumb nav.gradient-left::before,
.component.breadcrumb nav.gradient-right::after {
	content: '';
	position: absolute;
	width: 40px;
	top: 0;
	bottom: 0
}

.component.breadcrumb nav.gradient-right::after {
	right: 0
}

.component.breadcrumb nav.gradient-left::before {
	left: 0;
	transform: rotate(180deg)
}

.component.breadcrumb li.last .separator {
	display: none
}

.component.breadcrumb li.home a>div {
	background-size: contain;
	background-position: center;
	background-repeat: no-repeat;
	width: 15px;
	height: 15px
}

.component.breadcrumb .breadcrumb-item {
	display: flex
}

.component.breadcrumb .breadcrumb-item.home a>div {
	background-image: url(../../../images/home__dark.svg)
}

.component.breadcrumb .separator,
.component.breadcrumb div {
	display: inline-block
}

.component.breadcrumb a:hover {
	text-decoration: underline
}

.component.breadcrumb .separator {
	margin: 0 8px;
	cursor: default
}

.dark-theme .component.breadcrumb * {
	color: #fff
}

.dark-theme .component.breadcrumb li.home a>div {
	background-image: url(../index_files/home.svg)
}

.dark-theme .component.breadcrumb nav::after,
.dark-theme .component.breadcrumb nav::before {
	background: linear-gradient(to right, rgba(255, 255, 255, 0), #12225c)
}

.light-theme .component.breadcrumb * {
	color: #12225c
}

.light-theme .component.breadcrumb li.home a>div {
	background-image: url(../index_files/home__dark.svg)
}

.light-theme .component.breadcrumb nav::after,
.light-theme .component.breadcrumb nav::before {
	background: linear-gradient(to right, rgba(255, 255, 255, 0), #f9f9fc)
}

.breadcrumb-item+.breadcrumb-item::before {
	display: none
}