/* 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
 */
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);
}

/* our exercises often do
1. the thing to do

```{code-cell} ipython3
# your code
```

it would be better if we could indent the code cell but if we do, we lose the overall cell structure
as the code cell is then part of the list item, in markdown, and is no longer deemed a code cell by jupyter
*/

*+div.group\/block>div.myst-code {
    margin-top: 0.3em;
}

*:has(+div.group\/block>div.myst-code) {
    margin-bottom: 0.3em;
}
/* goes with the local tool.js
 * deep selection to take precedence from sphinx 
 */
div.CodeMirror-lines div.CodeMirror-code pre.CodeMirror-line {
    border: unset;
    border-radius: unset;
    /* do NOT shrink down, this would ruin the computation of a
       decent default width for our samples
       if needed change the size upper in the tree
       */
    font-size: 1em;
    line-height: 1.1em;
    background-color: unset;
}