/*
 * pperl-mermaid.css — shrink sphinxcontrib-mermaid's fixed height.
 *
 * Upstream default is `pre.mermaid > svg { height: 500px; }` which
 * reserves far more vertical space than most diagrams need. Our
 * flowcharts are compact (a row of boxes, a handful of nodes) and
 * should occupy only as much space as their content demands.
 *
 * We override the rule to auto-size vertically with a reasonable
 * upper bound, and remove the implicit 100% width so diagrams that
 * are narrower than the column don't stretch to fill it.
 */

pre.mermaid > svg,
.mermaid-container > pre > svg {
    height: auto !important;
    max-height: 320px;
    width: auto !important;
    max-width: 100%;
    /* Center narrow diagrams inside the column. */
    display: block;
    margin-left: auto;
    margin-right: auto;
}

/* The wrapper itself should size to its content, not to any fixed
 * template-provided height. */
pre.mermaid,
.mermaid-container > pre {
    height: auto !important;
    min-height: unset !important;
    padding: 0.5em 0;
}