.pro-upload  {

  .filelist-item-wrapper {
    .file-info-box {
      display: flex;
      align-items: center;
      width: 100%;
      height: 30px;
      margin-top: var(--zaui-space-size-sm, 8px);
      color: var(--zaui-text, #343434);
      font-size: var(--zaui-font-size-sm, 12px);
      line-height: 16px;
      &:hover {
        background: #F8F9FA;
        border-radius: var(--zaui-border-radius, 4px);
        color: var(--zaui-brand);
        .file-actions-wrap {
          .file-actions{
            display: flex;
            .file-action-item{
              color: var(--zaui-brand);
            }
          }
        }
      }
      &.file-box-error {
        color: var(--zaui-danger);

        .file-actions-wrap {
          .file-actions{
            display: flex;
            .file-action-item{
              color: var(--zaui-danger);
            }
          }
        }

      }

      .file-type-icon {
        display: block;
        width: 18px;
        height: 23px;
        margin-left: 6px;
        overflow: hidden;
        position: absolute;
      }
      .file-name {
        display: box;
        padding-left: var(--zaui-space-size-lg, 32px);
        overflow: hidden;
        line-clamp: 1;
        box-orient: vertical;
        word-break: break-all;
      }
      .file-name.file-name-pf0 {
        padding-left: 0;
      }


      .file-actions-wrap {
        width: 100px;
        margin-left: auto;
        .file-actions {
          display: none;
          justify-content: right;

          transition: all 1s;

          .file-action-item {
            margin-left: var(--zaui-space-size-sm, 8px);
            padding: 0;
            cursor: pointer;
            color: var(--zaui-brand);
          }
        }
      }
    }
  }

  // 单个文件拖拽控件
  .drag-Single-item-wrapper {
    .file-info-box {
      display: flex;
      align-items: center;
      width: 100%;
      height: 30px;
      margin-top: var(--zaui-space-size-sm, 8px);
      color: var(--zaui-text, #343434);

      font-size: var(--zaui-font-size-sm, 12px);
      line-height: 16px;
      justify-content: center;
      &:hover {
        background: #F8F9FA;
        border-radius: var(--zaui-border-radius, 4px);
      }
      &:hover,&.file-box-error {
        .file-actions-wrap {
          .file-actions{
            display: flex;
          }
        }

      }

      .file-type-icon {
        display: block;
        width: 18px;
        height: 23px;
        margin-left: 6px;
        overflow: hidden;
        position: absolute;
      }
      .file-name {
        display: box;
        padding-left: var(--zaui-space-size-sm, 8px);
        overflow: hidden;
        line-clamp: 1;
        box-orient: vertical;
        word-break: keep-all;
      }
      .file-name.file-name-pf0 {
        padding-left: 0;
      }

      &.file-box-error {
        color: var(--zaui-danger, #FF005F);
      }

      .file-actions-wrap {
        margin-left: 10px;
        .file-actions {
          justify-content: right;
          transition: all 1s;
          display: flex;
          .file-action-item {
            margin-left: var(--zaui-space-size-sm, 8px);
            padding: 0;
            cursor: pointer;
            color: var(--zaui-brand);
          }
        }
      }
    }
  }

}