{{-- Pendientes y anotaciones de un DO (kit ui-ctc). $pendientes: OrdenesCompra::detallePendientes(). --}}
@if (count($pendientes))
    <ol class="space-y-5">
        @foreach ($pendientes as $p)
            <li class="flex gap-3">
                @if ($p['avatar'])
                    <img src="{{ $p['avatar'] }}" alt="" class="h-9 w-9 flex-none rounded-full bg-[var(--superficie-2)] object-cover">
                @else
                    <span class="flex h-9 w-9 flex-none items-center justify-center rounded-full bg-[var(--superficie-2)] text-[var(--texto-tenue)]"><x-icono nombre="user" class="h-5 w-5" /></span>
                @endif
                <div class="min-w-0 flex-1">
                    <p class="flex flex-wrap items-center gap-2 text-[13px]">
                        <span class="font-semibold capitalize text-[var(--texto)]">{{ $p['analista'] }}</span>
                        <x-etiqueta :variante="$p['resuelto'] ? 'exito' : 'peligro'" class="capitalize">{{ $p['pendiente'] }}</x-etiqueta>
                    </p>
                    <p class="mt-0.5 text-[12px] text-[var(--texto-tenue)]">Creado {{ $p['creado'] }}</p>
                    @if (count($p['comentarios']))
                        <ul class="mt-2 space-y-1.5 border-l-2 border-[var(--borde)] pl-3">
                            @foreach ($p['comentarios'] as $c)
                                <li class="text-[13px] text-[var(--texto)]">{{ $c['observacion'] }} <span class="text-[11px] italic text-[var(--texto-tenue)]">· {{ $c['creado'] }}</span></li>
                            @endforeach
                        </ul>
                    @endif
                </div>
            </li>
        @endforeach
    </ol>
@else
    <div class="flex items-start gap-3">
        <x-icono nombre="check-circle" variante="s" class="h-9 w-9 text-emerald-500" />
        <div>
            <p class="text-[14px] font-semibold text-[var(--texto)]">Sin pendientes</p>
            <p class="mt-1 text-[13px] text-[var(--texto-suave)]">A la fecha este proceso no presenta pendientes que afecten la finalización exitosa de la importación.</p>
        </div>
    </div>
@endif