.search-container {
  width:50%;
  z-index:99999;
  position:relative;
}

.search-container .input-wrapper {
  position:relative;
}

.search-container input {
  width:100%;
  padding:10px 40px;
  position:relative;
  display:block;
  background-imag:url('https://img.icons8.com/ios/20/null/search--v1.png');
  
  background-repea:no-repeat;
  background-positio:10px center;
}

.search-container .input-wrapper:before {
  content:url('https://img.icons8.com/ios/20/null/search--v1.png');
  position:absolute;
  z-index:9999;
  left:10px;
  top:50%;
  transform:translatey(-50%);
  width:20px;
  height:20px;
  
}

.search-container .input-wrapper.load:before  {
  content:url('https://img.icons8.com/windows/20/null/spinner-frame-2.png');
  animation:rotate 1s infinite linear;
}

.search-container input:befor {
  content:'\f002';
  position:absolute;
  display:inline-block;
  font-family:fontAwesome;
  left:0;
  top:0;
  font-size:16px;
  width:10px;
  height:10px;
}

.search-container button {
  display:none;
}

.search-container .result-container {
  display:flex;
  flex-direction: column;
  z-index:9999999;
  position:absolute;
  background:white;
  width:100%;
  border:1px solid black;
  border-top:none;
  border-radius:0 0px 5px 5px;
  padding:10px;
  gap:15px;
  overflow:auto;
  max-height:50vh;
}

.search-container .result-container a {
  font-size:14px;
  color:black!important;
  font-weight:500;
}

@keyframes rotate {
  0% {
    transform:translatey(-50%) rotate(0deg);
  }
  100% {
    transform:translatey(-50%) rotate(360deg);
  }
}