/* _content/Ledgerwise/Components/Account/Pages/ForgotPassword.razor.rz.scp.css */
/* Source: ledgerwise-app src/app/(auth)/forgot-password/page.tsx.
   Page-level layout + typography only — field/button chrome lives in the
   LwTextField / LwButton atoms. Spec mirrors Login (h1 22px/32px/700
   tracking-tight; gaps 40/16px); subtitle here is MUTED-foreground (unlike
   Login's, which is foreground); back link 14px/600 foreground, centered,
   hover -> brand accent. */

.lw-fp[b-puqv7ccjt1]  .lw-fp-form {
    display: flex;
    flex-direction: column;
    gap: 40px;
    font-family: var(--lw-font-family);
    color: var(--lw-gray-phantom);
}

.lw-fp[b-puqv7ccjt1]  .lw-fp-header {
    display: flex;
    flex-direction: column;
    gap: 16px;
}

.lw-fp[b-puqv7ccjt1]  .lw-fp-fields {
    display: flex;
    flex-direction: column;
    /* 16px + 4px internal space below MudBlazor's input control = 20px. */
    gap: 16px;
}

.lw-fp[b-puqv7ccjt1]  .mud-typography {
    font-family: inherit;
    color: var(--lw-gray-phantom);
}

.lw-fp[b-puqv7ccjt1]  h5.mud-typography {
    font-size: 22px;
    line-height: 32px;
    font-weight: 700;
    letter-spacing: -0.025em; /* tracking-tight */
}

.lw-fp[b-puqv7ccjt1]  .lw-fp-sub {
    color: var(--lw-gray-space); /* text-muted-foreground */
    line-height: 22px;
}

.lw-fp[b-puqv7ccjt1]  .lw-fp-validation {
    font-size: 14px;
    line-height: 22px;
    color: var(--lw-status-error-fg);
}

.lw-fp[b-puqv7ccjt1]  .lw-fp-back {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 4px;
    font-size: 14px;
    line-height: 22px;
    font-weight: 600;
    color: var(--lw-gray-phantom);
    text-decoration: none;
    transition: color 0.15s ease;
}

.lw-fp[b-puqv7ccjt1]  .lw-fp-back:hover {
    color: var(--lw-primary-blue);
}
/* _content/Ledgerwise/Components/Account/Pages/Login.razor.rz.scp.css */
/* Source: ledgerwise-app src/app/(auth)/login/page.tsx.
   Page-level layout + typography only — field/button chrome lives in the
   LwTextField / LwButton atoms (Components/Shared/Atoms). */

.lw-login[b-qhs3rru1rn]  .lw-login-form {
    display: flex;
    flex-direction: column;
    gap: 40px;
    font-family: var(--lw-font-family);
    color: var(--lw-gray-phantom);
}

.lw-login[b-qhs3rru1rn]  .lw-login-header {
    display: flex;
    flex-direction: column;
    gap: 16px;
}

.lw-login[b-qhs3rru1rn]  .lw-login-fields {
    display: flex;
    flex-direction: column;
    /* 16px + 4px internal space below MudBlazor's input control = 20px
       effective, matching ledgerwise-app's gap-5. */
    gap: 16px;
}

.lw-login[b-qhs3rru1rn]  .mud-typography {
    font-family: inherit;
    color: var(--lw-gray-phantom);
}

.lw-login[b-qhs3rru1rn]  h5.mud-typography {
    font-size: 22px;
    line-height: 32px;
    font-weight: 700;
    letter-spacing: -0.025em; /* tracking-tight */
}

/* Mud's color helper classes on links are !important; match specificity. */
.lw-login[b-qhs3rru1rn]  a.mud-link {
    font-family: inherit;
    color: var(--lw-primary-dark) !important;
    font-weight: 600;
}

.lw-login[b-qhs3rru1rn]  a.lw-login-forgot {
    color: var(--lw-gray-phantom) !important;
    font-weight: 400;
    text-decoration: underline;
}

/* AB#638: staff-account auto-redirect step (email-first routing to Entra ID). */
.lw-login[b-qhs3rru1rn]  .lw-login-sso-form {
    display: flex;
    flex-direction: column;
    gap: 16px;
}

.lw-login[b-qhs3rru1rn]  .lw-login-sso-message {
    color: var(--lw-gray-graphite);
}
/* _content/Ledgerwise/Components/Account/Pages/Register.razor.rz.scp.css */
/* Source: ledgerwise-app src/app/(auth)/register/page.tsx.
   Page-level layout + typography only — chrome lives in the atoms.
   Ref: header gaps as Login; fields = outer gap-6 (24px) wrapping an inner
   gap-5 (20px effective) group of text fields. */

.lw-reg[b-87om8yd10z]  .lw-reg-form {
    display: flex;
    flex-direction: column;
    gap: 40px;
    font-family: var(--lw-font-family);
    color: var(--lw-gray-phantom);
}

.lw-reg[b-87om8yd10z]  .lw-reg-header {
    display: flex;
    flex-direction: column;
    gap: 16px;
}

.lw-reg[b-87om8yd10z]  .lw-reg-fields {
    display: flex;
    flex-direction: column;
    gap: 24px; /* ref gap-6 between field group / terms / error / button */
}

.lw-reg[b-87om8yd10z]  .lw-reg-fieldgroup {
    display: flex;
    flex-direction: column;
    /* 16px + 4px Mud internal space = 20px effective (ref gap-5) */
    gap: 16px;
}

.lw-reg[b-87om8yd10z]  .mud-typography {
    font-family: inherit;
    color: var(--lw-gray-phantom);
}

.lw-reg[b-87om8yd10z]  h5.mud-typography {
    font-size: 22px;
    line-height: 32px;
    font-weight: 700;
    letter-spacing: -0.025em; /* tracking-tight */
}

/* Mud's color helper classes on links are !important; match specificity. */
.lw-reg[b-87om8yd10z]  a.mud-link {
    font-family: inherit;
    color: var(--lw-primary-dark) !important;
    font-weight: 600;
}

.lw-reg[b-87om8yd10z]  .lw-reg-validation {
    display: block;
    margin-top: 6px;
    font-size: 14px;
    line-height: 22px;
    color: var(--lw-status-error-fg);
}

/* Proposal-acceptance variant -- reference invite-accept page
   (src/app/(invite)/invite/[token]/accept/page.tsx, measured 2026-07-19):
   invite layout = full-height muted surface, centered max-w-[420px] column
   (top-aligned mobile, centered md+); header gap-2, title text-xl md:2xl
   bold tracking-tight, sub 14/relaxed w/ font-medium foreground strong;
   form mt-6 md:mt-8 gap-5. */

.reg-invite[b-87om8yd10z] {
    min-height: 100dvh;
    box-sizing: border-box;
    display: flex;
    align-items: flex-start;
    justify-content: center;
    background: var(--lw-bg-muted);
    padding: 32px 20px;
    overflow-y: auto;
}

@media (min-width: 768px) {
    .reg-invite[b-87om8yd10z] { align-items: center; padding: 40px 20px; }
}

.reg-invite__col[b-87om8yd10z] {
    width: 100%;
    max-width: 420px;
}

.reg-invite[b-87om8yd10z]  .reg-invite__header {
    display: flex;
    flex-direction: column;
    gap: 8px;
}

.reg-invite[b-87om8yd10z]  .reg-invite__title {
    margin: 0;
    font-family: var(--lw-font-family-heading, inherit);
    font-size: 1.25rem;
    font-weight: 700;
    letter-spacing: var(--lw-tracking-tight);
    color: var(--lw-text-primary);
}

@media (min-width: 768px) {
    .reg-invite[b-87om8yd10z]  .reg-invite__title { font-size: 1.5rem; }
}

.reg-invite[b-87om8yd10z]  .reg-invite__sub {
    margin: 0;
    font-size: 0.875rem;
    line-height: 1.625;
    color: var(--lw-gray-graphite);
}

.reg-invite[b-87om8yd10z]  .reg-invite__sub strong {
    font-weight: 500;
    color: var(--lw-text-primary);
}

.reg-invite[b-87om8yd10z]  .reg-invite__form {
    display: flex;
    flex-direction: column;
    gap: 24px;
    font-family: var(--lw-font-family);
}

@media (min-width: 768px) {
    .reg-invite[b-87om8yd10z]  .reg-invite__form { gap: 32px; }
}

.reg-invite[b-87om8yd10z]  .reg-invite__fields {
    display: flex;
    flex-direction: column;
    gap: 20px;
}

.reg-invite[b-87om8yd10z]  .reg-invite__alt {
    margin: 0;
    font-size: 0.875rem;
    line-height: 22px;
    color: var(--lw-gray-graphite);
}
/* _content/Ledgerwise/Components/Layout/MainLayout.razor.rz.scp.css */
/* ================================================================
   MainLayout -- shell styles
   ================================================================ */

/* AppBar styling (border, height, toolbar padding) lives in wwwroot/app.css --
   MudAppBar is a subcomponent so it never receives this file's scope attribute. */

/* -- Sidebar toggle (inline in header) -- */
.lw-header-toggle[b-abq463np8y] {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 20px;
    height: 20px;
    flex-shrink: 0;
    background: none;
    border: none;
    cursor: pointer;
    color: var(--lw-gray-graphite);
    padding: 0;
    transition: color 0.15s;
}

.lw-header-toggle:hover[b-abq463np8y] {
    color: var(--lw-text-primary);
}

/* -- Breadcrumb -- */
.lw-breadcrumb[b-abq463np8y] {
    display: flex;
    align-items: center;
    gap: 16px;
    font-size: 0.875rem;
    line-height: 22px;
}

.lw-breadcrumb-root[b-abq463np8y] {
    color: var(--lw-text-primary);
    text-decoration: none;
    transition: color 0.15s;
}

.lw-breadcrumb-root:hover[b-abq463np8y] {
    color: var(--lw-gray-graphite);
}

.lw-breadcrumb-sep[b-abq463np8y] {
    /* ledgerwise-ui: lucide ChevronRight 14px, muted-foreground */
    color: var(--lw-gray-space);
    flex-shrink: 0;
}

.lw-breadcrumb-current[b-abq463np8y] {
    color: var(--lw-gray-space);
    max-width: 300px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

/* -- Header round icon button (help; bell later) -- reference:
   ledgerwise-ui button.tsx variant ghost + size icon-round ("size-8
   rounded-full"), text-content-secondary, hover:bg-accent
   (rgba(145,158,171,.16) -- same fill as the account trigger hover). */
.lw-header-iconbtn[b-abq463np8y] {
    align-items: center;
    border-radius: 9999px;
    color: var(--lw-gray-graphite);
    display: flex;
    height: 32px;
    justify-content: center;
    text-decoration: none;
    transition: background-color 0.2s;
    width: 32px;
}

.lw-header-iconbtn:hover[b-abq463np8y] {
    background-color: rgba(145, 158, 171, 0.16);
    color: var(--lw-gray-graphite);
    text-decoration: none;
}

/* -- Account menu separator -- */
.lw-header-account-sep[b-abq463np8y] {
    display: flex;
    align-items: center;
    border-left: 1px solid rgba(145, 158, 171, 0.2);
    padding-left: 12px;
    margin-left: 4px;
}

/* -- Account trigger button -- */
.lw-account-trigger[b-abq463np8y] {
    border-radius: 9999px; /* reference trigger is a pill (rounded-full) */
    display: flex;
    align-items: center;
    gap: 12px;
    border: 1px solid transparent;
    background: none;
    cursor: pointer;
    padding: 6px 10px;
    font-family: var(--lw-font-family, sans-serif);
    transition: border-color 0.2s, background-color 0.2s;
}

.lw-account-trigger:hover[b-abq463np8y],
.lw-account-trigger-open[b-abq463np8y] {
    border-color: rgba(145, 158, 171, 0.2);
    background-color: rgba(145, 158, 171, 0.16);
}

.lw-account-avatar[b-abq463np8y] {
    border-radius: 9999px; /* person avatar = circle (ledgerwise-ui avatar.tsx) */
    display: flex;
    align-items: center;
    justify-content: center;
    width: 28px;
    height: 28px;
    flex-shrink: 0;
    background-color: var(--lw-primary-blue);
}

.lw-account-initials[b-abq463np8y] {
    font-size: 10px;
    font-weight: 600;
    color: var(--lw-white);
    line-height: 1;
}

.lw-account-name[b-abq463np8y] {
    font-size: 0.875rem;
    font-weight: 500;
    line-height: 22px;
    color: var(--lw-text-primary);
    white-space: nowrap;
}

.lw-account-chevron[b-abq463np8y] {
    color: var(--lw-gray-space);
    flex-shrink: 0;
    transition: transform 0.2s;
}

.lw-account-trigger:hover .lw-account-chevron[b-abq463np8y],
.lw-account-trigger-open .lw-account-chevron[b-abq463np8y] {
    color: var(--lw-gray-graphite);
}

.lw-account-chevron-open[b-abq463np8y] {
    transform: rotate(180deg);
}

/* -- Account dropdown (fixed, outside stacking contexts) -- */
.lw-account-backdrop[b-abq463np8y] {
    position: fixed;
    inset: 0;
    z-index: 1999;
}

@keyframes lw-account-dropdown-in-b-abq463np8y {
    from { opacity: 0; transform: scale(0.95) translateY(-4px); }
    to   { opacity: 1; transform: scale(1) translateY(0); }
}

.lw-account-dropdown[b-abq463np8y] {
    transform-origin: top right;
    animation: lw-account-dropdown-in-b-abq463np8y 150ms ease-out both;
    position: fixed;
    top: 60px; /* small gap below the 56px bar, like the reference */
    right: 24px;
    width: 231px;
    border-radius: var(--lw-radius-card); /* reference rounded-card = 8px */
    overflow: hidden;
    background: var(--lw-white);
    padding: 8px 0;
    z-index: 2000;
    box-shadow: 0px 0px 2px rgba(145, 158, 171, 0.24), -20px 20px 40px rgba(145, 158, 171, 0.24);
}

.lw-account-info-row[b-abq463np8y] {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 12px 20px;
}

.lw-account-avatar-lg[b-abq463np8y] {
    border-radius: 9999px;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 40px;
    height: 40px;
    flex-shrink: 0;
    background-color: var(--lw-primary-blue);
}

.lw-account-initials-lg[b-abq463np8y] {
    font-size: 0.875rem;
    font-weight: 600;
    color: var(--lw-white);
}

.lw-account-info-text[b-abq463np8y] {
    min-width: 0;
    flex: 1;
}

.lw-account-info-name[b-abq463np8y] {
    font-size: 0.875rem;
    font-weight: 600;
    line-height: 22px;
    color: var(--lw-text-primary);
    margin: 0;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.lw-account-info-email[b-abq463np8y] {
    font-size: 0.875rem;
    line-height: 22px;
    color: var(--lw-gray-graphite);
    margin: 0;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.lw-account-divider[b-abq463np8y] {
    border-top: 1px solid rgba(145, 158, 171, 0.2);
    margin: 0 8px;
}

.lw-account-item[b-abq463np8y] {
    display: flex;
    align-items: center;
    gap: 16px;
    width: 100%;
    padding: 6px 20px;
    font-size: 0.875rem;
    line-height: 22px;
    color: var(--lw-text-primary);
    text-decoration: none;
    transition: background-color 0.15s;
    font-family: var(--lw-font-family, sans-serif);
}

.lw-account-item:hover[b-abq463np8y] {
    background-color: rgba(145, 158, 171, 0.16);
}

.lw-account-item svg[b-abq463np8y] {
    flex-shrink: 0;
    color: var(--lw-gray-graphite);
}

.lw-account-logout-form[b-abq463np8y] {
    display: block;
    width: 100%;
    margin: 0;
    padding: 0;
}

.lw-account-item-btn[b-abq463np8y] {
    display: flex !important;
    align-items: center !important;
    justify-content: flex-start !important;
    gap: 16px !important;
    width: 100% !important;
    padding: 6px 20px !important;
    font-size: 0.875rem !important;
    line-height: 22px !important;
    color: var(--lw-text-primary) !important;
    font-family: var(--lw-font-family, sans-serif) !important;
    -webkit-appearance: none;
    appearance: none;
    background: none;
    border: none;
    cursor: pointer;
    text-align: left;
    box-sizing: border-box;
    margin: 0;
    text-decoration: none;
    transition: background-color 0.15s;
}

.lw-account-item-btn:hover[b-abq463np8y] {
    background-color: rgba(145, 158, 171, 0.16);
}

.lw-account-item-btn svg[b-abq463np8y] {
    flex-shrink: 0;
    color: var(--lw-gray-graphite);
}

/* -- Drawer (sidebar) -- */
[b-abq463np8y] .lw-drawer,
[b-abq463np8y] .lw-drawer.mud-drawer {
    background-color: var(--lw-primary-dark, #020B2B);
    color: var(--lw-white);
    border-right: 1px solid rgba(255, 255, 255, 0.1);
}

[b-abq463np8y] .lw-drawer .mud-drawer-content,
[b-abq463np8y] .mud-drawer.lw-drawer .mud-drawer-content {
    background-color: var(--lw-primary-dark, #020B2B);
}

/* -- Drawer header / logo area -- */
[b-abq463np8y] .lw-drawer-header {
    background-color: var(--lw-primary-dark, #020B2B);
    padding: 0 24px;
    min-height: 56px;
    height: 56px;
    display: flex;
    align-items: center;
    justify-content: flex-start;
    border-bottom: 1px solid rgba(255, 255, 255, 0.1);
}

.lw-brand-link[b-abq463np8y] {
    display: flex;
    align-items: center;
    gap: 8px;
    text-decoration: none;
}

.lw-brand-link-mini[b-abq463np8y] {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 100%;
}

.lw-brand-emblem[b-abq463np8y] {
    width: 20px;
    height: 20px;
    flex-shrink: 0;
    object-fit: contain;
}

/* Full wordmark (emblem + "Ledgerwise") shown in the expanded drawer. The
   wordmark glyphs are baked into the SVG so the brand typeface renders exactly
   as designed -- do NOT substitute an HTML text span in a web font. Matches
   ledgerwise-ui's side-nav: h-6 (24px) w-auto. */
.lw-brand-full[b-abq463np8y] {
    height: 24px;
    width: auto;
    display: block;
}

/* -- Main content area -- */
/* Match ledgerwise-ui's <main className="...bg-muted">: the full-bleed content
   area carries the muted (#F0F3F6) background, and the centered .lw-content-shell
   sits transparently on top. Painting white here (the old behavior) clipped each
   page's own muted wrap to the 1400px shell, producing a gray-on-white boundary. */
/* WARNING (verified via live DOM, 2026-07-12): these ::deep rules NEVER
   MATCH -- MainLayout has no plain ancestor element above MudMainContent to
   carry the scope attribute, so this block is dead code. The live
   main-content height-chain rules are in wwwroot/css/mudblazor-overrides.css.
   Kept for the record of intent (muted bg / 1400px cap were never applied);
   deleting or resurrecting them is a separate, visible design decision. */
[b-abq463np8y] .lw-main-content {
    background-color: var(--lw-bg-muted);
    min-height: 100vh;
    font-family: var(--lw-font-family, sans-serif);
}

/* Match ledgerwise-ui: center page content and cap at 1400px instead of
   stretching edge-to-edge. MudBlazor's MaxWidth enum has no 1400px step,
   so this is applied as a class override. */
[b-abq463np8y] .lw-content-shell {
    max-width: 1400px;
    margin-inline: auto;
}

/* -- Admin shadow banner -- */
/* Plain element authored in MainLayout.razor, so (unlike the dead ::deep rules
   above) these scoped selectors match. Restyled 2026-07-28 off the solid gold
   strip onto the status-warning tint vocabulary (same family as the warning
   StatusChip/LwCardNote): soft amber band, warning-fg text, outline-action
   stop button. */
.lw-shadow-banner[b-abq463np8y] {
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 8px 24px;
    background-color: var(--lw-status-warning-bg);
    border-bottom: 1px solid var(--lw-border);
    color: var(--lw-status-warning-fg);
    font-family: var(--lw-font-family, sans-serif);
    font-size: 13px;
    line-height: 18px;
}

.lw-shadow-banner svg[b-abq463np8y] {
    flex-shrink: 0;
    width: 15px;
    height: 15px;
}

.lw-shadow-banner-text strong[b-abq463np8y] {
    font-weight: 600;
}

.lw-shadow-banner-stop[b-abq463np8y] {
    margin-left: auto;
    flex-shrink: 0;
    border: 1px solid var(--lw-border);
    background: var(--lw-white);
    color: var(--lw-text-primary);
    border-radius: var(--lw-radius-control, 8px);
    padding: 4px 12px;
    font-family: inherit;
    font-size: 12px;
    font-weight: 600;
    line-height: 18px;
    cursor: pointer;
    transition: background 0.15s ease;
}

.lw-shadow-banner-stop:hover[b-abq463np8y] {
    background-color: var(--lw-bg-muted);
}

/* -- Error UI -- */
#blazor-error-ui[b-abq463np8y] {
    color-scheme: light only;
    background: lightyellow;
    bottom: 0;
    box-shadow: 0 -1px 2px rgba(0, 0, 0, 0.2);
    box-sizing: border-box;
    display: none;
    left: 0;
    padding: 0.6rem 1.25rem 0.7rem 1.25rem;
    position: fixed;
    width: 100%;
    z-index: 1000;
}

#blazor-error-ui .dismiss[b-abq463np8y] {
    cursor: pointer;
    position: absolute;
    right: 0.75rem;
    top: 0.5rem;
}

/* ================================================================
   Mobile shell -- mirrors ledgerwise-ui mobile-header.tsx +
   mobile-drawer.tsx. Everything below is gated by media queries:
   mobile bits render < 768px; desktop bits hide there.
   ================================================================ */

.lw-mobile-menu-btn[b-abq463np8y],
.lw-mobile-emblem[b-abq463np8y] {
    display: none;
}

/* Backdrop: black/40 + blur (reference), above the appbar. */
.lw-mobile-backdrop[b-abq463np8y] {
    display: none;
    position: fixed;
    inset: 0;
    z-index: 2500;
    background: rgba(0, 0, 0, 0.4);
    -webkit-backdrop-filter: blur(4px);
    backdrop-filter: blur(4px);
    opacity: 0;
    visibility: hidden;
    transition: opacity 0.2s ease, visibility 0.2s;
    pointer-events: none;
}

.lw-mobile-backdrop.lw-open[b-abq463np8y] {
    opacity: 1;
    visibility: visible;
    pointer-events: auto;
}

/* Sheet: full width, slides from the top, max 85vh. Mounted once and toggled
   via .lw-open so NavMenu state survives; transform transition gives enter
   AND exit animation. */
.lw-mobile-sheet[b-abq463np8y] {
    display: none;
    position: fixed;
    inset: 0 0 auto 0;
    z-index: 2600;
    max-height: 85vh;
    flex-direction: column;
    background: var(--lw-white);
    box-shadow: 0 25px 50px -12px rgba(0, 0, 0, 0.25);
    transform: translateY(-100%);
    visibility: hidden;
    transition: transform 0.3s cubic-bezier(0.22, 1.1, 0.36, 1), visibility 0.3s;
    pointer-events: none;
}

.lw-mobile-sheet.lw-open[b-abq463np8y] {
    transform: translateY(0);
    visibility: visible;
    pointer-events: auto;
}

.lw-mobile-sheet-header[b-abq463np8y] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    height: 56px;
    flex-shrink: 0;
    padding: 0 16px;
    border-bottom: 1px solid var(--lw-border);
}

.lw-mobile-sheet-logo[b-abq463np8y] {
    height: 26px;
    width: auto;
}

.lw-mobile-sheet-close[b-abq463np8y] {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 36px;
    height: 36px;
    border: 0;
    background: transparent;
    color: var(--lw-gray-space);
    cursor: pointer;
    transition: background-color 0.15s ease, color 0.15s ease;
}

.lw-mobile-sheet-close:hover[b-abq463np8y] {
    background: var(--lw-bg-muted);
    color: var(--lw-text-primary);
}

.lw-mobile-sheet-nav[b-abq463np8y] {
    flex: 1;
    overflow-y: auto;
}

.lw-mobile-divider[b-abq463np8y] {
    border-top: 1px solid var(--lw-border);
    margin: 0 16px;
}

/* Footer: user row + actions (reference mobile-drawer account footer). */
.lw-mobile-sheet-footer[b-abq463np8y] {
    flex-shrink: 0;
    border-top: 1px solid var(--lw-border);
    padding-bottom: 8px;
}

.lw-mobile-user-row[b-abq463np8y] {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 12px 16px;
}

.lw-mobile-user-avatar[b-abq463np8y] {
    width: 36px;
    height: 36px;
}

.lw-mobile-user-avatar .lw-account-initials[b-abq463np8y] {
    font-size: 13px;
}

.lw-mobile-user-text[b-abq463np8y] {
    min-width: 0;
    flex: 1;
}

.lw-mobile-user-name[b-abq463np8y] {
    margin: 0;
    font-size: 14px;
    line-height: 22px;
    font-weight: 600;
    color: var(--lw-text-primary);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.lw-mobile-user-email[b-abq463np8y] {
    margin: 0;
    font-size: 12px;
    line-height: 18px;
    color: var(--lw-gray-space);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.lw-mobile-action[b-abq463np8y] {
    display: flex;
    align-items: center;
    gap: 12px;
    height: 44px;
    padding: 0 16px;
    font-size: 14px;
    font-weight: 500;
    color: var(--lw-text-primary);
    text-decoration: none;
    transition: background-color 0.15s ease;
}

.lw-mobile-action svg[b-abq463np8y] {
    color: var(--lw-gray-graphite);
    flex-shrink: 0;
}

.lw-mobile-action:active[b-abq463np8y],
.lw-mobile-action:hover[b-abq463np8y] {
    background: var(--lw-bg-muted);
}

.lw-mobile-logout-form[b-abq463np8y] {
    display: block;
    margin: 0;
    padding: 0;
}

.lw-mobile-action-btn[b-abq463np8y] {
    width: 100%;
    border: 0;
    background: transparent;
    cursor: pointer;
    font-family: inherit;
    /* native buttons center their content; align like the anchor rows */
    justify-content: flex-start;
    text-align: left;
}

/* -- Breakpoint wiring -- */
@media (max-width: 767.98px) {
    .lw-mobile-menu-btn[b-abq463np8y] {
        display: flex;
        align-items: center;
        justify-content: center;
        width: 40px;
        height: 40px;
        border: 0;
        background: transparent;
        color: var(--lw-text-primary);
        cursor: pointer;
        padding: 0;
    }

    .lw-mobile-emblem[b-abq463np8y] {
        display: block;
        width: 20px;
        height: 20px;
        margin-left: 4px;
    }

    .lw-mobile-backdrop[b-abq463np8y] { display: block; }
    .lw-mobile-sheet[b-abq463np8y] { display: flex; }

    /* Hide desktop-only appbar parts (reference mobile header: hamburger +
       emblem left, compact account right -- no toggle/breadcrumb). */
    .lw-header-toggle[b-abq463np8y],
    .lw-breadcrumb[b-abq463np8y] {
        display: none;
    }

    /* Compact account trigger: avatar only (24px, no name/chevron/divider). */
    .lw-header-account-sep[b-abq463np8y] {
        border-left: 0;
        padding-left: 0;
        margin-left: 0;
    }

    .lw-account-name[b-abq463np8y],
    .lw-account-chevron[b-abq463np8y] {
        display: none;
    }

    .lw-account-trigger[b-abq463np8y] {
        padding: 6px;
    }

    /* Header trigger only -- the sheet footer avatar (.lw-mobile-user-avatar)
       shares .lw-account-avatar and must stay 36px. */
    .lw-account-trigger .lw-account-avatar[b-abq463np8y] {
        width: 24px;
        height: 24px;
    }

    .lw-account-dropdown[b-abq463np8y] {
        right: 8px;
    }
}
/* _content/Ledgerwise/Components/Layout/NavMenu.razor.rz.scp.css */
/* ================================================================
   NavMenu -- mirrors ledgerwise-ui nav-item.tsx + nav-category-header.tsx
   Source tokens: ledgerwise-ui/src/app/globals.css :root sidebar-* vars
   ================================================================ */

/* -- Outer wrappers -- px-2 pt-4 (8px horizontal, 16px top) -- */
.lw-nav-wrapper[b-78vpinrwl0] {
    padding: 16px 8px 0 8px;
}

[b-78vpinrwl0] .lw-nav-menu,
[b-78vpinrwl0] .lw-nav-menu .mud-nav-menu {
    padding: 0;
}

/* side-nav.tsx list: flex-col gap-0.5 (2px between items) */
[b-78vpinrwl0] .lw-nav-menu .mud-nav-menu,
[b-78vpinrwl0] .lw-nav-menu {
    display: flex;
    flex-direction: column;
    gap: 2px;
}

[b-78vpinrwl0] .lw-nav-menu .mud-nav-link {
    /* nav-item.tsx (2026-07-10 rev): gap-3 px-3 py-3 rounded-md(8px) */
    position: relative;
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 12px;
    margin: 0;
    border-radius: var(--lw-radius-control);

    /* label: text-sm / 500 / 22px */
    font-family: var(--lw-font-family, sans-serif);
    font-size: 14px;
    font-weight: 500;
    line-height: 22px;

    color: var(--lw-sidebar-text-muted);
    transition: background-color 150ms, color 150ms;
}

[b-78vpinrwl0] .lw-nav-menu .mud-nav-link:hover {
    background-color: var(--lw-sidebar-hover-bg);
    color: var(--lw-sidebar-text-hover);
}

/* Mirror Mud's own high-specificity active selector
   (.mud-navmenu.mud-navmenu-default .mud-nav-link.active:not(...)) or its
   palette colors win over ours. */
[b-78vpinrwl0] .lw-nav-menu.mud-navmenu .mud-nav-link.active:not(.mud-nav-link-disabled),
[b-78vpinrwl0] .lw-nav-menu.mud-navmenu .mud-nav-link.active:not(.mud-nav-link-disabled):hover:not(.mud-nav-link-disabled) {
    background-color: var(--lw-sidebar-active-bg);
    color: var(--lw-sidebar-text-active);
    font-weight: 500;
}

/* Active item's tapered gold accent bar (nav-item.tsx: 4px warning-solid,
   inset 6px top/bottom, angled ends via clip-path). */
[b-78vpinrwl0] .lw-nav-menu .mud-nav-link.active::before {
    content: "";
    position: absolute;
    left: 0;
    top: 6px;
    bottom: 6px;
    width: 4px;
    background: var(--lw-warning-solid);
    clip-path: polygon(0 0, 100% 3px, 100% calc(100% - 3px), 0 100%);
}

/* Icons -- Icon className="size-[18px] shrink-0" */
[b-78vpinrwl0] .lw-nav-menu .mud-nav-link .mud-nav-link-icon,
[b-78vpinrwl0] .lw-nav-menu .mud-nav-link .mud-nav-link-icon .mud-icon-root,
[b-78vpinrwl0] .lw-nav-menu .mud-nav-link .mud-icon-root {
    color: var(--lw-sidebar-text-muted) !important;
    font-size: 18px !important;
    width: 18px !important;
    height: 18px !important;
    flex-shrink: 0;
    margin-right: 0;
}

/* Mud adds margin-inline-start: 12px to the label span, which stacks on the
   12px flex gap above and doubles the icon-label distance -- zero it so the
   gap alone matches nav-item.tsx gap-3 (12px).
   Mud also wraps ALL child content (label + count badge) in this one span, so
   it has to stretch and lay out as a flex row for the badge's margin-left:auto
   to push it to the right edge of the nav row. */
[b-78vpinrwl0] .lw-nav-menu .mud-nav-link .mud-nav-link-text {
    margin-left: 0;
    margin-inline-start: 0;
    flex: 1 1 auto;
    min-width: 0;
    display: flex;
    align-items: center;
}

[b-78vpinrwl0] .lw-nav-menu .mud-nav-link:hover .mud-nav-link-icon,
[b-78vpinrwl0] .lw-nav-menu .mud-nav-link:hover .mud-nav-link-icon .mud-icon-root,
[b-78vpinrwl0] .lw-nav-menu .mud-nav-link:hover .mud-icon-root {
    color: var(--lw-sidebar-text-hover) !important;
}

[b-78vpinrwl0] .lw-nav-menu .mud-nav-link.active .mud-nav-link-icon,
[b-78vpinrwl0] .lw-nav-menu .mud-nav-link.active .mud-nav-link-icon .mud-icon-root,
[b-78vpinrwl0] .lw-nav-menu .mud-nav-link.active .mud-icon-root {
    color: var(--lw-sidebar-text-active) !important;
}

/* Section headers -- nav-category-header.tsx: pl-4 py-2, text-xs font-bold uppercase leading-[18px] */
[b-78vpinrwl0] .lw-nav-section-label {
    font-family: var(--lw-font-family, sans-serif);
    font-size: 12px;
    font-weight: 700;
    line-height: 18px;
    text-transform: uppercase;
    color: rgba(255, 255, 255, 0.48);
    padding: 8px 0 8px 16px;
    margin: 0;
    user-select: none;
}

/* Nav count badge -- rendered by the shared CountBadge (Sidebar tone);
   NavMenu only owns its right-alignment within the nav row. */
[b-78vpinrwl0] .lw-nav-badge-pos {
    margin-left: auto;
}

/* -- Bottom section pinned to drawer bottom -- workspace-badge.tsx container: border-t p-2 (2026-07-12) -- */
.lw-nav-bottom[b-78vpinrwl0] {
    position: absolute;
    bottom: 0;
    left: 0;
    right: 0;
    padding: 8px;
    border-top: 1px solid rgba(255, 255, 255, 0.1);
    background: var(--lw-primary-dark);
}

/* -- Workspace badge pinned at bottom of sidebar -- workspace-badge.tsx link: gap-3 px-2.5 py-2 rounded-md border border-transparent -- */
.lw-workspace-badge[b-78vpinrwl0] {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 8px 10px;
    border: 1px solid transparent;
    border-radius: var(--lw-radius-control);
    text-decoration: none;
    transition: background-color 200ms, border-color 200ms;
}

.lw-workspace-badge:hover[b-78vpinrwl0] {
    background-color: rgba(255, 255, 255, 0.08);
    border-color: rgba(255, 255, 255, 0.1);
}

.lw-workspace-collapsed[b-78vpinrwl0] {
    justify-content: center;
    padding: 8px;
}

.lw-workspace-avatar[b-78vpinrwl0] {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 32px;
    height: 32px;
    flex-shrink: 0;
    border-radius: var(--lw-radius-control);
    background: linear-gradient(135deg, var(--lw-primary-blue) 0%, var(--lw-primary-blue-light) 50%, var(--lw-primary-gold) 100%);
}

.lw-workspace-initials[b-78vpinrwl0] {
    font-family: var(--lw-font-family, sans-serif);
    font-size: 11px;
    font-weight: 700;
    letter-spacing: 0.05em;
    color: var(--lw-white);
}

.lw-workspace-info[b-78vpinrwl0] {
    min-width: 0;
    flex: 1;
}

.lw-workspace-name[b-78vpinrwl0] {
    font-family: var(--lw-font-family, sans-serif);
    font-size: 14px;
    font-weight: 500;
    line-height: 1.25;
    color: var(--lw-sidebar-text-active);
    margin: 0;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.lw-workspace-role[b-78vpinrwl0] {
    font-family: var(--lw-font-family, sans-serif);
    font-size: 11px;
    line-height: 1.25;
    color: rgba(255, 255, 255, 0.48);
    margin: 0;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.lw-workspace-logo[b-78vpinrwl0] {
    width: 32px;
    height: 32px;
    flex-shrink: 0;
    object-fit: contain;
    border-radius: var(--lw-radius-control);
}

.lw-workspace-caret[b-78vpinrwl0] {
    flex-shrink: 0;
    color: rgba(255, 255, 255, 0.48);
    transition: transform 200ms, color 200ms;
}

.lw-workspace-badge:hover .lw-workspace-caret[b-78vpinrwl0] {
    color: var(--lw-sidebar-text-active);
    transform: translateX(2px);
}

/* ================================================================
   Mobile-sheet variant -- mirrors ledgerwise-ui mobile-nav-item.tsx +
   mobile-drawer.tsx: light surface, full-bleed rows (15px/500, 20px
   icons), brand-accent active state with a 3px straight left bar.
   ================================================================ */
.lw-nav-mobile[b-78vpinrwl0] {
    padding: 8px 0;
}

.lw-nav-mobile[b-78vpinrwl0]  .lw-nav-menu,
.lw-nav-mobile[b-78vpinrwl0]  .lw-nav-menu .mud-nav-menu {
    gap: 0;
}

.lw-nav-mobile[b-78vpinrwl0]  .lw-nav-menu .mud-nav-link {
    position: relative;
    border-radius: 0;
    padding: 12px 16px;
    gap: 12px;
    font-size: 15px;
    color: var(--lw-text-primary);
}

.lw-nav-mobile[b-78vpinrwl0]  .lw-nav-menu .mud-nav-link .mud-icon-root {
    color: var(--lw-text-primary) !important;
    font-size: 20px !important;
    width: 20px !important;
    height: 20px !important;
}

.lw-nav-mobile[b-78vpinrwl0]  .lw-nav-menu .mud-nav-link:hover {
    background-color: var(--lw-bg-muted);
    color: var(--lw-text-primary);
}

.lw-nav-mobile[b-78vpinrwl0]  .lw-nav-menu.mud-navmenu .mud-nav-link.active:not(.mud-nav-link-disabled),
.lw-nav-mobile[b-78vpinrwl0]  .lw-nav-menu.mud-navmenu .mud-nav-link.active:not(.mud-nav-link-disabled):hover:not(.mud-nav-link-disabled) {
    background-color: var(--lw-status-primary-bg);
    color: var(--lw-primary-blue);
}

.lw-nav-mobile[b-78vpinrwl0]  .lw-nav-menu.mud-navmenu .mud-nav-link.active:not(.mud-nav-link-disabled) .mud-icon-root {
    color: var(--lw-primary-blue) !important;
}

/* Straight 3px accent bar, full row height (no taper on mobile). */
.lw-nav-mobile[b-78vpinrwl0]  .lw-nav-menu .mud-nav-link.active::before {
    top: 0;
    bottom: 0;
    width: 3px;
    background: var(--lw-primary-blue);
    clip-path: none;
}

/* _content/Ledgerwise/Components/Layout/OnboardingLayout.razor.rz.scp.css */
/* ============================================================
   OnboardingLayout -- dark navy wizard rail + content area
   Rail source: ledgerwise-app src/components/organisms/onboarding/
   wizard-shell.tsx + onboarding-step-nav.tsx + atoms/step-donut-ring.tsx
   Measured 2026-07-13 (localhost:3005/sub/onboarding):
   - rail var(--lw-wizard-rail-width), bg #020B2B
   - logo header 56px, border-b rgba(255,255,255,.1), px 24, logo 157x24
   - progress: px 24 / pt 20; label 12/18 #B8C9D6, count 12/18 #5C7080,
     6px gap to track; track 6px, radius full, rgba(249,250,251,.3);
     fill = 90deg gradient #3980A5 -> #5BA3C4 -> #EEB66F, 200% size shimmer
   - step nav: px 12 / pt 16, row gap 2; rows 48px (pad 10/12, radius 8,
     flex gap 12), icon box 28px w/ 16px icon, label 14/22 medium
   - state tiers (white alpha): current icon/label #fff on
     rgba(255,255,255,.12) + 4px gold #C9872A tapered notch (inset 6px);
     completed .7/.8; available .5/.6; locked .2/.3
   - donut 18px stroke 2: complete = filled #3980A5 + 10px check;
     current = breathing rgba(255,255,255,.15); locked/upcoming = .08 ring

   All values reference design tokens from wwwroot/css/branding.css
   where a token exists. Do not redefine brand colors here.
   ============================================================ */

/* -- Shell -- */
.ob-shell[b-ws7rt4aygf] {
    display: flex;
    height: 100vh;
    background-color: var(--lw-bg-muted);
}

/* -- Sidebar (dark navy rail) -- */
.ob-sidebar[b-ws7rt4aygf] {
    flex: 0 0 var(--lw-wizard-rail-width);
    max-width: var(--lw-wizard-rail-width);
    display: flex;
    flex-direction: column;
    background-color: var(--lw-primary-dark);
    overflow: hidden;
}

/* Logo header -- h-14, bottom hairline, full logo pinned 157x24 */
.ob-sidebar__logo[b-ws7rt4aygf] {
    display: flex;
    align-items: center;
    height: 56px;
    flex-shrink: 0;
    padding: 0 24px;
    border-bottom: 1px solid var(--lw-sidebar-border);
}

[b-ws7rt4aygf] .ob-sidebar__logo-link {
    display: flex;
    align-items: center;
    text-decoration: none;
}

[b-ws7rt4aygf] .ob-sidebar__logo-img {
    width: 157px;
    height: 24px;
    display: block;
}

/* Setup progress -- px-6 pt-5, label row then 6px-gapped track */
.ob-sidebar__progress[b-ws7rt4aygf] {
    flex-shrink: 0;
    padding: 20px 24px 0;
}

.ob-sidebar__progress-text[b-ws7rt4aygf] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 6px;
}

.ob-sidebar__progress-title[b-ws7rt4aygf] {
    margin: 0;
    font-family: var(--lw-font-family);
    font-size: 12px;
    font-weight: 400;
    line-height: 18px;
    color: var(--lw-sidebar-text-hover);
}

.ob-sidebar__progress-meta[b-ws7rt4aygf] {
    margin: 0;
    font-family: var(--lw-font-family);
    font-size: 12px;
    font-weight: 400;
    line-height: 18px;
    color: var(--lw-sidebar-text-subtle);
}

.ob-sidebar__progress-track[b-ws7rt4aygf] {
    position: relative;
    width: 100%;
    height: 6px;
    overflow: hidden;
    border-radius: 9999px;
    background-color: rgba(249, 250, 251, 0.3);
}

/* Animated gradient fill -- wizard-shell.tsx shimmers background-position
   over a 200%-wide blue->gold gradient while width eases to the new value. */
.ob-sidebar__progress-fill[b-ws7rt4aygf] {
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    background: linear-gradient(
        90deg,
        var(--lw-primary-blue),
        var(--lw-primary-blue-light),
        var(--lw-primary-gold)
    );
    background-size: 200% 100%;
    animation: ob-progress-shimmer-b-ws7rt4aygf 4s linear infinite;
    transition: width 0.8s ease-out;
}

@keyframes ob-progress-shimmer-b-ws7rt4aygf {
    0% { background-position: 0% 0%; }
    50% { background-position: 100% 0%; }
    100% { background-position: 0% 0%; }
}

/* Step list -- px-3 pt-4 scroll region, 2px row gap */
.ob-sidebar__steps[b-ws7rt4aygf] {
    list-style: none;
    margin: 0;
    padding: 16px 12px 0;
    flex: 1;
    overflow-y: auto;
    display: flex;
    flex-direction: column;
    gap: 2px;
}

/* The <li> is a transparent wrapper so its child (an <a> link or a <div>) becomes
   the flex row -- this preserves the existing .ob-sidebar__step layout and spacing. */
.ob-sidebar__step-item[b-ws7rt4aygf] {
    display: contents;
}

/* Row chrome -- px-3 py-2.5 rounded-md gap-3; icon and label colors are set
   per state tier below (the reference colors them independently). */
.ob-sidebar__step[b-ws7rt4aygf] {
    position: relative;
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 10px 12px;
    border-radius: 8px;
    font-family: var(--lw-font-family);
    font-size: 14px;
    font-weight: 500;
    line-height: 22px;
    letter-spacing: normal;
    transition: background-color 0.15s ease, color 0.15s ease;
}

/* Default (inert upcoming step) reads in the locked tier. */
.ob-sidebar__step .ob-sidebar__step-icon[b-ws7rt4aygf] { color: rgba(255, 255, 255, 0.2); }
.ob-sidebar__step .ob-sidebar__step-label[b-ws7rt4aygf] { color: rgba(255, 255, 255, 0.3); }

/* Reachable link that is not yet complete (client frontier) = available tier. */
a.ob-sidebar__step:not(.is-complete) .ob-sidebar__step-icon[b-ws7rt4aygf] { color: rgba(255, 255, 255, 0.5); }
a.ob-sidebar__step:not(.is-complete) .ob-sidebar__step-label[b-ws7rt4aygf] { color: rgba(255, 255, 255, 0.6); }

/* Completed tier */
.ob-sidebar__step.is-complete .ob-sidebar__step-icon[b-ws7rt4aygf] { color: rgba(255, 255, 255, 0.7); }
.ob-sidebar__step.is-complete .ob-sidebar__step-label[b-ws7rt4aygf] { color: rgba(255, 255, 255, 0.8); }

/* Current step -- white text on the active fill */
.ob-sidebar__step.is-active[b-ws7rt4aygf] { background-color: var(--lw-sidebar-active-bg); }
.ob-sidebar__step.is-active .ob-sidebar__step-icon[b-ws7rt4aygf],
.ob-sidebar__step.is-active .ob-sidebar__step-label[b-ws7rt4aygf] { color: var(--lw-white); }

/* Tapered gold accent notch on the current row (same recipe as the main
   nav's active item: 4px warning-solid, inset 6px, angled ends). */
.ob-sidebar__step.is-active[b-ws7rt4aygf]::before {
    content: "";
    position: absolute;
    left: 0;
    top: 6px;
    bottom: 6px;
    width: 4px;
    background: var(--lw-warning-solid);
    clip-path: polygon(0 0, 100% 3px, 100% calc(100% - 3px), 0 100%);
}

/* Only real links hover; inert divs stay flat. */
a.ob-sidebar__step[b-ws7rt4aygf] {
    text-decoration: none;
    cursor: pointer;
}

a.ob-sidebar__step:hover:not(.is-active)[b-ws7rt4aygf] {
    background-color: var(--lw-sidebar-hover-bg);
    text-decoration: none;
}

/* Locked future steps: dimmed (locked tier is already the default) and inert. */
.ob-sidebar__step.is-locked[b-ws7rt4aygf] {
    pointer-events: none;
    cursor: default;
}

/* Icon box -- size-7 wrapping a 16px glyph */
.ob-sidebar__step-icon[b-ws7rt4aygf] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 28px;
    height: 28px;
    flex-shrink: 0;
    transition: color 0.15s ease;
}

[b-ws7rt4aygf] .ob-sidebar__step-icon .mud-icon-root {
    color: currentColor !important;
    width: 16px;
    height: 16px;
    font-size: 16px;
    flex-shrink: 0;
}

.ob-sidebar__step-label[b-ws7rt4aygf] {
    flex: 1;
    min-width: 0;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    transition: color 0.15s ease;
}

/* Donut ring (step-donut-ring.tsx) -- 18px, 2px stroke.
   Upcoming/locked = faint ring; complete = filled accent circle + check;
   current-but-incomplete = breathing ring (overrides below). */
.ob-sidebar__step-donut[b-ws7rt4aygf] {
    flex-shrink: 0;
    width: 18px;
    height: 18px;
    box-sizing: border-box;
    border-radius: 9999px;
    border: 2px solid rgba(255, 255, 255, 0.08);
    display: inline-flex;
    align-items: center;
    justify-content: center;
}

/* Available (reachable, not complete): brighter track ring. */
a.ob-sidebar__step:not(.is-complete) .ob-sidebar__step-donut[b-ws7rt4aygf] {
    border-color: rgba(255, 255, 255, 0.25);
}

.ob-sidebar__step-donut.is-complete[b-ws7rt4aygf] {
    border-color: transparent;
    background-color: var(--lw-primary-blue);
    color: var(--lw-white);
}

.ob-sidebar__step-donut svg[b-ws7rt4aygf] {
    width: 10px;
    height: 10px;
    display: block;
}

/* Current + incomplete: breathing white ring. */
.ob-sidebar__step.is-active .ob-sidebar__step-donut:not(.is-complete)[b-ws7rt4aygf] {
    border-color: rgba(255, 255, 255, 0.15);
    animation: ob-donut-breathe-b-ws7rt4aygf 2.5s ease-in-out infinite;
}

@keyframes ob-donut-breathe-b-ws7rt4aygf {
    0%, 100% { opacity: 0.4; }
    50% { opacity: 1; }
}

/* Viewing an already-finished step: plain ring with a white check. */
.ob-sidebar__step.is-active .ob-sidebar__step-donut.is-complete[b-ws7rt4aygf] {
    background-color: transparent;
    border-color: rgba(255, 255, 255, 0.15);
}

/* -- Right content area -- */
.ob-content[b-ws7rt4aygf] {
    flex: 1;
    display: flex;
    flex-direction: column;
    min-width: 0;
    background-color: var(--lw-bg-muted);
}

/* Top bar (top-bar.tsx, onboarding variant). Measured 2026-07-13:
   h 56, bg white, border-b --lw-border, px 24; crumbs 14/22 gap 16
   (foreground -> muted-foreground for the current page, 14px chevron sep);
   right cluster gap 12: 32px round ghost help button (18px glyph,
   content-secondary), account menu behind a 1px left hairline + 12px pad. */
.ob-topbar[b-ws7rt4aygf] {
    flex-shrink: 0;
    display: flex;
    align-items: center;
    justify-content: space-between;
    height: 56px;
    padding: 0 24px;
    background: var(--lw-white);
    border-bottom: 1px solid var(--lw-border);
    font-family: var(--lw-font-family);
}

.ob-topbar__crumbs[b-ws7rt4aygf] {
    display: flex;
    align-items: center;
    gap: 16px;
    min-width: 0;
    font-size: 14px;
    line-height: 22px;
}

.ob-topbar__crumb[b-ws7rt4aygf] {
    color: var(--lw-text-primary);
    white-space: nowrap;
}

.ob-topbar__crumb.is-current[b-ws7rt4aygf] {
    color: var(--lw-gray-space);
    max-width: 300px;
    overflow: hidden;
    text-overflow: ellipsis;
}

.ob-topbar__crumb-sep[b-ws7rt4aygf] {
    width: 14px;
    height: 14px;
    flex-shrink: 0;
    color: var(--lw-gray-space);
}

.ob-topbar__actions[b-ws7rt4aygf] {
    display: flex;
    align-items: center;
    gap: 12px;
    flex-shrink: 0;
}

/* Ghost round help button (Button variant=ghost size=icon-round). */
.ob-topbar__help[b-ws7rt4aygf] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 32px;
    height: 32px;
    border: 0;
    border-radius: 9999px;
    background: transparent;
    color: var(--lw-gray-graphite);
    cursor: pointer;
    transition: background-color 0.15s ease;
}

.ob-topbar__help:hover[b-ws7rt4aygf] {
    background-color: var(--lw-accent);
}

.ob-topbar__help svg[b-ws7rt4aygf] {
    width: 18px;
    height: 18px;
}

.ob-topbar__account[b-ws7rt4aygf] {
    display: flex;
    align-items: center;
    border-left: 1px solid var(--lw-border);
    padding-left: 12px;
}

/* -- Account menu (onboarding-account-menu.tsx; mirrors MainLayout's
      hand-rolled dropdown) -- */
.ob-account-trigger[b-ws7rt4aygf] {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 6px 10px;
    border: 1px solid transparent;
    border-radius: 9999px;
    background: none;
    cursor: pointer;
    font-family: var(--lw-font-family);
    transition: border-color 0.2s, background-color 0.2s;
}

.ob-account-trigger:hover[b-ws7rt4aygf],
.ob-account-trigger.is-open[b-ws7rt4aygf] {
    border-color: var(--lw-border);
    background-color: var(--lw-accent);
}

/* Avatar + online dot (dot: 6px, 2px background ring, -2px offsets;
   the 40px dropdown variant scales to 8px / 2.5px ring). */
.ob-account-avatar[b-ws7rt4aygf] {
    position: relative;
    display: inline-flex;
    flex-shrink: 0;
}

.ob-account-status-dot[b-ws7rt4aygf] {
    position: absolute;
    right: -2px;
    bottom: -2px;
    width: 6px;
    height: 6px;
    border-radius: 9999px;
    background-color: var(--lw-indicator-online);
    box-shadow: 0 0 0 2px var(--lw-white);
}

.ob-account-status-dot--lg[b-ws7rt4aygf] {
    width: 8px;
    height: 8px;
    box-shadow: 0 0 0 2.5px var(--lw-white);
}

.ob-account-name[b-ws7rt4aygf] {
    font-size: 14px;
    font-weight: 500;
    line-height: 22px;
    color: var(--lw-text-primary);
    white-space: nowrap;
}

.ob-account-chevron[b-ws7rt4aygf] {
    width: 14px;
    height: 14px;
    flex-shrink: 0;
    color: var(--lw-gray-space);
    transition: transform 0.2s, color 0.2s;
}

.ob-account-trigger:hover .ob-account-chevron[b-ws7rt4aygf],
.ob-account-trigger.is-open .ob-account-chevron[b-ws7rt4aygf] {
    color: var(--lw-gray-graphite);
}

.ob-account-trigger.is-open .ob-account-chevron[b-ws7rt4aygf] {
    transform: rotate(180deg);
}

.ob-account-backdrop[b-ws7rt4aygf] {
    position: fixed;
    inset: 0;
    z-index: 1999;
}

@keyframes ob-account-dropdown-in-b-ws7rt4aygf {
    from { opacity: 0; transform: scale(0.95) translateY(-4px); }
    to   { opacity: 1; transform: scale(1) translateY(0); }
}

.ob-account-dropdown[b-ws7rt4aygf] {
    position: fixed;
    top: 60px;
    right: 24px;
    z-index: 2000;
    width: 231px;
    padding: 8px 0;
    border-radius: var(--lw-radius-card);
    background: var(--lw-white);
    box-shadow: var(--lw-shadow-popover);
    overflow: hidden;
    transform-origin: top right;
    animation: ob-account-dropdown-in-b-ws7rt4aygf 150ms ease-out both;
}

.ob-account-info-row[b-ws7rt4aygf] {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 12px 20px;
}

.ob-account-info-text[b-ws7rt4aygf] {
    min-width: 0;
    flex: 1;
}

.ob-account-info-name[b-ws7rt4aygf] {
    margin: 0;
    font-size: 14px;
    font-weight: 600;
    line-height: 22px;
    color: var(--lw-text-primary);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.ob-account-info-email[b-ws7rt4aygf] {
    margin: 0;
    font-size: 14px;
    line-height: 22px;
    color: var(--lw-gray-space);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.ob-account-divider[b-ws7rt4aygf] {
    border-top: 1px solid var(--lw-border);
    margin: 0 8px;
}

.ob-account-items[b-ws7rt4aygf] {
    padding: 4px 0;
}

.ob-account-logout-form[b-ws7rt4aygf] {
    margin: 0;
}

.ob-account-item[b-ws7rt4aygf] {
    display: flex;
    align-items: center;
    gap: 16px;
    width: 100%;
    padding: 6px 20px;
    border: 0;
    background: none;
    cursor: pointer;
    font-family: var(--lw-font-family);
    font-size: 14px;
    line-height: 22px;
    color: var(--lw-text-primary);
    text-align: left;
    transition: background-color 0.15s;
}

.ob-account-item:hover[b-ws7rt4aygf] {
    background-color: var(--lw-accent);
}

.ob-account-item svg[b-ws7rt4aygf] {
    width: 20px;
    height: 20px;
    flex-shrink: 0;
    color: var(--lw-gray-graphite);
}

/* Inner scrollable container that holds the page card */
.ob-content__inner[b-ws7rt4aygf] {
    flex: 1;
    display: flex;
    justify-content: center;
    align-items: flex-start;
    /* Mirrors wizard-shell.tsx content wrapper: md:px-10 md:py-8. Bottom stays
       larger to clear the sticky step footer. */
    padding: 32px 40px 48px;
    overflow-y: auto;
}

/* -- Responsive -- */
@media (max-width: 960px) {
    .ob-shell[b-ws7rt4aygf] {
        flex-direction: column;
        height: auto;
        min-height: 100vh;
    }

    .ob-sidebar[b-ws7rt4aygf] {
        flex: none;
        max-width: 100%;
        overflow: visible;
    }

    .ob-sidebar__logo[b-ws7rt4aygf] {
        height: 48px;
        padding: 0 16px;
    }

    .ob-sidebar__progress[b-ws7rt4aygf] {
        padding: 12px 16px 0;
    }

    .ob-sidebar__steps[b-ws7rt4aygf] {
        flex-direction: row;
        overflow-x: auto;
        gap: 4px;
        padding: 12px;
    }

    .ob-sidebar__step[b-ws7rt4aygf] {
        white-space: nowrap;
        padding: 8px 12px;
    }

    .ob-sidebar__step-donut[b-ws7rt4aygf] {
        display: none;
    }

    .ob-topbar[b-ws7rt4aygf] {
        padding: 0 16px;
    }

    .ob-account-name[b-ws7rt4aygf] {
        display: none;
    }

    .ob-account-dropdown[b-ws7rt4aygf] {
        right: 16px;
    }

    .ob-content__inner[b-ws7rt4aygf] {
        /* wizard-shell.tsx mobile: px-4 py-6 */
        padding: 24px 16px 32px;
    }
}
/* _content/Ledgerwise/Components/Modals/AcceptProposalModal.razor.rz.scp.css */
/* AcceptProposalModal content chrome only -- the dialog frame, header, body,
   and footer regions come from the canonical lw-modal pattern
   (LwModalHeader/Body/Footer + global .lw-modal rules).
   Source: organisms/kickoff/accept-proposal-modal.tsx (measured 2026-07-19):
   32px success-bg roundel w/ 16px success-fg check; copy 14/1.625
   content-secondary w/ semibold-foreground strongs; total row rounded-md
   border bg-muted px-4 py-3, label 14/500, value 16/700 tabular. */

.apm-roundel[b-a34y9yx6v7] {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 32px;
    height: 32px;
    border-radius: 999px;
    background: var(--lw-status-success-bg);
    color: var(--lw-status-success-fg);
}

.apm-roundel[b-a34y9yx6v7]  .mud-icon-root {
    width: 16px;
    height: 16px;
    font-size: 16px;
}

.apm-copy[b-a34y9yx6v7] {
    margin: 0;
    font-size: 0.875rem;
    line-height: 1.625;
    color: var(--lw-gray-graphite);
}

.apm-copy strong[b-a34y9yx6v7] {
    font-weight: 600;
    color: var(--lw-text-primary);
}

.apm-total[b-a34y9yx6v7] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    border: 1px solid var(--lw-border);
    border-radius: var(--lw-radius-control);
    background: var(--lw-bg-muted);
    padding: 12px 16px;
}

.apm-total__label[b-a34y9yx6v7] {
    font-size: 0.875rem;
    font-weight: 500;
    color: var(--lw-gray-graphite);
}

.apm-total__value[b-a34y9yx6v7] {
    font-size: 1rem;
    font-weight: 700;
    font-variant-numeric: tabular-nums;
    color: var(--lw-text-primary);
}
/* _content/Ledgerwise/Components/Modals/AchInitiatedModal.razor.rz.scp.css */
/* MudDialog shell overrides (scoped via ::deep) */
[b-lgmon4kfos] .mud-dialog.aim-dialog {
    border-radius: 8px;
    overflow: hidden;
    box-shadow: 0 10px 24px -8px rgba(2, 11, 43, 0.18),
                0 0 0 1px rgba(145, 158, 171, 0.16);
    background: var(--lw-white);
    color: var(--lw-primary-dark, #020B2B);
    font-family: var(--lw-font-family, sans-serif);
}

[b-lgmon4kfos] .mud-dialog.aim-dialog .mud-dialog-title {
    padding: 1rem 1.25rem;
    border-bottom: 1px solid rgba(145, 158, 171, 0.2);
}

[b-lgmon4kfos] .mud-dialog.aim-dialog .mud-dialog-content {
    padding: 1.25rem;
}

[b-lgmon4kfos] .mud-dialog.aim-dialog .mud-dialog-actions {
    padding: 0.75rem 1.25rem;
    border-top: 1px solid rgba(145, 158, 171, 0.2);
    gap: 0.5rem;
}

/* Header */
.aim-header[b-lgmon4kfos] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    width: 100%;
}

.aim-title[b-lgmon4kfos] {
    margin: 0;
    font-size: 1rem;
    font-weight: 600;
    line-height: 1.3;
    color: var(--lw-primary-dark, #020B2B);
    font-family: var(--lw-font-family, sans-serif);
}

.aim-close[b-lgmon4kfos] {
    flex-shrink: 0;
    width: 28px;
    height: 28px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    background: transparent;
    border: 0;
    color: var(--lw-gray-graphite, #6E7180);
    cursor: pointer;
    transition: color 0.15s;
}

.aim-close:hover[b-lgmon4kfos] {
    color: var(--lw-primary-dark, #020B2B);
}

/* Success banner */
.aim-banner[b-lgmon4kfos] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.75rem 0.875rem;
    margin-bottom: 1rem;
    border-radius: 6px;
    background: var(--lw-bg-muted, #F7F7F5);
    color: var(--lw-status-success-fg, #118d57);
    font-size: 0.8125rem;
    font-weight: 600;
}

/* Detail rows */
.aim-detail[b-lgmon4kfos] {
    border: 1px solid rgba(145, 158, 171, 0.2);
    border-radius: 8px;
    padding: 0.25rem 1rem;
    background: var(--lw-white);
}

.aim-row[b-lgmon4kfos] {
    display: flex;
    align-items: baseline;
    justify-content: space-between;
    gap: 1rem;
    padding: 0.5rem 0;
}

.aim-row + .aim-row[b-lgmon4kfos] {
    border-top: 1px solid rgba(145, 158, 171, 0.12);
}

.aim-row-label[b-lgmon4kfos] {
    font-size: 0.8125rem;
    font-weight: 500;
    color: var(--lw-gray-graphite, #6E7180);
}

.aim-row-value[b-lgmon4kfos] {
    font-size: 0.875rem;
    font-weight: 600;
    color: var(--lw-primary-dark, #020B2B);
    font-variant-numeric: tabular-nums;
    text-align: right;
}

.aim-note[b-lgmon4kfos] {
    margin: 0.875rem 0 0;
    font-size: 0.75rem;
    line-height: 1.5;
    color: var(--lw-gray-graphite, #6E7180);
}

/* Done button */
.aim-btn[b-lgmon4kfos] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 0.5rem;
    height: 32px;
    padding: 0 1rem;
    border-radius: 6px;
    font-size: 0.8125rem;
    font-weight: 600;
    line-height: 1;
    font-family: var(--lw-font-family, sans-serif);
    cursor: pointer;
    transition: background-color 0.15s, border-color 0.15s;
}

.aim-btn-done[b-lgmon4kfos] {
    background: var(--lw-primary-dark, #020B2B);
    color: var(--lw-white);
    border: 1px solid var(--lw-primary-dark, #020B2B);
}

.aim-btn-done:hover[b-lgmon4kfos] {
    background: var(--lw-primary-dark-hover);
    border-color: var(--lw-primary-dark-hover);
}
/* _content/Ledgerwise/Components/Modals/AddArchitectInlineDialog.razor.rz.scp.css */
/* Field stack per add-contact-dialog.tsx DialogBody (gap-4); footer bleeds
   out of the 24px LwModalBody padding like AddVendorModal. */
.dlg-fields[b-limdgiruab] {
    display: flex;
    flex-direction: column;
    gap: 16px;
}

.dlg-footbleed[b-limdgiruab] {
    margin: 16px -24px -24px;
}
/* _content/Ledgerwise/Components/Modals/AddClientInlineDialog.razor.rz.scp.css */
/* Field stack per add-contact-dialog.tsx DialogBody (gap-4); name row is a
   3-up grid; footer bleeds out of the 24px LwModalBody padding. */
.dlg-fields[b-9k8f0pcyiz] {
    display: flex;
    flex-direction: column;
    gap: 16px;
}

.dlg-grid3[b-9k8f0pcyiz] {
    display: grid;
    grid-template-columns: 1fr 1fr 1fr;
    gap: 16px;
}

.dlg-footbleed[b-9k8f0pcyiz] {
    margin: 16px -24px -24px;
}

@media (max-width: 640px) {
    .dlg-grid3[b-9k8f0pcyiz] {
        grid-template-columns: 1fr;
    }
}
/* _content/Ledgerwise/Components/Modals/AddEmailAddressesModal.razor.rz.scp.css */
/* Add email addresses modal -- canonical lw-modal + the tag-composer idiom
   (source: ImportSubcontractorsModal.razor.css ism-tagbox recipe).
   Elements are authored in this file and carry the isolation scope
   themselves (the dialog teleports, so ::deep from a page root never
   reaches them). */

.aem-stack[b-xegl3ifvpy] {
    display: flex;
    flex-direction: column;
    gap: 12px;
}

.aem-copy[b-xegl3ifvpy] {
    margin: 0;
    font-family: var(--lw-font-family);
    font-size: 14px;
    line-height: 20px;
    color: var(--lw-gray-graphite);
}

.aem-note[b-xegl3ifvpy] {
    margin: 0;
    font-family: var(--lw-font-family);
    font-size: 12px;
    line-height: 16px;
    color: var(--lw-gray-graphite);
}

.aem-tagbox[b-xegl3ifvpy] {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 6px;
    min-height: 54px;
    padding: 8px 10px;
    background: var(--lw-white);
    border: 1px solid var(--lw-input-border);
    border-radius: var(--lw-radius-control);
    cursor: text;
    transition: border-color 0.15s ease;
}

.aem-tagbox:focus-within[b-xegl3ifvpy] {
    border-color: var(--lw-gray-phantom);
}

.aem-tag[b-xegl3ifvpy] {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    max-width: 100%;
    padding: 4px 6px 4px 10px;
    background: var(--lw-bg-muted);
    border: 1px solid var(--lw-border);
    border-radius: 9999px;
    font-family: var(--lw-font-family);
    font-size: 13px;
    line-height: 18px;
}

.aem-tag-text[b-xegl3ifvpy] {
    color: var(--lw-text-primary);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.aem-tag-x[b-xegl3ifvpy] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 18px;
    height: 18px;
    flex-shrink: 0;
    border: 0;
    padding: 0;
    background: transparent;
    border-radius: 9999px;
    color: var(--lw-gray-graphite);
    cursor: pointer;
    transition: background 0.15s ease, color 0.15s ease;
}

.aem-tag-x:hover[b-xegl3ifvpy] {
    background: var(--lw-status-error-bg);
    color: var(--lw-destructive);
}

.aem-tag-x svg[b-xegl3ifvpy] {
    width: 10px;
    height: 10px;
}

.aem-tag-input[b-xegl3ifvpy] {
    flex: 1;
    min-width: 180px;
    border: 0;
    outline: none;
    padding: 4px 4px;
    background: transparent;
    font-family: var(--lw-font-family);
    font-size: 14px;
    line-height: 22px;
    color: var(--lw-text-primary);
}

.aem-tag-input[b-xegl3ifvpy]::placeholder {
    color: var(--lw-gray-space);
}

/* Footer: CSV upload sits in the footer's LeftContent slot. The activator is
   a span (MudFileUpload wraps it in a label), so it misses the footer's
   button-only 40px sizing contract -- restate it here so it renders
   identically to the Cancel outline button. */
.aem-upload[b-xegl3ifvpy] {
    margin: 0;
}

.aem-upload-btn[b-xegl3ifvpy] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 6px;
    height: 40px;
    padding: 0 16px;
    border-radius: var(--lw-radius-control);
    cursor: pointer;
    font-family: var(--lw-font-family);
    font-size: 14px;
    font-weight: var(--lw-font-medium);
    transition: background 0.15s ease, color 0.15s ease;
}
/* _content/Ledgerwise/Components/Modals/AddFundsModal.razor.rz.scp.css */
/* AddFundsModal content chrome only -- the dialog frame, header, body, and
   footer regions come from the canonical lw-modal pattern (LwModalHeader/
   Body/Footer atoms + global .lw-modal rules in app.css).
   Reference idioms (ledgerwise-ui-app, measured 2026-07-20):
   - ui/dialog.tsx: 32px tinted roundel with 16px glyph beside the title.
   - molecules/trust-account-widget.tsx: label/value rows, label 14/500
     content-secondary, value 14/700 tabular foreground.
   - organisms/project/request-funds-panel.tsx: TextField with a "$"
     start icon (16px semibold content-secondary).
   - ui/badge.tsx variant sm + success: h-5 px-1.5 text-[10px] font-bold
     uppercase tracking-wide rounded-sm, bg-success-bg / text-success-text. */

/* -- Header roundel (apm-roundel recipe on the info tint) -- */
.afm-roundel[b-gfqzgu5trj] {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 32px;
    height: 32px;
    border-radius: 999px;
    background: var(--lw-status-info-bg);
    color: var(--lw-primary-blue);
}

.afm-roundel[b-gfqzgu5trj]  .mud-icon-root {
    width: 16px;
    height: 16px;
    font-size: 16px;
}

/* -- Balance summary box (trust-account-widget row idiom) -- */
.afm-balance[b-gfqzgu5trj] {
    display: flex;
    flex-direction: column;
    gap: 8px;
    border: 1px solid var(--lw-border);
    border-radius: var(--lw-radius-control);
    background: var(--lw-bg-muted);
    padding: 12px 16px;
}

.afm-balance-row[b-gfqzgu5trj] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
}

.afm-balance-label[b-gfqzgu5trj] {
    font-size: 0.875rem;
    font-weight: 500;
    color: var(--lw-gray-graphite);
}

.afm-balance-value[b-gfqzgu5trj] {
    font-size: 0.875rem;
    font-weight: 700;
    font-variant-numeric: tabular-nums;
    color: var(--lw-text-primary);
}

/* Current balance below the required minimum reads as a shortfall. */
.afm-balance-value--low[b-gfqzgu5trj] {
    color: var(--lw-destructive);
}

/* -- Bank source rows: restyle of ClientBankAccountPicker's cbap-* chrome
   (component markup untouched; ::deep from this wrapper reaches its DOM).
   White bordered card rows, 40px navy initials tile, reference sm badge. -- */
.afm-banks[b-gfqzgu5trj]  .cbap-row {
    background: var(--lw-white);
    border: 1px solid var(--lw-border);
    border-radius: var(--lw-radius-card);
}

.afm-banks[b-gfqzgu5trj]  .cbap-row:hover:not(:disabled) {
    background: var(--lw-bg-muted);
}

.afm-banks[b-gfqzgu5trj]  .cbap-row--active {
    background: var(--lw-bg-secondary);
}

.afm-banks[b-gfqzgu5trj]  .cbap-logo {
    width: 40px;
    height: 40px;
    font-size: 0.75rem;
}

.afm-banks[b-gfqzgu5trj]  .cbap-name {
    font-weight: 600;
    color: var(--lw-text-primary);
}

/* badge.tsx sm success: h-5 (20px), px-1.5 (6px), 10px bold uppercase,
   tracking-wide (.025em), rounded-sm = control radius (8px). */
.afm-banks[b-gfqzgu5trj]  .cbap-badge {
    height: 20px;
    padding: 0 6px;
    border-radius: var(--lw-radius-control);
    background: var(--lw-status-success-bg);
    color: var(--lw-status-success-fg);
    font-size: 10px;
    font-weight: 700;
    letter-spacing: 0.025em;
    line-height: 1;
    text-transform: uppercase;
}

.afm-banks[b-gfqzgu5trj]  .cbap-mask,
.afm-banks[b-gfqzgu5trj]  .cbap-balance-label {
    font-size: 0.75rem;
    color: var(--lw-gray-space);
}

.afm-banks[b-gfqzgu5trj]  .cbap-refresh {
    width: 32px;
    height: 32px;
}

.afm-banks[b-gfqzgu5trj]  .cbap-refresh:hover {
    background: var(--lw-accent);
    color: var(--lw-text-primary);
}

/* -- Amount field: MudNumericField restyled to the FieldShell look
   (mirrors LwTextField.razor.css -- LwTextField itself is string-typed and
   cannot bind the decimal amount). FieldShell (text-field.tsx +
   ui/field-shell.tsx): 54px white box, 8px radius, 14/400 text,
   rest border --lw-input-border, focus border foreground, no hover change. -- */
.afm-amount[b-gfqzgu5trj]  .mud-input-control {
    margin-top: 0;
}

.afm-amount[b-gfqzgu5trj]  .mud-input-outlined {
    font-size: 14px;
    font-weight: 400;
    background-color: var(--lw-white);
    border-radius: var(--lw-radius-control);
}

.afm-amount[b-gfqzgu5trj]  .mud-input-outlined input.mud-input-slot {
    height: 54px;
    box-sizing: border-box;
    padding: 16px 14px 16px 4px;
    font-size: 14px;
    font-weight: 400;
    /* 16 + 22 + 16 = 54 -- centers the text block exactly like FieldShell. */
    line-height: 22px;
    font-variant-numeric: tabular-nums;
}

/* "$" start icon (request-funds-panel.tsx: text-base font-semibold
   content-secondary). */
.afm-amount[b-gfqzgu5trj]  .mud-input-adornment-start .mud-input-adornment-text {
    font-size: 16px;
    font-weight: var(--lw-font-semibold);
    color: var(--lw-gray-graphite);
}

/* Label states mirror LwTextField: resting muted, floated content-secondary,
   focused foreground; Mud pins its own font, so override directly. */
.afm-amount[b-gfqzgu5trj]  .mud-input-label {
    font-size: 14px;
    font-weight: 400;
    line-height: 22px;
    letter-spacing: normal;
    color: var(--lw-gray-space);
}

/* Resting label sits after the "$" adornment (40px in from the box edge);
   Mud's padding is !important, so ours must be too. */
.afm-amount[b-gfqzgu5trj]  .mud-input-label-outlined {
    top: 50%;
    transform: translate(40px, -50%) scale(1);
    padding: 0 2px !important;
    transition: top 0.2s cubic-bezier(0, 0, 0.2, 1), transform 0.2s cubic-bezier(0, 0, 0.2, 1), color 0.2s;
}

/* Floated label returns to the 13px notch -- mirror Mud's own shrink/focus
   selectors (they carry 4-class specificity); 12px = FieldShell text-xs. */
.afm-amount[b-gfqzgu5trj]  .mud-shrink ~ label.mud-input-label.mud-input-label-inputcontrol.mud-input-label-outlined,
.afm-amount[b-gfqzgu5trj]  .mud-input:focus-within ~ label.mud-input-label.mud-input-label-inputcontrol.mud-input-label-outlined {
    top: 0;
    transform: translate(13px, -6px) scale(0.857);
}

.afm-amount[b-gfqzgu5trj]  .mud-shrink ~ label.mud-input-label.mud-input-label-inputcontrol.mud-input-label-outlined {
    color: var(--lw-gray-graphite);
}

/* Focused wins over floated (declared last at equal specificity). */
.afm-amount[b-gfqzgu5trj]  .mud-input:focus-within ~ label.mud-input-label.mud-input-label-inputcontrol.mud-input-label-outlined {
    color: var(--lw-gray-phantom);
}

/* Border states: rest = input-border, hover = no change, focus = 1px
   foreground (error state keeps Mud's destructive border). */
.afm-amount[b-gfqzgu5trj]  .mud-input.mud-input-outlined:not(.mud-disabled):not(.mud-input-error):not(:focus-within):hover .mud-input-outlined-border {
    border-color: var(--lw-input-border);
}

.afm-amount[b-gfqzgu5trj]  .mud-input.mud-input-outlined:not(.mud-input-error):focus-within > .mud-input-outlined-border,
.afm-amount[b-gfqzgu5trj]  .mud-input.mud-input-outlined:not(.mud-input-error):focus-within .mud-shrink > .mud-input-outlined-border {
    border-width: 1px;
    border-color: var(--lw-gray-phantom);
}

/* Validation message under the field: 12px destructive. */
.afm-amount[b-gfqzgu5trj]  .mud-input-helper-text {
    font-family: var(--lw-font-family);
    font-size: 0.75rem;
    line-height: 1.4;
    margin-top: 4px;
}

.afm-amount[b-gfqzgu5trj]  .mud-input-helper-text.mud-input-error {
    color: var(--lw-destructive);
}

/* Inline submit/server error under the field (guarded continue). */
.afm-error[b-gfqzgu5trj] {
    margin: 6px 0 0;
    font-size: 0.75rem;
    line-height: 1.4;
    color: var(--lw-destructive);
}
/* _content/Ledgerwise/Components/Modals/AddInteriorDesignerInlineDialog.razor.rz.scp.css */
/* Field stack per add-contact-dialog.tsx DialogBody (gap-4); footer bleeds
   out of the 24px LwModalBody padding like AddVendorModal. */
.dlg-fields[b-o59wm8rafm] {
    display: flex;
    flex-direction: column;
    gap: 16px;
}

.dlg-footbleed[b-o59wm8rafm] {
    margin: 16px -24px -24px;
}
/* _content/Ledgerwise/Components/Modals/AddInvoiceModal.razor.rz.scp.css */
/* Invoice switcher for the multi-invoice Review step.
   Mirrors the chip/tab strip in AssignInvoiceToDrawRequestModal so the two
   review workflows feel consistent. Tokens come from branding.css (--lw-*). */

.aim-nav[b-oo8i5ulztw] {
    display: flex;
    align-items: center;
    gap: 0.25rem;
    margin-bottom: 0.75rem;
}

.aim-nav-count[b-oo8i5ulztw] {
    flex-shrink: 0;
    font-size: 0.75rem;
    font-weight: 600;
    color: var(--lw-gray-graphite);
    padding-left: 0.25rem;
}

[b-oo8i5ulztw] .lw-invoice-tabs {
    display: flex;
    align-items: stretch;
    overflow-x: auto;
    flex: 1;
    border-bottom: 1px solid var(--lw-border);
    scrollbar-width: none;
}

[b-oo8i5ulztw] .lw-invoice-tabs::-webkit-scrollbar {
    height: 0;
    display: none;
}

[b-oo8i5ulztw] .lw-invoice-tab {
    display: inline-flex;
    align-items: center;
    gap: 0.375rem;
    flex-shrink: 0;
    cursor: pointer;
    padding: 0.5rem 0.75rem;
    border-bottom: 2px solid transparent;
    margin-bottom: -1px;
    transition: background 0.15s ease, border-color 0.15s ease;
}

[b-oo8i5ulztw] .lw-invoice-tab:hover {
    background: var(--lw-status-neutral-bg);
}

[b-oo8i5ulztw] .lw-invoice-tab--active {
    border-bottom-color: var(--lw-text-primary);
}

[b-oo8i5ulztw] .lw-invoice-tab-name {
    max-width: 110px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    font-size: 0.75rem;
    font-weight: 500;
    color: var(--lw-gray-graphite);
}

[b-oo8i5ulztw] .lw-invoice-tab--active .lw-invoice-tab-name {
    color: var(--lw-text-primary);
}

[b-oo8i5ulztw] .lw-invoice-tab--complete .lw-invoice-tab-name {
    color: var(--lw-success-dark);
}

[b-oo8i5ulztw] .lw-invoice-tab-check {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 14px;
    height: 14px;
    border-radius: 50%;
    background: var(--lw-success-dark);
    flex-shrink: 0;
}

[b-oo8i5ulztw] .lw-invoice-tab-check .mud-icon-root {
    font-size: 9px;
    color: #fff;
}

/* -- Upload step (reference AddInvoiceModal dropzone / ready rows, 2026-07-20) -- */

.aim-dropwrap[b-oo8i5ulztw] { position: relative; margin-bottom: 16px; }

.aim-dropzone[b-oo8i5ulztw] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    text-align: center;
    padding: 48px 32px;
    border: 2px dashed rgba(145, 158, 171, 0.32);
    border-radius: var(--lw-radius-sm);
    background: rgba(145, 158, 171, 0.08);
    cursor: pointer;
    transition: border-color 0.15s ease, background 0.15s ease;
}

.aim-dropwrap:hover .aim-dropzone[b-oo8i5ulztw] {
    border-color: var(--lw-primary-blue);
    background: color-mix(in srgb, var(--lw-primary-blue) 8%, transparent);
}

.aim-dropzone--busy[b-oo8i5ulztw] { cursor: default; }

.aim-drop-tile[b-oo8i5ulztw] {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 56px;
    height: 56px;
    margin-bottom: 20px;
    border-radius: var(--lw-radius-sm);
    background: color-mix(in srgb, var(--lw-primary-dark) 10%, transparent);
    color: var(--lw-primary-dark);
}

.aim-drop-tile[b-oo8i5ulztw]  .mud-icon-root { width: 28px; height: 28px; }

.aim-drop-title[b-oo8i5ulztw] {
    margin: 0;
    font-size: 0.875rem;
    font-weight: var(--lw-font-semibold);
    color: var(--lw-text-primary);
}

.aim-drop-sub[b-oo8i5ulztw] { margin: 6px 0 0; font-size: 0.875rem; color: var(--lw-gray-graphite); }
.aim-drop-browse[b-oo8i5ulztw] { color: var(--lw-primary-blue); }
.aim-dropwrap:hover .aim-drop-browse[b-oo8i5ulztw] { text-decoration: underline; text-underline-offset: 2px; }
.aim-drop-hint[b-oo8i5ulztw] { margin: 16px 0 0; font-size: 0.75rem; color: var(--lw-gray-space); }

.aim-files[b-oo8i5ulztw] { display: flex; flex-direction: column; gap: 8px; }

.aim-file[b-oo8i5ulztw] {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 12px 16px;
    border: 1px solid var(--lw-border);
    border-radius: var(--lw-radius-control);
    background: color-mix(in srgb, var(--lw-bg-muted) 30%, transparent);
}

.aim-file[b-oo8i5ulztw]  .aim-file-icon { width: 1.25rem; height: 1.25rem; color: var(--lw-filetype-pdf-fg); flex-shrink: 0; }

.aim-file-name[b-oo8i5ulztw] {
    min-width: 0;
    flex: 1;
    font-size: 0.875rem;
    font-weight: var(--lw-font-medium);
    color: var(--lw-text-primary);
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.aim-file-size[b-oo8i5ulztw] { flex-shrink: 0; font-size: 0.75rem; color: var(--lw-gray-graphite); }

.aim-file-remove[b-oo8i5ulztw] {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 24px;
    height: 24px;
    flex-shrink: 0;
    border: none;
    background: none;
    padding: 0;
    color: var(--lw-destructive);
    cursor: pointer;
    transition: opacity 0.15s ease;
}

.aim-file-remove:hover[b-oo8i5ulztw] { opacity: 0.8; }
.aim-file-remove[b-oo8i5ulztw]  .mud-icon-root { width: 1rem; height: 1rem; }

/* Count chip inside the primary Continue button (reference bg-white/20). */
.aim-count-chip[b-oo8i5ulztw] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    height: 20px;
    min-width: 20px;
    margin-left: 6px;
    padding: 0 6px;
    border-radius: var(--lw-radius-control);
    background: rgba(255, 255, 255, 0.2);
    font-size: 0.6875rem;
    font-weight: var(--lw-font-semibold);
    line-height: 1;
}

/* -- Review takeover (reference AddInvoiceDrawer, 2026-07-20): h-14 header
   with INV chip + file pager + live amount; 58/42 split of a muted
   ControlCard form column beside the document viewer. -- */

.aim-take-head[b-oo8i5ulztw] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    height: 56px;
    padding: 0 16px;
    background: var(--lw-white);
    border-bottom: 1px solid var(--lw-border);
}

.aim-take-head-left[b-oo8i5ulztw] { display: flex; align-items: center; gap: 12px; min-width: 0; }
.aim-take-head-right[b-oo8i5ulztw] { display: flex; align-items: center; gap: 12px; flex-shrink: 0; }

.aim-take-title[b-oo8i5ulztw] {
    margin: 0;
    font-family: var(--lw-font-family);
    font-size: 1.125rem;
    font-weight: var(--lw-font-bold);
    color: var(--lw-text-primary);
    white-space: nowrap;
}

/* INV chip: rounded-md bg-brand-accent/10 px-2 py-0.5 text-xs semibold. */
.aim-inv-chip[b-oo8i5ulztw] {
    flex-shrink: 0;
    max-width: 260px;
    padding: 2px 8px;
    border-radius: var(--lw-radius-control);
    background: color-mix(in srgb, var(--lw-primary-blue) 10%, transparent);
    font-size: 0.75rem;
    font-weight: var(--lw-font-semibold);
    color: var(--lw-primary-blue);
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.aim-take-pager[b-oo8i5ulztw] { display: flex; align-items: center; gap: 4px; margin-left: 4px; }

.aim-take-nav[b-oo8i5ulztw] {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 32px;
    height: 32px;
    border: none;
    border-radius: 9999px;
    background: none;
    padding: 0;
    color: var(--lw-gray-graphite);
    cursor: pointer;
    transition: background 0.15s ease, color 0.15s ease;
}

.aim-take-nav:hover:not(:disabled)[b-oo8i5ulztw] { background: var(--lw-accent); color: var(--lw-text-primary); }
.aim-take-nav:disabled[b-oo8i5ulztw] { opacity: 0.3; cursor: default; }
.aim-take-nav[b-oo8i5ulztw]  .mud-icon-root { width: 1rem; height: 1rem; }
.aim-take-close[b-oo8i5ulztw]  .mud-icon-root { width: 1.125rem; height: 1.125rem; }

.aim-take-count[b-oo8i5ulztw] {
    font-size: 0.875rem;
    font-weight: var(--lw-font-medium);
    font-variant-numeric: tabular-nums;
    color: var(--lw-text-primary);
}

.aim-take-amount[b-oo8i5ulztw] {
    font-size: 1rem;
    font-weight: var(--lw-font-bold);
    font-variant-numeric: tabular-nums;
    color: var(--lw-text-primary);
}

/* Split body over the muted surface. */
.aim-take[b-oo8i5ulztw] {
    display: flex;
    /* Fullscreen viewport minus the 56px takeover header and the modal
       footer band (~72px). */
    height: calc(100vh - 128px);
    background: var(--lw-bg-muted);
}

.aim-take-form[b-oo8i5ulztw] {
    flex: 0 0 58%;
    min-width: 0;
    overflow-y: auto;
}

.aim-take-form-inner[b-oo8i5ulztw] {
    margin: 0 auto;
    display: flex;
    width: 100%;
    max-width: 760px;
    flex-direction: column;
    gap: 20px;
    padding: 32px;
}

.aim-take-viewer[b-oo8i5ulztw] {
    flex: 1;
    min-width: 0;
    display: flex;
    flex-direction: column;
    border-left: 1px solid var(--lw-border);
    background: var(--lw-bg-muted);
}

.aim-take-iframe[b-oo8i5ulztw] { width: 100%; height: 100%; border: none; display: block; }

.aim-take-viewer-state[b-oo8i5ulztw] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 8px;
    height: 100%;
    text-align: center;
    padding: 24px;
}

/* Form internals. */
.aim-fields[b-oo8i5ulztw] { display: flex; flex-direction: column; gap: 16px; }

.aim-field-payee[b-oo8i5ulztw] { display: flex; align-items: flex-end; gap: 4px; }
.aim-field-payee-input[b-oo8i5ulztw] { flex: 1; min-width: 0; }

.aim-date-grid[b-oo8i5ulztw] {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 16px;
}

@media (max-width: 639px) {
    .aim-date-grid[b-oo8i5ulztw] { grid-template-columns: 1fr; }
}

.aim-vendor-copy[b-oo8i5ulztw] {
    margin: 0 0 12px;
    font-size: 0.875rem;
    line-height: 1.625;
    color: var(--lw-text-primary);
}

.aim-vendor-actions[b-oo8i5ulztw] { display: flex; align-items: center; gap: 8px; margin-top: 12px; flex-wrap: wrap; }

/* -- Processing step: a calm working state. File rows carry the activity
   (spinner + shimmering progress fill); one quiet centered status block sits
   below them. The step renders no footer band (nothing to click). -- */

.aim-processing[b-oo8i5ulztw] { padding-bottom: 8px; }

.aim-file--processing[b-oo8i5ulztw] { display: flex; flex-direction: column; gap: 10px; }
.aim-file-row[b-oo8i5ulztw] { display: flex; align-items: center; gap: 12px; }

.aim-file-spinner[b-oo8i5ulztw] {
    border-color: var(--lw-primary-dark);
    border-top-color: transparent;
}

.aim-file-track[b-oo8i5ulztw] {
    height: 4px;
    width: 100%;
    overflow: hidden;
    border-radius: 9999px;
    background: var(--lw-border);
}

.aim-file-fill[b-oo8i5ulztw] {
    position: relative;
    height: 100%;
    overflow: hidden;
    border-radius: inherit;
    background: var(--lw-primary-dark);
    transition: width 0.2s ease;
}

/* Soft light sweep across the fill so slow extractions still read as live
   work rather than a stalled bar. */
.aim-file-fill[b-oo8i5ulztw]::after {
    content: "";
    position: absolute;
    inset: 0;
    background: linear-gradient(90deg, transparent 0%, rgba(255, 255, 255, 0.35) 50%, transparent 100%);
    animation: aim-fill-sweep-b-oo8i5ulztw 1.6s ease-in-out infinite;
}

@keyframes aim-fill-sweep-b-oo8i5ulztw {
    from { transform: translateX(-100%); }
    to { transform: translateX(100%); }
}

@media (prefers-reduced-motion: reduce) {
    .aim-file-fill[b-oo8i5ulztw]::after { animation: none; display: none; }
}

.aim-processing-status[b-oo8i5ulztw] {
    margin-top: 20px;
    text-align: center;
}

.aim-processing-title[b-oo8i5ulztw] {
    margin: 0;
    font-size: 0.8125rem;
    font-weight: var(--lw-font-medium);
    font-variant-numeric: tabular-nums;
    color: var(--lw-text-primary);
}

.aim-processing-sub[b-oo8i5ulztw] {
    margin: 4px auto 0;
    max-width: 380px;
    font-size: 0.75rem;
    line-height: 1.5;
    color: var(--lw-gray-space);
}

/* -- FieldShell chrome for the two non-atom inputs in "Invoice details"
   (recipe mirrors LwTextField.razor.css, 2026-07-08 spec: 54px white box,
   8px radius, border --lw-input-border, 14/400 value, muted -> graphite ->
   phantom label states).
   .aim-numfield wraps the MudNumericField Amount (decimal binding + $
   adornment stay); .aim-field-payee-input reaches the MudTextField inside
   SearchableDropdown (its search behavior stays untouched). -- */

.aim-numfield[b-oo8i5ulztw]  .mud-input-helper-text,
.aim-field-payee-input[b-oo8i5ulztw]  .mud-input-helper-text {
    font-family: var(--lw-font-family);
    font-size: 13px;
    line-height: 18px;
    margin-top: 4px;
}

.aim-numfield[b-oo8i5ulztw]  .mud-input-control,
.aim-field-payee-input[b-oo8i5ulztw]  .mud-input-control {
    margin-top: 0;
}

.aim-numfield[b-oo8i5ulztw]  .mud-input-outlined,
.aim-field-payee-input[b-oo8i5ulztw]  .mud-input-outlined {
    font-size: 14px;
    font-weight: 400;
    background-color: var(--lw-white);
    border-radius: var(--lw-radius-control);
}

.aim-numfield[b-oo8i5ulztw]  .mud-input-outlined input.mud-input-slot,
.aim-field-payee-input[b-oo8i5ulztw]  .mud-input-outlined input.mud-input-slot {
    height: 54px;
    box-sizing: border-box;
    padding: 16px 14px;
    font-size: 14px;
    font-weight: 400;
    /* 16 + 22 + 16 = 54 -- centers the text block exactly like FieldShell. */
    line-height: 22px;
}

/* Start adornment ($) hugs the value; trim the input's left pad so the pair
   still reads as one 14px-inset text block. */
.aim-numfield[b-oo8i5ulztw]  .mud-input-adornment-start + input.mud-input-slot {
    padding-left: 6px;
}

.aim-numfield[b-oo8i5ulztw]  .mud-input-adornment-text {
    font-size: 14px;
    color: var(--lw-gray-graphite);
}

.aim-numfield[b-oo8i5ulztw]  .mud-input-label,
.aim-field-payee-input[b-oo8i5ulztw]  .mud-input-label {
    font-size: 14px;
    font-weight: 400;
    line-height: 22px;
    letter-spacing: normal;
    color: var(--lw-gray-space);
}

/* Resting label geometrically centered in the 54px box (FieldShell: left
   13px). Mud's padding is !important, so ours must be too. */
.aim-numfield[b-oo8i5ulztw]  .mud-input-label-outlined,
.aim-field-payee-input[b-oo8i5ulztw]  .mud-input-label-outlined {
    top: 50%;
    transform: translate(13px, -50%) scale(1);
    padding: 0 2px !important;
    transition: top 0.2s cubic-bezier(0, 0, 0.2, 1), transform 0.2s cubic-bezier(0, 0, 0.2, 1), color 0.2s;
}

/* Floated label: mirror Mud's shrink/focus selectors (4-class specificity);
   12px like FieldShell text-xs (scale 12/14 = .857). */
.aim-numfield[b-oo8i5ulztw]  .mud-shrink ~ label.mud-input-label.mud-input-label-inputcontrol.mud-input-label-outlined,
.aim-numfield[b-oo8i5ulztw]  .mud-input:focus-within ~ label.mud-input-label.mud-input-label-inputcontrol.mud-input-label-outlined,
.aim-field-payee-input[b-oo8i5ulztw]  .mud-shrink ~ label.mud-input-label.mud-input-label-inputcontrol.mud-input-label-outlined,
.aim-field-payee-input[b-oo8i5ulztw]  .mud-input:focus-within ~ label.mud-input-label.mud-input-label-inputcontrol.mud-input-label-outlined {
    top: 0;
    transform: translate(13px, -6px) scale(0.857);
}

.aim-numfield[b-oo8i5ulztw]  .mud-shrink ~ label.mud-input-label.mud-input-label-inputcontrol.mud-input-label-outlined,
.aim-field-payee-input[b-oo8i5ulztw]  .mud-shrink ~ label.mud-input-label.mud-input-label-inputcontrol.mud-input-label-outlined {
    color: var(--lw-gray-graphite);
}

/* Focused wins over floated (declared last at equal specificity). */
.aim-numfield[b-oo8i5ulztw]  .mud-input:focus-within ~ label.mud-input-label.mud-input-label-inputcontrol.mud-input-label-outlined,
.aim-field-payee-input[b-oo8i5ulztw]  .mud-input:focus-within ~ label.mud-input-label.mud-input-label-inputcontrol.mud-input-label-outlined {
    color: var(--lw-gray-phantom);
}

/* Border states -- FieldShell: rest --lw-input-border 1px; hover no change;
   focus 1px foreground (phantom). */
.aim-numfield[b-oo8i5ulztw]  .mud-input.mud-input-outlined:not(.mud-disabled):not(:focus-within):hover .mud-input-outlined-border,
.aim-field-payee-input[b-oo8i5ulztw]  .mud-input.mud-input-outlined:not(.mud-disabled):not(:focus-within):hover .mud-input-outlined-border {
    border-color: var(--lw-input-border);
}

.aim-numfield[b-oo8i5ulztw]  .mud-input.mud-input-outlined:focus-within > .mud-input-outlined-border,
.aim-numfield[b-oo8i5ulztw]  .mud-input.mud-input-outlined:focus-within .mud-shrink > .mud-input-outlined-border,
.aim-field-payee-input[b-oo8i5ulztw]  .mud-input.mud-input-outlined:focus-within > .mud-input-outlined-border,
.aim-field-payee-input[b-oo8i5ulztw]  .mud-input.mud-input-outlined:focus-within .mud-shrink > .mud-input-outlined-border {
    border-width: 1px;
    border-color: var(--lw-gray-phantom);
}

/* Dropdown caret / clear buttons: gray-space like the LwSelect caret. */
.aim-field-payee-input[b-oo8i5ulztw]  .mud-input-adornment .mud-icon-button,
.aim-field-payee-input[b-oo8i5ulztw]  .mud-icon-button-edge-end {
    color: var(--lw-gray-space);
}

/* MudNumericField spin buttons: keep them quiet inside the 54px box. */
.aim-numfield[b-oo8i5ulztw]  .mud-input-numeric-spin .mud-icon-button {
    color: var(--lw-gray-space);
}
/* _content/Ledgerwise/Components/Modals/AddProjectClientUserDialog.razor.rz.scp.css */
/* Add project-client-user dialog body -- canonical lw-modal internals
   (cf. OrganizationInviteUserModal / AddProjectCommunicationRecipientDialog). */

.apcu-roundel[b-qk40714wod] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 32px;
    height: 32px;
    border-radius: 50%;
    background: var(--lw-status-info-bg);
    color: var(--lw-status-info-fg);
    flex-shrink: 0;
}

.apcu-roundel[b-qk40714wod]  .mud-icon-root {
    font-size: 16px;
    width: 16px;
    height: 16px;
}

.apcu-form[b-qk40714wod] {
    display: flex;
    flex-direction: column;
    gap: 16px;
}

.apcu-grid2[b-qk40714wod] {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 12px;
}

.apcu-copy[b-qk40714wod] {
    margin: 0;
    font-size: 13px;
    line-height: 18px;
    color: var(--lw-gray-graphite);
}

.apcu-copy--hint[b-qk40714wod] {
    font-size: 12px;
    line-height: 17px;
}

.apcu-footbleed[b-qk40714wod] {
    margin: 16px -24px -24px;
}
/* _content/Ledgerwise/Components/Modals/AddProjectCommunicationRecipientDialog.razor.rz.scp.css */
/* Add-recipient dialog body -- helper line per the canonical modal pattern;
   footer bleeds out of the 24px LwModalBody padding. */
.arc-help[b-s66j586ole] {
    margin: 0 0 16px;
    font-size: 13px;
    line-height: 18px;
    color: var(--lw-gray-graphite);
}

.arc-empty[b-s66j586ole] {
    margin: 0;
    font-size: 14px;
    color: var(--lw-text-primary);
}

.arc-footbleed[b-s66j586ole] {
    margin: 16px -24px -24px;
}
/* _content/Ledgerwise/Components/Modals/AddProjectDocumentModal.razor.rz.scp.css */
/* Upload dialog internals. Source: ledgerwise-app gc-documents.tsx
   AddFilesModal (measured 2026-07-20): dashed rounded-lg dropzone px-8 py-12
   with a 56px navy-tint FileUp tile; ready rows on rounded-md border
   bg-muted/30 px-4 py-3; slim progress track. */

.apdm-dropzone[b-9sa1isff40] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    text-align: center;
    padding: 48px 32px;
    border: 2px dashed rgba(145, 158, 171, 0.32);
    border-radius: var(--lw-radius-sm);
    cursor: pointer;
    transition: border-color 0.15s ease, background 0.15s ease;
}

.apdm-dropzone:hover[b-9sa1isff40] {
    border-color: var(--lw-primary-blue);
    background: color-mix(in srgb, var(--lw-primary-blue) 8%, transparent);
}

.apdm-dropzone--disabled[b-9sa1isff40] { opacity: 0.5; pointer-events: none; }

.apdm-dropzone-tile[b-9sa1isff40] {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 56px;
    height: 56px;
    margin-bottom: 20px;
    border-radius: var(--lw-radius-sm);
    background: color-mix(in srgb, var(--lw-primary-dark) 10%, transparent);
    color: var(--lw-primary-dark);
}

.apdm-dropzone-tile[b-9sa1isff40]  .mud-icon-root { width: 28px; height: 28px; }

.apdm-dropzone-title[b-9sa1isff40] {
    margin: 0;
    font-size: 0.875rem;
    font-weight: var(--lw-font-semibold);
    color: var(--lw-text-primary);
}

.apdm-dropzone-sub[b-9sa1isff40] {
    margin: 6px 0 0;
    font-size: 0.875rem;
    color: var(--lw-gray-graphite);
}

.apdm-dropzone-browse[b-9sa1isff40] { color: var(--lw-primary-blue); }
.apdm-dropzone:hover .apdm-dropzone-browse[b-9sa1isff40] { text-decoration: underline; text-underline-offset: 2px; }

.apdm-dropzone-hint[b-9sa1isff40] {
    margin: 16px 0 0;
    font-size: 0.75rem;
    color: var(--lw-gray-space);
}

/* Selected-file rows (reference "ready" state). */
.apdm-files[b-9sa1isff40] { display: flex; flex-direction: column; gap: 8px; }

.apdm-file[b-9sa1isff40] {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 12px 16px;
    border: 1px solid var(--lw-border);
    border-radius: var(--lw-radius-control);
    background: color-mix(in srgb, var(--lw-bg-muted) 30%, transparent);
}

.apdm-file[b-9sa1isff40]  .apdm-file-icon { width: 1rem; height: 1rem; color: var(--lw-gray-graphite); flex-shrink: 0; }

.apdm-file-name[b-9sa1isff40] {
    min-width: 0;
    flex: 1;
    font-size: 0.875rem;
    font-weight: var(--lw-font-medium);
    color: var(--lw-text-primary);
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.apdm-file-size[b-9sa1isff40] { flex-shrink: 0; font-size: 0.75rem; color: var(--lw-gray-graphite); }

.apdm-file-remove[b-9sa1isff40] {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 24px;
    height: 24px;
    flex-shrink: 0;
    border: none;
    background: none;
    padding: 0;
    color: var(--lw-destructive);
    cursor: pointer;
    transition: opacity 0.15s ease;
}

.apdm-file-remove:hover[b-9sa1isff40] { opacity: 0.8; }
.apdm-file-remove:disabled[b-9sa1isff40] { opacity: 0.4; cursor: default; }
.apdm-file-remove[b-9sa1isff40]  .mud-icon-root { width: 1rem; height: 1rem; }

/* Upload progress (reference processing-state slim track). */
.apdm-progress[b-9sa1isff40] { display: flex; flex-direction: column; gap: 6px; }

.apdm-progress-track[b-9sa1isff40] {
    height: 4px;
    width: 100%;
    overflow: hidden;
    border-radius: 9999px;
    background: var(--lw-border);
}

.apdm-progress-fill[b-9sa1isff40] {
    height: 100%;
    background: var(--lw-primary-dark);
    transition: width 0.2s ease;
}

.apdm-progress-label[b-9sa1isff40] { margin: 0; font-size: 0.75rem; color: var(--lw-gray-graphite); }
/* _content/Ledgerwise/Components/Modals/AddProposalToBudgetModal.razor.rz.scp.css */
/* Add to Budget wizard takeover -- source: ledgerwise-app
   organisms/gc/add-to-budget-modal.tsx on the shared WizardShell
   (organisms/onboarding/wizard-shell.tsx). Shell/rail/topbar/footer recipes
   duplicated from AddRfpModal.razor.css (arm-*) under the apb- prefix.
   Flow molecules below mirror the reference exactly:
   - category band: bg-table-header-bg px-5 py-2.5 12px bold uppercase
     content-secondary (add-to-budget-modal.tsx:416)
   - select row: border-t px-5 py-3, hover bg-accent/50, selected
     brand-accent/5 tint; 20px rounded-sm checkbox, filled brand-accent w/
     white 14px check (:419-457)
   - allocate row: name/sublabel left, w-48 $-amount field right (:658-685)
   - running-total band: colored strip, NO progress bar (:688-726)
   Ported 2026-07-23. */

.apb-shell[b-j764ewu3x3] {
    position: fixed;
    inset: 0;
    z-index: 1310; /* above the MudAppBar (1300), below MudDialog (1400) so
                      the nested AddVendorModal / AddEmails dialogs stack on top */
    display: grid;
    grid-template-columns: var(--lw-wizard-rail-width) minmax(0, 1fr);
    height: 100dvh;
    overflow: hidden;
    background: var(--lw-bg-muted);
}

/* ---- Left rail (navy sidebar) ---- */

.apb-rail[b-j764ewu3x3] {
    display: flex;
    flex-direction: column;
    background: var(--lw-primary-dark);
}

.apb-rail__logo[b-j764ewu3x3] {
    display: flex;
    align-items: center;
    gap: 10px;
    height: 56px;
    padding: 0 24px;
    border-bottom: 1px solid rgba(255, 255, 255, 0.08);
}

.apb-rail__emblem[b-j764ewu3x3] {
    width: 22px;
    height: 22px;
}

.apb-rail__wordmark[b-j764ewu3x3] {
    color: #fff;
    font-weight: 700;
    font-size: 18px;
    letter-spacing: -0.01em;
    font-family: var(--lw-font-family-heading, inherit);
}

.apb-rail__progress[b-j764ewu3x3] {
    padding: 20px 24px 4px;
}

.apb-rail__progress-head[b-j764ewu3x3] {
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.apb-rail__progress-label[b-j764ewu3x3] {
    font-size: 12px;
    line-height: 18px;
    color: rgba(255, 255, 255, 0.7);
}

.apb-rail__progress-count[b-j764ewu3x3] {
    font-size: 12px;
    line-height: 18px;
    color: rgba(255, 255, 255, 0.45);
    font-variant-numeric: tabular-nums;
}

.apb-rail__progress-track[b-j764ewu3x3] {
    margin-top: 6px;
    height: 6px;
    border-radius: 9999px;
    background: rgba(255, 255, 255, 0.1);
    overflow: hidden;
}

.apb-rail__progress-fill[b-j764ewu3x3] {
    height: 100%;
    border-radius: 9999px;
    background: linear-gradient(90deg, #3980A5, #5ba3c4, #EEB66F);
    transition: width 0.4s ease;
}

.apb-rail__steps[b-j764ewu3x3] {
    display: flex;
    flex-direction: column;
    gap: 2px;
    padding: 16px 12px;
    flex: 1;
    min-height: 0;
    overflow-y: auto;
}

.apb-rail__step[b-j764ewu3x3] {
    position: relative;
    display: flex;
    align-items: center;
    justify-content: flex-start !important;
    gap: 12px;
    width: 100%;
    border: 0;
    background: transparent;
    padding: 10px 12px;
    border-radius: 8px;
    text-align: left;
    cursor: pointer;
    font-family: inherit;
    transition: background-color 0.15s ease;
}

.apb-rail__step:hover:not(:disabled)[b-j764ewu3x3] {
    background: rgba(255, 255, 255, 0.08);
}

.apb-rail__step.is-active[b-j764ewu3x3] {
    background: rgba(255, 255, 255, 0.12);
}

.apb-rail__step:disabled[b-j764ewu3x3] {
    cursor: default;
}

.apb-rail__accent[b-j764ewu3x3] {
    position: absolute;
    left: 0;
    top: 6px;
    bottom: 6px;
    width: 4px;
    background: var(--lw-primary-gold);
    clip-path: polygon(0 0, 100% 3px, 100% calc(100% - 3px), 0 100%);
}

.apb-rail__icon[b-j764ewu3x3] {
    flex-shrink: 0;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 28px;
    height: 28px;
}

.apb-rail__icon[b-j764ewu3x3]  .mud-icon-root {
    width: 16px;
    height: 16px;
    font-size: 16px;
    color: rgba(255, 255, 255, 0.35) !important;
    transition: color 0.15s ease;
}

.apb-rail__step.is-active .apb-rail__icon[b-j764ewu3x3]  .mud-icon-root {
    color: #fff !important;
}

.apb-rail__step.is-complete .apb-rail__icon[b-j764ewu3x3]  .mud-icon-root {
    color: rgba(255, 255, 255, 0.7) !important;
}

.apb-rail__label[b-j764ewu3x3] {
    flex: 1;
    min-width: 0;
    font-size: 14px;
    font-weight: 500;
    line-height: 22px;
    color: rgba(255, 255, 255, 0.4);
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.apb-rail__step.is-active .apb-rail__label[b-j764ewu3x3] {
    color: #fff;
}

.apb-rail__step.is-complete .apb-rail__label[b-j764ewu3x3] {
    color: rgba(255, 255, 255, 0.8);
}

.apb-rail__ring[b-j764ewu3x3] {
    flex-shrink: 0;
    width: 18px;
    height: 18px;
    border-radius: 50%;
    box-sizing: border-box;
    display: inline-flex;
    align-items: center;
    justify-content: center;
}

.apb-rail__ring--done[b-j764ewu3x3] {
    background: var(--lw-primary-blue);
}

.apb-rail__ring--done[b-j764ewu3x3]  .mud-icon-root {
    width: 10px;
    height: 10px;
    font-size: 10px;
    color: #fff !important;
}

.apb-rail__ring--active[b-j764ewu3x3] {
    border: 2px solid rgba(255, 255, 255, 0.2);
}

.apb-rail__ring--locked[b-j764ewu3x3] {
    border: 2px solid rgba(255, 255, 255, 0.08);
}

/* ---- Content top bar (reference WizardShell breadcrumb chrome) ---- */

.apb-topbar[b-j764ewu3x3] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 8px;
    height: 56px;
    flex-shrink: 0;
    padding: 0 16px 0 24px;
    background: var(--lw-white);
    border-bottom: 1px solid var(--lw-border);
}

.apb-crumbs[b-j764ewu3x3] {
    display: flex;
    align-items: center;
    gap: 4px;
    min-width: 0;
}

.apb-crumb[b-j764ewu3x3] {
    font-family: var(--lw-font-family);
    font-size: 14px;
    line-height: 22px;
    white-space: nowrap;
}

.apb-crumb--link[b-j764ewu3x3] {
    border: 0;
    background: transparent;
    padding: 0;
    color: var(--lw-gray-graphite);
    cursor: pointer;
    transition: color 0.15s;
}

.apb-crumb--link:hover:not(:disabled)[b-j764ewu3x3] {
    color: var(--lw-text-primary);
}

.apb-crumb--current[b-j764ewu3x3] {
    color: var(--lw-text-primary);
    font-weight: var(--lw-font-medium);
    overflow: hidden;
    text-overflow: ellipsis;
}

.apb-crumbs[b-j764ewu3x3]  .apb-crumb-sep.mud-icon-root {
    width: 16px;
    height: 16px;
    font-size: 16px;
    color: var(--lw-gray-smoke);
    flex-shrink: 0;
}

.apb-topbar__close[b-j764ewu3x3] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 36px;
    height: 36px;
    border: none;
    border-radius: 50%;
    background: transparent;
    color: var(--lw-gray-graphite);
    cursor: pointer;
    flex-shrink: 0;
    transition: background 0.15s, color 0.15s;
}

.apb-topbar__close:hover:not(:disabled)[b-j764ewu3x3] {
    background: var(--lw-bg-secondary);
    color: var(--lw-text-primary);
}

/* ---- Main content ---- */

.apb-main[b-j764ewu3x3] {
    display: flex;
    flex-direction: column;
    min-width: 0;
    min-height: 0;
}

.apb-content[b-j764ewu3x3] {
    flex: 1;
    min-height: 0;
    overflow: auto;
    padding: 32px 40px 40px;
}

.apb-step-wrap[b-j764ewu3x3] {
    max-width: 760px;
    margin: 0 auto;
}

.apb-stack[b-j764ewu3x3] {
    display: flex;
    flex-direction: column;
    gap: 16px;
}

/* ---- Footer ---- */

.apb-footer[b-j764ewu3x3] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    padding: 16px 40px;
    background: var(--lw-white);
    border-top: 1px solid var(--lw-border);
}

.apb-footer__back[b-j764ewu3x3] {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    height: 44px;
    padding: 0 18px;
    border: 1px solid var(--lw-border);
    border-radius: var(--lw-radius-control);
    background: var(--lw-white);
    color: var(--lw-primary-dark);
    font-family: var(--lw-font-family);
    font-size: 14px;
    font-weight: var(--lw-font-medium);
    cursor: pointer;
}

.apb-footer__back:hover:not(:disabled)[b-j764ewu3x3] {
    background: var(--lw-bg-secondary);
}

.apb-footer__continue[b-j764ewu3x3] {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    height: 44px;
    padding: 0 26px;
    border: none;
    border-radius: var(--lw-radius-control);
    background: var(--lw-primary-dark);
    color: #fff;
    font-family: var(--lw-font-family);
    font-size: 14px;
    font-weight: var(--lw-font-semibold);
    cursor: pointer;
    transition: background 0.15s;
}

.apb-footer__continue:hover:not(:disabled)[b-j764ewu3x3] {
    background: var(--lw-primary-dark-hover, color-mix(in srgb, var(--lw-primary-dark) 90%, #fff));
}

.apb-footer__back:disabled[b-j764ewu3x3],
.apb-footer__continue:disabled[b-j764ewu3x3] {
    opacity: 0.6;
    cursor: default;
}



/* ---- Step 1: select line items (flat category-grouped checkbox list) ---- */

.apb-list[b-j764ewu3x3] {
    display: flex;
    flex-direction: column;
}

.apb-cat[b-j764ewu3x3] {
    margin: 0;
    padding: 10px 20px;
    background: var(--lw-bg-table-header);
    border-top: 1px solid var(--lw-border);
    font-size: 12px;
    font-weight: 700;
    line-height: 18px;
    text-transform: uppercase;
    letter-spacing: 0.025em;
    color: var(--lw-gray-graphite);
}

.apb-list > .apb-cat:first-child[b-j764ewu3x3] {
    border-top: 0;
}

.apb-row[b-j764ewu3x3] {
    display: flex;
    align-items: center;
    gap: 12px;
    width: 100%;
    border: 0;
    border-top: 1px solid var(--lw-border);
    background: transparent;
    padding: 12px 20px;
    text-align: left;
    cursor: pointer;
    font-family: var(--lw-font-family);
    transition: background-color 0.15s ease;
}

.apb-row:hover[b-j764ewu3x3] {
    background: color-mix(in srgb, var(--lw-bg-muted) 50%, transparent);
}

.apb-row--selected[b-j764ewu3x3],
.apb-row--selected:hover[b-j764ewu3x3] {
    background: color-mix(in srgb, var(--lw-primary-blue) 5%, transparent);
}

.apb-check[b-j764ewu3x3] {
    flex-shrink: 0;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 20px;
    height: 20px;
    border-radius: 4px;
    border: 1px solid var(--lw-gray-smoke);
    background: var(--lw-white);
    box-sizing: border-box;
    transition: background 0.15s, border-color 0.15s;
}

.apb-check--filled[b-j764ewu3x3] {
    border-color: var(--lw-primary-blue);
    background: var(--lw-primary-blue);
}

.apb-check[b-j764ewu3x3]  .mud-icon-root {
    width: 14px;
    height: 14px;
    font-size: 14px;
    color: var(--lw-primary-blue-fg, #fff);
}

.apb-row__label[b-j764ewu3x3] {
    flex: 1;
    min-width: 0;
    font-size: 14px;
    line-height: 20px;
    color: var(--lw-text-primary);
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.apb-row__sub[b-j764ewu3x3] {
    flex-shrink: 0;
    font-size: 13px;
    color: var(--lw-gray-graphite);
    font-variant-numeric: tabular-nums;
}

/* "+ Add Line Item" list-footer affordance (reference :528-537) */
.apb-addrow[b-j764ewu3x3] {
    display: flex;
    align-items: center;
    gap: 8px;
    width: 100%;
    border: 0;
    border-top: 1px solid var(--lw-border);
    background: transparent;
    padding: 12px 20px;
    text-align: left;
    cursor: pointer;
    font-family: var(--lw-font-family);
    font-size: 14px;
    font-weight: var(--lw-font-medium);
    color: var(--lw-primary-blue);
    transition: background-color 0.15s ease;
}

.apb-addrow:hover[b-j764ewu3x3] {
    background: color-mix(in srgb, var(--lw-bg-muted) 50%, transparent);
}

.apb-addrow[b-j764ewu3x3]  .apb-addrow__icon.mud-icon-root {
    width: 16px;
    height: 16px;
    font-size: 16px;
}

/* ---- Step 2: allocate amounts ---- */

.apb-alloc[b-j764ewu3x3] {
    display: flex;
    align-items: center;
    gap: 16px;
    border-top: 1px solid var(--lw-border);
    padding: 12px 20px;
}

.apb-alloc:first-child[b-j764ewu3x3] {
    border-top: 0;
}

.apb-alloc__text[b-j764ewu3x3] {
    flex: 1;
    min-width: 0;
    display: flex;
    flex-direction: column;
    gap: 2px;
}

.apb-alloc__name[b-j764ewu3x3] {
    font-size: 14px;
    font-weight: var(--lw-font-medium);
    line-height: 20px;
    color: var(--lw-text-primary);
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.apb-alloc__sub[b-j764ewu3x3] {
    font-size: 12px;
    line-height: 16px;
    color: var(--lw-gray-graphite);
}

.apb-alloc__field[b-j764ewu3x3] {
    flex-shrink: 0;
    width: 192px;
}

/* Running-total band (reference :688-726): colored copy strip, no meter. */
.apb-total[b-j764ewu3x3] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    border-top: 1px solid var(--lw-border);
    border-radius: 0 0 var(--lw-radius-card) var(--lw-radius-card);
    padding: 16px 20px;
    font-size: 14px;
}

.apb-total--under[b-j764ewu3x3] {
    background: var(--lw-bg-muted);
}

.apb-total--under .apb-total__right[b-j764ewu3x3] {
    color: var(--lw-status-warning-fg);
    font-weight: var(--lw-font-medium);
}

.apb-total--match[b-j764ewu3x3] {
    background: var(--lw-status-success-bg);
    border-top-color: color-mix(in srgb, var(--lw-status-success-fg) 30%, transparent);
}

.apb-total--match .apb-total__right[b-j764ewu3x3] {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    color: var(--lw-status-success-fg);
    font-weight: var(--lw-font-medium);
}

.apb-total--over[b-j764ewu3x3] {
    background: var(--lw-status-error-bg);
    border-top-color: color-mix(in srgb, var(--lw-status-error-fg) 30%, transparent);
}

.apb-total--over .apb-total__right[b-j764ewu3x3] {
    color: var(--lw-status-error-fg);
    font-weight: var(--lw-font-medium);
}

.apb-total__left[b-j764ewu3x3] {
    color: var(--lw-text-primary);
    font-variant-numeric: tabular-nums;
}

.apb-total[b-j764ewu3x3]  .apb-total__check.mud-icon-root {
    width: 16px;
    height: 16px;
    font-size: 16px;
}

/* ---- Step 3: review table ---- */

.apb-review[b-j764ewu3x3] {
    display: flex;
    flex-direction: column;
}

.apb-review__row[b-j764ewu3x3] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
    border-top: 1px solid var(--lw-border);
    padding: 12px 20px;
}

.apb-review__row:first-child[b-j764ewu3x3] {
    border-top: 0;
}

.apb-review__text[b-j764ewu3x3] {
    display: flex;
    flex-direction: column;
    gap: 2px;
    min-width: 0;
}

.apb-review__name[b-j764ewu3x3] {
    font-size: 14px;
    font-weight: var(--lw-font-medium);
    line-height: 20px;
    color: var(--lw-text-primary);
}

.apb-review__sub[b-j764ewu3x3] {
    font-size: 12px;
    line-height: 16px;
    color: var(--lw-gray-graphite);
}

.apb-review__amount[b-j764ewu3x3] {
    font-size: 14px;
    color: var(--lw-text-primary);
    font-variant-numeric: tabular-nums;
}

.apb-review__with-chip[b-j764ewu3x3] {
    display: inline-flex;
    align-items: center;
    gap: 10px;
}

.apb-review__row--total[b-j764ewu3x3] {
    background: var(--lw-bg-table-header);
    border-radius: 0 0 var(--lw-radius-card) var(--lw-radius-card);
}

.apb-review__row--total .apb-review__name[b-j764ewu3x3],
.apb-review__row--total .apb-review__amount[b-j764ewu3x3] {
    font-weight: var(--lw-font-semibold);
}

/* ---- Add Line Item sub-dialog ---- */

.apb-additem[b-j764ewu3x3] {
    display: flex;
    flex-direction: column;
    gap: 16px;
}

.apb-additem__toggle[b-j764ewu3x3] {
    align-self: flex-start;
    border: 0;
    background: transparent;
    padding: 0;
    font-family: var(--lw-font-family);
    font-size: 12px;
    font-weight: var(--lw-font-medium);
    color: var(--lw-primary-blue);
    cursor: pointer;
}

.apb-additem__toggle:hover[b-j764ewu3x3] {
    text-decoration: underline;
}
/* _content/Ledgerwise/Components/Modals/AddRfpModal.razor.rz.scp.css */
/* Create RFP wizard takeover -- source: ledgerwise-app
   organisms/gc/create-rfp-stepper.tsx on the shared WizardShell
   (organisms/onboarding/wizard-shell.tsx). Shell/rail/footer recipes mirror
   SendProposalStepper.razor.css (sp-*): navy token-width rail w/ gradient progress
   bar, gold active accent, donut step rings; muted content column with
   ControlCard step bodies; white footer w/ Back + navy Continue.
   Field chrome: LwTextField (Interactive) / LwDateField.
   Dropzone: shared dashed recipe; vendor rows: 28px avatar + checkbox. */

.arm-shell[b-sao3dab557] {
    position: fixed;
    inset: 0;
    z-index: 1310; /* above the MudAppBar (1300), below MudDialog (1400) so
                      the nested AddVendorModal / AddEmails dialogs stack on top */
    display: grid;
    grid-template-columns: var(--lw-wizard-rail-width) minmax(0, 1fr);
    height: 100dvh;
    overflow: hidden;
    background: var(--lw-bg-muted);
}

/* ---- Left rail (navy sidebar) ---- */

.arm-rail[b-sao3dab557] {
    display: flex;
    flex-direction: column;
    background: var(--lw-primary-dark);
}

.arm-rail__logo[b-sao3dab557] {
    display: flex;
    align-items: center;
    gap: 10px;
    height: 56px;
    padding: 0 24px;
    border-bottom: 1px solid rgba(255, 255, 255, 0.08);
}

.arm-rail__emblem[b-sao3dab557] {
    width: 22px;
    height: 22px;
}

.arm-rail__wordmark[b-sao3dab557] {
    color: #fff;
    font-weight: 700;
    font-size: 18px;
    letter-spacing: -0.01em;
    font-family: var(--lw-font-family-heading, inherit);
}

.arm-rail__progress[b-sao3dab557] {
    padding: 20px 24px 4px;
}

.arm-rail__progress-head[b-sao3dab557] {
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.arm-rail__progress-label[b-sao3dab557] {
    font-size: 12px;
    line-height: 18px;
    color: rgba(255, 255, 255, 0.7);
}

.arm-rail__progress-count[b-sao3dab557] {
    font-size: 12px;
    line-height: 18px;
    color: rgba(255, 255, 255, 0.45);
    font-variant-numeric: tabular-nums;
}

.arm-rail__progress-track[b-sao3dab557] {
    margin-top: 6px;
    height: 6px;
    border-radius: 9999px;
    background: rgba(255, 255, 255, 0.1);
    overflow: hidden;
}

.arm-rail__progress-fill[b-sao3dab557] {
    height: 100%;
    border-radius: 9999px;
    background: linear-gradient(90deg, #3980A5, #5ba3c4, #EEB66F);
    transition: width 0.4s ease;
}

.arm-rail__steps[b-sao3dab557] {
    display: flex;
    flex-direction: column;
    gap: 2px;
    padding: 16px 12px;
    flex: 1;
    min-height: 0;
    overflow-y: auto;
}

.arm-rail__step[b-sao3dab557] {
    position: relative;
    display: flex;
    align-items: center;
    justify-content: flex-start !important;
    gap: 12px;
    width: 100%;
    border: 0;
    background: transparent;
    padding: 10px 12px;
    border-radius: 8px;
    text-align: left;
    cursor: pointer;
    font-family: inherit;
    transition: background-color 0.15s ease;
}

.arm-rail__step:hover:not(:disabled)[b-sao3dab557] {
    background: rgba(255, 255, 255, 0.08);
}

.arm-rail__step.is-active[b-sao3dab557] {
    background: rgba(255, 255, 255, 0.12);
}

.arm-rail__step:disabled[b-sao3dab557] {
    cursor: default;
}

.arm-rail__accent[b-sao3dab557] {
    position: absolute;
    left: 0;
    top: 6px;
    bottom: 6px;
    width: 4px;
    background: var(--lw-primary-gold);
    clip-path: polygon(0 0, 100% 3px, 100% calc(100% - 3px), 0 100%);
}

.arm-rail__icon[b-sao3dab557] {
    flex-shrink: 0;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 28px;
    height: 28px;
}

.arm-rail__icon[b-sao3dab557]  .mud-icon-root {
    width: 16px;
    height: 16px;
    font-size: 16px;
    color: rgba(255, 255, 255, 0.35) !important;
    transition: color 0.15s ease;
}

.arm-rail__step.is-active .arm-rail__icon[b-sao3dab557]  .mud-icon-root {
    color: #fff !important;
}

.arm-rail__step.is-complete .arm-rail__icon[b-sao3dab557]  .mud-icon-root {
    color: rgba(255, 255, 255, 0.7) !important;
}

.arm-rail__label[b-sao3dab557] {
    flex: 1;
    min-width: 0;
    font-size: 14px;
    font-weight: 500;
    line-height: 22px;
    color: rgba(255, 255, 255, 0.4);
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.arm-rail__step.is-active .arm-rail__label[b-sao3dab557] {
    color: #fff;
}

.arm-rail__step.is-complete .arm-rail__label[b-sao3dab557] {
    color: rgba(255, 255, 255, 0.8);
}

.arm-rail__ring[b-sao3dab557] {
    flex-shrink: 0;
    width: 18px;
    height: 18px;
    border-radius: 50%;
    box-sizing: border-box;
    display: inline-flex;
    align-items: center;
    justify-content: center;
}

.arm-rail__ring--done[b-sao3dab557] {
    background: var(--lw-primary-blue);
}

.arm-rail__ring--done[b-sao3dab557]  .mud-icon-root {
    width: 10px;
    height: 10px;
    font-size: 10px;
    color: #fff !important;
}

.arm-rail__ring--active[b-sao3dab557] {
    border: 2px solid rgba(255, 255, 255, 0.2);
}

.arm-rail__ring--locked[b-sao3dab557] {
    border: 2px solid rgba(255, 255, 255, 0.08);
}

/* ---- Content top bar (reference WizardShell breadcrumb chrome) ---- */

.arm-topbar[b-sao3dab557] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 8px;
    height: 56px;
    flex-shrink: 0;
    padding: 0 16px 0 24px;
    background: var(--lw-white);
    border-bottom: 1px solid var(--lw-border);
}

.arm-crumbs[b-sao3dab557] {
    display: flex;
    align-items: center;
    gap: 4px;
    min-width: 0;
}

.arm-crumb[b-sao3dab557] {
    font-family: var(--lw-font-family);
    font-size: 14px;
    line-height: 22px;
    white-space: nowrap;
}

.arm-crumb--link[b-sao3dab557] {
    border: 0;
    background: transparent;
    padding: 0;
    color: var(--lw-gray-graphite);
    cursor: pointer;
    transition: color 0.15s;
}

.arm-crumb--link:hover:not(:disabled)[b-sao3dab557] {
    color: var(--lw-text-primary);
}

.arm-crumb--current[b-sao3dab557] {
    color: var(--lw-text-primary);
    font-weight: var(--lw-font-medium);
    overflow: hidden;
    text-overflow: ellipsis;
}

.arm-crumbs[b-sao3dab557]  .arm-crumb-sep.mud-icon-root {
    width: 16px;
    height: 16px;
    font-size: 16px;
    color: var(--lw-gray-smoke);
    flex-shrink: 0;
}

.arm-topbar__close[b-sao3dab557] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 36px;
    height: 36px;
    border: none;
    border-radius: 50%;
    background: transparent;
    color: var(--lw-gray-graphite);
    cursor: pointer;
    flex-shrink: 0;
    transition: background 0.15s, color 0.15s;
}

.arm-topbar__close:hover:not(:disabled)[b-sao3dab557] {
    background: var(--lw-bg-secondary);
    color: var(--lw-text-primary);
}

/* ---- Main content ---- */

.arm-main[b-sao3dab557] {
    display: flex;
    flex-direction: column;
    min-width: 0;
    min-height: 0;
}

.arm-content[b-sao3dab557] {
    flex: 1;
    min-height: 0;
    overflow: auto;
    padding: 32px 40px 40px;
}

.arm-step-wrap[b-sao3dab557] {
    max-width: 760px;
    margin: 0 auto;
}

.arm-stack[b-sao3dab557] {
    display: flex;
    flex-direction: column;
    gap: 16px;
}

/* ---- Footer ---- */

.arm-footer[b-sao3dab557] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    padding: 16px 40px;
    background: var(--lw-white);
    border-top: 1px solid var(--lw-border);
}

.arm-footer__back[b-sao3dab557] {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    height: 44px;
    padding: 0 18px;
    border: 1px solid var(--lw-border);
    border-radius: var(--lw-radius-control);
    background: var(--lw-white);
    color: var(--lw-primary-dark);
    font-family: var(--lw-font-family);
    font-size: 14px;
    font-weight: var(--lw-font-medium);
    cursor: pointer;
}

.arm-footer__back:hover:not(:disabled)[b-sao3dab557] {
    background: var(--lw-bg-secondary);
}

.arm-footer__continue[b-sao3dab557] {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    height: 44px;
    padding: 0 26px;
    border: none;
    border-radius: var(--lw-radius-control);
    background: var(--lw-primary-dark);
    color: #fff;
    font-family: var(--lw-font-family);
    font-size: 14px;
    font-weight: var(--lw-font-semibold);
    cursor: pointer;
    transition: background 0.15s;
}

.arm-footer__continue:hover:not(:disabled)[b-sao3dab557] {
    background: var(--lw-primary-dark-hover, color-mix(in srgb, var(--lw-primary-dark) 90%, #fff));
}

.arm-footer__back:disabled[b-sao3dab557],
.arm-footer__continue:disabled[b-sao3dab557] {
    opacity: 0.6;
    cursor: default;
}

/* ---- Documents step (reference documents-manager.tsx) ---- */

.arm-add-picker[b-sao3dab557] {
    width: 100%;
    min-width: 0;
}

/* Reference PickerField option row: label over muted sublabel, no icon. */
.arm-pick-option[b-sao3dab557] {
    display: flex;
    flex-direction: column;
    min-width: 0;
}

.arm-pick-name[b-sao3dab557] {
    min-width: 0;
    font-size: 14px;
    line-height: 20px;
    font-weight: 400;
    color: var(--lw-text-primary);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.arm-pick-size[b-sao3dab557] {
    font-size: 12px;
    line-height: 16px;
    color: var(--lw-gray-space);
}

/* Empty state: dashed form-surface card + paperclip roundel (reference). */
.arm-doc-empty[b-sao3dab557] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    text-align: center;
    padding: 40px 24px;
    border: 1px dashed var(--lw-border);
    border-radius: var(--lw-radius-card);
    background: var(--lw-form-surface);
}

.arm-doc-empty-tile[b-sao3dab557] {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 44px;
    height: 44px;
    border-radius: var(--lw-radius-card);
    background: var(--lw-status-info-bg);
    color: var(--lw-primary-blue);
}

.arm-doc-empty-title[b-sao3dab557] {
    margin: 12px 0 0;
    font-size: 14px;
    font-weight: var(--lw-font-semibold);
    color: var(--lw-text-primary);
}

.arm-doc-empty-desc[b-sao3dab557] {
    margin: 4px 0 0;
    max-width: 384px;
    font-size: 13px;
    line-height: 1.625;
    color: var(--lw-gray-graphite);
}

/* Attached doc cards (reference: rounded-card border bg-white px-4 py-3,
   type-tinted icon, two-line text, trash button). */
.arm-files[b-sao3dab557] {
    display: flex;
    flex-direction: column;
    gap: 8px;
}

.arm-file[b-sao3dab557] {
    display: flex;
    align-items: center;
    gap: 12px;
    border: 1px solid var(--lw-border);
    border-radius: var(--lw-radius-card);
    background: var(--lw-white);
    padding: 12px 16px;
}

.arm-file[b-sao3dab557]  .arm-file-icon.mud-icon-root {
    font-size: 20px;
    width: 20px;
    height: 20px;
    flex-shrink: 0;
}

.arm-file-text[b-sao3dab557] {
    display: flex;
    flex-direction: column;
    min-width: 0;
    flex: 1;
}

.arm-file-name[b-sao3dab557] {
    font-size: 14px;
    font-weight: var(--lw-font-medium);
    color: var(--lw-text-primary);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.arm-file-size[b-sao3dab557] {
    font-size: 12px;
    color: var(--lw-gray-graphite);
}

.arm-file-remove[b-sao3dab557] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 32px;
    height: 32px;
    border: none;
    border-radius: var(--lw-radius-control);
    background: transparent;
    padding: 0;
    color: var(--lw-gray-graphite);
    cursor: pointer;
    flex-shrink: 0;
    transition: background 0.15s, color 0.15s;
}

.arm-file-remove:hover:not(:disabled)[b-sao3dab557] {
    background: var(--lw-bg-secondary);
    color: var(--bs-danger, #dc3545);
}

.arm-file-remove[b-sao3dab557]  .mud-icon-root {
    font-size: 16px;
    width: 16px;
    height: 16px;
}

.arm-empty-note[b-sao3dab557] {
    margin: 0;
    padding: 16px;
    text-align: center;
    font-size: 13px;
    color: var(--lw-gray-graphite);
}

/* ---- Vendors step (reference rfp-vendors-step.tsx) ----
   Flush ControlCard body -> three full-bleed strips:
   1. white search+invite toolbar (px-24 py-12, hairline bottom)
   2. table-header select-all bar (px-24 py-10, 13/500 secondary, count right)
   3. selectable list (max-h 420 / min-h 260, rows px-24 py-12, 36px avatar,
      trailing 20px circular SelectIndicator; selected = 3px accent rail +
      info-bg/40 tint). */

.arm-vstep[b-sao3dab557] {
    display: flex;
    flex-direction: column;
}

.arm-vstep__toolbar[b-sao3dab557] {
    display: flex;
    align-items: center;
    gap: 8px;
    background: var(--lw-white);
    border-bottom: 1px solid var(--lw-border);
    padding: 12px 24px;
    border-radius: 0;
}

.arm-vstep__search[b-sao3dab557] {
    position: relative;
    flex: 1;
    min-width: 0;
}

.arm-vstep__search[b-sao3dab557]  .arm-vstep__search-icon.mud-icon-root {
    position: absolute;
    left: 12px;
    top: 50%;
    transform: translateY(-50%);
    width: 16px;
    height: 16px;
    font-size: 16px;
    color: var(--lw-gray-space);
    pointer-events: none;
}

.arm-vstep__search-input[b-sao3dab557] {
    width: 100%;
    height: 36px;
    box-sizing: border-box;
    padding: 0 12px 0 36px;
    border: 1px solid var(--lw-border);
    border-radius: var(--lw-radius-control);
    background: var(--lw-white);
    outline: none;
    font-family: var(--lw-font-family);
    font-size: 14px;
    color: var(--lw-text-primary);
    transition: border-color 0.15s ease;
}

.arm-vstep__search-input[b-sao3dab557]::placeholder {
    color: var(--lw-gray-space);
}

.arm-vstep__search-input:focus[b-sao3dab557] {
    border-color: var(--lw-primary-dark);
}

/* Select-all bar */
.arm-vstep__selectbar[b-sao3dab557] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    background: var(--lw-bg-table-header);
    border-bottom: 1px solid var(--lw-border);
    padding: 10px 24px;
}

.arm-vstep__selectall[b-sao3dab557] {
    display: inline-flex;
    align-items: center;
    gap: 10px;
    border: 0;
    background: transparent;
    padding: 0;
    font-family: var(--lw-font-family);
    font-size: 13px;
    font-weight: var(--lw-font-medium);
    color: var(--lw-gray-graphite);
    cursor: pointer;
    transition: color 0.15s;
}

.arm-vstep__selectall:hover:not(:disabled)[b-sao3dab557] {
    color: var(--lw-text-primary);
}

.arm-vstep__selectall:disabled[b-sao3dab557] {
    opacity: 0.5;
    cursor: default;
}

.arm-vstep__count[b-sao3dab557] {
    font-size: 13px;
    font-weight: var(--lw-font-medium);
    color: var(--lw-gray-graphite);
}

.arm-vstep__count strong[b-sao3dab557] {
    font-weight: var(--lw-font-semibold);
    color: var(--lw-text-primary);
}

/* Circular SelectIndicator: 20px, hollow steel border; filled = brand
   accent bg + white 12px check / minus. */
.arm-si[b-sao3dab557] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 20px;
    height: 20px;
    box-sizing: border-box;
    border-radius: 50%;
    border: 1px solid var(--lw-gray-steel);
    background: transparent;
    color: var(--lw-primary-blue-fg);
    flex-shrink: 0;
    transition: background 0.15s, border-color 0.15s;
}

.arm-si--filled[b-sao3dab557] {
    border-color: var(--lw-primary-blue);
    background: var(--lw-primary-blue);
}

.arm-si[b-sao3dab557]  .mud-icon-root {
    width: 12px;
    height: 12px;
    font-size: 12px;
}

/* List */
.arm-vstep__list[b-sao3dab557] {
    margin: 0;
    padding: 0;
    list-style: none;
    max-height: 420px;
    min-height: 260px;
    overflow-y: auto;
}

.arm-vstep__li[b-sao3dab557] {
    border-bottom: 1px solid var(--lw-border);
}

.arm-vstep__li:last-child[b-sao3dab557] {
    border-bottom: none;
}

.arm-vrow[b-sao3dab557] {
    position: relative;
    display: flex;
    align-items: center;
    gap: 12px;
    width: 100%;
    border: 0;
    background: transparent;
    padding: 12px 24px;
    text-align: left;
    font-family: var(--lw-font-family);
    cursor: pointer;
    transition: background 0.15s;
}

.arm-vrow:hover[b-sao3dab557] {
    background: color-mix(in srgb, var(--lw-accent) 40%, transparent);
}

.arm-vrow--selected[b-sao3dab557],
.arm-vrow--selected:hover[b-sao3dab557] {
    background: color-mix(in srgb, var(--lw-status-info-bg) 40%, transparent);
}

.arm-vrow__rail[b-sao3dab557] {
    position: absolute;
    left: 0;
    top: 0;
    bottom: 0;
    width: 3px;
    background: var(--lw-primary-blue);
}

.arm-vrow__text[b-sao3dab557] {
    display: flex;
    flex-direction: column;
    min-width: 0;
    flex: 1;
}

.arm-vrow__name[b-sao3dab557] {
    font-size: 14px;
    font-weight: var(--lw-font-medium);
    color: var(--lw-text-primary);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.arm-vrow__email[b-sao3dab557] {
    font-size: 12px;
    color: var(--lw-gray-space);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

/* Empty / no-results */
.arm-vstep__empty[b-sao3dab557] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 4px;
    min-height: 260px;
    padding: 0 24px;
    text-align: center;
}

.arm-vstep__empty-title[b-sao3dab557] {
    margin: 0;
    font-size: 14px;
    font-weight: var(--lw-font-medium);
    color: var(--lw-text-primary);
}

.arm-vstep__empty-desc[b-sao3dab557] {
    margin: 0;
    font-size: 12px;
    color: var(--lw-gray-graphite);
}

.arm-vstep__progress[b-sao3dab557] {
    padding: 12px 24px;
    border-top: 1px solid var(--lw-border);
}

.arm-empty-note[b-sao3dab557] {
    margin: 0;
    padding: 16px;
    text-align: center;
    font-size: 13px;
    color: var(--lw-gray-graphite);
}
/* _content/Ledgerwise/Components/Modals/AddRfpRecipientModal.razor.rz.scp.css */
/* Add RFP recipient -- canonical lw-modal chrome; picker layout only
   (source shell: ledgerwise-app organisms/gc/invite-vendors-modal.tsx,
   2026-07-23). */

.arr-loading[b-kao9my05rs] {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 8px;
    padding: 24px 0;
    font-size: 12px;
    color: var(--lw-gray-graphite);
}

.arr-picker-field[b-kao9my05rs] {
    width: 100%;
    min-width: 0;
}

/* Option rows: label over muted sublabel (PickerField pattern). */
.arr-option[b-kao9my05rs] {
    display: flex;
    flex-direction: column;
    min-width: 0;
}

.arr-option-name[b-kao9my05rs] {
    font-size: 14px;
    line-height: 20px;
    color: var(--lw-text-primary);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.arr-option-sub[b-kao9my05rs] {
    font-size: 12px;
    line-height: 16px;
    color: var(--lw-gray-space);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.arr-error[b-kao9my05rs] {
    margin: 0;
    font-size: 12px;
    color: var(--bs-danger, #dc3545);
}
/* _content/Ledgerwise/Components/Modals/AddSubcontractorInvoiceModal.razor.rz.scp.css */
/* Sub invoice submission mirroring the GC AddInvoiceModal anatomy:
   upload dropzone / ready row, per-file processing state, and the review
   takeover (58/42 ControlCard column beside the document viewer). Takeover
   sizing lives in mudblazor-overrides.css (.asim-dialog:has(.asim-take)). */

.asim-dropwrap[b-0tn03j8wa5] { position: relative; margin-bottom: 16px; }

.asim-dropzone[b-0tn03j8wa5] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    text-align: center;
    padding: 48px 32px;
    border: 2px dashed rgba(145, 158, 171, 0.32);
    border-radius: var(--lw-radius-sm);
    background: rgba(145, 158, 171, 0.08);
    cursor: pointer;
    transition: border-color 0.15s ease, background 0.15s ease;
}

.asim-dropwrap:hover .asim-dropzone[b-0tn03j8wa5] {
    border-color: var(--lw-primary-blue);
    background: color-mix(in srgb, var(--lw-primary-blue) 8%, transparent);
}

.asim-drop-tile[b-0tn03j8wa5] {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 56px;
    height: 56px;
    margin-bottom: 20px;
    border-radius: var(--lw-radius-sm);
    background: color-mix(in srgb, var(--lw-primary-dark) 10%, transparent);
    color: var(--lw-primary-dark);
}

.asim-drop-tile[b-0tn03j8wa5]  .mud-icon-root { width: 28px; height: 28px; }

.asim-drop-title[b-0tn03j8wa5] {
    margin: 0;
    font-size: 0.875rem;
    font-weight: var(--lw-font-semibold);
    color: var(--lw-text-primary);
}

.asim-drop-sub[b-0tn03j8wa5] { margin: 6px 0 0; font-size: 0.875rem; color: var(--lw-gray-graphite); }
.asim-drop-browse[b-0tn03j8wa5] { color: var(--lw-primary-blue); }
.asim-dropwrap:hover .asim-drop-browse[b-0tn03j8wa5] { text-decoration: underline; text-underline-offset: 2px; }
.asim-drop-hint[b-0tn03j8wa5] { margin: 16px 0 0; font-size: 0.75rem; color: var(--lw-gray-space); }

.asim-file[b-0tn03j8wa5] {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 12px 16px;
    border: 1px solid var(--lw-border);
    border-radius: var(--lw-radius-control);
    background: color-mix(in srgb, var(--lw-bg-muted) 30%, transparent);
}

.asim-file[b-0tn03j8wa5]  .asim-file-icon { width: 1.25rem; height: 1.25rem; color: var(--lw-filetype-pdf-fg); flex-shrink: 0; }

.asim-file-name[b-0tn03j8wa5] {
    min-width: 0;
    flex: 1;
    font-size: 0.875rem;
    font-weight: var(--lw-font-medium);
    color: var(--lw-text-primary);
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.asim-file-size[b-0tn03j8wa5] { flex-shrink: 0; font-size: 0.75rem; color: var(--lw-gray-graphite); }

.asim-file-remove[b-0tn03j8wa5] {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 24px;
    height: 24px;
    flex-shrink: 0;
    border: none;
    background: none;
    padding: 0;
    color: var(--lw-destructive);
    cursor: pointer;
    transition: opacity 0.15s ease;
}

.asim-file-remove:hover[b-0tn03j8wa5] { opacity: 0.8; }
.asim-file-remove[b-0tn03j8wa5]  .mud-icon-root { width: 1rem; height: 1rem; }

/* -- Processing step: file row carries the activity (spinner + shimmering
   fill); one quiet centered status block below. -- */

.asim-processing[b-0tn03j8wa5] { padding-bottom: 8px; }

.asim-file--processing[b-0tn03j8wa5] { display: flex; flex-direction: column; gap: 10px; }
.asim-file-row[b-0tn03j8wa5] { display: flex; align-items: center; gap: 12px; }

.asim-file-spinner[b-0tn03j8wa5] {
    border-color: var(--lw-primary-dark);
    border-top-color: transparent;
}

.asim-file-track[b-0tn03j8wa5] {
    height: 4px;
    width: 100%;
    overflow: hidden;
    border-radius: 9999px;
    background: var(--lw-border);
}

.asim-file-fill[b-0tn03j8wa5] {
    position: relative;
    height: 100%;
    overflow: hidden;
    border-radius: inherit;
    background: var(--lw-primary-dark);
    transition: width 0.2s ease;
}

.asim-file-fill[b-0tn03j8wa5]::after {
    content: "";
    position: absolute;
    inset: 0;
    background: linear-gradient(90deg, transparent 0%, rgba(255, 255, 255, 0.35) 50%, transparent 100%);
    animation: asim-fill-sweep-b-0tn03j8wa5 1.6s ease-in-out infinite;
}

@keyframes asim-fill-sweep-b-0tn03j8wa5 {
    from { transform: translateX(-100%); }
    to { transform: translateX(100%); }
}

@media (prefers-reduced-motion: reduce) {
    .asim-file-fill[b-0tn03j8wa5]::after { animation: none; display: none; }
}

.asim-processing-status[b-0tn03j8wa5] {
    margin-top: 20px;
    text-align: center;
}

.asim-processing-title[b-0tn03j8wa5] {
    margin: 0;
    font-size: 0.8125rem;
    font-weight: var(--lw-font-medium);
    font-variant-numeric: tabular-nums;
    color: var(--lw-text-primary);
}

.asim-processing-sub[b-0tn03j8wa5] {
    margin: 4px auto 0;
    max-width: 380px;
    font-size: 0.75rem;
    line-height: 1.5;
    color: var(--lw-gray-space);
}

/* -- Review takeover (mirrors the GC add-invoice takeover): h-14 header with
   file chip + live amount; 58/42 split of a muted ControlCard form column
   beside the document viewer. -- */

.asim-take-head[b-0tn03j8wa5] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    height: 56px;
    padding: 0 16px;
    background: var(--lw-white);
    border-bottom: 1px solid var(--lw-border);
}

.asim-take-head-left[b-0tn03j8wa5] { display: flex; align-items: center; gap: 12px; min-width: 0; }
.asim-take-head-right[b-0tn03j8wa5] { display: flex; align-items: center; gap: 12px; flex-shrink: 0; }

.asim-take-title[b-0tn03j8wa5] {
    margin: 0;
    font-family: var(--lw-font-family);
    font-size: 1.125rem;
    font-weight: var(--lw-font-bold);
    color: var(--lw-text-primary);
    white-space: nowrap;
}

.asim-inv-chip[b-0tn03j8wa5] {
    flex-shrink: 0;
    max-width: 260px;
    padding: 2px 8px;
    border-radius: var(--lw-radius-control);
    background: color-mix(in srgb, var(--lw-primary-blue) 10%, transparent);
    font-size: 0.75rem;
    font-weight: var(--lw-font-semibold);
    color: var(--lw-primary-blue);
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.asim-take-nav[b-0tn03j8wa5] {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 32px;
    height: 32px;
    border: none;
    border-radius: 9999px;
    background: none;
    padding: 0;
    color: var(--lw-gray-graphite);
    cursor: pointer;
    transition: background 0.15s ease, color 0.15s ease;
}

.asim-take-nav:hover:not(:disabled)[b-0tn03j8wa5] { background: var(--lw-accent); color: var(--lw-text-primary); }
.asim-take-nav:disabled[b-0tn03j8wa5] { opacity: 0.3; cursor: default; }
.asim-take-close[b-0tn03j8wa5]  .mud-icon-root { width: 1.125rem; height: 1.125rem; }

.asim-take-amount[b-0tn03j8wa5] {
    font-size: 1rem;
    font-weight: var(--lw-font-bold);
    font-variant-numeric: tabular-nums;
    color: var(--lw-text-primary);
}

.asim-take[b-0tn03j8wa5] {
    display: flex;
    /* Fullscreen viewport minus the 56px takeover header and the modal
       footer band (~72px). */
    height: calc(100vh - 128px);
    background: var(--lw-bg-muted);
}

.asim-take-form[b-0tn03j8wa5] {
    flex: 0 0 58%;
    min-width: 0;
    overflow-y: auto;
}

.asim-take-form-inner[b-0tn03j8wa5] {
    margin: 0 auto;
    display: flex;
    width: 100%;
    max-width: 760px;
    flex-direction: column;
    gap: 20px;
    padding: 32px;
}

.asim-take-viewer[b-0tn03j8wa5] {
    flex: 1;
    min-width: 0;
    display: flex;
    flex-direction: column;
    border-left: 1px solid var(--lw-border);
    background: var(--lw-bg-muted);
}

.asim-take-iframe[b-0tn03j8wa5] { width: 100%; height: 100%; border: none; display: block; }

.asim-take-viewer-state[b-0tn03j8wa5] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 8px;
    height: 100%;
    text-align: center;
    padding: 24px;
}

/* Form internals. */
.asim-fields[b-0tn03j8wa5] { display: flex; flex-direction: column; gap: 16px; }

.asim-date-grid[b-0tn03j8wa5] {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 16px;
}

@media (max-width: 639px) {
    .asim-date-grid[b-0tn03j8wa5] { grid-template-columns: 1fr; }
}

/* -- FieldShell chrome for the Amount MudNumericField (recipe mirrors
   LwTextField.razor.css: 54px white box, 8px radius, 14/400 value). -- */

.asim-numfield[b-0tn03j8wa5]  .mud-input-helper-text {
    font-family: var(--lw-font-family);
    font-size: 13px;
    line-height: 18px;
    margin-top: 4px;
}

.asim-numfield[b-0tn03j8wa5]  .mud-input-control { margin-top: 0; }

.asim-numfield[b-0tn03j8wa5]  .mud-input-outlined {
    font-size: 14px;
    font-weight: 400;
    background-color: var(--lw-white);
    border-radius: var(--lw-radius-control);
}

.asim-numfield[b-0tn03j8wa5]  .mud-input-outlined input.mud-input-slot {
    height: 54px;
    box-sizing: border-box;
    padding: 16px 14px;
    font-size: 14px;
    font-weight: 400;
    /* 16 + 22 + 16 = 54 -- centers the text block exactly like FieldShell. */
    line-height: 22px;
}

.asim-numfield[b-0tn03j8wa5]  .mud-input-adornment-start + input.mud-input-slot {
    padding-left: 6px;
}

.asim-numfield[b-0tn03j8wa5]  .mud-input-adornment-text {
    font-size: 14px;
    color: var(--lw-gray-graphite);
}

.asim-numfield[b-0tn03j8wa5]  .mud-input-label {
    font-size: 14px;
    font-weight: 400;
    line-height: 22px;
    letter-spacing: normal;
    color: var(--lw-gray-space);
}

.asim-numfield[b-0tn03j8wa5]  .mud-input-label-outlined {
    top: 50%;
    transform: translate(13px, -50%) scale(1);
    padding: 0 2px !important;
    transition: top 0.2s cubic-bezier(0, 0, 0.2, 1), transform 0.2s cubic-bezier(0, 0, 0.2, 1), color 0.2s;
}

.asim-numfield[b-0tn03j8wa5]  .mud-shrink ~ label.mud-input-label.mud-input-label-inputcontrol.mud-input-label-outlined,
.asim-numfield[b-0tn03j8wa5]  .mud-input:focus-within ~ label.mud-input-label.mud-input-label-inputcontrol.mud-input-label-outlined {
    top: 0;
    transform: translate(13px, -6px) scale(0.857);
}

.asim-numfield[b-0tn03j8wa5]  .mud-shrink ~ label.mud-input-label.mud-input-label-inputcontrol.mud-input-label-outlined {
    color: var(--lw-gray-graphite);
}

.asim-numfield[b-0tn03j8wa5]  .mud-input:focus-within ~ label.mud-input-label.mud-input-label-inputcontrol.mud-input-label-outlined {
    color: var(--lw-gray-phantom);
}

.asim-numfield[b-0tn03j8wa5]  .mud-input.mud-input-outlined:not(.mud-disabled):not(:focus-within):hover .mud-input-outlined-border {
    border-color: var(--lw-input-border);
}

.asim-numfield[b-0tn03j8wa5]  .mud-input.mud-input-outlined:focus-within > .mud-input-outlined-border,
.asim-numfield[b-0tn03j8wa5]  .mud-input.mud-input-outlined:focus-within .mud-shrink > .mud-input-outlined-border {
    border-width: 1px;
    border-color: var(--lw-gray-phantom);
}
/* _content/Ledgerwise/Components/Modals/AddVendorModal.razor.rz.scp.css */
/* Add-vendor dialog internals -- fields canonicalized 2026-07-28 (review
   round): LwTextField/LwSelect atoms; the company MudAutocomplete stays for
   its search-or-free-text binding and is reskinned with the FieldShell
   recipe below (source: CreateChangeOrderModal .cco-field, itself mirroring
   LwTextField.razor.css). */

.avm-fields[b-cmieart4zi] {
    display: flex;
    flex-direction: column;
    gap: 16px;
}

.avm-grid2[b-cmieart4zi] {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 16px;
}

@media (max-width: 640px) {
    .avm-grid2[b-cmieart4zi] {
        grid-template-columns: minmax(0, 1fr);
    }
}

/* Autocomplete option rows (arr-option idiom). */
.avm-option[b-cmieart4zi] {
    display: flex;
    flex-direction: column;
    gap: 2px;
    min-width: 0;
    padding: 2px 0;
}

.avm-option-name[b-cmieart4zi] {
    font-family: var(--lw-font-family);
    font-size: 14px;
    font-weight: var(--lw-font-medium);
    color: var(--lw-text-primary);
}

.avm-option-sub[b-cmieart4zi] {
    font-family: var(--lw-font-family);
    font-size: 12px;
    color: var(--lw-gray-graphite);
}

/* Inline accent action inside the existing-vendor note. */
.avm-link[b-cmieart4zi] {
    border: 0;
    background: transparent;
    padding: 0;
    cursor: pointer;
    font-family: inherit;
    font-size: inherit;
    font-weight: var(--lw-font-medium);
    color: var(--lw-primary-blue);
}

.avm-link:hover[b-cmieart4zi] {
    opacity: 0.8;
}

/* Footer band bleed (LwModalBody adds the 24px inset). */
.avm-footbleed[b-cmieart4zi] { margin: 16px -24px -24px; }

/* -- FieldShell reskin for the company autocomplete (cco-field recipe) -- */
.avm-field[b-cmieart4zi]  .mud-input-control {
    margin-top: 0;
}

.avm-field[b-cmieart4zi]  .mud-input-outlined {
    font-size: 14px;
    font-weight: 400;
    background-color: var(--lw-white);
    border-radius: var(--lw-radius-control);
}

.avm-field[b-cmieart4zi]  .mud-input-outlined input.mud-input-slot {
    height: 54px;
    box-sizing: border-box;
    padding: 16px 14px;
    font-size: 14px;
    font-weight: 400;
    line-height: 22px;
}

.avm-field[b-cmieart4zi]  .mud-input-label {
    font-size: 14px;
    font-weight: 400;
    line-height: 22px;
    letter-spacing: normal;
    color: var(--lw-gray-space);
}

/* Resting label geometrically centered in the 54px box. */
.avm-field[b-cmieart4zi]  .mud-input-label-outlined {
    top: 50%;
    transform: translate(13px, -50%) scale(1);
    padding: 0 2px !important;
    transition: top 0.2s cubic-bezier(0, 0, 0.2, 1), transform 0.2s cubic-bezier(0, 0, 0.2, 1), color 0.2s;
}

/* Floated label: mirror Mud's shrink/focus selectors (4-class specificity). */
.avm-field[b-cmieart4zi]  .mud-shrink ~ label.mud-input-label.mud-input-label-inputcontrol.mud-input-label-outlined,
.avm-field[b-cmieart4zi]  .mud-input:focus-within ~ label.mud-input-label.mud-input-label-inputcontrol.mud-input-label-outlined {
    top: 0;
    transform: translate(13px, -6px) scale(0.857);
}

.avm-field[b-cmieart4zi]  .mud-shrink ~ label.mud-input-label.mud-input-label-inputcontrol.mud-input-label-outlined {
    color: var(--lw-gray-graphite);
}

.avm-field[b-cmieart4zi]  .mud-input:focus-within ~ label.mud-input-label.mud-input-label-inputcontrol.mud-input-label-outlined {
    color: var(--lw-gray-phantom);
}

/* Border states -- rest --lw-input-border 1px; focus 1px phantom. */
.avm-field[b-cmieart4zi]  .mud-input.mud-input-outlined:not(.mud-disabled):not(:focus-within):hover .mud-input-outlined-border {
    border-color: var(--lw-input-border);
}

.avm-field[b-cmieart4zi]  .mud-input.mud-input-outlined:focus-within > .mud-input-outlined-border,
.avm-field[b-cmieart4zi]  .mud-input.mud-input-outlined:focus-within .mud-shrink > .mud-input-outlined-border {
    border-width: 1px;
    border-color: var(--lw-gray-phantom);
}

/* Autocomplete caret / clear adornments: quiet gray like the LwSelect caret. */
.avm-field[b-cmieart4zi]  .mud-input-adornment .mud-icon-button,
.avm-field[b-cmieart4zi]  .mud-icon-button-edge-end {
    color: var(--lw-gray-space);
}
/* _content/Ledgerwise/Components/Modals/AgreementSignedModal.razor.rz.scp.css */
/* AgreementSignedModal -- mirrors ledgerwise-ui-app
   organisms/kickoff/flow-complete-modal.tsx (re-measured from source
   2026-07-19): body p-7 center (md:p-9); 64px success-dark check circle w/
   32px white glyph; title mt-5 text-xl bold tracking-tight foreground; body
   mt-2 14/1.625 content-secondary max-44ch; primary mt-7 Button size=action
   (h-10, 14/500, radius-control, hover primary/90) full width.
   Frame (rounded-card form-surface panel) comes from the canonical global
   .lw-modal pattern (Class="lw-modal lw-modal--sm" in app.css). */

.asm-body[b-y7bn9lt5my] {
    display: flex;
    flex-direction: column;
    align-items: center;
    text-align: center;
    padding: 28px;
}

@media (min-width: 768px) {
    .asm-body[b-y7bn9lt5my] { padding: 36px; }
}

.asm-check[b-y7bn9lt5my] {
    width: 64px;
    height: 64px;
    border-radius: 50%;
    background: var(--lw-success-dark);
    color: #fff;
    display: inline-flex;
    align-items: center;
    justify-content: center;
}

[b-y7bn9lt5my] .asm-check .mud-icon-root {
    width: 32px;
    height: 32px;
    font-size: 32px;
}

.asm-title[b-y7bn9lt5my] {
    margin: 20px 0 0;
    font-size: 1.25rem;
    font-weight: 700;
    color: var(--lw-text-primary);
    letter-spacing: var(--lw-tracking-tight);
}

.asm-message[b-y7bn9lt5my] {
    margin: 8px 0 0;
    font-size: 0.875rem;
    line-height: 1.625;
    color: var(--lw-gray-graphite);
    max-width: 44ch;
}

/* CTA renders via LwButton (Interactive, Size=Action, full width). */
.asm-cta-slot[b-y7bn9lt5my] { margin-top: 28px; width: 100%; }
/* _content/Ledgerwise/Components/Modals/AssignInvoiceToDrawRequestModal.razor.rz.scp.css */
/* Force the fullscreen dialog overlay above the MudBlazor
   AppBar (z-index 1100) and Drawer (z-index 1200) */
[b-ae1376d817] .mud-overlay.mud-overlay-dialog {
    z-index: 1400 !important;
}

/* Invoice card - draggable */
.invoice-card-draggable[b-ae1376d817] {
    border: 1px solid var(--lw-border);
    border-radius: 0;
    padding: 0.75rem;
    margin-bottom: 0.75rem;
    background: #fff;
    transition: background 0.2s ease, border-color 0.2s ease, box-shadow 0.2s ease, transform 0.2s ease;
}

.invoice-card-draggable.has-remaining[b-ae1376d817] {
    cursor: grab;
}

.invoice-card-draggable.has-remaining:hover[b-ae1376d817] {
    background: linear-gradient(135deg, rgba(57, 128, 165, 0.06) 0%, rgba(57, 128, 165, 0.12) 100%);
    border-color: var(--lw-primary-blue);
    box-shadow: 0 2px 12px rgba(57, 128, 165, 0.15);
}

.invoice-card-draggable.dragging[b-ae1376d817] {
    cursor: grabbing;
    opacity: 0.5;
    border: 2px dashed var(--lw-primary-blue);
    background: linear-gradient(135deg, rgba(57, 128, 165, 0.04) 0%, rgba(57, 128, 165, 0.08) 100%);
    transform: scale(0.98);
}

/* Fully allocated invoice card -- full green background */
.invoice-card-draggable.fully-allocated[b-ae1376d817] {
    border-color: var(--lw-success-dark);
    background: var(--lw-status-success-bg);
}

/* Drop zone rows */
[b-ae1376d817] .drop-zone-row {
    transition: background 0.2s ease, outline 0.2s ease, transform 0.15s ease;
}

[b-ae1376d817] .drop-zone-row.drag-active {
    background: rgba(57, 128, 165, 0.04);
}

[b-ae1376d817] .drop-zone-row.drag-active:nth-child(even) {
    background: rgba(57, 128, 165, 0.10);
}

[b-ae1376d817] .drop-zone-row.drag-over {
    background: rgba(57, 128, 165, 0.18) !important;
    outline: 2px solid var(--lw-primary-blue) !important;
    outline-offset: -2px;
}

/* Nested allocation rows */
[b-ae1376d817] .allocation-nested-row {
    background: var(--lw-bg-muted);
    animation: slide-in-b-ae1376d817 0.25s ease-out;
}

[b-ae1376d817] .allocation-nested-row td {
    border-bottom: 1px solid var(--lw-border);
    padding-top: 4px;
    padding-bottom: 4px;
}

/* Over-budget highlighting -- destructive red, matching ledgerwise-ui
   (allocation-budget-table.tsx: bg-destructive/[0.04] + border-l-destructive). */
[b-ae1376d817] tr.over-budget-row > td {
    background: rgba(184, 53, 48, 0.04) !important;
}

[b-ae1376d817] tr.over-budget-row > td:first-child {
    box-shadow: inset 3px 0 0 0 var(--lw-destructive);
}

/* Negative "Available" figure on an over-budget line (text-destructive font-bold). */
[b-ae1376d817] .over-budget-amount {
    color: var(--lw-destructive) !important;
    font-weight: 700 !important;
}

/* Allocation state badges. Mirror the small pills in ledgerwise-ui's allocation
   rows / invoice cards: solid-red "Over Budget", blue-tinted "+$ Requested",
   gold "Over Budget" once a budget adjustment has been requested. */
[b-ae1376d817] .lw-alloc-badge {
    display: inline-flex;
    align-items: center;
    line-height: 1;
    font-weight: 600;
    padding: 2px 6px;
    border-radius: 4px;
    white-space: nowrap;
    text-transform: none;
    letter-spacing: 0;
}

[b-ae1376d817] .lw-alloc-badge--over {
    background: var(--lw-destructive);
    color: #fff;
    font-size: 9px;
}

[b-ae1376d817] .lw-alloc-badge--requested {
    background: var(--lw-status-primary-bg);
    color: var(--lw-status-primary-fg);
    font-size: 10px;
}

[b-ae1376d817] .lw-alloc-badge--ba {
    background: var(--lw-status-warning-bg);
    color: var(--lw-status-warning-fg);
    font-size: 10px;
}

/* Invoice switcher -- underline tabs (allocation-invoice-panel.tsx tab row). */
[b-ae1376d817] .lw-invoice-tabs {
    display: flex;
    align-items: stretch;
    overflow-x: auto;
    border-bottom: 1px solid var(--lw-border);
    margin-bottom: 0.75rem;
    scrollbar-width: none;
}

[b-ae1376d817] .lw-invoice-tabs::-webkit-scrollbar {
    height: 0;
    display: none;
}

[b-ae1376d817] .lw-invoice-tab {
    display: inline-flex;
    align-items: center;
    gap: 0.375rem;
    flex-shrink: 0;
    cursor: pointer;
    padding: 0.5rem 0.75rem;
    border-bottom: 2px solid transparent;
    margin-bottom: -1px;
    transition: background 0.15s ease, border-color 0.15s ease;
}

[b-ae1376d817] .lw-invoice-tab:hover {
    background: var(--lw-status-neutral-bg);
}

[b-ae1376d817] .lw-invoice-tab--active {
    border-bottom-color: var(--lw-text-primary);
}

[b-ae1376d817] .lw-invoice-tab-name {
    max-width: 90px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    font-size: 0.75rem;
    font-weight: 500;
    color: var(--lw-gray-graphite);
}

[b-ae1376d817] .lw-invoice-tab--active .lw-invoice-tab-name {
    color: var(--lw-text-primary);
}

[b-ae1376d817] .lw-invoice-tab--complete .lw-invoice-tab-name {
    color: var(--lw-success-dark);
}

[b-ae1376d817] .lw-invoice-tab-num {
    flex-shrink: 0;
    background: var(--lw-bg-muted);
    color: var(--lw-gray-graphite);
    border-radius: 4px;
    padding: 1px 6px;
    font-size: 10px;
    line-height: 1.4;
}

[b-ae1376d817] .lw-invoice-tab-check {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 14px;
    height: 14px;
    border-radius: 50%;
    background: var(--lw-success-dark);
    flex-shrink: 0;
}

[b-ae1376d817] .lw-invoice-tab-check .mud-icon-root {
    font-size: 9px;
    color: #fff;
}

/* Count badge next to the "Invoices" heading. */
[b-ae1376d817] .lw-count-badge {
    display: inline-flex;
    align-items: center;
    background: var(--lw-bg-muted);
    color: var(--lw-gray-graphite);
    border-radius: 4px;
    padding: 1px 6px;
    font-size: 0.75rem;
    font-weight: 700;
    line-height: 1.4;
}

/* Previous / "x of y" / Next footer (allocation-invoice-panel.tsx nav footer). */
[b-ae1376d817] .lw-invoice-nav {
    display: flex;
    align-items: center;
    justify-content: space-between;
    border-top: 1px solid var(--lw-border);
    padding-top: 0.5rem;
    margin-top: 0.75rem;
}

[b-ae1376d817] .lw-invoice-nav-btn,
[b-ae1376d817] .lw-invoice-nav-btn .mud-icon-root {
    color: var(--lw-gray-graphite) !important;
}

[b-ae1376d817] .lw-invoice-nav-btn {
    text-transform: none;
    font-weight: 500;
}

[b-ae1376d817] .lw-invoice-nav-btn:disabled,
[b-ae1376d817] .lw-invoice-nav-btn:disabled .mud-icon-root {
    opacity: 0.4;
}

@keyframes slide-in-b-ae1376d817 {
    from {
        opacity: 0;
        transform: translateY(-8px);
    }
    to {
        opacity: 1;
        transform: translateY(0);
    }
}

/* -- Add-to-payment-request chooser (reference add-to-payment-request-modal,
   2026-07-20): brand-accent selection summary bar + radio cards. -- */

.aidr-summary[b-ae1376d817] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    padding: 10px 14px;
    border: 1px solid color-mix(in srgb, var(--lw-primary-blue) 25%, transparent);
    border-radius: var(--lw-radius-control);
    background: color-mix(in srgb, var(--lw-primary-blue) 5%, transparent);
}

.aidr-summary-count[b-ae1376d817] { font-size: 0.875rem; font-weight: var(--lw-font-semibold); color: var(--lw-text-primary); }
.aidr-summary-total[b-ae1376d817] { font-size: 0.875rem; font-weight: var(--lw-font-semibold); font-variant-numeric: tabular-nums; color: var(--lw-text-primary); }

.aidr-options[b-ae1376d817] { display: flex; flex-direction: column; gap: 10px; }

.aidr-option[b-ae1376d817] {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 12px 16px;
    border: 1px solid var(--lw-border);
    border-radius: var(--lw-radius-control);
    cursor: pointer;
    transition: border-color 0.15s ease, background 0.15s ease;
}

.aidr-option:hover[b-ae1376d817] {
    border-color: color-mix(in srgb, var(--lw-primary-blue) 40%, transparent);
    background: color-mix(in srgb, var(--lw-accent) 40%, transparent);
}

.aidr-option--selected[b-ae1376d817],
.aidr-option--selected:hover[b-ae1376d817] {
    border-color: var(--lw-primary-blue);
    background: color-mix(in srgb, var(--lw-primary-blue) 5%, transparent);
}

.aidr-radio[b-ae1376d817] {
    width: 18px;
    height: 18px;
    flex-shrink: 0;
    accent-color: var(--lw-primary-dark);
    cursor: pointer;
}

.aidr-option-text[b-ae1376d817] { display: flex; flex-direction: column; min-width: 0; flex: 1; }
.aidr-option-title[b-ae1376d817] { font-size: 0.875rem; font-weight: var(--lw-font-semibold); color: var(--lw-text-primary); }
.aidr-option-sub[b-ae1376d817] { font-size: 0.75rem; color: var(--lw-gray-space); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }

/* -- Step 2 (full-screen allocation workspace) section heads + actions.
   Section labels mirror ledgerwise-app allocation-invoice-panel / -budget-table
   headers (text-sm semibold); the budget head keeps a right-aligned running
   total (Blazor-only affordance). -- */

.aidr-section-head[b-ae1376d817] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    margin-bottom: 0.75rem;
}

/* Full-screen allocation workspace shell (inside .lw-modal--takeover):
   split panes fill the content region; the right pane owns the budget grid. */
.aidr-split[b-ae1376d817] {
    display: flex;
    flex: 1 1 auto;
    min-height: 0;
    height: 100%;
}

.aidr-left[b-ae1376d817] {
    width: 42%;
    display: flex;
    flex-direction: column;
    min-height: 0;
    overflow: hidden;
}

/* Left panel: full-bleed section header + tabs, padded scroll body, pinned nav. */
.aidr-inv-header[b-ae1376d817] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 12px 16px;
    border-bottom: 1px solid var(--lw-border);
    flex: 0 0 auto;
}

.aidr-inv-header-title[b-ae1376d817] { display: flex; align-items: center; gap: 8px; }

.aidr-inv-count[b-ae1376d817] {
    display: inline-flex;
    align-items: center;
    background: var(--lw-bg-muted);
    color: var(--lw-gray-graphite);
    border-radius: 4px;
    padding: 1px 6px;
    font-size: 12px;
    font-weight: 600;
    line-height: 1.4;
}

.aidr-left-body[b-ae1376d817] {
    flex: 1;
    min-height: 0;
    display: flex;
    flex-direction: column;
    gap: 12px;
    padding: 16px;
    overflow-y: auto;
}

/* Invoice card */
.aidr-inv-card[b-ae1376d817] {
    flex: 0 0 auto;
    border: 1px solid var(--lw-border);
    border-radius: var(--lw-radius-card);
    background: #fff;
    box-shadow: var(--lw-shadow-card);
    padding: 12px;
    transition: border-color 0.15s ease, box-shadow 0.15s ease, background 0.15s ease, opacity 0.15s ease;
}

.aidr-inv-card[draggable="true"][b-ae1376d817] { cursor: grab; }
.aidr-inv-card--done[b-ae1376d817] { border-color: color-mix(in srgb, var(--lw-success-dark) 25%, transparent); background: var(--lw-status-success-bg); box-shadow: none; }
.aidr-inv-card--dragging[b-ae1376d817] { opacity: 0.5; cursor: grabbing; }

.aidr-inv-cardhead[b-ae1376d817] { display: flex; align-items: flex-start; gap: 8px; }
.aidr-inv-lead[b-ae1376d817] { display: inline-flex; align-items: center; flex-shrink: 0; margin-top: 4px; }
.aidr-inv-grip[b-ae1376d817] { color: var(--lw-gray-space); }
.aidr-inv-lead--check[b-ae1376d817] { color: var(--lw-success-dark); }

.aidr-inv-avatar[b-ae1376d817] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 28px;
    height: 28px;
    border-radius: 50%;
    background: var(--lw-primary-dark);
    color: #fff;
    font-size: 10px;
    font-weight: 700;
    flex-shrink: 0;
}

.aidr-inv-avatar--done[b-ae1376d817] { background: var(--lw-success-dark); }

.aidr-inv-meta[b-ae1376d817] { min-width: 0; flex: 1; }
.aidr-inv-nrow[b-ae1376d817] { display: flex; align-items: center; gap: 6px; flex-wrap: wrap; }
.aidr-inv-name[b-ae1376d817] { font-size: 14px; font-weight: 600; color: var(--lw-text-primary); }
.aidr-inv-name--done[b-ae1376d817] { color: var(--lw-success-dark); }
.aidr-inv-num[b-ae1376d817] { font-size: 12px; color: var(--lw-gray-graphite); }

.aidr-inv-summary[b-ae1376d817] {
    margin: 8px 0 0;
    font-size: 12px;
    color: var(--lw-gray-graphite);
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

.aidr-inv-progress[b-ae1376d817] {
    margin-top: 12px;
    height: 5px;
    width: 100%;
    border-radius: 999px;
    background: var(--lw-bg-muted);
    overflow: hidden;
}

.aidr-inv-progress-fill[b-ae1376d817] { height: 100%; border-radius: 999px; background: var(--lw-primary-blue); transition: width 0.3s ease; }
.aidr-inv-progress-fill--done[b-ae1376d817] { background: var(--lw-success-dark); }
.aidr-inv-progress-fill--over[b-ae1376d817] { background: var(--lw-destructive); }

.aidr-inv-info[b-ae1376d817] { margin-top: 8px; display: flex; align-items: center; justify-content: space-between; }
.aidr-inv-alloc[b-ae1376d817] { display: flex; align-items: baseline; gap: 4px; }
.aidr-inv-alloc-cur[b-ae1376d817] { font-size: 12px; font-weight: 600; color: var(--lw-text-primary); font-variant-numeric: tabular-nums; }
.aidr-inv-alloc-cur--done[b-ae1376d817] { color: var(--lw-success-dark); }
.aidr-inv-alloc-of[b-ae1376d817] { font-size: 12px; color: var(--lw-gray-space); font-variant-numeric: tabular-nums; }
.aidr-inv-remaining[b-ae1376d817] { font-size: 12px; color: var(--lw-gray-graphite); }

.aidr-inv-done[b-ae1376d817] {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    background: var(--lw-status-success-bg);
    color: var(--lw-success-dark);
    border-radius: 4px;
    padding: 2px 6px;
    font-size: 10px;
    font-weight: 600;
}

/* Attachments + preview. The left body is the scroll region; the preview keeps
   a natural height so the pane scrolls independently of the budget grid. */
.aidr-attach[b-ae1376d817] { flex: 0 0 auto; display: flex; flex-direction: column; }
.aidr-attach-head[b-ae1376d817] { font-size: 12px; font-weight: 600; color: var(--lw-text-primary); margin-bottom: 8px; }
.aidr-attach-chips[b-ae1376d817] { display: flex; gap: 8px; flex-wrap: wrap; margin-bottom: 12px; }

.aidr-attach-chip[b-ae1376d817] {
    border: 1px solid var(--lw-border);
    background: #fff;
    border-radius: var(--lw-radius-control);
    padding: 4px 10px;
    font-size: 12px;
    color: var(--lw-text-primary);
    cursor: pointer;
    max-width: 100%;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    transition: background 0.15s ease, border-color 0.15s ease, color 0.15s ease;
}

.aidr-attach-chip:hover[b-ae1376d817] { border-color: var(--lw-primary-blue); }
.aidr-attach-chip--active[b-ae1376d817] { background: var(--lw-primary-dark); border-color: var(--lw-primary-dark); color: #fff; }

.aidr-preview[b-ae1376d817] {
    flex: 0 0 auto;
    height: 420px;
    display: flex;
    flex-direction: column;
    border: 1px solid var(--lw-border);
    border-radius: var(--lw-radius-card);
    overflow: hidden;
    background: #fff;
}

.aidr-preview-head[b-ae1376d817] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 8px;
    padding: 6px 10px;
    border-bottom: 1px solid var(--lw-border);
    flex: 0 0 auto;
}

.aidr-preview-name[b-ae1376d817] { font-size: 12px; color: var(--lw-gray-graphite); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.aidr-preview-open[b-ae1376d817] { border: none; background: none; cursor: pointer; color: var(--lw-gray-graphite); display: inline-flex; padding: 2px; flex-shrink: 0; }
.aidr-preview-open:hover[b-ae1376d817] { color: var(--lw-primary-blue); }
.aidr-preview-body[b-ae1376d817] { flex: 1; min-height: 0; overflow: hidden; }
.aidr-preview-body iframe[b-ae1376d817] { width: 100%; height: 100%; border: none; }
.aidr-preview-img[b-ae1376d817] { width: 100%; height: 100%; overflow: auto; display: flex; align-items: center; justify-content: center; background: var(--lw-bg-muted); }
.aidr-preview-img img[b-ae1376d817] { max-width: 100%; max-height: 100%; object-fit: contain; }
.aidr-preview-center[b-ae1376d817] { height: 100%; display: flex; align-items: center; justify-content: center; padding: 16px; text-align: center; }
.aidr-preview-muted[b-ae1376d817] { font-size: 12px; color: var(--lw-gray-graphite); }

/* Prev / next nav */
.aidr-inv-nav[b-ae1376d817] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 10px 16px;
    border-top: 1px solid var(--lw-border);
    flex: 0 0 auto;
}

.aidr-inv-navbtn[b-ae1376d817] {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    background: none;
    border: none;
    cursor: pointer;
    font-size: 12px;
    font-weight: 500;
    color: var(--lw-gray-graphite);
    transition: color 0.15s ease;
}

.aidr-inv-navbtn:hover:not(:disabled)[b-ae1376d817] { color: var(--lw-text-primary); }
.aidr-inv-navbtn:disabled[b-ae1376d817] { opacity: 0.4; cursor: default; }
.aidr-inv-nav-count[b-ae1376d817] { font-size: 12px; color: var(--lw-gray-space); }

.aidr-right[b-ae1376d817] {
    flex: 1;
    min-width: 0;
    display: flex;
    flex-direction: column;
    min-height: 0;
    border-left: 1px solid var(--lw-border);
}

.aidr-right-head[b-ae1376d817] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 12px 16px;
    border-bottom: 1px solid var(--lw-border);
    flex: 0 0 auto;
}

/* Full-width pinned footer bar (DialogActions), reference OnboardingFooter. */
.aidr-footerbar[b-ae1376d817] {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: 12px;
    padding: 12px 20px;
    border-top: 1px solid var(--lw-border);
    background: #fff;
}

.aidr-footer-cancel[b-ae1376d817] {
    background: none;
    border: none;
    padding: 8px 12px;
    cursor: pointer;
    font-size: 14px;
    font-weight: 500;
    color: var(--lw-gray-graphite);
    transition: color 0.15s ease;
}

.aidr-footer-cancel:hover[b-ae1376d817] { color: var(--lw-text-primary); }
.aidr-footer-cancel:disabled[b-ae1376d817] { opacity: 0.5; cursor: default; }

.aidr-section-title[b-ae1376d817] {
    font-size: 0.875rem;
    font-weight: var(--lw-font-semibold);
    color: var(--lw-text-primary);
}

.aidr-section-total[b-ae1376d817] {
    font-size: 1rem;
    font-weight: 700;
    font-variant-numeric: tabular-nums;
    color: var(--lw-text-primary);
}

/* Text link action (reference: "Edit Invoices" brand-accent link). A <button>,
   so it is immune to the global anchor hover rule. */
.aidr-link[b-ae1376d817] {
    background: none;
    border: none;
    padding: 0;
    cursor: pointer;
    font-size: 0.875rem;
    font-weight: 500;
    color: var(--lw-primary-blue);
    transition: color 0.15s ease;
}

.aidr-link:hover[b-ae1376d817] {
    text-decoration: underline;
}

/* -- Budget allocation table: reference grid (allocation-budget-table.tsx).
   Shared 7-col template across every row type:
   28px chevron | 44px # | 1fr desc | 120 Budgeted | 120 Available | 100 This Request | 36 actions. -- */

.bt-scroll[b-ae1376d817] { flex: 1; overflow-y: auto; min-height: 0; }

.bt-row[b-ae1376d817] {
    display: grid;
    grid-template-columns: 28px 44px minmax(0, 1fr) 120px 120px 100px 36px;
    align-items: center;
    border-left: 3px solid transparent;
}

/* Sticky column header */
.bt-colhead[b-ae1376d817] {
    position: sticky;
    top: 0;
    z-index: 10;
    background: var(--lw-bg-muted);
    border-bottom: 1px solid var(--lw-border);
    padding: 8px 12px;
}

.bt-hcell[b-ae1376d817] {
    font-size: 12px;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.02em;
    color: var(--lw-gray-graphite);
}

.bt-hcell--r[b-ae1376d817] { text-align: right; }

/* Category header row */
.bt-cat[b-ae1376d817] {
    background: var(--lw-bg-muted);
    border-bottom: 1px solid var(--lw-border);
    padding: 8px 12px;
    cursor: pointer;
    transition: background 0.15s ease;
}

.bt-cat:hover[b-ae1376d817] { background: var(--lw-accent); }

.bt-chevron[b-ae1376d817] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    color: var(--lw-gray-graphite);
}

.bt-num[b-ae1376d817] { font-size: 12px; color: var(--lw-gray-space); }
.bt-num--cat[b-ae1376d817] { font-weight: 700; color: var(--lw-text-primary); }

.bt-cat-name[b-ae1376d817] {
    min-width: 0;
    font-size: 14px;
    font-weight: 700;
    color: var(--lw-text-primary);
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    padding-right: 8px;
}

/* Line-item row */
.bt-line[b-ae1376d817] {
    border-bottom: 1px solid var(--lw-border);
    padding: 8px 12px;
    font-size: 14px;
    color: var(--lw-text-primary);
    transition: background 0.15s ease, border-color 0.15s ease;
}

.bt-line--allocated[b-ae1376d817] { background: rgba(57, 128, 165, 0.02); }
.bt-line--over[b-ae1376d817] { background: rgba(184, 53, 48, 0.04); border-left-color: var(--lw-destructive); }
.bt-line--drop[b-ae1376d817] { border-left-color: var(--lw-primary-blue); background: rgba(57, 128, 165, 0.06); }

.bt-desc[b-ae1376d817] {
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    padding-right: 8px;
}

.bt-money[b-ae1376d817] { text-align: right; font-variant-numeric: tabular-nums; font-size: 14px; }
.bt-money--cat[b-ae1376d817] { font-weight: 500; }
.bt-money--req[b-ae1376d817] { color: var(--lw-primary-blue); }
.bt-money--over[b-ae1376d817] { color: var(--lw-destructive); font-weight: 700; }
.bt-money--ok[b-ae1376d817] { color: var(--lw-success-dark); }
.bt-money--adj[b-ae1376d817] { color: var(--lw-primary-blue); font-weight: 700; }

/* Nested allocation row */
.bt-alloc[b-ae1376d817] {
    background: color-mix(in srgb, var(--lw-bg-muted) 55%, #fff);
    border-bottom: 1px solid var(--lw-border);
    padding: 6px 12px;
}

.bt-arrow[b-ae1376d817] { font-size: 12px; color: var(--lw-gray-space); }

.bt-alloc-vendor[b-ae1376d817] { display: flex; align-items: center; gap: 6px; min-width: 0; }

.bt-avatar[b-ae1376d817] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 22px;
    height: 22px;
    border-radius: 50%;
    background: var(--lw-bg-secondary);
    color: var(--lw-gray-graphite);
    font-size: 9px;
    font-weight: 700;
    flex-shrink: 0;
}

.bt-alloc-name[b-ae1376d817] {
    font-size: 12px;
    font-weight: 500;
    color: var(--lw-text-primary);
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.bt-alloc-sep[b-ae1376d817] { color: var(--lw-gray-space); }
.bt-alloc-num[b-ae1376d817] { font-size: 10px; color: var(--lw-gray-space); flex-shrink: 0; }

.bt-alloc-badgecell[b-ae1376d817] { display: flex; justify-content: flex-end; }
.bt-alloc-linkcell[b-ae1376d817] { display: flex; align-items: center; justify-content: flex-end; gap: 4px; }

.bt-alloc-link[b-ae1376d817] {
    background: none;
    border: none;
    padding: 0;
    cursor: pointer;
    font-size: 11px;
    color: var(--lw-primary-blue);
    text-decoration: underline;
    white-space: nowrap;
}

.bt-alloc-link:hover[b-ae1376d817] { color: var(--lw-primary-blue-dark); }

.bt-alloc-x[b-ae1376d817] {
    background: none;
    border: none;
    cursor: pointer;
    color: var(--lw-gray-space);
    font-size: 14px;
    line-height: 1;
    padding: 0 2px;
}

.bt-alloc-x:hover[b-ae1376d817] { color: var(--lw-destructive); }

/* Compound $/% amount input */
.bt-alloc-amtcell[b-ae1376d817] { display: flex; justify-content: flex-end; }

.bt-amt[b-ae1376d817] {
    display: inline-flex;
    align-items: stretch;
    max-width: 88px;
    border: 1px solid var(--lw-border);
    border-radius: 6px;
    overflow: hidden;
    background: #fff;
    transition: border-color 0.15s ease;
}

.bt-amt:focus-within[b-ae1376d817] { border-color: var(--lw-primary-blue); }

.bt-amt-mode[b-ae1376d817] {
    display: inline-flex;
    align-items: center;
    gap: 2px;
    padding: 4px 6px;
    font-size: 10px;
    font-weight: 500;
    color: var(--lw-gray-graphite);
    background: var(--lw-bg-muted);
    border: none;
    border-right: 1px solid var(--lw-border);
    cursor: pointer;
    flex-shrink: 0;
}

.bt-amt-mode:hover[b-ae1376d817] { background: var(--lw-accent); }
.bt-amt-mode svg[b-ae1376d817] { opacity: 0.6; }

.bt-amt-input[b-ae1376d817] {
    width: 100%;
    min-width: 0;
    border: none;
    outline: none;
    background: transparent;
    padding: 4px 6px;
    font-size: 12px;
    text-align: right;
    font-variant-numeric: tabular-nums;
    color: var(--lw-text-primary);
    -moz-appearance: textfield;
}

.bt-amt-input[b-ae1376d817]::-webkit-inner-spin-button,
.bt-amt-input[b-ae1376d817]::-webkit-outer-spin-button { -webkit-appearance: none; margin: 0; }

.bt-alloc-removecell[b-ae1376d817] { display: flex; justify-content: center; }

.bt-alloc-remove[b-ae1376d817] {
    background: none;
    border: none;
    cursor: pointer;
    color: var(--lw-gray-space);
    display: inline-flex;
    padding: 2px;
}

.bt-alloc-remove:hover[b-ae1376d817] { color: var(--lw-destructive); }

/* -- Fee-summary footer (FeeSummaryFooter): always-visible total row that
   expands upward to the cost-of-work + Ledgerwise fee breakdown. -- */

.bt-fee[b-ae1376d817] { border-top: 1px solid var(--lw-border); }
.bt-fee-breakdown[b-ae1376d817] { border-bottom: 1px solid var(--lw-border); }

.bt-fee-line[b-ae1376d817] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 6px 12px;
    font-size: 14px;
    color: var(--lw-text-primary);
}

.bt-fee-formula[b-ae1376d817] { font-size: 12px; color: var(--lw-gray-graphite); }

.bt-fee-total[b-ae1376d817] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 10px 12px;
    cursor: pointer;
    transition: background 0.15s ease;
}

.bt-fee-total:hover[b-ae1376d817] { background: var(--lw-accent); }

.bt-fee-total-label[b-ae1376d817] {
    display: flex;
    align-items: center;
    gap: 6px;
    font-size: 14px;
    font-weight: 600;
    color: var(--lw-text-primary);
}

.bt-fee-caret[b-ae1376d817] { display: inline-flex; align-items: center; color: var(--lw-gray-graphite); }
.bt-fee-sub[b-ae1376d817] { color: var(--lw-gray-graphite); font-weight: 400; }

.bt-fee-total-amt[b-ae1376d817] {
    font-size: 14px;
    font-weight: 700;
    font-variant-numeric: tabular-nums;
    color: var(--lw-text-primary);
}
/* _content/Ledgerwise/Components/Modals/AvatarCropModal.razor.rz.scp.css */
/* AvatarCropModal -- source: ledgerwise-app avatar-crop-dialog.tsx
   (2026-07-24): 280px rounded-card crop viewport on muted bg, grab cursor;
   zoom row = 16px muted icons around an accent range slider; previews strip
   on muted card with 10px labels. */

.lw-crop[b-50agqfbfxx] {
    display: flex;
    flex-direction: column;
    gap: 16px;
}

.lw-crop__center[b-50agqfbfxx] {
    display: flex;
    justify-content: center;
}

.lw-crop__viewport[b-50agqfbfxx] {
    position: relative;
    width: 280px;
    height: 280px;
    overflow: hidden;
    border-radius: var(--lw-radius-card);
    border: 1px solid var(--lw-border);
    background: var(--lw-bg-muted);
    touch-action: none;
    user-select: none;
    cursor: grab;
}

.lw-crop__viewport--dragging[b-50agqfbfxx] {
    cursor: grabbing;
}

.lw-crop__viewport img[b-50agqfbfxx] {
    position: absolute;
    max-width: none;
    pointer-events: none;
}

.lw-crop__zoom-row[b-50agqfbfxx] {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 0 4px;
}

.lw-crop__zoom-row[b-50agqfbfxx]  .lw-crop__zoom-icon {
    width: 16px;
    height: 16px;
    font-size: 16px;
    color: var(--lw-gray-space) !important;
    flex-shrink: 0;
}

.lw-crop__zoom[b-50agqfbfxx] {
    width: 100%;
    height: 6px;
    cursor: pointer;
    appearance: none;
    border-radius: 9999px;
    background: var(--lw-gray-smoke);
    accent-color: var(--lw-primary-blue);
}

.lw-crop__zoom[b-50agqfbfxx]::-webkit-slider-thumb {
    appearance: none;
    width: 16px;
    height: 16px;
    border-radius: 50%;
    background: var(--lw-primary-blue);
    border: 0;
}

.lw-crop__previews[b-50agqfbfxx] {
    display: flex;
    align-items: flex-end;
    justify-content: center;
    gap: 16px;
    border-radius: var(--lw-radius-card);
    background: var(--lw-bg-muted);
    padding: 12px 16px;
}

.lw-crop__preview-item[b-50agqfbfxx] {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 6px;
}

.lw-crop__preview[b-50agqfbfxx] {
    position: relative;
    overflow: hidden;
    border-radius: 6px;
    border: 1px solid var(--lw-border);
}

.lw-crop__preview[data-size="56"][b-50agqfbfxx] { width: 56px; height: 56px; }
.lw-crop__preview[data-size="40"][b-50agqfbfxx] { width: 40px; height: 40px; }
.lw-crop__preview[data-size="24"][b-50agqfbfxx] { width: 24px; height: 24px; }

.lw-crop__preview img[b-50agqfbfxx] {
    position: absolute;
    max-width: none;
    pointer-events: none;
}

.lw-crop__preview-label[b-50agqfbfxx] {
    font-size: 10px;
    font-weight: 500;
    color: var(--lw-gray-space);
}
/* _content/Ledgerwise/Components/Modals/BudgetAdjustmentCompletionModal.razor.rz.scp.css */
/* Allocation completion dialog internals.
   Source: ledgerwise-ui-app src/components/molecules/allocation-completion-modal.tsx
   (measured spec 2026-07-20; migrated 2026-07-21). Dialog size=sm 480px,
   hideHeader; centered column: size-14 success disc (bg success-bg, check
   success-dark), 16px semibold title, muted subtitle, teal BA info box
   (border brand-accent/20, bg brand-accent/5). */

.bacm-stack[b-leh96b2rg9] {
    display: flex;
    flex-direction: column;
    align-items: center;
    text-align: center;
    padding: 16px 0 8px;
}

/* Success disc: size-14 rounded-full bg-success-bg, Check size-7. */
.bacm-disc[b-leh96b2rg9] {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 56px;
    height: 56px;
    margin-bottom: 16px;
    border-radius: 9999px;
    background: var(--lw-status-success-bg);
    color: var(--lw-success-dark);
}

.bacm-disc[b-leh96b2rg9]  .mud-icon-root { width: 28px; height: 28px; }

.bacm-title[b-leh96b2rg9] {
    margin: 0;
    font-family: var(--lw-font-family);
    font-size: 16px;
    font-weight: var(--lw-font-semibold);
    color: var(--lw-text-primary);
}

.bacm-sub[b-leh96b2rg9] {
    margin: 4px 0 0;
    font-size: 14px;
    color: var(--lw-gray-graphite);
}

/* BA info box: mt-4 w-full rounded-md border brand-accent/20 bg /5 p-3. */
.bacm-info[b-leh96b2rg9] {
    width: 100%;
    margin-top: 16px;
    padding: 12px;
    text-align: left;
    border: 1px solid color-mix(in srgb, var(--lw-primary-blue) 20%, transparent);
    background: color-mix(in srgb, var(--lw-primary-blue) 5%, transparent);
    border-radius: var(--lw-radius-control);
}

.bacm-info-head[b-leh96b2rg9] {
    display: flex;
    align-items: center;
    gap: 8px;
}

.bacm-info-icon[b-leh96b2rg9] {
    display: inline-flex;
    flex-shrink: 0;
    color: var(--lw-primary-blue);
}

.bacm-info-icon[b-leh96b2rg9]  .mud-icon-root { width: 1rem; height: 1rem; }

.bacm-info-title[b-leh96b2rg9] {
    font-size: 14px;
    font-weight: var(--lw-font-medium);
    color: var(--lw-text-primary);
}

.bacm-info-sub[b-leh96b2rg9] {
    margin: 4px 0 0;
    font-size: 12px;
    color: var(--lw-gray-graphite);
}
/* _content/Ledgerwise/Components/Modals/BudgetAdjustmentSummaryModal.razor.rz.scp.css */
/* BA summary modal internals.
   Source: ledgerwise-ui-app src/components/molecules/co-summary-modal.tsx
   (measured spec 2026-07-20; migrated 2026-07-21). Dialog size=md 640px;
   kicker-labeled sections; expandable grouped line items; fee breakdown box;
   dashed dropzone + uploaded file rows. FieldShell recipe mirrors
   LwTextField.razor.css (54px white box, radius 8, label state map); the
   Mud inputs/upload stay for their binding behavior. */

/* Section kicker: mb-2 text-xs font-bold uppercase tracking-wide. */
.bas-section[b-l1t274s0vk] {
    display: flex;
    flex-direction: column;
}

.bas-kicker[b-l1t274s0vk] {
    margin: 0 0 8px;
    font-size: 12px;
    font-weight: var(--lw-font-bold);
    text-transform: uppercase;
    letter-spacing: 0.025em;
    color: var(--lw-gray-graphite);
}

/* Affected line item groups (space-y-1, rounded-md bordered). */
.bas-groups[b-l1t274s0vk] {
    display: flex;
    flex-direction: column;
    gap: 4px;
}

.bas-group[b-l1t274s0vk] {
    border: 1px solid var(--lw-border);
    border-radius: var(--lw-radius-control);
    overflow: hidden;
    background: transparent;
}

.bas-group-head[b-l1t274s0vk] {
    display: flex;
    align-items: center;
    gap: 8px;
    width: 100%;
    padding: 10px 12px;
    border: 0;
    background: none;
    text-align: left;
    cursor: pointer;
    font-family: var(--lw-font-family);
    transition: background 0.15s ease;
}

.bas-group-head:hover[b-l1t274s0vk] {
    background: var(--lw-accent);
}

.bas-group-caret[b-l1t274s0vk] {
    display: inline-flex;
    flex-shrink: 0;
    color: var(--lw-gray-graphite);
}

.bas-group-caret[b-l1t274s0vk]  .mud-icon-root { width: 1rem; height: 1rem; }

.bas-group-name[b-l1t274s0vk] {
    flex: 1;
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    font-size: 14px;
    font-weight: var(--lw-font-medium);
    color: var(--lw-text-primary);
}

.bas-group-amounts[b-l1t274s0vk] {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    flex-shrink: 0;
}

.bas-group-old[b-l1t274s0vk] {
    font-size: 12px;
    color: var(--lw-gray-graphite);
    font-variant-numeric: tabular-nums;
}

.bas-group-arrow[b-l1t274s0vk] {
    display: inline-flex;
    color: var(--lw-gray-graphite);
}

.bas-group-arrow[b-l1t274s0vk]  .mud-icon-root { width: 0.875rem; height: 0.875rem; }

.bas-group-new[b-l1t274s0vk] {
    font-size: 12px;
    font-weight: var(--lw-font-medium);
    color: var(--lw-text-primary);
    font-variant-numeric: tabular-nums;
}

/* Expanded per-BA rows: border-t, bg-muted/50, text-xs pairs. */
.bas-group-detail[b-l1t274s0vk] {
    display: flex;
    flex-direction: column;
    gap: 6px;
    padding: 8px 12px 8px 36px;
    border-top: 1px solid var(--lw-border);
    background: color-mix(in srgb, var(--lw-bg-muted) 50%, var(--lw-white));
}

.bas-detail-row[b-l1t274s0vk] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
    font-size: 12px;
}

.bas-detail-label[b-l1t274s0vk] {
    color: var(--lw-gray-graphite);
}

.bas-detail-value[b-l1t274s0vk] {
    font-weight: var(--lw-font-medium);
    color: var(--lw-text-primary);
    font-variant-numeric: tabular-nums;
}

/* Cost breakdown box: rounded-md border p-3 space-y-2, text-sm rows. */
.bas-breakdown[b-l1t274s0vk] {
    border: 1px solid var(--lw-border);
    border-radius: var(--lw-radius-control);
    padding: 12px;
    display: flex;
    flex-direction: column;
    gap: 8px;
}

.bas-breakdown-row[b-l1t274s0vk] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
    font-size: 14px;
}

.bas-breakdown-label[b-l1t274s0vk] {
    color: var(--lw-gray-graphite);
}

.bas-breakdown-rate[b-l1t274s0vk] {
    margin-left: 4px;
    font-size: 12px;
    color: var(--lw-gray-space);
}

.bas-breakdown-value[b-l1t274s0vk] {
    font-weight: var(--lw-font-medium);
    color: var(--lw-text-primary);
    font-variant-numeric: tabular-nums;
}

.bas-breakdown-total[b-l1t274s0vk] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
    padding-top: 8px;
    border-top: 1px solid var(--lw-border);
    font-size: 14px;
    font-weight: var(--lw-font-semibold);
    color: var(--lw-text-primary);
}

.bas-breakdown-total-value[b-l1t274s0vk] {
    font-variant-numeric: tabular-nums;
}

/* Dropzone: border-2 dashed p-6 centered, hover brand-accent tint. */
.bas-dropzone[b-l1t274s0vk] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 8px;
    width: 100%;
    padding: 24px;
    text-align: center;
    border: 2px dashed var(--lw-border);
    border-radius: var(--lw-radius-control);
    cursor: pointer;
    transition: border-color 0.15s ease, background 0.15s ease;
}

.bas-dropzone:hover[b-l1t274s0vk] {
    border-color: color-mix(in srgb, var(--lw-primary-blue) 40%, transparent);
    background: color-mix(in srgb, var(--lw-primary-blue) 5%, transparent);
}

.bas-drop-icon[b-l1t274s0vk] {
    display: inline-flex;
    color: var(--lw-gray-space);
}

.bas-drop-icon[b-l1t274s0vk]  .mud-icon-root { width: 24px; height: 24px; }

.bas-drop-text[b-l1t274s0vk] {
    font-size: 14px;
    color: var(--lw-gray-space);
}

/* Uploaded rows: mt-2 space-y-1; bordered pill rows. */
.bas-files[b-l1t274s0vk] {
    display: flex;
    flex-direction: column;
    gap: 4px;
    margin-top: 8px;
}

.bas-file[b-l1t274s0vk] {
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 8px 12px;
    border: 1px solid var(--lw-border);
    border-radius: var(--lw-radius-control);
}

.bas-file-icon[b-l1t274s0vk] {
    display: inline-flex;
    flex-shrink: 0;
    color: var(--lw-gray-graphite);
}

.bas-file-icon[b-l1t274s0vk]  .mud-icon-root { width: 1rem; height: 1rem; }

.bas-file-name[b-l1t274s0vk] {
    flex: 1;
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    font-size: 14px;
    color: var(--lw-text-primary);
}

.bas-file-size[b-l1t274s0vk] {
    flex-shrink: 0;
    font-size: 12px;
    color: var(--lw-gray-space);
}

.bas-file-remove[b-l1t274s0vk] {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 24px;
    height: 24px;
    flex-shrink: 0;
    border: 0;
    background: none;
    padding: 0;
    border-radius: var(--lw-radius-control);
    color: var(--lw-gray-graphite);
    cursor: pointer;
    transition: background 0.15s ease, color 0.15s ease;
}

.bas-file-remove:hover[b-l1t274s0vk] {
    background: var(--lw-status-error-bg);
    color: var(--lw-destructive);
}

.bas-file-remove[b-l1t274s0vk]  .mud-icon-root { width: 0.875rem; height: 0.875rem; }

/* -- FieldShell chrome for the Mud inputs (recipe: LwTextField.razor.css,
   2026-07-08 spec). -- */

.bas-field[b-l1t274s0vk]  .mud-input-helper-text {
    font-family: var(--lw-font-family);
    font-size: 13px;
    line-height: 18px;
    margin-top: 4px;
}

.bas-field[b-l1t274s0vk]  .mud-input-control {
    margin-top: 0;
}

.bas-field[b-l1t274s0vk]  .mud-input-outlined {
    font-size: 14px;
    font-weight: 400;
    background-color: var(--lw-white);
    border-radius: var(--lw-radius-control);
}

.bas-field[b-l1t274s0vk]  .mud-input-outlined input.mud-input-slot {
    height: 54px;
    box-sizing: border-box;
    padding: 16px 14px;
    font-size: 14px;
    font-weight: 400;
    /* 16 + 22 + 16 = 54 -- centers the text block exactly like FieldShell. */
    line-height: 22px;
}

/* Multiline shell (textarea-field.tsx): auto-height box, min 96px, py-3;
   zero Mud's inset-label margin reserve. */
.bas-field--area[b-l1t274s0vk]  .mud-input.mud-input-outlined textarea.mud-input-slot {
    box-sizing: border-box;
    min-height: 96px;
    margin-top: 0;
    padding: 12px 14px;
    font-size: 14px;
    font-weight: 400;
    line-height: 1.625;
}

.bas-field[b-l1t274s0vk]  .mud-input-label {
    font-size: 14px;
    font-weight: 400;
    line-height: 22px;
    letter-spacing: normal;
    color: var(--lw-gray-space);
}

/* Resting label geometrically centered in the 54px box (FieldShell: left
   13px). Mud's padding is !important, so ours must be too. */
.bas-field[b-l1t274s0vk]  .mud-input-label-outlined {
    top: 50%;
    transform: translate(13px, -50%) scale(1);
    padding: 0 2px !important;
    transition: top 0.2s cubic-bezier(0, 0, 0.2, 1), transform 0.2s cubic-bezier(0, 0, 0.2, 1), color 0.2s;
}

/* Multiline shell: the label centers against the first line, not the box. */
.bas-field--area[b-l1t274s0vk]  .mud-input-label-outlined {
    top: 23px;
}

/* Floated label: mirror Mud's shrink/focus selectors (4-class specificity);
   12px like FieldShell text-xs (scale 12/14 = .857). */
.bas-field[b-l1t274s0vk]  .mud-shrink ~ label.mud-input-label.mud-input-label-inputcontrol.mud-input-label-outlined,
.bas-field[b-l1t274s0vk]  .mud-input:focus-within ~ label.mud-input-label.mud-input-label-inputcontrol.mud-input-label-outlined {
    top: 0;
    transform: translate(13px, -6px) scale(0.857);
}

.bas-field[b-l1t274s0vk]  .mud-shrink ~ label.mud-input-label.mud-input-label-inputcontrol.mud-input-label-outlined {
    color: var(--lw-gray-graphite);
}

/* Focused wins over floated (declared last at equal specificity). */
.bas-field[b-l1t274s0vk]  .mud-input:focus-within ~ label.mud-input-label.mud-input-label-inputcontrol.mud-input-label-outlined {
    color: var(--lw-gray-phantom);
}

/* Border states -- FieldShell: rest --lw-input-border 1px; hover no change;
   focus 1px foreground (phantom). */
.bas-field[b-l1t274s0vk]  .mud-input.mud-input-outlined:not(.mud-disabled):not(:focus-within):hover .mud-input-outlined-border {
    border-color: var(--lw-input-border);
}

.bas-field[b-l1t274s0vk]  .mud-input.mud-input-outlined:focus-within > .mud-input-outlined-border,
.bas-field[b-l1t274s0vk]  .mud-input.mud-input-outlined:focus-within .mud-shrink > .mud-input-outlined-border {
    border-width: 1px;
    border-color: var(--lw-gray-phantom);
}
/* _content/Ledgerwise/Components/Modals/BudgetHistoryDrawer.razor.rz.scp.css */
/* ── Backdrop + right-side slide-in panel ── */
.bhd-backdrop[b-9oljzhl5sr] {
    position: fixed;
    inset: 0;
    z-index: var(--lw-z-sheet-backdrop);
    background: var(--lw-scrim);
    backdrop-filter: var(--lw-scrim-blur);
    -webkit-backdrop-filter: var(--lw-scrim-blur);
    opacity: 0;
    transition: opacity 0.25s ease;
}

.bhd-backdrop.bhd-open[b-9oljzhl5sr] {
    opacity: 1;
}

.bhd-panel[b-9oljzhl5sr] {
    position: fixed;
    top: 0;
    right: 0;
    bottom: 0;
    z-index: var(--lw-z-sheet);
    display: flex;
    flex-direction: column;
    width: 100%;
    max-width: 560px;
    background: var(--lw-white);
    border-left: 1px solid var(--lw-border);
    box-shadow: -8px 0 32px rgba(2, 11, 43, 0.18);
    transform: translateX(100%);
    transition: transform 0.4s cubic-bezier(0.22, 1, 0.36, 1);
}

.bhd-panel.bhd-open[b-9oljzhl5sr] {
    transform: translateX(0);
}

.bhd-panel.bhd-exit[b-9oljzhl5sr] {
    transform: translateX(100%);
    transition: transform 0.25s cubic-bezier(0.4, 0, 1, 1);
}

@media (min-width: 768px) {
    .bhd-panel[b-9oljzhl5sr] {
        width: 560px;
    }
}

/* Header */
.bhd-header[b-9oljzhl5sr] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    flex-shrink: 0;
    padding: 0.875rem 1.25rem;
    border-bottom: 1px solid var(--lw-border);
}

.bhd-titles[b-9oljzhl5sr] {
    min-width: 0;
}

.bhd-title[b-9oljzhl5sr] {
    font-size: 1rem;
    font-weight: 700;
    color: var(--lw-primary-dark, #020B2B);
    margin: 0;
    font-family: var(--lw-font-family-heading, sans-serif);
}

.bhd-sub[b-9oljzhl5sr] {
    margin: 2px 0 0;
    font-size: 0.75rem;
    color: var(--lw-gray-graphite, #6E7180);
}

.bhd-close[b-9oljzhl5sr] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 32px;
    height: 32px;
    background: transparent;
    border: none;
    cursor: pointer;
    color: var(--lw-gray-graphite, #6E7180);
    transition: color 0.15s;
}

.bhd-close:hover[b-9oljzhl5sr] {
    color: var(--lw-primary-dark, #020B2B);
}

/* Search */
.bhd-search-wrap[b-9oljzhl5sr] {
    flex-shrink: 0;
    padding: 0.625rem 1.25rem;
    border-bottom: 1px solid var(--lw-border);
}

.bhd-search[b-9oljzhl5sr] {
    position: relative;
    display: flex;
    align-items: center;
    border: 1px solid var(--lw-border);
    background: var(--lw-bg-muted);
}

.bhd-search:focus-within[b-9oljzhl5sr] {
    border-color: var(--lw-primary-blue, #3980A5);
}

.bhd-search-icon[b-9oljzhl5sr] {
    margin-left: 0.75rem;
    color: var(--lw-gray-graphite, #6E7180);
    flex-shrink: 0;
}

.bhd-search-input[b-9oljzhl5sr] {
    flex: 1;
    height: 36px;
    background: transparent;
    border: none;
    outline: none;
    padding: 0 0.625rem;
    font-size: 0.875rem;
    color: var(--lw-primary-dark, #020B2B);
    font-family: var(--lw-font-family);
}

.bhd-search-input[b-9oljzhl5sr]::placeholder {
    color: var(--lw-gray-graphite, #6E7180);
}

.bhd-search-clear[b-9oljzhl5sr] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 26px;
    height: 26px;
    margin-right: 4px;
    background: transparent;
    border: none;
    cursor: pointer;
    color: var(--lw-gray-graphite, #6E7180);
    transition: color 0.15s;
}

.bhd-search-clear:hover[b-9oljzhl5sr] {
    color: var(--lw-primary-dark, #020B2B);
}

/* Filter tabs + sort toggle */
.bhd-toolbar[b-9oljzhl5sr] {
    flex-shrink: 0;
    display: flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.5rem 1.25rem;
    border-bottom: 1px solid var(--lw-border);
    min-width: 0;
}

/* Filter chips sit on a single row to the left of the sort button.
   `flex: 0 0 auto` makes the strip hug its content so Sort sits next to the
   last chip without a stretched gap. */
.bhd-filter-strip[b-9oljzhl5sr] {
    display: flex;
    align-items: center;
    gap: 0.375rem;
    flex: 0 0 auto;
    min-width: 0;
}

.bhd-filter[b-9oljzhl5sr] {
    flex-shrink: 0;
    height: 26px;
    padding: 0 0.625rem;
    background: transparent;
    border: 1px solid var(--lw-border);
    cursor: pointer;
    font-size: 11px;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.04em;
    color: var(--lw-gray-graphite, #6E7180);
    font-family: var(--lw-font-family);
    transition: background 0.15s, color 0.15s, border-color 0.15s;
}

.bhd-filter:hover[b-9oljzhl5sr] {
    color: var(--lw-primary-dark, #020B2B);
    background: rgba(247, 247, 245, 0.8);
}

.bhd-filter-active[b-9oljzhl5sr] {
    background: var(--lw-primary-dark, #020B2B);
    color: var(--lw-white);
    border-color: var(--lw-primary-dark, #020B2B);
}

.bhd-sort[b-9oljzhl5sr] {
    flex-shrink: 0;
    display: inline-flex;
    align-items: center;
    gap: 0.375rem;
    height: 26px;
    padding: 0 0.625rem;
    background: transparent;
    border: 1px solid var(--lw-border);
    cursor: pointer;
    font-size: 11px;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.04em;
    color: var(--lw-gray-graphite, #6E7180);
    font-family: var(--lw-font-family);
    transition: color 0.15s, background 0.15s;
}

.bhd-sort:hover[b-9oljzhl5sr] {
    color: var(--lw-primary-dark, #020B2B);
    background: rgba(247, 247, 245, 0.8);
}

/* Body */
.bhd-body[b-9oljzhl5sr] {
    flex: 1;
    min-height: 0;
    overflow-y: auto;
    /* Form-surface body against the white drawer frame/header, matching
       ledgerwise-ui's detail-drawer pattern (bg-form-surface). */
    background: var(--lw-form-surface);
}

.bhd-list[b-9oljzhl5sr] {
    display: flex;
    flex-direction: column;
}

.bhd-row[b-9oljzhl5sr] {
    display: flex;
    flex-direction: column;
    gap: 0.75rem;
    padding: 1rem 1.25rem;
    border-bottom: 1px solid var(--lw-border);
    transition: background 0.12s;
}

.bhd-row:hover[b-9oljzhl5sr] {
    background: var(--lw-bg-row-hover);
}

.bhd-row-active[b-9oljzhl5sr] {
    background: rgba(247, 247, 245, 0.9);
}

.bhd-row-head[b-9oljzhl5sr] {
    display: flex;
    align-items: flex-start;
    gap: 0.625rem;
}

.bhd-event-icon[b-9oljzhl5sr] {
    flex-shrink: 0;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 28px;
    height: 28px;
}

.bhd-event-contract[b-9oljzhl5sr]          { background: var(--lw-status-info-bg);    color: var(--lw-status-info-fg); }
.bhd-event-budget-adjustment[b-9oljzhl5sr] { background: var(--lw-status-warning-bg); color: var(--lw-status-warning-fg); }
.bhd-event-payment-request[b-9oljzhl5sr]   { background: var(--lw-status-success-bg); color: var(--lw-status-success-fg); }

.bhd-event-text[b-9oljzhl5sr] {
    flex: 1;
    min-width: 0;
}

.bhd-event-label[b-9oljzhl5sr] {
    font-size: 0.875rem;
    font-weight: 600;
    color: var(--lw-primary-dark, #020B2B);
    margin: 0;
}

.bhd-event-date[b-9oljzhl5sr] {
    margin: 2px 0 0;
    font-size: 0.6875rem;
    color: var(--lw-gray-graphite, #6E7180);
}

.bhd-row-tag[b-9oljzhl5sr] {
    flex-shrink: 0;
    display: inline-flex;
    align-items: center;
    padding: 0.125rem 0.5rem;
    font-size: 10px;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.04em;
}

.bhd-row-tag-active[b-9oljzhl5sr] {
    background: var(--lw-primary-dark, #020B2B);
    color: var(--lw-white);
}

.bhd-row-desc[b-9oljzhl5sr] {
    margin: 0;
    font-size: 0.75rem;
    color: var(--lw-gray-graphite, #6E7180);
    line-height: 1.45;
}

.bhd-row-grid[b-9oljzhl5sr] {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 0.5rem;
    padding: 0.625rem;
    border: 1px solid var(--lw-border);
    background: var(--lw-bg-muted);
}

.bhd-row-cell[b-9oljzhl5sr] {
    display: flex;
    flex-direction: column;
    gap: 2px;
}

.bhd-row-cell-label[b-9oljzhl5sr] {
    font-size: 9px;
    font-weight: 500;
    text-transform: uppercase;
    letter-spacing: 0.06em;
    color: var(--lw-gray-graphite, #6E7180);
}

.bhd-row-cell-value[b-9oljzhl5sr] {
    font-size: 0.75rem;
    font-weight: 700;
    color: var(--lw-primary-dark, #020B2B);
    font-variant-numeric: tabular-nums;
}

.bhd-row-cta[b-9oljzhl5sr] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    height: 32px;
    width: 100%;
    background: var(--lw-primary-dark, #020B2B);
    color: var(--lw-white);
    border: none;
    cursor: pointer;
    font-size: 0.75rem;
    font-weight: 600;
    font-family: var(--lw-font-family);
    transition: opacity 0.15s;
}

.bhd-row-cta:hover[b-9oljzhl5sr] {
    opacity: 0.9;
}

.bhd-row-cta-active[b-9oljzhl5sr] {
    background: var(--lw-white);
    color: var(--lw-gray-graphite, #6E7180);
    border: 1px solid var(--lw-border);
}

.bhd-row-cta-active:hover[b-9oljzhl5sr] {
    background: rgba(247, 247, 245, 0.8);
    opacity: 1;
}

/* Empty state */
.bhd-empty[b-9oljzhl5sr] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 0.25rem;
    padding: 3rem 1.25rem;
    text-align: center;
}

.bhd-empty-title[b-9oljzhl5sr] {
    font-size: 0.875rem;
    font-weight: 600;
    color: var(--lw-primary-dark, #020B2B);
    margin: 0;
}

.bhd-empty-sub[b-9oljzhl5sr] {
    margin: 0;
    font-size: 0.75rem;
    color: var(--lw-gray-graphite, #6E7180);
}
/* _content/Ledgerwise/Components/Modals/ChangeOrderApprovalModal.razor.rz.scp.css */
/* Owner budget-adjustment review sheet. Source: ledgerwise-ui-app
   organisms/owner/owner-adjustment-detail-drawer.tsx + ui/drawer.tsx +
   molecules/adjustment-cost-breakdown.tsx + kickoff/control-card.tsx
   (measured spec 2026-07-20; migrated 2026-07-21): near-fullscreen bottom
   sheet (100dvh - 48px, 12px top radius, muted shell, blurred backdrop) with
   white header/footer bands and a centered 62rem column of ControlCards.
   Footer: outlined Close + navy Approve. Mirrors DrawRequestApprovalModal
   (dra-*). Needs-review status is deliberately NEUTRAL gray (spec 1.4);
   signed deltas: positive = destructive red, negative = success green.
   The split attachment preview pane is Blazor-specific (reference animates a
   60/40 DocumentPreview pane; same proportions kept here). */

/* -- Backdrop + slide-up bottom sheet -- */
.coa-backdrop[b-tbcfb3rj3h] {
    position: fixed;
    inset: 0;
    z-index: var(--lw-z-sheet-backdrop);
    background: var(--lw-scrim);
    backdrop-filter: var(--lw-scrim-blur);
    -webkit-backdrop-filter: var(--lw-scrim-blur);
    opacity: 0;
    transition: opacity 0.2s ease;
}

.coa-backdrop.coa-open[b-tbcfb3rj3h] {
    opacity: 1;
}

.coa-sheet[b-tbcfb3rj3h] {
    position: fixed;
    left: 0;
    right: 0;
    bottom: 0;
    z-index: var(--lw-z-sheet);
    height: calc(100dvh - 48px);
    background: var(--lw-bg-muted);
    border-top-left-radius: 12px;
    border-top-right-radius: 12px;
    display: flex;
    flex-direction: column;
    overflow: hidden;
    transform: translateY(100%);
    transition: transform 0.3s cubic-bezier(0.22, 1, 0.36, 1);
    box-shadow: 0 -4px 32px rgba(0, 0, 0, 0.15);
}

.coa-sheet.coa-open[b-tbcfb3rj3h] {
    transform: translateY(0);
}

.coa-sheet.coa-exit[b-tbcfb3rj3h] {
    transform: translateY(100%);
    transition: transform 0.25s cubic-bezier(0.4, 0, 1, 1);
}

/* -- Header band -- */
.coa-header[b-tbcfb3rj3h] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 0.75rem;
    flex-shrink: 0;
    padding: 0.75rem 1rem;
    background: var(--lw-white);
    border-bottom: 1px solid var(--lw-border);
}

@media (min-width: 768px) {
    .coa-header[b-tbcfb3rj3h] {
        padding: 1rem 1.5rem;
    }
}

.coa-header-left[b-tbcfb3rj3h] {
    display: flex;
    flex-direction: column;
    gap: 0.125rem;
    flex: 1;
    min-width: 0;
}

.coa-header-title-row[b-tbcfb3rj3h] {
    display: flex;
    align-items: center;
    gap: 0.625rem;
    min-width: 0;
}

.coa-title[b-tbcfb3rj3h] {
    font-size: 1rem;
    font-weight: 700;
    color: var(--lw-text-primary);
    margin: 0;
    font-family: var(--lw-font-family);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    min-width: 0;
}

@media (min-width: 768px) {
    .coa-title[b-tbcfb3rj3h] {
        font-size: 1.125rem;
    }
}

.coa-num[b-tbcfb3rj3h] {
    font-size: 13px;
    color: var(--lw-gray-graphite);
}

/* Status chip: square corners, 8/2 padding, 11px bold uppercase (dra-status
   recipe). Spec 1.4: needs-review maps to the NEUTRAL tone, not gold. */
.coa-status[b-tbcfb3rj3h] {
    display: inline-flex;
    align-items: center;
    padding: 0.125rem 0.5rem;
    font-size: 11px;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.02em;
    line-height: 1.3;
    flex-shrink: 0;
    white-space: nowrap;
}

.coa-status-default[b-tbcfb3rj3h] { background: var(--lw-status-neutral-bg); color: var(--lw-status-neutral-fg); }
.coa-status-info[b-tbcfb3rj3h]    { background: var(--lw-status-info-bg); color: var(--lw-status-info-fg); }
.coa-status-primary[b-tbcfb3rj3h] { background: var(--lw-status-primary-bg); color: var(--lw-status-primary-fg); }
.coa-status-success[b-tbcfb3rj3h] { background: var(--lw-status-success-bg); color: var(--lw-status-success-fg); }
/* "warning" is the code key for Needs Review -- rendered neutral per spec. */
.coa-status-warning[b-tbcfb3rj3h] { background: var(--lw-status-neutral-bg); color: var(--lw-status-neutral-fg); }
.coa-status-error[b-tbcfb3rj3h]   { background: var(--lw-status-error-bg); color: var(--lw-status-error-fg); }

.coa-header-right[b-tbcfb3rj3h] {
    display: flex;
    align-items: center;
    gap: 0.25rem;
    flex-shrink: 0;
}

/* Total delta: 18px bold tabular, red when the budget grows / green when it
   shrinks (spec 3.1 header). */
.coa-amount[b-tbcfb3rj3h] {
    font-size: 1.125rem;
    font-weight: 700;
    font-variant-numeric: tabular-nums;
    white-space: nowrap;
    margin-right: 0.5rem;
}

.coa-amount-pos[b-tbcfb3rj3h] { color: var(--lw-status-error-fg); }
.coa-amount-neg[b-tbcfb3rj3h] { color: var(--lw-status-success-fg); }

.coa-close[b-tbcfb3rj3h],
.coa-nav-btn[b-tbcfb3rj3h] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 32px;
    height: 32px;
    background: transparent;
    border: none;
    cursor: pointer;
    color: var(--lw-gray-graphite);
    transition: color 0.15s;
}

.coa-close:hover:not(:disabled)[b-tbcfb3rj3h],
.coa-nav-btn:hover:not(:disabled)[b-tbcfb3rj3h] {
    color: var(--lw-text-primary);
}

.coa-nav-btn:disabled[b-tbcfb3rj3h] { opacity: 0.3; cursor: default; }
.coa-close:disabled[b-tbcfb3rj3h] { opacity: 0.45; cursor: not-allowed; }

.coa-nav-count[b-tbcfb3rj3h] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 36px;
    text-align: center;
    font-size: 0.75rem;
    color: var(--lw-gray-graphite);
    font-variant-numeric: tabular-nums;
}

.coa-nav-divider[b-tbcfb3rj3h] {
    display: inline-block;
    width: 1px;
    height: 20px;
    margin: 0 0.25rem;
    background: var(--lw-border);
}

/* -- Scrollable content: bare ControlCard column on the muted shell,
      optional 60/40 split with the attachment preview pane. -- */
.coa-body[b-tbcfb3rj3h] {
    flex: 1;
    min-height: 0;
    display: flex;
    overflow: hidden;
}

.coa-content-wrap[b-tbcfb3rj3h] {
    flex: 1;
    min-width: 0;
    overflow-y: auto;
    padding: 1rem;
}

@media (min-width: 768px) {
    .coa-content-wrap[b-tbcfb3rj3h] {
        padding: 1.5rem 2rem;
    }
}

@media (min-width: 1024px) {
    .coa-content-wrap[b-tbcfb3rj3h] {
        padding: 1.5rem 3rem;
    }
}

.coa-body-split .coa-content-wrap[b-tbcfb3rj3h] {
    flex: 0 0 60%;
}

.coa-content[b-tbcfb3rj3h] {
    width: 100%;
    max-width: 62rem;
    margin: 0 auto;
    display: flex;
    flex-direction: column;
    gap: 1.25rem;
}

/* -- Overview grid (label/value pairs, spec 3.1 section 1) -- */
.coa-overview-grid[b-tbcfb3rj3h] {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    column-gap: 1.5rem;
    row-gap: 1rem;
}

.coa-overview-cell[b-tbcfb3rj3h] {
    display: flex;
    flex-direction: column;
    gap: 0.125rem;
    min-width: 0;
}

.coa-overview-label[b-tbcfb3rj3h] {
    font-size: 11px;
    font-weight: 500;
    text-transform: uppercase;
    letter-spacing: 0.025em;
    color: var(--lw-gray-graphite);
}

.coa-overview-value[b-tbcfb3rj3h] {
    font-size: 14px;
    font-weight: 500;
    color: var(--lw-text-primary);
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

/* -- Description -- */
.coa-description-block[b-tbcfb3rj3h] {
    margin-top: 1.25rem;
}

.coa-section-label[b-tbcfb3rj3h] {
    font-size: 11px;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.025em;
    color: var(--lw-gray-graphite);
    margin: 0;
}

.coa-description-text[b-tbcfb3rj3h] {
    margin: 0.375rem 0 0;
    font-size: 14px;
    line-height: 1.625;
    color: var(--lw-gray-graphite);
}

/* -- Impact banner (under review only): increase = info tint, decrease =
      success tint (spec 3.1 section 1). -- */
.coa-impact-banner[b-tbcfb3rj3h] {
    margin-top: 1.25rem;
    padding: 0.75rem 1rem;
    border-radius: var(--lw-radius-lg, 4px);
    font-size: 14px;
    line-height: 1.45;
}

.coa-impact-banner-pos[b-tbcfb3rj3h] {
    background: var(--lw-status-info-bg);
    color: var(--lw-status-info-fg);
}

.coa-impact-banner-neg[b-tbcfb3rj3h] {
    background: var(--lw-status-success-bg);
    color: var(--lw-status-success-fg);
}

.coa-impact-amount[b-tbcfb3rj3h] {
    font-weight: 600;
    font-variant-numeric: tabular-nums;
}

/* -- Line item cards (white cards inside the ControlCard body) -- */
.coa-lineitem-list[b-tbcfb3rj3h] {
    display: flex;
    flex-direction: column;
    gap: 0.75rem;
}

.coa-lineitem[b-tbcfb3rj3h] {
    border: 1px solid var(--lw-border);
    border-radius: var(--lw-radius-card);
    background: var(--lw-white);
    padding: 1rem;
}

.coa-lineitem-head[b-tbcfb3rj3h] {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 0.75rem;
}

.coa-lineitem-titlewrap[b-tbcfb3rj3h] {
    min-width: 0;
    flex: 1;
}

.coa-lineitem-title[b-tbcfb3rj3h] {
    margin: 0;
    font-size: 14px;
    font-weight: 600;
    color: var(--lw-text-primary);
    line-height: 1.4;
}

.coa-lineitem-cat[b-tbcfb3rj3h] {
    margin: 0.125rem 0 0;
    font-size: 13px;
    color: var(--lw-gray-graphite);
}

/* Delta chip: 11px bold tabular, destructive tint (+) / success tint (-). */
.coa-lineitem-pill[b-tbcfb3rj3h] {
    display: inline-flex;
    align-items: center;
    flex-shrink: 0;
    padding: 0.125rem 0.5rem;
    border-radius: var(--lw-radius-control, 8px);
    font-size: 11px;
    font-weight: 700;
    font-variant-numeric: tabular-nums;
    line-height: 1.3;
    white-space: nowrap;
}

.coa-lineitem-pill-pos[b-tbcfb3rj3h] {
    background: var(--lw-status-error-bg);
    color: var(--lw-status-error-fg);
}

.coa-lineitem-pill-neg[b-tbcfb3rj3h] {
    background: var(--lw-status-success-bg);
    color: var(--lw-status-success-fg);
}

/* Value strip: hairline-top 3-col grid, 11px uppercase labels (the reference
   Previous / New / Difference strip recipe, spec 3.1 section 2). */
.coa-lineitem-meta[b-tbcfb3rj3h] {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 1rem;
    margin-top: 0.75rem;
    border-top: 1px solid var(--lw-border);
    padding-top: 0.75rem;
}

.coa-meta-cell[b-tbcfb3rj3h] {
    display: flex;
    flex-direction: column;
    gap: 0.125rem;
    min-width: 0;
}

.coa-meta-value[b-tbcfb3rj3h] {
    font-size: 14px;
    font-weight: 500;
    font-variant-numeric: tabular-nums;
    color: var(--lw-text-primary);
}

/* Difference-style cell: semibold, keeps the red/green delta color. */
.coa-meta-value--delta[b-tbcfb3rj3h] {
    font-weight: 600;
}

.coa-lineitem-reason[b-tbcfb3rj3h] {
    margin: 0.75rem 0 0;
    font-size: 14px;
    line-height: 1.625;
    color: var(--lw-gray-graphite);
}

/* -- Cost breakdown (bare rows in the ControlCard body, spec 3.3) -- */
.coa-costbreakdown[b-tbcfb3rj3h] {
    display: flex;
    flex-direction: column;
    gap: 0.375rem;
}

.coa-costbreakdown-row[b-tbcfb3rj3h] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    font-size: 14px;
}

.coa-costbreakdown-label[b-tbcfb3rj3h] {
    color: var(--lw-text-primary);
}

.coa-costbreakdown-rate[b-tbcfb3rj3h] {
    margin-left: 0.25rem;
    color: var(--lw-gray-graphite);
}

.coa-costbreakdown-amount[b-tbcfb3rj3h] {
    font-weight: 500;
    font-variant-numeric: tabular-nums;
}

.coa-costbreakdown-divider[b-tbcfb3rj3h] {
    margin: 0.5rem 0;
    height: 1px;
    background: var(--lw-border);
}

.coa-costbreakdown-row-total[b-tbcfb3rj3h],
.coa-costbreakdown-row-total .coa-costbreakdown-label[b-tbcfb3rj3h],
.coa-costbreakdown-row-total .coa-costbreakdown-amount[b-tbcfb3rj3h] {
    font-weight: 600;
}

/* -- Attachments (spec 3.1 section 4): white rows, teal border when the
      preview is active / on hover. -- */
.coa-attachment-list[b-tbcfb3rj3h] {
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
}

.coa-attachment[b-tbcfb3rj3h] {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    width: 100%;
    padding: 0.75rem 1rem;
    border: 1px solid var(--lw-border);
    border-radius: var(--lw-radius-card);
    background: var(--lw-white);
    text-align: left;
    cursor: pointer;
    transition: border-color 0.15s, box-shadow 0.15s;
    font-family: var(--lw-font-family);
}

.coa-attachment:hover:not(:disabled)[b-tbcfb3rj3h] {
    border-color: color-mix(in srgb, var(--lw-primary-blue) 50%, transparent);
}

.coa-attachment-active[b-tbcfb3rj3h] {
    border-color: var(--lw-primary-blue);
}

.coa-attachment:disabled[b-tbcfb3rj3h] {
    opacity: 0.6;
    cursor: not-allowed;
}

.coa-attachment-icon[b-tbcfb3rj3h],
.coa-attachment-chev[b-tbcfb3rj3h] {
    color: var(--lw-gray-graphite);
    flex-shrink: 0;
}

.coa-attachment-info[b-tbcfb3rj3h] {
    flex: 1;
    min-width: 0;
}

.coa-attachment-name[b-tbcfb3rj3h] {
    margin: 0;
    font-size: 14px;
    font-weight: 500;
    color: var(--lw-text-primary);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.coa-attachment-meta[b-tbcfb3rj3h] {
    margin: 2px 0 0;
    font-size: 12px;
    color: var(--lw-gray-graphite);
}

/* -- Error banner -- */
.coa-error[b-tbcfb3rj3h] {
    padding: 0.75rem;
    background: var(--lw-status-error-bg);
    border: 1px solid color-mix(in srgb, var(--lw-destructive) 25%, transparent);
    border-radius: var(--lw-radius-control, 8px);
    color: var(--lw-status-error-fg);
    font-size: 0.8125rem;
}

/* -- Footer band: Close left, spacer, navy Approve right (spec 3.1) -- */
.coa-footer[b-tbcfb3rj3h] {
    flex-shrink: 0;
    display: flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.75rem 1rem;
    background: var(--lw-white);
    border-top: 1px solid var(--lw-border);
}

@media (min-width: 768px) {
    .coa-footer[b-tbcfb3rj3h] {
        padding: 0.75rem 1.5rem;
    }
}

.coa-footer-spacer[b-tbcfb3rj3h] {
    flex: 1;
}

.coa-btn-close[b-tbcfb3rj3h] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    height: 36px;
    padding: 0 1rem;
    background: var(--lw-white);
    border: 1px solid var(--lw-border);
    border-radius: var(--lw-radius-control, 8px);
    cursor: pointer;
    font-size: 0.875rem;
    font-weight: 500;
    color: var(--lw-text-primary);
    font-family: var(--lw-font-family);
    transition: background 0.15s;
}

.coa-btn-close:hover:not(:disabled)[b-tbcfb3rj3h] {
    background: var(--lw-accent, rgba(145, 158, 171, 0.16));
}

.coa-btn-close:disabled[b-tbcfb3rj3h] {
    opacity: 0.45;
    cursor: not-allowed;
}

.coa-btn-approve[b-tbcfb3rj3h] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    height: 36px;
    padding: 0 1.25rem;
    background: var(--lw-primary-dark, #020B2B);
    color: var(--lw-white);
    border: none;
    border-radius: var(--lw-radius-control, 8px);
    cursor: pointer;
    font-size: 0.875rem;
    font-weight: 500;
    font-family: var(--lw-font-family);
    transition: background 0.15s;
}

.coa-btn-approve:hover:not(:disabled)[b-tbcfb3rj3h] {
    background: var(--lw-primary-dark-hover);
}

.coa-btn-approve:active[b-tbcfb3rj3h] { transform: translateY(1px); }

.coa-btn-approve:disabled[b-tbcfb3rj3h] {
    opacity: 0.5;
    cursor: not-allowed;
}

.coa-readonly-note[b-tbcfb3rj3h] {
    display: inline-flex;
    align-items: center;
    font-size: 0.8125rem;
    color: var(--lw-gray-graphite);
    font-family: var(--lw-font-family);
}

/* -- Side-pane attachment preview (Blazor-specific split view) -- */
.coa-preview-pane[b-tbcfb3rj3h] {
    flex: 0 0 40%;
    min-width: 320px;
    display: flex;
    flex-direction: column;
    background: var(--lw-bg-muted);
    border-left: 1px solid var(--lw-border);
    overflow: hidden;
}

.coa-preview-toolbar[b-tbcfb3rj3h] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 0.75rem;
    flex-shrink: 0;
    padding: 0.5rem 0.75rem;
    background: var(--lw-white);
    border-bottom: 1px solid var(--lw-border);
}

.coa-preview-name[b-tbcfb3rj3h] {
    flex: 1;
    min-width: 0;
    font-size: 12px;
    font-weight: 500;
    color: var(--lw-text-primary);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.coa-preview-actions[b-tbcfb3rj3h] {
    display: flex;
    align-items: center;
    gap: 0.125rem;
    flex-shrink: 0;
}

.coa-preview-btn[b-tbcfb3rj3h] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 28px;
    height: 28px;
    background: transparent;
    border: none;
    cursor: pointer;
    color: var(--lw-gray-graphite);
    transition: color 0.15s, background 0.12s;
    border-radius: var(--lw-radius-control, 8px);
}

.coa-preview-btn:hover:not(:disabled)[b-tbcfb3rj3h] {
    color: var(--lw-text-primary);
    background: var(--lw-accent, rgba(145, 158, 171, 0.16));
}

.coa-preview-divider[b-tbcfb3rj3h] {
    display: inline-block;
    width: 1px;
    height: 16px;
    background: var(--lw-border);
    margin: 0 0.25rem;
}

.coa-preview-content[b-tbcfb3rj3h] {
    flex: 1;
    min-height: 0;
    position: relative;
    overflow: hidden;
    background: var(--lw-bg-muted);
}

.coa-preview-content iframe[b-tbcfb3rj3h] {
    width: 100%;
    height: 100%;
    border: 0;
    background: var(--lw-white);
}

.coa-preview-image-wrap[b-tbcfb3rj3h] {
    width: 100%;
    height: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    overflow: auto;
    padding: 1rem;
}

.coa-preview-image-wrap img[b-tbcfb3rj3h] {
    max-width: 100%;
    max-height: 100%;
    object-fit: contain;
}

.coa-preview-loading[b-tbcfb3rj3h] {
    width: 100%;
    height: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
}

.coa-preview-fallback[b-tbcfb3rj3h] {
    width: 100%;
    height: 100%;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    text-align: center;
    padding: 1.5rem;
    color: var(--lw-gray-graphite);
}

.coa-preview-fallback-title[b-tbcfb3rj3h] {
    margin: 0;
    font-size: 14px;
    font-weight: 600;
    color: var(--lw-text-primary);
}

.coa-preview-fallback-sub[b-tbcfb3rj3h] {
    margin: 0.25rem 0 0;
    font-size: 13px;
}

/* -- Responsive: grids collapse; no side pane below 900px (the attachment
      click handler falls back to a new tab). -- */
@media (max-width: 640px) {
    .coa-overview-grid[b-tbcfb3rj3h],
    .coa-lineitem-meta[b-tbcfb3rj3h] {
        grid-template-columns: 1fr;
    }
}

@media (max-width: 900px) {
    .coa-body-split .coa-content-wrap[b-tbcfb3rj3h] {
        flex: 1;
    }

    .coa-preview-pane[b-tbcfb3rj3h] {
        display: none;
    }
}
/* _content/Ledgerwise/Components/Modals/ChangeOrderDetailModal.razor.rz.scp.css */
/* ChangeOrderDetailModal -- GC read-only budget-adjustment detail sheet.
   Source: ledgerwise-ui-app organisms/owner/owner-adjustment-detail-drawer.tsx
   + ui/drawer.tsx + kickoff/control-card.tsx (measured spec 2026-07-20;
   migrated 2026-07-21): near-fullscreen bottom sheet (100dvh - 48px, 12px top
   radius, muted shell, blurred backdrop) with white header/footer bands and a
   centered 62rem ControlCard column. Mirrors ChangeOrderApprovalModal (coa-)
   and DrawRequestApprovalModal (dra-). Needs-review status renders NEUTRAL
   gray (spec 1.4); signed deltas: positive = destructive red, negative =
   success green. */

/* -- Backdrop + slide-up bottom sheet -- */
.cod-backdrop[b-beft7l2s7q] {
    position: fixed;
    inset: 0;
    z-index: var(--lw-z-sheet-backdrop);
    background: var(--lw-scrim);
    backdrop-filter: var(--lw-scrim-blur);
    -webkit-backdrop-filter: var(--lw-scrim-blur);
    opacity: 0;
    transition: opacity 0.2s ease;
}

.cod-backdrop.cod-open[b-beft7l2s7q] {
    opacity: 1;
}

.cod-sheet[b-beft7l2s7q] {
    position: fixed;
    left: 0;
    right: 0;
    bottom: 0;
    z-index: var(--lw-z-sheet);
    height: calc(100dvh - 48px);
    background: var(--lw-bg-muted);
    border-top-left-radius: 12px;
    border-top-right-radius: 12px;
    display: flex;
    flex-direction: column;
    overflow: hidden;
    transform: translateY(100%);
    transition: transform 0.3s cubic-bezier(0.22, 1, 0.36, 1);
    box-shadow: 0 -4px 32px rgba(0, 0, 0, 0.15);
}

.cod-sheet.cod-open[b-beft7l2s7q] {
    transform: translateY(0);
}

.cod-sheet.cod-exit[b-beft7l2s7q] {
    transform: translateY(100%);
    transition: transform 0.25s cubic-bezier(0.4, 0, 1, 1);
}

/* -- Header band -- */
.cod-header[b-beft7l2s7q] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 0.75rem;
    flex-shrink: 0;
    padding: 0.75rem 1rem;
    background: var(--lw-white);
    border-bottom: 1px solid var(--lw-border);
}

@media (min-width: 768px) {
    .cod-header[b-beft7l2s7q] {
        padding: 1rem 1.5rem;
    }
}

.cod-header-left[b-beft7l2s7q] {
    display: flex;
    flex-direction: column;
    gap: 0.125rem;
    flex: 1;
    min-width: 0;
}

.cod-header-title-row[b-beft7l2s7q] {
    display: flex;
    align-items: center;
    gap: 0.625rem;
    min-width: 0;
}

.cod-title[b-beft7l2s7q] {
    font-size: 1rem;
    font-weight: 700;
    color: var(--lw-text-primary);
    margin: 0;
    font-family: var(--lw-font-family);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    min-width: 0;
}

@media (min-width: 768px) {
    .cod-title[b-beft7l2s7q] {
        font-size: 1.125rem;
    }
}

.cod-num[b-beft7l2s7q] {
    font-size: 13px;
    color: var(--lw-gray-graphite);
}

/* Status chip: square corners, 8/2 padding, 11px bold uppercase (dra-status
   recipe). Spec 1.4: needs-review maps to the NEUTRAL tone, not gold. */
.cod-status[b-beft7l2s7q] {
    display: inline-flex;
    align-items: center;
    padding: 0.125rem 0.5rem;
    font-size: 11px;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.02em;
    line-height: 1.3;
    flex-shrink: 0;
    white-space: nowrap;
}

.cod-status-default[b-beft7l2s7q] { background: var(--lw-status-neutral-bg); color: var(--lw-status-neutral-fg); }
.cod-status-info[b-beft7l2s7q]    { background: var(--lw-status-info-bg); color: var(--lw-status-info-fg); }
.cod-status-primary[b-beft7l2s7q] { background: var(--lw-status-primary-bg); color: var(--lw-status-primary-fg); }
.cod-status-success[b-beft7l2s7q] { background: var(--lw-status-success-bg); color: var(--lw-status-success-fg); }
/* "warning" is the code key for Needs Review -- rendered neutral per spec. */
.cod-status-warning[b-beft7l2s7q] { background: var(--lw-status-neutral-bg); color: var(--lw-status-neutral-fg); }
.cod-status-error[b-beft7l2s7q]   { background: var(--lw-status-error-bg); color: var(--lw-status-error-fg); }

.cod-header-right[b-beft7l2s7q] {
    display: flex;
    align-items: center;
    gap: 0.25rem;
    flex-shrink: 0;
}

.cod-amount[b-beft7l2s7q] {
    font-size: 1.125rem;
    font-weight: 700;
    font-variant-numeric: tabular-nums;
    white-space: nowrap;
    margin-right: 0.5rem;
}

.cod-amount-pos[b-beft7l2s7q] { color: var(--lw-status-error-fg); }
.cod-amount-neg[b-beft7l2s7q] { color: var(--lw-status-success-fg); }

.cod-close[b-beft7l2s7q],
.cod-nav-btn[b-beft7l2s7q] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 32px;
    height: 32px;
    background: transparent;
    border: none;
    cursor: pointer;
    color: var(--lw-gray-graphite);
    transition: color 0.15s;
}

.cod-close:hover:not(:disabled)[b-beft7l2s7q],
.cod-nav-btn:hover:not(:disabled)[b-beft7l2s7q] {
    color: var(--lw-text-primary);
}

.cod-nav-btn:disabled[b-beft7l2s7q] { opacity: 0.3; cursor: default; }

.cod-nav-count[b-beft7l2s7q] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 36px;
    text-align: center;
    font-size: 0.75rem;
    color: var(--lw-gray-graphite);
    font-variant-numeric: tabular-nums;
}

.cod-nav-divider[b-beft7l2s7q] {
    display: inline-block;
    width: 1px;
    height: 20px;
    margin: 0 0.25rem;
    background: var(--lw-border);
}

/* -- Scrollable content: bare ControlCard column on the muted shell -- */
.cod-body[b-beft7l2s7q] {
    flex: 1;
    min-height: 0;
    display: flex;
    overflow: hidden;
}

.cod-content-wrap[b-beft7l2s7q] {
    flex: 1;
    min-width: 0;
    overflow-y: auto;
    padding: 1rem;
}

@media (min-width: 768px) {
    .cod-content-wrap[b-beft7l2s7q] {
        padding: 1.5rem 2rem;
    }
}

@media (min-width: 1024px) {
    .cod-content-wrap[b-beft7l2s7q] {
        padding: 1.5rem 3rem;
    }
}

.cod-content[b-beft7l2s7q] {
    width: 100%;
    max-width: 62rem;
    margin: 0 auto;
    display: flex;
    flex-direction: column;
    gap: 1.25rem;
}

/* -- Overview grid (label/value pairs) -- */
.cod-overview-grid[b-beft7l2s7q] {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    column-gap: 1.5rem;
    row-gap: 1rem;
}

.cod-overview-cell[b-beft7l2s7q] {
    display: flex;
    flex-direction: column;
    gap: 0.125rem;
    min-width: 0;
}

.cod-overview-label[b-beft7l2s7q] {
    font-size: 11px;
    font-weight: 500;
    text-transform: uppercase;
    letter-spacing: 0.025em;
    color: var(--lw-gray-graphite);
}

.cod-overview-value[b-beft7l2s7q] {
    font-size: 14px;
    font-weight: 500;
    color: var(--lw-text-primary);
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

/* -- Description -- */
.cod-description-block[b-beft7l2s7q] {
    margin-top: 1.25rem;
}

.cod-section-label[b-beft7l2s7q] {
    font-size: 11px;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.025em;
    color: var(--lw-gray-graphite);
    margin: 0;
}

.cod-description-text[b-beft7l2s7q] {
    margin: 0.375rem 0 0;
    font-size: 14px;
    line-height: 1.625;
    color: var(--lw-gray-graphite);
}

/* -- Line item cards (white cards inside the ControlCard body) -- */
.cod-lineitem-list[b-beft7l2s7q] {
    display: flex;
    flex-direction: column;
    gap: 0.75rem;
}

.cod-lineitem[b-beft7l2s7q] {
    border: 1px solid var(--lw-border);
    border-radius: var(--lw-radius-card);
    background: var(--lw-white);
    padding: 1rem;
}

.cod-lineitem-head[b-beft7l2s7q] {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 0.75rem;
}

.cod-lineitem-titlewrap[b-beft7l2s7q] {
    min-width: 0;
    flex: 1;
}

.cod-lineitem-title[b-beft7l2s7q] {
    margin: 0;
    font-size: 14px;
    font-weight: 600;
    color: var(--lw-text-primary);
    line-height: 1.4;
}

.cod-lineitem-cat[b-beft7l2s7q] {
    margin: 0.125rem 0 0;
    font-size: 13px;
    color: var(--lw-gray-graphite);
}

/* Delta chip: 11px bold tabular, destructive tint (+) / success tint (-). */
.cod-lineitem-pill[b-beft7l2s7q] {
    display: inline-flex;
    align-items: center;
    flex-shrink: 0;
    padding: 0.125rem 0.5rem;
    border-radius: var(--lw-radius-control, 8px);
    font-size: 11px;
    font-weight: 700;
    font-variant-numeric: tabular-nums;
    line-height: 1.3;
    white-space: nowrap;
}

.cod-lineitem-pill-pos[b-beft7l2s7q] {
    background: var(--lw-status-error-bg);
    color: var(--lw-status-error-fg);
}

.cod-lineitem-pill-neg[b-beft7l2s7q] {
    background: var(--lw-status-success-bg);
    color: var(--lw-status-success-fg);
}

/* Value strip: hairline-top 3-col grid, 11px uppercase labels (the reference
   Previous / New / Difference strip recipe). */
.cod-lineitem-meta[b-beft7l2s7q] {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 1rem;
    margin-top: 0.75rem;
    border-top: 1px solid var(--lw-border);
    padding-top: 0.75rem;
}

.cod-meta-cell[b-beft7l2s7q] {
    display: flex;
    flex-direction: column;
    gap: 0.125rem;
    min-width: 0;
}

.cod-meta-value[b-beft7l2s7q] {
    font-size: 14px;
    font-weight: 500;
    font-variant-numeric: tabular-nums;
    color: var(--lw-text-primary);
}

.cod-meta-value--delta[b-beft7l2s7q] {
    font-weight: 600;
}

.cod-lineitem-reason[b-beft7l2s7q] {
    margin: 0.75rem 0 0;
    font-size: 14px;
    line-height: 1.625;
    color: var(--lw-gray-graphite);
}

/* Net total row under the line item cards. */
.cod-net-row[b-beft7l2s7q] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    margin-top: 0.75rem;
    border-top: 1px solid var(--lw-border);
    padding-top: 0.75rem;
    font-size: 14px;
    font-weight: 600;
}

.cod-net-label[b-beft7l2s7q] {
    color: var(--lw-text-primary);
}

.cod-net-amount[b-beft7l2s7q] {
    font-variant-numeric: tabular-nums;
}

/* -- Empty state -- */
.cod-empty[b-beft7l2s7q] {
    padding: 2rem 1rem;
    text-align: center;
}

.cod-empty-text[b-beft7l2s7q] {
    margin: 0;
    font-size: 14px;
    color: var(--lw-gray-graphite);
}

/* -- Footer band -- */
.cod-footer[b-beft7l2s7q] {
    flex-shrink: 0;
    display: flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.75rem 1rem;
    background: var(--lw-white);
    border-top: 1px solid var(--lw-border);
}

@media (min-width: 768px) {
    .cod-footer[b-beft7l2s7q] {
        padding: 0.75rem 1.5rem;
    }
}

.cod-btn-close[b-beft7l2s7q] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    height: 36px;
    padding: 0 1rem;
    background: var(--lw-white);
    border: 1px solid var(--lw-border);
    border-radius: var(--lw-radius-control, 8px);
    cursor: pointer;
    font-size: 0.875rem;
    font-weight: 500;
    color: var(--lw-text-primary);
    font-family: var(--lw-font-family);
    transition: background 0.15s;
}

.cod-btn-close:hover[b-beft7l2s7q] {
    background: var(--lw-accent, rgba(145, 158, 171, 0.16));
}

/* Draft-only Edit/Delete footer actions: same chrome as .cod-btn-close. */
.cod-footer-secondary[b-beft7l2s7q] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    margin-right: auto;
}

.cod-btn-outline[b-beft7l2s7q] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 0.375rem;
    height: 36px;
    padding: 0 1rem;
    background: var(--lw-white);
    border: 1px solid var(--lw-border);
    border-radius: var(--lw-radius-control, 8px);
    cursor: pointer;
    font-size: 0.875rem;
    font-weight: 500;
    color: var(--lw-text-primary);
    font-family: var(--lw-font-family);
    transition: background 0.15s, color 0.15s, border-color 0.15s;
}

.cod-btn-outline:hover[b-beft7l2s7q] {
    background: var(--lw-accent, rgba(145, 158, 171, 0.16));
}

.cod-btn-danger[b-beft7l2s7q] {
    color: var(--lw-status-error-fg);
    border-color: var(--lw-status-error-fg);
}

.cod-btn-danger:hover[b-beft7l2s7q] {
    background: rgba(220, 38, 38, 0.06);
}

/* -- Responsive: overview/meta grids collapse on narrow screens -- */
@media (max-width: 640px) {
    .cod-overview-grid[b-beft7l2s7q],
    .cod-lineitem-meta[b-beft7l2s7q] {
        grid-template-columns: 1fr;
    }
}
/* _content/Ledgerwise/Components/Modals/ChooseExistingOwnerDialog.razor.rz.scp.css */
/* Choose-existing project-owner picker -- source: ledgerwise-app
   gc/project-create/client-picker-dialog.tsx (2026-07-24): search strip
   (border-b, px-20 py-12) holding a 40px bordered search box (16px muted
   icon, 14px input, focus border = primary); list max-h 320 py-4 with
   px-20 py-10 rows -- 32px initials avatar, 14/500 name, accent hover;
   centered muted empty-state line. */

.cep[b-61dlyem5pb] {
    display: flex;
    flex-direction: column;
    min-width: 320px;
}

.cep__search-strip[b-61dlyem5pb] {
    border-bottom: 1px solid var(--lw-border);
    padding: 12px 20px;
}

.cep__search[b-61dlyem5pb] {
    display: flex;
    align-items: center;
    gap: 8px;
    height: 40px;
    padding: 0 12px;
    border: 1px solid var(--lw-input-border);
    border-radius: var(--lw-radius-control);
    background: var(--lw-white);
    transition: border-color 0.15s ease;
}

.cep__search:focus-within[b-61dlyem5pb] {
    border-color: var(--lw-primary-dark);
}

.cep__search[b-61dlyem5pb]  .cep__search-icon {
    width: 16px;
    height: 16px;
    font-size: 16px;
    color: var(--lw-gray-space) !important;
    flex-shrink: 0;
}

.cep__search-input[b-61dlyem5pb] {
    width: 100%;
    border: 0;
    outline: none;
    background: transparent;
    font-family: var(--lw-font-family);
    font-size: 14px;
    color: var(--lw-text-primary);
}

.cep__search-input[b-61dlyem5pb]::placeholder {
    color: var(--lw-gray-space);
}

.cep__empty[b-61dlyem5pb] {
    margin: 0;
    padding: 32px 20px;
    text-align: center;
    font-size: 14px;
    color: var(--lw-gray-space);
}

.cep__list[b-61dlyem5pb] {
    display: flex;
    flex-direction: column;
    max-height: 320px;
    overflow-y: auto;
    padding: 4px 0;
}

.cep__row[b-61dlyem5pb] {
    display: flex;
    align-items: center;
    /* A global modal-button rule centers button content; rows are leading. */
    justify-content: flex-start;
    gap: 12px;
    width: 100%;
    border: 0;
    background: transparent;
    padding: 10px 20px;
    cursor: pointer;
    text-align: left;
    font-family: inherit;
    transition: background-color 0.12s ease;
}

.cep__row:hover[b-61dlyem5pb] {
    background: var(--lw-accent);
}

.cep__avatar[b-61dlyem5pb] {
    flex-shrink: 0;
    width: 32px;
    height: 32px;
    border-radius: 50%;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    font-size: 12px;
    font-weight: 700;
    background: var(--lw-bg-secondary);
    color: var(--lw-gray-graphite);
}

.cep__text[b-61dlyem5pb] {
    min-width: 0;
    display: flex;
    flex-direction: column;
}

.cep__name[b-61dlyem5pb] {
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    font-size: 14px;
    font-weight: 500;
    color: var(--lw-text-primary);
}

.cep__email[b-61dlyem5pb] {
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    font-size: 12px;
    color: var(--lw-gray-space);
}
/* _content/Ledgerwise/Components/Modals/ClientQuickTipsDialog.razor.rz.scp.css */
/* ClientQuickTipsDialog content chrome only -- the dialog frame, header,
   body, and footer regions come from the canonical lw-modal pattern
   (LwModalHeader/Body/Footer atoms + global .lw-modal rules in app.css).
   Roundel mirrors AcceptProposalModal's .apm-roundel recipe on the warning
   status token pair: 32px pill, 16px glyph. */

.qt-roundel[b-frgz07hv66] {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 32px; /* apm-roundel reference size */
    height: 32px;
    border-radius: 999px; /* pill */
    background: var(--lw-status-warning-bg);
    color: var(--lw-status-warning-fg);
}

.qt-roundel[b-frgz07hv66]  .mud-icon-root {
    width: 16px; /* apm-roundel reference glyph size */
    height: 16px;
    font-size: 16px;
}

/* Tips grid -- preserves the previous MudGrid md="6" two-column split
   (24px = MudGrid default gutter; 960px = MudBlazor md breakpoint). */
.qt-grid[b-frgz07hv66] {
    display: grid;
    grid-template-columns: 1fr;
    gap: 24px;
}

@media (min-width: 960px) {
    .qt-grid[b-frgz07hv66] { grid-template-columns: repeat(2, 1fr); }
}

/* 12px = the previous MudStack Spacing="3". */
.qt-col[b-frgz07hv66] {
    display: flex;
    flex-direction: column;
    gap: 12px;
}

.qt-tip-title[b-frgz07hv66] {
    display: flex;
    align-items: center;
    gap: 6px; /* icon-to-label gap, mirrors the previous mr-1 */
    margin: 0 0 4px;
    font-size: 14px;
    font-weight: 600;
    color: var(--lw-text-primary);
}

.qt-tip-title[b-frgz07hv66]  .mud-icon-root {
    width: 16px;
    height: 16px;
    font-size: 16px;
    color: var(--lw-primary-blue);
}

.qt-tip-body[b-frgz07hv66] {
    margin: 0;
    font-size: 13px;
    line-height: 1.5;
    color: var(--lw-gray-graphite);
}

.qt-tip-list[b-frgz07hv66] {
    margin: 0;
    padding: 0;
    list-style: none;
    display: flex;
    flex-direction: column;
    gap: 6px;
}

.qt-tip-list li[b-frgz07hv66] {
    font-size: 13px;
    line-height: 1.5;
    color: var(--lw-gray-graphite);
}

.qt-tip-list b[b-frgz07hv66],
.qt-tip-body b[b-frgz07hv66] {
    font-weight: 600;
    color: var(--lw-text-primary);
}
/* _content/Ledgerwise/Components/Modals/CompareProposalsModal.razor.rz.scp.css */
/* Compare proposals -- full-height bottom sheet (rdm-sheet vocabulary:
   100dvh-48px muted shell, white header band w/ ref chip) holding two
   first-class viewer-pane CARDS on the muted bg. Pane anatomy mirrors the
   RFP detail sheet's rdm-preview-* viewer (header band w/ doc name + tools,
   drafting-table dot-grid stage, shadowed page card); picker is the
   SearchableDropdown atom (reference PickerField two-line options); empty
   slot is the arm-doc-empty dashed recipe (documents-manager.tsx:133-141).
   z-index: the -nested sheet layer (branding.css --lw-z-sheet-nested-*), so it
   stacks above the RFP detail sheet's base layer and below MudDialog (1400).
   Rebuilt 2026-07-23 after triage. */

.cpm-backdrop[b-zwrqadzrzz] {
    position: fixed;
    inset: 0;
    z-index: var(--lw-z-sheet-nested-backdrop);
    background: var(--lw-scrim);
    backdrop-filter: var(--lw-scrim-blur);
    -webkit-backdrop-filter: var(--lw-scrim-blur);
    animation: cpm-fade-in-b-zwrqadzrzz 0.2s ease;
}

.cpm-sheet[b-zwrqadzrzz] {
    position: fixed;
    left: 0;
    right: 0;
    bottom: 0;
    z-index: var(--lw-z-sheet-nested);
    height: calc(100dvh - 48px);
    background: var(--lw-bg-muted);
    border-top-left-radius: 12px;
    border-top-right-radius: 12px;
    display: flex;
    flex-direction: column;
    overflow: hidden;
    box-shadow: 0 -4px 32px rgba(0, 0, 0, 0.15);
    animation: cpm-slide-up-b-zwrqadzrzz 0.4s cubic-bezier(0.22, 1, 0.36, 1);
}

@keyframes cpm-fade-in-b-zwrqadzrzz {
    from { opacity: 0; }
    to { opacity: 1; }
}

@keyframes cpm-slide-up-b-zwrqadzrzz {
    from { transform: translateY(100%); }
    to { transform: translateY(0); }
}

/* ---- Header band (rdm-header recipe: title + ref chip, no prose sub) ---- */

.cpm-header[b-zwrqadzrzz] {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 14px 24px;
    flex-shrink: 0;
    background: var(--lw-white);
    border-bottom: 1px solid var(--lw-border);
}

.cpm-header-left[b-zwrqadzrzz] {
    display: flex;
    align-items: center;
    gap: 10px;
    min-width: 0;
    flex: 1;
}

.cpm-title[b-zwrqadzrzz] {
    margin: 0;
    font-family: var(--lw-font-family-heading);
    font-size: 18px;
    font-weight: var(--lw-font-bold);
    color: var(--lw-text-primary);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

/* Ref chip (rdm-ref recipe). */
.cpm-ref[b-zwrqadzrzz] {
    flex-shrink: 0;
    border-radius: var(--lw-radius-control);
    background: var(--lw-bg-muted);
    padding: 2px 6px;
    font-size: 11px;
    font-weight: var(--lw-font-semibold);
    color: var(--lw-gray-graphite);
}

.cpm-close[b-zwrqadzrzz] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 36px;
    height: 36px;
    border: none;
    border-radius: 50%;
    background: transparent;
    color: var(--lw-gray-graphite);
    cursor: pointer;
    transition: background 0.15s, color 0.15s;
}

.cpm-close:hover[b-zwrqadzrzz] {
    background: var(--lw-bg-secondary);
    color: var(--lw-text-primary);
}

/* ---- Body: two viewer-pane cards on the muted shell ---- */

.cpm-body[b-zwrqadzrzz] {
    flex: 1;
    min-height: 0;
    display: flex;
    gap: 16px;
    padding: 20px 24px 24px;
}

/* Pane = first-class white card surface (Card recipe: hairline, card radius,
   card shadow, clipped corners). */
.cpm-pane[b-zwrqadzrzz] {
    flex: 1;
    min-width: 0;
    min-height: 0;
    display: flex;
    flex-direction: column;
    background: var(--lw-white);
    border: 1px solid var(--lw-border);
    border-radius: var(--lw-radius-card);
    box-shadow: var(--lw-shadow-card);
    overflow: hidden;
}

.cpm-pane-picker[b-zwrqadzrzz] {
    flex-shrink: 0;
    padding: 16px 16px 12px;
}

/* ---- Pane header (rdm-preview-header clone) ---- */

.cpm-pane-header[b-zwrqadzrzz] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
    flex-shrink: 0;
    padding: 10px 16px;
    border-top: 1px solid var(--lw-border);
    border-bottom: 1px solid var(--lw-border);
}

.cpm-pane-name[b-zwrqadzrzz] {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    min-width: 0;
    font-size: 13px;
    font-weight: var(--lw-font-semibold);
    color: var(--lw-text-primary);
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.cpm-pane-name[b-zwrqadzrzz]  .mud-icon-root {
    flex-shrink: 0;
    color: var(--lw-gray-graphite);
}

/* Vendor + amount context chip (rdm-ref recipe). */
.cpm-pane-meta[b-zwrqadzrzz] {
    flex-shrink: 0;
    border-radius: var(--lw-radius-control);
    background: var(--lw-bg-muted);
    padding: 2px 6px;
    font-size: 11px;
    font-weight: var(--lw-font-semibold);
    color: var(--lw-gray-graphite);
    white-space: nowrap;
    font-variant-numeric: tabular-nums;
}

.cpm-pane-tools[b-zwrqadzrzz] {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    flex-shrink: 0;
}

.cpm-pane-icon[b-zwrqadzrzz] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 28px;
    height: 28px;
    border: none;
    border-radius: var(--lw-radius-control);
    background: transparent;
    color: var(--lw-gray-graphite);
    cursor: pointer;
    transition: background 0.15s, color 0.15s;
}

.cpm-pane-icon:hover[b-zwrqadzrzz] {
    background: var(--lw-bg-secondary);
    color: var(--lw-text-primary);
}

/* ---- Picker option rows (reference PickerField: label over sublabel) ---- */

.cpm-option[b-zwrqadzrzz] {
    display: flex;
    flex-direction: column;
    min-width: 0;
}

.cpm-option-name[b-zwrqadzrzz] {
    min-width: 0;
    font-size: 14px;
    line-height: 20px;
    font-weight: var(--lw-font-medium);
    color: var(--lw-text-primary);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.cpm-option-sub[b-zwrqadzrzz] {
    font-size: 12px;
    line-height: 16px;
    color: var(--lw-gray-space);
    font-variant-numeric: tabular-nums;
}

/* ---- Loading (rdm-preview-loading spec) ---- */

.cpm-loading[b-zwrqadzrzz] {
    flex: 1;
    min-height: 0;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 16px;
    font-size: 14px;
    color: var(--lw-gray-graphite);
}

/* ---- Drafting-table stage (shared vim-/rdm-preview recipe; no border --
   the card clips it) ---- */

.cpm-stage[b-zwrqadzrzz] {
    flex: 1;
    min-height: 0;
    display: flex;
    padding: 16px;
    background-color: var(--lw-white);
    background-image: radial-gradient(color-mix(in srgb, #1e1e24 5%, transparent) 1.5px, transparent 1.5px);
    background-size: 16px 16px;
}

.cpm-page[b-zwrqadzrzz] {
    flex: 1;
    min-height: 0;
    display: flex;
    border: 1px solid var(--lw-border);
    border-radius: var(--lw-radius-control);
    background: var(--lw-white);
    box-shadow: var(--lw-shadow-card);
    overflow: hidden;
}

.cpm-page iframe[b-zwrqadzrzz] {
    flex: 1;
    width: 100%;
    height: 100%;
    border: none;
}

.cpm-img-wrap[b-zwrqadzrzz] {
    flex: 1;
    min-height: 0;
    display: flex;
    align-items: flex-start;
    justify-content: center;
    overflow: auto;
}

.cpm-img-wrap img[b-zwrqadzrzz] {
    max-width: 100%;
    border: 1px solid var(--lw-border);
    border-radius: var(--lw-radius-control);
    background: var(--lw-white);
    box-shadow: var(--lw-shadow-card);
}

/* ---- Empty slot (arm-doc-empty recipe / documents-manager.tsx:133-141:
   1px dashed on form-surface, 44px info-tinted icon tile, semibold title
   over 13px graphite desc) ---- */

.cpm-empty[b-zwrqadzrzz] {
    flex: 1;
    min-height: 0;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 4px;
    margin: 0 16px 16px;
    border: 1px dashed var(--lw-border);
    border-radius: var(--lw-radius-card);
    background: var(--lw-form-surface);
    padding: 40px 24px;
    text-align: center;
}

.cpm-empty-tile[b-zwrqadzrzz] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 44px;
    height: 44px;
    border-radius: var(--lw-radius-card);
    background: var(--lw-status-info-bg);
    margin-bottom: 8px;
}

.cpm-empty-tile[b-zwrqadzrzz]  .mud-icon-root {
    width: 20px;
    height: 20px;
    font-size: 20px;
    color: var(--lw-primary-blue);
}

.cpm-empty-title[b-zwrqadzrzz] {
    font-size: 14px;
    font-weight: var(--lw-font-semibold);
    color: var(--lw-text-primary);
}

.cpm-empty-desc[b-zwrqadzrzz] {
    max-width: 384px;
    font-size: 13px;
    line-height: 1.625;
    color: var(--lw-gray-graphite);
}
/* _content/Ledgerwise/Components/Modals/ConfirmDepositModal.razor.rz.scp.css */
/* ── MudDialog shell overrides (scoped via ::deep) ── */
[b-igczgvk4ea] .mud-dialog.cdm-dialog {
    border-radius: 8px;
    overflow: hidden;
    box-shadow: 0 10px 24px -8px rgba(2, 11, 43, 0.18),
                0 0 0 1px rgba(145, 158, 171, 0.16);
    background: var(--lw-white);
    color: var(--lw-primary-dark, #020B2B);
    font-family: var(--lw-font-family, sans-serif);
}

[b-igczgvk4ea] .mud-dialog.cdm-dialog .mud-dialog-title {
    padding: 1rem 1.25rem;
    border-bottom: 1px solid rgba(145, 158, 171, 0.2);
}

[b-igczgvk4ea] .mud-dialog.cdm-dialog .mud-dialog-content {
    padding: 1.25rem;
}

[b-igczgvk4ea] .mud-dialog.cdm-dialog .mud-dialog-actions {
    padding: 0.75rem 1.25rem;
    border-top: 1px solid rgba(145, 158, 171, 0.2);
    gap: 0.5rem;
}

/* ── Header ── */
.cdm-header[b-igczgvk4ea] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    width: 100%;
}

.cdm-title[b-igczgvk4ea] {
    margin: 0;
    font-size: 1rem;
    font-weight: 600;
    line-height: 1.3;
    color: var(--lw-primary-dark, #020B2B);
    font-family: var(--lw-font-family, sans-serif);
}

.cdm-close[b-igczgvk4ea] {
    flex-shrink: 0;
    width: 28px;
    height: 28px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    background: transparent;
    border: 0;
    color: var(--lw-gray-graphite, #6E7180);
    cursor: pointer;
    transition: color 0.15s;
}

.cdm-close:hover:not(:disabled)[b-igczgvk4ea] {
    color: var(--lw-primary-dark, #020B2B);
}

.cdm-close:disabled[b-igczgvk4ea] {
    cursor: not-allowed;
    opacity: 0.4;
}

/* ── Summary panel ── */
.cdm-summary[b-igczgvk4ea] {
    border: 1px solid rgba(145, 158, 171, 0.2);
    border-radius: 6px;
    padding: 0.875rem 1rem;
    margin-bottom: 1rem;
    background: var(--lw-white);
}

.cdm-summary-row[b-igczgvk4ea] {
    display: flex;
    align-items: baseline;
    justify-content: space-between;
    gap: 1rem;
    padding: 0.375rem 0;
}

.cdm-summary-row + .cdm-summary-row[b-igczgvk4ea] {
    border-top: 1px solid rgba(145, 158, 171, 0.16);
}

.cdm-summary-label[b-igczgvk4ea] {
    font-size: 0.8125rem;
    font-weight: 500;
    color: var(--lw-gray-graphite, #6E7180);
}

.cdm-summary-amount[b-igczgvk4ea] {
    font-size: 1rem;
    font-weight: 700;
    color: var(--lw-primary-dark, #020B2B);
    font-variant-numeric: tabular-nums;
}

.cdm-summary-value[b-igczgvk4ea] {
    font-size: 0.8125rem;
    font-weight: 500;
    color: var(--lw-primary-dark, #020B2B);
}

/* ── Body copy ── */
.cdm-question[b-igczgvk4ea] {
    margin: 0 0 0.375rem;
    font-size: 0.875rem;
    font-weight: 600;
    line-height: 1.45;
    color: var(--lw-primary-dark, #020B2B);
}

.cdm-explainer[b-igczgvk4ea] {
    margin: 0;
    font-size: 0.8125rem;
    line-height: 1.5;
    color: var(--lw-gray-graphite, #6E7180);
}

/* ── Inline error ── */
.cdm-error[b-igczgvk4ea] {
    margin-top: 0.875rem;
    padding: 0.625rem 0.75rem;
    border-radius: 6px;
    background: rgba(184, 53, 48, 0.08);
    border: 1px solid rgba(184, 53, 48, 0.2);
    color: var(--lw-status-error-fg);
    font-size: 0.8125rem;
    line-height: 1.4;
}

/* ── Buttons (mirror ledgerwise-ui modal buttons) ── */
.cdm-btn[b-igczgvk4ea] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 0.5rem;
    height: 32px;
    padding: 0 0.875rem;
    border-radius: 6px;
    font-size: 0.8125rem;
    font-weight: 600;
    line-height: 1;
    font-family: var(--lw-font-family, sans-serif);
    cursor: pointer;
    transition: background-color 0.15s, color 0.15s, border-color 0.15s;
}

.cdm-btn:disabled[b-igczgvk4ea] {
    cursor: not-allowed;
    opacity: 0.55;
}

.cdm-btn-cancel[b-igczgvk4ea] {
    background: var(--lw-white);
    color: var(--lw-primary-dark, #020B2B);
    border: 1px solid rgba(145, 158, 171, 0.3);
}

.cdm-btn-cancel:hover:not(:disabled)[b-igczgvk4ea] {
    background: var(--lw-bg-muted, #F7F7F5);
    border-color: rgba(145, 158, 171, 0.45);
}

.cdm-btn-confirm[b-igczgvk4ea] {
    background: var(--lw-primary-dark, #020B2B);
    color: var(--lw-white);
    border: 1px solid var(--lw-primary-dark, #020B2B);
}

.cdm-btn-confirm:hover:not(:disabled)[b-igczgvk4ea] {
    background: var(--lw-primary-dark-hover);
    border-color: var(--lw-primary-dark-hover);
}

/* ── Inline spinner inside the confirm button ── */
.cdm-spinner[b-igczgvk4ea] {
    width: 12px;
    height: 12px;
    border: 1.5px solid rgba(255, 255, 255, 0.4);
    border-top-color: var(--lw-white);
    border-radius: 50%;
    animation: cdm-spin-b-igczgvk4ea 0.7s linear infinite;
}

@keyframes cdm-spin-b-igczgvk4ea {
    to { transform: rotate(360deg); }
}
/* _content/Ledgerwise/Components/Modals/ConfirmPaymentModal.razor.rz.scp.css */
/* -- MudDialog shell overrides (scoped via ::deep) -- */
[b-efdueeuvbm] .mud-dialog.cpm-dialog {
    width: 100%;
    max-width: 580px;
    border-radius: 10px;
    overflow: hidden;
    box-shadow: 0 10px 24px -8px rgba(2, 11, 43, 0.18),
                0 0 0 1px rgba(145, 158, 171, 0.16);
    background: var(--lw-white);
    color: var(--lw-primary-dark, #020B2B);
    font-family: var(--lw-font-family, sans-serif);
}

[b-efdueeuvbm] .mud-dialog.cpm-dialog .mud-dialog-title {
    padding: 1.25rem 1.5rem;
    border-bottom: 0;
}

[b-efdueeuvbm] .mud-dialog.cpm-dialog .mud-dialog-content {
    padding: 0 1.5rem 0.5rem;
}

[b-efdueeuvbm] .mud-dialog.cpm-dialog .mud-dialog-actions {
    padding: 1rem 1.5rem 1.25rem;
    border-top: 0;
    gap: 0.625rem;
}

/* -- Header -- */
.cpm-header[b-efdueeuvbm] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    width: 100%;
}

.cpm-title[b-efdueeuvbm] {
    margin: 0;
    font-size: 1rem;
    font-weight: 600;
    line-height: 1.3;
    color: var(--lw-primary-dark, #020B2B);
    font-family: var(--lw-font-family, sans-serif);
}

.cpm-close[b-efdueeuvbm] {
    flex-shrink: 0;
    width: 28px;
    height: 28px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    background: transparent;
    border: 0;
    color: var(--lw-gray-graphite, #6E7180);
    cursor: pointer;
    transition: color 0.15s;
}

.cpm-close:hover:not(:disabled)[b-efdueeuvbm] {
    color: var(--lw-primary-dark, #020B2B);
}

.cpm-close:disabled[b-efdueeuvbm] {
    cursor: not-allowed;
    opacity: 0.4;
}

/* -- Total payment amount card -- */
.cpm-total-card[b-efdueeuvbm] {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 0.375rem;
    padding: 1.75rem 1rem;
    border-radius: 10px;
    border: 1px solid rgba(145, 158, 171, 0.18);
    background: var(--lw-bg-muted, #F7F7F5);
    text-align: center;
}

.cpm-total-amount[b-efdueeuvbm] {
    font-size: 2rem;
    font-weight: 700;
    line-height: 1.1;
    color: var(--lw-primary-dark, #020B2B);
    font-variant-numeric: tabular-nums;
    letter-spacing: -0.01em;
}

.cpm-total-label[b-efdueeuvbm] {
    font-size: 0.8125rem;
    font-weight: 500;
    color: var(--lw-gray-graphite, #6E7180);
}

/* -- Fee breakdown toggle -- */
.cpm-breakdown-toggle[b-efdueeuvbm] {
    display: inline-flex;
    align-items: center;
    gap: 0.375rem;
    margin-top: 0.875rem;
    padding: 0;
    background: transparent;
    border: 0;
    color: var(--lw-primary-blue, #3980A5);
    font-size: 0.8125rem;
    font-weight: 600;
    font-family: var(--lw-font-family, sans-serif);
    cursor: pointer;
}

.cpm-breakdown-chev[b-efdueeuvbm] {
    transition: transform 0.15s ease;
}

.cpm-breakdown-chev--open[b-efdueeuvbm] {
    transform: rotate(180deg);
}

/* -- Fee breakdown rows -- */
.cpm-breakdown[b-efdueeuvbm] {
    margin-top: 0.625rem;
    border: 1px solid rgba(145, 158, 171, 0.2);
    border-radius: 6px;
    padding: 0.25rem 1rem;
    background: var(--lw-white);
}

.cpm-breakdown-row[b-efdueeuvbm] {
    display: flex;
    align-items: baseline;
    justify-content: space-between;
    gap: 1rem;
    padding: 0.5rem 0;
}

.cpm-breakdown-row + .cpm-breakdown-row[b-efdueeuvbm] {
    border-top: 1px solid rgba(145, 158, 171, 0.16);
}

.cpm-breakdown-label[b-efdueeuvbm] {
    font-size: 0.8125rem;
    font-weight: 500;
    color: var(--lw-gray-graphite, #6E7180);
    display: inline-flex;
    align-items: center;
    gap: 4px;
}

/* Info icon for the minimum/reserve balance explanations (US-614) */
.cpm-info-icon[b-efdueeuvbm] {
    width: 13px;
    height: 13px;
    font-size: 13px;
    color: var(--lw-gray-graphite, #6E7180);
    opacity: 0.85;
}

.cpm-breakdown-value[b-efdueeuvbm] {
    font-size: 0.8125rem;
    font-weight: 600;
    color: var(--lw-primary-dark, #020B2B);
    font-variant-numeric: tabular-nums;
}

.cpm-breakdown-row--total .cpm-breakdown-label[b-efdueeuvbm],
.cpm-breakdown-row--total .cpm-breakdown-value[b-efdueeuvbm] {
    font-weight: 700;
    color: var(--lw-primary-dark, #020B2B);
}

/* -- Payment method -- */
.cpm-section-label[b-efdueeuvbm] {
    margin: 1.25rem 0 0.5rem;
    font-size: 0.6875rem;
    font-weight: 700;
    letter-spacing: 0.06em;
    text-transform: uppercase;
    color: var(--lw-gray-graphite, #6E7180);
}

.cpm-methods[b-efdueeuvbm] {
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
}

.cpm-method[b-efdueeuvbm] {
    display: flex;
    align-items: center;
    justify-content: flex-start;
    gap: 0.875rem;
    width: 100%;
    padding: 1rem 1.125rem;
    border-radius: 10px;
    border: 1px solid rgba(145, 158, 171, 0.3);
    background: var(--lw-white);
    text-align: left;
    cursor: pointer;
    transition: border-color 0.15s, background-color 0.15s, box-shadow 0.15s;
}

.cpm-method:hover:not(:disabled)[b-efdueeuvbm] {
    border-color: rgba(2, 11, 43, 0.35);
}

.cpm-method:disabled[b-efdueeuvbm] {
    cursor: not-allowed;
    opacity: 0.6;
}

.cpm-method--selected[b-efdueeuvbm] {
    border-color: var(--lw-primary-dark, #020B2B);
    box-shadow: 0 0 0 1px var(--lw-primary-dark, #020B2B);
    background: var(--lw-bg-muted, #F7F7F5);
}

/* "Connect a bank" affordance shown when no ACH source is linked */
.cpm-method--connect[b-efdueeuvbm] {
    border-style: dashed;
}

.cpm-method--connect .cpm-method-title[b-efdueeuvbm] {
    color: var(--lw-primary-blue, #3980A5);
}

.cpm-method-radio[b-efdueeuvbm] {
    flex-shrink: 0;
    width: 18px;
    height: 18px;
    border-radius: 50%;
    border: 1.5px solid rgba(145, 158, 171, 0.7);
    position: relative;
    transition: border-color 0.15s;
}

.cpm-method--selected .cpm-method-radio[b-efdueeuvbm] {
    border-color: var(--lw-primary-dark, #020B2B);
}

.cpm-method--selected .cpm-method-radio[b-efdueeuvbm]::after {
    content: "";
    position: absolute;
    top: 50%;
    left: 50%;
    width: 9px;
    height: 9px;
    border-radius: 50%;
    background: var(--lw-primary-dark, #020B2B);
    transform: translate(-50%, -50%);
}

/* Connect affordance reuses the radio circle as a "+" badge */
.cpm-method-radio--plus[b-efdueeuvbm] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border-color: var(--lw-primary-blue, #3980A5);
    color: var(--lw-primary-blue, #3980A5);
}

/* Payment-rail icon between the radio and the label */
.cpm-method-icon[b-efdueeuvbm] {
    flex-shrink: 0;
    width: 20px;
    height: 20px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    color: var(--lw-gray-graphite, #6E7180);
}

.cpm-method--selected .cpm-method-icon[b-efdueeuvbm] {
    color: var(--lw-primary-dark, #020B2B);
}

.cpm-method-body[b-efdueeuvbm] {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 0.125rem;
    text-align: left;
}

.cpm-method-title[b-efdueeuvbm] {
    font-size: 0.875rem;
    font-weight: 600;
    color: var(--lw-primary-dark, #020B2B);
}

.cpm-method-sub[b-efdueeuvbm] {
    font-size: 0.75rem;
    color: var(--lw-gray-graphite, #6E7180);
}

/* -- ACH option: expandable container wrapping the account picker -- */
.cpm-ach[b-efdueeuvbm] {
    flex-direction: column;
    align-items: stretch;
    padding: 0;
    overflow: hidden;
}

/* The clickable header row (radio + icon + label) and the Change/Done toggle. */
.cpm-ach-main[b-efdueeuvbm] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    padding: 1rem 1.125rem;
}

.cpm-ach-select[b-efdueeuvbm] {
    display: flex;
    align-items: center;
    justify-content: flex-start;
    gap: 0.875rem;
    flex: 1 1 auto;
    min-width: 0;
    padding: 0;
    background: transparent;
    border: 0;
    text-align: left;
    cursor: pointer;
}

.cpm-ach-select:disabled[b-efdueeuvbm] {
    cursor: not-allowed;
}

.cpm-ach-select .cpm-method-sub[b-efdueeuvbm] {
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    max-width: 100%;
}

/* "Change" / "Done" toggle on the right of the ACH row */
.cpm-ach-toggle[b-efdueeuvbm] {
    flex-shrink: 0;
    display: inline-flex;
    align-items: center;
    gap: 0.1875rem;
    padding: 0.25rem 0.375rem;
    background: transparent;
    border: 0;
    color: var(--lw-primary-dark, #020B2B);
    font-size: 0.75rem;
    font-weight: 600;
    font-family: var(--lw-font-family, sans-serif);
    cursor: pointer;
    transition: color 0.15s;
}

.cpm-ach-toggle:hover:not(:disabled)[b-efdueeuvbm] {
    color: var(--lw-primary-blue, #3980A5);
}

.cpm-ach-toggle:disabled[b-efdueeuvbm] {
    cursor: not-allowed;
    opacity: 0.6;
}

.cpm-ach-toggle-chev[b-efdueeuvbm] {
    transition: transform 0.15s ease;
}

.cpm-ach-toggle-chev--open[b-efdueeuvbm] {
    transform: rotate(180deg);
}

/* Inline account list region, divided from the header row when open */
.cpm-ach-picker--open[b-efdueeuvbm] {
    border-top: 1px solid var(--lw-input-border, rgba(145, 158, 171, 0.4));
    padding: 0.375rem 0.5rem 0.5rem;
}

/* -- Inline error -- */
.cpm-error[b-efdueeuvbm] {
    margin-top: 0.875rem;
    padding: 0.625rem 0.75rem;
    border-radius: 6px;
    background: rgba(184, 53, 48, 0.08);
    border: 1px solid rgba(184, 53, 48, 0.2);
    color: var(--lw-status-error-fg);
    font-size: 0.8125rem;
    line-height: 1.4;
}

/* -- Buttons -- */
.cpm-btn[b-efdueeuvbm] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 0.5rem;
    height: 40px;
    padding: 0 1.25rem;
    border-radius: 8px;
    font-size: 0.875rem;
    font-weight: 600;
    line-height: 1;
    font-family: var(--lw-font-family, sans-serif);
    cursor: pointer;
    transition: background-color 0.15s, color 0.15s, border-color 0.15s;
}

.cpm-btn:disabled[b-efdueeuvbm] {
    cursor: not-allowed;
    opacity: 0.55;
}

.cpm-btn-cancel[b-efdueeuvbm] {
    background: var(--lw-white);
    color: var(--lw-primary-dark, #020B2B);
    border: 1px solid rgba(145, 158, 171, 0.3);
}

.cpm-btn-cancel:hover:not(:disabled)[b-efdueeuvbm] {
    background: var(--lw-bg-muted, #F7F7F5);
    border-color: rgba(145, 158, 171, 0.45);
}

.cpm-btn-approve[b-efdueeuvbm] {
    background: var(--lw-primary-dark, #020B2B);
    color: var(--lw-white);
    border: 1px solid var(--lw-primary-dark, #020B2B);
}

.cpm-btn-approve:hover:not(:disabled)[b-efdueeuvbm] {
    background: var(--lw-primary-dark-hover);
    border-color: var(--lw-primary-dark-hover);
}

/* -- Inline spinner inside the approve button -- */
.cpm-spinner[b-efdueeuvbm] {
    width: 12px;
    height: 12px;
    border: 1.5px solid rgba(255, 255, 255, 0.4);
    border-top-color: var(--lw-white);
    border-radius: 50%;
    animation: cpm-spin-b-efdueeuvbm 0.7s linear infinite;
}

@keyframes cpm-spin-b-efdueeuvbm {
    to { transform: rotate(360deg); }
}
/* _content/Ledgerwise/Components/Modals/ConnectBankModal.razor.rz.scp.css */
/* MudDialog shell overrides (scoped via ::deep) */
[b-0pzvtjzkgx] .mud-dialog.cbm-dialog {
    border-radius: 8px;
    overflow: hidden;
    box-shadow: 0 10px 24px -8px rgba(2, 11, 43, 0.18),
                0 0 0 1px rgba(145, 158, 171, 0.16);
    background: var(--lw-white);
    color: var(--lw-primary-dark, #020B2B);
    font-family: var(--lw-font-family, sans-serif);
}

[b-0pzvtjzkgx] .mud-dialog.cbm-dialog .mud-dialog-title {
    padding: 1rem 1.25rem;
    border-bottom: 1px solid rgba(145, 158, 171, 0.2);
}

[b-0pzvtjzkgx] .mud-dialog.cbm-dialog .mud-dialog-content {
    padding: 1.25rem;
}

[b-0pzvtjzkgx] .mud-dialog.cbm-dialog .mud-dialog-actions {
    padding: 0.75rem 1.25rem;
    border-top: 1px solid rgba(145, 158, 171, 0.2);
    gap: 0.5rem;
}

/* Header */
.cbm-header[b-0pzvtjzkgx] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    width: 100%;
}

.cbm-title[b-0pzvtjzkgx] {
    margin: 0;
    font-size: 1rem;
    font-weight: 600;
    line-height: 1.3;
    color: var(--lw-primary-dark, #020B2B);
    font-family: var(--lw-font-family, sans-serif);
}

.cbm-close[b-0pzvtjzkgx] {
    flex-shrink: 0;
    width: 28px;
    height: 28px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    background: transparent;
    border: 0;
    color: var(--lw-gray-graphite, #6E7180);
    cursor: pointer;
    transition: color 0.15s;
}

.cbm-close:hover:not(:disabled)[b-0pzvtjzkgx] {
    color: var(--lw-primary-dark, #020B2B);
}

.cbm-close:disabled[b-0pzvtjzkgx] {
    cursor: not-allowed;
    opacity: 0.4;
}

/* Body */
.cbm-lead[b-0pzvtjzkgx] {
    margin: 0;
    font-size: 0.8125rem;
    line-height: 1.5;
    color: var(--lw-gray-graphite, #6E7180);
}

.cbm-callout[b-0pzvtjzkgx] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    margin-top: 0.875rem;
    padding: 0.625rem 0.75rem;
    border-radius: 6px;
    font-size: 0.8125rem;
    line-height: 1.4;
}

.cbm-callout--info[b-0pzvtjzkgx] {
    background: var(--lw-bg-muted, #F7F7F5);
    color: var(--lw-primary-dark, #020B2B);
}

.cbm-callout--error[b-0pzvtjzkgx] {
    background: rgba(220, 38, 38, 0.08);
    border: 1px solid rgba(220, 38, 38, 0.2);
    color: var(--lw-status-error-fg, #dc2626);
}

/* Buttons */
.cbm-btn[b-0pzvtjzkgx] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 0.5rem;
    height: 32px;
    padding: 0 0.875rem;
    border-radius: 6px;
    font-size: 0.8125rem;
    font-weight: 600;
    line-height: 1;
    font-family: var(--lw-font-family, sans-serif);
    cursor: pointer;
    transition: background-color 0.15s, color 0.15s, border-color 0.15s;
}

.cbm-btn:disabled[b-0pzvtjzkgx] {
    cursor: not-allowed;
    opacity: 0.55;
}

.cbm-btn-cancel[b-0pzvtjzkgx] {
    background: var(--lw-white);
    color: var(--lw-primary-dark, #020B2B);
    border: 1px solid rgba(145, 158, 171, 0.3);
}

.cbm-btn-cancel:hover:not(:disabled)[b-0pzvtjzkgx] {
    background: var(--lw-bg-muted, #F7F7F5);
    border-color: rgba(145, 158, 171, 0.45);
}

.cbm-btn-connect[b-0pzvtjzkgx] {
    background: var(--lw-primary-dark, #020B2B);
    color: var(--lw-white);
    border: 1px solid var(--lw-primary-dark, #020B2B);
}

.cbm-btn-connect:hover:not(:disabled)[b-0pzvtjzkgx] {
    background: var(--lw-primary-dark-hover);
    border-color: var(--lw-primary-dark-hover);
}

/* Inline spinner */
.cbm-spinner[b-0pzvtjzkgx] {
    width: 12px;
    height: 12px;
    border: 1.5px solid rgba(2, 11, 43, 0.2);
    border-top-color: var(--lw-primary-dark, #020B2B);
    border-radius: 50%;
    animation: cbm-spin-b-0pzvtjzkgx 0.7s linear infinite;
    flex-shrink: 0;
}

.cbm-btn-connect .cbm-spinner[b-0pzvtjzkgx] {
    border-color: rgba(255, 255, 255, 0.4);
    border-top-color: var(--lw-white);
}

@keyframes cbm-spin-b-0pzvtjzkgx {
    to { transform: rotate(360deg); }
}
/* _content/Ledgerwise/Components/Modals/ContractorQuickTipsDialog.razor.rz.scp.css */
/* ContractorQuickTipsDialog content chrome only -- the dialog frame, header,
   body, and footer regions come from the canonical lw-modal pattern
   (LwModalHeader/Body/Footer atoms + global .lw-modal rules in app.css).
   Roundel mirrors AcceptProposalModal's .apm-roundel recipe on the warning
   status token pair: 32px pill, 16px glyph. */

.qt-roundel[b-77z4dif1j2] {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 32px; /* apm-roundel reference size */
    height: 32px;
    border-radius: 999px; /* pill */
    background: var(--lw-status-warning-bg);
    color: var(--lw-status-warning-fg);
}

.qt-roundel[b-77z4dif1j2]  .mud-icon-root {
    width: 16px; /* apm-roundel reference glyph size */
    height: 16px;
    font-size: 16px;
}

/* Tips grid -- preserves the previous MudGrid md="6" two-column split
   (24px = MudGrid default gutter; 960px = MudBlazor md breakpoint). */
.qt-grid[b-77z4dif1j2] {
    display: grid;
    grid-template-columns: 1fr;
    gap: 24px;
}

@media (min-width: 960px) {
    .qt-grid[b-77z4dif1j2] { grid-template-columns: repeat(2, 1fr); }
}

/* 12px = the previous MudStack Spacing="3". */
.qt-col[b-77z4dif1j2] {
    display: flex;
    flex-direction: column;
    gap: 12px;
}

.qt-tip-title[b-77z4dif1j2] {
    display: flex;
    align-items: center;
    gap: 6px; /* icon-to-label gap, mirrors the previous mr-1 */
    margin: 0 0 4px;
    font-size: 14px;
    font-weight: 600;
    color: var(--lw-text-primary);
}

.qt-tip-title[b-77z4dif1j2]  .mud-icon-root {
    width: 16px;
    height: 16px;
    font-size: 16px;
    color: var(--lw-primary-blue);
}

.qt-tip-body[b-77z4dif1j2] {
    margin: 0;
    font-size: 13px;
    line-height: 1.5;
    color: var(--lw-gray-graphite);
}

.qt-tip-body b[b-77z4dif1j2] {
    font-weight: 600;
    color: var(--lw-text-primary);
}
/* _content/Ledgerwise/Components/Modals/ContractorRfpDetailModal.razor.rz.scp.css */
/* Contractor RFP detail modal — bottom-sheet pattern with split-pane body,
   visually aligned with ledgerwise-ui/src/components/organisms/rfp-detail-drawer.tsx. */

/* ── Backdrop ── */
.crdm-backdrop[b-c8c1rqts4i] {
    position: fixed;
    inset: 0;
    z-index: var(--lw-z-sheet-backdrop);
    background: var(--lw-scrim);
    backdrop-filter: var(--lw-scrim-blur);
    -webkit-backdrop-filter: var(--lw-scrim-blur);
    opacity: 0;
    transition: opacity 0.2s ease;
}

.crdm-backdrop.crdm-open[b-c8c1rqts4i] {
    opacity: 1;
}

/* ── Sheet (slide-up panel) ── */
.crdm-sheet[b-c8c1rqts4i] {
    position: fixed;
    left: 0;
    right: 0;
    bottom: 0;
    z-index: var(--lw-z-sheet);
    height: calc(100vh - 48px);
    background: var(--lw-bg-muted, #F7F7F5);
    border-top-left-radius: 12px;
    border-top-right-radius: 12px;
    display: flex;
    flex-direction: column;
    overflow: hidden;
    transform: translateY(100%);
    /* easeOutQuint — smooth deceleration matching ledgerwise-ui's spring */
    transition: transform 0.4s cubic-bezier(0.22, 1, 0.36, 1);
    will-change: transform;
    box-shadow: 0 -4px 32px rgba(0, 0, 0, 0.15);
    font-family: var(--lw-font-family, sans-serif);
}

.crdm-sheet.crdm-open[b-c8c1rqts4i] {
    transform: translateY(0);
}

.crdm-sheet.crdm-exit[b-c8c1rqts4i] {
    transform: translateY(100%);
    transition: transform 0.25s cubic-bezier(0.4, 0, 1, 1);
}

/* ── Header ── */
.crdm-header[b-c8c1rqts4i] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 0.875rem 1rem;
    flex-shrink: 0;
    background: var(--lw-white);
    border-bottom: 1px solid var(--lw-border);
    gap: 0.75rem;
    border-top-left-radius: 4px;
    border-top-right-radius: 4px;
}

@media (min-width: 768px) {
    .crdm-header[b-c8c1rqts4i] {
        padding: 1rem 1.5rem;
    }
}

.crdm-header-left[b-c8c1rqts4i] {
    display: flex;
    align-items: center;
    gap: 0.625rem;
    min-width: 0;
    flex: 1;
}

.crdm-rfp-num[b-c8c1rqts4i] {
    font-size: 1rem;
    font-weight: 700;
    color: var(--lw-primary-dark, #020B2B);
    margin: 0;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

@media (min-width: 768px) {
    .crdm-rfp-num[b-c8c1rqts4i] {
        font-size: 1.125rem;
    }
}

.crdm-close-btn[b-c8c1rqts4i] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 36px;
    height: 36px;
    flex-shrink: 0;
    border: 0;
    background: transparent;
    color: var(--lw-gray-graphite, #6E7180);
    cursor: pointer;
    border-radius: 6px;
    transition: background-color 0.12s, color 0.12s;
}

.crdm-close-btn:hover[b-c8c1rqts4i] {
    background: rgba(2, 11, 43, 0.05);
    color: var(--lw-primary-dark, #020B2B);
}

@media (min-width: 768px) {
    .crdm-close-btn[b-c8c1rqts4i] {
        width: 32px;
        height: 32px;
    }
}

/* ── Body — split pane: left content + right preview ── */
.crdm-body[b-c8c1rqts4i] {
    display: flex;
    flex: 1;
    min-height: 0;
    background: var(--lw-bg-muted, #F7F7F5);
}

.crdm-left[b-c8c1rqts4i] {
    flex: 1;
    min-width: 0;
    overflow-y: auto;
    padding: 1rem;
}

@media (min-width: 768px) {
    .crdm-left[b-c8c1rqts4i] {
        padding: 1.5rem 2rem;
    }
}

@media (min-width: 1024px) {
    .crdm-left[b-c8c1rqts4i] {
        padding: 1.5rem 3rem;
    }
}

.crdm-content-card[b-c8c1rqts4i] {
    margin: 0 auto;
    max-width: 52rem;
    background: var(--lw-white);
    border: 1px solid var(--lw-border);
    border-radius: 8px;
    padding: 1rem;
}

@media (min-width: 768px) {
    .crdm-content-card[b-c8c1rqts4i] {
        padding: 1.5rem;
    }
}

/* ── Sections ── */
.crdm-section[b-c8c1rqts4i] {
    display: flex;
    flex-direction: column;
}

.crdm-section + .crdm-section[b-c8c1rqts4i] {
    margin-top: 1.25rem;
    padding-top: 1.25rem;
}

.crdm-section-bordered + .crdm-section[b-c8c1rqts4i] {
    border-top: 1px solid var(--lw-border);
}

.crdm-section-title[b-c8c1rqts4i] {
    font-size: 1rem;
    font-weight: 700;
    color: var(--lw-primary-dark, #020B2B);
    margin: 0 0 0.5rem;
    font-family: var(--lw-font-family-heading, sans-serif);
    line-height: 1.4;
}

@media (min-width: 768px) {
    .crdm-section-title[b-c8c1rqts4i] {
        font-size: 1.125rem;
    }
}

.crdm-subhead[b-c8c1rqts4i] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    font-size: 0.875rem;
    font-weight: 600;
    color: var(--lw-primary-dark, #020B2B);
    margin: 0 0 0.75rem;
}

.crdm-count-chip[b-c8c1rqts4i] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 18px;
    height: 18px;
    padding: 0 6px;
    background: var(--lw-bg-table-header, #F0F0EE);
    color: var(--lw-gray-graphite, #6E7180);
    border-radius: 3px;
    font-size: 10px;
    font-weight: 700;
    font-variant-numeric: tabular-nums;
    line-height: 1;
}

/* ── Meta grid (Sent On / Due Date) ── */
.crdm-meta-grid[b-c8c1rqts4i] {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 0.75rem 1.5rem;
    margin-top: 0.75rem;
}

.crdm-meta-cell[b-c8c1rqts4i] {
    min-width: 0;
}

.crdm-meta-label[b-c8c1rqts4i] {
    font-size: 12px;
    color: var(--lw-gray-graphite, #6E7180);
    margin: 0;
    line-height: 1.4;
}

.crdm-meta-value[b-c8c1rqts4i] {
    font-size: 14px;
    font-weight: 500;
    color: var(--lw-primary-dark, #020B2B);
    font-variant-numeric: tabular-nums;
    margin: 0.125rem 0 0;
}

/* ── Due-date callout ── */
.crdm-due-callout[b-c8c1rqts4i] {
    display: inline-flex;
    align-items: center;
    align-self: flex-start;
    margin-top: 0.875rem;
    padding: 0.375rem 0.625rem;
    border-radius: 4px;
    font-size: 12px;
    font-weight: 600;
}

.crdm-due-ok[b-c8c1rqts4i] {
    background: rgba(2, 11, 43, 0.05);
    color: var(--lw-gray-graphite, #6E7180);
}

.crdm-due-due-soon[b-c8c1rqts4i] {
    background: rgba(245, 158, 11, 0.14);
    color: var(--lw-status-warning-fg);
}

.crdm-due-past-due[b-c8c1rqts4i] {
    background: rgba(220, 38, 38, 0.12);
    color: var(--lw-status-error-fg);
}

/* ── Notes panel ── */
.crdm-notes[b-c8c1rqts4i] {
    margin-top: 0.875rem;
    padding: 0.75rem;
    background: var(--lw-bg-muted, #F7F7F5);
    border: 1px solid var(--lw-border);
    border-radius: 6px;
}

.crdm-notes-body[b-c8c1rqts4i] {
    font-size: 13px;
    color: var(--lw-primary-dark, #020B2B);
    line-height: 1.5;
    margin: 0.25rem 0 0;
    white-space: pre-wrap;
}

/* ── Status pills ── */
.crdm-pill[b-c8c1rqts4i] {
    display: inline-flex;
    align-items: center;
    height: 22px;
    min-width: 22px;
    padding: 0 8px;
    border-radius: 3px;
    font-size: 11px;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.04em;
    line-height: 1;
    white-space: nowrap;
    flex-shrink: 0;
}

.crdm-pill-new[b-c8c1rqts4i]        { background: rgba(57, 128, 165, 0.12); color: var(--lw-primary-blue, #3980A5); }
.crdm-pill-info[b-c8c1rqts4i]       { background: rgba(37, 99, 235, 0.12);  color: var(--lw-status-info-fg); }
.crdm-pill-submitted[b-c8c1rqts4i]  { background: rgba(238, 182, 112, 0.16); color: var(--lw-status-warning-fg); }
.crdm-pill-success[b-c8c1rqts4i]    { background: rgba(21, 128, 61, 0.12);  color: var(--lw-status-success-fg); }
.crdm-pill-destructive[b-c8c1rqts4i]{ background: rgba(220, 38, 38, 0.12);  color: var(--lw-status-error-fg); }

/* ── Empty state ── */
.crdm-empty[b-c8c1rqts4i] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 0.5rem;
    padding: 1.75rem 1rem;
    border: 1px dashed var(--lw-border);
    border-radius: 6px;
    text-align: center;
    color: var(--lw-gray-graphite, #6E7180);
}

.crdm-empty-large[b-c8c1rqts4i] {
    padding: 4rem 1rem;
    border: 0;
}

.crdm-empty-text[b-c8c1rqts4i] {
    font-size: 14px;
    color: var(--lw-gray-graphite, #6E7180);
    margin: 0;
}

/* ── Attachments from GC: file pills ── */
.crdm-pill-row[b-c8c1rqts4i] {
    display: flex;
    flex-wrap: wrap;
    gap: 0.5rem;
}

.crdm-file-pill[b-c8c1rqts4i] {
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.5rem 0.75rem;
    border: 1px solid var(--lw-border);
    background: var(--lw-white);
    border-radius: 8px;
    cursor: pointer;
    font-family: inherit;
    transition: border-color 0.12s, background-color 0.12s;
    max-width: 100%;
    min-width: 0;
}

.crdm-file-pill:hover[b-c8c1rqts4i] {
    border-color: rgba(57, 128, 165, 0.4);
    background: rgba(57, 128, 165, 0.04);
}

.crdm-file-pill-active[b-c8c1rqts4i] {
    border-color: var(--lw-primary-blue, #3980A5);
    background: rgba(57, 128, 165, 0.05);
}

.crdm-file-pill-icon[b-c8c1rqts4i] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    color: var(--lw-gray-graphite, #6E7180);
    flex-shrink: 0;
    transition: color 0.12s;
}

.crdm-file-pill:hover .crdm-file-pill-icon[b-c8c1rqts4i],
.crdm-file-pill-active .crdm-file-pill-icon[b-c8c1rqts4i] {
    color: var(--lw-primary-blue, #3980A5);
}

.crdm-file-pill-text[b-c8c1rqts4i] {
    display: flex;
    flex-direction: column;
    min-width: 0;
    line-height: 1.2;
}

.crdm-file-pill-name[b-c8c1rqts4i] {
    font-size: 13px;
    font-weight: 500;
    color: var(--lw-primary-dark, #020B2B);
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    max-width: 220px;
}

.crdm-file-pill-size[b-c8c1rqts4i] {
    font-size: 11px;
    color: var(--lw-gray-graphite, #6E7180);
    margin-top: 1px;
}

.crdm-file-pill-eye[b-c8c1rqts4i] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    color: rgba(110, 113, 128, 0.5);
    flex-shrink: 0;
    margin-left: 0.25rem;
    transition: color 0.12s;
}

.crdm-file-pill:hover .crdm-file-pill-eye[b-c8c1rqts4i],
.crdm-file-pill-active .crdm-file-pill-eye[b-c8c1rqts4i] {
    color: var(--lw-primary-blue, #3980A5);
}

/* ── Proposal card ── */
.crdm-proposal-card[b-c8c1rqts4i] {
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
    padding: 0.875rem;
    border: 1px solid var(--lw-border);
    border-radius: 8px;
    background: var(--lw-white);
}

.crdm-proposal-accepted[b-c8c1rqts4i] {
    border-color: rgba(21, 128, 61, 0.4);
    background: rgba(21, 128, 61, 0.03);
}

.crdm-proposal-row-1[b-c8c1rqts4i] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
}

.crdm-proposal-label[b-c8c1rqts4i] {
    flex: 1;
    min-width: 0;
    font-size: 14px;
    font-weight: 600;
    color: var(--lw-primary-dark, #020B2B);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.crdm-proposal-amount[b-c8c1rqts4i] {
    font-size: 14px;
    font-weight: 700;
    color: var(--lw-primary-dark, #020B2B);
    font-variant-numeric: tabular-nums;
    flex-shrink: 0;
}

.crdm-proposal-row-2[b-c8c1rqts4i],
.crdm-proposal-row-3[b-c8c1rqts4i] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    flex-wrap: wrap;
}

.crdm-dot[b-c8c1rqts4i] {
    color: rgba(110, 113, 128, 0.4);
    user-select: none;
    font-size: 12px;
}

.crdm-proposal-meta[b-c8c1rqts4i] {
    font-size: 12px;
    color: var(--lw-gray-graphite, #6E7180);
    font-variant-numeric: tabular-nums;
}

/* ── Proposal docs: compact file pills (smaller than GC pills) ── */
.crdm-proposal-pill-row[b-c8c1rqts4i] {
    display: flex;
    flex-wrap: wrap;
    gap: 0.375rem;
    margin-top: 0.625rem;
    padding-top: 0.625rem;
    border-top: 1px solid var(--lw-border);
}

.crdm-prop-file-pill[b-c8c1rqts4i] {
    display: inline-flex;
    align-items: center;
    gap: 0.375rem;
    padding: 0.25rem 0.5rem;
    border: 1px solid var(--lw-border);
    background: var(--lw-bg-muted, #F7F7F5);
    border-radius: 6px;
    cursor: pointer;
    font-family: inherit;
    transition: border-color 0.12s, background-color 0.12s;
    min-width: 0;
    max-width: 100%;
}

.crdm-prop-file-pill:hover[b-c8c1rqts4i] {
    border-color: rgba(57, 128, 165, 0.35);
    background: rgba(57, 128, 165, 0.04);
}

.crdm-prop-file-pill-active[b-c8c1rqts4i] {
    border-color: rgba(57, 128, 165, 0.5);
    background: rgba(57, 128, 165, 0.07);
    box-shadow: 0 0 0 1px rgba(57, 128, 165, 0.12);
}

.crdm-prop-file-pill-icon[b-c8c1rqts4i] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    color: var(--lw-gray-graphite, #6E7180);
    flex-shrink: 0;
    transition: color 0.12s;
}

.crdm-prop-file-pill:hover .crdm-prop-file-pill-icon[b-c8c1rqts4i],
.crdm-prop-file-pill-active .crdm-prop-file-pill-icon[b-c8c1rqts4i] {
    color: var(--lw-primary-blue, #3980A5);
}

.crdm-prop-file-pill-name[b-c8c1rqts4i] {
    font-size: 11px;
    font-weight: 500;
    color: var(--lw-gray-graphite, #6E7180);
    line-height: 1.2;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    max-width: 180px;
    transition: color 0.12s;
}

.crdm-prop-file-pill:hover .crdm-prop-file-pill-name[b-c8c1rqts4i],
.crdm-prop-file-pill-active .crdm-prop-file-pill-name[b-c8c1rqts4i] {
    color: var(--lw-primary-blue, #3980A5);
}

/* ── Right pane: document preview ── */
.crdm-right[b-c8c1rqts4i] {
    flex-shrink: 0;
    width: 100%;
    display: none;
    flex-direction: column;
    background: var(--lw-surface-dark);
    border-left: 1px solid var(--lw-border);
    overflow: hidden;
    animation: crdm-slide-in-b-c8c1rqts4i 0.25s cubic-bezier(0.22, 1, 0.36, 1);
}

@media (min-width: 768px) {
    .crdm-right[b-c8c1rqts4i] {
        display: flex;
        width: 40%;
    }
}

@keyframes crdm-slide-in-b-c8c1rqts4i {
    from { transform: translateX(40px); opacity: 0; }
    to   { transform: translateX(0); opacity: 1; }
}

.crdm-preview-header[b-c8c1rqts4i] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 0.75rem;
    flex-shrink: 0;
    padding: 0.625rem 0.875rem;
    background: var(--lw-surface-darker);
    color: var(--lw-white);
    border-bottom: 1px solid rgba(255, 255, 255, 0.08);
}

.crdm-preview-title[b-c8c1rqts4i] {
    font-size: 13px;
    font-weight: 500;
    color: var(--lw-white);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    flex: 1;
    min-width: 0;
}

.crdm-preview-close[b-c8c1rqts4i] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 28px;
    height: 28px;
    border: 0;
    background: transparent;
    color: rgba(255, 255, 255, 0.6);
    cursor: pointer;
    border-radius: 4px;
    transition: background-color 0.12s, color 0.12s;
    flex-shrink: 0;
}

.crdm-preview-close:hover[b-c8c1rqts4i] {
    background: rgba(255, 255, 255, 0.1);
    color: var(--lw-white);
}

.crdm-preview-body[b-c8c1rqts4i] {
    flex: 1;
    min-height: 0;
    overflow: hidden;
    display: flex;
    align-items: center;
    justify-content: center;
    background: var(--lw-surface-dark);
    color: rgba(255, 255, 255, 0.6);
}

.crdm-preview-iframe[b-c8c1rqts4i] {
    width: 100%;
    height: 100%;
    border: 0;
    background: var(--lw-white);
}

.crdm-preview-img-wrap[b-c8c1rqts4i] {
    width: 100%;
    height: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    background: var(--lw-surface-darker);
    padding: 1rem;
}

.crdm-preview-img-wrap img[b-c8c1rqts4i] {
    max-width: 100%;
    max-height: 100%;
    object-fit: contain;
}

.crdm-preview-loading[b-c8c1rqts4i],
.crdm-preview-empty[b-c8c1rqts4i] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 0.5rem;
    padding: 2rem;
    font-size: 13px;
    color: rgba(255, 255, 255, 0.55);
    text-align: center;
}

/* ── Footer ── */
.crdm-footer[b-c8c1rqts4i] {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: 0.75rem;
    flex-shrink: 0;
    padding: 0.75rem 1rem;
    background: var(--lw-white);
    border-top: 1px solid var(--lw-border);
}

@media (min-width: 768px) {
    .crdm-footer[b-c8c1rqts4i] {
        padding: 0.75rem 1.5rem;
    }
}

.crdm-footer-close[b-c8c1rqts4i] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    height: 36px;
    padding: 0 1rem;
    border: 1px solid var(--lw-border);
    background: var(--lw-white);
    color: var(--lw-primary-dark, #020B2B);
    border-radius: 6px;
    font-size: 14px;
    font-weight: 500;
    cursor: pointer;
    transition: background-color 0.12s, border-color 0.12s;
    font-family: inherit;
}

.crdm-footer-close:hover[b-c8c1rqts4i] {
    background: rgba(2, 11, 43, 0.04);
    border-color: rgba(2, 11, 43, 0.2);
}
/* _content/Ledgerwise/Components/Modals/CreateChangeOrderModal.razor.rz.scp.css */
/* New Budget Adjustment modal internals.
   Canonicalized 2026-07-21 onto the lw-modal shell; closest reference
   recipes: ledgerwise-ui-app request-adjustment-modal.tsx (640px form
   dialog) and co-summary-modal.tsx (kicker section + dropzone + file rows).
   FieldShell recipe mirrors LwTextField.razor.css / AddInvoiceModal
   .aim-numfield; the Mud autocomplete/numeric/text inputs stay for their
   binding behavior. (The previous searchable-dropdown rules in this file
   were dead: this modal uses MudAutocomplete, and SearchableDropdown owns
   its own scoped css.) */

.cco-loading[b-2bu1iv100j] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 8px;
    padding: 32px 0;
}

.cco-loading-text[b-2bu1iv100j] {
    margin: 0;
    font-size: 14px;
    color: var(--lw-gray-graphite);
}

/* Autocomplete popover items (teleported by MudPopoverProvider, so ::deep
   from the scoped field wrapper cannot reach them -- these classes ride on
   plain elements authored here, which keep the scope attribute). */
.cco-option[b-2bu1iv100j] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
    width: 100%;
}

.cco-option-text[b-2bu1iv100j] {
    display: flex;
    flex-direction: column;
    min-width: 0;
}

.cco-option-name[b-2bu1iv100j] {
    font-size: 14px;
    color: var(--lw-text-primary);
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.cco-option-cat[b-2bu1iv100j] {
    font-size: 12px;
    color: var(--lw-gray-graphite);
}

.cco-option-amount[b-2bu1iv100j] {
    flex-shrink: 0;
    font-size: 14px;
    color: var(--lw-gray-graphite);
    font-variant-numeric: tabular-nums;
}

.cco-option-empty[b-2bu1iv100j] {
    margin: 0;
    padding: 8px 12px;
    font-size: 12px;
    color: var(--lw-gray-space);
}

/* Field hint / character counter under a field (text-xs muted). */
.cco-hint[b-2bu1iv100j] {
    margin: 4px 0 0;
    font-size: 12px;
    color: var(--lw-gray-graphite);
}

/* New-amount preview line; delta semantics per the BA spec: positive
   (budget increase) = destructive red, negative (reduction) = green. */
.cco-preview[b-2bu1iv100j] {
    margin: 6px 0 0;
    font-size: 12px;
    color: var(--lw-text-primary);
}

.cco-preview .cco-delta--up[b-2bu1iv100j] {
    font-weight: var(--lw-font-semibold);
    color: var(--lw-status-error-fg);
}

.cco-preview .cco-delta--down[b-2bu1iv100j] {
    font-weight: var(--lw-font-semibold);
    color: var(--lw-status-success-fg);
}

/* Section kicker (co-summary-modal.tsx). */
.cco-section[b-2bu1iv100j] {
    display: flex;
    flex-direction: column;
}

.cco-kicker[b-2bu1iv100j] {
    margin: 0 0 8px;
    font-size: 12px;
    font-weight: var(--lw-font-bold);
    text-transform: uppercase;
    letter-spacing: 0.025em;
    color: var(--lw-gray-graphite);
}

/* Dropzone (co-summary-modal.tsx recipe: 2px dashed, centered, hover
   brand-accent tint). The wrapper keeps position:relative so MudFileUpload's
   invisible input overlay covers the zone. */
.cco-dropwrap[b-2bu1iv100j] {
    position: relative;
}

.cco-dropzone[b-2bu1iv100j] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 6px;
    width: 100%;
    padding: 24px;
    text-align: center;
    border: 2px dashed var(--lw-border);
    border-radius: var(--lw-radius-control);
    cursor: pointer;
    transition: border-color 0.15s ease, background 0.15s ease;
}

.cco-dropwrap:hover .cco-dropzone[b-2bu1iv100j],
.cco-dropzone.mud-border-primary[b-2bu1iv100j] {
    border-color: color-mix(in srgb, var(--lw-primary-blue) 40%, transparent);
    background: color-mix(in srgb, var(--lw-primary-blue) 5%, transparent);
}

.cco-drop-icon[b-2bu1iv100j] {
    display: inline-flex;
    color: var(--lw-gray-space);
}

.cco-drop-icon[b-2bu1iv100j]  .mud-icon-root { width: 24px; height: 24px; }

.cco-drop-text[b-2bu1iv100j] {
    font-size: 14px;
    color: var(--lw-gray-space);
}

.cco-drop-hint[b-2bu1iv100j] {
    font-size: 12px;
    color: var(--lw-gray-space);
}

/* Selected file rows. */
.cco-files[b-2bu1iv100j] {
    display: flex;
    flex-direction: column;
    gap: 4px;
    margin-top: 8px;
}

.cco-file[b-2bu1iv100j] {
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 8px 12px;
    border: 1px solid var(--lw-border);
    border-radius: var(--lw-radius-control);
}

.cco-file-icon[b-2bu1iv100j] {
    display: inline-flex;
    flex-shrink: 0;
    color: var(--lw-gray-graphite);
}

.cco-file-icon[b-2bu1iv100j]  .mud-icon-root { width: 1rem; height: 1rem; }

.cco-file-name[b-2bu1iv100j] {
    flex: 1;
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    font-size: 14px;
    font-weight: var(--lw-font-medium);
    color: var(--lw-text-primary);
}

.cco-file-size[b-2bu1iv100j] {
    flex-shrink: 0;
    font-size: 12px;
    color: var(--lw-gray-space);
}

.cco-file-remove[b-2bu1iv100j] {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 24px;
    height: 24px;
    flex-shrink: 0;
    border: 0;
    background: none;
    padding: 0;
    border-radius: var(--lw-radius-control);
    color: var(--lw-gray-graphite);
    cursor: pointer;
    transition: background 0.15s ease, color 0.15s ease;
}

.cco-file-remove:hover:not(:disabled)[b-2bu1iv100j] {
    background: var(--lw-status-error-bg);
    color: var(--lw-destructive);
}

.cco-file-remove:disabled[b-2bu1iv100j] {
    opacity: 0.5;
    cursor: default;
}

.cco-file-remove[b-2bu1iv100j]  .mud-icon-root { width: 0.875rem; height: 0.875rem; }

/* -- FieldShell chrome for the Mud inputs (recipe: LwTextField.razor.css /
   .aim-numfield, 2026-07-08 spec). -- */

.cco-field[b-2bu1iv100j]  .mud-input-helper-text {
    font-family: var(--lw-font-family);
    font-size: 13px;
    line-height: 18px;
    margin-top: 4px;
}

.cco-field[b-2bu1iv100j]  .mud-input-control {
    margin-top: 0;
}

.cco-field[b-2bu1iv100j]  .mud-input-outlined {
    font-size: 14px;
    font-weight: 400;
    background-color: var(--lw-white);
    border-radius: var(--lw-radius-control);
}

.cco-field[b-2bu1iv100j]  .mud-input-outlined input.mud-input-slot {
    height: 54px;
    box-sizing: border-box;
    padding: 16px 14px;
    font-size: 14px;
    font-weight: 400;
    /* 16 + 22 + 16 = 54 -- centers the text block exactly like FieldShell. */
    line-height: 22px;
}

/* Multiline shell (textarea-field.tsx): auto-height box, min 96px, py-3;
   zero Mud's inset-label margin reserve. */
.cco-field--area[b-2bu1iv100j]  .mud-input.mud-input-outlined textarea.mud-input-slot {
    box-sizing: border-box;
    min-height: 96px;
    margin-top: 0;
    padding: 12px 14px;
    font-size: 14px;
    font-weight: 400;
    line-height: 1.625;
}

/* Start adornment ($) hugs the value; trim the input's left pad so the pair
   still reads as one 14px-inset text block. */
.cco-field[b-2bu1iv100j]  .mud-input-adornment-start + input.mud-input-slot {
    padding-left: 6px;
}

.cco-field[b-2bu1iv100j]  .mud-input-adornment-text {
    font-size: 14px;
    color: var(--lw-gray-graphite);
}

.cco-field[b-2bu1iv100j]  .mud-input-label {
    font-size: 14px;
    font-weight: 400;
    line-height: 22px;
    letter-spacing: normal;
    color: var(--lw-gray-space);
}

/* Resting label geometrically centered in the 54px box (FieldShell: left
   13px). Mud's padding is !important, so ours must be too. */
.cco-field[b-2bu1iv100j]  .mud-input-label-outlined {
    top: 50%;
    transform: translate(13px, -50%) scale(1);
    padding: 0 2px !important;
    transition: top 0.2s cubic-bezier(0, 0, 0.2, 1), transform 0.2s cubic-bezier(0, 0, 0.2, 1), color 0.2s;
}

/* Multiline shell: the label centers against the first line, not the box. */
.cco-field--area[b-2bu1iv100j]  .mud-input-label-outlined {
    top: 23px;
}

/* Floated label: mirror Mud's shrink/focus selectors (4-class specificity);
   12px like FieldShell text-xs (scale 12/14 = .857). */
.cco-field[b-2bu1iv100j]  .mud-shrink ~ label.mud-input-label.mud-input-label-inputcontrol.mud-input-label-outlined,
.cco-field[b-2bu1iv100j]  .mud-input:focus-within ~ label.mud-input-label.mud-input-label-inputcontrol.mud-input-label-outlined {
    top: 0;
    transform: translate(13px, -6px) scale(0.857);
}

.cco-field[b-2bu1iv100j]  .mud-shrink ~ label.mud-input-label.mud-input-label-inputcontrol.mud-input-label-outlined {
    color: var(--lw-gray-graphite);
}

/* Focused wins over floated (declared last at equal specificity). */
.cco-field[b-2bu1iv100j]  .mud-input:focus-within ~ label.mud-input-label.mud-input-label-inputcontrol.mud-input-label-outlined {
    color: var(--lw-gray-phantom);
}

/* Border states -- FieldShell: rest --lw-input-border 1px; hover no change;
   focus 1px foreground (phantom). */
.cco-field[b-2bu1iv100j]  .mud-input.mud-input-outlined:not(.mud-disabled):not(:focus-within):hover .mud-input-outlined-border {
    border-color: var(--lw-input-border);
}

.cco-field[b-2bu1iv100j]  .mud-input.mud-input-outlined:focus-within > .mud-input-outlined-border,
.cco-field[b-2bu1iv100j]  .mud-input.mud-input-outlined:focus-within .mud-shrink > .mud-input-outlined-border {
    border-width: 1px;
    border-color: var(--lw-gray-phantom);
}

/* Autocomplete caret / clear adornments: quiet gray like the LwSelect caret. */
.cco-field[b-2bu1iv100j]  .mud-input-adornment .mud-icon-button,
.cco-field[b-2bu1iv100j]  .mud-icon-button-edge-end {
    color: var(--lw-gray-space);
}
/* _content/Ledgerwise/Components/Modals/DocumentViewerModal.razor.rz.scp.css */
/* Document viewer internals. Source: ledgerwise-app
   molecules/document-preview.tsx (measured 2026-07-20): preview surface on
   the drafting-table dot grid (radial-gradient foreground 5% dots, 16px
   grid); image reads as a bordered white sheet with the card shadow. */

/* Header file-type glyph next to the title. */
.dvm-fticon[b-ox80tpqkoj] { display: inline-flex; color: var(--lw-gray-graphite); }
.dvm-fticon[b-ox80tpqkoj]  .mud-icon-root { width: 1.25rem; height: 1.25rem; }

/* Preview surface: dot-grid drafting backdrop. */
.dvm-surface[b-ox80tpqkoj] {
    position: relative;
    min-height: 75vh;
    height: 75vh;
    overflow: auto;
    background-color: var(--lw-white);
    background-image: radial-gradient(color-mix(in srgb, var(--lw-text-primary) 5%, transparent) 1.5px, transparent 1.5px);
    background-size: 16px 16px;
    border: 1px solid var(--lw-border);
    border-radius: var(--lw-radius-control);
}

.dvm-imagewrap[b-ox80tpqkoj] {
    display: flex;
    min-height: 100%;
    padding: 24px;
}

.dvm-image[b-ox80tpqkoj] {
    margin: auto;
    max-width: 100%;
    max-height: 70vh;
    object-fit: contain;
    border: 1px solid var(--lw-border);
    border-radius: var(--lw-radius-control);
    background: var(--lw-white);
    box-shadow: var(--lw-shadow-card);
}

.dvm-iframe[b-ox80tpqkoj] {
    width: 100%;
    height: 100%;
    min-height: 75vh;
    border: none;
}

.dvm-loading-overlay[b-ox80tpqkoj] {
    position: absolute;
    inset: 0;
    z-index: 1;
    display: flex;
    align-items: center;
    justify-content: center;
    background: rgba(255, 255, 255, 0.85);
}

/* Error / no-preview states: medallion + copy + CTA (reference DocsEmptyState
   anatomy). */
.dvm-state[b-ox80tpqkoj] {
    display: flex;
    flex-direction: column;
    align-items: center;
    text-align: center;
    gap: 6px;
    padding: 64px 24px;
}

.dvm-state-medallion[b-ox80tpqkoj] {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 56px;
    height: 56px;
    margin-bottom: 12px;
    border-radius: 9999px;
    background: var(--lw-bg-muted);
    color: var(--lw-gray-space);
}

.dvm-state-medallion--warning[b-ox80tpqkoj] {
    background: var(--lw-status-warning-bg);
    color: var(--lw-status-warning-fg);
}

.dvm-state-medallion[b-ox80tpqkoj]  .mud-icon-root { width: 1.75rem; height: 1.75rem; }

.dvm-state-title[b-ox80tpqkoj] {
    margin: 0;
    font-size: 1rem;
    font-weight: var(--lw-font-semibold);
    color: var(--lw-text-primary);
}

.dvm-state-sub[b-ox80tpqkoj] {
    margin: 0;
    font-size: 0.875rem;
    color: var(--lw-gray-graphite);
}

.dvm-state .lw-page-action[b-ox80tpqkoj] { margin-top: 12px; }
/* _content/Ledgerwise/Components/Modals/DrawRequestApprovalModal.razor.rz.scp.css */
/* Owner payment request review sheet. Source: ledgerwise-ui-app
   organisms/payment-request-detail-drawer.tsx (owner wiring) +
   molecules/budget-impact-summary.tsx + atoms/stacked-progress-bar.tsx
   (measured 2026-07-20): near-fullscreen bottom sheet (100dvh - 48px, 12px
   top radius, muted shell) with white header/footer bands and a centered
   62rem column of ControlCards. Footer: Close + navy Review & Approve. */

/* -- Backdrop + slide-up bottom sheet -- */
.dra-backdrop[b-wr6i9fr767] {
    position: fixed;
    inset: 0;
    z-index: var(--lw-z-sheet-backdrop);
    background: var(--lw-scrim);
    backdrop-filter: var(--lw-scrim-blur);
    -webkit-backdrop-filter: var(--lw-scrim-blur);
    opacity: 0;
    transition: opacity 0.2s ease;
}

.dra-backdrop.dra-open[b-wr6i9fr767] {
    opacity: 1;
}

.dra-sheet[b-wr6i9fr767] {
    position: fixed;
    left: 0;
    right: 0;
    bottom: 0;
    z-index: var(--lw-z-sheet);
    height: calc(100dvh - 48px);
    background: var(--lw-bg-muted);
    border-top-left-radius: 12px;
    border-top-right-radius: 12px;
    display: flex;
    flex-direction: column;
    overflow: hidden;
    transform: translateY(100%);
    transition: transform 0.3s cubic-bezier(0.22, 1, 0.36, 1);
    box-shadow: 0 -4px 32px rgba(0, 0, 0, 0.15);
}

.dra-sheet.dra-open[b-wr6i9fr767] {
    transform: translateY(0);
}

.dra-sheet.dra-exit[b-wr6i9fr767] {
    transform: translateY(100%);
    transition: transform 0.25s cubic-bezier(0.4, 0, 1, 1);
}

/* -- Header band -- */
.dra-header[b-wr6i9fr767] {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    flex-shrink: 0;
    padding: 1rem 1.5rem;
    background: var(--lw-white);
    border-bottom: 1px solid var(--lw-border);
    border-top-left-radius: 4px;
    border-top-right-radius: 4px;
}

.dra-header-left[b-wr6i9fr767] {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    flex: 1;
    min-width: 0;
}

.dra-pr-num[b-wr6i9fr767] {
    font-size: 1.125rem;
    font-weight: 700;
    color: var(--lw-text-primary);
    margin: 0;
    font-family: var(--lw-font-family);
    white-space: nowrap;
}

/* Status chip: square corners, 8/2 padding, 11px bold uppercase. */
.dra-status[b-wr6i9fr767] {
    display: inline-flex;
    align-items: center;
    padding: 0.125rem 0.5rem;
    font-size: 11px;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.02em;
    line-height: 1.3;
    flex-shrink: 0;
}

.dra-status-default[b-wr6i9fr767] { background: var(--lw-bg-muted); color: var(--lw-gray-space); }
.dra-status-info[b-wr6i9fr767]    { background: var(--lw-status-info-bg); color: var(--lw-status-info-fg); }
.dra-status-primary[b-wr6i9fr767] { background: rgba(57, 128, 165, 0.10); color: var(--lw-primary-blue); }
.dra-status-success[b-wr6i9fr767] { background: var(--lw-status-success-bg); color: var(--lw-status-success-fg); }
.dra-status-warning[b-wr6i9fr767] { background: var(--lw-status-warning-bg); color: var(--lw-status-warning-fg); }
.dra-status-error[b-wr6i9fr767]   { background: var(--lw-status-error-bg); color: var(--lw-status-error-fg); }

.dra-header-right[b-wr6i9fr767] {
    display: flex;
    align-items: center;
    gap: 0.25rem;
    flex-shrink: 0;
}

.dra-total[b-wr6i9fr767] {
    font-size: 1.125rem;
    font-weight: 700;
    color: var(--lw-text-primary);
    font-variant-numeric: tabular-nums;
    white-space: nowrap;
    margin-right: 0.5rem;
}

.dra-nav-btn[b-wr6i9fr767],
.dra-close[b-wr6i9fr767] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 32px;
    height: 32px;
    background: transparent;
    border: none;
    cursor: pointer;
    color: var(--lw-gray-graphite);
    transition: color 0.15s;
}

.dra-nav-btn:hover:not(:disabled)[b-wr6i9fr767],
.dra-close:hover:not(:disabled)[b-wr6i9fr767] {
    color: var(--lw-text-primary);
}

.dra-nav-btn:disabled[b-wr6i9fr767] { opacity: 0.3; cursor: default; }
.dra-close:disabled[b-wr6i9fr767] { opacity: 0.45; cursor: not-allowed; }

.dra-nav-count[b-wr6i9fr767] {
    min-width: 32px;
    text-align: center;
    font-size: 0.75rem;
    color: var(--lw-gray-graphite);
    font-variant-numeric: tabular-nums;
}

.dra-nav-divider[b-wr6i9fr767] {
    width: 1px;
    height: 20px;
    margin: 0 0.25rem;
    background: var(--lw-border);
}

/* -- Scrollable content: bare ControlCard column on the muted shell -- */
.dra-body[b-wr6i9fr767] {
    flex: 1;
    min-height: 0;
    overflow-y: auto;
    padding: 1.5rem 2rem;
}

@media (min-width: 1024px) {
    .dra-body[b-wr6i9fr767] {
        padding: 1.5rem 3rem;
    }
}

.dra-content[b-wr6i9fr767] {
    width: 100%;
    max-width: 62rem;
    margin: 0 auto;
    display: flex;
    flex-direction: column;
    gap: 1.25rem;
}

/* -- Fund control: this request against the whole project (US-478) --
   Three figures over one share bar, mirroring page 3 of the Patriot owner progress
   report attached to the work item. The middle figure is the one being decided, so it
   is the only one tinted; the outer two are context. */
.dra-fund[b-wr6i9fr767] {
    display: flex;
    flex-direction: column;
    gap: 1rem;
}

.dra-fund-figures[b-wr6i9fr767] {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 0;
}

.dra-fund-fig[b-wr6i9fr767] {
    display: flex;
    flex-direction: column;
    gap: 0.25rem;
    padding: 0 1rem;
    border-left: 1px solid var(--lw-border);
    min-width: 0;
}

.dra-fund-fig:first-child[b-wr6i9fr767] {
    padding-left: 0;
    border-left: none;
}

.dra-fund-label[b-wr6i9fr767] {
    font-size: 0.6875rem;
    font-weight: 600;
    line-height: 1.2;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    color: var(--lw-gray-graphite);
    white-space: nowrap;
}

.dra-fund-val[b-wr6i9fr767] {
    font-family: var(--lw-font-family-heading);
    font-size: 1.375rem;
    font-weight: 700;
    line-height: 1.1;
    letter-spacing: -0.02em;
    color: var(--lw-primary-dark);
    font-variant-numeric: tabular-nums;
}

/* The amount under review reads in the same brand accent as its bar segment. */
.dra-fund-fig--this .dra-fund-val[b-wr6i9fr767] {
    color: var(--lw-primary-blue);
}

.dra-fund-meta[b-wr6i9fr767] {
    font-size: 0.6875rem;
    color: var(--lw-gray-space);
}

@media (max-width: 599px) {
    /* Three currency columns do not fit; drop to two and let the rules fall away. */
    .dra-fund-figures[b-wr6i9fr767] {
        grid-template-columns: 1fr 1fr;
        gap: 0.75rem 0;
    }

    .dra-fund-fig:nth-child(odd)[b-wr6i9fr767] {
        padding-left: 0;
        border-left: none;
    }

    .dra-fund-val[b-wr6i9fr767] {
        font-size: 1.125rem;
    }
}

/* -- The work: one expandable row per invoice -- */
.dra-invoice-list[b-wr6i9fr767] {
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
}

.dra-invoice-item[b-wr6i9fr767] {
    border: 1px solid var(--lw-border);
    border-radius: var(--lw-radius-control, 8px);
    background: var(--lw-white);
    overflow: hidden;
}

.dra-invoice-item--open[b-wr6i9fr767] {
    border-color: color-mix(in srgb, var(--lw-primary-blue) 35%, var(--lw-border));
}

.dra-invoice-row[b-wr6i9fr767] {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    padding: 0.75rem;
    cursor: pointer;
    transition: background 0.12s;
}

.dra-invoice-row:hover[b-wr6i9fr767] {
    background: rgba(145, 158, 171, 0.08);
}

/* 32px squircle org avatar (reference Avatar entity="org"). */
.dra-vendor-avatar[b-wr6i9fr767] {
    flex-shrink: 0;
    width: 32px;
    height: 32px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border-radius: var(--lw-radius-control, 8px);
    font-size: 12px;
    font-weight: 600;
    letter-spacing: 0.04em;
    text-transform: uppercase;
    font-family: var(--lw-font-family);
    color: var(--lw-white);
}

.dra-vendor-warm[b-wr6i9fr767]   { background: var(--lw-avatar-warm-bg); color: var(--lw-avatar-warm-fg); }
.dra-vendor-blue[b-wr6i9fr767]   { background: var(--lw-avatar-blue-bg); color: var(--lw-white); }
.dra-vendor-green[b-wr6i9fr767]  { background: var(--lw-avatar-green-bg); color: var(--lw-white); }
.dra-vendor-purple[b-wr6i9fr767] { background: var(--lw-avatar-purple-bg); color: var(--lw-white); }
.dra-vendor-amber[b-wr6i9fr767]  { background: var(--lw-avatar-amber-bg); color: var(--lw-avatar-warm-fg); }
.dra-vendor-default[b-wr6i9fr767]{ background: var(--lw-gray-graphite); color: var(--lw-white); }

/* Vendor over scope: the vendor names who is being paid, the scope says what for.
   Both truncate rather than wrap so every row keeps one height. */
.dra-invoice-identity[b-wr6i9fr767] {
    flex: 1;
    min-width: 0;
    display: flex;
    flex-direction: column;
    gap: 2px;
}

.dra-vendor-name[b-wr6i9fr767] {
    margin: 0;
    font-size: 0.875rem;
    font-weight: 600;
    color: var(--lw-text-primary);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.dra-invoice-scope[b-wr6i9fr767] {
    margin: 0;
    font-size: 0.75rem;
    line-height: 1.35;
    color: var(--lw-gray-graphite);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

/* .dra-invoice-num removed with the row that carried it (US-478): the invoice number is
   no longer the row's subtitle -- the scope sentence is, and the number only appears as a
   fallback when extraction produced no description. */

/* Per-invoice status chip (owner-friendly labels). */
.dra-inv-status[b-wr6i9fr767] {
    display: inline-flex;
    align-items: center;
    flex-shrink: 0;
    padding: 0.125rem 0.375rem;
    border-radius: var(--lw-radius-control, 8px);
    font-size: 11px;
    font-weight: 600;
    white-space: nowrap;
}

.dra-inv-status-info[b-wr6i9fr767]    { background: var(--lw-status-info-bg); color: var(--lw-status-info-fg); }
.dra-inv-status-primary[b-wr6i9fr767] { background: rgba(57, 128, 165, 0.10); color: var(--lw-primary-blue); }
.dra-inv-status-success[b-wr6i9fr767] { background: var(--lw-status-success-bg); color: var(--lw-status-success-fg); }
.dra-inv-status-warning[b-wr6i9fr767] { background: var(--lw-status-warning-bg); color: var(--lw-status-warning-fg); }
.dra-inv-status-error[b-wr6i9fr767]   { background: var(--lw-status-error-bg); color: var(--lw-status-error-fg); }

.dra-invoice-amount[b-wr6i9fr767] {
    flex-shrink: 0;
    font-size: 0.875rem;
    font-weight: 600;
    color: var(--lw-text-primary);
    font-variant-numeric: tabular-nums;
}

/* Leading disclosure control, matched to the canonical invoice-row expander in
   DrawRequestSubmitModal (.drs-expand-btn / .drs-expand-chev): a 24px button on the
   left, chevron pointing right when closed and down when open. Keeping the two in
   step matters because the GC and the owner are looking at the same invoice rows. */
.dra-expand-btn[b-wr6i9fr767] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    width: 24px;
    height: 24px;
    background: transparent;
    border: none;
    cursor: pointer;
    color: var(--lw-gray-graphite);
}

.dra-expand-btn:hover[b-wr6i9fr767] {
    color: var(--lw-text-primary);
}

.dra-expand-chev[b-wr6i9fr767] {
    transform: rotate(-90deg);
    transition: transform 0.2s ease;
}

.dra-expand-chev--open[b-wr6i9fr767] {
    transform: rotate(0deg);
}

/* -- Expanded body: the allocation mini-table --
   Structure follows the canonical .drs-alloc in DrawRequestSubmitModal (header row,
   category grouping, right-aligned amount column, total rule) so the GC and the owner
   read the same allocations the same way.

   Metrics are NOT copied from it: .drs-alloc is a dense editable GC modal, and its
   26px control and 8px padding read cramped on this spacious owner review sheet.
   Measured instead from ledgerwise-ui-app payment-request-detail-drawer.tsx (the
   expanded region at px-4 pb-4) + budget-impact-summary.tsx (card body p-4 md:p-5,
   line items text-sm, category text-sm font-semibold) + ui/button.tsx size
   "action-sm" (h-9, rounded-md, px-4, 13px) -- 2026-08-02. */
.dra-alloc[b-wr6i9fr767] {
    display: flex;
    flex-direction: column;
    border-top: 1px solid var(--lw-border);
    background: color-mix(in srgb, var(--lw-bg-muted) 50%, transparent);
    padding: 1rem;
}

@media (min-width: 768px) {
    .dra-alloc[b-wr6i9fr767] {
        padding: 1.25rem;
    }
}

/* The plain-English scope, in full. Sits above the table as the lead, since it is the
   thing the owner came here to read. */
.dra-alloc-desc[b-wr6i9fr767] {
    margin: 0 0 0.875rem;
    font-size: 0.875rem;
    line-height: 1.6;
    color: var(--lw-text-primary);
}

.dra-alloc-head[b-wr6i9fr767] {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    padding-bottom: 0.5rem;
    border-bottom: 1px solid color-mix(in srgb, var(--lw-border) 60%, transparent);
    font-size: 11px;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    color: var(--lw-gray-space);
}

.dra-alloc-head-name[b-wr6i9fr767] { flex: 1; }
.dra-alloc-head-amt[b-wr6i9fr767] { width: 120px; text-align: right; }

.dra-alloc-cat-label[b-wr6i9fr767] {
    padding: 0.75rem 0 0.25rem;
    font-size: 0.875rem;
    font-weight: 600;
    color: var(--lw-text-primary);
}

.dra-alloc-row[b-wr6i9fr767] {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    /* Flush left, not indented under the category (Cody, 2026-08-02): the category
       label is already a heading and the indent made the line read as a sub-item of
       a list rather than a row of the table. */
    padding: 0.375rem 0;
}

.dra-alloc-li[b-wr6i9fr767] {
    flex: 1;
    min-width: 0;
    font-size: 0.875rem;
    line-height: 1.45;
    color: var(--lw-gray-graphite);
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.dra-alloc-amt[b-wr6i9fr767] {
    flex-shrink: 0;
    width: 120px;
    text-align: right;
    font-size: 0.875rem;
    font-weight: 500;
    color: var(--lw-text-primary);
    font-variant-numeric: tabular-nums;
}

.dra-alloc-total[b-wr6i9fr767] {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    margin-top: 0.625rem;
    padding-top: 0.625rem;
    border-top: 1px solid color-mix(in srgb, var(--lw-border) 60%, transparent);
}

.dra-alloc-total-label[b-wr6i9fr767] {
    flex: 1;
    font-size: 0.875rem;
    font-weight: 600;
    color: var(--lw-text-primary);
}

.dra-alloc-total-amt[b-wr6i9fr767] {
    width: 120px;
    text-align: right;
    font-size: 0.875rem;
    font-weight: 700;
    color: var(--lw-text-primary);
    font-variant-numeric: tabular-nums;
}

.dra-alloc-empty[b-wr6i9fr767] {
    margin: 0;
    font-size: 0.875rem;
    color: var(--lw-gray-space);
}

.dra-alloc-actions[b-wr6i9fr767] {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: 0.875rem;
    margin-top: 1rem;
    padding-top: 0.875rem;
    border-top: 1px solid color-mix(in srgb, var(--lw-border) 60%, transparent);
}

.dra-alloc-docs[b-wr6i9fr767] {
    font-size: 0.75rem;
    color: var(--lw-gray-space);
}

/* Reference ui/button.tsx size "action-sm": h-9 rounded-md px-4 text-[13px]. */
.dra-alloc-open-btn[b-wr6i9fr767] {
    flex-shrink: 0;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    height: 36px;
    padding: 0 1rem;
    background: var(--lw-white);
    border: 1px solid var(--lw-border);
    border-radius: var(--lw-radius-control, 8px);
    color: var(--lw-text-primary);
    font-family: var(--lw-font-family);
    font-size: 13px;
    font-weight: 500;
    cursor: pointer;
    transition: background 0.15s, border-color 0.15s;
}

.dra-alloc-open-btn:hover[b-wr6i9fr767] {
    background: var(--lw-bg-muted);
    border-color: color-mix(in srgb, var(--lw-primary-blue) 40%, var(--lw-border));
}

.dra-empty-row[b-wr6i9fr767] {
    margin: 0;
    padding: 1rem 0;
    text-align: center;
    font-size: 0.875rem;
    color: var(--lw-gray-space);
}

/* -- Budget Adjustment callout (warning-tint summary card) -- */
.dra-ba-callout[b-wr6i9fr767] {
    border: 1px solid color-mix(in srgb, var(--lw-status-warning-fg) 30%, transparent);
    border-radius: var(--lw-radius-lg, 4px);
    background: var(--lw-status-warning-bg);
    padding: 0.85rem 1rem;
}

.dra-ba-callout-head[b-wr6i9fr767] {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    gap: 1rem;
}

.dra-ba-callout-title[b-wr6i9fr767] {
    font-weight: 700;
    font-size: 0.875rem;
    color: var(--lw-text-primary);
}

.dra-ba-callout-sub[b-wr6i9fr767] {
    margin-top: 0.15rem;
    font-size: 0.8125rem;
    color: var(--lw-gray-graphite);
}

.dra-ba-callout-amt[b-wr6i9fr767] {
    font-weight: 700;
    white-space: nowrap;
    font-variant-numeric: tabular-nums;
    color: var(--lw-text-primary);
}

.dra-ba-callout-amt--warn[b-wr6i9fr767] { color: var(--lw-status-warning-fg); }

.dra-ba-callout-items[b-wr6i9fr767] {
    margin-top: 0.6rem;
    border-top: 1px solid color-mix(in srgb, var(--lw-status-warning-fg) 25%, transparent);
    padding-top: 0.5rem;
    display: flex;
    flex-direction: column;
    gap: 0.35rem;
}

.dra-ba-callout-item[b-wr6i9fr767] {
    display: flex;
    justify-content: space-between;
    gap: 1rem;
    font-size: 0.8125rem;
    color: var(--lw-text-primary);
}

.dra-ba-callout-item-amt[b-wr6i9fr767] {
    font-weight: 600;
    white-space: nowrap;
    font-variant-numeric: tabular-nums;
}

.dra-ba-callout-note[b-wr6i9fr767] {
    margin-top: 0.6rem;
    font-size: 0.8125rem;
    color: var(--lw-gray-graphite);
}

/* -- Budget impact (flush ControlCard body) -- */
.dra-budget-card__body[b-wr6i9fr767] {
    display: flex;
    flex-direction: column;
    gap: 0.75rem;
    padding: 1rem 1.25rem;
}

/* Category card: 4px radius, white, expandable. */
.dra-budget-cat-card[b-wr6i9fr767] {
    position: relative;
    border: 1px solid var(--lw-border);
    border-radius: var(--lw-radius-lg, 4px);
    background: var(--lw-white);
    padding: 0.75rem 1rem;
}

.dra-budget-row-head[b-wr6i9fr767] {
    display: flex;
    align-items: center;
    gap: 0.375rem;
    width: 100%;
}

.dra-budget-row-head--clickable[b-wr6i9fr767] { cursor: pointer; }

.dra-budget-chev[b-wr6i9fr767] {
    flex-shrink: 0;
    color: var(--lw-gray-graphite);
    transition: transform 0.15s ease;
}

.dra-budget-chev--open[b-wr6i9fr767] { transform: rotate(90deg); }

.dra-budget-cat[b-wr6i9fr767] {
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    font-size: 0.875rem;
    font-weight: 600;
    color: var(--lw-text-primary);
}

.dra-budget-cat-total[b-wr6i9fr767] {
    margin-left: auto;
    flex-shrink: 0;
    font-size: 0.875rem;
    color: var(--lw-gray-graphite);
    font-variant-numeric: tabular-nums;
}

/* Stacked bar: 20px pill; prior (brand blue), this PR (gold), remaining
   (tracking grey). Inline labels at 10px. */
.dra-budget-bar[b-wr6i9fr767] {
    display: flex;
    width: 100%;
    height: 20px;
    margin-top: 0.5rem;
    border-radius: 9999px;
    overflow: hidden;
    background: var(--lw-gray-smoke, #d3d6e0);
}

.dra-bar-prior[b-wr6i9fr767],
.dra-bar-thispr[b-wr6i9fr767],
.dra-bar-remain[b-wr6i9fr767] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    height: 100%;
    transition: width 0.3s ease;
    overflow: hidden;
}

.dra-bar-prior[b-wr6i9fr767]  { background: var(--lw-primary-blue, #3980a5); }
.dra-bar-thispr[b-wr6i9fr767] { background: var(--lw-primary-gold, #EEB66F); }
.dra-bar-remain[b-wr6i9fr767] { background: var(--lw-gray-smoke, #d3d6e0); }

.dra-bar-prior span[b-wr6i9fr767],
.dra-bar-thispr span[b-wr6i9fr767],
.dra-bar-remain span[b-wr6i9fr767] {
    font-size: 10px;
    font-weight: 500;
    line-height: 1;
    white-space: nowrap;
}

.dra-bar-prior span[b-wr6i9fr767]  { color: var(--lw-white); }
.dra-bar-thispr span[b-wr6i9fr767] { color: var(--lw-primary-dark, #020B2B); }
.dra-bar-remain span[b-wr6i9fr767] { color: var(--lw-gray-space); }

/* Expanded line items */
.dra-budget-lineitems[b-wr6i9fr767] {
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
    margin-top: 0.75rem;
}

.dra-li-card[b-wr6i9fr767] {
    border: 1px solid color-mix(in srgb, var(--lw-border-solid, #dfe3e8) 60%, transparent);
    border-radius: var(--lw-radius-control, 8px);
    background: color-mix(in srgb, var(--lw-bg-muted) 20%, transparent);
    padding: 0.75rem;
}

.dra-li-card--adjusted[b-wr6i9fr767] {
    border-left: 2px solid var(--lw-primary-blue, #3980a5);
}

.dra-li-head[b-wr6i9fr767] {
    display: flex;
    align-items: center;
    gap: 0.375rem;
}

.dra-li-name[b-wr6i9fr767] {
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    font-size: 0.875rem;
    font-weight: 500;
    color: var(--lw-text-primary);
}

.dra-li-badge[b-wr6i9fr767] {
    flex-shrink: 0;
    padding: 0.125rem 0.375rem;
    border-radius: var(--lw-radius-control, 8px);
    background: var(--lw-status-info-bg);
    color: var(--lw-status-info-fg);
    font-size: 11px;
    font-weight: 600;
}

.dra-li-budget[b-wr6i9fr767] {
    margin-left: auto;
    flex-shrink: 0;
    font-size: 0.875rem;
    color: var(--lw-gray-graphite);
    font-variant-numeric: tabular-nums;
}

.dra-li-budget-tag[b-wr6i9fr767] {
    margin-left: 0.25rem;
    font-size: 11px;
    font-weight: 500;
    color: var(--lw-status-info-fg);
}

/* Stat cells: Prior / This PR / Remaining|Adjustment */
.dra-stat-grid[b-wr6i9fr767] {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 0.5rem;
    margin-top: 0.625rem;
}

.dra-stat-cell[b-wr6i9fr767] {
    border: 1px solid color-mix(in srgb, var(--lw-border-solid, #dfe3e8) 60%, transparent);
    border-radius: var(--lw-radius-control, 8px);
    background: var(--lw-white);
    padding: 0.375rem 0.625rem;
}

.dra-stat-label[b-wr6i9fr767] {
    font-size: 11px;
    color: var(--lw-gray-graphite);
}

.dra-stat-val[b-wr6i9fr767] {
    margin-top: 0.125rem;
    font-size: 13px;
    font-weight: 600;
    color: var(--lw-text-primary);
    font-variant-numeric: tabular-nums;
}

.dra-stat-val--warning[b-wr6i9fr767] { color: var(--lw-status-warning-fg); }
.dra-stat-val--over[b-wr6i9fr767]    { color: var(--lw-destructive); }

/* Inline BA detail: Original / New / Adjustment rows */
.dra-ba-detail[b-wr6i9fr767] {
    margin-top: 0.75rem;
    border: 1px solid var(--lw-border);
    border-radius: var(--lw-radius-control, 8px);
    background: var(--lw-white);
    padding: 0.75rem;
    display: flex;
    flex-direction: column;
    gap: 0.375rem;
}

.dra-ba-detail-row[b-wr6i9fr767] {
    display: flex;
    justify-content: space-between;
    gap: 1rem;
    font-size: 0.875rem;
    color: var(--lw-gray-graphite);
}

.dra-ba-detail-row--total[b-wr6i9fr767] {
    border-top: 1px solid var(--lw-border);
    padding-top: 0.375rem;
    font-weight: 600;
    color: var(--lw-text-primary);
}

.dra-ba-detail-val[b-wr6i9fr767] {
    font-variant-numeric: tabular-nums;
    color: var(--lw-text-primary);
}

.dra-ba-related[b-wr6i9fr767] { margin-top: 0.75rem; }

.dra-ba-related-label[b-wr6i9fr767] {
    display: block;
    font-size: 11px;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.04em;
    color: var(--lw-gray-graphite);
}

.dra-ba-related-row[b-wr6i9fr767] {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    margin-top: 0.375rem;
    border: 1px solid var(--lw-border);
    border-radius: var(--lw-radius-control, 8px);
    background: var(--lw-white);
    padding: 0.625rem;
}

.dra-ba-related-info[b-wr6i9fr767] { min-width: 0; }

.dra-ba-related-name[b-wr6i9fr767] {
    margin: 0;
    font-size: 0.875rem;
    font-weight: 500;
    color: var(--lw-text-primary);
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.dra-ba-related-num[b-wr6i9fr767] {
    margin: 0;
    font-size: 0.75rem;
    color: var(--lw-gray-graphite);
}

.dra-ba-reason[b-wr6i9fr767] {
    margin: 0.75rem 0 0;
    font-size: 0.875rem;
    font-style: italic;
    color: var(--lw-gray-graphite);
}

/* Hover tooltip: dark card pinned above the bar on category hover/focus. */
.dra-tooltip-wrap[b-wr6i9fr767] { position: relative; }

.dra-tooltip[b-wr6i9fr767] {
    position: absolute;
    left: 50%;
    bottom: calc(100% + 6px);
    transform: translateX(-50%);
    z-index: 20;
    display: none;
    flex-direction: column;
    gap: 0.25rem;
    min-width: 190px;
    border: 1px solid var(--lw-border);
    border-radius: var(--lw-radius-control, 8px);
    background: var(--lw-gray-arsenic, #40424d);
    box-shadow: 0 8px 16px rgba(2, 11, 43, 0.24);
    padding: 0.625rem 0.75rem;
    pointer-events: none;
}

.dra-tooltip-wrap:hover .dra-tooltip[b-wr6i9fr767],
.dra-tooltip-wrap:focus-within .dra-tooltip[b-wr6i9fr767] {
    display: flex;
}

.dra-tooltip-row[b-wr6i9fr767] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    font-size: 0.75rem;
}

.dra-tooltip-row-total[b-wr6i9fr767] {
    border-top: 1px solid rgba(255, 255, 255, 0.2);
    padding-top: 0.25rem;
    margin-top: 0.125rem;
}

.dra-tooltip-key[b-wr6i9fr767] {
    display: inline-flex;
    align-items: center;
    gap: 0.375rem;
    color: rgba(255, 255, 255, 0.7);
}

.dra-tooltip-sq[b-wr6i9fr767] {
    display: inline-block;
    width: 8px;
    height: 8px;
    flex-shrink: 0;
}

.dra-tooltip-val[b-wr6i9fr767] {
    font-weight: 500;
    font-variant-numeric: tabular-nums;
    color: var(--lw-white);
}

/* Show more/less */
.dra-show-more[b-wr6i9fr767] {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 0.25rem;
    width: 100%;
    padding: 0.5rem 0;
    border: none;
    background: none;
    font-size: 0.875rem;
    font-weight: 500;
    color: var(--lw-primary-blue);
    cursor: pointer;
    transition: color 0.15s;
    font-family: var(--lw-font-family);
}

.dra-show-more:hover[b-wr6i9fr767] {
    color: color-mix(in srgb, var(--lw-primary-blue) 80%, transparent);
}

.dra-show-more-chev[b-wr6i9fr767] { transition: transform 0.2s ease; }
.dra-show-more-chev--open[b-wr6i9fr767] { transform: rotate(180deg); }

/* -- Error banner -- */
.dra-error[b-wr6i9fr767] {
    padding: 0.75rem;
    background: rgba(220, 38, 38, 0.08);
    border: 1px solid rgba(220, 38, 38, 0.25);
    border-radius: var(--lw-radius-control, 8px);
    color: var(--lw-status-error-fg);
    font-size: 0.8125rem;
}

/* -- Footer band -- */
.dra-footer[b-wr6i9fr767] {
    flex-shrink: 0;
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: 0.75rem;
    padding: 0.75rem 1.5rem;
    background: var(--lw-white);
    border-top: 1px solid var(--lw-border);
}

.dra-btn-close[b-wr6i9fr767] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    height: 36px;
    padding: 0 1.25rem;
    background: var(--lw-white);
    border: 1px solid var(--lw-border);
    border-radius: var(--lw-radius-control, 8px);
    box-shadow: var(--lw-shadow-card);
    cursor: pointer;
    font-size: 0.875rem;
    font-weight: 500;
    color: var(--lw-text-primary);
    font-family: var(--lw-font-family);
    transition: background 0.15s;
}

.dra-btn-close:hover:not(:disabled)[b-wr6i9fr767] {
    background: var(--lw-accent, rgba(145, 158, 171, 0.16));
}

.dra-btn-close:disabled[b-wr6i9fr767] { opacity: 0.45; cursor: not-allowed; }

.dra-btn-approve[b-wr6i9fr767] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    height: 36px;
    padding: 0 1.25rem;
    background: var(--lw-primary-dark, #020B2B);
    color: var(--lw-white);
    border: none;
    border-radius: var(--lw-radius-control, 8px);
    cursor: pointer;
    font-size: 0.875rem;
    font-weight: 500;
    font-family: var(--lw-font-family);
    transition: background 0.15s;
}

.dra-btn-approve:hover:not(:disabled)[b-wr6i9fr767] {
    background: color-mix(in srgb, var(--lw-primary-dark, #020B2B) 90%, transparent);
}

.dra-btn-approve:active[b-wr6i9fr767] { transform: translateY(1px); }
.dra-btn-approve:disabled[b-wr6i9fr767] { opacity: 0.5; cursor: not-allowed; }

.dra-readonly-note[b-wr6i9fr767] {
    font-size: 0.8125rem;
    color: var(--lw-gray-graphite);
}
/* _content/Ledgerwise/Components/Modals/DrawRequestReviewModal.razor.rz.scp.css */
/* Payment-request review modal. Split-pane anatomy per the reference
   inbox-assign drawer (ledgerwise-app organisms/inbox-assign-drawer.tsx,
   2026-07-20): details column beside a muted document-viewer pane; cards on
   rounded-card border + shadow-card; 12/16px meta typography. */

.drr-split[b-9chyujtqyu] {
    display: flex;
    height: calc(100vh - 160px);
}

.drr-left[b-9chyujtqyu] {
    flex: 0 0 42%;
    overflow-y: auto;
    border-right: 1px solid var(--lw-border);
    padding: 16px;
}

.drr-title[b-9chyujtqyu] {
    margin: 0 0 2px;
    font-family: var(--lw-font-family);
    font-size: 1rem;
    font-weight: var(--lw-font-bold);
    color: var(--lw-text-primary);
}

.drr-subtitle[b-9chyujtqyu] {
    margin: 0 0 16px;
    font-size: 0.875rem;
    color: var(--lw-gray-graphite);
}

.drr-section-title[b-9chyujtqyu] {
    margin: 0 0 12px;
    font-family: var(--lw-font-family);
    font-size: 0.875rem;
    font-weight: var(--lw-font-semibold);
    color: var(--lw-text-primary);
}

/* Card shell (budget impact) */
.drr-card[b-9chyujtqyu] {
    margin-bottom: 16px;
    border: 1px solid var(--lw-border);
    border-radius: var(--lw-radius-card);
    background: var(--lw-white);
    box-shadow: var(--lw-shadow-card);
    overflow: hidden;
}

.drr-card-head[b-9chyujtqyu] {
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 12px 16px;
    border-bottom: 1px solid var(--lw-border);
}

.drr-card-head[b-9chyujtqyu]  .drr-card-icon { width: 1rem; height: 1rem; color: var(--lw-primary-blue); }

.drr-card-title[b-9chyujtqyu] {
    font-size: 0.875rem;
    font-weight: var(--lw-font-semibold);
    color: var(--lw-text-primary);
}

.drr-card-body[b-9chyujtqyu] { padding: 12px 16px; }

/* Per-line budget impact block */
.drr-impact[b-9chyujtqyu] { padding: 8px 0; }
.drr-impact + .drr-impact[b-9chyujtqyu] { border-top: 1px solid var(--lw-border); }

.drr-impact-head[b-9chyujtqyu] {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 12px;
    margin-bottom: 8px;
}

.drr-impact-names[b-9chyujtqyu] { display: flex; flex-direction: column; min-width: 0; }
.drr-impact-line[b-9chyujtqyu] { font-size: 0.875rem; font-weight: var(--lw-font-semibold); color: var(--lw-text-primary); }
.drr-impact-cat[b-9chyujtqyu] { font-size: 0.75rem; color: var(--lw-gray-graphite); }

.drr-impact-track[b-9chyujtqyu] {
    height: 6px;
    width: 100%;
    overflow: hidden;
    border-radius: 9999px;
    background: var(--lw-border);
    margin-bottom: 8px;
}

.drr-impact-fill[b-9chyujtqyu] { height: 100%; border-radius: 9999px; background: var(--lw-success-dark, #2D7A5F); }

.drr-impact-grid[b-9chyujtqyu] {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 8px;
}

.drr-impact-cell[b-9chyujtqyu] { display: flex; flex-direction: column; gap: 2px; min-width: 0; }
.drr-impact-label[b-9chyujtqyu] { font-size: 0.75rem; color: var(--lw-gray-graphite); }
.drr-impact-value[b-9chyujtqyu] { font-size: 0.875rem; font-weight: var(--lw-font-semibold); font-variant-numeric: tabular-nums; color: var(--lw-text-primary); }
.drr-impact-value--negative[b-9chyujtqyu] { color: var(--lw-destructive); }
.drr-impact-value--positive[b-9chyujtqyu] { color: var(--lw-status-success-fg); }

/* Invoice expansion rows: token chrome over Mud panels */
.drr-panels[b-9chyujtqyu] { border: 1px solid var(--lw-border); border-radius: var(--lw-radius-card); overflow: hidden; box-shadow: var(--lw-shadow-card); }
.drr-panels[b-9chyujtqyu]  .mud-expand-panel { box-shadow: none !important; }
.drr-panels[b-9chyujtqyu]  .mud-expand-panel-header { padding: 12px 16px; }

.drr-inv-names[b-9chyujtqyu] { display: flex; flex-direction: column; min-width: 0; }
.drr-inv-number[b-9chyujtqyu] { font-size: 0.875rem; font-weight: var(--lw-font-semibold); color: var(--lw-text-primary); }
.drr-inv-vendor[b-9chyujtqyu] { font-size: 0.75rem; color: var(--lw-gray-graphite); }
.drr-inv-amount[b-9chyujtqyu] { font-size: 0.875rem; font-weight: var(--lw-font-semibold); font-variant-numeric: tabular-nums; color: var(--lw-text-primary); }

.drr-inv-doccount[b-9chyujtqyu] {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    padding: 2px 8px;
    border-radius: var(--lw-radius-control);
    background: var(--lw-bg-muted);
    font-size: 0.75rem;
    color: var(--lw-gray-graphite);
}

.drr-inv-doccount[b-9chyujtqyu]  .mud-icon-root { width: 0.875rem; height: 0.875rem; }

/* Right: document viewer pane on the muted surface */
.drr-right[b-9chyujtqyu] {
    flex: 1;
    display: flex;
    flex-direction: column;
    min-height: 0;
    background: var(--lw-bg-muted);
}

.drr-right[b-9chyujtqyu]  .drr-viewer-head {
    border-bottom: 1px solid var(--lw-border);
    background: var(--lw-white);
    border-radius: 0;
}

.drr-viewer-body[b-9chyujtqyu] { flex: 1; overflow: auto; min-height: 0; }
/* _content/Ledgerwise/Components/Modals/DrawRequestSubmitModal.razor.rz.scp.css */
/* GC payment request sheet. Source: ledgerwise-ui-app
   organisms/gc/gc-pr-detail-drawer.tsx + molecules/budget-impact-summary.tsx
   + atoms/stacked-progress-bar.tsx (measured 2026-07-20): near-fullscreen
   bottom sheet (100dvh - 48px, 12px top radius, muted shell) with white
   header/footer bands and a centered 62rem column of ControlCards. */

/* -- Backdrop + slide-up bottom sheet -- */
.drs-backdrop[b-u8io5h7lzg] {
    position: fixed;
    inset: 0;
    z-index: var(--lw-z-sheet-backdrop);
    background: var(--lw-scrim);
    backdrop-filter: var(--lw-scrim-blur);
    -webkit-backdrop-filter: var(--lw-scrim-blur);
    opacity: 0;
    transition: opacity 0.2s ease;
}

.drs-backdrop.drs-open[b-u8io5h7lzg] {
    opacity: 1;
}

.drs-sheet[b-u8io5h7lzg] {
    position: fixed;
    left: 0;
    right: 0;
    bottom: 0;
    z-index: var(--lw-z-sheet);
    height: calc(100dvh - 48px);
    background: var(--lw-bg-muted);
    border-top-left-radius: 12px;
    border-top-right-radius: 12px;
    display: flex;
    flex-direction: column;
    overflow: hidden;
    transform: translateY(100%);
    transition: transform 0.3s cubic-bezier(0.22, 1, 0.36, 1);
    box-shadow: 0 -4px 32px rgba(0, 0, 0, 0.15);
}

.drs-sheet.drs-open[b-u8io5h7lzg] {
    transform: translateY(0);
}

.drs-sheet.drs-exit[b-u8io5h7lzg] {
    transform: translateY(100%);
    transition: transform 0.25s cubic-bezier(0.4, 0, 1, 1);
}

/* -- Header -- */
.drs-header[b-u8io5h7lzg] {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    flex-shrink: 0;
    padding: 1rem 1.5rem;
    background: var(--lw-white);
    border-bottom: 1px solid var(--lw-border);
    border-top-left-radius: 4px;
    border-top-right-radius: 4px;
}

.drs-header-left[b-u8io5h7lzg] {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    flex: 1;
    min-width: 0;
}

.drs-pr-num[b-u8io5h7lzg] {
    font-size: 1.125rem;
    font-weight: 700;
    color: var(--lw-text-primary);
    margin: 0;
    font-family: var(--lw-font-family);
    white-space: nowrap;
}

/* Status chip: square corners, 8/2 padding, 11px bold uppercase. */
.drs-status[b-u8io5h7lzg] {
    display: inline-flex;
    align-items: center;
    padding: 0.125rem 0.5rem;
    font-size: 11px;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.02em;
    line-height: 1.3;
    flex-shrink: 0;
}

.drs-status-default[b-u8io5h7lzg] { background: var(--lw-bg-muted); color: var(--lw-gray-space); }
.drs-status-info[b-u8io5h7lzg]    { background: var(--lw-status-info-bg); color: var(--lw-status-info-fg); }
.drs-status-primary[b-u8io5h7lzg] { background: rgba(57, 128, 165, 0.10); color: var(--lw-primary-blue); }
.drs-status-success[b-u8io5h7lzg] { background: var(--lw-status-success-bg); color: var(--lw-status-success-fg); }
.drs-status-warning[b-u8io5h7lzg] { background: var(--lw-status-warning-bg); color: var(--lw-status-warning-fg); }
.drs-status-error[b-u8io5h7lzg]   { background: var(--lw-status-error-bg); color: var(--lw-status-error-fg); }

.drs-total[b-u8io5h7lzg] {
    margin-left: auto;
    font-size: 1.125rem;
    font-weight: 700;
    color: var(--lw-text-primary);
    font-variant-numeric: tabular-nums;
    white-space: nowrap;
}

.drs-header-right[b-u8io5h7lzg] {
    display: flex;
    align-items: center;
    gap: 0.25rem;
    flex-shrink: 0;
}

.drs-nav-btn[b-u8io5h7lzg],
.drs-close[b-u8io5h7lzg] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 32px;
    height: 32px;
    background: transparent;
    border: none;
    cursor: pointer;
    color: var(--lw-gray-graphite);
    transition: color 0.15s;
}

.drs-nav-btn:hover:not(:disabled)[b-u8io5h7lzg],
.drs-close:hover[b-u8io5h7lzg] {
    color: var(--lw-text-primary);
}

.drs-nav-btn:disabled[b-u8io5h7lzg] {
    opacity: 0.3;
    cursor: default;
}

.drs-nav-index[b-u8io5h7lzg] {
    min-width: 32px;
    text-align: center;
    font-size: 0.75rem;
    color: var(--lw-gray-graphite);
    font-variant-numeric: tabular-nums;
}

.drs-nav-divider[b-u8io5h7lzg] {
    width: 1px;
    height: 20px;
    margin: 0 0.25rem;
    background: var(--lw-border);
}

/* -- Scrollable content: bare ControlCard column on the muted shell -- */
.drs-body[b-u8io5h7lzg] {
    flex: 1;
    min-height: 0;
    overflow-y: auto;
    padding: 1.5rem 2rem;
}

@media (min-width: 1024px) {
    .drs-body[b-u8io5h7lzg] {
        padding: 1.5rem 3rem;
    }
}

.drs-content[b-u8io5h7lzg] {
    width: 100%;
    max-width: 62rem;
    margin: 0 auto;
    display: flex;
    flex-direction: column;
    gap: 1.25rem;
}

/* -- Details metadata grid -- */
.drs-meta-grid[b-u8io5h7lzg] {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 1rem 1.5rem;
}

.drs-meta-cell[b-u8io5h7lzg] {
    min-width: 0;
}

.drs-meta-cell--wide[b-u8io5h7lzg] {
    grid-column: 1 / -1;
}

.drs-meta-label[b-u8io5h7lzg] {
    font-size: 0.75rem;
    color: var(--lw-gray-space);
}

.drs-meta-val[b-u8io5h7lzg] {
    margin-top: 0.125rem;
    font-size: 0.875rem;
    font-weight: 500;
    color: var(--lw-text-primary);
    font-variant-numeric: tabular-nums;
}

.drs-meta-val--normal[b-u8io5h7lzg] {
    font-weight: 400;
    font-variant-numeric: normal;
    line-height: 1.45;
}

/* -- Budget impact: expandable category cards + stacked bar -- */
.drs-bi[b-u8io5h7lzg] {
    display: flex;
    flex-direction: column;
    gap: 0.75rem;
    padding: 1rem 1.25rem;
}

.drs-bi-cat[b-u8io5h7lzg] {
    border: 1px solid var(--lw-border);
    border-radius: var(--lw-radius-lg, 4px);
    background: var(--lw-white);
    padding: 0.75rem 1rem;
}

.drs-bi-cat-head[b-u8io5h7lzg] {
    display: flex;
    align-items: center;
    gap: 0.375rem;
    width: 100%;
    cursor: pointer;
}

.drs-bi-chev[b-u8io5h7lzg] {
    flex-shrink: 0;
    color: var(--lw-gray-graphite);
    transition: transform 0.15s ease;
}

.drs-bi-chev--open[b-u8io5h7lzg] {
    transform: rotate(90deg);
}

.drs-bi-cat-name[b-u8io5h7lzg] {
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    font-size: 0.875rem;
    font-weight: 600;
    color: var(--lw-text-primary);
}

.drs-bi-ba[b-u8io5h7lzg] {
    flex-shrink: 0;
    padding: 0.125rem 0.375rem;
    border-radius: var(--lw-radius-control, 8px);
    background: var(--lw-status-info-bg);
    color: var(--lw-status-info-fg);
    font-size: 11px;
    font-weight: 600;
}

.drs-bi-cat-amt[b-u8io5h7lzg] {
    margin-left: auto;
    flex-shrink: 0;
    font-size: 0.875rem;
    color: var(--lw-gray-graphite);
    font-variant-numeric: tabular-nums;
}

.drs-bi-cat-adj[b-u8io5h7lzg] {
    margin-left: 0.25rem;
    font-size: 11px;
    font-weight: 500;
    color: var(--lw-status-info-fg);
}

/* Stacked bar: 20px pill; prior (brand blue), this PR (gold), over
   (translucent blue), remaining (tracking grey). */
.drs-bi-bar[b-u8io5h7lzg] {
    display: flex;
    width: 100%;
    height: 20px;
    margin-top: 0.5rem;
    border-radius: 9999px;
    overflow: hidden;
    background: var(--lw-gray-smoke, #d3d6e0);
}

.drs-bi-seg[b-u8io5h7lzg] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    height: 100%;
    transition: width 0.3s ease;
}

.drs-bi-seg--prior[b-u8io5h7lzg]  { background: var(--lw-primary-blue, #3980a5); }
.drs-bi-seg--this[b-u8io5h7lzg]   { background: var(--lw-primary-gold, #EEB66F); }
.drs-bi-seg--over[b-u8io5h7lzg]   { background: rgba(53, 116, 184, 0.3); }
.drs-bi-seg--remain[b-u8io5h7lzg] { background: var(--lw-gray-smoke, #d3d6e0); }

.drs-bi-seg-label[b-u8io5h7lzg] {
    font-size: 10px;
    font-weight: 500;
    line-height: 1;
    color: var(--lw-primary-dark, #020B2B);
    white-space: nowrap;
}

/* Expanded line items */
.drs-bi-items[b-u8io5h7lzg] {
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
    margin-top: 0.75rem;
}

.drs-bi-item[b-u8io5h7lzg] {
    border: 1px solid color-mix(in srgb, var(--lw-border-solid, #dfe3e8) 60%, transparent);
    border-radius: var(--lw-radius-control, 8px);
    background: color-mix(in srgb, var(--lw-bg-muted) 20%, transparent);
    padding: 0.75rem;
}

.drs-bi-item--ba[b-u8io5h7lzg] {
    border-left: 2px solid var(--lw-primary-blue, #3980a5);
}

.drs-bi-item-head[b-u8io5h7lzg] {
    display: flex;
    align-items: center;
    gap: 0.375rem;
}

.drs-bi-item-name[b-u8io5h7lzg] {
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    font-size: 0.875rem;
    font-weight: 500;
    color: var(--lw-text-primary);
}

.drs-bi-item-amt[b-u8io5h7lzg] {
    margin-left: auto;
    flex-shrink: 0;
    font-size: 0.875rem;
    color: var(--lw-gray-graphite);
    font-variant-numeric: tabular-nums;
}

.drs-bi-stats[b-u8io5h7lzg] {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 0.5rem;
    margin-top: 0.625rem;
}

.drs-bi-stat[b-u8io5h7lzg] {
    border: 1px solid color-mix(in srgb, var(--lw-border-solid, #dfe3e8) 60%, transparent);
    border-radius: var(--lw-radius-control, 8px);
    background: var(--lw-white);
    padding: 0.375rem 0.625rem;
}

.drs-bi-stat-label[b-u8io5h7lzg] {
    display: block;
    font-size: 11px;
    color: var(--lw-gray-graphite);
}

.drs-bi-stat-val[b-u8io5h7lzg] {
    display: block;
    margin-top: 0.125rem;
    font-size: 13px;
    font-weight: 600;
    color: var(--lw-text-primary);
    font-variant-numeric: tabular-nums;
}

.drs-bi-stat-val--warn[b-u8io5h7lzg] { color: var(--lw-status-warning-fg); }
.drs-bi-stat-val--neg[b-u8io5h7lzg]  { color: var(--lw-destructive); }

/* Show more/less */
.drs-bi-more[b-u8io5h7lzg] {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 0.25rem;
    width: 100%;
    padding: 0.5rem 0;
    border: none;
    background: none;
    font-size: 0.875rem;
    font-weight: 500;
    color: var(--lw-primary-blue);
    cursor: pointer;
    transition: color 0.15s;
}

.drs-bi-more:hover[b-u8io5h7lzg] {
    color: color-mix(in srgb, var(--lw-primary-blue) 80%, transparent);
}

.drs-bi-more-chev[b-u8io5h7lzg] {
    transition: transform 0.2s ease;
}

.drs-bi-more-chev--open[b-u8io5h7lzg] {
    transform: rotate(180deg);
}

/* -- Included invoices -- */
.drs-count-badge[b-u8io5h7lzg] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 18px;
    height: 18px;
    padding: 0 0.375rem;
    border-radius: var(--lw-radius-control, 8px);
    background: var(--lw-bg-muted);
    color: var(--lw-gray-graphite);
    font-size: 10px;
    font-weight: 700;
    line-height: 1;
    font-variant-numeric: tabular-nums;
}

.drs-invoice-list[b-u8io5h7lzg] {
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
}

.drs-invoice-card[b-u8io5h7lzg] {
    border: 1px solid var(--lw-border);
    border-radius: var(--lw-radius-control, 8px);
    background: var(--lw-white);
    transition: background 0.12s, border-color 0.12s;
}

.drs-invoice-row[b-u8io5h7lzg] {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    padding: 0.75rem;
    border-radius: var(--lw-radius-control, 8px);
    cursor: pointer;
    transition: background 0.12s;
}

.drs-invoice-row:hover[b-u8io5h7lzg] {
    background: rgba(145, 158, 171, 0.08);
}

.drs-expand-btn[b-u8io5h7lzg] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    width: 24px;
    height: 24px;
    background: transparent;
    border: none;
    cursor: pointer;
    color: var(--lw-gray-graphite);
    transition: color 0.15s;
}

.drs-expand-btn:hover[b-u8io5h7lzg] {
    color: var(--lw-text-primary);
}

.drs-expand-chev[b-u8io5h7lzg] {
    transform: rotate(-90deg);
    transition: transform 0.2s ease;
}

.drs-expand-chev--open[b-u8io5h7lzg] {
    transform: rotate(0deg);
}

.drs-expand-spacer[b-u8io5h7lzg] {
    display: inline-block;
    flex-shrink: 0;
    width: 24px;
    height: 24px;
}

/* 32px squircle avatar (reference org avatar). */
.drs-vendor-avatar[b-u8io5h7lzg] {
    flex-shrink: 0;
    width: 32px;
    height: 32px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border-radius: var(--lw-radius-control, 8px);
    font-size: 12px;
    font-weight: 600;
    letter-spacing: 0.04em;
    text-transform: uppercase;
    font-family: var(--lw-font-family);
    color: var(--lw-white);
}

.drs-vendor-warm[b-u8io5h7lzg]   { background: var(--lw-avatar-warm-bg); color: var(--lw-avatar-warm-fg); }
.drs-vendor-blue[b-u8io5h7lzg]   { background: var(--lw-avatar-blue-bg); color: var(--lw-white); }
.drs-vendor-green[b-u8io5h7lzg]  { background: var(--lw-avatar-green-bg); color: var(--lw-white); }
.drs-vendor-purple[b-u8io5h7lzg] { background: var(--lw-avatar-purple-bg); color: var(--lw-white); }
.drs-vendor-amber[b-u8io5h7lzg]  { background: var(--lw-avatar-amber-bg); color: var(--lw-avatar-warm-fg); }
.drs-vendor-default[b-u8io5h7lzg]{ background: var(--lw-gray-graphite); color: var(--lw-white); }

/* Vendor over scope (US-478): the vendor names who is being paid, the scope says what
   for. Both truncate rather than wrap so every row keeps one height. */
.drs-invoice-info[b-u8io5h7lzg] {
    flex: 1;
    min-width: 0;
    display: flex;
    flex-direction: column;
    gap: 2px;
}

.drs-vendor-name[b-u8io5h7lzg] {
    font-size: 0.875rem;
    font-weight: 600;
    color: var(--lw-text-primary);
    margin: 0;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.drs-invoice-scope[b-u8io5h7lzg] {
    margin: 0;
    font-size: 0.75rem;
    line-height: 1.35;
    color: var(--lw-gray-graphite);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.drs-invoice-num[b-u8io5h7lzg] {
    margin-left: 0.5rem;
    font-size: 0.75rem;
    font-weight: 400;
    color: var(--lw-gray-space);
}

.drs-invoice-amount[b-u8io5h7lzg] {
    flex-shrink: 0;
    font-size: 0.875rem;
    font-weight: 600;
    color: var(--lw-text-primary);
    font-variant-numeric: tabular-nums;
}

/* US-630: quiet pencil on the invoice row; opens the editable invoice sheet. */
.drs-invoice-edit-btn[b-u8io5h7lzg] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    height: 28px;
    min-width: 28px;
    padding: 0;
    background: transparent;
    border: none;
    border-radius: var(--lw-radius-control, 8px);
    cursor: pointer;
    color: var(--lw-gray-graphite);
    transition: background 0.15s, color 0.15s;
}

.drs-invoice-edit-btn:hover[b-u8io5h7lzg] {
    background: rgba(57, 128, 165, 0.08);
    color: var(--lw-primary-blue);
}

/* Two-step remove: idle trashcan arms to a "Confirm?" pill. */
.drs-remove-btn[b-u8io5h7lzg] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 0.375rem;
    flex-shrink: 0;
    height: 28px;
    min-width: 28px;
    padding: 0;
    background: transparent;
    border: none;
    border-radius: var(--lw-radius-control, 8px);
    cursor: pointer;
    color: var(--lw-gray-graphite);
    transition: background 0.15s, color 0.15s;
}

.drs-remove-btn:hover[b-u8io5h7lzg] {
    background: rgba(184, 53, 48, 0.1);
    color: var(--lw-destructive);
}

.drs-remove-btn--armed[b-u8io5h7lzg] {
    padding: 0 0.5rem;
    background: rgba(184, 53, 48, 0.1);
    color: var(--lw-destructive);
    font-size: 0.75rem;
    font-weight: 600;
    font-family: var(--lw-font-family);
}

.drs-remove-btn--armed:hover[b-u8io5h7lzg] {
    background: rgba(184, 53, 48, 0.2);
}

.drs-view-chev[b-u8io5h7lzg] {
    flex-shrink: 0;
    color: var(--lw-gray-graphite);
}

/* US-630: amber chip when an invoice's allocation total no longer matches its amount. */
.drs-mismatch-chip[b-u8io5h7lzg] {
    flex-shrink: 0;
    display: inline-flex;
    align-items: center;
    height: 20px;
    padding: 0 8px;
    border-radius: 999px;
    background: var(--lw-status-warning-bg);
    color: var(--lw-status-warning-fg);
    font-size: 0.6875rem;
    font-weight: 600;
    white-space: nowrap;
}

/* US-630: quiet outline button for entering the allocation editor. */
.drs-alloc-edit-btn[b-u8io5h7lzg] {
    flex-shrink: 0;
    display: inline-flex;
    align-items: center;
    height: 36px;
    padding: 0 1rem;
    background: var(--lw-white);
    border: 1px solid var(--lw-border);
    border-radius: var(--lw-radius-control, 8px);
    color: var(--lw-primary-blue);
    font-size: 0.75rem;
    font-weight: 600;
    font-family: var(--lw-font-family);
    cursor: pointer;
    transition: background 0.15s, border-color 0.15s;
}

.drs-alloc-edit-btn:hover[b-u8io5h7lzg] {
    background: rgba(57, 128, 165, 0.08);
    border-color: rgba(57, 128, 165, 0.4);
}

.drs-alloc-actions[b-u8io5h7lzg] {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: 0.625rem;
    padding-top: 0.5rem;
}

.drs-alloc-mismatch[b-u8io5h7lzg] {
    font-size: 0.75rem;
    font-weight: 600;
    color: var(--lw-status-warning-fg);
}

/* -- Per-invoice allocations (expanded panel) -- */
/* Metrics retuned to the measured reference spec (US-478, 2026-08-02), matching the
   Project Owner sheet's .dra-alloc: 16px body padding, 14px line items and category
   labels, flush rows, 36px inline control. The earlier 8px/12px/26px values were not
   a density decision -- this sheet is the same 62rem ControlCard column on the same
   bottom sheet as the owner's, so they simply read cramped. Source: ledgerwise-ui-app
   payment-request-detail-drawer.tsx + budget-impact-summary.tsx + ui/button.tsx. */
.drs-alloc[b-u8io5h7lzg] {
    display: flex;
    flex-direction: column;
    border-top: 1px solid var(--lw-border);
    background: color-mix(in srgb, var(--lw-bg-muted) 50%, transparent);
    padding: 1rem;
}

.drs-alloc-head[b-u8io5h7lzg] {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    padding-bottom: 0.5rem;
    border-bottom: 1px solid color-mix(in srgb, var(--lw-border) 60%, transparent);
    font-size: 11px;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    color: var(--lw-gray-space);
}

.drs-alloc-head-name[b-u8io5h7lzg] { flex: 1; }
.drs-alloc-head-amt[b-u8io5h7lzg] { width: 120px; text-align: right; }

.drs-alloc-cat-label[b-u8io5h7lzg] {
    padding: 0.75rem 0 0.25rem;
    font-size: 0.875rem;
    font-weight: 600;
    color: var(--lw-text-primary);
}

.drs-alloc-row[b-u8io5h7lzg] {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    padding: 0.375rem 0;
}

.drs-alloc-li[b-u8io5h7lzg] {
    flex: 1;
    min-width: 0;
    font-size: 0.875rem;
    line-height: 1.45;
    color: var(--lw-gray-graphite);
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.drs-alloc-badge[b-u8io5h7lzg] {
    display: inline-flex;
    align-items: center;
    flex-shrink: 0;
    font-size: 10px;
    font-weight: 700;
    color: var(--lw-status-warning-fg);
    background: var(--lw-status-warning-bg);
    border-radius: var(--lw-radius-control, 8px);
    padding: 0.125rem 0.375rem;
    text-transform: uppercase;
    letter-spacing: 0.02em;
}

.drs-alloc-amt[b-u8io5h7lzg] {
    flex-shrink: 0;
    width: 120px;
    text-align: right;
    font-size: 0.875rem;
    font-weight: 500;
    color: var(--lw-text-primary);
    font-variant-numeric: tabular-nums;
}

.drs-alloc-total[b-u8io5h7lzg] {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    margin-top: 0.375rem;
    padding: 0.375rem 0.25rem 0;
    border-top: 1px solid color-mix(in srgb, var(--lw-border-solid, #dfe3e8) 60%, transparent);
}

.drs-alloc-total-label[b-u8io5h7lzg] {
    flex: 1;
    font-size: 11px;
    font-weight: 600;
    color: var(--lw-gray-graphite);
}

.drs-alloc-total-amt[b-u8io5h7lzg] {
    font-size: 0.75rem;
    font-weight: 700;
    color: var(--lw-text-primary);
    font-variant-numeric: tabular-nums;
}

/* -- Empty state -- */
.drs-empty-card[b-u8io5h7lzg] {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 0.75rem;
    padding: 2rem 1rem;
    border: 1px dashed var(--lw-border);
    border-radius: var(--lw-radius-lg, 4px);
    text-align: center;
}

.drs-empty-icon[b-u8io5h7lzg] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 40px;
    height: 40px;
    border-radius: 999px;
    background: var(--lw-bg-muted);
    color: var(--lw-gray-graphite);
}

.drs-empty-title[b-u8io5h7lzg] {
    margin: 0;
    font-size: 0.875rem;
    font-weight: 500;
    color: var(--lw-text-primary);
}

.drs-empty-sub[b-u8io5h7lzg] {
    margin: 0.125rem 0 0;
    font-size: 0.75rem;
    color: var(--lw-gray-space);
}

.drs-empty-cta[b-u8io5h7lzg] {
    display: inline-flex;
    align-items: center;
    gap: 0.375rem;
    height: 32px;
    padding: 0 0.875rem;
    border: none;
    border-radius: var(--lw-radius-control, 8px);
    background: var(--lw-primary-dark, #020B2B);
    color: var(--lw-white);
    font-size: 0.8125rem;
    font-weight: 500;
    font-family: var(--lw-font-family);
    cursor: pointer;
    transition: opacity 0.15s;
}

.drs-empty-cta:hover[b-u8io5h7lzg] {
    opacity: 0.9;
}

/* -- Error banner -- */
.drs-error[b-u8io5h7lzg] {
    padding: 0.75rem;
    background: rgba(220, 38, 38, 0.08);
    border: 1px solid rgba(220, 38, 38, 0.25);
    border-radius: var(--lw-radius-control, 8px);
    color: var(--lw-status-error-fg);
    font-size: 0.8125rem;
}

/* -- Footer -- */
.drs-footer[b-u8io5h7lzg] {
    flex-shrink: 0;
    display: flex;
    align-items: center;
    gap: 0.75rem;
    padding: 0.75rem 1.5rem;
    background: var(--lw-white);
    border-top: 1px solid var(--lw-border);
}

.drs-footer-spacer[b-u8io5h7lzg] {
    flex: 1;
}

.drs-btn-delete[b-u8io5h7lzg] {
    display: inline-flex;
    align-items: center;
    gap: 0.375rem;
    height: 36px;
    padding: 0 1rem;
    background: var(--lw-white);
    border: 1px solid rgba(184, 53, 48, 0.3);
    border-radius: var(--lw-radius-control, 8px);
    cursor: pointer;
    font-size: 0.875rem;
    font-weight: 500;
    color: var(--lw-destructive);
    font-family: var(--lw-font-family);
    transition: background 0.15s;
}

.drs-btn-delete:hover[b-u8io5h7lzg] {
    background: rgba(184, 53, 48, 0.1);
}

.drs-btn-edit[b-u8io5h7lzg] {
    display: inline-flex;
    align-items: center;
    gap: 0.375rem;
    height: 36px;
    padding: 0 1rem;
    background: var(--lw-white);
    border: 1px solid var(--lw-border);
    border-radius: var(--lw-radius-control, 8px);
    cursor: pointer;
    font-size: 0.875rem;
    font-weight: 500;
    color: var(--lw-text-primary);
    font-family: var(--lw-font-family);
    transition: background 0.15s;
}

.drs-btn-edit:hover[b-u8io5h7lzg] {
    background: var(--lw-accent, rgba(145, 158, 171, 0.16));
}

.drs-btn-close[b-u8io5h7lzg] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    height: 36px;
    padding: 0 1.25rem;
    background: var(--lw-white);
    border: 1px solid var(--lw-border);
    border-radius: var(--lw-radius-control, 8px);
    box-shadow: var(--lw-shadow-card);
    cursor: pointer;
    font-size: 0.875rem;
    font-weight: 500;
    color: var(--lw-text-primary);
    font-family: var(--lw-font-family);
    transition: background 0.15s;
}

.drs-btn-close:hover[b-u8io5h7lzg] {
    background: var(--lw-accent, rgba(145, 158, 171, 0.16));
}

.drs-btn-submit[b-u8io5h7lzg] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 0.5rem;
    height: 36px;
    padding: 0 1.25rem;
    background: var(--lw-primary-dark, #020B2B);
    color: var(--lw-white);
    border: none;
    border-radius: var(--lw-radius-control, 8px);
    cursor: pointer;
    font-size: 0.875rem;
    font-weight: 500;
    font-family: var(--lw-font-family);
    transition: background 0.15s;
}

.drs-btn-submit:hover[b-u8io5h7lzg] {
    background: color-mix(in srgb, var(--lw-primary-dark, #020B2B) 90%, transparent);
}

.drs-btn-submit:active[b-u8io5h7lzg] {
    transform: translateY(1px);
}

/* -- Fund control: this request against the whole project (US-478) --
   The same block the Project Owner review leads with (.dra-fund), so both roles open
   on the same orientation. Measured from ledgerwise-ui-app
   payment-request-detail-drawer.tsx + budget-impact-summary.tsx, 2026-08-02. */
.drs-fund[b-u8io5h7lzg] {
    display: flex;
    flex-direction: column;
    gap: 1rem;
}

.drs-fund-figures[b-u8io5h7lzg] {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 0;
}

.drs-fund-fig[b-u8io5h7lzg] {
    display: flex;
    flex-direction: column;
    gap: 0.25rem;
    padding: 0 1rem;
    border-left: 1px solid var(--lw-border);
    min-width: 0;
}

.drs-fund-fig:first-child[b-u8io5h7lzg] {
    padding-left: 0;
    border-left: none;
}

.drs-fund-label[b-u8io5h7lzg] {
    font-size: 0.6875rem;
    font-weight: 600;
    line-height: 1.2;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    color: var(--lw-gray-graphite);
    white-space: nowrap;
}

.drs-fund-val[b-u8io5h7lzg] {
    font-family: var(--lw-font-family-heading);
    font-size: 1.375rem;
    font-weight: 700;
    line-height: 1.1;
    letter-spacing: -0.02em;
    color: var(--lw-primary-dark);
    font-variant-numeric: tabular-nums;
}

/* The amount under review reads in the same brand accent as its bar segment. */
.drs-fund-fig--this .drs-fund-val[b-u8io5h7lzg] {
    color: var(--lw-primary-blue);
}

.drs-fund-meta[b-u8io5h7lzg] {
    font-size: 0.6875rem;
    color: var(--lw-gray-space);
}

@media (max-width: 599px) {
    /* Three currency columns do not fit; drop to two and let the rules fall away. */
    .drs-fund-figures[b-u8io5h7lzg] {
        grid-template-columns: 1fr 1fr;
        gap: 0.75rem 0;
    }

    .drs-fund-fig:nth-child(odd)[b-u8io5h7lzg] {
        padding-left: 0;
        border-left: none;
    }

    .drs-fund-val[b-u8io5h7lzg] {
        font-size: 1.125rem;
    }
}
/* _content/Ledgerwise/Components/Modals/EditClientInlineDialog.razor.rz.scp.css */
/* Field stack per add-contact-dialog.tsx DialogBody (gap-4); name row 3-up,
   email/phone 2-up; footer bleeds out of the 24px LwModalBody padding. */
.dlg-fields[b-ih7sausjym] {
    display: flex;
    flex-direction: column;
    gap: 16px;
}

.dlg-grid3[b-ih7sausjym] {
    display: grid;
    grid-template-columns: 1fr 1fr 1fr;
    gap: 16px;
}

.dlg-grid2[b-ih7sausjym] {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 16px;
}

.dlg-footbleed[b-ih7sausjym] {
    margin: 16px -24px -24px;
}

@media (max-width: 640px) {
    .dlg-grid3[b-ih7sausjym],
    .dlg-grid2[b-ih7sausjym] {
        grid-template-columns: 1fr;
    }
}
/* _content/Ledgerwise/Components/Modals/EditProjectClientUserRoleDialog.razor.rz.scp.css */
/* Edit project-client-user role dialog -- canonical lw-modal internals. */

.epcu-hint[b-ou3u92do38] {
    margin: 12px 0 0;
    font-size: 12px;
    line-height: 17px;
    color: var(--lw-gray-graphite);
}

.epcu-footbleed[b-ou3u92do38] {
    margin: 16px -24px -24px;
}
/* _content/Ledgerwise/Components/Modals/EditTemplateModal.razor.rz.scp.css */
/* BoldSign template editor on the bottom-sheet pattern (reference:
   ContractorRfpDetailModal.razor.css). Backdrop + slide-up sheet with a
   header band (info-tinted edit roundel, per the .rim-roundel recipe) and a
   scrollable body: the iframe stage keeps a usable minimum height, so on
   short viewports the body scrolls instead of squashing the editor. */

/* -- Backdrop -- */
.etm-backdrop[b-cws4u6lbfp] {
    position: fixed;
    inset: 0;
    z-index: var(--lw-z-sheet-backdrop);
    background: var(--lw-scrim);
    backdrop-filter: var(--lw-scrim-blur);
    -webkit-backdrop-filter: var(--lw-scrim-blur);
    opacity: 0;
    transition: opacity 0.2s ease;
}

.etm-backdrop.etm-open[b-cws4u6lbfp] {
    opacity: 1;
}

/* -- Sheet (slide-up panel) -- */
.etm-sheet[b-cws4u6lbfp] {
    position: fixed;
    left: 0;
    right: 0;
    bottom: 0;
    z-index: var(--lw-z-sheet);
    height: calc(100vh - 48px);
    background: var(--lw-white);
    border-top-left-radius: 12px;
    border-top-right-radius: 12px;
    display: flex;
    flex-direction: column;
    overflow: hidden;
    transform: translateY(100%);
    /* easeOutQuint -- smooth deceleration matching the crdm sheet */
    transition: transform 0.4s cubic-bezier(0.22, 1, 0.36, 1);
    will-change: transform;
    box-shadow: 0 -4px 32px rgba(0, 0, 0, 0.15);
    font-family: var(--lw-font-family, sans-serif);
}

.etm-sheet.etm-open[b-cws4u6lbfp] {
    transform: translateY(0);
}

.etm-sheet.etm-exit[b-cws4u6lbfp] {
    transform: translateY(100%);
    transition: transform 0.25s cubic-bezier(0.4, 0, 1, 1);
}

/* -- Header -- */
.etm-header[b-cws4u6lbfp] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 0.875rem 1rem;
    flex-shrink: 0;
    background: var(--lw-white);
    border-bottom: 1px solid var(--lw-border);
    gap: 0.75rem;
}

@media (min-width: 768px) {
    .etm-header[b-cws4u6lbfp] {
        padding: 1rem 1.5rem;
    }
}

.etm-header-left[b-cws4u6lbfp] {
    display: flex;
    align-items: center;
    gap: 0.625rem;
    min-width: 0;
    flex: 1;
}

.etm-title[b-cws4u6lbfp] {
    font-size: 1rem;
    font-weight: 700;
    color: var(--lw-primary-dark, #020B2B);
    margin: 0;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

@media (min-width: 768px) {
    .etm-title[b-cws4u6lbfp] {
        font-size: 1.125rem;
    }
}

.etm-roundel[b-cws4u6lbfp] {
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    width: 32px;
    height: 32px;
    border-radius: 9999px;
    background: var(--lw-status-info-bg);
    color: var(--lw-primary-blue);
}

.etm-roundel[b-cws4u6lbfp]  .mud-icon-root { width: 1rem; height: 1rem; }

.etm-close-btn[b-cws4u6lbfp] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 36px;
    height: 36px;
    flex-shrink: 0;
    border: 0;
    background: transparent;
    color: var(--lw-gray-graphite, #6E7180);
    cursor: pointer;
    border-radius: 6px;
    transition: background-color 0.12s, color 0.12s;
}

.etm-close-btn:hover[b-cws4u6lbfp] {
    background: rgba(2, 11, 43, 0.05);
    color: var(--lw-primary-dark, #020B2B);
}

.etm-close-btn[b-cws4u6lbfp]  .mud-icon-root { width: 18px; height: 18px; font-size: 18px; }

@media (min-width: 768px) {
    .etm-close-btn[b-cws4u6lbfp] {
        width: 32px;
        height: 32px;
    }
}

/* -- Body: scroll container for the iframe stage -- */
.etm-body[b-cws4u6lbfp] {
    display: flex;
    flex-direction: column;
    flex: 1;
    min-height: 0;
    overflow-y: auto;
}

.etm-frame[b-cws4u6lbfp] {
    display: flex;
    flex-direction: column;
    flex: 1;
    /* Keep the embedded editor usable on short viewports: below this the
       body scrolls rather than squashing the BoldSign UI. */
    min-height: 640px;
}

.etm-frame iframe[b-cws4u6lbfp] {
    flex: 1;
    width: 100%;
    border: none;
}
/* _content/Ledgerwise/Components/Modals/ImportLegacyBudgetModal.razor.rz.scp.css */
/* Dialog frame + regions: global .lw-modal (app.css) + LwModalHeader/
   Body/Footer atoms. The old ::deep shell overrides were dead code (the
   dialog teleports to MudDialogProvider, out of scoped-CSS reach). */

/* ── Intro copy ── */
.ilb-intro[b-cow5pmz0k9] {
    margin: 0 0 1rem;
    font-size: 0.875rem;
    line-height: 1.55;
    color: var(--lw-gray-graphite, #6E7180);
}

/* ── Section label ── */
.ilb-section-label[b-cow5pmz0k9] {
    font-family: var(--lw-font-family-heading, sans-serif);
    font-size: 0.75rem;
    font-weight: 600;
    letter-spacing: 0.05em;
    text-transform: uppercase;
    color: var(--lw-gray-graphite, #6E7180);
    margin-bottom: 0.75rem;
}

/* ── Format card (single required-layout panel) ── */
.ilb-format-card[b-cow5pmz0k9] {
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
    padding: 1rem 1.125rem;
    border: 1px solid var(--lw-border, rgba(145, 158, 171, 0.2));
    border-radius: var(--lw-radius-card, 8px);
    background: var(--lw-white, #fff);
}

.ilb-format-card--recommended[b-cow5pmz0k9] {
    border-color: var(--lw-primary-blue, #3980A5);
    box-shadow: var(--lw-shadow-card, 0 6px 10px rgba(2, 11, 43, 0.05));
    background: linear-gradient(180deg, var(--lw-status-primary-bg, rgba(57, 128, 165, 0.10)) 0%, var(--lw-white, #fff) 56%);
}

.ilb-format-card-head[b-cow5pmz0k9] {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 0.5rem;
}

.ilb-format-card-title[b-cow5pmz0k9] {
    font-family: var(--lw-font-family-heading, sans-serif);
    font-size: 0.9375rem;
    font-weight: 600;
    color: var(--lw-primary-dark, #020B2B);
    line-height: 1.25;
}

.ilb-format-card-sub[b-cow5pmz0k9] {
    font-size: 0.75rem;
    color: var(--lw-gray-graphite, #6E7180);
    margin-top: 0.125rem;
}

.ilb-format-card-body[b-cow5pmz0k9] {
    margin: 0;
    font-size: 0.8125rem;
    line-height: 1.5;
    color: var(--lw-gray-graphite, #6E7180);
}

/* ── Drop zone ── */
.ilb-dropzone-wrap[b-cow5pmz0k9] {
    position: relative;
}

.ilb-dropzone-wrap[b-cow5pmz0k9]  .ilb-dropzone {
    width: 100%;
    height: 168px;
    border: 2px dashed var(--lw-input-border, rgba(145, 158, 171, 0.4));
    border-radius: var(--lw-radius-card, 8px);
    background: var(--lw-bg-muted, #f0f3f6);
    cursor: pointer;
    transition: border-color 0.15s, background-color 0.15s;
}

.ilb-dropzone-wrap:hover[b-cow5pmz0k9]  .ilb-dropzone,
.ilb-dropzone-wrap[b-cow5pmz0k9]  .ilb-dropzone.mud-border-primary {
    border-color: var(--lw-primary-blue, #3980A5);
    background: var(--lw-form-surface, #fcfdfe);
}

.ilb-dropzone-wrap[b-cow5pmz0k9]  .ilb-dropzone .mud-icon-root {
    font-size: 2.75rem;
    color: var(--lw-gray-space, #9DA2B3);
    transition: color 0.15s;
}

.ilb-dropzone-wrap:hover[b-cow5pmz0k9]  .ilb-dropzone .mud-icon-root,
.ilb-dropzone-wrap[b-cow5pmz0k9]  .ilb-dropzone.mud-border-primary .mud-icon-root {
    color: var(--lw-primary-blue, #3980A5);
}

.ilb-dropzone-primary[b-cow5pmz0k9] {
    font-size: 0.9375rem;
    font-weight: 600;
    color: var(--lw-primary-dark, #020B2B);
    text-align: center;
    padding: 0 1rem;
    word-break: break-word;
}

.ilb-dropzone-caption[b-cow5pmz0k9] {
    font-size: 0.75rem;
    color: var(--lw-gray-graphite, #6E7180);
}

/* ── Preview stat cards ── */
.ilb-stats[b-cow5pmz0k9]  .mud-paper {
    background: var(--lw-bg-muted, #f0f3f6);
    border: 1px solid var(--lw-border, rgba(145, 158, 171, 0.2));
    border-radius: var(--lw-radius-card, 8px);
}
/* _content/Ledgerwise/Components/Modals/ImportSubcontractorsModal.razor.rz.scp.css */
/* Import subcontractors modal -- canonicalized 2026-07-28 (lw-modal shell,
   LwModalHeader/Body/Footer, LwCardNote banners, div lw-table preview).
   Elements are authored in this file and carry the isolation scope
   themselves (the dialog teleports, so ::deep from a page root never
   reaches them). */

.ism-stack[b-y0y0tcijau] {
    display: flex;
    flex-direction: column;
    gap: 12px;
}

.ism-copy[b-y0y0tcijau] {
    margin: 0;
    font-family: var(--lw-font-family);
    font-size: 14px;
    line-height: 20px;
    color: var(--lw-gray-graphite);
}

.ism-note[b-y0y0tcijau] {
    margin: 0;
    font-family: var(--lw-font-family);
    font-size: 12px;
    line-height: 16px;
    color: var(--lw-gray-graphite);
}

.ism-ready[b-y0y0tcijau] {
    display: flex;
    align-items: center;
    gap: 8px;
    flex-wrap: wrap;
    margin-top: 4px;
}

.ism-ready-title[b-y0y0tcijau] {
    font-family: var(--lw-font-family);
    font-size: 13px;
    font-weight: var(--lw-font-semibold);
    color: var(--lw-text-primary);
}

/* -- Tag composer: FieldShell box holding entry chips + an inline input -- */
.ism-tagbox[b-y0y0tcijau] {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 6px;
    min-height: 54px;
    padding: 8px 10px;
    background: var(--lw-white);
    border: 1px solid var(--lw-input-border);
    border-radius: var(--lw-radius-control);
    cursor: text;
    transition: border-color 0.15s ease;
}

.ism-tagbox:focus-within[b-y0y0tcijau] {
    border-color: var(--lw-gray-phantom);
}

.ism-tagbox--disabled[b-y0y0tcijau] {
    opacity: 0.6;
    pointer-events: none;
}

.ism-tag[b-y0y0tcijau] {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    max-width: 100%;
    padding: 4px 6px 4px 10px;
    background: var(--lw-bg-muted);
    border: 1px solid var(--lw-border);
    border-radius: 9999px;
    font-family: var(--lw-font-family);
    font-size: 13px;
    line-height: 18px;
}

.ism-tag--existing[b-y0y0tcijau] {
    background: var(--lw-status-info-bg);
    border-color: transparent;
}

.ism-tag-name[b-y0y0tcijau] {
    font-weight: var(--lw-font-medium);
    color: var(--lw-text-primary);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.ism-tag-email[b-y0y0tcijau] {
    font-size: 12px;
    color: var(--lw-gray-graphite);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.ism-tag-x[b-y0y0tcijau] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 18px;
    height: 18px;
    flex-shrink: 0;
    border: 0;
    padding: 0;
    background: transparent;
    border-radius: 9999px;
    color: var(--lw-gray-graphite);
    cursor: pointer;
    transition: background 0.15s ease, color 0.15s ease;
}

.ism-tag-x:hover:not(:disabled)[b-y0y0tcijau] {
    background: var(--lw-status-error-bg);
    color: var(--lw-destructive);
}

.ism-tag-x svg[b-y0y0tcijau] {
    width: 10px;
    height: 10px;
}

.ism-tag-input[b-y0y0tcijau] {
    flex: 1;
    min-width: 180px;
    border: 0;
    outline: none;
    padding: 4px 4px;
    background: transparent;
    font-family: var(--lw-font-family);
    font-size: 14px;
    line-height: 22px;
    color: var(--lw-text-primary);
}

.ism-tag-input[b-y0y0tcijau]::placeholder {
    color: var(--lw-gray-space);
}

/* Bordered white shell around the div-based lw-table (results view). */
.ism-table-card[b-y0y0tcijau] {
    overflow-x: auto;
    border: 1px solid var(--lw-border);
    border-radius: var(--lw-radius-card);
    background: var(--lw-white);
}

.ism-col-name[b-y0y0tcijau]   { flex: 1 1 180px; }
.ism-col-email[b-y0y0tcijau]  { flex: 1 1 200px; }
.ism-col-result[b-y0y0tcijau] { flex: 1 1 260px; }

.ism-result[b-y0y0tcijau] {
    display: flex;
    align-items: center;
    gap: 8px;
    flex-wrap: wrap;
    min-width: 0;
}
/* _content/Ledgerwise/Components/Modals/InsuranceCertificateModal.razor.rz.scp.css */
/* Insurance certificate modal (US-642). Two-column field grid + selected-file
   row, drawn from the --lw-* tokens like the other lw-modal bodies. */

.icm-grid[b-xp01n3va5i] {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 1rem;
}

.icm-notes[b-xp01n3va5i] {
    margin-top: 1rem;
}

@media (max-width: 599px) {
    .icm-grid[b-xp01n3va5i] {
        grid-template-columns: 1fr;
    }
}

/* Selected-file row shown once a certificate has been picked. */
.icm-file[b-xp01n3va5i] {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    padding: 0.75rem 1rem;
    border: 1px solid var(--lw-border);
    border-radius: var(--lw-radius-control);
    background: var(--lw-bg-muted);
}

.icm-file__icon[b-xp01n3va5i]  .mud-icon-root,
.icm-file[b-xp01n3va5i]  .mud-icon-root {
    color: var(--lw-primary-blue);
}

.icm-file__text[b-xp01n3va5i] {
    flex: 1;
    min-width: 0;
}

.icm-file__name[b-xp01n3va5i] {
    margin: 0;
    font-size: 0.875rem;
    font-weight: 500;
    color: var(--bs-body-color);
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.icm-file__status[b-xp01n3va5i] {
    margin: 0;
    font-size: 0.75rem;
    color: var(--lw-gray-graphite);
}

.icm-file__change[b-xp01n3va5i] {
    border: 1px solid var(--lw-input-border);
    border-radius: var(--lw-radius-control);
    background: #fff;
    color: var(--lw-primary-dark);
    font-size: 0.8125rem;
    font-weight: 500;
    padding: 0.375rem 0.75rem;
    cursor: pointer;
}

.icm-file__change:hover:not(:disabled)[b-xp01n3va5i] {
    background: var(--lw-bg-secondary);
}

.icm-file__change:disabled[b-xp01n3va5i] {
    opacity: 0.6;
    cursor: default;
}

.icm-hint[b-xp01n3va5i] {
    margin: 0;
    font-size: 0.75rem;
    color: var(--lw-gray-graphite);
}
/* _content/Ledgerwise/Components/Modals/InvoiceReviewModal.razor.rz.scp.css */
/* Confirm-invoice bottom sheet. Source: ledgerwise-ui-app
   src/components/organisms/inbox-assign-drawer.tsx on ui/drawer.tsx
   side="sheet" (2026-07-28): white header band with title + pager + live
   amount; 58/42 split of the muted ControlCard form column beside the
   document viewer. Geometry mirrors AddInvoiceModal's review takeover
   (aim-take-*) so the two invoice flows stay in lockstep; the sheet frame
   itself lives in mudblazor-overrides.css (.mud-dialog.irm-sheet). */

/* -- Header band -- */
.irm-take-head[b-hbrauzfnwl] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    height: 56px;
    padding: 0 16px;
    background: var(--lw-white);
    border-bottom: 1px solid var(--lw-border);
    border-top-left-radius: 12px;
    border-top-right-radius: 12px;
}

.irm-take-head-left[b-hbrauzfnwl] { display: flex; align-items: center; gap: 12px; min-width: 0; }
.irm-take-head-right[b-hbrauzfnwl] { display: flex; align-items: center; gap: 12px; flex-shrink: 0; }

.irm-take-title[b-hbrauzfnwl] {
    margin: 0;
    font-family: var(--lw-font-family);
    font-size: 1.125rem;
    font-weight: var(--lw-font-bold);
    color: var(--lw-text-primary);
    white-space: nowrap;
}

.irm-take-pager[b-hbrauzfnwl] { display: flex; align-items: center; gap: 4px; margin-left: 4px; }

.irm-take-nav[b-hbrauzfnwl] {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 32px;
    height: 32px;
    border: none;
    border-radius: 9999px;
    background: none;
    padding: 0;
    color: var(--lw-gray-graphite);
    cursor: pointer;
    transition: background 0.15s ease, color 0.15s ease;
}

.irm-take-nav:hover:not(:disabled)[b-hbrauzfnwl] { background: var(--lw-accent); color: var(--lw-text-primary); }
.irm-take-nav:disabled[b-hbrauzfnwl] { opacity: 0.3; cursor: default; }
.irm-take-nav[b-hbrauzfnwl]  .mud-icon-root { width: 1rem; height: 1rem; }
.irm-take-close[b-hbrauzfnwl]  .mud-icon-root { width: 1.125rem; height: 1.125rem; }

.irm-take-count[b-hbrauzfnwl] {
    font-size: 0.875rem;
    font-weight: var(--lw-font-medium);
    font-variant-numeric: tabular-nums;
    color: var(--lw-text-primary);
}

.irm-take-amount[b-hbrauzfnwl] {
    font-size: 1rem;
    font-weight: var(--lw-font-bold);
    font-variant-numeric: tabular-nums;
    color: var(--lw-text-primary);
}

/* -- Split body over the muted shell -- */
.irm-take[b-hbrauzfnwl] {
    display: flex;
    flex: 1;
    min-height: 0;
    background: var(--lw-bg-muted);
}

.irm-take-form[b-hbrauzfnwl] {
    flex: 0 0 58%;
    min-width: 0;
    overflow-y: auto;
}

.irm-take-form-inner[b-hbrauzfnwl] {
    margin: 0 auto;
    display: flex;
    width: 100%;
    max-width: 760px;
    flex-direction: column;
    gap: 20px;
    padding: 32px;
}

.irm-take-viewer[b-hbrauzfnwl] {
    flex: 1;
    min-width: 0;
    display: flex;
    flex-direction: column;
    border-left: 1px solid var(--lw-border);
    background: var(--lw-bg-muted);
}

.irm-take-iframe[b-hbrauzfnwl] { width: 100%; height: 100%; border: none; display: block; }

.irm-take-viewer-state[b-hbrauzfnwl] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 8px;
    height: 100%;
    text-align: center;
    padding: 24px;
}

/* Loading / not-found states fill the sheet body. */
.irm-take-state[b-hbrauzfnwl] {
    display: flex;
    flex: 1;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 8px;
    min-height: 0;
    padding: 32px;
}

/* -- Form internals -- */
.irm-fields[b-hbrauzfnwl] { display: flex; flex-direction: column; gap: 16px; }

.irm-field-payee[b-hbrauzfnwl] { display: flex; align-items: flex-end; gap: 4px; }
.irm-field-payee-input[b-hbrauzfnwl] { flex: 1; min-width: 0; }

.irm-date-grid[b-hbrauzfnwl] {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 16px;
}

@media (max-width: 639px) {
    .irm-date-grid[b-hbrauzfnwl] { grid-template-columns: 1fr; }
}

.irm-vendor-copy[b-hbrauzfnwl] {
    margin: 0 0 12px;
    font-size: 0.875rem;
    line-height: 1.625;
    color: var(--lw-text-primary);
}

.irm-vendor-actions[b-hbrauzfnwl] { display: flex; align-items: center; gap: 8px; margin-top: 12px; flex-wrap: wrap; }

/* -- FieldShell chrome for the payee SearchableDropdown (the one non-atom
   input; recipe mirrors LwTextField.razor.css, 2026-07-08 spec: 54px white
   box, 8px radius, border --lw-input-border, 14/400 value, muted -> graphite
   -> phantom label states). Its search behavior stays untouched. -- */

.irm-field-payee-input[b-hbrauzfnwl]  .mud-input-helper-text {
    font-family: var(--lw-font-family);
    font-size: 13px;
    line-height: 18px;
    margin-top: 4px;
}

.irm-field-payee-input[b-hbrauzfnwl]  .mud-input-control {
    margin-top: 0;
}

.irm-field-payee-input[b-hbrauzfnwl]  .mud-input-outlined {
    font-size: 14px;
    font-weight: 400;
    background-color: var(--lw-white);
    border-radius: var(--lw-radius-control);
}

.irm-field-payee-input[b-hbrauzfnwl]  .mud-input-outlined input.mud-input-slot {
    height: 54px;
    box-sizing: border-box;
    padding: 16px 14px;
    font-size: 14px;
    font-weight: 400;
    /* 16 + 22 + 16 = 54 -- centers the text block exactly like FieldShell. */
    line-height: 22px;
}

.irm-field-payee-input[b-hbrauzfnwl]  .mud-input-label {
    font-size: 14px;
    font-weight: 400;
    line-height: 22px;
    letter-spacing: normal;
    color: var(--lw-gray-space);
}

/* Resting label geometrically centered in the 54px box (FieldShell: left
   13px). Mud's padding is !important, so ours must be too. */
.irm-field-payee-input[b-hbrauzfnwl]  .mud-input-label-outlined {
    top: 50%;
    transform: translate(13px, -50%) scale(1);
    padding: 0 2px !important;
    transition: top 0.2s cubic-bezier(0, 0, 0.2, 1), transform 0.2s cubic-bezier(0, 0, 0.2, 1), color 0.2s;
}

/* Floated label: mirror Mud's shrink/focus selectors (4-class specificity);
   12px like FieldShell text-xs (scale 12/14 = .857). */
.irm-field-payee-input[b-hbrauzfnwl]  .mud-shrink ~ label.mud-input-label.mud-input-label-inputcontrol.mud-input-label-outlined,
.irm-field-payee-input[b-hbrauzfnwl]  .mud-input:focus-within ~ label.mud-input-label.mud-input-label-inputcontrol.mud-input-label-outlined {
    top: 0;
    transform: translate(13px, -6px) scale(0.857);
}

.irm-field-payee-input[b-hbrauzfnwl]  .mud-shrink ~ label.mud-input-label.mud-input-label-inputcontrol.mud-input-label-outlined {
    color: var(--lw-gray-graphite);
}

/* Focused wins over floated (declared last at equal specificity). */
.irm-field-payee-input[b-hbrauzfnwl]  .mud-input:focus-within ~ label.mud-input-label.mud-input-label-inputcontrol.mud-input-label-outlined {
    color: var(--lw-gray-phantom);
}

/* Border states -- FieldShell: rest --lw-input-border 1px; hover no change;
   focus 1px foreground (phantom). */
.irm-field-payee-input[b-hbrauzfnwl]  .mud-input.mud-input-outlined:not(.mud-disabled):not(:focus-within):hover .mud-input-outlined-border {
    border-color: var(--lw-input-border);
}

.irm-field-payee-input[b-hbrauzfnwl]  .mud-input.mud-input-outlined:focus-within > .mud-input-outlined-border,
.irm-field-payee-input[b-hbrauzfnwl]  .mud-input.mud-input-outlined:focus-within .mud-shrink > .mud-input-outlined-border {
    border-width: 1px;
    border-color: var(--lw-gray-phantom);
}

/* Dropdown caret / clear buttons: gray-space like the LwSelect caret. */
.irm-field-payee-input[b-hbrauzfnwl]  .mud-input-adornment .mud-icon-button,
.irm-field-payee-input[b-hbrauzfnwl]  .mud-icon-button-edge-end {
    color: var(--lw-gray-space);
}

/* -- Footer Delete: destructive outline (reference GC drawer Delete recipe). -- */
.irm-delete[b-hbrauzfnwl] {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    height: 36px;
    padding: 0 16px;
    border: 1px solid color-mix(in srgb, var(--lw-destructive) 30%, transparent);
    border-radius: var(--lw-radius-control);
    background: var(--lw-white);
    color: var(--lw-destructive);
    font-size: 0.875rem;
    font-weight: var(--lw-font-medium);
    cursor: pointer;
    transition: background 0.15s ease;
}

.irm-delete:hover:not(:disabled)[b-hbrauzfnwl] { background: color-mix(in srgb, var(--lw-destructive) 10%, transparent); }
.irm-delete:disabled[b-hbrauzfnwl] { opacity: 0.5; cursor: default; }
.irm-delete[b-hbrauzfnwl]  .mud-icon-root { width: 0.875rem; height: 0.875rem; }
/* _content/Ledgerwise/Components/Modals/OrganizationInviteUserModal.razor.rz.scp.css */
/* ============================================================
   Organization invite modal -- canonical lw-modal composition.
   Source: ledgerwise-ui-app src/components/molecules/
   invite-member-modal.tsx (measured 2026-07-28): 32px info
   roundel in the title, 13px content-secondary explainer,
   stacked fields at 16px rhythm.
   ============================================================ */

.oim-roundel[b-3f1fww2sst] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 32px;
    height: 32px;
    border-radius: 50%;
    background: var(--lw-status-info-bg);
    color: var(--lw-status-info-fg);
    flex-shrink: 0;
}

.oim-roundel[b-3f1fww2sst]  .mud-icon-root {
    font-size: 16px;
    width: 16px;
    height: 16px;
}

.oim-form[b-3f1fww2sst] {
    display: flex;
    flex-direction: column;
    gap: 1rem;
}

.oim-grid2[b-3f1fww2sst] {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 1rem;
}

.oim-copy[b-3f1fww2sst] {
    margin: 0;
    font-size: 0.8125rem;
    line-height: 1.5;
    color: var(--lw-gray-graphite);
}

.oim-copy--hint[b-3f1fww2sst] {
    font-size: 0.75rem;
    line-height: 1rem;
}

.oim-check[b-3f1fww2sst] {
    display: flex;
    flex-direction: column;
    gap: 0.25rem;
}

@media (max-width: 600px) {
    .oim-grid2[b-3f1fww2sst] {
        grid-template-columns: 1fr;
    }
}
/* _content/Ledgerwise/Components/Modals/ProjectDetailsModal.razor.rz.scp.css */
/* ProjectDetailsModal content chrome only -- the dialog frame, header, body,
   and footer regions come from the canonical lw-modal pattern
   (LwModalHeader/Body/Footer atoms + global .lw-modal rules in app.css).
   Label/value read-fields follow the lw-modal-summary label/value type scale
   (13px graphite label, 14px semibold primary value). */

/* Field grid -- preserves the previous MudGrid md="4" three-column rows
   (24px = MudGrid default gutter; 960px = MudBlazor md breakpoint). */
.pdm-grid[b-m8fap481gs] {
    display: grid;
    grid-template-columns: 1fr;
    gap: 16px 24px;
}

@media (min-width: 960px) {
    .pdm-grid[b-m8fap481gs] { grid-template-columns: repeat(3, 1fr); }
}

.pdm-field[b-m8fap481gs] {
    display: flex;
    flex-direction: column;
    gap: 2px;
}

.pdm-label[b-m8fap481gs] {
    font-size: 13px;
    color: var(--lw-gray-graphite);
}

.pdm-value[b-m8fap481gs] {
    font-size: 14px;
    font-weight: var(--lw-font-semibold);
    color: var(--lw-text-primary);
    overflow-wrap: anywhere;
}
/* _content/Ledgerwise/Components/Modals/ProjectDocumentsFullscreenModal.razor.rz.scp.css */
/* Fullscreen document manager -- modal-local layout. Table/breadcrumb chrome
   comes from the shared lw-table.css + lw-doc.css vocabularies. */

.fsm-toolbar[b-ax3y1fh56u] {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
}

.fsm-crumbs[b-ax3y1fh56u] {
    display: flex;
    align-items: center;
    gap: 4px;
    min-width: 0;
}

.fsm-tools[b-ax3y1fh56u] {
    display: flex;
    align-items: center;
    gap: 8px;
    flex: 1 1 auto;
    justify-content: flex-end;
}

/* Global-search autocomplete: wide but bounded (the legacy inline style
   forced 900px which overflowed smaller screens). */
.fsm-search[b-ax3y1fh56u] {
    min-width: 280px;
    max-width: 560px;
    flex: 1 1 auto;
}

/* Attached drop strip under the table. */
.fsm-dropwrap[b-ax3y1fh56u] { position: relative; margin-top: 2px; }

.fsm-dropzone[b-ax3y1fh56u] {
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 12px 16px;
    border: 2px dashed rgba(145, 158, 171, 0.32);
    border-top: none;
    border-radius: 0 0 var(--lw-radius-control) var(--lw-radius-control);
    pointer-events: none;
}

.fsm-dropzone[b-ax3y1fh56u]  .fsm-drop-icon {
    width: 1.125rem;
    height: 1.125rem;
    color: var(--lw-primary-blue);
    opacity: 0.7;
}

.fsm-drop-text[b-ax3y1fh56u] {
    font-size: 0.875rem;
    color: var(--lw-gray-graphite);
    opacity: 0.85;
}
/* _content/Ledgerwise/Components/Modals/ProjectQuickTipsDialog.razor.rz.scp.css */
/* ProjectQuickTipsDialog content chrome only -- the dialog frame, header,
   body, and footer regions come from the canonical lw-modal pattern
   (LwModalHeader/Body/Footer atoms + global .lw-modal rules in app.css).
   Roundel mirrors AcceptProposalModal's .apm-roundel recipe on the warning
   status token pair: 32px pill, 16px glyph. */

.qt-roundel[b-huzbxt0zml] {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 32px; /* apm-roundel reference size */
    height: 32px;
    border-radius: 999px; /* pill */
    background: var(--lw-status-warning-bg);
    color: var(--lw-status-warning-fg);
}

.qt-roundel[b-huzbxt0zml]  .mud-icon-root {
    width: 16px; /* apm-roundel reference glyph size */
    height: 16px;
    font-size: 16px;
}

/* Tips grid -- preserves the previous MudGrid md="4" three-column split
   (24px = MudGrid default gutter; 960px = MudBlazor md breakpoint). */
.qt-grid[b-huzbxt0zml] {
    display: grid;
    grid-template-columns: 1fr;
    gap: 24px;
}

@media (min-width: 960px) {
    .qt-grid[b-huzbxt0zml] { grid-template-columns: repeat(3, 1fr); }
}

/* 12px = the previous MudStack Spacing="3". */
.qt-col[b-huzbxt0zml] {
    display: flex;
    flex-direction: column;
    gap: 12px;
}

.qt-tip-title[b-huzbxt0zml] {
    display: flex;
    align-items: center;
    gap: 6px; /* icon-to-label gap, mirrors the previous mr-1 */
    margin: 0 0 4px;
    font-size: 14px;
    font-weight: 600;
    color: var(--lw-text-primary);
}

.qt-tip-title[b-huzbxt0zml]  .mud-icon-root {
    width: 16px;
    height: 16px;
    font-size: 16px;
    color: var(--lw-primary-blue);
}

.qt-tip-body[b-huzbxt0zml] {
    margin: 0;
    font-size: 13px;
    line-height: 1.5;
    color: var(--lw-gray-graphite);
}

.qt-tip-list[b-huzbxt0zml] {
    margin: 0;
    padding: 0;
    list-style: none;
    display: flex;
    flex-direction: column;
    gap: 6px;
}

.qt-tip-list li[b-huzbxt0zml] {
    font-size: 13px;
    line-height: 1.5;
    color: var(--lw-gray-graphite);
}

.qt-tip-list b[b-huzbxt0zml],
.qt-tip-body b[b-huzbxt0zml] {
    font-weight: 600;
    color: var(--lw-text-primary);
}
/* _content/Ledgerwise/Components/Modals/ProposalReviewModal.razor.rz.scp.css */
/* Confirm-proposal bottom sheet. Source: ledgerwise-ui-app
   src/components/organisms/inbox-assign-drawer.tsx on ui/drawer.tsx
   side="sheet" (2026-07-28): white header band with title + pager + live
   amount; 58/42 split of the muted ControlCard form column beside the
   document viewer. Chrome mirrors InvoiceReviewModal.razor.css (irm-take-*)
   so the two confirm flows stay in lockstep; the sheet frame itself lives in
   mudblazor-overrides.css (.mud-dialog.prm-sheet). */

/* -- Header band -- */
.prm-take-head[b-o51u8f95kx] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    height: 56px;
    padding: 0 16px;
    background: var(--lw-white);
    border-bottom: 1px solid var(--lw-border);
    border-top-left-radius: 12px;
    border-top-right-radius: 12px;
}

.prm-take-head-left[b-o51u8f95kx] { display: flex; align-items: center; gap: 12px; min-width: 0; }
.prm-take-head-right[b-o51u8f95kx] { display: flex; align-items: center; gap: 12px; flex-shrink: 0; }

.prm-take-title[b-o51u8f95kx] {
    margin: 0;
    font-family: var(--lw-font-family);
    font-size: 1.125rem;
    font-weight: var(--lw-font-bold);
    color: var(--lw-text-primary);
    white-space: nowrap;
}

.prm-take-pager[b-o51u8f95kx] { display: flex; align-items: center; gap: 4px; margin-left: 4px; }

.prm-take-nav[b-o51u8f95kx] {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 32px;
    height: 32px;
    border: none;
    border-radius: 9999px;
    background: none;
    padding: 0;
    color: var(--lw-gray-graphite);
    cursor: pointer;
    transition: background 0.15s ease, color 0.15s ease;
}

.prm-take-nav:hover:not(:disabled)[b-o51u8f95kx] { background: var(--lw-accent); color: var(--lw-text-primary); }
.prm-take-nav:disabled[b-o51u8f95kx] { opacity: 0.3; cursor: default; }
.prm-take-nav[b-o51u8f95kx]  .mud-icon-root { width: 1rem; height: 1rem; }
.prm-take-close[b-o51u8f95kx]  .mud-icon-root { width: 1.125rem; height: 1.125rem; }

.prm-take-count[b-o51u8f95kx] {
    font-size: 0.875rem;
    font-weight: var(--lw-font-medium);
    font-variant-numeric: tabular-nums;
    color: var(--lw-text-primary);
}

.prm-take-amount[b-o51u8f95kx] {
    font-size: 1rem;
    font-weight: var(--lw-font-bold);
    font-variant-numeric: tabular-nums;
    color: var(--lw-text-primary);
}

/* -- Split body over the muted shell -- */
.prm-take[b-o51u8f95kx] {
    display: flex;
    flex: 1;
    min-height: 0;
    background: var(--lw-bg-muted);
}

.prm-take-form[b-o51u8f95kx] {
    flex: 0 0 58%;
    min-width: 0;
    overflow-y: auto;
}

.prm-take-form-inner[b-o51u8f95kx] {
    margin: 0 auto;
    display: flex;
    width: 100%;
    max-width: 760px;
    flex-direction: column;
    gap: 20px;
    padding: 32px;
}

.prm-take-viewer[b-o51u8f95kx] {
    flex: 1;
    min-width: 0;
    display: flex;
    flex-direction: column;
    border-left: 1px solid var(--lw-border);
    background: var(--lw-bg-muted);
}

.prm-take-iframe[b-o51u8f95kx] { width: 100%; height: 100%; border: none; display: block; }

.prm-take-viewer-state[b-o51u8f95kx] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 8px;
    height: 100%;
    width: 100%;
    text-align: center;
    padding: 24px;
}

/* Not-found state fills the sheet body. */
.prm-take-state[b-o51u8f95kx] {
    display: flex;
    flex: 1;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 8px;
    min-height: 0;
    padding: 32px;
}

/* -- Loading skeleton: card-shaped shimmer blocks in the real layout
   containers so the slide-up lands against stable geometry. -- */
.prm-skel-card[b-o51u8f95kx] {
    display: flex;
    flex-direction: column;
    gap: 16px;
    padding: 20px;
    background: var(--lw-white);
    border: 1px solid var(--lw-border);
    border-radius: var(--lw-radius-card);
}

.prm-skel-head[b-o51u8f95kx] { display: flex; align-items: center; gap: 12px; }
.prm-skel-head-text[b-o51u8f95kx] { display: flex; flex-direction: column; gap: 6px; }

.prm-skel-grid[b-o51u8f95kx] {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 16px;
}

.prm-take-viewer[b-o51u8f95kx]  .prm-skel-viewer,
.prm-take-viewer-state[b-o51u8f95kx]  .prm-skel-viewer {
    width: 100%;
    height: 100%;
    flex: 1;
}

/* -- Form internals -- */
.prm-fields[b-o51u8f95kx] { display: flex; flex-direction: column; gap: 16px; }

.prm-field-inline[b-o51u8f95kx] { display: flex; align-items: flex-end; gap: 4px; }
.prm-field-inline-input[b-o51u8f95kx] { flex: 1; min-width: 0; }

.prm-date-grid[b-o51u8f95kx] {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 16px;
}

@media (max-width: 639px) {
    .prm-date-grid[b-o51u8f95kx] { grid-template-columns: 1fr; }
}

.prm-vendor-copy[b-o51u8f95kx] {
    margin: 0 0 12px;
    font-size: 0.875rem;
    line-height: 1.625;
    color: var(--lw-text-primary);
}

.prm-vendor-actions[b-o51u8f95kx] { display: flex; align-items: center; gap: 8px; margin-top: 12px; flex-wrap: wrap; }

/* Inline new-RFP panel: form-surface inset so the sub-form reads grouped. */
.prm-newrfp[b-o51u8f95kx] {
    display: flex;
    flex-direction: column;
    gap: 16px;
    padding: 16px;
    background: var(--lw-form-surface);
    border: 1px solid var(--lw-border);
    border-radius: var(--lw-radius-control);
}

.prm-newrfp-title[b-o51u8f95kx] {
    margin: 0;
    font-size: 0.875rem;
    font-weight: var(--lw-font-semibold);
    color: var(--lw-text-primary);
}

.prm-newrfp-cancel[b-o51u8f95kx] {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    align-self: flex-start;
    height: 32px;
    padding: 0 8px;
    border: none;
    border-radius: var(--lw-radius-control);
    background: none;
    color: var(--lw-gray-graphite);
    font-size: 0.8125rem;
    font-weight: var(--lw-font-medium);
    cursor: pointer;
    transition: background 0.15s ease, color 0.15s ease;
}

.prm-newrfp-cancel:hover:not(:disabled)[b-o51u8f95kx] { background: var(--lw-accent); color: var(--lw-text-primary); }
.prm-newrfp-cancel:disabled[b-o51u8f95kx] { opacity: 0.5; cursor: default; }
.prm-newrfp-cancel[b-o51u8f95kx]  .mud-icon-root { width: 0.875rem; height: 0.875rem; }

/* -- FieldShell chrome for the payee SearchableDropdown (the one non-atom
   input; recipe mirrors LwTextField.razor.css, 2026-07-08 spec: 54px white
   box, 8px radius, border --lw-input-border, 14/400 value, muted -> graphite
   -> phantom label states). Its search behavior stays untouched. -- */

.prm-field-payee-input[b-o51u8f95kx]  .mud-input-helper-text {
    font-family: var(--lw-font-family);
    font-size: 13px;
    line-height: 18px;
    margin-top: 4px;
}

.prm-field-payee-input[b-o51u8f95kx]  .mud-input-control {
    margin-top: 0;
}

.prm-field-payee-input[b-o51u8f95kx]  .mud-input-outlined {
    font-size: 14px;
    font-weight: 400;
    background-color: var(--lw-white);
    border-radius: var(--lw-radius-control);
}

.prm-field-payee-input[b-o51u8f95kx]  .mud-input-outlined input.mud-input-slot {
    height: 54px;
    box-sizing: border-box;
    padding: 16px 14px;
    font-size: 14px;
    font-weight: 400;
    /* 16 + 22 + 16 = 54 -- centers the text block exactly like FieldShell. */
    line-height: 22px;
}

.prm-field-payee-input[b-o51u8f95kx]  .mud-input-label {
    font-size: 14px;
    font-weight: 400;
    line-height: 22px;
    letter-spacing: normal;
    color: var(--lw-gray-space);
}

/* Resting label geometrically centered in the 54px box (FieldShell: left
   13px). Mud's padding is !important, so ours must be too. */
.prm-field-payee-input[b-o51u8f95kx]  .mud-input-label-outlined {
    top: 50%;
    transform: translate(13px, -50%) scale(1);
    padding: 0 2px !important;
    transition: top 0.2s cubic-bezier(0, 0, 0.2, 1), transform 0.2s cubic-bezier(0, 0, 0.2, 1), color 0.2s;
}

/* Floated label: mirror Mud's shrink/focus selectors (4-class specificity);
   12px like FieldShell text-xs (scale 12/14 = .857). */
.prm-field-payee-input[b-o51u8f95kx]  .mud-shrink ~ label.mud-input-label.mud-input-label-inputcontrol.mud-input-label-outlined,
.prm-field-payee-input[b-o51u8f95kx]  .mud-input:focus-within ~ label.mud-input-label.mud-input-label-inputcontrol.mud-input-label-outlined {
    top: 0;
    transform: translate(13px, -6px) scale(0.857);
}

.prm-field-payee-input[b-o51u8f95kx]  .mud-shrink ~ label.mud-input-label.mud-input-label-inputcontrol.mud-input-label-outlined {
    color: var(--lw-gray-graphite);
}

/* Focused wins over floated (declared last at equal specificity). */
.prm-field-payee-input[b-o51u8f95kx]  .mud-input:focus-within ~ label.mud-input-label.mud-input-label-inputcontrol.mud-input-label-outlined {
    color: var(--lw-gray-phantom);
}

/* Border states -- FieldShell: rest --lw-input-border 1px; hover no change;
   focus 1px foreground (phantom). */
.prm-field-payee-input[b-o51u8f95kx]  .mud-input.mud-input-outlined:not(.mud-disabled):not(:focus-within):hover .mud-input-outlined-border {
    border-color: var(--lw-input-border);
}

.prm-field-payee-input[b-o51u8f95kx]  .mud-input.mud-input-outlined:focus-within > .mud-input-outlined-border,
.prm-field-payee-input[b-o51u8f95kx]  .mud-input.mud-input-outlined:focus-within .mud-shrink > .mud-input-outlined-border {
    border-width: 1px;
    border-color: var(--lw-gray-phantom);
}

/* Dropdown caret / clear buttons: gray-space like the LwSelect caret. */
.prm-field-payee-input[b-o51u8f95kx]  .mud-input-adornment .mud-icon-button,
.prm-field-payee-input[b-o51u8f95kx]  .mud-icon-button-edge-end {
    color: var(--lw-gray-space);
}

/* -- Footer Delete: destructive outline (reference GC drawer Delete recipe). -- */
.prm-delete[b-o51u8f95kx] {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    height: 36px;
    padding: 0 16px;
    border: 1px solid color-mix(in srgb, var(--lw-destructive) 30%, transparent);
    border-radius: var(--lw-radius-control);
    background: var(--lw-white);
    color: var(--lw-destructive);
    font-size: 0.875rem;
    font-weight: var(--lw-font-medium);
    cursor: pointer;
    transition: background 0.15s ease;
}

.prm-delete:hover:not(:disabled)[b-o51u8f95kx] { background: color-mix(in srgb, var(--lw-destructive) 10%, transparent); }
.prm-delete:disabled[b-o51u8f95kx] { opacity: 0.5; cursor: default; }
.prm-delete[b-o51u8f95kx]  .mud-icon-root { width: 0.875rem; height: 0.875rem; }
/* _content/Ledgerwise/Components/Modals/RejectInvoiceModal.razor.rz.scp.css */
/* Reject-invoice dialog: destructive roundel in the header (reference
   DeleteConfirmationModal anatomy, gc-documents.tsx 2026-07-20). */

.rim-roundel[b-z9fa3lcuwd] {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 32px;
    height: 32px;
    border-radius: 9999px;
    background: var(--lw-status-error-bg);
    color: var(--lw-destructive);
}

.rim-roundel[b-z9fa3lcuwd]  .mud-icon-root { width: 1rem; height: 1rem; }
/* _content/Ledgerwise/Components/Modals/RequestBudgetAdjustmentModal.razor.rz.scp.css */
/* Request Adjustment modal internals.
   Source: ledgerwise-ui-app src/components/molecules/request-adjustment-modal.tsx
   (measured spec 2026-07-20; migrated 2026-07-21). Dialog size=md 640px;
   body space-y-4 (LwModalBody's 16px stack); zebra details table; bordered
   overage summary with destructive highlight row; FieldShell inputs.
   FieldShell recipe mirrors LwTextField.razor.css / AddInvoiceModal
   .aim-numfield (54px white box, radius 8, muted -> graphite -> phantom
   label states); Mud inputs stay for their binding behavior. */

/* Session BA chip (rounded-md bg-brand-accent/10 px-2 py-0.5 text-xs medium). */
.rba-chip[b-vz4dlz71bj] {
    flex-shrink: 0;
    padding: 2px 8px;
    border-radius: var(--lw-radius-control);
    background: color-mix(in srgb, var(--lw-primary-blue) 10%, transparent);
    font-size: 0.75rem;
    font-weight: var(--lw-font-medium);
    color: var(--lw-primary-blue);
    white-space: nowrap;
}

/* Details table: rounded-md border, zebra rows (bg-muted/50 odd over the
   form-surface panel), label left / value right. */
.rba-table[b-vz4dlz71bj] {
    border: 1px solid var(--lw-border);
    border-radius: var(--lw-radius-control);
    overflow: hidden;
}

.rba-table table[b-vz4dlz71bj] {
    width: 100%;
    border-collapse: collapse;
    font-size: 14px;
}

.rba-table tr[b-vz4dlz71bj] {
    border-bottom: 1px solid var(--lw-border);
}

.rba-table tr:last-child[b-vz4dlz71bj] {
    border-bottom: 0;
}

.rba-table tr:nth-child(odd)[b-vz4dlz71bj] {
    background: color-mix(in srgb, var(--lw-bg-muted) 50%, var(--lw-white));
}

.rba-table-label[b-vz4dlz71bj] {
    padding: 8px 12px;
    color: var(--lw-gray-graphite);
    font-weight: var(--lw-font-medium);
    white-space: nowrap;
}

.rba-table-value[b-vz4dlz71bj] {
    padding: 8px 12px;
    text-align: right;
    color: var(--lw-text-primary);
    font-weight: var(--lw-font-medium);
}

/* Overage summary: rounded-md border p-3; text-xs rows; destructive
   highlight row (bg-destructive/10, both sides bold destructive). */
.rba-overage[b-vz4dlz71bj] {
    border: 1px solid var(--lw-border);
    border-radius: var(--lw-radius-control);
    padding: 12px;
}

.rba-overage-row[b-vz4dlz71bj] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
    padding: 2px 0;
    font-size: 12px;
}

.rba-overage-label[b-vz4dlz71bj] {
    color: var(--lw-gray-graphite);
}

.rba-overage-value[b-vz4dlz71bj] {
    font-weight: var(--lw-font-medium);
    font-variant-numeric: tabular-nums;
    color: var(--lw-text-primary);
}

.rba-overage-total[b-vz4dlz71bj] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
    margin-top: 4px;
    padding: 6px 8px;
    border-radius: var(--lw-radius-control);
    background: var(--lw-status-error-bg);
    font-size: 12px;
    font-weight: var(--lw-font-bold);
    color: var(--lw-destructive);
}

.rba-overage-total-value[b-vz4dlz71bj] {
    font-variant-numeric: tabular-nums;
}

/* -- FieldShell chrome for the Mud inputs (recipe: LwTextField.razor.css /
   .aim-numfield, 2026-07-08 spec). -- */

.rba-field[b-vz4dlz71bj]  .mud-input-helper-text {
    font-family: var(--lw-font-family);
    font-size: 13px;
    line-height: 18px;
    margin-top: 4px;
}

.rba-field[b-vz4dlz71bj]  .mud-input-control {
    margin-top: 0;
}

.rba-field[b-vz4dlz71bj]  .mud-input-outlined {
    font-size: 14px;
    font-weight: 400;
    background-color: var(--lw-white);
    border-radius: var(--lw-radius-control);
}

.rba-field[b-vz4dlz71bj]  .mud-input-outlined input.mud-input-slot {
    height: 54px;
    box-sizing: border-box;
    padding: 16px 14px;
    font-size: 14px;
    font-weight: 400;
    /* 16 + 22 + 16 = 54 -- centers the text block exactly like FieldShell. */
    line-height: 22px;
}

/* Multiline shell (textarea-field.tsx): auto-height box, min 96px, py-3;
   zero Mud's inset-label margin reserve. */
.rba-field--area[b-vz4dlz71bj]  .mud-input.mud-input-outlined textarea.mud-input-slot {
    box-sizing: border-box;
    min-height: 96px;
    margin-top: 0;
    padding: 12px 14px;
    font-size: 14px;
    font-weight: 400;
    line-height: 1.625;
}

/* Start adornment ($) hugs the value; trim the input's left pad so the pair
   still reads as one 14px-inset text block. */
.rba-field[b-vz4dlz71bj]  .mud-input-adornment-start + input.mud-input-slot {
    padding-left: 6px;
}

.rba-field[b-vz4dlz71bj]  .mud-input-adornment-text {
    font-size: 14px;
    color: var(--lw-gray-graphite);
}

.rba-field[b-vz4dlz71bj]  .mud-input-label {
    font-size: 14px;
    font-weight: 400;
    line-height: 22px;
    letter-spacing: normal;
    color: var(--lw-gray-space);
}

/* Resting label geometrically centered in the 54px box (FieldShell: left
   13px). Mud's padding is !important, so ours must be too. */
.rba-field[b-vz4dlz71bj]  .mud-input-label-outlined {
    top: 50%;
    transform: translate(13px, -50%) scale(1);
    padding: 0 2px !important;
    transition: top 0.2s cubic-bezier(0, 0, 0.2, 1), transform 0.2s cubic-bezier(0, 0, 0.2, 1), color 0.2s;
}

/* Multiline shell: the label centers against the first line, not the box. */
.rba-field--area[b-vz4dlz71bj]  .mud-input-label-outlined {
    top: 23px;
}

/* Floated label: mirror Mud's shrink/focus selectors (4-class specificity);
   12px like FieldShell text-xs (scale 12/14 = .857). */
.rba-field[b-vz4dlz71bj]  .mud-shrink ~ label.mud-input-label.mud-input-label-inputcontrol.mud-input-label-outlined,
.rba-field[b-vz4dlz71bj]  .mud-input:focus-within ~ label.mud-input-label.mud-input-label-inputcontrol.mud-input-label-outlined {
    top: 0;
    transform: translate(13px, -6px) scale(0.857);
}

.rba-field[b-vz4dlz71bj]  .mud-shrink ~ label.mud-input-label.mud-input-label-inputcontrol.mud-input-label-outlined {
    color: var(--lw-gray-graphite);
}

/* Focused wins over floated (declared last at equal specificity). */
.rba-field[b-vz4dlz71bj]  .mud-input:focus-within ~ label.mud-input-label.mud-input-label-inputcontrol.mud-input-label-outlined {
    color: var(--lw-gray-phantom);
}

/* Border states -- FieldShell: rest --lw-input-border 1px; hover no change;
   focus 1px foreground (phantom). */
.rba-field[b-vz4dlz71bj]  .mud-input.mud-input-outlined:not(.mud-disabled):not(:focus-within):hover .mud-input-outlined-border {
    border-color: var(--lw-input-border);
}

.rba-field[b-vz4dlz71bj]  .mud-input.mud-input-outlined:focus-within > .mud-input-outlined-border,
.rba-field[b-vz4dlz71bj]  .mud-input.mud-input-outlined:focus-within .mud-shrink > .mud-input-outlined-border {
    border-width: 1px;
    border-color: var(--lw-gray-phantom);
}
/* _content/Ledgerwise/Components/Modals/RequestProposalChangeModal.razor.rz.scp.css */
/* RequestProposalChangeModal content chrome only -- dialog frame and regions
   come from the canonical lw-modal pattern (LwModalHeader/Body/Footer).
   Source: organisms/kickoff/request-change-modal.tsx (measured 2026-07-19):
   32px warning-bg roundel w/ 16px warning-fg flag; copy 14/1.625
   content-secondary; textarea = LwTextField Lines=4 (textarea-field.tsx
   shell); footer Cancel outline + primary Send w/ 16px send glyph. */

.rpc-roundel[b-mufzkpsr2d] {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 32px;
    height: 32px;
    border-radius: 999px;
    background: var(--lw-status-warning-bg);
    color: var(--lw-status-warning-fg);
}

.rpc-roundel[b-mufzkpsr2d]  .mud-icon-root {
    width: 16px;
    height: 16px;
    font-size: 16px;
}

.rpc-copy[b-mufzkpsr2d] {
    margin: 0;
    font-size: 0.875rem;
    line-height: 1.625;
    color: var(--lw-gray-graphite);
}

.rpc-error[b-mufzkpsr2d] {
    margin: 6px 0 0;
    font-size: 0.75rem;
    color: var(--lw-destructive);
}
/* _content/Ledgerwise/Components/Modals/RequestRevisionModal.razor.rz.scp.css */
/* Request a revision -- source: ledgerwise-app
   organisms/gc/request-revision-modal.tsx (2026-07-23). Canonical lw-modal
   chrome; only the guidance copy and inline error live here. */

.rrm-copy[b-yteczbuaf8] {
    margin: 0;
    font-size: 14px;
    color: var(--lw-gray-graphite);
}

.rrm-error[b-yteczbuaf8] {
    margin: 0;
    font-size: 12px;
    color: var(--bs-danger, #dc3545);
}
/* _content/Ledgerwise/Components/Modals/RfpDetailModal.razor.rz.scp.css */
/* RFP detail sheet -- source: ledgerwise-app organisms/gc/gc-rfp-detail-drawer.tsx
   (2026-07-23). Full-height bottom sheet (ViewInvoiceModal vocabulary:
   100dvh-48px muted shell, white header band), centered max-w-3xl content
   column, split-pane dot-grid document viewer at md:48% max-680.
   Card anatomy: identity 32px avatar + 14/600 vendor + 12 secondary sub;
   amount 14/600; sectioned by hairlines with the documents band tinted
   muted/40; footer action row (ghost gray revision / destructive-outline
   reject / success-outline accept / accent-outline add-to-budget). */

/* z-index: the shared sheet layer (branding.css --lw-z-sheet-*). The MudAppBar
   pins itself at 1300 (--mud-zindex-appbar), so the sheet pair must sit ABOVE
   it or the bar's bottom edge cuts across the sheet's rounded top and the 48px
   reveal strip goes undimmed (caught in review 2026-07-23). Stays below
   MudDialog (1400) so the nested Compare modal still stacks on top. */
.rdm-backdrop[b-ih8dgkoq5q] {
    position: fixed;
    inset: 0;
    z-index: var(--lw-z-sheet-backdrop);
    background: var(--lw-scrim);
    backdrop-filter: var(--lw-scrim-blur);
    -webkit-backdrop-filter: var(--lw-scrim-blur);
    animation: rdm-fade-in-b-ih8dgkoq5q 0.2s ease;
}

.rdm-sheet[b-ih8dgkoq5q] {
    position: fixed;
    left: 0;
    right: 0;
    bottom: 0;
    z-index: var(--lw-z-sheet);
    height: calc(100dvh - 48px);
    background: var(--lw-bg-muted);
    border-top-left-radius: 12px;
    border-top-right-radius: 12px;
    display: flex;
    flex-direction: column;
    overflow: hidden;
    box-shadow: 0 -4px 32px rgba(0, 0, 0, 0.15);
    animation: rdm-slide-up-b-ih8dgkoq5q 0.4s cubic-bezier(0.22, 1, 0.36, 1);
}

@keyframes rdm-fade-in-b-ih8dgkoq5q {
    from { opacity: 0; }
    to { opacity: 1; }
}

@keyframes rdm-slide-up-b-ih8dgkoq5q {
    from { transform: translateY(100%); }
    to { transform: translateY(0); }
}

/* ---- Header band ---- */

.rdm-header[b-ih8dgkoq5q] {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 14px 24px;
    flex-shrink: 0;
    background: var(--lw-white);
    border-bottom: 1px solid var(--lw-border);
}

.rdm-header-left[b-ih8dgkoq5q] {
    display: flex;
    align-items: center;
    gap: 10px;
    min-width: 0;
    flex: 1;
}

.rdm-title[b-ih8dgkoq5q] {
    margin: 0;
    font-family: var(--lw-font-family-heading);
    font-size: 18px;
    font-weight: var(--lw-font-bold);
    color: var(--lw-text-primary);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

/* Ref chip (reference: rounded-sm bg-muted px-1.5 py-0.5 text-[11px]
   font-semibold content-secondary). */
.rdm-ref[b-ih8dgkoq5q] {
    flex-shrink: 0;
    border-radius: var(--lw-radius-control);
    background: var(--lw-bg-muted);
    padding: 2px 6px;
    font-size: 11px;
    font-weight: var(--lw-font-semibold);
    color: var(--lw-gray-graphite);
}

.rdm-close[b-ih8dgkoq5q] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 36px;
    height: 36px;
    border: none;
    border-radius: 50%;
    background: transparent;
    color: var(--lw-gray-graphite);
    cursor: pointer;
    transition: background 0.15s, color 0.15s;
}

.rdm-close:hover[b-ih8dgkoq5q] {
    background: var(--lw-bg-secondary);
    color: var(--lw-text-primary);
}

/* ---- Split pane ---- */

.rdm-body[b-ih8dgkoq5q] {
    display: flex;
    flex: 1;
    min-height: 0;
    position: relative;
}

.rdm-left[b-ih8dgkoq5q] {
    flex: 1;
    min-width: 0;
    overflow-y: auto;
}

/* Centered content column (reference: max-w-3xl gap-4 px-6 py-6). */
.rdm-column[b-ih8dgkoq5q] {
    display: flex;
    flex-direction: column;
    gap: 16px;
    width: 100%;
    max-width: 768px;
    margin: 0 auto;
    padding: 24px;
}

/* ---- RFP info ---- */

.rdm-desc[b-ih8dgkoq5q] {
    margin: 0 0 16px;
    font-size: 14px;
    line-height: 1.625;
    color: var(--lw-text-primary);
    white-space: pre-wrap;
}

.rdm-meta-grid[b-ih8dgkoq5q] {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 16px;
}

@media (min-width: 640px) {
    .rdm-meta-grid[b-ih8dgkoq5q] {
        grid-template-columns: repeat(4, 1fr);
    }
}

.rdm-meta-label[b-ih8dgkoq5q] {
    margin: 0 0 4px;
    font-size: 12px;
    font-weight: var(--lw-font-medium);
    text-transform: uppercase;
    letter-spacing: 0.025em;
    color: var(--lw-gray-graphite);
}

.rdm-meta-value[b-ih8dgkoq5q] {
    margin: 0;
    font-size: 14px;
    font-weight: var(--lw-font-medium);
    color: var(--lw-text-primary);
}

.rdm-attachments[b-ih8dgkoq5q] {
    margin-top: 16px;
    border-top: 1px solid var(--lw-border);
    padding-top: 16px;
}

.rdm-attachments .rdm-meta-label[b-ih8dgkoq5q] {
    margin-bottom: 8px;
}

/* ---- Document card (reference DocCard) ---- */

.rdm-doc-list[b-ih8dgkoq5q] {
    display: flex;
    flex-direction: column;
    gap: 8px;
}

.rdm-doc[b-ih8dgkoq5q] {
    display: flex;
    align-items: center;
    gap: 12px;
    width: 100%;
    padding: 12px 16px;
    border: 1px solid var(--lw-border);
    border-radius: var(--lw-radius-card);
    background: var(--lw-white);
    text-align: left;
    cursor: pointer;
    font-family: var(--lw-font-family);
    transition: border-color 0.15s, background 0.15s;
}

.rdm-doc:hover[b-ih8dgkoq5q] {
    border-color: color-mix(in srgb, var(--lw-primary-blue) 40%, transparent);
    background: color-mix(in srgb, var(--lw-bg-secondary) 50%, var(--lw-white));
}

.rdm-doc--active[b-ih8dgkoq5q] {
    border-color: var(--lw-primary-blue);
    box-shadow: 0 0 0 1px color-mix(in srgb, var(--lw-primary-blue) 30%, transparent);
}

.rdm-doc--active:hover[b-ih8dgkoq5q] {
    background: var(--lw-white);
}

.rdm-doc-text[b-ih8dgkoq5q] {
    display: flex;
    flex-direction: column;
    min-width: 0;
    flex: 1;
}

.rdm-doc-name[b-ih8dgkoq5q] {
    font-size: 14px;
    font-weight: var(--lw-font-medium);
    color: var(--lw-text-primary);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.rdm-doc-size[b-ih8dgkoq5q] {
    font-size: 12px;
    color: var(--lw-gray-graphite);
}

.rdm-doc[b-ih8dgkoq5q]  .rdm-doc-icon.mud-icon-root {
    font-size: 20px;
    width: 20px;
    height: 20px;
    flex-shrink: 0;
}

.rdm-doc[b-ih8dgkoq5q]  .rdm-doc-eye.mud-icon-root {
    font-size: 16px;
    width: 16px;
    height: 16px;
    flex-shrink: 0;
    color: var(--lw-gray-graphite);
    transition: color 0.15s;
}

.rdm-doc:hover[b-ih8dgkoq5q]  .rdm-doc-eye.mud-icon-root,
.rdm-doc--active[b-ih8dgkoq5q]  .rdm-doc-eye.mud-icon-root {
    color: var(--lw-primary-blue);
}

/* ---- Toolbar ---- */

.rdm-toolbar[b-ih8dgkoq5q] {
    display: flex;
    flex-direction: column;
    gap: 12px;
}

@media (min-width: 768px) {
    .rdm-toolbar[b-ih8dgkoq5q] {
        flex-direction: row;
        align-items: center;
        justify-content: space-between;
    }
}

.rdm-toolbar-chips[b-ih8dgkoq5q] {
    display: flex;
    align-items: center;
    gap: 6px;
    overflow-x: auto;
}

.rdm-toolbar-right[b-ih8dgkoq5q] {
    display: flex;
    align-items: center;
    gap: 8px;
}

/* ---- No matches (dashed empty) ---- */

.rdm-no-matches[b-ih8dgkoq5q] {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 4px;
    border: 1px dashed var(--lw-border);
    border-radius: var(--lw-radius-card);
    padding: 48px 16px;
    text-align: center;
}

.rdm-no-matches-title[b-ih8dgkoq5q] {
    margin: 0;
    font-size: 14px;
    font-weight: var(--lw-font-medium);
    color: var(--lw-text-primary);
}

.rdm-no-matches-desc[b-ih8dgkoq5q] {
    margin: 0;
    font-size: 12px;
    color: var(--lw-gray-graphite);
}

/* ---- Vendor (not responded) row ---- */

.rdm-list[b-ih8dgkoq5q] {
    display: flex;
    flex-direction: column;
    gap: 12px;
}

.rdm-vendor-row[b-ih8dgkoq5q] {
    display: flex;
    align-items: center;
    gap: 12px;
    border: 1px solid var(--lw-border);
    border-radius: var(--lw-radius-card);
    background: var(--lw-white);
    padding: 12px 14px;
}

.rdm-vendor-text[b-ih8dgkoq5q] {
    min-width: 0;
    flex: 1;
}

.rdm-vendor-name[b-ih8dgkoq5q] {
    margin: 0;
    font-size: 14px;
    font-weight: var(--lw-font-medium);
    color: var(--lw-text-primary);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.rdm-vendor-sub[b-ih8dgkoq5q] {
    margin: 0;
    font-size: 12px;
    color: var(--lw-gray-space);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.rdm-vendor-wait[b-ih8dgkoq5q] {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    flex-shrink: 0;
    font-size: 12px;
    font-weight: var(--lw-font-medium);
    color: var(--lw-gray-graphite);
}

/* ---- Proposal card ---- */

.rdm-card[b-ih8dgkoq5q] {
    overflow: hidden;
    border: 1px solid var(--lw-border);
    border-radius: var(--lw-radius-card);
    background: var(--lw-white);
}

.rdm-card--accepted[b-ih8dgkoq5q] {
    border-color: color-mix(in srgb, var(--lw-status-success-fg) 40%, transparent);
}

.rdm-card-head[b-ih8dgkoq5q] {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 12px;
    padding: 14px 16px 0;
}

.rdm-card-identity[b-ih8dgkoq5q] {
    display: flex;
    align-items: center;
    gap: 10px;
    min-width: 0;
}

.rdm-card-vendor[b-ih8dgkoq5q] {
    margin: 0;
    font-size: 14px;
    font-weight: var(--lw-font-semibold);
    color: var(--lw-text-primary);
}

.rdm-card-sub[b-ih8dgkoq5q] {
    margin: 0;
    font-size: 12px;
    color: var(--lw-gray-graphite);
}

.rdm-card-amountwrap[b-ih8dgkoq5q] {
    display: flex;
    align-items: center;
    gap: 10px;
    flex-shrink: 0;
}

.rdm-card-amount[b-ih8dgkoq5q] {
    font-size: 14px;
    font-weight: var(--lw-font-semibold);
    font-variant-numeric: tabular-nums;
    color: var(--lw-text-primary);
}

.rdm-card-note[b-ih8dgkoq5q] {
    margin: 12px 16px 0;
    font-size: 13px;
    line-height: 1.625;
    color: var(--lw-gray-graphite);
    white-space: pre-wrap;
}

.rdm-card-head + .rdm-card-section[b-ih8dgkoq5q],
.rdm-card-note + .rdm-card-section[b-ih8dgkoq5q] {
    margin-top: 14px;
}

/* ---- AI insights section ---- */

.rdm-card-section[b-ih8dgkoq5q] {
    border-top: 1px solid var(--lw-border);
    padding: 12px 16px;
}

.rdm-ai-idle[b-ih8dgkoq5q] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
}

.rdm-ai-label[b-ih8dgkoq5q] {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    font-size: 13px;
    color: var(--lw-gray-graphite);
}

.rdm-ai-toggle[b-ih8dgkoq5q] {
    display: flex;
    align-items: center;
    gap: 8px;
    width: 100%;
    border: none;
    background: transparent;
    padding: 0;
    font-family: var(--lw-font-family);
    font-size: 13px;
    font-weight: var(--lw-font-medium);
    color: var(--lw-text-primary);
    cursor: pointer;
}

.rdm-card-section[b-ih8dgkoq5q]  .rdm-ai-spark.mud-icon-root {
    font-size: 14px;
    width: 14px;
    height: 14px;
    color: var(--lw-primary-blue);
}

.rdm-ai-toggle[b-ih8dgkoq5q]  .rdm-ai-chev.mud-icon-root {
    margin-left: auto;
    font-size: 16px;
    width: 16px;
    height: 16px;
    color: var(--lw-gray-graphite);
}

.rdm-ai-generate[b-ih8dgkoq5q] {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    height: 28px;
    padding: 0 8px;
    border: none;
    border-radius: var(--lw-radius-control);
    background: transparent;
    font-family: var(--lw-font-family);
    font-size: 13px;
    font-weight: var(--lw-font-medium);
    color: var(--lw-primary-blue);
    cursor: pointer;
    transition: background 0.15s;
}

.rdm-ai-generate:hover:not(:disabled)[b-ih8dgkoq5q] {
    background: var(--lw-status-info-bg);
}

.rdm-ai-generate:disabled[b-ih8dgkoq5q] {
    cursor: default;
    opacity: 0.7;
}

/* AI summary prose -- FormatSummary emits <p>/<ul>/<li>/<strong> from the
   model's markdown-lite (reference AiSummary text-[13px] leading-relaxed
   content-secondary). */
.rdm-ai-text[b-ih8dgkoq5q] {
    margin: 10px 0 0;
    font-size: 13px;
    line-height: 1.625;
    color: var(--lw-gray-graphite);
}

/* FormatSummary's markup comes in via MarkupString, so it never carries the
   CSS-isolation scope attribute -- plain scoped descendant rules die
   silently; ::deep pierces from the scoped wrapper. */
.rdm-ai-text[b-ih8dgkoq5q]  p {
    margin: 0 0 8px;
    font-size: 13px;
    line-height: 1.625;
}

.rdm-ai-text[b-ih8dgkoq5q]  p:last-child {
    margin-bottom: 0;
}

.rdm-ai-text[b-ih8dgkoq5q]  strong {
    font-weight: var(--lw-font-semibold);
    color: var(--lw-text-primary);
}

.rdm-ai-text[b-ih8dgkoq5q]  ul {
    margin: 0 0 8px;
    padding-left: 20px;
    list-style: disc;
}

.rdm-ai-text[b-ih8dgkoq5q]  ul ul {
    margin-bottom: 0;
    list-style: circle;
}

.rdm-ai-text[b-ih8dgkoq5q]  li {
    margin: 2px 0;
}

/* ---- Documents band (tinted) ---- */

.rdm-card-docs[b-ih8dgkoq5q] {
    display: flex;
    flex-direction: column;
    gap: 8px;
    border-top: 1px solid var(--lw-border);
    background: color-mix(in srgb, var(--lw-bg-muted) 40%, transparent);
    padding: 12px 16px;
}

/* ---- Footer actions ---- */

.rdm-card-actions[b-ih8dgkoq5q] {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: flex-end;
    gap: 8px;
    border-top: 1px solid var(--lw-border);
    padding: 12px 16px;
}

.rdm-act[b-ih8dgkoq5q] {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    height: 32px;
    padding: 0 12px;
    border-radius: var(--lw-radius-control);
    border: 1px solid transparent;
    background: transparent;
    font-family: var(--lw-font-family);
    font-size: 13px;
    font-weight: var(--lw-font-medium);
    cursor: pointer;
    transition: background 0.15s, color 0.15s, border-color 0.15s;
}

/* "Frown on brown": revision stays neutral gray, not the warning tone. */
.rdm-act--ghost[b-ih8dgkoq5q] {
    color: var(--lw-gray-graphite);
}

.rdm-act--ghost:hover[b-ih8dgkoq5q] {
    color: var(--lw-text-primary);
    background: var(--lw-bg-secondary);
}

.rdm-act--reject[b-ih8dgkoq5q] {
    border-color: color-mix(in srgb, var(--bs-danger, #dc3545) 40%, transparent);
    color: var(--bs-danger, #dc3545);
}

.rdm-act--reject:hover[b-ih8dgkoq5q] {
    background: var(--lw-status-error-bg);
}

.rdm-act--accept[b-ih8dgkoq5q] {
    border-color: color-mix(in srgb, var(--lw-status-success-fg) 40%, transparent);
    color: var(--lw-status-success-fg);
}

.rdm-act--accept:hover[b-ih8dgkoq5q] {
    background: var(--lw-status-success-bg);
}

.rdm-act--budget[b-ih8dgkoq5q] {
    border-color: color-mix(in srgb, var(--lw-primary-blue) 40%, transparent);
    color: var(--lw-primary-blue);
}

.rdm-act--budget:hover[b-ih8dgkoq5q] {
    background: var(--lw-status-info-bg);
}

/* ---- Right: document viewer pane ---- */

.rdm-right[b-ih8dgkoq5q] {
    display: flex;
    flex-direction: column;
    min-width: 0;
    background: var(--lw-white);
    border-left: 1px solid var(--lw-border);
    position: absolute;
    inset: 0;
    z-index: 20;
}

@media (min-width: 768px) {
    .rdm-right[b-ih8dgkoq5q] {
        position: static;
        z-index: auto;
        width: 48%;
        max-width: 680px;
        flex-shrink: 0;
    }
}

.rdm-preview-header[b-ih8dgkoq5q] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 8px;
    padding: 10px 16px;
    border-bottom: 1px solid var(--lw-border);
    flex-shrink: 0;
}

.rdm-preview-name[b-ih8dgkoq5q] {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    min-width: 0;
    font-size: 13px;
    font-weight: var(--lw-font-semibold);
    color: var(--lw-text-primary);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.rdm-preview-tools[b-ih8dgkoq5q] {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    flex-shrink: 0;
}

.rdm-pane-icon[b-ih8dgkoq5q] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 28px;
    height: 28px;
    border: none;
    background: transparent;
    padding: 0;
    color: var(--lw-gray-graphite);
    cursor: pointer;
    transition: color 0.15s;
}

.rdm-pane-icon:hover[b-ih8dgkoq5q] {
    color: var(--lw-text-primary);
}

.rdm-preview-loading[b-ih8dgkoq5q] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    flex: 1;
    gap: 16px;
    color: var(--lw-gray-graphite);
    font-size: 14px;
}

/* Drafting-table stage: white with a 16px dot grid; the document floats as
   a shadowed page sheet (shared viewer recipe, ViewInvoiceModal). */
.rdm-preview-stage[b-ih8dgkoq5q] {
    flex: 1;
    min-height: 0;
    display: flex;
    padding: 24px;
    background-color: var(--lw-white);
    background-image: radial-gradient(color-mix(in srgb, #1e1e24 5%, transparent) 1.5px, transparent 1.5px);
    background-size: 16px 16px;
}

.rdm-preview-page[b-ih8dgkoq5q] {
    flex: 1;
    min-height: 0;
    margin: auto;
    width: 100%;
    height: 100%;
    border: 1px solid var(--lw-border);
    border-radius: var(--lw-radius-control);
    background: var(--lw-white);
    box-shadow: var(--lw-shadow-card);
    overflow: hidden;
}

.rdm-preview-page iframe[b-ih8dgkoq5q] {
    width: 100%;
    height: 100%;
    border: none;
    display: block;
}

.rdm-preview-img-wrap[b-ih8dgkoq5q] {
    width: 100%;
    height: 100%;
    overflow: auto;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 16px;
}

.rdm-preview-img-wrap img[b-ih8dgkoq5q] {
    max-width: 100%;
    max-height: 100%;
    object-fit: contain;
    border-radius: var(--lw-radius-control);
    box-shadow: var(--lw-shadow-card);
}
/* _content/Ledgerwise/Components/Modals/SelectBudgetTemplateModal.razor.rz.scp.css */
/* Budget-mode option cards inside the canonical lw-modal body (replaces the
   legacy MudPaper cards + inline style block that leaned on --mud-palette
   vars). Selected/hover states use the --lw-* tokens; the selected border
   doubles via an inset ring so the card does not jump a pixel. */

.sbt-options[b-h4z33lhxiv] {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 12px;
}

.sbt-options--three[b-h4z33lhxiv] {
    grid-template-columns: repeat(3, minmax(0, 1fr));
}

.sbt-option[b-h4z33lhxiv] {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 8px;
    padding: 16px;
    text-align: center;
    font-family: var(--lw-font-family);
    background: var(--lw-white);
    border: 1px solid var(--lw-border);
    border-radius: var(--lw-radius-card);
    cursor: pointer;
    transition: border-color 0.15s ease, background 0.15s ease, box-shadow 0.15s ease;
}

.sbt-option:hover[b-h4z33lhxiv] {
    border-color: var(--lw-primary-blue);
}

.sbt-option--selected[b-h4z33lhxiv] {
    border-color: var(--lw-primary-blue);
    box-shadow: inset 0 0 0 1px var(--lw-primary-blue);
    background: color-mix(in srgb, var(--lw-primary-blue) 8%, transparent);
}

.sbt-option[b-h4z33lhxiv]  .mud-icon-root {
    width: 32px;
    height: 32px;
    color: var(--lw-gray-graphite);
    transition: color 0.15s ease;
}

.sbt-option--selected[b-h4z33lhxiv]  .mud-icon-root {
    color: var(--lw-primary-blue);
}

.sbt-option-title[b-h4z33lhxiv] {
    font-size: 14px;
    font-weight: var(--lw-font-semibold);
    color: var(--lw-text-primary);
}

.sbt-option-sub[b-h4z33lhxiv] {
    font-size: 12px;
    line-height: 1.4;
    color: var(--lw-gray-graphite);
}

.sbt-hint[b-h4z33lhxiv] {
    margin: 0;
    font-size: 13px;
    line-height: 1.5;
    color: var(--lw-gray-graphite);
}
/* _content/Ledgerwise/Components/Modals/SelectRfpRecipientModal.razor.rz.scp.css */
/* Select RFP recipient -- radio-card rows (reference chooser anatomy,
   AssignInvoiceToDrawRequestModal recipe; 2026-07-23). */

.srr-list[b-0twclp3hhr] {
    display: flex;
    flex-direction: column;
    gap: 8px;
}

.srr-row[b-0twclp3hhr] {
    display: flex;
    align-items: center;
    gap: 12px;
    width: 100%;
    padding: 12px 14px;
    border: 1px solid var(--lw-border);
    border-radius: var(--lw-radius-card);
    background: var(--lw-white);
    text-align: left;
    cursor: pointer;
    font-family: var(--lw-font-family);
    transition: border-color 0.15s, background 0.15s;
}

.srr-row:hover[b-0twclp3hhr] {
    border-color: color-mix(in srgb, var(--lw-primary-blue) 40%, transparent);
}

.srr-row--active[b-0twclp3hhr] {
    border-color: var(--lw-primary-blue);
    box-shadow: 0 0 0 1px color-mix(in srgb, var(--lw-primary-blue) 30%, transparent);
    background: color-mix(in srgb, var(--lw-status-info-bg) 50%, var(--lw-white));
}

.srr-radio[b-0twclp3hhr] {
    width: 16px;
    height: 16px;
    border-radius: 50%;
    border: 2px solid var(--lw-gray-smoke);
    flex-shrink: 0;
    transition: border-color 0.15s, box-shadow 0.15s;
}

.srr-row--active .srr-radio[b-0twclp3hhr] {
    border-color: var(--lw-primary-blue);
    box-shadow: inset 0 0 0 3px var(--lw-white);
    background: var(--lw-primary-blue);
}

.srr-text[b-0twclp3hhr] {
    display: flex;
    flex-direction: column;
    min-width: 0;
    flex: 1;
}

.srr-name[b-0twclp3hhr] {
    font-size: 14px;
    font-weight: var(--lw-font-semibold);
    color: var(--lw-text-primary);
}

.srr-company[b-0twclp3hhr] {
    font-size: 12px;
    color: var(--lw-gray-graphite);
}

.srr-error[b-0twclp3hhr] {
    margin: 8px 0 0;
    font-size: 12px;
    color: var(--bs-danger, #dc3545);
}
/* _content/Ledgerwise/Components/Modals/SendClientProposalModal.razor.rz.scp.css */
/* Send proposal to Project Owner -- canonical lw-modal chrome (2026-07-23);
   only the intro copy lives here. */

.scp-copy[b-49fb6rbqzq] {
    margin: 0;
    font-size: 14px;
    line-height: 1.5;
    color: var(--lw-gray-graphite);
}
/* _content/Ledgerwise/Components/Modals/SignConstructionAgreementModal.razor.rz.scp.css */
/* Sign Construction Agreement wizard on the canonical lw-modal shell.
   Layout only -- chrome comes from the shared lw-sign vocabulary
   (wwwroot/css/components/lw-sign.css) and the LwModal* atoms. */

/* Step-indicator chip row */
.scam-steps[b-3sb0vzv6ck] {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 4px;
    padding-bottom: 12px;
    border-bottom: 1px solid var(--lw-border);
}

.scam-section-title[b-3sb0vzv6ck] {
    margin: 0;
    font-size: 0.875rem;
    font-weight: var(--lw-font-semibold);
    color: var(--lw-text-primary);
}

/* Two-column provide-agreement choice grid */
.scam-choice-grid[b-3sb0vzv6ck] {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 16px;
}

@media (max-width: 640px) {
    .scam-choice-grid[b-3sb0vzv6ck] {
        grid-template-columns: 1fr;
    }
}

/* Equalize the two choice zones regardless of copy length */
.scam-choice[b-3sb0vzv6ck] {
    height: 100%;
    box-sizing: border-box;
}

/* Agreement-progress rows (white card rows with trailing action) */
.scam-progress-row[b-3sb0vzv6ck] {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 12px 16px;
    background: var(--lw-white);
    border: 1px solid var(--lw-border);
    border-radius: var(--lw-radius-control);
}

.scam-progress-row[b-3sb0vzv6ck]  .scam-progress-icon {
    width: 1.25rem;
    height: 1.25rem;
    color: var(--lw-gray-steel);
    flex-shrink: 0;
}

.scam-progress-row[b-3sb0vzv6ck]  .scam-progress-icon--done {
    color: var(--lw-status-success-fg);
}

.scam-progress-label[b-3sb0vzv6ck] {
    min-width: 0;
    flex: 1;
    font-size: 0.875rem;
    font-weight: var(--lw-font-medium);
    color: var(--lw-text-primary);
}

/* Remove / Upload+Continue action row under the selected signed file */
.scam-file-actions[b-3sb0vzv6ck] {
    display: flex;
    justify-content: flex-end;
    gap: 8px;
}
/* _content/Ledgerwise/Components/Modals/TemplateDetailsModal.razor.rz.scp.css */
/* Template details on the canonical lw-modal pattern: info-tinted header
   roundel (rim-roundel recipe on the info tint); body content composed of
   ControlCard sections. Field chrome comes from the LwTextField atoms;
   card chrome from ControlCard; buttons from the global lw-page-action /
   lw-modal button contracts. Hosted as a bottom sheet (lw-modal--sheet +
   lw-modal--scroll). All values from --lw-* tokens. */

.tdm-roundel[b-6voa4c5uom] {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 32px;
    height: 32px;
    border-radius: 9999px;
    background: var(--lw-status-info-bg);
    color: var(--lw-primary-blue);
}

.tdm-roundel[b-6voa4c5uom]  .mud-icon-root { width: 1rem; height: 1rem; }

/* Canonical scroll-dialog body stack: lw-modal--scroll clips the LwModalBody,
   this region scrolls, the footer stays pinned (dlg-fields recipe). */
.tdm-fields[b-6voa4c5uom] {
    display: flex;
    flex-direction: column;
    gap: 16px;
    flex: 1 1 auto;
    min-height: 0;
    overflow-y: auto;
}

/* Edit mode: the name/description field stack inside the details card. */
.tdm-form-stack[b-6voa4c5uom] {
    display: flex;
    flex-direction: column;
    gap: 16px;
}

/* Category stack shared by view and edit modes. */
.tdm-cat-stack[b-6voa4c5uom] {
    display: flex;
    flex-direction: column;
    gap: 12px;
}

/* -- View mode: disclosure rows -- */
.tdm-cat[b-6voa4c5uom] {
    border: 1px solid var(--lw-border);
    border-radius: var(--lw-radius-card);
    background: var(--lw-white);
    overflow: hidden;
}

.tdm-cat-toggle[b-6voa4c5uom] {
    display: flex;
    align-items: center;
    gap: 10px;
    width: 100%;
    padding: 12px 16px;
    background: transparent;
    border: 0;
    cursor: pointer;
    text-align: left;
    font-family: var(--lw-font-family);
}

.tdm-cat-toggle:hover[b-6voa4c5uom] {
    background: var(--lw-bg-muted);
}

.tdm-cat-name[b-6voa4c5uom] {
    flex: 1;
    min-width: 0;
    font-size: 14px;
    font-weight: var(--lw-font-semibold);
    color: var(--lw-text-primary);
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.tdm-cat-chevron[b-6voa4c5uom] {
    display: inline-flex;
    color: var(--lw-gray-graphite);
    transition: transform 0.15s ease;
}

.tdm-cat-chevron--open[b-6voa4c5uom] {
    transform: rotate(180deg);
}

.tdm-cat-chevron[b-6voa4c5uom]  .mud-icon-root { width: 18px; height: 18px; font-size: 18px; }

.tdm-item-list[b-6voa4c5uom] {
    margin: 0;
    padding: 2px 16px 12px 28px;
    list-style: none;
    display: flex;
    flex-direction: column;
}

.tdm-item[b-6voa4c5uom] {
    padding: 6px 0;
    font-size: 14px;
    color: var(--lw-text-primary);
}

/* -- Edit mode: category editor blocks -- */
.tdm-empty-text[b-6voa4c5uom] {
    margin: 0;
    font-size: 14px;
    color: var(--lw-gray-graphite);
}

.tdm-cat-edit[b-6voa4c5uom] {
    display: flex;
    flex-direction: column;
    gap: 10px;
    padding: 12px 16px;
    border: 1px solid var(--lw-border);
    border-radius: var(--lw-radius-card);
    background: var(--lw-white);
}

.tdm-cat-edit-head[b-6voa4c5uom] {
    display: flex;
    align-items: center;
    gap: 10px;
}

.tdm-cat-edit-field[b-6voa4c5uom] {
    flex: 1;
    min-width: 0;
}

.tdm-item-stack[b-6voa4c5uom] {
    display: flex;
    flex-direction: column;
    gap: 8px;
    padding-left: 12px;
}

.tdm-item-edit[b-6voa4c5uom] {
    display: flex;
    align-items: center;
    gap: 8px;
}

.tdm-item-edit-field[b-6voa4c5uom] {
    flex: 1;
    min-width: 0;
}

/* Ghost icon button for row removal (etm-close-btn recipe at row scale;
   destructive tint on hover). */
.tdm-row-x[b-6voa4c5uom] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 32px;
    height: 32px;
    flex-shrink: 0;
    border: 0;
    background: transparent;
    color: var(--lw-gray-graphite);
    cursor: pointer;
    border-radius: 6px;
    transition: background-color 0.12s, color 0.12s;
}

.tdm-row-x:hover[b-6voa4c5uom] {
    background: var(--lw-status-error-bg);
    color: var(--lw-status-error-fg);
}

.tdm-row-x[b-6voa4c5uom]  .mud-icon-root { width: 18px; height: 18px; font-size: 18px; }

/* -- View mode: metadata in the ControlCard Note slot -- */
.tdm-note-lines[b-6voa4c5uom] {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 2px;
}

.tdm-doc-link[b-6voa4c5uom] {
    background: none;
    border: 0;
    padding: 0;
    font: inherit;
    color: var(--lw-primary-blue);
    cursor: pointer;
    text-align: left;
}

.tdm-doc-link:hover[b-6voa4c5uom] {
    text-decoration: underline;
}
/* _content/Ledgerwise/Components/Modals/TermsOfUseModal.razor.rz.scp.css */
/* Terms of Use modal -- body content on the canonical lw-modal regions.
   Plain selectors work here: MudDialog teleports the elements but they keep
   this file's scope attribute. */

.tou-intro[b-qm7tjx17y7] {
    margin: 0 0 16px;
    font-family: var(--lw-font-family);
    font-size: 14px;
    line-height: 22px;
    color: var(--lw-text-primary);
}

.tou-accept[b-qm7tjx17y7] {
    display: flex;
    align-items: center;
    gap: 10px;
    cursor: pointer;
    user-select: none;
    font-family: var(--lw-font-family);
    font-size: 14px;
    line-height: 22px;
    color: var(--lw-text-primary);
}

.tou-accept input[b-qm7tjx17y7] {
    width: 18px;
    height: 18px;
    margin: 0;
    flex-shrink: 0;
    cursor: pointer;
    accent-color: var(--lw-primary-dark);
}

.tou-error-wrap[b-qm7tjx17y7] {
    margin-top: 16px;
}
/* _content/Ledgerwise/Components/Modals/UploadBudgetTemplateModal.razor.rz.scp.css */
/* Budget-template upload on the canonical bottom-sheet pattern (cod-/drs-
   recipe, ui-app drawer.tsx side="sheet", converted 2026-07-28): fixed
   blurred backdrop + slide-up sheet (100dvh - 48px, 12px top radius, muted
   shell) with white LwModalHeader/LwModalFooter bands and a scrollable
   centered 62rem ControlCard column. Dropzone and file row follow the
   asim-* recipe
   (AddSubcontractorInvoiceModal.razor.css); the .ubt-field name-field chrome
   copies the .aim-numfield FieldShell recipe (AddInvoiceModal.razor.css)
   because the MudTextField keeps its HelperText. */

/* -- Backdrop + slide-up bottom sheet -- */

.ubt-backdrop[b-zdr2a2ffkm] {
    position: fixed;
    inset: 0;
    z-index: var(--lw-z-sheet-backdrop);
    background: var(--lw-scrim);
    backdrop-filter: var(--lw-scrim-blur);
    -webkit-backdrop-filter: var(--lw-scrim-blur);
    opacity: 0;
    transition: opacity 0.2s ease;
}

.ubt-backdrop.ubt-open[b-zdr2a2ffkm] {
    opacity: 1;
}

.ubt-sheet[b-zdr2a2ffkm] {
    position: fixed;
    left: 0;
    right: 0;
    bottom: 0;
    z-index: var(--lw-z-sheet);
    height: calc(100dvh - 48px);
    background: var(--lw-bg-muted);
    border-top-left-radius: 12px;
    border-top-right-radius: 12px;
    display: flex;
    flex-direction: column;
    overflow: hidden;
    transform: translateY(100%);
    transition: transform 0.3s cubic-bezier(0.22, 1, 0.36, 1);
    box-shadow: 0 -4px 32px rgba(0, 0, 0, 0.15);
}

.ubt-sheet.ubt-open[b-zdr2a2ffkm] {
    transform: translateY(0);
}

.ubt-sheet.ubt-exit[b-zdr2a2ffkm] {
    transform: translateY(100%);
    transition: transform 0.25s cubic-bezier(0.4, 0, 1, 1);
}

@media (prefers-reduced-motion: reduce) {
    .ubt-backdrop[b-zdr2a2ffkm],
    .ubt-sheet[b-zdr2a2ffkm] {
        transition: none;
    }
}

/* The Lw header/footer atoms own their band chrome; pin them so only the
   body column flexes and scrolls. */
.ubt-sheet[b-zdr2a2ffkm]  .lw-modal-header {
    flex-shrink: 0;
}

.ubt-footer[b-zdr2a2ffkm] {
    flex-shrink: 0;
    background: var(--lw-white);
}

/* -- Scrollable body: centered content column over the muted shell -- */

.ubt-body[b-zdr2a2ffkm] {
    flex: 1;
    min-height: 0;
    overflow-y: auto;
    padding: 1.5rem 2rem;
}

@media (min-width: 1024px) {
    .ubt-body[b-zdr2a2ffkm] {
        padding: 1.5rem 3rem;
    }
}

.ubt-content[b-zdr2a2ffkm] {
    width: 100%;
    max-width: 62rem;
    margin: 0 auto;
    display: flex;
    flex-direction: column;
    gap: 1.25rem;
}

/* Field/section rhythm inside a ControlCard body. */
.ubt-stack[b-zdr2a2ffkm] {
    display: flex;
    flex-direction: column;
    gap: 16px;
}

/* -- Section rhythm inside the card body. -- */

.ubt-section[b-zdr2a2ffkm] { display: flex; flex-direction: column; gap: 8px; }

/* -- Dropzone (asim-dropzone recipe). The expected-format example table was
   replaced by the card-header "Download template" action (2026-07-28). -- */

.ubt-dropwrap[b-zdr2a2ffkm] { position: relative; }

.ubt-dropzone[b-zdr2a2ffkm] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    text-align: center;
    padding: 48px 32px;
    border: 2px dashed rgba(145, 158, 171, 0.32);
    border-radius: var(--lw-radius-sm);
    background: rgba(145, 158, 171, 0.08);
    cursor: pointer;
    transition: border-color 0.15s ease, background 0.15s ease;
}

.ubt-dropwrap:hover .ubt-dropzone[b-zdr2a2ffkm] {
    border-color: var(--lw-primary-blue);
    background: color-mix(in srgb, var(--lw-primary-blue) 8%, transparent);
}

.ubt-drop-tile[b-zdr2a2ffkm] {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 56px;
    height: 56px;
    margin-bottom: 20px;
    border-radius: var(--lw-radius-sm);
    background: color-mix(in srgb, var(--lw-primary-dark) 10%, transparent);
    color: var(--lw-primary-dark);
}

.ubt-drop-tile[b-zdr2a2ffkm]  .mud-icon-root { width: 28px; height: 28px; }

.ubt-drop-title[b-zdr2a2ffkm] {
    margin: 0;
    font-size: 0.875rem;
    font-weight: var(--lw-font-semibold);
    color: var(--lw-text-primary);
}

.ubt-drop-sub[b-zdr2a2ffkm] { margin: 6px 0 0; font-size: 0.875rem; color: var(--lw-gray-graphite); }
.ubt-drop-browse[b-zdr2a2ffkm] { color: var(--lw-primary-blue); }
.ubt-dropwrap:hover .ubt-drop-browse[b-zdr2a2ffkm] { text-decoration: underline; text-underline-offset: 2px; }
.ubt-drop-hint[b-zdr2a2ffkm] { margin: 16px 0 0; font-size: 0.75rem; color: var(--lw-gray-space); }

/* -- Selected-file row (asim-file recipe; passive, no remove action). -- */

.ubt-file[b-zdr2a2ffkm] {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 12px 16px;
    border: 1px solid var(--lw-border);
    border-radius: var(--lw-radius-control);
    background: color-mix(in srgb, var(--lw-bg-muted) 30%, transparent);
}

.ubt-file[b-zdr2a2ffkm]  .ubt-file-icon { width: 1.25rem; height: 1.25rem; color: var(--lw-status-success-fg); flex-shrink: 0; }
.ubt-file[b-zdr2a2ffkm]  .ubt-file-check { width: 1.125rem; height: 1.125rem; color: var(--lw-status-success-fg); flex-shrink: 0; }

.ubt-file-name[b-zdr2a2ffkm] {
    min-width: 0;
    flex: 1;
    font-size: 0.875rem;
    font-weight: var(--lw-font-medium);
    color: var(--lw-text-primary);
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.ubt-file-size[b-zdr2a2ffkm] { flex-shrink: 0; font-size: 0.75rem; color: var(--lw-gray-graphite); }

/* -- Extracted-structure preview: white card, folder-labelled categories,
   plain indented item list. -- */

.ubt-extract[b-zdr2a2ffkm] {
    display: flex;
    flex-direction: column;
    gap: 12px;
    max-height: 300px;
    overflow-y: auto;
    padding: 12px 16px;
    background: var(--lw-white);
    border: 1px solid var(--lw-border);
    border-radius: var(--lw-radius-card);
}

/* Skeleton preview while extraction runs: mirrors the category-name row
   (icon tile + title line) and the indented item list. */
.ubt-skel-cat[b-zdr2a2ffkm] {
    display: flex;
    align-items: center;
    gap: 6px;
}

.ubt-skel-cat[b-zdr2a2ffkm]  .ubt-skel-fixed { flex-shrink: 0; }

.ubt-skel-items[b-zdr2a2ffkm] {
    display: flex;
    flex-direction: column;
    gap: 8px;
    margin-top: 8px;
    padding-left: 34px;
}

.ubt-extract-cat-name[b-zdr2a2ffkm] {
    display: flex;
    align-items: center;
    gap: 6px;
    margin: 0;
    font-size: 0.875rem;
    font-weight: var(--lw-font-semibold);
    color: var(--lw-text-primary);
}

.ubt-extract-cat-name[b-zdr2a2ffkm]  .mud-icon-root { width: 1rem; height: 1rem; color: var(--lw-primary-blue); }

.ubt-extract-items[b-zdr2a2ffkm] {
    margin: 4px 0 0;
    padding-left: 34px;
    list-style: disc;
    font-size: 0.875rem;
    line-height: 1.6;
    color: var(--lw-gray-graphite);
}

/* -- FieldShell chrome for the name MudTextField (aim-numfield recipe;
   kept as a raw Mud input because LwTextField has no HelperText slot). -- */

.ubt-field[b-zdr2a2ffkm]  .mud-input-helper-text {
    font-family: var(--lw-font-family);
    font-size: 13px;
    line-height: 18px;
    margin-top: 4px;
}

.ubt-field[b-zdr2a2ffkm]  .mud-input-control { margin-top: 0; }

.ubt-field[b-zdr2a2ffkm]  .mud-input-outlined {
    font-size: 14px;
    font-weight: 400;
    background-color: var(--lw-white);
    border-radius: var(--lw-radius-control);
}

.ubt-field[b-zdr2a2ffkm]  .mud-input-outlined input.mud-input-slot {
    height: 54px;
    box-sizing: border-box;
    padding: 16px 14px;
    font-size: 14px;
    font-weight: 400;
    /* 16 + 22 + 16 = 54 -- centers the text block exactly like FieldShell. */
    line-height: 22px;
}

.ubt-field[b-zdr2a2ffkm]  .mud-input-label {
    font-size: 14px;
    font-weight: 400;
    line-height: 22px;
    letter-spacing: normal;
    color: var(--lw-gray-space);
}

.ubt-field[b-zdr2a2ffkm]  .mud-input-label-outlined {
    top: 50%;
    transform: translate(13px, -50%) scale(1);
    padding: 0 2px !important;
    transition: top 0.2s cubic-bezier(0, 0, 0.2, 1), transform 0.2s cubic-bezier(0, 0, 0.2, 1), color 0.2s;
}

.ubt-field[b-zdr2a2ffkm]  .mud-shrink ~ label.mud-input-label.mud-input-label-inputcontrol.mud-input-label-outlined,
.ubt-field[b-zdr2a2ffkm]  .mud-input:focus-within ~ label.mud-input-label.mud-input-label-inputcontrol.mud-input-label-outlined {
    top: 0;
    transform: translate(13px, -6px) scale(0.857);
}

.ubt-field[b-zdr2a2ffkm]  .mud-shrink ~ label.mud-input-label.mud-input-label-inputcontrol.mud-input-label-outlined {
    color: var(--lw-gray-graphite);
}

.ubt-field[b-zdr2a2ffkm]  .mud-input:focus-within ~ label.mud-input-label.mud-input-label-inputcontrol.mud-input-label-outlined {
    color: var(--lw-gray-phantom);
}

.ubt-field[b-zdr2a2ffkm]  .mud-input.mud-input-outlined:not(.mud-disabled):not(:focus-within):hover .mud-input-outlined-border {
    border-color: var(--lw-input-border);
}

.ubt-field[b-zdr2a2ffkm]  .mud-input.mud-input-outlined:focus-within > .mud-input-outlined-border,
.ubt-field[b-zdr2a2ffkm]  .mud-input.mud-input-outlined:focus-within .mud-shrink > .mud-input-outlined-border {
    border-width: 1px;
    border-color: var(--lw-gray-phantom);
}
/* _content/Ledgerwise/Components/Modals/UploadProposalModal.razor.rz.scp.css */
/* Upload Proposal modal -- canonical doc-card file rows (same recipe as
   AddRfpModal .arm-file, from reference documents-manager doc cards).
   Ported 2026-07-23. Modal shell chrome lives in app.css (.lw-modal). */

.upm-docs-label[b-w9qrhlr0xp] {
    margin: 16px 0 8px;
    font-size: 14px;
    font-weight: var(--lw-font-medium);
    color: var(--lw-text-primary);
}

.upm-files[b-w9qrhlr0xp] {
    display: flex;
    flex-direction: column;
    gap: 8px;
    margin-top: 12px;
}

.upm-file[b-w9qrhlr0xp] {
    display: flex;
    align-items: center;
    gap: 12px;
    border: 1px solid var(--lw-border);
    border-radius: var(--lw-radius-card);
    background: var(--lw-white);
    padding: 12px 16px;
}

.upm-file[b-w9qrhlr0xp]  .upm-file-icon.mud-icon-root {
    font-size: 20px;
    width: 20px;
    height: 20px;
    flex-shrink: 0;
}

.upm-file-text[b-w9qrhlr0xp] {
    display: flex;
    flex-direction: column;
    min-width: 0;
    flex: 1;
}

.upm-file-name[b-w9qrhlr0xp] {
    font-size: 14px;
    font-weight: var(--lw-font-medium);
    color: var(--lw-text-primary);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.upm-file-size[b-w9qrhlr0xp] {
    font-size: 12px;
    color: var(--lw-gray-graphite);
}

.upm-file-remove[b-w9qrhlr0xp] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 32px;
    height: 32px;
    border: none;
    border-radius: var(--lw-radius-control);
    background: transparent;
    padding: 0;
    color: var(--lw-gray-graphite);
    cursor: pointer;
    flex-shrink: 0;
    transition: background 0.15s, color 0.15s;
}

.upm-file-remove:hover:not(:disabled)[b-w9qrhlr0xp] {
    background: var(--lw-bg-secondary);
    color: var(--bs-danger, #dc3545);
}

.upm-file-remove:disabled[b-w9qrhlr0xp] {
    opacity: 0.5;
    cursor: default;
}

.upm-file-remove[b-w9qrhlr0xp]  .mud-icon-root {
    font-size: 16px;
    width: 16px;
    height: 16px;
}

/* -- Upload progress: slim 4px track + quiet status line below (recipe from
   AddInvoiceModal .aim-file-track/.aim-file-fill; review round 2026-07-28).
   Replaces MudProgressLinear, whose in-bar caption clipped into the track. -- */

.upm-track[b-w9qrhlr0xp] {
    height: 4px;
    width: 100%;
    margin-top: 10px;
    overflow: hidden;
    border-radius: 9999px;
    background: var(--lw-border);
}

.upm-track-fill[b-w9qrhlr0xp] {
    position: relative;
    height: 100%;
    overflow: hidden;
    border-radius: inherit;
    background: var(--lw-primary-dark);
    transition: width 0.2s ease;
}

/* Soft light sweep so slow uploads still read as live work. */
.upm-track-fill[b-w9qrhlr0xp]::after {
    content: "";
    position: absolute;
    inset: 0;
    background: linear-gradient(90deg, transparent 0%, rgba(255, 255, 255, 0.35) 50%, transparent 100%);
    animation: upm-fill-sweep-b-w9qrhlr0xp 1.6s ease-in-out infinite;
}

/* Indeterminate variant -- a 40% segment sweeping the track while file bytes
   stream from the browser (step 1 read). */
.upm-track--busy .upm-track-fill[b-w9qrhlr0xp] {
    width: 40%;
    animation: upm-track-slide-b-w9qrhlr0xp 1.2s ease-in-out infinite;
}

@keyframes upm-fill-sweep-b-w9qrhlr0xp {
    from { transform: translateX(-100%); }
    to { transform: translateX(100%); }
}

@keyframes upm-track-slide-b-w9qrhlr0xp {
    from { margin-left: -40%; }
    to { margin-left: 100%; }
}

@media (prefers-reduced-motion: reduce) {
    .upm-track-fill[b-w9qrhlr0xp]::after { animation: none; display: none; }
    .upm-track--busy .upm-track-fill[b-w9qrhlr0xp] { animation: none; width: 100%; opacity: 0.5; }
}

.upm-upload-status[b-w9qrhlr0xp] {
    margin: 8px 0 0;
    font-size: 0.8125rem;
    font-weight: var(--lw-font-medium);
    font-variant-numeric: tabular-nums;
    color: var(--lw-text-primary);
    text-align: center;
}
/* _content/Ledgerwise/Components/Modals/UploadSignedAgreementModal.razor.rz.scp.css */
/* Signed-agreement upload internals. Source: ledgerwise-app gc-documents.tsx
   AddFilesModal dropzone (measured 2026-07-20). The drag-over state rides the
   existing mud-border-primary marker class set by the @code block. */

.usam-dropwrap[b-qjfcrbgmie] { position: relative; }

.usam-dropzone[b-qjfcrbgmie] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    text-align: center;
    padding: 40px 32px;
    border: 2px dashed rgba(145, 158, 171, 0.32);
    border-radius: var(--lw-radius-sm);
    cursor: pointer;
    transition: border-color 0.15s ease, background 0.15s ease;
}

.usam-dropzone:hover[b-qjfcrbgmie],
.usam-dropwrap.mud-border-primary .usam-dropzone[b-qjfcrbgmie] {
    border-color: var(--lw-primary-blue);
    background: color-mix(in srgb, var(--lw-primary-blue) 8%, transparent);
}

.usam-dropzone-tile[b-qjfcrbgmie] {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 56px;
    height: 56px;
    margin-bottom: 20px;
    border-radius: var(--lw-radius-sm);
    background: color-mix(in srgb, var(--lw-primary-dark) 10%, transparent);
    color: var(--lw-primary-dark);
}

.usam-dropzone-tile[b-qjfcrbgmie]  .mud-icon-root { width: 28px; height: 28px; }

.usam-dropzone-title[b-qjfcrbgmie] {
    margin: 0;
    font-size: 0.875rem;
    font-weight: var(--lw-font-semibold);
    color: var(--lw-text-primary);
}

.usam-dropzone-sub[b-qjfcrbgmie] {
    margin: 6px 0 0;
    font-size: 0.875rem;
    color: var(--lw-gray-graphite);
}

.usam-dropzone-browse[b-qjfcrbgmie] { color: var(--lw-primary-blue); }
.usam-dropzone:hover .usam-dropzone-browse[b-qjfcrbgmie] { text-decoration: underline; text-underline-offset: 2px; }

.usam-dropzone-hint[b-qjfcrbgmie] {
    margin: 16px 0 0;
    font-size: 0.75rem;
    color: var(--lw-gray-space);
}

/* Selected-file confirmation row. */
.usam-file[b-qjfcrbgmie] {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 12px 16px;
    border: 1px solid var(--lw-border);
    border-radius: var(--lw-radius-control);
    background: color-mix(in srgb, var(--lw-bg-muted) 30%, transparent);
}

.usam-file[b-qjfcrbgmie]  .usam-file-icon { width: 1.25rem; height: 1.25rem; color: var(--lw-filetype-pdf-fg); flex-shrink: 0; }

.usam-file-name[b-qjfcrbgmie] {
    min-width: 0;
    font-size: 0.875rem;
    font-weight: var(--lw-font-medium);
    color: var(--lw-text-primary);
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}
/* _content/Ledgerwise/Components/Modals/UploadTemplateModal.razor.rz.scp.css */
/* Template upload on the canonical bottom-sheet pattern (ubt- recipe, ui-app
   drawer.tsx side="sheet", converted 2026-07-29): fixed blurred backdrop +
   slide-up sheet (100dvh - 48px, 12px top radius, muted shell) with white
   LwModalHeader/LwModalFooter bands and a scrollable centered 62rem
   ControlCard column. Dropzone and file row follow the asim-* recipe
   (AddSubcontractorInvoiceModal.razor.css); field chrome now comes from the
   LwSelect/LwTextField atoms. */

/* -- Backdrop + slide-up bottom sheet -- */

.utm-backdrop[b-ujavxmqh2s] {
    position: fixed;
    inset: 0;
    z-index: var(--lw-z-sheet-backdrop);
    background: var(--lw-scrim);
    backdrop-filter: var(--lw-scrim-blur);
    -webkit-backdrop-filter: var(--lw-scrim-blur);
    opacity: 0;
    transition: opacity 0.2s ease;
}

.utm-backdrop.utm-open[b-ujavxmqh2s] {
    opacity: 1;
}

.utm-sheet[b-ujavxmqh2s] {
    position: fixed;
    left: 0;
    right: 0;
    bottom: 0;
    z-index: var(--lw-z-sheet);
    height: calc(100dvh - 48px);
    background: var(--lw-bg-muted);
    border-top-left-radius: 12px;
    border-top-right-radius: 12px;
    display: flex;
    flex-direction: column;
    overflow: hidden;
    transform: translateY(100%);
    transition: transform 0.3s cubic-bezier(0.22, 1, 0.36, 1);
    box-shadow: 0 -4px 32px rgba(0, 0, 0, 0.15);
}

.utm-sheet.utm-open[b-ujavxmqh2s] {
    transform: translateY(0);
}

.utm-sheet.utm-exit[b-ujavxmqh2s] {
    transform: translateY(100%);
    transition: transform 0.25s cubic-bezier(0.4, 0, 1, 1);
}

@media (prefers-reduced-motion: reduce) {
    .utm-backdrop[b-ujavxmqh2s],
    .utm-sheet[b-ujavxmqh2s] {
        transition: none;
    }
}

/* The Lw header/footer atoms own their band chrome; pin them so only the
   body column flexes and scrolls. */
.utm-sheet[b-ujavxmqh2s]  .lw-modal-header {
    flex-shrink: 0;
}

.utm-footer[b-ujavxmqh2s] {
    flex-shrink: 0;
    background: var(--lw-white);
}

/* -- Scrollable body: centered ControlCard column over the muted shell -- */

.utm-body[b-ujavxmqh2s] {
    flex: 1;
    min-height: 0;
    overflow-y: auto;
    padding: 1.5rem 2rem;
}

@media (min-width: 1024px) {
    .utm-body[b-ujavxmqh2s] {
        padding: 1.5rem 3rem;
    }
}

.utm-content[b-ujavxmqh2s] {
    width: 100%;
    max-width: 62rem;
    margin: 0 auto;
    display: flex;
    flex-direction: column;
    gap: 1.25rem;
}

.utm-roundel[b-ujavxmqh2s] {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 32px;
    height: 32px;
    border-radius: 9999px;
    background: var(--lw-status-info-bg);
    color: var(--lw-primary-blue);
}

.utm-roundel[b-ujavxmqh2s]  .mud-icon-root { width: 1rem; height: 1rem; }

/* -- Section rhythm inside a ControlCard body. -- */

.utm-section[b-ujavxmqh2s] { display: flex; flex-direction: column; gap: 8px; }

.utm-hint[b-ujavxmqh2s] { margin: 0; font-size: 0.75rem; line-height: 1.5; color: var(--lw-gray-graphite); }

/* -- Toggle row: description column + trailing LwToggle. -- */

.utm-toggle-row[b-ujavxmqh2s] {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 16px;
}

.utm-toggle-text[b-ujavxmqh2s] { display: flex; flex-direction: column; gap: 2px; min-width: 0; }

.utm-toggle-title[b-ujavxmqh2s] {
    margin: 0;
    font-size: 0.875rem;
    font-weight: var(--lw-font-semibold);
    color: var(--lw-text-primary);
}

/* -- Dropzone (asim-dropzone recipe). -- */

.utm-dropwrap[b-ujavxmqh2s] { position: relative; }

.utm-dropzone[b-ujavxmqh2s] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    text-align: center;
    padding: 48px 32px;
    border: 2px dashed rgba(145, 158, 171, 0.32);
    border-radius: var(--lw-radius-sm);
    background: rgba(145, 158, 171, 0.08);
    cursor: pointer;
    transition: border-color 0.15s ease, background 0.15s ease;
}

.utm-dropwrap:hover .utm-dropzone[b-ujavxmqh2s] {
    border-color: var(--lw-primary-blue);
    background: color-mix(in srgb, var(--lw-primary-blue) 8%, transparent);
}

.utm-drop-tile[b-ujavxmqh2s] {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 56px;
    height: 56px;
    margin-bottom: 20px;
    border-radius: var(--lw-radius-sm);
    background: color-mix(in srgb, var(--lw-primary-dark) 10%, transparent);
    color: var(--lw-primary-dark);
}

.utm-drop-tile[b-ujavxmqh2s]  .mud-icon-root { width: 28px; height: 28px; }

.utm-drop-title[b-ujavxmqh2s] {
    margin: 0;
    font-size: 0.875rem;
    font-weight: var(--lw-font-semibold);
    color: var(--lw-text-primary);
}

.utm-drop-sub[b-ujavxmqh2s] { margin: 6px 0 0; font-size: 0.875rem; color: var(--lw-gray-graphite); }
.utm-drop-browse[b-ujavxmqh2s] { color: var(--lw-primary-blue); }
.utm-dropwrap:hover .utm-drop-browse[b-ujavxmqh2s] { text-decoration: underline; text-underline-offset: 2px; }
.utm-drop-hint[b-ujavxmqh2s] { margin: 16px 0 0; font-size: 0.75rem; color: var(--lw-gray-space); }

/* -- Selected-file row (asim-file recipe; passive, no remove action). -- */

.utm-file[b-ujavxmqh2s] {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 12px 16px;
    border: 1px solid var(--lw-border);
    border-radius: var(--lw-radius-control);
    background: color-mix(in srgb, var(--lw-bg-muted) 30%, transparent);
}

.utm-file[b-ujavxmqh2s]  .utm-file-icon { width: 1.25rem; height: 1.25rem; color: var(--lw-filetype-pdf-fg); flex-shrink: 0; }
.utm-file[b-ujavxmqh2s]  .utm-file-check { width: 1.125rem; height: 1.125rem; color: var(--lw-status-success-fg); flex-shrink: 0; }

.utm-file-name[b-ujavxmqh2s] {
    min-width: 0;
    flex: 1;
    font-size: 0.875rem;
    font-weight: var(--lw-font-medium);
    color: var(--lw-text-primary);
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

/* -- BoldSign iframe stage: fills the sheet below the header band. -- */

.utm-frame[b-ujavxmqh2s] {
    display: flex;
    flex-direction: column;
    flex: 1;
    min-height: 0;
    overflow: hidden;
    background: var(--lw-white);
}

.utm-frame iframe[b-ujavxmqh2s] { flex: 1; width: 100%; border: none; }
/* _content/Ledgerwise/Components/Modals/ViewInvoiceModal.razor.rz.scp.css */
/* Backdrop.
   Uses the -nested sheet layer (branding.css --lw-z-sheet-nested-*) so that
   when ViewInvoiceModal opens from inside a base sheet (the payment request /
   budget adjustment approval sheets), it stacks on top instead of behind.
   Stays above the MudAppBar (1300) and below MudDialog (1400) / MudSnackbar. */
.vim-backdrop[b-2kq8zed3uk] {
    position: fixed;
    inset: 0;
    z-index: var(--lw-z-sheet-nested-backdrop);
    background: var(--lw-scrim);
    backdrop-filter: var(--lw-scrim-blur);
    -webkit-backdrop-filter: var(--lw-scrim-blur);
    opacity: 0;
    transition: opacity 0.2s ease;
}
.vim-backdrop.vim-open[b-2kq8zed3uk] { opacity: 1; }

/* Sheet: muted shell so the white header/footer bands read elevated
   (reference drawer side="sheet"). */
.vim-sheet[b-2kq8zed3uk] {
    position: fixed;
    left: 0;
    right: 0;
    bottom: 0;
    z-index: var(--lw-z-sheet-nested);
    height: calc(100dvh - 48px);
    background: var(--lw-bg-muted);
    border-top-left-radius: 12px;
    border-top-right-radius: 12px;
    display: flex;
    flex-direction: column;
    overflow: hidden;
    transform: translateY(100%);
    /* easeOutQuint -- smooth deceleration matching the framer-motion spring in ledgerwise-ui */
    transition: transform 0.4s cubic-bezier(0.22, 1, 0.36, 1);
    will-change: transform;
    box-shadow: 0 -4px 32px rgba(0, 0, 0, 0.15);
}
.vim-sheet.vim-open[b-2kq8zed3uk] { transform: translateY(0); }
.vim-sheet.vim-exit[b-2kq8zed3uk] {
    transform: translateY(100%);
    transition: transform 0.25s cubic-bezier(0.4, 0, 1, 1);
}

/* Real content fades in once data loads, replacing the skeleton.
   Centered 760px ControlCard column with 20px gaps (reference left column). */
.vim-content-fade-in[b-2kq8zed3uk] {
    display: flex;
    flex-direction: column;
    gap: 1.25rem;
    width: 100%;
    max-width: 760px;
    margin: 0 auto;
    animation: vim-fade-in-b-2kq8zed3uk 0.35s ease-out;
}
@keyframes vim-fade-in-b-2kq8zed3uk {
    from { opacity: 0; }
    to   { opacity: 1; }
}

/* Header */
.vim-header[b-2kq8zed3uk] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 0 1.25rem;
    height: 60px;
    flex-shrink: 0;
    background: var(--lw-white);
    border-bottom: 1px solid var(--lw-border);
}
.vim-header-left[b-2kq8zed3uk] {
    display: flex;
    align-items: center;
    gap: 0.625rem;
    min-width: 0;
    flex: 1;
    overflow: hidden;
}
.vim-invoice-num[b-2kq8zed3uk] {
    font-size: 1rem;
    font-weight: 700;
    color: var(--lw-primary-dark, #020B2B);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}
.vim-status-badge[b-2kq8zed3uk] {
    display: inline-flex;
    align-items: center;
    height: 24px;
    padding: 0 6px;
    font-family: var(--lw-font-family);
    font-size: 11px;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.025em;
    border-radius: var(--lw-radius-control, 8px);
    white-space: nowrap;
    flex-shrink: 0;
}
.vim-status-secondary[b-2kq8zed3uk] { background: var(--lw-status-neutral-bg); color: var(--lw-gray-arsenic); }
.vim-status-success[b-2kq8zed3uk]   { background: var(--lw-status-success-bg); color: var(--lw-status-success-fg); }
.vim-status-danger[b-2kq8zed3uk]    { background: var(--lw-status-error-bg); color: var(--lw-status-error-fg); }
.vim-status-warning[b-2kq8zed3uk]   { background: var(--lw-status-warning-bg); color: var(--lw-status-warning-fg); }
.vim-status-info[b-2kq8zed3uk]      { background: var(--lw-status-info-bg); color: var(--lw-status-info-fg); }

/* PR-#### linked payment request badge in the header */
.vim-pr-badge[b-2kq8zed3uk] {
    display: inline-flex;
    align-items: center;
    height: 22px;
    padding: 0 8px;
    font-family: "Inter", -apple-system, BlinkMacSystemFont, sans-serif;
    font-size: 11px;
    font-weight: 700;
    letter-spacing: 0.02em;
    border-radius: var(--lw-radius-control, 8px);
    background: rgba(57, 128, 165, 0.10);
    color: var(--lw-primary-blue, #3980A5);
    border: 1px solid rgba(57, 128, 165, 0.28);
    white-space: nowrap;
    flex-shrink: 0;
    font-variant-numeric: tabular-nums;
}

.vim-header-right[b-2kq8zed3uk] {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    flex-shrink: 0;
}
.vim-header-amount[b-2kq8zed3uk] {
    font-size: 1.125rem;
    font-weight: 700;
    color: var(--lw-primary-dark, #020B2B);
}
.vim-close-btn[b-2kq8zed3uk] {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 32px;
    height: 32px;
    border: none;
    background: transparent;
    cursor: pointer;
    color: var(--lw-gray-graphite, #6E7180);
    transition: color 0.15s;
    font-family: var(--lw-font-family);
    flex-shrink: 0;
}
.vim-close-btn:hover:not(:disabled)[b-2kq8zed3uk] { color: var(--lw-text-primary); }
.vim-close-btn:disabled[b-2kq8zed3uk] { opacity: 0.45; cursor: not-allowed; }

/* Body two-pane */
.vim-body[b-2kq8zed3uk] {
    display: flex;
    flex: 1;
    overflow: hidden;
}

/* Left pane: 60% scrollable muted column */
.vim-left[b-2kq8zed3uk] {
    flex: 1 1 60%;
    display: flex;
    flex-direction: column;
    overflow-y: auto;
    padding: 2rem;
    gap: 0;
    background: var(--lw-bg-muted);
}

/* Right pane */
.vim-right[b-2kq8zed3uk] {
    flex: 0 0 40%;
    border-left: 1px solid var(--lw-border);
    display: flex;
    flex-direction: column;
    overflow: hidden;
    background: var(--lw-white);
}

/* Status stepper: always-expanded vertical track with 18px SQUARE nodes
   (reference invoice-tracker-bar expanded). Completed = success-dark square
   w/ white check, active = white square w/ brand-accent inner square,
   pending = 40% tracking-grey. */
.vim-tracker-stepper[b-2kq8zed3uk] {
    display: flex;
    flex-direction: column;
}
.vim-step-row[b-2kq8zed3uk] { display: flex; align-items: stretch; }
.vim-step-track[b-2kq8zed3uk] {
    display: flex;
    flex-direction: column;
    align-items: center;
    width: 18px;
    flex-shrink: 0;
}
.vim-step-node[b-2kq8zed3uk] {
    width: 18px;
    height: 18px;
    flex-shrink: 0;
    display: flex;
    align-items: center;
    justify-content: center;
}
/* success-dark #2D7A5F per the reference tracker -- NOT the success text
   token, which resolves darker (#1F5C47). */
.vim-step-done[b-2kq8zed3uk]   { background: #2D7A5F; color: var(--lw-white); }
.vim-step-active[b-2kq8zed3uk] { border: 1.5px solid var(--lw-primary-blue); background: var(--lw-white); }
.vim-step-future[b-2kq8zed3uk] { background: rgba(211, 214, 224, 0.4); }
.vim-step-active-dot[b-2kq8zed3uk] { width: 7px; height: 7px; background: var(--lw-primary-blue); }
.vim-step-line[b-2kq8zed3uk] { width: 1px; flex: 1; background: var(--lw-border); min-height: 22px; }
.vim-step-line-done[b-2kq8zed3uk] { background: #2D7A5F; }
.vim-step-content[b-2kq8zed3uk] {
    padding-left: 12px;
    display: flex;
    flex-direction: column;
    min-width: 0;
    flex: 1;
}
.vim-step-gap[b-2kq8zed3uk] { padding-bottom: 18px; }
.vim-step-label[b-2kq8zed3uk] { display: block; font-size: 13px; font-weight: 500; line-height: 18px; }
.vim-step-label-done[b-2kq8zed3uk]   { color: var(--lw-text-primary); }
.vim-step-label-active[b-2kq8zed3uk] { color: var(--lw-primary-blue); }
.vim-step-label-future[b-2kq8zed3uk] { color: var(--lw-gray-space); }
.vim-step-date[b-2kq8zed3uk] {
    margin-left: 0.375rem;
    font-size: 11px;
    font-weight: 400;
    color: var(--lw-gray-space);
}
.vim-step-progress[b-2kq8zed3uk] {
    margin-left: 0.375rem;
    font-size: 11px;
    font-weight: 400;
    color: color-mix(in srgb, var(--lw-primary-blue) 50%, transparent);
}

/* Field rows: label on the left, value on the right, horizontal divider between rows. */
.vim-field-rows[b-2kq8zed3uk] {
    display: flex;
    flex-direction: column;
}
.vim-field-row[b-2kq8zed3uk] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    min-height: 32px;
    padding: 0.625rem 0;
    border-bottom: 1px solid var(--lw-border);
}
.vim-field-row:last-child[b-2kq8zed3uk] { border-bottom: none; }
.vim-field-label[b-2kq8zed3uk] {
    flex-shrink: 0;
    font-size: 0.6875rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.04em;
    color: var(--lw-gray-graphite, #6E7180);
}
.vim-field-value[b-2kq8zed3uk] {
    text-align: right;
    font-size: 0.875rem;
    font-weight: 400;
    color: var(--lw-text-primary);
    overflow-wrap: anywhere;
}
.vim-field-muted[b-2kq8zed3uk] { font-weight: 400; color: var(--lw-gray-graphite, #6E7180); }
.vim-field-link[b-2kq8zed3uk]  { color: var(--lw-primary-blue); }
.vim-aging-overdue[b-2kq8zed3uk]  { color: var(--lw-status-error-fg); }
.vim-aging-due-soon[b-2kq8zed3uk] { color: var(--lw-status-warning-fg); }
.vim-aging-current[b-2kq8zed3uk]  { color: var(--lw-status-success-fg); }

/* Summary column body. Plain text -- no bordered box -- to read as a sibling
   to the details list rather than a callout. */
.vim-summary-body[b-2kq8zed3uk] {
    margin: 0;
    font-size: 0.875rem;
    color: var(--lw-primary-dark, #020B2B);
    line-height: 1.6;
    white-space: pre-wrap;
    word-break: break-word;
}
.vim-summary-empty[b-2kq8zed3uk] {
    margin: 0;
    font-size: 0.875rem;
    color: var(--lw-gray-graphite, #6E7180);
    font-style: italic;
    line-height: 1.6;
}

/* Attach header */
.vim-attach-header[b-2kq8zed3uk] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 0.75rem;
    gap: 0.5rem;
    flex-wrap: wrap;
}
.vim-attach-title-wrap[b-2kq8zed3uk] { display: flex; align-items: center; gap: 0.375rem; }
.vim-attach-actions[b-2kq8zed3uk] { display: flex; gap: 0.375rem; }
.vim-attach-btn[b-2kq8zed3uk] {
    height: 28px;
    padding: 0 0.625rem;
    font-size: 0.75rem;
    font-weight: 500;
    border: 1px solid var(--lw-primary-dark, #020B2B);
    color: var(--lw-primary-dark, #020B2B);
    background: transparent;
    cursor: pointer;
    font-family: var(--lw-font-family);
    transition: background 0.15s;
}
.vim-attach-btn:hover:not(:disabled)[b-2kq8zed3uk] { background: var(--lw-bg-muted, #F7F7F5); }
.vim-attach-btn:disabled[b-2kq8zed3uk] { opacity: 0.45; cursor: not-allowed; }

/* Edit Invoice form internals (canonical input recipes). */
.vim-edit-fields[b-2kq8zed3uk] {
    display: flex;
    flex-direction: column;
    gap: 16px;
}

.vim-date-grid[b-2kq8zed3uk] {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 16px;
}

@media (max-width: 639px) {
    .vim-date-grid[b-2kq8zed3uk] { grid-template-columns: 1fr; }
}

.vim-edit-actions[b-2kq8zed3uk] {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: 8px;
    margin-top: 4px;
}

/* FieldShell chrome for the payee dropdown + Amount numeric field (recipe
   mirrors LwTextField.razor.css: 54px white box, 8px radius, 14/400 value,
   muted -> graphite -> phantom label states). */
.vim-editfield[b-2kq8zed3uk]  .mud-input-helper-text {
    font-family: var(--lw-font-family);
    font-size: 13px;
    line-height: 18px;
    margin-top: 4px;
}

.vim-editfield[b-2kq8zed3uk]  .mud-input-control { margin-top: 0; }

.vim-editfield[b-2kq8zed3uk]  .mud-input-outlined {
    font-size: 14px;
    font-weight: 400;
    background-color: var(--lw-white);
    border-radius: var(--lw-radius-control);
}

.vim-editfield[b-2kq8zed3uk]  .mud-input-outlined input.mud-input-slot {
    height: 54px;
    box-sizing: border-box;
    padding: 16px 14px;
    font-size: 14px;
    font-weight: 400;
    /* 16 + 22 + 16 = 54 -- centers the text block exactly like FieldShell. */
    line-height: 22px;
}

.vim-editfield[b-2kq8zed3uk]  .mud-input-adornment-start + input.mud-input-slot {
    padding-left: 6px;
}

.vim-editfield[b-2kq8zed3uk]  .mud-input-adornment-text {
    font-size: 14px;
    color: var(--lw-gray-graphite);
}

.vim-editfield[b-2kq8zed3uk]  .mud-input-label {
    font-size: 14px;
    font-weight: 400;
    line-height: 22px;
    letter-spacing: normal;
    color: var(--lw-gray-space);
}

.vim-editfield[b-2kq8zed3uk]  .mud-input-label-outlined {
    top: 50%;
    transform: translate(13px, -50%) scale(1);
    padding: 0 2px !important;
    transition: top 0.2s cubic-bezier(0, 0, 0.2, 1), transform 0.2s cubic-bezier(0, 0, 0.2, 1), color 0.2s;
}

.vim-editfield[b-2kq8zed3uk]  .mud-shrink ~ label.mud-input-label.mud-input-label-inputcontrol.mud-input-label-outlined,
.vim-editfield[b-2kq8zed3uk]  .mud-input:focus-within ~ label.mud-input-label.mud-input-label-inputcontrol.mud-input-label-outlined {
    top: 0;
    transform: translate(13px, -6px) scale(0.857);
}

.vim-editfield[b-2kq8zed3uk]  .mud-shrink ~ label.mud-input-label.mud-input-label-inputcontrol.mud-input-label-outlined {
    color: var(--lw-gray-graphite);
}

.vim-editfield[b-2kq8zed3uk]  .mud-input:focus-within ~ label.mud-input-label.mud-input-label-inputcontrol.mud-input-label-outlined {
    color: var(--lw-gray-phantom);
}

.vim-editfield[b-2kq8zed3uk]  .mud-input.mud-input-outlined:not(.mud-disabled):not(:focus-within):hover .mud-input-outlined-border {
    border-color: var(--lw-input-border);
}

.vim-editfield[b-2kq8zed3uk]  .mud-input.mud-input-outlined:focus-within > .mud-input-outlined-border,
.vim-editfield[b-2kq8zed3uk]  .mud-input.mud-input-outlined:focus-within .mud-shrink > .mud-input-outlined-border {
    border-width: 1px;
    border-color: var(--lw-gray-phantom);
}

/* Dropdown caret / clear buttons: gray-space like the LwSelect caret. */
.vim-editfield[b-2kq8zed3uk]  .mud-input-adornment .mud-icon-button,
.vim-editfield[b-2kq8zed3uk]  .mud-icon-button-edge-end {
    color: var(--lw-gray-space);
}

/* "Edit" action in the Invoice details card header (accent link recipe). */
.vim-edit-link[b-2kq8zed3uk] {
    border: none;
    background: transparent;
    padding: 0.25rem 0.375rem;
    font-size: 0.8125rem;
    font-weight: 500;
    color: var(--lw-primary-blue);
    cursor: pointer;
    font-family: var(--lw-font-family);
    text-underline-offset: 4px;
}
.vim-edit-link:hover[b-2kq8zed3uk] { text-decoration: underline; }

/* Upload box */
.vim-upload-box[b-2kq8zed3uk] {
    border: 1px solid var(--lw-border);
    background: var(--lw-white);
    padding: 0.75rem;
    margin-bottom: 0.75rem;
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
}
.vim-upload-title[b-2kq8zed3uk] { font-size: 0.8125rem; font-weight: 600; color: var(--lw-primary-dark, #020B2B); margin: 0; }
.vim-upload-hint[b-2kq8zed3uk]  { font-size: 0.75rem; color: var(--lw-gray-graphite, #6E7180); margin: 0; }
.vim-file-list[b-2kq8zed3uk] { display: flex; flex-direction: column; gap: 0; }
.vim-file-row[b-2kq8zed3uk] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.375rem 0;
    border-bottom: 1px solid var(--lw-border);
}
.vim-file-row:last-child[b-2kq8zed3uk] { border-bottom: none; }
.vim-file-name[b-2kq8zed3uk] { font-size: 0.8125rem; font-weight: 500; flex: 1; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.vim-file-size[b-2kq8zed3uk] { font-size: 0.75rem; color: var(--lw-gray-graphite, #6E7180); white-space: nowrap; }
.vim-file-remove[b-2kq8zed3uk] {
    display: flex;
    align-items: center;
    background: transparent;
    border: none;
    cursor: pointer;
    color: var(--lw-status-error-fg);
    padding: 2px;
    flex-shrink: 0;
}
.vim-upload-submit-btn[b-2kq8zed3uk] {
    display: inline-flex;
    align-items: center;
    height: 32px;
    padding: 0 0.75rem;
    font-size: 0.8125rem;
    font-weight: 500;
    background: var(--lw-primary-dark, #020B2B);
    color: var(--lw-white);
    border: none;
    cursor: pointer;
    font-family: var(--lw-font-family);
    align-self: flex-start;
    transition: opacity 0.15s;
}
.vim-upload-submit-btn:disabled[b-2kq8zed3uk] { opacity: 0.45; cursor: not-allowed; }

/* Document list */
.vim-doc-list[b-2kq8zed3uk] { display: flex; flex-direction: column; gap: 4px; }
.vim-doc-row[b-2kq8zed3uk] {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    padding: 0.625rem 0.75rem;
    border: 1px solid var(--lw-border);
    background: var(--lw-white);
    cursor: pointer;
    transition: background 0.12s, border-color 0.12s;
}
.vim-doc-row:hover[b-2kq8zed3uk] { background: var(--lw-bg-row-hover); }
.vim-doc-row-active[b-2kq8zed3uk] { border-color: var(--lw-primary-blue); background: var(--lw-white); }
.vim-doc-icon[b-2kq8zed3uk] {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 40px;
    height: 40px;
    background: var(--lw-status-error-bg);
    color: var(--lw-status-error-fg);
    flex-shrink: 0;
}
.vim-doc-info[b-2kq8zed3uk] { flex: 1; min-width: 0; }
.vim-doc-name[b-2kq8zed3uk] { display: block; font-size: 0.875rem; font-weight: 500; color: var(--lw-primary-dark, #020B2B); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.vim-doc-meta[b-2kq8zed3uk] { display: block; font-size: 0.75rem; color: var(--lw-gray-graphite, #6E7180); margin-top: 2px; }
.vim-doc-download[b-2kq8zed3uk] {
    display: flex;
    align-items: center;
    background: transparent;
    border: none;
    cursor: pointer;
    color: var(--lw-gray-graphite, #6E7180);
    padding: 4px;
    flex-shrink: 0;
}
.vim-doc-download:hover[b-2kq8zed3uk] { color: var(--lw-primary-dark, #020B2B); }

/* Photos count badge (ControlCard header action) */
.vim-count-badge[b-2kq8zed3uk] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 20px;
    height: 20px;
    padding: 0 4px;
    border-radius: var(--lw-radius-control, 8px);
    background: var(--lw-bg-muted);
    color: var(--lw-gray-graphite, #6E7180);
    font-size: 11px;
    font-weight: 600;
    line-height: 1;
}

/* Image tiles */
.vim-image-tiles[b-2kq8zed3uk] { display: flex; flex-wrap: wrap; gap: 8px; }
.vim-image-tile[b-2kq8zed3uk] {
    width: 76px;
    height: 76px;
    border: 1px solid var(--lw-border);
    border-radius: var(--lw-radius-control, 8px);
    background: var(--lw-white);
    overflow: hidden;
    cursor: pointer;
    position: relative;
    transition: border-color 0.12s, box-shadow 0.12s;
}
.vim-image-tile:hover[b-2kq8zed3uk] { border-color: rgba(57, 128, 165, 0.4); }
.vim-image-tile img[b-2kq8zed3uk] { width: 100%; height: 100%; object-fit: cover; display: block; }
.vim-image-tile-active[b-2kq8zed3uk] { border-color: var(--lw-primary-blue); box-shadow: 0 0 0 1px var(--lw-primary-blue); }
.vim-image-add[b-2kq8zed3uk] {
    border: 1px dashed var(--lw-border);
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 2px;
    color: var(--lw-gray-graphite, #6E7180);
    font-size: 10px;
    font-weight: 500;
}
.vim-image-add:hover[b-2kq8zed3uk] { border-color: rgba(57, 128, 165, 0.4); color: var(--lw-primary-blue); }
.vim-image-add-disabled[b-2kq8zed3uk] { opacity: 0.5; cursor: not-allowed; pointer-events: none; }

/* Budget Allocation: BudgetImpactSummary isPaid recipe -- expandable white
   category cards (4px radius) on the flush ControlCard body, line items as
   muted sub-cards when expanded. */
.vim-ba[b-2kq8zed3uk] {
    display: flex;
    flex-direction: column;
    gap: 0.75rem;
    padding: 1rem 1.25rem;
}
.vim-ba-cat-card[b-2kq8zed3uk] {
    border: 1px solid var(--lw-border);
    border-radius: var(--lw-radius-lg, 4px);
    background: var(--lw-white);
    padding: 0.75rem 1rem;
}
.vim-ba-cat-head[b-2kq8zed3uk] {
    display: flex;
    align-items: center;
    gap: 0.375rem;
    width: 100%;
    cursor: pointer;
}
.vim-ba-chev[b-2kq8zed3uk] {
    flex-shrink: 0;
    color: var(--lw-gray-graphite);
    transition: transform 0.15s ease;
}
.vim-ba-chev--open[b-2kq8zed3uk] { transform: rotate(90deg); }
.vim-ba-cat-name[b-2kq8zed3uk] {
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    font-size: 0.875rem;
    font-weight: 600;
    color: var(--lw-text-primary);
}
.vim-ba-cat-amt[b-2kq8zed3uk] {
    margin-left: auto;
    flex-shrink: 0;
    font-size: 0.875rem;
    color: var(--lw-gray-graphite);
    font-variant-numeric: tabular-nums;
}
.vim-ba-items[b-2kq8zed3uk] {
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
    margin-top: 0.75rem;
}
.vim-ba-item[b-2kq8zed3uk] {
    display: flex;
    align-items: center;
    gap: 0.375rem;
    border: 1px solid color-mix(in srgb, var(--lw-border-solid, #dfe3e8) 60%, transparent);
    border-radius: var(--lw-radius-control, 8px);
    background: color-mix(in srgb, var(--lw-bg-muted) 20%, transparent);
    padding: 0.75rem;
}
.vim-ba-item-name[b-2kq8zed3uk] {
    min-width: 0;
    flex: 1;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    font-size: 0.875rem;
    font-weight: 500;
    color: var(--lw-text-primary);
}
.vim-ba-item-amt[b-2kq8zed3uk] {
    flex-shrink: 0;
    font-size: 0.875rem;
    color: var(--lw-gray-graphite);
    font-variant-numeric: tabular-nums;
}

/* Lien releases: white bordered row cards on the reference row recipe
   (rounded-md border bg-background p-3) with an accent link action. */
.vim-lien-list[b-2kq8zed3uk] {
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
}
.vim-lien-row[b-2kq8zed3uk] {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    padding: 0.75rem;
    border: 1px solid var(--lw-border);
    border-radius: var(--lw-radius-control, 8px);
    background: var(--lw-white);
}
.vim-lien-type[b-2kq8zed3uk] {
    display: inline-flex;
    align-items: center;
    flex-shrink: 0;
    padding: 0.125rem 0.375rem;
    font-size: 11px;
    font-weight: 600;
    background: var(--lw-status-info-bg);
    color: var(--lw-status-info-fg);
    border-radius: var(--lw-radius-control, 8px);
}
.vim-lien-date[b-2kq8zed3uk] {
    flex: 1;
    font-size: 0.75rem;
    color: var(--lw-gray-graphite, #6E7180);
}
.vim-lien-view[b-2kq8zed3uk] {
    flex-shrink: 0;
    font-size: 0.8125rem;
    font-weight: 500;
    color: var(--lw-primary-blue);
    text-decoration: none;
    border: none;
    background: transparent;
    padding: 0.25rem 0.375rem;
    cursor: pointer;
    font-family: var(--lw-font-family);
    text-underline-offset: 4px;
}
.vim-lien-view:hover[b-2kq8zed3uk] { text-decoration: underline; }

/* Right pane: segmented Invoice / Photos toggle strip (reference
   RightPaneViewer): h-8 navy-filled active pill, quiet inactive toggles,
   photo count badge; quiet text actions right-aligned. */
.vim-pane-tabs[b-2kq8zed3uk] {
    display: flex;
    align-items: center;
    gap: 0.25rem;
    padding: 0.5rem 0.75rem;
    border-bottom: 1px solid var(--lw-border);
    background: var(--lw-white);
    flex-shrink: 0;
}

.vim-pane-tab[b-2kq8zed3uk] {
    display: inline-flex;
    align-items: center;
    gap: 0.375rem;
    height: 32px;
    padding: 0 0.75rem;
    border: none;
    border-radius: var(--lw-radius-control, 8px);
    background: transparent;
    font-size: 13px;
    font-weight: 500;
    color: var(--lw-gray-graphite, #6E7180);
    font-family: var(--lw-font-family);
    cursor: pointer;
    transition: background 0.15s, color 0.15s;
}

.vim-pane-tab:hover:not(:disabled):not(.vim-pane-tab--active)[b-2kq8zed3uk] {
    background: var(--lw-accent, rgba(145, 158, 171, 0.16));
    color: var(--lw-text-primary);
}

.vim-pane-tab--active[b-2kq8zed3uk] {
    background: var(--lw-primary-dark, #020B2B);
    color: var(--lw-white);
}

.vim-pane-tab:disabled[b-2kq8zed3uk] {
    opacity: 0.4;
    cursor: not-allowed;
}

.vim-pane-tab svg[b-2kq8zed3uk] { flex-shrink: 0; }

.vim-pane-tab-badge[b-2kq8zed3uk] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 16px;
    height: 16px;
    border-radius: 9999px;
    background: color-mix(in srgb, var(--lw-primary-dark, #020B2B) 10%, transparent);
    font-size: 10px;
    font-weight: 600;
    color: var(--lw-primary-dark, #020B2B);
}

.vim-pane-tab--active .vim-pane-tab-badge[b-2kq8zed3uk] {
    background: rgba(255, 255, 255, 0.2);
    color: var(--lw-white);
}

.vim-pane-actions[b-2kq8zed3uk] {
    margin-left: auto;
    display: flex;
    align-items: center;
    gap: 0.25rem;
}

.vim-pane-action[b-2kq8zed3uk] {
    display: inline-flex;
    align-items: center;
    height: 32px;
    padding: 0 0.625rem;
    border: none;
    border-radius: var(--lw-radius-control, 8px);
    background: transparent;
    font-size: 13px;
    font-weight: 500;
    color: var(--lw-gray-graphite, #6E7180);
    font-family: var(--lw-font-family);
    cursor: pointer;
    transition: background 0.15s, color 0.15s;
}

.vim-pane-action:hover:not(:disabled)[b-2kq8zed3uk] {
    background: var(--lw-accent, rgba(145, 158, 171, 0.16));
    color: var(--lw-text-primary);
}

.vim-pane-action:disabled[b-2kq8zed3uk] { opacity: 0.45; cursor: not-allowed; }

/* Per-file toolbar (reference DocumentPreview toolbar): 12px medium filename,
   size-7 ghost icon controls, hairline dividers. */
.vim-pane-toolbar[b-2kq8zed3uk] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 0.5rem;
    padding: 0.5rem 0.75rem;
    border-bottom: 1px solid var(--lw-border);
    background: var(--lw-white);
    flex-shrink: 0;
    min-width: 0;
}

.vim-pane-file[b-2kq8zed3uk] {
    min-width: 0;
    flex: 1;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    font-size: 0.75rem;
    font-weight: 500;
    color: var(--lw-text-primary);
}

.vim-pane-tools[b-2kq8zed3uk] {
    display: flex;
    align-items: center;
    gap: 0.25rem;
    flex-shrink: 0;
}

.vim-pane-icon[b-2kq8zed3uk] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 28px;
    height: 28px;
    border: none;
    background: transparent;
    padding: 0;
    color: var(--lw-gray-graphite, #6E7180);
    cursor: pointer;
    transition: color 0.15s;
}

.vim-pane-icon:hover:not(:disabled)[b-2kq8zed3uk] { color: var(--lw-text-primary); }
.vim-pane-icon:disabled[b-2kq8zed3uk] { opacity: 0.3; cursor: default; }

.vim-pane-count[b-2kq8zed3uk] {
    min-width: 40px;
    text-align: center;
    font-size: 0.75rem;
    font-variant-numeric: tabular-nums;
    color: var(--lw-gray-graphite, #6E7180);
}

.vim-pane-divider[b-2kq8zed3uk] {
    width: 1px;
    height: 16px;
    margin: 0 0.25rem;
    background: var(--lw-border);
}

.vim-preview-close[b-2kq8zed3uk] {
    display: flex;
    align-items: center;
    background: transparent;
    border: none;
    cursor: pointer;
    color: var(--lw-gray-graphite, #6E7180);
    padding: 2px;
    flex-shrink: 0;
}
.vim-preview-body[b-2kq8zed3uk] { flex: 1; overflow: hidden; display: flex; flex-direction: column; min-height: 0; }

/* Drafting-table stage: white with a 16px dot grid; the document floats as a
   shadowed page sheet (reference document-preview viewer). */
.vim-preview-stage[b-2kq8zed3uk] {
    flex: 1;
    min-height: 0;
    display: flex;
    padding: 1.5rem;
    background-color: var(--lw-white);
    background-image: radial-gradient(color-mix(in srgb, #1e1e24 5%, transparent) 1.5px, transparent 1.5px);
    background-size: 16px 16px;
}
.vim-preview-page[b-2kq8zed3uk] {
    flex: 1;
    min-height: 0;
    margin: auto;
    width: 100%;
    height: 100%;
    border: 1px solid var(--lw-border);
    border-radius: var(--lw-radius-control, 8px);
    background: var(--lw-white);
    box-shadow: var(--lw-shadow-card);
    overflow: hidden;
}
.vim-preview-page iframe[b-2kq8zed3uk] { width: 100%; height: 100%; border: none; display: block; }
.vim-preview-loading[b-2kq8zed3uk] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    height: 100%;
    gap: 1rem;
    color: var(--lw-gray-graphite, #6E7180);
    font-size: 0.875rem;
}
.vim-preview-img-wrap[b-2kq8zed3uk] {
    width: 100%;
    height: 100%;
    overflow: auto;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 1rem;
}
.vim-preview-img-wrap img[b-2kq8zed3uk] { max-width: 100%; max-height: 100%; object-fit: contain; }
.vim-preview-unavail[b-2kq8zed3uk] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    height: 100%;
    gap: 0.5rem;
    padding: 2rem;
    text-align: center;
}
.vim-preview-unavail-title[b-2kq8zed3uk] { font-size: 0.875rem; font-weight: 600; color: var(--lw-primary-dark, #020B2B); }
.vim-preview-unavail-desc[b-2kq8zed3uk]  { font-size: 0.8125rem; color: var(--lw-gray-graphite, #6E7180); }
.vim-preview-download-btn[b-2kq8zed3uk] {
    display: inline-flex;
    align-items: center;
    height: 32px;
    padding: 0 0.75rem;
    font-size: 0.8125rem;
    font-weight: 500;
    background: var(--lw-primary-dark, #020B2B);
    color: var(--lw-white);
    border: none;
    cursor: pointer;
    font-family: var(--lw-font-family);
    margin-top: 0.5rem;
}
.vim-preview-empty[b-2kq8zed3uk] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    height: 100%;
    gap: 0.75rem;
    color: var(--lw-gray-graphite, #6E7180);
    font-size: 0.8125rem;
}

/* Footer */
.vim-footer[b-2kq8zed3uk] {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    padding: 0.75rem 1.25rem;
    background: var(--lw-white);
    border-top: 1px solid var(--lw-border);
    flex-shrink: 0;
}
.vim-footer-close[b-2kq8zed3uk] {
    display: inline-flex;
    align-items: center;
    height: 36px;
    padding: 0 1.25rem;
    font-size: 0.875rem;
    font-weight: 500;
    background: var(--lw-primary-dark, #020B2B);
    color: var(--lw-white);
    border: none;
    border-radius: var(--lw-radius-control, 8px);
    cursor: pointer;
    font-family: var(--lw-font-family);
    transition: opacity 0.15s;
}
.vim-footer-close:hover:not(:disabled)[b-2kq8zed3uk] { opacity: 0.88; }
.vim-footer-close:disabled[b-2kq8zed3uk] { opacity: 0.45; cursor: not-allowed; }

/* Photo tile remove: corner chip; arming turns it destructive (two-step idiom). */
.vim-tile-remove[b-2kq8zed3uk] {
    position: absolute;
    top: 3px;
    right: 3px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 18px;
    height: 18px;
    padding: 0;
    border: none;
    border-radius: 50%;
    background: rgba(2, 11, 43, 0.55);
    color: var(--lw-white);
    cursor: pointer;
    transition: background 0.15s;
}
.vim-tile-remove:hover:not(:disabled)[b-2kq8zed3uk] { background: var(--lw-destructive); }
.vim-tile-remove--armed[b-2kq8zed3uk] { background: var(--lw-destructive); }
.vim-tile-remove:disabled[b-2kq8zed3uk] { opacity: 0.4; cursor: default; }

/* Toolbar remove-attachment: quiet icon that arms to destructive. */
.vim-pane-icon--danger:hover:not(:disabled)[b-2kq8zed3uk] { color: var(--lw-destructive); }
.vim-pane-icon--armed[b-2kq8zed3uk] { color: var(--lw-destructive); background: rgba(184, 53, 48, 0.1); border-radius: var(--lw-radius-control, 8px); }

/* Invoice numbers editor: chips with inline rename/remove plus an add row. */
.vim-numbers[b-2kq8zed3uk] {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 8px;
}
.vim-number-chip[b-2kq8zed3uk] {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    height: 28px;
    padding: 0 6px 0 10px;
    border: 1px solid var(--lw-border);
    border-radius: var(--lw-radius-control, 8px);
    background: var(--lw-bg-muted);
    font-size: 0.8125rem;
    font-weight: 500;
    color: var(--lw-text-primary);
}
.vim-number-text[b-2kq8zed3uk] { line-height: 1; }
.vim-number-chip-btn[b-2kq8zed3uk] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 18px;
    height: 18px;
    padding: 0;
    border: none;
    border-radius: 50%;
    background: transparent;
    color: var(--lw-gray-graphite, #6E7180);
    cursor: pointer;
    transition: color 0.15s, background 0.15s;
}
.vim-number-chip-btn:hover:not(:disabled)[b-2kq8zed3uk] { color: var(--lw-primary-blue); }
.vim-number-chip-btn--danger:hover:not(:disabled)[b-2kq8zed3uk] { color: var(--lw-destructive); }
.vim-number-chip-btn--armed[b-2kq8zed3uk] { color: var(--lw-destructive); background: rgba(184, 53, 48, 0.12); }
.vim-number-chip-btn:disabled[b-2kq8zed3uk] { opacity: 0.4; cursor: default; }
.vim-number-addrow[b-2kq8zed3uk],
.vim-number-editrow[b-2kq8zed3uk] {
    display: inline-flex;
    align-items: center;
    gap: 6px;
}
.vim-number-input[b-2kq8zed3uk] {
    height: 28px;
    width: 160px;
    padding: 0 8px;
    border: 1px solid var(--lw-input-border);
    border-radius: var(--lw-radius-control, 8px);
    background: var(--lw-form-surface, #FCFDFE);
    font-size: 0.8125rem;
    font-family: var(--lw-font-family);
    color: var(--lw-text-primary);
}
.vim-number-input:focus[b-2kq8zed3uk] { outline: 2px solid var(--lw-primary-blue); outline-offset: -1px; }
.vim-number-btn[b-2kq8zed3uk] {
    display: inline-flex;
    align-items: center;
    height: 28px;
    padding: 0 10px;
    border: 1px solid var(--lw-border);
    border-radius: var(--lw-radius-control, 8px);
    background: var(--lw-white);
    font-size: 0.75rem;
    font-weight: 600;
    font-family: var(--lw-font-family);
    color: var(--lw-gray-graphite, #6E7180);
    cursor: pointer;
    transition: background 0.15s, color 0.15s;
}
.vim-number-btn:hover:not(:disabled)[b-2kq8zed3uk] { color: var(--lw-text-primary); }
.vim-number-btn--primary[b-2kq8zed3uk] {
    border-color: var(--lw-primary-blue);
    background: var(--lw-primary-blue);
    color: var(--lw-primary-blue-fg, #FFFFFF);
}
.vim-number-btn--primary:hover:not(:disabled)[b-2kq8zed3uk] { opacity: 0.9; color: var(--lw-primary-blue-fg, #FFFFFF); }
.vim-number-btn:disabled[b-2kq8zed3uk] { opacity: 0.5; cursor: default; }

@media (max-width: 767px) {
    .vim-right[b-2kq8zed3uk] { display: none; }
    .vim-left[b-2kq8zed3uk] { padding: 1rem; }
}
/* _content/Ledgerwise/Components/Modals/ViewInvoiceModalSkeleton.razor.rz.scp.css */
.vims-root[b-88zal8kuk8] {
    display: flex;
    flex-direction: column;
    padding: 0;
    width: 100%;
}

/* Shimmer base */
.vims-shimmer[b-88zal8kuk8] {
    background: linear-gradient(
        90deg,
        rgba(211, 214, 224, 0.45) 0%,
        rgba(211, 214, 224, 0.85) 50%,
        rgba(211, 214, 224, 0.45) 100%
    );
    background-size: 200% 100%;
    animation: vims-shimmer-slide-b-88zal8kuk8 1.4s ease-in-out infinite;
    border-radius: 3px;
}

@keyframes vims-shimmer-slide-b-88zal8kuk8 {
    0%   { background-position: 200% 0; }
    100% { background-position: -200% 0; }
}

/* Tracker bar */
.vims-tracker[b-88zal8kuk8] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    height: 40px;
    padding: 0 0.75rem;
    border: 1px solid var(--lw-border);
    background: var(--lw-white);
}
.vims-tracker-label[b-88zal8kuk8]   { height: 12px; width: 110px; }
.vims-tracker-summary[b-88zal8kuk8] { height: 18px; width: 90px; }

/* Divider */
.vims-divider[b-88zal8kuk8] {
    height: 1px;
    background: var(--lw-gray-smoke, #D3D6E0);
    margin: 1rem 0;
}

/* Section titles */
.vims-section-title[b-88zal8kuk8]          { height: 14px; width: 130px; margin-bottom: 0.75rem; }
.vims-section-title-inline[b-88zal8kuk8]   { height: 14px; width: 110px; }
.vims-section-title-sm[b-88zal8kuk8]       { height: 12px; width: 70px; margin-bottom: 0.625rem; }

/* Fields grid */
.vims-fields-grid[b-88zal8kuk8] {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 1rem;
}
.vims-field[b-88zal8kuk8] { display: flex; flex-direction: column; gap: 6px; }
.vims-field-label[b-88zal8kuk8] { height: 10px; width: 60%; }
.vims-field-value[b-88zal8kuk8] { height: 14px; width: 80%; }

/* Summary lines */
.vims-summary[b-88zal8kuk8] { display: flex; flex-direction: column; gap: 6px; }
.vims-line[b-88zal8kuk8] { height: 12px; }
.vims-line-100[b-88zal8kuk8] { width: 100%; }
.vims-line-90[b-88zal8kuk8]  { width: 90%; }
.vims-line-70[b-88zal8kuk8]  { width: 70%; }

/* Attachments header */
.vims-attach-header[b-88zal8kuk8] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 0.75rem;
}
.vims-attach-actions[b-88zal8kuk8] { display: flex; gap: 0.375rem; }
.vims-btn[b-88zal8kuk8] { height: 28px; width: 92px; }

/* Document rows */
.vims-doc-list[b-88zal8kuk8] { display: flex; flex-direction: column; gap: 4px; }
.vims-doc-row[b-88zal8kuk8] {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    padding: 0.625rem 0.75rem;
    border: 1px solid var(--lw-border);
    background: var(--lw-white);
}
.vims-doc-icon[b-88zal8kuk8] { width: 40px; height: 40px; flex-shrink: 0; border-radius: 0; }
.vims-doc-info[b-88zal8kuk8] { display: flex; flex-direction: column; gap: 6px; flex: 1; min-width: 0; }
.vims-doc-name[b-88zal8kuk8] { height: 12px; width: 60%; }
.vims-doc-meta[b-88zal8kuk8] { height: 10px; width: 40%; }

/* Photos */
.vims-photos-section[b-88zal8kuk8] { display: flex; flex-direction: column; gap: 0.625rem; margin-top: 0.75rem; }
.vims-image-tiles[b-88zal8kuk8] { display: flex; gap: 8px; }
.vims-image-tile[b-88zal8kuk8] { width: 76px; height: 76px; border-radius: 0; }

@media (max-width: 767px) {
    .vims-fields-grid[b-88zal8kuk8] { grid-template-columns: repeat(2, 1fr); }
}
/* _content/Ledgerwise/Components/Modals/WireInstructionsModal.razor.rz.scp.css */
/* -- MudDialog shell overrides (scoped via ::deep) -- */
[b-e8o93jyr5t] .mud-dialog.wim-dialog {
    border-radius: 8px;
    overflow: hidden;
    box-shadow: 0 10px 24px -8px rgba(2, 11, 43, 0.18),
                0 0 0 1px rgba(145, 158, 171, 0.16);
    background: var(--lw-white);
    color: var(--lw-primary-dark, #020B2B);
    font-family: var(--lw-font-family, sans-serif);
}

[b-e8o93jyr5t] .mud-dialog.wim-dialog .mud-dialog-title {
    padding: 1rem 1.25rem;
    border-bottom: 1px solid rgba(145, 158, 171, 0.2);
}

[b-e8o93jyr5t] .mud-dialog.wim-dialog .mud-dialog-content {
    padding: 1.25rem;
}

[b-e8o93jyr5t] .mud-dialog.wim-dialog .mud-dialog-actions {
    padding: 0.75rem 1.25rem;
    border-top: 1px solid rgba(145, 158, 171, 0.2);
    gap: 0.5rem;
}

/* -- Header -- */
.wim-header[b-e8o93jyr5t] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    width: 100%;
}

.wim-title[b-e8o93jyr5t] {
    margin: 0;
    font-size: 1rem;
    font-weight: 600;
    line-height: 1.3;
    color: var(--lw-primary-dark, #020B2B);
    font-family: var(--lw-font-family, sans-serif);
}

.wim-close[b-e8o93jyr5t] {
    flex-shrink: 0;
    width: 28px;
    height: 28px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    background: transparent;
    border: 0;
    color: var(--lw-gray-graphite, #6E7180);
    cursor: pointer;
    transition: color 0.15s;
}

.wim-close:hover[b-e8o93jyr5t] {
    color: var(--lw-primary-dark, #020B2B);
}

/* -- Success banner -- */
.wim-banner[b-e8o93jyr5t] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.75rem 0.875rem;
    margin-bottom: 1rem;
    border-radius: 6px;
    background: var(--lw-bg-muted, #F7F7F5);
    color: var(--lw-status-success-fg, #1B7A53);
    font-size: 0.8125rem;
    font-weight: 600;
}

/* -- Instructions card -- */
.wim-instructions[b-e8o93jyr5t] {
    border: 1px solid rgba(145, 158, 171, 0.2);
    border-radius: 8px;
    padding: 0.875rem 1rem;
    background: var(--lw-white);
}

.wim-instructions-head[b-e8o93jyr5t] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    padding-bottom: 0.625rem;
    margin-bottom: 0.25rem;
    border-bottom: 1px solid rgba(145, 158, 171, 0.16);
    color: var(--lw-primary-dark, #020B2B);
    font-size: 0.875rem;
    font-weight: 600;
}

.wim-row[b-e8o93jyr5t] {
    display: flex;
    align-items: baseline;
    justify-content: space-between;
    gap: 1rem;
    padding: 0.5rem 0;
}

.wim-row + .wim-row[b-e8o93jyr5t] {
    border-top: 1px solid rgba(145, 158, 171, 0.12);
}

.wim-row-label[b-e8o93jyr5t] {
    font-size: 0.8125rem;
    font-weight: 500;
    color: var(--lw-gray-graphite, #6E7180);
}

.wim-row-value[b-e8o93jyr5t] {
    font-size: 0.875rem;
    font-weight: 600;
    color: var(--lw-primary-dark, #020B2B);
    font-variant-numeric: tabular-nums;
    text-align: right;
}

.wim-note[b-e8o93jyr5t] {
    margin: 0.75rem 0 0;
    font-size: 0.75rem;
    line-height: 1.45;
    color: var(--lw-gray-graphite, #6E7180);
}

/* -- Copy / Download action row -- */
.wim-actions-row[b-e8o93jyr5t] {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 0.5rem;
    margin-top: 0.875rem;
}

.wim-btn-outline[b-e8o93jyr5t] {
    width: 100%;
    background: var(--lw-white);
    color: var(--lw-primary-dark, #020B2B);
    border: 1px solid rgba(145, 158, 171, 0.32);
}

.wim-btn-outline:hover:not(:disabled)[b-e8o93jyr5t] {
    background: var(--lw-bg-muted, #F7F7F5);
    border-color: rgba(145, 158, 171, 0.48);
}

.wim-btn-outline:disabled[b-e8o93jyr5t] {
    opacity: 0.6;
    cursor: not-allowed;
}

/* -- Done button -- */
.wim-btn[b-e8o93jyr5t] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 0.5rem;
    height: 32px;
    padding: 0 1rem;
    border-radius: 6px;
    font-size: 0.8125rem;
    font-weight: 600;
    line-height: 1;
    font-family: var(--lw-font-family, sans-serif);
    cursor: pointer;
    transition: background-color 0.15s, border-color 0.15s;
}

.wim-btn-done[b-e8o93jyr5t] {
    background: var(--lw-primary-dark, #020B2B);
    color: var(--lw-white);
    border: 1px solid var(--lw-primary-dark, #020B2B);
}

.wim-btn-done:hover[b-e8o93jyr5t] {
    background: var(--lw-primary-dark-hover);
    border-color: var(--lw-primary-dark-hover);
}
/* _content/Ledgerwise/Components/Pages/Admin/AddCommunityBudgetTemplateDialog.razor.rz.scp.css */
/* Canonical dialog body stack; footer bleeds out of the 24px LwModalBody
   padding (same recipe as AddInteriorDesignerInlineDialog). */
.dlg-fields[b-qmwlxfabv1] {
    display: flex;
    flex-direction: column;
    gap: 16px;
    /* lw-modal--scroll: the body clips, this region scrolls, footer stays pinned. */
    flex: 1 1 auto;
    min-height: 0;
    overflow-y: auto;
}

.dlg-footbleed[b-qmwlxfabv1] {
    flex-shrink: 0;
}

.dlg-footbleed[b-qmwlxfabv1] {
    margin: 16px -24px -24px;
}

.dlg-section[b-qmwlxfabv1] {
    display: flex;
    flex-direction: column;
    gap: 8px;
}

.dlg-section-title[b-qmwlxfabv1] {
    margin: 0;
    font-family: var(--lw-font-family);
    font-size: 14px;
    font-weight: var(--lw-font-semibold);
    color: var(--lw-text-primary);
}

.dlg-section-sub[b-qmwlxfabv1] {
    margin: 0;
    font-size: 13px;
    color: var(--lw-gray-graphite);
}

.dlg-hint[b-qmwlxfabv1] {
    margin: 0;
    font-size: 12px;
    color: var(--lw-gray-graphite);
}

/* Two-column format example -- lw-table header/row tokens at mini scale. */
.dlg-format-table[b-qmwlxfabv1] {
    max-width: 400px;
    border: 1px solid var(--lw-border);
    border-radius: var(--lw-radius-control);
    overflow: hidden;
}

.dlg-format-table table[b-qmwlxfabv1] {
    width: 100%;
    border-collapse: collapse;
    font-size: 13px;
}

.dlg-format-table th[b-qmwlxfabv1] {
    padding: 8px 12px;
    text-align: left;
    font-weight: var(--lw-font-medium);
    color: var(--lw-gray-graphite);
    background: var(--lw-bg-table-header);
    border-bottom: 1px solid var(--lw-border);
}

.dlg-format-table td[b-qmwlxfabv1] {
    padding: 6px 12px;
    color: var(--lw-text-primary);
    border-bottom: 1px solid var(--lw-border);
}

.dlg-format-table tr:last-child td[b-qmwlxfabv1] {
    border-bottom: none;
}

/* Inline extraction-in-progress row. */
.dlg-busy-note[b-qmwlxfabv1] {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 12px 16px;
    border: 1px solid var(--lw-border);
    border-radius: var(--lw-radius-card);
    background: var(--lw-status-info-bg);
    font-size: 14px;
    color: var(--lw-text-primary);
}

/* Extracted category/line-item preview list. */
.dlg-extract-list[b-qmwlxfabv1] {
    max-height: 300px;
    overflow-y: auto;
    border: 1px solid var(--lw-border);
    border-radius: var(--lw-radius-control);
    padding: 12px 16px;
    display: flex;
    flex-direction: column;
    gap: 10px;
}

.dlg-extract-cat[b-qmwlxfabv1] {
    display: flex;
    flex-direction: column;
    gap: 2px;
}

.dlg-extract-cat-name[b-qmwlxfabv1] {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    font-size: 14px;
    font-weight: var(--lw-font-semibold);
    color: var(--lw-text-primary);
}

.dlg-extract-cat-name[b-qmwlxfabv1]  .mud-icon-root {
    color: var(--lw-gray-graphite);
}

.dlg-extract-item[b-qmwlxfabv1] {
    padding-left: 22px;
    font-size: 13px;
    color: var(--lw-gray-graphite);
}
/* _content/Ledgerwise/Components/Pages/Admin/AddVendorDialog.razor.rz.scp.css */
/* Field stack per the canonical dialog body (gap-16); footer bleeds out of
   the 24px LwModalBody padding (same recipe as AddInteriorDesignerInlineDialog). */
.dlg-fields[b-poptq2we3q] {
    display: flex;
    flex-direction: column;
    gap: 16px;
}

.dlg-grid2[b-poptq2we3q] {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 16px;
}

.dlg-footbleed[b-poptq2we3q] {
    margin: 16px -24px -24px;
}
/* _content/Ledgerwise/Components/Pages/Admin/AdminDashboard.razor.rz.scp.css */
/* ============================================================
   Admin dashboard -- white title zone + underline tab bar over
   full-bleed tab panels, each tab rendering the canonical
   toolbar bar (lw-page-toolbar) + muted body. Tab chrome mirrors
   the approved Project.razor.css recipe (project detail tabs);
   toolbar/table/empty-state chrome comes from the shared
   lw-page.css / lw-table.css primitives. 2026-07-28.
   ============================================================ */

/* Shell: escape the layout's pa-6 so the white head zone and the
   muted panels bleed edge-to-edge (same recipe as .lw-page-shell). */
.adm-shell[b-533alhoi9u] {
    display: flex;
    flex-direction: column;
    margin: -24px;
    min-height: calc(100% + 48px);
    background: var(--lw-bg-muted);
}

/* White identity zone above the tab strip; the 16px white gap below
   it is painted by the tabbar's own top padding. */
.adm-head-zone[b-533alhoi9u] {
    display: flex;
    flex-direction: column;
    gap: 2px;
    background: var(--lw-white);
    padding: 20px 24px 0;
}

/* --- Tab strip (Project.razor.css recipe) ------------------- */

.adm-tabs[b-533alhoi9u] {
    display: flex;
    flex-direction: column;
    flex: 1;
}

.adm-tabs[b-533alhoi9u]  .mud-tabs,
.adm-tabs[b-533alhoi9u]  .mud-tabs-tabbar-inner,
.adm-tabs[b-533alhoi9u]  .mud-tabs-tabbar-content,
.adm-tabs[b-533alhoi9u]  .mud-tabs-tabbar-wrapper {
    background-color: transparent !important;
}

.adm-tabs[b-533alhoi9u]  .mud-tabs-tabbar {
    background-color: var(--lw-white) !important;
    border-bottom: 1px solid var(--lw-border);
    border-top: none;
    border-left: none;
    border-right: none;
    flex-shrink: 0;
    box-shadow: none;
    border-radius: 0;
    margin: 0;
    padding: 16px 24px 0;
}

.adm-tabs[b-533alhoi9u]  .mud-tabs-tabbar-inner {
    min-height: 40px;
    overflow-x: auto;
    scrollbar-width: none;
}

.adm-tabs[b-533alhoi9u]  .mud-tabs-tabbar-inner::-webkit-scrollbar {
    display: none;
}

/* Reference tabs are content-sized (shrink-0); Mud's default 160px box
   spreads them across the bar. !important because Mud's width rules win. */
.adm-tabs[b-533alhoi9u]  .mud-tab {
    text-transform: none;
    font-size: 14px;
    font-weight: 500;
    color: var(--lw-gray-graphite);
    min-height: 40px;
    min-width: 0 !important;
    width: auto !important;
    flex: 0 0 auto;
    padding: 0;
    letter-spacing: 0;
    line-height: 1;
}

/* 32px between tabs = the project-detail nav row gap. Gap on the flex
   wrapper (the tabs' actual parent) -- margins on .mud-tab lose to Mud. */
.adm-tabs[b-533alhoi9u]  .mud-tabs-tabbar-wrapper {
    gap: 32px;
}

.adm-tabs[b-533alhoi9u]  .mud-tab,
.adm-tabs[b-533alhoi9u]  .mud-tab:hover,
.adm-tabs[b-533alhoi9u]  .mud-tab.mud-tab-active,
.adm-tabs[b-533alhoi9u]  .mud-tab.mud-tab-active:hover {
    background-color: transparent !important;
}

/* Reference tab states: inactive content-secondary; hover AND active are
   foreground (NOT navy); weight stays 500 in every state. */
.adm-tabs[b-533alhoi9u]  .mud-tab:hover {
    color: var(--lw-text-primary);
}

.adm-tabs[b-533alhoi9u]  .mud-tab.mud-tab-active {
    color: var(--lw-text-primary);
}

/* Active-tab indicator -- 2px foreground bar spanning exactly the tab.
   Mud's JS-measured slider drifts against content-sized tabs + wrapper gap,
   so it is disabled and the bar is drawn as an inset box-shadow (::after on
   .mud-tab does not paint; see Project.razor.css). */
.adm-tabs[b-533alhoi9u]  .mud-tab-slider {
    display: none;
}

.adm-tabs[b-533alhoi9u]  .mud-tab.mud-tab-active {
    box-shadow: inset 0 -2px 0 var(--lw-text-primary);
}

.adm-tabs[b-533alhoi9u]  .mud-tabs-scroll-button {
    display: none;
}

/* Panels container: full-bleed muted zone flush against the tab line so
   each tab can paint its own white toolbar bar (PanelClass lands on this
   same element -- see the Project.razor.css gotcha). */
.adm-tabs[b-533alhoi9u]  .mud-tabs {
    display: flex;
    flex-direction: column;
    flex: 1;
}

.adm-tabs[b-533alhoi9u]  .mud-tabs-panels {
    background-color: var(--lw-bg-muted) !important;
    margin: 0 !important;
    padding: 0 !important;
    border: none !important;
    box-shadow: none !important;
    border-radius: 0 !important;
    flex: 1;
    display: flex;
    flex-direction: column;
}

/* NOTE: tab HEADER buttons also carry the mud-tab-panel class -- always
   scope panel rules to children of .mud-tabs-panels. */
.adm-tabs[b-533alhoi9u]  .mud-tabs-panels > .mud-tab-panel {
    background-color: var(--lw-bg-muted);
    margin: 0;
    flex: 1;
    display: flex;
    flex-direction: column;
}

/* The display:flex above out-specifies the UA's [hidden] rule -- re-assert
   it so inactive panels stay hidden. */
.adm-tabs[b-533alhoi9u]  .mud-tabs-panels > .mud-tab-panel[hidden] {
    display: none !important;
}

/* --- Tab bodies --------------------------------------------- */

/* Muted content region under each tab's toolbar bar. */
.adm-body[b-533alhoi9u] {
    display: flex;
    flex-direction: column;
    flex: 1;
    gap: 16px;
    padding: 24px;
}

/* Section title inside the toolbar bar (tabs without filter chips). */
.adm-tabs[b-533alhoi9u]  .lw-section-title {
    line-height: 36px; /* match the 36px action/search controls on the right */
}

/* --- Tables ------------------------------------------------- */

/* shadow-card container for the shared lw-table chrome (pco-table-card
   recipe from the project Adjustments tab). */
.adm-table-card[b-533alhoi9u] {
    overflow-x: auto;
    border: 1px solid var(--lw-border);
    border-radius: var(--lw-radius-card);
    background: var(--lw-white);
    box-shadow: var(--lw-shadow-card);
}

.adm-table-card .lw-table[b-533alhoi9u] {
    min-width: 760px;
}

/* Admin table rows are not clickable -- keep the hover wash but not the
   pointer cursor lw-table-tr carries for row-click tables. */
.adm-table-card[b-533alhoi9u]  .lw-table-tr {
    cursor: default;
}

.adm-truncate[b-533alhoi9u] {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.adm-num[b-533alhoi9u] {
    font-weight: var(--lw-font-medium);
    font-variant-numeric: tabular-nums;
}

/* Column layout stays with the page (lw-table classes carry chrome only).
   All columns left-aligned per the list-column convention. */

/* Community Budget Templates */
.adm-col-tpl-name[b-533alhoi9u] { flex: 1.2; min-width: 160px; }
.adm-col-tpl-desc[b-533alhoi9u] { flex: 2; min-width: 200px; }
.adm-col-tpl-pub[b-533alhoi9u] { width: 120px; flex-shrink: 0; }
.adm-col-tpl-sort[b-533alhoi9u] { width: 104px; flex-shrink: 0; }
.adm-col-tpl-created[b-533alhoi9u] { width: 140px; flex-shrink: 0; }

/* Suppliers & Service Providers */
.adm-col-ven-company[b-533alhoi9u] { flex: 1.3; min-width: 150px; }
.adm-col-ven-contact[b-533alhoi9u] { flex: 1; min-width: 120px; }
.adm-col-ven-email[b-533alhoi9u] { flex: 1.4; min-width: 160px; }
.adm-col-ven-type[b-533alhoi9u] { width: 150px; flex-shrink: 0; }
.adm-col-ven-verified[b-533alhoi9u] { width: 120px; flex-shrink: 0; }
.adm-col-ven-payment[b-533alhoi9u] { width: 150px; flex-shrink: 0; }

/* Project Fees */
.adm-col-fee-project[b-533alhoi9u] { flex: 1.4; min-width: 180px; }
.adm-col-fee-contractor[b-533alhoi9u] { flex: 1.1; min-width: 140px; }
.adm-col-fee-status[b-533alhoi9u] { width: 160px; flex-shrink: 0; }
.adm-col-fee-pct[b-533alhoi9u] { width: 150px; flex-shrink: 0; }

/* Held Invoices -- one row per stuck payment (US-646) */
.adm-col-held-project[b-533alhoi9u] { flex: 1.2; min-width: 150px; }
.adm-col-held-vendor[b-533alhoi9u] { flex: 1; min-width: 130px; }
.adm-col-held-invoice[b-533alhoi9u] { width: 100px; flex-shrink: 0; }
.adm-col-held-amount[b-533alhoi9u] { width: 120px; flex-shrink: 0; }
.adm-col-held-status[b-533alhoi9u] { width: 190px; flex-shrink: 0; }
.adm-col-held-since[b-533alhoi9u] { width: 120px; flex-shrink: 0; }
.adm-col-held-actions[b-533alhoi9u] { width: 140px; flex-shrink: 0; }

/* Shared trailing icon-button column. */
.adm-col-actions[b-533alhoi9u] {
    width: 96px;
    flex-shrink: 0;
    gap: 4px;
}

/* --- Shadow tab --------------------------------------------- */

/* Current-shadow status line: chip + text on a white card row. */
.adm-shadow-status[b-533alhoi9u] {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 12px 16px;
    border: 1px solid var(--lw-border);
    border-radius: var(--lw-radius-card);
    background: var(--lw-white);
    box-shadow: var(--lw-shadow-card);
}

.adm-shadow-status-text[b-533alhoi9u] {
    font-size: 14px;
    color: var(--lw-gray-graphite);
    min-width: 0;
}

.adm-shadow-status-text[b-533alhoi9u]  strong,
.adm-shadow-status-text strong[b-533alhoi9u] {
    font-weight: var(--lw-font-semibold);
    color: var(--lw-text-primary);
}

/* Candidate picker table: rows ARE clickable (selecting shadows the org) --
   restore the pointer the base .adm-table-card rule removes. */
.adm-table-card--rowclick[b-533alhoi9u]  .lw-table-tr {
    cursor: pointer;
}

.adm-col-shadow-name[b-533alhoi9u] {
    flex: 1;
    min-width: 240px;
    gap: 10px;
}

.adm-col-shadow-status[b-533alhoi9u] {
    width: 140px;
    flex-shrink: 0;
}

.adm-col-shadow-name[b-533alhoi9u]  .adm-shadow-icon {
    font-size: 18px;
    width: 18px;
    height: 18px;
    flex-shrink: 0;
    color: var(--lw-gray-graphite);
}

/* Destructive outline action (Stop shadowing). */
.adm-action-danger[b-533alhoi9u] {
    color: var(--lw-status-error-fg);
}

.adm-action-danger[b-533alhoi9u]  .mud-icon-root {
    color: var(--lw-status-error-fg);
}
/* _content/Ledgerwise/Components/Pages/Admin/EditCommunityBudgetTemplateDialog.razor.rz.scp.css */
/* Canonical dialog body stack; footer bleeds out of the 24px LwModalBody
   padding (same recipe as AddInteriorDesignerInlineDialog). */
.dlg-fields[b-yw828pzt17] {
    display: flex;
    flex-direction: column;
    gap: 16px;
    /* lw-modal--scroll: the body clips, this region scrolls, footer stays pinned. */
    flex: 1 1 auto;
    min-height: 0;
    overflow-y: auto;
}

.dlg-footbleed[b-yw828pzt17] {
    flex-shrink: 0;
}

.dlg-footbleed[b-yw828pzt17] {
    margin: 16px -24px -24px;
}
/* _content/Ledgerwise/Components/Pages/Admin/EditProjectFeePercentageDialog.razor.rz.scp.css */
/* Canonical dialog body stack; footer bleeds out of the 24px LwModalBody
   padding (same recipe as AddInteriorDesignerInlineDialog). */
.dlg-fields[b-1btpjjozip] {
    display: flex;
    flex-direction: column;
    gap: 16px;
}

.dlg-footbleed[b-1btpjjozip] {
    margin: 16px -24px -24px;
}

.dlg-hint[b-1btpjjozip] {
    margin: -8px 0 0;
    font-size: 12px;
    color: var(--lw-gray-graphite);
}
/* _content/Ledgerwise/Components/Pages/Admin/EditVendorDialog.razor.rz.scp.css */
/* Canonical dialog body stack; footer bleeds out of the 24px LwModalBody
   padding (same recipe as AddInteriorDesignerInlineDialog). */
.dlg-fields[b-5xwzgnww87] {
    display: flex;
    flex-direction: column;
    gap: 20px;
    /* lw-modal--scroll: the body clips, this region scrolls, footer stays pinned. */
    flex: 1 1 auto;
    min-height: 0;
    overflow-y: auto;
}

.dlg-footbleed[b-5xwzgnww87] {
    flex-shrink: 0;
}

.dlg-grid2[b-5xwzgnww87] {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 16px;
}

.dlg-footbleed[b-5xwzgnww87] {
    margin: 16px -24px -24px;
}

.dlg-section[b-5xwzgnww87] {
    display: flex;
    flex-direction: column;
    gap: 12px;
}

.dlg-section + .dlg-section[b-5xwzgnww87] {
    border-top: 1px solid var(--lw-border);
    padding-top: 20px;
}

.dlg-section-title[b-5xwzgnww87] {
    margin: 0;
    font-family: var(--lw-font-family);
    font-size: 14px;
    font-weight: var(--lw-font-semibold);
    color: var(--lw-text-primary);
}

.dlg-hint[b-5xwzgnww87] {
    margin: 0;
    font-size: 12px;
    line-height: 1.5;
    color: var(--lw-gray-graphite);
}

.dlg-hint strong[b-5xwzgnww87] {
    color: var(--lw-text-primary);
    font-weight: var(--lw-font-semibold);
}
/* _content/Ledgerwise/Components/Pages/AgreementsSign.razor.rz.scp.css */
/* AgreementsSign (contractor signs the Ledgerwise builder agreement).
   NO ledgerwise-app reference exists for this surface; token-styled onto the
   shared control-card + lw-table + lw-sign vocabulary instead
   (PreliminaryNotice precedent), 2026-07-28. Layout only -- chrome lives in
   the card atoms, lw-table.css, and lw-sign.css. */

.ags-page[b-wamxn7qlt6] {
    max-width: 1080px;
    margin: 0 auto;
    padding: 24px 16px;
}

/* -- Section: uppercase micro-title above the table (pn-section recipe) -- */
[b-wamxn7qlt6] .ags-section {
    display: flex;
    flex-direction: column;
    gap: 12px;
}

[b-wamxn7qlt6] .ags-section-title {
    margin: 0;
    font-family: var(--lw-font-family);
    font-size: 12px;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.025em;
    color: var(--lw-text-primary);
}

/* -- Table card: rounded-card border white shell (pn-table-card recipe) -- */
[b-wamxn7qlt6] .ags-table-card {
    overflow-x: auto;
    border: 1px solid var(--lw-border);
    border-radius: var(--lw-radius-card);
    background: var(--lw-white);
    box-shadow: var(--lw-shadow-card);
}

[b-wamxn7qlt6] .ags-table-card .lw-table {
    min-width: 720px;
}

/* Rows are not clickable (row action button instead). */
[b-wamxn7qlt6] .ags-table-card .lw-table-tr {
    cursor: default;
}

/* Column widths; title takes the extra space, action is fixed. */
[b-wamxn7qlt6] .ags-col-title  { flex: 1.4 1 240px; }
[b-wamxn7qlt6] .ags-col-status { flex: 0 0 150px; }
[b-wamxn7qlt6] .ags-col-date   { flex: 0 0 140px; }
[b-wamxn7qlt6] .ags-col-action { flex: 0 0 190px; }

/* Keep the row action label on one line. */
[b-wamxn7qlt6] .ags-col-action .lw-button-native {
    white-space: nowrap;
}

/* -- Signing stage: context chips + Back on one bar, iframe below -- */
[b-wamxn7qlt6] .ags-signing-bar {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    flex-wrap: wrap;
}

[b-wamxn7qlt6] .ags-signing-chips {
    display: flex;
    align-items: center;
    gap: 8px;
    flex-wrap: wrap;
    min-width: 0;
}

/* Page context: shallower than the fullscreen-dialog stage height. */
[b-wamxn7qlt6] .ags-frame {
    height: calc(100vh - 320px);
    min-height: 420px;
}
/* _content/Ledgerwise/Components/Pages/BudgetTemplates.razor.rz.scp.css */
/* Budget templates list -- page-level only: the info tint on the shared
   .lw-row-tile (status-info tokens; budget/table entity, no filetype). */
.lw-budget-template-tile[b-4py7kot2ez] {
    background: var(--lw-status-info-bg);
    color: var(--lw-status-info-fg);
}
/* _content/Ledgerwise/Components/Pages/Client/AddClient.razor.rz.scp.css */
/* Add-project-owner wizard -- PAGE-SPECIFIC step bodies only. The wizard
   shell (pw-shell / pw-rail* / pw-main / pw-content / pw-stack / pw-cc-link)
   lives in css/components/lw-wizard.css. Field grids mirror the approved
   Contractor/Client detail pages. */

[b-g4gtwjhsmf] .acl-form {
    display: flex;
    flex-direction: column;
    gap: 16px;
}

[b-g4gtwjhsmf] .acl-grid2 {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 16px;
    align-items: start;
}

[b-g4gtwjhsmf] .acl-grid3 {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 16px;
    align-items: start;
}

@media (max-width: 700px) {
    [b-g4gtwjhsmf] .acl-grid2,
    [b-g4gtwjhsmf] .acl-grid3 {
        grid-template-columns: minmax(0, 1fr);
    }
}

/* Review step: reference Field label/value grid (1 -> 2 -> 3 columns). */
[b-g4gtwjhsmf] .acl-review {
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    gap: 20px;
}

@media (min-width: 640px) {
    [b-g4gtwjhsmf] .acl-review {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (min-width: 1024px) {
    [b-g4gtwjhsmf] .acl-review {
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }
}

[b-g4gtwjhsmf] .acl-field {
    display: flex;
    flex-direction: column;
    gap: 2px;
    min-width: 0;
}

[b-g4gtwjhsmf] .acl-field-label {
    font-family: var(--lw-font-family);
    font-size: 11px;
    font-weight: var(--lw-font-medium);
    text-transform: uppercase;
    letter-spacing: 0.025em;
    color: var(--lw-gray-space);
}

[b-g4gtwjhsmf] .acl-field-value {
    font-family: var(--lw-font-family);
    font-size: 14px;
    line-height: 20px;
    color: var(--lw-text-primary);
    overflow-wrap: anywhere;
}
/* _content/Ledgerwise/Components/Pages/Client/Client.razor.rz.scp.css */
/* Project Owner detail/edit page -- same grammar as the approved Contractor
   detail page (2026-07-28): lw-page-titlebar with circle Info avatar +
   items-start alignment, save actions in the titlebar, muted body of
   full-width stacked ControlCards, reference Field label/value grid.
   Layout only. */

[b-svskfa628b] .lw-page-titlebar {
    align-items: flex-start;
    min-height: 88px;
}

[b-svskfa628b] .cl-head {
    display: flex;
    align-items: flex-start;
    gap: 16px;
    flex: 1;
    min-width: 0;
}

[b-svskfa628b] .cl-head-text {
    display: flex;
    flex-direction: column;
    gap: 4px;
    flex: 1;
    min-width: 0;
}

[b-svskfa628b] .cl-head-titlerow {
    display: flex;
    align-items: center;
    gap: 12px;
    flex-wrap: wrap;
}

[b-svskfa628b] .cl-head .lw-page-title {
    line-height: 32px;
}

[b-svskfa628b] .cl-head-text .lw-page-subtitle {
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

[b-svskfa628b] .cl-body {
    display: flex;
    flex-direction: column;
    gap: 24px;
    padding: 24px;
    flex: 1;
}

[b-svskfa628b] .cl-cards {
    display: flex;
    flex-direction: column;
    gap: 24px;
}

[b-svskfa628b] .cl-form {
    display: flex;
    flex-direction: column;
    gap: 16px;
}

[b-svskfa628b] .cl-grid2 {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 16px;
    align-items: start;
}

[b-svskfa628b] .cl-grid3 {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 16px;
    align-items: start;
}

@media (max-width: 700px) {
    [b-svskfa628b] .cl-grid2,
    [b-svskfa628b] .cl-grid3 {
        grid-template-columns: minmax(0, 1fr);
    }
}

/* Record-details field grid (reference Field pairs; 1 -> 2 -> 3 columns). */
[b-svskfa628b] .cl-fields {
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    gap: 20px;
}

@media (min-width: 640px) {
    [b-svskfa628b] .cl-fields {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (min-width: 1024px) {
    [b-svskfa628b] .cl-fields {
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }
}

[b-svskfa628b] .cl-field {
    display: flex;
    flex-direction: column;
    gap: 2px;
    min-width: 0;
}

[b-svskfa628b] .cl-field-label {
    font-family: var(--lw-font-family);
    font-size: 11px;
    font-weight: var(--lw-font-medium);
    text-transform: uppercase;
    letter-spacing: 0.025em;
    color: var(--lw-gray-space);
}

[b-svskfa628b] .cl-field-value {
    font-family: var(--lw-font-family);
    font-size: 14px;
    line-height: 20px;
    color: var(--lw-text-primary);
    overflow-wrap: anywhere;
}

/* Error / not-found states */
[b-svskfa628b] .cl-state {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 16px;
    max-width: 560px;
}

[b-svskfa628b] .cl-state--center {
    align-items: center;
    align-self: center;
    text-align: center;
    padding: 48px 0;
}

[b-svskfa628b] .cl-state-icon.mud-icon-root {
    width: 48px;
    height: 48px;
    font-size: 48px;
    color: var(--lw-gray-graphite);
}

[b-svskfa628b] .cl-state-title {
    margin: 0;
    font-family: var(--lw-font-family);
    font-size: 18px;
    font-weight: var(--lw-font-bold);
    color: var(--lw-text-primary);
}

[b-svskfa628b] .cl-state-sub {
    margin: 0;
    font-family: var(--lw-font-family);
    font-size: 14px;
    line-height: 20px;
    color: var(--lw-gray-graphite);
}
/* _content/Ledgerwise/Components/Pages/Client/ClientListQuickTipsDialog.razor.rz.scp.css */
/* ClientListQuickTipsDialog content chrome only -- mirrors the canonical
   quick-tips recipe in Modals/ClientQuickTipsDialog.razor.css (qt-*).
   Dialog frame/header/body/footer come from the lw-modal pattern. */

.clqt-roundel[b-ioaqiitcjv] {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 32px;
    height: 32px;
    border-radius: 999px;
    background: var(--lw-status-warning-bg);
    color: var(--lw-status-warning-fg);
}

.clqt-roundel[b-ioaqiitcjv]  .mud-icon-root {
    width: 16px;
    height: 16px;
    font-size: 16px;
}

.clqt-grid[b-ioaqiitcjv] {
    display: grid;
    grid-template-columns: 1fr;
    gap: 24px;
}

@media (min-width: 960px) {
    .clqt-grid[b-ioaqiitcjv] { grid-template-columns: repeat(2, 1fr); }
}

.clqt-col[b-ioaqiitcjv] {
    display: flex;
    flex-direction: column;
    gap: 12px;
}

.clqt-tip-title[b-ioaqiitcjv] {
    display: flex;
    align-items: center;
    gap: 6px;
    margin: 0 0 4px;
    font-size: 14px;
    font-weight: 600;
    color: var(--lw-text-primary);
}

.clqt-tip-title[b-ioaqiitcjv]  .mud-icon-root {
    width: 16px;
    height: 16px;
    font-size: 16px;
    color: var(--lw-primary-blue);
}

.clqt-tip-body[b-ioaqiitcjv] {
    margin: 0;
    font-size: 13px;
    line-height: 1.5;
    color: var(--lw-gray-graphite);
}

.clqt-tip-list[b-ioaqiitcjv] {
    margin: 0;
    padding: 0;
    list-style: none;
    display: flex;
    flex-direction: column;
    gap: 6px;
}

.clqt-tip-list li[b-ioaqiitcjv] {
    font-size: 13px;
    line-height: 1.5;
    color: var(--lw-gray-graphite);
}

.clqt-tip-list b[b-ioaqiitcjv],
.clqt-tip-body b[b-ioaqiitcjv] {
    font-weight: 600;
    color: var(--lw-text-primary);
}
/* _content/Ledgerwise/Components/Pages/Client/ClientProject.razor.rz.scp.css */
/* -- Page wrapper -- */
/* MainLayout wraps @Body in <MudContainer Class="pa-6"> (24px padding all sides).
   The Next.js reference (project-header.tsx) renders the header edge-to-edge of
   the <main>, with the 24px inset coming entirely from the header's own px-6.
   We escape the parent's pa-6 with a negative margin so the header + tabs span
   the full main-content width and match the Next.js layout. */
.cp-page[b-1m9ut2szwx] {
    display: flex;
    flex-direction: column;
    margin: -1.5rem -1.5rem 0;
}

/* -- Project Header -- */
.cp-header[b-1m9ut2szwx] {
    background: var(--lw-white);
    border-bottom: 1px solid var(--lw-border);
    padding: 1.25rem 1.5rem 0;
}

.cp-identity[b-1m9ut2szwx] {
    display: flex;
    align-items: center;
    gap: 1rem; /* gap-4 */
    margin-bottom: 1rem; /* reference: tab strip is mt-4 below the identity zone */
}

/* Avatar is the shared LwAvatar atom (56px squircle, brand gradient,
   address-number label / house glyph fallback) -- no local avatar chrome. */

.cp-info[b-1m9ut2szwx] {
    flex: 1;
    min-width: 0;
    display: flex;
    flex-direction: column;
    gap: 0.25rem; /* gap-1 */
}

/* Name row: project name + status badge */
.cp-name-row[b-1m9ut2szwx] {
    display: flex;
    align-items: center;
    gap: 1rem; /* gap-4 */
    flex-wrap: wrap;
}

.cp-name[b-1m9ut2szwx] {
    font-size: var(--lw-title-size); /* 22px */
    font-weight: var(--lw-title-weight);
    line-height: 2rem; /* leading-8 */
    letter-spacing: var(--lw-tracking-tight);
    color: var(--lw-title-color);
    margin: 0;
    font-family: var(--lw-font-family);
}

/* Status pills are the shared StatusChip component (Badge md idiom:
   h-6, px-1.5, 11px bold uppercase, radius --lw-radius-control, token
   tone pairs) -- no local pill chrome. */

/* Metadata row: status chip + address, PM, dates (reference gap-x-3 gap-y-1.5) */
.cp-meta-row[b-1m9ut2szwx] {
    display: flex;
    align-items: center;
    column-gap: 0.75rem; /* gap-x-3 */
    row-gap: 0.375rem; /* gap-y-1.5 */
    flex-wrap: wrap;
    font-size: 0.875rem; /* text-sm */
    line-height: 1.25rem; /* leading-5 */
    color: var(--lw-gray-graphite);
}

.cp-meta-item[b-1m9ut2szwx] {
    display: inline-flex;
    align-items: center;
    gap: 0.375rem; /* gap-1.5 */
}

/* Meta icons = reference size-3.5 (14px) muted-foreground. MudIcon is a
   child component -- ::deep + .mud-icon-root to out-specific Mud's sizing. */
.cp-meta-item[b-1m9ut2szwx]  .cp-meta-icon.mud-icon-root {
    font-size: 14px;
    width: 14px;
    height: 14px;
    flex-shrink: 0;
    color: var(--lw-gray-space);
}

/* Header actions: right-aligned buttons (Add Funds, Back) */
.cp-actions[b-1m9ut2szwx] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    flex-shrink: 0;
    margin-left: auto;
}

/* Tab navigation strip */
.cp-tab-nav[b-1m9ut2szwx] {
    display: flex;
    align-items: center;
    gap: 2rem;
    margin-top: 1rem;
}

.cp-tab[b-1m9ut2szwx] {
    position: relative;
    display: flex;
    align-items: center;
    gap: 0.5rem;
    height: 2.5rem;
    padding: 0;
    font-size: 0.875rem;
    font-weight: 500;
    color: var(--lw-gray-graphite);
    background: none;
    border: none;
    cursor: pointer;
    transition: color 0.15s;
    font-family: var(--lw-font-family);
    white-space: nowrap;
}

.cp-tab:hover[b-1m9ut2szwx] {
    color: var(--lw-text-primary);
}

.cp-tab.active[b-1m9ut2szwx] {
    color: var(--lw-text-primary);
}

.cp-tab.active[b-1m9ut2szwx]::after {
    content: "";
    position: absolute;
    bottom: 0;
    left: 0;
    right: 0;
    height: 2px;
    background: var(--lw-text-primary);
}

/* Tab count badge (reference TabBadge, non-critical tone): 20px square,
   rounded-lg (8px), 11px semibold, grey-cloud bg + grey-arsenic text. */
.cp-tab-count[b-1m9ut2szwx] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 1.25rem; /* size-5 */
    height: 1.25rem;
    /* Reference rounded-lg = --radius = 4px (NOT radius-control). */
    border-radius: 4px;
    background: var(--lw-gray-cloud);
    color: var(--lw-gray-arsenic);
    font-size: 11px;
    font-weight: 600;
    line-height: 1;
    font-variant-numeric: tabular-nums;
}

/* -- Tab content area -- */
/* Reference overview scroll area is bg-muted; siblings already apply it. */
.cp-content[b-1m9ut2szwx] {
    background: var(--lw-bg-muted);
    flex: 1;
    padding: 1.25rem 1.5rem;
}

/* Documents tab composes the full-bleed lw-doc shell (white toolbar +
   breadcrumb bars own their inset), so the content gutter comes off. */
.cp-content--flush[b-1m9ut2szwx] {
    padding: 0;
}

.cp-alert[b-1m9ut2szwx] {
    margin: 1rem 1.5rem 0;
}
/* _content/Ledgerwise/Components/Pages/Client/ClientProjectBudget.razor.rz.scp.css */
/* -- Page -- */
.cpb-page[b-eq1mpaps31] {
    display: flex;
    flex-direction: column;
    gap: 1.5rem;
    background: var(--lw-bg-muted, #F7F7F5);
    padding: 1rem;
    /* bleed past the parent .cp-content padding (1.25rem 1.5rem) so the muted background
       fills the entire tab content area, matching ledgerwise-ui's bg-muted wrapper */
    margin: -1.25rem -1.5rem;
    min-height: calc(100% + 2.5rem);
    box-sizing: border-box;
}

@media (min-width: 768px) {
    .cpb-page[b-eq1mpaps31] {
        padding: 1.5rem;
    }
}

/* -- Header -- */
/* Subheader toolbar (reference owner-budget.tsx): full-bleed white bar
   above the muted canvas -- type quick-tabs left, search + split Download
   right. Negative margins bleed past .cpb-page padding. */
.cpb-subheader[b-eq1mpaps31] {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: space-between;
    gap: 0.75rem;
    margin: -1rem -1rem 0;
    padding: 0.75rem 1rem;
    background: var(--lw-white);
    border-bottom: 1px solid var(--lw-border);
}

@media (min-width: 768px) {
    .cpb-subheader[b-eq1mpaps31] {
        margin: -1.5rem -1.5rem 0;
        padding: 0.75rem 1.5rem;
    }
}

.cpb-subheader-right[b-eq1mpaps31] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    /* Pin the search + actions to the far right like the GC toolbar. */
    margin-left: auto;
}

/* xs type pill inside the quick-tabs (reference size="xs": 16px, 9px bold). */
.cpb-tab-pill[b-eq1mpaps31] {
    width: 16px;
    height: 16px;
    font-size: 9px;
}

.cpb-search-clear[b-eq1mpaps31] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border: none;
    background: none;
    padding: 2px;
    color: var(--lw-gray-space);
    cursor: pointer;
}

.cpb-search-clear:hover[b-eq1mpaps31] { color: var(--lw-text-primary); }

/* Download split-button (reference recipe: bordered shell, primary segment +
   hairline divider + chevron menu; h-9, 13px/500 content-secondary). */
.cpb-split[b-eq1mpaps31] {
    display: inline-flex;
    align-items: stretch;
    flex-shrink: 0;
    overflow: hidden;
    border: 1px solid var(--lw-border);
    border-radius: var(--lw-radius-card);
    background: var(--lw-white);
}

.cpb-split-btn[b-eq1mpaps31] {
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
    height: 36px;
    padding: 0 0.75rem;
    border: 0;
    background: transparent;
    font-family: inherit;
    font-size: 13px;
    font-weight: 500;
    color: var(--lw-gray-graphite);
    cursor: pointer;
    transition: background-color 0.12s, color 0.12s;
}

.cpb-split-btn:hover:not(:disabled)[b-eq1mpaps31] {
    background: var(--lw-accent);
    color: var(--lw-text-primary);
}

.cpb-split-chevron[b-eq1mpaps31] {
    width: 2rem;
    padding: 0;
    justify-content: center;
}

.cpb-split-divider[b-eq1mpaps31] {
    width: 1px;
    margin: 6px 0;
    background: var(--lw-border);
}

.cpb-split[b-eq1mpaps31]  .mud-icon-root {
    font-size: 1rem !important;
}

@media (max-width: 640px) {
    .cpb-split-label[b-eq1mpaps31] { display: none; }
}

/* Filter no-results card (reference BudgetNoResults). */
.cpb-hidden[b-eq1mpaps31] { display: none !important; }

.cpb-noresults[b-eq1mpaps31] {
    display: flex;
    justify-content: center;
    padding: 2.5rem 0;
}

.cpb-noresults-card[b-eq1mpaps31] {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 1.25rem;
    width: 100%;
    max-width: 28rem;
    padding: 3rem 1.5rem;
    border: 1px solid var(--lw-border);
    border-radius: var(--lw-radius-card);
    background: var(--lw-white);
    box-shadow: var(--lw-shadow-card);
    text-align: center;
}

.cpb-noresults-icon[b-eq1mpaps31] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 56px;
    height: 56px;
    border-radius: 9999px;
    background: var(--lw-bg-muted);
    color: var(--lw-gray-space);
}

.cpb-noresults-title[b-eq1mpaps31] {
    margin: 0;
    font-size: 1rem;
    font-weight: 600;
    color: var(--lw-text-primary);
}

.cpb-noresults-copy[b-eq1mpaps31] {
    margin: 0;
    font-size: 0.875rem;
    line-height: 1.625;
    color: var(--lw-gray-graphite);
}/* -- Table (desktop) -- */
/* Reference owner-budget table shell: rounded-card border bg-card
   shadow-card. Overflow stays visible so the type/invoice tooltips can
   escape; the top corners are rounded on the th cells instead. */
.cpb-table-wrap[b-eq1mpaps31] {
    border: 1px solid var(--lw-border);
    border-radius: var(--lw-radius-card);
    background: var(--lw-white);
    box-shadow: var(--lw-shadow-card);
    overflow: visible;
}

.cpb-th:first-child[b-eq1mpaps31] { border-top-left-radius: var(--lw-radius-card); }
.cpb-th:last-child[b-eq1mpaps31] { border-top-right-radius: var(--lw-radius-card); }
.cpb-table tbody tr:last-child .cpb-td:first-child[b-eq1mpaps31] { border-bottom-left-radius: var(--lw-radius-card); }
.cpb-table tbody tr:last-child .cpb-td:last-child[b-eq1mpaps31] { border-bottom-right-radius: var(--lw-radius-card); }

.cpb-table[b-eq1mpaps31] {
    width: 100%;
    border-collapse: collapse;
}

.cpb-th[b-eq1mpaps31] {
    /* Freeze the column headers while the page scrolls. The wrap stays
       overflow:visible (for tooltips), so the page/body is the scroll
       container; offset by the fixed 56px app bar so the header sits just
       below it. */
    position: sticky;
    top: 56px;
    z-index: 10;
    padding: 0.75rem 0.5rem;
    background: var(--lw-bg-table-header, #F6F7F9);
    /* Inset shadow (not border-bottom): with border-collapse the cell border is
       owned by the table and can be dropped when the header is stuck, so paint
       the divider on the cell itself where it travels with the sticky header. */
    box-shadow: inset 0 -1px 0 var(--lw-border);
    /* Reference th: table-header-bg, 12px medium uppercase tracking-wider. */
    font-size: 0.75rem;
    font-weight: 500;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    color: var(--lw-gray-graphite, #6E7180);
    text-align: left;
    white-space: nowrap;
}

.cpb-col-num[b-eq1mpaps31] { width: 80px; text-align: left; }
.cpb-col-num-right[b-eq1mpaps31] { text-align: right; }

/* Reference asymmetric column padding: Line# pl-5 pr-1, Description pl-1
   pr-10 (hugs the line number), money cols px-2, last col pl-2 pr-5. */
.cpb-th:first-child[b-eq1mpaps31],
.cpb-group-num[b-eq1mpaps31],
.cpb-item-num[b-eq1mpaps31] { padding-left: 1.25rem; padding-right: 0.25rem; }

.cpb-th:nth-child(2)[b-eq1mpaps31],
.cpb-group-name[b-eq1mpaps31],
.cpb-item-cat[b-eq1mpaps31] { padding-left: 0.25rem; padding-right: 2.5rem; }

.cpb-th:last-child[b-eq1mpaps31],
.cpb-item-row .cpb-num:last-child[b-eq1mpaps31] { padding-left: 0.5rem; padding-right: 1.25rem; }

.cpb-td[b-eq1mpaps31] {
    padding: 0.5rem;
    border-top: 1px solid var(--lw-border);
    font-size: 0.875rem;
    color: var(--lw-primary-dark, #020B2B);
    vertical-align: middle;
}

.cpb-group-row[b-eq1mpaps31] {
    /* Reference group header: bg-muted/60. */
    background: color-mix(in srgb, var(--lw-bg-muted) 60%, transparent);
}

.cpb-group-num[b-eq1mpaps31] {
    font-size: 11px;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    color: var(--lw-gray-graphite, #6E7180);
    font-variant-numeric: tabular-nums;
    padding-top: 0.5rem;
    padding-bottom: 0.5rem;
}

.cpb-group-name[b-eq1mpaps31] {
    font-size: 11px;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    color: var(--lw-gray-graphite, #6E7180);
}

.cpb-item-row[b-eq1mpaps31] {
    transition: background-color 0.12s;
}

.cpb-item-row:hover[b-eq1mpaps31] {
    /* Reference hover:bg-accent/40. */
    background-color: color-mix(in srgb, var(--lw-accent) 40%, transparent);
}

.cpb-item-num[b-eq1mpaps31] {
    /* Reference: text-muted-foreground. */
    color: var(--lw-gray-space, #9DA2B3);
    font-variant-numeric: tabular-nums;
}

.cpb-item-cat[b-eq1mpaps31] {
    color: var(--lw-primary-dark, #020B2B);
    display: flex;
    align-items: center;
    /* Reference: gap-1.5. */
    gap: 0.375rem;
    flex-wrap: wrap;
}

.cpb-num[b-eq1mpaps31] {
    text-align: right;
    font-weight: 500;
    font-variant-numeric: tabular-nums;
}

.cpb-muted[b-eq1mpaps31] {
    color: var(--lw-gray-graphite, #6E7180);
}

.cpb-bold[b-eq1mpaps31] { font-weight: 700; }

.cpb-total-row[b-eq1mpaps31] {
    background: var(--lw-bg-muted);
}

.cpb-total-row .cpb-td[b-eq1mpaps31] {
    border-top-width: 2px;
}

.cpb-total-label[b-eq1mpaps31] {
    font-weight: 700;
    color: var(--lw-primary-dark, #020B2B);
}

/* Change order chip */
.cpb-co-chip[b-eq1mpaps31] {
    display: inline-flex;
    align-items: center;
    height: 18px;
    padding: 0 6px;
    font-size: 10px;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.04em;
    border-radius: 0;
}

.cpb-co-default[b-eq1mpaps31] { background: var(--lw-status-neutral-bg); color: var(--lw-status-neutral-fg); }
.cpb-co-warning[b-eq1mpaps31] { background: var(--lw-status-warning-bg); color: var(--lw-status-warning-fg); }
.cpb-co-info[b-eq1mpaps31]    { background: var(--lw-status-info-bg);    color: var(--lw-status-info-fg); }
.cpb-co-success[b-eq1mpaps31] { background: var(--lw-status-success-bg); color: var(--lw-status-success-fg); }
.cpb-co-danger[b-eq1mpaps31]  { background: var(--lw-status-error-bg);   color: var(--lw-status-error-fg); }
.cpb-co-dark[b-eq1mpaps31]    { background: color-mix(in srgb, var(--lw-primary-dark) 12%, transparent); color: var(--lw-primary-dark); }

/* -- Historical view banner -- */
.cpb-historical-banner[b-eq1mpaps31] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    flex-wrap: wrap;
    gap: 0.75rem;
    padding: 0.625rem 1rem;
    border: 1px solid rgba(183, 110, 0, 0.32);
    background: rgba(183, 110, 0, 0.12);
}

.cpb-historical-banner-left[b-eq1mpaps31] {
    display: inline-flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 0.75rem;
    min-width: 0;
}

.cpb-historical-tag[b-eq1mpaps31] {
    display: inline-flex;
    align-items: center;
    font-size: 10px;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.08em;
    color: var(--lw-status-warning-fg);
    background: rgba(183, 110, 0, 0.22);
    padding: 0.125rem 0.5rem;
}

.cpb-historical-label[b-eq1mpaps31] {
    font-size: 0.875rem;
    font-weight: 500;
    color: var(--lw-primary-dark, #020B2B);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.cpb-historical-return[b-eq1mpaps31] {
    display: inline-flex;
    align-items: center;
    gap: 0.375rem;
    background: transparent;
    border: none;
    cursor: pointer;
    padding: 0;
    font-size: 0.75rem;
    font-weight: 600;
    color: var(--lw-status-warning-fg);
    font-family: var(--lw-font-family);
    transition: color 0.15s;
}

.cpb-historical-return:hover[b-eq1mpaps31] {
    color: var(--lw-primary-dark, #020B2B);
}

/* -- Budget Type pills -- */
.cpb-type-pill[b-eq1mpaps31] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 18px;
    height: 18px;
    /* rounded-sm = 8px, matching the GC bt-pill recipe. */
    border-radius: var(--lw-radius-control);
    font-size: 10px;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.02em;
    color: var(--lw-white);
    line-height: 1;
    cursor: help;
}

.cpb-type-projected[b-eq1mpaps31] { background: var(--lw-primary-blue, #3980A5); }
.cpb-type-firm[b-eq1mpaps31]      { background: var(--lw-status-success-fg); }
.cpb-type-allowance[b-eq1mpaps31] { background: var(--lw-status-warning-fg); }
.cpb-type-default[b-eq1mpaps31]   { background: var(--lw-gray-graphite, #6E7180); }

/* -- Custom rich tooltip (matches ledgerwise-ui TypeTooltipContent) -- */
.cpb-tooltip-wrap[b-eq1mpaps31] {
    position: relative;
    display: inline-flex;
    align-items: center;
    gap: 0.375rem;
    cursor: help;
    outline: none;
}

.cpb-tooltip[b-eq1mpaps31] {
    position: absolute;
    left: 50%;
    transform: translateX(-50%) translateY(4px);
    z-index: 1000;
    width: 240px;
    visibility: hidden;
    opacity: 0;
    pointer-events: none;
    transition: opacity 0.15s ease, transform 0.15s ease, visibility 0.15s ease;
    background: var(--lw-primary-dark, #020B2B);
    color: var(--lw-white);
    padding: 10px;
    box-shadow: 0 8px 24px rgba(0, 0, 0, 0.18);
    text-align: left;
    white-space: normal;
}

.cpb-tooltip-top[b-eq1mpaps31] {
    bottom: calc(100% + 8px);
}

.cpb-tooltip-bottom[b-eq1mpaps31] {
    top: calc(100% + 8px);
    transform: translateX(-50%) translateY(-4px);
}

.cpb-tooltip-wrap:hover .cpb-tooltip[b-eq1mpaps31],
.cpb-tooltip-wrap:focus-visible .cpb-tooltip[b-eq1mpaps31],
.cpb-tooltip-wrap:focus-within .cpb-tooltip[b-eq1mpaps31] {
    visibility: visible;
    opacity: 1;
    transform: translateX(-50%) translateY(0);
}

.cpb-tooltip-inner[b-eq1mpaps31] {
    display: flex;
    align-items: flex-start;
    gap: 0.5rem;
}

.cpb-tooltip-pill[b-eq1mpaps31] {
    flex-shrink: 0;
    margin-top: 1px;
}

.cpb-tooltip-body[b-eq1mpaps31] {
    display: flex;
    flex-direction: column;
    gap: 2px;
    min-width: 0;
}

.cpb-tooltip-label[b-eq1mpaps31] {
    font-size: 12px;
    font-weight: 600;
    color: var(--lw-white);
    line-height: 1.2;
}

.cpb-tooltip-desc[b-eq1mpaps31] {
    font-size: 11px;
    line-height: 1.4;
    color: rgba(255, 255, 255, 0.7);
}

/* -- Mobile cards (< 768px) -- */
.cpb-mobile[b-eq1mpaps31] {
    display: none;
    flex-direction: column;
    gap: 0.75rem;
}

.cpb-mcard[b-eq1mpaps31] {
    border: 1px solid var(--lw-border);
    background: var(--lw-white);
}

.cpb-mcard-head[b-eq1mpaps31] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.625rem 1rem;
    border-bottom: 1px solid var(--lw-border);
    background: var(--lw-bg-muted);
}

.cpb-mcard-num[b-eq1mpaps31],
.cpb-mcard-cat[b-eq1mpaps31] {
    font-size: 11px;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.06em;
    color: var(--lw-gray-graphite, #6E7180);
}

.cpb-mcard-num[b-eq1mpaps31] { font-variant-numeric: tabular-nums; }

.cpb-mcard-item[b-eq1mpaps31] {
    padding: 0.625rem 1rem;
    border-top: 1px solid var(--lw-border);
}

.cpb-mcard-item:first-of-type[b-eq1mpaps31] {
    border-top: none;
}

.cpb-mcard-name[b-eq1mpaps31] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    font-size: 0.875rem;
    color: var(--lw-primary-dark, #020B2B);
    margin-bottom: 0.625rem;
}

.cpb-mcard-item-num[b-eq1mpaps31] {
    font-size: 0.75rem;
    color: var(--lw-gray-graphite, #6E7180);
    font-variant-numeric: tabular-nums;
}

.cpb-mcard-grid[b-eq1mpaps31] {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 0.5rem;
}

.cpb-mcard-cell[b-eq1mpaps31] {
    display: flex;
    flex-direction: column;
    gap: 2px;
}

.cpb-mcard-label[b-eq1mpaps31] {
    font-size: 10px;
    font-weight: 500;
    text-transform: uppercase;
    letter-spacing: 0.06em;
    color: var(--lw-gray-graphite, #6E7180);
}

.cpb-mcard-value[b-eq1mpaps31] {
    font-size: 0.875rem;
    font-weight: 600;
    color: var(--lw-primary-dark, #020B2B);
    font-variant-numeric: tabular-nums;
}

.cpb-mcard-total-head[b-eq1mpaps31] {
    padding: 0.625rem 1rem;
    font-size: 0.875rem;
    font-weight: 700;
    color: var(--lw-primary-dark, #020B2B);
}

.cpb-mcard-total-head ~ .cpb-mcard-grid[b-eq1mpaps31] {
    padding: 0 1rem 0.75rem;
}

@media (max-width: 767px) {
    .cpb-table-wrap[b-eq1mpaps31] { display: none; }
    .cpb-mobile[b-eq1mpaps31] { display: flex; }
}

/* -- Print styles -- */
@media print {
    [data-print-hide][b-eq1mpaps31] { display: none !important; }
    .cpb-mobile[b-eq1mpaps31] { display: none !important; }
    .cpb-table-wrap[b-eq1mpaps31] { display: block !important; }
    .cpb-page[b-eq1mpaps31] { gap: 1rem; }
}

/* -- Clickable Paid/Pending amount button (matches the underlined-amount pattern in the reference) -- */
.cpb-amount-btn[b-eq1mpaps31] {
    display: inline-flex;
    align-items: center;
    background: transparent;
    border: none;
    cursor: pointer;
    padding: 0;
    font: inherit;
    font-weight: 500;
    color: var(--lw-primary-dark, #020B2B);
    font-variant-numeric: tabular-nums;
    /* Reference: underline decoration-border underline-offset-2. */
    text-decoration: underline;
    text-decoration-color: var(--lw-border);
    text-underline-offset: 2px;
    text-underline-offset: 3px;
    transition: color 0.15s, text-decoration-color 0.15s;
}

.cpb-amount-btn:hover[b-eq1mpaps31] {
    color: var(--lw-primary-blue, #3980A5);
    text-decoration-color: var(--lw-primary-blue, #3980A5);
}

/* -- Invoice preview tooltip (Paid/Pending cell hover) -- */
.cpb-invoice-tooltip-wrap[b-eq1mpaps31] {
    display: inline-flex;
    align-items: center;
}

.cpb-invoice-tooltip[b-eq1mpaps31] {
    width: 288px;
    padding: 0;
    text-align: left;
}

.cpb-invoice-tooltip-head[b-eq1mpaps31] {
    display: block;
    padding: 0.5rem 0.75rem 0.375rem;
    font-size: 10px;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.06em;
    color: rgba(255, 255, 255, 0.6);
}

.cpb-invoice-tooltip-list[b-eq1mpaps31] {
    display: flex;
    flex-direction: column;
    border-top: 1px solid rgba(255, 255, 255, 0.12);
}

.cpb-invoice-tooltip-row[b-eq1mpaps31] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 0.5rem;
    padding: 0.375rem 0.75rem;
}

.cpb-invoice-tooltip-num[b-eq1mpaps31] {
    display: flex;
    flex-direction: column;
    min-width: 0;
}

.cpb-invoice-tooltip-no[b-eq1mpaps31] {
    font-size: 12px;
    font-weight: 500;
    color: var(--lw-white);
    font-variant-numeric: tabular-nums;
}

.cpb-invoice-tooltip-vendor[b-eq1mpaps31] {
    font-size: 10px;
    color: rgba(255, 255, 255, 0.5);
    margin-top: 1px;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.cpb-invoice-tooltip-badge[b-eq1mpaps31] {
    flex-shrink: 0;
    display: inline-flex;
    align-items: center;
    padding: 2px 6px;
    font-size: 9px;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.06em;
}

.cpb-invoice-tooltip-badge-paid[b-eq1mpaps31]    { background: rgba(94, 196, 154, 0.22); color: var(--lw-tooltip-success-fg); }
.cpb-invoice-tooltip-badge-pending[b-eq1mpaps31] { background: rgba(91, 163, 196, 0.32); color: var(--lw-tooltip-info-fg); }

.cpb-invoice-tooltip-more[b-eq1mpaps31] {
    padding: 0.25rem 0.75rem 0.5rem;
    font-size: 10px;
    color: rgba(255, 255, 255, 0.5);
}

.cpb-invoice-tooltip-cta[b-eq1mpaps31] {
    display: inline-flex;
    align-items: center;
    gap: 0.25rem;
    background: transparent;
    border: none;
    border-top: 1px solid rgba(255, 255, 255, 0.12);
    cursor: pointer;
    padding: 0.5rem 0.75rem;
    font-size: 11px;
    font-weight: 600;
    color: rgba(255, 255, 255, 0.75);
    font-family: var(--lw-font-family);
    transition: color 0.15s;
    width: 100%;
    justify-content: flex-start;
}

.cpb-invoice-tooltip-cta:hover[b-eq1mpaps31] {
    color: var(--lw-white);
}/* -- Sticky footer: Total Construction Cost + expandable Fees breakdown -- */
/* Mirrors ledgerwise-ui homeowner-budget.tsx footer:
   pinned to viewport bottom, expands upward to show subtotal + fee items. */
.cpb-sticky-footer[b-eq1mpaps31] {
    position: sticky;
    bottom: 0;
    z-index: 20;
    /* Bleed past .cpb-page padding so the footer spans the full content width. */
    margin: 0 -1rem -1rem;
}

@media (min-width: 768px) {
    .cpb-sticky-footer[b-eq1mpaps31] {
        margin: 0 -1.5rem -1.5rem;
    }
}

.cpb-sticky-footer-inner[b-eq1mpaps31] {
    background: var(--lw-white);
    border-top: 1px solid var(--lw-border);
    box-shadow: 0 -4px 16px rgba(0, 0, 0, 0.08);
}

/* Expand/collapse via max-height transition (closes/opens upward). */
.cpb-fees-expansion[b-eq1mpaps31] {
    max-height: 0;
    overflow: hidden;
    transition: max-height 0.18s ease-out;
}

.cpb-fees-expansion.cpb-fees-open[b-eq1mpaps31] {
    max-height: 600px;
}

.cpb-fees-expansion-inner[b-eq1mpaps31] {
    max-height: 360px;
    overflow-y: auto;
    background: rgba(247, 247, 245, 0.3);
}

.cpb-fees-subtotal[b-eq1mpaps31] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 0.75rem;
    background: var(--lw-white);
    padding: 0.75rem 1rem;
}

.cpb-fees-subtotal-label[b-eq1mpaps31] {
    font-size: 13px;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.04em;
    color: var(--lw-gray-graphite, #6E7180);
}

.cpb-fees-subtotal-value[b-eq1mpaps31] {
    font-size: 0.875rem;
    font-weight: 700;
    color: var(--lw-primary-dark, #020B2B);
    font-variant-numeric: tabular-nums;
}

.cpb-fees-header[b-eq1mpaps31] {
    display: flex;
    align-items: center;
    border-top: 1px solid var(--lw-border);
    padding: 0.5rem 1rem;
}

.cpb-fees-header-label[b-eq1mpaps31] {
    font-size: 11px;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.06em;
    color: var(--lw-gray-graphite, #6E7180);
}

.cpb-fees-row[b-eq1mpaps31] {
    display: grid;
    grid-template-columns: 1fr auto auto;
    align-items: center;
    gap: 0.75rem;
    border-top: 1px solid var(--lw-border);
    padding: 0.5rem 1rem;
}

.cpb-fees-row-label[b-eq1mpaps31] {
    display: inline-flex;
    align-items: center;
    gap: 0.375rem;
    font-size: 0.875rem;
    color: var(--lw-primary-dark, #020B2B);
}

.cpb-fees-row-formula[b-eq1mpaps31] {
    font-size: 0.75rem;
    color: var(--lw-gray-graphite, #6E7180);
    white-space: nowrap;
}

.cpb-fees-row-value[b-eq1mpaps31] {
    font-size: 0.875rem;
    font-weight: 500;
    color: var(--lw-primary-dark, #020B2B);
    font-variant-numeric: tabular-nums;
    text-align: right;
}

.cpb-fees-row-muted[b-eq1mpaps31] {
    color: var(--lw-gray-graphite, #6E7180);
}

.cpb-fees-row-lock[b-eq1mpaps31] {
    color: var(--lw-gray-graphite, #6E7180);
    flex-shrink: 0;
}

.cpb-fees-total[b-eq1mpaps31] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 0.75rem;
    background: rgba(247, 247, 245, 0.6);
    border-top: 1px solid var(--lw-border);
    padding: 0.625rem 1rem;
}

.cpb-fees-total-label[b-eq1mpaps31] {
    font-size: 12px;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.04em;
    color: var(--lw-primary-dark, #020B2B);
}

.cpb-fees-total-value[b-eq1mpaps31] {
    font-size: 0.875rem;
    font-weight: 700;
    color: var(--lw-primary-dark, #020B2B);
    font-variant-numeric: tabular-nums;
}

@media (min-width: 768px) {
    .cpb-fees-subtotal[b-eq1mpaps31],
    .cpb-fees-header[b-eq1mpaps31],
    .cpb-fees-row[b-eq1mpaps31],
    .cpb-fees-total[b-eq1mpaps31] { padding-left: 1.5rem; padding-right: 1.5rem; }

    .cpb-fees-subtotal-value[b-eq1mpaps31],
    .cpb-fees-row-value[b-eq1mpaps31],
    .cpb-fees-total-value[b-eq1mpaps31] { font-size: 1rem; }

    .cpb-fees-total-label[b-eq1mpaps31] { font-size: 13px; }
}

/* Toggle button -- collapsed state shows the construction total. */
.cpb-sticky-toggle[b-eq1mpaps31] {
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 0.75rem;
    background: var(--lw-bg-muted);
    border: none;
    border-top: 1px solid var(--lw-border);
    padding: 0.875rem 1rem;
    cursor: pointer;
    font-family: var(--lw-font-family);
    transition: background 0.15s;
}

.cpb-sticky-toggle:hover[b-eq1mpaps31] {
    background: var(--lw-bg-muted, #F7F7F5);
}

.cpb-sticky-toggle-left[b-eq1mpaps31] {
    display: inline-flex;
    align-items: center;
    gap: 0.375rem;
    min-width: 0;
}

.cpb-sticky-toggle-chevron[b-eq1mpaps31] {
    color: var(--lw-gray-graphite, #6E7180);
    flex-shrink: 0;
}

.cpb-sticky-toggle-label[b-eq1mpaps31] {
    font-size: 12px;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.04em;
    color: var(--lw-primary-dark, #020B2B);
}

.cpb-sticky-toggle-sublabel[b-eq1mpaps31] {
    font-size: 10px;
    font-weight: 500;
    text-transform: uppercase;
    letter-spacing: 0.04em;
    color: var(--lw-gray-graphite, #6E7180);
}

.cpb-sticky-toggle-value[b-eq1mpaps31] {
    font-size: 0.875rem;
    font-weight: 700;
    color: var(--lw-primary-dark, #020B2B);
    font-variant-numeric: tabular-nums;
}

@media (min-width: 768px) {
    .cpb-sticky-toggle[b-eq1mpaps31] {
        padding: 1rem 1.5rem;
    }
    .cpb-sticky-toggle-left[b-eq1mpaps31] { gap: 0.5rem; }
    .cpb-sticky-toggle-label[b-eq1mpaps31] { font-size: 13px; }
    .cpb-sticky-toggle-sublabel[b-eq1mpaps31] { font-size: 11px; }
    .cpb-sticky-toggle-value[b-eq1mpaps31] { font-size: 1.125rem; }
}

/* Mobile (FormatK) vs desktop (FormatCurrency) value swap. */
.cpb-fees-val-sm[b-eq1mpaps31] { display: inline; }
.cpb-fees-val-md[b-eq1mpaps31] { display: none; }

@media (min-width: 768px) {
    .cpb-fees-val-sm[b-eq1mpaps31] { display: none; }
    .cpb-fees-val-md[b-eq1mpaps31] { display: inline; }
}

/* Print: drop the sticky chrome and force the breakdown visible. */
@media print {
    .cpb-sticky-footer[b-eq1mpaps31] {
        position: static;
        box-shadow: none;
        margin: 0;
    }
    .cpb-sticky-toggle[b-eq1mpaps31] { display: none !important; }
    .cpb-fees-expansion[b-eq1mpaps31] {
        max-height: none !important;
        overflow: visible !important;
    }
    .cpb-fees-expansion-inner[b-eq1mpaps31] {
        max-height: none !important;
        overflow: visible !important;
    }
}
/* _content/Ledgerwise/Components/Pages/Client/ClientProjectChangeOrders.razor.rz.scp.css */
/* ClientProjectChangeOrders (owner Adjustments tab) -- page-level layout only.
   Source: ledgerwise-ui-app organisms/owner/owner-adjustments.tsx +
   molecules/adjustment-row-card.tsx + atoms/adjustment-status-pill.tsx
   (measured spec 2026-07-20; migrated 2026-07-21): white lw-page-toolbar bar
   (segmented navy chips + h-9 search) over a muted body; desktop table in the
   8px shadow-card container (#F6F7F9 header); mobile cards with a 2px teal
   left edge while under review. Signed deltas: positive = destructive red,
   negative = success green. Needs-review pills are deliberately NEUTRAL gray
   (gold is reserved for budget "spent").
   Table chrome: css/components/lw-table.css. Toolbar/search chrome:
   css/components/lw-page.css. Tabs: LwChip (Tab variant); pills: StatusChip.
   Renders full-bleed via ClientProject's cp-content--flush. */

.cpa-page[b-hyfc1ww13j] {
    display: flex;
    flex-direction: column;
    flex: 1;
}

/* Muted content region (reference: flex-1 flex-col gap-4 bg-muted p-4 md:p-6). */
.cpa-body[b-hyfc1ww13j] {
    display: flex;
    flex-direction: column;
    flex: 1;
    gap: 16px;
    padding: 16px;
    background: var(--lw-bg-muted);
}

@media (min-width: 768px) {
    .cpa-body[b-hyfc1ww13j] {
        padding: 24px;
    }
}

/* ---- Desktop table card (spec 1.2) ----
   Card shell: overflow-x auto, rounded-card border bg-card shadow-card.
   Column chrome comes from the shared .lw-table vocabulary; this page only
   owns the card wrapper and the column widths. */
.cpa-table-card[b-hyfc1ww13j] {
    overflow-x: auto;
    border: 1px solid var(--lw-border);
    border-radius: var(--lw-radius-card);
    background: var(--lw-white);
    box-shadow: var(--lw-shadow-card);
}

.cpa-table-card .lw-table[b-hyfc1ww13j] {
    min-width: 760px;
}

/* Rows are keyboard-focusable buttons. */
.cpa-table-card .lw-table-tr[b-hyfc1ww13j] {
    outline: none;
}

.cpa-table-card .lw-table-tr:focus-visible[b-hyfc1ww13j] {
    background: color-mix(in srgb, var(--lw-accent) 50%, transparent);
}

/* Column widths per reference min-widths (Adjustment 220 / BA# 80 /
   Status 130 / Date 140 / Amount 110 right / actions 120). */
.cpa-col-title[b-hyfc1ww13j]   { flex: 1 1 220px; min-width: 0; }
.cpa-col-num[b-hyfc1ww13j]     { flex: 0 0 90px; min-width: 0; white-space: nowrap; }
.cpa-col-status[b-hyfc1ww13j]  { flex: 0 0 150px; min-width: 0; }
.cpa-col-date[b-hyfc1ww13j]    { flex: 1 0 140px; min-width: 0; white-space: nowrap; }
.cpa-col-amount[b-hyfc1ww13j]  { flex: 0 0 130px; min-width: 0; justify-content: flex-end; text-align: right; }
.cpa-col-actions[b-hyfc1ww13j] { flex: 0 0 140px; justify-content: flex-end; }

/* Title cell: 14/600 truncated with native title tooltip. */
.cpa-title[b-hyfc1ww13j] {
    min-width: 0;
    font-size: 14px;
    font-weight: var(--lw-font-semibold);
    color: var(--lw-text-primary);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

/* Signed delta: positive (budget increase) = destructive red; negative
   (reduction) = success green (spec section 0 semantics). */
.cpa-amount[b-hyfc1ww13j] {
    font-size: 14px;
    font-weight: var(--lw-font-semibold);
    font-variant-numeric: tabular-nums;
    white-space: nowrap;
}

.cpa-amount-pos[b-hyfc1ww13j] { color: var(--lw-status-error-fg); }
.cpa-amount-neg[b-hyfc1ww13j] { color: var(--lw-status-success-fg); }

.cpa-chev[b-hyfc1ww13j] {
    color: var(--lw-gray-graphite);
    flex-shrink: 0;
}

/* Row Approve: ui/button.tsx size="action-sm" -- h-9 gap-1.5 rounded-md px-4
   text-[13px], navy fill, hover bg-primary/90. */
.cpa-approve-btn[b-hyfc1ww13j] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 6px;
    height: 36px;
    padding: 0 16px;
    border: none;
    border-radius: var(--lw-radius-control);
    background: var(--lw-primary-dark);
    color: var(--lw-white);
    font-size: 13px;
    font-weight: var(--lw-font-medium);
    font-family: var(--lw-font-family);
    cursor: pointer;
    transition: background 0.15s ease;
    flex-shrink: 0;
    white-space: nowrap;
}

.cpa-approve-btn:hover[b-hyfc1ww13j] {
    background: var(--lw-primary-dark-hover);
}

.cpa-approve-btn:active[b-hyfc1ww13j] {
    transform: translateY(1px);
}

/* ---- Mobile card list (spec 1.2 mobile) ---- */
.cpa-cards[b-hyfc1ww13j] {
    display: flex;
    flex-direction: column;
    gap: 8px;
}

.cpa-card[b-hyfc1ww13j] {
    display: flex;
    flex-direction: column;
    gap: 8px;
    padding: 16px;
    border: 1px solid var(--lw-border);
    border-radius: var(--lw-radius-card);
    background: var(--lw-white);
    box-shadow: var(--lw-shadow-card);
    cursor: pointer;
    transition: background-color 0.15s ease;
    outline: none;
}

.cpa-card:hover[b-hyfc1ww13j],
.cpa-card:focus-visible[b-hyfc1ww13j] {
    background: color-mix(in srgb, var(--lw-accent) 50%, transparent);
}

/* Under-review cards: 2px brand-accent (teal) left edge. */
.cpa-card--review[b-hyfc1ww13j] {
    border-left: 2px solid var(--lw-primary-blue);
}

.cpa-card-top[b-hyfc1ww13j] {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 12px;
}

.cpa-card-top .cpa-amount[b-hyfc1ww13j] {
    flex-shrink: 0;
}

.cpa-card-meta[b-hyfc1ww13j] {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 8px;
    font-size: 12px;
    color: var(--lw-gray-graphite);
}

.cpa-card-sep[b-hyfc1ww13j] {
    color: var(--lw-border);
}

/* Desktop table above md; cards below. */
@media (max-width: 767px) {
    .cpa-table-card[b-hyfc1ww13j] {
        display: none;
    }
}

@media (min-width: 768px) {
    .cpa-cards[b-hyfc1ww13j] {
        display: none;
    }
}

/* ---- Empty / no-results state (spec 1.2 no-results card) ---- */
.cpa-empty-state[b-hyfc1ww13j] {
    display: flex;
    flex-direction: column;
    align-items: center;
    align-self: center;
    width: 100%;
    max-width: 28rem;
    gap: 4px;
    padding: 48px 24px;
    border: 1px solid var(--lw-border);
    border-radius: var(--lw-radius-card);
    background: var(--lw-white);
    box-shadow: var(--lw-shadow-card);
    text-align: center;
}

.cpa-empty-title[b-hyfc1ww13j] {
    font-size: 16px;
    font-weight: var(--lw-font-semibold);
    color: var(--lw-text-primary);
    margin: 0;
}

.cpa-empty-sub[b-hyfc1ww13j] {
    margin: 0;
    font-size: 14px;
    line-height: 1.6;
    color: var(--lw-gray-graphite);
}
/* _content/Ledgerwise/Components/Pages/Client/ClientProjectDrawRequests.razor.rz.scp.css */
/* Page shell: white lw-page-toolbar bar over a muted body (reference
   owner-payment-requests.tsx structure). Full-bleed via the ClientProject
   shell's cp-content--flush modifier -- no negative margins. */
.cpd-page[b-ev17xj2jqz] {
    display: flex;
    flex-direction: column;
}

/* Muted content area under the toolbar (reference bg-muted p-4 md:p-6). */
.cpd-body[b-ev17xj2jqz] {
    display: flex;
    flex-direction: column;
    gap: 1rem;
    background: var(--lw-bg-muted);
    padding: 1rem;
    flex: 1;
}

@media (min-width: 768px) {
    .cpd-body[b-ev17xj2jqz] {
        padding: 1.5rem;
    }
}

/* -- Desktop table card (spec 1.5) --
   Card shell: overflow-x auto, rounded-card border bg-card shadow-card.
   Column chrome comes from the shared .lw-table vocabulary; this page
   only owns the card wrapper and the column widths. */
.cpd-table-card[b-ev17xj2jqz] {
    overflow-x: auto;
    border: 1px solid var(--lw-border);
    border-radius: var(--lw-radius-card);
    background: var(--lw-white);
    box-shadow: var(--lw-shadow-card);
}

.cpd-table-card .lw-table[b-ev17xj2jqz] {
    min-width: 720px;
}

/* Rows are keyboard-focusable buttons. */
.cpd-table-card .lw-table-tr[b-ev17xj2jqz] {
    outline: none;
}

.cpd-table-card .lw-table-tr:focus-visible[b-ev17xj2jqz] {
    background: color-mix(in srgb, var(--lw-accent) 50%, transparent);
}

/* Column widths per reference min-widths; columns share extra space. */
.cpd-col-request[b-ev17xj2jqz]  { flex: 1 0 120px; }
.cpd-col-status[b-ev17xj2jqz]   { flex: 1 0 140px; }
.cpd-col-date[b-ev17xj2jqz]     { flex: 1 0 180px; }
.cpd-col-invoices[b-ev17xj2jqz] { flex: 1 0 110px; }
.cpd-col-amount[b-ev17xj2jqz]   { flex: 1 0 120px; justify-content: flex-end; }
.cpd-col-chev[b-ev17xj2jqz]     { flex: 0 0 40px; padding-left: 0; padding-right: 16px; justify-content: flex-end; }

/* -- Shared cell content -- */

.cpd-pr-num[b-ev17xj2jqz] {
    font-size: 14px;
    font-weight: 700;
    color: var(--lw-text-primary);
}

.cpd-status[b-ev17xj2jqz] {
    display: inline-flex;
    align-items: center;
    padding: 0.125rem 0.5rem;
    border-radius: 2px;
    font-size: 11px;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.02em;
    line-height: 1.3;
}

/* Status palette mirrors payment-request-card.tsx statusColorMap */
.cpd-status-default[b-ev17xj2jqz] { background: var(--lw-bg-table-header, #F0F0EE); color: var(--lw-gray-graphite, #6E7180); }
.cpd-status-info[b-ev17xj2jqz]    { background: rgba(59, 130, 246, 0.12); color: var(--lw-status-info-fg); }
.cpd-status-primary[b-ev17xj2jqz] { background: rgba(57, 128, 165, 0.10); color: var(--lw-primary-blue, #3980A5); }
.cpd-status-success[b-ev17xj2jqz] { background: rgba(17, 141, 87, 0.14); color: var(--lw-status-success-fg); }
.cpd-status-warning[b-ev17xj2jqz] { background: rgba(183, 110, 0, 0.16); color: var(--lw-status-warning-fg); }
.cpd-status-error[b-ev17xj2jqz]   { background: rgba(220, 38, 38, 0.12); color: var(--lw-status-error-fg); }

/* Date: "{Label} " muted with the date value in foreground; em dash if none. */
.cpd-date[b-ev17xj2jqz] {
    white-space: nowrap;
    font-size: 14px;
    color: var(--lw-gray-graphite, #6E7180);
}

.cpd-date-value[b-ev17xj2jqz] {
    color: var(--lw-text-primary);
}

.cpd-amount[b-ev17xj2jqz] {
    font-size: 14px;
    font-weight: 600;
    font-variant-numeric: tabular-nums;
    color: var(--lw-text-primary);
}

.cpd-chev[b-ev17xj2jqz] {
    color: var(--lw-gray-graphite, #6E7180);
    flex-shrink: 0;
}

/* -- Mobile card list (spec 1.6) -- */
.cpd-cards[b-ev17xj2jqz] {
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
}

.cpd-card[b-ev17xj2jqz] {
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
    padding: 1rem;
    border: 1px solid var(--lw-border);
    border-radius: var(--lw-radius-card);
    background: var(--lw-white);
    box-shadow: var(--lw-shadow-card);
    cursor: pointer;
    transition: background-color 0.15s ease;
    outline: none;
}

.cpd-card:hover[b-ev17xj2jqz],
.cpd-card:focus-visible[b-ev17xj2jqz] {
    background: color-mix(in srgb, var(--lw-accent) 50%, transparent);
}

.cpd-card-top[b-ev17xj2jqz] {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 0.75rem;
}

.cpd-card-id[b-ev17xj2jqz] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    min-width: 0;
}

/* Mobile badge is slightly smaller (spec 0). */
.cpd-card .cpd-status[b-ev17xj2jqz] {
    padding: 0.125rem 0.375rem;
    font-size: 10px;
}

.cpd-card-meta[b-ev17xj2jqz] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    font-size: 12px;
    color: var(--lw-gray-graphite, #6E7180);
}

.cpd-card-dot[b-ev17xj2jqz] {
    color: var(--lw-border);
}

/* Desktop table above md; cards below. */
@media (max-width: 767px) {
    .cpd-table-card[b-ev17xj2jqz] {
        display: none;
    }
}

@media (min-width: 768px) {
    .cpd-cards[b-ev17xj2jqz] {
        display: none;
    }
}

/* -- Empty state -- */
.cpd-empty-state[b-ev17xj2jqz] {
    padding: 3rem 1rem;
    text-align: center;
}

.cpd-empty-title[b-ev17xj2jqz] {
    font-size: 14px;
    font-weight: 600;
    color: var(--lw-primary-dark, #020B2B);
    margin: 0;
}

.cpd-empty-sub[b-ev17xj2jqz] {
    margin: 0.25rem 0 0;
    font-size: 14px;
    color: var(--lw-gray-graphite, #6E7180);
}
/* _content/Ledgerwise/Components/Pages/Client/ClientProjectOverview.razor.rz.scp.css */
/* -- Page wrap --
   Reference: ledgerwise-ui-app src/components/organisms/project/project-overview.tsx
   (max-w-[1100px] flex-col gap-4) and src/components/molecules/trust-account-widget.tsx. */
.cpo-page[b-z5o3ojl0pv] {
    display: flex;
    flex-direction: column;
    gap: 1rem;
    max-width: 1100px;
    margin: 0 auto;
    width: 100%;
}

/* -- KPI Strip -- */
.cpo-kpi-grid[b-z5o3ojl0pv] {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 1rem;
}

@media (min-width: 768px) {
    .cpo-kpi-grid[b-z5o3ojl0pv] {
        grid-template-columns: repeat(4, minmax(0, 1fr));
    }
}

/* Surface provided by the shared Card primitive. */
.cpo-kpi[b-z5o3ojl0pv] {
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    padding: 1.25rem;
    min-height: 116px;
}

.cpo-kpi-label[b-z5o3ojl0pv] {
    font-size: 11px;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.1em;
    color: var(--lw-gray-graphite, #6E7180);
    margin: 0;
}

/* Reference kpi-card.tsx: text-xl on mobile, 32px from md up. */
.cpo-kpi-value[b-z5o3ojl0pv] {
    font-size: 20px;
    font-weight: 700;
    line-height: 1;
    letter-spacing: -0.02em;
    color: var(--lw-primary-dark, #020B2B);
    margin: 0.25rem 0 0;
    font-family: var(--lw-font-family-heading, sans-serif);
}

@media (min-width: 768px) {
    .cpo-kpi-value[b-z5o3ojl0pv] {
        font-size: 32px;
    }
}

.cpo-kpi-value-warning[b-z5o3ojl0pv] {
    color: var(--lw-status-warning-fg);
}

.cpo-kpi-subtitle[b-z5o3ojl0pv] {
    font-size: 11px;
    color: var(--lw-gray-graphite, #6E7180);
    margin: 0.75rem 0 0;
}

/* -- Content column: reference single stacked column -- */
.cpo-content-grid[b-z5o3ojl0pv] {
    display: grid;
    grid-template-columns: 1fr;
    gap: 1rem;
    align-items: start;
}

/* Single stacked column at every width (reference project-overview.tsx). */

/* Generic card */
/* Surface provided by the shared Card primitive. */




.cpo-view-link[b-z5o3ojl0pv] {
    display: inline-flex;
    align-items: center;
    gap: 0.25rem;
    background: transparent;
    border: none;
    cursor: pointer;
    font-size: 0.75rem;
    font-weight: 500;
    color: var(--lw-gray-graphite, #6E7180);
    transition: color 0.15s;
    padding: 0;
    font-family: var(--lw-font-family);
}

.cpo-view-link:hover[b-z5o3ojl0pv] {
    color: var(--lw-primary-dark, #020B2B);
}/* -- Not-funded destructive block (trust-account-widget.tsx notFunded) -- */
.cpo-notfunded[b-z5o3ojl0pv] {
    /* rounded-card border-destructive/25 bg-destructive-bg p-5 mt-3 */
    margin-top: 0.75rem;
    border-radius: var(--lw-radius-card, 8px);
    border: 1px solid color-mix(in srgb, var(--lw-destructive) 25%, transparent);
    background: var(--lw-status-error-bg, rgba(184, 53, 48, 0.12));
    padding: 1.25rem;
}

.cpo-notfunded-head[b-z5o3ojl0pv] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
}

/* Chip: size-7 rounded-full bg-destructive/10 text-destructive, 16px glyph */
.cpo-notfunded-chip[b-z5o3ojl0pv] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 28px;
    height: 28px;
    flex-shrink: 0;
    border-radius: 9999px;
    background: color-mix(in srgb, var(--lw-destructive) 10%, transparent);
    color: var(--lw-destructive, #B83530);
}

.cpo-notfunded-label[b-z5o3ojl0pv] {
    font-size: 0.75rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.025em;
    color: var(--lw-status-error-fg);
    margin: 0;
}

/* mt-4 text-[44px] font-bold leading-none tracking-tight tabular-nums */
.cpo-notfunded-amount[b-z5o3ojl0pv] {
    margin: 1rem 0 0;
    font-size: 44px;
    font-weight: 700;
    line-height: 1;
    letter-spacing: -0.025em;
    font-variant-numeric: tabular-nums;
    color: var(--lw-destructive, #B83530);
    font-family: var(--lw-font-family-heading, sans-serif);
}

.cpo-notfunded-sub[b-z5o3ojl0pv] {
    margin: 0.375rem 0 0;
    font-size: 0.75rem;
    color: var(--lw-gray-space, #9DA2B3);
}

/* mt-4 border-t border-destructive/15 pt-4 text-sm leading-relaxed content-secondary */
.cpo-notfunded-explainer[b-z5o3ojl0pv] {
    margin: 1rem 0 0;
    padding-top: 1rem;
    border-top: 1px solid color-mix(in srgb, var(--lw-destructive) 15%, transparent);
    font-size: 0.875rem;
    line-height: 1.625;
    color: var(--lw-gray-graphite, #6E7180);
}

.cpo-notfunded-explainer strong[b-z5o3ojl0pv] {
    font-weight: 600;
    color: var(--lw-text-primary, #1e1e24);
}



/* Pending fund request notification (trust-account-widget.tsx owner fundRequest:
   mt-4 rounded-md border border-border bg-muted/50 p-3.5) */
.cpo-fund-request[b-z5o3ojl0pv] {
    margin-top: 1rem;
    padding: 0.875rem;
    border: 1px solid var(--lw-border);
    border-radius: var(--lw-radius-control, 8px);
    background: color-mix(in srgb, var(--lw-bg-muted, #F0F3F6) 50%, var(--lw-white, #FFFFFF));
}

.cpo-fund-request-row[b-z5o3ojl0pv] {
    display: flex;
    align-items: center;
    gap: 0.625rem;
}

/* size-8 rounded-md bg-warning-badge-bg, 14px glyph in warning-badge-text */
.cpo-fund-request-icon[b-z5o3ojl0pv] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 32px;
    height: 32px;
    flex-shrink: 0;
    border-radius: var(--lw-radius-control, 8px);
    background: var(--lw-status-warning-bg);
    color: var(--lw-status-warning-fg);
}

.cpo-fund-request-body[b-z5o3ojl0pv] {
    display: flex;
    flex-direction: column;
    gap: 2px;
    min-width: 0;
    flex: 1;
}

.cpo-fund-request-amount[b-z5o3ojl0pv] {
    font-size: 13px;
    font-weight: 600;
    color: var(--lw-text-primary, #1e1e24);
    margin: 0;
    font-variant-numeric: tabular-nums;
}

.cpo-fund-request-meta[b-z5o3ojl0pv] {
    font-size: 11px;
    color: var(--lw-gray-space, #9DA2B3);
    margin: 0;
}

.cpo-fund-request-hint[b-z5o3ojl0pv] {
    margin: 0.625rem 0 0;
    padding-top: 0.625rem;
    border-top: 1px solid var(--lw-border);
    font-size: 11px;
    color: var(--lw-gray-space, #9DA2B3);
}

/* Subtle "Add Funds" affordance at the bottom of the trust card
   (trust-account-widget.tsx Mock Add Funds: mt-3 text-[11px] muted-foreground) */

.cpo-trust-mock-add:hover[b-z5o3ojl0pv] {
    color: var(--lw-text-primary, #1e1e24);
}

/* Account details (trust-account-widget.tsx MaskedField box: mt-4 caption +
   white rounded-card bordered box, rows px-3.5 py-3, per-field eye toggle) */
.cpo-bank-details[b-z5o3ojl0pv] {
    margin-top: 1rem;
}

.cpo-bank-caption[b-z5o3ojl0pv] {
    margin: 0 0 0.5rem;
    font-size: 0.75rem;
    font-weight: 500;
    color: var(--lw-gray-space, #9DA2B3);
}

.cpo-bank-box[b-z5o3ojl0pv] {
    overflow: hidden;
    border-radius: var(--lw-radius-card, 8px);
    border: 1px solid var(--lw-border);
    background: var(--lw-white, #FFFFFF);
}

.cpo-bank-row[b-z5o3ojl0pv] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 0.75rem;
    padding: 0.75rem 0.875rem;
}

.cpo-bank-row-bordered[b-z5o3ojl0pv] {
    border-top: 1px solid var(--lw-border);
}

.cpo-bank-label[b-z5o3ojl0pv] {
    font-size: 0.75rem;
    color: var(--lw-gray-space, #9DA2B3);
}

.cpo-bank-value-wrap[b-z5o3ojl0pv] {
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
}

.cpo-bank-value[b-z5o3ojl0pv] {
    font-size: 0.875rem;
    font-weight: 500;
    color: var(--lw-text-primary, #1e1e24);
    font-variant-numeric: tabular-nums;
}

.cpo-bank-eye[b-z5o3ojl0pv] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    background: transparent;
    border: none;
    cursor: pointer;
    padding: 0;
    color: var(--lw-gray-space, #9DA2B3);
    transition: color 0.15s;
}

.cpo-bank-eye:hover[b-z5o3ojl0pv] {
    color: var(--lw-text-primary, #1e1e24);
}

/* Standing wire-instructions download inside the account-details panel (US-569) */
.cpo-bank-download[b-z5o3ojl0pv] {
    align-self: flex-start;
    display: inline-flex;
    align-items: center;
    gap: 0.25rem;
    margin-top: 0.25rem;
    background: transparent;
    border: none;
    cursor: pointer;
    padding: 0;
    font-size: 11px;
    font-weight: 500;
    color: var(--lw-primary-blue, #3980A5);
    font-family: var(--lw-font-family);
    transition: color 0.15s;
}

.cpo-bank-download:hover[b-z5o3ojl0pv] {
    color: var(--lw-primary-dark, #020B2B);
}

.cpo-bank-download:disabled[b-z5o3ojl0pv] {
    color: var(--lw-gray-graphite, #6E7180);
    cursor: default;
}

/* Shown in place of the account-details section until the sub-account is provisioned */
.cpo-bank-pending-hint[b-z5o3ojl0pv] {
    margin: 1rem 0 0;
    font-size: 11px;
    color: var(--lw-gray-graphite, #6E7180);
}

/* -- Budget Utilization -- */






.cpo-cat[b-z5o3ojl0pv] {
    display: flex;
    flex-direction: column;
    gap: 0.25rem;
}



.cpo-cat-amount[b-z5o3ojl0pv] {
    color: var(--lw-gray-graphite, #6E7180);
    flex-shrink: 0;
    font-variant-numeric: tabular-nums;
}

.cpo-cat-amount-muted[b-z5o3ojl0pv] {
    color: var(--lw-gray-space, #9DA2B3);
}




/* -- Critical Tasks panel (matches critical-actions-panel.tsx) -- */
.cpo-actions-card[b-z5o3ojl0pv] {
    padding: 0;
}


.cpo-actions-list[b-z5o3ojl0pv] {
    display: flex;
    flex-direction: column;
}

.cpo-action-link[b-z5o3ojl0pv] {
    display: block;
    color: inherit;
    text-decoration: none;
    border-bottom: 1px solid var(--lw-border);
    transition: background 0.12s;
}

.cpo-action-link:last-child[b-z5o3ojl0pv] {
    border-bottom: none;
}

.cpo-action-link:hover[b-z5o3ojl0pv] {
    background: color-mix(in srgb, var(--lw-accent) 50%, transparent);
}

button.cpo-action-link[b-z5o3ojl0pv] {
    background: transparent;
    border: 0;
    border-bottom: 1px solid var(--lw-border);
    width: 100%;
    padding: 0;
    margin: 0;
    text-align: inherit;
    font: inherit;
    color: inherit;
    cursor: pointer;
}

button.cpo-action-link:last-child[b-z5o3ojl0pv] {
    border-bottom: none;
}

.cpo-action-row[b-z5o3ojl0pv] {
    display: flex;
    align-items: flex-start;
    gap: 0.75rem;
    padding: 0.75rem 1.25rem;
}

.cpo-action-dot[b-z5o3ojl0pv] {
    flex-shrink: 0;
    width: 8px;
    height: 8px;
    margin-top: 6px;
    display: inline-block;
}

.cpo-action-dot-urgent[b-z5o3ojl0pv] { background: var(--lw-destructive); }
.cpo-action-dot-high[b-z5o3ojl0pv]   { background: var(--lw-status-warning-fg); }
.cpo-action-dot-medium[b-z5o3ojl0pv] { background: var(--lw-primary-blue, #3980A5); }

.cpo-action-body[b-z5o3ojl0pv] {
    flex: 1;
    min-width: 0;
}

.cpo-action-title[b-z5o3ojl0pv] {
    font-size: 0.875rem;
    font-weight: 500;
    color: var(--lw-text-primary, #1e1e24);
    margin: 0;
    line-height: 1.35;
}

.cpo-action-due[b-z5o3ojl0pv] {
    flex-shrink: 0;
    font-size: 0.75rem;
    white-space: nowrap;
    margin-top: 2px;
}

.cpo-action-due-urgent[b-z5o3ojl0pv]  { color: var(--lw-destructive); font-weight: 600; }
.cpo-action-due-soon[b-z5o3ojl0pv]    { color: var(--lw-status-warning-fg); font-weight: 500; }
.cpo-action-due-default[b-z5o3ojl0pv] { color: var(--lw-gray-space, #9DA2B3); }

.cpo-actions-empty[b-z5o3ojl0pv] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 4px;
    padding: 2rem 1.25rem;
    text-align: center;
}

.cpo-actions-empty-title[b-z5o3ojl0pv] {
    font-size: 0.875rem;
    font-weight: 500;
    color: var(--lw-text-primary, #1e1e24);
    margin: 0;
}

.cpo-actions-empty-sub[b-z5o3ojl0pv] {
    font-size: 0.75rem;
    color: var(--lw-gray-space, #9DA2B3);
    margin: 0;
}

.cpo-actions-pager[b-z5o3ojl0pv] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 0.625rem 1.25rem;
    border-top: 1px solid var(--lw-border);
}

.cpo-actions-pager-range[b-z5o3ojl0pv] {
    font-size: 11px;
    color: var(--lw-gray-space, #9DA2B3);
}

.cpo-actions-pager-controls[b-z5o3ojl0pv] {
    display: inline-flex;
    align-items: center;
    gap: 0.25rem;
}

/* Reference (critical-actions-panel.tsx): text Prev/Next, h-6 px-1.5 11px medium. */
.cpo-actions-pager-btn[b-z5o3ojl0pv] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    height: 24px;
    padding: 0 6px;
    background: transparent;
    border: none;
    cursor: pointer;
    font-family: var(--lw-font-family);
    font-size: 11px;
    font-weight: 500;
    color: var(--lw-gray-space, #9DA2B3);
    transition: color 0.15s;
}

.cpo-actions-pager-btn:hover:not(:disabled)[b-z5o3ojl0pv] {
    color: var(--lw-text-primary, #1e1e24);
}

.cpo-actions-pager-btn:disabled[b-z5o3ojl0pv] {
    opacity: 0.3;
    pointer-events: none;
}

.cpo-actions-pager-page[b-z5o3ojl0pv] {
    min-width: 32px;
    text-align: center;
    font-size: 11px;
    color: var(--lw-gray-space, #9DA2B3);
}/* Funding action row (owner-onboarding-card.tsx / request-funds-panel.tsx
   collapsed state): border-t pt-6; FundingRow = 44px muted tile w/ 20px
   content-secondary glyph, 14/600 title, 12px muted sub; action button right. */
.cpo-fundrow[b-z5o3ojl0pv] {
    margin-top: 24px;
    border-top: 1px solid var(--lw-border);
    padding-top: 24px;
    display: flex;
    flex-direction: column;
    gap: 12px;
}

@media (min-width: 640px) {
    .cpo-fundrow[b-z5o3ojl0pv] {
        flex-direction: row;
        align-items: center;
        justify-content: space-between;
    }
}

.cpo-fundrow-left[b-z5o3ojl0pv] {
    display: flex;
    align-items: center;
    gap: 14px;
    min-width: 0;
}

.cpo-fundrow-tile[b-z5o3ojl0pv] {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 44px;
    height: 44px;
    flex-shrink: 0;
    border-radius: var(--lw-radius-card);
    background: var(--lw-bg-muted);
    color: var(--lw-gray-graphite);
}

.cpo-fundrow-tile[b-z5o3ojl0pv]  .mud-icon-root {
    width: 20px;
    height: 20px;
    font-size: 20px;
}

.cpo-fundrow-text[b-z5o3ojl0pv] { min-width: 0; }
.cpo-fundrow-title[b-z5o3ojl0pv] { margin: 0; font-size: 0.875rem; font-weight: 600; color: var(--lw-text-primary); }
.cpo-fundrow-sub[b-z5o3ojl0pv] { margin: 2px 0 0; font-size: 0.75rem; color: var(--lw-gray-space); }

/* Budget utilization. The bar itself is LwStackedBar (US-474) -- the segment and
   legend chrome lives in the atom, so only the card's spacing is page-level. What
   remains here is the empty state, which the atom does not model: a zero-total
   budget has no segments to draw, only a message. */
.cpo-budget-card[b-z5o3ojl0pv]  .lw-stacked-bar {
    margin-top: 16px;
}

.cpo-stack-bar[b-z5o3ojl0pv] {
    margin-top: 16px;
    display: flex;
    height: 24px;
    overflow: hidden;
    border-radius: 9999px;
    background: color-mix(in srgb, var(--lw-gray-smoke) 40%, transparent);
}

.cpo-stack-bar-empty[b-z5o3ojl0pv] {
    align-items: center;
    justify-content: center;
    background: color-mix(in srgb, var(--lw-gray-smoke) 30%, transparent);
}

.cpo-stack-bar-empty span[b-z5o3ojl0pv] {
    font-size: 11px;
    font-weight: 500;
    color: var(--lw-gray-graphite);
}

.cpo-stack-legend[b-z5o3ojl0pv] {
    margin-top: 12px;
    display: flex;
    flex-wrap: wrap;
    column-gap: 16px;
    row-gap: 4px;
}

.cpo-legend-item[b-z5o3ojl0pv] {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    font-size: 11px;
    color: var(--lw-gray-graphite);
}

/* Info icon for the minimum/reserve balance explanations (US-614) */
.cpo-info-icon[b-z5o3ojl0pv] {
    width: 13px;
    height: 13px;
    font-size: 13px;
    color: var(--lw-gray-graphite, #6E7180);
    opacity: 0.8;
    vertical-align: middle;
    margin-left: 4px;
}
/* _content/Ledgerwise/Components/Pages/Client/ClientProjectPendingOverview.razor.rz.scp.css */
/* Project Owner pending-overview (account not open yet).
   Measured against ledgerwise-ui-app:
   - src/components/organisms/project/project-overview.tsx (max-w-[1100px] gap-4)
   - src/components/organisms/kickoff/control-card.tsx (header: gap-3.5 px-5 py-4
     md:px-6 bg-white border-b; 44px info-bg/brand-accent icon tile w/ 20px glyph;
     16px bold title, 12px muted sub; body p-5 md:p-6 on form-surface)
   - src/components/organisms/project/proposal-detail-sections.tsx (PartyRoster,
     ReadField) and proposal-details-panel.tsx (Field). */

.cppo[b-5dw804ojfd] {
    display: flex;
    flex-direction: column;
    gap: 16px;
    max-width: 1100px;
    margin: 0 auto;
}

[b-5dw804ojfd] .cppo-card {
    padding: 0;
    overflow: hidden;
}

/* ControlCard header band: items-center gap-3.5 px-5 py-4 md:px-6, white over
   the form-surface body */
.cppo-card-head[b-5dw804ojfd] {
    display: flex;
    align-items: center;
    gap: 14px;
    padding: 16px 20px;
    background: var(--lw-white, #fff);
    border-bottom: 1px solid var(--lw-border);
}

/* 44px icon tile: rounded-card bg-info-bg text-brand-accent, 20px glyph */
.cppo-icon[b-5dw804ojfd] {
    flex-shrink: 0;
    width: 44px;
    height: 44px;
    border-radius: var(--lw-radius-card, 8px);
    background: var(--lw-status-info-bg);
    color: var(--lw-primary-blue);
    display: inline-flex;
    align-items: center;
    justify-content: center;
}

[b-5dw804ojfd] .cppo-icon .mud-icon-root {
    width: 20px;
    height: 20px;
    font-size: 20px;
}

.cppo-card-head-text[b-5dw804ojfd] {
    min-width: 0;
    flex: 1;
}

/* text-base font-bold text-foreground */
.cppo-card-title[b-5dw804ojfd] {
    margin: 0;
    font-size: 1rem;
    font-weight: 700;
    color: var(--lw-text-primary);
}

/* text-xs text-muted-foreground */
.cppo-card-sub[b-5dw804ojfd] {
    margin: 0;
    font-size: 0.75rem;
    color: var(--lw-gray-space, #9DA2B3);
}

/* ControlCard body: p-5 md:p-6, form-surface (the card root's own background) */
.cppo-card-body[b-5dw804ojfd] {
    padding: 20px;
}

@media (min-width: 768px) {
    .cppo-card-head[b-5dw804ojfd] {
        padding: 16px 24px;
    }

    .cppo-card-body[b-5dw804ojfd] {
        padding: 24px;
    }
}

/* Description read state: text-sm leading-relaxed content-secondary */
.cppo-description[b-5dw804ojfd] {
    margin: 0;
    font-size: 0.875rem;
    line-height: 1.625;
    color: var(--lw-gray-graphite);
}

/* Rich-text children arrive via MarkupString (no scope attribute), so ::deep. */
[b-5dw804ojfd] .cppo-description p,
[b-5dw804ojfd] .cppo-description ul,
[b-5dw804ojfd] .cppo-description ol {
    margin: 0 0 8px;
}

[b-5dw804ojfd] .cppo-description strong {
    font-weight: 600;
    color: var(--lw-text-primary);
}

[b-5dw804ojfd] .cppo-description > :last-child {
    margin-bottom: 0;
}

/* Shared roster rows (owners + team) -- PartyRoster: gap-3 list; rows
   items-start gap-3.5 rounded-card border bg-white p-4 */
.cppo-roster[b-5dw804ojfd] {
    display: flex;
    flex-direction: column;
    gap: 12px;
}

.cppo-roster-row[b-5dw804ojfd] {
    display: flex;
    align-items: flex-start;
    gap: 14px;
    background: var(--lw-white, #fff);
    border: 1px solid var(--lw-border);
    border-radius: var(--lw-radius-card, 8px);
    padding: 16px;
}

.cppo-roster-avatar[b-5dw804ojfd] {
    flex-shrink: 0;
    width: 40px;
    height: 40px;
    border-radius: 50%;
    background: var(--lw-primary-blue);
    color: #fff;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    font-size: 13px;
    font-weight: 700;
    letter-spacing: 0.02em;
}

.cppo-roster-avatar--team[b-5dw804ojfd] {
    background: var(--lw-primary-dark);
}

.cppo-roster-info[b-5dw804ojfd] {
    display: flex;
    flex-direction: column;
    min-width: 0;
}

/* text-sm font-semibold text-foreground */
.cppo-roster-name[b-5dw804ojfd] {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    font-size: 0.875rem;
    font-weight: 600;
    color: var(--lw-text-primary);
}

/* Badge size=sm: h-5 px-1.5 text-[10px] bold uppercase tracking-wide rounded-sm */
.cppo-roster-chip[b-5dw804ojfd] {
    display: inline-flex;
    align-items: center;
    height: 20px;
    font-size: 10px;
    font-weight: 700;
    letter-spacing: 0.025em;
    text-transform: uppercase;
    line-height: 1;
    color: var(--lw-status-neutral-fg);
    background: var(--lw-status-neutral-bg);
    border-radius: var(--lw-radius-control, 8px);
    padding: 0 6px;
}

/* text-xs text-muted-foreground */
.cppo-roster-sub[b-5dw804ojfd] {
    font-size: 0.75rem;
    color: var(--lw-gray-space, #9DA2B3);
}

/* mt-0.5 text-[13px] text-content-secondary */
.cppo-roster-contact[b-5dw804ojfd] {
    margin-top: 2px;
    font-size: 13px;
    color: var(--lw-gray-graphite);
}

/* Field grids (account settings, project details): gap-4 sm:2-col lg:3-col */
.cppo-grid[b-5dw804ojfd] {
    display: grid;
    gap: 16px;
    grid-template-columns: 1fr;
}

@media (min-width: 640px) {
    .cppo-grid--2[b-5dw804ojfd] {
        grid-template-columns: repeat(2, 1fr);
    }

    .cppo-grid--3[b-5dw804ojfd] {
        grid-template-columns: repeat(2, 1fr);
    }
}

@media (min-width: 1024px) {
    .cppo-grid--3[b-5dw804ojfd] {
        grid-template-columns: repeat(3, 1fr);
    }
}

.cppo-field[b-5dw804ojfd] {
    display: flex;
    flex-direction: column;
    gap: 4px;
    min-width: 0;
}

/* text-xs font-medium uppercase tracking-wide text-muted-foreground */
.cppo-field-label[b-5dw804ojfd] {
    font-size: 0.75rem;
    font-weight: 500;
    letter-spacing: 0.025em;
    text-transform: uppercase;
    color: var(--lw-gray-space, #9DA2B3);
    display: inline-flex;
    align-items: center;
    gap: 4px;
}

/* Info icon for the minimum/reserve balance explanations (US-614) */
.cppo-info-icon[b-5dw804ojfd] {
    width: 13px;
    height: 13px;
    font-size: 13px;
    color: var(--lw-gray-space, #9DA2B3);
    opacity: 0.85;
}

/* text-sm text-foreground, gap-1.5 icon row */
.cppo-field-value[b-5dw804ojfd] {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    font-size: 0.875rem;
    color: var(--lw-text-primary);
    overflow-wrap: anywhere;
}

/* size-3.5 text-muted-foreground */
[b-5dw804ojfd] .cppo-field-icon {
    width: 14px;
    height: 14px;
    font-size: 14px;
    color: var(--lw-gray-space, #9DA2B3);
    flex-shrink: 0;
}
/* _content/Ledgerwise/Components/Pages/Client/HomeownerDocumentDrawer.razor.rz.scp.css */
/* Document detail bottom sheet. Source: ledgerwise-app
   organisms/owner/owner-document-detail-drawer.tsx + ui/drawer.tsx sheet
   variant + molecules/document-preview.tsx (measured 2026-07-20):
   backdrop foreground/40 + 2px blur; sheet inset-x-0 bottom-0
   h-[calc(100dvh-48px)] rounded-t-[12px] bg-muted; card header/footer bands;
   preview on the drafting dot grid; 300px metadata sidebar. */

.ho-drawer[b-s1jzjih57s] {
    position: fixed;
    inset: 0;
    z-index: var(--lw-z-sheet);
    visibility: hidden;
    pointer-events: none;
}

.ho-drawer.open[b-s1jzjih57s] {
    visibility: visible;
    pointer-events: auto;
}

.ho-drawer-scrim[b-s1jzjih57s] {
    position: absolute;
    inset: 0;
    background: var(--lw-scrim);
    backdrop-filter: var(--lw-scrim-blur);
    -webkit-backdrop-filter: var(--lw-scrim-blur);
    opacity: 0;
    transition: opacity 0.2s ease;
}

.ho-drawer.open .ho-drawer-scrim[b-s1jzjih57s] { opacity: 1; }

/* Bottom sheet: covers everything but a 48px top gap. */
.ho-drawer-panel[b-s1jzjih57s] {
    position: absolute;
    left: 0;
    right: 0;
    bottom: 0;
    height: calc(100dvh - 48px);
    display: flex;
    flex-direction: column;
    overflow: hidden;
    border-radius: 12px 12px 0 0;
    background: var(--lw-bg-muted);
    box-shadow: var(--lw-shadow-lg);
    transform: translateY(100%);
    transition: transform 0.3s ease;
}

.ho-drawer.open .ho-drawer-panel[b-s1jzjih57s] { transform: translateY(0); }

/* Header: white band, title + nav cluster. */
.ho-drawer-head[b-s1jzjih57s] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    flex-shrink: 0;
    padding: 16px 24px;
    border-bottom: 1px solid var(--lw-border);
    background: var(--lw-white);
    border-radius: 12px 12px 0 0;
}

.ho-drawer-name[b-s1jzjih57s] {
    margin: 0;
    min-width: 0;
    flex: 1;
    font-family: var(--lw-font-family);
    font-size: 1.125rem;
    font-weight: var(--lw-font-bold);
    color: var(--lw-text-primary);
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.ho-drawer-headtools[b-s1jzjih57s] { display: flex; align-items: center; gap: 4px; flex-shrink: 0; }

.ho-drawer-navbtn[b-s1jzjih57s] {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 32px;
    height: 32px;
    border: none;
    background: none;
    padding: 0;
    color: var(--lw-gray-graphite);
    cursor: pointer;
    transition: color 0.15s ease;
}

.ho-drawer-navbtn:hover:not(:disabled)[b-s1jzjih57s] { color: var(--lw-text-primary); }
.ho-drawer-navbtn:disabled[b-s1jzjih57s] { opacity: 0.3; cursor: default; }
.ho-drawer-navbtn[b-s1jzjih57s]  .mud-icon-root { width: 1rem; height: 1rem; }
.ho-drawer-close[b-s1jzjih57s]  .mud-icon-root { width: 1.125rem; height: 1.125rem; }

.ho-drawer-navcount[b-s1jzjih57s] {
    min-width: 36px;
    text-align: center;
    font-size: 0.75rem;
    font-variant-numeric: tabular-nums;
    color: var(--lw-gray-graphite);
}

.ho-drawer-divider[b-s1jzjih57s] { margin: 0 4px; height: 20px; width: 1px; background: var(--lw-border); }

/* Body: preview pane + metadata sidebar. */
.ho-drawer-body[b-s1jzjih57s] {
    display: flex;
    flex: 1;
    min-height: 0;
}

.ho-drawer-preview[b-s1jzjih57s] {
    position: relative;
    min-width: 0;
    flex: 1;
    overflow: auto;
    background-color: var(--lw-white);
    background-image: radial-gradient(color-mix(in srgb, var(--lw-text-primary) 5%, transparent) 1.5px, transparent 1.5px);
    background-size: 16px 16px;
}

.ho-drawer-center[b-s1jzjih57s] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    height: 100%;
    text-align: center;
    padding: 24px;
}

.ho-drawer-iframe[b-s1jzjih57s] { width: 100%; height: 100%; border: none; display: block; }

.ho-drawer-imagewrap[b-s1jzjih57s] {
    display: flex;
    min-height: 100%;
    padding: 24px;
}

.ho-drawer-image[b-s1jzjih57s] {
    margin: auto;
    max-width: 100%;
    max-height: 100%;
    object-fit: contain;
    border: 1px solid var(--lw-border);
    border-radius: var(--lw-radius-control);
    background: var(--lw-white);
    box-shadow: var(--lw-shadow-card);
}

/* Metadata sidebar: 300px card band with uppercase heading + divided rows. */
.ho-drawer-meta[b-s1jzjih57s] {
    width: 300px;
    flex-shrink: 0;
    overflow-y: auto;
    border-left: 1px solid var(--lw-border);
    background: var(--lw-white);
    padding: 20px;
}

@media (max-width: 767px) {
    .ho-drawer-meta[b-s1jzjih57s] { display: none; }
}

.ho-drawer-metahead[b-s1jzjih57s] {
    margin: 0 0 12px;
    font-family: var(--lw-font-family);
    font-size: 0.75rem;
    font-weight: var(--lw-font-bold);
    text-transform: uppercase;
    letter-spacing: 0.025em;
    color: var(--lw-gray-graphite);
}

.ho-drawer-metarows[b-s1jzjih57s] { display: flex; flex-direction: column; }

.ho-drawer-metarow[b-s1jzjih57s] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
    min-height: 32px;
    padding: 10px 0;
    border-bottom: 1px solid var(--lw-border);
}

.ho-drawer-metarow:last-child[b-s1jzjih57s] { border-bottom: none; }

.ho-drawer-metalabel[b-s1jzjih57s] {
    flex-shrink: 0;
    font-size: 0.6875rem;
    font-weight: var(--lw-font-semibold);
    text-transform: uppercase;
    letter-spacing: 0.025em;
    color: var(--lw-gray-graphite);
}

.ho-drawer-metavalue[b-s1jzjih57s] {
    text-align: right;
    font-size: 0.875rem;
    color: var(--lw-text-primary);
    min-width: 0;
    overflow-wrap: anywhere;
}

/* Footer: white band, outline Close left, navy Download right. */
.ho-drawer-foot[b-s1jzjih57s] {
    display: flex;
    align-items: center;
    gap: 8px;
    flex-shrink: 0;
    padding: 12px 24px;
    border-top: 1px solid var(--lw-border);
    background: var(--lw-white);
}

.ho-drawer-foot-spacer[b-s1jzjih57s] { flex: 1; }

.ho-drawer-closebtn[b-s1jzjih57s] {
    height: 36px;
    padding: 0 16px;
    border: 1px solid var(--lw-border);
    border-radius: var(--lw-radius-control);
    background: var(--lw-white);
    font-size: 0.875rem;
    font-weight: var(--lw-font-medium);
    color: var(--lw-text-primary);
    cursor: pointer;
    transition: background 0.15s ease;
}

.ho-drawer-closebtn:hover[b-s1jzjih57s] { background: var(--lw-accent); }

.ho-drawer-downloadbtn[b-s1jzjih57s] {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    height: 36px;
    padding: 0 20px;
    border: none;
    border-radius: var(--lw-radius-control);
    background: var(--lw-primary-dark);
    color: var(--lw-primary-dark-fg);
    font-size: 0.875rem;
    font-weight: var(--lw-font-medium);
    cursor: pointer;
    transition: background 0.15s ease;
}

.ho-drawer-downloadbtn:hover[b-s1jzjih57s] { background: var(--lw-primary-dark-hover); }
.ho-drawer-downloadbtn[b-s1jzjih57s]  .mud-icon-root { width: 1rem; height: 1rem; }
/* _content/Ledgerwise/Components/Pages/Client/HomeownerPhotoLightbox.razor.rz.scp.css */
/* Full-screen photo lightbox. Source: ledgerwise-app
   organisms/photo-lightbox.tsx (measured 2026-07-20): rgba(0,0,0,0.95)
   overlay; gradient top/bottom bars; 32px round glass close; 36px round
   glass nav arrows; image max-h calc(100vh - 160px) radius 4px; bottom
   glass action pill with icon-over-label buttons. */

.ho-lightbox[b-wp01j4lr8m] {
    position: fixed;
    inset: 0;
    z-index: 2000;
    display: flex;
    flex-direction: column;
    background: rgba(0, 0, 0, 0.95);
    visibility: hidden;
    opacity: 0;
    pointer-events: none;
    transition: opacity 0.2s ease, visibility 0.2s ease;
    outline: none;
}

.ho-lightbox.open[b-wp01j4lr8m] {
    visibility: visible;
    opacity: 1;
    pointer-events: auto;
}

/* Top bar: filename + counter/close over a fading gradient. */
.ho-lb-topbar[b-wp01j4lr8m] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    flex-shrink: 0;
    padding: 12px 24px;
    background: linear-gradient(180deg, rgba(0, 0, 0, 0.6) 0%, transparent 100%);
}

.ho-lb-name[b-wp01j4lr8m] {
    min-width: 0;
    font-size: 0.8125rem;
    font-weight: var(--lw-font-medium);
    color: rgba(255, 255, 255, 0.7);
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.ho-lb-topactions[b-wp01j4lr8m] { display: flex; align-items: center; gap: 12px; flex-shrink: 0; }

.ho-lb-counter[b-wp01j4lr8m] {
    font-size: 0.75rem;
    font-variant-numeric: tabular-nums;
    color: rgba(255, 255, 255, 0.6);
}

.ho-lb-close[b-wp01j4lr8m] {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 32px;
    height: 32px;
    border: none;
    border-radius: 9999px;
    background: rgba(255, 255, 255, 0.15);
    color: #fff;
    cursor: pointer;
    transition: background 0.15s ease;
    padding: 0;
}

.ho-lb-close:hover[b-wp01j4lr8m] { background: rgba(255, 255, 255, 0.1); }
.ho-lb-close[b-wp01j4lr8m]  .mud-icon-root { width: 1rem; height: 1rem; }

/* Stage: image centered between the nav arrows. */
.ho-lb-stage[b-wp01j4lr8m] {
    position: relative;
    display: flex;
    flex: 1;
    align-items: center;
    justify-content: center;
    min-height: 0;
}

.ho-lb-img[b-wp01j4lr8m] {
    max-height: calc(100vh - 160px);
    max-width: calc(100vw - 120px);
    object-fit: contain;
    border-radius: var(--lw-radius-sm);
}

.ho-lb-nav[b-wp01j4lr8m] {
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    z-index: 10;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 36px;
    height: 36px;
    border: none;
    border-radius: 9999px;
    background: rgba(255, 255, 255, 0.1);
    color: rgba(255, 255, 255, 0.7);
    cursor: pointer;
    transition: background 0.15s ease;
    padding: 0;
}

.ho-lb-nav:hover:not(:disabled)[b-wp01j4lr8m] { background: rgba(255, 255, 255, 0.15); }
.ho-lb-nav:disabled[b-wp01j4lr8m] { opacity: 0.3; cursor: default; }
.ho-lb-nav[b-wp01j4lr8m]  .mud-icon-root { width: 1.25rem; height: 1.25rem; }
.ho-lb-prev[b-wp01j4lr8m] { left: 24px; }
.ho-lb-next[b-wp01j4lr8m] { right: 24px; }

/* Bottom action pill over a rising gradient. */
.ho-lb-bottombar[b-wp01j4lr8m] {
    display: flex;
    justify-content: center;
    flex-shrink: 0;
    padding: 8px 0 16px;
    background: linear-gradient(0deg, rgba(0, 0, 0, 0.6) 0%, transparent 100%);
}

.ho-lb-pill[b-wp01j4lr8m] {
    display: flex;
    align-items: center;
    gap: 6px;
    border-radius: 10px;
    padding: 8px 12px;
    background: rgba(255, 255, 255, 0.1);
    backdrop-filter: blur(12px);
}

.ho-lb-pillbtn[b-wp01j4lr8m] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    width: 36px;
    height: 36px;
    border: none;
    border-radius: var(--lw-radius-sm);
    background: transparent;
    color: rgba(255, 255, 255, 0.85);
    cursor: pointer;
    transition: background 0.15s ease;
    padding: 0;
}

.ho-lb-pillbtn:hover[b-wp01j4lr8m] { background: rgba(255, 255, 255, 0.1); }
.ho-lb-pillbtn[b-wp01j4lr8m]  .mud-icon-root { width: 18px; height: 18px; }

.ho-lb-pillbtn span[b-wp01j4lr8m] {
    margin-top: 1px;
    font-size: 8px;
    color: rgba(255, 255, 255, 0.7);
}
/* _content/Ledgerwise/Components/Pages/Client/OwnerSignaturesCard.razor.rz.scp.css */
/* Waiting-on-the-other-owners card.
   Measured against ledgerwise-ui-app:
   - src/components/organisms/kickoff/control-card.tsx (header: items-center
     gap-3.5 px-5 py-4 md:px-6 bg-white border-b; 44px rounded-card info-bg /
     brand-accent icon tile w/ 20px glyph; 16px bold title, 12px muted sub;
     body p-5 md:p-6 on the card's form-surface)
   - src/components/organisms/project/signature-roster.tsx (gap-3 header row,
     gap-2 list, rows px-3.5 py-2.5 gap-3, 32px muted avatar, sm badges)
   - src/components/ui/button.tsx (size=action: h-10 px-5 text-sm rounded-md). */

[b-bzy72r6cvn] .osc-card {
    padding: 0;
    overflow: hidden;
}

.osc-head[b-bzy72r6cvn] {
    display: flex;
    align-items: center;
    gap: 14px;
    padding: 16px 20px;
    background: var(--lw-white, #fff);
    border-bottom: 1px solid var(--lw-border);
}

/* 44px icon tile: rounded-card bg-info-bg text-brand-accent, 20px glyph */
.osc-icon[b-bzy72r6cvn] {
    flex-shrink: 0;
    width: 44px;
    height: 44px;
    border-radius: var(--lw-radius-card, 8px);
    background: var(--lw-status-info-bg);
    color: var(--lw-primary-blue);
    display: inline-flex;
    align-items: center;
    justify-content: center;
}

[b-bzy72r6cvn] .osc-icon .mud-icon-root {
    width: 20px;
    height: 20px;
    font-size: 20px;
}

.osc-head-text[b-bzy72r6cvn] {
    min-width: 0;
    flex: 1;
}

/* text-base font-bold text-foreground */
.osc-title[b-bzy72r6cvn] {
    margin: 0;
    font-size: 1rem;
    font-weight: 700;
    color: var(--lw-text-primary);
}

/* text-xs text-muted-foreground */
.osc-sub[b-bzy72r6cvn] {
    margin: 0;
    font-size: 0.75rem;
    color: var(--lw-gray-space, #9DA2B3);
}

/* ControlCard body: p-5 md:p-6 on the card's form-surface background */
.osc-body[b-bzy72r6cvn] {
    display: flex;
    flex-direction: column;
    gap: 20px;
    padding: 20px;
}

@media (min-width: 768px) {
    .osc-head[b-bzy72r6cvn] {
        padding: 16px 24px;
    }

    .osc-body[b-bzy72r6cvn] {
        padding: 24px;
    }
}

/* SignatureRoster: flex-col gap-3 */
.osc-roster[b-bzy72r6cvn] {
    display: flex;
    flex-direction: column;
    gap: 12px;
}

.osc-roster-head[b-bzy72r6cvn] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
}

/* text-sm font-semibold text-foreground w/ size-4 content-secondary icon */
.osc-roster-title[b-bzy72r6cvn] {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    font-size: 0.875rem;
    font-weight: 600;
    color: var(--lw-text-primary);
}

[b-bzy72r6cvn] .osc-roster-title .mud-icon-root {
    width: 16px;
    height: 16px;
    font-size: 16px;
    color: var(--lw-gray-graphite);
}

/* text-xs text-content-secondary */
.osc-roster-caption[b-bzy72r6cvn] {
    flex-shrink: 0;
    font-size: 0.75rem;
    color: var(--lw-gray-graphite);
}

/* List: gap-2 */
.osc-roster-body[b-bzy72r6cvn] {
    display: flex;
    flex-direction: column;
    gap: 8px;
}

/* Row: items-center gap-3 rounded-card border bg-white px-3.5 py-2.5 */
.osc-row[b-bzy72r6cvn] {
    display: flex;
    align-items: center;
    gap: 12px;
    background: var(--lw-white, #fff);
    border: 1px solid var(--lw-border);
    border-radius: var(--lw-radius-card, 8px);
    padding: 10px 14px;
}

/* size-8 rounded-full bg-muted text-[11px] font-semibold content-secondary */
.osc-avatar[b-bzy72r6cvn] {
    flex-shrink: 0;
    width: 32px;
    height: 32px;
    border-radius: 50%;
    background: var(--lw-bg-muted, #F0F3F6);
    color: var(--lw-gray-graphite);
    display: inline-flex;
    align-items: center;
    justify-content: center;
    font-size: 11px;
    font-weight: 600;
    letter-spacing: 0.02em;
}

.osc-row-info[b-bzy72r6cvn] {
    flex: 1 1 auto;
    min-width: 0;
    display: flex;
    flex-direction: column;
}

/* text-sm font-medium text-foreground */
.osc-name[b-bzy72r6cvn] {
    font-size: 0.875rem;
    font-weight: 500;
    color: var(--lw-text-primary);
}

/* text-xs text-content-secondary */
.osc-row-sub[b-bzy72r6cvn] {
    font-size: 0.75rem;
    color: var(--lw-gray-graphite);
}

/* Badge size=sm: h-5 px-1.5 text-[10px] bold uppercase tracking-wide rounded-sm */
.osc-badge[b-bzy72r6cvn] {
    flex-shrink: 0;
    display: inline-flex;
    align-items: center;
    height: 20px;
    font-size: 10px;
    font-weight: 700;
    letter-spacing: 0.025em;
    text-transform: uppercase;
    line-height: 1;
    border-radius: var(--lw-radius-control, 8px);
    padding: 0 6px;
}

.osc-badge.is-signed[b-bzy72r6cvn] {
    color: var(--lw-status-success-fg);
    background: var(--lw-status-success-bg);
}

.osc-badge.is-invited[b-bzy72r6cvn] {
    color: var(--lw-status-info-fg);
    background: var(--lw-status-info-bg);
}

/* Right-aligned action button (button.tsx: default variant, size=action) */
.osc-actions[b-bzy72r6cvn] {
    display: flex;
    justify-content: flex-end;
}

.osc-sign-btn[b-bzy72r6cvn] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    height: 40px;
    padding: 0 20px;
    border-radius: var(--lw-radius-control, 8px);
    background: var(--lw-primary-dark, #020B2B);
    color: var(--lw-white, #fff);
    font-size: 0.875rem;
    font-weight: 500;
    text-decoration: none;
    white-space: nowrap;
    transition: background 0.15s;
}

.osc-sign-btn:hover[b-bzy72r6cvn] {
    background: color-mix(in srgb, var(--lw-primary-dark, #020B2B) 90%, transparent);
    color: var(--lw-white, #fff);
    text-decoration: none;
}
/* _content/Ledgerwise/Components/Pages/Contractors.razor.rz.scp.css */
/* Contractors list page -- page-level layout only. Column widths live inline
   in the markup (the page's column spec); cell/identity/icon-button chrome
   comes from the shared lw-row-* classes in lw-page.css. What remains here is
   Ledgerwise-specific: the preliminary-notices expansion panel (no ledgerwise-app analog; styled on
   the table-header surface, 13px rows). */

/* Preliminary-notices expansion panel: full-width strip between rows on the
   table-header surface, hairline top divider (row below draws its own). */
.lw-notices-panel[b-k9ub9yq6mc] {
    border-top: 1px solid var(--lw-border);
    background: var(--lw-bg-table-header);
    padding: 4px 16px 12px 72px; /* left-aligns under the identity text (16 + 40 avatar + 16 gap) */
    overflow-x: auto;
}

.lw-notices-table[b-k9ub9yq6mc] {
    width: 100%;
    border-collapse: collapse;
}

.lw-notices-table th[b-k9ub9yq6mc] {
    padding: 8px 12px 6px 0;
    font-size: 12px;
    font-weight: 500;
    color: var(--lw-gray-graphite);
    text-align: left;
    white-space: nowrap;
}

.lw-notices-table td[b-k9ub9yq6mc] {
    padding: 6px 12px 6px 0;
    font-size: 13px;
    color: var(--lw-text-primary);
    border-top: 1px solid var(--lw-border);
    vertical-align: middle;
}

.lw-notices-th-actions[b-k9ub9yq6mc],
.lw-notices-td-actions[b-k9ub9yq6mc] {
    white-space: nowrap;
}

.lw-notices-project[b-k9ub9yq6mc] {
    font-weight: var(--lw-font-medium);
}

.lw-notices-muted[b-k9ub9yq6mc] {
    font-size: 12px;
    color: var(--lw-gray-graphite);
}

/* Small bordered document chip-button (h-7, 12px, hairline, accent hover). */
.lw-notices-doc-btn[b-k9ub9yq6mc] {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    height: 28px;
    padding: 0 10px;
    border: 1px solid var(--lw-border);
    border-radius: var(--lw-radius-control);
    background: var(--lw-white);
    color: var(--lw-text-primary);
    cursor: pointer;
    font-family: var(--lw-font-family);
    font-size: 12px;
    font-weight: var(--lw-font-medium);
    text-decoration: none;
    transition: background 0.15s ease;
}

.lw-notices-doc-btn:hover[b-k9ub9yq6mc] {
    background: var(--lw-accent);
    color: var(--lw-text-primary);
    text-decoration: none;
}

.lw-notices-empty[b-k9ub9yq6mc] {
    display: flex;
    align-items: center;
    gap: 6px;
    margin: 0;
    padding: 12px 0 4px;
    font-size: 13px;
    color: var(--lw-gray-graphite);
}
/* _content/Ledgerwise/Components/Pages/Contractor/AddContractor.razor.rz.scp.css */
/* Add-vendor wizard -- PAGE-SPECIFIC step bodies only. The wizard shell
   (pw-shell / pw-rail* / pw-main / pw-content / pw-stack / pw-cc-link)
   lives in css/components/lw-wizard.css (AddProject is the other
   consumer). Field grids mirror the approved Contractor detail page. */

[b-xyhx5jvs4a] .ac-form {
    display: flex;
    flex-direction: column;
    gap: 16px;
}

[b-xyhx5jvs4a] .ac-grid2 {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 16px;
    align-items: start;
}

[b-xyhx5jvs4a] .ac-grid3 {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 16px;
    align-items: start;
}

@media (max-width: 700px) {
    [b-xyhx5jvs4a] .ac-grid2,
    [b-xyhx5jvs4a] .ac-grid3 {
        grid-template-columns: minmax(0, 1fr);
    }
}

/* Review step: reference Field label/value grid (1 -> 2 -> 3 columns). */
[b-xyhx5jvs4a] .ac-review {
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    gap: 20px;
}

@media (min-width: 640px) {
    [b-xyhx5jvs4a] .ac-review {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (min-width: 1024px) {
    [b-xyhx5jvs4a] .ac-review {
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }
}

[b-xyhx5jvs4a] .ac-field {
    display: flex;
    flex-direction: column;
    gap: 2px;
    min-width: 0;
}

[b-xyhx5jvs4a] .ac-field-label {
    font-family: var(--lw-font-family);
    font-size: 11px;
    font-weight: var(--lw-font-medium);
    text-transform: uppercase;
    letter-spacing: 0.025em;
    color: var(--lw-gray-space);
}

[b-xyhx5jvs4a] .ac-field-value {
    font-family: var(--lw-font-family);
    font-size: 14px;
    line-height: 20px;
    color: var(--lw-text-primary);
    overflow-wrap: anywhere;
}
/* _content/Ledgerwise/Components/Pages/Contractor/Contractor.razor.rz.scp.css */
/* Contractor detail/edit page -- reference: gc-vendor-detail.tsx (measured
   2026-07-28, corrected after the card-by-card conformance review: cards
   stack FULL-WIDTH in one muted column (no aside -- the reference and every
   migrated page render a single stacked column); header is items-start with
   a 56px circle avatar; Field label = 11px medium uppercase tracking-wide in
   the LIGHT muted-foreground (--lw-gray-space), value 14px foreground.
   The Blazor page keeps its edit-form role, so fields render as the
   FieldShell atoms inside the reference card stack. Layout only. */

/* Header top-aligns its children like the reference (items-start), and the
   loading state must not collapse the measured 88px bar height. */
[b-q068v1riob] .lw-page-titlebar {
    align-items: flex-start;
    min-height: 88px;
}

/* -- Header cluster (avatar + title + status chip) -- */
[b-q068v1riob] .co-head {
    display: flex;
    align-items: flex-start;
    gap: 16px;
    flex: 1;
    min-width: 0;
}

[b-q068v1riob] .co-head-text {
    display: flex;
    flex-direction: column;
    gap: 4px;
    flex: 1;
    min-width: 0;
}

[b-q068v1riob] .co-head-titlerow {
    display: flex;
    align-items: center;
    gap: 12px;
    flex-wrap: wrap;
}

/* Detail-header title reads at the 32px leading (LwProjectHeader recipe),
   tighter than the list-page 33px default; subtitle truncates on one line. */
[b-q068v1riob] .co-head .lw-page-title {
    line-height: 32px;
}

[b-q068v1riob] .co-head-text .lw-page-subtitle {
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

/* -- Muted body -- */
[b-q068v1riob] .co-body {
    display: flex;
    flex-direction: column;
    gap: 24px;
    padding: 24px;
    flex: 1;
}

/* -- Full-width stacked card column (reference gap-6) -- */
[b-q068v1riob] .co-cards {
    display: flex;
    flex-direction: column;
    gap: 24px;
}

/* -- Form internals: stacked fields, two-up rows -- */
[b-q068v1riob] .co-form {
    display: flex;
    flex-direction: column;
    gap: 16px;
}

[b-q068v1riob] .co-grid2 {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 16px;
    align-items: start;
}

@media (max-width: 700px) {
    [b-q068v1riob] .co-grid2 {
        grid-template-columns: minmax(0, 1fr);
    }
}

/* Boolean rows sit full-width under the field grid (reference toggle-row
   idiom), not inside a 2-up cell. */
[b-q068v1riob] .co-check-row {
    display: flex;
    align-items: center;
}

/* -- Record-details field grid (reference Field label/value pairs;
   grid-cols-1 -> sm:2 -> lg:3, gap-5 both axes) -- */
[b-q068v1riob] .co-fields {
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    gap: 20px;
}

@media (min-width: 640px) {
    [b-q068v1riob] .co-fields {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (min-width: 1024px) {
    [b-q068v1riob] .co-fields {
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }
}

[b-q068v1riob] .co-field {
    display: flex;
    flex-direction: column;
    gap: 2px;
    min-width: 0;
}

[b-q068v1riob] .co-field-label {
    font-family: var(--lw-font-family);
    font-size: 11px;
    font-weight: var(--lw-font-medium);
    text-transform: uppercase;
    letter-spacing: 0.025em;
    color: var(--lw-gray-space);
}

[b-q068v1riob] .co-field-value {
    font-family: var(--lw-font-family);
    font-size: 14px;
    line-height: 20px;
    color: var(--lw-text-primary);
    overflow-wrap: anywhere;
}

/* -- Error / not-found states -- */
[b-q068v1riob] .co-state {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 16px;
    max-width: 560px;
}

[b-q068v1riob] .co-state--center {
    align-items: center;
    align-self: center;
    text-align: center;
    padding: 48px 0;
}

[b-q068v1riob] .co-state-icon.mud-icon-root {
    width: 48px;
    height: 48px;
    font-size: 48px;
    color: var(--lw-gray-graphite);
}

[b-q068v1riob] .co-state-title {
    margin: 0;
    font-family: var(--lw-font-family);
    font-size: 18px;
    font-weight: var(--lw-font-bold);
    color: var(--lw-text-primary);
}

[b-q068v1riob] .co-state-sub {
    margin: 0;
    font-family: var(--lw-font-family);
    font-size: 14px;
    line-height: 20px;
    color: var(--lw-gray-graphite);
}
/* _content/Ledgerwise/Components/Pages/Contractor/ContractorPreliminaryNotice.razor.rz.scp.css */
/* Contractor preliminary-notice page -- migrated 2026-07-28 onto the
   approved detail-page grammar (no ledgerwise-app reference: the NCS
   preliminary-notice feature does not exist in the prototype). lw-page
   titlebar, muted body of full-width ControlCards, reference Field
   label/value grid, canonical toasts. Layout only. */

[b-o6imijnfx0] .cpn-body {
    display: flex;
    flex-direction: column;
    gap: 24px;
    padding: 24px;
    flex: 1;
}

[b-o6imijnfx0] .cpn-state {
    max-width: 560px;
}

[b-o6imijnfx0] .cpn-form {
    display: flex;
    flex-direction: column;
    gap: 16px;
}

[b-o6imijnfx0] .cpn-grid2 {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 16px;
    align-items: start;
}

@media (max-width: 700px) {
    [b-o6imijnfx0] .cpn-grid2 {
        grid-template-columns: minmax(0, 1fr);
    }
}

/* Field pairs (reference Field recipe; 1 -> 2 -> 3 columns). */
[b-o6imijnfx0] .cpn-fields {
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    gap: 20px;
}

@media (min-width: 640px) {
    [b-o6imijnfx0] .cpn-fields {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (min-width: 1024px) {
    [b-o6imijnfx0] .cpn-fields {
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }
}

/* Project-summary strip inside the submit card sits above the inputs. */
[b-o6imijnfx0] .cpn-fields--tight {
    padding-bottom: 4px;
}

[b-o6imijnfx0] .cpn-field {
    display: flex;
    flex-direction: column;
    gap: 2px;
    min-width: 0;
}

[b-o6imijnfx0] .cpn-field-label {
    font-family: var(--lw-font-family);
    font-size: 11px;
    font-weight: var(--lw-font-medium);
    text-transform: uppercase;
    letter-spacing: 0.025em;
    color: var(--lw-gray-space);
}

[b-o6imijnfx0] .cpn-field-value {
    font-family: var(--lw-font-family);
    font-size: 14px;
    line-height: 20px;
    color: var(--lw-text-primary);
    overflow-wrap: anywhere;
}

/* NCS document links row under the status fields. */
[b-o6imijnfx0] .cpn-doclinks {
    display: flex;
    align-items: center;
    gap: 12px;
    flex-wrap: wrap;
    margin-top: 20px;
}

[b-o6imijnfx0] .cpn-caption {
    margin: 0;
    text-align: center;
    font-family: var(--lw-font-family);
    font-size: 12px;
    line-height: 18px;
    color: var(--lw-gray-graphite);
}

/* Accent link inside the warning note. */
[b-o6imijnfx0] .cpn-link {
    color: var(--lw-primary-blue);
    font-weight: var(--lw-font-medium);
    text-decoration: none;
}

[b-o6imijnfx0] .cpn-link:hover {
    text-decoration: underline;
}

/* Pricing checklist (16px check glyph in success-dark + 13px copy). */
[b-o6imijnfx0] .cpn-checklist {
    margin: 0;
    padding: 0;
    list-style: none;
    display: flex;
    flex-direction: column;
    gap: 10px;
}

[b-o6imijnfx0] .cpn-checklist li {
    display: flex;
    align-items: flex-start;
    gap: 8px;
    font-family: var(--lw-font-family);
    font-size: 13px;
    line-height: 18px;
    color: var(--lw-gray-graphite);
}

[b-o6imijnfx0] .cpn-checklist svg {
    width: 14px;
    height: 14px;
    flex-shrink: 0;
    margin-top: 2px;
    color: #2D7A5F; /* success-dark, per the vim-step/tracker reference */
}
/* _content/Ledgerwise/Components/Pages/Contractor/ContractorProject.razor.rz.scp.css */
/* -- Page wrapper -- */
/* MainLayout wraps @Body in a pa-6 container (24px gutters). Like the GC
   detail (.lw-project-detail-shell) and the client detail, escape them with
   a negative margin so the header + tabs run edge-to-edge on white and the
   muted bg fills the rest. */
.cp-page[b-dexljxpquy] {
    display: flex;
    flex-direction: column;
    margin: -24px;
    min-height: calc(100% + 48px);
    background: var(--lw-bg-muted);
}

/* Loading / error / not-found states are direct children of the full-bleed
   wrapper -- restore the gutters it cancelled (same as the GC detail). */
.cp-page[b-dexljxpquy]  > .mud-stack,
.cp-page[b-dexljxpquy]  > .mud-alert {
    margin: 24px;
}

/* -- Project Header -- */
.cp-header[b-dexljxpquy] {
    background: var(--lw-white);
    border-bottom: 1px solid var(--lw-border);
    padding: 1.25rem 1.5rem 0;
}

.cp-identity[b-dexljxpquy] {
    display: flex;
    align-items: center;
    gap: 1rem; /* gap-4 */
    margin-bottom: 1rem; /* reference: tab strip is mt-4 below the identity zone */
}

/* Avatar is the shared LwAvatar atom (56px squircle, brand gradient,
   address-number label / house glyph fallback) -- no local avatar chrome. */

.cp-info[b-dexljxpquy] {
    flex: 1;
    min-width: 0;
    display: flex;
    flex-direction: column;
    gap: 0.25rem;
}

/* Name row */
.cp-name-row[b-dexljxpquy] {
    display: flex;
    align-items: center;
    gap: 1rem; /* gap-4 */
    flex-wrap: wrap;
}

.cp-name[b-dexljxpquy] {
    font-size: var(--lw-title-size); /* 22px */
    font-weight: var(--lw-title-weight);
    line-height: 2rem; /* leading-8 */
    letter-spacing: var(--lw-tracking-tight);
    color: var(--lw-title-color);
    margin: 0;
    font-family: var(--lw-font-family);
}

/* Status pills are the shared StatusChip component (Badge md idiom:
   h-6, px-1.5, 11px bold uppercase, radius --lw-radius-control, token
   tone pairs) -- no local pill chrome. */

/* Metadata row: status chip + address, PM, dates (reference gap-x-3 gap-y-1.5) */
.cp-meta-row[b-dexljxpquy] {
    display: flex;
    align-items: center;
    column-gap: 0.75rem; /* gap-x-3 */
    row-gap: 0.375rem; /* gap-y-1.5 */
    flex-wrap: wrap;
    font-size: 0.875rem; /* text-sm */
    line-height: 1.25rem; /* leading-5 */
    color: var(--lw-gray-graphite);
}

.cp-meta-item[b-dexljxpquy] {
    display: inline-flex;
    align-items: center;
    gap: 0.375rem; /* gap-1.5 */
}

/* Meta icons = reference size-3.5 (14px) muted-foreground. MudIcon is a
   child component -- ::deep + .mud-icon-root to out-specific Mud's sizing. */
.cp-meta-item[b-dexljxpquy]  .cp-meta-icon.mud-icon-root {
    font-size: 14px;
    width: 14px;
    height: 14px;
    flex-shrink: 0;
    color: var(--lw-gray-space);
}

/* Payment instructions read as a status pill inline in .cp-meta-row (no
   separate labelled status row). Its "Setup" action sits next to the pill as
   a compact text button so it does not out-weigh the meta line. */
.cp-meta-row[b-dexljxpquy]  .cp-status-action.mud-button-root {
    min-width: 0;
    height: 22px;
    padding: 0 0.375rem;
    font-size: 0.75rem;
    font-weight: 600;
    letter-spacing: normal;
    text-transform: none;
}

/* Tab navigation strip */
.cp-tab-nav[b-dexljxpquy] {
    display: flex;
    align-items: center;
    gap: 2rem; /* gap-8 */
    margin-top: 1rem; /* reference mt-4 -- collapses with .cp-identity's margin-bottom to 16px */
}

.cp-tab[b-dexljxpquy] {
    position: relative;
    display: flex;
    align-items: center;
    gap: 0.5rem;
    height: 2.5rem;
    padding: 0;
    font-size: 0.875rem;
    font-weight: 500;
    color: var(--lw-gray-graphite);
    background: none;
    border: none;
    cursor: pointer;
    transition: color 0.15s;
    font-family: var(--lw-font-family);
    white-space: nowrap;
}

.cp-tab:hover[b-dexljxpquy] {
    color: var(--lw-text-primary);
}

.cp-tab.active[b-dexljxpquy] {
    color: var(--lw-text-primary);
}

.cp-tab.active[b-dexljxpquy]::after {
    content: "";
    position: absolute;
    bottom: 0;
    left: 0;
    right: 0;
    height: 2px;
    background: var(--lw-text-primary);
}

/* -- Tab content area -- */
.cp-content[b-dexljxpquy] {
    flex: 1;
}

/* Breadcrumb strip above header */
.cp-breadcrumb[b-dexljxpquy] {
    padding: 0.5rem 1.5rem 0;
}

[b-dexljxpquy] .cp-breadcrumb .mud-breadcrumb {
    font-size: 0.8125rem;
    color: var(--lw-gray-graphite);
}

[b-dexljxpquy] .cp-breadcrumb .mud-breadcrumb-item a,
[b-dexljxpquy] .cp-breadcrumb .mud-breadcrumb-item span {
    color: var(--lw-gray-graphite);
    text-decoration: none;
    font-weight: 400;
}

[b-dexljxpquy] .cp-breadcrumb .mud-breadcrumb-item:last-child span {
    color: var(--lw-primary-dark);
    font-weight: 500;
}

[b-dexljxpquy] .cp-breadcrumb .mud-breadcrumb-separator {
    color: var(--lw-gray-steel);
    font-size: 0.75rem;
}
/* _content/Ledgerwise/Components/Pages/Contractor/ContractorProjectDocuments.razor.rz.scp.css */
/* Contractor project Documents tab -- page-level extras only. All shared
   documents chrome lives in wwwroot/css/components/lw-doc.css (composes
   lw-table.css); toolbar chrome comes from lw-page.css + LwChip /
   LwViewToggle atoms. */

/* Empty-state signature tile tint (folders = gold). */
.ho-sig-tile[b-sm5702q60s] {
    background: var(--lw-status-secondary-bg);
    color: var(--lw-status-secondary-fg);
}
/* _content/Ledgerwise/Components/Pages/Contractor/ContractorProjectInvoices.razor.rz.scp.css */
/* Contractor project Invoices tab -- page-level only. Table chrome comes
   from the shared lw-table.css; toolbar from lw-page.css; tracking dots from
   the LwInvoiceTracking atom. What lives here: this table's column layout,
   the status-cell roadmap tooltip (mirrors ProjectInvoices .pi-tip-* values,
   source ledgerwise-app status-cell-tooltip.tsx -- promote to lw-table.css
   when the GC tab's migration settles), the lien-release expand panel, and
   the Sign Lien row action. */

.cpi-page[b-qotmg1t2xv] {
    display: flex;
    flex-direction: column;
}

/* The tab hosts a full-bleed toolbar; the table sits on the muted panel. */
.cpi-body[b-qotmg1t2xv] {
    display: flex;
    flex-direction: column;
    gap: 16px;
    padding: 24px;
}

/* ---- Column layout ---- */

.cpi-col[b-qotmg1t2xv] {
    flex: 1;
    min-width: 0;
}

.cpi-col-toggle[b-qotmg1t2xv] {
    width: 48px;
    flex-shrink: 0;
    justify-content: center;
    padding-left: 8px;
    padding-right: 8px;
}

.cpi-col-invoice[b-qotmg1t2xv] {
    flex: 1.1;
    min-width: 120px;
}

.cpi-col-status[b-qotmg1t2xv] {
    width: 210px;
    flex-shrink: 0;
}

.cpi-col-actions[b-qotmg1t2xv] {
    width: 48px;
    flex-shrink: 0;
}

.cpi-col-actions.cpi-actions-wide[b-qotmg1t2xv] {
    width: 130px;
}

.cpi-days-hint[b-qotmg1t2xv] {
    margin-left: 4px;
    font-size: 12px;
    color: var(--lw-gray-space);
}

/* ---- Status-cell roadmap tooltip (mirrors ProjectInvoices .pi-*) ---- */

.cpi-status-stack[b-qotmg1t2xv] {
    position: relative;
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 4px;
}

/* Status pills carry the full user-facing status name (US-583); long labels
   wrap inside the cell instead of overflowing the column. */
.cpi-status-stack[b-qotmg1t2xv]  .lw-status-chip {
    white-space: normal;
    text-align: left;
    height: auto;
    min-height: 24px;
    padding: 3px 6px;
    line-height: 1.3;
}

.cpi-tracking-tip[b-qotmg1t2xv] {
    display: none;
    position: absolute;
    top: calc(100% + 8px);
    left: -8px;
    z-index: 100;
    width: 200px;
    background: var(--lw-white);
    border-radius: var(--lw-radius-sm);
    box-shadow: 0 4px 24px rgba(0, 0, 0, 0.12);
    padding: 12px 0;
    pointer-events: none;
    flex-direction: column;
}

.cpi-status-stack:hover .cpi-tracking-tip[b-qotmg1t2xv] {
    display: flex;
}

.cpi-tip-row[b-qotmg1t2xv] {
    display: flex;
    align-items: stretch;
    padding: 0 14px;
}

.cpi-tip-track[b-qotmg1t2xv] {
    display: flex;
    flex-direction: column;
    align-items: center;
    width: 16px;
    flex-shrink: 0;
}

.cpi-tip-node[b-qotmg1t2xv] {
    width: 16px;
    height: 16px;
    flex-shrink: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    margin-top: 2px;
    border-radius: 50%;
}

.cpi-tip-done[b-qotmg1t2xv] {
    background: var(--lw-success-dark);
    color: var(--lw-white);
}

.cpi-tip-active[b-qotmg1t2xv] {
    border: 1.5px solid var(--lw-primary-blue);
    background: var(--lw-white);
}

.cpi-tip-future[b-qotmg1t2xv] {
    border: 1.5px solid var(--lw-tracking-grey);
    background: var(--lw-white);
}

/* Reference active inner marker is a 6px SQUARE (size-1.5, no rounding). */
.cpi-tip-active-dot[b-qotmg1t2xv] {
    width: 6px;
    height: 6px;
    background: var(--lw-primary-blue);
}

.cpi-tip-line[b-qotmg1t2xv] {
    width: 1.5px;
    flex: 1;
    background: var(--lw-tracking-grey);
    min-height: 8px;
}

.cpi-tip-line-done[b-qotmg1t2xv] {
    background: var(--lw-success-dark);
}

.cpi-tip-content[b-qotmg1t2xv] {
    padding-left: 10px;
    display: flex;
    flex-direction: column;
    min-width: 0;
    flex: 1;
}

.cpi-tip-content-gap[b-qotmg1t2xv] {
    padding-bottom: 10px;
}

.cpi-tip-label[b-qotmg1t2xv] {
    display: block;
    font-size: 12px;
    font-weight: 500;
    line-height: 18px;
}

.cpi-tip-label-done[b-qotmg1t2xv] {
    color: var(--lw-success-dark);
}

.cpi-tip-label-active[b-qotmg1t2xv] {
    color: var(--lw-primary-blue);
}

.cpi-tip-label-future[b-qotmg1t2xv] {
    color: var(--lw-gray-space);
}

.cpi-tip-date[b-qotmg1t2xv] {
    font-size: 11px;
    color: var(--lw-gray-space);
}

/* ---- Sign Lien row action (h-7 bordered chip-button) ---- */

.cpi-sign-lien-btn[b-qotmg1t2xv] {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    height: 28px;
    padding: 0 10px;
    border: 1px solid var(--lw-border);
    border-radius: var(--lw-radius-control);
    background: var(--lw-white);
    color: var(--lw-text-primary);
    cursor: pointer;
    font-family: var(--lw-font-family);
    font-size: 12px;
    font-weight: var(--lw-font-medium);
    white-space: nowrap;
    transition: background 0.15s ease;
}

.cpi-sign-lien-btn:hover[b-qotmg1t2xv] {
    background: var(--lw-accent);
}

/* Shown in place of the Sign Lien button until the vendor has payment info on file */
.cpi-sign-lien-hint[b-qotmg1t2xv] {
    font-size: 12px;
    color: var(--lw-gray-graphite, #6E7180);
    white-space: nowrap;
}

/* ---- Lien-release expand panel (table-header surface strip, mirrors the
   /contractors preliminary-notices panel) ---- */

.cpi-expand-panel[b-qotmg1t2xv] {
    border-bottom: 1px solid var(--lw-border);
    background: var(--lw-bg-table-header);
    padding: 4px 16px 12px 48px; /* left-aligns under the Invoice # column (48px toggle col) */
    overflow-x: auto;
}

.cpi-lien-table[b-qotmg1t2xv] {
    width: 100%;
    border-collapse: collapse;
}

.cpi-lien-table th[b-qotmg1t2xv] {
    padding: 8px 12px 6px 0;
    font-size: 12px;
    font-weight: 500;
    color: var(--lw-gray-graphite);
    text-align: left;
    white-space: nowrap;
}

.cpi-lien-table td[b-qotmg1t2xv] {
    padding: 6px 12px 6px 0;
    font-size: 13px;
    color: var(--lw-text-primary);
    border-top: 1px solid var(--lw-border);
    vertical-align: middle;
}

.cpi-lien-row-clickable[b-qotmg1t2xv] {
    cursor: pointer;
}

.cpi-lien-row-clickable:hover td[b-qotmg1t2xv] {
    background: color-mix(in srgb, var(--lw-accent) 50%, transparent);
}

.cpi-lien-doc[b-qotmg1t2xv] {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    color: var(--lw-primary-blue);
}

.cpi-lien-muted[b-qotmg1t2xv] {
    font-size: 12px;
    color: var(--lw-gray-graphite);
}

.cpi-lien-empty[b-qotmg1t2xv] {
    display: flex;
    align-items: center;
    gap: 6px;
    margin: 0;
    padding: 12px 0 4px;
    font-size: 13px;
    color: var(--lw-gray-graphite);
}

/* Category with no rows (chips hide zero counts, so rarely visible). */
.cpi-empty-filter[b-qotmg1t2xv] {
    padding: 24px 16px;
    font-size: 14px;
    color: var(--lw-gray-graphite);
}

/* Empty-state signature tile tint (invoice = info). */
.cpi-sig-tile[b-qotmg1t2xv] {
    background: var(--lw-status-info-bg);
    color: var(--lw-status-info-fg);
}
/* _content/Ledgerwise/Components/Pages/Contractor/ContractorProjectProposals.razor.rz.scp.css */
/* Contractor project Proposals (RFP) tab -- page-level only. Table chrome
   from the shared lw-table.css, toolbar from lw-page.css, status pills via
   StatusChip. What lives here: this table's column layout, due-date urgency
   colors, the search clear button, and the empty-state signature tile. */

.sp-page[b-s7c1wm38jv] {
    display: flex;
    flex-direction: column;
}

.sp-body[b-s7c1wm38jv] {
    display: flex;
    flex-direction: column;
    gap: 16px;
    padding: 24px;
}

/* ---- Column layout ---- */

.sp-col[b-s7c1wm38jv] {
    flex: 1;
    min-width: 0;
}

.sp-col-rfp[b-s7c1wm38jv] {
    width: 120px;
    flex-shrink: 0;
}

.sp-col-title[b-s7c1wm38jv] {
    flex: 2;
    min-width: 160px;
}

.sp-title-text[b-s7c1wm38jv] {
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.sp-col-docs[b-s7c1wm38jv] {
    width: 80px;
    flex-shrink: 0;
}

.sp-docs[b-s7c1wm38jv] {
    display: inline-flex;
    align-items: center;
    gap: 4px;
}

.sp-bid[b-s7c1wm38jv] {
    font-weight: var(--lw-font-medium);
    font-variant-numeric: tabular-nums;
}

/* ---- Due-date urgency ---- */

.sp-due[b-s7c1wm38jv] {
    font-variant-numeric: tabular-nums;
}

.sp-due-past-due[b-s7c1wm38jv] {
    color: var(--lw-status-error-fg);
    font-weight: var(--lw-font-medium);
}

.sp-due-due-soon[b-s7c1wm38jv] {
    color: var(--lw-status-warning-fg);
    font-weight: var(--lw-font-medium);
}

.sp-due-ok[b-s7c1wm38jv] {
    color: var(--lw-gray-graphite);
}

/* ---- Search clear button (inside the shared search box) ---- */

.sp-search-clear[b-s7c1wm38jv] {
    position: absolute;
    right: 8px;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 20px;
    height: 20px;
    padding: 0;
    border: 0;
    border-radius: 50%;
    background: none;
    color: var(--lw-gray-space);
    cursor: pointer;
}

.sp-search-clear:hover[b-s7c1wm38jv] {
    color: var(--lw-text-primary);
}

/* Empty-state signature tile tint (RFP = secondary/gold). */
.sp-sig-tile[b-s7c1wm38jv] {
    background: var(--lw-status-secondary-bg);
    color: var(--lw-status-secondary-fg);
}
/* _content/Ledgerwise/Components/Pages/Contractor/ContractorUsers.razor.rz.scp.css */
/* Organization users -- ControlCard section (2026-07-28 review round; was
   the bare lw-section grammar). The member list renders full-bleed inside
   the card's Flush body, so the inner LwListCard sheds its own card chrome
   here to avoid card-in-card. Plain selectors: these elements are authored
   in this file and carry the isolation scope themselves (the dialogs
   teleport out of the subtree, so ::deep would never reach them). */

.cu-role-cell[b-9xd5a0z7qa] {
    display: flex;
    align-items: center;
    gap: 4px;
    flex-shrink: 0;
    min-width: 0;
    flex-wrap: wrap;
}

/* Full-bleed list inside the flush ControlCard body: no second border/
   shadow, square top corners, keep the card's bottom rounding. */
[b-9xd5a0z7qa] .cu-list.lw-list-card {
    border: none;
    box-shadow: none;
    border-radius: 0 0 var(--lw-radius-card) var(--lw-radius-card);
}

/* Modal internals */
.cu-modal-fields[b-9xd5a0z7qa] {
    display: flex;
    flex-direction: column;
    gap: 16px;
}

.cu-confirm-text[b-9xd5a0z7qa] {
    margin: 0;
    font-family: var(--lw-font-family);
    font-size: 14px;
    line-height: 20px;
    color: var(--lw-text-primary);
}

/* Destructive roundel in the Remove User header (RejectInvoiceModal recipe). */
.cu-roundel[b-9xd5a0z7qa] {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 32px;
    height: 32px;
    border-radius: 9999px;
    background: var(--lw-status-error-bg);
    color: var(--lw-destructive);
}

.cu-roundel[b-9xd5a0z7qa]  .mud-icon-root { width: 1rem; height: 1rem; }
/* _content/Ledgerwise/Components/Pages/Contractor/InviteUserModal.razor.rz.scp.css */
/* Invite user modal -- canonical lw-modal internals (2026-07-28 review
   round). Elements are authored in this file and carry the isolation scope
   themselves (the dialog teleports, so ::deep would never reach them). */

.ium-fields[b-tcd2cejnl4] {
    display: flex;
    flex-direction: column;
    gap: 16px;
}

.ium-grid2[b-tcd2cejnl4] {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 16px;
}

@media (max-width: 640px) {
    .ium-grid2[b-tcd2cejnl4] {
        grid-template-columns: minmax(0, 1fr);
    }
}

.ium-check[b-tcd2cejnl4] {
    display: flex;
    flex-direction: column;
    gap: 4px;
}

.ium-check-help[b-tcd2cejnl4] {
    margin: 0 0 0 30px;
    font-family: var(--lw-font-family);
    font-size: 12px;
    line-height: 18px;
    color: var(--lw-gray-graphite);
}
/* _content/Ledgerwise/Components/Pages/Contractor/SubcontractorInvitationStatus.razor.rz.scp.css */
/* Platform invitation -- ControlCard section (2026-07-28 review round; was
   the bare lw-section grammar + shared Card). Field pairs reuse the
   gc-vendor-detail Field recipe; the step tracker is the canonical
   square-node vertical stepper (source: ViewInvoiceModal.razor.css
   vim-step-*, itself measured from the reference invoice-tracker-bar).
   Elements are authored in this file, so plain scoped selectors apply. */

.sis-skeleton[b-6onrw0z5uw],
.sis-body[b-6onrw0z5uw] {
    display: flex;
    flex-direction: column;
    gap: 16px;
}

/* -- Field pairs (Status / Onboarding / Email on file) -- */
.sis-fields[b-6onrw0z5uw] {
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    gap: 20px;
}

@media (min-width: 640px) {
    .sis-fields[b-6onrw0z5uw] {
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }
}

.sis-field[b-6onrw0z5uw] {
    display: flex;
    flex-direction: column;
    gap: 4px;
    min-width: 0;
}

.sis-field-label[b-6onrw0z5uw] {
    font-family: var(--lw-font-family);
    font-size: 11px;
    font-weight: var(--lw-font-medium);
    text-transform: uppercase;
    letter-spacing: 0.025em;
    color: var(--lw-gray-space);
}

.sis-field-value[b-6onrw0z5uw] {
    display: flex;
    align-items: center;
    font-family: var(--lw-font-family);
    font-size: 14px;
    line-height: 20px;
    color: var(--lw-text-primary);
    overflow-wrap: anywhere;
}

/* -- Square-node stepper (vim-step recipe) -- */
.sis-stepper[b-6onrw0z5uw] {
    display: flex;
    flex-direction: column;
}

.sis-step-row[b-6onrw0z5uw] { display: flex; align-items: stretch; }

.sis-step-track[b-6onrw0z5uw] {
    display: flex;
    flex-direction: column;
    align-items: center;
    width: 18px;
    flex-shrink: 0;
}

.sis-step-node[b-6onrw0z5uw] {
    width: 18px;
    height: 18px;
    flex-shrink: 0;
    display: flex;
    align-items: center;
    justify-content: center;
}

.sis-step-node svg[b-6onrw0z5uw] { width: 11px; height: 11px; }

/* success-dark #2D7A5F per the reference tracker (see vim-step-done). */
.sis-step-done[b-6onrw0z5uw]   { background: #2D7A5F; color: var(--lw-white); }
.sis-step-future[b-6onrw0z5uw] { background: rgba(211, 214, 224, 0.4); }

.sis-step-line[b-6onrw0z5uw] { width: 1px; flex: 1; background: var(--lw-border); min-height: 22px; }
.sis-step-line-done[b-6onrw0z5uw] { background: #2D7A5F; }

.sis-step-content[b-6onrw0z5uw] {
    padding-left: 12px;
    display: flex;
    flex-direction: column;
    gap: 2px;
    min-width: 0;
    flex: 1;
}

.sis-step-gap[b-6onrw0z5uw] { padding-bottom: 18px; }

.sis-step-label[b-6onrw0z5uw] { font-size: 13px; font-weight: 500; line-height: 18px; }
.sis-step-label-done[b-6onrw0z5uw]   { color: var(--lw-text-primary); }
.sis-step-label-future[b-6onrw0z5uw] { color: var(--lw-gray-space); }

.sis-step-detail[b-6onrw0z5uw] {
    font-family: var(--lw-font-family);
    font-size: 12px;
    line-height: 16px;
    color: var(--lw-gray-graphite);
}

/* -- History list columns + row tile tone -- */
.sis-col-sent[b-6onrw0z5uw]   { width: 192px; }
.sis-col-result[b-6onrw0z5uw] { width: 112px; }

.sis-tile[b-6onrw0z5uw] {
    background: var(--lw-status-info-bg);
    color: var(--lw-status-info-fg);
}

/* -- Resend modal internals -- */
.sis-modal-fields[b-6onrw0z5uw] {
    display: flex;
    flex-direction: column;
    gap: 16px;
}

.sis-modal-copy[b-6onrw0z5uw] {
    margin: 0;
    font-family: var(--lw-font-family);
    font-size: 13px;
    line-height: 18px;
    color: var(--lw-gray-graphite);
}

.sis-modal-actions[b-6onrw0z5uw] {
    display: flex;
    justify-content: flex-end;
    gap: 12px;
}
/* _content/Ledgerwise/Components/Pages/Dashboard/DashboardInvoiceInbox.razor.rz.scp.css */
/* Dashboard invoice inbox. Source: ledgerwise-app
   molecules/invoice-inbox-panel.tsx (2026-07-20): white rounded-card with
   hairline header band, compact dashed dropzone (rgba resting colors),
   divided rows, ghost expand control. */

.dii-card[b-zgaw61fupx] {
    display: flex;
    flex-direction: column;
    height: 100%;
    border: 1px solid var(--lw-border);
    border-radius: var(--lw-radius-card);
    background: var(--lw-white);
    box-shadow: var(--lw-shadow-card);
    overflow: hidden;
}

.dii-head[b-zgaw61fupx] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    padding: 14px 20px;
    border-bottom: 1px solid var(--lw-border);
}

.dii-head-left[b-zgaw61fupx] { display: flex; align-items: center; gap: 8px; }

.dii-title[b-zgaw61fupx] {
    margin: 0;
    font-family: var(--lw-font-family);
    font-size: 1rem;
    font-weight: var(--lw-font-bold);
    color: var(--lw-text-primary);
}

.dii-count[b-zgaw61fupx] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    height: 18px;
    min-width: 18px;
    padding: 0 4px;
    border-radius: var(--lw-radius-control);
    background: color-mix(in srgb, var(--lw-primary-dark) 10%, transparent);
    font-size: 0.625rem;
    font-weight: var(--lw-font-bold);
    font-variant-numeric: tabular-nums;
    color: var(--lw-primary-dark);
}

.dii-viewall[b-zgaw61fupx] {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    border: none;
    background: none;
    padding: 0;
    font-size: 0.8125rem;
    font-weight: var(--lw-font-medium);
    color: var(--lw-primary-blue);
    cursor: pointer;
}

.dii-viewall:hover[b-zgaw61fupx] { text-decoration: underline; text-underline-offset: 2px; }
.dii-viewall[b-zgaw61fupx]  .mud-icon-root { width: 0.875rem; height: 0.875rem; }

.dii-body[b-zgaw61fupx] { display: flex; flex-direction: column; gap: 12px; padding: 16px 20px; flex: 1; }

.dii-muted[b-zgaw61fupx] { margin: 16px 0; text-align: center; font-size: 0.875rem; color: var(--lw-gray-graphite); }

/* Compact dropzone (reference InvoiceDropZone compact variant). */
.dii-dropwrap[b-zgaw61fupx] { position: relative; }

.dii-dropzone[b-zgaw61fupx] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 2px;
    padding: 20px 16px;
    border: 2px dashed rgba(145, 158, 171, 0.32);
    border-radius: var(--lw-radius-sm);
    background: rgba(145, 158, 171, 0.08);
    cursor: pointer;
    transition: border-color 0.15s ease, background 0.15s ease;
}

.dii-dropwrap:hover .dii-dropzone[b-zgaw61fupx] {
    border-color: var(--lw-primary-blue);
    background: color-mix(in srgb, var(--lw-primary-blue) 8%, transparent);
}

.dii-dropzone[b-zgaw61fupx]  .dii-drop-icon { width: 1.25rem; height: 1.25rem; color: var(--lw-gray-space); margin-bottom: 4px; }
.dii-drop-title[b-zgaw61fupx] { font-size: 0.75rem; font-weight: var(--lw-font-medium); color: var(--lw-text-primary); }
.dii-drop-sub[b-zgaw61fupx] { font-size: 0.6875rem; color: var(--lw-gray-space); }

/* Indeterminate upload bar. */
.dii-progress[b-zgaw61fupx] {
    height: 3px;
    width: 100%;
    overflow: hidden;
    border-radius: 9999px;
    background: var(--lw-border);
}

.dii-progress-fill[b-zgaw61fupx] {
    height: 100%;
    width: 40%;
    border-radius: 9999px;
    background: var(--lw-primary-dark);
    animation: dii-indeterminate-b-zgaw61fupx 1.2s ease-in-out infinite;
}

@keyframes dii-indeterminate-b-zgaw61fupx {
    0% { transform: translateX(-100%); }
    100% { transform: translateX(350%); }
}

/* Upload rows. */
.dii-list[b-zgaw61fupx] { display: flex; flex-direction: column; }

.dii-row[b-zgaw61fupx] {
    display: flex;
    align-items: center;
    gap: 10px;
    width: 100%;
    padding: 10px 4px;
    border: none;
    border-bottom: 1px solid var(--lw-border);
    background: none;
    text-align: left;
    cursor: pointer;
    transition: background 0.12s ease;
}

.dii-row:last-child[b-zgaw61fupx] { border-bottom: none; }
.dii-row:hover[b-zgaw61fupx] { background: color-mix(in srgb, var(--lw-accent) 50%, transparent); }

.dii-dot[b-zgaw61fupx] { width: 8px; height: 8px; border-radius: 9999px; flex-shrink: 0; background: var(--lw-gray-space); }
.dii-dot--info[b-zgaw61fupx] { background: var(--lw-primary-blue); }
.dii-dot--warning[b-zgaw61fupx] { background: var(--lw-status-warning-fg); }
.dii-dot--error[b-zgaw61fupx] { background: var(--lw-destructive); }
.dii-dot--success[b-zgaw61fupx] { background: var(--lw-status-success-fg); }

.dii-row-name[b-zgaw61fupx] {
    min-width: 0;
    flex: 1;
    font-size: 0.875rem;
    color: var(--lw-text-primary);
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.dii-row-amount[b-zgaw61fupx] {
    flex-shrink: 0;
    font-size: 0.875rem;
    font-weight: var(--lw-font-semibold);
    font-variant-numeric: tabular-nums;
    color: var(--lw-text-primary);
}

.dii-more[b-zgaw61fupx] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 4px;
    align-self: center;
    border: none;
    background: none;
    padding: 4px 8px;
    font-size: 0.8125rem;
    font-weight: var(--lw-font-medium);
    color: var(--lw-primary-blue);
    cursor: pointer;
}

.dii-more:hover[b-zgaw61fupx] { text-decoration: underline; text-underline-offset: 2px; }
.dii-more[b-zgaw61fupx]  .mud-icon-root { width: 1rem; height: 1rem; }
/* _content/Ledgerwise/Components/Pages/Dashboard/DashboardSkeleton.razor.rz.scp.css */
/* Source: ledgerwise-app molecules/dashboard-skeleton.tsx (2026-07-28).
   Page wrap mirrors the dashboard's hd-page recipe (muted bg, 1400px cap,
   1rem/1.5rem padding+gap); cards carry the standard surface chrome. */

.dsk-page[b-rfvmnb3rzh] {
    display: flex;
    flex-direction: column;
    gap: 1rem;
    background: var(--lw-bg-muted);
    padding: 1rem;
    margin: -1rem -1.5rem;
    min-height: calc(100% + 2rem);
    box-sizing: border-box;
    max-width: 1400px;
    margin-left: auto;
    margin-right: auto;
}

@media (min-width: 768px) {
    .dsk-page[b-rfvmnb3rzh] {
        padding: 1.5rem;
        gap: 1.5rem;
    }
}

.dsk-card[b-rfvmnb3rzh] {
    background: var(--lw-white);
    border: 1px solid var(--lw-border);
    border-radius: var(--lw-radius-card);
    box-shadow: var(--lw-shadow-card);
    box-sizing: border-box;
}

.dsk-header[b-rfvmnb3rzh] {
    display: flex;
    flex-direction: column;
    gap: 1rem;
    justify-content: space-between;
}

@media (min-width: 640px) {
    .dsk-header[b-rfvmnb3rzh] {
        flex-direction: row;
        align-items: center;
    }
}

.dsk-header-text[b-rfvmnb3rzh] {
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
}

.dsk-kpi-grid[b-rfvmnb3rzh] {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 0.75rem;
}

@media (min-width: 768px) {
    .dsk-kpi-grid[b-rfvmnb3rzh] {
        grid-template-columns: repeat(4, minmax(0, 1fr));
        gap: 1rem;
    }
}

.dsk-kpi[b-rfvmnb3rzh] {
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    padding: 1.25rem;
}

.dsk-kpi-top[b-rfvmnb3rzh] {
    display: flex;
    flex-direction: column;
    gap: 0.25rem;
}

.dsk-kpi-foot[b-rfvmnb3rzh] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-top: 0.75rem;
}

.dsk-table-head[b-rfvmnb3rzh] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 1rem 1.25rem;
}

.dsk-table-cols[b-rfvmnb3rzh] {
    display: flex;
    align-items: center;
    border-top: 1px solid var(--lw-border);
    padding: 0.75rem 1.25rem;
}

.dsk-table-row[b-rfvmnb3rzh] {
    display: flex;
    align-items: center;
    border-top: 1px solid var(--lw-border);
    padding: 0.875rem 1.25rem;
}

.dsk-panel-row[b-rfvmnb3rzh] {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    border-top: 1px solid var(--lw-border);
    padding: 0.75rem 1.25rem;
}

.dsk-inline[b-rfvmnb3rzh] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
}

.dsk-inline--lead[b-rfvmnb3rzh] {
    gap: 0.75rem;
}

.dsk-stack[b-rfvmnb3rzh] {
    display: flex;
    flex-direction: column;
    gap: 0.375rem;
}

.dsk-grow[b-rfvmnb3rzh] {
    flex: 1;
    min-width: 0;
}

/* Reference spacing utilities: ml-auto / ml-16 (64px) / ml-20 (80px). */
[b-rfvmnb3rzh] .dsk-push { margin-left: auto; }
.dsk-inline.dsk-push[b-rfvmnb3rzh] { margin-left: auto; }
[b-rfvmnb3rzh] .dsk-gap-16 { margin-left: 4rem; }
[b-rfvmnb3rzh] .dsk-gap-20 { margin-left: 5rem; }

.dsk-bottom-grid[b-rfvmnb3rzh] {
    display: grid;
    grid-template-columns: 1fr;
    gap: 1rem;
    align-items: start;
}

@media (min-width: 768px) {
    .dsk-bottom-grid[b-rfvmnb3rzh] {
        grid-template-columns: 1fr 1fr;
    }
}
/* _content/Ledgerwise/Components/Pages/Dashboard/GettingStartedGuide.razor.rz.scp.css */
/* Layout */
.gs-page[b-8l0zbo89qg] {
    display: flex;
    flex-direction: column;
    gap: 1.25rem;
    padding: 1rem;
}

@media (min-width: 768px) {
    .gs-page[b-8l0zbo89qg] {
        padding: 1.5rem;
    }
}

/* ============================================
   HERO BANNER
   ============================================ */
.gs-hero[b-8l0zbo89qg] {
    position: relative;
    overflow: hidden;
    border-radius: 0.5rem;
    background: linear-gradient(135deg, #020B2B 0%, #0a1a45 50%, #1a3060 100%);
}

.gs-hero-orb[b-8l0zbo89qg] {
    position: absolute;
    border-radius: 9999px;
    pointer-events: none;
}

.gs-hero-orb--blue[b-8l0zbo89qg] {
    top: -2rem;
    right: -2rem;
    width: 10rem;
    height: 10rem;
    opacity: 0.1;
    background: radial-gradient(circle, #3980A5 0%, transparent 70%);
}

.gs-hero-orb--gold[b-8l0zbo89qg] {
    bottom: -3rem;
    left: -3rem;
    width: 12rem;
    height: 12rem;
    opacity: 0.05;
    background: radial-gradient(circle, #EEB66F 0%, transparent 70%);
}

.gs-hero-content[b-8l0zbo89qg] {
    position: relative;
    display: flex;
    flex-direction: column;
    gap: 1.25rem;
    padding: 1.5rem;
}

@media (min-width: 768px) {
    .gs-hero-content[b-8l0zbo89qg] {
        flex-direction: row;
        align-items: center;
        gap: 2rem;
        padding: 2rem;
    }
}

.gs-hero-body[b-8l0zbo89qg] {
    display: flex;
    flex: 1 1 0%;
    flex-direction: column;
}

/* Hero chip */
.gs-chip[b-8l0zbo89qg] {
    display: inline-flex;
    align-items: center;
    gap: 0.375rem;
    width: fit-content;
    margin-bottom: 0.75rem;
    padding: 0.25rem 0.625rem;
    border-radius: 0.375rem;
    font-size: 0.75rem;
    font-weight: 600;
    line-height: 1;
}

.gs-chip--gold[b-8l0zbo89qg] {
    background-color: rgba(238, 182, 111, 0.15);
    color: #EEB66F;
}

.gs-chip--success[b-8l0zbo89qg] {
    background-color: rgba(45, 122, 95, 0.2);
    color: #4AAE85;
}

.gs-chip-icon[b-8l0zbo89qg] {
    width: 0.75rem;
    height: 0.75rem;
    font-size: 0.75rem !important;
}

/* Hero typography */
.gs-hero-title[b-8l0zbo89qg] {
    margin: 0;
    font-family: var(--lw-font-family-heading);
    font-size: 1.25rem;
    font-weight: 700;
    letter-spacing: -0.015em;
    color: #FFFFFF;
    line-height: 1.2;
}

@media (min-width: 768px) {
    .gs-hero-title[b-8l0zbo89qg] {
        font-size: 1.75rem;
        line-height: 1.15;
    }
}

.gs-hero-substep[b-8l0zbo89qg] {
    margin: 0.25rem 0 0;
    font-size: 0.75rem;
    color: rgba(255, 255, 255, 0.5);
}

.gs-hero-description[b-8l0zbo89qg] {
    margin: 0.75rem 0 0;
    max-width: 32rem;
    font-size: 0.875rem;
    line-height: 1.6;
    color: rgba(255, 255, 255, 0.7);
}

/* Time pill */
.gs-time-pill[b-8l0zbo89qg] {
    display: inline-flex;
    align-items: center;
    gap: 0.375rem;
    width: fit-content;
    margin-top: 1rem;
    padding: 0.25rem 0.75rem;
    border-radius: 9999px;
    background-color: rgba(255, 255, 255, 0.1);
    font-size: 0.75rem;
    font-weight: 500;
    color: rgba(255, 255, 255, 0.7);
}

.gs-time-pill-icon[b-8l0zbo89qg] {
    width: 0.75rem;
    height: 0.75rem;
    font-size: 0.75rem !important;
    color: rgba(255, 255, 255, 0.6);
}

/* Hero CTA */
.gs-hero-cta[b-8l0zbo89qg] {
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
    width: fit-content;
    height: 2.5rem;
    margin-top: 1.25rem;
    padding: 0 1.25rem;
    border-radius: 0.375rem;
    background-color: rgba(255, 255, 255, 0.15);
    backdrop-filter: blur(4px);
    -webkit-backdrop-filter: blur(4px);
    font-size: 0.875rem;
    font-weight: 500;
    color: #FFFFFF;
    text-decoration: none;
    transition: background-color 0.15s ease;
}

.gs-hero-cta:hover[b-8l0zbo89qg] {
    background-color: rgba(255, 255, 255, 0.25);
    color: #FFFFFF;
    text-decoration: none;
}

.gs-hero-cta-icon[b-8l0zbo89qg] {
    width: 0.875rem;
    height: 0.875rem;
    font-size: 0.875rem !important;
}

/* Hero video tile */
.gs-hero-video[b-8l0zbo89qg] {
    display: none;
    position: relative;
    flex-shrink: 0;
    width: 280px;
    aspect-ratio: 16 / 10;
    overflow: hidden;
    border-radius: 0.5rem;
    cursor: pointer;
}

@media (min-width: 768px) {
    .gs-hero-video[b-8l0zbo89qg] {
        display: block;
    }
}

@media (min-width: 1024px) {
    .gs-hero-video[b-8l0zbo89qg] {
        width: 320px;
    }
}

.gs-hero-video img[b-8l0zbo89qg] {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
    border-radius: 0.5rem;
}

.gs-hero-video-overlay[b-8l0zbo89qg] {
    position: absolute;
    inset: 0;
    background-color: rgba(0, 0, 0, 0.25);
    border-radius: 0.5rem;
}

.gs-hero-video-play[b-8l0zbo89qg] {
    position: absolute;
    inset: 0;
    display: flex;
    align-items: center;
    justify-content: center;
}

.gs-hero-video-play[b-8l0zbo89qg]::before {
    content: "";
    width: 3.5rem;
    height: 3.5rem;
    border-radius: 9999px;
    background-color: rgba(255, 255, 255, 0.2);
    backdrop-filter: blur(4px);
    -webkit-backdrop-filter: blur(4px);
    position: absolute;
    transition: transform 0.15s ease;
}

.gs-hero-video:hover .gs-hero-video-play[b-8l0zbo89qg]::before {
    transform: scale(1.05);
}

.gs-hero-video-play-icon[b-8l0zbo89qg] {
    position: relative;
    width: 1.5rem !important;
    height: 1.5rem !important;
    font-size: 1.5rem !important;
    color: #FFFFFF;
    margin-left: 0.125rem;
}

/* ============================================
   UPCOMING STEPS CARD
   ============================================ */
.gs-steps-card[b-8l0zbo89qg] {
    overflow: hidden;
    border: 1px solid var(--lw-border);
    border-radius: 0.5rem;
    background-color: #FFFFFF;
}

.gs-steps-header[b-8l0zbo89qg] {
    display: flex;
    width: 100%;
    align-items: center;
    gap: 0.75rem;
    padding: 1rem 1.25rem;
    background: none;
    border: 0;
    text-align: left;
    cursor: pointer;
    transition: background-color 0.15s ease;
    font-family: inherit;
}

.gs-steps-header:hover[b-8l0zbo89qg] {
    background-color: var(--lw-bg-muted);
}

.gs-steps-title[b-8l0zbo89qg] {
    font-size: 0.875rem;
    font-weight: 600;
    color: var(--lw-text-primary);
}

.gs-steps-count-pill[b-8l0zbo89qg] {
    display: inline-flex;
    align-items: center;
    padding: 0.125rem 0.5rem;
    border-radius: 0.375rem;
    background-color: var(--lw-bg-muted);
    font-size: 0.75rem;
    font-weight: 500;
    color: var(--lw-gray-graphite);
}

.gs-steps-chevron[b-8l0zbo89qg] {
    margin-left: auto;
    width: 1rem !important;
    height: 1rem !important;
    font-size: 1rem !important;
    color: var(--lw-gray-graphite);
    transition: transform 0.2s ease;
}

.gs-steps-chevron--open[b-8l0zbo89qg] {
    transform: rotate(180deg);
}

.gs-steps-list[b-8l0zbo89qg] {
    border-top: 1px solid var(--lw-border);
}

/* Step row */
.gs-step-row[b-8l0zbo89qg] {
    display: flex;
    align-items: flex-start;
    gap: 1rem;
    padding: 1.25rem;
    border-bottom: 1px solid var(--lw-border);
}

.gs-step-row:last-child[b-8l0zbo89qg] {
    border-bottom: 0;
}

.gs-step-icon[b-8l0zbo89qg] {
    flex-shrink: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    margin-top: 0.125rem;
    width: 2.25rem;
    height: 2.25rem;
    border-radius: 0.5rem;
    background-color: rgba(2, 11, 43, 0.06);
}

.gs-step-icon--complete[b-8l0zbo89qg] {
    background-color: rgba(45, 122, 95, 0.12);
}

.gs-step-icon-svg[b-8l0zbo89qg] {
    width: 1.125rem !important;
    height: 1.125rem !important;
    font-size: 1.125rem !important;
    color: var(--lw-primary-dark);
}

.gs-step-icon-svg--complete[b-8l0zbo89qg] {
    color: var(--lw-success-dark);
}

.gs-step-text[b-8l0zbo89qg] {
    flex: 1 1 0%;
    min-width: 0;
}

.gs-step-title[b-8l0zbo89qg] {
    margin: 0;
    font-size: 0.875rem;
    font-weight: 600;
    color: var(--lw-text-primary);
}

.gs-step-title--complete[b-8l0zbo89qg] {
    color: var(--lw-gray-graphite);
    text-decoration: line-through;
}

.gs-step-description[b-8l0zbo89qg] {
    margin: 0.25rem 0 0;
    font-size: 0.875rem;
    line-height: 1.6;
    color: var(--lw-gray-graphite);
}

/* Step action buttons */
.gs-step-actions[b-8l0zbo89qg] {
    display: flex;
    flex-shrink: 0;
    align-items: center;
    gap: 0.5rem;
    padding-top: 0.125rem;
}

.gs-btn[b-8l0zbo89qg] {
    display: inline-flex;
    align-items: center;
    height: 2.25rem;
    padding: 0 0.875rem;
    border-radius: 0.375rem;
    font-size: 0.8125rem;
    font-weight: 500;
    font-family: inherit;
    cursor: pointer;
    text-decoration: none;
    transition: background-color 0.15s ease, opacity 0.15s ease;
}

.gs-btn--outlined[b-8l0zbo89qg] {
    border: 1px solid var(--lw-border);
    background-color: transparent;
    color: var(--lw-text-primary);
}

.gs-btn--outlined:hover[b-8l0zbo89qg] {
    background-color: var(--lw-bg-muted);
    color: var(--lw-text-primary);
    text-decoration: none;
}

.gs-btn--primary[b-8l0zbo89qg] {
    border: 0;
    background-color: var(--lw-primary-dark);
    color: #FFFFFF;
}

.gs-btn--primary:hover[b-8l0zbo89qg] {
    background-color: var(--lw-primary-dark);
    color: #FFFFFF;
    opacity: 0.9;
    text-decoration: none;
}

/* Stack actions under text on narrow screens */
@media (max-width: 640px) {
    .gs-step-row[b-8l0zbo89qg] {
        flex-wrap: wrap;
    }

    .gs-step-actions[b-8l0zbo89qg] {
        margin-left: 3.25rem;
    }
}
/* _content/Ledgerwise/Components/Pages/DocumentTemplates.razor.rz.scp.css */
/* Document templates list -- page-level only: the word-document tint on the
   shared .lw-row-tile (filetype tokens; these templates are .docx sources). */
.lw-doc-template-tile[b-mkqi8kmfut] {
    background: var(--lw-filetype-word-bg);
    color: var(--lw-filetype-word-fg);
}
/* _content/Ledgerwise/Components/Pages/Home.razor.rz.scp.css */
/* ── Page wrap ── */
.hd-page[b-qs22jhofbr] {
    display: flex;
    flex-direction: column;
    gap: 1rem;
    background: var(--lw-bg-muted);
    padding: 1rem;
    margin: -1rem -1.5rem;
    min-height: calc(100% + 2rem);
    box-sizing: border-box;
    max-width: 1400px;
    margin-left: auto;
    margin-right: auto;
}

@media (min-width: 768px) {
    .hd-page[b-qs22jhofbr] {
        padding: 1.5rem;
        gap: 1.5rem;
    }
}

/* ── Header ── */
.hd-header[b-qs22jhofbr] {
    display: flex;
    flex-direction: column;
    gap: 1rem;
    justify-content: space-between;
}

@media (min-width: 640px) {
    .hd-header[b-qs22jhofbr] {
        flex-direction: row;
        align-items: center;
    }
}

.hd-greeting[b-qs22jhofbr] {
    font-size: var(--lw-title-size);
    font-weight: 700;
    letter-spacing: var(--lw-tracking-tight);
    color: var(--lw-text-primary);
    margin: 0;
    font-family: var(--lw-font-family-heading, sans-serif);
}

.hd-subhead[b-qs22jhofbr] {
    font-size: 0.875rem;
    color: var(--lw-gray-space);
    margin: 0.25rem 0 0;
}

/* Date-range trigger -- reference date-range-picker.tsx desktop trigger
   (measured 2026-07-28): rounded-card bordered white chip w/ card shadow,
   13px/600 foreground, calendar 14px + chevron 12px content-secondary. */
.hd-daterange-trigger[b-qs22jhofbr] {
    display: inline-flex;
    align-items: center;
    gap: 0.375rem;
    padding: 0.5rem 0.75rem;
    border: 1px solid var(--lw-border);
    border-radius: var(--lw-radius-card);
    background: var(--lw-white);
    box-shadow: var(--lw-shadow-card);
    cursor: pointer;
    font-size: 13px;
    font-weight: 600;
    color: var(--lw-text-primary);
}

.hd-daterange-trigger:hover[b-qs22jhofbr] {
    background: color-mix(in srgb, var(--lw-accent) 50%, transparent);
}

.hd-daterange-trigger[b-qs22jhofbr]  .hd-daterange-cal {
    width: 14px;
    height: 14px;
    font-size: 14px;
    color: var(--lw-gray-graphite);
}

.hd-daterange-trigger[b-qs22jhofbr]  .hd-daterange-chevron {
    width: 12px;
    height: 12px;
    font-size: 12px;
    color: var(--lw-gray-graphite);
}

/* Popover panel wrapping the header row + presets + (when Custom is picked)
   the From/To pickers. */
.hd-daterange-panel[b-qs22jhofbr] {
    display: flex;
    flex-direction: column;
    min-width: 220px;
}

.hd-daterange-panel-header[b-qs22jhofbr] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 0.5rem 1rem 0.375rem;
}

.hd-daterange-panel-title[b-qs22jhofbr] {
    font-size: 0.75rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: var(--lw-tracking-tight);
    color: var(--lw-gray-graphite);
}

.hd-daterange-reset[b-qs22jhofbr] {
    background: none;
    border: none;
    padding: 0;
    font-size: 0.75rem;
    font-weight: 600;
    color: var(--lw-primary-blue);
    cursor: pointer;
}

.hd-daterange-reset:hover[b-qs22jhofbr] {
    text-decoration: underline;
}

/* Preset rows inside the MudMenu popover -- reference PresetsList:
   px-4 py-2.5 text-sm, active = accent fill + 500 + trailing check. The
   MudMenuItem supplies its own padding; the row spans it with min width. */
.hd-daterange-row[b-qs22jhofbr] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 0.75rem;
    min-width: 160px;
    font-size: 0.875rem;
    color: var(--lw-gray-graphite);
}

.hd-daterange-row--active[b-qs22jhofbr] {
    font-weight: 500;
    color: var(--lw-text-primary);
}

.hd-daterange-row[b-qs22jhofbr]  .hd-daterange-check {
    width: 14px;
    height: 14px;
    font-size: 14px;
    color: var(--lw-primary-blue);
}

/* Custom option's row is a plain div, not a MudMenuItem (clicking it must
   reveal the pickers below without closing the popover), so it needs its
   own hit-area padding + hover/cursor that MudMenuItem gives the presets. */
.hd-daterange-row--custom[b-qs22jhofbr] {
    padding: 0.5rem 1rem;
    cursor: pointer;
}

.hd-daterange-row--custom:hover[b-qs22jhofbr] {
    background: color-mix(in srgb, var(--lw-accent) 50%, transparent);
}

/* From/To pickers + Apply, shown under the Custom row once picked. */
.hd-daterange-custom[b-qs22jhofbr] {
    display: flex;
    flex-direction: column;
    gap: 0.75rem;
    padding: 0.25rem 1rem 0.75rem;
    min-width: 220px;
}

/* ── KPI grid ── */
.hd-kpi-grid[b-qs22jhofbr] {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 0.75rem;
}

@media (min-width: 768px) {
    .hd-kpi-grid[b-qs22jhofbr] {
        grid-template-columns: repeat(4, minmax(0, 1fr));
        gap: 1rem;
    }
}

/* Surface provided by the shared Card primitive. */
.hd-kpi[b-qs22jhofbr] {
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    padding: 0.875rem;
    min-height: 116px;
}

@media (min-width: 768px) {
    .hd-kpi[b-qs22jhofbr] {
        padding: 1.25rem;
    }
}

.hd-kpi-label[b-qs22jhofbr] {
    font-size: 10px;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.12em;
    color: var(--lw-gray-graphite, #6E7180);
    margin: 0;
}

@media (min-width: 768px) {
    .hd-kpi-label[b-qs22jhofbr] {
        font-size: 11px;
    }
}

.hd-kpi-row[b-qs22jhofbr] {
    display: flex;
    align-items: flex-end;
    justify-content: space-between;
    gap: 0.5rem;
    margin-top: 0.25rem;
}

.hd-kpi-value[b-qs22jhofbr] {
    font-size: 20px;
    font-weight: 700;
    line-height: 1;
    letter-spacing: -0.02em;
    color: var(--lw-primary-dark, #020B2B);
    margin: 0;
    font-family: var(--lw-font-family-heading, sans-serif);
}

@media (min-width: 768px) {
    .hd-kpi-value[b-qs22jhofbr] {
        font-size: 32px;
    }
}

.hd-spark[b-qs22jhofbr] {
    display: block;
    height: 32px;
    width: auto;
    max-width: 100%;
    flex-shrink: 0;
}

@media (max-width: 767px) {
    .hd-spark[b-qs22jhofbr] {
        display: none;
    }
}

.hd-kpi-foot[b-qs22jhofbr] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 0.5rem;
    margin-top: 0.5rem;
}

@media (min-width: 768px) {
    .hd-kpi-foot[b-qs22jhofbr] {
        margin-top: 0.75rem;
    }
}

.hd-trend[b-qs22jhofbr] {
    display: inline-flex;
    align-items: center;
    gap: 0.25rem;
    font-size: 11px;
    font-weight: 600;
}

@media (min-width: 768px) {
    .hd-trend[b-qs22jhofbr] {
        font-size: 12px;
    }
}

.hd-trend-up[b-qs22jhofbr]   { color: var(--lw-status-success-fg); }
.hd-trend-down[b-qs22jhofbr] { color: var(--lw-status-error-fg); }

.hd-kpi-subtitle[b-qs22jhofbr] {
    display: none;
    font-size: 11px;
    color: var(--lw-gray-graphite, #6E7180);
}

@media (min-width: 768px) {
    .hd-kpi-subtitle[b-qs22jhofbr] { display: inline; }
}

/* Placeholder value for the Net Margin card's no-data states -- mirrors the
   reference's em-dash at text-muted-foreground/40, sized like the value. */
.hd-kpi-nodata[b-qs22jhofbr] {
    margin: 0;
    font-size: 20px;
    font-weight: 700;
    line-height: 1;
    letter-spacing: var(--lw-tracking-tight);
    color: color-mix(in srgb, var(--lw-gray-space) 40%, transparent);
    font-family: var(--lw-font-family-heading, sans-serif);
}

@media (min-width: 768px) {
    .hd-kpi-nodata[b-qs22jhofbr] { font-size: 32px; }
}

/* ── Section title shared ── */
.hd-section-title[b-qs22jhofbr] {
    font-size: 0.875rem;
    font-weight: 600;
    color: var(--lw-primary-dark, #020B2B);
    margin: 0;
}

.hd-view-all[b-qs22jhofbr] {
    display: inline-flex;
    align-items: center;
    gap: 0.25rem;
    background: transparent;
    border: none;
    cursor: pointer;
    padding: 0;
    font-size: 0.75rem;
    font-weight: 500;
    color: var(--lw-gray-graphite, #6E7180);
    transition: color 0.15s;
    font-family: var(--lw-font-family);
}

.hd-view-all:hover[b-qs22jhofbr] {
    color: var(--lw-primary-dark, #020B2B);
}

/* ── Active Projects card ── */
/* Surface provided by the shared Card primitive; overflow clips to its radius. */
.hd-projects-card[b-qs22jhofbr] {
    overflow: hidden;
    display: flex;
    flex-direction: column;
}

.hd-projects-head[b-qs22jhofbr] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 1rem 1.25rem;
}

.hd-projects-toggle[b-qs22jhofbr] {
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
    background: transparent;
    border: none;
    cursor: pointer;
    padding: 0;
    font-family: var(--lw-font-family);
    color: var(--lw-primary-dark, #020B2B);
}

.hd-projects-toggle .hd-section-title[b-qs22jhofbr] {
    font-size: 0.875rem;
    font-weight: 600;
}

.hd-projects-table thead tr[b-qs22jhofbr] {
    border-top: 1px solid var(--lw-border);
}

.hd-projects-table tbody tr[b-qs22jhofbr] {
    cursor: pointer;
}

.hd-projects-tablewrap[b-qs22jhofbr] {
    overflow-x: auto;
}

.hd-projects-table[b-qs22jhofbr] {
    width: 100%;
    border-collapse: collapse;
}

/* Reference active-projects-table.tsx (measured 2026-07-28): th px-5 py-3
   12px/500 uppercase tracking-wider content-secondary, no fill, hairline
   top border; td px-5 py-3.5 align-top 14px/500; trailing columns center. */
.hd-projects-table th[b-qs22jhofbr],
.hd-projects-table td[b-qs22jhofbr] {
    padding: 0.875rem 1.25rem;
    text-align: left;
    font-size: 0.875rem;
    font-weight: 500;
    color: var(--lw-text-primary);
    vertical-align: top;
}

.hd-projects-table th[b-qs22jhofbr] {
    padding: 0.75rem 1.25rem;
    font-size: 12px;
    font-weight: 500;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    color: var(--lw-gray-graphite, #6E7180);
    white-space: nowrap;
}

.hd-projects-table tr[b-qs22jhofbr] {
    border-top: 1px solid var(--lw-border);
}

.hd-projects-table tbody tr:hover[b-qs22jhofbr] {
    background: color-mix(in srgb, var(--lw-accent) 50%, transparent);
}

.hd-num-col[b-qs22jhofbr] {
    text-align: center !important;
    font-variant-numeric: tabular-nums;
}

/* Trust balance cell: red amount + "Below min" subtext when balance is under
   the project's MinimumTrustFundAccountBalance (mirrors ledgerwise-ui
   ActiveProjectsTable). */
.hd-trust-cell[b-qs22jhofbr] {
    display: inline-flex;
    flex-direction: column;
    align-items: center;
    gap: 0.125rem;
}

.hd-trust-amount[b-qs22jhofbr] {
    color: var(--lw-text-primary);
}

.hd-trust-amount--alert[b-qs22jhofbr] {
    color: var(--lw-status-error-fg);
}

.hd-trust-alert[b-qs22jhofbr] {
    font-size: 0.6875rem;
    color: var(--lw-status-error-fg);
}

/* Project cell */
.hd-project-cell[b-qs22jhofbr] {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    min-width: 0;
}

.hd-project-avatar[b-qs22jhofbr] {
    width: 36px;
    height: 36px;
    flex-shrink: 0;
    background: var(--lw-primary-dark, #020B2B);
    color: var(--lw-white);
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 12px;
    font-weight: 700;
    letter-spacing: 0.04em;
    font-family: var(--lw-font-family-heading, sans-serif);
}

.hd-project-info[b-qs22jhofbr] {
    min-width: 0;
}

.hd-project-name[b-qs22jhofbr] {
    font-size: 0.875rem;
    font-weight: 500;
    color: var(--lw-text-primary);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.hd-project-desc[b-qs22jhofbr] {
    font-size: 0.75rem;
    font-weight: 400;
    color: var(--lw-gray-space);
    margin-top: 2px;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

/* Status badges */
.hd-status[b-qs22jhofbr] {
    display: inline-flex;
    align-items: center;
    height: 20px;
    padding: 0 8px;
    font-size: 11px;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.04em;
    border-radius: 0;
}

.hd-status-on-track[b-qs22jhofbr] {
    background: var(--lw-status-success-bg);
    color: var(--lw-status-success-fg);
}

.hd-status-at-risk[b-qs22jhofbr] {
    background: var(--lw-status-warning-bg);
    color: var(--lw-status-warning-fg);
}

.hd-status-delayed[b-qs22jhofbr] {
    background: var(--lw-status-error-bg);
    color: var(--lw-status-error-fg);
}

.hd-unpaid[b-qs22jhofbr] {
    font-weight: 600;
    color: var(--lw-gray-graphite, #6E7180);
}

.hd-unpaid-on[b-qs22jhofbr] {
    color: var(--lw-primary-dark, #020B2B);
}

.hd-muted[b-qs22jhofbr] {
    color: var(--lw-gray-space);
    font-weight: 400;
}

/* Pending invoices count pill (inside the table cell) */
/* Reference PendingInvoicesCell trigger: rounded-md muted chip, 12px/600
   tabular, hover accent fill + stronger border. */
.hd-pending-pill[b-qs22jhofbr] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 28px;
    padding: 0.25rem 0.5rem;
    border: 1px solid var(--lw-border);
    border-radius: var(--lw-radius-control);
    background: var(--lw-bg-muted);
    font-size: 0.75rem;
    font-weight: 600;
    font-variant-numeric: tabular-nums;
    color: var(--lw-text-primary);
    cursor: pointer;
    transition: background-color 0.15s, border-color 0.15s;
}

.hd-pending-pill:hover[b-qs22jhofbr] {
    background: var(--lw-accent);
    border-color: color-mix(in srgb, var(--lw-text-primary) 30%, transparent);
}

/* Inbox dropzone */
/* Wrapper grows to fill remaining height in the inbox card, so the inbox
   panel matches the Critical Tasks panel height in the bottom-grid (mirrors
   the flex-1 wrapper on the ledgerwise-ui InvoiceInboxPanel). */
.hd-inbox-dropzone-wrap[b-qs22jhofbr] {
    flex: 1;
    display: flex;
    padding: 1rem 1.25rem;
}

.hd-inbox-dropzone-wrap-empty[b-qs22jhofbr] {
    padding: 1rem 1.25rem 1.25rem;
}

/* Reference invoice-drop-zone.tsx (measured 2026-07-28): rounded-lg 2px
   dashed rgba(145,158,171,.32) over rgba(145,158,171,.08); drag-over swaps
   to brand-accent / rgba(57,128,165,.08). Compact py-2.5, expanded py-8. */
.hd-dropzone[b-qs22jhofbr] {
    position: relative;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 0.25rem;
    border: 2px dashed rgba(145, 158, 171, 0.32);
    border-radius: var(--lw-radius-card);
    background: rgba(145, 158, 171, 0.08);
    cursor: pointer;
    transition: border-color 0.15s, background 0.15s;
    flex: 1;
    width: 100%;
    box-sizing: border-box;
}

.hd-dropzone-expanded[b-qs22jhofbr] {
    padding: 2rem 1rem;
}

.hd-dropzone-compact[b-qs22jhofbr] {
    padding: 0.625rem 1rem;
}

.hd-dropzone:hover[b-qs22jhofbr] {
    border-color: var(--lw-primary-blue, #3980A5);
    background: rgba(57, 128, 165, 0.08);
}

.hd-dropzone-title[b-qs22jhofbr] {
    font-size: 0.75rem;
    font-weight: 500;
    color: var(--lw-text-primary);
}

.hd-dropzone-title-lg[b-qs22jhofbr] {
    font-size: 0.875rem;
    font-weight: 600;
}

.hd-dropzone-sub[b-qs22jhofbr] {
    font-size: 11px;
    color: var(--lw-gray-space);
}

/* Inbox content states (extracting / done / populated) */
.hd-inbox-body[b-qs22jhofbr] {
    display: flex;
    flex-direction: column;
    gap: 1rem;
    padding: 0 1.25rem 1.25rem;
}

.hd-inbox-extracting[b-qs22jhofbr] {
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
    padding: 0.5rem 0;
}

.hd-inbox-extracting-title[b-qs22jhofbr] {
    font-size: 0.875rem;
    font-weight: 500;
    color: var(--lw-primary-dark, #020B2B);
    margin: 0;
}

.hd-inbox-extracting-sub[b-qs22jhofbr] {
    font-size: 0.875rem;
    color: var(--lw-gray-graphite, #6E7180);
    margin: 0;
}

.hd-inbox-progress[b-qs22jhofbr] {
    margin-top: 0.25rem;
    height: 3px;
    width: 100%;
    background: var(--lw-bg-muted, #F7F7F5);
    overflow: hidden;
}

.hd-inbox-progress-bar[b-qs22jhofbr] {
    height: 100%;
    background: var(--lw-primary-blue, #3980A5);
    transition: width 0.4s ease-out;
}

.hd-inbox-done[b-qs22jhofbr] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.75rem 0;
    color: var(--lw-status-success-fg);
    font-size: 0.875rem;
    font-weight: 500;
}

.hd-inbox-stats[b-qs22jhofbr] {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 0.75rem;
    background: var(--lw-bg-muted, #F7F7F5);
    padding: 1rem;
}

.hd-view-all-muted[b-qs22jhofbr] {
    color: var(--lw-gray-graphite, #6E7180);
}

/* ── Bottom grid ── */
.hd-bottom-grid[b-qs22jhofbr] {
    display: grid;
    grid-template-columns: 1fr;
    gap: 1rem;
}

@media (min-width: 768px) {
    .hd-bottom-grid[b-qs22jhofbr] {
        grid-template-columns: 1fr 1fr;
    }
}

/* Tasks list */
.hd-task-list[b-qs22jhofbr] {
    display: flex;
    flex-direction: column;
}

.hd-task[b-qs22jhofbr] {
    display: flex;
    align-items: flex-start;
    gap: 0.75rem;
    padding: 0.875rem 1.25rem;
    border-top: 1px solid var(--lw-border);
    transition: background 0.12s;
}

.hd-task:hover[b-qs22jhofbr] {
    background: color-mix(in srgb, var(--lw-accent) 50%, transparent);
}

.hd-task-clickable[b-qs22jhofbr] {
    cursor: pointer;
}

.hd-task-clickable:focus-visible[b-qs22jhofbr] {
    outline: 2px solid var(--lw-primary-blue, #3980A5);
    outline-offset: -2px;
}

.hd-task-dot[b-qs22jhofbr] {
    flex-shrink: 0;
    width: 8px;
    height: 8px;
    margin-top: 6px;
    border-radius: 2px;
    display: inline-block;
}

.hd-task-dot-urgent[b-qs22jhofbr] { background: var(--lw-status-error-fg); }
.hd-task-dot-high[b-qs22jhofbr]   { background: var(--lw-status-warning-fg); }
.hd-task-dot-medium[b-qs22jhofbr] { background: var(--lw-primary-blue, #3980A5); }
.hd-task-dot-low[b-qs22jhofbr]    { background: var(--lw-gray-graphite, #6E7180); }

.hd-task-body[b-qs22jhofbr] {
    flex: 1;
    min-width: 0;
}

.hd-task-title[b-qs22jhofbr] {
    font-size: 0.875rem;
    font-weight: 500;
    line-height: 1.375;
    color: var(--lw-text-primary);
    margin: 0;
}

.hd-task-project[b-qs22jhofbr] {
    font-size: 0.75rem;
    color: var(--lw-gray-space);
    margin: 2px 0 0;
}

.hd-task-due[b-qs22jhofbr] {
    flex-shrink: 0;
    font-size: 0.75rem;
    color: var(--lw-status-error-fg);
    font-weight: 600;
    white-space: nowrap;
}

.hd-empty-row[b-qs22jhofbr] {
    padding: 1.25rem;
    border-top: 1px solid var(--lw-border);
}

/* Stable height while paging - keeps card from jumping on a short page.
   5 rows * ~57px = ~285px, matches ledgerwise-ui CriticalTasksPanel. */
.hd-task-list--paged[b-qs22jhofbr] {
    min-height: 285px;
}

/* When the header carries its own bottom border, the first row's border-top
   would double it - suppress so the seam stays a single hairline. */
.hd-task-list--paged .hd-task:first-child[b-qs22jhofbr] {
    border-top: none;
}

/* Tasks pagination footer */
.hd-task-pagination[b-qs22jhofbr] {
    margin-top: auto;
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 0.5rem 1.25rem;
    border-top: 1px solid var(--lw-border);
}

.hd-task-pagination__range[b-qs22jhofbr] {
    font-size: 0.6875rem;
    font-variant-numeric: tabular-nums;
    color: var(--lw-gray-space);
}


/* Outstanding-invoices pipeline rows -- reference sub-dashboard.tsx
   InvoicePipelinePanel list (2026-07-28): px-5 py-3 hairline-divided rows,
   number 14/500 + project 12 muted on the left; amount 14/500 tabular over
   a 10px bold uppercase tone badge on the right; hover accent/50. */
.hd-pipe-list[b-qs22jhofbr] {
    display: flex;
    flex-direction: column;
}

.hd-pipe-row[b-qs22jhofbr] {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    padding: 0.75rem 1.25rem;
    transition: background-color 0.12s;
}

.hd-pipe-row + .hd-pipe-row[b-qs22jhofbr] {
    border-top: 1px solid var(--lw-border);
}

.hd-pipe-row:hover[b-qs22jhofbr] {
    background: color-mix(in srgb, var(--lw-accent) 50%, transparent);
}

.hd-pipe-main[b-qs22jhofbr] {
    flex: 1;
    min-width: 0;
}

.hd-pipe-num[b-qs22jhofbr] {
    margin: 0;
    font-size: 0.875rem;
    font-weight: 500;
    color: var(--lw-text-primary);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.hd-pipe-project[b-qs22jhofbr] {
    margin: 2px 0 0;
    font-size: 0.75rem;
    color: var(--lw-gray-space);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.hd-pipe-side[b-qs22jhofbr] {
    flex-shrink: 0;
    display: flex;
    flex-direction: column;
    align-items: flex-end;
    gap: 0.375rem;
}

.hd-pipe-amount[b-qs22jhofbr] {
    font-size: 0.875rem;
    font-weight: 500;
    font-variant-numeric: tabular-nums;
    color: var(--lw-text-primary);
}

.hd-pipe-badge[b-qs22jhofbr] {
    display: inline-flex;
    align-items: center;
    padding: 2px 6px;
    font-size: 10px;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.025em;
    white-space: nowrap;
}

/* Tone map mirrors reference PIPELINE_BADGE, keyed by MapInvoiceStage. */
.hd-pipe-badge--submitted[b-qs22jhofbr]           { background: var(--lw-bg-muted); color: var(--lw-gray-graphite); }
.hd-pipe-badge--under-client-review[b-qs22jhofbr] { background: var(--lw-status-warning-bg); color: var(--lw-status-warning-fg); }
.hd-pipe-badge--client-approved[b-qs22jhofbr]     { background: var(--lw-status-success-bg); color: var(--lw-status-success-fg); }
.hd-pipe-badge--lien-waiver[b-qs22jhofbr]         { background: var(--lw-lien-bg); color: var(--lw-lien-fg); }
.hd-pipe-badge--awaiting-funds[b-qs22jhofbr]      { background: var(--lw-status-info-bg); color: var(--lw-status-info-fg); }
.hd-pipe-badge--processing[b-qs22jhofbr]          { background: color-mix(in srgb, var(--lw-primary-dark) 10%, transparent); color: var(--lw-primary-dark); }

/* ── Empty state for non-builders ── */
.hd-empty[b-qs22jhofbr] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    min-height: 400px;
    gap: 0.5rem;
    text-align: center;
    padding: 2rem;
}

.hd-empty-title[b-qs22jhofbr] {
    font-size: 1.125rem;
    font-weight: 600;
    color: var(--lw-primary-dark, #020B2B);
    margin: 0.5rem 0 0;
}

.hd-empty-desc[b-qs22jhofbr] {
    font-size: 0.875rem;
    color: var(--lw-gray-graphite, #6E7180);
    margin: 0;
    max-width: 420px;
}

/* Pending invoices popover (opens from the count pill). The MudPopover
   wrapper itself lives outside this component's scoped-CSS reach (it
   teleports via MudPopoverProvider), so its background/shadow are handled in
   app.css. The inner content elements below retain Blazor's scope attribute
   and are styled from here. */
.hd-pending-anchor[b-qs22jhofbr] {
    position: relative;
    display: inline-block;
}

.hd-pending-pop[b-qs22jhofbr] {
    display: flex;
    flex-direction: column;
    background: var(--lw-primary-dark, #020B2B);
    color: var(--lw-white);
    min-width: 18rem;
    max-width: 20rem;
}

.hd-pending-pop-head[b-qs22jhofbr] {
    padding: 0.5rem 0.75rem 0.375rem;
    font-size: 0.625rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.06em;
    color: rgba(255, 255, 255, 0.6);
}

.hd-pending-pop-list[b-qs22jhofbr] {
    display: flex;
    flex-direction: column;
    border-top: 1px solid rgba(255, 255, 255, 0.12);
}

.hd-pending-pop-row[b-qs22jhofbr] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 0.5rem;
    padding: 0.375rem 0.75rem;
    background: transparent;
    border: 0;
    color: var(--lw-white);
    text-align: left;
    cursor: pointer;
    transition: background-color 0.12s ease;
}

.hd-pending-pop-row:hover[b-qs22jhofbr] {
    background: rgba(255, 255, 255, 0.08);
}

.hd-pending-pop-num[b-qs22jhofbr] {
    font-size: 0.75rem;
    font-weight: 500;
    font-variant-numeric: tabular-nums;
    color: var(--lw-white);
}

.hd-pending-pop-stage[b-qs22jhofbr] {
    flex-shrink: 0;
    padding: 0.125rem 0.375rem;
    font-size: 0.5625rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.06em;
    white-space: nowrap;
}

.hd-pending-pop-toggle[b-qs22jhofbr] {
    display: block;
    width: 100%;
    padding: 0.375rem 0.75rem;
    border: 0;
    border-top: 1px solid rgba(255, 255, 255, 0.15);
    background: transparent;
    color: var(--lw-white);
    font-size: 0.6875rem;
    font-weight: 600;
    text-align: left;
    cursor: pointer;
    transition: background-color 0.12s ease;
}

.hd-pending-pop-toggle:hover[b-qs22jhofbr] {
    background: rgba(255, 255, 255, 0.10);
}

/* Stage badge palette (mirrors ledgerwise-ui active-projects-table) */
.hd-stage-submitted[b-qs22jhofbr] {
    background: rgba(255, 255, 255, 0.10);
    color: rgba(255, 255, 255, 0.70);
}

.hd-stage-under-client-review[b-qs22jhofbr] {
    background: rgba(91, 163, 196, 0.20);
    color: var(--lw-popover-stage-info-fg);
}

.hd-stage-client-approved[b-qs22jhofbr] {
    background: rgba(94, 196, 154, 0.18);
    color: var(--lw-popover-stage-success-fg);
}

.hd-stage-lien-waiver[b-qs22jhofbr] {
    background: rgba(238, 182, 112, 0.22);
    color: var(--lw-popover-stage-warning-fg);
}

.hd-stage-processing[b-qs22jhofbr] {
    background: rgba(91, 163, 196, 0.32);
    color: var(--lw-tooltip-info-fg);
}

/* ============================================================
   US-500: Subcontractor welcome state (zero projects)
   Hero card (white) with a navy "what happens next" step rail --
   the same surface language as the sidebar and the onboarding
   rail the sub just completed. Benefits use the onboarding
   welcome-card style. The sample dashboard below is grayed,
   inert, and dissolving: a preview, not the subject.
   ============================================================ */

.hd-welcome-head[b-qs22jhofbr] {
    padding: 0.5rem 0 0.75rem;
    animation: hd-welcome-in-b-qs22jhofbr 0.35s ease-out both;
}

@keyframes hd-welcome-in-b-qs22jhofbr {
    from { opacity: 0; transform: translateY(10px); }
    to   { opacity: 1; transform: translateY(0); }
}

@media (prefers-reduced-motion: reduce) {
    .hd-welcome-head[b-qs22jhofbr] { animation: none; }
}

/* -- Hero card -- */
.hd-hero[b-qs22jhofbr] {
    display: grid;
    grid-template-columns: minmax(0, 1fr) 340px;
    grid-template-areas:
        "main rail"
        "benefits benefits";
    /* Ambient brand glows from ledgerwise.com's marketing background:
       blue upper-left, gold toward the rail edge, over white. The site
       uses blurred radial divs; soft gradient stops give the same wash. */
    background:
        radial-gradient(620px 460px at -60px -120px, rgba(57, 128, 165, 0.26) 0%, rgba(57, 128, 165, 0) 62%),
        radial-gradient(560px 430px at 78% -80px, rgba(238, 182, 111, 0.32) 0%, rgba(238, 182, 111, 0) 65%),
        #fff;
    border: 1px solid var(--lw-border);
    border-radius: var(--lw-radius-card);
    box-shadow: var(--lw-shadow-card);
    overflow: hidden;
}

.hd-hero-main[b-qs22jhofbr] {
    grid-area: main;
    padding: 32px 36px;
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    justify-content: center;
}

.hd-welcome-chip[b-qs22jhofbr] {
    display: inline-flex;
    align-items: center;
    gap: 5px;
    background: rgba(238, 182, 112, 0.22);
    color: var(--lw-primary-gold-fg);
    border-radius: 999px;
    padding: 3px 10px;
    font-size: 0.75rem;
    font-weight: 600;
}

.hd-welcome-chip .mud-icon-root[b-qs22jhofbr] {
    color: var(--lw-primary-gold);
}

.hd-welcome-title[b-qs22jhofbr] {
    margin: 14px 0 0;
    font-size: 1.5rem;
    line-height: 1.25;
    font-weight: 700;
    letter-spacing: -0.025em;
    color: var(--lw-primary-dark);
    max-width: 24ch;
}

.hd-welcome-desc[b-qs22jhofbr] {
    margin: 10px 0 0;
    font-size: 0.9375rem;
    line-height: 1.55;
    color: var(--lw-gray-graphite);
}

/* -- Navy step rail -- */
.hd-hero-rail[b-qs22jhofbr] {
    grid-area: rail;
    border-left: 1px solid var(--lw-border);
    padding: 28px 32px;
    display: flex;
    flex-direction: column;
    justify-content: center;
}

.hd-hero-rail-label[b-qs22jhofbr] {
    margin: 0 0 16px;
    font-size: 0.6875rem;
    font-weight: 600;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    color: var(--lw-gray-graphite);
}

.hd-hero-steps[b-qs22jhofbr] {
    list-style: none;
    margin: 0;
    padding: 0;
    display: flex;
    flex-direction: column;
    gap: 16px;
}

.hd-hero-steps li[b-qs22jhofbr] {
    display: flex;
    align-items: flex-start;
    gap: 12px;
    font-size: 0.875rem;
    line-height: 1.45;
    color: var(--lw-primary-dark);
}

.hd-hero-step-num[b-qs22jhofbr] {
    flex: none;
    width: 24px;
    height: 24px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border: 1px solid var(--lw-gray-smoke);
    border-radius: 50%;
    font-size: 0.75rem;
    font-weight: 600;
    color: var(--lw-gray-graphite);
}

/* -- Benefits strip: full-width bottom region of the hero card -- */
.hd-hero-benefits[b-qs22jhofbr] {
    grid-area: benefits;
    border-top: 1px solid var(--lw-border);
    padding: 32px 36px;
}

.hd-welcome-benefits-lead[b-qs22jhofbr] {
    margin: 0;
    font-size: 0.875rem;
    font-weight: 400;
    color: var(--lw-gray-graphite);
}

.hd-benefit-grid[b-qs22jhofbr] {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 16px 0;
    margin-top: 24px;
}

.hd-benefit[b-qs22jhofbr] {
    display: flex;
    align-items: flex-start;
    gap: 12px;
    padding-right: 28px;
}

.hd-benefit + .hd-benefit[b-qs22jhofbr] {
    border-left: 1px solid var(--lw-border);
    padding-left: 28px;
}

.hd-benefit-text[b-qs22jhofbr] {
    min-width: 0;
}

.hd-benefit-icon[b-qs22jhofbr] {
    flex: none;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 36px;
    height: 36px;
    border-radius: 8px;
    background: rgba(57, 128, 165, 0.10);
}

.hd-benefit-icon .mud-icon-root[b-qs22jhofbr] {
    color: var(--lw-primary-blue);
    font-size: 1.125rem;
}

.hd-benefit-title[b-qs22jhofbr] {
    margin: 0;
    font-size: 0.875rem;
    font-weight: 600;
    color: var(--lw-primary-dark);
}

.hd-benefit-desc[b-qs22jhofbr] {
    margin: 3px 0 0;
    font-size: 0.8125rem;
    line-height: 1.45;
    color: var(--lw-gray-graphite);
}

@media (max-width: 900px) {
    .hd-hero[b-qs22jhofbr] {
        grid-template-columns: 1fr;
        grid-template-areas:
            "main"
            "rail"
            "benefits";
    }
    .hd-hero-main[b-qs22jhofbr] { padding: 24px; }
    .hd-hero-rail[b-qs22jhofbr] { border-left: none; border-top: 1px solid var(--lw-border); padding: 22px 24px; }
    .hd-hero-benefits[b-qs22jhofbr] { padding: 24px; }
    .hd-benefit-grid[b-qs22jhofbr] { grid-template-columns: 1fr; gap: 14px; }
    .hd-benefit[b-qs22jhofbr] { padding-right: 0; }
    .hd-benefit + .hd-benefit[b-qs22jhofbr] { border-left: none; padding-left: 0; }
}

/* -- Sample dashboard preview: desaturated, inert, dissolving -- */
.hd-welcome-preview[b-qs22jhofbr] {
    display: flex;
    flex-direction: column;
    gap: 1.25rem;
    filter: grayscale(1) blur(2px);
    opacity: 0.55;
    pointer-events: none;
    user-select: none;
    -webkit-mask-image: linear-gradient(180deg, #000 0%, #000 55%, transparent 98%);
    mask-image: linear-gradient(180deg, #000 0%, #000 55%, transparent 98%);
}

@media (min-width: 768px) {
    .hd-welcome-preview[b-qs22jhofbr] { gap: 1.5rem; }
}
/* _content/Ledgerwise/Components/Pages/Onboarding/Client/AccountAgreement.razor.rz.scp.css */
/* ============================================================
   Account agreement (Form 5119) onboarding page SHELL only.
   The agreement document + sign block + adopt overlay now live in the shared
   components Components/Shared/Form5119/* (Form5119Document / Form5119SignBlock),
   so they render identically on the builder send-proposal stepper. This file keeps
   only the page-level layout (centered column, header, fixed action bar).
   ============================================================ */

.aa-page[b-v1t29xxkt7] {
    /* Centered document column, mirroring the ledgerwise-ui wizard content. */
    box-sizing: border-box;
    width: 100%;
    max-width: 1000px;
    margin: 0 auto;
    padding: 8px 40px 96px; /* px-10 sides; bottom clears the fixed action bar */
}

/* ── Step header ── */
.aa-header[b-v1t29xxkt7] {
    margin-bottom: 24px;
}

.aa-header__title[b-v1t29xxkt7] {
    font-family: var(--lw-font-family-heading, inherit);
    font-size: var(--lw-title-size);
    font-weight: var(--lw-title-weight);
    letter-spacing: var(--lw-tracking-tight);
    color: var(--lw-title-color);
    margin: 0;
    line-height: 1.3;
}

.aa-header__sub[b-v1t29xxkt7] {
    margin: 6px 0 0;
    font-size: 0.875rem;
    line-height: 1.55;
    color: var(--lw-gray-graphite);
}

/* -- Document action bar (fixed footer) --
   Positioning only; the bar chrome (border, bg, padding, buttons) lives in
   the LwDocActionBar atom. */
.aa-footer[b-v1t29xxkt7] {
    position: fixed;
    left: var(--lw-wizard-rail-width);
    right: 0;
    bottom: 0;
    z-index: 20;
}

@media (max-width: 960px) {
    .aa-footer[b-v1t29xxkt7] {
        left: 0;
    }
}
/* _content/Ledgerwise/Components/Pages/Onboarding/Client/Welcome.razor.rz.scp.css */
/* Welcome onboarding step -- matches ledgerwise-ui ho-step-welcome with pure-CSS motion. */

.ho-welcome[b-31nyicw67w] {
    --ho-brand-grad: linear-gradient(135deg, #3980A5 0%, #5ba3c4 50%, #EEB66F 100%);
    width: 100%;
    max-width: 1000px;
    margin: 0 auto;
    display: flex;
    flex-direction: column;
    justify-content: flex-start;
    min-height: calc(100vh - 13rem);
    padding-bottom: 88px;
}

.ho-welcome__title[b-31nyicw67w] {
    font-family: var(--lw-font-family-heading);
    font-size: var(--lw-title-size);
    font-weight: var(--lw-title-weight);
    letter-spacing: var(--lw-tracking-tight);
    color: var(--lw-title-color);
    margin: 0;
}

.ho-welcome__sub[b-31nyicw67w] {
    font-size: 0.875rem;
    line-height: 1.625;
    color: var(--lw-gray-graphite);
    margin-top: 6px;
}

.ho-grid[b-31nyicw67w] {
    display: grid;
    grid-template-columns: 1fr;
    gap: 16px;
    margin-top: 24px;
}

@media (min-width: 768px) {
    .ho-grid[b-31nyicw67w] { grid-template-columns: repeat(3, 1fr); }
    .ho-welcome[b-31nyicw67w] { justify-content: center; }
}

.ho-card[b-31nyicw67w] {
    display: flex;
    flex-direction: column;
    overflow: hidden;
    border: 1px solid var(--lw-border);
    border-radius: var(--lw-radius-card);
    background: #fff;
    text-align: center;
    box-shadow: var(--lw-shadow-card);
    opacity: 0;
    animation: ho-fade-up-b-31nyicw67w 0.4s ease-out forwards;
    transition: border-color 0.15s ease;
}

.ho-card:hover[b-31nyicw67w] { border-color: rgba(30, 30, 36, 0.15); }

.ho-card__media[b-31nyicw67w] {
    position: relative;
    height: 200px;
    border-bottom: 1px solid var(--lw-border);
    display: flex;
    align-items: center;
    justify-content: center;
    /* Reference is bg-muted/50 over the white card, not full-strength muted. */
    background: color-mix(in srgb, var(--lw-bg-muted) 50%, transparent);
    overflow: hidden;
}

@media (min-width: 768px) {
    .ho-card__media[b-31nyicw67w] { height: 240px; }
}

.ho-badge[b-31nyicw67w] {
    position: absolute;
    right: 12px;
    top: 12px;
    z-index: 10;
    display: inline-flex;
    align-items: center;
    gap: 6px;
    height: 24px;
    padding: 0 6px;
    background: var(--lw-status-neutral-bg);
    border-radius: var(--lw-radius-control);
    font-size: 11px;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.025em;
    color: var(--lw-status-neutral-fg);
    box-shadow: 0 1px 2px rgba(2, 11, 43, 0.05);
}

.ho-clock[b-31nyicw67w] { width: 12px; height: 12px; }

.ho-card__body[b-31nyicw67w] { flex: 1; padding: 16px 20px 20px; }
.ho-card__title[b-31nyicw67w] { font-size: 0.875rem; font-weight: 600; color: var(--lw-text-primary); margin: 0; }
.ho-card__desc[b-31nyicw67w] { font-size: 0.8125rem; line-height: 1.625; color: var(--lw-gray-graphite); margin-top: 6px; }

/* Shared mini-card inside each illustration */
.ho-illus[b-31nyicw67w] { width: 82%; }
.ho-illus__card[b-31nyicw67w] {
    border: 1px solid var(--lw-border);
    border-radius: var(--lw-radius-card);
    /* Reference inner card is bg-background, which the ui-app defines as
       white (#ffffff) -- NOT the older ledgerwise-ui off-white #F9FAFB. */
    background: #fff;
    padding: 12px;
    box-shadow: 0 1px 2px rgba(2, 11, 43, 0.05);
}

/* ── Profile illustration ── */
.ho-pf__head[b-31nyicw67w] { display: flex; align-items: center; gap: 8px; }
.ho-pf__avatar[b-31nyicw67w] { width: 24px; height: 24px; border-radius: 999px; background: var(--ho-brand-grad); }
.ho-pf__name[b-31nyicw67w] { height: 8px; width: 64px; border-radius: 999px; background: rgba(57, 128, 165, 0.2); }
.ho-pf__input[b-31nyicw67w] {
    margin-top: 10px; height: 20px; display: flex; align-items: center;
    border: 1px solid var(--lw-border); border-radius: var(--lw-radius-control);
    background: color-mix(in srgb, var(--lw-bg-muted) 40%, transparent); padding: 0 8px; overflow: hidden;
}
.ho-pf__fill[b-31nyicw67w] { height: 6px; border-radius: 999px; background: var(--lw-primary-blue); width: 0; }
.ho-pf__fill--0[b-31nyicw67w] { animation: ho-pf-fill0-b-31nyicw67w 4.5s ease-in-out infinite; }
.ho-pf__fill--1[b-31nyicw67w] { animation: ho-pf-fill1-b-31nyicw67w 4.5s ease-in-out infinite; }
.ho-pf__save[b-31nyicw67w] {
    position: relative; margin-top: 10px; height: 20px;
    display: flex; align-items: center; justify-content: center;
    border-radius: var(--lw-radius-control); background: rgba(57, 128, 165, 0.1); overflow: hidden;
}
.ho-pf__gold[b-31nyicw67w] { position: absolute; inset: 0; border-radius: var(--lw-radius-control); background: var(--lw-primary-gold); opacity: 0; animation: ho-pf-gold-b-31nyicw67w 4.5s linear infinite; }
.ho-pf__check[b-31nyicw67w] { position: relative; width: 12px; height: 12px; opacity: 0; animation: ho-pf-check-b-31nyicw67w 4.5s linear infinite; }

@keyframes ho-pf-fill0-b-31nyicw67w {
    0%, 12% { width: 0; }
    30%, 86% { width: 52px; }
    96%, 100% { width: 0; }
}
@keyframes ho-pf-fill1-b-31nyicw67w {
    0%, 34% { width: 0; }
    52%, 86% { width: 68px; }
    96%, 100% { width: 0; }
}
@keyframes ho-pf-gold-b-31nyicw67w {
    0%, 62%, 68% { opacity: 0; }
    72%, 90% { opacity: 1; }
    97%, 100% { opacity: 0; }
}
@keyframes ho-pf-check-b-31nyicw67w {
    0%, 62%, 70% { opacity: 0; }
    74%, 90% { opacity: 1; }
    97%, 100% { opacity: 0; }
}

/* ── Sign illustration ── */
.ho-sg__line[b-31nyicw67w] { height: 6px; border-radius: 999px; }
.ho-sg__line + .ho-sg__line[b-31nyicw67w] { margin-top: 6px; }
.ho-sg__line--1[b-31nyicw67w] { width: 75%; background: rgba(57, 128, 165, 0.2); }
.ho-sg__line--2[b-31nyicw67w] { width: 100%; background: rgba(30, 30, 36, 0.07); }
.ho-sg__line--3[b-31nyicw67w] { width: 83%; background: rgba(30, 30, 36, 0.07); }
.ho-sg__sign[b-31nyicw67w] { margin-top: 12px; }
.ho-sg__path[b-31nyicw67w] {
    stroke-width: 2; fill: none; stroke-linecap: round; stroke-linejoin: round;
    stroke-dasharray: 160; stroke-dashoffset: 160;
    animation: ho-sg-draw-b-31nyicw67w 5s ease-in-out infinite;
}

@keyframes ho-sg-draw-b-31nyicw67w {
    0% { stroke-dashoffset: 160; opacity: 1; }
    50% { stroke-dashoffset: 0; opacity: 1; }
    85% { stroke-dashoffset: 0; opacity: 1; }
    100% { stroke-dashoffset: 160; opacity: 0; }
}

/* ── Fund illustration ── */
.ho-fd__head[b-31nyicw67w] { display: flex; align-items: center; justify-content: space-between; }
.ho-fd__label[b-31nyicw67w] { height: 8px; width: 56px; border-radius: 999px; background: rgba(57, 128, 165, 0.2); }
.ho-fd__coin[b-31nyicw67w] {
    width: 24px; height: 24px; border-radius: 999px;
    display: flex; align-items: center; justify-content: center;
    color: #fff;
    background: var(--ho-brand-grad); opacity: 0; animation: ho-fd-coin-b-31nyicw67w 5s ease-out infinite;
}
.ho-fd__track[b-31nyicw67w] { margin-top: 12px; height: 8px; border-radius: 999px; background: rgba(30, 30, 36, 0.08); overflow: hidden; }
.ho-fd__bar[b-31nyicw67w] { height: 100%; border-radius: 999px; background: var(--ho-brand-grad); width: 0; animation: ho-fd-bar-b-31nyicw67w 5s ease-in-out infinite; }
.ho-fd__done[b-31nyicw67w] { margin-top: 12px; display: flex; align-items: center; gap: 6px; }
.ho-fd__check[b-31nyicw67w] {
    width: 14px; height: 14px; border-radius: 999px; background: var(--lw-primary-gold);
    display: flex; align-items: center; justify-content: center;
    opacity: 0; transform: scale(0.6); animation: ho-fd-check-b-31nyicw67w 5s linear infinite;
}
.ho-fd__check svg[b-31nyicw67w] { width: 8px; height: 8px; }
.ho-fd__doneline[b-31nyicw67w] { height: 6px; width: 48px; border-radius: 999px; background: rgba(57, 128, 165, 0.2); opacity: 0; animation: ho-fd-doneline-b-31nyicw67w 5s linear infinite; }

@keyframes ho-fd-coin-b-31nyicw67w {
    0% { opacity: 0; transform: translateY(-10px); }
    20% { opacity: 1; transform: translateY(0); }
    85% { opacity: 1; transform: translateY(0); }
    95%, 100% { opacity: 0; transform: translateY(-10px); }
}
@keyframes ho-fd-bar-b-31nyicw67w {
    0%, 22% { width: 0; }
    60%, 85% { width: 100%; }
    96%, 100% { width: 0; }
}
@keyframes ho-fd-check-b-31nyicw67w {
    0%, 60%, 66% { opacity: 0; transform: scale(0.6); }
    72%, 90% { opacity: 1; transform: scale(1); }
    97%, 100% { opacity: 0; transform: scale(1); }
}
@keyframes ho-fd-doneline-b-31nyicw67w {
    0%, 60%, 66% { opacity: 0; }
    74%, 90% { opacity: 1; }
    97%, 100% { opacity: 0; }
}

@keyframes ho-fade-up-b-31nyicw67w {
    from { opacity: 0; transform: translateY(16px); }
    to { opacity: 1; transform: translateY(0); }
}

@media (prefers-reduced-motion: reduce) {
    .ho-card[b-31nyicw67w],
    .ho-pf__fill[b-31nyicw67w],
    .ho-pf__gold[b-31nyicw67w],
    .ho-pf__check[b-31nyicw67w],
    .ho-sg__path[b-31nyicw67w],
    .ho-fd__coin[b-31nyicw67w],
    .ho-fd__bar[b-31nyicw67w],
    .ho-fd__check[b-31nyicw67w],
    .ho-fd__doneline[b-31nyicw67w] { animation: none; }
    .ho-card[b-31nyicw67w] { opacity: 1; }
}
/* _content/Ledgerwise/Components/Pages/Onboarding/Contractor/BankVerification.razor.rz.scp.css */
/* Bank step -- source: bank-account-step-content.tsx + vendor-intro-card.tsx
   complete row (2026-07-13): merged linked-account row (46px logo tile, name
   + success "Linked" badge, 12px sub) on a white bordered panel; footer keeps
   the manual-ACH fine-print link. */

[b-9vax1w7t2p] .bank-note {
    margin-bottom: 16px;
}

/* Manual-ACH link inside the footer fine print. */
[b-9vax1w7t2p] .bank-manual-link {
    border: 0;
    background: none;
    padding: 0;
    cursor: pointer;
    font-family: var(--lw-font-family);
    font-size: 12px;
    font-weight: 500;
    color: var(--lw-gray-graphite);
    text-decoration: underline;
    transition: color 0.15s ease;
}

[b-9vax1w7t2p] .bank-manual-link:hover:not(:disabled) {
    color: var(--lw-text-primary);
}

[b-9vax1w7t2p] .bank-manual-link:disabled {
    opacity: 0.55;
    cursor: default;
}

/* Embedded Modern Treasury ACH form mount -- collapsed until started. */
[b-9vax1w7t2p] .bank-mt-flow.is-mounted {
    min-height: 480px;
    border: 1px solid var(--lw-input-border);
    border-radius: var(--lw-radius-card);
    padding: 16px;
    background: var(--lw-white);
}

/* Linked state -- vendor-intro-card.tsx complete row: white bordered row
   px-4 py-3.5, 46px tile, name 14/600 + badge, sub 12 graphite. */
[b-9vax1w7t2p] .bank-linked {
    display: flex;
    align-items: center;
    gap: 14px;
    padding: 14px 16px;
    border: 1px solid var(--lw-border);
    border-radius: var(--lw-radius-card);
    background: var(--lw-white);
}

[b-9vax1w7t2p] .bank-linked__logo {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 46px;
    height: 46px;
    flex-shrink: 0;
    border-radius: var(--lw-radius-card);
    background: var(--lw-primary-dark);
    color: var(--lw-white);
}

[b-9vax1w7t2p] .bank-linked__logo .mud-icon-root {
    width: 22px;
    height: 22px;
    font-size: 22px;
}

[b-9vax1w7t2p] .bank-linked__text {
    min-width: 0;
    flex: 1;
}

[b-9vax1w7t2p] .bank-linked__name-row {
    display: flex;
    align-items: center;
    gap: 8px;
    flex-wrap: wrap;
}

[b-9vax1w7t2p] .bank-linked__name {
    margin: 0;
    font-family: var(--lw-font-family);
    font-size: 14px;
    font-weight: 600;
    color: var(--lw-text-primary);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

/* Success badge (ui/badge.tsx tone=success size=sm): 20px, 10/700 uppercase,
   radius 4, success tint pair, 12px check. */
[b-9vax1w7t2p] .bank-linked__badge {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    height: 20px;
    padding: 0 6px;
    border-radius: 4px;
    background: var(--lw-status-success-bg);
    color: var(--lw-status-success-fg);
    font-family: var(--lw-font-family);
    font-size: 10px;
    font-weight: 700;
    line-height: 1;
    text-transform: uppercase;
    letter-spacing: 0.025em;
}

[b-9vax1w7t2p] .bank-linked__badge svg {
    width: 12px;
    height: 12px;
    flex-shrink: 0;
}

[b-9vax1w7t2p] .bank-linked__sub {
    margin: 2px 0 0;
    font-family: var(--lw-font-family);
    font-size: 12px;
    color: var(--lw-gray-graphite);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}
/* _content/Ledgerwise/Components/Pages/Onboarding/Contractor/FoundingBuilderMou.razor.rz.scp.css */
/* ============================================================
   Founding Builder MOU onboarding page SHELL only, lifted verbatim from
   AccountAgreement.razor.css (the PAA page) so the MOU signs in the identical
   frame: centered document column, step header, fixed action bar. The document
   and sign block live in the shared components (FoundingBuilderMouDocument /
   Form5119SignBlock). No card wrapper: the sticky TOC rail needs an
   overflow-free ancestor chain up to the layout scroller.
   ============================================================ */

.aa-page[b-k5hmtqjs44] {
    /* Centered document column, mirroring the ledgerwise-ui wizard content. */
    box-sizing: border-box;
    width: 100%;
    max-width: 1000px;
    margin: 0 auto;
    padding: 8px 40px 96px; /* px-10 sides; bottom clears the fixed action bar */
}

/* ── Step header ── */
.aa-header[b-k5hmtqjs44] {
    margin-bottom: 24px;
}

.aa-header__title[b-k5hmtqjs44] {
    font-family: var(--lw-font-family-heading, inherit);
    font-size: 22px;
    font-weight: 700;
    letter-spacing: -0.01em;
    color: var(--lw-text-primary);
    margin: 0;
    line-height: 1.3;
}

.aa-header__sub[b-k5hmtqjs44] {
    margin: 6px 0 0;
    font-size: 0.875rem;
    line-height: 1.55;
    color: var(--lw-gray-graphite);
}

/* ── Document action bar (fixed footer) ── */
.aa-footer[b-k5hmtqjs44] {
    position: fixed;
    left: 260px;
    right: 0;
    bottom: 0;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    padding: 14px 32px;
    background: var(--lw-white);
    border-top: 1px solid var(--lw-border);
    z-index: 20;
}

.aa-footer__left[b-k5hmtqjs44],
.aa-footer__right[b-k5hmtqjs44] {
    display: flex;
    align-items: center;
    gap: 10px;
}

@media (max-width: 960px) {
    .aa-footer[b-k5hmtqjs44] {
        left: 0;
    }
}
/* _content/Ledgerwise/Components/Pages/Onboarding/Contractor/InsuranceVerification.razor.rz.scp.css */
/* Insurance step -- source: insurance-step-content.tsx (2026-07-13).
   Body p-8 (20 below md). Dropzone: 2px dashed, py-48/px-24, 48px grey-cloud
   circle w/ 20px upload glyph; drag state tints to the brand accent.
   File pill: muted wash, 40px accent-tint tile, name 14/500 + status 12.
   Sections: 12/700 uppercase heads, accent "Auto-filled" pill, 2-col field
   grids w/ 20px gaps, success "Active for N days" notes. */

[b-6b5qft67kb] .ins-body {
    padding: 32px;
}

[b-6b5qft67kb] .ins-note {
    margin-bottom: 16px;
}

/* Header action: Button variant=link -- accent 13/500 w/ 14px glyph. */
[b-6b5qft67kb] .ins-example-link {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    font-family: var(--lw-font-family);
    font-size: 13px;
    font-weight: 500;
    color: var(--lw-primary-blue);
    text-decoration: none;
}

[b-6b5qft67kb] .ins-example-link:hover {
    color: var(--lw-primary-blue);
    text-decoration: underline;
}

[b-6b5qft67kb] .ins-example-link svg {
    width: 14px;
    height: 14px;
    flex-shrink: 0;
}

@media (max-width: 640px) {
    [b-6b5qft67kb] .ins-example-link {
        display: none;
    }
}

/* -- Dropzone -- */
[b-6b5qft67kb] .ins-dropzone {
    display: flex;
    width: 100%;
    flex-direction: column;
    align-items: center;
    gap: 12px;
    padding: 48px 24px;
    border: 2px dashed var(--lw-border);
    border-radius: var(--lw-radius-card);
    background: color-mix(in srgb, var(--lw-bg-muted) 30%, transparent);
    text-align: center;
    cursor: pointer;
    transition: border-color 0.15s ease, background-color 0.15s ease;
}

[b-6b5qft67kb] .ins-dropzone:hover {
    border-color: color-mix(in srgb, var(--lw-primary-blue) 60%, transparent);
    background: color-mix(in srgb, var(--lw-primary-blue) 3%, transparent);
}

[b-6b5qft67kb] .ins-dropzone.is-dragging {
    border-color: var(--lw-primary-blue);
    background: color-mix(in srgb, var(--lw-primary-blue) 5%, transparent);
}

[b-6b5qft67kb] .ins-dropzone__circle {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 48px;
    height: 48px;
    border-radius: 9999px;
    background: var(--lw-gray-cloud);
    color: var(--lw-gray-graphite);
    transition: background-color 0.15s ease, color 0.15s ease;
}

[b-6b5qft67kb] .ins-dropzone.is-dragging .ins-dropzone__circle {
    background: color-mix(in srgb, var(--lw-primary-blue) 15%, transparent);
    color: var(--lw-primary-blue);
}

[b-6b5qft67kb] .ins-dropzone__circle svg {
    width: 20px;
    height: 20px;
}

[b-6b5qft67kb] .ins-dropzone__title {
    margin: 0;
    font-family: var(--lw-font-family);
    font-size: 14px;
    font-weight: 500;
    color: var(--lw-text-primary);
}

[b-6b5qft67kb] .ins-dropzone__hint {
    margin: 4px 0 0;
    font-family: var(--lw-font-family);
    font-size: 12px;
    color: var(--lw-gray-space);
}

/* -- Extracted state -- */
[b-6b5qft67kb] .ins-stack {
    display: flex;
    flex-direction: column;
    gap: 24px;
}

[b-6b5qft67kb] .ins-file {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    padding: 14px 16px;
    border: 1px solid var(--lw-border);
    border-radius: var(--lw-radius-card);
    background: color-mix(in srgb, var(--lw-bg-muted) 40%, transparent);
}

[b-6b5qft67kb] .ins-file__main {
    display: flex;
    align-items: center;
    gap: 12px;
    min-width: 0;
}

[b-6b5qft67kb] .ins-file__tile {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 40px;
    height: 40px;
    flex-shrink: 0;
    border-radius: var(--lw-radius-card);
    background: rgba(57, 128, 165, 0.08);
    color: var(--lw-primary-blue);
}

[b-6b5qft67kb] .ins-file__tile svg {
    width: 18px;
    height: 18px;
}

[b-6b5qft67kb] .ins-file__text {
    min-width: 0;
}

[b-6b5qft67kb] .ins-file__name {
    margin: 0;
    font-family: var(--lw-font-family);
    font-size: 14px;
    font-weight: 500;
    color: var(--lw-text-primary);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

[b-6b5qft67kb] .ins-file__status {
    margin: 0;
    font-family: var(--lw-font-family);
    font-size: 12px;
    color: var(--lw-gray-graphite);
}

[b-6b5qft67kb] .ins-reupload {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    flex-shrink: 0;
    padding: 6px 12px;
    border: 1px solid var(--lw-border);
    border-radius: var(--lw-radius-control);
    background: var(--lw-white);
    cursor: pointer;
    font-family: var(--lw-font-family);
    font-size: 12px;
    font-weight: 500;
    color: var(--lw-gray-graphite);
    transition: border-color 0.15s ease, color 0.15s ease;
}

[b-6b5qft67kb] .ins-reupload:hover {
    border-color: rgba(30, 30, 36, 0.2);
    color: var(--lw-text-primary);
}

[b-6b5qft67kb] .ins-reupload svg {
    width: 12px;
    height: 12px;
}

/* -- Sections -- */
[b-6b5qft67kb] .ins-section-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 8px;
    margin-bottom: 16px;
    flex-wrap: wrap;
}

[b-6b5qft67kb] .ins-section-title {
    margin: 0;
    font-family: var(--lw-font-family);
    font-size: 12px;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.025em;
    color: var(--lw-text-primary);
}

[b-6b5qft67kb] .ins-autofill {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 4px 10px;
    border: 1px solid rgba(57, 128, 165, 0.2);
    border-radius: 9999px;
    background: rgba(57, 128, 165, 0.05);
    font-family: var(--lw-font-family);
    font-size: 11px;
    font-weight: 500;
    color: var(--lw-primary-blue);
}

[b-6b5qft67kb] .ins-autofill svg {
    width: 12px;
    height: 12px;
}

[b-6b5qft67kb] .ins-grid {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 20px;
}

[b-6b5qft67kb] .ins-divider {
    margin: 0;
    border: 0;
    border-top: 1px solid var(--lw-border);
}

[b-6b5qft67kb] .ins-days-left {
    display: flex;
    align-items: center;
    gap: 4px;
    margin: 6px 0 0;
    font-family: var(--lw-font-family);
    font-size: 12px;
    color: var(--lw-success-dark);
}

[b-6b5qft67kb] .ins-days-left svg {
    width: 12px;
    height: 12px;
    flex-shrink: 0;
}

/* Exclude workers' comp toggle -- reference custom 20px checkbox; native
   input with accent-color renders the same brand-accent checked box. */
[b-6b5qft67kb] .ins-wc-toggle {
    display: flex;
    align-items: center;
    gap: 8px;
    cursor: pointer;
    user-select: none;
    font-family: var(--lw-font-family);
    font-size: 14px;
    color: var(--lw-text-primary);
}

[b-6b5qft67kb] .ins-wc-toggle input {
    width: 20px;
    height: 20px;
    margin: 0;
    cursor: pointer;
    accent-color: var(--lw-primary-blue);
}

@media (max-width: 768px) {
    [b-6b5qft67kb] .ins-body {
        padding: 20px;
    }

    [b-6b5qft67kb] .ins-grid {
        grid-template-columns: 1fr;
    }
}
/* _content/Ledgerwise/Components/Pages/Onboarding/Contractor/LicenseVerification.razor.rz.scp.css */
/* Contractor license step -- source: license-step-content.tsx (2026-07-13).
   Card body p-8 (16 below md); inner license card = white bordered radius-8
   panel: header px-5 py-4 w/ 14/600 truncating title over a hairline, fields
   region p-5 stacking 2-col grids with 20px gaps. */

[b-pbfknjhqpt] .lic-body {
    padding: 32px;
}

[b-pbfknjhqpt] .lic-error {
    margin-bottom: 16px;
}

[b-pbfknjhqpt] .lic-card {
    overflow: hidden;
    border: 1px solid var(--lw-border);
    border-radius: var(--lw-radius-card);
    background: var(--lw-white);
}

[b-pbfknjhqpt] .lic-card__header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    padding: 16px 20px;
    border-bottom: 1px solid var(--lw-border);
}

[b-pbfknjhqpt] .lic-card__title {
    margin: 0;
    min-width: 0;
    font-family: var(--lw-font-family);
    font-size: 14px;
    font-weight: 600;
    color: var(--lw-text-primary);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

[b-pbfknjhqpt] .lic-card__fields {
    display: flex;
    flex-direction: column;
    gap: 20px;
    padding: 20px;
}

[b-pbfknjhqpt] .lic-grid {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 20px;
}

@media (max-width: 768px) {
    [b-pbfknjhqpt] .lic-body {
        padding: 16px;
    }

    [b-pbfknjhqpt] .lic-card__header {
        padding: 16px;
    }

    [b-pbfknjhqpt] .lic-card__fields {
        padding: 16px;
    }

    [b-pbfknjhqpt] .lic-grid {
        grid-template-columns: 1fr;
    }
}
/* _content/Ledgerwise/Components/Pages/Onboarding/Contractor/PlatformFee.razor.rz.scp.css */
/* Subscription step -- source: gc-step-subscription.tsx (2026-07-13).
   Hero: navy->blue->burnt-orange gradient panel (m-20, radius 8, px-32 py-28)
   with gold/accent light blooms; headline 18/600 white; 2-col feature grid
   w/ gold 14px checks + 13px white/75 labels; gold 48px extrabold price with
   white/45 "/ year" and white/50 billing details over a white/10 hairline.
   Payment: 12/700 uppercase head, radio-card method grid (radio-card.tsx
   accent tone), 48px pay CTA. Paid: merged confirmation row w/ success tile
   + Active badge. */

/* The reference hero gradient is a scoped one-off (its source marks it as a
   token exception): navy -> deep blue -> brand blue -> burnt orange. */
[b-z0l35eeico] .pf-hero {
    position: relative;
    overflow: hidden;
    margin: 20px;
    padding: 28px 32px;
    border-radius: var(--lw-radius-card);
    background: linear-gradient(115deg, #020B2B 0%, #0E3E60 44%, #2F6F96 70%, #8A4F22 100%);
}

/* Atmospheric light blooms -- warm gold top-right, cool blue bottom-left. */
[b-z0l35eeico] .pf-hero::before,
[b-z0l35eeico] .pf-hero::after {
    content: "";
    position: absolute;
    border-radius: 9999px;
    filter: blur(48px);
    pointer-events: none;
}

[b-z0l35eeico] .pf-hero::before {
    top: -96px;
    right: -80px;
    width: 288px;
    height: 288px;
    background: color-mix(in srgb, var(--lw-primary-gold) 25%, transparent);
}

[b-z0l35eeico] .pf-hero::after {
    bottom: -96px;
    left: -64px;
    width: 256px;
    height: 256px;
    background: color-mix(in srgb, var(--lw-primary-blue) 25%, transparent);
}

[b-z0l35eeico] .pf-hero__layout {
    position: relative;
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 40px;
}

[b-z0l35eeico] .pf-hero__left {
    min-width: 0;
    flex: 1;
}

[b-z0l35eeico] .pf-hero__headline {
    margin: 0;
    max-width: 24rem;
    font-family: var(--lw-font-family);
    font-size: 18px;
    font-weight: 600;
    line-height: 1.375;
    color: var(--lw-white);
}

[b-z0l35eeico] .pf-hero__features {
    display: grid;
    grid-template-columns: repeat(2, auto);
    justify-content: start;
    column-gap: 32px;
    row-gap: 10px;
    margin-top: 20px;
}

[b-z0l35eeico] .pf-hero__feature {
    display: flex;
    align-items: center;
    gap: 8px;
}

[b-z0l35eeico] .pf-hero__feature svg {
    width: 14px;
    height: 14px;
    flex-shrink: 0;
    color: var(--lw-primary-gold);
}

[b-z0l35eeico] .pf-hero__feature span {
    font-family: var(--lw-font-family);
    font-size: 13px;
    color: rgba(255, 255, 255, 0.75);
    white-space: nowrap;
}

[b-z0l35eeico] .pf-hero__right {
    flex-shrink: 0;
    min-width: 180px;
    text-align: right;
}

[b-z0l35eeico] .pf-hero__price {
    display: flex;
    align-items: baseline;
    justify-content: flex-end;
    gap: 6px;
}

[b-z0l35eeico] .pf-hero__price-major {
    font-family: var(--lw-font-family);
    font-size: 48px;
    font-weight: 800;
    line-height: 1;
    letter-spacing: -0.025em;
    color: var(--lw-primary-gold);
}

[b-z0l35eeico] .pf-hero__price-minor {
    font-family: var(--lw-font-family);
    font-size: 20px;
    font-weight: 700;
    color: var(--lw-primary-gold);
}

[b-z0l35eeico] .pf-hero__price-period {
    font-family: var(--lw-font-family);
    font-size: 14px;
    font-weight: 500;
    color: rgba(255, 255, 255, 0.45);
}

[b-z0l35eeico] .pf-hero__details {
    margin-top: 16px;
    padding-top: 16px;
    border-top: 1px solid rgba(255, 255, 255, 0.1);
    display: flex;
    flex-direction: column;
    align-items: flex-end;
    gap: 8px;
}

[b-z0l35eeico] .pf-hero__detail {
    display: flex;
    align-items: center;
    gap: 6px;
}

[b-z0l35eeico] .pf-hero__detail svg {
    width: 12px;
    height: 12px;
    color: color-mix(in srgb, var(--lw-primary-gold) 60%, transparent);
}

[b-z0l35eeico] .pf-hero__detail span {
    font-family: var(--lw-font-family);
    font-size: 12px;
    color: rgba(255, 255, 255, 0.5);
}

/* -- Payment section -- */
[b-z0l35eeico] .pf-pay {
    display: flex;
    flex-direction: column;
    gap: 24px;
    padding: 24px 32px 32px;
}

[b-z0l35eeico] .pf-section-title {
    margin: 0;
    font-family: var(--lw-font-family);
    font-size: 12px;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.025em;
    color: var(--lw-text-primary);
}

/* Method radio cards (ui/radio-card.tsx, accent tone). */
[b-z0l35eeico] .pf-methods {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 12px;
}

[b-z0l35eeico] .pf-method {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 14px 16px;
    border: 1px solid var(--lw-border);
    border-radius: var(--lw-radius-card);
    background: var(--lw-white);
    cursor: pointer;
    text-align: left;
    transition: border-color 0.15s ease, background-color 0.15s ease;
}

[b-z0l35eeico] .pf-method:hover {
    border-color: color-mix(in srgb, var(--lw-primary-blue) 40%, transparent);
}

[b-z0l35eeico] .pf-method.is-selected {
    border-color: var(--lw-primary-blue);
    background: color-mix(in srgb, var(--lw-primary-blue) 4%, var(--lw-white));
}

[b-z0l35eeico] .pf-method__icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 40px;
    height: 40px;
    flex-shrink: 0;
    border-radius: var(--lw-radius-card);
    background: var(--lw-status-info-bg);
    color: var(--lw-primary-blue);
}

[b-z0l35eeico] .pf-method__icon .mud-icon-root {
    width: 20px;
    height: 20px;
    font-size: 20px;
}

[b-z0l35eeico] .pf-method__text {
    display: flex;
    flex-direction: column;
    min-width: 0;
    flex: 1;
}

[b-z0l35eeico] .pf-method__title {
    font-family: var(--lw-font-family);
    font-size: 14px;
    font-weight: 600;
    color: var(--lw-text-primary);
}

[b-z0l35eeico] .pf-method__sub {
    font-family: var(--lw-font-family);
    font-size: 12px;
    color: var(--lw-gray-graphite);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

/* Radio dot -- ring that fills with an inner dot when selected. */
[b-z0l35eeico] .pf-method__radio {
    width: 18px;
    height: 18px;
    flex-shrink: 0;
    box-sizing: border-box;
    border: 2px solid var(--lw-gray-smoke);
    border-radius: 9999px;
    transition: border-color 0.15s ease;
}

[b-z0l35eeico] .pf-method.is-selected .pf-method__radio {
    border-color: var(--lw-primary-blue);
    border-width: 5px;
}

/* Fee breakdown receipt (credit card). */
[b-z0l35eeico] .pf-cc {
    display: flex;
    flex-direction: column;
    gap: 16px;
}

[b-z0l35eeico] .pf-receipt {
    display: flex;
    flex-direction: column;
    gap: 6px;
    padding: 12px 16px;
    border-radius: var(--lw-radius-card);
    background: var(--lw-bg-muted);
    font-family: var(--lw-font-family);
    font-size: 13px;
    color: var(--lw-gray-graphite);
}

[b-z0l35eeico] .pf-receipt__row {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
}

[b-z0l35eeico] .pf-receipt__row--total {
    margin-top: 2px;
    font-weight: 600;
    color: var(--lw-text-primary);
}

[b-z0l35eeico] .pf-stripe-message {
    margin-top: 8px;
    font-family: var(--lw-font-family);
    font-size: 13px;
    color: var(--lw-status-error-fg);
}

[b-z0l35eeico] .pf-retry {
    margin-left: 8px;
    border: 0;
    background: none;
    padding: 0;
    cursor: pointer;
    font-family: var(--lw-font-family);
    font-size: 12px;
    font-weight: 600;
    color: var(--lw-status-error-fg);
    text-decoration: underline;
}

/* Pay CTA -- button.tsx size=auth: 48px navy, full width. */
[b-z0l35eeico] .pf-pay-cta {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    width: 100%;
    height: 48px;
    padding: 0 16px;
    border: 0;
    border-radius: var(--lw-radius-control);
    background: var(--lw-primary-dark);
    color: var(--lw-white);
    cursor: pointer;
    font-family: var(--lw-font-family);
    font-size: 14px;
    font-weight: 500;
    transition: background-color 0.15s ease;
}

[b-z0l35eeico] .pf-pay-cta:hover:not(:disabled) {
    background: var(--lw-primary-dark-hover);
}

[b-z0l35eeico] .pf-pay-cta:disabled {
    opacity: 0.55;
    cursor: default;
}

/* -- Paid confirmation row -- */
[b-z0l35eeico] .pf-active {
    display: flex;
    align-items: center;
    gap: 14px;
    padding: 14px 16px;
    border: 1px solid var(--lw-border);
    border-radius: var(--lw-radius-card);
    background: var(--lw-white);
}

[b-z0l35eeico] .pf-active__tile {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 44px;
    height: 44px;
    flex-shrink: 0;
    border-radius: var(--lw-radius-card);
    background: var(--lw-status-success-bg);
    color: var(--lw-status-success-fg);
}

[b-z0l35eeico] .pf-active__tile svg {
    width: 24px;
    height: 24px;
}

[b-z0l35eeico] .pf-active__text {
    min-width: 0;
    flex: 1;
}

[b-z0l35eeico] .pf-active__name-row {
    display: flex;
    align-items: center;
    gap: 8px;
    flex-wrap: wrap;
}

[b-z0l35eeico] .pf-active__name {
    margin: 0;
    font-family: var(--lw-font-family);
    font-size: 14px;
    font-weight: 600;
    color: var(--lw-text-primary);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

[b-z0l35eeico] .pf-active__badge {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    height: 20px;
    padding: 0 6px;
    border-radius: 4px;
    background: var(--lw-status-success-bg);
    color: var(--lw-status-success-fg);
    font-family: var(--lw-font-family);
    font-size: 10px;
    font-weight: 700;
    line-height: 1;
    text-transform: uppercase;
    letter-spacing: 0.025em;
}

[b-z0l35eeico] .pf-active__badge svg {
    width: 12px;
    height: 12px;
}

[b-z0l35eeico] .pf-active__sub {
    margin: 2px 0 0;
    font-family: var(--lw-font-family);
    font-size: 12px;
    color: var(--lw-gray-graphite);
}

/* -- Responsive -- */
@media (max-width: 960px) {
    [b-z0l35eeico] .pf-hero {
        margin: 16px;
        padding: 24px;
    }

    [b-z0l35eeico] .pf-hero__layout {
        flex-direction: column;
        gap: 24px;
    }

    [b-z0l35eeico] .pf-hero__features {
        grid-template-columns: 1fr;
    }

    [b-z0l35eeico] .pf-hero__feature span {
        white-space: normal;
    }

    [b-z0l35eeico] .pf-hero__right {
        text-align: left;
    }

    [b-z0l35eeico] .pf-hero__price {
        justify-content: flex-start;
    }

    [b-z0l35eeico] .pf-hero__details {
        align-items: flex-start;
    }

    [b-z0l35eeico] .pf-hero__price-major {
        font-size: 36px;
    }

    [b-z0l35eeico] .pf-pay {
        padding: 20px;
    }

    [b-z0l35eeico] .pf-methods {
        grid-template-columns: 1fr;
    }
}
/* _content/Ledgerwise/Components/Pages/Onboarding/Contractor/Welcome.razor.rz.scp.css */
/* Contractor onboarding Welcome -- source: gc-step-welcome.tsx +
   kickoff/step-header.tsx + ui/badge.tsx (2026-07-13).
   Header: 22/700 tracking-tight title, 14 relaxed graphite sub, 24px below.
   Cards: 3-col grid gap 16; radius 8, --lw-border, white, --lw-shadow-card,
   centered text; illustration area 240px (200 below md) with muted wash and
   a neutral time badge top-right; text pad 20 (16 top), title 14/600,
   desc 13/1.625 graphite. Looping framer-motion illustrations are ported as
   CSS keyframe loops on the same beats (4.5s / 5s cycles). */

.obw-header[b-9iq3dnve4j] {
    margin-bottom: 24px;
}

.obw-title[b-9iq3dnve4j] {
    margin: 0;
    font-family: var(--lw-font-family);
    font-size: 22px;
    font-weight: 700;
    letter-spacing: -0.025em;
    color: var(--lw-text-primary);
}

.obw-sub[b-9iq3dnve4j] {
    margin: 6px 0 0;
    font-family: var(--lw-font-family);
    font-size: 14px;
    line-height: 1.625;
    color: var(--lw-gray-graphite);
}

.obw-grid[b-9iq3dnve4j] {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 16px;
}

@media (max-width: 960px) {
    .obw-grid[b-9iq3dnve4j] {
        grid-template-columns: 1fr;
    }
}

/* Card enters with the reference's fade/rise stagger (delays inline). */
@keyframes obw-card-in-b-9iq3dnve4j {
    from { opacity: 0; transform: translateY(16px); }
    to { opacity: 1; transform: translateY(0); }
}

.obw-card[b-9iq3dnve4j] {
    display: flex;
    flex-direction: column;
    overflow: hidden;
    border: 1px solid var(--lw-border);
    border-radius: var(--lw-radius-card);
    background: var(--lw-white);
    box-shadow: var(--lw-shadow-card);
    text-align: center;
    transition: border-color 0.15s ease;
    animation: obw-card-in-b-9iq3dnve4j 0.4s ease-out both;
}

.obw-card:hover[b-9iq3dnve4j] {
    border-color: rgba(30, 30, 36, 0.15);
}

.obw-illo[b-9iq3dnve4j] {
    position: relative;
    height: 240px;
    width: 100%;
    border-bottom: 1px solid var(--lw-border);
}

@media (max-width: 960px) {
    .obw-illo[b-9iq3dnve4j] {
        height: 200px;
    }
}

/* Neutral time badge (ui/badge.tsx md): 24px, 11/700 uppercase, radius 4. */
.obw-badge[b-9iq3dnve4j] {
    position: absolute;
    top: 12px;
    right: 12px;
    z-index: 1;
    display: inline-flex;
    align-items: center;
    gap: 6px;
    height: 24px;
    padding: 0 6px;
    border-radius: 4px;
    background: var(--lw-status-neutral-bg);
    color: var(--lw-status-neutral-fg);
    font-family: var(--lw-font-family);
    font-size: 11px;
    font-weight: 700;
    line-height: 1;
    text-transform: uppercase;
    letter-spacing: 0.025em;
    white-space: nowrap;
    box-shadow: 0 1px 2px rgba(2, 11, 43, 0.05);
}

.obw-badge svg[b-9iq3dnve4j] {
    width: 12px;
    height: 12px;
    flex-shrink: 0;
}

/* Muted illustration wash holding the mini preview card. */
.obw-scene[b-9iq3dnve4j] {
    display: flex;
    height: 100%;
    align-items: center;
    justify-content: center;
    overflow: hidden;
    background: color-mix(in srgb, var(--lw-bg-muted) 50%, transparent);
    padding: 20px;
}

.obw-mini[b-9iq3dnve4j] {
    width: 82%;
    border: 1px solid var(--lw-border);
    border-radius: var(--lw-radius-card);
    background: var(--lw-white);
    padding: 12px;
    box-shadow: 0 1px 2px rgba(2, 11, 43, 0.05);
    text-align: left;
}

/* Shared bits */
.obw-grad-tile[b-9iq3dnve4j] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 24px;
    height: 24px;
    flex-shrink: 0;
    border-radius: 6px;
    background: linear-gradient(135deg, var(--lw-primary-blue) 0%, var(--lw-primary-blue-light) 50%, var(--lw-primary-gold) 100%);
    color: var(--lw-white);
}

.obw-grad-tile svg[b-9iq3dnve4j] {
    width: 14px;
    height: 14px;
}

.obw-name-bar[b-9iq3dnve4j] {
    display: inline-block;
    height: 8px;
    width: 64px;
    border-radius: 9999px;
    background: color-mix(in srgb, var(--lw-primary-blue) 20%, transparent);
}

/* -- Business illustration (4.5s cycle): fields fill, then gold verify. -- */
.obw-biz-head[b-9iq3dnve4j] {
    display: flex;
    align-items: center;
    gap: 8px;
}

.obw-field[b-9iq3dnve4j] {
    display: flex;
    align-items: center;
    height: 20px;
    margin-top: 10px;
    overflow: hidden;
    border: 1px solid var(--lw-border);
    border-radius: 6px;
    background: color-mix(in srgb, var(--lw-bg-muted) 40%, transparent);
    padding: 0 8px;
}

.obw-field-fill[b-9iq3dnve4j] {
    height: 6px;
    border-radius: 9999px;
    background: var(--lw-primary-blue);
    width: 0;
}

.obw-field-fill--1[b-9iq3dnve4j] {
    animation: obw-fill-1-b-9iq3dnve4j 4.5s ease-in-out infinite;
}

.obw-field-fill--2[b-9iq3dnve4j] {
    animation: obw-fill-2-b-9iq3dnve4j 4.5s ease-in-out infinite;
}

@keyframes obw-fill-1-b-9iq3dnve4j {
    0%, 12% { width: 0; }
    30%, 86% { width: 52px; }
    96%, 100% { width: 0; }
}

@keyframes obw-fill-2-b-9iq3dnve4j {
    0%, 34% { width: 0; }
    52%, 86% { width: 68px; }
    96%, 100% { width: 0; }
}

.obw-verify[b-9iq3dnve4j] {
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center;
    height: 24px;
    margin-top: 10px;
    overflow: hidden;
    border-radius: 6px;
    background: color-mix(in srgb, var(--lw-primary-blue) 10%, transparent);
}

.obw-verify-gold[b-9iq3dnve4j] {
    position: absolute;
    inset: 0;
    border-radius: 6px;
    background: var(--lw-primary-gold);
    opacity: 0;
    animation: obw-verify-flash-b-9iq3dnve4j 4.5s linear infinite;
}

@keyframes obw-verify-flash-b-9iq3dnve4j {
    0%, 68% { opacity: 0; }
    72%, 90% { opacity: 1; }
    97%, 100% { opacity: 0; }
}

.obw-verify-shield[b-9iq3dnve4j] {
    position: relative;
    width: 14px;
    height: 14px;
    color: var(--lw-primary-gold-fg);
    opacity: 0;
    animation: obw-shield-pop-b-9iq3dnve4j 4.5s ease-out infinite;
}

@keyframes obw-shield-pop-b-9iq3dnve4j {
    0%, 70% { opacity: 0; transform: scale(0.6); }
    74%, 90% { opacity: 1; transform: scale(1); }
    97%, 100% { opacity: 0; transform: scale(1); }
}

/* -- Credentials illustration (5s cycle): doc lines + stamping seal. -- */
.obw-doc-line[b-9iq3dnve4j] {
    height: 6px;
    border-radius: 9999px;
    background: rgba(30, 30, 36, 0.07);
    margin-top: 6px;
}

.obw-doc-line--lead[b-9iq3dnve4j] {
    margin-top: 0;
    width: 66%;
    background: color-mix(in srgb, var(--lw-primary-blue) 20%, transparent);
}

.obw-seal-row[b-9iq3dnve4j] {
    display: flex;
    justify-content: center;
    margin-top: 12px;
}

.obw-seal[b-9iq3dnve4j] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 40px;
    height: 40px;
    border-radius: 9999px;
    background: linear-gradient(135deg, var(--lw-primary-blue) 0%, var(--lw-primary-blue-light) 50%, var(--lw-primary-gold) 100%);
    color: var(--lw-white);
    animation: obw-seal-stamp-b-9iq3dnve4j 5s ease-out infinite;
}

.obw-seal svg[b-9iq3dnve4j] {
    width: 20px;
    height: 20px;
}

@keyframes obw-seal-stamp-b-9iq3dnve4j {
    0%, 32% { opacity: 0; transform: scale(0.4) rotate(-14deg); }
    52% { opacity: 1; transform: scale(1.05) rotate(2deg); }
    56%, 86% { opacity: 1; transform: scale(1) rotate(0deg); }
    97%, 100% { opacity: 0; transform: scale(0.4) rotate(-14deg); }
}

/* -- Payout illustration (5s cycle): bank tile drops, bar fills, plan check. -- */
.obw-payout-head[b-9iq3dnve4j] {
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.obw-bank-tile[b-9iq3dnve4j] {
    animation: obw-bank-drop-b-9iq3dnve4j 5s ease-out infinite;
}

@keyframes obw-bank-drop-b-9iq3dnve4j {
    0% { opacity: 0; transform: translateY(-10px); }
    20%, 85% { opacity: 1; transform: translateY(0); }
    95%, 100% { opacity: 0; transform: translateY(-10px); }
}

.obw-connect[b-9iq3dnve4j] {
    height: 8px;
    margin-top: 12px;
    overflow: hidden;
    border-radius: 9999px;
    background: rgba(30, 30, 36, 0.08);
}

.obw-connect-fill[b-9iq3dnve4j] {
    display: block;
    height: 100%;
    border-radius: 9999px;
    background: linear-gradient(135deg, var(--lw-primary-blue) 0%, var(--lw-primary-blue-light) 50%, var(--lw-primary-gold) 100%);
    width: 0;
    animation: obw-connect-fill-b-9iq3dnve4j 5s ease-in-out infinite;
}

@keyframes obw-connect-fill-b-9iq3dnve4j {
    0%, 22% { width: 0; }
    60%, 85% { width: 100%; }
    96%, 100% { width: 0; }
}

.obw-plan[b-9iq3dnve4j] {
    display: flex;
    align-items: center;
    gap: 6px;
    margin-top: 12px;
}

.obw-plan-check[b-9iq3dnve4j] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 14px;
    height: 14px;
    border-radius: 9999px;
    background: var(--lw-primary-gold);
    color: var(--lw-primary-gold-fg);
    opacity: 0;
    animation: obw-plan-pop-b-9iq3dnve4j 5s ease-out infinite;
}

.obw-plan-check svg[b-9iq3dnve4j] {
    width: 8px;
    height: 8px;
}

@keyframes obw-plan-pop-b-9iq3dnve4j {
    0%, 66% { opacity: 0; transform: scale(0.6); }
    72%, 90% { opacity: 1; transform: scale(1); }
    97%, 100% { opacity: 0; transform: scale(1); }
}

.obw-plan-bar[b-9iq3dnve4j] {
    display: inline-block;
    height: 6px;
    width: 48px;
    border-radius: 9999px;
    background: color-mix(in srgb, var(--lw-primary-blue) 20%, transparent);
    opacity: 0;
    animation: obw-plan-bar-b-9iq3dnve4j 5s linear infinite;
}

@keyframes obw-plan-bar-b-9iq3dnve4j {
    0%, 66% { opacity: 0; }
    74%, 90% { opacity: 1; }
    97%, 100% { opacity: 0; }
}

/* Card text block */
.obw-card-text[b-9iq3dnve4j] {
    display: flex;
    flex: 1;
    flex-direction: column;
    padding: 16px 20px 20px;
}

.obw-card-title[b-9iq3dnve4j] {
    margin: 0;
    font-family: var(--lw-font-family);
    font-size: 14px;
    font-weight: 600;
    color: var(--lw-text-primary);
}

.obw-card-desc[b-9iq3dnve4j] {
    margin: 6px 0 0;
    font-family: var(--lw-font-family);
    font-size: 13px;
    line-height: 1.625;
    color: var(--lw-gray-graphite);
}

@media (prefers-reduced-motion: reduce) {
    .obw-card[b-9iq3dnve4j],
    .obw-field-fill[b-9iq3dnve4j],
    .obw-verify-gold[b-9iq3dnve4j],
    .obw-verify-shield[b-9iq3dnve4j],
    .obw-seal[b-9iq3dnve4j],
    .obw-bank-tile[b-9iq3dnve4j],
    .obw-connect-fill[b-9iq3dnve4j],
    .obw-plan-check[b-9iq3dnve4j],
    .obw-plan-bar[b-9iq3dnve4j] {
        animation: none;
        opacity: 1;
    }

    .obw-field-fill--1[b-9iq3dnve4j] { width: 52px; }
    .obw-field-fill--2[b-9iq3dnve4j] { width: 68px; }
    .obw-connect-fill[b-9iq3dnve4j] { width: 100%; }
}
/* _content/Ledgerwise/Components/Pages/Onboarding/SubContractor/PreliminaryNotice.razor.rz.scp.css */
/* PreliminaryNotice (sub onboarding; route hidden behind the provider flag).
   NO ledgerwise-app reference exists: the reference removed the
   preliminary-notice step from SUB_STEPS (only the Gavel icon mapping remains
   in onboarding-step-nav.tsx). Token-styled onto the shared control-card +
   lw-table vocabulary instead (FoundingBuilderMou precedent), 2026-07-28.
   Layout only -- chrome lives in the card atoms and lw-table.css. */

/* -- Section: uppercase micro-title above the table (ins-section-title recipe) -- */
[b-rbfvij64oi] .pn-section {
    display: flex;
    flex-direction: column;
    gap: 12px;
}

[b-rbfvij64oi] .pn-section-title {
    margin: 0;
    font-family: var(--lw-font-family);
    font-size: 12px;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.025em;
    color: var(--lw-text-primary);
}

/* -- Table card: rounded-card border white shell (pt-table-card recipe) -- */
[b-rbfvij64oi] .pn-table-card {
    overflow-x: auto;
    border: 1px solid var(--lw-border);
    border-radius: var(--lw-radius-card);
    background: var(--lw-white);
    box-shadow: var(--lw-shadow-card);
}

[b-rbfvij64oi] .pn-table-card .lw-table {
    min-width: 760px;
}

/* Rows are not clickable on this page (row action button instead). */
[b-rbfvij64oi] .pn-table-card .lw-table-tr {
    cursor: default;
}

/* Column widths; project/builder share extra space, action is fixed. */
[b-rbfvij64oi] .pn-col-project { flex: 1.2 1 210px; }
[b-rbfvij64oi] .pn-col-builder { flex: 1 1 210px; }
[b-rbfvij64oi] .pn-col-elig    { flex: 0 0 170px; }
[b-rbfvij64oi] .pn-col-action  { flex: 0 0 190px; }

/* Two-line project cell: name + muted address sub-line (list-row idiom). */
[b-rbfvij64oi] .pn-project {
    display: flex;
    flex-direction: column;
    gap: 2px;
    min-width: 0;
}

[b-rbfvij64oi] .pn-project-name {
    font-weight: var(--lw-font-medium);
    color: var(--lw-text-primary);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

[b-rbfvij64oi] .pn-project-addr {
    font-size: 12px;
    line-height: 16px;
    color: var(--lw-gray-graphite);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

/* Keep the row action label on one line. */
[b-rbfvij64oi] .pn-col-action .lw-button-native {
    white-space: nowrap;
}

/* Eligibility cell can carry two chips. */
[b-rbfvij64oi] .pn-chips {
    display: flex;
    align-items: center;
    gap: 6px;
    flex-wrap: wrap;
}
/* _content/Ledgerwise/Components/Pages/Organization/MyOrganization.razor.rz.scp.css */
/* ============================================================
   My Organization -- hero header + underline tab bar over a
   muted content zone. Source: ledgerwise-ui-app
   src/components/organisms/gc/gc-organization.tsx (+ molecules
   profile-hero-header / tab-bar / section-card / profile-detail-card),
   measured live 2026-07-28: white header zone px-24 pt-20, tabs
   mt-16 gap-24 h-40 14/500 w/ 2px foreground underline, content
   zone bg-muted p-24 gap-20; field labels 12/500 muted-fg,
   values 14/500 foreground; edit ghost button 13/500.
   Tab chrome mirrors the approved Project.razor.css recipe.
   ============================================================ */

/* Shell: escape the layout's pa-6 so the muted zone and the white
   header bleed edge-to-edge (same recipe as .lw-page-shell). */
.org-shell[b-4adck8mqlg] {
    display: flex;
    flex-direction: column;
    margin: -24px;
    min-height: calc(100% + 48px);
    background: var(--lw-bg-muted);
}

/* White identity zone above the tab strip (reference: bg-background
   px-4 sm:px-6 pt-5; the 16px gap below the hero is painted by the
   tabbar's own white top padding). */
.org-head-zone[b-4adck8mqlg] {
    background: var(--lw-white);
    padding: 20px 24px 0;
}

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

.org-header[b-4adck8mqlg] {
    display: flex;
    align-items: center;
    gap: 1rem;
}

/* Logo drop zone: the MudFileUpload input stretches transparently over the whole
   zone (see InputClass in the markup), so clicking anywhere browses and dropping
   an image uploads it. The remove button sits above the input (z-index 30 > 20). */
.org-avatar-zone[b-4adck8mqlg] {
    position: relative;
    display: inline-flex;
    flex-shrink: 0;
}

.org-avatar-zone[b-4adck8mqlg]  .org-avatar-upload {
    margin: 0;
}

.org-avatar--dragover[b-4adck8mqlg] {
    outline: 2px dashed var(--lw-primary-blue);
    outline-offset: 2px;
}

/* Always-visible camera badge so adding a logo is discoverable without hovering.
   The hover scrim (org-avatar__overlay) renders after it and covers it. */
.org-avatar__badge[b-4adck8mqlg] {
    position: absolute;
    right: 3px;
    bottom: 3px;
    width: 18px;
    height: 18px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    background-color: var(--lw-primary-blue);
}

.org-avatar__badge[b-4adck8mqlg]  .mud-icon-root {
    font-size: 0.7rem;
    color: #ffffff;
}

.org-avatar-zone__remove[b-4adck8mqlg] {
    position: absolute;
    top: -6px;
    right: -6px;
    z-index: 30;
    width: 20px;
    height: 20px;
    padding: 0;
    border-radius: 50%;
    border: 1px solid var(--lw-border);
    background-color: #ffffff;
    color: var(--lw-gray-graphite);
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    box-shadow: var(--lw-shadow-card);
    opacity: 0;
    transition: opacity 0.15s ease;
}

.org-avatar-zone:hover .org-avatar-zone__remove[b-4adck8mqlg],
.org-avatar-zone:focus-within .org-avatar-zone__remove[b-4adck8mqlg] {
    opacity: 1;
}

.org-avatar-zone__remove:hover[b-4adck8mqlg] {
    color: var(--lw-status-error-fg);
}

.org-avatar-zone__remove[b-4adck8mqlg]  .mud-icon-root {
    font-size: 0.8rem;
    width: 0.8rem;
    height: 0.8rem;
}

.org-avatar[b-4adck8mqlg] {
    position: relative;
    /* Fixed height; width grows with the logo's aspect ratio so the whole
       image is visible (square for the initials fallback). */
    height: 56px;
    width: auto;
    min-width: 56px;
    max-width: 200px;
    flex-shrink: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    overflow: hidden;
    background-color: var(--lw-primary-dark);
    color: #ffffff;
    border-radius: 8px;
}

/* Editable avatar: dark scrim + camera icon revealed on hover/focus. */
.org-avatar--editable[b-4adck8mqlg] {
    cursor: pointer;
}

.org-avatar__overlay[b-4adck8mqlg] {
    position: absolute;
    inset: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    background-color: rgba(0, 0, 0, 0.55);
    opacity: 0;
    transition: opacity 0.2s ease;
    pointer-events: none;
}

.org-avatar__overlay[b-4adck8mqlg]  .mud-icon-root {
    font-size: 1.25rem;
    color: #ffffff;
}

.org-avatar__overlay[b-4adck8mqlg]  .mud-progress-circular {
    color: #ffffff;
}

.org-avatar--editable:hover .org-avatar__overlay[b-4adck8mqlg],
.org-avatar--editable:focus-visible .org-avatar__overlay[b-4adck8mqlg],
.org-avatar__overlay--visible[b-4adck8mqlg] {
    opacity: 1;
}

.org-avatar__img[b-4adck8mqlg] {
    height: 100%;
    width: auto;
    max-width: 100%;
    object-fit: contain;
    display: block;
}

.org-avatar__initials[b-4adck8mqlg] {
    font-size: 1.25rem;
    font-weight: 600;
    line-height: 1;
    text-transform: uppercase;
}

.org-header__info[b-4adck8mqlg] {
    display: flex;
    flex-direction: column;
    gap: 0.375rem;
    min-width: 0;
    flex: 1;
}

/* Contact line with the org-type / access-level pills beside the name
   (moved off the title row, Cody 2026-07-28). */
.org-header__contact-row[b-4adck8mqlg] {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    flex-wrap: wrap;
    min-width: 0;
}

/* Reference h1: text-[22px] font-bold leading-8 tracking-tight
   text-foreground -- same recipe as .lw-page-title. */
.org-header__name[b-4adck8mqlg] {
    font-family: var(--lw-font-family);
    font-size: var(--lw-title-size);
    font-weight: var(--lw-title-weight);
    line-height: 2rem;
    letter-spacing: var(--lw-tracking-tight);
    color: var(--lw-title-color);
    margin: 0;
}

.org-header__contact[b-4adck8mqlg] {
    font-size: 0.875rem;
    color: var(--lw-gray-graphite);
    margin: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

/* --- Tab strip (Project.razor.css recipe, org gap of 24px) -- */

.org-tabs[b-4adck8mqlg] {
    display: flex;
    flex-direction: column;
    flex: 1;
}

.org-tabs[b-4adck8mqlg]  .mud-tabs,
.org-tabs[b-4adck8mqlg]  .mud-tabs-tabbar-inner,
.org-tabs[b-4adck8mqlg]  .mud-tabs-tabbar-content,
.org-tabs[b-4adck8mqlg]  .mud-tabs-tabbar-wrapper {
    background-color: transparent !important;
}

/* The tab strip continues the white header zone: 16px white gap above the
   tabs (reference mt-4 inside bg-background) painted as top padding here. */
.org-tabs[b-4adck8mqlg]  .mud-tabs-tabbar {
    background-color: var(--lw-white) !important;
    border-bottom: 1px solid var(--lw-border);
    border-top: none;
    border-left: none;
    border-right: none;
    flex-shrink: 0;
    box-shadow: none;
    border-radius: 0;
    margin: 0;
    padding: 16px 24px 0;
}

.org-tabs[b-4adck8mqlg]  .mud-tabs-tabbar-inner {
    min-height: 40px;
    overflow-x: auto;
    scrollbar-width: none;
}

.org-tabs[b-4adck8mqlg]  .mud-tabs-tabbar-inner::-webkit-scrollbar {
    display: none;
}

/* Reference tabs are content-sized (shrink-0); Mud's default 160px box
   spreads them across the bar. !important because Mud's width rules win. */
.org-tabs[b-4adck8mqlg]  .mud-tab {
    text-transform: none;
    font-size: 14px;
    font-weight: 500;
    color: var(--lw-gray-graphite);
    min-height: 40px;
    min-width: 0 !important;
    width: auto !important;
    flex: 0 0 auto;
    padding: 0;
    letter-spacing: 0;
    line-height: 1;
}

/* 24px between tabs = reference gap-6 on the org/profile TabBar. Gap on the
   flex wrapper (the tabs' actual parent) -- margins on .mud-tab lose to Mud. */
.org-tabs[b-4adck8mqlg]  .mud-tabs-tabbar-wrapper {
    gap: 24px;
}

.org-tabs[b-4adck8mqlg]  .mud-tab,
.org-tabs[b-4adck8mqlg]  .mud-tab:hover,
.org-tabs[b-4adck8mqlg]  .mud-tab.mud-tab-active,
.org-tabs[b-4adck8mqlg]  .mud-tab.mud-tab-active:hover {
    background-color: transparent !important;
}

/* Reference tab states: inactive content-secondary; hover AND active are
   foreground (#1E1E24, NOT navy); weight stays 500 in every state. */
.org-tabs[b-4adck8mqlg]  .mud-tab:hover {
    color: var(--lw-text-primary);
}

.org-tabs[b-4adck8mqlg]  .mud-tab.mud-tab-active {
    color: var(--lw-text-primary);
}

/* Active-tab indicator -- 2px foreground bar spanning exactly the tab.
   Mud's JS-measured slider drifts against content-sized tabs + wrapper gap,
   so it is disabled and the bar is drawn as an inset box-shadow (::after on
   .mud-tab does not paint; see Project.razor.css). */
.org-tabs[b-4adck8mqlg]  .mud-tab-slider {
    display: none;
}

.org-tabs[b-4adck8mqlg]  .mud-tab.mud-tab-active {
    box-shadow: inset 0 -2px 0 var(--lw-text-primary);
}

.org-tabs[b-4adck8mqlg]  .mud-tabs-scroll-button {
    display: none;
}

/* Panels container: muted zone flush against the tab line (reference content
   zone: bg-muted p-6). PanelClass lands on this same element, so the padding
   lives here; !important out-specifies Mud's own paints. */
.org-tabs[b-4adck8mqlg]  .mud-tabs-panels {
    background-color: var(--lw-bg-muted) !important;
    margin: 0 !important;
    padding: 24px !important;
}

/* --- Tab content layout ----------------------------------- */

.org-tab-content[b-4adck8mqlg] {
    display: flex;
    flex-direction: column;
    gap: 1.25rem;
}

/* --- Read-mode field grid --------------------------------- */

.org-field-grid[b-4adck8mqlg] {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 1rem 2rem;
}

.org-field[b-4adck8mqlg] {
    display: flex;
    flex-direction: column;
    gap: 0.25rem;
    min-width: 0;
}

.org-field--full[b-4adck8mqlg] {
    grid-column: 1 / -1;
}

/* Reference labels are text-xs font-medium text-muted-foreground (#9DA2B3);
   values text-sm font-medium text-foreground, em-dash when empty. */
.org-field__label[b-4adck8mqlg] {
    font-size: 0.75rem;
    font-weight: 500;
    line-height: 1rem;
    color: var(--lw-gray-space);
}

.org-field__value[b-4adck8mqlg] {
    font-size: 0.875rem;
    font-weight: 500;
    line-height: 1.25rem;
    color: var(--lw-text-primary);
    overflow-wrap: anywhere;
}

/* --- Edit-mode form layout -------------------------------- */

/* Reference edit grid: grid-cols-2 gap-x-6 gap-y-4. Stacked fields keep
   the same 16px rhythm. */
.org-form[b-4adck8mqlg] {
    display: flex;
    flex-direction: column;
    gap: 1rem;
}

.org-grid2[b-4adck8mqlg] {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 1rem 1.5rem;
}

.org-grid3[b-4adck8mqlg] {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 1rem 1.5rem;
}

/* Muted helper line under a field (no FieldShell helper slot in the
   reference; kept for the builder email-slug explainer). */
.org-form-hint[b-4adck8mqlg] {
    margin: -0.5rem 0 0;
    font-size: 0.75rem;
    line-height: 1rem;
    color: var(--lw-gray-graphite);
}

/* Reference action row: col-span-2 flex justify-end gap-3 border-t pt-4. */
.org-edit-actions[b-4adck8mqlg] {
    display: flex;
    justify-content: flex-end;
    gap: 0.75rem;
    margin-top: 1rem;
    padding-top: 1rem;
    border-top: 1px solid var(--lw-border);
}

/* --- Members role chip (inline dropdown) ------------------ */

.org-role-chip[b-4adck8mqlg] {
    display: inline-flex;
    align-items: center;
    gap: 0.125rem;
    border-radius: 4px;
    padding: 0.125rem 0.25rem 0.125rem 0.5rem;
    font-size: 0.6875rem; /* 11px */
    font-weight: 700;
    line-height: 1.4;
    letter-spacing: 0.03em;
    text-transform: uppercase;
    cursor: pointer;
    white-space: nowrap;
}

.org-role-chip--readonly[b-4adck8mqlg] {
    cursor: default;
    padding-right: 0.5rem;
}

.org-role-chip__caret[b-4adck8mqlg] {
    font-size: 0.875rem !important;
    width: 0.875rem;
    height: 0.875rem;
}

.org-role-chip--Admin[b-4adck8mqlg] {
    background-color: var(--lw-status-info-bg);
    color: var(--lw-status-info-fg);
}

.org-role-chip--ProjectManager[b-4adck8mqlg] {
    background-color: var(--lw-status-success-bg);
    color: var(--lw-status-success-fg);
}

.org-role-chip--Member[b-4adck8mqlg] {
    background-color: var(--lw-status-neutral-bg);
    color: var(--lw-status-neutral-fg);
}

/* Client (Project Owner) org roles */
.org-role-chip--Owner[b-4adck8mqlg] {
    background-color: var(--lw-status-info-bg);
    color: var(--lw-status-info-fg);
}

.org-role-chip--ProjectContributor[b-4adck8mqlg] {
    background-color: var(--lw-status-neutral-bg);
    color: var(--lw-status-neutral-fg);
}

/* --- Tables (lw-table inside a flush section card) -------- */

/* Org tables measured at 12x20 cells (reference px-5 py-3) vs the list-page
   default of 12x16; rows are not clickable here. */
.org-table .lw-table-th[b-4adck8mqlg],
.org-table .lw-table-td[b-4adck8mqlg] {
    padding: 12px 20px;
}

.org-table .lw-table-tr[b-4adck8mqlg] {
    cursor: default;
}

/* Clickable-row tables (insurance -> document sheet). */
.org-table--click .lw-table-tr[b-4adck8mqlg] {
    cursor: pointer;
}

/* Trailing chevron affordance on clickable rows (56px gutter, no header text). */
.org-col--chevron[b-4adck8mqlg] {
    flex: 0 0 56px;
    display: flex;
    align-items: center;
    justify-content: flex-end;
}

.org-col--chevron[b-4adck8mqlg]  .mud-icon-root {
    color: var(--lw-gray-space);
    font-size: 20px;
    width: 20px;
    height: 20px;
    transition: color 0.15s ease;
}

.org-table--click .lw-table-tr:hover .org-col--chevron[b-4adck8mqlg]  .mud-icon-root {
    color: var(--lw-gray-graphite);
}

/* Single-line cells with ellipsis (provider names). */
.org-truncate[b-4adck8mqlg] {
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.org-col[b-4adck8mqlg] {
    flex: 1;
    min-width: 0;
}

.org-col--lg[b-4adck8mqlg] {
    flex: 1.6;
}

.org-col--sm[b-4adck8mqlg] {
    flex: 0.8;
}

.org-col--actions[b-4adck8mqlg] {
    flex: 0 0 88px;
    display: flex;
    align-items: center;
    justify-content: flex-end;
}

/* Cells that stack a chip next to text. */
.org-cell-gap[b-4adck8mqlg] {
    gap: 0.5rem;
}

/* Bold green amount cell (payment history). */
.org-amount[b-4adck8mqlg] {
    font-weight: 700;
    color: var(--lw-status-success-fg);
}

/* Destructive-leaning icon button (remove certification). */
.org-kebab--danger:hover[b-4adck8mqlg] {
    background: var(--lw-status-error-bg);
    color: var(--lw-status-error-fg);
}

/* Member identity cell: 36px avatar + name/email stack (measured:
   name 14/500 foreground, email 12/400 muted-fg). */
.org-member-cell[b-4adck8mqlg] {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    min-width: 0;
}

.org-member-cell__text[b-4adck8mqlg] {
    display: flex;
    flex-direction: column;
    min-width: 0;
}

.org-member-cell__name[b-4adck8mqlg] {
    font-size: 0.875rem;
    font-weight: 500;
    line-height: 1.25rem;
    color: var(--lw-text-primary);
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.org-member-cell__email[b-4adck8mqlg] {
    font-size: 0.75rem;
    line-height: 1rem;
    color: var(--lw-gray-space);
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

/* Project line under the role chip for project-scoped client users (US-665). */
.org-member-project[b-4adck8mqlg] {
    display: block;
    margin-top: 2px;
    font-size: 0.75rem;
    line-height: 1rem;
    color: var(--lw-gray-graphite);
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

/* Table empty / loading states inside flush card bodies. */
.org-table-state[b-4adck8mqlg] {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 0.5rem;
    padding: 2.5rem 1.5rem;
    text-align: center;
}

.org-table-state[b-4adck8mqlg]  .mud-icon-root {
    font-size: 2rem;
    color: var(--lw-gray-space);
}

.org-table-state__text[b-4adck8mqlg] {
    font-size: 0.875rem;
    color: var(--lw-gray-graphite);
    margin: 0;
}

.org-table-pad[b-4adck8mqlg] {
    padding: 1rem 1.25rem;
}

/* Destructive-leaning outline action (Disconnect): graphite at rest,
   destructive tint on hover (reference profile-integration-card). */
.org-action-danger[b-4adck8mqlg] {
    border: 1px solid var(--lw-border);
    background: var(--lw-white);
    color: var(--lw-gray-graphite);
}

.org-action-danger:hover[b-4adck8mqlg] {
    border-color: rgba(220, 38, 38, 0.4);
    background: var(--lw-status-error-bg);
    color: var(--lw-status-error-fg);
}

/* Mount target for the embedded Modern Treasury ACH form. Always present in the DOM but
   takes a full-width row below the connection controls and stays collapsed until mounted. */
.org-mt-flow[b-4adck8mqlg] {
    flex-basis: 100%;
    width: 100%;
}

/* --- Remove-member modal ---------------------------------- */

.org-modal-copy[b-4adck8mqlg] {
    margin: 0 0 0.5rem;
    font-size: 0.875rem;
    line-height: 1.4;
    color: var(--lw-text-primary);
}

.org-modal-copy--muted[b-4adck8mqlg] {
    margin: 0;
    font-size: 0.8125rem;
    color: var(--lw-gray-graphite);
}


.org-roundel[b-4adck8mqlg] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 40px;
    height: 40px;
    border-radius: 50%;
    background: var(--lw-status-error-bg);
    color: var(--lw-status-error-fg);
    flex-shrink: 0;
}

.org-roundel[b-4adck8mqlg]  .mud-icon-root {
    font-size: 20px;
}

@media (max-width: 600px) {
    .org-field-grid[b-4adck8mqlg],
    .org-grid2[b-4adck8mqlg],
    .org-grid3[b-4adck8mqlg] {
        grid-template-columns: 1fr;
    }

    .org-head-zone[b-4adck8mqlg] {
        padding: 20px 16px 0;
    }

    .org-tabs[b-4adck8mqlg]  .mud-tabs-tabbar {
        padding: 16px 16px 0;
    }

    .org-tabs[b-4adck8mqlg]  .mud-tabs-panels {
        padding: 16px !important;
    }
}

/* --- Loading skeletons ------------------------------------ */
/* Reference: profile-shell.tsx ProfileSkeleton (shimmer blocks rounded-md
   sketching the header zone, tab strip, and one card) and the
   profile-insurance-table.tsx skeleton rows (rounded-sm cells). Shimmer
   chrome lives in the LwSkeleton atom; only layout + radius live here.
   LwSkeleton is a child component, so radius rules need ::deep. */

.org-skeleton[b-4adck8mqlg] {
    display: flex;
    flex-direction: column;
    flex: 1;
}

.org-skeleton[b-4adck8mqlg]  .lw-skeleton,
.org-skel-lines[b-4adck8mqlg]  .lw-skeleton {
    border-radius: 6px;
}

.org-skel-table[b-4adck8mqlg]  .lw-skeleton {
    border-radius: 4px;
}

/* Mirrors the .org-tabs tabbar chrome (16px white gap, 40px strip, 24px gap
   between tabs, hairline under the strip). */
.org-skel-tabbar[b-4adck8mqlg] {
    display: flex;
    align-items: center;
    gap: 24px;
    min-height: 40px;
    padding: 16px 24px 0;
    background: var(--lw-white);
    border-bottom: 1px solid var(--lw-border);
}

/* Mirrors the .mud-tabs-panels muted content zone. */
.org-skel-panel[b-4adck8mqlg] {
    flex: 1;
    background: var(--lw-bg-muted);
    padding: 24px;
}

/* Card sketch (reference: rounded-card border bg-white shadow-card). */
.org-skel-card[b-4adck8mqlg] {
    background: var(--lw-white);
    border: 1px solid var(--lw-border);
    border-radius: var(--lw-radius-card);
    box-shadow: var(--lw-shadow-card);
    overflow: hidden;
}

.org-skel-card__head[b-4adck8mqlg] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 16px 20px;
    border-bottom: 1px solid var(--lw-border);
}

.org-skel-card__body[b-4adck8mqlg] {
    padding: 20px;
}

/* Chip + text lines inside a ControlCard body (bank / QuickBooks cards). */
.org-skel-lines[b-4adck8mqlg] {
    display: flex;
    flex-direction: column;
    gap: 10px;
}

@media (max-width: 600px) {
    .org-skel-tabbar[b-4adck8mqlg] {
        padding: 16px 16px 0;
    }

    .org-skel-panel[b-4adck8mqlg] {
        padding: 16px;
    }
}

/* --- Connected bank account cards -------------------------- */
/* Each connected account renders as a bordered card row -- ported from the
   onboarding .bank-linked spec (BankVerification.razor.css, itself measured
   from ledgerwise-ui-app's vendor-card merged success row): 46px navy icon
   tile, 14/600 name + badge row, 12px graphite sub line. Actions (Refresh /
   Use this account) sit at the card's right edge. */

.org-acct-card[b-4adck8mqlg] {
    display: flex;
    align-items: center;
    gap: 14px;
    padding: 14px 16px;
    margin-top: 12px;
    border: 1px solid var(--lw-border);
    border-radius: var(--lw-radius-card);
    background: var(--lw-white);
}

.org-acct-card__logo[b-4adck8mqlg] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 46px;
    height: 46px;
    flex-shrink: 0;
    border-radius: var(--lw-radius-card);
    background: var(--lw-primary-dark);
    color: var(--lw-white);
}

.org-acct-card__logo[b-4adck8mqlg]  .mud-icon-root {
    width: 22px;
    height: 22px;
    font-size: 22px;
}

.org-acct-card__text[b-4adck8mqlg] {
    min-width: 0;
    flex: 1;
}

.org-acct-card__name-row[b-4adck8mqlg] {
    display: flex;
    align-items: center;
    gap: 8px;
    flex-wrap: wrap;
}

.org-acct-card__name[b-4adck8mqlg] {
    font-size: 14px;
    font-weight: 600;
    color: var(--lw-text-primary);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.org-acct-card__sub[b-4adck8mqlg] {
    margin: 2px 0 0;
    font-size: 12px;
    color: var(--lw-gray-graphite);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.org-acct-card__actions[b-4adck8mqlg] {
    display: flex;
    align-items: center;
    gap: 8px;
    flex-shrink: 0;
}

@media (max-width: 600px) {
    .org-acct-card[b-4adck8mqlg] {
        flex-wrap: wrap;
    }

    .org-acct-card__actions[b-4adck8mqlg] {
        width: 100%;
        justify-content: flex-end;
    }
}
/* _content/Ledgerwise/Components/Pages/Profile/UserProfile.razor.rz.scp.css */
/* ============================================================
   User Profile -- hero header + underline tab bar over a muted
   content zone. Canonical org-shell recipe: mirrors
   MyOrganization.razor.css, itself measured 2026-07-28 from
   ledgerwise-ui-app (organisms/profile-shell.tsx + molecules
   profile-hero-header / tab-bar / section-card /
   profile-detail-card / preferences-panel): white header zone
   px-24 pt-20, tabs mt-16 gap-24 h-40 14/500 w/ 2px foreground
   underline, content zone bg-muted p-24 gap-20; field labels
   12/500 muted-fg, values 14/500 foreground.
   ============================================================ */

/* Shell: escape the layout's pa-6 so the muted zone and the white
   header bleed edge-to-edge (same recipe as .lw-page-shell). */
.profile-shell[b-8pitcdbxd7] {
    display: flex;
    flex-direction: column;
    margin: -24px;
    min-height: calc(100% + 48px);
    background: var(--lw-bg-muted);
}

/* White identity zone above the tab strip (reference: bg-background
   px-4 sm:px-6 pt-5; the 16px gap below the hero is painted by the
   tabbar's own white top padding). */
.profile-head-zone[b-8pitcdbxd7] {
    background: var(--lw-white);
    padding: 20px 24px 0;
}

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

.profile-header[b-8pitcdbxd7] {
    display: flex;
    align-items: center;
    gap: 1rem;
}

/* Person avatar is a CIRCLE (reference profile-hero-header: photo =
   rounded-full, org logo = squircle); size-14 navy fill, white
   text-xl font-semibold initials. */
.profile-avatar[b-8pitcdbxd7] {
    width: 56px;
    height: 56px;
    flex-shrink: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    overflow: hidden;
    background-color: var(--lw-primary-dark);
    color: #ffffff;
    border-radius: 50%;
}

.profile-avatar__initials[b-8pitcdbxd7] {
    font-size: 1.25rem;
    font-weight: 600;
    line-height: 1;
    text-transform: uppercase;
}

.profile-header__info[b-8pitcdbxd7] {
    display: flex;
    flex-direction: column;
    gap: 0.375rem;
    min-width: 0;
    flex: 1;
}

.profile-header__title-row[b-8pitcdbxd7] {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    flex-wrap: wrap;
}

/* Reference h1: text-[22px] font-bold leading-8 tracking-tight
   text-foreground -- same recipe as .lw-page-title. */
.profile-header__name[b-8pitcdbxd7] {
    font-family: var(--lw-font-family);
    font-size: var(--lw-title-size);
    font-weight: var(--lw-title-weight);
    line-height: 2rem;
    letter-spacing: var(--lw-tracking-tight);
    color: var(--lw-title-color);
    margin: 0;
}

/* Company name plus the role chips share the second line. */
.profile-header__meta-row[b-8pitcdbxd7] {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    flex-wrap: wrap;
    min-width: 0;
}

.profile-header__affiliation[b-8pitcdbxd7] {
    font-size: 0.875rem;
    color: var(--lw-gray-graphite);
    margin: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

/* --- Tab strip (Project.razor.css recipe, gap 24px) ------- */

.profile-tabs[b-8pitcdbxd7] {
    display: flex;
    flex-direction: column;
    flex: 1;
}

.profile-tabs[b-8pitcdbxd7]  .mud-tabs,
.profile-tabs[b-8pitcdbxd7]  .mud-tabs-tabbar-inner,
.profile-tabs[b-8pitcdbxd7]  .mud-tabs-tabbar-content,
.profile-tabs[b-8pitcdbxd7]  .mud-tabs-tabbar-wrapper {
    background-color: transparent !important;
}

/* The tab strip continues the white header zone: 16px white gap above the
   tabs (reference mt-4 inside bg-background) painted as top padding here. */
.profile-tabs[b-8pitcdbxd7]  .mud-tabs-tabbar {
    background-color: var(--lw-white) !important;
    border-bottom: 1px solid var(--lw-border);
    border-top: none;
    border-left: none;
    border-right: none;
    flex-shrink: 0;
    box-shadow: none;
    border-radius: 0;
    margin: 0;
    padding: 16px 24px 0;
}

.profile-tabs[b-8pitcdbxd7]  .mud-tabs-tabbar-inner {
    min-height: 40px;
    overflow-x: auto;
    scrollbar-width: none;
}

.profile-tabs[b-8pitcdbxd7]  .mud-tabs-tabbar-inner::-webkit-scrollbar {
    display: none;
}

/* Reference tabs are content-sized (shrink-0); Mud's default 160px box
   spreads them across the bar. !important because Mud's width rules win. */
.profile-tabs[b-8pitcdbxd7]  .mud-tab {
    text-transform: none;
    font-size: 14px;
    font-weight: 500;
    color: var(--lw-gray-graphite);
    min-height: 40px;
    min-width: 0 !important;
    width: auto !important;
    flex: 0 0 auto;
    padding: 0;
    letter-spacing: 0;
    line-height: 1;
}

/* 24px between tabs = reference gap-6 on the org/profile TabBar. Gap on the
   flex wrapper (the tabs' actual parent) -- margins on .mud-tab lose to Mud. */
.profile-tabs[b-8pitcdbxd7]  .mud-tabs-tabbar-wrapper {
    gap: 24px;
}

.profile-tabs[b-8pitcdbxd7]  .mud-tab,
.profile-tabs[b-8pitcdbxd7]  .mud-tab:hover,
.profile-tabs[b-8pitcdbxd7]  .mud-tab.mud-tab-active,
.profile-tabs[b-8pitcdbxd7]  .mud-tab.mud-tab-active:hover {
    background-color: transparent !important;
}

/* Reference tab states: inactive content-secondary; hover AND active are
   foreground (#1E1E24, NOT navy); weight stays 500 in every state. */
.profile-tabs[b-8pitcdbxd7]  .mud-tab:hover {
    color: var(--lw-text-primary);
}

.profile-tabs[b-8pitcdbxd7]  .mud-tab.mud-tab-active {
    color: var(--lw-text-primary);
}

/* Active-tab indicator -- 2px foreground bar spanning exactly the tab.
   Mud's JS-measured slider drifts against content-sized tabs + wrapper gap,
   so it is disabled and the bar is drawn as an inset box-shadow (::after on
   .mud-tab does not paint; see Project.razor.css). */
.profile-tabs[b-8pitcdbxd7]  .mud-tab-slider {
    display: none;
}

.profile-tabs[b-8pitcdbxd7]  .mud-tab.mud-tab-active {
    box-shadow: inset 0 -2px 0 var(--lw-text-primary);
}

.profile-tabs[b-8pitcdbxd7]  .mud-tabs-scroll-button {
    display: none;
}

/* Panels container: muted zone flush against the tab line (reference content
   zone: bg-muted p-6). PanelClass lands on this same element, so the padding
   lives here; !important out-specifies Mud's own paints. */
.profile-tabs[b-8pitcdbxd7]  .mud-tabs-panels {
    background-color: var(--lw-bg-muted) !important;
    margin: 0 !important;
    padding: 24px !important;
}

/* --- Tab content layout ----------------------------------- */

.profile-tab-content[b-8pitcdbxd7] {
    display: flex;
    flex-direction: column;
    gap: 1.25rem;
}

/* --- Read-mode field grid --------------------------------- */

.profile-field-grid[b-8pitcdbxd7] {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 1rem 2rem;
}

.profile-field[b-8pitcdbxd7] {
    display: flex;
    flex-direction: column;
    gap: 0.25rem;
    min-width: 0;
}

/* Reference labels are text-xs font-medium text-muted-foreground (#9DA2B3);
   values text-sm font-medium text-foreground, em-dash when empty. */
.profile-field__label[b-8pitcdbxd7] {
    font-size: 0.75rem;
    font-weight: 500;
    line-height: 1rem;
    color: var(--lw-gray-space);
}

.profile-field__value[b-8pitcdbxd7] {
    font-size: 0.875rem;
    font-weight: 500;
    line-height: 1.25rem;
    color: var(--lw-text-primary);
    overflow-wrap: anywhere;
}

/* --- Edit-mode form layout -------------------------------- */

/* Reference edit grid: grid-cols-2 gap-x-6 gap-y-4. Stacked fields keep
   the same 16px rhythm. */
.profile-form[b-8pitcdbxd7] {
    display: flex;
    flex-direction: column;
    gap: 1rem;
}

.profile-grid2[b-8pitcdbxd7] {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 1rem 1.5rem;
}

/* Reference action row: flex justify-end gap-3 border-t pt-4. */
.profile-edit-actions[b-8pitcdbxd7] {
    display: flex;
    justify-content: flex-end;
    gap: 0.75rem;
    margin-top: 1rem;
    padding-top: 1rem;
    border-top: 1px solid var(--lw-border);
}

/* --- Preferences toggle rows ------------------------------ */

/* Reference preferences-panel: SectionCard body px-5 py-2, rows py-4
   separated by hairlines (divide-y). Card body is pa-0; this wrapper
   owns the padding so the hairlines run the full row width. */
.profile-rows[b-8pitcdbxd7] {
    padding: 0.5rem 1.25rem;
}

.profile-toggle-row[b-8pitcdbxd7] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    padding: 1rem 0;
}

.profile-toggle-row + .profile-toggle-row[b-8pitcdbxd7] {
    border-top: 1px solid var(--lw-border);
}

.profile-toggle-row__text[b-8pitcdbxd7] {
    display: flex;
    flex-direction: column;
    gap: 0.125rem;
    min-width: 0;
    flex: 1;
}

/* Reference row: label text-sm font-medium text-foreground,
   description text-xs text-muted-foreground. */
.profile-toggle-row__label[b-8pitcdbxd7] {
    font-size: 0.875rem;
    font-weight: 500;
    line-height: 1.25rem;
    color: var(--lw-text-primary);
}

.profile-toggle-row__desc[b-8pitcdbxd7] {
    font-size: 0.75rem;
    line-height: 1rem;
    color: var(--lw-gray-space);
}

/* --- Loading skeleton (reference ProfileSkeleton) --------- */

/* Hero row: shimmer avatar + name/sub bars (reference: flex items-center
   gap-4; bars gap-2). Lives inside .profile-head-zone (white). */
.profile-skeleton__hero[b-8pitcdbxd7] {
    display: flex;
    align-items: center;
    gap: 1rem;
}

.profile-skeleton__id[b-8pitcdbxd7] {
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
    flex: 1;
}

/* Tab-bar shimmers: mt-4, gap-6, hairline underneath; bars my-2.5 h-5. */
.profile-skeleton__tabs[b-8pitcdbxd7] {
    /* Full-bleed hairline: escape the head zone's 24px side padding so the
       line runs edge-to-edge like the real tab strip. */
    margin: 1rem -24px 0;
    display: flex;
    align-items: center;
    gap: 1.5rem;
    border-bottom: 1px solid var(--lw-border);
    padding: 0.625rem 24px;
}

/* Content zone: muted p-6 (matches the real tab panels). */
.profile-skeleton__content[b-8pitcdbxd7] {
    display: flex;
    flex-direction: column;
    gap: 1.25rem;
    padding: 24px;
}

/* Card shell mirrors the real section card surface. */
.profile-skeleton__card[b-8pitcdbxd7] {
    overflow: hidden;
    border-radius: var(--lw-radius-card);
    border: 1px solid var(--lw-border);
    background: var(--lw-white);
    box-shadow: var(--lw-shadow-card);
}

.profile-skeleton__card-head[b-8pitcdbxd7] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 1rem 1.25rem;
    border-bottom: 1px solid var(--lw-border);
}

/* Reference: grid-cols-1 sm:grid-cols-2 gap-x-8 gap-y-5 px-5 py-5. */
.profile-skeleton__grid[b-8pitcdbxd7] {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 1.25rem 2rem;
    padding: 1.25rem;
}

.profile-skeleton__field[b-8pitcdbxd7] {
    display: flex;
    flex-direction: column;
    gap: 0.375rem;
}

@media (max-width: 600px) {
    .profile-field-grid[b-8pitcdbxd7],
    .profile-grid2[b-8pitcdbxd7] {
        grid-template-columns: 1fr;
    }

    .profile-head-zone[b-8pitcdbxd7] {
        padding: 20px 16px 0;
    }

    .profile-tabs[b-8pitcdbxd7]  .mud-tabs-tabbar {
        padding: 16px 16px 0;
    }

    .profile-tabs[b-8pitcdbxd7]  .mud-tabs-panels {
        padding: 16px !important;
    }
}
/* _content/Ledgerwise/Components/Pages/Project/AddProject.razor.rz.scp.css */
/* Add-project wizard -- PAGE-SPECIFIC step bodies only. The wizard shell
   (pw-shell / pw-rail* / pw-main / pw-content / pw-stack / pw-cc-link /
   pw-grid2) moved to css/components/lw-wizard.css 2026-07-28 when
   AddContractor became the second wizard consumer. */
/* -- Identity step -- */
.pw-identity[b-fr78vdzj7r] {
    display: grid;
    grid-template-columns: 1fr auto;
    gap: 24px;
    align-items: start;
}

.pw-identity__fields[b-fr78vdzj7r] {
    display: flex;
    flex-direction: column;
    gap: 16px;
    min-width: 0;
}

.pw-identity__avatar[b-fr78vdzj7r] {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 8px;
}

/* -- Owners -- */
.pw-owners[b-fr78vdzj7r] {
    display: flex;
    flex-direction: column;
    gap: 16px;
}

.pw-owner-card[b-fr78vdzj7r] {
    border: 1px solid var(--lw-border);
    border-radius: var(--lw-radius-card);
    background: var(--lw-white);
    overflow: hidden;
}

.pw-owner-card__head[b-fr78vdzj7r] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    border-bottom: 1px solid var(--lw-border);
    padding: 16px 20px;
}

.pw-owner-card__name[b-fr78vdzj7r] {
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    font-size: 14px;
    font-weight: 600;
    color: var(--lw-text-primary);
}

.pw-owner-card__tags[b-fr78vdzj7r] {
    display: inline-flex;
    align-items: center;
    gap: 10px;
    flex-shrink: 0;
}

.pw-owner-card__remove[b-fr78vdzj7r] {
    border: 0;
    background: transparent;
    cursor: pointer;
    color: var(--lw-gray-graphite);
    display: inline-flex;
    padding: 4px;
    border-radius: 6px;
}

.pw-owner-card__remove:hover[b-fr78vdzj7r] {
    color: var(--bs-danger, #d33);
}

.pw-owner-card__remove[b-fr78vdzj7r]  .mud-icon-root {
    width: 18px;
    height: 18px;
    font-size: 18px;
    color: currentColor !important;
}

.pw-owner-card__body[b-fr78vdzj7r] {
    display: flex;
    flex-direction: column;
    gap: 16px;
    padding: 20px;
}

.pw-owner-card__note[b-fr78vdzj7r] {
    margin: 0;
    font-size: 12px;
    color: var(--lw-gray-graphite);
}

.pw-add-btn[b-fr78vdzj7r] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    width: 100%;
    height: 40px;
    border: 1px solid var(--lw-border);
    background: var(--lw-white);
    border-radius: 8px;
    color: var(--lw-text-primary);
    font-size: 14px;
    font-weight: 500;
    cursor: pointer;
    font-family: inherit;
    transition: background-color 0.15s ease;
}

.pw-add-btn:hover[b-fr78vdzj7r] {
    background: var(--lw-bg-muted);
}

.pw-add-btn[b-fr78vdzj7r]  .mud-icon-root {
    width: 16px;
    height: 16px;
    font-size: 16px;
}

.pw-owners__note[b-fr78vdzj7r] {
    margin: 0;
    font-size: 12px;
    line-height: 18px;
    color: var(--lw-gray-graphite);
}

/* -- Team -- */
.pw-team[b-fr78vdzj7r] {
    display: flex;
    flex-direction: column;
    gap: 12px;
}

/* -- Review -- */
.pw-rev[b-fr78vdzj7r] {
    display: flex;
    flex-direction: column;
}

.pw-rev__row[b-fr78vdzj7r] {
    display: flex;
    align-items: flex-start;
    gap: 16px;
    padding: 10px 0;
    border-bottom: 1px solid var(--lw-border);
}

.pw-rev__row:last-child[b-fr78vdzj7r] {
    border-bottom: 0;
}

.pw-rev__label[b-fr78vdzj7r] {
    flex: 0 0 144px;
    font-size: 13px;
    color: var(--lw-gray-graphite);
}

.pw-rev__value[b-fr78vdzj7r] {
    flex: 1;
    min-width: 0;
    display: flex;
    flex-direction: column;
    gap: 2px;
    font-size: 14px;
    color: var(--lw-text-primary);
    word-break: break-word;
}

.pw-rev__owner[b-fr78vdzj7r] {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    font-weight: 500;
}

.pw-rev__sub[b-fr78vdzj7r] {
    font-size: 12px;
    color: var(--lw-gray-graphite);
}

.pw-rev__avatar[b-fr78vdzj7r] {
    width: 36px;
    height: 36px;
    border-radius: var(--lw-radius-control);
    overflow: hidden;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    font-size: 13px;
    font-weight: 700;
    background: var(--lw-gradient-project-avatar);
    color: #fff;
}

.pw-rev__avatar img[b-fr78vdzj7r] {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

/* -- Responsive -- */
@media (max-width: 900px) {
    .pw-identity[b-fr78vdzj7r] {
        grid-template-columns: 1fr;
    }

    .pw-identity__avatar[b-fr78vdzj7r] {
        align-items: flex-start;
    }
}

@media (max-width: 860px) {
    .pw-shell[b-fr78vdzj7r] {
        grid-template-columns: 1fr;
    }

    .pw-rail[b-fr78vdzj7r] {
        display: none;
    }

    .pw-content[b-fr78vdzj7r] {
        padding: 24px 16px 105px;
    }

    .pw-grid2[b-fr78vdzj7r] {
        grid-template-columns: 1fr;
    }
}
/* _content/Ledgerwise/Components/Pages/Project/Budget/BudgetLineItemTypePill.razor.rz.scp.css */
/* ── Type pill (matches ledgerwise-ui BudgetTypePill) ── */
/* The wrap is a real <button> (keyboard activation for the shared type
   menu), so neutralize the UA button chrome. */
.blt-pill-wrap[b-nbh49tlujp] {
    position: relative;
    display: inline-flex;
    align-items: center;
    outline: none;
    cursor: pointer;
    background: none;
    border: 0;
    padding: 0;
    font: inherit;
}

.blt-pill[b-nbh49tlujp] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border-radius: var(--lw-radius-control); /* reference rounded-sm = 8px */
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.025em;
    line-height: 1;
    color: var(--lw-white);
}

.blt-pill-md[b-nbh49tlujp] {
    height: 1.5rem;
    width: 1.5rem;
    font-size: 11px;
}

.blt-pill-sm[b-nbh49tlujp] {
    height: 1.25rem;
    width: 1.25rem;
    font-size: 10px;
}

.blt-pill-xs[b-nbh49tlujp] {
    height: 1rem;
    width: 1rem;
    font-size: 9px;
}

/* Tone map matches the other pill copies (budget-table.css / toolbars):
   projected=info, firm=success-dark, allowance=warning. */
.blt-pill-projected[b-nbh49tlujp] { background: var(--lw-status-info-fg); }
.blt-pill-firm[b-nbh49tlujp]      { background: var(--lw-success-dark); }
.blt-pill-allowance[b-nbh49tlujp] { background: var(--lw-status-warning-fg); }

/* ── Rich hover tooltip ── */
.blt-tip[b-nbh49tlujp] {
    position: absolute;
    bottom: calc(100% + 0.375rem);
    left: 50%;
    transform: translateX(-50%);
    z-index: 1000;
    opacity: 0;
    pointer-events: none;
    transition: opacity 0.15s ease;
    background: var(--lw-primary-dark);
    color: var(--lw-white);
    padding: 0.625rem;
    min-width: 200px;
    max-width: 260px;
    box-shadow: 0 4px 12px rgba(0,0,0,0.15);
}

.blt-pill-wrap:hover .blt-tip[b-nbh49tlujp],
.blt-pill-wrap:focus-visible .blt-tip[b-nbh49tlujp] {
    opacity: 1;
}

.blt-tip-inner[b-nbh49tlujp] {
    display: flex;
    align-items: flex-start;
    gap: 0.5rem;
}

.blt-tip-body[b-nbh49tlujp] {
    display: flex;
    flex-direction: column;
    gap: 0.125rem;
    min-width: 0;
}

.blt-tip-label[b-nbh49tlujp] {
    font-size: 12px;
    font-weight: 600;
    line-height: 1.2;
}

.blt-tip-desc[b-nbh49tlujp] {
    font-size: 11px;
    line-height: 1.35;
    color: rgba(255,255,255,0.7);
}

/* Menu-item layout lives in BudgetTypeMenu.razor.css (the shared menu
   component the pill opens). */
/* _content/Ledgerwise/Components/Pages/Project/Budget/BudgetTableHeader.razor.rz.scp.css */
.bth[b-frs82gqo9o] {
    position: sticky;
    top: 0;
    z-index: 2;
}

.bth-row[b-frs82gqo9o] {
    background: var(--lw-bg-table-header);
    border-bottom: 1px solid var(--lw-border);
}

.bth-th[b-frs82gqo9o] {
    padding-top: 0.625rem;
    padding-bottom: 0.625rem;
    text-align: right;
    font-size: 11px;
    font-weight: 600;
    color: var(--lw-gray-graphite);
    text-transform: uppercase;
    letter-spacing: 0.025em;
    background: var(--lw-bg-table-header);
    white-space: nowrap;
    vertical-align: middle;
}

.bth-align-left[b-frs82gqo9o] {
    text-align: left;
}

.bth-expand-btn[b-frs82gqo9o],
.bth-expand-placeholder[b-frs82gqo9o] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 1.5rem;
    height: 1.5rem;
    padding: 0;
    background: transparent;
    border: none;
    color: var(--lw-gray-graphite);
    cursor: pointer;
    transition: background-color 0.12s, color 0.12s;
}

.bth-expand-btn:hover[b-frs82gqo9o] {
    background: var(--lw-accent);
    color: var(--lw-text-primary);
}

.bth-expand-btn[b-frs82gqo9o]  .mud-icon-root,
.bth-expand-placeholder[b-frs82gqo9o]  .mud-icon-root {
    font-size: 0.875rem !important;
}
/* _content/Ledgerwise/Components/Pages/Project/Budget/BudgetToolbar.razor.rz.scp.css */
/* Budget toolbar -- content chrome only; the bar itself is the shared
   .lw-page-toolbar recipe (lw-page.css). Source: ledgerwise-app
   gc-budget-table.tsx subheader + molecules/pending-edit-bar.tsx (2026-07-12).
   MIRROR any change here in ControlBudgetToolbar.razor.css (hand-duplicated
   twin; the fullscreen modals do not render toolbars). */

/* Stack on mobile like the reference (flex-col gap-3 below md). */
@media (max-width: 767px) {
    .bt-toolbar[b-x9idp3ycz1] {
        flex-direction: column;
        align-items: stretch;
        padding: 12px 16px;
    }
}

.bt-toolbar-left[b-x9idp3ycz1],
.bt-toolbar-right[b-x9idp3ycz1] {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 0.5rem;
}

/* Pill swatches inside the type filter tabs (tone map matches
   budget-table.css .bt-pill-*). */
.bt-pill[b-x9idp3ycz1] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    height: 1rem;
    width: 1rem;
    border-radius: var(--lw-radius-control);
    font-size: 9px;
    font-weight: 700;
    color: var(--lw-white);
    text-transform: uppercase;
    letter-spacing: 0.025em;
    line-height: 1;
    flex-shrink: 0;
}

.bt-pill-projected[b-x9idp3ycz1] { background: var(--lw-status-info-fg); }
.bt-pill-firm[b-x9idp3ycz1]      { background: var(--lw-success-dark); }
.bt-pill-allowance[b-x9idp3ycz1] { background: var(--lw-status-warning-fg); }

/* ── Search (shared .lw-page-search shell + clear button) ── */
.bt-search-wrap[b-x9idp3ycz1] {
    position: relative;
}

.bt-search-clear[b-x9idp3ycz1] {
    position: absolute;
    right: 8px;
    top: 50%;
    transform: translateY(-50%);
    display: flex;
    align-items: center;
    justify-content: center;
    width: 20px;
    height: 20px;
    padding: 0;
    border: 0;
    background: transparent;
    color: var(--lw-gray-space);
    cursor: pointer;
}

.bt-search-clear:hover[b-x9idp3ycz1] {
    color: var(--lw-text-primary);
}

/* ── Pending edits (reference pending-edit-bar.tsx: ghost Undo + navy
   Request/Submit Adjustment with a white/20 count badge) ── */
.bt-pending-bar[b-x9idp3ycz1] {
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
}

.bt-pending-btn[b-x9idp3ycz1] {
    display: inline-flex;
    align-items: center;
    gap: 0.375rem;
    padding: 0 0.75rem;
    height: 2rem;
    font-family: inherit;
    font-size: 0.8125rem;
    font-weight: 500;
    border-radius: var(--lw-radius-control);
    cursor: pointer;
    transition: background-color 0.12s, color 0.12s;
}

.bt-pending-btn:disabled[b-x9idp3ycz1] {
    opacity: 0.5;
    cursor: not-allowed;
}

.bt-pending-undo[b-x9idp3ycz1] {
    background: var(--lw-white);
    border: 1px solid var(--lw-border);
    color: var(--lw-gray-graphite);
    box-shadow: var(--lw-shadow-card);
}

.bt-pending-undo:hover:not(:disabled)[b-x9idp3ycz1] {
    background: var(--lw-accent);
    color: var(--lw-text-primary);
}

.bt-pending-co[b-x9idp3ycz1] {
    background: var(--lw-primary-dark);
    border: 1px solid var(--lw-primary-dark);
    color: var(--lw-white);
    font-weight: 600;
}

.bt-pending-co:hover:not(:disabled)[b-x9idp3ycz1] {
    background: var(--lw-primary-dark-hover);
}

.bt-pending-count[b-x9idp3ycz1] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 1.25rem;
    height: 1.125rem;
    padding: 0 0.3125rem;
    margin-left: 0.125rem;
    font-size: 0.6875rem;
    font-weight: 700;
    border-radius: var(--lw-radius-control);
    background: color-mix(in srgb, var(--lw-white) 20%, transparent);
    color: var(--lw-white);
}

/* ── Saving status chip ── */
.bt-status-chip[b-x9idp3ycz1] {
    display: inline-flex;
    align-items: center;
    gap: 0.25rem;
    height: 1.5rem;
    padding: 0 0.625rem;
    font-size: 0.75rem;
    font-weight: 500;
    color: var(--lw-status-info-fg);
    background: color-mix(in srgb, var(--lw-status-info-fg) 8%, transparent);
    border-radius: var(--lw-radius-control);
}

/* ── Download split-button (reference: bordered shell, Download + hairline
   divider + chevron; h-9, 13px/500 content-secondary, accent hover) ── */
.bt-split[b-x9idp3ycz1] {
    display: inline-flex;
    align-items: stretch;
    flex-shrink: 0;
    overflow: hidden;
    border: 1px solid var(--lw-border);
    border-radius: var(--lw-radius-card);
    background: var(--lw-white);
}

.bt-split-btn[b-x9idp3ycz1] {
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
    height: 36px;
    padding: 0 0.75rem;
    border: 0;
    background: transparent;
    font-family: inherit;
    font-size: 13px;
    font-weight: 500;
    color: var(--lw-gray-graphite);
    cursor: pointer;
    transition: background-color 0.12s, color 0.12s;
}

.bt-split-btn:hover:not(:disabled)[b-x9idp3ycz1] {
    background: var(--lw-accent);
    color: var(--lw-text-primary);
}

.bt-split-btn:disabled[b-x9idp3ycz1] {
    opacity: 0.5;
    cursor: not-allowed;
}

.bt-split-chevron[b-x9idp3ycz1] {
    width: 2rem;
    padding: 0;
    justify-content: center;
}

.bt-split-divider[b-x9idp3ycz1] {
    width: 1px;
    margin: 6px 0;
    background: var(--lw-border);
}

.bt-split[b-x9idp3ycz1]  .mud-icon-root {
    font-size: 1rem !important;
}

/* Hide the Download label on small screens (reference: hidden sm:inline). */
@media (max-width: 640px) {
    .bt-split-label[b-x9idp3ycz1] {
        display: none;
    }
}
/* _content/Ledgerwise/Components/Pages/Project/Budget/BudgetTypeMenu.razor.rz.scp.css */
/* Menu-item layout for the shared type menu (moved from
   BudgetLineItemTypePill.razor.css when the menu was hoisted out of the
   per-row pill). Pill base classes are duplicated here because CSS isolation
   scopes the originals to the pill component. */
.blt-pill[b-91up2ie76x] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border-radius: var(--lw-radius-control);
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.025em;
    line-height: 1;
    color: var(--lw-white);
}

.blt-pill-sm[b-91up2ie76x] {
    height: 1.25rem;
    width: 1.25rem;
    font-size: 10px;
}

.blt-pill-projected[b-91up2ie76x] { background: var(--lw-status-info-fg); }
.blt-pill-firm[b-91up2ie76x]      { background: var(--lw-success-dark); }
.blt-pill-allowance[b-91up2ie76x] { background: var(--lw-status-warning-fg); }

.blt-menu-row[b-91up2ie76x] {
    display: flex;
    align-items: flex-start;
    gap: 0.625rem;
    padding: 0.125rem 0;
    min-width: 220px;
}

.blt-menu-row-active[b-91up2ie76x] {
    color: var(--lw-primary-blue);
}

.blt-menu-text[b-91up2ie76x] {
    display: flex;
    flex-direction: column;
    gap: 0.125rem;
    min-width: 0;
    flex: 1;
}

.blt-menu-label[b-91up2ie76x] {
    font-size: 0.8125rem;
    font-weight: 600;
    color: var(--lw-text-primary);
    line-height: 1.2;
}

.blt-menu-desc[b-91up2ie76x] {
    font-size: 0.75rem;
    color: var(--lw-gray-graphite);
    line-height: 1.3;
}

.blt-menu-check[b-91up2ie76x] {
    color: var(--lw-primary-blue);
    margin-top: 0.125rem;
    margin-left: auto;
    flex-shrink: 0;
}
/* _content/Ledgerwise/Components/Pages/Project/Budget/ControlBudgetTableHeader.razor.rz.scp.css */
.bth[b-0cktat6b9e] {
    position: sticky;
    top: 0;
    z-index: 2;
}

.bth-row[b-0cktat6b9e] {
    background: var(--lw-bg-table-header);
    border-bottom: 1px solid var(--lw-border);
}

.bth-th[b-0cktat6b9e] {
    padding-top: 0.625rem;
    padding-bottom: 0.625rem;
    text-align: right;
    font-size: 11px;
    font-weight: 600;
    color: var(--lw-gray-graphite);
    text-transform: uppercase;
    letter-spacing: 0.025em;
    background: var(--lw-bg-table-header);
    white-space: nowrap;
    vertical-align: middle;
}

.bth-align-left[b-0cktat6b9e] {
    text-align: left;
}

.bth-expand-btn[b-0cktat6b9e],
.bth-expand-placeholder[b-0cktat6b9e] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 1.5rem;
    height: 1.5rem;
    padding: 0;
    background: transparent;
    border: none;
    color: var(--lw-gray-graphite);
    cursor: pointer;
    transition: background-color 0.12s, color 0.12s;
}

.bth-expand-btn:hover[b-0cktat6b9e] {
    background: var(--lw-accent);
    color: var(--lw-text-primary);
}

.bth-expand-btn[b-0cktat6b9e]  .mud-icon-root,
.bth-expand-placeholder[b-0cktat6b9e]  .mud-icon-root {
    font-size: 0.875rem !important;
}
/* _content/Ledgerwise/Components/Pages/Project/Budget/ControlBudgetToolbar.razor.rz.scp.css */
/* Control-budget (setup) toolbar -- content chrome only; the bar itself is
   the shared .lw-page-toolbar recipe (lw-page.css). HAND-DUPLICATED TWIN of
   BudgetToolbar.razor.css -- mirror changes between the two. Source:
   ledgerwise-app gc-budget-table.tsx subheader (2026-07-12). */

@media (max-width: 767px) {
    .bt-toolbar[b-xpd51melmt] {
        flex-direction: column;
        align-items: stretch;
        padding: 12px 16px;
    }
}

.bt-toolbar-left[b-xpd51melmt],
.bt-toolbar-right[b-xpd51melmt] {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 0.5rem;
}

/* Pill swatches inside the type filter tabs (tone map matches
   budget-table.css .bt-pill-*). */
.bt-pill[b-xpd51melmt] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    height: 1rem;
    width: 1rem;
    border-radius: var(--lw-radius-control);
    font-size: 9px;
    font-weight: 700;
    color: var(--lw-white);
    text-transform: uppercase;
    letter-spacing: 0.025em;
    line-height: 1;
    flex-shrink: 0;
}

.bt-pill-projected[b-xpd51melmt] { background: var(--lw-status-info-fg); }
.bt-pill-firm[b-xpd51melmt]      { background: var(--lw-success-dark); }
.bt-pill-allowance[b-xpd51melmt] { background: var(--lw-status-warning-fg); }

/* ── Search (shared .lw-page-search shell + clear button) ── */
.bt-search-wrap[b-xpd51melmt] {
    position: relative;
}

.bt-search-clear[b-xpd51melmt] {
    position: absolute;
    right: 8px;
    top: 50%;
    transform: translateY(-50%);
    display: flex;
    align-items: center;
    justify-content: center;
    width: 20px;
    height: 20px;
    padding: 0;
    border: 0;
    background: transparent;
    color: var(--lw-gray-space);
    cursor: pointer;
}

.bt-search-clear:hover[b-xpd51melmt] {
    color: var(--lw-text-primary);
}

/* ── Saving / applying-template status chip ── */
.bt-status-chip[b-xpd51melmt] {
    display: inline-flex;
    align-items: center;
    gap: 0.25rem;
    height: 1.5rem;
    padding: 0 0.625rem;
    font-size: 0.75rem;
    font-weight: 500;
    color: var(--lw-status-info-fg);
    background: color-mix(in srgb, var(--lw-status-info-fg) 8%, transparent);
    border-radius: var(--lw-radius-control);
}

/* ── Download split-button (mirror of BudgetToolbar) ── */
.bt-split[b-xpd51melmt] {
    display: inline-flex;
    align-items: stretch;
    flex-shrink: 0;
    overflow: hidden;
    border: 1px solid var(--lw-border);
    border-radius: var(--lw-radius-card);
    background: var(--lw-white);
}

.bt-split-btn[b-xpd51melmt] {
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
    height: 36px;
    padding: 0 0.75rem;
    border: 0;
    background: transparent;
    font-family: inherit;
    font-size: 13px;
    font-weight: 500;
    color: var(--lw-gray-graphite);
    cursor: pointer;
    transition: background-color 0.12s, color 0.12s;
}

.bt-split-btn:hover:not(:disabled)[b-xpd51melmt] {
    background: var(--lw-accent);
    color: var(--lw-text-primary);
}

.bt-split-btn:disabled[b-xpd51melmt] {
    opacity: 0.5;
    cursor: not-allowed;
}

.bt-split-chevron[b-xpd51melmt] {
    width: 2rem;
    padding: 0;
    justify-content: center;
}

.bt-split-divider[b-xpd51melmt] {
    width: 1px;
    margin: 6px 0;
    background: var(--lw-border);
}

.bt-split[b-xpd51melmt]  .mud-icon-root {
    font-size: 1rem !important;
}

@media (max-width: 640px) {
    .bt-split-label[b-xpd51melmt] {
        display: none;
    }
}
/* _content/Ledgerwise/Components/Pages/Project/Budget/EmptyBudgetState.razor.rz.scp.css */
/* Source: ledgerwise-app gc-budget-table.tsx EmptyBudgetState (2026-07-12):
   card rounded-card border-DASHED border-border bg-card px-6 py-14 center
   shadow-card; icon chip size-12 rounded-card bg-info-bg text-brand-accent;
   start-option cards border bg-white p-4 with brand-accent/60 hover border
   + accent/40 hover fill (rendered here as informational value points). */

.ebs-card[b-7mhaht1c7l] {
    display: flex;
    flex-direction: column;
    align-items: center;
    text-align: center;
    padding: 56px 24px;
    background: var(--lw-white);
    border: 1px dashed var(--lw-border);
    border-radius: var(--lw-radius-card);
    box-shadow: var(--lw-shadow-card);
}

.ebs-icon-chip[b-7mhaht1c7l] {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 48px;
    height: 48px;
    border-radius: var(--lw-radius-card);
    background: var(--lw-status-info-bg);
    color: var(--lw-primary-blue);
}

.ebs-title[b-7mhaht1c7l] {
    margin: 16px 0 0;
    font-family: var(--lw-font-family);
    font-size: var(--lw-title-size);
    font-weight: var(--lw-title-weight);
    letter-spacing: var(--lw-tracking-tight);
    color: var(--lw-title-color);
}

.ebs-desc[b-7mhaht1c7l] {
    margin: 8px 0 0;
    max-width: 460px;
    font-size: 14px;
    line-height: 1.6;
    color: var(--lw-gray-graphite);
}

.ebs-cta[b-7mhaht1c7l] {
    margin-top: 20px;
}

.ebs-points[b-7mhaht1c7l] {
    display: grid;
    grid-template-columns: 1fr;
    gap: 12px;
    margin-top: 40px;
    width: 100%;
    max-width: 720px;
}

@media (min-width: 768px) {
    .ebs-points[b-7mhaht1c7l] {
        grid-template-columns: repeat(3, 1fr);
    }
}

.ebs-point[b-7mhaht1c7l] {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 6px;
    padding: 16px;
    background: var(--lw-white);
    border: 1px solid var(--lw-border);
    border-radius: var(--lw-radius-card);
    transition: border-color 0.15s ease, background-color 0.15s ease;
}

.ebs-point:hover[b-7mhaht1c7l] {
    border-color: color-mix(in srgb, var(--lw-primary-blue) 60%, transparent);
    background: color-mix(in srgb, var(--lw-accent) 40%, transparent);
}

.ebs-point[b-7mhaht1c7l]  .ebs-point-icon.mud-icon-root {
    font-size: 22px;
    width: 22px;
    height: 22px;
    color: var(--lw-primary-blue);
}

.ebs-point-title[b-7mhaht1c7l] {
    font-size: 14px;
    font-weight: var(--lw-font-semibold);
    color: var(--lw-text-primary);
}

.ebs-point-desc[b-7mhaht1c7l] {
    font-size: 12px;
    line-height: 1.5;
    color: var(--lw-gray-graphite);
}
/* _content/Ledgerwise/Components/Pages/Project/Budget/SubmitChangeOrderModal.razor.rz.scp.css */
/* Submit Budget Adjustments modal internals.
   Canonicalized 2026-07-21 onto the lw-modal shell; recipes from
   ledgerwise-ui-app: dialog.tsx (shell), co-summary-modal.tsx (dropzone,
   file rows), owner-adjustment-detail-drawer.tsx line-item cards, and the
   BA spec delta semantics (positive = destructive red, negative = green).
   FieldShell recipe mirrors LwTextField.razor.css; the Mud inputs stay for
   their binding behavior. */

.sco-loading[b-aihfn62llp] {
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 32px 0;
}

/* Scrollable BA card stack (id change-orders-scroll-container is a JS
   auto-scroll hook -- keep it). Flex-fills the remaining space inside the
   bounded lw-modal--scroll dialog and owns the single internal scroll region
   (also the drag auto-scroll target), so the footer action row stays pinned
   and visible regardless of how many budget adjustments are listed. */
.sco-scroll[b-aihfn62llp] {
    flex: 1 1 auto;
    min-height: 120px;
    overflow-y: auto;
    overflow-x: hidden;
    padding-right: 10px;
    display: flex;
    flex-direction: column;
    gap: 12px;
}

/* BA card: white bordered card on the form-surface panel. */
.sco-card[b-aihfn62llp] {
    border: 1px solid var(--lw-border);
    border-radius: var(--lw-radius-card);
    background: var(--lw-white);
    box-shadow: var(--lw-shadow-card);
    padding: 16px;
    transition: border-color 0.15s ease, box-shadow 0.15s ease;
}

.sco-card--selected[b-aihfn62llp] {
    border-color: var(--lw-primary-blue);
    box-shadow: 0 0 0 1px var(--lw-primary-blue), var(--lw-shadow-card);
}

.sco-card--dragover[b-aihfn62llp] {
    border-color: var(--lw-success-dark);
    box-shadow: 0 0 0 3px var(--lw-status-success-bg);
}

.sco-card-head[b-aihfn62llp] {
    display: flex;
    align-items: center;
    gap: 8px;
    margin-bottom: 12px;
}

.sco-card-title[b-aihfn62llp] {
    flex: 1;
    max-width: 400px;
    min-width: 0;
}

.sco-card-chips[b-aihfn62llp] {
    display: flex;
    align-items: center;
    gap: 8px;
    margin-left: auto;
    flex-shrink: 0;
}

.sco-card-desc[b-aihfn62llp] {
    margin-bottom: 12px;
}

/* Line-item drop region: dashed catchment for drag-and-drop. */
.sco-lines[b-aihfn62llp] {
    min-height: 80px;
    border: 1px dashed var(--lw-border);
    border-radius: var(--lw-radius-control);
    padding: 8px;
    display: flex;
    flex-direction: column;
    gap: 8px;
}

.sco-lines-empty[b-aihfn62llp] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 8px;
    padding: 32px;
    text-align: center;
}

.sco-lines-empty-icon[b-aihfn62llp] {
    display: inline-flex;
    color: var(--lw-gray-space);
}

.sco-lines-empty-icon[b-aihfn62llp]  .mud-icon-root { width: 32px; height: 32px; }

.sco-lines-empty-text[b-aihfn62llp] {
    margin: 0;
    font-size: 14px;
    color: var(--lw-gray-graphite);
}

/* Draggable line-item card. */
.sco-line[b-aihfn62llp] {
    border: 1px solid var(--lw-border);
    border-radius: var(--lw-radius-control);
    background: var(--lw-white);
    padding: 12px;
    cursor: move;
}

.sco-line-head[b-aihfn62llp] {
    display: flex;
    align-items: center;
    gap: 8px;
    margin-bottom: 8px;
}

.sco-line-grip[b-aihfn62llp] {
    display: inline-flex;
    flex-shrink: 0;
    color: var(--lw-gray-space);
}

.sco-line-grip[b-aihfn62llp]  .mud-icon-root { width: 1rem; height: 1rem; }

.sco-line-name[b-aihfn62llp] {
    font-size: 14px;
    font-weight: var(--lw-font-semibold);
    color: var(--lw-text-primary);
}

/* Previous -> new -> signed delta strip. */
.sco-line-amounts[b-aihfn62llp] {
    display: flex;
    align-items: center;
    gap: 8px;
    margin-left: 24px;
    font-variant-numeric: tabular-nums;
}

.sco-line-prev[b-aihfn62llp] {
    font-size: 14px;
    color: var(--lw-gray-graphite);
    text-decoration: line-through;
}

.sco-line-arrow[b-aihfn62llp] {
    display: inline-flex;
    color: var(--lw-gray-graphite);
}

.sco-line-arrow[b-aihfn62llp]  .mud-icon-root { width: 0.875rem; height: 0.875rem; }

.sco-line-new[b-aihfn62llp] {
    font-size: 14px;
    font-weight: var(--lw-font-semibold);
    color: var(--lw-text-primary);
}

/* Delta semantics per the BA spec: increase = destructive red, cut = green. */
.sco-delta[b-aihfn62llp] {
    font-size: 14px;
    font-weight: var(--lw-font-medium);
}

.sco-delta--up[b-aihfn62llp] {
    color: var(--lw-status-error-fg);
}

.sco-delta--down[b-aihfn62llp] {
    color: var(--lw-status-success-fg);
}

.sco-line-reason[b-aihfn62llp] {
    margin-top: 8px;
    margin-left: 24px;
}

/* Section separator + supporting-documents label. */
.sco-sep[b-aihfn62llp] {
    height: 1px;
    background: var(--lw-border);
    margin: 12px 0;
}

.sco-doc-label[b-aihfn62llp] {
    display: flex;
    align-items: center;
    gap: 6px;
    margin: 0 0 8px;
    font-size: 13px;
    font-weight: var(--lw-font-semibold);
    color: var(--lw-text-primary);
}

.sco-doc-label-icon[b-aihfn62llp] {
    display: inline-flex;
    color: var(--lw-gray-graphite);
}

.sco-doc-label-icon[b-aihfn62llp]  .mud-icon-root { width: 1rem; height: 1rem; }

/* Dropzone (co-summary-modal.tsx recipe). Wrapper keeps position:relative
   so MudFileUpload's invisible input overlay covers the zone. */
.sco-dropwrap[b-aihfn62llp] {
    position: relative;
}

.sco-dropzone[b-aihfn62llp] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 6px;
    width: 100%;
    padding: 24px;
    text-align: center;
    border: 2px dashed var(--lw-border);
    border-radius: var(--lw-radius-control);
    cursor: pointer;
    transition: border-color 0.15s ease, background 0.15s ease;
}

.sco-dropwrap:hover .sco-dropzone[b-aihfn62llp] {
    border-color: color-mix(in srgb, var(--lw-primary-blue) 40%, transparent);
    background: color-mix(in srgb, var(--lw-primary-blue) 5%, transparent);
}

.sco-drop-icon[b-aihfn62llp] {
    display: inline-flex;
    color: var(--lw-gray-space);
}

.sco-drop-icon[b-aihfn62llp]  .mud-icon-root { width: 24px; height: 24px; }

.sco-drop-text[b-aihfn62llp] {
    font-size: 14px;
    color: var(--lw-gray-space);
}

.sco-drop-hint[b-aihfn62llp] {
    font-size: 12px;
    color: var(--lw-gray-space);
}

/* File rows. */
.sco-file-group-label[b-aihfn62llp] {
    margin: 8px 0 4px;
    font-size: 12px;
    font-weight: var(--lw-font-semibold);
    color: var(--lw-gray-graphite);
}

.sco-files[b-aihfn62llp] {
    display: flex;
    flex-direction: column;
    gap: 4px;
    margin-top: 8px;
}

.sco-file-group-label + .sco-files[b-aihfn62llp] {
    margin-top: 0;
}

.sco-file[b-aihfn62llp] {
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 8px 12px;
    border: 1px solid var(--lw-border);
    border-radius: var(--lw-radius-control);
}

.sco-file-icon[b-aihfn62llp] {
    display: inline-flex;
    flex-shrink: 0;
    color: var(--lw-gray-graphite);
}

.sco-file-icon--ok[b-aihfn62llp] {
    color: var(--lw-success-dark);
}

.sco-file-icon[b-aihfn62llp]  .mud-icon-root { width: 1rem; height: 1rem; }

.sco-file-name[b-aihfn62llp] {
    flex: 1;
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    font-size: 14px;
    font-weight: var(--lw-font-medium);
    color: var(--lw-text-primary);
}

.sco-file-size[b-aihfn62llp] {
    flex-shrink: 0;
    font-size: 12px;
    color: var(--lw-gray-space);
}

.sco-file-remove[b-aihfn62llp] {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 24px;
    height: 24px;
    flex-shrink: 0;
    border: 0;
    background: none;
    padding: 0;
    border-radius: var(--lw-radius-control);
    color: var(--lw-gray-graphite);
    cursor: pointer;
    transition: background 0.15s ease, color 0.15s ease;
}

.sco-file-remove:hover:not(:disabled)[b-aihfn62llp] {
    background: var(--lw-status-error-bg);
    color: var(--lw-destructive);
}

.sco-file-remove:disabled[b-aihfn62llp] {
    opacity: 0.5;
    cursor: default;
}

.sco-file-remove[b-aihfn62llp]  .mud-icon-root { width: 0.875rem; height: 0.875rem; }

/* Create-new-BA button: outlined secondary (BA surfaces hand-rolled
   outline: h-9 rounded-md border px-4 text-[13px] font-medium hover accent). */
.sco-add[b-aihfn62llp] {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    height: 36px;
    padding: 0 16px;
    border: 1px solid var(--lw-border);
    border-radius: var(--lw-radius-control);
    background: var(--lw-white);
    font-family: var(--lw-font-family);
    font-size: 13px;
    font-weight: var(--lw-font-medium);
    color: var(--lw-text-primary);
    cursor: pointer;
    transition: background 0.15s ease;
}

.sco-add:hover:not(:disabled)[b-aihfn62llp] {
    background: var(--lw-accent);
}

.sco-add:disabled[b-aihfn62llp] {
    opacity: 0.5;
    cursor: default;
}

.sco-add-icon[b-aihfn62llp] {
    display: inline-flex;
    color: var(--lw-primary-blue);
}

.sco-add-icon[b-aihfn62llp]  .mud-icon-root { width: 1rem; height: 1rem; }

/* -- FieldShell chrome for the Mud inputs (recipe: LwTextField.razor.css,
   2026-07-08 spec). -- */

.sco-field[b-aihfn62llp]  .mud-input-helper-text {
    font-family: var(--lw-font-family);
    font-size: 13px;
    line-height: 18px;
    margin-top: 4px;
}

.sco-field[b-aihfn62llp]  .mud-input-control {
    margin-top: 0;
}

.sco-field[b-aihfn62llp]  .mud-input-outlined {
    font-size: 14px;
    font-weight: 400;
    background-color: var(--lw-white);
    border-radius: var(--lw-radius-control);
}

.sco-field[b-aihfn62llp]  .mud-input-outlined input.mud-input-slot {
    height: 54px;
    box-sizing: border-box;
    padding: 16px 14px;
    font-size: 14px;
    font-weight: 400;
    /* 16 + 22 + 16 = 54 -- centers the text block exactly like FieldShell. */
    line-height: 22px;
}

/* Multiline shell (textarea-field.tsx): auto-height box, py-3; zero Mud's
   inset-label margin reserve. Reason/description boxes stay compact
   (2 visible lines), so no 96px minimum here. */
.sco-field--area[b-aihfn62llp]  .mud-input.mud-input-outlined textarea.mud-input-slot {
    box-sizing: border-box;
    margin-top: 0;
    padding: 12px 14px;
    font-size: 14px;
    font-weight: 400;
    line-height: 1.625;
}

.sco-field[b-aihfn62llp]  .mud-input-label {
    font-size: 14px;
    font-weight: 400;
    line-height: 22px;
    letter-spacing: normal;
    color: var(--lw-gray-space);
}

/* Resting label geometrically centered in the 54px box (FieldShell: left
   13px). Mud's padding is !important, so ours must be too. */
.sco-field[b-aihfn62llp]  .mud-input-label-outlined {
    top: 50%;
    transform: translate(13px, -50%) scale(1);
    padding: 0 2px !important;
    transition: top 0.2s cubic-bezier(0, 0, 0.2, 1), transform 0.2s cubic-bezier(0, 0, 0.2, 1), color 0.2s;
}

/* Multiline shell: the label centers against the first line, not the box. */
.sco-field--area[b-aihfn62llp]  .mud-input-label-outlined {
    top: 23px;
}

/* Floated label: mirror Mud's shrink/focus selectors (4-class specificity);
   12px like FieldShell text-xs (scale 12/14 = .857). */
.sco-field[b-aihfn62llp]  .mud-shrink ~ label.mud-input-label.mud-input-label-inputcontrol.mud-input-label-outlined,
.sco-field[b-aihfn62llp]  .mud-input:focus-within ~ label.mud-input-label.mud-input-label-inputcontrol.mud-input-label-outlined {
    top: 0;
    transform: translate(13px, -6px) scale(0.857);
}

.sco-field[b-aihfn62llp]  .mud-shrink ~ label.mud-input-label.mud-input-label-inputcontrol.mud-input-label-outlined {
    color: var(--lw-gray-graphite);
}

/* Focused wins over floated (declared last at equal specificity). */
.sco-field[b-aihfn62llp]  .mud-input:focus-within ~ label.mud-input-label.mud-input-label-inputcontrol.mud-input-label-outlined {
    color: var(--lw-gray-phantom);
}

/* Border states -- FieldShell: rest --lw-input-border 1px; hover no change;
   focus 1px foreground (phantom). */
.sco-field[b-aihfn62llp]  .mud-input.mud-input-outlined:not(.mud-disabled):not(:focus-within):hover .mud-input-outlined-border {
    border-color: var(--lw-input-border);
}

.sco-field[b-aihfn62llp]  .mud-input.mud-input-outlined:focus-within > .mud-input-outlined-border,
.sco-field[b-aihfn62llp]  .mud-input.mud-input-outlined:focus-within .mud-shrink > .mud-input-outlined-border {
    border-width: 1px;
    border-color: var(--lw-gray-phantom);
}
/* _content/Ledgerwise/Components/Pages/Project/GcProjectDocuments.razor.rz.scp.css */
/* GC documents tab -- page-level layout only. All shared documents chrome
   lives in wwwroot/css/components/lw-doc.css (composes lw-table.css);
   toolbar chrome comes from lw-page.css + LwChip / LwViewToggle atoms.
   Source: ledgerwise-app organisms/gc/gc-documents.tsx COIs table
   (measured 2026-07-20). */

/* COIs: subcontractor column (reference w-[280px]) with stacked name +
   policy number. */
.gcdoc-coi-sub[b-x6st2mftsn] { width: 280px; flex: none; }

.gcdoc-coi-subinfo[b-x6st2mftsn] {
    display: flex;
    flex-direction: column;
    min-width: 0;
}

.gcdoc-coi-policy[b-x6st2mftsn] {
    font-size: 0.75rem;
    line-height: 16px;
    color: var(--lw-gray-space);
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

/* COI insurance-type pill reads as proper Pascal case (e.g. "General
   Liability"), overriding the shared status-chip's forced uppercase. */
.gcdoc-coi-type[b-x6st2mftsn]  .lw-status-chip { text-transform: none; letter-spacing: normal; }

/* Rows for subs with no COI file on record read at 60%. */
.gcdoc-dim[b-x6st2mftsn] { opacity: 0.6; }

/* Delete-confirmation dialog: destructive roundel + copy (reference
   DeleteConfirmationModal, gc-documents.tsx). */
.gcdoc-del-roundel[b-x6st2mftsn] {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 32px;
    height: 32px;
    border-radius: 9999px;
    background: var(--lw-status-error-bg);
    color: var(--lw-destructive);
}

.gcdoc-del-roundel[b-x6st2mftsn]  .mud-icon-root { width: 1rem; height: 1rem; }

.gcdoc-del-lead[b-x6st2mftsn] {
    margin: 0;
    font-size: 0.875rem;
    line-height: 1.625;
    color: var(--lw-text-primary);
}

.gcdoc-del-sub[b-x6st2mftsn] {
    margin: 0;
    font-size: 0.8125rem;
    line-height: 1.625;
    color: var(--lw-gray-graphite);
}
/* _content/Ledgerwise/Components/Pages/Project/LedgerEntryDrawer.razor.rz.scp.css */
/* Ledger entry bottom sheet (US-476).

   Anatomy copied from the canonical document sheet (HomeownerDocumentDrawer, measured
   from the reference OwnerDocumentDetailDrawer 2026-07-20): fixed shell toggled by the
   "open" class, scrim that fades, panel that slides up from the bottom over a muted
   surface with a 12px top radius, card head + scrolling body.

   Sized shorter than the document sheet -- that one previews a full page, this one shows
   two ControlCards -- so it takes its height from content up to a ceiling rather than
   always covering the viewport. */

.led-sheet[b-2q7p4jv0by] {
    position: fixed;
    inset: 0;
    z-index: var(--lw-z-sheet);
    visibility: hidden;
    pointer-events: none;
}

.led-sheet.open[b-2q7p4jv0by] {
    visibility: visible;
    pointer-events: auto;
}

.led-sheet-scrim[b-2q7p4jv0by] {
    position: absolute;
    inset: 0;
    background: var(--lw-scrim);
    backdrop-filter: var(--lw-scrim-blur);
    -webkit-backdrop-filter: var(--lw-scrim-blur);
    opacity: 0;
    transition: opacity 0.2s ease;
}

.led-sheet.open .led-sheet-scrim[b-2q7p4jv0by] { opacity: 1; }

.led-sheet-panel[b-2q7p4jv0by] {
    position: absolute;
    left: 0;
    right: 0;
    bottom: 0;
    /* Definite height, matching .cod-sheet / .ho-drawer-panel. A content-driven
       height was fine while the body scrolled itself, but the canonical container
       makes the body a flex frame with an overflow-y child, and that needs a
       bounded parent or the footer scrolls away with the content. */
    height: calc(100dvh - 48px);
    display: flex;
    flex-direction: column;
    overflow: hidden;
    border-radius: 12px 12px 0 0;
    background: var(--lw-bg-muted);
    box-shadow: var(--lw-shadow-lg);
    transform: translateY(100%);
    transition: transform 0.3s cubic-bezier(0.22, 1, 0.36, 1);
}

.led-sheet.open .led-sheet-panel[b-2q7p4jv0by] { transform: translateY(0); }

/* ---- Head ---- */

.led-sheet-head[b-2q7p4jv0by] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
    padding: 16px 24px;
    background: var(--lw-white);
    border-bottom: 1px solid var(--lw-border);
}

.led-sheet-titles[b-2q7p4jv0by] {
    min-width: 0;
}

.led-sheet-title[b-2q7p4jv0by] {
    margin: 0;
    font-family: var(--lw-font-family-heading);
    font-size: 16px;
    font-weight: var(--lw-font-bold);
    color: var(--lw-primary-dark);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.led-sheet-sub[b-2q7p4jv0by] {
    margin: 2px 0 0;
    font-size: 12px;
    font-weight: var(--lw-font-semibold);
    color: var(--lw-gray-graphite);
}

.led-sheet-headtools[b-2q7p4jv0by] {
    display: flex;
    align-items: center;
    gap: 12px;
    flex-shrink: 0;
}

.led-sheet-close[b-2q7p4jv0by] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 32px;
    height: 32px;
    padding: 0;
    border: 1px solid var(--lw-border);
    border-radius: var(--lw-radius-control);
    background: var(--lw-white);
    color: var(--lw-gray-graphite);
    cursor: pointer;
    transition: background 0.15s ease, color 0.15s ease;
}

.led-sheet-close:hover[b-2q7p4jv0by] {
    background: var(--lw-bg-muted);
    color: var(--lw-primary-dark);
}

.led-sheet-close[b-2q7p4jv0by]  .mud-icon-root {
    font-size: 18px;
    width: 18px;
    height: 18px;
}

/* ---- Body: the canonical detail-sheet container, matching .cod-body /
   .cod-content-wrap / .cod-content on ChangeOrderDetailModal. The body is the
   non-scrolling flex frame, the wrap scrolls and carries the responsive padding,
   and the content is a centred max-width column so cards do not stretch to the
   full viewport on a wide screen. ---- */

.led-sheet-body[b-2q7p4jv0by] {
    flex: 1;
    min-height: 0;
    display: flex;
    overflow: hidden;
}

.led-sheet-wrap[b-2q7p4jv0by] {
    flex: 1;
    min-width: 0;
    overflow-y: auto;
    padding: 1rem;
}

@media (min-width: 768px) {
    .led-sheet-wrap[b-2q7p4jv0by] { padding: 1.5rem 2rem; }
}

.led-sheet-content[b-2q7p4jv0by] {
    width: 100%;
    max-width: 62rem;
    margin: 0 auto;
    display: flex;
    flex-direction: column;
    gap: 1.25rem;
}

/* ---- Footer: white bar with a top hairline, secondary content pushed left
   (mirrors .cod-footer / .cod-btn-close). ---- */

.led-sheet-foot[b-2q7p4jv0by] {
    flex-shrink: 0;
    display: flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.75rem 1rem;
    background: var(--lw-white);
    border-top: 1px solid var(--lw-border);
}

@media (min-width: 768px) {
    .led-sheet-foot[b-2q7p4jv0by] { padding: 0.75rem 1.5rem; }
}

.led-sheet-foot-secondary[b-2q7p4jv0by] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    margin-right: auto;
    min-width: 0;
}

.led-sheet-foot-hint[b-2q7p4jv0by] {
    font-size: 0.875rem;
    color: var(--lw-gray-graphite);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.led-btn-close[b-2q7p4jv0by] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    height: 36px;
    padding: 0 1rem;
    background: var(--lw-white);
    border: 1px solid var(--lw-border);
    border-radius: var(--lw-radius-control);
    cursor: pointer;
    font-size: 0.875rem;
    font-weight: var(--lw-font-medium);
    color: var(--lw-text-primary);
    font-family: var(--lw-font-family);
    transition: background 0.15s;
}

.led-btn-close:hover[b-2q7p4jv0by] {
    background: var(--lw-accent);
}

/* ---- Fact grid inside the Transaction card ---- */

.led-facts[b-2q7p4jv0by] {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(150px, 1fr));
    gap: 16px 24px;
}

.led-fact-label[b-2q7p4jv0by] {
    margin: 0 0 2px;
    font-size: 11px;
    font-weight: var(--lw-font-semibold);
    text-transform: uppercase;
    letter-spacing: 0.06em;
    color: var(--lw-gray-space);
}

.led-fact-value[b-2q7p4jv0by] {
    margin: 0;
    font-size: 14px;
    color: var(--lw-primary-dark);
}

.led-fact-value--debit[b-2q7p4jv0by]   { color: var(--lw-status-error-fg); font-variant-numeric: tabular-nums; }
.led-fact-value--credit[b-2q7p4jv0by]  { color: var(--lw-success-dark); font-variant-numeric: tabular-nums; }
.led-fact-value--balance[b-2q7p4jv0by] { font-weight: var(--lw-font-bold); font-variant-numeric: tabular-nums; }

/* ---- Breakdown rows (Flush card body) ---- */

.led-parts[b-2q7p4jv0by] {
    display: flex;
    flex-direction: column;
}

.led-part[b-2q7p4jv0by] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
    padding: 12px 16px;
    border-bottom: 1px solid var(--lw-border);
    font-size: 14px;
}

.led-part:last-child[b-2q7p4jv0by] {
    border-bottom: none;
}

.led-part-label[b-2q7p4jv0by] {
    color: var(--lw-text-primary);
}

.led-part-amount[b-2q7p4jv0by] {
    font-variant-numeric: tabular-nums;
    color: var(--lw-text-primary);
    white-space: nowrap;
}

.led-part--total[b-2q7p4jv0by] {
    background: var(--lw-bg-table-header);
}

.led-part--total .led-part-label[b-2q7p4jv0by],
.led-part--total .led-part-amount[b-2q7p4jv0by] {
    font-weight: var(--lw-font-bold);
    color: var(--lw-primary-dark);
}

@media (max-width: 767px) {
    .led-sheet-head[b-2q7p4jv0by] { padding: 14px 16px; }
}
/* _content/Ledgerwise/Components/Pages/Project/Project.razor.rz.scp.css */
/* Page-level styles only. The identity header is the shared
   LwProjectHeader component (Components/Shared/LwProjectHeader.razor);
   its chrome lives in that component's scoped CSS. */

/* Full-bleed shell -- cancels MainLayout's pa-6 gutters (same technique as
   .lw-page-shell) so the header + tab strip run edge-to-edge on white
   and the muted bg fills the rest, like the reference detail layout. */
.lw-project-detail-shell[b-49u9z49dir] {
    display: flex;
    flex-direction: column;
    margin: -24px;
    /* The stretched flex chain (MainLayout .lw-main-content ->
       .lw-content-shell:has(...) -> here) gives this real height; the old
       percentage min-height resolved to nothing (auto-height container). */
    flex: 1;
    background: var(--lw-bg-muted);
}

/* Loading / error / not-found states are direct children of the full-bleed
   shell -- restore the gutters the shell cancelled. */
.lw-project-detail-shell[b-49u9z49dir]  > .mud-stack,
.lw-project-detail-shell[b-49u9z49dir]  > .mud-alert {
    margin: 24px;
}

/* ============================================================
   Project tabs — underline-style nav, mirrors ledgerwise-ui.
   The tab nav is .mud-tabs-tabbar (NOT .mud-tabs-toolbar — that
   class does not exist in MudBlazor 8.x). The bottom border lives
   on the tabbar so the panels area can sit flush against it.
   Tab content background uses --lw-bg-muted (sand-neutral muted bg
   matching ledgerwise-ui's default --muted var(--lw-bg-muted)) so there is no
   visible white gap below the tab line.
   ============================================================ */

.project-tabs[b-49u9z49dir] {
    display: flex;
    flex-direction: column;
    flex: 1;
}

/* Tab nav strip — single full-width bottom border, fully transparent
   so the page background shows through. MudBlazor's defaults paint
   surface/action-hover backgrounds on several layers, all overridden. */
.project-tabs[b-49u9z49dir]  .mud-tabs,
.project-tabs[b-49u9z49dir]  .mud-tabs-tabbar,
.project-tabs[b-49u9z49dir]  .mud-tabs-tabbar-inner,
.project-tabs[b-49u9z49dir]  .mud-tabs-tabbar-content,
.project-tabs[b-49u9z49dir]  .mud-tabs-tabbar-wrapper {
    background-color: transparent !important;
}

/* Tab strip sits in the same white zone as the identity header (reference:
   tabs container is mt-4 px-6 inside the bg-background header block). The
   16px gap above the tabs is white, so it is padding on the white bar --
   a margin would let the shell's muted bg show through. Later rule, so its
   background wins over the transparent sweep above. */
.project-tabs[b-49u9z49dir]  .mud-tabs-tabbar {
    background-color: var(--lw-white) !important;
    border-bottom: 1px solid var(--lw-border);
    border-top: none;
    border-left: none;
    border-right: none;
    /* Never let tall panel content (full-bleed tabs like Invoices) squeeze
       the tab strip -- flex children shrink by default. */
    flex-shrink: 0;
    box-shadow: none;
    border-radius: 0;
    margin: 0;
    padding: 16px 24px 0;
}

.project-tabs[b-49u9z49dir]  .mud-tabs-tabbar-inner {
    min-height: 40px;
}

/* Reference tabs are content-sized (shrink-0) in a gap-8 row -- Mud gives
   every tab a 160px box, which spreads them across the bar and overflows;
   !important because Mud's own width rules win otherwise. */
.project-tabs[b-49u9z49dir]  .mud-tab {
    text-transform: none;
    font-size: 14px;
    font-weight: 500;
    color: var(--lw-gray-graphite);
    min-height: 40px;
    min-width: 0 !important;
    width: auto !important;
    flex: 0 0 auto;
    padding: 0;
    letter-spacing: 0;
    line-height: 1;
}

/* 32px between tabs = reference gap-8 on the nav row. Gap on the flex
   wrapper (the tabs' actual flex parent) -- a margin on .mud-tab loses to
   Mud's own rules. */
.project-tabs[b-49u9z49dir]  .mud-tabs-tabbar-wrapper {
    gap: 32px;
}

/* Native overflow scroll in place of Mud's hidden arrow buttons (reference:
   overflow-x-auto scrollbar-none). Only matters below ~1100px content width. */
.project-tabs[b-49u9z49dir]  .mud-tabs-tabbar-inner {
    overflow-x: auto;
    scrollbar-width: none;
}

.project-tabs[b-49u9z49dir]  .mud-tabs-tabbar-inner::-webkit-scrollbar {
    display: none;
}

/* Kill all tab background paints (default, hover, active, active+hover) */
.project-tabs[b-49u9z49dir]  .mud-tab,
.project-tabs[b-49u9z49dir]  .mud-tab:hover,
.project-tabs[b-49u9z49dir]  .mud-tab.mud-tab-active,
.project-tabs[b-49u9z49dir]  .mud-tab.mud-tab-active:hover {
    background-color: transparent !important;
}

/* Reference tab states: inactive content-secondary; hover AND active are
   foreground (#1E1E24, NOT navy); weight stays 500 in every state. */
.project-tabs[b-49u9z49dir]  .mud-tab:hover {
    color: var(--lw-text-primary);
}

.project-tabs[b-49u9z49dir]  .mud-tab.mud-tab-active {
    color: var(--lw-text-primary);
}

/* Reference has no scroll arrows (overflow-x-auto scrollbar-none). Hiding
   Mud's buttons also removes the phantom left inset they created. */
.project-tabs[b-49u9z49dir]  .mud-tabs-scroll-button {
    display: none;
}

/* No tab-level count badges: the reference (project-header.tsx getTabBadge)
   renders a count only on its Critical Tasks tab; Invoices / Payment
   Requests / Adjustments surface counts on their inner sub-tabs instead. */

/* Active-tab indicator -- 2px foreground bar spanning exactly the tab
   (reference: after:inset-x-0 after:bottom-0 after:h-0.5 ON THE TAB).
   Mud's JS-measured slider drifts against content-sized tabs + the 32px
   wrapper gap (underline wider/narrower than its label), so it is disabled.
   Drawn as an INSET BOX-SHADOW, not a pseudo-element: ::after on .mud-tab
   does not paint (verified live -- even unscoped injected rules vanish),
   and a shadow can neither clip nor misalign. */
.project-tabs[b-49u9z49dir]  .mud-tab-slider {
    display: none;
}

.project-tabs[b-49u9z49dir]  .mud-tab.mud-tab-active {
    box-shadow: inset 0 -2px 0 var(--lw-text-primary);
}

/* Panels container — flush against the tab line, sand-neutral muted bg.
   The flex column stretch (mud-tabs -> panels -> panel) lets tab content
   fill the shell's remaining height, so sticky bottom bars (e.g. the
   invoices bulk footer) can pin to the page bottom even when content is
   short. Heights are stable (no content-driven min-heights), so this does
   not feed the MudTabs re-measure loop. */
.project-tabs[b-49u9z49dir]  .mud-tabs {
    display: flex;
    flex-direction: column;
    flex: 1;
}

.project-tabs[b-49u9z49dir]  .mud-tabs-panels {
    background-color: var(--lw-bg-muted, var(--lw-bg-muted)) !important;
    margin: 0 !important;
    padding: 0 !important;
    border: none !important;
    box-shadow: none !important;
    border-radius: 0 !important;
    flex: 1;
    display: flex;
    flex-direction: column;
}

/* NOTE: tab HEADER buttons also carry the mud-tab-panel class -- always
   scope panel rules to children of .mud-tabs-panels. */
.project-tabs[b-49u9z49dir]  .mud-tabs-panels > .mud-tab-panel {
    background-color: var(--lw-bg-muted, var(--lw-bg-muted));
    margin: 0;
    flex: 1;
    display: flex;
    flex-direction: column;
}

/* The display:flex above out-specifies the UA's [hidden] rule -- re-assert it
   so inactive panels stay hidden. */
.project-tabs[b-49u9z49dir]  .mud-tabs-panels > .mud-tab-panel[hidden] {
    display: none !important;
}

/* GOTCHA (verified against MudBlazor 8.15 source, 2026-07-12): MudTabs
   applies PanelClass to the .mud-tabs-panels CONTAINER, not to each panel --
   so .project-tabs__panel and .mud-tabs-panels are the SAME element, and the
   `padding: 0 !important` above always wins. Panel content therefore renders
   FULL-BLEED (no 24px gutters); each tab's component owns its own inset.
   Do not add negative margins in tab content to "cancel" panel padding. */
.project-tabs[b-49u9z49dir]  .project-tabs__panel {
    background-color: var(--lw-bg-muted, var(--lw-bg-muted));
    margin: 0;
}

/* ============================================================
   Project setup steps panel — preserved from prior styling
   ============================================================ */

.project-setup-wrapper[b-49u9z49dir]  .project-details-panel {
    border: 1px solid var(--lw-border);
    border-radius: 0;
    background-color: var(--lw-white) !important;
    box-shadow: none !important;
    overflow: hidden;
}

.project-setup-wrapper[b-49u9z49dir]  .project-details-panel .mud-expansion-panel,
.project-setup-wrapper[b-49u9z49dir]  .project-details-panel .mud-expand-panel-content,
.project-setup-wrapper[b-49u9z49dir]  .project-details-panel .mud-expansion-panel-content {
    background-color: var(--lw-white) !important;
    box-shadow: none !important;
}

.project-setup-wrapper[b-49u9z49dir]  .project-details-panel .mud-expand-panel-header {
    flex-direction: row-reverse;
    justify-content: flex-end;
}

.project-setup-wrapper[b-49u9z49dir]  .mud-typography-body2 {
    color: var(--lw-gray-graphite) !important;
}

.project-setup-wrapper[b-49u9z49dir]  .mud-button-root {
    border-radius: 0;
    text-transform: none;
    font-weight: 600;
}
/* _content/Ledgerwise/Components/Pages/Project/ProjectChangeOrders.razor.rz.scp.css */
/* ProjectChangeOrders (GC Adjustments tab) -- page-level layout only.
   The reference GC adjustments page (ledgerwise-ui-app
   app/(app)/gc/projects/[id]/adjustments/page.tsx) is intentionally blank;
   this tab keeps its Blazor functionality (create/submit/detail) and mirrors
   the owner adjustments recipes so both tabs read identically. Source:
   organisms/owner/owner-adjustments.tsx + adjustment-status-pill.tsx
   (measured spec 2026-07-20; migrated 2026-07-21). GC pill tones: Draft and
   Under Review = neutral gray, Approved = success, Changes Requested = error.
   Table chrome: css/components/lw-table.css. Toolbar/search/action chrome:
   css/components/lw-page.css. Tabs: LwChip (Tab variant); pills: StatusChip.
   Tab content renders full-bleed in Project.razor's MudTabs (no negative
   margins) -- .pco-body owns the muted inset, like ProjectDrawRequests. */

.pco-page[b-ypa93g4hwg] {
    display: flex;
    flex-direction: column;
    flex: 1;
}

/* Toolbar stacks on mobile (reference: flex-col gap-3 below md). */
@media (max-width: 767px) {
    .pco-toolbar[b-ypa93g4hwg] {
        flex-direction: column;
        align-items: stretch;
        padding: 12px 16px;
    }

    .pco-toolbar .lw-page-search[b-ypa93g4hwg] {
        flex: 1;
        width: auto;
    }
}

/* Icon-only create button on very small screens. */
@media (max-width: 480px) {
    .pco-new-btn-label[b-ypa93g4hwg] {
        display: none;
    }
}

/* Muted content region (reference: flex-1 flex-col gap-4 bg-muted p-4 md:p-6). */
.pco-body[b-ypa93g4hwg] {
    display: flex;
    flex-direction: column;
    flex: 1;
    gap: 16px;
    padding: 16px;
    background: var(--lw-bg-muted);
}

@media (min-width: 768px) {
    .pco-body[b-ypa93g4hwg] {
        padding: 24px;
    }
}

/* ---- Desktop table card ---- */
.pco-table-card[b-ypa93g4hwg] {
    overflow-x: auto;
    border: 1px solid var(--lw-border);
    border-radius: var(--lw-radius-card);
    background: var(--lw-white);
    box-shadow: var(--lw-shadow-card);
}

.pco-table-card .lw-table[b-ypa93g4hwg] {
    min-width: 760px;
}

.pco-table-card .lw-table-tr[b-ypa93g4hwg] {
    outline: none;
}

.pco-table-card .lw-table-tr:focus-visible[b-ypa93g4hwg] {
    background: color-mix(in srgb, var(--lw-accent) 50%, transparent);
}

/* Column widths mirror the owner tab (Adjustment 220 / BA# 80 / Status 130 /
   Date 140 / Amount 110 right / actions 120). */
.pco-col-title[b-ypa93g4hwg]   { flex: 1 1 220px; min-width: 0; }
.pco-col-num[b-ypa93g4hwg]     { flex: 0 0 90px; min-width: 0; white-space: nowrap; }
.pco-col-status[b-ypa93g4hwg]  { flex: 0 0 170px; min-width: 0; }
.pco-col-date[b-ypa93g4hwg]    { flex: 1 0 140px; min-width: 0; white-space: nowrap; }
.pco-col-amount[b-ypa93g4hwg]  { flex: 0 0 130px; min-width: 0; justify-content: flex-end; text-align: right; }
.pco-col-actions[b-ypa93g4hwg] { flex: 0 0 130px; justify-content: flex-end; }

.pco-title[b-ypa93g4hwg] {
    min-width: 0;
    font-size: 14px;
    font-weight: var(--lw-font-semibold);
    color: var(--lw-text-primary);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

/* Signed delta: positive (budget increase) = destructive red; negative
   (reduction) = success green (spec section 0 semantics). */
.pco-amount[b-ypa93g4hwg] {
    font-size: 14px;
    font-weight: var(--lw-font-semibold);
    font-variant-numeric: tabular-nums;
    white-space: nowrap;
}

.pco-amount-pos[b-ypa93g4hwg] { color: var(--lw-status-error-fg); }
.pco-amount-neg[b-ypa93g4hwg] { color: var(--lw-status-success-fg); }

.pco-chev[b-ypa93g4hwg] {
    color: var(--lw-gray-graphite);
    flex-shrink: 0;
}

/* Draft-row Edit/Delete icon actions (32px outline squares). */
.pco-row-actions[b-ypa93g4hwg] {
    display: inline-flex;
    align-items: center;
    gap: 0.375rem;
    flex-shrink: 0;
}

.pco-icon-btn[b-ypa93g4hwg] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 32px;
    height: 32px;
    padding: 0;
    border: 1px solid var(--lw-border);
    border-radius: var(--lw-radius-control);
    background: var(--lw-white);
    color: var(--lw-gray-graphite);
    cursor: pointer;
    transition: background 0.12s, color 0.12s, border-color 0.12s;
    flex-shrink: 0;
}

.pco-icon-btn:hover[b-ypa93g4hwg] {
    background: var(--lw-bg-row-hover);
    color: var(--lw-primary-dark);
    border-color: var(--lw-primary-blue);
}

.pco-icon-btn-danger:hover[b-ypa93g4hwg] {
    color: var(--lw-status-error-fg);
    border-color: var(--lw-status-error-fg);
}

/* Row Submit: action-sm navy (same recipe as the owner row Approve). */
.pco-submit-btn[b-ypa93g4hwg] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 6px;
    height: 36px;
    padding: 0 16px;
    border: none;
    border-radius: var(--lw-radius-control);
    background: var(--lw-primary-dark);
    color: var(--lw-white);
    font-size: 13px;
    font-weight: var(--lw-font-medium);
    font-family: var(--lw-font-family);
    cursor: pointer;
    transition: background 0.15s ease;
    flex-shrink: 0;
    white-space: nowrap;
}

.pco-submit-btn:hover[b-ypa93g4hwg] {
    background: var(--lw-primary-dark-hover);
}

.pco-submit-btn:active[b-ypa93g4hwg] {
    transform: translateY(1px);
}

/* ---- Mobile card list ---- */
.pco-cards[b-ypa93g4hwg] {
    display: flex;
    flex-direction: column;
    gap: 8px;
}

.pco-card[b-ypa93g4hwg] {
    display: flex;
    flex-direction: column;
    gap: 8px;
    padding: 16px;
    border: 1px solid var(--lw-border);
    border-radius: var(--lw-radius-card);
    background: var(--lw-white);
    box-shadow: var(--lw-shadow-card);
    cursor: pointer;
    transition: background-color 0.15s ease;
    outline: none;
}

.pco-card:hover[b-ypa93g4hwg],
.pco-card:focus-visible[b-ypa93g4hwg] {
    background: color-mix(in srgb, var(--lw-accent) 50%, transparent);
}

/* Actionable (draft) cards: 2px brand-accent left edge. */
.pco-card--draft[b-ypa93g4hwg] {
    border-left: 2px solid var(--lw-primary-blue);
}

.pco-card-top[b-ypa93g4hwg] {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 12px;
}

.pco-card-top .pco-amount[b-ypa93g4hwg] {
    flex-shrink: 0;
}

.pco-card-meta[b-ypa93g4hwg] {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 8px;
    font-size: 12px;
    color: var(--lw-gray-graphite);
}

.pco-card-sep[b-ypa93g4hwg] {
    color: var(--lw-border);
}

.pco-card .pco-submit-btn[b-ypa93g4hwg] {
    align-self: flex-start;
}

/* Desktop table above md; cards below. */
@media (max-width: 767px) {
    .pco-table-card[b-ypa93g4hwg] {
        display: none;
    }
}

@media (min-width: 768px) {
    .pco-cards[b-ypa93g4hwg] {
        display: none;
    }
}

/* ---- Empty / no-results state (centered white card) ---- */
.pco-empty-state[b-ypa93g4hwg] {
    display: flex;
    flex-direction: column;
    align-items: center;
    align-self: center;
    width: 100%;
    max-width: 28rem;
    gap: 4px;
    padding: 48px 24px;
    border: 1px solid var(--lw-border);
    border-radius: var(--lw-radius-card);
    background: var(--lw-white);
    box-shadow: var(--lw-shadow-card);
    text-align: center;
}

.pco-empty-title[b-ypa93g4hwg] {
    font-size: 16px;
    font-weight: var(--lw-font-semibold);
    color: var(--lw-text-primary);
    margin: 0;
}

.pco-empty-sub[b-ypa93g4hwg] {
    margin: 0;
    font-size: 14px;
    line-height: 1.6;
    color: var(--lw-gray-graphite);
}

.pco-empty-action[b-ypa93g4hwg] {
    margin-top: 16px;
}

/* ---- Summary strip: canonical KPI cards (kpi-card.tsx / cpo-kpi recipe) ---- */
.pco-summary[b-ypa93g4hwg] {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 1rem;
}

@media (min-width: 768px) {
    .pco-summary[b-ypa93g4hwg] {
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }
}

.pco-summary-item[b-ypa93g4hwg] {
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    min-height: 116px;
    padding: 1.25rem;
    border: 1px solid var(--lw-border);
    border-radius: var(--lw-radius-card);
    background: var(--lw-white);
    box-shadow: var(--lw-shadow-card);
}

.pco-summary-label[b-ypa93g4hwg] {
    font-size: 11px;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.1em;
    color: var(--lw-gray-graphite);
}

/* Reference kpi-card.tsx: text-xl on mobile, 32px from md up. */
.pco-summary-value[b-ypa93g4hwg] {
    font-size: 20px;
    font-weight: 700;
    line-height: 1;
    letter-spacing: -0.02em;
    font-family: var(--lw-font-family-heading, sans-serif);
    font-variant-numeric: tabular-nums;
    color: var(--lw-text-primary);
    margin-top: 0.25rem;
}

@media (min-width: 768px) {
    .pco-summary-value[b-ypa93g4hwg] {
        font-size: 32px;
    }
}

.pco-summary-value-pos[b-ypa93g4hwg] { color: var(--lw-status-error-fg); }
.pco-summary-value-neg[b-ypa93g4hwg] { color: var(--lw-status-success-fg); }
/* _content/Ledgerwise/Components/Pages/Project/ProjectClientUsersCard.razor.rz.scp.css */
/* Project owner's team card internals (US-665) -- the card chrome is the shared
   ControlCard. Header action + row rhythm mirror ProjectCommunicationRecipients
   (reference Button variant="outline" size="action-sm"). */

.pcu-add[b-00vwqphngn] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 6px;
    height: 36px;
    padding: 0 16px;
    border: 1px solid var(--lw-border);
    border-radius: var(--lw-radius-control);
    background: var(--lw-white);
    color: var(--lw-text-primary);
    cursor: pointer;
    font-family: inherit;
    font-size: 13px;
    font-weight: 500;
    transition: background-color 0.15s ease;
}

.pcu-add:hover[b-00vwqphngn] {
    background: var(--lw-accent);
}

.pcu-add[b-00vwqphngn]  .mud-icon-root {
    width: 16px;
    height: 16px;
    font-size: 16px;
    color: currentColor !important;
}

.pcu-rows[b-00vwqphngn] {
    display: flex;
    flex-direction: column;
    gap: 12px;
}

.pcu-empty[b-00vwqphngn] {
    margin: 0;
    font-size: 14px;
    color: var(--lw-gray-graphite);
}
/* _content/Ledgerwise/Components/Pages/Project/ProjectCommunicationRecipients.razor.rz.scp.css */
/* Communication-recipients card internals -- the card chrome is the shared
   ControlCard. Header action = reference Button variant="outline"
   size="action-sm" (h-36, px-16, 13/500, 16px leading icon, hover accent).
   Row remove = the canonical lw-row-icon-btn--danger ghost icon button. */

.pcr-add[b-h8nfxzcter] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 6px;
    height: 36px;
    padding: 0 16px;
    border: 1px solid var(--lw-border);
    border-radius: var(--lw-radius-control);
    background: var(--lw-white);
    color: var(--lw-text-primary);
    cursor: pointer;
    font-family: inherit;
    font-size: 13px;
    font-weight: 500;
    transition: background-color 0.15s ease;
}

.pcr-add:hover[b-h8nfxzcter] {
    background: var(--lw-accent);
}

.pcr-add[b-h8nfxzcter]  .mud-icon-root {
    width: 16px;
    height: 16px;
    font-size: 16px;
    color: currentColor !important;
}

/* Recipient rows -- same PartyMemberRow stack rhythm as the team roster. */
.pcr-rows[b-h8nfxzcter] {
    display: flex;
    flex-direction: column;
    gap: 12px;
}
/* _content/Ledgerwise/Components/Pages/Project/ProjectDrawRequests.razor.rz.scp.css */
/* ProjectDrawRequests (Payment Requests tab) -- page-level layout only.
   Source: ledgerwise-app organisms/gc/gc-payment-requests.tsx, measured live
   on localhost:3005 project 104 (2026-07-12): toolbar tab 8px/14px r8 navy
   active + shadow-sm, count 18px r8, active amount 13/700 tabular white-70
   behind a 1px white-20 divider (ml-4 pl-8); th 12/16px 14/500 graphite on
   table-header bg; rows h47 cursor-pointer accent/50 hover; Request 14/700,
   Date + Invoices content-secondary, Amount right 14/600 tabular; chevron
   16px graphite; card r8 hairline + card shadow.
   Table/checkbox/kebab/pager chrome: css/components/lw-table.css.
   Toolbar/search/action/empty chrome: css/components/lw-page.css.
   Tabs: LwChip (Tab variant + Amount); badges: StatusChip.
   The draft submit banner is Blazor-specific (no reference equivalent) and
   keeps its navy strip styling.
   NOTE: tab content renders full-bleed (MudTabs PanelClass gotcha in
   Project.razor.css) -- no negative margins, .pdr-body owns the inset. */

.pdr-page[b-o39k9uwh0d] {
    display: flex;
    flex-direction: column;
    flex: 1;
}

/* Toolbar stacks on mobile (reference: flex-col gap-3 below md). */
@media (max-width: 767px) {
    .pdr-toolbar[b-o39k9uwh0d] {
        flex-direction: column;
        align-items: stretch;
        padding: 12px 16px;
    }
}

/* Muted content region (reference: flex-1 flex-col gap-4 bg-muted p-4 md:p-6). */
.pdr-body[b-o39k9uwh0d] {
    display: flex;
    flex-direction: column;
    flex: 1;
    gap: 16px;
    padding: 16px;
}

@media (min-width: 768px) {
    .pdr-body[b-o39k9uwh0d] {
        padding: 24px;
    }
}

/* ---- Search ---- */

.pdr-search-wrap[b-o39k9uwh0d] {
    position: relative;
    flex: 1;
}

@media (min-width: 768px) {
    .pdr-search-wrap[b-o39k9uwh0d] {
        flex: 0 0 auto;
    }

    /* Reference PR search is narrower than invoices: lg:w-52 (208px) --
       the lw-page-search default; no override needed beyond mobile. */
}

@media (max-width: 767px) {
    .pdr-search-wrap .lw-page-search[b-o39k9uwh0d] {
        width: 100%;
    }
}

.pdr-search-clear[b-o39k9uwh0d] {
    position: absolute;
    right: 8px;
    top: 50%;
    transform: translateY(-50%);
    display: flex;
    align-items: center;
    justify-content: center;
    width: 20px;
    height: 20px;
    padding: 0;
    border: 0;
    background: transparent;
    color: var(--lw-gray-space);
    cursor: pointer;
}

.pdr-search-clear:hover[b-o39k9uwh0d] {
    color: var(--lw-text-primary);
}

/* Icon-only Create button on very small screens. */
@media (max-width: 480px) {
    .pdr-add-btn-label[b-o39k9uwh0d] {
        display: none;
    }
}

/* ---- Draft submit banner ----
   Reference "Next disbursement" gradient card (gc-payment-requests.tsx,
   measured 2026-07-12): rounded-card, 135deg brand-accent -> blue-light ->
   gold, white text, card shadow (hover lifts to shadow-lg + 6% white veil);
   p-6 md:p-7 with right room for the chevron; eyebrow 11/700 uppercase
   tracking .14em white/90 with 16px icon; hero amount 34px (md 40px) bold
   tracking-tight tabular; meta 14/500 white/80; note 14px white/85 with
   semibold white highlights; 20px chevron at right, sidebar-bg/60. */

.pdr-banner[b-o39k9uwh0d] {
    position: relative;
    display: flex;
    flex-direction: column;
    padding: 24px;
    border: 0;
    border-radius: var(--lw-radius-card);
    background: linear-gradient(135deg, var(--lw-primary-blue), var(--lw-primary-blue-light), var(--lw-primary-gold));
    color: var(--lw-white);
    box-shadow: var(--lw-shadow-card);
    cursor: pointer;
    overflow: hidden;
    transition: box-shadow 0.15s ease;
}

.pdr-banner:hover[b-o39k9uwh0d] {
    box-shadow: var(--lw-shadow-lg);
}

/* Hover veil (reference: group-hover white/6 overlay). */
.pdr-banner[b-o39k9uwh0d]::after {
    content: "";
    position: absolute;
    inset: 0;
    background: transparent;
    pointer-events: none;
    transition: background-color 0.15s ease;
}

.pdr-banner:hover[b-o39k9uwh0d]::after {
    background: color-mix(in srgb, var(--lw-white) 6%, transparent);
}

@media (min-width: 768px) {
    .pdr-banner[b-o39k9uwh0d] {
        padding: 28px 64px 28px 28px;
    }
}

.pdr-banner-eyebrow[b-o39k9uwh0d] {
    display: flex;
    align-items: center;
    gap: 8px;
    font-size: 11px;
    font-weight: var(--lw-font-bold);
    text-transform: uppercase;
    letter-spacing: 0.14em;
    color: color-mix(in srgb, var(--lw-white) 90%, transparent);
}

.pdr-banner-eyebrow[b-o39k9uwh0d]  .pdr-banner-eyebrow-icon.mud-icon-root {
    font-size: 16px;
    width: 16px;
    height: 16px;
    flex-shrink: 0;
    color: var(--lw-white);
}

.pdr-banner-hero[b-o39k9uwh0d] {
    display: flex;
    flex-wrap: wrap;
    align-items: baseline;
    column-gap: 12px;
    row-gap: 4px;
    margin-top: 12px;
}

.pdr-banner-amount[b-o39k9uwh0d] {
    font-size: 34px;
    font-weight: var(--lw-font-bold);
    line-height: 1;
    letter-spacing: var(--lw-tracking-tight);
    font-variant-numeric: tabular-nums;
}

@media (min-width: 768px) {
    .pdr-banner-amount[b-o39k9uwh0d] {
        font-size: 40px;
    }
}

.pdr-banner-meta[b-o39k9uwh0d] {
    font-size: 14px;
    font-weight: 500;
    color: color-mix(in srgb, var(--lw-white) 80%, transparent);
}

.pdr-banner-note[b-o39k9uwh0d] {
    margin: 14px 0 0;
    font-size: 14px;
    line-height: 1.625;
    color: color-mix(in srgb, var(--lw-white) 85%, transparent);
}

.pdr-banner-note span[b-o39k9uwh0d] {
    font-weight: var(--lw-font-semibold);
    color: var(--lw-white);
}

/* Whole-card affordance chevron (md+ only, like the reference). */
.pdr-banner[b-o39k9uwh0d]  .pdr-banner-chevron.mud-icon-root {
    display: none;
    position: absolute;
    right: 24px;
    top: 50%;
    transform: translateY(-50%);
    font-size: 20px;
    width: 20px;
    height: 20px;
    color: color-mix(in srgb, var(--lw-primary-dark) 60%, transparent);
    transition: transform 0.15s ease;
}

.pdr-banner:hover[b-o39k9uwh0d]  .pdr-banner-chevron.mud-icon-root {
    transform: translateY(-50%) translateX(2px);
}

@media (min-width: 768px) {
    .pdr-banner[b-o39k9uwh0d]  .pdr-banner-chevron.mud-icon-root {
        display: block;
    }
}


/* ---- Desktop table column layout (chrome in lw-table.css) ---- */

.pdr-table[b-o39k9uwh0d] {
    display: none;
}

@media (min-width: 768px) {
    .pdr-table[b-o39k9uwh0d] {
        display: flex;
    }
}

/* Reference min-widths: Request 120 / Status 140 / Date 180 / Invoices 110 /
   Amount 120 right / chevron w-10; Date and Amount take the slack. */
.pdr-col-request[b-o39k9uwh0d] {
    flex: 0 0 140px;
    min-width: 0;
}

.pdr-col-status[b-o39k9uwh0d] {
    flex: 0 0 160px;
    min-width: 0;
}

.pdr-col-date[b-o39k9uwh0d] {
    flex: 1 1 180px;
    min-width: 0;
    white-space: nowrap;
}

.pdr-col-invoices[b-o39k9uwh0d] {
    flex: 0 0 120px;
    min-width: 0;
}

.pdr-col-amount[b-o39k9uwh0d] {
    flex: 1 1 120px;
    min-width: 0;
    justify-content: flex-end;
    text-align: right;
}

.pdr-col-chevron[b-o39k9uwh0d] {
    flex: 0 0 40px;
    justify-content: center;
    padding: 12px 8px;
}

.pdr-request-number[b-o39k9uwh0d] {
    font-weight: var(--lw-font-bold);
    color: var(--lw-text-primary);
}

.pdr-amount[b-o39k9uwh0d] {
    font-weight: var(--lw-font-semibold);
    font-variant-numeric: tabular-nums;
    color: var(--lw-text-primary);
}

/* MudIcon is a child component -- its svg lacks this file's scope attribute,
   so the rule must pierce via ::deep from the scoped cell div. */
.pdr-col-chevron[b-o39k9uwh0d]  .pdr-chevron.mud-icon-root {
    font-size: 16px;
    width: 16px;
    height: 16px;
    color: var(--lw-gray-graphite);
}

/* ---- Mobile cards (reference inline mobile cards) ---- */

.pdr-cards[b-o39k9uwh0d] {
    display: flex;
    flex-direction: column;
    gap: 8px;
}

@media (min-width: 768px) {
    .pdr-cards[b-o39k9uwh0d] {
        display: none;
    }
}

.pdr-card[b-o39k9uwh0d] {
    display: flex;
    flex-direction: column;
    gap: 8px;
    padding: 16px;
    background: var(--lw-white);
    border: 1px solid var(--lw-border);
    border-radius: var(--lw-radius-card);
    box-shadow: var(--lw-shadow-card);
    cursor: pointer;
    transition: background-color 0.15s ease;
}

.pdr-card:hover[b-o39k9uwh0d] {
    background: color-mix(in srgb, var(--lw-accent) 50%, transparent);
}

/* Created/queued rows: blue left accent (border-l-2 brand accent). */
.pdr-card--upcoming[b-o39k9uwh0d] {
    border-left: 2px solid var(--lw-primary-blue);
}

.pdr-card-top[b-o39k9uwh0d] {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 12px;
}

.pdr-card-id[b-o39k9uwh0d] {
    display: flex;
    align-items: center;
    gap: 8px;
    min-width: 0;
    font-size: 14px;
}

.pdr-card-meta[b-o39k9uwh0d] {
    display: flex;
    align-items: center;
    gap: 8px;
    font-size: 12px;
    color: var(--lw-gray-graphite);
}

.pdr-card-sep[b-o39k9uwh0d] {
    color: var(--lw-border);
}
/* _content/Ledgerwise/Components/Pages/Project/ProjectInvoices.razor.rz.scp.css */
/* ProjectInvoices -- page-level layout only.
   Source: ledgerwise-app organisms/gc/gc-invoice-table.tsx (subhead toolbar,
   column widths, bulk footer) + molecules/invoice-card.tsx (mobile cards) +
   molecules/status-cell-tooltip.tsx (stage roadmap tooltip), 2026-07-12.
   Table/pager/checkbox/kebab chrome: css/components/lw-table.css.
   Toolbar/search/action-button/empty chrome: css/components/lw-page.css.
   Status pills: LwChip (tab variant); badge: StatusChip; dots:
   LwInvoiceTracking; avatar: LwAvatar. */

/* Page shell. ALREADY full-bleed: MudBlazor 8 applies MudTabs' PanelClass to
   the .mud-tabs-panels CONTAINER (not per panel), and Project.razor.css zeroes
   that container's padding with !important -- so panel content starts flush
   under the tab strip with no gutters. No negative margins here (they painted
   the toolbar 24px over the tab strip); .pi-body owns the content inset.
   Also no min-height inflation (it feeds the MudTabs re-measure loop). */
.pi-page[b-qzui8yrn9d] {
    display: flex;
    flex-direction: column;
    /* Fill the stretched panel so .pi-body reaches the page bottom and the
       sticky bulk footer (margin-top auto) pins there. */
    flex: 1;
}

/* Toolbar: shared .lw-page-toolbar chrome; stacks on mobile (reference:
   flex-col gap-3 below md). */
@media (max-width: 767px) {
    .pi-toolbar[b-qzui8yrn9d] {
        flex-direction: column;
        align-items: stretch;
        padding: 12px 16px;
    }
}

/* Muted content region under the toolbar (reference: flex-1 flex-col gap-4
   bg-muted p-4 md:p-6). The tab panel already paints --lw-bg-muted. */
.pi-body[b-qzui8yrn9d] {
    display: flex;
    flex-direction: column;
    flex: 1;
    gap: 16px;
    padding: 16px;
}

@media (min-width: 768px) {
    .pi-body[b-qzui8yrn9d] {
        padding: 24px;
    }
}

/* ---- Search + suggestions ---- */

.pi-search-wrap[b-qzui8yrn9d] {
    position: relative;
    flex: 1;
}

@media (min-width: 768px) {
    .pi-search-wrap[b-qzui8yrn9d] {
        flex: 0 0 auto;
    }

    /* Reference search is w-64 (256px) on this toolbar. */
    .pi-search-wrap .lw-page-search[b-qzui8yrn9d] {
        width: 256px;
    }
}

@media (max-width: 767px) {
    .pi-search-wrap .lw-page-search[b-qzui8yrn9d] {
        width: 100%;
    }
}

.pi-search-clear[b-qzui8yrn9d] {
    position: absolute;
    right: 8px;
    top: 50%;
    transform: translateY(-50%);
    display: flex;
    align-items: center;
    justify-content: center;
    width: 20px;
    height: 20px;
    padding: 0;
    border: 0;
    background: transparent;
    color: var(--lw-gray-space);
    cursor: pointer;
}

.pi-search-clear:hover[b-qzui8yrn9d] {
    color: var(--lw-text-primary);
}

/* Autocomplete popover (reference: min-w-280, py-1, popover shadow pair). */
.pi-suggestions[b-qzui8yrn9d] {
    position: absolute;
    left: 0;
    top: calc(100% + 4px);
    z-index: 50;
    min-width: 280px;
    padding: 4px 0;
    background: var(--lw-white);
    box-shadow: var(--lw-shadow-popover);
}

.pi-suggestion[b-qzui8yrn9d] {
    display: flex;
    align-items: center;
    gap: 12px;
    width: 100%;
    padding: 8px 14px;
    border: 0;
    background: transparent;
    font-family: var(--lw-font-family);
    font-size: 14px;
    line-height: 22px;
    color: var(--lw-text-primary);
    text-align: left;
    cursor: pointer;
}

.pi-suggestion-active[b-qzui8yrn9d] {
    background: var(--lw-accent);
}

.pi-suggestion-label[b-qzui8yrn9d] {
    flex: 1;
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.pi-suggestion-tag[b-qzui8yrn9d] {
    flex-shrink: 0;
    font-size: 11px;
    color: var(--lw-gray-space);
}

/* Hide the Add Invoice label on very small screens (icon-only button). */
@media (max-width: 480px) {
    .pi-add-btn-label[b-qzui8yrn9d] {
        display: none;
    }
}

/* ---- Desktop table column layout (chrome lives in lw-table.css) ---- */

.pi-table[b-qzui8yrn9d] {
    display: none;
    /* Clip horizontally (keeps content within the card's rounded edges) but
       allow vertical overflow so the status hover tooltip can float below the
       grid even when there is only a single short row. Per the CSS overflow
       spec, a clip/visible pair on the two axes is preserved as-is. */
    overflow-x: clip;
    overflow-y: visible;
}

@media (min-width: 768px) {
    .pi-table[b-qzui8yrn9d] {
        display: flex;
    }
}

.pi-col[b-qzui8yrn9d] {
    flex: 1 1 0;
    min-width: 0;
}

.pi-col-vendor[b-qzui8yrn9d] {
    flex: 0 0 300px;
    min-width: 0;
    gap: 12px;
}

.pi-col-checkbox[b-qzui8yrn9d] {
    flex: 0 0 48px;
    justify-content: center;
    cursor: default;
}

.pi-col-actions[b-qzui8yrn9d] {
    flex: 0 0 48px;
    justify-content: center;
    gap: 8px;
    padding: 0;
    cursor: default;
}

/* Lien-waiver tab: actions column expands to fit Sign Lien button + menu
   (reference reserves min-w-[160px] when a wide CTA is on the page). */
.pi-table[data-filter="lien-waiver"] .pi-col-actions[b-qzui8yrn9d] {
    flex: 0 0 180px;
    justify-content: flex-end;
    gap: 12px;
    padding: 0 12px;
}

/* ---- Status cell: badge + tracking dots + hover roadmap tooltip ---- */

.pi-status-stack[b-qzui8yrn9d] {
    position: relative;
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 4px;
}

/* Status pills carry the full user-facing status name (US-583); long labels
   wrap inside the cell instead of overflowing the column. */
.pi-status-stack[b-qzui8yrn9d]  .lw-status-chip {
    white-space: normal;
    text-align: left;
    height: auto;
    min-height: 24px;
    padding: 3px 6px;
    line-height: 1.3;
}

/* Roadmap tooltip (status-cell-tooltip.tsx): 200px card, rounded, py-3,
   16px round nodes with 1.5px connectors; done = success-dark, active =
   brand-accent ring with square inner dot, future = tracking-grey. */
.pi-tracking-tip[b-qzui8yrn9d] {
    display: none;
    position: absolute;
    top: calc(100% + 8px);
    left: -8px;
    z-index: 100;
    width: 200px;
    background: var(--lw-white);
    border-radius: var(--lw-radius-sm);
    box-shadow: 0 4px 24px rgba(0, 0, 0, 0.12);
    padding: 12px 0;
    pointer-events: none;
    flex-direction: column;
}

.pi-status-stack:hover .pi-tracking-tip[b-qzui8yrn9d] {
    display: flex;
}

.pi-tip-row[b-qzui8yrn9d] {
    display: flex;
    align-items: stretch;
    padding: 0 14px;
}

.pi-tip-track[b-qzui8yrn9d] {
    display: flex;
    flex-direction: column;
    align-items: center;
    width: 16px;
    flex-shrink: 0;
}

.pi-tip-node[b-qzui8yrn9d] {
    width: 16px;
    height: 16px;
    flex-shrink: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    margin-top: 2px;
    border-radius: 50%;
}

.pi-tip-done[b-qzui8yrn9d] {
    background: var(--lw-success-dark);
    color: var(--lw-white);
}

.pi-tip-active[b-qzui8yrn9d] {
    border: 1.5px solid var(--lw-primary-blue);
    background: var(--lw-white);
}

.pi-tip-future[b-qzui8yrn9d] {
    border: 1.5px solid var(--lw-tracking-grey);
    background: var(--lw-white);
}

/* Reference active inner marker is a 6px SQUARE (size-1.5, no rounding). */
.pi-tip-active-dot[b-qzui8yrn9d] {
    width: 6px;
    height: 6px;
    background: var(--lw-primary-blue);
}

.pi-tip-line[b-qzui8yrn9d] {
    width: 1.5px;
    flex: 1;
    background: var(--lw-tracking-grey);
    min-height: 8px;
}

.pi-tip-line-done[b-qzui8yrn9d] {
    background: var(--lw-success-dark);
}

.pi-tip-content[b-qzui8yrn9d] {
    padding-left: 10px;
    display: flex;
    flex-direction: column;
    min-width: 0;
    flex: 1;
}

.pi-tip-content-gap[b-qzui8yrn9d] {
    padding-bottom: 10px;
}

.pi-tip-label[b-qzui8yrn9d] {
    display: block;
    font-size: 12px;
    font-weight: 500;
    line-height: 18px;
}

.pi-tip-label-done[b-qzui8yrn9d] {
    color: var(--lw-success-dark);
}

.pi-tip-label-active[b-qzui8yrn9d] {
    color: var(--lw-primary-blue);
}

.pi-tip-label-future[b-qzui8yrn9d] {
    color: var(--lw-gray-space);
}

.pi-tip-date[b-qzui8yrn9d] {
    display: block;
    font-size: 10px;
    line-height: 13px;
    color: var(--lw-gray-space);
}

/* ---- Sticky bulk-action footer ----
   Reference: sticky bottom bar over the content area -- white, top hairline,
   upward shadow; "N selected" + running total left, actions right. */
.pi-bulk-bar[b-qzui8yrn9d] {
    position: sticky;
    bottom: 0;
    z-index: 20;
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    column-gap: 16px;
    row-gap: 8px;
    margin: auto -16px -16px;
    padding: 12px 16px;
    background: var(--lw-white);
    border-top: 1px solid var(--lw-border);
    box-shadow: 0 -4px 16px rgba(2, 11, 43, 0.08);
}

@media (min-width: 768px) {
    .pi-bulk-bar[b-qzui8yrn9d] {
        margin: auto -24px -24px;
        padding: 12px 24px;
    }
}

.pi-bulk-count[b-qzui8yrn9d] {
    font-size: 14px;
    font-weight: var(--lw-font-semibold);
    color: var(--lw-text-primary);
}

.pi-bulk-total[b-qzui8yrn9d] {
    font-size: 14px;
    font-variant-numeric: tabular-nums;
    color: var(--lw-gray-graphite);
}

.pi-bulk-actions[b-qzui8yrn9d] {
    display: flex;
    align-items: center;
    gap: 8px;
    margin-left: auto;
}

/* Quiet text actions (reference: h-9 px-2.5 13px/500 content-secondary,
   foreground on hover; Delete keeps a destructive hover). */
.pi-bulk-text[b-qzui8yrn9d] {
    display: flex;
    align-items: center;
    height: 36px;
    padding: 0 10px;
    border: 0;
    background: transparent;
    font-family: var(--lw-font-family);
    font-size: 13px;
    font-weight: 500;
    color: var(--lw-gray-graphite);
    cursor: pointer;
    transition: color 0.15s ease;
}

.pi-bulk-text:hover[b-qzui8yrn9d] {
    color: var(--lw-text-primary);
}

.pi-bulk-text--danger:hover[b-qzui8yrn9d] {
    color: var(--lw-status-error-fg);
}

.pi-bulk-pr-short[b-qzui8yrn9d] {
    display: none;
}

@media (max-width: 640px) {
    .pi-bulk-pr-long[b-qzui8yrn9d] {
        display: none;
    }

    .pi-bulk-pr-short[b-qzui8yrn9d] {
        display: inline;
    }
}

/* ---- Mobile cards (invoice-card.tsx) ---- */

.pi-cards[b-qzui8yrn9d] {
    display: flex;
    flex-direction: column;
}

@media (min-width: 768px) {
    .pi-cards[b-qzui8yrn9d] {
        display: none;
    }
}

.pi-card[b-qzui8yrn9d] {
    display: flex;
    flex-direction: column;
    gap: 12px;
    padding: 16px;
    border-bottom: 1px solid var(--lw-border);
    cursor: pointer;
    transition: background-color 0.12s ease;
}

.pi-card:last-child[b-qzui8yrn9d] {
    border-bottom: 0;
}

.pi-card:active[b-qzui8yrn9d] {
    background: var(--lw-accent);
}

.pi-card-top[b-qzui8yrn9d] {
    display: flex;
    align-items: flex-start;
    gap: 12px;
}

.pi-card-check[b-qzui8yrn9d] {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 24px;
    height: 24px;
    flex-shrink: 0;
}

.pi-card-identity[b-qzui8yrn9d] {
    display: flex;
    flex-direction: column;
    gap: 2px;
    min-width: 0;
    flex: 1;
}

.pi-card-name[b-qzui8yrn9d] {
    font-size: 15px;
    font-weight: var(--lw-font-semibold);
    color: var(--lw-text-primary);
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.pi-card-num[b-qzui8yrn9d] {
    font-size: 12px;
    color: var(--lw-gray-space);
}

.pi-card-amount[b-qzui8yrn9d] {
    flex-shrink: 0;
    font-size: 16px;
    font-weight: var(--lw-font-semibold);
    color: var(--lw-text-primary);
}

.pi-card-meta-row[b-qzui8yrn9d] {
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.pi-card-date[b-qzui8yrn9d] {
    font-size: 12px;
    color: var(--lw-gray-space);
}

/* ---- Delete dialog row ---- */

/* Destructive roundel in the delete-confirm headers (canonical recipe). */
.pi-roundel[b-qzui8yrn9d] {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 32px;
    height: 32px;
    border-radius: 9999px;
    background: var(--lw-status-error-bg);
    color: var(--lw-destructive);
}

.pi-roundel[b-qzui8yrn9d]  .mud-icon-root { width: 1rem; height: 1rem; }

.pi-delete-copy[b-qzui8yrn9d] {
    margin: 0;
    font-size: 0.875rem;
    color: var(--lw-gray-graphite);
    line-height: 1.5;
}

.pi-delete-row[b-qzui8yrn9d] {
    display: flex;
    flex-direction: column;
    gap: 2px;
    padding: 12px;
    background: var(--lw-bg-muted);
    border-radius: var(--lw-radius-control);
}

.pi-delete-row strong[b-qzui8yrn9d] {
    font-size: 14px;
    color: var(--lw-text-primary);
}

.pi-delete-row span[b-qzui8yrn9d] {
    font-size: 12px;
    color: var(--lw-gray-graphite);
}
/* _content/Ledgerwise/Components/Pages/Project/ProjectKickoffOverview.razor.rz.scp.css */
/* Stack the draft card + detail sections (and the sent-state card) with consistent spacing,
   centered in a max-width column on the muted page background (mirrors ledgerwise-ui's
   ProjectOverview wrapper: mx-auto max-w-[1100px]). */
.kickoff-wrapper[b-qtrlb9gjeu] {
    display: flex;
    flex-direction: column;
    gap: 16px;
    width: 100%;
    max-width: 1100px;
    margin-inline: auto;
}

/* ============================================================
   Draft kickoff checklist (mirrors ledgerwise-ui ProjectKickoffChecklist)
   ============================================================ */
.kc-card[b-qtrlb9gjeu] {
    border: 1px solid var(--lw-border);
    border-radius: var(--lw-radius-card);
    background: var(--lw-form-surface);
    box-shadow: var(--lw-shadow-card);
    overflow: hidden;
}

.kc-head[b-qtrlb9gjeu] {
    display: flex;
    align-items: center;
    gap: 14px;
    border-bottom: 1px solid var(--lw-border);
    background: var(--lw-white);
    padding: 16px 24px;
}

.kc-head__icon[b-qtrlb9gjeu] {
    flex-shrink: 0;
    width: 44px;
    height: 44px;
    border-radius: var(--lw-radius-card);
    display: inline-flex;
    align-items: center;
    justify-content: center;
    background: var(--lw-status-info-bg);
}

.kc-head__icon[b-qtrlb9gjeu]  .mud-icon-root {
    width: 20px;
    height: 20px;
    font-size: 20px;
    color: var(--lw-primary-blue) !important;
}

.kc-head__title[b-qtrlb9gjeu] {
    margin: 0;
    font-size: 1rem;
    font-weight: 700;
    color: var(--lw-text-primary);
}

.kc-head__sub[b-qtrlb9gjeu] {
    margin: 0;
    font-size: 12px;
    color: var(--lw-gray-graphite);
}

.kc-rows[b-qtrlb9gjeu] {
    margin: 0;
    padding: 0;
    list-style: none;
}

.kc-row[b-qtrlb9gjeu] {
    display: flex;
    align-items: center;
    gap: 16px;
    padding: 16px 24px;
    border-top: 1px solid var(--lw-border);
}

.kc-rows .kc-row:first-child[b-qtrlb9gjeu] {
    border-top: 0;
}

.kc-row--clickable[b-qtrlb9gjeu] {
    cursor: pointer;
    transition: background-color 0.15s ease;
}

.kc-row--clickable:hover[b-qtrlb9gjeu] {
    background: var(--lw-white);
}

.kc-tile[b-qtrlb9gjeu] {
    flex-shrink: 0;
    width: 40px;
    height: 40px;
    border-radius: var(--lw-radius-card);
    display: inline-flex;
    align-items: center;
    justify-content: center;
}

.kc-tile[b-qtrlb9gjeu]  .mud-icon-root {
    width: 20px;
    height: 20px;
    font-size: 20px;
}

.kc-tile--done[b-qtrlb9gjeu] {
    background: var(--lw-status-success-bg);
}

.kc-tile--done[b-qtrlb9gjeu]  .mud-icon-root {
    color: var(--lw-success-dark) !important;
}

.kc-tile--active[b-qtrlb9gjeu] {
    border: 1px dashed var(--lw-border);
    background: var(--lw-bg-muted);
}

.kc-tile--active[b-qtrlb9gjeu]  .mud-icon-root {
    color: var(--lw-gray-space) !important;
}

.kc-row__text[b-qtrlb9gjeu] {
    min-width: 0;
    flex: 1;
}

.kc-row__line[b-qtrlb9gjeu] {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 8px;
}

.kc-row__title[b-qtrlb9gjeu] {
    font-size: 14px;
    font-weight: 600;
    color: var(--lw-text-primary);
}

.kc-row__helper[b-qtrlb9gjeu] {
    margin: 2px 0 0;
    font-size: 13px;
    line-height: 1.5;
    color: var(--lw-gray-graphite);
}

.kc-row__chev[b-qtrlb9gjeu] {
    flex-shrink: 0;
    display: inline-flex;
}

.kc-row__chev[b-qtrlb9gjeu]  .mud-icon-root {
    width: 18px;
    height: 18px;
    font-size: 18px;
    color: var(--lw-gray-graphite) !important;
}

.kc-foot[b-qtrlb9gjeu] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
    flex-wrap: wrap;
    border-top: 1px solid var(--lw-border);
    background: var(--lw-white);
    padding: 16px 24px;
}

.kc-foot__text[b-qtrlb9gjeu] {
    min-width: 0;
}

.kc-foot__title[b-qtrlb9gjeu] {
    margin: 0;
    font-size: 14px;
    font-weight: 600;
    color: var(--lw-text-primary);
}

.kc-foot__sub[b-qtrlb9gjeu] {
    margin: 2px 0 0;
    font-size: 12px;
    line-height: 1.5;
    color: var(--lw-gray-graphite);
}

/* Split "Send Proposal" button (primary action + dropdown of alternate send paths). */
.kc-send[b-qtrlb9gjeu] {
    display: inline-flex;
    flex-shrink: 0;
    align-items: stretch;
}

.kc-send__menu[b-qtrlb9gjeu] {
    display: inline-flex;
}

.kc-send[b-qtrlb9gjeu]  .mud-menu {
    display: inline-flex;
    align-items: stretch;
}

.kc-send__main[b-qtrlb9gjeu] {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    height: 44px;
    padding: 0 20px;
    border: 0;
    cursor: pointer;
    background: var(--lw-primary-dark);
    color: #fff;
    font-size: 14px;
    font-weight: 600;
    font-family: inherit;
    border-radius: var(--lw-radius-control) 0 0 var(--lw-radius-control);
    transition: background-color 0.15s ease;
}

.kc-send__main:hover[b-qtrlb9gjeu] {
    background: #0a1a44;
}

.kc-send__main[b-qtrlb9gjeu]  .mud-icon-root {
    width: 16px;
    height: 16px;
    font-size: 16px;
    color: #fff !important;
}

.kc-send__chevron[b-qtrlb9gjeu] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    height: 44px;
    width: 40px;
    border: 0;
    border-left: 1px solid rgba(255, 255, 255, 0.2);
    cursor: pointer;
    background: var(--lw-primary-dark);
    color: #fff;
    border-radius: 0 var(--lw-radius-control) var(--lw-radius-control) 0;
    transition: background-color 0.15s ease;
}

.kc-send__chevron:hover[b-qtrlb9gjeu] {
    background: #0a1a44;
}

.kc-send__chevron[b-qtrlb9gjeu]  .mud-icon-root {
    width: 16px;
    height: 16px;
    font-size: 16px;
    color: #fff !important;
}

/* Card chrome (mirrors Project.razor's scoped .project-details-panel, which doesn't reach here). */
.kickoff-wrapper[b-qtrlb9gjeu]  .kickoff-card {
    border: 1px solid var(--lw-border);
    border-radius: var(--lw-radius-card);
    background-color: var(--lw-white);
    box-shadow: none;
    overflow: hidden;
}

.kickoff-wrapper[b-qtrlb9gjeu]  .mud-button-root {
    text-transform: none;
    font-weight: 600;
}

/* Proposal milestone timeline (Sent -> Opened -> Response). */
.lw-timeline[b-qtrlb9gjeu] {
    display: flex;
    flex-direction: column;
}

.lw-timeline-row[b-qtrlb9gjeu] {
    display: flex;
    gap: 0.75rem;
}

.lw-timeline-marker[b-qtrlb9gjeu] {
    display: flex;
    flex-direction: column;
    align-items: center;
    padding-top: 0.25rem;
}

.lw-timeline-connector[b-qtrlb9gjeu] {
    width: 1px;
    flex: 1 1 auto;
    min-height: 0.75rem;
    margin: 0.25rem 0;
    background: var(--lw-gray-smoke);
}

.lw-timeline-body[b-qtrlb9gjeu] {
    min-width: 0;
}

/* "Opens automatically" note. */
.kickoff-note[b-qtrlb9gjeu] {
    display: flex;
    align-items: flex-start;
    gap: 0.5rem;
    padding: 0.75rem;
    background-color: var(--lw-bg-muted);
    border-radius: var(--lw-radius-control);
}
/* _content/Ledgerwise/Components/Pages/Project/ProjectOverview.razor.rz.scp.css */
/* ============================================================
   ProjectOverview -- measured against ledgerwise-ui-app (current):
   - src/components/organisms/project/project-overview.tsx
     (shared overview shell; the bg-muted scroll area + max-w-[1100px]
      gap-4 p-4 md:p-6 wrapper is owned by the host page, not here)
   - src/components/molecules/critical-actions-panel.tsx
   - src/components/molecules/trust-account-widget.tsx (funded state
     + MaskedField account-details box)
   Balance-breakdown hover tip mirrors the DrawRequestApprovalModal /
   ClientProjectBudget dark-navy tooltip pattern (Blazor-only feature).
   ============================================================ */

/* Local --po-* names alias the global design tokens; rename via branding.css
   in one place. */
.po-shell[b-4vn5owyuek] {
    --po-border: var(--lw-border);
    --po-muted: var(--lw-bg-muted);
    --po-muted-fg: var(--lw-gray-space);
    --po-content-secondary: var(--lw-gray-graphite);
    --po-foreground: var(--lw-text-primary);
    --po-accent: var(--lw-accent);
    --po-warning-text: var(--lw-status-warning-fg);
    --po-success-dark: var(--lw-success-dark);
    --po-destructive: var(--lw-destructive);
}

/* -- Layout grid -- */

/* Reference shell (project-overview.tsx): bg-muted scroll surface with a
   centered max-w-[1100px] single column, gap-4, p-4 md:p-6. */
.po-shell[b-4vn5owyuek] {
    background: var(--lw-bg-muted);
    padding: 16px;
}

@media (min-width: 768px) {
    .po-shell[b-4vn5owyuek] { padding: 24px; }
}

.po-col[b-4vn5owyuek] {
    max-width: 1100px;
    margin: 0 auto;
    display: flex;
    flex-direction: column;
    gap: 1rem; /* gap-4 */
}


/* -- Card body (surface provided by the shared Card primitive) -- */




/* ============================================================
   Critical tasks panel (critical-actions-panel.tsx)
   ============================================================ */


.po-critical__list[b-4vn5owyuek] {
    display: flex;
    flex-direction: column;
}

.po-critical__empty[b-4vn5owyuek] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 0.25rem;
    padding: 2rem 1.25rem; /* px-5 py-8 */
    text-align: center;
}

.po-critical__empty-title[b-4vn5owyuek] {
    font-size: 0.875rem;
    font-weight: 500;
    color: var(--po-foreground);
    margin: 0;
}

.po-critical__empty-sub[b-4vn5owyuek] {
    font-size: 0.75rem;
    color: var(--po-muted-fg);
    margin: 0;
}

.po-critical__row[b-4vn5owyuek] {
    display: flex;
    align-items: flex-start;
    gap: 0.75rem; /* gap-3 */
    padding: 0.75rem 1.25rem; /* px-5 py-3 */
    border-top: 1px solid var(--po-border); /* divide-y */
    cursor: pointer;
    transition: background-color 0.15s ease;
}

.po-critical__row:first-child[b-4vn5owyuek] {
    border-top: none;
}

.po-critical__row:hover[b-4vn5owyuek] {
    /* hover:bg-accent/50 */
    background-color: color-mix(in srgb, var(--po-accent) 50%, transparent);
}

/* Color + size come from the shared StatusDot (size-2 rounded-sm); this only
   owns the top-alignment nudge (mt-1.5). */
[b-4vn5owyuek] .po-critical__dot {
    margin-top: 6px;
}

.po-critical__row-text[b-4vn5owyuek] {
    min-width: 0;
    flex: 1;
}

.po-critical__row-title[b-4vn5owyuek] {
    font-size: 0.875rem;
    font-weight: 500;
    line-height: 1.375; /* leading-snug */
    color: var(--po-foreground);
    margin: 0;
}

.po-critical__due[b-4vn5owyuek] {
    flex-shrink: 0;
    white-space: nowrap;
    font-size: 0.75rem;
    margin-top: 2px; /* mt-0.5 */
}

.po-critical__due--urgent[b-4vn5owyuek] {
    color: var(--po-destructive);
    font-weight: 600;
}

.po-critical__due--warning[b-4vn5owyuek] {
    color: var(--po-warning-text);
    font-weight: 500;
}

.po-critical__due--muted[b-4vn5owyuek] {
    color: var(--po-muted-fg);
}

.po-critical__pagination[b-4vn5owyuek] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 0.625rem 1.25rem; /* px-5 py-2.5 */
    border-top: 1px solid var(--po-border);
}

.po-critical__page-count[b-4vn5owyuek] {
    font-size: 0.6875rem; /* text-[11px] */
    color: var(--po-muted-fg);
}

.po-critical__page-nav[b-4vn5owyuek] {
    display: flex;
    align-items: center;
    gap: 0.25rem; /* gap-1 */
}

.po-critical__page-num[b-4vn5owyuek] {
    min-width: 32px;
    text-align: center;
    font-size: 0.6875rem;
    color: var(--po-muted-fg);
}

/* Prev/Next text buttons (h-6 px-1.5 text-[11px] font-medium) */
.po-page-btn[b-4vn5owyuek] {
    height: 24px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 0 0.375rem;
    background: transparent;
    border: none;
    cursor: pointer;
    font-family: inherit;
    font-size: 0.6875rem;
    font-weight: 500;
    color: var(--po-content-secondary);
    transition: color 0.15s ease;
}

.po-page-btn:hover:not(:disabled)[b-4vn5owyuek] {
    color: var(--po-foreground);
}

.po-page-btn:disabled[b-4vn5owyuek] {
    pointer-events: none;
    opacity: 0.3;
}

/* ============================================================
   Project account balance widget (trust-account-widget.tsx,
   funded state)
   ============================================================ */

.po-trust[b-4vn5owyuek] {
    /* Padding comes from ControlCard's body. */
}/* -- Not-funded treatment (notFunded branch) -- */

.po-trust__unfunded[b-4vn5owyuek] {
    margin-top: 0.75rem; /* mt-3 */
    padding: 1.25rem; /* p-5 */
    border-radius: var(--lw-radius-card);
    border: 1px solid color-mix(in srgb, var(--po-destructive) 25%, transparent); /* border-destructive/25 */
    background-color: var(--lw-status-error-bg); /* bg-destructive-bg */
}

.po-trust__unfunded-head[b-4vn5owyuek] {
    display: flex;
    align-items: center;
    gap: 0.5rem; /* gap-2 */
}

.po-trust__unfunded-chip[b-4vn5owyuek] {
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    width: 28px; /* size-7 */
    height: 28px;
    border-radius: 9999px;
    background-color: color-mix(in srgb, var(--po-destructive) 10%, transparent); /* bg-destructive/10 */
    color: var(--po-destructive);
}

.po-trust__unfunded-chip[b-4vn5owyuek]  .po-trust__unfunded-chip-icon,
.po-trust__unfunded-chip[b-4vn5owyuek]  .mud-icon-root {
    width: 16px; /* size-4 */
    height: 16px;
    font-size: 16px;
}

.po-trust__unfunded-title[b-4vn5owyuek] {
    margin: 0;
    font-size: 0.75rem; /* text-xs */
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.025em; /* tracking-wide */
    color: var(--lw-status-error-fg); /* text-destructive-text */
}

.po-trust__unfunded-amount[b-4vn5owyuek] {
    margin: 1rem 0 0 0; /* mt-4 */
    font-size: 2.75rem; /* text-[44px] */
    font-weight: 700;
    line-height: 1;
    letter-spacing: -0.025em; /* tracking-tight */
    font-variant-numeric: tabular-nums;
    color: var(--po-destructive);
}

.po-trust__unfunded-caption[b-4vn5owyuek] {
    margin: 0.375rem 0 0 0; /* mt-1.5 */
    font-size: 0.75rem;
    color: var(--po-muted-fg);
}

.po-trust__unfunded-note[b-4vn5owyuek] {
    margin: 1rem 0 0 0; /* mt-4 */
    padding-top: 1rem; /* pt-4 */
    border-top: 1px solid color-mix(in srgb, var(--po-destructive) 15%, transparent); /* border-destructive/15 */
    font-size: 0.875rem; /* text-sm */
    line-height: 1.625; /* leading-relaxed */
    color: var(--po-content-secondary);
}/* -- Account details (MaskedField box) -- */

.po-trust__details[b-4vn5owyuek] {
    margin-top: 1rem; /* mt-4 */
}

.po-trust__details-label[b-4vn5owyuek] {
    margin: 0 0 0.5rem 0; /* mb-2 */
    font-size: 0.75rem;
    font-weight: 500;
    color: var(--po-muted-fg);
}

.po-trust__details-box[b-4vn5owyuek] {
    overflow: hidden;
    border-radius: var(--lw-radius-card);
    border: 1px solid var(--po-border);
    background-color: var(--lw-white);
}

.po-bank-download[b-4vn5owyuek] {
    align-self: flex-start;
    display: inline-flex;
    align-items: center;
    gap: 0.25rem;
    margin-top: 0.75rem; /* mt-3 */
    background: transparent;
    border: none;
    cursor: pointer;
    padding: 0;
    font-size: 11px;
    font-weight: 500;
    color: var(--lw-primary-blue, #3980A5);
    font-family: var(--lw-font-family);
    transition: color 0.15s;
}

.po-bank-download:hover[b-4vn5owyuek] {
    color: var(--lw-primary-dark, #020B2B);
}

.po-bank-download:disabled[b-4vn5owyuek] {
    color: var(--lw-gray-graphite, #6E7180);
    cursor: default;
}

.po-masked-row[b-4vn5owyuek] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 0.75rem; /* gap-3 */
    padding: 0.75rem 0.875rem; /* px-3.5 py-3 */
}

.po-masked-row + .po-masked-row[b-4vn5owyuek] {
    border-top: 1px solid var(--po-border);
}

.po-masked-row__label[b-4vn5owyuek] {
    font-size: 0.75rem; /* text-xs */
    color: var(--po-muted-fg);
}

.po-masked-row__value-wrap[b-4vn5owyuek] {
    display: inline-flex;
    align-items: center;
    gap: 0.5rem; /* gap-2 */
}

.po-masked-row__value[b-4vn5owyuek] {
    font-size: 0.875rem; /* text-sm */
    font-weight: 500;
    color: var(--po-foreground);
    font-variant-numeric: tabular-nums;
}

.po-masked-row__toggle[b-4vn5owyuek] {
    background: transparent;
    border: none;
    padding: 0;
    cursor: pointer;
    color: var(--po-muted-fg);
    display: inline-flex;
    align-items: center;
    transition: color 0.15s ease;
}

.po-masked-row__toggle:hover[b-4vn5owyuek] {
    color: var(--po-foreground);
}

.po-masked-row__toggle[b-4vn5owyuek]  .po-masked-row__toggle-icon,
.po-masked-row__toggle[b-4vn5owyuek]  .mud-icon-root {
    width: 14px; /* size-3.5 */
    height: 14px;
    font-size: 14px;
}

/* ============================================================
   Project context cards (read-only field grid; Blazor-only surface,
   styled to the shared card idiom)
   ============================================================ */

.po-details[b-4vn5owyuek] {
    /* Padding comes from ControlCard's body. */
}


.po-fields[b-4vn5owyuek] {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 0.875rem 1.5rem;
}

.po-field[b-4vn5owyuek] {
    display: flex;
    flex-direction: column;
    gap: 0.125rem;
    min-width: 0;
}

.po-field__label[b-4vn5owyuek] {
    font-size: 0.6875rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.04em;
    color: var(--po-content-secondary);
    display: inline-flex;
    align-items: center;
    gap: 0.25rem;
}

.po-field__info[b-4vn5owyuek] {
    width: 13px;
    height: 13px;
    font-size: 13px;
    color: var(--po-content-secondary);
    opacity: 0.8;
}

.po-field__value[b-4vn5owyuek] {
    font-size: 0.875rem;
    color: var(--po-foreground);
    overflow-wrap: anywhere;
}

.po-fields__note[b-4vn5owyuek] {
    margin: 0.875rem 0 0 0;
    font-size: 0.75rem;
    color: var(--po-content-secondary);
}/* Pending reserve-increase banner on the Account settings card */
.po-fields__pending-reserve[b-4vn5owyuek] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 0.75rem;
    margin-top: 0.875rem;
    padding: 0.5rem 0.75rem;
    font-size: 0.75rem;
    color: var(--lw-primary-dark);
    background: var(--lw-bg-muted);
    border: 1px solid var(--lw-border);
    border-radius: var(--lw-radius-control);
}

.po-fields__pending-reserve-cancel[b-4vn5owyuek] {
    flex-shrink: 0;
    padding: 0;
    border: none;
    background: none;
    font-size: 0.75rem;
    font-weight: 600;
    color: var(--lw-primary-blue);
    cursor: pointer;
}

.po-fields__pending-reserve-cancel:hover[b-4vn5owyuek] {
    text-decoration: underline;
}

@media (max-width: 600px) {
    .po-fields[b-4vn5owyuek] {
        grid-template-columns: 1fr;
    }
}
/* _content/Ledgerwise/Components/Pages/Project/ProjectProposalDetailSections.razor.rz.scp.css */
/* Draft-overview proposal detail cards -- mirrors ledgerwise-ui ProposalDetailSections.
   Read-only ControlCards with an inline Edit toggle; the edit views reuse the send-proposal
   stepper's editor styles (sp-*), duplicated here because scoped CSS does not cross components. */

.pds-stack[b-tdjjtl6f4p] {
    display: flex;
    flex-direction: column;
    gap: 16px;
}

/* -- Header action buttons (Edit / Save / Cancel) -- */
.pds-actions[b-tdjjtl6f4p] {
    display: inline-flex;
    align-items: center;
    gap: 8px;
}

.pds-actions[b-tdjjtl6f4p]  .mud-button-root {
    text-transform: none;
    font-weight: 600;
    min-width: 0;
}

/* -- Description (read) -- */
.pds-prose[b-tdjjtl6f4p] {
    font-size: 0.9rem;
    line-height: 1.6;
    color: var(--lw-gray-graphite);
}

.pds-prose[b-tdjjtl6f4p]  p {
    margin: 0 0 8px;
}

.pds-prose[b-tdjjtl6f4p]  p:last-child {
    margin-bottom: 0;
}

.pds-prose[b-tdjjtl6f4p]  strong {
    font-weight: 600;
    color: var(--lw-text-primary);
}

.pds-prose[b-tdjjtl6f4p]  ul {
    list-style: disc;
    padding-left: 20px;
    margin: 0 0 8px;
}

.pds-empty[b-tdjjtl6f4p] {
    margin: 0;
    font-size: 0.9rem;
    line-height: 1.6;
    color: var(--lw-gray-graphite);
}

/* -- Owners (read roster) -- */
.pds-roster[b-tdjjtl6f4p] {
    display: flex;
    flex-direction: column;
    gap: 12px;
    margin: 0;
    padding: 0;
    list-style: none;
}

.pds-roster__row[b-tdjjtl6f4p] {
    display: flex;
    align-items: flex-start;
    gap: 14px;
    border: 1px solid var(--lw-border);
    border-radius: var(--lw-radius-card);
    background: var(--lw-white);
    padding: 16px;
}

.pds-avatar[b-tdjjtl6f4p] {
    flex-shrink: 0;
    width: 40px;
    height: 40px;
    border-radius: 50%;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    font-size: 13px;
    font-weight: 700;
    background: var(--lw-primary-blue);
    color: var(--lw-white);
}

.pds-roster__text[b-tdjjtl6f4p] {
    min-width: 0;
    flex: 1;
}

.pds-roster__line[b-tdjjtl6f4p] {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 8px;
}

.pds-roster__name[b-tdjjtl6f4p] {
    font-size: 14px;
    font-weight: 600;
    color: var(--lw-text-primary);
}

.pds-roster__meta[b-tdjjtl6f4p] {
    margin: 2px 0 0;
    font-size: 12px;
    color: var(--lw-gray-graphite);
}

.pds-roster__contact[b-tdjjtl6f4p] {
    margin: 2px 0 0;
    font-size: 13px;
    color: var(--lw-gray-graphite);
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

/* -- Account settings (read fields) -- */
.pds-fields[b-tdjjtl6f4p] {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 16px 24px;
}

.pds-field[b-tdjjtl6f4p] {
    display: flex;
    flex-direction: column;
    gap: 4px;
    min-width: 0;
}

.pds-field__label[b-tdjjtl6f4p] {
    font-size: 12px;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.04em;
    color: var(--lw-gray-graphite);
    display: inline-flex;
    align-items: center;
    gap: 4px;
}

/* Info icon for the minimum/reserve balance explanations (US-614) */
.pds-info-icon[b-tdjjtl6f4p] {
    width: 13px;
    height: 13px;
    font-size: 13px;
    color: var(--lw-gray-graphite);
    opacity: 0.85;
}

.pds-field__value[b-tdjjtl6f4p] {
    font-size: 14px;
    color: var(--lw-text-primary);
}

/* ============================================================
   Editor styles ported from the send-proposal stepper (sp-*)
   ============================================================ */

.sp-grid2[b-tdjjtl6f4p] {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 16px;
}

/* -- Rich-text editor -- */
.sp-rte[b-tdjjtl6f4p] {
    border: 1px solid var(--lw-input-border);
    border-radius: 8px;
    overflow: hidden;
    background: var(--lw-white);
}

.sp-rte__toolbar[b-tdjjtl6f4p] {
    display: flex;
    align-items: center;
    gap: 6px;
    padding: 8px;
    border-bottom: 1px solid var(--lw-border);
}

.sp-rte__btn[b-tdjjtl6f4p] {
    min-width: 34px;
    height: 30px;
    border: 1px solid var(--lw-border);
    background: var(--lw-white);
    border-radius: 6px;
    cursor: pointer;
    font-size: 13px;
    color: var(--lw-text-primary);
    font-family: inherit;
}

.sp-rte__btn:hover[b-tdjjtl6f4p] {
    background: var(--lw-bg-muted);
}

.sp-rte__spacer[b-tdjjtl6f4p] {
    flex: 1;
}

.sp-rte__ai[b-tdjjtl6f4p] {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    height: 30px;
    padding: 0 12px;
    border: 1px solid var(--lw-primary-blue);
    background: var(--lw-status-info-bg);
    color: var(--lw-primary-blue);
    border-radius: 6px;
    font-size: 13px;
    font-weight: 500;
    cursor: pointer;
    font-family: inherit;
    transition: background-color 0.15s ease;
}

.sp-rte__ai:hover:not(:disabled)[b-tdjjtl6f4p] {
    background: #e0eef5;
}

.sp-rte__ai:disabled[b-tdjjtl6f4p] {
    opacity: 0.6;
    cursor: wait;
}

.sp-rte__ai[b-tdjjtl6f4p]  .mud-icon-root {
    width: 14px;
    height: 14px;
    font-size: 14px;
    color: var(--lw-primary-blue) !important;
}

.sp-rte__editor[b-tdjjtl6f4p] {
    min-height: 160px;
    padding: 14px 16px;
    font-size: 0.9rem;
    line-height: 1.6;
    color: var(--lw-text-primary);
    outline: none;
}

.sp-rte__editor:empty[b-tdjjtl6f4p]::before {
    content: "Describe the project for the project owner...";
    color: var(--lw-gray-space);
}

/* -- Fields -- */
.sp-field[b-tdjjtl6f4p] {
    display: flex;
    flex-direction: column;
    gap: 6px;
}

.sp-field__label[b-tdjjtl6f4p] {
    font-size: 13px;
    font-weight: 500;
    color: var(--lw-text-primary);
}

.sp-field__hint[b-tdjjtl6f4p] {
    font-weight: 400;
    color: var(--lw-gray-graphite);
}

.sp-field__req[b-tdjjtl6f4p] {
    color: var(--bs-danger, #d33);
}

.sp-field__input[b-tdjjtl6f4p] {
    height: 40px;
    border: 1px solid var(--lw-input-border);
    border-radius: 8px;
    background: var(--lw-white);
    padding: 0 12px;
    font-size: 0.9rem;
    color: var(--lw-text-primary);
    font-family: inherit;
    transition: border-color 0.15s ease;
}

.sp-field__input[b-tdjjtl6f4p]::placeholder {
    color: var(--lw-gray-space);
}

.sp-field__input:focus[b-tdjjtl6f4p] {
    outline: none;
    border-color: var(--lw-primary-blue);
}

.sp-field__select[b-tdjjtl6f4p] {
    appearance: auto;
}

.sp-field__row[b-tdjjtl6f4p] {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 12px;
}

.sp-field__foot[b-tdjjtl6f4p] {
    margin: -4px 0 0;
    font-size: 12px;
    color: var(--lw-gray-graphite);
}

/* -- Owners (edit) -- */
.sp-owners[b-tdjjtl6f4p] {
    display: flex;
    flex-direction: column;
    gap: 16px;
}

.sp-owner-card[b-tdjjtl6f4p] {
    border: 1px solid var(--lw-border);
    border-radius: var(--lw-radius-card);
    background: var(--lw-white);
    overflow: hidden;
}

.sp-owner-card__head[b-tdjjtl6f4p] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    border-bottom: 1px solid var(--lw-border);
    padding: 14px 20px;
}

.sp-owner-card__name[b-tdjjtl6f4p] {
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    font-size: 14px;
    font-weight: 600;
    color: var(--lw-text-primary);
}

.sp-owner-card__remove[b-tdjjtl6f4p] {
    border: 0;
    background: transparent;
    cursor: pointer;
    color: var(--lw-gray-graphite);
    display: inline-flex;
    padding: 4px;
    border-radius: 6px;
}

.sp-owner-card__remove:hover[b-tdjjtl6f4p] {
    color: var(--bs-danger, #d33);
}

.sp-owner-card__remove[b-tdjjtl6f4p]  .mud-icon-root {
    width: 18px;
    height: 18px;
    font-size: 18px;
    color: currentColor !important;
}

.sp-owner-card__body[b-tdjjtl6f4p] {
    display: flex;
    flex-direction: column;
    gap: 16px;
    padding: 20px;
}

.sp-pill[b-tdjjtl6f4p] {
    display: inline-flex;
    align-items: center;
    padding: 2px 10px;
    border-radius: 9999px;
    font-size: 11px;
    font-weight: 700;
    background: var(--lw-status-info-bg);
    color: var(--lw-primary-blue);
}

.sp-add-btn[b-tdjjtl6f4p] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    width: 100%;
    height: 44px;
    border: 1px solid var(--lw-border);
    background: var(--lw-white);
    border-radius: 8px;
    color: var(--lw-text-primary);
    font-size: 14px;
    font-weight: 500;
    cursor: pointer;
    font-family: inherit;
    transition: background-color 0.15s ease;
}

.sp-add-btn:hover[b-tdjjtl6f4p] {
    background: var(--lw-bg-muted);
}

.sp-add-btn[b-tdjjtl6f4p]  .mud-icon-root {
    width: 16px;
    height: 16px;
    font-size: 16px;
}

.sp-owners__note[b-tdjjtl6f4p] {
    margin: 0;
    font-size: 12px;
    line-height: 18px;
    color: var(--lw-gray-graphite);
}

/* -- Team (member cards) -- */
.sp-team[b-tdjjtl6f4p] {
    display: flex;
    flex-direction: column;
    gap: 12px;
}

.sp-member[b-tdjjtl6f4p] {
    border: 1px solid var(--lw-border);
    border-radius: var(--lw-radius-card);
    background: var(--lw-white);
    overflow: hidden;
}

.sp-member__head[b-tdjjtl6f4p] {
    display: flex;
    align-items: flex-start;
    gap: 14px;
    padding: 16px;
}

.sp-member__avatar[b-tdjjtl6f4p] {
    flex-shrink: 0;
    width: 40px;
    height: 40px;
    border-radius: 50%;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    font-size: 13px;
    font-weight: 700;
}

.sp-member__avatar--builder[b-tdjjtl6f4p] {
    background: var(--lw-primary-dark);
    color: var(--lw-white);
}

.sp-member__avatar--pm[b-tdjjtl6f4p] {
    background: var(--lw-status-info-bg);
    color: var(--lw-primary-blue);
}

.sp-member__text[b-tdjjtl6f4p] {
    min-width: 0;
    flex: 1;
}

.sp-member__line[b-tdjjtl6f4p] {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 8px;
}

.sp-member__name[b-tdjjtl6f4p] {
    font-size: 14px;
    font-weight: 700;
    color: var(--lw-text-primary);
}

.sp-member__badge[b-tdjjtl6f4p] {
    display: inline-flex;
    align-items: center;
    border-radius: 999px;
    padding: 1px 8px;
    font-size: 11px;
    font-weight: 600;
    background: var(--lw-bg-secondary);
    color: var(--lw-gray-graphite);
}

.sp-member__badge--user[b-tdjjtl6f4p] {
    background: var(--lw-status-info-bg);
    color: var(--lw-primary-blue);
}

.sp-member__meta[b-tdjjtl6f4p] {
    margin: 2px 0 0;
    font-size: 12px;
    color: var(--lw-gray-graphite);
}

.sp-member__edit[b-tdjjtl6f4p] {
    display: flex;
    flex-direction: column;
    gap: 6px;
    border-top: 1px solid var(--lw-border);
    padding: 14px 16px;
}

/* -- Responsive -- */
@media (max-width: 600px) {
    .sp-grid2[b-tdjjtl6f4p],
    .pds-fields[b-tdjjtl6f4p],
    .sp-field__row[b-tdjjtl6f4p] {
        grid-template-columns: 1fr;
    }
}
/* _content/Ledgerwise/Components/Pages/Project/ProjectProposals.razor.rz.scp.css */
/* ProjectProposals (GC Proposals / RFP tab) -- page-level layout only.
   Source: ledgerwise-app organisms/gc/gc-proposals-tab.tsx +
   organisms/gc/rfp-empty-state.tsx, measured live on localhost:3005 project
   104 (2026-07-23): white toolbar 12px/24px hairline bottom (navy Tab chips
   34px r8 + count 18px, search w-52, outline Filter, navy primary create);
   body bg-muted p-16/24 gap-16; table card r8 hairline + card shadow, th
   14/500 graphite 12px/16px pads, rows h61 two-line title (14/500
   foreground + 12 muted-fg ref), Badge sm statuses (h20 10/700 upper
   0.25px), neutral received pill, kebab w-48.
   Table chrome: css/components/lw-table.css. Toolbar/search/action/empty
   chrome: css/components/lw-page.css. Tabs: LwChip (Tab); badges:
   StatusChip (Small); empty state: LwEmptyState. */

/* Toolbar stacks on mobile (reference: flex-col gap-3 below md). */
@media (max-width: 767px) {
    .pp-toolbar[b-aqm7aovbn4] {
        flex-direction: column;
        align-items: stretch;
        padding: 12px 16px;
    }
}

/* Muted content region (reference: flex-1 flex-col gap-4 bg-muted p-4 md:p-6). */
.pp-body[b-aqm7aovbn4] {
    display: flex;
    flex-direction: column;
    flex: 1;
    gap: 16px;
    padding: 16px;
}

@media (min-width: 768px) {
    .pp-body[b-aqm7aovbn4] {
        padding: 24px;
    }
}

/* ---- Columns (reference RfpTable: title min-280 flexible, status 120,
   due 140, received 160, actions w-12) ---- */

.pp-col-title[b-aqm7aovbn4] {
    flex: 1 1 280px;
    min-width: 0;
}

/* Two-line title cell (reference: font-medium foreground over text-xs
   muted-foreground; 20px/16px line boxes, no gap -> 61px row). */
.pp-col-title .lw-row-cell[b-aqm7aovbn4] {
    gap: 0;
}

.pp-col-title .lw-row-cell-main[b-aqm7aovbn4] {
    font-weight: var(--lw-font-medium);
    line-height: 20px;
}

.pp-col-title .lw-row-cell-sub[b-aqm7aovbn4] {
    line-height: 16px;
}

.pp-col-status[b-aqm7aovbn4] {
    flex: 0 0 120px;
    min-width: 0;
}

.pp-col-due[b-aqm7aovbn4] {
    flex: 0 0 160px;
    min-width: 0;
    white-space: nowrap;
}

.pp-col-received[b-aqm7aovbn4] {
    flex: 0 0 160px;
    min-width: 0;
}

.pp-col-actions[b-aqm7aovbn4] {
    flex: 0 0 48px;
    justify-content: center;
    padding: 12px 8px;
}

/* ---- Empty-state bid board (reference rfp-empty-state.tsx SAMPLE_BIDS) ----
   Signature rows: winner gets a gold-tint fill + gold ring + check roundel;
   losers sit on the page background fill. */

.pp-bid-row--won[b-aqm7aovbn4] {
    background: color-mix(in srgb, var(--lw-primary-gold) 10%, transparent);
    box-shadow: inset 0 0 0 1px color-mix(in srgb, var(--lw-primary-gold) 40%, transparent);
}

.pp-bid-amount[b-aqm7aovbn4] {
    flex-shrink: 0;
    font-size: 13px;
    font-weight: var(--lw-font-semibold);
    font-variant-numeric: tabular-nums;
    color: var(--lw-text-primary);
}

.pp-bid-won[b-aqm7aovbn4] {
    flex-shrink: 0;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 20px;
    height: 20px;
    border-radius: 50%;
    background: var(--lw-primary-gold);
    color: var(--lw-primary-gold-fg);
}

/* MudIcon is a child component -- pierce the isolation scope for its svg. */
.pp-bid-won[b-aqm7aovbn4]  .mud-icon-root {
    font-size: 12px;
    width: 12px;
    height: 12px;
}
/* _content/Ledgerwise/Components/Pages/Project/ProjectTransactions.razor.rz.scp.css */
/* Ledger tab (ProjectTransactions) -- PAGE-LEVEL LAYOUT ONLY.

   Source: Shane Durkin's US-476 mockup
   (ledgerwise-docs/plan/assets/us-476-ledger-mockup.html), measured 2026-07-30 at
   1500px. No ledgerwise-app reference exists (its gc ledger route is a placeholder).

   Card, pill and stat chrome live in their atoms (LwBalanceStat, StatusChip,
   LwPager); this file owns the tab's layout, the column widths, the dashed seam,
   and the row-detail panel. Where the mockup and a --lw-* token disagreed the
   TOKEN WON (US-476 section 9.1.0).

   Type is NOT set here: the table uses lw-table.css's canonical 14px chrome, and
   the toolbar uses the shared lw-page.css recipes. What survives from the mockup is
   COMPOSITION -- column order and proportion, the weight ladder on the money columns
   (debit < credit < balance), and the dashed seam -- not its raw values. */

/* Canonical tab anatomy, same as Invoices and Adjustments: an unpadded page that
   fills the panel, a FULL-BLEED white subhead toolbar directly under the tab strip,
   then the muted body inset that holds the content. */
.pt-page[b-ft0qn7vo0h] {
    display: flex;
    flex-direction: column;
    flex: 1;
}

/* Toolbar stacks on mobile (reference: flex-col gap-3 below md), matching
   .pi-toolbar / .pco-toolbar. */
@media (max-width: 767px) {
    .pt-toolbar[b-ft0qn7vo0h] {
        flex-direction: column;
        align-items: stretch;
        padding: 12px 16px;
    }
}

.pt-body[b-ft0qn7vo0h] {
    display: flex;
    flex-direction: column;
    flex: 1;
    gap: 16px;
    padding: 16px;
    background: var(--lw-bg-muted);
}

@media (min-width: 768px) {
    .pt-body[b-ft0qn7vo0h] { padding: 24px; }
}

/* -- Balance cards: equal columns, 16px gap (measured). -- */
.pt-stats[b-ft0qn7vo0h] {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
    gap: 16px;
}

/* -- Ledger card -- */
.pt-table-card[b-ft0qn7vo0h] {
    overflow-x: auto;
    border: 1px solid var(--lw-border);
    border-radius: var(--lw-radius-card);
    background: var(--lw-white);
    box-shadow: var(--lw-shadow-card);
}

.pt-table-card .lw-table[b-ft0qn7vo0h] {
    min-width: 980px;
}

/* -- Subhead toolbar. ALL chrome comes from the shared .lw-page-toolbar /
   .lw-page-search / .lw-page-action recipes (lw-page.css) -- the same full-bleed
   white bar the Invoices and Adjustments tabs use. This file adds nothing to it
   except the mobile stacking above; the account identity block below is the only
   part with no shared equivalent. -- */
.pt-acct[b-ft0qn7vo0h] {
    display: flex;
    align-items: center;
    gap: 8px;
    min-width: 0;
}

.pt-acct[b-ft0qn7vo0h]  .pt-acct-icon.mud-icon-root {
    font-size: 16px;
    width: 16px;
    height: 16px;
    color: var(--lw-success-dark);
    flex-shrink: 0;
}

/* Measured 14/700 navy. */
.pt-acct-name[b-ft0qn7vo0h] {
    font-size: 14px;
    font-weight: var(--lw-font-bold);
    color: var(--lw-primary-dark);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

/* -- Table type: NOT overridden. --

   An earlier revision restated the mockup's 11px/700 uppercase headers and 13px
   cells here. That was wrong on this codebase's own terms: lw-table.css is the
   canonical data-table chrome (14px header, medium, graphite; 14px cells) shared
   by Invoices, Payment Requests, Adjustments and Documents, and a ledger that
   sets its own type reads as a different component on the same page. Same rule as
   everywhere else in this migration -- where the mockup and the design system
   disagree, the design system wins. This file now contributes column geometry
   only. */

/* -- Columns. min-width: 0 on every one is load-bearing: without it a flex item
   refuses to shrink below its content, so the "Pending Instructions" pill
   overflowed its cell and shoved DESCRIPTION rightwards on those rows only,
   breaking column alignment down the table. Status is sized to the WIDEST pill
   rather than the mockup's 150px, which only ever had to fit "Pending Waiver". -- */
.pt-col-date[b-ft0qn7vo0h]    { flex: 0 0 120px; min-width: 0; white-space: nowrap; }
.pt-col-ref[b-ft0qn7vo0h]     { flex: 0 0 105px; min-width: 0; white-space: nowrap; }
.pt-col-status[b-ft0qn7vo0h]  { flex: 0 0 190px; min-width: 0; }
.pt-col-desc[b-ft0qn7vo0h]    { flex: 1 1 220px; min-width: 0; }
.pt-col-debit[b-ft0qn7vo0h]   { flex: 0 0 115px; min-width: 0; justify-content: flex-end; text-align: right; }
.pt-col-credit[b-ft0qn7vo0h]  { flex: 0 0 115px; min-width: 0; justify-content: flex-end; text-align: right; }
.pt-col-balance[b-ft0qn7vo0h] { flex: 0 0 125px; min-width: 0; justify-content: flex-end; text-align: right; }

/* -- Rows. Keyboard affordances mirror the Adjustments tab: rows are
   role="button", so they take focus and show the same accent fill. -- */
.pt-row[b-ft0qn7vo0h] {
    cursor: pointer;
    outline: none;
}

.pt-table-card .lw-table-tr:focus-visible[b-ft0qn7vo0h] {
    background: color-mix(in srgb, var(--lw-accent) 50%, transparent);
}

.pt-row--selected[b-ft0qn7vo0h] {
    background: var(--lw-bg-muted);
}

/* THE SEAM. Measured 1px DASHED (not dotted). Drawn under the last pending row on
   the page, so it marks the real commitment/settled boundary and appears once. */
.pt-row--seam[b-ft0qn7vo0h] {
    border-bottom: 1px dashed var(--lw-gray-graphite);
}

/* Pending rows show "Processing" instead of a date. The mockup italicises it; this
   app does not italicise anywhere (Cody, 2026-07-30), so the in-flight signal is
   carried by colour alone -- the same blue the Pending ACH pill uses. */
.pt-processing[b-ft0qn7vo0h] {
    color: var(--lw-primary-blue);
    font-weight: var(--lw-font-medium);
}

/* Reference. The mockup sets this in a monospace face; this app does not use one
   anywhere, so it stays on the brand font (Cody, 2026-07-30). Semibold plus
   nowrap is enough to make it read as an identifier -- and nowrap is load-bearing:
   without it "TRX-0085" broke onto two lines and inflated every row. */
.pt-ref[b-ft0qn7vo0h] {
    font-weight: var(--lw-font-semibold);
    color: var(--lw-primary-dark);
    white-space: nowrap;
}

/* Description truncates rather than wrapping, so every row keeps the canonical
   height (same treatment as .pco-title on the Adjustments tab). */
.pt-desc[b-ft0qn7vo0h] {
    min-width: 0;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

/* Money cells inherit the canonical 14px; only the weight/colour ladder is this
   table's own, and it is what makes the column read as a register -- the running
   balance is the heaviest thing in the row. */
.pt-num[b-ft0qn7vo0h] {
    font-variant-numeric: tabular-nums;
    white-space: nowrap;
}

.pt-num--debit[b-ft0qn7vo0h]   { font-weight: var(--lw-font-regular); color: var(--lw-status-error-fg); }
.pt-num--credit[b-ft0qn7vo0h]  { font-weight: var(--lw-font-semibold); color: var(--lw-success-dark); }
.pt-num--balance[b-ft0qn7vo0h] { font-weight: var(--lw-font-bold); color: var(--lw-primary-dark); }
.pt-num--empty[b-ft0qn7vo0h]   { color: var(--lw-gray-smoke); }

/* -- Footer: count left, pager right -- */
.pt-foot[b-ft0qn7vo0h] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
    padding: 12px 16px;
    border-top: 1px solid var(--lw-border);
}

.pt-count[b-ft0qn7vo0h] {
    font-size: 12px;
    color: var(--lw-gray-graphite);
}

.pt-count strong[b-ft0qn7vo0h] {
    font-weight: var(--lw-font-semibold);
    color: var(--lw-primary-dark);
}

/* -- Empty state -- */
.pt-empty[b-ft0qn7vo0h] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 4px;
    padding: 48px 24px;
    text-align: center;
}

.pt-empty-disc[b-ft0qn7vo0h] {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 48px;
    height: 48px;
    margin-bottom: 8px;
    border-radius: 9999px;
    background: var(--lw-bg-muted);
    color: var(--lw-gray-space);
}

.pt-empty-disc[b-ft0qn7vo0h]  .mud-icon-root {
    font-size: 24px;
    width: 24px;
    height: 24px;
}

.pt-empty-title[b-ft0qn7vo0h] {
    margin: 0;
    font-size: 14px;
    font-weight: var(--lw-font-medium);
    color: var(--lw-text-primary);
}

.pt-empty-sub[b-ft0qn7vo0h] {
    margin: 0;
    font-size: 12px;
    color: var(--lw-gray-graphite);
}

@media (max-width: 767px) {
    /* .lw-page-toolbar already wraps; only the account name needs to stop
       competing with the search box for the row. */
    .pt-acct[b-ft0qn7vo0h] {
        flex: 1 1 100%;
    }

    .pt-table-card .lw-table-tr[b-ft0qn7vo0h] {
        cursor: pointer;
    }
}
/* _content/Ledgerwise/Components/Pages/Project/ProjectUpdate.razor.rz.scp.css */
/* Edit-project detail sheet -- source: ledgerwise-app
   organisms/project-details-modal.tsx (Drawer side="sheet", 2026-07-26):
   100dvh-48px muted shell, rounded-t-12, elevated white header band (44px
   project avatar + title), centered max-w-760 ControlCard stack (gap-20)
   over the muted body; LwModalFooter band pinned below. Same sheet
   vocabulary/z-tiers as RfpDetailModal (above the 1300 MudAppBar, below
   MudDialog 1400 so nested add/edit dialogs stack on top). */

.pue-backdrop[b-14wo561t9z] {
    position: fixed;
    inset: 0;
    z-index: var(--lw-z-sheet-backdrop);
    background: var(--lw-scrim);
    backdrop-filter: var(--lw-scrim-blur);
    -webkit-backdrop-filter: var(--lw-scrim-blur);
    animation: pue-fade-in-b-14wo561t9z 0.2s ease;
}

.pue-sheet[b-14wo561t9z] {
    position: fixed;
    left: 0;
    right: 0;
    bottom: 0;
    z-index: var(--lw-z-sheet);
    height: calc(100dvh - 48px);
    background: var(--lw-bg-muted);
    border-top-left-radius: 12px;
    border-top-right-radius: 12px;
    display: flex;
    flex-direction: column;
    overflow: hidden;
    box-shadow: 0 -4px 32px rgba(0, 0, 0, 0.15);
    animation: pue-slide-up-b-14wo561t9z 0.4s cubic-bezier(0.22, 1, 0.36, 1);
}

@keyframes pue-fade-in-b-14wo561t9z {
    from { opacity: 0; }
    to { opacity: 1; }
}

@keyframes pue-slide-up-b-14wo561t9z {
    from { transform: translateY(100%); }
    to { transform: translateY(0); }
}

/* Header band -- elevated over the muted shell (reference: bg-card px-24
   py-16/20, 44px avatar, bold title over a muted sub line, 36px icon close). */
.pue-header[b-14wo561t9z] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
    flex-shrink: 0;
    padding: 16px 24px;
    background: var(--lw-white);
    border-bottom: 1px solid var(--lw-border);
}

.pue-header-left[b-14wo561t9z] {
    display: flex;
    align-items: center;
    gap: 12px;
    min-width: 0;
}

.pue-avatar[b-14wo561t9z] {
    flex-shrink: 0;
    width: 44px;
    height: 44px;
    border-radius: var(--lw-radius-control);
    overflow: hidden;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    background: var(--lw-gradient-project-avatar);
    color: #fff;
}

.pue-avatar img[b-14wo561t9z] {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.pue-avatar[b-14wo561t9z]  .mud-icon-root {
    width: 20px;
    height: 20px;
    font-size: 20px;
    color: rgba(255, 255, 255, 0.9) !important;
}

.pue-header-text[b-14wo561t9z] {
    min-width: 0;
}

.pue-title[b-14wo561t9z] {
    margin: 0;
    font-family: var(--lw-font-family-heading);
    font-size: 18px;
    font-weight: var(--lw-font-bold);
    line-height: 1.25;
    color: var(--lw-text-primary);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.pue-subtitle[b-14wo561t9z] {
    margin: 2px 0 0;
    font-size: 12px;
    color: var(--lw-gray-graphite);
}

.pue-close[b-14wo561t9z] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    width: 36px;
    height: 36px;
    border: none;
    border-radius: var(--lw-radius-control);
    background: transparent;
    color: var(--lw-gray-graphite);
    cursor: pointer;
    transition: background 0.15s, color 0.15s;
}

.pue-close:hover[b-14wo561t9z] {
    background: var(--lw-bg-secondary);
    color: var(--lw-text-primary);
}

.pue-close[b-14wo561t9z]  .mud-icon-root {
    width: 20px;
    height: 20px;
    font-size: 20px;
    color: currentColor !important;
}

/* Scroll chain: the form fills the sheet as a flex column; the body scrolls
   between the header band and the pinned LwModalFooter. */
.pue-sheet[b-14wo561t9z]  form {
    flex: 1 1 auto;
    min-height: 0;
    display: flex;
    flex-direction: column;
}

.pue-body[b-14wo561t9z] {
    flex: 1 1 auto;
    min-height: 0;
    overflow-y: auto;
}

/* Centered section-card column (reference: max-w-[760px] gap-5 p-8). */
.pue-column[b-14wo561t9z] {
    display: flex;
    flex-direction: column;
    gap: 20px;
    width: 100%;
    max-width: 760px;
    margin: 0 auto;
    padding: 32px 24px;
}

/* Identity card -- reference create-step-identity.tsx: fields column beside
   the 124px photo tile (grid-cols-[1fr_auto], gap-6 = 24px), address over
   name stacked at gap-4 (16px). */
.pu-identity[b-14wo561t9z] {
    display: grid;
    grid-template-columns: 1fr auto;
    gap: 24px;
    align-items: start;
}

.pu-identity__fields[b-14wo561t9z] {
    display: flex;
    flex-direction: column;
    gap: 16px;
    min-width: 0;
}

.pu-identity__avatar[b-14wo561t9z] {
    display: flex;
    flex-direction: column;
    align-items: center;
}

.pu-fields[b-14wo561t9z] {
    display: flex;
    flex-direction: column;
    gap: 16px;
}

.pu-grid2[b-14wo561t9z] {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 16px;
}

/* Pending reserve-increase note -- cc-note recipe (muted card, info icon,
   12px muted text) with a destructive text-link cancel action. */
.pu-pending[b-14wo561t9z] {
    display: flex;
    align-items: flex-start;
    gap: 10px;
    border-radius: var(--lw-radius-card);
    background: var(--lw-bg-muted);
    padding: 12px;
}

.pu-pending[b-14wo561t9z]  .mud-icon-root {
    flex-shrink: 0;
    width: 16px;
    height: 16px;
    font-size: 16px;
    margin-top: 2px;
    color: var(--lw-gray-graphite) !important;
}

.pu-pending__text[b-14wo561t9z] {
    margin: 0;
    flex: 1;
    font-size: 12px;
    line-height: 18px;
    color: var(--lw-gray-graphite);
}

.pu-pending__cancel[b-14wo561t9z] {
    flex-shrink: 0;
    border: 0;
    background: transparent;
    padding: 0;
    cursor: pointer;
    font-family: inherit;
    font-size: 13px;
    font-weight: 500;
    color: var(--bs-danger, #d33);
    transition: opacity 0.15s ease;
}

.pu-pending__cancel:hover[b-14wo561t9z] {
    opacity: 0.8;
}

/* Team roster -- vertical stack of PartyMemberRow cards (reference
   party-manager flex-col gap-3). */
.pu-team[b-14wo561t9z] {
    display: flex;
    flex-direction: column;
    gap: 12px;
}

/* Loading skeleton -- card-shaped placeholders (ControlCard silhouette:
   white header band over the form-surface body) composed from LwSkeleton
   blocks, per the design-system loading pattern. */
.pu-skel-card[b-14wo561t9z] {
    border: 1px solid var(--lw-border);
    border-radius: var(--lw-radius-card);
    background: var(--lw-form-surface);
    box-shadow: var(--lw-shadow-card);
    overflow: hidden;
}

.pu-skel-head[b-14wo561t9z] {
    display: flex;
    align-items: center;
    gap: 14px;
    padding: 16px 24px;
    background: var(--lw-white);
    border-bottom: 1px solid var(--lw-border);
}

.pu-skel-body[b-14wo561t9z] {
    display: flex;
    flex-direction: column;
    gap: 16px;
    padding: 24px;
}

@media (max-width: 700px) {
    .pu-grid2[b-14wo561t9z],
    .pu-identity[b-14wo561t9z] {
        grid-template-columns: 1fr;
    }
}
/* _content/Ledgerwise/Components/Pages/Project/SendProposal/SendProposalStepper.razor.rz.scp.css */
/* Send-proposal stepper -- modeled on the ledgerwise-ui send-proposal stepper:
   navy rail (step icons + progress donut rings + gold active accent), content with
   ControlCard / StepHeader / Schedule-of-Values, and a white footer. */

.sp-shell[b-kvt77pt02a] {
    display: grid;
    grid-template-columns: var(--lw-wizard-rail-width) minmax(0, 1fr);
    /* Pin to the viewport so the rail + footer stay fixed and only .sp-content scrolls
       (the long agreement scrolls within the content area, not the whole page). */
    height: 100vh;
    overflow: hidden;
    background: var(--lw-bg-muted);
}

/* ── Left rail (navy sidebar) ── */
.sp-rail[b-kvt77pt02a] {
    display: flex;
    flex-direction: column;
    background: var(--lw-primary-dark);
}

.sp-rail__logo[b-kvt77pt02a] {
    display: flex;
    align-items: center;
    gap: 10px;
    height: 56px;
    padding: 0 24px;
    border-bottom: 1px solid rgba(255, 255, 255, 0.08);
}

.sp-rail__emblem[b-kvt77pt02a] {
    width: 22px;
    height: 22px;
}

.sp-rail__wordmark[b-kvt77pt02a] {
    color: #fff;
    font-weight: 700;
    font-size: 18px;
    letter-spacing: -0.01em;
    font-family: var(--lw-font-family-heading, inherit);
}

.sp-rail__progress[b-kvt77pt02a] {
    padding: 20px 24px 4px;
}

.sp-rail__progress-head[b-kvt77pt02a] {
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.sp-rail__progress-label[b-kvt77pt02a] {
    font-size: 12px;
    line-height: 18px;
    color: rgba(255, 255, 255, 0.7);
}

.sp-rail__progress-count[b-kvt77pt02a] {
    font-size: 12px;
    line-height: 18px;
    color: rgba(255, 255, 255, 0.45);
    font-variant-numeric: tabular-nums;
}

.sp-rail__progress-track[b-kvt77pt02a] {
    margin-top: 6px;
    height: 6px;
    border-radius: 9999px;
    background: rgba(255, 255, 255, 0.1);
    overflow: hidden;
}

.sp-rail__progress-fill[b-kvt77pt02a] {
    height: 100%;
    border-radius: 9999px;
    background: linear-gradient(90deg, #3980A5, #5ba3c4, #EEB66F);
    transition: width 0.4s ease;
}

.sp-rail__steps[b-kvt77pt02a] {
    display: flex;
    flex-direction: column;
    gap: 2px;
    padding: 16px 12px;
    flex: 1;
    min-height: 0;
    overflow-y: auto;
}

.sp-rail__step[b-kvt77pt02a] {
    position: relative;
    display: flex;
    align-items: center;
    justify-content: flex-start !important;
    gap: 12px;
    width: 100%;
    border: 0;
    background: transparent;
    padding: 10px 12px;
    border-radius: 8px;
    text-align: left;
    cursor: pointer;
    font-family: inherit;
    transition: background-color 0.15s ease;
}

.sp-rail__step:hover:not(:disabled)[b-kvt77pt02a] {
    background: rgba(255, 255, 255, 0.08);
}

.sp-rail__step.is-active[b-kvt77pt02a] {
    background: rgba(255, 255, 255, 0.12);
}

.sp-rail__step:disabled[b-kvt77pt02a] {
    cursor: default;
}

.sp-rail__accent[b-kvt77pt02a] {
    position: absolute;
    left: 0;
    top: 6px;
    bottom: 6px;
    width: 4px;
    background: var(--lw-primary-gold);
    clip-path: polygon(0 0, 100% 3px, 100% calc(100% - 3px), 0 100%);
}

.sp-rail__icon[b-kvt77pt02a] {
    flex-shrink: 0;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 28px;
    height: 28px;
}

.sp-rail__icon[b-kvt77pt02a]  .mud-icon-root {
    width: 16px;
    height: 16px;
    font-size: 16px;
    color: rgba(255, 255, 255, 0.35) !important;
    transition: color 0.15s ease;
}

.sp-rail__step.is-active .sp-rail__icon[b-kvt77pt02a]  .mud-icon-root {
    color: #fff !important;
}

.sp-rail__step.is-complete .sp-rail__icon[b-kvt77pt02a]  .mud-icon-root {
    color: rgba(255, 255, 255, 0.7) !important;
}

.sp-rail__label[b-kvt77pt02a] {
    flex: 1;
    min-width: 0;
    font-size: 14px;
    font-weight: 500;
    line-height: 22px;
    color: rgba(255, 255, 255, 0.4);
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.sp-rail__step.is-active .sp-rail__label[b-kvt77pt02a] {
    color: #fff;
}

.sp-rail__step.is-complete .sp-rail__label[b-kvt77pt02a] {
    color: rgba(255, 255, 255, 0.8);
}

.sp-rail__ring[b-kvt77pt02a] {
    flex-shrink: 0;
    width: 18px;
    height: 18px;
    border-radius: 50%;
    box-sizing: border-box;
    display: inline-flex;
    align-items: center;
    justify-content: center;
}

.sp-rail__ring--done[b-kvt77pt02a] {
    background: var(--lw-primary-blue);
}

.sp-rail__ring--done[b-kvt77pt02a]  .mud-icon-root {
    width: 10px;
    height: 10px;
    font-size: 10px;
    color: #fff !important;
}

.sp-rail__ring--active[b-kvt77pt02a] {
    border: 2px solid rgba(255, 255, 255, 0.2);
}

.sp-rail__ring--locked[b-kvt77pt02a] {
    border: 2px solid rgba(255, 255, 255, 0.08);
}

/* ── Main content ── */
.sp-main[b-kvt77pt02a] {
    display: flex;
    flex-direction: column;
    min-width: 0;
    min-height: 0;
}

.sp-content[b-kvt77pt02a] {
    flex: 1;
    min-height: 0;
    overflow: auto;
    padding: 32px 40px 40px;
}

.sp-step-wrap[b-kvt77pt02a] {
    max-width: 1000px;
    margin: 0 auto;
}

/* StepHeader (budget) */
.sp-title-block[b-kvt77pt02a] {
    margin-bottom: 24px;
}

.sp-title[b-kvt77pt02a] {
    margin: 0;
    font-size: 22px;
    font-weight: 700;
    letter-spacing: -0.01em;
    line-height: 1.25;
    color: var(--lw-text-primary);
    font-family: var(--lw-font-family-heading, inherit);
}

.sp-sub[b-kvt77pt02a] {
    margin: 6px 0 0;
    font-size: 0.9rem;
    line-height: 1.55;
    color: var(--lw-gray-graphite);
}

.sp-stack[b-kvt77pt02a] {
    display: flex;
    flex-direction: column;
    gap: 16px;
}

.sp-stack-sm[b-kvt77pt02a] {
    display: flex;
    flex-direction: column;
    gap: 16px;
}

.sp-grid2[b-kvt77pt02a] {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 16px;
}

/* ── Footer ── the canonical OnboardingStepFooter, un-fixed. That atom is
   position:fixed for the onboarding shells that scroll the whole page; this
   wizard already pins to the viewport and scrolls only .sp-content, so the bar
   belongs in flow as the grid's last row. Padding matches the shell's 40px
   content gutter (the atom ships 24px for the narrower onboarding shells). */
.sp-footer-slot[b-kvt77pt02a]  .ob-step-footer {
    position: static;
    padding: 16px 40px;
}

/* ── Rich-text editor ── */
.sp-rte[b-kvt77pt02a] {
    border: 1px solid var(--lw-input-border);
    border-radius: 8px;
    overflow: hidden;
    background: var(--lw-white);
}

.sp-rte__toolbar[b-kvt77pt02a] {
    display: flex;
    align-items: center;
    gap: 6px;
    padding: 8px;
    border-bottom: 1px solid var(--lw-border);
}

.sp-rte__btn[b-kvt77pt02a] {
    min-width: 34px;
    height: 30px;
    border: 1px solid var(--lw-border);
    background: var(--lw-white);
    border-radius: 6px;
    cursor: pointer;
    font-size: 13px;
    color: var(--lw-text-primary);
    font-family: inherit;
}

.sp-rte__btn:hover[b-kvt77pt02a] {
    background: var(--lw-bg-muted);
}

.sp-rte__spacer[b-kvt77pt02a] {
    flex: 1;
}

.sp-rte__ai[b-kvt77pt02a] {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    height: 30px;
    padding: 0 12px;
    border: 1px solid var(--lw-primary-blue);
    background: var(--lw-status-info-bg);
    color: var(--lw-primary-blue);
    border-radius: 6px;
    font-size: 13px;
    font-weight: 500;
    cursor: pointer;
    font-family: inherit;
    transition: background-color 0.15s ease;
}

.sp-rte__ai:hover:not(:disabled)[b-kvt77pt02a] {
    background: #e0eef5;
}

.sp-rte__ai:disabled[b-kvt77pt02a] {
    opacity: 0.6;
    cursor: wait;
}

.sp-rte__ai[b-kvt77pt02a]  .mud-icon-root {
    width: 14px;
    height: 14px;
    font-size: 14px;
    color: var(--lw-primary-blue) !important;
}

.sp-rte__editor[b-kvt77pt02a] {
    min-height: 160px;
    padding: 14px 16px;
    font-size: 0.9rem;
    line-height: 1.6;
    color: var(--lw-text-primary);
    outline: none;
}

.sp-rte__editor:empty[b-kvt77pt02a]::before {
    content: "Describe the project for the project owner...";
    color: var(--lw-gray-space);
}

/* ── Schedule of values (budget) ── */
.sov[b-kvt77pt02a] {
    border: 1px solid var(--lw-border);
    border-radius: var(--lw-radius-card);
    background: var(--lw-white);
    box-shadow: var(--lw-shadow-card);
    overflow: hidden;
}

.sov__summary[b-kvt77pt02a] {
    display: grid;
    grid-template-columns: minmax(0, 0.85fr) minmax(0, 1fr);
    gap: 40px;
    padding: 24px;
}

.sov__total[b-kvt77pt02a] {
    display: flex;
    flex-direction: column;
    justify-content: center;
}

.sov__total-amount[b-kvt77pt02a] {
    margin: 0;
    font-size: 32px;
    font-weight: 700;
    line-height: 1;
    letter-spacing: -0.02em;
    color: var(--lw-text-primary);
    font-variant-numeric: tabular-nums;
}

.sov__total-label[b-kvt77pt02a] {
    margin: 6px 0 0;
    font-size: 12px;
    color: var(--lw-gray-graphite);
}

.sov__breakdown[b-kvt77pt02a] {
    display: flex;
    flex-direction: column;
    justify-content: center;
    border-left: 1px solid var(--lw-border);
    padding-left: 40px;
}

.sov__brk-row[b-kvt77pt02a] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 6px 0;
}

.sov__brk-label[b-kvt77pt02a] {
    font-size: 14px;
    color: var(--lw-gray-graphite);
}

.sov__brk-value[b-kvt77pt02a] {
    font-size: 14px;
    color: var(--lw-text-primary);
    font-variant-numeric: tabular-nums;
}

.sov__table[b-kvt77pt02a] {
    border-top: 1px solid var(--lw-border);
}

.sov__row[b-kvt77pt02a] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 12px 16px;
    font-size: 14px;
}

.sov__amount[b-kvt77pt02a] {
    font-variant-numeric: tabular-nums;
    color: var(--lw-text-primary);
}

.sov__row--head[b-kvt77pt02a] {
    background: var(--lw-bg-table-header);
    padding: 10px 16px;
    color: var(--lw-gray-graphite);
    font-weight: 500;
}

.sov__cat[b-kvt77pt02a] {
    width: 100%;
    border: 0;
    border-top: 1px solid var(--lw-border);
    background: transparent;
    text-align: left;
    cursor: pointer;
    font-family: inherit;
    font-weight: 500;
    color: var(--lw-text-primary);
    transition: background-color 0.12s ease;
}

.sov__cat:hover[b-kvt77pt02a] {
    background: var(--lw-bg-muted);
}

.sov__cat-name[b-kvt77pt02a] {
    display: inline-flex;
    align-items: center;
    gap: 8px;
}

.sov__chev[b-kvt77pt02a] {
    display: inline-flex;
    transition: transform 0.18s ease;
}

.sov__chev--open[b-kvt77pt02a] {
    transform: rotate(90deg);
}

.sov__chev[b-kvt77pt02a]  .mud-icon-root {
    width: 16px;
    height: 16px;
    font-size: 16px;
    color: var(--lw-gray-graphite) !important;
}

.sov__sub[b-kvt77pt02a] {
    background: var(--lw-bg-muted);
    padding: 8px 16px 8px 48px;
    color: var(--lw-gray-graphite);
}

.sov__sub-name[b-kvt77pt02a] {
    color: var(--lw-gray-graphite);
}

.sov__row--subtotal[b-kvt77pt02a] {
    border-top: 1px solid var(--lw-border);
    background: var(--lw-bg-muted);
    padding-left: 40px;
    font-weight: 600;
}

.sov__row--feeline[b-kvt77pt02a] {
    border-top: 1px solid var(--lw-border);
    padding-left: 40px;
    font-weight: 500;
}

.sov__row--ctotal[b-kvt77pt02a] {
    border-top: 1px solid var(--lw-border);
    background: var(--lw-bg-muted);
    padding-left: 40px;
    font-weight: 700;
}

/* ── Fields (mirror create-fields TextField) ── */
.sp-field[b-kvt77pt02a] {
    display: flex;
    flex-direction: column;
    gap: 6px;
}

.sp-field__label[b-kvt77pt02a] {
    font-size: 13px;
    font-weight: 500;
    color: var(--lw-text-primary);
}

.sp-field__hint[b-kvt77pt02a] {
    font-weight: 400;
    color: var(--lw-gray-graphite);
}

.sp-field__req[b-kvt77pt02a] {
    color: var(--bs-danger, #d33);
}

.sp-field__input[b-kvt77pt02a] {
    height: 40px;
    border: 1px solid var(--lw-input-border);
    border-radius: 8px;
    background: var(--lw-white);
    padding: 0 12px;
    font-size: 0.9rem;
    color: var(--lw-text-primary);
    font-family: inherit;
    transition: border-color 0.15s ease;
}

.sp-field__input[b-kvt77pt02a]::placeholder {
    color: var(--lw-gray-space);
}

.sp-field__input:focus[b-kvt77pt02a] {
    outline: none;
    border-color: var(--lw-primary-blue);
}

.sp-field__input[readonly][b-kvt77pt02a] {
    background: var(--lw-bg-muted);
    color: var(--lw-gray-graphite);
}

.sp-field__select[b-kvt77pt02a] {
    appearance: auto;
}

.sp-field__row[b-kvt77pt02a] {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 12px;
}

.sp-field__foot[b-kvt77pt02a] {
    margin: -4px 0 0;
    font-size: 12px;
    color: var(--lw-gray-graphite);
}

/* ── Owners ── */
.sp-owners[b-kvt77pt02a] {
    display: flex;
    flex-direction: column;
    gap: 16px;
}

.sp-owner-card[b-kvt77pt02a] {
    border: 1px solid var(--lw-border);
    border-radius: var(--lw-radius-card);
    background: var(--lw-white);
    overflow: hidden;
}

.sp-owner-card__head[b-kvt77pt02a] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    border-bottom: 1px solid var(--lw-border);
    padding: 14px 20px;
}

.sp-owner-card__name[b-kvt77pt02a] {
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    font-size: 14px;
    font-weight: 600;
    color: var(--lw-text-primary);
}

.sp-owner-card__remove[b-kvt77pt02a] {
    border: 0;
    background: transparent;
    cursor: pointer;
    color: var(--lw-gray-graphite);
    display: inline-flex;
    padding: 4px;
    border-radius: 6px;
}

.sp-owner-card__remove:hover[b-kvt77pt02a] {
    color: var(--bs-danger, #d33);
}

.sp-owner-card__remove[b-kvt77pt02a]  .mud-icon-root {
    width: 18px;
    height: 18px;
    font-size: 18px;
    color: currentColor !important;
}

.sp-owner-card__body[b-kvt77pt02a] {
    display: flex;
    flex-direction: column;
    gap: 16px;
    padding: 20px;
}

.sp-pill[b-kvt77pt02a] {
    display: inline-flex;
    align-items: center;
    padding: 2px 10px;
    border-radius: 9999px;
    font-size: 11px;
    font-weight: 700;
    background: var(--lw-status-info-bg);
    color: var(--lw-primary-blue);
}

.sp-add-btn[b-kvt77pt02a] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    width: 100%;
    height: 44px;
    border: 1px solid var(--lw-border);
    background: var(--lw-white);
    border-radius: 8px;
    color: var(--lw-text-primary);
    font-size: 14px;
    font-weight: 500;
    cursor: pointer;
    font-family: inherit;
    transition: background-color 0.15s ease;
}

.sp-add-btn:hover[b-kvt77pt02a] {
    background: var(--lw-bg-muted);
}

.sp-add-btn[b-kvt77pt02a]  .mud-icon-root {
    width: 16px;
    height: 16px;
    font-size: 16px;
}

.sp-owners__note[b-kvt77pt02a] {
    margin: 0;
    font-size: 12px;
    line-height: 18px;
    color: var(--lw-gray-graphite);
}

/* ── Team (member cards) ── */
.sp-team[b-kvt77pt02a] {
    display: flex;
    flex-direction: column;
    gap: 12px;
}

.sp-member[b-kvt77pt02a] {
    border: 1px solid var(--lw-border);
    border-radius: var(--lw-radius-card);
    background: var(--lw-white);
    overflow: hidden;
}

.sp-member__head[b-kvt77pt02a] {
    display: flex;
    align-items: flex-start;
    gap: 14px;
    padding: 16px;
}

.sp-member__avatar[b-kvt77pt02a] {
    flex-shrink: 0;
    width: 40px;
    height: 40px;
    border-radius: 50%;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    font-size: 13px;
    font-weight: 700;
}

.sp-member__avatar--builder[b-kvt77pt02a] {
    background: var(--lw-primary-dark);
    color: var(--lw-white);
}

.sp-member__avatar--pm[b-kvt77pt02a] {
    background: var(--lw-status-info-bg);
    color: var(--lw-primary-blue);
}

.sp-member__text[b-kvt77pt02a] {
    min-width: 0;
    flex: 1;
}

.sp-member__line[b-kvt77pt02a] {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 8px;
}

.sp-member__name[b-kvt77pt02a] {
    font-size: 14px;
    font-weight: 700;
    color: var(--lw-text-primary);
}

.sp-member__badge[b-kvt77pt02a] {
    display: inline-flex;
    align-items: center;
    border-radius: 999px;
    padding: 1px 8px;
    font-size: 11px;
    font-weight: 600;
    background: var(--lw-bg-secondary);
    color: var(--lw-gray-graphite);
}

.sp-member__badge--user[b-kvt77pt02a] {
    background: var(--lw-status-info-bg);
    color: var(--lw-primary-blue);
}

.sp-member__meta[b-kvt77pt02a] {
    margin: 2px 0 0;
    font-size: 12px;
    color: var(--lw-gray-graphite);
}

.sp-member__edit[b-kvt77pt02a] {
    display: flex;
    flex-direction: column;
    gap: 6px;
    border-top: 1px solid var(--lw-border);
    padding: 14px 16px;
}

/* ── Settings toggle row ── */
.sp-toggle-row[b-kvt77pt02a] {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 16px;
}

.sp-toggle-row__text[b-kvt77pt02a] {
    min-width: 0;
}

.sp-toggle-row__title[b-kvt77pt02a] {
    margin: 0;
    font-size: 14px;
    font-weight: 500;
    color: var(--lw-text-primary);
}

.sp-toggle-row__sub[b-kvt77pt02a] {
    margin: 2px 0 0;
    font-size: 13px;
    color: var(--lw-gray-graphite);
}

/* ── Documents ── */
.sp-doclist[b-kvt77pt02a] {
    display: flex;
    flex-direction: column;
    gap: 8px;
    margin-top: 16px;
}

.sp-doclist__row[b-kvt77pt02a] {
    display: flex;
    align-items: center;
    gap: 8px;
    font-size: 0.875rem;
    color: var(--lw-text-primary);
}

/* ── Review ── */
.sp-preview-banner[b-kvt77pt02a] {
    display: flex;
    align-items: flex-start;
    gap: 12px;
    border: 1px solid var(--lw-primary-blue);
    background: var(--lw-status-info-bg);
    border-radius: var(--lw-radius-card);
    padding: 14px 16px;
}

.sp-preview-banner[b-kvt77pt02a]  .mud-icon-root {
    width: 20px;
    height: 20px;
    font-size: 20px;
    color: var(--lw-primary-blue) !important;
    margin-top: 2px;
}

.sp-preview-banner__title[b-kvt77pt02a] {
    margin: 0;
    font-size: 14px;
    font-weight: 600;
    color: var(--lw-text-primary);
}

.sp-preview-banner__sub[b-kvt77pt02a] {
    margin: 2px 0 0;
    font-size: 13px;
    line-height: 1.5;
    color: var(--lw-gray-graphite);
}

/* Review layout: banner + preview body (mirrors ledgerwise-ui gap-6 / gap-10). */
.sp-review[b-kvt77pt02a] {
    display: flex;
    flex-direction: column;
    gap: 24px;
}

.sp-review__body[b-kvt77pt02a] {
    display: flex;
    flex-direction: column;
    gap: 40px;
}

/* Section heading (mirrors ProposalPreview SectionTitle). */
.sp-section-title[b-kvt77pt02a] {
    margin-bottom: 16px;
}

.sp-section-title h2[b-kvt77pt02a] {
    margin: 0;
    font-size: 18px;
    font-weight: 700;
    letter-spacing: -0.01em;
    line-height: 1.35;
    color: var(--lw-text-primary);
}

.sp-section-title p[b-kvt77pt02a] {
    margin: 4px 0 0;
    font-size: 14px;
    line-height: 1.55;
    color: var(--lw-gray-graphite);
}

/* Identity + at-a-glance card. */
.sp-preview[b-kvt77pt02a] {
    border: 1px solid var(--lw-border);
    border-radius: var(--lw-radius-card);
    background: var(--lw-white);
    box-shadow: var(--lw-shadow-card);
    overflow: hidden;
    padding: 24px;
}

.sp-preview__identity[b-kvt77pt02a] {
    display: flex;
    align-items: center;
    gap: 16px;
}

/* Project avatar - squircle on the shared project gradient, address-number
   label (or house icon fallback), mirroring ledgerwise-ui ProjectAvatar. */
.sp-preview__avatar[b-kvt77pt02a] {
    flex-shrink: 0;
    width: 56px;
    height: 56px;
    border-radius: 8px;
    background: var(--lw-gradient-project-avatar);
    color: #fff;
    font-weight: 600;
    letter-spacing: -0.01em;
    font-variant-numeric: tabular-nums;
    display: inline-flex;
    align-items: center;
    justify-content: center;
}

.sp-preview__avatar[b-kvt77pt02a]  .mud-icon-root {
    width: 25px;
    height: 25px;
    font-size: 25px;
    color: #fff !important;
}

.sp-preview__idtext[b-kvt77pt02a] {
    min-width: 0;
    flex: 1;
}

.sp-preview__name[b-kvt77pt02a] {
    margin: 0;
    font-size: 18px;
    font-weight: 600;
    color: var(--lw-text-primary);
}

.sp-preview__addr[b-kvt77pt02a] {
    margin: 4px 0 0;
    display: flex;
    align-items: flex-start;
    gap: 6px;
    font-size: 0.875rem;
    color: var(--lw-gray-graphite);
}

.sp-preview__addr span[b-kvt77pt02a] {
    min-width: 0;
    overflow-wrap: break-word;
}

.sp-preview__addr[b-kvt77pt02a]  .mud-icon-root {
    width: 14px;
    height: 14px;
    font-size: 14px;
    margin-top: 3px;
    flex-shrink: 0;
    color: currentColor !important;
}

.sp-preview__desc[b-kvt77pt02a] {
    margin-top: 16px;
    font-size: 0.875rem;
    line-height: 1.6;
    color: var(--lw-gray-graphite);
}

.sp-preview__desc[b-kvt77pt02a]  strong {
    font-weight: 600;
    color: var(--lw-text-primary);
}

.sp-preview__desc[b-kvt77pt02a]  a {
    color: var(--lw-primary-blue);
}

.sp-preview__desc[b-kvt77pt02a]  ul {
    list-style: disc;
    padding-left: 20px;
}

.sp-preview__desc[b-kvt77pt02a]  p + p {
    margin-top: 12px;
}

/* Full-bleed hairline divider inside the padded card. */
.sp-preview__divider[b-kvt77pt02a] {
    margin: 20px -24px 0;
    border-top: 1px solid var(--lw-border);
}

/* At-a-glance stats (mirrors GlanceStat: 2-up, 4-up from sm). */
.sp-preview__stats[b-kvt77pt02a] {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 20px 24px;
    padding-top: 20px;
}

.sp-glance[b-kvt77pt02a] {
    display: flex;
    flex-direction: column;
    min-width: 0;
}

.sp-glance__label[b-kvt77pt02a] {
    font-size: 11px;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.03em;
    color: var(--lw-gray-graphite);
}

.sp-glance__value[b-kvt77pt02a] {
    margin-top: 4px;
    font-size: 18px;
    font-weight: 700;
    letter-spacing: -0.01em;
    font-variant-numeric: tabular-nums;
    color: var(--lw-text-primary);
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

/* Associated documents - thumbnail row (mirrors DocumentThumbnails). */
.sp-preview__docs[b-kvt77pt02a] {
    padding-top: 20px;
}

.sp-preview__docs-label[b-kvt77pt02a] {
    margin: 0 0 12px;
    font-size: 11px;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.03em;
    color: var(--lw-gray-graphite);
}

.sp-thumbs[b-kvt77pt02a] {
    display: flex;
    flex-wrap: wrap;
    gap: 12px;
}

.sp-thumb[b-kvt77pt02a] {
    display: flex;
    flex-direction: column;
    gap: 6px;
    width: 116px;
    min-width: 0;
}

.sp-thumb__tile[b-kvt77pt02a] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    height: 84px;
    width: 100%;
    border: 1px solid var(--lw-border);
    border-radius: var(--lw-radius-card);
    background: var(--lw-bg-muted);
}

.sp-thumb__tile[b-kvt77pt02a]  .mud-icon-root {
    width: 28px;
    height: 28px;
    font-size: 28px;
    color: currentColor !important;
}

.sp-thumb__name[b-kvt77pt02a] {
    font-size: 12px;
    color: var(--lw-gray-graphite);
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

/* Party roster cards (mirrors ProposalPreview PartyCard). */
.sp-party-list[b-kvt77pt02a] {
    display: flex;
    flex-direction: column;
    gap: 16px;
}

.sp-party[b-kvt77pt02a] {
    display: flex;
    align-items: center;
    gap: 12px;
    border: 1px solid var(--lw-border);
    border-radius: var(--lw-radius-card);
    background: var(--lw-white);
    box-shadow: var(--lw-shadow-card);
    padding: 20px;
}

.sp-party__avatar[b-kvt77pt02a] {
    flex-shrink: 0;
    width: 40px;
    height: 40px;
    border-radius: 50%;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    font-size: 13px;
    font-weight: 600;
    text-transform: uppercase;
}

.sp-party__avatar--owner[b-kvt77pt02a] {
    background: var(--lw-primary-blue);
    color: var(--lw-primary-blue-fg);
}

.sp-party__avatar--builder[b-kvt77pt02a] {
    background: var(--lw-status-secondary-bg);
    color: var(--lw-status-secondary-fg);
}

.sp-party__avatar--pm[b-kvt77pt02a] {
    background: var(--lw-status-info-bg);
    color: var(--lw-status-info-fg);
}

.sp-party__text[b-kvt77pt02a] {
    min-width: 0;
    flex: 1;
}

.sp-party__name[b-kvt77pt02a] {
    margin: 0;
    font-size: 14px;
    font-weight: 700;
    color: var(--lw-text-primary);
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.sp-party__meta[b-kvt77pt02a] {
    margin: 2px 0 0;
    font-size: 12px;
    line-height: 18px;
    color: var(--lw-gray-graphite);
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

/* How funding works (mirrors ReviewControlCard). */
.sp-funding-grid[b-kvt77pt02a] {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 16px;
}

.sp-fund-card[b-kvt77pt02a] {
    display: flex;
    flex-direction: column;
    border: 1px solid var(--lw-border);
    border-radius: var(--lw-radius-card);
    background: var(--lw-white);
    box-shadow: var(--lw-shadow-card);
    padding: 20px;
}

.sp-fund-card__head[b-kvt77pt02a] {
    display: flex;
    align-items: flex-start;
    gap: 12px;
}

.sp-fund-card__icon[b-kvt77pt02a] {
    flex-shrink: 0;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 36px;
    height: 36px;
    border-radius: var(--lw-radius-card);
    background: var(--lw-status-info-bg);
    color: var(--lw-primary-blue);
}

.sp-fund-card__icon[b-kvt77pt02a]  .mud-icon-root {
    width: 18px;
    height: 18px;
    font-size: 18px;
    color: currentColor !important;
}

.sp-fund-card__title[b-kvt77pt02a] {
    margin: 0;
    font-size: 14px;
    font-weight: 700;
    color: var(--lw-text-primary);
}

.sp-fund-card__sub[b-kvt77pt02a] {
    margin: 2px 0 0;
    font-size: 12px;
    line-height: 18px;
    color: var(--lw-gray-graphite);
}

.sp-fund-card__value[b-kvt77pt02a] {
    margin-top: 16px;
    flex: 1;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 8px 0;
}

.sp-fund-card__num[b-kvt77pt02a] {
    margin: 0;
    font-size: 32px;
    font-weight: 700;
    letter-spacing: -0.02em;
    font-variant-numeric: tabular-nums;
    color: var(--lw-text-primary);
}

.sp-fund-card__cur[b-kvt77pt02a] {
    margin-right: 4px;
    font-size: 20px;
    color: var(--lw-gray-graphite);
}

.sp-fund-card__unit[b-kvt77pt02a] {
    margin-left: 8px;
    font-size: 14px;
    font-weight: 400;
    color: var(--lw-gray-graphite);
}

.sp-fund-card__none[b-kvt77pt02a] {
    margin: 0;
    font-size: 14px;
    color: var(--lw-gray-graphite);
}

.sp-fund-card__note[b-kvt77pt02a] {
    margin-top: 16px;
    display: flex;
    align-items: flex-start;
    gap: 10px;
    border-radius: var(--lw-radius-card);
    background: var(--lw-bg-muted);
    padding: 12px;
}

.sp-fund-card__note[b-kvt77pt02a]  .mud-icon-root {
    width: 16px;
    height: 16px;
    font-size: 16px;
    margin-top: 2px;
    flex-shrink: 0;
    color: var(--lw-gray-graphite) !important;
}

.sp-fund-card__note p[b-kvt77pt02a] {
    margin: 0;
    font-size: 12px;
    line-height: 18px;
    color: var(--lw-gray-graphite);
}

.sp-fund-card__note strong[b-kvt77pt02a] {
    font-weight: 600;
    color: var(--lw-text-primary);
}

/* ── Responsive ── */
@media (min-width: 768px) {
    /* ledgerwise-ui md: the funding-card figure steps up to 38px. */
    .sp-fund-card__num[b-kvt77pt02a] {
        font-size: 38px;
    }

    .sp-fund-card__cur[b-kvt77pt02a] {
        font-size: 24px;
    }
}

@media (max-width: 1023px) {
    /* ledgerwise-ui lg: the funding cards stack below lg. */
    .sp-funding-grid[b-kvt77pt02a] {
        grid-template-columns: 1fr;
    }
}

@media (max-width: 900px) {
    .sov__summary[b-kvt77pt02a] {
        grid-template-columns: 1fr;
        gap: 20px;
    }

    .sov__breakdown[b-kvt77pt02a] {
        border-left: 0;
        padding-left: 0;
        border-top: 1px solid var(--lw-border);
        padding-top: 16px;
    }
}

@media (max-width: 639px) {
    /* ledgerwise-ui sm: the glance stats drop to 2-up below sm. */
    .sp-preview__stats[b-kvt77pt02a] {
        grid-template-columns: repeat(2, 1fr);
    }
}

@media (max-width: 860px) {
    .sp-shell[b-kvt77pt02a] {
        grid-template-columns: 1fr;
    }

    .sp-rail[b-kvt77pt02a] {
        display: none;
    }

    .sp-content[b-kvt77pt02a] {
        padding: 24px 16px 32px;
    }

    .sp-footer-slot[b-kvt77pt02a]  .ob-step-footer {
        padding: 16px;
    }

    .sp-grid2[b-kvt77pt02a] {
        grid-template-columns: 1fr;
    }
}

/* -- Loading skeleton: holds the step-card geometry while the project loads
   (replaces a bare centered spinner; LwProjectDetailSkeleton precedent). -- */
.sp-skel-card[b-kvt77pt02a] {
    display: flex;
    flex-direction: column;
    gap: 16px;
    padding: 24px;
    background: var(--lw-white);
    border: 1px solid var(--lw-border);
    border-radius: var(--lw-radius-card);
    box-shadow: var(--lw-shadow-card);
}

.sp-skel-head[b-kvt77pt02a] {
    display: flex;
    align-items: center;
    gap: 12px;
}

.sp-skel-head-text[b-kvt77pt02a] {
    display: flex;
    flex-direction: column;
    gap: 6px;
}
/* _content/Ledgerwise/Components/Pages/Proposal/ProposalReview.razor.rz.scp.css */
/* Proposal review page-level layout. Gate spec measured from source
   2026-07-19: owner-proposal-review.tsx ProposalPasswordGate --
   wrapper "flex h-full items-center justify-center px-5 py-12"; card
   "max-w-[400px] rounded-card border border-border bg-white p-6 shadow-card";
   lock tile size-11 rounded-card bg-info-bg text-brand-accent w/ size-5 glyph;
   title mt-4 text-lg bold tracking-tight; sub mt-1.5 text-sm leading-relaxed
   content-secondary (strong = semibold foreground); form mt-5 gap-2.5;
   error text-xs destructive; button mt-1 size=action full width. */

.pr-gate[b-3mkmg4cmh9] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    /* Full-viewport centering: the ProposalLayout surface has no chrome. */
    min-height: 100dvh;
    box-sizing: border-box;
    padding: 48px 20px;
}

.pr-gate__card[b-3mkmg4cmh9] {
    width: 100%;
    max-width: 400px;
    border: 1px solid var(--lw-border);
    border-radius: var(--lw-radius-card);
    background: var(--lw-white);
    box-shadow: var(--lw-shadow-card);
    padding: 24px;
}

.pr-gate__lock[b-3mkmg4cmh9] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 44px;
    height: 44px;
    border-radius: var(--lw-radius-card);
    background: var(--lw-status-info-bg);
    color: var(--lw-primary-blue);
}

.pr-gate__lock[b-3mkmg4cmh9]  .mud-icon-root {
    width: 20px;
    height: 20px;
    font-size: 20px;
}

.pr-gate__title[b-3mkmg4cmh9] {
    margin: 16px 0 0;
    font-family: var(--lw-font-family-heading, inherit);
    font-size: 1.125rem;
    font-weight: 700;
    letter-spacing: var(--lw-tracking-tight);
    color: var(--lw-text-primary);
}

.pr-gate__sub[b-3mkmg4cmh9] {
    margin: 6px 0 0;
    font-size: 0.875rem;
    line-height: 1.625;
    color: var(--lw-gray-graphite);
}

.pr-gate__sub strong[b-3mkmg4cmh9] {
    font-weight: 600;
    color: var(--lw-text-primary);
}

.pr-gate__form[b-3mkmg4cmh9] {
    margin-top: 20px;
    display: flex;
    flex-direction: column;
    gap: 10px;
}

.pr-gate__form .lw-button[b-3mkmg4cmh9] { margin-top: 4px; }

.pr-gate__error[b-3mkmg4cmh9] {
    margin: 0;
    font-size: 0.75rem;
    color: var(--lw-destructive);
}

/* ---- Review state (owner-proposal-review.tsx, measured from source
   2026-07-19) ---- */

.pr-review[b-3mkmg4cmh9] {
    max-width: 920px;
    margin: 0 auto;
    padding: 32px 20px 128px;
}

@media (min-width: 768px) {
    .pr-review[b-3mkmg4cmh9] { padding: 48px 32px 128px; }
}

/* Intro: text-xs eyebrow, 26/30px title, prose sub */
.pr-eyebrow[b-3mkmg4cmh9] {
    margin: 0;
    font-size: 12px;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.14em;
    color: var(--lw-primary-blue);
}

.pr-title[b-3mkmg4cmh9] {
    margin: 6px 0 0;
    font-family: var(--lw-font-family-heading, inherit);
    font-size: 26px;
    font-weight: 700;
    line-height: 1.25;
    letter-spacing: var(--lw-tracking-tight);
    color: var(--lw-text-primary);
}

@media (min-width: 768px) {
    .pr-title[b-3mkmg4cmh9] { font-size: 30px; }
}

.pr-intro[b-3mkmg4cmh9] {
    margin: 8px 0 0;
    max-width: 65ch;
    font-size: 0.875rem;
    line-height: 1.625;
    color: var(--lw-gray-graphite);
}

.pr-intro strong[b-3mkmg4cmh9] { font-weight: 600; color: var(--lw-text-primary); }

.pr-sections[b-3mkmg4cmh9] {
    margin-top: 32px;
    display: flex;
    flex-direction: column;
    gap: 40px;
}

/* Card chrome (reference ui/card.tsx). NOTE: the shared Card component
   cannot carry these page-scoped classes -- a child component's root element
   does not receive this page's CSS-isolation scope attribute, so page rules
   like .pr-identity would silently stop applying (verified 2026-07-19).
   The chrome values mirror the Card atom exactly. */
.pr-card[b-3mkmg4cmh9] {
    border: 1px solid var(--lw-border);
    border-radius: var(--lw-radius-card);
    background: var(--lw-white);
    box-shadow: var(--lw-shadow-card);
}

.pr-card--clip[b-3mkmg4cmh9] { overflow: hidden; }

/* Section head: text-lg bold tracking-tight + 14/1.625 sub, mb-4 */
.pr-section-head[b-3mkmg4cmh9] { margin-bottom: 16px; }
.pr-section-head h2[b-3mkmg4cmh9] {
    margin: 0;
    font-family: var(--lw-font-family-heading, inherit);
    font-size: 1.125rem;
    font-weight: 700;
    letter-spacing: var(--lw-tracking-tight);
    color: var(--lw-text-primary);
}
.pr-section-head p[b-3mkmg4cmh9] {
    margin: 4px 0 0;
    font-size: 0.875rem;
    line-height: 1.625;
    color: var(--lw-gray-graphite);
}

/* Identity card (p-5 md:p-6, full-bleed dividers) */
.pr-identity[b-3mkmg4cmh9] { padding: 20px; }
@media (min-width: 768px) { .pr-identity[b-3mkmg4cmh9] { padding: 24px; } }

.pr-identity__name[b-3mkmg4cmh9] {
    margin: 0;
    font-size: 1.125rem;
    font-weight: 600;
    color: var(--lw-text-primary);
}

.pr-identity__address[b-3mkmg4cmh9] {
    margin: 4px 0 0;
    display: flex;
    align-items: flex-start;
    gap: 6px;
    font-size: 0.875rem;
    color: var(--lw-gray-graphite);
}

.pr-identity__address[b-3mkmg4cmh9]  .mud-icon-root {
    width: 14px; height: 14px; font-size: 14px; margin-top: 2px; flex-shrink: 0;
}

.pr-identity__rule[b-3mkmg4cmh9] {
    margin: 20px -20px 0;
    border-top: 1px solid var(--lw-border);
}
@media (min-width: 768px) { .pr-identity__rule[b-3mkmg4cmh9] { margin-left: -24px; margin-right: -24px; } }

.pr-stats[b-3mkmg4cmh9] {
    margin: 0;
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    column-gap: 24px;
    row-gap: 20px;
    padding-top: 20px;
}
@media (min-width: 640px) { .pr-stats[b-3mkmg4cmh9] { grid-template-columns: repeat(4, minmax(0, 1fr)); } }

.pr-stat[b-3mkmg4cmh9] { min-width: 0; }
.pr-stat dt[b-3mkmg4cmh9] {
    font-size: 11px;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.025em;
    color: var(--lw-gray-space);
}
.pr-stat dd[b-3mkmg4cmh9] {
    margin: 4px 0 0;
    font-size: 1.125rem;
    font-weight: 700;
    letter-spacing: var(--lw-tracking-tight);
    font-variant-numeric: tabular-nums;
    color: var(--lw-text-primary);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.pr-doclabel[b-3mkmg4cmh9] {
    margin: 20px 0 12px;
    font-size: 11px;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.025em;
    color: var(--lw-gray-space);
}

.pr-docs[b-3mkmg4cmh9] { display: flex; flex-direction: column; gap: 8px; }

.pr-doc[b-3mkmg4cmh9] {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 10px 12px;
    border: 1px solid var(--lw-border);
    border-radius: var(--lw-radius-control);
    text-decoration: none;
    transition: background-color 0.15s ease;
}
.pr-doc:hover[b-3mkmg4cmh9] { background: var(--lw-accent); text-decoration: none; }
.pr-doc[b-3mkmg4cmh9]  .pr-doc__icon { width: 20px; height: 20px; font-size: 20px; color: var(--lw-primary-blue); flex-shrink: 0; }
.pr-doc__body[b-3mkmg4cmh9] { min-width: 0; flex: 1; display: flex; flex-direction: column; }
.pr-doc__name[b-3mkmg4cmh9] {
    font-size: 0.875rem; font-weight: 600; color: var(--lw-text-primary);
    overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
}
.pr-doc__size[b-3mkmg4cmh9] { font-size: 0.75rem; color: var(--lw-gray-graphite); }
.pr-doc[b-3mkmg4cmh9]  .pr-doc__open { width: 14px; height: 14px; font-size: 14px; color: var(--lw-gray-graphite); flex-shrink: 0; }

/* Team member cards (p-4 md:p-5, 40px avatar, 14px bold name, 12/18 sub) */
.pr-team[b-3mkmg4cmh9] { display: flex; flex-direction: column; gap: 16px; }
.pr-member[b-3mkmg4cmh9] { display: flex; align-items: center; gap: 12px; padding: 16px; }
@media (min-width: 768px) { .pr-member[b-3mkmg4cmh9] { padding: 20px; } }
.pr-member__text[b-3mkmg4cmh9] { min-width: 0; }
.pr-member__name[b-3mkmg4cmh9] {
    margin: 0; font-size: 0.875rem; font-weight: 700; color: var(--lw-text-primary);
    overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
}
.pr-member__sub[b-3mkmg4cmh9] {
    margin: 2px 0 0; font-size: 0.75rem; line-height: 18px; color: var(--lw-gray-graphite);
    overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
}

/* Schedule of values (budget-schedule-of-values.tsx, stacked) */
.pr-sov[b-3mkmg4cmh9] { font-size: 0.875rem; }
.pr-num[b-3mkmg4cmh9] { font-variant-numeric: tabular-nums; white-space: nowrap; }

.pr-sov__summary[b-3mkmg4cmh9] { padding: 20px; }
@media (min-width: 768px) { .pr-sov__summary[b-3mkmg4cmh9] { padding: 24px; } }

.pr-sov__summary[b-3mkmg4cmh9] {
    display: grid;
    grid-template-columns: 1fr;
    gap: 24px;
}
@media (min-width: 768px) {
    .pr-sov__summary[b-3mkmg4cmh9] { grid-template-columns: minmax(0, 0.85fr) minmax(0, 1fr); gap: 40px; }
}

.pr-sov__totalblock[b-3mkmg4cmh9] { display: flex; flex-direction: column; justify-content: center; }

.pr-sov__grand[b-3mkmg4cmh9] {
    margin: 0;
    font-size: 32px;
    font-weight: 700;
    line-height: 1;
    letter-spacing: var(--lw-tracking-tight);
    color: var(--lw-text-primary);
}

.pr-sov__grandlabel[b-3mkmg4cmh9] { margin: 6px 0 0; font-size: 0.75rem; color: var(--lw-gray-space); }

.pr-sov__breakdown[b-3mkmg4cmh9] { display: flex; flex-direction: column; justify-content: center; }
@media (min-width: 768px) {
    .pr-sov__breakdown[b-3mkmg4cmh9] { border-left: 1px solid var(--lw-border); padding-left: 40px; }
}

.pr-sov__srow[b-3mkmg4cmh9] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 6px 0;
    color: var(--lw-gray-graphite);
}
.pr-sov__srow .pr-num[b-3mkmg4cmh9] { color: var(--lw-text-primary); }

.pr-sov__feelabel[b-3mkmg4cmh9] { display: inline-flex; align-items: center; gap: 6px; }
.pr-sov__feelabel[b-3mkmg4cmh9]  .pr-sov__help {
    width: 14px; height: 14px; font-size: 14px;
    color: var(--lw-gray-space); cursor: help;
}

.pr-sov__table[b-3mkmg4cmh9] { border-top: 1px solid var(--lw-border); }

.pr-sov__header[b-3mkmg4cmh9] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    background: var(--lw-bg-table-header);
    padding: 10px 16px;
    font-weight: 500;
    color: var(--lw-gray-graphite);
}

.pr-sov__division[b-3mkmg4cmh9] { border-top: 1px solid var(--lw-border); }
.pr-sov__division:first-of-type[b-3mkmg4cmh9] { border-top: 0; }

.pr-sov__catrow[b-3mkmg4cmh9] {
    display: flex;
    width: 100%;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
    padding: 12px 16px;
    border: 0;
    background: transparent;
    font-family: inherit;
    font-size: 0.875rem;
    font-weight: 500;
    color: var(--lw-text-primary);
    text-align: left;
    cursor: pointer;
    transition: background-color 0.15s ease;
}
.pr-sov__catrow:hover[b-3mkmg4cmh9] { background: color-mix(in srgb, var(--lw-accent) 50%, transparent); }

.pr-sov__catname[b-3mkmg4cmh9] { display: inline-flex; align-items: center; gap: 8px; min-width: 0; }
.pr-sov__catname[b-3mkmg4cmh9]  .pr-sov__chevron {
    width: 16px; height: 16px; font-size: 16px; flex-shrink: 0;
    color: var(--lw-gray-space);
    transition: transform 0.2s ease;
}
.pr-sov__catname[b-3mkmg4cmh9]  .pr-sov__chevron.is-open { transform: rotate(90deg); }

.pr-sov__subrow[b-3mkmg4cmh9] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
    padding: 8px 16px 8px 48px;
    background: color-mix(in srgb, var(--lw-bg-muted) 60%, transparent);
    color: var(--lw-gray-graphite);
}

.pr-sov__rollrow[b-3mkmg4cmh9] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
    border-top: 1px solid var(--lw-border);
    padding: 12px 16px 12px 40px;
    font-weight: 500;
    color: var(--lw-text-primary);
}
.pr-sov__rollrow--tinted[b-3mkmg4cmh9] { background: color-mix(in srgb, var(--lw-bg-muted) 40%, transparent); }
.pr-sov__rollrow--strong[b-3mkmg4cmh9] { font-weight: 600; }
.pr-sov__rollrow--bold[b-3mkmg4cmh9] { font-weight: 700; }

/* Change-request banner (change-request-banner.tsx) */
.pr-changereq[b-3mkmg4cmh9] {
    margin-top: 20px;
    display: flex;
    align-items: flex-start;
    gap: 12px;
    border: 1px solid color-mix(in srgb, var(--lw-status-warning-fg) 25%, transparent);
    border-radius: var(--lw-radius-card);
    background: var(--lw-status-warning-bg);
    padding: 16px;
}

.pr-changereq__roundel[b-3mkmg4cmh9] {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 32px;
    height: 32px;
    flex-shrink: 0;
    border-radius: 999px;
    background: color-mix(in srgb, var(--lw-status-warning-fg) 15%, transparent);
    color: var(--lw-status-warning-fg);
}
.pr-changereq__roundel[b-3mkmg4cmh9]  .mud-icon-root { width: 16px; height: 16px; font-size: 16px; }

.pr-changereq__body[b-3mkmg4cmh9] { min-width: 0; }
.pr-changereq__title[b-3mkmg4cmh9] { margin: 0; font-size: 0.875rem; font-weight: 600; color: var(--lw-text-primary); }
.pr-changereq__reason[b-3mkmg4cmh9] { margin: 4px 0 0; font-size: 0.875rem; font-style: italic; line-height: 1.625; color: var(--lw-gray-graphite); }
.pr-changereq__meta[b-3mkmg4cmh9] { margin: 6px 0 0; font-size: 0.75rem; color: var(--lw-gray-graphite); }

/* Funding control cards (ReviewControlCard: p-5 flex-col; 36px info-bg tile;
   centered 32/38 value; muted note w/ info glyph) */
.pr-funding[b-3mkmg4cmh9] {
    display: grid;
    grid-template-columns: 1fr;
    gap: 16px;
}
@media (min-width: 1024px) { .pr-funding[b-3mkmg4cmh9] { grid-template-columns: repeat(2, minmax(0, 1fr)); } }

.pr-control[b-3mkmg4cmh9] { display: flex; flex-direction: column; padding: 20px; }

.pr-control__head[b-3mkmg4cmh9] { display: flex; align-items: flex-start; gap: 12px; }

.pr-control__tile[b-3mkmg4cmh9] {
    display: flex; align-items: center; justify-content: center;
    width: 36px; height: 36px; flex-shrink: 0;
    border-radius: var(--lw-radius-card);
    background: var(--lw-status-info-bg);
    color: var(--lw-primary-blue);
}
.pr-control__tile[b-3mkmg4cmh9]  .mud-icon-root { width: 16px; height: 16px; font-size: 16px; }

.pr-control__title[b-3mkmg4cmh9] { margin: 0; font-size: 0.875rem; font-weight: 700; color: var(--lw-text-primary); }
.pr-control__sub[b-3mkmg4cmh9] { margin: 2px 0 0; font-size: 0.75rem; line-height: 18px; color: var(--lw-gray-graphite); }

.pr-control__value[b-3mkmg4cmh9] {
    margin-top: 16px;
    flex: 1;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 8px 0;
}
.pr-control__value p[b-3mkmg4cmh9] {
    margin: 0;
    font-size: 32px;
    font-weight: 700;
    letter-spacing: var(--lw-tracking-tight);
    color: var(--lw-text-primary);
}
@media (min-width: 768px) { .pr-control__value p[b-3mkmg4cmh9] { font-size: 38px; } }

/* Reference: $ prefix and unit suffix render smaller and muted. */
.pr-control__prefix[b-3mkmg4cmh9] { margin-right: 4px; font-size: 20px; color: var(--lw-gray-graphite); }
@media (min-width: 768px) { .pr-control__prefix[b-3mkmg4cmh9] { font-size: 24px; } }
.pr-control__suffix[b-3mkmg4cmh9] { margin-left: 8px; font-size: 0.875rem; font-weight: 400; color: var(--lw-gray-graphite); }

.pr-control__note[b-3mkmg4cmh9]  p strong { font-weight: 600; color: var(--lw-text-primary); }

.pr-control__note[b-3mkmg4cmh9] {
    margin-top: 16px;
    display: flex;
    align-items: flex-start;
    gap: 10px;
    border-radius: var(--lw-radius-card);
    background: var(--lw-bg-muted);
    padding: 12px;
}
.pr-control__note[b-3mkmg4cmh9]  .mud-icon-root {
    width: 16px; height: 16px; font-size: 16px; margin-top: 2px; flex-shrink: 0;
    color: var(--lw-gray-graphite);
}
.pr-control__note p[b-3mkmg4cmh9] { margin: 0; font-size: 0.75rem; line-height: 18px; color: var(--lw-gray-graphite); }

/* Sticky action bar */
.pr-actionbar[b-3mkmg4cmh9] {
    position: fixed;
    left: 0; right: 0; bottom: 0;
    z-index: 5;
    background: var(--lw-white);
    border-top: 1px solid var(--lw-border);
    padding: 12px 20px;
}
@media (min-width: 768px) { .pr-actionbar[b-3mkmg4cmh9] { padding: 12px 32px; } }

.pr-actionbar__inner[b-3mkmg4cmh9] {
    max-width: 920px;
    margin: 0 auto;
    display: flex;
    flex-direction: column-reverse;
    align-items: stretch;
    gap: 10px;
}

@media (min-width: 768px) {
    .pr-actionbar__inner[b-3mkmg4cmh9] {
        flex-direction: row;
        align-items: center;
        justify-content: flex-end;
    }
}

.pr-actionbar__note[b-3mkmg4cmh9] {
    margin: 0 auto 0 0;
    font-size: 0.875rem;
    color: var(--lw-gray-graphite);
}


/* Powered-by footer: centered column, border-t pt-8 mt-12, 24px logo, 12px caption */
.pr-powered[b-3mkmg4cmh9] {
    margin-top: 48px;
    padding-top: 32px;
    border-top: 1px solid var(--lw-border);
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 10px;
}
.pr-powered img[b-3mkmg4cmh9] { height: 24px; width: auto; }
.pr-powered p[b-3mkmg4cmh9] { margin: 0; font-size: 0.75rem; color: var(--lw-gray-space); }

/* Redirecting interstitial (redirecting-screen.tsx): fixed white overlay,
   56px emblem w/ rotating-gradient loading effect, gap-6 to the text block. */
.pr-redirect[b-3mkmg4cmh9] {
    position: fixed;
    inset: 0;
    z-index: 90;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 24px;
    background: var(--lw-white);
    padding: 0 24px;
    text-align: center;
    animation: pr-redirect-in-b-3mkmg4cmh9 0.3s ease both;
}

@keyframes pr-redirect-in-b-3mkmg4cmh9 {
    from { opacity: 0; }
    to { opacity: 1; }
}

.pr-redirect__emblem[b-3mkmg4cmh9] { width: 56px; height: 56px; }

.pr-redirect__text[b-3mkmg4cmh9] {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 6px;
}

.pr-redirect__text h2[b-3mkmg4cmh9] {
    margin: 0;
    font-family: var(--lw-font-family-heading, inherit);
    font-size: 1.125rem;
    font-weight: 600;
    color: var(--lw-text-primary);
}

.pr-redirect__text p[b-3mkmg4cmh9] {
    margin: 0;
    font-size: 0.875rem;
    color: var(--lw-gray-graphite);
}
/* _content/Ledgerwise/Components/Pages/Public/LienReleaseSign.razor.rz.scp.css */
/* Public lien waiver signing page. Layout only -- chrome comes from the
   shared lw-sign vocabulary (wwwroot/css/components/lw-sign.css) and the
   card atoms. The signing state renders LienWaiverSigningFlow with
   HeaderTitle set, so the control-card header band is attached to the
   waiver card itself; the non-signing states use the Card shell. */
/* _content/Ledgerwise/Components/Pages/Public/ProductDocumentation.razor.rz.scp.css */
/* Product documentation hub (US-610). All chrome from --lw-* tokens. */

.kb-hub-list[b-3myt9aqwes] {
    list-style: none;
    margin: 0;
    padding: 0;
}

.kb-hub-item[b-3myt9aqwes] {
    padding: 8px 0;
    border-bottom: 1px solid var(--lw-border);
}

.kb-hub-item:last-child[b-3myt9aqwes] {
    border-bottom: none;
}

.kb-hub-link[b-3myt9aqwes] {
    color: var(--lw-primary-blue);
    font-weight: 600;
    text-decoration: none;
}

.kb-hub-link:hover[b-3myt9aqwes] {
    text-decoration: underline;
}

.kb-hub-summary[b-3myt9aqwes] {
    color: var(--lw-gray-graphite);
    font-size: 0.875rem;
    margin-top: 2px;
}
/* _content/Ledgerwise/Components/Pages/Public/ProductDocumentationArticle.razor.rz.scp.css */
/* Knowledge base article page (US-610). All chrome from --lw-* tokens.
   The body is rendered from a MarkupString, so Blazor's CSS isolation
   attribute is NOT stamped on its children -- every rule below the
   .kb-article-body root must use ::deep or it silently does nothing. */

.kb-article-meta[b-whd3wy2eme] {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 8px;
}

.kb-chip[b-whd3wy2eme] {
    background: var(--lw-bg-secondary);
    border-radius: 999px;
    color: var(--lw-primary-dark);
    font-size: 0.75rem;
    font-weight: 600;
    padding: 3px 10px;
}

.kb-meta-text[b-whd3wy2eme] {
    color: var(--lw-gray-graphite);
    font-size: 0.8125rem;
}

.kb-related-list[b-whd3wy2eme] {
    list-style: none;
    margin: 0;
    padding: 0;
}

.kb-related-list li[b-whd3wy2eme] {
    padding: 4px 0;
}

.kb-related-link[b-whd3wy2eme] {
    color: var(--lw-primary-blue);
    font-weight: 600;
    text-decoration: none;
}

.kb-related-link:hover[b-whd3wy2eme] {
    text-decoration: underline;
}

/* ---- Rendered markdown ---- */

.kb-article-body[b-whd3wy2eme] {
    color: inherit;
    line-height: 1.6;
}

.kb-article-body[b-whd3wy2eme]  h2 {
    font-family: var(--lw-font-family-heading);
    font-size: 1.25rem;
    font-weight: 600;
    margin: 28px 0 10px;
    scroll-margin-top: 16px;
}

.kb-article-body[b-whd3wy2eme]  h2:first-child {
    margin-top: 0;
}

.kb-article-body[b-whd3wy2eme]  h3 {
    font-family: var(--lw-font-family-heading);
    font-size: 1.05rem;
    font-weight: 600;
    margin: 20px 0 8px;
}

.kb-article-body[b-whd3wy2eme]  p {
    margin: 0 0 12px;
}

.kb-article-body[b-whd3wy2eme]  ul,
.kb-article-body[b-whd3wy2eme]  ol {
    margin: 0 0 12px;
    padding-left: 22px;
}

.kb-article-body[b-whd3wy2eme]  li {
    margin-bottom: 6px;
}

.kb-article-body[b-whd3wy2eme]  a {
    color: var(--lw-primary-blue);
}

.kb-article-body[b-whd3wy2eme]  table {
    border-collapse: collapse;
    margin: 0 0 16px;
    width: 100%;
}

.kb-article-body[b-whd3wy2eme]  th {
    background: var(--lw-bg-table-header);
    border: 1px solid var(--lw-border);
    font-weight: 600;
    padding: 8px 10px;
    text-align: left;
}

.kb-article-body[b-whd3wy2eme]  td {
    border: 1px solid var(--lw-border);
    padding: 8px 10px;
}

.kb-article-body[b-whd3wy2eme]  code {
    background: var(--lw-bg-secondary);
    border-radius: 4px;
    font-size: 0.875em;
    padding: 1px 5px;
}

.kb-article-body[b-whd3wy2eme]  strong {
    font-weight: 600;
}
/* _content/Ledgerwise/Components/Pages/Rfp/RfpDocuments.razor.rz.scp.css */
/* Vendor RFP documents page -- composed from the RFP detail drawer's
   documents vocabulary (2026-07-23). Page layout only; card chrome from
   ControlCard, title tokens from lw-page.css. */

.rfd-page[b-pqfrp0n80y] {
    display: flex;
    flex-direction: column;
    gap: 20px;
    max-width: 960px;
    margin: 0 auto;
    padding: 24px 16px;
}

.rfd-titlebar[b-pqfrp0n80y] {
    margin-bottom: 0;
}

.rfd-back[b-pqfrp0n80y] {
    align-self: flex-start;
    margin-top: 12px;
}

.rfd-desc[b-pqfrp0n80y] {
    margin: 0 0 16px;
    font-size: 14px;
    line-height: 1.625;
    color: var(--lw-text-primary);
    white-space: pre-wrap;
}

.rfd-doc-list[b-pqfrp0n80y] {
    display: flex;
    flex-direction: column;
    gap: 8px;
}

.rfd-doc[b-pqfrp0n80y] {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 12px 16px;
    border: 1px solid var(--lw-border);
    border-radius: var(--lw-radius-card);
    background: var(--lw-white);
}

.rfd-doc[b-pqfrp0n80y]  .rfd-doc-icon.mud-icon-root {
    font-size: 20px;
    width: 20px;
    height: 20px;
    color: var(--lw-primary-blue);
    flex-shrink: 0;
}

.rfd-doc-text[b-pqfrp0n80y] {
    display: flex;
    flex-direction: column;
    min-width: 0;
    flex: 1;
}

.rfd-doc-name[b-pqfrp0n80y] {
    font-size: 14px;
    font-weight: var(--lw-font-medium);
    color: var(--lw-text-primary);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.rfd-doc-size[b-pqfrp0n80y] {
    font-size: 12px;
    color: var(--lw-gray-graphite);
}

.rfd-doc-actions[b-pqfrp0n80y] {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    flex-shrink: 0;
}

.rfd-doc-btn[b-pqfrp0n80y] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 28px;
    height: 28px;
    border: none;
    background: transparent;
    padding: 0;
    color: var(--lw-gray-graphite);
    cursor: pointer;
    transition: color 0.15s;
}

.rfd-doc-btn:hover[b-pqfrp0n80y] {
    color: var(--lw-primary-blue);
}
/* _content/Ledgerwise/Components/Pages/Rfp/RfpDocumentsGuest.razor.rz.scp.css */
/* Public vendor RFP page -- shared RFP documents vocabulary (2026-07-23).
   Page layout only; card chrome from ControlCard, banner from LwCallout. */

.rfg-page[b-fxln5dm549] {
    display: flex;
    flex-direction: column;
    gap: 20px;
    max-width: 960px;
    margin: 0 auto;
    padding: 24px 16px;
}

/* ---- Access denied ---- */

.rfg-denied[b-fxln5dm549] {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 12px;
    padding: 64px 16px;
    text-align: center;
}

.rfg-denied-tile[b-fxln5dm549] {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 56px;
    height: 56px;
    border-radius: var(--lw-radius-card);
    background: var(--lw-status-warning-bg);
    color: var(--lw-status-warning-fg);
}

.rfg-denied-title[b-fxln5dm549] {
    margin: 0;
    font-family: var(--lw-font-family-heading);
    font-size: 22px;
    font-weight: var(--lw-font-bold);
    color: var(--lw-text-primary);
}

.rfg-denied-desc[b-fxln5dm549] {
    margin: 0;
    font-size: 14px;
    color: var(--lw-gray-graphite);
}

/* ---- RFP details ---- */

.rfg-desc[b-fxln5dm549] {
    margin: 0 0 16px;
    font-size: 14px;
    line-height: 1.625;
    color: var(--lw-text-primary);
    white-space: pre-wrap;
}

.rfg-doc-list[b-fxln5dm549] {
    display: flex;
    flex-direction: column;
    gap: 8px;
}

.rfg-doc[b-fxln5dm549] {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 12px 16px;
    border: 1px solid var(--lw-border);
    border-radius: var(--lw-radius-card);
    background: var(--lw-white);
}

.rfg-doc[b-fxln5dm549]  .rfg-doc-icon.mud-icon-root {
    font-size: 20px;
    width: 20px;
    height: 20px;
    color: var(--lw-primary-blue);
    flex-shrink: 0;
}

.rfg-doc-text[b-fxln5dm549] {
    display: flex;
    flex-direction: column;
    min-width: 0;
    flex: 1;
}

.rfg-doc-name[b-fxln5dm549] {
    font-size: 14px;
    font-weight: var(--lw-font-medium);
    color: var(--lw-text-primary);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.rfg-doc-size[b-fxln5dm549] {
    font-size: 12px;
    color: var(--lw-gray-graphite);
}

.rfg-doc-actions[b-fxln5dm549] {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    flex-shrink: 0;
}

.rfg-doc-btn[b-fxln5dm549] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 28px;
    height: 28px;
    border: none;
    background: transparent;
    padding: 0;
    color: var(--lw-gray-graphite);
    cursor: pointer;
    transition: color 0.15s;
}

.rfg-doc-btn:hover[b-fxln5dm549] {
    color: var(--lw-primary-blue);
}

/* ---- Submit form ---- */

.rfg-form[b-fxln5dm549] {
    display: flex;
    flex-direction: column;
    gap: 16px;
}

.rfg-dropzone[b-fxln5dm549] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    text-align: center;
    padding: 32px 24px;
    border: 2px dashed rgba(145, 158, 171, 0.32);
    border-radius: var(--lw-radius-card);
    cursor: pointer;
    transition: border-color 0.15s ease, background 0.15s ease;
}

.rfg-dropzone:hover[b-fxln5dm549] {
    border-color: var(--lw-primary-blue);
    background: color-mix(in srgb, var(--lw-primary-blue) 8%, transparent);
}

.rfg-dropzone-tile[b-fxln5dm549] {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 48px;
    height: 48px;
    margin-bottom: 12px;
    border-radius: var(--lw-radius-card);
    background: color-mix(in srgb, var(--lw-primary-dark) 10%, transparent);
    color: var(--lw-primary-dark);
}

.rfg-dropzone-title[b-fxln5dm549] {
    margin: 0;
    font-size: 14px;
    font-weight: var(--lw-font-semibold);
    color: var(--lw-text-primary);
}

.rfg-dropzone-sub[b-fxln5dm549] {
    margin: 2px 0 0;
    font-size: 13px;
    color: var(--lw-gray-graphite);
}

.rfg-dropzone-browse[b-fxln5dm549] {
    color: var(--lw-primary-blue);
    font-weight: var(--lw-font-medium);
}

.rfg-submit-row[b-fxln5dm549] {
    display: flex;
    justify-content: flex-end;
}
/* _content/Ledgerwise/Components/Pages/Styleguide.razor.rz.scp.css */
.sg[b-8g4lcoua9y] {
    max-width: 720px;
    margin: 0 auto;
    padding: 48px 32px;
    display: flex;
    flex-direction: column;
    gap: 40px;
    font-family: var(--lw-font-family, sans-serif);
    color: var(--lw-gray-phantom);
}

.sg-title[b-8g4lcoua9y] {
    font-size: 24px;
    font-weight: 700;
    margin: 0 0 8px;
}

.sg-note[b-8g4lcoua9y] {
    font-size: 14px;
    color: var(--lw-gray-graphite);
    margin: 0;
}

.sg-section[b-8g4lcoua9y] {
    display: flex;
    flex-direction: column;
    gap: 12px;
    padding: 24px;
    background: var(--lw-white);
    border: 1px solid var(--lw-border);
    border-radius: var(--lw-radius-card, 8px);
}

.sg-section-title[b-8g4lcoua9y] {
    font-size: 16px;
    font-weight: 600;
    margin: 0;
}

.sg-src[b-8g4lcoua9y] {
    font-size: 12px;
    color: var(--lw-gray-graphite);
    margin: 0;
    font-family: ui-monospace, monospace;
}

.sg-row[b-8g4lcoua9y] {
    display: flex;
    gap: 24px;
    flex-wrap: wrap;
}

.sg-item[b-8g4lcoua9y] {
    flex: 1 1 260px;
    display: flex;
    flex-direction: column;
    gap: 8px;
    /* Atoms sit on the muted app background in situ; mirror it here. */
    background: var(--lw-bg-muted);
    padding: 16px;
    border-radius: 8px;
}

.sg-label[b-8g4lcoua9y] {
    font-size: 12px;
    font-weight: 500;
    color: var(--lw-gray-graphite);
    margin: 0;
}

/* Stand-in for the .lw-modal dialog panel (app.css) so the LwModalHeader/
   Body/Footer atoms can be shown composed without a MudDialog provider:
   same form-surface panel, card radius, clipped corners. */
.sg-modal-frame[b-8g4lcoua9y] {
    max-width: 440px;
    border-radius: var(--lw-radius-card);
    overflow: hidden;
    background: var(--lw-form-surface);
    box-shadow: var(--lw-shadow-card);
}

/* Bottom-sheet silhouette (.lw-modal--sheet in mudblazor-overrides.css). The
   real panel is position:fixed against the viewport bottom, so it cannot be
   embedded; this bounded stand-in carries only the geometry that
   distinguishes a sheet from a dialog -- full-bleed width and the top-only
   12px radius. Chrome inside comes from the real atoms. */
.sg-sheet-frame[b-8g4lcoua9y] {
    max-width: none;
    border-radius: 12px 12px 0 0;
}

/* Wide demo item: the sheet stand-in needs the full row, not a 260px column. */
.sg-item--wide[b-8g4lcoua9y] {
    flex: 1 1 100%;
}

.sg-sheet-note[b-8g4lcoua9y] {
    margin: 0;
    font-size: 14px;
    color: var(--lw-gray-graphite);
}

/* Toast severity swatches. Real toasts are position:fixed bottom-center, so
   un-pin them here to sit inline in the row. ::deep is required -- the toast
   markup belongs to the LwSnackbar child component, not this page. */
.sg-toast-preview[b-8g4lcoua9y]  .lw-snackbar__toast {
    position: static;
    transform: none;
    animation: none;
    width: fit-content;
}
/* _content/Ledgerwise/Components/Pages/Supplier/AddSupplier.razor.rz.scp.css */
/* Add-supplier wizard -- PAGE-SPECIFIC step bodies only. The wizard shell
   (pw-shell / pw-rail* / pw-main / pw-content / pw-stack) lives in
   css/components/lw-wizard.css (AddProject / AddContractor are the other
   consumers). Field grids and the review grid mirror AddContractor. */

[b-zuc9wrtsit] .as-form {
    display: flex;
    flex-direction: column;
    gap: 16px;
}

[b-zuc9wrtsit] .as-grid2 {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 16px;
    align-items: start;
}

@media (max-width: 700px) {
    [b-zuc9wrtsit] .as-grid2 {
        grid-template-columns: minmax(0, 1fr);
    }
}

/* Review step: reference Field label/value grid (1 -> 2 -> 3 columns). */
[b-zuc9wrtsit] .as-review {
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    gap: 20px;
}

@media (min-width: 640px) {
    [b-zuc9wrtsit] .as-review {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (min-width: 1024px) {
    [b-zuc9wrtsit] .as-review {
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }
}

[b-zuc9wrtsit] .as-field {
    display: flex;
    flex-direction: column;
    gap: 2px;
    min-width: 0;
}

[b-zuc9wrtsit] .as-field-label {
    font-family: var(--lw-font-family);
    font-size: 11px;
    font-weight: var(--lw-font-medium);
    text-transform: uppercase;
    letter-spacing: 0.025em;
    color: var(--lw-gray-space);
}

[b-zuc9wrtsit] .as-field-value {
    font-family: var(--lw-font-family);
    font-size: 14px;
    line-height: 20px;
    color: var(--lw-text-primary);
    overflow-wrap: anywhere;
}
/* _content/Ledgerwise/Components/Pages/Supplier/SupplierDetail.razor.rz.scp.css */
/* Supplier detail page -- same grammar as the approved Contractor and
   Project Owner detail pages (2026-07-28): lw-page-titlebar with circle Info
   avatar + items-start alignment, save action in the titlebar, muted body of
   full-width stacked ControlCards. Layout only; control chrome lives in the
   atoms. */

[b-rhmwdo793t] .lw-page-titlebar {
    align-items: flex-start;
    min-height: 88px;
}

[b-rhmwdo793t] .sup-head {
    display: flex;
    align-items: flex-start;
    gap: 16px;
    flex: 1;
    min-width: 0;
}

[b-rhmwdo793t] .sup-head-text {
    display: flex;
    flex-direction: column;
    gap: 4px;
    flex: 1;
    min-width: 0;
}

[b-rhmwdo793t] .sup-head-titlerow {
    display: flex;
    align-items: center;
    gap: 12px;
    flex-wrap: wrap;
}

[b-rhmwdo793t] .sup-head .lw-page-title {
    line-height: 32px;
}

[b-rhmwdo793t] .sup-head-text .lw-page-subtitle {
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

[b-rhmwdo793t] .sup-body {
    display: flex;
    flex-direction: column;
    gap: 24px;
    padding: 24px;
    flex: 1;
}

[b-rhmwdo793t] .sup-cards {
    display: flex;
    flex-direction: column;
    gap: 24px;
}

[b-rhmwdo793t] .sup-form {
    display: flex;
    flex-direction: column;
    gap: 16px;
}

[b-rhmwdo793t] .sup-grid2 {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 16px;
    align-items: start;
}

@media (max-width: 700px) {
    [b-rhmwdo793t] .sup-grid2 {
        grid-template-columns: minmax(0, 1fr);
    }
}

[b-rhmwdo793t] .sup-actions {
    display: flex;
    align-items: center;
    gap: 8px;
}

/* Shadowed-builder callout inside the Account Representatives card */
[b-rhmwdo793t] .sup-shadow-name {
    margin: 0;
    font-family: var(--lw-font-family);
    font-size: 14px;
    font-weight: var(--lw-font-semibold);
    color: var(--lw-text-primary);
}

[b-rhmwdo793t] .sup-shadow-sub,
[b-rhmwdo793t] .sup-muted {
    margin: 0;
    font-family: var(--lw-font-family);
    font-size: 13px;
    line-height: 18px;
    color: var(--lw-gray-graphite);
}

/* Loading skeleton -- card rhythm of the stacked ControlCards */
[b-rhmwdo793t] .sup-skel {
    display: flex;
    flex-direction: column;
    gap: 24px;
}

[b-rhmwdo793t] .sup-skel-card {
    width: 100%;
    border-radius: var(--lw-radius-card);
}

/* Error / not-found states */
[b-rhmwdo793t] .sup-state {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 16px;
    max-width: 560px;
}

[b-rhmwdo793t] .sup-state--center {
    align-items: center;
    align-self: center;
    text-align: center;
    padding: 48px 0;
}

[b-rhmwdo793t] .sup-state-icon.mud-icon-root {
    width: 48px;
    height: 48px;
    font-size: 48px;
    color: var(--lw-gray-graphite);
}

[b-rhmwdo793t] .sup-state-title {
    margin: 0;
    font-family: var(--lw-font-family);
    font-size: 18px;
    font-weight: var(--lw-font-bold);
    color: var(--lw-text-primary);
}

[b-rhmwdo793t] .sup-state-sub {
    margin: 0;
    font-family: var(--lw-font-family);
    font-size: 14px;
    line-height: 20px;
    color: var(--lw-gray-graphite);
}
/* _content/Ledgerwise/Components/Pages/Supplier/SupplierRepresentativesEditor.razor.rz.scp.css */
/* Representatives editor inside the Communication roles / Account
   Representatives ControlCards on SupplierDetail (2026-07-28). Same section
   grammar as the approved detail pages: 14/semibold title over 13px graphite
   helper (mirrors sup-shadow-name/-sub), LwTextField rows on a 16px grid,
   global lw-page-action / lw-table-kebab affordances. Layout + local danger
   hover only -- field chrome lives in the atoms. */

.lw-rep-editor[b-4z5abmtcj8] {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 12px;
}

.rep-title[b-4z5abmtcj8] {
    margin: 0;
    font-family: var(--lw-font-family);
    font-size: 14px;
    font-weight: var(--lw-font-semibold);
    color: var(--lw-text-primary);
}

/* Helper hugs the title above it (4px), rows follow at the 12px rhythm. */
.rep-title + .rep-helper[b-4z5abmtcj8] {
    margin-top: -8px;
}

.rep-helper[b-4z5abmtcj8] {
    margin: 0;
    font-family: var(--lw-font-family);
    font-size: 13px;
    line-height: 18px;
    color: var(--lw-gray-graphite);
}

.rep-rows[b-4z5abmtcj8] {
    display: flex;
    flex-direction: column;
    gap: 12px;
    align-self: stretch;
}

/* First / Last / wider Email / remove -- the old 3-3-5-1 MudGrid split. */
.rep-row[b-4z5abmtcj8] {
    display: grid;
    grid-template-columns: minmax(0, 3fr) minmax(0, 3fr) minmax(0, 5fr) auto;
    gap: 16px;
    align-items: center;
}

.rep-remove[b-4z5abmtcj8] {
    border-radius: var(--lw-radius-control);
}

.rep-remove:hover:not(:disabled)[b-4z5abmtcj8] {
    background: var(--lw-status-error-bg);
    color: var(--lw-status-error-fg);
}

.rep-remove:disabled[b-4z5abmtcj8] {
    opacity: 0.5;
    cursor: default;
}

/* Shown when the host card owns the add affordance in its header. */
.rep-empty[b-4z5abmtcj8] {
    margin: 0;
    font-family: var(--lw-font-family);
    font-size: 13px;
    line-height: 18px;
    color: var(--lw-gray-graphite);
}

.rep-add:disabled[b-4z5abmtcj8] {
    opacity: 0.5;
    cursor: default;
}

@media (max-width: 700px) {
    .rep-row[b-4z5abmtcj8] {
        grid-template-columns: minmax(0, 1fr) auto;
    }

    .rep-row > :nth-child(3)[b-4z5abmtcj8] {
        grid-column: 1 / -1;
    }
}
/* _content/Ledgerwise/Components/Pages/Test/DocumentSigningTabs/TestMergeSigningDocuments.razor.rz.scp.css */
.table-active[b-3rmp555ncp] {
    background-color: var(--lw-status-info-bg) !important;
}

.badge[b-3rmp555ncp] {
    font-size: 0.875rem;
}

.alert ul[b-3rmp555ncp] {
    padding-left: 1.25rem;
}

.card-header h6[b-3rmp555ncp] {
    margin-bottom: 0;
}

.list-group-item[b-3rmp555ncp] {
    border-color: var(--lw-border);
}

.list-group-item .bi-file-pdf[b-3rmp555ncp] {
    font-size: 1.25rem;
}

.list-group-item button[b-3rmp555ncp] {
    min-width: 90px;
}
/* _content/Ledgerwise/Components/Shared/AddressAutocomplete.razor.rz.scp.css */
/* FieldShell outlined chrome -- source: ledgerwise-app
   src/components/ui/field-shell.tsx + create-fields.tsx AddressSearchField.
   Spec (measured 2026-07-24 on the project-create modal): 54px white box,
   8px radius, border rgba(145,158,171,.4); text 14px/22px; label 14px resting
   inline -> 12px floated to the notch; focus border = foreground (1px, no
   Mud-style 2px primary). Mirrors LwTextField.razor.css state-for-state. */
.address-ac[b-w5l6tjuter] {
    position: relative;
    height: 54px;
    box-sizing: border-box;
    border: 1px solid var(--lw-input-border);
    border-radius: var(--lw-radius-control);
    background: var(--lw-white);
    display: flex;
    align-items: center;
    transition: border-color 0.2s;
}

/* FieldShell: hover does NOT change the border; focus goes foreground-dark. */
.address-ac--focused[b-w5l6tjuter] {
    border-color: var(--lw-gray-phantom);
}

/* Floating label -- rests inline (centered, muted), floats to the notch when
   focused or filled. Color states per FieldShell: resting gray-space,
   floated graphite, focused phantom. */
.address-ac__label[b-w5l6tjuter] {
    position: absolute;
    top: 50%;
    left: 0;
    transform: translate(13px, -50%) scale(1);
    transform-origin: top left;
    padding: 0 2px;
    background: transparent;
    font-size: 14px;
    font-weight: 400;
    line-height: 22px;
    color: var(--lw-gray-space);
    pointer-events: none;
    transition: top 0.2s cubic-bezier(0, 0, 0.2, 1), transform 0.2s cubic-bezier(0, 0, 0.2, 1), color 0.2s;
    white-space: nowrap;
}

.address-ac--has-icon .address-ac__label[b-w5l6tjuter] {
    left: 27px;
}

.address-ac--filled .address-ac__label[b-w5l6tjuter] {
    top: 0;
    left: 0;
    transform: translate(13px, -11px) scale(0.857);
    background: var(--lw-white);
    color: var(--lw-gray-graphite);
}

.address-ac--focused .address-ac__label[b-w5l6tjuter] {
    color: var(--lw-gray-phantom);
}

/* Input */
.address-ac__input[b-w5l6tjuter] {
    width: 100%;
    height: 100%;
    border: none;
    outline: none;
    background: transparent;
    padding: 16px 14px;
    font-size: 14px;
    font-weight: 400;
    font-family: var(--lw-font-family);
    line-height: 22px;
    color: var(--lw-text-primary);
    box-sizing: border-box;
}

.address-ac__input[b-w5l6tjuter]::placeholder {
    color: var(--lw-gray-space);
    opacity: 1;
}

/* Optional leading icon (e.g. the map pin on the project address field) --
   reference AddressSearchField: 16px muted pin at the left edge. */
.address-ac__icon[b-w5l6tjuter] {
    position: absolute;
    left: 14px;
    top: 50%;
    transform: translateY(-50%);
    display: inline-flex;
    align-items: center;
    pointer-events: none;
    color: var(--lw-gray-space);
}

.address-ac__icon[b-w5l6tjuter]  .mud-icon-root {
    width: 16px;
    height: 16px;
    font-size: 16px;
    color: currentColor !important;
}

/* Clear the icon so the value/placeholder never sits under it. */
.address-ac--has-icon .address-ac__input[b-w5l6tjuter] {
    padding-left: 38px;
}
/* _content/Ledgerwise/Components/Shared/Atoms/LwAvatar.razor.rz.scp.css */
/* Source: ledgerwise-app ui/avatar.tsx + atoms/project-avatar.tsx (2026-07-10).
   Squircle (org/project) / circle (person); brand-gradient fill behind the
   initials fallback; initials semibold uppercase, tracking-tight (-0.025em),
   tabular-nums, scaled by label length; house glyph fallback when empty. */

.lw-avatar[b-y3o81b8bbs] {
    display: flex;
    flex-shrink: 0;
    align-items: center;
    justify-content: center;
    overflow: hidden;
    color: var(--lw-white);
}

.lw-avatar--squircle[b-y3o81b8bbs] {
    border-radius: var(--lw-radius-control);
}

.lw-avatar--circle[b-y3o81b8bbs] {
    border-radius: 50%;
}

/* The single shared lighter-blue project gradient (135deg), token-backed. */
.lw-avatar--gradient[b-y3o81b8bbs] {
    background: var(--lw-gradient-project-avatar);
}

/* Non-gradient initials fallback (e.g. person/neutral). */
.lw-avatar--neutral[b-y3o81b8bbs] {
    background: var(--lw-bg-secondary);
    color: var(--lw-gray-graphite);
}

/* Tone fills (ui/avatar.tsx colorMap): primary = solid brand accent + white;
   secondary/info/warning = 12% tint + matching accessible text, sharing the
   status-pair tokens (identical values to the reference avatar tokens). */
.lw-avatar--tone-primary[b-y3o81b8bbs] {
    background: var(--lw-primary-blue);
    color: var(--lw-primary-blue-fg);
}

.lw-avatar--tone-secondary[b-y3o81b8bbs] {
    background: var(--lw-status-secondary-bg);
    color: var(--lw-status-secondary-fg);
}

.lw-avatar--tone-info[b-y3o81b8bbs] {
    background: var(--lw-status-info-bg);
    color: var(--lw-status-info-fg);
}

.lw-avatar--tone-warning[b-y3o81b8bbs] {
    background: var(--lw-status-warning-bg);
    color: var(--lw-status-warning-fg);
}

/* Behind a loaded image (transparent PNGs read on a neutral placeholder). */
.lw-avatar--image[b-y3o81b8bbs] {
    background: var(--lw-bg-secondary);
}

.lw-avatar-img[b-y3o81b8bbs] {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.lw-avatar-initials[b-y3o81b8bbs] {
    font-weight: var(--lw-font-semibold);
    text-transform: uppercase;
    line-height: 1;
    letter-spacing: var(--lw-tracking-tight);
    font-variant-numeric: tabular-nums;
}

.lw-avatar-fallback[b-y3o81b8bbs] {
    display: block;
}
/* _content/Ledgerwise/Components/Shared/Atoms/LwBalanceStat.razor.rz.scp.css */
/* Source: US-476 ledger mockup (ledgerwise-docs/plan/assets/us-476-ledger-mockup.html),
   measured 2026-07-30 at 1500px.

   Measured -> shipped. Where the mockup and a --lw-* token disagree the TOKEN WINS
   (US-476 section 9.1.0), because the mockup is a standalone artefact and not built
   on this design system:

     card radius     mock 12px          -> --lw-radius-card (8px)
     card border     mock #DDE6ED       -> --lw-border
     card shadow     mock none          -> --lw-shadow-card (matches sibling cards here)
     label colour    mock #5F7280       -> --lw-gray-graphite (#6E7180)
     caption colour  mock #8FA0AE       -> --lw-gray-space (#9DA2B3)
     figure navy     mock #020B2B       -> --lw-primary-dark  (exact match)
     figure green    mock #4F7A5C       -> --lw-success-dark  (#2D7A5F, the accessible token)
     figure muted    mock #6E7180       -> --lw-gray-graphite (exact match)

   Carried across as measured: label 12/600 +0.02em, figure 26/800 -0.02em,
   caption 12/400, padding 16px 20px. */

.lw-balance-stat[b-7tx3eztm4y] {
    display: flex;
    flex-direction: column;
    padding: 1rem 1.25rem;
    background: var(--lw-white);
    border: 1px solid var(--lw-border);
    border-radius: var(--lw-radius-card);
    box-shadow: var(--lw-shadow-card);
    box-sizing: border-box;
}

.lw-balance-stat-label[b-7tx3eztm4y] {
    margin: 0;
    font-size: 12px;
    font-weight: 600;
    letter-spacing: 0.02em;
    color: var(--lw-gray-graphite);
}

.lw-balance-stat-figure[b-7tx3eztm4y] {
    margin: 0.25rem 0 0;
    font-size: 26px;
    font-weight: 800;
    line-height: 1.5;
    letter-spacing: var(--lw-tracking-tight);
    font-family: var(--lw-font-family-heading);
}

.lw-balance-stat-figure--default[b-7tx3eztm4y] { color: var(--lw-primary-dark); }
.lw-balance-stat-figure--muted[b-7tx3eztm4y]   { color: var(--lw-gray-graphite); }

/* Allocation parts draw from the categorical chart ramp, so a figure and the ring
   segment for the same quantity are painted from one step. Before this they disagreed
   -- the cards used graphite for both Committed and Reserved, which the ring could not
   use because graphite is near-achromatic and unreadable as a mark. */
.lw-balance-stat-figure--committed[b-7tx3eztm4y] { color: var(--lw-chart-1); }
.lw-balance-stat-figure--reserved[b-7tx3eztm4y]  { color: var(--lw-chart-2); }
.lw-balance-stat-figure--available[b-7tx3eztm4y] { color: var(--lw-chart-3); }

.lw-balance-stat-caption[b-7tx3eztm4y] {
    margin: 0.125rem 0 0;
    font-size: 12px;
    font-weight: 400;
    line-height: 1.5;
    color: var(--lw-gray-space);
}

/* The figure is the one thing that must stay readable when the row is squeezed;
   the mockup's 26px is a 1500px measurement. */
@media (max-width: 599px) {
    .lw-balance-stat[b-7tx3eztm4y] { padding: 0.875rem 1rem; }
    .lw-balance-stat-figure[b-7tx3eztm4y] { font-size: 22px; }
}
/* _content/Ledgerwise/Components/Shared/Atoms/LwButton.razor.rz.scp.css */
/* Measured spec from ledgerwise-app ui/button.tsx (2026-07-08 auth; action
   added 2026-07-19):
   - auth: h 48px, full width, radius 8px, bg --primary (#020B2B via
     theme/overrides), label 13px/500 Inter.
   - action: h-10 (40px), px-5, 14px/500, radius-control, navy, hover
     primary/90, disabled bg grey-smoke / text grey-space. */

.lw-button[b-iqnc6jo7im] {
    width: 100%;
}

.lw-button--inline[b-iqnc6jo7im] { width: auto; }
.lw-button--inline .lw-button-native[b-iqnc6jo7im] { width: auto; }

.lw-button[b-iqnc6jo7im]  button.mud-button-root {
    height: 48px;
    font-size: 13px;
    font-weight: 500;
    line-height: 18.5px;
}

/* Native (interactive) variant */
.lw-button .lw-button-native[b-iqnc6jo7im] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    width: 100%;
    height: 48px;
    padding: 0 20px;
    border: none;
    border-radius: var(--lw-radius-control);
    background: var(--lw-primary-dark);
    color: var(--lw-primary-dark-fg);
    font-family: var(--lw-font-family);
    font-size: 13px;
    font-weight: 500;
    cursor: pointer;
    transition: background-color 0.15s ease;
}

.lw-button--action .lw-button-native[b-iqnc6jo7im] {
    height: 40px;
    font-size: 0.875rem;
}

.lw-button .lw-button-native:hover:not(:disabled)[b-iqnc6jo7im] {
    background: var(--lw-primary-dark-hover);
}

.lw-button .lw-button-native:focus-visible[b-iqnc6jo7im] {
    outline: 2px solid var(--lw-primary-blue);
    outline-offset: 2px;
}

/* Reference button.tsx disabled = opacity-50 with the fill unchanged. */
.lw-button .lw-button-native:disabled[b-iqnc6jo7im] {
    opacity: 0.5;
    cursor: not-allowed;
}

/* Ghost variant (bordered secondary: doc-action-bar Back/Download idiom). */
.lw-button--ghost .lw-button-native[b-iqnc6jo7im] {
    background: transparent;
    border: 1px solid var(--lw-border);
    color: var(--lw-text-primary);
}

.lw-button--ghost .lw-button-native:hover:not(:disabled)[b-iqnc6jo7im] {
    background: var(--lw-accent);
}
/* _content/Ledgerwise/Components/Shared/Atoms/LwCallout.razor.rz.scp.css */
/* LwCallout -- page-level info callout.
   Source: ledgerwise-ui-app ho-step-identity-verification.tsx entity-guidance
   panel: "flex items-start gap-3 rounded-card border border-brand-accent/30
   bg-info-bg p-4"; icon "mt-0.5 size-5 text-brand-accent"; title "text-sm
   font-semibold text-foreground"; body "mt-0.5 text-sm leading-relaxed
   text-content-secondary". --info-bg = rgba(57,128,165,.12) = our
   --lw-status-info-bg. Measured from source 2026-07-19.
   Tones (2026-07-29): the same box over the other status token pairs, so a
   warning/error/success callout is the Info callout with its fill, 30%-alpha
   border, and glyph swapped -- no second shape. */

.lw-callout[b-3ket0px8jf] {
    display: flex;
    align-items: flex-start;
    gap: 12px;
    border: 1px solid color-mix(in srgb, var(--lw-primary-blue) 30%, transparent);
    border-radius: var(--lw-radius-card);
    background: var(--lw-status-info-bg);
    padding: 16px;
}

.lw-callout-icon[b-3ket0px8jf] {
    margin-top: 2px;
    flex-shrink: 0;
    display: inline-flex;
    color: var(--lw-primary-blue);
}

.lw-callout-icon svg[b-3ket0px8jf],
.lw-callout-icon[b-3ket0px8jf]  .mud-icon-root,
.lw-callout-icon[b-3ket0px8jf]  svg {
    display: block;
    width: 20px;
    height: 20px;
    font-size: 20px;
}

/* Tones -- status token pairs from branding.css (mirrors LwCardNote). */
.lw-callout--warning[b-3ket0px8jf] {
    border-color: color-mix(in srgb, var(--lw-status-warning-fg) 30%, transparent);
    background: var(--lw-status-warning-bg);
}

.lw-callout--warning .lw-callout-icon[b-3ket0px8jf] {
    color: var(--lw-status-warning-fg);
}

.lw-callout--error[b-3ket0px8jf] {
    border-color: color-mix(in srgb, var(--lw-status-error-fg) 30%, transparent);
    background: var(--lw-status-error-bg);
}

.lw-callout--error .lw-callout-icon[b-3ket0px8jf] {
    color: var(--lw-status-error-fg);
}

.lw-callout--success[b-3ket0px8jf] {
    border-color: color-mix(in srgb, var(--lw-status-success-fg) 30%, transparent);
    background: var(--lw-status-success-bg);
}

.lw-callout--success .lw-callout-icon[b-3ket0px8jf] {
    color: var(--lw-status-success-fg);
}

.lw-callout-body[b-3ket0px8jf] { min-width: 0; }

.lw-callout-title[b-3ket0px8jf] {
    margin: 0;
    font-size: 0.875rem;
    font-weight: 600;
    color: var(--lw-text-primary);
}

.lw-callout-text[b-3ket0px8jf] {
    margin: 2px 0 0;
    font-size: 0.875rem;
    line-height: 1.625;
    color: var(--lw-gray-graphite);
}

.lw-callout-text[b-3ket0px8jf]  strong {
    font-weight: 600;
    color: var(--lw-text-primary);
}
/* _content/Ledgerwise/Components/Shared/Atoms/LwCardBody.razor.rz.scp.css */
/* LwCardBody -- source: control-card.tsx body / vendor-intro-card.tsx rows.
   Measured 2026-07-13: pad 24 (20 below md); rows variant = column, gap 20. */

.lw-card-body[b-ew27cyyjq1] {
    padding: 24px;
}

.lw-card-body--rows[b-ew27cyyjq1] {
    display: flex;
    flex-direction: column;
    gap: 20px;
}

@media (max-width: 768px) {
    .lw-card-body[b-ew27cyyjq1] {
        /* Reference px-5 py-6 md:px-6: only the horizontal padding drops. */
        padding: 24px 20px;
    }
}
/* _content/Ledgerwise/Components/Shared/Atoms/LwCardCta.razor.rz.scp.css */
/* LwCardCta -- source: vendor-intro-card.tsx CTA (button.tsx size action,
   h-11 w-full). Measured 2026-07-13: 44px, radius 8, navy #020B2B, white
   14/500, gap 8, 16px glyphs; hover primary/90. */

.lw-card-cta[b-oir685l3a3] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    width: 100%;
    height: 44px;
    padding: 0 20px;
    border: 0;
    border-radius: var(--lw-radius-control);
    background: var(--lw-primary-dark);
    color: var(--lw-white);
    cursor: pointer;
    font-family: var(--lw-font-family);
    font-size: 14px;
    font-weight: 500;
    line-height: 22px;
    transition: background-color 0.15s ease;
}

.lw-card-cta:hover:not(:disabled)[b-oir685l3a3] {
    background: var(--lw-primary-dark-hover);
}

.lw-card-cta:disabled[b-oir685l3a3] {
    opacity: 0.5;
    cursor: default;
}

/* Root <button> carries the scope itself, so ::deep hangs off it (not a
   leading ::deep, which would require a scoped ancestor above the root). */
.lw-card-cta[b-oir685l3a3]  svg,
.lw-card-cta[b-oir685l3a3]  .mud-icon-root {
    width: 16px;
    height: 16px;
    font-size: 16px;
    flex-shrink: 0;
}

.lw-card-cta:focus-visible[b-oir685l3a3] {
    outline: 2px solid var(--lw-primary-blue);
    outline-offset: 2px;
}
/* _content/Ledgerwise/Components/Shared/Atoms/LwCardFooter.razor.rz.scp.css */
/* LwCardFooter -- source: vendor-intro-card.tsx footer.
   Measured 2026-07-13: white, border-t --lw-border, pad 20/24 (20 below md).
   Fine print under the CTA: 12/18 muted, centered, 12px above. */

.lw-card-footer[b-g862fel570] {
    padding: 20px 24px;
    background: var(--lw-white);
    border-top: 1px solid var(--lw-border);
    border-radius: 0 0 var(--lw-radius-card) var(--lw-radius-card);
}

[b-g862fel570] .lw-card-footer-note {
    margin: 12px 0 0;
    text-align: center;
    font-family: var(--lw-font-family);
    font-size: 12px;
    line-height: 18px;
    color: var(--lw-gray-space);
}

@media (max-width: 768px) {
    .lw-card-footer[b-g862fel570] {
        padding: 20px;
    }
}
/* _content/Ledgerwise/Components/Shared/Atoms/LwCardHeader.razor.rz.scp.css */
/* LwCardHeader -- source: control-card.tsx / vendor-intro-card.tsx header.
   Measured 2026-07-13: white band, border-b --lw-border, pad 16/24 (20 below
   md), gap 14; tile 44px radius 8 info-bg + brand accent w/ 20px glyph;
   title 16/700/24 text-primary; sub 12/16 muted (--lw-gray-space), truncates. */

.lw-card-header[b-su87kixpnw] {
    display: flex;
    align-items: center;
    gap: 14px;
    padding: 16px 24px;
    background: var(--lw-white);
    border-bottom: 1px solid var(--lw-border);
    border-radius: var(--lw-radius-card) var(--lw-radius-card) 0 0;
}

.lw-card-header-tile[b-su87kixpnw] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 44px;
    height: 44px;
    flex-shrink: 0;
    border-radius: var(--lw-radius-card);
    background: var(--lw-status-info-bg);
    color: var(--lw-primary-blue);
}

[b-su87kixpnw] .lw-card-header-tile svg,
[b-su87kixpnw] .lw-card-header-tile .mud-icon-root {
    width: 20px;
    height: 20px;
    font-size: 20px;
}

.lw-card-header-text[b-su87kixpnw] {
    min-width: 0;
    flex: 1;
}

.lw-card-header-title[b-su87kixpnw] {
    margin: 0;
    font-family: var(--lw-font-family);
    font-size: 16px;
    font-weight: 700;
    line-height: 24px;
    color: var(--lw-text-primary);
}

.lw-card-header-sub[b-su87kixpnw] {
    margin: 0;
    font-family: var(--lw-font-family);
    font-size: 12px;
    line-height: 16px;
    color: var(--lw-gray-space);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.lw-card-header-action[b-su87kixpnw] {
    flex-shrink: 0;
}

@media (max-width: 768px) {
    .lw-card-header[b-su87kixpnw] {
        padding: 16px 20px;
    }
}
/* _content/Ledgerwise/Components/Shared/Atoms/LwCardNote.razor.rz.scp.css */
/* LwCardNote -- source: control-card.tsx note box.
   Measured spec 2026-07-13: muted bg, radius 8, pad 12, gap 10; 16px glyph
   (2px optical drop), text 12/18 content-secondary, strong = 600 primary.
   Info/Warning/Error tones are the Blazor extension over status tokens. */

.lw-card-note[b-ui26e4hb7w] {
    display: flex;
    align-items: flex-start;
    gap: 10px;
    padding: 12px;
    border-radius: var(--lw-radius-card);
    background: var(--lw-bg-muted);
}

.lw-card-note-icon[b-ui26e4hb7w] {
    flex-shrink: 0;
    margin-top: 2px;
    color: var(--lw-gray-graphite);
}

.lw-card-note-icon svg[b-ui26e4hb7w] {
    display: block;
    width: 16px;
    height: 16px;
}

.lw-card-note-text[b-ui26e4hb7w] {
    margin: 0;
    font-family: var(--lw-font-family);
    font-size: 12px;
    line-height: 18px;
    color: var(--lw-gray-graphite);
}

[b-ui26e4hb7w] .lw-card-note-text strong {
    font-weight: 600;
    color: var(--lw-text-primary);
}

/* Tones (Blazor extension -- status token pairs from branding.css). */
.lw-card-note--info[b-ui26e4hb7w] {
    background: var(--lw-status-info-bg);
}

.lw-card-note--info .lw-card-note-icon[b-ui26e4hb7w],
.lw-card-note--info .lw-card-note-text[b-ui26e4hb7w] {
    color: var(--lw-primary-blue);
}

.lw-card-note--warning[b-ui26e4hb7w] {
    background: var(--lw-status-warning-bg);
}

.lw-card-note--warning .lw-card-note-icon[b-ui26e4hb7w],
.lw-card-note--warning .lw-card-note-text[b-ui26e4hb7w] {
    color: var(--lw-status-warning-fg);
}

.lw-card-note--error[b-ui26e4hb7w] {
    background: var(--lw-status-error-bg);
}

.lw-card-note--error .lw-card-note-icon[b-ui26e4hb7w],
.lw-card-note--error .lw-card-note-text[b-ui26e4hb7w] {
    color: var(--lw-status-error-fg);
}

.lw-card-note--success[b-ui26e4hb7w] {
    background: var(--lw-status-success-bg);
}

.lw-card-note--success .lw-card-note-icon[b-ui26e4hb7w],
.lw-card-note--success .lw-card-note-text[b-ui26e4hb7w] {
    color: var(--lw-status-success-fg);
}
/* _content/Ledgerwise/Components/Shared/Atoms/LwCheckbox.razor.rz.scp.css */
/* Source: ledgerwise-app native checkbox pattern (18px, accent navy) +
   the auth terms-row layout. Label is 14px/22px foreground. */

.lw-checkbox[b-ich2kp6cdz]  .lw-checkbox__row {
    display: flex;
    align-items: flex-start;
    gap: 10px;
    cursor: pointer;
    user-select: none;
}

.lw-checkbox[b-ich2kp6cdz]  .lw-checkbox__box {
    width: 18px;
    height: 18px;
    margin: 2px 0 0;
    accent-color: var(--lw-primary-dark);
    cursor: pointer;
    flex-shrink: 0;
}

.lw-checkbox[b-ich2kp6cdz]  .lw-checkbox__label {
    font-size: 14px;
    line-height: 22px;
    color: var(--lw-gray-phantom);
}

.lw-checkbox[b-ich2kp6cdz]  .lw-checkbox__label a {
    color: var(--lw-primary-dark);
    font-weight: 600;
}
/* _content/Ledgerwise/Components/Shared/Atoms/LwChip.razor.rz.scp.css */
/* Source: ledgerwise-ui ui/chip.tsx -- md size (px-3 py-1.5 text-[13px]),
   rounded-md, 500/600 weight; count pill 18px, tabular. */

.lw-chip[b-cpsd9fascw] {
    display: inline-flex;
    flex-shrink: 0;
    align-items: center;
    gap: 6px;
    padding: 6px 12px;
    border-radius: var(--lw-radius-control);
    font-family: var(--lw-font-family);
    font-size: 13px;
    font-weight: 500;
    cursor: pointer;
    transition: background-color 0.15s ease, color 0.15s ease, border-color 0.15s ease;
}

.lw-chip--outline[b-cpsd9fascw] {
    border: 1px solid var(--lw-border);
    background: transparent;
    color: var(--lw-gray-graphite);
}

.lw-chip--outline:hover[b-cpsd9fascw] {
    background: var(--lw-accent);
    color: var(--lw-text-primary);
}

.lw-chip--active[b-cpsd9fascw] {
    border: 1px solid transparent;
    background: var(--lw-primary-dark);
    color: var(--lw-white);
    font-weight: var(--lw-font-semibold);
}

.lw-chip-count[b-cpsd9fascw] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    height: 18px;
    min-width: 18px;
    padding: 0 4px;
    /* reference chip count: rounded-sm = --radius-control (8px), not 4px. */
    border-radius: var(--lw-radius-control);
    font-size: 10px;
    font-weight: var(--lw-font-bold);
    line-height: 1;
    font-variant-numeric: tabular-nums;
}

/* Reference expresses these as relationships (bg-sidebar-bg/10, bg-white/20)
   -- keep them derived from the tokens, not resolved rgba. */
.lw-chip--outline .lw-chip-count[b-cpsd9fascw] {
    background: color-mix(in srgb, var(--lw-primary-dark) 10%, transparent);
    color: var(--lw-primary-dark);
}

.lw-chip--active .lw-chip-count[b-cpsd9fascw] {
    background: color-mix(in srgb, var(--lw-white) 20%, transparent);
    color: var(--lw-white);
}

/* Tab variant (gc-invoice-table.tsx STATUS_TABS): px-3.5 py-2, semibold
   label; inactive is borderless foreground text with accent hover; active
   navy adds shadow-sm. Count pill chrome is shared. */
.lw-chip--tab[b-cpsd9fascw] {
    padding: 8px 14px;
    font-weight: var(--lw-font-semibold);
    /* Reference tabs are borderless in every state -- the base variants'
       1px transparent border made the chip 2px taller than measured (35.5px). */
    border: 0;
}

.lw-chip--tab.lw-chip--outline[b-cpsd9fascw] {
    border: 0;
    color: var(--lw-text-primary);
}

.lw-chip--tab.lw-chip--outline:hover[b-cpsd9fascw] {
    background: var(--lw-accent);
    color: var(--lw-text-primary);
}

.lw-chip--tab.lw-chip--active[b-cpsd9fascw] {
    box-shadow: var(--lw-shadow-sm);
}

/* Active-tab amount (gc-payment-requests.tsx; measured 2026-07-12):
   13px/700 tabular tracking-tight at 70% of the chip's white text, behind a
   1px 20%-white hairline (ml-1 pl-2). Rendered only while active. */
.lw-chip-amount[b-cpsd9fascw] {
    margin-left: 4px;
    padding-left: 8px;
    border-left: 1px solid color-mix(in srgb, var(--lw-white) 20%, transparent);
    font-size: 13px;
    font-weight: var(--lw-font-bold);
    letter-spacing: var(--lw-tracking-tight);
    font-variant-numeric: tabular-nums;
    color: color-mix(in srgb, var(--lw-white) 70%, transparent);
    white-space: nowrap;
}
/* _content/Ledgerwise/Components/Shared/Atoms/LwDateField.razor.rz.scp.css */
/* LwDateField -- source: ledgerwise-app atoms/date-field.tsx + FieldShell.
   Same measured chrome as LwTextField.razor.css (2026-07-08 spec): 54px white
   box, radius 8, border --lw-input-border, 14/400 value, notched label with
   the muted -> graphite -> phantom state colors. MudDatePicker renders the
   same mud-input-outlined structure, so the recipe carries over. */

.lw-datefield[b-f3uf93tcdx] {
    width: 100%;
}

.lw-datefield[b-f3uf93tcdx]  .mud-input-helper-text {
    font-family: var(--lw-font-family);
    font-size: 13px;
    line-height: 18px;
    margin-top: 4px;
}

.lw-datefield[b-f3uf93tcdx]  .mud-input-control {
    margin-top: 0;
}

.lw-datefield[b-f3uf93tcdx]  .mud-input-outlined {
    font-size: 14px;
    font-weight: 400;
    background-color: var(--lw-white);
    border-radius: var(--lw-radius-control);
}

.lw-datefield[b-f3uf93tcdx]  .mud-input-outlined input.mud-input-slot {
    height: 54px;
    box-sizing: border-box;
    padding: 16px 14px;
    font-size: 14px;
    font-weight: 400;
    /* 16 + 22 + 16 = 54 -- centers the text block exactly like FieldShell. */
    line-height: 22px;
}

.lw-datefield[b-f3uf93tcdx]  .mud-input-label {
    font-size: 14px;
    font-weight: 400;
    line-height: 22px;
    letter-spacing: normal;
    color: var(--lw-gray-space);
}

/* Resting label geometrically centered in the box (same recipe as
   LwTextField/LwNumericField), with `top` in the transition so the float
   stays smooth. */
.lw-datefield[b-f3uf93tcdx]  .mud-input-label-outlined {
    top: 50%;
    transform: translate(13px, -50%) scale(1);
    padding: 0 2px !important;
    transition: top 0.2s cubic-bezier(0, 0, 0.2, 1), transform 0.2s cubic-bezier(0, 0, 0.2, 1), color 0.2s;
}

.lw-datefield[b-f3uf93tcdx]  .mud-shrink ~ label.mud-input-label.mud-input-label-inputcontrol.mud-input-label-outlined,
.lw-datefield[b-f3uf93tcdx]  .mud-input:focus-within ~ label.mud-input-label.mud-input-label-inputcontrol.mud-input-label-outlined {
    top: 0;
    transform: translate(13px, -6px) scale(0.857);
}

.lw-datefield[b-f3uf93tcdx]  .mud-shrink ~ label.mud-input-label.mud-input-label-inputcontrol.mud-input-label-outlined {
    color: var(--lw-gray-graphite);
}

.lw-datefield[b-f3uf93tcdx]  .mud-input:focus-within ~ label.mud-input-label.mud-input-label-inputcontrol.mud-input-label-outlined {
    color: var(--lw-gray-phantom);
}

.lw-datefield[b-f3uf93tcdx]  .mud-input.mud-input-outlined:not(.mud-disabled):not(:focus-within):hover .mud-input-outlined-border {
    border-color: var(--lw-input-border);
}

.lw-datefield[b-f3uf93tcdx]  .mud-input.mud-input-outlined:focus-within > .mud-input-outlined-border,
.lw-datefield[b-f3uf93tcdx]  .mud-input.mud-input-outlined:focus-within .mud-shrink > .mud-input-outlined-border {
    border-width: 1px;
    border-color: var(--lw-gray-phantom);
}

/* FieldShell placeholder behavior (reference date-field.tsx: the label is
   the resting placeholder; nothing shows until open/filled). When a
   Placeholder is set Mud pre-floats the label -- hide the placeholder and
   re-seat the label while empty and unfocused, closing the border notch. */
.lw-datefield[b-f3uf93tcdx]  .mud-input.mud-input-outlined:not(:focus-within) input.mud-input-slot::placeholder {
    color: transparent;
}

.lw-datefield[b-f3uf93tcdx]  .mud-input.mud-input-outlined.mud-shrink:not(:focus-within):has(input.mud-input-slot:placeholder-shown) ~ label.mud-input-label.mud-input-label-inputcontrol.mud-input-label-outlined {
    top: 50%;
    transform: translate(13px, -50%) scale(1);
    color: var(--lw-gray-space);
}

.lw-datefield[b-f3uf93tcdx]  .mud-input.mud-input-outlined.mud-shrink:not(:focus-within):has(input.mud-input-slot:placeholder-shown) .mud-input-outlined-border legend {
    max-width: 0;
    padding: 0;
}

/* Calendar adornment -- gray-space icon at rest, foreground while focused
   (reference: text-muted-foreground -> text-foreground when open). */
.lw-datefield[b-f3uf93tcdx]  .mud-input-adornment .mud-icon-button {
    color: var(--lw-gray-space);
}

.lw-datefield[b-f3uf93tcdx]  .mud-input:focus-within .mud-input-adornment .mud-icon-button {
    color: var(--lw-gray-phantom);
}
/* _content/Ledgerwise/Components/Shared/Atoms/LwDocActionBar.razor.rz.scp.css */
/* LwDocActionBar -- document signing footer bar.
   Source: ledgerwise-ui-app organisms/kickoff/doc-action-bar.tsx +
   ui/button.tsx size=action (measured from source 2026-07-19):
   bar "border-t border-border bg-white px-4 py-3 sm:px-6", flex wrap
   justify-between gap-x-4 gap-y-3; Back/Download "h-10 rounded-md border
   border-border px-4 text-sm font-medium text-foreground hover:bg-accent"
   (download px-3/px-4, 13px, 16px Printer glyph, label hidden < 640px);
   primary Button size=action "h-10 gap-2 rounded-md px-5 text-sm" navy,
   hover primary/90; disabled bg-grey-smoke text-grey-space.
   rounded-md = --radius-control (8px); --accent = rgba(145,158,171,.16). */

.lw-doc-action-bar[b-6p3j54hw9g] {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: space-between;
    column-gap: 16px;
    row-gap: 12px;
    border-top: 1px solid var(--lw-border);
    background: var(--lw-white);
    padding: 12px 16px;
}

@media (min-width: 640px) {
    .lw-doc-action-bar[b-6p3j54hw9g] { padding: 12px 24px; }
}

.lw-dab-side[b-6p3j54hw9g] {
    display: flex;
    align-items: center;
    gap: 10px;
    min-width: 0;
}

.lw-dab-secondary[b-6p3j54hw9g] {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    height: 40px;
    padding: 0 16px;
    border: 1px solid var(--lw-border);
    border-radius: var(--lw-radius-control);
    background: transparent;
    font-family: var(--lw-font-family);
    font-size: 0.875rem;
    font-weight: 500;
    color: var(--lw-text-primary);
    text-decoration: none;
    cursor: pointer;
    transition: background-color 0.15s ease;
}

.lw-dab-secondary:hover[b-6p3j54hw9g] {
    background: var(--lw-accent);
    color: var(--lw-text-primary);
    text-decoration: none;
}

.lw-dab-with-icon[b-6p3j54hw9g] { padding: 0 12px; font-size: 13px; }

@media (min-width: 640px) {
    .lw-dab-with-icon[b-6p3j54hw9g] { padding: 0 16px; }
}

.lw-dab-with-icon[b-6p3j54hw9g]  .mud-icon-root {
    width: 16px;
    height: 16px;
    font-size: 16px;
}

/* Download label collapses to icon-only below 640px, per the reference. */
.lw-dab-download-label[b-6p3j54hw9g] { display: none; }

@media (min-width: 640px) {
    .lw-dab-download-label[b-6p3j54hw9g] { display: inline; }
    .lw-dab-primary[b-6p3j54hw9g] { padding: 0 20px; }
}

.lw-dab-primary[b-6p3j54hw9g] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    height: 40px;
    padding: 0 16px;
    border: none;
    border-radius: var(--lw-radius-control);
    background: var(--lw-primary-dark);
    font-family: var(--lw-font-family);
    font-size: 0.875rem;
    font-weight: 500;
    color: var(--lw-primary-dark-fg);
    cursor: pointer;
    transition: background-color 0.15s ease;
}

.lw-dab-primary:hover:not(:disabled)[b-6p3j54hw9g] {
    background: var(--lw-primary-dark-hover);
}

.lw-dab-primary:disabled[b-6p3j54hw9g] {
    /* Reference: opacity-50 base + grey-smoke/grey-space override. */
    background: var(--lw-gray-smoke);
    color: var(--lw-gray-space);
    opacity: 0.5;
    cursor: not-allowed;
}

.lw-dab-primary:focus-visible[b-6p3j54hw9g],
.lw-dab-secondary:focus-visible[b-6p3j54hw9g] {
    outline: 2px solid var(--lw-primary-blue);
    outline-offset: 2px;
}
/* _content/Ledgerwise/Components/Shared/Atoms/LwDocEmpty.razor.rz.scp.css */
/* Source: ledgerwise-app gc-documents.tsx DocsEmptyState / DocsNoResults
   (2026-07-20). Outer: flex flex-1 items-center justify-center py-10.
   Card: w-full max-w-md flex-col items-center gap-5 rounded-card border
   bg-card px-6 py-12 text-center shadow-card. Medallion: size-14 rounded-full
   bg-info-bg text-brand-accent (muted variant: bg-muted text-muted-fg),
   icon size-7. Title text-base semibold; description text-sm leading-relaxed
   content-secondary max-w-sm. */

.lw-doc-empty[b-743busrzv7] {
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 40px 16px;
}

.lw-doc-empty-card[b-743busrzv7] {
    display: flex;
    flex-direction: column;
    align-items: center;
    text-align: center;
    gap: 20px;
    width: 100%;
    max-width: 28rem;
    padding: 48px 24px;
    border: 1px solid var(--lw-border);
    border-radius: var(--lw-radius-card);
    background: var(--lw-white);
    box-shadow: var(--lw-shadow-card);
}

.lw-doc-empty-medallion[b-743busrzv7] {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 56px;
    height: 56px;
    border-radius: 9999px;
    background: var(--lw-status-info-bg);
    color: var(--lw-primary-blue);
}

.lw-doc-empty-medallion--muted[b-743busrzv7] {
    background: var(--lw-bg-muted);
    color: var(--lw-gray-space);
}

.lw-doc-empty-medallion[b-743busrzv7]  .mud-icon-root { width: 1.75rem; height: 1.75rem; }

.lw-doc-empty-copy[b-743busrzv7] { display: flex; flex-direction: column; gap: 6px; }

.lw-doc-empty-title[b-743busrzv7] {
    margin: 0;
    font-family: var(--lw-font-family);
    font-size: 1rem;
    font-weight: var(--lw-font-semibold);
    color: var(--lw-text-primary);
}

.lw-doc-empty-sub[b-743busrzv7] {
    margin: 0 auto;
    max-width: 24rem;
    font-size: 0.875rem;
    line-height: 1.625;
    color: var(--lw-gray-graphite);
}
/* _content/Ledgerwise/Components/Shared/Atoms/LwEmptyState.razor.rz.scp.css */
/* Source: ledgerwise-app organisms/gc/invoice-empty-state.tsx (shared shape
   of all *-empty-state organisms). Wrapper centers a max-w-xl (576px) card:
   border, card radius/shadow, px-6 py-10 (md:px-10), 28px stack gap,
   text-center. Signature panel: form-surface card, 12px pad, 6px row gap,
   11px bold uppercase label. Headline 22/700 tracking-tight; description
   14px leading-relaxed muted, max-w-md. Points grid: hairline top, 28px pad,
   3 columns >=640px, 20px gap. Slot-internal chrome lives in lw-page.css. */

.lw-empty-wrap[b-lp947x4399] {
    display: flex;
    flex: 1;
    align-items: center;
    justify-content: center;
    padding: 40px 0;
}

.lw-empty-card[b-lp947x4399] {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 28px;
    width: 100%;
    max-width: 576px;
    padding: 40px 24px;
    border: 1px solid var(--lw-border);
    border-radius: var(--lw-radius-card);
    background: var(--lw-white);
    box-shadow: var(--lw-shadow-card);
    text-align: center;
}

@media (min-width: 768px) {
    .lw-empty-card[b-lp947x4399] {
        padding: 40px;
    }
}

.lw-empty-sig[b-lp947x4399] {
    display: flex;
    flex-direction: column;
    gap: 6px;
    width: 100%;
    padding: 12px;
    border: 1px solid var(--lw-border);
    border-radius: var(--lw-radius-card);
    background: var(--lw-form-surface);
    box-shadow: var(--lw-shadow-card);
    text-align: left;
}

.lw-empty-sig-label[b-lp947x4399] {
    margin: 0;
    padding: 0 4px 2px;
    font-size: 11px;
    font-weight: var(--lw-font-bold);
    text-transform: uppercase;
    letter-spacing: 0.025em;
    color: var(--lw-gray-graphite);
}

.lw-empty-msg[b-lp947x4399] {
    display: flex;
    flex-direction: column;
    gap: 8px;
}

.lw-empty-headline[b-lp947x4399] {
    margin: 0;
    font-family: var(--lw-font-family);
    font-size: 22px;
    font-weight: var(--lw-font-bold);
    letter-spacing: var(--lw-tracking-tight);
    color: var(--lw-text-primary);
}

.lw-empty-desc[b-lp947x4399] {
    margin: 0 auto;
    max-width: 448px;
    font-size: 14px;
    line-height: 1.625;
    color: var(--lw-gray-graphite);
}

/* CTA row -- centers one or more .lw-page-action--lg buttons. */
.lw-empty-action[b-lp947x4399] {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    flex-wrap: wrap;
}

.lw-empty-points[b-lp947x4399] {
    display: grid;
    gap: 20px;
    width: 100%;
    border-top: 1px solid var(--lw-border);
    padding-top: 28px;
}

@media (min-width: 640px) {
    .lw-empty-points[b-lp947x4399] {
        grid-template-columns: repeat(3, 1fr);
    }
}
/* _content/Ledgerwise/Components/Shared/Atoms/LwFeatureRow.razor.rz.scp.css */
/* LwFeatureRow -- source: vendor-intro-card.tsx guarantee rows.
   Measured 2026-07-13: gap 14; tile 36 radius 8, border --lw-border, white,
   graphite glyph 16; title 14/600/20 text-primary; body 14 / 1.625 graphite,
   2px above. */

.lw-feature-row[b-83aryimli3] {
    display: flex;
    align-items: flex-start;
    gap: 14px;
}

.lw-feature-row-tile[b-83aryimli3] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 36px;
    height: 36px;
    flex-shrink: 0;
    border: 1px solid var(--lw-border);
    border-radius: var(--lw-radius-card);
    background: var(--lw-white);
    color: var(--lw-gray-graphite);
}

[b-83aryimli3] .lw-feature-row-tile svg,
[b-83aryimli3] .lw-feature-row-tile .mud-icon-root {
    width: 16px;
    height: 16px;
    font-size: 16px;
}

.lw-feature-row-text[b-83aryimli3] {
    min-width: 0;
    flex: 1;
}

.lw-feature-row-title[b-83aryimli3] {
    margin: 0;
    font-family: var(--lw-font-family);
    font-size: 14px;
    font-weight: 600;
    line-height: 20px;
    color: var(--lw-text-primary);
}

.lw-feature-row-body[b-83aryimli3] {
    margin: 2px 0 0;
    font-family: var(--lw-font-family);
    font-size: 14px;
    line-height: 1.625;
    color: var(--lw-gray-graphite);
}
/* _content/Ledgerwise/Components/Shared/Atoms/LwFilterPill.razor.rz.scp.css */
/* Source: ledgerwise-app ui/filter-pill.tsx (2026-07-10).
   h-7 (28px) card pill, rounded-md, hairline border, pl-2.5 (10px) / pr-1 (4px),
   text-13px/500 foreground; muted dimension lead-in; 20px remove button with a
   14px X, hover accent. */

.lw-filter-pill[b-ajleuxbo4t] {
    display: inline-flex;
    flex-shrink: 0;
    align-items: center;
    gap: 4px;
    height: 28px;
    padding-left: 10px;
    padding-right: 4px;
    border-radius: var(--lw-radius-control);
    border: 1px solid var(--lw-border);
    background: var(--lw-white);
    font-size: 13px;
    font-weight: 500;
    color: var(--lw-text-primary);
    white-space: nowrap;
}

.lw-filter-pill-label[b-ajleuxbo4t] {
    overflow: hidden;
    text-overflow: ellipsis;
}

/* Muted dimension prefix (reference text-content-secondary). */
.lw-filter-pill-lead[b-ajleuxbo4t] {
    color: var(--lw-gray-graphite);
    margin-right: 0.25em;
}

.lw-filter-pill-remove[b-ajleuxbo4t] {
    display: inline-flex;
    flex-shrink: 0;
    align-items: center;
    justify-content: center;
    width: 20px;
    height: 20px;
    padding: 0;
    border: 0;
    background: transparent;
    border-radius: var(--lw-radius-sm);
    color: var(--lw-gray-graphite);
    cursor: pointer;
    transition: background-color 0.15s ease, color 0.15s ease;
}

.lw-filter-pill-remove:hover[b-ajleuxbo4t] {
    background: var(--lw-accent);
    color: var(--lw-text-primary);
}

.lw-filter-pill-remove svg[b-ajleuxbo4t] {
    display: block;
    width: 14px;
    height: 14px;
}
/* _content/Ledgerwise/Components/Shared/Atoms/LwInboxStat.razor.rz.scp.css */
/* Source: ledgerwise-app invoice-inbox-panel.tsx PopulatedState stat
   columns, measured 2026-07-28: 2px tone rule, 12px left pad, value
   28px/700 tracking-tight, label 11px/500 muted-foreground. */

.lw-inbox-stat[b-1bold91pqe] {
    display: flex;
    flex-direction: column;
    gap: 0.25rem;
    padding-left: 0.75rem;
    border-left: 2px solid var(--lw-border);
}

.lw-inbox-stat--success[b-1bold91pqe] { border-left-color: var(--lw-success-dark); }
.lw-inbox-stat--warning[b-1bold91pqe] { border-left-color: var(--lw-status-warning-fg); }
.lw-inbox-stat--error[b-1bold91pqe]   { border-left-color: var(--lw-destructive); }

.lw-inbox-stat-value[b-1bold91pqe] {
    font-size: 28px;
    font-weight: 700;
    line-height: 1;
    letter-spacing: var(--lw-tracking-tight);
    color: var(--lw-text-primary);
    font-family: var(--lw-font-family-heading);
    font-variant-numeric: tabular-nums;
}

.lw-inbox-stat-label[b-1bold91pqe] {
    font-size: 11px;
    font-weight: 500;
    color: var(--lw-gray-space);
}
/* _content/Ledgerwise/Components/Shared/Atoms/LwInvoiceTracking.razor.rz.scp.css */
/* Source: ledgerwise-app atoms/invoice-tracking.tsx (2026-07-12):
   flex gap-1 (4px); dots size-[5px] rounded-full;
   on = --success-dark, off = --tracking-grey. */

.lw-invoice-tracking[b-6zs0ifj4i3] {
    display: flex;
    align-items: center;
    gap: 4px;
}

.lw-invoice-tracking-dot[b-6zs0ifj4i3] {
    width: 5px;
    height: 5px;
    border-radius: 50%;
    background: var(--lw-tracking-grey);
}

.lw-invoice-tracking-dot--on[b-6zs0ifj4i3] {
    background: var(--lw-success-dark);
}
/* _content/Ledgerwise/Components/Shared/Atoms/LwKpiCard.razor.rz.scp.css */
/* Source: ledgerwise-app molecules/kpi-card.tsx, measured 2026-07-28 on
   /gc/dashboard @ 1400px: card p 20px (mobile 14px), radius 8, hairline
   border, card shadow; label 11px/600 uppercase +0.1em content-secondary;
   value 32px/700 -0.025em foreground; trend 12px/600 success-dark or
   destructive; subtitle 11px muted-foreground; illustration 28px navy. */

.lw-kpi-card[b-z9xbb2ecro] {
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    padding: 0.875rem;
    background: var(--lw-white);
    border: 1px solid var(--lw-border);
    border-radius: var(--lw-radius-card);
    box-shadow: var(--lw-shadow-card);
    box-sizing: border-box;
}

@media (min-width: 768px) {
    .lw-kpi-card[b-z9xbb2ecro] {
        padding: 1.25rem;
    }
}

.lw-kpi-label[b-z9xbb2ecro] {
    margin: 0;
    font-size: 10px;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.1em;
    color: var(--lw-gray-graphite);
}

@media (min-width: 768px) {
    .lw-kpi-label[b-z9xbb2ecro] { font-size: 11px; }
}

.lw-kpi-value-row[b-z9xbb2ecro] {
    display: flex;
    align-items: flex-end;
    justify-content: space-between;
    gap: 0.5rem;
    margin-top: 0.25rem;
}

.lw-kpi-value[b-z9xbb2ecro] {
    margin: 0;
    flex-shrink: 0;
    font-size: 20px;
    font-weight: 700;
    line-height: 1;
    letter-spacing: var(--lw-tracking-tight);
    color: var(--lw-text-primary);
    font-family: var(--lw-font-family-heading);
}

@media (min-width: 768px) {
    .lw-kpi-value[b-z9xbb2ecro] { font-size: 32px; }
}

.lw-kpi-illustration[b-z9xbb2ecro] {
    display: none;
    flex-shrink: 0;
}

@media (min-width: 768px) {
    .lw-kpi-illustration[b-z9xbb2ecro] { display: block; }
}

/* Page-provided MudIcon glyphs: reference lucide size-7 (28px) text-primary. */
.lw-kpi-illustration[b-z9xbb2ecro]  .mud-icon-root {
    display: block;
    width: 28px;
    height: 28px;
    font-size: 28px;
    color: var(--lw-primary-dark);
}

/* Sub-dashboard treatment: size-9 (36px) navy at 40%. */
.lw-kpi-illustration--soft[b-z9xbb2ecro]  .mud-icon-root {
    width: 36px;
    height: 36px;
    font-size: 36px;
    color: color-mix(in srgb, var(--lw-primary-dark) 40%, transparent);
}

.lw-kpi-foot[b-z9xbb2ecro] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 0.5rem;
    margin-top: 0.5rem;
}

@media (min-width: 768px) {
    .lw-kpi-foot[b-z9xbb2ecro] { margin-top: 0.75rem; }
}

.lw-kpi-trend[b-z9xbb2ecro] {
    display: inline-flex;
    align-items: center;
    gap: 0.25rem;
    font-size: 11px;
    font-weight: 600;
}

@media (min-width: 768px) {
    .lw-kpi-trend[b-z9xbb2ecro] { font-size: 12px; }
}

.lw-kpi-trend--good[b-z9xbb2ecro] { color: var(--lw-success-dark); }
.lw-kpi-trend--bad[b-z9xbb2ecro]  { color: var(--lw-destructive); }

.lw-kpi-trend[b-z9xbb2ecro]  .lw-kpi-trend-icon {
    width: 12px;
    height: 12px;
    font-size: 12px;
}

.lw-kpi-subtitle[b-z9xbb2ecro] {
    display: none;
    font-size: 11px;
    color: var(--lw-gray-space);
}

@media (min-width: 768px) {
    .lw-kpi-subtitle[b-z9xbb2ecro] { display: inline; }
}

/* Helper for page-provided Foot content: the reference's Connect-style
   accent link (11/12px 600 brand-accent, hover 80%). */
.lw-kpi-foot[b-z9xbb2ecro]  .lw-kpi-connect {
    display: inline-flex;
    align-items: center;
    gap: 0.25rem;
    padding: 0;
    border: none;
    background: transparent;
    cursor: pointer;
    font-size: 11px;
    font-weight: 600;
    color: var(--lw-primary-blue);
    font-family: var(--lw-font-family);
    transition: color 0.15s;
}

@media (min-width: 768px) {
    .lw-kpi-foot[b-z9xbb2ecro]  .lw-kpi-connect { font-size: 12px; }
}

.lw-kpi-foot[b-z9xbb2ecro]  .lw-kpi-connect:hover {
    color: color-mix(in srgb, var(--lw-primary-blue) 80%, transparent);
}

/* Count caption for sub KPI feet -- reference countLabel: accent 11/500
   (12 on md) with a 12px leading document glyph. */
.lw-kpi-foot[b-z9xbb2ecro]  .lw-kpi-count {
    display: inline-flex;
    align-items: center;
    gap: 0.25rem;
    font-size: 11px;
    font-weight: 500;
    color: var(--lw-primary-blue);
}

@media (min-width: 768px) {
    .lw-kpi-foot[b-z9xbb2ecro]  .lw-kpi-count { font-size: 12px; }
}

.lw-kpi-foot[b-z9xbb2ecro]  .lw-kpi-count .mud-icon-root {
    width: 12px;
    height: 12px;
    font-size: 12px;
}

/* Muted caption used by disconnected states in page Foot content. */
.lw-kpi-foot[b-z9xbb2ecro]  .lw-kpi-foot-muted {
    display: inline-flex;
    align-items: center;
    gap: 0.375rem;
    font-size: 11px;
    color: var(--lw-gray-space);
}

@media (min-width: 768px) {
    .lw-kpi-foot[b-z9xbb2ecro]  .lw-kpi-foot-muted { font-size: 12px; }
}

.lw-kpi-foot[b-z9xbb2ecro]  .lw-kpi-foot-muted .mud-icon-root {
    width: 12px;
    height: 12px;
    font-size: 12px;
}
/* _content/Ledgerwise/Components/Shared/Atoms/LwListCard.razor.rz.scp.css */
/* Source: ledgerwise-ui project list card shell. Surface = white, hairline
   border, 8px radius, card shadow; rows divided by 1px hairlines (owned by
   LwListRow's top border), corner-clipped via overflow:hidden. */

.lw-list-card[b-w8aafjsbrn] {
    display: flex;
    flex-direction: column;
    overflow: hidden;
    background: var(--lw-white);
    border: 1px solid var(--lw-border);
    border-radius: var(--lw-radius-card);
    box-shadow: var(--lw-shadow-card);
}

/* Desktop-only column header (hidden < md): table-header surface, muted
   14px/500 labels, same horizontal rhythm as a row. */
.lw-list-header[b-w8aafjsbrn] {
    display: none;
}

@media (min-width: 768px) {
    .lw-list-header[b-w8aafjsbrn] {
        display: flex;
        align-items: center;
        gap: 16px;
        padding: 10px 16px;
        background: var(--lw-bg-table-header);
        font-size: 14px;
        font-weight: 500;
        color: var(--lw-gray-graphite);
    }
}
/* _content/Ledgerwise/Components/Shared/Atoms/LwListRow.razor.rz.scp.css */
/* Source: ledgerwise-ui project list row. Flex row, 16px gap, 12px/16px
   padding, hairline top divider, accent hover; entire row is the link. */

.lw-list-row[b-96f13kmo8d] {
    display: flex;
    align-items: center;
    gap: 16px;
    padding: 12px 16px;
    border-top: 1px solid var(--lw-border);
    text-decoration: none;
    color: inherit;
    transition: background-color 0.12s ease;
}

.lw-list-row:first-child[b-96f13kmo8d] {
    border-top: 0;
}

.lw-list-row:hover[b-96f13kmo8d] {
    background: var(--lw-accent);
}

/* Split variant (row with an Actions column): the padding moves to the inner
   link region so the sibling actions cell stays outside the anchor
   (reference: outer flex row, Link py-3 pl-4 flex-1, actions div px-2). */
.lw-list-row--split[b-96f13kmo8d] {
    padding: 0;
    /* Cancel the base row gap: the actions cell carries its own 8px pads, and
       any gap here shifts the trailing columns out from under the header. */
    gap: 0;
}

.lw-list-row-link[b-96f13kmo8d] {
    display: flex;
    align-items: center;
    gap: 16px;
    min-width: 0;
    flex: 1;
    padding: 12px 0 12px 16px;
    text-decoration: none;
    color: inherit;
}

.lw-list-row-actions[b-96f13kmo8d] {
    display: flex;
    align-items: center;
    flex-shrink: 0;
    padding: 0 8px;
}

/* Modal-driven rows (OnClick, no Href) still read as clickable. */
.lw-list-row--clickable[b-96f13kmo8d] {
    cursor: pointer;
}

/* New-row highlight: info-tinted, fades out. */
.lw-list-row--highlight[b-96f13kmo8d] {
    background: var(--lw-status-info-bg);
    transition: background-color 0.7s ease;
}

.lw-list-row-lead[b-96f13kmo8d] {
    display: flex;
    align-items: center;
    gap: 16px;
    min-width: 0;
    flex: 1;
}

/* Desktop stat columns -- hidden < md (reference drops numeric cols on mobile). */
.lw-list-row-trailing[b-96f13kmo8d] {
    display: none;
}

@media (min-width: 768px) {
    .lw-list-row-trailing[b-96f13kmo8d] {
        display: flex;
        align-items: center;
        gap: 24px;
        flex-shrink: 0;
    }
}

/* Mobile trailing (e.g. status badge) -- shown only < md. */
.lw-list-row-trailing-mobile[b-96f13kmo8d] {
    flex-shrink: 0;
}

@media (min-width: 768px) {
    .lw-list-row-trailing-mobile[b-96f13kmo8d] {
        display: none;
    }
}
/* _content/Ledgerwise/Components/Shared/Atoms/LwListStat.razor.rz.scp.css */
/* Source: ledgerwise-ui ProjectStat. Right-aligned column, tabular numerals. */

.lw-list-stat[b-qthyznipaf] {
    display: flex;
    flex-direction: column;
    align-items: flex-end;
    gap: 2px;
    font-variant-numeric: tabular-nums;
}

.lw-list-stat-value[b-qthyznipaf] {
    font-size: 14px;
    font-weight: var(--lw-font-semibold);
    color: var(--lw-text-primary);
    /* Text values (e.g. an owner name in the contractor list) truncate
       instead of overflowing the fixed column. */
    max-width: 100%;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.lw-list-stat--muted .lw-list-stat-value[b-qthyznipaf] {
    color: var(--lw-gray-space);
}

.lw-list-stat-label[b-qthyznipaf] {
    font-size: 11px;
    font-weight: 500;
    text-transform: uppercase;
    /* reference: tracking-wide = 0.025em (was 0.04em, too wide). */
    letter-spacing: 0.025em;
    color: var(--lw-gray-space);
}
/* _content/Ledgerwise/Components/Shared/Atoms/LwModalBody.razor.rz.scp.css */
/* Spec from ledgerwise-app src/components/ui/dialog.tsx DialogBody (2026-07-10):
   24px padding, transparent over the dialog's form-surface panel. The 16px
   column gap matches the filter modals' field stack (DialogBody callers pass
   flex flex-col gap-4 in the reference). Chrome previously lived globally in
   app.css as .lw-filter-modal .mud-dialog-content + .lw-filter-fields. */

.lw-modal-body[b-8zjm5ibpj2] {
    display: flex;
    flex-direction: column;
    gap: 16px;
    padding: 24px;
    background: transparent;
}
/* _content/Ledgerwise/Components/Shared/Atoms/LwModalFooter.razor.rz.scp.css */
/* Spec from ledgerwise-app src/components/ui/dialog.tsx DialogFooter (2026-07-10),
   as measured for the project filter modal: 16px/24px padding, top hairline,
   transparent over the form-surface panel; buttons normalized to the 40px
   action shape (h-10, control radius, 14px/500). Variant classes mirror the
   reference Button variants: ghost (Reset), outline (Cancel/DialogClose),
   primary (navy CTA). Chrome previously lived globally in app.css as
   .lw-filter-reset/.lw-filter-cancel/.lw-filter-apply. */

.lw-modal-footer[b-kz30z1z62x] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 8px;
    padding: 16px 24px;
    background: transparent;
    border-top: 1px solid var(--lw-border);
}

.lw-modal-footer-left[b-kz30z1z62x] {
    display: flex;
    align-items: center;
    gap: 8px;
}

.lw-modal-footer-actions[b-kz30z1z62x] {
    display: flex;
    align-items: center;
    gap: 8px;
    margin-left: auto;
}

/* Sizing contract: every button in the footer takes the 40px action shape. */
.lw-modal-footer[b-kz30z1z62x]  button {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 6px;
    height: 40px;
    border-radius: var(--lw-radius-control);
    cursor: pointer;
    font-family: var(--lw-font-family);
    font-size: 14px;
    font-weight: var(--lw-font-medium);
    transition: background 0.15s ease, color 0.15s ease;
}

/* Disabled state: reference Button contract disabled:opacity-50. */
.lw-modal-footer[b-kz30z1z62x]  button:disabled {
    opacity: 0.5;
    cursor: default;
    pointer-events: none;
}

/* Ghost: transparent text button (Reset). */
.lw-modal-footer[b-kz30z1z62x]  .lw-modal-ghost {
    padding: 0 12px;
    border: 0;
    background: transparent;
    color: var(--lw-gray-graphite);
}

.lw-modal-footer[b-kz30z1z62x]  .lw-modal-ghost:hover {
    background: var(--lw-accent);
    color: var(--lw-text-primary);
}

/* Outline: secondary action (Cancel). */
.lw-modal-footer[b-kz30z1z62x]  .lw-modal-outline {
    padding: 0 16px;
    border: 1px solid var(--lw-border);
    background: var(--lw-white);
    color: var(--lw-text-primary);
}

.lw-modal-footer[b-kz30z1z62x]  .lw-modal-outline:hover {
    background: var(--lw-accent);
}

/* Primary: navy filled CTA (Apply). */
.lw-modal-footer[b-kz30z1z62x]  .lw-modal-primary {
    padding: 0 16px;
    border: 0;
    background: var(--lw-primary-dark);
    color: var(--lw-white);
}

.lw-modal-footer[b-kz30z1z62x]  .lw-modal-primary:hover {
    background: var(--lw-primary-dark-hover);
}

/* Destructive confirm (reference: bg-destructive text-white, hover /90). */
.lw-modal-footer[b-kz30z1z62x]  .lw-modal-destructive {
    padding: 0 16px;
    border: 0;
    background: var(--lw-destructive);
    color: var(--lw-white);
}

.lw-modal-footer[b-kz30z1z62x]  .lw-modal-destructive:hover {
    background: color-mix(in srgb, var(--lw-destructive) 90%, var(--lw-white));
}
/* _content/Ledgerwise/Components/Shared/Atoms/LwModalHeader.razor.rz.scp.css */
/* Spec from ledgerwise-app src/components/ui/dialog.tsx DialogHeader (2026-07-10),
   as measured for the project filter modal: white bar over the form-surface
   panel, bottom hairline, 16px/24px padding; title 16px/700, subtitle 13px
   graphite; 28px icon close with accent hover. Chrome previously lived
   globally in app.css as .lw-filter-header/.lw-filter-title/etc. */

.lw-modal-header[b-7r6pfu8e9s] {
    display: flex;
    /* Reference DialogHeader is items-center (icon, title block, X). */
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    padding: 16px 24px;
    background: var(--lw-white);
    border-bottom: 1px solid var(--lw-border);
}

.lw-modal-header-text[b-7r6pfu8e9s] {
    min-width: 0;
    flex: 1;
}

/* Title + optional inline badge (full-page modal context pill beside the
   title, reference gc-allocation-wizard.tsx header). */
.lw-modal-title-row[b-7r6pfu8e9s] {
    display: flex;
    align-items: center;
    gap: 8px;
    min-width: 0;
}

.lw-modal-title[b-7r6pfu8e9s] {
    margin: 0;
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    font-family: var(--lw-font-family);
    font-size: 16px;
    line-height: 22px;
    font-weight: var(--lw-font-bold);
    color: var(--lw-text-primary);
}

.lw-modal-title-badge[b-7r6pfu8e9s] {
    flex-shrink: 0;
    display: inline-flex;
    align-items: center;
}

.lw-modal-subtitle[b-7r6pfu8e9s] {
    margin: 2px 0 0;
    font-family: var(--lw-font-family);
    font-size: 13px;
    line-height: 18px;
    color: var(--lw-gray-graphite);
}

.lw-modal-close[b-7r6pfu8e9s] {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 28px;
    height: 28px;
    flex-shrink: 0;
    border: 0;
    background: transparent;
    color: var(--lw-gray-space);
    cursor: pointer;
    border-radius: var(--lw-radius-control);
    transition: background 0.15s ease, color 0.15s ease;
}

.lw-modal-close:hover[b-7r6pfu8e9s] {
    background: var(--lw-accent);
    color: var(--lw-text-primary);
}

/* Leading icon slot (accept-proposal-modal.tsx icon titles): the caller's
   roundel/glyph markup keeps its own scoped chrome; this wrapper only
   aligns it with the title line. */
.lw-modal-header-icon[b-7r6pfu8e9s] {
    flex-shrink: 0;
    display: inline-flex;
    align-items: center;
}

/* Right-aligned action cluster before the close button (reference drawer
   headers: prev/next nav + counter + hairline divider). */
.lw-modal-header-actions[b-7r6pfu8e9s] {
    display: flex;
    align-items: center;
    gap: 4px;
    flex-shrink: 0;
}
/* _content/Ledgerwise/Components/Shared/Atoms/LwNumericField.razor.rz.scp.css */
/* LwNumericField -- source: ledgerwise-app ui/field-shell.tsx (same measured
   FieldShell spec as LwTextField.razor.css, 2026-07-25): 54px white box,
   radius 8, border --lw-input-border, 14/400 value, notched label with the
   muted -> graphite -> phantom state colors. MudNumericField renders the same
   mud-input-outlined structure as MudTextField, so the recipe carries over. */

.lw-numfield[b-55e9i9fybx] {
    width: 100%;
}

.lw-numfield[b-55e9i9fybx]  .mud-input-helper-text {
    font-family: var(--lw-font-family);
    font-size: 13px;
    line-height: 18px;
    margin-top: 4px;
}

.lw-numfield[b-55e9i9fybx]  .mud-input-control {
    margin-top: 0;
}

.lw-numfield[b-55e9i9fybx]  .mud-input-outlined {
    font-size: 14px;
    font-weight: 400;
    background-color: var(--lw-white);
    border-radius: var(--lw-radius-control);
}

.lw-numfield[b-55e9i9fybx]  .mud-input-outlined input.mud-input-slot {
    height: 54px;
    box-sizing: border-box;
    padding: 16px 14px;
    font-size: 14px;
    font-weight: 400;
    line-height: 22px;
}

.lw-numfield[b-55e9i9fybx]  .mud-input-label {
    font-size: 14px;
    font-weight: 400;
    line-height: 22px;
    letter-spacing: normal;
    color: var(--lw-gray-space);
}

.lw-numfield[b-55e9i9fybx]  .mud-input-label-outlined {
    top: 50%;
    transform: translate(13px, -50%) scale(1);
    padding: 0 2px !important;
    transition: top 0.2s cubic-bezier(0, 0, 0.2, 1), transform 0.2s cubic-bezier(0, 0, 0.2, 1), color 0.2s;
}

.lw-numfield[b-55e9i9fybx]  .mud-shrink ~ label.mud-input-label.mud-input-label-inputcontrol.mud-input-label-outlined,
.lw-numfield[b-55e9i9fybx]  .mud-input:focus-within ~ label.mud-input-label.mud-input-label-inputcontrol.mud-input-label-outlined {
    top: 0;
    transform: translate(13px, -6px) scale(0.857);
}

.lw-numfield[b-55e9i9fybx]  .mud-shrink ~ label.mud-input-label.mud-input-label-inputcontrol.mud-input-label-outlined {
    color: var(--lw-gray-graphite);
}

.lw-numfield[b-55e9i9fybx]  .mud-input:focus-within ~ label.mud-input-label.mud-input-label-inputcontrol.mud-input-label-outlined {
    color: var(--lw-gray-phantom);
}

/* FieldShell placeholder behavior -- hide the placeholder and re-seat the
   label while empty and unfocused (see LwTextField.razor.css). */
.lw-numfield[b-55e9i9fybx]  .mud-input.mud-input-outlined:not(:focus-within) input.mud-input-slot::placeholder {
    color: transparent;
}

.lw-numfield[b-55e9i9fybx]  .mud-input.mud-input-outlined.mud-shrink:not(:focus-within):has(input.mud-input-slot:placeholder-shown) ~ label.mud-input-label.mud-input-label-inputcontrol.mud-input-label-outlined {
    top: 50%;
    transform: translate(13px, -50%) scale(1);
    color: var(--lw-gray-space);
}

.lw-numfield[b-55e9i9fybx]  .mud-input.mud-input-outlined.mud-shrink:not(:focus-within):has(input.mud-input-slot:placeholder-shown) .mud-input-outlined-border legend {
    max-width: 0;
    padding: 0;
}

/* Border states -- rest = --lw-input-border 1px; hover = no change;
   focus = 1px foreground (mirror Mud's own selectors). */
.lw-numfield[b-55e9i9fybx]  .mud-input.mud-input-outlined:not(.mud-disabled):not(:focus-within):hover .mud-input-outlined-border {
    border-color: var(--lw-input-border);
}

.lw-numfield[b-55e9i9fybx]  .mud-input.mud-input-outlined:focus-within > .mud-input-outlined-border,
.lw-numfield[b-55e9i9fybx]  .mud-input.mud-input-outlined:focus-within .mud-shrink > .mud-input-outlined-border {
    border-width: 1px;
    border-color: var(--lw-gray-phantom);
}

.lw-numfield[b-55e9i9fybx]  .mud-input-adornment-start .mud-input-adornment-text {
    font-size: 14px;
    color: var(--lw-gray-graphite);
}
/* _content/Ledgerwise/Components/Shared/Atoms/LwPager.razor.rz.scp.css */
/* Source: ledgerwise-app critical-tasks-panel.tsx pagination (measured
   2026-07-28). DELIBERATE DEVIATION (Cody, 2026-07-28): the reference
   renders three disjoint pieces (rounded shadowed buttons around a
   square muted indicator), which reads as misaligned; here the pager is
   one connected segment -- single hairline border, rounded outer
   corners, internal hairline dividers, one card shadow. Cell sizes and
   type (36px cells, 16px chevrons, 11px/500 tabular indicator on the
   muted fill) keep the reference's proportions. */

.lw-pager[b-myhworx6ky] {
    display: inline-flex;
    align-items: center;
    border: 1px solid var(--lw-border);
    border-radius: var(--lw-radius-card);
    background: var(--lw-white);
    box-shadow: var(--lw-shadow-card);
    overflow: hidden;
}

.lw-pager-btn[b-myhworx6ky] {
    width: 36px;
    height: 36px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 0;
    background: var(--lw-white);
    border: none;
    color: var(--lw-gray-graphite);
    cursor: pointer;
    transition: background-color 0.15s ease, color 0.15s ease;
}

.lw-pager-btn:hover:not(:disabled)[b-myhworx6ky] {
    background: var(--lw-accent);
    color: var(--lw-text-primary);
}

.lw-pager-btn:disabled[b-myhworx6ky] {
    pointer-events: none;
    opacity: 0.3;
}

.lw-pager-indicator[b-myhworx6ky] {
    height: 36px;
    min-width: 36px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 0 0.5rem;
    border-left: 1px solid var(--lw-border);
    border-right: 1px solid var(--lw-border);
    background: var(--lw-bg-muted);
    font-size: 11px;
    font-weight: 500;
    font-variant-numeric: tabular-nums;
    color: var(--lw-text-primary);
    box-sizing: border-box;
}

.lw-pager-btn[b-myhworx6ky]  .lw-pager-icon {
    width: 16px;
    height: 16px;
    font-size: 16px;
}
/* _content/Ledgerwise/Components/Shared/Atoms/LwPanel.razor.rz.scp.css */
/* Source: ledgerwise-app dashboard panel shells (critical-tasks-panel /
   invoice-inbox-panel / active-projects-table), measured 2026-07-28:
   white surface, hairline border, 8px radius, card shadow, clipped
   corners; header 16px 20px, title 14px/600 foreground. */

.lw-panel[b-tflzux7hnu] {
    display: flex;
    flex-direction: column;
    height: 100%;
    overflow: hidden;
    background: var(--lw-white);
    border: 1px solid var(--lw-border);
    border-radius: var(--lw-radius-card);
    box-shadow: var(--lw-shadow-card);
    box-sizing: border-box;
}

.lw-panel-head[b-tflzux7hnu] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    flex-shrink: 0;
    padding: 1rem 1.25rem;
}

.lw-panel-head--divided[b-tflzux7hnu] {
    border-bottom: 1px solid var(--lw-border);
}

.lw-panel-title[b-tflzux7hnu] {
    margin: 0;
    font-size: 0.875rem;
    font-weight: 600;
    color: var(--lw-text-primary);
    font-family: var(--lw-font-family);
}

.lw-panel-action[b-tflzux7hnu] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
}

/* Page-provided title toggle (collapse chevron + label), mirroring the
   reference's header button: flex gap-2 text-sm font-semibold foreground,
   chevron 16px content-secondary rotating -90deg when collapsed. */
.lw-panel-head[b-tflzux7hnu]  .lw-panel-title-btn {
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0;
    border: none;
    background: transparent;
    cursor: pointer;
    font-size: 0.875rem;
    font-weight: 600;
    color: var(--lw-text-primary);
    font-family: var(--lw-font-family);
}

.lw-panel-head[b-tflzux7hnu]  .lw-panel-title-btn .mud-icon-root {
    width: 16px;
    height: 16px;
    font-size: 16px;
    color: var(--lw-gray-graphite);
    transition: transform 0.2s;
}
/* _content/Ledgerwise/Components/Shared/Atoms/LwSecureChip.razor.rz.scp.css */
/* LwSecureChip -- source: vendor-intro-card.tsx secureLabel chip.
   Spec 2026-07-13: border --lw-border, white, radius 4, pad 4/8, gap 6,
   11/500 graphite label, 12px brand-accent lock. Hidden below 640px. */

.lw-secure-chip[b-aqvv9bcdkl] {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 4px 8px;
    border: 1px solid var(--lw-border);
    border-radius: 4px;
    background: var(--lw-white);
    font-family: var(--lw-font-family);
    font-size: 11px;
    font-weight: 500;
    color: var(--lw-gray-graphite);
    white-space: nowrap;
}

.lw-secure-chip svg[b-aqvv9bcdkl] {
    width: 12px;
    height: 12px;
    flex-shrink: 0;
    color: var(--lw-primary-blue);
}

@media (max-width: 640px) {
    .lw-secure-chip[b-aqvv9bcdkl] {
        display: none;
    }
}
/* _content/Ledgerwise/Components/Shared/Atoms/LwSelect.razor.rz.scp.css */
/* Measured spec from ledgerwise-app FieldShell + select trigger (2026-07-10):
   box 54px, white, radius 8px, border rgba(145,158,171,.4);
   value 14px/400, vertically centered; label 14px/400 graphite in the notch;
   trailing clear (x) + caret. Mirrors LwTextField.razor.css -- same FieldShell
   chrome, adapted for MudSelect (the value is a <div> slot, not an <input>, so
   it centers via padding+line-height rather than input line-height).
   Font: Inter. */

.lw-select[b-yjjhj4boyc] {
    width: 100%;
}

.lw-select[b-yjjhj4boyc]  .mud-input-control {
    margin-top: 0;
}

.lw-select[b-yjjhj4boyc]  .mud-input-outlined {
    font-size: 14px;
    font-weight: 400;
    background-color: var(--lw-white);
    border-radius: var(--lw-radius-control);
}

/* Value slot: MudSelect renders the selected value in a <div class="mud-input-slot">
   (not an <input>). Match FieldShell's 54px box and center the value the same way
   LwTextField does -- 16 + 22 + 16 = 54 -- so it clears the notched label instead
   of top-aligning into it. box-sizing:border-box keeps padding from inflating it. */
.lw-select[b-yjjhj4boyc]  .mud-input-outlined .mud-input-slot {
    height: 54px;
    box-sizing: border-box;
    padding: 16px 14px;
    font-size: 14px;
    font-weight: 400;
    line-height: 22px;
    /* Inputs always sit on a white fill, even over a tinted (form-surface) body. */
    background-color: var(--lw-white);
    border-radius: var(--lw-radius-control);
}

/* Label: MudBlazor pins its own font-family -- override directly. Resting label
   sits left 13px, vertically centered in the 54px box; color states mirror
   FieldShell (resting muted-fg, floated content-secondary, focused foreground). */
.lw-select[b-yjjhj4boyc]  .mud-input-label {
    font-size: 14px;
    font-weight: 400;
    line-height: 22px;
    letter-spacing: normal;
    color: var(--lw-gray-space);
}

.lw-select[b-yjjhj4boyc]  .mud-input-label-outlined {
    transform: translate(13px, 16px) scale(1);
    padding: 0 2px !important;
}

/* Floated label: mirror Mud's own shrink/focus selectors (4-class specificity),
   12px like FieldShell's text-xs (scale 12/14 = .857). */
.lw-select[b-yjjhj4boyc]  .mud-shrink ~ label.mud-input-label.mud-input-label-inputcontrol.mud-input-label-outlined,
.lw-select[b-yjjhj4boyc]  .mud-input:focus-within ~ label.mud-input-label.mud-input-label-inputcontrol.mud-input-label-outlined {
    transform: translate(13px, -6px) scale(0.857);
}

.lw-select[b-yjjhj4boyc]  .mud-shrink ~ label.mud-input-label.mud-input-label-inputcontrol.mud-input-label-outlined {
    color: var(--lw-gray-graphite);
}

.lw-select[b-yjjhj4boyc]  .mud-input:focus-within ~ label.mud-input-label.mud-input-label-inputcontrol.mud-input-label-outlined {
    color: var(--lw-gray-phantom);
}

/* Border states -- FieldShell: rest = --lw-input-border 1px; hover = no change;
   focus = 1px foreground (mirror Mud's own selectors to beat its darken/2px-blue
   defaults). */
.lw-select[b-yjjhj4boyc]  .mud-input.mud-input-outlined:not(.mud-disabled):not(:focus-within):hover .mud-input-outlined-border {
    border-color: var(--lw-input-border);
}

.lw-select[b-yjjhj4boyc]  .mud-input.mud-input-outlined:focus-within > .mud-input-outlined-border,
.lw-select[b-yjjhj4boyc]  .mud-input.mud-input-outlined:focus-within .mud-shrink > .mud-input-outlined-border {
    border-width: 1px;
    border-color: var(--lw-gray-phantom);
}

/* Trailing clear (x) + caret: gray-space icons, aligned to the right edge. */
.lw-select[b-yjjhj4boyc]  .mud-input-adornment .mud-icon-button,
.lw-select[b-yjjhj4boyc]  .mud-select-input .mud-icon-button {
    color: var(--lw-gray-space);
}
/* _content/Ledgerwise/Components/Shared/Atoms/LwSkeleton.razor.rz.scp.css */
/* Source: ledgerwise-app atoms/skeleton-block.tsx + globals.css @keyframes
   shimmer (measured from compiled Tailwind output 2026-07-10):
   background-image: linear-gradient(to right in oklab,
     color-mix(in oklab, var(--border) 60%, transparent),
     color-mix(in oklab, var(--border) 30%, transparent),
     color-mix(in oklab, var(--border) 60%, transparent));
   background-size: 200% 100%; animation: shimmer 1.5s ease-in-out infinite;
   keyframes: background-position 200% 0 -> -200% 0. No border-radius on the
   atom itself -- reference callers add rounding per use. --border in the
   reference (#919eab33) resolves to the same value as --lw-border, so the
   alphas are encoded as color-mix relationships, not resolved hex. */

/* No flex-shrink here: reference applies shrink-0 per caller (avatar, badge)
   while text lines stay shrinkable inside min-width:0 columns. */
.lw-skeleton[b-rt46lsgiqd] {
    background-image: linear-gradient(
        to right in oklab,
        color-mix(in oklab, var(--lw-border) 60%, transparent),
        color-mix(in oklab, var(--lw-border) 30%, transparent),
        color-mix(in oklab, var(--lw-border) 60%, transparent)
    );
    background-size: 200% 100%;
    animation: lw-shimmer-b-rt46lsgiqd 1.5s ease-in-out infinite;
}

@keyframes lw-shimmer-b-rt46lsgiqd {
    0% { background-position: 200% 0; }
    100% { background-position: -200% 0; }
}
/* _content/Ledgerwise/Components/Shared/Atoms/LwSnackbar.razor.rz.scp.css */
/* Chrome moved to wwwroot/css/components/lw-snackbar.css (global) when
   AlertComponent became the second consumer of the canonical toast --
   scoped ::deep rules cannot be shared across components. */
/* _content/Ledgerwise/Components/Shared/Atoms/LwSplitButton.razor.rz.scp.css */
/* Source: ledgerwise-app organisms/project-header.tsx action cluster
   (2026-07-10). Main: h-8 gap-2 rounded-l-md border px-3 text-[13px]
   font-medium text-foreground hover:bg-accent active:bg-border.
   Chevron: -ml-px h-8 w-8 rounded-r-md border text-content-secondary
   hover:bg-accent hover:text-foreground active:bg-border focus-visible ring.
   rounded-md resolves to --radius-control (8px); icons size-3.5 (14px). */

.lw-split-button[b-zfngkkuomt] {
    display: inline-flex;
    align-items: center;
}

.lw-split-button-main[b-zfngkkuomt],
.lw-split-button-chevron[b-zfngkkuomt] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    box-sizing: border-box;
    height: 32px;
    border: 1px solid var(--lw-border);
    background: transparent;
    font-family: var(--lw-font-family);
    cursor: pointer;
    transition: background-color 0.12s ease, color 0.12s ease;
    white-space: nowrap;
}

.lw-split-button-main[b-zfngkkuomt] {
    gap: 8px;
    padding: 0 12px;
    border-radius: var(--lw-radius-control) 0 0 var(--lw-radius-control);
    font-size: 13px;
    font-weight: 500;
    line-height: 1;
    letter-spacing: normal;
    color: var(--lw-text-primary);
}

.lw-split-button-chevron[b-zfngkkuomt] {
    width: 32px;
    padding: 0;
    border-radius: 0 var(--lw-radius-control) var(--lw-radius-control) 0;
    color: var(--lw-gray-graphite);
}

.lw-split-button-main:hover:not(:disabled)[b-zfngkkuomt],
.lw-split-button-chevron:hover:not(:disabled)[b-zfngkkuomt] {
    background: var(--lw-accent);
}

.lw-split-button-chevron:hover:not(:disabled)[b-zfngkkuomt] {
    color: var(--lw-text-primary);
}

.lw-split-button-main:active:not(:disabled)[b-zfngkkuomt],
.lw-split-button-chevron:active:not(:disabled)[b-zfngkkuomt] {
    background: var(--lw-border);
}

.lw-split-button-chevron:focus-visible[b-zfngkkuomt] {
    position: relative;
    z-index: 1;
    outline: none;
    box-shadow: 0 0 0 2px var(--lw-primary-blue);
}

.lw-split-button-main:disabled[b-zfngkkuomt],
.lw-split-button-chevron:disabled[b-zfngkkuomt] {
    opacity: 0.5;
    cursor: default;
}

/* MudMenu wraps the chevron activator in its own element; keep it in the
   flex row and apply the -1px border overlap here (the segment boundary
   shares one hairline). */
.lw-split-button[b-zfngkkuomt]  .mud-menu {
    display: inline-flex;
    margin-left: -1px;
}

/* Icons = reference size-3.5 (14px); out-specific Mud's size classes. */
.lw-split-button[b-zfngkkuomt]  .lw-split-button-icon.mud-icon-root {
    font-size: 14px;
    width: 14px;
    height: 14px;
}
/* _content/Ledgerwise/Components/Shared/Atoms/LwStackedBar.razor.rz.scp.css */
/* Source: project-account-display reference mock (us-473-account-display-mock.png /
   mocks/audience-owners.svg), "BUDGET COMMITTED" block, measured 2026-07-29 at the
   mock's native 996px width: track 12px tall (up from the mock's 8px, Cody
   2026-07-29), fully rounded, remainder
   --lw-gray-smoke; spent segment --lw-primary-dark, pending --lw-primary-blue;
   legend row gap 32px, dot 7px round, label 11px/600 uppercase +0.08em
   content-secondary, value 15px/700 -0.01em navy, 4px above the value. */

.lw-stacked-bar[b-mvs2pmf77v] {
    display: flex;
    flex-direction: column;
    /* The legend is a separate reading unit from the track, not a caption on it --
       18px lets the eye finish the bar before it starts the figures. */
    gap: 1.125rem;
}

/* -- Track -- */

.lw-stacked-bar__track[b-mvs2pmf77v] {
    display: flex;
    align-items: stretch;
    width: 100%;
    height: 12px;
    border-radius: 999px;
    background: var(--lw-gray-smoke);
    overflow: hidden;
}

.lw-stacked-bar__seg[b-mvs2pmf77v] {
    height: 100%;
    min-width: 0;
    transition: width 180ms ease;
}

.lw-stacked-bar__seg--filled[b-mvs2pmf77v] {
    background: var(--lw-primary-dark);
}

.lw-stacked-bar__seg--inflight[b-mvs2pmf77v] {
    background: var(--lw-primary-blue);
}

/* -- Legend -- */

.lw-stacked-bar__legend[b-mvs2pmf77v] {
    display: flex;
    flex-wrap: wrap;
    gap: 0.5rem 2rem;
}

.lw-stacked-bar__legend-item[b-mvs2pmf77v] {
    display: flex;
    flex-direction: column;
    gap: 0.25rem;
    min-width: 0;
}

.lw-stacked-bar__legend-head[b-mvs2pmf77v] {
    display: inline-flex;
    align-items: center;
    gap: 0.375rem;
}

.lw-stacked-bar__legend-dot[b-mvs2pmf77v] {
    flex: 0 0 auto;
    width: 7px;
    height: 7px;
    border-radius: 50%;
}

.lw-stacked-bar__legend-dot--filled[b-mvs2pmf77v] {
    background: var(--lw-primary-dark);
}

.lw-stacked-bar__legend-dot--inflight[b-mvs2pmf77v] {
    background: var(--lw-primary-blue);
}

.lw-stacked-bar__legend-dot--track[b-mvs2pmf77v] {
    background: var(--lw-gray-smoke);
}

.lw-stacked-bar__legend-label[b-mvs2pmf77v] {
    font-family: var(--lw-font-family);
    font-size: 0.6875rem;
    font-weight: 600;
    line-height: 1.2;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    color: var(--lw-gray-graphite);
    white-space: nowrap;
}

.lw-stacked-bar__legend-value[b-mvs2pmf77v] {
    font-family: var(--lw-font-family);
    font-size: 0.9375rem;
    font-weight: 700;
    line-height: 1.2;
    letter-spacing: -0.01em;
    color: var(--lw-primary-dark);
    white-space: nowrap;
}

@media (max-width: 599px) {
    .lw-stacked-bar__legend[b-mvs2pmf77v] {
        gap: 0.5rem 1.25rem;
    }

    .lw-stacked-bar__legend-value[b-mvs2pmf77v] {
        font-size: 0.875rem;
    }
}

/* -- Full-width legend: equal columns divided by hairlines --
   Each figure gets an equal measured cell so the row reads as a table of
   totals. Dividers sit between cells only (never a leading or trailing rule),
   which is what makes the division read as structure rather than decoration. */

.lw-stacked-bar__legend--split[b-mvs2pmf77v] {
    display: grid;
    grid-template-columns: repeat(var(--lw-stacked-bar-cols, 3), 1fr);
    gap: 0;
    width: 100%;
}

.lw-stacked-bar__legend--split .lw-stacked-bar__legend-item[b-mvs2pmf77v] {
    align-items: center;
    text-align: center;
    padding: 0 1rem;
    border-left: 1px solid var(--lw-border);
}

.lw-stacked-bar__legend--split .lw-stacked-bar__legend-item:first-child[b-mvs2pmf77v] {
    padding-left: 0;
    border-left: none;
}

.lw-stacked-bar__legend--split .lw-stacked-bar__legend-item:last-child[b-mvs2pmf77v] {
    padding-right: 0;
}

@media (max-width: 599px) {
    /* Three narrow columns cannot hold currency at this width -- stack to two
       and let the dividers fall away rather than truncating figures. */
    .lw-stacked-bar__legend--split[b-mvs2pmf77v] {
        grid-template-columns: 1fr 1fr;
        gap: 0.75rem 0;
    }

    .lw-stacked-bar__legend--split .lw-stacked-bar__legend-item:nth-child(odd)[b-mvs2pmf77v] {
        padding-left: 0;
        border-left: none;
    }
}

/* -- Per-segment tooltips (ShowSegmentTooltips) --
   Ported from the Project Owner budget tab's utilization bar, which had them
   before this atom existed. Same navy popover idiom as the account-balance
   breakdown: swatch + label + figure, then the share on its own line. */

.lw-stacked-bar__seg--interactive[b-mvs2pmf77v] {
    position: relative;
    cursor: default;
    outline: none;
}

.lw-stacked-bar__seg-tip[b-mvs2pmf77v] {
    position: absolute;
    z-index: 60;
    bottom: calc(100% + 8px);
    left: 50%;
    transform: translate(-50%, 4px);
    display: flex;
    flex-direction: column;
    gap: 0.125rem;
    width: max-content;
    max-width: 14rem;
    padding: 0.5rem 0.625rem;
    background: var(--lw-primary-dark);
    color: var(--lw-white);
    border-radius: var(--lw-radius-control);
    text-align: left;
    visibility: hidden;
    opacity: 0;
    pointer-events: none;
    transition: opacity 0.15s ease, transform 0.15s ease, visibility 0.15s ease;
    box-shadow: 0 8px 24px color-mix(in srgb, var(--lw-primary-dark) 22%, transparent);
}

.lw-stacked-bar__seg--interactive:hover .lw-stacked-bar__seg-tip[b-mvs2pmf77v],
.lw-stacked-bar__seg--interactive:focus-visible .lw-stacked-bar__seg-tip[b-mvs2pmf77v] {
    visibility: visible;
    opacity: 1;
    transform: translate(-50%, 0);
}

.lw-stacked-bar__seg-tip-row[b-mvs2pmf77v] {
    display: inline-flex;
    align-items: center;
    gap: 0.375rem;
    font-size: 0.75rem;
    white-space: nowrap;
}

.lw-stacked-bar__seg-tip-swatch[b-mvs2pmf77v] {
    width: 8px;
    height: 8px;
    border-radius: 2px;
    flex: 0 0 auto;
}

.lw-stacked-bar__seg-tip-swatch--filled[b-mvs2pmf77v] {
    background: var(--lw-white);
}

.lw-stacked-bar__seg-tip-swatch--inflight[b-mvs2pmf77v] {
    background: var(--lw-primary-blue);
}

.lw-stacked-bar__seg-tip-swatch--track[b-mvs2pmf77v] {
    background: var(--lw-gray-smoke);
}

.lw-stacked-bar__seg-tip-label[b-mvs2pmf77v] {
    color: color-mix(in srgb, var(--lw-white) 75%, transparent);
}

.lw-stacked-bar__seg-tip-value[b-mvs2pmf77v] {
    font-weight: 600;
    font-variant-numeric: tabular-nums;
}

.lw-stacked-bar__seg-tip-pct[b-mvs2pmf77v] {
    font-size: 0.6875rem;
    color: color-mix(in srgb, var(--lw-white) 60%, transparent);
    white-space: nowrap;
}
/* _content/Ledgerwise/Components/Shared/Atoms/LwTextField.razor.rz.scp.css */
/* Measured spec from ledgerwise-app FieldShell (2026-07-08):
   box 54px, white, radius 8px, border rgba(145,158,171,.4);
   text 14px/400; label 14px/400 graphite.
   Font: Inter — ledgerwise-app moved off Plus Jakarta Sans; app-wide token
   update pending (see internal-docs/ui-redesign-phased-plan.md). */

.lw-textfield[b-t9kgj4tv9e] {
    width: 100%;
}

/* Built-in field validation message (Mud renders it from For + EditContext) —
   this IS the inline validation; do not add a separate <ValidationMessage>
   next to LwTextField (it duplicates this). Styled to text-sm destructive. */
.lw-textfield[b-t9kgj4tv9e]  .mud-input-helper-text {
    font-family: var(--lw-font-family);
    font-size: 13px;
    line-height: 18px;
    margin-top: 4px;
}

.lw-textfield[b-t9kgj4tv9e]  .mud-input-control {
    margin-top: 0;
}

.lw-textfield[b-t9kgj4tv9e]  .mud-input-outlined {
    font-size: 14px;
    font-weight: 400;
    background-color: var(--lw-white);
    border-radius: 8px;
}

.lw-textfield[b-t9kgj4tv9e]  .mud-input-outlined input.mud-input-slot {
    height: 54px;
    box-sizing: border-box;
    padding: 16px 14px;
    font-size: 14px;
    font-weight: 400;
    /* 16 + 22 + 16 = 54 — centers the text block exactly like FieldShell. */
    line-height: 22px;
}

/* MudBlazor pins its own font-family on labels — must override directly.
   Measured FieldShell resting label: FOREGROUND-dark #1e1e24 (not muted),
   14px/22px, 2px side padding, vertically centered in the 54px box. */
/* Label color states (FieldShell span): resting muted-foreground #9DA2B3,
   floated content-secondary #6E7180, focused foreground #1E1E24. */
.lw-textfield[b-t9kgj4tv9e]  .mud-input-label {
    font-size: 14px;
    font-weight: 400;
    line-height: 22px;
    /* Mud adds Material's +0.00938em; FieldShell label is normal. */
    letter-spacing: normal;
    color: var(--lw-gray-space);
}

/* Resting label: FieldShell puts it at left 13px, geometrically centered in
   the box (top 50% / -50% -- exact regardless of box height, unlike a fixed
   y offset). Mud's padding is !important, so ours must be too. `top` is
   transitioned alongside transform so the float animation stays smooth. */
.lw-textfield[b-t9kgj4tv9e]  .mud-input-label-outlined {
    top: 50%;
    transform: translate(13px, -50%) scale(1);
    padding: 0 2px !important;
    transition: top 0.2s cubic-bezier(0, 0, 0.2, 1), transform 0.2s cubic-bezier(0, 0, 0.2, 1), color 0.2s;
}

/* Multiline shell: the label centers against the first line, not the box. */
.lw-textfield--area[b-t9kgj4tv9e]  .mud-input-label-outlined {
    top: 23px;
}

/* Floated label: mirror Mud's own shrink/focus selectors (they carry 4-class
   specificity) — 12px like FieldShell's text-xs (scale 12/14 = .857). */
.lw-textfield[b-t9kgj4tv9e]  .mud-shrink ~ label.mud-input-label.mud-input-label-inputcontrol.mud-input-label-outlined,
.lw-textfield[b-t9kgj4tv9e]  .mud-input:focus-within ~ label.mud-input-label.mud-input-label-inputcontrol.mud-input-label-outlined {
    top: 0;
    transform: translate(13px, -6px) scale(0.857);
}

.lw-textfield[b-t9kgj4tv9e]  .mud-shrink ~ label.mud-input-label.mud-input-label-inputcontrol.mud-input-label-outlined {
    color: var(--lw-gray-graphite);
}

/* Focused wins over floated (declared last at equal specificity). */
.lw-textfield[b-t9kgj4tv9e]  .mud-input:focus-within ~ label.mud-input-label.mud-input-label-inputcontrol.mud-input-label-outlined {
    color: var(--lw-gray-phantom);
}

/* FieldShell placeholder behavior: when a Placeholder is set, Mud pre-floats
   the label to clear it. FieldShell instead keeps the label resting until
   focus/fill and reveals the placeholder only while focused -- so hide the
   placeholder and re-seat the label whenever the box is empty and unfocused. */
.lw-textfield[b-t9kgj4tv9e]  .mud-input.mud-input-outlined:not(:focus-within) input.mud-input-slot::placeholder {
    color: transparent;
}

.lw-textfield[b-t9kgj4tv9e]  .mud-input.mud-input-outlined.mud-shrink:not(:focus-within):has(input.mud-input-slot:placeholder-shown) ~ label.mud-input-label.mud-input-label-inputcontrol.mud-input-label-outlined {
    top: 50%;
    transform: translate(13px, -50%) scale(1);
    color: var(--lw-gray-space);
}

/* ...and close the fieldset-legend border notch while the label is re-seated. */
.lw-textfield[b-t9kgj4tv9e]  .mud-input.mud-input-outlined.mud-shrink:not(:focus-within):has(input.mud-input-slot:placeholder-shown) .mud-input-outlined-border legend {
    max-width: 0;
    padding: 0;
}

/* EXCEPT when a start adornment holds that spot: a resting label would land on
   top of the "$" (caught on the add-to-budget allocation fields, 2026-07-28).
   The reference keeps amount labels floated with the unit inside the box, so
   re-float the label and reopen the notch whenever StartText is present. */
.lw-textfield[b-t9kgj4tv9e]  .mud-input.mud-input-outlined.mud-shrink:not(:focus-within):has(.mud-input-adornment-start):has(input.mud-input-slot:placeholder-shown) ~ label.mud-input-label.mud-input-label-inputcontrol.mud-input-label-outlined {
    top: 0;
    transform: translate(13px, -6px) scale(0.857);
    color: var(--lw-gray-graphite);
}

.lw-textfield[b-t9kgj4tv9e]  .mud-input.mud-input-outlined.mud-shrink:not(:focus-within):has(.mud-input-adornment-start):has(input.mud-input-slot:placeholder-shown) .mud-input-outlined-border legend {
    max-width: 100%;
    padding: 0 5px;
}

/* Border states — FieldShell: rest = --lw-input-border rgba(145,158,171,.4)
   1px; hover = NO change; active/focus = 1px foreground #1e1e24. Mud's
   defaults (hover darken, focus 2px primary-blue) are overridden below by
   mirroring its own selectors. */
.lw-textfield[b-t9kgj4tv9e]  .mud-input.mud-input-outlined:not(.mud-disabled):not(:focus-within):hover .mud-input-outlined-border {
    border-color: var(--lw-input-border);
}

.lw-textfield[b-t9kgj4tv9e]  .mud-input.mud-input-outlined:focus-within > .mud-input-outlined-border,
.lw-textfield[b-t9kgj4tv9e]  .mud-input.mud-input-outlined:focus-within .mud-shrink > .mud-input-outlined-border {
    border-width: 1px;
    border-color: var(--lw-gray-phantom);
}

/* Eye adornment: 40px hit target, gray-space icon, right edge 15px from the
   box edge like FieldShell's size-10 button. */
.lw-textfield[b-t9kgj4tv9e]  .mud-input-adornment .mud-icon-button {
    width: 40px;
    height: 40px;
    margin-right: 1px;
    color: var(--lw-gray-space);
}

/* Multiline shell (textarea-field.tsx): auto-height box, min 96px,
   top-aligned content, py-3. Mud reserves margin-top 18.5px on outlined
   textareas for an inset label; our label floats on the border like the
   reference, so the reserve just sinks the text block -- zero it. */
.lw-textfield--area[b-t9kgj4tv9e]  .mud-input.mud-input-outlined textarea.mud-input-slot {
    box-sizing: border-box;
    min-height: 96px;
    margin-top: 0;
    padding: 12px 14px;
    font-size: 14px;
    font-weight: 400;
    line-height: 1.625;
}

/* Start/end-adornment text (field-shell.tsx startIcon / trailing unit,
   e.g. "$" on amount fields, a fixed email domain): 14px muted, snug to
   the input text like the reference. */
.lw-textfield[b-t9kgj4tv9e]  .mud-input-adornment-start .mud-input-adornment-text,
.lw-textfield[b-t9kgj4tv9e]  .mud-input-adornment-end .mud-input-adornment-text {
    font-size: 14px;
    color: var(--lw-gray-graphite);
}
/* _content/Ledgerwise/Components/Shared/Atoms/LwToggle.razor.rz.scp.css */
/* ============================================================
   LwToggle -- source: ledgerwise-ui-app
   src/components/atoms/toggle-switch.tsx (2026-07-28).
   Spec: track h-6 w-11 (24x44) rounded-full; on = sidebar-bg
   navy, off = grey-steel/60; thumb size-5 (20px) white circle
   w/ shadow-sm, translate-x 22px on / 2px off; disabled =
   opacity-50 + not-allowed.
   ============================================================ */

.lw-toggle[b-s96ucl2441] {
    position: relative;
    display: inline-flex;
    align-items: center;
    /* Global button rules center flex content; the thumb's translateX
       offsets are measured from the track's LEFT edge, so re-assert it. */
    justify-content: flex-start;
    width: 44px;
    height: 24px;
    flex-shrink: 0;
    border: none;
    border-radius: 9999px;
    padding: 0;
    cursor: pointer;
    background-color: color-mix(in srgb, var(--lw-gray-steel) 60%, transparent);
    transition: background-color 0.15s ease;
}

.lw-toggle--on[b-s96ucl2441] {
    background-color: var(--lw-primary-dark);
}

.lw-toggle:disabled[b-s96ucl2441] {
    cursor: not-allowed;
    opacity: 0.5;
}

/* Thumb: 20px white circle; shadow-sm = 0 1px 2px rgba(0,0,0,.05). */
.lw-toggle__thumb[b-s96ucl2441] {
    display: inline-block;
    width: 20px;
    height: 20px;
    border-radius: 9999px;
    background-color: var(--lw-white);
    box-shadow: 0 1px 2px 0 rgba(0, 0, 0, 0.05);
    transform: translateX(2px);
    transition: transform 0.15s ease;
}

.lw-toggle--on .lw-toggle__thumb[b-s96ucl2441] {
    transform: translateX(22px);
}
/* _content/Ledgerwise/Components/Shared/Atoms/LwTrustBadge.razor.rz.scp.css */
/* Source: ledgerwise-app atoms/trust-health-badge.tsx (2026-07-10).
   ui/badge.tsx md base: h-6 rounded-sm (--radius-control) leading-none;
   overrides: gap-1.5 (6px), px-2 (8px), text-xs (12px), font-semibold (600),
   normal-case, tracking-normal, tabular-nums; icon size-3.5 (14px);
   asButton hover = opacity .9. Tones reuse the shared status tokens. */

.lw-trust-badge[b-ttwx968zbk] {
    display: inline-flex;
    flex-shrink: 0;
    align-items: center;
    gap: 6px;
    height: 24px;
    padding: 0 8px;
    border: 0;
    border-radius: var(--lw-radius-control);
    font-family: var(--lw-font-family);
    font-size: 12px;
    font-weight: 600;
    letter-spacing: normal;
    line-height: 1;
    font-variant-numeric: tabular-nums;
    white-space: nowrap;
    cursor: pointer;
    transition: opacity 0.12s ease;
}

.lw-trust-badge:hover[b-ttwx968zbk] {
    opacity: 0.9;
}

.lw-trust-badge--healthy[b-ttwx968zbk] {
    background: var(--lw-status-success-bg);
    color: var(--lw-status-success-fg);
}

.lw-trust-badge--low[b-ttwx968zbk] {
    background: var(--lw-status-error-bg);
    color: var(--lw-status-error-fg);
}

/* Icon = reference size-3.5 (14px); out-specific Mud's size classes. */
.lw-trust-badge[b-ttwx968zbk]  .lw-trust-badge-icon.mud-icon-root {
    font-size: 14px;
    width: 14px;
    height: 14px;
}
/* _content/Ledgerwise/Components/Shared/Atoms/LwViewAllLink.razor.rz.scp.css */
/* Source: ledgerwise-app dashboard "View All" header links, measured
   2026-07-28: 12px/500 brand-accent, hover 80% alpha, no underline. */

.lw-view-all[b-d8180x1566] {
    display: inline-flex;
}

.lw-view-all-link[b-d8180x1566] {
    display: inline-flex;
    align-items: center;
    gap: 0.25rem;
    padding: 0;
    border: none;
    background: transparent;
    cursor: pointer;
    font-size: 0.75rem;
    font-weight: 500;
    color: var(--lw-primary-blue);
    text-decoration: none;
    font-family: var(--lw-font-family);
    transition: color 0.15s;
}

.lw-view-all-link:hover[b-d8180x1566] {
    color: color-mix(in srgb, var(--lw-primary-blue) 80%, transparent);
    text-decoration: none;
}
/* _content/Ledgerwise/Components/Shared/Atoms/LwViewToggle.razor.rz.scp.css */
/* Source: ledgerwise-app gc-documents.tsx view toggle (2026-07-20).
   Track: inline-flex h-9 items-center gap-0.5 rounded-md bg-muted p-0.5.
   Buttons: size-8 rounded-[5px]; selected bg-white shadow-sm text-foreground;
   idle text-muted-foreground hover:text-foreground. Icons 18px. */

.lw-view-toggle[b-jqpwscupzg] {
    display: inline-flex;
    align-items: center;
    gap: 2px;
    height: 36px;
    padding: 2px;
    background: var(--lw-bg-muted);
    border-radius: var(--lw-radius-control);
}

.lw-view-toggle[b-jqpwscupzg]  button {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 32px;
    height: 32px;
    border: none;
    border-radius: 5px;
    background: transparent;
    color: var(--lw-gray-space);
    cursor: pointer;
    transition: background 0.15s ease, color 0.15s ease, box-shadow 0.15s ease;
}

.lw-view-toggle[b-jqpwscupzg]  button:hover { color: var(--lw-text-primary); }

.lw-view-toggle[b-jqpwscupzg]  button.active {
    background: var(--lw-white);
    color: var(--lw-text-primary);
    box-shadow: var(--lw-shadow-sm);
}

.lw-view-toggle[b-jqpwscupzg]  .mud-icon-root { width: 18px; height: 18px; }
/* _content/Ledgerwise/Components/Shared/Card.razor.rz.scp.css */
.lw-card[b-qtytj2dnbq] {
    border-radius: var(--lw-radius-card);
    border: 1px solid var(--lw-border);
    background: var(--lw-white);
}

.lw-card--surface-form[b-qtytj2dnbq] {
    background: var(--lw-form-surface);
}

.lw-card--elevated[b-qtytj2dnbq] {
    box-shadow: var(--lw-shadow-card);
}

.lw-card--clip[b-qtytj2dnbq] {
    overflow: hidden;
}

.lw-card__header[b-qtytj2dnbq] {
    padding: 0.75rem 1rem;
    border-bottom: 1px solid var(--lw-border);
}

/* Interactive (clickable) card: hover lift + keyboard focus ring. */
.lw-card--interactive[b-qtytj2dnbq] {
    cursor: pointer;
    transition: box-shadow 0.15s ease, border-color 0.15s ease;
}

.lw-card--interactive:hover[b-qtytj2dnbq] {
    box-shadow: var(--lw-shadow-card);
}

.lw-card--interactive:focus-visible[b-qtytj2dnbq] {
    outline: 2px solid var(--lw-primary-blue);
    outline-offset: 2px;
}
/* _content/Ledgerwise/Components/Shared/ClientBankAccountPicker.razor.rz.scp.css */
/* Connected-bank-account picker -- the LedgerWise expandable account list:
   one selectable row per account with a logo tile, name + Default badge,
   masked number, and available balance. Reused by the Confirm Payment and
   Add Funds modals. */

.cbap-list[b-sqm6si0vr7] {
    display: flex;
    flex-direction: column;
    gap: 0.25rem;
    font-family: var(--lw-font-family, sans-serif);
}

.cbap-row[b-sqm6si0vr7] {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    width: 100%;
    padding: 0.625rem 0.75rem;
    border: 0;
    border-radius: var(--lw-radius-control, 8px);
    background: transparent;
    text-align: left;
    cursor: pointer;
    transition: background-color 0.15s;
}

.cbap-row:hover:not(:disabled)[b-sqm6si0vr7] {
    background: var(--lw-bg-muted, #f0f3f6);
}

.cbap-row--active[b-sqm6si0vr7] {
    background: var(--lw-bg-secondary, #eef0f4);
}

.cbap-row:disabled[b-sqm6si0vr7] {
    cursor: not-allowed;
    opacity: 0.6;
}

/* Radio indicator */
.cbap-radio[b-sqm6si0vr7] {
    flex-shrink: 0;
    width: 16px;
    height: 16px;
    border-radius: 50%;
    border: 2px solid var(--lw-border);
    position: relative;
    transition: border-color 0.15s;
}

.cbap-radio--on[b-sqm6si0vr7] {
    border-color: var(--lw-primary-dark, #020B2B);
}

.cbap-radio--on[b-sqm6si0vr7]::after {
    content: "";
    position: absolute;
    top: 50%;
    left: 50%;
    width: 8px;
    height: 8px;
    border-radius: 50%;
    background: var(--lw-primary-dark, #020B2B);
    transform: translate(-50%, -50%);
}

/* Bank logo monogram tile */
.cbap-logo[b-sqm6si0vr7] {
    flex-shrink: 0;
    width: 32px;
    height: 32px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border-radius: var(--lw-radius-control, 8px);
    background: var(--lw-primary-dark, #020B2B);
    color: var(--lw-white, #FFFFFF);
    font-size: 0.6875rem;
    font-weight: 700;
    letter-spacing: 0.02em;
}

/* Name + masked account */
.cbap-body[b-sqm6si0vr7] {
    display: flex;
    flex-direction: column;
    gap: 0.125rem;
    min-width: 0;
    flex: 1 1 auto;
}

.cbap-name-row[b-sqm6si0vr7] {
    display: flex;
    align-items: center;
    gap: 0.375rem;
    min-width: 0;
}

.cbap-name[b-sqm6si0vr7] {
    font-size: 0.875rem;
    font-weight: 500;
    color: var(--lw-primary-dark, #020B2B);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.cbap-badge[b-sqm6si0vr7] {
    flex-shrink: 0;
    display: inline-flex;
    align-items: center;
    padding: 0.0625rem 0.375rem;
    border-radius: 999px;
    background: var(--lw-status-success-bg, rgba(45, 122, 95, 0.12));
    color: var(--lw-status-success-fg, #1F5C47);
    font-size: 0.625rem;
    font-weight: 700;
    letter-spacing: 0.04em;
    text-transform: uppercase;
    line-height: 1.4;
}

.cbap-mask[b-sqm6si0vr7] {
    font-size: 0.75rem;
    color: var(--lw-gray-graphite, #6E7180);
    font-variant-numeric: tabular-nums;
}

/* Available balance */
.cbap-balance[b-sqm6si0vr7] {
    flex-shrink: 0;
    display: flex;
    flex-direction: column;
    align-items: flex-end;
    gap: 0.0625rem;
    text-align: right;
}

.cbap-balance-amount[b-sqm6si0vr7] {
    font-size: 0.875rem;
    font-weight: 600;
    color: var(--lw-primary-dark, #020B2B);
    font-variant-numeric: tabular-nums;
}

.cbap-balance-label[b-sqm6si0vr7] {
    font-size: 0.6875rem;
    color: var(--lw-gray-graphite, #6E7180);
}

/* Refresh affordance on the active row */
.cbap-refresh[b-sqm6si0vr7] {
    flex-shrink: 0;
    width: 24px;
    height: 24px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border-radius: 50%;
    color: var(--lw-gray-graphite, #6E7180);
    cursor: pointer;
    transition: color 0.15s, background-color 0.15s;
}

.cbap-refresh:hover[b-sqm6si0vr7] {
    color: var(--lw-primary-dark, #020B2B);
    background: var(--lw-bg-muted, #f0f3f6);
}

.cbap-refresh--busy[b-sqm6si0vr7] {
    animation: cbap-spin-b-sqm6si0vr7 0.8s linear infinite;
    pointer-events: none;
}

@keyframes cbap-spin-b-sqm6si0vr7 {
    to { transform: rotate(360deg); }
}

.cbap-msg[b-sqm6si0vr7] {
    margin-top: 0.375rem;
    padding: 0 0.75rem;
    font-size: 0.75rem;
    color: var(--lw-gray-graphite, #6E7180);
}
/* _content/Ledgerwise/Components/Shared/ControlCard.razor.rz.scp.css */
/* Wizard control card -- mirrors ledgerwise-ui ControlCard. */
.cc-card[b-3yz83k5trf] {
    display: flex;
    flex-direction: column;
    border-radius: var(--lw-radius-card);
    border: 1px solid var(--lw-border);
    background: var(--lw-form-surface);
    box-shadow: var(--lw-shadow-card);
}

.cc-head[b-3yz83k5trf] {
    display: flex;
    align-items: center;
    gap: 14px;
    border-bottom: 1px solid var(--lw-border);
    background: var(--lw-white);
    padding: 16px 24px;
    border-radius: var(--lw-radius-card) var(--lw-radius-card) 0 0;
}

.cc-head__icon[b-3yz83k5trf] {
    flex-shrink: 0;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 44px;
    height: 44px;
    border-radius: var(--lw-radius-card);
    background: var(--lw-status-info-bg);
}

.cc-head__icon[b-3yz83k5trf]  .mud-icon-root {
    width: 20px;
    height: 20px;
    font-size: 20px;
    color: var(--lw-primary-blue) !important;
}

.cc-head__text[b-3yz83k5trf] {
    flex: 1;
    min-width: 0;
}

.cc-head__title[b-3yz83k5trf] {
    margin: 0;
    font-size: 1rem;
    font-weight: 700;
    line-height: 24px;
    color: var(--lw-text-primary);
}

/* Sub reads in the LIGHT muted-foreground (#9DA2B3), not graphite --
   corrected 2026-07-23 against control-card.tsx (text-muted-foreground). */
.cc-head__sub[b-3yz83k5trf] {
    margin: 0;
    font-size: 12px;
    line-height: 16px;
    color: var(--lw-gray-space);
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.cc-head__action[b-3yz83k5trf] {
    flex-shrink: 0;
}

.cc-body[b-3yz83k5trf] {
    padding: 24px;
}

.cc-note[b-3yz83k5trf] {
    margin-top: 20px;
    display: flex;
    align-items: flex-start;
    gap: 10px;
    border-radius: var(--lw-radius-card);
    background: var(--lw-bg-muted);
    padding: 12px;
}

.cc-note[b-3yz83k5trf]  .mud-icon-root {
    width: 16px;
    height: 16px;
    font-size: 16px;
    color: var(--lw-gray-graphite) !important;
    margin-top: 1px;
}

.cc-note__text[b-3yz83k5trf] {
    font-size: 12px;
    line-height: 18px;
    color: var(--lw-gray-graphite);
}

/* Reference bolds + darkens <strong> runs inside a note. */
.cc-note__text[b-3yz83k5trf]  strong,
.cc-note__text strong[b-3yz83k5trf] {
    font-weight: var(--lw-font-semibold);
    color: var(--lw-text-primary);
}

/* Below md the reference tightens to px-5/p-5 (20px). */
@media (max-width: 767px) {
    .cc-head[b-3yz83k5trf] {
        padding: 16px 20px;
    }

    .cc-body[b-3yz83k5trf] {
        padding: 20px;
    }

    .cc-body--flush[b-3yz83k5trf] {
        padding: 0;
    }
}

/* Full-bleed body variant (list rows own their inset). */
.cc-body--flush[b-3yz83k5trf] { padding: 0; }
/* _content/Ledgerwise/Components/Shared/CountBadge.razor.rz.scp.css */
.lw-count-badge[b-rtil1yenjt] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    border-radius: 9999px;
    font-family: var(--lw-font-family);
    font-weight: 600;
    line-height: 1;
    white-space: nowrap;
}

.lw-count-badge--xs[b-rtil1yenjt] {
    height: 14px;
    min-width: 14px;
    padding: 0 4px;
    font-size: 9px;
}

.lw-count-badge--sm[b-rtil1yenjt] {
    height: 18px;
    min-width: 18px;
    padding: 0 5px;
    font-size: 10px;
}

.lw-count-badge--md[b-rtil1yenjt] {
    height: 20px;
    min-width: 20px;
    padding: 0 6px;
    font-size: 11px;
}

.lw-count-badge--accent[b-rtil1yenjt] {
    background: var(--lw-primary-blue);
    color: var(--lw-primary-blue-fg);
}

.lw-count-badge--sidebar[b-rtil1yenjt] {
    background: rgba(255, 255, 255, 0.15);
    color: var(--lw-sidebar-text-active);
}

.lw-count-badge--ring[b-rtil1yenjt] {
    box-shadow: 0 0 0 2px var(--lw-white);
}
/* _content/Ledgerwise/Components/Shared/DuplicateInvoiceWarning.razor.rz.scp.css */
/* DuplicateInvoiceWarning -- body content inside the Warning LwCallout.
   The callout owns the box, glyph, title, and 14/1.625 graphite body type;
   this file only sets the match list's internal rhythm (2026-07-29). */

.dup-lead[b-i1m05247p8] {
    margin: 0;
}

.dup-matches[b-i1m05247p8] {
    display: grid;
    gap: 8px;
    margin: 10px 0 0;
}

.dup-match[b-i1m05247p8] {
    display: grid;
    gap: 2px;
}

.dup-match-label[b-i1m05247p8] {
    margin: 0;
    font-size: 11px;
    line-height: 14px;
    font-weight: 600;
    letter-spacing: 0.04em;
    text-transform: uppercase;
    color: var(--lw-status-warning-fg);
}

.dup-match-value[b-i1m05247p8] {
    margin: 0;
    font-size: 14px;
    line-height: 20px;
    font-weight: 600;
    color: var(--lw-text-primary);
}

.dup-hint[b-i1m05247p8] {
    margin: 10px 0 0;
    font-size: 12px;
    line-height: 18px;
    color: var(--lw-gray-graphite);
}
/* _content/Ledgerwise/Components/Shared/EmptyState.razor.rz.scp.css */
.lw-empty-hero[b-fhrnsb7zyc] {
    padding: 2rem;
    margin-bottom: 1.5rem;
    background: linear-gradient(135deg, var(--lw-primary-dark) 0%, var(--lw-primary-blue) 100%);
    border-radius: 16px;
}

.lw-empty-hero-title[b-fhrnsb7zyc] {
    color: var(--lw-white);
    font-weight: var(--lw-font-bold);
    margin-bottom: 0.75rem;
}

.lw-empty-hero-desc[b-fhrnsb7zyc]  p,
.lw-empty-hero-desc[b-fhrnsb7zyc] {
    color: rgba(255, 255, 255, 0.85);
    margin: 0 0 1.25rem 0;
}

.lw-empty-hero-cta[b-fhrnsb7zyc] {
    background-color: var(--lw-white) !important;
    color: var(--lw-primary-dark) !important;
    font-weight: var(--lw-font-semibold);
    border-radius: 24px;
    text-transform: none;
}

.lw-empty-hero-iconwrap[b-fhrnsb7zyc] {
    background: rgba(255, 255, 255, 0.15);
    border-radius: 12px;
    width: 100%;
    min-height: 180px;
    display: flex;
    align-items: center;
    justify-content: center;
}

.lw-empty-hero-icon[b-fhrnsb7zyc] {
    color: var(--lw-white);
    font-size: 4rem;
}

.lw-empty-features[b-fhrnsb7zyc] {
    margin-top: 0;
}
/* _content/Ledgerwise/Components/Shared/FileDropZone.razor.rz.scp.css */
.fdz-wrap[b-o7eq5iutab] {
    position: relative;
}

.fdz[b-o7eq5iutab] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 4px;
    min-height: 150px;
    padding: 24px;
    border: 2px dashed var(--lw-input-border, rgba(145, 158, 171, 0.4));
    border-radius: var(--lw-radius-card, 8px);
    background: var(--lw-bg-muted, #f0f3f6);
    text-align: center;
    cursor: pointer;
    transition: border-color 0.15s ease, background-color 0.15s ease;
}

.fdz:hover[b-o7eq5iutab],
.fdz--over[b-o7eq5iutab] {
    border-color: var(--lw-primary-blue, #3980a5);
    background: var(--lw-status-info-bg, #e8f1f6);
}

.fdz__icon[b-o7eq5iutab]  .mud-icon-root {
    width: 2.4rem;
    height: 2.4rem;
    font-size: 2.4rem;
    color: var(--lw-primary-blue, #3980a5);
}

.fdz__title[b-o7eq5iutab] {
    margin: 6px 0 0;
    font-size: 14px;
    font-weight: 600;
    color: var(--lw-text-primary, #18181b);
}

.fdz__sub[b-o7eq5iutab] {
    margin: 0;
    font-size: 12px;
    color: var(--lw-gray-graphite, #6e7180);
}
/* _content/Ledgerwise/Components/Shared/FilterChip.razor.rz.scp.css */
.lw-filter-chip[b-62odolomc2] {
    display: inline-flex;
    align-items: center;
    gap: 0.375rem;
    height: 28px;
    padding: 0 0.625rem;
    border-radius: var(--lw-radius-control);
    border: 1px solid var(--lw-border);
    background: transparent;
    color: var(--lw-gray-graphite);
    font-family: var(--lw-font-family);
    font-weight: 500;
    line-height: 1;
    cursor: pointer;
    white-space: nowrap;
    transition: background 0.15s ease, color 0.15s ease, border-color 0.15s ease;
}

.lw-filter-chip--sm[b-62odolomc2] {
    font-size: 12px;
}

.lw-filter-chip--md[b-62odolomc2] {
    font-size: 13px;
}

.lw-filter-chip:hover[b-62odolomc2] {
    background: var(--lw-bg-muted);
    color: var(--lw-text-primary);
}

.lw-filter-chip--active[b-62odolomc2] {
    background: var(--lw-primary-dark);
    color: var(--lw-white);
    border-color: transparent;
    font-weight: 600;
}

.lw-filter-chip--active:hover[b-62odolomc2] {
    background: var(--lw-primary-dark);
    color: var(--lw-white);
}

.lw-filter-chip__close[b-62odolomc2] {
    display: inline-flex;
    align-items: center;
    cursor: pointer;
    opacity: 0.7;
}

.lw-filter-chip__close:hover[b-62odolomc2] {
    opacity: 1;
}

.lw-filter-chip__close-icon[b-62odolomc2] {
    font-size: 0.875rem;
}
/* _content/Ledgerwise/Components/Shared/Form5119/Form5119Document.razor.rz.scp.css */
/* ============================================================
   Shared Form 5119 document: TOC sidebar + body (recitals + articles).
   Lifted verbatim from AccountAgreement.razor.css so the client page and the
   builder stepper render the identical agreement. Colors reference --lw-* tokens.
   ============================================================ */

/* -- Document shell: TOC sidebar + body --
   overflow:clip (NOT hidden) so the sticky TOC pins against the page
   scroller instead of being confined to the card. */
.aa-doc[b-romphvetip] {
    display: grid;
    grid-template-columns: 240px minmax(0, 1fr);
    background: var(--lw-white);
    border: 1px solid var(--lw-border);
    border-radius: var(--lw-radius-card);
    box-shadow: var(--lw-shadow-card);
    overflow: clip;
}

/* -- TOC sidebar --
   The aside spans the card's full height (tinted band + divider, per the
   reference); only the inner wrapper is sticky. */
.aa-toc[b-romphvetip] {
    border-right: 1px solid var(--lw-border);
    background: var(--lw-form-surface);
}

.aa-toc__inner[b-romphvetip] {
    position: sticky;
    top: 8px;
    padding: 20px 12px;
}

.aa-toc__progress[b-romphvetip] {
    padding: 0 12px 12px;
}

.aa-toc__progress-head[b-romphvetip] {
    display: flex;
    align-items: baseline;
    justify-content: space-between;
    gap: 8px;
}

.aa-toc__progress-label[b-romphvetip] {
    font-size: 11px;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.025em;
    color: var(--lw-gray-space);
}

.aa-toc__progress-count[b-romphvetip] {
    font-size: 11px;
    font-weight: 600;
    font-variant-numeric: tabular-nums;
    color: var(--lw-gray-graphite);
}

.aa-toc__progress-track[b-romphvetip] {
    margin-top: 8px;
    height: 4px;
    border-radius: 9999px;
    background: var(--lw-border);
    overflow: hidden;
}

.aa-toc__progress-fill[b-romphvetip] {
    height: 100%;
    border-radius: 9999px;
    background: var(--lw-primary-blue);
    transition: width 0.3s ease;
}

.aa-toc__nav[b-romphvetip] {
    position: relative;
    display: flex;
    flex-direction: column;
}

.aa-toc__rail[b-romphvetip] {
    position: absolute;
    top: 16px;
    bottom: 16px;
    left: 16px;
    width: 1px;
    background: var(--lw-border);
}

.aa-toc__item[b-romphvetip] {
    position: relative;
    display: flex;
    align-items: center;
    justify-content: flex-start !important;
    gap: 10px;
    padding: 8px 8px 8px 6px;
    border: 0;
    background: transparent;
    border-radius: var(--lw-radius-control);
    text-align: left;
    font-size: 13px;
    color: var(--lw-gray-graphite);
    cursor: pointer;
    transition: color 0.15s ease;
    font-family: inherit;
}

.aa-toc__item:hover[b-romphvetip] {
    color: var(--lw-text-primary);
}

.aa-toc__item.is-active[b-romphvetip] {
    font-weight: 600;
    color: var(--lw-text-primary);
}

.aa-toc__node[b-romphvetip] {
    position: relative;
    z-index: 1;
    flex-shrink: 0;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 20px;
    height: 20px;
    border-radius: 9999px;
    border: 2px solid var(--lw-border);
    background: var(--lw-white);
    font-size: 9px;
    font-weight: 700;
    font-variant-numeric: tabular-nums;
    line-height: 1;
    color: var(--lw-gray-space);
    transition: border-color 0.15s ease, background-color 0.15s ease;
}

/* Row hover firms the ring (reference group-hover:border-grey-steel). */
.aa-toc__item:hover .aa-toc__node:not(.is-active):not(.is-read)[b-romphvetip] {
    border-color: var(--lw-gray-steel);
}

.aa-toc__node.is-active[b-romphvetip] {
    border-color: var(--lw-primary-blue);
    color: var(--lw-primary-blue);
}

.aa-toc__node.is-read[b-romphvetip] {
    border-color: var(--lw-success-dark);
    background: var(--lw-success-dark);
    color: var(--lw-white);
}

.aa-toc__node.is-read[b-romphvetip]  .mud-icon-root {
    color: var(--lw-white) !important;
    width: 12px;
    height: 12px;
    font-size: 12px;
}

.aa-toc__dot[b-romphvetip] {
    width: 6px;
    height: 6px;
    border-radius: 9999px;
    background: var(--lw-primary-blue);
}

.aa-toc__item-label[b-romphvetip] {
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

/* -- Document body -- */
.aa-body[b-romphvetip] {
    min-width: 0;
}

/* -- Recitals --
   (The former aa-preamble masthead -- eyebrow + 24px title + gold rule +
   underlined party fields -- was removed 2026-07-19: the reference document
   body opens directly with this band.) */
.aa-recitals[b-romphvetip] {
    border-bottom: 1px solid var(--lw-border);
    background: var(--lw-form-surface);
    padding: 20px 32px;
}

.aa-recitals__label[b-romphvetip] {
    margin: 0;
    font-size: 11px;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.14em;
    color: var(--lw-gray-space);
}

.aa-recitals__list[b-romphvetip] {
    margin-top: 8px;
    display: flex;
    flex-direction: column;
    gap: 10px;
}

.aa-recital[b-romphvetip] {
    margin: 0;
    font-size: 0.875rem;
    line-height: 1.625;
    color: var(--lw-text-primary);
}

.aa-recital strong[b-romphvetip] {
    font-weight: 600;
    color: var(--lw-text-primary);
}

/* -- Articles -- */
.aa-article[b-romphvetip] {
    padding: 24px 32px;
    scroll-margin-top: 16px;
    border-top: 1px solid var(--lw-border);
}

.aa-article:first-child[b-romphvetip] {
    border-top: 0;
}

.aa-article__head[b-romphvetip] {
    display: flex;
    align-items: baseline;
    gap: 12px;
}

.aa-article__num[b-romphvetip] {
    font-size: 13px;
    font-weight: 700;
    font-variant-numeric: tabular-nums;
    color: var(--lw-primary-blue);
}

.aa-article__title[b-romphvetip] {
    font-size: 15px;
    font-weight: 700;
    color: var(--lw-text-primary);
    margin: 0;
    line-height: 1.3;
}

@media (min-width: 768px) {
    .aa-article__title[b-romphvetip] { font-size: 16px; }
}

.aa-article__clauses[b-romphvetip] {
    margin: 12px 0 0;
    display: flex;
    flex-direction: column;
    gap: 12px;
}

.aa-clause__heading[b-romphvetip] {
    font-size: 0.875rem;
    font-weight: 600;
    color: var(--lw-text-primary);
}

.aa-clause__text[b-romphvetip] {
    margin: 2px 0 0;
    font-size: 0.875rem;
    line-height: 1.625;
    color: var(--lw-text-primary);
}

/* Plain-English gloss */
.aa-gloss[b-romphvetip] {
    margin-top: 12px;
    border-radius: var(--lw-radius-control);
    background: var(--lw-bg-muted);
    padding: 12px 16px;
}

.aa-gloss__label[b-romphvetip] {
    font-size: 11px;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.14em;
    color: var(--lw-primary-blue);
    margin: 0;
}

.aa-gloss__text[b-romphvetip] {
    margin: 6px 0 0;
    font-size: 0.875rem;
    font-weight: 500;
    line-height: 1.625;
    color: var(--lw-text-primary);
}

/* "Important" callout (articles 05 / 06 / 08) */
.aa-callout[b-romphvetip] {
    margin-top: 16px;
    display: flex;
    align-items: flex-start;
    gap: 14px;
    border-radius: var(--lw-radius-control);
    /* Reference border is warning-badge-text/30. */
    border: 1px solid color-mix(in srgb, var(--lw-status-warning-fg) 30%, transparent);
    background: var(--lw-status-warning-bg);
    padding: 16px 20px;
}

.aa-callout__icon[b-romphvetip] {
    flex-shrink: 0;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 28px;
    height: 28px;
    border-radius: 9999px;
    background: var(--lw-status-warning-fg);
    margin-top: 2px;
}

.aa-callout__icon[b-romphvetip]  .mud-icon-root {
    color: var(--lw-white) !important;
    width: 14px;
    height: 14px;
    font-size: 16px;
}

.aa-callout__label[b-romphvetip] {
    font-size: 12px;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.12em;
    color: var(--lw-status-warning-fg);
    margin: 0;
}

.aa-callout__text[b-romphvetip] {
    margin: 4px 0 0;
    font-size: 0.875rem;
    font-weight: 500;
    line-height: 1.625;
    color: var(--lw-text-primary);
}

/* -- Responsive -- */
@media (max-width: 1024px) {
    .aa-doc[b-romphvetip] {
        grid-template-columns: 1fr;
    }

    .aa-toc[b-romphvetip] {
        display: none;
    }

    .aa-recitals[b-romphvetip],
    .aa-article[b-romphvetip] {
        padding-left: 20px;
        padding-right: 20px;
    }
}
/* _content/Ledgerwise/Components/Shared/Form5119/Form5119SignBlock.razor.rz.scp.css */
/* ============================================================
   Shared Form 5119 sign block: acknowledgments, signature grid, and the
   draw/type adopt-signature overlay. Lifted verbatim from
   AccountAgreement.razor.css. Colors reference --lw-* tokens.
   ============================================================ */

.aa-sign[b-smipyeppxg] {
    margin-top: 24px;
    background: var(--lw-white);
    border: 1px solid var(--lw-border);
    border-radius: var(--lw-radius-card);
    padding: 24px 28px;
}

.aa-sign__title[b-smipyeppxg] {
    font-size: 18px;
    font-weight: 700;
    color: var(--lw-text-primary);
    margin: 0;
}

.aa-sign__sub[b-smipyeppxg] {
    margin: 6px 0 0;
    max-width: 60ch;
    font-size: 0.875rem;
    line-height: 1.55;
    color: var(--lw-gray-graphite);
}

.aa-acks[b-smipyeppxg] {
    margin-top: 20px;
    display: flex;
    flex-direction: column;
    gap: 8px;
}

.aa-ack[b-smipyeppxg] {
    display: flex;
    align-items: flex-start;
    justify-content: flex-start !important;
    gap: 12px;
    border: 1px solid var(--lw-border);
    background: var(--lw-white);
    border-radius: var(--lw-radius-card);
    padding: 14px 16px;
    text-align: left;
    cursor: pointer;
    transition: background-color 0.15s ease, border-color 0.15s ease;
    font-family: inherit;
}

.aa-ack:hover[b-smipyeppxg] {
    background: var(--lw-bg-muted);
}

.aa-ack.is-checked[b-smipyeppxg] {
    border-color: var(--lw-primary-blue);
    background: var(--lw-status-info-bg);
}

.aa-ack__box[b-smipyeppxg] {
    flex-shrink: 0;
    margin-top: 1px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 20px;
    height: 20px;
    border-radius: 4px;
    border: 1px solid var(--lw-gray-steel);
    background: var(--lw-white);
    transition: background-color 0.15s ease, border-color 0.15s ease;
}

.aa-ack.is-checked .aa-ack__box[b-smipyeppxg] {
    border-color: var(--lw-primary-blue);
    background: var(--lw-primary-blue);
}

.aa-ack__box[b-smipyeppxg]  .mud-icon-root {
    color: var(--lw-white) !important;
    width: 14px;
    height: 14px;
    font-size: 14px;
}

.aa-ack__text[b-smipyeppxg] {
    font-size: 0.875rem;
    line-height: 1.55;
    color: var(--lw-text-primary);
}

.aa-ack__text strong[b-smipyeppxg] {
    font-weight: 700;
}

/* Signature grid */
.aa-sig-grid[b-smipyeppxg] {
    margin-top: 20px;
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 16px;
}

.aa-sig-field[b-smipyeppxg] {
    grid-column: 1 / -1;
    position: relative;
    display: flex;
    flex-direction: column;
    justify-content: flex-end;
    min-height: 140px;
    padding: 28px 14px 14px;
    border: 1px dashed var(--lw-input-border);
    border-radius: 6px;
    background: var(--lw-white);
    text-align: left;
    cursor: pointer;
    transition: border-color 0.15s ease;
    font-family: inherit;
}

.aa-sig-field:hover[b-smipyeppxg] {
    border-color: var(--lw-primary-blue);
}

.aa-sig-field.is-signed[b-smipyeppxg] {
    border-style: solid;
    border-color: var(--lw-primary-blue);
}

.aa-sig-field__label[b-smipyeppxg] {
    position: absolute;
    left: 14px;
    top: 10px;
    font-size: 11px;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.04em;
    color: var(--lw-gray-graphite);
}

.aa-sig-field__action[b-smipyeppxg] {
    position: absolute;
    right: 14px;
    top: 8px;
    display: inline-flex;
    align-items: center;
    gap: 4px;
    font-size: 11px;
    font-weight: 500;
    color: var(--lw-primary-blue);
}

.aa-sig-field__action[b-smipyeppxg]  .mud-icon-root {
    color: var(--lw-primary-blue) !important;
    width: 13px;
    height: 13px;
    font-size: 13px;
}

.aa-sig-field__img[b-smipyeppxg] {
    height: 80px;
    width: auto;
    max-width: 100%;
    object-fit: contain;
    object-position: left;
}

.aa-sig-field__typed[b-smipyeppxg] {
    font-size: 34px;
    line-height: 1.1;
    color: var(--lw-text-primary);
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
}

.aa-sig-field__placeholder[b-smipyeppxg] {
    font-size: 0.875rem;
    color: var(--lw-gray-space);
}

.aa-sig-field__baseline[b-smipyeppxg] {
    margin-top: 6px;
    border-top: 1px solid var(--lw-border);
}

.aa-sig-input[b-smipyeppxg] {
    display: flex;
    flex-direction: column;
    gap: 4px;
}

.aa-sig-input__label[b-smipyeppxg] {
    font-size: 11px;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.04em;
    color: var(--lw-gray-graphite);
}

.aa-sig-input__field[b-smipyeppxg] {
    height: 40px;
    border: 1px solid var(--lw-input-border);
    border-radius: 6px;
    background: var(--lw-white);
    padding: 0 12px;
    font-size: 0.875rem;
    color: var(--lw-text-primary);
    font-family: inherit;
    transition: border-color 0.15s ease;
}

.aa-sig-input__field[b-smipyeppxg]::placeholder {
    color: var(--lw-gray-space);
}

.aa-sig-input__field:focus[b-smipyeppxg] {
    outline: none;
    border-color: var(--lw-primary-blue);
}

.aa-sig-date[b-smipyeppxg] {
    display: flex;
    align-items: center;
    height: 40px;
    font-size: 0.875rem;
    font-weight: 500;
    color: var(--lw-text-primary);
}

/* Cursive signature face (typed signatures + previews) */
.aa-sig-script[b-smipyeppxg] {
    font-family: "Segoe Script", "Brush Script MT", "Lucida Handwriting", cursive;
}

/* ── Adopt-signature overlay ── */
.aa-adopt[b-smipyeppxg] {
    position: fixed;
    inset: 0;
    z-index: 1300;
    display: flex;
    align-items: center;
    justify-content: center;
    opacity: 0;
    visibility: hidden;
    transition: opacity 0.18s ease, visibility 0.18s ease;
}

.aa-adopt.is-open[b-smipyeppxg] {
    opacity: 1;
    visibility: visible;
}

.aa-adopt__backdrop[b-smipyeppxg] {
    position: absolute;
    inset: 0;
    background: rgba(2, 11, 43, 0.5);
}

.aa-adopt__panel[b-smipyeppxg] {
    position: relative;
    width: calc(100% - 32px);
    max-width: 560px;
    background: var(--lw-white);
    border: 1px solid var(--lw-border);
    border-radius: var(--lw-radius-card);
    box-shadow: 0 20px 50px rgba(2, 11, 43, 0.25);
    transform: translateY(12px);
    transition: transform 0.18s ease;
}

.aa-adopt.is-open .aa-adopt__panel[b-smipyeppxg] {
    transform: translateY(0);
}

.aa-adopt__head[b-smipyeppxg] {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 12px;
    border-bottom: 1px solid var(--lw-border);
    padding: 16px 20px;
}

.aa-adopt__title[b-smipyeppxg] {
    font-size: 16px;
    font-weight: 700;
    color: var(--lw-text-primary);
    margin: 0;
}

.aa-adopt__sub[b-smipyeppxg] {
    margin: 2px 0 0;
    font-size: 12px;
    color: var(--lw-gray-graphite);
}

.aa-adopt__close[b-smipyeppxg] {
    flex-shrink: 0;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 32px;
    height: 32px;
    border: 0;
    background: transparent;
    color: var(--lw-gray-graphite);
    cursor: pointer;
    border-radius: 6px;
}

.aa-adopt__close:hover[b-smipyeppxg] {
    color: var(--lw-text-primary);
    background: var(--lw-bg-muted);
}

.aa-adopt__close[b-smipyeppxg]  .mud-icon-root {
    width: 18px;
    height: 18px;
    font-size: 18px;
    color: currentColor !important;
}

.aa-adopt__tabs[b-smipyeppxg] {
    display: flex;
    gap: 8px;
    padding: 16px 20px 0;
}

.aa-adopt__tab[b-smipyeppxg] {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    height: 36px;
    padding: 0 16px;
    border: 1px solid var(--lw-border);
    border-radius: 6px;
    background: var(--lw-white);
    font-size: 13px;
    font-weight: 500;
    color: var(--lw-gray-graphite);
    cursor: pointer;
    font-family: inherit;
    transition: background-color 0.15s ease, color 0.15s ease;
}

.aa-adopt__tab:hover[b-smipyeppxg] {
    background: var(--lw-bg-muted);
}

.aa-adopt__tab.is-active[b-smipyeppxg] {
    background: var(--lw-primary-dark);
    border-color: var(--lw-primary-dark);
    color: var(--lw-white);
}

.aa-adopt__tab[b-smipyeppxg]  .mud-icon-root {
    width: 16px;
    height: 16px;
    font-size: 16px;
    color: currentColor !important;
}

.aa-adopt__body[b-smipyeppxg] {
    padding: 16px 20px 20px;
}

.aa-adopt__canvas-wrap[b-smipyeppxg] {
    position: relative;
}

.aa-adopt__canvas[b-smipyeppxg] {
    display: block;
    width: 100%;
    height: 180px;
    border: 1px dashed var(--lw-input-border);
    border-radius: 6px;
    background: var(--lw-white);
    cursor: crosshair;
    touch-action: none;
}

.aa-adopt__baseline[b-smipyeppxg] {
    position: absolute;
    left: 32px;
    right: 32px;
    bottom: 40px;
    border-bottom: 1px solid var(--lw-border);
    pointer-events: none;
}

.aa-adopt__hint[b-smipyeppxg] {
    position: absolute;
    inset: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 0.875rem;
    color: var(--lw-gray-space);
    pointer-events: none;
}

.aa-adopt__clear[b-smipyeppxg] {
    position: absolute;
    right: 8px;
    top: 8px;
    display: inline-flex;
    align-items: center;
    gap: 4px;
    height: 28px;
    padding: 0 8px;
    border: 0;
    background: transparent;
    border-radius: 6px;
    font-size: 12px;
    font-weight: 500;
    color: var(--lw-gray-graphite);
    cursor: pointer;
    font-family: inherit;
}

.aa-adopt__clear:hover[b-smipyeppxg] {
    background: var(--lw-bg-muted);
    color: var(--lw-text-primary);
}

.aa-adopt__clear[b-smipyeppxg]  .mud-icon-root {
    width: 14px;
    height: 14px;
    font-size: 14px;
    color: currentColor !important;
}

.aa-adopt__type[b-smipyeppxg] {
    display: flex;
    flex-direction: column;
    gap: 12px;
}

.aa-adopt__type-input[b-smipyeppxg] {
    height: 40px;
    border: 1px solid var(--lw-input-border);
    border-radius: 6px;
    background: var(--lw-white);
    padding: 0 12px;
    font-size: 0.875rem;
    color: var(--lw-text-primary);
    font-family: inherit;
}

.aa-adopt__type-input:focus[b-smipyeppxg] {
    outline: none;
    border-color: var(--lw-primary-blue);
}

.aa-adopt__type-preview[b-smipyeppxg] {
    display: flex;
    align-items: center;
    justify-content: center;
    height: 120px;
    border: 1px dashed var(--lw-input-border);
    border-radius: 6px;
    background: var(--lw-white);
}

.aa-adopt__type-preview .aa-sig-script[b-smipyeppxg] {
    font-size: 34px;
    line-height: 1;
    color: var(--lw-text-primary);
    padding: 0 16px;
    text-align: center;
}

.aa-adopt__legal[b-smipyeppxg] {
    margin: 12px 0 0;
    font-size: 12px;
    line-height: 1.5;
    color: var(--lw-gray-graphite);
}

.aa-adopt__foot[b-smipyeppxg] {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: 12px;
    border-top: 1px solid var(--lw-border);
    padding: 14px 20px;
}

.is-hidden[b-smipyeppxg] {
    display: none !important;
}

/* E-sign disclosure link under the acknowledgments */
.aa-disclosure[b-smipyeppxg] {
    margin: 10px 2px 0;
    font-size: 0.78rem;
    line-height: 1.5;
    color: var(--lw-gray-graphite);
}

.aa-disclosure a[b-smipyeppxg] {
    color: var(--lw-primary-blue);
    text-decoration: underline;
    text-underline-offset: 2px;
}

/* ── Responsive ── */
@media (max-width: 640px) {
    .aa-sig-grid[b-smipyeppxg] {
        grid-template-columns: 1fr;
    }

    .aa-sign[b-smipyeppxg] {
        padding: 20px 16px;
    }
}
/* _content/Ledgerwise/Components/Shared/LegendItem.razor.rz.scp.css */
.lw-legend-item[b-2q6kg4frpe] {
    display: inline-flex;
    align-items: center;
    gap: 0.375rem;
}

.lw-legend-item__label[b-2q6kg4frpe] {
    font-size: 0.6875rem;
    color: var(--lw-gray-graphite);
}
/* _content/Ledgerwise/Components/Shared/LienWaiver/LienWaiverDocument.razor.rz.scp.css */
/* Branded lien waiver document card. Tokens from branding.css. */
.lw-waiver[b-zl2hwc5geb] {
    background: #fff;
    border: 1px solid var(--lw-border);
    border-radius: var(--lw-radius-card);
    box-shadow: var(--lw-shadow-card);
    padding: 40px 44px;
    max-width: 860px;
    margin: 0 auto;
    color: var(--lw-text-primary);
}

.lw-waiver__brand[b-zl2hwc5geb] {
    padding-bottom: 14px;
    border-bottom: 1px solid var(--lw-border);
}

.lw-waiver__logo[b-zl2hwc5geb] {
    height: 30px;
    width: auto;
    display: block;
}

.lw-waiver__masthead[b-zl2hwc5geb] {
    text-align: center;
    padding-top: 22px;
}

.lw-waiver__eyebrow[b-zl2hwc5geb] {
    font-size: 0.72rem;
    font-weight: 700;
    letter-spacing: 0.14em;
    color: var(--lw-primary-blue);
}

.lw-waiver__title[b-zl2hwc5geb] {
    font-family: var(--lw-font-family-heading);
    font-size: 1.45rem;
    font-weight: 700;
    color: var(--lw-primary-dark);
    margin: 6px 0 0;
    letter-spacing: 0.01em;
}

.lw-waiver__title-rule[b-zl2hwc5geb] {
    width: 340px;
    max-width: 80%;
    height: 3px;
    background: var(--lw-primary-gold);
    margin: 10px auto 0;
    border-radius: 2px;
}

.lw-waiver__notice[b-zl2hwc5geb] {
    margin-top: 22px;
    border: 1px solid var(--lw-border);
    border-left: 3px solid var(--lw-primary-blue);
    padding: 12px 16px;
    font-size: 0.9rem;
    line-height: 1.5;
}

.lw-waiver__notice strong[b-zl2hwc5geb] {
    color: var(--lw-primary-dark);
}

.lw-waiver__section[b-zl2hwc5geb] {
    display: flex;
    align-items: center;
    gap: 8px;
    margin: 26px 0 4px;
    padding-bottom: 6px;
    border-bottom: 1px solid var(--lw-border);
    font-size: 0.85rem;
    font-weight: 700;
    letter-spacing: 0.1em;
    color: var(--lw-primary-dark);
}

.lw-waiver__section[b-zl2hwc5geb]::before {
    content: "";
    width: 7px;
    height: 7px;
    background: var(--lw-primary-blue);
    flex: none;
}

.lw-waiver__field[b-zl2hwc5geb] {
    display: flex;
    align-items: baseline;
    gap: 12px;
    padding: 10px 0 6px;
    border-bottom: 1px solid var(--lw-input-border);
}

.lw-waiver__field--input[b-zl2hwc5geb] {
    align-items: center;
    padding-bottom: 8px;
}

.lw-waiver__field-label[b-zl2hwc5geb] {
    flex: 0 0 150px;
    font-size: 0.85rem;
    color: var(--lw-gray-graphite);
}

.lw-waiver__field-value[b-zl2hwc5geb] {
    font-size: 0.95rem;
    font-weight: 600;
    color: var(--lw-primary-dark);
}

.lw-waiver__field-input[b-zl2hwc5geb] {
    max-width: 220px;
    flex: 1;
}

.lw-waiver__paragraph[b-zl2hwc5geb] {
    font-size: 0.9rem;
    line-height: 1.6;
    margin: 12px 0 4px;
    text-align: justify;
}

.lw-waiver__paragraph--tight[b-zl2hwc5geb] {
    margin: 0;
}

.lw-waiver__exception[b-zl2hwc5geb] {
    display: flex;
    gap: 10px;
    margin-top: 10px;
}

.lw-waiver__exception-marker[b-zl2hwc5geb] {
    flex: 0 0 26px;
    font-size: 0.9rem;
}

.lw-waiver__exception-body[b-zl2hwc5geb] {
    flex: 1;
}

.lw-waiver__subfield[b-zl2hwc5geb] {
    display: flex;
    align-items: center;
    gap: 10px;
    margin: 8px 0 0 12px;
}

.lw-waiver__subfield-label[b-zl2hwc5geb] {
    font-size: 0.85rem;
    color: var(--lw-gray-graphite);
    flex: none;
}

.lw-waiver__subfield-input[b-zl2hwc5geb] {
    max-width: 260px;
    flex: 1;
}

.lw-waiver__footer[b-zl2hwc5geb] {
    display: flex;
    justify-content: space-between;
    gap: 12px;
    margin-top: 30px;
    padding-top: 10px;
    border-top: 1px solid var(--lw-border);
    font-size: 0.75rem;
    color: var(--lw-gray-graphite);
}

@media (max-width: 640px) {
    .lw-waiver[b-zl2hwc5geb] {
        padding: 24px 18px;
    }

    .lw-waiver__field[b-zl2hwc5geb] {
        flex-direction: column;
        gap: 2px;
    }

    .lw-waiver__field-label[b-zl2hwc5geb] {
        flex: none;
    }

    .lw-waiver__subfield[b-zl2hwc5geb] {
        flex-direction: column;
        align-items: flex-start;
        margin-left: 0;
    }
}

/* Attached control-card header band (HeaderTitle set): full-bleed across the
   card padding; the card clips it to its own top radius. */
.lw-waiver--headed[b-zl2hwc5geb] {
    padding-top: 0;
    overflow: hidden;
}

.lw-waiver__head[b-zl2hwc5geb] {
    margin: 0 -44px 24px;
    border-bottom: 1px solid var(--lw-border);
}

@media (max-width: 640px) {
    .lw-waiver__head[b-zl2hwc5geb] {
        margin: 0 -18px 20px;
    }
}
/* _content/Ledgerwise/Components/Shared/LienWaiver/LienWaiverSigningFlow.razor.rz.scp.css */
.lw-flow[b-yao9jz8coy] {
    max-width: 860px;
    margin: 0 auto;
}

.lw-flow__actions[b-yao9jz8coy] {
    display: flex;
    justify-content: flex-end;
    margin-top: 20px;
    padding-bottom: 8px;
}
/* _content/Ledgerwise/Components/Shared/LwBudgetTableSkeleton.razor.rz.scp.css */
/* Source: ledgerwise-app molecules/budget-table-skeleton.tsx, gc variant
   (2026-07-28): header row 44px on table-header fill, category rows 40px on
   40%-muted, line rows 48px, then subtotal 48px / Total Construction Cost
   56px on table-header fill / fee rows 40px / fees total 44px on 60%-muted;
   staggered modulo widths per row. Deviations (see .razor comment): toolbar
   sketches our BudgetToolbar; money columns 10rem per budget-table.css
   canonical widths (expand 2.5rem / line# 4.5rem / desc flex / actions
   4.5rem). Toolbar/table/card chrome comes from lw-page.css, lw-table.css
   and Card. Fade-in mirrors LwPaymentRequestsSkeleton. */

.lw-budget-table-skeleton[b-oxm04hacpg] {
    display: flex;
    flex: 1;
    flex-direction: column;
    animation: lw-bts-fade-in-b-oxm04hacpg 0.25s ease both;
}

@keyframes lw-bts-fade-in-b-oxm04hacpg {
    from { opacity: 0; }
    to { opacity: 1; }
}

/* ---- Toolbar ---- */

.lw-bts-chips[b-oxm04hacpg] {
    display: flex;
    align-items: center;
    gap: 6px;
}

.lw-bts-toolbar-right[b-oxm04hacpg] {
    display: flex;
    align-items: center;
    gap: 8px;
}

/* Classes handed to LwSkeleton land on the child component's root div --
   scoped rules for them need ::deep. */
.lw-budget-table-skeleton[b-oxm04hacpg]  .lw-bts-chip {
    flex-shrink: 0;
    border-radius: var(--lw-radius-control);
}

/* ---- Body (mirrors .bt-body) ---- */

.lw-bts-body[b-oxm04hacpg] {
    display: flex;
    flex: 1;
    flex-direction: column;
    gap: 16px;
    padding: 16px;
    background: var(--lw-bg-muted);
}

/* Wide table scrolls inside the card like the real budget-table-host. */
.lw-budget-table-skeleton[b-oxm04hacpg]  .lw-bts-card {
    overflow-x: auto;
}

.lw-bts-table[b-oxm04hacpg] {
    min-width: 860px;
}

/* Skeleton rows are inert -- suppress the shared row affordances. */
.lw-bts-row[b-oxm04hacpg],
.lw-bts-row:hover[b-oxm04hacpg] {
    background: transparent;
    cursor: default;
}

/* ---- Row rhythm (reference: cat h-10, item h-12, subtotal h-12,
   total h-14, fee h-10, fees-total h-11) ---- */

.lw-bts-row--cat > .lw-table-td[b-oxm04hacpg]        { padding-top: 12px; padding-bottom: 12px; }
.lw-bts-row--fee > .lw-table-td[b-oxm04hacpg]        { padding-top: 12px; padding-bottom: 12px; }
.lw-bts-row--fees-total > .lw-table-td[b-oxm04hacpg] { padding-top: 14px; padding-bottom: 14px; }
.lw-bts-row--total > .lw-table-td[b-oxm04hacpg]      { padding-top: 20px; padding-bottom: 20px; }

/* Category header rows: reference bg-muted/40. */
.lw-bts-row--cat[b-oxm04hacpg],
.lw-bts-row--cat:hover[b-oxm04hacpg] {
    background: color-mix(in srgb, var(--lw-bg-muted) 40%, transparent);
}

/* Total Construction Cost row carries the table-header fill (reference
   bg-table-header-bg); fees total sits on 60%-muted. */
.lw-bts-row--total[b-oxm04hacpg],
.lw-bts-row--total:hover[b-oxm04hacpg] {
    background: var(--lw-bg-table-header);
}

.lw-bts-row--fees-total[b-oxm04hacpg],
.lw-bts-row--fees-total:hover[b-oxm04hacpg] {
    background: color-mix(in srgb, var(--lw-bg-muted) 60%, transparent);
}

/* ---- Column layout (mirrors budget-table.css canonical widths) ---- */

.lw-bts-col-expand[b-oxm04hacpg]  { flex: 0 0 2.5rem; justify-content: center; }
.lw-bts-col-num[b-oxm04hacpg]     { flex: 0 0 4.5rem; }
.lw-bts-col-desc[b-oxm04hacpg]    { flex: 1 1 auto; min-width: 0; }
.lw-bts-col-flex[b-oxm04hacpg]    { flex: 1 1 auto; min-width: 0; }
.lw-bts-col-money[b-oxm04hacpg]   { flex: 0 0 10rem; justify-content: flex-end; }
.lw-bts-col-actions[b-oxm04hacpg] { flex: 0 0 4.5rem; justify-content: center; }

.lw-budget-table-skeleton[b-oxm04hacpg]  .lw-bts-fixed {
    flex-shrink: 0;
}
/* _content/Ledgerwise/Components/Shared/LwChangeOrdersSkeleton.razor.rz.scp.css */
/* Spec source: ProjectChangeOrders (2026-07-28) -- no ledgerwise-app skeleton
   exists for this tab, so the real tab layout is the measurement source:
   toolbar chips h-36, body muted 16px pad / 16px gap, summary strip grid
   (2-col mobile, 3-col md+), pco-col* column flexes, mobile card stack at
   <768px. Toolbar/table/card chrome comes from lw-page.css, lw-table.css and
   Card; only layout + skeleton neutralizations live here. Fade-in mirrors
   LwPaymentRequestsSkeleton. */

.lw-change-orders-skeleton[b-0woywbyhsl] {
    display: flex;
    flex: 1;
    flex-direction: column;
    animation: lw-cos-fade-in-b-0woywbyhsl 0.25s ease both;
}

@keyframes lw-cos-fade-in-b-0woywbyhsl {
    from { opacity: 0; }
    to { opacity: 1; }
}

/* ---- Toolbar ---- */

.lw-cos-chips[b-0woywbyhsl] {
    display: flex;
    align-items: center;
    gap: 6px;
}

.lw-cos-toolbar-right[b-0woywbyhsl] {
    display: flex;
    align-items: center;
    gap: 8px;
}

/* Classes handed to LwSkeleton land on the child component's root div --
   scoped rules for them need ::deep. */
.lw-change-orders-skeleton[b-0woywbyhsl]  .lw-cos-chip {
    flex-shrink: 0;
    border-radius: var(--lw-radius-control);
}

/* ---- Body (mirrors .pco-body) ---- */

.lw-cos-body[b-0woywbyhsl] {
    display: flex;
    flex: 1;
    flex-direction: column;
    gap: 16px;
    padding: 16px;
    background: var(--lw-bg-muted);
}

/* ---- Summary strip (mirrors .pco-summary) ---- */

.lw-cos-summary[b-0woywbyhsl] {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 1rem;
}

@media (min-width: 768px) {
    .lw-cos-summary[b-0woywbyhsl] {
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }
}

.lw-cos-summary[b-0woywbyhsl]  .lw-cos-summary-item {
    display: flex;
    flex-direction: column;
    gap: 8px;
    padding: 16px;
}

/* Skeleton rows are inert -- suppress the shared row affordances. */
.lw-cos-row[b-0woywbyhsl],
.lw-cos-row:hover[b-0woywbyhsl] {
    background: transparent;
    cursor: default;
}

/* ---- Column layout (mirrors ProjectChangeOrders .pco-col*) ---- */

.lw-cos-col-title[b-0woywbyhsl]   { flex: 1 1 220px; min-width: 0; }
.lw-cos-col-num[b-0woywbyhsl]     { flex: 0 0 90px; min-width: 0; }
.lw-cos-col-status[b-0woywbyhsl]  { flex: 0 0 170px; min-width: 0; }
.lw-cos-col-date[b-0woywbyhsl]    { flex: 1 0 140px; min-width: 0; }
.lw-cos-col-amount[b-0woywbyhsl]  { flex: 0 0 130px; min-width: 0; justify-content: flex-end; }
.lw-cos-col-actions[b-0woywbyhsl] { flex: 0 0 130px; justify-content: flex-end; }

.lw-change-orders-skeleton[b-0woywbyhsl]  .lw-cos-fixed {
    flex-shrink: 0;
}

/* Desktop table hidden below md, card stack above it -- same breakpoints as
   the real pco-table-card / pco-cards pair. */
.lw-change-orders-skeleton[b-0woywbyhsl]  .lw-cos-desktop {
    display: none;
    overflow: hidden;
}

@media (min-width: 768px) {
    .lw-change-orders-skeleton[b-0woywbyhsl]  .lw-cos-desktop {
        display: block;
    }
}

.lw-cos-cards[b-0woywbyhsl] {
    display: flex;
    flex-direction: column;
    gap: 8px;
}

@media (min-width: 768px) {
    .lw-cos-cards[b-0woywbyhsl] {
        display: none;
    }
}

.lw-change-orders-skeleton[b-0woywbyhsl]  .lw-cos-card {
    display: flex;
    flex-direction: column;
    gap: 10px;
    padding: 16px;
}

.lw-cos-card-top[b-0woywbyhsl] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
}
/* _content/Ledgerwise/Components/Shared/LwDocumentsSkeleton.razor.rz.scp.css */
/* Spec source: GcProjectDocuments Files view (2026-07-28) -- no ledgerwise-app
   skeleton exists for this tab; the real tab layout is the measurement source:
   toolbar chips h-36, .lw-doc-body muted 16px pad / 12px gap, shared
   lw-doc.css column widths (name flex / vis 160 / size 130 / date 170 /
   act 48). Toolbar/table/card chrome comes from lw-page.css, lw-table.css
   and Card. Fade-in mirrors LwPaymentRequestsSkeleton. */

.lw-documents-skeleton[b-yydd9d2pc4] {
    display: flex;
    flex: 1;
    flex-direction: column;
    animation: lw-dcs-fade-in-b-yydd9d2pc4 0.25s ease both;
}

@keyframes lw-dcs-fade-in-b-yydd9d2pc4 {
    from { opacity: 0; }
    to { opacity: 1; }
}

/* ---- Toolbar ---- */

.lw-dcs-chips[b-yydd9d2pc4] {
    display: flex;
    align-items: center;
    gap: 6px;
}

.lw-dcs-toolbar-right[b-yydd9d2pc4] {
    display: flex;
    align-items: center;
    gap: 8px;
}

/* Classes handed to LwSkeleton land on the child component's root div --
   scoped rules for them need ::deep. */
.lw-documents-skeleton[b-yydd9d2pc4]  .lw-dcs-chip {
    flex-shrink: 0;
    border-radius: var(--lw-radius-control);
}

/* ---- Body (mirrors .lw-doc-body) ---- */

.lw-dcs-body[b-yydd9d2pc4] {
    display: flex;
    flex: 1;
    flex-direction: column;
    gap: 12px;
    padding: 16px;
    background: var(--lw-bg-muted);
}

/* Skeleton rows are inert -- suppress the shared row affordances. */
.lw-dcs-row[b-yydd9d2pc4],
.lw-dcs-row:hover[b-yydd9d2pc4] {
    background: transparent;
    cursor: default;
}

/* Icon + name cell */
.lw-dcs-col-name[b-yydd9d2pc4] {
    display: flex;
    align-items: center;
    gap: 10px;
}

/* ---- Column layout (mirrors lw-doc.css shared columns) ---- */

.lw-dcs-col-name[b-yydd9d2pc4] { flex: 1 1 auto; min-width: 0; }
.lw-dcs-col-vis[b-yydd9d2pc4]  { width: 160px; flex: none; }
.lw-dcs-col-size[b-yydd9d2pc4] { width: 130px; flex: none; }
.lw-dcs-col-date[b-yydd9d2pc4] { width: 170px; flex: none; }
.lw-dcs-col-act[b-yydd9d2pc4]  { width: 48px; flex: none; justify-content: center; }

.lw-documents-skeleton[b-yydd9d2pc4]  .lw-dcs-fixed {
    flex-shrink: 0;
}
/* _content/Ledgerwise/Components/Shared/LwInvoiceTableSkeleton.razor.rz.scp.css */
/* Source: ledgerwise-app molecules/invoice-table-skeleton.tsx (2026-07-12):
   staggered row widths via the reference modulo formulas; status cell =
   h-5 w-[80px] badge over five 6x18 rounded-[500px] tracking dots (gap-1.5 /
   gap-1). Table chrome comes from lw-table.css + Card; only the pi-table
   column layout (vendor 300 / flex / actions 48) and skeleton-specific
   neutralizations live here. Fade-in mirrors LwProjectListSkeleton. */

.lw-invoice-table-skeleton[b-qnewmfvstj] {
    animation: lw-its-fade-in-b-qnewmfvstj 0.25s ease both;
}

@keyframes lw-its-fade-in-b-qnewmfvstj {
    from { opacity: 0; }
    to { opacity: 1; }
}

/* Desktop table card; hidden below md like the real pi-table. */
.lw-invoice-table-skeleton[b-qnewmfvstj]  .lw-its-desktop {
    display: none;
}

@media (min-width: 768px) {
    .lw-invoice-table-skeleton[b-qnewmfvstj]  .lw-its-desktop {
        display: block;
    }
}

/* Reference skeleton rows are inert -- suppress the shared row affordances. */
.lw-its-row[b-qnewmfvstj],
.lw-its-row:hover[b-qnewmfvstj] {
    background: transparent;
    cursor: default;
}

/* ---- Column layout (mirrors ProjectInvoices .pi-col* ) ---- */

.lw-its-col[b-qnewmfvstj] {
    flex: 1 1 0;
    min-width: 0;
}

.lw-its-col-vendor[b-qnewmfvstj] {
    flex: 0 0 300px;
    min-width: 0;
    gap: 12px;
}

.lw-its-col-actions[b-qnewmfvstj] {
    flex: 0 0 48px;
    justify-content: center;
}

.lw-its-identity[b-qnewmfvstj] {
    display: flex;
    flex: 1;
    min-width: 0;
    flex-direction: column;
    gap: 6px;
}

.lw-its-status[b-qnewmfvstj] {
    display: flex;
    flex-direction: column;
    gap: 6px;
}

.lw-its-dots[b-qnewmfvstj] {
    display: flex;
    gap: 4px;
}

/* Classes handed to LwSkeleton land on the child component's root div --
   scoped rules for them need ::deep (same as LwProjectListSkeleton). */
.lw-its-dots[b-qnewmfvstj]  .lw-its-dot {
    flex-shrink: 0;
    border-radius: 500px;
}

.lw-invoice-table-skeleton[b-qnewmfvstj]  .lw-its-fixed {
    flex-shrink: 0;
}

/* ---- Mobile card stack ---- */

.lw-its-cards[b-qnewmfvstj] {
    display: flex;
    flex-direction: column;
    gap: 8px;
}

@media (min-width: 768px) {
    .lw-its-cards[b-qnewmfvstj] {
        display: none;
    }
}

.lw-invoice-table-skeleton[b-qnewmfvstj]  .lw-its-card {
    display: flex;
    flex-direction: column;
    gap: 10px;
    padding: 16px;
}

.lw-its-card-top[b-qnewmfvstj] {
    display: flex;
    align-items: center;
    gap: 12px;
}
/* _content/Ledgerwise/Components/Shared/LwPaymentRequestsSkeleton.razor.rz.scp.css */
/* Source: ledgerwise-app molecules/payment-requests-skeleton.tsx (2026-07-12):
   toolbar = pill row (h-9, gap-1.5) + right cluster (search w-52, create
   w-[180px]); body = banner card + table (rows 90/110/150/70 + right 90 +
   16px chevron); mobile card = id/badge row + amount + 12px meta line.
   Toolbar/table/card chrome comes from lw-page.css, lw-table.css and Card;
   only the pdr-table column layout and skeleton-specific neutralizations
   live here. Fade-in mirrors LwProjectListSkeleton. */

.lw-payment-requests-skeleton[b-i148j5sng7] {
    display: flex;
    flex: 1;
    flex-direction: column;
    animation: lw-prs-fade-in-b-i148j5sng7 0.25s ease both;
}

@keyframes lw-prs-fade-in-b-i148j5sng7 {
    from { opacity: 0; }
    to { opacity: 1; }
}

/* ---- Toolbar ---- */

.lw-prs-pills[b-i148j5sng7] {
    display: flex;
    align-items: center;
    gap: 6px;
}

.lw-prs-toolbar-right[b-i148j5sng7] {
    display: flex;
    align-items: center;
    gap: 8px;
}

/* Classes handed to LwSkeleton land on the child component's root div --
   scoped rules for them need ::deep (same as LwProjectListSkeleton). */
.lw-payment-requests-skeleton[b-i148j5sng7]  .lw-prs-pill {
    flex-shrink: 0;
    border-radius: var(--lw-radius-control);
}

/* ---- Body (mirrors .pdr-body) ---- */

.lw-prs-body[b-i148j5sng7] {
    display: flex;
    flex: 1;
    flex-direction: column;
    gap: 16px;
    padding: 16px;
}

@media (min-width: 768px) {
    .lw-prs-body[b-i148j5sng7] {
        padding: 24px;
    }
}

.lw-prs-body[b-i148j5sng7]  .lw-prs-banner {
    border-radius: var(--lw-radius-card);
}

/* Reference skeleton rows are inert -- suppress the shared row affordances. */
.lw-prs-row[b-i148j5sng7],
.lw-prs-row:hover[b-i148j5sng7] {
    background: transparent;
    cursor: default;
}

/* ---- Column layout (mirrors ProjectDrawRequests .pdr-col*) ---- */

.lw-prs-col-request[b-i148j5sng7] {
    flex: 0 0 140px;
    min-width: 0;
}

.lw-prs-col-status[b-i148j5sng7] {
    flex: 0 0 160px;
    min-width: 0;
}

.lw-prs-col-date[b-i148j5sng7] {
    flex: 1 1 180px;
    min-width: 0;
}

.lw-prs-col-invoices[b-i148j5sng7] {
    flex: 0 0 120px;
    min-width: 0;
}

.lw-prs-col-amount[b-i148j5sng7] {
    flex: 1 1 120px;
    min-width: 0;
    justify-content: flex-end;
}

.lw-prs-col-chevron[b-i148j5sng7] {
    flex: 0 0 40px;
    justify-content: center;
    padding: 12px 8px;
}

.lw-payment-requests-skeleton[b-i148j5sng7]  .lw-prs-fixed {
    flex-shrink: 0;
}

/* Desktop table hidden below md, card stack above it -- same breakpoints as
   the real pdr-table / pdr-cards pair. */
.lw-payment-requests-skeleton[b-i148j5sng7]  .lw-prs-desktop {
    display: none;
}

@media (min-width: 768px) {
    .lw-payment-requests-skeleton[b-i148j5sng7]  .lw-prs-desktop {
        display: block;
    }
}

.lw-prs-cards[b-i148j5sng7] {
    display: flex;
    flex-direction: column;
    gap: 8px;
}

@media (min-width: 768px) {
    .lw-prs-cards[b-i148j5sng7] {
        display: none;
    }
}

.lw-payment-requests-skeleton[b-i148j5sng7]  .lw-prs-card {
    display: flex;
    flex-direction: column;
    gap: 10px;
    padding: 16px;
}

.lw-prs-card-top[b-i148j5sng7] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
}

.lw-prs-card-id[b-i148j5sng7] {
    display: flex;
    align-items: center;
    gap: 8px;
}
/* _content/Ledgerwise/Components/Shared/LwProjectDetailSkeleton.razor.rz.scp.css */
/* Composed from the shipped specs of the zones this stands in for
   (2026-07-12): LwProjectHeader.razor.css identity zone (padding 20px 24px 0,
   row gap 16, info col gap 4, name line-height 32, meta column-gap 12) and
   Project.razor.css tab strip (padding 16px 24px 0, 40px inner strip, gap 32,
   border-b) over the shared muted body (16px gutters, 24px from md up).
   Fade-in mirrors LwProjectListSkeleton (0.25s). */

.lw-project-detail-skeleton[b-ihu62edhl0] {
    display: flex;
    flex: 1;
    flex-direction: column;
    animation: lw-pds-fade-in-b-ihu62edhl0 0.25s ease both;
}

@keyframes lw-pds-fade-in-b-ihu62edhl0 {
    from { opacity: 0; }
    to { opacity: 1; }
}

/* --- Identity zone ------------------------------------------------------ */

.lw-pds-header[b-ihu62edhl0] {
    display: flex;
    align-items: center;
    gap: 16px;
    padding: 16px;
    background: var(--lw-white);
}

@media (min-width: 768px) {
    .lw-pds-header[b-ihu62edhl0] {
        padding: 20px 24px 0;
    }
}

.lw-pds-info[b-ihu62edhl0] {
    display: flex;
    flex: 1;
    min-width: 0;
    flex-direction: column;
    gap: 4px;
}

/* Real name row is a 32px line (22px text, leading-8). */
.lw-pds-name-row[b-ihu62edhl0] {
    display: flex;
    align-items: center;
    gap: 16px;
    min-height: 32px;
}

/* Classes handed to LwSkeleton land on the child component's root div, which
   does not carry this component's scope attribute -- every such rule needs
   ::deep (same as LwProjectListSkeleton). */
.lw-pds-name-row[b-ihu62edhl0]  .lw-pds-name {
    width: 280px;
    max-width: 100%;
}

.lw-pds-actions[b-ihu62edhl0] {
    display: none;
    margin-left: auto;
}

@media (min-width: 768px) {
    .lw-pds-actions[b-ihu62edhl0] {
        display: flex;
        align-items: center;
        gap: 8px; /* cp-actions gap-2 */
        flex-shrink: 0;
    }
}

/* Contractor status row: hairline above, 8px top padding, 6px offset from the
   meta line, 24px between items (ContractorProject.razor.css .cp-status-row). */
.lw-pds-status[b-ihu62edhl0] {
    display: flex;
    align-items: center;
    gap: 24px;
    min-height: 20px;
    margin-top: 6px;
    padding-top: 8px;
    border-top: 1px solid var(--lw-border);
}

/* Chip-height meta row (status chip 22px + 14px meta lines). */
.lw-pds-meta[b-ihu62edhl0] {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    column-gap: 12px;
    row-gap: 6px;
    min-height: 22px;
}

/* --- Tab strip ----------------------------------------------------------- */

/* 16px white gap above + 40px strip = 56px total, single bottom hairline
   (Project.razor.css .mud-tabs-tabbar recipe). Labels are middle-aligned in
   the 40px strip like the real 40px tabs. */
.lw-pds-tabbar[b-ihu62edhl0] {
    display: flex;
    flex-shrink: 0;
    align-items: center;
    gap: 32px;
    min-height: 56px;
    padding: 16px 24px 0;
    background: var(--lw-white);
    border-bottom: 1px solid var(--lw-border);
    overflow: hidden;
}

/* --- Content region ------------------------------------------------------ */

.lw-pds-body[b-ihu62edhl0] {
    display: flex;
    flex: 1;
    flex-direction: column;
    gap: 16px;
    padding: 16px;
    background: var(--lw-bg-muted);
}

@media (min-width: 768px) {
    .lw-pds-body[b-ihu62edhl0] {
        padding: 24px;
    }
}

.lw-pds-body[b-ihu62edhl0]  .lw-pds-card {
    border-radius: var(--lw-radius-card);
}

.lw-pds-body[b-ihu62edhl0]  .lw-pds-card--tall {
    flex: 1;
    min-height: 240px;
}

.lw-project-detail-skeleton[b-ihu62edhl0]  .lw-pds-fixed {
    flex-shrink: 0;
}
/* _content/Ledgerwise/Components/Shared/LwProjectHeader.razor.rz.scp.css */
/* Source: ledgerwise-app organisms/project-header.tsx identity zone
   (2026-07-10), values from the compiled Tailwind output:
   Desktop: zone px-6 pt-5; row gap-4 (16px); info col gap-1 (4px);
   name 22px/32px 700 tracking-tight (-0.025em) foreground; meta row
   gap-x-3 (12px) gap-y-1.5 (6px); meta items 14px content-secondary with
   14px muted-foreground icons (gap-1.5); Details 13px/500 muted-foreground,
   hover foreground + underline (offset 2).
   Mobile: row items-start gap-3 px-4 pt-4 pb-3; name 16px/1.25 700
   line-clamp-2; meta 12px muted-foreground line-clamp-2; badges mt-1 gap-2;
   kebab 32px square, content-secondary, hover accent + foreground.
   muted-foreground = --lw-gray-space; content-secondary = --lw-gray-graphite;
   foreground = --lw-text-primary. */

.lw-project-header[b-vimxh3i0ke] {
    display: flex;
    flex-direction: column;
    flex-shrink: 0;
    background: var(--lw-white);
}

/* --- Desktop (>= md) ---------------------------------------------------- */

.lw-ph-desktop[b-vimxh3i0ke] {
    display: none;
}

@media (min-width: 768px) {
    .lw-ph-desktop[b-vimxh3i0ke] {
        display: flex;
        flex-direction: column;
        padding: 20px 24px 0;
    }
}

.lw-ph-row[b-vimxh3i0ke] {
    display: flex;
    align-items: center;
    gap: 16px;
}

.lw-ph-info[b-vimxh3i0ke] {
    display: flex;
    flex: 1;
    min-width: 0;
    flex-direction: column;
    gap: 4px;
}

.lw-ph-name-row[b-vimxh3i0ke] {
    display: flex;
    align-items: center;
    gap: 16px;
}

.lw-ph-name[b-vimxh3i0ke] {
    margin: 0;
    font-family: var(--lw-font-family);
    font-size: var(--lw-title-size);
    font-weight: var(--lw-title-weight);
    line-height: 32px; /* reference leading-8 -- tighter than the title-bar default */
    letter-spacing: var(--lw-tracking-tight);
    color: var(--lw-title-color);
}

.lw-ph-name--truncated[b-vimxh3i0ke] {
    cursor: default;
}

.lw-ph-actions[b-vimxh3i0ke] {
    display: flex;
    flex-shrink: 0;
    align-items: center;
    margin-left: auto;
}

.lw-ph-meta[b-vimxh3i0ke] {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    column-gap: 12px;
    row-gap: 6px;
}

.lw-ph-meta-item[b-vimxh3i0ke] {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    font-size: 14px;
    color: var(--lw-gray-graphite);
}

/* Meta icons = reference size-3.5 (14px) muted-foreground. MudIcon is a
   child component -- ::deep + .mud-icon-root to out-specific Mud's sizing. */
.lw-ph-meta-item[b-vimxh3i0ke]  .lw-ph-meta-icon.mud-icon-root {
    font-size: 14px;
    width: 14px;
    height: 14px;
    flex-shrink: 0;
    color: var(--lw-gray-space);
}

.lw-ph-details[b-vimxh3i0ke] {
    padding: 0;
    border: 0;
    background: transparent;
    font-family: var(--lw-font-family);
    font-size: 13px;
    font-weight: 500;
    color: var(--lw-gray-space);
    cursor: pointer;
    text-underline-offset: 2px;
    transition: color 0.12s ease;
}

.lw-ph-details:hover[b-vimxh3i0ke] {
    color: var(--lw-text-primary);
    text-decoration: underline;
}

/* --- Mobile (< md) ------------------------------------------------------ */

.lw-ph-mobile[b-vimxh3i0ke] {
    display: flex;
    align-items: flex-start;
    gap: 12px;
    padding: 16px 16px 12px;
}

.lw-ph-mobile-info[b-vimxh3i0ke] {
    display: flex;
    flex: 1;
    min-width: 0;
    flex-direction: column;
    gap: 4px;
}

.lw-ph-mobile-name[b-vimxh3i0ke] {
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
    overflow: hidden;
    margin: 0;
    font-family: var(--lw-font-family);
    font-size: 16px;
    font-weight: var(--lw-font-bold);
    line-height: 1.25;
    letter-spacing: normal;
    color: var(--lw-text-primary);
}

.lw-ph-mobile-meta[b-vimxh3i0ke] {
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
    overflow: hidden;
    margin: 0;
    font-size: 12px;
    color: var(--lw-gray-space);
}

.lw-ph-mobile-badges[b-vimxh3i0ke] {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 8px;
    margin-top: 4px;
}

.lw-ph-details--mobile[b-vimxh3i0ke] {
    font-size: 12px;
}

.lw-ph-kebab[b-vimxh3i0ke] {
    display: flex;
    flex-shrink: 0;
    align-items: center;
    justify-content: center;
    width: 32px;
    height: 32px;
    padding: 0;
    border: 0;
    background: transparent;
    color: var(--lw-gray-graphite);
    cursor: pointer;
    transition: background-color 0.12s ease, color 0.12s ease;
}

.lw-ph-kebab:hover[b-vimxh3i0ke] {
    background: var(--lw-accent);
    color: var(--lw-text-primary);
}

/* Kebab icon = reference size-5 (20px). */
.lw-ph-mobile[b-vimxh3i0ke]  .lw-ph-kebab-icon.mud-icon-root {
    font-size: 20px;
    width: 20px;
    height: 20px;
}

/* Desktop hides the mobile zone. This must come AFTER the base .lw-ph-mobile
   rule -- same specificity, so source order decides (a display:none earlier
   in the file loses to the later display:flex regardless of the media query). */
@media (min-width: 768px) {
    .lw-ph-mobile[b-vimxh3i0ke] {
        display: none;
    }
}
/* _content/Ledgerwise/Components/Shared/LwProjectList.razor.rz.scp.css */
/* Source: ledgerwise-ui project list row content. Avatar = 40px gradient
   squircle (project entity), name 14px/500, desc 12px muted, both truncated.
   Stat columns + status are fixed-width to align across rows and the header. */

/* Column header cells (desktop) mirror the row's trailing widths. */
.lw-project-col-name[b-u3tqykx6sa] {
    flex: 1;
}

.lw-project-col-stats[b-u3tqykx6sa] {
    display: flex;
    align-items: center;
    gap: 24px;
    flex-shrink: 0;
}

.lw-project-col-metric[b-u3tqykx6sa] {
    text-align: right;
}

.lw-project-col-status[b-u3tqykx6sa] {
    width: 176px;
    text-align: right; /* matches the right-aligned status badges below it */
}

/* Avatar chrome now lives in the LwAvatar atom (Components/Shared/Atoms). */

/* Identity */
.lw-project-identity[b-u3tqykx6sa] {
    display: flex;
    flex-direction: column;
    gap: 2px;
    min-width: 0;
    flex: 1;
}

.lw-project-name[b-u3tqykx6sa] {
    font-size: 14px;
    font-weight: var(--lw-font-medium);
    color: var(--lw-text-primary);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.lw-project-desc[b-u3tqykx6sa] {
    font-size: 12px;
    color: var(--lw-gray-space);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

/* Status column: fixed width, badge right-aligned (reference w-44 justify-end). */
.lw-project-status-cell[b-u3tqykx6sa] {
    width: 176px;
    display: flex;
    justify-content: flex-end;
}
/* _content/Ledgerwise/Components/Shared/LwProjectListSkeleton.razor.rz.scp.css */
/* Source: ledgerwise-app molecules/projects-list-skeleton.tsx +
   gc-projects-page.tsx skeleton branch (motion fade-in, 0.25s). Row shell
   (gap/padding/dividers) comes from LwListRow; here only the text-column
   stack (gap-1.5 = 6px) and skeleton-specific neutralizations live. */

.lw-project-list-skeleton[b-fomvftxfmj] {
    animation: lw-pls-fade-in-b-fomvftxfmj 0.25s ease both;
}

@keyframes lw-pls-fade-in-b-fomvftxfmj {
    from { opacity: 0; }
    to { opacity: 1; }
}

/* Reference rows are inert divs -- suppress the list row's hover accent. */
.lw-project-list-skeleton[b-fomvftxfmj]  .lw-list-row:hover {
    background: transparent;
}

.lw-project-list-skeleton[b-fomvftxfmj]  .lw-pls-text {
    display: flex;
    flex: 1;
    min-width: 0;
    flex-direction: column;
    gap: 6px;
}

.lw-project-list-skeleton[b-fomvftxfmj]  .lw-pls-fixed {
    flex-shrink: 0;
}
/* _content/Ledgerwise/Components/Shared/LwProposalsSkeleton.razor.rz.scp.css */
/* Spec source: ProjectProposals (2026-07-28) -- no ledgerwise-app skeleton
   exists for this tab; the real tab layout is the measurement source:
   toolbar chips h-36, pp-body 16px pad (24px md+) / 16px gap, pp-col*
   column flexes with the two-line title cell (20px/16px line boxes).
   Toolbar/table/card chrome comes from lw-page.css, lw-table.css and Card.
   Fade-in mirrors LwPaymentRequestsSkeleton. */

.lw-proposals-skeleton[b-2d5vg507mp] {
    display: flex;
    flex: 1;
    flex-direction: column;
    animation: lw-pps-fade-in-b-2d5vg507mp 0.25s ease both;
}

@keyframes lw-pps-fade-in-b-2d5vg507mp {
    from { opacity: 0; }
    to { opacity: 1; }
}

/* ---- Toolbar ---- */

.lw-pps-chips[b-2d5vg507mp] {
    display: flex;
    align-items: center;
    gap: 6px;
}

.lw-pps-toolbar-right[b-2d5vg507mp] {
    display: flex;
    align-items: center;
    gap: 8px;
}

/* Classes handed to LwSkeleton land on the child component's root div --
   scoped rules for them need ::deep. */
.lw-proposals-skeleton[b-2d5vg507mp]  .lw-pps-chip {
    flex-shrink: 0;
    border-radius: var(--lw-radius-control);
}

/* ---- Body (mirrors .pp-body) ---- */

.lw-pps-body[b-2d5vg507mp] {
    display: flex;
    flex: 1;
    flex-direction: column;
    gap: 16px;
    padding: 16px;
}

@media (min-width: 768px) {
    .lw-pps-body[b-2d5vg507mp] {
        padding: 24px;
    }
}

/* Skeleton rows are inert -- suppress the shared row affordances. */
.lw-pps-row[b-2d5vg507mp],
.lw-pps-row:hover[b-2d5vg507mp] {
    background: transparent;
    cursor: default;
}

/* Two-line title cell (real cell: 20px main over 16px sub, no gap). */
.lw-pps-identity[b-2d5vg507mp] {
    display: flex;
    flex-direction: column;
    gap: 6px;
    min-width: 0;
}

/* ---- Column layout (mirrors ProjectProposals .pp-col*) ---- */

.lw-pps-col-title[b-2d5vg507mp]    { flex: 1 1 280px; min-width: 0; }
.lw-pps-col-status[b-2d5vg507mp]   { flex: 0 0 120px; min-width: 0; }
.lw-pps-col-due[b-2d5vg507mp]      { flex: 0 0 160px; min-width: 0; }
.lw-pps-col-received[b-2d5vg507mp] { flex: 0 0 160px; min-width: 0; }
.lw-pps-col-actions[b-2d5vg507mp]  { flex: 0 0 48px; justify-content: center; padding: 12px 8px; }

.lw-proposals-skeleton[b-2d5vg507mp]  .lw-pps-fixed {
    flex-shrink: 0;
}
/* _content/Ledgerwise/Components/Shared/LwTransactionsSkeleton.razor.rz.scp.css */
/* Spec source: Shane Durkin's US-476 ledger mockup, measured 2026-07-30
   (US-476 section 9.1.4). No ledgerwise-app skeleton exists -- the reference gc
   ledger route is a placeholder -- so the mockup is the layout source.
   Table/card chrome comes from lw-table.css and Card. Fade-in mirrors
   LwPaymentRequestsSkeleton. The host page (.pt-page) supplies the muted
   background and padding. */

.lw-transactions-skeleton[b-edut1iu9cn] {
    display: flex;
    flex: 1;
    flex-direction: column;
    animation: lw-txs-fade-in-b-edut1iu9cn 0.25s ease both;
}

@keyframes lw-txs-fade-in-b-edut1iu9cn {
    from { opacity: 0; }
    to { opacity: 1; }
}

/* ---- Balance cards row: equal columns, 16px gap (measured) ---- */

.lw-txs-stats[b-edut1iu9cn] {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
    gap: 1rem;
    margin-bottom: 1rem;
}

.lw-txs-stat[b-edut1iu9cn] {
    display: flex;
    flex-direction: column;
    gap: 0.375rem;
    padding: 1rem 1.25rem;
    background: var(--lw-white);
    border: 1px solid var(--lw-border);
    border-radius: var(--lw-radius-card);
    box-shadow: var(--lw-shadow-card);
    box-sizing: border-box;
}

.lw-txs-stat-figure[b-edut1iu9cn] {
    margin: 0.125rem 0;
}

/* Same overflow treatment as the real .pt-table-card. */
.lw-transactions-skeleton[b-edut1iu9cn]  .lw-txs-card {
    overflow-x: auto;
}

.lw-transactions-skeleton .lw-table[b-edut1iu9cn] {
    min-width: 980px;
}

/* Skeleton rows are inert -- suppress the shared row affordances. */
.lw-txs-row[b-edut1iu9cn],
.lw-txs-row:hover[b-edut1iu9cn] {
    background: transparent;
    cursor: default;
}

/* ---- Column layout: MUST mirror ProjectTransactions.razor.css exactly, or the
   skeleton shifts into the real table on load. Status is sized to the widest
   pill ("Pending Instructions"), not to the mockup's 150px. ---- */

.lw-txs-col-date[b-edut1iu9cn]    { flex: 0 0 120px; min-width: 0; }
.lw-txs-col-ref[b-edut1iu9cn]     { flex: 0 0 105px; min-width: 0; }
.lw-txs-col-status[b-edut1iu9cn]  { flex: 0 0 190px; min-width: 0; }
.lw-txs-col-desc[b-edut1iu9cn]    { flex: 1 1 220px; min-width: 0; }
.lw-txs-col-debit[b-edut1iu9cn]   { flex: 0 0 115px; min-width: 0; justify-content: flex-end; }
.lw-txs-col-credit[b-edut1iu9cn]  { flex: 0 0 115px; min-width: 0; justify-content: flex-end; }
.lw-txs-col-balance[b-edut1iu9cn] { flex: 0 0 125px; min-width: 0; justify-content: flex-end; }
/* _content/Ledgerwise/Components/Shared/Mou/FoundingBuilderMouDocument.razor.rz.scp.css */
/* ============================================================
   Shared Founding Builder MOU document: TOC sidebar + body (preamble + sections).
   Shell/TOC/preamble rules lifted verbatim from Form5119Document.razor.css so the
   MOU renders identically to the PAA; MOU-specific rules (meta row, bullets,
   closing) follow. Colors reference --lw-* tokens.
   ============================================================ */

/* ── Document shell: TOC sidebar + body ──
   overflow:clip (NOT hidden) so the sticky TOC pins against the page
   scroller instead of being confined to the card. */
.aa-doc[b-on3dikxex1] {
    display: grid;
    grid-template-columns: 240px minmax(0, 1fr);
    background: var(--lw-white);
    border: 1px solid var(--lw-border);
    border-radius: var(--lw-radius-card);
    overflow: clip;
}

/* ── TOC sidebar ── */
.aa-toc[b-on3dikxex1] {
    position: sticky;
    top: 8px;
    align-self: start;
    border-right: 1px solid var(--lw-border);
    background: var(--lw-form-surface);
    padding: 20px 12px;
}

.aa-toc__progress[b-on3dikxex1] {
    padding: 0 12px 12px;
}

.aa-toc__progress-head[b-on3dikxex1] {
    display: flex;
    align-items: baseline;
    justify-content: space-between;
    gap: 8px;
}

.aa-toc__progress-label[b-on3dikxex1] {
    font-size: 11px;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    color: var(--lw-gray-graphite);
}

.aa-toc__progress-count[b-on3dikxex1] {
    font-size: 11px;
    font-weight: 600;
    font-variant-numeric: tabular-nums;
    color: var(--lw-gray-graphite);
}

.aa-toc__progress-track[b-on3dikxex1] {
    margin-top: 8px;
    height: 4px;
    border-radius: 9999px;
    background: var(--lw-gray-smoke);
    overflow: hidden;
}

.aa-toc__progress-fill[b-on3dikxex1] {
    height: 100%;
    border-radius: 9999px;
    background: var(--lw-primary-blue);
    transition: width 0.3s ease;
}

.aa-toc__nav[b-on3dikxex1] {
    position: relative;
    display: flex;
    flex-direction: column;
}

.aa-toc__rail[b-on3dikxex1] {
    position: absolute;
    top: 16px;
    bottom: 16px;
    left: 16px;
    width: 1px;
    background: var(--lw-gray-smoke);
}

.aa-toc__item[b-on3dikxex1] {
    position: relative;
    display: flex;
    align-items: center;
    justify-content: flex-start !important;
    gap: 10px;
    padding: 8px 8px 8px 6px;
    border: 0;
    background: transparent;
    border-radius: 6px;
    text-align: left;
    font-size: 13px;
    color: var(--lw-gray-graphite);
    cursor: pointer;
    transition: color 0.15s ease;
    font-family: inherit;
}

.aa-toc__item:hover[b-on3dikxex1] {
    color: var(--lw-text-primary);
}

.aa-toc__item.is-active[b-on3dikxex1] {
    font-weight: 600;
    color: var(--lw-text-primary);
}

.aa-toc__node[b-on3dikxex1] {
    position: relative;
    z-index: 1;
    flex-shrink: 0;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 20px;
    height: 20px;
    border-radius: 9999px;
    border: 2px solid var(--lw-border);
    background: var(--lw-white);
    font-size: 9px;
    font-weight: 700;
    font-variant-numeric: tabular-nums;
    line-height: 1;
    color: var(--lw-gray-graphite);
    transition: border-color 0.15s ease, background-color 0.15s ease;
}

.aa-toc__node.is-active[b-on3dikxex1] {
    border-color: var(--lw-primary-blue);
    color: var(--lw-primary-blue);
}

.aa-toc__node.is-read[b-on3dikxex1] {
    border-color: var(--lw-success-dark);
    background: var(--lw-success-dark);
    color: var(--lw-white);
}

.aa-toc__node.is-read[b-on3dikxex1]  .mud-icon-root {
    color: var(--lw-white) !important;
    width: 12px;
    height: 12px;
    font-size: 12px;
}

.aa-toc__dot[b-on3dikxex1] {
    width: 6px;
    height: 6px;
    border-radius: 9999px;
    background: var(--lw-primary-blue);
}

.aa-toc__item-label[b-on3dikxex1] {
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

/* ── Document body ── */
.aa-body[b-on3dikxex1] {
    min-width: 0;
}

/* ── Document masthead (preamble) ── */
.aa-preamble[b-on3dikxex1] {
    background: var(--lw-white);
    padding: 28px 32px 24px;
}

.aa-preamble__eyebrow[b-on3dikxex1] {
    margin: 0;
    font-size: 11px;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.16em;
    color: var(--lw-primary-blue);
}

.aa-preamble__title[b-on3dikxex1] {
    margin: 8px 0 0;
    font-family: var(--lw-font-family-heading, inherit);
    font-size: 24px;
    font-weight: 700;
    letter-spacing: -0.02em;
    line-height: 1.18;
    color: var(--lw-primary-dark);
}

.aa-preamble__rule[b-on3dikxex1] {
    display: block;
    width: 100%;
    height: 3px;
    margin: 16px 0 20px;
    border-radius: 2px;
    background: linear-gradient(90deg, var(--lw-primary-gold) 0%, var(--lw-primary-gold-dark) 100%);
}

.aa-preamble__intro[b-on3dikxex1] {
    margin: 0;
    font-size: 0.875rem;
    line-height: 1.7;
    color: var(--lw-text-primary);
}

.aa-preamble__intro strong[b-on3dikxex1] {
    font-weight: 700;
    color: var(--lw-primary-dark);
}

/* Populated party fill-in field (Founding Builder). */
.aa-party[b-on3dikxex1] {
    display: inline-block;
    min-width: 150px;
    font-weight: 600;
    color: var(--lw-primary-dark);
    padding: 0 4px 1px;
    border-bottom: 1px solid var(--lw-primary-dark);
}

/* ── Document meta row (Document / Effective Date / Nature) ── */
.aa-meta[b-on3dikxex1] {
    display: flex;
    gap: 32px;
    flex-wrap: wrap;
    margin-bottom: 20px;
    padding-bottom: 16px;
    border-bottom: 1px solid var(--lw-border);
}

.aa-meta__item[b-on3dikxex1] {
    display: flex;
    flex-direction: column;
    gap: 3px;
}

.aa-meta__label[b-on3dikxex1] {
    font-size: 10px;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.12em;
    color: var(--lw-gray-graphite);
}

.aa-meta__value[b-on3dikxex1] {
    font-size: 0.875rem;
    font-weight: 600;
    color: var(--lw-primary-dark);
}

/* ── Sections ── */
.aa-article[b-on3dikxex1] {
    padding: 24px 32px;
    scroll-margin-top: 16px;
    border-top: 1px solid var(--lw-border);
}

.aa-article__head[b-on3dikxex1] {
    display: flex;
    align-items: baseline;
    gap: 12px;
}

.aa-article__num[b-on3dikxex1] {
    font-size: 13px;
    font-weight: 700;
    font-variant-numeric: tabular-nums;
    color: var(--lw-primary-blue);
}

.aa-article__title[b-on3dikxex1] {
    font-size: 16px;
    font-weight: 700;
    color: var(--lw-text-primary);
    margin: 0;
    line-height: 1.3;
}

.aa-blocks[b-on3dikxex1] {
    margin-top: 12px;
    display: flex;
    flex-direction: column;
    gap: 10px;
}

.aa-block[b-on3dikxex1] {
    margin: 0;
    font-size: 0.875rem;
    line-height: 1.6;
    color: var(--lw-text-primary);
}

/* ── Bullets (What We'll Provide / What We Ask / Equity & Pricing) ── */
.aa-bullet[b-on3dikxex1] {
    display: flex;
    align-items: flex-start;
    gap: 12px;
}

.aa-bullet__dot[b-on3dikxex1] {
    flex-shrink: 0;
    width: 7px;
    height: 7px;
    border-radius: 2px;
    margin-top: 7px;
    background: var(--lw-primary-gold);
}

.aa-bullet__text[b-on3dikxex1] {
    margin: 0;
    font-size: 0.875rem;
    line-height: 1.6;
    color: var(--lw-text-primary);
}

.aa-bullet__text strong[b-on3dikxex1] {
    font-weight: 700;
    color: var(--lw-primary-dark);
}

/* ── Closing line ── */
.aa-closing__text[b-on3dikxex1] {
    margin: 0;
    font-size: 0.9375rem;
    font-weight: 600;
    line-height: 1.6;
    color: var(--lw-primary-dark);
}

/* ── Responsive ── */
@media (max-width: 1024px) {
    .aa-doc[b-on3dikxex1] {
        grid-template-columns: 1fr;
    }

    .aa-toc[b-on3dikxex1] {
        display: none;
    }

    .aa-preamble[b-on3dikxex1],
    .aa-article[b-on3dikxex1] {
        padding-left: 20px;
        padding-right: 20px;
    }
}
/* _content/Ledgerwise/Components/Shared/OnboardingCompletedView.razor.rz.scp.css */
/* OnboardingCompletedView -- mirrors ledgerwise-ui-app
   organisms/kickoff/vendor-intro-card.tsx `complete` state (measured from
   source 2026-07-19): success body "px-5 py-6" on the form surface; merged
   row "rounded-card border border-border bg-white px-4 py-3.5" flex gap-3.5;
   name 14/600 foreground; success Badge sm w/ 12px check; sub 12
   content-secondary mt-0.5. Check circle stands in for the reference's
   AvatarCircle logo slot. */

.obc-complete[b-jrh8ef66wg] {
    padding: 24px 20px;
}

@media (min-width: 768px) {
    .obc-complete[b-jrh8ef66wg] { padding: 24px; }
    .obc-row[b-jrh8ef66wg] { flex-wrap: nowrap; }
}

.obc-row[b-jrh8ef66wg] {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 14px;
    border: 1px solid var(--lw-border);
    border-radius: var(--lw-radius-card);
    background: var(--lw-white);
    padding: 14px 16px;
}

.obc-check[b-jrh8ef66wg] {
    flex-shrink: 0;
    width: 46px;
    height: 46px;
    border-radius: 50%;
    background: var(--lw-success-dark);
    color: #fff;
    display: inline-flex;
    align-items: center;
    justify-content: center;
}

.obc-check[b-jrh8ef66wg]  .mud-icon-root {
    width: 22px;
    height: 22px;
    font-size: 22px;
}

.obc-text[b-jrh8ef66wg] { min-width: 0; flex: 1; }

.obc-line[b-jrh8ef66wg] {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    column-gap: 8px;
    row-gap: 4px;
}

.obc-name[b-jrh8ef66wg] {
    margin: 0;
    font-size: 0.875rem;
    font-weight: 600;
    color: var(--lw-text-primary);
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

/* Reference Badge tone=success size=sm: h-5 px-1.5 text-10 bold uppercase
   tracking-wide leading-none rounded-sm. */
.obc-badge[b-jrh8ef66wg] {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    height: 20px;
    padding: 0 6px;
    border-radius: var(--lw-radius-control);
    background: var(--lw-status-success-bg);
    color: var(--lw-status-success-fg);
    font-size: 10px;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.025em;
    line-height: 1;
}

.obc-badge[b-jrh8ef66wg]  .mud-icon-root {
    width: 12px;
    height: 12px;
    font-size: 12px;
}

.obc-sub[b-jrh8ef66wg] {
    margin: 2px 0 0;
    font-size: 0.75rem;
    color: var(--lw-gray-graphite);
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}
/* _content/Ledgerwise/Components/Shared/OnboardingStepFooter.razor.rz.scp.css */
/* OnboardingStepFooter -- source: onboarding-footer.tsx + button.tsx
   size="action". Spec 2026-07-13: white, border-t --lw-border, pad 16/24;
   Back 40px outline; skip = underlined graphite; Continue 40px navy. */

.ob-step-footer[b-cj3vzu1rez] {
    position: fixed;
    left: var(--lw-wizard-rail-width);
    right: 0;
    bottom: 0;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    padding: 16px 24px;
    background: var(--lw-white);
    border-top: 1px solid var(--lw-border);
    z-index: 20;
}

.ob-step-footer__back[b-cj3vzu1rez] {
    display: flex;
    align-items: center;
    flex-shrink: 0;
}

.ob-step-footer__back-btn[b-cj3vzu1rez] {
    display: inline-flex;
    align-items: center;
    height: 40px;
    padding: 0 16px;
    border: 1px solid var(--lw-border);
    border-radius: var(--lw-radius-control);
    background: transparent;
    font-family: var(--lw-font-family);
    font-size: 14px;
    font-weight: 500;
    color: var(--lw-text-primary);
    text-decoration: none;
    transition: background-color 0.15s ease;
}

.ob-step-footer__back-btn:hover[b-cj3vzu1rez] {
    background-color: var(--lw-accent);
    color: var(--lw-text-primary);
    text-decoration: none;
}

.ob-step-footer__actions[b-cj3vzu1rez] {
    display: flex;
    align-items: center;
    gap: 12px;
    margin-left: auto;
}

.ob-step-footer__skip[b-cj3vzu1rez] {
    border: 0;
    background: none;
    padding: 0;
    cursor: pointer;
    font-family: var(--lw-font-family);
    font-size: 14px;
    font-weight: 500;
    color: var(--lw-gray-graphite);
    text-decoration: underline;
    transition: color 0.15s ease;
}

.ob-step-footer__skip:hover[b-cj3vzu1rez] {
    color: var(--lw-text-primary);
}

.ob-step-footer__primary[b-cj3vzu1rez] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    height: 40px;
    padding: 0 20px;
    border: 0;
    border-radius: var(--lw-radius-control);
    background: var(--lw-primary-dark);
    color: var(--lw-white);
    cursor: pointer;
    font-family: var(--lw-font-family);
    font-size: 14px;
    font-weight: 500;
    transition: background-color 0.15s ease;
}

.ob-step-footer__primary:hover:not(:disabled)[b-cj3vzu1rez] {
    background: var(--lw-primary-dark-hover);
}

.ob-step-footer__primary:disabled[b-cj3vzu1rez] {
    opacity: 0.55;
    cursor: default;
}

@media (max-width: 960px) {
    .ob-step-footer[b-cj3vzu1rez] {
        left: 0;
        padding: 16px;
    }
}
/* _content/Ledgerwise/Components/Shared/PageHeader.razor.rz.scp.css */
.lw-page-header[b-w330k5qder] {
    display: flex;
    flex-direction: column;
    gap: 1rem;
    justify-content: space-between;
}

@media (min-width: 640px) {
    .lw-page-header[b-w330k5qder] {
        flex-direction: row;
        align-items: center;
    }
}

.lw-page-header-text[b-w330k5qder] {
    min-width: 0;
}

/* Pre-redesign values (-0.01em / primary-dark / heading font) replaced with
   the shared page-title tokens (2026-07-12) so legacy PageHeader pages render
   the same title as migrated ones. */
.lw-page-header-title[b-w330k5qder] {
    font-size: var(--lw-title-size);
    font-weight: var(--lw-title-weight);
    letter-spacing: var(--lw-tracking-tight);
    color: var(--lw-title-color);
    margin: 0;
    font-family: var(--lw-font-family);
}

.lw-page-header-subtitle[b-w330k5qder] {
    font-size: 0.875rem;
    color: var(--lw-gray-graphite);
    margin: 0.25rem 0 0;
}

.lw-page-header-actions[b-w330k5qder] {
    display: flex;
    align-items: center;
    gap: var(--lw-spacing-sm);
    flex-shrink: 0;
}
/* _content/Ledgerwise/Components/Shared/PartyMemberRow.razor.rz.scp.css */
/* PartyMemberRow -- source: ledgerwise-app party-manager.tsx PartyRow, as
   translated by the AddProject team step (pw-member spec, 2026-07-24):
   hairline card row, 40px tinted initials avatar, 14/700 name + 11/600 badge
   pill over a 12px muted meta line; edit area separated by a hairline
   (borderless when the head is hidden). */

.lw-party-row[b-yytzr0izjg] {
    border: 1px solid var(--lw-border);
    border-radius: var(--lw-radius-card);
    background: var(--lw-white);
    overflow: hidden;
}

.lw-party-row__head[b-yytzr0izjg] {
    display: flex;
    align-items: flex-start;
    gap: 14px;
    padding: 16px;
}

.lw-party-row__avatar[b-yytzr0izjg] {
    flex-shrink: 0;
    width: 40px;
    height: 40px;
    border-radius: 50%;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    font-size: 13px;
    font-weight: 700;
}

.lw-party-row__avatar--builder[b-yytzr0izjg] {
    background: var(--lw-primary-dark);
    color: var(--lw-white);
}

.lw-party-row__avatar--pm[b-yytzr0izjg] {
    background: var(--lw-status-info-bg);
    color: var(--lw-primary-blue);
}

.lw-party-row__avatar--consultant[b-yytzr0izjg] {
    background: var(--lw-bg-secondary);
    color: var(--lw-gray-graphite);
}

.lw-party-row__text[b-yytzr0izjg] {
    min-width: 0;
    flex: 1;
}

.lw-party-row__line[b-yytzr0izjg] {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 8px;
}

.lw-party-row__name[b-yytzr0izjg] {
    font-size: 14px;
    font-weight: 700;
    color: var(--lw-text-primary);
}

.lw-party-row__badge[b-yytzr0izjg] {
    display: inline-flex;
    align-items: center;
    border-radius: 999px;
    padding: 1px 8px;
    font-size: 11px;
    font-weight: 600;
    background: var(--lw-bg-secondary);
    color: var(--lw-gray-graphite);
}

.lw-party-row__badge--accent[b-yytzr0izjg] {
    background: var(--lw-status-info-bg);
    color: var(--lw-primary-blue);
}

.lw-party-row__meta[b-yytzr0izjg] {
    margin: 2px 0 0;
    font-size: 12px;
    color: var(--lw-gray-graphite);
}

/* Trailing action cluster. Buttons come from the caller's fragment, so the
   chrome pierces via ::deep. Icon-only actions use the global
   lw-row-icon-btn recipe (ghost 32px, muted -> danger, reference PartyRow
   Trash2 ghost icon button) and are exempt from the link chrome below. */
.lw-party-row__actions[b-yytzr0izjg] {
    flex-shrink: 0;
    display: inline-flex;
    align-items: center;
    gap: 10px;
}

.lw-party-row__actions[b-yytzr0izjg]  button:not(.lw-row-icon-btn) {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    border: 0;
    background: transparent;
    padding: 0;
    cursor: pointer;
    font-family: inherit;
    font-size: 13px;
    font-weight: 500;
    color: var(--lw-primary-blue);
    transition: opacity 0.15s ease;
}

.lw-party-row__actions[b-yytzr0izjg]  button:not(.lw-row-icon-btn):hover {
    opacity: 0.8;
}

.lw-party-row__actions[b-yytzr0izjg]  button:not(.lw-row-icon-btn) .mud-icon-root {
    width: 14px;
    height: 14px;
    font-size: 14px;
    color: currentColor !important;
}

.lw-party-row__edit[b-yytzr0izjg] {
    display: flex;
    flex-direction: column;
    gap: 6px;
    border-top: 1px solid var(--lw-border);
    padding: 14px 16px;
}

/* Unassigned roles have no head row -- the select stands alone. */
.lw-party-row__edit--solo[b-yytzr0izjg] {
    border-top: 0;
}
/* _content/Ledgerwise/Components/Shared/ProjectAccountBalanceSummary.razor.rz.scp.css */
/* Project account balance card body (US-473).

   Balance figure, caption, and breakdown tooltip carried over verbatim from the
   measured po-trust / po-balance-tip rules they replace in ProjectOverview.razor.css
   (28px/700 -0.025em tabular figure; 12px caption; 300px navy tooltip) so the
   restyle changes structure, not type. Hardcoded --po-* aliases are resolved back
   to their underlying --lw-* tokens here.

   New in this component: the headline row (40px figure + above/below-minimum pill)
   and the hand-rolled info glyph and its navy tooltip. The BUDGET COMMITTED block
   moved to ProjectBudgetProgress when it became its own card. */

.lw-acctbal[b-o7i8fpc3za] {
    display: flex;
    flex-direction: column;
}

/* -- Headline: figure + pill -- */

.lw-acctbal__headline[b-o7i8fpc3za] {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 1rem;
    margin-top: 0.75rem;
}

.lw-acctbal__balance-wrap[b-o7i8fpc3za] {
    position: relative;
    display: inline-block;
    cursor: pointer;
    outline: none;
}

.lw-acctbal__balance-row[b-o7i8fpc3za] {
    display: flex;
    align-items: center;
    gap: 0.875rem;
}

/* -- Allocation ring --
   Shows how the current balance splits into committed / reserved / available. Rotated so
   the first arc starts at 12 o'clock. r=15.9155 makes the circumference exactly 100, so
   arc lengths are percentages directly.

   Colours come from the categorical chart ramp (--lw-chart-*), the same steps the Ledger
   tab's figures use, so a segment and its labelled number are never different colours.
   The ramp is validated rather than chosen -- see branding.css. An earlier revision
   borrowed semantic tokens instead and painted "reserved" in the app's warning colour;
   that is why the ramp exists. */
.lw-acctbal__donut[b-o7i8fpc3za] {
    width: 44px;
    height: 44px;
    flex-shrink: 0;
    transform: rotate(-90deg);
}

/* stroke-width is in viewBox units (40 wide), so 8 renders ~8.8px at the 44px size --
   thick enough for the three arcs to read as weights rather than hairlines. */
.lw-acctbal__donut circle[b-o7i8fpc3za] {
    fill: none;
    stroke-width: 8;
}

.lw-acctbal__donut-track[b-o7i8fpc3za] {
    stroke: var(--lw-border);
}

.lw-acctbal__donut-seg--committed[b-o7i8fpc3za] { stroke: var(--lw-chart-1); }
.lw-acctbal__donut-seg--reserved[b-o7i8fpc3za]  { stroke: var(--lw-chart-2); }
.lw-acctbal__donut-seg--available[b-o7i8fpc3za] { stroke: var(--lw-chart-3); }

/* Swatch in the tooltip: the only thing that maps an arc colour to its label, so the ring
   is decodable rather than decorative. */
.lw-acctbal__tip-swatch[b-o7i8fpc3za] {
    display: inline-block;
    width: 8px;
    height: 8px;
    border-radius: 2px;
    margin-right: 0.375rem;
    flex-shrink: 0;
}

.lw-acctbal__tip-swatch--committed[b-o7i8fpc3za] { background: var(--lw-chart-1); }
.lw-acctbal__tip-swatch--reserved[b-o7i8fpc3za]  { background: var(--lw-chart-2); }
.lw-acctbal__tip-swatch--available[b-o7i8fpc3za] { background: var(--lw-chart-3); }

.lw-acctbal__balance[b-o7i8fpc3za] {
    margin: 0;
    /* The balance is the card's hero -- 40px against the 11px micro-labels below
       is the whole hierarchy of this surface. */
    font-size: 2.5rem;
    font-weight: 700;
    line-height: 1;
    letter-spacing: -0.025em;
    font-variant-numeric: tabular-nums;
    transition: color 0.5s ease;
}

.lw-acctbal__balance--healthy[b-o7i8fpc3za] {
    color: var(--lw-success-dark);
}

.lw-acctbal__balance--unhealthy[b-o7i8fpc3za] {
    color: var(--lw-destructive);
}

.lw-acctbal__pill[b-o7i8fpc3za] {
    flex: 0 0 auto;
    display: inline-flex;
    margin-top: 0.125rem;
}

/* -- Caption -- */

.lw-acctbal__caption[b-o7i8fpc3za] {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 0 0.375rem;
    margin: 0.375rem 0 0 0;
    font-size: 0.75rem;
}

.lw-acctbal__caption-delta[b-o7i8fpc3za] {
    font-weight: 500;
}

.lw-acctbal__caption-delta--healthy[b-o7i8fpc3za] {
    color: var(--lw-success-dark);
}

.lw-acctbal__caption-delta--unhealthy[b-o7i8fpc3za] {
    color: var(--lw-destructive);
}

/* -- Breakdown tooltip (hover/focus) -- */
/* On-navy text and rules are expressed as white-alpha RELATIONSHIPS via color-mix
   (not resolved hex) per the token layer rule; same for the navy-tinted shadow. */

.lw-acctbal__tip[b-o7i8fpc3za] {
    position: absolute;
    z-index: 60;
    top: calc(100% + 8px);
    left: 0;
    width: 300px;
    max-width: 92vw;
    background: var(--lw-primary-dark);
    color: var(--lw-white);
    border-radius: var(--lw-radius-card);
    padding: 0.75rem 0.875rem;
    display: flex;
    flex-direction: column;
    gap: 0.375rem;
    text-align: left;
    visibility: hidden;
    opacity: 0;
    transform: translateY(4px);
    pointer-events: none;
    transition: opacity 0.15s ease, transform 0.15s ease, visibility 0.15s ease;
    box-shadow: 0 8px 24px color-mix(in srgb, var(--lw-primary-dark) 22%, transparent);
}

.lw-acctbal__balance-wrap:hover .lw-acctbal__tip[b-o7i8fpc3za],
.lw-acctbal__balance-wrap:focus-visible .lw-acctbal__tip[b-o7i8fpc3za],
.lw-acctbal__balance-wrap:focus-within .lw-acctbal__tip[b-o7i8fpc3za] {
    visibility: visible;
    opacity: 1;
    transform: translateY(0);
    pointer-events: auto;
}

.lw-acctbal__tip-title[b-o7i8fpc3za] {
    font-size: 0.625rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.06em;
    color: color-mix(in srgb, var(--lw-white) 60%, transparent);
}

.lw-acctbal__tip-row[b-o7i8fpc3za] {
    display: flex;
    align-items: baseline;
    justify-content: space-between;
    gap: 0.75rem;
    font-size: 0.75rem;
}

.lw-acctbal__tip-key[b-o7i8fpc3za] {
    color: color-mix(in srgb, var(--lw-white) 75%, transparent);
}

.lw-acctbal__tip-val[b-o7i8fpc3za] {
    font-variant-numeric: tabular-nums;
    font-weight: 600;
    white-space: nowrap;
}

/* Parts of the allocation sit indented under the Current balance total, each led by the
   swatch that maps it to an arc of the ring. There is no "minus" treatment any more:
   nothing in this tooltip is a deduction. */
.lw-acctbal__tip-key--part[b-o7i8fpc3za] {
    display: inline-flex;
    align-items: center;
    padding-left: 0.625rem;
}

.lw-acctbal__tip-divider[b-o7i8fpc3za] {
    height: 1px;
    background: color-mix(in srgb, var(--lw-white) 14%, transparent);
    margin: 0.125rem 0;
}

.lw-acctbal__tip-row--total .lw-acctbal__tip-key[b-o7i8fpc3za] {
    color: var(--lw-white);
    font-weight: 600;
}

.lw-acctbal__tip-row--total .lw-acctbal__tip-val[b-o7i8fpc3za] {
    font-size: 0.8125rem;
}

@media (max-width: 599px) {
    .lw-acctbal__headline[b-o7i8fpc3za] {
        gap: 0.625rem;
    }

    .lw-acctbal__balance[b-o7i8fpc3za] {
        font-size: 2rem;
    }


}

/* -- Info glyph + its tooltip --
   Hand-rolled so both live inside this scoped sheet. 12px glyph: large enough to
   hit, small enough to stay subordinate to the 12px caption beside it. */

.lw-acctbal__info[b-o7i8fpc3za] {
    position: relative;
    display: inline-flex;
    align-items: center;
    color: var(--lw-gray-space);
    cursor: help;
    outline: none;
    transition: color 120ms ease;
}

.lw-acctbal__info:hover[b-o7i8fpc3za],
.lw-acctbal__info:focus-visible[b-o7i8fpc3za] {
    color: var(--lw-gray-graphite);
}

.lw-acctbal__info-glyph[b-o7i8fpc3za] {
    width: 12px;
    height: 12px;
    display: block;
}

.lw-acctbal__info:focus-visible .lw-acctbal__info-glyph[b-o7i8fpc3za] {
    outline: 2px solid var(--lw-primary-blue);
    outline-offset: 2px;
    border-radius: 50%;
}

.lw-acctbal__info-tip[b-o7i8fpc3za] {
    position: absolute;
    z-index: 60;
    bottom: calc(100% + 8px);
    left: 50%;
    transform: translate(-50%, 4px);
    width: 17.5rem;
    max-width: 78vw;
    padding: 0.625rem 0.75rem;
    background: var(--lw-primary-dark);
    color: var(--lw-white);
    border-radius: var(--lw-radius-control);
    font-size: 0.75rem;
    font-weight: 400;
    line-height: 1.45;
    text-align: left;
    visibility: hidden;
    opacity: 0;
    pointer-events: none;
    transition: opacity 0.15s ease, transform 0.15s ease, visibility 0.15s ease;
    box-shadow: 0 8px 24px color-mix(in srgb, var(--lw-primary-dark) 22%, transparent);
}

.lw-acctbal__info:hover .lw-acctbal__info-tip[b-o7i8fpc3za],
.lw-acctbal__info:focus-visible .lw-acctbal__info-tip[b-o7i8fpc3za],
.lw-acctbal__info:focus-within .lw-acctbal__info-tip[b-o7i8fpc3za] {
    visibility: visible;
    opacity: 1;
    transform: translate(-50%, 0);
}
/* _content/Ledgerwise/Components/Shared/ProjectAvatarPicker.razor.rz.scp.css */
/* ProjectAvatarPicker -- source: ledgerwise-app create-step-identity.tsx +
   atoms/project-avatar.tsx (2026-07-24 spec, extracted from AddProject):
   124px rounded-card gradient tile (= 2 x 54px fields + 16px gap), 32/700
   initials label, 28px navy corner camera button, hover overlay with white
   32px adjust/remove round buttons. */

.lw-avatar-picker[b-iv1uz6sjrj] {
    position: relative;
    width: 124px;
}

.lw-avatar-picker__tile[b-iv1uz6sjrj] {
    position: relative;
    width: 124px;
    height: 124px;
    border-radius: var(--lw-radius-card);
    background: var(--lw-gradient-project-avatar);
    color: #fff;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    overflow: hidden;
    cursor: pointer;
}

.lw-avatar-picker__label[b-iv1uz6sjrj] {
    font-size: 32px;
    font-weight: 700;
    letter-spacing: -0.01em;
}

.lw-avatar-picker__label--icon[b-iv1uz6sjrj]  .mud-icon-root {
    width: 44px;
    height: 44px;
    font-size: 44px;
    color: rgba(255, 255, 255, 0.9) !important;
}

.lw-avatar-picker__img[b-iv1uz6sjrj] {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.lw-avatar-picker__cam[b-iv1uz6sjrj] {
    position: absolute;
    right: 6px;
    bottom: 6px;
    width: 28px;
    height: 28px;
    border-radius: 50%;
    background: var(--lw-primary-dark);
    display: inline-flex;
    align-items: center;
    justify-content: center;
    box-shadow: 0 1px 3px rgba(2, 11, 43, 0.3);
}

.lw-avatar-picker__cam[b-iv1uz6sjrj]  .mud-icon-root {
    width: 15px;
    height: 15px;
    font-size: 15px;
    color: #fff !important;
}

/* Hover overlay -- adjust/remove buttons over a darkened tile. */
.lw-avatar-picker__overlay[b-iv1uz6sjrj] {
    position: absolute;
    inset: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    border-radius: var(--lw-radius-card);
    background: transparent;
    opacity: 0;
    pointer-events: none;
    transition: opacity 0.15s ease, background-color 0.15s ease;
}

.lw-avatar-picker:hover .lw-avatar-picker__overlay[b-iv1uz6sjrj] {
    opacity: 1;
    pointer-events: auto;
    background: rgba(30, 30, 36, 0.4);
}

.lw-avatar-picker__btn[b-iv1uz6sjrj] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 32px;
    height: 32px;
    border: 0;
    border-radius: 50%;
    background: var(--lw-white);
    color: var(--lw-text-primary);
    cursor: pointer;
    box-shadow: var(--lw-shadow-sm);
}

.lw-avatar-picker__btn:hover[b-iv1uz6sjrj] {
    background: rgba(255, 255, 255, 0.9);
}

.lw-avatar-picker__btn--danger[b-iv1uz6sjrj] {
    color: var(--bs-danger, #d33);
}

.lw-avatar-picker__btn[b-iv1uz6sjrj]  .mud-icon-root {
    width: 16px;
    height: 16px;
    font-size: 16px;
    color: currentColor !important;
}
/* _content/Ledgerwise/Components/Shared/ProjectBudgetProgress.razor.rz.scp.css */
/* Budget utilization card body (US-473). Carried over from the budget block that briefly
   sat inside the account-balance card; now the card IS the surface, so there is no inner
   fill or border here. Measured from the reference mock's "BUDGET COMMITTED" block:
   micro-label 11px/600 uppercase +0.08em graphite, committed figure 15px/700 navy with
   the total in graphite. */

.lw-budprog[b-57qke7x38f] {
    display: flex;
    flex-direction: column;
    gap: 0.875rem;
}

.lw-budprog__head[b-57qke7x38f] {
    display: flex;
    align-items: baseline;
    justify-content: space-between;
    gap: 0.75rem;
}

.lw-budprog__label[b-57qke7x38f] {
    font-size: 0.6875rem;
    font-weight: 600;
    line-height: 1.2;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    color: var(--lw-gray-graphite);
}

.lw-budprog__figures[b-57qke7x38f] {
    display: inline-flex;
    align-items: baseline;
    gap: 0.25rem;
    font-variant-numeric: tabular-nums;
    white-space: nowrap;
}

.lw-budprog__committed[b-57qke7x38f] {
    font-size: 0.9375rem;
    font-weight: 700;
    letter-spacing: -0.01em;
    color: var(--lw-primary-dark);
}

.lw-budprog__of[b-57qke7x38f] {
    font-size: 0.8125rem;
    font-weight: 500;
    color: var(--lw-gray-graphite);
}

@media (max-width: 599px) {
    .lw-budprog__head[b-57qke7x38f] {
        flex-direction: column;
        align-items: flex-start;
        gap: 0.25rem;
    }
}
/* _content/Ledgerwise/Components/Shared/RichTextEditor.razor.rz.scp.css */
/* RichTextEditor -- source: ledgerwise-app send-proposal-stepper.tsx
   DescriptionEditor (2026-07-24 spec, extracted from AddProject):
   6px-radius input-border box, borderless 28px icon toolbar over a hairline,
   140px 14px/1.625 contenteditable body, focus border = primary. */

.lw-rte[b-agkdfr3cwc] {
    border: 1px solid var(--lw-input-border);
    border-radius: 6px;
    overflow: hidden;
    background: var(--lw-white);
    transition: border-color 0.15s ease;
}

.lw-rte:focus-within[b-agkdfr3cwc] {
    border-color: var(--lw-primary-dark);
}

.lw-rte__toolbar[b-agkdfr3cwc] {
    display: flex;
    align-items: center;
    gap: 4px;
    padding: 6px 8px;
    border-bottom: 1px solid var(--lw-border);
}

.lw-rte__btn[b-agkdfr3cwc] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 28px;
    height: 28px;
    border: 0;
    background: transparent;
    border-radius: 6px;
    cursor: pointer;
    color: var(--lw-gray-graphite);
    font-family: inherit;
    transition: background-color 0.15s ease, color 0.15s ease;
}

.lw-rte__btn:hover[b-agkdfr3cwc] {
    background: var(--lw-accent);
    color: var(--lw-text-primary);
}

.lw-rte__btn[b-agkdfr3cwc]  .mud-icon-root {
    width: 14px;
    height: 14px;
    font-size: 14px;
    color: currentColor !important;
}

.lw-rte__editor[b-agkdfr3cwc] {
    min-height: 140px;
    padding: 12px;
    font-size: 14px;
    line-height: 1.625;
    color: var(--lw-text-primary);
    outline: none;
}

.lw-rte__editor:empty[b-agkdfr3cwc]::before {
    content: attr(data-placeholder);
    color: var(--lw-gray-graphite);
}
/* _content/Ledgerwise/Components/Shared/RoundIconButton.razor.rz.scp.css */
.lw-icon-round[b-pt1zam42ii] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    border: none;
    border-radius: 9999px;
    background: none;
    color: var(--lw-gray-graphite);
    cursor: pointer;
    transition: background 0.15s ease, color 0.15s ease;
}

.lw-icon-round--sm[b-pt1zam42ii] {
    width: 28px;
    height: 28px;
}

.lw-icon-round--md[b-pt1zam42ii] {
    width: 32px;
    height: 32px;
}

.lw-icon-round--lg[b-pt1zam42ii] {
    width: 36px;
    height: 36px;
}

.lw-icon-round:hover[b-pt1zam42ii] {
    background: rgba(145, 158, 171, 0.16);
    color: var(--lw-text-primary);
}

.lw-icon-round__icon[b-pt1zam42ii] {
    font-size: 1.25rem;
}
/* _content/Ledgerwise/Components/Shared/SearchableDropdown.razor.rz.scp.css */
/* Searchable dropdown. Menu chrome per the reference dropdown recipe
   (ledgerwise-app ui/dropdown-menu + gc-invoice-table autocomplete,
   2026-07-20): popover on the shared menu shadow with 8px radius and py-1;
   option rows px-14 py-8 14px, hover bg-accent; the SELECTED row reads as a
   brand-accent 5% tint with medium weight -- never a filled primary bar. */

.searchable-dropdown[b-wcbyx8l7sf] {
    position: relative;
    width: 100%;
}

/* ---- FieldShell input chrome (atom-level; mirrors LwSelect.razor.css:
   54px white box, 8px radius, 14px Inter, rgba(145,158,171,.4) border,
   1px phantom focus, notched floating label). Moved up from per-consumer
   scoping 2026-07-23 -- every picker gets the canonical field. ---- */

.searchable-dropdown[b-wcbyx8l7sf]  .mud-input-control {
    margin-top: 0;
}

.searchable-dropdown[b-wcbyx8l7sf]  .mud-input-outlined {
    font-size: 14px;
    font-weight: 400;
    background-color: var(--lw-white);
    border-radius: var(--lw-radius-control);
}

.searchable-dropdown[b-wcbyx8l7sf]  .mud-input-outlined input.mud-input-slot {
    height: 54px;
    box-sizing: border-box;
    padding: 16px 14px;
    font-family: var(--lw-font-family);
    font-size: 14px;
    font-weight: 400;
    line-height: 22px;
}

.searchable-dropdown[b-wcbyx8l7sf]  input::placeholder {
    color: var(--lw-gray-space);
    opacity: 1;
}

.searchable-dropdown[b-wcbyx8l7sf]  .mud-input-outlined-border {
    border-color: var(--lw-input-border);
}

.searchable-dropdown[b-wcbyx8l7sf]  .mud-input.mud-input-outlined:not(.mud-disabled):not(:focus-within):hover .mud-input-outlined-border {
    border-color: var(--lw-input-border);
}

.searchable-dropdown[b-wcbyx8l7sf]  .mud-input.mud-input-outlined:focus-within > .mud-input-outlined-border {
    border-width: 1px;
    border-color: var(--lw-gray-phantom);
}

/* Label states (FieldShell): resting muted, floated graphite, focused
   phantom -- mirror Mud's own 4-class selectors. */
.searchable-dropdown[b-wcbyx8l7sf]  .mud-input-label {
    font-family: var(--lw-font-family);
    font-size: 14px;
    font-weight: 400;
    line-height: 22px;
    letter-spacing: normal;
    color: var(--lw-gray-space);
}

.searchable-dropdown[b-wcbyx8l7sf]  .mud-input-label-outlined {
    transform: translate(13px, 16px) scale(1);
    padding: 0 2px !important;
}

.searchable-dropdown[b-wcbyx8l7sf]  .mud-shrink ~ label.mud-input-label.mud-input-label-inputcontrol.mud-input-label-outlined,
.searchable-dropdown[b-wcbyx8l7sf]  .mud-input:focus-within ~ label.mud-input-label.mud-input-label-inputcontrol.mud-input-label-outlined {
    transform: translate(13px, -6px) scale(0.857);
}

.searchable-dropdown[b-wcbyx8l7sf]  .mud-shrink ~ label.mud-input-label.mud-input-label-inputcontrol.mud-input-label-outlined {
    color: var(--lw-gray-graphite);
}

.searchable-dropdown[b-wcbyx8l7sf]  .mud-input:focus-within ~ label.mud-input-label.mud-input-label-inputcontrol.mud-input-label-outlined {
    color: var(--lw-gray-phantom);
}

/* Trailing caret / clear: quiet 20px gray icons, no Material ripple halo. */
.searchable-dropdown[b-wcbyx8l7sf]  .mud-input-adornment .mud-icon-button,
.searchable-dropdown[b-wcbyx8l7sf]  .mud-input .mud-icon-button {
    width: 28px;
    height: 28px;
    padding: 0;
    background: transparent !important;
    color: var(--lw-gray-space);
}

.searchable-dropdown[b-wcbyx8l7sf]  .mud-input-adornment .mud-icon-button:hover {
    color: var(--lw-text-primary);
}

.searchable-dropdown[b-wcbyx8l7sf]  .mud-input-adornment .mud-icon-button .mud-icon-root {
    font-size: 20px;
    width: 20px;
    height: 20px;
}

.searchable-dropdown[b-wcbyx8l7sf]  .mud-icon-button .mud-ripple {
    display: none;
}

/* Reference PickerField panel structure: the OPTION LIST scrolls in its own
   region; the footer action sits after it, outside the scroller, so it never
   overlaps a row (2026-07-23). */
.searchable-dropdown[b-wcbyx8l7sf]  .searchable-dropdown-menu {
    position: absolute;
    top: 100%;
    left: 0;
    right: 0;
    display: flex;
    flex-direction: column;
    max-height: 300px;
    overflow: hidden;
    margin-top: 4px;
    z-index: 1050;
    border: 1px solid var(--lw-border);
    border-radius: var(--lw-radius-control);
    background: var(--lw-white);
    box-shadow: var(--lw-shadow-popover);
    padding: 4px 0 0;
}

.searchable-dropdown[b-wcbyx8l7sf]  .searchable-dropdown-menu .mud-list {
    flex: 1 1 auto;
    min-height: 0;
    overflow-y: auto;
}

/* Option rows: compact, quiet hover, no Mud ripple tint. */
.searchable-dropdown[b-wcbyx8l7sf]  .searchable-dropdown-menu .mud-list-item {
    padding: 8px 14px;
    min-height: 0;
    transition: background 0.12s ease;
}

.searchable-dropdown[b-wcbyx8l7sf]  .searchable-dropdown-menu .mud-list-item:hover {
    background: var(--lw-accent);
}

/* Item template typography (name over sub-line, tight leading). */
.searchable-dropdown[b-wcbyx8l7sf]  .searchable-dropdown-menu .mud-list-item .mud-typography-body2 {
    font-family: var(--lw-font-family);
    font-size: 14px;
    line-height: 20px;
    font-weight: var(--lw-font-medium);
    color: var(--lw-text-primary);
}

.searchable-dropdown[b-wcbyx8l7sf]  .searchable-dropdown-menu .mud-list-item .mud-typography-caption {
    font-family: var(--lw-font-family);
    font-size: 12px;
    line-height: 16px;
    color: var(--lw-gray-space);
}

/* Pinned footer action (reference create-fields.tsx PickerField footerAction):
   full-width hairline-topped row, 14px medium brand-accent, hover bg-accent.
   STICKY at the menu bottom so it stays visible while options scroll. */
.searchable-dropdown[b-wcbyx8l7sf]  .searchable-dropdown-footer {
    flex-shrink: 0;
    display: flex;
    align-items: center;
    gap: 8px;
    width: 100%;
    border: 0;
    border-top: 1px solid var(--lw-border);
    background: var(--lw-white);
    padding: 10px 12px;
    font-family: var(--lw-font-family);
    font-size: 14px;
    font-weight: var(--lw-font-medium);
    color: var(--lw-primary-blue);
    cursor: pointer;
    transition: background 0.12s ease;
}

/* Opaque hover: the translucent accent would let the scrolled rows show
   through the sticky footer. */
.searchable-dropdown[b-wcbyx8l7sf]  .searchable-dropdown-footer:hover {
    background: color-mix(in srgb, var(--lw-accent), var(--lw-white));
}

.searchable-dropdown[b-wcbyx8l7sf]  .searchable-dropdown-footer-icon.mud-icon-root {
    width: 16px;
    height: 16px;
    font-size: 16px;
}

/* Selected: brand-accent 5% tint; text keeps its normal colors. */
.searchable-dropdown[b-wcbyx8l7sf]  .mud-selected-item,
.searchable-dropdown[b-wcbyx8l7sf]  .mud-selected-item:hover {
    background-color: color-mix(in srgb, var(--lw-primary-blue) 5%, transparent);
}

.searchable-dropdown[b-wcbyx8l7sf]  .mud-selected-item .mud-typography-body2 {
    font-weight: var(--lw-font-semibold);
}
/* _content/Ledgerwise/Components/Shared/StatusChip.razor.rz.scp.css */
/* Source: ledgerwise-app ui/badge.tsx (size md): h-6, gap-1.5, px-1.5,
   text-[11px] font-bold uppercase, rounded-sm (= --radius-control 8px in the
   reference), tracking-wide (0.025em), leading-none; icon size-3.5 (14px). */
.lw-status-chip[b-rszv7ws4h3] {
    flex-shrink: 0;
    display: inline-flex;
    align-items: center;
    gap: 0.375rem;
    height: 24px;
    padding: 0 6px;
    border-radius: var(--lw-radius-control);
    font-size: 11px;
    font-weight: var(--lw-font-bold);
    text-transform: uppercase;
    letter-spacing: 0.025em;
    line-height: 1;
    justify-content: center;
    white-space: nowrap;
}

/* Size sm (reference ui/badge.tsx size sm, measured on the GC proposals RFP
   table 2026-07-23): h-5 (20px), px-1.5 (6px), text-[10px] font-bold
   uppercase, tracking-[0.25px]. */
.lw-status-chip--sm[b-rszv7ws4h3] {
    height: 20px;
    font-size: 10px;
    letter-spacing: 0.25px;
}

/* Fills a status column (list rows): stretch to the cell, left-align content,
   so column width is stable regardless of label length. */
.lw-status-chip--fullwidth[b-rszv7ws4h3] {
    display: flex;
    width: 100%;
    justify-content: flex-start;
}

/* Icon = reference size-3.5 (14px). MudIcon defaults to Size.Medium (24px).
   MudIcon is a CHILD COMPONENT, so its <svg> does NOT carry this file's scope
   attribute -- a plain scoped rule never matches it. ::deep pierces the
   boundary; adding .mud-icon-root out-specifics Mud's .mud-icon-size-medium. */
.lw-status-chip[b-rszv7ws4h3]  .lw-status-chip-icon.mud-icon-root {
    font-size: 14px;
    width: 14px;
    height: 14px;
}

.lw-status-chip--success[b-rszv7ws4h3] {
    background: var(--lw-status-success-bg);
    color: var(--lw-status-success-fg);
}

.lw-status-chip--warning[b-rszv7ws4h3] {
    background: var(--lw-status-warning-bg);
    color: var(--lw-status-warning-fg);
}

.lw-status-chip--error[b-rszv7ws4h3] {
    background: var(--lw-status-error-bg);
    color: var(--lw-status-error-fg);
}

.lw-status-chip--info[b-rszv7ws4h3] {
    background: var(--lw-status-info-bg);
    color: var(--lw-status-info-fg);
}

.lw-status-chip--primary[b-rszv7ws4h3] {
    background: var(--lw-status-primary-bg);
    color: var(--lw-status-primary-fg);
}

.lw-status-chip--neutral[b-rszv7ws4h3] {
    background: var(--lw-status-neutral-bg);
    color: var(--lw-status-neutral-fg);
}

.lw-status-chip--secondary[b-rszv7ws4h3] {
    background: var(--lw-status-secondary-bg);
    color: var(--lw-status-secondary-fg);
}

.lw-status-chip--accent[b-rszv7ws4h3] {
    background: var(--lw-status-accent-bg);
    color: var(--lw-status-accent-fg);
}
/* _content/Ledgerwise/Components/Shared/StatusDot.razor.rz.scp.css */
.lw-status-dot[b-sq9xb6btdn] {
    display: inline-block;
    flex-shrink: 0;
}

.lw-status-dot--xs[b-sq9xb6btdn] {
    width: 6px;
    height: 6px;
}

.lw-status-dot--sm[b-sq9xb6btdn] {
    width: 8px;
    height: 8px;
}

.lw-status-dot--md[b-sq9xb6btdn] {
    width: 10px;
    height: 10px;
}

.lw-status-dot--round[b-sq9xb6btdn] {
    border-radius: 9999px;
}

.lw-status-dot--square[b-sq9xb6btdn] {
    border-radius: 2px;
}

.lw-status-dot--bordered[b-sq9xb6btdn] {
    box-shadow: 0 0 0 1px var(--lw-white);
}

.lw-status-dot--accent[b-sq9xb6btdn] {
    background: var(--lw-primary-blue);
}

.lw-status-dot--online[b-sq9xb6btdn] {
    background: var(--lw-indicator-online);
}

.lw-status-dot--success[b-sq9xb6btdn] {
    background: var(--lw-success-dark);
}

.lw-status-dot--warning[b-sq9xb6btdn] {
    background: var(--lw-primary-gold-dark);
}

/* Reference StatusDot tone="gold" (brand gold swatch, e.g. budget legend). */
.lw-status-dot--gold[b-sq9xb6btdn] {
    background: var(--lw-primary-gold);
}

.lw-status-dot--muted[b-sq9xb6btdn] {
    background: var(--lw-gray-smoke);
}

.lw-status-dot--primary[b-sq9xb6btdn] {
    background: var(--lw-primary-dark);
}

.lw-status-dot--destructive[b-sq9xb6btdn] {
    /* Reference bg-destructive (solid #B83530), not the darker error-text fg. */
    background: var(--lw-destructive);
}
/* _content/Ledgerwise/Components/Shared/VendorBankConnectionPanel.razor.rz.scp.css */
/* Bank-connection panel body: same stack rhythm as the dialog section it was
   extracted from (EditVendorDialog "Modern Treasury Payment Account"). */
.vbc[b-keevvcstf6] {
    display: flex;
    flex-direction: column;
    gap: 12px;
}

.vbc-hint[b-keevvcstf6] {
    margin: 0;
    font-size: 12px;
    line-height: 1.5;
    color: var(--lw-gray-graphite);
}

.vbc-hint strong[b-keevvcstf6] {
    color: var(--lw-text-primary);
    font-weight: var(--lw-font-semibold);
}

/* Connected payout accounts. */
.vbc-account-list[b-keevvcstf6] {
    display: flex;
    flex-direction: column;
    gap: 8px;
}

.vbc-account-row[b-keevvcstf6] {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 10px 12px;
    border: 1px solid var(--lw-border);
    border-radius: var(--lw-radius-control);
}

.vbc-account-row[b-keevvcstf6]  .mud-icon-root {
    color: var(--lw-gray-graphite);
    flex-shrink: 0;
}

.vbc-account-id[b-keevvcstf6] {
    display: flex;
    flex-direction: column;
    gap: 1px;
    min-width: 0;
    flex: 1;
}

.vbc-account-name[b-keevvcstf6] {
    font-size: 14px;
    font-weight: var(--lw-font-medium);
    color: var(--lw-text-primary);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.vbc-account-sub[b-keevvcstf6] {
    font-size: 12px;
    color: var(--lw-gray-graphite);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

/* Linked bank details read-out. */
.vbc-bank-details[b-keevvcstf6] {
    display: flex;
    flex-direction: column;
    gap: 4px;
}

.vbc-bank-details p[b-keevvcstf6] {
    margin: 0;
    font-size: 14px;
    color: var(--lw-text-primary);
}

.vbc-bank-details strong[b-keevvcstf6] {
    font-weight: var(--lw-font-semibold);
}

/* Inline action row + busy note (MT link flow). */
.vbc-inline-actions[b-keevvcstf6] {
    display: flex;
    align-items: center;
    gap: 8px;
}

.vbc-busy-note[b-keevvcstf6] {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 12px 16px;
    border: 1px solid var(--lw-border);
    border-radius: var(--lw-radius-card);
    background: var(--lw-status-info-bg);
    font-size: 14px;
    color: var(--lw-text-primary);
}
/* _content/Ledgerwise/Components/Shared/VisibilityBadgeMenu.razor.rz.scp.css */
/* ── Inline visibility badge + "Visible To" popover ──────────────────────
   The popover ChildContent is portaled by MudPopover, but scoped CSS still
   reaches it because the Razor scope attribute is baked onto the elements at
   compile time. ::deep is used where the styled element is rendered by a
   MudBlazor component (StatusChip, MudIcon, MudCheckBox) rather than by us. */

.lw-vis-trigger[b-ip4or0z9i9] {
    display: inline-flex;
    cursor: pointer;
}

.lw-vis-trigger--static[b-ip4or0z9i9] {
    cursor: default;
    pointer-events: none;
}

/* Make the status chip read as an interactive control. */
.lw-vis-trigger[b-ip4or0z9i9]  .lw-status-chip {
    gap: 0.25rem;
    cursor: pointer;
    transition: filter 0.15s ease;
}

.lw-vis-trigger:hover[b-ip4or0z9i9]  .lw-status-chip {
    filter: brightness(0.96);
}

.lw-vis-trigger[b-ip4or0z9i9]  .lw-vis-caret {
    width: 0.95rem !important;
    height: 0.95rem !important;
    margin-right: -0.125rem;
}

/* ── Popover body ── */
.lw-vis-menu[b-ip4or0z9i9] {
    min-width: 188px;
    padding: 0.25rem;
}

.lw-vis-menu-header[b-ip4or0z9i9] {
    padding: 0.375rem 0.5rem 0.25rem;
    font-size: 11px;
    font-weight: var(--lw-font-bold, 700);
    text-transform: uppercase;
    letter-spacing: 0.04em;
    color: var(--lw-gray-graphite, #6E7180);
}

.lw-vis-row[b-ip4or0z9i9] {
    border-radius: var(--lw-radius-control, 8px);
    transition: background-color 0.15s ease;
}

.lw-vis-row:hover[b-ip4or0z9i9] {
    background-color: var(--lw-bg-secondary, #EEF0F4);
}

/* Stretch the checkbox across the row so the whole label is clickable. */
.lw-vis-row[b-ip4or0z9i9]  .lw-vis-check {
    width: 100%;
    margin: 0;
    padding: 0.125rem 0.5rem 0.125rem 0.25rem;
}

.lw-vis-row[b-ip4or0z9i9]  .lw-vis-check .mud-checkbox {
    width: 100%;
}

.lw-vis-menu-note[b-ip4or0z9i9] {
    margin-top: 0.25rem;
    padding: 0.375rem 0.5rem 0.25rem;
    border-top: 1px solid var(--lw-border);
    font-size: 11px;
    line-height: 1.35;
    color: var(--lw-gray-graphite, #6E7180);
}
/* _content/Ledgerwise/Components/Shared/WizardTopBar.razor.rz.scp.css */
/* WizardTopBar -- source: ledgerwise-app top-bar.tsx inside the wizard
   portals. Spec 2026-07-24: 56px, bg white, border-b hairline, px 24;
   crumbs 14px/22px, gap 16, root = foreground (hover graphite), chevron and
   current = muted; account chip behind a left hairline, initials avatar 28px. */

.wtb[b-2ed9sgd4cr] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    flex-shrink: 0;
    height: 56px;
    padding: 0 24px;
    background: var(--lw-white);
    border-bottom: 1px solid var(--lw-border);
}

.wtb__crumbs[b-2ed9sgd4cr] {
    display: flex;
    align-items: center;
    gap: 16px;
    font-size: 14px;
    line-height: 22px;
}

.wtb__root[b-2ed9sgd4cr] {
    border: 0;
    background: transparent;
    padding: 0;
    cursor: pointer;
    font-family: inherit;
    font-size: 14px;
    line-height: 22px;
    color: var(--lw-text-primary);
    transition: color 0.15s ease;
}

.wtb__root:hover[b-2ed9sgd4cr] {
    color: var(--lw-gray-graphite);
}

.wtb__sep[b-2ed9sgd4cr] {
    color: var(--lw-gray-space);
    flex-shrink: 0;
}

.wtb__current[b-2ed9sgd4cr] {
    color: var(--lw-gray-space);
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    max-width: 300px;
}

.wtb__account[b-2ed9sgd4cr] {
    display: flex;
    align-items: center;
    gap: 8px;
    padding-left: 12px;
    border-left: 1px solid var(--lw-border);
}

.wtb__avatar[b-2ed9sgd4cr] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 28px;
    height: 28px;
    border-radius: 50%;
    background: var(--lw-primary-blue);
    color: var(--lw-primary-blue-fg);
    font-size: 11px;
    font-weight: 700;
}

.wtb__name[b-2ed9sgd4cr] {
    font-size: 14px;
    font-weight: 500;
    color: var(--lw-text-primary);
}

@media (max-width: 860px) {
    .wtb[b-2ed9sgd4cr] {
        display: none;
    }
}