:root {
    --text: #333;
    --muted-text: #666;
    --border: #e0e0e0;
    --bg: #f4f4f4;
    --card: #fff;
    --weekend: #eee;
    --supplier-brown: rgb(107, 63, 35);
    --country-orange: rgba(233, 141, 13, 0.8);
    --region-gold: rgba(188, 153, 66, 0.8);
    /* --range-accent: #68c8c7; */
    --range-accent: var(--colours--bone);
    --danger: #b71c1c;

    --bone: var(--colours--bone);
    --soil: var(--colours--soil);
    --clay: var(--colours--clay);
    --available-green: #b1b4a6;
}

html,
body {
    margin: 0;
    padding: 0;
    background: var(--clay);
    font-family: var(--_typography---font--body-copy) !important;
    color: var(--soil) !important;
}

.availNow {
    width: 100%;
    max-width: none;
    margin: 0px;
    background-color: transparent;
}

.availabilityComponent.container {
    padding: 0px;
    max-width: none;
}

.availabilityCircleBtn {
    background-color: var(--soil);
}

.availabilitySearch,
.availabilityHeaderBar {
    max-width: none;
    margin: 0px;
    padding: 0px;
}


.availabilityLegendSwatch {
    --size: 25px;
    width: var(--size);
    height: var(--size);
    border-radius: 50%;
    border: 1px solid var(--soil);
}

.availabilityLegendSwatchUnavailable {
    background-color: var(--bone);
}

.availabilityLegendSwatchAvailable {
    background-color: var(--available-green);
}

.availabilityHeading {
    font-family: var(--_typography---font--heading) !important;
    background-color: var(--bone) !important;
    padding: 16px 24px !important;
    margin-top: 16px;
    z-index: 10 !important;
}

.rateGrid {
    background-color: var(--available-green) !important;
}

.availabilityHeading>div>div {
    color: var(--soil) !important;
}

.availabilityHeading>div>div:nth-child(2) {
    font-family: var(--_typography---font--body-copy) !important;
    text-transform: uppercase;
}

.availNow td,
.availNow tr,
.availNow th {
    border: solid 1px var(--bone);
    border-color: var(--bone) !important;
}

.availNow tr {
    border-left: none !important;
}

table {
    /* border: solid 2px var(--bone); */
    border-left: none !important;
}

.availNow th {
    border: none !important;
    /* border-color: red !important; */
}

td.roomType {
    padding-left: 24px;
    color: var(--soil) !important;
    border-left: none;
}

th.roomType {
    padding-left: 24px;
    color: var(--soil) !important;
    border-left: none !important;
}

.availNow thead>tr {
    border-right: none;
}

.availNow thead>tr>th:nth-child(1) {
    border-bottom: solid var(--clay) 1px !important;
    font-size: 15px;
}

.roomType {
    border-left: none !important;
    color: var(--soil) !important;
    background: #ffffff;
    background: linear-gradient(90deg,
            rgba(255, 255, 255, 1) 0%,
            rgba(251, 248, 245, 1) 100%);
}

.roomTypeContainer .roomTypeName {
    font-weight: 400;
    font-size: 15px;
}

.week,
.weekend {
    color: var(--soil) !important;
    text-transform: uppercase;
}

.week>div:nth-child(2),
.weekend>div:nth-child(2) {
    font-weight: bold;
    font-size: 17px;
    line-height: 12px;
}

.rateGridSoldOut {
    background-color: var(--bone) !important;
}

td.roomType,
th.roomType {
    width: 160px;
}

body.mobile-mode .availabilityTable td,
body.mobile-mode .availabilityTable th {
    text-align: left;
    min-width: 60px;
}