/* Mobile Menu Customization for Erwinklier - Quark Theme */

/* Mobile menu background - white EVERYWHERE */
@media (max-width: 1023px) {
  /* Main header background */
  #header,
  #header.section {
    background: white !important;
    background-color: white !important;
    box-shadow: 0 2px 8px rgba(0,0,0,0.1);
  }
  
  /* Mobile menu toggle button (hamburger) */
  .mobile-menu {
    color: #0066cc !important;
  }
  
  .mobile-menu span {
    background-color: #0066cc !important;
  }
  
  /* ALL mobile menu containers - white background */
  .mobile-container,
  .mobile-container .overlay,
  .mobile-container #overlay,
  .overlay,
  #overlay,
  .overlay-menu,
  .overlay-menu header,
  .overlay-menu #header {
    background: white !important;
    background-color: white !important;
  }
  
  /* Hide GRAV logo in mobile overlay */
  .mobile-logo,
  .mobile-logo a,
  .mobile-logo svg {
    display: none !important;
  }
  
  /* Ensure header logo (Erwinklier) is visible */
  #header .navbar-section.logo .navbar-brand img,
  #header .navbar-section.logo .navbar-brand svg {
    display: inline-block !important;
    max-height: 45px !important;
    width: auto !important;
  }
  
  /* Menu items */
  .overlay-menu ul.tree li a {
    color: #333 !important;
    font-size: 1.3rem !important;
    padding: 1.2rem 2rem !important;
    border-bottom: 1px solid #f0f0f0;
    font-weight: 500;
  }
  
  .overlay-menu ul.tree li a:hover {
    background: #f8f8f8 !important;
    color: #0066cc !important;
  }
  
  /* Active menu item */
  .overlay-menu ul.tree li.active > a {
    background: #e6f2ff !important;
    color: #0066cc !important;
    font-weight: bold;
  }
  
  /* Dropdown menus */
  .overlay-menu ul.tree li ul {
    background: #f8f8f8 !important;
  }
  
  .overlay-menu ul.tree li ul li a {
    color: #555 !important;
    font-size: 1.1rem !important;
    padding: 0.9rem 2.5rem !important;
  }
  
  .overlay-menu ul.tree li ul li a:hover {
    background: #e0e0e0 !important;
    color: #0066cc !important;
  }
}