@import "responsive.scss";
@import "variables.scss";
@import "mixins.scss";
@import "typography.scss";

.MobileMenu-menu-29H8I {
  position: absolute;
  left: 0;
  border-top: 1px solid $colorSeparator;
  width: 100%;
  height: 100vh;
  background: $colorWhite;
  visibility: hidden;
  transform: translate3d(0, -100%, 0);
  overflow: scroll;
  @media (min-width: $headerBreakpoint) {
    display: none;
  }
  &.MobileMenu-isOpen-3RnM8 {
    visibility: visible;
    transform: translate3d(0, 0, 0);
  }
}

.MobileMenu-menu-29H8I .MobileMenu-item-eaDtz {
  position: relative;
  display: flex;
  align-items: center;
  justify-content: space-between;
  border-bottom: 1px solid $colorSeparatorLight;
  height: 50px;
  padding: 0 map-get($gutters, small);
  color: $colorTextLight;

  @include media(large) {
    padding: 0 map-get($gutters, large);
  }

  &.MobileMenu-link-1lHiQ {
    @include media(large) {
      display: none;
    }
  }

  a {
    color: $colorTextLight;
    text-decoration: none;
    /* stylelint-disable-next-line selector-max-type*/
    &:visited {
      color: $colorTextLight;
    }
  }

  .MobileMenu-menuLink-1Hpe5 {
    display: flex;
    align-items: center;
    justify-content: space-between;
    width: 100%;
  }
}

.MobileMenu-arrowIcon-1D8Bf {
  width: 20px;
  height: 14px;
}

.MobileMenu-selectWrapper-nEEZo {
  position: relative;
  width: 100%;
  height: 100%;
}

.MobileMenu-action-1VV5T {
  @include cover;
  display: flex;
  align-items: center;
  justify-content: flex-end;
}

.MobileMenu-select-1xq1- {
  @include cover;
  margin: 0;
  border: 0;
  padding: 0;
  background: none;
  color: $colorTextLight;
  font-family: inherit;
  font-size: inherit;
  line-height: normal;
  -webkit-appearance: none;
     -moz-appearance: none;
          appearance: none;
}

.MobileMenu-userMenu-1u5Zx {
  height: 100%;
  padding: map-get($gutters, small);
  background-color: $colorLightGrey;

  @include media(large) {
    padding: map-get($gutters, large);
  }
}

.MobileMenu-userMenuTitle-2vlqG {
  @include typography-subtitle-1;
  display: flex;
  align-items: center;
}

.MobileMenu-userMenuTitleText-18wqd {
  margin-left: map-get($gutters, small) / 2;
}

.MobileMenu-userMenuActions-1Yyru {
  margin-top: map-get($gutters, small);
}

.MobileMenu-userMenuTitleContainer-O0jkE {
  display: flex;
  justify-content: space-between;
}