/* /Components/Layout/AuthLayout.razor.rz.scp.css */
.auth-page[b-s0g87za91x] {
    min-height: 100vh;
    display: flex;
    align-items: center;
    justify-content: center;
    background: var(--bg-body);
    padding: 1rem;
}

.auth-card[b-s0g87za91x] {
    width: 100%;
    max-width: 380px;
    background: var(--bg-card);
    border: 1px solid var(--border-color);
    border-radius: var(--border-radius);
    box-shadow: var(--shadow-md);
    padding: 2rem;
}

.auth-brand[b-s0g87za91x] {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 0.6rem;
    font-size: 1.7rem;
    font-weight: 700;
    color: var(--accent);
    text-align: center;
    margin-bottom: 1.25rem;
    letter-spacing: -0.5px;
}

.auth-logo[b-s0g87za91x] {
    width: 40px;
    height: 40px;
    border-radius: 8px;
    box-shadow: var(--shadow-md);
}
/* /Components/Layout/MainLayout.razor.rz.scp.css */
.page[b-zv0afgso55] {
    position: relative;
    display: flex;
    flex-direction: column;
}

main[b-zv0afgso55] {
    flex: 1;
    /* Without this a wide grid (e.g. the projection overview) stretches the flex item and the
       whole page scrolls sideways; min-width:0 lets it shrink so the grid scrolls inside its own
       overflow container instead. */
    min-width: 0;
}

.sidebar[b-zv0afgso55] {
    background-image: linear-gradient(180deg, #16294a 0%, #2f4d80 100%);
}

.top-row[b-zv0afgso55] {
    background-color: #f7f7f7;
    border-bottom: 1px solid #d6d5d5;
    justify-content: flex-end;
    height: 3.5rem;
    display: flex;
    align-items: center;
}

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

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

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

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

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

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

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

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

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

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

#blazor-error-ui[b-zv0afgso55] {
    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-zv0afgso55] {
        cursor: pointer;
        position: absolute;
        right: 0.75rem;
        top: 0.5rem;
    }
/* /Components/Layout/NavMenu.razor.rz.scp.css */
.navbar-toggler[b-hq257zinvk] {
    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.1);
    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.55%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.1);
}

.navbar-toggler:checked[b-hq257zinvk] {
    background-color: rgba(255, 255, 255, 0.5);
}

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

.navbar-brand[b-hq257zinvk] {
    font-size: 1.25rem;
    font-weight: 700;
    letter-spacing: -0.3px;
}

/* Little rounded "P" logo mark before the wordmark. */
.brand-mark[b-hq257zinvk] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 26px;
    height: 26px;
    border-radius: 7px;
    flex-shrink: 0;
    background: rgba(255, 255, 255, 0.16);
    border: 1px solid rgba(255, 255, 255, 0.22);
    color: #fff;
    font-size: 0.95rem;
    font-weight: 800;
    line-height: 1;
}

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

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

/* Inline SVG icons (declared in NavMenu markup, so scoped without ::deep). */
.nav-icon[b-hq257zinvk] {
    width: 1.15rem;
    height: 1.15rem;
    margin-right: 0.65rem;
    flex-shrink: 0;
}

/* NavLink renders its own <a> (needs ::deep); our group-toggle <button> is in-scope. */
.nav-item[b-hq257zinvk]  .nav-link,
.nav-item .nav-link[b-hq257zinvk] {
    color: #cdd6e4;
    background: none;
    border: none;
    border-radius: 6px;
    height: 2.7rem;
    display: flex;
    align-items: center;
    width: 100%;
    padding: 0 0.85rem;
    text-align: left;
    cursor: pointer;
}

.nav-item[b-hq257zinvk]  a.active {
    background-color: rgba(255, 255, 255, 0.18);
    color: #fff;
}

.nav-item[b-hq257zinvk]  .nav-link:hover,
.nav-item .nav-link:hover[b-hq257zinvk] {
    background-color: rgba(255, 255, 255, 0.1);
    color: #fff;
}

.nav-group-toggle[b-hq257zinvk] {
    user-select: none;
}

.nav-caret[b-hq257zinvk] {
    width: 0.85rem;
    height: 0.85rem;
    margin-left: auto;
    transition: transform 0.15s ease;
}

/* CSS-only collapse: hidden checkbox toggled by the label, drives the submenu + caret */
.nav-group-checkbox[b-hq257zinvk] {
    display: none;
}

.nav-submenu[b-hq257zinvk] {
    display: none;
}

.nav-group-checkbox:checked ~ .nav-submenu[b-hq257zinvk] {
    display: block;
}

.nav-group-checkbox:checked ~ .nav-item .nav-caret[b-hq257zinvk] {
    transform: rotate(180deg);
}

/* Catalogue submenu */
.nav-submenu .nav-item[b-hq257zinvk] {
    padding-bottom: 0.1rem;
}

    .nav-submenu .nav-item:first-of-type[b-hq257zinvk] {
        padding-top: 0.1rem;
    }

.nav-submenu[b-hq257zinvk]  .nav-link {
    height: 2.3rem;
    padding-left: 1.7rem;
    font-size: 0.84rem;
}

.nav-submenu .nav-icon[b-hq257zinvk] {
    width: 1rem;
    height: 1rem;
}

/* ── Third level: sub-groups (Master Data → Customers / Products / Misc) ── */
.nav-subgroup-toggle[b-hq257zinvk] {
    padding-left: 1.7rem !important;
    height: 2.3rem !important;
    font-size: 0.84rem;
}

.nav-subsubmenu[b-hq257zinvk]  .nav-link {
    padding-left: 2.7rem !important;
    height: 2.1rem;
    font-size: 0.82rem;
}

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

.navbar-toggler:checked ~ .nav-scrollable[b-hq257zinvk] {
    display: block;
}

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

    .nav-scrollable[b-hq257zinvk] {
        /* Flex column so the version footer pins to the bottom (Trophyst style):
           the nav scrolls, the footer stays. */
        display: flex;
        flex-direction: column;
        height: calc(100vh - 3.5rem);
    }

    .nav-scrollable > nav[b-hq257zinvk] {
        flex: 1;
        overflow-y: auto;
        /* Bootstrap's .nav is flex-wrap: wrap — with the constrained height that wraps
           overflowing items into a second column beside the menu. Scroll instead. */
        flex-wrap: nowrap;
    }
}

.version-footer[b-hq257zinvk] {
    padding-top: 0.75rem;
    padding-bottom: 0.75rem;
    border-top: 1px solid rgba(255, 255, 255, 0.12);
    flex-shrink: 0;
}

.version-link[b-hq257zinvk] {
    display: flex;
    align-items: center;
    gap: 0.4rem;
    color: rgba(255, 255, 255, 0.55);
    font-size: 0.8rem;
    text-decoration: none;
    transition: color 0.2s ease;
}

.version-link:hover[b-hq257zinvk] {
    color: #fff;
}

.version-link .nav-icon[b-hq257zinvk] {
    width: 14px;
    height: 14px;
}
/* /Components/Layout/ReconnectModal.razor.rz.scp.css */
.components-reconnect-first-attempt-visible[b-kcsie6nky2],
.components-reconnect-repeated-attempt-visible[b-kcsie6nky2],
.components-reconnect-failed-visible[b-kcsie6nky2],
.components-pause-visible[b-kcsie6nky2],
.components-resume-failed-visible[b-kcsie6nky2],
.components-rejoining-animation[b-kcsie6nky2] {
    display: none;
}

#components-reconnect-modal.components-reconnect-show .components-reconnect-first-attempt-visible[b-kcsie6nky2],
#components-reconnect-modal.components-reconnect-show .components-rejoining-animation[b-kcsie6nky2],
#components-reconnect-modal.components-reconnect-paused .components-pause-visible[b-kcsie6nky2],
#components-reconnect-modal.components-reconnect-resume-failed .components-resume-failed-visible[b-kcsie6nky2],
#components-reconnect-modal.components-reconnect-retrying[b-kcsie6nky2],
#components-reconnect-modal.components-reconnect-retrying .components-reconnect-repeated-attempt-visible[b-kcsie6nky2],
#components-reconnect-modal.components-reconnect-retrying .components-rejoining-animation[b-kcsie6nky2],
#components-reconnect-modal.components-reconnect-failed[b-kcsie6nky2],
#components-reconnect-modal.components-reconnect-failed .components-reconnect-failed-visible[b-kcsie6nky2] {
    display: block;
}


#components-reconnect-modal[b-kcsie6nky2] {
    background-color: white;
    width: 20rem;
    margin: 20vh auto;
    padding: 2rem;
    border: 0;
    border-radius: 0.5rem;
    box-shadow: 0 3px 6px 2px rgba(0, 0, 0, 0.3);
    opacity: 0;
    transition: display 0.5s allow-discrete, overlay 0.5s allow-discrete;
    animation: components-reconnect-modal-fadeOutOpacity-b-kcsie6nky2 0.5s both;
    &[open]

