.cozy-header-rmsearch-container {
  position: absolute;
  bottom: 0;
  left: 0;
  right: 0;
  z-index: 5005;
  margin-bottom: -54px !important;
  margin-top: -54px !important;
  padding: 0 calc(calc(100/ 32)*2vw) !important;
}

/* .header-rmsearch-hide-xs {
  background-image: url("../img/black-opacity-5.png");} */
.cozy-header-rmsearch-show-xs {
  background-color: #ffffff;
  top: 0;}
.cozy-header-rmsearch-wrapper {
  display: table;
  height: 100%;
  width: 100%;}
.cozy-header-rmsearch-primary {
  display: table-cell;
  vertical-align: middle;}
.cozy-header-rmsearch-primary .container {
    max-width: calc(1300px + calc(calc(100 / 32) * 2vw) * 2);
}
.cozy-header-rmsearch-inner-wrapper {
  padding: 30px;
background-color: #53624E !important;}
@media (max-width: 767px) {
  .cozy-header-rmsearch-wrapper #cozy-search_hotel_block_form .grid {
    grid-template-columns: 1fr;
    column-gap: 0px;
  }
  .cozy-header-rmsearch-wrapper {
    height: calc(100vw - 60px);
    width: calc(100vw - 60px);
  }
}
.cozy-fancy_search_header_xs {
  margin-top: 25px;
  padding-left: 15px;
  padding-right: 15px;
  text-align: left;
  font-size: 22px;}
.cozy-fancy_search_header_xs hr {
    border: 1px solid #379bf0;
    float: left;
    margin-top: 5px;
    width: 125px;}
.cozy-booking-form {
    display: flex;
    flex-wrap: wrap;
    align-items: stretch;
    justify-content: center;
    gap: 10px;
}

.cozy-booking-form label {
  margin-bottom: 0 !important;
}

.cozy-form-group {
    border: 1px solid #c4a978;
    padding: 10px 14px;
    background: transparent;
    color: #fff;
    font-size: 14px;
    flex: 1;
    min-width: 180px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
    margin-bottom: 0 !important;
    width: 20%;
    box-sizing: border-box; 
}

#room-box {
    position: relative;
}

.cozy-form-group label {
    font-size: 16px;
    color: #fff;
    font-weight: 500;
    white-space: nowrap;
    flex-shrink: 0;
    font-family: 'Marcellus', serif;
}

.cozy-form-group span,
#check_in,
#check_out {
    color: #fff;
    font-size: 14px;
    font-weight: 500;
    white-space: nowrap;
    flex-shrink: 0;
    font-family: 'Jost', serif;
}

.cozy-form-group input,
.cozy-form-group select {
    background: transparent;
    border: none;
    outline: none;
    color: #fff;
    font-size: 14px;
    cursor: pointer;
    flex: 1;
    min-width: 0;
    text-align: right;
}

/* Dropdown cho Rooms */
.cozy-dropdown {
  display: none;
  position: absolute;
  top: 100%;
  left: 0;
  background: #f6f6f0;
  border: 1px solid #c4a978;
  padding: 15px;
  z-index: 100;
  min-width: 200px;
}

.cozy-dropdown.active {
  display: block;
}

.cozy-dropdown .row1 {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin: 5px 0;
}

.cozy-dropdown button {
    position: relative;
    background: none;
    border: none;
    box-shadow: none;
    outline: none;
    width: 30px;
    height: 30px;
    padding: 0;
    color: inherit;
    text-align: center;
    line-height: 30px;
    cursor: pointer;
    color: #000;
}

/* Popup Box */
.popup-box {
  display: none;
  position: absolute !important;
  top: calc(100% + 10px);
  left: 0;
  background: #f9f7f3;
  border: 1px solid #c4a978;
  padding: 30px;
  box-shadow: 0 2px 8px rgba(0,0,0,0.1);
  z-index: 100;
  min-width: 320px;
  margin-top: 8px;
}

.popup-box .row1 span  {
    color: #000;
    font-size: 16px;
    font-weight: 400;
    font-family: 'Marcellus', serif;
}

.popup-box::before {
  content: "";
  position: absolute;
  top: -7px;
  left: 30px;
  border-width: 0 6px 7px 6px;
  border-style: solid;
  border-color: transparent transparent #f9f7f3 transparent;
}

.popup-box::after {
    content: "";
    position: absolute;
    top: -7px;
    left: 30px;
    border-width: 0 6px 7px 6px;
    border-style: solid;
    border-color: transparent transparent #f9f7f3 transparent;
}
.popup-box.active {
  display: block;
}

.cozy-form-group select option {
    background: #4a5c49;
    color: #fff;
}

