<template><svg aria-hidden="true" :fill="color" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 32 32" width="32px" height="32px"><path d="M16 3c3.405 0 6.534.535 8.848 1.435 1.153.448 2.155 1.008 2.885 1.68C28.465 6.786 29 7.647 29 8.666v14.667c0 1.018-.535 1.88-1.267 2.553-.73.671-1.732 1.23-2.885 1.678C22.534 28.465 19.405 29 16 29s-6.534-.535-8.848-1.435c-1.153-.448-2.155-1.007-2.885-1.678C3.535 25.214 3 24.352 3 23.334V8.667c0-1.019.535-1.88 1.267-2.553.73-.671 1.732-1.23 2.885-1.68C9.466 3.535 12.595 3 16 3m11 17.844c-.625.477-1.418.899-2.333 1.255C22.424 22.97 19.36 23.5 16 23.5c-2.81 0-5.411-.372-7.5-1.003v.836a.5.5 0 1 1-1 0V22.16l-.167-.061c-.915-.356-1.708-.778-2.333-1.255v2.49c0 .27.137.636.62 1.08.484.445 1.24.891 2.257 1.287C9.907 26.491 12.778 27 16 27s6.094-.51 8.123-1.299c1.017-.396 1.773-.842 2.257-1.287.483-.444.62-.81.62-1.08zm0-4.666c-.625.477-1.418.899-2.333 1.255-2.243.872-5.308 1.401-8.667 1.401-2.809 0-5.411-.372-7.5-1.003V19l-.01.1a.5.5 0 0 1-.98 0L7.5 19v-1.506l-.167-.061c-.915-.356-1.708-.778-2.333-1.255v3.31q.123.147.281.293c.546.502 1.364.977 2.415 1.386 2.1.817 5.036 1.333 8.304 1.333s6.203-.516 8.304-1.333c1.052-.409 1.87-.884 2.415-1.386a3 3 0 0 0 .281-.293zm0-4.384c-.617.422-1.347.791-2.152 1.104-2.314.9-5.443 1.435-8.848 1.435-2.783 0-5.38-.358-7.5-.98v1.314a.5.5 0 0 1-1 0v-1.64q-.177-.063-.348-.129c-.805-.313-1.535-.682-2.152-1.104v3.028q.123.146.281.293c.546.502 1.364.977 2.415 1.386 2.1.817 5.036 1.333 8.304 1.333s6.203-.516 8.304-1.333c1.051-.409 1.87-.884 2.415-1.386a3 3 0 0 0 .281-.293zM16 5c-3.222 0-6.094.51-8.123 1.299-1.018.396-1.773.842-2.257 1.287-.483.444-.62.811-.62 1.081s.137.636.62 1.08c.484.445 1.24.891 2.257 1.287 2.03.79 4.901 1.299 8.123 1.299s6.094-.51 8.123-1.299c1.018-.396 1.773-.842 2.257-1.287.483-.444.62-.81.62-1.08s-.137-.637-.62-1.081c-.484-.445-1.24-.891-2.257-1.287C22.093 5.509 19.222 5 16 5"/></svg></template>
<script setup lang="ts">
/**
 * Database32 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>
