/* Publication JATS HTML contract.  Theme shells own colors and typography; this file
   supplies the shared semantic layout so every portal theme renders the same article model. */
.jats-body {
    --jats-primary: var(--primary, #1769aa);
    --jats-ink: var(--ink, #202124);
    --jats-muted: var(--muted, #687078);
    --jats-line: var(--line, #d9dee3);
    color: var(--jats-ink);
    line-height: 1.72;
    overflow-wrap: anywhere;
}

.jats-body > .article-title,
.jats-body .sec-title,
.jats-body .abstract-title {
    color: var(--jats-primary);
    line-height: 1.3;
}

.jats-body .sec-title { margin: 1.5rem 0 .55rem; font-size: 1.22rem; }
.jats-body h3.sec-title { font-size: 1.08rem; }
.jats-body h4.sec-title { font-size: 1rem; }
.jats-body p { margin: 0 0 .85rem; }
.jats-body .abstract { margin: 1.25rem 0; }
.jats-body .abstract-title { margin: 0 0 .45rem; font-size: 1.12rem; }
.jats-body p.keywords { margin: .7rem 0 1.1rem; }
.jats-body .article-list { margin: .45rem 0 .9rem 1.5rem; padding-left: 1rem; }
.jats-body .article-list li { margin: .2rem 0; }

.jats-body .article-figure,
.jats-body .article-table {
    margin: 1.25rem 0;
    padding: .75rem;
    border: 1px solid var(--jats-line);
    border-radius: .3rem;
    overflow-x: auto;
}
.jats-body .article-figure img,
.jats-body .figure-grid img { display: block; max-width: 100%; height: auto; margin: 0 auto; }
.jats-body .article-figure figcaption,
.jats-body .table-caption { color: var(--jats-muted); font-size: .9rem; text-align: center; }
.jats-body .figure-images { display: flex; flex-wrap: wrap; gap: .5rem; justify-content: center; }
.jats-body .figure-grid { width: auto; margin: 0 auto; border-collapse: collapse; }
.jats-body .figure-grid td { padding: .25rem .4rem; text-align: center; vertical-align: top; }
.jats-body .figure-grid .panel-label { display: block; color: var(--jats-muted); font-size: .8rem; }
.jats-body .figure-placeholder { padding: 1.25rem; color: var(--jats-muted); text-align: center; background: #f5f7f9; }

.jats-body .article-table-grid { width: 100%; margin: .5rem 0; border-collapse: collapse; font-size: .92rem; }
.jats-body .article-table-grid th,
.jats-body .article-table-grid td { padding: .4rem .6rem; vertical-align: top; }
.jats-body .article-table-grid thead th { border-top: 2px solid currentColor; border-bottom: 1px solid currentColor; }
.jats-body .article-table-grid tbody tr:last-child td { border-bottom: 2px solid currentColor; }
.jats-body .article-formula { display: flex; position: relative; align-items: center; justify-content: center; margin: 1.25rem 0; overflow-x: auto; }
.jats-body .article-formula math { font-size: 1.05em; }
.jats-body .eq-number { position: absolute; right: .25rem; color: var(--jats-muted); }
.jats-body .math-fallback { color: var(--jats-muted); font-family: ui-monospace, Consolas, monospace; font-size: .86em; }

.jats-body a.xref { color: var(--jats-primary); text-decoration: none; border-bottom: 1px dotted currentColor; }
.jats-body .references { margin-top: 1.5rem; padding-top: .5rem; border-top: 1px solid var(--jats-line); }
.jats-body .ref-list { margin: .5rem 0 0; padding: 0; list-style: none; font-size: .92rem; }
.jats-body .ref-list li { display: flex; gap: .5rem; margin: 0 0 .5rem; scroll-margin-top: 1rem; }
.jats-body .ref-list li:target { padding: .15rem .3rem; background: rgba(23, 105, 170, .09); background: color-mix(in srgb, var(--jats-primary) 9%, transparent); border-radius: .2rem; }
.jats-body .ref-text { min-width: 0; flex: 1 1 auto; }
.jats-body .back-matter { margin-top: 1.5rem; padding-top: .75rem; border-top: 1px solid var(--jats-line); }
.jats-body .algorithm { margin: 1rem 0; padding: .75rem 1rem; border: 1px solid var(--jats-line); border-radius: .3rem; background: rgba(23, 105, 170, .04); background: color-mix(in srgb, var(--jats-primary) 4%, transparent); }
.jats-body .algorithm .algo-title { color: var(--jats-primary); font-weight: 700; }

/* The publication artifact can be embedded inside a theme page. Keep its TOC
   compact there and let the page-level controller collapse it without changing
   the article content or introducing non-English UI labels. */
.submission-html-content .layout.with-toc {
    grid-template-columns: 12rem minmax(0, 1fr);
    gap: 1.2rem;
    transition: grid-template-columns .18s ease;
}
.submission-html-content .layout.with-toc .toc {
    font-size: .84rem;
    line-height: 1.35;
    scrollbar-width: thin;
}
.submission-html-content .layout.with-toc .toc-title {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: .35rem;
}
.submission-html-content .layout.with-toc .toc-toggle {
    flex: 0 0 auto;
    border: 0;
    border-radius: 4px;
    padding: 0 .25rem;
    background: transparent;
    color: inherit;
    cursor: pointer;
    font-size: 1.25rem;
    line-height: 1.1;
}
.submission-html-content .layout.with-toc .toc-toggle:hover {
    background: rgba(23, 105, 170, .09);
}
.submission-html-content .layout.with-toc.toc-collapsed {
    grid-template-columns: 1.35rem minmax(0, 1fr) !important;
    gap: .7rem;
}
.submission-html-content .layout.with-toc.toc-collapsed .toc-list { display: none; }
.submission-html-content .layout.with-toc.toc-collapsed .toc-title {
    justify-content: center;
    writing-mode: vertical-rl;
    margin: 0;
}
.submission-html-content .layout.with-toc.toc-collapsed .toc-toggle {
    writing-mode: horizontal-tb;
    margin-top: .35rem;
}

@media (max-width: 640px) {
    .jats-body .article-table-grid { min-width: 36rem; }
    .jats-body .article-formula { justify-content: flex-start; }
    .jats-body .eq-number { position: static; margin-left: .5rem; }
}