.ztxk-grid {
  &.ztxk-grid--default {
    .ztxk-grid-item {
      line-height: 18px;
    }
  }
  &.ztxk-grid--large {
    .ztxk-grid-item {
      // line-height: 36px;
      line-height: 32px;
    }
  }
  &.ztxk-grid--border {
    border-left: 1px solid @col-line-border;
    &:first-child {
      border-top: 1px solid @col-line-border;
    }
    .ztxk-grid-item {
      border-right: 1px solid @col-line-border;
      border-bottom: 1px solid @col-line-border;
      &.ztxk-grid-item--text {
        padding: 2px 4px;
      }
    }
  }
  &.ztxk-grid--flex {
    .ztxk-grid-item {
      display: flex;
      align-items: center;
    }
  }
  .ztxk-grid-item--flex {
    display: flex;
    align-items: center;
  }
  &.ztxk-grid--background {
    .ztxk-grid-item--title {
      background: @col-line-titleBg;
      .ztxk-grid-item--title-text {
        color: @weight-1;
      }
    }
  }
  .ztxk-grid-item {
    line-height: 18px;
    font-size: 12px;
    overflow: hidden;
    &.ztxk-grid-item--title {
      padding: 2px 0 2px 4px;
      word-wrap: break-word;
      color: @weight-2;
      justify-content: flex-end;
      display: flex;
      .ztxk-grid-item--title-text {
        display: inline-block;
        // /*文本不换行*/
        // white-space: nowrap;
        // /*超出范围隐藏*/
        // overflow: hidden;
        // /*文字超出用省略号*/
        // text-overflow: ellipsis;
      }
      .ztxk-grid-item--title-colon {
        padding: 0 0 0 1px;
      }
      .ztxk-grid-item--title-required {
        margin: 1px 2px 0 0;
        color: #ff4d4f !important;
        font-size: 14px;
        font-family: SimSun, sans-serif;
      }
    }
    &.ztxk-grid-item--title-vertical-center {
      align-items: center;
    }
    &.ztxk-grid-item--diff {
      background-color: #fdfd19;
    }
    &.ztxk-grid-item--text {
      padding: 3px 0;
      word-wrap: break-word;
      color: @weight-1;
    }
    &.ztxk-grid-item--text-ellipsis {
      overflow: hidden;
      text-overflow: ellipsis;
      white-space: nowrap;
      // /*将对象作为弹性伸缩盒子模型显示*/
      // display: -webkit-box;
      // /*用来限制在一个块元素中显示的文本的行数*/
      // -webkit-line-clamp: 3;
      // /*设置伸缩盒对象的子元素的排列方式*/
      // -webkit-box-orient: vertical;
    }
    &.ztxk-grid-item--text-noellipsis {
      white-space: pre-line;
    }
  }
  .ztxk-grid-item--merge {
    display: flex;
    .ztxk-grid-item--text {
      flex: 1;
    }
  }
}