.grid {
  flex-grow: 1;
  height: 100%;
  overflow: auto;
  .el-table__body-wrapper {
      height: 100%;
  }
  .el-table__body-wrapper::-webkit-scrollbar {
      /*滚动条整体样式*/
      width: 6px !important; /*高宽分别对应横竖滚动条的尺寸*/
      height: 6px !important;
  }
  .el-table__body-wrapper::-webkit-scrollbar-thumb {
      /*滚动条颜色*/
      border-radius: 6px !important;
      background-color: var(--app-background-color-scrollbar) !important;
  }
  .el-table__body-wrapper::-webkit-scrollbar-track {
      /*滚动条里面轨道*/
      box-shadow: inset 0 0 5px var(--app-background-color-light) !important;
      background: #ffffff !important;
      border-radius: 6px !important;
  }
  //火狐浏览器滚动条样式
  .el-table__body-wrapper {
    scrollbar-color: var(--app-background-color-scrollbar) #ffffff; /* 滑块颜色  滚动条背景颜色 */
    scrollbar-width: thin; /* 滚动条宽度有三种：thin、auto、none */
  }
  /*表格文字过长省略*/
  .el-table th > .cell,
  .el-table td.edit-cell > .cell {
      white-space: nowrap;
      text-overflow: ellipsis;
      overflow: hidden;
      word-break: break-all;
  }
  .el-table-column--selection .cell {
      padding-left: 0px;
      padding-right: 0px;
  }
  .app-column-link,
  .app-format-data {
      display: inline;
  }
  .el-table {
      height: 100%;
      display: flex;
      flex-direction: column;
      justify-content: flex-start;
      .el-table__row {
          .grid-uiaction-divider {
              padding: 0 10px 0 10px;
              //TODO 冲突
              border-left: 1px var(--ctrl-font-color-light) solid;
          }
          .grid-first-uiaction {
              padding: 0 10px 0 10px;
          }
          // 去除边框
          >td {
            border-left: 0px !important;
            border-top: 0px !important;
            border-right: 0px !important;
          }
      }
      .el-table__row:hover {
          .app-column-link {
              color: #2d8cf0;
          }
      }
      .el-tooltip {
          .ivu-form-item {
              margin-bottom: unset !important;
          }
      }
      .el-table__body .edit-cell {
          padding: 0 8px;
          display: table-cell;
          .cell {
            padding: 0;
            .app-form-item {
                padding: 0;
                .ivu-form-item {
                  margin-bottom: 0;
                  .ivu-form-item-content {
                    .ivu-form-item-error-tip {
                      display: none;
                    }
                    .el-slider {
                      padding: 0 10px;
                    }
                  }
                }
            }
          }
      }
      .el-table__header-wrapper {
          min-height: 45px;
          max-height: 100px;
          height: auto;
          >table.el-table__header {
              min-height: 45px;
          }
      }
      .el-table__footer-wrapper {
          min-height: 45px;
          max-height: 100px;
          height: auto;
      }
  }
// 表格(单击能打开时移上去有小手)
  .el-table.grid-rowactive-click {
      .el-table__row:hover {
          cursor: pointer;
      }
  }
  .grid-pagination {
      height: 48px;
      padding-top: 6px;
      color: var(--ctrl-font-color);
      .ivu-btn{
        color: var(--ctrl-font-color);
        border-color: var(--ctrl-font-color-light);
        &:hover {
          color: var(--ctrl-font-color-bright);
          border-color: var(--ctrl-font-color-bright);
        }
      }
      .ivu-page-item-active{
        color: var(--button-font-color-bright);
        border-color: var(--button-font-color-bright);
      }
      .ivu-select-selection{
        &:hover {
          border-color: var(--ctrl-font-color-bright);
        }
      }
      .page-button {
          button {
              padding: 0;
              font-size: 16px;
              min-width: 32px;
              height: 28px;
              margin-right: 4px;
          }
      }
      .page-column {
          position: absolute;
          left: 0;
      }
      .batch-toolbar {
          position: absolute;
          left: 105px;
          > .toolbar-container {
              button {
                  font-size: 14px;
                  min-width: 32px;
                  height: 32px;
                  margin-right: 0;
                  margin-top: 0;
                  margin-bottom: 0;
                  margin-left: -1px;
                  padding: 0 7px;
                  border-radius: 0;
              }
              .ivu-tooltip:first-child button{
                border-radius: 2px 0 0 2px;
              }
              .ivu-tooltip:last-child button{
                border-radius: 0 2px 2px 0px;
              }
          }
      }
  }
  .app-grid-empty-content{
    height: 100%;
    display: flex;
    flex-direction: column;
    justify-content: center;
  }
  >.ivu-form {
    height: 100%;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
  }
  .ivu-poptip.page-column{
    position: absolute;
    top: 0px;
    right: 0px;
    z-index: 3;
    background-color: #57A3FD;;
    height: 45px;
    width: 48px;
    box-shadow: -2px 0px 3px 0px rgba(0, 0, 0, 0.1);
    overflow: hidden;
    &::before{
      content: "";
      background-color: #F6F6F6;
      position: absolute;
      width: 40px;
      height: 50px;
      border-radius: 0 50% 0 0;
      top: -2px;
      right: 6px;
      box-shadow: -10px 0 0 0px #F6F6F6;
    }
    &::after{
      content: "";
      background-color: #f6f6f6;
      position: absolute;
      width: 20px;
      height: 40px;
      border-radius: 33% 50% 0 0;
      top: 8px;
      right: -4px;
      -webkit-box-shadow: 0 10px 0 0px#F6F6F6;
      box-shadow: 0 10px 0 0px#F6F6F6;
      pointer-events: none;
    }
    .ivu-poptip-rel{
      display: flex;
      justify-content: center;
      align-items: center;
      height: 100%;
      .ivu-icon{
        color: #666666;
        &:hover{
          color: #57A3FD;
        }
      }
    }
    &.show-poptip {
      >.ivu-poptip-rel{
        i{
          color: #FFFFFF;
          &:hover {
            color: #FFFFFF;
          }
        }
      }
      /* 动画代码 */
      @keyframes openbook1 {
        0% {transform: translate(0,0);}
        100% {transform: translate(-60px,0px);}
      }
      /* 动画代码 */
      @keyframes openbook2 {
        0% {transform: translate(0,0);}
        100% {transform: translate(-60px,60px);}
      }
      &::before {
        animation-name: openbook1;
        animation-duration: 0.5s;
        animation-timing-function: ease-in;
        animation-iteration-count: 1;
        animation-fill-mode: forwards;
      }
      &::after {
        animation-name: openbook2;
        animation-duration: 0.5s;
        animation-timing-function: ease-in;
        animation-iteration-count: 1;
        animation-fill-mode: forwards;
      }
    }
    &.hide-poptip {
      >.ivu-poptip-rel{
        i{
          color: #666666;
        }
      }
      /* 动画代码 */
      @keyframes closebook1 {
        0% {transform: translate(-60px,0px);}
        100% {transform: translate(0,0);}
      }
      /* 动画代码 */
      @keyframes closebook2 {
        0% {transform: translate(-60px,60px);}
        100% {transform: translate(0,0);}
      }
      &::before {
        animation-name: closebook1;
        animation-duration: 0.5s;
        animation-timing-function: ease-in;
        animation-iteration-count: 1;
        animation-fill-mode: forwards;
      }
      &::after {
        animation-name: closebook2;
        animation-duration: 0.5s;
        animation-timing-function: ease-in;
        animation-iteration-count: 1;
        animation-fill-mode: forwards;
      }
    }
  }
}
.ivu-modal-content {
  .footer {
      .ivu-row {
          text-align: right;
      }
  }
}
.cell-indeterminate {
  > div > label {
      > span {
          .el-checkbox__inner {
              background-color: var(--ctrl-background-color-bright);
              border-color: var(--ctrl-font-color-bright);
          }
          .el-checkbox__inner:before {
              content: '';
              position: absolute;
              display: block;
              background-color: var(--ctrl-background-color-light);
              height: 2px;
              transform: scale(0.5);
              left: 0;
              right: 0;
              top: 5px;
          }
      }
      > span.is-checked {
          .el-checkbox__inner {
              background-color: var(--ctrl-background-color-bright);
              border-color: var(--ctrl-font-color-bright);
          }
          .el-checkbox__inner:after {
              border: 0px;
          }
      }
  }
}

.cell-select-all {
  > div > label {
      > span {
          .el-checkbox__inner {
              background-color: var(--ctrl-background-color-bright);
              border-color: var(--ctrl-font-color-bright);
          }
          .el-checkbox__inner:after {
              box-sizing: content-box;
              content: '';
              border: 1px solid var(--ctrl-font-color-bright);
              border-left: 0;
              border-top: 0;
              height: 7px;
              left: 4px;
              position: absolute;
              top: 1px;
              transform: rotate(45deg) scaleY(1);
              width: 3px;
              transition: transform 0.15s ease-in 0.05s;
              transform-origin: center;
          }
      }
  }
}
.app-grid-column-disabled {
  pointer-events: none;
  color: #7b7979;
}
.app-grid-column-normal {
  pointer-events: auto;
  color: #2d8cf0;
}

.grid-control-base-cell--error {
  >.cell {
    border: 1px solid #ed4014;
    border-radius: 4px;
  }
}

.app-grid-base-column-header--required {
  &:before {
    content: "*";
    margin-right: 4px;
    line-height: 1;
    font-family: SimSun;
    font-size: 14px;
    color: #ed4014;
  }
}