/* /Components/Layout/MainLayout.razor.rz.scp.css */
.page[b-43qu21fmgu] {
    position: relative;
    display: flex;
    flex-direction: column;
    /* At least a windowful even when the page holds almost nothing, so the sidebar's gradient
       never stops halfway down an empty screen. */
    min-height: 100vh;
}

main[b-43qu21fmgu] {
    flex: 1;
}

.sidebar[b-43qu21fmgu] {
    background-image: linear-gradient(180deg, rgb(5, 39, 103) 0%, #3a0647 70%);
    /* A column, so the menu below the brand row can simply take whatever height is left rather
       than guessing at it - see .nav-scrollable, which used to subtract an assumed brand height
       and overshoot the sidebar by the few pixels it guessed wrong. */
    display: flex;
    flex-direction: column;
}

.top-row[b-43qu21fmgu] {
    /* Bootstrap 5.3 theme variables, not hardcoded hex - so this bar (the app's only chrome that
       isn't the always-dark sidebar) actually follows the light/dark toggle instead of staying a
       fixed light-grey no matter what data-bs-theme is set to. */
    background-color: var(--bs-tertiary-bg);
    border-bottom: 1px solid var(--bs-border-color);
    justify-content: flex-end;
    height: 3.5rem;
    display: flex;
    align-items: center;
}

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

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

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

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

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

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

    .sidebar[b-43qu21fmgu] {
        width: 250px;
        /* As tall as the PAGE, not as tall as the window. It used to be "height: 100vh" and
           sticky, which was fine while the menu was short: once the menu grew past a windowful,
           the entries below the fold were painted outside the sidebar's own box - on the bare page
           background - and, because a stuck element does not move, scrolling never brought them
           into view either. Stretching with the flex row instead means the gradient reaches the
           bottom of whatever is longer, the menu or the content, and everything in it is reachable
           by scrolling the page. */
        min-height: 100vh;
        /* Positioned so the z-index below applies at all. Whether it is also PINNED depends on
           whether the menu fits the window - see .page.menu-fits below, and nav-layout.js, which
           is what measures that. */
        position: relative;
        /* Establishes its own stacking context (position + an explicit z-index, not just
           position alone) so the whole sidebar - including its flyout submenus, which
           intentionally render outside the sidebar's own width - always paints above the main
           content area, regardless of what that content contains (alerts, banners, anything else
           that happens to set its own "position: relative" and would otherwise compete for
           stacking at the same level as the sidebar). */
        z-index: 10;
    }

    /* The menu fits the window, so it can be pinned to the top of it: a windowful tall, stuck at
       the top, and therefore covering the whole window at every scroll position. This is the
       normal case and the nicer one - the menu stays in reach while a long page scrolls past it.
       When the menu does NOT fit (nav-layout.js takes the class off), the rule above applies
       instead and the sidebar stretches with the page: everything in the menu is then painted
       inside the sidebar and reachable by scrolling, which pinning cannot offer. */
    .page.menu-fits .sidebar[b-43qu21fmgu] {
        height: 100vh;
        position: sticky;
        top: 0;
        align-self: flex-start;
    }

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

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

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

#blazor-error-ui[b-43qu21fmgu] {
    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-43qu21fmgu] {
        cursor: pointer;
        position: absolute;
        right: 0.75rem;
        top: 0.5rem;
    }
/* /Components/Layout/NavMenu.razor.rz.scp.css */
.navbar-toggler[b-lo3pbo9mht] {
    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-lo3pbo9mht] {
    background-color: rgba(255, 255, 255, 0.5);
}

.top-row[b-lo3pbo9mht] {
    min-height: 3.5rem;
    background-color: rgba(0,0,0,0.4);
    /* Tighter than the nav items below (which sit at px-3/1rem, plus 1rem padding-top on the
       first item) - the logo should read as sitting right in the corner. */
    padding: 0.35rem 0 0.35rem 0.5rem;
}

.navbar-brand[b-lo3pbo9mht] {
    font-size: 1.1rem;
    display: inline-flex;
    align-items: center;
    margin: 0;
}

.navbar-brand-text[b-lo3pbo9mht] {
    display: inline-flex;
    flex-direction: column;
    line-height: 1.15;
}

/* Which build this is, under the title - present but never competing with it. */
.navbar-build[b-lo3pbo9mht] {
    font-size: 0.68rem;
    font-weight: 400;
    opacity: 0.65;
    letter-spacing: 0.02em;
}

.navbar-brand-logo[b-lo3pbo9mht] {
    height: 2.6rem;
    width: auto;
    margin-right: 0.5rem;
}

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

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

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

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

