/* thcb_shared_menu styles */

html {
  --shared-menu-bg-color: var(--thpColorMain100, light-dark(#EEF9FF, #001522));
  --shared-menu-font-color: var(--thpColorFont, light-dark(#262626, #FFFFFF));
  --shared-menu-font-weight: var(--thpFontWeightMedium, 500);
  --shared-menu-transition-duration: var(--thpTransitionDuration, 200ms);
  --shared-menu-transition-easing: var(--thpTransitionEasing, ease);
  --shared-menu-text-decoration-offset: var(--thpTextDecorationOffset, 0.15em);
  --shared-menu-focus-color: var(--thpColorSecondary500, #EEA45E);
  --shared-menu-active-bg-color: var(--thpColorMain600, light-dark(#146BAC, #D2E6F7));
  --shared-menu-active-font-color: var(--thpColorFontInverse, light-dark(#FFFFFF, #050E14));
}

.shared-menu {
  background-color: var(--shared-menu-bg-color);
}

.shared-menu__inner {
  padding-block: 0.5rem;
}

.shared-menu__inner .menu {
  display: flex;
  align-items: center;
  gap: 1rem;
}

@media only screen and (min-width: 46.875em) {
  .shared-menu__inner .menu {
    justify-content: center;
    position: relative;
  }
}

.shared-menu__inner a {
  display: inline-block;
  padding-block: 0.5rem;
  color: var(--shared-menu-font-color);
  font-weight: var(--shared-menu-font-weight);
  text-decoration-color: transparent;
  font-size: 0.6875rem;
  border-radius: 0.5rem;
  transition: text-decoration-color var(--shared-menu-transition-duration) var(--shared-menu-transition-easing);
}

.shared-menu__inner a:is(:hover, :focus-visible, :active) {
  text-decoration-color: currentColor;
  text-underline-offset: var(--shared-menu-text-decoration-offset);
}

.shared-menu__inner a:focus-visible {
  outline-style: solid;
  outline-width: 2px;
  outline-offset: 2px;
  outline-color: var(--shared-menu-focus-color);
}

@media only screen and (min-width: 23.4375em) {
  .shared-menu__inner a {
    font-size: 0.8125rem;
  }
}

@media only screen and (min-width: 46.875em) {
  .shared-menu__inner a {
    font-size: 0.875rem;
  }
}

@media only screen and (min-width: 87.5em) {
  .shared-menu__inner a {
    font-size: 1.125rem;
  }
}

.shared-menu__inner .menu-item--separate {
  margin-inline-start: auto;
}

@media only screen and (min-width: 46.875em) {
  .shared-menu__inner .menu-item--separate {
    margin-inline-start: 0;
    position: absolute;
    top: 50%;
    right: 0;
    transform: translateY(-50%);
  }
}

@media only screen and (min-width: 46.875em) {
  .shared-menu__inner .menu-item--separate a {
    font-size: 0.8125rem;
  }
}

@media only screen and (min-width: 62.5em) {
  .shared-menu__inner .menu-item--separate a {
    font-size: 0.8125rem;
  }
}

.shared-menu__inner .menu-item--active-trail a {
  background-color: var(--shared-menu-active-bg-color);
  color: var(--shared-menu-active-font-color);
  border-radius: 2rem;
  padding: 0.5rem 0.75rem;

  [data-site="site-thcb_landing"] & {
    background-color: transparent;
    color: var(--shared-menu-font-color);
  }
}