/* Account Menu Styles */

/* Desktop Account Menu */
nav[class*="hidden md:flex items-center space-x-4"] {
  display: none;
}

@media (min-width: 768px) {
  nav[class*="hidden md:flex items-center space-x-4"] {
    display: flex;
  }
  
  /* Account menu items */
  .menu-item-login a {
    display: flex;
    align-items: center;
    padding: 0.5rem 1rem;
    color: #4b5563;
    transition: color 0.3s ease;
  }
  
  .menu-item-login a:hover {
    color: #ec4899; /* primary color */
  }
  
  .menu-item-register a {
    display: flex;
    align-items: center;
    padding: 0.5rem 1rem;
    background-color: rgba(236, 72, 153, 0.1);
    color: #ec4899;
    border-radius: 9999px;
    transition: all 0.3s ease;
  }
  
  .menu-item-register a:hover {
    background-color: #ec4899;
    color: #ffffff;
  }
}

/* Mobile Account Menu */
#mobile-menu .menu-item {
  width: 100%;
}

#mobile-menu .menu-item a {
  display: flex;
  align-items: center;
  width: 100%;
  padding: 0.75rem 1rem;
  color: #4b5563;
  transition: color 0.3s ease;
}

#mobile-menu .menu-item a:hover {
  color: #ec4899;
}

#mobile-menu .menu-item-register a {
  justify-content: center;
  background-color: rgba(236, 72, 153, 0.1);
  color: #ec4899;
  border-radius: 9999px;
  transition: all 0.3s ease;
  margin-top: 0.5rem;
}

#mobile-menu .menu-item-register a:hover {
  background-color: #ec4899;
  color: #ffffff;
}