.bi-people-fill-nav-menu[b-lo3pbo9mht] {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='white' class='bi bi-people-fill' viewBox='0 0 16 16'%3E%3Cpath d='M7 14s-1 0-1-1 1-4 5-4 5 3 5 4-1 1-1 1zm4-6a3 3 0 1 0 0-6 3 3 0 0 0 0 6m-5.784 6A2.24 2.24 0 0 1 5 13c0-1.355.68-2.75 1.936-3.72A6.3 6.3 0 0 0 5 9c-4 0-5 3-5 4s1 1 1 1zM4.5 8a2.5 2.5 0 1 0 0-5 2.5 2.5 0 0 0 0 5'/%3E%3C/svg%3E");
}

.bi-box-arrow-left-nav-menu[b-lo3pbo9mht] {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='white' class='bi bi-box-arrow-left' viewBox='0 0 16 16'%3E%3Cpath fill-rule='evenodd' d='M6 12.5a.5.5 0 0 0 .5.5h8a.5.5 0 0 0 .5-.5v-9a.5.5 0 0 0-.5-.5h-8a.5.5 0 0 0-.5.5v2a.5.5 0 0 1-1 0v-2A1.5 1.5 0 0 1 6.5 2h8A1.5 1.5 0 0 1 16 3.5v9a1.5 1.5 0 0 1-1.5 1.5h-8A1.5 1.5 0 0 1 5 12.5v-2a.5.5 0 0 1 1 0z'/%3E%3Cpath fill-rule='evenodd' d='M.146 8.354a.5.5 0 0 1 0-.708l3-3a.5.5 0 1 1 .708.708L1.707 7.5H10.5a.5.5 0 0 1 0 1H1.707l2.147 2.146a.5.5 0 0 1-.708.708z'/%3E%3C/svg%3E");
}

.bi-hdd-network-fill-nav-menu[b-lo3pbo9mht] {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='white' viewBox='0 0 16 16'%3E%3Crect x='1' y='2' width='14' height='4' rx='1'/%3E%3Crect x='1' y='10' width='14' height='4' rx='1'/%3E%3Ccircle cx='4' cy='4' r='0.8'/%3E%3Ccircle cx='4' cy='12' r='0.8'/%3E%3C/svg%3E");
}

.bi-diagram-fill-nav-menu[b-lo3pbo9mht] {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='white' viewBox='0 0 16 16'%3E%3Crect x='1' y='7' width='14' height='2' rx='1'/%3E%3Ccircle cx='2.5' cy='8' r='2.5'/%3E%3Ccircle cx='13.5' cy='8' r='2.5'/%3E%3C/svg%3E");
}

.bi-globe-fill-nav-menu[b-lo3pbo9mht] {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='none' stroke='white' stroke-width='1' viewBox='0 0 16 16'%3E%3Ccircle cx='8' cy='8' r='6.5'/%3E%3Cellipse cx='8' cy='8' rx='2.8' ry='6.5'/%3E%3Cline x1='1.5' y1='8' x2='14.5' y2='8'/%3E%3C/svg%3E");
}

.bi-collection-fill-nav-menu[b-lo3pbo9mht] {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='none' stroke='white' stroke-width='1.3' viewBox='0 0 16 16'%3E%3Crect x='1.5' y='2.5' width='13' height='11' rx='2'/%3E%3Ccircle cx='5.5' cy='8' r='1.3' fill='white' stroke='none'/%3E%3Ccircle cx='10.5' cy='8' r='1.3' fill='white' stroke='none'/%3E%3C/svg%3E");
}

.bi-diagram-tree-fill-nav-menu[b-lo3pbo9mht] {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='none' stroke='white' stroke-width='1.3' viewBox='0 0 16 16'%3E%3Ccircle cx='3' cy='3' r='1.6' fill='white' stroke='none'/%3E%3Ccircle cx='3' cy='13' r='1.6' fill='white' stroke='none'/%3E%3Ccircle cx='12' cy='8' r='1.6' fill='white' stroke='none'/%3E%3Cpath d='M3 4.6v6.8M3 8h4.5M7.5 8 10.5 8.9M7.5 8 12 6.6'/%3E%3C/svg%3E");
}

.bi-layers-fill-nav-menu[b-lo3pbo9mht] {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='white' viewBox='0 0 16 16'%3E%3Cpolygon points='8,1.5 15,5.5 8,9.5 1,5.5'/%3E%3Cpolygon points='8,7.5 15,11.5 8,15.5 1,11.5' opacity='0.55'/%3E%3C/svg%3E");
}

.bi-tag-fill-nav-menu[b-lo3pbo9mht] {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='none' stroke='white' stroke-width='1.3' viewBox='0 0 16 16'%3E%3Cpath d='M1.5 1.5h6l7 7-6 6-7-7z'/%3E%3Ccircle cx='5' cy='5' r='1' fill='white' stroke='none'/%3E%3C/svg%3E");
}

