/* Header stacking contract: utility popovers always sit above navigation. */
.tsf-header .tsf-topbar {
  isolation: isolate;
  overflow: visible;
  position: relative;
  z-index: 1300;
}

.tsf-header .tsf-topbar > div,
.tsf-header .tsf-language-switcher {
  overflow: visible;
  position: relative;
  z-index: 1301;
}

.tsf-header .tsf-language-menu,
.tsf-header .tsf-language-switcher__menu {
  z-index: 1302 !important;
}

/* The main navigation intentionally remains below the utility popover. */
.tsf-header .tsf-mainbar {
  position: relative;
  z-index: 1;
}

/* Desktop links had inherited a one-sided bottom padding from the original
 * navigation. Make their boxes match the CTA's vertical centre instead. */
@media (min-width: 768px) {
  .tsf-header .tsf-nav > a:not(.tsf-nav-cta),
  .tsf-header .tsf-nav > .tsf-nav-dropdown > .tsf-nav-dropdown-trigger > a,
  .tsf-header .tsf-nav-dropdown--menu-only > .tsf-nav-dropdown-trigger > .tsf-nav-dropdown-primary {
    align-items: center;
    display: inline-flex;
    min-height: 44px;
    padding-bottom: 0;
    padding-top: 0;
  }

  .tsf-header .tsf-nav > .tsf-nav-dropdown,
  .tsf-header .tsf-nav > .tsf-nav-dropdown > .tsf-nav-dropdown-trigger {
    align-items: center;
    display: flex;
  }

  /* The original chevron used an asymmetric bottom margin intended for an
   * underlined navigation style. Keep the trigger in the same 44px rhythm as
   * its text link, so both dropdown arrows sit on the text's visual centre. */
  .tsf-header .tsf-nav > .tsf-nav-dropdown > .tsf-nav-dropdown-trigger > button {
    align-items: center;
    align-self: center;
    display: inline-flex;
    height: 44px;
    justify-content: center;
    margin: 0 0 0 1px;
    padding: 0;
    width: 13px;
  }

  .tsf-header .tsf-nav > .tsf-nav-dropdown > .tsf-nav-dropdown-trigger > button span {
    display: block;
    height: 7px;
    position: relative;
    width: 7px;
  }

  .tsf-header .tsf-nav > .tsf-nav-dropdown > .tsf-nav-dropdown-trigger > button span::before {
    top: 0;
  }

  .tsf-header .tsf-nav > .tsf-nav-dropdown:hover > .tsf-nav-dropdown-trigger > button span::before,
  .tsf-header .tsf-nav > .tsf-nav-dropdown:focus-within > .tsf-nav-dropdown-trigger > button span::before,
  .tsf-header .tsf-nav > .tsf-nav-dropdown.is-open > .tsf-nav-dropdown-trigger > button span::before {
    top: 1px;
  }
}

/* Direct access stays available while the public call to action is pending. */
.tsf-header .tsf-nav .tsf-nav-cta--coming-soon {
  cursor: not-allowed;
  opacity: .72;
  pointer-events: none;
}