$prefix: 'ui-rc' !default;
$antdPrefix: 'ant' !default;
$primary: #eb4619 !default;
$rowHoverBg: #FBDED6 !default;
$rowSelectedBg: #FEF2EF !default;
//$tableBorderColor: red !default;
$tableBorderColor: #e0e0e0 !default;
//$tableBorderColor: #C4C4C4 !default;
//$tableBorderColor: #f0f0f0 !default;
$border-radius: 6px !default;
$border-selected-color: #0550C5 !default;
$body-color: #ffffff !default;
//$cell-selected-bg: #E6EFFD !default;
$cell-selected-bg: #F3F8FF !default;
//$cell-index-selected-bg: #0550C5 !default;
$cell-index-selected-bg: #1869E6 !default;
//$cell-index-focus-bg: #CEDBEF !default;
$cell-index-focus-bg: #E6EFFD !default;
$rowSelectedHoverBg: 'ui-rc' !default;
$boxShadowColor: rgba(5, 5, 5, 0.09) !default;
$fontFamily: "Montserrat",Helvetica,Arial,serif !default;

.react-hot-toast {
  font-size: 1rem;
  color: $body-color;
  letter-spacing: 0.14px;
  box-shadow: 0px 4px 10px -4px rgb(58 53 65 / 60%);
  border-radius: $border-radius;
}

.popup-context-menu {
  min-width: 200px;

}
.ant-dropdown-menu.popup-context-menu {
  .ant-dropdown-menu-submenu {
    .ant-dropdown-menu-submenu-title {
      align-items: center;
    }
  }
}

// -------------- Table -------------

