/* ==========================================================================
   Azuro Insights — Markdown / prose layer
   Additive to insights.css. Styles what kramdown emits (code, tables,
   footnotes, figures, definition lists) plus a LIGHT Rouge syntax theme that
   keeps the page a single calm paper surface — no dark code panels.

   BRANCH POINT: retheme code by editing the --code-* / --syn-* vars below.
   ========================================================================== */

:root {
  /* Code surface — a soft inset of the paper, not a dark panel */
  --code-bg:     #f5f3ee;
  --code-bg-2:   #ede9e1;
  --code-border: var(--rule-strong);
  --code-ink:    #35323c;   /* default code text on light */
  --code-dim:    #8f8b81;   /* badges, gutter */

  /* Light syntax palette — tuned for contrast on the inset, azure-anchored */
  --syn-comment:  #8a8d7c;
  --syn-keyword:  #1a4fc4;   /* azure */
  --syn-string:   #2f7d55;   /* green */
  --syn-number:   #9a5b1e;   /* amber-brown */
  --syn-function: #6a3bd0;   /* violet */
  --syn-class:    #0b7080;   /* teal */
  --syn-name:     #35323c;
  --syn-builtin:  #0b7080;
  --syn-operator: #6b7080;
  --syn-punct:    #7a7f8b;
  --syn-tag:      #1a4fc4;
  --syn-attr:     #2f7d55;
  --syn-deleted:  #b23a48;
  --syn-inserted: #2f7d55;
}

/* ------------------------------------------------------------------ */
/* Ordered lists (base CSS only styles <ul>)                           */
/* ------------------------------------------------------------------ */
.prose ol { padding-left: 1.5em; counter-reset: li; list-style: none; }
.prose ol > li { margin-top: 0.5em; padding-left: 0.35em; position: relative; counter-increment: li; }
.prose ol > li::before {
  content: counter(li) ".";
  position: absolute;
  left: -1.5em;
  width: 1.5em;
  text-align: right;
  padding-right: 0.45em;
  color: var(--accent);
  font-family: var(--sans);
  font-size: 0.8em;
  font-variant-numeric: tabular-nums;
  font-weight: 500;
  top: 0.34em;
}
.prose ul ul > li::marker { color: var(--faint); }

/* ------------------------------------------------------------------ */
/* Inline code                                                         */
/* ------------------------------------------------------------------ */
.prose :not(pre) > code {
  font-family: var(--mono);
  font-size: 0.82em;
  background: var(--code-bg);
  border: 1px solid var(--code-border);
  border-radius: 5px;
  padding: 0.1em 0.38em;
  color: #2b303a;
  word-break: break-word;
}
.prose a code { color: var(--accent); }

/* ------------------------------------------------------------------ */
/* Code blocks (Rouge: .highlighter-rouge > .highlight > pre > code)   */
/* ------------------------------------------------------------------ */
.prose .highlighter-rouge { position: relative; margin-top: 1.8em; }
.prose pre.highlight, .prose div.highlight {
  background: var(--code-bg);
  border: 1px solid var(--code-border);
  border-radius: 9px;
  overflow: hidden;
}
.prose .highlight pre.highlight, .prose div.highlight pre { border: none; border-radius: 0; background: transparent; }
.prose pre {
  margin: 0;
  padding: 18px 20px;
  padding-top: 30px;               /* clear the language badge */
  overflow-x: auto;
  font-family: var(--mono);
  font-size: 13px;
  line-height: 1.7;
  color: var(--code-ink);
  -webkit-overflow-scrolling: touch;
  tab-size: 2;
}
.prose > pre:not(.highlight) { background: var(--code-bg); border: 1px solid var(--code-border); border-radius: 9px; }
.prose pre code { font: inherit; background: none; border: none; padding: 0; color: inherit; white-space: pre; }

