// В этом файле должны быть стили для БЭМ-блока burger, его элементов,
// модификаторов, псевдоселекторов, псевдоэлементов, @media-условий...
// Очередность: http://nicothin.github.io/idiomatic-pre-CSS/#priority

.burger {
  position: relative;
  z-index: 1;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 20px;
  min-width: 20px;
  height: 14px;
  border: none;
  padding: 0;
  background: transparent;
  user-select: none;
  cursor: pointer;

  &:hover {
    > span {
      background-color: #494f54;

      &:before,
      &:after {
        background-color: #494f54;
      }
    }
  }

  > span {
    display: block;
    position: relative;
    width: 100%;
    height: $toggler-part-height;
    font-size: 0;
    color: transparent;
    background: #494f54;
    transition: background-color $transition-time;

    &:before,
    &:after {
      content: "";
      position: absolute;
      left: 0;
      width: 100%;
      height: $toggler-part-height;
      background: #494f54;
      transform-origin: 50% 50%;
      transition: background-color $transition-time;
    }

    &:before {
      top: -7px;
    }

    &:after {
      top: 7px;
    }
  }

  // &--close {
  //   > span {
  //     transition: background $transition-time 0s;
  //     background: transparent;

  //     &:before,
  //     &:after {
  //       top: 0;
  //       transition: top $transition-time,
  //         transform $transition-time $transition-time;
  //     }

  //     &:before {
  //       transform: rotate3d(0, 0, 1, 45deg);
  //     }

  //     &:after {
  //       transform: rotate3d(0, 0, 1, -45deg);
  //     }
  //   }
  // }
}
