import { FC } from 'react'

import { SvgIcon, SvgIconProps } from '@mui/material'

const FavoriteIcon: FC<SvgIconProps> = ({ sx, ...props }) => (
  <SvgIcon sx={{ fontSize: 18, color: 'action.active', ...sx }} {...props}>
    <svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
      <path
        d="M12.0002 20.7998C10.0002 20.7998 2.2002 16.0998 2.2002 9.7998C2.2002 6.6998 4.6002 3.2998 8.3002 3.2998C10.0002 3.2998 11.2002 3.9998 12.0002 4.6998C12.8002 3.9998 14.0002 3.2998 15.7002 3.2998C19.3002 3.2998 21.8002 6.6998 21.8002 9.7998C21.8002 16.0998 14.0002 20.7998 12.0002 20.7998ZM8.3002 4.7998C5.6002 4.7998 3.7002 7.3998 3.7002 9.7998C3.7002 15.1998 10.6002 19.2998 11.9002 19.2998C13.2002 19.2998 20.1002 15.1998 20.1002 9.7998C20.1002 7.3998 18.3002 4.7998 15.5002 4.7998C13.9002 4.7998 12.9002 5.5998 12.4002 6.1998C12.1002 6.4998 11.5002 6.4998 11.3002 6.1998C10.9002 5.4998 9.9002 4.7998 8.3002 4.7998Z"
        fill="currentColor"
      />
    </svg>
  </SvgIcon>
)

export default FavoriteIcon
