@import (reference) "../theme/variables/antdVariables.less";
/* --- 扩展组件: Table改造 --- */
@table-prefix-cls: ~"@{ant-prefix}-table";
@select-prefix-cls: ~"@{ant-prefix}-select";
@switch-prefix-cls: ~"@{ant-prefix}-switch";
@calendar-prefix-cls: ~"@{ant-prefix}-calendar";
@tableHead-prefix-cls: ~"table-head";
@form-prefix-cls: ~"@{ant-prefix}-form";
@form-item-prefix-cls: ~"@{form-prefix-cls}-item";
@cascader-prefix-cls: ~"@{ant-prefix}-cascader";
@table-selection-column: ~"@{table-prefix-cls}-selection-column";

.ued-table-filters,
.ued-table-wrap {
  display: flex;
  flex-direction: column;
  background-color: #fff;

  .@{form-prefix-cls} {
    flex: 1 1 auto;
    display: flex;
    flex-direction: column;
  }

  .@{ant-prefix}-spin-nested-loading {
    height: 100%;
  }

  .@{ant-prefix}-spin-container {
    display: flex;
    flex-direction: column;
    height: 100%;
  }

  .@{ant-prefix}-table-pagination {
    margin-top: auto !important;
  }

  .@{ant-prefix}-table .@{ant-prefix}-table-tbody {
    background-color: transparent;
    tr.@{ant-prefix}-table-row {
      &.ued-table-click-active > td {
        background: @dropdown-selected-bg;
      }
      &.ued-table-click-active:hover:not(.@{ant-prefix}-table-row-selected) > td {
        background: @dropdown-selected-bg;
      }
    }
  }

  /* 空表格样式 */
  .@{ant-prefix}-table-empty,
  .@{ant-prefix}-table-empty .@{ant-prefix}-table-container,
  .@{ant-prefix}-table-empty .@{ant-prefix}-table-content,
  .@{ant-prefix}-table-empty .@{ant-prefix}-table-content table {
    height: 100%;
  }
  .ued-table .@{ant-prefix}-table-empty .@{ant-prefix}-table-tbody > tr > td {
    border: none;
  }

  .@{ant-prefix}-table-expanded-row-fixed:has(.@{ant-prefix}-empty-normal) {
    width: 100% !important;
  }

  .@{ant-prefix}-table-summary {
    background: transparent;
  }

  .table-head-default,
  .table-head-middle {
    margin-bottom: 16px;
    font-size: @font-size-lg;
  }

  .table-head-small {
    margin-bottom: 12px;
    font-size: @font-size-base;
  }

  .ued-table {
    flex: 1 1 auto;

    .@{ant-prefix}-table-pagination.@{ant-prefix}-pagination {
      // 去除分页默认下边距
      margin-bottom: 0;
    }
    .@{table-prefix-cls}-tbody
      > tr.@{table-prefix-cls}-row:hover:not(.@{table-prefix-cls}-row-selected)
      > td {
        background: linear-gradient(0deg, @dropdown-hover-bg 0%, @dropdown-hover-bg 100%), #FFF;
    }

    .@{ant-prefix}-table-tbody>tr>td {
      padding: 6px 8px 6px 8px;
    }

    .@{table-prefix-cls} {
      line-height: @table-data-input-height;

      .@{ant-prefix}-skeleton-element {
        width: 100%;

        .@{ant-prefix}-skeleton-input {
          border-radius: 3px;
          min-width: 0;
          width: 100%;
        }
      }

      // 覆盖原生样式颜色（跟随@link-color），改为跟随主题色
      &-row-expand-icon {
        &:focus,
        &:hover {
          color: color(~`colorPalette("@{primary-color}", 5) `);
        }

        &:active {
          color: color(~`colorPalette("@{primary-color}", 7) `);
        }
      }

      // 动态计算图展开列宽度
      &-expand-icon-col {
        width: (@table-padding-horizontal + ceil(@font-size-sm * 1.4));
      }

      table {
        border-radius: 0;
        .@{table-prefix-cls}-thead {
            th {
              background: #f7f8fa;
              padding: 6px 8px 6px 8px;
        
              &.ued-table-head-expand-space {
                padding-left: 32px;
              }
        
              &.@{ant-prefix}-table-cell-fix-right,
              &.@{ant-prefix}-table-cell-fix-left {
                &:not(.ued-fixed-th) {
                  // 避免由于antd内部计算错列占比，导致非固定列也出现sticky定位
                  position: static !important;
                }
        
                &.ued-fixed-th+.@{ant-prefix}-table-cell {
                  &.@{ant-prefix}-table-cell-fix-right,
                  &.@{ant-prefix}-table-cell-fix-left {
                    position: sticky !important;
                  }
                }
              }
            }
          }
        .@{table-prefix-cls}-row-selected {
          td {
            background: linear-gradient(0deg, @dropdown-table-checked-bg 0%, @dropdown-table-checked-bg 100%), #FFF;
          }
        }
        tr {
          td,
          th {
            height: @table-td-height;
            &.@{table-selection-column} {
              label.@{checkbox-prefix-cls}-wrapper,
              label.@{radio-prefix-cls}-wrapper {
                line-height: @table-data-input-height - 2px;
              }
            }
          }
          &.@{ant-prefix}-table-measure-row {
            // 修复部分浏览器下开启内容滚动后出现空白tr问题
            td {
              min-height: 0;
              height: 0;
            }
          }
        }

        .ued-table-edit-cell {
          // 可编辑元素套一层组件，解决层级表格编辑格式时样式错乱问题
          display: flex;
          align-items: center;
          width: 100%;
          .@{ant-prefix}-form-item {
            flex: 1 1 auto;
          }
        }

        // colgroup > col {
        //   &.@{ant-prefix}-table-selection-col + col {
        //     // 避免层级表格展开时宽度变化，若没有配置内容列宽度的，默认给第一个表头一个宽度
        //     width: 240px;
        //   }
        //   &:not(.@{ant-prefix}-table-expand-icon-col):not(
        //       .@{ant-prefix}-table-selection-col
        //     ):first-of-type {
        //     // 避免层级表格展开时宽度变化，若没有配置内容列宽度的，默认给第一个表头一个宽度
        //     width: 240px;
        //   }
        // }

        tr > td {
          position: relative;

          &:empty {
            height: @table-td-height;
          }

          .@{ant-prefix}-input:not(textarea),
          .@{ant-prefix}-input-number,
          .@{calendar-prefix-cls}-picker,
          .@{select-prefix-cls},
          .modalSelect {
            width: 100%;
            flex: 1;
          }

          .@{ant-prefix}-input:not(textarea),
          .@{ant-prefix}-input-number,
          .@{ant-prefix}-input-number-input,
          .@{calendar-prefix-cls}-picker,
          .@{switch-prefix-cls},
          .@{select-prefix-cls},
          .@{select-prefix-cls} .@{select-prefix-cls}-selector,
          .@{select-prefix-cls}
            .@{select-prefix-cls}-selector
            .@{select-prefix-cls}-selection-search
            input {
            height: @table-data-input-height;
            line-height: @table-data-input-height;
          }

          .@{ant-prefix}-input:not(textarea) {
            padding: 4px 8px;
          }

          textarea.@{ant-prefix}-input {
            margin: 0 auto;
          }

          .@{select-prefix-cls} {
            .@{select-prefix-cls}-selector {
              .@{select-prefix-cls}-selection-item,
              .@{select-prefix-cls}-selection-placeholder {
                line-height: @table-data-input-height - 2px;
              }
            }

            &.@{select-prefix-cls}-multiple {
              .@{select-prefix-cls}-selector {
                padding-top: 0;
                padding-bottom: 0;

                &::after {
                  margin: 0;
                }
              }

              .@{select-prefix-cls}-selector
                .@{select-prefix-cls}-selection-search
                input {
                height: @table-data-input-height - 2px;
                line-height: @table-data-input-height - 2px;
              }
            }
          }

          .@{switch-prefix-cls} {
            margin: 0;

            @switch-handle-input-height: @table-data-input-height - 4px;
            min-width: @switch-handle-input-height * 2;

            &-handle {
              &::before {
                border-radius: 50%;
              }

              width: @switch-handle-input-height;
              height: @switch-handle-input-height;
            }

            &.@{switch-prefix-cls}-checked {
              .@{switch-prefix-cls}-handle {
                left: calc(~"100%" - @switch-handle-input-height - 2px);
              }
            }
          }

          .modalSelect {
            .@{select-prefix-cls} {
              position: relative;
              top: 0;
              margin-top: 0;
              width: 100%;
            }

            .@{ant-prefix}-input-group-addon,
            &.@{ant-prefix}-input-group {
              line-height: @table-data-input-height - 2px;
            }
          }

          .@{form-item-prefix-cls} {
            // 高度为0时，弹窗选择组件会显示不全，先去除，有发现影响其他组件的情况再做调整
            // height: 0;
            line-height: @table-data-input-height - 2px;

            .@{ant-prefix}-input:not(textarea),
            .@{ant-prefix}-input-number,
            .@{calendar-prefix-cls}-picker,
            .@{select-prefix-cls},
            .modalSelect {
              width: 100%;
            }

            &-children {
              display: flex;
              align-items: center;
              // height: 0px !important;
            }

            .has-error {
              .@{form-prefix-cls}-explain {
                position: relative;
                top: 4px;
                z-index: 1;
              }

              .@{ant-prefix}-picker {
                border-color: @error-color;
              }

              .@{ant-prefix}-input:not(textarea),
              .@{ant-prefix}-input-number,
              .@{calendar-prefix-cls}-picker,
              .@{select-prefix-cls},
              .modalSelect {
                position: relative;
                top: 0;
                margin-top: 0;
              }

              .@{form-item-prefix-cls}-children {
                height: auto !important;
              }
            }
          }
        }
      }

      &:not(.@{table-prefix-cls}-bordered) {
        .@{table-prefix-cls}-thead {
          tr {
            th.@{table-prefix-cls}-cell {
              &::before {
                display: none;
              }

              &.divider {
                &::before {
                  position: absolute;
                  top: 50%;
                  left: 0;
                  display: block;
                  width: 1px;
                  height: 1.6em;
                  background-color: rgba(0, 0, 0, 0.06);
                  transform: translateY(-50%);
                  transition: background-color 0.3s;
                  content: "";
                }
              }
            }
          }
        }
      }

      &-thead {
        > tr > th {
          background: @table-header-bg;
          border-bottom: @border-width-base @border-style-base
            @table-border-color;
        }

        > tr:first-child {
          > th:first-child,
          > th:last-child {
            border-radius: 0;
          }
        }
      }

      &-tbody {
        > tr > td {
          border-bottom: @border-width-base @border-style-base
            @table-border-color;
        }

        // 修补嵌套子表格的样式
        // ========================= Nest Table ===========================
        .@{table-prefix-cls}-wrapper:only-child,
        .@{table-prefix-cls}-expanded-row-fixed
          > .@{table-prefix-cls}-wrapper:only-child {
          .@{table-prefix-cls} {
            margin: -@table-padding-vertical -@table-padding-horizontal -@table-padding-vertical
              (@table-padding-horizontal + ceil(@font-size-sm * 1.4));

            &-tbody > tr:last-child > td {
              border-bottom: 0;

              &:first-child,
              &:last-child {
                border-radius: 0;
              }
            }
          }
        }
      }

      &-small {
        font-size: @font-size-sm;
        line-height: @small-table-data-input-line-height;
        border: none;

        &.@{ant-prefix}-table-bordered {
          .@{table-prefix-cls}-container {
            .@{table-prefix-cls}-body,
            .@{table-prefix-cls}-content {
              // 边框模式下去掉td下边框
              .@{table-prefix-cls}-row:last-child td {
                border-bottom: none;
              }
            }
          }
        }

        .@{table-prefix-cls}-container {
          .@{table-prefix-cls}-body,
          .@{table-prefix-cls}-content {
            .@{table-prefix-cls}-row:last-child td {
              border-bottom: @border-width-base @border-style-base
                @table-border-color;
            }

            .ued-table-actions {
              .ued-table-actions-extendBtn {
                height: 16px;
                font-size: @font-size-sm;

                .anticon {
                  font-size: @font-size-sm;
                }
              }
            }

            .@{table-prefix-cls}-body {
              margin: 0;
            }
          }
        }

        table {
          tr {
            td,
            th {
              height: @table-small-td-height;
              &.@{table-selection-column} {
                label.@{checkbox-prefix-cls}-wrapper,
                label.@{radio-prefix-cls}-wrapper {
                  line-height: @small-table-data-input-height - 2px;

                  .@{checkbox-prefix-cls}-inner {
                    width: 14px;
                    height: 14px;
                  }

                  .@{checkbox-prefix-cls}-indeterminate {
                    .@{checkbox-prefix-cls}-inner {
                      &::after {
                        width: 7px;
                        height: 7px;
                      }
                    }
                  }
                }
              }
            }
          }

          tr > td {
            &:empty {
              height: @table-small-td-height;
            }

            .@{ant-prefix}-input:not(textarea),
            .@{ant-prefix}-input-number,
            .@{ant-prefix}-input-number-input,
            .@{calendar-prefix-cls}-picker,
            .@{switch-prefix-cls},
            .@{select-prefix-cls},
            .@{select-prefix-cls} .@{select-prefix-cls}-selector,
            .@{select-prefix-cls}
              .@{select-prefix-cls}-selector
              .@{select-prefix-cls}-selection-search
              input {
              height: @small-table-data-input-height;
              font-size: @font-size-sm;
              line-height: @small-table-data-input-line-height;
            }

            .@{ant-prefix}-input:not(textarea) {
              padding: 0 8px;
            }

            .@{calendar-prefix-cls}-picker
              .@{calendar-prefix-cls}-picker-input
              input {
              font-size: @font-size-sm;
            }

            .@{select-prefix-cls} {
              .@{select-prefix-cls}-selector {
                .@{select-prefix-cls}-selection-item,
                .@{select-prefix-cls}-selection-placeholder {
                  line-height: @small-table-data-input-line-height - 2px;
                }
              }

              &.@{select-prefix-cls}-multiple {
                .@{select-prefix-cls}-selector
                  .@{select-prefix-cls}-selection-search
                  input {
                  height: @small-table-data-input-height - 2px;
                  line-height: @small-table-data-input-line-height - 2px;
                }
              }
            }

            .@{switch-prefix-cls} {
              @small-switch-handle-input-height: @small-table-data-input-line-height -
                4px;
              min-width: @small-switch-handle-input-height * 2;

              &-handle {
                &::before {
                  border-radius: 50%;
                }

                width: @small-switch-handle-input-height;
                height: @small-switch-handle-input-height;
              }

              &.@{switch-prefix-cls}-checked {
                .@{switch-prefix-cls}-handle {
                  left: calc(~"100%" - @small-switch-handle-input-height - 2px);
                }
              }
            }

            .modalSelect {
              .@{ant-prefix}-input-group-addon {
                font-size: @font-size-sm;
                line-height: @small-table-data-input-line-height - 2px;
              }

              &.@{ant-prefix}-input-group {
                line-height: @small-table-data-input-line-height - 2px;
              }
            }

            .@{form-item-prefix-cls} {
              line-height: @small-table-data-input-line-height - 2px;

              .has-error {
                .@{form-prefix-cls}-explain {
                  top: 2px;
                }
              }
            }
          }

          .@{table-prefix-cls}-column-sorter
            .@{table-prefix-cls}-column-sorter-inner {
            .@{table-prefix-cls}-column-sorter-up,
            .@{table-prefix-cls}-column-sorter-down {
              font-size: 9px;
            }
          }
        }
      }

      &-middle {
        line-height: 24px;

        table {
          tr {
            td,
            th {
              height: @table-middle-td-height;
              &.@{table-selection-column} {
                label.@{checkbox-prefix-cls}-wrapper,
                label.@{radio-prefix-cls}-wrapper {
                  line-height: @middle-table-data-input-height - 2px;
                }
              }
            }
          }
          tr > td {
            &:empty {
              height: @table-middle-td-height;
            }

            .@{ant-prefix}-input:not(textarea),
            .@{ant-prefix}-input-number,
            .@{ant-prefix}-input-number-input,
            .@{calendar-prefix-cls}-picker,
            .@{switch-prefix-cls},
            .@{select-prefix-cls},
            .@{select-prefix-cls} .@{select-prefix-cls}-selector,
            .@{select-prefix-cls}
              .@{select-prefix-cls}-selector
              .@{select-prefix-cls}-selection-search
              input {
              height: @middle-table-data-input-height;
              line-height: @middle-table-data-input-height;
            }

            .@{ant-prefix}-input:not(textarea) {
              padding: 2px 8px;
            }

            .@{select-prefix-cls} {
              .@{select-prefix-cls}-selector {
                .@{select-prefix-cls}-selection-item,
                .@{select-prefix-cls}-selection-placeholder {
                  line-height: @middle-table-data-input-height - 2px;
                }
              }

              &.@{select-prefix-cls}-multiple {
                .@{select-prefix-cls}-selector
                  .@{select-prefix-cls}-selection-search
                  input {
                  height: @middle-table-data-input-height - 2px;
                  line-height: @middle-table-data-input-height - 2px;
                }
              }
            }

            .@{switch-prefix-cls} {
              @middle-switch-handle-input-height: @middle-table-data-input-height -
                4px;
              min-width: @middle-switch-handle-input-height * 2;

              &-handle {
                &::before {
                  border-radius: 50%;
                }

                width: @middle-switch-handle-input-height;
                height: @middle-switch-handle-input-height;
              }

              &.@{switch-prefix-cls}-checked {
                .@{switch-prefix-cls}-handle {
                  left: calc(
                    ~"100%" - @middle-switch-handle-input-height - 2px
                  );
                }
              }
            }

            .modalSelect {
              .@{ant-prefix}-input-group-addon,
              &.@{ant-prefix}-input-group {
                line-height: @middle-table-data-input-height - 2px;
              }
            }

            .@{form-item-prefix-cls} {
              line-height: @middle-table-data-input-height - 2px;
            }
          }
        }
      }
    }

    // 移除 webkit 内核下，固定头时，额外添加的滚动条边框线
    .@{table-prefix-cls}-fixed-header
      .@{table-prefix-cls}-scroll
      .@{table-prefix-cls}-header {
      &::-webkit-scrollbar {
        border: none;
      }
    }

    .@{table-prefix-cls}-bordered.@{table-prefix-cls}-fixed-header
      .@{table-prefix-cls}-scroll
      .@{table-prefix-cls}-header {
      &::-webkit-scrollbar {
        border: none;
      }
    }

    // 表格线（边框线模式）
    .@{table-prefix-cls}-bordered {
      border: @border-width-base @border-style-base @table-border-color;
      // // 注：右边框比较特殊，需要移除，然后交右 th与td单元格的右边框控制
      border-right: none;

      .@{table-prefix-cls}-container {
        // 注：左边框比较特殊，需要移除，然后交最外层border控制
        border-left: none;

        // 表格开启 scroll.y 时的情况处理
        .@{table-prefix-cls}-header {
          table {
            // 注：上边框比较特殊，需要移除，然后交最外层border控制
            border-top: none;

            // thead > tr > th:last-child {
              // 注：右边框比较特殊，表头最后一个单元格需要移除，然后交最外层border控制
              // border-right: none;
            // }
          }
        }

        // .@{table-prefix-cls}-body {
          // table {
            // tbody > tr > td:last-child {
              // border-right: none;
            // }
          // }
        // }

        // 表格没有开启 scroll.y 时的情况处理
        .@{table-prefix-cls}-content {
          table {
            // 注：上边框比较特殊，需要移除，然后交最外层border控制
            border-top: none;

            // thead > tr > th:last-child {
              // 注：右边框比较特殊，表头最后一个单元格需要移除，然后交最外层border控制
              // border-right: none;
            // }

            // tbody > tr > td:last-child {
            //   border-right: none;
            // }
          }
        }
      }

      .@{ant-prefix}-table-summary {
        tr:first-child {
          & > td {
            border-top: 1px solid @table-border-color;
          }
        }
        tr:last-child {
          & > td {
            border-bottom: none;
          }
        }
        .@{ant-prefix}-table-summary {
          tr:first-child {
            & > td {
              border-top: none;
            }
          }
        }
      }

      // 固定右列时
      .@{table-prefix-cls}-fixed-right {
        table {
          // 覆盖原生边框线颜色
          border-left: @border-width-base @border-style-base @table-border-color;
        }
      }

      &.@{table-prefix-cls}-empty {
        .@{table-prefix-cls}-placeholder {
          border-bottom: none;
          border-left: none;
        }
      }

      // 内容滚动时
      .@{table-prefix-cls}-content {
        // 去除左部线，交给最外层border
        & > .@{table-prefix-cls}-header > table,
        & > .@{table-prefix-cls}-body > table,
        & > .@{table-prefix-cls}-scroll .@{table-prefix-cls}-header > table,
        & > .@{table-prefix-cls}-scroll .@{table-prefix-cls}-body > table,
        & > .@{table-prefix-cls}-fixed-left table {
          border-left: none;
        }

        // 去除顶部线，交给最外层 border
        & > .@{table-prefix-cls}-body > table,
        & > .@{table-prefix-cls}-scroll .@{table-prefix-cls}-body > table,
        & > .@{table-prefix-cls}-fixed-left table,
        & > .@{table-prefix-cls}-fixed-right table,
        .@{table-prefix-cls}-header > table {
          border-top: none;
        }
      }

      // 去除底部线，交给最外层border
      .@{table-prefix-cls}-tbody {
        .@{table-prefix-cls}-row {
          .last-td {
            border-bottom: none;
          }
        }

        tr:last-child {
          td {
            border-bottom: none;
          }
        }
      }

      &.@{table-prefix-cls}-small {
        // 小尺寸-边框模式-固定左列下，固定内容右边框，颜色覆盖
        .@{table-prefix-cls}-fixed-left {
          .@{table-prefix-cls}-thead > tr > th,
          .@{table-prefix-cls}-tbody > tr > td {
            &:last-child {
              border-right: @border-width-base @border-style-base
                @table-border-color;
            }
          }
        }

        // 小尺寸-边框模式-固定右侧栏下，固定内容不需要左右板框，右边框交给最外层
        .@{table-prefix-cls}-fixed-right {
          border-right: 0;
          border-left: 0;
        }

        > .@{table-prefix-cls}-content {
          // border-right: none;
          // 小尺寸-边框模式下，底部不需要线，底线交给最外层
          .@{table-prefix-cls}-row:last-child td {
            border-bottom: none;
          }
        }
      }
    }

    // 表头标题提示
    &-header-cell-title-tip-wrapper {
      display: flex;
      align-items: center;

      &-icon {
        &:hover {
          svg {
            fill: @primary-color;
          }
        }
      }
    }
  }

  .ued-table-ed {
    .@{ant-prefix}-table-fixed {
      width: auto;
    }

    // 编辑器的表格内置分页组件中，为了显示快速跳转，会人为的让页数变为 2页，所以要写死隐藏 第2页的跳转标识
    .@{ant-prefix}-pagination-item-2 {
      display: none;
    }
  }

  // 斑马纹
  .ued-table-zebra-stripe {
    .@{table-prefix-cls}-row {
      &:nth-child(2n) {
        background: @table-zebra-stripe-bg;
      }
    }
  }

  .ued-table-page {
    @pagination-prefix-cls: ~"@{ant-prefix}-pagination";
    @normal-pagination-height: 24px;

    display: flex;
    justify-content: flex-end;
    width: 100%;
    &-default {
      &.@{pagination-prefix-cls} {
        padding: 16px 0 0 0;
      }
    }

    &-middle,
    &-small {
      &.@{pagination-prefix-cls} {
        padding: 12px 0 0 0;
      }
    }

    .@{pagination-prefix-cls}-prev,
    .@{pagination-prefix-cls}-item,
    .@{pagination-prefix-cls}-next,
    .@{pagination-prefix-cls}-jump-prev,
    .@{pagination-prefix-cls}-jump-next {
      min-width: @normal-pagination-height;
      height: @normal-pagination-height;
      line-height: @normal-pagination-height;
    }

    .@{pagination-prefix-cls}-item-link {
      color: @custom-black-8;
      font-size: @font-size-sm - 1px;
    }

    .@{pagination-prefix-cls}-item-active {
      background: @primary-color;

      & a {
        color: #fff;
      }
    }

    .@{pagination-prefix-cls}-total-text {
      height: auto;
      margin-right: 16px;
      line-height: @normal-pagination-height;
    }

    .@{pagination-prefix-cls}-options {
      margin-left: 16px;
      &-quick-jumper {
        height: @normal-pagination-height;
        margin-left: 12px;
        line-height: @normal-pagination-height;

        input {
          width: 36px;
          height: @normal-pagination-height;
          color: @custom-black-8;
        }
      }

      &-size-changer {
        color: @custom-black-8;
        .@{ant-prefix}-select-selector {
          height: @normal-pagination-height;

          .@{ant-prefix}-select-selection {
            &-search-input {
              height: @normal-pagination-height;
            }

            &-item {
              padding-right: 0;
              line-height: @normal-pagination-height - 1px;
            }
          }
        }

        .@{ant-prefix}-select-arrow {
          display: none;
        }
      }

      .@{ant-prefix}-select-dropdown {
        .@{ant-prefix}-select-item-option {
          min-height: @normal-pagination-height;
          padding: 6px 8px;
          line-height: @normal-pagination-height;
        }
      }
    }

    &-small {
      font-size: @font-size-sm;
      @small-pagination-height: 20px;

      .@{pagination-prefix-cls}-prev,
      .@{pagination-prefix-cls}-item,
      .@{pagination-prefix-cls}-next,
      .@{pagination-prefix-cls}-jump-prev,
      .@{pagination-prefix-cls}-jump-next {
        min-width: @small-pagination-height;
        height: @small-pagination-height;
        margin-right: 4px;
        line-height: @small-pagination-height - 1px;
      }

      .@{pagination-prefix-cls}-total-text {
        line-height: @small-pagination-height;
      }

      .@{pagination-prefix-cls}-options {
        margin-left: 0;
        &-quick-jumper {
          height: @small-pagination-height;
          margin-left: 8px;
          line-height: @small-pagination-height;

          input {
            height: @small-pagination-height;
            font-size: @font-size-sm;
          }
        }

        &-size-changer {
          .@{ant-prefix}-select-selector {
            height: @small-pagination-height;
            font-size: @font-size-sm;

            .@{ant-prefix}-select-selection {
              &-search-input {
                height: @small-pagination-height;
              }

              &-item {
                line-height: @small-pagination-height - 1px;
              }
            }
          }
        }

        .@{ant-prefix}-select-dropdown {
          .@{ant-prefix}-select-item-option {
            min-height: @small-pagination-height;
            padding: 4px 7px;
            font-size: @font-size-sm;
            line-height: @small-pagination-height;
          }
        }
      }
    }
  }

  .ued-table-actions {
    display: flex;
    align-items: center;

    :global(.@{ant-prefix}-btn + .@{ant-prefix}-btn),
    .ued-table-actions-extendBtn + .ued-table-actions-extendBtn {
      margin-left: @padding-sm;
    }

    .@{ant-prefix}-divider {
      &-vertical {
        background: @table-border-color;
      }
    }

    .ued-table-actions-antBtn {
      height: auto;
      padding: 0;
      color: @primary-color;
      border: 0;

      &:disabled {
        color: @custom-black-2;
      }
      > button {
        height: auto;
        padding: 0;
        color: @primary-color;
        border: 0;

        &:disabled {
          color: @custom-black-2;
        }
      }
    }

    .ued-table-actions-extendBtn {
      // display: inline-block;
      display: flex;
      align-items: center;
      // color: @primary-color;
      cursor: pointer;

      & + & {
        margin-left: @padding-sm;
      }

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

      .anticon {
        font-size: @font-size-base;

        &.actIcon-left {
          margin-right: 4px;
        }

        &.actIcon-right {
          margin-left: 4px;
        }
      }
    }
  }

  .ued-table-cell-ghostTag {
    display: inline-block;
    height: 20px;
    font-size: 12px;
    line-height: 18px;
    border-radius: 14px;
    border: 1px solid transparent;
    padding: 0 8px;
    vertical-align: middle;
  }

  .ued-table-cell-pointTag {
    display: inline-flex;
    align-items: center;
    vertical-align: middle;

    &-point {
      display: inline-block;
      width: 4px;
      height: 4px;
      border-radius: 50%;
      margin-right: 4px;
    }

    &-text {
      font-size: @font-size-sm;
      color: @text-color;
    }
  }

  .ued-table-cell-pureColourTag,
  .ued-table-cell-fadeColourTag {
    display: inline-block;
    border-radius: 2px;
    height: 20px;
    font-size: 12px;
    line-height: 20px;
    padding: 0 8px;
    vertical-align: middle;
  }

  .ued-table-cell-pureColourFill {
    color: #fff;
    text-align: center;
  }

  .ued-table-cell-hyperlink {
    color: @primary-color;
    text-decoration: underline;
    display: inline-block;
    &:not(:last-child) {
      margin-bottom: 6px;
    }
    > span:not(.ued-control-line-number) {
      display: block;
      line-height: 20px;
    }
    &-wrap {
      display: flex;
      flex-direction: column;
    }
  }

  .ued-table-cell-pointTag-click,
  .ued-table-cell-pureColourTag-click,
  .ued-table-cell-fadeColourTag-click,
  .ued-table-cell-pureColourFill-click,
  .ued-table-cell-hyperlink-click {
    &:hover {
      cursor: pointer;
    }
  }

  .ued-table-cell-thumbnail {
    display: flex;
    flex-wrap: wrap;
    &-item {
      position: relative;
      display: flex;
      align-items: center;
      overflow: hidden;
      img {
        width: 100%;
      }
      &:not(:last-child) {
        margin-right: 4px;
      }
      &:hover {
        .ued-table-cell-thumbnail-icons {
          display: flex;
        }
      }
    }
    &-moreItem {
      background: #f7f7f7;
      border-radius: 2px;
      display: flex;
      align-items: center;
      justify-content: center;
      color: #64677a;
      font-size: 12px;
      &:hover {
        background: #eeefef;
      }
    }
    &-icons {
      display: none;
      background: rgba(0, 0, 0, 0.55);
      position: absolute;
      width: 100%;
      height: 100%;
      align-items: center;
      justify-content: center;
      top: 0;
      .ued-icon {
        color: #fff;
        &:not(:last-child) {
          margin-right: 4px;
        }
      }
    }
  }

  .ued-table-row-expand-custom-icon {
    border: none;
    &::after {
      display: none;
    }
  }
}

