@extends('layouts.app')

@section('title', __('events.payment.title'))

@section('content')
<div class="container-fluid px-4 py-4">
    <div class="mb-4">
        <h1 class="display-md text-white mb-1">{{ __('events.payment.upload_proof') }}</h1>
        <p class="text-muted mb-0">{{ $registration->event->title }}</p>
    </div>

    @if ($errors->any())
        <div class="alert alert-danger">
            @foreach ($errors->all() as $error)
                <div>{{ $error }}</div>
            @endforeach
        </div>
    @endif

    <div class="row g-4">
        <div class="col-lg-7">
            <div class="card-arena p-4">
                <form method="POST" action="{{ route('registrations.payment-proof.store', $registration) }}" enctype="multipart/form-data">
                    @csrf

                    <div class="mb-3">
                        <label class="form-label text-muted fs-sm">{{ __('events.payment.select_method') }}</label>
                        <select name="manual_payment_method_id" class="form-select" required>
                            <option value="">Select method</option>
                            @foreach($paymentMethods as $method)
                                <option value="{{ $method->id }}" @selected(old('manual_payment_method_id') == $method->id)>{{ $method->name }}</option>
                            @endforeach
                        </select>
                    </div>

                    <div class="mb-3">
                        <label class="form-label text-muted fs-sm">{{ __('events.payment.transfer_reference') }}</label>
                        <input type="text" name="transfer_reference" class="form-control" value="{{ old('transfer_reference') }}">
                    </div>

                    <div class="mb-3">
                        <label class="form-label text-muted fs-sm">{{ __('events.payment.upload_proof') }}</label>
                        <input type="file" name="proof" class="form-control" accept=".jpg,.jpeg,.png,.webp,.pdf" required>
                        <div class="form-text">{{ __('events.payment.proof_instructions') }}</div>
                    </div>

                    <div class="mb-3">
                        <label class="form-label text-muted fs-sm">Notes</label>
                        <textarea name="user_notes" class="form-control" rows="3">{{ old('user_notes') }}</textarea>
                    </div>

                    <button type="submit" class="btn-arena btn-primary">{{ __('events.payment.submit_proof') }}</button>
                </form>
            </div>
        </div>

        <div class="col-lg-5">
            <div class="card-arena p-4">
                <h2 class="text-white fs-5 mb-3">{{ __('events.payment.instructions_heading') }}</h2>
                @if($registration->event->fee_amount_minor)
                    <p class="text-warning fw-600 mb-2">{{ __('events.payment.amount_due') }}: {{ number_format($registration->event->fee_amount_minor / 100, 2) }} {{ $registration->event->currency }}</p>
                @endif
                <div class="text-muted fs-sm">{!! nl2br(e($registration->event->payment_instructions ?? 'Follow the selected payment method instructions.')) !!}</div>
            </div>
        </div>
    </div>
</div>
@endsection
