/* mobile-navigation.css */

/* Hamburger Container */
   .hamburger-container {
      display: none;
      flex-direction: row;
      justify-content: center;
      flex-wrap: nowrap;
      width: 30%;
      z-index: 99999;
   }

   @media (min-width: 1000px) {
      .hamburger-container {
         display: none;
         justify-content: center;
      }
   }

   @media (max-width: 1000px) {
      .hamburger-container {
         display: flex;
         justify-content: center;
         align-items: center;
         width:33.3%;
         height:3.6rem;
         padding-left: 6rem;
      }
   }

/* Hamburger-Icon */
   .hamburger {
      cursor: pointer;
      width: 2rem;
      height: 1.3rem;
      position: relative;
   }

   .hamburger::before {
      content: 'Navigation';
      display: block;
      position: relative;
      left: -6rem;
      top:-0.12rem;
      font-weight: 600;
      color: #ffffff;
      font-family: Arial, Helvetica, sans-serif;
   }

   .hamburger span {
      position: absolute;
      left: 0;
      right: 0;
      height: 2px;
      background-color: #ffffff;
      border-radius: 2px;
      display: block;
      transition: all 0.2s ease;
   }

/* Ausgangspositionen */
.hamburger span:nth-child(1) {
   top: 0;
}

.hamburger span:nth-child(2) {
   top: 50%;
   transform: translateY(-50%);
   opacity: 1;
}

.hamburger span:nth-child(3) {
   bottom: 0;
}

/* Aktiver Zustand */
.hamburger.active span:nth-child(1) {
   top: 50%;
   transform: rotate(45deg);
}

.hamburger.active span:nth-child(2) {
   opacity: 0;
}

.hamburger.active span:nth-child(3) {
   top: 50%;
   transform: rotate(-45deg);
}

/* Mobile Menü Overlay */
   .mobile-menu-overlay {
      display: none;
      opacity: 0;
      position: fixed;
      top: 3.6rem;
      left: 0;
      width: 100%;
      height: 100%;
      background: linear-gradient(49deg, #5a9348, #73b260);
      z-index: 9999;
      overflow-y: auto;
      transition: opacity 0.3s ease;
   }

   .mobile-menu-overlay.active {
      display: block;
      opacity: 1;
   }

   .mobile-menu {
      padding: 20px;
      padding-top: 1rem;
   }

   .mobile-menu-section {
      padding-top:1.5rem;
   }

   .mobile-menu-headline {
      color: #b4d7d2;
      font-weight: 700;
      padding: 6px 0;
      letter-spacing: 0.2px;

   }

.mobile-menu-list {
   list-style: none;
   margin: 0;
   padding: 0;
   display: flex;
   flex-wrap: wrap;
}

.mobile-menu-list li {
   margin-bottom: 0.5rem;
   width:25%;
}

@media (max-width: 640px) {
   .mobile-menu-list li {
      width:50%;
   }
}

.mobile-menu-list li a {
   text-decoration: none;
   color: #333;
   font-size: 18px;
}

@media (max-width: 1000px) {
   .mobile-menu-list li a {
      color: #FFF;
      font-size: 1rem;
      font-weight:500;
      letter-spacing: 0.2px;
   }
}

/* Submenü */
.mobile-menu-list .sub-menu {
   display: none;
   margin-top: 10px;
   margin-left: 15px;
}

.mobile-menu-list li.menu-item-has-children > a::after {
   content: '\25BC';
   float: right;
}

.mobile-menu-list li.open > .sub-menu {
   display: block;
}

/* Responsive Anpassungen */
@media (min-width: 1000px) {
   .hamburger {
       display: none;
   }

   .mobile-menu-overlay {
       display: none !important;
   }
}