<script setup>
import { BaseIcon } from "@components/common/icons";
const props = defineProps({
  color: { type: String, default: 'text-neutrals-900' },
  active: { type: Boolean, default: false },
});
</script>

<template>
  <BaseIcon
    viewBox="0 0 19 20"
    width="19"
    :active="active"
    :className="props.color"
  >
    <template #default="{ fill }">
      <path
        d="M12.5573 3.65356C13.0493 5.73742 11.7589 7.82577 9.67496 8.31763C7.59124 8.80979 5.50311 7.5194 5.01087 5.4355C4.51886 3.35163 5.80926 1.26328 7.89316 0.771426C9.97703 0.279266 12.0654 1.56966 12.5573 3.65356Z"
        :fill="fill"
      />
      <path
        d="M15.8479 12.8405H15.8947C14.8381 10.8316 12.8933 9.40652 10.6372 9.02319C10.0663 9.2596 9.44225 9.3917 8.78606 9.3917C8.13211 9.3917 7.50579 9.26183 6.93488 9.02527C3.44769 9.61535 0.835938 12.7 0.835938 16.2532V17.557C0.835938 18.2323 1.38558 18.7841 2.06079 18.7841H12.2391C11.9452 18.2216 11.7789 17.5848 11.7789 16.9073C11.7812 14.6642 13.6047 12.8405 15.8477 12.8405L15.8479 12.8405Z"
        :fill="fill"
      />
      <path
        d="M15.8474 13.8096C14.1412 13.8096 12.75 15.1985 12.75 16.9048C12.75 18.6111 14.1389 20 15.8474 20C17.5537 20 18.9427 18.6111 18.9427 16.9048C18.9427 15.1985 17.5537 13.8096 15.8474 13.8096ZM18.4463 16.907C18.4463 17.1754 18.2291 17.3905 17.9628 17.3905H16.3311V19.0223C16.3311 19.2906 16.1138 19.5058 15.8476 19.5058C15.5792 19.5058 15.3618 19.2886 15.3618 19.0223V17.3905H13.7301C13.4617 17.3905 13.2465 17.1733 13.2465 16.907C13.2465 16.6387 13.4638 16.4235 13.7301 16.4235H15.3618V14.7918C15.3618 14.5234 15.579 14.3082 15.8476 14.3082C16.1159 14.3082 16.3311 14.5255 16.3311 14.7918V16.4235H17.9628C18.229 16.4213 18.4463 16.6385 18.4463 16.907Z"
        :fill="fill"
      />
    </template>
  </BaseIcon>
</template>

<style scoped></style>
