@import '../../style/themes/index';
@import '../../style/mixins/index';

@m-table-prefix-cls: m-table;

.@{m-table-prefix-cls} {
  width: 100%;

  &-tr-pinto:nth-child(odd) {
    background: #f9f9f9;
  }

  &-td {
    position: relative;
    min-width: 48px;
    max-width: 340px;
    height: 32px;
    padding: @table-td-padding;
    font-size: @table-td-font-size;
    text-align: justify;
    word-break: break-all;
    cursor: pointer;
    table-layout: fixed;
    user-select: none;
    border: @table-td-border;

    &-popover {
      .ant-popover-inner-content {
        padding: 4px;
      }
    }

    &-div-text {
      display: -webkit-box;
      overflow: hidden;
      -webkit-box-orient: vertical;
      -webkit-line-clamp: 4;
    }

    &-active {
      user-select: text;
      outline: @table-td-outline;
    }

    &-editing {
      cursor: text;
      user-select: text;
      outline: @table-td-outline;
    }

    &-highlight {
      color: @table-td-color;
      background: @table-td-background;
      outline: @table-td-outline;
    }

    &-error {
      font-weight: 500;
      color: @table-td-error-color;
    }

    &-icon {
      position: absolute;
      top: -2px;
      right: -20px;
      z-index: 999;
      width: 20px;
      height: 20px;
      padding-top: 2px;
      font-size: 16px;
      line-height: 16px;
      color: #fff;
      cursor: pointer;
      background: #41a368;
      border-radius: 0 1px 1px 0;

      .anticon {
        width: 20px;
      }
    }
  }

  &-pagination {
    margin-top: @table-pagination-margin-top;
    text-align: right;
  }

  &-dropdown-li {
    display: flex;
    align-items: center;

    i { font-size: 16px !important; }
  }

  &-header-dropdown {
    position: absolute;
    top: 50%;
    right: 3px;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 12px;
    height: 12px;
    background: #fff;
    border: 1px solid #e8e8e8;
    border-radius: 0 1px 1px 0;
    box-shadow: 0 10px 32px 0 rgba(0, 0, 0, 0.05);
    transform: translateY(-50%);

    &-icon {
      font-size: 10px;
    }
  }
}