/* Code block wrapper */
pre.chroma {
  background: var(--bg-code);     /* Dark background */
  color: var(--text-primary);             /* Default text color */
  padding: 1rem;
  border-radius: 0.5rem;
  overflow-x: auto;
  font-family: 'Fira Code', 'Courier New', monospace;
  font-size: 0.95rem;
  line-height: 1.5;
  margin: 1rem 0;
  box-shadow: inset 0 0 10px rgba(0,0,0,0.3);
}

/* INLINE CODE */
p code, li code, td code {
  color: var(--bg-inline-code);
  background: var(--bg-code);        /* Dark background */
  font-family: 'Fira Code', monospace;
  border-radius: 0.25rem;
  padding-left: 0.3rem;
  padding-right: 0.3rem;
}

/* Block code */
/* .highlight code { */
  /* background: #2e2e3e; */
  /* padding: 0.2rem 0.4rem; */
/* } */



/* Keywords */
.chroma .k { color: #ff79c6; font-weight: bold; }

/* Strings */
.chroma .s { color: #f1fa8c; }

/* Comments */
.chroma .c { color: #6272a4; font-style: italic; }

/* Functions */
.chroma .nf { color: #50fa7b; }

/* Numbers */
.chroma .m { color: #bd93f9; }

/* Operators */
.chroma .o { color: #ff79c6; }

/* Line numbers (if enabled) */
.chroma .ln {
  color: #44475a;
  user-select: none;
  padding-right: 1rem;
}

/* CLIPBOARD */
/* pre.chroma {
  position: relative;
} */

/* pre.chroma::before {
  content: "Copy";
  position: absolute;
  top: 0.5rem;
  right: 0.5rem;
  font-family: 'Fira Code', monospace;
  background: var(--bg-primary);
  color: #fff;
  padding: 0.2rem 0.5rem;
  font-size: 0.75rem;
  border-radius: 0.25rem;
  cursor: pointer;
} */

/* Make all images inside main-container responsive */
.post img {
  max-width: 100%;      /* Never exceed container width */
  height: auto;         /* Keep aspect ratio */
  display: block;       /* Remove inline spacing issues */
  margin-top: 1rem;    /* Optional: vertical spacing and center */
  margin-bottom: 1rem;    /* Optional: vertical spacing and center */
  padding: 0;           /* Optional: remove padding */
  box-sizing: border-box;
  border-radius: 0.25rem; /* optional: rounded corners */
}

.post h2, .post h3 {
  margin-top: 3rem;   
}

.post h1 {
  margin-top: 1rem;   
}

.post ol {
  margin-left: 1rem;
  margin-bottom: 1rem;
}

.post ul {
  margin-left: 1.5rem;
  margin-bottom: 1rem;
}

.post ol li, .post ul li {
  margin-top: 0.5rem;
}

.post ol li::marker {
  font-weight: bold;
}

.post p {
  margin-top: 1rem;
  margin-bottom: 1rem;
}

/* Optional: add spacing around figures */
.main-container figure {
  margin: 1.5rem 0;
}

.main-container figure img {
  width: 100%;
  height: auto;
}

/* .main-container .post {
  max-width: 60%;
} */

.post a {
  color: var(--inline-code);
}

.post {
  line-height: 1.6rem;
}

.post table {
  border: 0px solid var(--text-primary);
  border-collapse: collapse;
}

.post th {
  padding-right: 1rem;
  text-align: left;
}

.post td {
  border-bottom: 0.5px solid var(--text-primary);
  padding-right: 2rem;
  padding-top: 0.5rem;
  padding-bottom: 0.5rem;
}