/* _content/ReflowUk.Web/Components/Layout/BlankLayout.razor.rz.scp.css */
/* Full-viewport wrapper for the chrome-less pre-auth entry. No sidebar/top-row means the
   page owns the whole viewport; give it a sensible min-height and padding so the branded
   sign-in card sits comfortably rather than flush against the window edges. */
.rf-blank[b-furjagfupf] {
    box-sizing: border-box;
    min-height: 100vh;
    min-height: 100dvh;
    padding: 1.5rem;
}
/* _content/ReflowUk.Web/Components/Layout/MainLayout.razor.rz.scp.css */
.page[b-kc3f0taohq] {
    position: relative;
    display: flex;
    flex-direction: column;
    min-height: 100vh;
    background: var(--rz-surface-muted);
    color: var(--rz-navy);
}

main[b-kc3f0taohq] {
    flex: 1;
}

.sidebar[b-kc3f0taohq] {
    /* Uses the numbered navy tokens (never remapped by the dark theme) so the sidebar
       keeps its navy gradient in both light and dark, matching the approved direction. */
    background: linear-gradient(180deg, var(--rz-navy-800) 0%, var(--rz-navy-700) 100%);
    border-right: 1px solid rgba(255, 255, 255, 0.08);
}

.top-row[b-kc3f0taohq] {
    background-color: rgba(255, 255, 255, 0.92);
    border-bottom: 1px solid var(--rz-border);
    justify-content: flex-end;
    height: 3.5rem;
    display: flex;
    align-items: center;
    gap: 1rem;
    color: var(--rz-copy-muted);
    font-size: 0.875rem;
}

.top-row.az-topbar[b-kc3f0taohq] {
    background: var(--rz-surface);
    gap: 0.6rem;
    justify-content: flex-start;
}

.az-topbar-spacer[b-kc3f0taohq] {
    flex: 1;
}

.az-crumb[b-kc3f0taohq] {
    color: var(--rz-ink);
    font-family: Sora, Manrope, ui-sans-serif, system-ui, sans-serif;
    font-weight: 600;
    font-size: 0.9rem;
}

.az-crumb span[b-kc3f0taohq] {
    color: var(--rz-copy-muted);
    font-weight: 500;
}

.az-persona[b-kc3f0taohq] {
    align-items: center;
    display: flex;
    gap: 0.5rem;
}

.az-persona-av[b-kc3f0taohq] {
    align-items: center;
    background: var(--rz-teal);
    border-radius: 8px;
    color: var(--rz-on-teal, #062019);
    display: grid;
    flex: none;
    font-size: 0.72rem;
    font-weight: 800;
    height: 1.9rem;
    place-items: center;
    width: 1.9rem;
}

.az-persona-who[b-kc3f0taohq] {
    display: none;
    line-height: 1.2;
}

.az-persona-who b[b-kc3f0taohq] {
    color: var(--rz-ink);
    display: block;
    font-size: 0.78rem;
    font-weight: 600;
}

.az-persona-who span[b-kc3f0taohq] {
    color: var(--rz-copy-muted);
    font-size: 0.7rem;
}

.az-envchip[b-kc3f0taohq] {
    align-items: center;
    background: var(--rz-surface-2);
    border: 1px solid var(--rz-border);
    border-radius: 999px;
    color: var(--rz-copy-muted);
    display: inline-flex;
    font-size: 0.75rem;
    gap: 0.4rem;
    height: 1.9rem;
    padding: 0 0.7rem;
    white-space: nowrap;
}

.az-envchip-dot[b-kc3f0taohq] {
    border-radius: 50%;
    height: 7px;
    width: 7px;
}

.az-envchip-dot.ok[b-kc3f0taohq] {
    background: var(--rz-good);
}

.az-envchip-dot.warn[b-kc3f0taohq] {
    background: var(--rz-warn);
}

.az-iconbtn[b-kc3f0taohq] {
    align-items: center;
    background: var(--rz-surface-2);
    border: 1px solid var(--rz-border);
    border-radius: 9px;
    color: var(--rz-copy-muted);
    cursor: pointer;
    display: grid;
    height: 2.1rem;
    place-items: center;
    width: 2.1rem;
}

.az-iconbtn:hover[b-kc3f0taohq] {
    border-color: var(--rz-border-strong);
    color: var(--rz-ink);
}

.az-signout[b-kc3f0taohq] {
    align-items: center;
    background: var(--rz-surface-2);
    border: 1px solid var(--rz-border);
    border-radius: 999px;
    color: var(--rz-copy-muted);
    cursor: pointer;
    display: inline-flex;
    font-size: 0.75rem;
    gap: 0.35rem;
    height: 1.9rem;
    padding: 0 0.7rem;
    text-decoration: none;
    white-space: nowrap;
}

.az-signout:hover[b-kc3f0taohq] {
    border-color: var(--rz-border-strong);
    color: var(--rz-ink);
}

.az-signout-label[b-kc3f0taohq] {
    display: none;
}

@media (min-width: 641px) {
    .az-signout-label[b-kc3f0taohq] {
        display: inline;
    }
}

@media (min-width: 641px) {
    .az-persona-who[b-kc3f0taohq] {
        display: block;
    }
}

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

    .top-row[b-kc3f0taohq]  a:hover, .top-row[b-kc3f0taohq]  .btn-link:hover {
        color: var(--rz-teal-text);
        text-decoration: none;
    }

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

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

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

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

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

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

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

    .top-row[b-kc3f0taohq], article[b-kc3f0taohq] {
        padding-left: 2rem !important;
        padding-right: 1.5rem !important;
    }
}

#blazor-error-ui[b-kc3f0taohq] {
    background: #fff4d6;
    bottom: 0;
    box-shadow: 0 -1px 2px rgba(0, 0, 0, 0.2);
    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-kc3f0taohq] {
        cursor: pointer;
        position: absolute;
        right: 0.75rem;
        top: 0.5rem;
    }
/* _content/ReflowUk.Web/Components/Layout/NavMenu.razor.rz.scp.css */
.navbar-toggler[b-aqhzzyg7h4] {
    appearance: none;
    cursor: pointer;
    width: 3.5rem;
    height: 2.5rem;
    color: white;
    position: absolute;
    top: 0.5rem;
    right: 1rem;
    border: 1px solid rgba(255, 255, 255, 0.18);
    border-radius: 4px;
    background: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 30 30'%3e%3cpath stroke='rgba%28255, 255, 255, 0.74%29' stroke-linecap='round' stroke-miterlimit='10' stroke-width='2' d='M4 7h22M4 15h22M4 23h22'/%3e%3c/svg%3e") no-repeat center/1.75rem rgba(255, 255, 255, 0.08);
}

.navbar-toggler[aria-expanded="true"][b-aqhzzyg7h4] {
    background-color: rgba(255, 255, 255, 0.5);
}

.top-row[b-aqhzzyg7h4] {
    height: 3.5rem;
    background-color: rgba(0, 0, 0, 0.18);
}

.navbar-brand[b-aqhzzyg7h4] {
    font-size: 1rem;
    font-weight: 700;
    letter-spacing: 0;
}

/* Inline stroke-style nav icons (currentColor, 17px) matching the approved admin mockup. The fixed,
   non-shrinking basis keeps a wrapping two-line label (e.g. "Finance & compliance", "Organisation
   governance") from squeezing or displacing the glyph. */
.nav-ico[b-aqhzzyg7h4] {
    flex: 0 0 17px;
    width: 17px;
    height: 17px;
    margin-right: 0.75rem;
    opacity: 0.85;
}

.nav-item[b-aqhzzyg7h4]  a.active .nav-ico,
.nav-item[b-aqhzzyg7h4]  .nav-link:hover .nav-ico {
    opacity: 1;
}

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

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

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

.nav-section-label[b-aqhzzyg7h4] {
    color: rgba(255, 255, 255, 0.50);
    font-size: 0.68rem;
    font-weight: 800;
    letter-spacing: 0;
    margin-top: 1rem;
    text-transform: uppercase;
}

    .nav-item[b-aqhzzyg7h4]  .nav-link {
        color: rgba(255, 255, 255, 0.76);
        background: none;
        border: none;
        border-radius: 4px;
        /* G5-M2: use a min-height with natural, wrapping height + compact line-height and vertical
           padding instead of a fixed 3rem height/line-height, so multi-word labels grow their own row
           downwards rather than overflowing and colliding with the adjacent navigation rows. */
        min-height: 3rem;
        display: flex;
        align-items: center;
        line-height: 1.25;
        padding-top: 0.5rem;
        padding-bottom: 0.5rem;
        width: 100%;
    }

.nav-item[b-aqhzzyg7h4]  a.active {
    background-color: rgba(62, 207, 170, 0.18);
    color: #ffffff;
}

.nav-item[b-aqhzzyg7h4]  .nav-link:hover {
    background-color: rgba(255,255,255,0.08);
    color: white;
}

.nav-scrollable[b-aqhzzyg7h4] {
    display: none;
}

/* G5-M3: disclosure state is now driven by the real <button> toggler (aria-expanded) via nav-menu.js,
   which adds .nav-open, rather than an adjacent checkbox :checked selector. */
.nav-scrollable.nav-open[b-aqhzzyg7h4] {
    display: block;
}

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

    .nav-scrollable[b-aqhzzyg7h4] {
        /* Never collapse the sidebar for wide screens */
        display: block;

        /* Allow sidebar to scroll for tall menus */
        height: calc(100vh - 3.5rem);
        overflow-y: auto;
    }
}
/* _content/ReflowUk.Web/Components/Pages/Customer/Accounts.razor.rz.scp.css */
/* Panel helpers used in this page's own markup, scoped by Blazor CSS isolation. */
.field-hint[b-7lqa1ekmdf] {
    color: var(--rz-copy-muted);
    font-size: 0.8125rem;
    line-height: 1.45;
    margin: 0.1rem 0 0.5rem;
}

.panel-subheading[b-7lqa1ekmdf] {
    color: var(--rz-navy);
    font-size: 0.95rem;
    font-weight: 700;
    margin: 1rem 0 0.5rem;
}

.button-primary[b-7lqa1ekmdf] {
    background: var(--rz-teal);
    border: none;
    border-radius: 7px;
    color: #062019;
    cursor: pointer;
    display: inline-block;
    font-size: 0.9rem;
    font-weight: 700;
    padding: 0.55rem 1.1rem;
    text-decoration: none;
}

.button-primary:hover[b-7lqa1ekmdf] {
    background: var(--rz-teal-hover);
}
/* _content/ReflowUk.Web/Components/Pages/Customer/Connect.razor.rz.scp.css */
/* Customer bank picker (reflow). Tiles reference the app --rz tokens so light/dark follow the shell; the teal
   accents match the branded dashboard. */
