{{-- Paid / Partial / Unpaid pill with a small progress bar. Works for orders and vendor bills. --}}
@props(['total', 'paid', 'cancelled' => false, 'bar' => true])
@php
    $total = (float) $total; $paid = (float) $paid;
    $pct = $total > 0 ? min(100, round($paid / $total * 100)) : 0;
    [$state, $label, $color] = match (true) {
        $cancelled => ['na', 'Cancelled', 'secondary'],
        $total <= 0.004 => ['na', '—', 'secondary'],
        $paid >= $total - 0.004 => ['paid', 'Paid', 'success'],
        $paid > 0.004 => ['partial', 'Partial', 'warning'],
        default => ['unpaid', 'Unpaid', 'danger'],
    };
@endphp
<div class="d-inline-flex flex-column gap-1" style="min-width:84px">
    <span class="badge-soft badge-soft-{{ $color }} align-self-start no-dot">{{ $label }}@if ($state === 'partial') · {{ $pct }}%@endif</span>
    @if ($bar && $state !== 'na')
        <div class="mini-progress is-{{ $state }}" role="progressbar" aria-valuenow="{{ $pct }}" aria-valuemin="0" aria-valuemax="100" aria-label="{{ $pct }}% paid"><span style="width: {{ $pct }}%"></span></div>
    @endif
</div>