.ued-table-ed-box {
  height: 100%;
}

// 表格头部样式
.@{tableHead-prefix-cls} {
  display: flex;
  align-items: center;
  justify-content: space-between;

  &-btn-default,
  &-btn-middle {
    height: 32px;
    font-size: @font-size-base;
  }

  &-btn-small {
    height: 28px;
    font-size: @font-size-base - 2px;
  }

  .title {
    // TODO: 不建议用 css module，统一移入 styles 管理，使用变量
    color: #1c242e;
    font-weight: 600;

    .head-style-one {
      padding-left: 20px;
      &::before {
        position: absolute;
        top: 50%;
        left: 8px;
        width: 4px;
        height: 16px;
        background: @primary-color;
        border-radius: 2px;
        transform: translateY(-50%);
        content: "";
      }
    }

    .head-style-two {
      padding-left: 20px;
      &::before {
        position: absolute;
        top: 50%;
        left: 0;
        width: 12px;
        height: 12px;
        background: @primary-color;
        transform: translateY(-50%);
        content: "";
        border-radius: 0 6px 6px 0;
      }
    }

    .head-style-custom {
      margin: -2px 8px 0 8px;
      color: @primary-color;
    }
  }

  .custom-title {
    position: relative;
    padding-left: 0 !important;
    &::before,
    &::after {
      width: 0 !important;
    }
  }

  .extend {
    display: flex;
    flex: 1 1 auto;
    align-items: center;
    justify-content: flex-end;
    text-align: right;

    i {
      margin-left: 8px; /** TODO: $padding-s **/
      cursor: pointer;
    }

    .btn {
      margin-left: 8px; /** TODO: $padding-s **/

      i {
        margin-left: 0;
      }
    }

    .iconBtn {
      height: auto;
      padding: 0;
      color: inherit;
      > button {
        height: auto;
        padding: 0;
        color: inherit;
      }
    }
  }

  &-popContent {
    min-width: 224px;

    &.@{tableHead-prefix-cls}-small-popContent {
      .popHead {
        font-size: 12px;
        line-height: 16px;
      }
      .checkAll {
        font-size: 12px;
        margin: 0 0 12px 28px;
      }
      .@{ant-prefix}-checkbox {
        &-wrapper {
          line-height: 16px;
        }
        &-inner {
          width: 12px;
          height: 12px;

          &::after {
            width: 4px;
            height: 7px;
            border-width: 1px;
          }
        }
        &.@{ant-prefix}-checkbox-indeterminate {
          .@{ant-prefix}-checkbox-inner::after {
            top: 50%;
            width: 6px;
            height: 6px;
            border: 0;
          }
        }
      }

      .@{ant-prefix}-tree-title {
        font-size: 12px;
      }
      .title {
        .checkbox {
          & + span {
            line-height: 16px;
          }
          .@{ant-prefix}-checkbox {
            top: 1px;
          }
        }
      }
    }
    &.@{tableHead-prefix-cls}-default-popContent,
    &.@{tableHead-prefix-cls}-middle-popContent {
      .popHead {
        line-height: 22px;
      }
      .checkAll {
        margin: 0 0 12px 30px;
      }
      .@{ant-prefix}-checkbox {
        &-wrapper {
          line-height: 22px;
        }
        &-inner {
          width: 14px;
          height: 14px;

          &::after {
            width: 5px;
            height: 9px;
            border-width: 1px;
            top: 45%;
          }
        }
        &.@{ant-prefix}-checkbox-indeterminate {
          .@{ant-prefix}-checkbox-inner::after {
            top: 50%;
            width: 7px;
            height: 7px;
            border: 0;
          }
        }
      }
      .title {
        .checkbox {
          & + span {
            line-height: 22px;
          }
        }
      }
    }

    .popHead {
      display: flex;
      align-items: center;
      justify-content: space-between;

      .extend {
        display: flex;
        flex: 1 1 auto;
        align-items: center;
        justify-content: flex-end;
        text-align: right;
        font-weight: 400;
      }
    }

    .tips {
      margin-top: 4px;
      color: rgba(28, 36, 46, 0.25);
      font-size: 12px;
      line-height: 16px;
    }

    .checkedText {
      color: @primary-color;
    }

    .icon {
      display: flex;
      align-items: center;
      margin-right: 16px;
      fill: #c6c8cb;
    }

    .@{ant-prefix}-tree-switcher-noop {
      display: none;
    }

    .title {
      display: flex;
      align-items: center;

      .checkbox {
        margin-right: 8px;
      }
    }

    .@{ant-prefix}-popover-arrow {
      display: none;
    }

    .@{ant-prefix}-popover-title {
      padding: 8px 12px;
    }
    .@{ant-prefix}-popover-inner-content {
      max-height: 270px;
      padding: 12px 12px 0 12px;
      overflow-y: auto;
      width: 100%;

      .@{ant-prefix}-tree {
        &-treenode {
          padding: 0 0 12px;
        }
        span.@{ant-prefix}-tree-node-content-wrapper {
          display: inline-block;
          width: 100%;
          padding: 0;
          min-height: 16px;
        }

        span.@{ant-prefix}-tree-switcher.@{ant-prefix}-tree-switcher-noop {
          display: none;
        }
      }
    }
  }

  &-tooltip {
    .@{ant-prefix}-tooltip-content {
      font-size: 12px;

      .@{ant-prefix}-tooltip-inner {
        min-height: fit-content;
        padding: 4px;
        background-color: rgba(0, 0, 0, 0.65);
        border-radius: 2px;
      }

      .@{ant-prefix}-tooltip-arrow::before {
        background-color: rgba(0, 0, 0, 0.65);
      }
    }
  }
}

