.table-container {
    overflow-x: auto;
    max-width: 100vw;
    border-radius: 8px;
    color: #101828;
      
      table {
        border-collapse: collapse;
        font-family: 'Inter';
        table-layout: fixed;
      }
      th {
        padding: 16px 0px;
        text-align: right;
        font-weight: 500;
        color: #98A2B3;
        position: sticky;
        top: 0;
        z-index: 9;
        height: 54px;
        overflow: hidden !important;
        white-space: nowrap;
        background: #F4F6FA;
        > div {
          padding: 3px 16px 3px 0;
          border-inline-end: 1px solid #dedede;
        }
        > div > div {
          padding-left: 20px;
        }
      }
      th:last-child {
        max-width: unset!important;
        width: 100%!important;
      }

      table tbody {
        z-index: 60;
      }

      th:nth-child(1),
      td:nth-child(1) {
        /* width: 524px !important;
        min-width: 524px !important;
        max-width: 524px !important; */
        box-sizing: border-box;
        z-index: 500;
      }

      th:nth-child(1),
      td:nth-child(1) {
        position: sticky;
        left: 0;
      }

      th:nth-child(1){
        padding-left: 64px;
        text-align: left;
      }

      th:nth-child(2) {
        width: 128px !important;
        min-width: 128px !important;
        max-width: 128px !important;
      }

      th:nth-child(3),
      td:nth-child(3),
      th:nth-child(4),
      td:nth-child(4),
      th:nth-child(5),
      td:nth-child(5),
      th:nth-child(6),
      td:nth-child(6) {
        /* width: 128px !important;
        min-width: 128px !important;
        max-width: 128px !important; */
        box-sizing: border-box;
      }
      
      th:nth-child(2),
      td:nth-child(2),
      th:nth-child(3),
      td:nth-child(3),
      th:nth-child(4),
      td:nth-child(4),
      th:nth-child(5),
      td:nth-child(5),
      th:nth-child(6),
      td:nth-child(6) {
        text-align: right !important;
      }
      
      .article-cell {
        width: 100%;
        overflow: hidden;
        text-overflow: ellipsis;
        white-space: nowrap;
        text-overflow: ellipsis !important;
      }
      
      td {
        padding: 0 12px;
        border-bottom: 1px solid #edf2f7;
        vertical-align: center;
        height: 56px;
      }

      tr.first-in-group {
        background-color: #f4f6fa;
        font-weight: 500;
      }
      tr.balance-row, tr.balance-end-row {
        font-weight: 500;
      }

      tr {
        background-color: #fff;
      }
      tbody tr:not(.balance-row):not(.balance-end-row):hover {
        background-color: #F9F0FF!important;
      }
      tr:not(.balance-row):not(.balance-end-row) > td:has(.amount-cell):hover {
        background-color: #EFDBFF!important;
      }
      /* tr:not(.balance-row):not(.balance-end-row) > td:has(.amount-cell):hover:before {
        display: none;
      } */
      tr.depth-2 {
        background-color: #fff;
      }
      
      tr.depth-3 {
        background-color: #fff;
      }
      
      .article-cell {
        position: relative;
        cursor: pointer;
        min-width: 250px;
      }
      
      .current {
        background: #F4F6FA;
      }
      
      .account {
        font-size: 0.85em;
        color: #718096;
        margin-top: 4px;
        white-space: nowrap;
        overflow: hidden;
        text-overflow: ellipsis;
      }
      
      .amount-cell {
        text-align: right;
        color: #52C41A;
        padding-right: 4px;
        cursor: pointer;
      }
      
      .sub-amount {
        color: #73D13D;
        font-size: 14px;
        font-weight: 400;
        margin-top: 4px;
      }
      
      .quarter-scroll {
        display: flex;
        overflow-x: auto;
      }
      
      .edit-input {
        width: 100%;
        padding: 6px 8px;
        border: 1px solid #cbd5e0;
        border-radius: 4px;
        font-size: 1em;
      }
      
      .actions-cell {
        text-align: center;
        min-width: 50px;
      }
      
      .actions-cell button {
        background: #4299e1;
        color: white;
        border: none;
        border-radius: 50%;
        width: 28px;
        height: 28px;
        cursor: pointer;
        font-size: 16px;
        line-height: 1;
      }
      
      .actions-cell button:hover {
        background: #3182ce;
      }
      
      .balance-row {
        /* background-color: #475467 !important; */
        color: #fff !important;
        height: 56px;
        border-radius: 16px;
      }
      
      .balance-row .account,
      .balance-row .sub-amount {
        color: rgba(255, 255, 255, 0.8) !important;
      }
      .balance-end-row .sub-amount {
        color: rgba(255, 255, 255, 0.8) !important;
      }
      
      .balance-row .actions-cell button {
        background: rgba(255, 255, 255, 0.2) !important;
        color: white !important;
      }
      
      .balance-row .actions-cell button:hover {
        background: rgba(255, 255, 255, 0.3) !important;
      }
      
      .balance-row .edit-input {
        background: rgba(255, 255, 255, 0.1);
        color: white;
        border-color: rgba(255, 255, 255, 0.3);
      }
      .balance-row > td, .balance-end-row > td {
        background-color: #475467 !important;
      }
      .balance-row > td:nth-child(1), .balance-end-row td:nth-child(1){
        border-radius: 8px 0 0 8px;
      }
      .balance-row > td:nth-child(2):after, .balance-end-row td:nth-child(2):after {
        display: none;
      }
      .balance-row > td:last-of-type, .balance-end-row > td:last-of-type  {
        border-radius: 0 8px 8px 0;
      }
      .undistributed-row {
        background: #FFFBE6;
      }

      .table tr:hover {
        background: #F9F0FF;
      }

      .article-cell img {
        width: 16px;
        height: 16px;
        display: inline-block;
        vertical-align: middle;
      }

      /* .depth-1 .article-cell {
        padding-left: 35px !important;
      }

      .depth-2 .article-cell {
        padding-left: 55px !important;
      }

      .depth-3 .article-cell {
        padding-left: 75px !important;
      } */

      .article-cell {
        position: relative;
        cursor: pointer;
        min-width: 250px;
        font-weight: 400;
      }

      .current {
        background: #F4F6FA;
      }

      .account {
        font-size: 0.85em;
        color: #718096;
        margin-top: 4px;
      }
      
      .amount-cell {
        min-width: 100px;
        text-align: right;
        color: #52C41A;
      }
      
      /* .sub-amount {
        color: #73D13D;
        font-size: 0.9em;
        margin-top: 4px;
      } */

      .customTooltip {
        max-width: unset;
        width: 600px;
      }
      
      .quarter-scroll {
        display: flex;
        overflow-x: auto;
      }
      
      .edit-input {
        width: 100%;
        padding: 6px 8px;
        border: 1px solid #cbd5e0;
        border-radius: 4px;
        font-size: 1em;
      }
      
      .actions-cell {
        text-align: center;
        min-width: 50px;
      }
      
      .actions-cell button {
        background: #4299e1;
        color: white;
        border: none;
        border-radius: 50%;
        width: 28px;
        height: 28px;
        cursor: pointer;
        font-size: 16px;
        line-height: 1;
      }
      
      .actions-cell button:hover {
        background: #3182ce;
      }
    
    .balance-row {
        /* background-color: #475467 !important; */
        color: #fff !important;
        height: 56px;
        position: sticky;
      }
      
      .balance-row .account,
      .balance-row .sub-amount {
        color: rgba(255, 255, 255, 0.8) !important;
      }
      
      .balance-row .actions-cell button {
        background: rgba(255, 255, 255, 0.2) !important;
        color: white !important;
      }
      
      .balance-row .actions-cell button:hover {
        background: rgba(255, 255, 255, 0.3) !important;
      }
      
      .balance-row .edit-input {
        background: rgba(255, 255, 255, 0.1);
        color: white;
        border-color: rgba(255, 255, 255, 0.3);
      }
    
      .undistributed-row {
        background: #FFFBE6;
      }
      .icon-button {
        width: 40px;
        height: 40px;
        display: flex;
        align-items: center;
      }
      .icon-button-check {
        width: 40px;
        height: 40px;
        display: flex;
        background: #722ED1;
        align-items: center;
      }
      .icon-button-check:hover {
        background: #722ED1 !important;
      }
      .action-icons {
        margin-left: auto;
        display: flex;
        gap: 8px;
      }
      .edit-input {
        height: 40px;
        border: 1px solid #722ED1;
        border-radius: 8px;
        width: 320px;
      }

      .drag-handle {
        display: inline-flex;
        align-items: center;
        cursor: grab;
        padding: 4px;
        margin-right: 8px;
      }
      
      .drag-handle img {
        width: 16px;
        height: 16px;
        opacity: 0.6;
        transition: opacity 0.2s;
      }
      
      .drag-handle:hover img {
        opacity: 1;
      }

      
/* Фиксация первого столбца с наследованием фона */
th:nth-child(1),
td:nth-child(1) {
  position: sticky;
  left: 0;
  z-index: 9;
  background: inherit;
}

th:nth-child(1) {
  background: #F4F6FA;
  z-index: 10 !important;
}

th:nth-child(2) {
  background: #F4F6FA !important;
  z-index: 10 !important;
}

/* Фиксация второго столбца с наследованием фона */
th:nth-child(2),
td:nth-child(2) {
  position: sticky;
  left: 524px;
  z-index: 9;
  background: inherit;
}
th:nth-child(2):after,
td:nth-child(2):after {
  content: "";
  display: block;
  position: absolute;
  height: 56px;
  width: 1px;
  background-color: #722ed1;
  right: 0;
  top: 0;
} 

.depth-1 {
  background-color: #fff;
}
.depth-0 {
  background-color: #fff;
}

.depth-2 {
  background-color: #fff;
}

.depth-3 {
  background-color: #fff;
}
}

/* Специальные стили для строк с разным фоном */
.balance-row, .balance-end-row {
  /* background-color: #475467 !important; */
  color: #fff !important;
}

.balance-row {
position: absolute;
top: 52px;
z-index: 10;
}

.balance-end-row {
  position: sticky;
  bottom: 0;
  left: 0;
  right: 0;
  z-index: 10;
}

.balance-end-row td {
  border-bottom: none !important
}

.undistributed-row {
  background: #FFFBE6 !important;
}