index.less

.@{pro-table-prefix} {
  // .reset-component();

  &-layout-tool {
    .@{header-prefix} {
      padding-bottom: 0;

      &-title {
        color: @text-color;
        font-weight: @font-weight-md;
      }
    }

    &-header {
      &-icon {
        color: @text-color;

        &:hover {
          color: @color-primary;
        }

        &&-active {
          color: @color-primary;
        }
      }
    }

    &-search-wrapper {
      padding-top: @spacing-xs;
      padding-bottom: @spacing-xs;
    }

    &-select-wrapper {
      display: flex;
      align-items: center;
      justify-content: space-between;
      height: @height-md;

      .@{checkbox-prefix}-input {
        margin: 0 4px;
      }
    }

    &-tree {
      &-wrapper {
        max-height: 320px;
        overflow: auto;

        &:not(&-with-children) {
          .@{tree-prefix} {
            &-node-expand-noop {
              width: 0;
            }
          }
        }

        .@{tree-prefix} {
          &-node {
            &-content-suffix {
              visibility: hidden;

              .@{icon-prefix} {
                padding: @spacing-xs;
              }
            }

            &:hover .@{tree-prefix}-node-content-suffix {
              visibility: visible;
            }
          }

          .@{empty-prefix} {
            margin: 0;
          }
        }
      }

      &-title {
        height: @height-sm;
        line-height: @height-sm;
      }
    }
  }

  .@{table-prefix}-container {
    .@{pro-table-prefix}-layout-tool-trigger {
      position: absolute;
      right: 1px;
      top: 1px;
      padding: 0 @spacing-md - 1px;
      z-index: 3;
      font-size: @font-size-lg;
      color: @table-head-color;
      background-color: @table-head-background-color;
      cursor: pointer;

      &::before {
        position: absolute;
        top: 50%;
        left: 0;
        width: 1px;
        background-color: rgb(0 0 0 / 6%);
        transform: translateY(-50%);
        content: '';
      }
    }

    .@{pro-table-prefix}-layout-tool-trigger + .@{table-prefix}-content {
      table > thead > tr:first-child {
        th:last-child {
          .@{table-prefix}-sortable-trigger {
            margin-right: 40px;
          }
        }
      }
    }
  }

  &.@{table-prefix}-lg .@{table-prefix}-container .@{pro-table-prefix}-layout-tool-trigger {
    line-height: calc(@table-head-row-height-lg - 2px);
    &::before {
      height: calc(@table-head-row-height-lg / 2);
    }
  }

  &.@{table-prefix}-md .@{table-prefix}-container .@{pro-table-prefix}-layout-tool-trigger {
    line-height: calc(@table-head-row-height-md - 2px);

    &::before {
      height: calc(@table-head-row-height-md / 2);
    }
  }

  &.@{table-prefix}-sm .@{table-prefix}-container .@{pro-table-prefix}-layout-tool-trigger {
    line-height: calc(@table-head-row-height-sm - 2px);

    &::before {
      height: calc(@table-head-row-height-sm / 2);
    }
  }

  .cdk-resizable {
    &-preview {
      position: absolute;
      top: 0;
      left: 0;
      z-index: 8;
      border-right: 2px @border-style #d1d1d1;
    }
  }
}