/* ==========================================================================
   Tables / Pagination
   ========================================================================== */

.app-table-shell {
    width: min(calc(100% - 1.5rem), 1600px);
    margin: 0 auto 1rem;
    padding: 0;
    overflow-x: auto;
    overflow-y: hidden;
    border: 1px solid var(--arcs-border);
    border-radius: 1rem;
    background: var(--arcs-surface);
    clip-path: inset(0 round 1rem);
}

.app-table-shell-fill {
    width: 100%;
    max-width: none;
}

.app-page-hero .app-table-shell,
.legacy-normalized-page .app-table-shell {
    width: 100%;
    max-width: none;
}

.app-table-shell .table {
    margin-bottom: 0;
    border-collapse: separate;
    border-spacing: 0;
}

.app-table-shell .table-bordered {
    border: 0;
}

.app-table-shell .table-bordered > :not(caption) > * > * {
    border-top-width: 0;
    border-left-width: 0;
}

.app-table-shell .table-bordered > :not(caption) > * > *:last-child {
    border-right-width: 0;
}

.app-table-shell .table-bordered > tbody:last-child > tr:last-child > *,
.app-table-shell .table-bordered > tfoot > tr:last-child > * {
    border-bottom-width: 0;
}

.app-table-shell .table td,
.app-table-shell .table th,
table.table td,
table.table th {
    padding: 0.85rem 0.65rem;
    vertical-align: middle;
    background-clip: padding-box;
}

.app-table-shell .table tbody tr:nth-child(even) td,
table.table tbody tr:nth-child(even) td {
    background: var(--arcs-table-row-alt);
}

.app-table-shell .table tbody tr:hover td,
table.table tbody tr:hover td {
    background: var(--arcs-table-row-hover);
}

.app-table-shell .table.table-hover > tbody > tr:hover > *,
table.table-hover > tbody > tr:hover > * {
    color: var(--arcs-text);
    background-color: var(--arcs-table-row-hover);
}

.table-bordered tr td {
    border: 1px solid color-mix(in srgb, var(--arcs-text) 20%, transparent);
}

.thead-dark,
.table .thead-dark,
thead.table-dark {
    color: #ffffff;
    background: #343a40;
}

.thead-dark th,
.table .thead-dark th,
thead.table-dark th,
.table thead.table-dark th,
.app-data-table thead.table-dark th,
.app-data-table thead.thead-dark th,
.app-data-table .thead-dark th {
    color: #ffffff;
    border-color: #454d55;
    background: #343a40;
}

[data-bs-theme="light"] .thead-dark,
[data-bs-theme="light"] .table .thead-dark,
[data-bs-theme="light"] thead.table-dark {
    color: #ffffff;
    background: #343a40;
}

[data-bs-theme="light"] .thead-dark th,
[data-bs-theme="light"] .table .thead-dark th,
[data-bs-theme="light"] thead.table-dark th,
[data-bs-theme="light"] .app-data-table thead.table-dark th,
[data-bs-theme="light"] .app-data-table thead.thead-dark th,
[data-bs-theme="light"] .app-data-table .thead-dark th {
    color: #ffffff;
    border-color: #454d55;
    background: #343a40;
}

.customtable thead th,
.customtable tbody td {
    vertical-align: middle !important;
    font-size: 12px;
}

.customtable tbody tr {
    color: #ffffff;
    border-width: 2px 0;
    border-style: solid;
    border-color: #ffffff;
}

.customtable1 thead th,
.customtable1 tbody td {
    vertical-align: middle !important;
    color: var(--arcs-text);
    font-family: var(--arcs-font-sans);
    font-size: 14px;
}

.app-data-table {
    color: var(--arcs-text);
    font-family: var(--arcs-font-sans);
}

.app-data-table-fill {
    width: 100%;
}

.app-column-fit {
    width: fit-content;
}

.app-action-column {
    min-width: 150px;
}