.bi-heart-pulse-nav-menu[b-lo3pbo9mht] {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='none' stroke='white' stroke-width='1.3' viewBox='0 0 16 16'%3E%3Cpath d='M8 13.5S2 10 2 6.2A2.7 2.7 0 0 1 8 4.6a2.7 2.7 0 0 1 6 1.6c0 1-.4 1.9-1 2.7'/%3E%3Cpath d='M6.2 8.2h1.4L8.6 6.6l1.2 3 .9-1.4h2.6'/%3E%3C/svg%3E");
}

.bi-box-seam-nav-menu[b-lo3pbo9mht] {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='none' stroke='white' stroke-width='1.2' viewBox='0 0 16 16'%3E%3Cpath d='M8 2.2 14 5v6l-6 2.8L2 11V5z'/%3E%3Cpath d='M2 5l6 2.8L14 5M8 7.8v6'/%3E%3C/svg%3E");
}

.bi-airplane-nav-menu[b-lo3pbo9mht] {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='white' viewBox='0 0 16 16'%3E%3Cpath d='M8 1.2c.6 0 1 .9 1 2v2.5l5 3v1.6l-5-1.5v2.9l1.6 1.2v1.1L8 13.4l-2.6.6v-1.1L7 11.7V8.8l-5 1.5V8.7l5-3V3.2c0-1.1.4-2 1-2z'/%3E%3C/svg%3E");
}

.bi-cpu-fill-nav-menu[b-lo3pbo9mht] {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='none' stroke='white' stroke-width='1.2' viewBox='0 0 16 16'%3E%3Crect x='4' y='4' width='8' height='8' rx='1'/%3E%3Crect x='6.6' y='6.6' width='2.8' height='2.8' rx='0.5' fill='white' stroke='none'/%3E%3Cpath d='M6 4V2M10 4V2M6 14v-2M10 14v-2M4 6H2M4 10H2M14 6h-2M14 10h-2'/%3E%3C/svg%3E");
}

.bi-rulers-nav-menu[b-lo3pbo9mht] {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='none' stroke='white' stroke-width='1.2' viewBox='0 0 16 16'%3E%3Crect x='1.5' y='5' width='13' height='6' rx='1'/%3E%3Cpath d='M4.5 5v2.6M7 5v1.8M9.5 5v2.6M12 5v1.8'/%3E%3C/svg%3E");
}

.bi-flag-fill-nav-menu[b-lo3pbo9mht] {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='none' stroke='white' stroke-width='1.3' viewBox='0 0 16 16'%3E%3Cline x1='3.2' y1='2' x2='3.2' y2='14.5'/%3E%3Cpath d='M3.2 2.6H13l-1.9 2.8L13 8.2H3.2z' fill='white' stroke='none'/%3E%3C/svg%3E");
}

.bi-coin-nav-menu[b-lo3pbo9mht] {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='none' stroke='white' stroke-width='1.3' viewBox='0 0 16 16'%3E%3Ccircle cx='8' cy='8' r='6.4'/%3E%3Ccircle cx='8' cy='8' r='2.9'/%3E%3C/svg%3E");
}

.bi-megaphone-fill-nav-menu[b-lo3pbo9mht] {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='white' viewBox='0 0 16 16'%3E%3Cpath d='M1 6v3a1 1 0 0 0 1 1h1l6 3V2L3 5H2a1 1 0 0 0-1 1z'/%3E%3Cpath d='M11 4.2v6.6a3.1 3.1 0 0 0 0-6.6z'/%3E%3C/svg%3E");
}

.bi-info-circle-fill-nav-menu[b-lo3pbo9mht] {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='white' viewBox='0 0 16 16'%3E%3Ccircle cx='8' cy='8' r='7'/%3E%3Ccircle cx='8' cy='4.6' r='1' fill='%23495057'/%3E%3Crect x='7' y='7' width='2' height='5' rx='0.5' fill='%23495057'/%3E%3C/svg%3E");
}

.bi-person-fill-user-frame[b-lo3pbo9mht] {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='%23d7d7d7' viewBox='0 0 16 16'%3E%3Ccircle cx='8' cy='5' r='3'/%3E%3Cpath d='M3 14c0-3 2.5-5 5-5s5 2 5 5v0.5H3z'/%3E%3C/svg%3E");
    margin-right: 0.5rem;
}

.bi-shield-fill-nav-menu[b-lo3pbo9mht] {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='white' viewBox='0 0 16 16'%3E%3Cpath d='M8 0c-.69 0-1.843.265-2.928.56-1.11.3-2.229.655-2.887.87a1.54 1.54 0 0 0-1.044 1.262c-.596 4.477.787 7.795 2.465 9.99a11.8 11.8 0 0 0 2.517 2.453c.386.273.744.482 1.048.625.28.132.581.24.829.24s.548-.108.829-.24a7 7 0 0 0 1.048-.625 11.8 11.8 0 0 0 2.517-2.453c1.678-2.195 3.061-5.513 2.465-9.99a1.54 1.54 0 0 0-1.044-1.263 63 63 0 0 0-2.887-.87C9.843.266 8.69 0 8 0z'/%3E%3C/svg%3E");
}

