/*------------------------------------
  Header Nav Toggler
------------------------------------*/
.u-header__nav-toggler {
  position: relative;
  // @include px-to-rem(width, 40px);
  @include px-to-rem(height, 40px);
  @include px-to-rem(width, 20px);
  @include px-to-rem(height, 20px);
  // @include px-to-rem(margin-right, 20px);
  // border-radius: 50%;

  .u-header__section--admin-dark & {
    // background-color: $g-color-darkblue-v4;
    // background-color: $g-color-darkblue-v3;
  }

  i {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    -webkit-backface-visibility: hidden;
    opacity: .3;
    @include px-to-rem(font-size, 20px);

    .u-header__section--admin-dark & {
      color: $g-color-white;
    }

    .u-header__section--admin-light & {
      color: $g-color-gray-dark-v2;
    }
  }
}

@media (min-width: $g-md) {
  .u-header__nav-toggler {
    // @include px-to-rem(width, 39px);
    // @include px-to-rem(height, 39px);
    // @include px-to-rem(margin-right, 20px);

    i {
      @include px-to-rem(font-size, 20px);
    }
  }
}