/*
 * Terminal Vibes — CSS custom pour blog-tech
 * À injecter dans Appearance > Customize > Additional CSS
 * ou via un plugin Custom CSS
 */

@import url('https://fonts.googleapis.com/css2?family=JetBrains+Mono:wght@400;700&display=swap');

:root {
  --bg-primary: #0d1117;
  --bg-secondary: #161b22;
  --bg-tertiary: #1c2129;
  --text-primary: #c9d1d9;
  --text-secondary: #8b949e;
  --text-accent: #58a6ff;
  --text-heading: #f0f6fc;
  --green: #3fb950;
  --green-dim: #238636;
  --orange: #d29922;
  --red: #f85149;
  --purple: #bc8cff;
  --border: #30363d;
  --code-bg: #161b22;
  --selection: rgba(56, 139, 253, 0.4);
}

/* Base */
body {
  background-color: var(--bg-primary) !important;
  color: var(--text-primary) !important;
  font-family: 'JetBrains Mono', 'Fira Code', 'Cascadia Code', monospace !important;
  font-size: 15px;
  line-height: 1.7;
}

::selection {
  background: var(--selection);
}

/* Liens */
a {
  color: var(--text-accent) !important;
  text-decoration: none !important;
}
a:hover {
  text-decoration: underline !important;
  color: var(--green) !important;
}

/* Titres */
h1, h2, h3, h4, h5, h6 {
  color: var(--text-heading) !important;
  font-family: 'JetBrains Mono', monospace !important;
}
h1::before { content: "# "; color: var(--green); }
h2::before { content: "## "; color: var(--green); }
h3::before { content: "### "; color: var(--green-dim); }

/* Code blocks */
pre, code {
  background-color: var(--code-bg) !important;
  color: var(--green) !important;
  border: 1px solid var(--border) !important;
  border-radius: 6px !important;
  font-family: 'JetBrains Mono', monospace !important;
}
pre {
  padding: 16px !important;
  overflow-x: auto;
  position: relative;
}
pre::before {
  content: "$ ";
  color: var(--green-dim);
  font-weight: bold;
}

/* Blocs de citation */
blockquote {
  border-left: 3px solid var(--green) !important;
  background-color: var(--bg-secondary) !important;
  padding: 12px 20px !important;
  color: var(--text-secondary) !important;
  font-style: italic;
}

/* Navigation */
nav, .site-header, .main-navigation {
  background-color: var(--bg-secondary) !important;
  border-bottom: 1px solid var(--border) !important;
}

/* Footer */
footer, .site-footer {
  background-color: var(--bg-secondary) !important;
  border-top: 1px solid var(--border) !important;
  color: var(--text-secondary) !important;
}

/* Articles */
article, .entry-content {
  background-color: var(--bg-primary) !important;
}
.entry-title a {
  color: var(--text-heading) !important;
}
.entry-meta, .post-date, .post-author {
  color: var(--text-secondary) !important;
  font-size: 0.85em;
}
.entry-meta::before {
  content: "→ ";
  color: var(--green);
}

/* Tags / catégories */
.tag-links a, .cat-links a, .wp-block-tag-cloud a {
  background-color: var(--bg-tertiary) !important;
  color: var(--green) !important;
  border: 1px solid var(--border) !important;
  border-radius: 3px !important;
  padding: 2px 8px !important;
  font-size: 0.8em !important;
}

/* Widgets / sidebar */
.widget {
  background-color: var(--bg-secondary) !important;
  border: 1px solid var(--border) !important;
  border-radius: 6px !important;
  padding: 16px !important;
}
.widget-title {
  color: var(--orange) !important;
  border-bottom: 1px solid var(--border);
  padding-bottom: 8px;
}

/* Scrollbar */
::-webkit-scrollbar { width: 8px; }
::-webkit-scrollbar-track { background: var(--bg-primary); }
::-webkit-scrollbar-thumb {
  background: var(--border);
  border-radius: 4px;
}
::-webkit-scrollbar-thumb:hover { background: var(--text-secondary); }

/* Curseur clignotant dans le titre du site */
.site-title::after {
  content: "█";
  animation: blink 1s step-end infinite;
  color: var(--green);
  margin-left: 4px;
}
@keyframes blink {
  50% { opacity: 0; }
}