.selected-user-list {
  :global {
    position: relative;
    border-left: 1px solid #ececec;
    box-sizing: border-box;

    .arrowIcon {
      position: absolute;
      top: 50%;
      cursor: pointer;
      z-index: 9;
      transform: translateY(-50%);
    }

    .selected-user-list-body {
      position: absolute;
      top: 16px;
      bottom: 18px;
      left: 16px;
      right: 0;
      padding-right: 16px;
      overflow-y: auto;

      .selected-user-status {
        color: #777;
        margin-bottom: 24px;
        font-size: 12px;
        line-height: 17px;
      }

      .selected-list-item {
        width: 100%;
        margin-bottom: 16px;

        .selected-list-item-container {
          display: flex;
          flex-wrap: wrap;
          flex-direction: row;
          position: relative;
          left: -6px;

          .selected-node {
            display: flex;
            flex-direction: row;
            justify-content: space-between;
            max-width: 100%;
            background: #f4f4f4;
            padding: 0 8px;
            font-size: 13px;
            color: #555;
            line-height: 22px;
            margin-left: 6px;
            margin-bottom: 8px;
            border-radius: 4px;

            & > p {
              flex: 1;
              margin: 0;

              .orgName {
                opacity: 0.6;
              }
            }

            & > i {
              margin-left: 8px;
              position: relative;
              color: #979797;
              font-size: 12px;
              & > svg {
                position: relative;
                top: 5px;
              }
            }
          }
        }

        .selected-item-title {
          width: 100%;
          display: flex;
          flex-direction: row;
          justify-content: space-between;
          margin-bottom: 9px;

          .left {
            flex: 1;
            color: #2b2b2b;
            font-size: 14px;
            line-height: 20px;
            span {
              color: #999;
              font-size: 12px;
            }
          }

          .ant-btn {
            font-size: 12px;
            color: #595959;
            line-height: 17px;
            height: 18px;
            padding: 0 6px;

            &:hover {
              border-color: #d9d9d9;
            }
          }
        }
      }
    }
  }

  &.close {
    width: 215px;
    transition: width 1s;
    .arrowIcon {
      left: -15px;
    }
  }

  &.open {
    width: 100%;
    transition: width 1s;
    margin-left: 0;
    .arrowIcon {
      left: -1px;
    }
  }
}
