@extends('layouts.welcome')
@section('title', 'Succès paiement')
@section('content')
    <div class="container py-5">
        <div class="card shadow rounded-4 border-0 mx-auto" style="max-width: 500px;">
            <div class="card-body text-center p-4">

                <div class="text-success mb-3">
                    <i class="bi bi-check-circle-fill" style="font-size: 3rem;"></i>
                </div>

                <h4 class="mb-2 fw-semibold">Paiement effectué avec succès</h4>
                <p class="text-muted mb-4">Merci pour votre paiement. Voici les détails de votre transaction :</p>

                <ul class="list-group list-group-flush mb-4 text-start">
                    <li class="list-group-item d-flex justify-content-between">
                        <span class="fw-medium">Montant :</span>
                        <span>{{ session('pdf')[1] }} FCFA</span>
                    </li>
                    <li class="list-group-item d-flex justify-content-between">
                        <span class="fw-medium">ID Transaction :</span>
                        <span>{{ session('pdf')[2] }}</span>
                    </li>
                </ul>

                <a href="{{ session('pdf')[0] }}"
                    class="btn btn-outline-primary rounded-pill d-inline-flex align-items-center gap-2" download>
                    <i class="bi bi-file-earmark-arrow-down"></i> Télécharger le reçu
                </a>
            </div>
        </div>
    </div>
    <hr>
@endsection