/* /Components/Layout/MainLayout.razor.rz.scp.css */
.page[b-oe3odvdul1] {
    position: relative;
    display: flex;
    flex-direction: column;
}

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

.sidebar[b-oe3odvdul1] {
    background-image: linear-gradient(180deg, rgb(5, 39, 103) 0%, #3a0647 70%);
}

article[b-oe3odvdul1] {
    /* The template's top row (an "About" link into the ASP.NET Core docs) is gone, so the
       content starts at the very top of the page - give it back the vertical breathing room
       that row used to provide. */
    padding-top: 1.5rem;
}

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

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

        /* A column, so NavMenu's brand row keeps its natural height and its scrollable nav takes
           exactly the rest - see .nav-scrollable in NavMenu.razor.css for what a fixed guess at
           that split cost. */
        display: flex;
        flex-direction: column;
    }

    article[b-oe3odvdul1] {
        padding-left: 2rem !important;
        padding-right: 1.5rem !important;
    }
}

#blazor-error-ui[b-oe3odvdul1] {
    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-oe3odvdul1] {
        cursor: pointer;
        position: absolute;
        right: 0.75rem;
        top: 0.5rem;
    }

/* "Saving succeeded" after a "Save and close": three seconds to read it, one to fade, and then the
   bar gives its room back, so the page does not keep a gap where it was. */
.save-succeeded-bar[b-oe3odvdul1] {
    overflow: hidden;
    animation: save-succeeded-fade-b-oe3odvdul1 4s ease-in forwards;
}

@keyframes save-succeeded-fade-b-oe3odvdul1 {
    0%, 75% {
        opacity: 1;
        max-height: 6rem;
    }
    95% {
        opacity: 0;
        max-height: 6rem;
        padding-top: 1rem;
        padding-bottom: 1rem;
        margin-bottom: 1rem;
        border-width: 1px;
    }
    100% {
        opacity: 0;
        max-height: 0;
        padding-top: 0;
        padding-bottom: 0;
        margin-bottom: 0;
        border-width: 0;
    }
}
/* /Components/Layout/NavMenu.razor.rz.scp.css */
.navbar-toggler[b-8vueetjh1w] {
    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-8vueetjh1w] {
    background-color: rgba(255, 255, 255, 0.5);
}

.top-row[b-8vueetjh1w] {
    min-height: 4.25rem;
    background-color: rgba(0,0,0,0.4);
}

/* The header (2026-10-26): the logo beside one column of title and version - the version lines up
   with the title by being in the same column, and the logo is as tall as the column. */
.navbar-brand-block[b-8vueetjh1w] {
    display: flex;
    align-items: center;
    gap: 0.55rem;
}

.navbar-brand-column[b-8vueetjh1w] {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
}

.navbar-brand[b-8vueetjh1w] {
    font-size: 1.1rem;
    display: inline-flex;
    align-items: center;
    /* Bootstrap's own padding and margin would push the version away from the title. */
    padding: 0;
    margin: 0;
}

.navbar-brand:hover .navbar-brand-text > span:first-child[b-8vueetjh1w],
.navbar-brand-logo-link:hover + .navbar-brand-column .navbar-brand-text > span:first-child[b-8vueetjh1w] {
    /* The brand is the way home now that the nav item is gone - underline on hover so it reads
       as the link it always was; the logo is the same link. */
    text-decoration: underline;
}

.navbar-brand-text[b-8vueetjh1w] {
    display: flex;
    flex-direction: column;
    line-height: 1.2;
    /* Bootstrap's .navbar-brand is nowrap, which cut the name off at the 250px sidebar edge.
       Two wrapped lines plus the version still fit the row's 4.25rem min-height. */
    white-space: normal;
    font-size: 1rem;
}

.navbar-brand-versionline[b-8vueetjh1w] {
    /* Under the title, in its column, but outside the home link: the info icon beside the version
       is a link of its own and anchors do not nest. */
    display: flex;
    align-items: center;
    gap: 0.4rem;
    margin-top: 0.1rem;
}

