import { FC } from 'react';

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

const IconSparkles: FC<IconSparklesProps> = ({ className, fill = false, duotone = true }) => {
    return (
        <>
            <svg
                xmlns="http://www.w3.org/2000/svg"
                width="24"
                height="24"
                viewBox="0 0 24 24"
                className={className}
            >
                <g fill="none">
                    {/* Main sparkle */}
                    <path
                        d="M12 3L13.5 8.5L19 10L13.5 11.5L12 17L10.5 11.5L5 10L10.5 8.5L12 3Z"
                        fill={fill ? 'currentColor' : 'none'}
                        stroke="currentColor"
                        strokeWidth="1.5"
                        opacity={duotone ? '1' : '1'}
                    />

                    {/* Small sparkle top-right */}
                    <path
                        d="M18 3L18.5 5L20.5 5.5L18.5 6L18 8L17.5 6L15.5 5.5L17.5 5L18 3Z"
                        fill={fill ? 'currentColor' : 'none'}
                        stroke="currentColor"
                        strokeWidth="1.5"
                        opacity={duotone ? '0.5' : '1'}
                    />

                    {/* Small sparkle bottom-left */}
                    <path
                        d="M6 14L6.5 16L8.5 16.5L6.5 17L6 19L5.5 17L3.5 16.5L5.5 16L6 14Z"
                        fill={fill ? 'currentColor' : 'none'}
                        stroke="currentColor"
                        strokeWidth="1.5"
                        opacity={duotone ? '0.5' : '1'}
                    />
                </g>
            </svg>
        </>
    );
};

export default IconSparkles;