.ued-table-edit-space-block {
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  z-index: 1;
}
.ued-table-more-pop {
  .@{ant-prefix}-popover-inner-content {
    padding: 0;
  }
}

.ued-table-filters {
  max-height: 250px;
  min-width: 120px;
  overflow: hidden;
  display: flex;
  border-radius: 4px;
  flex-direction: column;
  &-content {
    padding: 4px;
    overflow-y: auto;
    flex: 1;
    .ued-table-filters-item {
      cursor: pointer;
      padding: 4px 8px;
      .@{ant-prefix}-checkbox-wrapper {
        display: flex;
        line-height: 28px;
        .@{ant-prefix}-checkbox + span {
          padding-right: 0;
          flex: 1;
        }
      }
      &:hover {
        background-color: rgba(0, 0, 0, 0.04);
      }
      .ued-table-filters-dom {
        width: 100%;
      }
    }
  }
  &-bottom {
    display: flex;
    align-items: center;
    justify-content: space-between;
    border-top: 1px solid rgba(0, 0, 0, 0.06);
    padding: 8px;
  }
  &-hidden {
    display: none;
  }
}

.ued-table-actions-overlay {
  .@{ant-prefix}-popover-inner-content {
    max-width: 240px;
  }
}

// 上下合并后，下侧表头需合并
.ued-table-hidden-head-cell {
  display: none;
}

