/* FMTTM - Vik Booking custom styling */

/* Room price */
.vblistroomnamedivprice .vbo_price,
.vblistroomnamedivprice .vbo_currency {
    color: #053037 !important;
    font-weight: 600;
}

/* Preferred background colours */
.vbo-pref-color-bg {
    background-color: #053037 !important;
}

/* FMTTM - Guest capacity icons */

.vbmaximgdet.vbo-rdetailacity-icon i,
.vbo-rdetailacity-icon i {
    background-color: #053037 !important;
}

/* FMTTM - Vik Booking brand colours */

:root {
    --vbo-pref-textcolor: #053037;
    --vbo-pref-bgcolor: #053037;
    --vbo-pref-fontcolor: #ffffff;
    --vbo-pref-bgcolorhov: #0a4851;
    --vbo-pref-fontcolorhov: #ffffff;
}

/* FMTTM - Force Vik Booking teal colours */

body .vbmaxadultsdet .vbmaximgdet i,
body .vbmaxchildrendet .vbmaximgdet i,
body .vbo-details-capacity-icn {
    background-color: #053037 !important;
}

/* Vik Booking booking buttons */
body .vbo-bookingpart-form button,
body .vbo-bookingpart-form input[type="submit"] {
    background-color: #053037 !important;
    border-color: #053037 !important;
    color: #ffffff !important;
}

/* FMTTM - Total People icon */
body .vbmaxtotdet .vbmaximgdet i,
body .vbmaxtotdet .vbo-details-capacity-icn,
body .vbmaxminpeopleroom .vbmaxtotdet .vbmaximgdet i {
    background-color: #053037 !important;
}

/* FMTTM - Total People icon */
body .vbmaxtotdet .vbmaximgdet i,
body .vbmaxtotdet .vbo-details-capacity-icn {
    background-color: #053037 !important;
}

/* FMTTM - Book Now button */

body input[type="submit"].vbdetsbooksubmit.vbo-pref-color-btn {
    background: #053037 !important;
    background-color: #053037 !important;
    border: none !important;
    color: #ffffff !important;

    height: 44px !important;
    min-height: 44px !important;
    line-height: normal !important;
    padding: 0 24px !important;
    margin-top: 25px;
    text-align: center !important;
    vertical-align: middle !important;
    box-sizing: border-box !important;
}

body input[type="submit"].vbdetsbooksubmit.vbo-pref-color-btn:hover {
    background: #0a4851 !important;
    background-color: #0a4851 !important;
}

/* FMTTM - Final room booking button styling */

body .vbo-listing-details-wrap
.vbo-listing-details-divsearch
.vbo-search-submit input.btn.vbdetsbooksubmit {
    background: #053037 !important;
    background-color: #053037 !important;
    border: none !important;
    color: #ffffff !important;

    height: 44px !important;
    min-height: 44px !important;
    line-height: 44px !important;
    padding: 0 24px !important;

    text-align: center !important;
    box-sizing: border-box !important;
    border-radius: 6px !important;
}

body .vbo-listing-details-wrap
.vbo-listing-details-divsearch
.vbo-search-submit input.btn.vbdetsbooksubmit:hover {
    background: #0a4851 !important;
    background-color: #0a4851 !important;
}

/* FMTTM - Book Now button */

.vbo-search-submit input.vbdetbooksubmit {
    background-color: #053037 !important;
    background-image: none !important;
    color: #ffffff !important;
    height: 44px !important;
    line-height: normal !important;
    padding: 0 24px !important;
    box-sizing: border-box !important;
}

/* Button hover */
.vbo-search-submit input.vbdetbooksubmit:hover {
    background-color: #0A4850 !important;
    color: #ffffff !important;
}

/* FMTTM - Booking panel backgrounds */

/* Outer booking panel */
.vbo-listing-details-costroomdet {
    background-color: #FFFFFF !important;
}

/* Inner booking panel */
.vbo-listing-details-costroomdet-inner {
    background-color: #FFFFFF !important;
}

