@import 'omc.remch.web.app.client.gq3j10bhna.bundle.scp.css';

/* _content/omc.remch.web.app/Layouts/AdminPanelLayout.razor.rz.scp.css */
.page[b-45zjul0ggf] {
    position: relative;
    display: flex;
    /* Fills MainLayout's frame exactly; the column inside decides what scrolls. */
    height: 100%;
    min-height: 0;
    overflow: hidden;
}

main[b-45zjul0ggf] {
    flex: 1;
}

.sidebar[b-45zjul0ggf] {
    /*background-image: linear-gradient(180deg, rgb(5, 39, 103) 0%, #3a0647 70%);*/
    /* background-color: #282828;*/
    /*background-color: #30505c;*/
    width: 250px;
    height: 100vh;
    position: sticky;
    top: 0;
}

/* The one scroll container in the app. Bounded by the column's height, so the sidebar,
   the top bar and the footer bar all stay put while this scrolls. min-height:0 is required
   - a flex item's default min-height:auto refuses to shrink below its content and the
   overflow would escape back out to the window. */
.content-body[b-45zjul0ggf] {
    width: 100%;
    flex: 1 1 auto;
    min-height: 0;
    overflow-y: auto;
    overflow-x: auto;
}

.top-row[b-45zjul0ggf] {
    /*background-color: ghostwhite;*/
    border-bottom: 1px solid #d6d5d5;
    justify-content: flex-end;
    height: 3.5rem;
    display: flex;
    align-items: center;
    width: 300px;
}

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

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

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

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

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

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

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

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

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

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

/* The app's content column: top bar, scrolling page, footer bar stacked vertically, with the
   sidebar rail beside it free to run the full viewport height. min-width:0 stops a wide table
   or chart inside .content-body from forcing this column past the viewport and squeezing the
   sidebar. */
.app-shell[b-45zjul0ggf] {
    flex: 1 1 auto;
    min-width: 0;
    height: 100%;
    min-height: 0;
    display: flex;
    flex-direction: column;
}
/* _content/omc.remch.web.app/Layouts/Layout.razor.rz.scp.css */
/* Signed-out pages: the top bar is fixed chrome and .scroll-area is the scroll container,
   the same split the app layouts use. See MainLayout.razor.css for why the frame itself
   must not scroll. */
.page[b-xcwkei1yb7] {
    height: 100%;
    min-height: 0;
    display: flex;
    overflow: hidden;
}

main[b-xcwkei1yb7] {
    flex: 1 1 auto;
    min-width: 0;
    min-height: 0;
    display: flex;
    flex-direction: column;
    overflow: hidden;
}

.scroll-area[b-xcwkei1yb7] {
    flex: 1 1 auto;
    min-height: 0;
    overflow-y: auto;
    overflow-x: hidden;
    display: flex;
    flex-direction: column;
}

    /* Pushes the footer to the bottom of the viewport when the page is short, and lets it
       follow the content down when it is long. */
    .scroll-area .content-body[b-xcwkei1yb7] {
        flex: 1 0 auto;
    }

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

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

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

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

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

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

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

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

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

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

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

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

#blazor-error-ui[b-xcwkei1yb7] {
    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-xcwkei1yb7] {
        cursor: pointer;
        position: absolute;
        right: 0.75rem;
        top: 0.5rem;
    }
/* _content/omc.remch.web.app/Layouts/MainLayout.razor.rz.scp.css */
/* The app frame is exactly the viewport and never scrolls itself. Everything inside it is
   fixed chrome - sidebar, top bar, footer bar - except one region, .content-body inside the
   app layout's column, which is the only scroll container. Previously nothing here bounded
   the height, so the frame grew past the viewport (a 100vh sidebar plus a footer under it)
   and the window scrollbar dragged the sidebar and header up with the page. */
.page[b-dsuwmxo5r5] {
    position: absolute;
    /* left/right rather than shrink-to-fit: position:absolute with no width sizes to the
       content's preferred width, which on wide monitors left a dead gap on the right.
       bottom:0 is what pins the frame to the viewport height. */
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    display: flex;
    overflow: hidden;
}

main[b-dsuwmxo5r5] {
    flex: 1 1 auto;
    min-width: 0;
    display: flex;
    flex-direction: column;
    overflow: hidden;
}

/* Wraps @Body, i.e. the app layout's own .page. Must be able to shrink below its content's
   intrinsic height (min-height:0) or the flex item refuses to shrink and the overflow
   escapes to the window again. */
.content-body[b-dsuwmxo5r5] {
    flex: 1 1 auto;
    min-height: 0;
    display: flex;
    flex-direction: column;
}

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

/* MenuBar renders .top-row itself, and has no MenuBar.razor.css of its own, so its
   elements carry no Blazor CSS-isolation scope attribute at all. A bare `.top-row`
   selector here (scoped to MainLayout) can never match it - hence `::deep`, which
   drops scoping for the whole selector chain (see TenancyOrganization.razor.css for
   the same leading-::deep pattern already used elsewhere in this codebase). This is
   also why `position: sticky` below was silently inert - fixing the selector is what
   makes the header actually stick. */
