.header-search-input.active {
  display: block;

  .searchspring--overlay {
    width: 100vw;
    height: 100vh;
    position: fixed;
    right: 0;
    left: 0;
    top: 0;
    z-index: 1;
    background-color: #000000a3;
  }
}

.header-search-input:not(.active) .ss__autocomplete--target.ss__autocomplete--target {
  display: none;
}

.ss__autocomplete--target.ss__autocomplete--target {
  border: 4px solid var(--brand-color-bondi-blue, #0078b8);
  max-width: 1150px !important;
  position: absolute;
  top: 62px !important;
  width: 90vw !important;

  @media screen and (max-width: 1024px) {
    width: 800px !important;
  }

  .ss__autocomplete {
    width: 100% !important;
    height: 100% !important;
    background-color: white;
    @media screen and (min-width: 1000px) {
      display: flex;
      flex-flow: row wrap;
    }
  }

  .ss__facet--list {
    margin-bottom: 30px;
  }

  .ss__autocomplete__terms {
    .ss__autocomplete__terms__option--active {
      font-size: 12px;
      line-height: 24px;
    }
  }

  .ss__autocomplete__facets {
    @media screen and (min-width: 1000px) {
      padding: 20px !important;
      margin-right: -20px;
    }

    .ss__facet__header {
      font-size: 14px;
      line-height: 24px;
      margin-bottom: 10px;
      font-weight: 700;
    }

    .ss__dropdown__content {
      font-size: 12px;
      line-height: 24px;
    }
    .ss__facet-list-options__option {
      margin: 0 0 2.5px 0;
      display: flex;

      span {
        text-align: left;
        font-size: 12px;
        line-height: 1.5;
        font-weight: 500;
        width: 100%;
      }
    }

  }

  .ss__autocomplete__content {
    flex: 1 1 0%;

    .ss__autocomplete__content__results {
      text-align: left;
      font-size: 12px;
      line-height: 1.5;
      .ss__autocomplete__title {
        display: none;
      }
      .ss__results {
        margin: -30px -10px -20px -10px;
        display: flex;
        flex-flow: row wrap;

        .ss__result {
          flex: 0 1 auto;
          margin: 0 0 20px 0;
          padding: 0 10px;

          .ss__result__image-wrapper {
            margin: 0 0 5px 0;

            a {
              display: block;
            }

            .ss__image {
              position: relative;
              height: 0;
              padding-bottom: 100%;
              overflow: hidden;
              line-height: 0;

              img {
                border: 0;
                bottom: 0;
                display: block;
                height: auto;
                left: 0;
                margin: auto;
                max-height: 85%;
                max-width: 100%;
                position: absolute;
                right: 0;
                top: 0;
                width: auto;
              }
            }
          }

          .ss__result__details {
            text-align: center;
            font-size: 12px;

            .ss__result__details__title {
              line-height: 18px;
              font-weight: 700;
              margin-bottom: 12px;
            }

            .product-thumbnail__price .money {
              font-size: 12px;
              line-height: 24px;
              margin-right: 5px;
              font-weight: 400;
            }
            .product-thumbnail__price.sale .price .money {
              color: var(--brand-color-bondi-blue);
            }
            .custom--from-start {
              color: black !important;
            }
          }
        }
      }
    }

  }

  .ss__autocomplete__content__info {
    margin-bottom: 20px;
    display: flex;
    justify-content: center;

    a {
      background-color: var(--brand-color-bondi-blue, #0078b8);
      border-radius: 2px;
      color: #fff;
      font-family: var(--font-matter-medium), sans-serif;
      font-weight: 500;
      padding: 10px 30px;
      text-align: center;
      text-transform: capitalize;
      font-size: 14px;
      line-height: 24px;

      &:hover {
        font-weight: initial;
      }
    }
  }

  .ss__icon--angle-right {
    display: none;
  }
  .predictive-content {
    display: flex;
    flex: 1 1;
    flex-direction: column;
  }
}

/*  Mobile */
@media (max-width: 1024px) {

  .search-popup__form .field:not(:last-child) {
    margin-bottom: 0;
  }

  predictive-search {

    .searchspring-ac#search__mobile {
      font-size: 12px;
    }

    #search__mobile.searchspring-ac {
      height: 55px;
    }
    /* Hide Products title */
    #predictive-search-products {
      display: none;
    }
  }

  /* Default completions */
  #predictive-search-results-mobile-initial {
    max-height: 90dvh !important;
    overflow-y: auto;
  }

  #predictive-search-results{
    .money{
      font-weight: 400;
    }
  }

  #predictive-search-results-mobile-initial .mobile-search-products-default {
    display: flex;
    flex-wrap: wrap;
    padding: 30px 15px;
    width: 100%;

    .money{
      font-family: var(--font-matter);
      font-weight: 400;
    }

    article {
      flex: 0 1 auto;
      margin-bottom: 20px;
      padding: 0 10px;
      text-align: center;
      width: 50%;

      .ss__image {
        height: 0;
        line-height: 0;
        overflow: hidden;
        padding-bottom: 100%;
        position: relative;
      }

      img {
        border: 0;
        bottom: 0;
        display: block;
        height: auto;
        left: 0;
        margin: auto;
        max-height: 100%;
        max-width: 100%;
        position: absolute;
        right: 0;
        top: 0;
        width: auto;
      }
    }

    .ss__result__details__title {
      font-weight: 700;
      margin-bottom: 10px;
      font-size: 12px;
      line-height: 1.5;
    }
    .product-thumbnail__price span {
      display: block;
      font-size: 12px;
      line-height: 24px;
      color: black;
    }

    .product-thumbnail__price.sale .price .money {
      color: var(--brand-color-bondi-blue);
    }

  }

  #predictive-search-results-mobile {
    max-height: unset !important;
    height: 87dvh !important;
    width: 100%;
  }

  #predictive-search-results-mobile-initial {
    font-family: var(--font-matter);
    .ss__autocomplete__facets {
      border-top: 1px solid #ebebeb;
      background-color: #4cb0e40d;
      height: 100%;
      padding: 20px 30px 80px !important;
    }
    .ss__facets {
      display: flex;
      flex-flow: row nowrap;
      font-size: 12px;
      line-height: 1.5;
      margin: 0 -10px -40px -10px;
      text-align: left;
    }
    .ss__facet__header {
      font-size: 13px;
      line-height: 24px;
      font-weight: 700;
      margin-bottom: 10px;
    }
    .ss__facet-list-options__option {
      margin-bottom: 8px!important;
      display: block;
      font-weight: 500;
    }
  }

  .predictive-search__item-content {
    align-items: center;
  }

  #predictive-search-results-products-list {
    display: flex;
    flex-wrap: wrap;
    padding: 30px 15px 0 15px;
    width: 100%;

    article {
      flex: 0 1 auto;
      margin-bottom: 20px;
      padding: 0 10px;
      text-align: center;
      width: 50%;

      .ss__image {
        height: 0;
        line-height: 0;
        overflow: hidden;
        padding-bottom: 100%;
        position: relative;
      }

      img {
        border: 0;
        bottom: 0;
        display: block;
        height: auto;
        left: 0;
        margin: auto;
        max-height: 100%;
        max-width: 100%;
        position: absolute;
        right: 0;
        top: 0;
        width: auto;
      }
    }

    .ss__result__details__title {
      font-weight: 700;
      margin-bottom: 10px;
      font-size: 12px;
      line-height: 1.5;
    }
    .product-thumbnail__price span {
      display: block;
      font-size: 12px;
      line-height: 24px;
      color: black;
    }

  }


  /* View all button */
  #predictive-search-option-search-keywords {
    margin-bottom: 30px
  }

  .predictive-search__search-for-button {
    text-align: center;
    border-top: 0;
  }
  .predictive-search--view-all {
    background-color: var(--brand-color-bondi-blue);
    border-radius: 2px;
    color: #fff;
    display: inline-block;
    font-family: var(--font-matter-medium), sans-serif;
    font-size: 13px;
    font-weight: 500;
    line-height: 24px;
    padding: 10px 30px;
    text-align: center;
    text-transform: capitalize;
  }

  /* Suggestions */
  #predictive-search-results-groups-wrapper {
    background-color: #F6FBFE;
    padding: 20px 30px 100px!important;

    a .predictive-search__item-content span {
      color: var(--brand-color-bondi-blue);
    }
    a .predictive-search__item-content mark {
      color: var(--brand-color-bondi-blue);
      font-weight: 700;
    }
  }

}

.predictive-search__item-content .was-price {
  text-decoration: none;
  .money {
    text-decoration: line-through;
  }
}

.mobile-menu .search-popup__form {
  display: none;
}
