Input

<input type="checkbox" style="display: none;" id="searched" />
<div class="outer">
  <div class="tooltip">
    <div class="a"></div>
    <div class="b"></div>
    <div class="b"></div>
    <div class="b"></div>
    <div class="b"></div>
    <div class="b"></div>
    <div class="b"></div>
    <div class="label">
      <div class="c"></div>
      <div class="c"></div>
      <span>Click Search</span>
    </div>
  </div>
  <div class="a"></div>
  <div class="b"></div>
  <div class="b"></div>
  <div class="b"></div>
  <div class="b"></div>
  <div class="b"></div>
  <div class="b"></div>
  <label for="text-field" class="label">
    <div class="c"></div>
    <div class="c"></div>
    <label for="searched" class="searched-thing">
      <svg
        viewBox="0 0 24 24"
        xmlns="http://www.w3.org/2000/svg"
        class="search"
      >
        <defs>
          <radialGradient r="1" cy="0" cx="0" id="myGradient">
            <stop stop-color="white" offset="0%"></stop>
            <stop stop-color="#928293" offset="100%"></stop>
          </radialGradient>
        </defs>
        <path
          class="search-path"
          d="M9.5,3A6.5,6.5 0 0,1 16,9.5C16,11.11 15.41,12.59 14.44,13.73L14.71,14H15.5L20.5,19L19,20.5L14,15.5V14.71L13.73,14.44C12.59,15.41 11.11,16 9.5,16A6.5,6.5 0 0,1 3,9.5A6.5,6.5 0 0,1 9.5,3M9.5,5C7,5 5,7 5,9.5C5,12 7,14 9.5,14C12,14 14,12 14,9.5C14,7 12,5 9.5,5Z"
        ></path>
        <path
          class="chevron-path"
          d="M7.41,15.41L12,10.83L16.59,15.41L18,14L12,8L6,14L7.41,15.41Z"
        ></path>
      </svg>
    </label>
    <input
      placeholder="Search..."
      class="text-field"
      name="text"
      type="text"
      id="text-field"
    />
    <button class="filter">
      <div class="filter-outer"></div>
      <div class="filter-inner">
        <svg
          viewBox="0 0 24 24"
          xmlns="http://www.w3.org/2000/svg"
          class="filter-icon"
        >
          <defs>
            <radialGradient r="1.4" cy="1" cx="1" id="myOtherGradient">
              <stop stop-color="white" offset="0%"></stop>
              <stop stop-color="#928293" offset="100%"></stop>
            </radialGradient>
          </defs>
          <path
            d="M15,19.88C15.04,20.18 14.94,20.5 14.71,20.71C14.32,21.1 13.69,21.1 13.3,20.71L9.29,16.7C9.06,16.47 8.96,16.16 9,15.87V10.75L4.21,4.62C3.87,4.19 3.95,3.56 4.38,3.22C4.57,3.08 4.78,3 5,3V3H19V3C19.22,3 19.43,3.08 19.62,3.22C20.05,3.56 20.13,4.19 19.79,4.62L15,10.75V19.88M7.04,5L11,10.06V15.58L13,17.58V10.05L16.96,5H7.04Z"
          ></path>
        </svg>
      </div>
    </button>
    <div class="results">
      <div class="result">
        <a href="#" class="link">Cat - Wikipedia</a>
        <div class="description">
          The cat (Felis catus), commonly referred to as the domestic...
        </div>
      </div>
      <div class="result">
        <a href="#" class="link">Cat Definition &amp; Meaning</a>
        <div class="description">
          The meaning of CAT is a carnivorous mammal...
        </div>
      </div>
      <div class="result">
        <a href="#" class="link">CAT | English meaning</a>
        <div class="description">
          CAT definition: 1. a small animal with fur, four legs, a tail, and...
        </div>
      </div>
      <div class="dotdotdot"></div>
    </div>
  </label>
</div>