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

@layer components {
  .markdown-content {
    @apply text-left w-full;
  }

  .markdown-content p {
    @apply mb-4 last:mb-0;
  }

  .markdown-content h1,
  .markdown-content h2,
  .markdown-content h3 {
    @apply font-bold mb-2 mt-6 first:mt-0;
  }

  .markdown-content h1 {
    @apply text-2xl;
  }

  .markdown-content h2 {
    @apply text-xl;
  }

  .markdown-content h3 {
    @apply text-lg;
  }

  .markdown-content pre {
    @apply bg-gray-700/50 rounded-lg p-3 my-4 overflow-x-auto;
  }

  .markdown-content code {
    @apply bg-gray-700/50 rounded px-1.5 py-0.5 font-mono text-sm;
  }

  .markdown-content pre code {
    @apply bg-transparent p-0;
  }

  .markdown-content ul {
    @apply list-disc pl-6 mb-4 space-y-2;
  }

  .markdown-content ol {
    @apply list-decimal pl-6 mb-4 space-y-2;
  }

  .markdown-content li {
    @apply pl-2;
  }

  .markdown-content li > p {
    @apply inline;
  }

  .markdown-content blockquote {
    @apply border-l-4 border-purple-500/50 pl-4 mb-4 italic;
  }
}

@layer utilities {
  .animate-pulse {
    animation: pulse 1s cubic-bezier(0.4, 0, 0.6, 1) infinite;
  }
}

@keyframes pulse {
  0%, 100% { opacity: 1; }
  50% { opacity: 0; }
}