import { iconVariants } from "./variants"

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

export default function CloseIcon({ className, color, ...props }: IconProps) {
  const classNames = iconVariants({ className, color })
  return (
    <svg
      className={classNames}
      fill="none"
      height="20"
      viewBox="0 0 20 20"
      width="20"
      xmlns="http://www.w3.org/2000/svg"
      {...props}
    >
      <path
        d="M10 11.0936L7.58333 13.5207C7.43056 13.6734 7.24653 13.7498 7.03125 13.7498C6.81597 13.7498 6.63194 13.6734 6.47917 13.5207C6.32639 13.3679 6.25 13.1839 6.25 12.9686C6.25 12.7533 6.32639 12.5693 6.47917 12.4165L8.90625 9.99984L6.47917 7.59359C6.32639 7.44081 6.25 7.25678 6.25 7.0415C6.25 6.82623 6.32639 6.6422 6.47917 6.48942C6.63194 6.33664 6.81597 6.26025 7.03125 6.26025C7.24653 6.26025 7.43056 6.33664 7.58333 6.48942L10 8.9165L12.4062 6.48942C12.559 6.33664 12.7431 6.26025 12.9583 6.26025C13.1736 6.26025 13.3576 6.33664 13.5104 6.48942C13.6701 6.64914 13.75 6.83491 13.75 7.04671C13.75 7.25852 13.6701 7.44081 13.5104 7.59359L11.0833 9.99984L13.5104 12.4165C13.6632 12.5693 13.7396 12.7533 13.7396 12.9686C13.7396 13.1839 13.6632 13.3679 13.5104 13.5207C13.3507 13.6804 13.1649 13.7603 12.9531 13.7603C12.7413 13.7603 12.559 13.6804 12.4062 13.5207L10 11.0936Z"
        fill="#CD0921"
      />
    </svg>
  )
}
