/* =============================================================
   AMZEAL CREATIVES V83 SINGLE ACTIVE MOBILE MENU FIX
   Fix: Home must NOT remain selected when another page is open.
   Only one item gets the active border, controlled by body[data-current-page].
   ============================================================= */

/* 1. Reset every mobile menu item, including any old active/is-active classes */
body #mobileMenu.premium-mobile-menu .premium-mobile-menu-nav .premium-mobile-menu-link,
body #mobileMenu.premium-mobile-menu .premium-mobile-menu-nav .premium-mobile-menu-link.active,
body #mobileMenu.premium-mobile-menu .premium-mobile-menu-nav .premium-mobile-menu-link.is-active,
body #mobileMenu.premium-mobile-menu .premium-mobile-menu-nav .premium-mobile-menu-link[aria-current="page"]{
  background:transparent !important;
  border:2px solid transparent !important;
  box-shadow:none !important;
  color:#172033 !important;
  transform:none !important;
}

/* 2. Reset every icon too */
body #mobileMenu.premium-mobile-menu .premium-mobile-menu-nav .premium-mobile-menu-link .mobile-menu-icon,
body #mobileMenu.premium-mobile-menu .premium-mobile-menu-nav .premium-mobile-menu-link.active .mobile-menu-icon,
body #mobileMenu.premium-mobile-menu .premium-mobile-menu-nav .premium-mobile-menu-link.is-active .mobile-menu-icon,
body #mobileMenu.premium-mobile-menu .premium-mobile-menu-nav .premium-mobile-menu-link[aria-current="page"] .mobile-menu-icon{
  background:#edf8ff !important;
  color:#2563eb !important;
  box-shadow:none !important;
  border:0 !important;
}

/* 3. Clean hover only for non-current links */
body #mobileMenu.premium-mobile-menu .premium-mobile-menu-nav .premium-mobile-menu-link:hover{
  background:#f5faff !important;
  border-color:transparent !important;
}

/* 4. Apply the selected style ONLY by page key. This overrides all old active classes. */
body[data-current-page="home"] #mobileMenu.premium-mobile-menu .premium-mobile-menu-nav .premium-mobile-menu-link[data-menu-key="home"],
body[data-current-page="about"] #mobileMenu.premium-mobile-menu .premium-mobile-menu-nav .premium-mobile-menu-link[data-menu-key="about"],
body[data-current-page="services"] #mobileMenu.premium-mobile-menu .premium-mobile-menu-nav .premium-mobile-menu-link[data-menu-key="services"],
body[data-current-page="portfolio"] #mobileMenu.premium-mobile-menu .premium-mobile-menu-nav .premium-mobile-menu-link[data-menu-key="portfolio"],
body[data-current-page="industries"] #mobileMenu.premium-mobile-menu .premium-mobile-menu-nav .premium-mobile-menu-link[data-menu-key="industries"],
body[data-current-page="contact"] #mobileMenu.premium-mobile-menu .premium-mobile-menu-nav .premium-mobile-menu-link[data-menu-key="contact"]{
  background:linear-gradient(180deg,#f8fcff 0%,#edf7ff 100%) !important;
  border:2px solid #72c3ff !important;
  color:#155eef !important;
  box-shadow:0 12px 26px rgba(37,99,235,.12), inset 0 0 0 1px rgba(255,255,255,.82) !important;
}

