/* ==================================================================
   EDITORIAL — the site's design.
   Branded and premium, but still a reference manual.

   Navy full-bleed header, DAX-bold headings with sky-blue rules, a
   deliberately narrow reading measure (~68ch) with generous leading,
   and a prominent right-hand "On this page". Screenshots are treated
   as figures with breathing room.

   Chosen as "option C" of three spiked directions (D2); the other two
   retired in DOCS-97, so the letter is gone but the file is unchanged
   in what it does. Sibling stylesheets still say "option C" or
   "direction C" here and there — same thing, this file.
   ================================================================== */

:root {
  --md-primary-fg-color: var(--rs-navy);
  --md-primary-fg-color--dark: var(--rs-navy-deep);
  --md-primary-bg-color: #ffffff;
}

body {
  background: #fff;
}

/* --- header ------------------------------------------------------- */
.md-header {
  background: var(--rs-navy);
  box-shadow: none;
}
.md-header__title {
  font-family: var(--rs-display-font);
  font-weight: 700;
  font-size: 1rem;
  letter-spacing: 0.02em;
}
.md-header .md-logo img,
.md-header .md-logo svg {
  height: 1.35rem;
  width: auto;
  filter: brightness(0) invert(1);
}
.md-search__form {
  background: rgba(255, 255, 255, 0.1);
  border-radius: 0;
}

.md-tabs {
  background: var(--rs-navy);
  border-top: 1px solid rgba(255, 255, 255, 0.1);
}
.md-tabs__link {
  font-size: 0.66rem;
  text-transform: uppercase;
  letter-spacing: 0.15em;
  opacity: 0.75;
}
.md-tabs__link--active,
.md-tabs__link:hover {
  opacity: 1;
  color: var(--rs-blue);
}

/* --- a real reading measure --------------------------------------- */
.md-content__inner {
  max-width: 46rem;
  margin: 0 auto;
  padding: 2.2rem 1.6rem 4rem;
}

.md-typeset {
  font-size: 0.8rem;
  line-height: 1.72;
  color: #1d2733;
}

/* ...except Material's toast, the "Copied to clipboard" dialog at the foot
   of the page, which is a .md-typeset block on a near-black ground. Material
   gives it the page background colour at the same specificity as the rule
   above, and this file loads later, so the rule above won and the toast was
   navy on black -- present, and unreadable. It had been that way for the
   code-block copy button since the theme was chosen; the Copy as Markdown
   button (DOCS-164) is what made someone look. */
.md-dialog__inner.md-typeset {
  color: var(--md-default-bg-color);
}

.md-typeset h1 {
  font-family: var(--rs-display-font);
  font-weight: 700;
  font-size: 2rem;
  line-height: 1.12;
  color: var(--rs-navy);
  margin: 0 0 0.4rem;
}
/* the description sits under h1 as a standfirst */
.md-typeset h1 + p {
  font-size: 0.92rem;
  line-height: 1.55;
  color: var(--rs-grey);
  margin-bottom: 2.2rem;
}

.md-typeset h2 {
  font-family: var(--rs-display-font);
  font-weight: 700;
  font-size: 1.35rem;
  color: var(--rs-navy);
  margin: 3rem 0 1rem;
  position: relative;
  padding-top: 1.1rem;
}
.md-typeset h2::before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 2.4rem;
  height: 3px;
  background: var(--rs-blue);
}

.md-typeset h3 {
  font-family: var(--rs-body-font);
  font-weight: 700;
  font-size: 0.95rem;
  color: var(--rs-navy);
  margin: 2rem 0 0.4rem;
}
.md-typeset h4 {
  font-family: var(--rs-body-font);
  font-weight: 700;
  font-size: 0.8rem;
  color: var(--rs-blue);
  margin: 1.4rem 0 0.3rem;
}

.md-typeset a {
  color: var(--rs-blue);
  text-decoration: none;
  border-bottom: 1px solid rgba(49, 162, 217, 0.3);
}
.md-typeset a:hover {
  border-bottom-color: var(--rs-blue);
}

/* --- screenshots as figures --------------------------------------- */
.md-typeset img {
  display: block;
  margin: 1.6rem auto;
  border: 1px solid var(--rs-rule);
  box-shadow: 0 2px 10px rgba(29, 39, 51, 0.07);
}

