.error {
    color: #f00000;
    font-size: 14px;
}

#banner_booking .div-img-banner-innerpage {
    height: 220px;
    padding-top: 40px;
    display: block;
}
.booking-container {
    padding-bottom: 50px;
}

/* Pet lodge */
.select-pet-type-container {
    text-align: start;
    /* display: none; */
}

.booking-petlodge-container-inner {
    display: none;
}
.btn-add-pet button {
    background: none;
    border: none;
    color: #0c3858;
    font-weight: 600;
}
.btn-remove-pet {
    background: none;
    border: none;
}
.btn-remove-pet .fa-solid {
    font-size: 20px;
}
.pet-container {
    border-top: 1px solid rgb(0 0 0 / 25%);
}
/* searchform css */

div#card-booking-header-form-booking-page {
    width: 100%;
    max-width: 1150px;
    margin: auto;
    min-height: 130px;
    border: 1px solid #0f3857;
}
.booking-booking-header-form-container-inner {
    position: relative;
    margin: 0px 40px;
}
input#booking_start_date,
input#booking_end_date {
    border: 1px solid #104877;
}
#card-booking-header-form-booking-page i.fa-solid.fa-calendar,
#card-booking-header-form-booking-page i.fa-solid.fa-user {
    color: #104877;
}
#card-booking-header-form-booking-page span.input-group-text.bg-white,
#card-booking-header-form-booking-page .input-guest-num {
    border: 1px solid #104877 !important;
}

.form-container-inner {
    display: flex;
    flex-direction: row;
    justify-content: center;
    align-items: center;
    text-align: left;
}
.booking-booking-header-form-container .input-daterange {
    display: flex;
    flex-direction: row;
}
.booking-start-date {
    margin-right: 20px;
    width: 230px;
}
.booking-end-date {
    margin-right: 20px;
    width: 230px;
}
button#btn-booking-search {
    width: 120px;
    margin-left: 20px;
    height: 50px;
    margin-top: 15px;
}
input#booking_start_date,
input#booking_end_date {
    border: 1px solid #104877;
}
.btn-add-rooms {
    margin-top: 10px;
    margin-left: 15px;
    text-align: left;
}
.booking-tbody-guest-count tr td {
    border-bottom: none;
}
.booking-booking-header-form-container button.guest-count-btn {
    border: 1px solid #104877;
    background: white;
    width: 100%;
    min-height: 39px;
    height: auto !important;
    min-width: 250px;
    padding: 0 15px;
    border-radius: 5px;
    color: #4f4f4f;
}
#btn_add_rooms_booking {
    background: none;
    border: none;
    color: #0c3858;
    /* border-bottom: 1px solid #0c3858 !important; */
    /* padding-bottom: 5px; */
    font-weight: 600;
}
#modalBookingGuestCount .modal-body {
    overflow: scroll;
    max-height: 75vh;
    overflow-x: hidden;
    overflow-y: auto;
    padding: 10px;
}

.btn-see-selected-rooms-container button {
    display: none;
}
.active.booking-summary-item {
    background: #f9f9f9;
    border-radius: 10px;
    padding: 20px;
}
.booking-body .carousel-control-next,
.booking-body .carousel-control-prev {
    color: white !important;
    opacity: 0.9;
}
.booking-body .carousel-control-next:hover,
.booking-body .carousel-control-prev:hover {
    opacity: 1;
    color: white !important;
}

@media (max-width: 1200px) {
    .booking-end-date {
        width: 170px;
    }

    .booking-start-date {
        width: 170px;
    }
}
@media (max-width: 1056px) {
    button#btn-booking-search {
        width: 140px;
    }
}
@media (max-width: 1020px) {
    .inner-page-banner-container {
        padding-top: 0px;
    }
    .booking-booking-header-form-container {
        margin-top: 0px;
    }
}

@media (max-width: 992px) {
    .booking-container-inner .sort-container {
        flex-direction: column;
    }
    .btn-see-selected-rooms-container {
        margin-bottom: 15px;
        width: 200px;
    }
    .btn-see-selected-rooms-container button {
        /* display: block; */
        width: 100%;
    }
    .booking-container-inner {
        max-width: 100% !important;
        padding-left: 20px;
        padding-right: 20px;
    }

    .booking-booking-header-form-container .input-daterange {
        width: 100%;
    }

    .d-flex.flex-column.booking-guest-count-container {
        width: 100%;
    }
    .booking-start-date {
        width: 100%;
        margin-right: 10px;
    }

    .booking-end-date {
        width: 100%;
        margin-left: 10px;

        margin-right: 0px;
    }
    .booking-guest-count-container {
        margin-top: 15px;
    }
}

