/* The header carries the Global Partnership Data Portal lockup in place of a
   text title. The lockup already says the name, so the site-name text beside it
   would repeat it; it stays in the markup for screen readers and is hidden
   visually only. */

/* The theme hides its logo below 76.23em, where a small square mark would add
   nothing beside the drawer button. Ours is the wordmark and carries the site's
   identity, so it stays — sized down rather than dropped. */
@media screen and (max-width: 76.234375em) {
  .md-header__button.md-logo {
    display: inline-flex !important;
    align-items: center;
  }
}

.md-header__button.md-logo {
  padding: 0.2rem 0.4rem;
  margin: 0.2rem 0;
}
.md-header__button.md-logo img {
  height: 2.1rem;
  width: auto;
  max-width: min(60vw, 24rem);
  display: block;
  object-fit: contain;
}

/* Hide the repeated site name, keeping it available to assistive technology. */
.md-header__title > .md-header__ellipsis > .md-header__topic:first-child .md-ellipsis {
  position: absolute;
  width: 1px; height: 1px;
  margin: -1px; padding: 0;
  overflow: hidden;
  clip: rect(0 0 0 0);
  white-space: nowrap;
}

/* Below the desktop breakpoint the drawer button sits to the left of the
   lockup, so the lockup steps down to keep both on one line. */
@media screen and (max-width: 76.234375em) {
  .md-header__button.md-logo img { height: 1.9rem; max-width: 55vw; }
}

/* On a phone the page title goes rather than the lockup: the lockup says where
   you are, the page title is repeated as the first heading below it anyway. */
@media screen and (max-width: 44.984375em) {
  .md-header__button.md-logo img { height: 1.6rem; max-width: 60vw; }
  .md-header__title { display: none; }
}

/* The drawer button sits between the lockup and the page title in the theme's
   markup, which reads as though it belongs to the logo. The header is a flex
   row, so ordering moves the controls to the right — menu immediately left of
   search — without touching the markup, so the tab order for keyboard and
   screen-reader users is unchanged. */
@media screen and (max-width: 76.234375em) {
  .md-header__inner > .md-header__button.md-logo { order: 0; }
  .md-header__inner > .md-header__title { order: 1; margin-right: auto; }
  .md-header__inner > label.md-header__button[for="__drawer"] { order: 2; }
  .md-header__inner > label.md-header__button[for="__search"] { order: 3; }
  .md-header__inner > .md-search,
  .md-header__inner > [data-md-component="search"] { order: 3; }
  .md-header__inner > .md-header__option,
  .md-header__inner > .md-header__source { order: 4; }
}

/* Below the tablet breakpoint the page title is hidden, so nothing is left to
   push the controls right — the first of them takes the free space instead. */
@media screen and (max-width: 44.984375em) {
  .md-header__inner > label.md-header__button[for="__drawer"] { margin-left: auto; }
}