
/* menu */

#main-nav {
	order: 4;
	max-width: 100%;
	text-transform: uppercase;
	box-shadow: 0px 5px 10px #8882;
	background-color: var(--white);	
}

#main-nav .gwm-wrapper .gwm-wrapper {
	text-transform: none;
}

#main-nav.gwMenu {
	width: 100%;
	margin-top: 10px;
	display: flex;
}

.gwMenu .shopMenu {
	display: none;
}

.gwMenu .homeMenu {
	--item-background-color: var(--main-color);
	--item-background-color-hover: var(--main-color);
	text-indent: -9999px;
}

.gwMenu .homeMenu a::before {
	content:url('img/Home_weiss.png');
	position: absolute;
	left: 50%;
	top: 50%;
	text-indent: 0;
	transform: translate(-50%, -46%);
}


.menuImage {
	max-height: 35px;
	width: auto;
	position: absolute;
	left: 10px;
	top: 50%;
	transform: translateY(-50%);
}
li > a:has(.menuImage),
li > .gwm-content:has(.menuImage) {
	padding-left: 47px!important;
}



#service-menu > .gwm-wrapper,
#kundenkonto-menu > .gwm-wrapper {
	transition: opacity 0.3s;
	opacity: 0;
	display: inline-flex;
	height: 0;
  	overflow: hidden;
}

#service-menu.gwm-clicked > .gwm-wrapper,
#kundenkonto-menu.gwm-clicked > .gwm-wrapper,
#service-menu:hover > .gwm-wrapper,
#kundenkonto-menu:hover > .gwm-wrapper {
	opacity: 0;
	height: inherit;
  	overflow: inherit;
}

#service-menu.opacity-transition > .gwm-wrapper,
#service-menu:hover:not(.gwm-clicked) > .gwm-wrapper,
#kundenkonto-menu.opacity-transition > .gwm-wrapper,
#kundenkonto-menu:hover:not(.gwm-clicked) > .gwm-wrapper {
	opacity: 1;
	height: auto;
}

.isDesktop:not(.isTouchSupported) #service-menu:not(:hover) > .gwm-wrapper,
.isDesktop:not(.isTouchSupported) #kundenkonto-menu:not(:hover) > .gwm-wrapper {
	display: none;
}

.gwMenu .transition > .gwm-wrapper {
	display: inline-flex!important;
}


/* breadcrumb */

#products-breadcrumb,
#product-breadcrumb {
	background-color: var(--white);
	padding: 10px;
}

#products-breadcrumb {
	margin-left: 5px;
	margin-right: 5px;
}

.breadcrumb {
    --shopnav-background: #fff;
	/* justify-content: flex-end; */
	max-width: none;
}

#products-breadcrumb:has(.breadcrumb:empty),
#product-breadcrumb:has(.breadcrumb:empty),
.breadcrumb:empty {
	display: none;
}

#products-breadcrumb:has(.breadcrumb:empty) + * #shopSearchResult,
#product-breadcrumb:has(.breadcrumb:empty) + * #shopSearchResult,
#product-breadcrumb:has(.breadcrumb:empty) + #product-page {
	margin-top: 0;
}


.breadcrumb > li {
	margin-right: 5px;
}

.breadcrumb > li::after {
	transform: translate(5px, -50%);
}

.breadcrumb > li:first-child {
	margin-left: 0;
	padding-left: 0;
}

.breadcrumb > li:last-child {
	margin-right: 0;
	padding-right: 0;
}

.breadcrumb > li:last-child > a {
	color: var(--green);
}



.selected > .gwm-content,
.selected > a {
    color: var(--main-color);
    font-weight: bold;
}

#shopnav.gwMenu {
	--indent: 5px;
}

#shopnav li.gwm-isOpen > :not(.gwm-wrapper, ul) {
	padding-left: calc(var(--padding-left) + (var(--level) - 1) * var(--indent) -5px)
}


h2:has(+ #shopnav li[data-article-id="0"]) {
	display: none;
}

#shopnav:has(li[data-article-id="0"]) {
    display: none;
}

h2:has(+ #shopnav li[data-article-id="0"]) ~ .importantMessage {
	margin-top: 0;	
}

#shopnav .gwm-wrapper .gwm-wrapper a {
	border-bottom: none;
}


.gwm-wrapper .gwm-wrapper {
	--z-index: 1020;
}



/* kunden navigation */

#zum-shop,
nav .zum-shop a {
	background-color: var(--main-color);
	color: var(--white);
	align-items: center;
	display: flex;
	padding: 0 10px;
}

#kunden-navigation {
	order: 4;
	max-width: fit-content;
}

.kunden-navigation a::before {
	display: block;
	height: 30px;
	width: auto;
	position: relative;
	transform: none;
	padding: 0 5px;
}

/* blendet Text unter Icon aus */
#kunden-navigation a > span:first-of-type {
	display: none;
}

.kunden-navigation > .gwm-wrapper > ul > li > .content, 
.kunden-navigation > .gwm-wrapper > ul > li > a {
	padding-top: 0;
	padding-bottom: 0;
}

#loginWrapper {
	display: flex;
	justify-content: center;
	padding: 0 5px;
}

#kunden-navigation-login {
	background-color: var(--darkgrey);
	color: var(--white);
	text-decoration: none;
	padding: 6px 10px;
	height: var(--input-height);
	align-self: normal;
	align-items: center;
	display: inline-flex;
	border-radius: var(--button-border-radius);
}

#kunden-navigation .km-sortiment > a::before {
	content:url('img/menu.svg');
	transform: scale(1.5);
}
.km-dauerbestellung > a::before {		
	content:url('img/Smartphone_Dauerbestellung.png');
}
.km-merkzettel > a::before {
	content:url('img/Smartphone_Merkzettel.png');
}
.km-pausieren > a::before {
	content:url('img/Smartphone_Pausieren.png');
}
.km-service > a::before {
	content:url('img/phone.svg');
	transform: scale(1.3) translateY(2px);
}
#kunden-navigation .km-warenkorb > a::before {
	content:url('img/cart.svg');
	transform: scale(1.5);
}
.km-kundenkonto > a::before {		
	content:url('img/login.svg');
	transform: scale(1.4) translateY(2px);
}
.km-filter > a::before {		
	content:url('img/Smartphone_Filter.png');
}
.km-suche > a::before {		
	content:url('img/search-black.svg');
	transform: scale(1.5);
}

.kunden-navigation a::before {
	position: static;
	top: initial;
	left: inherit;
}

.km-reader > a::before {		
	content:url('img/reader.svg');
}

.kontomenu a,
.kontomenu a:visited {
	--cms-menu-text-color: var(--main-color);
	--cms-menu-padding: 0;
}

#customer-nav li > .gwm-wrapper {
	display: none;
}