/* Calendar Legend */
#calendarTab .be-calendar-legend-row { display: flex; flex-wrap: wrap; flex-direction: row; padding: 1rem 0; }
#calendarTab .be-calendar-legend-key { flex-grow: 0; margin: 0 1rem 0.5rem 0; display: flex; align-items: center; }
#calendarTab .be-calendar-legend-key-preview { border-radius: var(--borderRadiusCheckbox); margin-right: 0.75rem; width: 1.25rem; height: 1.25rem; box-shadow: 0.0625rem 0.0625rem 0.25rem hsla(var(--siteColor1), 0.25); }
#calendarTab .be-calendar-legend-key-preview.available { background-color: var(--dpDayAvailableBGColor); }
#calendarTab .be-calendar-legend-key-preview.unavailable { background-color: var(--dpDayUnavailableBGColor); }
#calendarTab .be-calendar-legend-key-preview.check-in { background: var(--dpDayCheckInBGColor); }
#calendarTab .be-calendar-legend-key-preview.check-out { background: var(--dpDayCheckOutBGColor); }
#calendarTab .be-calendar-legend-key-preview.pending { background-color: hsla(var(--siteColor1), 45%); }
#calendarTab .be-calendar-legend-key-preview.pending-check-in { background: linear-gradient(to left top, hsla(var(--siteColor1), 45%) 49%, var(--dpDayUnavailableBGColor) 50%); }
#calendarTab .be-calendar-legend-key-preview.pending-check-out { background: linear-gradient(to left top, var(--dpDayUnavailableBGColor) 49%, hsla(var(--siteColor1), 45%) 50%); }

/* Calendar */
.property-calendar-wrap { padding: 0; }
.property-calendar-wrap .month-block { width: 100%; margin-bottom: 0.0625rem; padding: 0.625rem; background: hsla(var(--black), 10%); border-top-left-radius: var(--borderRadius); border-top-right-radius: var(--borderRadius); font-size: 1.25rem; color: hsla(var(--black), 50%); text-align: center; text-transform: uppercase; }
.property-calendar-wrap .calendars-col { display: flex; padding: 0; }
.property-calendar { width: 100%; margin: 0 0 1.875rem; border-radius: 0; }
.property-calendar tr { display: flex; flex-wrap: wrap; }
.property-calendar th { width: calc(100% / 7); position: relative; background: hsla(var(--black), 10%); border-bottom: 0.25rem hsl(var(--white)) solid !important; font-family: var(--siteFont1), sans-serif; color: hsla(var(--black), 50%); text-align: center; font-weight: var(--wMedium); }
.property-calendar th:after { content: ""; display: block; width: 0.0625rem; height: 60%; position: absolute; top: 50%; right: 0; transform: translate(0,-50%); background: hsla(var(--white), 10%); }
.property-calendar th:last-child:after { display: none; }
.property-calendar th span { overflow: hidden; display: block; text-overflow: clip; white-space: nowrap; }
.property-calendar td { --tableCellRadius: 0.75rem; display: flex; flex-direction: column; width: calc(100% / 7); height: 6.25rem; padding: 0.625rem; border-radius: var(--tableCellRadius); border: 0.0625rem hsl(var(--white)) solid; /* border: none; border-right: 0.0625rem hsla(var(--black), 10%) solid; border-bottom: 0.0625rem hsla(var(--black), 10%) solid; */ }
.property-calendar td:hover { background: hsla(var(--siteColor1), 15%); }
.property-calendar td.no-date { background: hsl(var(--white)); }
.property-calendar td.date-block { background: hsla(var(--siteColor1), 5%); border: 0.0625rem hsl(var(--white)) solid; }
.property-calendar td.date-block:hover { background: hsla(var(--siteColor1), 75%) }
.property-calendar .date-day { display: block; width: 1.5rem; height: 1.25rem; padding: 0.1875rem; position: relative; top: -0.375rem; left: -0.375rem; border-radius: 0.35rem; font-size: 0.875rem; color: hsl(var(--lightGray)); line-height: 1; text-align: center; white-space: normal; }
.property-calendar td.date-block:hover .date-day { color: hsl(var(--white)); }
.property-calendar td.date-block:hover .date-day:hover { color: hsl(var(--siteColor1)); }
.property-calendar td.date-block-today, .property-calendar td.date-block-today:hover { --dpDayToday: 57, 100%, 78%; background: hsl(var(--dpDayToday)) !important; color: hsl(var(--black)) !important; }
.property-calendar td.date-block-today .date-day, .property-calendar td.date-block-today:hover .date-day:hover { color: hsl(var(--black)) !important; }
.property-calendar .date-day-link,
.property-calendar td.date-block-today .date-day-link { background: hsl(var(--siteColor1)); color: hsl(var(--white)); text-decoration: none; }
.property-calendar .date-day-link:hover,
.property-calendar td.date-block-today .date-day-link:hover { background: hsl(var(--white)); color: hsl(var(--siteColor1)); }
.property-calendar td.available { background-color: var(--dpDayAvailableBGColor); color: hsl(var(--white)); }
.property-calendar td.booked { background-color: var(--dpDayUnavailableBGColor); }
.property-calendar td.check-in { background: var(--dpDayCheckInBGColor); border-radius: 0 0 0 var(--dpDayRadius); color: hsl(var(--bodyFontColor)); }
.property-calendar td.check-out { background: var(--dpDayCheckOutBGColor); border-radius: 0 var(--dpDayRadius) 0 0; color: hsl(var(--bodyFontColor)); }
.property-calendar td.pending { background-color: hsla(var(--siteColor1), 45%); color: hsl(var(--white)); }
.property-calendar td.pending-check-in { background: linear-gradient(to left top, hsla(var(--siteColor1), 45%) 49%, var(--dpDayUnavailableBGColor) 50%); }
.property-calendar td.pending-check-out { background: linear-gradient(to left top, var(--dpDayUnavailableBGColor) 49%, hsla(var(--siteColor1), 45%) 50%); }

@media(min-width:320px){
  .property-calendar-wrap .calendars-col { flex-direction: column; }
}
@media(min-width:578px){
  .property-calendar-wrap .calendars-col { flex-direction: row; }
}
@media(min-width:992px){
  .property-calendar-wrap .calendars-col { flex-direction: column; }
}