@media (max-width: 768px) {
    .booking-booking-header-form-container {
        width: 100%;
    }
    .booking-booking-header-form-container .input-daterange {
        flex-direction: column;
        width: 100%;
    }
    .booking-start-date {
        margin-right: 0px;
    }
    .booking-end-date {
        margin-left: 0px;
        margin-right: 0px;
    }
}
@media (max-width: 600px) {
    #booking-table-guest-count thead.bg-light {
        display: none;
    }
    #booking-table-guest-count tr.text-center.booking-trow-guest-count {
        display: inline-flex;
        flex-direction: column;
        width: 50%;
        justify-content: center;
        align-items: center;
        margin-bottom: 0px;
    }
}

@media (max-width: 550px) {
    .booking-booking-header-form-container {
        width: 100% !important;
    }
    .booking-booking-header-form-container button.guest-count-btn {
        min-width: 0;
    }
}

@media (max-width: 375px) {
    .booking-senior-checkbox {
        width: 24px;
    }
}

/* Booking Body header CSS */
button.booking-room-header-button {
    margin-top: 10px;
    padding: 5px 20px;
    background: none;
    border-radius: 5px;
    color: #145b8f;
    border: 1px solid #145b8f;
}

button.booking-hut-header-button {
    margin-top: 10px;
    padding: 5px 20px;
    background: none;
    border-radius: 5px;
    color: #145b8f;
    border: 1px solid #145b8f;
}

.booking-container-inner .sort-container {
    display: flex;
    align-items: end;
    justify-content: end;
}

.booking-container-inner .sort-container-inner {
    width: 100%;
}
.sort-container-inner select {
    border: 1px solid #104877;
    padding: 0 15px;
    border-radius: 5px;
    height: 35px;
    color: #4f4f4f;
}
button.active.booking-room-header-button {
    background: #145b8f;
    color: white;
}
button.active.booking-hut-header-button {
    background: #145b8f;
    color: white;
}
.accordion-button:not(.collapsed) {
    color: var(--bs-heading-color, inherit) !important;
}

.booking-body-header.sticked {
    position: sticky;
    top: 115px;
    z-index: 2;
}
.booking-body-header.sticked h2 {
    font-size: 24px;
}
.btn-see-selected-rooms-container {
    width: 100%;
}
@media (max-width: 992px) {
    .container.booking-container-inner {
        padding-top: 100px;
    }
}
@media (max-width: 768px) {
    .container.booking-container-inner {
        padding-top: 162px;
    }
    .booking-booking-header-form-container-inner {
        margin: 0px 20px;
    }
    .container.booking-container-inner {
        max-width: 100%;
        padding-left: 20px;
        padding-right: 20px;
    }
    .rate-container-item {
        display: block !important;
    }
    .rate-container-item
        .right
        .d-flex.flex-row.align-items-center.justify-content-center {
        justify-content: space-between !important;
    }
}
@media (max-width: 625px) {
    .btn-see-selected-rooms-container {
        width: 100%;
    }
    .booking-container-inner .sort-container-inner {
        width: 100%;
    }

    #collapseSelectRoomOneOne .col-7 {
        width: 100%;
    }
    #collapseSelectRoomOneOne .col-5 {
        width: 100%;
        margin-top: 30px;
    }
}
@media (max-width: 521px) {
    .container.booking-container-inner {
        padding-top: 172px;
    }
    .booking-booking-header-form-container button.guest-count-btn {
        height: 100%;
        min-height: 35px !important;
        padding: 15px;
    }
    .booking-body-header .card-body .col-7 {
        width: 100% !important;
    }
    .booking-body-header .card-body .col-5 {
        width: 100% !important;
        justify-content: start !important;
        align-items: start !important;
        margin-top: 25px;
        border-top: 1px solid #acacac;
        padding-top: 20px;
    }
}

@media (max-width: 475px) {
    .rate-container-item
        .right
        .d-flex.flex-row.align-items-center.justify-content-center {
        display: block !important;
        text-align: start;
    }
    .rate-container-item .price {
        text-align: left !important;
    }
    .price-right {
        margin-top: 15px;
    }
    .price-right button {
        width: 100%;
    }
}

