<template>
  <div class="hms-card p-6">
    <div class="hms-icon-circle mb-4"><span aria-hidden="true">{{ icon }}</span></div>
    <h3 class="text-lg font-semibold mb-2" style="color: var(--text)">{{ title }}</h3>
    <p class="text-sm leading-relaxed" style="color: var(--text-muted)">{{ description }}</p>
  </div>
</template>

<script setup lang="ts">
defineProps<{ icon: string; title: string; description: string }>()
</script>
