/* User Provided Stylesheet */

/* autogenerated, DO NOT EDIT ME ! - edit style_jb2.css or style_local.css instead */
/*
 * for jupyter-book 2 aka mystmd
 * with myst.yml:  template: book-theme
 * trying to improve the rendering of jupyter notebooks
 * particularly wrt spacing around lists and paragraphs
 * as well as other miscellanous tweaks
 */

/* ---------- the left hand side toc */

.primary-scrollbar {

    div.w-full {

        &[data-state='open'] {
            border: 1px solid var(--jp-border-color0);
            border-radius: 8px;
            padding-top: 0px;
        }

        div.block {
            &::before {
                content: '≡ ';
            }
        }
    }

    a.p-2 {
        padding: 0.08em 1em;

        &.active {
            &::before {
                content: '⌘ ';
            }
        }
    }
}

/* ---------- space around lists */

/* a paragraph that is just above a list should not have a bottom margin
 * thanks SO
 * https://stackoverflow.com/questions/1817792/is-there-a-previous-sibling-selector
 */
article main {
    p:has(+ :is(ol, ul)) {
        margin-bottom: 0px !important;
    }

    p+ :is(ol, ul) {
        margin-top: 0px !important;
    }

    li>ul {
        margin-top: 0px !important;
    }
}

.article :where(ul ul, ul ol, ol ul, ol ol):not(:where([class~=not-prose], [class~=not-prose] *)) {
    margin-bottom: 0.25em;
}

/* ---------- code */

:root {
    --myst-code-border-radius: 0.5rem;
    --myst-code-border-width: 0.8px;
}

/* cell inputs */
html.light {
    --myst-input-background-color: rgb(243, 244, 245);
    --myst-input-border-color: rgb(209, 213, 218);
    --myst-input-left-color: rgb(0, 128, 0);
    --myst-input-left-width: 4px;
}

html.dark {
    --myst-input-background-color: rgb(41, 49, 61);
    --myst-input-border-color: rgb(206, 214, 221);
    --myst-input-left-color: rgb(0, 128, 0);
    --myst-input-left-width: 4px;
}


.relative.group\/block>.relative.group:has(>pre) {
    border-radius: var(--myst-code-border-radius);
    border-width: var(--myst-code-border-width);
    border-color: var(--myst-input-border-color);
    background-color: var(--myst-input-background-color);
    border-left-width: var(--myst-input-left-width);
    border-left-color: var(--myst-input-left-color);
}


/* cell outputs */
html.light {
    --myst-output-background-color: rgb(248, 255, 248);
    --myst-output-border-color: blue;
    --myst-output-empty-border-color: red;
}

html.dark {
    --myst-output-background-color: rgb(6, 75, 6);
    --myst-output-border-color: rgb(35, 182, 211);
    --myst-output-empty-border-color: rgb(128, 0, 0);
}

html article main .relative.group[data-mdast-node-id] {
    &:empty {
        &::before {
            content: ' ∅ no output ∅ ';
        }
        font-size: xx-small;
        padding: 0px 1em;

        border-color: var(--myst-output-empty-border-color);
        margin-bottom: 1rem;
    }

    border-radius: var(--myst-code-border-radius);
    margin-top: 0px;
    padding: 0.25em 1em;
    border-width: var(--myst-code-border-width);
    border-color: var(--myst-output-border-color);
    background-color: var(--myst-output-background-color);

    &>div {
        border: 0px solid #00000000 !important;
        background-color: #00000000 !important;

        &>code {
            border: 0px solid #00000000 !important;
        }
    }
}
html article main .relative.group:has(+[data-mdast-node-id]) {
    margin-bottom: 0.7em;
}

/* code blocks */
html.light {
    --myst-block-background-color: rgb(243, 244, 245);
    --myst-block-border-color: rgb(209, 213, 218);
    --myst-block-left-color: rgb(0, 0, 128);
    --myst-block-left-width: 2px;
}

html.dark {
    --myst-block-background-color: rgb(41, 49, 61);
    --myst-block-border-color: rgb(72, 86, 107);
    --myst-block-left-color: rgb(0, 0, 128);
    --myst-block-left-width: 2px;
}

html body article main div.group.relative:has(>pre>code) {
    padding: .1rem .25rem !important;
    border-radius: var(--myst-code-border-radius);
    background-color: var(--myst-block-background-color);
    border-width: var(--myst-code-border-width);
    border-color: var(--myst-block-border-color);
    border-left-width: var(--myst-block-left-width);
    border-left-color: var(--myst-block-left-color);

    &>pre.hljs.block {
        background-color: #00000000 !important;
    }
}

/* inline code : use same style as blocks */
p>code {
    background-color: var(--myst-block-background-color);
    border-width: var(--myst-code-border-width);
    border-color: var(--myst-block-border-color);
    padding: 0.1rem 0.20rem;
    margin-left: 0.20rem;
    margin-right: 0.20rem;
    border-radius: 3px;
}

