@php
    /** @var ?\App\Models\OrderDetail $detail */
    /** @var \Illuminate\Support\Collection<int, \App\Models\OrderDetailPriceLog> $logs */

    $detail = $detail ?? null;
    $logs = $logs ?? collect();

    $sku = trim((string) ($detail?->product_reference ?? ''));
    $productName = trim((string) ($detail?->product_name ?? ''));
@endphp

<div class="space-y-3">
    @if ($detail)
        <div class="text-sm text-gray-600">
            Orden: <span class="font-medium">{{ $detail->order_reference }}</span>
        </div>

        @if ($sku !== '' || $productName !== '')
            <div class="rounded-lg border border-gray-200 bg-gray-50 p-3">
                @if ($sku !== '')
                    <div class="text-sm text-gray-700">
                        <span class="font-medium">SKU:</span> {{ $sku }}
                    </div>
                @endif

                @if ($productName !== '')
                    <div class="text-sm text-gray-700">
                        <span class="font-medium">Producto:</span> {{ $productName }}
                    </div>
                @endif
            </div>
        @endif
    @else
        <div class="text-sm text-gray-600">
            No se pudo identificar el detalle para mostrar historial.
        </div>
    @endif

    <div class="overflow-x-auto rounded-lg border border-gray-200 bg-white">
        <table class="min-w-full text-sm">
            <thead class="bg-gray-50">
                <tr class="text-left text-gray-600">
                    <th class="px-3 py-2 font-medium whitespace-nowrap">Fecha</th>
                    <th class="px-3 py-2 font-medium whitespace-nowrap">Usuario</th>
                    <th class="px-3 py-2 font-medium whitespace-nowrap">Precio anterior</th>
                    <th class="px-3 py-2 font-medium whitespace-nowrap">Precio nuevo</th>
                </tr>
            </thead>
            <tbody class="divide-y divide-gray-200">
                @forelse ($logs as $log)
                    <tr class="align-top">
                        <td class="px-3 py-2 whitespace-nowrap">{{ optional($log->happened_at)->format('d/m/Y H:i') ?? '-' }}</td>
                        <td class="px-3 py-2 whitespace-nowrap">{{ $log->user_name ?? $log->user?->name ?? 'Sistema' }}</td>
                        <td class="px-3 py-2 whitespace-nowrap">{{ $log->price_old !== null ? number_format((float) $log->price_old, 2) : '-' }}</td>
                        <td class="px-3 py-2 whitespace-nowrap">{{ $log->price_new !== null ? number_format((float) $log->price_new, 2) : '-' }}</td>
                    </tr>
                @empty
                    <tr>
                        <td class="px-3 py-4 text-gray-600" colspan="4">Sin historial.</td>
                    </tr>
                @endforelse
            </tbody>
        </table>
    </div>
</div>