html, body {
    margin: 0;
    padding: 0;
    height: 100%;
    font-family: 'Roboto', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
    background: #f5f5f5;
    color: #333;
}

.acp-app {
    display: flex;
    flex-direction: column;
    height: 100vh;
    overflow: hidden;
}

.acp-appbar {
    flex-shrink: 0;
    background: #ffffff;
    border-bottom: 1px solid #dee2e6;
    padding: 0 1rem;
    height: 56px;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.04);
}
.acp-logo {
    font-weight: 700;
    color: #0066cc;
    font-size: 1.5rem;
    letter-spacing: 0.5px;
    margin-right: 0.5rem;
}
.acp-title {
    color: #555;
    font-size: 1rem;
    font-weight: 500;
}
.acp-appbar-facility {
    margin-right: 1rem;
}
.acp-facility-placeholder {
    color: #999;
    font-size: 0.85rem;
    font-style: italic;
}
.acp-username {
    margin: 0 0.75rem;
    color: #333;
    font-size: 0.9rem;
}

.acp-body {
    display: flex;
    flex: 1;
    overflow: hidden;
}
.acp-sidebar {
    width: 260px;
    flex-shrink: 0;
    background: #fafafa;
    border-right: 1px solid #dee2e6;
    overflow-y: auto;
}
.acp-main {
    flex: 1;
    overflow: auto;
    padding: 1rem 1.5rem;
    background: #ffffff;
}

/* Nav */
.acp-nav {
    padding: 0.5rem 0;
}
.acp-nav-single {
    padding: 0.5rem 1rem;
    border-bottom: 1px solid #eee;
    margin-bottom: 0.5rem;
}
.acp-nav-link-top {
    color: #333;
    font-weight: 600;
    text-decoration: none;
    display: flex;
    align-items: center;
    gap: 0.5rem;
}

.acp-nav-group {
    border-bottom: 1px solid #eee;
}
.acp-nav-summary {
    padding: 0.6rem 1rem;
    cursor: pointer;
    font-weight: 600;
    color: #333;
    display: flex;
    align-items: center;
    gap: 0.5rem;
    list-style: none;
    user-select: none;
    background: #f0f0f0;
    transition: background 0.15s;
}
.acp-nav-summary::-webkit-details-marker {
    display: none;
}
.acp-nav-summary::before {
    content: "▸";
    display: inline-block;
    color: #999;
    font-size: 0.8rem;
    transition: transform 0.15s;
    width: 0.8rem;
}
.acp-nav-group[open] > .acp-nav-summary::before {
    transform: rotate(90deg);
}
.acp-nav-summary:hover {
    background: #e8e8e8;
}

.acp-nav-links {
    display: flex;
    flex-direction: column;
    padding: 0.25rem 0;
    background: #fafafa;
}
.acp-nav-link {
    color: #555;
    text-decoration: none;
    font-size: 0.9rem;
    padding: 0.4rem 1rem 0.4rem 2.5rem;
    display: block;
    transition: background 0.1s, color 0.1s;
    border-left: 3px solid transparent;
}
.acp-nav-link:hover {
    background: #eef4fb;
    color: #0066cc;
}
.acp-nav-link.active {
    background: #e3f0ff;
    color: #0066cc;
    font-weight: 600;
    border-left-color: #0066cc;
}

/* WIP */
.acp-wip {
    text-align: center;
    padding: 4rem 2rem;
    color: #666;
}
.acp-wip h2 {
    margin: 1rem 0;
    color: #333;
}

/* Reload/error UI */
#blazor-error-ui {
    background: #ffe082;
    bottom: 0;
    box-shadow: 0 -1px 2px rgba(0, 0, 0, .2);
    display: none;
    left: 0;
    padding: 0.6rem 1.25rem 0.7rem 1.25rem;
    position: fixed;
    width: 100%;
    z-index: 1000;
}
#blazor-error-ui .dismiss {
    cursor: pointer;
    position: absolute;
    right: 0.75rem;
    top: 0.5rem;
}

.acp-facility-error {
    color: #b00020;
    text-decoration: underline;
    font-size: 0.85rem;
    cursor: pointer;
}
.acp-facility-loading {
    color: #999;
    font-size: 0.85rem;
    font-style: italic;
}
.acp-facility-empty {
    color: #999;
    font-size: 0.85rem;
}

/* --- Master-detail (Residents page) --- */
.acp-splitter {
    border: none !important;
    background: transparent !important;
}
.acp-master-pane {
    display: flex;
    flex-direction: column;
    height: 100%;
    background: #ffffff;
    border-right: 1px solid #dee2e6;
}
.acp-search-controls {
    padding: 0.75rem 1rem;
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
    border-bottom: 1px solid #eee;
    background: #fafafa;
}
.acp-radio-row {
    display: flex;
}
.acp-resident-list {
    flex: 1;
    overflow-y: auto;
    padding: 0.25rem 0;
}
.acp-list-msg {
    padding: 1rem;
    color: #999;
    font-size: 0.9rem;
    margin: 0;
}
.acp-resident-item {
    padding: 0.5rem 1rem;
    cursor: pointer;
    border-bottom: 1px solid #f2f2f2;
    font-size: 0.9rem;
    color: #333;
}
.acp-resident-item:hover {
    background: #f5f9ff;
}
.acp-resident-item.selected {
    background: #e3f0ff;
    color: #0066cc;
    font-weight: 600;
    border-left: 3px solid #0066cc;
    padding-left: calc(1rem - 3px);
}

.acp-detail-pane {
    height: 100%;
    overflow-y: auto;
    padding: 1rem 1.5rem;
    background: #ffffff;
}
.acp-detail-empty {
    text-align: center;
    color: #999;
    padding: 5rem 2rem;
    font-style: italic;
}
.acp-demographics-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin: 0.5rem 0 1.5rem 0;
    padding-bottom: 0.5rem;
    border-bottom: 2px solid #eee;
}
.acp-demographics-header h2 {
    margin: 0;
    color: #333;
    font-size: 1.3rem;
}

.acp-field-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 1rem 2rem;
    padding: 0.5rem 0;
}
.acp-field {
    display: flex;
    flex-direction: column;
    min-width: 0;
}
.acp-field label {
    color: #888;
    font-size: 0.78rem;
    text-transform: none;
    margin-bottom: 0.15rem;
}
.acp-field > div {
    color: #222;
    font-size: 0.95rem;
    border-bottom: 1px solid #eee;
    padding: 0.2rem 0;
    min-height: 1.4em;
    word-break: break-word;
}
.acp-toggle {
    color: #0066cc;
    cursor: pointer;
    margin-left: 0.6rem;
    font-size: 0.8rem;
    text-decoration: underline;
}
.acp-error {
    color: #b00020;
    padding: 1rem;
    font-size: 0.9rem;
}

/* Take the padding off .acp-main for Residents page so Splitter fills space */
.acp-main:has(.acp-splitter) {
    padding: 0;
}

/* --- Demographics section cards (Identity / Personal / Address / Contact) --- */
.acp-demo-sections {
    display: flex;
    flex-direction: column;
    gap: 0.75rem;
    padding-bottom: 1rem;
}
.acp-demo-card.k-card {
    border: 1px solid #dee2e6;
    box-shadow: none;
    border-radius: 4px;
    background: #ffffff;
}
.acp-demo-card .k-card-header {
    background: #f5f7fa;
    padding: 0.4rem 0.9rem;
    border-bottom: 1px solid #dee2e6;
}
.acp-demo-card .k-card-title {
    font-size: 0.72rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.06em;
    color: #555;
    margin: 0;
}
.acp-demo-card .k-card-body {
    padding: 0.75rem 1rem;
}
.acp-demo-card .acp-field-grid {
    padding: 0;
    gap: 0.75rem 2rem;
}

/* --- Sidebar navigation: TelerikPanelBar --- */
.acp-panelbar.k-panelbar {
    border: none;
    background: transparent;
    width: 100%;
    font-family: inherit;
}
/* Neutralize Telerik's default clickable-row padding so our template controls it fully */
.acp-panelbar .k-panelbar-item > .k-link,
.acp-panelbar .k-panelbar-header > .k-link {
    padding: 0;
    background: transparent;
    border: none;
    color: inherit;
}
.acp-panelbar .k-panelbar-item > .k-link:hover {
    background: transparent;
}
/* Parent group header (Resident / Financial) */
.acp-panelbar-parent {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.6rem 1rem;
    color: #333;
    font-weight: 600;
    font-size: 0.9rem;
    background: #f0f0f0;
    width: 100%;
    box-sizing: border-box;
    border-bottom: 1px solid #eee;
}
.acp-panelbar .k-panelbar-header:hover .acp-panelbar-parent {
    background: #e8e8e8;
}
/* Leaf item — clickable NavLink */
.acp-panelbar-leaf {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.5rem 1rem;
    color: #333;
    text-decoration: none;
    font-size: 0.9rem;
    font-weight: 500;
    border-left: 3px solid transparent;
    box-sizing: border-box;
    width: 100%;
    transition: background 0.1s, color 0.1s;
}
.acp-panelbar-leaf:hover {
    background: #eef4fb;
    color: #0066cc;
}
.acp-panelbar-leaf.active {
    background: #e3f0ff;
    color: #0066cc;
    font-weight: 600;
    border-left-color: #0066cc;
    padding-left: calc(1rem - 3px);
}
/* Deeper indent for children of a group; smaller & lighter than top-level leaves */
.acp-panelbar .k-panelbar-content .acp-panelbar-leaf {
    padding-left: 2.5rem;
    font-size: 0.85rem;
    font-weight: 400;
    color: #555;
    background: #fafafa;
}
.acp-panelbar .k-panelbar-content .acp-panelbar-leaf:hover {
    background: #eef4fb;
    color: #0066cc;
}
.acp-panelbar .k-panelbar-content .acp-panelbar-leaf.active {
    padding-left: calc(2.5rem - 3px);
    background: #e3f0ff;
    color: #0066cc;
    font-weight: 600;
}

/* --- Demographics edit mode --- */
.acp-edit-actions {
    display: flex;
    gap: 0.5rem;
}
/* fraResidentNameNumber (.frm:36): a captioned frame holding a centred bordered name box and a
   right-justified number box, both white with the legacy blue text. */
.acp-resident-name-frame {
    flex: 1 1 auto;
    margin: 0;
    min-width: 0;
}
.acp-resident-name-row {
    display: flex;
    gap: 0.4rem;
    align-items: center;
}
.acp-resident-name-box,
.acp-resident-num-box {
    background: #fff;
    border: 1px solid #7F9DB9;
    color: #0000C0;
    font-size: 0.8rem;
    padding: 0.2rem 0.35rem;
    height: 1.55rem;
    line-height: 1.15rem;
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
}
.acp-resident-name-box {
    flex: 1 1 auto;
    text-align: center;
    min-width: 0;
}
.acp-resident-num-box {
    flex: 0 0 5.5rem;
    text-align: right;
}

/* Frame13 (.frm:2808): the Status radios and Bed Number combo, across the bottom of the form
   beneath the tab pane rather than inside the Demographics pane. */
.acp-status-bed-frame {
    margin: 0.6rem 0 0 0;
}
.acp-status-bed-row {
    display: flex;
    gap: 1.2rem;
    align-items: center;
    flex-wrap: wrap;
}
.acp-status-bed-field {
    display: flex;
    align-items: center;
    gap: 0.45rem;
    min-width: 0;
}
.acp-status-bed-field > label {
    color: #000;
    font-size: 0.78rem;
    white-space: nowrap;
}
.acp-status-bed-grow {
    flex: 1 1 320px;
}
/* Disabled VB6 textbox: sunken grey, not an empty gap. */
.acp-readonly-box {
    background: #E0E0E0;
    border: 1px solid #7F9DB9;
    font-size: 0.78rem;
    padding: 0.2rem 0.35rem;
    min-height: 1.5rem;
    min-width: 8rem;
    flex: 1 1 auto;
}

/* The VB6 Demographics tab is two fixed columns of label-beside-control rows, not a flow grid:
   identity down the left (.frm labels at left=420, controls at 1500), address and contact down the
   right (labels 4260, controls 5340).

   Zoom-robust sizing: the outer grid caps at max-width so the form does not stretch across a huge
   viewport on zoom-out; each column uses minmax(0, 1fr) so a child never pushes its cell wider
   than the cell allows on zoom-in. The label column stays fixed in rem so it scales with the
   browser font size, and the control column caps at max-width to keep dropdowns/textboxes from
   ballooning into oversized rectangles at low zoom. */
.acp-demo-columns {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
    gap: 0.35rem 2rem;
    align-items: start;
    max-width: 1100px;
}
.acp-demo-col {
    display: flex;
    flex-direction: column;
    gap: 0.3rem;
    min-width: 0;
}
.acp-demo-col .acp-field {
    display: grid;
    grid-template-columns: minmax(6.5rem, 8.5rem) minmax(0, 1fr);
    align-items: center;
    gap: 0.5rem;
    margin: 0;
}
.acp-demo-col .acp-field > label {
    text-align: right;
    font-size: 0.78rem;
    color: #000;
    white-space: nowrap;
    justify-self: end;
}
/* Cap the control cell so a stretched viewport does not blow the textbox into a huge rectangle;
   the input still scales down naturally on zoom-in because the column is minmax(0, 1fr). */
.acp-demo-col .acp-field > :not(label) {
    min-width: 0;
    max-width: 22rem;
}
/* Label59 under the S.S.N caption (.frm:3120). */
.acp-label-hint {
    display: block;
    font-size: 0.62rem;
    color: #666;
}
/* City / State and Zip / +4 share one row in the VB6 (same Top). Grid caps each control at
   minmax(0, 1fr) so State / +4 cannot squeeze City / Zip out of the row, and inline labels stay
   compact. Overrides the .acp-field max-width above so the two-control pairing stays intact. */
.acp-demo-col .acp-field-pair {
    grid-template-columns: minmax(6.5rem, 8.5rem) minmax(0, 1fr) auto minmax(0, 1fr);
}
.acp-demo-col .acp-field-pair > :not(label):not(.acp-label-inline) {
    max-width: none;
}
.acp-demo-col .acp-field-pair > .acp-label-inline {
    justify-self: end;
    white-space: nowrap;
    font-size: 0.78rem;
}
/* An error helper spans the whole row rather than squeezing beside the control. */
.acp-demo-col .acp-field > .acp-field-helper {
    grid-column: 2 / -1;
}
/* Frame9, spanning both columns under them (.frm:760). */
.acp-medicare-billing {
    margin-top: 0.7rem;
}

/* SSTab1 over SSTab2: the outer strip carries the four form groups, the inner one the four
   Demographics panes. The inner strip is inset so the two levels read apart. */
.acp-inner-tabs {
    margin-top: 0.35rem;
}

/* CheckHoldStatus (frmPatientMaster.frm:6997) — "Locked by User: <name>" ribbon at the top of
   the resident header. Red left-bar signals the concurrency lock without stopping read access. */
