<template><svg aria-hidden="true" :fill="color" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" width="24px" height="24px"><path fill-rule="evenodd" d="M6.5 7.5a3.5 3.5 0 1 1 7 0 3.5 3.5 0 0 1-7 0M10 2a5.5 5.5 0 1 0 0 11 5.5 5.5 0 0 0 0-11M6.5 14.064a1 1 0 0 0-.836-.076l-3 1.07A1 1 0 0 0 2 16v4a1 1 0 0 0 .77.973L3 20l-.23.973h.002l.003.001.01.003.038.009a32 32 0 0 0 .674.148c.449.096 1.076.223 1.792.35C6.704 21.737 8.527 22 10 22s3.296-.264 4.71-.515q.31-.056.594-.11l.645.646a1 1 0 0 0 1.415 0l4.066-4.066a3.25 3.25 0 0 0-4.597-4.596l-.176.176-.177-.176a3.25 3.25 0 0 0-5.466 1.568Q10.517 15 10 15c-1.277 0-2.47-.34-3.5-.936m4.687 2.858A9 9 0 0 1 10 17a9 9 0 0 1-4.085-.978L4 16.705v2.492c.425.09.995.204 1.64.318C7.034 19.764 8.712 20 10 20c1.054 0 2.37-.158 3.577-.352l-1.693-1.693a3.2 3.2 0 0 1-.697-1.033m2.11-2.15a1.25 1.25 0 0 1 1.769 0l.883.885.708.707.707-.707.884-.884a1.25 1.25 0 1 1 1.767 1.768l-3.358 3.358-3.36-3.358a1.25 1.25 0 0 1 0-1.768"/></svg></template>
<script setup lang="ts">
/**
 * ProfilePassion24 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>
