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

@layer base {
  body {
    @apply bg-gray-50 text-gray-900 antialiased;
  }
}

@layer components {
  .chat-container {
    @apply flex flex-col h-screen max-w-4xl mx-auto bg-white shadow-lg;
  }
  
  .message-bubble {
    @apply rounded-2xl px-4 py-3 max-w-xs md:max-w-md break-words;
  }
  
  .user-bubble {
    @apply bg-blue-600 text-white ml-auto;
  }
  
  .assistant-bubble {
    @apply bg-gray-200 text-gray-800 mr-auto;
  }
}