.app-action-column-sm {
    min-width: 120px;
}

.app-fa,
.app-icon,
.app-icon-input,
.app-icon-btn,
.app-icon-nav,
.app-action-icon {
    display: inline-block;
    line-height: 1;
    text-align: center;
    vertical-align: middle;
}

.app-fa {
    --_app-fa-family: var(--fa-family, var(--fa-style-family, "Font Awesome 7 Free"));
    width: var(--fa-width, 1.25em);
    font-family: var(--_app-fa-family);
    font-feature-settings: normal;
    font-style: normal;
    font-synthesis: none;
    font-variant: normal;
    font-weight: var(--fa-style, 900);
    text-rendering: auto;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}

.app-fa::before {
    display: inline-block;
    content: var(--fa) / "";
}

@supports not (content: "" / "") {
    .app-fa::before {
        content: var(--fa);
    }
}

.app-fa-solid {
    --fa-style-family: "Font Awesome 7 Free";
    --fa-style: 900;
}

.app-fa-regular {
    --fa-style-family: "Font Awesome 7 Free";
    --fa-style: 400;
}

.app-fa-brands {
    --fa-style-family: "Font Awesome 7 Brands";
    --fa-style: 400;
}

.app-fa-xs {
    font-size: calc(12 / 16 * 1em);
    line-height: calc(1 / 12 * 1em);
    vertical-align: calc((6 / 12 - 0.375) * 1em);
}

.icon-account {
    --fa: "\f2bd";
}

.icon-alert {
    --fa: "\f06a";
}

.icon-archive {
    --fa: "\f187";
}

.icon-arrow-right {
    --fa: "\f061";
}

.icon-ban {
    --fa: "\f05e";
}

.icon-building {
    --fa: "\f1ad";
}

.icon-calendar {
    --fa: "\f073";
}

.icon-camera {
    --fa: "\f030";
}

.icon-car {
    --fa: "\f1b9";
}

.icon-caret-down-square {
    --fa: "\f150";
}

.icon-circle-question,
.icon-question {
    --fa: "\f059";
}

.icon-circle-xmark {
    --fa: "\f057";
}

.icon-check {
    --fa: "\f00c";
}

.icon-chevron-down {
    --fa: "\f078";
}

.icon-chip {
    --fa: "\f2db";
}

.icon-city {
    --fa: "\f64f";
}

.icon-clock {
    --fa: "\f017";
}

.icon-comment {
    --fa: "\f4ad";
}

.icon-credit-card {
    --fa: "\f09d";
}

.icon-currency {
    --fa: "\$";
}

.icon-delete {
    --fa: "\f2ed";
}

.icon-door-open {
    --fa: "\f52b";
}

.icon-drive {
    --fa: "\f0a0";
}

.icon-edit {
    --fa: "\f044";
}

.icon-ellipsis {
    --fa: "\f141";
}

.icon-envelope {
    --fa: "\f0e0";
}

.icon-error {
    --fa: "\f06a";
}

.icon-excel {
    --fa: "\f1c3";
}

.icon-eye {
    --fa: "\f06e";
}

.icon-eye-slash {
    --fa: "\f070";
}

.icon-flag {
    --fa: "\f024";
}

.icon-globe {
    --fa: "\f0ac";
}

.icon-globe-americas {
    --fa: "\f57d";
}

.icon-hashtag {
    --fa: "\#";
}

.icon-id-card {
    --fa: "\f2c2";
}

.icon-info {
    --fa: "\f05a";
}

.icon-invoice {
    --fa: "\f571";
}

.icon-key {
    --fa: "\f084";
}

.icon-launch {
    --fa: "\f35d";
}

.icon-layers {
    --fa: "\f5fd";
}

.icon-link {
    --fa: "\f0c1";
}

.icon-list {
    --fa: "\f0ca";
}

.icon-location {
    --fa: "\f3c5";
}

.icon-lock {
    --fa: "\f023";
}

