.account-login-page {
    display: flex;
    justify-content: center;
    padding: clamp(1.5rem, 4vw, 3rem) 1rem;
}

.account-login-form {
    width: min(100%, 28rem);
}

.account-login-heading {
    margin-bottom: 1.25rem;
}

.account-login-form .form-control,
.account-login-form .form-select {
    max-width: none;
}

.account-login-remember {
    margin: 0.25rem 0 1.25rem;
}

.account-login-submit {
    width: auto;
}

.account-login-links {
    display: grid;
    gap: 0.65rem;
    margin-top: 1rem;
}

.account-login-page {
    align-items: flex-start;
    min-height: calc(100vh - 160px);
    padding: clamp(2rem, 7vh, 4.5rem) 1rem 2rem;
}

.account-login-form {
    background: var(--app-surface-strong);
    border: 1px solid var(--app-border-muted);
    border-radius: 8px;
    box-shadow: 0 12px 28px rgba(0, 0, 0, 0.06);
    padding: clamp(1.35rem, 3vw, 1.8rem);
    width: min(100%, 26rem);
}

.account-login-heading {
    border-bottom: 1px solid var(--app-border-muted);
    margin-bottom: 1rem;
    padding-bottom: 0.85rem;
}

.account-login-heading h2 {
    font-size: 1.65rem;
    line-height: 1.1;
    margin-bottom: 0;
}

.account-login-form .mb-3 {
    margin-bottom: 0.85rem !important;
}

.account-login-form .form-label {
    font-weight: 700;
    margin-bottom: 0.35rem;
}

.account-login-form .form-control,
.account-login-form .form-select {
    min-height: 2.35rem;
}

.account-login-remember {
    align-items: center;
    display: flex;
    gap: 0.4rem;
    margin: 0.25rem 0 1rem;
}

.account-login-remember .form-check-input {
    float: none;
    margin: 0;
}

.account-login-submit {
    align-items: center;
    display: inline-flex;
    gap: 0.35rem;
    justify-content: center;
    min-height: 2.5rem;
    width: 100%;
}

.account-login-links {
    border-top: 1px solid var(--app-border-muted);
    display: flex;
    flex-wrap: wrap;
    gap: 0.55rem 1rem;
    justify-content: space-between;
    margin-top: 1rem;
    padding-top: 0.85rem;
}

.account-login-links a {
    color: var(--app-link-color);
    font-size: var(--app-font-size-small);
    text-decoration: underline;
    text-underline-offset: 0.18rem;
}

@media (max-width: 575.98px) {
    .account-login-page {
        min-height: auto;
        padding-top: 1rem;
    }

    .account-login-form {
        border-radius: 6px;
        box-shadow: none;
    }
}
:root {
    --app-border-color: rgba(0, 0, 0, 0.18);
    --app-border-muted: rgba(0, 0, 0, 0.1);
    --app-control-bg: rgba(255, 255, 255, 0.34);
    --app-control-bg-focus: rgba(255, 255, 255, 0.46);
    --app-control-bg-disabled: rgba(255, 255, 255, 0.16);
    --app-link-color: #111;
    --app-muted-color: #5f6368;
    --app-surface: rgba(255, 255, 255, 0.26);
    --app-surface-strong: rgba(255, 255, 255, 0.42);
    --app-surface-hover: rgba(255, 255, 255, 0.34);
    --app-text-color: #171717;
    --app-transition-fast: 0.15s ease-in-out;
    --app-field-max-width: 280px;
    --app-field-wide-max-width: 560px;
    --app-field-narrow-max-width: 180px;
    --app-font-size-base: 1rem;
    --app-font-size-compact: 0.95rem;
    --app-font-size-small: 0.88rem;
    --app-font-size-xs: 0.82rem;
    --app-font-size-table: 0.96rem;
    --app-font-size-button: 0.95rem;
    --app-font-size-sidebar: 1rem;
}

body {
    background-color: var(--app-theme-bg);
    color: var(--app-text-color);
    font-size: var(--app-font-size-base);
    padding-top: 56px;
    padding-bottom: 48px;
    /* Disables CSS Scroll Anchoring for the page's main (body) scroll container. Inquiry-mode
       DTE tables live inside an iframe whose box height is rewritten on every row add/delete,
       column toggle, and inline/modal edit (see autoSizeDteIframe in dte-navigation.js); each of
       those changes the layout the browser is looking at when picking a viewport anchor to keep
       stable, and the browser's own compensating scroll to preserve that anchor is what shows up
       as the page repeatedly jumping during normal DTE interaction. Setting overflow-anchor:none
       only on the iframe itself isn't enough -- the anchor node the browser protects is often
       something else in the viewport whose position still shifts when the iframe resizes, so this
       needs to be on the actual scrolling container (body here, since the page uses ordinary
       document scrolling, not a nested scroll wrapper) to disable the anchoring computation
       entirely. */
    overflow-anchor: none;
}

.app-header {
    background-color: var(--app-theme-bg);
    border-bottom: 1px solid var(--app-border-muted);
    min-height: 56px;
}

.app-header-inner {
    display: flex;
    align-items: center;
    flex-wrap: nowrap;
    gap: 0.5rem;
    min-width: 0;
}

.app-sidebar-toggle {
    background-color: var(--app-theme-bg);
    border: 1px solid var(--app-border-color);
    border-radius: 4px;
    flex: 0 0 auto;
    width: 40px;
    height: 40px;
}

.app-sidebar-toggle:hover,
.app-sidebar-toggle:focus-visible,
.app-account-toggle:hover,
.app-account-toggle:focus-visible {
    background-color: var(--app-surface-hover);
    border-color: rgba(0, 0, 0, 0.32);
}

.institutional-settings-tabs-wrapper {
    margin-bottom: 1rem;
    scrollbar-width: thin;
}

.institutional-settings-tabs-bar {
    align-items: flex-end;
    display: flex;
    gap: 1rem;
    justify-content: space-between;
}

.institutional-settings-tabs {
    flex: 1 1 auto;
    flex-wrap: nowrap;
    min-width: max-content;
    overflow-x: auto;
    overflow-y: hidden;
}

.institutional-settings-tabs .nav-link {
    white-space: nowrap;
}

/* Styled like .geninfo-autosave-status/.customer-status-pill so this reads as a small,
   intentional badge. Invisible until a save actually happens (opacity, not display, so the
   fade transition has something to animate) - a successful save fades it back out after a
   moment via the .is-visible toggle in InstitutionalSettings.js, but a failure leaves
   .is-visible in place so the error stays put until the next save attempt. */
.institutional-settings-autosave-status {
    background: rgba(255, 255, 255, .34);
    border: 1px solid var(--app-border-color);
    border-radius: 999px;
    color: var(--app-text-color);
    display: inline-block;
    flex: 0 0 auto;
    font-size: var(--app-font-size-xs);
    font-weight: 700;
    line-height: 1;
    margin-bottom: 0.15rem;
    opacity: 0;
    padding: 0.35rem 0.55rem;
    transition: opacity 400ms ease;
    white-space: nowrap;
}

.institutional-settings-autosave-status.is-visible {
    opacity: 1;
}

.institutional-settings-autosave-status[data-state="saved"] {
    background: rgba(32, 134, 75, 0.15);
    border-color: rgba(32, 134, 75, 0.35);
}

.institutional-settings-autosave-status[data-state="saving"],
.institutional-settings-autosave-status[data-state="waiting"] {
    color: var(--app-muted-color);
}

.institutional-settings-autosave-status[data-state="error"] {
    background: rgba(180, 35, 24, 0.15);
    border-color: rgba(180, 35, 24, 0.35);
    color: #b02a37;
}

.institutional-settings-tab-content {
    min-width: 0;
}

.institutional-settings-tab-content .tab-pane {
    display: none;
    overflow-x: auto;
}

.institutional-settings-tab-content .tab-pane.active {
    display: block;
}

.institutional-settings-info {
    color: var(--app-muted-color);
    line-height: 1;
}

.institutional-settings-info:hover,
.institutional-settings-info:focus-visible {
    color: var(--app-text-color);
}

.settings-help {
    color: var(--app-muted-color);
    font-size: var(--app-font-size-small);
    line-height: 1.35;
    max-width: 58rem;
    margin: 0 0 1rem;
}

.card-body > .settings-help:last-child {
    margin-bottom: 0;
}

.customer-context-bar {
    display: flex;
    flex-wrap: wrap;
    gap: 0.5rem;
    margin-bottom: 1.25rem;
}

.customer-context-item {
    align-items: flex-start;
    background: var(--app-control-bg);
    border: 1px solid var(--app-border-color);
    border-radius: 4px;
    color: var(--app-text-color);
    display: inline-flex;
    flex: 1 1 11rem;
    flex-direction: column;
    gap: 0.15rem;
    min-width: 0;
    padding: 0.55rem 0.7rem;
    text-align: left;
}

.customer-context-item:hover,
.customer-context-item:focus-visible {
    background: var(--app-surface-hover);
    border-color: rgba(0, 0, 0, 0.32);
}

.customer-context-item-wide {
    flex-basis: 16rem;
}

.customer-context-label {
    color: var(--app-muted-color);
    font-size: var(--app-font-size-xs);
    font-weight: 700;
    line-height: 1;
    text-transform: uppercase;
}

.customer-context-value {
    font-size: var(--app-font-size-compact);
    line-height: 1.25;
    overflow-wrap: anywhere;
}

.customer-card-title {
    align-items: center;
    display: flex;
    flex-wrap: wrap;
    gap: 0.75rem;
    justify-content: space-between;
}

.customer-dashboard-tabs {
    border-bottom: 1px solid rgba(0,0,0,.18);
    margin-bottom: 1rem;
}

.customer-dashboard-tabs .nav-item {
    flex: 0 0 auto;
}

.customer-dashboard-tabs .nav-link {
    background-color: transparent !important;
    border-color: transparent !important;
    color: rgba(0,0,0,.65);
    transition: all .15s ease-in-out;
}

.customer-dashboard-tabs .nav-link:hover,
.customer-dashboard-tabs .nav-link:focus {
    background-color: rgba(0,0,0,.06) !important;
    border-color: transparent !important;
    color: rgba(0,0,0,.9);
}

.customer-dashboard-tabs .nav-link.active {
    background-color: rgba(0,0,0,.14) !important;
    border-color: rgba(0,0,0,.22) rgba(0,0,0,.22) transparent !important;
    color: #111 !important;
    font-weight: 600;
    box-shadow: inset 0 2px 0 rgba(0,0,0,.18), 0 0 8px rgba(0,0,0,.08);
}

.customer-dashboard-tab-content {
    min-width: 0;
}

#customer-profile-pane .customer-context-bar {
    display: none;
}

.customer-workspace-header {
    background: var(--app-surface);
    border: 1px solid var(--app-border-muted);
    border-radius: 6px;
    container-type: inline-size;
    margin-bottom: 1rem;
    padding: 1rem;
}

.customer-workspace-header-compact {
    padding: 0.7rem 0.85rem;
}

.customer-workspace-header-has-toggle {
    padding-right: 4.75rem;
}

.customer-workspace-shell {
    position: relative;
}

.customer-workspace-persistent-controls {
    align-items: center;
    display: flex;
    gap: 0.35rem;
    position: absolute;
    right: 0.85rem;
    top: 0.7rem;
    z-index: 2;
}

/* Collapsed state: swap the floating hide-button for a real, in-flow compact bar (name +
   status + show-button) so the control always has visible context instead of sitting alone
   in an otherwise-empty strip. */
.customer-workspace-compact-bar {
    align-items: center;
    display: none;
    gap: 0.6rem;
    padding: 0.7rem 0.85rem;
    /* Lines up with .sidebar-menu-tabs's own border-bottom -- same row height (icon button +
       padding here lands within a pixel of the sidebar's tab row), so the two read as one
       continuous seam across the sidebar and content area instead of two unrelated lines. */
    border-bottom: 1px solid var(--app-border-color);
}

.customer-workspace-shell.customer-workspace-pane-hidden .customer-workspace-persistent-controls {
    display: none;
}

.customer-workspace-shell.customer-workspace-pane-hidden .customer-workspace-compact-bar {
    display: flex;
}

