.vacci-infolist-stretch-section {
    height: 100%;
}

.vacci-infolist-stretch-section .fi-section {
    display: flex;
    height: 100%;
    flex-direction: column;
}

.vacci-infolist-stretch-section .fi-section-content-ctn {
    flex: 1;
}

/* ── Pack order modal ─────────────────────────────────────────────────────── */

.fi-modal .vacci-pack-modal-wrapper {
    padding: 0;
    margin-top: 0.25rem;
}

.fi-modal .vacci-pack-modal-wrapper .fi-fo-placeholder-content {
    padding: 0;
}

.vacci-pack-modal {
    width: 100%;
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
}

.vacci-pack-empty {
    margin: 0.75rem 0 0;
    font-size: 0.875rem;
    color: rgb(107 114 128);
}

.fi-modal .vacci-pack-modal-wrapper .vacci-pack-table {
    width: 100%;
    min-width: 42rem;
    border-collapse: separate;
    border-spacing: 0;
    border: 1px solid rgb(209 213 219);
    border-radius: 0.5rem;
    overflow: hidden;
    font-size: 0.875rem;
    table-layout: fixed;
    display: table !important;
    background: rgb(255 255 255);
}

.dark .fi-modal .vacci-pack-modal-wrapper .vacci-pack-table {
    border-color: rgb(75 85 99);
    background: rgb(17 24 39);
}

.fi-modal .vacci-pack-modal-wrapper .vacci-pack-col-vaccine { width: 12%; }
.fi-modal .vacci-pack-modal-wrapper .vacci-pack-col-source { width: 24%; }
.fi-modal .vacci-pack-modal-wrapper .vacci-pack-col-batch { width: 12%; }
.fi-modal .vacci-pack-modal-wrapper .vacci-pack-col-qty { width: 14%; }
.fi-modal .vacci-pack-modal-wrapper .vacci-pack-col-expiry { width: 16%; }
.fi-modal .vacci-pack-modal-wrapper .vacci-pack-col-vvm { width: 10%; }

.fi-modal .vacci-pack-modal-wrapper .vacci-pack-table thead {
    display: table-header-group !important;
}

.fi-modal .vacci-pack-modal-wrapper .vacci-pack-table tbody {
    display: table-row-group !important;
}

.fi-modal .vacci-pack-modal-wrapper .vacci-pack-table tr {
    display: table-row !important;
}

.fi-modal .vacci-pack-modal-wrapper .vacci-pack-table th,
.fi-modal .vacci-pack-modal-wrapper .vacci-pack-table td {
    display: table-cell !important;
    vertical-align: middle;
    text-align: left;
    padding: 0.875rem 1rem !important;
    border-right: 1px solid rgb(209 213 219);
    border-bottom: 1px solid rgb(209 213 219);
    line-height: 1.4;
    word-wrap: break-word;
    overflow-wrap: anywhere;
}

.dark .fi-modal .vacci-pack-modal-wrapper .vacci-pack-table th,
.dark .fi-modal .vacci-pack-modal-wrapper .vacci-pack-table td {
    border-right-color: rgb(75 85 99);
    border-bottom-color: rgb(75 85 99);
}

.fi-modal .vacci-pack-modal-wrapper .vacci-pack-table th:last-child,
.fi-modal .vacci-pack-modal-wrapper .vacci-pack-table td:last-child {
    border-right: none;
}

.fi-modal .vacci-pack-modal-wrapper .vacci-pack-table tbody tr:last-child td,
.fi-modal .vacci-pack-modal-wrapper .vacci-pack-table tbody tr:last-child th {
    border-bottom: none;
}

.fi-modal .vacci-pack-modal-wrapper .vacci-pack-table__meta-row th {
    width: 8rem;
    font-size: 0.6875rem;
    font-weight: 600;
    letter-spacing: 0.04em;
    text-transform: uppercase;
    color: rgb(107 114 128);
    background: rgb(249 250 251);
    white-space: nowrap;
}

.dark .fi-modal .vacci-pack-modal-wrapper .vacci-pack-table__meta-row th {
    color: rgb(156 163 175);
    background: rgb(31 41 55);
}

