.md-header {
  position: fixed !important; /* prevent scroll-away; search must always stay at top */
  top: 92px !important;       /* lock against Material JS overriding inline style.top */
  transform: none !important; /* prevent Material JS transform-based animation */
  width: 100%;
  z-index: 500; /* below KPI header (z-index: 1000) */
}

/* md-tabs is a sibling of md-header (outside the header block), so it must also be fixed */
.md-tabs {
  position: fixed !important;
  top: 92px !important;       /* lock against Material JS overriding inline style.top */
  transform: none !important; /* prevent Material JS transform-based animation */
  width: 100%;
  z-index: 499; /* just below md-header */
}

/* TOC + nav sidebars: stick below KPI header (92px) + Material tabs (~2.4rem) */
.md-sidebar {
  top: calc(92px + 2.4rem);
}
.md-header [data-md-component="logo"] {
  display: none !important; /* KPI.zone logo is already in the custom KPI header */
}
.md-container,
.md-main {
  margin-top: 0 !important;
  padding-top: 0 !important;
}
body {
  padding-top: calc(92px + 2.4rem); /* KPI header (fixed) + Material tabs (now also fixed) */
}

/* ── Merge search field into the tabs row (desktop only) ── */
@media screen and (min-width: 60em) {
  /* Collapse the Material header bar to zero height */
  .md-header__inner {
    height: 0 !important;
    min-height: 0 !important;
    padding: 0 !important;
    overflow: visible !important;
  }

  /* Hide everything that would bleed out of the collapsed bar */
  .md-header__title,
  .md-header__option,
  .md-header__source,
  .md-header__button[for="__drawer"],
  .md-header__button.md-logo,
  a.md-logo {
    display: none !important;
  }

  /* Position the entire search widget into the tabs row,
     right-aligned with the Material content grid edge */
  .md-search {
    position: absolute !important;
    right: max(0.8rem, calc((100% - 61rem) / 2 + 0.8rem));
    top: 0;
    z-index: 2;
    display: flex !important;
    align-items: center;
  }

  /* Hide the magnifier toggle icon — show the form directly */
  .md-header__button[for="__search"],
  .md-search__icon[for="__search"],
  label.md-icon[for="__search"] {
    display: none !important;
  }

  /* Make the search form always visible; let Material handle width/expand on focus */
  .md-search__inner {
    position: relative !important;
    opacity: 1 !important;
    visibility: visible !important;
    max-height: none !important;
    top: auto !important;
    right: auto !important;
  }

  /* Reserve space so tabs don't slide under the search field */
  .md-tabs .md-grid {
    padding-right: 14rem;
  }
}