/* This creates the scrollable window */
/* The Outer Wrapper */
.scroll-code {
    margin-bottom: 1rem;
}

/* The Highlight Container */
.scroll-code .highlight {
    border-radius: 4px;
    max-height: 250px; /* Increased this so it's not "too short" */
    overflow-y: auto !important;
    display: block;
}

/* The Code Block itself */
.scroll-code .highlight pre {
    height: auto !important; /* Forces it to expand to the text size */
    min-height: 50px;       /* Prevents it from being a tiny sliver */
    white-space: pre-wrap !important;
    word-break: break-word !important;
    margin: 0;
}

/* Force ALL Mermaid timeline text to black in Dark Mode */
[data-md-color-scheme="slate"] .mermaid svg tspan,
[data-md-color-scheme="slate"] .mermaid svg text,
[data-md-color-scheme="slate"] .mermaid .timeline-node text,
[data-md-color-scheme="slate"] .mermaid .event-node text {
    fill: #000000 !important;
    color: #000000 !important;
}