/**
 * Callout, badge and embed styles for a host site.
 *
 * This stylesheet lives inside someone else's page, so its properties are
 * namespaced and it never sets a text colour: the body colour is inherited from
 * the host's own theme. Only the surfaces and accents flip, which keeps the
 * components readable whether the host renders light or dark.
 *
 * Three theme signals are honoured, because a host may follow the system
 * setting or expose its own toggle: `prefers-color-scheme`, a `dark`/`light`
 * class (VitePress, Nextra) and `data-theme` (Docusaurus).
 */
:root {
  --cudoc-wash: #f1f5f9;
  --cudoc-line: #e2e8f0;
  --cudoc-accent: #1d4ed8;
  --cudoc-accent-soft: #dbeafe;
  --cudoc-warn: #b45309;
  --cudoc-warn-wash: #fef6e7;
  --cudoc-danger: #b91c1c;
  --cudoc-danger-wash: #fdeeee;
}
@media (prefers-color-scheme: dark) {
  :root:not(.light):not([data-theme="light"]) {
    --cudoc-wash: #1b2336;
    --cudoc-line: #334155;
    --cudoc-accent: #7cb0fb;
    --cudoc-accent-soft: #1e3252;
    --cudoc-warn: #fbbf24;
    --cudoc-warn-wash: #2b2110;
    --cudoc-danger: #f87171;
    --cudoc-danger-wash: #2c1618;
  }
}
:root.dark,
:root[data-theme="dark"] {
  --cudoc-wash: #1b2336;
  --cudoc-line: #334155;
  --cudoc-accent: #7cb0fb;
  --cudoc-accent-soft: #1e3252;
  --cudoc-warn: #fbbf24;
  --cudoc-warn-wash: #2b2110;
  --cudoc-danger: #f87171;
  --cudoc-danger-wash: #2c1618;
}

.cudoc-code {
  margin: 1rem 0;
}
.cudoc-code > :not(.cudoc-code-title) {
  margin-top: 0;
}
.cudoc-code-title {
  padding: 0.35rem 0.85rem;
  border: 1px solid var(--cudoc-line);
  border-bottom: 0;
  border-radius: 0.5rem 0.5rem 0 0;
  background: var(--cudoc-wash);
  font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
  font-size: 0.8em;
}
/*
 * Tabs: a radio and its label before each tab, in one wrapping row. The
 * tabs follow on a row of their own, and only the checked one shows. No
 * radio is checked at first, so the default one shows until another is.
 * A browser without :has() shows every tab, as a printed page does.
 */
