/* Base styles and content styles */

:root {
    /* Browser default font-size is 16px, this way 1 rem = 10px */
    font-size: 62.5%;
    color-scheme: var(--color-scheme);
}

html {
    font-family: "New Computer Modern", "CMU Serif", "Latin Modern Roman", "Times New Roman", serif;
    color: var(--fg);
    background-color: var(--bg);
    text-size-adjust: none;
    -webkit-text-size-adjust: none;
}

body {
    margin: 0;
    font-size: 1.6rem;
    overflow-x: hidden;
}

code {
    font-family: var(--mono-font) !important;
    font-size: var(--code-font-size);
    direction: ltr !important;
}

/* make long words/inline code not x overflow */
main {
    overflow-wrap: break-word;
}

/* make wide tables scroll if they overflow */
.table-wrapper {
    overflow-x: auto;
}

/* Don't change font size in headers. */
h1 code, h2 code, h3 code, h4 code, h5 code, h6 code {
    font-size: unset;
}

.left { float: left; }
.right { float: right; }
.boring { opacity: 0.6; }
.hide-boring .boring { display: none; }
.hidden { display: none !important; }

h2, h3 { margin-block-start: 2.5em; }
h4, h5 { margin-block-start: 2em; }

.header + .header h3,
.header + .header h4,
.header + .header h5 {
    margin-block-start: 1em;
}

h1:target::before,
h2:target::before,
h3:target::before,
h4:target::before,
h5:target::before,
h6:target::before,
dt:target::before {
    display: inline-block;
    content: "»";
    margin-inline-start: -30px;
    width: 30px;
}

/* This is broken on Safari as of version 14, but is fixed
   in Safari Technology Preview 117 which I think will be Safari 14.2.
   https://bugs.webkit.org/show_bug.cgi?id=218076
*/
:target {
    /* Safari does not support logical properties */
    scroll-margin-top: calc(var(--menu-bar-height) + 0.5em);
}

.page {
    outline: 0;
    padding: 0 var(--page-padding);
    margin-block-start: calc(0px - var(--menu-bar-height)); /* Compensate for the #mdbook-menu-bar-hover-placeholder */
}
.page-wrapper {
    box-sizing: border-box;
    background-color: var(--bg);
}
html:not(.js) .page-wrapper,
.js:not(.sidebar-resizing) .page-wrapper {
    transition: margin-left 0.3s ease, transform 0.3s ease; /* Animation: slide away */
}
[dir=rtl]:not(.js) .page-wrapper,
[dir=rtl].js:not(.sidebar-resizing) .page-wrapper {
    transition: margin-right 0.3s ease, transform 0.3s ease; /* Animation: slide away */
}

/* mdBook ships `overflow-y: auto` here, which quietly makes the whole reading
   column a scroll container: `visible` on the other axis is forced to `auto`
   too, so #mdbook-content ends up scrollable in both directions. On this book it
   has range to spare — a .gutter-figure near the end of a chapter hangs ~85px
   past the bottom edge, and .full-bleed's 90vw is ~84px wider than the column —
   so a box 69,000px tall, sitting under the pointer everywhere a reader reads,
   catches every wheel gesture. It scrolls its own few dozen pixels, hits the
   end, and rubber-bands; macOS latches the gesture to it for the rest of the
   swipe, so the page behind simply stops. That is the "scrolling gets locked"
   bug, and it fires over plain prose with nothing scrollable in sight.

   `clip` clips at exactly the same place `auto` did — the rendering is
   unchanged, including the clipped edges of full-bleed video — but a clipped box
   is not a scroll container, so there is nothing left to latch onto.
   `display: flow-root` keeps the block formatting context that `overflow: auto`
   was also providing; `clip` alone would let floats escape the column. */
.content {
    display: flow-root;
    overflow: clip;
    padding: 0 5px 50px 5px;
}
.content main {
    margin-inline-start: auto;
    margin-inline-end: auto;
    max-width: var(--content-max-width);
}
.content p { line-height: 1.45em; }
.content ol { line-height: 1.45em; }
.content ul { line-height: 1.45em; }
.content a { text-decoration: none; }
.content a:hover { text-decoration: underline; }
.content img, .content video { max-width: 100%; }
.content .header:link,
.content .header:visited {
    color: var(--fg);
}
.content .header:link,
.content .header:visited:hover {
    text-decoration: none;
}

table {
    margin: 0 auto;
    border-collapse: collapse;
}
table td {
    padding: 3px 20px;
    border: 1px var(--table-border-color) solid;
}
table thead {
    background: var(--table-header-bg);
}
table thead td {
    font-weight: 700;
    border: none;
}
table thead th {
    padding: 3px 20px;
}
table thead tr {
    border: 1px var(--table-header-bg) solid;
}
/* Alternate background colors for rows */
table tbody tr:nth-child(2n) {
    background: var(--table-alternate-bg);
}


blockquote {
    margin: 20px 0;
    padding: 0 20px;
    color: var(--fg);
    background-color: var(--quote-bg);
    border-block-start: .1em solid var(--quote-border);
    border-block-end: .1em solid var(--quote-border);
}

/* TODO: Remove .warning in a future version of mdbook, it is replaced by
blockquote tags. */
.warning {
    margin: 20px;
    padding: 0 20px;
    border-inline-start: 2px solid var(--warning-border);
}

.warning:before {
    position: absolute;
    width: 3rem;
    height: 3rem;
    margin-inline-start: calc(-1.5rem - 21px);
    content: "ⓘ";
    text-align: center;
    background-color: var(--bg);
    color: var(--warning-border);
    font-weight: bold;
    font-size: 2rem;
}

blockquote .warning:before {
    background-color: var(--quote-bg);
}