/* 5. Apply the selected icon ONLY by page key */
body[data-current-page="home"] #mobileMenu.premium-mobile-menu .premium-mobile-menu-nav .premium-mobile-menu-link[data-menu-key="home"] .mobile-menu-icon,
body[data-current-page="about"] #mobileMenu.premium-mobile-menu .premium-mobile-menu-nav .premium-mobile-menu-link[data-menu-key="about"] .mobile-menu-icon,
body[data-current-page="services"] #mobileMenu.premium-mobile-menu .premium-mobile-menu-nav .premium-mobile-menu-link[data-menu-key="services"] .mobile-menu-icon,
body[data-current-page="portfolio"] #mobileMenu.premium-mobile-menu .premium-mobile-menu-nav .premium-mobile-menu-link[data-menu-key="portfolio"] .mobile-menu-icon,
body[data-current-page="industries"] #mobileMenu.premium-mobile-menu .premium-mobile-menu-nav .premium-mobile-menu-link[data-menu-key="industries"] .mobile-menu-icon,
body[data-current-page="contact"] #mobileMenu.premium-mobile-menu .premium-mobile-menu-nav .premium-mobile-menu-link[data-menu-key="contact"] .mobile-menu-icon{
  background:linear-gradient(135deg,#2563eb 0%,#1bb9e9 100%) !important;
  color:#ffffff !important;
  box-shadow:0 12px 24px rgba(37,99,235,.24) !important;
}

/* 6. Current page hover should stay selected, not add a second visual */
body[data-current-page="home"] #mobileMenu.premium-mobile-menu .premium-mobile-menu-nav .premium-mobile-menu-link[data-menu-key="home"]:hover,
body[data-current-page="about"] #mobileMenu.premium-mobile-menu .premium-mobile-menu-nav .premium-mobile-menu-link[data-menu-key="about"]:hover,
body[data-current-page="services"] #mobileMenu.premium-mobile-menu .premium-mobile-menu-nav .premium-mobile-menu-link[data-menu-key="services"]:hover,
body[data-current-page="portfolio"] #mobileMenu.premium-mobile-menu .premium-mobile-menu-nav .premium-mobile-menu-link[data-menu-key="portfolio"]:hover,
body[data-current-page="industries"] #mobileMenu.premium-mobile-menu .premium-mobile-menu-nav .premium-mobile-menu-link[data-menu-key="industries"]:hover,
body[data-current-page="contact"] #mobileMenu.premium-mobile-menu .premium-mobile-menu-nav .premium-mobile-menu-link[data-menu-key="contact"]:hover{
  background:linear-gradient(180deg,#f8fcff 0%,#edf7ff 100%) !important;
  border-color:#72c3ff !important;
}

/* 7. Keep CTA buttons clean from V82 */
body #mobileMenu.premium-mobile-menu .premium-mobile-menu-cta{
  min-height:62px !important;
  border-radius:22px !important;
  border:0 !important;
  background:linear-gradient(135deg,#2563eb 0%,#18b7df 100%) !important;
  color:#ffffff !important;
  font-size:16px !important;
  font-weight:850 !important;
  display:flex !important;
  align-items:center !important;
  justify-content:center !important;
  gap:12px !important;
  box-shadow:0 18px 40px rgba(37,99,235,.26) !important;
  text-decoration:none !important;
}

body #mobileMenu.premium-mobile-menu .premium-mobile-menu-whatsapp{
  min-height:60px !important;
  border-radius:22px !important;
  border:1px solid rgba(34,197,94,.28) !important;
  background:linear-gradient(180deg,#f0fdf4 0%,#ecfdf5 100%) !important;
  color:#047857 !important;
  font-size:16px !important;
  font-weight:850 !important;
  display:flex !important;
  align-items:center !important;
  justify-content:center !important;
  gap:12px !important;
  box-shadow:0 14px 30px rgba(16,185,129,.11) !important;
  text-decoration:none !important;
}

body #mobileMenu.premium-mobile-menu .mobile-cta-icon{
  width:28px !important;
  height:28px !important;
  min-width:28px !important;
  display:inline-flex !important;
  align-items:center !important;
  justify-content:center !important;
  border-radius:11px !important;
  background:rgba(255,255,255,.17) !important;
  color:#ffffff !important;
}

body #mobileMenu.premium-mobile-menu .mobile-whatsapp-icon{
  width:28px !important;
  height:28px !important;
  min-width:28px !important;
  display:inline-flex !important;
  align-items:center !important;
  justify-content:center !important;
  border-radius:999px !important;
  background:#16a34a !important;
  color:#ffffff !important;
}