.process-page {
  padding: 16px 24px 60px;

  /* .header {
    @apply flex justify-between;
    .tabs {
      .tab {
        @apply inline-block border-none cursor-pointer;
        background: #fff;
        border-radius: 3px;
        margin-right: 8px;
        padding: 5px 16px;
        color: #808695;
        box-shadow: 0 2px 14px 0 rgba(0, 0, 0, 0.04);

        &.active {
          color: #2d8cf0 !important;
        }

        &:hover {
          color: #515a6e;
        }
      }
    }

    .el-button {
      box-shadow: 0 2px 14px 0 rgba(0, 0, 0, 0.1);
    }
  } */

  .wrap {
    @apply flex items-start;

    .el-card {
      border: none;

      &.step {
        width: 280px;
        min-height: 450px;
      }

      &.preview {
        @apply flex-1;
        margin-left: 16px;
        min-height: 900px;

        .area {
          @apply flex items-center justify-center;
          height: 500px;
          background: #e7e7e7;
          border-radius: 4px;
        }

        .btn-wrap {
          @apply text-right;
          margin-top: 20px;
        }
      }

      :deep(.el-tree) {
        .el-tree-node__content {
          @apply cursor-default;
          background: transparent !important;
          height: 30px;

          .el-tree-node__expand-icon {
            display: none;
            margin: 0;
          }
        }
      }
    }

    .btns {
      text-align: right;
      margin-bottom: 16px;
    }
  }
}