@layer base {
  html {
    scroll-behavior: smooth;
  }
}

#navbar.scrolled {
  @apply bg-[#1B4332]/95 backdrop-blur-md shadow-lg;
}

#navbar:not(.scrolled) .nav-link {
  text-shadow: 0 1px 3px rgba(0,0,0,0.3);
}

#navbar.scrolled .nav-link {
  text-shadow: none;
}

#navbar.scrolled #brand-text {
  @apply text-white;
}

#mobile-menu.show {
  display: block;
}

#toast.show {
  display: block;
  animation: slideIn 0.3s ease-out;
}

#toast.success {
  @apply border-green-500;
}

#toast.error {
  @apply border-red-500;
}

@keyframes slideIn {
  from {
    opacity: 0;
    transform: translateX(100px);
  }
  to {
    opacity: 1;
    transform: translateX(0);
  }
}

.testimonial-dot.active {
  @apply bg-[#40916C];
}

.testimonial-dot {
  @apply bg-gray-300;
}