.bi-grid-fill-nav-menu[b-lo3pbo9mht] {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='white' viewBox='0 0 16 16'%3E%3Crect x='1' y='1' width='6' height='6' rx='1'/%3E%3Crect x='9' y='1' width='6' height='6' rx='1'/%3E%3Crect x='1' y='9' width='6' height='6' rx='1'/%3E%3Crect x='9' y='9' width='6' height='6' rx='1'/%3E%3C/svg%3E");
}

/* Application templates: a url tree - one root branching into two leaves. */
.bi-sitemap-fill-nav-menu[b-lo3pbo9mht] {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='none' stroke='white' stroke-width='1.3' viewBox='0 0 16 16'%3E%3Crect x='6' y='1.5' width='4' height='3.2' rx='0.6' fill='white'/%3E%3Crect x='1.5' y='11.3' width='4' height='3.2' rx='0.6' fill='white'/%3E%3Crect x='10.5' y='11.3' width='4' height='3.2' rx='0.6' fill='white'/%3E%3Cline x1='8' y1='4.7' x2='8' y2='7.6'/%3E%3Cline x1='3.5' y1='7.6' x2='12.5' y2='7.6'/%3E%3Cline x1='3.5' y1='7.6' x2='3.5' y2='11.3'/%3E%3Cline x1='12.5' y1='7.6' x2='12.5' y2='11.3'/%3E%3C/svg%3E");
}

/* Package servers: two stacked rack units, each with its status dot - simple primitives only,
   the same style rule the other icons in this sheet follow. */
.bi-server-fill-nav-menu[b-lo3pbo9mht] {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='white' viewBox='0 0 16 16'%3E%3Crect x='1' y='2' width='14' height='5' rx='1'/%3E%3Crect x='1' y='9' width='14' height='5' rx='1'/%3E%3Ccircle cx='12.5' cy='4.5' r='0.9' fill='%23512bd4'/%3E%3Ccircle cx='12.5' cy='11.5' r='0.9' fill='%23512bd4'/%3E%3C/svg%3E");
}

.bi-gear-nav-menu[b-lo3pbo9mht] {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='none' stroke='white' stroke-width='1.3' viewBox='0 0 16 16'%3E%3Ccircle cx='8' cy='8' r='3.6'/%3E%3Ccircle cx='8' cy='8' r='1.1' fill='white' stroke='none'/%3E%3Cline x1='11.6' y1='8' x2='13.4' y2='8'/%3E%3Cline x1='10.55' y1='10.55' x2='11.82' y2='11.82'/%3E%3Cline x1='8' y1='11.6' x2='8' y2='13.4'/%3E%3Cline x1='5.45' y1='10.55' x2='4.18' y2='11.82'/%3E%3Cline x1='4.4' y1='8' x2='2.6' y2='8'/%3E%3Cline x1='5.45' y1='5.45' x2='4.18' y2='4.18'/%3E%3Cline x1='8' y1='4.4' x2='8' y2='2.6'/%3E%3Cline x1='10.55' y1='5.45' x2='11.82' y2='4.18'/%3E%3C/svg%3E");
}

.bi-sliders-fill-nav-menu[b-lo3pbo9mht] {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='none' stroke='white' stroke-width='1.5' viewBox='0 0 16 16'%3E%3Cline x1='1' y1='4' x2='15' y2='4'/%3E%3Ccircle cx='10' cy='4' r='1.6' fill='white'/%3E%3Cline x1='1' y1='8' x2='15' y2='8'/%3E%3Ccircle cx='5' cy='8' r='1.6' fill='white'/%3E%3Cline x1='1' y1='12' x2='15' y2='12'/%3E%3Ccircle cx='11' cy='12' r='1.6' fill='white'/%3E%3C/svg%3E");
}

/* UAA plugins: a plug - something that is put into the authentication agent from outside. */
.bi-plug-fill-nav-menu[b-lo3pbo9mht] {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='none' stroke='white' stroke-width='1.3' stroke-linecap='round' viewBox='0 0 16 16'%3E%3Cpath d='M5.4 1.8v3.4M10.6 1.8v3.4'/%3E%3Cpath d='M3.4 5.2h9.2v2.2a4.6 4.6 0 0 1-4.6 4.6 4.6 4.6 0 0 1-4.6-4.6z' fill='white' stroke='none'/%3E%3Cpath d='M8 12v2.4'/%3E%3C/svg%3E");
}

/* The Project DB: a kanban board - three columns of work, which is what a project looks like
   wherever it is run from. */
.bi-kanban-fill-nav-menu[b-lo3pbo9mht] {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='none' stroke='white' stroke-width='1.2' viewBox='0 0 16 16'%3E%3Crect x='1.5' y='2' width='13' height='12' rx='1'/%3E%3Crect x='3.4' y='4' width='2.6' height='5' rx='0.5' fill='white' stroke='none'/%3E%3Crect x='6.9' y='4' width='2.6' height='7.5' rx='0.5' fill='white' stroke='none'/%3E%3Crect x='10.4' y='4' width='2.6' height='3.5' rx='0.5' fill='white' stroke='none'/%3E%3C/svg%3E");
}

