@import 'tailwindcss/base';
@import 'tailwindcss/components';
@import 'tailwindcss/utilities';

/* Custom styles */
@layer components {
  .btn-primary {
    @apply bg-teal-700 hover:bg-teal-800 text-white font-medium py-2 px-4 rounded focus:outline-none focus:ring-2 focus:ring-teal-500 focus:ring-opacity-50 transition-colors;
  }
  
  .note-item {
    @apply p-4 border-b border-gray-200 hover:bg-gray-50 transition-colors cursor-pointer;
  }
}