.customer-workspace-compact-name {
    flex: 1 1 auto;
    font-weight: 600;
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.customer-workspace-main {
    align-items: flex-start;
    display: flex;
    gap: 1rem;
    justify-content: space-between;
    margin-bottom: 0.7rem;
    min-width: 0;
}

.customer-workspace-main > div:first-child {
    flex: 1 999 140px;
    min-width: 140px;
}

.customer-workspace-kicker {
    color: var(--app-muted-color);
    font-size: var(--app-font-size-xs);
    font-weight: 700;
    letter-spacing: 0;
    text-transform: uppercase;
}

.customer-workspace-title-row {
    align-items: baseline;
    display: flex;
    flex-wrap: wrap;
    gap: 0.25rem 0.6rem;
    min-width: 0;
}

.customer-workspace-title {
    font-size: 1.7rem;
    line-height: 1.15;
    margin: 0;
    overflow-wrap: anywhere;
}

/* Icon chip, not a text badge - the name it's next to already carries the weight, and this
   used to spell out "ENTITY"/"INDIVIDUAL" right beside a page that's often headed "Entity
   Profile" a few lines down, which read as pure repetition. Tooltip + visually-hidden span
   keep the account type available to sighted hover and screen readers alike. */
.customer-workspace-account-type {
    align-items: center;
    background: var(--app-control-bg);
    border: 1px solid var(--app-border-color);
    border-radius: 999px;
    color: var(--app-muted-color);
    display: inline-flex;
    flex: 0 0 auto;
    height: 1.5rem;
    justify-content: center;
    width: 1.5rem;
}

.customer-workspace-subtitle {
    align-items: center;
    color: var(--app-muted-color);
    display: flex;
    flex-wrap: wrap;
    gap: 0.35rem 0.75rem;
    margin-top: 0.2rem;
    min-width: 0;
}

.customer-workspace-subtitle a {
    color: var(--app-link-color);
    white-space: nowrap;
}

.customer-workspace-status {
    align-items: center;
    display: flex;
    flex: 0 1 auto;
    flex-wrap: wrap;
    gap: 0.4rem;
    justify-content: flex-end;
    min-width: 0;
}

.customer-workspace-icon-button {
    align-items: center;
    background: var(--app-control-bg);
    border: 1px solid var(--app-border-color);
    border-radius: 4px;
    color: var(--app-muted-color);
    display: inline-flex;
    height: 1.75rem;
    justify-content: center;
    padding: 0;
    transition: background-color var(--app-transition-fast), border-color var(--app-transition-fast), color var(--app-transition-fast);
    width: 1.75rem;
}

.customer-workspace-icon-button:hover,
.customer-workspace-icon-button:focus-visible {
    background: var(--app-surface-hover);
    border-color: rgba(0, 0, 0, 0.32);
    color: var(--app-text-color);
}

.customer-status-pill {
    background: rgba(255,255,255,.34);
    border: 1px solid var(--app-border-color);
    border-radius: 999px;
    color: var(--app-text-color);
    font-size: var(--app-font-size-xs);
    font-weight: 700;
    line-height: 1;
    padding: 0.35rem 0.55rem;
}

.customer-status-pill-success {
    background: rgba(32, 134, 75, 0.15);
    border-color: rgba(32, 134, 75, 0.35);
}

.customer-status-pill-warning {
    background: rgba(178, 108, 0, 0.15);
    border-color: rgba(178, 108, 0, 0.35);
}

.customer-status-pill-info {
    background: rgba(44, 102, 147, 0.14);
    border-color: rgba(44, 102, 147, 0.32);
}

.customer-status-pill-danger {
    background: rgba(180, 35, 24, 0.15);
    border-color: rgba(180, 35, 24, 0.35);
}

.customer-status-pill-action {
    align-items: center;
    display: inline-flex;
    gap: 0.3rem;
}

.customer-status-pill-action:hover,
.customer-status-pill-action:focus-visible {
    background: var(--app-surface-hover);
    border-color: rgba(0, 0, 0, 0.32);
}

.employee-status-muted {
    color: var(--app-muted-color);
    font-weight: 400;
}

.admin-password-reset-warning {
    border-left: 4px solid rgba(178, 108, 0, 0.55);
    line-height: 1.35;
}

.admin-password-reset-warning strong {
    display: block;
    margin-bottom: 0.25rem;
}

.customer-workspace-quick-grid {
    display: grid;
    gap: 0.5rem;
    grid-template-columns: repeat(auto-fit, minmax(11rem, 1fr));
    margin-bottom: 1rem;
}

.customer-workspace-quick-item,
.customer-workspace-action {
    background: var(--app-control-bg);
    border: 1px solid var(--app-border-color);
    border-radius: 4px;
    color: var(--app-text-color);
    min-width: 0;
    text-align: left;
    transition: background-color var(--app-transition-fast), border-color var(--app-transition-fast);
}

.customer-workspace-quick-item {
    display: flex;
    flex-direction: column;
    gap: 0.2rem;
    padding: 0.65rem 0.75rem;
}

.customer-workspace-quick-item-wide {
    grid-column: span 2;
}

.customer-workspace-quick-item span {
    color: var(--app-muted-color);
    font-size: var(--app-font-size-xs);
    font-weight: 700;
    line-height: 1;
    text-transform: uppercase;
}

.customer-workspace-quick-item strong {
    font-size: var(--app-font-size-compact);
    font-weight: 600;
    line-height: 1.25;
    overflow-wrap: anywhere;
}

.customer-workspace-actions {
    border-bottom: 1px solid var(--app-border-color);
    border-top: 1px solid var(--app-border-color);
    display: flex;
    flex-wrap: wrap;
    gap: 0.1rem 0.2rem;
    padding-top: 0.4rem;
}

@media (min-width: 576px) {
    .customer-workspace-nav-mode-vertical:not(.customer-workspace-nav-visible) .customer-workspace-actions {
        display: none;
    }

    /* Mirrors the sidebar-collapsed-init flash fix in _Layout.cshtml: when the sidebar is
       already known to be collapsed, show the tabs from the first paint instead of waiting
       for app-shell.js to add customer-workspace-nav-visible after the page has rendered. */
    html.sidebar-collapsed-init .customer-workspace-nav-mode-vertical .customer-workspace-actions {
        display: flex;
    }
}

.customer-workspace-shell.customer-workspace-pane-hidden .customer-workspace-header {
    display: none;
}

.customer-workspace-action {
    align-items: center;
    background: transparent;
    border-color: transparent;
    border-radius: 4px 4px 0 0;
    border-bottom-color: transparent;
    display: inline-flex;
    gap: 0.4rem;
    justify-content: center;
    min-height: 2.25rem;
    margin-bottom: -1px;
    padding: 0.55rem 0.72rem 0.62rem;
    position: relative;
    text-decoration: none;
}

.customer-workspace-action-count {
    align-items: center;
    background: rgba(0,0,0,.12);
    border: 1px solid rgba(0,0,0,.16);
    border-radius: 999px;
    display: inline-flex;
    font-size: var(--app-font-size-xs);
    font-weight: 700;
    justify-content: center;
    line-height: 1;
    min-width: 1.45rem;
    padding: 0.2rem 0.42rem;
}

.customer-workspace-action-primary {
    background: rgba(255,255,255,.48);
    font-weight: 700;
}

.customer-workspace-action-active {
    background: var(--app-surface-strong);
    border-color: var(--app-border-color);
    border-bottom-color: var(--app-theme-bg);
    box-shadow: inset 0 2px 0 rgba(0, 0, 0, 0.18), 0 -1px 6px rgba(0, 0, 0, 0.04);
    font-weight: 700;
    z-index: 1;
}

.customer-workspace-action-active::after {
    background: var(--app-theme-bg);
    bottom: -1px;
    content: "";
    height: 1px;
    left: 1px;
    position: absolute;
    right: 1px;
}

.customer-workspace-action-active .customer-workspace-action-count {
    background: rgba(255,255,255,.55);
    border-color: rgba(0,0,0,.24);
}

.customer-workspace-quick-item:hover,
.customer-workspace-quick-item:focus-visible,
.customer-workspace-action:hover,
.customer-workspace-action:focus-visible {
    background: var(--app-surface-hover);
    border-color: rgba(0, 0, 0, 0.32);
    color: var(--app-text-color);
    text-decoration: none;
}

.customer-workspace-action:not(.customer-workspace-action-active):hover,
.customer-workspace-action:not(.customer-workspace-action-active):focus-visible {
    border-bottom-color: var(--app-border-color);
}

.customer-work-card {
    margin-bottom: 1rem;
}

.customer-work-card-header {
    align-items: flex-start;
    display: flex;
    gap: 1rem;
    justify-content: space-between;
    margin-bottom: 1rem;
}

.customer-work-card-subtitle {
    color: var(--app-muted-color);
    line-height: 1.35;
}

.spread-workflow-controls {
    display: grid;
    gap: 0.75rem;
    grid-template-columns: minmax(16rem, 1fr) minmax(7rem, 10rem);
    margin-bottom: 1rem;
}

.spread-source-matrix {
    overflow-x: auto;
}

.spread-source-matrix table {
    min-width: 48rem;
}

.spread-source-matrix th:first-child {
    width: 4rem;
}

.spread-source-matrix td:nth-child(2) {
    width: 8rem;
}

.spread-source-matrix .form-control,
.spread-source-matrix .form-select {
    max-width: none;
}

.customer-records-card {
    margin-bottom: 1rem;
    min-width: 0;
}

.customer-records-header {
    align-items: flex-start;
    display: flex;
    gap: 1rem;
    justify-content: space-between;
    margin-bottom: 1rem;
    min-width: 0;
}

.customer-records-header > div:first-child {
    min-width: 0;
}

.customer-records-header-sm {
    margin-bottom: 0.75rem;
}

.customer-records-meta {
    color: var(--app-muted-color);
    display: flex;
    font-size: var(--app-font-size-small);
    flex-wrap: wrap;
    gap: 0.35rem 0.75rem;
    line-height: 1.25;
}

.customer-records-actions,
.customer-records-toolbar-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 0.45rem;
    justify-content: flex-end;
}

.customer-records-toolbar {
    align-items: center;
    background: var(--app-control-bg);
    border: 1px solid var(--app-border-muted);
    border-radius: 4px;
    display: flex;
    gap: 0.75rem;
    justify-content: space-between;
    margin-bottom: 1rem;
    padding: 0.65rem;
}

.customer-records-help {
    color: var(--app-muted-color);
    font-size: var(--app-font-size-small);
    line-height: 1.3;
}

.customer-records-subsection {
    border-top: 1px solid var(--app-border-muted);
    margin-top: 1rem;
    padding-top: 1rem;
}

.customer-certificate-review {
    max-width: 100%;
}

.customer-certificate-review .table {
    table-layout: auto;
}

.certificate-review-actions {
    align-items: center;
    display: flex;
    gap: 1rem;
    justify-content: space-between;
}

.certificate-review-annual {
    flex: 1 1 auto;
}

.customer-records-card .table-responsive,
.customer-records-card div.dt-container {
    max-width: 100%;
}

.customer-admin-card .card-body {
    padding-bottom: 1rem;
}

.customer-admin-grid {
    display: grid;
    gap: 0.75rem;
    grid-template-columns: minmax(16rem, 0.8fr) minmax(22rem, 1.2fr);
}

.customer-admin-panel {
    background: var(--app-control-bg);
    border: 1px solid var(--app-border-muted);
    border-radius: 4px;
    min-width: 0;
    padding: 0.85rem;
}

.customer-admin-panel-title {
    border-bottom: 1px solid var(--app-border-muted);
    display: grid;
    gap: 0.25rem;
    font-weight: 700;
    margin-bottom: 0.75rem;
    padding-bottom: 0.55rem;
}

.customer-admin-panel-title small {
    color: var(--app-muted-color);
    font-size: var(--app-font-size-small);
    font-weight: 400;
    line-height: 1.3;
}

.customer-admin-toggle-list {
    display: grid;
    gap: 0.65rem;
}

.customer-admin-switch {
    align-items: center;
    background: rgba(255, 255, 255, 0.16);
    border: 1px solid var(--app-border-muted);
    border-radius: 4px;
    display: flex;
    gap: 0.55rem;
    margin: 0;
    min-height: 2.6rem;
    padding: 0.55rem 0.65rem;
}

.customer-admin-switch .form-check-input {
    flex: 0 0 auto;
    margin-left: 0;
    margin-top: 0;
}

.customer-admin-switch .form-check-label {
    line-height: 1.25;
}

.customer-admin-banker-list {
    display: grid;
    gap: 0.45rem;
    margin-top: 0.75rem;
}

.customer-admin-banker-row {
    align-items: center;
    background: rgba(255, 255, 255, 0.16);
    border: 1px solid var(--app-border-muted);
    border-radius: 4px;
    display: flex;
    gap: 0.75rem;
    justify-content: space-between;
    min-height: 2.35rem;
    padding: 0.45rem 0.55rem 0.45rem 0.7rem;
}

.customer-admin-remove-banker {
    align-items: center;
    color: var(--bs-danger);
    display: inline-flex;
    flex: 0 0 auto;
    height: 1.75rem;
    justify-content: center;
    text-decoration: none;
    width: 1.75rem;
}

.customer-admin-remove-banker:hover,
.customer-admin-remove-banker:focus-visible {
    color: #8f101c;
}

.customer-admin-add-banker {
    margin-bottom: 0;
}

.customer-admin-add-banker .form-label {
    font-weight: 700;
    margin-bottom: 0.35rem;
}

.customer-admin-empty {
    padding: 0.65rem;
    text-align: left;
}

.institutional-settings-tabs-wrapper:has(#images-tab.active) .institutional-settings-autosave-status {
    display: none !important;
}

.customer-empty-state {
    background: var(--app-control-bg);
    border: 1px solid var(--app-border-muted);
    border-radius: 4px;
    color: var(--app-muted-color);
    padding: 0.9rem;
    text-align: center;
}

table.dataTable tbody tr[data-href] {
    cursor: pointer;
}

table.dataTable tbody tr[data-href]:hover > *,
.table tbody tr[data-href]:hover > * {
    --bs-table-bg: rgba(13, 110, 253, 0.08);
    --bs-table-accent-bg: rgba(13, 110, 253, 0.08);
    background-color: rgba(13, 110, 253, 0.08) !important;
}

table.dataTable tbody tr.customer-index-row-restricted,
.table tbody tr.customer-index-row-restricted {
    cursor: not-allowed;
}

.institutional-image-preview {
    background: var(--app-control-bg);
    border: 1px solid var(--app-border-muted);
    border-radius: 4px;
    display: block;
    max-height: 200px;
    max-width: 100%;
    object-fit: contain;
    padding: 0.5rem;
}

.customer-empty-row td {
    background: var(--app-control-bg) !important;
    color: var(--app-muted-color);
    padding: 1rem !important;
}

.geninfo-profile-shell {
    padding-bottom: 2rem;
}

.geninfo-profile-shell.container-fluid {
    padding-left: 0.75rem;
    padding-right: 0.75rem;
}

.geninfo-profile-header {
    align-items: flex-start;
    background: transparent;
    border: 1px solid var(--app-border-muted);
    border-radius: 8px;
    box-shadow: none;
    display: flex;
    gap: 1rem;
    justify-content: space-between;
    margin-bottom: 1.25rem;
    padding: 1.25rem;
}

.geninfo-kicker {
    color: var(--app-muted-color);
    font-size: .78rem;
    font-weight: 700;
    letter-spacing: .04rem;
    text-transform: uppercase;
}

.geninfo-profile-header h2 {
    color: var(--app-text-color);
    font-size: clamp(1.5rem, 2.4vw, 2rem);
    font-weight: 800;
    letter-spacing: 0;
    margin: .2rem 0 .4rem;
}

.geninfo-profile-meta {
    color: var(--app-muted-color);
    display: flex;
    flex-wrap: wrap;
    gap: .55rem 1rem;
}

.geninfo-profile-meta span {
    align-items: center;
    display: inline-flex;
    gap: .35rem;
    min-width: 0;
}

.geninfo-profile-actions {
    align-items: center;
    display: flex;
    flex: 0 0 auto;
    flex-wrap: wrap;
    gap: .5rem;
    justify-content: flex-end;
}

/* Styled like .customer-status-pill so the autosave indicator reads as a small, intentional
   badge instead of bare text floating in an otherwise-empty toolbar row. */
.geninfo-autosave-status {
    background: rgba(255, 255, 255, .34);
    border: 1px solid var(--app-border-color);
    border-radius: 999px;
    color: var(--app-text-color);
    display: inline-block;
    font-size: var(--app-font-size-xs);
    font-weight: 700;
    line-height: 1;
    padding: 0.35rem 0.55rem;
    white-space: nowrap;
}

.geninfo-autosave-status[data-state="saved"] {
    background: rgba(32, 134, 75, 0.15);
    border-color: rgba(32, 134, 75, 0.35);
}

.geninfo-autosave-status[data-state="saving"],
.geninfo-autosave-status[data-state="waiting"] {
    color: var(--app-muted-color);
}

.geninfo-autosave-status[data-state="error"] {
    background: rgba(180, 35, 24, 0.15);
    border-color: rgba(180, 35, 24, 0.35);
    color: #b02a37;
}

.geninfo-autosave-form .geninfo-save-strip {
    display: none;
}

.geninfo-profile-shell > h5,
.geninfo-profile-shell h6 {
    color: var(--app-text-color);
    font-weight: 800;
    letter-spacing: 0;
}

.geninfo-profile-shell > h5 {
    border-bottom: 1px solid var(--app-border-color);
    margin: 1.4rem 0 1rem;
    padding-bottom: .55rem;
}

.geninfo-profile-shell .row {
    row-gap: 0.85rem;
}

