.login-wrapper > figure img {
    object-fit: contain !important;
}

.login--heading > img {
    display: none;
}
table.lab-sample-list-state-table:not(.dataTable) {
    width: 250px;
    table-layout: fixed;
    border-collapse: collapse;
}
.lab-sample-list-state-table th,
.lab-sample-list-state-table td {
    width: 50%;
    padding: 2px 4px;
    vertical-align: top;
}
.lab-sample-list-state-table th {
    white-space: nowrap;
}
.lab-sample-list-state-table tr + tr th,
.lab-sample-list-state-table tr + tr td {
    border-top: 1px solid #e6e6e6;
}

.modal.iframe-modal.modal-size-small .modal--header {
    width: 30vw;
}

.modal.iframe-modal.modal-size-small .modal--content {
    height: 30vh;
    width: 30vw;
}

.modal.iframe-modal.modal-size-medium .modal--header {
    width: 50vw;
}

.modal.iframe-modal.modal-size-medium .modal--content {
    height: 50vh;
    width: 50vw;
}

.lab-sample-param-values-popup {
    margin: 0 auto;
}

a.lab-sample-param-values-popup {
    margin-left: 10px;
    padding: 0px 5px;
    border: 1px solid #aaa;
    border-radius: 5px;
}

.param-hover-badge {
    cursor: default;
    font-size: 0.75em;
}

.param-hover-float {
    position: fixed;
    z-index: 9999;
    background: #fff;
    border: 1px solid #dee2e6;
    border-radius: 0.375rem;
    box-shadow: 0 0.25rem 0.75rem rgba(0, 0, 0, 0.15);
    padding: 0.5rem;
    pointer-events: none;
    white-space: nowrap;
}

.font-weight-bold {
    font-weight: bold;
}

hr {
    width: 100%;
}

.lab-sample-progress-with-percent {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    white-space: nowrap;
}

.lab-sample-progress-percent {
    flex: 0 0 48px;
    width: 48px;
    text-align: right;
    margin-right: 8px;
}

.lab-sample-progress-with-percent .progress {
    flex: 0 0 140px;
    width: 140px;
    margin-bottom: 0;
}

th.lab-sample-progress-head-right {
    text-align: right;
}

.link-detail,
.link-detail:visited,
.link-detail:hover,
.link-detail:active,
.link-detail:focus {
    background-color: transparent;
    color: #256C91;
    font-family: "Roboto", system-ui, -apple-system, "Segoe UI", "Helvetica Neue", "Noto Sans", "Liberation Sans", Arial, sans-serif;
    font-size: 14px;
    font-weight: 400;
    line-height: 21px;
    text-decoration: none;
    text-decoration-color: #256C91;
}

.dataTables_wrapper a.link-detail,
.dataTables_wrapper a.link-detail:visited,
.dataTables_wrapper a.link-detail:hover,
.dataTables_wrapper a.link-detail:active,
.dataTables_wrapper a.link-detail:focus {
    color: #256C91;
    text-decoration: none;
    text-decoration-color: #256C91;
    font-weight: 400;
    letter-spacing: normal;
    font-family: "Roboto", system-ui, -apple-system, "Segoe UI", "Helvetica Neue", "Noto Sans", "Liberation Sans", Arial, sans-serif;
    font-size: 14px;
    line-height: 21px;
}

.link-detail .lab-sample-number,
.link-detail .lab-sample-year,
.link-detail .lab-sample-serial,
.link-detail .lab-sample-year + .lab-sample-serial::before {
    color: inherit;
    font-family: inherit;
    font-size: inherit;
    font-weight: inherit;
    letter-spacing: inherit;
}

.login-wrapper .login--description {
    display: none;
}

.login-wrapper figure {
    padding: 50px;
}

.accordion-item h2.accordion-header button.accordion-button {
    padding: 0 10px;
}

table.dataTable > tbody > tr .accordion-header,
table.dataTable > tbody > tr .accordion-button,
table.dataTable > tbody > tr .accordion-body {
    font-size: 14px;
    line-height: 1.5;
}

body.election_layout_login header {
    display: none;
}

body.election_layout_login main {
    padding-top: 0;
}
/* Better table hover effect for data tables */
.table-hover > tbody > tr:hover > *,
table.dataTable > tbody > tr:hover > * {
    --bs-table-bg-state: rgba(0, 0, 0, 0.035);
    background-color: var(--bs-table-bg-state) !important;
}

[data-bs-theme="dark"] .table-hover > tbody > tr:hover > *,
[data-bs-theme="dark"] table.dataTable > tbody > tr:hover > * {
    --bs-table-bg-state: rgba(255, 255, 255, 0.04);
    background-color: var(--bs-table-bg-state) !important;
}

.table-hover > tbody > tr:hover > *,
table.dataTable > tbody > tr:hover > * {
    box-shadow: inset 0 0 0 9999px var(--bs-table-bg-state) !important;
}

/* Ensure Accordions inside Hovered Table Rows display the Hover Effect */
.table-hover > tbody > tr:hover .accordion-button,
table.dataTable > tbody > tr:hover .accordion-button {
    background-color: var(--bs-table-bg-state, rgba(0, 0, 0, 0.035)) !important;
}

[data-bs-theme="dark"] .table-hover > tbody > tr:hover .accordion-button,
[data-bs-theme="dark"] table.dataTable > tbody > tr:hover .accordion-button {
    background-color: var(--bs-table-bg-state, rgba(255, 255, 255, 0.04)) !important;
}

