@extends('layouts.app')

@section('content')
<div class="container d-flex justify-content-center align-items-center vh-100">
    <div class="card shadow-lg p-5 text-center border-success">
        <div class="checkmark-icon">
            ✅
        </div>
        <h2 class="text-success mt-3 fw-bold">Payment Successful!</h2>
        <p class="mt-2 text-muted">Your membership has been activated successfully. Enjoy your premium benefits! 🚀</p>
        <a href="{{ route('seller.dashboard') }}" class="btn btn-success btn-lg mt-3">Go to Dashboard</a>
    </div>
</div>

<style>
    .checkmark-icon {
        font-size: 5rem;
        color: green;
        animation: pop 0.5s ease-in-out;
    }
    
    @keyframes pop {
        0% { transform: scale(0.5); opacity: 0; }
        100% { transform: scale(1); opacity: 1; }
    }
</style>
@endsection