@import '../../var.less';

.form-array {
  .array-item {
    .array-item-header {
      position: relative;
      z-index: 2;
      height: 56px;
      padding: 0 16px;
      margin: -1px 0 0;
      line-height: 56px;
      background-color: @table-bg-color;

      .move-up-btn,
      .move-down-btn {
        margin-left: 31px;

        &::before {
          width: 0;
          height: 0;
          vertical-align: text-bottom;
          border: 8px solid @table-bg-color;
          border-bottom: 8px solid @array-com-color;
          content: '';
          transform: translateY(-40%);
        }
      }

      .move-down-btn {
        &::before {
          transform: translateY(10%) rotate(180deg);
        }
      }

      .delete-btn {
        float: right;
        height: 56px;
        line-height: 56px;
      }
    }
  }

  .array-list-footer {
    position: relative;
    z-index: 2;
    padding: 16px;
    margin: -1px 0 0;
    background-color: @table-bg-color;

    .add-btn {
      height: 43px;
      padding: 0;
      font-size: 16px;
      font-weight: 600;
      line-height: 43px;
      color: @array-com-color;
      text-align: center;
      border: 1px solid rgba(0, 3, 56, 0.08);

      &.disabled {
        background-color: @array-disable;
      }
    }
  }
}