.table__header th {
    cursor: pointer;
}

.table__header {
    box-shadow: inset 0 2px #E0E0E0, 0 1px #E0E0E0;
    position: sticky;
    top: 51px;
    background: #fff;
    height: 3rem;
    z-index: 9;
}

.transaction__table--cell[data-column^=serverDateTime] {
    padding-left: 6px;
}

.table__header--button {
    display: flex;
    align-items: center;
    padding: 0;
    border: none;
    font: inherit;
    color: inherit;
    background-color: transparent;
    cursor: pointer;
    text-align: left;
}

.table__header--img {
    height: 15px;
    width: 15px;
}

.transaction__table--cell {
    display: flex;
    align-items: center;
    font-family: 'Inter';
    font-style: normal;
    font-weight: 500;
    font-size: .7vw;
    line-height: .8vw;
    color: #333333;
    direction: ltr;
    text-align: start;
}

#transaction-table {
    div[data-key="rrn"] {
        padding-right: 20px;
    }
}

.transaction__table--cell--flex {
    display: flex;
    align-items: center;
}

.time__cell--icon {
    margin-right: 5px;
}

.payment__method__icon {
    margin-right: 10px;
    line-height: 8px;
}

.transaction__table--payment-name {
    line-height: 12px;
    padding-right: 5px;
}

.transaction__table--body .transaction__table--row:nth-child(odd) {
    background-color: #F7F8FA;
}

tbody tr.transaction__table--row {
    border: 2px solid transparent;
}

tbody tr.transaction__table--row:hover {
    background: #eee !important;
    cursor: pointer;
    z-index: 11;
    transition: background .5s;
}

tbody .transaction__table--cell {
    min-height: 3rem;
}

table.transaction__table tr,
table.transaction__table thead,
table.transaction__table tbody,
table.transaction__table td,
table.transaction__table th {
    vertical-align: middle;
}

table tr.transaction__table--row._shown {
    box-shadow: inset 5px 0 0 #2193a7;
    border-radius: 0;
    transition: box-shadow .5s;
}

.transaction__table tr th:nth-child(1) {
    width: 6vw;

}
.transaction__table tr th:nth-child(2) {
    width: 6vw;
}
.transaction__table tr th:nth-child(3) {
    width: 6vw;
}
.transaction__table tr th:nth-child(10) {
    width: 6vw;
}
.transaction__table tr th:nth-child(11) {
    width: 6vw;
}
.transaction__table tr th:nth-child(12) {
    width: 6vw;
}
.transaction__table tr th:nth-child(13) {
    width: 6vw;
}

.overflow-wrap {
    overflow-wrap: anywhere;
}
.transaction__table tr._shown {
    border-radius: 10px;
    border: 2px solid transparent !important;
}