/* The API reference pages, from scripts/build_reference.py. Each has .ref-actions by its title. */

/* "Markdown" and "Copy for LLM", beside the title. */
.md-typeset .ref-actions {
  display: flex;
  float: right;
  gap: 0.3rem;
  margin: 0.55rem 0 0 1rem;
}

.md-typeset .ref-actions a,
.md-typeset .ref-copy {
  background: none;
  border: 0.05rem solid var(--md-default-fg-color--lightest);
  border-radius: 0.2rem;
  color: var(--md-default-fg-color--light);
  cursor: pointer;
  font: inherit;
  font-size: 0.65rem;
  line-height: 1.6;
  padding: 0.1rem 0.5rem;
}

.md-typeset .ref-actions a:hover,
.md-typeset .ref-copy:hover {
  border-color: currentcolor;
  color: var(--md-accent-fg-color);
}

/* Each group of the page starts with a line, and each name below it has room above. */
.md-content:has(.ref-actions) .md-typeset h2 {
  border-top: 0.05rem solid var(--md-default-fg-color--lightest);
  font-weight: 600;
  margin-top: 2.5rem;
  padding-top: 1.5rem;
}

.md-content:has(.ref-actions) .md-typeset h3 {
  margin-top: 2.2rem;
}

/* Parameters, attributes, and errors, as rows rather than bullets. */
.md-content:has(.ref-actions) .md-typeset ul {
  margin-left: 0;
}

.md-content:has(.ref-actions) .md-typeset ul li {
  list-style: none;
  margin-left: 0;
  padding: 0.3rem 0;
}

.md-content:has(.ref-actions) .md-typeset ul li + li {
  border-top: 0.05rem solid var(--md-default-fg-color--lightest);
}

/* "Example" and "Output", above their code. */
.md-typeset .ref-label {
  color: var(--md-default-fg-color--light);
  font-size: 0.6rem;
  font-weight: 700;
  letter-spacing: 0.06em;
  margin: 1.2rem 0 -0.6rem;
  text-transform: uppercase;
}

@media print {
  .ref-actions {
    display: none;
  }
}

/* These pages are generated, so there's no source to edit. */
.md-content:has(.ref-actions) .md-content__button {
  display: none;
}

/* Class pages, in two columns: each method's description on the left, and its
   signature, example, and output on the right, which stays in view while its method scrolls past.
   The page's contents move to the left sidebar, so the content area is widened to make room. */
body:has(.ref-method) .md-grid {
  max-width: 80rem;
}

/* The code column fits LINE_LIMIT (62) characters of code, from build_reference.py, at every
   size, as Material scales rem with the screen. The description takes the rest. */
.md-typeset .ref-method {
  border-top: 0.05rem solid var(--md-default-fg-color--lightest);
  display: grid;
  gap: 0 2rem;
  grid-template-columns: minmax(0, 1fr) 27rem;
  margin-top: 1.5rem;
  padding-top: 0.5rem;
}

.md-typeset .ref-intro {
  border-top: 0;
  margin-top: 0;
  padding-top: 0;
}

.md-typeset .ref-method > .ref-code {
  align-self: start;
  position: sticky;
  top: 4.4rem;
}

.md-typeset .ref-method h3 {
  margin-top: 1rem;
}

/* An entry's title, and a method of an object below it. */
.md-typeset .ref-method h3 {
  font-size: 1.1rem;
  font-weight: 600;
}

.md-typeset .ref-method h4 {
  font-size: 0.95rem;
  font-weight: 600;
  margin-top: 1rem;
}

.md-typeset .ref-method h3 code,
.md-typeset .ref-method h4 code {
  background: none;
  font-size: 1em;
  padding: 0;
}

.md-typeset .ref-method > .ref-code {
  padding-top: 0.6rem;
}

/* A group's heading already has a line above it, so its first method doesn't need another. */
.md-typeset h2 + .ref-method,
.md-typeset h2 + p + .ref-method {
  border-top: 0;
}

/* Folded parameters: a plain disclosure, not an admonition. */
.md-typeset details.ref-more {
  background: none;
  border: 0;
  box-shadow: none;
  font-size: inherit;
  margin: 0 0 1rem;
  padding: 0;
}

.md-typeset details.ref-more > summary {
  background: none;
  border: 0.05rem solid var(--md-default-fg-color--lightest);
  border-radius: 0.2rem;
  color: var(--md-default-fg-color--light);
  cursor: pointer;
  display: inline-block;
  font-size: 0.7rem;
  font-weight: 400;
  margin: 0;
  padding: 0.2rem 0.6rem;
}

.md-typeset details.ref-more > summary::before,
.md-typeset details.ref-more > summary::after {
  display: none;
}

.md-typeset details.ref-more > summary:hover {
  border-color: currentcolor;
  color: var(--md-accent-fg-color);
}

.md-typeset details.ref-more[open] > summary {
  margin-bottom: 0.5rem;
}

/* Below 1280px the description would be too narrow beside the code, so the columns stack. */
@media screen and (max-width: 79.984375em) {
  .md-typeset .ref-method {
    grid-template-columns: minmax(0, 1fr);
  }

  .md-typeset .ref-method > .ref-code {
    position: static;
  }
}

/* The overview: a card for each section, with its pages listed as plain links. */
.md-typeset .ref-cards > ul > li > ul {
  list-style: none;
  margin: 0.6rem 0 0;
  padding: 0;
}

.md-typeset .ref-cards > ul > li > ul > li {
  color: var(--md-default-fg-color--light);
  font-size: 0.7rem;
  line-height: 1.5;
  margin: 0 0 0.5rem;
}

.md-typeset .ref-cards > ul > li > ul > li > a {
  display: block;
  font-size: 0.8rem;
  font-weight: 600;
}

/* Every public name, in columns that fill top to bottom. */
.md-typeset .ref-names ul {
  column-gap: 2rem;
  columns: 4 11rem;
  list-style: none;
  margin: 0;
  padding: 0;
}

.md-typeset .ref-names ul li {
  break-inside: avoid;
  margin: 0 0 0.2rem;
}

.md-typeset .ref-cards > ul > li > p:first-child strong {
  font-size: 0.9rem;
}

/* The overview is generated too, so it has no source to edit. */
.md-content:has(.ref-cards) .md-content__button {
  display: none;
}

/* Output wraps, as it's there to read rather than copy, so a long URL or message breaks across
   lines rather than hiding past the edge of its box. */
.md-typeset .ref-label + .highlight pre > code {
  overflow-wrap: anywhere;
  white-space: pre-wrap;
}