.tableBox table {
    border: 1px solid #fff;
    display: block;
}
.zonesWrapper {
    display: flex;
    justify-content: flex-start;
    align-items: center;
    margin-bottom: 12px;
    flex-wrap: wrap;
}
.zonesContent {
    display: flex;
    align-items: center;
}
tbody.filterBody::-webkit-scrollbar {
    display: none;
}
.zonesWrapper p {
    margin: 0;
    padding-right: 25px;
    font-size: 14px;
}
.zonesWrapper span {
    padding: 6px;
    border-radius: 1000px;
    margin-right: 5px;
}
.tableBox table td {
    border: 1px solid rgba(18, 48, 73, .08);
    min-width: 55px; 
    height: 36px;
    font-size: 14px;
    padding: 8px;
    text-align: left;
    cursor: default;
    width: 55px !important;
}
.tableBox table tbody>tr:nth-child(odd)>td {
    background-color: transparent;
}
.Africa {
    background-color: #92b3de !important;
}
[data-value="Africa"]:before {
    content: '';
    background-color: #92b3de !important;
    width: 11px !important;
    height: 11px !important;
    border-radius: 1000px;
    margin-right: 6px;
    display: block;
}
.Asia.Pacific {
    background-color: #aaa6d7 !important;
}
[data-value="Asia Pacific"]:before {
    content: '';
    background-color: #aaa6d7 !important;
    width: 11px !important;
    height: 11px !important;
    border-radius: 1000px;
    margin-right: 6px;
    display: block;
}
.China{
    background-color: #a6d7c9 !important;
}
[data-value="China"]:before {
    content: '';
    background-color: #a6d7c9 !important;
    width: 11px !important;
    height: 11px !important;
    border-radius: 1000px;
    margin-right: 6px;
    display: block;
}
.Europe {
    background-color: #90e8d4 !important;
}
[data-value="Europe"]:before {
    content: '';
    background-color: #90e8d4 !important;
    width: 11px !important;
    height: 11px !important;
    border-radius: 1000px;
    margin-right: 6px;
    display: block;
}
.Middle.East {
    background-color: #97dce1 !important;
}
[data-value="Middle East"]:before {
    content: '';
    background-color: #97dce1 !important;
    width: 11px !important;
    height: 11px !important;
    border-radius: 1000px;
    margin-right: 6px;
    display: block;
}
.North.America {
    background-color: #dccfe3 !important;
}
[data-value="North America"]:before {
    content: '';
    background-color: #dccfe3 !important;
    width: 11px !important;
    height: 11px !important;
    border-radius: 1000px;
    margin-right: 6px;
    display: block;
}
.South.America {
    background-color: #ace0af !important;
} 
[data-value="South America"]:before {
    content: '';
    background-color: #ace0af !important;
    width: 11px !important;
    height: 11px !important;
    border-radius: 1000px;
    margin-right: 6px;
    display: block;
}

.multiSelectBox {
    margin-bottom: 35px !important;
    padding: 14px !important;
    border-radius: 18px !important;
    background-color: transparent !important;
}

.ui.selection.dropdown.active,
.ui.selection.dropdown.visible {
    border-radius: 18px !important;
}

.tableWrapper .disabled.item {
    font-weight: 700 !important;
    color: #3E3E3E !important;
    opacity: 1 !important;
    display: flex !important;
    align-items: center;
}

[data-tooltip]::after {
    white-space: pre;
}

.filterBody tr:hover>td:not(:first-child) {
    background-color: rgba(0, 185, 227, .08) !important;
}

[data-tooltip]:after {
    opacity: 1;
    transition: all .1s ease;
    font-size: 12px;
    line-height: 16px;
    font-weight: 400;
    font-style: normal;
    border: none !important;
    background-color: #fff;
    color: #123049 !important;
    border-radius: 4px;
    box-shadow: 0px 2px 2px 0px hsla(0, 2%, 52%, .14), 0px 3px 1px -2px transparent, 0px 1px 5px 0px transparent;
    z-index: 99999;
}

.filterHead td {
    border: none !important;
}

.selectedColumn:not(:first-child) {
    background-color: rgba(0, 185, 227, .16) !important;
}

.selectedRow td:not(:first-child) {
    background-color: rgba(0, 185, 227, .16) !important;
}

.tableBox::-webkit-scrollbar {
    width: 10px;
    height: 10px;
    border-radius: 10px;
}

.tableBox::-webkit-scrollbar-thumb {
    background-color: #cdd5dc;
    border-radius: 10px;
}

.tableBox::-webkit-scrollbar-thumb:hover {
    background-color: #cdd5dc;
}

.tableBox::-webkit-scrollbar-track {
    border-radius: 10px;
}

.tableBox {
    overflow: auto;
    height: 600px;
    position: relative;
}

.multiSelectBox .icon:before {
    font-family: 'Font Awesome 5 Free' !important;
}

.multiSelectBox .label {
    opacity: 1 !important;
    background-color: hsla(195, 6%, 57%, .16) !important;
    border: none !important;
    box-shadow: unset !important;
    color: rgba(18, 48, 73, .88) !important;
    font-size: 14px !important;
    border-radius: calc(24px / 2);
    font-weight: 500;
}

.multiSelectBox .dropdown.icon {
    top: 20px !important;
}

.filterHead tr > td {
    border-right: 1px solid transparent !important;
} 

.filterBody tr > td.noHide {
    border-bottom: 1px solid transparent !important;
}
.filterHead tr td{
    position: sticky;
    z-index:2;
    top: 0;
}
.filterHead tr > :first-child {
    z-index:3;
    left:0;
    top:0;
}
.filterBody tr > :first-child {
    position: sticky;
    z-index: 4;
    left:0;
}




