.#{$prefix}-table-wrapper {

  p {
    margin: 0;
  }

  .ui-rc-table {
    //font-family: $fontFamily;
    color: #000000de;
    //font-weight: 500;
  }

  .ui-rc-table {
    .#{$prefix}-table-cell {
      &.#{$prefix}-table-selection-column {
        //padding: 6px 8px !important;
        //padding: 6px 8px !important;
      }
    }
  }


  &.table-none-column-select {
    .#{$prefix}-table-cell {
      &.#{$prefix}-table-selection-column {
        padding: 0 !important;
        overflow: hidden !important;
        border-inline-end: 0 !important;
        //flex: 0 0 0 !important;
        //width: 0 !important;
      }
    }
  }

  .#{$prefix}-table {
    &.ui-rc-table-scroll-horizontal {

      .ui-rc-table-container {

        .#{$prefix}-table-tbody-virtual {

          .ui-rc-table-tbody-virtual-scrollbar.ui-rc-table-tbody-virtual-scrollbar-horizontal {
            visibility: visible !important;
            bottom: -8px !important;
            z-index: 5 !important;
            background-color: #f0f0f0;
          }

        }

        &:has(.ui-rc-table-summary) {

          .#{$prefix}-table-tbody-virtual {

            .ui-rc-table-tbody-virtual-scrollbar.ui-rc-table-tbody-virtual-scrollbar-horizontal {
              visibility: visible !important;
              //bottom: -40px !important;
              bottom: -47px !important;
              z-index: 5 !important;

            }

          }

        }

      }



    }
  }
  .#{$prefix}-table {

    //line-height: 20px;

    .#{$prefix}-table-cell {
      //min-height: 35px;
      //height: 35px;

      .#{$prefix}-table-filter-column {
        .#{$prefix}-dropdown-trigger.#{$prefix}-table-filter-trigger {
          margin-left: 0;
        }
      }

      &.cell-group {
        font-weight: 600;
        background-color: #f5f5f5;
        border-inline-end-color: transparent !important;

      }
      &.cell-group-fixed {
        font-weight: 600;
        position: sticky;
        text-align: left !important;
        left: 0;
        z-index: 15;
      }

    }

  }

  .#{$prefix}-table-tbody-virtual {
    .#{$prefix}-table-cell {
      border-bottom: 1px solid $tableBorderColor;
    }
  }

  .#{$prefix}-table-bordered {

    .#{$prefix}-table-tbody-virtual {
      .#{$prefix}-table-cell {
        //display: flex;
        border-inline-end: 1px solid $tableBorderColor;
      }
    }
    .#{$prefix}-table-container {
      .#{$prefix}-table-thead {

        > tr{
          > th.#{$prefix}-table-cell:last-of-type {
            //border-inline-end: 0;
          }
        }

      }
      .#{$prefix}-table-summary {
        > tr{
          > td.#{$prefix}-table-cell:last-of-type {
            //border-inline-end: 0;
          }
        }
      }
    }

  }

  .#{$prefix}-table-tbody {


    .#{$prefix}-table-cell {
      line-height: 22px;
      &:focus-visible {
        outline: none;
      }


      &.disable {
        background-color: #f0f0f0;
      }

      //&.selected {
      //  //background: red;
      //  background-color: $cell-selected-bg !important;
      //}
      &.selected-bg {
        //background: red;
        background-color: $cell-selected-bg !important;
      }

      .ui-rc-table-cell-content {
        line-height: 22px;
      }

      &.#{$prefix}-table-cell-fix-left-last {
        .#{$prefix}-table-cell-content {
        }
      }

    }

    .#{$prefix}-table-row {

      &.#{$prefix}-table-row-selected {
        > .#{$prefix}-table-cell {
          background: #FEF2EF;
        }
      }

      &.row-disabled {
        .#{$prefix}-table-cell {
          //background-color: #f5f5f5;
        }
      }

      > .#{$prefix}-table-cell {
        &.#{$prefix}-table-cell-row-hover {
          background: #FBDED6;
        }

        &.#{$prefix}-cell-command {
          padding: 5px 8px;

          .#{$prefix}-cell-command__content {
            display: flex;
            gap: 5px;
            overflow: hidden;
          }
        }


      }

      .#{$prefix}-table-cell:last-of-type {
        //border-inline-end: 0;
      }


      @for $i from 0 through 10 {
        &:has(.indent-level-#{$i}) {
          .#{$prefix}-table-cell {
            &.cell-number {
              .ui-rc_content {
                padding-left: $i * 10px;
              }
            }
          }
        }
      }

    }

    .#{$prefix}-table-placeholder {
      .#{$prefix}-table-cell {
        padding-top: 0 !important;
        padding-bottom: 0 !important;
        .#{$prefix}-table-expanded-row-fixed {
          margin-top: 0 !important;
          margin-bottom: 0 !important;
        }
      }
    }
  }

  .#{$prefix}-table-thead {
    //font-weight: 400;

    > tr {
      > th,
      > td {
        border-bottom: 1px solid $tableBorderColor;
        //background: #fff;
        font-weight: 500;
        //line-height: 23px;
        //height: 40px;
      }
    }

    .#{$prefix}-table-cell {

      .ui-rc-table-column-sorter{
        line-height: normal !important;
      }

      &:hover {
        .ui-rc-table-column-sorter-up.active {
          opacity: 1 !important;
        }
      }

      .ui-rc-table-cell-content {
        line-height: 22px;
      }

      &.#{$prefix}-table-cell-fix-left-last {
        .#{$prefix}-table-cell-content {
          //overflow: visible;
        }
      }
      .#{$prefix}-table-column-title {
        //display: flex;
      }

      &.head-align-center {
        text-align: center;
      }
      &.head-align-right {
        text-align: right;
      }
    }
  }

  .#{$prefix}-table-summary {
    .#{$prefix}-table-cell {
      background-color: #fafafa;
      height: 39px;
      font-weight: 600;
    }

    > tr > td {
      border-bottom: 1px solid $tableBorderColor;
    }
  }

  //.#{$prefix}-table-bordered .#{$prefix}-table-tbody-virtual .#{$prefix}-table-cell.#{$prefix}-table-cell-fix-right-first:before {
  //  border-inline-start: 1px solid $tableBorderColor;
  //}

  .#{$prefix}-table-bordered .#{$prefix}-table-tbody-virtual .#{$prefix}-table-cell.#{$prefix}-table-cell-fix-right-first {
    &::before {
      border-inline-start: 1px solid $tableBorderColor;
    }
    &.has-before::before {
      border-inline-start: 1px solid $border-selected-color;
    }
    &.cell-border-left.selected-bg::before {
      border-inline-start: 1px solid $border-selected-color;
    }
  }



  .#{$prefix}-table {

    &.#{$prefix}-table-bordered {
      > .#{$prefix}-table-container {
        border-inline-start: 1px solid $tableBorderColor;
        border-top: 1px solid $tableBorderColor;

        &::after {
          border-inline-end: 1px solid $tableBorderColor;
        }

        > .#{$prefix}-table-content,
        > .#{$prefix}-table-header,
        > .#{$prefix}-table-body,
        > .#{$prefix}-table-summary {
          > table {
            > thead {
              > tr:not(:last-child) {
                > th {
                  border-bottom: 1px solid $tableBorderColor;
                }
              }
            }
          }
        }


        > .#{$prefix}-table-content,
        > .#{$prefix}-table-header,
        > .#{$prefix}-table-body,
        > .#{$prefix}-table-summary {
          > table {
            > thead,
            > tbody,
            > tfoot {
              > tr {
                > th,
                > td {
                  border-inline-end: 1px solid $tableBorderColor;
                }
              }
            }
          }
        }

      }

      > .#{$prefix}-table-title {
        border: 1px solid $tableBorderColor;
        border-bottom: 0;
      }
    }

    &.#{$prefix}-table-ping-right:not(.#{$prefix}-table-has-fix-right) .#{$prefix}-table-container::after {
      box-shadow: inset -10px 0 8px -8px $boxShadowColor;
      //box-shadow: none;
    }


  }

  .#{$prefix}-table-ping-left {
    .#{$prefix}-table-cell-fix-left-first::after,
    .#{$prefix}-table-cell-fix-left-last::after {
      box-shadow: inset 10px 0 8px -8px $boxShadowColor;
    }
  }

  .#{$prefix}-table-ping-right {
    .#{$prefix}-table-cell-fix-right-first::after,
    .#{$prefix}-table-cell-fix-right-last::after {
      box-shadow: inset -10px 0 8px -8px $boxShadowColor;
    }
  }


  .#{$prefix}-table.#{$prefix}-table-bordered {
    > .#{$prefix}-table-container {
      > .#{$prefix}-table-header > table > thead > tr,
      > .#{$prefix}-table-summary > table > tfoot > tr {
        > .#{$prefix}-table-cell-fix-right-first::before {
          border-inline-start: 1px solid $tableBorderColor;
          content: "";
          position: absolute;
          inset-block: 0;
          inset-inline-start: -1px;
        }
      }
    }
  }


}

