/**
 * Mobile Mega Menu Styles
 * 
 * Styles for the mobile mega menu component
 * 
 * @package MOESCH
 */

.mobile-mega-menu {
  width: 100%;
}

.mobile-mega-menu__dropdown {
  display: none;
  width: 100%;
  background: white;
  position: relative;
  z-index: 1;
}

.mobile-mega-menu__dropdown:not(.hidden) {
  display: block !important;
}

.mobile-mega-menu__tabs-nav {
  width: 100%;
}

.mobile-mega-menu__tab-item {
  width: 100%;
}

.mobile-mega-menu__tab-button {
  width: 100%;
  border: none;
  background: none;
  cursor: pointer;
}

.mobile-mega-menu__tab-links {
  width: 100%;
}

.mobile-mega-menu__tab-links:not(.hidden) {
  display: block !important;
}

.mobile-mega-menu__back-btn {
  border: none;
  background: none;
  cursor: pointer;
  width: 100%;
  text-align: left;
}

.mobile-mega-menu__link {
  width: 100%;
  text-decoration: none;
}

.mobile-mega-menu__link:hover {
  text-decoration: none;
}

/* Ensure proper spacing and visibility */
.mobile-mega-menu ul {
  list-style: none;
  margin: 0;
  padding: 0;
}

.mobile-mega-menu li {
  margin: 0;
  padding: 0;
}

/* Debug styles - remove in production */
.mobile-mega-menu__dropdown.debug {
  border: 2px solid red;
  background: yellow;
}

/* Mobile search functionality */
.mobile-mega-menu__search-container {
  display: flex;
  flex-direction: column;
}

/* Mobile search close button initially hidden */
.search-box__close {
  display: none;
}

/* Show close button when search is active */
.mobile-search-active .search-box__close {
  display: block !important;
}

/* Mobile search active state - moves search to top */
.mobile-mega-menu__search.mobile-search-active {
  order: -1; /* Move to top using flexbox order */
}

/* Mobile search dropdown positioning */
.mobile-mega-menu__search .search-dropdown {
  position: static;
  background: transparent;
  box-shadow: none;
  margin-top: 0.5rem;
}

/* Hide CTA button and search when navigating to products/applications */
.js-header .c-btn--primary.mobile-hide-on-navigation {
  display: none !important;
}

.mobile-mega-menu__search.mobile-hide-on-navigation {
  display: none !important;
}

.mobile-mega-menu__contact-button.mobile-hide-on-navigation {
  display: none !important;
}

#mobile-search-products {
  .search-product {
    text-decoration: none;
    margin-bottom: 0.85rem;
    h4 {
      text-decoration: none;
    }
    img {
      min-width: 4.625rem;
      min-height: 3.6rem;
      max-width: 4.625rem;
      max-height: 3.6rem;
    }
  }
}

.search-dropdown__section {
  width: calc(100vw - 2.5rem);
}