body.SiteBackground{background-image:url('https://resx.octorate.com/content/996027/1785174032881.jpg')}@media (min-width: 1220px) {.SearchLabel .fa{background:#30390c;color:#fff}}.BoxHover:hover{box-shadow:1px 1px 10px #30390c}.SearchBar .GreenButton .ui-button-text{background-color:#30390c}.SiteTopBar{background-color:rgba(48,57,12,0.8)}:root{--color:#30390c!important;--color-rotation:70.89339464913091deg!important;}.button, .button span.ui-button-text, .customButton span.ui-button-text{background-color:#30390c!important;}/* ===== OVERVIEW RESULTS PAGE ===== */

/* Hide ALL property-group header panels */
div.OtherSolution > div.OtherSolutionHead {
    display: none !important;
    visibility: hidden !important;
    height: 0 !important;
    min-height: 0 !important;
    max-height: 0 !important;
    margin: 0 !important;
    padding: 0 !important;
    overflow: hidden !important;
}

/* Always show the actual accommodation cards */
div.OtherSolution > div.OtherSolutionBody {
    display: block !important;
    visibility: visible !important;
    height: auto !important;
    margin: 0 !important;
}
/* ===== ACCOMMODATION CARDS ===== */

/* Give each accommodation result a cleaner card feel */
.OtherSolutionBody > div {
    background: #fff !important;
    margin-bottom: 18px !important;
    overflow: hidden !important;
}

/* Make headings clearer */
.OtherSolutionBody h1,
.OtherSolutionBody h2,
.OtherSolutionBody h3,
.OtherSolutionBody h4 {
    font-weight: 700 !important;
    line-height: 1.1 !important;
    margin-bottom: 6px !important;
}

/* Improve general readability inside the accommodation results */
.OtherSolutionBody p,
.OtherSolutionBody span,
.OtherSolutionBody div {
    line-height: 1.35;
}

/* Make the main green action buttons more obvious */
.OtherSolutionBody button,
.OtherSolutionBody .ui-button {
    font-weight: 700 !important;
    padding: 12px 18px !important;
    min-height: 46px !important;
}

/* Add a little more breathing room around the text side */
.OtherSolutionBody .Pad10,
.OtherSolutionBody .Pad15,
.OtherSolutionBody .Pad20 {
    padding: 18px !important;
}

/* ===== PROPERTY CARD IMAGE / DETAILS SPLIT ===== */

/* Desktop: reduce photo width and give more space to booking details */
@media screen and (min-width: 769px) {

    .RoomTop.flex {
        display: flex !important;
        align-items: stretch !important;
    }

    .RoomTop.flex > .RoomPhoto {
        width: 45% !important;
        flex: 0 0 45% !important;
        max-width: 45% !important;
    }

    .RoomTop.flex > .details.big {
        width: 55% !important;
        flex: 1 1 55% !important;
        max-width: 55% !important;
        box-sizing: border-box !important;
    }
}

/* ===== REMOVE URGENCY MESSAGE ===== */

.RoomTop .label .DispBlock.MarTop5.Red {
    display: none !important;
}

/* ===== PRICE PANEL FIX ===== */

/* Let the price panel sit properly inside the details column */
.RoomTop .details.big .PriceChange {
    width: auto !important;
    max-width: none !important;
}

/* Override Octorate's hard-coded 20% width */
.RoomTop .details.big .PriceChange > span {
    width: 24% !important;
    min-width: 150px !important;
    max-width: 180px !important;
    box-sizing: border-box !important;
}

/* Keep the actual price box contained */
.RoomTop .details.big .offer {
    width: 100% !important;
    box-sizing: border-box !important;
}

.RoomTop .details.big .box {
    width: 100% !important;
    box-sizing: border-box !important;
}

/* ===== SHOW OFFERS BUTTON ===== */

/* Keep the CTA neatly contained on the right */
.RoomTop .ClickStop_offers {
    display: flex !important;
    justify-content: flex-end !important;
    margin-top: 18px !important;
    margin-right: 0 !important;
}

/* Make the clickable area feel more like a proper booking button */
.RoomTop .ClickStop_offers > a {
    display: inline-block !important;
    text-decoration: none !important;
}

/* Style the visible Show offers block */
.RoomTop .ClickStop_offers [class*="optionsDiv"] {
    min-width: 150px !important;
    padding: 14px 18px !important;
    box-sizing: border-box !important;
    text-align: center !important;
    font-weight: 700 !important;
}

/* ===== SIMPLIFY TOP SEARCH HEADER ===== */

/* Hide Destination */
#SiteHeader\:destinationSelection {
    display: none !important;
}

/* Hide Category */
#SiteHeader\:categorySelection {
    display: none !important;
}

