<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="M2.5 3.417a.75.75 0 0 0-.75.75v11.667c0 .414.336.75.75.75h15a.75.75 0 0 0 .75-.75V4.167a.75.75 0 0 0-.75-.75zm.75 11.667V4.917h13.5v10.167zm4.385-8.17 2.262 2.26a.145.145 0 0 0 .206 0l2.262-2.26a.145.145 0 0 0-.103-.247H7.738a.145.145 0 0 0-.103.247m-1.383 6.253.803-5.346A.145.145 0 0 1 7.3 7.74l2.596 2.593a.145.145 0 0 0 .206 0l2.596-2.593a.145.145 0 0 1 .246.08l.803 5.347a.145.145 0 0 1-.143.167h-1.738a.145.145 0 0 1-.143-.125l-.232-1.617a.145.145 0 0 0-.246-.082l-1.143 1.142a.145.145 0 0 1-.206 0L8.754 11.51a.145.145 0 0 0-.246.082l-.232 1.617a.145.145 0 0 1-.143.125H6.395a.145.145 0 0 1-.143-.167"/></svg></template>
<script setup lang="ts">
/**
 * LoyaltyBm20 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>