/* Language badge — a quiet SecOps signature */
.prose .highlighter-rouge::before {
  content: "code";
  position: absolute;
  top: 0; right: 0;
  z-index: 1;
  font: 500 10px/1 var(--sans);
  letter-spacing: 0.13em;
  text-transform: uppercase;
  color: var(--code-dim);
  background: var(--code-bg-2);
  border-left: 1px solid var(--code-border);
  border-bottom: 1px solid var(--code-border);
  border-bottom-left-radius: 8px;
  padding: 6px 11px 5px;
  pointer-events: none;
}
.prose .language-python.highlighter-rouge::before,
.prose .language-py.highlighter-rouge::before          { content: "Python"; }
.prose .language-bash.highlighter-rouge::before         { content: "Bash"; }
.prose .language-sh.highlighter-rouge::before,
.prose .language-shell.highlighter-rouge::before,
.prose .language-zsh.highlighter-rouge::before          { content: "Shell"; }
.prose .language-console.highlighter-rouge::before,
.prose .language-terminal.highlighter-rouge::before     { content: "Terminal"; }
.prose .language-powershell.highlighter-rouge::before,
.prose .language-ps1.highlighter-rouge::before          { content: "PowerShell"; }
.prose .language-kql.highlighter-rouge::before,
.prose .language-kusto.highlighter-rouge::before        { content: "KQL"; }
.prose .language-sql.highlighter-rouge::before          { content: "SQL"; }
.prose .language-json.highlighter-rouge::before         { content: "JSON"; }
.prose .language-yaml.highlighter-rouge::before,
.prose .language-yml.highlighter-rouge::before          { content: "YAML"; }
.prose .language-toml.highlighter-rouge::before         { content: "TOML"; }
.prose .language-hcl.highlighter-rouge::before,
.prose .language-terraform.highlighter-rouge::before    { content: "Terraform"; }
.prose .language-dockerfile.highlighter-rouge::before,
.prose .language-docker.highlighter-rouge::before       { content: "Dockerfile"; }
.prose .language-go.highlighter-rouge::before           { content: "Go"; }
.prose .language-rust.highlighter-rouge::before         { content: "Rust"; }
.prose .language-c.highlighter-rouge::before            { content: "C"; }
.prose .language-javascript.highlighter-rouge::before,
.prose .language-js.highlighter-rouge::before           { content: "JavaScript"; }
.prose .language-typescript.highlighter-rouge::before,
.prose .language-ts.highlighter-rouge::before           { content: "TypeScript"; }
.prose .language-http.highlighter-rouge::before         { content: "HTTP"; }
.prose .language-diff.highlighter-rouge::before         { content: "Diff"; }
.prose .language-xml.highlighter-rouge::before          { content: "XML"; }
.prose .language-html.highlighter-rouge::before         { content: "HTML"; }
.prose .language-css.highlighter-rouge::before          { content: "CSS"; }
.prose .language-plaintext.highlighter-rouge::before,
.prose .language-text.highlighter-rouge::before         { content: "Text"; }

/* Copy-code button (injected by JS) */
.prose .code-copy {
  position: absolute;
  top: 6px; right: 64px;
  z-index: 2;
  font: 500 10px/1 var(--sans);
  letter-spacing: 0.09em;
  text-transform: uppercase;
  color: var(--code-dim);
  background: var(--code-bg-2);
  border: 1px solid var(--code-border);
  border-radius: 999px;
  padding: 5px 11px;
  cursor: pointer;
  opacity: 0;
  transition: opacity .15s ease, color .15s ease, border-color .15s ease;
}
.prose .highlighter-rouge:hover .code-copy, .prose .code-copy:focus-visible { opacity: 1; }
.prose .code-copy:hover { color: var(--accent); border-color: var(--accent); }

/* ------------------------------------------------------------------ */
/* Rouge syntax theme (scoped to .prose)                               */
/* ------------------------------------------------------------------ */
.prose .highlight .c,  .prose .highlight .ch, .prose .highlight .cd,
.prose .highlight .cm, .prose .highlight .cp, .prose .highlight .c1,
.prose .highlight .cs  { color: var(--syn-comment); font-style: italic; }

.prose .highlight .k,  .prose .highlight .kc, .prose .highlight .kd,
.prose .highlight .kn, .prose .highlight .kp, .prose .highlight .kr
       { color: var(--syn-keyword); }
.prose .highlight .kt  { color: var(--syn-class); }

.prose .highlight .s,  .prose .highlight .sa, .prose .highlight .sb,
.prose .highlight .sc, .prose .highlight .dl, .prose .highlight .sd,
.prose .highlight .s2, .prose .highlight .se, .prose .highlight .sh,
.prose .highlight .si, .prose .highlight .sx, .prose .highlight .sr,
.prose .highlight .s1, .prose .highlight .ss
       { color: var(--syn-string); }

.prose .highlight .m,  .prose .highlight .mb, .prose .highlight .mf,
.prose .highlight .mh, .prose .highlight .mi, .prose .highlight .mo,
.prose .highlight .il, .prose .highlight .mx
       { color: var(--syn-number); }

.prose .highlight .n   { color: var(--syn-name); }
.prose .highlight .nf, .prose .highlight .fm { color: var(--syn-function); }
.prose .highlight .nb, .prose .highlight .bp { color: var(--syn-builtin); }
.prose .highlight .nc, .prose .highlight .nn { color: var(--syn-class); }
.prose .highlight .nt  { color: var(--syn-tag); }
.prose .highlight .na  { color: var(--syn-attr); }
.prose .highlight .no, .prose .highlight .nv, .prose .highlight .vc,
.prose .highlight .vg, .prose .highlight .vi { color: var(--syn-name); }
.prose .highlight .nd, .prose .highlight .ni, .prose .highlight .ne,
.prose .highlight .nl, .prose .highlight .nx, .prose .highlight .py { color: var(--syn-name); }

