@import '_content/Blazored.Toast/Blazored.Toast.bundle.scp.css';
@import '_content/Microsoft.AspNetCore.Components.QuickGrid/Microsoft.AspNetCore.Components.QuickGrid.bundle.scp.css';
@import '_content/PSC.Blazor.Components.Chartjs/PSC.Blazor.Components.Chartjs.bundle.scp.css';

/* /Layout/Components/Accounts/FundSelect.razor.rz.scp.css */
/* Fund picker: a text box that filters, with the funds grouped underneath.
   Rides the app-wide grayscale tokens so dark mode follows. */

.fund-select[b-9w7y5jicxc] {
    position: relative;
}

.fund-select .form-control[b-9w7y5jicxc] {
    padding-right: 2rem;
}

.fund-select-clear[b-9w7y5jicxc] {
    position: absolute;
    top: 50%;
    right: 0.4rem;
    transform: translateY(-50%);
    border: 0;
    background: transparent;
    color: var(--text-subtle, #9ca3af);
    font-size: 0.75rem;
    line-height: 1;
    padding: 0.25rem;
    cursor: pointer;
}

.fund-select-clear:hover[b-9w7y5jicxc] {
    color: var(--text-primary, #111827);
}

/* Positioned from script (wwwroot/js/fundSelect.js) in viewport coordinates so
   a scrolling ancestor — the statement entry table, a modal body — cannot clip
   it. The values here are only the fallback before that first call lands. */
.fund-select-menu[b-9w7y5jicxc] {
    position: absolute;
    z-index: 1060;
    top: calc(100% + 4px);
    left: 0;
    right: 0;
    max-height: 280px;
    overflow-y: auto;
    background: var(--content-bg, #fff);
    border: 1px solid var(--border-default, #e4e6ea);
    border-radius: 10px;
    box-shadow: var(--shadow-lift, 0 2px 4px rgba(17, 24, 39, .05), 0 10px 24px -6px rgba(17, 24, 39, .09));
    padding: 4px;
}

/* The group heading is a divider, not an option — it must not look clickable. */
.fund-select-group[b-9w7y5jicxc] {
    font-size: 0.72rem;
    font-weight: 600;
    color: var(--text-subtle, #9ca3af);
    padding: 8px 10px 4px;
}

.fund-select-group:not(:first-child)[b-9w7y5jicxc] {
    border-top: 1px solid var(--border-default, #e4e6ea);
    margin-top: 4px;
}

.fund-select-option[b-9w7y5jicxc] {
    display: flex;
    align-items: baseline;
    justify-content: space-between;
    gap: 12px;
    width: 100%;
    text-align: left;
    border: 0;
    background: transparent;
    color: var(--text-primary, #111827);
    font-size: 0.86rem;
    padding: 6px 10px;
    border-radius: 7px;
    cursor: pointer;
}

.fund-select-option:hover[b-9w7y5jicxc],
.fund-select-option.is-active[b-9w7y5jicxc] {
    background: var(--hover-bg, #f3f4f6);
}

.fund-select-option.is-selected[b-9w7y5jicxc] {
    font-weight: 600;
}

/* The row is a flex container, so the tick is a flex item rather than a float. */
.fund-select-option.is-selected .fund-select-name[b-9w7y5jicxc]::after {
    content: "\2713";
    margin-left: 8px;
    color: var(--bs-primary);
}

.fund-select-name[b-9w7y5jicxc] {
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
}

.fund-select-balance[b-9w7y5jicxc] {
    flex: 0 0 auto;
    font-size: 0.78rem;
    color: var(--text-muted, #6b7280);
    font-variant-numeric: tabular-nums;
}

.fund-select-empty[b-9w7y5jicxc] {
    padding: 10px;
    font-size: 0.84rem;
    color: var(--text-muted, #6b7280);
    text-align: center;
}
/* /Layout/Components/Navigation/NavItem.razor.rz.scp.css */
[b-3pwpny7zk0] .nav-item-modern.active {
    background-color: var(--content-bg);
    color: var(--text-primary);
    box-shadow: var(--shadow-nav-active);
}

[b-3pwpny7zk0] .nav-item-modern.active span:first-child {
    color: var(--text-primary);
}
/* /Layout/Components/Navigation/NavSection.razor.rz.scp.css */
.nav-section-chevron[b-0usky8tr0c] {
    font-size: 0.6rem;
    transition: transform 0.15s ease;
}

.nav-section-chevron.expanded[b-0usky8tr0c] {
    transform: rotate(90deg);
}

button:hover .community-nav-icon[b-0usky8tr0c] {
    color: #2563eb;
}
/* /Layout/Components/Navigation/NavWorkspaceTree.razor.rz.scp.css */
[b-pseqdtbvyk] .nav-ws-link.active {
    background-color: var(--content-bg);
    color: var(--text-primary);
    box-shadow: var(--shadow-nav-active);
}
/* /Layout/Components/Timesheet/TimeEntriesGrid.razor.rz.scp.css */
/* Shrink fixed-content columns to their content width so the flexible
   columns (Member, Flow, Notes) get the remaining horizontal space. */
.time-entries-table .shrink-col[b-7nmq8chd2i] {
    width: 1%;
    white-space: nowrap;
}

/* Each side of the From -> To flow truncates independently so a long fund
   name doesn't push the arrow out of the cell. */
.time-entries-table .flow-fund[b-7nmq8chd2i] {
    max-width: 110px;
}

.time-entries-table .flow-arrow[b-7nmq8chd2i] {
    font-size: 0.7rem;
}

/* Notes column gets more room since prose is wordier than a label. */
.time-entries-table .notes-cell[b-7nmq8chd2i] {
    max-width: 240px;
}
/* /Layout/Components/Transactions/TransactionGridComponent.razor.rz.scp.css */
/* Custom styles for focus state */
.filter-btn:focus[b-zbtcaowbg0] {
    outline: none;
    box-shadow: none;
}

.profile-img[b-zbtcaowbg0] {
    width: 24px;
    height: 24px;
    border-radius: 50%;
    margin-right: 8px; /* Add margin between the image and the name */
}

.offset-approved-positive[b-zbtcaowbg0] {
    color: green;
    font-size: larger;
}

.offset-approved-negative[b-zbtcaowbg0] {
    color: red;
    font-size: larger;
}

.offset-pending[b-zbtcaowbg0] {
    color: grey;
    font-size: larger;
}

.offset-rejected[b-zbtcaowbg0] {
    color: grey;
    font-size: larger;
    text-decoration: line-through;
}

.balance[b-zbtcaowbg0] {
    color: grey;
    font-size: small;
}

.item-img[b-zbtcaowbg0] {
    width: 32px;
    height: 32px;
    margin-right: 8px;
    border-radius: 4px;
    object-fit: cover;
}

.item-info[b-zbtcaowbg0] {
    display: flex;
    align-items: center;
}
/* /Layout/Example.razor.rz.scp.css */
.test[b-v9txxzpnkd] {
    color: brown;
    font-family: Tahoma, Geneva, Verdana, sans-serif;
}

p[b-v9txxzpnkd] {
    color: darkgreen;
}
/* /Layout/MainLayout.razor.rz.scp.css */

.page[b-e24iz81u04] {
    position: relative;
    display: flex;
    flex-direction: column;
}

main[b-e24iz81u04] {
    flex: 1;
    background-color: var(--page-bg);
    /* Above 641px .page is flex-direction:row, so main is a flex item on the horizontal axis
       and its min-width defaults to auto - the min-content width of everything inside it. A
       canvas contributes its own pixel width there, so a chart that had grown wide pinned main
       open: the content never got narrower, so Chart.js's ResizeObserver never fired, so the
       canvas never shrank, and the page scrolled sideways instead. Charts could grow but never
       shrink, which is what made zooming in cut the expense-overview chart off on the right. */
    min-width: 0;
}

.sidebar[b-e24iz81u04] {
    background-color: var(--sidebar-bg);
    border-right: 1px solid var(--sidebar-border);
}

.top-row[b-e24iz81u04] {
    background-color: var(--content-bg);
    border-bottom: 1px solid var(--border-default);
    justify-content: flex-end;
    height: 3.5rem;
    display: flex;
    align-items: center;
}

    .top-row[b-e24iz81u04]  a, .top-row[b-e24iz81u04]  .btn-link {
        white-space: nowrap;
        margin-left: 1.5rem;
        text-decoration: none;
    }

    .top-row[b-e24iz81u04]  a:hover, .top-row[b-e24iz81u04]  .btn-link:hover {
        text-decoration: underline;
    }

    .top-row[b-e24iz81u04]  a:first-child {
        overflow: hidden;
        text-overflow: ellipsis;
    }

@media (max-width: 640.98px) {
    .top-row[b-e24iz81u04] {
        justify-content: space-between;
    }

    .top-row[b-e24iz81u04]  a, .top-row[b-e24iz81u04]  .btn-link {
        margin-left: 0;
    }
}

@media (min-width: 641px) {
    .page[b-e24iz81u04] {
        flex-direction: row;
    }

    .sidebar[b-e24iz81u04] {
        width: 248px;
        height: 100vh;
        position: sticky;
        top: 0;
    }

    .top-row[b-e24iz81u04] {
        position: sticky;
        top: 0;
        z-index: 1;
    }

    .top-row.auth[b-e24iz81u04]  a:first-child {
        flex: 1;
        text-align: right;
        width: 0;
    }

    /* 1rem here + the page containers' own 12px gutter = the mockup's 28px
       content inset; the topbar's 18px inset is set on the TopBar itself. */
    .top-row[b-e24iz81u04], article[b-e24iz81u04] {
        padding-left: 1rem !important;
        padding-right: 1rem !important;
    }
}
/* /Layout/NavMenu.razor.rz.scp.css */
.navbar-toggler[b-couvei31v4] {
    background-color: var(--hover-bg);
    border: 1px solid var(--border-default);
}

.top-row[b-couvei31v4] {
    height: 3.5rem;
    background-color: var(--sidebar-bg);
    border-bottom: 1px solid var(--border-default);
}

.navbar-brand[b-couvei31v4] {
    font-size: 1.1rem;
}

.bi[b-couvei31v4] {
    display: inline-block;
    position: relative;
    width: 1.25rem;
    height: 1.25rem;
    margin-right: 0.75rem;
    top: -1px;
    background-size: cover;
}

.bi-house-door-fill-nav-menu[b-couvei31v4] {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='white' class='bi bi-house-door-fill' viewBox='0 0 16 16'%3E%3Cpath d='M6.5 14.5v-3.505c0-.245.25-.495.5-.495h2c.25 0 .5.25.5.5v3.5a.5.5 0 0 0 .5.5h4a.5.5 0 0 0 .5-.5v-7a.5.5 0 0 0-.146-.354L13 5.793V2.5a.5.5 0 0 0-.5-.5h-1a.5.5 0 0 0-.5.5v1.293L8.354 1.146a.5.5 0 0 0-.708 0l-6 6A.5.5 0 0 0 1.5 7.5v7a.5.5 0 0 0 .5.5h4a.5.5 0 0 0 .5-.5Z'/%3E%3C/svg%3E");
}

.bi-plus-square-fill-nav-menu[b-couvei31v4] {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='white' class='bi bi-plus-square-fill' viewBox='0 0 16 16'%3E%3Cpath d='M2 0a2 2 0 0 0-2 2v12a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2V2a2 2 0 0 0-2-2H2zm6.5 4.5v3h3a.5.5 0 0 1 0 1h-3v3a.5.5 0 0 1-1 0v-3h-3a.5.5 0 0 1 0-1h3v-3a.5.5 0 0 1 1 0z'/%3E%3C/svg%3E");
}

.bi-list-nested-nav-menu[b-couvei31v4] {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='white' class='bi bi-list-nested' viewBox='0 0 16 16'%3E%3Cpath fill-rule='evenodd' d='M4.5 11.5A.5.5 0 0 1 5 11h10a.5.5 0 0 1 0 1H5a.5.5 0 0 1-.5-.5zm-2-4A.5.5 0 0 1 3 7h10a.5.5 0 0 1 0 1H3a.5.5 0 0 1-.5-.5zm-2-4A.5.5 0 0 1 1 3h10a.5.5 0 0 1 0 1H1a.5.5 0 0 1-.5-.5z'/%3E%3C/svg%3E");
}

.nav-item[b-couvei31v4] {
    font-size: 0.9rem;
    padding-bottom: 0.5rem;
}

    .nav-item:first-of-type[b-couvei31v4] {
        padding-top: 1rem;
    }

    .nav-item:last-of-type[b-couvei31v4] {
        padding-bottom: 1rem;
    }

    .nav-item[b-couvei31v4]  a {
        color: var(--text-secondary);
        border-radius: 4px;
        height: 3rem;
        display: flex;
        align-items: center;
        line-height: 3rem;
    }

.nav-item[b-couvei31v4]  a.active {
    background-color: var(--active-bg);
    color: var(--text-primary);
    font-weight: 600;
    border-left: 3px solid var(--active-border);
    margin-left: -3px;
}

.nav-item[b-couvei31v4]  a:hover {
    background-color: var(--hover-bg);
    color: var(--text-primary);
}

@media (min-width: 641px) {
    .navbar-toggler[b-couvei31v4] {
        display: none;
    }

    .collapse[b-couvei31v4] {
        /* Never collapse the sidebar for wide screens */
        display: block;
    }
    
    .nav-scrollable[b-couvei31v4] {
        /* Fixed height, no scroll - child elements handle scrolling */
        height: 100vh;
        overflow: hidden;
    }
}
/* /Pages/Accounts/AccountView.razor.rz.scp.css */
.statement-table-wrap[b-ll24oeakls] {
    max-height: calc(100vh - 280px);
    overflow: auto;
    border: 1px solid #dee2e6;
    border-radius: 8px;
}

.statement-table-wrap table[b-ll24oeakls] {
    margin-bottom: 0;
}

.statement-table-wrap thead[b-ll24oeakls] {
    position: sticky;
    top: 0;
    z-index: 2;
}

.statement-table-wrap th[b-ll24oeakls] {
    white-space: nowrap;
}

.statement-cell-text[b-ll24oeakls] {
    white-space: normal;
    overflow-wrap: anywhere;
    line-height: 1.25;
}

.statement-table-wrap td[b-ll24oeakls] {
    vertical-align: top;
}

.statement-table-wrap .badge[b-ll24oeakls] {
    white-space: normal;
}

.statement-table-wrap .form-select[b-ll24oeakls],
.statement-table-wrap .form-control[b-ll24oeakls] {
    min-width: 0;
}

.statement-table-wrap select.form-select[b-ll24oeakls] {
    text-overflow: ellipsis;
}

.statement-table-wrap .btn-sm[b-ll24oeakls] {
    white-space: nowrap;
}

.statement-edit-cell[b-ll24oeakls] {
    display: flex;
    align-items: flex-start;
    gap: 4px;
    min-width: 0;
}

.statement-edit-cell-end[b-ll24oeakls] {
    align-items: center;
    justify-content: flex-end;
}

.statement-cell-edit-button[b-ll24oeakls] {
    flex: 0 0 auto;
    padding-left: 6px;
    padding-right: 6px;
}

.statement-amount-editor[b-ll24oeakls] {
    min-width: 96px;
    max-width: 132px;
}

.statement-amount-editor .form-control[b-ll24oeakls] {
    min-width: 0;
}

@media (max-width: 767.98px) {
    .statement-table-wrap[b-ll24oeakls] {
        max-height: none;
    }
}
/* /Pages/Admin/FundManagement.razor.rz.scp.css */
/* Fund management — the balances chart stays put at the top and only the panel
   under the tab strip changes. Rides the app-wide grayscale tokens (see
   wwwroot/css/app.css) so it follows dark mode; the leak colours are spelled out
   because they also appear inline on the segment bars. */

.fund-top[b-jzuypyqppe] {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    gap: 28px;
    margin-bottom: 18px;
}

.fund-h1[b-jzuypyqppe] {
    font-size: 1.6rem;
    font-weight: 600;
    letter-spacing: -0.025em;
    margin: 0;
    color: var(--text-primary, #111827);
}

.fund-sub[b-jzuypyqppe] {
    font-size: 0.85rem;
    color: var(--text-secondary, #374151);
    margin: 0.45rem 0 0;
    max-width: 72ch;
    line-height: 1.5;
}

/* Tag filter, inline in the header instead of its own card. */
.fund-tools[b-jzuypyqppe] {
    display: flex;
    align-items: center;
    gap: 6px;
    flex-wrap: wrap;
    justify-content: flex-end;
    max-width: 760px;
}

.fund-tools-label[b-jzuypyqppe] {
    font-size: 0.78rem;
    color: var(--text-muted, #6b7280);
    margin-right: 2px;
}

.fund-tag[b-jzuypyqppe] {
    font: inherit;
    font-size: 0.78rem;
    font-weight: 500;
    background: var(--content-bg, #fff);
    border: 1px solid var(--border-default, #d7dbe0);
    color: var(--text-secondary, #374151);
    padding: 3px 10px;
    border-radius: 6px;
    cursor: pointer;
    white-space: nowrap;
}

.fund-tag.on[b-jzuypyqppe] {
    background: var(--text-primary, #111827);
    border-color: var(--text-primary, #111827);
    color: #fff;
    font-weight: 600;
}

.fund-default-view[b-jzuypyqppe] {
    font-size: 0.78rem;
    color: #1d7355;
    white-space: nowrap;
}

.fund-chart-note[b-jzuypyqppe] {
    font-size: 0.8rem;
    color: var(--text-secondary, #374151);
    white-space: nowrap;
}

.fund-chart-hidden[b-jzuypyqppe] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
    padding: 12px 18px;
    border: 1px solid var(--border-default, #e4e6ea);
    border-radius: 10px;
    background: var(--content-bg, #fff);
    font-size: 0.85rem;
    color: var(--text-muted, #6b7280);
}

/* Tab strip. The underline, not a pill, so the chart above keeps the weight. */
.fund-tabs[b-jzuypyqppe] {
    display: flex;
    align-items: flex-end;
    gap: 2px;
    margin-top: 20px;
    border-bottom: 2px solid var(--border-default, #d7dbe0);
    overflow-x: auto;
}

.fund-tab[b-jzuypyqppe] {
    font: inherit;
    font-size: 0.9rem;
    font-weight: 500;
    background: transparent;
    border: 0;
    color: var(--text-secondary, #374151);
    padding: 10px 18px 11px;
    cursor: pointer;
    border-bottom: 2px solid transparent;
    margin-bottom: -2px;
    white-space: nowrap;
}

.fund-tab b[b-jzuypyqppe] {
    font-weight: 500;
    color: var(--text-muted, #6b7280);
    margin-left: 7px;
    font-size: 0.8rem;
}

.fund-tab.on[b-jzuypyqppe] {
    color: var(--text-primary, #111827);
    font-weight: 700;
    border-bottom-color: var(--text-primary, #111827);
}

.fund-tab.on b[b-jzuypyqppe] {
    color: var(--text-secondary, #374151);
}

.fund-tab.alert b[b-jzuypyqppe] {
    color: #cc4860;
    font-weight: 700;
}

.fund-panel[b-jzuypyqppe] {
    background: var(--content-bg, #fff);
    border: 1px solid var(--border-default, #e4e6ea);
    border-top: 0;
    border-radius: 0 0 10px 10px;
    overflow: hidden;
}

.fund-empty[b-jzuypyqppe] {
    padding: 28px 22px;
    margin: 0;
    text-align: center;
    color: var(--text-muted, #6b7280);
}

/* One strip at the bottom of a panel: quick create on the left, pointers right. */
/* The create form and the bank-accounts notice used to share one row. With
   four fields competing for what was left of the width they wrapped into a
   narrow column, one squeezed input per line. They get a row each now. */
.fund-panel-foot[b-jzuypyqppe] {
    display: flex;
    flex-direction: column;
    align-items: stretch;
    gap: 14px;
    padding: 16px 22px;
    border-top: 1px solid var(--border-default, #e4e6ea);
    font-size: 0.82rem;
    color: var(--text-secondary, #374151);
}

.fund-quick-create[b-jzuypyqppe] {
    display: grid;
    grid-template-columns: minmax(150px, 1fr) minmax(200px, 2fr) 140px 140px auto;
    gap: 8px;
    align-items: center;
}

.fund-quick-create .form-control[b-jzuypyqppe] {
    width: 100%;
    min-width: 0;
}

.fund-foot-label[b-jzuypyqppe] {
    grid-column: 1 / -1;
    font-weight: 600;
    white-space: nowrap;
    color: var(--text-primary, #111827);
}

/* A pointer to another page, not an action of this panel — so it reads as a
   footnote under the form rather than a second column beside it. */
.fund-foot-right[b-jzuypyqppe] {
    display: flex;
    align-items: center;
    gap: 10px;
    padding-top: 12px;
    border-top: 1px solid var(--border-default, #e4e6ea);
    color: var(--text-muted, #6b7280);
}

@media (max-width: 1100px) {
    .fund-quick-create[b-jzuypyqppe] {
        grid-template-columns: 1fr 1fr;
    }

    .fund-quick-create button[type="submit"][b-jzuypyqppe] {
        grid-column: 1 / -1;
        justify-self: start;
    }
}

@media (max-width: 600px) {
    .fund-quick-create[b-jzuypyqppe] {
        grid-template-columns: 1fr;
    }

    .fund-foot-right[b-jzuypyqppe] {
        flex-wrap: wrap;
    }
}

/* Fund table */
.fund-table[b-jzuypyqppe] {
    margin-bottom: 0;
}

.fund-table > :not(caption) > * > *[b-jzuypyqppe] {
    padding: 0.6rem 1.35rem;
    vertical-align: middle;
}

.fund-swatch[b-jzuypyqppe] {
    display: inline-block;
    width: 4px;
    height: 30px;
    border-radius: 2px;
    margin-right: 12px;
    vertical-align: middle;
    background: linear-gradient(to top, #4bc0c0, #36a2a2);
}

.fund-swatch.neg[b-jzuypyqppe] {
    background: linear-gradient(to bottom, #ff6384, #e63f5f);
}

.fund-swatch.arq[b-jzuypyqppe] {
    background: var(--border-default, #d7dbe0);
}

.fund-name[b-jzuypyqppe] {
    font-weight: 600;
    color: var(--text-primary, #111827);
}

.fund-desc[b-jzuypyqppe] {
    font-size: 0.78rem;
    color: var(--text-muted, #6b7280);
    margin-top: 1px;
}

.fund-chip[b-jzuypyqppe] {
    border: 1px solid var(--border-default, #d7dbe0);
    border-radius: 4px;
    padding: 1px 7px;
    font-size: 0.74rem;
    color: var(--text-secondary, #374151);
    white-space: nowrap;
}

.fund-chip.reserve[b-jzuypyqppe] {
    border-color: #cc4860;
    color: #cc4860;
    font-weight: 600;
}

.fund-chip.overdraft[b-jzuypyqppe] {
    border-color: #c8a84f;
    color: #8c6410;
    font-weight: 600;
}

.fund-amount[b-jzuypyqppe] {
    font-size: 0.98rem;
    font-weight: 700;
    letter-spacing: -0.02em;
    white-space: nowrap;
}

.fund-amount.neg[b-jzuypyqppe] {
    color: #cc4860;
}

.fund-actions[b-jzuypyqppe] {
    display: flex;
    gap: 6px;
    justify-content: flex-end;
}

/* Leaks panel */
.fund-leaks[b-jzuypyqppe],
.fund-perms[b-jzuypyqppe],
.fund-cats[b-jzuypyqppe],
.fund-transfers[b-jzuypyqppe] {
    padding: 18px 22px 10px;
}

.fund-leaks-help[b-jzuypyqppe] {
    font-size: 0.82rem;
    color: var(--text-secondary, #374151);
    max-width: 94ch;
    line-height: 1.55;
    margin-bottom: 16px;
}

.leak-row[b-jzuypyqppe] {
    padding: 12px 0;
    border-bottom: 1px solid var(--border-default, #e4e6ea);
}

.leak-row:last-child[b-jzuypyqppe] {
    border-bottom: 0;
}

.leak-head[b-jzuypyqppe] {
    display: flex;
    align-items: baseline;
    justify-content: space-between;
    gap: 16px;
    margin-bottom: 6px;
}

.leak-name[b-jzuypyqppe] {
    font-size: 0.95rem;
    font-weight: 600;
    letter-spacing: -0.01em;
    color: var(--text-primary, #111827);
}

.leak-name span[b-jzuypyqppe] {
    font-weight: 400;
    color: var(--text-muted, #6b7280);
    font-size: 0.78rem;
    margin-left: 9px;
}

.leak-total[b-jzuypyqppe] {
    font-size: 1rem;
    font-weight: 700;
    color: #cc4860;
    letter-spacing: -0.025em;
    white-space: nowrap;
}

.leak-track[b-jzuypyqppe] {
    height: 12px;
    background: var(--border-default, #e4e6ea);
    border-radius: 6px;
    overflow: hidden;
    display: flex;
    gap: 2px;
}

.leak-seg[b-jzuypyqppe] {
    height: 100%;
}

.leak-seg.rest[b-jzuypyqppe] {
    background: transparent;
}

.leak-providers[b-jzuypyqppe] {
    display: flex;
    align-items: center;
    gap: 16px;
    margin-top: 7px;
    flex-wrap: wrap;
}

.leak-provider[b-jzuypyqppe] {
    font: inherit;
    font-size: 0.78rem;
    background: none;
    border: 0;
    padding: 0;
    cursor: pointer;
    color: var(--text-secondary, #374151);
    display: inline-flex;
    align-items: center;
    gap: 6px;
}

.leak-provider:hover[b-jzuypyqppe] {
    text-decoration: underline;
}

.leak-provider i[b-jzuypyqppe] {
    width: 9px;
    height: 9px;
    border-radius: 2px;
    display: inline-block;
}

.leak-provider b[b-jzuypyqppe] {
    font-weight: 600;
}

.leak-foot[b-jzuypyqppe] {
    margin-top: 7px;
    display: flex;
    align-items: center;
    gap: 10px;
    font-size: 0.78rem;
    color: var(--text-muted, #6b7280);
}

/* Permissions panel */
.perm-picker[b-jzuypyqppe] {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(280px, 1fr));
    gap: 8px;
}

.perm-pick[b-jzuypyqppe] {
    font: inherit;
    text-align: left;
    background: var(--content-bg, #fff);
    border: 1px solid var(--border-default, #e4e6ea);
    border-radius: 9px;
    padding: 10px 13px;
    cursor: pointer;
    display: flex;
    flex-direction: column;
    gap: 6px;
}

.perm-pick:hover[b-jzuypyqppe] {
    border-color: var(--text-muted, #9aa2ac);
}

.perm-pick-name[b-jzuypyqppe] {
    font-size: 0.9rem;
    font-weight: 600;
    color: var(--text-primary, #111827);
}

.perm-pick-meta[b-jzuypyqppe] {
    display: flex;
    gap: 6px;
    flex-wrap: wrap;
}

.perm-head[b-jzuypyqppe] {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 20px;
    margin-bottom: 14px;
}

.perm-fund[b-jzuypyqppe] {
    font-size: 1.25rem;
    font-weight: 700;
    letter-spacing: -0.03em;
    color: var(--text-primary, #111827);
}

.perm-fund-sub[b-jzuypyqppe] {
    font-size: 0.82rem;
    color: var(--text-muted, #6b7280);
    margin-top: 2px;
}

.perm-public[b-jzuypyqppe] {
    border: 1px solid var(--border-default, #e4e6ea);
    border-radius: 9px;
    padding: 11px 13px;
    margin-bottom: 12px;
}

.perm-public-help[b-jzuypyqppe] {
    font-size: 0.75rem;
    color: var(--text-muted, #6b7280);
    line-height: 1.45;
}

.perm-add[b-jzuypyqppe] {
    display: flex;
    align-items: center;
    gap: 8px;
    margin-bottom: 14px;
}

.perm-add .form-select[b-jzuypyqppe] {
    width: 160px;
    flex: none;
}

.perm-dropdown[b-jzuypyqppe] {
    position: absolute;
    z-index: 20;
    width: 100%;
    margin-top: 2px;
    max-height: 240px;
    overflow-y: auto;
}

.perm-table[b-jzuypyqppe] {
    margin-bottom: 0;
}

.perm-granted[b-jzuypyqppe] {
    font-size: 0.8rem;
    color: var(--text-muted, #6b7280);
}

@media (max-width: 900px) {
    .fund-top[b-jzuypyqppe] {
        flex-direction: column;
    }

    .fund-tools[b-jzuypyqppe] {
        justify-content: flex-start;
        max-width: none;
    }

    .perm-add[b-jzuypyqppe] {
        flex-wrap: wrap;
    }
}
/* /Pages/Admin/Invoices.razor.rz.scp.css */
/* Invoice matching view ("confronto"): a spine of invoices beside a bench that puts one invoice
   next to the bank movement it was matched to, field by field. The layout's whole job is to keep
   both sides and the evidence between them on screen at once, so the widths below are deliberate
   and the bench never scrolls horizontally. */

.inv[b-4o2yb9pfyw] {
    --inv-edge: #dfe4eb;
    --inv-edge-strong: #c3cbd6;
    --inv-sunk: #f4f6f9;
    --inv-ink-2: #495363;
    --inv-ink-3: #7a8595;
    --inv-review: #c98f1e;
    --inv-unmatched: #8894a4;
    --inv-failed: #9e2b2b;
    --inv-matched: #0a6b4c;
    --inv-ignored: #d5dae1;
    padding: 1.5rem 1.75rem 2rem;
}

.inv-top[b-4o2yb9pfyw] {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 2rem;
    flex-wrap: wrap;
}

.inv-h1[b-4o2yb9pfyw] {
    margin: 0;
    font-weight: 600;
    letter-spacing: -0.025em;
}

.inv-sub[b-4o2yb9pfyw] {
    margin: 0.4rem 0 0;
    font-size: 0.875rem;
    color: var(--inv-ink-3);
    max-width: 70ch;
}

.inv-top-actions[b-4o2yb9pfyw] {
    display: flex;
    flex-wrap: wrap;
    gap: 0.5rem;
    align-items: center;
    justify-content: flex-end;
}

.inv-muted[b-4o2yb9pfyw] {
    color: var(--inv-ink-3);
    font-size: 0.8125rem;
}

/* ---------- meter ---------- */

.inv-meter[b-4o2yb9pfyw] {
    margin: 1.25rem 0 0.75rem;
    background: #fff;
    border: 1px solid var(--inv-edge);
    border-radius: 0.625rem;
    padding: 0.85rem 1.1rem;
    display: flex;
    align-items: center;
    gap: 1.6rem;
    flex-wrap: wrap;
}

.inv-meter-bar[b-4o2yb9pfyw] {
    flex: 1 1 18rem;
    height: 10px;
    border-radius: 5px;
    overflow: hidden;
    display: flex;
    background: var(--inv-sunk);
}

.inv-meter-seg[b-4o2yb9pfyw] {
    height: 100%;
}

.inv-meter-key[b-4o2yb9pfyw] {
    display: flex;
    gap: 1.25rem;
    flex-wrap: wrap;
    font-size: 0.78rem;
    color: var(--inv-ink-2);
}

.inv-meter-key span[b-4o2yb9pfyw] {
    display: inline-flex;
    align-items: center;
    gap: 0.4rem;
}

.inv-dot[b-4o2yb9pfyw] {
    width: 9px;
    height: 9px;
    border-radius: 3px;
    display: inline-block;
}

.inv-seg-review[b-4o2yb9pfyw] { background: var(--inv-review); }
.inv-seg-unmatched[b-4o2yb9pfyw] { background: var(--inv-unmatched); }
.inv-seg-failed[b-4o2yb9pfyw] { background: var(--inv-failed); }
.inv-seg-matched[b-4o2yb9pfyw] { background: var(--inv-matched); }
.inv-seg-ignored[b-4o2yb9pfyw] { background: var(--inv-ignored); }

/* ---------- drive settings ---------- */

.inv-drive[b-4o2yb9pfyw] {
    background: #fff;
    border: 1px solid var(--inv-edge);
    border-radius: 0.625rem;
    margin-bottom: 0.9rem;
}

.inv-drive > summary[b-4o2yb9pfyw] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1.5rem;
    padding: 0.7rem 1.1rem;
    cursor: pointer;
    font-size: 0.85rem;
    color: var(--inv-ink-2);
}

.inv-drive-line[b-4o2yb9pfyw] {
    flex: 1;
}

.inv-drive-body[b-4o2yb9pfyw] {
    border-top: 1px solid var(--inv-edge);
    padding: 1.1rem;
}

.inv-sync-result[b-4o2yb9pfyw] {
    display: flex;
    flex-wrap: wrap;
    gap: 1rem;
    align-items: center;
    font-size: 0.8125rem;
    color: var(--inv-ink-2);
}

/* ---------- work area ---------- */

.inv-work[b-4o2yb9pfyw] {
    display: grid;
    grid-template-columns: 20rem minmax(0, 1fr);
    gap: 1rem;
    align-items: start;
}

@media (max-width: 1200px) {
    .inv-work[b-4o2yb9pfyw] {
        grid-template-columns: minmax(0, 1fr);
    }
}

.inv-spine[b-4o2yb9pfyw],
.inv-bench[b-4o2yb9pfyw] {
    background: #fff;
    border: 1px solid var(--inv-edge);
    border-radius: 0.625rem;
    overflow: hidden;
}

/* ---------- spine ---------- */

.inv-chips[b-4o2yb9pfyw] {
    display: flex;
    flex-wrap: wrap;
    gap: 0.35rem;
    padding: 0.7rem 0.75rem;
    border-bottom: 1px solid var(--inv-edge);
}

.inv-chip[b-4o2yb9pfyw] {
    font: inherit;
    font-size: 0.75rem;
    font-weight: 500;
    white-space: nowrap;
    border: 0;
    border-radius: 0.375rem;
    background: var(--inv-sunk);
    color: var(--inv-ink-2);
    padding: 0.3rem 0.55rem;
    cursor: pointer;
}

.inv-chip.on[b-4o2yb9pfyw] {
    background: #121823;
    color: #fff;
}

.inv-chip i[b-4o2yb9pfyw] {
    font-style: normal;
    font-weight: 600;
    margin-left: 0.35rem;
    opacity: 0.65;
}

.inv-filters[b-4o2yb9pfyw] {
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
    padding: 0.7rem 0.75rem;
    border-bottom: 1px solid var(--inv-edge);
}

.inv-list[b-4o2yb9pfyw] {
    max-height: 32rem;
    overflow-y: auto;
}

.inv-row[b-4o2yb9pfyw] {
    display: grid;
    grid-template-columns: 4px 1.25rem minmax(0, 1fr) auto;
    align-items: center;
    gap: 0.5rem;
    padding: 0 0.75rem 0 0;
    border-bottom: 1px solid var(--inv-edge);
    cursor: pointer;
}

.inv-row:hover[b-4o2yb9pfyw] {
    background: var(--inv-sunk);
}

.inv-row.sel[b-4o2yb9pfyw] {
    background: #ebedfb;
}

.inv-row-bar[b-4o2yb9pfyw] {
    align-self: stretch;
}

.inv-row-check[b-4o2yb9pfyw] {
    margin: 0 0 0 0.4rem;
}

.inv-row-main[b-4o2yb9pfyw] {
    display: block;
    padding: 0.6rem 0;
    min-width: 0;
}

.inv-row-issuer[b-4o2yb9pfyw] {
    display: block;
    font-size: 0.8125rem;
    font-weight: 600;
    letter-spacing: -0.01em;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.inv-row-meta[b-4o2yb9pfyw] {
    display: block;
    font-size: 0.7rem;
    color: var(--inv-ink-3);
    margin-top: 0.15rem;
}

.inv-row-sep[b-4o2yb9pfyw]::before {
    content: "·";
    margin: 0 0.35rem;
    color: var(--inv-edge-strong);
}

.inv-row-amt[b-4o2yb9pfyw] {
    font-size: 0.8125rem;
    font-weight: 600;
    white-space: nowrap;
}

.inv-empty[b-4o2yb9pfyw] {
    padding: 2rem 1rem;
    margin: 0;
    text-align: center;
    font-size: 0.8125rem;
    color: var(--inv-ink-3);
}

.inv-spine-foot[b-4o2yb9pfyw] {
    border-top: 1px solid var(--inv-edge);
    padding: 0.7rem 0.75rem;
}

.inv-bulk[b-4o2yb9pfyw] {
    display: flex;
    flex-wrap: wrap;
    gap: 0.35rem;
}

.inv-spine-note[b-4o2yb9pfyw] {
    margin: 0.7rem 0 0;
    font-size: 0.73rem;
    line-height: 1.5;
    color: var(--inv-ink-3);
}

/* ---------- bench ---------- */

.inv-bench[b-4o2yb9pfyw] {
    min-height: 24rem;
    display: flex;
    flex-direction: column;
}

.inv-bench-empty[b-4o2yb9pfyw] {
    margin: auto;
    text-align: center;
    color: var(--inv-ink-3);
    padding: 3rem 1rem;
}

.inv-bench-empty i[b-4o2yb9pfyw] {
    font-size: 1.6rem;
    opacity: 0.4;
}

.inv-bench-empty p[b-4o2yb9pfyw] {
    margin: 0.75rem 0 0;
    font-size: 0.875rem;
}

.inv-bench-head[b-4o2yb9pfyw] {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 1.5rem;
    padding: 0.9rem 1.25rem;
    border-bottom: 1px solid var(--inv-edge);
    flex-wrap: wrap;
}

.inv-bench-title[b-4o2yb9pfyw] {
    font-size: 1.0625rem;
    font-weight: 600;
    letter-spacing: -0.015em;
}

.inv-bench-amount[b-4o2yb9pfyw] {
    margin-left: 0.6rem;
    color: var(--inv-ink-2);
}

.inv-bench-sub[b-4o2yb9pfyw] {
    font-size: 0.8125rem;
    color: var(--inv-ink-3);
    margin-top: 0.25rem;
}

.inv-bench-acts[b-4o2yb9pfyw] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    flex-wrap: wrap;
}

.inv-verdict[b-4o2yb9pfyw] {
    display: inline-flex;
    align-items: center;
    gap: 0.45rem;
    font-size: 0.8125rem;
    font-weight: 600;
    padding: 0.35rem 0.7rem;
    border-radius: 0.4rem;
}

.inv-verdict.weak[b-4o2yb9pfyw] {
    background: #fbf1de;
    color: #8a5a00;
}

.inv-verdict.ok[b-4o2yb9pfyw] {
    background: #e7f3ee;
    color: var(--inv-matched);
}

/* ---------- comparison ---------- */

.inv-cmp[b-4o2yb9pfyw] {
    display: grid;
    grid-template-columns: minmax(0, 1fr) 13rem minmax(0, 1fr);
}

@media (max-width: 992px) {
    .inv-cmp[b-4o2yb9pfyw] {
        grid-template-columns: minmax(0, 1fr);
    }
}

.inv-cmp-mid[b-4o2yb9pfyw] {
    background: var(--inv-sunk);
    border-left: 1px solid var(--inv-edge);
    border-right: 1px solid var(--inv-edge);
}

.inv-cmp-head[b-4o2yb9pfyw] {
    padding: 0.85rem 1.25rem 0.55rem;
    font-size: 0.75rem;
    color: var(--inv-ink-3);
    border-bottom: 1px solid var(--inv-edge);
}

.inv-cmp-head b[b-4o2yb9pfyw] {
    display: block;
    margin-top: 0.15rem;
    font-size: 0.9375rem;
    font-weight: 600;
    color: inherit;
    color: #121823;
    letter-spacing: -0.01em;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.inv-cmp-head.center[b-4o2yb9pfyw] {
    text-align: center;
    padding-left: 0.75rem;
    padding-right: 0.75rem;
}

.inv-cell[b-4o2yb9pfyw] {
    padding: 0.65rem 1.25rem;
    border-bottom: 1px solid var(--inv-edge);
    min-height: 3.9rem;
}

.inv-cell.last[b-4o2yb9pfyw] {
    border-bottom: 0;
}

.inv-cell.editable[b-4o2yb9pfyw] {
    cursor: pointer;
}

.inv-k[b-4o2yb9pfyw] {
    font-size: 0.7rem;
    color: var(--inv-ink-3);
}

.inv-v[b-4o2yb9pfyw] {
    font-size: 0.875rem;
    font-weight: 500;
    margin-top: 0.15rem;
    line-height: 1.35;
    overflow-wrap: anywhere;
}

.inv-v.big[b-4o2yb9pfyw] {
    font-size: 1.1875rem;
    font-weight: 600;
    letter-spacing: -0.02em;
}

.inv-v.miss[b-4o2yb9pfyw] {
    color: var(--inv-ink-3);
    font-weight: 400;
}

.inv-v.mono[b-4o2yb9pfyw] {
    font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
    font-size: 0.8125rem;
    letter-spacing: -0.02em;
}

.inv-mcell[b-4o2yb9pfyw] {
    padding: 0.65rem 0.75rem;
    border-bottom: 1px solid var(--inv-edge);
    min-height: 3.9rem;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    text-align: center;
    gap: 0.2rem;
}

.inv-mcell.last[b-4o2yb9pfyw] {
    border-bottom: 0;
}

.inv-op[b-4o2yb9pfyw] {
    font-size: 1rem;
    font-weight: 600;
    line-height: 1.1;
}

.inv-op-note[b-4o2yb9pfyw] {
    font-size: 0.7rem;
    font-weight: 500;
    line-height: 1.3;
}

.inv-op.strong[b-4o2yb9pfyw], .inv-op-note.strong[b-4o2yb9pfyw] { color: var(--inv-matched); }
.inv-op.sup[b-4o2yb9pfyw], .inv-op-note.sup[b-4o2yb9pfyw] { color: var(--inv-ink-2); }
.inv-op.weak[b-4o2yb9pfyw], .inv-op-note.weak[b-4o2yb9pfyw] { color: #8a5a00; }
.inv-op.none[b-4o2yb9pfyw], .inv-op-note.none[b-4o2yb9pfyw] { color: #a6afbb; }

.inv-bench-foot[b-4o2yb9pfyw] {
    margin-top: auto;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1.5rem;
    padding: 0.85rem 1.25rem;
    border-top: 1px solid var(--inv-edge);
    background: var(--inv-sunk);
    flex-wrap: wrap;
}

.inv-bench-foot-text[b-4o2yb9pfyw] {
    margin: 0;
    font-size: 0.8125rem;
    color: var(--inv-ink-2);
    max-width: 80ch;
}

.inv-bench-foot-acts[b-4o2yb9pfyw] {
    display: flex;
    gap: 0.4rem;
    flex-wrap: wrap;
}

/* ---------- candidate picking ---------- */

.inv-pick[b-4o2yb9pfyw] {
    display: grid;
    grid-template-columns: 20rem minmax(0, 1fr);
}

@media (max-width: 992px) {
    .inv-pick[b-4o2yb9pfyw] {
        grid-template-columns: minmax(0, 1fr);
    }
}

.inv-pick-invoice[b-4o2yb9pfyw] {
    border-right: 1px solid var(--inv-edge);
}

.inv-pick-acts[b-4o2yb9pfyw] {
    display: flex;
    flex-wrap: wrap;
    gap: 0.4rem;
    padding: 0.85rem 1.25rem;
    border-top: 1px solid var(--inv-edge);
}

.inv-pick-note[b-4o2yb9pfyw] {
    margin: 0;
    padding: 0.8rem 1.25rem;
    font-size: 0.78rem;
    line-height: 1.5;
    color: var(--inv-ink-3);
    border-bottom: 1px solid var(--inv-edge);
}

.inv-pick-note.last[b-4o2yb9pfyw] {
    border-bottom: 0;
    border-top: 1px solid var(--inv-edge);
}

.inv-cand[b-4o2yb9pfyw] {
    display: grid;
    grid-template-columns: 4px minmax(0, 1fr) 11rem 12rem auto auto;
    align-items: center;
    gap: 0.75rem;
    border-bottom: 1px solid var(--inv-edge);
    padding-right: 1.25rem;
}

@media (max-width: 1400px) {
    .inv-cand[b-4o2yb9pfyw] {
        grid-template-columns: 4px minmax(0, 1fr) auto auto;
    }

    .inv-cand-why:nth-of-type(2)[b-4o2yb9pfyw] {
        grid-column: 2 / -1;
    }
}

.inv-cand-bar[b-4o2yb9pfyw] {
    align-self: stretch;
    background: var(--inv-edge-strong);
}

.inv-cand.best .inv-cand-bar[b-4o2yb9pfyw] {
    background: var(--inv-matched);
}

.inv-cand.no .inv-cand-bar[b-4o2yb9pfyw] {
    background: var(--inv-failed);
}

.inv-cand-main[b-4o2yb9pfyw] {
    padding: 0.7rem 0 0.7rem 1rem;
    min-width: 0;
}

.inv-cand-desc[b-4o2yb9pfyw] {
    font-size: 0.8125rem;
    font-weight: 600;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.inv-cand-desc.mono[b-4o2yb9pfyw] {
    font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
    letter-spacing: -0.02em;
}

.inv-cand-meta[b-4o2yb9pfyw] {
    font-size: 0.7rem;
    color: var(--inv-ink-3);
    margin-top: 0.2rem;
}

.inv-cand-why[b-4o2yb9pfyw] {
    font-size: 0.73rem;
    line-height: 1.4;
    padding: 0.7rem 0;
}

.inv-cand-why .ok[b-4o2yb9pfyw] {
    color: var(--inv-matched);
}

.inv-cand-why .no[b-4o2yb9pfyw] {
    color: var(--inv-failed);
}

.inv-cand-amt[b-4o2yb9pfyw] {
    font-size: 0.9375rem;
    font-weight: 600;
    white-space: nowrap;
    text-align: right;
}

.inv-cand-act[b-4o2yb9pfyw] {
    text-align: right;
}

.inv-attrib[b-4o2yb9pfyw] {
    border-top: 1px solid var(--inv-edge);
    padding: 1rem;
}

.inv-attrib[b-4o2yb9pfyw]  .card {
    max-width: 40rem;
    margin: 0 auto;
}
/* /Pages/Items/GetButton.razor.rz.scp.css */
.btn-sufficient-balance[b-ix80nlxjkw] {
    background-color: #007bff; /* Bootstrap primary color */
    color: white;
}

.btn-sufficient-balance:hover[b-ix80nlxjkw] {
    background-color: #0056b3; /* Darker shade on hover */
}

.btn-insufficient-balance[b-ix80nlxjkw] {
    background-color: #6c757d; /* Bootstrap secondary color */
    color: white;
}

.btn-insufficient-balance:hover[b-ix80nlxjkw] {
    background-color: #5a6268; /* Darker shade on hover */
}
/* /Pages/Items/MarketplaceCard.razor.rz.scp.css */
/* Card container to ensure full height and margins between cards */
.marketplace-item-card[b-nv7hykwojo] {
    font-size: 0.9rem;
}

/* Image container with background color and size constraints */
.card-img-top-container[b-nv7hykwojo] {
    background-color: var(--hover-bg);
    padding: 5px; /* Small padding around the image */
    text-align: center; /* Center the image horizontally */
    height: 128px; /* Fixed height for the image container */
}

/* Styling for the image itself */
.card-img-top[b-nv7hykwojo] {
    max-width: 100%; /* Ensure the image doesn't exceed the width of the container */
    max-height: 100%; /* Ensure the image doesn't exceed the height of the container */
    object-fit: contain; /* Keep the image's aspect ratio and contain it within the box */
}

/* Card title: adjust font size and weight */
.card-title[b-nv7hykwojo] {
    font-size: 0.85rem; /* Slightly smaller font size */
    font-weight: bold; /* Bold text for the item name */
}

/* Card description text */
.card-text[b-nv7hykwojo] {
    font-size: 0.8rem; /* Smaller font for the description */
    flex-grow: 1; /* Allow the description to grow and push the Buy button down */
}

/* The container of the entire card */
.marketplace-item-card[b-nv7hykwojo] {
    height: 100%; /* Ensure the card takes up the full height in the grid */
    margin-bottom: 2rem; /* Add space between the cards */
}

/* Requires Validation Badge: Softer Brownish Maroon */
.requires-validation-badge[b-nv7hykwojo] {
    background-color: #a05252; /* Softer maroon color */
    color: #fff; /* White text for readability */
}

/* Sold Out Badge: Greyish color */
.sold-out-badge[b-nv7hykwojo] {
    background-color: #6c757d; /* Greyish color */
    color: #fff; /* White text */
}
/* /Pages/Statements/BankAccounts.razor.rz.scp.css */
/* Bank accounts list — one card row per account with the balance as the
   dominant figure, then a two-column deck for the period, sync and AI panels.
   Rides the app-wide grayscale tokens (see wwwroot/css/app.css) so it adapts
   to dark mode automatically; only the amber "needs attention" accent is
   spelled out here, with its own dark-mode value. */

.ba-head[b-y3vifkehwf],
.ba-accts[b-y3vifkehwf],
.ba-empty[b-y3vifkehwf],
.ba-grid[b-y3vifkehwf] {
    font-family: 'Instrument Sans', 'Helvetica Neue', Helvetica, Arial, sans-serif;
}

.ba-head[b-y3vifkehwf] {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    gap: 24px;
    margin-bottom: 20px;
}

.ba-title[b-y3vifkehwf] {
    font-size: 1.75rem;
    font-weight: 600;
    letter-spacing: -0.025em;
    margin: 0;
    color: var(--text-primary, #111827);
}

.ba-sub[b-y3vifkehwf] {
    font-size: 0.9rem;
    color: var(--text-secondary, #374151);
    margin: 0.45rem 0 0;
    max-width: 70ch;
    line-height: 1.5;
}

.ba-key[b-y3vifkehwf] {
    border-radius: 8px;
    font-weight: 600;
    white-space: nowrap;
}

.ba-empty[b-y3vifkehwf] {
    background: var(--content-bg, #fff);
    border: 1px solid var(--border-default, #e4e6ea);
    border-radius: 14px;
    padding: 28px;
    text-align: center;
    color: var(--text-muted, #6b7280);
}

/* One row per account. The balance column is the widest type on the page —
   it is what the page is read for. */
.ba-accts[b-y3vifkehwf] {
    display: flex;
    flex-direction: column;
    gap: 10px;
}

.ba-acct[b-y3vifkehwf] {
    background: var(--content-bg, #fff);
    border: 1px solid var(--border-default, #e4e6ea);
    border-radius: 14px;
    box-shadow: var(--shadow-card), var(--card-edge);
    padding: 16px 20px;
    display: grid;
    grid-template-columns: minmax(0, 1fr) 230px 230px auto;
    align-items: center;
    gap: 24px;
}

.ba-acct-name[b-y3vifkehwf] {
    font-size: 1.06rem;
    font-weight: 600;
    letter-spacing: -0.015em;
    color: var(--text-primary, #111827);
    text-decoration: none;
}

.ba-acct-name:hover[b-y3vifkehwf] {
    text-decoration: underline;
}

/* Bank, masked account number and masked IBAN on one quiet line, so the
   account's identity never competes with its balance. */
.ba-acct-meta[b-y3vifkehwf] {
    display: flex;
    flex-wrap: wrap;
    gap: 0 14px;
    font-size: 0.8rem;
    color: var(--text-subtle, #9ca3af);
    margin-top: 3px;
}

.ba-acct-iban[b-y3vifkehwf] {
    letter-spacing: 0.02em;
}

.ba-acct-bal[b-y3vifkehwf] {
    font-size: 1.5rem;
    font-weight: 600;
    letter-spacing: -0.03em;
    text-align: right;
    font-variant-numeric: tabular-nums;
}

.ba-acct-count[b-y3vifkehwf] {
    font-size: 0.78rem;
    color: var(--text-subtle, #9ca3af);
    text-align: right;
    margin-top: 2px;
    font-variant-numeric: tabular-nums;
}

.ba-acct-rec[b-y3vifkehwf] {
    text-align: right;
    font-size: 0.82rem;
    color: var(--text-secondary, #374151);
}

.ba-acct-rec-k[b-y3vifkehwf] {
    display: block;
    font-size: 0.72rem;
    color: var(--text-subtle, #9ca3af);
    margin-bottom: 2px;
}

.ba-acct-rec-v[b-y3vifkehwf] {
    font-variant-numeric: tabular-nums;
}

/* An account that has never been reconciled is the one thing on this page
   that asks for action, so it is the only place colour appears. */
.ba-flag[b-y3vifkehwf] {
    display: inline-flex;
    align-items: center;
    font-size: 0.78rem;
    font-weight: 600;
    color: #a4700b;
    background: #fdf4e3;
    border-radius: 6px;
    padding: 3px 8px;
}

.ba-acct-acts[b-y3vifkehwf] {
    display: flex;
    gap: 6px;
    justify-content: flex-end;
}

.ba-acct-acts .btn[b-y3vifkehwf] {
    border-radius: 7px;
}

/* Period balances take the wide column; sync and AI stack beside them. */
.ba-grid[b-y3vifkehwf] {
    display: grid;
    grid-template-columns: 1.35fr 1fr;
    gap: 16px;
    align-items: start;
    margin-top: 16px;
}

.ba-periods[b-y3vifkehwf] {
    grid-row: span 2;
}

.ba-periods[b-y3vifkehwf],
.ba-side[b-y3vifkehwf] {
    margin-bottom: 0 !important;
}

.ba-grid .card[b-y3vifkehwf] {
    border-radius: 14px;
    border: 1px solid var(--border-default, #e4e6ea);
}

.ba-grid .card-title[b-y3vifkehwf] {
    font-size: 0.95rem;
    font-weight: 600;
    letter-spacing: -0.01em;
}

.ba-grid .table[b-y3vifkehwf] {
    font-size: 0.85rem;
}

.ba-grid .table > :not(caption) > * > *[b-y3vifkehwf] {
    padding-top: 0.55rem;
    padding-bottom: 0.55rem;
}

[data-bs-theme="dark"] .ba-flag[b-y3vifkehwf] {
    color: #e2a446;
    background: rgba(226, 164, 70, 0.14);
}

@media (max-width: 1399.98px) {
    .ba-acct[b-y3vifkehwf] {
        grid-template-columns: minmax(0, 1fr) 200px auto;
        gap: 10px 20px;
    }

    .ba-acct-rec[b-y3vifkehwf] {
        grid-column: 1 / -1;
        text-align: left;
    }

    .ba-acct-rec-k[b-y3vifkehwf] {
        display: inline;
        margin-right: 6px;
    }
}

@media (max-width: 1199.98px) {
    .ba-grid[b-y3vifkehwf] {
        grid-template-columns: 1fr;
    }

    .ba-periods[b-y3vifkehwf] {
        grid-row: auto;
    }
}

@media (max-width: 767.98px) {
    .ba-head[b-y3vifkehwf] {
        flex-direction: column;
    }

    .ba-acct[b-y3vifkehwf] {
        grid-template-columns: 1fr;
    }

    .ba-acct-bal[b-y3vifkehwf],
    .ba-acct-count[b-y3vifkehwf] {
        text-align: left;
    }

    .ba-acct-acts[b-y3vifkehwf] {
        justify-content: flex-start;
    }
}

/* The whole card opens the account, so it has to look and behave like a link. */
.ba-acct[b-y3vifkehwf] {
    cursor: pointer;
    transition: box-shadow .15s ease, border-color .15s ease;
}

.ba-acct:hover[b-y3vifkehwf] {
    border-color: var(--line-2, #ced4dd);
    box-shadow: var(--shadow-lift), var(--card-edge);
}

.ba-acct:focus-visible[b-y3vifkehwf] {
    outline: 2px solid var(--bs-primary);
    outline-offset: 2px;
}

/* Row actions sit inside the card but are their own controls. */
.ba-acct-acts .btn[b-y3vifkehwf] {
    cursor: pointer;
}

/* The state of a closing balance is the column people scan, so it is set at
   body size rather than as a small badge. */
.ba-grid .table th.ba-period-state[b-y3vifkehwf] {
    width: 190px;
}

.ba-grid .table td.ba-period-state .badge[b-y3vifkehwf] {
    font-size: 0.82rem;
    font-weight: 600;
    padding: 0.35em 0.7em;
    border-radius: 7px;
    vertical-align: middle;
}

.ba-grid .table td.ba-period-state .badge i[b-y3vifkehwf] {
    font-size: 0.78em;
}
/* /Pages/Statements/BankAccountView.razor.rz.scp.css */
/* Single bank account — header, month strip, statement entry list and
   categorization rules. Rides the app-wide grayscale tokens (see
   wwwroot/css/app.css) so it adapts to dark mode automatically.

   Reading order on this page: what still needs an account, then the balance,
   then the month's movements grouped by day. */

.container-fluid[b-l7sw45edm7] {
    font-family: 'Instrument Sans', 'Helvetica Neue', Helvetica, Arial, sans-serif;
}

/* ---- header ---- */

.sv-head[b-l7sw45edm7] {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    gap: 40px;
    align-items: start;
    margin-bottom: 1.25rem;
}

.sv-back[b-l7sw45edm7] {
    font-size: 0.8rem;
    padding-top: 0;
    padding-bottom: 0;
    color: var(--text-muted, #6b7280);
    text-decoration: none;
}

.sv-name[b-l7sw45edm7] {
    font-size: 1.65rem;
    font-weight: 600;
    letter-spacing: -0.022em;
    margin: 0.4rem 0 0;
    color: var(--text-primary, #111827);
}

/* Bank, masked account number and the count of movements still waiting for an
   account, read as one sentence under the name. */
.sv-line[b-l7sw45edm7] {
    font-size: 1.05rem;
    font-weight: 500;
    color: var(--text-secondary, #374151);
    line-height: 1.4;
    margin: 0.4rem 0 0;
    max-width: 62ch;
}

.sv-line-part + .sv-line-part[b-l7sw45edm7]::before {
    content: "\00b7";
    margin: 0 0.5rem;
    color: var(--text-subtle, #9ca3af);
}

.sv-todo strong[b-l7sw45edm7] {
    font-weight: 600;
    color: var(--text-primary, #111827);
}

.sv-actions[b-l7sw45edm7] {
    display: flex;
    flex-wrap: wrap;
    gap: 0.6rem;
    margin-top: 1.05rem;
}

.sv-side[b-l7sw45edm7] {
    text-align: right;
}

.sv-side-k[b-l7sw45edm7] {
    font-size: 0.8rem;
    color: var(--text-subtle, #9ca3af);
}

/* The balance is the largest thing on the page. */
.sv-balance[b-l7sw45edm7] {
    font-size: 3.4rem;
    font-weight: 600;
    letter-spacing: -0.035em;
    line-height: 1;
    margin-top: 0.1rem;
    font-variant-numeric: tabular-nums;
}

.sv-side-meta[b-l7sw45edm7] {
    font-size: 0.8rem;
    color: var(--text-secondary, #374151);
    margin-top: 0.8rem;
    line-height: 1.7;
    font-variant-numeric: tabular-nums;
}

.sv-side-iban[b-l7sw45edm7] {
    color: var(--text-subtle, #9ca3af);
    letter-spacing: 0.02em;
}

@media (max-width: 991.98px) {
    .sv-head[b-l7sw45edm7] {
        grid-template-columns: 1fr;
        gap: 1rem;
    }

    .sv-side[b-l7sw45edm7] {
        text-align: left;
    }

    .sv-balance[b-l7sw45edm7] {
        font-size: 2.4rem;
    }
}


.statement-table-wrap[b-l7sw45edm7] {
    max-height: calc(100vh - 280px);
    overflow: auto;
    border: 1px solid var(--border-default, #dee2e6);
    border-radius: var(--radius, 8px);
}

/* Outer wrapper: top row (calendar + rules panel) stacked above the
   full-width entry table below it. */
.statement-main-layout[b-l7sw45edm7] {
    display: flex;
    flex-direction: column;
    gap: 1rem;
}



/* Period picker — the displayed year's months plus a year row with prev/next
   arrows underneath. Full width, stacked above the entry table. */
.statement-period-panel[b-l7sw45edm7] {
    width: 100%;
    border-radius: 12px;
}

/* Months read as one quiet strip; only the selected month is filled. */
.statement-period-month[b-l7sw45edm7] {
    border-color: transparent;
    background-color: transparent;
    color: var(--text-secondary, #374151);
    font-weight: 500;
    border-radius: 8px;
}

.statement-period-month:hover:not(:disabled)[b-l7sw45edm7] {
    background-color: var(--hover-bg, #f3f4f6);
    border-color: transparent;
    color: var(--text-primary, #111827);
}

.statement-period-month:disabled[b-l7sw45edm7] {
    color: var(--text-subtle, #9ca3af);
    opacity: 1;
}

/* Beats the transparent rule above, which would otherwise swallow the
   selected month's fill. */
.statement-period-month.btn-primary[b-l7sw45edm7],
.statement-period-month.btn-primary:hover[b-l7sw45edm7] {
    background-color: var(--bs-primary);
    border-color: var(--bs-primary);
    color: #fff;
}

/* Months fill the row: twelve across on a wide panel, wrapping to fewer per
   row as it narrows, so a month button never stretches out of proportion. */
.statement-period-grid[b-l7sw45edm7] {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(80px, 1fr));
    gap: 0.3rem;
}

.statement-period-month[b-l7sw45edm7] {
    position: relative;
}

.statement-period-month-dot[b-l7sw45edm7] {
    position: absolute;
    top: 3px;
    right: 5px;
    width: 6px;
    height: 6px;
    border-radius: 50%;
    background-color: var(--bs-warning, #ffc107);
}

.statement-period-year-row[b-l7sw45edm7] {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 0.5rem;
    margin-top: 0.4rem;
}

/* Categorization rules — full width, last in the column, under the entry
   table. The width gives the pattern/details columns room to show a full
   rule and lets the actions column keep its buttons on one line. */
.statement-rules-panel[b-l7sw45edm7] {
    width: 100%;
}

/* Entry table — full width below the calendar/rules row, instead of being
   squeezed into the remaining space next to the rules panel. */
.statement-table-section[b-l7sw45edm7] {
    width: 100%;
}

/* Caps the rule list so a long list scrolls in place instead of pushing the
   calendar panel (same row) ever taller. overflow-x stays hidden — the panel
   is sized wide enough, and cells wrap, so nothing needs a horizontal
   scrollbar. */
.statement-rules-table-wrap[b-l7sw45edm7] {
    max-height: 240px;
    overflow-y: auto;
    overflow-x: hidden;
}

.statement-rules-table-wrap thead[b-l7sw45edm7] {
    position: sticky;
    top: 0;
    z-index: 1;
}

.statement-rules-table[b-l7sw45edm7] {
    width: 100%;
    /* Fixed layout so the column widths below are honoured instead of being
       re-derived from cell content, which squeezed actions down to one button. */
    table-layout: fixed;
}

.statement-rules-table th[b-l7sw45edm7],
.statement-rules-table td[b-l7sw45edm7] {
    padding: 0.3rem 0.5rem;
    white-space: normal;
    word-break: break-word;
}

/* Column widths: pattern and details get the bulk of the panel so a long
   keyword or a long details text stays readable, while active/actions take
   only what their buttons need. Actions never wraps — it holds two buttons. */
.statement-rules-col-pattern[b-l7sw45edm7] {
    width: 25%;
}

.statement-rules-col-category[b-l7sw45edm7] {
    width: 19%;
}

.statement-rules-col-details[b-l7sw45edm7] {
    width: 38%;
}

.statement-rules-col-active[b-l7sw45edm7] {
    width: 72px;
    white-space: nowrap;
}

.statement-rules-col-actions[b-l7sw45edm7] {
    width: 96px;
    white-space: nowrap;
}

.statement-table-wrap table[b-l7sw45edm7] {
    margin-bottom: 0;
}

.statement-table-wrap thead[b-l7sw45edm7] {
    position: sticky;
    top: 0;
    z-index: 2;
}

.statement-table-wrap th[b-l7sw45edm7] {
    white-space: nowrap;
    font-size: 0.78rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.02em;
    color: var(--text-muted, #6b7280);
    padding-top: 0.5rem;
    padding-bottom: 0.5rem;
}

/* Tight, consistent row rhythm — the bulk of the "too much space per row" fix. */
.statement-table-wrap td[b-l7sw45edm7] {
    vertical-align: top;
    padding-top: 0.4rem;
    padding-bottom: 0.4rem;
    font-size: 0.825rem;
    line-height: 1.3;
}

.statement-table-wrap .badge[b-l7sw45edm7] {
    white-space: normal;
    font-weight: 500;
}

.statement-table-wrap .form-select[b-l7sw45edm7],
.statement-table-wrap .form-control[b-l7sw45edm7] {
    min-width: 0;
    font-size: 0.8rem;
}

.statement-table-wrap select.form-select[b-l7sw45edm7] {
    text-overflow: ellipsis;
}

.statement-table-wrap .btn-sm[b-l7sw45edm7] {
    white-space: nowrap;
}

/* Column sizing — fluid instead of a hard-coded 1240px min-width. Description
   is capped instead of left to grow unbounded, so narrower viewports need less
   horizontal scroll than the previous 8-column layout. */
.statement-col-date[b-l7sw45edm7] {
    width: 108px;
}

.statement-col-category[b-l7sw45edm7] {
    width: 150px;
}

.statement-col-amount[b-l7sw45edm7] {
    width: 110px;
}

.statement-col-distribution[b-l7sw45edm7] {
    width: 260px;
}

.statement-col-actions[b-l7sw45edm7] {
    width: 44px;
}

.statement-col-desc[b-l7sw45edm7] {
    width: 220px;
    max-width: 220px;
}

/* Details is its own column next to Description, not a sub-row inside it —
   Description (read-only, no edit control) and Details (editable) need to
   read as clearly separate fields, not like Description itself is editable. */
.statement-col-details[b-l7sw45edm7] {
    width: 170px;
    max-width: 170px;
}

/* While a Details/Category/Amount cell is actively being edited, let that
   column grow past its normal fixed width so the inline input/select has
   real room to show what's being typed/selected — instead of squeezing it
   into a 150-220px sliver. Only the column being edited expands (standard
   table auto-layout sizes the whole column to its widest cell, so this
   widens that column for every row while one entry in it is in edit mode);
   everything else keeps its normal width. The table wrapper's horizontal
   scroll (see .statement-table-wrap) absorbs any extra width this needs on
   narrow viewports instead of clipping it. */
.statement-col-details.statement-col-editing[b-l7sw45edm7],
.statement-col-category.statement-col-editing[b-l7sw45edm7] {
    width: auto;
    max-width: none;
    min-width: 260px;
}

.statement-col-amount.statement-col-editing[b-l7sw45edm7] {
    width: auto;
    max-width: none;
    min-width: 210px;
}

.statement-col-amount.statement-col-editing .statement-amount-editor[b-l7sw45edm7] {
    max-width: 180px;
}

.statement-date-line[b-l7sw45edm7] {
    display: flex;
    align-items: center;
    gap: 0.35rem;
    color: var(--text-secondary, #374151);
    font-size: 0.8rem;
}

.statement-source-icon[b-l7sw45edm7] {
    font-size: 0.7rem;
    color: var(--text-subtle, #9ca3af);
    width: 14px;
    text-align: center;
}

.statement-badge-ignored[b-l7sw45edm7] {
    display: inline-flex;
    margin-top: 0.25rem;
    background-color: var(--hover-bg, #f3f4f6);
    color: var(--text-muted, #6b7280);
    border: 1px solid var(--border-default, #e4e6ea);
    font-size: 0.68rem;
}

/* Single-line, ellipsized — full text is still on the title attribute for a
   hover tooltip. Combined with .statement-cell-text for specificity so this
   wins regardless of source order against its white-space: normal below. */
.statement-cell-text.statement-desc-primary[b-l7sw45edm7],
.statement-cell-text.statement-desc-secondary[b-l7sw45edm7] {
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    min-width: 0;
}

.statement-desc-primary[b-l7sw45edm7] {
    font-weight: 600;
    color: var(--text-primary, #111827);
}

.statement-desc-secondary[b-l7sw45edm7] {
    color: var(--text-muted, #6b7280);
    font-size: 0.75rem;
}

.statement-amount[b-l7sw45edm7] {
    font-size: 0.9rem;
    white-space: nowrap;
}

.statement-cell-text[b-l7sw45edm7] {
    white-space: normal;
    overflow-wrap: anywhere;
    line-height: 1.25;
}

.statement-edit-cell[b-l7sw45edm7] {
    display: flex;
    align-items: flex-start;
    gap: 4px;
    min-width: 0;
}

.statement-edit-cell-end[b-l7sw45edm7] {
    align-items: center;
    justify-content: flex-end;
}

.statement-cell-edit-button[b-l7sw45edm7] {
    flex: 0 0 auto;
    padding-left: 6px;
    padding-right: 6px;
}

.statement-amount-editor[b-l7sw45edm7] {
    min-width: 96px;
    max-width: 132px;
}

.statement-amount-editor .form-control[b-l7sw45edm7] {
    min-width: 0;
}

.statement-action-btn[b-l7sw45edm7] {
    width: 32px;
    padding-left: 0;
    padding-right: 0;
}

/* Status accent: a slim left border instead of a fully tinted row — reads as a
   calm status marker rather than drowning the row in background color. */
.statement-row[b-l7sw45edm7] {
    border-left: 3px solid transparent;
}

.statement-row-pending[b-l7sw45edm7] {
    border-left-color: #f0ad4e;
    background-color: rgba(240, 173, 78, 0.07);
}

.statement-row-ignored[b-l7sw45edm7] {
    border-left-color: var(--text-subtle, #9ca3af);
    color: var(--text-muted, #6b7280);
    opacity: 0.75;
}

.statement-row-done[b-l7sw45edm7] {
    border-left-color: #2fb380;
}

@media (max-width: 767.98px) {
    .statement-table-wrap[b-l7sw45edm7] {
        max-height: none;
    }
}

/* ---- day bands ---- */

/* Movements are grouped by the day they are dated, with the day's net under
   the same columns. The net ignores entries marked as ignored, exactly like
   the month total above the table. */
.statement-day-band td[b-l7sw45edm7] {
    background-color: var(--hover-bg, #f3f4f6) !important;
    border-top: 1px solid var(--border-default, #e4e6ea);
    border-bottom: 1px solid var(--border-default, #e4e6ea);
    padding: 0.35rem 0.75rem;
}

.statement-day-date[b-l7sw45edm7] {
    font-size: 0.78rem;
    font-weight: 600;
    color: var(--text-secondary, #374151);
}

/* Portuguese writes weekdays lowercase; only the sentence start is capital. */
.statement-day-date[b-l7sw45edm7]::first-letter {
    text-transform: uppercase;
}

.statement-day-meta[b-l7sw45edm7] {
    float: right;
    font-size: 0.78rem;
    color: var(--text-muted, #6b7280);
    font-variant-numeric: tabular-nums;
}

.statement-day-sep[b-l7sw45edm7] {
    margin: 0 0.3rem;
    color: var(--text-subtle, #9ca3af);
}

/* ---- category ---- */

/* A category reads as a word with a colour tick, not as a filled pill: the
   pills competed with the amounts for attention on every row. */
.statement-cat[b-l7sw45edm7] {
    display: inline-flex;
    align-items: center;
    gap: 7px;
    font-size: 0.8rem;
    min-width: 0;
}

.statement-cat-tick[b-l7sw45edm7] {
    flex: 0 0 auto;
    display: inline-block;
    width: 3px;
    height: 15px;
    border-radius: 2px;
    background-color: var(--text-subtle, #9ca3af);
}

.statement-cat-none[b-l7sw45edm7] {
    color: var(--text-muted, #6b7280);
}

/* ---- rules panel ---- */

.statement-rules-panel[b-l7sw45edm7] {
    border-radius: 12px;
}

.statement-rules-title[b-l7sw45edm7] {
    font-size: 0.95rem;
    font-weight: 600;
    letter-spacing: -0.01em;
    color: var(--text-primary, #111827);
}

/* ---- quieter row chrome ---- */

/* One pencil per editable cell times a few hundred rows is a lot of blue, so
   the pencils stay grey until the row is pointed at. */
.statement-cell-edit-button.btn-outline-primary[b-l7sw45edm7] {
    border-color: transparent;
    background-color: transparent;
    color: var(--text-subtle, #9ca3af);
}

.statement-cell-edit-button.btn-outline-primary:hover[b-l7sw45edm7],
.statement-cell-edit-button.btn-outline-primary:focus-visible[b-l7sw45edm7] {
    border-color: transparent;
    background-color: var(--hover-bg, #f3f4f6);
    color: var(--bs-primary);
}

/* Allocation chips keep their meaning — blue for a manual split, green for one
   that came in allocated — as a tint rather than a solid block of colour. */
.statement-col-distribution .badge.bg-primary[b-l7sw45edm7] {
    background-color: rgba(54, 54, 148, 0.1) !important;
    color: #363694 !important;
}

.statement-col-distribution .badge.bg-success[b-l7sw45edm7] {
    background-color: rgba(15, 110, 87, 0.12) !important;
    color: #0f6e57 !important;
}

[data-bs-theme="dark"] .statement-col-distribution .badge.bg-primary[b-l7sw45edm7] {
    background-color: rgba(108, 155, 245, 0.16) !important;
    color: #9bb9f7 !important;
}

[data-bs-theme="dark"] .statement-col-distribution .badge.bg-success[b-l7sw45edm7] {
    background-color: rgba(63, 177, 132, 0.16) !important;
    color: #6fc9a6 !important;
}

/* Four action buttons need a row of their own width, or they wrap onto a
   second line and double the row height. */
.statement-col-actions[b-l7sw45edm7] {
    width: 150px;
    white-space: nowrap;
}
/* /Pages/Transactions/TransactionDetails.razor.rz.scp.css */
.profile-img[b-nkso05c5u7] {
    width: 64px;
    height: 64px;
    border-radius: 50%;
    object-fit: cover;
    border: 2px solid var(--border-default);
}

.profile-img-small[b-nkso05c5u7] {
    width: 32px;
    height: 32px;
    border-radius: 50%;
    object-fit: cover;
}

.sticky-top[b-nkso05c5u7] {
    position: sticky;
    top: 1rem;
}

.card-title[b-nkso05c5u7] {
    font-size: 1.1rem;
    font-weight: 600;
}

.badge[b-nkso05c5u7] {
    font-size: 0.8rem;
    padding: 0.5rem 0.75rem;
}

/* Status badge colors */
.bg-warning.text-dark[b-nkso05c5u7] {
    background-color: #ffc107 !important;
    color: var(--text-primary) !important;
}

/* Transaction amount styling */
.fs-4[b-nkso05c5u7] {
    font-weight: 600;
}

/* Table hover effect */
.table-hover tbody tr:hover[b-nkso05c5u7] {
    background-color: rgba(0, 123, 255, 0.075);
}

/* Alert animation */
.alert[b-nkso05c5u7] {
    animation: fadeInUp-b-nkso05c5u7 0.3s ease-out;
}

@keyframes fadeInUp-b-nkso05c5u7 {
    from {
        opacity: 0;
        transform: translateY(10px);
    }
    to {
        opacity: 1;
        transform: translateY(0);
    }
}

/* Loading spinner center */
.spinner-border[b-nkso05c5u7] {
    width: 3rem;
    height: 3rem;
}

/* Action buttons spacing */
.d-grid.gap-2[b-nkso05c5u7] {
    gap: 0.75rem !important;
}

/* Profile picture animation */
.profile-img[b-nkso05c5u7] {
    transition: transform 0.2s ease-in-out;
}

.profile-img:hover[b-nkso05c5u7] {
    transform: scale(1.05);
}

/* Card shadow on hover */
.card:hover[b-nkso05c5u7] {
    box-shadow: 0 0.5rem 1rem rgba(0, 0, 0, 0.075);
    transition: box-shadow 0.15s ease-in-out;
}

/* Arrow styling */
.fa-arrow-right[b-nkso05c5u7] {
    color: #6c757d !important;
    animation: pulse-b-nkso05c5u7 2s infinite;
}

@keyframes pulse-b-nkso05c5u7 {
    0%, 100% {
        opacity: 1;
    }
    50% {
        opacity: 0.7;
    }
}
/* /Pages/UserGroups/UserGroupsView.razor.rz.scp.css */
/* Scoped to UserGroupsView. Everything here is either a layout Tailwind cannot
   express in one class (the overlapping avatar stack) or state styling that
   reads better as one rule than as a string of conditional utilities. */

.pagehead[b-jalwzb7z8z] {
    display: flex;
    align-items: flex-start;
    gap: 16px;
    flex-wrap: wrap;
    margin-bottom: 16px;
}

.countpair[b-jalwzb7z8z] {
    display: flex;
    gap: 1px;
    background: var(--border-default);
    border: 1px solid var(--border-default);
    border-radius: 9px;
    overflow: hidden;
}

.countpair > div[b-jalwzb7z8z] {
    background: var(--content-bg);
    padding: 5px 12px;
}

.countpair .cv[b-jalwzb7z8z] {
    font-size: 15px;
    font-weight: 650;
    font-variant-numeric: tabular-nums;
    line-height: 1.1;
}

.countpair .cl[b-jalwzb7z8z] {
    font-size: 10.5px;
    text-transform: uppercase;
    letter-spacing: .07em;
    color: var(--text-muted);
    font-weight: 600;
}

/* ---- directory row ---- */

.grow[b-jalwzb7z8z] {
    display: flex;
    align-items: center;
    gap: 14px;
    padding: 13px 16px;
    cursor: pointer;
    border-left: 2px solid transparent;
}

.grow + .grow[b-jalwzb7z8z],
.gbody + .grow[b-jalwzb7z8z] {
    border-top: 1px solid var(--border-default);
}

.grow:hover[b-jalwzb7z8z] {
    background: var(--hover-bg);
}

.grow:focus-visible[b-jalwzb7z8z] {
    outline: 2px solid var(--sigo-primary);
    outline-offset: -2px;
}

.grow.open[b-jalwzb7z8z] {
    background: color-mix(in oklab, var(--sigo-primary) 9%, transparent);
    border-left-color: var(--sigo-primary);
}

.caret[b-jalwzb7z8z] {
    width: 14px;
    flex: none;
    color: var(--text-subtle);
    font-size: 11px;
    transition: transform .15s;
}

.grow.open .caret[b-jalwzb7z8z] {
    transform: rotate(90deg);
    color: var(--sigo-primary);
}

@media (prefers-reduced-motion: reduce) {
    .caret[b-jalwzb7z8z] {
        transition: none;
    }
}

.gname[b-jalwzb7z8z] {
    flex: none;
    width: 190px;
    min-width: 0;
}

.gname .n[b-jalwzb7z8z] {
    font-size: 14px;
    font-weight: 600;
    letter-spacing: -.01em;
    color: var(--text-primary);
    display: flex;
    align-items: center;
    gap: 6px;
}

.gname .n .lk[b-jalwzb7z8z] {
    font-size: 10.5px;
    color: var(--text-subtle);
    font-weight: 400;
    white-space: nowrap;
}

.gname .s[b-jalwzb7z8z] {
    font-size: 11.5px;
    color: var(--text-muted);
    margin-top: 1px;
}

/* overlapping initials, the one thing a utility string cannot do cleanly */
.stack[b-jalwzb7z8z] {
    display: flex;
    flex: none;
    width: 132px;
}

.stack > span[b-jalwzb7z8z] {
    width: 26px;
    height: 26px;
    border-radius: 50%;
    display: grid;
    place-items: center;
    font-size: 9.5px;
    font-weight: 700;
    color: #fff;
    background: linear-gradient(135deg, var(--acc-hi), var(--acc-lo));
    box-shadow: 0 0 0 2px var(--content-bg);
    margin-left: -7px;
}

.stack > span:first-child[b-jalwzb7z8z] {
    margin-left: 0;
}

.stack > span.more[b-jalwzb7z8z] {
    background: var(--hover-bg);
    color: var(--text-muted);
    box-shadow: 0 0 0 2px var(--content-bg), inset 0 0 0 1px var(--border-default);
}

.reach[b-jalwzb7z8z] {
    flex: 1;
    min-width: 0;
    display: flex;
    flex-wrap: wrap;
    gap: 5px;
}

.rchip[b-jalwzb7z8z] {
    display: inline-flex;
    align-items: center;
    height: 22px;
    padding: 0 8px;
    border-radius: 6px;
    font-size: 11.5px;
    background: var(--hover-bg);
    color: var(--text-secondary);
    border: 1px solid var(--border-default);
    white-space: nowrap;
}

.rchip.mg[b-jalwzb7z8z] {
    background: color-mix(in oklab, var(--sigo-primary) 11%, transparent);
    color: var(--sigo-primary);
    border-color: color-mix(in oklab, var(--sigo-primary) 25%, transparent);
    font-weight: 600;
}

.rchip.none[b-jalwzb7z8z] {
    background: none;
    border-style: dashed;
    color: var(--text-subtle);
}

.gacts[b-jalwzb7z8z] {
    flex: none;
    display: flex;
    gap: 7px;
}

/* ---- expanded body ---- */

.gbody[b-jalwzb7z8z] {
    border-top: 1px solid var(--border-default);
    background: var(--content-bg);
}

.bsec[b-jalwzb7z8z] {
    padding: 14px 16px 14px 32px;
    border-bottom: 1px solid var(--border-default);
}

.bsec h3[b-jalwzb7z8z],
.mwrap .mh h3[b-jalwzb7z8z] {
    margin: 0;
    font-size: 11px;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: .07em;
    color: var(--text-muted);
}

.bsec h3[b-jalwzb7z8z] {
    margin-bottom: 10px;
}

.mchips[b-jalwzb7z8z] {
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
    align-items: center;
}

.mchip[b-jalwzb7z8z] {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    height: 28px;
    padding: 0 4px 0 10px;
    border-radius: 8px;
    background: var(--content-bg);
    border: 1px solid var(--border-default);
    font-size: 12.5px;
    color: var(--text-secondary);
}

.mchip button[b-jalwzb7z8z] {
    width: 20px;
    height: 20px;
    border: 0;
    border-radius: 5px;
    background: none;
    color: var(--text-subtle);
    cursor: pointer;
    font-size: 11px;
    line-height: 1;
    padding: 0;
}

.mchip button:hover[b-jalwzb7z8z] {
    background: var(--hover-bg);
    color: var(--tw-color-danger, #ef4444);
}

/* ---- permission matrix ---- */

.mwrap[b-jalwzb7z8z] {
    padding: 12px 16px 4px 32px;
}

.mwrap .mh[b-jalwzb7z8z] {
    display: flex;
    align-items: baseline;
    gap: 10px;
    flex-wrap: wrap;
    margin-bottom: 8px;
}

.mwrap .mh .hint[b-jalwzb7z8z] {
    font-size: 12.5px;
    color: var(--text-muted);
}

.lockednote[b-jalwzb7z8z],
.note[b-jalwzb7z8z] {
    display: flex;
    gap: 9px;
    align-items: flex-start;
    padding: 10px 12px;
    border-radius: 9px;
    background: var(--hover-bg);
    font-size: 12.5px;
    color: var(--text-secondary);
    line-height: 1.5;
}

.lockednote[b-jalwzb7z8z] {
    margin-bottom: 10px;
}

.note[b-jalwzb7z8z] {
    margin: 12px 16px 0 32px;
}

.lockednote i[b-jalwzb7z8z],
.note i[b-jalwzb7z8z] {
    color: var(--text-muted);
    margin-top: 2px;
}

/* app.css:499 puts `border: 1px solid #e0e0e0` on every table/th/td, which boxes
   each cell. Clear it here and draw only the horizontal rules this matrix wants. */
table.mx[b-jalwzb7z8z] {
    width: 100%;
    border-collapse: collapse;
    border: 0;
    font-size: 13px;
}

table.mx th[b-jalwzb7z8z],
table.mx td[b-jalwzb7z8z] {
    padding: 0;
    border: 0;
}

table.mx thead th[b-jalwzb7z8z] {
    padding: 6px 4px 8px;
    font-size: 11px;
    font-weight: 600;
    color: var(--text-muted);
    text-align: center;
    border-bottom: 1px solid var(--border-default);
    white-space: nowrap;
}

table.mx thead th.ft[b-jalwzb7z8z] {
    text-align: left;
    width: 34%;
}

table.mx tr.dom td[b-jalwzb7z8z] {
    padding: 14px 0 4px;
    font-size: 11px;
    font-weight: 700;
    letter-spacing: .08em;
    text-transform: uppercase;
    color: var(--text-subtle);
}

table.mx tbody tr:first-child td[b-jalwzb7z8z] {
    padding-top: 7px;
}

table.mx tr.fr td[b-jalwzb7z8z] {
    border-top: 1px solid var(--border-default);
    padding: 6px 4px;
    text-align: center;
}

table.mx tr.fr td.ft[b-jalwzb7z8z] {
    text-align: left;
    padding-left: 10px;
    border-left: 2px solid transparent;
}

table.mx tr.fr.chg td.ft[b-jalwzb7z8z] {
    border-left-color: var(--sigo-primary);
}

table.mx tr.fr:hover td[b-jalwzb7z8z] {
    background: var(--hover-bg);
}

.fname[b-jalwzb7z8z] {
    font-weight: 500;
    color: var(--text-primary);
}

.fdesc[b-jalwzb7z8z] {
    font-size: 11.5px;
    color: var(--text-muted);
    margin-top: 1px;
}

/* native control, so keyboard and screen readers keep working */
.swx[b-jalwzb7z8z] {
    width: 17px;
    height: 17px;
    accent-color: var(--sigo-primary);
    cursor: pointer;
    margin: 0;
}

.swx:disabled[b-jalwzb7z8z] {
    cursor: not-allowed;
    opacity: .45;
}

.savebar[b-jalwzb7z8z] {
    display: flex;
    align-items: center;
    gap: 12px;
    flex-wrap: wrap;
    padding: 11px 16px 11px 32px;
    margin-top: 12px;
    border-top: 1px solid var(--border-default);
    background: var(--content-bg);
    position: sticky;
    bottom: 0;
}

.savebar .msg[b-jalwzb7z8z] {
    font-size: 13px;
    color: var(--text-secondary);
}

.savebar .msg b[b-jalwzb7z8z] {
    font-weight: 600;
    color: var(--text-primary);
}

.savebar .acts[b-jalwzb7z8z] {
    margin-left: auto;
    display: flex;
    gap: 8px;
}

/* ---- modal fields ---- */

.flabel[b-jalwzb7z8z] {
    display: block;
    font-size: 12.5px;
    color: var(--text-muted);
    margin-bottom: 5px;
}

.finput[b-jalwzb7z8z] {
    width: 100%;
    height: 36px;
    border: 1px solid var(--border-default);
    border-radius: 8px;
    background: var(--content-bg);
    color: var(--text-primary);
    padding: 0 10px;
    font: inherit;
    font-size: 13.5px;
}

.finput:focus-visible[b-jalwzb7z8z] {
    outline: 2px solid var(--sigo-primary);
    outline-offset: 1px;
}

/* ---- narrow screens: the matrix is the first thing to break ---- */

@media (max-width: 900px) {
    .gname[b-jalwzb7z8z] {
        width: 100%;
        order: 1;
    }

    .stack[b-jalwzb7z8z],
    .reach[b-jalwzb7z8z] {
        order: 2;
    }

    .grow[b-jalwzb7z8z] {
        flex-wrap: wrap;
    }

    .mwrap[b-jalwzb7z8z],
    .bsec[b-jalwzb7z8z],
    .savebar[b-jalwzb7z8z] {
        padding-left: 16px;
    }

    .note[b-jalwzb7z8z] {
        margin-left: 16px;
    }

    .mwrap[b-jalwzb7z8z] {
        overflow-x: auto;
    }

    table.mx[b-jalwzb7z8z] {
        min-width: 720px;
    }
}