.calendar-component{--calendar-component-bgcolor:#fff;--calendar-grid-bgcolor:#fdfcf8;--calendar-grid-gap-bgcolor:#d9d9d9;--calendar-weekdays-bgcolor:#fff;--calendar-weekday-bgcolor:#fbf7ed;--calendar-today-bgcolor:#f1ebe0;--calendar-day-hover-bgcolor:#f1ebe0;--calendar-day-available-bgcolor:#e6f3e3;--calendar-day-available-color:#c2e3bc;--calendar-day-selected-bgcolor:#fae5b4;--calendar-day-selected-color:#f3bf4a;--calendar-day-selected-reserved-bgcolor:#ff8b8b;background:var(--calendar-bgcolor) !important}
.calendar-component .calendar{height:740px}
.calendar-component .loading{display:flex;align-items:center;justify-content:center;width:100%;margin-top:10rem}
.calendar-component .calendar-header{display:flex;justify-content:end;align-items:center;column-gap:1rem;margin-bottom:1em}
.calendar-component .calendar-header .nav-month-name{font-size:1.2rem;font-weight:bold}
.calendar-component .calendar-header .nav-btn{--bs-btn-disabled-color:rgb(0 0 0 / 0.3);border:none}
.calendar-component .calendar-grid{display:grid;grid-template-columns:repeat(7,1fr);background:var(--calendar-grid-gap-bgcolor)}
.calendar-component .calendar-weekdays{display:contents;background:var(--calendar-weekdays-bgcolor)}
.calendar-component .calendar-weekdays .weekday{background:var(--calendar-weekdays-bgcolor);padding:0.5rem;text-align:center;font-weight:bold}
.calendar-component .calendar-week{display:contents}
.calendar-component .calendar-day{min-height:93px;background:var(--calendar-grid-bgcolor);padding:0.75rem;text-align:center;cursor:pointer;user-select:none;position:relative;border:1px solid var(--calendar-grid-gap-bgcolor)}
.calendar-component .calendar-day.weekend{background:var(--calendar-weekday-bgcolor)}
.calendar-component .calendar-day.available{background:var(--calendar-day-available-bgcolor)}
.calendar-component .calendar-day.available::after{content:"+";display:block;position:absolute;top:0;right:0;width:80px;height:80px;padding:3px;text-align:right;font-size:35px;line-height:15px;background:linear-gradient(225deg,var(--calendar-day-available-color) 40px,transparent 41px)}
.calendar-component .calendar-day.available.selected-start::after,.calendar-component .calendar-day.available.selected-end::after,.calendar-component .calendar-day.available.in-range::after{content:"-";padding:3px 7px;background:linear-gradient(225deg,var(--calendar-day-selected-color) 40px,transparent 41px)}
.calendar-component .calendar-day.today{border-color:#999}
.calendar-component .calendar-day.selected-start,.calendar-component .calendar-day.selected-end,.calendar-component .calendar-day.in-range{background:var(--calendar-day-selected-bgcolor)}
.calendar-component .calendar-day.other-month,.calendar-component .calendar-day.past{color:rgba(0,0,0,0.3)}
.calendar-component .calendar-day:hover,.calendar-component .calendar-day:focus,.calendar-component .calendar-day:active{background:var(--calendar-day-hover-bgcolor)}
.calendar-component .calendar-day>.day-date{text-align:left;display:block;margin-bottom:1rem;font-weight:bold;font-size:1.2em}
.calendar-component .calendar-day>.day-price{display:block;position:relative;text-align:left;height:2rem}
.calendar-component .calendar-day.reserved.selected-start,.calendar-component .calendar-day.reserved.selected-end,.calendar-component .calendar-day.reserved.in-range{background-color:var(--calendar-day-selected-reserved-bgcolor)}