import type { SVGProps } from "react";
export interface BackpackIconProps
  extends Omit<SVGProps<SVGSVGElement>, "width" | "height"> {
  className?: string;
  size?: number;
  color?: string;
}
export function BackpackIcon({
  className = "",
  size = 24,
  color = "currentColor",
  ...props
}: BackpackIconProps) {
  return (
    <svg
      xmlns="http://www.w3.org/2000/svg"
      width={size}
      height={size}
      fill="none"
      viewBox="0 0 24 24"
      className={className}
      {...props}
    >
      <path
        fill={color}
        d="m4.996 12.875.114.006a1.125 1.125 0 0 1 0 2.238l-.114.006H3.14l.273 2.471c.049.443.424.78.871.78h.71a1.125 1.125 0 0 1 0 2.25h-.71a3.126 3.126 0 0 1-3.107-2.78l-.29-2.611A2.126 2.126 0 0 1 3 12.875h1.995Zm16.003 0c1.266 0 2.252 1.1 2.112 2.36l-.288 2.61a3.127 3.127 0 0 1-3.109 2.78h-.709a1.125 1.125 0 0 1 0-2.25h.71a.877.877 0 0 0 .871-.779l.274-2.471h-1.855a1.125 1.125 0 0 1 0-2.25H21ZM8.374 14.499V13a1.125 1.125 0 0 1 2.25 0v1.5a1.125 1.125 0 0 1-2.25 0Zm5.002 0V13a1.126 1.126 0 0 1 2.25 0v1.5a1.125 1.125 0 0 1-2.25 0ZM13.877 5a1.877 1.877 0 0 0-3.754 0 1.125 1.125 0 0 1-2.25 0 4.127 4.127 0 0 1 8.254 0 1.125 1.125 0 0 1-2.25 0"
      />
      <path
        fill={color}
        d="M17.875 12.646c-.11.075-.218.153-.33.226-.472.307-.978.606-1.465.832-.457.212-1.024.42-1.58.42h-5c-.556 0-1.123-.208-1.58-.42a12 12 0 0 1-1.464-.832q-.167-.11-.331-.226V19c0 1.035.84 1.874 1.875 1.875h8c1.036 0 1.875-.84 1.875-1.875zm.5-4.646c0-1.036-.84-1.875-1.875-1.875h-9c-1.035 0-1.875.84-1.875 1.875v1.468c.461.374 1.249.992 2.058 1.519a10 10 0 0 0 1.184.675c.382.177.581.212.632.212H14.5c.05 0 .25-.035.632-.212.353-.164.76-.4 1.184-.675a26 26 0 0 0 2.058-1.52V8Zm2.25 1.54a2.1 2.1 0 0 1-.5 1.359v8.1A4.125 4.125 0 0 1 16 23.126H8A4.125 4.125 0 0 1 3.875 19v-8.101a2.1 2.1 0 0 1-.5-1.36V8A4.125 4.125 0 0 1 7.5 3.875h9A4.125 4.125 0 0 1 20.625 8z"
      />
    </svg>
  );
}