.navbar-brand-version[b-8vueetjh1w] {
    /* Deliberately quiet: the version identifies the build for a bug report, it is not a piece
       of navigation. */
    font-size: 0.65rem;
    font-weight: 400;
    letter-spacing: 0.03em;
    color: rgba(255, 255, 255, 0.55);
}

.navbar-brand-changelog[b-8vueetjh1w] {
    /* As quiet as the version it annotates, until pointed at. */
    color: rgba(255, 255, 255, 0.55);
    font-size: 0.75rem;
    line-height: 1;
    text-decoration: none;
}

.navbar-brand-changelog:hover[b-8vueetjh1w] {
    color: #fff;
}

.navbar-brand-logo-link[b-8vueetjh1w] {
    display: block;
    flex: none;
}

/* As tall as the column beside it: two title lines and the version - one title line during the
   setup. Measured in the browser (2026-10-26); the column's fonts are fixed in rem. */
.navbar-brand-logo[b-8vueetjh1w] {
    display: block;
    height: 3.475rem;
    width: auto;
}

.navbar-brand-block-setup .navbar-brand-logo[b-8vueetjh1w] {
    height: 2.275rem;
}

/* One icon size and one gap for every row in the sidebar - nav items, the account trigger and
   the flyout's own items alike. Anything that wants to look like a menu row uses these two and
   --bop-nav-text below; overriding them per row is what had the icons and labels drifting
   apart in the first place. */
.nav-scrollable[b-8vueetjh1w],
.user-flyout-anchor[b-8vueetjh1w],
.user-flyout[b-8vueetjh1w] {
    --bop-nav-icon: 1.25rem;
    --bop-nav-gap: 0.75rem;
    --bop-nav-text: 0.9rem;
}

.bi[b-8vueetjh1w] {
    display: inline-block;
    position: relative;
    width: var(--bop-nav-icon);
    height: var(--bop-nav-icon);
    margin-right: var(--bop-nav-gap);
    top: -1px;
    flex: 0 0 auto;
    background-size: cover;
}