/* --- admonitions --------------------------------------------------
   The single owner of admonition styling; brand.css deliberately holds none.

   Two shapes, not one. `!!! note` gives .admonition > p.admonition-title;
   the 11 `???+ note` collapsibles converted from MadCap:dropDown give
   details > summary. Material styles the pair together, so every rule here
   names both — covering only .admonition-title is what left the dropdowns
   wearing Material's stock #448aff in a navy site.

   Specificity is load-bearing. Material's per-type rules are (0,3,0)
   — `.md-typeset .admonition.note`, `.md-typeset .note > .admonition-title`
   — and its padding rules reach (0,3,0) through [dir=ltr]. A generic
   `.md-typeset .admonition` override is (0,2,0) and loses to all of them,
   which is how a 2rem icon gutter survived here with the icon switched off,
   and how the "sky blue" left rule was actually painting Material's blue.
   The rules below match Material selector-for-selector and load after it.

   Three types exist in the corpus: note 165, warning 153, example 132.
   `important` is not among them — Flare's div.important converts to
   `!!! warning` — so it is not styled here.
   ------------------------------------------------------------------ */

/* panel */
.md-typeset .admonition,
.md-typeset details {
  border: none;
  border-radius: 0;
  box-shadow: none;
  background: #f2f8fc;
  font-size: 0.76rem;
}

/* The sky-blue rule, per type: Material's `.admonition.note { border-color }`
   is (0,3,0) and reaches border-left-color, so it would repaint a (0,2,0)
   border-left shorthand with its own blue. */
.md-typeset .admonition.note,
.md-typeset details.note,
.md-typeset .admonition.example,
.md-typeset details.example,
.md-typeset .admonition.warning,
.md-typeset details.warning {
  border-left: 3px solid var(--rs-blue);
}

/* title */
.md-typeset .admonition-title,
.md-typeset summary {
  font-family: var(--rs-body-font);
  font-weight: 700;
  font-size: 0.68rem;
  text-transform: uppercase;
  letter-spacing: 0.14em;
  color: var(--rs-blue);
}
/* Material tints the title band per type at (0,3,0). */
.md-typeset .note > .admonition-title,
.md-typeset .note > summary,
.md-typeset .example > .admonition-title,
.md-typeset .example > summary,
.md-typeset .warning > .admonition-title,
.md-typeset .warning > summary {
  background-color: transparent;
}
/* Reclaim the 2rem gutter Material reserves for the icon. Its rule is
   [dir=ltr]-qualified, so this one has to be too. */
[dir="ltr"] .md-typeset .admonition-title,
[dir="ltr"] .md-typeset summary {
  padding-left: 0.9rem;
}
/* No icons in this direction — the label carries the type. Per-type, because
   Material's own `.note > .admonition-title:before` is (0,3,1). */
.md-typeset .note > .admonition-title::before,
.md-typeset .note > summary::before,
.md-typeset .example > .admonition-title::before,
.md-typeset .example > summary::before,
.md-typeset .warning > .admonition-title::before,
.md-typeset .warning > summary::before {
  display: none;
}
/* ::after is the expand/collapse chevron on a <details>, which stays — it is
   the only affordance that the block opens. Material colours it per type. */
.md-typeset .note > summary::after,
.md-typeset .example > summary::after,
.md-typeset .warning > summary::after {
  color: var(--rs-blue);
}

/* warning inverts to a navy panel */
.md-typeset .admonition.warning,
.md-typeset details.warning {
  background: var(--rs-navy);
  color: #eef3f8;
}
.md-typeset .warning > .admonition-title,
.md-typeset .warning > summary {
  color: var(--rs-blue);
}
.md-typeset .admonition.warning a,
.md-typeset details.warning a {
  color: #fff;
  border-bottom-color: rgba(255, 255, 255, 0.5);
}
/* code and table borders inside the navy panel need to come off the dark
   background, not the light one they were drawn for */
.md-typeset .admonition.warning code,
.md-typeset details.warning code {
  background-color: rgba(255, 255, 255, 0.12);
  color: #fff;
}

/* --- navigation --------------------------------------------------- */
.md-nav {
  font-size: 0.7rem;
}
.md-nav__title {
  font-family: var(--rs-body-font);
  font-weight: 700;
  font-size: 0.62rem;
  text-transform: uppercase;
  letter-spacing: 0.15em;
  color: var(--rs-grey-mute);
}
.md-nav__link--active {
  color: var(--rs-blue) !important;
  font-weight: 700;
}

/* prominent "On this page" */
.md-sidebar--secondary .md-nav__title {
  color: var(--rs-navy);
}
.md-sidebar--secondary .md-nav__list .md-nav__link--active {
  border-left: 2px solid var(--rs-blue);
  margin-left: -0.65rem;
  padding-left: 0.45rem;
}