/* Hide Coupon */
#terzoDiv .discount {
    display: none !important;
}

/* Tighten the right-hand search controls after removing extras */
#terzoDiv {
    gap: 1.25rem !important;
}

/* Give the useful search controls a little more room */
#dateAndPax {
    flex: 1 1 auto !important;
}

/* ===== REMOVE SUMMARY STRIP ===== */

/* Hide the row containing Official Website / Amount / Property count */
.animatedParent > div[title="Show Details"]:has(#stickyPanel) {
    display: none !important;
}

/* ===== REMOVE LOGIN / MY RESERVATION ===== */

#terzoDiv a[title="My Reservation"],
#terzoDiv a[title="My Reservation"] + p {
    display: none !important;
}

/* ===== TIGHTEN TOP HEADER ===== */

/* Slightly reduce vertical bulk */
.customHeaderLeft,
.customHeaderRight {
    padding-top: 8px !important;
    padding-bottom: 8px !important;
}

/* Tighten spacing between the useful search controls */
#dateAndPax {
    gap: 2rem !important;
}

/* Keep Search visually prominent */
#terzoDiv button.headerButton {
    min-height: 46px !important;
    padding: 0 24px !important;
    font-weight: 700 !important;
}

/* ===== AVAILABILITY BUTTONS ===== */

/* Make Availability buttons fit the Peak and Dale colour scheme */
.customButtonBlue {
    background: #ffffff !important;
    border: 2px solid #0b5d2a !important;
    color: #0b5d2a !important;
    box-shadow: none !important;
}

/* Octorate colours the text separately */
.customButtonBlue .ui-button-text {
    background: transparent !important;
    color: #0b5d2a !important;
}

/* Hover state */
.customButtonBlue:hover {
    background: #0b5d2a !important;
    border-color: #0b5d2a !important;
}

.customButtonBlue:hover .ui-button-text {
    color: #ffffff !important;
}

/* ===== COMPACT AVAILABILITY CALENDAR ===== */

/* Make each calendar tile substantially shallower */
li.available {
    min-height: 0 !important;
    height: auto !important;
}

/* Tighten the main date + price section */
li.available .datetheme2 {
    min-height: 72px !important;
    padding: 10px 6px 7px !important;
    box-sizing: border-box !important;
    line-height: 1.15 !important;
}

/* Make the price less dominant */
li.available .datetheme2 strong,
li.available .datetheme2 b {
    font-size: 18px !important;
    line-height: 1.1 !important;
    font-weight: 600 !important;
}

/* Smaller pence */
li.available .datetheme2 sup {
    font-size: 9px !important;
}

/* Keep the useful minimum-stay / arrival information,
   but make its strip more compact */
li.available .stay {
    min-height: 30px !important;
    padding: 5px 8px !important;
    line-height: 1 !important;
    box-sizing: border-box !important;
}

/* Reduce unnecessary spacing inside the tile */
li.available .datetheme2 p,
li.available .datetheme2 div,
li.available .stay p,
li.available .stay div {
    margin-top: 0 !important;
    margin-bottom: 0 !important;
}

/* ===== CALENDAR DATE / PRICE HIERARCHY ===== */

/* Make the date the primary information */
li.available .datetheme2 > p {
    font-size: 16px !important;
    font-weight: 600 !important;
    line-height: 1.1 !important;
    margin: 0 0 4px 0 !important;
}

/* Make the price secondary */
li.available .datetheme2 big.font12 {
    font-size: 13px !important;
    font-weight: 500 !important;
    line-height: 1 !important;
}

/* Keep the pence small */
li.available .datetheme2 big.font12 sup {
    font-size: 7px !important;
    line-height: 1 !important;
}