.bi-plus-square-fill-nav-menu[b-8vueetjh1w] {
    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-8vueetjh1w] {
    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-8vueetjh1w] {
    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-8vueetjh1w] {
    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-8vueetjh1w] {
    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-8vueetjh1w] {
    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-list-check-nav-menu[b-8vueetjh1w] {
    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.6' stroke-linecap='round' stroke-linejoin='round' viewBox='0 0 16 16'%3E%3Cpath d='M1.5 4l1.5 1.5L5.5 3'/%3E%3Cpath d='M1.5 9l1.5 1.5L5.5 8'/%3E%3Cpath d='M1.5 14l1.5 1.5L5.5 13'/%3E%3Cline x1='7.5' y1='4' x2='14.5' y2='4'/%3E%3Cline x1='7.5' y1='9' x2='14.5' y2='9'/%3E%3Cline x1='7.5' y1='14' x2='14.5' y2='14'/%3E%3C/svg%3E");
}

.bi-play-circle-fill-nav-menu[b-8vueetjh1w] {
    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='M16 8A8 8 0 1 1 0 8a8 8 0 0 1 16 0zM6.79 5.093A.5.5 0 0 0 6 5.5v5a.5.5 0 0 0 .79.407l3.5-2.5a.5.5 0 0 0 0-.814l-3.5-2.5z'/%3E%3C/svg%3E");
}

/* Site-Settings: a building - the site - drawn in the same outline weight as the globe below it. */
.bi-building-nav-menu[b-8vueetjh1w] {
    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='2.5' y='1.5' width='7.5' height='13' rx='0.5'/%3E%3Cpath d='M10 6.5h3.5v8H10M1 14.5h14M4.75 4.25h1M7 4.25h1M4.75 7h1M7 7h1M4.75 9.75h1M7 9.75h1M11.5 9h0.5M11.5 11.5h0.5'/%3E%3C/svg%3E");
}

.bi-globe-fill-nav-menu[b-8vueetjh1w] {
    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-megaphone-fill-nav-menu[b-8vueetjh1w] {
    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-person-fill-user-frame[b-8vueetjh1w] {
    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");
}

.bi-sliders-fill-nav-menu[b-8vueetjh1w] {
    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");
}

.bi-gear-fill-nav-menu[b-8vueetjh1w] {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='white' class='bi bi-gear-fill' viewBox='0 0 16 16'%3E%3Cpath d='M9.405 1.05c-.413-1.4-2.397-1.4-2.81 0l-.1.34a1.464 1.464 0 0 1-2.105.872l-.31-.17c-1.283-.698-2.686.705-1.987 1.987l.169.311c.446.82.023 1.841-.872 2.105l-.34.1c-1.4.413-1.4 2.397 0 2.81l.34.1a1.464 1.464 0 0 1 .872 2.105l-.17.31c-.698 1.283.705 2.686 1.987 1.987l.311-.169a1.464 1.464 0 0 1 2.105.872l.1.34c.413 1.4 2.397 1.4 2.81 0l.1-.34a1.464 1.464 0 0 1 2.105-.872l.31.17c1.283.698 2.686-.705 1.987-1.987l-.169-.311a1.464 1.464 0 0 1 .872-2.105l.34-.1c1.4-.413 1.4-2.397 0-2.81l-.34-.1a1.464 1.464 0 0 1-.872-2.105l.17-.31c.698-1.283-.705-2.686-1.987-1.987l-.311.169a1.464 1.464 0 0 1-2.105-.872zM8 10.93a2.929 2.929 0 1 1 0-5.86 2.929 2.929 0 0 1 0 5.858z'/%3E%3C/svg%3E");
}

.bi-journal-text-fill-nav-menu[b-8vueetjh1w] {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='white' class='bi bi-journal-text' viewBox='0 0 16 16'%3E%3Cpath d='M5 10.5a.5.5 0 0 1 .5-.5h4a.5.5 0 0 1 0 1h-4a.5.5 0 0 1-.5-.5zm0-2a.5.5 0 0 1 .5-.5h4a.5.5 0 0 1 0 1h-4a.5.5 0 0 1-.5-.5zm0-2a.5.5 0 0 1 .5-.5h4a.5.5 0 0 1 0 1h-4a.5.5 0 0 1-.5-.5zm0-2a.5.5 0 0 1 .5-.5h4a.5.5 0 0 1 0 1h-4a.5.5 0 0 1-.5-.5z'/%3E%3Cpath d='M3 0h10a2 2 0 0 1 2 2v12a2 2 0 0 1-2 2H3a2 2 0 0 1-2-2v-1h1v1a1 1 0 0 0 1 1h10a1 1 0 0 0 1-1V2a1 1 0 0 0-1-1H3a1 1 0 0 0-1 1v1H1V2a2 2 0 0 1 2-2z'/%3E%3Cpath d='M1 5v-.5a.5.5 0 0 1 1 0V5h.5a.5.5 0 0 1 0 1h-2a.5.5 0 0 1 0-1H1zm0 3v-.5a.5.5 0 0 1 1 0V8h.5a.5.5 0 0 1 0 1h-2a.5.5 0 0 1 0-1H1zm0 3v-.5a.5.5 0 0 1 1 0v.5h.5a.5.5 0 0 1 0 1h-2a.5.5 0 0 1 0-1H1z'/%3E%3C/svg%3E");
}

.active-site-box[b-8vueetjh1w] {
    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-name[b-8vueetjh1w] {
    font-weight: 600;
}

.active-site-box-state[b-8vueetjh1w] {
    text-transform: uppercase;
    font-size: 0.7rem;
    letter-spacing: 0.03em;
    color: #dee2e6;
}

/* The box's colour is the RIG's lifecycle state (RIGLifecycle.md): grey while it is being built,
   blue once activated, green once it holds realms. The same three suffixes colour the badge on the
   RIG overview - see app.css - so the two never disagree about a state. */
.active-site-box.rig-lifecycle-predeployment[b-8vueetjh1w] {
    background-color: #495057;
}

.active-site-box.rig-lifecycle-activated[b-8vueetjh1w] {
    background-color: #b8860b;
}

.active-site-box.rig-lifecycle-operative[b-8vueetjh1w] {
    background-color: #198754;
}

.activity-indicator[b-8vueetjh1w] {
    /* What this tab is persisting right now (ActivityTracker), just above Account. A sibling of
       .user-flyout-anchor, outside .nav-scrollable, so it never scrolls away. Rendered only while
       something runs, and a moment after - which is why it is not collapsed with the nav on narrow
       screens: a save in progress is worth a row even there. */
    flex: 0 0 auto;
    display: flex;
    align-items: center;
    gap: 0.6rem;
    padding: 0.5rem 1.5rem;
    background-color: rgba(13, 110, 253, 0.28);
    border-top: 1px solid rgba(255, 255, 255, 0.12);
    color: #fff;
    font-size: 0.85rem;
    line-height: 1.2;
    animation: activity-indicator-in-b-8vueetjh1w 0.2s ease-out;
}

.activity-indicator-spinner[b-8vueetjh1w] {
    flex: 0 0 auto;
    width: 1rem;
    height: 1rem;
    border-width: 0.15em;
}

.activity-indicator.is-done[b-8vueetjh1w] {
    /* The moment after: the work ended, and the row says so before it goes. */
    background-color: rgba(25, 135, 84, 0.6);
}

.activity-indicator-done[b-8vueetjh1w] {
    flex: 0 0 auto;
    width: 1rem;
    text-align: center;
    font-weight: 700;
}

.activity-indicator-text[b-8vueetjh1w] {
    /* Two lines at most: the sidebar is narrow, and "... - finished" cut off at its end would hide
       the one word that matters. The full list of what runs is in the row's tooltip. */
    min-width: 0;
    overflow: hidden;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
    line-clamp: 2;
}

@keyframes activity-indicator-in-b-8vueetjh1w {
    from { opacity: 0; transform: translateY(0.4rem); }
    to   { opacity: 1; transform: none; }
}

.user-flyout-anchor[b-8vueetjh1w] {
    /* The sidebar's last flex item, sitting under the scrollable nav rather than inside it (see
       NavMenu.razor for why). It never scrolls away, and the panel below is positioned against
       it, so the two line up whatever the window height. */
    position: relative;
    flex: 0 0 auto;

    /* Collapsed with the rest of the nav on narrow screens - it is a sibling of the toggler
       checkbox now, so the same :checked rule reaches it. */
    display: none;
}

.navbar-toggler:checked ~ .user-flyout-anchor[b-8vueetjh1w] {
    display: block;
}

.active-user-frame[b-8vueetjh1w] {
    /* A <button> (it opens the flyout), so it has to unlearn the browser's button chrome. Flush
       to the bottom and the full width of the sidebar - a footer bar rather than a floating
       card, so nothing is left over below it and the flyout has a hard edge to line up with.

       The horizontal padding is 1.5rem, not 1rem: a nav item above it is inset by its own px-3
       plus the nav-link padding, and this row has to start its icon on the same vertical line. */
    width: 100%;
    margin: 0;
    position: relative;
    z-index: 1002;
    padding: 0.75rem 1.5rem;
    background-color: rgba(255, 255, 255, 0.08);
    border: none;
    border-radius: 0;
    display: flex;
    align-items: center;
    text-align: left;
    cursor: pointer;
}

.active-user-frame:hover[b-8vueetjh1w] {
    background-color: rgba(255, 255, 255, 0.16);
}

.user-flyout-backdrop[b-8vueetjh1w] {
    /* Fixed, so an outside click anywhere closes the flyout. It is not clipped by the sidebar's
       own overflow-y: auto - only a transformed ancestor could do that, and there is none. */
    position: fixed;
    inset: 0;
    z-index: 1000;
}

.user-flyout[b-8vueetjh1w] {
    /* Narrow screens: the sidebar is the whole width, so there is no "right" to fly out to -
       the panel sits above the trigger, as wide as the sidebar. The desktop rules further down
       are what move it out to the side. */
    position: absolute;
    bottom: 100%;
    left: 0;
    right: 0;
    z-index: 1001;
    padding: 0.75rem 0;
    border-radius: 6px;
    background-color: #2b2b3d;
    box-shadow: 0 2px 14px rgba(0, 0, 0, 0.5);
    color: #d7d7d7;
    font-size: 0.85rem;
}

.user-flyout-url[b-8vueetjh1w] {
    /* The repository URL in full. It is longer than any sensible panel width, so it wraps rather
       than being cut off - this is the one place the URL is still shown since the sidebar's
       "Active Site Repository" box was dropped. */
    color: #9a9ab0;
    font-size: 0.7rem;
    line-height: 1.35;
    margin-top: 0.1rem;
    overflow-wrap: anywhere;
}

.user-flyout-header[b-8vueetjh1w] {
    padding: 0 1rem;
}

.user-flyout-header-top[b-8vueetjh1w] {
    /* Stacked rather than side by side with the logout button: the whole point of the wider
       panel is that the username and the repository name are never cut off, and sharing the row
       with a button was what forced the ellipsis. */
    display: block;
}

.user-flyout-identity[b-8vueetjh1w] {
    min-width: 0;
}

.user-flyout-account[b-8vueetjh1w] {
    color: #b9b9cc;
    font-size: 0.75rem;
    overflow-wrap: anywhere;
}

.user-flyout-label[b-8vueetjh1w] {
    font-weight: 600;
    text-transform: uppercase;
    font-size: 0.7rem;
    letter-spacing: 0.03em;
    color: #a9a9bb;
    margin-top: 0.35rem;
}

.user-flyout-value[b-8vueetjh1w] {
    /* No ellipsis: the panel is sized so these fit, and a half-shown repository name is exactly
       what this flyout was widened to stop doing. */
    color: #ffffff;
    overflow-wrap: anywhere;
}

.user-flyout-logout-form[b-8vueetjh1w] {
    margin: 0.75rem 0 0;
    display: flex;
    justify-content: flex-end;
}

.user-flyout-logout-btn[b-8vueetjh1w] {
    background: none;
    border: 1px solid rgba(255, 255, 255, 0.25);
    border-radius: 4px;
    color: #d7d7d7;
    font-size: var(--bop-nav-text);
    padding: 0.3rem 0.7rem;
    display: flex;
    align-items: center;
    cursor: pointer;
    white-space: nowrap;
}

.user-flyout-logout-btn .bi[b-8vueetjh1w] {
    margin-right: 0.5rem;
}

.user-flyout-logout-btn:hover[b-8vueetjh1w] {
    color: white;
    background-color: rgba(255, 255, 255, 0.1);
}

.user-flyout-separator[b-8vueetjh1w] {
    margin: 0.6rem 0;
    border: 0;
    border-top: 1px solid rgba(255, 255, 255, 0.15);
    opacity: 1;
}

.user-flyout[b-8vueetjh1w]  .user-flyout-item {
    display: flex;
    align-items: center;
    padding: 0.6rem 1rem;
    font-size: var(--bop-nav-text);
    color: #d7d7d7;
    text-decoration: none;
}

.user-flyout[b-8vueetjh1w]  .user-flyout-item:hover {
    background-color: rgba(255, 255, 255, 0.1);
    color: white;
}

.user-flyout[b-8vueetjh1w]  .user-flyout-item.active {
    background-color: rgba(255, 255, 255, 0.2);
    color: white;
}

.bi-caret-user-frame[b-8vueetjh1w] {
    width: 0.7rem;
    height: 0.7rem;
    margin-right: 0;
    flex: 0 0 auto;
    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%3Cpath d='M8 4.5 14 11H2z'/%3E%3C/svg%3E");
}

.bi-caret-user-frame.is-open[b-8vueetjh1w] {
    transform: rotate(180deg);
}

@media (min-width: 641px) {
    .bi-caret-user-frame[b-8vueetjh1w] {
        /* Pointing right, at the side the panel comes out of. */
        transform: rotate(90deg);
    }

    .bi-caret-user-frame.is-open[b-8vueetjh1w] {
        transform: rotate(270deg);
    }

    .user-flyout-anchor[b-8vueetjh1w] {
        display: block;
    }

    .user-flyout[b-8vueetjh1w] {
        /* Absolute against the anchor, which is why the anchor had to leave .nav-scrollable:
           bottom: 0 puts the panel's bottom edge exactly on the trigger's, so the two are flush
           at any window height and the panel can only grow upwards. No viewport arithmetic, and
           nothing to drift when the nav scrolls.

           It starts exactly at the anchor's right edge - left: 100%, with no overlap and no gap.
           The overlap it used to carry was there to bridge a dead strip, which only existed while
           the panel was positioned against the viewport and could land a fraction off; against
           the anchor the two boxes are adjacent by definition. A gap would still be a problem
           (the pointer would be over neither box on the way across), so do not turn this into a
           margin - but the panel is also a DOM child of the anchor, so moving into it never fires
           the anchor's mouseleave however far outside its box the panel is drawn. */
        position: absolute;
        left: 100%;
        right: auto;
        bottom: 0;
        width: 24rem;
        max-width: calc(100vw - 250px - 1rem);
        box-shadow: 2px 2px 14px rgba(0, 0, 0, 0.5);
    }
}

.active-user-frame-name[b-8vueetjh1w] {
    flex: 1 1 auto;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    color: #d7d7d7;
    font-size: var(--bop-nav-text);
}

.nav-item[b-8vueetjh1w] {
    font-size: var(--bop-nav-text);
    padding-bottom: 0.5rem;
}

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

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

    .nav-item[b-8vueetjh1w]  .nav-link {
        color: #d7d7d7;
        background: none;
        border: none;
        border-radius: 4px;
        padding: 0.6rem 0.5rem;
        display: flex;
        align-items: center;
        line-height: 1.4;
        width: 100%;
    }

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

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

/* Activation Preparation and Activate RIG are styled as nav rows so they sit in the list like one,
   and are dimmed rather than hidden while their preconditions are not met: a button that is there
   and disabled says "not yet" (the tooltip says why), one that is missing says nothing. */
.nav-item .nav-rig-preparation[b-8vueetjh1w],
.nav-item .nav-rig-activate[b-8vueetjh1w] {
    text-align: left;
    cursor: pointer;
}

.nav-item .nav-rig-preparation:disabled[b-8vueetjh1w],
.nav-item .nav-rig-activate:disabled[b-8vueetjh1w] {
    color: #8a8f94;
    cursor: not-allowed;
    background: none;
}

.nav-item .nav-rig-preparation:disabled .bi[b-8vueetjh1w],
.nav-item .nav-rig-activate:disabled .bi[b-8vueetjh1w] {
    opacity: 0.5;
}

/* Green once everything is in place: the one entry in the menu that is a verdict as well as a
   button. Bootstrap's success green, so it reads like the badges everywhere else. */
.nav-item .nav-rig-activate-ready[b-8vueetjh1w] {
    background-color: #198754;
    color: white;
}

.nav-item .nav-rig-activate-ready:hover[b-8vueetjh1w] {
    background-color: #157347;
    color: white;
}

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

.nav-site-settings[b-8vueetjh1w] {
    /* The menu's last entry, at its bottom right above Account: .nav-scrollable is a flex column, so
       an auto top margin takes up whatever height the entries above leave. */
    margin-top: auto;
    padding-top: 0.5rem;
}

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

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

    .nav-scrollable[b-8vueetjh1w] {
        /* Never collapse the sidebar for wide screens */
        display: flex;
        flex-direction: column;

        /* Fills whatever the brand row leaves, and scrolls only if its own content is taller.
           This used to be height: calc(100vh - 3.5rem), a guess at the brand row's height that
           stopped being true the moment the application title wrapped to two lines and gained a
           version underneath: the sidebar then ran ~12px past the bottom of the viewport, which
           pushed the user frame's bottom margin out of sight and left the whole lower menu
           looking misaligned. The flex fill has no number in it to go stale. */
        flex: 1 1 auto;
        min-height: 0;
        overflow-y: auto;
    }
}

.bi-activity-nav-menu[b-8vueetjh1w] {
    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.6' stroke-linecap='round' stroke-linejoin='round' viewBox='0 0 16 16'%3E%3Cpolyline points='1,9 4,9 6,4 9,13 11,9 15,9'/%3E%3C/svg%3E");
}
/* /Components/Layout/ReconnectModal.razor.rz.scp.css */
.components-reconnect-first-attempt-visible[b-n6oycv2ndu],
.components-reconnect-repeated-attempt-visible[b-n6oycv2ndu],
.components-reconnect-failed-visible[b-n6oycv2ndu],
.components-pause-visible[b-n6oycv2ndu],
.components-resume-failed-visible[b-n6oycv2ndu],
.components-rejoining-animation[b-n6oycv2ndu] {
    display: none;
}

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


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

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

}

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

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

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

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

    100% {
        opacity: 1;
    }
}

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

    100% {
        opacity: 0;
    }
}

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

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

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

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

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

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

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

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

