/* CryptoDroom theme utilities (loaded after Tailwind CDN) */

html { scroll-behavior: smooth; }

body {
    background-color: #0f172a;
    background-image:
        radial-gradient(circle at 20% 0%, rgba(34,197,94,0.08), transparent 40%),
        radial-gradient(circle at 80% 100%, rgba(99,102,241,0.06), transparent 40%);
    background-attachment: fixed;
    color: #f1f5f9;
}

h1, h2, h3, h4 { font-family: 'Space Grotesk', system-ui, sans-serif; letter-spacing: -0.02em; }

/* Article content styling */
.cd-content h2 { font-size: 1.875rem; font-weight: 700; margin-top: 2.5rem; margin-bottom: 1rem; color: #f1f5f9; scroll-margin-top: 6rem; }
.cd-content h3 { font-size: 1.5rem; font-weight: 700; margin-top: 2rem; margin-bottom: 0.75rem; color: #f1f5f9; scroll-margin-top: 6rem; }
.cd-content p { color: #cbd5e1; line-height: 1.75; margin-bottom: 1.25rem; }
.cd-content a { color: #4ade80; text-decoration: underline; text-underline-offset: 3px; }
.cd-content a:hover { color: #22c55e; }
.cd-content blockquote { border-left: 4px solid #22c55e; padding-left: 1.25rem; margin: 1.5rem 0; font-style: italic; color: #f1f5f9; }
.cd-content ul, .cd-content ol { color: #cbd5e1; margin: 1rem 0 1.5rem 1.5rem; }
.cd-content ul li { list-style: disc; margin-bottom: 0.5rem; }
.cd-content ol li { list-style: decimal; margin-bottom: 0.5rem; }
.cd-content code { background: #1e293b; padding: 0.15rem 0.4rem; border-radius: 4px; font-family: 'JetBrains Mono', monospace; font-size: 0.9em; color: #4ade80; }
.cd-content pre { background: #0b1220; padding: 1rem 1.25rem; border-radius: 0.75rem; overflow-x: auto; border: 1px solid rgba(148,163,184,0.15); margin: 1.5rem 0; }
.cd-content pre code { background: transparent; padding: 0; color: #e2e8f0; }
.cd-content img, .cd-content figure { border-radius: 0.75rem; margin: 1.5rem 0; max-width: 100%; height: auto; }
.cd-content hr { border: 0; border-top: 1px solid rgba(148,163,184,0.2); margin: 2rem 0; }

/* WP pagination */
.nav-links { display: inline-flex; gap: 0.5rem; align-items: center; flex-wrap: wrap; justify-content: center; }
.nav-links .page-numbers,
.nav-links a.page-numbers,
.nav-links span.page-numbers {
    display: inline-flex; align-items: center; justify-content: center;
    min-width: 2.5rem; height: 2.5rem; padding: 0 0.75rem;
    border-radius: 0.5rem; border: 1px solid rgba(148,163,184,0.15);
    background: #172033; color: #94a3b8; font-size: 0.875rem; font-weight: 600;
    text-decoration: none; transition: all 0.2s;
}
.nav-links a.page-numbers:hover { background: #1e293b; color: #f1f5f9; }
.nav-links .page-numbers.current { background: #22c55e; color: #0f172a; border-color: #22c55e; box-shadow: 0 0 40px -10px rgba(34,197,94,0.5); }

/* Comments */
.comments-area .comment { border: 1px solid rgba(148,163,184,0.15); background: #172033; padding: 1rem 1.25rem; border-radius: 0.75rem; }
.comments-area .comment-meta { display: flex; align-items: center; gap: 0.5rem; margin-bottom: 0.5rem; font-size: 0.85rem; color: #94a3b8; }
.comments-area .comment-meta a { color: #f1f5f9; font-weight: 600; text-decoration: none; }
.comments-area .comment-content { color: #cbd5e1; }
.comments-area .reply { margin-top: 0.5rem; }
.comments-area .reply a { color: #4ade80; font-size: 0.85rem; }
.comment-form input[type=text],
.comment-form input[type=email],
.comment-form input[type=url] {
    width: 100%; padding: 0.6rem 0.8rem; border-radius: 0.5rem;
    background: #0f172a; border: 1px solid rgba(148,163,184,0.15);
    color: #f1f5f9;
}
.comment-form label { display: block; font-size: 0.85rem; color: #94a3b8; margin-bottom: 0.25rem; }

/* Line clamp helper (Tailwind CDN doesn't always include) */
.line-clamp-2 { display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }

/* Sparkline cell */
.cd-sparkline { display: inline-block; vertical-align: middle; }