@extends('layouts.customer')

@section('content')
<div class="max-w-xl mx-auto py-10">
    <h2 class="text-2xl font-bold mb-6 text-center">
        Choose Payment Method
    </h2>

    <div class="bg-white shadow rounded-xl p-6 space-y-4">

        <div class="text-center text-gray-700">
            <p class="font-semibold">{{ $subscription->plan->name }}</p>
            <p class="text-lg font-bold">£{{ number_format($subscription->fee, 2) }}</p>
        </div>

        <!-- Paystack -->
        <form action="{{ route('customer.subscription.paystack.init', $subscription) }}" method="POST">
            @csrf
            <button
                class="w-full bg-green-600 text-white py-3 rounded-lg font-semibold hover:bg-green-700">
                Pay with Paystack
            </button>
        </form>

        <!-- Stripe -->
        <form action="{{ route('customer.subscription.stripe.init', $subscription) }}" method="POST">
            @csrf
            <button
                class="w-full bg-indigo-600 text-white py-3 rounded-lg font-semibold hover:bg-indigo-700">
                Pay with Card (Stripe)
            </button>
        </form>

    </div>
</div>
@endsection