.icon-map-pin {
    --fa: "\f276";
}

.icon-mobile {
    --fa: "\f3cd";
}

.icon-network {
    --fa: "\f6ff";
}

.icon-page-first {
    --fa: "\f100";
}

.icon-page-last {
    --fa: "\f101";
}

.icon-page-next {
    --fa: "\f105";
}

.icon-page-prev {
    --fa: "\f104";
}

.icon-paper-plane,
.icon-send {
    --fa: "\f1d8";
}

.icon-parking {
    --fa: "\f540";
}

.icon-phone {
    --fa: "\f879";
}

.icon-plug {
    --fa: "\f1e6";
}

.icon-print {
    --fa: "\f02f";
}

.icon-receipt {
    --fa: "\f543";
}

.icon-refresh {
    --fa: "\f021";
}

.icon-required {
    --fa: "\f621";
}

.icon-restore {
    --fa: "\f0e2";
}

.icon-road {
    --fa: "\f018";
}

.icon-route {
    --fa: "\f4d7";
}

.icon-save {
    --fa: "\f0c7";
}

.icon-search {
    --fa: "\f002";
}

.icon-settings {
    --fa: "\f013";
}

.icon-shield {
    --fa: "\f3ed";
}

.icon-site {
    --fa: "\e51c";
}

.icon-ticket {
    --fa: "\f3ff";
}

.icon-times {
    --fa: "\f00d";
}

.icon-trash {
    --fa: "\f1f8";
}

.icon-transfer {
    --fa: "\f362";
}

.icon-unlock {
    --fa: "\f09c";
}

.icon-user {
    --fa: "\f007";
}

.icon-user-add {
    --fa: "\f234";
}

.icon-register-user {
    --fa: "\f234";
}

.icon-user-edit {
    --fa: "\f4ff";
}

.icon-user-shield {
    --fa: "\f505";
}

.icon-user-tie {
    --fa: "\f508";
}

.icon-vehicle {
    --fa: "\f5e4";
}

.icon-video {
    --fa: "\f03d";
}

.icon-warning {
    --fa: "\f071";
}

.app-icon-input {
    width: 1rem;
}

.app-icon-btn,
.app-icon-nav {
    min-width: 1em;
}

.app-action-icon {
    font-size: large;
}

.app-action-icon-danger {
    color: var(--arcs-danger);
}

.app-action-icon-warning {
    color: var(--arcs-warning);
}

.app-icon-required {
    width: auto;
    margin-left: 0.2rem;
    color: var(--arcs-accent);
}

.input-group-text .app-icon-input,
.app-form-icon-addon .app-icon-input {
    width: 1rem;
}

.page-link .app-icon-nav {
    width: 1rem;
}

.app-table-total-row {
    border-top: 2px solid color-mix(in srgb, var(--arcs-text) 55%, transparent);
}

.pagination {
    flex-wrap: wrap;
    gap: 0.35rem;
}

.page-link {
    min-width: 2.25rem;
    border-radius: 0.55rem;
    border-color: var(--arcs-border);
    background: var(--arcs-surface);
    color: var(--arcs-heading);
}

.page-link:hover,
.page-link:focus {
    border-color: color-mix(in srgb, var(--arcs-border-strong) 72%, var(--arcs-accent) 28%);
    background: var(--arcs-surface-alt);
    color: var(--arcs-heading);
}

.page-item.active .page-link,
.page-link.active {
    border-color: color-mix(in srgb, var(--arcs-accent) 52%, #343a40 48%);
    background: color-mix(in srgb, var(--arcs-accent) 22%, #343a40 78%);
    color: #ffffff;
}

.page-item.disabled .page-link,
.page-link.disabled {
    border-color: var(--arcs-border);
    background: var(--arcs-surface-muted);
    color: var(--arcs-text-muted);
}

.font-weight-medium {
    font-weight: 500 !important;
}

.a.disabled {
    pointer-events: auto;
}

