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

{{ StyleHelper.generatePresetSelector('.moto-widget-menu', item.class_name) }} {
    .moto-widget-menu-list {
        {{ StyleHelper.generateLessFromArray(properties.menu_container.desktop.base) }}
        .moto-widget-menu-item {
            {{ StyleHelper.generateLessFromArray(properties.menu_item_delimiter.desktop.base) }}
            &:hover {
                .moto-widget-menu-link-level-1 {
                    {{ StyleHelper.generateLessFromArray(properties.menu_item.desktop.hover) }}
                    .moto-widget-menu-link-arrow {
                        {{ StyleHelper.generateLessFromArray(properties.menu_item_icon.desktop.hover) }}
                    }
                }
            }
            .moto-widget-menu-link-level-1 {
                {{ StyleHelper.generateLessFromArray(properties.menu_item.desktop.base) }}
                .moto-widget-menu-link-arrow {
                    {{ StyleHelper.generateLessFromArray(properties.menu_item_icon.desktop.base) }}
                }
                &.moto-widget-menu-link-active {
                    {{ StyleHelper.generateLessFromArray(properties.menu_item_active.desktop.base) }}
                    .moto-widget-menu-link-arrow {
                        {{ StyleHelper.generateLessFromArray(properties.menu_item_icon_active.desktop.base) }}
                    }
                    &:hover {
                        {{ StyleHelper.generateLessFromArray(properties.menu_item_active.desktop.hover) }}
                        .moto-widget-menu-link-arrow {
                            {{ StyleHelper.generateLessFromArray(properties.menu_item_icon_active.desktop.hover) }}
                        }
                    }
                }
            }
        }
    }

    .moto-widget-menu-sublist {
        {{ StyleHelper.generateLessFromArray(properties.sub_menu_container.desktop.base) }}
        .moto-widget-menu-item {
            &:hover {
                > .moto-widget-menu-link {
                    {{ StyleHelper.generateLessFromArray(properties.sub_menu_item.desktop.hover) }}
                    .moto-widget-menu-link-arrow {
                        {{ StyleHelper.generateLessFromArray(properties.sub_menu_item_icon.desktop.hover) }}
                    }
                }
            }
            .moto-widget-menu-link {
                {{ StyleHelper.generateLessFromArray(properties.sub_menu_item.desktop.base) }}
                &.moto-widget-menu-link-active {
                    {{ StyleHelper.generateLessFromArray(properties.sub_menu_item_active.desktop.base) }}
                    .moto-widget-menu-link-arrow {
                        {{ StyleHelper.generateLessFromArray(properties.sub_menu_item_active_icon.desktop.base) }}
                    }
                    &:hover {
                        {{ StyleHelper.generateLessFromArray(properties.sub_menu_item_active.desktop.hover) }}
                        .moto-widget-menu-link-arrow {
                            {{ StyleHelper.generateLessFromArray(properties.sub_menu_item_active_icon.desktop.hover) }}
                        }
                    }
                }
            }
            .moto-widget-menu-link-arrow {
                {{ StyleHelper.generateLessFromArray(properties.sub_menu_item_icon.desktop.base) }}
            }
        }
    }
    .moto-widget-menu-toggle-btn {
        {{ StyleHelper.generateLessFromArray(properties.mobile_icon.mobile.base) }}
    }
    &.moto-widget-menu-mobile-open {
        @media screen and (max-width: @const_media_mobile-h_max_width) {
            .moto-widget-menu-toggle-btn {
                {{ StyleHelper.generateLessFromArray(properties.mobile_icon_active.mobile.base) }}
            }
            .moto-widget-menu-list {
                {{ StyleHelper.generateLessFromArray(properties.mobile_menu_container.mobile.base) }}
                .moto-widget-menu-item {
                    {{ StyleHelper.generateLessFromArray(properties.mobile_menu_item_delimiter.mobile.base) }}
                    .moto-widget-menu-link {
                        {{ StyleHelper.generateLessFromArray(properties.mobile_menu_item.mobile.base) }}
                        .moto-widget-menu-link-arrow {
                            {{ StyleHelper.generateLessFromArray(properties.mobile_menu_item_icon.mobile.base) }}
                        }
                        &.moto-widget-menu-link-active {
                            {{ StyleHelper.generateLessFromArray(properties.mobile_menu_item_active.mobile.base) }}
                            .moto-widget-menu-link-arrow {
                                {{ StyleHelper.generateLessFromArray(properties.mobile_menu_item_icon_active.mobile.base) }}
                            }
                        }
                    }
                }
                .moto-widget-menu-sublist {
                    {{ StyleHelper.generateLessFromArray(properties.mobile_sub_menu_container.mobile.base) }}
                    .moto-widget-menu-link {
                        {{ StyleHelper.generateLessFromArray(properties.mobile_sub_menu_item.mobile.base) }}
                        &.moto-widget-menu-link-active {
                            {{ StyleHelper.generateLessFromArray(properties.mobile_sub_menu_item_active.mobile.base) }}
                            .moto-widget-menu-link-arrow {
                                {{ StyleHelper.generateLessFromArray(properties.mobile_sub_menu_item_active_icon.mobile.base) }}
                            }
                        }
                    }
                    .moto-widget-menu-link-arrow {
                        {{ StyleHelper.generateLessFromArray(properties.mobile_sub_menu_item_icon.mobile.base) }}
                    }
                }
            }
        }
    }
    {% if properties.menu_item.desktop.base['font-size'] %}
        .moto-widget-menu-list {
            .moto-widget-menu-item {
                .moto-widget-menu-link-level-1 {
                    font-size: {{properties.menu_item.desktop.base['font-size']}} !important;
                    {% if properties.menu_item.tablet.base['font-size'] %}
                        @media screen and (max-width: {{ StyleHelper.getConstant('const_media_tablet_max_width') }}) {
                            font-size: {{properties.menu_item.tablet.base['font-size']}} !important;
                        }
                    {% endif %}
                    {% if properties.menu_item['mobile-h'].base['font-size'] %}
                        @media screen and (max-width: {{ StyleHelper.getConstant('const_media_mobile-h_max_width') }}) {
                            font-size: {{properties.menu_item['mobile-h'].base['font-size']}} !important;
                        }
                    {% endif %}
                    {% if properties.menu_item['mobile-v'].base['font-size'] %}
                        @media screen and (max-width: {{ StyleHelper.getConstant('const_media_mobile-v_max_width') }}) {
                            font-size: {{properties.menu_item['mobile-v'].base['font-size']}} !important;
                        }
                    {% endif %}
                }
            }
        }
    {% endif %}
    {% if properties.sub_menu_item.desktop.base['font-size'] %}
        .moto-widget-menu-sublist {
            .moto-widget-menu-item {
                .moto-widget-menu-link {
                    font-size: {{properties.sub_menu_item.desktop.base['font-size']}} !important;
                    {% if properties.sub_menu_item.tablet.base['font-size'] %}
                        @media screen and (max-width: {{ StyleHelper.getConstant('const_media_tablet_max_width') }}) {
                            font-size: {{properties.sub_menu_item.tablet.base['font-size']}} !important;
                        }
                    {% endif %}
                    {% if properties.sub_menu_item['mobile-h'].base['font-size'] %}
                        @media screen and (max-width: {{ StyleHelper.getConstant('const_media_mobile-h_max_width') }}) {
                            font-size: {{properties.sub_menu_item['mobile-h'].base['font-size']}} !important;
                        }
                    {% endif %}
                    {% if properties.sub_menu_item['mobile-v'].base['font-size'] %}
                        @media screen and (max-width: {{ StyleHelper.getConstant('const_media_mobile-v_max_width') }}) {
                            font-size: {{properties.sub_menu_item['mobile-v'].base['font-size']}} !important;
                        }
                    {% endif %}
                }
            }
        }
    {% endif %}
}