.report-page{--report-blue:#2563eb;--report-green:#198754;--report-orange:#f59e0b;--report-red:#dc3545;--report-purple:#7c3aed;--report-slate:#64748b;font-family:inherit}.report-page .bm-page-header{align-items:flex-start;margin-bottom:1.5rem}.report-title-wrap{display:flex;gap:1rem;align-items:flex-start}.report-title-icon{display:inline-grid;place-items:center;width:3rem;height:3rem;border-radius:.9rem;background:rgba(37,99,235,.1);color:var(--report-blue);font-size:1.35rem;flex:0 0 auto}.report-header-meta{display:flex;flex-wrap:wrap;gap:.5rem 1.25rem;color:var(--bs-secondary-color);font-size:.82rem;margin-top:.65rem}.report-header-meta i{margin-right:.35rem}.report-toolbar{display:flex;gap:.5rem;flex-wrap:wrap;align-items:center}.report-filter-card{padding:1rem 1.1rem;margin-bottom:1.5rem;overflow:visible}.report-filter-card .form-label{font-size:.78rem;font-weight:700;text-transform:uppercase;letter-spacing:.025em;color:var(--bs-secondary-color)}.report-summary-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(190px,1fr));gap:1rem;margin-bottom:1.5rem}.report-summary-card{position:relative;display:flex;align-items:center;gap:.9rem;overflow:hidden;padding:1rem 1.1rem;border:1px solid var(--bs-border-color);border-radius:1rem;background:var(--bs-body-bg);box-shadow:0 .35rem 1rem rgba(15,23,42,.05)}.report-summary-card::before{content:"";position:absolute;inset:0 auto 0 0;width:.3rem;background:var(--report-accent,var(--report-blue))}.report-summary-icon{display:grid;place-items:center;width:2.7rem;height:2.7rem;border-radius:.8rem;background:color-mix(in srgb,var(--report-accent) 12%,transparent);color:var(--report-accent);font-size:1.2rem;flex:0 0 auto}.report-summary-card small{display:block;color:var(--bs-secondary-color);font-weight:700;font-size:.76rem;text-transform:uppercase;letter-spacing:.025em}.report-summary-card .report-value{color:var(--report-accent);font-size:1.45rem;font-weight:800;line-height:1.2;font-variant-numeric:tabular-nums}.report-tone-success{--report-accent:var(--report-green)}.report-tone-warning{--report-accent:var(--report-orange)}.report-tone-danger{--report-accent:var(--report-red)}.report-tone-info{--report-accent:var(--report-blue)}.report-tone-purple{--report-accent:var(--report-purple)}.report-tone-neutral{--report-accent:var(--report-slate)}.report-visual-grid{display:grid;grid-template-columns:minmax(0,1.15fr) minmax(300px,.85fr);gap:1rem;margin-bottom:1.5rem}.report-chart-panel{padding:1rem 1.15rem;min-height:300px}.report-chart-header{display:flex;justify-content:space-between;align-items:flex-start;gap:1rem;margin-bottom:.75rem}.report-chart-title{font-weight:800}.report-chart-subtitle{color:var(--bs-secondary-color);font-size:.84rem}.report-chart-wrap{position:relative;height:240px}.report-table-card{overflow:visible}.report-table-card .table-responsive{max-height:none;overflow-y:visible}.report-table{margin:0}.report-table thead th{position:sticky;top:0;z-index:2;background:var(--bs-body-bg);box-shadow:inset 0 -1px var(--bs-border-color);white-space:nowrap;font-size:.78rem;text-transform:uppercase;letter-spacing:.025em;color:var(--bs-secondary-color)}.report-table tbody tr:hover{background:rgba(37,99,235,.04)}.report-table td,.report-table th{padding:.9rem 1rem;vertical-align:middle}.report-table .text-end{font-variant-numeric:tabular-nums}.report-entity-card{display:inline-flex;align-items:center;gap:.7rem;text-decoration:none;color:inherit}.report-entity-avatar{display:grid;place-items:center;width:2.25rem;height:2.25rem;border-radius:.7rem;background:rgba(37,99,235,.1);color:var(--report-blue);font-weight:800;flex:0 0 auto}.report-entity-main{display:block;font-weight:750;color:var(--bs-link-color)}.report-entity-sub{display:block;color:var(--bs-secondary-color);font-size:.78rem;margin-top:.05rem}.report-entity-main::after{content:" ↗";font-size:.68em}.report-money{font-weight:700;font-variant-numeric:tabular-nums}.report-money-success{color:var(--report-green)}.report-money-warning{color:#b86500}.report-money-danger{color:var(--report-red)}.report-money-info{color:var(--report-blue)}.report-status{display:inline-flex;align-items:center;gap:.3rem;padding:.28rem .55rem;border-radius:999px;font-size:.76rem;font-weight:750}.report-status-draft{background:rgba(100,116,139,.12);color:#64748b}.report-status-sent,.report-status-open{background:rgba(37,99,235,.12);color:#2563eb}.report-status-viewed{background:rgba(124,58,237,.12);color:#7c3aed}.report-status-partial{background:rgba(245,158,11,.15);color:#b86500}.report-status-paid,.report-status-active{background:rgba(25,135,84,.12);color:#198754}.report-status-cancelled,.report-status-overdue{background:rgba(220,53,69,.12);color:#dc3545}.report-status-void,.report-status-voided{background:rgba(220,53,69,.12);color:#dc3545}.report-status-inactive{background:rgba(33,37,41,.12);color:#212529}.report-pagination{display:flex;align-items:center;justify-content:space-between;gap:1rem;flex-wrap:wrap;padding:1rem;border-top:1px solid var(--bs-border-color)}.report-pagination-summary{color:var(--bs-secondary-color);font-size:.875rem}.report-pagination-controls{display:flex;align-items:center;gap:.35rem}.report-page-size{width:auto}.report-empty-state{display:flex;flex-direction:column;align-items:center;justify-content:center;width:100%;min-height:15rem;text-align:center;padding:3.5rem 1rem;color:var(--bs-secondary-color)}.report-empty-state i{display:block;font-size:2rem;margin-bottom:.75rem}.report-empty-table-cell{padding:0!important;text-align:center!important}.report-empty-table-cell .report-empty-state{min-height:18rem;margin-inline:auto}.report-action-link{display:inline-flex;align-items:center;gap:.35rem}.report-note{font-size:.78rem;color:var(--bs-secondary-color)}@media(max-width:991.98px){.report-visual-grid{grid-template-columns:1fr}}@media(max-width:767.98px){.report-pagination{align-items:stretch}.report-pagination-controls{overflow-x:auto}.report-table-card .table-responsive{max-height:none}.report-title-icon{display:none}}@media print{.app-sidebar,.app-topbar,.mobile-nav-drawer,.mobile-nav-backdrop,.report-no-print,.bm-toolbar,form,.report-pagination,.btn,.dropdown{display:none!important}.app-main,.app-page,.bm-page-container{display:block!important;width:100%!important;max-width:none!important;margin:0!important;padding:0!important}.report-page{font-size:10pt}.report-title-icon{display:none}.report-table-card,.report-chart-panel{border:0!important;box-shadow:none!important}.report-table-card .table-responsive{overflow:visible!important;max-height:none!important}.report-table thead{display:table-header-group}.report-table thead th{position:static!important;background:#fff!important}.report-table tr{break-inside:avoid}.report-summary-card{box-shadow:none!important;break-inside:avoid}.report-chart-wrap{height:200px}.report-landscape{page:reportLandscape}@page{margin:.45in}@page reportLandscape{size:landscape;margin:.4in}}

/* Complete estimate/document status palette used by shared report badges. */
.report-status-accepted,
.report-status-converted{background:rgba(25,135,84,.12);color:#198754}
.report-status-rejected{background:rgba(220,53,69,.12);color:#dc3545}
.report-status-expired{background:rgba(33,37,41,.12);color:#343a40}
.report-status-unknown{background:rgba(100,116,139,.12);color:#64748b}

/* Phase 5 report value sizing and payment presentation refinements. */
.report-summary-grid{grid-template-columns:repeat(auto-fit,minmax(240px,1fr))}
.report-summary-grid-two{grid-template-columns:repeat(2,minmax(0,1fr))}
.report-summary-grid-three{grid-template-columns:repeat(3,minmax(0,1fr))}
.report-summary-card{overflow:visible;min-width:0;container-type:inline-size}
.report-summary-card>div{min-width:0;flex:1 1 auto}
.report-summary-card .report-value{font-size:clamp(1.05rem,1.65vw,1.45rem)!important;white-space:nowrap;letter-spacing:-.02em}
.report-method-card{display:inline-flex;align-items:center;gap:.7rem;min-width:0}
.report-method-card>span:last-child{min-width:0}
.report-method-card strong,.report-method-card small{display:block}
.report-method-card small{font-size:.76rem;color:var(--bs-secondary-color);margin-top:.05rem}
.report-method-icon{display:grid;place-items:center;width:2.35rem;height:2.35rem;border-radius:.7rem;background:rgba(37,99,235,.1);color:var(--report-blue);flex:0 0 auto}
.report-count-badge{display:inline-flex;align-items:center;gap:.35rem;padding:.28rem .55rem;border-radius:999px;background:rgba(37,99,235,.1);color:var(--report-blue);font-size:.76rem;font-weight:750;white-space:nowrap}
.report-list-row{display:flex;justify-content:space-between;align-items:center;gap:1rem;padding:.8rem 0;border-top:1px solid var(--bs-border-color)}
.report-list-row:first-of-type{border-top:0}
@container (max-width:275px){.report-summary-card .report-value{font-size:1rem!important}}
@media(max-width:991.98px){.report-summary-grid-two,.report-summary-grid-three{grid-template-columns:1fr}.report-list-row{align-items:flex-start;flex-direction:column}.report-list-row>span:last-child{width:100%;justify-content:space-between}}

/* Standard report Run / Print actions */
.report-filter-actions {
    margin-top: .35rem;
}

.report-action-buttons {
    display: flex;
    align-items: center;
    justify-content: flex-start;
    flex-wrap: wrap;
    gap: .75rem;
    width: auto;
}

.report-action-buttons .btn {
    min-width: 118px;
    min-height: 44px;
    padding: .65rem 1.2rem;
    border-radius: .75rem;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: .5rem;
    font-size: .95rem;
    font-weight: 700;
    line-height: 1.1;
    box-shadow: none;
    transition: transform .15s ease, box-shadow .15s ease, background-color .15s ease, border-color .15s ease;
}

.report-run-button {
    color: #fff;
    border: 1px solid #4861df;
    background: linear-gradient(135deg, #4d67e3 0%, #4055d4 100%);
}

.report-run-button:hover,
.report-run-button:focus {
    color: #fff;
    border-color: #384dc7;
    background: linear-gradient(135deg, #455fdc 0%, #384dc7 100%);
    box-shadow: 0 6px 16px rgba(64, 85, 212, .18);
    transform: translateY(-1px);
}

.report-print-button {
    color: #626b78;
    border: 1px solid #737b85;
    background: #fff;
}

.report-print-button:hover,
.report-print-button:focus {
    color: #3f4854;
    border-color: #505965;
    background: #f8f9fb;
    box-shadow: 0 6px 16px rgba(31, 41, 55, .08);
    transform: translateY(-1px);
}

.report-action-buttons .bi {
    font-size: 1rem;
}

@media (max-width: 575.98px) {
    .report-action-buttons {
        width: 100%;
    }

    .report-action-buttons .btn {
        min-width: 0;
        flex: 1 1 0;
    }
}

@media print {
    .report-filter-actions,
    .report-action-buttons {
        display: none !important;
    }
}

/* Report filter action alignment and Search button standardization */
.report-filter-card .row,
.report-page form.bm-card .row {
    align-items: end;
}

.report-filter-actions {
    width: auto !important;
    flex: 0 0 auto;
    align-self: end;
    margin-top: 0;
    padding-top: 0;
}

.report-action-buttons {
    display: inline-flex;
    align-items: center;
    justify-content: flex-start;
    flex-wrap: nowrap;
    gap: .65rem;
    width: auto;
}

.report-action-buttons .btn {
    min-width: 124px;
    min-height: 48px;
    padding: .7rem 1.15rem;
    border-radius: .8rem;
    white-space: nowrap;
}

.report-run-button .bi-search {
    font-size: 1.08rem;
    stroke-width: 2;
}

@media (max-width: 991.98px) {
    .report-filter-actions {
        width: 100% !important;
        flex-basis: 100%;
    }
}

@media (max-width: 575.98px) {
    .report-action-buttons {
        display: flex;
        width: 100%;
    }

    .report-action-buttons .btn {
        flex: 1 1 0;
        min-width: 0;
    }
}

/* Reports landing page - dashboard-inspired navigation */
.reports-dashboard-page {
    --reports-blue: #2563eb;
    --reports-blue-dark: #1d4ed8;
    --reports-blue-soft: #eef4ff;
    --reports-ink: #172033;
    --reports-muted: #68758d;
    --reports-border: #dfe6f1;
    --reports-surface: #ffffff;
}

.reports-dashboard-hero {
    position: relative;
    overflow: hidden;
    margin-bottom: 1.6rem;
    padding: 1.35rem;
    border: 1px solid #ccdcff;
    border-radius: 1.25rem;
    background:
        radial-gradient(circle at 88% 24%, rgba(37, 99, 235, .16), transparent 24%),
        linear-gradient(120deg, #f7faff 0%, #eef5ff 58%, #dceaff 100%);
    box-shadow: 0 14px 34px rgba(37, 99, 235, .08);
}

.reports-dashboard-hero::after {
    content: "";
    position: absolute;
    width: 260px;
    height: 260px;
    right: -85px;
    top: -125px;
    border-radius: 50%;
    border: 42px solid rgba(255, 255, 255, .25);
    pointer-events: none;
}

.reports-dashboard-hero-content {
    position: relative;
    z-index: 1;
    display: flex;
    align-items: center;
    justify-content: space-between;
    min-height: 155px;
    gap: 2rem;
    padding: .35rem .35rem 1.2rem;
}

.reports-dashboard-heading {
    display: flex;
    align-items: flex-start;
    gap: 1rem;
    max-width: 720px;
}

.reports-dashboard-heading-icon {
    display: grid;
    place-items: center;
    width: 3.15rem;
    height: 3.15rem;
    flex: 0 0 auto;
    margin-top: .15rem;
    border-radius: .82rem;
    color: #fff;
    background: linear-gradient(145deg, #3b82f6, #3158e6);
    box-shadow: 0 10px 20px rgba(37, 99, 235, .2);
    font-size: 1.35rem;
}

.reports-dashboard-kicker {
    display: inline-flex;
    align-items: center;
    margin-bottom: .35rem;
    padding: .2rem .6rem;
    border-radius: 999px;
    color: var(--reports-blue-dark);
    background: rgba(37, 99, 235, .09);
    font-size: .69rem;
    font-weight: 800;
    letter-spacing: .08em;
    text-transform: uppercase;
}

.reports-dashboard-heading h1 {
    margin: 0;
    color: var(--reports-ink);
    font-size: clamp(2rem, 3vw, 2.7rem);
    font-weight: 850;
    letter-spacing: -.04em;
    line-height: 1.05;
}

.reports-dashboard-heading p {
    max-width: 620px;
    margin: .6rem 0 0;
    color: var(--reports-muted);
    font-size: .96rem;
    line-height: 1.55;
}

.reports-dashboard-illustration {
    position: relative;
    width: 255px;
    height: 130px;
    flex: 0 0 255px;
    opacity: .95;
}

.reports-dashboard-bars {
    position: absolute;
    left: 12px;
    bottom: 22px;
    display: flex;
    align-items: flex-end;
    gap: 7px;
    height: 85px;
}

.reports-dashboard-bars span {
    display: block;
    width: 18px;
    border-radius: 4px 4px 2px 2px;
    background: linear-gradient(180deg, #60a5fa, #2563eb);
    box-shadow: 5px 7px 12px rgba(37, 99, 235, .14);
}

.reports-dashboard-bars span:nth-child(1) { height: 35px; }
.reports-dashboard-bars span:nth-child(2) { height: 52px; }
.reports-dashboard-bars span:nth-child(3) { height: 68px; }
.reports-dashboard-bars span:nth-child(4) { height: 88px; }

.reports-dashboard-chart-card {
    position: absolute;
    right: 6px;
    top: 4px;
    width: 92px;
    height: 106px;
    padding: 17px 15px;
    border: 1px solid rgba(37, 99, 235, .18);
    border-radius: 10px;
    color: #3b82f6;
    background: rgba(255, 255, 255, .72);
    box-shadow: 0 12px 24px rgba(30, 64, 175, .08);
    transform: rotate(3deg);
}

.reports-dashboard-chart-card i { font-size: 1.45rem; }
.reports-dashboard-chart-card span {
    display: block;
    height: 5px;
    margin-top: 12px;
    border-radius: 99px;
    background: rgba(37, 99, 235, .15);
}
.reports-dashboard-chart-card span:last-child { width: 70%; }

.reports-dashboard-pie {
    position: absolute;
    right: 73px;
    bottom: 4px;
    display: grid;
    place-items: center;
    width: 70px;
    height: 70px;
    border-radius: 50%;
    color: #2563eb;
    background: rgba(255, 255, 255, .72);
    box-shadow: 0 12px 24px rgba(30, 64, 175, .1);
    font-size: 3rem;
}

.reports-dashboard-stats {
    position: relative;
    z-index: 2;
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: .9rem;
}

.reports-dashboard-stat {
    display: flex;
    align-items: center;
    gap: .9rem;
    min-width: 0;
    min-height: 102px;
    padding: .95rem 1rem;
    border: 1px solid rgba(255, 255, 255, .9);
    border-radius: 1rem;
    background: rgba(255, 255, 255, .92);
    box-shadow: 0 8px 22px rgba(15, 23, 42, .055);
}

.reports-dashboard-stat-icon {
    display: grid;
    place-items: center;
    width: 3.35rem;
    height: 3.35rem;
    flex: 0 0 auto;
    border-radius: .9rem;
    font-size: 1.35rem;
}

.reports-stat-blue { color: #2563eb; background: #edf4ff; }
.reports-stat-green { color: #22a447; background: #edf9f0; }
.reports-stat-purple { color: #7c3aed; background: #f3edff; }
.reports-stat-orange { color: #ea7a20; background: #fff3e8; }

.reports-dashboard-stat > div { min-width: 0; }
.reports-dashboard-stat strong,
.reports-dashboard-stat span,
.reports-dashboard-stat small { display: block; }

.reports-dashboard-stat strong {
    color: var(--reports-ink);
    font-size: 1.55rem;
    font-weight: 850;
    line-height: 1.05;
}

.reports-dashboard-stat strong.reports-dashboard-stat-text {
    font-size: .96rem;
    line-height: 1.25;
}

.reports-dashboard-stat > div > span {
    margin-top: .22rem;
    color: #52617b;
    font-size: .8rem;
    font-weight: 700;
}

.reports-dashboard-stat small {
    margin-top: .12rem;
    overflow: hidden;
    color: #71809a;
    font-size: .72rem;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.reports-dashboard-section-heading {
    display: flex;
    align-items: end;
    justify-content: space-between;
    gap: 1rem;
    margin-bottom: 1rem;
}

.reports-dashboard-section-heading h2 {
    margin: 0;
    color: var(--reports-ink);
    font-size: 1.22rem;
    font-weight: 800;
}

.reports-dashboard-section-heading p {
    margin: .25rem 0 0;
    color: var(--reports-muted);
    font-size: .84rem;
}

.reports-dashboard-layout {
    display: grid;
    grid-template-columns: minmax(0, 1fr) 210px;
    gap: 1rem;
    align-items: stretch;
}

.reports-dashboard-categories {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: .9rem;
}

.reports-dashboard-category {
    display: flex;
    flex-direction: column;
    min-width: 0;
    min-height: 220px;
    padding: 1rem;
    border: 1px solid var(--reports-border);
    border-radius: 1rem;
    background: var(--reports-surface);
    box-shadow: 0 8px 24px rgba(15, 23, 42, .045);
    transition: transform .16s ease, box-shadow .16s ease, border-color .16s ease;
}

.reports-dashboard-category:hover {
    border-color: #c8d8fb;
    box-shadow: 0 14px 30px rgba(37, 99, 235, .08);
    transform: translateY(-2px);
}

.reports-dashboard-category-top {
    display: flex;
    align-items: flex-start;
    gap: .75rem;
}

.reports-dashboard-category-icon {
    display: grid;
    place-items: center;
    width: 2.75rem;
    height: 2.75rem;
    flex: 0 0 auto;
    border-radius: .85rem;
    font-size: 1.12rem;
}

.reports-category-blue { color: #2563eb; background: #edf4ff; }
.reports-category-purple { color: #9333ea; background: #f6edff; }
.reports-category-green { color: #169447; background: #edf9f0; }
.reports-category-cyan { color: #0f8c92; background: #eaf9f9; }
.reports-category-orange { color: #dc6b16; background: #fff2e7; }
.reports-category-pink { color: #db2777; background: #fcecf4; }

.reports-dashboard-category h3 {
    margin: .05rem 0 .25rem;
    color: var(--reports-ink);
    font-size: .96rem;
    font-weight: 800;
}

.reports-dashboard-category p {
    margin: 0;
    color: var(--reports-muted);
    font-size: .74rem;
    line-height: 1.42;
}

.reports-dashboard-count {
    align-self: flex-start;
    margin: .75rem 0 .6rem;
    padding: .2rem .5rem;
    border-radius: 999px;
    color: var(--reports-blue-dark);
    background: #eef4ff;
    font-size: .67rem;
    font-weight: 750;
}

.reports-dashboard-links {
    display: grid;
    gap: .05rem;
    margin-top: auto;
    padding-top: .5rem;
    border-top: 1px solid #edf0f5;
}

.reports-dashboard-links a {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: .5rem;
    padding: .38rem .18rem;
    border-radius: .45rem;
    color: #315bd9;
    font-size: .73rem;
    font-weight: 700;
    text-decoration: none;
}

.reports-dashboard-links a:hover,
.reports-dashboard-links a:focus-visible {
    color: #1745c5;
    background: #f5f8ff;
}

.reports-dashboard-links a i { font-size: .72rem; }

.reports-dashboard-quick-actions {
    min-height: 100%;
    padding: 1rem .9rem;
    border: 1px solid #cfdcf7;
    border-radius: 1rem;
    background: linear-gradient(180deg, #f3f7ff 0%, #edf4ff 100%);
}

.reports-dashboard-quick-title {
    display: flex;
    align-items: center;
    gap: .55rem;
    margin-bottom: .75rem;
    color: var(--reports-ink);
}

.reports-dashboard-quick-title > span {
    display: grid;
    place-items: center;
    width: 2rem;
    height: 2rem;
    border-radius: .6rem;
    color: var(--reports-blue);
    background: rgba(37, 99, 235, .09);
}

.reports-dashboard-quick-title h3 {
    margin: 0;
    font-size: .9rem;
    font-weight: 800;
}

.reports-dashboard-quick-actions > a {
    display: grid;
    grid-template-columns: 1.5rem minmax(0, 1fr) auto;
    align-items: center;
    gap: .45rem;
    min-height: 42px;
    padding: .45rem .35rem;
    border-bottom: 1px solid rgba(37, 99, 235, .11);
    color: #33415c;
    font-size: .74rem;
    font-weight: 700;
    text-decoration: none;
}

.reports-dashboard-quick-actions > a:last-child { border-bottom: 0; }
.reports-dashboard-quick-actions > a > i:first-child { color: var(--reports-blue); }
.reports-dashboard-quick-actions > a > i:last-child { color: #7890bd; font-size: .68rem; }

.reports-dashboard-quick-actions > a:hover,
.reports-dashboard-quick-actions > a:focus-visible {
    color: var(--reports-blue-dark);
    transform: translateX(2px);
}

.reports-dashboard-security {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr) auto;
    align-items: center;
    gap: .8rem;
    margin-top: 1rem;
    padding: .8rem 1rem;
    border: 1px solid #d5e1f8;
    border-radius: .9rem;
    background: #f8fbff;
}

.reports-dashboard-security-icon {
    display: grid;
    place-items: center;
    width: 2.5rem;
    height: 2.5rem;
    border-radius: 50%;
    color: var(--reports-blue);
    background: #eaf2ff;
}

.reports-dashboard-security strong {
    display: block;
    color: #2451ce;
    font-size: .8rem;
    font-weight: 800;
}

.reports-dashboard-security p {
    margin: .13rem 0 0;
    color: var(--reports-muted);
    font-size: .72rem;
}

.reports-dashboard-security-lock { color: #315bd9; }

.reports-home-empty {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    min-height: 320px;
    padding: 3rem 1.5rem;
    border: 1px solid var(--bs-border-color);
    border-radius: 1rem;
    background: var(--bs-body-bg);
    text-align: center;
    box-shadow: 0 .4rem 1.2rem rgba(15, 23, 42, .05);
}

.reports-home-empty-icon {
    display: grid;
    place-items: center;
    width: 4rem;
    height: 4rem;
    margin-bottom: 1rem;
    border-radius: 1rem;
    color: #2563eb;
    background: #eef4ff;
    font-size: 1.6rem;
}

.reports-home-empty h2 { margin-bottom: .35rem; font-size: 1.1rem; }
.reports-home-empty p { margin: 0; color: var(--bs-secondary-color); }

@media (max-width: 1399.98px) {
    .reports-dashboard-categories { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}

@media (max-width: 1199.98px) {
    .reports-dashboard-stats { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .reports-dashboard-layout { grid-template-columns: 1fr; }
    .reports-dashboard-quick-actions { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 0 .75rem; }
    .reports-dashboard-quick-title { grid-column: 1 / -1; }
}

@media (max-width: 991.98px) {
    .reports-dashboard-categories { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .reports-dashboard-illustration { display: none; }
}

@media (max-width: 767.98px) {
    .reports-dashboard-hero { padding: 1rem; }
    .reports-dashboard-heading-icon { display: none; }
    .reports-dashboard-heading h1 { font-size: 2rem; }
    .reports-dashboard-stats { grid-template-columns: 1fr; }
    .reports-dashboard-stat { min-height: 86px; }
    .reports-dashboard-categories { grid-template-columns: 1fr; }
    .reports-dashboard-quick-actions { grid-template-columns: 1fr; }
    .reports-dashboard-security { grid-template-columns: auto 1fr; }
    .reports-dashboard-security-lock { display: none; }
}

@media print {
    .reports-dashboard-illustration,
    .reports-dashboard-quick-actions { display: none !important; }
    .reports-dashboard-hero { border: 0; box-shadow: none; background: #fff; }
    .reports-dashboard-layout { display: block; }
    .reports-dashboard-categories { grid-template-columns: repeat(2, 1fr); }
    .reports-dashboard-category { box-shadow: none; break-inside: avoid; }
}


/* ==========================================================
   REVENUE TREND REPORT
   ========================================================== */

.revenue-trend-report {
    --revenue-trend-blue: #4b63e6;
    --revenue-trend-purple: #7c3aed;
    --revenue-trend-soft: #f6f8ff;
}

.revenue-trend-hero {
    padding: 1.4rem 1.5rem;
    border: 1px solid #e1e7f1;
    border-radius: 1.15rem;
    background:
        radial-gradient(circle at 92% 12%, rgba(124, 58, 237, .09), transparent 28%),
        linear-gradient(135deg, #ffffff 0%, #f7f9ff 100%);
    box-shadow: 0 .55rem 1.5rem rgba(15, 23, 42, .05);
}

.revenue-trend-title-icon {
    width: 3.5rem;
    height: 3.5rem;
    border: 1px solid #dbe4ff;
    background: linear-gradient(145deg, #edf3ff, #f5f1ff);
    color: var(--revenue-trend-blue);
    box-shadow: 0 .45rem 1rem rgba(75, 99, 230, .09);
}

.revenue-trend-filter {
    padding: 1.15rem 1.2rem;
    border-color: #dfe6f1;
    border-radius: 1rem;
    background: #fff;
    box-shadow: 0 .35rem 1.1rem rgba(15, 23, 42, .045);
}

.revenue-trend-filter-heading {
    display: flex;
    align-items: center;
    gap: .75rem;
    margin-bottom: 1rem;
    padding-bottom: .9rem;
    border-bottom: 1px solid #edf1f7;
}

.revenue-trend-filter-heading > div {
    display: grid;
    min-width: 0;
}

.revenue-trend-filter-heading strong {
    color: #172033;
    font-size: .95rem;
    font-weight: 800;
}

.revenue-trend-filter-heading span:not(.revenue-trend-filter-icon) {
    margin-top: .1rem;
    color: #71809a;
    font-size: .78rem;
}

.revenue-trend-filter-icon {
    display: grid;
    place-items: center;
    width: 2.3rem;
    height: 2.3rem;
    flex: 0 0 2.3rem;
    border-radius: .7rem;
    background: #eef3ff;
    color: var(--revenue-trend-blue);
}

.revenue-trend-filter-grid {
    display: grid;
    grid-template-columns:
        minmax(180px, 1fr)
        minmax(180px, 1fr)
        minmax(170px, .85fr)
        auto;
    gap: .85rem;
    align-items: end;
}

.revenue-trend-filter-field {
    min-width: 0;
}

.revenue-trend-filter-field .form-label {
    margin-bottom: .4rem;
}

.revenue-trend-input-wrap {
    position: relative;
}

.revenue-trend-input-wrap > .bi {
    position: absolute;
    top: 50%;
    left: .9rem;
    z-index: 3;
    color: #71809a;
    transform: translateY(-50%);
    pointer-events: none;
}

.revenue-trend-input-wrap .form-control,
.revenue-trend-input-wrap .form-select {
    min-height: 48px;
    border-color: #d5deeb;
    border-radius: .78rem;
    background-color: #fff;
    box-shadow: none;
}

.revenue-trend-input-wrap .form-control {
    padding-left: 2.55rem;
}

.revenue-trend-input-wrap .form-select {
    padding-left: 2.55rem;
}

.revenue-trend-input-wrap .form-control:focus,
.revenue-trend-input-wrap .form-select:focus {
    border-color: #7790ef;
    box-shadow: 0 0 0 .22rem rgba(75, 99, 230, .10);
}

.revenue-trend-filter-actions {
    height: 48px;
}

.revenue-trend-filter-actions .report-run-button {
    height: 48px;
    min-width: 145px;
}

.revenue-trend-visual-grid {
    grid-template-columns: minmax(0, 1.55fr) minmax(280px, .45fr);
}

.revenue-trend-chart-panel {
    min-height: 390px;
}

.revenue-trend-chart-wrap {
    height: 310px;
    padding-top: .35rem;
}

.revenue-trend-group-badge {
    padding: .4rem .7rem;
    border: 1px solid #dfe5f0;
    color: #52617b;
    background: #f8faff;
    font-weight: 700;
}

.revenue-trend-performance {
    display: flex;
    flex-direction: column;
    min-height: 390px;
}

.revenue-trend-performance-icon {
    display: grid;
    place-items: center;
    width: 3rem;
    height: 3rem;
    margin-bottom: 1rem;
    border-radius: .85rem;
    color: #198754;
    background: rgba(25, 135, 84, .10);
    font-size: 1.25rem;
}

.revenue-trend-rate {
    margin: .7rem 0 .35rem;
    font-size: clamp(2rem, 4vw, 3.1rem);
    font-weight: 850;
    letter-spacing: -.04em;
    line-height: 1;
}

.revenue-trend-performance-meta {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: .75rem;
    margin-top: auto;
    padding-top: 1rem;
    border-top: 1px solid #e7ebf2;
    color: #52617b;
}

.revenue-trend-performance-meta span {
    display: inline-flex;
    align-items: center;
    gap: .45rem;
}

.revenue-trend-performance-meta strong {
    color: #172033;
}

.revenue-trend-table-heading {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    padding: 1rem 1.15rem;
    border-bottom: 1px solid var(--bs-border-color);
}

.revenue-trend-table-heading > div {
    display: grid;
}

.revenue-trend-table-heading strong {
    color: #172033;
    font-size: .95rem;
    font-weight: 800;
}

.revenue-trend-table-heading span:not(.report-count-badge) {
    margin-top: .12rem;
    color: #71809a;
    font-size: .78rem;
}

.report-money-purple {
    color: var(--report-purple);
}

@media (max-width: 1199.98px) {
    .revenue-trend-filter-grid {
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }

    .revenue-trend-filter-grid .report-filter-actions {
        grid-column: 1 / -1;
        width: 100% !important;
    }

    .revenue-trend-filter-actions {
        width: 100%;
    }

    .revenue-trend-filter-actions .report-run-button {
        width: 100%;
    }
}

@media (max-width: 991.98px) {
    .revenue-trend-visual-grid {
        grid-template-columns: 1fr;
    }

    .revenue-trend-performance {
        min-height: 260px;
    }
}

@media (max-width: 767.98px) {
    .revenue-trend-hero {
        padding: 1rem;
    }

    .revenue-trend-filter-grid {
        grid-template-columns: 1fr;
    }

    .revenue-trend-filter-grid .report-filter-actions {
        grid-column: auto;
    }

    .revenue-trend-chart-panel {
        min-height: 330px;
    }

    .revenue-trend-chart-wrap {
        height: 255px;
    }

    .revenue-trend-table-heading {
        align-items: flex-start;
        flex-direction: column;
    }
}

@media (max-width: 575.98px) {
    .revenue-trend-filter {
        padding: .9rem;
    }

    .revenue-trend-filter-heading {
        align-items: flex-start;
    }

    .revenue-trend-performance-meta {
        align-items: flex-start;
        flex-direction: column;
    }
}


/* ==========================================================
   SHARED PROFESSIONAL REPORT DETAIL EXPERIENCE
   ========================================================== */

.report-detail-page {
    --report-detail-border: #dfe6f1;
    --report-detail-ink: #172033;
    --report-detail-muted: #71809a;
}

.report-detail-page > .bm-page-header {
    padding: 1.35rem 1.45rem;
    border: 1px solid var(--report-detail-border);
    border-radius: 1.15rem;
    background:
        radial-gradient(circle at 94% 8%, rgba(75, 99, 230, .08), transparent 28%),
        linear-gradient(135deg, #fff 0%, #f8faff 100%);
    box-shadow: 0 .55rem 1.5rem rgba(15, 23, 42, .05);
}

.report-detail-page > .bm-page-header .bm-page-title {
    color: var(--report-detail-ink);
    letter-spacing: -.025em;
}

.report-detail-page > .bm-page-header .bm-page-description,
.report-detail-page > .bm-page-header p {
    color: #66748b;
}

.report-detail-page > .bm-page-header .bm-page-actions {
    gap: .55rem;
}

.report-detail-page > .bm-page-header .bm-page-actions > .btn,
.report-detail-page > .bm-page-header .bm-page-actions > a.btn {
    min-height: 42px;
    border-radius: .72rem;
    font-weight: 700;
}

.report-filter-shell,
.report-detail-page .report-filter-card {
    padding: 1.1rem 1.2rem !important;
    border: 1px solid var(--report-detail-border);
    border-radius: 1rem;
    background: #fff;
    box-shadow: 0 .35rem 1.1rem rgba(15, 23, 42, .045);
}

.report-filter-heading {
    display: flex;
    align-items: center;
    gap: .75rem;
    margin-bottom: 1rem;
    padding-bottom: .9rem;
    border-bottom: 1px solid #edf1f7;
}

.report-filter-heading > div {
    display: grid;
    min-width: 0;
}

.report-filter-heading strong {
    color: var(--report-detail-ink);
    font-size: .95rem;
    font-weight: 800;
}

.report-filter-heading span:not(.report-filter-heading-icon) {
    margin-top: .1rem;
    color: var(--report-detail-muted);
    font-size: .78rem;
}

.report-filter-heading-icon {
    display: grid;
    place-items: center;
    width: 2.3rem;
    height: 2.3rem;
    flex: 0 0 2.3rem;
    border-radius: .7rem;
    color: #4b63e6;
    background: #eef3ff;
}

.report-filter-layout {
    display: grid !important;
    grid-template-columns: repeat(4, minmax(150px, 1fr));
    gap: .85rem !important;
    margin: 0 !important;
    align-items: end !important;
}

.report-filter-layout > [class*="col"] {
    width: auto !important;
    max-width: none !important;
    margin: 0 !important;
    padding: 0 !important;
    flex: none !important;
}

.report-filter-layout > .report-filter-actions {
    width: auto !important;
    align-self: end;
}

.report-filter-field {
    min-width: 0;
}

.report-filter-field .form-label {
    display: block;
    margin-bottom: .4rem;
    color: #52617b;
    font-size: .76rem;
    font-weight: 800;
    letter-spacing: .035em;
    text-transform: uppercase;
}

.report-filter-control,
.report-filter-field .form-control,
.report-filter-field .form-select {
    width: 100%;
    min-height: 46px;
    border-color: #d5deeb;
    border-radius: .75rem;
    background-color: #fff;
    box-shadow: none;
}

.report-filter-control:focus,
.report-filter-field .form-control:focus,
.report-filter-field .form-select:focus {
    border-color: #7790ef;
    box-shadow: 0 0 0 .22rem rgba(75, 99, 230, .10);
}

/* Keep search icons and text inputs on one line inside report filter grids.
   The generic full-width report control rule must not force input-group children
   to wrap into separate rows. */
.report-filter-field .input-group.report-search-input-group {
    display: flex;
    flex-wrap: nowrap;
    width: 100%;
}

.report-filter-field .input-group.report-search-input-group > .input-group-text {
    flex: 0 0 auto;
    width: auto;
    min-height: 46px;
    border-color: #d5deeb;
    border-radius: .75rem 0 0 .75rem;
}

.report-filter-field .input-group.report-search-input-group > .form-control {
    flex: 1 1 auto;
    width: 1% !important;
    min-width: 0;
    border-radius: 0 .75rem .75rem 0;
}

.report-filter-layout .form-check {
    min-height: 46px;
    display: flex;
    align-items: center;
    gap: .5rem;
    margin: 0;
    padding: .65rem .8rem .65rem 2rem;
    border: 1px solid #d5deeb;
    border-radius: .75rem;
    background: #fafcff;
}

.report-filter-layout .report-action-buttons {
    width: 100%;
}

.report-filter-layout .report-run-button {
    width: 100%;
    min-width: 132px;
    min-height: 46px;
}

.report-detail-page .report-summary-grid {
    gap: .9rem;
}

.report-detail-page .report-summary-card {
    min-height: 96px;
    border-color: #e0e6ef;
    border-radius: 1rem;
    box-shadow: 0 .4rem 1.1rem rgba(15, 23, 42, .045);
}

.report-detail-page .report-chart-panel {
    overflow: hidden;
    border-color: #e0e6ef;
    border-radius: 1rem;
    box-shadow: 0 .45rem 1.25rem rgba(15, 23, 42, .05);
}

.report-detail-page .report-chart-header {
    padding-bottom: .75rem;
    border-bottom: 1px solid #edf1f7;
}

.report-detail-page .report-chart-title {
    color: var(--report-detail-ink);
    font-size: .95rem;
    font-weight: 800;
}

.report-detail-page .report-chart-wrap {
    min-height: 250px;
}

.report-detail-page .report-table-card {
    overflow: hidden;
    border-color: #e0e6ef;
    border-radius: 1rem;
    box-shadow: 0 .45rem 1.25rem rgba(15, 23, 42, .05);
}

.report-detail-page .report-table thead th {
    background: #f7f9fc;
    color: #637087;
    font-size: .74rem;
    font-weight: 800;
}

.report-detail-page .report-table tbody tr {
    transition: background-color .14s ease;
}

.report-detail-page .report-table tbody tr:hover {
    background: #f8fbff;
}

.report-home-button {
    order: -20;
}

@media (max-width: 1199.98px) {
    .report-filter-layout {
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }

    .report-filter-layout > .report-filter-actions {
        grid-column: 1 / -1;
        width: 100% !important;
    }

    .report-filter-layout .report-action-buttons {
        display: flex;
    }
}

@media (max-width: 991.98px) {
    .report-filter-layout {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .report-detail-page > .bm-page-header {
        padding: 1.1rem;
    }
}

@media (max-width: 767.98px) {
    .report-filter-layout {
        grid-template-columns: 1fr;
    }

    .report-filter-layout > .report-filter-actions {
        grid-column: auto;
    }

    .report-detail-page > .bm-page-header .bm-page-actions {
        display: grid;
        grid-template-columns: 1fr;
        width: 100%;
    }

    .report-detail-page > .bm-page-header .bm-page-actions > .btn,
    .report-detail-page > .bm-page-header .bm-page-actions > a.btn {
        width: 100%;
    }

    .report-detail-page .report-chart-wrap {
        min-height: 225px;
    }
}

@media (max-width: 575.98px) {
    .report-filter-shell,
    .report-detail-page .report-filter-card {
        padding: .9rem !important;
    }

    .report-filter-heading {
        align-items: flex-start;
    }

    .report-filter-layout .report-action-buttons {
        flex-direction: column;
    }

    .report-filter-layout .report-action-buttons .btn {
        width: 100%;
    }
}


/* Numeric report visualization refinements */
.report-number-chart {
    min-height: 340px;
}

.report-number-chart-wrap {
    height: 275px;
}

.report-detail-page .report-number-chart canvas {
    max-width: 100%;
}

@media (max-width: 767.98px) {
    .report-number-chart {
        min-height: 310px;
    }

    .report-number-chart-wrap {
        height: 235px;
    }
}


/* Payment Report: compact payment-branded header card. */
.report-page > .bm-page-header.payment-report-header {
    position: relative;
    overflow: hidden;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1.25rem;
    margin-bottom: 1.35rem;
    padding: 1.05rem 1.2rem;
    border: 1px solid rgba(67, 97, 238, .34);
    border-radius: 1.05rem;
    background:
        radial-gradient(circle at 92% 18%, rgba(255, 255, 255, .16), transparent 25%),
        linear-gradient(135deg, #3157d5 0%, #4169e1 52%, #5146d9 100%);
    box-shadow: 0 12px 28px rgba(49, 87, 213, .16);
}

.report-page > .bm-page-header.payment-report-header::after {
    display: block;
    content: "";
    position: absolute;
    width: 180px;
    height: 180px;
    right: -64px;
    top: -106px;
    border: 32px solid rgba(255, 255, 255, .08);
    border-radius: 50%;
    pointer-events: none;
}

.payment-report-header .report-title-wrap,
.payment-report-header .bm-page-actions {
    position: relative;
    z-index: 1;
}

.payment-report-header .report-title-wrap {
    align-items: center;
}

.payment-report-header .report-title-icon {
    display: inline-grid;
    width: 46px;
    height: 46px;
    flex: 0 0 46px;
    place-items: center;
    border: 1px solid rgba(255, 255, 255, .25);
    border-radius: 13px;
    color: #fff;
    background: rgba(255, 255, 255, .14);
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, .12);
    font-size: 1.22rem;
}

.payment-report-header .bm-page-kicker,
.payment-report-header .bm-page-title,
.payment-report-header p,
.payment-report-header .report-header-meta {
    color: #fff !important;
}

.payment-report-header .bm-page-kicker {
    color: #dbeafe !important;
    opacity: 1;
}

.payment-report-header .bm-page-title {
    margin-bottom: .15rem;
}

.payment-report-header p {
    margin-bottom: 0;
    opacity: .94;
}

.payment-report-header .report-header-meta {
    margin-top: .45rem;
    opacity: .82;
}

.payment-report-header .bm-page-actions .btn {
    color: #1d4ed8 !important;
    border-color: rgba(255, 255, 255, .6) !important;
    background: #fff !important;
    font-weight: 700;
    box-shadow: 0 8px 20px rgba(15, 23, 42, .12);
}

.payment-report-header .bm-page-actions .btn:hover,
.payment-report-header .bm-page-actions .btn:focus {
    color: #1e40af !important;
    border-color: #fff !important;
    background: #eff6ff !important;
}

@media (max-width: 991.98px) {
    .report-page > .bm-page-header.payment-report-header {
        align-items: stretch;
        flex-direction: column;
        padding: 1rem;
    }

    .payment-report-header .bm-page-actions {
        width: 100%;
    }
}

@media (max-width: 767.98px) {
    .payment-report-header .report-title-icon {
        display: inline-grid;
    }
}

@media print {
    .report-page > .bm-page-header.payment-report-header {
        color: #000 !important;
        border: 0 !important;
        background: #fff !important;
        box-shadow: none !important;
    }

    .payment-report-header .bm-page-kicker,
    .payment-report-header .bm-page-title,
    .payment-report-header p,
    .payment-report-header .report-header-meta {
        color: #000 !important;
    }
}

/* =========================================================
   REPORT TABLE EDGE-TO-EDGE NORMALIZATION
   Keep every report grid flush with its report card instead of
   reserving the global stable scrollbar gutter on the right.
   Applies to legacy Reports and Purchase Order P.11 reports.
   ========================================================= */
.report-page .table-responsive {
    width: 100%;
    max-width: 100%;
    margin-left: 0;
    margin-right: 0;
    scrollbar-gutter: auto;
}

.report-page .table-responsive > .table,
.report-page .table-responsive > .report-table {
    width: 100%;
    max-width: 100%;
    margin-left: 0;
    margin-right: 0;
    margin-bottom: 0;
}

/* Report cards own the rounded edge; keep the table content clipped to it. */
.report-page .report-table-card {
    overflow: hidden;
}

/* When a desktop report genuinely needs vertical scrolling, allow it without
   permanently reserving blank space when no scrollbar is present. */
@media (min-width: 768px) {
    .report-page .report-table-card > .table-responsive {
        max-height: none;
        overflow-x: auto;
        overflow-y: visible;
        scrollbar-gutter: auto;
    }
}

/* Stacked mobile report tables already manage their own width. */
@media (max-width: 767.98px) {
    .report-page .table-responsive {
        scrollbar-gutter: auto;
    }
}

/* =========================================================
   JOB PROFITABILITY DETAIL - PAGE SCROLL STANDARD
   The server already pages this grid. Let the report card grow to the
   selected page size and use the browser/page for vertical scrolling.
   Horizontal overflow remains available for narrow viewports.
   ========================================================= */
.report-page .job-profitability-detail-card > .table-responsive {
    max-height: none;
    overflow-x: auto;
    overflow-y: hidden;
    scrollbar-gutter: auto;
}

@media (min-width: 768px) {
    .report-page .job-profitability-detail-card > .table-responsive {
        max-height: none;
        overflow-x: auto;
        overflow-y: hidden;
    }
}



/* Expenses by Vendor grid: align report table header/footer with standard directory grids. */
.expenses-by-vendor-table-card .expenses-by-vendor-grid-header {
    min-height: 92px;
    padding: 1rem 1.25rem;
    background: linear-gradient(180deg, rgba(248, 251, 255, .98), #fff);
}
.expenses-by-vendor-grid-heading {
    min-width: 0;
}
.expenses-by-vendor-grid-meta {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: .45rem 1rem;
    margin-top: .45rem;
    color: var(--bs-secondary-color);
    font-size: .82rem;
}
.expenses-by-vendor-grid-meta .expenses-by-vendor-footer-legend {
    display: inline-flex;
    align-items: center;
    flex-wrap: wrap;
    gap: .35rem .85rem;
}
.expenses-by-vendor-table-card .expenses-by-vendor-table-intro {
    padding: .8rem 1.25rem;
    border-bottom: 1px solid var(--bs-border-color);
}
@media (max-width: 767.98px) {
    .expenses-by-vendor-table-card .expenses-by-vendor-grid-header {
        min-height: 0;
        align-items: flex-start !important;
        flex-direction: column;
    }
}
.expenses-by-vendor-footer-legend > span {
    display: inline-flex;
    align-items: center;
    gap: .35rem;
    white-space: nowrap;
}
.expenses-by-vendor-legend-swatch {
    display: inline-block;
    width: .55rem;
    height: .55rem;
    border-radius: 999px;
    background: var(--report-slate);
}
.expenses-by-vendor-legend-swatch.is-job { background: var(--report-purple); }
.expenses-by-vendor-legend-swatch.is-operating { background: var(--report-orange); }

/* RBP.2 Business Payment Summary: preserve report header palette and page-owned scrolling. */
.business-payment-summary-report .report-table-card .table-responsive {
    max-height: none;
    overflow-y: visible;
}
.business-payment-summary-report .report-summary-context {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: .6rem .85rem;
}
.business-payment-summary-report .ts-wrapper {
    min-width: 0;
}
.business-payment-summary-report .ts-control {
    min-height: calc(1.5em + .75rem + 2px);
    border-color: var(--bs-border-color);
    border-radius: var(--bs-border-radius);
}
@media (max-width: 767.98px) {
    .business-payment-summary-report .report-table-card .table-responsive {
        overflow-x: visible;
    }
}

.business-payments-by-payee-report .report-table-card .table-responsive{max-height:none;overflow-y:visible}.business-payments-by-payee-report .report-payee-chart-wrap{height:320px}

.business-payments-by-type-report .report-table-card .table-responsive{max-height:none;overflow-y:visible}.business-payments-by-type-report .business-payment-type-chart-wrap{height:320px}
.business-payments-by-method-report .report-table-card .table-responsive{max-height:none;overflow-y:visible}.business-payments-by-method-report .business-payment-method-chart-wrap{height:320px}
.cash-outflow-report .report-table-card .table-responsive{max-height:none;overflow-y:visible}.cash-outflow-report .report-number-chart-wrap{height:320px}


/* ==========================================================
   REPORT.UI.1A - SHARED REPORT GRID / PAGING / MOBILE FOUNDATION
   ========================================================== */

/* Report pages own vertical scrolling. Detail grids never create a second
   vertical scroll region; desktop may still scroll horizontally when a wide
   report genuinely requires it. */
.report-page .report-table-card,
.report-page .report-table-card > .table-responsive {
    min-width: 0;
    max-width: 100%;
}

.report-page .report-table-card > .table-responsive {
    max-height: none;
    overflow-y: visible;
}

.report-page .report-table {
    width: 100%;
    max-width: 100%;
}

.report-page .report-table td,
.report-page .report-table th,
.report-page .report-table td > *,
.report-page .report-table td a,
.report-page .report-table td span,
.report-page .report-table td div,
.report-page .report-table td strong {
    min-width: 0;
}

.report-page .report-table td {
    overflow-wrap: anywhere;
}

/* Standard filter action treatment. Clear Filters is intentionally secondary
   and precedes the primary Run Report action whenever it is present. */
.report-page .report-filter-actions,
.report-page .report-action-buttons {
    justify-content: flex-end;
}

.report-page .report-clear-filters {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: .5rem;
    min-height: 48px;
    min-width: 124px;
    border-radius: .8rem;
    white-space: nowrap;
}

/* Shared paging footer: summary + page-size selector + navigation. */
.report-pagination {
    min-width: 0;
}

.report-pagination-summary {
    flex: 1 1 220px;
    min-width: 0;
}

.report-pagination-controls {
    display: flex;
    flex: 0 1 auto;
    align-items: center;
    justify-content: flex-end;
    gap: .5rem;
    min-width: 0;
    flex-wrap: wrap;
}

.report-page-size-group,
.report-pagination-nav {
    display: inline-flex;
    align-items: center;
    gap: .35rem;
    min-width: 0;
}

.report-page-size-label {
    color: var(--bs-secondary-color);
    font-size: .8rem;
    font-weight: 700;
    white-space: nowrap;
}

.report-pagination-nav .btn,
.report-pagination-page {
    min-height: 34px;
}

.report-pagination-page {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding-inline: .65rem;
    color: var(--bs-secondary-color);
    white-space: nowrap;
}

/* Empty-state rows keep normal table-cell semantics on desktop so colspan
   spans the complete report grid. reports.js marks every colspan cell with
   data-report-full-width; mobile overrides below convert only those rows to
   full-width blocks after the table switches to cards. */
.report-page .bm-responsive-table td[data-report-full-width="true"] {
    width: 100%;
    text-align: center !important;
}

.report-page .bm-responsive-table td[data-report-full-width="true"]::before {
    display: none;
}

.report-page .bm-responsive-table td[data-report-full-width="true"] > .report-empty-state,
.report-page .report-table td[colspan] > .report-empty-state {
    width: 100%;
    max-width: none;
    margin-inline: auto;
    align-items: center;
    justify-content: center;
    text-align: center;
}

@media (max-width: 767.98px) {
    /* Report data must never disappear beyond the viewport or require a
       horizontal swipe. reports.js supplies data-label values from headers. */
    .report-page .report-table-card > .table-responsive {
        width: 100%;
        max-width: 100%;
        overflow-x: clip;
        overflow-y: visible;
    }

    .report-page .report-table.bm-responsive-table {
        width: 100% !important;
        min-width: 0 !important;
        max-width: 100% !important;
    }

    .report-page .bm-responsive-table tbody {
        width: 100%;
        padding: .65rem;
    }

    .report-page .bm-responsive-table tr {
        width: 100%;
        max-width: 100%;
    }

    .report-page .bm-responsive-table td {
        width: 100%;
        max-width: 100%;
        min-width: 0;
    }

    .report-page .bm-responsive-table td::before {
        min-width: 0;
        overflow-wrap: anywhere;
    }

    /* A no-data row is one full-width report message, not a mobile data card
       anchored to the first table column. */
    .report-page .bm-responsive-table tr:has(> td[data-report-full-width="true"]) {
        display: block !important;
        width: 100% !important;
        max-width: 100% !important;
        padding: 0 !important;
    }

    .report-page .bm-responsive-table td[data-report-full-width="true"] {
        display: block !important;
        width: 100% !important;
        max-width: 100% !important;
        padding: 0 !important;
        text-align: center !important;
    }

    .report-page .bm-responsive-table td[data-report-full-width="true"] > .report-empty-state {
        display: flex;
        width: 100% !important;
        min-height: 18rem;
        margin: 0 auto;
        padding: 3rem 1rem;
        align-items: center;
        justify-content: center;
        text-align: center;
    }

    .report-page .report-pagination {
        display: grid;
        grid-template-columns: minmax(0, 1fr);
        align-items: stretch;
        gap: .75rem;
        padding: .85rem;
    }

    .report-page .report-pagination-summary {
        width: 100%;
        text-align: left;
    }

    .report-page .report-pagination-controls {
        display: grid;
        grid-template-columns: minmax(0, 1fr);
        width: 100%;
        overflow: visible;
        gap: .65rem;
    }

    .report-page .report-page-size-group {
        justify-content: space-between;
        width: 100%;
    }

    .report-page .report-page-size {
        width: auto;
        min-width: 76px;
    }

    .report-page .report-pagination-nav {
        display: grid;
        grid-template-columns: repeat(5, minmax(0, 1fr));
        width: 100%;
        gap: .3rem;
    }

    .report-page .report-pagination-nav .btn,
    .report-page .report-pagination-page {
        width: 100%;
        min-width: 0;
        padding-inline: .35rem;
    }

    .report-page .report-filter-actions,
    .report-page .report-action-buttons {
        width: 100% !important;
    }

    .report-page .report-action-buttons,
    .report-page .report-filter-actions {
        flex-wrap: wrap;
    }

    .report-page .report-clear-filters,
    .report-page .report-run-button {
        flex: 1 1 150px;
        min-width: 0;
    }
}

@media (max-width: 420px) {
    .report-page .report-pagination-nav {
        grid-template-columns: repeat(4, minmax(0, 1fr));
    }

    .report-page .report-pagination-page {
        grid-column: 1 / -1;
        grid-row: 1;
    }
}

/* REPORT.UI.1C - shared AJAX report lookup feedback. */
.report-ajax-status {
    min-height: 1.25rem;
}

.report-filter-card .ts-wrapper {
    max-width: 100%;
}


/* REPORT.UI.1D mobile filter-action sizing + desktop alignment follow-up.
   Keep actions compact on phones and pinned to the right on larger screens. */
.report-page .report-filter-actions {
    justify-self: end;
    text-align: right;
}

.report-page .report-filter-actions .report-action-buttons {
    width: auto !important;
    margin-left: auto;
    justify-content: flex-end;
}

@media (max-width: 1199.98px) {
    .report-page .report-filter-layout > .report-filter-actions {
        justify-self: stretch;
    }

    .report-page .report-filter-layout > .report-filter-actions .report-action-buttons {
        width: auto !important;
        margin-left: auto;
    }
}

@media (max-width: 767.98px) {
    /* Never let flex-basis become button height when the action group stacks. */
    .report-page .report-clear-filters,
    .report-page .report-run-button {
        flex: 0 0 auto;
        min-height: 44px;
        height: auto;
        padding: .65rem 1rem;
    }

    .report-page .report-filter-actions {
        justify-self: stretch;
        text-align: initial;
    }

    .report-page .report-filter-actions .report-action-buttons {
        width: 100% !important;
        margin-left: 0;
        justify-content: flex-end;
    }
}

@media (max-width: 575.98px) {
    .report-page .report-filter-layout .report-action-buttons {
        gap: .55rem;
    }

    .report-page .report-filter-layout .report-action-buttons .btn,
    .report-page .report-clear-filters,
    .report-page .report-run-button {
        width: 100%;
        min-height: 44px;
        max-height: none;
        padding-block: .65rem;
        flex: 0 0 auto;
    }
}

/* REPORT.UI.1D follow-up - keep filter controls and actions on separate rows.
   Filter fields use the full available width; actions stay right-aligned. */
.report-page .report-filter-fields-row,
.report-page .report-filter-actions-row {
    width: 100%;
    margin-inline: 0;
}

.report-page .report-filter-actions-row > .report-filter-actions {
    display: flex;
    width: 100%;
    justify-content: flex-end;
}

.report-page .report-filter-actions-row .report-action-buttons {
    display: flex;
    width: auto !important;
    margin-left: auto;
    justify-content: flex-end;
    align-items: center;
    flex-wrap: wrap;
}

.report-page .report-filter-check-field {
    min-height: 58px;
    display: flex;
    align-items: center;
    padding: .75rem 1rem .75rem 2.25rem;
    border: 1px solid var(--bs-border-color, #dee2e6);
    border-radius: .75rem;
    background: var(--bs-body-bg, #fff);
}

@media (max-width: 575.98px) {
    .report-page .report-filter-actions-row .report-action-buttons {
        width: 100% !important;
        margin-left: 0;
    }
}


/* REPORT.UI.1D standardized filter field distribution and action spacing. */
.report-page .report-filter-card {
    --report-filter-actions-spacing: 1.5rem;
    --report-filter-button-gap: .75rem;
}

/* The shared report-filter-layout defaults to four columns. Explicit field-count
   classes let smaller filter sets consume the full card width instead of leaving
   unused grid columns on the right. */
.report-page .report-filter-fields-row.report-filter-layout.report-filter-fields-1 {
    grid-template-columns: minmax(0, 1fr) !important;
}

.report-page .report-filter-fields-row.report-filter-layout.report-filter-fields-2 {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
}

.report-page .report-filter-fields-row.report-filter-layout.report-filter-fields-3 {
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
}

.report-page .report-filter-fields-row.report-filter-layout.report-filter-fields-4 {
    grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
}

/* Business Payment reports use multiple logical filter rows. Keep those rows
   visually separated and place the searchable Payee on its own full-width row
   immediately before Search so helper text never pushes neighboring controls. */
.report-page form[data-business-payment-report-filters] > .report-filter-fields-row + .report-filter-fields-row {
    margin-top: 1rem !important;
}

.report-page form[data-business-payment-report-filters] > .report-filter-payee-row {
    align-items: start !important;
}

.report-page form[data-business-payment-report-filters] > .report-filter-payee-row .report-ajax-status:empty {
    display: none;
    min-height: 0;
    margin: 0;
}

.report-page form[data-business-payment-report-filters] > .report-filter-payee-row .form-text {
    margin-top: .25rem;
}

/* Actions always occupy a dedicated line with one standard gap from the final
   filter field row. Clear Filters precedes Run Report and the group is pinned
   to the right edge on desktop/tablet. */
.report-page .report-filter-actions-row {
    display: flex !important;
    width: 100% !important;
    margin: var(--report-filter-actions-spacing) 0 0 !important;
    padding: 0 !important;
    justify-content: flex-end !important;
    align-items: center;
}

.report-page .report-filter-actions-row > .report-filter-actions {
    display: flex !important;
    flex: 0 0 100% !important;
    width: 100% !important;
    max-width: 100% !important;
    margin: 0 !important;
    padding: 0 !important;
    justify-content: flex-end !important;
    text-align: right !important;
}

.report-page .report-filter-actions-row .report-action-buttons,
.report-page .report-filter-actions-row .report-action-buttons.report-filter-actions {
    display: inline-flex !important;
    flex: 0 0 auto !important;
    width: fit-content !important;
    max-width: 100%;
    margin: 0 0 0 auto !important;
    padding: 0 !important;
    justify-content: flex-end !important;
    align-items: center;
    gap: var(--report-filter-button-gap) !important;
    flex-wrap: wrap;
}

@media (max-width: 991.98px) {
    .report-page .report-filter-fields-row.report-filter-layout.report-filter-fields-3,
    .report-page .report-filter-fields-row.report-filter-layout.report-filter-fields-4 {
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    }
}

@media (max-width: 767.98px) {
    .report-page .report-filter-card {
        --report-filter-actions-spacing: 1rem;
    }

    .report-page .report-filter-fields-row.report-filter-layout.report-filter-fields-1,
    .report-page .report-filter-fields-row.report-filter-layout.report-filter-fields-2,
    .report-page .report-filter-fields-row.report-filter-layout.report-filter-fields-3,
    .report-page .report-filter-fields-row.report-filter-layout.report-filter-fields-4 {
        grid-template-columns: minmax(0, 1fr) !important;
    }
}

@media (max-width: 575.98px) {
    .report-page .report-filter-actions-row .report-action-buttons,
    .report-page .report-filter-actions-row .report-action-buttons.report-filter-actions {
        display: grid !important;
        grid-template-columns: repeat(2, minmax(0, 1fr));
        width: 100% !important;
        margin-left: 0 !important;
        gap: var(--report-filter-button-gap) !important;
    }

    .report-page .report-filter-actions-row .report-action-buttons .btn {
        width: 100% !important;
        min-height: 44px;
    }
}


/* Report total rows are visually distinct from detail rows and become a
   labeled summary card on small screens. */
.report-page .report-total-footer .report-total-row > th {
    background: color-mix(in srgb, var(--bs-primary) 7%, var(--bs-body-bg));
    border-top: 2px solid color-mix(in srgb, var(--bs-primary) 40%, var(--bs-border-color));
    border-bottom: 0;
    font-weight: 800;
    vertical-align: middle;
}

.report-page .report-total-label {
    display: inline-flex;
    align-items: center;
    gap: .45rem;
    color: var(--bs-emphasis-color);
    white-space: nowrap;
}

.report-page .report-total-label .bi {
    color: var(--bs-primary);
}

.report-page .report-total-scope {
    color: var(--bs-secondary-color);
    font-size: .86rem;
}

.report-page .report-total-amount {
    font-size: 1.05em;
}

@media (max-width: 767.98px) {
    .report-page .report-total-footer {
        display: block;
        width: 100%;
        padding: 0 .65rem .65rem;
    }

    .report-page .report-total-footer .report-total-row {
        display: block;
        width: 100%;
        max-width: 100%;
        margin: 0;
        padding: .25rem .95rem .7rem;
        border: 2px solid color-mix(in srgb, var(--bs-primary) 28%, var(--bs-border-color));
        border-radius: .9rem;
        background: color-mix(in srgb, var(--bs-primary) 6%, var(--bs-body-bg));
        box-shadow: 0 .2rem .65rem rgba(15, 23, 42, .06);
    }

    .report-page .report-total-footer .report-total-row > th {
        display: grid;
        grid-template-columns: minmax(7rem, .9fr) minmax(0, 1.35fr);
        align-items: center;
        gap: .75rem;
        width: 100%;
        max-width: 100%;
        padding: .7rem 0;
        border: 0;
        border-bottom: 1px solid var(--bs-border-color);
        background: transparent;
        text-align: right !important;
        overflow-wrap: anywhere;
    }

    .report-page .report-total-footer .report-total-row > th:last-child {
        border-bottom: 0;
    }

    .report-page .report-total-footer .report-total-row > th::before {
        content: attr(data-label);
        color: var(--bs-secondary-color);
        font-size: .75rem;
        font-weight: 800;
        letter-spacing: .02em;
        text-align: left;
        text-transform: uppercase;
    }

    .report-page .report-total-footer .report-total-title {
        grid-template-columns: minmax(0, 1fr) !important;
        padding-top: .8rem !important;
        padding-bottom: .8rem !important;
        text-align: left !important;
    }

    .report-page .report-total-footer .report-total-title::before {
        display: none;
    }

    .report-page .report-total-footer .report-total-label {
        font-size: 1rem;
    }

    .report-page .report-total-footer .report-total-scope {
        font-size: .85rem;
    }
}

/* REPORT.UI.1J - Purchase Order report filter rhythm and AJAX lookup spacing. */
.report-page form[data-purchase-order-report-filters] > .report-filter-fields-row + .report-filter-fields-row {
    margin-top: 1rem !important;
}

.report-page form[data-purchase-order-report-filters] .report-ajax-status:empty {
    display: none;
    min-height: 0;
    margin: 0;
}

.report-page form[data-purchase-order-report-filters] .form-text {
    margin-top: .25rem;
}

/* REPORT.UI.1J - Purchase Order workflow status tones. */
.report-status-pending-approval,.report-status-partially-received{background:rgba(245,158,11,.15);color:#b86500}
.report-status-approved,.report-status-received,.report-status-closed{background:rgba(25,135,84,.12);color:#198754}


/* REPORT.UI.1N - accessibility and responsive hardening. */
.report-page :is(a, button, input, select, textarea, [tabindex]):focus-visible {
    outline: 3px solid color-mix(in srgb, var(--bs-primary, #0d6efd) 72%, white);
    outline-offset: 2px;
}

.report-page .report-toolbar .btn,
.report-page .report-pagination-nav .btn,
.report-page .report-page-size {
    touch-action: manipulation;
}

.report-page .report-table,
.report-page .report-table td,
.report-page .report-table th,
.report-page .report-entity-main,
.report-page .report-entity-sub,
.report-page .report-note,
.report-page .report-chart-title,
.report-page .report-chart-subtitle {
    overflow-wrap: anywhere;
}

.report-page .report-chart-wrap,
.report-page canvas[data-report-chart] {
    max-width: 100%;
}

.report-page canvas[data-report-chart][role="img"] {
    display: block;
}

@media (max-width: 767.98px) {
    .report-page,
    .report-page .bm-card,
    .report-page .report-filter-card,
    .report-page .report-table-card,
    .report-page .report-chart-panel {
        min-width: 0;
        max-width: 100%;
    }

    .report-page .report-toolbar {
        width: 100%;
    }

    .report-page .report-toolbar .btn,
    .report-page .report-pagination-nav .btn,
    .report-page .report-page-size {
        min-height: 44px;
    }

    .report-page .report-pagination-controls,
    .report-page .report-pagination-nav {
        width: 100%;
        max-width: 100%;
        min-width: 0;
    }

    .report-page .report-pagination-controls {
        display: grid;
        gap: .65rem;
        overflow-x: visible;
    }

    .report-page .report-pagination-nav {
        display: grid;
        grid-template-columns: 44px 44px minmax(0, 1fr) 44px 44px;
        gap: .35rem;
        align-items: center;
    }

    .report-page .report-pagination-page {
        min-width: 0;
        padding-inline: .35rem;
        text-align: center;
        white-space: normal;
    }
}

@media (max-width: 374.98px) {
    .report-page .report-filter-card,
    .report-page .report-chart-panel {
        padding-inline: .8rem;
    }

    .report-page .report-pagination {
        padding-inline: .65rem;
    }

    .report-page .report-pagination-nav {
        grid-template-columns: 42px 42px minmax(0, 1fr) 42px 42px;
        gap: .25rem;
    }

    .report-page .report-pagination-nav .btn {
        min-width: 42px;
        padding-inline: .35rem;
    }
}

@media (prefers-reduced-motion: reduce) {
    .report-page *,
    .report-page *::before,
    .report-page *::after {
        scroll-behavior: auto !important;
        transition-duration: .01ms !important;
        animation-duration: .01ms !important;
        animation-iteration-count: 1 !important;
    }
}

@media (forced-colors: active) {
    .report-page .report-status,
    .report-page .report-summary-card,
    .report-page .report-entity-avatar,
    .report-page .report-title-icon {
        border: 1px solid CanvasText;
    }
}


/* REPORT.UI.1O - print, export, and recoverable error-state hardening. */
.report-print-status,
.report-action-error {
    margin-bottom: 1rem;
}

.report-print-status:not(.alert) {
    padding: .8rem 1rem;
    border: 1px solid var(--bs-border-color);
    border-radius: .75rem;
    background: var(--bs-tertiary-bg);
    color: var(--bs-secondary-color);
}

.report-chart-error {
    min-height: 180px;
    display: grid;
    place-items: center;
    padding: 1.25rem;
    border: 1px dashed var(--bs-border-color);
    border-radius: .75rem;
    color: var(--bs-secondary-color);
    text-align: center;
}

.report-print-mode .report-table-card,
.report-print-mode .report-chart-panel,
.report-print-mode .report-summary-card {
    break-inside: avoid;
}

@media print {
    html[data-report-print-ready="true"] .report-page {
        width: 100% !important;
        max-width: none !important;
    }

    html[data-report-print-ready="true"] .report-table {
        width: 100% !important;
        table-layout: auto;
    }

    html[data-report-print-ready="true"] .report-table tr,
    html[data-report-print-ready="true"] .report-summary-card,
    html[data-report-print-ready="true"] .report-chart-panel {
        break-inside: avoid;
    }

    html[data-report-print-ready="true"] a[href]::after {
        content: none !important;
    }
}

/* PO.FIN.10 - compact progress indicators for Purchase Order Summary financial state. */
.report-page .po-financial-progress-cell {
    width: 250px;
    min-width: 220px;
}

.report-page .po-financial-progress {
    display: grid;
    gap: .42rem;
    min-width: 0;
}

.report-page .po-financial-progress-row {
    display: grid;
    grid-template-columns: 4.2rem minmax(72px, 1fr) 3rem;
    align-items: center;
    gap: .5rem;
    min-width: 0;
}

.report-page .po-financial-progress-label {
    color: var(--bs-secondary-color);
    font-size: .72rem;
    font-weight: 700;
    line-height: 1;
}

.report-page .po-financial-progress-track {
    display: block;
    height: .42rem;
    overflow: hidden;
    border-radius: 999px;
    background: color-mix(in srgb, var(--bs-secondary-color) 14%, transparent);
}

.report-page .po-financial-progress-fill {
    display: block;
    height: 100%;
    min-width: 0;
    border-radius: inherit;
}

.report-page .po-financial-progress-success { background: var(--report-green); }
.report-page .po-financial-progress-warning { background: var(--report-orange); }
.report-page .po-financial-progress-danger { background: var(--report-red); }
.report-page .po-financial-progress-neutral { background: var(--report-slate); opacity: .42; }

.report-page .po-financial-progress-value {
    text-align: right;
    color: var(--bs-body-color);
    font-size: .72rem;
    font-weight: 800;
    font-variant-numeric: tabular-nums;
    white-space: nowrap;
}

.report-page .po-financial-match-row {
    grid-template-columns: 4.2rem minmax(72px, 1fr) auto;
}

.report-page .po-financial-match-value {
    font-size: .7rem;
    font-weight: 800;
    white-space: nowrap;
}

.report-page .po-financial-match-success { color: var(--report-green); }
.report-page .po-financial-match-warning { color: #b86500; }
.report-page .po-financial-match-danger { color: var(--report-red); }
.report-page .po-financial-match-neutral { color: var(--report-slate); }

@media (max-width: 767.98px) {
    .report-page .po-financial-progress-cell {
        width: auto;
        min-width: 0;
    }

    .report-page .po-financial-progress {
        width: min(100%, 320px);
        margin-left: auto;
    }
}

/* PO.FIN.12 - Option 2 visual progress indicators for Purchase Orders by Work Order. */
.report-page .po-workorder-identity-cell > a {
    white-space: nowrap;
}

.report-page .po-workorder-progress-cell {
    min-width: 118px;
    vertical-align: middle;
}

.report-page .po-workorder-progress-value {
    white-space: nowrap;
    line-height: 1.15;
}

.report-page .po-workorder-progress-track {
    width: 100%;
    max-width: 92px;
    height: 6px;
    margin: 7px 0 3px auto;
    overflow: hidden;
    border-radius: 999px;
    background: color-mix(in srgb, var(--report-slate) 16%, transparent);
}

.report-page .po-workorder-progress-fill {
    display: block;
    height: 100%;
    min-width: 0;
    border-radius: inherit;
    transition: width .2s ease;
}

.report-page .po-workorder-progress-commitment {
    background: var(--report-purple);
}

.report-page .po-workorder-progress-received {
    background: var(--report-blue);
}

.report-page .po-workorder-progress-cost {
    background: var(--report-green);
}

.report-page .po-workorder-progress-percent {
    color: var(--report-slate);
    font-size: .72rem;
    font-weight: 700;
    line-height: 1;
}

@media (max-width: 767.98px) {
    .report-page .po-workorder-progress-cell {
        min-width: 0;
    }

    .report-page .po-workorder-progress-track {
        width: min(42vw, 150px);
        max-width: 150px;
    }
}

/* PO.FIN.12/13 - controlled report header wrapping and receiving/outstanding layout. */
.report-page .po-report-multiline-header {
    display: inline-block;
    line-height: 1.15;
    white-space: nowrap;
}

.report-page .po-report-date-cell {
    white-space: nowrap;
}

@media (min-width: 992px) {
    .report-page .po-workorder-report-table {
        table-layout: fixed;
        width: 100%;
    }

    .report-page .po-workorder-report-table th:nth-child(1) { width: 9%; }
    .report-page .po-workorder-report-table th:nth-child(2) { width: 10%; }
    .report-page .po-workorder-report-table th:nth-child(3) { width: 16%; }
    .report-page .po-workorder-report-table th:nth-child(4) { width: 10%; }
    .report-page .po-workorder-report-table th:nth-child(5) { width: 8%; }
    .report-page .po-workorder-report-table th:nth-child(6) { width: 7%; }
    .report-page .po-workorder-report-table th:nth-child(7) { width: 10%; }
    .report-page .po-workorder-report-table th:nth-child(8) { width: 8%; }
    .report-page .po-workorder-report-table th:nth-child(9) { width: 9%; }
    .report-page .po-workorder-report-table th:nth-child(10) { width: 8%; }
    .report-page .po-workorder-report-table th:nth-child(11) { width: 5%; }

    .report-page .po-workorder-metric-header {
        white-space: normal;
        line-height: 1.15;
        text-align: right;
        vertical-align: middle;
    }

    .report-page .po-workorder-metric-header > span {
        display: block;
        white-space: nowrap;
    }

    .report-page .po-workorder-customer-cell {
        overflow-wrap: normal;
        word-break: normal;
    }

    .report-page .po-workorder-date-cell {
        white-space: nowrap;
    }

    .report-page .po-fin13-outstanding-table {
        table-layout: fixed;
        width: 100%;
    }

    .report-page .po-fin13-outstanding-table th:nth-child(1) { width: 9%; }
    .report-page .po-fin13-outstanding-table th:nth-child(2) { width: 16%; }
    .report-page .po-fin13-outstanding-table th:nth-child(3) { width: 9%; }
    .report-page .po-fin13-outstanding-table th:nth-child(4) { width: 9%; }
    .report-page .po-fin13-outstanding-table th:nth-child(5) { width: 12%; }
    .report-page .po-fin13-outstanding-table th:nth-child(6) { width: 11%; }
    .report-page .po-fin13-outstanding-table th:nth-child(7) { width: 11%; }
    .report-page .po-fin13-outstanding-table th:nth-child(8) { width: 11%; }
    .report-page .po-fin13-outstanding-table th:nth-child(9) { width: 12%; }
}

.report-page .po-fin13-quantity-cell {
    min-width: 125px;
}

.report-page .po-fin13-quantity-cell > div {
    display: flex;
    justify-content: space-between;
    gap: .75rem;
    line-height: 1.35;
    white-space: nowrap;
}

.report-page .po-fin13-quantity-cell span {
    color: var(--report-slate);
    font-size: .72rem;
    font-weight: 700;
}

@media (max-width: 767.98px) {
    .report-page .po-report-multiline-header {
        white-space: normal;
    }

    .report-page .po-fin13-quantity-cell {
        min-width: 0;
    }

    .report-page .po-fin13-quantity-cell > div {
        width: min(100%, 240px);
        margin-left: auto;
    }
}

/* PO report visual-fit refinement - Summary, Receiving & Outstanding, and By Work Order. */
.report-page .po-report-no-horizontal-scroll {
    overflow-x: visible;
}

.report-page .po-summary-report-table .report-money,
.report-page .po-fin13-outstanding-table .report-money,
.report-page .po-workorder-report-table .report-money,
.report-page .po-workorder-cost-delta-cell,
.report-page .po-workorder-nowrap-header {
    white-space: nowrap;
}

.report-page .po-pending-money,
.report-page .po-pending-money > strong {
    color: var(--report-red) !important;
}

.report-page .po-fin13-quantity-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: .3rem;
    min-width: 0;
}

.report-page .po-fin13-quantity {
    display: grid;
    justify-items: center;
    gap: .15rem;
    min-width: 0;
    padding: .42rem .3rem;
    border-radius: .5rem;
    line-height: 1.05;
}

.report-page .po-fin13-quantity span {
    font-size: .66rem;
    font-weight: 800;
    white-space: nowrap;
}

.report-page .po-fin13-quantity strong {
    font-size: 1rem;
    font-variant-numeric: tabular-nums;
    white-space: nowrap;
}

.report-page .po-fin13-quantity-ordered {
    color: var(--report-blue);
    background: color-mix(in srgb, var(--report-blue) 10%, transparent);
}

.report-page .po-fin13-quantity-received {
    color: var(--report-green);
    background: color-mix(in srgb, var(--report-green) 10%, transparent);
}

.report-page .po-fin13-quantity-outstanding {
    color: var(--report-red);
    background: color-mix(in srgb, var(--report-red) 10%, transparent);
}

@media (min-width: 768px) {
    .report-page .po-summary-report-table,
    .report-page .po-fin13-outstanding-table,
    .report-page .po-workorder-report-table {
        table-layout: fixed;
        width: 100%;
    }

    .report-page .po-summary-report-table th:nth-child(1) { width: 8%; }
    .report-page .po-summary-report-table th:nth-child(2) { width: 12%; }
    .report-page .po-summary-report-table th:nth-child(3) { width: 9%; }
    .report-page .po-summary-report-table th:nth-child(4) { width: 10%; }
    .report-page .po-summary-report-table th:nth-child(5) { width: 9%; }
    .report-page .po-summary-report-table th:nth-child(6) { width: 9%; }
    .report-page .po-summary-report-table th:nth-child(7) { width: 8%; }
    .report-page .po-summary-report-table th:nth-child(8) { width: 8%; }
    .report-page .po-summary-report-table th:nth-child(9) { width: 10%; }
    .report-page .po-summary-report-table th:nth-child(10) { width: 17%; }

    .report-page .po-summary-report-table .po-financial-progress-cell {
        width: auto;
        min-width: 0;
    }

    .report-page .po-summary-report-table .po-financial-progress-row {
        grid-template-columns: 3.7rem minmax(38px, 1fr) 2.6rem;
        gap: .3rem;
    }

    .report-page .po-summary-report-table .po-financial-match-row {
        grid-template-columns: 3.7rem minmax(38px, 1fr) auto;
    }

    .report-page .po-fin13-outstanding-table th:nth-child(1) { width: 9%; }
    .report-page .po-fin13-outstanding-table th:nth-child(2) { width: 15%; }
    .report-page .po-fin13-outstanding-table th:nth-child(3) { width: 9%; }
    .report-page .po-fin13-outstanding-table th:nth-child(4) { width: 9%; }
    .report-page .po-fin13-outstanding-table th:nth-child(5) { width: 16%; }
    .report-page .po-fin13-outstanding-table th:nth-child(6) { width: 10%; }
    .report-page .po-fin13-outstanding-table th:nth-child(7) { width: 10%; }
    .report-page .po-fin13-outstanding-table th:nth-child(8) { width: 10%; }
    .report-page .po-fin13-outstanding-table th:nth-child(9) { width: 12%; }

    .report-page .po-fin13-quantity-cell {
        min-width: 0;
    }

    .report-page .po-workorder-report-table th:nth-child(1) { width: 9%; }
    .report-page .po-workorder-report-table th:nth-child(2) { width: 10%; }
    .report-page .po-workorder-report-table th:nth-child(3) { width: 15%; }
    .report-page .po-workorder-report-table th:nth-child(4) { width: 10%; }
    .report-page .po-workorder-report-table th:nth-child(5) { width: 8%; }
    .report-page .po-workorder-report-table th:nth-child(6) { width: 7%; }
    .report-page .po-workorder-report-table th:nth-child(7) { width: 10%; }
    .report-page .po-workorder-report-table th:nth-child(8) { width: 8%; }
    .report-page .po-workorder-report-table th:nth-child(9) { width: 9%; }
    .report-page .po-workorder-report-table th:nth-child(10) { width: 7%; }
    .report-page .po-workorder-report-table th:nth-child(11) { width: 7%; }
}

@media (max-width: 767.98px) {
    .report-page .po-fin13-quantity-grid {
        width: min(100%, 300px);
        margin-left: auto;
    }
}


/* PO report visual polish follow-up - Summary, By Work Order, Outstanding Receiving, By Vendor. */
.report-page .po-summary-tax-shipping {
    display: flex;
    flex-direction: column;
    align-items: flex-end;
    gap: .05rem;
    white-space: normal !important;
    line-height: 1.15;
}

.report-page .po-summary-tax-shipping > span:first-child {
    white-space: nowrap;
}

.report-page .po-summary-tax-shipping-value {
    white-space: nowrap;
    font-variant-numeric: tabular-nums;
}

.report-page .po-bill-variance-review {
    display: inline-flex;
    align-items: center;
    justify-content: flex-end;
    gap: .3rem;
    color: #b86500;
    font-weight: 800;
    white-space: nowrap;
}

.report-page .po-bill-variance-review .bi {
    font-size: .78rem;
}

@media (min-width: 768px) {
    .report-page .po-workorder-report-table th:nth-child(3) { width: 14%; }
    .report-page .po-workorder-report-table th:nth-child(10) { width: 8%; }
    .report-page .po-workorder-report-table th:nth-child(11) { width: 8%; }

    .report-page .po-workorder-metric-header > span {
        font-size: .76rem;
        letter-spacing: -.01em;
    }
}

@media (max-width: 767.98px) {
    .report-page .po-fin13-outstanding-table td[data-label="Financial Pending Balance"] {
        display: grid !important;
        grid-template-columns: minmax(105px, .42fr) minmax(0, .58fr);
        align-items: center;
        column-gap: .75rem;
        text-align: left !important;
    }

    .report-page .po-fin13-outstanding-table td[data-label="Financial Pending Balance"]::before {
        display: block;
        max-width: 11rem;
        line-height: 1.15;
        text-align: left;
        white-space: normal;
        overflow-wrap: normal;
        word-break: normal;
    }

    .report-page .po-fin13-outstanding-table td[data-label="Financial Pending Balance"] > strong {
        justify-self: start;
        white-space: nowrap;
    }
}

/* PO.FIN.14 - approval, receiving, billing and payment remain independent workflow facts. */
.report-status-not-submitted,
.report-status-not-received,
.report-status-not-billed,
.report-status-unpaid {
    background: rgba(100,116,139,.12);
    color: var(--report-slate);
}
.report-status-not-required {
    background: rgba(37,99,235,.12);
    color: var(--report-blue);
}
.report-status-partially-billed,
.report-status-payment-pending {
    background: rgba(245,158,11,.15);
    color: #b86500;
}
.report-status-billed,
.report-status-paid-in-full {
    background: rgba(25,135,84,.12);
    color: var(--report-green);
}
.report-status-variance,
.report-status-overpaid {
    background: rgba(220,53,69,.12);
    color: var(--report-red);
}
.po-fin14-independence-note strong:first-of-type {
    color: var(--bs-body-color);
}

/* Option C lifecycle summary: quantities + financials + independent workflow statuses. */
.report-page .po-fin14-workflow-table .po-fin14-money,
.report-page .po-fin14-workflow-table .po-fin14-money-header {
    white-space: nowrap;
}

.report-page .po-fin14-workflow-table .po-fin14-quantity-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: .25rem;
    min-width: 0;
}

.report-page .po-fin14-workflow-table .po-fin14-quantity-chip {
    min-width: 0;
    padding: .35rem .2rem;
    border-radius: .45rem;
    text-align: center;
    line-height: 1.05;
}

.report-page .po-fin14-workflow-table .po-fin14-quantity-chip span,
.report-page .po-fin14-workflow-table .po-fin14-quantity-chip strong {
    display: block;
}

.report-page .po-fin14-workflow-table .po-fin14-quantity-chip span {
    font-size: .66rem;
    font-weight: 700;
    color: var(--report-slate);
}

.report-page .po-fin14-workflow-table .po-fin14-quantity-chip strong {
    margin-top: .2rem;
    font-size: .95rem;
    white-space: nowrap;
}

.report-page .po-fin14-workflow-table .po-fin14-quantity-ordered {
    background: rgba(37,99,235,.09);
    color: var(--report-blue);
}
.report-page .po-fin14-workflow-table .po-fin14-quantity-received {
    background: rgba(25,135,84,.09);
    color: var(--report-green);
}
.report-page .po-fin14-workflow-table .po-fin14-quantity-remaining {
    background: rgba(220,53,69,.09);
    color: var(--report-red);
}
.report-page .po-fin14-workflow-table .po-fin14-quantity-remaining strong:where(:not(:empty)) {
    color: inherit;
}

.report-page .po-fin14-workflow-table .po-fin14-status-meta {
    display: block;
    margin-top: .25rem;
    font-size: .68rem;
    line-height: 1.15;
    color: var(--report-slate);
}

@media (min-width: 992px) {
    .report-page .po-fin14-workflow-table {
        table-layout: fixed;
        width: 100%;
    }

    .report-page .po-fin14-workflow-table th,
    .report-page .po-fin14-workflow-table td {
        min-width: 0;
        padding-left: .35rem;
        padding-right: .35rem;
        overflow-wrap: anywhere;
    }

    .report-page .po-fin14-workflow-table thead th {
        white-space: normal;
        font-size: .72rem;
        line-height: 1.05;
    }

    .report-page .po-fin14-workflow-table td {
        font-size: .86rem;
    }

    .report-page .po-fin14-workflow-table .report-status-badge {
        max-width: 100%;
        padding: .34rem .42rem;
        font-size: .72rem;
        line-height: 1.05;
        white-space: normal;
    }

    .report-page .po-fin14-workflow-table th:nth-child(1)  { width: 7%; }
    .report-page .po-fin14-workflow-table th:nth-child(2)  { width: 9%; }
    .report-page .po-fin14-workflow-table th:nth-child(3)  { width: 11%; }
    .report-page .po-fin14-workflow-table th:nth-child(4)  { width: 15%; }
    .report-page .po-fin14-workflow-table th:nth-child(5)  { width: 8%; }
    .report-page .po-fin14-workflow-table th:nth-child(6)  { width: 8%; }
    .report-page .po-fin14-workflow-table th:nth-child(7)  { width: 8%; }
    .report-page .po-fin14-workflow-table th:nth-child(8)  { width: 9%; }
    .report-page .po-fin14-workflow-table th:nth-child(9)  { width: 7%; }
    .report-page .po-fin14-workflow-table th:nth-child(10) { width: 6%; }
    .report-page .po-fin14-workflow-table th:nth-child(11) { width: 6%; }
    .report-page .po-fin14-workflow-table th:nth-child(12) { width: 6%; }
}

@media (max-width: 767.98px) {
    .report-page .po-fin14-workflow-table td[data-label="Quantities"] {
        align-items: start;
    }

    .report-page .po-fin14-workflow-table td[data-label="Quantities"] .po-fin14-quantity-grid {
        width: 100%;
    }

    .report-page .po-fin14-workflow-table .po-fin14-quantity-chip {
        padding: .45rem .25rem;
    }

    .report-page .po-fin14-workflow-table .po-fin14-quantity-chip span {
        font-size: .68rem;
    }

    .report-page .po-fin14-workflow-table .po-fin14-quantity-chip strong {
        font-size: 1rem;
    }

    .report-page .po-fin14-workflow-table td[data-label="PO Total"],
    .report-page .po-fin14-workflow-table td[data-label="Received"],
    .report-page .po-fin14-workflow-table td[data-label="Remaining"] {
        text-align: left !important;
    }

    .report-page .po-fin14-workflow-table .po-fin14-status-meta {
        max-width: 100%;
    }
}

/* PO.FIN.15 — authoritative PO / receiving / expense reconciliation. */
.report-page .po-fin15-reconciliation-table .report-money {
    white-space: nowrap;
}

.report-page .po-fin15-reconciliation-table .report-status-badge {
    max-width: 100%;
    justify-content: center;
    text-align: center;
}

@media (min-width: 992px) {
    .report-page .po-fin15-reconciliation-table {
        width: 100%;
        table-layout: fixed;
    }

    .report-page .po-fin15-reconciliation-table th,
    .report-page .po-fin15-reconciliation-table td {
        padding-left: .5rem;
        padding-right: .5rem;
        min-width: 0;
    }

    .report-page .po-fin15-reconciliation-table th:nth-child(1)  { width: 8%; }
    .report-page .po-fin15-reconciliation-table th:nth-child(2)  { width: 12%; }
    .report-page .po-fin15-reconciliation-table th:nth-child(3)  { width: 8%; }
    .report-page .po-fin15-reconciliation-table th:nth-child(4)  { width: 8%; }
    .report-page .po-fin15-reconciliation-table th:nth-child(5)  { width: 8%; }
    .report-page .po-fin15-reconciliation-table th:nth-child(6)  { width: 7%; }
    .report-page .po-fin15-reconciliation-table th:nth-child(7)  { width: 8%; }
    .report-page .po-fin15-reconciliation-table th:nth-child(8)  { width: 8%; }
    .report-page .po-fin15-reconciliation-table th:nth-child(9)  { width: 8%; }
    .report-page .po-fin15-reconciliation-table th:nth-child(10) { width: 10%; }
    .report-page .po-fin15-reconciliation-table th:nth-child(11) { width: 15%; }

    .report-page .po-fin15-reconciliation-table th:nth-child(1),
    .report-page .po-fin15-reconciliation-table td:nth-child(1) {
        padding-right: .85rem;
    }

    .report-page .po-fin15-reconciliation-table th:nth-child(2),
    .report-page .po-fin15-reconciliation-table td:nth-child(2) {
        padding-left: .85rem;
    }
}

@media (max-width: 767.98px) {
    .report-page .po-fin15-reconciliation-table td[data-label="PO Commitment"],
    .report-page .po-fin15-reconciliation-table td[data-label="Received Items"],
    .report-page .po-fin15-reconciliation-table td[data-label="Vendor Expenses"],
    .report-page .po-fin15-reconciliation-table td[data-label="Applied Payments"],
    .report-page .po-fin15-reconciliation-table td[data-label="Unbilled Receipts"],
    .report-page .po-fin15-reconciliation-table td[data-label="Pending Balance"],
    .report-page .po-fin15-reconciliation-table td[data-label="PO / Bill Variance"] {
        text-align: left !important;
    }
}

.report-page .report-status-reconciled {
    background: rgba(25, 135, 84, .10);
    color: var(--report-green);
}

.report-page .report-status-action-required {
    background: rgba(255, 193, 7, .14);
    color: #9a5b00;
}


/* PO.FIN.16 — production exception indicators */
.report-page .po-fin16-exception-list {
    display: flex;
    flex-wrap: wrap;
    gap: .25rem;
}

.report-page .po-fin16-exception-chip {
    display: inline-flex;
    align-items: center;
    max-width: 100%;
    padding: .15rem .4rem;
    border-radius: 999px;
    font-size: .69rem;
    font-weight: 700;
    line-height: 1.2;
    white-space: normal;
}

.report-page .po-fin16-exception-warning {
    color: var(--bs-warning-text-emphasis);
    background: var(--bs-warning-bg-subtle);
}

.report-page .po-fin16-exception-danger {
    color: var(--bs-danger-text-emphasis);
    background: var(--bs-danger-bg-subtle);
}

.report-page .po-fin16-exception-clear {
    display: inline-flex;
    align-items: center;
    gap: .25rem;
    color: var(--bs-success-text-emphasis);
    font-size: .75rem;
    font-weight: 700;
}

@media (max-width: 767.98px) {
    .report-page .po-fin16-exceptions-cell .po-fin16-exception-list {
        justify-content: flex-start;
    }
}

/* PO.FIN.20 report fit regression: these fixed-layout PO grids must fit the
   desktop report card without creating a nested horizontal scrollbar. */
@media (min-width: 768px) {
    .report-page .report-table-card > .table-responsive.po-report-no-horizontal-scroll {
        width: 100%;
        max-width: 100%;
        overflow-x: hidden;
        overflow-y: visible;
    }

    .report-page .po-fin13-outstanding-table,
    .report-page .po-workorder-report-table {
        width: 100%;
        max-width: 100%;
        table-layout: fixed;
    }

    /* Give the two-line Remaining Commitment label enough room to render
       completely while preserving the intentionally compact desktop grid. */
    .report-page .po-workorder-report-table th:nth-child(3) { width: 13%; }
    .report-page .po-workorder-report-table th:nth-child(10) { width: 10%; }
    .report-page .po-workorder-report-table th:nth-child(11) { width: 7%; }

    .report-page .po-workorder-metric-header > span {
        max-width: 100%;
        overflow: visible;
        text-overflow: clip;
    }
}


/* PO.FIN.20 header-fit follow-up: keep every desktop report heading inside the card.
   Widths total 100% and long financial headers use controlled two-line labels. */
@media (min-width: 768px) {
    .report-page .po-workorder-report-table th,
    .report-page .po-fin13-outstanding-table th {
        min-width: 0;
        padding-left: .45rem;
        padding-right: .45rem;
        font-size: .72rem;
        line-height: 1.05;
        overflow: visible;
        text-overflow: clip;
    }

    /* By Work Order = exactly 100%. */
    .report-page .po-workorder-report-table th:nth-child(1)  { width: 8%; }
    .report-page .po-workorder-report-table th:nth-child(2)  { width: 9%; }
    .report-page .po-workorder-report-table th:nth-child(3)  { width: 12%; }
    .report-page .po-workorder-report-table th:nth-child(4)  { width: 9%; }
    .report-page .po-workorder-report-table th:nth-child(5)  { width: 7%; }
    .report-page .po-workorder-report-table th:nth-child(6)  { width: 7%; }
    .report-page .po-workorder-report-table th:nth-child(7)  { width: 10%; }
    .report-page .po-workorder-report-table th:nth-child(8)  { width: 8%; }
    .report-page .po-workorder-report-table th:nth-child(9)  { width: 9%; }
    .report-page .po-workorder-report-table th:nth-child(10) { width: 10%; }
    .report-page .po-workorder-report-table th:nth-child(11) { width: 11%; }

    .report-page .po-workorder-metric-header > span,
    .report-page .po-outstanding-financial-header > span {
        display: block;
        max-width: 100%;
        white-space: nowrap;
        overflow: visible;
        text-overflow: clip;
    }

    /* Outstanding Receiving = exactly 100%, with extra room for the final heading. */
    .report-page .po-fin13-outstanding-table th:nth-child(1) { width: 8%; }
    .report-page .po-fin13-outstanding-table th:nth-child(2) { width: 14%; }
    .report-page .po-fin13-outstanding-table th:nth-child(3) { width: 8%; }
    .report-page .po-fin13-outstanding-table th:nth-child(4) { width: 8%; }
    .report-page .po-fin13-outstanding-table th:nth-child(5) { width: 15%; }
    .report-page .po-fin13-outstanding-table th:nth-child(6) { width: 11%; }
    .report-page .po-fin13-outstanding-table th:nth-child(7) { width: 11%; }
    .report-page .po-fin13-outstanding-table th:nth-child(8) { width: 11%; }
    .report-page .po-fin13-outstanding-table th:nth-child(9) { width: 14%; }
}

/* ==========================================================
   VALUE.1J - ONLINE PAYMENT REPORT PRESENTATION
   ========================================================== */
.online-payments-report .report-search-input-group {
    flex-wrap: nowrap;
}

.online-payments-report .online-payment-ajax-status {
    min-height: 1.1rem;
    margin-top: .35rem;
    color: var(--bs-secondary-color);
    font-size: .78rem;
    text-align: right;
}

.online-payments-report.online-payment-report-loading .report-summary-grid,
.online-payments-report.online-payment-report-loading .online-payment-table-card {
    opacity: .62;
    transition: opacity 120ms ease;
}

.online-payment-grid-heading {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    padding: 1rem 1.2rem;
    border-bottom: 1px solid var(--bs-border-color);
    background: linear-gradient(180deg, rgba(248, 251, 255, .98), var(--bs-body-bg));
}

.online-payment-grid-title {
    display: flex;
    align-items: center;
    gap: .5rem;
    font-weight: 800;
    color: var(--bs-body-color);
}

.online-payment-grid-title i {
    color: var(--report-blue);
}

.online-payment-grid-subtitle {
    margin-top: .2rem;
    color: var(--bs-secondary-color);
    font-size: .82rem;
}

.online-payment-grid-legend {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: .45rem 1rem;
    color: var(--bs-secondary-color);
    font-size: .78rem;
    white-space: nowrap;
}

.online-payment-grid-legend span {
    display: inline-flex;
    align-items: center;
    gap: .35rem;
}

.online-payments-report .online-payment-table td,
.online-payments-report .online-payment-table th {
    overflow-wrap: normal;
}

.online-payments-report .online-payment-money,
.online-payments-report .online-payment-money-header,
.online-payments-report .online-payment-businessmanager-fee-header,
.online-payments-report .online-payment-invoice-cell,
.online-payments-report .online-payment-method,
.online-payments-report .online-payment-status-badge {
    white-space: nowrap;
    overflow-wrap: normal !important;
}

.online-payments-report .online-payment-money {
    min-width: 6rem;
}

.online-payments-report .online-payment-businessmanager-fee-header {
    min-width: 10rem;
}

.online-payments-report .online-payment-businessmanager-fee-header > span,
.online-payments-report .online-payment-businessmanager-fee-header > small {
    display: block;
    white-space: nowrap;
}

.online-payments-report .online-payment-businessmanager-fee-header > small {
    margin-top: .1rem;
    color: var(--report-blue);
    font-size: .63rem;
    font-weight: 700;
    letter-spacing: .02em;
    text-transform: none;
}

.online-payments-report .online-payment-date {
    min-width: 7.8rem;
    white-space: nowrap;
}

.online-payments-report .online-payment-date > span {
    display: block;
    margin-top: .12rem;
    color: var(--bs-secondary-color);
    font-size: .8rem;
    white-space: nowrap;
}

.online-payments-report .online-payment-invoice-cell {
    min-width: 8rem;
}

.online-payments-report .online-payment-customer-cell {
    min-width: 12rem;
}

.online-payments-report .online-payment-method {
    display: table-cell;
}

.online-payments-report .online-payment-method i {
    margin-right: .35rem;
    color: var(--report-blue);
}

.online-payments-report .customer-quick-card-trigger,
.online-payments-report .online-payment-invoice-trigger {
    font-weight: 700;
}

.online-payment-invoice-card-meta {
    display: grid;
    gap: .4rem;
    color: var(--bs-secondary-color);
    font-size: .78rem;
}

.online-payment-invoice-card-meta span {
    display: flex;
    align-items: center;
    gap: .45rem;
}

.online-payment-invoice-card-meta i {
    color: #3f60e8;
}

.online-payment-invoice-card-status {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    margin: .8rem 0;
    padding: .55rem .7rem;
    border-radius: .7rem;
    background: #eef3ff;
    color: #334155;
    font-size: .8rem;
}

.online-payment-invoice-card-status strong {
    color: #3155dd;
}

.online-payment-invoice-card-financials {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: .45rem;
}

.online-payment-invoice-card-financials > div {
    padding: .55rem .6rem;
    border: 1px solid rgba(79, 110, 247, .14);
    border-radius: .65rem;
    background: #fff;
    text-align: center;
}

.online-payment-invoice-card-financials span,
.online-payment-invoice-card-financials strong {
    display: block;
    white-space: nowrap;
}

.online-payment-invoice-card-financials span {
    color: var(--bs-secondary-color);
    font-size: .66rem;
    font-weight: 700;
    text-transform: uppercase;
}

.online-payment-invoice-card-financials strong {
    margin-top: .12rem;
    color: #111827;
    font-size: .84rem;
}

@media (max-width: 991.98px) {
    .online-payment-grid-heading {
        align-items: flex-start;
        flex-direction: column;
    }
}

@media (max-width: 767.98px) {
    .online-payments-report .online-payment-table td,
    .online-payments-report .online-payment-table th {
        white-space: normal;
    }

    .online-payments-report .online-payment-money,
    .online-payments-report .online-payment-invoice-cell,
    .online-payments-report .online-payment-customer-cell,
    .online-payments-report .online-payment-method,
    .online-payments-report .online-payment-date {
        min-width: 0;
    }

    .online-payments-report .online-payment-money,
    .online-payments-report .online-payment-date,
    .online-payments-report .online-payment-status-badge {
        white-space: nowrap;
    }

    .online-payment-grid-legend {
        white-space: normal;
    }
}


/* VALUE.1J follow-up: this report must never create its own horizontal scroll bar.
   Keep the regression-required .table-responsive wrapper, but fit the desktop
   financial grid to the report card and let the existing mobile stacked-table
   treatment handle narrow screens. */
.online-payments-report .online-payment-table-wrap {
    overflow-x: clip !important;
    overflow-y: visible !important;
    scrollbar-width: none;
}

.online-payments-report .online-payment-table-wrap::-webkit-scrollbar {
    display: none;
}

@media (min-width: 768px) {
    .online-payments-report .online-payment-table {
        width: 100%;
        table-layout: fixed;
    }

    .online-payments-report .online-payment-table th,
    .online-payments-report .online-payment-table td {
        padding-left: .55rem;
        padding-right: .55rem;
    }

    .online-payments-report .online-payment-table th:nth-child(1) { width: 8%; }
    .online-payments-report .online-payment-table th:nth-child(2) { width: 10%; }
    .online-payments-report .online-payment-table th:nth-child(3) { width: 14%; }
    .online-payments-report .online-payment-table th:nth-child(4) { width: 9%; }
    .online-payments-report .online-payment-table th:nth-child(5) { width: 11%; }
    .online-payments-report .online-payment-table th:nth-child(6) { width: 8%; }
    .online-payments-report .online-payment-table th:nth-child(7) { width: 8%; }
    .online-payments-report .online-payment-table th:nth-child(8) { width: 10%; }
    .online-payments-report .online-payment-table th:nth-child(9) { width: 13%; }
    .online-payments-report .online-payment-table th:nth-child(10) { width: 9%; }

    .online-payments-report .online-payment-customer-cell,
    .online-payments-report .online-payment-invoice-cell,
    .online-payments-report .online-payment-method,
    .online-payments-report .online-payment-money,
    .online-payments-report .online-payment-date {
        min-width: 0;
    }

    .online-payments-report .customer-quick-card,
    .online-payments-report .customer-quick-card-trigger,
    .online-payments-report .online-payment-invoice-trigger {
        max-width: 100%;
        min-width: 0;
    }

    .online-payments-report .customer-quick-card-trigger > span,
    .online-payments-report .online-payment-invoice-trigger > span {
        display: inline-block;
        max-width: calc(100% - 1.35rem);
        overflow: hidden;
        text-overflow: ellipsis;
        white-space: nowrap;
        vertical-align: bottom;
    }

    .online-payments-report .online-payment-status-badge {
        max-width: 100%;
        font-size: .68rem;
        padding: .3rem .5rem;
    }

    .online-payments-report .online-payment-businessmanager-fee-header {
        min-width: 0;
        white-space: normal;
        line-height: 1.1;
    }

    .online-payments-report .online-payment-businessmanager-fee-header > span,
    .online-payments-report .online-payment-businessmanager-fee-header > small {
        white-space: normal;
    }
}

/* VALUE.1J financial-column polish: distinguish gross, Stripe processing,
   BusinessManager platform fee, and merchant net without adding grid scrolling. */
@media (min-width: 768px) {
    .online-payments-report .online-payment-table th:nth-child(1) { width: 7%; }
    .online-payments-report .online-payment-table th:nth-child(2) { width: 11%; }
    .online-payments-report .online-payment-table th:nth-child(3) { width: 13%; }
    .online-payments-report .online-payment-table th:nth-child(4) { width: 9%; }
    .online-payments-report .online-payment-table th:nth-child(5) { width: 11%; }
    .online-payments-report .online-payment-table th:nth-child(6) { width: 7%; }
    .online-payments-report .online-payment-table th:nth-child(7) { width: 8%; }
    .online-payments-report .online-payment-table th:nth-child(8) { width: 11%; }
    .online-payments-report .online-payment-table th:nth-child(9) { width: 14%; }
    .online-payments-report .online-payment-table th:nth-child(10) { width: 9%; }

    .online-payments-report .online-payment-date {
        font-size: .80rem;
        line-height: 1.28;
    }

    .online-payments-report .online-payment-date > span { font-size: .70rem; }

    .online-payments-report .online-payment-invoice-trigger {
        font-size: .84rem;
        letter-spacing: -.01em;
    }

    .online-payments-report .online-payment-invoice-trigger > span {
        max-width: none;
        overflow: visible;
        text-overflow: clip;
        white-space: nowrap;
    }

    .online-payments-report .online-payment-customer-cell,
    .online-payments-report .customer-quick-card-trigger {
        font-size: .82rem;
        line-height: 1.25;
    }
}

.online-payments-report .online-payment-stripe-fee-header > span,
.online-payments-report .online-payment-stripe-fee-header > small,
.online-payments-report .online-payment-businessmanager-fee-header > span,
.online-payments-report .online-payment-businessmanager-fee-header > small {
    display: block;
}

.online-payments-report .online-payment-stripe-fee-header > small,
.online-payments-report .online-payment-businessmanager-fee-header > small {
    margin-top: .12rem;
    font-size: .61rem;
    font-weight: 800;
    letter-spacing: .01em;
    text-transform: none;
}

.online-payments-report .online-payment-gross-header,
.online-payments-report .online-payment-gross-value { background: rgba(59, 130, 246, .055); }
.online-payments-report .online-payment-gross-header {
    color: #3158b8;
    box-shadow: inset 0 3px 0 rgba(59, 130, 246, .55);
}

.online-payments-report .online-payment-stripe-fee-header,
.online-payments-report .online-payment-stripe-fee-value { background: rgba(245, 158, 11, .08); }
.online-payments-report .online-payment-stripe-fee-header {
    color: #9a5a00;
    box-shadow: inset 0 3px 0 rgba(245, 158, 11, .72);
}
.online-payments-report .online-payment-stripe-fee-header > small { color: #b56b00; }
.online-payments-report .online-payment-stripe-fee-value { color: #8f5700; }

.online-payments-report .online-payment-businessmanager-fee-header,
.online-payments-report .online-payment-businessmanager-fee-value { background: rgba(124, 58, 237, .075); }
.online-payments-report .online-payment-businessmanager-fee-header {
    color: #6740ba;
    box-shadow: inset 0 3px 0 rgba(124, 58, 237, .68);
}
.online-payments-report .online-payment-businessmanager-fee-header > small { color: #7652c7; }
.online-payments-report .online-payment-businessmanager-fee-value { color: #6036ad; }

.online-payments-report .online-payment-net-header,
.online-payments-report .online-payment-net-value { background: rgba(22, 163, 74, .065); }
.online-payments-report .online-payment-net-header {
    color: #237a42;
    box-shadow: inset 0 3px 0 rgba(22, 163, 74, .58);
}
.online-payments-report .online-payment-net-value { color: #1f7a3f; }

.online-payments-report .online-payment-gross-value,
.online-payments-report .online-payment-stripe-fee-value,
.online-payments-report .online-payment-businessmanager-fee-value,
.online-payments-report .online-payment-net-value { font-weight: 800; }

/* VALUE.1J historical reconciliation action. */
.online-payments-report .online-payment-reconcile-card {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    margin-bottom: 1rem;
    padding: 1rem 1.1rem;
    border-left: 4px solid var(--bs-warning, #ffc107);
}

.online-payments-report .online-payment-reconcile-copy {
    display: flex;
    align-items: flex-start;
    gap: .8rem;
    min-width: 0;
}

.online-payments-report .online-payment-reconcile-copy > div {
    display: grid;
    gap: .22rem;
}

.online-payments-report .online-payment-reconcile-copy strong {
    color: var(--bm-text, #172033);
}

.online-payments-report .online-payment-reconcile-copy span:not(.online-payment-reconcile-icon) {
    color: var(--bm-muted, #667085);
    font-size: .9rem;
    line-height: 1.45;
}

.online-payments-report .online-payment-reconcile-icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 2.35rem;
    height: 2.35rem;
    flex: 0 0 2.35rem;
    border-radius: .75rem;
    background: rgba(245, 158, 11, .12);
    color: #a16207;
}

.online-payments-report .online-payment-reconcile-action {
    flex: 0 0 auto;
}

@media (max-width: 767.98px) {
    .online-payments-report .online-payment-reconcile-card {
        align-items: stretch;
        flex-direction: column;
    }

    .online-payments-report .online-payment-reconcile-action .btn {
        width: 100%;
    }
}

/* ==========================================================
   VALUE.1J - ONLINE PAYMENTS CONCEPT 3: TRANSACTION-FIRST
   The financial columns read as a left-to-right payment flow while
   preserving the existing server filtering, paging, AJAX refresh,
   tenant scope, invoice/customer quick cards, and reconciliation logic.
   ========================================================== */
.online-payments-report .online-payment-table-card {
    overflow: hidden;
}

.online-payments-report .online-payment-grid-heading {
    padding: 1rem 1.15rem .95rem;
    background: var(--bs-body-bg);
}

.online-payments-report .online-payment-grid-title {
    font-size: 1rem;
}

.online-payments-report .online-payment-grid-subtitle {
    max-width: 52rem;
}

.online-payments-report .online-payment-table thead th {
    vertical-align: middle;
}

.online-payments-report .online-payment-identity-header {
    white-space: nowrap;
}

.online-payments-report .online-payment-date-invoice-cell {
    display: flex;
    align-items: center;
    gap: .7rem;
    min-width: 0;
    white-space: nowrap;
}

.online-payments-report .online-payment-date-block {
    flex: 0 0 auto;
    line-height: 1.22;
}

.online-payments-report .online-payment-date-block strong,
.online-payments-report .online-payment-date-block span {
    display: block;
}

.online-payments-report .online-payment-date-block strong {
    font-size: .79rem;
    font-weight: 800;
}

.online-payments-report .online-payment-date-block span {
    margin-top: .14rem;
    color: var(--bs-secondary-color);
    font-size: .69rem;
}

.online-payments-report .online-payment-identity-divider {
    align-self: stretch;
    width: 1px;
    min-height: 2rem;
    background: var(--bs-border-color);
}

.online-payments-report .online-payment-date-invoice-cell .online-payment-invoice-cell {
    min-width: 0;
}

.online-payments-report .online-payment-financial-heading {
    position: relative;
    display: flex;
    align-items: center;
    justify-content: flex-start;
    gap: .45rem;
    min-height: 3.2rem;
    text-align: left;
}

.online-payments-report .online-payment-financial-heading > span:nth-child(2) {
    min-width: 0;
}

.online-payments-report .online-payment-financial-heading strong,
.online-payments-report .online-payment-financial-heading small {
    display: block;
    white-space: normal;
}

.online-payments-report .online-payment-financial-heading strong {
    font-size: .72rem;
    font-weight: 850;
    line-height: 1.12;
}

.online-payments-report .online-payment-financial-heading small {
    margin-top: .15rem;
    color: currentColor;
    font-size: .59rem;
    font-weight: 600;
    line-height: 1.15;
    opacity: .82;
    text-transform: none;
}

.online-payments-report .online-payment-financial-icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 1.9rem;
    height: 1.9rem;
    flex: 0 0 1.9rem;
    border: 1px solid currentColor;
    border-radius: 999px;
    font-size: .95rem;
    background: rgba(255,255,255,.46);
}

.online-payments-report .online-payment-financial-arrow {
    position: absolute;
    top: 50%;
    right: -.82rem;
    z-index: 2;
    transform: translateY(-50%);
    font-size: .85rem;
    opacity: .72;
}

.online-payments-report .online-payment-net-header .online-payment-financial-arrow {
    display: none;
}

.online-payments-report .online-payment-gross-header,
.online-payments-report .online-payment-stripe-fee-header,
.online-payments-report .online-payment-businessmanager-fee-header,
.online-payments-report .online-payment-net-header {
    padding-top: .45rem;
    padding-bottom: .45rem;
    border-left: 1px solid rgba(148, 163, 184, .18);
    box-shadow: none;
}

.online-payments-report .online-payment-gross-header {
    color: #2563eb;
    background: linear-gradient(110deg, rgba(59,130,246,.09), rgba(59,130,246,.045));
}

.online-payments-report .online-payment-stripe-fee-header {
    color: #b66a00;
    background: linear-gradient(110deg, rgba(245,158,11,.12), rgba(245,158,11,.055));
}

.online-payments-report .online-payment-businessmanager-fee-header {
    color: #6541c1;
    background: linear-gradient(110deg, rgba(124,58,237,.11), rgba(124,58,237,.05));
}

.online-payments-report .online-payment-net-header {
    color: #1f7a3f;
    background: linear-gradient(110deg, rgba(22,163,74,.105), rgba(22,163,74,.045));
}

.online-payments-report .online-payment-gross-value,
.online-payments-report .online-payment-stripe-fee-value,
.online-payments-report .online-payment-businessmanager-fee-value,
.online-payments-report .online-payment-net-value {
    border-left: 1px solid rgba(148, 163, 184, .18);
    font-size: .88rem;
}

@media (min-width: 768px) {
    .online-payments-report .online-payment-table th:nth-child(1) { width: 14%; }
    .online-payments-report .online-payment-table th:nth-child(2) { width: 14%; }
    .online-payments-report .online-payment-table th:nth-child(3) { width: 8%; }
    .online-payments-report .online-payment-table th:nth-child(4) { width: 10%; }
    .online-payments-report .online-payment-table th:nth-child(5) { width: 7%; }
    .online-payments-report .online-payment-table th:nth-child(6) { width: 10%; }
    .online-payments-report .online-payment-table th:nth-child(7) { width: 12%; }
    .online-payments-report .online-payment-table th:nth-child(8) { width: 14%; }
    .online-payments-report .online-payment-table th:nth-child(9) { width: 11%; }

    .online-payments-report .online-payment-date-invoice-cell,
    .online-payments-report .online-payment-customer-cell,
    .online-payments-report .online-payment-method,
    .online-payments-report .online-payment-money {
        min-width: 0;
    }
}

@media (max-width: 1199.98px) and (min-width: 768px) {
    .online-payments-report .online-payment-financial-icon {
        display: none;
    }

    .online-payments-report .online-payment-financial-heading strong {
        font-size: .66rem;
    }

    .online-payments-report .online-payment-financial-heading small {
        font-size: .55rem;
    }

    .online-payments-report .online-payment-date-invoice-cell {
        gap: .42rem;
    }
}

@media (max-width: 767.98px) {
    .online-payments-report .online-payment-date-invoice-cell {
        display: grid;
        grid-template-columns: minmax(0, 1fr);
        gap: .35rem;
        white-space: normal;
    }

    .online-payments-report .online-payment-identity-divider {
        display: none;
    }

    .online-payments-report .online-payment-financial-heading {
        min-height: 0;
        justify-content: flex-end;
        text-align: right;
    }

    .online-payments-report .online-payment-financial-icon,
    .online-payments-report .online-payment-financial-arrow,
    .online-payments-report .online-payment-financial-heading small {
        display: none;
    }
}


/* VALUE.1J Concept 3 - Date & Invoice overlap fix
   Keep the invoice quick-card trigger fully inside column 1. On medium desktop
   widths the identity cell stacks instead of allowing invoice content to paint
   into the Customer column. */
@media (min-width: 768px) {
    .online-payments-report .online-payment-date-invoice-cell {
        min-width: 0;
        overflow: hidden;
    }

    .online-payments-report .online-payment-date-invoice-cell .online-payment-invoice-cell {
        min-width: 0;
        max-width: 100%;
        overflow: hidden;
    }

    .online-payments-report .online-payment-date-invoice-cell .online-payment-invoice-trigger {
        display: inline-flex;
        align-items: center;
        gap: .3rem;
        width: 100%;
        min-width: 0;
        max-width: 100%;
        overflow: hidden;
        white-space: nowrap;
        position: relative;
    }

    .online-payments-report .online-payment-date-invoice-cell .online-payment-invoice-trigger > span {
        display: block;
        flex: 1 1 auto;
        min-width: 0;
        max-width: calc(100% - 1.15rem);
        overflow: hidden;
        text-overflow: ellipsis;
        white-space: nowrap;
    }

    .online-payments-report .online-payment-date-invoice-cell .online-payment-invoice-trigger .bm-record-link-icon {
        position: static !important;
        inset: auto !important;
        transform: none !important;
        flex: 0 0 auto;
        margin: 0;
    }

    .online-payments-report .online-payment-customer-cell {
        min-width: 0;
        max-width: 100%;
        overflow: hidden;
    }

    .online-payments-report .online-payment-customer-cell .customer-quick-card,
    .online-payments-report .online-payment-customer-cell .customer-quick-card-trigger {
        min-width: 0;
        max-width: 100%;
        overflow: hidden;
    }

    .online-payments-report .online-payment-customer-cell .customer-quick-card-trigger > span {
        display: inline-block;
        max-width: calc(100% - 1.35rem);
        overflow: hidden;
        text-overflow: ellipsis;
        white-space: nowrap;
        vertical-align: bottom;
    }
}

/* Very wide desktop only: keep date and invoice side-by-side.
   At ordinary desktop widths, stack the invoice under the date so the full
   invoice number remains readable instead of truncating to INV-000.... */
@media (min-width: 1600px) {
    .online-payments-report .online-payment-date-invoice-cell {
        display: grid;
        grid-template-columns: 5.7rem 1px minmax(0, 1fr);
        align-items: center;
        column-gap: .6rem;
        white-space: nowrap;
    }

    .online-payments-report .online-payment-table th:nth-child(1) { width: 18%; }
    .online-payments-report .online-payment-table th:nth-child(2) { width: 13%; }
    .online-payments-report .online-payment-table th:nth-child(3) { width: 8%; }
    .online-payments-report .online-payment-table th:nth-child(4) { width: 10%; }
    .online-payments-report .online-payment-table th:nth-child(5) { width: 7%; }
    .online-payments-report .online-payment-table th:nth-child(6) { width: 10%; }
    .online-payments-report .online-payment-table th:nth-child(7) { width: 12%; }
    .online-payments-report .online-payment-table th:nth-child(8) { width: 12%; }
    .online-payments-report .online-payment-table th:nth-child(9) { width: 10%; }
}

/* Tablet / standard desktop: stack invoice below the date so the complete
   invoice number and quick-card icon remain visible inside column 1. */
@media (max-width: 1599.98px) and (min-width: 768px) {
    .online-payments-report .online-payment-date-invoice-cell {
        display: grid;
        grid-template-columns: minmax(0, 1fr);
        align-items: start;
        gap: .28rem;
        white-space: normal;
    }

    .online-payments-report .online-payment-identity-divider {
        display: none;
    }

    .online-payments-report .online-payment-date-invoice-cell .online-payment-invoice-trigger {
        width: auto;
        max-width: 100%;
        overflow: visible;
    }

    .online-payments-report .online-payment-date-invoice-cell .online-payment-invoice-trigger > span {
        flex: 0 1 auto;
        max-width: none;
        overflow: visible;
        text-overflow: clip;
    }

    .online-payments-report .online-payment-table th:nth-child(1) { width: 17%; }
    .online-payments-report .online-payment-table th:nth-child(2) { width: 12%; }
    .online-payments-report .online-payment-table th:nth-child(3) { width: 8%; }
    .online-payments-report .online-payment-table th:nth-child(4) { width: 11%; }
    .online-payments-report .online-payment-table th:nth-child(5) { width: 7%; }
    .online-payments-report .online-payment-table th:nth-child(6) { width: 10%; }
    .online-payments-report .online-payment-table th:nth-child(7) { width: 12%; }
    .online-payments-report .online-payment-table th:nth-child(8) { width: 13%; }
    .online-payments-report .online-payment-table th:nth-child(9) { width: 10%; }
}

/* VALUE.1L — refund-aware Online Payments report status/refund presentation.
   Final overrides intentionally sit at the end of the stylesheet so older
   VALUE.1J width experiments cannot force Partially Refunded outside its pill. */
@media (min-width: 768px) {
    .online-payments-report .online-payment-table {
        table-layout: fixed;
        width: 100%;
    }

    .online-payments-report .online-payment-table th:nth-child(1) { width: 13%; }
    .online-payments-report .online-payment-table th:nth-child(2) { width: 14%; }
    .online-payments-report .online-payment-table th:nth-child(3) { width: 11%; }
    .online-payments-report .online-payment-table th:nth-child(4) { width: 10%; }
    .online-payments-report .online-payment-table th:nth-child(5) { width: 7%; }
    .online-payments-report .online-payment-table th:nth-child(6) { width: 8%; }
    .online-payments-report .online-payment-table th:nth-child(7) { width: 9%; }
    .online-payments-report .online-payment-table th:nth-child(8) { width: 10%; }
    .online-payments-report .online-payment-table th:nth-child(9) { width: 9%; }
    .online-payments-report .online-payment-table th:nth-child(10) { width: 9%; }

    .online-payments-report .online-payment-status-cell {
        min-width: 0;
    }

    .online-payments-report .online-payment-status-badge {
        display: inline-flex;
        align-items: center;
        justify-content: center;
        max-width: 100%;
        min-height: 1.55rem;
        padding: .22rem .42rem;
        border-radius: 999px;
        font-size: .60rem;
        font-weight: 750;
        line-height: 1;
        letter-spacing: -.01em;
        white-space: nowrap !important;
        overflow: visible;
    }

    .online-payments-report .online-payment-refund-value {
        color: #667085;
    }

    .online-payments-report .online-payment-refund-value.has-refund {
        color: #b54708;
        font-weight: 800;
    }
}

@media (min-width: 768px) and (max-width: 1100px) {
    .online-payments-report .online-payment-table th,
    .online-payments-report .online-payment-table td {
        padding-left: .38rem;
        padding-right: .38rem;
    }

    .online-payments-report .online-payment-status-badge {
        font-size: .54rem;
        padding-left: .32rem;
        padding-right: .32rem;
    }

    .online-payments-report .online-payment-money,
    .online-payments-report .online-payment-method,
    .online-payments-report .online-payment-date-block,
    .online-payments-report .online-payment-invoice-trigger {
        font-size: .72rem;
    }
}


/* VALUE.1L Online Payments visual/report header refinement. */
.online-payments-report .online-payment-summary-grid {
    grid-template-columns: repeat(5, minmax(0, 1fr));
}

.online-payments-report .online-payment-visual-grid {
    display: grid;
    grid-template-columns: minmax(0, 1.2fr) minmax(250px, .8fr) minmax(250px, .8fr);
    gap: 1rem;
    margin-bottom: 1.5rem;
}

.online-payments-report .online-payment-visual-grid .report-chart-panel {
    min-width: 0;
    min-height: 285px;
}

.online-payments-report .online-payment-visual-grid .report-chart-wrap {
    height: 215px;
}

@media (min-width: 768px) {
    .online-payments-report .online-payment-table th:nth-child(1) { width: 13%; }
    .online-payments-report .online-payment-table th:nth-child(2) { width: 13%; }
    .online-payments-report .online-payment-table th:nth-child(3) { width: 11%; }
    .online-payments-report .online-payment-table th:nth-child(4) { width: 10%; }
    .online-payments-report .online-payment-table th:nth-child(5) { width: 7%; }
    .online-payments-report .online-payment-table th:nth-child(6) { width: 8%; }
    .online-payments-report .online-payment-table th:nth-child(7) { width: 9%; }
    .online-payments-report .online-payment-table th:nth-child(8) { width: 11%; }
    .online-payments-report .online-payment-table th:nth-child(9) { width: 9%; }
    .online-payments-report .online-payment-table th:nth-child(10) { width: 9%; }

    .online-payments-report .online-payment-financial-heading {
        gap: .3rem;
    }

    .online-payments-report .online-payment-financial-heading strong {
        font-size: .64rem;
        line-height: 1.08;
        overflow-wrap: normal;
        word-break: normal;
    }

    .online-payments-report .online-payment-financial-heading small {
        font-size: .53rem;
        line-height: 1.08;
    }

    .online-payments-report .online-payment-businessmanager-fee-header .online-payment-financial-heading strong {
        white-space: normal !important;
    }

    .online-payments-report .online-payment-businessmanager-fee-header .online-payment-financial-heading > span:nth-child(2) {
        min-width: 0;
        width: 100%;
    }
}

@media (max-width: 1199.98px) {
    .online-payments-report .online-payment-summary-grid {
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }

    .online-payments-report .online-payment-visual-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .online-payments-report .online-payment-visual-grid > :first-child {
        grid-column: 1 / -1;
    }
}

@media (max-width: 767.98px) {
    .online-payments-report .online-payment-summary-grid,
    .online-payments-report .online-payment-visual-grid {
        grid-template-columns: 1fr;
    }

    .online-payments-report .online-payment-visual-grid > :first-child {
        grid-column: auto;
    }
}

/* ==========================================================
   PO REPORT GRID DISPLAY STANDARDIZATION
   Grid-only presentation refinement. No report queries, lifecycle
   rules, filters, paging, permissions, or financial calculations change.
   ========================================================== */
.report-page .po-report-grid-standard {
    width: 100%;
    max-width: 100%;
    table-layout: fixed;
    font-size: .82rem;
}

.report-page .po-report-grid-standard th,
.report-page .po-report-grid-standard td {
    min-width: 0;
    padding: .72rem .55rem;
    vertical-align: middle;
    box-sizing: border-box;
}

.report-page .po-report-grid-standard thead th {
    font-size: .70rem;
    font-weight: 800;
    line-height: 1.08;
    letter-spacing: .02em;
    white-space: normal;
    overflow-wrap: normal;
    word-break: normal;
}

.report-page .po-report-grid-standard tbody td {
    line-height: 1.25;
    overflow-wrap: normal;
    word-break: normal;
}

.report-page .po-report-grid-standard .report-money,
.report-page .po-report-grid-standard .po-workorder-progress-value {
    font-size: .83rem;
    font-weight: 700;
    font-variant-numeric: tabular-nums;
}

.report-page .po-report-grid-standard .po-workorder-identity-cell,
.report-page .po-report-grid-standard .po-workorder-identity-cell > a,
.report-page .po-report-grid-standard td[data-label="Status"],
.report-page .po-report-grid-standard td[data-label="Receiving"],
.report-page .po-report-grid-standard td[data-label="Billing"],
.report-page .po-report-grid-standard td[data-label="Payment"],
.report-page .po-report-grid-standard td[data-label="PO Status"] {
    white-space: nowrap;
}

.report-page .po-report-grid-standard .report-status-badge {
    display: inline-flex;
    width: auto;
    max-width: none;
    align-items: center;
    justify-content: center;
    padding: .30rem .48rem;
    font-size: .70rem;
    line-height: 1;
    white-space: nowrap;
    overflow-wrap: normal;
    word-break: normal;
}

.report-page .po-report-grid-standard td:last-child,
.report-page .po-report-grid-standard th:last-child {
    padding-right: .75rem;
}

.report-page .po-report-grid-standard td:first-child,
.report-page .po-report-grid-standard th:first-child {
    padding-left: .75rem;
}

.report-page .po-report-grid-standard .po-financial-match-value,
.report-page .po-report-grid-standard .po-bill-variance-review {
    font-size: .69rem;
    white-space: nowrap;
}

.report-page .po-report-grid-standard .po-financial-progress-label,
.report-page .po-report-grid-standard .po-financial-progress-value,
.report-page .po-report-grid-standard .po-workorder-progress-percent {
    font-size: .67rem;
}

.report-page .po-report-grid-standard .po-fin13-quantity span,
.report-page .po-report-grid-standard .po-fin14-quantity-chip span {
    font-size: .61rem;
    letter-spacing: -.01em;
}

.report-page .po-report-grid-standard .po-fin13-quantity strong,
.report-page .po-report-grid-standard .po-fin14-quantity-chip strong {
    font-size: .90rem;
}

/* Financial display conventions: outstanding/pending obligations and
   non-zero variances use the report danger color consistently. */
.report-page .po-report-grid-standard .po-pending-money,
.report-page .po-report-grid-standard .po-pending-money > strong,
.report-page .po-report-grid-standard .report-financial-pending,
.report-page .po-report-grid-standard .report-financial-pending > strong,
.report-page .po-report-grid-standard .report-money-danger {
    color: var(--report-red) !important;
}

@media (min-width: 768px) {
    /* Summary: preserve extra room for the right-most financial progress block. */
    .report-page .po-summary-report-table th:nth-child(1)  { width: 8%; }
    .report-page .po-summary-report-table th:nth-child(2)  { width: 11%; }
    .report-page .po-summary-report-table th:nth-child(3)  { width: 9%; }
    .report-page .po-summary-report-table th:nth-child(4)  { width: 9%; }
    .report-page .po-summary-report-table th:nth-child(5)  { width: 9%; }
    .report-page .po-summary-report-table th:nth-child(6)  { width: 8%; }
    .report-page .po-summary-report-table th:nth-child(7)  { width: 8%; }
    .report-page .po-summary-report-table th:nth-child(8)  { width: 8%; }
    .report-page .po-summary-report-table th:nth-child(9)  { width: 10%; }
    .report-page .po-summary-report-table th:nth-child(10) { width: 20%; }

    .report-page .po-summary-report-table .po-financial-progress-row {
        grid-template-columns: 3.35rem minmax(34px, 1fr) 2.35rem;
        gap: .28rem;
    }

    .report-page .po-summary-report-table .po-financial-match-row {
        grid-template-columns: 3.35rem minmax(34px, 1fr) auto;
    }

    /* By Vendor: balanced financial columns and enough room for Review Required. */
    .report-page .po-vendor-report-table th:nth-child(1) { width: 10%; }
    .report-page .po-vendor-report-table th:nth-child(2) { width: 13%; }
    .report-page .po-vendor-report-table th:nth-child(3) { width: 10%; }
    .report-page .po-vendor-report-table th:nth-child(4) { width: 10%; }
    .report-page .po-vendor-report-table th:nth-child(5) { width: 12%; }
    .report-page .po-vendor-report-table th:nth-child(6) { width: 11%; }
    .report-page .po-vendor-report-table th:nth-child(7) { width: 10%; }
    .report-page .po-vendor-report-table th:nth-child(8) { width: 11%; }
    .report-page .po-vendor-report-table th:nth-child(9) { width: 13%; }

    /* Outstanding Receiving: prevent PO/vendor/status/quantity collisions. */
    .report-page .po-fin13-outstanding-table th:nth-child(1) { width: 9%; }
    .report-page .po-fin13-outstanding-table th:nth-child(2) { width: 14%; }
    .report-page .po-fin13-outstanding-table th:nth-child(3) { width: 9%; }
    .report-page .po-fin13-outstanding-table th:nth-child(4) { width: 10%; }
    .report-page .po-fin13-outstanding-table th:nth-child(5) { width: 16%; }
    .report-page .po-fin13-outstanding-table th:nth-child(6) { width: 10%; }
    .report-page .po-fin13-outstanding-table th:nth-child(7) { width: 10%; }
    .report-page .po-fin13-outstanding-table th:nth-child(8) { width: 10%; }
    .report-page .po-fin13-outstanding-table th:nth-child(9) { width: 12%; }

    /* By Work Order: stable identity/status widths and no right-edge clipping. */
    .report-page .po-workorder-report-table th:nth-child(1)  { width: 8%; }
    .report-page .po-workorder-report-table th:nth-child(2)  { width: 9%; }
    .report-page .po-workorder-report-table th:nth-child(3)  { width: 13%; }
    .report-page .po-workorder-report-table th:nth-child(4)  { width: 9%; }
    .report-page .po-workorder-report-table th:nth-child(5)  { width: 7%; }
    .report-page .po-workorder-report-table th:nth-child(6)  { width: 8%; }
    .report-page .po-workorder-report-table th:nth-child(7)  { width: 10%; }
    .report-page .po-workorder-report-table th:nth-child(8)  { width: 8%; }
    .report-page .po-workorder-report-table th:nth-child(9)  { width: 9%; }
    .report-page .po-workorder-report-table th:nth-child(10) { width: 10%; }
    .report-page .po-workorder-report-table th:nth-child(11) { width: 9%; }

    /* Approval Workflow: prioritize readable lifecycle pills instead of narrow,
       vertically broken badges. Widths total 100%. */
    .report-page .po-fin14-workflow-table th:nth-child(1)  { width: 7%; }
    .report-page .po-fin14-workflow-table th:nth-child(2)  { width: 8%; }
    .report-page .po-fin14-workflow-table th:nth-child(3)  { width: 9%; }
    .report-page .po-fin14-workflow-table th:nth-child(4)  { width: 13%; }
    .report-page .po-fin14-workflow-table th:nth-child(5)  { width: 7%; }
    .report-page .po-fin14-workflow-table th:nth-child(6)  { width: 7%; }
    .report-page .po-fin14-workflow-table th:nth-child(7)  { width: 7%; }
    .report-page .po-fin14-workflow-table th:nth-child(8)  { width: 10%; }
    .report-page .po-fin14-workflow-table th:nth-child(9)  { width: 8%; }
    .report-page .po-fin14-workflow-table th:nth-child(10) { width: 8%; }
    .report-page .po-fin14-workflow-table th:nth-child(11) { width: 8%; }
    .report-page .po-fin14-workflow-table th:nth-child(12) { width: 8%; }

    .report-page .po-fin14-workflow-table th,
    .report-page .po-fin14-workflow-table td {
        padding-left: .35rem;
        padding-right: .35rem;
        overflow-wrap: normal;
        word-break: normal;
    }

    .report-page .po-fin14-workflow-table .report-status-badge {
        padding-left: .38rem;
        padding-right: .38rem;
        font-size: .66rem;
    }

    .report-page .po-fin14-workflow-table .po-fin14-status-meta {
        font-size: .63rem;
        line-height: 1.12;
    }

    /* Reconciliation: compact but readable, with protected right edge. */
    .report-page .po-fin15-reconciliation-table th,
    .report-page .po-fin15-reconciliation-table td {
        padding-left: .38rem;
        padding-right: .38rem;
    }

    .report-page .po-fin15-reconciliation-table .report-status-badge {
        font-size: .67rem;
    }
}

@media (max-width: 767.98px) {
    .report-page .po-report-grid-standard {
        font-size: .86rem;
    }

    .report-page .po-report-grid-standard .report-status-badge {
        max-width: 100%;
        white-space: normal;
    }
}


/* ==========================================================
   PO REPORT GRID IDENTITY + QUANTITY COLUMN STANDARDIZATION
   Presentation only: combines PO/vendor identity, removes link
   underlines, promotes quantity labels to headers, and protects
   approval-workflow status badges from overlap.
   ========================================================== */
.report-page .po-report-grid-standard a,
.report-page .po-report-grid-standard a:hover,
.report-page .po-report-grid-standard a:focus {
    text-decoration: none !important;
}

.report-page .po-report-grid-standard .po-report-po-vendor-cell {
    min-width: 0;
    white-space: normal;
    vertical-align: middle;
}

.report-page .po-report-grid-standard .po-report-po-link,
.report-page .po-report-grid-standard .po-report-vendor-link {
    display: block;
    max-width: 100%;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.report-page .po-report-grid-standard .po-report-po-link {
    font-weight: 700;
}

.report-page .po-report-grid-standard .po-report-vendor-link {
    font-size: .76rem;
    font-weight: 600;
    color: var(--bs-primary);
}

.report-page .po-report-grid-standard .po-report-buyer-cell,
.report-page .po-report-grid-standard .po-report-buyer-link {
    font-size: .82rem;
    font-weight: 700;
    line-height: 1.25;
}

.report-page .po-report-grid-standard .po-report-buyer-link {
    display: inline-block;
    max-width: 100%;
    color: var(--bs-primary);
    text-decoration: none !important;
}

.report-page .po-report-grid-standard .po-quantity-header {
    font-size: .70rem;
    font-weight: 800;
    line-height: 1.08;
    letter-spacing: .02em;
    color: var(--bs-secondary-color) !important;
    white-space: normal;
    text-transform: uppercase;
}

.report-page .po-report-grid-standard .po-quantity-value {
    font-size: .90rem;
    font-weight: 800;
    line-height: 1.1;
    font-variant-numeric: tabular-nums;
    background: transparent !important;
    border-radius: 0 !important;
}

.report-page .po-report-grid-standard .po-quantity-ordered {
    color: var(--bs-primary);
}

.report-page .po-report-grid-standard .po-quantity-received {
    color: var(--report-green);
}

.report-page .po-report-grid-standard .po-quantity-outstanding {
    color: var(--report-red);
}

@media (min-width: 768px) {
    /* Summary: PO and vendor share one identity column. */
    .report-page .po-summary-report-table th:nth-child(1) { width: 15%; }
    .report-page .po-summary-report-table th:nth-child(2) { width: 9%; }
    .report-page .po-summary-report-table th:nth-child(3) { width: 9%; }
    .report-page .po-summary-report-table th:nth-child(4) { width: 10%; }
    .report-page .po-summary-report-table th:nth-child(5) { width: 9%; }
    .report-page .po-summary-report-table th:nth-child(6) { width: 9%; }
    .report-page .po-summary-report-table th:nth-child(7) { width: 8%; }
    .report-page .po-summary-report-table th:nth-child(8) { width: 10%; }
    .report-page .po-summary-report-table th:nth-child(9) { width: 21%; }

    /* By Vendor: reclaim the former standalone Vendor column for financials. */
    .report-page .po-vendor-report-table th:nth-child(1) { width: 18%; }
    .report-page .po-vendor-report-table th:nth-child(2) { width: 10%; }
    .report-page .po-vendor-report-table th:nth-child(3) { width: 11%; }
    .report-page .po-vendor-report-table th:nth-child(4) { width: 13%; }
    .report-page .po-vendor-report-table th:nth-child(5) { width: 11%; }
    .report-page .po-vendor-report-table th:nth-child(6) { width: 11%; }
    .report-page .po-vendor-report-table th:nth-child(7) { width: 12%; }
    .report-page .po-vendor-report-table th:nth-child(8) { width: 14%; }

    /* Outstanding Receiving: quantity labels live in their own headers. */
    .report-page .po-fin13-outstanding-table th:nth-child(1)  { width: 14%; }
    .report-page .po-fin13-outstanding-table th:nth-child(2)  { width: 8%; }
    .report-page .po-fin13-outstanding-table th:nth-child(3)  { width: 9%; }
    .report-page .po-fin13-outstanding-table th:nth-child(4)  { width: 7%; }
    .report-page .po-fin13-outstanding-table th:nth-child(5)  { width: 7%; }
    .report-page .po-fin13-outstanding-table th:nth-child(6)  { width: 9%; }
    .report-page .po-fin13-outstanding-table th:nth-child(7)  { width: 10%; }
    .report-page .po-fin13-outstanding-table th:nth-child(8)  { width: 10%; }
    .report-page .po-fin13-outstanding-table th:nth-child(9)  { width: 10%; }
    .report-page .po-fin13-outstanding-table th:nth-child(10) { width: 16%; }

    /* By Work Order: combined PO/vendor identity frees a full column. */
    .report-page .po-workorder-report-table th:nth-child(1)  { width: 13%; }
    .report-page .po-workorder-report-table th:nth-child(2)  { width: 10%; }
    .report-page .po-workorder-report-table th:nth-child(3)  { width: 15%; }
    .report-page .po-workorder-report-table th:nth-child(4)  { width: 8%; }
    .report-page .po-workorder-report-table th:nth-child(5)  { width: 8%; }
    .report-page .po-workorder-report-table th:nth-child(6)  { width: 10%; }
    .report-page .po-workorder-report-table th:nth-child(7)  { width: 8%; }
    .report-page .po-workorder-report-table th:nth-child(8)  { width: 9%; }
    .report-page .po-workorder-report-table th:nth-child(9)  { width: 10%; }
    .report-page .po-workorder-report-table th:nth-child(10) { width: 9%; }

    /* Approval Workflow: separate quantity columns and intentionally allow
       lifecycle badges to wrap to two lines instead of colliding. */
    .report-page .po-fin14-workflow-table th:nth-child(1)  { width: 10.5%; }
    .report-page .po-fin14-workflow-table th:nth-child(2)  { width: 8.5%; }
    .report-page .po-fin14-workflow-table th:nth-child(3)  { width: 5.5%; }
    .report-page .po-fin14-workflow-table th:nth-child(4)  { width: 5.5%; }
    .report-page .po-fin14-workflow-table th:nth-child(5)  { width: 8%; }
    .report-page .po-fin14-workflow-table th:nth-child(6)  { width: 7.5%; }
    .report-page .po-fin14-workflow-table th:nth-child(7)  { width: 7.5%; }
    .report-page .po-fin14-workflow-table th:nth-child(8)  { width: 7.5%; }
    .report-page .po-fin14-workflow-table th:nth-child(9)  { width: 10%; }
    .report-page .po-fin14-workflow-table th:nth-child(10) { width: 7.5%; }
    .report-page .po-fin14-workflow-table th:nth-child(11) { width: 6.5%; }
    .report-page .po-fin14-workflow-table th:nth-child(12) { width: 8%; }
    .report-page .po-fin14-workflow-table th:nth-child(13) { width: 8.5%; }

    .report-page .po-fin14-workflow-table td[data-label="Approval"],
    .report-page .po-fin14-workflow-table td[data-label="Receiving"],
    .report-page .po-fin14-workflow-table td[data-label="Billing"],
    .report-page .po-fin14-workflow-table td[data-label="Payment"],
    .report-page .po-fin14-workflow-table td[data-label="PO Status"] {
        white-space: normal;
        text-align: center;
    }

    .report-page .po-fin14-workflow-table td[data-label="Approval"] .report-status-badge,
    .report-page .po-fin14-workflow-table td[data-label="Receiving"] .report-status-badge,
    .report-page .po-fin14-workflow-table td[data-label="Billing"] .report-status-badge,
    .report-page .po-fin14-workflow-table td[data-label="Payment"] .report-status-badge,
    .report-page .po-fin14-workflow-table td[data-label="PO Status"] .report-status-badge {
        width: 100%;
        max-width: 100%;
        min-width: 0;
        box-sizing: border-box;
        white-space: normal;
        line-height: 1.15;
        text-align: center;
        overflow-wrap: normal;
        word-break: normal;
        padding: .32rem .28rem;
    }

    .report-page .po-fin14-workflow-table .po-fin14-status-meta {
        display: block;
        margin-top: .22rem;
        white-space: normal;
        text-align: center;
    }

    /* Reconciliation: combined PO/vendor identity and protected exception edge. */
    .report-page .po-fin15-reconciliation-table th:nth-child(1)  { width: 14%; }
    .report-page .po-fin15-reconciliation-table th:nth-child(2)  { width: 9%; }
    .report-page .po-fin15-reconciliation-table th:nth-child(3)  { width: 9%; }
    .report-page .po-fin15-reconciliation-table th:nth-child(4)  { width: 9%; }
    .report-page .po-fin15-reconciliation-table th:nth-child(5)  { width: 8%; }
    .report-page .po-fin15-reconciliation-table th:nth-child(6)  { width: 9%; }
    .report-page .po-fin15-reconciliation-table th:nth-child(7)  { width: 9%; }
    .report-page .po-fin15-reconciliation-table th:nth-child(8)  { width: 10%; }
    .report-page .po-fin15-reconciliation-table th:nth-child(9)  { width: 11%; }
    .report-page .po-fin15-reconciliation-table th:nth-child(10) { width: 12%; }
}


/* PO report final display refinement — Reconciliation variance + Approval Workflow lifecycle fit. */
.report-page .po-fin15-reconciliation-table td[data-label="PO / Bill Variance"].report-financial-pending,
.report-page .po-fin15-reconciliation-table td[data-label="PO / Bill Variance"].report-financial-pending span {
    color: var(--report-red) !important;
}

@media (min-width: 768px) {
    .report-page .po-fin14-workflow-table th:nth-child(3),
    .report-page .po-fin14-workflow-table th:nth-child(4),
    .report-page .po-fin14-workflow-table th:nth-child(5) {
        font-size: .66rem;
        letter-spacing: 0;
        white-space: normal;
        overflow: visible;
    }

    .report-page .po-fin14-workflow-table td[data-label="Approval"] .report-status-badge,
    .report-page .po-fin14-workflow-table td[data-label="Receiving"] .report-status-badge,
    .report-page .po-fin14-workflow-table td[data-label="Billing"] .report-status-badge,
    .report-page .po-fin14-workflow-table td[data-label="Payment"] .report-status-badge,
    .report-page .po-fin14-workflow-table td[data-label="PO Status"] .report-status-badge {
        font-size: .64rem;
        line-height: 1.08;
        padding: .28rem .22rem;
    }
}

/* Approval Workflow — Option A: compact lifecycle status labels.
   Presentation only: preserves the existing independent workflow facts and status palette. */
@media (min-width: 768px) {
    .report-page .po-fin14-workflow-table th:nth-child(1)  { width: 9.5%; }
    .report-page .po-fin14-workflow-table th:nth-child(2)  { width: 7%; }
    .report-page .po-fin14-workflow-table th:nth-child(3)  { width: 5.5%; }
    .report-page .po-fin14-workflow-table th:nth-child(4)  { width: 5.5%; }
    .report-page .po-fin14-workflow-table th:nth-child(5)  { width: 7%; }
    .report-page .po-fin14-workflow-table th:nth-child(6)  { width: 7.5%; }
    .report-page .po-fin14-workflow-table th:nth-child(7)  { width: 7.5%; }
    .report-page .po-fin14-workflow-table th:nth-child(8)  { width: 7.5%; }
    .report-page .po-fin14-workflow-table th:nth-child(9)  { width: 10.5%; }
    .report-page .po-fin14-workflow-table th:nth-child(10) { width: 8%; }
    .report-page .po-fin14-workflow-table th:nth-child(11) { width: 6.5%; }
    .report-page .po-fin14-workflow-table th:nth-child(12) { width: 9%; }
    .report-page .po-fin14-workflow-table th:nth-child(13) { width: 8%; }

    .report-page .po-fin14-workflow-table th,
    .report-page .po-fin14-workflow-table td {
        padding-left: .55rem;
        padding-right: .55rem;
    }

    /* Keep all Approval Workflow headings compact and the three quantity headings complete on full-screen desktop. */
    .report-page .po-fin14-workflow-table th {
        font-size: .58rem;
        letter-spacing: 0;
    }

    .report-page .po-fin14-workflow-table th.po-fin14-quantity-header {
        font-size: .58rem;
        font-weight: 800;
        line-height: 1.08;
        letter-spacing: .02em;
        color: var(--bs-secondary-color) !important;
        white-space: nowrap;
        overflow: visible;
        text-transform: uppercase;
    }

    .report-page .po-fin14-workflow-table td[data-label="Approval"],
    .report-page .po-fin14-workflow-table td[data-label="Receiving"],
    .report-page .po-fin14-workflow-table td[data-label="Billing"],
    .report-page .po-fin14-workflow-table td[data-label="Payment"],
    .report-page .po-fin14-workflow-table td[data-label="PO Status"] {
        text-align: left;
        white-space: normal;
    }

    .report-page .po-fin14-workflow-table td[data-label="Approval"] .report-status,
    .report-page .po-fin14-workflow-table td[data-label="Receiving"] .report-status,
    .report-page .po-fin14-workflow-table td[data-label="Billing"] .report-status,
    .report-page .po-fin14-workflow-table td[data-label="Payment"] .report-status,
    .report-page .po-fin14-workflow-table td[data-label="PO Status"] .report-status {
        display: inline-flex;
        width: auto;
        max-width: 100%;
        min-width: 0;
        align-items: center;
        justify-content: flex-start;
        gap: .32rem;
        padding: 0;
        border-radius: 0;
        background: transparent;
        font-size: .70rem;
        font-weight: 700;
        line-height: 1.18;
        text-align: left;
        white-space: normal;
        box-shadow: none;
    }

    .report-page .po-fin14-workflow-table td[data-label="Approval"] .report-status i,
    .report-page .po-fin14-workflow-table td[data-label="Receiving"] .report-status i,
    .report-page .po-fin14-workflow-table td[data-label="Billing"] .report-status i,
    .report-page .po-fin14-workflow-table td[data-label="Payment"] .report-status i,
    .report-page .po-fin14-workflow-table td[data-label="PO Status"] .report-status i {
        flex: 0 0 auto;
        font-size: .76rem;
    }

    .report-page .po-fin14-workflow-table .po-fin14-status-meta {
        display: block;
        margin-top: .18rem;
        color: var(--bs-secondary-color);
        font-size: .61rem;
        font-weight: 500;
        line-height: 1.15;
        text-align: left;
        white-space: normal;
    }

    .report-page .po-fin14-workflow-table td[data-label="PO Total"],
    .report-page .po-fin14-workflow-table td[data-label="Received"],
    .report-page .po-fin14-workflow-table td[data-label="Remaining"] {
        padding-left: .65rem;
        padding-right: .65rem;
        white-space: nowrap;
    }
}

/* Approval Workflow — Option A mobile parity.
   Presentation only: keeps the same compact lifecycle language on responsive cards.
   All mobile values use one shared value-column start so Approval, Receiving, Billing,
   Payment and PO Status align exactly with the PO number instead of drifting right. */
@media (max-width: 767.98px) {
    .report-page .po-fin14-workflow-table tbody {
        padding: .65rem;
    }

    .report-page .po-fin14-workflow-table tr {
        padding: .8rem .9rem;
    }

    /* One mobile label/value grid for every field in the card. */
    .report-page .po-fin14-workflow-table td {
        grid-template-columns: minmax(108px, .40fr) minmax(0, .60fr);
        gap: .7rem;
        align-items: center;
        min-width: 0;
        text-align: left !important;
    }

    /* PO and Vendor share the same value-column start. */
    .report-page .po-fin14-workflow-table td[data-label="PO / Vendor"] > .po-report-po-link,
    .report-page .po-fin14-workflow-table td[data-label="PO / Vendor"] > .po-report-vendor-link,
    .report-page .po-fin14-workflow-table td[data-label="Buyer / Requestor"] > .po-report-buyer-link {
        grid-column: 2;
        justify-self: start;
        max-width: 100%;
        text-align: left;
    }

    /* Lifecycle values are explicitly placed in column 2. This avoids inline-flex
       values inheriting right alignment from older responsive/status rules. */
    .report-page .po-fin14-workflow-table td[data-label="Approval"] > .report-status,
    .report-page .po-fin14-workflow-table td[data-label="Receiving"] > .report-status,
    .report-page .po-fin14-workflow-table td[data-label="Billing"] > .report-status,
    .report-page .po-fin14-workflow-table td[data-label="Payment"] > .report-status,
    .report-page .po-fin14-workflow-table td[data-label="PO Status"] > .report-status {
        grid-column: 2;
        justify-self: start;
    }

    .report-page .po-fin14-workflow-table td[data-label="Approval"] .report-status,
    .report-page .po-fin14-workflow-table td[data-label="Receiving"] .report-status,
    .report-page .po-fin14-workflow-table td[data-label="Billing"] .report-status,
    .report-page .po-fin14-workflow-table td[data-label="Payment"] .report-status,
    .report-page .po-fin14-workflow-table td[data-label="PO Status"] .report-status {
        display: inline-flex;
        width: auto;
        max-width: 100%;
        min-width: 0;
        align-items: center;
        justify-content: flex-start;
        gap: .32rem;
        padding: 0;
        border-radius: 0;
        background: transparent;
        box-shadow: none;
        font-size: .74rem;
        font-weight: 700;
        line-height: 1.2;
        text-align: left;
        white-space: normal;
        overflow-wrap: normal;
        word-break: normal;
    }

    .report-page .po-fin14-workflow-table td[data-label="Approval"] .report-status i,
    .report-page .po-fin14-workflow-table td[data-label="Receiving"] .report-status i,
    .report-page .po-fin14-workflow-table td[data-label="Billing"] .report-status i,
    .report-page .po-fin14-workflow-table td[data-label="Payment"] .report-status i,
    .report-page .po-fin14-workflow-table td[data-label="PO Status"] .report-status i {
        flex: 0 0 auto;
        font-size: .78rem;
    }

    /* Approval metadata occupies the same second grid column as Approved. */
    .report-page .po-fin14-workflow-table td[data-label="Approval"] > .po-fin14-status-meta {
        grid-column: 2;
        justify-self: start;
        display: block;
        width: auto;
        max-width: 100%;
        margin-top: .16rem;
        color: var(--bs-secondary-color);
        font-size: .64rem;
        font-weight: 500;
        line-height: 1.18;
        text-align: left;
        white-space: normal;
    }

    /* Keep numeric values compact while letting the cell's shared left alignment
       place them at the same start position as the PO number. */
    .report-page .po-fin14-workflow-table td[data-label="PO Total"],
    .report-page .po-fin14-workflow-table td[data-label="Received"],
    .report-page .po-fin14-workflow-table td[data-label="Remaining"],
    .report-page .po-fin14-workflow-table td.po-quantity-value {
        white-space: nowrap;
    }
}