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

.page-header {
  $block-name: &;

  padding: 20px 0;
  background-color: #fff;

  @at-root .mob-menu-active & {
    @media (min-width: $screen-md) {
      position: relative;
      z-index: 2;
    }
  }

  @media (min-width: $screen-xxl) {
    padding-top: 40px;
    padding-bottom: 40px;
  }

  @media (min-width: $screen-xl) {
    padding-top: 35px;
    padding-bottom: 35px;
  }

  @media (min-width: $screen-md) {
    padding-top: 30px;
    padding-bottom: 30px;
  }

  &.fixed {
    position: fixed !important;
    z-index: 2;
    left: 0;
    top: 0;
    width: 100%;
    box-shadow: 0 10px 20px rgba(0, 0, 0, 0.05);

    @media (min-width: $screen-md) {
      padding-top: 20px;
      padding-bottom: 20px;
    }

    .logo {
      @media (min-width: $screen-md) {
        width: 150px;
      }
    }
  }

  & + .big-text {
    margin-top: 20px;

    @media (min-width: $screen-xl) {
      margin-top: 70px;
    }

    @media (min-width: $screen-md) {
      margin-top: 40px;
    }
  }

  #{$block-name}__inner {
    display: flex;
    align-items: center;
  }

  #{$block-name}__right {
    display: flex;
    align-items: center;
    margin-left: auto;
    padding-left: 15px;

    .simple-menu,
    .feedback {
      margin-right: 20px;

      @media (min-width: $screen-xxl) {
        margin-right: 70px;
      }

      @media (min-width: $screen-xl) {
        margin-right: 55px;
      }

      @media (min-width: $screen-lg) {
        margin-right: 40px;
      }

      @media (min-width: $screen-md) {
        margin-right: 30px;
      }
    }

    .feedback,
    .dropdown {
      @media (max-width: ($screen-sm - 1)) {
        display: none;
      }
    }

    .simple-menu {
      @media (min-width: $screen-lg) {
        display: flex;
      }

      @media (max-width: ($screen-lg - 1)) {
        display: none;
      }
    }

    .burger {
      display: inline-flex;

      @media (min-width: $screen-lg) {
        display: none;
      }

      @media (min-width: $screen-md) {
        margin-right: 30px;
      }

      @media (min-width: $screen-sm) {
        margin-right: 20px;
      }
    }
  }
}
