/* =============================================================================
   style-md.css — Shared Markdown content styles
   Applied to all .md-content containers (article, blog, about, etc.)
   Generated by ffs MD renderer refactor (topic-44)
   ============================================================================= */

/* ── Headings ────────────────────────────────────────────────────────────────── */
.md-content h1 { font-size: 1.7rem; margin: 0 0 16px; }
.md-content h2 { font-size: 1.25rem; margin: 32px 0 12px; padding-top: 8px; }
.md-content h3 { font-size: 1.05rem; margin: 20px 0 8px; }
.md-content h4 { font-size: 0.95rem; font-weight: 700; margin: 16px 0 6px; color: #222; }
.md-content h5 { font-size: 0.88rem; font-weight: 600; margin: 12px 0 4px;
                   color: #444; text-transform: uppercase; letter-spacing: 0.04em; }
/* A heading always starts a fresh line below any still-open float — never
   squeezed in beside a .md-figure--left/--right that hasn't cleared yet. */
.md-content h1, .md-content h2, .md-content h3,
.md-content h4, .md-content h5 { clear: both; }

/* ── Paragraphs & inline ─────────────────────────────────────────────────────── */
.md-content p  { margin: 0 0 12px; line-height: 1.7; }
.md-content a  { color: #0f3460; text-decoration: underline; }
.md-content a:hover { color: #1a1a2e; }

/* ── Code ────────────────────────────────────────────────────────────────────── */
.md-content pre {
  background: #1e1e1e;
  color: #d4d4d4;
  border-radius: 8px;
  padding: 16px;
  overflow-x: auto;
  font-size: 0.85rem;
  margin: 16px 0;
}
.md-content code {
  background: #ebebeb;
  color: #c7254e;
  border-radius: 4px;
  padding: 2px 6px;
  font-size: 0.88em;
}
.md-content pre code { background: none; color: inherit; padding: 0; }

/* ── Lists ───────────────────────────────────────────────────────────────────── */
.md-content ul { margin: 0 0 14px 20px; }
.md-content ol { margin: 0 0 14px 20px; }
.md-content li { margin-bottom: 4px; line-height: 1.6; }

/* ── Blockquote ──────────────────────────────────────────────────────────────── */
.md-content .md-blockquote {
  margin: 12px 0;
  padding: 4px 0 4px 16px;
  border-left: 3px solid #d0d0d0;
}
.md-content .md-blockquote p {
  margin: 0;
  color: #555;
  font-style: italic;
}

/* ── Table ───────────────────────────────────────────────────────────────────── */
.md-content .md-table {
  width: 100%;
  border-collapse: collapse;
  margin: 20px 0;
  font-size: 0.88rem;
}
.md-content .md-table th,
.md-content .md-table td {
  padding: 8px 14px;
  border: 1px solid #e0e0e0;
  text-align: left;
  color: #333;
}
.md-content .md-table th {
  background: #f4f4f4;
  color: #111;
  font-weight: 700;
}
.md-content .md-table tr:nth-child(even) td {
  background: #fafafa;
}

/* ── Images & figures ────────────────────────────────────────────────────────── */
.md-content img {
  max-width: 100%;
  border-radius: 8px;
  margin: 8px 0;
  display: block;
}
.md-content figure {
  margin: 16px 0;
  text-align: center;
}
.md-content figcaption {
  font-size: 0.82rem;
  color: #555;
  margin-top: 4px;
}

/* ── Horizontal rule ─────────────────────────────────────────────────────────── */
.md-content hr {
  border: none;
  border-top: 1px solid #e0e0e0;
  margin: 24px 0;
}

/* ── Figure float (md-figure--left / md-figure--right / md-figure--center) ──── */
.md-content .md-figure {
  margin: 16px 0;
  /* Every new figure starts below any still-open float from an earlier
     --left/--right figure, instead of stacking beside it. */
  clear: both;
}
.md-content .md-figure img {
  display: block;
  border-radius: 8px;
}
.md-content .md-figure figcaption {
  font-size: 0.82rem;
  color: #555;
  margin-top: 4px;
  text-align: center;
}
/* A hand-written "**Label**" paragraph merged into the figure (MdRenderer,
   see "aboveCaption") — reads as bold body text sitting right above the
   image, not a small muted caption below it. */
.md-content .md-figure figcaption.md-figure-label {
  font-size: 1em;
  font-weight: 700;
  color: inherit;
  text-align: left;
  margin: 0 0 4px;
}

/* Float right — image on the right, text wraps on the left */
.md-content .md-figure--right {
  float: right;
  margin: 4px 0 16px 24px;
  text-align: center;
}

/* Float left — image on the left, text wraps on the right */
.md-content .md-figure--left {
  float: left;
  margin: 4px 24px 16px 0;
  text-align: center;
}

/* Center — block, shrunk to content width so margin:auto (set inline by
   MdRenderer) actually centers it. Does not float: nothing wraps beside it. */
.md-content .md-figure--center {
  display: table;
}

/* Clearfix — paragraphs after a floated figure clear it */
.md-content p:has(+ .md-figure--left),
.md-content p:has(+ .md-figure--right) { }
.md-content::after,
.md-content p.md-clear { clear: both; display: block; content: ""; }

/* On narrow screens floats stack vertically */
@media (max-width: 600px) {
  .md-content .md-figure--left,
  .md-content .md-figure--right {
    float: none;
    margin: 16px auto;
    width: 100% !important;
  }
}

/* GFM task-list items (topic-125 v0.125.6.0)
   A checklist item is a normal <li> inside .md-content ul, tagged .md-task.
   Drop the bullet, pull the row back to the list edge, and align the disabled
   checkbox with the first text line. */
.md-content li.md-task {
  list-style: none;
  margin-left: -20px;
  padding-left: 0;
  display: flex;
  align-items: baseline;
  gap: 0.5em;
}
.md-content li.md-task input[type="checkbox"] {
  margin: 0;
  flex: 0 0 auto;
  transform: translateY(0.1em);
  cursor: default;
}

/* Confluence-style inline status marks (topic-125 v0.125.8.0)
   (/) (x) (!) (?) (on) (off) → themed inline glyphs. */
.md-content .md-mark {
  display: inline-block;
  font-weight: 700;
  line-height: 1;
  padding: 0 0.15em;
}
.md-content .md-mark--ok   { color: #16a34a; }  /* green check  */
.md-content .md-mark--no   { color: #dc2626; }  /* red cross    */
.md-content .md-mark--warn { color: #d97706; }  /* amber warn   */
.md-content .md-mark--info { color: #2563eb; }  /* blue query   */
.md-content .md-mark--on   { color: #16a34a; }  /* on  = green  */
.md-content .md-mark--off  { color: #9ca3af; }  /* off = grey   */

/* Footnotes (topic-125 v0.125.11.0)
   Superscript references in the text, and a numbered section at the end with
   ↩ backreferences. */
.md-content .footnote-ref {
  font-size: 0.75em;
  line-height: 0;
  vertical-align: super;
}
.md-content .footnote-ref a { text-decoration: none; }
.md-content .footnotes {
  margin-top: 2em;
  padding-top: 1em;
  border-top: 1px solid #ddd;
  font-size: 0.9em;
}
.md-content .footnotes ol { margin: 0 0 0 1.2em; padding: 0; }
.md-content .footnotes li { margin-bottom: 0.4em; }
.md-content .footnote-backref {
  margin-left: 0.4em;
  text-decoration: none;
}