// 缩略图展示全部图片气泡卡片
.ued-table-cell-thumbnail-popover {
  .@{ant-prefix}-popover-inner {
    max-height: 312px;
    overflow: auto;
    &::-webkit-scrollbar {
      display: none;
      height: 0;
      width: 0;
      background: transparent;
    }
  }
  .@{ant-prefix}-popover-inner-content {
    padding: 12px 0 0 20px !important;
    max-width: 620px;
  }
  &-content {
    display: flex;
    flex-wrap: wrap;
  }
  &-item {
    display: flex;
    flex-direction: column;
    margin: 4px 20px 16px 0;
  }
  &-imgItem {
    width: 100px;
    height: 100px;
    border: 1px solid #f2f3f5;
    border-radius: 4px;
    position: relative;
    display: flex;
    align-items: center;
    overflow: hidden;
    img {
      width: 100%;
    }
    &:hover {
      .ued-table-cell-thumbnail-icons {
        display: flex;
      }
    }
    .ued-table-cell-thumbnail-icons {
      display: none;
      background: rgba(0, 0, 0, 0.55);
      position: absolute;
      width: 100%;
      height: 100%;
      align-items: center;
      justify-content: center;
      top: 0;
      .ued-icon {
        color: #fff;
        font-size: 16px;
        &:not(:last-child) {
          margin-right: 12px;
        }
      }
    }
  }
  &-imgName {
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
    width: 100px;
    font-size: 12px;
    margin-top: 8px;
    text-align: center;
    line-height: 22px;
  }
}

