.customcalendar_wrapper {
    background: var(--widget_background);
    margin: 20px;
    padding: 0 40px;
    border-radius: 40px;
    min-height: 450px;
    overflow: hidden;
}

    .customcalendar_wrapper > .customcalendar_wrapper_inner > div {
        display: grid;
        grid-template-columns: repeat(7, auto);
        margin: 0 0 10px 0;
        row-gap: 5px
    }

    .customcalendar_wrapper > .title {
        font-weight: bold;
        font-size: 24px;
        text-align: center;
        padding: 20px 0;
        color: var(--widget_title_color);
    }



.customcalendar_wrapper > .customcalendar_wrapper_inner > div > div {
    text-align: center;
}
.customcalendar_wrapper > .customcalendar_wrapper_inner .weekday_header {
    font-size: 13px;
}

    .customcalendar_wrapper > .customcalendar_wrapper_inner > div > div:not(.day_empty):not(.weekday_header) > div {
        border: 1px solid var(--widget_day_border_color);
        border-radius: 50%;
        width: 30px;
        height: 30px;
        margin: auto;
        color: var(--widget_day_color);
        background: var(--widget_day_bck);
        text-align: center;
        padding: 5px;
        font-weight: bold;
        font-size: 13px;
    }

    .customcalendar_wrapper > .customcalendar_wrapper_inner > div > div.day_empty > div {
        border: 1px solid var(--widget_day_empty_border_color);
        border-radius: 50%;
        width: 30px;
        height: 30px;
        margin: auto;
        background: var(--widget_day_empty_bck);
        text-align: center;
        padding: 5px;
        font-weight: bold;
    }


    .customcalendar_wrapper > .caroussel-active {
        display: grid !important;
        grid-template-columns: 24px auto 24px;
        column-gap: 5px;
        row-gap: 10px;
        margin: 20px 0;
    }

    .customcalendar_wrapper > .caroussel > .caroussel-previous {
        margin: auto;
    }
    
    .customcalendar_wrapper > .caroussel > .caroussel-previous > i{
        cursor: pointer;
        text-align: center;
        font-size: 22px;
        color: var(--widget_caroussel_button_active)
    }

        .customcalendar_wrapper > .caroussel > .caroussel-previous > i[data-active="false"] {
            cursor: default;
            color: var(--widget_caroussel_button_disabled)
        }

    .customcalendar_wrapper > .caroussel > .caroussel-next {
        margin: auto;
    }

    .customcalendar_wrapper > .caroussel > .title {
        color: var(--widget_caroussel_title_color);
        font-weight: bold;
        font-size: 24px;
        text-align: center;
    }

    .customcalendar_wrapper > .caroussel > .caroussel-next > i {
        cursor: pointer;
        text-align: center;
        font-size: 22px;
        color: var(--widget_caroussel_button_active)
    }

            .customcalendar_wrapper > .caroussel > .caroussel-next > i[data-active="false"] {
                cursor: default;
                color: var(--widget_caroussel_button_disabled)
            }