/* markdown.css — shared styling for markdownRenderer.js output.
 *
 * Consumed by the web dashboard AND tygaapp (both innerHTML the same .md-root
 * HTML). The Unity native panel does NOT use this sheet — it renders the
 * block-AST (toBlocks) with native widgets — but the class names here are the
 * canonical style contract the Unity panel should visually mirror.
 *
 * Scope everything under .md-surface so it can't leak into terminal output. */

.md-surface .md-root { line-height: 1.55; font-size: 14px; }
.md-surface .md-root > *:first-child { margin-top: 0; }
.md-surface .md-root > *:last-child { margin-bottom: 0; }

/* headings */
.md-surface .md-h { font-weight: 600; line-height: 1.25; margin: 1.1em 0 0.5em; }
.md-surface .md-h1 { font-size: 1.5em; border-bottom: 1px solid rgba(127,127,127,0.25); padding-bottom: 0.25em; }
.md-surface .md-h2 { font-size: 1.3em; border-bottom: 1px solid rgba(127,127,127,0.18); padding-bottom: 0.2em; }
.md-surface .md-h3 { font-size: 1.15em; }
.md-surface .md-h4 { font-size: 1.05em; }
.md-surface .md-h5, .md-surface .md-h6 { font-size: 1em; opacity: 0.85; }

/* paragraphs + inline */
.md-surface .md-p { margin: 0.5em 0; }
.md-surface strong { font-weight: 650; }
.md-surface em { font-style: italic; }
.md-surface .md-link { color: #4c8dff; text-decoration: none; }
.md-surface .md-link:hover { text-decoration: underline; }
.md-surface .md-code {
    font-family: ui-monospace, "SF Mono", Menlo, Consolas, monospace;
    font-size: 0.88em; padding: 0.12em 0.4em; border-radius: 4px;
    background: rgba(127,127,127,0.16);
}

/* horizontal rule */
.md-surface .md-hr { border: 0; height: 1px; margin: 1.1em 0;
    background: linear-gradient(to right, transparent, rgba(127,127,127,0.4), transparent); }

/* fenced code */
.md-surface .md-pre {
    margin: 0.7em 0; padding: 0.85em 1em; border-radius: 8px; overflow-x: auto;
    background: #0d1117; border: 1px solid rgba(127,127,127,0.22);
}
.md-surface .md-code-block {
    font-family: ui-monospace, "SF Mono", Menlo, Consolas, monospace;
    font-size: 0.85em; color: #e6edf3; background: none; padding: 0; white-space: pre;
}

/* tables */
.md-surface .md-table-wrap { overflow-x: auto; margin: 0.8em 0; }
.md-surface .md-table { border-collapse: collapse; width: 100%; font-size: 0.92em; }
.md-surface .md-th, .md-surface .md-td {
    border: 1px solid rgba(127,127,127,0.28); padding: 0.45em 0.7em; vertical-align: top;
}
.md-surface .md-th { background: rgba(127,127,127,0.14); font-weight: 600; }
.md-surface .md-table tbody tr:nth-child(even) td { background: rgba(127,127,127,0.06); }

/* lists */
.md-surface .md-list { margin: 0.5em 0; padding-left: 1.5em; }
.md-surface .md-li { margin: 0.2em 0; }

/* blockquote */
.md-surface .md-quote {
    margin: 0.7em 0; padding: 0.4em 0.9em; color: inherit; opacity: 0.9;
    border-left: 3px solid rgba(127,127,127,0.5); background: rgba(127,127,127,0.06);
}

/* callouts — key takeaways stand out */
.md-surface .md-callout {
    margin: 0.7em 0; padding: 0.6em 0.9em; border-radius: 8px; font-size: 0.95em;
    border-left: 4px solid var(--md-callout-accent, #7d8590);
    background: var(--md-callout-bg, rgba(127,127,127,0.08));
}
.md-surface .md-callout-label { font-weight: 650; }
.md-surface .md-callout-summary { --md-callout-accent: #4c8dff; --md-callout-bg: rgba(76,141,255,0.10); }
.md-surface .md-callout-note    { --md-callout-accent: #7d8590; --md-callout-bg: rgba(125,133,144,0.10); }
.md-surface .md-callout-warn    { --md-callout-accent: #d29922; --md-callout-bg: rgba(210,153,34,0.12); }
.md-surface .md-callout-danger  { --md-callout-accent: #f85149; --md-callout-bg: rgba(248,81,73,0.12); }
.md-surface .md-callout-action  { --md-callout-accent: #3fb950; --md-callout-bg: rgba(63,185,80,0.10); }
.md-surface .md-callout-ok      { --md-callout-accent: #3fb950; --md-callout-bg: rgba(63,185,80,0.10); }

/* status pills — CLI state cells (docker service ls, health JSON, …) */
.md-surface .md-pill {
    display: inline-block; padding: 0.08em 0.55em; border-radius: 999px;
    font-size: 0.82em; font-weight: 600; line-height: 1.5;
    border: 1px solid var(--md-pill-accent, #7d8590);
    color: var(--md-pill-accent, #7d8590); background: var(--md-pill-bg, rgba(125,133,144,0.12));
}
.md-surface .md-pill-ok     { --md-pill-accent: #3fb950; --md-pill-bg: rgba(63,185,80,0.14); }
.md-surface .md-pill-warn   { --md-pill-accent: #d29922; --md-pill-bg: rgba(210,153,34,0.16); }
.md-surface .md-pill-danger { --md-pill-accent: #f85149; --md-pill-bg: rgba(248,81,73,0.16); }

/* key-value grid — status/health JSON cards */
.md-surface .md-kv {
    display: grid; grid-template-columns: max-content 1fr; gap: 0.15em 1em;
    margin: 0.7em 0; padding: 0.7em 0.9em; border-radius: 8px;
    background: rgba(127,127,127,0.06); border: 1px solid rgba(127,127,127,0.2);
    font-size: 0.92em;
}
.md-surface .md-kv-row { display: contents; }
.md-surface .md-kv-key { font-weight: 600; opacity: 0.85; }
.md-surface .md-kv-val { font-family: ui-monospace, "SF Mono", Menlo, Consolas, monospace; }