.geninfo-profile-shell .col-4,
.geninfo-profile-shell .col-md-4,
.geninfo-profile-shell .geninfo-form-column {
    background: transparent;
    border: 1px solid var(--app-border-muted);
    border-radius: 8px;
    padding: 0.9rem;
}

.geninfo-profile-shell .form-control,
.geninfo-profile-shell .form-select {
    border-radius: 6px;
    max-width: none;
}

.geninfo-profile-shell .mb-3 {
    margin-bottom: 0.75rem !important;
}

.geninfo-profile-shell .col-form-label {
    font-weight: 600;
    line-height: 1.2;
    padding-bottom: 0.25rem;
    padding-top: 0;
}

.geninfo-profile-shell p {
    margin-bottom: 0.75rem;
}

.geninfo-profile-shell .checkbox {
    margin-bottom: .35rem;
}

.geninfo-profile-shell .checkbox label {
    align-items: center;
    display: flex;
    gap: .4rem;
}

.geninfo-profile-shell .checkbox input {
    flex: 0 0 auto;
}

.geninfo-save-strip {
    align-items: center;
    border-top: 1px solid var(--app-border-color);
    display: flex;
    justify-content: flex-end;
    margin-top: 1.25rem;
    padding-top: 1rem;
}

.geninfo-read-shell .geninfo-profile-header {
    margin-bottom: 1rem;
}

.geninfo-read-list {
    display: grid;
    gap: .4rem .75rem;
    grid-template-columns: minmax(8rem, .85fr) minmax(0, 1.15fr);
    margin-bottom: 1.25rem;
}

.geninfo-read-list dt {
    color: var(--app-muted-color);
    font-size: .78rem;
    font-weight: 700;
    margin: 0;
}

.geninfo-read-list dd {
    margin: 0;
    min-width: 0;
    overflow-wrap: anywhere;
}

.geninfo-address-block {
    color: var(--app-text-color);
    line-height: 1.45;
    margin-bottom: 1rem;
}

.geninfo-section-card,
#customer-profile-pane > .card {
    border: 1px solid var(--app-border-color);
    border-radius: 8px;
    box-shadow: 0 8px 24px rgba(15, 23, 42, .06);
    margin-bottom: 1rem;
}

.profile-card-grid {
    display: grid;
    gap: 1rem;
    grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
}

.profile-card-grid + h5 {
    margin-top: 1.5rem;
}

.profile-info-card {
    background: var(--app-control-bg);
    border: 1px solid var(--app-border-muted);
    border-radius: 6px;
    padding: 1rem;
}

.profile-info-card-title {
    color: var(--app-text-color);
    font-size: var(--app-font-size-small);
    font-weight: 800;
    margin-bottom: 0.75rem;
    text-transform: uppercase;
}

.profile-field-list {
    display: flex;
    flex-direction: column;
    gap: 0.65rem;
    margin: 0;
}

.profile-field dt {
    color: var(--app-muted-color);
    font-size: var(--app-font-size-xs);
    font-weight: 700;
}

.profile-field dd {
    margin: 0;
    overflow-wrap: anywhere;
}

.profile-address-text {
    margin: 0;
    overflow-wrap: anywhere;
}

.profile-address-note {
    color: var(--app-muted-color);
    font-size: var(--app-font-size-small);
    margin-top: 0.75rem;
}

#customer-associated-pane .customer-records-header,
#customer-admin-pane .customer-records-header {
    border-bottom: 1px solid var(--app-border-color);
    margin-bottom: 1rem;
    padding-bottom: 0.75rem;
}

#customer-associated-pane .table {
    margin-bottom: 0;
}

#customer-profile-pane .customer-card-title {
    align-items: center;
    border-bottom: 1px solid var(--app-border-color);
    display: flex;
    justify-content: space-between;
    margin-bottom: 1rem;
    padding-bottom: .75rem;
}

#customer-profile-pane .customer-card-title span {
    font-size: 1.2rem;
    font-weight: 800;
}

#customer-profile-pane .customer-card-title .customer-card-title-text {
    display: grid;
    gap: 0.2rem;
    min-width: 0;
}

#customer-profile-pane .customer-card-title .customer-card-title-text small {
    color: var(--app-muted-color);
    font-size: var(--app-font-size-small);
    font-weight: 400;
    line-height: 1.3;
}

#customer-profile-pane .customer-card-title .customer-card-title-text span {
    line-height: 1.15;
}

#customer-profile-pane .customer-card-title + hr,
#customer-profile-pane h5 + hr {
    display: none;
}

#customer-profile-pane h5 {
    color: var(--app-text-color);
    font-weight: 800;
    letter-spacing: 0;
    margin: 1rem 0 .75rem;
}

#customer-profile-pane .table {
    margin-bottom: 0;
}

#customer-profile-pane .table th {
    color: var(--app-muted-color);
    font-size: .78rem;
    font-weight: 700;
    padding-left: 0;
    width: 44%;
}

#customer-profile-pane .table td {
    min-width: 0;
    overflow-wrap: anywhere;
    padding-right: 0;
}

#customer-profile-pane .row {
    row-gap: 1rem;
}

#customer-profile-pane .row > [class*="col"] > .card {
    background: var(--app-control-bg);
    border: 1px solid var(--app-border-muted);
    border-radius: 6px;
    box-shadow: none;
}

.geninfo-customer-page .card-title {
    align-items: center;
    display: flex;
    gap: 1rem;
    justify-content: space-between;
}

.geninfo-customer-page .card-title .btn {
    flex: 0 0 auto;
}

.geninfo-customer-page .card-title + br,
.geninfo-customer-page .card-title + br + hr,
.geninfo-customer-page .card-title + hr {
    display: none;
}

.geninfo-customer-page .alert.alert-primary {
    background: var(--app-control-bg);
    border-color: var(--app-border-muted);
    color: var(--app-text-color);
    margin-bottom: 0;
    padding: 0.65rem 0.75rem;
}

.geninfo-customer-page .alert.alert-primary p {
    margin: 0;
}

.geninfo-customer-page > .card,
.geninfo-customer-page .geninfo-section-card {
    margin-bottom: 1rem;
}

.geninfo-customer-page .row {
    row-gap: 1rem;
}

.geninfo-customer-page .row > [class*="col"] > .card {
    background: var(--app-control-bg);
    border: 1px solid var(--app-border-muted);
    border-radius: 6px;
    box-shadow: none;
}

.geninfo-customer-page .table {
    margin-bottom: 0;
}

.geninfo-customer-page .table th {
    color: var(--app-muted-color);
    font-size: 0.78rem;
    font-weight: 700;
    padding-left: 0;
    width: 44%;
}

.geninfo-customer-page .table td {
    min-width: 0;
    overflow-wrap: anywhere;
    padding-right: 0;
}

@media (max-width: 1199.98px) {
    .geninfo-profile-shell .col-4,
    .geninfo-profile-shell .geninfo-form-column,
    .geninfo-customer-page .col-4 {
        flex: 0 0 100%;
        max-width: 100%;
    }

    .geninfo-profile-shell {
        padding-bottom: 1.25rem;
    }

    .geninfo-profile-header {
        margin-bottom: 0.85rem;
        padding: 1rem;
    }

    .geninfo-profile-shell .row {
        row-gap: 0.7rem;
    }

    .geninfo-profile-shell .col-4,
    .geninfo-profile-shell .col-md-4,
    .geninfo-profile-shell .geninfo-form-column {
        padding: 0.8rem;
    }

    .geninfo-profile-shell > h5 {
        margin: 1rem 0 0.7rem;
        padding-bottom: 0.4rem;
    }

    .geninfo-save-strip {
        margin-top: 0.9rem;
        padding-top: 0.75rem;
    }
}

@media (max-width: 767.98px) {
    .institutional-settings-tabs-bar {
        align-items: stretch;
        flex-direction: column;
        gap: 0.65rem;
    }

    .institutional-settings-tabs {
        flex: 0 0 auto;
        min-width: 0;
    }

    .institutional-settings-autosave-status {
        margin-bottom: 0;
    }

    .geninfo-profile-header {
        gap: 0.75rem;
        padding: 0.8rem;
    }

    .geninfo-profile-header,
    .geninfo-profile-actions {
        flex-direction: column;
    }

    .geninfo-profile-header h2 {
        font-size: 1.45rem;
        margin-bottom: 0.25rem;
    }

    .geninfo-profile-meta {
        gap: 0.35rem;
    }

    .geninfo-profile-meta span {
        width: 100%;
    }

    .geninfo-profile-shell .col-4,
    .geninfo-profile-shell .col-md-4,
    .geninfo-profile-shell .geninfo-form-column {
        padding: 0.7rem;
    }

    .geninfo-profile-shell .mb-3 {
        margin-bottom: 0.65rem !important;
    }

    .geninfo-profile-actions,
    .geninfo-profile-actions .btn,
    .geninfo-save-strip .btn {
        width: 100%;
    }

    .geninfo-save-strip {
        justify-content: stretch;
    }

    .customer-admin-grid {
        grid-template-columns: 1fr;
    }

    .customer-admin-card .customer-records-actions,
    .customer-admin-card .customer-records-actions .btn {
        justify-content: stretch;
        width: 100%;
    }

    .geninfo-customer-page .card-title,
    .geninfo-customer-page .customer-records-header {
        align-items: stretch;
        flex-direction: column;
    }

    .geninfo-customer-page .card-title .btn,
    .geninfo-customer-page .customer-records-actions,
    .geninfo-customer-page .customer-records-actions .btn {
        justify-content: center;
        width: 100%;
    }
}

.password-policy-panel {
    background: var(--bs-info);
    border: 1px solid var(--app-border-color);
    border-radius: 4px;
    color: #fff;
    font-size: 0.86rem;
    line-height: 1.35;
    max-width: 100%;
    overflow-wrap: anywhere;
    padding: 1rem;
}

.password-policy-panel hr {
    border-color: rgba(255, 255, 255, 0.55);
    margin: 0.75rem 0;
}

.password-policy-panel li + li {
    margin-top: 0.35rem;
}

/* Narrow screens: status row (Customer Index, pills) on top, name/info group below.
   992px catches desktop narrowing before the name group gets squeezed.
   align-items:flex-start on the parent means children won't auto-stretch, so
   both children need explicit width:100% to fill the container. */
@media (max-width: 992px) {
    .customer-workspace-main {
        flex-direction: column-reverse;
    }

    .customer-workspace-main > div:first-child,
    .customer-workspace-status {
        width: 100%;
    }

    .customer-workspace-main > div:first-child {
        flex-basis: auto;
    }

    .customer-workspace-status {
        justify-content: flex-start;
    }

}

@container (max-width: 600px) {
    .customer-workspace-main {
        flex-direction: column-reverse;
    }

    .customer-workspace-main > div:first-child,
    .customer-workspace-status {
        width: 100%;
    }

    .customer-workspace-main > div:first-child {
        flex-basis: auto;
    }

    .customer-workspace-status {
        justify-content: flex-start;
    }

}

@media (max-width: 575.98px) {
    .customer-workspace-header {
        padding: 0.75rem;
    }

    .customer-context-item {
        flex-basis: 100%;
    }

    .customer-card-title .btn {
        width: 100%;
    }

    .customer-status-pill {
        white-space: normal;
    }

    .customer-workspace-quick-item-wide {
        grid-column: auto;
    }

    .customer-workspace-actions {
        border-bottom: 0;
        display: flex;
        gap: 0.4rem;
        flex-wrap: nowrap;
        margin-left: -0.75rem;
        margin-right: -0.75rem;
        overflow-x: auto;
        padding: 0.1rem 0.75rem 0.45rem;
        scrollbar-width: thin;
    }

    .customer-workspace-action {
        background: var(--app-control-bg);
        border-color: var(--app-border-color);
        border-radius: 4px;
        flex: 0 0 auto;
        justify-content: flex-start;
        margin-bottom: 0;
        min-height: 2.5rem;
        white-space: nowrap;
        width: auto;
    }

    .customer-workspace-action-active {
        background: rgba(0,0,0,.12);
        border-color: rgba(0,0,0,.28);
        border-left: 3px solid rgba(0,0,0,.34);
        box-shadow: none;
    }

    .customer-workspace-action-active::after {
        content: none;
    }

    .customer-work-card-header {
        display: block;
    }

    .customer-work-card-header .btn {
        margin-top: 0.75rem;
        width: 100%;
    }

    .spread-workflow-controls {
        grid-template-columns: 1fr;
    }

    .customer-records-header,
    .customer-records-toolbar {
        display: block;
    }

    .customer-records-card .card-body {
        padding: 0.85rem;
    }

    .customer-records-card div.dt-container {
        overflow-x: auto;
        -webkit-overflow-scrolling: touch;
    }

    .customer-records-actions,
    .customer-records-toolbar-actions {
        justify-content: flex-start;
        margin-top: 0.75rem;
    }

    .customer-records-actions .btn,
    .customer-records-toolbar-actions .btn {
        width: 100%;
    }

    .customer-records-card table[data-proag-table="standard"] {
        min-width: 36rem;
    }

    .customer-records-card table[data-proag-table="standard"] th,
    .customer-records-card table[data-proag-table="standard"] td {
        padding-left: 0.5rem;
        padding-right: 0.5rem;
    }

    .customer-records-card .table-actions {
        min-width: 8.5rem;
    }

    .customer-records-card .table-actions .btn {
        display: flex;
        margin: 0.2rem 0;
        width: 100%;
    }

    .customer-records-card div.dt-container .dt-layout-row {
        align-items: stretch;
        display: grid;
        gap: 0.5rem;
    }

    .customer-records-card div.dt-container .dt-search,
    .customer-records-card div.dt-container .dt-length {
        justify-content: flex-start;
    }

    .customer-records-card div.dt-container .dt-search input {
        width: 100%;
    }

    .certificate-review-actions {
        align-items: stretch;
        display: grid;
        gap: 0.75rem;
    }

    .certificate-review-actions .workflow-action-toolbar {
        justify-content: stretch;
    }

    .certificate-review-actions .workflow-action-toolbar .btn {
        width: 100%;
    }
}

.ez-inquiries-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    flex-wrap: wrap;
    gap: 0.75rem;
    margin-bottom: 1rem;
}

.ez-inquiries-filters {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    flex-wrap: wrap;
    gap: 0.5rem;
}

.ez-inquiries-filter {
    width: auto;
    min-width: 13rem;
}

@media (max-width: 575.98px) {
    .ez-inquiries-header,
    .ez-inquiries-filters,
    .ez-inquiries-filter {
        width: 100%;
    }
}

.app-brand {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    min-width: 0;
    margin-right: auto;
    padding-top: 0;
    padding-bottom: 0;
    white-space: nowrap;
}

.app-brand img {
    display: block;
    max-height: 44px;
    max-width: 140px;
    object-fit: contain;
}

.app-brand-name {
    overflow: hidden;
    text-overflow: ellipsis;
}


.app-type-switcher {
    flex: 0 0 auto;
}

.app-type-toggle .fa-layer-group {
    color: var(--app-muted-color);
    font-size: 0.95rem;
}
.app-header-actions {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    flex: 0 0 auto;
    gap: 0.5rem;
    margin-left: auto;
}