/* Also make accordion items background transparent so the row color shows through */
.table-hover > tbody > tr .accordion-item,
table.dataTable > tbody > tr .accordion-item {
    background-color: transparent !important;
}

.table-hover > tbody > tr .accordion-button,
table.dataTable > tbody > tr .accordion-button {
    background-color: transparent;
}

/* Select2 visual invalid state */
.is-invalid ~ .select2-container .select2-selection,
select.form-control.is-invalid ~ .select2-container .select2-selection {
    border-color: #dc3545 !important;
    padding-right: calc(1.5em + 0.75rem);
    background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 12' width='12' height='12' fill='none' stroke='%23dc3545'%3e%3ccircle cx='6' cy='6' r='4.5'/%3e%3cpath stroke-linejoin='round' d='M5.8 3.6h.4L6 6.5z'/%3e%3ccircle cx='6' cy='8.2' r='.6' fill='%23dc3545' stroke='none'/%3e%3c/svg%3e");
    background-repeat: no-repeat;
    background-position: right calc(0.375em + 0.1875rem) center;
    background-size: calc(0.75em + 0.375rem) calc(0.75em + 0.375rem);
}

/* DataTables length select styles (show dropdown arrow) */
.dataTables_wrapper .dataTables_length select {
    display: inline-block !important;
    padding: 0.25rem 2.25rem 0.25rem 0.5rem !important;
    font-size: 0.875rem !important;
    font-weight: 400 !important;
    line-height: 1.5 !important;
    color: var(--bs-body-color) !important;
    background-color: var(--bs-body-bg) !important;
    background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3e%3cpath fill='none' stroke='%23343a40' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='m2 5 6 6 6-6'/%3e%3c/svg%3e") !important;
    background-repeat: no-repeat !important;
    background-position: right 0.75rem center !important;
    background-size: 16px 12px !important;
    border: var(--bs-border-width, 1px) solid var(--bs-border-color, #dee2e6) !important;
    border-radius: var(--bs-border-radius, 0.375rem) !important;
    appearance: none !important;
    -moz-appearance: none !important;
    -webkit-appearance: none !important;
    margin: 0 0.5rem !important;
}

[data-bs-theme="dark"] .dataTables_wrapper .dataTables_length select {
    background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3e%3cpath fill='none' stroke='%23dee2e6' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='m2 5 6 6 6-6'/%3e%3c/svg%3e") !important;
}

/* DataTables Search Filter override */
.dataTables_wrapper .dataTables_filter {
    position: relative !important;
    display: inline-flex !important;
    align-items: center !important;
}

.dataTables_wrapper .dataTables_filter label {
    display: flex !important;
    align-items: center !important;
    position: relative !important;
}

/* Hide screenreader span or implicit text properly without font-size: 0 hack */
.dataTables_wrapper .dataTables_filter label span.sr-only {
    display: none !important;
}

/* Make sure input behaves, excluding hidden inputs */
.dataTables_wrapper .dataTables_filter label input[type="search"]:not([style*="display: none"]) {
    margin-left: 0rem !important;
    padding-left: 2.25rem !important;
    display: inline-block !important;
    border: var(--bs-border-width, 1px) solid var(--bs-border-color, #dee2e6) !important;
    border-radius: var(--bs-border-radius, 0.375rem) !important;
    padding-top: 0.375rem !important;
    padding-bottom: 0.375rem !important;
    padding-right: 0.75rem !important;
    background-color: var(--bs-body-bg) !important;
    color: var(--bs-body-color) !important;
}

.dataTables_wrapper .dataTables_filter label::before {
    content: "" !important; /* FA Magnifying Glass replaced via SVG mask */
    width: 1rem !important;
    height: 1rem !important;
    background-color: var(--bs-secondary-color, #6c757d) !important;
    mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 640 640'%3E%3Cpath stroke='none' d='M480 272C480 317.9 465.1 360.3 440 394.7L566.6 521.4C579.1 533.9 579.1 554.2 566.6 566.7C554.1 579.2 533.8 579.2 521.3 566.7L394.7 440C360.3 465.1 317.9 480 272 480C157.1 480 64 386.9 64 272C64 157.1 157.1 64 272 64C386.9 64 480 157.1 480 272zM272 416C351.5 416 416 351.5 416 272C416 192.5 351.5 128 272 128C192.5 128 128 192.5 128 272C128 351.5 192.5 416 272 416z'/%3E%3C/svg%3E") !important;
    mask-repeat: no-repeat !important;
    mask-position: center !important;
    -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 640 640'%3E%3Cpath stroke='none' d='M480 272C480 317.9 465.1 360.3 440 394.7L566.6 521.4C579.1 533.9 579.1 554.2 566.6 566.7C554.1 579.2 533.8 579.2 521.3 566.7L394.7 440C360.3 465.1 317.9 480 272 480C157.1 480 64 386.9 64 272C64 157.1 157.1 64 272 64C386.9 64 480 157.1 480 272zM272 416C351.5 416 416 351.5 416 272C416 192.5 351.5 128 272 128C192.5 128 128 192.5 128 272C128 351.5 192.5 416 272 416z'/%3E%3C/svg%3E") !important;
    -webkit-mask-repeat: no-repeat !important;
    -webkit-mask-position: center !important;
    position: absolute !important;
    left: 0.75rem !important; 
    top: 50% !important;
    transform: translateY(-50%) !important;
    z-index: 4 !important;
    pointer-events: none !important;
}