/**
* NOTICE OF LICENSE
*
* This source file is subject to the Academic Free License (AFL 3.0)
* that is bundled with this package in the file LICENSE.md
* It is also available through the world-wide-web at this URL:
* https://opensource.org/licenses/afl-3.0.php
* If you did not receive a copy of the license and are unable to
* obtain it through the world-wide-web, please send an email
* to support@qloapps.com so we can send you a copy immediately.
*
* DISCLAIMER
*
* Do not edit or add to this file if you wish to upgrade this module to a newer
* versions in the future. If you wish to customize this module for your needs
* please refer to https://store.webkul.com/customisation-guidelines for more information.
*
* @author Webkul IN
* @copyright Since 2010 Webkul
* @license https://opensource.org/licenses/afl-3.0.php Academic Free License 3.0
*/

#booking_types_wrapper {
    width: 30%;
    margin: auto;
}

@media only screen and (min-width: 520px) and (max-width: 768px) {
  #booking_types_wrapper {
    width: 50%;
    margin: auto;
  }

  #search_form_booking_type {
    height: 50px !important;
  }
}


@media only screen and (max-width: 520px) {
  #booking_types_wrapper {
    width: unset;
    margin: auto;
  }

  #search_form_booking_type {
    height: 50px !important;
  }
}

@media only screen and (min-width: 769px) and (max-width: 1200px) {
  #search_form_booking_type {
    height: 50px !important;
  }
}

#search_form_booking_type {
    height: 42px;
    border-radius: 30px;
    display: flex;
    flex-direction: row;
    align-items: center;
}

#booking_types_wrapper .booking_type_text {
    font-size: 16px;
    font-weight: unset;
    color: #333;
    margin: unset;
    display: inline-flex;
    flex-direction: column-reverse;
    justify-content: space-around;
    cursor: pointer;
}

#booking_types_wrapper input[type='radio'] {
  cursor: pointer;
}

input[name="booking_type"] {
    width: 20px;
    height: 20px;
    margin: unset;
}

.booking_type_option {
    display: flex;
    /* justify-content: space-evenly; */
}

#search_hotel_block_form #id_hotel_button_hourly {
    appearance: none;
    width: 100%;
    padding-left: 35px;
    background: url("../../img/front/icon-hotel.svg") no-repeat 10px 50%, url("../../img/front/icon-dropdown-arrow.svg") no-repeat calc(100% - 10px) 50%;
    background-color: #FFF;
}

.header-rmsearch-wrapper .location_search_results_ul_hourly {
    position: absolute;
    font-size: 14px;
    z-index: 100;
    font-weight: 400;
    padding: 0px;
    width: 100%;
    box-shadow: 0 8px 25px -4px rgba(0,0,0,0.39);
    max-height: 145px;
    overflow-y: auto;
}
.header-rmsearch-wrapper .location_search_results_ul_hourly li {
    background-color: #fff;
    color: #333333;
    cursor: pointer;
    text-align: left;
    font-size: 14px;
    list-style: outside none none;
    padding: 15px;
}
.header-rmsearch-wrapper .location_search_results_ul_hourly li:hover, .header-rmsearch-wrapper .location_search_results_ul_hourly li:focus, .header-rmsearch-wrapper .location_search_results_ul_hourly li:active {
    background-color: #379bf0;
    color: #FFFFFF;
}

.header-rmsearch-wrapper .location_search_results_ul_hourly.top {
    top: unset;
    bottom: 55px;
}

.header-rmsearch-wrapper .location_search_results_ul_hourly.bottom {
    top: 100%;
}

#search_hotel_block_form #guest_occupancy_hourly {
    height: unset;
    text-align: unset;
}

#search_occupancy_wrapper_hourly {
  border: none;
  max-height: 400px;
  min-width: 280px;
  overflow: auto;
  box-shadow: 0 8px 25px -4px rgba(0,0,0,0.39);
  left: 0px;
  padding: 15px 20px;
}
#search_occupancy_wrapper_hourly.top {
top: unset;
bottom: 100%; }
#search_occupancy_wrapper_hourly.bottom {
top: 100%; }
#search_occupancy_wrapper_hourly .occupancy-info-separator {
margin-bottom: 15px;
margin-top: 15px;
margin-right: -20px;
  margin-left: -20px;}
#search_occupancy_wrapper_hourly .children_age_info_block {
display: none;}
#search_occupancy_wrapper_hourly .children_age_info_block label {
font-size: 12px;
color: #777777;}
#search_occupancy_wrapper_hourly label {
font-size: 14px;
color: #333333;
font-weight: 400;}
#search_occupancy_wrapper_hourly .add_new_occupancy_btn {
  font-weight: bold;
  text-decoration: none;
  font-size: 14px;
  color: #0000FF;}
  #search_occupancy_wrapper_hourly .occupancy_block_actions {
    display: flex;
    justify-content: space-between;
    align-items: center;}
  #search_occupancy_wrapper_hourly .add_new_occupancy_btn:active, #search_occupancy_wrapper_hourly .add_new_occupancy_btn:focus, #search_occupancy_wrapper_hourly .add_new_occupancy_btn:hover {
    text-decoration: none;
    color: #0000FF;}
