<div class="radikalwp-search">
  <svg viewBox="0 0 24 24"><circle cx='11' cy='11' r='8'/><line x1='21' y1='21' x2='16.65' y2='16.65'/><//svg>
  <input type="search" placeholder="جستجو کنید...">
<//div>

.radikalwp-search {
  position: relative;
  width: 320px;
}
.radikalwp-search svg {
  position: absolute;
  top: 50%;
  right: 14px;
  transform: translateY(-50%);
  width: 18px;
  height: 18px;
  fill: none;
  stroke: #94a3b8;
  stroke-width: 2;
  stroke-linecap: round;
  pointer-events: none;
}
.radikalwp-search input {
  width: 100%;
  padding: 13px 42px 13px 16px;
  font-family: inherit;
  font-size: 14px;
  color: #0f172a;
  background: #f8fafc;
  border: 1.5px solid transparent;
  border-radius: 99px;
  outline: none;
  transition: all .25s;
}
.radikalwp-search input:focus {
  background: #fff;
  border-color: #a5b4fc;
  box-shadow: 0 0 0 4px rgba(99, 102, 241, .12);
}