.app-account-menu {
    flex: 0 0 auto;
}

.app-account-toggle {
    display: inline-flex;
    align-items: center;
    gap: 0.45rem;
    min-height: 40px;
    border: 1px solid var(--app-border-color);
    border-radius: 4px;
    color: inherit;
    line-height: 1;
    padding: 0.45rem 0.65rem;
    background-color: var(--app-control-bg);
}

.app-account-toggle:hover,
.app-account-toggle:focus-visible,
.app-account-toggle.show {
    background-color: var(--app-control-bg-focus);
    border-color: rgba(0, 0, 0, 0.34);
}

.app-account-dropdown {
    min-width: 16rem;
}

.app-account-summary {
    display: grid;
    gap: 0.15rem;
    white-space: normal;
}

.app-account-summary-label {
    color: var(--app-muted-color);
    font-size: 0.78rem;
}

.app-account-summary-name {
    overflow-wrap: anywhere;
}

.app-footer {
    background-color: var(--app-theme-bg);
    border-top: 1px solid var(--app-border-muted);
    min-height: 40px;
}

.app-main {
    padding-top: 1.25rem;
    padding-bottom: 2.5rem;
}

.app-main-minimal {
    padding-top: 0;
    padding-bottom: 0;
}

.session-timeout-countdown {
    color: red;
}

.app-signature-pad {
    border: solid;
    position: relative;
    width: 100%;
    height: 200px;
    touch-action: none;
}

.app-signature-pad canvas {
    display: block;
}

.app-signature-pad-undo {
    position: absolute;
    top: 4px;
    right: 8px;
    font-size: 0.85rem;
}

.bold-readonly {
    background-color: #d0d0d0;
    color: #333;
    font-weight: bold;
}

.peer-naics-select2 .select2-container {
    display: block;
    width: 280px !important;
}

.peer-naics-select2 .select2-dropdown {
    min-width: 280px !important;
}

.app-workflow-nav .nav-link {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 0.35rem;
    font-size: 1rem;
}

.app-workflow-nav .nav-link i {
    font-size: 1.35rem;
    line-height: 1;
}

.app-schedule-nav .dropdown-toggle {
    display: inline-flex;
    align-items: center;
    gap: 0.25rem;
    min-height: 2.35rem;
}

.action-buttons {
    display: inline-flex;
    align-items: center;
    justify-content: flex-end;
    flex-wrap: wrap;
    gap: 0.35rem;
}

.action-buttons .btn,
.app-form-actions .btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 0.35rem;
}

.application-info-form {
    display: flex;
    flex-direction: column;
    gap: 1rem;
}

.application-info-form textarea.form-control {
    min-height: 3.75rem;
}

.app-form-actions {
    display: flex;
    justify-content: flex-end;
    gap: 0.5rem;
}

.input-group.w-75.ms-auto {
    max-width: 100%;
}

.app-form-grid {
    align-items: flex-start;
}

#dteIframe {
    min-height: 600px;
}
/* Monthly cash flow */
.mcf-td {
    width: 180px;
    min-width: 180px;
    max-width: 180px;
    border: 1px solid lightgrey;
}

.mcf-td-first {
    width: 300px;
    min-width: 300px;
    max-width: 300px;
    border: 1px solid lightgrey;
}

.mcf-table-wrapper {
    margin: auto;
    width: 100%;
}

    .mcf-table-wrapper thead th {
        position: sticky;
        top: 90px;
        z-index: 1001;
        background: #e9ecef;
        border-top: 1px solid lightgrey;
        border-bottom: 1px solid lightgrey;
        border-right: 1px solid lightgrey;
    }
.body-content {
    padding-left: 15px;
    padding-right: 15px;
}

/* Set widths on legacy form inputs since otherwise they're 100% wide */
input,
select,
.input-group {
    max-width: var(--app-field-max-width);
}

.inquiry-dropdown {
    height: 300px;
    overflow-y: scroll;
}

.form-control,
.form-select,
.input-group {
    max-width: var(--app-field-max-width);
}

textarea.form-control {
    max-width: 100%;
}

.input-group > .form-control,
.input-group > .form-select {
    max-width: none;
    min-width: 0;
}

.collateralinput {
    display: table-cell !important;
    margin-bottom: 0 !important;
    max-width: 100%;
    white-space: nowrap;
    width: auto;
}

.collateralinput > .form-control,
.collateralinput > .form-select {
    display: inline-block;
    max-width: none;
    min-width: 0 !important;
    vertical-align: middle;
    width: calc(100% - 2.25rem) !important;
}

.collateralinput > .input-group-text {
    align-items: center;
    display: inline-flex;
    justify-content: center;
    max-width: 2.25rem;
    min-width: 2.25rem;
    vertical-align: middle;
    width: 2.25rem;
}

td input {
    width: 100%;
    box-sizing: border-box;
}

.printalert {
    display: none;
}

.card {
    background: var(--app-surface);
    border-color: var(--app-border-muted);
    box-shadow: 0 1px 2px rgba(0, 0, 0, 0.04);
}

.chart-container {
    position: relative;
    width: 100%;
    min-height: 20rem;
}

.chart-container canvas {
    width: 100% !important;
    height: 100% !important;
}

.chart-standard {
    height: clamp(20rem, 40vh, 30rem);
}

.chart-tall {
    height: clamp(24rem, 60vh, 42rem);
}

.chart-compact {
    height: clamp(10rem, 25vh, 16rem);
    min-height: 10rem;
}

.loan-narrative-editor .ql-toolbar {
    background-color: var(--app-control-bg);
    border-color: var(--app-border-color);
    border-bottom: none;
}

.loan-narrative-editor .ql-container {
    height: 600px;
    overflow-y: auto;
    background-color: var(--app-control-bg);
    border-color: var(--app-border-color);
}

.loan-narrative-editor .ql-container:focus-within {
    background-color: var(--app-control-bg-focus);
}

.broadcast-message-editor .ql-toolbar {
    background-color: var(--app-control-bg);
    border-color: var(--app-border-color);
    border-bottom: none;
}

.broadcast-message-editor .ql-container {
    height: 140px;
    overflow-y: auto;
    background-color: var(--app-control-bg);
    border-color: var(--app-border-color);
}

.broadcast-message-editor .ql-container:focus-within {
    background-color: var(--app-control-bg-focus);
}

.disclosure-editor .ql-toolbar {
    background-color: var(--app-control-bg);
    border-color: var(--app-border-color);
    border-bottom: none;
}

.disclosure-editor .ql-container {
    height: 350px;
    overflow-y: auto;
    background-color: var(--app-control-bg);
    border-color: var(--app-border-color);
}

.disclosure-editor .ql-container:focus-within {
    background-color: var(--app-control-bg-focus);
}

.broadcast-recipients-table-wrap {
    max-height: 260px;
    overflow-y: auto;
}

/* ProAgQuill DTE field type (js/DTE/editor-field-types.js) */
.proag-quill-field .ql-editor {
    min-height: 8rem;
}

.pfs-view .statement-logo {
    max-width: 100%;
    height: auto;
}

.pfs-view .net-worth-summary {
    max-width: 34rem;
}

.pfs-view .net-worth-summary .row {
    padding: 0.35rem 0;
}

.pfs-review table {
    vertical-align: middle;
}

.pfs-review .card-body > table {
    display: block;
    width: 100%;
    max-width: 100%;
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
}

.loan-financial-review table {
    vertical-align: middle;
}

.loan-financial-review .card-body > table {
    display: block;
    width: 100%;
    max-width: 100%;
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
}

/* Bootstrap 5 defaults table cells to --bs-body-bg. Keep app tables transparent
   so tenant/page backgrounds show through like they did under Bootstrap 4. */
.table:not(.table-primary):not(.table-secondary):not(.table-success):not(.table-danger):not(.table-warning):not(.table-info):not(.table-light):not(.table-dark) {
    --bs-table-bg: transparent;
    --bs-table-accent-bg: transparent;
    --bs-table-striped-bg: rgba(255, 255, 255, 0.14);
    --bs-table-hover-bg: var(--app-surface-hover);
    --bs-table-active-bg: var(--app-surface-strong);
    /* Bootstrap also sets color directly on every th/td from --bs-table-color, which beats
       an ancestor's text-white (e.g. <tr class="bg-dark text-white">) even though that
       ancestor's color is !important - a direct rule always wins over inherited, no matter
       how it was set upstream. Inheriting here instead lets rows like that render as
       intended, the same way the background-color override above already does. */
    --bs-table-color: inherit;
}

div.dt-container,
div.dataTables_wrapper,
div.dt-container .dt-scroll,
div.dt-container .dt-scroll-head,
div.dt-container .dt-scroll-body,
div.dt-container .dt-scroll-foot,
div.dataTables_wrapper .dataTables_scroll,
div.dataTables_wrapper .dataTables_scrollHead,
div.dataTables_wrapper .dataTables_scrollBody,
div.dataTables_wrapper .dataTables_scrollFoot,
div.dtfc-top-blocker,
div.dtfc-bottom-blocker,
table.dataTable {
    background-color: transparent !important;
}

.DTEcontainer {
    max-width: 100%;
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
}

.DTEcontainer div.dt-container,
.DTEcontainer .dataTables_wrapper {
    min-width: 0;
}

div.dt-container .dt-layout-row {
    align-items: center;
    gap: 0.75rem;
}

div.dt-container .dt-layout-cell {
    min-width: 0;
}

div.dt-container .dt-layout-table,
div.dt-container .dt-layout-table .dt-layout-cell,
div.dt-container table.dataTable {
    width: 100% !important;
}

div.dt-container .dt-buttons {
    display: flex;
    flex-wrap: wrap;
    gap: 0.35rem;
}

div.dt-container .dt-buttons.btn-group {
    align-items: center;
}

div.dt-container .dt-buttons .btn {
    white-space: normal;
}

div.dt-container .dt-search,
div.dt-container .dt-length {
    display: flex;
    align-items: center;
    gap: 0.35rem;
    flex-wrap: wrap;
}

div.dt-container .dt-length label {
    margin: 0;
    white-space: nowrap;
}

div.dt-container .dt-length select {
    flex: 0 0 auto;
    width: auto;
    min-width: 5rem;
}

div.dt-container .dt-search input {
    max-width: 100%;
}

.customer-records-card div.dt-container {
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
}

.customer-records-card table[data-proag-table="standard"] {
    min-width: 42rem;
}

div.dt-container table.dataTable thead > tr > th,
div.dt-container table.dataTable thead > tr > td {
    position: relative !important;
    vertical-align: middle;
}

div.dt-container table.dataTable thead > tr > th.dt-orderable-asc,
div.dt-container table.dataTable thead > tr > th.dt-orderable-desc,
div.dt-container table.dataTable thead > tr > td.dt-orderable-asc,
div.dt-container table.dataTable thead > tr > td.dt-orderable-desc {
    padding-right: 1.75rem;
}

div.dt-container table.dataTable thead > tr > th span.dt-column-title,
div.dt-container table.dataTable thead > tr > td span.dt-column-title {
    display: inline-block;
    max-width: 100%;
}

div.dt-container table.dataTable thead > tr > th span.dt-column-order,
div.dt-container table.dataTable thead > tr > td span.dt-column-order {
    bottom: auto !important;
    height: 1rem;
    margin: 0;
    pointer-events: none;
    position: absolute !important;
    right: 0.45rem !important;
    top: 50% !important;
    transform: translateY(-50%);
    width: 0.8rem;
}

div.dt-container table.dataTable thead > tr > th.dt-orderable-none span.dt-column-order,
div.dt-container table.dataTable thead > tr > td.dt-orderable-none span.dt-column-order {
    display: none;
}

table.dataTable td.ignore-click,
table.dataTable td:has(> .btn),
table.dataTable td:has(> a > .btn),
table.dataTable td:has(> button.btn),
.table td.ignore-click,
.table td:has(> .btn),
.table td:has(> a > .btn),
.table td:has(> button.btn) {
    text-align: right;
    vertical-align: middle;
    white-space: nowrap;
}

table.dataTable td.ignore-click .btn,
table.dataTable td > .btn,
.table td.ignore-click .btn,
.table td > .btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 0.25rem;
    margin: 0.125rem 0;
}

.table-actions {
    text-align: right;
    white-space: normal;
}

.table-actions .btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 0.25rem;
    margin: 0.125rem 0 0.125rem 0.35rem;
    white-space: nowrap;
}

.customer-package-table .customer-package-action-column {
    max-width: 9.5rem;
    min-width: 9.5rem;
    text-align: center !important;
    white-space: nowrap;
    width: 9.5rem !important;
}

.customer-package-table .package-action-group {
    display: inline-flex;
    gap: 0.35rem;
    justify-content: center;
    white-space: nowrap;
}

.customer-package-table .package-action-group .btn {
    margin: 0;
}

.table,
table.dataTable,
div.dt-container {
    font-size: var(--app-font-size-table);
}

.customer-records-card table[data-proag-table="standard"].dataTable tbody td {
    text-align: left !important;
}

.customer-records-card table[data-proag-table="standard"].dataTable thead th,
.customer-records-card table[data-proag-table="standard"].dataTable thead td {
    text-align: left !important;
}

.customer-records-card table[data-proag-table="standard"].dataTable thead th.text-center,
.customer-records-card table[data-proag-table="standard"].dataTable thead td.text-center,
.customer-records-card table[data-proag-table="standard"].dataTable tbody td.text-center {
    text-align: center !important;
}

.customer-records-card table[data-proag-table="standard"].dataTable thead th.text-end,
.customer-records-card table[data-proag-table="standard"].dataTable thead td.text-end,
.customer-records-card table[data-proag-table="standard"].dataTable tbody td.text-end,
.customer-records-card table[data-proag-table="standard"].dataTable tbody td.ignore-click,
.customer-records-card table[data-proag-table="standard"].dataTable tbody td:has(> .btn),
.customer-records-card table[data-proag-table="standard"].dataTable tbody td:has(> a > .btn),
.customer-records-card table[data-proag-table="standard"].dataTable tbody td:has(> button.btn) {
    text-align: right !important;
}

.workflow-action-toolbar {
    display: flex;
    flex-wrap: wrap;
    justify-content: flex-end;
    gap: 0.5rem;
}

.workflow-action-toolbar .btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 0.35rem;
    min-width: 8.75rem;
}

.action-buttons .btn,
.app-form-actions .btn,
.table-actions .btn,
.workflow-action-toolbar .btn,
div.dt-container .dt-buttons .btn {
    margin: 0;
}

.btn.d-block.w-auto.ms-auto {
    display: inline-flex !important;
    align-items: center;
    justify-content: center;
    gap: 0.35rem;
    width: fit-content !important;
    max-width: 100%;
}

.card-title {
    line-height: 1.25;
}

.card-title .btn {
    vertical-align: middle;
}

.card-body > :last-child {
    margin-bottom: 0;
}

.modal-footer {
    gap: 0.5rem;
}

.modal-footer .btn {
    margin: 0;
}