{
    animation: components-reconnect-modal-slideUp-b-kcsie6nky2 1.5s cubic-bezier(.05, .89, .25, 1.02) 0.3s, components-reconnect-modal-fadeInOpacity-b-kcsie6nky2 0.5s ease-in-out 0.3s;
    animation-fill-mode: both;
}

}

#components-reconnect-modal[b-kcsie6nky2]::backdrop {
    background-color: rgba(0, 0, 0, 0.4);
    animation: components-reconnect-modal-fadeInOpacity-b-kcsie6nky2 0.5s ease-in-out;
    opacity: 1;
}

@keyframes components-reconnect-modal-slideUp-b-kcsie6nky2 {
    0% {
        transform: translateY(30px) scale(0.95);
    }

    100% {
        transform: translateY(0);
    }
}

@keyframes components-reconnect-modal-fadeInOpacity-b-kcsie6nky2 {
    0% {
        opacity: 0;
    }

    100% {
        opacity: 1;
    }
}

@keyframes components-reconnect-modal-fadeOutOpacity-b-kcsie6nky2 {
    0% {
        opacity: 1;
    }

    100% {
        opacity: 0;
    }
}

.components-reconnect-container[b-kcsie6nky2] {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 1rem;
}

#components-reconnect-modal p[b-kcsie6nky2] {
    margin: 0;
    text-align: center;
}

#components-reconnect-modal button[b-kcsie6nky2] {
    border: 0;
    background-color: #6b9ed2;
    color: white;
    padding: 4px 24px;
    border-radius: 4px;
}

    #components-reconnect-modal button:hover[b-kcsie6nky2] {
        background-color: #3b6ea2;
    }

    #components-reconnect-modal button:active[b-kcsie6nky2] {
        background-color: #6b9ed2;
    }

.components-rejoining-animation[b-kcsie6nky2] {
    position: relative;
    width: 80px;
    height: 80px;
}

    .components-rejoining-animation div[b-kcsie6nky2] {
        position: absolute;
        border: 3px solid #0087ff;
        opacity: 1;
        border-radius: 50%;
        animation: components-rejoining-animation-b-kcsie6nky2 1.5s cubic-bezier(0, 0.2, 0.8, 1) infinite;
    }

        .components-rejoining-animation div:nth-child(2)[b-kcsie6nky2] {
            animation-delay: -0.5s;
        }

