@extends('layouts.main')

@section('content')
<div class="container d-flex justify-content-center align-items-center" style="min-height: 75vh;">
    <div class="card shadow-lg border-0 text-center p-5" style="max-width: 500px;">
        <div class="mb-4">
            <i class="bi bi-x-circle-fill text-danger" style="font-size: 4rem;"></i>
        </div>
        <h2 class="mb-3 text-danger">Payment Cancelled</h2>
        <p class="mb-4 text-muted">You cancelled the transaction. No amount was deducted from your account.</p>
        <a href="{{ route('wallet.topupForm') }}" class="btn btn-outline-danger px-4">Try Again</a>
    </div>
</div>
@endsection