/* Modern styling for Furo theme + Mermaid diagrams */

:root {
    --robin-primary: #1f6feb;
    --robin-secondary: #539bf5;
    --robin-accent: #f97316;
}

.content-card,
.sd-card,
.toctree-wrapper > ul > li {
    background: var(--color-background-secondary);
    border: 1px solid var(--color-background-border);
    border-radius: 12px;
}

.toctree-wrapper > ul > li {
    margin: 0.5rem 0;
    padding: 0.75rem 1rem;
    list-style: none;
}

div.highlight pre {
    border-radius: 12px;
    border: 1px solid var(--color-background-border);
}

table.docutils {
    border: 1px solid var(--color-background-border);
    border-radius: 10px;
    overflow: hidden;
}

table.docutils thead th {
    background: var(--robin-primary);
    color: #ffffff;
}

a:hover {
    text-decoration: underline;
    text-underline-offset: 2px;
}

/* Mermaid container styling */
div.mermaid {
    background: var(--color-background-secondary);
    border: 1px solid var(--color-background-border);
    border-radius: 14px;
    padding: 1rem;
    margin: 1rem 0;
    box-shadow: 0 8px 24px rgb(15 23 42 / 8%);
}

@media (prefers-color-scheme: dark) {
    body:not([data-theme="light"]) div.mermaid {
        box-shadow: 0 10px 28px rgb(0 0 0 / 25%);
    }
}

html[data-theme="dark"] div.mermaid,
body[data-theme="dark"] div.mermaid {
    box-shadow: 0 10px 28px rgb(0 0 0 / 25%);
}

/* Keep diagrams contained on narrow viewports */
div.mermaid svg {
    max-width: 100%;
    height: auto;
}