/* Overrides */
body.availability-calendar .i-content .container { width: 100%; max-width: 80.5rem; }


/* Availability Filter Styles */
.availability-calendar-filter { width: 100%; margin-bottom: 1.5rem; padding: 0.5rem; background: hsl(var(--white)); border: 0.0625rem solid hsl(var(--lightGray)); border-radius: 0.75rem; }

/* Availiability Calendar Styles */
.availability-calendar-wrap { width: 100%; padding: 0.5rem; background: hsl(var(--white)); border: 0.0625rem solid hsl(var(--lightGray)); border-radius: 0.75rem; }

.availability-calendar-wrap .tagline { font-size: 0.875rem; color: hsl(var(--darkGray)); font-weight: var(--wMedium); text-align: center; text-transform: capitalize; }
.availability-calendar-wrap .availability-calendar-links { display: flex; flex-wrap: wrap; position: relative; z-index: 2; padding: 1rem; background: hsl(var(--white)); font-family: var(--siteFont1); font-size: 1.25rem; font-weight: var(--wMedium); }
.availability-calendar-wrap .availability-calendar-link-item { margin: 0 0.125rem 0.25rem; padding: 0.375rem 0.5rem; border-radius: var(--borderRadiusCheckbox); line-height: 1; text-align: center; }
.availability-calendar-wrap .availability-calendar-link { background: hsl(var(--siteColor1)); color: hsl(var(--white)); text-decoration: none; transition: all 0.25s ease-in-out; }
.availability-calendar-wrap .availability-calendar-link:hover { background: hsl(var(--siteColor2)); }
.availability-calendar-wrap .availability-calendar-text { color: hsl(var(--lightGray)); }
.availability-calendar-wrap .be-calendar-legend-key { width: auto; margin: 0 1.5rem 0.5rem; }

.availability-calendar { width: 100%; min-height: 18.75rem; }
.availability-calendar .be-loading { position: relative; padding: 5rem 1.25rem; }
.availability-calendar .be-loading .swiper-lazy-preloader { animation-name: spin-animation; animation-duration: 2s; animation-iteration-count: infinite; border-color: hsl(var(--siteColor1)); border-top-color: transparent; }

/* Weekdays Row */
.availability-calendar-container { overflow-x: auto; background: hsl(var(--white)); }
.availability-calendar-container .calendar-weekdays { overflow-x: auto; width: 100%; display: none; flex-wrap: wrap; justify-content: flex-start; background: hsl(var(--white)); }
.availability-calendar-container .calendar-weekday-row { display: flex; flex-wrap: nowrap; width: 100%; }
.availability-calendar-container .calendar-weekday { width: 100%; max-width: 2.5rem; flex-shrink: 0; flex-grow: 1; padding: 0.5rem; border-bottom: 0.0625rem solid hsl(var(--lightGray)); color: hsl(var(--bodyFontColor)); text-align: center; }
.availability-calendar-container .calendar-weekdays:last-child .calendar-title,
.availability-calendar-container .calendar-weekdays:last-child .calendar-weekday { border-bottom: none; }
@media (min-width: 1025px) {
  .availability-calendar-container { overflow-x: visible; }
}

/* Week Days Row */
.availability-calendar-container .calendar-row { width: 100%; display: flex; flex-wrap: wrap; justify-content: flex-start; background: hsl(var(--white)); }
.availability-calendar-container .calendar-title { width: 100%; position: sticky; left: 0; padding: 0.5rem; }
.availability-calendar-container .calendar-title > a { text-decoration: none; }
.availability-calendar-container .calendar-title .icon { width: 1.25rem; height: 1.25rem; }
.availability-calendar-container .calendar-day-row { display: flex; flex-wrap: nowrap; width: 100%; }
@media (min-width: 1025px) {
  .availability-calendar-container .calendar-row { overflow-x: auto; }
}

