/* ===============================
   EZ-Blog theme (scoped)
   Everything lives under .ezblog
   =============================== */

.ezblog {
  /* Keep your site’s serif look */
  font-family: Georgia, "Times New Roman", serif;
  line-height: 1.5;
  color: #111;
}

.ezblog .maintext table.ez-table {
  border-collapse: collapse;
  width: 100%;
  margin: 1rem 0;
}
.ezblog .maintext table.ez-table td,
.ezblog .maintext table.ez-table th {
  border: 1px solid #e1e4e8;
  padding: 0.5rem 0.6rem;
  vertical-align: top;
}

/* Headings: gentle spacing only */
.ezblog h1, .ezblog h2, .ezblog h3 {
  line-height: 1.2;
  margin: 0.75rem 0 0.5rem;
}

/* Links: standard blue with underline on hover for accessibility */
.ezblog a {
  color: #0645ad;
  text-decoration: none;
}
.ezblog a:hover,
.ezblog a:focus {
  text-decoration: underline;
}

/* Images inside article body: keep them from overflowing */
.ezblog .maintext img {
  max-width: 100%;
  height: auto;
}

/* Code formatting (for <pre><code> or inline <code>) */

/* ===== Code: compact, bordered, clearly separated ===== */
.ezblog pre, .ezblog pre code, .ezblog code {
  font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, "Liberation Mono", "Courier New", monospace;
}

/* Inline code (single-word/phrase snippets) */
.ezblog code:not(pre code) {
  background: #f6f8fa;
  padding: 0.12rem 0.3rem;
  border: 1px solid #d0d7de;
  border-radius: 4px;
  font-size: 0.93em;         /* slightly smaller than body */
  line-height: 1.25;         /* tighter inline line-height */
}

/* Code blocks produced by your </> button (common markup: <pre><code>…</code></pre>) */
.ezblog pre {
  background: #f6f8fa;
  border: 1px solid #d0d7de;  /* clear border around block */
  border-left: 4px solid #8ab4f8; /* subtle accent so it “reads” as a unit */
  border-radius: 6px;
  padding: 0.75rem 0.9rem;
  margin: 0.9rem 0 1.1rem;
  overflow: auto;             /* scroll if wide */
  line-height: 1.25;          /* tighter line spacing */
  font-size: 0.92em;          /* make the code a bit smaller overall */
  max-width: 72ch;            /* “visual line width” feels narrower & more readable */
}

/* When <code> sits inside <pre>, don’t double up padding/borders */
.ezblog pre > code {
  background: transparent;
  border: 0;
  padding: 0;
}

/* Optional: make the side menu a touch tighter without changing layout */
.ezblog .menubar a {
  display: inline-block;
  margin: 0.2rem 0;
}

.ezblog .menubar font[color="#FF0000"] { display: none !important; }
.ezblog .menubar a::before {
  content: "•";
  color: #aaa;               /* same gray as #articles-list bullets */
  display: inline-block;
  width: 1em;                /* creates consistent indent */
  margin-left: 0;            /* keep flush to the left */
}

/* Article header meta block (scoped to page content) */
.article-meta {
  background: #fafafa;
  border: 1px solid #eee;
  border-radius: 4px;
  padding: 0.75rem 1rem;
  margin: 0 0 1rem 0;
}
.article-meta .eyebrow { margin-bottom: 0.25rem; }
.article-meta .category {
  font-size: 0.80rem;
  text-transform: uppercase;
  letter-spacing: 0.03em;
  background: #f2f4f7;
  border: 1px solid #e5e7eb;
  border-radius: 3px;
  padding: 0.05rem 0.35rem;
  color: #333;
}
.article-meta .title { margin: 0; line-height: 1.2; }
.article-meta .headline { margin: 0.35rem 0 0.6rem; font-style: italic; color: #333; }
.article-meta .dates { display: flex; gap: 1rem; flex-wrap: wrap; font-size: 0.95rem; color: #666; }
.article-meta .dates .updated::before { content: "• "; margin: 0 0.25rem 0 0; color: #aaa; }
.ezblog #articles-list {
  list-style: none;
  margin: 0;
  padding: 0;
  text-align: left;
}
.ezblog #articles-list li {
  position: relative;
  margin: 0.65em 0;
  padding-left: 1.1em;
}
.ezblog #articles-list li::before {
  content: "•";
  color: #888;
  position: absolute;
  left: 0;
  top: 0.05em;
}
.ezblog #articles-list .meta-line {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: 0.5rem;
  flex-wrap: wrap;
  line-height: 1.25;
}
.ezblog #articles-list .meta-line a {
  font-weight: 600;
  text-decoration: none;
}
.ezblog #articles-list .meta-line a:hover {
  text-decoration: underline;
}
.ezblog #articles-list .category {
  font-size: 0.80rem;
  text-transform: uppercase;
  letter-spacing: 0.03em;
  background: #f2f4f7;
  border: 1px solid #e5e7eb;
  border-radius: 3px;
  padding: 0.05rem 0.35rem;
  color: #333;
}
.ezblog #articles-list .date {
  font-size: 0.95rem;
  color: #666;
  white-space: nowrap;
  margin-left: auto;
}
.ezblog #articles-list .headline {
  display: block;
  margin-top: 0.20rem;
  color: #444;
  font-style: italic;
}