// -------------- Table edit-------------

.#{$prefix}-table-wrapper {

  .#{$prefix}-table.#{$prefix}-table-small {
    .ui-rc-table-thead {
      >tr >th.#{$prefix}-table-selection-column{
        //padding-block: 7px;
        padding: 0;
        //padding: 6px 8px;
      }
    }
    //.#{$prefix}-table-selection-column{
    //  padding-block: 7px;
    //  padding: 0;
    //  //padding: 6px 8px;
    //}
  }

  &.grid-editable {

    .#{$prefix}-table-row {
      &:has(+ .#{$prefix}-table-cell) {

      }
    }

    .#{$prefix}-table .#{$prefix}-table-tbody .rc-ui-cell-editable {
      overflow: unset;
      display: flex;
      height: 37px;
      //--------
      padding: 0;

      .#{$prefix}-table-row-expand-icon {
        top: 8px;
        left: 8px;
      }

      &.rc-ui-cell-index {
        &.focus {
          background-color: $cell-index-focus-bg;
          //font-weight: 500;
        }
        &.selected-index {
          background-color: $cell-index-selected-bg !important;
          color: #fff;
          //font-weight: 500;
        }
      }

      &.cell-editable {

        &.cell-border-top {
          //border-bottom: 1px solid $border-selected-color;
          &::after {
            content: "";
            position: absolute;
            top: -1px;
            left: 0;
            //right: 0;
            //bottom: 0;
            height: 1px;
            width: 100%;
            border-top: 1px solid $border-selected-color; /* line đè lên border gốc */
            pointer-events: none; /* không ảnh hưởng đến tương tác */
            z-index: 1;
          }
          &.ui-rc-table-cell-fix-left.ui-rc-table-cell-fix-left-last {
            &::after {
              left: -100%;
            }
          }
          &.ui-rc-table-cell-fix-right.ui-rc-table-cell-fix-right-first {
            &::after {
              left: 100%;
            }
          }
        }

        &.cell-border-bottom {
          border-bottom: 1px solid $border-selected-color;
          //position: relative;
          //&::before {
          //  content: "";
          //  position: absolute;
          //  //top: 0;
          //  left: 0;
          //  //right: 0;
          //  bottom: 0;
          //  height: 1px;
          //  width: 100%;
          //  border: 1px solid red; /* line đè lên border gốc */
          //  pointer-events: none;  /* không ảnh hưởng đến tương tác */
          //  z-index: 1;
          //}

        }

        &.cell-border-left {
          //overflow: hidden;
          //border-inline-end: 1px solid $border-selected-color;
          &::before {
            content: "";
            position: absolute;
            top: 0;
            left: 0;
            //right: 0;
            //bottom: 0;
            height: 102%;
            width: 1px;
            border-left: 1px solid $border-selected-color; /* line đè lên border gốc */
            pointer-events: none; /* không ảnh hưởng đến tương tác */
            z-index: 1;
          }
        }

        &.cell-border-right {
          border-inline-end: 1px solid $border-selected-color;
          //&::before {
          //  content: "";
          //  position: absolute;
          //  top: 0;
          //  //left: 0;
          //  right: 0;
          //  //bottom: 0;
          //  height: 100%;
          //  width: 1px;
          //  border: 1px solid red; /* line đè lên border gốc */
          //  pointer-events: none; /* không ảnh hưởng đến tương tác */
          //  z-index: 1;
          //}
        }

        &.cell-paste-border-top {
          border-bottom: 1px dashed #949494;
        }

        &.cell-paste-border-bottom {
          border-bottom: 1px dashed #949494;
        }

        &.cell-paste-border-left {
          border-inline-end: 1px dashed #949494;
        }

        &.cell-paste-border-right {
          border-inline-end: 1px dashed #949494;
        }


        &.#{$prefix}-table-cell-fix-left {
          &:has(.ui-rc_cell-content.selected) {
          }

        }

        &.#{$prefix}-table-cell-fix-right {
          &:has(.ui-rc_cell-content.selected) {
          }

          &.cell-border-end {
            z-index: 3;
          }

        }


        &.cell-border-end {
          z-index: 1;
        }

        &.#{$prefix}-table-cell-fix-right-first {

          &.cell-border-end {
            z-index: 3;
          }

          &.next-cell-border-left {
            &::before {
              border-inline-start: 1px solid $border-selected-color;
            }
          }


          &.next-cell-paste-border-left {
            &::before {
              border-inline-start: 1px dashed #949494;
            }
          }

          &.fixed-cell-border-left {
            &::before {
              border-inline-start: 1px solid $border-selected-color;
            }
          }
          &.fixed-cell-paste-border-left {
            &::before {
              border-inline-start: 1px dashed #949494;
            }
          }

        }

        &.#{$prefix}-table-cell-fix-left-last {

          &.cell-border-end {
            z-index: 3;
          }

        }

      }


    }

    .#{$prefix}-table.#{$prefix}-table-ping-left {
      .#{$prefix}-table-tbody .rc-ui-cell-editable{
        &.cell-editable {


          &.#{$prefix}-table-cell-fix-left-last {

            //&.cell-border-left {
            //  border-inline-end: 1px solid $tableBorderColor;
            //}

          }



        }
      }

      &:not(.#{$prefix}-table.#{$prefix}-table-ping-right) {

        .#{$prefix}-table-tbody .rc-ui-cell-editable {
          &.cell-editable {

            // //&.cell-border-end {
            //  //  z-index: 1;
            //  //}

            &.#{$prefix}-table-cell-fix-right {
              z-index: 0 !important;

              &:has(.dragging-point.show) {
                z-index: 3 !important;
            }

              &.cell-border-end {
                z-index: 3;
              }
            }

          }
        }

      }

    }

    .#{$prefix}-table.#{$prefix}-table-ping-right {
      .#{$prefix}-table-tbody .rc-ui-cell-editable{

        &.cell-editable {

          &.#{$prefix}-table-cell-fix-right-first {

            &.next-cell-border-left {
              &::before {
                border-inline-start: 1px solid $tableBorderColor;
              }
            }



          }

          &.#{$prefix}-table-cell-fix-left-last {
            &.cell-border-end {
              z-index: 3;
            }
          }

        }

        &.cell-border-end {
          z-index: 1;
        }

      }

    }


    .#{$prefix}-table.#{$prefix}-table-small {
      .#{$prefix}-table-thead > tr > th,
      tfoot > tr > th,
      tfoot > tr > td,
      tfoot > tr > td.#{$prefix}-table-cell
      {
        //padding: 8px 8px;
      }
    }

    .#{$prefix}-table.#{$prefix}-table-small {
      .#{$prefix}-table-selection-column{
        //padding: 8px 8px;
        //padding: 6px 8px;
      }
    }

    .ui-rc_cell-content {
      user-select: none;
      //padding: 7px 8px;
      padding: 2px 8px;
      display: flex;
      align-items: center;
      overflow: hidden;

      .ui-rc_content {
        width: 100%;
      }
      &:hover {
        .dragging-point {
          //visibility: visible;
        }
      }

      .dragging-point {
        //visibility: hidden;
        width: 10px;
        height: 10px;
        position: absolute;
        cursor: crosshair;
        right: -1px;
        bottom: -1px;
        //background: red;

        &.hidden {
          display: none;
        }

        .dot-point {
          position: absolute;
          width: 8px;
          height: 8px;
          border-radius: 6px;
          background-color: $border-selected-color;
          bottom: -3px;
          right: -3px;
        }

      }
    }

    .ui-rc_cell-content.selected {
      background-color: $cell-selected-bg;
    }
    .ui-rc_cell-content {
      //position: relative;
      &.isValid {
        &::after {
          content: "";
          position: absolute;
          top: 0;
          right: 0;
          width: 0;
          height: 0;
          border-top: 0 solid transparent;
          border-right: 8px solid red;
          border-bottom: 8px solid transparent;
        }
      }
    }

    //.ui-rc_cell-content.disable {
    //  background-color: #f0f0f0;
    //}

    //.ui-rc_cell-content--index {
    //  &.focus {
    //    background-color: $cell-index-focus-bg;
    //    //color: #fff;
    //    //font-weight: 500;
    //  }
    //  &.selected {
    //    background-color: $cell-index-selected-bg;
    //    color: #fff;
    //    //font-weight: 500;
    //  }
    //}

    .#{$prefix}-table-tbody {

      .#{$prefix}-table-row {
        &.#{$prefix}-table-row-selected {
          >.#{$prefix}-table-cell {
            //background: #FEF2EF;
          }
        }
        >.#{$prefix}-table-cell {
          &.#{$prefix}-table-cell-row-hover {
            //background: #FBDED6;
          }
        }

        .#{$prefix}-table-cell {

          .#{$prefix}-table-row-indent {
            position: absolute;
            @for $i from 1 through 10 {
              &.indent-level-#{$i} {
                padding-left: $i * 25px;;
              }
            }
          }

          @for $i from 0 through 10 {
            &:has(.indent-level-#{$i}) {

              .#{$prefix}-table-row-expand-icon {
                position: absolute;
                //.ui-rc_content {
                //padding-left: $i * 10px;
                //}
              }

              .ui-rc_cell-content {
                padding-left: $i * 25px + 8px;
              }

            }
          }

          @for $i from 0 through 10 {
            &:has(.indent-level-#{$i}) {

              .#{$prefix}-table-row-expand-icon {
                position: absolute;
                left: $i * 25px + 8px !important;
              }

              .ui-rc_cell-content {
                padding-left: ($i + 1)* 25px + 8px;
              }

            }
          }
        }
      }


      .#{$prefix}-table-cell{

        &.#{$prefix}-table-cell-ellipsis {
          .ui-rc_cell-content {

            .ui-rc_content {
              text-overflow: ellipsis;
              text-decoration: none;
              transition: 0.3s;
              white-space: nowrap;
              overflow: hidden;
              line-height: 22px;
            }
          }
        }

        &.cell-editing {
          //padding: 0 !important;
          &:focus-visible {
            outline: none;
          }
          .ant-form-item ,
          .ant-row.ant-form-item-row,
          .ant-col.ant-form-item-control,
          .ant-form-item-control-input,
          .ant-form-item-control-input-content,
          .ant-input{
            height: 100%;
            &:focus-visible {
              outline: none;
            }
          }

          .#{$prefix}-checkbox-wrapper {
            .#{$prefix}-checkbox {
              background-color: red;
            }
            .#{$prefix}-checkbox-input {
              &:focus-visible {
                outline: none;
              }
            }
          }


          .ant-input, .ant-picker{
            border-radius: 0;
          }

          // color picker

          .ant-color-picker-trigger{
            height: 100%;
            border-radius: 0;
            .ant-color-picker-color-block {
              height: 100%;
              width: 100%;
            }

          }


          // ------------ select  ---------------

          .#{$prefix}-table-select-single .#{$prefix}-table-select-selector,
          .#{$prefix}-select-single .#{$prefix}-select-selector {

            border-radius: 0;

          }

          .#{$prefix}-table-select-single:not(.#{$prefix}-table-select-customize-input) {
            .#{$prefix}-table-select-selector {
              .#{$prefix}-table-select-selection-search-input {
                height: auto;
              }
            }
          }

          // ------------ select  ---------------


        }
        &.cell-editable {
          &:focus-visible {
            outline: none;
          }
        }
        .#{$prefix}-table-cell-content {
          display: flex;
          height: 100%;
        }

        .ui-rc_cell-content,
        .#{$prefix}-table-cell-content{
          //width: 100%;
          flex: 1;
        }
        .ui-rc_content {
          //padding: 5px 8px;
        }
        .ui-rc_content:has(.ant-color-picker-trigger) {
          padding: 1px 8px;
        }
      }
    }

  }

}
// ---------------- Table edit end---------------