/* Task activity types: a pulse line - something happened to the task. */
.bi-activity-nav-menu[b-lo3pbo9mht] {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='none' stroke='white' stroke-width='1.4' stroke-linecap='round' stroke-linejoin='round' viewBox='0 0 16 16'%3E%3Cpath d='M1.5 8.5h3l2-5 3 9 2-4h3'/%3E%3C/svg%3E");
}

/* Task status: a ticked box - where a task has got to. */
.bi-check-square-fill-nav-menu[b-lo3pbo9mht] {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='none' stroke='white' stroke-width='1.3' viewBox='0 0 16 16'%3E%3Crect x='2' y='2' width='12' height='12' rx='1.5'/%3E%3Cpath d='M4.8 8.2 7 10.4l4.2-4.6' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
}

/* Timezones: a clock - the one thing a time zone is about. */
.bi-clock-fill-nav-menu[b-lo3pbo9mht] {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='none' stroke='white' stroke-width='1.3' viewBox='0 0 16 16'%3E%3Ccircle cx='8' cy='8' r='6.4'/%3E%3Cpath d='M8 4.2V8l2.8 1.8' stroke-linecap='round'/%3E%3C/svg%3E");
}

/* The Olson database: a folded map - places rather than clocks, which is what that catalog is. */
.bi-map-fill-nav-menu[b-lo3pbo9mht] {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='none' stroke='white' stroke-width='1.2' viewBox='0 0 16 16'%3E%3Cpath d='M1.5 4 5.7 2.2 10.3 4 14.5 2.2v9.6L10.3 13.8 5.7 12 1.5 13.8z'/%3E%3Cline x1='5.7' y1='2.2' x2='5.7' y2='12'/%3E%3Cline x1='10.3' y1='4' x2='10.3' y2='13.8'/%3E%3C/svg%3E");
}

/* Fundamental service types: a life preserver - a service rendered to somebody travelling, and
   the one symbol every passenger already reads that way. */
.bi-life-preserver-nav-menu[b-lo3pbo9mht] {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='none' stroke='white' stroke-width='1.3' viewBox='0 0 16 16'%3E%3Ccircle cx='8' cy='8' r='6.4'/%3E%3Ccircle cx='8' cy='8' r='2.7'/%3E%3Cline x1='3.4' y1='3.4' x2='6.1' y2='6.1'/%3E%3Cline x1='9.9' y1='9.9' x2='12.6' y2='12.6'/%3E%3Cline x1='12.6' y1='3.4' x2='9.9' y2='6.1'/%3E%3Cline x1='6.1' y1='9.9' x2='3.4' y2='12.6'/%3E%3C/svg%3E");
}

/* Facility types: a building - a block with its windows, which is what all eight kinds of place
   are somewhere inside. */
.bi-building-fill-nav-menu[b-lo3pbo9mht] {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='none' stroke='white' stroke-width='1.2' viewBox='0 0 16 16'%3E%3Crect x='3' y='1.5' width='10' height='13' rx='1'/%3E%3Crect x='5' y='3.5' width='2' height='2' fill='white' stroke='none'/%3E%3Crect x='9' y='3.5' width='2' height='2' fill='white' stroke='none'/%3E%3Crect x='5' y='7' width='2' height='2' fill='white' stroke='none'/%3E%3Crect x='9' y='7' width='2' height='2' fill='white' stroke='none'/%3E%3Crect x='6.8' y='10.8' width='2.4' height='3.7' fill='white' stroke='none'/%3E%3C/svg%3E");
}

.active-site-box[b-lo3pbo9mht] {
    background-color: #495057;
    color: #f1f1f1;
    margin: 0 0.75rem 1rem;
    padding: 0.6rem 0.85rem;
    border-radius: 4px;
    font-size: 0.85rem;
    line-height: 1.5;
}

.active-site-box-label[b-lo3pbo9mht] {
    font-weight: 600;
    text-transform: uppercase;
    font-size: 0.7rem;
    letter-spacing: 0.03em;
    color: #ced4da;
}

.git-project-box[b-lo3pbo9mht] {
    background-color: #495057;
    color: #f1f1f1;
    margin: 0 0.75rem 1rem;
    padding: 0.6rem 0.85rem;
    border-radius: 4px;
    font-size: 0.85rem;
    line-height: 1.5;
}

.git-project-box-label[b-lo3pbo9mht] {
    font-weight: 600;
    text-transform: uppercase;
    font-size: 0.7rem;
    letter-spacing: 0.03em;
    color: #ced4da;
}

.git-project-box-value[b-lo3pbo9mht] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 0.5rem;
}

