@extends('layouts.UserDashboard')
@section('user')
    <!-- start page title -->

    @if(!$check_apply || ($check_apply && empty($check_apply->agent_id)))
        {{-- Show apply form if user never applied OR applied but no agent_id yet --}}
        <div class="row">
            <div class="col-xl-12">
                <div class="card">
                    <form action="{{ route('user.apply.agent.store') }}" method="post">
                        @csrf
                        <div class="card-body">
                            <h1 class="mb-4">Apply to join the team</h1>

                            <div class="mb-4">
                                <h5 class="font-weight-bold">Agent ID:</h5>
                                <p class="text-muted">Please enter the agent ID</p>
                                <input type="text" name="agent_id" class="form-control"
                                       placeholder="Enter the ID of your agent"
                                       style="max-width: 400px;">
                            </div>

                            <div class="alert alert-info">
                                <p class="mb-0">
                                    You will become the host after the host apply is approved.
                                    After becoming a host, your income will be entrusted to your agent.
                                </p>
                            </div>

                            <hr class="my-4">

                            <button class="btn btn-primary px-4">Apply</button>
                        </div>
                    </form>
                </div>
            </div>
        </div>
    @else
        {{-- Show success message if applied --}}
        <div class="row">
            <div class="col-xl-12">
                <div class="card shadow-sm border-0 rounded-3">
                    <div class="card-body text-center py-5">
                        <h2 class="text-success mb-3">✅ Your application has been submitted!</h2>
                        <p class="text-muted mb-4" style="font-size: 16px;">
                            You will become the host after the host apply is approved.
                            Wait for the approval.
                        </p>
                    </div>
                </div>
            </div>
        </div>
    @endif
@endsection