// -------------- Checkbox ----------

.#{$prefix}-checkbox-indeterminate {
  &:hover {
    .#{$prefix}-checkbox-inner {
      border-color: $primary !important;;
    }
  }

  .#{$prefix}-checkbox-inner {
    &:after {
      background-color: $primary;
    }
  }
}
//.#{$prefix}-checkbox-input {
//  &:focus-visible {
//    outline: none;
//  }
//}

.#{$prefix}-checkbox .#{$prefix}-checkbox-input:focus-visible+.#{$prefix}-checkbox-inner {
  outline: none;
}

.#{$prefix}-checkbox {
  &.#{$prefix}-checkbox-checked {
    &:hover {
      .#{$prefix}-checkbox-inner {
        background-color: $primary;
        border-color: $primary;
      }
    }

    .#{$prefix}-checkbox-inner {
      background-color: $primary;
      border-color: $primary;
    }
  }
}

.#{$prefix}-checkbox:not(.#{$prefix}-checkbox-disabled):hover {
  .#{$prefix}-checkbox-inner {
    border-color: $primary;
  }
}

.#{$prefix}-checkbox-wrapper:not(.#{$prefix}-checkbox-wrapper-disabled):hover {
  .#{$prefix}-checkbox-inner {
    border-color: $primary;
  }

  .#{$prefix}-checkbox-checked:not(.#{$prefix}-checkbox-disabled) {
    .#{$prefix}-checkbox-inner {
      background-color: $primary;
    }
  }
}

