@import "tailwindcss";

.blog-content h2 {
    @apply text-3xl font-bold text-gray-900 mt-10 mb-5;
}

.blog-content h3 {
    @apply text-2xl font-semibold text-gray-900 mt-8 mb-4;
}

.blog-content h4 {
    @apply text-xl font-semibold text-gray-800 mt-6 mb-3;
}

.blog-content p {
    @apply text-lg leading-8 text-gray-700 mb-6;
}

.blog-content ul {
    @apply list-disc pl-6 my-6;
}

.blog-content ol {
    @apply list-decimal pl-6 my-6;
}

.blog-content li {
    @apply mb-2;
}

.blog-content img {
    @apply rounded-xl my-8 mx-auto;
}

.blog-content pre {
    @apply bg-gray-900 text-white p-5 rounded-xl overflow-x-auto my-6;
}

.blog-content code {
    @apply bg-gray-100 px-1 py-0.5 rounded text-red-600;
}

.blog-content pre code {
    @apply bg-transparent text-white p-0;
}