:root {
  --md-primary-fg-color: #1C237B;
  --md-primary-fg-color--light: #2D3A8E;
  --md-primary-fg-color--dark: #141a5e;
  --md-accent-fg-color: #4A5BC7;
  --md-accent-fg-color--transparent: #4A5BC733;
  --md-typeset-a-color: #2D3A8E;
}

/* Larger logo in header */
.md-header__button.md-logo img {
  height: 100%;
  width: auto;
  max-height: none;
}

.md-header__button.md-logo {
  height: 78px;
  padding: 8px 0;
}

/* Search highlight color - light blue instead of yellow */
.md-search-result mark,
mark {
  background-color: #c5cdf0;
  color: inherit;
}

/* Admonition note styling - blue tones matching brand */
.md-typeset .admonition.note,
.md-typeset details.note {
  border-color: #2D3A8E;
}

.md-typeset .note > .admonition-title,
.md-typeset .note > summary {
  background-color: #c5cdf0;
  border-color: #2D3A8E;
}

.md-typeset .note > .admonition-title::before,
.md-typeset .note > summary::before {
  color: #2D3A8E;
}

/* Hide the "Home" sidebar link only on the homepage */
.md-nav--primary > .md-nav__list > .md-nav__item:first-child > .md-nav__link[href="."] {
  display: none;
}

/* Two-column grid layout for home page */
.grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 1rem;
}

@media (max-width: 768px) {
  .grid {
    grid-template-columns: 1fr;
  }
}

/* -------------------------------------------------------
   Home page hub cards — 4 outlined, brand-colored cards
   ------------------------------------------------------- */
.home-cards {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 1.5rem;
  max-width: 46rem;
  margin: 2rem auto 3rem;
}

.home-cards p {
  margin: 0;
  display: flex;
}

.md-typeset .home-cards a.home-card {
  flex: 1;
  display: flex;
  align-items: center;
  justify-content: center;
  text-align: center;
  min-height: 7rem;
  padding: 1.5rem;
  border: 2px solid var(--md-primary-fg-color);
  border-radius: 0.75rem;
  color: var(--md-default-fg-color--light);
  font-size: 1.5rem;
  line-height: 1.3;
  transition: background-color 125ms ease, color 125ms ease;
}

.md-typeset .home-cards a.home-card:hover {
  background-color: var(--md-primary-fg-color);
  color: #fff;
}

@media (max-width: 768px) {
  .home-cards {
    grid-template-columns: 1fr;
  }
}

/* -------------------------------------------------------
   Documentation image classes
   - .img-bordered : screenshots with a subtle border
   - .img-plain    : diagrams / logos without a border
   - .img-centered : bordered, centered, no outer margins
   ------------------------------------------------------- */

/* Shared responsive base for all doc images */
.md-typeset .img-bordered,
.md-typeset .img-plain,
.md-typeset .img-centered {
  max-width: 100%;
  width: auto;
  height: auto;
}

/* Bordered screenshot (replaces Flare "rwdocs") */
.md-typeset .img-bordered {
  border: 1px solid #d0d0d0;
  border-radius: 4px;
  margin: 1rem 0 1.5rem 1rem;
}

/* Plain image — no border (replaces Flare "respond") */
.md-typeset .img-plain {
  margin: 1rem 0 1.5rem 1rem;
}

/* Centered image — bordered, no side margins (replaces Flare "rwdocsNomargin") */
.md-typeset .img-centered {
  border: 1px solid #d0d0d0;
  border-radius: 4px;
  display: block;
  margin: 0 auto;
}

/* Images inside tables should scale to fit the cell */
.md-typeset table img {
  max-width: 100%;
  height: auto;
  margin: 0;
}

/* Site Header Style comparison table - constrain preview images */
.header-style-table table img {
  max-width: 500px !important;
}

/* Regions: bold on desktop sidebar only (matches section header style) */
@media screen and (min-width: 76.25em) {
  .md-nav__link[href*="regions/"] {
    font-weight: 700;
  }
}

/* Mobile nav drawer: use chevron instead of hamburger for active page TOC toggle */
@media screen and (max-width: 76.234375em) {
  :root {
    --md-toc-icon: url('data:image/svg+xml;charset=utf-8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="M8.59 16.58 13.17 12 8.59 7.41 10 6l6 6-6 6z"/></svg>');
  }
}

/* Breathing room at bottom of content, above the footer */
.md-content__inner {
  padding-bottom: 8rem;
}

/* Anchor scroll offset for taller custom logo header (87px vs default 48px).
   Measured values — header: 87px, TOC observer threshold: 113px.
   Value must be >87 (clear header+shadow) and <113 (correct TOC highlight).
   Using !important to override Material's calc()-based scroll-margin-top. */
:target,
.md-typeset :target,
.md-header--lifted ~ .md-container .md-typeset :target {
  scroll-margin-top: 93px !important;
}

/* Primary nav scroll fix for the taller custom logo header.
   Material sizes the left sidebar's scroll area from the header height it
   measures once at mount; our ~87px logo header (see scroll-margin-top
   above) plus the tab bar throw that calc off, so on long pages the nav
   could not scroll to the bottom and its scrollbar overlapped the footer.
   Give the scroll area a fixed, viewport-fitting height (desktop only),
   overriding Material's calc entirely. The 200px clears the worst-case
   chrome at the top of the page (header ~86 + tab bar ~48 + sidebar
   margins), so the entire nav is always scrollable. Accepted trade-off:
   the nav may show whitespace below it when scrolled and no longer shrinks
   to hug the footer — the priority is that the full nav stays reachable. */
@media screen and (min-width: 76.25em) {
  .md-sidebar--primary .md-sidebar__scrollwrap {
    height: calc(100vh - 200px) !important;
    max-height: none !important;
  }
}