.bp-page[b-adv58r4dcc] {
    --teal: #3ecfaa;
    --teal-700: #177a60;
    --navy: #1e2060;
}

.bp-head[b-adv58r4dcc] {
    align-items: flex-end;
    display: flex;
    flex-wrap: wrap;
    gap: 12px 16px;
    margin-bottom: 20px;
}

.bp-head > div[b-adv58r4dcc] {
    flex: 1;
    min-width: 240px;
}

.bp-head h1[b-adv58r4dcc] {
    color: var(--rz-ink);
    font-family: Sora, Manrope, ui-sans-serif, system-ui, sans-serif;
    font-size: 24px;
    font-weight: 700;
    letter-spacing: -0.02em;
    line-height: 1.1;
}

.bp-head .workspace-copy[b-adv58r4dcc] {
    color: var(--rz-copy-muted);
    font-size: 14px;
    margin-top: 5px;
    max-width: 60ch;
}

.bp-back[b-adv58r4dcc] {
    align-items: center;
    border: 1px solid var(--rz-border);
    border-radius: 10px;
    color: var(--rz-ink);
    display: inline-flex;
    font-size: 13px;
    font-weight: 600;
    gap: 8px;
    height: 40px;
    padding: 0 14px;
    text-decoration: none;
}

.bp-back:hover[b-adv58r4dcc] {
    border-color: var(--teal);
    color: var(--teal-700);
}

.bp-lede[b-adv58r4dcc] {
    color: var(--rz-copy-muted);
    font-family: Sora, Manrope, ui-sans-serif, system-ui, sans-serif;
    font-size: 12px;
    font-weight: 700;
    letter-spacing: 0.08em;
    margin-bottom: 12px;
    text-transform: uppercase;
}

.bp-list[b-adv58r4dcc] {
    display: grid;
    gap: 14px;
    max-width: 560px;
}

.bp-tile[b-adv58r4dcc] {
    align-items: center;
    background: var(--rz-surface);
    border: 1px solid var(--rz-border);
    border-radius: 14px;
    box-shadow: var(--rz-shadow-card, var(--rz-shadow-lg));
    cursor: pointer;
    display: flex;
    gap: 16px;
    padding: 18px 20px;
    text-align: left;
    transition: transform 0.16s cubic-bezier(0.34, 1.56, 0.64, 1), border-color 0.16s, box-shadow 0.16s;
    width: 100%;
}

.bp-tile:hover:not(:disabled)[b-adv58r4dcc] {
    border-color: var(--teal);
    box-shadow: 0 10px 26px rgba(30, 32, 96, 0.14);
    transform: translateY(-2px);
}

.bp-tile:disabled[b-adv58r4dcc] {
    cursor: default;
    opacity: 0.65;
}

.bp-mono[b-adv58r4dcc] {
    align-items: center;
    border-radius: 12px;
    color: #fff;
    display: grid;
    flex: none;
    font-family: Sora, Manrope, ui-sans-serif, system-ui, sans-serif;
    font-size: 15px;
    font-weight: 700;
    height: 48px;
    justify-items: center;
    width: 48px;
}

/* Real brand-logo tile (drop-in SVG at /bank-logos/{connectorKey}.svg). The SVG is a full 48x48 rounded brand tile,
   so the chip just holds it edge-to-edge; falls back to .bp-mono when no asset exists for the key. */
.bp-logo-chip[b-adv58r4dcc] {
    background: transparent;
    overflow: hidden;
    padding: 0;
}

.bp-logo[b-adv58r4dcc] {
    display: block;
    height: 48px;
    width: 48px;
}

.bp-nm[b-adv58r4dcc] {
    display: flex;
    flex: 1;
    flex-direction: column;
    gap: 2px;
    min-width: 0;
}

.bp-nm b[b-adv58r4dcc] {
    color: var(--rz-ink);
    font-size: 15.5px;
    font-weight: 600;
}

.bp-sub[b-adv58r4dcc] {
    color: var(--teal-700);
    font-size: 12.5px;
    font-weight: 600;
}

.bp-hint[b-adv58r4dcc] {
    color: var(--rz-copy-muted);
    font-size: 12px;
}

.bp-go[b-adv58r4dcc] {
    align-items: center;
    color: var(--rz-ink);
    display: inline-flex;
    flex: none;
    font-family: Sora, Manrope, ui-sans-serif, system-ui, sans-serif;
    font-size: 13.5px;
    font-weight: 700;
    gap: 7px;
}

.bp-tile:hover:not(:disabled) .bp-go[b-adv58r4dcc] {
    color: var(--teal-700);
}

.bp-spin[b-adv58r4dcc] {
    animation: bp-spin-b-adv58r4dcc 0.7s linear infinite;
    border: 2px solid rgba(62, 207, 170, 0.3);
    border-radius: 50%;
    border-top-color: var(--teal);
    flex: none;
    height: 18px;
    width: 18px;
}

@keyframes bp-spin-b-adv58r4dcc {
    to {
        transform: rotate(360deg);
    }
}

.bp-foot[b-adv58r4dcc] {
    align-items: center;
    color: var(--rz-copy-muted);
    display: flex;
    font-size: 12.5px;
    gap: 8px;
    margin-top: 20px;
}

.bp-foot svg[b-adv58r4dcc] {
    color: var(--teal-700);
    flex: none;
}

@media (prefers-reduced-motion: reduce) {
    .bp-tile[b-adv58r4dcc] {
        transition: none;
    }

    .bp-spin[b-adv58r4dcc] {
        animation-duration: 1.4s;
    }
}
/* _content/ReflowUk.Web/Components/Pages/Customer/Consents.razor.rz.scp.css */
/* Customer form + panel helpers that are used in this page's own markup (not inside kit components), so
   Blazor CSS isolation scopes them correctly. These classes render unstyled from the shared stylesheet. */
.field-hint[b-qxku7g009o] {
    color: var(--rz-copy-muted);
    font-size: 0.8125rem;
    line-height: 1.45;
    margin: 0.15rem 0 0.75rem;
}

.button-primary[b-qxku7g009o] {
    background: var(--rz-teal);
    border: none;
    border-radius: 7px;
    color: #062019;
    cursor: pointer;
    font-size: 0.9rem;
    font-weight: 700;
    padding: 0.55rem 1.1rem;
}

.button-primary:hover:not(:disabled)[b-qxku7g009o] {
    background: var(--rz-teal-hover);
}

.button-primary:disabled[b-qxku7g009o] {
    cursor: not-allowed;
    opacity: 0.55;
}

.danger-action[b-qxku7g009o] {
    border-color: rgba(204, 63, 56, 0.45);
    color: #b0322c;
}

.danger-action:hover:not(:disabled)[b-qxku7g009o] {
    background: rgba(204, 63, 56, 0.08);
}
/* _content/ReflowUk.Web/Components/Pages/Customer/Dashboard.razor.rz.scp.css */
/* Branded customer dashboard (ported from the approved reflow mockup). Surfaces reference the app's
   --rz tokens so light/dark follow the shell theme; the teal accents and the navy connect panel are
   fixed brand elements in both themes, matching the mockup. */
.rf-dash[b-np637vgne1] {
    --teal: #3ecfaa;
    --teal-700: #177a60;
    --navy: #1e2060;
}

.rf-phead[b-np637vgne1] {
    align-items: flex-end;
    display: flex;
    flex-wrap: wrap;
    gap: 12px 16px;
    margin-bottom: 22px;
}

.rf-phead h1[b-np637vgne1] {
    color: var(--rz-ink);
    font-family: Sora, Manrope, ui-sans-serif, system-ui, sans-serif;
    font-size: 26px;
    font-weight: 700;
    letter-spacing: -0.02em;
    line-height: 1.1;
}

.rf-phead .workspace-copy[b-np637vgne1] {
    color: var(--rz-copy-muted);
    font-size: 14px;
    margin-top: 5px;
}

.rf-sp[b-np637vgne1] {
    flex: 1;
}

.rf-live[b-np637vgne1] {
    align-items: center;
    background: rgba(62, 207, 170, 0.14);
    border-radius: 999px;
    color: var(--teal-700);
    display: inline-flex;
    font-size: 11.5px;
    font-weight: 700;
    gap: 6px;
    padding: 3px 10px;
}

.rf-cta[b-np637vgne1] {
    align-items: center;
    background: var(--teal);
    border-radius: 10px;
    box-shadow: 0 6px 18px rgba(62, 207, 170, 0.35);
    color: var(--navy);
    display: inline-flex;
    font-family: Sora, Manrope, ui-sans-serif, system-ui, sans-serif;
    font-size: 14px;
    font-weight: 700;
    gap: 9px;
    height: 44px;
    padding: 0 18px;
    text-decoration: none;
    transition: transform 0.16s cubic-bezier(0.34, 1.56, 0.64, 1), background 0.16s;
}

.rf-cta:hover[b-np637vgne1] {
    background: #28b893;
    transform: translateY(-2px);
}

.rf-ghost[b-np637vgne1] {
    align-items: center;
    background: transparent;
    border: 1.5px solid rgba(11, 31, 51, 0.16);
    border-radius: 10px;
    color: var(--navy);
    cursor: pointer;
    display: inline-flex;
    font-family: Sora, Manrope, ui-sans-serif, system-ui, sans-serif;
    font-size: 14px;
    font-weight: 700;
    gap: 8px;
    height: 44px;
    padding: 0 16px;
    transition: border-color 0.16s, background 0.16s, color 0.16s;
}

.rf-ghost:hover:not(:disabled)[b-np637vgne1] {
    background: rgba(224, 49, 63, 0.08);
    border-color: rgba(224, 49, 63, 0.5);
    color: #c0303f;
}

.rf-ghost:disabled[b-np637vgne1] {
    cursor: default;
    opacity: 0.6;
}

.rf-tiles[b-np637vgne1] {
    display: grid;
    gap: 16px;
    grid-template-columns: repeat(3, 1fr);
    margin-bottom: 16px;
}

.rf-grid[b-np637vgne1] {
    display: grid;
    gap: 16px;
    grid-template-columns: 1.4fr 1fr;
}

.rf-panel[b-np637vgne1] {
    background: var(--rz-surface);
    border: 1px solid var(--rz-border);
    border-radius: 16px;
    box-shadow: var(--rz-shadow-card, var(--rz-shadow-lg));
    overflow: hidden;
}

.rf-panel-h[b-np637vgne1] {
    align-items: center;
    border-bottom: 1px solid var(--rz-border);
    display: flex;
    gap: 10px;
    padding: 16px 20px;
}

.rf-panel-h h3[b-np637vgne1] {
    color: var(--rz-ink);
    font-family: Sora, Manrope, ui-sans-serif, system-ui, sans-serif;
    font-size: 15px;
    font-weight: 700;
    letter-spacing: -0.02em;
}