// ------------ Tree ---------------

.#{$prefix}-tree {
  .#{$prefix}-tree-checkbox-checked {
    .#{$prefix}-tree-checkbox-inner {
      background-color: $primary;
      border-color: $primary;
    }
  }

  .#{$prefix}-tree-checkbox-wrapper-checked:not(.#{$prefix}-tree-checkbox-wrapper-disabled):hover,
  .#{$prefix}-tree-checkbox-checked:not(.#{$prefix}-tree-checkbox-disabled):hover {
    .#{$prefix}-tree-checkbox-inner {
      background-color: $primary;
    }
  }

  .#{$prefix}-tree-checkbox-wrapper:not(.#{$prefix}-tree-checkbox-wrapper-disabled):hover,
  .#{$prefix}-tree-checkbox:not(.#{$prefix}-tree-checkbox-disabled):hover {
    .#{$prefix}-tree-checkbox-inner {
      border-color: $primary;
    }
  }
}


// ------------ ant Tree ---------------

.#{$antdPrefix}-tree {
  .#{$antdPrefix}-tree-checkbox-checked {
    .#{$antdPrefix}-tree-checkbox-inner {
      background-color: $primary;
      border-color: $primary;
    }
  }

  .#{$antdPrefix}-tree-checkbox-wrapper-checked:not(.#{$antdPrefix}-tree-checkbox-wrapper-disabled):hover,
  .#{$antdPrefix}-tree-checkbox-checked:not(.#{$antdPrefix}-tree-checkbox-disabled):hover {
    .#{$antdPrefix}-tree-checkbox-inner {
      background-color: $primary;
    }
  }

  .#{$antdPrefix}-tree-checkbox-wrapper:not(.#{$antdPrefix}-tree-checkbox-wrapper-disabled):hover,
  .#{$antdPrefix}-tree-checkbox:not(.#{$antdPrefix}-tree-checkbox-disabled):hover {
    .#{$antdPrefix}-tree-checkbox-inner {
      border-color: $primary;
    }
  }
}