.ued-table-fill-content {
  // 内容适应滚动表格
  .@{ant-prefix}-form,
  .@{ant-prefix}-table-wrapper,
  .@{ant-prefix}-table {
    overflow: hidden;
  }

  .ued-table {
    flex: 1;
  }
  .@{ant-prefix}-table-container {
    height: 100%;
    display: flex;
    flex-direction: column;
    .@{ant-prefix}-table-header {
      flex-shrink: 0;
    }
  }
}

.ued-table-wrap .ued-table .@{ant-prefix}-table-tbody {
  .ued-table-levelTable-wrap.@{ant-prefix}-table-wrapper:only-child .@{ant-prefix}-table {
    margin: 0;
  }
  td.ued-table-levelTable-td {
    padding: 0;
  }
}

// 从表嵌套表格
.ued-table-levelTable-wrap {
  height: 100%;
  .@{ant-prefix}-table-thead {
    display: none;
  }
  &.@{ant-prefix}-table-wrapper {
    .@{ant-prefix}-table {
      height: 100%;
      background-color: transparent;
      .@{ant-prefix}-table-container {
        height: 100%;
        .@{ant-prefix}-table-content {
          height: 100%;
          table {
            height: 100%;
            border: none;
            .@{ant-prefix}-table-tbody {
              .@{ant-prefix}-table-row {
                td:last-child {
                  border-right: none;
                }
              }
            }
          }
        }
      }
      &.@{ant-prefix}-table-bordered {
        border: none;
        .@{ant-prefix}-table-container {
          .@{ant-prefix}-table-content {
            table {
              border: none;
            }
          }
        }
      }
      .@{ant-prefix}-table-container {
        .@{ant-prefix}-table-tbody>tr.@{ant-prefix}-table-row:hover:not(.@{ant-prefix}-table-row-selected)>td {
          background: transparent;
        }
        .@{ant-prefix}-table-tbody > tr.@{ant-prefix}-table-row > td {
          background: transparent;
        }
      }
    }
  }
}

.ued-pop-confirm {
  .@{ant-prefix}-popover-buttons {
    justify-content: right;
    text-align: right;
  }
}

// 表格内容滚动配置自适应时，scroll.y为auto时强制调整成overflow-y: auto,实现自适应滚动
.ued-table-scroll-y-auto {
  &.ued-table-wrap {
    .@{ant-prefix}-form-horizontal {
      height: 100%;
      overflow: hidden;
    }
    .ued-table {
      height: 100%;
    }
    .@{ant-prefix}-spin-container {
      .@{ant-prefix}-table {
        overflow: auto;
        flex: 1;
      }
    }
  }
}