[b-dsuwmxo5r5] .app-header {
    /* Was `currentColor`, which resolves to the inherited text color (black) with
       nothing else setting it - this rule never actually applied before the ::deep
       fix above, so the black background was latent, not a deliberate design choice.
       Every screenshot approved so far this session shows a white header (Surface
       #FFFFFF per the design doc), which is what this restores. */
    background-color: #ffffff;
    /* Was a fixed `height`, clamping the row to 56px. The Tenant/Organisation selector
       (TenancyOrganization.razor's label+input+helper-text stack) needs ~82.5px
       naturally; align-items:center then split the ~26.5px overflow evenly above and
       below, clipping ~13px off the top against the viewport edge since this is the
       first element on the page. min-height lets the row grow to fit instead. */
    min-height: 3.5rem;
    justify-content: flex-end;
    display: flex !important;
    position: sticky;
    top: 0;
    z-index: 100;
    align-items: center;
}

    [b-dsuwmxo5r5] .app-header a, [b-dsuwmxo5r5] .app-header .btn-link {
        white-space: nowrap;
        margin-left: 1.5rem;
        text-decoration: none;
    }

        [b-dsuwmxo5r5] .app-header a:hover, [b-dsuwmxo5r5] .app-header .btn-link:hover {
            text-decoration: underline;
        }

        [b-dsuwmxo5r5] .app-header a:first-child {
            overflow: hidden;
            text-overflow: ellipsis;
        }

@media (max-width: 640.98px) {
    [b-dsuwmxo5r5] .app-header {
        justify-content: space-between;
    }

        [b-dsuwmxo5r5] .app-header a, [b-dsuwmxo5r5] .app-header .btn-link {
            margin-left: 0;
        }
}

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

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

        [b-dsuwmxo5r5] .app-header.auth a:first-child {
            flex: 1;
            text-align: right;
            width: 0;
        }

    [b-dsuwmxo5r5] .app-header, article[b-dsuwmxo5r5] {
        padding-left: 2rem !important;
        padding-right: 1.5rem !important;
    }
}

#blazor-error-ui[b-dsuwmxo5r5] {
    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-dsuwmxo5r5] {
        cursor: pointer;
        position: absolute;
        right: 0.75rem;
        top: 0.5rem;
    }
/* _content/omc.remch.web.app/Layouts/RemchannelLayout.razor.rz.scp.css */
.page[b-xlysfn5as4] {
    position: relative;
    display: flex;
    /* Fills MainLayout's frame exactly; the column inside decides what scrolls. */
    height: 100%;
    min-height: 0;
    overflow: hidden;
}

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

.sidebar[b-xlysfn5as4] {
    /*background-image: linear-gradient(180deg, rgb(5, 39, 103) 0%, #3a0647 70%);*/
    /* background-color: #282828;*/
    /*background-color: #30505c;*/
    width: 250px;
    height: 100vh;
    position: sticky;
    top: 0;
}

/* The one scroll container in the app. Bounded by the column's height, so the sidebar,
   the top bar and the footer bar all stay put while this scrolls. min-height:0 is required
   - a flex item's default min-height:auto refuses to shrink below its content and the
   overflow would escape back out to the window. */
.content-body[b-xlysfn5as4] {
    width: 100%;
    flex: 1 1 auto;
    min-height: 0;
    overflow-y: auto;
    overflow-x: auto;

    /* The app's canvas. The Oct 2023 UI Elements Reference draws every surface - cards,
       tables, modals, insight rows - as white on a grey ground, and the CI guide names that
       grey "black 5" (#F1F2F2). Without it the ground was the body's white, so a white card
       on a white page only read where it happened to carry a border, and any borderless
       pattern from the reference (listitems.svg's striped rows in particular) had nothing to
       be a figure against.

       Set here rather than per screen so it is one declaration for the whole app. The top bar
       and the footer sit outside this element and stay white, which is the composition
       navigation.svg shows. */
    background: var(--rem-black-5, #f1f2f2);
}

.top-row[b-xlysfn5as4] {
    /*background-color: ghostwhite;*/
    border-bottom: 1px solid #d6d5d5;
    justify-content: flex-end;
    height: 3.5rem;
    display: flex;
    align-items: center;
    width: 300px;
}

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

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

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

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

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

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

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

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

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

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

/* The app's content column: top bar, scrolling page, footer bar stacked vertically, with the
   sidebar rail beside it free to run the full viewport height. min-width:0 stops a wide table
   or chart inside .content-body from forcing this column past the viewport and squeezing the
   sidebar. */
.app-shell[b-xlysfn5as4] {
    flex: 1 1 auto;
    min-width: 0;
    height: 100%;
    min-height: 0;
    display: flex;
    flex-direction: column;
}
/* _content/omc.remch.web.app/Layouts/RemconsultingLayout.razor.rz.scp.css */
.page[b-476du8myed] {
    position: relative;
    display: flex;
    /* Fills MainLayout's frame exactly; the column inside decides what scrolls. */
    height: 100%;
    min-height: 0;
    overflow: hidden;
}

main[b-476du8myed] {
    flex: 1;
}

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

/* The one scroll container in the app. Bounded by the column's height, so the sidebar,
   the top bar and the footer bar all stay put while this scrolls. min-height:0 is required
   - a flex item's default min-height:auto refuses to shrink below its content and the
   overflow would escape back out to the window. */
.content-body[b-476du8myed] {
    width: 100%;
    flex: 1 1 auto;
    min-height: 0;
    overflow-y: auto;
    overflow-x: auto;
}

.top-row[b-476du8myed] {
    border-bottom: 1px solid #d6d5d5;
    justify-content: flex-end;
    height: 3.5rem;
    display: flex;
    align-items: center;
    width: 300px;
}

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

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

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

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

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

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

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

    .top-row[b-476du8myed] {
        position: sticky;
        top: 0;
        z-index: 1;
        box-shadow: 0 2px 4px rgba(0, 0, 0, 0.06);
    }

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

    .top-row[b-476du8myed], article[b-476du8myed] {
        padding-right: 1.5rem !important;
    }
}

