@partial('main-footer', ['message' => $message, 'canShowNotification' => $canShowNotification]);

@partial('mobile-menu');

<!-- javascripts -->
{assets()->loadJs()}

<!-- search container -->
<div class="search-container">

    <span class="search-container-close" onclick="closeSearchContainer()">
        <i class="ion ion-close"></i>
    </span>

    <div class="container">
        <!-- property -->
        <div class="search-list property active">
            <form action="@link('explore-properties');" class="reservation-area" method="POST">
                @csrf;

                <input type="hidden" name="adult" value="1" data-target="travel-adult">
                <input type="hidden" name="children" value="0" data-target="travel-children">
                <input type="hidden" name="rooms" value="1" data-target="travel-room">
                <input type="hidden" name="checkin" value="">
                <input type="hidden" name="checkout" value="">
                <div class="input-box separator">
                    <i class="icon ion-android-pin"></i>
                    <input type="text" name="search" id="location" placeholder="Where are you going to?">
                </div>
                <div class="input-button separator datepicker-double">
                    <i class="icon ion-android-calendar"></i>
                    <span class="input-text"><span class="travel-checkin">Check in</span> - <span class="travel-checkout">Check out</span></span>
                </div>
                <div class="input-button separator datepicker-single" style="display: none;">
                    <div>
                        <i class="icon ion-android-calendar"></i>
                        <input type="text" value="" name="travel-checkin" class="datepicker" data-toggle="datepicker" placeholder="Checkin">
                    </div>

                    <div>
                        <i class="icon ion-android-calendar"></i>
                        <input type="text" value="" name="travel-checkout" class="datepicker" data-toggle="datepicker" placeholder="Checkout">
                    </div>
                </div>
                <div class="input-button staypicker-trigger">
                    <i class="icon ion-android-calendar"></i>
                    <span class="input-text"><span class="travel-adult">1 Adult</span> - <span class="travel-children">0 Children</span> - <span class="travel-room">1 Room</span></span>
                    <i class="icon ion-arrow-down-b see-more"></i>
                </div>
                <div class="search-button">
                    <button type="submit" class="btn btn-curve btn-signal"><i class="ion-android-search"></i> <span class="search-text" style="display: none;">Search</span></button>
                </div>

                <div class="stays-picker">
                    <div class="stays-picker-row">
                        <div class="text">Adults</div>
                        <div class="controller">
                            <span class="left-btn">
                                <i class="icon ion-minus"></i>
                            </span>
                            <input type="text" class="controller-field" onkeypress="return isNumber(event);" value="1" data-target="adult"/>
                            <span class="right-btn">
                                <i class="icon ion-plus"></i>
                            </span>
                        </div>
                    </div>

                    <div class="stays-picker-row">
                        <div class="text">Children</div>
                        <div class="controller">
                            <span class="left-btn">
                                <i class="icon ion-minus"></i>
                            </span>
                            <input type="text" class="controller-field" onkeypress="return isNumber(event);" value="0" data-target="children"/>
                            <span class="right-btn">
                                <i class="icon ion-plus"></i>
                            </span>
                        </div>
                    </div>

                    <div class="stays-picker-row">
                        <div class="text">Rooms</div>
                        <div class="controller">
                            <span class="left-btn">
                                <i class="icon ion-minus"></i>
                            </span>
                            <input type="text" class="controller-field" onkeypress="return isNumber(event);" value="1" data-target="rooms"/>
                            <span class="right-btn">
                                <i class="icon ion-plus"></i>
                            </span>
                        </div>
                    </div>
                </div>

            </form>
        </div>

        <!-- vehicle -->
        <div class="search-list vehicle">
            <form action="@link('explore-vehicles');" class="reservation-area" method="POST">
                @csrf;
                <input type="hidden" name="checkin" value="">
                <input type="hidden" name="checkout" value="">
                <div class="input-box separator">
                    <i class="icon ion-android-pin"></i>
                    <input type="text" name="search" id="location" placeholder="Enter pickup location">
                </div>
                {$types = app('query')->getVehicleCategory();}
                <div class="input-box input-box-small separator">
                    <i class="icon ion-android-car"></i>
                    <select name="vehicle-type">
                        <option value="">Pick a Car Type</option>
                        @foreach ($types as $type) 
                            <option value="{$type->categoryid}">{ucfirst($type->categoryName)}</option>
                        @endforeach
                    </select>
                </div>
                <div class="input-button datepicker-double">
                    <i class="icon ion-android-calendar"></i>
                    <span class="input-text"><span class="travel-checkin">Check in</span> - <span class="travel-checkout">Check out</span></span>
                </div>
                <div class="input-button separator datepicker-single" style="display: none;">
                    <div>
                        <i class="icon ion-android-calendar"></i>
                        <input type="text" value="" name="travel-checkin" class="datepicker" data-toggle="datepicker" placeholder="Checkin">
                    </div>

                    <div>
                        <i class="icon ion-android-calendar"></i>
                        <input type="text" value="" name="travel-checkout" class="datepicker" data-toggle="datepicker" placeholder="Checkout">
                    </div>
                </div>
                <div class="search-button">
                    <button class="btn btn-curve btn-signal"><i class="ion-android-search"></i></button>
                </div>
            </form>
        </div>
    </div>

</div>

<!-- end body,html -->
</body>
</html>
@setdefault;