// ------------ paging ---------------

.#{$prefix}-table-wrapper .#{$prefix}-table-pagination.#{$prefix}-pagination {
  margin: 0;
}

.#{$prefix}-table-wrapper {
  .#{$prefix}-table {
    .#{$prefix}-pagination {
      &::before {
        content: "";
        position: absolute;
        border-left: 1px solid $tableBorderColor;
        height: 55px;
        bottom: 0;
        left: 0;
      }

      &::after {
        content: "";
        position: absolute;
        border-left: 1px solid $tableBorderColor;
        height: 55px;
        bottom: 0;
        visibility: visible;
        right: 0;
      }

      &.top-pagination {
        border: none;
        padding-top: 0;
        padding-bottom: 0;
        .#{$prefix}-pagination-total-text {
          margin-left: auto;
        }
      }
      border-bottom: 1px solid $tableBorderColor;

    }
  }
}


.#{$prefix}-pagination {

  .#{$prefix}-pagination-total-text {
    white-space: nowrap;
  }

  .#{$prefix}-pagination-item-active {
    border-color: $primary;

    &:hover {
      border-color: $primary;

      a {
        color: $primary;
      }
    }

    a {
      color: $primary;
    }
  }

  .#{$prefix}-pagination-jump-prev, .#{$prefix}-pagination-jump-next {
    .#{$prefix}-pagination-item-container {
      .#{$prefix}-pagination-item-link-icon {
        color: $primary;
      }
    }
  }
}