/* The app's content column: top bar, scrolling page, footer bar stacked vertically, with the
   sidebar rail beside it free to run the full viewport height. min-width:0 stops a wide table
   or chart inside .content-body from forcing this column past the viewport and squeezing the
   sidebar. */
.app-shell[b-476du8myed] {
    flex: 1 1 auto;
    min-width: 0;
    height: 100%;
    min-height: 0;
    display: flex;
    flex-direction: column;
}

/* REMconsulting content canvas - #f1f2f2 (rem-color-bg-canvas), matching the consultant
   dashboard background in the design system. */
.rc-page[b-476du8myed] {
    background: #f1f2f2;
}
/* _content/omc.remch.web.app/Layouts/RemeasureLayout.razor.rz.scp.css */
.page[b-upcptt6iok] {
    position: relative;
    display: flex;
    /* Fills MainLayout's frame exactly; the column inside decides what scrolls. */
    height: 100%;
    min-height: 0;
    overflow: hidden;
}

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

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

/* The one scroll container in the app. Bounded by the column's height, so the sidebar,
   the top bar and the footer bar all stay put while this scrolls. min-height:0 is required
   - a flex item's default min-height:auto refuses to shrink below its content and the
   overflow would escape back out to the window. */
.content-body[b-upcptt6iok] {
    width: 100%;
    flex: 1 1 auto;
    min-height: 0;
    overflow-y: auto;
    overflow-x: auto;
}

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

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

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

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

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

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

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

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

    .top-row[b-upcptt6iok] {
        position: sticky;
        top: 0;
        z-index: 1;
        box-shadow: 0 2px 4px rgba(0, 0, 0, 0.06);
    }

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

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

/* The app's content column: top bar, scrolling page, footer bar stacked vertically, with the
   sidebar rail beside it free to run the full viewport height. min-width:0 stops a wide table
   or chart inside .content-body from forcing this column past the viewport and squeezing the
   sidebar. */
.app-shell[b-upcptt6iok] {
    flex: 1 1 auto;
    min-width: 0;
    height: 100%;
    min-height: 0;
    display: flex;
    flex-direction: column;
}
/* _content/omc.remch.web.app/Layouts/RemprofileLayout.razor.rz.scp.css */
.page[b-wtutou23hi] {
    position: relative;
    display: flex;
    /* Fills MainLayout's frame exactly; the column inside decides what scrolls. */
    height: 100%;
    min-height: 0;
    overflow: hidden;
}

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

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

/* The one scroll container in the app. Bounded by the column's height, so the sidebar,
   the top bar and the footer bar all stay put while this scrolls. min-height:0 is required
   - a flex item's default min-height:auto refuses to shrink below its content and the
   overflow would escape back out to the window. */
.content-body[b-wtutou23hi] {
    width: 100%;
    flex: 1 1 auto;
    min-height: 0;
    overflow-y: auto;
    overflow-x: auto;
}

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

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

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

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

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

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

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

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

    .top-row[b-wtutou23hi] {
        position: sticky;
        top: 0;
        z-index: 1;
        box-shadow: 0 2px 4px rgba(0, 0, 0, 0.06);
    }

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

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

/* The app's content column: top bar, scrolling page, footer bar stacked vertically, with the
   sidebar rail beside it free to run the full viewport height. min-width:0 stops a wide table
   or chart inside .content-body from forcing this column past the viewport and squeezing the
   sidebar. */
.app-shell[b-wtutou23hi] {
    flex: 1 1 auto;
    min-width: 0;
    height: 100%;
    min-height: 0;
    display: flex;
    flex-direction: column;
}