<template><svg aria-hidden="true" :fill="color" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 32 32" width="32px" height="32px"><path fill-rule="evenodd" d="M16 5C9.925 5 5 9.925 5 16s4.925 11 11 11 11-4.925 11-11S22.075 5 16 5M3 16C3 8.82 8.82 3 16 3s13 5.82 13 13-5.82 13-13 13S3 23.18 3 16m5.439-5.114a1 1 0 0 1 1.342-.447c1.17.585 3.69 1.228 6.219 1.228s5.05-.643 6.22-1.228a1 1 0 1 1 .894 1.789c-1.197.598-3.25 1.16-5.447 1.36v2.846a55 55 0 0 1 1 2.165c.586 1.341 1.282 3.072 1.636 4.492a1 1 0 0 1-1.94.485c-.312-1.247-.95-2.85-1.53-4.175A59 59 0 0 0 16 17.58l-.086.181c-.195.41-.461.984-.748 1.639-.58 1.326-1.217 2.928-1.53 4.175a1 1 0 0 1-1.94-.485c.355-1.42 1.051-3.15 1.638-4.492a61 61 0 0 1 1-2.165v-2.845c-2.197-.201-4.251-.763-5.448-1.361a1 1 0 0 1-.447-1.342M18 8.666a2 2 0 1 1-4 0 2 2 0 0 1 4 0"/></svg></template>
<script setup lang="ts">
/**
 * A11y32 is an SVG icon wrapped in a Vue component to make it easier to use.
 */
withDefaults(
  defineProps<{
    /**
     * Define the color of the icon.
     */
    color?: string;
  }>(),
  {
    color: 'currentColor',
  },
);
</script>
