{{--
  <x-stage-badge :stage="$missile->salesStage()" size="md" />

  Props:
    - stage:  string (unsent | contacted | interested | followup | closed)
    - size:   "sm" | "md" | "lg" (default md)
    - pulse:  bool — añade pulso animado en seguimiento/interesado (default auto)
    - icon:   bool — mostrar icono (default true)

  Lee `MissileDraft::salesStageColumns()` para resolver label/icon/class.
--}}
@props([
    'stage' => 'unsent',
    'size' => 'md',
    'pulse' => null,
    'icon' => true,
])

@php
    $columns = \App\Models\MissileDraft::salesStageColumns();
    $def = $columns[$stage] ?? ['label' => ucfirst($stage), 'icon' => 'fa-circle', 'class' => 'secondary', 'hint' => ''];

    $sizeClasses = [
        'sm' => 'badge-sm fs-9 px-2 py-1',
        'md' => 'fs-8 px-3 py-2',
        'lg' => 'fs-7 px-4 py-2',
    ][$size] ?? 'fs-8 px-3 py-2';

    $shouldPulse = $pulse ?? in_array($stage, ['interested', 'followup'], true);
@endphp

<span class="badge badge-light-{{ $def['class'] }} fw-bolder {{ $sizeClasses }} d-inline-flex align-items-center gap-1"
      title="{{ $def['hint'] }}"
      style="border-radius: 6px;">
    @if($icon)
        <i class="fa-solid {{ $def['icon'] }} fs-9 {{ $shouldPulse ? 'stage-pulse' : '' }}"
           style="{{ $shouldPulse ? 'animation: pulse 1.8s ease-in-out infinite;' : '' }}"></i>
    @endif
    <span>{{ $def['label'] }}</span>
</span>

@once
    @push('styles')
        <style>
            @keyframes pulse {
                0%, 100% { opacity: 1; transform: scale(1); }
                50% { opacity: 0.65; transform: scale(1.18); }
            }
        </style>
    @endpush
@endonce