<x-app-layout>
    <div class="container mt-5">
        <h2 class="mb-4">Generate Codes</h2>

        {{-- Promo Code Form --}}
        <div class="card shadow mb-5">
            <div class="card-body">
                <form method="POST" action="{{ $url }}">
                    @csrf
                    <div class="row">
                        <div class="col-md-6 mb-3">
                            <label>PROMO CODE TYPE</label>
                            <select name="type" class="form-control" required>
                                <option value="">Select Promo Type</option>
                                <option value="year_free_then_fixed">1st Year Free, then �12.99/month</option>
                                <option value="month_free_then_discount">1st Month Free, then 15% Off for 1 Year</option>
                            </select>
                        </div>
                        <div class="col-md-6 mb-3">
                            <label>NUMBER OF CODES TO GENERATE</label>
                            <input type="number" name="quantity" class="form-control" min="1" value="1" required />
                        </div>
                    </div>
                    <button type="submit" class="btn btn-primary">Generate Promo Codes</button>
                </form>
            </div>
        </div>

        {{-- Promo Code List --}}
        <div class="card shadow">
            <div class="card-body">
                <h4 class="mb-3">Generated Promo Codes</h4>
                <div class="table-responsive">
                    <table class="table table-bordered table-striped">
                        <thead class="table-light">
                            <tr>
                                <th style="color: var(--coffee-dark);">Code</th>
                                <th style="color: var(--coffee-dark);">Type</th>
                                <th style="color: var(--coffee-dark);">Free Months</th>
                                <th style="color: var(--coffee-dark);">Fixed Price</th>
                                <th style="color: var(--coffee-dark);">Price / Discount</th>
                                <th style="color: var(--coffee-dark);">Discount Duration</th>
                                <th style="color: var(--coffee-dark);">Status</th>
                                <th style="color: var(--coffee-dark);">Created At</th>
                            </tr>
                        </thead>
                        <tbody>
                            @forelse($promoCodes as $code)
                                <tr>
                                    <td>{{ $code->code }}</td>
                                    <td>{{ $code->type }}</td>
                                    <td>{{ $code->free_months }}</td> 
				    <td>
                                        @if($code->fixed_price)
                                            �{{ $code->fixed_price }}
                                        @else
                                            -
                                        @endif
                                    </td>

                                    <td>
                                        @if($code->price)
                                            �{{ $code->price }}
                                        @elseif($code->discount_percent)
                                            {{ $code->discount_percent }}%
                                        @else
                                            -
                                        @endif
                                    </td> 				
				    <td>
                                        @if($code->discount_duration_months)
                                            {{ $code->discount_duration_months }} Months
                                        @else
                                            -
                                        @endif
                                    </td>


                                    <td>
                                        @if($code->is_active == 1)
        <span class="badge bg-success">Active</span>
    @else
        <span class="badge bg-danger">Used</span>
    @endif                                    </td>
                                    <td>{{ $code->created_at->format('Y-m-d H:i') }}</td>
                                </tr>
                            @empty
                                <tr>
                                    <td colspan="6" class="text-center text-muted">No promo codes found.</td>
                                </tr>
                            @endforelse
                        </tbody>
                    </table>
                </div>

                {{-- Pagination --}}
                <div class="d-flex justify-content-center mt-3">
                    {{ $promoCodes->links('pagination::bootstrap-5') }}
                </div>
            </div>
        </div>
    </div>
</x-app-layout>