*{margin:0;padding:0;box-sizing:border-box}.root{width:100vw;height:100vh}.date-input{padding:5px;border:1px solid #000;background-image:url(../icons/calendar.svg);background-repeat:no-repeat;background-position-x:95%;background-position-y:center;outline-color:#51559f}.m-datepicker-overlay{height:100%;width:100%;background-color:rgb(0,0,0,.5);display:none;align-items:center;justify-content:center;position:absolute;top:0}.m-datepicker{height:500px;width:340px;border-radius:4px;overflow:hidden}.m-datepicker-header{height:20%;background-color:#D1A564;display:flex;flex-direction:column;justify-content:space-between;padding:4% 5%}.m-datepicker-header small{font-size:11px;color:#fff}.m-datepicker-header div{display:flex;justify-content:space-between;align-items:center}.m-datepicker-header div p{font-size:20px;color:#fff}.m-datepicker-header div button{background:0 0;padding:6px;border:transparent;outline:transparent;cursor:pointer;border-radius:5px}.m-datepicker-header div button:active{background:#424685}.m-datepicker-header div button img{width:20px;-webkit-user-drag:none}.m-datepicker-body{height:70%;background-color:#fff}.m-datepicker-options{width:100%;height:15%;display:flex;align-items:center;justify-content:space-between;padding:0 5%}.m-datepicker-select-year{width:35%}.m-datepicker-select-year label{width:100%;user-select:none;position:relative;display:flex;align-items:center;justify-content:space-between;cursor:pointer}.m-datepicker-select-year label::after{content:'\25BC';font-size:10px;position:absolute;right:-15%}.m-datepicker-select-year input[type=checkbox]{display:none}.m-datepicker-select-year input[type=checkbox]:checked~label::after{content:'\25B2'}.m-datepicker-month-arrows{width:15%;display:flex;justify-content:space-between}.m-datepicker-month-arrows p{cursor:pointer;user-select:none;font-size:25px}.m-datepicker-mainContent{height:85%}.m-datepicker-weeks{height:20%;display:grid;grid-template-columns:repeat(7,1fr)}.m-datepicker-weeks p{justify-self:center;align-self:center;color:gray;font-size:14px}.m-datepicker-days{height:80%;display:grid;grid-template-columns:repeat(7,1fr);grid-template-rows:repeat(6,1fr)}.m-datepicker-days p{justify-self:center;align-self:center;font-size:14px;cursor:pointer;display:flex;justify-content:center;align-items:center;width:30px;height:30px}.currentDay{border:1px solid #000;border-radius:50%}.selectedDay{background-color:#51559f;border-radius:50%;color:#fff}.m-datepicker-years{height:100%;width:100%;display:grid;grid-template-columns:repeat(3,1fr);overflow:auto;padding:0 5%}.m-datepicker-years::-webkit-scrollbar{display:none}.m-datepicker-years p{height:40px;width:100%;display:flex;align-items:center;justify-content:center;cursor:pointer;border-radius:20px}.selectedYear{color:#fff;background-color:#51559f}.m-datepicker-footer{padding:0 5% 0 50%;height:10%;display:flex;justify-content:space-between;align-items:center;background-color:#fff}.m-datepicker-footer button{width:45%;height:60%;border:transparent;outline:transparent;cursor:pointer;font-size:14px;font-weight:600;color:#51559f;background:0 0;text-transform:uppercase}