export const EngineSize = ({ className }: { className: string }) => (
  <svg viewBox="0 0 14 29" fill="none" xmlns="http://www.w3.org/2000/svg" className={className}>
    <path
      d="M8.16514 20.1971C8.84557 20.4392 9.38991 20.838 9.839 21.365H10.8869V27.0623H9.81178C9.37631 27.5609 8.84557 27.9597 8.16514 28.2018C6.60016 28.8 4.87187 28.3015 3.78318 27.0623H2.72171V21.365H3.76957C4.21866 20.838 4.763 20.4392 5.44343 20.1971V14.2433H8.16514V20.1971ZM6.80429 25.638C7.16521 25.638 7.51135 25.4879 7.76656 25.2208C8.02177 24.9537 8.16514 24.5914 8.16514 24.2137C8.16514 23.8359 8.02177 23.4736 7.76656 23.2065C7.51135 22.9394 7.16521 22.7893 6.80429 22.7893C6.44336 22.7893 6.09722 22.9394 5.84201 23.2065C5.5868 23.4736 5.44343 23.8359 5.44343 24.2137C5.44343 24.5914 5.5868 24.9537 5.84201 25.2208C6.09722 25.4879 6.44336 25.638 6.80429 25.638ZM13.6086 2.84867H10.8869V4.273H13.6086V12.819H0V4.273H2.72171V2.84867H0V0H13.6086V2.84867ZM6.80429 9.97034C7.16521 9.97034 7.51135 9.82027 7.76656 9.55316C8.02177 9.28605 8.16514 8.92376 8.16514 8.546C8.16514 8.16825 8.02177 7.80596 7.76656 7.53885C7.51135 7.27173 7.16521 7.12167 6.80429 7.12167C6.44336 7.12167 6.09722 7.27173 5.84201 7.53885C5.5868 7.80596 5.44343 8.16825 5.44343 8.546C5.44343 8.92376 5.5868 9.28605 5.84201 9.55316C6.09722 9.82027 6.44336 9.97034 6.80429 9.97034Z"
      fill="currentColor"
    />
  </svg>
);

export const PowerCV = ({ className }: { className: string }) => (
  <svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 25 22" className={className}>
    <path
      fill="currentColor"
      d="M11.598 0a1.288 1.288 0 0 1 .151 2.568l-.15.01h-1.29v1.288h3.563c.32 0 .636.06.934.175l.219.097 4.169 2.085a2.58 2.58 0 0 1 1.417 2.098l.008.208v3.07h1.289v-1.29a1.289 1.289 0 0 1 2.568-.15l.01.15v5.155a1.288 1.288 0 0 1-2.57.151l-.008-.15v-1.29h-1.289v1.934a2.58 2.58 0 0 1-.86 1.922l-.17.14-4.296 3.221c-.382.286-.835.46-1.31.504l-.237.012H2.577a2.577 2.577 0 0 1-2.57-2.384L0 19.33V6.443a2.577 2.577 0 0 1 2.384-2.57l.193-.007h5.155V2.577H6.443A1.289 1.289 0 0 1 6.293.01l.15-.01zm2.273 6.443H2.577V19.33h11.17l4.295-3.221v-7.58zm-5.31 2.56a1.289 1.289 0 0 1 2.28 1.192l-.071.134-.76 1.27h1.565a1.3 1.3 0 0 1 1.186 1.838l-.07.133-1.92 3.202A1.288 1.288 0 0 1 8.49 15.58l.07-.134.761-1.27H7.757a1.303 1.303 0 0 1-1.186-1.838l.07-.133z"
    />
  </svg>
);

export const TireTorque = ({ className }: { className: string }) => (
  <svg
    xmlns="http://www.w3.org/2000/svg"
    viewBox="0 0 24 24"
    fill="none"
    stroke="currentColor"
    strokeWidth="2"
    strokeLinecap="round"
    strokeLinejoin="round"
    className={className}
  >
    <circle cx="12" cy="12" r="2.5" />
    <path d="M12 4a8 8 0 1 0 8 8" />
    <path d="M20 8l-1.5 4L15 10.5" />
  </svg>
);

export const Transmission = ({ className }: { className: string }) => (
  <svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 22 25" className={className}>
    <path
      stroke="#2c2926"
      strokeLinecap="round"
      strokeLinejoin="round"
      strokeWidth="1.237"
      d="M5.773 16.083V8.35m10.31 3.866H5.772m5.155 3.866V8.35m5.154 7.732V8.35M1.907 23.815H19.95a1.29 1.29 0 0 0 1.289-1.289V1.906a1.29 1.29 0 0 0-1.29-1.288H1.909a1.29 1.29 0 0 0-1.29 1.289v20.62c0 .71.577 1.288 1.29 1.288"
    />
  </svg>
);

export const Color = ({ className }: { className: string }) => (
  <svg
    aria-hidden="true"
    xmlns="http://www.w3.org/2000/svg"
    fill="none"
    viewBox="0 0 24 24"
    className={className}
  >
    <path
      stroke="currentColor"
      strokeLinecap="round"
      strokeLinejoin="round"
      strokeWidth="2"
      d="M12 7h.01m3.486 1.513h.01m-6.978 0h.01M6.99 12H7m9 4h2.706a1.957 1.957 0 0 0 1.883-1.325A9 9 0 1 0 3.043 12.89 9.1 9.1 0 0 0 8.2 20.1a8.62 8.62 0 0 0 3.769.9 2.013 2.013 0 0 0 2.03-2v-.857A2.036 2.036 0 0 1 16 16Z"
    />
  </svg>
);

export const Wheels = ({ className }: { className: string }) => (
  <svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 64 64" className={className}>
    <circle cx="32" cy="32" r="22" stroke="currentColor" strokeWidth="3" />
    <circle cx="32" cy="32" r="14" stroke="currentColor" strokeWidth="2.5" opacity=".4" />
    <circle cx="32" cy="32" r="6" stroke="currentColor" strokeWidth="2.5" />
    <path
      stroke="currentColor"
      strokeLinecap="round"
      strokeWidth="2.5"
      d="M32 10v8m0 28v8M10 32h8m28 0h8M16.6 16.6l5.3 5.3m25.5 25.5-5.3-5.3m-25.5 5.3 5.3-5.3m25.5-25.5-5.3 5.3"
    />
  </svg>
);
