@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($tours as $tour)

                <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($tour->image) }}"
                                class="card-img-top"
                                style="height:220px; object-fit:cover;"
                                alt="{{ $tour->title }}"
                            >

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

                        </div>


                         <div class="card-body d-flex flex-column">

                            <h5 class="fw-bold mb-3">
                                {{ $tour->title }}
                            </h5>


                            <p class="text-muted mb-3">

                                {{ $tour->summary }}

                            </p>


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

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

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

                                    تومان

                                </strong>


                                <a
                                    href="{{ route('index') }}"
                                    class="btn btn-outline-primary rounded-pill px-4"
                                >
                                    برگشت
                                </a>

                            </div>

                        </div>

                    </div>

                </div>

            @endforeach

        </div>


         <div class="mt-5 d-flex justify-content-center">

            {{ $tours->links() }}

        </div>

    </div>

@endsection