/* Minimal custom overrides for Preline + Tailwind */

/* Blog post content styling (preserve existing markdown styles) */
.post-content, .article-content {
    @apply max-w-4xl mx-auto px-4;
}

.post-content h1, .article-content h1 {
    @apply text-3xl font-bold text-gray-900 mt-8 mb-4 pb-3 border-b-2 border-gray-200;
}

.post-content h2, .article-content h2 {
    @apply text-2xl font-bold text-gray-900 mt-6 mb-3;
}

.post-content h3, .article-content h3 {
    @apply text-xl font-semibold text-gray-800 mt-5 mb-2;
}

.post-content p, .article-content p {
    @apply text-gray-700 leading-relaxed my-4;
}

.post-content ul, .article-content ul {
    @apply list-disc list-inside my-4 space-y-2;
}

.post-content ol, .article-content ol {
    @apply list-decimal list-inside my-4 space-y-2;
}

.post-content table, .article-content table {
    @apply w-full border-collapse my-6 bg-white rounded-lg overflow-hidden shadow-sm;
}

.post-content table thead, .article-content table thead {
    @apply bg-gray-50;
}

.post-content table th, .article-content table th {
    @apply px-4 py-3 text-left text-sm font-semibold text-gray-900 border-b-2 border-gray-200;
}

.post-content table td, .article-content table td {
    @apply px-4 py-3 text-sm text-gray-700 border-b border-gray-200;
}

.post-content table tbody tr:hover, .article-content table tbody tr:hover {
    @apply bg-gray-50;
}

.post-content code, .article-content code {
    @apply bg-gray-100 px-2 py-1 rounded text-sm font-mono text-gray-800;
}

.post-content pre, .article-content pre {
    @apply bg-gray-900 text-gray-100 p-4 rounded-lg overflow-x-auto my-4;
}

.post-content pre code, .article-content pre code {
    @apply bg-transparent text-gray-100 p-0;
}

.post-content blockquote, .article-content blockquote {
    @apply border-l-4 border-blue-500 bg-blue-50 p-4 my-4 italic text-gray-700;
}

.post-content a, .article-content a {
    @apply text-blue-600 hover:text-blue-800 underline;
}

.post-content hr, .article-content hr {
    @apply my-8 border-t-2 border-gray-200;
}

.post-content strong, .article-content strong {
    @apply font-bold text-gray-900;
}

.post-content em, .article-content em {
    @apply italic text-gray-600;
}

.post-content img, .article-content img {
    @apply max-w-full h-auto rounded-lg my-6 shadow-md;
}

/* Blog/News header styling */
.post-header, .article-header {
    @apply text-center py-12 border-b-2 border-gray-200 mb-8;
}

.post-header h1, .article-header h1 {
    @apply text-4xl md:text-5xl font-bold text-gray-900 mb-4;
}

.post-meta, .article-meta {
    @apply flex justify-center gap-4 text-sm text-gray-600;
}

.post-navigation, .article-navigation {
    @apply text-center py-8 mt-12 border-t-2 border-gray-200;
}

.post-tags {
    @apply mt-12 pt-8 border-t-2 border-gray-200;
}

.post-tags h3 {
    @apply text-xl font-semibold text-gray-900 mb-4;
}

.tag-list {
    @apply flex flex-wrap gap-2;
}

.tag {
    @apply inline-block px-3 py-1 bg-blue-100 text-blue-800 rounded-full text-sm font-medium;
}

/* Ensure old CSS classes don't interfere */
.site-hdr, .site-ftr, .container, .hero, .btn, .card {
    all: unset;
}