/* CodeChef Blog Theme Overrides
   Make blog page match CodeChef product "hacker green" tone. */

/* Blog hero */
.blog-hero {
  background:
    radial-gradient(900px 420px at 20% 30%, rgba(0, 255, 65, 0.16), transparent 60%),
    radial-gradient(700px 360px at 85% 10%, rgba(57, 255, 20, 0.10), transparent 55%),
    linear-gradient(135deg, var(--darker-bg) 0%, var(--dark-bg) 100%) !important;
  border-bottom: 1px solid rgba(0, 255, 65, 0.12);
}

.blog-hero-title {
  color: var(--primary-green) !important;
  text-shadow: 0 0 18px var(--glow-green);
  letter-spacing: -0.02em;
}

.blog-hero-subtitle {
  color: var(--text-dim) !important;
  font-family: 'JetBrains Mono', ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace;
}

/* Posts area */
.blog-posts {
  background: var(--dark-bg) !important;
}

.posts-grid {
  margin-top: 28px;
}

/* Coming soon block should look like a terminal card */
.coming-soon-message {
  background: var(--terminal-bg);
  border: 1px solid var(--terminal-border);
  border-radius: 16px;
  padding: 3rem 2rem;
  box-shadow: 0 18px 55px rgba(0, 0, 0, 0.45);
}

.coming-soon-message h3 {
  color: var(--primary-green);
  text-shadow: 0 0 12px var(--glow-green);
  font-family: 'JetBrains Mono', ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace;
  letter-spacing: 0.2px;
}

.coming-soon-message p {
  color: var(--text-light);
}

/* If/when real posts exist, theme the cards too */
.blog-post {
  background: var(--terminal-bg) !important;
  border: 1px solid var(--terminal-border) !important;
}

.blog-post:hover {
  border-color: var(--primary-green) !important;
  box-shadow: 0 20px 60px rgba(0, 0, 0, 0.55), 0 0 26px rgba(0, 255, 65, 0.08) !important;
}

.post-title {
  color: var(--primary-green) !important;
  text-shadow: 0 0 12px rgba(0, 255, 65, 0.18);
}

.post-excerpt {
  color: var(--text-light) !important;
}

.post-meta {
  border-top: 1px solid rgba(255, 255, 255, 0.10) !important;
}

.post-date {
  color: var(--text-dim) !important;
  font-family: 'JetBrains Mono', ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace;
}

.post-link {
  color: var(--primary-green) !important;
}

.post-link:hover {
  color: var(--accent-green) !important;
}

/* Nav blog link colors should match green tone */
.nav-link.blog-link {
  color: var(--text-light) !important;
}

.nav-link.blog-link.active {
  color: var(--primary-green) !important;
}

/* Category filter (if added later) */
.blog-categories {
  background: rgba(0, 0, 0, 0.72) !important;
  border-bottom: 1px solid rgba(0, 255, 65, 0.10) !important;
}

.category-btn {
  background: rgba(255, 255, 255, 0.06) !important;
  color: var(--text-light) !important;
  border-color: transparent !important;
}

.category-btn:hover {
  background: rgba(0, 255, 65, 0.10) !important;
  color: var(--primary-green) !important;
}

.category-btn.active {
  background: rgba(0, 255, 65, 0.14) !important;
  color: var(--primary-green) !important;
  border-color: rgba(0, 255, 65, 0.22) !important;
}

