/* The API reference: one page per API, and the index. Built by build.py from the OpenAPI specs.
   Colours come from the site's theme variables, so light and dark modes both work. Method labels
   are text as well as colour, so the method is never shown by colour alone. Wide tables and code
   scroll inside their own box, so the page never scrolls sideways on a phone. */

/* styles.css reads these variables but does not define them: each page sets its own :root, as the
   other page stylesheets do. Without them the body falls back to Times on a transparent background.
   The wider measure fits the endpoint sidebar and the code samples. */
:root { --bg: #fafafa; --fg: #111111; --muted: #5c5c5c; --accent: #2f6f4f; --rule: #dddddd; --font: ui-monospace, "SF Mono", "Cascadia Mono", "Segoe UI Mono", Menlo, Consolas, monospace; --content-w: 58rem; --gutter: clamp(1.25rem, 4vw, 1.75rem); }
@media (prefers-color-scheme: dark) { :root:not([data-theme="light"]) { --bg: #0a0a0a; --fg: #eeeeee; --muted: #9a9a9a; --accent: #4fae82; --rule: #262626; } }

.wrap {
  max-width: var(--content-w);
  margin: 0 auto;
  padding: 0 var(--gutter);
}

.api-reference {
  padding-bottom: 2rem;
}

.api-reference h1 {
  font-size: 1.9rem;
  line-height: 1.2;
  margin: 0.25rem 0 0.75rem;
}

.api-reference h2 {
  font-size: 1.35rem;
  margin: 2.5rem 0 0.75rem;
  padding-top: 1rem;
  border-top: 1px solid var(--rule);
}

.api-reference h3 {
  font-size: 1.1rem;
  line-height: 1.4;
  margin: 2rem 0 0.5rem;
  overflow-wrap: anywhere;
}

.api-reference h4 {
  font-size: 0.95rem;
  margin: 1.25rem 0 0.4rem;
}

.api-reference p,
.api-reference li {
  overflow-wrap: anywhere;
}

.api-kicker {
  font-size: 0.85rem;
  color: var(--muted);
  margin: 0;
}

.api-muted {
  color: var(--muted);
}

.api-facts {
  list-style: none;
  padding: 0;
  margin: 0.5rem 0 1rem;
  display: flex;
  flex-wrap: wrap;
  gap: 0.25rem 1.25rem;
  font-size: 0.92rem;
}

.api-auth {
  font-size: 0.95rem;
}

.api-summary {
  font-size: 1rem;
  margin: 0.25rem 0 0.5rem;
}

.api-label {
  font-size: 0.85rem;
  color: var(--muted);
  margin: 0.75rem 0 0.25rem;
}

.api-reference code {
  font-size: 0.9em;
  background: var(--rule);
  padding: 0.1em 0.35em;
  border-radius: 3px;
  overflow-wrap: anywhere;
}

.api-reference pre {
  background: var(--rule);
  padding: 0.85rem 1rem;
  margin: 0.25rem 0 1rem;
  overflow-x: auto;
  font-size: 0.85rem;
  line-height: 1.5;
  border-radius: 4px;
}

.api-reference pre code {
  background: none;
  padding: 0;
  font-size: inherit;
  overflow-wrap: normal;
}

.api-method {
  display: inline-block;
  min-width: 4.2em;
  text-align: center;
  font-family: var(--font-mono, ui-monospace, Menlo, monospace);
  font-size: 0.75rem;
  font-weight: 600;
  letter-spacing: 0.04em;
  padding: 0.15em 0.45em;
  border: 1px solid var(--fg);
  border-radius: 3px;
  vertical-align: 0.1em;
}

.api-method-post,
.api-method-put,
.api-method-patch,
.api-method-delete {
  border-color: var(--accent);
  color: var(--accent);
}

.api-path {
  font-size: 0.95rem;
}

.api-table {
  overflow-x: auto;
  margin: 0.25rem 0 1rem;
  border: 1px solid var(--rule);
  border-radius: 4px;
}

.api-table table {
  width: 100%;
  border-collapse: collapse;
  font-size: 0.88rem;
  line-height: 1.45;
}

.api-table th,
.api-table td {
  text-align: left;
  vertical-align: top;
  padding: 0.5rem 0.65rem;
  border-bottom: 1px solid var(--rule);
}

.api-table thead th {
  font-weight: 600;
  color: var(--muted);
  font-size: 0.8rem;
}

.api-table tbody tr:last-child th,
.api-table tbody tr:last-child td {
  border-bottom: none;
}

.api-table th[scope="row"] {
  font-weight: 400;
  white-space: nowrap;
}

.api-table th[scope="row"] code {
  white-space: normal;
}

.api-layout {
  display: flex;
  flex-direction: column;
}

.api-layout > * {
  min-width: 0;
}

.api-main {
  min-width: 0;
}

/* On phones the endpoint list is short: the groups only. The operations under each group show
   on wide screens, where the list is a sidebar. */
.api-toc {
  margin: 1.25rem 0 0.5rem;
  padding: 0.75rem 0 0.25rem;
  border-top: 1px solid var(--rule);
  border-bottom: 1px solid var(--rule);
  font-size: 0.92rem;
}

.api-toc-label {
  font-size: 0.8rem;
  color: var(--muted);
  margin: 0.5rem 0;
}

.api-toc ul {
  list-style: none;
  padding: 0;
  margin: 0;
}

.api-toc > ul > li {
  margin: 0.2rem 0;
}

.api-toc-ops {
  display: none;
}

.api-toc a {
  text-decoration: none;
}

.api-toc-ops a {
  display: block;
  padding: 0.15rem 0;
  font-size: 0.85rem;
  overflow-wrap: anywhere;
}

.api-toc-ops .api-method {
  min-width: 3.4em;
  font-size: 0.65rem;
}

.api-toc-ops .api-path {
  font-size: 0.82rem;
}

.visually-hidden {
  position: absolute;
  width: 1px;
  height: 1px;
  overflow: hidden;
  clip: rect(0 0 0 0);
  white-space: nowrap;
}

/* The index cards: one per API. */
.api-cards {
  list-style: none;
  padding: 0;
  margin: 1.5rem 0 0;
  display: grid;
  gap: 1rem;
}

.api-card {
  border: 1px solid var(--rule);
  border-radius: 4px;
  padding: 1rem 1.1rem;
}

.api-card h2 {
  border-top: none;
  margin: 0 0 0.35rem;
  padding-top: 0;
  font-size: 1.15rem;
}

.api-card p {
  margin: 0.25rem 0 0.5rem;
  font-size: 0.95rem;
}

.api-card .api-facts {
  margin: 0;
}

@media (min-width: 720px) {
  .api-cards {
    grid-template-columns: 1fr 1fr;
  }
}

@media (min-width: 960px) {
  .api-layout {
    display: grid;
    grid-template-columns: 15rem minmax(0, 1fr);
    gap: 2.5rem;
    align-items: start;
  }

  .api-toc {
    position: sticky;
    top: 1.5rem;
    max-height: calc(100vh - 3rem);
    overflow-y: auto;
    margin-top: 0.5rem;
    border-bottom: none;
  }

  .api-toc-ops {
    display: block;
    margin: 0.2rem 0 0.6rem 0.25rem;
    padding-left: 0.6rem;
    border-left: 1px solid var(--rule);
  }
}

@media print {
  .api-toc {
    display: none;
  }
}

/* The trail above an endpoint page: API reference / service / endpoint. */
.api-crumbs {
  font-size: 0.88rem;
  color: var(--muted);
  margin: 0.5rem 0 0;
}

.api-crumbs ol {
  list-style: none;
  padding: 0;
  margin: 0;
  display: flex;
  flex-wrap: wrap;
  gap: 0.2rem 0.5rem;
}

.api-crumbs li + li::before {
  content: "/";
  margin-right: 0.5rem;
  color: var(--rule);
}

.api-crumbs [aria-current="page"] {
  overflow-wrap: anywhere;
}
