#navbar .nav-link {
  position: relative;
  color: #333;
  font-weight: 500;
  transition: color 0.3s;
}


#navbar .nav-pills .nav-link:hover,
#navbar .nav-pills .nav-link:focus,
#navbar .nav-pills .nav-link.active,
#navbar .nav-pills .show > .nav-link {
  background-color: transparent !important;
  color: #198754 !important;
  box-shadow: none !important;
}

#navbar .nav-link::after {
  content: "";
  position: absolute;
  bottom: 0;
  left: 50%;
  width: 0;
  height: 2px;
  background: #198754;
  transition: all 0.3s ease;
}

#navbar .nav-link:hover::after,
#navbar .nav-link.active::after {
    width: 100%;
    left: 0;
}

#navbar .nav-link.active {
  color: #198754 !important;
  font-weight: 600;
}