//.#{$prefix}-table-wrapper .#{$prefix}-table.#{$prefix}-table-bordered >.#{$prefix}-table-container >.#{$prefix}-table-content >table >tbody>tr>td >.#{$prefix}-table-expanded-row-fixed {
//  border-inline-end: 1px solid $tableBorderColor;
//}
//
//.#{$prefix}-table-wrapper .#{$prefix}-table.#{$prefix}-table-bordered >.#{$prefix}-table-container >.#{$prefix}-table-content >table >tbody>tr>td >.#{$prefix}-table-expanded-row-fixed::after {
//  //border-inline-end: 1px solid $tableBorderColor;
//  border-inline-end: 0 solid $tableBorderColor;
//}
//
//
//.#{$prefix}-table-wrapper .#{$prefix}-table.#{$prefix}-table-bordered.#{$prefix}-table-small >.#{$prefix}-table-container >.#{$prefix}-table-body >table>tbody>tr>td >.#{$prefix}-table-expanded-row-fixed {
//  margin-top: 0;
//  margin-bottom: 0;
//  border-inline-end: 1px solid $tableBorderColor;
//}
//
//.#{$prefix}-table-wrapper .#{$prefix}-table.#{$prefix}-table-bordered.#{$prefix}-table-small >.#{$prefix}-table-container >.#{$prefix}-table-body >table>tbody>tr>td >.#{$prefix}-table-expanded-row-fixed::after {
//  border-inline-end: 0 solid $tableBorderColor;
//}


.#{$prefix}-table-wrapper {
  .#{$prefix}-table {
    &.#{$prefix}-table-bordered {
      > .#{$prefix}-table-container {
        > .#{$prefix}-table-content,
        > .#{$prefix}-table-header,
        > .#{$prefix}-table-body,
        > .#{$prefix}-table-summary {
          > table > tbody > tr {
            > th,
            > td {
              > .#{$prefix}-table-expanded-row-fixed::after {
                // Thêm CSS ở đây
              }
            }
          }
        }
      }
    }
  }
}


.#{$prefix}-table-wrapper {
  .#{$prefix}-table.#{$prefix}-table-small {
    .#{$prefix}-table-title,
    .#{$prefix}-table-footer,
    .#{$prefix}-table-cell,
    .#{$prefix}-table-thead > tr > th,
    .#{$prefix}-table-tbody > tr > th,
    .#{$prefix}-table-tbody > tr > td,
    tfoot > tr > th,
    tfoot > tr > td {
      //padding: 8px 8px;
      //font-size: 13px;
    }
  }
}
.#{$prefix}-table-wrapper {
  .#{$prefix}-table.#{$prefix}-table-small {
    .#{$prefix}-table-cell {
      &:has(.ant-color-picker-trigger) {
        padding: 1px 8px;
      }
      .ant-color-picker-trigger{
        width: 100%;
        min-height: 20px;
        .ant-color-picker-clear {
          height: 20px;
        }
      }
    }
  }
}