.git-project-box-value span:first-child[b-lo3pbo9mht] {
    overflow-wrap: break-word;
    font-size: 0.78rem;
}

.git-project-info-icon[b-lo3pbo9mht] {
    flex-shrink: 0;
    width: 1rem;
    height: 1rem;
    margin-right: 0;
    margin-left: 0;
    cursor: pointer;
    opacity: 0.85;
}

.git-project-info-icon:hover[b-lo3pbo9mht] {
    opacity: 1;
}

.nav-requires-republish-badge[b-lo3pbo9mht] {
    margin-left: 0.5rem;
    font-size: 0.7rem;
    vertical-align: middle;
}

/* The username used to live in its own permanent box above the Settings toggle
   (.active-user-frame, now gone) - it now lives as a non-interactive header row at the top of the
   Settings submenu instead, right above the actual menu items. */
/* The settings block is pinned to the bottom. When the publish item is showing it takes over
   that job, so the two stay together at the foot of the menu instead of one of them floating. */
.settings-username-nav[b-lo3pbo9mht] {
    margin-top: auto;
}

.publish-pending-nav[b-lo3pbo9mht] {
    margin-top: auto;
}

.publish-pending-nav ~ .settings-username-nav[b-lo3pbo9mht] {
    margin-top: 0;
}

.submenu-username[b-lo3pbo9mht] {
    display: flex;
    align-items: center;
    padding: 0.5rem 0.75rem;
    margin-bottom: 0.25rem;
    border-bottom: 1px solid rgba(255, 255, 255, 0.15);
    color: #b8b3c4;
    font-size: 0.8rem;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.submenu-username .bi[b-lo3pbo9mht] {
    margin-right: 0.5rem;
}

.settings-logout-form[b-lo3pbo9mht] {
    margin: 0;
}

.settings-logout-btn[b-lo3pbo9mht] {
    font: inherit;
    text-align: left;
    cursor: pointer;
}

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

    /* min-height, not height: a label long enough to wrap ("B-Op User Permissions") would
       otherwise overflow its 3rem box and lay itself over whatever comes next in the sidebar.
       A one-line entry is unchanged - flex centring keeps it at exactly 3rem. */
    .nav-item[b-lo3pbo9mht]  .nav-link {
        color: #d7d7d7;
        background: none;
        border: none;
        border-radius: 4px;
        min-height: 3rem;
        display: flex;
        align-items: center;
        line-height: 1.25;
        padding-top: 0.25rem;
        padding-bottom: 0.25rem;
        width: 100%;
    }

.nav-item[b-lo3pbo9mht]  a.active {
    background-color: rgba(255,255,255,0.37);
    color: white;
}

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

/* "B-Op Platform" and "Settings" fly out their submenu on mouseover - pure CSS, no click/JS
   needed. The submenu is a direct child of .submenu-parent, so hovering anywhere within it
   (including once it's open) keeps :hover - and therefore the open state - active. It is
   positioned absolutely and slides open to the right, laying over the main content instead of
   pushing the rest of the sidebar down. */
.submenu-parent[b-lo3pbo9mht] {
    position: relative;
}

.submenu-toggle[b-lo3pbo9mht] {
    cursor: default;
    user-select: none;
}

.submenu-caret[b-lo3pbo9mht] {
    margin-left: auto;
    font-size: 0.65rem;
    line-height: 1;
    transition: transform 0.15s ease;
}

.submenu-parent:hover > .submenu-toggle[b-lo3pbo9mht] {
    background-color: rgba(255,255,255,0.1);
    color: white;
}

.submenu-parent:hover .submenu-caret[b-lo3pbo9mht] {
    transform: rotate(90deg);
}

.submenu[b-lo3pbo9mht] {
    display: flex;
    flex-direction: column;
    position: absolute;
    /* Touches the parent's edge with zero gap - any margin here would be dead space the mouse
       has to cross to reach the submenu; since :hover only holds while the pointer is over
       .submenu-parent or one of its descendants, a gap the pointer briefly leaves both boxes
       through closes the menu before the pointer ever arrives. The visual "floating" look comes
       entirely from the box-shadow, not a margin. */
    left: 100%;
    top: 0;
    /* Wide enough for the labels these flyouts carry, and it grows past this for a longer one:
       the entries below do not wrap (white-space: nowrap), so the box sizes itself to the longest
       of them - "Travel Assistance Master Service Properties" is the one that set this floor. */
    min-width: 300px;
    max-width: 34rem;
    /* Taller than the window is the one case the lift in nav-flyout.js cannot solve - there is
       nowhere left to lift it to - so the flyout scrolls itself rather than running off the
       screen. Everything above this is unaffected: a flyout that fits has no scrollbar. */
    max-height: calc(100vh - 1rem);
    overflow-y: auto;
    padding: 0.35rem;
    background-color: #3a1a5c;
    border-radius: 6px;
    box-shadow: 0 8px 24px rgba(0, 0, 0, 0.45);
    z-index: 20;
    /* Hidden via visibility/opacity (not display:none) specifically so hiding can be DELAYED:
       .submenu-parent's own hoverable box is only as tall as the toggle row itself (the submenu
       is absolutely positioned, so it doesn't add to that row's height) - aiming the pointer at a
       LOWER item in the flyout via a diagonal path can dip below the toggle's row before crossing
       into the submenu's own box, passing through genuinely unhoverable space for an instant. A
       short delay before hiding gives that crossing time to complete without a JS hover-intent
       algorithm; showing stays instant (see the :hover rule below, which resets the transition).
       Deliberately NOT using pointer-events for this: unlike visibility, a plain CSS transition on
       pointer-events has no browser-guaranteed timing (measured flipping to "none" almost
       immediately in Chromium, well before the opacity/visibility fade finished - defeating the
       whole point). visibility alone is sufficient AND spec-guaranteed to behave asymmetrically:
       becoming visible applies at the START of its transition, becoming hidden only at the END -
       exactly "show instantly, hide after a grace period" - and hidden also removes the element
       from hit-testing on its own, so no separate pointer-events rule is needed at all. */
    visibility: hidden;
    opacity: 0;
    transition: visibility 0.25s, opacity 0.25s;
}

.submenu-parent:hover > .submenu[b-lo3pbo9mht] {
    visibility: visible;
    opacity: 1;
    transition: none;
}

/* Anchored near the bottom of the sidebar - open upward so the flyout never runs off the
   bottom of the viewport. */
.submenu-parent.flyout-up > .submenu[b-lo3pbo9mht] {
    top: auto;
    bottom: 0;
}

.submenu-parent:hover > .submenu[b-lo3pbo9mht] {
    display: flex;
}

.nav-scrollable[b-lo3pbo9mht] {
    display: none;
    /* One consistent inset at the very top of the sidebar - the gap between nav items
       themselves is handled uniformly by .nav-item's own padding-bottom, regardless of how
       many separate <nav> blocks they are split across. */
    padding-top: 0.35rem;
}

.navbar-toggler:checked ~ .nav-scrollable[b-lo3pbo9mht] {
    display: flex;
    flex-direction: column;
}

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

    .nav-scrollable[b-lo3pbo9mht] {
        /* Never collapse the sidebar for wide screens */
        display: flex;
        flex-direction: column;
        /* Takes whatever the sidebar has left under the brand row. It used to be
           "min-height: calc(100vh - 3.5rem)", which assumed the brand row is exactly 3.5rem: it is
           not - the build line under the title makes it taller - so the menu stood a few pixels
           proud of a pinned sidebar and the gradient stopped just short of its last entry. */
        flex: 1 1 auto;

        /* No overflow-y here on purpose: setting it to anything but "visible" forces the browser
           to clip the x-axis too (the used value of overflow-x becomes "auto" whenever overflow-y
           isn't "visible"), which would cut off the flyout submenus that intentionally render
           outside the sidebar's own width. The menu is short enough in practice to never need
           vertical scrolling. */
    }
}