@keyframes components-rejoining-animation-b-n6oycv2ndu {
    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/HostPreparation.razor.rz.scp.css */
/* "Add prepared host" as a wizard of two steps (HostPreparation.razor): the step indicator above
   both pages - the current step filled, a done one with a tick, a pending one outlined. */
.prepare-wizard[b-2j2v9kgfd4] {
    display: flex;
    flex-wrap: wrap;
    gap: 0.5rem 2rem;
    list-style: none;
    padding: 0 0 0.75rem 0;
    margin: 0 0 1.25rem 0;
    border-bottom: 1px solid var(--bs-border-color);
}

.prepare-wizard-step[b-2j2v9kgfd4] {
    display: flex;
    align-items: center;
    gap: 0.6rem;
    color: var(--bs-secondary-color);
}

.prepare-wizard-number[b-2j2v9kgfd4] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 1.9rem;
    height: 1.9rem;
    border-radius: 50%;
    border: 2px solid currentColor;
    font-weight: 600;
    flex: 0 0 auto;
}

.prepare-wizard-step.is-current[b-2j2v9kgfd4] {
    color: var(--bs-body-color);
    font-weight: 600;
}

.prepare-wizard-step.is-current .prepare-wizard-number[b-2j2v9kgfd4] {
    background-color: var(--bs-primary);
    border-color: var(--bs-primary);
    color: #fff;
}

