@import url('https://fonts.googleapis.com/css2?family=Montserrat:ital,wght@0,100..900;1,100..900&display=swap');
:root {
    /*Общее*/
    --calendar-bg-color: transparent;
    --calendar-arrow-color: rgba(255, 255, 255, 1);
    --calendar-radius: 0;

    /*Типографика*/
    --calendar-font: 'Montserrat';

    /*Месяц*/
    --calendar-month-font-color: rgba(255, 255, 255, 1);
    --calendar-month-font-weight: 700;
    --calendar-month-font-size: 24px;

    /*Год*/
    --calendar-year-font-color: #4a5660;
    --calendar-year-font-weight: 400;
    --calendar-year-font-size: 0px;

    /*Дни недели*/
    --calendar-weekdays-font-color: rgba(255, 255, 255, 1);
    --calendar-weekdays-font-weight: 400;
    --calendar-weekdays-font-size: 14px;

    /*Даты*/
    --calendar-days-font-color: rgba(255, 255, 255, 1);
    --calendar-days-font-weight: 400;
    --calendar-days-font-size: 14px;

    /*Текущая дата*/
    --calendar-date-now-font-color: #ffffff;
    --calendar-date-now-bg-color: rgba(234, 150, 59, 1);

    /*Всплывающее окно*/
    --calendar-pop-up-shadow-color: rgba(0, 0, 0, 0.15);
    --calendar-pop-up-radius: 10px;
    --calendar-pop-up-font-color: #ffffff;
    --calendar-pop-up-font-size: 12px;
    --calendar-pop-up-font-weight: 400;

    /*Уроки*/
    --calendar-event-color-type-1: rgba(255, 255, 255, 1);
    /**/ 
    --calendar-event-color-type-2: linear-gradient(89.66deg, #58A69B 0.24%, #83C0B8 34.1%, #5FABA0 99.67%);
    /**/ 
    --calendar-event-color-type-3: linear-gradient(180deg, #EA963B 20.91%, #E98435 48.69%, #E96F2F 78.18%);
    /**/
    --calendar-event-color-type-4: linear-gradient(90deg, #F4CA96 0%, #CE9F63 21.5%, #EDD081 61.01%, #E8CB81 100%);
    /**/
    --calendar-event-color-type-5: rgba(255, 255, 255, 1);
    /**/
    --calendar-event-color-type-6: rgba(255, 255, 255, 1);
}
.calendar-wrapper {
    background: linear-gradient(213.87deg, #000D09 14.37%, #00110D 42.93%, #152F2C 56.7%, #152F2C 66.69%, #001814 76.36%, #001814 81.82%, #17332F 94.23%);
    padding: 30px 0 10px;
    border-radius: 20px;
    margin-bottom: 20px;
}
.calendar-wrapper h3 {
    font-family: 'Bebas Neue', sans-serif;
    font-size: 30px;
    font-weight: 400;
    line-height: 27px;
    letter-spacing: 0.02em;
    color: #fff;
    text-align: center;
    margin-bottom: 15px;
}
.calendar-wrapper #events-calendar {
    padding: 0!important;
}
.calendar-wrapper .month {
    border-bottom: 0.92px solid rgba(255, 255, 255, 0.32);
    padding: 0 40px 15px!important;
}
.calendar-wrapper .month li {
    font-family: 'Bebas Neue', sans-serif!important;
}
.month li.prev:before, .month li.next:before {
    top: 0!important;
    width: 30px!important;
    height: 30px!important;
    background: url(https://fs20.getcourse.ru/fileservice/file/download/a/18503/sc/184/h/ce2cd2a949b7e0b68035322a60db1f58.svg) 50% no-repeat, linear-gradient(180deg, #EA963B 20.91%, #E98435 48.69%, #E96F2F 78.18%);
    border-radius: 50%;
    border: none!important;
    z-index: 1;
    transform: rotate(0)!important;
}
.month li.next:before {
    transform: rotate(180deg)!important;
}
.calendar-wrapper .weekdays {
    padding: 0 30px;
}
.calendar-wrapper .weekdays li {
    text-transform: uppercase;
}
.calendar-wrapper .days {
    padding: 0 24px 15px;
}
.days li.type-1 span:before, .days li.type-1 span:after, .days li.type-1 div,
.days li.type-4 span:before, .days li.type-4 span:after, .days li.type-4 div {
    color: #000!important;
}
.days,
.weekdays{
    display: grid!important;
    grid-template-columns: repeat(7, 1fr);
    gap: 6px;
}
.days li {
    border-radius: 4px;
    padding: 6px 0;
    height: 28px;
    width: 28px;
    margin: auto;
    padding: 5px 0!important;
    display: flex;
    align-items: center;
    justify-content: center;
}
.days li.type-1 {
    border: 1px solid #fff;
}
.days li.type-2 {
    background: linear-gradient(89.66deg, #58A69B 0.24%, #83C0B8 34.1%, #5FABA0 99.67%);
}
.days li.type-3 {
    background: linear-gradient(180deg, #EA963B 20.91%, #E98435 48.69%, #E96F2F 78.18%);
}
.days li.type-4 {
    background: linear-gradient(90deg, #F4CA96 0%, #CE9F63 21.5%, #EDD081 61.01%, #E8CB81 100%);
    color: rgba(0, 0, 0, 1);
}
.calendar-footnote {
    border-top: 0.92px solid rgba(255, 255, 255, 0.32);
    padding: 25px 15px 0 30px;
}
.calendar-footnote p {
    position: relative;
    display: flex;
    gap: 5px;
    font-family: 'Montserrat', sans-serif;
    font-size: 14px;
    font-weight: 400;
    line-height: 1.5;
    color: #fff;
}
.calendar-footnote p:before {
    content: '';
    position: relative;
    top: -4px;
    width: 28px;
    height: 28px;
    border-radius: 4px;
    background-color: transparent;
    flex-shrink: 0;
}
.calendar-footnote p.lesson-day:before {
    border: 0.92px solid rgba(169, 169, 169, 1);
}
.calendar-footnote .practice-day:before {
    background: linear-gradient(89.66deg, #58A69B 0.24%, #83C0B8 34.1%, #5FABA0 99.67%);
}
.calendar-footnote .zoom-day:before {
    background: linear-gradient(180deg, #EA963B 20.91%, #E98435 48.69%, #E96F2F 78.18%);
}
.calendar-footnote .final-day:before {
    background: linear-gradient(90deg, #F4CA96 0%, #CE9F63 21.5%, #EDD081 61.01%, #E8CB81 100%);
}
.days li[class*='type'] span:after {
    content: none!important;
}
.days li.date-now span:before {
    content: '';
    position: absolute;
    width: 5px!important;
    height: 5px!important;
    top: auto!important;
    bottom: -6px;
    left: 50%;
    transform: translate(-50%, -50%);
    background: #FFF !important;
    border-radius: 50%;
    z-index: -1;
}