/** Shopify CDN: Minification failed

Line 93:21 The "-" operator only works if there is whitespace on both sides

**/
.search__input.field__input {
  padding-left: 3.2rem !important;
  padding-top: 1.5rem;
  padding-bottom: 1.5rem;
  font: inherit;
  font-weight: 400;
}

.modal__close-button .icon,
.search .reset__button svg{
  --size: 1.4rem;
} 

.search .reset__button{
  z-index: 2;
  margin-right: -5.2rem;
}


.search__button{
  left: 0;
  right: auto;
}

.search__input.field__input::placeholder{
  opacity: 1;
  color: rgb(var(--color-foreground));
}

.search__input.field__input  + .field__label{
  padding-left: 3rem;
}

.search__button{
  right: auto;
  left: 0;
  width: auto;
  justify-content: flex-start;
}

.search .field__button{
  background: transparent;
  color: rgb(var(--color-foreground-main));
}

.search__button .icon {
  --size: 2.2rem;
}

/* Remove extra spacing for search inputs in Safari */
input::-webkit-search-decoration {
  -webkit-appearance: none;
}

@media screen and (max-width: 749px){
  .search__button{
    width: 4.4rem;
  }

  .search__input.field__input{
    padding-left: 4.4rem;
  }
}

.modal__content.search-modal,
.search-modal__content{
  background: transparent;
}

.search-modal__content-inner{ 
  flex: 1;
}

@media screen and (min-width: 750px){

  .search-modal__content-inner{ 
    margin-left: -1.2rem;
    margin-right: -1.2rem;
    height: 100%;
  }


  .search-modal__form-wrapper{
    padding-left: 1.2rem;
    padding-right: 1.2rem;
    background-color: rgb(var(--color-background-dark, var(--color-background)));
    margin-left: calc(var(--logo-width) + 1.2rem);
    width: calc(100% -(var(--logo-width) + 1.2rem));
    align-self: center;
  }
}

.search-modal__close-button{
  align-self: center;
}

@media screen and (min-width: 750px){

  .search-modal__form.search{
    margin-right: 4rem;
    margin-left: 2rem;
    max-width: calc(100% - 6rem);
  }
}

.search-modal__form .search__input{
  box-shadow: none;
  border: 0 none;
  border-radius: 0;
  border-bottom: solid .1rem rgb(var(--color-foreground));
  background: transparent;
}

@media screen and (max-width: 749px){
  .modal__content.search-modal{
    top: 100%;
    background-color: rgb(var(--color-background-dark, var(--color-background)));
    border-top: solid .1rem rgba(var(--color-border), 0.5);
    padding-bottom: .4rem;
  }
}

@media screen and (max-width: 749px){
  button.search-modal__close-button.link{
    justify-content: flex-end;
  }

  .search .reset__button{
    margin-right: -1.5rem;
    padding-top: .1rem;
  }
}