/* Animation entfernen um Verzögerung zu vermeiden */

.mobile_nav.opened .et_mobile_menu {
display:block !important;
}

/* X-Symbol im ausgeklappten mobilen Menü */

.mobile_nav.opened .mobile_menu_bar:before {
content: '\4d';
}

/* Obere Linie im mobilen Menü entfernen*/

.et_mobile_menu {
border-top:0;
}


/* ##########  Navigation im Header rechtsbündig  ################# */
/* Menü + Logo nach rechts im Header */
/* Nur Header-Row auf volle Breite ziehen */


/* Menülinks im Header unten ausrichten */
.et_pb_menu__wrap li a {
  display: flex;
  align-items: flex-end;  /* Text nach unten */
  height: 100%;           /* volle Höhe vom Header nutzen */
  padding-bottom: 5px;    /* optionaler Abstand */
}


/* Menü rechtsbündig erzwingen */
#menu-shopallekatgegorienmenue {
  margin-left: auto !important;
  margin-right: 0 !important;
  display: flex !important;
  justify-content: flex-end !important;
  width: auto !important;
}

/*#########  Proper Collapsable Mobile Menu   #############*/
/*Style the icon's placeholder*/
ul.et_mobile_menu li.menu-item-has-children .mobile-toggle,
ul.et_mobile_menu li.page_item_has_children .mobile-toggle,
.et-db #et-boc .et-l ul.et_mobile_menu li.menu-item-has-children .mobile-toggle,
.et-db #et-boc .et-l ul.et_mobile_menu li.page_item_has_children .mobile-toggle {
	width: 44px;
	height: 100%;
	padding: 0px !important;
	max-height: 44px;
	position: absolute;
	right: 0px;
	top: 0px;
	z-index: 999;
	background-color: transparent;
	border-bottom: 0;
	text-align: center;
}
ul.et_mobile_menu > li.menu-item-has-children,
ul.et_mobile_menu > li.page_item_has_children,
ul.et_mobile_menu > li.menu-item-has-children .sub-menu li.menu-item-has-children,
.et-db #et-boc .et-l ul.et_mobile_menu > li.menu-item-has-children,
.et-db #et-boc .et-l ul.et_mobile_menu > li.page_item_has_children,
.et-db #et-boc .et-l ul.et_mobile_menu > li.menu-item-has-children .sub-menu li.menu-item-has-children {
	position: relative;
}
.et_mobile_menu .menu-item-has-children > a,
.et-db #et-boc .et-l .et_mobile_menu .menu-item-has-children > a {
	background-color: transparent;
}

/*Hide the Sub-menu*/
ul.et_mobile_menu .menu-item-has-children .sub-menu,
#main-header ul.et_mobile_menu .menu-item-has-children .sub-menu,
.et-db #et-boc .et-l ul.et_mobile_menu .menu-item-has-children .sub-menu,
.et-db #main-header ul.et_mobile_menu .menu-item-has-children .sub-menu {
	display: none !important;
	visibility: hidden !important;
}

/*Show the sub-menu when the + icon is clicked*/
ul.et_mobile_menu .menu-item-has-children .sub-menu.visible,
#main-header ul.et_mobile_menu .menu-item-has-children .sub-menu.visible,
.et-db #et-boc .et-l ul.et_mobile_menu .menu-item-has-children .sub-menu.visible,
.et-db #main-header ul.et_mobile_menu .menu-item-has-children .sub-menu.visible {
	display: block !important;
	visibility: visible !important;
}

/*Create the opening/closing icon using the SVG Icons*/
ul.et_mobile_menu li.menu-item-has-children .mobile-toggle .dt-icons,
.et-db #et-boc .et-l ul.et_mobile_menu li.menu-item-has-children .mobile-toggle .dt-icons {
	top: 3px;
	position: relative;
}

/*Hide the closing icon if the sub-menu is not open*/
ul.et_mobile_menu li.menu-item-has-children:not(.dt-open) .mobile-toggle .dt-close-icon,
.et-db #et-boc .et-l ul.et_mobile_menu li.menu-item-has-children:not(.dt-open) .mobile-toggle .dt-close-icon {
	display: none;
}

/*Hide the opening icon if the sub-menu is open*/
ul.et_mobile_menu li.menu-item-has-children.dt-open > .mobile-toggle .dt-open-icon,
.et-db #et-boc .et-l ul.et_mobile_menu li.menu-item-has-children.dt-open > .mobile-toggle .dt-open-icon {
	display: none;
}