.rf-panel-h a[b-np637vgne1] {
    color: var(--teal-700);
    font-size: 12.5px;
    font-weight: 700;
    text-decoration: none;
}

.rf-panel-h .rf-cnt[b-np637vgne1] {
    color: var(--rz-copy-muted);
    font-size: 12.5px;
    font-weight: 600;
}

.rf-empty[b-np637vgne1] {
    color: var(--rz-copy-muted);
    font-size: 13.5px;
    padding: 18px 20px;
}

.rf-acct[b-np637vgne1] {
    align-items: center;
    border-bottom: 1px solid var(--rz-border);
    display: flex;
    gap: 14px;
    padding: 15px 20px;
}

.rf-acct:last-child[b-np637vgne1] {
    border-bottom: 0;
}

.rf-lg[b-np637vgne1] {
    align-items: center;
    border-radius: 11px;
    color: #fff;
    display: grid;
    flex: none;
    font-family: Sora, Manrope, ui-sans-serif, system-ui, sans-serif;
    font-size: 14px;
    font-weight: 700;
    height: 40px;
    justify-items: center;
    width: 40px;
}

.rf-nm[b-np637vgne1] {
    flex: 1;
    min-width: 0;
}

.rf-nm b[b-np637vgne1] {
    color: var(--rz-ink);
    display: block;
    font-size: 14.5px;
    font-weight: 600;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.rf-nm span[b-np637vgne1] {
    color: var(--rz-copy-muted);
    font-size: 12px;
}

.rf-spk[b-np637vgne1] {
    flex: none;
    height: 26px;
    opacity: 0.9;
    width: 66px;
}

.rf-txn[b-np637vgne1] {
    align-items: center;
    border-bottom: 1px solid var(--rz-border);
    display: flex;
    gap: 12px;
    font-size: 13.5px;
    padding: 13px 20px;
}

.rf-txn:last-child[b-np637vgne1] {
    border-bottom: 0;
}

.rf-ic[b-np637vgne1] {
    align-items: center;
    background: var(--rz-surface-3);
    border-radius: 9px;
    color: var(--rz-copy-muted);
    display: grid;
    flex: none;
    height: 32px;
    justify-items: center;
    width: 32px;
}

.rf-d[b-np637vgne1] {
    flex: 1;
    min-width: 0;
}

.rf-d b[b-np637vgne1] {
    color: var(--rz-ink);
    display: block;
    font-size: 13.5px;
    font-weight: 600;
}

.rf-d span[b-np637vgne1] {
    color: var(--rz-copy-muted);
    font-size: 11.5px;
}

.rf-connect[b-np637vgne1] {
    align-items: center;
    background: linear-gradient(135deg, #0d0e38 0%, #1e2060 45%, #131448 100%);
    border-radius: 16px;
    box-shadow: 0 32px 80px -16px rgba(30, 32, 96, 0.30);
    color: #e8e9fb;
    display: flex;
    flex-wrap: wrap;
    gap: 18px;
    margin-top: 16px;
    overflow: hidden;
    padding: 22px 24px;
    position: relative;
}

.rf-connect[b-np637vgne1]::after {
    background: radial-gradient(40% 80% at 88% 20%, rgba(62, 207, 170, 0.16), transparent 70%);
    content: "";
    inset: 0;
    pointer-events: none;
    position: absolute;
}

.rf-connect-z[b-np637vgne1] {
    flex: 1;
    min-width: 220px;
    position: relative;
    z-index: 1;
}

.rf-connect h4[b-np637vgne1] {
    color: #fff;
    font-family: Sora, Manrope, ui-sans-serif, system-ui, sans-serif;
    font-size: 16px;
    font-weight: 700;
}

.rf-connect p[b-np637vgne1] {
    color: rgba(232, 233, 251, 0.72);
    font-size: 13px;
    margin-top: 3px;
}

.rf-connect .rf-cta[b-np637vgne1] {
    position: relative;
    z-index: 1;
}

/* Professional empty state (no banks connected). */
.rf-blank[b-np637vgne1] {
    align-items: center;
    background: var(--rz-surface);
    border: 1px solid var(--rz-border);
    border-radius: 18px;
    box-shadow: var(--rz-shadow-card, var(--rz-shadow-lg));
    display: flex;
    flex-direction: column;
    padding: 44px 28px 36px;
    text-align: center;
}

.rf-blank-ic[b-np637vgne1] {
    align-items: center;
    background: rgba(62, 207, 170, 0.12);
    border-radius: 16px;
    color: var(--teal-700);
    display: grid;
    height: 64px;
    justify-items: center;
    width: 64px;
}

.rf-blank h2[b-np637vgne1] {
    color: var(--rz-ink);
    font-family: Sora, Manrope, ui-sans-serif, system-ui, sans-serif;
    font-size: 20px;
    font-weight: 700;
    letter-spacing: -0.02em;
    margin-top: 18px;
}

.rf-blank p[b-np637vgne1] {
    color: var(--rz-copy-muted);
    font-size: 14px;
    line-height: 1.55;
    margin-top: 8px;
    max-width: 46ch;
}

.rf-blank-cta[b-np637vgne1] {
    margin-top: 22px;
}

.rf-blank-steps[b-np637vgne1] {
    color: var(--rz-copy-muted);
    display: flex;
    flex-wrap: wrap;
    font-size: 13px;
    gap: 14px 26px;
    justify-content: center;
    list-style: none;
    margin: 28px 0 0;
    padding: 0;
}

.rf-blank-steps li[b-np637vgne1] {
    align-items: center;
    display: flex;
    gap: 9px;
}

.rf-blank-steps span[b-np637vgne1] {
    align-items: center;
    background: var(--navy);
    border-radius: 50%;
    color: #fff;
    display: grid;
    font-size: 12px;
    font-weight: 700;
    height: 22px;
    justify-items: center;
    width: 22px;
}

/* Freshly-connected success banner + new-bank highlight. */
.rf-connected[b-np637vgne1] {
    align-items: center;
    background: rgba(62, 207, 170, 0.12);
    border: 1px solid rgba(62, 207, 170, 0.4);
    border-radius: 14px;
    display: flex;
    gap: 14px;
    margin-bottom: 16px;
    padding: 14px 18px;
}

.rf-connected-ic[b-np637vgne1] {
    align-items: center;
    background: var(--teal);
    border-radius: 50%;
    color: var(--navy);
    display: grid;
    flex: none;
    height: 34px;
    justify-items: center;
    width: 34px;
}

.rf-connected b[b-np637vgne1] {
    color: var(--rz-ink);
    display: block;
    font-family: Sora, Manrope, ui-sans-serif, system-ui, sans-serif;
    font-size: 14.5px;
}

.rf-connected span[b-np637vgne1] {
    color: var(--rz-copy-muted);
    font-size: 13px;
}

.rf-new-badge[b-np637vgne1] {
    background: rgba(62, 207, 170, 0.16);
    border-radius: 999px;
    color: var(--teal-700);
    font-size: 11px;
    font-weight: 700;
    padding: 3px 9px;
}

.rf-acct-new[b-np637vgne1] {
    background: rgba(62, 207, 170, 0.07);
    box-shadow: inset 3px 0 0 var(--teal);
}

.rf-new-pill[b-np637vgne1] {
    background: var(--teal);
    border-radius: 999px;
    color: var(--navy);
    font-size: 10.5px;
    font-weight: 700;
    padding: 2px 8px;
}

@media (max-width: 900px) {
    .rf-tiles[b-np637vgne1],
    .rf-grid[b-np637vgne1] {
        grid-template-columns: 1fr;
    }
}

@media (prefers-reduced-motion: reduce) {
    .rf-cta[b-np637vgne1] {
        transition: none;
    }
}

/* Bank grouping in the connected-accounts panel: a small header per bank, its accounts nested below. */
.rf-bankgroup[b-np637vgne1] { margin-top: .5rem; }
.rf-bankgroup:first-child[b-np637vgne1] { margin-top: 0; }
.rf-bankgroup-h[b-np637vgne1] {
    display: flex; align-items: baseline; justify-content: space-between;
    padding: .35rem .25rem .3rem; margin: .35rem 0 .1rem;
    border-bottom: 1px solid var(--rf-line, rgba(30,32,96,.1));
}
.rf-bankgroup-name[b-np637vgne1] {
    font-weight: 700; font-size: .82rem; letter-spacing: .04em; text-transform: uppercase;
    color: var(--rf-navy, #1e2060);
}
.rf-bankgroup-count[b-np637vgne1] { font-size: .72rem; color: var(--rf-muted, #6b7280); font-variant-numeric: tabular-nums; }
/* _content/ReflowUk.Web/Components/Pages/Customer/OrganisationMembers.razor.rz.scp.css */
/* Form helpers used in this page's own markup, scoped by Blazor CSS isolation. These classes previously
   rendered unstyled from the shared stylesheet. */
.form-field[b-fxzy5bu6p6] {
    display: flex;
    flex-direction: column;
    gap: 0.35rem;
    margin-bottom: 0.9rem;
}

.form-field label[b-fxzy5bu6p6] {
    color: var(--rz-navy);
    font-size: 0.85rem;
    font-weight: 600;
}

.form-field input[b-fxzy5bu6p6],
.form-field select[b-fxzy5bu6p6] {
    background: var(--rz-surface);
    border: 1px solid var(--rz-border);
    border-radius: 7px;
    color: var(--rz-navy);
    font-size: 0.95rem;
    padding: 0.55rem 0.7rem;
    width: 100%;
}

.form-field input:focus[b-fxzy5bu6p6],
.form-field select:focus[b-fxzy5bu6p6] {
    border-color: var(--rz-teal);
    outline: 2px solid var(--rz-teal-100);
    outline-offset: 1px;
}

.field-hint[b-fxzy5bu6p6] {
    color: var(--rz-copy-muted);
    font-size: 0.8125rem;
    line-height: 1.45;
    margin: 0.1rem 0 0;
}

.button-primary[b-fxzy5bu6p6] {
    background: var(--rz-teal);
    border: none;
    border-radius: 7px;
    color: #062019;
    cursor: pointer;
    font-size: 0.9rem;
    font-weight: 700;
    padding: 0.55rem 1.1rem;
}

.button-primary:hover:not(:disabled)[b-fxzy5bu6p6] {
    background: var(--rz-teal-hover);
}

.button-primary:disabled[b-fxzy5bu6p6] {
    cursor: not-allowed;
    opacity: 0.55;
}
/* _content/ReflowUk.Web/Components/Pages/Customer/Payments.razor.rz.scp.css */
/* Form + panel helpers used in this page's own markup, scoped by Blazor CSS isolation. */
.form-field[b-80g7vycj1c] {
    display: flex;
    flex-direction: column;
    gap: 0.35rem;
    margin-bottom: 0.9rem;
}

.form-field label[b-80g7vycj1c] {
    color: var(--rz-navy);
    font-size: 0.85rem;
    font-weight: 600;
}

.form-field input[b-80g7vycj1c] {
    background: var(--rz-surface);
    border: 1px solid var(--rz-border);
    border-radius: 7px;
    color: var(--rz-navy);
    font-size: 0.95rem;
    padding: 0.55rem 0.7rem;
    width: 100%;
}

.form-field input:focus[b-80g7vycj1c] {
    border-color: var(--rz-teal);
    outline: 2px solid var(--rz-teal-100);
    outline-offset: 1px;
}

.field-hint[b-80g7vycj1c] {
    color: var(--rz-copy-muted);
    font-size: 0.8125rem;
    line-height: 1.45;
    margin: 0.1rem 0 0;
}

.form-grid[b-80g7vycj1c] {
    display: grid;
    gap: 0 1rem;
    grid-template-columns: repeat(2, minmax(0, 1fr));
}

.button-primary[b-80g7vycj1c] {
    background: var(--rz-teal);
    border: none;
    border-radius: 7px;
    color: #062019;
    cursor: pointer;
    font-size: 0.9rem;
    font-weight: 700;
    padding: 0.55rem 1.1rem;
}

.button-primary:hover:not(:disabled)[b-80g7vycj1c] {
    background: var(--rz-teal-hover);
}

.button-primary:disabled[b-80g7vycj1c] {
    cursor: not-allowed;
    opacity: 0.55;
}

.journey-steps[b-80g7vycj1c] {
    display: grid;
    gap: 0.75rem;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    list-style: none;
    margin: 0;
    padding: 0;
}

.journey-steps li[b-80g7vycj1c] {
    background: var(--rz-surface-muted);
    border: 1px solid var(--rz-border);
    border-radius: 8px;
    display: flex;
    flex-direction: column;
    gap: 0.3rem;
    padding: 0.8rem;
}

.journey-step-title[b-80g7vycj1c] {
    color: var(--rz-navy);
    font-size: 0.9rem;
    font-weight: 700;
}

.journey-step-copy[b-80g7vycj1c] {
    color: var(--rz-copy-muted);
    font-size: 0.82rem;
    line-height: 1.4;
}

@media (max-width: 800px) {
    .form-grid[b-80g7vycj1c] {
        grid-template-columns: 1fr;
    }

    .journey-steps[b-80g7vycj1c] {
        grid-template-columns: 1fr;
    }
}
/* _content/ReflowUk.Web/Components/Pages/Customer/Profile.razor.rz.scp.css */
/* Panel helper used in this page's own markup, scoped by Blazor CSS isolation. */
.field-hint[b-vcg5nkyszp] {
    color: var(--rz-copy-muted);
    font-size: 0.8125rem;
    line-height: 1.45;
    margin: 0.25rem 0 0;
}
/* _content/ReflowUk.Web/Components/Pages/Customer/SignIn.razor.rz.scp.css */
/* Branded customer sign-in (reflow). Mirrors the approved reflow auth look: a navy hero on the left, the
   sign-in card on the right. Local tokens track reflowzone.io's palette and follow the shell's light/dark
   convention (OS preference unless the viewer forced light, plus the data-theme="dark" stamp). */
.cs-auth[b-23bmphoffr] {
    --navy: #1e2060;
    --teal: #3ecfaa;
    --teal-700: #177a60;
    --page: #ffffff;
    --ink: #1e2060;
    --line-2: rgba(30, 32, 96, 0.14);
    --mut: rgba(30, 32, 96, 0.62);
    --field-bg: #ffffff;
    --hero: linear-gradient(135deg, #0d0e38 0%, #1e2060 45%, #131448 100%);
    --hero-sh: 0 32px 80px -16px rgba(30, 32, 96, 0.30);

    border: 1px solid var(--line-2);
    border-radius: 18px;
    display: grid;
    grid-template-columns: 1.05fr 0.95fr;
    margin: 0;
    min-height: calc(100vh - 3rem);
    min-height: calc(100dvh - 3rem);
    overflow: hidden;
    box-shadow: var(--rz-shadow-lg);
}

@media (prefers-color-scheme: dark) {
    :root:not([data-theme="light"]) .cs-auth[b-23bmphoffr] {
        --page: #0b0c26;
        --ink: #eef0ff;
        --line-2: rgba(255, 255, 255, 0.14);
        --mut: rgba(226, 228, 250, 0.65);
        --field-bg: #12143a;
    }
}

:root[data-theme="dark"] .cs-auth[b-23bmphoffr] {
    --page: #0b0c26;
    --ink: #eef0ff;
    --line-2: rgba(255, 255, 255, 0.14);
    --mut: rgba(226, 228, 250, 0.65);
    --field-bg: #12143a;
}

.cs-side[b-23bmphoffr] {
    background: var(--hero);
    color: #e8e9fb;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    overflow: hidden;
    padding: 52px 56px;
    position: relative;
}

.cs-side[b-23bmphoffr]::after {
    background: radial-gradient(45% 40% at 82% 12%, rgba(62, 207, 170, 0.18), transparent 70%);
    content: "";
    inset: 0;
    pointer-events: none;
    position: absolute;
}

.cs-side > *[b-23bmphoffr] {
    position: relative;
    z-index: 1;
}

.cs-eyebrow[b-23bmphoffr] {
    color: var(--teal);
    font-family: Sora, Manrope, ui-sans-serif, system-ui, sans-serif;
    font-size: 11px;
    font-weight: 700;
    letter-spacing: 0.16em;
    text-transform: uppercase;
}

.cs-side h2[b-23bmphoffr] {
    color: #fff;
    font-family: Sora, Manrope, ui-sans-serif, system-ui, sans-serif;
    font-size: 30px;
    font-weight: 700;
    letter-spacing: -0.03em;
    line-height: 1.1;
    margin-top: 14px;
    max-width: 15ch;
}

.cs-side h2 .cs-fl[b-23bmphoffr] {
    color: #3ecfaa;
}

.cs-lead[b-23bmphoffr] {
    color: rgba(232, 233, 251, 0.78);
    font-size: 14.5px;
    line-height: 1.55;
    margin-top: 16px;
    max-width: 40ch;
}

.cs-points[b-23bmphoffr] {
    color: rgba(232, 233, 251, 0.9);
    display: grid;
    gap: 12px;
    list-style: none;
    margin: 26px 0 0;
    padding: 0;
}

.cs-points li[b-23bmphoffr] {
    align-items: center;
    display: flex;
    font-size: 13.5px;
    gap: 10px;
}

.cs-points svg[b-23bmphoffr] {
    color: var(--teal);
    flex: none;
}

.cs-mini[b-23bmphoffr] {
    color: rgba(232, 233, 251, 0.7);
    display: flex;
    font-size: 12px;
    gap: 18px;
}

.cs-mini span[b-23bmphoffr] {
    align-items: center;
    display: inline-flex;
    gap: 7px;
}

.cs-mini svg[b-23bmphoffr] {
    color: var(--teal);
    height: 14px;
    width: 14px;
}

.cs-pane[b-23bmphoffr] {
    background: var(--page);
    display: grid;
    padding: 44px;
    place-items: center;
}

.cs-card[b-23bmphoffr] {
    max-width: 380px;
    width: 100%;
}

.cs-card-logo[b-23bmphoffr] {
    margin-bottom: 22px;
}

.cs-card h1[b-23bmphoffr] {
    color: var(--ink);
    font-family: Sora, Manrope, ui-sans-serif, system-ui, sans-serif;
    font-size: 26px;
    font-weight: 700;
    letter-spacing: -0.03em;
    line-height: 1.1;
}

.cs-sub[b-23bmphoffr] {
    color: var(--mut);
    font-size: 14.5px;
    margin: 8px 0 20px;
}

.cs-alert[b-23bmphoffr] {
    align-items: center;
    background: rgba(242, 116, 155, 0.12);
    border: 1px solid rgba(242, 116, 155, 0.4);
    border-radius: 10px;
    color: #b23a63;
    display: flex;
    font-size: 13px;
    font-weight: 600;
    gap: 8px;
    margin-bottom: 16px;
    padding: 10px 12px;
}

.cs-demo[b-23bmphoffr] {
    background: rgba(62, 207, 170, 0.08);
    border: 1px dashed rgba(62, 207, 170, 0.5);
    border-radius: 12px;
    margin-bottom: 20px;
    padding: 14px 16px;
}

.cs-demo-badge[b-23bmphoffr] {
    color: var(--teal-700);
    font-family: Sora, Manrope, ui-sans-serif, system-ui, sans-serif;
    font-size: 11.5px;
    font-weight: 700;
    letter-spacing: 0.02em;
}

.cs-demo dl[b-23bmphoffr] {
    display: grid;
    gap: 6px;
    margin: 10px 0 0;
}

.cs-demo dl div[b-23bmphoffr] {
    display: flex;
    gap: 10px;
}

.cs-demo dt[b-23bmphoffr] {
    color: var(--mut);
    font-size: 12.5px;
    width: 74px;
}

.cs-demo dd[b-23bmphoffr] {
    color: var(--ink);
    font-family: ui-monospace, Menlo, monospace;
    font-size: 12.5px;
    font-weight: 600;
    margin: 0;
}

.cs-form[b-23bmphoffr] {
    display: grid;
    gap: 14px;
}

.cs-field[b-23bmphoffr] {
    display: grid;
    gap: 6px;
}

.cs-field span[b-23bmphoffr] {
    color: var(--ink);
    font-size: 12.5px;
    font-weight: 600;
}

.cs-field input[b-23bmphoffr] {
    background: var(--field-bg);
    border: 1px solid var(--line-2);
    border-radius: 10px;
    color: var(--ink);
    font-size: 14px;
    height: 44px;
    padding: 0 14px;
    width: 100%;
}

.cs-field input:focus[b-23bmphoffr] {
    border-color: var(--teal);
    box-shadow: 0 0 0 3px rgba(62, 207, 170, 0.2);
    outline: none;
}

.cs-btn[b-23bmphoffr] {
    align-items: center;
    background: var(--navy);
    border: 1px solid transparent;
    border-radius: 10px;
    color: #fff;
    cursor: pointer;
    display: inline-flex;
    font-family: Sora, Manrope, ui-sans-serif, system-ui, sans-serif;
    font-size: 14px;
    font-weight: 700;
    gap: 9px;
    height: 46px;
    justify-content: center;
    margin-top: 4px;
    padding: 0 18px;
    transition: transform 0.16s cubic-bezier(0.34, 1.56, 0.64, 1), box-shadow 0.16s;
    width: 100%;
}

.cs-btn:hover[b-23bmphoffr] {
    box-shadow: 0 10px 26px rgba(30, 32, 96, 0.32);
    transform: translateY(-2px);
}

.cs-sec[b-23bmphoffr] {
    align-items: center;
    color: var(--mut);
    display: flex;
    font-size: 12px;
    gap: 8px;
    justify-content: center;
    margin-top: 22px;
}

.cs-sec svg[b-23bmphoffr] {
    color: var(--teal-700);
    height: 14px;
    width: 14px;
}

@media (max-width: 900px) {
    .cs-auth[b-23bmphoffr] {
        grid-template-columns: 1fr;
        min-height: 0;
    }

    .cs-side[b-23bmphoffr] {
        display: none;
    }
}

@media (prefers-reduced-motion: reduce) {
    .cs-btn[b-23bmphoffr] {
        transition: none;
    }
}
/* _content/ReflowUk.Web/Components/Pages/Home.razor.rz.scp.css */
.az-signin[b-sytzcd9z3e] {
    max-width: 44rem;
}

.az-signin-actions[b-sytzcd9z3e] {
    margin-top: 1.5rem;
}

.az-home-foot[b-sytzcd9z3e] {
    align-items: center;
    color: var(--rz-copy-muted);
    display: flex;
    flex-wrap: wrap;
    font-size: 0.85rem;
    gap: 0.75rem 1.25rem;
    justify-content: space-between;
    margin-top: 1.5rem;
}

.az-home-links[b-sytzcd9z3e] {
    display: flex;
    flex-wrap: wrap;
    gap: 0.6rem;
}

.az-home-links a[b-sytzcd9z3e] {
    border: 1px solid var(--rz-border-strong);
    border-radius: 6px;
    color: var(--rz-teal-text);
    font-weight: 700;
    padding: 0.4rem 0.65rem;
    text-decoration: none;
}

.az-home-links a:hover[b-sytzcd9z3e] {
    border-color: var(--rz-teal);
}

/* ===== Branded production sign-in (ported from the approved reflow mockup) =====
   Local tokens mirror reflowzone.io's palette; children inherit them. Dark handling
   follows the app convention: OS preference unless the viewer forced light, plus the
   data-theme="dark" stamp from the shell's theme toggle. */
.rf-auth[b-sytzcd9z3e] {
    --navy: #1e2060;
    --teal: #3ecfaa;
    --teal-700: #177a60;
    --page: #ffffff;
    --ink: #1e2060;
    --line-2: rgba(30, 32, 96, 0.14);
    --mut: rgba(30, 32, 96, 0.62);
    --mut-2: rgba(30, 32, 96, 0.45);
    --hero: linear-gradient(135deg, #0d0e38 0%, #1e2060 45%, #131448 100%);
    --hero-sh: 0 32px 80px -16px rgba(30, 32, 96, 0.30);

    border: 1px solid var(--line-2);
    border-radius: 18px;
    display: grid;
    grid-template-columns: 1.05fr 0.95fr;
    margin: 0;
    min-height: calc(100vh - 3rem);
    min-height: calc(100dvh - 3rem);
    overflow: hidden;
    box-shadow: var(--rz-shadow-lg);
}

@media (prefers-color-scheme: dark) {
    :root:not([data-theme="light"]) .rf-auth[b-sytzcd9z3e] {
        --page: #0b0c26;
        --ink: #eef0ff;
        --line-2: rgba(255, 255, 255, 0.14);
        --mut: rgba(226, 228, 250, 0.65);
        --mut-2: rgba(226, 228, 250, 0.45);
    }
}

:root[data-theme="dark"] .rf-auth[b-sytzcd9z3e] {
    --page: #0b0c26;
    --ink: #eef0ff;
    --line-2: rgba(255, 255, 255, 0.14);
    --mut: rgba(226, 228, 250, 0.65);
    --mut-2: rgba(226, 228, 250, 0.45);
}

.rf-side[b-sytzcd9z3e] {
    background: var(--hero);
    color: #e8e9fb;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    overflow: hidden;
    padding: 52px 56px;
    position: relative;
}

.rf-side[b-sytzcd9z3e]::after {
    background: radial-gradient(45% 40% at 82% 12%, rgba(62, 207, 170, 0.18), transparent 70%);
    content: "";
    inset: 0;
    pointer-events: none;
    position: absolute;
}

.rf-side > *[b-sytzcd9z3e] {
    position: relative;
    z-index: 1;
}

.rf-eyebrow[b-sytzcd9z3e] {
    color: var(--teal);
    font-family: Sora, Manrope, ui-sans-serif, system-ui, sans-serif;
    font-size: 11px;
    font-weight: 700;
    letter-spacing: 0.16em;
    text-transform: uppercase;
}

.rf-side h2[b-sytzcd9z3e] {
    color: #fff;
    font-family: Sora, Manrope, ui-sans-serif, system-ui, sans-serif;
    font-size: 30px;
    font-weight: 700;
    letter-spacing: -0.03em;
    line-height: 1.1;
    margin-top: 14px;
    max-width: 16ch;
}

.rf-side h2 .rf-fl[b-sytzcd9z3e] {
    /* Solid teal. A prior gradient-clip approach (-webkit-background-clip:text + color:transparent)
       rendered as a solid bar because the `background` shorthand reset background-clip to border-box,
       so the box filled while the transparent text stayed hidden. Solid teal is robust everywhere. */
    color: #3ecfaa;
}

.rf-glass[b-sytzcd9z3e] {
    backdrop-filter: blur(6px);
    background: linear-gradient(160deg, rgba(255, 255, 255, 0.10), rgba(255, 255, 255, 0.03));
    border: 1px solid rgba(255, 255, 255, 0.14);
    border-radius: 18px;
    box-shadow: var(--hero-sh);
    margin-top: 26px;
    padding: 16px;
}

.rf-chrome[b-sytzcd9z3e] {
    align-items: center;
    display: flex;
    gap: 7px;
    margin-bottom: 14px;
}

.rf-chrome i[b-sytzcd9z3e] {
    border-radius: 50%;
    display: block;
    height: 9px;
    width: 9px;
}

.rf-chrome .rf-u[b-sytzcd9z3e] {
    color: rgba(232, 233, 251, 0.55);
    font-family: ui-monospace, Menlo, monospace;
    font-size: 11px;
    margin-left: 10px;
}

.rf-gtiles[b-sytzcd9z3e] {
    display: grid;
    gap: 9px;
    grid-template-columns: repeat(3, 1fr);
    margin-bottom: 12px;
}

.rf-gtile[b-sytzcd9z3e] {
    background: rgba(255, 255, 255, 0.05);
    border: 1px solid rgba(255, 255, 255, 0.08);
    border-radius: 11px;
    padding: 11px;
}

.rf-gtile .rf-k[b-sytzcd9z3e] {
    color: rgba(232, 233, 251, 0.55);
    font-size: 10px;
    letter-spacing: 0.08em;
    text-transform: uppercase;
}

.rf-gtile .rf-v[b-sytzcd9z3e] {
    color: #fff;
    font-family: Sora, Manrope, ui-sans-serif, system-ui, sans-serif;
    font-size: 18px;
    font-weight: 700;
    margin-top: 4px;
}

.rf-gtile .rf-v.teal[b-sytzcd9z3e] {
    color: var(--teal);
}

.rf-spark[b-sytzcd9z3e] {
    background: rgba(62, 207, 170, 0.06);
    border: 1px solid rgba(62, 207, 170, 0.14);
    border-radius: 10px;
    height: 44px;
    margin-bottom: 11px;
    overflow: hidden;
    position: relative;
}

.rf-badge[b-sytzcd9z3e] {
    align-items: center;
    background: var(--teal);
    border-radius: 999px;
    color: var(--navy);
    display: inline-flex;
    font-size: 11px;
    font-weight: 700;
    gap: 7px;
    padding: 5px 11px;
}

.rf-mini[b-sytzcd9z3e] {
    color: rgba(232, 233, 251, 0.7);
    display: flex;
    font-size: 12px;
    gap: 18px;
}

.rf-mini span[b-sytzcd9z3e] {
    align-items: center;
    display: inline-flex;
    gap: 7px;
}

.rf-mini svg[b-sytzcd9z3e] {
    color: var(--teal);
    height: 14px;
    width: 14px;
}

.rf-pane[b-sytzcd9z3e] {
    background: var(--page);
    display: grid;
    padding: 44px;
    place-items: center;
}

.rf-card[b-sytzcd9z3e] {
    max-width: 372px;
    width: 100%;
}

.rf-card-logo[b-sytzcd9z3e] {
    margin-bottom: 22px;
}

.rf-card h1[b-sytzcd9z3e] {
    color: var(--ink);
    font-family: Sora, Manrope, ui-sans-serif, system-ui, sans-serif;
    font-size: 26px;
    font-weight: 700;
    letter-spacing: -0.03em;
    line-height: 1.1;
}

.rf-sub[b-sytzcd9z3e] {
    color: var(--mut);
    font-size: 14.5px;
    margin: 8px 0 24px;
}

.rf-btn[b-sytzcd9z3e] {
    align-items: center;
    border: 1px solid transparent;
    border-radius: 10px;
    display: inline-flex;
    font-family: Sora, Manrope, ui-sans-serif, system-ui, sans-serif;
    font-size: 14px;
    font-weight: 700;
    gap: 9px;
    height: 44px;
    justify-content: center;
    padding: 0 18px;
    text-decoration: none;
    transition: transform 0.16s cubic-bezier(0.34, 1.56, 0.64, 1), box-shadow 0.16s, background 0.16s, border-color 0.16s;
}

.rf-btn.block[b-sytzcd9z3e] {
    width: 100%;
}

.rf-btn.navy[b-sytzcd9z3e] {
    background: var(--navy);
    color: #fff;
}

.rf-btn.navy:hover[b-sytzcd9z3e] {
    box-shadow: 0 10px 26px rgba(30, 32, 96, 0.32);
    transform: translateY(-2px);
}

.rf-btn.out[b-sytzcd9z3e] {
    background: transparent;
    border-color: var(--line-2);
    color: var(--ink);
}

.rf-btn.out:hover[b-sytzcd9z3e] {
    border-color: var(--teal);
    color: var(--teal-700);
}

.rf-sec[b-sytzcd9z3e] {
    align-items: center;
    color: var(--mut);
    display: flex;
    font-size: 12px;
    gap: 8px;
    justify-content: center;
    margin-top: 22px;
}

.rf-sec svg[b-sytzcd9z3e] {
    color: var(--teal-700);
    height: 14px;
    width: 14px;
}

.rf-swap[b-sytzcd9z3e] {
    color: var(--mut);
    font-size: 13.5px;
    margin-top: 18px;
    text-align: center;
}

.rf-swap a[b-sytzcd9z3e] {
    color: var(--teal-700);
    font-weight: 700;
}

@media (max-width: 900px) {
    .rf-auth[b-sytzcd9z3e] {
        grid-template-columns: 1fr;
        min-height: 0;
    }

    .rf-side[b-sytzcd9z3e] {
        display: none;
    }
}

@media (prefers-reduced-motion: reduce) {
    .rf-btn[b-sytzcd9z3e] {
        transition: none;
    }
}
/* _content/ReflowUk.Web/Components/Pages/Internal/Admin.razor.rz.scp.css */
/* Page-scoped form/roster styling for the Admin console. Reuses the shared AdminUi (--rz-*)
   tokens so light and dark themes track the kit. Shared kit + app.css are untouched. */

.cx-roles[b-9hhm5d6jgb] {
    display: flex;
    flex-wrap: wrap;
    gap: 0.5rem;
    padding: 0.85rem 1rem 1rem;
}

.cx-rowacts[b-9hhm5d6jgb] {
    display: flex;
    gap: 0.4rem;
    justify-content: flex-end;
}

.cx-inline[b-9hhm5d6jgb] {
    color: var(--rz-copy-muted);
    font-size: 0.74rem;
    font-weight: 600;
}

.cx-form[b-9hhm5d6jgb] {
    display: grid;
    gap: 0.7rem;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    padding: 0.95rem 1rem 1.05rem;
}

.cx-fld[b-9hhm5d6jgb] {
    display: flex;
    flex-direction: column;
    gap: 0.3rem;
    min-width: 0;
}

.cx-fld-wide[b-9hhm5d6jgb] {
    grid-column: 1 / -1;
}

.cx-form label[b-9hhm5d6jgb] {
    color: var(--rz-copy-muted);
    font-size: 0.74rem;
    font-weight: 600;
}

.cx-form input[b-9hhm5d6jgb],
.cx-form select[b-9hhm5d6jgb] {
    background: var(--rz-surface-2);
    border: 1px solid var(--rz-border);
    border-radius: 8px;
    color: var(--rz-ink);
    font-family: inherit;
    font-size: 0.82rem;
    padding: 0.45rem 0.55rem;
    width: 100%;
}

.cx-form input:focus[b-9hhm5d6jgb],
.cx-form select:focus[b-9hhm5d6jgb] {
    border-color: var(--rz-teal);
    outline: 2px solid var(--rz-teal-100);
    outline-offset: 1px;
}

.cx-acts[b-9hhm5d6jgb] {
    display: flex;
    gap: 0.6rem;
    grid-column: 1 / -1;
    justify-content: flex-end;
}

@media (max-width: 780px) {
    .cx-form[b-9hhm5d6jgb] {
        grid-template-columns: 1fr;
    }
}
/* _content/ReflowUk.Web/Components/Pages/Internal/Audit.razor.rz.scp.css */
/* Page-scoped filter-form styling for the Audit console. Reuses the shared AdminUi (--rz-*)
   tokens so light and dark themes track the kit. Shared kit + app.css are untouched. */

.cx-form[b-3veos9z4fo] {
    display: grid;
    gap: 0.7rem;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    padding: 0.95rem 1rem 1.05rem;
}

.cx-fld[b-3veos9z4fo] {
    display: flex;
    flex-direction: column;
    gap: 0.3rem;
    min-width: 0;
}

.cx-form label[b-3veos9z4fo] {
    color: var(--rz-copy-muted);
    font-size: 0.74rem;
    font-weight: 600;
}

.cx-form input[b-3veos9z4fo],
.cx-form select[b-3veos9z4fo] {
    background: var(--rz-surface-2);
    border: 1px solid var(--rz-border);
    border-radius: 8px;
    color: var(--rz-ink);
    font-family: inherit;
    font-size: 0.82rem;
    padding: 0.45rem 0.55rem;
    width: 100%;
}

.cx-form input:focus[b-3veos9z4fo],
.cx-form select:focus[b-3veos9z4fo] {
    border-color: var(--rz-teal);
    outline: 2px solid var(--rz-teal-100);
    outline-offset: 1px;
}

.cx-acts[b-3veos9z4fo] {
    align-items: flex-end;
    display: flex;
    gap: 0.6rem;
    grid-column: 1 / -1;
    justify-content: flex-end;
}

@media (max-width: 900px) {
    .cx-form[b-3veos9z4fo] {
        grid-template-columns: 1fr;
    }
}
/* _content/ReflowUk.Web/Components/Pages/Internal/Dashboard.razor.rz.scp.css */
/* Page-scoped visualization styling for the dashboard widgets. Reuses the shared AdminUi (--rz-*)
   tokens so light and dark themes track the kit. Shared kit + app.css are untouched. */

.widget-viz[b-s4oc397zd4] {
    display: flex;
    flex-direction: column;
    gap: 0.65rem;
    padding: 0.25rem 0 0.35rem;
}

.widget-viz-row[b-s4oc397zd4] {
    display: flex;
    flex-direction: column;
    gap: 0.3rem;
}

.widget-viz-h[b-s4oc397zd4] {
    align-items: baseline;
    display: flex;
    gap: 0.6rem;
    justify-content: space-between;
}

.widget-viz-k[b-s4oc397zd4] {
    color: var(--rz-copy-muted);
    font-size: 0.78rem;
    font-weight: 600;
}

.widget-viz-v[b-s4oc397zd4] {
    color: var(--rz-ink);
    font-size: 1.15rem;
    font-weight: 700;
}
/* _content/ReflowUk.Web/Components/Pages/Internal/Finance.razor.rz.scp.css */
/* Page-scoped form styling for the Finance console action cards. Reuses the shared
   AdminUi (--rz-*) tokens so light and dark themes track the kit. Shared kit + app.css
   are untouched; these classes only style the write-action forms this page adds. */

.cx-form[b-eg8uertpgd] {
    display: grid;
    gap: 0.7rem;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    padding: 0.95rem 1rem 1.05rem;
}

.cx-fld[b-eg8uertpgd] {
    display: flex;
    flex-direction: column;
    gap: 0.3rem;
    min-width: 0;
}

.cx-fld-wide[b-eg8uertpgd] {
    grid-column: 1 / -1;
}

.cx-form label[b-eg8uertpgd] {
    color: var(--rz-copy-muted);
    font-size: 0.74rem;
    font-weight: 600;
}

.cx-form input[b-eg8uertpgd],
.cx-form select[b-eg8uertpgd],
.cx-form textarea[b-eg8uertpgd] {
    background: var(--rz-surface-2);
    border: 1px solid var(--rz-border);
    border-radius: 8px;
    color: var(--rz-ink);
    font-family: inherit;
    font-size: 0.82rem;
    padding: 0.45rem 0.55rem;
    width: 100%;
}

.cx-form textarea[b-eg8uertpgd] {
    resize: vertical;
}

.cx-form input:focus[b-eg8uertpgd],
.cx-form select:focus[b-eg8uertpgd],
.cx-form textarea:focus[b-eg8uertpgd] {
    border-color: var(--rz-teal);
    outline: 2px solid var(--rz-teal-100);
    outline-offset: 1px;
}

.cx-checks[b-eg8uertpgd] {
    align-items: center;
    display: flex;
    flex-wrap: wrap;
    gap: 0.9rem;
    grid-column: 1 / -1;
}

.cx-checks label[b-eg8uertpgd] {
    align-items: center;
    color: var(--rz-ink);
    display: flex;
    font-size: 0.8rem;
    font-weight: 500;
    gap: 0.4rem;
}

.cx-checks input[b-eg8uertpgd] {
    height: 0.95rem;
    width: 0.95rem;
}

.cx-hint[b-eg8uertpgd] {
    color: var(--rz-copy-muted);
    font-size: 0.74rem;
    grid-column: 1 / -1;
    margin: 0;
}

.cx-acts[b-eg8uertpgd] {
    display: flex;
    gap: 0.6rem;
    grid-column: 1 / -1;
    justify-content: flex-end;
}

@media (max-width: 780px) {
    .cx-form[b-eg8uertpgd] {
        grid-template-columns: 1fr;
    }
}
/* _content/ReflowUk.Web/Components/Pages/Internal/LegalHolds.razor.rz.scp.css */
/* Page-scoped form styling for the Legal holds console. Reuses the shared AdminUi (--rz-*)
   tokens so light and dark themes track the kit. Shared kit + app.css are untouched. */

.cx-form[b-9k5vzynf9r] {
    display: grid;
    gap: 0.7rem;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    padding: 0.95rem 1rem 1.05rem;
}

.cx-fld[b-9k5vzynf9r] {
    display: flex;
    flex-direction: column;
    gap: 0.3rem;
    min-width: 0;
}

.cx-fld-wide[b-9k5vzynf9r] {
    grid-column: 1 / -1;
}

.cx-form label[b-9k5vzynf9r] {
    color: var(--rz-copy-muted);
    font-size: 0.74rem;
    font-weight: 600;
}

.cx-form input[b-9k5vzynf9r],
.cx-form select[b-9k5vzynf9r],
.cx-form textarea[b-9k5vzynf9r] {
    background: var(--rz-surface-2);
    border: 1px solid var(--rz-border);
    border-radius: 8px;
    color: var(--rz-ink);
    font-family: inherit;
    font-size: 0.82rem;
    padding: 0.45rem 0.55rem;
    width: 100%;
}

.cx-form textarea[b-9k5vzynf9r] {
    resize: vertical;
}

.cx-form input:focus[b-9k5vzynf9r],
.cx-form select:focus[b-9k5vzynf9r],
.cx-form textarea:focus[b-9k5vzynf9r] {
    border-color: var(--rz-teal);
    outline: 2px solid var(--rz-teal-100);
    outline-offset: 1px;
}

.cx-hint[b-9k5vzynf9r] {
    color: var(--rz-copy-muted);
    font-size: 0.74rem;
    grid-column: 1 / -1;
    margin: 0;
}

.cx-acts[b-9k5vzynf9r] {
    display: flex;
    gap: 0.6rem;
    grid-column: 1 / -1;
    justify-content: flex-end;
}

@media (max-width: 780px) {
    .cx-form[b-9k5vzynf9r] {
        grid-template-columns: 1fr;
    }
}
/* _content/ReflowUk.Web/Components/Pages/Internal/Support.razor.rz.scp.css */
/* Page-scoped form styling for the Support console. Reuses the shared AdminUi (--rz-*)
   tokens so light and dark themes track the kit. Shared kit + app.css are untouched. */

.cx-form[b-2w54z7ryo2] {
    display: grid;
    gap: 0.7rem;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    padding: 0.95rem 1rem 1.05rem;
}

.cx-fld[b-2w54z7ryo2] {
    display: flex;
    flex-direction: column;
    gap: 0.3rem;
    min-width: 0;
}

.cx-fld-wide[b-2w54z7ryo2] {
    grid-column: 1 / -1;
}

.cx-form label[b-2w54z7ryo2] {
    color: var(--rz-copy-muted);
    font-size: 0.74rem;
    font-weight: 600;
}

.cx-form input[b-2w54z7ryo2],
.cx-form select[b-2w54z7ryo2],
.cx-form textarea[b-2w54z7ryo2] {
    background: var(--rz-surface-2);
    border: 1px solid var(--rz-border);
    border-radius: 8px;
    color: var(--rz-ink);
    font-family: inherit;
    font-size: 0.82rem;
    padding: 0.45rem 0.55rem;
    width: 100%;
}

.cx-form textarea[b-2w54z7ryo2] {
    resize: vertical;
}

.cx-form input:focus[b-2w54z7ryo2],
.cx-form select:focus[b-2w54z7ryo2],
.cx-form textarea:focus[b-2w54z7ryo2] {
    border-color: var(--rz-teal);
    outline: 2px solid var(--rz-teal-100);
    outline-offset: 1px;
}

.cx-hint[b-2w54z7ryo2] {
    color: var(--rz-copy-muted);
    font-size: 0.74rem;
    grid-column: 1 / -1;
    margin: 0;
}

.cx-acts[b-2w54z7ryo2] {
    display: flex;
    gap: 0.6rem;
    grid-column: 1 / -1;
    justify-content: flex-end;
}

@media (max-width: 780px) {
    .cx-form[b-2w54z7ryo2] {
        grid-template-columns: 1fr;
    }
}
/* _content/ReflowUk.Web/Components/Pages/Merchant/CreateRequest.razor.rz.scp.css */
/* Merchant "new payment request" form + share-link card. Mirrors the form/button helpers the
   customer Payments page defines in its own scoped CSS, so the collections form reads as part of the
   same workspace design system (dark-navy surfaces, teal accent, rounded inputs) instead of raw
   browser controls. */
.form-field[b-rthhf9xa7j] {
    display: flex;
    flex-direction: column;
    gap: 0.35rem;
    margin-bottom: 0.9rem;
}

.form-field label[b-rthhf9xa7j] {
    color: var(--rz-navy);
    font-size: 0.85rem;
    font-weight: 600;
}

.form-field input[b-rthhf9xa7j] {
    background: var(--rz-surface);
    border: 1px solid var(--rz-border);
    border-radius: 7px;
    color: var(--rz-navy);
    font-size: 0.95rem;
    padding: 0.55rem 0.7rem;
    width: 100%;
}

.form-field input:focus[b-rthhf9xa7j] {
    border-color: var(--rz-teal);
    outline: 2px solid var(--rz-teal-100);
    outline-offset: 1px;
}

.form-field input[readonly][b-rthhf9xa7j] {
    background: var(--rz-surface-muted);
    color: var(--rz-teal-text);
    cursor: text;
    font-family: ui-monospace, SFMono-Regular, "SF Mono", Menlo, Consolas, monospace;
    font-size: 0.9rem;
}

.field-hint[b-rthhf9xa7j] {
    color: var(--rz-copy-muted);
    font-size: 0.8125rem;
    line-height: 1.45;
    margin: 0.1rem 0 0;
}

.form-grid[b-rthhf9xa7j] {
    display: grid;
    gap: 0 1rem;
    grid-template-columns: repeat(2, minmax(0, 1fr));
}

.button-primary[b-rthhf9xa7j] {
    background: var(--rz-teal);
    border: none;
    border-radius: 7px;
    color: #062019;
    cursor: pointer;
    font-size: 0.9rem;
    font-weight: 700;
    padding: 0.55rem 1.1rem;
}

.button-primary:hover:not(:disabled)[b-rthhf9xa7j] {
    background: var(--rz-teal-hover);
}

.button-primary:disabled[b-rthhf9xa7j] {
    cursor: not-allowed;
    opacity: 0.55;
}

@media (max-width: 800px) {
    .form-grid[b-rthhf9xa7j] {
        grid-template-columns: 1fr;
    }
}
/* _content/ReflowUk.Web/Components/Pages/Pay/Confirmation.razor.rz.scp.css */
/* Hosted pay-by-bank confirmation/receipt page (chrome-less, BlankLayout). */
.rf-pay[b-4d09avqs7q] {
    --teal: #3ecfaa;
    --teal-700: #177a60;
    align-items: flex-start;
    background: var(--rz-app-bg, #0e0f22);
    display: flex;
    justify-content: center;
    min-height: 100vh;
    padding: 48px 20px;
}

.rf-pay-card[b-4d09avqs7q] {
    background: var(--rz-surface, #fff);
    border: 1px solid var(--rz-border, rgba(0, 0, 0, 0.08));
    border-radius: 18px;
    box-shadow: var(--rz-shadow-lg, 0 24px 60px rgba(0, 0, 0, 0.28));
    max-width: 560px;
    padding: 32px;
    width: 100%;
}

.rf-pay-card .eyebrow[b-4d09avqs7q] {
    color: var(--teal-700);
    font-size: 12px;
    font-weight: 700;
    letter-spacing: 0.08em;
    text-transform: uppercase;
}

.rf-pay-card h1[b-4d09avqs7q] {
    color: var(--rz-ink);
    font-family: Sora, Manrope, ui-sans-serif, system-ui, sans-serif;
    font-size: 24px;
    font-weight: 700;
    letter-spacing: -0.02em;
    line-height: 1.15;
    margin: 6px 0 4px;
}

.rf-pay-ref[b-4d09avqs7q] {
    color: var(--rz-copy-muted);
    font-size: 13.5px;
    margin-top: 4px;
}

.az-tag[b-4d09avqs7q] {
    background: var(--rz-chip-bg, rgba(30, 32, 96, 0.08));
    border-radius: 6px;
    color: var(--rz-ink);
    font-size: 12.5px;
    padding: 2px 8px;
}

.rf-pay-status[b-4d09avqs7q] {
    margin: 18px 0;
}

.workspace-copy[b-4d09avqs7q] {
    color: var(--rz-copy-muted);
    font-size: 14px;
    margin-top: 8px;
}

.button-primary[b-4d09avqs7q] {
    align-items: center;
    background: var(--teal-700);
    border: none;
    border-radius: 10px;
    color: #fff;
    display: inline-flex;
    font-size: 14px;
    font-weight: 700;
    height: 44px;
    margin-top: 12px;
    padding: 0 18px;
    text-decoration: none;
}
/* _content/ReflowUk.Web/Components/Pages/Pay/PayRequest.razor.rz.scp.css */
/* Hosted pay-by-bank page (chrome-less, BlankLayout). A centred single card with the AIS Connect bank-picker tiles. */
.rf-pay[b-pen2jprf7j] {
    --teal: #3ecfaa;
    --teal-700: #177a60;
    align-items: flex-start;
    background: var(--rz-app-bg, #0e0f22);
    display: flex;
    justify-content: center;
    min-height: 100vh;
    padding: 48px 20px;
}

.rf-pay-card[b-pen2jprf7j] {
    background: var(--rz-surface, #fff);
    border: 1px solid var(--rz-border, rgba(0, 0, 0, 0.08));
    border-radius: 18px;
    box-shadow: var(--rz-shadow-lg, 0 24px 60px rgba(0, 0, 0, 0.28));
    max-width: 560px;
    padding: 32px;
    width: 100%;
}

.rf-pay-card .eyebrow[b-pen2jprf7j] {
    color: var(--teal-700);
    font-size: 12px;
    font-weight: 700;
    letter-spacing: 0.08em;
    text-transform: uppercase;
}

.rf-pay-card h1[b-pen2jprf7j] {
    color: var(--rz-ink);
    font-family: Sora, Manrope, ui-sans-serif, system-ui, sans-serif;
    font-size: 30px;
    font-weight: 700;
    letter-spacing: -0.02em;
    line-height: 1.1;
    margin: 6px 0 4px;
}

.rf-pay-to[b-pen2jprf7j] {
    color: var(--rz-copy-muted);
    font-size: 15px;
}

.rf-pay-to b[b-pen2jprf7j] {
    color: var(--rz-ink);
}

.rf-pay-ref[b-pen2jprf7j] {
    color: var(--rz-copy-muted);
    font-size: 13.5px;
    margin-top: 4px;
}

.az-tag[b-pen2jprf7j] {
    background: var(--rz-chip-bg, rgba(30, 32, 96, 0.08));
    border-radius: 6px;
    color: var(--rz-ink);
    font-size: 12.5px;
    padding: 2px 8px;
}

.workspace-copy[b-pen2jprf7j] {
    color: var(--rz-copy-muted);
    font-size: 14px;
    margin-top: 8px;
}

.bp-lede[b-pen2jprf7j] {
    color: var(--rz-copy-muted);
    font-family: Sora, Manrope, ui-sans-serif, system-ui, sans-serif;
    font-size: 12px;
    font-weight: 700;
    letter-spacing: 0.08em;
    margin: 24px 0 12px;
    text-transform: uppercase;
}

.bp-list[b-pen2jprf7j] {
    display: grid;
    gap: 14px;
}

.bp-tile[b-pen2jprf7j] {
    align-items: center;
    background: var(--rz-surface);
    border: 1px solid var(--rz-border);
    border-radius: 14px;
    cursor: pointer;
    display: flex;
    gap: 16px;
    padding: 16px 18px;
    text-align: left;
    transition: transform 0.16s cubic-bezier(0.34, 1.56, 0.64, 1), border-color 0.16s, box-shadow 0.16s;
    width: 100%;
}

.bp-tile:hover:not(:disabled)[b-pen2jprf7j] {
    border-color: var(--teal);
    box-shadow: 0 10px 26px rgba(30, 32, 96, 0.14);
    transform: translateY(-2px);
}

.bp-tile:disabled[b-pen2jprf7j] {
    cursor: default;
    opacity: 0.65;
}

.bp-mono[b-pen2jprf7j] {
    align-items: center;
    border-radius: 12px;
    color: #fff;
    display: grid;
    flex: none;
    font-family: Sora, Manrope, ui-sans-serif, system-ui, sans-serif;
    font-size: 15px;
    font-weight: 700;
    height: 48px;
    justify-items: center;
    width: 48px;
}

/* Real brand-logo tile (drop-in SVG at /bank-logos/{connectorKey}.svg); the SVG is a full 48x48 rounded brand tile. */
.bp-logo-chip[b-pen2jprf7j] {
    background: transparent;
    overflow: hidden;
    padding: 0;
}

.bp-logo[b-pen2jprf7j] {
    display: block;
    height: 48px;
    width: 48px;
}

.bp-nm[b-pen2jprf7j] {
    display: flex;
    flex: 1;
    flex-direction: column;
    gap: 2px;
    min-width: 0;
}

.bp-nm b[b-pen2jprf7j] {
    color: var(--rz-ink);
    font-size: 15.5px;
    font-weight: 600;
}

.bp-sub[b-pen2jprf7j] {
    color: var(--teal-700);
    font-size: 12.5px;
    font-weight: 600;
}

.bp-hint[b-pen2jprf7j] {
    color: var(--rz-copy-muted);
    font-size: 12px;
}

.bp-go[b-pen2jprf7j] {
    align-items: center;
    color: var(--rz-ink);
    display: inline-flex;
    flex: none;
    font-family: Sora, Manrope, ui-sans-serif, system-ui, sans-serif;
    font-size: 13.5px;
    font-weight: 700;
    gap: 7px;
}

.bp-tile:hover:not(:disabled) .bp-go[b-pen2jprf7j] {
    color: var(--teal-700);
}

.bp-spin[b-pen2jprf7j] {
    animation: bp-spin-b-pen2jprf7j 0.7s linear infinite;
    border: 2px solid rgba(62, 207, 170, 0.3);
    border-radius: 50%;
    border-top-color: var(--teal);
    flex: none;
    height: 18px;
    width: 18px;
}

@keyframes bp-spin-b-pen2jprf7j {
    to {
        transform: rotate(360deg);
    }
}

.bp-foot[b-pen2jprf7j] {
    align-items: center;
    color: var(--rz-copy-muted);
    display: flex;
    font-size: 12.5px;
    gap: 8px;
    margin-top: 22px;
}

.bp-foot svg[b-pen2jprf7j] {
    color: var(--teal-700);
    flex: none;
}

.secondary-action[b-pen2jprf7j] {
    align-items: center;
    border: 1px solid var(--rz-border);
    border-radius: 10px;
    color: var(--rz-ink);
    display: inline-flex;
    font-size: 13px;
    font-weight: 600;
    height: 40px;
    margin-top: 16px;
    padding: 0 16px;
    text-decoration: none;
}
/* _content/ReflowUk.Web/Components/Shared/BankSelector.razor.rz.scp.css */
/* Search-first bank selector. Follows the app --rz-* light/dark tokens; teal accent matches the branded picker. */
.bs[b-hmzvh3w50f] {
    --teal: #3ecfaa;
    --teal-700: #177a60;
    display: block;
    max-width: 560px;
}

/* Search box */
.bs-search[b-hmzvh3w50f] {
    align-items: center;
    background: var(--rz-surface);
    border: 1px solid var(--rz-border);
    border-radius: 12px;
    box-shadow: var(--rz-shadow-card, var(--rz-shadow-lg));
    display: flex;
    gap: 10px;
    margin-bottom: 18px;
    padding: 0 14px;
    transition: border-color 0.16s, box-shadow 0.16s;
}

.bs-search:focus-within[b-hmzvh3w50f] {
    border-color: var(--teal);
    box-shadow: 0 0 0 3px rgba(62, 207, 170, 0.22);
}

.bs-search-ico[b-hmzvh3w50f] {
    color: var(--rz-copy-muted);
    flex: none;
}

.bs-input[b-hmzvh3w50f] {
    background: transparent;
    border: 0;
    color: var(--rz-ink);
    flex: 1;
    font-family: inherit;
    font-size: 15px;
    height: 46px;
    min-width: 0;
    outline: none;
}

.bs-input[b-hmzvh3w50f]::placeholder {
    color: var(--rz-copy-muted);
}

/* Section + group labels */
.bs-lbl[b-hmzvh3w50f],
.bs-grp[b-hmzvh3w50f] {
    align-items: baseline;
    color: var(--rz-copy-muted);
    display: flex;
    font-family: Sora, Manrope, ui-sans-serif, system-ui, sans-serif;
    font-size: 12px;
    font-weight: 700;
    gap: 8px;
    letter-spacing: 0.06em;
    margin: 18px 2px 10px;
    text-transform: uppercase;
}

.bs-lbl[b-hmzvh3w50f] {
    margin-top: 4px;
}

.bs-count[b-hmzvh3w50f] {
    color: var(--rz-copy-muted);
    font-size: 11px;
    font-weight: 600;
    letter-spacing: 0;
    opacity: 0.75;
}

/* Popular quick-picks */
.bs-pop[b-hmzvh3w50f] {
    display: grid;
    gap: 10px;
    grid-template-columns: repeat(auto-fill, minmax(150px, 1fr));
}

.bs-pill[b-hmzvh3w50f] {
    align-items: center;
    background: var(--rz-surface);
    border: 1px solid var(--rz-border);
    border-radius: 12px;
    color: var(--rz-ink);
    cursor: pointer;
    display: flex;
    font-family: inherit;
    gap: 10px;
    min-width: 0;
    padding: 9px 12px;
    text-align: left;
    transition: transform 0.16s cubic-bezier(0.34, 1.56, 0.64, 1), border-color 0.16s;
}

.bs-pill:hover:not(:disabled)[b-hmzvh3w50f] {
    border-color: var(--teal);
    transform: translateY(-2px);
}

.bs-pill:disabled[b-hmzvh3w50f] {
    cursor: default;
    opacity: 0.6;
}

.bs-pill-nm[b-hmzvh3w50f] {
    font-size: 13.5px;
    font-weight: 600;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

/* Divider */
.bs-div[b-hmzvh3w50f] {
    align-items: center;
    color: var(--rz-copy-muted);
    display: flex;
    font-size: 12px;
    gap: 12px;
    margin: 22px 0 4px;
}

.bs-div[b-hmzvh3w50f]::before,
.bs-div[b-hmzvh3w50f]::after {
    background: var(--rz-border);
    content: "";
    flex: 1;
    height: 1px;
}

/* Rows */
.bs-list[b-hmzvh3w50f] {
    display: grid;
    gap: 12px;
}

.bs-row[b-hmzvh3w50f] {
    align-items: center;
    background: var(--rz-surface);
    border: 1px solid var(--rz-border);
    border-radius: 14px;
    box-shadow: var(--rz-shadow-card, var(--rz-shadow-lg));
    cursor: pointer;
    display: flex;
    font-family: inherit;
    gap: 14px;
    padding: 14px 18px;
    text-align: left;
    transition: transform 0.16s cubic-bezier(0.34, 1.56, 0.64, 1), border-color 0.16s, box-shadow 0.16s;
    width: 100%;
}

.bs-row:hover:not(:disabled)[b-hmzvh3w50f] {
    border-color: var(--teal);
    box-shadow: 0 10px 26px rgba(30, 32, 96, 0.14);
    transform: translateY(-2px);
}

.bs-row:disabled[b-hmzvh3w50f] {
    cursor: default;
    opacity: 0.65;
}

/* Logo / monogram chip */
.bs-chip[b-hmzvh3w50f] {
    align-items: center;
    border-radius: 11px;
    color: #fff;
    display: grid;
    flex: none;
    font-family: Sora, Manrope, ui-sans-serif, system-ui, sans-serif;
    font-size: 14px;
    font-weight: 700;
    height: 44px;
    justify-items: center;
    width: 44px;
}

.bs-chip-logo[b-hmzvh3w50f] {
    background: transparent;
    overflow: hidden;
    padding: 0;
}

.bs-logo[b-hmzvh3w50f] {
    display: block;
    height: 44px;
    width: 44px;
}

.bs-nm[b-hmzvh3w50f] {
    display: flex;
    flex: 1;
    flex-direction: column;
    gap: 3px;
    min-width: 0;
}

.bs-nm-top[b-hmzvh3w50f] {
    align-items: center;
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
}

.bs-nm-top b[b-hmzvh3w50f] {
    color: var(--rz-ink);
    font-size: 15px;
    font-weight: 600;
}

.bs-hint[b-hmzvh3w50f] {
    color: var(--rz-copy-muted);
    font-size: 12px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

/* Capability badge */
.bs-badge[b-hmzvh3w50f] {
    border-radius: 999px;
    font-size: 10.5px;
    font-weight: 700;
    letter-spacing: 0.02em;
    line-height: 1;
    padding: 4px 8px;
    white-space: nowrap;
}

.bs-badge-pay[b-hmzvh3w50f] {
    background: rgba(62, 207, 170, 0.16);
    color: var(--teal-700);
}

.bs-badge-data[b-hmzvh3w50f] {
    background: var(--rz-border);
    color: var(--rz-copy-muted);
}

.bs-go[b-hmzvh3w50f] {
    align-items: center;
    color: var(--rz-ink);
    display: inline-flex;
    flex: none;
    font-family: Sora, Manrope, ui-sans-serif, system-ui, sans-serif;
    font-size: 13px;
    font-weight: 700;
    gap: 6px;
}

.bs-row:hover:not(:disabled) .bs-go[b-hmzvh3w50f] {
    color: var(--teal-700);
}

.bs-spin[b-hmzvh3w50f] {
    animation: bs-spin-b-hmzvh3w50f 0.7s linear infinite;
    border: 2px solid rgba(62, 207, 170, 0.3);
    border-radius: 50%;
    border-top-color: var(--teal);
    flex: none;
    height: 18px;
    width: 18px;
}

@keyframes bs-spin-b-hmzvh3w50f {
    to {
        transform: rotate(360deg);
    }
}

.bs-empty[b-hmzvh3w50f] {
    color: var(--rz-copy-muted);
    font-size: 14px;
    padding: 18px 2px;
}

@media (prefers-reduced-motion: reduce) {

    .bs-row[b-hmzvh3w50f],
    .bs-pill[b-hmzvh3w50f] {
        transition: none;
    }

    .bs-spin[b-hmzvh3w50f] {
        animation-duration: 1.4s;
    }
}
/* _content/ReflowUk.Web/Components/Shared/BrandLogo.razor.rz.scp.css */
.rf-logo[b-60jopnugoe] {
    align-items: center;
    color: var(--rz-ink);
    display: inline-flex;
    font-family: Sora, Manrope, ui-sans-serif, system-ui, sans-serif;
    font-size: 19px;
    font-weight: 800;
    gap: 10px;
    letter-spacing: -0.04em;
    line-height: 1;
}

/* The mark square keeps the brand navy in both themes so the chevrons stay legible,
   matching the approved mockup (navy square on light bars and on the navy panel alike). */
.rf-mk[b-60jopnugoe] {
    align-items: center;
    background: #1e2060;
    border-radius: 9px;
    display: grid;
    flex: none;
    height: 32px;
    justify-items: center;
    width: 32px;
}

.rf-mk svg[b-60jopnugoe] {
    height: 18px;
    width: 18px;
}

.rf-word[b-60jopnugoe] {
    white-space: nowrap;
}

.rf-logo.on-dark[b-60jopnugoe] {
    color: #fff;
}