.acp-hold-banner {
    padding: 0.35rem 0.6rem;
    margin: 0.25rem 0 0.5rem;
    background: #FDECEC;
    border-left: 4px solid #C0392B;
    color: #7B241C;
    font-size: 0.82rem;
    border-radius: 2px;
}
.acp-hold-banner strong { color: #4A0E08; }

/* frmPatientMaster.frm:8903 "Save or cancel before changing tab screens" — replaces the legacy
   MsgBox with a persistent inline hint so the disabled sibling tabs read as intentional rather
   than broken. Yellow-amber tint matches the desktop-app "you cannot do this yet" cue. */
.acp-tab-lock-hint {
    padding: 0.3rem 0.6rem;
    margin-bottom: 0.35rem;
    background: #FFF6DC;
    border: 1px solid #E0C86B;
    color: #664D00;
    font-size: 0.78rem;
    border-radius: 2px;
}

/* Ledger Cards / Face Sheets / Transfer, under the Status / Bed frame and above the command
   panel. Centred so the three bars below the tabs read as one stack. */
.acp-report-bar {
    display: flex;
    gap: 0.5rem;
    justify-content: flex-start;
    flex-wrap: wrap;
    margin-top: 0.6rem;
}
/* MaintenanceControlPanel1 (.frm:439): one command row across the bottom of the form, below the
   tab pane, the way the VB6 panel sits under the SSTab. */
.acp-command-bar {
    display: flex;
    gap: 0.4rem;
    align-items: center;
    justify-content: space-between;
    flex-wrap: wrap;
    margin-top: 0.6rem;
    padding: 0.5rem 0.6rem;
    border: 1px solid #7F9DB9;
    background: #ECE9D8;
}
.acp-command-group {
    display: flex;
    gap: 0.4rem;
    align-items: center;
    flex-wrap: wrap;
}
.acp-command-bar .k-button {
    min-width: 84px;
}
.acp-save-error {
    background: #fdecea;
    color: #b00020;
    border: 1px solid #f5c6cb;
    padding: 0.6rem 0.9rem;
    border-radius: 4px;
    font-size: 0.85rem;
    margin-bottom: 0.75rem;
    white-space: pre-wrap;
}
.acp-card-note {
    font-weight: 400;
    color: #888;
    text-transform: none;
    letter-spacing: 0;
    margin-left: 0.4rem;
    font-size: 0.7rem;
}
/* Give edit-mode inputs a bit of breathing room so the grid stays readable */
.acp-demo-card .acp-field .k-textbox,
.acp-demo-card .acp-field .k-dropdownlist,
.acp-demo-card .acp-field .k-datepicker {
    font-size: 0.9rem;
}

/* --- Inline link-style TelerikButtons (SSN toggle, "sign in again" inline) --- */
.acp-inline-btn.k-button {
    padding: 0 0.3rem;
    min-width: 0;
    min-height: 0;
    margin-left: 0.4rem;
    font-size: 0.8rem;
    line-height: 1;
    vertical-align: baseline;
    color: #0066cc;
}
.acp-inline-btn.k-button:hover {
    background: transparent;
    color: #004999;
    text-decoration: underline;
}
.acp-ssn-value {
    display: flex;
    align-items: baseline;
    gap: 0.15rem;
}
/* Facility error button lives inside the AppBar — keep it small and red */
.acp-facility-error.k-button {
    color: #b00020;
    padding: 0 0.4rem;
    font-size: 0.85rem;
}
.acp-facility-error.k-button:hover {
    background: transparent;
    color: #7a0016;
    text-decoration: underline;
}

/* --- Resident grid host + density (Task 6 restore) --- */
.acp-list-count {
    font-size: 0.78rem;
    color: #777;
    text-align: right;
    padding-top: 0.15rem;
    min-height: 1em;
}
.acp-error-inline {
    color: #b00020;
}
.acp-error-inline a {
    color: #b00020;
    text-decoration: underline;
}
/* Flex parent that bounds the grid so it scrolls internally */
.acp-resident-grid-host {
    flex: 1 1 auto;
    min-height: 0;
    display: flex;
    flex-direction: column;
    overflow: hidden;
}
/* Force the grid to fill the flex host — Telerik Height="100%" occasionally computes to 0
   inside a nested flex chain, so pin height explicitly here too. */
.acp-resident-grid-host > .k-grid,
.acp-resident-grid.k-grid {
    flex: 1 1 auto;
    height: auto !important;
    min-height: 0;
}
/* Desktop-grid density on the resident list */
.acp-resident-grid.k-grid {
    border: none;
    font-size: 0.88rem;
}
.acp-resident-grid .k-grid-header {
    background: #f5f7fa;
    border-bottom: 1px solid #dee2e6;
}
.acp-resident-grid .k-grid-header .k-header {
    padding: 0.35rem 0.7rem;
    font-weight: 600;
    color: #555;
    font-size: 0.82rem;
    letter-spacing: 0;
    border-color: #e5e7eb;
    background: transparent;
}
.acp-resident-grid .k-grid-content td.k-table-td,
.acp-resident-grid .k-grid-content td {
    padding: 0.25rem 0.7rem;
    border-color: #f2f2f2;
    color: #333;
}
.acp-resident-grid .k-grid-content .k-table-row {
    background: #ffffff;
}
.acp-resident-grid .k-grid-content .k-table-row:hover {
    background: #f5f9ff;
}
.acp-resident-grid .k-grid-content .k-table-row.k-selected,
.acp-resident-grid .k-grid-content .k-table-row.k-selected:hover,
.acp-resident-grid .k-grid-content .k-table-row.k-selected > td,
.acp-resident-grid .k-grid-content .k-table-row.k-selected:hover > td {
    background: #e3f0ff;
    color: #0066cc;
    font-weight: 600;
}
.acp-resident-grid .k-grid-content .k-table-row.k-selected > td:first-child {
    box-shadow: inset 3px 0 0 0 #0066cc;
}
.acp-grid-name {
    color: inherit;
}
.acp-grid-num {
    color: #666;
    font-variant-numeric: tabular-nums;
    font-size: 0.82rem;
}
.acp-resident-grid .k-grid-content .k-table-row.k-selected .acp-grid-num {
    color: #0066cc;
}

/* --- Insurance page --- */
.acp-insurance-tabs.k-tabstrip {
    height: 100%;
}
.acp-insurance-tab {
    padding: 0.5rem 0;
}
.acp-tab-toolbar {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin: 0.25rem 0 1rem 0;
    padding-bottom: 0.5rem;
    border-bottom: 2px solid #eee;
}
.acp-tab-toolbar h3 {
    margin: 0;
    color: #333;
    font-size: 1.1rem;
    font-weight: 600;
}
.acp-empty-block {
    padding: 2rem 1rem;
    text-align: center;
    color: #999;
    font-style: italic;
    background: #fafafa;
    border: 1px dashed #dee2e6;
    border-radius: 4px;
}
.acp-neorate-warn {
    background: #fff8e1;
    border: 1px solid #ffe082;
    border-left: 4px solid #ffb300;
    padding: 0.6rem 0.9rem;
    border-radius: 4px;
    font-size: 0.85rem;
    color: #6d4c00;
    margin-bottom: 0.9rem;
}
/* One-shot toast variant of the NeoRateWarn caution — shown once on
   Rates-tab switch, dismissable inline (legacy .frm:3486 shape). Sits inside
   the AcpCard body so it flows above the grid, not as a permanent page-level
   band like the old .acp-neorate-warn banner. */
.acp-neorate-toast {
    display: flex; align-items: center; gap: 10px;
    padding: 8px 14px;
    background: var(--acp-warn-soft, #fff8e1);
    color: var(--acp-warn, #6d4c00);
    border-left: 3px solid var(--acp-warn, #ffb300);
    border-radius: var(--acp-radius);
    font-size: 13px;
    margin-bottom: 12px;
}
.acp-neorate-toast > strong { margin-right: 4px; }
.acp-neorate-toast .k-button { margin-left: auto; }
.acp-insurance-grid.k-grid {
    border: 1px solid #dee2e6;
    font-size: 0.85rem;
}
.acp-insurance-grid .k-grid-header {
    background: #f5f7fa;
}
.acp-insurance-grid .k-grid-header .k-header {
    padding: 0.4rem 0.6rem;
    font-size: 0.85rem;
    font-weight: 600;
    color: #555;
    letter-spacing: 0;
    background: transparent;
}
.acp-insurance-grid .k-grid-content td {
    padding: 0.3rem 0.6rem;
}
.acp-coverage-badge {
    display: inline-block;
    padding: 0.15rem 0.55rem;
    border-radius: 10px;
    font-size: 0.7rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.04em;
    line-height: 1.4;
}
.acp-coverage-primary {
    background: #e3f0ff;
    color: #0066cc;
    border: 1px solid #b3d4ff;
}
.acp-coverage-secondary {
    background: #f0e8ff;
    color: #6a1b9a;
    border: 1px solid #d1b3ff;
}
.acp-coverage-none {
    background: #f5f5f5;
    color: #888;
    border: 1px solid #dee2e6;
}

/* Error block shown in the list-count area — replaces the misleading generic "sign in again"
   with the actual error message (truncated to fit; full text on hover). */
.acp-error-block {
    display: flex;
    flex-direction: column;
    align-items: flex-end;
    gap: 0.15rem;
    padding-top: 0.15rem;
}
.acp-error-msg {
    color: #b00020;
    font-size: 0.78rem;
    text-align: right;
    line-height: 1.25;
    max-width: 100%;
    word-break: break-word;
}

/* --- Insurance dialogs (add/edit policy, add/edit rate, calculator) --- */
.acp-ins-dialog {
    max-height: 90vh;
    max-width: 95vw;
}
.acp-ins-dialog .k-window-content {
    padding: 1rem 1.25rem;
    max-height: calc(90vh - 6.5rem);
    overflow-y: auto;
}
.acp-dialog-body {
    display: flex;
    flex-direction: column;
    gap: 0.75rem;
    padding: 0.25rem 0 1rem 0;
}
.acp-dialog-row {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 1rem;
    align-items: end;
}
.acp-dialog-row-3 {
    grid-template-columns: 1fr 1fr 1fr;
}
.acp-dialog-field {
    display: flex;
    flex-direction: column;
    min-width: 0;
}
.acp-dialog-full {
    grid-column: 1 / -1;
}
/* Daily Census page — stacked layout matching legacy frmResidentCensus:
   Title / header-row / tabs / master-grid / command-bar, top-to-bottom. */
.acp-census-page {
    display: flex;
    flex-direction: column;
    gap: 0.6rem;
    padding: 0.75rem 1rem 0.5rem 1rem;
    background: #ffffff;
    min-height: calc(100vh - 60px);
}
.acp-census-title { padding: 0.1rem 0 0.15rem 0; }
.acp-census-title h1 {
    margin: 0;
    font-size: 1.15rem;
    color: #333;
    font-weight: 600;
    letter-spacing: 0.01em;
}
.acp-census-header-row {
    display: flex;
    gap: 1rem;
    align-items: end;
    padding: 0.4rem 0.6rem;
    background: #f7f9fb;
    border: 1px solid #eaeef2;
    border-radius: 6px;
}
.acp-census-header-spacer { flex: 1 1 auto; }
.acp-census-mode-flag {
    color: #b26a00;
    font-size: 0.78rem;
    font-weight: 600;
    padding: 0.15rem 0.5rem;
    background: #fff4e0;
    border: 1px solid #f0d9a8;
    border-radius: 4px;
}
.acp-census-field {
    display: flex;
    flex-direction: column;
    min-width: 0;
}
.acp-census-field > label {
    color: #555;
    font-size: 0.78rem;
    margin-bottom: 0.2rem;
    font-weight: 500;
}
.acp-census-tabs { min-height: 320px; }
.acp-census-tab-body {
    border: 1px solid #eaeef2;
    border-top: none;
    background: #ffffff;
    min-height: 280px;
}
.acp-census-master {
    border: 1px solid #eaeef2;
    border-radius: 6px;
    background: #ffffff;
    padding: 0.4rem 0.6rem 0.5rem 0.6rem;
}
.acp-census-master-head {
    display: flex;
    gap: 1rem;
    align-items: end;
    margin-bottom: 0.4rem;
}
.acp-census-master-count {
    margin-left: auto;
    color: #888;
    font-size: 0.78rem;
}
.acp-census-command-bar {
    display: flex;
    gap: 0.5rem;
    justify-content: center;
    padding: 0.55rem 0.6rem;
    background: #f4f7fa;
    border: 1px solid #eaeef2;
    border-radius: 6px;
}
.acp-census-msg { margin: 0.25rem 0; }

/* Daily Census — Entries tab body. Two side-by-side fieldsets: Resident Census
   (Beginning + Admissions | Discharges + Total Admitted/Discharged + Ending) and
   Acuity Total. Column widths tuned so the tab body fits without horizontal
   scrolling at 1280px, matching legacy frmResidentCensus visual density. */
.acp-census-entries-tab {
    display: grid;
    grid-template-columns: minmax(0, 1.7fr) minmax(0, 1fr);
    gap: 0.8rem;
    padding: 0.6rem 0.8rem;
    align-items: start;
}
.acp-census-fieldset {
    border: 1px solid #d5dde5;
    border-radius: 4px;
    padding: 0.35rem 0.85rem 0.7rem 0.85rem;
    background: #ffffff;
    min-width: 0;
}
.acp-census-fieldset > legend {
    padding: 0 0.4rem;
    color: #555;
    font-size: 0.78rem;
    font-weight: 600;
    font-style: italic;
}
.acp-census-two-cols {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 1.2rem;
    margin-top: 0.4rem;
}

/* Each admissions / discharges / acuity column packs its label+input pairs into a
   two-column grid. `max-content` on the label column makes every label share the
   widest label's width so inputs line up vertically down the column. The row
   itself uses display:contents so its label and input become direct grid
   children of .acp-census-col. */
.acp-census-col {
    display: grid;
    grid-template-columns: max-content 80px;
    justify-content: end;      /* pack rows to the right edge of the column */
    align-items: center;
    row-gap: 0.32rem;
    column-gap: 0.5rem;
    min-width: 0;
}
.acp-census-input-row { display: contents; }
.acp-census-input-row > label {
    color: #555;
    font-size: 0.8rem;
    text-align: right;
    white-space: nowrap;
}
.acp-census-input-row--computed > label {
    font-weight: 600;
    color: #444;
}
.acp-census-col-header {
    grid-column: 1 / -1;
    font-size: 0.82rem;
    font-weight: 600;
    color: #333;
    margin: 0.2rem 0 0.35rem 0;
}

/* Acuity fieldset uses a single .acp-census-col wrapper inside it (see markup)
   so the 7 acuity factor rows share the same label-alignment grid. */

.acp-census-computed {
    min-width: 76px;
    padding: 0.2rem 0.45rem;
    text-align: right;
    font-variant-numeric: tabular-nums;
    color: #222;
    background: #f2f6fa;
    border: 1px solid #dde3ea;
    border-radius: 3px;
    font-size: 0.88rem;
    font-weight: 500;
}

/* Beginning-total row and the three bottom "summary" rows keep the same
   grid alignment so the value slot stays under the input column. */
.acp-census-beg-row,
.acp-census-ending-row,
.acp-census-actualnum-row,
.acp-census-total-hours-row {
    display: grid;
    grid-template-columns: max-content 80px;
    justify-content: end;
    align-items: center;
    column-gap: 0.5rem;
    margin: 0.35rem 0 0.4rem 0;
}
.acp-census-beg-row > label,
.acp-census-ending-row > label,
.acp-census-actualnum-row > label,
.acp-census-total-hours-row > label {
    font-weight: 600;
    color: #333;
    font-size: 0.85rem;
    text-align: right;
    white-space: nowrap;
}
.acp-census-ending-row,
.acp-census-total-hours-row {
    margin-top: 0.65rem;
    padding-top: 0.5rem;
    border-top: 1px solid #eaeef2;
}
.acp-census-actualnum-row {
    padding-bottom: 0.4rem;
    border-bottom: 1px solid #eaeef2;
    margin-bottom: 0.55rem;
}

/* Daily Census — Movement / Absences grid tabs. Simple HTML table (not TelerikGrid)
   because the cells are directly editable per row and every row is a form. Legacy
   MSFlexGrid semantics preserved: Insert / Delete buttons above the table, one row
   per movement/absence entry. */
.acp-census-grid-tab {
    padding: 0.5rem 0.8rem 0.6rem 0.8rem;
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
    min-height: 260px;
}
.acp-census-grid-toolbar {
    display: flex;
    gap: 0.5rem;
    align-items: center;
}
/* Legacy cmdInsert/cmdDelete + cmdInsert1/cmdDelete1 sit BELOW the grid
   (.frm:1047-1062, 1241-1331). This variant right-aligns the buttons so
   they land at bottom-right like the legacy positions. */
.acp-census-grid-toolbar--bottom {
    justify-content: flex-end;
}
.acp-census-grid-toolbar--bottom .acp-census-grid-count {
    margin-left: 0;
    margin-right: auto;
}
.acp-census-grid-count {
    margin-left: auto;
    color: #888;
    font-size: 0.78rem;
}
.acp-census-grid-scroll {
    overflow-x: auto;
    border: 1px solid #d5dde5;
    border-radius: 4px;
    background: #ffffff;
}
.acp-census-grid {
    width: 100%;
    border-collapse: separate;
    border-spacing: 0;
    font-size: 0.82rem;
}
.acp-census-grid thead th {
    text-align: left;
    padding: 0.4rem 0.5rem;
    background: #f4f7fa;
    border-bottom: 1px solid #d5dde5;
    color: #444;
    font-weight: 600;
    white-space: nowrap;
    position: sticky;
    top: 0;
    z-index: 1;
}
.acp-census-grid tbody td {
    padding: 0.25rem 0.4rem;
    border-bottom: 1px solid #eef2f6;
    vertical-align: middle;
}
.acp-census-grid tbody tr:last-child td { border-bottom: none; }
.acp-census-grid tbody tr:hover td { background: #fafbfd; }
.acp-census-grid-empty-row td {
    padding: 1.5rem 1rem;
    text-align: center;
    color: #999;
    font-style: italic;
}
.acp-census-grid-actions {
    text-align: center;
    padding: 0.15rem 0.25rem;
}

/* Daily Census — Authorized Absences tab.
   Legacy layout (.frm:720/5940 = grid on left, furlough block on right).
   The split uses a 2-col grid so the grid gets the wider left half and the
   furlough block sits beside it, matching frmResidentCensus visually. Wraps
   on narrow browsers via minmax(0, ...). */
.acp-census-absences-split {
    display: grid;
    grid-template-columns: minmax(0, 3fr) minmax(0, 1fr);
    gap: 1rem;
    align-items: start;
}
.acp-census-absences-grid-col {
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
    min-width: 0;
}
.acp-census-furlough {
    border: 1px solid #d5dde5;
    border-radius: 4px;
    padding: 0.4rem 0.8rem 0.55rem 0.8rem;
    background: #ffffff;
}
.acp-census-furlough-header {
    font-size: 0.82rem;
    font-weight: 600;
    color: #333;
    margin-bottom: 0.4rem;
}
.acp-census-furlough-row {
    display: flex;
    flex-direction: column;
    gap: 0.4rem;
    align-items: flex-start;
}
.acp-census-furlough-cell {
    display: flex;
    align-items: center;
    gap: 0.5rem;
}
.acp-census-furlough-cell > label {
    color: #555;
    font-size: 0.82rem;
    font-weight: 500;
    min-width: 34px;
    text-align: right;
}

/* Shift-percentage modal (mirrors legacy frmResidentCensusShift.frm). Unit combo
   on top, 3x3 grid of RN/LPN/HST × Shift 1/2/3, then Save/Cancel. */
.acp-shift-dialog-body {
    display: flex;
    flex-direction: column;
    gap: 0.9rem;
    padding: 0.25rem 0 0.5rem 0;
}
.acp-shift-dialog-unit-row {
    display: flex;
    align-items: center;
    gap: 0.6rem;
}
.acp-shift-dialog-unit-row > label {
    color: #444;
    font-weight: 600;
    font-size: 0.9rem;
}
.acp-shift-grid {
    display: grid;
    grid-template-columns: max-content 90px 90px 90px;
    gap: 0.5rem;
    align-items: center;
    justify-content: center;
    padding: 0.35rem 0.4rem;
    background: #f7f9fb;
    border: 1px solid #eaeef2;
    border-radius: 6px;
}
.acp-shift-col-header {
    text-align: center;
    font-size: 0.85rem;
    font-weight: 600;
    color: #333;
}
.acp-shift-row-label {
    text-align: right;
    padding-right: 0.4rem;
    font-weight: 600;
    color: #444;
    font-size: 0.9rem;
}

/* Daily Census — Staffing tab.
   Two summary blocks (REQUIRED / ACTUAL) side by side, then TOTAL HOURS
   DOCUMENTED header, then the 3-shift × 4-col actuals table. */
.acp-census-staffing-tab {
    padding: 0.6rem 0.8rem;
    display: flex;
    flex-direction: column;
    gap: 0.7rem;
}
/* Legacy .frm:1413-1430, 1472-1489, 1544-1561 — three summary headers share
   Top=1140 and appear side-by-side at Left=570, 2730, 4875. Ported as a 3-col
   grid; the third column holds the TOTAL HOURS DOCUMENTED table so it sits
   beside REQUIRED and ACTUAL like legacy. Strict fixed 3-across per legacy
   (no responsive stacking); the tab wrapper scrolls horizontally on narrow
   viewports rather than reflowing. */
.acp-staffing-summaries {
    display: grid;
    grid-template-columns: minmax(230px, 1fr) minmax(230px, 1fr) minmax(420px, 2fr);
    gap: 1rem;
    align-items: start;
}
.acp-staffing-summary--hours {
    padding: 0.45rem 0.5rem 0.6rem 0.5rem;
}
.acp-staffing-summary--hours .acp-staffing-grid { width: 100%; }
.acp-census-staffing-tab {
    overflow-x: auto;
}
.acp-staffing-summary {
    border: 1px solid #d5dde5;
    border-radius: 4px;
    padding: 0.45rem 0.85rem 0.6rem 0.85rem;
    background: #f9fbfd;
}
.acp-staffing-summary-title {
    font-size: 0.82rem;
    font-weight: 700;
    color: #333;
    margin-bottom: 0.4rem;
    letter-spacing: 0.02em;
}
.acp-staffing-summary-row {
    display: grid;
    grid-template-columns: max-content 90px;
    justify-content: end;
    align-items: center;
    column-gap: 0.5rem;
    margin-bottom: 0.28rem;
}
.acp-staffing-summary-row > label {
    color: #444;
    font-size: 0.85rem;
    font-weight: 500;
    text-align: right;
    white-space: nowrap;
}
.acp-census-computed--total {
    background: #eaf0f6;
    font-weight: 700;
    color: #1e3a5f;
}

/* Staffing shift picker — legacy frShift option group + giant red lblShift
   (frmResidentCensus.frm:894-923, :1332-1349). Only visible when
   booResCensusByShift=True (DC-B4 + DC-B5). */
.acp-staffing-shift-panel {
    display: flex;
    align-items: center;
    gap: 1.5rem;
    margin-top: 1rem;
    padding: 0.5rem 0.25rem;
}
.acp-staffing-shift-frame {
    border: 1px solid #b5c5d6;
    border-radius: 4px;
    padding: 0.5rem 0.9rem 0.7rem;
    background: #ffffff;
    min-width: 170px;
}
.acp-staffing-shift-frame > legend {
    padding: 0 0.4rem;
    font-size: 0.82rem;
    font-weight: 600;
    color: #7f0000;   /* legacy ForeColor &H00800000 (dark red) */
}
.acp-staffing-shift-radio {
    display: flex;
    align-items: center;
    gap: 0.4rem;
    font-size: 0.85rem;
    color: #333;
    margin: 0.2rem 0;
    cursor: pointer;
}
.acp-staffing-shift-radio input { cursor: pointer; }
.acp-staffing-shift-big {
    font-family: Arial, sans-serif;
    font-weight: 700;
    font-size: 26px;         /* legacy Font.Size = 26.25 */
    color: #ff0000;          /* legacy ForeColor &H000000FF (red) */
    letter-spacing: 0.03em;
    line-height: 1;
}
.acp-staffing-hours-header {
    font-size: 0.85rem;
    font-weight: 700;
    color: #333;
    margin: 0.4rem 0 0.15rem 0;
    letter-spacing: 0.02em;
}
.acp-staffing-grid td {
    padding: 0.3rem 0.4rem;
}
.acp-staffing-shift-label {
    font-weight: 600;
    color: #555;
    text-align: center;
    background: #f4f7fa;
}
.acp-staffing-shift-flag {
    align-self: flex-end;
    padding: 0.25rem 0.7rem;
    background: #ffe4e4;
    border: 1px solid #f4c0c0;
    border-radius: 4px;
    color: #b02020;
    font-size: 0.82rem;
    font-weight: 600;
    letter-spacing: 0.02em;
}

/* Insurance page — vertical rhythm between the hero and the tab strip. */
.acp-ins-tabstrip-wrap {
    margin-top: var(--acp-space-5, 1rem);
}
.acp-ins-detail-msg {
    margin: 0 0 var(--acp-space-3, 0.5rem) 0;
}

/* Insurance dialog — legacy "City, State, Zip" row: one label, three inputs inline.
   City stretches; State and ZIP hold their fixed pixel widths (Telerik's wrapper span
   would otherwise fill its flex slot and clip the value). */
.acp-ins-csz {
    display: flex;
    gap: 0.4rem;
    align-items: center;
    min-width: 0;
}
.acp-ins-csz > :first-child {
    flex: 1 1 auto;
    min-width: 0;
}
.acp-ins-csz > :not(:first-child) {
    flex: 0 0 auto;
}
.acp-dialog-field > label {
    color: #555;
    font-size: 0.82rem;
    letter-spacing: 0;
    margin-bottom: 0.3rem;
    font-weight: 500;
}
.acp-dialog-hint {
    color: #999;
    font-size: 0.72rem;
    margin-top: 0.2rem;
    font-style: italic;
}
.acp-dialog-checkboxes {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    padding-top: 0.35rem;
}
.acp-dialog-checkboxes label {
    font-size: 0.85rem;
    margin-right: 0.75rem;
    cursor: pointer;
    color: #333;
}
.acp-dialog-actions {
    display: flex;
    justify-content: flex-end;
    gap: 0.5rem;
    padding-top: 0.75rem;
    border-top: 1px solid #eee;
    margin-top: 0.5rem;
}
.acp-rate-with-calc {
    display: flex;
    gap: 0.4rem;
    align-items: stretch;
}
.acp-rate-with-calc > .k-numerictextbox {
    flex: 1;
}
.acp-info-banner {
    background: #e3f2fd;
    border: 1px solid #90caf9;
    border-left: 4px solid #1976d2;
    padding: 0.6rem 0.9rem;
    border-radius: 4px;
    font-size: 0.85rem;
    color: #0d47a1;
}
/* Row action buttons (Edit/Delete) inside grid cells */
.acp-row-btn.k-button {
    padding: 0 0.4rem;
    min-width: 0;
    min-height: 0;
    font-size: 0.78rem;
    color: #0066cc;
}
.acp-row-btn.k-button:hover {
    background: transparent;
    color: #004999;
    text-decoration: underline;
}
.acp-row-btn-danger.k-button {
    color: #b00020;
    margin-left: 0.4rem;
}
.acp-row-btn-danger.k-button:hover {
    color: #7a0016;
}

/* --- Calculator dialog --- */
.acp-calc-dialog .k-window-content {
    padding: 1rem 1.25rem;
}
.acp-calc-intro {
    margin: 0 0 0.75rem 0;
    color: #555;
    font-size: 0.85rem;
}
.acp-calc-header {
    display: flex;
    flex-wrap: wrap;
    gap: 1.25rem;
    align-items: flex-end;
    padding: 0.75rem 0.9rem;
    background: #f5f7fa;
    border: 1px solid #dee2e6;
    border-radius: 4px;
    margin-bottom: 1rem;
}
.acp-calc-readout {
    display: flex;
    flex-direction: column;
    gap: 0.15rem;
}
.acp-calc-readout label {
    color: #555;
    font-size: 0.82rem;
    letter-spacing: 0;
    font-weight: 500;
}
.acp-calc-readout > div {
    font-size: 0.9rem;
    font-weight: 600;
    color: #222;
    font-variant-numeric: tabular-nums;
    line-height: 1.4;
    min-height: 1.4em;
}
.acp-calc-percent {
    color: #333;
}
.acp-calc-net {
    color: #333;
    font-size: 1rem !important;
}
.acp-calc-rate {
    color: #0066cc;
    font-size: 1.1rem !important;
    font-weight: 700 !important;
}
.acp-calc-section {
    border: 1px solid #dee2e6;
    border-radius: 4px;
    margin-bottom: 1rem;
    overflow: hidden;
}
.acp-calc-section-head {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 0.4rem 0.9rem;
    border-bottom: 1px solid #dee2e6;
}
.acp-calc-section-title {
    font-size: 0.72rem;
    font-weight: 700;
    letterSpacing: 0.06em;
}
.acp-calc-section-total {
    font-size: 0.85rem;
    font-weight: 700;
    font-variant-numeric: tabular-nums;
}
.acp-calc-income .acp-calc-section-head {
    background: #edf6ee;
    border-left: 3px solid #2e7d32;
}
.acp-calc-income .acp-calc-section-title,
.acp-calc-income .acp-calc-section-total {
    color: #2e7d32;
}
.acp-calc-deduct .acp-calc-section-head {
    background: #fbf3e8;
    border-left: 3px solid #b45309;
}
.acp-calc-deduct .acp-calc-section-title,
.acp-calc-deduct .acp-calc-section-total {
    color: #b45309;
}
.acp-calc-dimmed {
    opacity: 0.55;
}
.acp-calc-dimmed .acp-calc-section-total {
    text-decoration: line-through;
}
.acp-calc-toggle {
    display: flex;
    align-items: center;
    gap: 0.4rem;
    padding: 0.35rem 0.9rem;
    border-bottom: 1px solid #f2f2f2;
    background: #fafafa;
}
.acp-calc-toggle label {
    font-size: 0.78rem;
    color: #666;
    cursor: pointer;
}
.acp-calc-table {
    width: 100%;
    border-collapse: collapse;
    font-size: 0.82rem;
}
.acp-calc-table th {
    padding: 0.4rem 0.6rem;
    text-align: left;
    background: transparent;
    font-size: 0.82rem;
    font-weight: 600;
    letter-spacing: 0;
    color: #555;
    border-bottom: 1px solid #eceff3;
}
.acp-calc-table td {
    padding: 0.3rem 0.6rem;
    border-bottom: 1px solid #eceff3;
    vertical-align: middle;
}
.acp-calc-table tr:last-child td {
    border-bottom: 0;
}
.acp-calc-col-desc {
    width: 38%;
}
.acp-calc-col-amount {
    width: 130px;
    text-align: right;
}
.acp-calc-col-amount input {
    text-align: right;
}
.acp-calc-empty {
    padding: 1rem 0.9rem;
    color: #999;
    font-size: 0.85rem;
    font-style: italic;
}

/* --- Insurance page: React-parity add/report buttons and row icons --- */
.acp-tab-toolbar .acp-tool-btns {
    display: flex;
    align-items: center;
    gap: 0.5rem;
}
.acp-add-btn.k-button-solid-primary {
    /* Solid blue "+ Add insurance" / "+ Add rate" */
    background: #1976d2;
    border-color: #1976d2;
    color: #fff;
    font-weight: 500;
    padding: 0.4rem 0.9rem;
}
.acp-add-btn.k-button-solid-primary:hover {
    background: #1565c0;
    border-color: #1565c0;
}
.acp-report-btn {
    /* Disabled outline "Report" button next to Add rate */
    font-weight: 500;
}
.acp-insurance-grid .k-grid-content .acp-row-icon-btn {
    padding: 0.15rem 0.35rem;
    min-width: 0;
    color: #666;
    background: transparent;
    border: none;
}
.acp-insurance-grid .k-grid-content .acp-row-icon-btn:hover {
    color: #1976d2;
    background: #f0f7ff;
}
.acp-insurance-grid .k-grid-content .acp-row-icon-btn.acp-row-icon-danger:hover {
    color: #c62828;
    background: #ffebee;
}
.acp-insurance-grid .acp-actions-col {
    text-align: right;
    white-space: nowrap;
}
.acp-role-cell {
    color: #333;
}
.acp-ssn-cell {
    font-variant-numeric: tabular-nums;
    color: #555;
    font-size: 0.85rem;
}
.acp-num-cell {
    text-align: right;
    font-variant-numeric: tabular-nums;
}

/* Telerik pager — React-parity compact footer, all pieces clustered
   together on the right edge:
       ................. Rows per page: 25 ▼   1 – 25 of 34   <   >

   Telerik's own stylesheet puts `margin-left: auto` on .k-pager-info (and
   sometimes on other siblings) which visually splits the pager into
   left- and right-hand groups. To keep everything glued together on the
   right we:
     1. Force justify-content: flex-end on the .k-pager flex row.
     2. Wipe margins on ALL direct children — no more auto-margin push.
     3. Use the parent `gap` for spacing between pieces.
     4. Set explicit `order` so the visual order is stable regardless of DOM.
     5. Hide numeric page buttons + first/last skip buttons + Telerik's
        trailing "items per page" text. */
.acp-insurance-grid .k-grid-pager,
.acp-insurance-grid .k-pager {
    background: #fafafa;
    border-top: 1px solid #eee;
    padding: 0.25rem 0.6rem;
    font-size: 0.82rem;
    color: #666;
    display: flex !important;
    flex-direction: row !important;
    flex-wrap: nowrap !important;
    justify-content: flex-end !important;
    align-items: center !important;
    gap: 0.75rem !important;
}
/* Belt-and-suspenders: an invisible flex spacer at the very front (order 0)
   that eats all leftover space, physically pushing every real pager item
   over to the right regardless of what Telerik's own margins try to do. */
.acp-insurance-grid .k-pager::before {
    content: "";
    flex: 1 1 auto !important;
    order: 0 !important;
    margin: 0 !important;
    padding: 0 !important;
    background: transparent;
    display: block;
    min-width: 0;
}
/* Wipe every auto-margin Telerik might set on direct children — this is
   what was splitting the pager into left and right halves. Cover both
   physical AND logical margin properties (Telerik's Kendo theme uses
   `margin-inline-start: auto` in some builds, which the `margin` shorthand
   does not reset on all browsers). Also pin flex-grow:0 so no child can
   spring to fill remaining space. */
.acp-insurance-grid .k-pager > *,
.acp-insurance-grid .k-pager > *::before,
.acp-insurance-grid .k-pager > *::after {
    margin: 0 !important;
    margin-inline: 0 !important;
    margin-inline-start: 0 !important;
    margin-inline-end: 0 !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
    flex-grow: 0 !important;
    flex-shrink: 0 !important;
}
/* Hide numeric page-button list. */
.acp-insurance-grid .k-pager .k-pager-numbers {
    display: none !important;
}
/* Hide first / last skip buttons — by aria title (locale-tolerant). */
.acp-insurance-grid .k-pager .k-pager-nav[title*="first" i],
.acp-insurance-grid .k-pager .k-pager-nav[title*="Last" i] {
    display: none !important;
}
/* Visual order left → right within the right cluster:
   sizes ▸ info ▸ (hidden numbers wrap) ▸ prev/next arrows. */
.acp-insurance-grid .k-pager .k-pager-sizes        { order: 1 !important; }
.acp-insurance-grid .k-pager .k-pager-info         { order: 2 !important; }
.acp-insurance-grid .k-pager .k-pager-numbers-wrap { order: 3 !important; }
.acp-insurance-grid .k-pager .k-pager-nav          { order: 4 !important; }
/* Page-size group layout with injected "Rows per page:" prefix. */
.acp-insurance-grid .k-pager .k-pager-sizes {
    display: inline-flex !important;
    align-items: center !important;
    gap: 0.35rem !important;
    color: #666;
}
.acp-insurance-grid .k-pager .k-pager-sizes::before {
    content: "Rows per page:";
    color: #666;
}
/* Kill Telerik's built-in trailing "items per page" text — hide any direct
   child of .k-pager-sizes that isn't the dropdown widget. Covers <span>,
   <label>, plain text nodes wrapped in .k-label, etc. */
.acp-insurance-grid .k-pager .k-pager-sizes > *:not(.k-dropdownlist):not(.k-picker):not(select) {
    display: none !important;
}

/* SSN field with inline Show/Hide toggle */
.acp-ssn-field-wrap {
    display: flex;
    align-items: center;
    gap: 0.4rem;
    min-width: 0;
}
.acp-ssn-field-wrap > :first-child {
    flex: 1 1 auto;
    min-width: 0;
}
.acp-ssn-toggle {
    flex: 0 0 auto;
    background: transparent;
    border: none;
    color: #1976d2;
    font-size: 0.8rem;
    cursor: pointer;
    padding: 0.15rem 0.35rem;
}
.acp-ssn-toggle:hover {
    text-decoration: underline;
}

/* Inline HMO/Prescription checkboxes without the section "Options" label */
.acp-inline-checks {
    display: flex;
    align-items: center;
    gap: 1.2rem;
    padding-top: 1.6rem; /* align with input row baseline */
}
.acp-inline-checks label {
    font-size: 0.88rem;
    color: #333;
    cursor: pointer;
    font-weight: 400;
}

/* ============================================================
   Billing Cycle page (/financial/billing/cycle) — shared with
   other "single-form" Billing screens (Cancel, Modify, Update,
   Print). Layout: full-width page with a titled card, two-column
   grid for the top settings, then full-width date panel + future
   billing panel + actions. Mirrors React's BillingCyclePage layout.
   ============================================================ */

.acp-page-wrap {
    padding: 1.25rem 1.5rem;
    height: 100%;
    overflow-y: auto;
}
.acp-page-title {
    font-size: 1.35rem;
    font-weight: 600;
    margin: 0 0 1rem 0;
    color: #333;
}

/* Coloured info banners above the form (lookups error, missing BDG/PRV, submit error, success).
   Long concatenated validation messages must wrap across lines rather than overflow the row —
   align-items shifts from center to flex-start so wrapped text stays left-aligned, and
   overflow-wrap:anywhere breaks even inside unbreakable tokens like 005010X222A1. */
.acp-alert {
    padding: 0.6rem 0.9rem;
    border-radius: 4px;
    margin-bottom: 0.9rem;
    font-size: 0.88rem;
    display: flex;
    align-items: flex-start;
    gap: 0.6rem;
    flex-wrap: wrap;
    white-space: pre-wrap;
    overflow-wrap: anywhere;
    word-break: break-word;
    line-height: 1.4;
}
.acp-alert > * { min-width: 0; white-space: pre-wrap; }
.acp-alert-error {
    background: #fdecea;
    border-left: 4px solid #c62828;
    color: #7f1d1d;
}
.acp-alert-warn {
    background: #fff8e1;
    border-left: 4px solid #ffb300;
    color: #6d4c00;
}
.acp-alert-success {
    background: #e8f5e9;
    border-left: 4px solid #2e7d32;
    color: #1b5e20;
}
.acp-alert .acp-inline-btn {
    margin-left: auto;
}

/* The main form card. */
.acp-form-card {
    background: #fff;
    border: 1px solid #dee2e6;
    border-radius: 4px;
    padding: 1.25rem 1.5rem;
}
/* Legacy Billing Cycle screen (frmBilling.frm) stacks its frames vertically in
   a single column — Billing Cycle, Bill Type, Financial Class, Date. The prior
   2-column grid was a modernisation drift that split them into a 2x2 board. */
.acp-form-grid {
    display: grid;
    grid-template-columns: 1fr;
    gap: 0.8rem;
}
@media (max-width: 900px) {
    .acp-form-grid { grid-template-columns: 1fr; }
}
.acp-form-field {
    display: flex;
    flex-direction: column;
    min-width: 0;
}
.acp-form-field > label {
    color: #555;
    font-size: 0.82rem;
    font-weight: 500;
    margin-bottom: 0.4rem;
}
.acp-form-divider {
    height: 1px;
    background: #eceff3;
    margin: 1.25rem 0;
}
.acp-form-actions {
    display: flex;
    gap: 0.75rem;
    align-items: center;
}

/* Financial-class searchable listbox (legacy Frame4 look). */
.acp-list-box {
    margin-top: 0.4rem;
    border: 1px solid #dee2e6;
    border-radius: 4px;
    max-height: 240px;
    overflow-y: auto;
    background: #fff;
}
.acp-list-item {
    padding: 0.4rem 0.7rem;
    border-bottom: 1px solid #f2f2f2;
    cursor: pointer;
    transition: background 0.1s;
}
.acp-list-item:last-child { border-bottom: 0; }
.acp-list-item:hover { background: #f5f9ff; }
.acp-list-item-selected,
.acp-list-item-selected:hover {
    background: #e3f0ff;
    color: #0066cc;
}
.acp-list-item-primary {
    font-size: 0.88rem;
    font-weight: 500;
}
.acp-list-item-secondary {
    font-size: 0.78rem;
    color: #888;
    margin-top: 0.15rem;
}
.acp-list-empty {
    padding: 1rem 0.9rem;
    text-align: center;
    color: #999;
    font-size: 0.85rem;
    font-style: italic;
}

/* Field-level validation errors under an input. */
.acp-field-error {
    color: #c62828;
    font-size: 0.78rem;
    margin-top: 0.3rem;
}

/* Date row layout — Begin / End / Aging / Posting side by side. */
/* Legacy §Billing Cycle Date is a 2x2 grid — Begin | End on row 1, Aging | Posting on row 2. */
.acp-billing-date-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 0.6rem 2rem;
}

.acp-date-row {
    display: flex;
    flex-wrap: wrap;
    gap: 1rem 1.5rem;
}
.acp-date-cell {
    display: flex;
    flex-direction: column;
}
.acp-date-cell > label {
    color: #555;
    font-size: 0.78rem;
    font-weight: 500;
    margin-bottom: 0.25rem;
}

/* Inline checkbox+label row (Ancillaries, Future Billing). */
.acp-checkbox-row {
    display: flex;
    align-items: center;
    gap: 0.5rem;
}
.acp-checkbox-row label {
    font-size: 0.88rem;
    color: #333;
    cursor: pointer;
}

/* ============================================================
   BillingBatchGrid — shared picker component used by Hand Billing,
   Cancel Billing, Modify Batch, Billing Update. Same look as the
   Insurance grid, plus a "locked" row style for batches held by
   another user (legacy Right(!Status,1) = "*"). Selection stays
   allowed on locked rows; the action blocks (legacy MsgBox @370).
   ============================================================ */

.acp-batch-grid-wrap {
    display: flex;
    flex-direction: column;
    background: #fff;
    border: 1px solid #dee2e6;
    border-radius: 4px;
    overflow: hidden;
}
.acp-batch-grid-shell {
    /* Wrapper on the page giving the grid a bounded height so the pager stays visible. */
    height: 480px;
    display: flex;
    flex-direction: column;
}
.acp-batch-grid-shell > .acp-batch-grid-wrap {
    flex: 1 1 auto;
    min-height: 0;
}
.acp-batch-grid-header {
    display: flex;
    align-items: baseline;
    gap: 0.75rem;
    padding: 0.5rem 0.9rem;
    background: #f5f7fa;
    border-bottom: 1px solid #eceff3;
}
.acp-batch-grid-title {
    font-size: 0.9rem;
    font-weight: 600;
    color: #333;
}
.acp-batch-grid-count {
    font-size: 0.8rem;
    color: #888;
}
.acp-batch-grid-body {
    flex: 1 1 auto;
    min-height: 0;
    overflow: hidden;
}
.acp-batch-grid.k-grid {
    border: 0;
    height: 100%;
}
/* Locked row: muted text so the operator sees "held by someone else" without disabling selection. */
.acp-batch-grid .k-table-row.acp-batch-row-locked > td {
    color: #999;
    font-style: italic;
}

/* Small helper text next to a disabled primary button. */
.acp-help-inline {
    color: #b45309;
    font-size: 0.82rem;
    align-self: center;
}

/* Modify Batch line-editor toolbar — Select-All + Group toggle + right-side note. */
.acp-line-editor-toolbar {
    display: flex;
    align-items: center;
    gap: 1.25rem;
    padding: 0.4rem 0;
}

/* ============================================================
   Modify Batch — legacy frmBillingModify parity. The header row
   above the toolbar mirrors Label1 + lblName (.frm:273/1146);
   the capped-row background reproduces MarkCapped's RGB(248,253,219).
   ============================================================ */
.acp-modify-batch-header {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.3rem 0 0.2rem;
}
.acp-modify-batch-focused {
    display: flex;
    align-items: baseline;
    gap: 0.5rem;
}
.acp-modify-batch-akalabel {
    font-weight: 600;
    color: #333;
}
.acp-modify-batch-focusedname {
    color: #333;
}
.acp-modify-batch-grid .k-table-row.acp-modify-batch-capped-row > td {
    background: rgb(248, 253, 219);
}

/* ============================================================
   Hand Bill Line Editor — dense multi-panel form. Layout mirrors
   the legacy frmBillingHand form: left resident picker, right
   form area with date row, group boxes, charge grid, 4-column
   amount grid, existing-lines grid, actions.
   ============================================================ */

/* React parity: the editor fits the viewport with fixed-height inner grids that scroll on their
   own — the outer page never scrolls past the header + dates + group boxes. Matches
   HandBillLineEditor.tsx line 511: height:'100%' + flex column, and Grid children with minHeight:0. */
.acp-hand-editor {
    padding: 0.75rem 1rem;
    height: calc(100vh - 90px);   /* leave the app top bar */
    display: flex;
    flex-direction: column;
    min-height: 0;
}
.acp-hand-body {
    display: grid;
    grid-template-columns: 300px 1fr;
    gap: 0.9rem;
    flex: 1 1 auto;
    min-height: 0;
}
@media (max-width: 1100px) {
    .acp-hand-body {
        grid-template-columns: 1fr;
        overflow-y: auto;
    }
}
.acp-hand-picker {
    display: flex;
    flex-direction: column;
    border: 1px solid #dee2e6;
    border-radius: 4px;
    padding: 0.5rem;
    background: #fafafa;
    min-height: 0;      /* let the inner grid absorb the height */
    overflow: hidden;
}
.acp-hand-picker .acp-search-controls {
    padding-bottom: 0.5rem;
}
.acp-hand-picker .acp-resident-grid-host {
    flex: 1 1 auto;
    min-height: 0;
    overflow: hidden;
}
.acp-hand-form {
    display: flex;
    flex-direction: column;
    gap: 0.55rem;
    min-width: 0;
    min-height: 0;
    overflow-y: auto;   /* allow the form area to scroll if content exceeds viewport */
}
.acp-hand-batch-header {
    font-weight: 600;
    color: #333;
    padding: 0.25rem 0.5rem;
    font-size: 0.92rem;
    background: #f5f7fa;
    border: 1px solid #eceff3;
    border-radius: 4px;
    position: sticky;
    top: 0;
    z-index: 5;
}
.acp-hand-daterow {
    display: flex;
    flex-wrap: wrap;
    align-items: flex-end;
    gap: 0.75rem 1.25rem;
}
.acp-hand-addsub {
    margin-left: auto;
}
.acp-hand-inline {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 0.75rem;
}
.acp-hand-groupboxes {
    display: flex;
    flex-wrap: wrap;
    gap: 0.9rem;
}
.acp-groupbox {
    border: 1px solid #dee2e6;
    border-radius: 4px;
    padding: 0.2rem 0.75rem 0.55rem 0.75rem;
    margin: 0;
    min-width: 0;
}
.acp-groupbox > legend {
    padding: 0 0.35rem;
    font-size: 0.75rem;
    color: #666;
    font-weight: 500;
}
.acp-hand-charge-indicators {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    gap: 1rem;
    flex-wrap: wrap;
}
.acp-hand-admit-panel {
    border: 1px solid #dee2e6;
    border-radius: 4px;
    padding: 0.35rem 0.7rem;
    background: #fafafa;
    font-size: 0.78rem;
    color: #333;
    min-width: 220px;
}
.acp-hand-admit-panel > div { padding: 0.05rem 0; line-height: 1.35; }
.acp-hand-grid-shell {
    border: 1px solid #dee2e6;
    border-radius: 4px;
    background: #fff;
    display: flex;
    flex-direction: column;
    overflow: hidden;
}
.acp-hand-grid-shell > .k-grid {
    flex: 1 1 auto;
    min-height: 0;
    border: 0;
}
.acp-hand-amount-grid {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 155px));
    gap: 0.75rem 1rem;
    align-items: end;
}
@media (max-width: 900px) {
    .acp-hand-amount-grid { grid-template-columns: repeat(2, minmax(0, 155px)); }
}

/* =====================================================================
   ADT (frmADT) — React parity (frontend/src/pages/adt/*). Layout:
   right pane stacks header + tabs + details (flex-grow, scrolls) + a
   FIXED 40% transactions grid at the bottom. Chip primitives at the
   top are reused elsewhere.
   ===================================================================== */

/* --- Chip primitive (reusable). React uses MUI <Chip>. -------- */
.acp-chip {
    display: inline-flex;
    align-items: center;
    gap: 0.25rem;
    padding: 0.125rem 0.5rem;
    border-radius: 9999px;
    font-size: 0.72rem;
    font-weight: 600;
    line-height: 1;
    letter-spacing: 0.02em;
    background: #f1f5f9;
    color: #334155;
    border: 1px solid #e2e8f0;
    white-space: nowrap;
}
.acp-chip .k-svg-icon,
.acp-chip .k-icon { font-size: 0.85rem; width: 0.85rem; height: 0.85rem; }
.acp-chip-success   { background: #dcfce7; color: #166534; border-color: #bbf7d0; }
.acp-chip-warn      { background: #fef3c7; color: #92400e; border-color: #fde68a; }
.acp-chip-info      { background: #dbeafe; color: #1e40af; border-color: #bfdbfe; }
.acp-chip-primary   { background: #ede9fe; color: #5b21b6; border-color: #ddd6fe; }
.acp-chip-secondary { background: #f5f3ff; color: #6d28d9; border-color: #ddd6fe; }
/* React uses `variant="outlined"` on Veteran and Stay chips. */
.acp-chip-outline {
    background: transparent;
}

/* --- Right pane frame ------------------------------------------- */
.acp-adt-pane {
    display: flex;
    flex-direction: column;
    height: 100%;
    min-height: 0;
    background: #fff;
}
.acp-adt-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 0.4rem 1.25rem;
    background: #fff;
    border-bottom: 1px solid #e2e8f0;
}
.acp-adt-overline {
    font-size: 0.7rem;
    text-transform: uppercase;
    letter-spacing: 0.08em;
    color: #64748b;
    font-weight: 600;
}
.acp-adt-title {
    font-size: 1.25rem;
    font-weight: 700;
    color: #0f172a;
    margin-top: 0.1rem;
}
.acp-adt-actions {
    display: flex;
    gap: 0.4rem;
    align-items: center;
}
.acp-adt-actions .acp-add-btn { min-width: 84px; }

.acp-adt-tabs {
    border-bottom: 1px solid #e2e8f0;
    background: #fff;
}
.acp-adt-tabs .k-tabstrip-items { padding: 0 1.25rem; }

/* --- Body: details flexes (top), transactions fixed 40% (bottom) --- */
.acp-adt-body {
    flex: 1 1 auto;
    min-height: 0;
    display: flex;
    flex-direction: column;
    overflow: hidden;
}
.acp-adt-details-scroll {
    flex: 1 1 auto;
    min-height: 0;
    overflow: auto;
    padding: 0.4rem 1rem 0.6rem;
}
.acp-adt-empty {
    color: #64748b;
    padding: 2rem 0.5rem;
    text-align: center;
    font-style: italic;
}

/* --- Resident details panel (top card) -------------------------- */
.acp-adt-details-panel {
    display: flex;
    flex-direction: column;
    gap: 0.35rem;
    background: #fff;
    border: 1px solid #e2e8f0;
    border-radius: 8px;
    padding: 0.6rem 0.9rem 0.75rem;
    box-shadow: 0 1px 2px rgba(15,23,42,0.04);
}
.acp-adt-resident-header {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 0.5rem;
    padding-bottom: 0.75rem;
    border-bottom: 1px solid #e2e8f0;
}
.acp-adt-resident-name {
    font-size: 1.05rem;
    font-weight: 700;
    color: #0f172a;
    margin-right: 0.5rem;
}
.acp-adt-field-grid {
    display: grid;
    grid-template-columns: repeat(6, minmax(0, 1fr));
    gap: 0.6rem 1.25rem;
}
.acp-adt-field-grid label {
    display: block;
    font-size: 0.68rem;
    color: #64748b;
    letter-spacing: 0.02em;
    font-weight: 500;
    margin-bottom: 0.15rem;
}
.acp-adt-field-grid > div > div {
    font-size: 0.85rem;
    color: #0f172a;
    line-height: 1.2;
    font-weight: 500;
}
@media (max-width: 1400px) {
    .acp-adt-field-grid { grid-template-columns: repeat(4, minmax(0, 1fr)); }
}
@media (max-width: 900px) {
    .acp-adt-field-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

/* --- Inner tabs (General / Stay / Diagnosis / Financial) -------- */
.acp-adt-inner-tabs {
    margin-top: 0;
    border: 1px solid #e2e8f0;
    border-radius: 8px;
    overflow: hidden;
    background: #fff;
}
.acp-adt-inner-tabs .k-tabstrip-items { padding: 0 0.75rem; background: #fff; border-bottom: 1px solid #e2e8f0; }
.acp-adt-inner-body { padding: 0.75rem 1rem 0.85rem; }

/* ---- ADT status bar + header row + General tab — legacy field ORDER, Precinct design tokens.
       No hardcoded hex; every color/spacing/font token comes from acp-tokens.css so a palette
       swap is still a one-file change. --- */

/* Status bar — same content as the legacy Frame29 yellow ribbon but painted with the
   design system's surface + border tokens. Info order preserved: status code · name · MR# · mode. */
.acp-adt-status-bar {
    display: flex; align-items: center; gap: 12px;
    padding: 6px 14px;
    background: var(--acp-surface);
    border: 1px solid var(--acp-line);
    border-radius: var(--acp-radius);
    font-family: var(--acp-font-sans);
    font-size: 14px;
    color: var(--acp-ink);
    margin-bottom: 0;
}
.acp-adt-status-pill {
    padding: 3px 12px;
    background: var(--acp-primary-soft);
    color: var(--acp-primary);
    font-family: var(--acp-font-mono);
    font-size: 12px; font-weight: 700;
    letter-spacing: 0.04em; text-transform: uppercase;
    border-radius: var(--acp-radius-sm);
}
.acp-adt-status-name { font-weight: 700; font-size: 15px; letter-spacing: -0.005em; color: var(--acp-ink); }
.acp-adt-status-mr {
    font-family: var(--acp-font-mono); font-size: 13px;
    color: var(--acp-muted); font-weight: 600;
}
.acp-adt-status-mode {
    margin-left: auto;
    font-family: var(--acp-font-mono); font-size: 12px;
    color: var(--acp-muted); font-weight: 700;
    text-transform: uppercase; letter-spacing: 0.04em;
}

/* Header row — Stay # + Admit Date/Time + Benefit Fund. Uses the same field/value pattern
   as the rest of the design system. */
.acp-adt-header-row {
    display: flex; align-items: center; gap: 24px;
    padding: 10px 14px 14px;
    border-bottom: 1px solid var(--acp-line);
    background: var(--acp-card);
}
/* Admit variant only — Stay # / Admit Date/Time render inline (label · value on one line)
   and the row sits flush against the resident status bar above (no dead space). */
.acp-adt-header-row--admit {
    padding: 2px 12px 4px;
    margin-top: 0;
}
.acp-adt-header-row--admit .acp-adt-hf {
    flex-direction: row;
    align-items: baseline;
    gap: 8px;
}
.acp-adt-header-row--admit .acp-adt-hf > label { margin: 0; }
.acp-adt-header-row--admit .acp-adt-hf-value { margin: 0; }
/* Header field label + value — matches the .acp-field / .acp-readonly-box typography
   used by Residents and Veterans so all three pages share one rhythm. Label = 12px mono
   uppercase weight 600 · Value = 15px sans weight 600. */
.acp-adt-hf { display: flex; flex-direction: column; gap: 4px; }
.acp-adt-hf > label {
    font-family: var(--acp-font-mono);
    font-size: 12px; letter-spacing: 0.04em;
    color: var(--acp-muted); font-weight: 600;
    text-transform: uppercase;
    margin: 0 0 4px;
}
.acp-adt-hf-value {
    min-width: 120px;
    font-family: var(--acp-font-sans);
    font-size: 15px; font-weight: 500;
    color: var(--acp-ink);
    font-variant-numeric: tabular-nums;
    letter-spacing: -0.005em;
}
.acp-adt-benefit-fund {
    margin-left: auto;
    background: var(--acp-card);
    color: var(--acp-primary);
    border: 1px solid var(--acp-primary);
    padding: 7px 16px; border-radius: var(--acp-radius);
    font-family: var(--acp-font-sans);
    font-size: 13px; font-weight: 600;
    cursor: pointer;
    transition: background 0.12s ease;
}
.acp-adt-benefit-fund:hover:not(:disabled) { background: var(--acp-primary-soft); }
.acp-adt-benefit-fund:disabled { opacity: 0.5; cursor: not-allowed; }

/* Wider variant of the header row for outer tabs whose header carries several fields
   (Discharge / Bed Hold-Release / Type Change). Uses a 2-column CSS grid so field pairs
   like Date + Time align, single fields (Discharge #, Status, Trans Code, Narrative) span
   full width, and a side button (Next of Kin, etc.) can float to the right of the grid. */
.acp-adt-header-row--wide {
    display: flex;
    gap: var(--acp-space-5);
    align-items: flex-start;
    padding: 14px 16px 16px;
}
.acp-adt-header-grid-2 {
    flex: 1;
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
    gap: 12px 20px;
    align-items: end;
}
.acp-adt-hf-full { grid-column: 1 / -1; }
.acp-adt-hf-value-wide { min-height: 40px; }
.acp-adt-header-side-btn { align-self: flex-start; margin-left: 0 !important; }

/* General tab body — .acp-adt-inner-body-ds uses design-system padding rather than the
   legacy VB6-form-padding chrome. The grid uses the shared .acp-demo-columns--2 so it looks
   identical to Residents/Veterans two-column read views. */
.acp-adt-inner-body-ds {
    padding: var(--acp-space-5) var(--acp-space-6);
    background: var(--acp-card);
}
.acp-adt-inner-body-ds .acp-demo-columns--2 { padding: 0; }
/* Span-both-columns modifier for wide fields (Narrative, Special Instructions). */
.acp-adt-inner-body-ds .acp-field-full { grid-column: 1 / -1; }
.acp-adt-inner-body-ds .acp-adt-narrative,
.acp-adt-inner-body-ds .acp-adt-special-instructions {
    min-height: 48px !important;
    white-space: pre-wrap;
}
.acp-adt-flag-row { display: flex; gap: 8px; flex-wrap: wrap; padding-top: 2px; }

/* Diagnosis tab — 5-row grid with ICD code + description + primary/admit flags. */
.acp-adt-diag-grid { display: grid; gap: 8px; }
.acp-adt-diag-head,
.acp-adt-diag-row {
    display: grid;
    grid-template-columns: 30px 110px minmax(0, 1fr) 90px 90px;
    gap: 10px; align-items: center;
}
.acp-adt-diag-head {
    font-family: var(--acp-font-mono);
    font-size: 12px; letter-spacing: 0.04em;
    color: var(--acp-muted); font-weight: 600;
    text-transform: uppercase;
    padding: 0 4px 4px;
    border-bottom: 1px solid var(--acp-line);
}
.acp-adt-diag-index {
    font-family: var(--acp-font-mono); font-size: 13px;
    color: var(--acp-muted); font-weight: 600; text-align: center;
}
.acp-adt-diag-code, .acp-adt-diag-desc { font-variant-numeric: tabular-nums; }

/* Financial tab — side-by-side RB coverage blocks (FC #1 / FC #2). */
.acp-adt-rb-section {
    display: grid; grid-template-columns: 1fr 1fr; gap: 16px;
    margin-top: var(--acp-space-5);
    padding-top: var(--acp-space-4);
    border-top: 1px dashed var(--acp-line);
}
@media (max-width: 900px) { .acp-adt-rb-section { grid-template-columns: 1fr; } }
.acp-adt-rb-block {
    padding: 12px 14px;
    background: var(--acp-surface);
    border: 1px solid var(--acp-line);
    border-radius: var(--acp-radius);
}
.acp-adt-rb-title {
    margin: 0 0 10px;
    font-family: var(--acp-font-mono);
    font-size: 12px; letter-spacing: 0.04em; text-transform: uppercase;
    color: var(--acp-muted); font-weight: 700;
}

/* Scaffold banner — thin, subtle info strip above the read-only fields on tabs whose
   Add/Modify backend hasn't landed yet. Tokens only. */
.acp-adt-scaffold-note {
    padding: 10px 16px;
    margin-bottom: 14px;
    background: var(--acp-warn-soft);
    color: var(--acp-warn);
    border-left: 3px solid var(--acp-warn);
    border-radius: var(--acp-radius);
    font-size: 13.5px;
    font-family: var(--acp-font-sans);
    font-weight: 500;
}

/* Thinner diagnosis row for empty scaffolds (no primary/admit flag columns). */
.acp-adt-diag-row-thin {
    display: grid;
    grid-template-columns: 30px 110px minmax(0, 1fr);
    gap: 10px; align-items: center;
}

/* General tab — react uses two 6-col columns. */
.acp-adt-general-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 1.5rem;
}
@media (max-width: 900px) {
    .acp-adt-general-grid { grid-template-columns: 1fr; }
}
.acp-adt-yesno {
    display: flex;
    align-items: center;
    gap: 1rem;
    margin-bottom: 0.75rem;
    font-size: 0.85rem;
}
.acp-adt-yesno label {
    color: #64748b;
    font-size: 0.85rem;
    font-weight: 400;
    min-width: 160px;
}
.acp-adt-cap {
    display: block;
    font-size: 0.68rem;
    color: #64748b;
    letter-spacing: 0.02em;
    font-weight: 500;
    margin: 0 0 0.15rem 0;
}
.acp-adt-para {
    font-size: 0.85rem;
    color: #0f172a;
    margin: 0 0 0.75rem 0;
    white-space: pre-wrap;
    line-height: 1.35;
}
.acp-adt-mute { color: #64748b; font-style: italic; }
.acp-adt-stay-intro { margin-bottom: 0.5rem; color: #64748b; }
.acp-adt-divider {
    border: 0;
    border-top: 1px solid #e2e8f0;
    margin: 0 0 1rem 0;
}

/* --- Transactions grid panel — collapsed to ~220px so it reads as an auxiliary history
       section, not a co-equal panel with the tabs above. Was flex: 0 0 40% which pushed the
       tab content into a tiny viewport. Now the details area gets the majority of the space
       and the transactions live below as a compact "history" footer. Token-based colors. --- */
.acp-adt-trans-panel {
    flex: 0 0 auto;
    max-height: 240px;
    min-height: 120px;
    display: flex;
    flex-direction: column;
    background: var(--acp-card);
    border-top: 1px solid var(--acp-line);
    box-shadow: 0 -1px 2px rgba(15, 23, 42, 0.03);
    overflow: hidden;
    margin-top: var(--acp-space-4);
}
.acp-adt-trans-header {
    display: flex;
    align-items: baseline;
    gap: 10px;
    padding: 8px 16px;
    background: var(--acp-surface);
    border-bottom: 1px solid var(--acp-line);
}
.acp-adt-trans-title {
    font-family: var(--acp-font-mono);
    font-weight: 700;
    color: var(--acp-muted);
    font-size: 12px;
    letter-spacing: 0.04em;
    text-transform: uppercase;
}
.acp-adt-trans-count {
    color: var(--acp-muted-2);
    font-size: 12px;
    font-family: var(--acp-font-mono);
    font-weight: 600;
}

/* -----------------------------------------------------------------
 * Global scrollable-dialog cap. TelerikWindow / TelerikDialog default
 * to their content's natural height, so a long form (Add Resident,
 * Insurance policy, etc.) can outgrow the viewport and clip at the
 * bottom — buttons and all. Cap the root at 90vh, make it a vertical
 * flex column, and let the content area scroll while the title bar
 * and footer stay pinned. Applies to every dialog automatically —
 * no per-dialog opt-in needed. Set on the base Telerik classes so
 * both TelerikWindow and TelerikDialog inherit the behavior.
 * ---------------------------------------------------------------- */
.k-window,
.k-dialog {
    max-height: 90vh;
    display: flex;
    flex-direction: column;
}
.k-window > .k-window-content,
.k-dialog > .k-dialog-content {
    flex: 1 1 auto;
    min-height: 0;
    overflow-y: auto;
    overflow-x: hidden;
}
/* The action-buttons footer never scrolls with the body — it stays anchored at the bottom. */
.k-window > .k-window-actions,
.k-window > .k-actions,
.k-dialog > .k-dialog-buttongroup,
.k-dialog > .k-actions {
    flex: 0 0 auto;
}

/* --- Add Admission dialog --------------------------------------- */
.acp-adt-dialog .k-window-content { padding: 0; }
/* Contacts and Resources render as tab panes now, not dialogs, so their body drops the dialog
   padding and sits flush in the pane. */
.acp-panel-body {
    display: flex;
    flex-direction: column;
    gap: 0.85rem;
    padding: 0.25rem 0;
}
.acp-panel-body .acp-field-full { grid-column: 1 / -1; }
.acp-panel-actions {
    display: flex;
    justify-content: flex-end;
    gap: 0.5rem;
    padding-top: 0.5rem;
}
.acp-adt-dialog-body {
    padding: 1rem 1.25rem 0.5rem 1.25rem;
    display: flex;
    flex-direction: column;
    gap: 0.85rem;
}
.acp-adt-form-row {
    display: grid;
    gap: 0.5rem 1rem;
}
.acp-adt-form-row-2 { grid-template-columns: 1fr 1fr; }
.acp-adt-form-row-3 { grid-template-columns: 1fr 1fr 1fr; }
.acp-adt-form-row-4 { grid-template-columns: 1fr 1fr 1fr 1fr; }
@media (max-width: 640px) {
    .acp-adt-form-row-2,
    .acp-adt-form-row-3,
    .acp-adt-form-row-4 { grid-template-columns: 1fr; }
}

/* Add Resident dialog: section headings and the closing note about status / bed. */
.acp-add-section {
    font-weight: 600;
    font-size: 0.82rem;
    text-transform: uppercase;
    letter-spacing: 0.04em;
    color: #555;
    border-bottom: 1px solid #e0e0e0;
    padding-bottom: 0.25rem;
    margin: 0.75rem 0 0.25rem;
}
.acp-add-section:first-child { margin-top: 0; }
.acp-add-note {
    font-size: 0.8rem;
    color: #666;
    margin-top: 0.75rem;
}

/* Resident photo: the frame stands in for the VB6 picpatient image control (.frm:4592),
   sized to the legacy 1455 x 1635 twips box and sitting inline on the form, not in a dialog. */
.acp-photo-box {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 0.25rem;
    flex: 0 0 auto;
}
.acp-photo-frame {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 97px;
    height: 109px;
    border: 1px solid #7F9DB9;
    background: #fff;
    overflow: hidden;
}
.acp-photo-image {
    max-width: 100%;
    max-height: 100%;
    object-fit: contain;
}
.acp-photo-empty {
    color: #888;
    font-size: 0.68rem;
    text-align: center;
    line-height: 1.2;
    padding: 0 0.2rem;
}
/* lblInsertPicture (.frm:4570): a caption that behaves as a link, with the real file input
   hidden behind it so the control does not read as a form field. */
.acp-photo-insert {
    font-size: 0.72rem;
    color: #0645ad;
    cursor: pointer;
    text-decoration: underline;
    white-space: nowrap;
}
.acp-photo-insert input[type="file"] {
    display: none;
}
.acp-photo-insert-disabled {
    color: #999;
    cursor: default;
    text-decoration: none;
}
.acp-photo-error {
    font-size: 0.68rem;
    color: #b00020;
    max-width: 120px;
    text-align: center;
}
.acp-adt-dialog-body .acp-field-full { grid-column: 1 / -1; }
.acp-adt-dialog-checks {
    display: flex;
    align-items: center;
    gap: 1rem;
    padding-top: 1.4rem; /* aligns with sibling input's baseline */
}
.acp-adt-check-label {
    display: inline-flex;
    align-items: center;
    gap: 0.35rem;
    font-size: 0.85rem;
    color: #334155;
    cursor: pointer;
}
.acp-adt-dialog-footer {
    display: flex;
    justify-content: flex-end;
    gap: 0.5rem;
    padding: 0.75rem 1.25rem;
    background: #fff;
    border-top: 1px solid #e2e8f0;
}

/* Inline field helper text — mirrors MUI TextField `helperText` w/ error. Kept lightweight (small,
   muted) so it does not compete with the field label above it. */
.acp-field-helper {
    display: block;
    font-size: 0.72rem;
    line-height: 1.15;
    color: #64748b;
    font-weight: 400;
    margin-top: 0.2rem;
    min-height: 1em;
}
/* All per-field error helpers render identically no matter which container they sit in — inside a
   plain `.acp-field` grid row, inside a `<fieldset class="acp-group">` (Gender / Pacemaker), or
   nested in an inline `.acp-field-pair`. Without these explicit rules the parent's font weight
   and size cascade inconsistently across contexts (label-strength on Demographics rows,
   legend-strength inside fieldsets), which is what the "Last name is required" bold-black vs
   "Gender is required" thin-red drift was. */
.acp-field-helper.acp-field-helper-error,
.acp-field-helper-error {
    color: #dc2626;
    font-size: 0.72rem;
    font-weight: 400;
    line-height: 1.15;
    margin-top: 0.2rem;
}

/* --- Outer TabStrip is decorative only (matches React MUI <Tabs> pattern where content
   lives outside the tab container). Telerik needs *some* child content in each tab, so we
   pass an empty spacer and collapse its render container to zero height. --- */
.acp-adt-tabs .k-content,
.acp-adt-tabs > .k-animation-container,
.acp-adt-tabs .k-tabstrip-content {
    display: none !important;
}
.acp-adt-tab-spacer { display: none; }

/* --- Decorative mode pills (replaces the outer TelerikTabStrip). These are plain
   <button> elements, not a TabStrip, because empty-content TabStripTabs crash the
   render diff. React uses <Tabs> here but they don't switch content — they only
   gate the "Add" button's enabled state. --- */
.acp-adt-mode-tabs {
    display: flex;
    gap: 0.15rem;
    padding: 0 1.25rem;
    border-bottom: 1px solid #e2e8f0;
    background: #fff;
}
.acp-adt-mode-tab {
    appearance: none;
    background: transparent;
    border: 0;
    border-bottom: 2px solid transparent;
    padding: 0.4rem 1rem;
    font-size: 0.85rem;
    color: #64748b;
    cursor: pointer;
    letter-spacing: 0.02em;
    font-weight: 500;
    transition: color 0.12s ease, border-color 0.12s ease;
    margin-bottom: -1px;
}
.acp-adt-mode-tab:hover { color: #0f172a; }
.acp-adt-mode-tab-active {
    color: #2563eb;
    border-bottom-color: #2563eb;
    font-weight: 600;
}

/* =====================================================================
   ADT LEFT PANE — React ResidentList parity (frontend/src/components/
   ResidentList.tsx). Card-style list with avatars, pill search-by chips,
   full-width Active/Inactive/All toggle. All plain HTML — no Telerik.
   ===================================================================== */

.acp-rl-pane {
    display: flex;
    flex-direction: column;
    height: 100%;
    background: #fff;
    border-right: 1px solid #e2e8f0;
}
.acp-rl-header {
    padding: 1rem 1rem 0.75rem 1rem;
    display: flex;
    flex-direction: column;
    gap: 0.75rem;
}
.acp-rl-title {
    font-size: 0.85rem;
    font-weight: 600;
    color: #0f172a;
    margin-bottom: 0.25rem;
}

/* Search input with icon prefix — MUI TextField + SearchIcon adornment. */
.acp-rl-search {
    position: relative;
    display: flex;
    align-items: center;
}
.acp-rl-search-icon {
    position: absolute;
    left: 0.6rem;
    top: 50%;
    transform: translateY(-50%);
    color: #64748b;
    display: inline-flex;
    pointer-events: none;
}
.acp-rl-search-input {
    width: 100%;
    padding: 0.5rem 0.75rem 0.5rem 2.15rem;
    font-size: 0.875rem;
    color: #0f172a;
    background: #fff;
    border: 1px solid #cbd5e1;
    border-radius: 4px;
    outline: none;
    transition: border-color 0.15s ease, box-shadow 0.15s ease;
}
.acp-rl-search-input:focus {
    border-color: #2563eb;
    box-shadow: 0 0 0 3px rgba(37, 99, 235, 0.12);
}

/* Search-by chips (Name / Number / Chart#) — MUI Chip filled/outlined. */
.acp-rl-chips {
    display: flex;
    gap: 0.4rem;
}
.acp-rl-chip {
    appearance: none;
    padding: 0.15rem 0.65rem;
    font-size: 0.72rem;
    font-weight: 500;
    border-radius: 9999px;
    background: transparent;
    color: #475569;
    border: 1px solid #cbd5e1;
    cursor: pointer;
    line-height: 1.4;
    transition: background 0.12s ease, color 0.12s ease, border-color 0.12s ease;
}
.acp-rl-chip:hover { background: #f1f5f9; }
.acp-rl-chip-active {
    background: #2563eb;
    color: #fff;
    border-color: #2563eb;
}
.acp-rl-chip-active:hover { background: #1d4ed8; }

/* Active / Inactive / All — MUI ToggleButtonGroup segmented full width. */
.acp-rl-toggle {
    display: flex;
    width: 100%;
    border: 1px solid #cbd5e1;
    border-radius: 4px;
    overflow: hidden;
}
.acp-rl-toggle-btn {
    flex: 1 1 0;
    appearance: none;
    background: #fff;
    color: #475569;
    border: 0;
    border-right: 1px solid #cbd5e1;
    padding: 0.4rem 0.5rem;
    font-size: 0.75rem;
    font-weight: 500;
    text-transform: uppercase;
    letter-spacing: 0.03em;
    cursor: pointer;
    transition: background 0.12s ease, color 0.12s ease;
}
.acp-rl-toggle-btn:last-child { border-right: 0; }
.acp-rl-toggle-btn:hover { background: #f8fafc; }
.acp-rl-toggle-btn-active {
    background: #eff6ff;
    color: #1d4ed8;
}

/* Scrollable list of resident cards. */
.acp-rl-list-scroll {
    flex: 1 1 auto;
    min-height: 0;
    overflow: auto;
    border-top: 1px solid #e2e8f0;
    padding: 0;
}
.acp-rl-empty {
    padding: 1rem;
    color: #64748b;
    font-size: 0.85rem;
}

/* Each resident item — MUI ListItemButton with left-border selected state. */
.acp-rl-item {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    width: 100%;
    background: transparent;
    border: 0;
    border-left: 3px solid transparent;
    padding: 0.6rem 0.9rem;
    text-align: left;
    cursor: pointer;
    transition: background 0.1s ease;
}
.acp-rl-item + .acp-rl-item {
    border-top: 1px solid #f1f5f9;
}
.acp-rl-item:hover { background: #f8fafc; }
.acp-rl-item-selected,
.acp-rl-item-selected:hover {
    background: #eff6ff;
    border-left-color: #2563eb;
}
.acp-rl-avatar {
    width: 32px;
    height: 32px;
    border-radius: 50%;
    background: #94a3b8;
    color: #fff;
    font-size: 0.72rem;
    font-weight: 600;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    letter-spacing: 0.02em;
    flex-shrink: 0;
}
.acp-rl-item-body {
    flex: 1 1 auto;
    min-width: 0;
}
.acp-rl-item-name {
    font-size: 0.85rem;
    color: #0f172a;
    font-weight: 500;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}
.acp-rl-item-mrn {
    font-size: 0.72rem;
    color: #64748b;
    margin-top: 0.1rem;
}

/* --- StageProgressPanel — shared between Billing Cycle and Billing Update. Matches React's
   Paper + LinearProgress + Typography stack visually (features/billing/shared/StageProgress.tsx). --- */
.acp-stage-progress {
    border: 1px solid #e2e8f0;
    border-radius: 4px;
    padding: 0.75rem 1rem;
    background: #fff;
}
.acp-stage-progress .k-progressbar {
    width: 100%;
}
.acp-stage-progress-label {
    text-align: center;
    margin-top: 0.5rem;
    font-weight: 700;
    color: #2563eb;
}
.acp-stage-progress-detail {
    text-align: center;
    margin-top: 0.2rem;
    color: #64748b;
    font-size: 0.75rem;
}

/* Inline resident-key prefix inside the resident-picker grid — matches React
   ResidentSelector's Typography color="text.secondary" for the leading key
   (frontend/src/features/residents/insurance/ResidentSelector.tsx:125-127). */
.acp-grid-num-inline {
    color: #64748b;
    font-variant-numeric: tabular-nums;
    margin-right: 0.15rem;
}

/* TelerikSvgIcon inside the ADT resident-picker search prefix — force it to the same
   18px size the inline MUI SearchIcon rendered at. Uses !important because Telerik's
   own .k-svg-icon width/height rules are set at the element level. */
.acp-rl-search-icon .k-svg-icon,
.acp-rl-search-icon .k-icon {
    width: 18px !important;
    height: 18px !important;
    font-size: 18px !important;
}

/* ==== Wave 21 — Welcome / sign-in landing (matches React auth/AuthGate.tsx) ==== */
/* Whole viewport now (MainLayout hides the appbar + sidebar when unauthenticated),
   so the wrapper is full 100vh, not calc(100vh - 90px). */

.acp-welcome-wrap {
    min-height: 100vh;
    display: flex;
    align-items: center;
    justify-content: center;
    background: #f4f6fa;
    padding: 2rem 1rem;
}

.acp-welcome-card {
    background: #ffffff;
    border: 1px solid #e0e4ec;
    border-radius: 8px;
    padding: 3rem 2.5rem;
    max-width: 420px;
    width: 100%;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.04);
    text-align: center;
}

.acp-welcome-card-loading {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 1rem;
}

.acp-welcome-title {
    /* Explicit border:none + background:none because some upstream h1 rule in the theme
       was rendering a thin border box around the title on the first cut. */
    font-size: 1.5rem;
    font-weight: 700;
    margin: 0 0 0.75rem 0;
    color: #1a2338;
    border: none;
    background: none;
    padding: 0;
}

.acp-welcome-body {
    color: #5b6478;
    margin: 0 0 1.5rem 0;
    line-height: 1.5;
}

.acp-welcome-signin-btn {
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
    background: #1976d2;
    color: #ffffff;
    padding: 0.75rem 1.5rem;
    border-radius: 4px;
    font-size: 0.9375rem;
    font-weight: 600;
    text-decoration: none;
    transition: background 0.15s ease;
    text-transform: uppercase;
    letter-spacing: 0.02em;
}

.acp-welcome-signin-btn:hover,
.acp-welcome-signin-btn:focus {
    background: #1565c0;
    text-decoration: none;
    color: #ffffff;
}

.acp-welcome-signin-icon {
    display: inline-flex;
    align-items: center;
}

/* Group box — the MUI/HTML stand-in for a VB6 VB.Frame (e.g. frmPatientMaster Frame4
   "Gender :"). Keeps the caption and the members it encloses visually together. */
.acp-group {
    border: 1px solid #d9d9d9;
    border-radius: 3px;
    padding: 0.35rem 0.6rem 0.5rem;
    margin: 0;
    min-width: 0;
}
.acp-group > legend {
    color: #888;
    font-size: 0.78rem;
    padding: 0 0.3rem;
}
/* The group box supplies its own caption, so suppress the .acp-field > div underline
   that the read-only fields use. */
.acp-field-group > .acp-group > div {
    border-bottom: none;
}

/* A grid cell holding an action button rather than a labelled field (e.g. the Clear
   button on the Medicare billing override block). */
.acp-field-actions {
    justify-content: flex-end;
    align-items: flex-start;
}

/* Selected resident's name + number above the tabs, with traversal and Delete beside it
   (legacy fraResidentNameNumber + RecordTraversalControlPanel1). */
.acp-resident-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    padding: 0.5rem 0.75rem;
    margin-bottom: 0.5rem;
    border: 1px solid #e3e3e3;
    border-radius: 3px;
    background: #fafafa;
}
.acp-resident-header-id {
    display: flex;
    align-items: baseline;
    gap: 0.5rem;
    min-width: 0;
}
.acp-resident-header-name {
    font-weight: 600;
    font-size: 1rem;
    color: #222;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}
.acp-resident-header-num {
    color: #888;
    font-size: 0.85rem;
}

/* A checkbox and its caption sitting on one line inside the field grid. */
.acp-checkbox-row {
    display: flex;
    align-items: center;
    gap: 0.45rem;
    cursor: pointer;
    color: #222;
    font-size: 0.9rem;
    text-transform: none;
    margin-bottom: 0;
}

/* Financial-note composer: a full-width text area with its counter and Save button beneath. */
.acp-note-editor {
    display: flex;
    flex-direction: column;
    gap: 0.3rem;
    padding: 0.5rem 0;
}
.acp-note-editor > label {
    color: #888;
    font-size: 0.78rem;
}
.acp-note-actions {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: 0.75rem;
}
.acp-note-count {
    color: #888;
    font-size: 0.78rem;
}

/* ===== Ledger Card (Reports/BillingLedgerCardsFor1Patient.rpt) =====
   Laid out to match the printed Crystal card. Page numbering is left to the browser's own print
   footer: Chrome and Edge do not support CSS @page margin boxes, so a page counter rendered here
   could not stay correct across pagination. */
.acp-print-toolbar {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    margin-bottom: 0.75rem;
}
.acp-ledger {
    font-size: 0.78rem;
    color: #000;
}
.acp-ledger-masthead,
.acp-ledger-subhead {
    display: flex;
    justify-content: space-between;
    gap: 2rem;
    margin-bottom: 0.5rem;
}
.acp-ledger-facility-name { font-weight: 700; }
.acp-ledger-resident { min-width: 240px; }
.acp-ledger-resident-name { font-weight: 700; }
.acp-ledger-period { margin-top: 0.35rem; font-weight: 600; }
.acp-ledger-line,
.acp-ledger-closing > div,
.acp-ledger-grand > div {
    display: flex;
    justify-content: space-between;
    gap: 1rem;
}
.acp-ledger-flags { display: flex; gap: 1rem; margin-top: 0.35rem; }
.acp-ledger-finclasses { margin-top: 0.35rem; }

.acp-ledger-table {
    width: 100%;
    border-collapse: collapse;
    margin: 0.5rem 0 1rem;
}
.acp-ledger-table th {
    text-align: left;
    border-bottom: 1px solid #000;
    padding: 0.2rem 0.3rem;
    font-weight: 600;
}
.acp-ledger-table td { padding: 0.15rem 0.3rem; vertical-align: top; }
.acp-ledger-table tbody tr:nth-child(even) { background: #fafafa; }
.acp-col-date { width: 5.5rem; white-space: nowrap; }
.acp-col-inv { width: 5rem; }
.acp-col-lc { width: 4.5rem; }
.acp-col-ref { width: 7rem; white-space: nowrap; }
.acp-col-money { width: 6rem; text-align: right; white-space: nowrap; }
.acp-ledger-group-row td { font-weight: 700; padding-top: 0.4rem; }
.acp-ledger-total-row td { border-top: 1px solid #000; font-weight: 700; }
.acp-ledger-closing {
    margin: 0.35rem 0 0 auto;
    width: 22rem;
}
.acp-ledger-closing-final { border-top: 1px solid #000; margin-top: 0.2rem; padding-top: 0.2rem; font-weight: 700; }
.acp-ledger-grand {
    margin-left: auto;
    width: 22rem;
    border-top: 2px solid #000;
    padding-top: 0.3rem;
    font-weight: 700;
}
.acp-ledger-grand-title { margin-bottom: 0.25rem; }

@media print {
    /* The report is the whole sheet: drop the app shell. */
    .acp-appbar, .acp-sidebar, .acp-print-toolbar, .acp-no-print { display: none !important; }
    .acp-main { padding: 0 !important; margin: 0 !important; overflow: visible !important; }
    .acp-body { display: block !important; }
    .acp-ledger-table tbody tr:nth-child(even) { background: none; }
    /* Landscape: the card's eight columns do not fit portrait at a legible size. */
    @page { size: letter landscape; margin: 0.4in; }
    /* Keep a section's rows together where the page allows, and never orphan a totals block. */
    .acp-ledger-table { page-break-inside: auto; }
    .acp-ledger-table tfoot { page-break-inside: avoid; }
    .acp-ledger-table tr { page-break-inside: avoid; }
    .acp-ledger-grand { page-break-inside: avoid; }
}

/* Tighter masthead: the printed card packs these blocks close together. */
.acp-ledger-masthead { margin-bottom: 0.25rem; align-items: flex-start; }
.acp-ledger-subhead { margin-top: 0; align-items: flex-start; }
.acp-ledger-resident .acp-ledger-line,
.acp-ledger-admit .acp-ledger-line { line-height: 1.25; }
.acp-ledger-admit { min-width: 260px; }

/* Free-text footer note (legacy frmLedger Custom Field → Crystal Comments). */
.acp-ledger-comments {
    margin-top: 1rem;
    padding: 0.5rem 0;
    border-top: 1px solid #333;
    font-style: italic;
}

/* ===== Ledger Card options dialog (legacy frmLedger picker) ===== */
.acp-ledger-options .acp-form-grid {
    display: flex;
    flex-direction: column;
    gap: 1rem;
}
.acp-ledger-options-row1 {
    display: flex;
    flex-wrap: nowrap;
    align-items: center;
    gap: 1.5rem;
}
.acp-ledger-options-row1 > * { flex: 0 0 auto; }
.acp-ledger-options-row1 .acp-checkbox-row { margin-left: 0.5rem; }
.acp-ledger-inline-field {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    white-space: nowrap;
}
.acp-ledger-inline-field label { margin: 0; }
.acp-ledger-include-grid {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 0.5rem 1.25rem;
    align-items: center;
}
/* Bottom half of the dialog: left column stacks rows 3/4/5 + OK/Close;
   right sidebar is the Financial Classes listbox (legacy screenshot 2026-09-23). */
.acp-ledger-options-bottom {
    display: grid;
    grid-template-columns: minmax(0, 1fr) 280px;
    gap: 1.5rem;
    align-items: stretch;
}
.acp-ledger-options-left {
    display: flex;
    flex-direction: column;
    gap: 1rem;
}
/* Rows 3 and 4 keep the same 3-column skeleton so every checkbox in row 3 aligns vertically
   with the corresponding cell in row 4. Every cell is a single flex row with nowrap so labels
   never bump to a second line. */
.acp-ledger-options-row3,
.acp-ledger-options-row4 {
    display: grid;
    grid-template-columns: minmax(220px, 1fr) minmax(220px, 1fr) minmax(220px, 1fr);
    gap: 1.5rem;
    align-items: center;
}
.acp-ledger-options-row3 > *,
.acp-ledger-options-row4 > * {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    white-space: nowrap;
    min-width: 0;
}
/* Numeric textbox next to "Search Amount:" — fixed width so it doesn't push the column. */
.acp-ledger-options-row4 .k-numerictextbox { width: 130px; }
.acp-ledger-options-comments label { display: block; margin-bottom: 0.35rem; }
.acp-ledger-options-actions {
    justify-content: flex-start;
    margin-top: auto;
    padding-top: 0.5rem;
}
.acp-ledger-options-right {
    border: 1px solid #ccc;
    padding: 0.5rem;
    background: #fff;
    overflow-y: auto;
    max-height: 320px;
}
.acp-ledger-finclass-list {
    display: flex;
    flex-direction: column;
    gap: 0.3rem;
}

/* ===== Contacts and Resources dialogs (frmPatientMasterResources tabs 2 and 3) ===== */
.acp-contacts-tab { padding-top: 0.5rem; }
.acp-contacts-grid { margin-bottom: 0.5rem; }
.acp-contacts-add-actions {
    display: flex;
    justify-content: flex-end;
    margin-top: 0.6rem;
}
.acp-badge-primary {
    display: inline-block;
    padding: 0.05rem 0.4rem;
    border-radius: 3px;
    background: #e8f0fe;
    color: #1a56b8;
    font-size: 0.72rem;
    font-weight: 600;
}
.acp-field-check {
    display: flex;
    align-items: center;
    gap: 0.35rem;
}
.acp-field-check label { margin: 0; }
.acp-readonly-value {
    padding: 0.3rem 0;
    color: #444;
}
.acp-resource-checks {
    display: flex;
    flex-wrap: wrap;
    gap: 0.25rem 1.25rem;
    margin-top: 0.6rem;
}
.acp-resource-checks span {
    display: inline-flex;
    align-items: center;
    gap: 0.35rem;
}
.acp-resource-checks label { margin: 0; font-size: 0.85rem; }

/* Contact authority dialog: one exclusive POA choice + independent flags. */
.acp-authority-body { padding: 0.25rem 0.25rem 0.5rem; }
.acp-authority-body .acp-group { margin-bottom: 0.75rem; }
.acp-authority-flags {
    display: flex;
    flex-wrap: wrap;
    gap: 0.3rem 1.25rem;
}
.acp-authority-flags span {
    display: inline-flex;
    align-items: center;
    gap: 0.35rem;
}
.acp-authority-flags label { margin: 0; font-size: 0.85rem; }
.acp-authority-sub { padding-left: 0.5rem; opacity: 0.9; }
.acp-authority-summary { font-size: 0.78rem; color: #444; }

/* ===== Face Sheet (Reports/HCIS/FaceSheetCabrini.rpt, superset) =====
   A form rather than a wide table, so portrait — unlike the Ledger Card. Sections are the printed
   sheet's blocks; the two-column field grid is ours, since parity here is functional not visual. */
.acp-facesheet {
    font-size: 0.78rem;
    color: #000;
    max-width: 8in;
}
.acp-facesheet-masthead {
    display: flex;
    justify-content: space-between;
    gap: 2rem;
    padding-bottom: 0.4rem;
    border-bottom: 2px solid #000;
}
.acp-facesheet-facility-name { font-weight: 700; font-size: 0.95rem; }
.acp-facesheet-title { text-align: right; }
.acp-facesheet-heading { font-weight: 700; font-size: 0.95rem; letter-spacing: 0.04em; }
.acp-facesheet-printed { color: #555; }
.acp-facesheet-name-bar {
    display: flex;
    flex-wrap: wrap;
    align-items: baseline;
    gap: 1.25rem;
    padding: 0.4rem 0;
    border-bottom: 1px solid #000;
    margin-bottom: 0.6rem;
}
.acp-facesheet-resident-name { font-weight: 700; font-size: 0.95rem; }
.acp-facesheet-toggle { display: inline-flex; align-items: center; gap: 0.35rem; }

.acp-facesheet-section { margin-bottom: 0.7rem; }
.acp-facesheet-section > h2 {
    font-size: 0.72rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.06em;
    margin: 0 0 0.3rem;
    padding-bottom: 0.12rem;
    border-bottom: 1px solid #999;
}
.acp-facesheet-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 0.1rem 1.5rem;
}
.acp-facesheet-field { display: flex; gap: 0.5rem; align-items: baseline; }
.acp-facesheet-label { color: #555; min-width: 8.5rem; flex-shrink: 0; }
.acp-facesheet-value { font-weight: 600; }
.acp-facesheet-freetext { white-space: pre-wrap; }

.acp-facesheet-table { border-collapse: collapse; width: 100%; }
.acp-facesheet-table th,
.acp-facesheet-table td {
    padding: 0.15rem 0.35rem;
    text-align: left;
    vertical-align: top;
    border-bottom: 1px solid #ddd;
}
.acp-facesheet-table thead th { border-bottom: 1px solid #000; font-weight: 700; }
.acp-facesheet-table tbody th { color: #555; font-weight: 400; width: 9rem; }
.acp-facesheet-diagnoses { margin-top: 0.4rem; }
.acp-facesheet-diagnoses .acp-col-code { width: 5rem; }

.acp-facesheet-physicians {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 1.5rem;
    margin-bottom: 0.5rem;
}
.acp-facesheet-physician-name { font-weight: 700; }
.acp-facesheet-physician-phones { display: flex; flex-wrap: wrap; gap: 0.75rem; margin-top: 0.15rem; }

@media print {
    /* The sheet is a form, so it wants portrait — but the Ledger Card's `@page` above is a
       document-level rule that would force landscape onto every printed page in the app. A named
       page keeps the two apart without touching the Ledger Card's working rule. Browsers without
       named-page support (pre-Chromium-110) fall back to that landscape default: wider than ideal,
       still legible, and no regression to the Ledger Card. */
    .acp-facesheet { page: acpFaceSheet; max-width: none; }
    .acp-facesheet-section { page-break-inside: avoid; }
    .acp-facesheet-table tr { page-break-inside: avoid; }
}

@page acpFaceSheet { size: letter portrait; margin: 0.5in; }

/* ===== Classic desktop skin — Resident Management =====
   Scoped to .acp-classic (Residents.razor only). The operator wanted the Blazor screen to read
   like MDSEase's frmPatientMaster rather than a modern web detail view, so this restyles the
   existing markup into the VB6 idiom: captioned group boxes, labels beside sunken inputs, a dense
   type scale, and square classic tabs. No markup or behavior changes — presentation only.

   Colors are the legacy palette: XP form beige, #7F9DB9 control borders, navy frame captions. */
.acp-classic {
    --vb-form: #ECE9D8;
    --vb-panel: #F5F4EC;
    --vb-field: #FFFFFF;
    --vb-border: #7F9DB9;
    --vb-border-soft: #C3CEDA;
    --vb-caption: #17427E;
    --vb-ink: #101418;
    --vb-ink-soft: #4A5560;
    --vb-disabled: #E8E6DC;
    font-size: 12px;
}

.acp-classic .acp-master-pane,
.acp-classic .acp-detail-pane {
    background: var(--vb-form);
}

.acp-classic .acp-detail-pane { padding: 0.5rem 0.6rem 0; }

/* ---- Frame: a VB.Frame is a hairline box with its caption straddling the top border ---- */
.acp-classic .acp-demo-card.k-card {
    background: transparent;
    border: 1px solid var(--vb-border-soft);
    border-radius: 0;
    box-shadow: none;
    margin-top: 0.65rem;
    overflow: visible;
}
.acp-classic .acp-demo-card .k-card-header {
    background: transparent;
    border: 0;
    padding: 0;
    position: relative;
    top: -0.62rem;
    margin-bottom: -0.35rem;
    margin-left: 0.6rem;
    width: fit-content;
}
.acp-classic .acp-demo-card .k-card-title {
    background: var(--vb-form);
    color: var(--vb-caption);
    font-size: 0.72rem;
    font-weight: 400;
    letter-spacing: 0;
    text-transform: none;
    padding: 0 0.35rem;
}
.acp-classic .acp-demo-card .k-card-body { padding: 0.35rem 0.75rem 0.6rem; }

.acp-classic .acp-demo-sections { gap: 0.15rem; padding-bottom: 0.75rem; }

/* ---- Fields: label to the left of the control, as the form lays them out ---- */
.acp-classic .acp-field-grid,
.acp-classic .acp-demo-card .acp-field-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 0.28rem 2.25rem;
    padding: 0.15rem 0;
}
.acp-classic .acp-field {
    flex-direction: row;
    align-items: center;
    gap: 0.5rem;
    min-height: 1.55rem;
}
.acp-classic .acp-field > label {
    color: var(--vb-ink);
    font-size: 0.75rem;
    margin: 0;
    flex: 0 0 8.5rem;
    text-align: right;
    line-height: 1.25;
}
/* The legacy writes every field label with a trailing colon. */
.acp-classic .acp-field > label::after { content: " :"; }

.acp-classic .acp-field > div {
    flex: 1 1 auto;
    border-bottom: 0;
    color: var(--vb-ink);
    font-size: 0.75rem;
    padding: 0;
    min-height: 1.45rem;
    display: flex;
    align-items: center;
}

/* A read-only value still sits in a sunken box, the way the VB6 shows a disabled TextBox. */
.acp-classic .acp-field > div:not(:has(.k-input)):not(:has(.k-picker)):not(:has(input)):not(.acp-field-helper) {
    background: var(--vb-disabled);
    border: 1px solid var(--vb-border-soft);
    padding: 0.1rem 0.35rem;
    min-width: 0;
}

/* ---- Editable controls: square, hairline, white ---- */
.acp-classic .k-input,
.acp-classic .k-picker {
    border-radius: 0;
    border-color: var(--vb-border);
    background: var(--vb-field);
    font-size: 0.75rem;
    min-height: 1.5rem;
}
.acp-classic .k-input-inner,
.acp-classic .k-picker .k-input-inner { padding: 0.05rem 0.35rem; }
.acp-classic .k-input:focus-within,
.acp-classic .k-picker:focus-within {
    box-shadow: none;
    border-color: var(--vb-caption);
}

/* ---- Buttons: compact, square, classic ---- */
.acp-classic .k-button {
    border-radius: 0;
    font-size: 0.75rem;
    padding: 0.12rem 0.6rem;
    min-height: 1.6rem;
}

/* ---- Tabs: square, joined to the pane below, active tab lifts ---- */
.acp-classic .k-tabstrip > .k-tabstrip-items-wrapper .k-item {
    border-radius: 0;
    background: var(--vb-panel);
    border: 1px solid var(--vb-border-soft);
    border-bottom-color: var(--vb-border-soft);
    margin-right: 2px;
    font-size: 0.76rem;
}
.acp-classic .k-tabstrip > .k-tabstrip-items-wrapper .k-item.k-active {
    background: var(--vb-form);
    border-bottom-color: var(--vb-form);
    font-weight: 600;
    color: var(--vb-caption);
}
.acp-classic .k-tabstrip > .k-tabstrip-items-wrapper .k-link { padding: 0.22rem 0.85rem; }
.acp-classic .k-tabstrip-content {
    border: 1px solid var(--vb-border-soft);
    border-radius: 0;
    background: var(--vb-form);
    padding: 0.5rem 0.75rem;
}

/* ---- Resident list: the legacy lstPatient is a plain sunken list ---- */
.acp-classic .acp-resident-grid-host {
    border: 1px solid var(--vb-border);
    background: var(--vb-field);
    margin: 0 0.5rem;
}
.acp-classic .acp-search-controls { padding: 0.5rem; }
.acp-classic .acp-grid-name { font-size: 0.76rem; }
.acp-classic .k-grid td { padding: 0.08rem 0.4rem; }
.acp-classic .k-grid .k-table-row.k-selected td {
    background: #316AC5;
    color: #fff;
}

/* ---- Header bar: name/number plus the command buttons, as one strip ---- */
.acp-classic .acp-resident-header {
    background: var(--vb-panel);
    border: 1px solid var(--vb-border-soft);
    padding: 0.3rem 0.55rem;
    align-items: center;
    gap: 0.5rem;
}
.acp-classic .acp-resident-header-name {
    font-size: 0.85rem;
    font-weight: 700;
    color: var(--vb-caption);
}

/* ---- Existing bordered group (Gender, On Pacemaker, …) matches the frame treatment ---- */
.acp-classic fieldset.acp-group {
    border: 1px solid var(--vb-border-soft);
    border-radius: 0;
    padding: 0.15rem 0.5rem 0.3rem;
    margin: 0;
}
.acp-classic fieldset.acp-group > legend {
    color: var(--vb-caption);
    font-size: 0.7rem;
    padding: 0 0.25rem;
}

.acp-classic .acp-radio-row { font-size: 0.75rem; gap: 0.75rem; }
.acp-classic .acp-list-count { font-size: 0.7rem; color: var(--vb-ink-soft); }
.acp-classic .acp-demographics-header h2 { font-size: 0.85rem; color: var(--vb-caption); }

/* Dark theme keeps the classic geometry but drops the beige, which is unreadable inverted. */
@media (prefers-color-scheme: dark) {
    :root:not([data-theme="light"]) .acp-classic {
        --vb-form: #1E2328;
        --vb-panel: #262C32;
        --vb-field: #14181B;
        --vb-border: #4A5A68;
        --vb-border-soft: #38424B;
        --vb-caption: #8FB6E0;
        --vb-ink: #E3E8EC;
        --vb-ink-soft: #A0ACB5;
        --vb-disabled: #232A30;
    }
}
:root[data-theme="dark"] .acp-classic {
    --vb-form: #1E2328;
    --vb-panel: #262C32;
    --vb-field: #14181B;
    --vb-border: #4A5A68;
    --vb-border-soft: #38424B;
    --vb-caption: #8FB6E0;
    --vb-ink: #E3E8EC;
    --vb-ink-soft: #A0ACB5;
    --vb-disabled: #232A30;
}

/* ---- Classic skin, second pass: the first was too gentle against the modern defaults ---- */

/* The modern read view puts the "Modify" heading above the fields; the legacy has no such row. */
.acp-classic .acp-detail-pane > h2,
.acp-classic .acp-demographics-header > h2 { font-size: 0.8rem; margin: 0; }

/* Card titles are frame captions, not uppercase section eyebrows. */
.acp-classic .k-card-title,
.acp-classic .acp-demo-card .k-card-title {
    text-transform: none !important;
    letter-spacing: 0 !important;
    font-weight: 400 !important;
    color: var(--vb-caption) !important;
    font-size: 0.73rem !important;
}
/* Card titles render as plain captions — no auto-appended ellipsis. The earlier "..." pseudo
   element was a legacy-caption reproduction, dropped per the 2026-08-31 UI pass so labels and
   headers never end in an ellipsis. */

/* Two columns, tight rows — the modern grid is three wide with 1rem gaps. */
.acp-classic .acp-field-grid,
.acp-classic .acp-demo-card .acp-field-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: 0.22rem 2rem !important;
}

/* Label beside the control, right-aligned, with the legacy colon. */
.acp-classic .acp-field {
    flex-direction: row !important;
    align-items: center !important;
    gap: 0.45rem !important;
}
.acp-classic .acp-field > label {
    flex: 0 0 8rem !important;
    text-align: right !important;
    margin: 0 !important;
    color: var(--vb-ink) !important;
    font-size: 0.74rem !important;
}
.acp-classic .acp-field > div {
    flex: 1 1 auto !important;
    border-bottom: 0 !important;
    padding: 0.1rem 0.35rem !important;
    font-size: 0.74rem !important;
    background: var(--vb-disabled);
    border: 1px solid var(--vb-border-soft);
    min-height: 1.4rem;
}
/* A cell that hosts a live control supplies its own chrome. */
.acp-classic .acp-field > div:has(.k-input),
.acp-classic .acp-field > div:has(.k-picker),
.acp-classic .acp-field > div:has(.k-radio),
.acp-classic .acp-field > div:has(fieldset) {
    background: transparent;
    border: 0;
    padding: 0 !important;
}
.acp-classic .acp-field-helper { border: 0 !important; background: transparent !important; }

/* Kill the modern card padding and radii the theme puts everywhere. */
.acp-classic .acp-demo-card .k-card-body { padding: 0.4rem 0.7rem 0.55rem !important; }
.acp-classic .acp-demo-sections { gap: 0.1rem !important; }

/* ----- Report catalogue (legacy ReportViewer.frm) ----- */
.acp-reports-page {
    padding: 0.75rem 1rem;
}
.acp-reports-panes {
    display: grid;
    grid-template-columns: 20rem 1fr;
    gap: 1rem;
    align-items: start;
}
.acp-reports-sections,
.acp-reports-list {
    margin: 0;
    min-width: 0;
}
.acp-report-list {
    list-style: none;
    margin: 0;
    padding: 0;
    max-height: 60vh;
    overflow-y: auto;
    background: #fff;
    border: 1px solid #7F9DB9;
}
/* AltLVBackground alternates white and #E0E0E0 in the legacy listviews (:573). */
.acp-report-list > li:nth-child(even) {
    background: #F3F3F3;
}
.acp-report-row {
    display: flex;
    align-items: center;
    gap: 0.45rem;
    padding: 0.25rem 0.5rem;
    font-size: 0.8rem;
    cursor: pointer;
    white-space: nowrap;
}
.acp-report-row:hover {
    background: #DCE9F7;
}
/* Must out-specify the nth-child stripe and the hover rule above, or the selected row keeps the
   grey band and its white text becomes unreadable. */
.acp-report-list > li.acp-report-row-selected,
.acp-report-list > li.acp-report-row-selected:hover {
    background: #3399FF;
    color: #fff;
}
.acp-report-name {
    flex: 1 1 auto;
    overflow: hidden;
    text-overflow: ellipsis;
}
.acp-report-count {
    color: #666;
    font-size: 0.7rem;
}
.acp-report-list > li.acp-report-row-selected .acp-report-count {
    color: #E8F1FB;
}
/* Not ported yet: greyed, but still clickable — the row opens the real parameter dialog. */
.acp-report-row-disabled {
    color: #999;
}
.acp-report-pending {
    font-size: 0.68rem;
    color: #aaa;
    font-style: italic;
}
.acp-reports-footnote {
    margin-top: 0.4rem;
    font-size: 0.7rem;
    color: #666;
}

/* The shared parameter dialog (legacy frmRosterReports). */
.acp-report-params {
    display: flex;
    flex-direction: column;
    gap: 0.6rem;
    padding: 0.25rem 0.25rem 0.5rem 0.25rem;
}
.acp-report-params .acp-field > label {
    display: block;
    font-size: 0.78rem;
    margin-bottom: 0.15rem;
}
.acp-report-params .acp-field-check {
    display: flex;
    align-items: center;
    gap: 0.4rem;
}
.acp-alert-info {
    background: #FFF8E1;
    border: 1px solid #E6D28A;
    color: #6B5A1E;
    padding: 0.5rem 0.7rem;
    font-size: 0.78rem;
}

/* ----- A printed report page (Active Roster and the roster reports to follow) ----- */
.acp-report-page {
    padding: 0.75rem 1rem;
}
.acp-report-toolbar {
    display: flex;
    gap: 0.5rem;
    margin-bottom: 0.75rem;
}
.acp-report-sheet {
    background: #fff;
    border: 1px solid #7F9DB9;
    padding: 1rem 1.25rem;
    overflow-x: auto;
}
.acp-report-head {
    text-align: center;
    margin-bottom: 0.9rem;
}
.acp-report-facility {
    font-size: 0.82rem;
}
.acp-report-range {
    font-size: 0.72rem;
    color: #555;
    margin-top: 0.25rem;
}
.acp-report-table {
    width: 100%;
    border-collapse: collapse;
    font-size: 0.74rem;
}
.acp-report-table th {
    text-align: left;
    border-bottom: 1px solid #333;
    padding: 0.25rem 0.4rem;
    white-space: nowrap;
}
.acp-report-table td {
    padding: 0.2rem 0.4rem;
    border-bottom: 1px solid #eee;
    vertical-align: top;
}
@media print {
    .acp-no-print { display: none !important; }
    .acp-report-sheet { border: none; padding: 0; }
}

/* Masthead of a printed report, following the legacy sheet. */
.acp-report-org {
    font-size: 1.15rem;
    font-weight: 700;
    color: #8B0000;
    letter-spacing: 0.02em;
}
.acp-report-addr {
    font-size: 0.76rem;
    color: #00008B;
    font-weight: 600;
    margin-bottom: 0.5rem;
}
.acp-report-title {
    font-size: 0.95rem;
    font-weight: 700;
    color: #00008B;
    border-top: 2px solid #000;
    border-bottom: 1px solid #000;
    padding: 0.3rem 0;
    margin-bottom: 0.35rem;
}
.acp-report-range div {
    font-size: 0.72rem;
}
/* The legacy sheet bands alternate rows grey. */
.acp-report-striped tbody tr:nth-child(odd) {
    background: #D9D9D9;
}
.acp-report-foot {
    margin-top: 0.7rem;
    text-align: center;
    font-weight: 700;
    font-size: 0.8rem;
    color: #000;
}

/* -----------------------------------------------------------------
 * Charges Journal (BillingJournal.rpt) — the printed sheet is a
 * dense per-resident table with per-invoice groupings, sub-totals,
 * grand totals, breakdown totals, errors, and per-G/L summaries.
 * The palette matches the legacy Crystal masthead (dark red org,
 * dark blue heading) and keeps the "previous" columns dim so the
 * eye lands on the active amount columns first, same as the
 * pink-tinted "$0.00" columns in the legacy printout.
 * ---------------------------------------------------------------- */
.acp-charges-journal .acp-cj-head {
    text-align: center;
    margin-bottom: 0.6rem;
}
.acp-charges-journal .acp-cj-org {
    font-size: 1.15rem;
    font-weight: 700;
    color: #8B0000;
}
.acp-charges-journal .acp-cj-heading {
    font-size: 0.95rem;
    font-weight: 700;
    color: #00008B;
}
.acp-charges-journal .acp-cj-titledate,
.acp-charges-journal .acp-cj-dateupdate,
.acp-charges-journal .acp-cj-billingid {
    font-size: 0.72rem;
    color: #222;
}
.acp-charges-journal .acp-cj-billingid {
    margin-top: 0.15rem;
    border-top: 1px solid #000;
    padding-top: 0.15rem;
}
.acp-charges-journal .acp-cj-table {
    width: 100%;
    border-collapse: collapse;
    font-size: 0.68rem;
    table-layout: auto;
}
.acp-charges-journal .acp-cj-col-heads th {
    border-bottom: 1px solid #333;
    padding: 0.2rem 0.3rem;
    text-align: right;
    font-weight: 600;
    color: #333;
    white-space: nowrap;
}
.acp-charges-journal .acp-cj-supercol th {
    text-align: center;
    border-bottom: none;
    font-weight: 500;
    color: #660066;
    font-size: 0.62rem;
}
.acp-charges-journal .acp-cj-col-heads th:first-child,
.acp-charges-journal .acp-cj-col-heads th:nth-child(2) {
    text-align: left;
}
.acp-charges-journal .acp-cj-line td {
    padding: 0.15rem 0.3rem;
    border-bottom: 1px dotted #ddd;
    vertical-align: top;
}
.acp-charges-journal .acp-cj-resident-head td {
    padding-top: 0.5rem;
    padding-bottom: 0.05rem;
    border-top: 1px solid #666;
}
.acp-charges-journal .acp-cj-resident-name {
    display: flex;
    justify-content: space-between;
    font-size: 0.78rem;
}
.acp-charges-journal .acp-cj-medicaid {
    color: #333;
    font-weight: 600;
}
.acp-charges-journal .acp-cj-invoice-head td {
    padding: 0.05rem 0.3rem 0.15rem;
    color: #555;
    font-size: 0.72rem;
}
.acp-charges-journal .acp-cj-num,
.acp-charges-journal .acp-cj-money {
    text-align: right;
    white-space: nowrap;
    font-variant-numeric: tabular-nums;
}
.acp-charges-journal .acp-cj-money-dim {
    color: #C71585;
}
.acp-charges-journal .acp-cj-money-bold {
    font-weight: 700;
}
.acp-charges-journal .acp-cj-subtotal td {
    border-top: 1px solid #999;
    border-bottom: 1px solid #999;
    background: #F4F4F4;
    padding: 0.2rem 0.3rem;
    font-weight: 600;
}
.acp-charges-journal .acp-cj-grand td,
.acp-charges-journal .acp-cj-grand-anc td {
    border-top: 2px solid #000;
    background: #EAEAEA;
    padding: 0.25rem 0.3rem;
    font-weight: 700;
}
.acp-charges-journal .acp-cj-grand-anc td {
    border-top: none;
    font-weight: 500;
}
.acp-charges-journal .acp-cj-grand-summary td {
    border-top: none;
    padding: 0.4rem 0;
}
.acp-charges-journal .acp-cj-grand-line {
    display: flex;
    justify-content: space-around;
    font-weight: 700;
    padding: 0.2rem 0;
}

.acp-charges-journal .acp-cj-section {
    page-break-before: always;
    margin-top: 1.5rem;
    padding-top: 1rem;
    border-top: 1px solid #000;
}
.acp-charges-journal .acp-cj-section h3 {
    text-align: center;
    color: #00008B;
    font-size: 0.95rem;
    margin: 0.25rem 0 0.75rem;
}
.acp-charges-journal .acp-cj-section h4 {
    color: #00008B;
    font-size: 0.85rem;
    margin: 0.75rem 0 0.35rem;
}
.acp-charges-journal .acp-cj-breakdown-table th,
.acp-charges-journal .acp-cj-breakdown-table td,
.acp-charges-journal .acp-cj-errors-table th,
.acp-charges-journal .acp-cj-errors-table td,
.acp-charges-journal .acp-cj-gl-charges th,
.acp-charges-journal .acp-cj-gl-charges td,
.acp-charges-journal .acp-cj-gl-brk-table th,
.acp-charges-journal .acp-cj-gl-brk-table td {
    padding: 0.2rem 0.35rem;
    border-bottom: 1px solid #ddd;
    font-size: 0.72rem;
}
.acp-charges-journal .acp-cj-brk-census td,
.acp-charges-journal .acp-cj-brk-total td {
    border-top: 1px solid #333;
    font-weight: 700;
}
.acp-charges-journal .acp-cj-brk-summary,
.acp-charges-journal .acp-cj-err-summary {
    display: flex;
    justify-content: space-around;
    margin-top: 0.5rem;
    font-weight: 700;
    font-size: 0.8rem;
}
.acp-charges-journal .acp-cj-err-heading td {
    background: #EAEAEA;
    font-weight: 700;
    padding-top: 0.4rem;
    text-transform: uppercase;
    letter-spacing: 0.05em;
}
.acp-charges-journal .acp-cj-gl-loc-heading {
    background: #B9E5F7;
    padding: 0.25rem 0.5rem;
    font-weight: 700;
    color: #003;
}
.acp-charges-journal .acp-cj-gl-subheading {
    padding: 0.25rem 0;
    font-weight: 600;
    color: #333;
}
.acp-charges-journal .acp-cj-gl-subtotal td {
    background: #FADCE9;
    font-weight: 700;
    border-top: 1px solid #333;
}
.acp-charges-journal .acp-cj-gl-level-total td {
    background: #B9E5F7;
    font-weight: 700;
}
.acp-charges-journal .acp-cj-gl-grand {
    margin-top: 1rem;
    padding: 0.5rem 0.75rem;
    background: #C8F1CB;
    border: 1px solid #060;
    font-weight: 700;
}
.acp-charges-journal .acp-cj-gl-grand-label {
    color: #00008B;
    margin-bottom: 0.3rem;
}
.acp-charges-journal .acp-cj-gl-amount-row {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    gap: 0.5rem 1rem;
}
.acp-charges-journal .acp-cj-amt {
    display: inline-flex;
    gap: 0.35rem;
    align-items: baseline;
}
.acp-charges-journal .acp-cj-amt-lbl {
    color: #333;
    font-weight: 500;
}
.acp-charges-journal .acp-cj-amt-gl {
    color: #666;
    font-size: 0.7rem;
    font-style: italic;
}
.acp-charges-journal .acp-cj-gl-brk-total td {
    background: #EAEAEA;
    border-top: 2px solid #000;
}
.acp-charges-journal .acp-cj-options {
    margin-top: 0.5rem;
}

/* Suppression toggles on the Select-a-Billing dialog, laid out on one line under the grid to
 * mirror the legacy frmSelectBilling's footer strip. */
.acp-cj-suppress {
    display: flex;
    gap: 1.5rem;
    align-items: center;
    padding: 0.5rem 0.25rem;
    font-size: 0.82rem;
}
.acp-cj-suppress label {
    display: inline-flex;
    gap: 0.35rem;
    align-items: center;
    cursor: pointer;
}

@media print {
    .acp-charges-journal .acp-cj-section { page-break-before: always; }
    .acp-charges-journal .acp-cj-resident-head { page-break-inside: avoid; }
    .acp-charges-journal .acp-cj-line { page-break-inside: avoid; }
}

/* Legacy-form pattern: single-column flat form matching a VB6 frame's Top-sorted
   control order. Used on tabs where the .frm arranges fields as a strict vertical
   stack with an occasional right-side pair (e.g. Financials Row 1 Medicaid# +
   NoOtherIns; Row 10 Aid + Start + Stop). Kept token-based, no hard-coded colors. */
.acp-legacy-form {
    display: flex; flex-direction: column;
    gap: var(--acp-space-3);
    padding: var(--acp-space-5) var(--acp-space-6);
    background: var(--acp-card);
    border: 1px solid var(--acp-line);
    border-radius: var(--acp-radius-lg);
    max-width: 780px;
}
.acp-legacy-form > .acp-field { margin: 0; }
.acp-legacy-row {
    display: grid;
    align-items: center;
    gap: var(--acp-space-4);
}
.acp-legacy-row--pair {
    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
}
.acp-legacy-row--triple {
    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) minmax(0, 1fr);
}
@media (max-width: 720px) {
    .acp-legacy-row--pair,
    .acp-legacy-row--triple { grid-template-columns: 1fr; }
}
.acp-legacy-row-extra {
    align-self: end;
    padding-bottom: 6px;
}

/* When the legacy-form sits INSIDE an AcpCard (Financials read view), drop the
   card-style frame/background/margin so we don't stack two card frames. */
.acp-legacy-form--in-card {
    background: transparent;
    border: none;
    border-radius: 0;
    padding: 0;
    margin: 0;
    max-width: 720px;
}

/* ---------------------------------------------------------------
 * Bed Hold / Release page (legacy frmBedHoldPatients + frmBedRel).
 * Two stacked list cards — "To be released" (auto-checked) and
 * "Still on bed hold" (opt-in). Uses the shared AcpCard skin.
 * --------------------------------------------------------------- */
.acp-bedhold-page {
    padding: var(--acp-space-4) var(--acp-space-7);
    display: flex; flex-direction: column;
    gap: var(--acp-space-4);
    background: var(--acp-bg);
    min-height: 100vh;
}
.acp-bedhold-page > .acp-command-bar { margin: 0; }
.acp-bedhold-footer { justify-content: flex-start; }
.acp-bedhold-columns {
    display: grid; grid-template-columns: 1fr 1fr;
    gap: var(--acp-space-4);
    align-items: stretch;
}
@media (max-width: 1100px) { .acp-bedhold-columns { grid-template-columns: 1fr; } }

/* Checkbox listbox — matches legacy VB.ListBox Style=1 shape. Names only,
   one per row, with a checkbox on the left. No sort/filter — legacy has
   neither. */
.acp-bedhold-checklist {
    max-height: 380px;
    overflow-y: auto;
    background: var(--acp-card);
    border: 1px solid var(--acp-line);
    border-radius: var(--acp-radius);
}
.acp-bedhold-checklist-toolbar {
    display: flex; gap: 4px;
    padding: 4px 8px;
    border-bottom: 1px solid var(--acp-line);
    background: var(--acp-surface);
}
.acp-bedhold-checklist-list {
    list-style: none; padding: 0; margin: 0;
}
.acp-bedhold-checklist-list li + li {
    border-top: 1px solid var(--acp-line);
}
.acp-bedhold-checklist-item {
    display: flex; align-items: center; gap: 10px;
    padding: 8px 12px;
    font-size: 13px;
    cursor: pointer;
}
.acp-bedhold-checklist-item:hover { background: var(--acp-primary-soft); }
.acp-bedhold-checklist-empty {
    padding: 28px 16px;
    text-align: center;
    color: var(--acp-muted-2);
    font-size: 13px;
}

/* Release dialog — row of pickers above the read-only grid. */
.acp-bedhold-dialog-row {
    display: flex; align-items: center; gap: var(--acp-space-4);
    flex-wrap: wrap;
    padding: 4px 0 var(--acp-space-3);
    margin-bottom: var(--acp-space-3);
    border-bottom: 1px dashed var(--acp-line);
}

.acp-bedhold-picker {
    display: inline-flex; align-items: center; gap: 8px;
    font-size: 12.5px; color: var(--acp-muted);
}
.acp-bedhold-picker-label {
    font-family: var(--acp-font-mono);
    font-size: 11px; letter-spacing: 0.04em;
    text-transform: uppercase; font-weight: 600;
    white-space: nowrap;
}
.acp-bedhold-picker .k-dropdownlist,
.acp-bedhold-picker .k-datepicker,
.acp-bedhold-picker .k-timepicker { min-width: 180px; flex: 0 0 auto; }
.acp-bedhold-list-head {
    display: flex; justify-content: flex-end;
    padding: 0 0 var(--acp-space-2);
}
.acp-bedhold-grid.k-grid {
    border: 1px solid var(--acp-line) !important;
    border-radius: var(--acp-radius) !important;
}
.acp-bedhold-failures {
    margin: 6px 0 0; padding: 0 0 0 20px;
    font-size: 12.5px;
}
.acp-bedhold-error { margin: 0; }
.acp-bedhold-info {
    padding: 8px 14px;
    background: var(--acp-primary-soft);
    color: var(--acp-primary);
    border-left: 3px solid var(--acp-primary);
    border-radius: var(--acp-radius);
    font-size: 13px;
}

/* ---------------------------------------------------------------
 * Bed Transfer page (legacy frmResidentBedTransfer.frm layout,
 * rendered in the AcpCard visual language).
 * --------------------------------------------------------------- */
.acp-bedxfer-page {
    padding: var(--acp-space-4) var(--acp-space-7);
    display: flex; flex-direction: column;
    gap: var(--acp-space-4);
    background: var(--acp-bg);
    min-height: 100vh;
}
.acp-bedxfer-page > .acp-command-bar { margin: 0; }
.acp-bedxfer-columns {
    display: grid; grid-template-columns: 1fr 1fr;
    gap: var(--acp-space-4);
    align-items: stretch;
}
@media (max-width: 1200px) { .acp-bedxfer-columns { grid-template-columns: 1fr; } }

.acp-bedxfer-datetime {
    display: inline-flex; align-items: center; gap: 8px;
    font-size: 12.5px; color: var(--acp-muted);
}
.acp-bedxfer-datetime .acp-bedxfer-dt-label {
    font-family: var(--acp-font-mono);
    font-size: 11px; letter-spacing: 0.04em;
    text-transform: uppercase; font-weight: 600;
    white-space: nowrap;
}
/* Telerik picker inputs — force enough width so MM/dd/yyyy / hh:mm tt fit
   even after the command bar wraps. Without this the flex container squeezes
   the input width and the value renders as "09/04/20…". */
.acp-bedxfer-datetime .k-datepicker { min-width: 200px; width: 200px; flex: 0 0 auto; }
.acp-bedxfer-datetime .k-timepicker  { min-width: 200px; width: 200px; flex: 0 0 auto; }
.acp-bedxfer-datetime .k-datepicker .k-input-inner,
.acp-bedxfer-datetime .k-timepicker .k-input-inner {
    min-width: 0;
    width: 100%;
    text-align: left;
}
.acp-bedxfer-error { margin: 0; }
.acp-bedxfer-info {
    padding: 8px 14px;
    background: var(--acp-primary-soft);
    color: var(--acp-primary);
    border-left: 3px solid var(--acp-primary);
    border-radius: var(--acp-radius);
    font-size: 13px;
}

.acp-bedxfer-picker { display: flex; flex-direction: column; gap: var(--acp-space-3); }
.acp-bedxfer-grid.k-grid { border: 1px solid var(--acp-line) !important; border-radius: var(--acp-radius) !important; }
/* Prevent the browser from breaking words character-by-character in narrow
   Bed Transfer grid cells when the From/To panels sit side-by-side. */
.acp-bedxfer-grid .k-table-td { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.acp-bedxfer-cell { display: inline-block; max-width: 100%; overflow: hidden; text-overflow: ellipsis; vertical-align: middle; }

.acp-bedxfer-roommates {
    padding: var(--acp-space-3) 0 0;
    border-top: 1px dashed var(--acp-line);
}
.acp-bedxfer-roommates-empty {
    font-size: 12.5px; color: var(--acp-muted-2);
    padding: 6px 4px;
}
.acp-bedxfer-roommates-list {
    list-style: none; padding: 0; margin: 6px 0 0;
    display: flex; flex-direction: column; gap: 4px;
    font-size: 12.5px;
}
.acp-bedxfer-roommates-list li {
    padding: 4px 8px;
    background: var(--acp-surface);
    border: 1px solid var(--acp-line);
    border-radius: var(--acp-radius-sm);
}

.acp-bedxfer-detail {
    display: flex; flex-direction: column; gap: var(--acp-space-3);
}
.acp-bedxfer-detail--empty .acp-bedxfer-detail-hdr {
    min-height: 22px;
}
.acp-bedxfer-reason-frame {
    padding: 8px 12px;
    border: 1px solid var(--acp-line);
    border-radius: var(--acp-radius-sm);
    background: var(--acp-surface);
    display: flex; align-items: center; gap: 14px;
    font-size: 13px;
}
.acp-bedxfer-reason-frame legend {
    font-family: var(--acp-font-mono);
    font-size: 11px; letter-spacing: 0.04em;
    text-transform: uppercase; font-weight: 600;
    color: var(--acp-muted);
    padding: 0 6px;
}
.acp-bedxfer-reason-frame label {
    display: inline-flex; align-items: center; gap: 4px;
}
.acp-bedxfer-detail-hdr {
    display: flex; align-items: baseline; gap: var(--acp-space-3);
    padding-bottom: var(--acp-space-2);
    border-bottom: 1px dashed var(--acp-line);
}
.acp-bedxfer-detail-bed {
    font-family: var(--acp-font-mono);
    font-size: 15px; font-weight: 700;
    color: var(--acp-primary);
}
.acp-bedxfer-detail-patient {
    font-size: 13px; color: var(--acp-ink); font-weight: 500;
}
.acp-bedxfer-flags {
    display: flex; flex-direction: column; gap: 8px;
    padding: 8px 0;
}
.acp-bedxfer-reason {
    display: flex; align-items: center; gap: 12px;
    font-size: 13px;
}
.acp-bedxfer-reason label {
    display: inline-flex; align-items: center; gap: 4px;
    color: var(--acp-ink);
}
.acp-bedxfer-staff {
    display: flex; flex-direction: column; gap: 6px;
}
.acp-bedxfer-staff-row {
    display: grid; grid-template-columns: minmax(180px, 240px) 1fr;
    align-items: center; gap: 12px;
    padding: 4px 8px;
    background: var(--acp-surface);
    border: 1px solid var(--acp-line);
    border-radius: var(--acp-radius-sm);
    font-size: 13px;
}
.acp-bedxfer-staff-name {
    color: var(--acp-ink);
    font-weight: 500;
    overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
}

/* AcpCard multi-section pattern — a mono-labelled sub-heading before each block
   of fields, without introducing a nested TelerikCard. Used by Medicare (three
   sections: Medicare / Parts A and B / Part D) and Financial Notes (Add / list). */
.acp-card-section {
    padding-top: var(--acp-space-4);
}
.acp-card-section + .acp-card-section {
    border-top: 1px dashed var(--acp-line);
    margin-top: var(--acp-space-4);
}
.acp-card-section-h {
    font-family: var(--acp-font-mono);
    font-size: 11px; letter-spacing: 0.06em; text-transform: uppercase;
    color: var(--acp-muted); font-weight: 600;
    margin-bottom: var(--acp-space-3);
}

/* Frame11 "Is Facility Fiduciary for Resident?" on the Private Billing sub-tab.
   Legacy dead controls (no DB column) — visual parity only, disabled attribute
   makes the whole fieldset non-interactive. */
.acp-fiduciary-frame {
    margin-top: var(--acp-space-4);
    padding: var(--acp-space-3) var(--acp-space-4);
    border: 1px solid var(--acp-line);
    border-radius: var(--acp-radius);
    background: var(--acp-surface);
    color: var(--acp-muted);
}
.acp-fiduciary-frame legend {
    font-family: var(--acp-font-mono);
    font-size: 12px; letter-spacing: 0.04em; text-transform: uppercase;
    color: var(--acp-muted); font-weight: 600;
    padding: 0 6px;
}
.acp-fiduciary-radios,
.acp-fiduciary-checks,
.acp-fiduciary-other {
    display: flex; flex-wrap: wrap;
    gap: var(--acp-space-3);
    margin-top: var(--acp-space-2);
    font-size: 13px;
}
.acp-fiduciary-radios label,
.acp-fiduciary-checks label {
    display: inline-flex; align-items: center; gap: 6px;
}
.acp-fiduciary-other { align-items: center; gap: 8px; }
.acp-fiduciary-other-input {
    flex: 1; min-width: 240px;
    padding: 4px 8px;
    border: 1px solid var(--acp-line);
    border-radius: var(--acp-radius-sm);
    background: var(--acp-card);
    font-size: 13px;
}
.acp-fiduciary-frame--readonly {
    display: flex; align-items: center; gap: var(--acp-space-3);
    padding: var(--acp-space-2) var(--acp-space-4);
}
.acp-fiduciary-legend {
    font-family: var(--acp-font-mono); font-size: 12px; letter-spacing: 0.04em;
    text-transform: uppercase; color: var(--acp-muted); font-weight: 600;
}
.acp-fiduciary-value { color: var(--acp-muted-2); font-size: 13px; }

/* Resources tab — Frame5 "Display only (set in Admission Record)" sits at the TOP
   of the LEFT column (not full-width), with editable left providers underneath it
   and the right column starting at the same Y with Pharmacy. Matches legacy
   frmPatientMasterResources Tab(3) two-column layout (Left=1065-1245 vs
   Left=6405-7440). Columns must be `align-items: start` so the left column can grow
   past the right's height without stretching. */
.acp-resource-columns {
    display: grid; grid-template-columns: 1fr 1fr;
    align-items: start;
    gap: var(--acp-space-5);
    margin: var(--acp-space-4) 0 var(--acp-space-5);
}
@media (max-width: 900px) { .acp-resource-columns { grid-template-columns: 1fr; } }
.acp-resource-col { display: flex; flex-direction: column; gap: 10px; }

.acp-admission-frame {
    margin: 0 0 var(--acp-space-3);
    padding: 10px 14px;
    background: var(--acp-surface);
    border: 1px solid var(--acp-line);
    border-radius: var(--acp-radius);
    display: flex; flex-direction: column; gap: 8px;
}
.acp-admission-frame legend {
    font-family: var(--acp-font-mono); font-size: 12px; letter-spacing: 0.04em;
    text-transform: uppercase; color: var(--acp-primary); font-weight: 600;
    padding: 0 6px;
}
.acp-admission-value {
    background: var(--acp-card);
    padding: 4px 8px;
    border: 1px solid var(--acp-line);
    border-radius: var(--acp-radius-sm);
    min-height: 26px;
}

/* Label-left / control-right row used by the Resources tab. Legacy places the
   label right-aligned next to a narrower control (matches the .frm's fixed Left
   coordinates for labels vs combos). */
.acp-field.acp-field-inline {
    display: grid;
    grid-template-columns: 10.5rem 1fr;
    align-items: center;
    gap: 10px;
    margin: 0;
}
.acp-field.acp-field-inline > label {
    text-align: right;
    color: var(--acp-ink);
    font-family: var(--acp-font-sans);
    font-size: 13px;
    font-weight: 500;
    text-transform: none;
    letter-spacing: 0;
    margin: 0;
    white-space: nowrap;
}

/* View Burial Information — inline label + horizontal Y/N radios, no fieldset
   frame so it stacks cleanly under Audiologist. */
.acp-burial-toggle-inline {
    margin-top: 6px;
}

/* ---------------------------------------------------------------
 * Global: make every Telerik dropdown popup content-sized.
 *
 * Telerik defaults the popup content area to a fixed 200px (set
 * inline via PopupHeight), so a combo with 0-3 items opens as a
 * mostly-blank rectangle, and one with 50 items scrolls inside
 * the same box. We override the inline height with `auto` and cap
 * the growth with `max-height` instead — so:
 *   - 0 items         → shrinks to the "No data" line (~50px)
 *   - a few items     → sizes exactly to those items
 *   - many items      → scrolls inside 320px
 *
 * !important is required because Telerik sets `height` as an
 * inline style attribute; this rule wins over the inline attr.
 * ------------------------------------------------------------- */
.k-popup.k-list-container .k-list-content,
.k-popup.k-list-container .k-list-scroller {
    height: auto !important;
    min-height: 0 !important;
    max-height: 320px !important;
}
.k-popup.k-list-container {
    min-height: 0 !important;
}

/* Empty state — collapse the popup to just the "No data" line. */
.k-popup:has(.k-nodata),
.k-list-container:has(.k-nodata) {
    min-height: 0 !important;
}
.k-list-content:has(> .k-nodata),
.k-list-scroller:has(> .k-nodata) {
    max-height: 56px !important;
    overflow: hidden !important;
}
.k-nodata,
.k-list .k-nodata {
    padding: 10px 16px !important;
    min-height: 0 !important;
    color: var(--acp-muted-2);
    font-size: 13px;
    text-align: center;
    justify-content: center;
}
.k-nodata h4 {
    margin: 0;
    font-size: 13px; font-weight: 500;
    color: var(--acp-muted-2);
}

/* Facility Management page — stacked layout matching legacy frmFacility.
   Title / tabs / command-bar, top-to-bottom. Field rows inside fieldsets
   preserve the legacy two-column groupings from Frame1/Frame2. */
.acp-facility-page {
    display: flex;
    flex-direction: column;
    gap: 0.6rem;
    padding: 0.75rem 1rem 0.5rem 1rem;
    background: #ffffff;
    min-height: calc(100vh - 60px);
}
.acp-facility-title {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    padding: 0.1rem 0 0.15rem 0;
}
.acp-facility-title h1 {
    margin: 0;
    font-size: 1.15rem;
    color: #333;
    font-weight: 600;
    letter-spacing: 0.01em;
}
.acp-facility-mode-flag {
    color: #b26a00;
    font-size: 0.78rem;
    font-weight: 600;
    padding: 0.15rem 0.5rem;
    background: #fff4e0;
    border: 1px solid #f0d9a8;
    border-radius: 4px;
}
.acp-facility-msg { margin: 0.2rem 0; }
.acp-facility-tabs { min-height: 480px; }
.acp-facility-outer-body {
    padding: 0.75rem 0.75rem 0.5rem 0.75rem;
    display: flex;
    flex-direction: column;
    gap: 0.9rem;
}
.acp-facility-inner-tabs { margin-top: 0.5rem; }
.acp-facility-frame {
    border: 1px solid #eaeef2;
    border-radius: 6px;
    padding: 0.5rem 0.8rem 0.6rem 0.8rem;
    background: #ffffff;
}
.acp-facility-frame > legend {
    padding: 0 0.4rem;
    color: #b34a00;
    font-weight: 600;
    font-size: 0.78rem;
    letter-spacing: 0.02em;
}
.acp-facility-two-col {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 0.6rem 1.75rem;
}
.acp-facility-col { display: flex; flex-direction: column; gap: 0.4rem; }
.acp-facility-row {
    display: flex;
    align-items: center;
    gap: 0.5rem;
}
.acp-facility-row > label {
    min-width: 150px;
    color: #333;
    font-size: 0.82rem;
    font-weight: 500;
}
.acp-facility-inline-label {
    min-width: unset !important;
    padding-left: 0.5rem;
    color: #666 !important;
    font-weight: 400 !important;
}
.acp-facility-row-radio > label { align-self: center; }
.acp-facility-radio-inline { display: flex; align-items: center; }
.acp-facility-tab-placeholder {
    padding: 1.5rem;
    color: #666;
    font-size: 0.85rem;
    text-align: center;
    background: #fafbfd;
    border: 1px dashed #d8dee6;
    border-radius: 6px;
}
.acp-facility-command-bar {
    display: flex;
    gap: 0.5rem;
    justify-content: center;
    padding: 0.55rem 0.6rem;
    background: #fafbfd;
    border-top: 1px solid #eaeef2;
    border-radius: 6px;
    margin-top: 0.4rem;
}
.acp-facility-frame-tight {
    padding: 0.5rem 0.75rem 0.6rem 0.75rem;
}
.acp-facility-checkbox-row {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    font-size: 0.82rem;
    color: #333;
    cursor: pointer;
    padding: 0.2rem 0;
}
.acp-facility-checkbox-row > span { user-select: none; }

/* File and ADT — Select-button row next to a path text box. Legacy Frame12/Frame13
   pair a textbox with a cmdSel* button (icon "Select" caption); web port uses a
   hidden <InputFile> triggered by clicking the styled <label>. */
.acp-facility-select-row {
    display: flex;
    align-items: center;
    gap: 0.5rem;
}
.acp-facility-select-button {
    display: inline-flex;
    align-items: center;
    padding: 0.35rem 0.85rem;
    font-size: 0.82rem;
    font-weight: 500;
    color: #333;
    background: #f8e6c7;
    border: 1px solid #c9a668;
    border-radius: 3px;
    cursor: pointer;
    user-select: none;
    line-height: 1;
}
.acp-facility-select-button:hover { background: #f2d4a1; }

/* Native-radio row inside .acp-quarterly-grid — mixed radio/checkbox 2x4 grid
   for legacy Frame11 "MDS Quarterly Settings...". Same look as a checkbox row. */
.acp-facility-radio-row {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    font-size: 0.82rem;
    color: #333;
    cursor: pointer;
    padding: 0.2rem 0;
}
.acp-facility-radio-row > span { user-select: none; }
.acp-facility-radio-row > input[type="radio"] { margin: 0; }

/* MDS Quarterly Settings inner 2x4 grid — cells fill by row (row-major), so the
   markup order Standard/RUGS/MPAF/Full/Submission/RAPs/Disable/QI lays out as
   legacy: L=Standard,MPAF,Submission,Disable | R=RUGS,Full,RAPs,QI. */
.acp-quarterly-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 0.15rem 1.5rem;
}

/* Facility Resources page (legacy frmFacilityResources) — same shell shape
   as Facility Management: title + tabs + command bar, stacked. */
/* Facility Resources page — uses the shared .acp-codes-* shell. Extras below
   are Resources-only (filter row, 2-column form, inline labels, tab-specific
   heading + placeholder). */
.acp-resources-body {
    padding: 0.75rem 0.75rem 0.5rem 0.75rem;
    display: flex; flex-direction: column; gap: 0.9rem;
}
.acp-resources-filter-row {
    display: flex; gap: 1rem; align-items: flex-end;
    padding: 0.5rem 0.75rem; background: #f7f9fb;
    border: 1px solid #eaeef2; border-radius: 6px;
}
.acp-resources-field { display: flex; flex-direction: column; min-width: 0; }
.acp-resources-field > label {
    color: #555; font-size: 0.78rem; margin-bottom: 0.25rem; font-weight: 500;
    line-height: 1;
}
/* Force every input widget inside the filter row to the same height so the
   ComboBox and RadioGroup baseline together instead of floating at different
   Y positions inside the flex row. */
.acp-resources-filter-row .k-input,
.acp-resources-filter-row .k-picker,
.acp-resources-filter-row .k-combobox { height: 32px; }
.acp-resources-filter-row .k-radio-list { min-height: 32px; align-items: center; }
.acp-resources-two-col { display: grid; grid-template-columns: 1fr 1fr; gap: 0.6rem 1.75rem; }
.acp-resources-col { display: flex; flex-direction: column; gap: 0.4rem; }
.acp-resources-inline-label { min-width: unset !important; padding-left: 0.5rem; color: #666 !important; font-weight: 400 !important; }
/* Frame5 "Filter By Resource Type..." — legacy .frm:255 uses maroon ForeColor
   (&H00800000) on the bordered group box that wraps the type combo + master grid. */
.acp-resources-filter-frame { margin-top: 1rem; }
.acp-resources-filter-frame > legend { color: #7f0000; font-weight: 600; }
/* ChkStatus rides the NPI row per legacy .frm:236. */
.acp-resources-inline-check { margin-left: 0.75rem; }
/* Normalise every form-control height inside a detail row so a ComboBox
   doesn't sit taller than the TextBox next to it and knock the row's
   vertical rhythm off. */
.acp-codes-row .k-combobox .k-input { height: auto; }
/* =========================================================================
   Shared code-catalog page shell — used by ADT Codes, MDS Codes,
   Country Codes, Veteran's Codes, and any future Setup admin page.
   Per memory rule `acp-code-catalog-page-shell`. Any change here flows to
   every catalog page by construction.
   Page-specific extensions still live under their own prefix below.
   ========================================================================= */
.acp-codes-page {
    display: flex; flex-direction: column; gap: 0.6rem;
    padding: 0.75rem 1rem 0.5rem 1rem; background: #ffffff;
    min-height: calc(100vh - 60px);
}
.acp-codes-title { display: flex; align-items: center; gap: 0.75rem; padding: 0.1rem 0 0.15rem 0; }
.acp-codes-title h1 { margin: 0; font-size: 1.15rem; color: #333; font-weight: 600; letter-spacing: 0.01em; }
.acp-codes-mode-flag {
    color: #b26a00; font-size: 0.78rem; font-weight: 600;
    padding: 0.15rem 0.5rem; background: #fff4e0;
    border: 1px solid #f0d9a8; border-radius: 4px;
}
.acp-codes-msg { margin: 0.2rem 0; }
/* Tabs container grows to fill remaining vertical space between the title and
   the command bar, so the grid isn't parked with big empty margins. */
.acp-codes-tabs { flex: 1 1 auto; min-height: 560px; display: flex; flex-direction: column; }
.acp-codes-tabs > .k-tabstrip { flex: 1 1 auto; display: flex; flex-direction: column; }
.acp-codes-tabs > .k-tabstrip > .k-content { flex: 1 1 auto; }
.acp-codes-body {
    padding: 0.75rem 0.75rem 0.5rem 0.75rem;
    display: flex; flex-direction: column; gap: 0.9rem;
    height: 100%;
}
.acp-codes-master { flex: 0 1 auto; }
.acp-codes-frame { flex: 0 1 auto; }
/* Legacy ADT Codes convention (frmADTCodes) puts the detail form on TOP and the
   grid at the BOTTOM on every tab. Pages that follow that convention add this
   modifier alongside .acp-codes-body — the physical markup order (grid then
   form) stays unchanged, but flex-direction reverses the visual order. */
.acp-codes-body-form-first { flex-direction: column-reverse; }
/* Fieldset legend style shared by every catalog / form page that uses
   .acp-codes-frame as a group box (Billing Cycle uses it for the 6
   Frame legends from frmBilling.frm). */
.acp-codes-frame > legend {
    padding: 0 0.4rem; color: #b34a00;
    font-weight: 600; font-size: 0.78rem; letter-spacing: 0.02em;
}
/* Billing Cycle page — small gap between sibling fieldsets in the grid. */
.acp-billing-fs { margin: 0.25rem 0; }
.acp-codes-master { border: 1px solid #eaeef2; border-radius: 6px; background: #ffffff; padding: 0.4rem 0.6rem 0.5rem 0.6rem; }
.acp-codes-frame { border: 1px solid #eaeef2; border-radius: 6px; padding: 0.5rem 0.8rem 0.6rem 0.8rem; background: #ffffff; }
.acp-codes-row { display: flex; align-items: center; gap: 0.5rem; padding: 0.15rem 0; }
.acp-codes-row > label { min-width: 150px; color: #333; font-size: 0.82rem; font-weight: 500; }
.acp-codes-row .k-input,
.acp-codes-row .k-picker,
.acp-codes-row .k-combobox,
.acp-codes-row .k-numerictextbox { height: 32px; }
.acp-codes-checkbox-row {
    display: flex; align-items: center; gap: 0.5rem;
    font-size: 0.82rem; color: #333; cursor: pointer; padding: 0.2rem 0;
}
.acp-codes-checkbox-row > span { user-select: none; }
.acp-codes-command-bar {
    display: flex; gap: 0.5rem; justify-content: center; align-items: center;
    padding: 0.55rem 0.6rem; background: #fafbfd;
    border-top: 1px solid #eaeef2; border-radius: 6px; margin-top: 0.4rem;
}
.acp-codes-cmd-sep {
    width: 1px; height: 22px; background: #d8dee6; margin: 0 0.4rem;
}

/* Cash/Check Processing — legacy frmCashDrawer. Patient list on the left, transaction form on
   the right. */
.acp-cash-drawer-page {
    padding: 0.5rem 1rem;
    display: flex; flex-direction: column;
    height: calc(100vh - 100px);
}
.acp-cash-drawer-split {
    display: grid; grid-template-columns: 320px 1fr; gap: 0.75rem;
    flex: 1 1 auto; min-height: 0;
}
.acp-cash-drawer-patients {
    display: flex; flex-direction: column; gap: 0.4rem;
    border: 1px solid #eaeef2; border-radius: 6px; background: #fff;
    padding: 0.5rem;
}
.acp-cash-drawer-panel-title {
    font-size: 0.85rem; font-weight: 700; color: #b34a00;
    padding: 0 0.2rem 0.3rem;
    border-bottom: 1px solid #eaeef2;
}
.acp-cash-drawer-patient-list {
    overflow-y: auto; flex: 1 1 auto;
}
.acp-cash-drawer-patient {
    display: flex; flex-direction: column; gap: 0.15rem;
    padding: 0.35rem 0.5rem;
    border-bottom: 1px solid #f0f2f5;
    cursor: pointer;
    font-size: 0.85rem;
}
.acp-cash-drawer-patient:hover { background: #f8fafc; }
.acp-cash-drawer-patient.selected { background: #e0f2fe; }
.acp-cash-drawer-patient-name { font-weight: 500; color: #1e293b; }
.acp-cash-drawer-patient-meta { font-size: 0.75rem; color: #64748b; }

.acp-cash-drawer-form {
    overflow-y: auto;
    border: 1px solid #eaeef2; border-radius: 6px; background: #fff;
    padding: 0.75rem 1rem;
}
.acp-cash-drawer-total {
    display: flex; justify-content: flex-end; align-items: baseline;
    gap: 0.5rem;
    padding: 0.4rem 0.25rem 0.1rem 0;
    font-size: 0.9rem;
}
.acp-cash-drawer-total-label { color: #475569; font-weight: 600; }
.acp-cash-drawer-total-value {
    font-weight: 700; color: #1e293b;
    min-width: 110px; text-align: right;
    padding: 0.15rem 0.4rem;
    background: #f1f5f9; border-radius: 3px;
}
.acp-cash-drawer-header {
    display: flex; justify-content: space-between; align-items: center;
    padding: 0.3rem 0.2rem 0.6rem;
    border-bottom: 1px solid #eaeef2;
    margin-bottom: 0.5rem;
}
.acp-cash-drawer-meta { color: #64748b; margin-left: 0.5rem; font-size: 0.85rem; }
.acp-cash-drawer-balance {
    font-size: 0.95rem; font-weight: 700; color: #0f172a;
}
.acp-cash-drawer-cmd { justify-content: flex-end; gap: 0.5rem; margin-top: 0.5rem; }
.acp-cash-drawer-note {
    font-size: 0.78rem; color: #b45309; font-style: italic; margin-left: 0.5rem;
}
.acp-cash-drawer-invoice-select {
    min-width: 380px; padding: 0.3rem;
    border: 1px solid #cbd5e1; border-radius: 4px;
    font-size: 0.85rem;
}

/* Automatic Remittances — legacy frmCashAuto. Centered narrow form with a bank-type radio at
   the top, then labeled rows, then OK / Cancel. */
.acp-remit-auto-page {
    display: flex; flex-direction: column;
    padding: 0.5rem 1rem;
}
.acp-remit-auto-body {
    background: #ffffff;
    border: 1px solid #eaeef2;
    border-radius: 6px;
    padding: 0.75rem 1rem 1rem 1rem;
    max-width: 1100px;
}
.acp-remit-auto-bank {
    display: flex; gap: 1.5rem; justify-content: center;
    padding: 0.35rem 0 0.6rem;
    border-bottom: 1px solid #eaeef2;
    margin-bottom: 0.6rem;
}
.acp-remit-auto-radio {
    display: inline-flex; align-items: center; gap: 0.3rem;
    font-size: 0.9rem; cursor: pointer;
}
.acp-remit-auto-checkbox {
    display: inline-flex; align-items: center; gap: 0.3rem;
    font-size: 0.82rem; color: #333; cursor: pointer;
    margin-left: 0.25rem;
}
.acp-remit-auto-inline {
    font-size: 0.82rem; color: #64748b;
    margin: 0 0.3rem 0 0.6rem;
    min-width: unset !important;
}
.acp-remit-auto-desc-row { flex-wrap: wrap; }
.acp-remit-auto-buttons {
    display: flex; gap: 0.5rem; justify-content: center;
    padding-top: 0.75rem;
    border-top: 1px solid #eaeef2;
    margin-top: 0.5rem;
}

/* Cash Batch Posting — legacy frmCashPosting ("Update"). Grid fills, Post It + Cancel on the
   right of the command bar. */
.acp-cash-post-grid { flex: 1 1 auto; min-height: 400px; margin-bottom: 0.5rem; }
.acp-cash-post-cmd { justify-content: flex-end; gap: 0.5rem; }

/* Cash Receipts Batch Selection — legacy frmBatchMain. Grid fills, Delete on the left of the
   command bar, Select + Close on the right (legacy button layout). */
.acp-cash-receipts-grid { flex: 1 1 auto; min-height: 400px; margin-bottom: 0.5rem; }
.acp-cash-receipts-cmd { justify-content: flex-start; gap: 0.5rem; }
.acp-cash-receipts-cmd > .acp-codes-cmd-sep { margin-left: auto; }

/* Batch Reverse — legacy frmBatchReverse: category radios above the grid, "Unpost Batch" /
   "Close" beneath. The radios sit in one horizontal row (matches Frame2 layout .frm:99-156). */
.acp-batch-reverse-category {
    display: flex; flex-wrap: wrap; gap: 1rem;
    padding: 0.5rem 0.75rem;
    margin: 0.4rem 0;
    border: 1px solid #cbd5e1; border-radius: 4px;
    background: #ffffff;
}
.acp-batch-reverse-radio {
    display: inline-flex; align-items: center; gap: 0.3rem;
    font-size: 0.85rem;
    cursor: pointer;
    color: #333;
}
.acp-batch-reverse-radio input[disabled] { cursor: not-allowed; }
/* Grid wrapper fills the vertical gap between the category row and the command bar so the
   Telerik grid (Height="100%") stretches instead of leaving dead space below. The wrapper
   is itself a flex column with min-height:0 so the grid's 100% resolves to the real
   remaining pixels, not the content height. */
.acp-batch-reverse-grid {
    flex: 1 1 auto;
    min-height: 0;
    display: flex;
    flex-direction: column;
    margin-bottom: 0.5rem;
}
.acp-batch-reverse-grid > .k-grid { flex: 1 1 auto; min-height: 0; }
/* Lock the page to exactly the viewport minus the top chrome so flex:1 children have a
   concrete height to divide. min-height alone lets content grow the page, which prevents
   the inner grid from ever filling the gap. */
.acp-codes-page.acp-batch-reverse-page {
    height: calc(100vh - 60px);
    min-height: 0;
    overflow: hidden;
}

/* Therapy Tracking Setup — legacy Frame2 "Therapy Type..." with 3 stacked radios
   (Occupational / Physical / Speech). Legend loses the trailing "..." per the
   legend-no-ellipsis rule. */
.acp-tht-therapy-type-frame {
    margin-top: 0.6rem;
    max-width: 320px;
}
.acp-tht-radio {
    display: flex; align-items: center; gap: 0.4rem;
    font-size: 0.85rem; color: #333;
    padding: 0.2rem 0;
    cursor: pointer;
}
.acp-tht-radio input[disabled] { cursor: not-allowed; }

/* Income G/L extensions — left-aligned key combos, a single row of five G/L
   numbers with a bold caption above each, and the grid lock applied while
   adding or editing. */
.acp-income-gl-codes-form { display: flex; flex-direction: column; align-items: flex-start; }
.acp-income-gl-codes-form > .acp-codes-row > label { min-width: 190px; }
.acp-income-gl-codes-gl-row {
    display: flex; flex-wrap: wrap; justify-content: flex-start;
    gap: 0.5rem 1rem; padding: 0.6rem 0 0.15rem 0;
}
.acp-income-gl-codes-gl-field { display: flex; flex-direction: column; align-items: center; gap: 0.2rem; }
.acp-income-gl-codes-gl-field > label { color: #333; font-size: 0.82rem; font-weight: 700; text-align: center; }
.acp-income-gl-codes-gl-field .k-input { height: 32px; }
.acp-income-gl-codes-grid-locked { pointer-events: none; opacity: 0.6; }

/* Adjustment Codes — Code + D/C radios on one row, FC/GL/Description stacked below. */
.acp-adjust-codes-form { display: flex; flex-direction: column; align-items: flex-start; }
.acp-adjust-codes-form > .acp-codes-row > label { min-width: 160px; }
.acp-adjust-codes-dorc { display: inline-flex; gap: 1.5rem; padding-left: 1.5rem; }
.acp-adjust-codes-radio { display: inline-flex; align-items: center; gap: 0.35rem; font-size: 0.9rem; color: #334155; }
.acp-adjust-codes-grid-locked { pointer-events: none; opacity: 0.6; }

/* Adjustment Posting — command row with "Change Posting Date To" checkbox + date picker. */
.acp-adjust-post-cmd { justify-content: flex-end; gap: 0.75rem; }
.acp-adjust-post-override { display: inline-flex; align-items: center; gap: 0.5rem; color: #334155; font-size: 0.9rem; }

/* Adjustment Entries — frmAdjustResidentLedger. Two-column layout: shared resident rail on
   the left, editor + grid stack on the right. Mirrors the legacy frame layout from the .frm. */
.acp-adjust-entries-page .acp-adjust-entries-grid-layout { display: grid; grid-template-columns: 380px 1fr; gap: 1rem; height: calc(100vh - 180px); }
.acp-adjust-entries-rail { min-width: 0; min-height: 0; display: flex; flex-direction: column; }
.acp-adjust-entries-main { min-width: 0; overflow: auto; }
.acp-adjust-sort-radios,
.acp-adjust-status-radios,
.acp-adjust-mode-radios,
.acp-adjust-paid-radios,
.acp-adjust-dc-radios { display: inline-flex; gap: 1rem; margin: 0.25rem 0 0.5rem 0; font-size: 0.9rem; color: #334155; }
.acp-adjust-sort-radios label,
.acp-adjust-status-radios label,
.acp-adjust-mode-radios label,
.acp-adjust-paid-radios label,
.acp-adjust-dc-radios label { display: inline-flex; align-items: center; gap: 0.35rem; }
.acp-adjust-resident-list { max-height: 440px; overflow: auto; border: 1px solid #e5e7eb; border-radius: 6px; }
.acp-adjust-resident-row { padding: 0.2rem 0.5rem; cursor: pointer; }
.acp-adjust-resident-row.is-selected { background: #e0f2fe; }
.acp-adjust-batch-row,
.acp-adjust-codes-row,
.acp-adjust-entry-row { display: flex; flex-wrap: wrap; gap: 1.25rem; align-items: flex-end; margin: 0.25rem 0 0.5rem 0; }
.acp-adjust-field { display: flex; flex-direction: column; gap: 0.25rem; min-width: 0; }
.acp-adjust-field label { font-size: 0.85rem; color: #475569; }
.acp-adjust-readout { font-weight: 500; min-height: 1.5em; padding: 0.1rem 0.25rem; border-bottom: 1px dotted #cbd5e1; }
.acp-adjust-field-grow { flex: 1 1 320px; }
.acp-adjust-search { padding: 0.5rem 0.75rem; }
.acp-fieldset-inner { border: 1px solid #e5e7eb; border-radius: 6px; padding: 0.25rem 0.5rem; margin: 0.25rem 0; }
.acp-adjust-specific-row { display: inline-flex; align-items: center; gap: 0.5rem; margin: 0.25rem 0; }
.acp-adjust-refcombo { margin-top: 0.25rem; }
.acp-adjust-readouts { display: flex; flex-wrap: wrap; gap: 1.25rem; margin-top: 0.25rem; }
.acp-adjust-entry { padding: 0.5rem 0.75rem; }
.acp-adjust-entries-grid { margin-top: 0.75rem; }
.acp-adjust-cmd { justify-content: flex-end; gap: 0.5rem; margin-top: 0.75rem; }

/* New Adjustment Batch — single-column form. */
.acp-adjust-newbatch-form { display: flex; flex-direction: column; gap: 0.75rem; max-width: 640px; }
.acp-adjust-type-radios { display: inline-flex; gap: 1.5rem; font-size: 0.9rem; color: #334155; }
.acp-adjust-type-radios label { display: inline-flex; align-items: center; gap: 0.35rem; }
.acp-adjust-newbatch-cmd { justify-content: flex-end; gap: 0.5rem; }

/* Cash Receipts Batch Entry (frmBatchProcessing / class frmCashBatchProcessing). Phase C.1
   shell: top banner, two-column body (resident rail + editor), entries grid below, command bar
   at the bottom. The parent .acp-codes-page is flex-column, so the body stretches to fill. */
.acp-cash-batch-proc { height: calc(100vh - 60px); overflow: hidden; }
.acp-cash-bp-banner {
    background: #f8fafc;
    border: 1px solid #e2e8f0;
    border-radius: 4px;
    padding: 0.5rem 0.75rem;
    font-size: 0.95rem;
}
.acp-cash-bp-banner-dim { color: #64748b; font-size: 0.85rem; margin-left: 0.5rem; }
.acp-cash-bp-body {
    display: grid;
    grid-template-columns: 280px 1fr;
    grid-template-rows: 1fr;
    gap: 0.75rem;
    flex: 1 1 auto;
    min-height: 0;
    overflow: hidden;
}
.acp-cash-bp-body > aside,
.acp-cash-bp-body > .acp-cash-bp-right-col { height: 100%; min-height: 0; }
.acp-cash-bp-right-col {
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
    min-height: 0;
    min-width: 0;
}
.acp-cash-bp-right-col > .acp-cash-bp-editor { flex: 1 1 auto; min-height: 0; }
.acp-cash-bp-right-col > .acp-cash-bp-grid-shell { margin-top: 0; }
.acp-cash-bp-rail {
    display: flex;
    flex-direction: column;
    gap: 0.4rem;
    min-height: 0;
    border: 1px solid #e2e8f0;
    background: #fff;
    border-radius: 4px;
    padding: 0.4rem;
}
.acp-cash-bp-filter { border: 1px solid #cbd5e1; border-radius: 3px; padding: 0.3rem 0.5rem; margin: 0; }
.acp-cash-bp-filter > legend { font-size: 0.78rem; color: #7c2d12; font-weight: 700; padding: 0 0.3rem; }
.acp-cash-bp-filter-row { display: flex; gap: 0.75rem; font-size: 0.85rem; margin-bottom: 0.3rem; }
.acp-cash-bp-filter-row label { display: inline-flex; align-items: center; gap: 0.25rem; }
.acp-cash-bp-rail-list {
    flex: 1 1 auto;
    min-height: 0;
    overflow-y: auto;
    border: 1px solid #e2e8f0;
    border-radius: 3px;
    background: #fff;
}
.acp-cash-bp-rail-item {
    padding: 0.3rem 0.5rem;
    font-size: 0.85rem;
    cursor: pointer;
    border-bottom: 1px solid #f1f5f9;
}
.acp-cash-bp-rail-item:hover { background: #f8fafc; }
.acp-cash-bp-rail-item.is-selected { background: #dbeafe; }
.acp-cash-bp-editor {
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
    min-height: 0;
    overflow-y: auto;
    border: 1px solid #e2e8f0;
    background: #fff;
    border-radius: 4px;
    padding: 0.5rem 0.75rem;
}
.acp-cash-bp-head-row {
    display: flex; flex-wrap: wrap; gap: 0.75rem;
    align-items: flex-end;
    justify-content: flex-start;
}
.acp-cash-bp-field {
    display: flex; flex-direction: column; gap: 0.2rem;
    min-width: 0;
    flex: 0 0 auto;
}
.acp-cash-bp-field > label { font-size: 0.8rem; color: #475569; font-weight: 600; white-space: nowrap; }
.acp-cash-bp-field-grow { flex: 1 1 240px; }
.acp-cash-bp-select {
    padding: 0.3rem 0.5rem;
    border: 1px solid #cbd5e1;
    border-radius: 3px;
    background: #fff;
    font-size: 0.9rem;
    width: 200px;
    max-width: 100%;
    box-sizing: border-box;
}
/* Keep select controls that are inside the grow-field (Description-adjacent) at a sensible
   max; the field grows but the select itself stays legible. */
.acp-cash-bp-field-grow .acp-cash-bp-select { width: 100%; }

.acp-cash-bp-searchby {
    border: 1px solid #cbd5e1;
    border-radius: 3px;
    padding: 0.35rem 0.6rem 0.5rem 0.6rem;
    margin: 0.4rem 0;
    display: block;
}
.acp-cash-bp-searchby > legend {
    font-size: 0.78rem; color: #7c2d12; font-weight: 700;
    padding: 0 0.3rem;
}
.acp-cash-bp-searchby label { display: inline-flex; align-items: center; gap: 0.25rem; font-size: 0.85rem; white-space: nowrap; }
.acp-cash-bp-searchby > .acp-cash-bp-radios {
    display: inline-flex;
    margin-right: 1.5rem;
    vertical-align: middle;
}
.acp-cash-bp-bill {
    display: flex;
    flex-wrap: wrap;
    gap: 0.75rem;
    align-items: flex-end;
    padding: 0.5rem 0.25rem;
}
.acp-cash-bp-billinfo {
    background: #f1f5f9;
    border-radius: 4px;
    padding: 0.5rem 0.75rem;
}
.acp-cash-bp-searchrow { align-items: flex-end; }
.acp-cash-bp-radios { display: inline-flex; gap: 0.75rem; font-size: 0.85rem; color: #334155; flex-wrap: nowrap; }
.acp-cash-bp-radios label { display: inline-flex; align-items: center; gap: 0.25rem; white-space: nowrap; }
.acp-cash-bp-check {
    display: inline-flex; align-items: center; gap: 0.3rem;
    font-size: 0.85rem; color: #334155;
    margin-left: 1rem;
}
.acp-cash-bp-bill-foot { margin-left: auto; }
.acp-cash-bp-grid-shell {
    flex: 0 0 auto;
    min-height: 140px;
    max-height: 220px;
    display: flex;
    flex-direction: column;
    margin-top: 0.5rem;
    border: 1px solid #e2e8f0;
    background: #fff;
    border-radius: 4px;
}
.acp-cash-bp-grid-shell > .k-grid { flex: 1 1 auto; min-height: 0; }
.acp-cash-bp-grid-shell .k-grid-content { max-height: 180px; }
.acp-cash-bp-cmd { justify-content: flex-end; gap: 0.4rem; }

/* Phase C.13 — Bill / Bill Clearance TabStrip panel. The strip itself gets
   a quiet background so the content hugs the top strip above it. */
.acp-cash-bp-tabs { margin-top: 0.5rem; }
.acp-cash-bp-tabs .k-content { padding: 0.6rem 0.5rem; }

/* Bill tab's bill-info panel — Description | Amount | Billed | Balance in
   one row, Description grows. Matches legacy Bill tab (screenshot 2). */
.acp-cash-bp-bill-panel {
    display: flex; flex-wrap: wrap; gap: 0.75rem; align-items: flex-end;
    margin-top: 0.5rem;
    border: 1px solid #cbd5e1; border-radius: 3px;
    padding: 0.5rem 0.75rem;
    background: #f8fafc;
}

/* Phase D.2 — Release/Suspense per-row failure block. Stacks the legacy multi-line MsgBox
   messages below the grid. */
.acp-release-susp-failures { margin-top: 0.5rem; white-space: pre-wrap; }
.acp-release-susp-failures > div { line-height: 1.4; }

/* New Cash Batch (frmCashNewBatch) — mirrors the Adjust dialog layout. One column of stacked
   label+control rows, radio pair for Cash Receipt / General Receipt. */
.acp-cash-newbatch-form { display: flex; flex-direction: column; gap: 0.75rem; max-width: 640px; }
.acp-cash-newbatch-field { display: flex; flex-direction: column; gap: 0.25rem; min-width: 0; }
.acp-cash-newbatch-field > label { font-size: 0.85rem; color: #475569; }
.acp-cash-newbatch-field-grow { flex: 1 1 320px; }
.acp-cash-newbatch-type { flex-direction: row; align-items: center; gap: 1.5rem; }
.acp-cash-newbatch-radio { display: inline-flex; align-items: center; gap: 0.35rem; font-size: 0.9rem; color: #334155; }
.acp-cash-newbatch-cmd { justify-content: flex-end; gap: 0.5rem; }

/* NAMI view-only — header read-outs + paired-row grid. */
.acp-adjust-nami-header { display: flex; flex-wrap: wrap; gap: 1.25rem; margin: 0.25rem 0 0.5rem 0; }

/* Resident Funds Posting — purple footnote matches legacy ForeColor Reddish-purple. */
.acp-rfund-posting-note { color: #8e2b7f; font-size: 0.85rem; margin: 0.5rem 0; }

/* Check Register — Write Checks tab divider + yellow highlight for already-written rows. */
.acp-check-reg-written { background: #fef9c3; padding: 0 0.25rem; border-radius: 3px; }

/* Resident Funds / Vendor Codes — compact form rows above the grid. */
.acp-rfund-codes-form { display: flex; flex-direction: column; gap: 0.5rem; padding: 0.5rem; }
.acp-rfund-codes-row { display: flex; flex-wrap: wrap; gap: 1rem; align-items: flex-end; }
.acp-rfund-type-hint { font-size: 0.8rem; color: #475569; margin-left: 0.5rem; }

/* PeopleSoft Submission — file path row + date-range filter inline. */
.acp-ps-path-row { display: flex; gap: 0.5rem; align-items: center; }
.acp-ps-filter { padding: 0.5rem 0.75rem; }
.acp-ps-filter-row { display: flex; flex-wrap: wrap; gap: 1rem; align-items: flex-end; }
.acp-ps-radios { display: inline-flex; gap: 1rem; font-size: 0.9rem; color: #334155; }
.acp-ps-radios label { display: inline-flex; align-items: center; gap: 0.35rem; }

/* Resident Ledger picker — shared AcpResidentList on the left, action buttons on the right. */
.acp-adjust-ledger-layout { display: grid; grid-template-columns: 380px 1fr; gap: 1rem; height: calc(100vh - 180px); }
.acp-adjust-ledger-rail { min-height: 0; }
.acp-adjust-ledger-side { display: flex; flex-direction: column; gap: 1rem; padding: 1rem; }

/* ADT Codes extensions — 2-column form, tight fieldset legends, inner tabs. */
.acp-adt-codes-frame-tight { border: 1px solid #eaeef2; border-radius: 6px; padding: 0.5rem 0.75rem 0.6rem 0.75rem; background: #ffffff; margin: 0.25rem 0; }
.acp-adt-codes-frame-tight > legend { padding: 0 0.4rem; color: #b34a00; font-weight: 600; font-size: 0.78rem; letter-spacing: 0.02em; }
.acp-adt-codes-two-col { display: grid; grid-template-columns: 1fr 1fr; gap: 0.6rem 1.5rem; }
.acp-adt-codes-three-col { display: grid; grid-template-columns: 1fr 1fr 1fr; gap: 0.6rem 1rem; }
/* Ancillaries band — narrow left (Top Modalities single input) + wide right (Caps
   sub-frame with both cap inputs on one row). Avoids the 50/50 gutter dead space
   that .acp-adt-codes-two-col gives when the left cell has only one small field. */
.acp-adt-codes-ancillaries-row {
    display: grid;
    grid-template-columns: auto 1fr;
    gap: 0.6rem 1.5rem;
    align-items: start;
}

/* Legacy Type / Submission Medium (frmADTCodes) render radios as a compact matrix
   — 3-4 columns wide rather than one tall stack. Wrap the TelerikRadioGroup in this
   modifier fieldset and its .k-radio-list items lay out in CSS columns. Balanced
   heights via column-fill:balance. Column-count fills COLUMN-MAJOR (top-to-bottom
   then left-to-right) — use this only when the source order groups items by column. */
.acp-adt-codes-frame-matrix .k-radio-list {
    display: block !important;
    column-count: 3;
    column-gap: 1rem;
    column-fill: balance;
}
.acp-adt-codes-frame-matrix .k-radio-item,
.acp-adt-codes-frame-matrix .k-radio-list-item {
    break-inside: avoid;
    display: flex;
    align-items: center;
    gap: 0.4rem;
    padding: 0.1rem 0;
}
.acp-adt-codes-frame-matrix-4 .k-radio-list { column-count: 4; }

/* Row-major variant — legacy Type / Submission Medium fill left-to-right first
   (item 1 in row 1 col 1, item 2 in row 1 col 2, etc.). CSS grid with auto-flow:row
   places items in caption order. Default 4 columns; the -5 modifier gives 5. */
.acp-adt-codes-frame-matrix-row .k-radio-list {
    display: grid !important;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    grid-auto-flow: row;
    column-gap: 1rem;
    row-gap: 0.15rem;
}
.acp-adt-codes-frame-matrix-row.acp-adt-codes-frame-matrix-5 .k-radio-list {
    grid-template-columns: repeat(5, minmax(0, 1fr));
}
.acp-adt-codes-frame-matrix-row .k-radio-item,
.acp-adt-codes-frame-matrix-row .k-radio-list-item {
    display: flex;
    align-items: center;
    gap: 0.4rem;
    padding: 0.1rem 0;
}
.acp-adt-codes-col { display: flex; flex-direction: column; gap: 0.4rem; }
.acp-adt-codes-inline-label { min-width: unset !important; padding-left: 0.5rem; color: #666 !important; font-weight: 400 !important; }

/* Native listbox for Bed Inventory Type / Special Type — legacy uses VB6 ListBox
   (multi-item scrollable list with highlighted selection), not a dropdown. */
.acp-adt-codes-listbox {
    min-width: 180px;
    padding: 2px;
    font-size: 0.82rem;
    color: #333;
    background: #fff;
    border: 1px solid #b8bec5;
    border-radius: 3px;
    font-family: inherit;
}
.acp-adt-codes-listbox:focus-visible { outline: 1px solid #0078d4; outline-offset: -1px; }
.acp-adt-codes-listbox:disabled { background: #f2f2f2; color: #666; cursor: not-allowed; }
.acp-adt-codes-listbox option { padding: 2px 4px; }
.acp-adt-codes-listbox option:checked { background: #316ac5; color: #fff; }
.acp-adt-codes-hint { color: #888; font-size: 0.75rem; }
.acp-adt-codes-note {
    padding: 0.35rem 0.5rem; margin-top: 0.4rem;
    background: #fff8e1; border: 1px solid #f0d9a8; border-radius: 4px;
    color: #663c00; font-size: 0.75rem; line-height: 1.4;
}
.acp-adt-codes-inner-tabs { margin-top: 0.5rem; }
.acp-adt-codes-inner-body { padding: 0.5rem 0.25rem; }
.acp-adt-codes-tab-placeholder {
    padding: 1.5rem; color: #666; font-size: 0.85rem; text-align: center;
    background: #fafbfd; border: 1px dashed #d8dee6; border-radius: 6px;
    margin: 0.75rem;
}

/* Veteran's Codes extension — type-picker radio group container mimics a legacy Frame. */
.acp-veteran-codes-type-frame {
    border: 1px solid #eaeef2; border-radius: 6px;
    padding: 0.4rem 0.75rem 0.5rem 0.75rem; background: #ffffff;
}
.acp-veteran-codes-type-frame > legend {
    padding: 0 0.4rem; color: #b34a00;
    font-weight: 600; font-size: 0.78rem; letter-spacing: 0.02em;
}

.acp-resources-codes-heading {
    text-align: center; color: #b34a00; font-weight: 700;
    font-size: 1.1rem; margin: 0.25rem 0 0.5rem 0; letter-spacing: 0.01em;
}
.acp-resources-tab-placeholder {
    padding: 1.5rem; color: #666; font-size: 0.85rem; text-align: center;
    background: #fafbfd; border: 1px dashed #d8dee6; border-radius: 6px;
}
.acp-resources-command-bar {
    display: flex; gap: 0.5rem; justify-content: center;
    padding: 0.55rem 0.6rem; background: #fafbfd;
    border-top: 1px solid #eaeef2; border-radius: 6px; margin-top: 0.4rem;
}
.acp-facility-poa-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 0.2rem 1rem;
}
.acp-facility-billing-factor-row {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    margin-top: 0.5rem;
}
.acp-facility-billing-factor-row > label {
    min-width: 90px;
    color: #333;
    font-size: 0.82rem;
    font-weight: 500;
}
.acp-facility-hint {
    color: #888;
    font-size: 0.75rem;
    font-style: italic;
}
.acp-facility-three-col {
    display: grid;
    grid-template-columns: 1fr 1fr 1fr;
    gap: 0.6rem;
}
.acp-facility-innermost-tabs { margin-top: 0.5rem; }

/* frmVeteranCodes picker — matches legacy VB6 "Veteran's Codes" modal: heading + single-line
   grid rows. Row-click picks + closes, no explicit Select button (Telerik grid click is
   direct; legacy needed a Select button only because VB6 grids couldn't do click-to-pick). */
.acp-vet-picker { display: flex; flex-direction: column; gap: 8px; padding: 4px; }
.acp-vet-picker-heading {
    text-align: center;
    font-weight: 700;
    font-size: 0.95rem;
    letter-spacing: 0.05em;
    color: var(--acp-fg, #222);
    padding: 4px 0 6px;
    border-bottom: 1px solid var(--acp-line, #ddd);
}
/* Force single-line rows. Telerik's default td styling allows wrap; override at the cell +
   inner content level with high specificity so the Kendo theme cannot beat us. */
.acp-vet-picker-grid .k-table-td,
.acp-vet-picker-grid .k-grid-table td,
.acp-vet-picker-grid td {
    white-space: nowrap !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
}

/* State Resident / TAR Id panel — legacy frmADT FrTar (frame at frmADT.frm:655). Two-row
   editor (dates on top, TAR Id + Insert/Save/Delete buttons on bottom) sitting above the row
   grid, matching the VB6 layout. */
.acp-tar-panel { display: flex; flex-direction: column; gap: 0.6rem; }
.acp-tar-editor {
    display: flex; flex-wrap: wrap; align-items: end; gap: 0.75rem;
    padding: 0.4rem 0.6rem;
    background: var(--acp-elev-1, #fafafa);
    border: 1px solid var(--acp-line, #e4e4e4);
    border-radius: var(--acp-radius-md, 4px);
}
.acp-tar-editor .acp-field { min-width: 0; margin: 0; }
.acp-tar-editor-date, .acp-tar-editor-id { display: flex; flex-direction: column; gap: 0.2rem; }
.acp-tar-editor-actions { display: flex; gap: 0.35rem; margin-left: auto; }
.acp-tar-grid .k-table-td {
    white-space: nowrap !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
}

/* ADT Diagnosis tab — 9 slots + Primary/Admit radios + ? picker button. Grid columns:
   #, ICD9 (code), Description, Primary, Admit, Actions. */
.acp-adt-diag-panel { display: flex; flex-direction: column; gap: 0.35rem; }
.acp-adt-diag-head,
.acp-adt-diag-row {
    display: grid;
    grid-template-columns: 2.2rem 6.5rem minmax(0, 1fr) 3.5rem 3.5rem auto;
    align-items: center;
    gap: 0.6rem;
    padding: 0.25rem 0;
}
.acp-adt-diag-head {
    font-weight: 600; font-size: 0.75rem; color: var(--acp-fg, #444);
    border-bottom: 1px solid var(--acp-line, #e2e2e2);
}
.acp-adt-diag-index { color: var(--acp-fg-muted, #666); text-align: center; }
.acp-adt-diag-actions { display: flex; gap: 0.25rem; }
.acp-adt-diag-footer {
    display: flex; justify-content: flex-end; gap: 0.4rem;
    padding-top: 0.5rem; margin-top: 0.5rem;
    border-top: 1px solid var(--acp-line, #e2e2e2);
}

/* Discharge Diagnosis tab — same 5-row look as admit but no Primary/Admit radios; columns:
   #, ICD9 (code), Description, Actions. */
.acp-adt-diag-head--disch,
.acp-adt-diag-row--disch {
    grid-template-columns: 2.2rem 6.5rem minmax(0, 1fr) auto;
}

/* Next of Kin dialog (frmADTNextToKin.frm equivalent). Compact vertical form: three rows plus
   the standard dialog footer. Radios sit side by side per legacy :55-63 + :45-53. */
.acp-nok-body { display: flex; flex-direction: column; gap: 0.75rem; padding: 0.25rem 0.5rem 0.5rem; }
.acp-nok-radios { display: flex; gap: 1rem; align-items: center; }
.acp-nok-radio { display: inline-flex; align-items: center; gap: 0.35rem; font-size: 0.9rem; }

/* Discharge Modify future/past-date confirm prompt — inline banner with Yes/No buttons that
   ports the legacy MsgBox(vbYesNo) UX (.frm:12240 / :12246). */
.acp-adt-disch-prompt { display: flex; align-items: center; gap: 0.5rem; }
.acp-adt-disch-prompt span { flex: 1 1 auto; }

/* ICD9 picker (frmI_ICD9 equivalent) — same single-line grid rule as the Veteran picker. */
.acp-icd-picker { display: flex; flex-direction: column; gap: 8px; padding: 4px; }
.acp-icd-grid .k-table-td {
    white-space: nowrap !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
}

/* Historical-trans banner — sits above the ADT header row when the operator clicked an older
   row in the transactions grid. Reuses .acp-alert-warn tokens; adds a bit of top spacing so it
   reads as a callout rather than as part of the status pill line. */
.acp-adt-historical-banner {
    margin: 0.5rem 0 0.25rem;
    font-size: 0.85rem;
    line-height: 1.35;
}

/* Row-click cheatsheet under the Transactions header. Compact, single line, wraps only when the
   viewport is narrow. Reuses type-badge colors so a row's pill in the grid matches its entry in
   the legend. */
.acp-adt-trans-legend {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 0.35rem;
    padding: 0.35rem 0.75rem;
    font-size: 0.78rem;
    color: var(--pc-text-muted, #6b7280);
    background: var(--pc-surface-muted, #f9fafb);
    border-bottom: 1px solid var(--pc-border, #e5e7eb);
}
.acp-adt-legend-pill {
    display: inline-flex;
    align-items: center;
    padding: 0.05rem 0.4rem;
    border-radius: 4px;
    font-size: 0.72rem;
    font-weight: 600;
    letter-spacing: 0.02em;
    color: #1f2937;
    background: #e5e7eb;
    margin-left: 0.35rem;
}
.acp-adt-legend-a  { background: #dbeafe; color: #1e3a8a; }  /* Admissions blue */
.acp-adt-legend-d  { background: #fee2e2; color: #991b1b; }  /* Discharges red */
.acp-adt-legend-bt { background: #ede9fe; color: #5b21b6; }  /* Bed Transfer violet */
.acp-adt-legend-br { background: #fef3c7; color: #92400e; }  /* Bed Hold amber */
.acp-adt-legend-tc { background: #d1fae5; color: #065f46; }  /* Type Change green */

/* Bed Transfer Display dialog (frmADTBedTransferDisplay.frm equivalent) — vertical stack of the
   seven legacy rows. Row 7 (Phone / Ext.) lays out side-by-side to match legacy. Read-only rows
   render as .acp-readonly-text; editable rows swap to TelerikTextBox inline. */
.acp-bt-display-body {
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
    padding: 0.25rem 0.5rem 0.5rem;
}
.acp-bt-display-body .acp-readonly-text {
    padding: 0.35rem 0.5rem;
    background: var(--pc-surface-muted, #f3f4f6);
    border: 1px solid var(--pc-border, #d1d5db);
    border-radius: 4px;
    color: var(--pc-text, #111827);
    font-weight: 500;
    min-height: 1.9rem;
    display: flex;
    align-items: center;
}
.acp-bt-phone-row {
    display: flex;
    gap: 1rem;
    align-items: flex-start;
}
.acp-bt-phone-cell {
    display: flex;
    flex-direction: column;
    gap: 0.25rem;
}
.acp-bt-dialog-footer {
    display: flex;
    gap: 0.5rem;
    justify-content: flex-end;
    padding: 0.5rem;
    border-top: 1px solid var(--pc-border, #e5e7eb);
}

/* ===== A/R Inquiry (legacy frmARModule) ===== */

/* Header strip — lblFinancial + lblPatient captions on the left, Print Ledger / Go on the right. */
.acp-ar-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 1rem;
    padding: 0.6rem 0.75rem;
    background: #fdf7d5;
    border: 1px solid #e0c96b;
    border-radius: 4px;
    margin-bottom: 0.75rem;
}
.acp-ar-header-labels { display: flex; gap: 2rem; }
.acp-ar-header-tag { color: #5b3d00; font-weight: 600; margin-right: 0.35rem; }
.acp-ar-header-value { color: #003366; }
.acp-ar-header-actions { display: flex; gap: 0.5rem; }

/* Tab strip — thin border under it and body area with a light background matching legacy. */
.acp-ar-tabs { margin-bottom: 0.5rem; }

/* Filter row — centered Search + Display Option. */
.acp-ar-filterrow {
    display: flex;
    justify-content: center;
    align-items: flex-end;
    gap: 2rem;
    padding: 0.75rem 0.5rem;
}
.acp-ar-search { display: flex; align-items: center; gap: 0.5rem; }
.acp-ar-search label { white-space: nowrap; }
.acp-ar-statusframe { margin: 0; padding: 0.3rem 0.75rem; }

/* Two-grid layout — legacy proportions favour the right (resident) grid. */
.acp-ar-grids {
    display: grid;
    grid-template-columns: minmax(240px, 1fr) minmax(0, 2fr);
    gap: 0.5rem;
}
.acp-ar-grid-shell {
    background: #fff;
    border: 1px solid #e0e0e0;
    border-radius: 4px;
    overflow: hidden;
}

/* Footer strip — legacy Label1 + lblDebit/lblCredit/lblBalance + Close button. Legacy positions
   this block on the RIGHT (aligned under the resident grid's Debit/Credit/Balance columns);
   the left half of the footer stays empty. */
.acp-ar-footer {
    display: flex;
    justify-content: flex-end;
    align-items: center;
    gap: 1rem;
    padding: 0.75rem 0.5rem 0.25rem;
    border-top: 1px solid #eee;
    margin-top: 0.5rem;
}
.acp-ar-total {
    display: flex;
    align-items: center;
    gap: 0.5rem;
}
.acp-ar-total-label { font-weight: 600; margin-right: 0.35rem; }
.acp-ar-total input {
    width: 120px;
    padding: 0.25rem 0.4rem;
    text-align: right;
    border: 1px solid #ccc;
    border-radius: 3px;
    background: #fafafa;
    font-family: inherit;
    font-size: 0.95rem;
}

/* Sign convention radio — floats at the very bottom of the page like legacy Frame1 footer. */
.acp-ar-signbar {
    margin-top: 0.75rem;
    padding: 0.5rem 0.5rem;
    border-top: 1px solid #eee;
}

/* ===== A/R Inquiry Financial Accounts drill (Phase 2) ===== */
.acp-ar-drill {
    display: grid;
    grid-template-columns: 1fr 1fr 1fr;
    gap: 0.75rem;
    padding: 0.75rem 0.5rem;
}
.acp-ar-drill-col {
    background: #fff;
    border: 1px solid #e0e0e0;
    border-radius: 4px;
    overflow: hidden;
}
.acp-ar-drill-header {
    padding: 0.4rem 0.6rem;
    background: #f5f5f5;
    font-weight: 600;
    border-bottom: 1px solid #e0e0e0;
}
.acp-ar-drill-scope { font-weight: 400; color: #444; margin-left: 0.35rem; }
/* Legacy Beg. Bal. row (.frm:1557): italicised grey label; Debit/Credit/Difference are blank
   there so only the Label + Balance columns show meaningful text. */
.acp-ar-begbal-row td { color: #555; font-style: italic; background: #fafafa; }

/* ===== Funds Activity report picker (legacy frmResidentFundActivityReportSelection) =====
   Plain-HTML modal — Telerik combo bindings kept dropping the item list, so this shell is a
   scratch-built overlay using native <select>, <input type="date"> and <input type="radio">. */
.acp-fa-backdrop {
    position: fixed; inset: 0;
    background: rgba(0, 0, 0, 0.5);
    display: flex; align-items: center; justify-content: center;
    z-index: 10000;
}
.acp-fa-modal {
    background: #fff;
    border-radius: 6px;
    box-shadow: 0 10px 30px rgba(0, 0, 0, 0.25);
    width: 460px; max-width: calc(100vw - 2rem);
    display: flex; flex-direction: column;
}
.acp-fa-header {
    display: flex; justify-content: space-between; align-items: center;
    padding: 0.6rem 1rem;
    border-bottom: 1px solid #e0e0e0;
}
.acp-fa-title { font-size: 1.05rem; font-weight: 600; }
.acp-fa-close {
    background: none; border: none; font-size: 1.5rem; line-height: 1;
    cursor: pointer; color: #666; padding: 0 0.25rem;
}
.acp-fa-close:hover { color: #000; }
.acp-fa-body { padding: 1rem; }
.acp-fa-fieldset {
    border: 1px solid #d0d0d0;
    border-radius: 4px;
    padding: 0.75rem 1rem;
}
.acp-fa-fieldset legend {
    padding: 0 0.35rem;
    font-weight: 600; color: #333;
}
.acp-fa-radios {
    display: flex; gap: 1.25rem;
    margin-bottom: 0.75rem;
}
.acp-fa-radios label {
    display: inline-flex; align-items: center; gap: 0.35rem;
    font-size: 0.95rem;
}
.acp-fa-row {
    display: flex; gap: 1rem;
    margin-bottom: 0.75rem;
}
.acp-fa-field {
    display: flex; flex-direction: column; gap: 0.25rem;
    flex: 1;
}
.acp-fa-field label { font-weight: 600; color: #444; font-size: 0.9rem; }
.acp-fa-field input[type="date"],
.acp-fa-field select {
    padding: 0.35rem 0.5rem;
    border: 1px solid #b8b8b8;
    border-radius: 3px;
    font-size: 0.95rem;
    background: #fff;
}
.acp-fa-field select:focus,
.acp-fa-field input[type="date"]:focus {
    outline: 2px solid #4a90e2; outline-offset: -1px; border-color: #4a90e2;
}
.acp-fa-loading { color: #666; font-size: 0.85rem; margin-top: 0.25rem; }
.acp-fa-footer {
    display: flex; justify-content: flex-end; gap: 0.5rem;
    padding: 0.75rem 1rem;
    border-top: 1px solid #e0e0e0;
}
.acp-fa-btn {
    padding: 0.4rem 1.2rem;
    border: 1px solid #b8b8b8;
    background: #f5f5f5;
    border-radius: 3px;
    cursor: pointer;
    font-size: 0.95rem;
}
.acp-fa-btn:hover { background: #e8e8e8; }
.acp-fa-btn-primary {
    background: #1e6bd6; color: #fff; border-color: #1e6bd6;
}
.acp-fa-btn-primary:hover { background: #1959b0; border-color: #1959b0; }

/* ===== A/R Inquiry Resident Accounts drill (Phase 3) ===== */
.acp-ar-restb-toolbar {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    padding: 0.5rem 0.5rem 0;
}
.acp-ar-details {
    margin: 0.5rem 0.5rem 0.75rem;
    background: #fff;
    border: 1px solid #e0e0e0;
    border-radius: 4px;
    overflow: hidden;
}

/* ===== A/R Inquiry Aging drill (Phase 4) — legacy Tab(3): dtpDate + cmdGo + nested 3-tab ===== */
.acp-ar-aging {
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
    padding: 0.5rem 0.5rem;
}
.acp-ar-aging-header {
    display: flex;
    align-items: center;
    gap: 0.6rem;
    padding: 0.4rem 0.5rem;
    background: #f7f7f7;
    border: 1px solid #e0e0e0;
    border-radius: 4px;
}
.acp-ar-aging-label {
    font-weight: 600;
    color: #444;
}
.acp-ar-aging-focus {
    margin-left: auto;
    color: #003366;
    font-size: 0.9rem;
}
.acp-ar-aging-focus-empty {
    color: #a04a00;
    font-style: italic;
}
.acp-ar-aging-inner {
    background: #fff;
    border: 1px solid #e0e0e0;
    border-radius: 4px;
}
.acp-ar-aging-grid {
    border: none;
}
.acp-ar-aging-status {
    padding: 0.5rem 0.6rem;
    color: #666;
    font-size: 0.9rem;
}
.acp-ar-aging-status-error {
    color: #a1240a;
    font-weight: 600;
}

/* ===== Release / Suspense (legacy frmSuspenseRebill.frm) =====
   Left rail uses the shared master-pane + list-rail widgets (same as ADT / Residents /
   Veterans — memory/acp-common-widget-rule). Right pane holds the Bill Types fieldset + grid. */
.acp-rs-pane {
    display: flex; flex-direction: column;
    gap: 0.5rem;
    padding: 0.75rem 1rem 1rem;
    height: 100%; overflow-y: auto;
    background: #fff;
}
.acp-rs-title { margin: 0 0 0.25rem; }
.acp-rs-rail-actions {
    display: flex; gap: 0.35rem;
    padding: 0.5rem 0.75rem 0.75rem;
    border-top: 1px solid #e2e8f0;
    background: #f8fafc;
}
.acp-rs-rail-actions > * { flex: 1; }
.acp-rs-billtypes { padding: 0.75rem 1rem 0.9rem; }
.acp-rs-row {
    display: flex; align-items: center; gap: 0.6rem;
    margin-bottom: 0.55rem;
}
.acp-rs-daterow > * + * { margin-left: 0; }
.acp-rs-moderow { gap: 1.5rem; }
.acp-rs-label {
    font-weight: 600; color: #444; font-size: 0.9rem;
    min-width: 96px;
}
.acp-rs-readonly {
    background: #e0e0e0;
    border: 1px solid #b8b8b8;
    padding: 0.25rem 0.6rem;
    min-width: 100px;
    font-weight: 700;
    color: #7f1d1d;
    text-align: center;
    border-radius: 2px;
}
.acp-rs-radio { display: inline-flex; gap: 0.35rem; align-items: center; font-size: 0.95rem; }
.acp-rs-reasons {
    flex: 1;
    padding: 0.35rem 0.5rem;
    border: 1px solid #b8b8b8;
    border-radius: 3px;
    font-size: 0.9rem;
    background: #fff;
}
/* Legacy cmbReasons is a VB.ListBox — a scrollable multi-row list, not a combobox.
   Sit it directly inside the Bill Types fieldset, full width, no label above (.frm:78-85). */
.acp-rs-reasons-list {
    display: block;
    width: 100%;
    margin-bottom: 0.6rem;
    padding: 0.25rem;
    border: 1px solid #b8b8b8;
    border-radius: 3px;
    font-size: 0.9rem;
    background: #fff;
    color: #7f1d1d;
    font-family: monospace;
}
.acp-rs-reasons-list option { padding: 2px 4px; }

/* Inline editors inside the Rebill grid — thin borders, right-align money, native inputs. */
.acp-rs-inline-num {
    width: 90px;
    padding: 1px 4px;
    text-align: right;
    border: 1px solid #cbd5e1;
    border-radius: 2px;
    font-size: 0.85rem;
    font-family: monospace;
}
.acp-rs-inline-reason {
    width: 100%;
    padding: 1px 4px;
    border: 1px solid #cbd5e1;
    border-radius: 2px;
    font-size: 0.8rem;
    background: #fff;
}

/* ===== Bill Submission / Create an EDI File (legacy frmEDIBatches.frm) =====
   Full-width Precinct look. Page fills the pane, form card is centered horizontally and near
   the top of the viewport. */
.acp-bs {
    display: flex; flex-direction: column;
    align-items: center;
    padding: 1.5rem 1rem;
    min-height: calc(100vh - 80px);
}
.acp-bs .acp-page-title { align-self: center; text-align: center; }
.acp-bs-frame {
    display: flex; flex-direction: column;
    gap: 0.75rem;
    width: 100%; max-width: 620px;
    padding: 1.25rem 1.5rem;
    background: #fff;
    border: 1px solid #e2e8f0;
    border-radius: 4px;
}
.acp-bs-row {
    display: flex; align-items: center;
    gap: 0.75rem;
}
.acp-bs-label {
    min-width: 140px;
    font-size: 0.9rem; font-weight: 600; color: var(--acp-ink, #334155);
}
.acp-bs-select {
    flex: 1;
    padding: 0.4rem 0.55rem;
    border: 1px solid #cbd5e1;
    border-radius: 3px;
    font-size: 0.9rem;
    background: #fff;
}
.acp-bs-select:disabled { background: #f1f5f9; color: #94a3b8; }
.acp-bs-operator {
    flex: 1;
    padding: 0.35rem 0.55rem;
    border: 1px solid #cbd5e1;
    border-radius: 3px;
    background: #f8fafc;
    color: #334155;
    font-size: 0.9rem;
}
.acp-bs-status {
    padding: 0.5rem 0.75rem;
    background: #fef9c3;
    border: 1px solid #fde047;
    border-radius: 4px;
    color: #713f12;
    margin: 0.5rem 0;
    font-size: 0.9rem;
    width: 100%; max-width: 620px;
    text-align: center;
}
.acp-bs-alert { width: 100%; max-width: 620px; }

/* Progress bar wrapper — reserves the space so the layout doesn't jump when Submit fires
   (legacy ProgressBar1 sits between Frame2 and the Operator Id row, .frm:176). */
.acp-bs-progress-wrap {
    width: 100%; max-width: 620px;
    padding: 0.25rem 0;
    min-height: 20px;
}
.acp-bs-progress-hidden { visibility: hidden; }
.acp-bs-progress { width: 100%; }
.acp-bs-buttonrow {
    display: flex; gap: 0.5rem;
    justify-content: center;
    margin-top: 1rem;
}
.acp-bs-dialog-body { padding: 0.5rem 0.25rem; }
.acp-rs-buttonrow {
    display: flex; gap: 0.4rem; align-items: center;
    margin-top: 0.35rem;
}
.acp-rs-buttonrow-spacer { flex: 1; }

.acp-rs-grid-wrap {
    background: #fff;
    border: 1px solid #d0d0d0;
    border-radius: 4px;
    overflow: hidden;
}
.acp-rs-grid-title {
    padding: 4px 10px;
    background: #f5f5f5;
    border-bottom: 1px solid #e2e8f0;
    font-weight: 600; color: #444;
    font-size: 0.85rem;
}

/* ===== Therapy Tracking editor (legacy frmBillingTherapy.frm) ===== */
.acp-tt-list-host { flex: 1; overflow-y: auto; padding: 0.25rem; }
.acp-tt-list .k-listview-content { padding: 0; }

.acp-tt-detail {
    display: flex; flex-direction: column;
    gap: 0.75rem;
    padding: 1rem 1.25rem;
    overflow-y: auto;
    height: 100%;
}
.acp-tt-detail .acp-page-title-row {
    display: flex; justify-content: space-between; align-items: center;
    gap: 0.75rem;
}

.acp-tt-banner {
    background: #f8fafc;
    border: 1px solid #e2e8f0;
    border-radius: 4px;
    padding: 0.6rem 0.9rem;
}
.acp-tt-banner-name { font-weight: 700; font-size: 1rem; color: #0f172a; }
.acp-tt-banner-name.acp-tt-banner-placeholder { color: #94a3b8; font-weight: 500; }
.acp-tt-banner-meta { font-size: 0.85rem; color: #475569; margin-top: 0.15rem; }
.acp-tt-banner-batch { margin-left: 0.75rem; color: #64748b; }

.acp-tt-therapy {
    padding: 0.75rem 1rem 0.85rem;
    background: #fff;
}
.acp-tt-therapy > legend { font-weight: 600; color: #1e293b; }

.acp-tt-row {
    display: flex; align-items: center; gap: 0.5rem;
    flex-wrap: wrap;
    margin-bottom: 0.5rem;
}
.acp-tt-row:last-child { margin-bottom: 0; }
.acp-tt-label {
    font-size: 0.85rem; font-weight: 600; color: #334155;
    min-width: 110px;
}
.acp-tt-num  { width: 80px; padding: 0.35rem 0.5rem; border: 1px solid #cbd5e1; border-radius: 3px; font-size: 0.9rem; }
.acp-tt-code { width: 90px; padding: 0.35rem 0.5rem; border: 1px solid #cbd5e1; border-radius: 3px; font-size: 0.9rem; }
.acp-tt-desc { flex: 1; min-width: 200px; padding: 0.35rem 0.5rem; border: 1px solid #cbd5e1; border-radius: 3px; font-size: 0.9rem; }
.acp-tt-readonly { background: #f1f5f9; color: #334155; }

.acp-tt-find-label {
    font-size: 0.78rem; font-weight: 600; color: #475569;
    letter-spacing: 0.01em;
}

.acp-tt-flags { gap: 1.5rem; padding-top: 0.25rem; }
.acp-tt-flag {
    display: inline-flex; align-items: center; gap: 0.35rem;
    font-size: 0.9rem; color: #334155;
}

/* Legacy frmBillingTherapy PVDate2 column: Onset/Start/Last stacked top-to-bottom. */
.acp-tt-dates-col { display: flex; flex-direction: column; gap: 0.35rem; margin-bottom: 0.6rem; }
.acp-tt-date-row { display: flex; align-items: center; gap: 0.5rem; }

/* Legacy Label9 "Visits" / Label10 "Billed" column headers with Current (read-only)
   and To Date (editable) rows. */
.acp-tt-vb-grid {
    display: grid;
    grid-template-columns: 110px 120px 140px;
    gap: 0.3rem 0.5rem;
    align-items: center;
    margin-bottom: 0.6rem;
}
.acp-tt-vb-head { text-align: center; min-width: 0; }

/* Legacy lstNames.Enabled = Not booFlag (.frm:1958) — visually disable the rail
   while editing so dead row-clicks look dead. */
.acp-tt-list-disabled { opacity: 0.55; pointer-events: none; filter: grayscale(0.2); }

.acp-tt-actions {
    display: flex; gap: 0.5rem;
    padding-top: 0.5rem;
    border-top: 1px solid #e2e8f0;
    margin-top: 0.25rem;
}

.acp-empty-state {
    padding: 2rem 1rem;
    color: #64748b;
    text-align: center;
    background: #f8fafc;
    border: 1px dashed #cbd5e1;
    border-radius: 6px;
}

.acp-tt-diag-dialog {
    display: flex; flex-direction: column;
    gap: 0.6rem;
    padding: 0.25rem 0;
}

/* ===== Debt Collection (legacy frmResidentAging.frm) ===== */
/* The page's normal .acp-page-wrap has overflow:auto + padding — override for Debt Collection
   so the tab bodies + grids fill the viewport with no wasted space at the bottom. */
.acp-page-wrap:has(.acp-dc-tabs) {
    height: calc(100vh - 80px) !important;
    padding: 1rem 1.25rem 0 !important;
    display: flex !important;
    flex-direction: column !important;
    overflow: hidden !important;
}
.acp-dc-tabs {
    margin-top: 0.5rem;
    flex: 1 1 auto !important;
    display: flex !important;
    flex-direction: column !important;
    min-height: 0 !important;
}
/* Telerik nests tab content in .k-tabstrip-wrapper > .k-content > per-tab-content. Every layer
   needs to be a flex column that fills, or the innermost tab body has no growth budget. */
.acp-dc-tabs > .k-tabstrip-wrapper,
.acp-dc-tabs .k-tabstrip-wrapper,
.acp-dc-tabs .k-content,
.acp-dc-tabs .k-tabstrip-content,
.acp-dc-tabs .k-tabstrip-content > .k-animation-container,
.acp-dc-tabs .k-tabstrip-content > .k-content {
    flex: 1 1 auto !important;
    display: flex !important;
    flex-direction: column !important;
    min-height: 0 !important;
    overflow: hidden !important;
    background: #fff;
}

/* Each tab body is a flex column that fills the .k-tabstrip-content area. */
.acp-dc-tab-body {
    flex: 1 1 auto !important;
    display: flex !important;
    flex-direction: column !important;
    min-height: 0 !important;
    gap: 0.5rem;
    padding: 0.75rem;
    overflow: hidden;
    background: #fff;
}

/* Grids stretch to their container; Telerik defaults to a fixed inline height. */
.acp-dc-grid-fill { height: 100% !important; min-height: 0 !important; flex: 1 1 auto !important; }
.acp-dc-grid-fill.k-grid { display: flex !important; flex-direction: column !important; }
.acp-dc-grid-fill.k-grid .k-grid-header,
.acp-dc-grid-fill.k-grid .k-grid-footer,
.acp-dc-grid-fill.k-grid .k-pager-wrap { flex: 0 0 auto; }
.acp-dc-grid-fill.k-grid .k-grid-content,
.acp-dc-grid-fill.k-grid .k-grid-container { flex: 1 1 auto !important; overflow-y: auto !important; }

.acp-dc-summary-row {
    display: flex; align-items: center; justify-content: space-between;
    gap: 1rem; flex-wrap: wrap;
    padding: 0.75rem 0.5rem;
}
.acp-dc-search {
    display: flex; align-items: center; gap: 0.6rem;
    flex-wrap: wrap;
}
.acp-dc-status-radio {
    display: inline-flex; gap: 0.75rem; margin-left: 0.5rem;
}
.acp-dc-radio {
    display: inline-flex; align-items: center; gap: 0.3rem;
    font-size: 0.9rem;
}
.acp-dc-total {
    display: inline-flex; align-items: baseline; gap: 0.5rem;
    padding: 0.35rem 0.75rem;
    background: #f8fafc;
    border: 1px solid #e2e8f0;
    border-radius: 4px;
}
.acp-dc-total-label { font-weight: 600; color: #475569; }
.acp-dc-total-value { font-weight: 700; color: #0f172a; }
.acp-dc-panes {
    display: grid;
    grid-template-columns: minmax(320px, 40%) 1fr;
    gap: 0.75rem;
    flex: 1;
    min-height: 0;
    padding: 0 0.5rem 0.5rem;
}
.acp-dc-fc-pane, .acp-dc-aging-pane {
    background: #fff;
    border: 1px solid #e2e8f0;
    border-radius: 4px;
    overflow: hidden;
    display: flex; flex-direction: column;
    min-height: 0;
}
@media (max-width: 900px) {
    .acp-dc-panes { grid-template-columns: 1fr; }
}

.acp-dc-setup-grid-shell {
    background: #fff;
    border: 1px solid #e2e8f0;
    border-radius: 4px;
    overflow: hidden;
    flex: 1;
    min-height: 0;
    display: flex; flex-direction: column;
}
.acp-dc-setup-editor {
    padding: 0.75rem 1rem 0.85rem;
    background: #fff;
}
.acp-dc-setup-row {
    display: flex; align-items: center;
    gap: 0.75rem;
    margin-bottom: 0.55rem;
    flex-wrap: wrap;
}
.acp-dc-setup-label {
    min-width: 110px;
    font-size: 0.9rem; font-weight: 600; color: #334155;
}
.acp-dc-setup-check {
    display: inline-flex; align-items: center; gap: 0.4rem;
    font-size: 0.9rem; color: #334155;
    margin-right: 1rem;
}
.acp-dc-setup-actions {
    display: flex; gap: 0.5rem;
    padding-top: 0.5rem;
    border-top: 1px solid #e2e8f0;
    margin-top: 0.5rem;
}

.acp-dc-status-header {
    display: flex; gap: 2rem; flex-wrap: wrap;
    padding: 0.5rem 0.5rem 0.75rem;
}
.acp-dc-status-header-label {
    font-weight: 600; color: #475569;
    margin-right: 0.35rem;
}
.acp-dc-status-header-value {
    color: #0f172a; font-weight: 700;
}
.acp-dc-status-picker {
    background: #fff;
    border: 1px solid #e2e8f0;
    border-radius: 4px;
    overflow: hidden;
    flex: 1;
    min-height: 0;
    display: flex; flex-direction: column;
}
.acp-dc-status-list-head {
    padding: 0.5rem 0.75rem;
    background: #f5f5f5;
    border-bottom: 1px solid #e2e8f0;
    font-weight: 600; color: #444;
    font-size: 0.85rem;
}

.acp-dc-aging-frame {
    background: #fff;
    flex: 1;
    min-height: 0;
    display: flex; flex-direction: column;
}
.acp-dc-aging-frame > legend { flex: 0 0 auto; }

.acp-dc-status-bottom {
    display: grid;
    grid-template-columns: minmax(360px, 55%) 1fr;
    gap: 0.75rem;
    align-items: start;
}
@media (max-width: 900px) {
    .acp-dc-status-bottom { grid-template-columns: 1fr; }
}
.acp-dc-action-taken, .acp-dc-collection-letter { background: #fff; }
.acp-dc-status-assign-row {
    display: flex; align-items: center; gap: 0.6rem;
    flex-wrap: wrap;
    margin-bottom: 0.5rem;
}
.acp-dc-status-select {
    padding: 0.35rem 0.5rem;
    border: 1px solid #cbd5e1; border-radius: 3px;
    font-size: 0.9rem; background: #fff;
    min-width: 240px;
}
.acp-dc-status-select:disabled { background: #f1f5f9; color: #64748b; }

.acp-dc-current-status-list {
    border: 1px solid #cbd5e1;
    border-radius: 3px;
    background: #fff;
    overflow: hidden;
}
.acp-dc-current-status-head {
    padding: 0.35rem 0.6rem;
    background: #f5f5f5;
    border-bottom: 1px solid #e2e8f0;
    font-weight: 600; color: #444;
    font-size: 0.8rem;
}

.acp-dc-cl-row { display: flex; align-items: center; gap: 0.6rem; margin-bottom: 0.5rem; }
.acp-dc-cl-radio-row { display: flex; gap: 1.25rem; margin-bottom: 0.75rem; flex-wrap: wrap; }
.acp-dc-summaries { background: #fdfdfd; margin-bottom: 0.75rem; padding: 0.5rem 0.75rem; }
.acp-dc-radio-block {
    display: block;
    margin-bottom: 0.35rem;
    font-size: 0.9rem; color: #64748b;
}
.acp-dc-cl-buttons {
    display: flex; gap: 0.5rem;
    padding-top: 0.5rem;
    border-top: 1px solid #e2e8f0;
    margin-top: 0.25rem;
}

.acp-dc-setup-row-actions {
    justify-content: flex-start;
    gap: 1rem;
}
.acp-dc-setup-buttons {
    display: inline-flex; gap: 0.4rem;
    margin-left: auto;
}
/* Charge Codes tabs — reuse the .acp-dc-tabs flex chain via .acp-ch-tabs class. Tight top
   padding so the grid at the bottom of each tab gets every pixel of leftover height. */
.acp-page-wrap:has(.acp-ch-tabs) {
    height: calc(100vh - 60px) !important;
    padding: 0.25rem 1rem 0 !important;
    display: flex !important;
    flex-direction: column !important;
    overflow: hidden !important;
}
.acp-page-wrap:has(.acp-ch-tabs) > .acp-ch-tabs { margin-top: 0 !important; }

.acp-ch-editor {
    background: #fff;
    padding: 0.75rem 1rem;
    border: 1px solid #e2e8f0;
    border-radius: 4px;
    display: flex; flex-direction: column;
    gap: 0.5rem;
}
.acp-ch-editor-row {
    display: flex; align-items: center; gap: 0.75rem;
    flex-wrap: wrap;
}
.acp-ch-label {
    min-width: 200px;
    font-size: 0.9rem; font-weight: 600; color: #334155;
}
.acp-ch-grid-shell {
    background: #fff;
    border: 1px solid #e2e8f0;
    border-radius: 4px;
    overflow: hidden;
    flex: 1;
    min-height: 0;
    display: flex; flex-direction: column;
}
.acp-ch-actions {
    display: flex; gap: 0.5rem;
    padding-top: 0.5rem;
    border-top: 1px solid #e2e8f0;
}

/* Legacy MaintenanceControlPanel locks every editable control until Add/Modify is clicked.
   The wrapper gets .acp-locked (or legacy alias .acp-ch-locked) when IsEditing is false —
   pointer-events blocks every click/type, user-select kills text-selection, and opacity
   gives the operator a visual cue that these fields are disabled. Reused by every setup
   page with an inline editor + grid. */
.acp-locked,
.acp-ch-locked {
    pointer-events: none;
    user-select: none;
    opacity: 0.55;
}

/* Charge Definition editor — dense two-row layout mirroring the legacy frames. */
.acp-ch-defbody { gap: 0.5rem; overflow: auto; }
.acp-ch-defframe { background: #fff; padding: 0.6rem 0.9rem 0.75rem; }
.acp-ch-defframe > legend { color: #1e40af; font-weight: 600; }
.acp-ch-def-row {
    display: flex; align-items: center; gap: 0.6rem;
    flex-wrap: wrap;
    margin-bottom: 0.5rem;
}
.acp-ch-def-row:last-child { margin-bottom: 0; }
.acp-ch-flabel {
    font-size: 0.85rem; font-weight: 600; color: #334155;
    margin-right: 0.25rem;
}
.acp-ch-select {
    padding: 0.3rem 0.5rem;
    border: 1px solid #cbd5e1; border-radius: 3px;
    background: #fff; font-size: 0.9rem;
}
.acp-ch-check { display: inline-flex; align-items: center; gap: 0.3rem; font-size: 0.9rem; color: #334155; }
.acp-ch-radio { display: inline-flex; align-items: center; gap: 0.25rem; font-size: 0.9rem; white-space: nowrap; }
/* Legacy Frame4/5/6/10 — four Medicare/Veteran/Ventilator flag groups sit on ONE row with
   equal widths. flex-wrap:nowrap keeps them in a straight line; flex:1 1 0 spreads the width
   evenly so the Yes/No/All triplets line up vertically across groups. */
/* Four flag groups on ONE straight line. Each box sizes to its own content
   (title + 3 radios inline). No wrapping, no stretching. */
.acp-ch-flag-row {
    display: flex;
    gap: 0.5rem;
    flex-wrap: nowrap;
    align-items: center;
}
.acp-ch-flag-group {
    border: 1px solid #cbd5e1;
    border-radius: 3px;
    padding: 0.3rem 0.6rem;
    background: #fff;
    display: inline-flex;
    align-items: center;
    gap: 0.75rem;
    white-space: nowrap;
}
.acp-ch-flag-title {
    font-size: 0.78rem;
    color: #7c2d12;
    font-weight: 700;
    white-space: nowrap;
}

.acp-ch-rates-grid {
    display: grid;
    grid-template-columns: repeat(4, max-content 1fr);
    gap: 0.4rem 0.75rem;
    align-items: center;
}
.acp-ch-rate-label {
    font-size: 0.85rem; font-weight: 600; color: #334155;
    text-align: right;
}

.acp-ch-def-grid-shell {
    min-height: 200px;
    flex: 1 1 auto !important;
    background: #fff;
    border: 1px solid #e2e8f0;
    border-radius: 4px;
    overflow: hidden;
    display: flex; flex-direction: column;
}

/* Charges Allocation layout. */
.acp-ch-alloc-title {
    text-align: center;
    color: #1e40af;
    font-weight: 700;
    font-size: 1.05rem;
    padding: 0.25rem 0 0.5rem;
}
.acp-ch-alloc-header {
    display: grid;
    grid-template-columns: minmax(340px, 1fr) minmax(340px, 1fr);
    gap: 1rem;
    background: #fff;
    border: 1px solid #e2e8f0;
    border-radius: 4px;
    padding: 0.75rem 1rem;
}
@media (max-width: 900px) {
    .acp-ch-alloc-header { grid-template-columns: 1fr; }
}
.acp-ch-alloc-fcs, .acp-ch-alloc-flags {
    display: flex; flex-direction: column; gap: 0.5rem;
}

.acp-ch-alloc-rates {
    display: grid;
    grid-template-columns: 3rem minmax(220px, 1fr) max-content max-content max-content;
    gap: 0.35rem 0.75rem;
    align-items: center;
}
.acp-ch-alloc-h {
    font-size: 0.75rem; font-weight: 700; color: #475569;
    text-transform: uppercase; letter-spacing: 0.03em;
    padding-bottom: 0.2rem;
    border-bottom: 1px solid #e2e8f0;
}
.acp-ch-alloc-rownum {
    font-weight: 700; color: #64748b; text-align: right;
    font-size: 0.9rem;
}
.acp-ch-alloc-fcsel { min-width: 220px; }

/* A/R G/L (legacy frmGLAR.frm). Fixed editor row above, grid fills below. */
.acp-page-wrap.acp-argl-wrap {
    height: calc(100vh - 60px);
    padding: 0.5rem 1rem 0;
    display: flex; flex-direction: column;
    overflow: hidden;
    gap: 0.5rem;
}
.acp-argl-editor {
    background: #fff;
    border: 1px solid #e2e8f0;
    border-radius: 4px;
    padding: 0.5rem 0.9rem;
    display: flex; flex-direction: column;
    gap: 0.45rem;
}
.acp-argl-row {
    display: flex; align-items: center; gap: 0.75rem;
    flex-wrap: wrap;
}
.acp-argl-label {
    min-width: 130px;
    font-size: 0.9rem; font-weight: 600; color: #334155;
    text-align: right;
}
.acp-argl-grid-shell {
    flex: 1 1 auto;
    min-height: 200px;
    background: #fff;
    border: 1px solid #e2e8f0;
    border-radius: 4px;
    overflow: hidden;
    display: flex; flex-direction: column;
}

/* EDI Setup (legacy frmEDI.frm). Fin-class picker on top, tabbed editor below. */
.acp-page-wrap.acp-edi-wrap {
    height: calc(100vh - 60px);
    padding: 0.5rem 1rem 0;
    display: flex; flex-direction: column;
    overflow: hidden;
}
.acp-page-wrap.acp-edi-wrap > .acp-edi-tabs { margin-top: 0.5rem; }
.acp-edi-topbar {
    display: flex; align-items: center; gap: 0.6rem;
    flex-wrap: wrap;
    padding: 0.35rem 0.5rem;
    background: #fff;
    border: 1px solid #e2e8f0;
    border-radius: 4px;
}
.acp-edi-actions { display: inline-flex; gap: 0.4rem; margin-left: auto; }
/* Legacy MaintenanceControlPanel sits BELOW the tab strip (frmEDI :: bottom of the form).
   Center the button row horizontally and give it a top border separator. */
.acp-edi-actions-bottom {
    display: flex;
    justify-content: center;
    gap: 0.5rem;
    padding: 0.6rem 0.75rem;
    margin-top: 0.5rem;
    border-top: 1px solid #e2e8f0;
    background: #fff;
    margin-left: 0;
}
.acp-edi-fc-select { min-width: 280px; }
/* ISA tab — 3-column grid filled column-by-column. 4 rows for the longest column
   (Authorization/Auth Info/Security/Security Info); columns 2 and 3 fall into the remaining
   slots in the legacy order. */
.acp-edi-isa-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    grid-template-rows: repeat(4, auto);
    grid-auto-flow: column;
    gap: 0.75rem 1.5rem;
    padding: 0.5rem 0.25rem;
}
/* Generic 3-column grid used by GS, ETIN, Receiver, Provider so every tab has a consistent
   layout. Flows row-by-row: natural reading order. */
.acp-edi-cols {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 0.75rem 1.5rem;
    padding: 0.5rem 0.25rem;
}
.acp-edi-cell {
    display: flex;
    flex-direction: column;
    gap: 0.2rem;
    min-width: 0;
}
.acp-edi-cell-label {
    font-size: 0.8rem; font-weight: 600; color: #334155;
}
.acp-edi-cell-empty { visibility: hidden; }
.acp-edi-tabbody { overflow-y: auto; padding: 0.5rem 0.75rem; }
.acp-edi-row {
    display: flex; align-items: center; gap: 0.6rem;
    margin-bottom: 0.4rem;
    flex-wrap: wrap;
}
.acp-edi-label {
    min-width: 220px;
    font-size: 0.85rem; font-weight: 600; color: #334155;
    text-align: right;
}
.acp-edi-section {
    grid-column: 1 / -1;
    padding: 0.35rem 0;
    font-size: 0.85rem;
    font-weight: 700; color: #1e40af;
    text-transform: uppercase; letter-spacing: 0.03em;
    border-bottom: 1px solid #e2e8f0;
    margin: 0.5rem 0 0.35rem;
}
/* Legacy VB.Frame captions as fieldset/legend (design-system rule). Trimmed of trailing ellipses
   per the legend-no-ellipsis memory rule. */
.acp-edi-frame,
.acp-edi-subframe {
    border: 1px solid #cbd5e1;
    border-radius: 4px;
    padding: 0.5rem 0.75rem;
    margin: 0.4rem 0 0.5rem;
    background: #fff;
}
.acp-edi-frame > legend,
.acp-edi-subframe > legend {
    padding: 0 0.4rem;
    font-size: 0.8rem;
    font-weight: 700;
    color: #1e40af;
    text-transform: uppercase;
    letter-spacing: 0.03em;
}
.acp-edi-subframe { margin: 0.35rem 0.25rem 0.5rem; background: #f8fafc; }

.acp-edi-sort-frame {
    border: 1px solid #cbd5e1;
    border-radius: 4px;
    padding: 0.15rem 0.6rem 0.35rem;
    margin: 0;
    display: inline-flex; align-items: center; gap: 0.75rem;
}
.acp-edi-sort-frame > legend {
    padding: 0 0.35rem;
    font-size: 0.75rem;
    font-weight: 700;
    color: #64748b;
    text-transform: uppercase;
    letter-spacing: 0.03em;
}
.acp-edi-radio {
    display: inline-flex; align-items: center; gap: 0.3rem;
    font-size: 0.85rem;
    cursor: pointer;
}
.acp-edi-radio input[disabled] { cursor: not-allowed; }

/* Nested Medicare Rate Codes sub-tab strip — reuse the outer flex chain so the inner tabs also
   fill available height instead of squashing to their content. */
.acp-edi-subtabs {
    flex: 1 1 auto !important;
    display: flex !important;
    flex-direction: column !important;
    min-height: 0 !important;
}
.acp-edi-subtabs .k-tabstrip-wrapper,
.acp-edi-subtabs .k-content,
.acp-edi-subtabs .k-tabstrip-content,
.acp-edi-subtabs .k-tabstrip-content > .k-animation-container,
.acp-edi-subtabs .k-tabstrip-content > .k-content {
    flex: 1 1 auto !important;
    display: flex !important;
    flex-direction: column !important;
    min-height: 0 !important;
    overflow: hidden !important;
    background: #fff;
}