/* Smooth transition for the navbar when scrolling */
.transition-navbar {
  transition: all 0.3s ease-in-out;
}

/* Add a subtle hover effect to the links */
.navbar-dark .navbar-nav .nav-link {
  transition: color 0.2s ease;
}

.navbar-dark .navbar-nav .nav-link:hover {
  color: #0dcaf0; /* Bootstrap's 'info' blue */
}

/* Optional: Slightly darker background when the JS 'scrolled' class is added */
.navbar.scrolled {
  background-color: #1a1e21 !important;
  box-shadow: 0 4px 12px rgba(0,0,0,0.3);
}