@extends($activeTemplate . 'layouts.frontend')
@section('content')
    <section class="dashboard-section padding-top padding-bottom">
        <div class="container">
            <div class="dashboard-wrapper">
                <div class="row justify-content-center gy-2">
                    <div class="col-xl-6 col-lg-8 col-md-10">
                        <div class="booking-table-wrapper">
                            <div class="text-center px-3 mb-5">
                                <svg width="84" height="84" viewBox="0 0 300 300" fill="none" xmlns="http://www.w3.org/2000/svg">
                                    <path d="M150 25C81 25 25 81 25 150C25 219 81 275 150 275C219 275 275 219 275 150C275 81 219 25 150 25ZM125 212.5L62.5 150L80.125 132.375L125 177.125L219.875 82.25L237.5 100L125 212.5Z" fill="hsl(var(--success))" />
                                </svg>
                                <h4 class="mt-4 mb-2">@lang('Booking Confirmed!')</h4>
                                <p>@lang('Your ticket has been successfully booked. Below are your journey details:')</p>
                            </div>
                            <ul class="list-group list-group-flush">
                                <li class="list-group-item d-flex justify-content-between align-items-center flex-wrap gap-2 px-0">
                                    <span class="text-start">@lang('Trip')</span>
                                    <span>{{ __($bookedTicket?->trip?->title) }}</span>
                                </li>
                                <li class="list-group-item d-flex justify-content-between align-items-center flex-wrap gap-2 px-0">
                                    <span class="text-start">@lang('Route')</span>
                                    <span>{{ __($bookedTicket?->trip?->route->name) }}</span>
                                </li>
                                <li class="list-group-item d-flex justify-content-between align-items-center flex-wrap gap-2 px-0">
                                    <span class="text-start">@lang('PNR Number')</span>
                                    <span>{{ __($bookedTicket->pnr_number) }}</span>
                                </li>
                                <li class="list-group-item d-flex justify-content-between align-items-center flex-wrap gap-2 px-0">
                                    <span class="text-start">@lang('AC / Non-Ac')</span>
                                    <span>{{ __($bookedTicket?->trip?->fleetType->has_ac ? 'AC' : 'Non-Ac') }}</span>
                                </li>
                                <li class="list-group-item d-flex justify-content-between align-items-center flex-wrap gap-2 px-0">
                                    <span class="text-start">@lang('Starting Point')</span>
                                    <span>{{ __($bookedTicket?->pickup?->name) }}</span>
                                </li>
                                <li class="list-group-item d-flex justify-content-between align-items-center flex-wrap gap-2 px-0">
                                    <span class="text-start">@lang('Boarding Point')</span>
                                    <span>{{ __($bookedTicket?->boarding?->name) }}</span>
                                </li>
                                <li class="list-group-item d-flex justify-content-between align-items-center flex-wrap gap-2 px-0">
                                    <span class="text-start">@lang('Dropping Point')</span>
                                    <span>{{ __($bookedTicket?->drop?->name) }}</span>
                                </li>
                                <li class="list-group-item d-flex justify-content-between align-items-center flex-wrap gap-2 px-0">
                                    <span class="text-start">@lang('Journey Date')</span>
                                    <span>{{ showDateTime($bookedTicket->date_of_journey, 'd M, Y') }}</span>
                                </li>
                                <li class="list-group-item d-flex justify-content-between align-items-center flex-wrap gap-2 px-0">
                                    <span class="text-start">@lang('Pickup Time')</span>
                                    <span>{{ showDateTime($bookedTicket?->trip?->start_time, 'h:i a') }}</span>
                                </li>
                                <li class="list-group-item d-flex justify-content-between align-items-center flex-wrap gap-2 px-0">
                                    <span class="text-start">@lang('Booked Seats')</span>
                                    <span>{{ __(implode(',', $bookedTicket->seats)) }}</span>
                                </li>
                                <li class="list-group-item d-flex justify-content-between align-items-center flex-wrap gap-2 px-0">
                                    <span class="text-start">@lang('Status')</span>
                                    <span>
                                        @php
                                            echo $bookedTicket->statusBadge;
                                        @endphp
                                    </span>
                                </li>
                                <li class="list-group-item d-flex justify-content-between align-items-center flex-wrap gap-2 px-0">
                                    <span class="text-start">@lang('Trip Status')</span>
                                    <span>
                                        @php
                                            echo $bookedTicket?->trip?->statusBadge;
                                        @endphp
                                    </span>
                                </li>
                                <li class="list-group-item d-flex justify-content-between align-items-center flex-wrap gap-2 px-0">
                                    <span class="text-start">@lang('Fare')</span>
                                    <span>{{ showAmount($bookedTicket->unit_price) }}</span>
                                </li>
                                <li class="list-group-item d-flex justify-content-between align-items-center flex-wrap gap-2 px-0 pb-0">
                                    <span class="text-start">@lang('Total Fare')</span>
                                    <span>{{ showAmount($bookedTicket->sub_total) }}</span>
                                </li>
                            </ul>
                        </div>
                        <div class="d-flex justify-content-between mt-4">
                            <a href="{{ url()->previous() == route('user.home') ? route('user.home') : route('user.ticket.history') }}" class="btn btn-outline--success mb-2"><i class="las la-angle-left"></i>@lang('Booking History')</a>
                            @if ($bookedTicket->status == Status::BOOKED_APPROVED)
                                <a href="{{ route('user.ticket.print', $bookedTicket->id) }}" target="_blank" class="btn btn--base mb-2 me-2">
                                    <i class="las la-file-download la-lg"></i>
                                    @lang('Download Ticket')
                                </a>
                            @endif
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </section>
@endsection

@push('style')
    <style>
        .list-group-flush>.list-group-item {
            border-bottom: 1px dashed #cecfcf;
        }
    </style>
@endpush
