@import './highlight-github.css';
@tailwind base;
@tailwind components;
@tailwind utilities;

:root {
  --foreground-rgb: 0, 0, 0;
  --background-rgb: 255, 255, 255;
}

body {
  color: rgb(var(--foreground-rgb));
  background: rgb(var(--background-rgb));
}

.prose img {
  margin: 2rem auto;
  border-radius: 0.5rem;
}

.prose a {
  color: #2563eb;
  text-decoration: underline;
}

.prose a:hover {
  color: #1d4ed8;
}

/* Ensure highlight.js styles override Tailwind prose for code blocks */
.prose pre code.hljs {
  background: inherit !important;
  color: inherit !important;
  padding: 0;
  font-size: inherit;
  /* Remove Tailwind's border radius if you want the highlight.js look */
  border-radius: 0;
}
.prose pre {
  background: #292d3e !important;
  color: #fff !important;
  border-radius: 0.5em;
  overflow-x: auto;
}