#search_occupancy_wrapper_hourly .occupancy_info_head {
  font-size: 14px;
  color: #333333;
  font-weight: bold;
  margin-bottom: 10px;}
  #search_occupancy_wrapper_hourly .occupancy_info_head .remove-room-link {
    font-size: 12px;
    color: #FF4343;
    text-align: right;}
  #search_occupancy_wrapper_hourly .occupancy_info_block .occupancy_count {
    padding: 14px;
    border: 1px solid #E1E3E7;
    font-size: 14px;
    font-weight: 600;
    color: #333333;
    text-align: center;
    border-radius: 4px;}
  #search_occupancy_wrapper_hourly .occupancy_info_block .occupancy_count > span {
    min-width: 21px;
    text-align: center;
    display: block;}
  #search_occupancy_wrapper_hourly .occupancy_info_block .qty_direction {
    margin-left: 3px;
    width: 22px;}
    #search_occupancy_wrapper_hourly .occupancy_info_block .qty_direction a {
      padding: 1px 5px;
      border: 0px;
      border: 1px solid #E1E3E7;
      color: #333;
      border-radius: 4px;
      font-weight: 400;}
      #search_occupancy_wrapper_hourly .occupancy_info_block .qty_direction .occupancy_quantity_down {
        margin-top: 3px;}
      #search_occupancy_wrapper_hourly .occupancy-input-errors {
        font-weight: 700;}

  #search_occupancy_wrapper_hourly .children_ages {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 8px;
    justify-content: space-between;
  }
  #search_occupancy_wrapper_hourly .children_ages select {
    background-color: #fff;
    height: 37px;
    border-radius: 4px;
    padding: 3px 5px;
    font-size: 12px;
    color: #333;
    border: 1px solid #E1E3E7;
    width: 100%;}


@media (max-width: 411px) {
  #search_occupancy_wrapper_hourly .occupancy_info_block .occupancy_count_block {
    width: 100%;}
  #search_occupancy_wrapper_hourly .occupancy_info_block .occupancy_count {
      width: 80%;}
}

#search_hotel_block_form #search_room_submit_hourly {
  background-color: #1292FF;
  width: 100%;
  font-size: 13px;
  text-transform: uppercase;
  border: none;
  border-radius: 4px;
  height: unset;
  min-height: 55px;
}

#search_hotel_block_form .search_fixed_slots_container {
  border: none;
  left: 0;
  max-height: 200px;
  min-width: 210px;
  padding: 15px 0px;
  overflow: auto;
}

#search_hotel_block_form .search_fixed_slots_container button.selected_slot {
  background-color: #1292FF1A;
  border-radius: 4px;
  border: 1px solid #1292FF;
  background: rgba(18, 146, 255, 0.10);
}

#search_hotel_block_form .search_fixed_slots_container button {
border: none;
padding: 0px;
box-shadow: none;
text-align: center;
height: 45px;
}

#search_hotel_block_form .search_fixed_slots_container button span , .select-stay-duration-wrapper input {
  color: #333;
  font-size: 13px;
  font-style: normal;
  line-height: normal;
}


#search_hotel_block_form .form-control.input-hourly-time {

background: url(./../../img/front/clock.svg) no-repeat 8px 50%;
padding-left: 40px;
}

#search_hotel_block_form .form-control.input-hourly-time.hourly_time {

background: url(./../../img/front/clock.svg) no-repeat 10px 50%, url(./../../img/front/icon-dropdown-arrow.svg) no-repeat calc(100% - 10px) 50%;
padding-left: 35px;
padding-right: 20px;
background-color: #FFF;
}

#search_hotel_block_form .select-stay-duration-wrapper {
  border: none;
  left: 0;
  max-height: 400px;
  min-width: 300px;
  padding: 15px 0px;
}

#search_form_fields_wrapper_hourly .select-stay-duration-wrapper input {
  padding: 0px;
  box-shadow: none;
  text-align: left;
  height: 45px;
  border-radius: 4px;
}

#search_form_fields_wrapper_hourly .stay-duration-input:focus {
  border: 2px solid #1292FF;
}

#search_form_fields_wrapper_hourly .hb-time-slection-rmsearch-input{
  cursor: pointer;
}

/* chosen-drop top - start */
.time-slots-selector-wrap .chosen-container .chosen-drop.top .chosen-results {
  position: absolute;
  width: 100%;
  bottom: calc(100% + 2px);
}
.time-slots-selector-wrap .chosen-container.chosen-container-single-nosearch .chosen-drop.top .chosen-results {
  position: absolute;
  width: 100%;
  bottom: calc(100% + 55px);
}
/* chosen-drop top - end */

.time-slots-selector-wrap .chosen-container-single .chosen-single {
  background: #fff url('./../../img/front/clock.svg') no-repeat 7px 50% !important;
}

#hourly_time_slots_chosen.chosen-container-single .chosen-single {
  background: #fff url('./../../img/front/clock.svg') no-repeat 7px 50% !important;
}

#search_hotel_block_form #id_hotel_button_hourly {
  appearance: none;
  width: 100%;
  padding-left: 35px;
  padding-right: 20px;
  background: url("./../../img/front/icon-hotel.svg") no-repeat 10px 50%, url("./../../img/front/icon-dropdown-arrow.svg") no-repeat calc(100% - 10px) 50%;
  background-color: #FFF;
}

#search_hotel_block_form .booking_types_wrapper .chosen-container-single .chosen-single {
  min-height: 45px;
}

.submit_stay_duration_btn {
  height: unset;
  border :none;
  padding: 6px 12px;
  border-radius: 4px;
}