.prepare-wizard-step.is-done .prepare-wizard-number[b-2j2v9kgfd4] {
    background-color: var(--bs-success);
    border-color: var(--bs-success);
    color: #fff;
}

.prepare-adapter-list[b-2j2v9kgfd4] {
    flex: 1 1 20rem;
    padding-top: 0.25rem;
}
/* /Components/Pages/Hosts.razor.rz.scp.css */
.host-drag-handle[b-bs8nomq86k] {
    cursor: grab;
    color: #6c757d;
    user-select: none;
    width: 1.5rem;
    text-align: center;
}

.host-row[draggable="true"]:active[b-bs8nomq86k] {
    cursor: grabbing;
}

/* The per-row retry is a glyph, not a button-shaped button: it sits in a table cell right next to
   the status badge, and anything with a border of its own there reads as a second status. */
.host-status-retry[b-bs8nomq86k] {
    background: none;
    border: none;
    padding: 0 0 0 0.35rem;
    color: #6c757d;
    font-size: 1.1rem;
    line-height: 1;
    vertical-align: middle;
    cursor: pointer;
}

.host-status-retry:hover[b-bs8nomq86k] {
    color: #0d6efd;
}

/* Bootstrap's small spinner is sized for buttons; inside a badge it needs to be badge-sized. */
.badge .spinner-border[b-bs8nomq86k] {
    width: 0.7rem;
    height: 0.7rem;
    border-width: 0.12em;
    vertical-align: -0.05em;
}

