$box-shadow: 0 3px 12px rgba($gradient, .16);
$logo-margin-top: null !default;

.header-sticky-helper {
   position: absolute;
   height: 0;
   top: 0;
   z-index: -1;
   width: 100%;
}

.header {
   border-bottom: 1px solid $border-color;
   position: sticky;
   width: 100%;
   z-index: 99;

   > .container-fluid {
      height: 70px;
      justify-content: space-between;
      align-items: center;
      padding-left: 25px;
      padding-right: 25px;
   }

   .logo {
      margin-top: $logo-margin-top;
      margin-right: 20px;
   }

   .header-menu-wrapper {
      display: flex;
      align-items: center;
      margin-right: auto;
      height: 100%;
   }

   .header-menu {
      display: inline-flex;
      align-items: center;

      &::before {
         background: $header-color;
         content: "";
         display: block;
         height: 20px;
         width: 1px;
         margin: 0 15px;
      }
   }

   .header-menu .level-0 {
      @include list-unstyled;

      display: inline-flex;

      li {
         padding-left: 10px;
         padding-right: 30px;

         a {
            @include underline-hover;

            color: $text-dark;
            font-size: $font-size-larger;
         }
      }
   }

   &.header-home,
   &.no-border {
      border-bottom: 0;
   }

   &.is-stuck {
      background: $white;
      box-shadow: 0 5px 40px rgba(0, 0, 0, .2);
      position: sticky;
      top: 0;
      left: 0;
      right: 0;
   }

   &.active-sticky-info {
      position: relative;
      z-index: 101;
   }

   &.is-stuck.white,
   &.search-active.white,
   &.hover {
      .logo-img {
         display: block !important;
      }

      .logo-alt {
         display: none !important;
      }
   }

   &.hover {
      background: $body-bg;

      a:not(.btn-all), p, li, .fc {
         color: $text-dark;
      }
   }

   &.white:not(.is-stuck):not(.hover) {
      a, p, li, .fc {
         color: $white;
         transition-delay: 0s;
      }

      .cartbox-focus {
         a:not(.btn), p, li, .fc {
            color: $text-dark;
         }
      }

      .header-menu::before,
      .header-store::after {
         background: $white;
      }

      @media screen and (min-width: $lg) {
         .header-icon .fc span {
            background: $white;
            color: $text-dark;
         }
      }
   }

   &.search-active:not(.is-stuck):not(.hover) {
      background: $body-bg;
      border-bottom: 0;
      box-shadow: none;

      a, p, li, .fc:not(.header-burger .fc) {
         color: $text-dark;
      }

      .cartbox-focus {
         a:not(.btn), p, li, .fc {
            color: $text-dark;
         }
      }

      .header-menu::after {
         background: $text-dark;
      }

      .header-icon .fc span {
         background: $brand-ctr;
         color: $white;
      }
   }

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

   @media screen and (max-width: $xl - 1) {
      .header-menu .level-0 {
         li {
            line-height: $line-height-sm;
            padding: 0 10px;

            a {
               font-size: $header-resp-font-size;
            }
         }
      }
   }

   @media screen and (max-width: $lg - 1) {
      > .container-fluid {
         height: 62px;
      }

      .logo {
         margin-right: 0;
      }

      &.search-active:not(.is-stuck):not(.hover) {
         display: none;
      }

      &:not(.header-ordering) {
         .header-icons {
            background: $white;
            border-radius: $border-radius;
            box-shadow: $box-shadow;
            position: fixed;
            bottom: 25px;
            left: 16px;
            right: 16px;
            top: unset;
            height: 65px;
            justify-content: space-between;
            margin: auto;
            max-width: 400px;
            padding: 5px 13px;
            z-index: 101;

            a, p, li, .fc:not(.header-burger .fc) {
               color: $text-dark;
            }

            .js-shop-added-to-cart-resp .btn-primary {
               color: $white;
            }

            #js-shop-cart {
               position: absolute;
            }
         }
      }

      &.white:not(.is-stuck):not(.hover) {
         a, p, li, .fc:not(.header-burger .fc) {
            color: $text-dark;
         }
      }

      &.is-stuck {
         position: relative;
      }

      .header-menu {
         display: none;
      }

      .logo {
         width: 100%;

         img {
            margin: auto;
         }
      }
   }

   .header-cart {
      .price {
         display: none;
      }
   }
}

@media screen and (max-width: $xs - 1) {
   .header:not(.header-ordering) {
      .header-icons {
         padding-left: 30px;
      }
   }
}
