<template>
  <!-- Canonical card/dialog heading: an optional leading icon + the title, with
       a default slot for trailing content (a v-spacer + actions, or an inline
       status chip). The icon+title v-card-title row was hand-rolled identically
       in 14 cards/dialogs (DRY pattern sweep 2026-06-09). Plain text-only
       v-card-titles are NOT this pattern and keep using <v-card-title> directly. -->
  <v-card-title class="d-flex align-center fc-card-heading">
    <v-icon v-if="icon" :icon="icon" :color="iconColor || undefined" size="small" />
    <span>{{ title }}</span>
    <slot />
  </v-card-title>
</template>

<script setup>
defineProps({
  icon: { type: String, default: '' },
  title: { type: String, default: '' },
  // e.g. 'error' for danger/error headings; '' keeps the default text color.
  iconColor: { type: String, default: '' },
})
</script>

<style scoped>
.fc-card-heading { gap: 10px; }
</style>
