
// Menu

.mega-menu {
    > li.menu-item {
        &.active,
        &:hover {
            > a,
            > h5 {
                background: @skinColor;
            }
        }

        > a,
        > h5 {
            text-transform: @menu_text_transform;
        }
    }

    .narrow {
        .popup {
            ul.sub-menu {
                background: @skinColor;
            }

            li.menu-item {
                &:hover {
                    > a,
                    > h5 {
                        background: lighten(@skinColor, 5%);
                    }
                }
            }
        }
    }
    .wide {
        .popup {
            border-top-color: @skinColor;
            color: @body_color;
            > .inner {
                > ul.sub-menu {
                    > li.menu-item {
                        li.menu-item {
                            > a,
                            > h5 {
                                color: @body_color;
                            }
                        }

                        > a,
                        > h5 {
                            text-transform: @menu_text_transform;
                        }
                    }
                }
            }
        }
    }
}

.sidebar-menu {
    > li.menu-item {
        > a,
        > h5 {
            color: @body_color;
			.header-side &{
				text-transform: @menu_text_transform;
			}
        }
        &.active {
            > a,
            > h5 {
                color: @skinColor;
            }
        }
        &:hover {
            background: @skinColor;

            &,
            + li.menu-item {
                > a,
                > h5 {
                    border-top-color: @skinColor;
                }
            }
        }
        > .arrow {
            &:before {
                .sideMenuTopLevelBorder() when (@rtl = 1) {
                    border-right-color: @skinColor;
                }
                .sideMenuTopLevelBorder() when not (@rtl = 1) {
                    border-left-color: @skinColor;
                }
                .sideMenuTopLevelBorder;
            }
        }
    }

    .popup {
        color: @body_color;
    }

    .wide {
        .popup {
            .sideMenuWidePopupBorder() when (@rtl = 1) {
                border-right-color: @skinColor;

                .right-sidebar & {
                    border-left-color: @skinColor;
                }
            }
            .sideMenuWidePopupBorder() when not (@rtl = 1) {
                border-left-color: @skinColor;

                .right-sidebar & {
                    border-right-color: @skinColor;
                }
            }
            .sideMenuWidePopupBorder;

            > .inner {
                > ul.sub-menu {
                    > li.menu-item {
                        li.menu-item {
                            > a,
                            > h5 {
                                color: @body_color;
                            }
                        }

                        > a,
                        > h5 {
                            text-transform: @menu_text_transform;
                        }
                    }
                }
            }
        }
    }

    .narrow {
        .popup {
            ul.sub-menu {
                background: @skinColor;
            }

            li.menu-item:hover {
                > a,
                > h5 {
                    background: lighten(@skinColor, 5%);
                }
            }
        }
    }

    .menu-custom-block {
        a {
            color: @body_color;
            &:hover {
                background-color: @skinColor;

                &,
                + a {
                    border-top-color: @skinColor;
                }
            }
        }
    }
}

.mega-menu,
.sidebar-menu,
.accordion-menu,
.menu-custom-block {
    .tip {
        background: @main_menu_tip_bg_color;
        .tip-arrow {
            color: @main_menu_tip_bg_color;
        }
    }
}

.view-switcher,
.currency-switcher{
	.narrow{
		.popup{
			li.menu-item{
				> a,
				> h5{
					text-transform: @menu_text_transform;
				}
			}
		}
	}
}