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

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

/* Colours come from theme.css, like everything else's: see --app-sidebar-* and --app-topbar-bg. */
.sidebar[b-baov9m8rda] {
    background: var(--app-sidebar-bg);
}

.top-row[b-baov9m8rda] {
    background-color: var(--app-topbar-bg);
    border-bottom: 1px solid var(--bs-border-color);
    justify-content: flex-end;
    min-height: 3.5rem;
    padding-top: 0.375rem;
    padding-bottom: 0.375rem;
    display: flex;
    align-items: center;
}

/* Mediphany's logo, at the left of the top bar of a page that has no sidebar to carry it. */
.app-title[b-baov9m8rda] {
    display: flex;
    align-items: center;
    min-width: 0;
}

/* The top bar is white in light mode, where the logo's white "Y" would vanish, so the logo sits on
   a patch of the sidebar's Azure, in both modes for the same shape. */
.app-title .partner-logo[b-baov9m8rda] {
    box-sizing: content-box;
    padding: 0.1rem 0.35rem;
    border-radius: 0.25rem;
    background-color: var(--app-partner-logo-bg);
}

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

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

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

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

    /* The theme choice is a desktop control. The account is in the menu when there is one, and
       then the bar holds nothing. */
    .theme-choice[b-baov9m8rda],
    .top-row.with-menu[b-baov9m8rda] {
        display: none;
    }
}

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

    /* A column, so that the menu under the brand row takes what is left of the height, however tall
       the brand row is (NavMenu.razor.css). */
    .sidebar[b-baov9m8rda] {
        width: 250px;
        height: 100vh;
        position: sticky;
        top: 0;
        display: flex;
        flex-direction: column;
    }

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

    /* Beside the sidebar, as tall as its brand row, so their lower edges line up. */
    .top-row.with-menu[b-baov9m8rda] {
        min-height: var(--app-brand-row-height);
    }

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

#blazor-error-ui[b-baov9m8rda] {
    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-baov9m8rda] {
        cursor: pointer;
        position: absolute;
        right: 0.75rem;
        top: 0.5rem;
    }
/* /Components/Layout/NavMenu.razor.rz.scp.css */
/* Every colour here is one of theme.css's --app-sidebar-* variables, so the sidebar follows the
   app's palette, light or dark. The menu button's bars and the icons are drawn in the text colour
   rather than as white images, which is what lets a light sidebar work at all. */

.navbar-toggler[b-sqeoc5jjos] {
    appearance: none;
    cursor: pointer;
    width: 3.5rem;
    height: 2.5rem;
    color: var(--app-sidebar-text);
    position: absolute;
    top: calc((var(--app-brand-row-height) - 2.5rem) / 2);
    right: 1rem;
    border: 1px solid var(--app-sidebar-hover-bg);
    background:
        linear-gradient(currentColor, currentColor) center calc(50% - 0.45rem) / 1.3rem 2px no-repeat,
        linear-gradient(currentColor, currentColor) center / 1.3rem 2px no-repeat,
        linear-gradient(currentColor, currentColor) center calc(50% + 0.45rem) / 1.3rem 2px no-repeat,
        var(--app-sidebar-hover-bg);
}

.navbar-toggler:checked[b-sqeoc5jjos] {
    background-color: var(--app-sidebar-active-bg);
}

.top-row[b-sqeoc5jjos] {
    min-height: var(--app-brand-row-height);
    background-color: var(--app-sidebar-brand-bg);
}

.navbar-brand[b-sqeoc5jjos],
.navbar-brand:hover[b-sqeoc5jjos],
.navbar-brand:focus[b-sqeoc5jjos] {
    font-size: 1rem;
    color: var(--app-sidebar-text-active);
}

/* Mediphany's logo inside the brand row, as tall as the top bar beside it. */
.navbar > .brand-stack[b-sqeoc5jjos] {
    flex-direction: column;
    align-items: flex-start;
    gap: 0.2rem;
}

/* The link home around the logo, kept to the logo's own size. */
.brand-stack .navbar-brand[b-sqeoc5jjos] {
    display: flex;
    align-items: center;
    min-width: 0;
    max-width: 100%;
    margin-right: 0;
    padding: 0;
    white-space: normal;
}

/* Each icon class names its shape in --nav-icon; the shape is a mask over the link's own colour. */
.bi[b-sqeoc5jjos] {
    display: inline-block;
    position: relative;
    width: 1.25rem;
    height: 1.25rem;
    margin-right: 0.75rem;
    top: -1px;
    background-color: currentColor;
    -webkit-mask: var(--nav-icon) no-repeat center / contain;
    mask: var(--nav-icon) no-repeat center / contain;
}

