/*
 * Reveal the mike version selector next to the logo.
 *
 * The "modern" theme hides .md-header__title (display:none) in the logo+tabs
 * layout, and mike injects the version selector inside that block — so without
 * this it's present in the DOM but invisible (0x0). We un-hide the title block
 * and hide the (redundant) site/page title text, leaving just the dropdown.
 */
.md-header__title {
  display: flex !important;
}
.md-header__title .md-ellipsis {
  display: none !important;
}

/*
 * Keep the version selector pinned in the header while scrolling.
 *
 * mike appends its selector into the first .md-header__topic (the site-name
 * topic). When you scroll down, the modern theme adds .md-header__title--active
 * and animates that topic out (opacity:0 + translateX + pointer-events:none),
 * which would carry the version dropdown away with it. Restore the first topic
 * in the active state so the dropdown stays put. The site-name text inside it
 * is still hidden by the .md-ellipsis rule above, so only the selector shows.
 */
.md-header__title--active .md-header__topic:first-child {
  opacity: 1 !important;
  transform: none !important;
  pointer-events: auto !important;
  z-index: 0 !important;
}

/*
 * "Platform Docs" header button (-> docs.aqarios.com), injected by
 * platform-docs-button.js. Styled to match the shared template's Dashboard
 * button (#luna-app-button); sits just to its left in the header.
 */
#luna-platform-docs-button {
  order: 10;
  display: flex;
  align-items: center;
  gap: 0.5rem;
  background-color: var(--md-default-fg-color--lightest);
  border: none !important;
  outline: none !important;
  box-shadow: none !important;
  border-radius: .4rem;
  color: var(--luna-text-primary);
  font-family: var(--luna-font-body);
  font-size: .8rem;
  text-decoration: none;
  padding: 0 0.75rem;
  height: 1.6rem;
  box-sizing: border-box;
  margin-left: 0.5rem;
  white-space: nowrap;
  transition: background-color .4s ease, color .4s ease;
}
#luna-platform-docs-button:hover {
  background-color: var(--md-default-fg-color--lighter);
  color: var(--md-default-fg-color);
}
#luna-platform-docs-button svg {
  flex-shrink: 0;
  width: 1rem;
  height: 1rem;
}

/*
 * Group the version selector by minor version: version-grouping.js tags the
 * first entry of each new MAJOR.MINOR group, and this draws a divider + gap
 * above it (e.g. separating the 0.6.x cluster from 0.5.9).
 */
.md-version__item.luna-version-minor-break {
  border-top: 1px solid var(--md-default-fg-color--lightest);
  margin-top: .35rem;
  padding-top: .35rem;
}

/*
 * Render the version alias (e.g. "latest") as a colored pill in the dropdown,
 * matching the section accent. Requires `alias = true` under
 * [project.extra.version] in zensical.toml so the theme emits the badge.
 */
.md-version__alias {
  display: inline-block;
  margin-left: .4rem;
  padding: .1rem .4rem;
  border-radius: .6rem;
  background-color: var(--luna-model, var(--md-accent-fg-color));
  color: #fff;
  font-size: .55rem;
  font-weight: 700;
  letter-spacing: .06em;
  line-height: 1.4;
  text-transform: uppercase;
  opacity: 1;
  vertical-align: middle;
}
/* Keep the trigger label clean ("Luna Model 0.6.6"); pill only shows in list. */
.md-version__current .md-version__alias {
  display: none;
}

/*
 * Match the reference design: the selector trigger reads "Luna Model <version>"
 * in the section accent color. The "Luna Model " prefix is presentational, so
 * it lives here rather than in each version's mike title (which keeps the
 * dropdown entries as bare version numbers).
 */
/* Match the site font (Material defaults to Inter for the selector). */
.md-version,
.md-version__current,
.md-version__link,
.md-version__alias {
  font-family: var(--luna-font-body);
}
/* ~10% smaller than the theme default (.8rem). */
.md-version {
  font-size: .72rem;
}
/* The first header topic is bold (700) by default; keep the selector lighter. */
.md-version__link {
  font-weight: 400;
}
.md-version__current {
  color: var(--luna-model, var(--md-accent-fg-color));
  font-weight: 500;
}
.md-version__current::before {
  content: "v";
}