.model-clipboard-import-view {
  position: relative;
  height: 100%;
  background-color: white;
  color: #888;
  border: 1px solid #f0f0f0;

  >.el-card__header {
      border-bottom: 1px solid #f0f0f0;
      padding: 9px 10px;

      >.model-clipboard-import-view-header {

          >.ivu-btn {
              float: right;
              margin-left: 6px;
          }

          >.ivu-btn.ivu-btn-text {
              padding: 0px 3px;
              color: #888;
          }
      }
  }

  >.el-card__body {
      height: calc(100% - 37px);
      padding: 6px;

      >.model-clipboard-import-view-content {
          height: 100%;
          display: flex;

          >.import-warp {
              width:calc(100% - 200px);
              padding: 0px 6px 0px 0px;

              >.drop-area {
                  position: relative;
                  height: 100px;
                  border: 1px solid #f0f0f0;
                  border-radius: 5px;

                  >.drop-area-draggable {
                      height: 100%;
                      display: flex;
                      padding: 6px;
                      
                      >.model-drag-item {
                          position: relative;
                          height: 100%;
                          border: 1px solid #f0f0f0;
                          border-radius: 5px;
                          padding: 3px 12px 3px 3px;
                          margin-right: 6px;

                          >.actions {
                              position: absolute;
                              top: 0px;
                              right: 5px;

                              >.action-item {
                                  cursor: pointer;
                              }
                          }
                      }
                  }

                  >.drop-tooltip {
                      position: absolute;
                      height: 100%;
                      width: 100%;
                      top: 0px;
                      display: flex;
                      justify-content: center;
                      align-items: center;
                      font-size: 24px;
                      font-weight: 700;
                      z-index: 1;
                  }
              }

              >.model-edit {
                  position: relative;
                  margin-top: 6px;
                  height: calc(100% - 106px);
                  border-radius: 5px;
                  border: 1px solid #f0f0f0;

                  >.edit-actions {
                      position: absolute;
                      top: 5px;
                      right: 40px;
                      z-index: 10;

                      >.ivu-btn {
                          margin-left: 5px;
                          color:#888;
                          border: 1px solid #f0f0f0;
                      }

                      >.ivu-btn:hover {
                          margin-left: 5px;
                          color:#57a3f3;
                          border: 1px solid #57a3f3;
                      }
                  }
              }
          }

          >.model-material-warp {
              position: relative;
              flex-shrink: 0;
              width: 200px;
              border-radius: 5px;
              border: 1px solid #f0f0f0;

              >.model-material-title {
                  padding: 6px;
                  text-align: center;
                  font-weight: 700;
                  border-bottom: 1px solid #f0f0f0;
              }

              >.model-material-content {
                  padding: 6px;

                  >.model-material-item {
                      border: 1px solid #f0f0f0;
                      padding: 3px 5px;
                      margin-bottom: 5px;
                      border-radius: 5px;
                      cursor: move;

                      >.title {
                          font-weight: 700;
                      }
                  }
              }

              >.model-material-tooltip {
                  position: absolute;
                  height: 100%;
                  width: 100%;
                  top: 0px;
                  display: flex;
                  justify-content: center;
                  align-items: center;
                  font-size: 24px;
                  font-weight: 700;
                  z-index: 1;
              }
          }
      }
  }
}