/* A row is selected by clicking it, and the action bar above the table acts on it. Bootstrap's
   table-active supplies the tint; the accent on the left edge is what makes the selection readable
   at a glance in a table where every row already carries two coloured badges. */
.host-row[b-bs8nomq86k] {
    cursor: pointer;
}

.host-row-selected > td:first-child[b-bs8nomq86k] {
    border-left: 0.25rem solid #0d6efd;
}
/* /Components/Pages/LogonProgressPage.razor.rz.scp.css */
/* The steps themselves are StepProgressList's; this page only keeps them to a readable width. */

.logon-progress[b-ds1noxceuc] {
    max-width: 32rem;
}
/* /Components/Pages/RigServices.razor.rz.scp.css */
/* The state dot on each tab: red / yellow / green, plus grey for a service nobody could ask about.
   Bootstrap's own danger/warning/success colours, so it reads like the badges in the rows. */
.rig-service-state[b-jkep7vxqhb] {
    display: inline-block;
    width: 0.7rem;
    height: 0.7rem;
    border-radius: 50%;
    margin-right: 0.45rem;
    vertical-align: baseline;
    background: #adb5bd;
}

.rig-service-state-notfullyinstalled[b-jkep7vxqhb] {
    background: #dc3545;
}

.rig-service-state-requiresupdates[b-jkep7vxqhb] {
    background: #ffc107;
}