//ui-rc-table-ping-right

.#{$prefix}-table-wrapper .#{$prefix}-table.#{$prefix}-table-bordered >.#{$prefix}-table-container >.#{$prefix}-table-content >table >thead>tr >.#{$prefix}-table-cell-fix-right-first::after,
.#{$prefix}-table-wrapper .#{$prefix}-table.#{$prefix}-table-bordered >.#{$prefix}-table-container >.#{$prefix}-table-header >table >thead>tr >.#{$prefix}-table-cell-fix-right-first::after,
.#{$prefix}-table-wrapper .#{$prefix}-table.#{$prefix}-table-bordered >.#{$prefix}-table-container >.#{$prefix}-table-body >table >thead>tr >.#{$prefix}-table-cell-fix-right-first::after,
.#{$prefix}-table-wrapper .#{$prefix}-table.#{$prefix}-table-bordered >.#{$prefix}-table-container >.#{$prefix}-table-summary >table >thead>tr >.#{$prefix}-table-cell-fix-right-first::after,
.#{$prefix}-table-wrapper .#{$prefix}-table.#{$prefix}-table-bordered >.#{$prefix}-table-container >.#{$prefix}-table-content >table >tbody>tr >.#{$prefix}-table-cell-fix-right-first::after,
.#{$prefix}-table-wrapper .#{$prefix}-table.#{$prefix}-table-bordered >.#{$prefix}-table-container >.#{$prefix}-table-header >table >tbody>tr >.#{$prefix}-table-cell-fix-right-first::after,
.#{$prefix}-table-wrapper .#{$prefix}-table.#{$prefix}-table-bordered >.#{$prefix}-table-container >.#{$prefix}-table-body >table >tbody>tr >.#{$prefix}-table-cell-fix-right-first::after,
.#{$prefix}-table-wrapper .#{$prefix}-table.#{$prefix}-table-bordered >.#{$prefix}-table-container >.#{$prefix}-table-summary >table >tbody>tr >.#{$prefix}-table-cell-fix-right-first::after,
.#{$prefix}-table-wrapper .#{$prefix}-table.#{$prefix}-table-bordered >.#{$prefix}-table-container >.#{$prefix}-table-content >table >tfoot>tr >.#{$prefix}-table-cell-fix-right-first::after,
.#{$prefix}-table-wrapper .#{$prefix}-table.#{$prefix}-table-bordered >.#{$prefix}-table-container >.#{$prefix}-table-header >table >tfoot>tr >.#{$prefix}-table-cell-fix-right-first::after,
.#{$prefix}-table-wrapper .#{$prefix}-table.#{$prefix}-table-bordered >.#{$prefix}-table-container >.#{$prefix}-table-body >table >tfoot>tr >.#{$prefix}-table-cell-fix-right-first::after,
.#{$prefix}-table-wrapper .#{$prefix}-table.#{$prefix}-table-bordered >.#{$prefix}-table-container >.#{$prefix}-table-summary >table >tfoot>tr >.#{$prefix}-table-cell-fix-right-first::after {
  border-inline-end: 1px solid $tableBorderColor;
}


// toolbar

.ui-rc-toolbar-bottom {
  .be-toolbar-item {
    .toolbar-dropdown-button {
      .ant-btn.ant-btn-default.ant-btn-variant-outlined.ant-btn-compact-item.ant-btn-compact-first-item {
        border-color: #28c76f;
      }
      .ant-btn.ant-btn-default.ant-btn-variant-outlined.ant-btn-compact-item.ant-btn-compact-last-item {
        border-color: #28c76f;
        .ant-btn-icon {
          color: #28c76f;
        }
      }
    }

  }
}


.react-resizable {
  position: relative;
  background-clip: padding-box;
}

.rc-resizable-handle {
  position: absolute;
  //right: 10px;
  right: 0px;
  bottom: 0;
  z-index: 1;
  width: 5px;
  height: 100%;
  cursor: col-resize;
  //transform: translateY(-50%);
  &.none {
    cursor: auto;
    display: none;
  }
}

.rs-picker-popup {
  z-index: 1660;
}