/* Room description - match page background */
.vbo-rdet-desc-cont.vbo-listing-details-desc-cont {
    background-color: #F6F6F6 !important;
    padding: 30px !important;
    box-sizing: border-box !important;
}

/* Room booking panel - white background and rounded corners */
.vbo-listing-details-costroomdet {
    background-color: #FFFFFF !important;
    border-radius: 12px !important;
    overflow: hidden;
}

/* Centre Book Now button in booking panel */
.vbo-listing-details-costroomdet .vbo-search-submit {
    display: flex !important;
    justify-content: center !important;
    align-items: center !important;
}

/* Book Now button appearance */
.vbo-listing-details-costroomdet input.vbdetbooksubmit {
    display: block !important;
    width: 100% !important;
    max-width: 320px !important;
    margin: 25px auto 0 !important;
    background: #053037 !important;
    color: #FFFFFF !important;
    height: 44px !important;
    line-height: 44px !important;
    padding: 0 20px !important;
    box-sizing: border-box !important;
    text-align: center !important;
}

/* Fix vertical alignment of Book Now text */
.vbo-listing-details-costroomdet .vbo-search-submit input.vbdetbooksubmit {
    height: 44px !important;
    line-height: normal !important;
    padding: 0 20px !important;
    vertical-align: middle !important;
    box-sizing: border-box !important;
}

/* FMTTM - Full-width single-month availability calendar */

.vbcalsblock.vbcalsblock-price {
    display: block !important;
    width: 100% !important;
    max-width: none !important;
}

.vbcalsblock.vbcalsblock-price > .vbcaldivcont {
    display: block !important;
    width: 100% !important;
    max-width: none !important;
}

.vbcalsblock.vbcalsblock-price table.vbcalprice {
    width: 100% !important;
    max-width: none !important;
    table-layout: fixed !important;
}

/* FMTTM - Calendar price labels in dark teal */
.vbcalsblock-price .vbcalpricedaycost div {
    color: #053037 !important;
    border-color: #053037 !important;
}

/* FMTTM - Force amenity icons to dark teal */
.vbo-listing-details-wrap
.vbo-listing-details-desc-cont
.vbo-listing-amenities
.vbo-listing-amenity i.vbo-pref-color-text {
    color: #053037 !important;
}

/* FMTTM - Breakfast included text in dark teal */
.vbo-listing-details-costroomdet .roomcustcost-subtxt {
    color: #053037 !important;
}

/* FMTTM - Preserve gallery image proportions */
.vikfx-gallery-container img.vikfx-gallery-image {
    object-fit: cover !important;
    object-position: center center !important;
}

/* FMTTM - Main gallery image aspect ratio */
.vikfx-gallery-container .vikfx-gallery-image {
    aspect-ratio: 16 / 9 !important;
    object-fit: cover !important;
    height: auto !important;
}
/* FMTTM - Responsive room gallery height */
.vikfx-gallery-container.vikfx-roomdetails-gallery-container {
    aspect-ratio: 32 / 9 !important;
    height: auto !important;
}
/* FMTTM - Maintain 16:9 proportions for main gallery image */
.vbo-listing-details-wrap .vikfx-gallery-fade-container {
    aspect-ratio: 16 / 9 !important;
    width: 100% !important;
}

/* FMTTM - Remove main gallery image height restriction */
.vbo-listing-details-wrap .vikfx-gallery-fade-container img {
    max-height: none !important;
}

/* FMTTM - Clarify room pricing */

/* Replace "Starting From" with "From" */
.vbo-listing-details-wrap .vbliststartfromrdet {
    font-size: 0 !important;
}

.vbo-listing-details-wrap .vbliststartfromrdet::after {
    content: "From";
    font-size: 16px;
}

/* FMTTM - Pricing information directly below room rate */
.vbo-listing-details-wrap .vblistroomname::after {
    content: "Per night · Based on 2 guests";
    display: block;
    font-size: 14px;
    font-weight: 500;
    line-height: 1.5;
    color: #053037;
    margin-top: 5px;
}

