import { iconVariants } from "./variants"

import type { IconProps } from "@/types/components/icon"

export default function CameraIcon({ className, color, ...props }: IconProps) {
  const classNames = iconVariants({ className, color })
  return (
    <svg
      className={classNames}
      xmlns="http://www.w3.org/2000/svg"
      width="24"
      height="24"
      viewBox="0 0 24 24"
      fill="none"
      {...props}
    >
      <path
        d="M12 17.375C13.225 17.375 14.2625 16.95 15.1125 16.1C15.9625 15.25 16.3875 14.2125 16.3875 12.9875C16.3875 11.7625 15.9625 10.725 15.1125 9.875C14.2625 9.025 13.225 8.6 12 8.6C10.775 8.6 9.7375 9.025 8.8875 9.875C8.0375 10.725 7.6125 11.7625 7.6125 12.9875C7.6125 14.2125 8.0375 15.25 8.8875 16.1C9.7375 16.95 10.775 17.375 12 17.375ZM11.9949 15.5C11.29 15.5 10.6958 15.2583 10.2125 14.775C9.72917 14.2917 9.4875 13.6975 9.4875 12.9926C9.4875 12.2877 9.72917 11.6918 10.2125 11.2051C10.6958 10.7184 11.29 10.475 11.9949 10.475C12.6998 10.475 13.2957 10.7184 13.7824 11.2051C14.2691 11.6918 14.5125 12.2877 14.5125 12.9926C14.5125 13.6975 14.2691 14.2917 13.7824 14.775C13.2957 15.2583 12.6998 15.5 11.9949 15.5ZM4.125 20.75C3.60937 20.75 3.16796 20.5664 2.80077 20.1992C2.43359 19.832 2.25 19.3906 2.25 18.875V7.1125C2.25 6.59687 2.43359 6.15546 2.80077 5.78828C3.16796 5.42109 3.60937 5.2375 4.125 5.2375H7.275L8.5125 3.875C8.68652 3.6827 8.89613 3.53046 9.14133 3.41828C9.38651 3.30609 9.64357 3.25 9.9125 3.25H14.0875C14.3564 3.25 14.6135 3.30609 14.8587 3.41828C15.1039 3.53046 15.3135 3.6827 15.4875 3.875L16.725 5.2375H19.875C20.3906 5.2375 20.832 5.42109 21.1992 5.78828C21.5664 6.15546 21.75 6.59687 21.75 7.1125V18.875C21.75 19.3906 21.5664 19.832 21.1992 20.1992C20.832 20.5664 20.3906 20.75 19.875 20.75H4.125ZM4.125 18.875H19.875V7.1125H15.8853L14.0875 5.125H9.9162L8.125 7.1125H4.125V18.875Z"
        fill="#26201E"
      />
    </svg>
  )
}