table.dataTable tbody tr.selected > *,
table.dataTable tbody tr.selected:hover > *,
.table tbody tr.selected > * {
    --bs-table-bg: rgba(13, 110, 253, 0.2);
    --bs-table-accent-bg: rgba(13, 110, 253, 0.2);
    background-color: rgba(13, 110, 253, 0.2) !important;
}

.table tbody tr.customer-index-row-training > *,
table.dataTable tbody tr.customer-index-row-training > * {
    --bs-table-bg: rgba(178, 108, 0, 0.08);
    --bs-table-accent-bg: rgba(178, 108, 0, 0.08);
    background-color: rgba(178, 108, 0, 0.08) !important;
}

.table tbody tr.customer-index-row-training:hover > *,
table.dataTable tbody tr.customer-index-row-training:hover > * {
    --bs-table-bg: rgba(178, 108, 0, 0.13);
    --bs-table-accent-bg: rgba(178, 108, 0, 0.13);
    background-color: rgba(178, 108, 0, 0.13) !important;
}

.table td.customer-index-status-training,
table.dataTable td.customer-index-status-training {
    background-color: rgba(178, 108, 0, 0.18) !important;
    font-weight: 700;
}

.table tbody tr.customer-index-row-inactive > *,
table.dataTable tbody tr.customer-index-row-inactive > * {
    --bs-table-bg: rgba(220, 53, 69, 0.08);
    --bs-table-accent-bg: rgba(220, 53, 69, 0.08);
    background-color: rgba(220, 53, 69, 0.08) !important;
}

.table tbody tr.customer-index-row-inactive:hover > *,
table.dataTable tbody tr.customer-index-row-inactive:hover > * {
    --bs-table-bg: rgba(220, 53, 69, 0.13);
    --bs-table-accent-bg: rgba(220, 53, 69, 0.13);
    background-color: rgba(220, 53, 69, 0.13) !important;
}

/* Carousel */
.carousel-caption p {
    font-size: 20px;
    line-height: 1.4;
}

/* QR code generator */
#qrCode {
    margin: 15px;
}

/* Hide/rearrange for smaller screens */
@media screen and (max-width: 767px) {
    .workflow-action-toolbar {
        display: grid;
        grid-template-columns: 1fr;
    }

    .workflow-action-toolbar .btn {
        width: 100%;
    }

    /* Hide captions */
    .carousel-caption {
        display: none;
    }

    body {
        padding-top: 60px;
        padding-bottom: 0;
    }

    .app-header {
        min-height: 60px;
    }

    .app-header-inner {
        padding-left: 0.5rem;
        padding-right: 0.5rem;
        gap: 0.35rem;
    }

    .app-sidebar-toggle {
        width: 38px;
        height: 38px;
        padding: 0;
    }

    .app-brand {
        flex: 1 1 auto;
        max-width: none;
    }

    .app-brand img {
        max-height: 42px;
        max-width: 98px;
    }

    .app-brand-name {
        display: none;
    }

    .app-header-actions {
        gap: 0.35rem;
    }


    .app-account-label {
        display: none;
    }
    .app-type-current {
        display: inline-block;
        max-width: 6rem;
        overflow: hidden;
        text-overflow: ellipsis;
        white-space: nowrap;
        vertical-align: middle;
    }

    body > .container-fluid {
        padding-left: 0.5rem;
        padding-right: 0.5rem;
    }

    #content {
        padding: 0.5rem;
        min-width: 0;
        max-width: 100%;
        overflow-x: hidden;
    }

    input,
    select,
    textarea,
    .input-group {
        max-width: 100%;
    }

    .breadcrumb {
        display: flex;
        flex-wrap: nowrap;
        overflow-x: auto;
        white-space: nowrap;
        padding-bottom: 0.25rem;
        margin-bottom: 0.5rem;
        font-size: var(--app-font-size-small);
    }

    .app-mobile-scroll-nav {
        display: flex;
        width: 100%;
        max-width: 100%;
        min-width: 0;
        flex-wrap: nowrap;
        justify-content: flex-start;
        overflow-x: auto;
        overflow-y: hidden;
        -webkit-overflow-scrolling: touch;
        overscroll-behavior-x: contain;
        scroll-snap-type: x proximity;
        gap: 0.35rem;
        padding: 0.25rem 0 0.55rem;
        margin-left: 0;
        margin-right: 0;
        scrollbar-gutter: stable;
    }

    .app-mobile-scroll-nav > .nav-item {
        flex: 0 0 auto;
        min-width: max-content;
        scroll-snap-align: start;
    }

    .app-mobile-scroll-nav .nav-link,
    .app-nav a {
        white-space: nowrap;
    }

    .app-workflow-nav {
        border-bottom: 1px solid rgba(0, 0, 0, 0.2);
    }

    .app-workflow-nav .nav-link {
        min-height: 2.5rem;
        padding: 0.35rem 0.65rem;
        border-radius: 0.25rem;
        font-size: 0.85rem;
    }

    .app-workflow-nav .nav-link i {
        font-size: 1rem;
    }

    .applicationNav,
    .applicationNavActive,
    .applicationNav:hover {
        margin: 0;
        border-bottom-width: 2px;
    }

    .applicationNavActive .nav-link,
    .CustomerApplicationActive a {
        background: rgba(255,255,255, 0.22);
    }

    .app-schedule-nav {
        font-size: 0.85rem;
        border-bottom: 1px solid rgba(0, 0, 0, 0.2);
    }

    .app-schedule-nav > .nav-item {
        flex-basis: min(18rem, 78vw);
    }

    .app-schedule-nav .dropdown {
        position: static;
    }

    .app-schedule-nav .dropdown-menu {
        width: min(92vw, 24rem);
        max-height: 60vh;
        overflow-y: auto;
    }

    .app-schedule-nav .dropdown-toggle {
        display: flex;
        width: 100%;
        justify-content: center;
        min-height: 2.35rem;
        padding: 0.35rem 0.65rem;
    }

    .application-info-form {
        gap: 0.85rem;
    }

    .application-info-form textarea.form-control {
        min-height: 4rem;
    }

    .app-form-actions {
        justify-content: stretch;
    }

    .app-form-actions .btn {
        width: 100%;
        min-height: 2.75rem;
    }

    .app-form-grid {
        --bs-gutter-y: 0.85rem;
    }

    .table-responsive,
    table.table-responsive,
    .dt-container,
    .dataTables_wrapper {
        max-width: 100%;
        overflow-x: auto;
        -webkit-overflow-scrolling: touch;
    }

    div.dt-container .dt-layout-row {
        align-items: stretch;
    }

    div.dt-container .dt-layout-cell {
        width: 100%;
    }

    div.dt-container .dt-layout-row:first-child {
        align-items: center;
        display: flex;
        flex-wrap: wrap;
        gap: 0.5rem 0.75rem;
    }

    div.dt-container .dt-layout-row:first-child .dt-layout-cell {
        flex: 1 1 14rem;
        width: auto;
    }

    div.dt-container .dt-layout-row:first-child .dt-layout-cell:first-child {
        flex: 0 0 auto;
    }

    div.dt-container .dt-buttons,
    div.dt-container .dt-search,
    div.dt-container .dt-length {
        justify-content: flex-start;
    }

    div.dt-container .dt-length {
        flex-wrap: nowrap;
    }

    div.dt-container .dt-length label {
        font-size: 0;
    }

    div.dt-container .dt-length label::after {
        content: "Rows";
        font-size: 0.95rem;
    }

    div.dt-container .dt-length select {
        width: 5rem;
        min-width: 5rem;
    }

    div.dt-container .dt-search input {
        flex: 1 1 12rem;
    }

    div.DTE div.DTE_Form_Content {
        max-height: 62vh;
        overflow-y: auto;
        -webkit-overflow-scrolling: touch;
    }

    div.DTE div.DTE_Footer,
    div.DTE div.DTE_Form_Buttons {
        display: flex;
        flex-wrap: wrap;
        gap: .5rem;
        justify-content: stretch;
    }

    div.DTE div.DTE_Footer .btn,
    div.DTE div.DTE_Form_Buttons .btn {
        flex: 1 1 100%;
        margin: 0 !important;
    }

    .input-group.w-75.ms-auto {
        width: 100% !important;
        margin-left: 0 !important;
    }

    .card {
        margin-bottom: 0.75rem;
    }

    .card-body {
        padding: 0.75rem;
        max-width: 100%;
        overflow-x: auto;
    }

    .card-title {
        display: flex;
        align-items: center;
        justify-content: space-between;
        gap: 0.5rem;
        flex-wrap: wrap;
        font-size: 1.1rem;
        line-height: 1.25;
    }

    .card-title .btn,
    .card-title .float-end {
        float: none !important;
        margin-left: 0;
    }

    .mobile-stacked-grid > .row {
        --bs-gutter-x: 0.75rem;
        --bs-gutter-y: 0.75rem;
    }

    .mobile-stacked-grid > .row > .col {
        flex: 0 0 100%;
        max-width: 100%;
    }

    #content .alert {
        margin-bottom: 0;
        padding: 0.65rem 0.75rem;
    }

    #content .alert .btn {
        width: 100%;
        padding: 0;
        text-align: left;
        white-space: normal;
    }

    #content .alert b.float-start {
        float: none !important;
        display: block;
        margin-bottom: 0.15rem;
    }

    .card .table-borderless {
        min-width: 0;
    }

    .card .table-borderless tbody,
    .card .table-borderless tr,
    .card .table-borderless th,
    .card .table-borderless td {
        display: block;
        width: 100%;
    }

    .card .table-borderless tr {
        padding: 0.45rem 0;
        border-bottom: 1px solid rgba(0,0,0,0.08);
    }

    .card .table-borderless tr:last-child {
        border-bottom: 0;
    }

    .card .table-borderless th,
    .card .table-borderless td {
        padding: 0;
    }

    .card .table-borderless th {
        margin-bottom: 0.15rem;
        font-size: 0.78rem;
        text-transform: uppercase;
        color: var(--app-muted-color);
    }

    .card .table-borderless td {
        overflow-wrap: anywhere;
    }

    .pagination.justify-content-end {
        justify-content: flex-start !important;
    }

    #dteIframe {
        height: 70vh;
        min-height: 520px;
    }

    .navbar.fixed-bottom {
        position: static;
        display: flex;
        justify-content: center;
        gap: 0.25rem 0.75rem;
        padding-top: 0.5rem;
        padding-bottom: 0.5rem;
        flex-wrap: wrap;
    }

    .navbar.fixed-bottom .nav-link {
        padding: 0.15rem 0.35rem;
        font-size: 0.75rem;
    }
}

.scrollable-menu {
    height: auto;
    max-height: 200px;
    overflow-x: hidden;
}

@media (min-width: 768px) {
    .modal-xl {
        width: 50%;
        max-width: 1200px;
    }
}

.multi-steps > li.is-active:before, .multi-steps > li.is-active ~ li:before {
    content: counter(stepNum);
    font-family: inherit;
    font-weight: 700;
}

.multi-steps > li.is-active:after, .multi-steps > li.is-active ~ li:after {
    background-color: #ededed;
}

.multi-steps {
    display: table;
    table-layout: fixed;
    width: 100%;
}

    .multi-steps > li {
        counter-increment: stepNum;
        text-align: center;
        display: table-cell;
        position: relative;
        color: var(--app-muted-color);
    }

        .multi-steps > li:before {
            content: '\f00c';
            content: '\2713;';
            content: '\10003';
            content: '\10004';
            content: '\2713';
            display: block;
            margin: 0 auto 4px;
            background-color: #52b788;
            width: 36px;
            height: 36px;
            line-height: 32px;
            text-align: center;
            font-weight: bold;
            border-width: 2px;
            border-style: solid;
            border-color: #52b788;
            border-radius: 75%;
        }

        .multi-steps > li:after {
            content: '';
            height: 2px;
            width: 100%;
            background-color: #a0c4ff;
            position: absolute;
            top: 16px;
            left: 50%;
            z-index: -1;
        }

        .multi-steps > li:last-child:after {
            display: none;
        }

        .multi-steps > li.is-active:before {
            background-color: #a0c4ff;
            border-color: #a0c4ff;
        }

        .multi-steps > li.is-active ~ li {
            color: #808080;
        }

            .multi-steps > li.is-active ~ li:before {
                background-color: #ededed;
                border-color: #ededed;
            }

.breadcrumb {
    align-items: center;
    background-color: transparent;
    font-size: var(--app-font-size-small);
    gap: 0.25rem 0.35rem;
}

.breadcrumb-item + .breadcrumb-item {
    padding-left: 0;
}

.breadcrumb-item + .breadcrumb-item::before {
    color: var(--app-muted-color);
    content: ">";
    padding-right: 0.35rem;
}

.wrapper {
    display: flex;
    width: 100%;
    align-items: flex-start;
    perspective: 1500px;
}

#sidebar {
    position: sticky;
    top: 72px;
    align-self: flex-start;
    min-width: 250px;
    max-width: 250px;
    max-height: calc(100vh - 112px);
    overflow-y: auto;
    overscroll-behavior: contain;
    background-color: var(--app-theme-bg, #e5e8eb);
    border-right: 1px solid var(--app-border-muted);
    transition: all 0.6s cubic-bezier(0.945, 0.020, 0.270, 0.665);
    transform-origin: bottom left;
    flex: 0 0 250px;
    z-index: 1010;
}

    #sidebar.active,
    html.sidebar-collapsed-init #sidebar {
        margin-left: -250px;
        transform: rotateY(100deg);
    }

    #sidebar .sidebar-header {
        padding: 20px;
        background: #6d7fcc;
    }

    #sidebar ul.components {
        padding: 10px 0;
    }

    #sidebar ul p {
        color: #fff;
        padding: 10px;
    }

    #sidebar ul li.active > a,
    #sidebar a[aria-expanded="true"] {
        background: var(--app-surface-strong);
        border-radius: 4px;
    }

a[data-bs-toggle="collapse"] {
    position: relative;
}

#sidebar .dropdown-toggle::after {
    display: block;
    position: absolute;
    top: 50%;
    right: 20px;
    transform: translateY(-50%);
}

ul ul a {
    font-size: 0.9em !important;
    padding-left: 30px !important;
}

ul.CTAs {
    padding: 20px;
}

    ul.CTAs a {
        text-align: center;
        font-size: 0.9em !important;
        display: block;
        border-radius: 5px;
        margin-bottom: 5px;
    }

/* ---------------------------------------------------
    CONTENT STYLE
----------------------------------------------------- */
#content {
    width: 100%;
    flex: 1 1 auto;
    min-width: 0;
    padding: 10px;
    min-height: 100vh;
    transition: all 0.3s;
}

