html[dir="rtl"] {
  @component-namespace el {
    @component-namespace el {
      @b menu {
        padding-right: 0;

        @m horizontal {
          & .el-menu-item {
            float: right;
          }

          & .el-submenu {
            float: right;

            >.el-menu {
              right: 0;
            }

            & .el-submenu__icon-arrow {
              margin-right: 5px;
              margin-left: 0;
            }
          }
        }
      }

      @b menu-item {
        & [class^="el-icon-"] {
          margin-left: 10px;
          margin-right: 0;
        }

        &:first-child {
          margin-right: 0;
        }

        &:last-child {
          margin-left: 0;
        }
      }

      @b submenu {
        @e title {
          text-align: right;
        }

        @e icon-arrow {
          left: 20px;
          right: auto;
        }

        [class^="el-icon-"] {
          margin-left: 10px;
          margin-right: 0;
        }
      }

      @b menu-item-group {
        @e title {
          text-align: right;
        }

        @e title {
          padding-left: 0;
          padding-right: 20px;
        }
      }

      .el-menu-item {
        text-align: right;
      }
    }
  }
}