.offcanvas-btn


/* mobile menu open buttons */
.dj-offcanvas-dark .dj-offcanvas-logo img {
    max-width: 80px!important;
}


.card-body {
  -ms-flex: 1 1 auto;
  flex: 1 1 auto;
  min-height: 1px;
  padding: 1.25rem;
  position: absolute!;
  z-index: 999;
}

.dj-megamenu-select-dark .dj-mobile-open-btn,
.dj-megamenu-offcanvas-dark .dj-mobile-open-btn,
.dj-megamenu-accordion-dark .dj-mobile-open-btn {
	display              : inline-flex;
	justify-content      : center;
	align-items          : center;
	cursor               : pointer;
	margin               : 0 auto;
	padding              : 0;
	width                : 45px!important;
	height               : 45px!important;
	/*background           : #434343;
	color                : #e4e4e4;*/
	border               : none;
	text-align           : center;
	-webkit-border-radius: 3px;
	border-radius        : 3px;
	/*-webkit-transition   : background-color 0.2s ease-out, color 0.2s ease-out;
	transition           : background-color 0.2s ease-out, color 0.2s ease-out;*/
	text-decoration: none;
}
/*///////////////////////////////////////////*/
/*menü_quer*/
/* Standard: Mobile/Offcanvas bleibt vertikal */
.dj-offcanvas ul.dj-mobile-nav {
  display: block;
}

/* Nur ab 992px (oder anpassen an dein Breakpoint) nebeneinander */
@media (min-width: 992px) {
  .dj-offcanvas ul.dj-mobile-nav {
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    justify-content: center;
    padding: 0;
    margin: 0;
  }

  .dj-offcanvas ul.dj-mobile-nav > li {
    display: inline-block;
    margin: 0 15px;
  }

  .dj-offcanvas ul.dj-mobile-nav > li > a {
    display: block;
    padding: 10px;
  }
}


/*///////////////////////////////////////////*/
/* Wenn aktiv (geöffnet) */
/*.dj-offcanvas ul.dj-mobile-nav li.open > ul {
  display: block;
}*/


.dj-offcanvas {
  position:fixed;
  top:0;
  left:0;
  z-index:100;
  visibility:hidden;
  width:100%!important;
  /*max-width:100%;*/
  height:auto!important;
  overflow:hidden;
  /*-webkit-transition:all .3s;
  transition:all .3s;*/
   transition: max-height 0.3s ease;
  display:none;
  z-index:999
}
.dj-offcanvas.open,
.dj-megamenu-offcanvas.open {
  max-height: 100vh; /* wächst mit Inhalt bis Bildschirmhöhe */
}


.dj-offcanvas-overlay:after {
  background:none!important;
}
.dj-offcanvas-dark .dj-offcanvas-close-btn {
  display: block!important;
  font-size: 25px!important;
  line-height: 1;
  background: none;
  border:none;
  color: #f8f8f8;
  cursor: pointer;
  padding: 10px 12px;
  display: none!important;
}



/* 2. Ebene im Off-Canvas */
.dj-offcanvas .dj-megamenu li ul,
.dj-megamenu-offcanvas .dj-megamenu li ul {
  display: grid;              /* Grid-Layout nutzen */
  grid-template-columns: repeat(2, 1fr); /* 2 Spalten */
  gap: 10px 20px;             /* Abstand zwischen Zeilen/Spalten */
  list-style: none;           /* Aufzählungszeichen entfernen */
  padding: 0;
}

/* Optional: Links in den Untermenüs */
.dj-offcanvas .dj-megamenu li ul li,
.dj-megamenu-offcanvas .dj-megamenu li ul li {
  display: block;
  margin: 0;
}
