function UserEdit({ active }) {
  return (
    <svg
      xmlns="http://www.w3.org/2000/svg"
      width="41"
      height="40"
      viewBox="0 0 41 40"
      fill="none"
      className="delay-500 w-[18px] sm:w-[25px] md:w-[33px] lg:w-[40px] h-[18px] sm:h-[25px] md:h-[33px] lg:h-[40px]"
    >
      <path
        d="M20.4998 19.9997C25.1022 19.9997 28.8332 16.2687 28.8332 11.6663C28.8332 7.06397 25.1022 3.33301 20.4998 3.33301C15.8975 3.33301 12.1665 7.06397 12.1665 11.6663C12.1665 16.2687 15.8975 19.9997 20.4998 19.9997Z"
        stroke="#616161"
        strokeWidth="1.5"
        strokeLinecap="round"
        strokeLinejoin="round"
        className={active ? "stroke-[#FAFAFA] delay-500" : ""}
      />
      <path
        d="M32.5166 26.2334L26.6165 32.1334C26.3832 32.3668 26.1666 32.8 26.1166 33.1167L25.7999 35.3667C25.6832 36.1833 26.2499 36.75 27.0666 36.6334L29.3165 36.3167C29.6332 36.2667 30.0832 36.05 30.2999 35.8167L36.1999 29.9167C37.2165 28.9001 37.6999 27.7167 36.1999 26.2167C34.7165 24.7333 33.5333 25.2167 32.5166 26.2334Z"
        stroke="#616161"
        strokeWidth="1.5"
        strokeMiterlimit="10"
        strokeLinecap="round"
        strokeLinejoin="round"
        className={active ? "stroke-[#FAFAFA] delay-500" : ""}
      />
      <path
        d="M31.6665 27.083C32.1665 28.883 33.5665 30.283 35.3665 30.783"
        stroke="#616161"
        strokeWidth="1.5"
        strokeMiterlimit="10"
        strokeLinecap="round"
        strokeLinejoin="round"
        className={active ? "stroke-[#FAFAFA] delay-500" : ""}
      />
      <path
        d="M6.18311 36.6667C6.18311 30.2167 12.5998 25 20.4998 25C22.2331 25 23.8998 25.25 25.4498 25.7167"
        stroke="#616161"
        strokeWidth="1.5"
        strokeLinecap="round"
        strokeLinejoin="round"
        className={active ? "stroke-[#FAFAFA] delay-500" : ""}
      />
    </svg>
  );
}

export default UserEdit;