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

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

.sidebar[b-csh4mf6hoj] {
    background-image: linear-gradient(180deg, rgb(5, 39, 103) 0%, #3a0647 70%);
    /* Forces its own GPU compositing layer. Without this, the sticky-positioned sidebar's
       gradient layer can fail to invalidate cleanly when its content changes height right
       after the SignalR circuit connects (nav items appearing/reflowing) — Chromium leaves
       stale pixels from the previous paint behind, visible as overlapping/ghosted nav text. */
    transform: translateZ(0);
    will-change: transform;
}

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

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

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

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

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

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

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

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

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

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

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

.public-shell[b-csh4mf6hoj] {
    min-height: 100vh;
    display: flex;
    flex-direction: column;
}

.public-header[b-csh4mf6hoj] {
    height: 3.5rem;
    display: flex;
    align-items: center;
    justify-content: space-between;
    background-color: rgb(5, 39, 103);
    border-bottom: 1px solid rgba(255, 255, 255, 0.12);
    box-shadow: 0 2px 6px rgba(0, 0, 0, 0.2);
    position: relative;
    z-index: 1;
}

    .public-header[b-csh4mf6hoj]  .public-brand {
        display: flex;
        flex-direction: column;
        line-height: 1.2;
        text-decoration: none;
        color: white;
    }

        .public-header[b-csh4mf6hoj]  .public-brand .brand-title {
            font-weight: 600;
            font-size: 1.05rem;
        }

        .public-header[b-csh4mf6hoj]  .public-brand .brand-subtitle {
            font-size: 0.65rem;
            color: rgba(255, 255, 255, 0.65);
        }

.public-content[b-csh4mf6hoj] {
    flex: 1;
}

#blazor-error-ui[b-csh4mf6hoj] {
    background: lightyellow;
    bottom: 0;
    box-shadow: 0 -1px 2px rgba(0, 0, 0, 0.2);
    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-csh4mf6hoj] {
        cursor: pointer;
        position: absolute;
        right: 0.75rem;
        top: 0.5rem;
    }
/* _content/CSI.eWorkPlan.Web/Components/Layout/NavMenu.razor.rz.scp.css */
.navbar-toggler[b-dv8hmqcgyq] {
    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-dv8hmqcgyq] {
    background-color: rgba(255, 255, 255, 0.5);
}

.top-row[b-dv8hmqcgyq] {
    min-height: 3.5rem;
    height: auto;
    padding-top: 0.5rem;
    padding-bottom: 0.5rem;
    background-color: rgba(0,0,0,0.4);
}

.navbar-brand[b-dv8hmqcgyq] {
    font-size: 1.1rem;
    display: flex;
    flex-direction: column;
    line-height: 1.25;
}

.brand-title[b-dv8hmqcgyq] {
    font-weight: 600;
}

.brand-subtitle[b-dv8hmqcgyq] {
    font-size: 0.65rem;
    font-weight: 400;
    color: rgba(255, 255, 255, 0.6);
    letter-spacing: 0.02em;
}

.nav-section-title[b-dv8hmqcgyq] {
    font-size: 0.7rem;
    font-weight: 700;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    color: rgba(255, 255, 255, 0.65);
    padding: 0.9rem 1.5rem 0.35rem;
    margin: 0;
}

.nav-item[b-dv8hmqcgyq] {
    font-size: 0.85rem;
    padding-bottom: 0.15rem;
}

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

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

    .nav-item[b-dv8hmqcgyq]  .nav-link {
        color: #d7d7d7;
        background: none;
        border: none;
        border-radius: 4px;
        height: 2.25rem;
        display: flex;
        align-items: center;
        line-height: 2.25rem;
        width: 100%;
        /* The actual cause of the "overlapping nav text" bug: longer labels (e.g. "Organization
           Dashboard") don't fit this sidebar's width at this font size, so the text wrapped to a
           second line — but this row's height is fixed, so that second line spilled downward and
           visually overlapped the next nav item instead of the row growing to fit it. Truncating
           with an ellipsis instead of wrapping guarantees every row stays exactly one line tall. */
        white-space: nowrap;
        overflow: hidden;
        text-overflow: ellipsis;
    }

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

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

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

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

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

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

        /* Own compositing layer — see .sidebar in MainLayout.razor.css for why. */
        transform: translateZ(0);

        /* Allow sidebar to scroll for tall menus */
        height: calc(100vh - 4.5rem);
        overflow-y: auto;
    }
}