/*
--------------------------------------
layout
--------------------------------------
*/
.main-header {
  display               : grid;
  grid-template-columns : var(--container-primary-margin) auto 1fr auto var(--container-primary-margin);
  align-items           : center;
}

.header-bg {
  grid-column : 1/-1;
  grid-row    : 1/4;
  align-self  : stretch;
  background  : var(--color-blue-default);
  z-index     : 4;
}

.header-banner,
.header-infos,
.header-burger,
.header-logo,
.header-search,
.header-actions {
  z-index : 5;
}

.header-burger,
.header-logo,
.header-actions {
  padding : 15px 0;
}

.header-banner,
.header-infos {
  grid-column : 1/-1;
}

.header-banner {
  grid-row : 1;
}

.header-infos {
  grid-row : 2;
}

.header-burger,
.header-logo,
.header-actions {
  grid-row : 3;
}

.header-search {
  grid-row : 4;
}

.header-burger {
  grid-column : 2;
}

.header-logo {
  grid-column : 3;
}

.header-actions {
  grid-column : 4;
  grid-row    : 3;
  align-self  : stretch;
}

.header-search {
  grid-column : 2/-2;
}

.header-nav {
  z-index    : 5;
  box-shadow : 0 0 10px rgba(0, 0, 0, 0.19);
}

@media (max-width : 500px) {
  #header.main-header .header-search {
    grid-column    : 2/5;
    grid-row       : 4;
    padding-bottom : 15px;
  }

  #header .header-logo {
    padding : 15px 0 0 0;
  }

  .header-search .search-widget input[type=text] {
    width : 100%;
  }
}

@media (max-width : 767px) {
  .main-header .link-icon.home-info,.main-header .link-icon.user-info,.main-header .link-icon.gift-card-info {
    display : none !important;
  }
}

@media (max-width : 1199px) {
  .main-header {
    display               : grid;
    grid-template-columns : var(--container-primary-margin) auto auto 1fr auto var(--container-primary-margin);
    align-items           : center;
  }

  .header-logo {
    max-width : 250px;
  }

  .main-header .header-actions {
    grid-column : 5;
  }

  .main-header .link-icon {
    display : block;
  }

  .main-header .link-icon.home-info {
    display : none;
  }

  .main-header .header-actions .link-icon a:after {
    display : block;
  }

  .main-header .header-actions .link-icon.cart-info a:after {
    display : none;
  }

  .main-header .header-search {
    grid-column : 4;
    grid-row    : 3;
  }
}


@media (min-width : 1200px) {
  .main-header {
    grid-template-columns : var(--container-primary-margin) auto auto 1fr auto var(--container-primary-margin);
  }

  .header-search {
    padding : 15px 0;
  }

  .header-search {
    grid-row : 3;
  }

  .header-banner,
  .header-infos,
  .header-nav {
    grid-column : 1/-1;
  }

  .header-burger {
    grid-column : 2;
  }

  body[data-is-desktop="true"] .header-burger {
    display : none;
  }

  .header-logo {
    grid-column : 3;
  }

  .header-search {
    grid-column : 4;
    padding     : 0 25px;
  }

  .header-actions {
    grid-column : 5;
  }

  .header-nav {
    z-index : 3;
  }

  .main-header.header--is-scrolled {
    grid-template-columns : var(--container-primary-margin) auto auto 1fr auto auto var(--container-primary-margin);
  }

  .main-header.header--is-scrolled .header-bg {
    background : #000;
  }

  .main-header.header--is-scrolled .header-logo {
    padding : 0;
  }

  .main-header.header--is-scrolled .header-logo img {
    width : 255px;
  }

  .main-header.header--is-scrolled .link-icon.home-info, .main-header.header--is-scrolled .link-icon.gift-card-info, .main-header.header--is-scrolled .header-actions .link-icon .link-icon__text {
    display : none;
  }

  .main-header.header--is-scrolled .link-icon .cart-products-count {
    top : -15px;
  }

  .main-header.header--is-scrolled .header-actions .link-icon a:after {
    display : none;
  }

  .main-header.header--is-scrolled .header-nav {
    z-index     : 4;
    grid-column : 4;
    grid-row    : 3;
  }

  .main-header.header--is-scrolled .header-nav .bwa-menu__sub-menu.container-primary {
    max-width : 100%;
  }

  .main-header.header--is-scrolled .header-search {
    grid-column : 5;
    padding     : 5px;
  }

  .main-header.header--is-scrolled .header-actions {
    grid-column : 6;
  }
}

/*
--------------------------------------
global
--------------------------------------
*/

.main-header {
  padding-bottom : 10px;
}

body[data-is-desktop="true"] .main-header {
  padding-bottom : 0;
}

/*
--------------------------------------
global
--------------------------------------
*/

.main-header {
  background-color : var(--color-blue-default);
  padding-bottom   : 10px;
}

body .main-header {
  padding-bottom : 0;
  position       : sticky;
  top            : 0;
}

/*
--------------------------------------
Search
--------------------------------------
*/
.search-widget {
  width : 100%;
}

.search-widget form {
  position        : relative;
  display         : flex;
  align-items     : center;
  justify-content : center;
  height          : 40px;
}


.search-widget input[type=text] {
  width            : 60%;
  height           : 40px;
  padding          : 10px;
  padding-left     : 20px;
  color            : var(--color-white-default);
  border           : 1px solid rgba(0, 0, 0, .25);
  transition       : all .3s ease-out;
  max-width        : 400px;
  border-radius    : 3px;
  background-color : hsla(0, 0%, 100%, .2);
}

.search-widget input[type=text]::placeholder {
  color   : var(--color-white-default);
  opacity : 1;
}

.search-widget form input[type=text]:focus {
  border-color : var(--color-primary);
  outline      : none;
}

.search-widget form button[type=submit] {
  height          : 100%;
  padding         : 8px;
  display         : flex;
  justify-content : center;
  align-items     : center;
  text-align      : center;
  color           : #fff;
  background      : var(--color-black-default);
  border          : 1px solid var(--color-primary);
  border-radius   : 3px;
  margin-left     : 3px;
}

.search-widget form input[type=text]:focus + button .search {
  color : white;
}