/* ---------- use page width more effectively */
@media (min-width: 1536px) {
    html {
        .article-grid, .xl\:article-grid {
            grid-template-columns:
                /* [screen-start] .5rem [screen-inset-start] 1fr [page-start] 3rem [page-inset-start] minmax(4rem, 9rem) [body-outset-start] 3rem [body-start gutter-left-start] 1rem [body-inset-start] minmax(8ch, 10ch) [middle-start] minmax(8ch, 10ch) [gutter-left-end] minmax(8ch, 10ch) minmax(8ch, 10ch) [gutter-right-start] minmax(8ch, 10ch) [middle-end] minmax(8ch, 10ch) [body-inset-end] 1rem [body-end gutter-right-end] 3rem [body-outset-end] minmax(5rem, 13rem) [page-inset-end] 3rem [page-end] 1fr [screen-inset-end] .5rem [screen-end]; */
                [screen-start] .5rem
                [screen-inset-start] 1fr
                [page-start] 3rem
                [page-inset-start] minmax(4rem, 9rem)
                [body-outset-start] 3rem
                [body-start gutter-left-start] 1rem
                [body-inset-start] minmax(8ch, 10ch)
                [middle-start] minmax(8ch, 10ch)
                [gutter-left-end] minmax(8ch, 10ch)
                /* this is the one we increase from minmax(8ch, 10ch)*/
                10fr
                [gutter-right-start] minmax(8ch, 10ch)
                [middle-end] minmax(8ch, 10ch)
                [body-inset-end] 1rem
                [body-end gutter-right-end] 3rem
                [body-outset-end] minmax(5rem, 13rem)
                [page-inset-end] 3rem
                [page-end] 1fr
                [screen-inset-end] .5rem
                [screen-end] !important;
        }
    }
}

.full-width {
    grid-column: body / page;
}

/* here's the settings for the medium size screens
 * it's hard to do much better,
 * ideally the right had side toc could take a little less space
*/
/* @media (min-width: 1024px) and (max-width: 1535px) {
    html {
        .article-grid, .xl\:article-grid {
            grid-template-columns:
            [screen-start] .25rem [screen-inset-start page-start] 1rem [page-inset-start body-outset-start] 1fr [body-start gutter-left-start] 1rem [body-inset-start] minmax(8ch,10ch) [middle-start] minmax(8ch,10ch) [gutter-left-end] minmax(8ch,10ch) minmax(8ch,10ch) [gutter-right-start] minmax(8ch,10ch) [middle-end] minmax(8ch,10ch) [body-inset-end] 1rem [body-end gutter-right-end] 3rem [body-outset-end] minmax(5rem,13rem) [page-inset-end] 3rem [page-end] 1fr [screen-inset-end] .25rem [screen-end]
        }
    }
} */


/* ---------- tables */
html.light {
    --myst-table-background-color-header: #f8f8f8;
    --myst-table-bottom-color-header: rgb(90, 175, 211);
    --myst-table-background-color-even: #fbfbfb;
    --myst-table-background-color-odd: #fdfdfd;
}

html.dark {
    --myst-table-background-color-header: #080808;
    --myst-table-bottom-color-header: rgb(11, 128, 137);
    --myst-table-background-color-even: #020202;
    --myst-table-background-color-odd: #040404;
}

article main table {
    thead, tfoot {
        tr {
            background-color: var(--myst-table-background-color-header);
        }
    }
    tbody {
        th {
            background-color: var(--myst-table-background-color-header);
            padding:0.65rem;
            font-size: larger;
            border-bottom-color: var(--myst-table-bottom-color-header);
            border-bottom-width: 2px;
        }
        tr:nth-child(even) {
            background-color: var(--myst-table-background-color-even);
        }

        tr:nth-child(odd) {
            background-color: var(--myst-table-background-color-odd)
        }
    }
}

/* space before admonitions */
/* :is(.bd-container, .myst) div.admonition>.admonition-title+* {
    margin-top: 0px !important;
}
 */

/* standard admonition classes */
.admonition-smaller {
    font-size: smaller;
    line-height: 1.2;
}

.admonition-small {
    font-size: small;
    line-height: 1.2;
}

.admonition-x-small {
    font-size: x-small;
    line-height: 1.2;
}

/* slight gradient for corriges */
.corrige {
    background-image: radial-gradient(circle at top left, #d1effa, #e2f9cd);
}

html[data-theme='dark'] .corrige {
    background-image: radial-gradient(circle at top left, #0e3852, #0c5517);
}/*
 * ----------- specific to this course
 * used in the notebook on memory layout
 */
 .memory > div > pre {
    color: blue;
    line-height: 1.2;

    code {
        font-size: 220%;
    }
}