.bi-house-door-fill-nav-menu[b-sqeoc5jjos] {
    --nav-icon: 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-sqeoc5jjos] {
    --nav-icon: 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-people-fill-nav-menu[b-sqeoc5jjos] {
    --nav-icon: 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 1H7Zm4-6a3 3 0 1 0 0-6 3 3 0 0 0 0 6Zm-5.784 6A2.238 2.238 0 0 1 5 13c0-1.355.68-2.75 1.936-3.72A6.325 6.325 0 0 0 5 9c-4 0-5 3-5 4s1 1 1 1h4.216ZM4.5 8a2.5 2.5 0 1 0 0-5 2.5 2.5 0 0 0 0 5Z'/%3E%3C/svg%3E");
}

.bi-person-fill-nav-menu[b-sqeoc5jjos] {
    --nav-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='white' class='bi bi-person-fill' viewBox='0 0 16 16'%3E%3Cpath d='M3 14s-1 0-1-1 1-4 6-4 6 3 6 4-1 1-1 1H3Zm5-6a3 3 0 1 0 0-6 3 3 0 0 0 0 6Z'/%3E%3C/svg%3E");
}

.bi-bar-chart-fill-nav-menu[b-sqeoc5jjos] {
    --nav-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='white' class='bi bi-bar-chart-fill' viewBox='0 0 16 16'%3E%3Cpath d='M1 11a1 1 0 0 1 1-1h2a1 1 0 0 1 1 1v3a1 1 0 0 1-1 1H2a1 1 0 0 1-1-1v-3zm5-4a1 1 0 0 1 1-1h2a1 1 0 0 1 1 1v7a1 1 0 0 1-1 1H7a1 1 0 0 1-1-1V7zm5-5a1 1 0 0 1 1-1h2a1 1 0 0 1 1 1v12a1 1 0 0 1-1 1h-2a1 1 0 0 1-1-1V2z'/%3E%3C/svg%3E");
}

.bi-list-nested-nav-menu[b-sqeoc5jjos] {
    --nav-icon: 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-gear-fill-nav-menu[b-sqeoc5jjos] {
    --nav-icon: 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-.872l-.1-.34zM8 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");
}

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

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

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

    .nav-item[b-sqeoc5jjos]  .nav-link {
        color: var(--app-sidebar-text);
        background: none;
        border: none;
        border-radius: 4px;
        height: 3rem;
        display: flex;
        align-items: center;
        line-height: 3rem;
        width: 100%;
    }

.nav-item[b-sqeoc5jjos]  a.active {
    background-color: var(--app-sidebar-active-bg);
    color: var(--app-sidebar-text-active);
}

.nav-item[b-sqeoc5jjos]  .nav-link:hover {
    background-color: var(--app-sidebar-hover-bg);
    color: var(--app-sidebar-text-active);
}

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

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

/* The account, at the foot of the menu on a phone. */
.nav-account[b-sqeoc5jjos] {
    border-top: 1px solid var(--app-sidebar-hover-bg);
    margin-top: 0.5rem;
}

.nav-user[b-sqeoc5jjos] {
    color: var(--app-sidebar-text-active);
    display: flex;
    align-items: center;
    height: 3rem;
    padding: 0 1rem;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.bi-box-arrow-right-nav-menu[b-sqeoc5jjos] {
    --nav-icon: 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 fill-rule='evenodd' d='M10 12.5a.5.5 0 0 1-.5.5h-8a.5.5 0 0 1-.5-.5v-9a.5.5 0 0 1 .5-.5h8a.5.5 0 0 1 .5.5v2a.5.5 0 0 0 1 0v-2A1.5 1.5 0 0 0 9.5 2h-8A1.5 1.5 0 0 0 0 3.5v9A1.5 1.5 0 0 0 1.5 14h8a1.5 1.5 0 0 0 1.5-1.5v-2a.5.5 0 0 0-1 0v2z'/%3E%3Cpath fill-rule='evenodd' d='M15.854 8.354a.5.5 0 0 0 0-.708l-3-3a.5.5 0 0 0-.708.708L14.293 7.5H5.5a.5.5 0 0 0 0 1h8.793l-2.147 2.146a.5.5 0 0 0 .708.708l3-3z'/%3E%3C/svg%3E");
}

.bi-box-arrow-in-right-nav-menu[b-sqeoc5jjos] {
    --nav-icon: 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 fill-rule='evenodd' d='M6 3.5a.5.5 0 0 1 .5-.5h8a.5.5 0 0 1 .5.5v9a.5.5 0 0 1-.5.5h-8a.5.5 0 0 1-.5-.5v-2a.5.5 0 0 0-1 0v2A1.5 1.5 0 0 0 6.5 14h8a1.5 1.5 0 0 0 1.5-1.5v-9A1.5 1.5 0 0 0 14.5 2h-8A1.5 1.5 0 0 0 5 3.5v2a.5.5 0 0 0 1 0v-2z'/%3E%3Cpath fill-rule='evenodd' d='M11.854 8.354a.5.5 0 0 0 0-.708l-3-3a.5.5 0 1 0-.708.708L10.293 7.5H1.5a.5.5 0 0 0 0 1h8.793l-2.147 2.146a.5.5 0 0 0 .708.708l3-3z'/%3E%3C/svg%3E");
}

/* On a phone the brand row is the top of the page, with the menu button over its right-hand end: the
   name wraps short of the button rather than running under it. */
@media (max-width: 640.98px) {
    .top-row[b-sqeoc5jjos] {
        padding-right: 4.5rem;
    }
}

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

    .nav-account[b-sqeoc5jjos] {
        display: none;
    }

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

        /* Allow sidebar to scroll for tall menus, in whatever height the brand row leaves */
        flex: 1 1 auto;
        min-height: 0;
        overflow-y: auto;
    }
}
/* /Components/Layout/ReconnectModal.razor.rz.scp.css */
.components-reconnect-first-attempt-visible[b-gzwkxlm1ph],
.components-reconnect-repeated-attempt-visible[b-gzwkxlm1ph],
.components-reconnect-failed-visible[b-gzwkxlm1ph],
.components-pause-visible[b-gzwkxlm1ph],
.components-resume-failed-visible[b-gzwkxlm1ph],
.components-rejoining-animation[b-gzwkxlm1ph] {
    display: none;
}

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


#components-reconnect-modal[b-gzwkxlm1ph] {
    background-color: var(--bs-body-bg);
    color: var(--bs-body-color);
    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-gzwkxlm1ph 0.5s both;
    &[open]

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

}

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

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

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

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

    100% {
        opacity: 1;
    }
}

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

    100% {
        opacity: 0;
    }
}

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

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

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

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

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

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