<template><svg aria-hidden="true" :fill="color" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 20 20" width="20px" height="20px"><path fill-rule="evenodd" d="M7.363 2.222a.75.75 0 0 0-.843-.457l-4.167.833a.75.75 0 0 0-.603.735c0 3.597 2.007 7.318 4.803 10.114s6.517 4.803 10.114 4.803a.75.75 0 0 0 .735-.603l.833-4.166a.75.75 0 0 0-.457-.844l-4.166-1.667a.75.75 0 0 0-.809.166l-.98.981a17.7 17.7 0 0 1-3.94-3.94l.98-.98a.75.75 0 0 0 .167-.809zM6.81 9.25 5.8 10.26a17.6 17.6 0 0 0 1.814 2.125c.666.667 1.38 1.276 2.125 1.815l1.01-1.01a19.3 19.3 0 0 1-3.94-3.94m9.246 7.477c-1.667-.122-3.398-.73-5.034-1.689l2.492-2.492 3.128 1.251zM7.453 6.486 4.961 8.978c-.96-1.636-1.567-3.367-1.689-5.034l2.93-.586z"/></svg></template>
<script setup lang="ts">
/**
 * Phone20 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>
