/* Site-specific overrides. stylesheets/extra.css is a verbatim copy of the
   shared theme and is never edited; everything a page needs on top of it
   belongs here.

   The first section is the correction set the module documentation sites
   share, so it stays identical across them and a change to it applies
   everywhere. Not every rule in it fires on every site, since the sites do not
   all use the same page furniture; a rule that matches nothing here is still
   carried so the section stays comparable. Rules that only this site uses go
   in the second section. */

/* =========================================================
   Shared across the PROTEUS module documentation sites
   ========================================================= */

/* Remove underline from links that contain only an image */
.md-typeset p a:has(> img) {
  text-decoration: none;
}

/* Figure captions: justified, full width, slightly smaller */
.md-typeset figcaption {
  text-align: justify;
  max-width: 100%;
  font-size: 0.85em;
  line-height: 1.5;
}

/* Paired light/dark images: show the one matching the active scheme */
.logo-dark { display: none; }
[data-md-color-scheme="slate"] .logo-light { display: none; }
[data-md-color-scheme="slate"] .logo-dark { display: inline; }

/* Modules diagram: size and show light/dark versions based on color scheme.
   Every module site embeds the same schematic, and the aspect ratio matches
   its source viewBox, so the box reserved while the SVG loads is the box it
   ends up occupying. */
.mod-diagram {
  width: 100%;
  height: auto;
  aspect-ratio: 670 / 509;
  display: none;
}
[data-md-color-scheme="default"] .mod-diagram--light {
  display: block;
}
[data-md-color-scheme="slate"] .mod-diagram--dark {
  display: block;
}
.mod-diagram:focus,
.mod-diagram:focus-visible {
  outline: none !important;
}

/* Grid cards: make the last paragraph in each card stick to the bottom of the card */
.md-typeset .grid.cards > ul > li {
  display: flex;
  flex-direction: column;
}

.md-typeset .grid.cards > ul > li > p:last-child {
  margin-top: auto;
}

/* Active top tab: magma underline (the theme targets a link class that
   this template does not emit, so the marker is set on the item) */
.md-tabs__item--active {
  border-bottom-color: var(--pt-magma);
}

/* Headings that follow an explicit horizontal rule keep the rule as their
   only separator instead of doubling it with the heading border */
.md-typeset hr + h2 {
  border-top: none;
  padding-top: 0;
}

/* Admonitions: tint the box with its signal color (set directly, since the
   theme hardcodes its own background on the admonition element) */
.md-typeset .admonition.note,
.md-typeset details.note,
.md-typeset .admonition.info,
.md-typeset details.info {
  --md-admonition-bg-color: rgba(27, 111, 168, 0.10);
  background-color: rgba(27, 111, 168, 0.10);
}

.md-typeset .note > .admonition-title::before,
.md-typeset .note > summary::before,
.md-typeset .info > .admonition-title::before,
.md-typeset .info > summary::before {
  background-color: #1B6FA8;
}

/* the fold chevron of collapsible admonitions draws in currentColor */
.md-typeset .note > summary::after,
.md-typeset .info > summary::after {
  color: #1B6FA8;
}

.md-typeset .admonition.warning,
.md-typeset details.warning,
.md-typeset .admonition.danger,
.md-typeset details.danger {
  --md-admonition-bg-color: rgba(226, 61, 40, 0.10);
  background-color: rgba(226, 61, 40, 0.10);
}

.md-typeset .warning > .admonition-title::before,
.md-typeset .warning > summary::before,
.md-typeset .danger > .admonition-title::before,
.md-typeset .danger > summary::before {
  background-color: #E23D28;
}

.md-typeset .warning > summary::after,
.md-typeset .danger > summary::after {
  color: #E23D28;
}

/* Table headers containing math keep normal typography: the tracked
   uppercase mono header style would mangle symbols and units */
.md-typeset table:not([class]) th:has(.arithmatex, mjx-container) {
  font-family: inherit;
  font-size: inherit;
  letter-spacing: normal;
  text-transform: none;
}

/* Primary buttons: the dark scheme reuses the primary color as the page
   background, so the pill inverts to the light foreground tone there. */
[data-md-color-scheme="slate"] .md-typeset .md-button--primary {
  background-color: var(--md-primary-bg-color);
  border-color: var(--md-primary-bg-color);
  color: var(--pt-void);
}
[data-md-color-scheme="slate"] .md-typeset .md-button--primary:hover,
[data-md-color-scheme="slate"] .md-typeset .md-button--primary:focus {
  background-color: var(--pt-ice);
  border-color: var(--pt-ice);
  color: var(--pt-void);
}

/* Footer: no underline on copyright and meta links */
.md-footer-copyright a,
.md-footer-meta a {
  text-decoration: none !important;
}

/* Front-page subtitle: the line under the module name, a size down and in the
   muted foreground so it reads as a caption rather than a second heading */
.md-typeset .subtitle {
  font-size: 1.0rem;
  color: var(--md-default-fg-color--light);
  margin-top: -0.1rem;
}

/* Header title doubles as a home link (see javascripts/header-links.js) */
.md-header__title[data-md-component="header-title"] {
  cursor: pointer;
  transition: opacity 0.15s ease;
}

.md-header__title[data-md-component="header-title"]:hover {
  opacity: 0.7;
}

/* =========================================================
   CALLIOPE
   ========================================================= */

/* Nothing here yet: this site needs no rules beyond the shared set above. */