/* Place breakfast beneath occupancy information */
.vbo-listing-details-wrap .vblistroomname {
    display: flex;
    flex-direction: column;
}

.vbo-listing-details-wrap .roomcustcost-subtxt {
    order: 3;
    margin-top: 6px;
}

/* FMTTM - Erica Room single occupancy pricing */
html.fmtm-erica-room
.vbo-listing-details-wrap
.vblistroomname::after {
    content: "Per night · Based on 1 guest" !important;
}


/* FMTTM - Calendar pricing explanation */

.vbo-listing-details-wrap .vbpricecalwarning {
    font-size: 0 !important;
    font-style: normal !important;
    margin: 8px 0 15px !important;
}

/* Default - two guests */
.vbo-listing-details-wrap .vbpricecalwarning::after {
    content: "Calendar prices are per night for 2 guests. Your final rate may vary depending on guest numbers and length of stay.";
    display: block;
    font-size: 13px;
    line-height: 1.5;
    color: #555555;
}

/* Erica Room - one guest */
html.fmtm-erica-room
.vbo-listing-details-wrap .vbpricecalwarning::after {
    content: "Calendar prices are per night for 1 guest. Your final rate may vary depending on length of stay.";
}


/* FMTTM - Aloe Villa self-catering label */
body.page-id-3411 .vbo-listing-details-costroomdet .vblistroomname::after {
    content: "Per night · Based on 2 guests\A Self-Catering Accommodation" !important;
    white-space: pre-line !important;
    line-height: 1.7 !important;
}


/* FMTTM - Booking search calendar selected dates */
.ui-datepicker-calendar td.checkin-date > *,
.ui-datepicker-calendar td.checkout-date > *,
.ui-datepicker-calendar td .ui-state-highlight,
.ui-datepicker-calendar td.ui-datepicker-current-day > * {
    background: #053037 !important;
    background-color: #053037 !important;
    border-color: #053037 !important;
    color: #FFFFFF !important;
}

/* FMTTM - Date picker Close button */
.ui-datepicker .vbo-drp-command-close button {
    background: #053037 !important;
    background-color: #053037 !important;
    border-color: #053037 !important;
    color: #FFFFFF !important;
}

/* Hover state */
.ui-datepicker .vbo-drp-command-close button:hover {
    background: #0B4A52 !important;
    background-color: #0B4A52 !important;
    border-color: #0B4A52 !important;
    color: #FFFFFF !important;
}

/* FMTTM - Booking search button */
.vbo-search-submit > button.btn.vbo-pref-color-btn {
    background: #053037 !important;
    background-color: #053037 !important;
    border-color: #053037 !important;
    color: #FFFFFF !important;
}

/* Hover state */
.vbo-search-submit > button.btn.vbo-pref-color-btn:hover {
    background: #0B4A52 !important;
    background-color: #0B4A52 !important;
    border-color: #0B4A52 !important;
    color: #FFFFFF !important;
}

/* FMTTM - Booking progress indicator */

/* Completed and current step circles */
.vbo-stepbar .vbo-step-complete::before,
.vbo-stepbar .vbo-step-current::before {
    background: #053037 !important;
    border-color: #053037 !important;
}

/* Current step circle: white centre */
.vbo-stepbar .vbo-step-current::before {
    background: #FFFFFF !important;
    border: 2px solid #053037 !important;
}

/* Progress line */
.vbo-stepbar::before,
.vbo-stepbar::after {
    background-color: #053037 !important;
}

/* FMTTM - Booking progress line */
ol.vbo-stepbar li.vbo-step-complete,
ol.vbo-stepbar li.vbo-step-current {
    border-bottom: 4px solid #053037 !important;
}

/* FMTTM - Booking results summary icons */
.vbo-results-head .vbo-pref-color-text {
    color: #053037 !important;
}

/* FMTTM - Change Dates button */
.vbo-results-chdates a.vbo-pref-color-btn-secondary {
    background: #053037 !important;
    background-color: #053037 !important;
    border-color: #053037 !important;
    color: #FFFFFF !important;
}