.prose .highlight .o, .prose .highlight .ow { color: var(--syn-operator); }
.prose .highlight .p, .prose .highlight .pi { color: var(--syn-punct); }

.prose .highlight .gd { color: var(--syn-deleted);  background: rgba(178,58,72,0.08); }
.prose .highlight .gi { color: var(--syn-inserted); background: rgba(47,125,85,0.10); }
.prose .highlight .ge { font-style: italic; }
.prose .highlight .gs { font-weight: 600; }
.prose .highlight .gh, .prose .highlight .gu { color: var(--syn-keyword); font-weight: 600; }
.prose .highlight .gp { color: var(--syn-comment); }
.prose .highlight .gt, .prose .highlight .gr { color: var(--syn-deleted); }
.prose .highlight .err { color: var(--syn-deleted); }
.prose .highlight .w  { color: transparent; }

.prose .highlight .lineno, .prose .highlight .gl {
  color: var(--code-dim);
  -webkit-user-select: none; user-select: none;
  margin-right: 14px; padding-right: 10px;
  border-right: 1px solid var(--code-border);
}

/* ------------------------------------------------------------------ */
/* GFM tables                                                          */
/* ------------------------------------------------------------------ */
.prose table {
  width: 100%;
  border-collapse: collapse;
  font-family: var(--sans);
  font-size: 14px;
  line-height: 1.45;
  margin-top: 1.9em;
  display: block;
  overflow-x: auto;
  -webkit-overflow-scrolling: touch;
}
.prose table thead { border-bottom: 1.5px solid var(--rule-strong); }
.prose table th { font-weight: 500; color: var(--head); text-align: left; padding: 10px 18px 10px 0; white-space: nowrap; }
.prose table td { border-bottom: 1px solid var(--rule); padding: 11px 18px 11px 0; vertical-align: top; color: var(--body-ink); }
.prose table tr:last-child td { border-bottom: none; }
.prose table th[align="right"],  .prose table td[align="right"],
.prose table th[style*="right"],  .prose table td[style*="right"]  { text-align: right; font-variant-numeric: tabular-nums; }
.prose table th[align="center"], .prose table td[align="center"],
.prose table th[style*="center"], .prose table td[style*="center"] { text-align: center; }
.prose .tablewrap { margin-top: 1.9em; overflow-x: auto; }
.prose .tablewrap table { margin-top: 0; display: table; }

/* ------------------------------------------------------------------ */
/* Footnotes                                                           */
/* ------------------------------------------------------------------ */
.prose sup[id^="fnref"] a, .prose a.footnote { text-decoration: none; font-size: 0.7em; font-weight: 500; color: var(--accent); }
.prose .footnotes {
  margin-top: 3.2em;
  padding-top: 1.6em;
  border-top: 1px solid var(--rule);
  font-family: var(--sans);
  font-size: 13.5px;
  color: var(--muted);
  line-height: 1.6;
}
.prose .footnotes ol { padding-left: 1.4em; }
.prose .footnotes li { margin-top: 0.6em; }
.prose .footnotes p { display: inline; }
.prose .footnote-backref { text-decoration: none; margin-left: 6px; color: var(--accent); }

/* ------------------------------------------------------------------ */
/* Figures, images, kbd, mark, definition & task lists                 */
/* ------------------------------------------------------------------ */
.prose img { border-radius: 8px; border: 1px solid var(--rule); }
.prose p > img { margin-top: 0.4em; }
.prose figure { margin-top: 1.9em; }
.prose figure img { width: 100%; }
.prose figcaption { margin-top: 0.7rem; font-family: var(--sans); font-size: 13px; color: var(--muted); line-height: 1.5; }
.prose kbd {
  font-family: var(--mono); font-size: 0.8em;
  background: var(--code-bg); border: 1px solid var(--rule-strong); border-bottom-width: 2px;
  border-radius: 5px; padding: 0.1em 0.42em; color: var(--head);
}
.prose mark { background: var(--accent-soft); color: inherit; padding: 0.05em 0.2em; border-radius: 3px; }
.prose abbr[title] { text-decoration-style: dotted; cursor: help; }
.prose dl { margin-top: 1.5em; }
.prose dt { font-weight: 600; color: var(--head); margin-top: 1em; }
.prose dd { margin-left: 0; padding-left: 1.2em; border-left: 2px solid var(--rule); color: var(--body-ink); }
.prose .task-list-item { list-style: none; }
.prose li > input[type="checkbox"] { margin-right: 0.5em; accent-color: var(--accent); }
.prose ul:has(> .task-list-item) { padding-left: 0.2em; }

/* ------------------------------------------------------------------ */
/* Print                                                               */
/* ------------------------------------------------------------------ */
@media print {
  .prose pre.highlight, .prose div.highlight { border-color: #ccc; }
  .prose .highlighter-rouge::before, .prose .code-copy { display: none; }
  .prose .highlight * { color: #111 !important; }
}