/* ==========================================================================
   Global tweaks for all documentation pages (responsive, readability)
   ========================================================================== */

/* Media never overflows the content column */
.md-typeset img,
.md-typeset video,
.md-typeset iframe {
  max-width: 100%;
  height: auto;
}

.md-typeset img {
  border-radius: 0.4rem;
}

/* Header logo should not get rounded corners */
.md-header__button.md-logo img {
  border-radius: 0;
}

/* Long URLs, paths and inline code wrap instead of overflowing on phones */
.md-typeset p,
.md-typeset li,
.md-typeset td {
  overflow-wrap: break-word;
}

.md-typeset :not(pre) > code {
  overflow-wrap: anywhere;
}

/* Tables: full width, comfortable cells, scroll horizontally when narrow */
.md-typeset__table {
  width: 100%;
}

.md-typeset__table table:not([class]) {
  display: table;
  width: 100%;
}

.md-typeset table:not([class]) th {
  white-space: nowrap;
}

/* Code blocks: slightly rounded, consistent with admonitions */
.md-typeset pre > code {
  border-radius: 0.3rem;
}

.md-typeset .admonition,
.md-typeset details {
  border-radius: 0.3rem;
}

@media screen and (max-width: 44.9375em) {
  /* Edge-to-edge code blocks on phones read better than tiny boxed ones */
  .md-typeset pre > code {
    font-size: 0.75em;
  }

  .md-typeset h1 {
    font-size: 1.6em;
  }

  .md-typeset table:not([class]) {
    font-size: 0.7rem;
  }

  .md-typeset table:not([class]) th,
  .md-typeset table:not([class]) td {
    padding: 0.6em 0.8em;
  }
}