{% set properties = item.properties|json_decode %}

{{ StyleHelper.generatePresetSelector('.moto-widget-content_section-calendar', item.class_name) }} {
    {{ StyleHelper.generateLessFromArray(properties.toolbar.desktop.base, '.ec-toolbar') }}
    {{ StyleHelper.generateLessFromArray(properties.toolbar_header.desktop.base, '.ec-title') }}

    {{ StyleHelper.generateLessFromArray(properties.toolbar_button.desktop, '.ec-button') }}
    {{ StyleHelper.generateLessFromArray(properties.toolbar_button.desktop.active, '.ec-button.ec-active') }}
    {{ StyleHelper.generateLessFromArray(properties.toolbar_button.desktop.inactive, '.ec-button[disabled]') }}

    {{ StyleHelper.generateLessFromArray(properties.toolbar_button_prev.desktop, '.ec-icon.ec-prev') }}
    {{ StyleHelper.generateLessFromArray(properties.toolbar_button_next.desktop, '.ec-icon.ec-next') }}

    {{ StyleHelper.generateLessFromArray(properties.toolbar_spacing.desktop.base, '.ec-toolbar > * > *') }}

    {{ StyleHelper.generateLessFromArray(properties.timezone_label.desktop.base, '.moto-widget-content_section-calendar__footer-wrapper') }}

    .ec-month {
        {{ StyleHelper.generateLessFromArray(properties.month_border.desktop.base, '.ec-header, .ec-all-day, .ec-body, .ec-days, .ec-day') }}

        {{ StyleHelper.generateLessFromArray(properties.month_week_day.desktop.base, '.ec-header .ec-day') }}

        {{ StyleHelper.generateLessFromArray(properties.month_day.desktop.base, '.ec-body .ec-day') }}
        {{ StyleHelper.generateLessFromArray(properties.month_day.desktop.active, '.ec-body .ec-day.ec-today') }}
        {{ StyleHelper.generateLessFromArray(properties.month_day.desktop.inactive, '.ec-body .ec-day.ec-other-month') }}

        {{ StyleHelper.generateLessFromArray(properties.month_day_header.desktop.base, '.ec-body .ec-day-head') }}

        {{ StyleHelper.generateLessFromArray(properties.month_event.desktop.base, '.ec-body .ec-event') }}
        {{ StyleHelper.generateLessFromArray(properties.month_events.desktop.base, '.ec-body .ec-events') }}

        {{ StyleHelper.generateLessFromArray(properties.month_day_footer.desktop, '.ec-body .ec-day-foot') }}
        {{ StyleHelper.generateLessFromArray(properties.month_more_popup.desktop.base, '.ec-body .ec-popup') }}
    }

    .ec-list {
        {{ StyleHelper.generateLessFromArray(properties.list_border.desktop.base, '.ec-header, .ec-all-day, .ec-body, .ec-days, .ec-day') }}

        {{ StyleHelper.generateLessFromArray(properties.list_day.desktop.base, '.ec-day') }}
        {{ StyleHelper.generateLessFromArray(properties.list_day.desktop.active, '.ec-day.ec-today') }}
        {{ StyleHelper.generateLessFromArray(properties.list_day_date.desktop.base, '.ec-day-side') }}

        {{ StyleHelper.generateLessFromArray(properties.list_event.desktop.base, '.ec-event') }}
        {{ StyleHelper.generateLessFromArray(properties.list_event_tag.desktop.base, '.ec-event-tag') }}

        {{ StyleHelper.generateLessFromArray(properties.list_no_events.desktop.base, '.ec-no-events') }}
    }

    @media screen and (max-width: @const_media_tablet_max_width) {
        {{ StyleHelper.generateLessFromArray(properties.toolbar.tablet.base, '.ec-toolbar') }}
        {{ StyleHelper.generateLessFromArray(properties.toolbar_button.tablet.base, '.ec-button') }}
        {{ StyleHelper.generateLessFromArray(properties.toolbar_spacing.tablet.base, '.ec-toolbar > * > *') }}
        {{ StyleHelper.generateLessFromArray(properties.timezone_label.tablet.base, '.moto-widget-content_section-calendar__footer-wrapper') }}
        .ec-month {
            {{ StyleHelper.generateLessFromArray(properties.month_week_day.tablet.base, '.ec-header .ec-day') }}
            {{ StyleHelper.generateLessFromArray(properties.month_day_header.tablet.base, '.ec-body .ec-day-head') }}

            {{ StyleHelper.generateLessFromArray(properties.month_event.tablet.base, '.ec-body .ec-event') }}
            {{ StyleHelper.generateLessFromArray(properties.month_events.tablet.base, '.ec-body .ec-events') }}

            {{ StyleHelper.generateLessFromArray(properties.month_day_footer.tablet.base, '.ec-body .ec-day-foot') }}
            {{ StyleHelper.generateLessFromArray(properties.month_more_popup.tablet.base, '.ec-body .ec-popup') }}
        }
        .ec-list {
            {{ StyleHelper.generateLessFromArray(properties.list_day.tablet.base, '.ec-day') }}
            {{ StyleHelper.generateLessFromArray(properties.list_event.tablet.base, '.ec-event') }}
            {{ StyleHelper.generateLessFromArray(properties.list_no_events.tablet.base, '.ec-no-events') }}
        }
    }
    @media screen and (max-width: @const_media_mobile-h_max_width) {
        {{ StyleHelper.generateLessFromArray(properties.toolbar['mobile-h'].base, '.ec-toolbar') }}
        {{ StyleHelper.generateLessFromArray(properties.toolbar_button['mobile-h'].base, '.ec-button') }}
        {{ StyleHelper.generateLessFromArray(properties.toolbar_spacing['mobile-h'].base, '.ec-toolbar > * > *') }}
        {{ StyleHelper.generateLessFromArray(properties.timezone_label['mobile-h'].base, '.moto-widget-content_section-calendar__footer-wrapper') }}
        .ec-month {
            {{ StyleHelper.generateLessFromArray(properties.month_week_day['mobile-h'].base, '.ec-header .ec-day') }}
            {{ StyleHelper.generateLessFromArray(properties.month_day_header['mobile-h'].base, '.ec-body .ec-day-head') }}

            {{ StyleHelper.generateLessFromArray(properties.month_event['mobile-h'].base, '.ec-body .ec-event') }}
            {{ StyleHelper.generateLessFromArray(properties.month_events['mobile-h'].base, '.ec-body .ec-events') }}

            {{ StyleHelper.generateLessFromArray(properties.month_day_footer['mobile-h'].base, '.ec-body .ec-day-foot') }}
            {{ StyleHelper.generateLessFromArray(properties.month_more_popup['mobile-h'].base, '.ec-body .ec-popup') }}
        }
        .ec-list {
            {{ StyleHelper.generateLessFromArray(properties.list_day['mobile-h'].base, '.ec-day') }}
            {{ StyleHelper.generateLessFromArray(properties.list_event['mobile-h'].base, '.ec-event') }}
            {{ StyleHelper.generateLessFromArray(properties.list_no_events['mobile-h'].base, '.ec-no-events') }}
        }
    }
    @media screen and (max-width: @const_media_mobile-v_max_width) {
        {{ StyleHelper.generateLessFromArray(properties.toolbar['mobile-v'].base, '.ec-toolbar') }}
        {{ StyleHelper.generateLessFromArray(properties.toolbar_button['mobile-v'].base, '.ec-button') }}
        {{ StyleHelper.generateLessFromArray(properties.toolbar_spacing['mobile-v'].base, '.ec-toolbar > * > *') }}
        {{ StyleHelper.generateLessFromArray(properties.timezone_label['mobile-v'].base, '.moto-widget-content_section-calendar__footer-wrapper') }}
        .ec-month {
            {{ StyleHelper.generateLessFromArray(properties.month_week_day['mobile-v'].base, '.ec-header .ec-day') }}
            {{ StyleHelper.generateLessFromArray(properties.month_day_header['mobile-v'].base, '.ec-body .ec-day-head') }}

            {{ StyleHelper.generateLessFromArray(properties.month_event['mobile-v'].base, '.ec-body .ec-event') }}
            {{ StyleHelper.generateLessFromArray(properties.month_events['mobile-v'].base, '.ec-body .ec-events') }}

            {{ StyleHelper.generateLessFromArray(properties.month_day_footer['mobile-v'].base, '.ec-body .ec-day-foot') }}
            {{ StyleHelper.generateLessFromArray(properties.month_more_popup['mobile-v'].base, '.ec-body .ec-popup') }}
        }
        .ec-list {
            {{ StyleHelper.generateLessFromArray(properties.list_day['mobile-v'].base, '.ec-day') }}
            {{ StyleHelper.generateLessFromArray(properties.list_event['mobile-v'].base, '.ec-event') }}
            {{ StyleHelper.generateLessFromArray(properties.list_no_events['mobile-v'].base, '.ec-no-events') }}
        }
    }

    {% set btnBorders = properties.toolbar_button.desktop.base %}
    {% if not (btnBorders['border-style'] == 'none') and not (btnBorders['border-right-width'] == '0px') %}
        .ec-toolbar .ec-button-group .ec-button:not(:first-child) {
            margin-left: -{{ btnBorders['border-right-width'] }};
        }
    {% endif %}

    {% if isPreview %}
        .ec-button-group .ec-button:not(:last-child) {
            border-top-right-radius: 0;
            border-bottom-right-radius: 0;
        }
        .ec-button-group .ec-button:not(:first-child) {
            border-top-left-radius: 0;
            border-bottom-left-radius: 0;
        }
        .ec-toolbar > * > *:last-child {
            margin-right: 0;
        }
        .ec-month {
            .ec-header {
                border-bottom-left-radius: 0;
                border-bottom-right-radius: 0;
            }
            .ec-header .ec-days {
                border-bottom: none;
            }
            .ec-body {
                border-top-left-radius: 0;
                border-top-right-radius: 0;
                border-top: none;
            }
            .ec-days {
                border-radius: 0;
                border-top: none;
                border-right: none;
                border-left: none;
                &:last-child {
                    border-bottom: none;
                }
            }
            .ec-day {
                border-radius: 0;
                border-top: none;
                border-right: none;
                border-bottom: none;
                &:first-child {
                    border-left: none;
                }
            }
            .ec-popup {
                .ec-day-head {
                    padding-top: 0;
                    padding-left: 0;
                    padding-right: 0;
                }
                .ec-events {
                    margin: 0;
                }
            }
        }
        .ec-list {
            .ec-day {
                border-left: none;
                border-right: none;
                border-radius: 0;
                &:first-child {
                    border-top: none;
                }
            }
            .ec-event {
                border-left: none;
                border-right: none;
                border-bottom: none;
            }
            .ec-day + .ec-event {
                border-top: none;
            }
        }
    {% endif %}
}