/* Large type: about 17 px text, 19 px on wide screens (the theme's root size grows with the
   window). Bold titles. */
.md-typeset {
  font-size: 0.85rem;
}
.md-typeset h1,
.md-typeset h2 {
  color: var(--md-default-fg-color);
  font-weight: 700;
}
.md-typeset h3 {
  font-weight: 600;
}
/* The page title links to the page already; its hidden permalink would wrap on phones. */
.md-typeset h1 .headerlink {
  display: none;
}

/* The library's logo in the header, large enough to read. */
.md-header__button.md-logo img {
  height: 2rem;
}

/* The lab's logo, on the right above the page outline, on every page (not in the phone menu,
   which reuses the outline). */
.md-sidebar--secondary .lab-logo {
  display: inline-block;
  margin: 0 0 1.2rem 0.6rem;
}
.md-sidebar--secondary .lab-logo img {
  display: block;
  height: 4rem;
  width: auto;
}
.md-nav--primary .lab-logo {
  display: none;
}
/* Narrow windows and phones have no right column: the logo sits at the right end of the
   header instead, so it is always on screen. */
@media screen and (max-width: 59.9375em) {
  .md-header__inner::after {
    content: "";
    flex-shrink: 0;
    width: 2rem;
    height: 2rem;
    margin: 0 0.2rem 0 0.4rem;
    background: url("create-lab.png") center / contain no-repeat;
  }
}

/* The layout fills wide windows. */
.md-grid {
  max-width: 68rem;
}

/* The opening page belongs to no section and shows no index on a wide screen. Where the index
   is a menu behind the button of the header, it stays there, listing all the sections. */
@media screen and (max-width: 76.1875em) {
  .md-sidebar--primary[hidden] {
    display: block !important;
  }
}

/* Code cells like the theme's code blocks: no coloured margin. */
:root {
  --mystnb-source-border-color: transparent;
  --mystnb-source-margin-color: transparent;
}

/* Colours: a deep navy header on a cool, very light page; in dark mode, deep blues throughout.
   Links in blue, the figures' red as the accent. */
[data-md-color-primary="custom"] {
  --md-primary-fg-color: #13294b;
  --md-primary-fg-color--light: #1f3d6b;
  --md-primary-fg-color--dark: #0b1b33;
  --md-primary-bg-color: #ffffff;
  --md-primary-bg-color--light: rgba(255, 255, 255, 0.72);
}
[data-md-color-accent="custom"] {
  --md-accent-fg-color: #e64b35;
  --md-accent-fg-color--transparent: rgba(230, 75, 53, 0.1);
  --md-accent-bg-color: #ffffff;
  --md-accent-bg-color--light: rgba(255, 255, 255, 0.72);
}
[data-md-color-scheme="default"] {
  --md-default-bg-color: #f5f8fc;
  --md-code-bg-color: #e9eff7;
  --md-typeset-a-color: #2b5797;
  --md-footer-bg-color: #13294b;
  --md-footer-bg-color--dark: #0b1b33;
}
[data-md-color-scheme="slate"] {
  --mystnb-source-border-color: transparent;
  --md-hue: 216;
  --md-default-bg-color: #0d1a2d;
  --md-default-bg-color--light: rgba(13, 26, 45, 0.54);
  --md-default-bg-color--lighter: rgba(13, 26, 45, 0.26);
  --md-default-bg-color--lightest: rgba(13, 26, 45, 0.07);
  --md-code-bg-color: #13243d;
  --md-typeset-a-color: #8ab4f8;
  --md-footer-bg-color: #08121f;
  --md-footer-bg-color--dark: #050c16;
}
[data-md-color-scheme="slate"][data-md-color-primary="custom"] {
  --md-primary-fg-color: #08121f;
  --md-primary-fg-color--light: #12223a;
  --md-primary-fg-color--dark: #050c16;
}
[data-md-color-scheme="slate"][data-md-color-accent="custom"] {
  --md-accent-fg-color: #ff7b66;
  --md-accent-fg-color--transparent: rgba(255, 123, 102, 0.12);
}

/* Animations written by the pages (the video directive), shown at their own size or smaller. */
figure.video {
  margin: 1.5em 0;
  text-align: center;
}
figure.video video {
  display: inline-block;
  width: auto;
  height: auto;
  max-width: 100%;
  border: 1px solid var(--md-default-fg-color--lightest);
  border-radius: 0.2rem;
}
figure.video figcaption {
  font-size: 0.85em;
  color: var(--md-default-fg-color--light);
  margin-top: 0.5em;
}

/* Figures: white background in dark mode too, never wider than the text. */
.cell_output img {
  max-width: 100%;
  height: auto;
  background: #fff;
  border-radius: 0.2rem;
}

/* Task lists (the roadmap): the checkbox replaces the bullet. */
ul.contains-task-list {
  list-style: none;
  padding-left: 0.25rem;
}

/* Reference tables: names on one line and a readable last column; on a phone a wide table
   scrolls sideways inside itself instead of squeezing its columns. */
.md-typeset table.docutils td code {
  white-space: nowrap;
  word-break: normal;
  overflow-wrap: normal;
}
.md-typeset table.docutils td:last-child {
  min-width: 14em;
}

/* On a phone a table has tighter cells and its code wraps, so a three-column table fits the
   screen; a wider one still scrolls sideways inside itself. */
@media screen and (max-width: 44.9375em) {
  .md-typeset table.docutils.data:not(.plain) td,
  .md-typeset table.docutils.data:not(.plain) th {
    min-width: 0;
    padding: 0.6em 0.5em;
  }
  .md-typeset table.docutils td code {
    white-space: normal;
    overflow-wrap: anywhere;
  }
}

/* Display equations: a wide one scrolls sideways inside itself on a phone, not the page. */
.md-typeset mjx-container[display="true"] {
  overflow-x: auto;
  overflow-y: hidden;
  max-width: 100%;
}

/* The general index: its two columns stack on a phone, and long module names wrap. */
@media screen and (max-width: 44.9375em) {
  table.genindextable td {
    display: block;
    width: auto !important;
    overflow-wrap: anywhere;
  }
}
