const QuestionMarkIcon = ({ className }: { className?: string }) => {
  return (
    <svg
      width="31"
      height="30"
      viewBox="0 0 31 30"
      fill="none"
      xmlns="http://www.w3.org/2000/svg"
      className={className}
    >
      <path
        d="M9 22L9.67828 21.2652L9.39098 21H9V22ZM15.5 28L14.8217 28.7348L15.5 29.3609L16.1783 28.7348L15.5 28ZM22 22V21H21.609L21.3217 21.2652L22 22ZM2 4C2 2.89543 2.89543 2 4 2V0C1.79086 0 0 1.79086 0 4H2ZM2 19V4H0V19H2ZM4 21C2.89543 21 2 20.1046 2 19H0C0 21.2091 1.79086 23 4 23V21ZM9 21H4V23H9V21ZM16.1783 27.2652L9.67828 21.2652L8.32172 22.7348L14.8217 28.7348L16.1783 27.2652ZM21.3217 21.2652L14.8217 27.2652L16.1783 28.7348L22.6783 22.7348L21.3217 21.2652ZM27 21H22V23H27V21ZM29 19C29 20.1046 28.1046 21 27 21V23C29.2091 23 31 21.2091 31 19H29ZM29 4V19H31V4H29ZM27 2C28.1046 2 29 2.89543 29 4H31C31 1.79086 29.2091 0 27 0V2ZM4 2H27V0H4V2Z"
        fill="white"
      />
      <path
        d="M14.475 14.755V14.53C14.475 14.02 14.565 13.6 14.745 13.27C14.925 12.93 15.265 12.555 15.765 12.145C16.305 11.695 16.68 11.31 16.89 10.99C17.1 10.67 17.205 10.305 17.205 9.895C17.205 9.445 17.035 9.085 16.695 8.815C16.365 8.535 15.93 8.395 15.39 8.395C14.85 8.395 14.4 8.555 14.04 8.875C13.69 9.185 13.515 9.6 13.515 10.12C13.515 10.32 13.55 10.52 13.62 10.72L12.195 11.005C12.065 10.735 12 10.395 12 9.985C12 9.195 12.315 8.5 12.945 7.9C13.575 7.3 14.38 7 15.36 7C16.4 7 17.22 7.26 17.82 7.78C18.43 8.29 18.735 8.96 18.735 9.79C18.735 10.4 18.6 10.93 18.33 11.38C18.08 11.81 17.58 12.345 16.83 12.985C16.53 13.255 16.32 13.515 16.2 13.765C16.09 14.005 16.035 14.335 16.035 14.755H14.475ZM14.385 17.71V15.91H16.125V17.71H14.385Z"
        fill="white"
      />
    </svg>
  );
};

export { QuestionMarkIcon };