/* =====================================================================
   BO report pages (Provider Report, Affiliate Report)
   Same look as the Bet Data redesign: filter card with "More filters",
   page totals strip, quiet grid with tabular figures, cards on phones.
   Everything is scoped under .bo-rpt so no other page is affected.
   ===================================================================== */

.bo-rpt {
    --bo-accent: #5b57d6;
    --bo-accent-soft: rgba(91, 87, 214, .07);
    --bo-accent-line: rgba(91, 87, 214, .28);
    --bo-line: var(--bs-border-color, #e6e8ec);
    --bo-line-strong: var(--bs-gray-300, #d3d7de);
    --bo-surface: var(--bs-body-bg, #fff);
    --bo-surface-2: var(--bs-gray-100, #f7f8fa);
    --bo-ink: var(--bs-gray-900, #12161f);
    --bo-ink-2: var(--bs-gray-700, #5a6472);
    --bo-ink-3: var(--bs-gray-600, #7e8795);
    --bo-dash-c: var(--bs-gray-400, #c3c8d1);
    --bo-pos: #0a7c5a;
    --bo-pos-soft: rgba(10, 124, 90, .11);
    --bo-neg: #c0392b;
    --bo-warn: #a2650a;
    --bo-warn-soft: rgba(162, 101, 10, .13);
    --bo-mono: ui-monospace, SFMono-Regular, "SF Mono", Menlo, Consolas, monospace;
}
[data-bs-theme="dark"] .bo-rpt {
    --bo-accent: #a5a1f5;
    --bo-accent-soft: rgba(139, 135, 240, .10);
    --bo-accent-line: rgba(139, 135, 240, .32);
    --bo-pos: #4fc99e;
    --bo-pos-soft: rgba(79, 201, 158, .14);
    --bo-neg: #f0857a;
    --bo-warn: #e5b567;
    --bo-warn-soft: rgba(229, 181, 103, .14);
}

    /* ================================================================
       Filters
       ================================================================ */
    .bo-rpt .bo-filters-card { margin-bottom: 14.4px; }
    .bo-rpt .bo-filters { color: var(--bo-ink); }

    /* primary fields: 12-column grid, date gets the most room */
    .bo-rpt .bo-f-grid {
        display: grid; grid-template-columns: repeat(12, minmax(0, 1fr));
        gap: 11.2px 12.8px; align-items: end;
    }
    .bo-rpt .bo-f-player,
    .bo-rpt .bo-f-round,
    .bo-rpt .bo-f-site,
    .bo-rpt .bo-f-prov { grid-column: span 2; }
    .bo-rpt .bo-f-date { grid-column: span 4; }
    .bo-rpt .bo-f-grid--summary .bo-f-date { grid-column: span 4; }
    .bo-rpt .bo-f-grid--summary .bo-f-site,
    .bo-rpt .bo-f-grid--summary .bo-f-prov { grid-column: span 4; }

    .bo-rpt .bo-f-field { min-width: 0; }
    .bo-rpt .bo-f-label {
        display: block; margin: 0 0 4.8px;
        font-size: 9.2px; font-weight: 700; letter-spacing: .05em; text-transform: uppercase;
        color: var(--bo-ink-3);
    }
    .bo-rpt .bo-f-labelrow { display: flex; align-items: center; justify-content: space-between; gap: 8px; margin-bottom: 4.8px; }
    .bo-rpt .bo-f-labelrow .bo-f-label { margin: 0; }
    /* every label line is the same height, so fields line up even where a toggle sits beside the label */
    .bo-rpt .bo-f-field > .bo-f-label,
    .bo-rpt .bo-f-labelrow { min-height: 19.2px; display: flex; align-items: center; }
    .bo-rpt .bo-f-more .bo-seg { min-height: 32px; align-items: center; }

    /* text inputs */
    .bo-rpt .bo-f-input {
        width: 100%; height: 32px; padding: 0 9.6px;
        border: 1px solid var(--bo-line-strong); border-radius: 6.4px;
        background: var(--bo-surface); color: var(--bo-ink);
        font-size: 10.8px; outline: none;
        transition: border-color .13s, box-shadow .13s;
    }
    .bo-rpt .bo-f-input::placeholder { color: var(--bo-ink-3); opacity: .8; }
    .bo-rpt .bo-f-input:hover { border-color: var(--bo-ink-3); }
    .bo-rpt .bo-f-input:focus { border-color: var(--bo-accent); box-shadow: 0 0 0 2.4px var(--bo-accent-soft); }
    .bo-rpt .bo-f-input--mono { font-family: var(--bo-mono); font-size: 10.4px; }
    .bo-rpt .bo-f-iconbox { position: relative; }
    .bo-rpt .bo-f-iconbox > svg { position: absolute; left: 8.8px; top: 50%; width: 12.8px; height: 12.8px; transform: translateY(-50%); color: var(--bo-ink-3); pointer-events: none; }
    .bo-rpt .bo-f-iconbox > .bo-f-input { padding-left: 27.2px; }

    /* Radzen dropdowns, brought in line with the inputs (custom-style.css enlarges them globally) */
    .bo-rpt .bo-filters .rz-dropdown.bo-f-dd {
        width: 100%; height: 32px !important; min-height: 32px;
        display: flex; align-items: center;
        border: 1px solid var(--bo-line-strong) !important; border-radius: 6.4px !important;
        background: var(--bo-surface) !important; box-shadow: none !important;
        font-size: 10.8px !important;
    }
    .bo-rpt .bo-filters .rz-dropdown.bo-f-dd:hover { border-color: var(--bo-ink-3) !important; }
    .bo-rpt .bo-filters .rz-dropdown.bo-f-dd.rz-state-focused,
    .bo-rpt .bo-filters .rz-dropdown.bo-f-dd:focus-within { border-color: var(--bo-accent) !important; box-shadow: 0 0 0 2.4px var(--bo-accent-soft) !important; }
    .bo-rpt .bo-filters .rz-dropdown.bo-f-dd .rz-dropdown-label,
    .bo-rpt .bo-filters .rz-dropdown.bo-f-dd .rz-inputtext { font-size: 10.8px !important; color: var(--bo-ink); }
    .bo-rpt .bo-filters .rz-dropdown.bo-f-dd .rz-placeholder { color: var(--bo-ink-3) !important; }
    .bo-rpt .bo-filters .rz-dropdown-item span,
    .bo-rpt .bo-filters .rz-multiselect-item-content,
    .bo-rpt .bo-filters .rz-multiselect-header,
    .bo-rpt .bo-filters .rz-dropdown-filter,
    .bo-rpt .bo-filters .rz-chip-text { font-size: 10.8px !important; }

    /* date range: the shared picker keeps its behaviour, only its look is aligned here */
    .bo-rpt .bo-filters .date-range-wrapper > .form-control {
        height: 32px !important; min-height: 32px !important; padding: 0 9.6px !important;
        border: 1px solid var(--bo-line-strong) !important; border-radius: 6.4px !important;
        background: var(--bo-surface) !important;
    }
    .bo-rpt .bo-filters .date-range-wrapper > .form-control:hover { border-color: var(--bo-ink-3) !important; }
    .bo-rpt .bo-filters .date-range-wrapper > .form-control > span:first-child {
        color: var(--bo-ink) !important; font-size: 10.8px !important; font-weight: 500 !important;
        font-variant-numeric: tabular-nums; white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
    }
    .bo-rpt .bo-filters .date-range-wrapper > .form-control .text-muted { color: var(--bo-ink-3) !important; }
    .bo-rpt .bo-filters .date-range-wrapper .fa-calendar-alt { color: var(--bo-accent) !important; }
    .bo-rpt .bo-filters .drp-container { border-radius: 8px; }
    .bo-rpt .bo-filters .preset-btn { font-size: 10.8px !important; }
    .bo-rpt .bo-filters .preset-btn:hover { background: var(--bo-accent-soft) !important; color: var(--bo-accent) !important; }
    .bo-rpt .bo-filters .btn-apply-primary { background: var(--bo-accent) !important; }

    /* segmented toggle */
    .bo-rpt .bo-seg {
        display: inline-flex; flex-wrap: wrap; gap: 2px; padding: 2.4px;
        border: 1px solid var(--bo-line); border-radius: 7.2px; background: var(--bo-surface-2);
    }
    .bo-rpt .bo-seg__btn {
        border: 0; background: transparent; color: var(--bo-ink-2); cursor: pointer;
        padding: 4.8px 9.6px; border-radius: 5.6px; font-size: 10.4px; font-weight: 500; line-height: 1.2; white-space: nowrap;
        transition: background .12s, color .12s;
    }
    .bo-rpt .bo-seg__btn:hover { color: var(--bo-ink); }
    .bo-rpt .bo-seg__btn:focus-visible { outline: 2px solid var(--bo-accent); outline-offset: 1px; }
    .bo-rpt .bo-seg__btn.is-on { background: var(--bo-surface); color: var(--bo-accent); font-weight: 650; box-shadow: 0 1px 2px rgba(16, 24, 40, .10); }
    .bo-rpt .bo-seg--xs { padding: 2px; border-radius: 5.6px; }
    .bo-rpt .bo-seg--xs .bo-seg__btn { padding: 2.4px 7.2px; font-size: 9.2px; border-radius: 4px; }

    /* "More filters" panel */
    .bo-rpt .bo-f-more {
        display: flex; flex-wrap: wrap; align-items: flex-end; gap: 12.8px 22.4px;
        margin-top: 12.8px; padding: 11.2px 12.8px;
        border: 1px dashed var(--bo-line-strong); border-radius: 8px; background: var(--bo-surface-2);
    }
    .bo-rpt .bo-f-currency { width: 224px; max-width: 100%; }

    /* toolbar */
    .bo-rpt .bo-f-bar {
        display: flex; align-items: center; gap: 6.4px; flex-wrap: wrap;
        margin-top: 12.8px; padding-top: 11.2px; border-top: 1px solid var(--bo-line);
    }
    .bo-rpt .bo-f-bar__end { margin-left: auto; display: flex; gap: 6.4px; flex-wrap: wrap; }
    .bo-rpt .bo-fbtn {
        display: inline-flex; align-items: center; justify-content: center; gap: 5.6px;
        height: 30.4px; padding: 0 12px; border-radius: 6.4px; cursor: pointer; white-space: nowrap;
        border: 1px solid var(--bo-line-strong); background: var(--bo-surface); color: var(--bo-ink);
        font-size: 10.8px; font-weight: 600;
        transition: background .13s, border-color .13s, color .13s;
    }
    .bo-rpt .bo-fbtn svg { width: 12.8px; height: 12.8px; }
    .bo-rpt .bo-fbtn:hover { border-color: var(--bo-ink-3); background: var(--bo-surface-2); }
    .bo-rpt .bo-fbtn:focus-visible { outline: 2px solid var(--bo-accent); outline-offset: 2px; }
    .bo-rpt .bo-fbtn--ghost { border-color: transparent; background: transparent; color: var(--bo-ink-2); }
    .bo-rpt .bo-fbtn--ghost:hover { background: var(--bo-surface-2); border-color: transparent; color: var(--bo-ink); }
    .bo-rpt .bo-fbtn--ghost.is-on { background: var(--bo-accent-soft); color: var(--bo-accent); }
    .bo-rpt .bo-fbtn--primary { min-width: 92.8px; border-color: var(--bo-accent); background: var(--bo-accent); color: #fff; box-shadow: 0 3.2px 9.6px rgba(91, 87, 214, .28); }
    .bo-rpt .bo-fbtn--primary:hover { border-color: #4a46c4; background: #4a46c4; color: #fff; }
    [data-bs-theme="dark"] .bo-rpt .bo-fbtn--primary { color: #0d0f1c; }
    .bo-rpt .bo-f-badge {
        min-width: 15.2px; height: 15.2px; padding: 0 4.8px; border-radius: 999px;
        display: inline-grid; place-items: center;
        background: var(--bo-accent); color: #fff; font-size: 9.2px; font-weight: 700;
    }

    @media (max-width: 1599.98px) {
        .bo-rpt .bo-f-player,
    .bo-rpt .bo-f-round { grid-column: span 3; }
        .bo-rpt .bo-f-date { grid-column: span 6; }
        .bo-rpt .bo-f-site,
    .bo-rpt .bo-f-prov { grid-column: span 6; }
        .bo-rpt .bo-f-grid--summary .bo-f-date { grid-column: span 12; }
        .bo-rpt .bo-f-grid--summary .bo-f-site,
    .bo-rpt .bo-f-grid--summary .bo-f-prov { grid-column: span 6; }
    }
    @media (max-width: 991.98px) {
        .bo-rpt .bo-f-player,
    .bo-rpt .bo-f-round,
    .bo-rpt .bo-f-site,
    .bo-rpt .bo-f-prov { grid-column: span 6; }
        .bo-rpt .bo-f-date { grid-column: span 12; }
    }
    @media (max-width: 767.98px) {
        .bo-rpt .bo-f-grid > .bo-f-field { grid-column: span 12 !important; }
        .bo-rpt .bo-f-more { flex-direction: column; align-items: stretch; }
        .bo-rpt .bo-f-currency { width: 100%; }
        .bo-rpt .bo-f-bar__end { width: 100%; margin-left: 0; }
        .bo-rpt .bo-f-bar__end .bo-fbtn { flex: 1 1 0; }
        .bo-rpt .bo-f-bar__end .bo-fbtn--primary { flex-basis: 100%; order: -1; }
        .bo-rpt .bo-f-bar > .bo-fbtn--ghost { width: 100%; justify-content: flex-start; }

        /* shared date picker popup: fit the phone instead of spilling off the right edge */
        .bo-rpt .bo-filters .drp-container {
            position: fixed !important; left: 6.4px !important; right: 6.4px; top: 51.2px !important;
            max-height: calc(100vh - 64px); overflow: auto; flex-direction: column;
        }
        .bo-rpt .bo-filters .drp-container .sidebar-presets { width: auto; flex-direction: row; flex-wrap: wrap; gap: 3.2px; }
        .bo-rpt .bo-filters .drp-container .sidebar-presets .mt-auto { width: 100%; }
        .bo-rpt .bo-filters .drp-container .calendar-section { flex-direction: column; padding: 9.6px; }
        .bo-rpt .bo-filters .drp-container .calendar-section > div { width: auto !important; border: 0 !important; padding-left: 0 !important; }
    }

    
    /* ---- shared atoms ---- */
    .bo-rpt .bo-num { text-align: right; font-variant-numeric: tabular-nums; white-space: nowrap; }
    .bo-rpt .bo-mono { font-family: var(--bo-mono); }
    .bo-rpt .bo-sub { font-size: 10.8px; color: var(--bo-ink-3); }
    .bo-rpt .bo-dash { color: var(--bo-dash-c) !important; font-weight: 400 !important; }
    .bo-rpt .bo-pos { color: var(--bo-pos); font-weight: 600; }
    .bo-rpt .bo-neg { color: var(--bo-neg); font-weight: 600; }

    .bo-rpt .bo-pill {
        display: inline-block; padding: 3.2px 8.8px; border-radius: 999px;
        font-size: 11.2px; font-weight: 600; line-height: 1.2; white-space: nowrap;
        background: var(--bo-pos-soft); color: var(--bo-pos);
    }
    .bo-rpt .bo-pill--warn { background: var(--bo-warn-soft); color: var(--bo-warn); }
    .bo-rpt .bo-pill--neutral { background: var(--bo-surface-2); color: var(--bo-ink-2); border: 1px solid var(--bo-line); }
    .bo-rpt .bo-pill--cancel { background: var(--bo-surface-2); color: var(--bo-ink-3); border: 1px solid var(--bo-line); }

    .bo-rpt .bo-chip {
        display: inline-block; padding: 2.4px 7.2px; border-radius: 999px;
        background: var(--bo-surface-2); color: var(--bo-ink-2); border: 1px solid var(--bo-line);
        font-size: 9.2px; font-weight: 700; letter-spacing: .04em; text-transform: uppercase;
    }

    .bo-rpt .bo-btn {
        display: inline-flex; align-items: center; gap: 5.6px;
        padding: 5.6px 10.4px; border-radius: 6.4px; cursor: pointer; white-space: nowrap;
        border: 1px solid var(--bo-line); background: var(--bo-surface); color: var(--bo-ink);
        font-size: 10.8px; font-weight: 500; line-height: 1.3;
        transition: border-color .13s, background .13s;
    }
    .bo-rpt .bo-btn:hover { border-color: var(--bo-ink-3); background: var(--bo-surface-2); }
    .bo-rpt .bo-btn:focus-visible { outline: 2px solid var(--bo-accent); outline-offset: 1px; }
    .bo-rpt .bo-btn svg { width: 12px; height: 12px; }
    .bo-rpt .bo-btn--link { color: var(--bo-accent); border-color: var(--bo-accent-line); font-weight: 600; }
    .bo-rpt .bo-btn--xs { padding: 3.2px 8px; font-size: 10.4px; }
    .bo-rpt .bo-btn.is-on { background: var(--bo-accent); border-color: var(--bo-accent); color: #fff; }

    /* ---- page totals strip ---- */
    .bo-rpt .bo-ptotals {
        display: grid; grid-template-columns: repeat(auto-fit, minmax(148.8px, 1fr)); gap: 1px;
        margin: 4.8px 0 11.2px; border: 1px solid var(--bo-line); border-radius: 8px;
        background: var(--bo-line); overflow: hidden;
    }
    .bo-rpt .bo-ptotals__label {
        grid-column: 1 / -1;
        display: flex; align-items: center; padding: 5.6px 12.8px;
        background: var(--bo-surface-2); color: var(--bo-ink-3);
        font-size: 8.8px; font-weight: 700; letter-spacing: .05em; text-transform: uppercase;
    }
    .bo-rpt .bo-ptotals__item { min-width: 0; padding: 8px 11.2px; background: var(--bo-surface); }
    .bo-rpt .bo-ptotals__item span {
        display: block; margin-bottom: 2.4px;
        font-size: 8.8px; font-weight: 600; color: var(--bo-ink-3); text-transform: uppercase; letter-spacing: .04em;
    }
    .bo-rpt .bo-ptotals__item b { display: block; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; font-size: 12.4px; font-weight: 650; font-variant-numeric: tabular-nums; color: var(--bo-ink); }
    .bo-rpt .bo-ptotals__item--hero { background: var(--bo-accent-soft); }

/* =====================================================================
   Filter layout for the report pages
   ===================================================================== */
/* three primary fields: date, then two pickers */
.bo-rpt .bo-f-grid--3 > .bo-f-field { grid-column: span 4; }
/* second line: grouping toggle and the picker that belongs to it */
.bo-rpt .bo-f-row {
    display: flex; flex-wrap: wrap; align-items: flex-end; gap: 11.2px 19.2px;
    margin-top: 11.2px;
}
.bo-rpt .bo-f-row > .bo-f-field { min-width: 0; }
.bo-rpt .bo-f-row .bo-seg { min-height: 32px; align-items: center; }
.bo-rpt .bo-f-pick { width: 272px; max-width: 100%; }
.bo-rpt .bo-f-err .validation-message { margin-top: 4px; font-size: 9.6px; color: var(--bo-neg); }

@media (max-width: 1279.98px) {
    .bo-rpt .bo-f-grid--3 > .bo-f-date { grid-column: span 12; }
    .bo-rpt .bo-f-grid--3 > .bo-f-field:not(.bo-f-date) { grid-column: span 6; }
}
@media (max-width: 767.98px) {
    .bo-rpt .bo-f-grid--3 > .bo-f-field { grid-column: span 12 !important; }
    .bo-rpt .bo-f-row { flex-direction: column; align-items: stretch; }
    .bo-rpt .bo-f-pick { width: 100%; }
    .bo-rpt .bo-seg { width: 100%; }
    .bo-rpt .bo-seg__btn { flex: 1 1 auto; }
}

/* =====================================================================
   Result card: toolbar, totals, grid
   ===================================================================== */
.bo-rpt .bo-rcard { color: var(--bo-ink); }
.bo-rpt .bo-rbar {
    display: flex; align-items: center; flex-wrap: wrap; gap: 8px 11.2px;
    margin: 0 0 9.6px;
}
.bo-rpt .bo-rbar__title { font-size: 12px; font-weight: 650; color: var(--bo-ink); }
.bo-rpt .bo-rbar__meta { font-size: 10px; color: var(--bo-ink-3); }
.bo-rpt .bo-rbar__end { margin-left: auto; display: flex; align-items: center; flex-wrap: wrap; gap: 6.4px; }
.bo-rpt .bo-seg--sm .bo-seg__btn { padding: 4px 8.8px; font-size: 10px; }
.bo-rpt .bo-btn svg { width: 12px; height: 12px; }

/* grid base: undo the global Radzen overrides in custom-style.css */
.bo-rpt .bo-rgrid .rz-data-grid { border: 1px solid var(--bo-line); border-radius: 8px; overflow: hidden; background: var(--bo-surface); }
.bo-rpt .bo-rgrid .rz-grid-table td .rz-cell-data { white-space: nowrap !important; font-size: 10.4px !important; color: var(--bo-ink); }
.bo-rpt .bo-rgrid .rz-grid-table > tbody > tr > td { vertical-align: middle; border-bottom: 1px solid var(--bo-line); }
.bo-rpt .bo-rgrid .rz-grid-table > tbody > tr.rz-data-row:hover > td { background: var(--bo-surface-2); }

/* header + footer: a matched pair (custom-style.css sets 14.4px titles and red footers) */
.bo-rpt .bo-rgrid .rz-grid-table > thead > tr > th,
.bo-rpt .bo-rgrid .rz-grid-table > tfoot > tr > td { background: var(--bo-surface-2); }
.bo-rpt .bo-rgrid .rz-grid-table > thead > tr > th .rz-column-title,
.bo-rpt .bo-rgrid .rz-grid-table > thead > tr > th .rz-column-title-content {
    font-size: 9px !important; line-height: 1.35 !important; font-weight: 700; letter-spacing: .04em;
    color: var(--bo-ink-2); white-space: nowrap !important; overflow: hidden; text-overflow: ellipsis;
}
.bo-rpt .bo-rgrid .rz-grid-table > thead > tr > th .rz-column-title-content { display: inline-block; max-width: 100%; vertical-align: middle; }
/* long report titles wrap onto a second line rather than being cut off */
.bo-rpt .bo-rgrid .rz-grid-table > thead > tr > th .rz-column-title,
.bo-rpt .bo-rgrid .rz-grid-table > thead > tr > th .rz-column-title-content {
    white-space: normal !important; text-overflow: clip; overflow-wrap: normal;
    display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 2;
}
.bo-rpt .bo-rgrid .rz-grid-table > thead > tr > th { vertical-align: bottom; }
.bo-rpt .bo-rgrid .rz-grid-table > tfoot > tr > td { font-size: 9.6px !important; border-top: 1px solid var(--bo-line-strong); }
.bo-rpt .bo-rgrid .rz-grid-table > tfoot > tr > td .rz-column-footer { color: var(--bo-ink) !important; }
.bo-rpt .bo-rgrid .bo-foot { font-size: 10.4px; font-weight: 700; color: var(--bo-ink); font-variant-numeric: tabular-nums; white-space: nowrap; }
.bo-rpt .bo-rgrid .bo-foot--label { font-size: 9px; letter-spacing: .04em; text-transform: uppercase; color: var(--bo-ink-2); }

/* amount cells: tighter side padding so full figures fit */
@media (min-width: 768px) {
    .bo-rpt .bo-rgrid .rz-grid-table > thead > tr > th,
    .bo-rpt .bo-rgrid .rz-grid-table > tbody > tr > td,
    .bo-rpt .bo-rgrid .rz-grid-table > tfoot > tr > td { padding-left: 9.6px !important; padding-right: 9.6px !important; }
    .bo-rpt .bo-rgrid .rz-grid-table :is(th, td).bo-c-amt { padding-left: 4.8px !important; padding-right: 9.6px !important; }
}
.bo-rpt .bo-rgrid .rz-grid-table > tfoot .bo-foot,
.bo-rpt .bo-rgrid .bo-gfoot { font-size: 10px; }

/* totals strip on these pages: flex, so a short row of figures still fills the width */
.bo-rpt .bo-ptotals { display: flex; flex-wrap: wrap; }
.bo-rpt .bo-ptotals__label { flex: 1 0 100%; }
.bo-rpt .bo-ptotals__item { flex: 1 1 144px; }

.bo-rpt .bo-rgrid .bo-chip { font-size: 8.8px; padding: 2px 6.4px; }
.bo-rpt .bo-rgrid .bo-strong { font-weight: 600; color: var(--bo-ink); }
.bo-rpt .bo-rgrid .bo-muted { color: var(--bo-ink-3); }
/* the figure a commission is calculated from */
.bo-rpt .bo-basis { color: var(--bo-accent); font-weight: 650; }
.bo-rpt .bo-basis::after {
    content: ""; display: inline-block; width: 4.8px; height: 4.8px; margin-left: 4.8px; vertical-align: middle;
    border-radius: 50%; background: currentColor; opacity: .75;
}

/* ---- group header rows (Radzen grouping) ---- */
.bo-rpt .bo-rgrid tr:has(.bo-ghead) > td { background: var(--bo-surface-2) !important; border-bottom: 1px solid var(--bo-line); }
.bo-rpt .bo-rgrid .bo-ghead { display: inline-flex; align-items: center; gap: 8px; white-space: nowrap; }
.bo-rpt .bo-rgrid .bo-ghead__k { font-size: 8.8px; font-weight: 700; letter-spacing: .05em; text-transform: uppercase; color: var(--bo-ink-3); }
.bo-rpt .bo-rgrid .bo-ghead b { font-size: 11.2px; font-weight: 650; color: var(--bo-ink); }
.bo-rpt .bo-rgrid .bo-ghead__n {
    padding: 1px 6.4px; border-radius: 999px; border: 1px solid var(--bo-line);
    background: var(--bo-surface); font-size: 9.2px; font-weight: 600; color: var(--bo-ink-2);
}

/* ---- group subtotal rows ---- */
.bo-rpt .bo-rgrid tr:has(.bo-gfoot) > td { background: color-mix(in srgb, var(--bo-accent) 6%, var(--bo-surface)) !important; border-bottom: 1px solid var(--bo-line); }
.bo-rpt .bo-rgrid .bo-gfoot { display: block; font-size: 10.4px; font-weight: 700; color: var(--bo-ink); font-variant-numeric: tabular-nums; white-space: nowrap; }
.bo-rpt .bo-rgrid .bo-gfoot--label { font-size: 9px; font-weight: 700; letter-spacing: .04em; text-transform: uppercase; color: var(--bo-accent); overflow: hidden; text-overflow: ellipsis; }

/* ---- Provider Report grid: never squeeze, scroll sideways instead ---- */
.bo-rpt .bo-rgrid--prov .rz-grid-table { min-width: 1104px; }

/* ---- Affiliate Report hierarchy rows ---- */
.bo-rpt .bo-rgrid--aff .rz-grid-table { min-width: 1184px; }
.bo-rpt .bo-rgrid tr[data-bo-kind="head"] > td { background: var(--bo-surface-2) !important; }
.bo-rpt .bo-rgrid tr[data-bo-kind="head"][data-bo-lvl="0"] > td { background: color-mix(in srgb, var(--bo-accent) 9%, var(--bo-surface)) !important; }
/* opaque tints: the first column is frozen, so rows must not let scrolled cells show through */
.bo-rpt .bo-rgrid tr[data-bo-kind="total"] > td { background: color-mix(in srgb, var(--bo-accent) 6%, var(--bo-surface)) !important; font-weight: 650; }
.bo-rpt .bo-rgrid .rz-grid-table > tbody > tr.rz-data-row:not([data-bo-kind]) > td.rz-frozen-cell { background: var(--bo-surface); }
.bo-rpt .bo-rgrid .rz-grid-table .rz-frozen-cell { box-shadow: inset -1px 0 0 var(--bo-line); }
.bo-rpt .bo-period { display: flex; flex-direction: column; line-height: 1.3; min-width: 0; }
.bo-rpt .bo-period__end { font-size: 9.4px; color: var(--bo-ink-3); }
.bo-rpt .bo-rgrid tr[data-bo-kind="total"] > td .rz-cell-data { font-weight: 650; }
.bo-rpt .bo-rgrid tr[data-bo-kind="head"] > td:first-child,
.bo-rpt .bo-rgrid tr[data-bo-kind="head"] > td:first-child .rz-cell-data { overflow: visible !important; }
.bo-rpt .bo-rgrid tr[data-bo-kind="head"] > td:first-child { position: relative; z-index: 2; }
.bo-rpt .bo-rgrid tr[data-bo-kind="head"] .bo-node__name { overflow: visible; }
.bo-rpt .bo-node { display: flex; align-items: center; gap: 6.4px; white-space: nowrap; min-width: 0; }
.bo-rpt .bo-node__toggle {
    width: 19.2px; height: 19.2px; flex: none; padding: 0;
    display: grid; place-items: center; border-radius: 4.8px;
    border: 1px solid var(--bo-line); background: var(--bo-surface); color: var(--bo-ink-2); cursor: pointer;
}
.bo-rpt .bo-node__toggle:hover { border-color: var(--bo-accent-line); color: var(--bo-accent); }
.bo-rpt .bo-node__toggle svg { width: 11.2px; height: 11.2px; transition: transform .15s ease; }
.bo-rpt .bo-node__toggle.is-open svg { transform: rotate(90deg); }
.bo-rpt .bo-node__spacer { width: 19.2px; flex: none; }
.bo-rpt .bo-node__type {
    padding: 2px 6.4px; border-radius: 999px; background: var(--bo-surface); border: 1px solid var(--bo-line);
    font-size: 8.4px; font-weight: 700; letter-spacing: .05em; text-transform: uppercase; color: var(--bo-ink-3);
}
.bo-rpt .bo-node__name { font-size: 10.8px; font-weight: 650; color: var(--bo-ink); overflow: hidden; text-overflow: ellipsis; }
.bo-rpt .bo-node__total { font-size: 9px; font-weight: 700; letter-spacing: .04em; text-transform: uppercase; color: var(--bo-accent); }
.bo-rpt .bo-date { font-variant-numeric: tabular-nums; }

/* wide screens: a little less padding everywhere so more fits */
@media (min-width: 768px) {
    .bo-rpt .bo-rgrid .rz-grid-table > tbody > tr > td,
    .bo-rpt .bo-rgrid .rz-grid-table > thead > tr > th,
    .bo-rpt .bo-rgrid .rz-grid-table > tfoot > tr > td { padding-top: 7.2px; padding-bottom: 7.2px; }
}

/* =====================================================================
   Phones: every row becomes a card of label / value pairs.
   The labels come from data-label (added in CellRender), so this works
   for any column set, including the Affiliate Report's dynamic columns.
   ===================================================================== */
@media (max-width: 767.98px) {
    .bo-rpt .bo-rbar__end { width: 100%; margin-left: 0; }
    .bo-rpt .bo-rbar__end > * { flex: 1 1 auto; }
    .bo-rpt .bo-rbar__end .bo-btn { justify-content: center; }

    .bo-rpt .bo-rgrid .rz-data-grid { border: 0; border-radius: 0; background: transparent; overflow: visible; }
    .bo-rpt .bo-rgrid .rz-data-grid-data { overflow: visible !important; }
    .bo-rpt .bo-rgrid .rz-grid-table { min-width: 0 !important; width: 100% !important; table-layout: auto !important; }
    .bo-rpt .bo-rgrid .rz-grid-table,
    .bo-rpt .bo-rgrid .rz-grid-table > tbody,
    .bo-rpt .bo-rgrid .rz-grid-table > tfoot { display: block; }
    .bo-rpt .bo-rgrid .rz-grid-table > colgroup,
    .bo-rpt .bo-rgrid .rz-grid-table > thead { display: none; }

    /* data rows */
    .bo-rpt .bo-rgrid .rz-grid-table > tbody > tr {
        display: block; margin: 0 0 8px; padding: 4.8px 0;
        border: 1px solid var(--bo-line); border-radius: 8px; background: var(--bo-surface); overflow: hidden;
    }
    .bo-rpt .bo-rgrid .rz-grid-table > tbody > tr > td {
        display: flex; justify-content: space-between; align-items: center; gap: 9.6px;
        width: auto !important; padding: 4px 11.2px !important; border: 0 !important; text-align: right !important;
        background: transparent !important;
    }
    .bo-rpt .bo-rgrid .rz-grid-table > tbody > tr > td[data-label]::before {
        content: attr(data-label); flex: none; max-width: 55%;
        text-align: left; font-size: 8.8px; font-weight: 700; letter-spacing: .04em; text-transform: uppercase;
        color: var(--bo-ink-3); white-space: normal;
    }
    .bo-rpt .bo-rgrid .rz-grid-table > tbody > tr > td .rz-cell-data { white-space: normal !important; overflow-wrap: anywhere; min-width: 0; }
    /* empty cells, hidden columns and Radzen's grouping indent cells add nothing in a card */
    .bo-rpt .bo-rgrid .rz-grid-table > tbody > tr > td:empty,
    .bo-rpt .bo-rgrid .rz-grid-table > tbody > tr > td:not([data-label]):not([colspan]):not(:has(.bo-gfoot, .bo-ghead)),
    .bo-rpt .bo-rgrid .rz-grid-table > tbody > tr > td:has(> .rz-cell-data:empty) { display: none !important; }

    /* the first cell reads as the card title */
    .bo-rpt .bo-rgrid .rz-grid-table > tbody > tr.rz-data-row:not([data-bo-kind]) > td.bo-c-title {
        padding-bottom: 6.4px !important; margin-bottom: 3.2px; border-bottom: 1px solid var(--bo-line) !important;
        justify-content: flex-start; text-align: left !important;
    }
    .bo-rpt .bo-rgrid .rz-grid-table > tbody > tr.rz-data-row:not([data-bo-kind]) > td.bo-c-title::before { display: none; }
    .bo-rpt .bo-rgrid .rz-grid-table > tbody > tr.rz-data-row:not([data-bo-kind]) > td.bo-c-title .rz-cell-data { font-size: 11.2px !important; font-weight: 650; }

    /* group headings sit above their cards */
    .bo-rpt .bo-rgrid .rz-grid-table > tbody > tr:has(.bo-ghead) {
        margin: 12.8px 0 6.4px; padding: 0; border: 0; background: transparent;
    }
    .bo-rpt .bo-rgrid .rz-grid-table > tbody > tr:has(.bo-ghead) > td { background: transparent !important; padding: 0 2px !important; justify-content: flex-start; }
    .bo-rpt .bo-rgrid .rz-grid-table > tbody > tr:has(.bo-ghead) > td:not(:has(.bo-ghead)) { display: none !important; }
    .bo-rpt .bo-rgrid .bo-ghead { white-space: normal; flex-wrap: wrap; }

    /* group subtotal: a tinted card, each figure labelled */
    .bo-rpt .bo-rgrid .rz-grid-table > tbody > tr:has(.bo-gfoot) { background: var(--bo-accent-soft); border-color: var(--bo-accent-line); }
    .bo-rpt .bo-rgrid .rz-grid-table > tbody > tr:has(.bo-gfoot) > td:not(:has(.bo-gfoot)) { display: none !important; }
    .bo-rpt .bo-rgrid .bo-gfoot { display: flex; justify-content: space-between; gap: 9.6px; width: 100%; }
    .bo-rpt .bo-rgrid .bo-gfoot[data-label]::before,
    .bo-rpt .bo-rgrid .bo-foot[data-label]::before {
        content: attr(data-label); font-size: 8.8px; font-weight: 700; letter-spacing: .04em; text-transform: uppercase; color: var(--bo-ink-3);
    }

    /* page / grand total: same idea in the footer */
    .bo-rpt .bo-rgrid .rz-grid-table > tfoot > tr {
        display: block; padding: 4.8px 0; border: 1px solid var(--bo-line-strong); border-radius: 8px; background: var(--bo-surface-2);
    }
    .bo-rpt .bo-rgrid .rz-grid-table > tfoot > tr > td { display: block; width: auto !important; padding: 3.2px 11.2px !important; border: 0 !important; background: transparent !important; }
    .bo-rpt .bo-rgrid .rz-grid-table > tfoot > tr > td:not(:has(.bo-foot)) { display: none; }
    .bo-rpt .bo-rgrid .bo-foot { display: flex; justify-content: space-between; gap: 9.6px; }

    /* no frozen column in the card layout */
    .bo-rpt .bo-rgrid .rz-grid-table .rz-frozen-cell { position: static !important; box-shadow: none !important; }

    /* Affiliate hierarchy on phones: headings, not cards */
    .bo-rpt .bo-rgrid .rz-grid-table > tbody > tr[data-bo-kind="head"] { margin: 11.2px 0 6.4px; padding: 0; border: 0; background: transparent; overflow: visible; }
    .bo-rpt .bo-rgrid .rz-grid-table > tbody > tr[data-bo-kind="head"] > td { padding: 6.4px 8px !important; border-radius: 7.2px; justify-content: flex-start; }
    .bo-rpt .bo-rgrid .rz-grid-table > tbody > tr[data-bo-kind="head"][data-bo-lvl="1"] { margin-left: 8px; }
    .bo-rpt .bo-rgrid .rz-grid-table > tbody > tr[data-bo-kind="head"][data-bo-lvl="2"] { margin-left: 16px; }
    .bo-rpt .bo-rgrid .rz-grid-table > tbody > tr[data-bo-kind="head"][data-bo-lvl="3"] { margin-left: 24px; }
    .bo-rpt .bo-rgrid tr[data-bo-kind="head"] > td:not(:first-child) { display: none !important; }
    .bo-rpt .bo-rgrid tr[data-bo-kind="head"] > td::before { display: none !important; }
    .bo-rpt .bo-rgrid tr[data-bo-kind="head"] .bo-node { white-space: normal; flex-wrap: wrap; padding-left: 0 !important; }
    .bo-rpt .bo-rgrid tr[data-bo-kind="total"] { background: var(--bo-accent-soft); border-color: var(--bo-accent-line); }
    .bo-rpt .bo-rgrid .bo-node { padding-left: 0 !important; }
    .bo-rpt .bo-rgrid tr[data-bo-kind="total"] > td:first-child { padding-bottom: 4.8px !important; }
    .bo-rpt .bo-rgrid tr[data-bo-kind="total"] > td:first-child::before { display: none; }

    /* totals: two figures per row, sized to fit hundred-million values */
    .bo-rpt .bo-ptotals__item { flex: 1 1 40%; padding: 7.2px 9.6px; }
    .bo-rpt .bo-ptotals__label { padding: 5.6px 9.6px; }
    .bo-rpt .bo-ptotals__item b { font-size: clamp(8.8px, 3.4vw, 11.2px); }

    /* toggles: a tidy two-column grid instead of ragged wrapping */
    .bo-rpt .bo-seg { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .bo-rpt .bo-seg__btn { white-space: normal; text-align: center; }
    .bo-rpt .bo-seg--sm { grid-template-columns: repeat(2, minmax(0, 1fr)); }

    /* Radzen pager: centre it and let it wrap */
    .bo-rpt .bo-rgrid .rz-pager { flex-wrap: wrap; justify-content: center; gap: 4.8px; }
}

/* =====================================================================
   History pages and the Testing › Affiliate Report pages
   ===================================================================== */
/* one-field filter (saved report picker) with its button alongside */
.bo-rpt .bo-f-inline { display: flex; align-items: flex-end; gap: 9.6px; flex-wrap: wrap; }
.bo-rpt .bo-f-inline .bo-f-grow { flex: 0 1 416px; min-width: 192px; }
.bo-rpt .bo-f-inline > .bo-fbtn { height: 32px; }
.bo-rpt .bo-fbtn--danger { border-color: rgba(192, 57, 43, .35); color: var(--bo-neg); background: var(--bo-surface); }
.bo-rpt .bo-fbtn--danger:hover { border-color: var(--bo-neg); background: rgba(192, 57, 43, .07); color: var(--bo-neg); }
.bo-rpt .bo-rbar--end { margin: 11.2px 0 0; }
.bo-rpt .bo-rgrid--hist .rz-grid-table { min-width: 1040px; }

/* chevron used by the tree toggles */
.bo-rpt .bo-tgl {
    width: 17.6px; height: 17.6px; flex: none; display: inline-grid; place-items: center;
    border-radius: 4.8px; border: 1px solid var(--bo-line); background: var(--bo-surface); color: var(--bo-ink-2);
}
.bo-rpt .bo-tgl svg { width: 10.4px; height: 10.4px; transition: transform .15s ease; }
.bo-rpt .bo-tgl.is-open svg { transform: rotate(90deg); }

/* tree heading rows (header rows span the whole table) */
.bo-rpt :is(.affiliate-grid-toggle, .history-grid-toggle) {
    padding: 7.2px 9.6px !important; font-size: 10.8px; color: var(--bo-ink) !important;
}
.bo-rpt :is(.affiliate-grid-toggle, .history-grid-toggle):hover { background: color-mix(in srgb, var(--bo-accent) 5%, var(--bo-surface)) !important; }
.bo-rpt :is(.affiliate-grid-toggle, .history-grid-toggle):hover .bo-tgl { border-color: var(--bo-accent-line); color: var(--bo-accent); }
.bo-rpt :is(.affiliate-grid-toggle, .history-grid-toggle):focus-visible { outline: 2px solid var(--bo-accent) !important; }
.bo-rpt :is(.affiliate-grid-heading, .history-grid-heading) { gap: 7.2px !important; }
.bo-rpt :is(.affiliate-grid-heading, .history-grid-heading) strong { font-weight: 650; color: var(--bo-ink); }
.bo-rpt .bo-rgrid tr:is(.affiliate-grid-header-row, .history-grid-header-row) > td { background: var(--bo-surface-2) !important; }
.bo-rpt .bo-rgrid tr:is(.affiliate-grid-subtotal-row, .history-grid-subtotal-row) > td {
    background: color-mix(in srgb, var(--bo-accent) 6%, var(--bo-surface)) !important;
    height: 30.4px !important; font-weight: 650; font-variant-numeric: tabular-nums;
}
.bo-rpt :is(.affiliate-grid-total-label, .history-grid-total-label) {
    font-size: 9px; font-weight: 700; letter-spacing: .04em; text-transform: uppercase; color: var(--bo-accent);
}
/* the collapsed / expanded footer strips used by the Testing grid */
.bo-rpt :is(.affiliate-report-collapsed-footer, .affiliate-report-expanded-footer) { color: var(--bo-ink) !important; font-weight: 650; font-variant-numeric: tabular-nums; }
.bo-rpt :is(.affiliate-report-collapsed-footer-label, .affiliate-report-expanded-footer-label) {
    font-size: 9px; font-weight: 700; letter-spacing: .04em; text-transform: uppercase; color: var(--bo-accent);
}
/* branch component (affiliate tree outside the grid) */
.bo-rpt .affiliate-branch-toggle {
    gap: 7.2px !important; padding: 7.2px 9.6px !important; border: 1px solid var(--bo-line) !important; border-radius: 7.2px;
    background: var(--bo-surface-2) !important; font-size: 10.8px;
}
.bo-rpt .affiliate-branch-toggle:hover { border-color: var(--bo-accent-line) !important; }
.bo-rpt .affiliate-branch-toggle:focus-visible { outline: 2px solid var(--bo-accent) !important; }
.bo-rpt .affiliate-branch-toggle .bo-node__name { font-weight: 650; }

@media (max-width: 767.98px) {
    .bo-rpt .bo-f-inline { flex-direction: column; align-items: stretch; }
    .bo-rpt .bo-f-inline .bo-f-grow { flex: 1 1 auto; min-width: 0; }
    /* tree heading rows read as headings above their cards */
    .bo-rpt .bo-rgrid .rz-grid-table > tbody > tr:is(.affiliate-grid-header-row, .history-grid-header-row) { padding: 0; margin: 11.2px 0 6.4px; border: 0; background: transparent; }
    .bo-rpt .bo-rgrid .rz-grid-table > tbody > tr:is(.affiliate-grid-header-row, .history-grid-header-row) > td { padding: 0 !important; border-radius: 7.2px; overflow: hidden; }
    .bo-rpt :is(.affiliate-grid-heading, .history-grid-heading) { padding-left: 0 !important; }
    .bo-rpt .bo-rgrid .rz-grid-table > tbody > tr:is(.affiliate-grid-header-row, .history-grid-header-row) > td:not([colspan]) { display: none !important; }
    .bo-rpt .bo-rgrid .rz-grid-table > tbody > tr:is(.affiliate-grid-subtotal-row, .history-grid-subtotal-row) { background: var(--bo-accent-soft); border-color: var(--bo-accent-line); }
    .bo-rpt .bo-rgrid .rz-grid-table > tbody > tr:is(.affiliate-grid-subtotal-row, .history-grid-subtotal-row) > td { height: auto !important; }
    .bo-rpt .bo-rgrid .rz-grid-table > tbody > tr:is(.affiliate-grid-subtotal-row, .history-grid-subtotal-row) > td[colspan] { justify-content: flex-start; text-align: left !important; }
    .bo-rpt .bo-rgrid .rz-grid-table > tbody > tr:is(.affiliate-grid-subtotal-row, .history-grid-subtotal-row) > td[colspan]::before { display: none; }
    .bo-rpt .affiliate-report-grid .rz-grid-table { width: 100% !important; }
}

/* =====================================================================
   Game Code Report
   ===================================================================== */
.bo-rpt .bo-rgrid--gc .rz-grid-table { min-width: 1104px; }
.bo-rpt .bo-rgrid .bo-l1 { display: block; line-height: 1.3; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.bo-rpt .bo-rgrid .bo-l2 { display: block; margin-top: 2px; line-height: 1.3; font-size: 9.4px; color: var(--bo-ink-3); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.bo-rpt .bo-rgrid .bo-l2.bo-mono { font-size: 9.2px; }
@media (max-width: 767.98px) {
    .bo-rpt .bo-rgrid .rz-grid-table > tbody > tr.rz-data-row > td.bo-c-title .rz-cell-data { display: flex; flex-direction: column; min-width: 0; }
    .bo-rpt .bo-rgrid .bo-l1, .bo-rpt .bo-rgrid .bo-l2 { white-space: normal; }
}

/* =====================================================================
   Player Listing
   ===================================================================== */
.bo-rpt .bo-f-grid--pl .bo-f-plcode { grid-column: span 3; }
.bo-rpt .bo-f-grid--pl .bo-f-date { grid-column: span 5; }
.bo-rpt .bo-f-grid--pl .bo-f-plsite { grid-column: span 4; }
@media (max-width: 1279.98px) {
    .bo-rpt .bo-f-grid--pl .bo-f-plcode, .bo-rpt .bo-f-grid--pl .bo-f-plsite { grid-column: span 6; }
    .bo-rpt .bo-f-grid--pl .bo-f-date { grid-column: span 12; order: 3; }
}
@media (max-width: 767.98px) {
    .bo-rpt .bo-f-grid--pl > .bo-f-field { grid-column: span 12 !important; }
}

.bo-rpt .bo-rgrid--pl .rz-grid-table { min-width: 992px; }
.bo-rpt .bo-rgrid tr[data-bo-open="true"] > td { background: color-mix(in srgb, var(--bo-accent) 6%, var(--bo-surface)) !important; }
.bo-rpt .bo-pill--off { background: rgba(192, 57, 43, .10); color: var(--bo-neg); }
.bo-rpt .bo-rgrid .bo-pill { font-size: 9.6px; padding: 2.4px 8px; }
.bo-rpt .bo-actions { display: flex; align-items: center; gap: 4.8px; flex-wrap: wrap; }
.bo-rpt .bo-btn--danger { color: var(--bo-neg); border-color: rgba(192, 57, 43, .35); }
.bo-rpt .bo-btn--danger:hover { border-color: var(--bo-neg); background: rgba(192, 57, 43, .07); }
.bo-rpt .bo-btn .bo-chev { width: 11.2px; height: 11.2px; transition: transform .15s ease; }
.bo-rpt .bo-btn.is-on .bo-chev { transform: rotate(180deg); }
.bo-rpt .bo-btn.is-on { background: var(--bo-accent); border-color: var(--bo-accent); color: #fff; }

/* wallets under a transfer-wallet player */
.bo-rpt .bo-wallets {
    margin: 3.2px 0 8px; padding: 11.2px 12.8px 9.6px;
    border: 1px solid var(--bo-line); border-left: 2.4px solid var(--bo-accent); border-radius: 8px;
    background: var(--bo-surface); white-space: normal;
}
.bo-rpt .bo-wallets__head { display: flex; align-items: center; gap: 6.4px; margin-bottom: 8px; }
.bo-rpt .bo-wallets__title { font-size: 9.2px; font-weight: 700; letter-spacing: .05em; text-transform: uppercase; color: var(--bo-accent); }
.bo-rpt .bo-wallets__empty { font-size: 10.4px; color: var(--bo-ink-3); padding: 4.8px 0; }
.bo-rpt .bo-wallets__table { width: 100%; border-collapse: separate; border-spacing: 0; font-size: 10.4px; }
.bo-rpt .bo-wallets__table th {
    padding: 6.4px 9.6px; background: var(--bo-surface-2); border-bottom: 1px solid var(--bo-line);
    font-size: 8.8px; font-weight: 700; letter-spacing: .04em; text-transform: uppercase; color: var(--bo-ink-2); text-align: left; white-space: nowrap;
}
.bo-rpt .bo-wallets__table td { padding: 7.2px 9.6px; border-bottom: 1px solid var(--bo-line); vertical-align: middle; color: var(--bo-ink); }
.bo-rpt .bo-wallets__table tr:last-child td { border-bottom: 0; }
.bo-rpt .bo-wallets__table .r { text-align: right; }
.bo-rpt .bo-wallets__remark { max-width: 288px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }

/* wallet transactions dialog */
.bo-wtx .bo-filters { margin-bottom: 11.2px; }
.bo-rpt .bo-f-grid--wtx { grid-template-columns: repeat(auto-fill, minmax(160px, 1fr)); }
.bo-rpt .bo-f-grid--wtx > .bo-f-date { grid-column: span 2; }
.bo-rpt .bo-rgrid--wtx .rz-grid-table { min-width: 720px; }
.bo-rpt .bo-rgrid--wtx .rz-grid-table td .rz-cell-data { white-space: normal !important; }
.bo-rpt .bo-rgrid--wtx .bo-l1, .bo-rpt .bo-rgrid--wtx .bo-l2 { white-space: nowrap; }
.bo-rpt .bo-remark {
    display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 2; overflow: hidden;
    font-size: 10px; line-height: 1.4; color: var(--bo-ink-2);
}
.bo-rpt .transaction-type { border-radius: 999px !important; padding: 2.4px 8px !important; font-size: 9.6px; font-weight: 650 !important; white-space: nowrap; }

@media (max-width: 767.98px) {
    .bo-rpt .bo-f-grid--wtx > .bo-f-date { grid-column: 1 / -1; }
    .bo-rpt .bo-actions { justify-content: flex-end; }
    /* wallets become small cards too */
    .bo-rpt .bo-wallets { padding: 9.6px; }
    .bo-rpt .bo-wallets__table, .bo-rpt .bo-wallets__table tbody { display: block; }
    .bo-rpt .bo-wallets__table thead { display: none; }
    .bo-rpt .bo-wallets__table tr { display: block; padding: 4.8px 0; border-bottom: 1px solid var(--bo-line); }
    .bo-rpt .bo-wallets__table tr:last-child { border-bottom: 0; }
    .bo-rpt .bo-wallets__table td { display: flex; justify-content: space-between; align-items: center; gap: 9.6px; padding: 3.2px 0; border: 0; text-align: right; }
    .bo-rpt .bo-wallets__table td[data-label]::before {
        content: attr(data-label); font-size: 8.8px; font-weight: 700; letter-spacing: .04em; text-transform: uppercase; color: var(--bo-ink-3); text-align: left;
    }
    .bo-rpt .bo-wallets__remark { max-width: none; white-space: normal; }
    .bo-rpt .bo-wallets__act { justify-content: flex-end !important; }
    .bo-rpt .bo-rgrid .rz-grid-table > tbody > tr:has(.bo-wallets) { margin-top: -4.8px; padding: 0; border: 0; background: transparent; }
    .bo-rpt .bo-rgrid .rz-grid-table > tbody > tr:has(.bo-wallets) > td { display: block !important; padding: 0 !important; }
    .bo-rpt .bo-rgrid .rz-grid-table > tbody > tr:has(.bo-wallets) > td::before { display: none !important; }
}

/* =====================================================================
   Activity Log
   ===================================================================== */
.bo-rpt .bo-rgrid--alog .rz-grid-table { min-width: 944px; }
.bo-rpt .bo-pill--info { background: var(--bo-accent-soft); color: var(--bo-accent); }
.bo-rpt .bo-alog-act { display: flex; align-items: center; gap: 8px; min-width: 0; }
.bo-rpt .bo-alog-act__txt { display: flex; flex-direction: column; min-width: 0; }
.bo-rpt .bo-rgrid .bo-alog-type { flex: none; min-width: 49.6px; padding: 2px 6.4px; font-size: 8.8px; text-align: center; }

/* expanded detail under a log row */
.bo-rpt .bo-alog-detail {
    margin: 3.2px 0 8px; padding: 11.2px 12.8px 9.6px;
    border: 1px solid var(--bo-line); border-left: 2.4px solid var(--bo-accent); border-radius: 8px;
    background: var(--bo-surface); white-space: normal; color: var(--bo-ink);
}
.bo-rpt .bo-alog-detail__head { display: flex; align-items: center; gap: 6.4px; margin-bottom: 8px; }
.bo-rpt .bo-alog-detail__title { font-size: 9.2px; font-weight: 700; letter-spacing: .05em; text-transform: uppercase; color: var(--bo-accent); }
.bo-rpt .bo-alog-detail__empty { font-size: 10.4px; color: var(--bo-ink-3); padding: 3.2px 0 4.8px; }
.bo-rpt .bo-alog-err {
    display: flex; align-items: flex-start; gap: 6.4px; margin-bottom: 9.6px; padding: 7.2px 9.6px;
    border-radius: 6.4px; background: rgba(192, 57, 43, .07); color: var(--bo-neg); font-size: 10.4px;
}
.bo-rpt .bo-alog-err svg { width: 12.8px; height: 12.8px; flex: none; margin-top: 1px; }
.bo-rpt .bo-alog-err b { margin-right: 3.2px; }

.bo-rpt .bo-alog-table { width: 100%; border-collapse: separate; border-spacing: 0; font-size: 10.4px; table-layout: fixed; }
.bo-rpt .bo-alog-table th {
    padding: 6.4px 9.6px; background: var(--bo-surface-2); border-bottom: 1px solid var(--bo-line);
    font-size: 8.8px; font-weight: 700; letter-spacing: .04em; text-transform: uppercase; color: var(--bo-ink-2); text-align: left; white-space: nowrap;
}
.bo-rpt .bo-alog-table th:first-child { width: 176px; }
/* white-space: Radzen's ".rz-grid-table td { nowrap }" also matches this nested table, which kept long values on one line */
.bo-rpt .bo-alog-table td { padding: 6.4px 9.6px; border-bottom: 1px solid var(--bo-line); vertical-align: top; color: var(--bo-ink); white-space: normal; overflow-wrap: anywhere; }
.bo-rpt .bo-alog-table tr:last-child td { border-bottom: 0; }
.bo-rpt .bo-alog-table__field { font-weight: 600; color: var(--bo-ink-2); }
.bo-rpt .bo-alog-val {
    display: inline-block; max-width: 100%; padding: 2px 6.4px; border-radius: 4.8px;
    font-variant-numeric: tabular-nums; overflow-wrap: anywhere; line-height: 1.45;
}
.bo-rpt .bo-alog-val--old { background: rgba(192, 57, 43, .07); }
.bo-rpt .bo-alog-val--new { background: var(--bo-pos-soft); }
.bo-rpt .bo-alog-val.is-masked { background: var(--bo-surface-2); color: var(--bo-ink-3); font-style: italic; }
.bo-rpt .bo-alog-note { margin-top: 3.2px; padding-left: 2px; font-size: 9.6px; color: var(--bo-ink-3); overflow-wrap: anywhere; }

.bo-rpt .bo-alog-meta {
    display: grid; grid-template-columns: repeat(auto-fill, minmax(168px, 1fr)); gap: 8px 16px;
    margin: 11.2px 0 0; padding-top: 9.6px; border-top: 1px dashed var(--bo-line-strong);
}
.bo-rpt .bo-alog-meta > div { min-width: 0; }
.bo-rpt .bo-alog-meta__wide { grid-column: 1 / -1; }
.bo-rpt .bo-alog-meta dt { margin: 0 0 2px; font-size: 8.8px; font-weight: 700; letter-spacing: .04em; text-transform: uppercase; color: var(--bo-ink-3); }
.bo-rpt .bo-alog-meta dd { margin: 0; font-size: 10px; color: var(--bo-ink); overflow-wrap: anywhere; }
.bo-rpt .bo-alog-meta .bo-muted { color: var(--bo-ink-3); }

@media (max-width: 767.98px) {
    /* the action reads as the card title, so lift it above the time */
    .bo-rpt .bo-rgrid--alog .rz-grid-table > tbody > tr.rz-data-row { display: flex; flex-direction: column; }
    .bo-rpt .bo-rgrid--alog .rz-grid-table > tbody > tr.rz-data-row > td.bo-c-title { order: -1; }
    .bo-rpt .bo-rgrid--alog .rz-grid-table > tbody > tr.rz-data-row > td.bo-c-title .rz-cell-data { flex-direction: row !important; }
    .bo-rpt .bo-alog-act { flex-wrap: wrap; }

    /* detail panel sits under its card, change rows become small cards too */
    .bo-rpt .bo-rgrid .rz-grid-table > tbody > tr:has(.bo-alog-detail) { margin-top: -4.8px; padding: 0; border: 0; background: transparent; }
    .bo-rpt .bo-rgrid .rz-grid-table > tbody > tr:has(.bo-alog-detail) > td { display: block !important; padding: 0 !important; }
    .bo-rpt .bo-rgrid .rz-grid-table > tbody > tr:has(.bo-alog-detail) > td::before { display: none !important; }
    .bo-rpt .bo-alog-detail { padding: 9.6px; text-align: left; }
    .bo-rpt .bo-alog-table, .bo-rpt .bo-alog-table tbody { display: block; }
    .bo-rpt .bo-alog-table thead { display: none; }
    .bo-rpt .bo-alog-table tr { display: block; padding: 4.8px 0; border-bottom: 1px solid var(--bo-line); }
    .bo-rpt .bo-alog-table tr:last-child { border-bottom: 0; }
    .bo-rpt .bo-alog-table td { display: flex; justify-content: space-between; align-items: flex-start; gap: 9.6px; padding: 3.2px 0; border: 0; text-align: right; }
    .bo-rpt .bo-alog-table td[data-label]::before {
        content: attr(data-label); flex: none; font-size: 8.8px; font-weight: 700; letter-spacing: .04em; text-transform: uppercase; color: var(--bo-ink-3); text-align: left;
    }
    /* the field name heads each change instead of being a "Field" label/value pair */
    .bo-rpt .bo-alog-table td.bo-alog-table__field { justify-content: flex-start; text-align: left; padding-bottom: 2px; font-weight: 650; color: var(--bo-ink); }
    .bo-rpt .bo-alog-table td.bo-alog-table__field::before { display: none; }
    .bo-rpt .bo-alog-meta { grid-template-columns: 1fr; }
}
