/* Screenshots: subtle frame, never wider than the content column. */
.md-typeset img:not(.inline-icon) {
  max-width: 100%;
  height: auto;
  border-radius: 4px;
}
/* Small icons that sit inside a sentence (ribbon buttons etc.). */
.md-typeset img.inline-icon {
  vertical-align: middle;
  height: auto;
  margin: 0 0.15em;
}
/* Wide property tables scroll instead of squeezing. */
.md-typeset table:not([class]) {
  font-size: 0.72rem;
}

/* Sidebar: make groups (e.g. "User interface overview") stand out from the pages inside them. */
.md-nav--primary .md-nav__item--section .md-nav__item--section > .md-nav__link {
  color: var(--md-primary-fg-color);
  text-transform: uppercase;
  font-size: 0.62rem;
  letter-spacing: 0.06em;
  font-weight: 700;
  margin-top: 1.1em;
}
.md-nav--primary .md-nav__item--section .md-nav__item--section > .md-nav > .md-nav__list {
  border-left: 2px solid var(--md-default-fg-color--lightest);
  margin-left: 0.15rem;
  padding-left: 0.6rem;
}

/* QuizXpress logo in the header: wide wordmark, so size by height. */
.md-header__button.md-logo img {
  height: 1.3rem;
  width: auto;
}

/* Click-to-enlarge for screenshots */
.md-typeset img:not(.inline-icon) { cursor: zoom-in; }
.qx-zoom {
  display: none; position: fixed; inset: 0; z-index: 1000;
  background: rgba(0, 0, 0, 0.85); cursor: zoom-out;
  align-items: center; justify-content: center; padding: 2vmin;
}
.qx-zoom--open { display: flex; }
.qx-zoom img { max-width: 100%; max-height: 100%; object-fit: contain; box-shadow: 0 0 40px rgba(0,0,0,.6); }