/* Booking body css 1*/
/* .booking-body .text-container i.fa-solid {
  margin-right: 7px;
}
.rate-container .room-price {
  font-size: 25px;
}
.rate-container .room-price {
  font-size: 25px;
}
.price-container {
  display: flex;
  align-items: center;
}

.per-night {
    margin-left: 5px;
}

.rate-container .nav-pills .nav-link {
  background: none;
  border-radius: 0;
} */

/* Booking body css 2*/
.booking-rooms-card {
    border: 1px solid #0e446a;
    border-radius: 10px;
}

.booking-body .text-container i.fa-solid {
    margin-right: 7px;
    width: 20px;
}
.list-room-desc li {
    margin-bottom: 2px;
}
.price-left {
    margin-right: 20px;
}
.rate-container-item .price {
    font-weight: 600;
    font-size: 25px;
    text-align: right;
}
.rate-container-item .price-dec {
    font-size: 14px;
    color: #6f6f6f;
}
.custom-btn-select {
    border: 1px solid;
    background: #f7f7f7;
}
.custom-btn-select:hover {
    background: white;
}
.booking-rooms-card img {
    border-radius: 10px !important;
    object-fit: cover;
    height: 250px;
    width: 100% !important;
}

/* Booking body right */
.btn-rate-remove-room {
    background: none;
    border: none;
    color: #dc4c64;
    font-size: 20px;
}
.rate-room-desc {
    font-size: 14px;
    color: #6f6f6f;
}
.rate-room-price {
    /* font-size: 18px; */
}
.rate-extra-guest-price {
    /* font-size: 18px; */
}
.rate-room-title {
    font-weight: 600;
    font-family: "Poppins", sans-serif !important;
    font-size: 20px;
}
.rate-room-name {
    /* font-size: 18px; */
    font-weight: 600;
}
.rate-extra-guest-name {
    /* font-size: 18px; */
    font-weight: 600;
}
.rate-room-container,
.rate-extra-guest-container {
    display: none !important;
}
.btn-rate-remove-room {
    display: none;
}
.select-room-msg-container-inner {
    height: 70px;
    display: flex;
    align-items: center;
    justify-content: center;
}
.select-room-msg-container p {
    font-size: 16px;
    font-weight: 600;
    margin-bottom: 0;
}
.booking-summary-total-inner {
    /* display: none !important; */
}
.booking-summary-item {
    margin-bottom: 10px;
}
.active.booking-summary-item {
    background: #f9f9f9;
    border-radius: 10px;
}
.booking-summary-container-sticked {
    position: -webkit-sticky;
    top: calc(170px + 1.5rem);
}

/* .custom-sticky {
    top: 0 !important;
} */

/* Booking page2 */
.booking2-container .check-in-date {
    width: 20%;
}
.booking2-container .check-out-date {
    width: 20%;
}
.booking2-container .guest-count {
    width: 35%;
}
.booking2-container .edit-stay {
    width: 25%;
}

.payment-room-container {
}
.payment-room-container .payment-room-img {
    width: 100%;
    border-radius: 10px;
}

.custom-hr-payment {
}
.payment-total-amount-label {
    font-size: 20px;
}
.payment-total-amount {
    font-size: 20px;
}

.gcash-image-container button {
    background: none;
    border: none;
    border-radius: 10px;
    width: 100%;
}
.gcash-image-container button:hover {
    background-color: #e2e2e2;
}
.gcash-image-container .gcash-image {
    width: 100%;
}
.card-image-container .cards-image {
    width: 100%;
    max-width: 55px !important;
    object-fit: scale-down;
    height: 55px;
    margin: 10px 5px;
}
.col-md-6.d-flex.cards-image-container.flex-column {
    justify-content: center;
    align-items: center;
}

#btn_payment_card {
    background: none;
    border: none;
    border-radius: 10px;
    width: 100%;
}
#btn_payment_card:hover {
    background-color: #e2e2e2;
}

#btn_payment_others {
    background: none;
    border: none;
    border-radius: 10px;
    width: 100%;
    height: 55px;
    color: #0e446a;
    font-weight: 600;
}
#btn_payment_others:hover {
    background-color: #e2e2e2;
}

button.btn-payments.active {
    border: 2px solid #145b8f !important;
}