.cudoc-tabs {
  display: flex;
  flex-wrap: wrap;
  margin: 1rem 0;
  border: 1px solid var(--cudoc-line);
  border-radius: 0.5rem;
}
.cudoc-tab-input {
  position: absolute;
  opacity: 0;
  pointer-events: none;
}
.cudoc-tab-label {
  margin: 0;
  padding: 0.45rem 0.9rem;
  border-bottom: 2px solid transparent;
  font-size: 0.9em;
  cursor: pointer;
}
.cudoc-tab {
  order: 1;
  flex-basis: 100%;
  min-width: 0;
  padding: 0 1rem;
  border-top: 1px solid var(--cudoc-line);
}
.cudoc-tab > :first-child {
  margin-top: 1rem;
}
.cudoc-tab > :last-child {
  margin-bottom: 1rem;
}
.cudoc-tab-input:focus-visible + .cudoc-tab-label {
  outline: 2px solid var(--cudoc-accent);
  outline-offset: -2px;
}
@supports selector(:has(*)) {
  .cudoc-tab-label + .cudoc-tab {
    display: none;
  }
  .cudoc-tab-input:checked + .cudoc-tab-label + .cudoc-tab,
  .cudoc-tabs:not(:has(> .cudoc-tab-input:checked))
    > .cudoc-tab-default
    + .cudoc-tab-label
    + .cudoc-tab {
    display: block;
  }
  .cudoc-tab-input:checked + .cudoc-tab-label,
  .cudoc-tabs:not(:has(> .cudoc-tab-input:checked))
    > .cudoc-tab-default
    + .cudoc-tab-label {
    border-bottom-color: var(--cudoc-accent);
    font-weight: 600;
  }
}
@media print {
  .cudoc-tabs {
    display: block;
  }
  .cudoc-tab-input {
    display: none;
  }
  .cudoc-tab-label {
    display: block;
    padding: 0.45rem 1rem 0;
    font-weight: 600;
  }
  .cudoc-tabs .cudoc-tab {
    display: block;
    border-top: 0;
  }
}
.cudoc-table-note {
  margin: 0.5rem 0 1rem;
  font-size: 0.875em;
  opacity: 0.8;
}
.cudoc-table-note > p {
  margin: 0.25rem 0;
}
.cudoc-badge {
  display: inline-block;
  margin-left: 0.35em;
  padding: 0.1em 0.5em;
  border-radius: 0.75em;
  background: var(--cudoc-accent-soft);
  color: var(--cudoc-accent);
  font-size: 0.8em;
  font-weight: 600;
  white-space: nowrap;
  vertical-align: 0.08em;
}
.cudoc-callout {
  margin: 1.5rem 0;
  padding: 0.75rem 1rem;
  border: 1px solid var(--cudoc-line);
  border-left: 3px solid var(--cudoc-accent);
  border-radius: 0.375rem;
  background: var(--cudoc-wash);
}
.cudoc-callout > :first-child {
  margin-top: 0;
}
.cudoc-callout > :last-child {
  margin-bottom: 0;
}
.cudoc-callout-title {
  display: block;
  margin-bottom: 0.25rem;
  font-weight: 700;
}
/* As in the export, a warning is amber and a caution, which `danger` and
   `error` are read as, is red. */
.cudoc-callout-warning {
  border-left-color: var(--cudoc-warn);
  background: var(--cudoc-warn-wash);
}
.cudoc-callout-caution {
  border-left-color: var(--cudoc-danger);
  background: var(--cudoc-danger-wash);
}
/* An authored page break is invisible on a screen; the paginated exports
   turn it back on and break after it. The `hidden` attribute already does
   this, but a host reset that styles `[hidden]` would otherwise show a gap. */
.cudoc-page-break {
  display: none;
}
/* A tree embed: nested lists, where an item with children folds its list in
   a details whose summary is the item's line, and the disclosure triangle
   stands where a leaf's bullet does. Hosts style an authored details as a
   box, Docusaurus as an info alert and Nextra as a bordered panel; in a tree
   it is one line of an outline, so the box is taken off. */
.cudoc-tree,
.cudoc-tree ul {
  margin: 0;
  padding-left: 1.5em;
  list-style: disc;
}
.cudoc-tree {
  margin: 1rem 0;
}
.cudoc-tree li {
  margin: 0.25em 0;
}
.cudoc-tree li:not(.cudoc-tree-leaf) {
  list-style: none;
}
.cudoc-tree details {
  margin: 0;
  padding: 0;
  border: 0;
  border-radius: 0;
  background: none;
  box-shadow: none;
  color: inherit;
}
.cudoc-tree details > div,
.cudoc-tree details > div > div {
  margin: 0;
  padding: 0;
  border: 0;
}
.cudoc-tree summary {
  margin-left: -1.1em;
  font-weight: inherit;
  cursor: pointer;
}
/* Docusaurus's alert recolours its text and redefines the link colour and
   underline inside it; a tree keeps the page's own. */
.cudoc-tree .alert {
  --ifm-alert-foreground-color: inherit;
  --ifm-link-color: inherit;
  --ifm-link-hover-color: inherit;
  --ifm-link-decoration: inherit;
  --ifm-link-hover-decoration: inherit;
}
