/* Keep the original header composition and its place in the document. */
html {
  scroll-padding-top: calc(var(--rdc-scroll-header-height, 0px) + 24px);
}

.unified-header[data-scroll-header] {
  --rdc-header-background: #fff;
  position: sticky;
  top: 0;
  transition: transform 180ms ease;
}

.unified-header--overlay[data-scroll-header] {
  position: fixed;
  left: 0;
}

.unified-header--dark[data-scroll-header] {
  --rdc-header-background: #06142e;
}

html[data-theme="dark"] .unified-header--theme[data-scroll-header] {
  --rdc-header-background: #071124;
}

.unified-header.unified-header--overlay[data-scroll-header][data-header-scrolled="true"] {
  background: var(--rdc-header-background);
}

.unified-header[data-scroll-header][data-header-hidden="true"] {
  transform: translateY(calc(-100% - 1px));
  pointer-events: none;
}

.unified-header[data-scroll-header][data-header-hidden="true"]:focus-within {
  transform: translateY(0);
  pointer-events: auto;
}

html[data-motion="reduced"] .unified-header[data-scroll-header] {
  transition: none;
}

@media (prefers-reduced-motion: reduce) {
  .unified-header[data-scroll-header] {
    transition: none;
  }
}