/* Inline Calendar Availability Styles */
.availability-calendar-container .calendar-day { cursor: pointer; width: 100%; max-width: 2.5rem; flex-shrink: 0; flex-grow: 1; padding: 0.5rem; border-top: 0.0625rem solid hsl(var(--lightGray)); border-bottom: 0.0625rem solid hsl(var(--lightGray)); text-align: center; color: hsl(var(--bodyFontColor)); transition: all 0.25s ease-in-out; }
.availability-calendar-container .calendar-day .calendar-weekday { position: relative; padding: 0.125rem; margin-bottom: 0.25rem; font-size: 0.75rem; color: hsl(var(--gray)); }
.availability-calendar-container .calendar-day .calendar-day-text { position: relative; padding: 0.125rem; color: hsl(var(--bodyFontColor)); font-weight: var(--wMedium); }
.availability-calendar-container .calendar-day.available { background: var(--dpDayAvailableBGColor); color: hsl(var(--bodyFontColor)); }
.availability-calendar-container .calendar-day.available .calendar-weekday,
.availability-calendar-container .calendar-day.available .calendar-day-text,
.availability-calendar-container .calendar-day.available:hover .calendar-weekday,
.availability-calendar-container .calendar-day.available:hover .calendar-day-text { color: inherit; }
.availability-calendar-container .calendar-day.available:hover,
.availability-calendar-container .calendar-day.selected-date,
.availability-calendar-container .calendar-day.highlight { background: var(--dpDaySelectedBGColor); color: hsl(var(--white)); }
.availability-calendar-container .calendar-day.unavailable { cursor: default; background: var(--dpDayUnavailableBGColor); color: hsl(var(--lightGray)); }
.availability-calendar-container .calendar-day.unavailable .calendar-day-text { color: hsl(0, 0%, 65%); }
.availability-calendar-container .calendar-day.unavailable .calendar-day-text:after { content: ""; display: block; width: calc(100% + 1rem); height: 0.0625rem; position: absolute; top: 50%; left: 50%; z-index: 2; transform: translate(-50%, -50%); border-bottom: 0.0625rem solid hsl(0, 0%, 25%); }
.availability-calendar-container .calendar-day.check-in { background: var(--dpDayCheckInBGColor); color: hsl(var(--white)); }
.availability-calendar-container .calendar-day.check-in:hover,
.availability-calendar-container .calendar-day.check-in.selected-date { background: linear-gradient(to left top, var(--dpDaySelectedBGColor) 49%, var(--dpDayUnavailableBGColor) 50%); color: hsl(var(--white)); }
.availability-calendar-container .calendar-day.check-out { background: var(--dpDayCheckOutBGColor); color: hsl(var(--white)); }
.availability-calendar-container .calendar-day.check-out:hover,
.availability-calendar-container .calendar-day.check-out.selected-date { background: linear-gradient(to left top, var(--dpDayUnavailableBGColor) 49%, var(--dpDaySelectedBGColor) 50%); color: hsl(var(--white)); }
.availability-calendar-container .calendar-day.check-in:hover .calendar-weekday,
.availability-calendar-container .calendar-day.check-in:hover .calendar-day-text,
.availability-calendar-container .calendar-day.check-out:hover .calendar-weekday,
.availability-calendar-container .calendar-day.check-out:hover .calendar-day-text { color: inherit }

/* Last Week Days Row */
.availability-calendar-container .calendar-row:last-child .calendar-title,
.availability-calendar-container .calendar-row:last-child .calendar-day { border-bottom: none; }

.availability-calendar-modal .i-modal-header-bar { z-index: 3; }
.availability-calendar-modal .i-modal-main-container { padding: 0; }
.availability-calendar-modal .i-modal-main { padding: 0; }
.availability-calendar-modal .i-modal-main .alert { margin: 0 0 1rem; }
.availability-calendar-modal .i-modal-body { grid-template-rows: auto auto auto; }
.availability-calendar-modal .be-property-widget { border-radius: 0; }
.availability-calendar-modal .avaibility-btn-wrap { display: flex; flex-wrap: wrap; justify-content: center; padding: 0.75rem 0.75rem; }
.availability-calendar-modal .avaibility-btn-wrap .btn { min-width: 12rem; margin: 0.25rem 0.5rem; font-weight: var(--wMedium); text-transform: uppercase; }
@media (min-width: 1025px) {
  .availability-calendar-modal .be-property-widget { border-radius: var(--borderRadius); }
}