@props([
    'agent' => null,
    'href' => '#',
])

@php
$type = $agent?->agentType?->name ?? 'sales';
$accent = match ($type) {
    'sales' => ['bg' => 'bg-success-fill', 'text' => 'text-success-text'],
    'marketing' => ['bg' => 'bg-info-fill', 'text' => 'text-info-text'],
    'lead_gen' => ['bg' => 'bg-warning-fill', 'text' => 'text-warning-text'],
    default => ['bg' => 'bg-neutral-fill', 'text' => 'text-neutral-text'],
};
@endphp

<a href="{{ $href }}" wire:navigate {{ $attributes->merge([
    'class' => 'block bg-surface border border-border rounded-lg p-5 hover:border-border-strong transition-colors',
]) }}>
    <div class="flex items-start gap-3">
        <div class="h-9 w-9 rounded-md flex items-center justify-center text-small font-medium {{ $accent['bg'] }} {{ $accent['text'] }}">
            {{ strtoupper(substr($type, 0, 1)) }}
        </div>
        <div class="flex-1 min-w-0">
            <div class="text-base font-medium text-content truncate">{{ $agent?->name ?? 'Agent' }}</div>
            <div class="text-small text-muted truncate">{{ $agent?->agentType?->display_name ?? '' }}</div>
        </div>
        <x-badge :status="$agent?->status ?? 'draft'" />
    </div>
    <div class="mt-4 flex items-center justify-between text-micro text-faint">
        <span>${{ number_format((float) ($agent?->spend_today_usd ?? 0), 4) }} / ${{ number_format((float) ($agent?->token_budget_daily_usd ?? 0), 2) }} today</span>
        <span>{{ $agent?->runs()?->count() ?? 0 }} runs</span>
    </div>
</a>