@extends('layouts.app')
@push('css')
<link href="{{ asset('dist/frontend/module/car/css/car.css?_ver='.config('app.asset_version')) }}" rel="stylesheet">
<link rel="stylesheet" type="text/css" href="{{ asset(" libs/ion_rangeslider/css/ion.rangeSlider.min.css") }}" />

<style>
    .box .col p {
        margin-top: 10px;
    }

    .box .row .col-12 {
        margin-top: 21px;
    }

    .fleet__block_badge {
        position: absolute;
        left: -30px;
        top: -28px;
        transform: scale(0.7);
        z-index: 1;
    }

    .bravo_search_flight {
        margin: auto;
    }

    .tab-one {
        margin-left: 2rem;
    }

    .tab-two {
        margin-left: 15rem;
    }

    .bravo_search_flight .title h2 {
        font-size: 23px;
        padding: 2rem;
    }

    .title__block {
        border-right: 1px solid #C4C4C4;
    }

    .bravo_wrap .bravo_search_car .bravo_filter .g-filter-item .item-content {
        margin-top: 0px;
    }

    input[type="date"],
    input[type="time"],
    input[type="datetime-local"],
    input[type="month"] {
        -webkit-appearance: listbox;
        border: white;
    }

    input[type="date"],
    input[type="time"],
    input[type="datetime-local"],
    input[type="month"] :focus-visible {
        -webkit-appearance: listbox;
        border: white !important;
        outline: -webkit-focus-ring-color auto 0px;
        width: 100%;
    }

    .col-md-6.border-right {
        border: 0 !important;
        border-top: 1px solid rgba(0, 0, 0, 0.1) !important;
        border-left: 1px solid rgba(0, 0, 0, 0.1) !important;
    }
</style>
@endpush
@section('content')
<div class="bravo_search_car">
    @include('CityCityTransportation::frontend.form.form')
    <div class="container">
        <div class="row">
            <div class="col-lg-3 col-md-12">
                <div class="bravo_filter">
                    <input type="hidden" value="05/02/2023" name="start">
                    <input type="hidden" value="05/03/2023" name="end">
                    <input type="hidden" name="date" value="2023-05-02 - 2023-05-03">
                    <div class="filter-title">
                        INFORMATION
                    </div>
                    <div class="g-filter-item">
                        <div class="item-content">
                            {{-- ----start box---- --}}
                            <div class="box ">
                                <div class="row">
                                    <div class="col">
                                        <div class="row">
                                            <div class="col-12">
                                                <div class="row">
                                                    <div class="col-1">
                                                        <img src="https://alptransfer.com/images/icons/location.svg">
                                                    </div>
                                                    <div class="col-7">
                                                        <div>From:{{ ucfirst(Request()->from_location) }}</div>
                                                    </div>
                                                </div>
                                            </div>
                                        </div>
                                        <div class="row">
                                            <div class="col-12">
                                                <div class="row">
                                                    <div class="col-1">
                                                        <img src="https://alptransfer.com/images/icons/location.svg">
                                                    </div>
                                                    <div class="col-7">
                                                        <div>To:{{ ucfirst(Request()->to_location) }}</div>
                                                    </div>
                                                </div>
                                            </div>
                                        </div>
                                        <br />
                                        <div class="row">
                                            <div class="col-1">
                                                <img src="{{ asset('images/passenger.svg?6f82f69') }}">
                                            </div>
                                            <div class="col-1">
                                                <div>{{ Request()->passengers }}</div>
                                            </div>
                                            <br />
                                        </div>
                                        <br />
                                        <div class="row">
                                            <div class="col-1">
                                                <img src="https://alptransfer.com/images/icons/date.svg">
                                            </div>
                                            <div class="col-9">
                                                {{ date('m-d-Y', strtotime(Request()->date)) }}
                                            </div>
                                            <br />
                                        </div>
                                    </div>
                                </div>
                            </div>
                            {{-- ----end box---- --}}


                        </div>
                    </div>



                </div>


            </div>
            <div class="col-lg-9 col-md-12">
                <div class="bravo-list-item">
                    <div class="topbar-search">
                        <h2 class="text">
                            {{ $CarTypesCount }} cars found
                        </h2>
                    </div>
                    <div class="list-item">
                        <div class="row">
                            {{-- list car --}}
                            @foreach ($CarTypes as $CarType)
                            <div class="col-lg-4 col-md-6">
                                <div class="item-loop ">
                                    <div class="featured">
                                        {{ ucfirst($CarType->TypeClass->name) }}
                                    </div>
                                    <div class="thumb-image ">
                                        <a @if(!empty($blank)) target="_blank" @endif
                                            href="{{ route('ReservationCityCity',Request()->all() + ['carType' => $CarType->id ]) }}">
                                            @if(!empty($CarType->image_url))
                                            <img src="{{$CarType->image_url}}" class="img-responsive"
                                                alt="{{ $CarType->name }}">
                                            @else
                                            {!!
                                            get_image_tag($CarType->image_id,'medium',['class'=>'img-responsive','alt'=>$CarType->title])
                                            !!}
                                            @endif
                                        </a>
                                    </div>
                                    <div class="item-title">
                                        <a
                                            href="{{ route('ReservationCityCity',Request()->all() + ['carType' => $CarType->id ]) }}">
                                            {{ $CarType->name }}
                                        </a>
                                    </div>
                                    <div class="location">
                                        {{ $CarType->airport->name??'' }}
                                    </div>
                                    <div class="amenities">
                                        <span class="amenity total" data-toggle="tooltip" title=""
                                            data-original-title="Passenger">
                                            <i class="input-icon field-icon icon-passenger"></i>
                                            <span class="text">
                                                {{ $CarType->CarSeat->seat ??'' }}
                                            </span>
                                        </span>
                                    </div>
                                    <div class="info">
                                        <div class="g-price">
                                            <div class="prefix">
                                                <span class="fr_text">from</span>
                                            </div>
                                            <div class="price">
                                                <span class="onsale"></span>
                                                <span class="text-price">{{format_money_main($CarType->price_city)}}
                                                    <span class="unit">/day</span></span>
                                            </div>
                                        </div>
                                    </div>
                                </div>

                            </div>
                            @endforeach
                            {{-- list car --}}
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
</div>
@endsection

@push('js')
<script type="text/javascript" src="{{ asset(" libs/ion_rangeslider/js/ion.rangeSlider.min.js") }}"></script>
<script type="text/javascript" src="{{ asset('module/car/js/car.js?_ver='.config('app.asset_version')) }}"></script>
@endpush