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

@layer components {
  article {
    @apply prose prose-neutral dark:prose-invert;
    @apply prose-h1:scroll-m-20 prose-h1:text-4xl prose-h1:font-extrabold prose-h1:tracking-tight prose-h1:lg:text-5xl;
    @apply prose-h2:mt-10 prose-h2:scroll-m-20 prose-h2:border-b prose-h2:pb-2 prose-h2:text-3xl prose-h2:font-semibold prose-h2:tracking-tight prose-h2:transition-colors prose-h2:first:mt-0;
    @apply prose-h3:mt-8 prose-h3:scroll-m-20 prose-h3:text-2xl prose-h3:font-semibold prose-h3:tracking-tight;
    @apply prose-p:leading-7 prose-p:[&:not(:first-child)]:mt-6;
    @apply prose-a:font-medium prose-a:text-primary prose-a:underline prose-a:underline-offset-4;
    @apply prose-blockquote:mt-6 prose-blockquote:border-l-2 prose-blockquote:pl-6 prose-blockquote:italic;
    @apply prose-ul:my-6 prose-ul:ml-6 prose-ul:list-disc prose-ul:[&>li]:mt-2;
    @apply prose-pre:border prose-pre:border-border;
    @apply prose-img:mx-auto prose-img:my-auto;
  }
}