@extends('layouts.motoboy_dashboard')

@section('content')
<div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8 py-6 sm:py-8">

    <div class="bg-white shadow-md p-5 mb-6 flex flex-col md:flex-row justify-between items-start md:items-center">
        <h1 class="text-2xl sm:text-3xl font-extrabold text-green-700 flex items-center gap-2 mb-3 md:mb-0">
            <i class="ri-check-double-line text-green-500 text-3xl sm:text-4xl"></i> {{ $title }}
        </h1>
        <div class="flex flex-wrap items-center gap-x-4 gap-y-2 text-sm sm:text-base text-gray-700">
            <div class="flex items-center gap-1">
                <span class="font-semibold text-gray-600">Usuário:</span>
                <span class="text-gray-800">{{ auth()->user()->name }}</span>
            </div>
            <div class="flex items-center gap-1">
                <span class="font-semibold text-gray-600">Perfil:</span>
                <span class="px-2 py-0.5 bg-green-100 text-green-800 rounded-full text-xs font-medium uppercase">
                    {{ optional(auth()->user()->roles()->first())->name ?? 'Sem perfil' }}
                </span>
            </div>
        </div>
    </div>

    <div class="bg-white shadow-md p-5 mb-6">
        <div class="flex items-center justify-between mb-4">
            <div>
                <h2 class="text-xl font-bold text-gray-700 flex items-center gap-2 mb-5">
                    <i class="ri-history-line text-green-500"></i> Histórico de Entregas Concluídas
                </h2>
            </div>
        </div>

        <div class="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 gap-6">
            @forelse($entregas as $entrega)
                <div class="bg-gray-50 shadow-sm border border-green-300 p-5 flex flex-col justify-between">
                    <div>
                        <div class="flex flex-col items-center justify-between mb-3">
                            <div class="text-center text-xl underline text-gray-500 mb-2">Cod. Troca:</div>
                            <h3 class="text-lg font-bold text-gray-800 flex items-center gap-2 mb-2">
                                {{ optional($entrega->pedidoTroca)->codigo_troca ?? 'N/A' }}
                            </h3>
                            <span class="px-3 py-1 w-full text-center rounded-full text-md font-semibold bg-green-100 text-green-800">
                                Concluída
                            </span>
                        </div>

                        <div class="space-y-2 text-sm text-gray-700">
                            <p class="flex items-center gap-2">
                                <i class="ri-capsule-line text-gray-500"></i>
                                <span class="font-medium">Medicamento:</span>
                                <a href="{{ route('restrito.user.medicamentos.show', optional(optional($entrega->pedidoTroca)->medicamento)->slug) }}" class="text-blue-600 hover:text-blue-800 hover:underline">
                                    {{ optional(optional($entrega->pedidoTroca)->medicamento)->name ?? 'Desconhecido' }}
                                </a>
                            </p>
                            <p class="flex items-center gap-2">
                                <i class="ri-map-pin-2-line text-green-600"></i>
                                <span class="font-medium">Origem:</span>
                                <span>
                                    {{ optional($entrega->enderecoOrigem)->bairro ?? 'Bairro N/A' }}
                                    @if (optional($entrega->enderecoOrigem)->cidade ?? false)
                                        , {{ $entrega->enderecoOrigem->cidade }} - {{ optional($entrega->enderecoOrigem)->uf ?? 'N/A' }}
                                    @endif
                                </span>
                            </p>

                            <p class="flex items-center gap-2">
                                <i class="ri-map-pin-line text-gray-500"></i>
                                <span class="font-medium">Destino:</span>
                                <span>
                                    {{ optional($entrega->enderecoDestino)->bairro ?? 'Bairro N/A' }}
                                    @if (optional($entrega->enderecoDestino)->cidade ?? false)
                                        , {{ $entrega->enderecoDestino->cidade }} - {{ optional($entrega->enderecoDestino)->uf ?? 'N/A' }}
                                    @endif
                                </span>
                            </p>
                            <p class="flex items-center gap-2">
                                <i class="ri-calendar-check-line text-gray-500"></i>
                                <span class="font-medium">Data Conclusão:</span>
                                <span>{{ \Carbon\Carbon::parse($entrega->updated_at)->format('d/m/Y H:i') }}</span>
                            </p>
                            <p class="flex items-center gap-2">
                                <i class="ri-wallet-line text-gray-500"></i>
                                <span class="font-medium">Custo:</span>
                                <span>{{ $entrega->formatted_custo_entrega ?? 'N/A' }}</span>
                            </p>
                            <p class="flex items-center gap-2">
                                <i class="ri-bank-card-line text-gray-500"></i>
                                <span class="font-medium">Pagamento:</span>
                                <span>{{ ucfirst(str_replace('_', ' ', $entrega->metodo_pagamento ?? 'N/A')) }}</span>
                            </p>
                        </div>
                    </div>

                    <div class="mt-5 text-center">
                        <a href="{{ route('restrito.motoboy.detalhes-troca', optional($entrega->pedidoTroca)->codigo_troca) }}"
                           class="inline-flex items-center px-3 py-2 border border-transparent text-sm font-medium shadow-sm text-white bg-green-600 hover:bg-green-700 focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-green-500 transition-colors duration-200">
                            <i class="ri-information-line mr-2 text-2xl"></i> Ver Detalhes da Troca
                        </a>
                    </div>
                </div>
            @empty
                <div class="col-span-full bg-white shadow-sm border border-gray-200 p-5 text-center text-gray-500">
                    <p class="text-lg font-medium mb-2">🎉 Nenhuma entrega concluída por você ainda!</p>
                    <p>Continue entregando para ver seu histórico aqui.</p>
                </div>
            @endforelse
        </div>

        <div class="mt-8 pt-5 border-t border-gray-200">
            {{ $entregas->links() }}
        </div>
    </div>
</div>
@endsection

@section('scripts')
{{-- Include SweetAlert2 as per your dashboard blade --}}
<script>
    // Exibir mensagens flash do Laravel com SweetAlert2
    @if(session('success'))
        Swal.fire({
            title: 'Sucesso!',
            text: '{{ session('success') }}',
            icon: 'success',
            confirmButtonColor: '#10B981', // green-500
            customClass: {
                popup: 'shadow-xl',
                confirmButton: 'px-5 py-2 text-base font-medium',
            }
        });
    @endif

    @if(session('error'))
        Swal.fire({
            title: 'Erro!',
            text: '{{ session('error') }}',
            icon: 'error',
            confirmButtonColor: '#EF4444', // red-500
            customClass: {
                popup: 'shadow-xl',
                confirmButton: 'px-5 py-2 text-base font-medium',
            }
        });
    @endif

    @if(session('info'))
        Swal.fire({
            title: 'Informação!',
            text: '{{ session('info') }}',
            icon: 'info',
            confirmButtonColor: '#3B82F6', // blue-500
            customClass: {
                popup: 'shadow-xl',
                confirmButton: 'px-5 py-2 text-base font-medium',
            }
        });
    @endif
</script>
@endsection