import React from 'react'
import { useTheme } from '../../themeContext'

export const SadMouth = () => {
  const { colors } = useTheme()

  return (
    <>
      <path
        d="M538.71,665.74c-15.55,0-25.12-12.76-36.48-12.76S476.31,665.74,461,665.74s-23.73-11.11-23.73-26.51c0-16.65,16.75-46.06,62.61-46.06s65.39,27.74,65.39,45.46C565.23,655,554.27,665.74,538.71,665.74Z"
        fill={colors.outline}
        stroke={colors.outline}
        strokeMiterlimit={10}
        strokeWidth="12px"
      />
      <path
        d="M511.14,655.25C506.58,643,491,635,473.29,636.57c-14.79,1.34-26.93,9.09-31.84,19.1,3.92,6.26,10.51,10.07,19.51,10.07,15.35,0,29.9-12.76,41.27-12.76A21.5,21.5,0,0,1,511.14,655.25Z"
        fill={colors.tongue}
      />
      <path
        d="M455.06,628.66l.87-.35.73-.25c.47-.16.94-.28,1.41-.4a21.33,21.33,0,0,1,2.85-.53,24.24,24.24,0,0,1,5.84-.07,21.24,21.24,0,0,1,11.15,4.48,20.07,20.07,0,0,1,6.55,9.27,17.31,17.31,0,0,1,.2,10.44c-2.5-2.58-4.46-4.94-6.43-6.88a27.89,27.89,0,0,0-2.88-2.58,13.78,13.78,0,0,0-3-1.72,15.18,15.18,0,0,0-6.35-1.15,29.08,29.08,0,0,0-3.43.3c-.57.1-1.16.19-1.72.31l-.84.19-.39.08c-.09,0-.29.08-.22,0Z"
        fill={colors.outline}
      />
    </>
  )
}