.rig-service-state-uptodate[b-jkep7vxqhb] {
    background: #198754;
}

.rig-service-state-unknown[b-jkep7vxqhb] {
    background: #adb5bd;
}

/* The per-row retry is a glyph, not a button-shaped button - the same reasoning as on Hosts: it
   sits in a table cell beside a status, and anything with a border there reads as a second status. */
.rig-service-retry[b-jkep7vxqhb] {
    background: none;
    border: none;
    padding: 0 0 0 0.35rem;
    color: #6c757d;
    font-size: 1.1rem;
    line-height: 1;
    vertical-align: middle;
    cursor: pointer;
}

.rig-service-retry:hover[b-jkep7vxqhb] {
    color: #0d6efd;
}

.rig-service-step[b-jkep7vxqhb] {
    font-size: 0.85rem;
    color: #6c757d;
}

.rig-service-actions[b-jkep7vxqhb] {
    white-space: nowrap;
}

/* The deployment status row belongs to the host row above it: no border between the two, and a
   minimum height so a one-line step and a two-line one take the same room. */
.rig-service-host-row.has-progress > td[b-jkep7vxqhb] {
    border-bottom: 0;
}

.rig-service-progress-row > td[b-jkep7vxqhb] {
    padding-top: 0;
}

.rig-service-deploy-status[b-jkep7vxqhb] {
    font-size: 0.875rem;
    line-height: 1.3;
    min-height: 2.6em;
    padding-left: 0.25rem;
}
/* /Components/RigNetworkPicker.razor.rz.scp.css */
/* The slots are buttons dressed as the range badges of Colocation Site Settings. */
.rig-network-slot[b-f2h2wqcy19] {
    cursor: pointer;
}

