/* CheckSeoRank Custom CSS */

/* Smooth scroll behavior */
html { scroll-behavior: smooth; }

/* Utility */
[x-cloak] { display: none !important; }

/* Global H2 and Large Headings */
h2, .text-3xl {
    font-size: 35px !important;
    font-weight: 800 !important;
}

/* Prose content (blog posts) */
.prose h2 { margin-top: 2rem; margin-bottom: 1rem; }
.prose p { margin-bottom: 1rem; line-height: 1.75; }
.prose ul { margin-bottom: 1rem; padding-left: 1.5rem; }
.prose li { margin-bottom: 0.4rem; }
.prose a { text-decoration: underline; color: #0D9488; }
.prose blockquote { border-left: 3px solid #2DD4BF; padding-left: 1rem; font-style: italic; color: #5C6478; margin: 1.5rem 0; }
.prose pre { background: #1C2130; color: #e2e8f0; padding: 1rem; border-radius: 0.75rem; overflow-x: auto; margin-bottom: 1rem; }
.prose code { background: #EDEEF2; padding: 0.15rem 0.4rem; border-radius: 0.3rem; font-size: 0.85em; }
.prose pre code { background: none; padding: 0; }

/* Table Styles */
.prose table {
    width: 100% !important;
    border-collapse: collapse !important;
    margin: 2rem 0 !important;
    font-size: 0.95rem;
    overflow-x: auto;
    display: table; /* Reverting to table for standard behavior */
}

.prose th, .prose td {
    padding: 12px 16px !important;
    border: 1px solid #D3D6DE !important; /* Slightly darker border for better visibility */
    text-align: left !important;
}

.prose thead {
    background-color: #F7F8FA !important;
    border-bottom: 2px solid #AEB4C2 !important;
}

.prose th {
    font-weight: 700 !important;
    color: #111827 !important;
    text-transform: uppercase;
    font-size: 0.75rem;
    letter-spacing: 0.05em;
}

.prose tr:nth-child(even) {
    background-color: #F9FAFB !important;
}

.prose tr:hover {
    background-color: #F1F5F9 !important;
}

/* Metric bar animation */
.metric-bar { transition: width 0.8s cubic-bezier(0.4,0,0.2,1); }

/* Custom scrollbar */
::-webkit-scrollbar { width: 6px; height: 6px; }
::-webkit-scrollbar-track { background: #F7F8FA; }
::-webkit-scrollbar-thumb { background: #D3D6DE; border-radius: 3px; }
::-webkit-scrollbar-thumb:hover { background: #AEB4C2; }