@tailwind base;
@tailwind components;
@tailwind utilities;

@layer components {
  .nav-link {
    @apply text-gray-700 dark:text-gray-300 hover:bg-gray-700 hover:text-white px-3 py-2 rounded-md text-sm font-medium;
  }

  .mobile-nav-link {
    @apply text-gray-300 hover:bg-gray-700 hover:text-white block px-3 py-2 rounded-md text-base font-medium;
  }
}

html {
  scroll-behavior: smooth;
}

body {
  @apply transition-colors duration-300;
}