.fi-modal .vacci-pack-modal-wrapper .vacci-pack-table__meta-row td {
    font-weight: 500;
    color: rgb(17 24 39);
    background: rgb(249 250 251);
}

.dark .fi-modal .vacci-pack-modal-wrapper .vacci-pack-table__meta-row td {
    color: rgb(243 244 246);
    background: rgb(31 41 55);
}

.fi-modal .vacci-pack-modal-wrapper .vacci-pack-table thead th {
    font-size: 0.6875rem;
    font-weight: 700;
    letter-spacing: 0.05em;
    text-transform: uppercase;
    color: rgb(75 85 99);
    background: rgb(243 244 246);
    white-space: nowrap;
}

.dark .fi-modal .vacci-pack-modal-wrapper .vacci-pack-table thead th {
    color: rgb(209 213 219);
    background: rgb(31 41 55);
}

.fi-modal .vacci-pack-modal-wrapper .vacci-pack-table__data-row td {
    color: rgb(55 65 81);
    background: rgb(255 255 255);
}

.dark .fi-modal .vacci-pack-modal-wrapper .vacci-pack-table__data-row td {
    color: rgb(209 213 219);
    background: rgb(17 24 39);
}

.fi-modal .vacci-pack-modal-wrapper .vacci-pack-table__data-row--alert td {
    background: rgb(254 242 242);
}

.dark .fi-modal .vacci-pack-modal-wrapper .vacci-pack-table__data-row--alert td {
    background: rgb(127 29 29 / 0.2);
}

.fi-modal .vacci-pack-modal-wrapper .vacci-pack-table__vaccine {
    font-weight: 600;
    color: rgb(17 24 39) !important;
}

.dark .fi-modal .vacci-pack-modal-wrapper .vacci-pack-table__vaccine {
    color: rgb(243 244 246) !important;
}

.fi-modal .vacci-pack-modal-wrapper .vacci-pack-table__source {
    font-size: 0.8125rem;
    color: rgb(107 114 128) !important;
}

.dark .fi-modal .vacci-pack-modal-wrapper .vacci-pack-table__source {
    color: rgb(156 163 175) !important;
}

.fi-modal .vacci-pack-modal-wrapper .vacci-pack-table__expiry--bad {
    font-weight: 600;
    color: rgb(220 38 38) !important;
}

.dark .fi-modal .vacci-pack-modal-wrapper .vacci-pack-table__expiry--bad {
    color: rgb(248 113 113) !important;
}

.fi-modal .vacci-pack-modal-wrapper .vacci-pack-status {
    display: inline-flex;
    align-items: center;
    padding: 0.25rem 0.625rem;
    border-radius: 9999px;
    font-size: 0.75rem;
    font-weight: 600;
    white-space: nowrap;
}

.fi-modal .vacci-pack-modal-wrapper .vacci-pack-status--success {
    background: rgb(220 252 231);
    color: rgb(21 128 61);
}

.dark .fi-modal .vacci-pack-modal-wrapper .vacci-pack-status--success {
    background: rgb(34 197 94 / 0.2);
    color: rgb(134 239 172);
}

.fi-modal .vacci-pack-modal-wrapper .vacci-pack-status--danger {
    background: rgb(254 226 226);
    color: rgb(185 28 28);
}

.dark .fi-modal .vacci-pack-modal-wrapper .vacci-pack-status--danger {
    background: rgb(239 68 68 / 0.2);
    color: rgb(252 165 165);
}

/* Checklist items in pack modal */
.vacci-pack-check-item {
    padding: 0.625rem 0.75rem;
    border-radius: 0.375rem;
    border: 1px solid rgb(229 231 235);
    background: rgb(255 255 255);
}

.dark .vacci-pack-check-item {
    border-color: rgb(255 255 255 / 0.08);
    background: rgb(255 255 255 / 0.02);
}

.fi-modal .fi-fo-section .vacci-pack-check-item + .vacci-pack-check-item {
    margin-top: 0.5rem;
}

@media (max-width: 768px) {
    .fi-modal .vacci-pack-modal-wrapper .vacci-pack-table {
        min-width: 36rem;
    }
}