@extends('layouts.app')
@section('content')

    <div class="container py-5">
        <div class="d-flex justify-content-between align-items-center mb-4">
            <h2 class="fw-bold">
                آرشیو پروازها  ️
            </h2>
        </div>

        <div class="row g-4">
            @foreach($flights as $flight)

                <div class="col-lg-4 col-md-6">
                    <div class="card h-100 shadow-sm border-0 rounded-4 overflow-hidden">
                        <div class="position-relative">
                            <img src="{{ getImageUrl($flight->image) }}"
                                 class="card-img-top"
                                 style="height:220px; object-fit:cover;"
                                 alt="{{ $flight->airline }}">

                            <span class="position-absolute top-0 end-0 m-3 badge bg-primary">

                            {{ $flight->flight_class ?? 'Economy' }}

                        </span>
                        </div>

                        <div class="card-body">

                            <h5 class="fw-bold mb-3">

                                {{ $flight->airline }}

                            </h5>

                            <div class="text-muted mb-2">

                                <i class="bi bi-geo-alt"></i>

                                {{ $flight->origin }}

                                →

                                {{ $flight->destination }}

                            </div>

                            <div class="mb-2">

                                📅

                                {{ verta($flight->departure_date)->format('Y/m/d') }}

                            </div>

                            <div class="d-flex justify-content-between align-items-center mt-4">

                                <strong class="text-primary fs-5">

                                    {{ number_format($flight->price) }}

                                    تومان

                                </strong>
                            </div>
                        </div>
                    </div>
                </div>
            @endforeach
                <a href="{{route('index')}}"
                   class="btn btn-outline-primary rounded-pill">
                    برگشت
                </a>
                <div class="mt-5 d-flex justify-content-center">
                    {{$flights->links()}}
                </div>
        </div>
    </div>
@endsection