@props(['label', 'value', 'subtext' => null, 'trend' => null])
<div {{ $attributes->merge(['class' => 'rounded-xl border border-slate-200 bg-white p-6 shadow-sm transition-shadow hover:shadow-md']) }}>
    <p class="text-sm font-medium text-slate-500">{{ $label }}</p>
    <p class="mt-2 text-2xl font-semibold tracking-tight text-slate-900">{{ $value }}</p>
    @if($subtext)<p class="mt-1 text-xs text-slate-500">{{ $subtext }}</p>@endif
    @if($trend)<p class="mt-1 text-xs {{ $trend === 'up' ? 'text-emerald-600' : 'text-red-600' }}">{{ $trend === 'up' ? '↑' : '↓' }} vs last period</p>@endif
</div>