.calendar{width:100%;background-color:#fff;border-radius:4px;overflow:hidden;border:1px solid #d9d9d9}.calendar-header{display:flex;justify-content:space-between;align-items:center;padding:16px}.calendar-header .month-year{color:#424644;font-size:16px;font-weight:600;line-height:24px}.calendar-week-days{display:grid;grid-template-columns:repeat(7,1fr);padding:16px;gap:16px}.calendar-week-days div{display:grid;place-items:center;color:#424644;font-size:14px;font-weight:600;line-height:18px;text-transform:uppercase}.calendar-days{display:grid;grid-template-columns:repeat(7,1fr);gap:16px;color:#0a0921;padding:0 16px 16px 16px}.calendar-days div:not(:empty){width:40px;height:40px;display:flex;align-items:center;justify-content:center;position:relative;animation:to-top 1s forwards;color:#b7c3bd;font-size:16px;font-weight:600;line-height:24px;border-radius:100px;background:#fafafa;justify-self:center}.calendar-days div.active-date{color:#646b68;cursor:pointer;background:0 0}.calendar-days div.picked{box-shadow:0 1px 2px 0 rgba(58,66,68,.1);border:3px solid #d3eace;background:#51ab3a!important;color:#fff}.year-picker{display:flex;align-items:center;gap:4px}.year-picker .year-change{border-radius:50px;border:1px solid #b9ddb0;background:#f6fbf5;cursor:pointer;padding:4px}.year-picker #pre-year{transform:rotate(180deg)}.year-change:hover{background-color:#cfdccc;transition:all .2s ease-in-out}.calendar-days div span{position:absolute}.calendar-days div.active-date:hover{transition:width .2s ease-in-out,height .2s ease-in-out;background-color:#51ab3a;color:#fff}.calendar-days div.current-date{transition:width .2s ease-in-out,height .2s ease-in-out;background-color:#ececec}.month-list{position:relative;left:0;top:-130px;background-color:#ebebeb;color:#151426;display:grid;grid-template-columns:repeat(3,auto);gap:5px;border-radius:20px}.month-list>div{display:grid;place-content:center;margin:5px 10px;transition:all .2s ease-in-out}.month-list>div>div{border-radius:15px;padding:10px;cursor:pointer}.month-list>div>div:hover{background-color:#9796f0;color:#f8fbff;transform:scale(.9);transition:all .2s ease-in-out}.month-list.show{visibility:visible;pointer-events:visible;transition:.6s ease-in-out;animation:to-left .71s forwards}.month-list.hideonce{visibility:hidden}.month-list.hide{animation:to-right 1s forwards;visibility:none;pointer-events:none}.date-time-formate{height:4rem;width:100%;font-family:Dubai Light,Century Gothic;position:relative;display:flex;top:50px;justify-content:center;align-items:center}.day-text-formate{font-family:Microsoft JhengHei UI;font-size:1.4rem;padding-right:5%;border-right:3px solid #9796f0}.date-time-value{display:block;position:relative;text-align:center;padding-left:5%}.time-formate{font-size:1.5rem}.time-formate.hideTime{animation:hidetime 1.5s forwards}.day-text-formate.hidetime{animation:hidetime 1.5s forwards}.date-formate.hideTime{animation:hidetime 1.5s forwards}.day-text-formate.showtime{animation:showtime 1s forwards}.time-formate.showtime{animation:showtime 1s forwards}.date-formate.showtime{animation:showtime 1s forwards}@keyframes to-top{0%{transform:translateY(100%);opacity:0}100%{transform:translateY(0);opacity:1}}@keyframes to-left{0%{transform:translatex(230%);opacity:1}100%{transform:translatex(0);opacity:1}}@keyframes to-right{10%{transform:translatex(0);opacity:1}100%{transform:translatex(-150%);opacity:1}}@keyframes showtime{0%{transform:translatex(250%);opacity:1}100%{transform:translatex(0);opacity:1}}@keyframes hidetime{0%{transform:translatex(0);opacity:1}100%{transform:translatex(-370%);opacity:1}}.list-options{padding:0;margin:0!important}.list-options li{border-radius:8px;border:1px solid #d9d9d9;list-style:none}.list-options li>a,.list-options li>span{display:flex;justify-content:space-between;text-decoration:none;color:#424644;font-size:16px;font-weight:600;line-height:24px;padding:16px 16px 16px 24px;margin:0;align-items:center;cursor:pointer}.list-options li:not(:last-child){margin-bottom:8px}.list-options li .icon{-webkit-mask:url(../../images/mps/upsell/chevron-icon.svg) no-repeat center;mask:url(../../images/mps/upsell/chevron-icon.svg) no-repeat center;width:24px;height:24px;background:#646b68;mask-size:100%;cursor:pointer}.list-options li:hover{border-color:#88908d}.list-options li.active{border:1px solid #51ab3a;outline:3px solid #d3eace}@media screen and (max-width:768px){.calendar-days{gap:0!important}.calendar-week-days{gap:5px!important}}