/* ISELON SDN. BHD. Corporate Website - Navigation Styles
   Additional styles for navigation components */

/* Mobile Menu Icon */
.navbar-toggle {
  flex-direction: column;
  gap: 5px;
  width: 24px;
  height: 18px;
  padding: 0;
}

.navbar-toggle span {
  width: 100%;
  height: 2px;
  background-color: var(--color-cloud-white);
  transition: all 0.3s ease;
}

/* Active menu icon animation */
.navbar-toggle.active span:nth-child(1) {
  transform: rotate(45deg) translate(5px, 5px);
}

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

.navbar-toggle.active span:nth-child(3) {
  transform: rotate(-45deg) translate(5px, -5px);
}

/* Smooth Scroll */
html {
  scroll-behavior: smooth;
}

/* Active Navigation Link */
.navbar-link.active {
  color: var(--color-knowledge-gold);
}

.navbar-link.active::after {
  width: 100%;
}

/* Navbar Logo Image */
.navbar-logo-img {
  max-height: 100px;
  max-width: 100%;
  height: auto;
  width: auto;
  display: block;
}

/* Large view logo */
.navbar-brand-lg .navbar-logo-img {
  max-height: 120px;
}
/* Website 21: Products contains the Universal AI Note submenu */
.navbar-dropdown-menu { min-width: 245px; }
.navbar-dropdown-menu a { white-space: nowrap; }
@media (max-width: 768px) {
 .navbar-dropdown-menu { display: flex; position: static; box-shadow: none; background: transparent; padding: 0 0 0 1rem; }
 .navbar-dropdown-menu a { color: #ffffff; white-space: normal; }
}