.cozy-btn {
    background: #c4a978;
    border: none;
    color: #fff;
    font-size: 14px;
    padding: 14px 24px;
    cursor: pointer;
    transition: 0.3s;
    flex-shrink: 0;
    width: 20%; 
}

.cozy-btn:hover {
    background: #ab916c;
    color: #fff;
    border-color: #ab916c;
}

@media (max-width: 991px) {
  .cozy-booking-form {
      display: grid;
      grid-template-columns: 1fr 1fr;
      gap: 10px;
  }
  .cozy-booking-form .cozy-form-group {
      width: 100%;
  }

  .cozy-btn {
      grid-column: span 2;
      width: 100%;
      text-align: center;
  }
}

@media (max-width: 767px) {
  .cozy-booking-form {
      grid-template-columns: 1fr;
  }

  .cozy-btn {
      grid-column: span 1;
  }
}


.cozy-btn {
    display: flex;
    align-items: center;
    justify-content: center;
    height: 100%;
}

.cozy-form-group, 
.cozy-btn {
    min-height: 48px;
}

#guest-box {
    position: relative;
}

.guest-quantity {
    display: flex;
    align-items: center;
    gap: 8px;
}

.guest-quantity button {
    width: 30px;
    height: 30px;
    border: none;
    background: none;
    color: #000;
    cursor: pointer;
    font-size: 16px;
    line-height: 30px;
}

.guest-quantity span {
    min-width: 20px;
    text-align: center;
    font-size: 14px;
    color: #000;
}

#adult-count, 
#child-count,
#room-count {
    color: #000;
    font-size: 16px;
    font-weight: 400;
    font-family: 'Jost', sans-serif;
}
/* Khung popup */
.cozy-booking-form .date-picker-wrapper {
  background: #f9f7f3 !important;
  border: 1px solid #c4a978 !important;
  padding: 12px !important;
  font-family: Arial, sans-serif;
  font-size: 14px;
}
.cozy-booking-form .date-picker-wrapper * { box-sizing: border-box; }

.cozy-booking-form .date-picker-wrapper .drp_top-bar { display: none !important; }

.cozy-booking-form .date-picker-wrapper .month-wrapper {
  display: flex !important;
  gap: 0;
  padding: 0 8px 8px;
}

.cozy-booking-form .date-picker-wrapper .month-name {
  text-align: center !important;
  font-weight: 700 !important;
  padding: 6px 0 10px !important;
  font-size: 16px !important;
  font-family: Arial !important;

}

.cozy-booking-form .date-picker-wrapper .week-name th {
  color: #000;
  font-weight: 700;
  padding: 8px 0 6px;
  font-size: 12px;
  font-family: Arial;
  text-transform: unset !important;
}

.cozy-booking-form .date-picker-wrapper .day {
  width: 36px;
  height: 36px;
  line-height: 36px;
  margin: 2px;
  text-align: center;
  border-radius: 6px;
  cursor: pointer;
  transition: background .2s, color .2s;
}
.cozy-booking-form .date-picker-wrapper .day:hover { background: #f5f5f5; }

.cozy-booking-form .date-picker-wrapper .day.invalid {
  color: #d0d0d0 !important;
  cursor: not-allowed;
  background: transparent !important;
}

.cozy-booking-form .date-picker-wrapper .day.checked:not(.first-date-selected):not(.last-date-selected) {
  background: rgba(196,154,108,.22) !important;
  color: #333 !important;
  border-radius: 6px;
}

.cozy-booking-form .date-picker-wrapper .day.first-date-selected,
.cozy-booking-form .date-picker-wrapper .day.last-date-selected {
  background: #c49a6c !important;   /* nâu vàng */
  color: #fff !important;
  border-radius: 6px;
}

.cozy-booking-form .date-picker-wrapper .day.hovering {
  background: rgba(196,154,108,.15) !important;
}

.cozy-booking-form .date-picker-wrapper .prev,
.cozy-booking-form .date-picker-wrapper .next {
  width: 28px; height: 28px;
  border-radius: 999px;
  background: #f1f1f1;
  display: flex; align-items: center; justify-content: center;
  position: absolute; top: 12px;
  user-select: none;
}
.cozy-booking-form .date-picker-wrapper .prev { left: 10px; }
.cozy-booking-form .date-picker-wrapper .next { right: 10px; }

.cozy-booking-form .month-wrapper {
    width: auto !important;
}

.cozy-booking-form .date-picker-wrapper.bottom {
    left: 0 !important;
    top: 50px !important;
 }
.cozy-booking-form .date-picker-wrapper .month-wrapper table .week-name {
    text-transform: unset !important;
 }