.rig-network-slot:disabled[b-f2h2wqcy19] {
    cursor: default;
}

.rig-network-slot-free:not(:disabled):hover[b-f2h2wqcy19] {
    border-color: var(--bs-success) !important;
}

/* This RIG's pick: green, with a red ring so it stands out among the red slots other RIGs hold. */
.rig-network-slot-picked[b-f2h2wqcy19] {
    box-shadow: 0 0 0 2px var(--bs-danger);
}
/* /Components/StepProgressList.razor.rz.scp.css */
/* An icon column of one width, so the labels line up whatever each step shows, and the duration at
   the right end of the row. */

.step-progress-row[b-mzz9q8whgq] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
}

.step-progress-icon[b-mzz9q8whgq] {
    flex: 0 0 1.25rem;
    display: inline-flex;
    justify-content: center;
}

.step-progress-label[b-mzz9q8whgq] {
    flex: 1 1 auto;
}

.step-progress-duration[b-mzz9q8whgq] {
    flex: 0 0 auto;
    font-variant-numeric: tabular-nums;
}

.step-progress-pending .step-progress-label[b-mzz9q8whgq] {
    color: var(--bs-secondary-color);
}

.step-progress-detail[b-mzz9q8whgq] {
    margin-left: 1.75rem;
    overflow-wrap: anywhere;
}