/* Inquiry-mode DTE pages render this same #content wrapper inside an iframe (see
   Views/DTE/.../Cash.cshtml etc. - the #content div isn't conditional on Model.Modal, only the
   sidebar partial next to it is), and autoSizeDteIframe (dte-navigation.js) sets the iframe's own
   height directly from that page's measured content height. 100vh inside an iframe is relative to
   the IFRAME's OWN viewport, i.e. exactly the height autoSizeDteIframe just set - so #content's
   min-height:100vh floor rises every time the iframe grows even slightly (sub-pixel rounding,
   scrollbar reflow, etc.), which grows the measured content height again, which grows the iframe
   again: an unbounded feedback loop with no natural resting point, visible as the page (and the
   modal within it) endlessly growing/scrolling. .app-main-minimal is the wrapper _Layout.cshtml
   applies specifically for iframe-embedded ("modal") pages (ViewData["UseMinimalLayout"]), so
   removing the viewport-relative floor only there breaks the loop without affecting #content's
   ordinary full-page usage. */
.app-main-minimal #content {
    min-height: 0;
}

#sidebarCollapse {
    width: 40px;
    height: 40px;
    cursor: pointer;
}

/* ---------------------------------------------------
    MEDIAQUERIES
----------------------------------------------------- */
@media (max-width: 768px) {
    #sidebar {
        position: fixed;
        top: 60px;
        bottom: 0;
        left: 0;
        margin-left: 0;
        height: calc(100vh - 60px);
        max-height: calc(100vh - 60px);
        transform: translateX(-100%);
        box-shadow: 0.5rem 0 1rem rgba(0, 0, 0, 0.16);
    }

        #sidebar.active {
            margin-left: 0;
            transform: translateX(0);
        }

    #sidebarCollapse span:first-of-type,
    #sidebarCollapse span:nth-of-type(2),
    #sidebarCollapse span:last-of-type {
        transform: none;
        opacity: 1;
        margin: 5px auto;
    }

    #sidebarCollapse.active span {
        margin: 0 auto;
    }

        #sidebarCollapse.active span:first-of-type {
            transform: rotate(45deg) translate(2px, 2px);
        }

        #sidebarCollapse.active span:nth-of-type(2) {
            opacity: 0;
        }

        #sidebarCollapse.active span:last-of-type {
            transform: rotate(-45deg) translate(1px, -1px);
        }
}
/* ---------------------------------------------------
    Branches List Box Styling
----------------------------------------------------- */

.analytics-box {
    background: rgba(255,255,255,0.2);
    border-radius: 4px;
    border: 1px solid lightgrey;
    color: black;
    display: flex;
    flex-direction: column;
    font-family: sans-serif;
    padding: 15px;
    text-decoration: none;
    margin-bottom: 1rem;
}

    .analytics-box p {
        margin-bottom: 5px;
    }

.Analytics-Number {
    color: #3862ac;
    font-size: 23px;
    font-weight: 500;
}

.Analytics-Display {
    color: grey;
    font-size: var(--app-font-size-small);
}

.analytics-icon {
    float: left;
    margin-right: 15px;
    font-size: 25px;
    color: #dddddd;
    text-align: center;
    vertical-align: middle;
    padding-top: 12px;
}
/* ---------------------------------------------------
    Chart Legend Styling
----------------------------------------------------- */

td .legend-box {
    display: inline-block;
    height: 14px;
    width: 40px;
    margin-right: 5px;
    margin-left: 10px;
    border: none;
}

/* ---------------------------------------------------
   Application Navbar Styling
----------------------------------------------------- */
.applicationNav {
    border-radius: 0.25rem;
    border-bottom: solid 4px var(--app-border-muted);
    color: var(--app-muted-color);
    margin: 2px;
}

.nav-pills .nav-link.active {
    background-color: var(--app-surface-strong);
    color: var(--app-link-color);
}

.app-nav.active {
    border-radius: 0.25rem;
    border-bottom: solid 2px var(--app-link-color);
    color: var(--app-muted-color);
    margin: 2px;
    background-color: var(--app-surface-strong);
}

.applicationNav:hover {
    border-radius: 0.25rem;
    border-bottom: solid 4px var(--app-muted-color);
    color: var(--app-muted-color);
    margin: 2px;
}

.applicationNav a {
    color: var(--app-muted-color);
}

    .applicationNav a .nav-pills .nav-link.active, .nav-pills .show > .nav-link {
        color: var(--app-muted-color);
        padding: 0.5rem 1rem;
        background-color: var(--app-surface-strong);
    }

.applicationNavActive {
    border-radius: 0.25rem;
    border-bottom: solid 4px var(--app-link-color);
    color: var(--app-link-color);
    margin: 2px;
}

    .applicationNavActive a {
        color: black;
        padding-bottom: -1px;
    }

.CustomerApplicationActive {
    font-weight: bolder;
    border-bottom: solid 2px var(--app-link-color);
    padding-bottom: 5px;
}

    .CustomerApplicationActive a {
        color: black;
    }
/* ---------------------------------------------------
   Radio button Styling
----------------------------------------------------- */
.radio-inline {
    margin: 10px;
    padding: 5px;
}

/* ---------------------------------------------------
   sidebar Styling
----------------------------------------------------- */

@keyframes sidebar-icon-jingle {
    0% {
        transform: rotate(0deg) translateX(0);
    }

    18% {
        transform: rotate(9deg) translateX(1px);
    }

    36% {
        transform: rotate(-8deg) translateX(-1px);
    }

    54% {
        transform: rotate(5deg) translateX(1px);
    }

    72% {
        transform: rotate(-4deg) translateX(0);
    }

    100% {
        transform: rotate(0deg) translateX(0);
    }
}

.sidebar-wrapper .sidebar-brand > a,
.sidebar-wrapper .sidebar-dropdown > a:after,
.sidebar-wrapper .sidebar-menu .sidebar-dropdown .sidebar-submenu li a:before,
.sidebar-wrapper ul li a i,
.sidebar-wrapper .sidebar-search input.search-menu,
.sidebar-wrapper .sidebar-search .input-group-text,
.sidebar-wrapper .sidebar-menu ul li a {
    -webkit-transition: all 0.3s ease;
    -moz-transition: all 0.3s ease;
    -ms-transition: all 0.3s ease;
    -o-transition: all 0.3s ease;
    transition: all 0.3s ease;
}

/*----------------sidebar-wrapper----------------*/

.sidebar-wrapper ul {
    list-style-type: none;
    padding: 0;
    margin: 0;
}

.sidebar-wrapper a {
    text-decoration: none;
    color: black;
}

/*----------------sidebar-content----------------*/

.sidebar-content {
    max-height: calc(100% - 30px);
    height: calc(100% - 30px);
    overflow-y: auto;
    position: relative;
}

    .sidebar-content.desktop {
        overflow-y: hidden;
    }

/*--------------------sidebar-brand----------------------*/

.sidebar-wrapper .sidebar-brand {
    padding: 10px 12px;
    display: flex;
    align-items: center;
    border-bottom: 1px solid var(--app-border-color);
    min-height: 42px;
    cursor: pointer;
}

    .sidebar-wrapper .sidebar-menu-tabs {
        display: grid;
        grid-template-columns: minmax(5rem, 0.8fr) minmax(0, 1.2fr);
        gap: 0.35rem;
        padding: 0.5rem;
        border-bottom: 1px solid var(--app-border-color);
    }

        .sidebar-wrapper .sidebar-menu-tabs .nav-link {
            display: inline-flex;
            align-items: center;
            justify-content: center;
            gap: 0.4rem;
            min-width: 0;
            padding: 0.45rem 0.55rem;
            border: 1px solid transparent;
            border-radius: 4px;
            color: black;
            font-weight: 600;
            line-height: 1.15;
        }

            .sidebar-wrapper .sidebar-menu-tabs .nav-link.active {
                background-color: var(--app-surface-strong);
                border-color: var(--app-border-color);
                color: black;
            }

            .sidebar-wrapper .sidebar-menu-tabs .nav-link:not(.active):hover,
            .sidebar-wrapper .sidebar-menu-tabs .nav-link:not(.active):focus-visible {
                background-color: var(--app-surface-hover);
                color: black;
            }

        .sidebar-wrapper .sidebar-menu-tabs .sidebar-tab-label {
            min-width: 0;
            overflow: hidden;
            text-overflow: ellipsis;
            white-space: nowrap;
        }

    .sidebar-wrapper .sidebar-tab-content {
        min-width: 0;
    }

    .sidebar-wrapper .sidebar-brand > a {
        display: flex;
        align-items: center;
        gap: 0.5rem;
        color: black;
        text-transform: uppercase;
        font-weight: bold;
        flex-grow: 1;
        padding-top: 3px;
    }

        .sidebar-wrapper .sidebar-brand > a .sidebar-brand-indicator {
            margin-left: auto;
        }

        .sidebar-wrapper .sidebar-brand > a .sidebar-brand-label {
            min-width: 0;
            overflow: hidden;
            text-overflow: ellipsis;
            white-space: nowrap;
        }

/*----------------------sidebar-menu-------------------------*/

.sidebar-wrapper .sidebar-menu {
    padding-bottom: 10px;
}

    .sidebar-wrapper .sidebar-menu .header-menu span {
        font-weight: bold;
        font-size: 16px;
        padding: 15px 20px 5px 20px;
        color: black;
        display: inline-block;
    }

    .sidebar-wrapper .sidebar-menu ul li a {
        display: flex;
        align-items: center;
        gap: 0.5rem;
        width: 100%;
        color: black;
        position: relative;
        padding: 0.45rem 2rem 0.45rem 0.75rem;
        font-size: var(--app-font-size-sidebar);
        line-height: 1.2;
        border-radius: 4px;
        text-decoration: none;
    }

        .sidebar-wrapper .sidebar-menu ul li a i {
            flex: 0 0 1.35rem;
            margin-right: 0;
            font-size: var(--app-font-size-sidebar);
            width: 1.35rem;
            height: 1.35rem;
            line-height: 1.35rem;
            text-align: center;
            color: black;
            border-radius: 4px;
            border-color: var(--app-border-color);
        }

        .sidebar-wrapper .sidebar-menu ul li a:hover > i,
        .sidebar-wrapper .sidebar-menu ul li a:focus-visible > i,
        .sidebar-wrapper .sidebar-menu ul li a:hover > svg.svg-inline--fa,
        .sidebar-wrapper .sidebar-menu ul li a:focus-visible > svg.svg-inline--fa {
            display: inline-block;
            transform-box: fill-box;
            transform-origin: center;
            animation: sidebar-icon-jingle 0.48s ease-in-out 1;
            color: black;
        }

        @media (prefers-reduced-motion: reduce) {
            .sidebar-wrapper .sidebar-menu ul li a:hover > i,
            .sidebar-wrapper .sidebar-menu ul li a:focus-visible > i,
            .sidebar-wrapper .sidebar-menu ul li a:hover > svg.svg-inline--fa,
            .sidebar-wrapper .sidebar-menu ul li a:focus-visible > svg.svg-inline--fa {
                animation: none;
            }
        }

        .sidebar-wrapper .sidebar-menu ul li a:hover {
            background: var(--app-surface-hover);
            text-decoration: none;
        }

    .sidebar-wrapper .sidebar-menu ul li.active > a {
        background: var(--app-surface-strong);
        font-weight: 600;
    }

    .sidebar-wrapper .sidebar-menu ul ul a {
        padding-left: 2.6rem !important;
        font-size: var(--app-font-size-compact) !important;
    }

    .sidebar-wrapper .sidebar-menu > div:not(.collapse):not([id]) {
        display: flex;
        align-items: center;
        gap: 0.5rem;
        padding: 0.5rem 0.75rem;
        color: dimgray;
        font-size: var(--app-font-size-compact);
        overflow-wrap: anywhere;
    }

        .sidebar-wrapper .sidebar-menu > div:not(.collapse):not([id]) i {
            flex: 0 0 1.35rem;
            text-align: center;
        }

/*------scroll bar---------------------*/

::-webkit-scrollbar {
    width: 5px;
    height: 7px;
}

::-webkit-scrollbar-button {
    width: 0px;
    height: 0px;
}

::-webkit-scrollbar-thumb {
    background: #525965;
    border: 0px none #ffffff;
    border-radius: 0px;
}

    ::-webkit-scrollbar-thumb:hover {
        background: #525965;
    }

    ::-webkit-scrollbar-thumb:active {
        background: #525965;
    }

::-webkit-scrollbar-track {
    background: transparent;
    border: 0px none #ffffff;
    border-radius: 50px;
}

    ::-webkit-scrollbar-track:hover {
        background: transparent;
    }

    ::-webkit-scrollbar-track:active {
        background: transparent;
    }

::-webkit-scrollbar-corner {
    background: transparent;
}
/*------theme color changes---------------------*/

p a {
    color: var(--app-link-color);
    text-decoration: none;
}

a {
    color: var(--app-link-color);
    text-decoration: none;
}

.app-nav {
    color: var(--app-muted-color);
    text-decoration: none;
    border-bottom: 1px solid var(--app-border-muted);
    margin: 5px;
}

    .app-nav a {
        color: var(--app-muted-color);
        text-decoration: none;
    }

td a {
    color: var(--app-link-color);
    text-decoration: underline;
}

.breadcrumb-item a {
    color: var(--app-muted-color);
    text-decoration: underline;
}

.page-link,
.page-link:hover,
.page-link:focus,
.page-item.active .page-link,
.page-item.disabled .page-link {
    background-color: transparent !important;
    border-color: transparent !important;
    color: inherit !important;
    box-shadow: none !important;
}

.page-item.disabled .page-link {
    opacity: 0.5;
}





.bg-warning {
    background-color: #FAECBB !important;
}

.bg-danger {
    background-color: #FFB6B3 !important;
}

.bg-success {
    background-color: #BDE7BD !important;
}

.alert {
    border: none;
}

.alert-primary {
    background-color: var(--app-surface-strong);
    border-left: 5px solid var(--app-muted-color);
    border-bottom: 1px solid var(--app-border-color);
}

.form-control,
.form-select,
.input-group-text,
.dropzone {
    background-color: var(--app-control-bg) !important;
    border-color: var(--app-border-color);
}

    .form-control:focus,
    .form-select:focus {
        background-color: var(--app-control-bg-focus) !important;
        border-color: rgba(0, 0, 0, 0.34);
        box-shadow: 0 0 0 0.16rem rgba(0, 0, 0, 0.08);
    }

.form-control:disabled,
.form-select:disabled,
.form-control[readonly],
.form-control:read-only {
    background-color: var(--app-control-bg-disabled) !important;
    box-shadow: none !important;
}

input[type=checkbox]:focus {
    outline: 1px solid rgba(0, 0, 0, 0.2);
}

input[type=checkbox] {
    background-color: #DDD;
    border-radius: 2px;
    -webkit-appearance: none;
    -moz-appearance: none;
    width: 17px;
    height: 17px;
    cursor: pointer;
    position: relative;
    top: 5px;
}

    input[type=checkbox]:checked {
        background-color: var(--app-control-bg);
        background: black url("data:image/gif;base64,R0lGODlhCwAKAIABAP////3cnSH5BAEKAAEALAAAAAALAAoAAAIUjH+AC73WHIsw0UCjglraO20PNhYAOw==") 3px 3px no-repeat;
    }

a:not([href]):not([tabindex]):hover, a:not([href]):not([tabindex]):focus {
    text-decoration: underline;
}

