<template><svg aria-hidden="true" :fill="color" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" width="24px" height="24px"><path d="M12 2c.286 0 .633.089.906.167.315.09.693.215 1.1.358.816.288 1.8.67 2.74 1.046a176 176 0 0 1 3.343 1.38q.146.061.225.096l.06.025.015.006.004.002.001.001a1 1 0 0 1 .607.919v5c0 3.373-1.824 6.116-3.743 7.97a14.9 14.9 0 0 1-2.878 2.18 9 9 0 0 1-1.252.602c-.359.135-.759.248-1.127.248-.369 0-.769-.113-1.127-.248a9 9 0 0 1-1.252-.603 14.9 14.9 0 0 1-2.878-2.18C4.824 17.117 3 14.374 3 11V6a1 1 0 0 1 .606-.919h.001l.004-.003.016-.006.06-.025.225-.097a187 187 0 0 1 3.342-1.379 75 75 0 0 1 2.74-1.046 21 21 0 0 1 1.1-.358C11.367 2.089 11.715 2 12 2m-.5 2.135a20 20 0 0 0-.838.277c-.778.275-1.732.644-2.665 1.017A174 174 0 0 0 5 6.662V11c0 2.627 1.426 4.884 3.132 6.53a12.9 12.9 0 0 0 2.481 1.883c.338.193.638.337.886.436V4.135Zm1 15.714c.247-.1.55-.243.887-.436a13 13 0 0 0 2.482-1.883C17.574 15.884 19 13.627 19 11V6.662a189 189 0 0 0-2.996-1.233 73 73 0 0 0-2.665-1.017 20 20 0 0 0-.84-.277z"/></svg></template>
<script setup lang="ts">
/**
 * Cybersecurity24 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>