/* The one red item in the menu: work that exists only in this user's copy until they push it.
   Red because it is the state that needs acting on, not a place to navigate to. */
.nav-item[b-lo3pbo9mht]  a.push-pending {
    background-color: #b02a37;
    color: #fff;
    font-weight: 600;
}

.nav-item[b-lo3pbo9mht]  a.push-pending:hover,
.nav-item[b-lo3pbo9mht]  a.push-pending.active {
    background-color: #c9303e;
    color: #fff;
}

.bi-arrow-up-circle-fill-nav-menu[b-lo3pbo9mht] {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='white' viewBox='0 0 16 16'%3E%3Ccircle cx='8' cy='8' r='7'/%3E%3Cpath d='M8 4 4.5 7.5h2.2V12h2.6V7.5h2.2z' fill='%23b02a37'/%3E%3C/svg%3E");
}

.bi-arrow-up-right-circle-fill-nav-menu[b-lo3pbo9mht] {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='white' viewBox='0 0 16 16'%3E%3Ccircle cx='8' cy='8' r='7'/%3E%3Cpath d='M5.6 4.4h6v6h-1.9V7.6L6.3 11 5 9.7l3.4-3.4H5.6z' fill='%23b02a37'/%3E%3C/svg%3E");
}

/* An entry of a flyout never wraps: a label broken over two lines reads as two entries, and the
   box is what should grow instead. */
.submenu .nav-item[b-lo3pbo9mht]  a.nav-link,
.submenu .nav-item[b-lo3pbo9mht]  span.nav-link {
    white-space: nowrap;
}

/* A group with nothing in it yet: the flyout still opens, and says so rather than showing an empty
   box that reads as broken. Not a link - there is nowhere to go. */