/* ===== COMPACT OCCUPIED / UNAVAILABLE CALENDAR TILES ===== */

/* Match occupied tiles to the compact available tiles */
li.occupied {
    min-height: 0 !important;
    height: auto !important;
}

li.occupied .datetheme2 {
    min-height: 72px !important;
    padding: 10px 6px 7px !important;
    box-sizing: border-box !important;
    line-height: 1.15 !important;
}

/* Date first */
li.occupied .datetheme2 > p {
    font-size: 16px !important;
    font-weight: 600 !important;
    line-height: 1.1 !important;
    margin: 0 0 4px 0 !important;
}

/* Price second */
li.occupied .datetheme2 big.font12 {
    font-size: 13px !important;
    font-weight: 500 !important;
    line-height: 1 !important;
}

/* Pence */
li.occupied .datetheme2 big.font12 sup {
    font-size: 7px !important;
    line-height: 1 !important;
}

/* Keep the minimum-stay / check-in strip compact */
li.occupied .stay {
    min-height: 30px !important;
    padding: 5px 8px !important;
    line-height: 1 !important;
    box-sizing: border-box !important;
}

/* ===== COMPACT PAST DATE TILES ===== */

li.pass {
    min-height: 0 !important;
    height: auto !important;
}

li.pass .datetheme2 {
    min-height: 72px !important;
    padding: 10px 6px 7px !important;
    box-sizing: border-box !important;
    line-height: 1.15 !important;
}

/* Date first */
li.pass .datetheme2 > p {
    font-size: 16px !important;
    font-weight: 600 !important;
    line-height: 1.1 !important;
    margin: 0 0 4px 0 !important;
}

/* Price second */
li.pass .datetheme2 big.font12 {
    font-size: 13px !important;
    font-weight: 500 !important;
    line-height: 1 !important;
}

/* Pence */
li.pass .datetheme2 big.font12 sup {
    font-size: 7px !important;
    line-height: 1 !important;
}

/* Keep the lower strip compact */
li.pass .stay {
    min-height: 30px !important;
    padding: 5px 8px !important;
    line-height: 1 !important;
    box-sizing: border-box !important;
}

/* =========================================
   BOOKING / CHECKOUT PAGE
   ========================================= */

/* ===== REMOVE CHECKOUT DECORATIVE ICONS ===== */

#FormConfirm svg.background.animated {
    display: none !important;
    visibility: hidden !important;
    opacity: 0 !important;
    width: 0 !important;
    height: 0 !important;
    position: absolute !important;
    left: -99999px !important;
    top: -99999px !important;
}

/* ===== CONFIRMATION PAYMENT SUMMARY ===== */

/* Amount due now */
#panelRecapDeposit {
    color: #26330a !important;
    font-weight: 700 !important;
    font-size: 18px !important;
    line-height: 1.3 !important;
    margin-bottom: 18px !important;
}

/* Scheduled payment information */
#panelAutoPayments {
    color: #444 !important;
    font-size: 15px !important;
    line-height: 1.5 !important;
    margin-top: 10px !important;
    margin-bottom: 26px !important;
}

/* Remove Octorate's alarming orange warning styling */
#panelAutoPayments .Orange,
#panelAutoPayments .FontBold,
#panelAutoPayments .Orange.FontBold {
    color: #444 !important;
    font-weight: 400 !important;
}

/* Keep the property name / payment lines slightly stronger */
#panelAutoPayments br + * {
    color: #333 !important;
}

/* Give the terms link a little separation */
#panelAutoPayments + a {
    margin-top: 12px !important;
}

/* Amount due now - brand styling */
#panelRecapDeposit,
#panelRecapDeposit .Orange,
#panelRecapDeposit .FontBold {
    color: #26330a !important;
    font-weight: 700 !important;
}

/* Scheduled payments - make into a clear summary block */
#panelAutoPayments {
    background: #f5f5f2 !important;
    padding: 14px 16px !important;
    border-left: 4px solid #26330a !important;
    max-width: 760px !important;
    box-sizing: border-box !important;
    margin-top: 18px !important;
    margin-bottom: 28px !important;
}