/* Hover state */
.vbo-results-chdates a.vbo-pref-color-btn-secondary:hover {
    background: #0B4A52 !important;
    background-color: #0B4A52 !important;
    border-color: #0B4A52 !important;
    color: #FFFFFF !important;
}

/* FMTTM - Room selection buttons */
button.vbselectr-result.vbo-pref-color-btn {
    background: #053037 !important;
    background-color: #053037 !important;
    border-color: #053037 !important;
    color: #FFFFFF !important;
}

/* FMTTM - Room amenities icons */
.vbo-room-carats .vbo-room-carat,
.vbo-room-carats .vbo-room-carat i,
.vbo-room-carat,
.vbo-room-carat i {
    color: #053037 !important;
}

/* FMTTM - Recolour only highlighted occupancy icons */
.vbo-results-wrapper .vbrowroomcapacity i.vbo-pref-color-text,
.vbo-results-wrapper .vbrowroomcapacity i.vbo-pref-color-text::before {
    color: #053037 !important;
}

/* FMTTM - Change Dates button: normal state */
a.vbo-goback-link.vbo-pref-color-btn-secondary {
    background: transparent !important;
    border: 1px solid #053037 !important;
    color: #053037 !important;
}

/* FMTTM - Change Dates button: hover state */
a.vbo-goback-link.vbo-pref-color-btn-secondary:hover,
a.vbo-goback-link.vbo-pref-color-btn-secondary:focus {
    background: #053037 !important;
    border-color: #053037 !important;
    color: #FFFFFF !important;
}

/* FMTTM - Guest icons on booking Options step */
.vbo-showprc-staydetails-party i.vbo-pref-color-text,
.vbo-showprc-staydetails-party i.vbo-pref-color-text::before {
    color: #053037 !important;
}

/* FMTTM - Rate prices on booking Options step */
.vbo-showprc-price-entry-cost,
.vbo-showprc-price-entry-cost .vbo_currency,
.vbo-showprc-price-entry-cost .vbo_price {
    color: #053037 !important;
}

/* FMTTM - Rate plan selection radio buttons */
.vbo-showprc-price-entry input[type="radio"] {
    accent-color: #053037 !important;
}

/* FMTTM - Booking confirmation room name */
.vbo-oconfirm-roomname.vbo-pref-color-text {
    color: #053037 !important;
}

/* FMTTM - Coupon box border and rounded corners */
.vbo-coupon-outer {
    border-color: #053037 !important;
    border-radius: 8px !important;
}

/* FMTTM - Centre coupon Apply button text */
input.vbsubmitcoupon.vbo-pref-color-btn {
    height: 40px !important;
    line-height: 40px !important;
    padding: 0 18px !important;
    box-sizing: border-box !important;
    vertical-align: middle !important;
}

/* FMTTM - Payment method radio buttons */
.vbo-oconfirm-paymethods-list input[type="radio"] {
    accent-color: #053037 !important;
}

/* FMTTM - Selected payment method border */
.vbo-oconfirm-paymethods-list
.vbo-oconfirm-paymethod-item-active {
    border-color: #053037 !important;
}

/* FMTTM - Selected payment method checkmark */
.vbo-oconfirm-paymethods-list
.vbo-oconfirm-paymethod-item-active::before {
    background-color: #053037 !important;
    border-color: #053037 !important;
}
/* FMTTM - Fix international telephone flags */
body .iti__flag {
    background-image: url("https://flymetothemoonguesthouse.com/wp-content/plugins/vikbooking/site/resources/images/flags.png") !important;
    background-size: auto !important;
}

/* High-resolution screens */
@media (-webkit-min-device-pixel-ratio: 2), (min-resolution: 192dpi) {
    body .iti__flag {
        background-image: url("https://flymetothemoonguesthouse.com/wp-content/plugins/vikbooking/site/resources/images/flags@2x.png") !important;
        background-size: 5630px 15px !important;
    }