@extends('layouts.hotels')

@php
    $langText = $lang == $multiLangMode::DEFAULT ? 'ja' : Str::slug($multiLangMode::getDescription($lang));
@endphp

@section('content')
    <form id="hotels-search-input" action="{{ route('hotels.' . $langText . '.room', $project->id) }}" method="get">
        <div class="hotels-heading-page">
            <div class="hotels-heading-page-inner hotels-heading-page-inner-small">
                <h1 class="hotels-heading-main">
                    {!! __('hotels.nav.text_search', [], $multiLangMode::getLanguageCode($lang)) !!}
                </h1>
            </div>
        </div>

        <div class="hotels-main-inner hotels-main-inner-small">
            <section class="hotels-section">
                <h2 class="hotels-heading-section">
                    {!! __('hotels.from_search.selected_date', [], $multiLangMode::getLanguageCode($lang)) !!}
                </h2>
                <div class="hotels-form-calendar">
                    <div class="hotels-form-calendar-box js-dayTripSelect01">
                        <div class="hotels-form-calendar-box-input">
                            <input type="text" id="date_checkin" class="hotels-input date-input" placeholder="IN"
                                readonly="readonly" value="" data-date='{{ $params['checkin_date'] }}'
                                onclick="openModalSearchCalendar()">
                            <input id="hidden_date_checkin" name="checkin_date" type="hidden"
                                value="{{ $params['checkin_date'] }}">
                        </div>
                        <span class="hotels-form-calendar-box-space"></span>
                        <div class="hotels-form-calendar-box-input">
                            <input id="date_checkout" class="hotels-input date-input"
                                data-date='{{ $params['checkout_date'] }}' type="text" placeholder="OUT"
                                readonly="readonly" value="" onclick="openModalSearchCalendar()">
                            <input id="hidden_date_checkout" name="checkout_date" type="hidden"
                                value="{{ $params['checkout_date'] }}">
                        </div>
                    </div>
                </div>
            </section>

            <section class="hotels-section">
                <h2 class="hotels-heading-section">
                    {!! __('hotels.from_search.select_number', [], $multiLangMode::getLanguageCode($lang)) !!}
                </h2>
                <div class="hotels-form-number-area">
                    <div class="hotels-form-number-area-item">
                        <ul class="hotels-list-reservation-item">
                            <li class="hotels-list-reservation-item-item">
                                <div class="hotels-list-reservation-item-item-data">
                                    <p class="hotels-list-reservation-item-item-data-main">
                                        {!! __('hotels.from_search.people', [], $multiLangMode::getLanguageCode($lang)) !!}
                                    </p>
                                </div>
                                <div class="hotels-list-reservation-item-item-number">
                                    <button
                                        class="hotels-list-reservation-item-item-number-btn hotels-list-reservation-item-item-number-btn-minus js-downBtn"
                                        type="button">−</button>
                                    <input class="js-number-input" type="number" name="adults"
                                        value="{{ $params['adults'] }}" readonly="readonly" min="1"
                                        max="{{ $basic['max_people'] ?? 10 }}">
                                    <button
                                        class="hotels-list-reservation-item-item-number-btn hotels-list-reservation-item-item-number-btn-plus js-upBtn"
                                        type="button">＋</button>
                                </div>
                            </li>
                        </ul>
                    </div>
                    <div class="hotels-form-number-area-item">
                        <ul class="hotels-list-reservation-item">
                            <li class="hotels-list-reservation-item-item">
                                <div class="hotels-list-reservation-item-item-data">
                                    <p class="hotels-list-reservation-item-item-data-main">
                                        {!! __('hotels.from_search.room', [], $multiLangMode::getLanguageCode($lang)) !!}
                                    </p>
                                </div>
                                <div class="hotels-list-reservation-item-item-number">
                                    <button
                                        class="hotels-list-reservation-item-item-number-btn hotels-list-reservation-item-item-number-btn-minus js-downBtn"
                                        type="button">−</button>
                                    <input class="js-number-input" type="number" name="rooms"
                                        value="{{ $params['rooms'] }}" readonly="readonly" min="1" max="{{ $basic['max_room'] ?? 10 }}">
                                    <button
                                        class="hotels-list-reservation-item-item-number-btn hotels-list-reservation-item-item-number-btn-plus js-upBtn"
                                        type="button">＋</button>
                                </div>
                            </li>
                        </ul>
                    </div>
                </div>
            </section>
            <div class="hotels-btnBox hotels-btnBox-small">
                <button type="submit" class="hotels-button hotels-button-reservation">
                    {!! __('hotels.from_search.text_search', [], $multiLangMode::getLanguageCode($lang)) !!}
                </button>
            </div>
        </div>
    </form>
@endsection