.submenu-empty[b-lo3pbo9mht] {
    opacity: 0.55;
    font-style: italic;
    cursor: default;
}
/* /Components/Layout/ReconnectModal.razor.rz.scp.css */
.components-reconnect-first-attempt-visible[b-ujo5tqeuto],
.components-reconnect-repeated-attempt-visible[b-ujo5tqeuto],
.components-reconnect-failed-visible[b-ujo5tqeuto],
.components-pause-visible[b-ujo5tqeuto],
.components-resume-failed-visible[b-ujo5tqeuto],
.components-rejoining-animation[b-ujo5tqeuto] {
    display: none;
}

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


#components-reconnect-modal[b-ujo5tqeuto] {
    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-ujo5tqeuto 0.5s both;
    &[open]

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

}

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

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

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

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

    100% {
        opacity: 1;
    }
}

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

    100% {
        opacity: 0;
    }
}

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

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

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

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

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

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

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

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

@keyframes components-rejoining-animation-b-ujo5tqeuto {
    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/Pages/GeographicalRegionTreeRow.razor.rz.scp.css */
/* A near-white hover is right on the light theme and unreadable on the dark one - there the row
   text is light, so the highlight has to be a lift of the surface rather than a flood of white. */
.tree-row:hover[b-lhjhi5f68m] {
    background-color: #f0f0f0;
}

html[data-bs-theme="dark"] .tree-row:hover[b-lhjhi5f68m] {
    background-color: rgba(255, 255, 255, 0.09);
}

/* The row the user was last working on, so returning from the edit screen lands the eye on it. */
.tree-row-active[b-lhjhi5f68m] {
    background-color: rgba(13, 110, 253, 0.12);
    box-shadow: inset 3px 0 0 0 var(--bs-primary, #0d6efd);
}

html[data-bs-theme="dark"] .tree-row-active[b-lhjhi5f68m] {
    background-color: rgba(110, 168, 254, 0.18);
}
/* /Components/Pages/PermissionPickerNodeRow.razor.rz.scp.css */
/* A near-white hover is right on the light theme and unreadable on the dark one - there the row
   text is light, so the highlight has to be a lift of the surface rather than a flood of white. */
.tree-row:hover[b-tutupxf3xt] {
    background-color: #f0f0f0;
}

html[data-bs-theme="dark"] .tree-row:hover[b-tutupxf3xt] {
    background-color: rgba(255, 255, 255, 0.09);
}
/* /Components/Pages/PermissionTreeNodeRow.razor.rz.scp.css */
/* A near-white hover is right on the light theme and unreadable on the dark one - there the row
   text is light, so the highlight has to be a lift of the surface rather than a flood of white. */
.tree-row:hover[b-ovlzbiskk2] {
    background-color: #f0f0f0;
}

html[data-bs-theme="dark"] .tree-row:hover[b-ovlzbiskk2] {
    background-color: rgba(255, 255, 255, 0.09);
}

/* The row the user was last working on, so returning from the edit screen lands the eye on it. */
.tree-row-active[b-ovlzbiskk2] {
    background-color: rgba(13, 110, 253, 0.12);
    box-shadow: inset 3px 0 0 0 var(--bs-primary, #0d6efd);
}

html[data-bs-theme="dark"] .tree-row-active[b-ovlzbiskk2] {
    background-color: rgba(110, 168, 254, 0.18);
}
/* /Components/Pages/PlatformUserGroupEdit.razor.rz.scp.css */
/* The permission tree can be long, so it scrolls inside its own box while the commands above it
   stay put - otherwise the OK/Cancel buttons disappear the moment the user starts looking. */
.tree-scroll[b-2pqn5bz1ys] {
    max-height: 60vh;
    overflow-y: auto;
}

.tree-commands[b-2pqn5bz1ys] {
    position: sticky;
    top: 0;
    z-index: 2;
    background-color: var(--bs-body-bg, #fff);
    padding: 0.5rem 0;
    border-bottom: 1px solid var(--bs-border-color, #dee2e6);
}
/* /Components/Pages/TrustConfigurationItems.razor.rz.scp.css */
/* The unique name is what identifies a row and the buttons are what you came to press, so those
   two never give way: the name is kept off a second line and the buttons on one. "Created by" and
   "Info" are context, so they are what disappears when the table has less room than that needs.

   Container queries rather than @media: what matters is the width left over for the table, and
   that changes with the nav sidebar, not only with the window. */
.tci-table-wrap[b-g869euu4j6] {
    container-type: inline-size;
}

.tci-table .tci-uniquename[b-g869euu4j6],
.tci-table .tci-actions[b-g869euu4j6] {
    white-space: nowrap;
}

/* Info is the wider of the two and the more useful, so "Created by" goes first. */
@container (max-width: 1100px) {
    .tci-table .tci-createdby[b-g869euu4j6] {
        display: none;
    }
}

@container (max-width: 820px) {
    .tci-table .tci-info[b-g869euu4j6] {
        display: none;
    }
}