@props(['estado'])

@switch($estado)

    @case(1)
        <span class="inline-flex items-center px-2 py-1 text-xs font-medium rounded
                     bg-yellow-100 text-yellow-800">
            Esperando aprobación
        </span>
        @break

    @case(2)
        <span class="inline-flex items-center px-2 py-1 text-xs font-medium rounded
                     bg-green-100 text-green-800">
            Pedido aprobado
        </span>
        @break

    @case(3)
        <span class="inline-flex items-center px-2 py-1 text-xs font-medium rounded
                     bg-blue-100 text-blue-800">
            Asignado a despacho
        </span>
        @break

    @case(4)
        <span class="inline-flex items-center px-2 py-1 text-xs font-medium rounded
                     bg-red-100 text-red-800">
            Despacho parcial
        </span>
        @break

    @case(5)
        <span class="inline-flex items-center px-2 py-1 text-xs font-medium rounded
                     bg-red-200 text-red-900">
            Cancelado por el coordinador
        </span>
        @break

    @case(6)
        <span class="inline-flex items-center px-2 py-1 text-xs font-medium rounded
                     bg-yellow-200 text-yellow-900">
            Despacho completo
        </span>
        @break

    @case(7)
        <span class="inline-flex items-center px-2 py-1 text-xs font-medium rounded
                     bg-indigo-100 text-indigo-800">
            Facturado
        </span>
        @break

    @case(8)
        <span class="inline-flex items-center px-2 py-1 text-xs font-medium rounded
                     bg-red-300 text-red-900">
            Despacho parcial finalizado
        </span>
        @break

    @case(9)
        <span class="inline-flex items-center px-2 py-1 text-xs font-medium rounded
                     bg-gray-200 text-gray-800">
            Anulado
        </span>
        @break

    @default
        <span class="inline-flex items-center px-2 py-1 text-xs font-medium rounded
                     bg-gray-100 text-gray-600">
            Estado desconocido
        </span>
@endswitch