.app__wrap--Classic,
.app__wrap--LeftTop {
  .horizontal-collapse-transition {
    transition: 0s width ease-in-out, 0s padding-left ease-in-out, 0s padding-right ease-in-out !important;
  }
  .sidebar-container {
    background: @menuBg;
    .el-menu {
      // background-color: @menuBg !important;
      .el-menu-item,
      .el-submenu__title {
        color: @menuText !important;
        background-color: @menuBg !important;
        i {
          color: @menuText !important;
        }
      }
      .el-submenu {
        .el-menu-item,
        .el-submenu {
          background-color: @subMenuBg !important;
        }
        .is-active {
          color: @menuActiveText !important;
          background-color: @subMenuHover !important;
          &>.el-submenu__title {
            color: @menuActiveText !important;
          }
        }
        .is-opened,
        .el-menu {
          background-color: @subMenuBg !important;
          .el-submenu__title {
            background-color: @subMenuBg !important;
          }
        }
      }
      // menu hover
      .submenu-title-noDropdown,
      .el-submenu__title {
        &:hover {
          background-color: @menuBg !important;
          color: @subMenuActiveText !important;
        }
      }
      .el-menu-item:hover {
        color: @subMenuActiveText !important;
        // background-color: @subMenuHover !important;
      }
      .is-active {
        color: @menuActiveText !important;
        background-color: @subMenuHover !important;
        &:hover {
          color: @subMenuActiveText !important;
          background-color: @subMenuHover !important;
        }
        &>.el-submenu__title {
          color: @menuActiveText !important;
        }
      }
    }
    .el-menu--collapse {
      &>div>.el-submenu {
        i {
          display: none;
        }
      }
      .is-active {
        &>.el-submenu__title {
          background-color: @subMenuHover !important;
        }
      }
    }
  }
}

.nest-popper-menu {
  background: @menuBg;
  .el-menu {
    background-color: @menuBg !important;
      
    .el-menu-item,
    .el-submenu__title {
      color: @menuText !important;
      background-color: @menuBg !important;
      i {
        color: @menuText !important;
      }
    }
      
    .is-active {
      color: @menuActiveText !important;
      background-color: @subMenuHover !important;
      &>.el-submenu__title {
        color: @menuActiveText !important;
      }
    }

    // menu hover
    .submenu-title-noDropdown,
    .el-submenu__title {
      &:hover {
        background-color: @menuBg !important;
        color: @subMenuActiveText !important;
      }
    }
    .el-menu-item:hover {
      color: @subMenuActiveText !important;
      // background-color: @subMenuHover !important;
    }
  }
}

.app__wrap--Top {
  .sidebar-container {
    background: @topMenuBg;
    .el-menu {
      background-color: @topMenuBg !important;
      .el-menu-item,
      .el-submenu__title {
        color: @topMenuText !important;
        background-color: @topMenuBg !important;
        i {
          color: @topMenuText !important;
        }
      }
      
      .is-active {
        color: @topMenuActiveText !important;
        &>.el-submenu__title {
          color: @topMenuActiveText !important;
        }
      }
      .is-opened {
        .el-menu-item {
          background-color: @subMenuBg !important;
        }
      }

      // menu hover
      .submenu-title-noDropdown,
      .el-submenu__title {
        &:hover {
          color: @topSMenuActiveText !important;
        }
      }
      .el-menu-item:hover {
        color: @topMenuActiveText !important;
      }
    }
  }
}

.top-popper-menu {
  background: @topMenuBg;
  .el-menu {
    background-color: @topMenuBg !important;
      
    .el-menu-item,
    .el-submenu__title {
      color: @topMenuText !important;
      background-color: @topMenuBg !important;
    }
      
    .is-active {
      color: @topMenuActiveText !important;
      // background-color: @subMenuHover !important;
      &>.el-submenu__title {
        color: @topMenuActiveText !important;
      }
    }

    // menu hover
    .submenu-title-noDropdown,
    .el-submenu__title {
      &:hover {
        background-color: @topMenuBg !important;
        color: @topSMenuHover !important;
      }
    }
    .el-menu-item:hover {
      color: @topSMenuHover !important;
      // background-color: @subMenuHover !important;
    }
  }
}
