/* Navbar Link Width Fixes for QHKL Website */

/* Ensure nav-link elements have proper width for menu text */
.navbar-nav .nav-link {
  white-space: nowrap; /* Prevent text wrapping */
  display: inline-block; /* Ensure proper width calculation */
  min-width: auto; /* Allow natural width based on content */
  text-align: center; /* Center text within the link */
  transition: all 0.3s ease; /* Smooth transitions */
}

/* Desktop specific adjustments */
@media (min-width: 992px) {
  .navbar-nav .nav-link {
    padding-left: 1rem !important; /* Ensure adequate left padding */
    padding-right: 1rem !important; /* Ensure adequate right padding */
    margin-right: 0.5rem; /* Reduce margin for better spacing */
  }
  
  /* Remove the large margin-right that might be causing issues */
  .navbar-expand-lg .navbar-nav .nav-link {
    margin-right: 0.5rem !important; /* Override the 2rem margin */
  }
}

/* Mobile specific adjustments */
@media (max-width: 991px) {
  .navbar-nav .nav-link {
    padding: 0.75rem 1rem; /* Adequate padding for mobile */
    text-align: left; /* Left align on mobile */
    width: 100%; /* Full width on mobile */
    display: block; /* Block display for better mobile interaction */
  }
  
  .navbar-nav {
    width: 100%; /* Full width navbar on mobile */
  }
  
  .navbar-nav .nav-item {
    width: 100%; /* Full width nav items on mobile */
  }
}

/* Ensure nav-items don't constrain nav-links */
.navbar-nav .nav-item {
  display: inline-block; /* Allow natural sizing */
}

/* Language switcher specific adjustments */
.navbar-nav .dropdown-toggle {
  white-space: nowrap;
  padding-left: 1rem !important;
  padding-right: 1rem !important;
}

/* Hover and focus states */
.navbar-nav .nav-link:hover,
.navbar-nav .nav-link:focus {
  transform: translateY(-1px); /* Subtle lift effect */
}

/* Active state styling */
.navbar-nav .nav-link.active {
  font-weight: 600; /* Make active links slightly bolder */
}

/* Ensure proper spacing between nav items */
.navbar-nav .nav-item:not(:last-child) {
  margin-right: 0.25rem;
}

/* Fix for Chinese text which might need more space */
[lang="zh-cn"] .navbar-nav .nav-link {
  letter-spacing: 0.05em; /* Slight letter spacing for Chinese text */
}

/* Ensure dropdown items have proper width */
.navbar-nav .dropdown-menu {
  min-width: 150px; /* Minimum width for dropdown */
}

.navbar-nav .dropdown-item {
  white-space: nowrap; /* Prevent dropdown text wrapping */
  padding: 0.5rem 1rem; /* Adequate padding for dropdown items */
}