<template><svg aria-hidden="true" :fill="color" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 48 48" width="48px" height="48px"><path fill-rule="evenodd" d="M6 8.5A1.5 1.5 0 0 0 4.5 10v24A1.5 1.5 0 0 0 6 35.5h20.5V38a1.5 1.5 0 0 0 1.5 1.5h14a1.5 1.5 0 0 0 1.5-1.5V24a1.5 1.5 0 0 0-1.5-1.5h-.5V20c0-1.84-.62-3.491-1.814-4.686a6 6 0 0 0-2.186-1.387V10A1.5 1.5 0 0 0 36 8.5zm32.5 14V20c0-1.16-.38-2.009-.936-2.564S36.16 16.5 35 16.5s-2.009.38-2.564.936C31.88 17.99 31.5 18.84 31.5 20v2.5zm-10 0V20c0-.699.09-1.37.266-2H7.5v14.5h19V30H21a1 1 0 1 1 0-2h5.5v-4a1.5 1.5 0 0 1 1.5-1.5zm1 11.5v2.5h11v-11h-11zm.227-18H7.5v-4.5h27v2.015c-1.639.103-3.1.714-4.186 1.8q-.321.322-.587.685M10 29a1 1 0 0 1 1-1h6a1 1 0 1 1 0 2h-6a1 1 0 0 1-1-1m26 2.118a1.5 1.5 0 1 0-2 0V33a1 1 0 1 0 2 0zM10 22a1 1 0 0 1 1-1h6a1 1 0 0 1 1 1v2a1 1 0 0 1-1 1h-6a1 1 0 0 1-1-1z"/></svg></template>
<script setup lang="ts">
/**
 * SecurePayment48 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>
