/**
 * Styling for admin-authored Markdown rendered into `.release-note-content`
 * (instructions, README, release notes).
 *
 * The Tailwind CDN Preflight resets list markers, heading sizes and margins to
 * zero, and the Typography plugin (`prose`) is not loaded on the CDN build, so
 * those `prose` classes in the templates are inert. These rules restore
 * readable document formatting. Theme-aware via `html.dark`.
 */

.release-note-content {
    line-height: 1.65;
}

/* Headings */
.release-note-content h1,
.release-note-content h2,
.release-note-content h3,
.release-note-content h4 {
    font-weight: 600;
    line-height: 1.25;
    margin: 1.6em 0 0.6em;
}
.release-note-content > :first-child {
    margin-top: 0;
}
.release-note-content h1 { font-size: 1.6rem; }
.release-note-content h2 { font-size: 1.3rem; }
.release-note-content h3 { font-size: 1.1rem; }

/* Paragraphs */
.release-note-content p {
    margin: 0.85em 0;
}

/* Lists — restore the markers Preflight strips */
.release-note-content ol,
.release-note-content ul {
    margin: 0.85em 0;
    padding-left: 1.75em;
}
.release-note-content ol { list-style: decimal; }
.release-note-content ul { list-style: disc; }
.release-note-content li { margin: 0.35em 0; }
.release-note-content li::marker {
    color: inherit;
}
.release-note-content ol ol,
.release-note-content ul ul,
.release-note-content ol ul,
.release-note-content ul ol {
    margin: 0.35em 0;
}

/* Links */
.release-note-content a {
    color: #006a61;
    text-decoration: underline;
}
html.dark .release-note-content a {
    color: #6bd8cb;
}

/* Inline code */
.release-note-content code {
    font-family: "JetBrains Mono", ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
    font-size: 0.875em;
    background: #eceef0;
    padding: 0.15em 0.35em;
    border-radius: 0.25rem;
}
html.dark .release-note-content code {
    background: #1f2228;
}

/* Fenced code blocks */
.release-note-content pre {
    background: #eceef0;
    color: #191c1e;
    padding: 1em;
    border-radius: 0.5rem;
    overflow-x: auto;
    margin: 0.85em 0;
}
.release-note-content pre code {
    background: none;
    padding: 0;
    font-size: 0.85em;
}
html.dark .release-note-content pre {
    background: #14161a;
    color: #e7e9ec;
}

/* Images (screenshots) */
.release-note-content img {
    display: block;
    max-width: 100%;
    height: auto;
    margin: 1em 0;
    border: 1px solid #c6c6cd;
    border-radius: 0.5rem;
}
html.dark .release-note-content img {
    border-color: #48484f;
}

/* ------------------------------------------------------------------ */
/* Quick Start tab group (.qs-tabs) — chrome owned by instructions.html */
/* ------------------------------------------------------------------ */
.qs-tabs {
    margin: 1.5em 0;
}
.qs-tabs__list {
    display: flex;
    flex-wrap: wrap;
    gap: 0.25rem;
    border-bottom: 1px solid #c6c6cd;
}
html.dark .qs-tabs__list {
    border-bottom-color: #48484f;
}
.qs-tabs__tab {
    appearance: none;
    background: none;
    border: 1px solid transparent;
    border-bottom: none;
    border-radius: 0.5rem 0.5rem 0 0;
    padding: 0.5rem 1rem;
    font: inherit;
    font-weight: 600;
    color: #45464d;
    cursor: pointer;
    margin-bottom: -1px;
}
.qs-tabs__tab:hover {
    color: #006a61;
}
.qs-tabs__tab:focus-visible {
    outline: 2px solid #006a61;
    outline-offset: -2px;
}
.qs-tabs__tab--active {
    color: #191c1e;
    border-color: #c6c6cd;
    background: #ffffff;
}
html.dark .qs-tabs__tab {
    color: #a8acb3;
}
html.dark .qs-tabs__tab:hover {
    color: #6bd8cb;
}
html.dark .qs-tabs__tab--active {
    color: #e7e9ec;
    border-color: #48484f;
    background: #14161a;
}
.qs-tabs__panel {
    padding: 1.25rem 0.25rem 0.25rem;
}
.qs-tabs__panel[hidden] {
    display: none;
}

/* Thematic break */
.release-note-content hr {
    border: 0;
    border-top: 1px solid #c6c6cd;
    margin: 2em 0;
}
html.dark .release-note-content hr {
    border-top-color: #48484f;
}

/* Blockquotes */
.release-note-content blockquote {
    margin: 0.85em 0;
    padding-left: 1em;
    border-left: 3px solid #c6c6cd;
    color: #45464d;
}
html.dark .release-note-content blockquote {
    border-left-color: #48484f;
    color: #a8acb3;
}