.btn {
    border-radius: 5px;
    font-size: var(--app-font-size-button);
    padding: 0.45rem 0.65rem;
}

.btn-primary,
.btn-success,
.btn-danger,
.btn-secondary {
    background-color: #5f6368;
    color: white;
    padding-right: 10px;
    border: 1px solid #5f6368;
    outline: none;
}

.btn-outline-primary {
    background-color: var(--app-control-bg);
    color: var(--app-muted-color);
    padding-right: 10px;
    border: 1px solid var(--app-border-color);
    outline: none;
}

.btn-primary:is(:hover, :focus, :active, .active),
.btn-success:is(:hover, :focus, :active, .active),
.btn-danger:is(:hover, :focus, :active, .active),
.btn-outline-primary:is(:hover, :focus, :active, .active),
.btn-primary:not(:disabled):not(.disabled):is(:active, .active),
.btn-success:not(:disabled):not(.disabled):is(:active, .active),
.btn-danger:not(:disabled):not(.disabled):is(:active, .active),
.btn-outline-primary:not(:disabled):not(.disabled):is(:active, .active),
.show > .btn-primary.dropdown-toggle,
.show > .btn-success.dropdown-toggle,
.show > .btn-danger.dropdown-toggle,
.show > .btn-outline-primary.dropdown-toggle {
    background-color: #4f5357 !important;
    color: white;
    text-decoration: underline;
    padding-right: 10px;
    border: 1px solid #4f5357;
    outline: 0 !important;
}

.btn-primary:disabled,
.btn-success:disabled {
    background-color: rgba(192,192,192,0.5);
    color: var(--app-muted-color);
    padding-right: 10px;
    border: 1px solid var(--app-border-color);
    outline: none;
}

input[type="button"] {
    outline: none;
}

.btn-primary i,
.btn-success i,
.btn-secondary i,
.btn-danger i {
    border: 1px solid var(--app-border-color);
    padding: 5px;
    background-color: white;
    border-radius: 50px;
}

.btn-primary i,
.btn-success i,
.btn-secondary i {
    color: var(--app-muted-color);
}

.btn-outline-primary:hover i {
    color: white;
}

.fa-trash, .fa-lock {
    color: #c82333;
}

.fa-unlock {
    color: green;
}

.btn-danger i {
    color: #c82333;
}

.deleteicon {
    padding: 10px;
    color: #c82333;
    background-color: var(--app-control-bg);
    border: none;
}

.btn-outline-primary i {
    padding: 5px;
    color: var(--app-muted-color);
    border-bottom-left-radius: 5px;
    border-top-left-radius: 5px;
}

.bg-light {
    background-color: rgba(192,192,192,0.3) !important;
}

/* ---------------------------------------------------
   Business Valuation BS & IE
----------------------------------------------------- */

#nav-tab.nav-pills .nav-link {
    border-radius: 0.25rem;
    border-bottom: solid 4px #808080;
    color: #808080;
    margin: 2px;
    background-color: white;
}

    #nav-tab.nav-pills .nav-link.active {
        border-radius: 0.25rem;
        border-bottom: solid 4px black;
        color: black;
        margin: 2px;
        background-color: white;
    }

.scrollBox {
    height: 150px;
    overflow-y: scroll;
    border-style: solid;
    border-width: 1px;
}
/*Accordion*/
.accordion {
    background-color: #eee;
    color: #444;
    cursor: pointer;
    padding: 18px;
    width: 100%;
    border: none;
    text-align: left;
    outline: none;
    font-size: 15px;
    transition: 0.4s;
}

    .accordion.active,
    .accordion:hover {
        background-color: #ccc;
    }

    .accordion:after {
        content: '\002B';
        color: #777;
        font-weight: bold;
        float: right;
        margin-left: 5px;
    }

.accordion.active:after {
    content: "\2212";
}

#timeOutWarningOverlay {
    position: fixed;
    display: none;
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background-color: rgba(0,0,0,0.5);
    z-index: 2000;
    cursor: pointer;
}

.autoCalculate {
    text-align: center;
    display: block;
    font-size: var(--app-font-size-xs);
}

.mb-3 .select2-container {
    display: block;
    width: 100%;
}

.select2-container--default .select2-selection--single {
    box-sizing: border-box;
    width: 100%;
    background-color: var(--app-control-bg) !important;
    border: 1px solid var(--app-border-color);
    height: calc(2.25rem + 2px);
    padding: 0;
    display: flex;
    align-items: center;
}

.select2-container--default.select2-container--focus .select2-selection--single,
.select2-container--default.select2-container--open .select2-selection--single {
    background-color: var(--app-control-bg-focus) !important;
}

    .select2-container--default .select2-selection--single .select2-selection__rendered {
        box-sizing: border-box;
        width: 100%;
        color: inherit;
        line-height: calc(2.25rem);
        padding-left: .75rem;
        padding-right: 2rem;
        margin: 0;
    }

    .select2-container--default .select2-selection--single .select2-selection__arrow {
        height: calc(2.25rem);
        right: 6px;
    }
.select2-container .selection,
.select2-container .select2-selection--single {
    max-width: 100%;
}

/* ---------------------------------------------------
   Shared utility classes for legacy reports and PDFs
----------------------------------------------------- */

.u-w-2 {
    width: 2%;
}

.u-w-4 {
    width: 4%;
}

.u-w-5 {
    width: 5%;
}

.u-w-6 {
    width: 6%;
}

.u-w-7 {
    width: 7%;
}

.u-w-8 {
    width: 8%;
}

.u-w-9 {
    width: 9%;
}

.u-w-10 {
    width: 10%;
}

.u-w-11 {
    width: 11%;
}

.u-w-15 {
    width: 15%;
}

.u-w-18 {
    width: 18%;
}

.u-w-19 {
    width: 19%;
}

.u-w-20 {
    width: 20%;
}

.u-w-21 {
    width: 21%;
}

.u-w-22 {
    width: 22%;
}

.u-w-24 {
    width: 24%;
}

.u-w-25 {
    width: 25%;
}

.u-w-30 {
    width: 30%;
}

.u-w-34 {
    width: 34%;
}

.u-w-35 {
    width: 35%;
}

.u-w-40 {
    width: 40%;
}

.u-w-45 {
    width: 45%;
}

.u-w-48 {
    width: 48%;
}

.u-w-49 {
    width: 49%;
}

.u-w-50 {
    width: 50%;
}

.u-w-55 {
    width: 55%;
}

.u-w-60 {
    width: 60%;
}

.u-w-70 {
    width: 70%;
}

.u-w-75 {
    width: 75%;
}

.u-w-80 {
    width: 80%;
}

.u-w-72 {
    width: 72%;
}

.u-w-7-5 {
    width: 7.5%;
}

.u-w-85 {
    width: 85%;
}

.u-w-90 {
    width: 90%;
}

.u-max-w-1200 {
    max-width: 1200px;
}

.u-max-w-600 {
    max-width: 600px;
}

.u-max-w-80 {
    max-width: 80%;
}

.u-max-vh-70 {
    max-height: 70vh;
}

.u-min-w-100 {
    min-width: 100%;
}

.u-field-narrow {
    max-width: var(--app-field-narrow-max-width) !important;
}

.u-field-default {
    max-width: var(--app-field-max-width) !important;
}

.u-field-wide {
    max-width: var(--app-field-wide-max-width) !important;
}

.u-field-full {
    max-width: 100% !important;
    width: 100% !important;
}

.u-min-vh-100 {
    min-height: 100vh;
}

.u-w-220px {
    width: 220px;
}

.u-w-3350px {
    width: 3350px;
}

.u-h-38 {
    height: 38px;
}

.u-h-54 {
    height: 54px;
}

.u-h-58 {
    height: 58px;
}

.u-h-86 {
    height: 86px;
}

.u-h-162 {
    height: 162px;
}

.u-h-250 {
    height: 250px;
}

.u-h-350 {
    height: 350px;
}

.u-h-700 {
    height: 700px;
}

.u-h-750 {
    height: 750px;
}

.u-h-100 {
    height: 100%;
}

.u-chart-40 {
    height: 40vh;
    width: 40vw;
}

.u-chart-60 {
    height: 60vh;
    position: relative;
    width: 80vw;
}

.u-scroll-max-235 {
    max-height: 235px;
    overflow: auto;
}

.u-text-indent-30 {
    text-indent: 30px;
}

.u-nowrap {
    white-space: nowrap;
}

.u-pdf-meta-table {
    table-layout: fixed;
}

.u-pdf-meta-table th,
.u-pdf-meta-table td {
    line-height: 1.25;
    vertical-align: top;
}

.u-pdf-meta-name {
    width: 25%;
}

.u-pdf-meta-date {
    width: 22%;
}

.u-pdf-meta-description {
    width: 53%;
}

.u-overflow-hidden {
    overflow: hidden;
}

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

.u-fw-400 {
    font-weight: 400;
}

.u-font-small {
    font-size: small;
}

.u-font-smaller {
    font-size: smaller;
}

.u-font-10 {
    font-size: 10px;
}

.u-font-11 {
    font-size: 11px;
}

.u-font-12 {
    font-size: 12px;
}

.u-font-large {
    font-size: large;
}

.u-font-medium {
    font-size: medium;
}

.u-color-brand {
    color: #3A563D;
}

.u-text-white {
    color: white;
}

.u-text-red {
    color: red;
}

.u-bg-lightgrey {
    background-color: lightgrey;
}

.u-bg-lightblue {
    background-color: lightblue;
}

.u-bg-grey {
    background-color: grey;
}

.u-bg-report-muted {
    background-color: #BDC3C7;
}

.u-bg-white {
    background-color: white;
}

.u-text-blue {
    color: blue;
}

.u-text-leaf {
    color: #588157;
}

.u-text-sage {
    color: #a3b18a;
}

.u-p-10 {
    padding: 10px;
}

.u-pr-15 {
    padding-right: 15px;
}

.u-mr-2 {
    margin-right: 2px;
}

.u-ml-2 {
    margin-left: 2px;
}

.u-mr-10 {
    margin-right: 10px;
}

.u-mb-10 {
    margin-bottom: 10px;
}

.u-ms-5px {
    margin-left: 5px;
}

.u-marketing-color-swatch {
    border: 1px solid #999;
    border-radius: 3px;
    display: inline-block;
    height: 18px;
    margin-right: 8px;
    vertical-align: middle;
    width: 18px;
}

.u-audit-key-cell {
    background-color: transparent;
    font-weight: bold;
    text-align: right;
    width: 15%;
}

.u-audit-value-cell {
    background-color: transparent;
    font-weight: bold;
    text-align: left;
    width: 85%;
}

.u-dte-transparent-table {
    border: none;
    border-bottom-color: transparent;
}

.u-review-balance-spacer {
    height: 136px;
}

.u-loan-compliant {
    background-color: #d4edda;
    border-bottom: 1px solid black;
    color: #155724;
}

.u-loan-noncompliant {
    background-color: #f8d7da;
    border-bottom: 1px solid black;
    color: #721c24;
}

.u-report-rule-margin {
    margin: 0.1em auto;
}

.u-report-rule-margin-wide {
    margin: 0.5em auto;
}

.u-column-200 {
    column-width: 200px;
}

.u-border-spacing-0 {
    border-spacing: 0;
}

.u-border-collapse {
    border-collapse: collapse;
}

.u-align-content-center {
    align-content: center;
}

.u-gap-20 {
    gap: 20px;
}

.u-report-rule-brand {
    border-bottom: 1px solid #3A563D;
    margin: 0.1em auto;
    width: 100%;
}

.u-report-rule-brand-strong {
    border: 2px solid #3A563D;
    margin: 0.1em auto;
    width: 100%;
}

.u-report-rule-brand-box {
    border: 1px solid #3A563D;
    margin: 0.5em auto;
}

.u-report-rule-black {
    border-bottom: 1px solid black;
    margin: 0.1em auto;
}

.u-report-rule-black-strong {
    border-bottom: 2px solid black;
    margin: 0.1em auto;
}

.u-border-brand {
    border: 2px solid #3A563D;
}

.u-border-bottom-brand {
    border-bottom: 1px solid #3A563D;
}

.u-border-bottom-brand-strong {
    border-bottom: 2px solid #3A563D;
}

.u-border-top-brand {
    border-top: 1px solid #3A563D;
}

.u-border-top-brand-strong {
    border-top: 2px solid #3A563D;
}

.u-border-y-brand {
    border-bottom: 1px solid #3A563D;
    border-top: 1px solid #3A563D;
}

.u-border-bottom-light {
    border-bottom: 1pt solid lightgrey;
}

.u-border-bottom-black {
    border-bottom: 1px solid black;
}

.u-border-black {
    border: 1px solid #000000;
}

.u-border-bottom-black-strong {
    border-bottom: 2px solid black;
}

.u-border-bottom-grey-strong {
    border-bottom: 2px solid grey;
}

.u-border-bottom-light-strong {
    border-bottom: 2px solid lightgrey;
}

.u-border-bottom-current-strong {
    border-bottom: 2px solid;
}

.u-border-right-black {
    border-right: 1px solid black;
}

.u-border-top-hidden {
    border-top: hidden;
}

.u-border-top-light-2 {
    border-top: 2px solid lightgrey;
}

.u-border-top-black-2 {
    border-top: 2pt solid black;
}

.u-border-top-muted {
    border-top: 1px solid #B1B1B1;
}

.u-page-break-avoid {
    page-break-inside: avoid !important;
}

.u-page-break-auto {
    page-break-inside: auto !important;
}

.u-page-break-after {
    page-break-after: always;
}

.u-page-break-after-important {
    page-break-after: always !important;
}

.u-page-break-after-avoid {
    page-break-after: avoid !important;
}

.u-page-break-after-auto {
    page-break-after: auto;
}

.u-page-break-before {
    page-break-before: always !important;
}

.u-report-table {
    width: 100%;
    page-break-inside: avoid !important;
}

.u-report-table-nowrap {
    width: 100%;
    page-break-inside: avoid !important;
    white-space: nowrap;
}

/* ---------------------------------------------------
   Admin utility views
----------------------------------------------------- */

.ua-legend {
    background: #fff;
    border-bottom: 1px solid #e9ecef;
    position: sticky;
    top: 0;
    z-index: 1030;
}

.ua-legend .swatch {
    border-radius: 2px;
    display: inline-block;
    height: 14px;
    margin-right: .5rem;
    vertical-align: middle;
    width: 14px;
}

.ua-legend .ua-legend-item {
    margin-right: 1rem;
}

#dbList,
#dbList .list-group-item {
    background-color: transparent !important;
}

#dbList .list-group-item.active {
    background-color: rgba(13, 110, 253, .12) !important;
    border-color: #0d6efd;
    color: inherit;
}

#queryResultsTable td,
#queryResultsTable th {
    white-space: nowrap;
}

#tableList {
    border: 1px solid #ddd;
    height: calc(100vh - 150px);
    overflow-y: auto;
    padding: 5px;
}