/* Mobile Menü scrollbar machen */
.et_mobile_menu {
  max-height: 80vh;      /* nimmt max. 80% der Bildschirmhöhe */
  overflow-y: auto;      /* vertikales Scrollen erlauben */
  -webkit-overflow-scrolling: touch; /* weiches Scrollen auf iOS */
}

/* Abstand verringern */
.et-db #et-boc .et-l .et_mobile_menu li a  {
	padding: 4px;
}




/* Nur das Menü mit Klasse "Kleines-Menue" immer ausgeklappt lassen */
.kleines-Menue .et_mobile_nav_menu {
  display: none !important; /* Hamburger ausblenden */
}

.kleines-Menue .et_pb_menu__menu {
  display: block !important; /* Normales Menü immer sichtbar */
}

/* Damit die Menüpunkte auch auf Mobile untereinander angezeigt werden */
@media (max-width: 980px) {
  .kleines-Menue .et_pb_menu__menu ul.et-menu {
    display: block !important;
    flex-direction: column !important;
  }

  .kleines-Menue .et_pb_menu__menu ul.et-menu > li {
    display: block !important;
    margin: 5px 0;
  }
}


/* Plus-Icon im mobilen Menü/Submenü sauber ausrichten */
/* Submenu Toggle (Plus/Minus) in Divi vertikal zentrieren */
/* Toggle-Button (Plus/Minus) bei mobilen Menüs mittig ausrichten */
.et_mobile_menu .menu-item-has-children {
  position: relative; /* damit das Toggle relativ zu diesem LI positioniert wird */
}

.et_mobile_menu .menu-item-has-children > .mobile-toggle {
  position: absolute;
  right: 15px;
  top: 50%;
  transform: translateY(-20%);
  line-height: 1;
  height: auto;
  display: flex;
  align-items: center;
}


/* Breite der Submenü-Links dynamisch oder flexibel machen */
.et-menu li li a {
  width: auto !important;       /* statt fester 200px */
  min-width: 260px;             /* nicht kleiner als 200px */
  white-space: wrap;          /* kein Zeilenumbruch */
  max-width: none !important;   /* Begrenzung komplett entfernen */
}

/* Submenüs in der Desktop-Ansicht verbreitern */
@media (min-width: 981px) {
  /* Submenüs allgemein verbreitern */
  .et-menu li ul.sub-menu {
    min-width: 300px;   /* Standardbreite anpassen */
    width: auto;        /* automatisch so breit wie nötig */
    /*white-space: nowrap;  kein Zeilenumbruch bei langen Wörtern */
  }

  /* Unterpunkte wieder sauber untereinander */
  .et-menu li ul.sub-menu li {
    display: block;
  }
}

/* --- Dropdowns besser handhaben --- */

//* Erste Ebene (immer nach unten) 
.et-menu > li > .sub-menu {
    position: absolute;
    top: 100%;
    left: 0;
    bottom: auto;
    z-index: 9999;
}*/

/* Ab 2. Ebene standardmäßig nach rechts
.et-menu .sub-menu .sub-menu {
    position: absolute;
    top: 0;
    left: 100%;
    bottom: auto;
    margin-left: 5px;
    z-index: 9999;
}*/ 

/* ########   only-first-level ########### */


//* Backup / visueller Schutz: nur in der Header-Instanz */
.et_pb_menu_1_tb_header.js-only-first-header ul.et-menu li.only-first-level > .sub-menu .sub-menu {
    display: none !important;
    visibility: hidden !important;
    pointer-events: none !important;
}

/* Pfeile / Indikatoren nur in der Header-Instanz ausblenden */
.et_pb_menu_1_tb_header.js-only-first-header ul.et-menu li.only-first-level > a:after,
.et_pb_menu_1_tb_header.js-only-first-header ul.et-menu li.only-first-level > a .sub-arrow,
.et_pb_menu_1_tb_header.js-only-first-header ul.et-menu li.only-first-level .menu-toggle,
.et_pb_menu_1_tb_header.js-only-first-header ul.et-menu li.only-first-level .icon {
    display: none !important;
    content: none !important;
}

/* Sicherheit: falls Divi später Icons per background-image anfügt */
.et_pb_menu_1_tb_header.js-only-first-header ul.et-menu li.only-first-level > a {
    background-image: none !important;
}