import { FC } from "react";

interface IconOverdueProps {
    className?: string;
    fill?: boolean;
    duotone?: boolean;
}

const IconOverdue: FC<IconOverdueProps> = ({
    className,
    fill = false,
    duotone = true,
}) => {
    return (
        <>
            {!fill ? (
                // Outline version
                <svg
                    width="20"
                    height="20"
                    viewBox="0 0 24 24"
                    fill="none"
                    xmlns="http://www.w3.org/2000/svg"
                    className={className}
                >
                    <path
                        d="M12 9v4"
                        stroke="currentColor"
                        strokeWidth="1.5"
                        strokeLinecap="round"
                    />
                    <path
                        d="M12 17h.01"
                        stroke="currentColor"
                        strokeWidth="2"
                        strokeLinecap="round"
                    />
                    <path
                        d="M10.29 3.86l-8.4 14.49A2 2 0 003.6 21h16.8a2 2 0 001.71-2.65l-8.4-14.49a2 2 0 00-3.42 0z"
                        stroke="currentColor"
                        strokeWidth="1.5"
                        strokeLinejoin="round"
                    />
                </svg>
            ) : duotone ? (
                // Duotone version
                <svg
                    width="24"
                    height="24"
                    viewBox="0 0 24 24"
                    fill="none"
                    xmlns="http://www.w3.org/2000/svg"
                    className={className}
                >
                    <path
                        d="M12 2a2 2 0 00-1.71 1.01l-8.4 14.49A2 2 0 003.6 21h16.8a2 2 0 001.71-2.65l-8.4-14.49A2 2 0 0012 2z"
                        fill="currentColor"
                        opacity="0.2"
                    />
                    <path
                        d="M12 9v4"
                        stroke="currentColor"
                        strokeWidth="1.5"
                        strokeLinecap="round"
                    />
                    <path
                        d="M12 17h.01"
                        stroke="currentColor"
                        strokeWidth="2"
                        strokeLinecap="round"
                    />
                </svg>
            ) : (
                // Solid version
                <svg
                    width="24"
                    height="24"
                    viewBox="0 0 24 24"
                    fill="currentColor"
                    xmlns="http://www.w3.org/2000/svg"
                    className={className}
                >
                    <path d="M12 2a2 2 0 00-1.71 1.01l-8.4 14.49A2 2 0 003.6 21h16.8a2 2 0 001.71-2.65l-8.4-14.49A2 2 0 0012 2zm0 6a1 1 0 011 1v4a1 1 0 11-2 0V9a1 1 0 011-1zm0 10a1.25 1.25 0 110-2.5A1.25 1.25 0 0112 18z" />
                </svg>
            )}
        </>
    );
};

export default IconOverdue;