.column-details {
    border-collapse: collapse;
    width: 100%;
}

.column-details th,
.column-details td {
    border: 1px solid #ccc;
    padding: 5px;
    text-align: left;
}

.column-details th {
    background-color: #f2f2f2;
}

/* ---------------------------------------------------
   Standalone PDF documents
----------------------------------------------------- */

.u-pdf-form textarea {
    border: none;
    display: block;
    min-height: 60px;
    overflow: hidden;
    resize: none;
    width: 100%;
}

.u-pdf-avoid-rows tr {
    page-break-inside: avoid;
}

.u-pdf-freeform {
    overflow-wrap: break-word;
    word-wrap: break-word;
}

.u-pdf-freeform p {
    overflow-wrap: break-word;
    white-space: pre-wrap;
    word-wrap: break-word;
}

.loan-narrative-freeform {
    overflow-wrap: break-word;
    white-space: normal;
    width: 100%;
    word-wrap: break-word;
}

.loan-narrative-freeform p,
.loan-narrative-freeform div,
.loan-narrative-freeform li {
    overflow-wrap: break-word;
    white-space: normal;
    word-wrap: break-word;
}

.loan-narrative-freeform .ql-size-small {
    font-size: 0.75em;
}

.loan-narrative-freeform .ql-size-large {
    font-size: 1.5em;
}

.loan-narrative-freeform .ql-size-huge {
    font-size: 2.5em;
}

.loan-narrative-freeform img {
    display: block;
    height: auto;
    margin: 8px 0;
    max-height: 850px;
    max-width: 650px;
    width: auto;
}

.loan-narrative-freeform table {
    max-width: 100%;
    table-layout: fixed;
    width: 100%;
    word-wrap: break-word;
}

.pdf-schedule-table {
    font-size: smaller;
    page-break-inside: avoid !important;
}
/* Historical IE/BS action buttons should move as one group instead of each button self-aligning. */
.historical-action-buttons {
    display: flex;
    flex-wrap: wrap;
    justify-content: flex-end;
    align-items: center;
    gap: 0.5rem;
}

.historical-action-buttons .btn {
    margin-left: 0 !important;
}

@media (max-width: 575.98px) {
    .historical-action-buttons {
        flex-direction: column;
        align-items: stretch;
    }

    .historical-action-buttons .btn {
        width: 100% !important;
    }
}
/* Keep grouped right-aligned action buttons together even if legacy button markup still carries ms-auto. */
.d-flex.justify-content-end.flex-wrap.gap-2 > .btn.ms-auto,
.d-flex.justify-content-end.flex-wrap.gap-2 > .ms-auto.btn {
    margin-left: 0 !important;
}
/* Shared action bars for page-level workflow commands such as PDF, Save, and package actions. */
.page-action-bar,
.app-form-actions,
.workflow-action-toolbar {
    display: flex;
    flex-wrap: wrap;
    justify-content: flex-end;
    align-items: center;
    gap: 0.5rem;
    margin-bottom: 0.75rem;
}

.page-action-bar .btn,
.app-form-actions .btn,
.workflow-action-toolbar .btn {
    margin-left: 0 !important;
}

.page-action-button {
    display: block;
    margin-left: auto;
    width: max-content;
}

.amount-input-group {
    width: 75%;
    margin-left: auto;
    flex-wrap: nowrap;
    min-width: 0;
}

.mobile-stacked-grid .input-group {
    flex-wrap: nowrap;
    min-width: 0;
}

.mobile-stacked-grid .input-group .form-control {
    min-width: 0;
}

.tab-pane > .table,
.tab-pane > form > .table {
    min-width: 48rem;
}

.view-mode-switcher {
    margin-bottom: 1rem;
}

.view-mode-switcher .nav-link {
    background-color: transparent !important;
    border-color: transparent !important;
    color: rgba(0,0,0,.65);
}

.view-mode-switcher .nav-link:hover,
.view-mode-switcher .nav-link:focus {
    background-color: rgba(0,0,0,.06) !important;
    color: rgba(0,0,0,.9);
}

.view-mode-switcher .nav-link.active {
    background-color: rgba(0,0,0,.14) !important;
    border-color: rgba(0,0,0,.22) rgba(0,0,0,.22) transparent !important;
    color: #111 !important;
    font-weight: 600;
}

.balance-sheet-side-switcher .nav {
    margin-top: 0;
}

.balance-sheet-side-switcher {
    align-items: flex-start;
    display: flex;
    flex-wrap: wrap;
    gap: 0.75rem;
    justify-content: space-between;
    margin-bottom: 0.75rem;
}

.balance-sheet-side-switcher .nav {
    flex: 1 1 auto;
    row-gap: 0.25rem;
}

.balance-sheet-side-switcher .nav-link {
    align-items: center;
    display: inline-flex;
    gap: 0.35rem;
    white-space: nowrap;
}

.balance-sheet-side-switcher > .btn {
    flex: 0 0 auto;
}

.balance-sheet-tab-metric {
    background: rgba(0,0,0,.08);
    border-radius: 999px;
    color: var(--app-muted-color);
    font-size: 0.68rem;
    font-weight: 700;
    line-height: 1;
    padding: 0.22rem 0.38rem;
}

.balance-sheet-side-switcher .nav-link.active .balance-sheet-tab-metric {
    background: rgba(255,255,255,.5);
    color: var(--app-text-color);
}

.balance-sheet-active-summary {
    align-items: center;
    color: var(--app-muted-color);
    display: flex;
    flex: 1 1 100%;
    flex-wrap: wrap;
    font-size: 0.86rem;
    gap: 0.4rem 1rem;
    justify-content: flex-start;
    line-height: 1.25;
}

.balance-sheet-active-summary strong {
    color: var(--app-text-color);
}

.balance-sheet-side-switcher + .nav-tabs {
    margin-top: 0.25rem !important;
}

.balance-sheet-side-row.balance-sheet-side-filtered > [class*="col"] {
    flex: 0 0 100%;
    max-width: 100%;
}

.historical-balance-sheet-form .balance-sheet-side-row > [class*="col"] > .row:has(.input-group),
.balance-sheet-vector-summary .balance-sheet-side-row > [class*="col"] > .row:has(> [class*="col"]:nth-child(4)) {
    align-items: center;
    column-gap: 1rem;
    display: grid;
    grid-template-columns: minmax(12rem, 1fr) minmax(14rem, 0.8fr);
    margin-left: 0;
    margin-right: 0;
}

.historical-balance-sheet-form .balance-sheet-side-row > [class*="col"] > .row:has(.input-group):has(> [class*="col"]:nth-child(4)),
.balance-sheet-vector-summary .balance-sheet-side-row > [class*="col"] > .row:has(> [class*="col"]:nth-child(4)) {
    grid-template-columns: minmax(12rem, 1fr) minmax(2.75rem, max-content) minmax(4.75rem, max-content) minmax(14rem, 0.8fr);
}

.historical-balance-sheet-form .balance-sheet-side-row > [class*="col"] > .row:has(.input-group) > [class*="col"],
.balance-sheet-vector-summary .balance-sheet-side-row > [class*="col"] > .row:has(> [class*="col"]:nth-child(4)) > [class*="col"] {
    min-width: 0;
    padding-left: 0;
    padding-right: 0;
    width: auto;
}

.historical-balance-sheet-form .balance-sheet-side-row .input-group,
.balance-sheet-vector-summary .balance-sheet-side-row .amount-input-group {
    margin-left: 0;
    min-width: 0;
    flex-wrap: nowrap;
    width: 100%;
}

.historical-balance-sheet-form .balance-sheet-side-row .input-group-text,
.balance-sheet-vector-summary .balance-sheet-side-row .input-group-text {
    flex: 0 0 2.25rem;
    justify-content: center;
}

/* Table cells rendering a currency/count/percent value rely on this for right alignment under
   their (typically text-end) header — many tables only right-align the header and leave the
   data <td> at the default left alignment, which visually detaches values from wide
   "Amount"-style columns. Scoped to <td>/<th> only: these classes are also used on <input>,
   <div>, and <span> elsewhere for JS-driven formatting/masking, where left alignment is correct
   and shouldn't change. Scoped rules below become redundant with this but are left in place. */
td.currency, th.currency,
td.bignumbers, th.bignumbers,
td.percentage, th.percentage {
    text-align: right;
}

.historical-balance-sheet-form .balance-sheet-side-row .currency,
.historical-balance-sheet-form .balance-sheet-side-row .currencynosign,
.balance-sheet-vector-summary .balance-sheet-side-row .currency,
.balance-sheet-vector-summary .balance-sheet-side-row .currencynosign {
    text-align: right;
}

.historical-income-expense-form table.table {
    table-layout: fixed;
}

.historical-income-expense-form table.table .input-group {
    flex-wrap: nowrap;
    margin-bottom: 0 !important;
    min-width: 0;
    width: 100%;
}

.historical-income-expense-form table.table .input-group-text {
    flex: 0 0 2.25rem;
    justify-content: center;
}

.historical-income-expense-form table.table .currency,
.historical-income-expense-form table.table .currencynosign {
    text-align: right;
}

@media (max-width: 991.98px) {
    #content {
        padding: 0.65rem;
    }

    .card {
        margin-bottom: 0.85rem;
    }

    .card-body {
        padding: 0.85rem;
    }

    .customer-records-header,
    .customer-records-toolbar {
        margin-bottom: 0.75rem;
    }

    .customer-records-actions,
    .customer-records-toolbar-actions,
    .page-action-bar,
    .app-form-actions,
    .workflow-action-toolbar {
        gap: 0.4rem;
    }

    .table-actions {
        gap: 0.35rem;
    }

    .table > :not(caption) > * > * {
        padding-top: 0.5rem;
        padding-bottom: 0.5rem;
    }

    .historical-balance-sheet-form .balance-sheet-side-row > [class*="col"] > .row:has(.input-group),
    .historical-balance-sheet-form .balance-sheet-side-row > [class*="col"] > .row:has(.input-group):has(> [class*="col"]:nth-child(4)) {
        grid-template-columns: minmax(0, 1fr);
        row-gap: 0.25rem;
    }
}

@media (max-width: 767.98px) {
    .page-action-bar,
    .app-form-actions,
    .workflow-action-toolbar {
        gap: 0.4rem;
        justify-content: stretch;
        margin-bottom: 0.55rem;
    }

    .page-action-bar .btn,
    .app-form-actions .btn,
    .workflow-action-toolbar .btn {
        min-height: 2.5rem;
        width: 100% !important;
    }

    .page-action-button {
        margin-left: 0 !important;
        width: 100% !important;
    }

    .amount-input-group {
        width: 100% !important;
        margin-left: 0 !important;
    }

    .tab-pane {
        overflow-x: auto;
        -webkit-overflow-scrolling: touch;
    }

    #content {
        padding: 0.45rem;
    }

    .card {
        border-radius: 6px;
        margin-bottom: 0.65rem;
    }

    .card-body {
        padding: 0.7rem;
    }

    .card-title {
        gap: 0.4rem;
        margin-bottom: 0.55rem;
    }

    .customer-records-header,
    .customer-records-toolbar {
        gap: 0.55rem;
        margin-bottom: 0.65rem;
    }

    .customer-records-toolbar {
        padding: 0.55rem;
    }

    .customer-records-actions,
    .customer-records-toolbar-actions,
    .table-actions {
        gap: 0.35rem;
    }

    .table-actions .btn {
        min-height: 2.35rem;
    }

    .table > :not(caption) > * > * {
        padding: 0.45rem 0.5rem;
    }
}

/* Shared content tabs. Keep workflow bars and sidebar switchers visually distinct. */
:is(.app-tabs, .nav-tabs:not(.sidebar-menu-tabs), .nav-pills:not(.app-workflow-nav):not(.sidebar-menu-tabs)) {
    border-bottom: 1px solid var(--app-border-color);
    gap: 0.15rem;
}

:is(.app-tabs, .nav-tabs:not(.sidebar-menu-tabs), .nav-pills:not(.app-workflow-nav):not(.sidebar-menu-tabs)) .nav-item {
    flex: 0 0 auto;
}

:is(.app-tabs, .nav-tabs:not(.sidebar-menu-tabs), .nav-pills:not(.app-workflow-nav):not(.sidebar-menu-tabs)) .nav-link {
    background-color: transparent !important;
    border-color: transparent !important;
    color: var(--app-muted-color) !important;
    font-weight: 500;
    transition: background-color .15s ease-in-out, border-color .15s ease-in-out, color .15s ease-in-out, box-shadow .15s ease-in-out;
}

:is(.app-tabs, .nav-tabs:not(.sidebar-menu-tabs)) .nav-link {
    border-radius: 4px 4px 0 0;
}

:is(.app-tabs.nav-pills, .nav-pills:not(.app-workflow-nav):not(.sidebar-menu-tabs)) .nav-link {
    border-radius: 4px;
}

:is(.app-tabs, .nav-tabs:not(.sidebar-menu-tabs), .nav-pills:not(.app-workflow-nav):not(.sidebar-menu-tabs)) .nav-link:hover,
:is(.app-tabs, .nav-tabs:not(.sidebar-menu-tabs), .nav-pills:not(.app-workflow-nav):not(.sidebar-menu-tabs)) .nav-link:focus-visible {
    background-color: var(--app-surface-hover) !important;
    border-color: transparent !important;
    color: var(--app-text-color) !important;
    box-shadow: none !important;
}

:is(.app-tabs, .nav-tabs:not(.sidebar-menu-tabs), .nav-pills:not(.app-workflow-nav):not(.sidebar-menu-tabs)) .nav-link.active,
:is(.app-tabs, .nav-tabs:not(.sidebar-menu-tabs), .nav-pills:not(.app-workflow-nav):not(.sidebar-menu-tabs)) .show > .nav-link {
    background-color: var(--app-surface-strong) !important;
    border-color: var(--app-border-color) var(--app-border-color) transparent !important;
    color: var(--app-text-color) !important;
    font-weight: 700;
    box-shadow: inset 0 2px 0 rgba(0,0,0,.18), 0 0 8px rgba(0,0,0,.05);
}

:is(.app-tabs.nav-pills, .nav-pills:not(.app-workflow-nav):not(.sidebar-menu-tabs)) .nav-link.active,
:is(.app-tabs.nav-pills, .nav-pills:not(.app-workflow-nav):not(.sidebar-menu-tabs)) .show > .nav-link {
    border-color: var(--app-border-color) !important;
}

@media (max-width: 767.98px) {
    :is(.app-tabs, .nav-tabs:not(.sidebar-menu-tabs), .nav-pills:not(.app-workflow-nav):not(.sidebar-menu-tabs)) {
        flex-wrap: nowrap;
        max-width: 100%;
        overflow-x: auto;
        overflow-y: hidden;
        -webkit-overflow-scrolling: touch;
    }

    :is(.app-tabs, .nav-tabs:not(.sidebar-menu-tabs), .nav-pills:not(.app-workflow-nav):not(.sidebar-menu-tabs)) .nav-link {
        min-height: 2.5rem;
        white-space: nowrap;
    }
}