.responsive-data-table {
    --table-min-width: 36rem;
    width: 100%;
    min-width: var(--table-min-width);
    border-collapse: separate;
    border-spacing: 0;
    font-size: var(--type-label, 0.875rem);
    line-height: 1.45;
    font-variant-numeric: tabular-nums;
}

.responsive-data-table[data-table-density="compact"] {
    --table-min-width: 28rem;
}

.responsive-data-table > thead > tr > th {
    padding: 0.65rem 0.75rem;
    font-size: inherit;
    font-weight: 600;
    line-height: 1.35;
    letter-spacing: normal;
    text-transform: none;
    white-space: normal;
    vertical-align: bottom;
    background-color: #eef2f5;
    color: var(--text, #243746);
}

.responsive-data-table > tbody > tr > :is(th, td) {
    padding: 0.65rem 0.75rem !important;
    vertical-align: top;
}

.responsive-data-table .table-numeric-cell,
.responsive-data-table .table-nowrap-cell {
    white-space: nowrap;
}

.responsive-data-table .table-numeric-cell {
    text-align: right;
}

.data-table-scroll,
.data-table-scrollport {
    max-width: 100%;
    min-width: 0;
    overflow: auto;
    position: relative;
    isolation: isolate;
    -webkit-overflow-scrolling: touch;
}

.data-table-scrollport:focus-visible {
    outline: 3px solid var(--primary, #008000);
    outline-offset: 3px;
}

.table-scroll-managed {
    overflow: visible !important;
    min-width: 0;
    max-width: 100%;
}

.chart-container:has(.responsive-data-table .dropdown-menu.show),
.table-container:has(.responsive-data-table .dropdown-menu.show) {
    position: relative;
    transform: none !important;
    transition: none !important;
    z-index: 20;
}

.data-table-scrollport:has(.responsive-data-table .dropdown-menu.show) {
    z-index: 5;
}

.responsive-data-table .dropdown-menu {
    max-width: calc(100vw - 2rem);
    max-height: calc(100vh - 2rem);
    max-height: calc(100dvh - 2rem);
    overflow-y: auto;
    overscroll-behavior: contain;
}

.responsive-data-table .btn-action {
    min-width: 44px;
    min-height: 44px;
}

.responsive-data-table .table-key-cell,
.responsive-data-table .table-leading-cell {
    position: sticky;
    inset-inline-start: 0;
    z-index: 2;
    background-color: var(--surface, #fff);
    background-clip: padding-box;
}

.responsive-data-table .table-key-cell {
    width: var(--table-key-width, 8.5rem);
    min-width: var(--table-key-width, 8.5rem);
    max-width: var(--table-key-width, 8.5rem);
    white-space: normal;
    overflow-wrap: anywhere;
    box-shadow: 1px 0 0 #dbe2e8, 4px 0 6px -5px rgba(15, 23, 42, 0.35);
}

.responsive-data-table[data-freeze-leading="2"] .table-key-cell {
    inset-inline-start: var(--table-leading-width, 2.5rem);
}

.responsive-data-table .table-leading-cell {
    width: var(--table-leading-width, 2.5rem);
    min-width: var(--table-leading-width, 2.5rem);
    max-width: var(--table-leading-width, 2.5rem);
    text-align: center;
    white-space: nowrap;
}

.responsive-data-table > thead .table-key-cell,
.responsive-data-table > thead .table-leading-cell {
    z-index: 3;
    background-color: #eef2f5;
    color: var(--text, #243746);
}

.responsive-data-table.table-striped > tbody > tr:nth-of-type(odd) > .table-key-cell,
.responsive-data-table.table-striped > tbody > tr:nth-of-type(odd) > .table-leading-cell {
    background-color: #f0f3f5;
}

.responsive-data-table > tbody > tr:hover > .table-key-cell,
.responsive-data-table > tbody > tr:hover > .table-leading-cell {
    background-color: #edf6ed;
}

.responsive-data-table > tbody > tr.table-active > .table-key-cell,
.responsive-data-table > tbody > tr.table-active > .table-leading-cell,
.responsive-data-table > tbody > tr.row-selected > .table-key-cell,
.responsive-data-table > tbody > tr.row-selected > .table-leading-cell {
    background-color: #daecda;
}

.dataTables_scrollBody .responsive-data-table > thead > tr > th {
    position: static;
    padding-block: 0 !important;
    border-block-width: 0 !important;
}

.dataTables_scrollHead {
    isolation: isolate;
}

#subcounty_ranking_table {
    --table-min-width: 58rem;
    table-layout: fixed;
}

#subcounty_ranking_table th,
#subcounty_ranking_table td {
    overflow-wrap: anywhere;
}

#subcounty_ranking_table .table-numeric-cell,
#subcounty_ranking_table .table-nowrap-cell {
    overflow-wrap: normal;
}

#usersTable.responsive-data-table > tbody > tr > td {
    vertical-align: middle;
    padding-block: 0.5rem !important;
}

#usersTable.responsive-data-table th:nth-child(13) {
    width: 120px;
}

.responsive-data-table .action-buttons {
    flex-direction: row;
    flex-wrap: nowrap;
}

#usersTable.responsive-data-table .table-key-cell {
    overflow: visible;
    text-overflow: clip;
    white-space: normal;
}

#usersTable.responsive-data-table .table-key-cell .user-avatar-cell > span:last-child {
    overflow: visible;
    text-overflow: clip;
    white-space: normal;
    overflow-wrap: anywhere;
}

@media (max-width: 600px) {
    #usersTable.responsive-data-table .table-key-cell .user-avatar {
        display: none;
    }
}

@media print {
    .responsive-data-table .table-key-cell,
    .responsive-data-table .table-leading-cell {
        position: static;
        box-shadow: none;
        width: auto;
        min-width: 0;
        max-width: none;
    }

    .responsive-data-table {
        min-width: 0;
    }

    .data-table-scrollport {
        overflow: visible;
    }
}