/* 

.tableBox {
    overflow: auto;
    height: 700px;
    position: relative;
}

.tableWrapper table {
    border: 1px solid #fff;
    display: block;
}

.zonesWrapper {
    display: flex;
    justify-content: flex-start;
    align-items: center;
    margin-bottom: 12px;
    flex-wrap: wrap;
}

.zonesContent {
    display: flex;
    align-items: center;
}

.tableWrapper table thead,
.tableWrapper table tbody {
    display: block;
}

tbody.filterBody {
    height: 700px !important;
    overflow-x: hidden;
    overflow-y: auto;
    width: max-content !important;
    scrollbar-width: none;
}

tbody.filterBody::-webkit-scrollbar {
    display: none;
}

.zonesWrapper p {
    margin: 0;
    padding-right: 25px;
    font-size: 14px;
}

.zonesWrapper span {
    padding: 6px;
    border-radius: 1000px;
    margin-right: 5px;
}

.tableWrapper table td {
    border: 1px solid rgba(18, 48, 73, .08);
    min-width: 50px;
    height: 36px;
    font-size: 14px;
    padding: 8px;
    text-align: left;
    cursor: default;
    width: 50px !important;
}

.tableWrapper table tbody>tr:nth-child(odd)>td {
    background-color: transparent;
}

.Africa {
    background-color: #92b3de !important;
}
[data-value="Africa"]:before {
    content: '';
    background-color: #92b3de !important;
    width: 11px !important;
    height: 11px !important;
    border-radius: 1000px;
    margin-right: 6px;
    display: block;
}
.Asia.Pacific {
    background-color: #aaa6d7 !important;
}
[data-value="Asia Pacific"]:before {
    content: '';
    background-color: #aaa6d7 !important;
    width: 11px !important;
    height: 11px !important;
    border-radius: 1000px;
    margin-right: 6px;
    display: block;
}
.Europe {
    background-color: #90e8d4 !important;
}
[data-value="Europe"]:before {
    content: '';
    background-color: #90e8d4 !important;
    width: 11px !important;
    height: 11px !important;
    border-radius: 1000px;
    margin-right: 6px;
    display: block;
}
.Middle.East {
    background-color: #97dce1 !important;
}
[data-value="Middle East"]:before {
    content: '';
    background-color: #97dce1 !important;
    width: 11px !important;
    height: 11px !important;
    border-radius: 1000px;
    margin-right: 6px;
    display: block;
}
.North.America {
    background-color: #dccfe3 !important;
}
[data-value="North America"]:before {
    content: '';
    background-color: #dccfe3 !important;
    width: 11px !important;
    height: 11px !important;
    border-radius: 1000px;
    margin-right: 6px;
    display: block;
}
.South.America {
    background-color: #ace0af !important;
} 
[data-value="South America"]:before {
    content: '';
    background-color: #ace0af !important;
    width: 11px !important;
    height: 11px !important;
    border-radius: 1000px;
    margin-right: 6px;
    display: block;
}

.multiSelectBox {
    margin-bottom: 35px !important;
    padding: 14px !important;
    border-radius: 18px !important;
    background-color: transparent !important;
}

.ui.selection.dropdown.active,
.ui.selection.dropdown.visible {
    border-radius: 18px !important;
}

.tableWrapper .disabled.item {
    font-weight: 700 !important;
    color: #3E3E3E !important;
    opacity: 1 !important;
}

[data-tooltip]::after {
    white-space: pre;
}

.filterBody tr:hover>td:not(:first-child) {
    background-color: rgba(0, 185, 227, .08) !important;
}

[data-tooltip]:after {
    opacity: 1;
    transition: all .1s ease;
    font-size: 12px;
    line-height: 16px;
    font-weight: 400;
    font-style: normal;
    border: none !important;
    background-color: #fff;
    color: #123049 !important;
    border-radius: 4px;
    box-shadow: 0px 2px 2px 0px hsla(0, 2%, 52%, .14), 0px 3px 1px -2px transparent, 0px 1px 5px 0px transparent;
}

.tableWrapper .filterBody td:first-child {
    border: none !important;
}

.filterHead td {
    border: none !important;
}

.selectedColumn:not(:first-child) {
    background-color: rgba(0, 185, 227, .16) !important;
}

.selectedRow td:not(:first-child) {
    background-color: rgba(0, 185, 227, .16) !important;
}

.tableBox::-webkit-scrollbar {
    width: 10px;
    height: 10px;
    border-radius: 10px;
}

.tableBox::-webkit-scrollbar-thumb {
    background-color: #cdd5dc;
    border-radius: 10px;
}

.tableBox::-webkit-scrollbar-thumb:hover {
    background-color: #cdd5dc;
}

.tableBox::-webkit-scrollbar-track {
    border-radius: 10px;
}

.tableBox {
    overflow: hidden;
    position: relative;
    overflow-x: auto;
}

.multiSelectBox .icon:before {
    font-family: 'Font Awesome 5 Free' !important;
}

.multiSelectBox .label {
    opacity: 1 !important;
    background-color: hsla(195, 6%, 57%, .16) !important;
    border: none !important;
    box-shadow: unset !important;
    color: rgba(18, 48, 73, .88) !important;
    font-size: 14px !important;
    border-radius: calc(24px / 2);
    font-weight: 500;
}

.multiSelectBox .dropdown.icon {
    top: 20px !important;
} */