kbd {
    background-color: var(--table-border-color);
    border-radius: 4px;
    border: solid 1px var(--theme-popup-border);
    box-shadow: inset 0 -1px 0 var(--theme-hover);
    display: inline-block;
    font-size: var(--code-font-size);
    font-family: var(--mono-font);
    line-height: 10px;
    padding: 4px 5px;
    vertical-align: middle;
}

sup {
    /* Set the line-height for superscript and footnote references so that there
       isn't an awkward space appearing above lines that contain the footnote.

       See https://github.com/rust-lang/mdBook/pull/2443#discussion_r1813773583
       for an explanation.
    */
    line-height: 0;
}

.footnote-definition {
    font-size: 0.9em;
}
/* The default spacing for a list is a little too large. */
.footnote-definition ul,
.footnote-definition ol {
    padding-left: 20px;
}
.footnote-definition > li {
    /* Required to position the ::before target */
    position: relative;
}
.footnote-definition > li:target {
    scroll-margin-top: 50vh;
}
.footnote-reference:target {
    scroll-margin-top: 50vh;
}
/* Draws a border around the footnote (including the marker) when it is selected.
   TODO: If there are multiple linkbacks, highlight which one you just came
   from so you know which one to click.
*/
.footnote-definition > li:target::before {
    border: 2px solid var(--footnote-highlight);
    border-radius: 6px;
    position: absolute;
    top: -8px;
    right: -8px;
    bottom: -8px;
    left: -32px;
    pointer-events: none;
    content: "";
}
/* Pulses the footnote reference so you can quickly see where you left off reading.
   This could use some improvement.
*/
@media not (prefers-reduced-motion) {
    .footnote-reference:target  {
        animation: fn-highlight 0.8s;
        border-radius: 2px;
    }

    @keyframes fn-highlight {
        from {
            background-color: var(--footnote-highlight);
        }
    }
}

.tooltiptext {
    position: absolute;
    visibility: hidden;
    color: #fff;
    background-color: #333;
    transform: translateX(-50%); /* Center by moving tooltip 50% of its width left */
    left: -8px; /* Half of the width of the icon */
    top: -35px;
    font-size: 0.8em;
    text-align: center;
    border-radius: 6px;
    padding: 5px 8px;
    margin: 5px;
    z-index: 1000;
}
.tooltipped .tooltiptext {
    visibility: visible;
}

.chapter li.part-title {
    color: var(--sidebar-fg);
    margin: 5px 0px;
    font-weight: bold;
}

.result-no-output {
    font-style: italic;
}

.fa-svg svg {
    width: 1em;
    height: 1em;
    fill: currentColor;
    margin-bottom: -0.1em;
}

dt {
    font-weight: bold;
    margin-top: 0.5em;
    margin-bottom: 0.1em;
}

/* This uses a CSS counter to add numbers to definitions, but only if there is
 more than one definition. */
dl, dt {
    counter-reset: dd-counter;
}

/* When there is more than one definition, increment the counter. The first
selector selects the first definition, and the second one selects definitions
2 and beyond.*/
dd:has(+ dd), dd + dd {
    counter-increment: dd-counter;
    /* Use flex display to help with positioning the numbers when there is a p
    tag inside the definition. */
    display: flex;
    align-items: flex-start;
}

/* Shows the counter for definitions. The first selector selects the first
definition, and the second one selections definitions 2 and beyond.*/
dd:has(+ dd)::before, dd + dd::before  {
    content: counter(dd-counter) ". ";
    font-weight: 600;
    display: inline-block;
    margin-right: 0.5em;
}

dd > p {
    /* For loose definitions that have a p tag inside, don't add a bunch of
    space before the definition. */
    margin-top: 0;
}

/* Remove some excess space from the bottom. */
.blockquote-tag p:last-child {
    margin-bottom: 2px;
}

.blockquote-tag {
    /* Add some padding to make the vertical bar a little taller than the text.*/
    padding: 2px 0px 2px 20px;
    /* Add a solid color bar on the left side. */
    border-inline-start-style: solid;
    border-inline-start-width: 4px;
    /* Disable the background color from normal blockquotes . */
    background-color: inherit;
    /* Disable border blocks from blockquotes. */
    border-block-start: none;
    border-block-end: none;
}

.blockquote-tag-title svg {
    fill: currentColor;
    /* Add space between the icon and the title. */
    margin-right: 8px;
}

.blockquote-tag-note {
    border-inline-start-color: var(--blockquote-note-color);
}

.blockquote-tag-tip {
    border-inline-start-color: var(--blockquote-tip-color);
}

.blockquote-tag-important {
    border-inline-start-color: var(--blockquote-important-color);
}

.blockquote-tag-warning {
    border-inline-start-color: var(--blockquote-warning-color);
}

.blockquote-tag-caution {
    border-inline-start-color: var(--blockquote-caution-color);
}

.blockquote-tag-note .blockquote-tag-title {
    color: var(--blockquote-note-color);
}

.blockquote-tag-tip .blockquote-tag-title {
    color: var(--blockquote-tip-color);
}

.blockquote-tag-important .blockquote-tag-title {
    color: var(--blockquote-important-color);
}

.blockquote-tag-warning .blockquote-tag-title {
    color: var(--blockquote-warning-color);
}

.blockquote-tag-caution .blockquote-tag-title {
    color: var(--blockquote-caution-color);
}

.blockquote-tag-title {
    /* Slightly increase the weight for more emphasis. */
    font-weight: 600;
    /* Vertically center the icon with the text. */
    display: flex;
    align-items: center;
    /* Remove default large margins for a more compact display. */
    margin: 2px 0 8px 0;
}

.blockquote-tag-title .fa-svg {
    fill: currentColor;
    /* Add some space between the icon and the text. */
    margin-right: 8px;
}