@keyframes components-rejoining-animation-b-kcsie6nky2 {
    0% {
        top: 40px;
        left: 40px;
        width: 0;
        height: 0;
        opacity: 0;
    }

    4.9% {
        top: 40px;
        left: 40px;
        width: 0;
        height: 0;
        opacity: 0;
    }

    5% {
        top: 40px;
        left: 40px;
        width: 0;
        height: 0;
        opacity: 1;
    }

    100% {
        top: 0px;
        left: 0px;
        width: 80px;
        height: 80px;
        opacity: 0;
    }
}
/* /Components/Layout/SignLayout.razor.rz.scp.css */
.sign-page[b-3a0ct16ol2] {
    min-height: 100vh;
    background: var(--bg-body, #f5f7fa);
    padding: 32px 16px;
    display: flex;
    justify-content: center;
    align-items: flex-start;
}

.sign-card[b-3a0ct16ol2] {
    width: 100%;
    max-width: 960px;
    background: var(--bg-card, #fff);
    border: 1px solid var(--border-color, #e5e7eb);
    border-radius: 14px;
    padding: 28px 32px;
    box-shadow: 0 2px 8px rgba(0, 0, 0, .06);
}

.sign-brand[b-3a0ct16ol2] {
    display: flex;
    align-items: center;
    gap: 10px;
    font-size: 1.25rem;
    font-weight: 700;
    color: var(--accent, #2563eb);
    margin-bottom: 20px;
    padding-bottom: 14px;
    border-bottom: 2px solid var(--accent, #2563eb);
}

.sign-logo[b-3a0ct16ol2] {
    width: 28px;
    height: 28px;
}
/* /Components/Layout/UserMenu.razor.rz.scp.css */
.user-menu[b-lzro0634gc] {
    position: relative;
    margin-left: 1rem;
}

.user-chip[b-lzro0634gc] {
    display: flex;
    align-items: center;
    gap: 0.45rem;
    background: none;
    border: 1px solid transparent;
    border-radius: 999px;
    padding: 0.3rem 0.8rem;
    color: #334155;
    font-size: 0.9rem;
    cursor: pointer;
    text-decoration: none;
    white-space: nowrap;
}

.user-chip:hover[b-lzro0634gc] {
    background-color: rgba(0, 0, 0, 0.05);
    border-color: rgba(0, 0, 0, 0.08);
}

.chip-icon[b-lzro0634gc] {
    width: 1.1rem;
    height: 1.1rem;
    flex-shrink: 0;
}

.chip-caret[b-lzro0634gc] {
    width: 0.75rem;
    height: 0.75rem;
    flex-shrink: 0;
}

.chip-name[b-lzro0634gc] {
    max-width: 14rem;
    overflow: hidden;
    text-overflow: ellipsis;
}

/* Invisible click-away layer under the dropdown */
.user-menu-backdrop[b-lzro0634gc] {
    position: fixed;
    inset: 0;
    z-index: 1040;
}

.user-menu-dropdown[b-lzro0634gc] {
    position: absolute;
    right: 0;
    top: calc(100% + 0.35rem);
    z-index: 1041;
    min-width: 15rem;
    background: var(--bg-surface, #fff);
    border: 1px solid rgba(0, 0, 0, 0.12);
    border-radius: 10px;
    box-shadow: 0 8px 24px rgba(15, 23, 42, 0.14);
    padding: 0.4rem;
}

.dropdown-user[b-lzro0634gc] {
    padding: 0.4rem 0.6rem;
}

.dropdown-entry[b-lzro0634gc] {
    display: flex;
    align-items: center;
    gap: 0.55rem;
    width: 100%;
    background: none;
    border: none;
    border-radius: 6px;
    padding: 0.45rem 0.6rem;
    font-size: 0.88rem;
    color: inherit;
    text-decoration: none;
    cursor: pointer;
    text-align: left;
}

.dropdown-entry:hover[b-lzro0634gc] {
    background-color: rgba(0, 0, 0, 0.06);
}

.entry-icon[b-lzro0634gc] {
    width: 1rem;
    height: 1rem;
    flex-shrink: 0;
}

/* ── Security tab ── */
.qr-box[b-lzro0634gc] {
    width: 180px;
    height: 180px;
    padding: 6px;
    background: #fff;
    border: 1px solid rgba(0, 0, 0, 0.12);
    border-radius: 8px;
}

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

.recovery-codes code[b-lzro0634gc] {
    font-size: 0.85rem;
}
/* /Components/Pages/Agreements/Details.razor.rz.scp.css */
/* Agreement line grid — same readable sizing and two-line header style as the projection grid. */
.agreement-grid[b-dxsoruelzw] {
    font-size: 0.9rem;
}

.agreement-grid th[b-dxsoruelzw] {
    font-size: 0.72rem;
    text-transform: uppercase;
    letter-spacing: 0.02em;
    font-weight: 600;
    color: var(--text-secondary, #4b5563);
    white-space: normal;      /* multi-line headers */
    line-height: 1.15;
    vertical-align: bottom;
}

/* No spinner buttons — arrow keys navigate the grid, typing edits the value */
.agreement-grid input[type="number"][b-dxsoruelzw]::-webkit-outer-spin-button,
.agreement-grid input[type="number"][b-dxsoruelzw]::-webkit-inner-spin-button {
    -webkit-appearance: none;
    margin: 0;
}

.agreement-grid input[type="number"][b-dxsoruelzw] {
    -moz-appearance: textfield;
    appearance: textfield;
}
/* /Components/Pages/Agreements/Reporting.razor.rz.scp.css */
/* ── KPI cards: Insight360/mock style — white card, tinted icon chip, big value ── */

.soa-kpis[b-785yz4miuj] {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(210px, 1fr));
    gap: 12px;
}

.soa-kpi[b-785yz4miuj] {
    background: var(--bg-card, #fff);
    border: 1px solid var(--border-color, #e5e7eb);
    border-radius: 14px;
    padding: 16px 18px;
    display: flex;
    flex-direction: column;
    gap: 6px;
    box-shadow: 0 1px 2px rgba(0, 0, 0, .04);
}

.soa-kpi-top[b-785yz4miuj] {
    display: flex;
    align-items: center;
    gap: 10px;
}

.soa-kpi-icon[b-785yz4miuj] {
    width: 40px;
    height: 40px;
    border-radius: 10px;
    background: color-mix(in srgb, var(--kpi-color, #888) 14%, transparent);
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
}

.soa-kpi-icon svg[b-785yz4miuj] {
    width: 20px;
    height: 20px;
    stroke: var(--kpi-color, #888);
    fill: none;
    stroke-width: 2;
    stroke-linecap: round;
    stroke-linejoin: round;
}

.soa-kpi-label[b-785yz4miuj] {
    font-size: 0.76rem;
    font-weight: 600;
    color: var(--text-muted, #6c757d);
    text-transform: uppercase;
    letter-spacing: 0.02em;
}

.soa-kpi-value[b-785yz4miuj] {
    font-size: 1.7rem;
    font-weight: 700;
    line-height: 1.1;
}

.soa-kpi-caption[b-785yz4miuj] {
    font-size: 0.74rem;
    color: var(--text-muted, #6c757d);
}
/* /Components/Pages/Changelog.razor.rz.scp.css */
.changelog-container[b-0y5o0m1a6a] {
    max-width: 800px;
}

.changelog-item[b-0y5o0m1a6a] {
    background: var(--bg-card, #fff);
    border-radius: 12px;
    margin-bottom: 1rem;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.08);
    overflow: hidden;
}

.changelog-item.latest[b-0y5o0m1a6a] {
    border: 2px solid var(--accent, #2563eb);
}

.changelog-header[b-0y5o0m1a6a] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 1rem 1.25rem;
    cursor: pointer;
    transition: background-color 0.2s ease;
}

.changelog-header:hover[b-0y5o0m1a6a] {
    background-color: var(--bg-subtle, #f5f7fa);
}

.version-badge[b-0y5o0m1a6a] {
    font-family: ui-monospace, SFMono-Regular, "SF Mono", Menlo, Monaco, Consolas, monospace;
    font-size: 0.95rem;
    font-weight: 600;
    color: var(--text-primary, #1f2937);
    padding: 0.25rem 0.75rem;
    background-color: var(--bg-subtle, #f5f7fa);
    border-radius: 6px;
}

.version-badge.badge-latest[b-0y5o0m1a6a] {
    background: linear-gradient(135deg, rgba(37, 99, 235, 0.15), rgba(37, 99, 235, 0.1));
    color: var(--accent, #2563eb);
}

.release-date[b-0y5o0m1a6a] {
    font-size: 0.875rem;
}

.expand-icon[b-0y5o0m1a6a] {
    color: var(--text-muted, #8a94a6);
    transition: transform 0.2s ease;
}

.expand-icon.expanded[b-0y5o0m1a6a] {
    transform: rotate(180deg);
}

.changelog-body[b-0y5o0m1a6a] {
    padding: 0 1.25rem 1.25rem;
    border-top: 1px solid var(--border-color, #e5e9f0);
}

.changes-list[b-0y5o0m1a6a] {
    list-style: none;
    padding: 0;
    margin: 1rem 0 0 0;
}

.changes-list li[b-0y5o0m1a6a] {
    position: relative;
    padding: 0.5rem 0 0.5rem 1.5rem;
    color: var(--text-secondary, #4b5563);
    line-height: 1.5;
}

.changes-list li[b-0y5o0m1a6a]::before {
    content: "";
    position: absolute;
    left: 0;
    top: 0.9rem;
    width: 6px;
    height: 6px;
    background-color: var(--accent, #2563eb);
    border-radius: 50%;
}
/* /Components/Pages/Customers/Reporting.razor.rz.scp.css */
/* ── KPI cards: same Insight360/mock style as the SOA dashboard ── */

.soa-kpis[b-drwu4qdj7j] {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(210px, 1fr));
    gap: 12px;
}

.soa-kpi[b-drwu4qdj7j] {
    background: var(--bg-card, #fff);
    border: 1px solid var(--border-color, #e5e7eb);
    border-radius: 14px;
    padding: 16px 18px;
    display: flex;
    flex-direction: column;
    gap: 6px;
    box-shadow: 0 1px 2px rgba(0, 0, 0, .04);
}

.soa-kpi-top[b-drwu4qdj7j] {
    display: flex;
    align-items: center;
    gap: 10px;
}

.soa-kpi-icon[b-drwu4qdj7j] {
    width: 40px;
    height: 40px;
    border-radius: 10px;
    background: color-mix(in srgb, var(--kpi-color, #888) 14%, transparent);
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
}

.soa-kpi-icon svg[b-drwu4qdj7j] {
    width: 20px;
    height: 20px;
    stroke: var(--kpi-color, #888);
    fill: none;
    stroke-width: 2;
    stroke-linecap: round;
    stroke-linejoin: round;
}

.soa-kpi-label[b-drwu4qdj7j] {
    font-size: 0.76rem;
    font-weight: 600;
    color: var(--text-muted, #6c757d);
    text-transform: uppercase;
    letter-spacing: 0.02em;
}

.soa-kpi-value[b-drwu4qdj7j] {
    font-size: 1.7rem;
    font-weight: 700;
    line-height: 1.1;
}

.soa-kpi-caption[b-drwu4qdj7j] {
    font-size: 0.74rem;
    color: var(--text-muted, #6c757d);
}

/* ── Customer table ── */

.row-link[b-drwu4qdj7j] {
    cursor: pointer;
}

.sortable[b-drwu4qdj7j] {
    cursor: pointer;
    user-select: none;
    white-space: nowrap;
}

.sortable:hover[b-drwu4qdj7j] {
    color: var(--accent, #2563eb);
}

/* ── KPI stacks beside the compact pie: two boxes share the column height ── */
.kpi-stack[b-drwu4qdj7j] {
    display: flex;
    flex-direction: column;
    gap: 1rem;
}

.kpi-stack .soa-kpi[b-drwu4qdj7j] {
    flex: 1;
}
/* /Components/Pages/Customers/ReportingDetails.razor.rz.scp.css */
/* ── KPI cards: same Insight360/mock style as the SOA dashboard ── */

.soa-kpis[b-uvx92ucib3] {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(210px, 1fr));
    gap: 12px;
}

.soa-kpi[b-uvx92ucib3] {
    background: var(--bg-card, #fff);
    border: 1px solid var(--border-color, #e5e7eb);
    border-radius: 14px;
    padding: 16px 18px;
    display: flex;
    flex-direction: column;
    gap: 6px;
    box-shadow: 0 1px 2px rgba(0, 0, 0, .04);
}

.soa-kpi-top[b-uvx92ucib3] {
    display: flex;
    align-items: center;
    gap: 10px;
}

.soa-kpi-icon[b-uvx92ucib3] {
    width: 40px;
    height: 40px;
    border-radius: 10px;
    background: color-mix(in srgb, var(--kpi-color, #888) 14%, transparent);
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
}

.soa-kpi-icon svg[b-uvx92ucib3] {
    width: 20px;
    height: 20px;
    stroke: var(--kpi-color, #888);
    fill: none;
    stroke-width: 2;
    stroke-linecap: round;
    stroke-linejoin: round;
}

.soa-kpi-label[b-uvx92ucib3] {
    font-size: 0.76rem;
    font-weight: 600;
    color: var(--text-muted, #6c757d);
    text-transform: uppercase;
    letter-spacing: 0.02em;
}

.soa-kpi-value[b-uvx92ucib3] {
    font-size: 1.7rem;
    font-weight: 700;
    line-height: 1.1;
}

.soa-kpi-caption[b-uvx92ucib3] {
    font-size: 0.74rem;
    color: var(--text-muted, #6c757d);
}

/* ── Status dot in the agreements table ── */

.status-dot[b-uvx92ucib3] {
    display: inline-block;
    width: 9px;
    height: 9px;
    border-radius: 50%;
    background: var(--dot, #6c757d);
    margin-right: 4px;
}

/* ── Detail pages: fixed 2 rows × 3 boxes (tidier than one long strip) ── */
.soa-kpis.two-rows[b-uvx92ucib3] {
    grid-template-columns: repeat(3, minmax(0, 1fr));
}

@media (max-width: 900px) {
    .soa-kpis.two-rows[b-uvx92ucib3] {
        grid-template-columns: repeat(auto-fit, minmax(210px, 1fr));
    }
}
/* /Components/Pages/Forecasts/Entry.razor.rz.scp.css */
/* Worksheet grid — Trophyst campaign-table header style + vertical field separators. */
.projection-grid[b-k3c370q2lj] {
    font-size: 12.6px;
    width: 100%;
}

.projection-grid th[b-k3c370q2lj] {
    font-size: 10.1px;
    text-transform: uppercase;
    letter-spacing: 0.02em;
    font-weight: 600;
    color: var(--text-secondary, #4b5563);
    white-space: normal;      /* multi-line headers */
    line-height: 1.15;
    padding: 0.3rem 0.4rem;
    vertical-align: bottom;
    border-bottom: 2px solid var(--border-color, #dbe1ea);
    border-right: 1px solid var(--border-color, #e5e9f0);
}

.projection-grid td[b-k3c370q2lj] {
    padding: 0.25rem 0.35rem;
    vertical-align: middle;
    border-right: 1px solid var(--border-color, #e5e9f0);
}

.projection-grid th:last-child[b-k3c370q2lj],
.projection-grid td:last-child[b-k3c370q2lj] {
    border-right: 0;
}

.projection-grid thead[b-k3c370q2lj] {
    position: sticky;
    top: 0;
    z-index: 5;
}

/* Opaque header cells + a soft drop-shadow, so scrolling rows don't ghost through the
   frozen header (the group-banner tints are translucent by design). */
.forecast-grid thead th[b-k3c370q2lj] {
    background-color: var(--bg-elevated, #fff);
}

.forecast-grid thead tr:last-child th[b-k3c370q2lj] {
    box-shadow: 0 6px 8px -6px rgba(0, 0, 0, 0.22);
}

/* The grid is its own bounded scroll panel so the header can truly freeze: sticky anchors
   to THIS scroll box, and the body scrolls under a frozen thead (Excel-style). The height is
   refined in JS (stickyStrip.fit) to reach the viewport bottom; this calc is the fallback. */
.forecast-scroll[b-k3c370q2lj] {
    max-height: calc(100vh - 240px);
    overflow: auto;
}

/* Keep keyboard/focus navigation from tucking a row under the (tall) sticky header.
   --fc-strip-h is the measured header height, published by stickyStrip.sync. */
.forecast-grid tbody tr[b-k3c370q2lj],
.forecast-grid tbody input[b-k3c370q2lj] {
    scroll-margin-top: calc(var(--fc-strip-h, 120px) + 0.5rem);
}

/* ── Mini-calendar rides inside the sticky <thead> as its own full-width row ── */
.forecast-grid .fc-cal-cell[b-k3c370q2lj] {
    padding: 0 !important;
    border: 0 !important;
    text-transform: none;
    letter-spacing: normal;
    font-weight: 400;
    vertical-align: top;
    border-bottom: 1px solid var(--border-color, #dbe1ea) !important;
}

.fc-oneliner[b-k3c370q2lj] {
    background: var(--bg-elevated, #fff);
    overflow: hidden;
}

/* The harvested pcal, sized for the header context. */
.fc-ol-pcal .pcal-track[b-k3c370q2lj] {
    min-width: 640px;
}

.fc-ol-pcal .pcal-label[b-k3c370q2lj] {
    background: var(--bg-elevated, #fff);
}

/* Normal-price field focused: campaign bars dim, the window shading reads as "outside". */
.fc-oneliner.fc-outside .pcal-bar[b-k3c370q2lj] {
    opacity: 0.4;
}

.fc-oneliner.fc-outside .pcal-inperiod[b-k3c370q2lj] {
    background: rgba(22, 163, 74, 0.1);
}

.projection-grid tbody tr:hover[b-k3c370q2lj] {
    background-color: rgba(37, 99, 235, 0.05);
}

/* Compact inputs so the grid rows stay tight */
.projection-grid input.form-control-sm[b-k3c370q2lj] {
    padding: 0.15rem 0.3rem;
    font-size: 11.9px;
}

/* No spinner buttons — arrow keys navigate the grid, typing edits the value */
.projection-grid input[type="number"][b-k3c370q2lj]::-webkit-outer-spin-button,
.projection-grid input[type="number"][b-k3c370q2lj]::-webkit-inner-spin-button {
    -webkit-appearance: none;
    margin: 0;
}

.projection-grid input[type="number"][b-k3c370q2lj] {
    -moz-appearance: textfield;
    appearance: textfield;
}

/* Perspective group banner + customer-group tinting */
.projection-grid .grp-row th[b-k3c370q2lj] {
    text-align: center;
    font-size: 9.8px;
    letter-spacing: 0.06em;
    padding: 0.25rem 0.4rem;
    border-bottom: 1px solid var(--border-color, #dbe1ea);
    vertical-align: middle;
}

.projection-grid .grp-blank[b-k3c370q2lj] {
    border-right: 0;
}

/* Tints layered as an image over the opaque header background above (so they stay opaque). */
.projection-grid .grp-our[b-k3c370q2lj] {
    background-image: linear-gradient(rgba(37, 99, 235, 0.10), rgba(37, 99, 235, 0.10));
    color: #1d4ed8;
}

.projection-grid .grp-customer[b-k3c370q2lj] {
    background-image: linear-gradient(rgba(217, 119, 6, 0.12), rgba(217, 119, 6, 0.12));
    color: #b45309;
}

.projection-grid th.grp-customer-col[b-k3c370q2lj] {
    background: rgba(217, 119, 6, 0.06);
}

.projection-grid td.grp-customer-col[b-k3c370q2lj] {
    background: rgba(217, 119, 6, 0.03);
}
/* /Components/Pages/Home.razor.rz.scp.css */
/* ── Promora dashboard — ported from Trophyst Home (hd-*) ── */

/* Card shell */
.hd-card[b-40apetgema] {
    background-color: var(--bg-card);
    border: 1px solid var(--border-color);
    border-radius: 12px;
    overflow: hidden;
}

/* Greeting */
.hd-hello[b-40apetgema] {
    font-size: 28px;
    font-weight: 700;
    color: var(--text-strong);
}

.hd-subtitle[b-40apetgema] {
    color: var(--text-secondary);
    font-size: 14px;
}

/* KPI action cards */
.hd-kpis[b-40apetgema] {
    display: flex;
    flex-direction: column;
    gap: 14px;
}

.hd-kpi-row[b-40apetgema] {
    display: flex;
    gap: 14px;
}

.hd-kpi[b-40apetgema] {
    flex: 1 1 0;
    min-width: 0;
    display: flex;
    align-items: flex-start;
    gap: 10px;
    text-align: left;
    padding: 13px 14px;
    background: var(--bg-card);
    border: 1px solid var(--border-color);
    border-radius: 12px;
    cursor: pointer;
    transition: transform 0.15s, box-shadow 0.15s, border-color 0.15s;
}

.hd-kpi:hover:not(:disabled)[b-40apetgema] {
    border-color: var(--kpi-color, var(--text-muted));
    box-shadow: 0 6px 16px rgba(0, 0, 0, 0.08);
    transform: translateY(-2px);
}

.hd-kpi:disabled[b-40apetgema] { cursor: default; opacity: 0.85; }
.hd-kpi:focus-visible[b-40apetgema] { outline: 2px solid var(--kpi-color, var(--text-muted)); outline-offset: 2px; }

.hd-kpi-icon[b-40apetgema] {
    width: 34px;
    height: 34px;
    border-radius: 10px;
    background: var(--kpi-color, #ced4da);
    color: #fff;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
}

.hd-kpi-icon svg[b-40apetgema] {
    width: 18px; height: 18px;
    stroke: currentColor; fill: none;
    stroke-width: 2; stroke-linecap: round; stroke-linejoin: round;
}

.hd-kpi-body[b-40apetgema] { min-width: 0; flex: 1; }

.hd-kpi-title[b-40apetgema] {
    font-size: 12.5px;
    font-weight: 700;
    color: var(--text-strong);
    line-height: 1.2;
}

.hd-kpi-desc[b-40apetgema] {
    font-size: 11px;
    color: var(--text-secondary);
    margin-top: 2px;
    line-height: 1.25;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

.hd-kpi-link[b-40apetgema] {
    display: inline-block;
    margin-top: 8px;
    font-size: 12px;
    font-weight: 600;
    color: var(--kpi-color, var(--text-secondary));
}

.hd-kpi-count[b-40apetgema] {
    font-size: 24px;
    font-weight: 700;
    line-height: 1;
    color: var(--text-strong);
    flex-shrink: 0;
}

.hd-panel-footnote[b-40apetgema] {
    padding: 8px 18px 2px;
    font-size: 12px;
    color: var(--text-muted);
}
.hd-panel-footnote a[b-40apetgema] { color: var(--text-secondary); }

/* Narrower viewports: let the balanced rows wrap to fewer, wider cards. */
@media (max-width: 1100px) {
    .hd-kpi-row[b-40apetgema] { flex-wrap: wrap; }
    .hd-kpi[b-40apetgema] { flex: 1 1 44%; }
}

@media (max-width: 560px) {
    .hd-kpi[b-40apetgema] { flex: 1 1 100%; }
}

/* Panel header */
.hd-panel-header[b-40apetgema] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 14px 18px;
    border-bottom: 1px solid var(--border-subtle);
}

.hd-panel-title[b-40apetgema] {
    font-size: 15px;
    font-weight: 700;
    color: var(--text-strong);
}

.hd-panel-caption[b-40apetgema] {
    font-size: 12px;
    color: var(--text-muted);
    margin-top: 2px;
}

.hd-panel-action[b-40apetgema] {
    font-size: 13px;
    font-weight: 600;
    color: var(--accent);
    text-decoration: none;
    white-space: nowrap;
}

.hd-panel-action:hover[b-40apetgema] { text-decoration: underline; }
.hd-panel-body[b-40apetgema] { padding: 16px 18px; }
.hd-panel-body.p-0[b-40apetgema] { padding: 0; }

/* Pipeline */
.hd-pipeline-wrap[b-40apetgema] {
    display: flex;
    align-items: stretch;
    gap: 18px;
}

.hd-pipeline[b-40apetgema] {
    display: grid;
    grid-template-columns: repeat(var(--steps, 5), minmax(0, 1fr));
    gap: 12px;
    flex: 1;
}

.hd-pipeline-step[b-40apetgema] {
    position: relative;
    background: var(--bg-subtle);
    border: 1px solid var(--border-color);
    border-radius: 10px;
    padding: 14px 6px 12px;
    display: flex;
    flex-direction: column;
    align-items: center;
    text-align: center;
    cursor: pointer;
    transition: transform 0.15s, box-shadow 0.15s, border-color 0.15s;
}

.hd-pipeline-step:hover:not(:disabled)[b-40apetgema] {
    border-color: var(--stage-color, var(--text-muted));
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.08);
    transform: translateY(-2px);
}

.hd-pipeline-step:focus-visible[b-40apetgema] { outline: 2px solid var(--stage-color, var(--text-muted)); outline-offset: 1px; }
.hd-pipeline-step:disabled[b-40apetgema] { cursor: default; }

.hd-pipeline-circle[b-40apetgema] {
    width: 38px; height: 38px;
    border-radius: 50%;
    background: var(--stage-color, #ced4da);
    color: #fff;
    display: flex; align-items: center; justify-content: center;
    margin-bottom: 8px;
    flex-shrink: 0;
}

.hd-pipeline-circle svg[b-40apetgema] {
    width: 19px; height: 19px;
    stroke: currentColor; fill: none;
    stroke-width: 2; stroke-linecap: round; stroke-linejoin: round;
}

.hd-pipeline-label[b-40apetgema] {
    font-size: 10px;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.3px;
    line-height: 1.2;
    color: var(--text-secondary);
    min-height: 24px;
    display: flex; align-items: center; justify-content: center;
}

.hd-pipeline-count[b-40apetgema] {
    font-size: 22px;
    font-weight: 700;
    color: var(--text-strong);
    line-height: 1;
    margin-top: 6px;
}

.hd-pipeline-step-arrow[b-40apetgema]::after {
    content: "";
    position: absolute;
    top: 30px;
    right: -10px;
    transform: translateY(-50%);
    width: 12px; height: 12px;
    background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23ccd1d6' stroke-width='2.5' stroke-linecap='round' stroke-linejoin='round'><polyline points='9 18 15 12 9 6'/></svg>");
    background-size: contain; background-repeat: no-repeat; background-position: center;
    z-index: 1; pointer-events: none;
}

.hd-pipeline-summary[b-40apetgema] {
    display: flex;
    flex-direction: column;
    justify-content: center;
    gap: 14px;
    padding: 8px 18px;
    border-left: 1px solid var(--border-subtle);
    min-width: 150px;
}

.hd-summary-stat[b-40apetgema] { text-align: center; }

.hd-summary-num[b-40apetgema] {
    font-size: 26px;
    font-weight: 700;
    color: var(--text-strong);
    line-height: 1;
}

.hd-summary-accent[b-40apetgema] { color: var(--accent); }

.hd-summary-label[b-40apetgema] {
    font-size: 11px;
    text-transform: uppercase;
    letter-spacing: 0.4px;
    font-weight: 600;
    color: var(--text-secondary);
    margin-top: 5px;
}

.hd-summary-divider[b-40apetgema] { height: 1px; background: var(--border-subtle); }

@media (max-width: 992px) {
    .hd-pipeline-wrap[b-40apetgema] { flex-direction: column; }
    .hd-pipeline[b-40apetgema] { grid-template-columns: repeat(4, 1fr); }
    .hd-pipeline-step-arrow[b-40apetgema]::after { display: none; }
    .hd-pipeline-summary[b-40apetgema] {
        flex-direction: row;
        justify-content: space-around;
        border-left: none;
        border-top: 1px solid var(--border-subtle);
        padding-top: 14px;
    }
    .hd-summary-divider[b-40apetgema] { width: 1px; height: auto; }
}

@media (max-width: 560px) {
    .hd-pipeline[b-40apetgema] { grid-template-columns: repeat(2, 1fr); }
}

/* Table links inside panels */
[b-40apetgema] .table a {
    color: var(--accent);
    text-decoration: none;
    font-weight: 500;
}

[b-40apetgema] .table a:hover { text-decoration: underline; }
/* /Components/Pages/Products/Reporting.razor.rz.scp.css */
/* ── KPI cards: same Insight360/mock style as the SOA dashboard ── */

.soa-kpis[b-ezaktehu39] {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(210px, 1fr));
    gap: 12px;
}

.soa-kpi[b-ezaktehu39] {
    background: var(--bg-card, #fff);
    border: 1px solid var(--border-color, #e5e7eb);
    border-radius: 14px;
    padding: 16px 18px;
    display: flex;
    flex-direction: column;
    gap: 6px;
    box-shadow: 0 1px 2px rgba(0, 0, 0, .04);
}

.soa-kpi-top[b-ezaktehu39] {
    display: flex;
    align-items: center;
    gap: 10px;
}

.soa-kpi-icon[b-ezaktehu39] {
    width: 40px;
    height: 40px;
    border-radius: 10px;
    background: color-mix(in srgb, var(--kpi-color, #888) 14%, transparent);
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
}

.soa-kpi-icon svg[b-ezaktehu39] {
    width: 20px;
    height: 20px;
    stroke: var(--kpi-color, #888);
    fill: none;
    stroke-width: 2;
    stroke-linecap: round;
    stroke-linejoin: round;
}

.soa-kpi-label[b-ezaktehu39] {
    font-size: 0.76rem;
    font-weight: 600;
    color: var(--text-muted, #6c757d);
    text-transform: uppercase;
    letter-spacing: 0.02em;
}

.soa-kpi-value[b-ezaktehu39] {
    font-size: 1.7rem;
    font-weight: 700;
    line-height: 1.1;
}

.soa-kpi-caption[b-ezaktehu39] {
    font-size: 0.74rem;
    color: var(--text-muted, #6c757d);
}

/* ── Customer table ── */

.row-link[b-ezaktehu39] {
    cursor: pointer;
}

.sortable[b-ezaktehu39] {
    cursor: pointer;
    user-select: none;
    white-space: nowrap;
}

.sortable:hover[b-ezaktehu39] {
    color: var(--accent, #2563eb);
}

/* ── KPI stacks beside the compact pie: two boxes share the column height ── */
.kpi-stack[b-ezaktehu39] {
    display: flex;
    flex-direction: column;
    gap: 1rem;
}

.kpi-stack .soa-kpi[b-ezaktehu39] {
    flex: 1;
}
/* /Components/Pages/Products/ReportingDetails.razor.rz.scp.css */
/* ── KPI cards: same Insight360/mock style as the SOA dashboard ── */

.soa-kpis[b-fprc174o8l] {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(210px, 1fr));
    gap: 12px;
}

.soa-kpi[b-fprc174o8l] {
    background: var(--bg-card, #fff);
    border: 1px solid var(--border-color, #e5e7eb);
    border-radius: 14px;
    padding: 16px 18px;
    display: flex;
    flex-direction: column;
    gap: 6px;
    box-shadow: 0 1px 2px rgba(0, 0, 0, .04);
}

.soa-kpi-top[b-fprc174o8l] {
    display: flex;
    align-items: center;
    gap: 10px;
}

.soa-kpi-icon[b-fprc174o8l] {
    width: 40px;
    height: 40px;
    border-radius: 10px;
    background: color-mix(in srgb, var(--kpi-color, #888) 14%, transparent);
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
}

.soa-kpi-icon svg[b-fprc174o8l] {
    width: 20px;
    height: 20px;
    stroke: var(--kpi-color, #888);
    fill: none;
    stroke-width: 2;
    stroke-linecap: round;
    stroke-linejoin: round;
}

.soa-kpi-label[b-fprc174o8l] {
    font-size: 0.76rem;
    font-weight: 600;
    color: var(--text-muted, #6c757d);
    text-transform: uppercase;
    letter-spacing: 0.02em;
}

.soa-kpi-value[b-fprc174o8l] {
    font-size: 1.7rem;
    font-weight: 700;
    line-height: 1.1;
}

.soa-kpi-caption[b-fprc174o8l] {
    font-size: 0.74rem;
    color: var(--text-muted, #6c757d);
}

/* ── Status dot in the agreements table ── */

.status-dot[b-fprc174o8l] {
    display: inline-block;
    width: 9px;
    height: 9px;
    border-radius: 50%;
    background: var(--dot, #6c757d);
    margin-right: 4px;
}

/* ── Detail pages: fixed 2 rows × 3 boxes (tidier than one long strip) ── */
.soa-kpis.two-rows[b-fprc174o8l] {
    grid-template-columns: repeat(3, minmax(0, 1fr));
}

@media (max-width: 900px) {
    .soa-kpis.two-rows[b-fprc174o8l] {
        grid-template-columns: repeat(auto-fit, minmax(210px, 1fr));
    }
}
/* /Components/Pages/Projections/CategoryDetails.razor.rz.scp.css */
/* Worksheet grid — Trophyst campaign-table header style + vertical field separators. */
.projection-grid[b-fg2rh2as0g] {
    font-size: 12.6px;
    width: 100%;
}

.projection-grid th[b-fg2rh2as0g] {
    font-size: 10.1px;
    text-transform: uppercase;
    letter-spacing: 0.02em;
    font-weight: 600;
    color: var(--text-secondary, #4b5563);
    white-space: normal;      /* multi-line headers */
    line-height: 1.15;
    padding: 0.3rem 0.4rem;
    vertical-align: bottom;
    border-bottom: 2px solid var(--border-color, #dbe1ea);
    border-right: 1px solid var(--border-color, #e5e9f0);
}

.projection-grid td[b-fg2rh2as0g] {
    padding: 0.25rem 0.35rem;
    vertical-align: middle;
    border-right: 1px solid var(--border-color, #e5e9f0);
}

.projection-grid th:last-child[b-fg2rh2as0g],
.projection-grid td:last-child[b-fg2rh2as0g] {
    border-right: 0;
}

.projection-grid thead[b-fg2rh2as0g] {
    position: sticky;
    top: 0;
    z-index: 5;
}

.projection-grid tbody tr:hover[b-fg2rh2as0g] {
    background-color: rgba(37, 99, 235, 0.05);
}

/* Compact inputs so the grid rows stay tight */
.projection-grid input.form-control-sm[b-fg2rh2as0g] {
    padding: 0.15rem 0.3rem;
    font-size: 11.9px;
}

/* No spinner buttons — arrow keys navigate the grid, typing edits the value */
.projection-grid input[type="number"][b-fg2rh2as0g]::-webkit-outer-spin-button,
.projection-grid input[type="number"][b-fg2rh2as0g]::-webkit-inner-spin-button {
    -webkit-appearance: none;
    margin: 0;
}

.projection-grid input[type="number"][b-fg2rh2as0g] {
    -moz-appearance: textfield;
    appearance: textfield;
}

/* Perspective group banner + customer-group tinting */
.projection-grid .grp-row th[b-fg2rh2as0g] {
    text-align: center;
    font-size: 9.8px;
    letter-spacing: 0.06em;
    padding: 0.25rem 0.4rem;
    border-bottom: 1px solid var(--border-color, #dbe1ea);
    vertical-align: middle;
}

.projection-grid .grp-blank[b-fg2rh2as0g] {
    background: transparent;
    border-right: 0;
}

.projection-grid .grp-our[b-fg2rh2as0g] {
    background: rgba(37, 99, 235, 0.08);
    color: #1d4ed8;
}

.projection-grid .grp-customer[b-fg2rh2as0g] {
    background: rgba(217, 119, 6, 0.10);
    color: #b45309;
}

.projection-grid th.grp-customer-col[b-fg2rh2as0g] {
    background: rgba(217, 119, 6, 0.06);
}

.projection-grid td.grp-customer-col[b-fg2rh2as0g] {
    background: rgba(217, 119, 6, 0.03);
}

/* Compact "apply to all customers of this article" button on Support / RRP cells. */
.fill-all-btn[b-fg2rh2as0g] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 20px;
    height: 20px;
    padding: 0;
    flex-shrink: 0;
    border: 1px solid var(--border-color, #ccd2da);
    border-radius: 4px;
    background: var(--bs-body-bg, #fff);
    color: var(--bs-secondary-color, #6b7280);
    cursor: pointer;
    line-height: 1;
}

.fill-all-btn:hover[b-fg2rh2as0g] {
    background: rgba(37, 99, 235, 0.10);
    border-color: rgba(37, 99, 235, 0.55);
    color: #1d4ed8;
}

.fill-all-btn:disabled[b-fg2rh2as0g] {
    opacity: 0.45;
    cursor: default;
}

.fill-all-btn svg[b-fg2rh2as0g] {
    width: 12px;
    height: 12px;
    fill: none;
    stroke: currentColor;
    stroke-width: 2;
    stroke-linecap: round;
    stroke-linejoin: round;
}

/* ── Timeline overview: product rows × week columns, campaign blocks tinted ── */
.ovw-scroll[b-fg2rh2as0g] {
    overflow-x: auto;
}

.ovw-grid[b-fg2rh2as0g] {
    border-collapse: separate;
    border-spacing: 0;
    width: max-content;
    min-width: 100%;
    font-size: 0.8rem;
}

.ovw-grid th[b-fg2rh2as0g],
.ovw-grid td[b-fg2rh2as0g] {
    border-right: 1px solid var(--border-color, #e5e7eb);
    border-bottom: 1px solid var(--border-color, #e5e7eb);
    padding: 3px 6px;
    text-align: center;
    white-space: nowrap;
}

.ovw-grid .ovw-wk[b-fg2rh2as0g] {
    min-width: 42px;
    font-weight: 600;
    color: var(--bs-secondary-color, #6b7280);
    background: var(--bs-tertiary-bg, #f8f9fa);
}

.ovw-grid .ovw-month[b-fg2rh2as0g] {
    font-weight: 600;
    background: var(--bs-tertiary-bg, #f8f9fa);
    color: var(--bs-secondary-color, #6b7280);
    letter-spacing: 0.03em;
}

/* Product label column pinned while the timeline scrolls sideways. */
.ovw-grid .ovw-prod[b-fg2rh2as0g] {
    position: sticky;
    left: 0;
    z-index: 2;
    background: var(--bs-body-bg, #fff);
    text-align: left;
    min-width: 170px;
    max-width: 220px;
    border-right: 2px solid var(--border-color, #d1d5db);
}

.ovw-grid thead .ovw-prod[b-fg2rh2as0g] {
    z-index: 3;
    background: var(--bs-tertiary-bg, #f8f9fa);
}

.ovw-grid .ovw-prod-art[b-fg2rh2as0g] {
    font-weight: 600;
}

.ovw-grid .ovw-prod-name[b-fg2rh2as0g] {
    font-size: 0.72rem;
    color: var(--bs-secondary-color, #6b7280);
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    max-width: 210px;
}

.ovw-grid .ovw-prod-cust[b-fg2rh2as0g] {
    font-size: 0.74rem;
    font-weight: 600;
    color: #b45309;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    max-width: 210px;
}

/* Multi-select customer dropdown (native <details>; click-away handled globally in app.js). */
.ms-dd[b-fg2rh2as0g] {
    position: relative;
}

.ms-dd > summary[b-fg2rh2as0g] {
    list-style: none;
    cursor: pointer;
    min-width: 11rem;
    white-space: nowrap;
}

.ms-dd > summary[b-fg2rh2as0g]::-webkit-details-marker {
    display: none;
}

.ms-panel[b-fg2rh2as0g] {
    position: absolute;
    right: 0;
    z-index: 30;
    margin-top: 2px;
    background: var(--bs-body-bg, #fff);
    border: 1px solid var(--border-color, #dee2e6);
    border-radius: 8px;
    padding: 8px;
    min-width: 14rem;
    max-height: 320px;
    overflow: auto;
    box-shadow: 0 6px 16px rgba(0, 0, 0, 0.12);
}

.ms-actions[b-fg2rh2as0g] {
    display: flex;
    align-items: center;
    padding-bottom: 6px;
    margin-bottom: 4px;
    border-bottom: 1px solid var(--border-color, #eee);
}

.ms-item[b-fg2rh2as0g] {
    display: block;
    font-size: 0.85rem;
    padding: 2px 0;
    cursor: pointer;
}

.ms-item input[b-fg2rh2as0g] {
    margin-right: 6px;
}

/* Campaign block vs the ordinary stretch between campaigns. Each campaign block carries a
   leading divider and alternates its tint so two adjacent campaigns stay distinct. */
.ovw-grid td.ovw-camp[b-fg2rh2as0g] {
    background: rgba(37, 99, 235, 0.12);
    color: #1d4ed8;
    font-weight: 600;
    border-left: 2px solid rgba(37, 99, 235, 0.55);
}

.ovw-grid td.ovw-camp.ovw-camp-alt[b-fg2rh2as0g] {
    background: rgba(37, 99, 235, 0.24);
}

.ovw-grid td.ovw-ord[b-fg2rh2as0g] {
    color: var(--bs-secondary-color, #6b7280);
}

.ovw-grid td.ovw-clickable[b-fg2rh2as0g] {
    cursor: pointer;
}

.ovw-grid td.ovw-clickable:hover[b-fg2rh2as0g] {
    outline: 2px solid rgba(37, 99, 235, 0.8);
    outline-offset: -2px;
}

/* Flash the worksheet line jumped to from the overview, fading back to normal. */
tr.ws-hl > td[b-fg2rh2as0g] {
    animation: ws-flash-b-fg2rh2as0g 2.4s ease-out 1;
}

@keyframes ws-flash-b-fg2rh2as0g {
    0% { background-color: rgba(244, 63, 94, 0.40); }
    100% { background-color: transparent; }
}
/* /Components/Pages/Projections/Details.razor.rz.scp.css */
/* Worksheet grid — Trophyst campaign-table header style + vertical field separators. */
.projection-grid[b-kilr4bi1hg] {
    font-size: 12.6px;
    width: 100%;
}

.projection-grid th[b-kilr4bi1hg] {
    font-size: 10.1px;
    text-transform: uppercase;
    letter-spacing: 0.02em;
    font-weight: 600;
    color: var(--text-secondary, #4b5563);
    white-space: normal;      /* multi-line headers */
    line-height: 1.15;
    padding: 0.3rem 0.4rem;
    vertical-align: bottom;
    border-bottom: 2px solid var(--border-color, #dbe1ea);
    border-right: 1px solid var(--border-color, #e5e9f0);
}

.projection-grid td[b-kilr4bi1hg] {
    padding: 0.25rem 0.35rem;
    vertical-align: middle;
    border-right: 1px solid var(--border-color, #e5e9f0);
}

.projection-grid th:last-child[b-kilr4bi1hg],
.projection-grid td:last-child[b-kilr4bi1hg] {
    border-right: 0;
}

.projection-grid thead[b-kilr4bi1hg] {
    position: sticky;
    top: 0;
    z-index: 5;
}

.projection-grid tbody tr:hover[b-kilr4bi1hg] {
    background-color: rgba(37, 99, 235, 0.05);
}

/* Compact inputs so the grid rows stay tight */
.projection-grid input.form-control-sm[b-kilr4bi1hg] {
    padding: 0.15rem 0.3rem;
    font-size: 11.9px;
}

/* No spinner buttons — arrow keys navigate the grid, typing edits the value */
.projection-grid input[type="number"][b-kilr4bi1hg]::-webkit-outer-spin-button,
.projection-grid input[type="number"][b-kilr4bi1hg]::-webkit-inner-spin-button {
    -webkit-appearance: none;
    margin: 0;
}

.projection-grid input[type="number"][b-kilr4bi1hg] {
    -moz-appearance: textfield;
    appearance: textfield;
}

/* Perspective group banner + customer-group tinting */
.projection-grid .grp-row th[b-kilr4bi1hg] {
    text-align: center;
    font-size: 9.8px;
    letter-spacing: 0.06em;
    padding: 0.25rem 0.4rem;
    border-bottom: 1px solid var(--border-color, #dbe1ea);
    vertical-align: middle;
}

.projection-grid .grp-blank[b-kilr4bi1hg] {
    background: transparent;
    border-right: 0;
}

.projection-grid .grp-our[b-kilr4bi1hg] {
    background: rgba(37, 99, 235, 0.08);
    color: #1d4ed8;
}

.projection-grid .grp-customer[b-kilr4bi1hg] {
    background: rgba(217, 119, 6, 0.10);
    color: #b45309;
}

.projection-grid th.grp-customer-col[b-kilr4bi1hg] {
    background: rgba(217, 119, 6, 0.06);
}

.projection-grid td.grp-customer-col[b-kilr4bi1hg] {
    background: rgba(217, 119, 6, 0.03);
}

/* ── Overview tab: product rows × week columns, campaign blocks tinted ── */
.ovw-scroll[b-kilr4bi1hg] { overflow-x: auto; }

.ovw-grid[b-kilr4bi1hg] {
    border-collapse: separate;
    border-spacing: 0;
    width: max-content;
    min-width: 100%;
    font-size: 0.8rem;
}

.ovw-grid th[b-kilr4bi1hg],
.ovw-grid td[b-kilr4bi1hg] {
    border-right: 1px solid var(--border-color, #e5e7eb);
    border-bottom: 1px solid var(--border-color, #e5e7eb);
    padding: 3px 6px;
    text-align: center;
    white-space: nowrap;
}

.ovw-grid .ovw-wk[b-kilr4bi1hg] {
    min-width: 42px;
    font-weight: 600;
    color: var(--bs-secondary-color, #6b7280);
    background: var(--bs-tertiary-bg, #f8f9fa);
}

.ovw-grid .ovw-month[b-kilr4bi1hg] {
    font-weight: 600;
    background: var(--bs-tertiary-bg, #f8f9fa);
    color: var(--bs-secondary-color, #6b7280);
    letter-spacing: 0.03em;
}

.ovw-grid .ovw-prod[b-kilr4bi1hg] {
    position: sticky;
    left: 0;
    z-index: 2;
    background: var(--bs-body-bg, #fff);
    text-align: left;
    min-width: 170px;
    max-width: 220px;
    border-right: 2px solid var(--border-color, #d1d5db);
}

.ovw-grid thead .ovw-prod[b-kilr4bi1hg] {
    z-index: 3;
    background: var(--bs-tertiary-bg, #f8f9fa);
}

.ovw-grid .ovw-prod-art[b-kilr4bi1hg] { font-weight: 600; }

.ovw-grid .ovw-prod-name[b-kilr4bi1hg] {
    font-size: 0.72rem;
    color: var(--bs-secondary-color, #6b7280);
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    max-width: 210px;
}

.ovw-grid .ovw-prod-cust[b-kilr4bi1hg] {
    font-size: 0.74rem;
    font-weight: 600;
    color: #b45309;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    max-width: 210px;
}

.ovw-grid td.ovw-camp[b-kilr4bi1hg] {
    background: rgba(37, 99, 235, 0.12);
    color: #1d4ed8;
    font-weight: 600;
    border-left: 2px solid rgba(37, 99, 235, 0.55);
}

.ovw-grid td.ovw-camp.ovw-camp-alt[b-kilr4bi1hg] { background: rgba(37, 99, 235, 0.24); }

.ovw-grid td.ovw-ord[b-kilr4bi1hg] { color: var(--bs-secondary-color, #6b7280); }

/* Multi-select filter dropdown (native <details>; click-away handled globally in app.js). */
.ms-dd[b-kilr4bi1hg] { position: relative; }

.ms-dd > summary[b-kilr4bi1hg] {
    list-style: none;
    cursor: pointer;
    min-width: 10rem;
    white-space: nowrap;
}

.ms-dd > summary[b-kilr4bi1hg]::-webkit-details-marker { display: none; }

.ms-panel[b-kilr4bi1hg] {
    position: absolute;
    right: 0;
    z-index: 30;
    margin-top: 2px;
    background: var(--bs-body-bg, #fff);
    border: 1px solid var(--border-color, #dee2e6);
    border-radius: 8px;
    padding: 8px;
    min-width: 14rem;
    max-height: 320px;
    overflow: auto;
    box-shadow: 0 6px 16px rgba(0, 0, 0, 0.12);
}

.ms-actions[b-kilr4bi1hg] {
    display: flex;
    align-items: center;
    padding-bottom: 6px;
    margin-bottom: 4px;
    border-bottom: 1px solid var(--border-color, #eee);
}

.ms-item[b-kilr4bi1hg] {
    display: block;
    font-size: 0.85rem;
    padding: 2px 0;
    cursor: pointer;
}

.ms-item input[b-kilr4bi1hg] { margin-right: 6px; }
/* /Components/Pages/Projections/Outcome.razor.rz.scp.css */
/* ── Agreement map: projection on top, agreements hanging under it (pure CSS org chart) ── */

.po-map[b-rsyabbt38e] {
    text-align: center;
}

.po-root[b-rsyabbt38e] {
    display: flex;
    flex-direction: column;
    align-items: center;
}

.po-node[b-rsyabbt38e] {
    display: inline-flex;
    flex-direction: column;
    gap: 2px;
    padding: 0.6rem 1rem;
    background: var(--bg-card, #fff);
    border: 1px solid var(--border-color, #dee2e6);
    border-radius: 10px;
    text-decoration: none;
    color: inherit;
    text-align: left;
    box-shadow: 0 1px 2px rgba(0, 0, 0, .06);
}

.po-node-projection[b-rsyabbt38e] {
    border-top: 4px solid var(--accent, #2563eb);
    align-items: center;
    text-align: center;
}

.po-stem[b-rsyabbt38e] {
    width: 2px;
    height: 1.5rem;
    background: var(--border-color, #dee2e6);
}

.po-branches[b-rsyabbt38e] {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: 0 1rem;
    list-style: none;
    margin: 0;
    padding: 0;
}

.po-branch[b-rsyabbt38e] {
    position: relative;
    padding-top: 1.5rem;
    margin-bottom: 1rem;
}

/* vertical stub up from each card */
.po-branch[b-rsyabbt38e]::before {
    content: "";
    position: absolute;
    top: 0;
    left: 50%;
    width: 2px;
    height: 1.5rem;
    background: var(--border-color, #dee2e6);
}

/* horizontal rail across the row of cards */
.po-branch[b-rsyabbt38e]::after {
    content: "";
    position: absolute;
    top: 0;
    left: -0.5rem;
    right: -0.5rem;
    height: 2px;
    background: var(--border-color, #dee2e6);
}

.po-branch:first-child[b-rsyabbt38e]::after { left: 50%; }
.po-branch:last-child[b-rsyabbt38e]::after { right: 50%; }
.po-branch:only-child[b-rsyabbt38e]::after { display: none; }

a.po-node-agreement:hover[b-rsyabbt38e] {
    transform: translateY(-1px);
    box-shadow: 0 4px 10px rgba(0, 0, 0, .10);
}

.po-node-agreement[b-rsyabbt38e] {
    border-left: 4px solid var(--accent, #2563eb);
    min-width: 200px;
    transition: transform .1s ease, box-shadow .1s ease;
}

.po-node-pending[b-rsyabbt38e] {
    opacity: .55;
    border-style: dashed;
}

.po-node-number[b-rsyabbt38e] {
    font-weight: 700;
    font-size: 11.9px;
}

.po-node-title[b-rsyabbt38e] {
    font-weight: 600;
}

.po-node-cust[b-rsyabbt38e] {
    font-size: 11.2px;
}

.po-node-meta[b-rsyabbt38e],
.po-node-committed[b-rsyabbt38e] {
    font-size: 10.1px;
    color: var(--text-muted, #6c757d);
}

.po-node-agreement .badge[b-rsyabbt38e] {
    align-self: flex-start;
}

/* Dense mode — kicks in automatically above ~12 agreements so a full-year projection
   with 70–80 boxes still reads as a tree. */
.po-dense[b-rsyabbt38e] {
    gap: 0 0.5rem;
}

.po-dense .po-branch[b-rsyabbt38e] {
    padding-top: 1rem;
    margin-bottom: 0.5rem;
}

.po-dense .po-branch[b-rsyabbt38e]::before {
    height: 1rem;
}

.po-dense .po-node-agreement[b-rsyabbt38e] {
    min-width: 140px;
    padding: 0.35rem 0.6rem;
    gap: 1px;
}

.po-dense .po-node-number[b-rsyabbt38e] {
    font-size: 10.5px;
}

.po-dense .po-node-cust[b-rsyabbt38e] {
    font-size: 10.1px;
}

.po-dense .po-node-committed[b-rsyabbt38e] {
    font-size: 9.1px;
}

.po-dense .po-node-agreement .badge[b-rsyabbt38e] {
    font-size: 7.7px !important;
}

@media (max-width: 768px) {
    .po-branches[b-rsyabbt38e] {
        flex-direction: column;
        align-items: center;
    }

    .po-branch[b-rsyabbt38e]::after {
        display: none;
    }
}
/* /Components/Pages/Promoters/PromoterPerformance.razor.rz.scp.css */
/* Multi-select filter dropdown (native <details>; click-away handled globally in app.js).
   Same behaviour as the projection filters — scoped CSS means each page carries its own copy. */
.ms-dd[b-n46rn14a01] {
    position: relative;
}

.ms-dd > summary[b-n46rn14a01] {
    list-style: none;
    cursor: pointer;
    min-width: 9rem;
    white-space: nowrap;
}

.ms-dd > summary[b-n46rn14a01]::-webkit-details-marker {
    display: none;
}

.ms-panel[b-n46rn14a01] {
    position: absolute;
    z-index: 30;
    margin-top: 2px;
    background: var(--bs-body-bg, #fff);
    border: 1px solid var(--border-color, #dee2e6);
    border-radius: 8px;
    padding: 8px;
    min-width: 14rem;
    max-height: 320px;
    overflow: auto;
    box-shadow: 0 6px 16px rgba(0, 0, 0, 0.12);
}

.ms-actions[b-n46rn14a01] {
    display: flex;
    align-items: center;
    padding-bottom: 6px;
    margin-bottom: 4px;
    border-bottom: 1px solid var(--border-color, #eee);
}

.ms-item[b-n46rn14a01] {
    display: block;
    font-size: 0.85rem;
    padding: 2px 0;
    cursor: pointer;
}

.ms-item input[b-n46rn14a01] {
    margin-right: 6px;
}

/* A folded-out organisation sits under its customer: same columns, quieter ground, so the
   indent reads as "part of the row above" rather than as another customer. */
.sub-row > td[b-n46rn14a01] {
    background-color: color-mix(in srgb, var(--bs-secondary-bg, #e9ecef) 45%, transparent);
    font-size: 0.9375rem;
}
/* /Components/Pages/Promoters/PromoterSheetDetails.razor.rz.scp.css */
/*
    The grid's number fields drop their spinners.

    Two reasons, and the second is the real one. They are visual clutter in a dense grid, where
    every row carries three of them. And they are now a lie: the arrow keys move between cells —
    see gridNavigation — so the little arrows promise an increment that pressing the arrow keys no
    longer performs. An affordance that does the opposite of what it depicts is worse than none.

    Typing, pasting and the arrows on the field itself all still work; only the rendered buttons go.
*/
.promoter-grid input[type="number"][b-ai9ozsj0yv]::-webkit-outer-spin-button,
.promoter-grid input[type="number"][b-ai9ozsj0yv]::-webkit-inner-spin-button {
    -webkit-appearance: none;
    appearance: none;
    margin: 0;
}

.promoter-grid input[type="number"][b-ai9ozsj0yv] {
    -moz-appearance: textfield;
    appearance: textfield;
}
/* /Components/Pages/Sales/ActionSignals.razor.rz.scp.css */
/* Multi-select filter dropdown (native <details>; click-away handled globally in app.js).
   Same behaviour as the projection filters — scoped CSS means each page carries its own copy. */
.ms-dd[b-cuvxeq9y7r] {
    position: relative;
}

.ms-dd > summary[b-cuvxeq9y7r] {
    list-style: none;
    cursor: pointer;
    min-width: 9rem;
    white-space: nowrap;
}

.ms-dd > summary[b-cuvxeq9y7r]::-webkit-details-marker {
    display: none;
}

.ms-panel[b-cuvxeq9y7r] {
    position: absolute;
    z-index: 30;
    margin-top: 2px;
    background: var(--bs-body-bg, #fff);
    border: 1px solid var(--border-color, #dee2e6);
    border-radius: 8px;
    padding: 8px;
    min-width: 14rem;
    max-height: 320px;
    overflow: auto;
    box-shadow: 0 6px 16px rgba(0, 0, 0, 0.12);
}

.ms-actions[b-cuvxeq9y7r] {
    display: flex;
    align-items: center;
    padding-bottom: 6px;
    margin-bottom: 4px;
    border-bottom: 1px solid var(--border-color, #eee);
}

.ms-item[b-cuvxeq9y7r] {
    display: block;
    font-size: 0.85rem;
    padding: 2px 0;
    cursor: pointer;
}

.ms-item input[b-cuvxeq9y7r] {
    margin-right: 6px;
}

/* A folded-out organisation sits under its customer: same columns, quieter ground, so the
   indent reads as "part of the row above" rather than as another customer. */
.sub-row > td[b-cuvxeq9y7r] {
    background-color: color-mix(in srgb, var(--bs-secondary-bg, #e9ecef) 45%, transparent);
    font-size: 0.9375rem;
}
/* /Components/Pages/Sales/MarketReporting.razor.rz.scp.css */
/* Multi-select filter dropdown (native <details>; click-away handled globally in app.js).
   Same behaviour as the projection filters — scoped CSS means each page carries its own copy. */
.ms-dd[b-9b2tvx0c8t] {
    position: relative;
}

.ms-dd > summary[b-9b2tvx0c8t] {
    list-style: none;
    cursor: pointer;
    min-width: 9rem;
    white-space: nowrap;
}

.ms-dd > summary[b-9b2tvx0c8t]::-webkit-details-marker {
    display: none;
}

.ms-panel[b-9b2tvx0c8t] {
    position: absolute;
    z-index: 30;
    margin-top: 2px;
    background: var(--bs-body-bg, #fff);
    border: 1px solid var(--border-color, #dee2e6);
    border-radius: 8px;
    padding: 8px;
    min-width: 14rem;
    max-height: 320px;
    overflow: auto;
    box-shadow: 0 6px 16px rgba(0, 0, 0, 0.12);
}

.ms-actions[b-9b2tvx0c8t] {
    display: flex;
    align-items: center;
    padding-bottom: 6px;
    margin-bottom: 4px;
    border-bottom: 1px solid var(--border-color, #eee);
}

.ms-item[b-9b2tvx0c8t] {
    display: block;
    font-size: 0.85rem;
    padding: 2px 0;
    cursor: pointer;
}

.ms-item input[b-9b2tvx0c8t] {
    margin-right: 6px;
}

/* A folded-out organisation sits under its customer: same columns, quieter ground, so the
   indent reads as "part of the row above" rather than as another customer. */
.sub-row > td[b-9b2tvx0c8t] {
    background-color: color-mix(in srgb, var(--bs-secondary-bg, #e9ecef) 45%, transparent);
    font-size: 0.9375rem;
}