{% if page.app_name != 'home' %}
<div class="tabs row">
    <div class="col-md-6 col-6 tab-active">
        <span class="number">1º</span>
        Passo <span class="passo-r">/ <b>Selecione a hospedagem</b></span>
    </div>
    <div class="col-md-6 col-6 tab">
        <span class="number">2º</span>
        Passo <span class="passo-r">/ <b>Finalize sua reserva</b></span>
    </div>
</div>
{% else %}
<h1 class="titulo">
    Hospedagem
</h1>
{% endif %}
<div class="motor pnlMotor hotel motorHotel" data-b2c-motor="hospedagem" data-b2c-motor-js>
    <div class="row">
        <div class="flex-20">
            <label for="input-destino">Destino</label>
            <div class="input-group input-group-icon">
                <input type="text" id="input-destino"
                       value="{{ params.idDestino ~ ';' ~ motor.destino.nm }}"
                       data-motor-input="destino" class=" idDestino" placeholder="Destino">
                <div class="input-icon">
                    <i class="fas fa-map-marker-alt" aria-hidden="true"></i>
                </div>
            </div>
        </div>
        <div class="flex-20">
            <label for="input-dt-entrada">Entrada</label>
            <div class="input-group input-group-icon">
                <input class="input-data dtIni"
                       type="text"
                       value="{{ params.dtEntrada|replace({'-': '/'}) }}"
                       id="input-dt-entrada"
                       placeholder="Entrada"
                       data-motor-input="dtEntrada">
                <div class="input-icon">
                    <i class="fa fa-calendar" aria-hidden="true" style="color: #2DBBB1;"></i>
                </div>
            </div>
        </div>
        <div class="flex-20">
            <label for="input-dt-saida">Saida</label>
            <div class="input-group input-group-icon">
                <input class="input-data dtFim" type="text" placeholder="Data" name="date-saida" data-default=""
                       value="{{ params.dtSaida|replace({'-': '/'}) }}" readonly="readonly"
                       data-motor-input="dtSaida">

                <div class="input-icon">
                    <i class="fas fa-calendar" aria-hidden="true" style="color: #2DBBB1;"></i>
                </div>
            </div>
        </div>
        <div class="col-md-3 col-sm-12 col-xs-12">
            <div class="header-search-input-item fl-wrap">
                <input type="text" class="quartoConfig" style="display: none;"/>
                <label>Quarto(s)</label>
                <div class="qty-dropdown fl-wrap inp-quartos inp-quartos">
                    <div class="qty-dropdown-header row fl-wrap no-before"
                         style="margin-top: -4px;padding-left: 0;">
                        <div class="col-md-6 col-6">
                            <span><i class="fas fa-bed"></i> <span class="qtQrts">0</span> <span
                                        class="hidden-sm hidden-xs hidden-md">Quarto(s)</span></span>
                        </div>
                        <div class="col-md-6 col-6">
                            <span><i class="far fa-user"></i> <span class="qtPass">0</span> <span
                                        class="hidden-sm hidden-xs hidden-md">Pessoa(s)</span></span>
                        </div>
                    </div>
                </div>
                <div class="quarto-dropdown" data-motor-quartos="hospedagem">
                    <div class="header mob-header fl-wrap">
                        <h3>Quarto(s) <span class="close-reg color-bg close-reg-qrts" style="margin-top: 6px;"><i
                                        class="fal fa-times" style="color: #000;"></i></span>
                        </h3>
                    </div>
                    <div class="fl-wrap header quartoQt">
                        <h3 style="    font-size: 13px;">
                            Quartos:
                            <select class="select" data-motor-select="qtUh">

                            </select>
                        </h3>
                    </div>
                    <div class="quartoItems" data-motor-lista-quartos>
                        <div class="quartoItem" data-motor-quarto>
                            <label style="font-size: 12px;color: #9196a7;float: left; margin-left: 12px;">{{ __('quarto') }} </label>
                            <article class="fl-wrap">
                                <div class="conteudo fl-wrap">
                                    <div class="row pes-row quartoAdt">
                                        <div class="col-sm-6">
                                            <span>Adulto(s)</span>
                                        </div>
                                        <div class="col-sm-6">
                                            <select class="select qrtAdt" data-motor-select="qtAdt"></select>
                                        </div>
                                    </div>
                                    <div class="row pes-row quartoSnr"  data-motor-quarto-melhor-idade>
                                        <div class="col-sm-6">
                                            <span>Sênior(s)</span>
                                        </div>
                                        <div class="col-sm-6 ">
                                            <select class="select qrtAdt" data-motor-select="qtSnr"></select>
                                        </div>
                                    </div>
                                    <div class="row pes-row chd quartoSnrIdade " style="margin-top: 0" data-motor-quarto-snr-idades>
                                        <div class="hidden" data-motor-select-snr-template>
                                            <select id="idade" name="snr" data-motor-select-snr-idade></select>
                                        </div>
                                        <div class="col-sm-12 quartoIdade quartoSnrIdadeSel" data-motor-quarto-snr-idade-list>

                                        </div>
                                    </div>
                                    <div class="row pes-row quartoChd">
                                        <div class="col-sm-6">
                                            <span>Criança(s)</span>
                                        </div>
                                        <div class="col-sm-6">
                                            <select class="select qrtChd" data-motor-select="qtChd"></select>
                                        </div>
                                    </div>
                                    <div class="row pes-row chd" style="margin-top: 0"
                                         data-motor-quarto-crianca-idades>
                                        <div style="width: 100%" class="quartoIdade row">
                                            <div class="col-md-12">
                                                <label>{{ __('idade') }}</label>
                                            </div>
                                            <div class="quartoIdadeSel col-md-6 col-3">
                                                <select></select>
                                            </div>
                                        </div>
                                    </div>
                                </div>
                            </article>
                        </div>
                    </div>

                    <div class="quarto-dropdown-footer fl-wrap">
                        <a href="javascript:void(0)" class="appl-qrts">Aplicar</a>
                    </div>

                </div>
            </div>
        </div>
        <div class="div-btn-verificar pnlBotao">
            <button type="button" class="btn btn-primary btn-pesquisar alterar  btnPesquisar" data-b2c-motor-btn-pesquisar>
                {% if page.app_name != 'home' %}
                    ALTERAR
                {% else %}
                    Pesquisar
                {% endif %}
            </button>
        </div>

    </div>
</div>