@import '_content/Shared_SimoHR_Components/Shared_SimoHR_Components.4jrrctzpb0.bundle.scp.css';

/* /Components/Layout/LanguageSwitcher.razor.rz.scp.css */
.lang-menu[b-xzdlo6bjss] {
    position: relative;
}

.lang-menu-trigger[b-xzdlo6bjss] {
    display: flex;
    align-items: center;
    gap: 6px;
    background: none;
    border: none;
    cursor: pointer;
    padding: 4px 8px;
    border-radius: 6px;
    color: inherit;
}

    .lang-menu-trigger:hover[b-xzdlo6bjss] {
        background: rgba(128,128,128,0.12);
    }

    .lang-menu-trigger .lang-flag[b-xzdlo6bjss] {
        opacity: 0.8;
    }

.lang-flag[b-xzdlo6bjss] {
    width: 30px;
    height: 30px;
    border-radius: 3px;
    object-fit: cover;
    display: block;
}

.lang-chevron[b-xzdlo6bjss] {
    font-size: 0.75rem;
    transition: transform 0.2s;
}

    .lang-chevron.rotated[b-xzdlo6bjss] {
        transform: rotate(180deg);
    }

.lang-menu-backdrop[b-xzdlo6bjss] {
    position: fixed;
    inset: 0;
    z-index: 999;
}

.lang-menu-dropdown[b-xzdlo6bjss] {
    position: absolute;
    right: 0;
    top: calc(100% + 4px);
    min-width: 160px;
    background: var(--menu-bg);
    border: 1px solid var(--menu-border);
    border-radius: 6px;
    box-shadow: 0 4px 12px rgba(0,0,0,0.12);
    z-index: 1000;
}

.lang-menu-item[b-xzdlo6bjss] {
    display: flex;
    align-items: center;
    gap: 8px;
    width: 100%;
    padding: 6px 10px;
    color: var(--text-color);
    font-size: 0.875rem;
    border-radius: 6px;
    background: none;
    border: none;
    text-align: left;
    cursor: pointer;
    white-space: nowrap;
}

    .lang-menu-item:hover[b-xzdlo6bjss] {
        background: rgba(128,128,128,0.12);
    }

    .lang-menu-item.active[b-xzdlo6bjss] {
        background: rgba(128,128,128,0.08);
        font-weight: 600;
    }

.lang-name[b-xzdlo6bjss] {
    flex: 1;
}

.lang-check[b-xzdlo6bjss] {
    margin-left: auto;
    font-size: 1rem;
}
/* /Components/Layout/LoginLayout.razor.rz.scp.css */
.login-page[b-k8gxn5d4mp] {
    min-height: 100dvh;
    display: flex;
    /*Column so the tools row lands under the card instead of beside it*/
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 24px;
    color: var(--text-color);
    /*The card is white and so is --bg-main, so the page needs its own background*/
    background: radial-gradient(120% 120% at 50% 0%, #eef2f7 0%, #dde5ee 100%);
}

.dark-theme .login-page[b-k8gxn5d4mp] {
    background: radial-gradient(120% 120% at 50% 0%, #26282d 0%, #17181b 100%);
}

.dark-theme .login-card[b-k8gxn5d4mp] {
    border-color: rgba(255, 255, 255, .09);
    box-shadow: 0 12px 40px rgba(0, 0, 0, .5);
}

.login-card[b-k8gxn5d4mp] {
    width: 100%;
    max-width: 430px;
    border-radius: 12px;
    overflow: hidden;
    background: var(--modal-bg);
    border: 1px solid var(--rz-border-color, rgba(0, 0, 0, .12));
    box-shadow: 0 10px 34px rgba(0, 0, 0, .16), 0 2px 6px rgba(0, 0, 0, .06);
}

/*The logo is white artwork - visible only on the same navy plate as in the sidebar*/
.login-brand[b-k8gxn5d4mp] {
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 12px 24px;
    background: var(--sidebar-logo-bg);
}

.login-brand img[b-k8gxn5d4mp] {
    height: 46px;
    object-fit: contain;
}

.login-body[b-k8gxn5d4mp] {
    padding: 28px 28px 32px;
}

/*Page settings, not part of signing in - placed under the card, aligned to its edges*/
.login-tools[b-k8gxn5d4mp] {
    width: 100%;
    max-width: 430px;
    margin-top: 14px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
}

.login-langs[b-k8gxn5d4mp] {
    display: flex;
    align-items: center;
    gap: 4px;
}

.login-lang[b-k8gxn5d4mp] {
    display: flex;
    padding: 4px;
    border-radius: 6px;
    line-height: 0;
    opacity: .5;
    transition: opacity .15s, background-color .15s;
}

.login-lang img[b-k8gxn5d4mp] {
    width: 21px;
    height: auto;
    border-radius: 2px;
}

.login-lang:hover[b-k8gxn5d4mp] {
    opacity: 1;
    background: rgba(0, 0, 0, .06);
}

.login-lang.active[b-k8gxn5d4mp] {
    opacity: 1;
    background: rgba(0, 0, 0, .09);
}

.login-theme[b-k8gxn5d4mp] {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 30px;
    height: 30px;
    padding: 0;
    border: 0;
    border-radius: 6px;
    background: transparent;
    color: var(--text-color);
    opacity: .55;
    font-size: 17px;
    cursor: pointer;
    transition: opacity .15s, background-color .15s;
}

.login-theme:hover[b-k8gxn5d4mp] {
    opacity: 1;
    background: rgba(0, 0, 0, .06);
}

/*The theme lives on the html element, so the button shows its state without any server knowledge*/
.login-theme .bi-sun[b-k8gxn5d4mp] {
    display: none;
}

.dark-theme .login-theme .bi-moon[b-k8gxn5d4mp] {
    display: none;
}

.dark-theme .login-theme .bi-sun[b-k8gxn5d4mp] {
    display: inline-block;
}

.dark-theme .login-lang:hover[b-k8gxn5d4mp],
.dark-theme .login-theme:hover[b-k8gxn5d4mp] {
    background: rgba(255, 255, 255, .10);
}

.dark-theme .login-lang.active[b-k8gxn5d4mp] {
    background: rgba(255, 255, 255, .14);
}

/*Phone - the card keeps its rounded floating look, the gap to the edges only gets smaller so the
  form has room and the shadow still has somewhere to fall*/
@media (max-width: 480px) {
    .login-page[b-k8gxn5d4mp] {
        padding: 16px;
    }

    .login-body[b-k8gxn5d4mp] {
        padding: 24px 20px 28px;
    }
}
/* /Components/Layout/MainLayout.razor.rz.scp.css */
.page[b-6h74fyly6c] {
    position: relative;
    display: flex;
    flex-direction: column;
    height: 100%;
}

main[b-6h74fyly6c] {
    flex: 1;
    min-width: 0;
    display: flex;
    flex-direction: column;
    overflow: hidden;
}

article.content[b-6h74fyly6c] {
    flex: 1;
    overflow-y: auto;
}

.sidebar[b-6h74fyly6c] {
    background-image: linear-gradient(180deg, var(--sidebar-gradient-start) 0%, var(--sidebar-gradient-end) 100%);
}

.top-row[b-6h74fyly6c] {
    background-color: var(--toprow-bg);
    border-bottom: 1px solid var(--toprow-border);
    justify-content: space-between;
    height: 3.5rem;
    display: flex;
    align-items: center;
    transition: background-color 0.7s ease, border-color 0.7s ease;
}

.breadcrumb-nav[b-6h74fyly6c] {
    display: flex;
    align-items: center;
    gap: 6px;
    font-size: 1rem;
    min-width: 0;
    overflow: hidden;
}

.bc-item[b-6h74fyly6c], .bc-parent[b-6h74fyly6c] {
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.bc-parent[b-6h74fyly6c] {
    color: var(--bc-parent-color);
    transition: color 0.7s ease;
}

.bc-sep[b-6h74fyly6c] {
    color: var(--bc-sep-color);
    font-size: 1.2rem;
    transition: color 0.7s ease;
}

.bc-item[b-6h74fyly6c] {
    color: var(--bc-item-color);
    text-decoration: none;
    transition: color 0.7s ease;
}

.bc-item:hover[b-6h74fyly6c] {
    text-decoration: underline;
}

    .top-row[b-6h74fyly6c]  a, .top-row[b-6h74fyly6c]  .btn-link {
        white-space: nowrap;
        text-decoration: none;
    }

    .top-row[b-6h74fyly6c]  a:hover, .top-row[b-6h74fyly6c]  .btn-link:hover {
        text-decoration: underline;
    }

    .top-row[b-6h74fyly6c]  a:first-child {
        overflow: hidden;
        text-overflow: ellipsis;
    }

/*Phone and tablet - the sidebar is collapsed behind the toggle, so the content gets the full width*/
@media (max-width: 1023.98px) {
    .top-row[b-6h74fyly6c]  a, .top-row[b-6h74fyly6c]  .btn-link {
        margin-left: 0;
    }
}

/*Phone only - the header gives up the parent crumb and the impersonation name to fit, and the
  content drops the Bootstrap px-4 gutter that eats a seventh of the screen*/
@media (max-width: 639.98px) {
    .top-row[b-6h74fyly6c], article[b-6h74fyly6c] {
        padding-left: 0.6rem !important;
        padding-right: 0.6rem !important;
    }

    .breadcrumb-nav[b-6h74fyly6c] {
        font-size: 0.8rem;
        gap: 4px;
    }

    .bc-sep[b-6h74fyly6c] {
        font-size: 0.9rem;
    }

    .bc-parent[b-6h74fyly6c], .bc-parent + .bc-sep[b-6h74fyly6c] {
        display: none;
    }
}

@media (min-width: 1024px) {
    .page[b-6h74fyly6c] {
        flex-direction: row;
    }

    main[b-6h74fyly6c] {
        height: 100dvh;
    }

    .sidebar[b-6h74fyly6c] {
        width: 250px;
        height: 100dvh;
        position: sticky;
        top: 0;
    }

    .top-row[b-6h74fyly6c] {
        position: sticky;
        top: 0;
        /*Above scrolling content incl. Radzen DataGrid sticky headers, so the user-menu dropdown is never covered*/
        z-index: 100;
    }

    .top-row.auth[b-6h74fyly6c]  a:first-child {
        flex: 1;
        text-align: right;
        width: 0;
    }

    .top-row[b-6h74fyly6c], article[b-6h74fyly6c] {
        padding-left: 2rem !important;
        padding-right: 1.5rem !important;
    }
}

#blazor-error-ui[b-6h74fyly6c] {
    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-6h74fyly6c] {
        cursor: pointer;
        position: absolute;
        right: 0.75rem;
        top: 0.5rem;
    }
/* /Components/Layout/NavMenu.razor.rz.scp.css */
.navbar-toggler[b-t5tw7o3v4z] {
    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-t5tw7o3v4z] {
    background-color: rgba(255, 255, 255, 0.5);
}

.top-row[b-t5tw7o3v4z] {
    height: 3.5rem;
    background-color: var(--sidebar-logo-bg);
    padding: 0 !important;
    border-bottom: solid 1px var(--sidebar-logo-border);
}

.navbar-brand[b-t5tw7o3v4z] {
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 0;
    margin: 0;
    width: 100%;
    height: 100%;
}

.navbar-brand img[b-t5tw7o3v4z] {
    width: auto;
    height: 50px;
    object-fit: contain;
    object-position: center;
}

.bi[b-t5tw7o3v4z] {
    margin-right: 0.5rem;
    font-size: 0.85rem;
}

.nav-module[b-t5tw7o3v4z] {
    border-left: 3px solid var(--module-accent, #7fb2ee);
    margin: 0 0.75rem;
    padding-left: 0.35rem;
}

    .nav-module:first-of-type[b-t5tw7o3v4z] {
        margin-top: 1rem;
    }

    .nav-module + .nav-module[b-t5tw7o3v4z] {
        margin-top: 1.25rem;
    }

.nav-module-label[b-t5tw7o3v4z] {
    display: flex;
    align-items: center;
    gap: 0.45rem;
    font-size: 0.84rem;
    font-weight: 600;
    letter-spacing: 0.01em;
    color: #eaf2fc;
    padding: 0.15rem 0.5rem 0.4rem;
}

    .nav-module-label i[b-t5tw7o3v4z] {
        margin-right: 0;
        font-size: 1.2rem;
        color: var(--module-accent, #7fb2ee);
    }

.nav-item[b-t5tw7o3v4z] {
    font-size: 0.9rem;
    padding-bottom: 0.2rem;
}

    .nav-item[b-t5tw7o3v4z]  .nav-link {
        color: #d7d7d7;
        background: none;
        border: none;
        border-radius: 4px;
        min-height: 2rem;
        display: flex;
        align-items: center;
        gap: 0.5rem;
        line-height: 1.3;
        padding: 0.3rem 0.6rem;
        width: 100%;
        font-size: 0.85rem;
    }

        /*Keep the icon from shrinking - drop the global .bi right margin so long labels stay on one line*/
        .nav-item[b-t5tw7o3v4z]  .nav-link > i {
            flex-shrink: 0;
            margin-right: 0;
        }

.nav-item[b-t5tw7o3v4z]  a.active {
    background-color: rgba(255,255,255,0.37);
    color: white;
}

.nav-item[b-t5tw7o3v4z]  .nav-link:hover {
    background-color: rgba(255,255,255,0.1);
    color: white;
}

.nav-scrollable[b-t5tw7o3v4z] {
    display: none;
}

.navbar-toggler:checked ~ .nav-scrollable[b-t5tw7o3v4z] {
    display: block;
}

/*Touch targets on phone and tablet, where the nav is tapped and not clicked*/
@media (max-width: 1023.98px) {
    .navbar-toggler[b-t5tw7o3v4z] {
        top: 0.375rem;
        height: 2.75rem;
    }

    .nav-item[b-t5tw7o3v4z]  .nav-link {
        min-height: 2.75rem;
        font-size: 0.95rem;
    }

    .nav-item[b-t5tw7o3v4z] {
        font-size: 1rem;
        padding-bottom: 0.35rem;
    }

    .nav-module-label[b-t5tw7o3v4z] {
        font-size: 0.95rem;
    }
}

@media (min-width: 1024px) {
    .navbar-toggler[b-t5tw7o3v4z] {
        display: none;
    }

    .nav-scrollable[b-t5tw7o3v4z] {
        display: block;
        height: calc(100dvh - 3.5rem);
        overflow-y: auto;
    }
}
/* /Components/Layout/ReconnectModal.razor.rz.scp.css */
.components-reconnect-first-attempt-visible[b-cj2dzw9emb],
.components-reconnect-repeated-attempt-visible[b-cj2dzw9emb],
.components-reconnect-failed-visible[b-cj2dzw9emb],
.components-pause-visible[b-cj2dzw9emb],
.components-resume-failed-visible[b-cj2dzw9emb],
.components-rejoining-animation[b-cj2dzw9emb] {
    display: none;
}

#components-reconnect-modal.components-reconnect-show .components-reconnect-first-attempt-visible[b-cj2dzw9emb],
#components-reconnect-modal.components-reconnect-show .components-rejoining-animation[b-cj2dzw9emb],
#components-reconnect-modal.components-reconnect-paused .components-pause-visible[b-cj2dzw9emb],
#components-reconnect-modal.components-reconnect-resume-failed .components-resume-failed-visible[b-cj2dzw9emb],
#components-reconnect-modal.components-reconnect-retrying[b-cj2dzw9emb],
#components-reconnect-modal.components-reconnect-retrying .components-reconnect-repeated-attempt-visible[b-cj2dzw9emb],
#components-reconnect-modal.components-reconnect-retrying .components-rejoining-animation[b-cj2dzw9emb],
#components-reconnect-modal.components-reconnect-failed[b-cj2dzw9emb],
#components-reconnect-modal.components-reconnect-failed .components-reconnect-failed-visible[b-cj2dzw9emb] {
    display: block;
}


#components-reconnect-modal[b-cj2dzw9emb] {
    background-color: var(--modal-bg);
    width: 20rem;
    margin: 20vh auto;
    padding: 2rem;
    border: 0;
    border-radius: 0.5rem;
    box-shadow: 0 3px 6px 2px var(--modal-shadow);
    opacity: 0;
    transition: display 0.5s allow-discrete, overlay 0.5s allow-discrete;
    animation: components-reconnect-modal-fadeOutOpacity-b-cj2dzw9emb 0.5s both;
    &[open]

{
    animation: components-reconnect-modal-slideUp-b-cj2dzw9emb 1.5s cubic-bezier(.05, .89, .25, 1.02) 0.3s, components-reconnect-modal-fadeInOpacity-b-cj2dzw9emb 0.5s ease-in-out 0.3s;
    animation-fill-mode: both;
}

}

#components-reconnect-modal[b-cj2dzw9emb]::backdrop {
    background-color: var(--modal-backdrop);
    animation: components-reconnect-modal-fadeInOpacity-b-cj2dzw9emb 0.5s ease-in-out;
    opacity: 1;
}

@keyframes components-reconnect-modal-slideUp-b-cj2dzw9emb {
    0% {
        transform: translateY(30px) scale(0.95);
    }

    100% {
        transform: translateY(0);
    }
}

@keyframes components-reconnect-modal-fadeInOpacity-b-cj2dzw9emb {
    0% {
        opacity: 0;
    }

    100% {
        opacity: 1;
    }
}

@keyframes components-reconnect-modal-fadeOutOpacity-b-cj2dzw9emb {
    0% {
        opacity: 1;
    }

    100% {
        opacity: 0;
    }
}

.components-reconnect-container[b-cj2dzw9emb] {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 1rem;
}

#components-reconnect-modal p[b-cj2dzw9emb] {
    margin: 0;
    text-align: center;
}

#components-reconnect-modal button[b-cj2dzw9emb] {
    border: 0;
    background-color: var(--reconnect-btn-bg);
    color: white;
    padding: 4px 24px;
    border-radius: 4px;
    transition: background-color 0.7s ease;
}

    #components-reconnect-modal button:hover[b-cj2dzw9emb] {
        background-color: var(--reconnect-btn-hover);
    }

    #components-reconnect-modal button:active[b-cj2dzw9emb] {
        background-color: var(--reconnect-btn-bg);
    }

.components-rejoining-animation[b-cj2dzw9emb] {
    position: relative;
    width: 80px;
    height: 80px;
}

    .components-rejoining-animation div[b-cj2dzw9emb] {
        position: absolute;
        border: 3px solid var(--reconnect-spinner);
        opacity: 1;
        border-radius: 50%;
        animation: components-rejoining-animation-b-cj2dzw9emb 1.5s cubic-bezier(0, 0.2, 0.8, 1) infinite;
    }

        .components-rejoining-animation div:nth-child(2)[b-cj2dzw9emb] {
            animation-delay: -0.5s;
        }

@keyframes components-rejoining-animation-b-cj2dzw9emb {
    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/Layout/UserMenu.razor.rz.scp.css */
.user-menu[b-zhcahc1hkn] {
    position: relative;
}

.user-menu-trigger[b-zhcahc1hkn] {
    display: flex;
    align-items: center;
    gap: 8px;
    background: none;
    border: none;
    cursor: pointer;
    padding: 4px 8px;
    border-radius: 6px;
    color: inherit;
}

    .user-menu-trigger:hover[b-zhcahc1hkn] {
        background: rgba(128,128,128,0.12);
    }

.user-avatar[b-zhcahc1hkn] {
    width: 32px;
    height: 32px;
    border-radius: 50%;
    object-fit: cover;
}

.user-avatar-placeholder[b-zhcahc1hkn] {
    font-size: 32px;
    line-height: 1;
}

.user-name[b-zhcahc1hkn] {
    font-size: 0.875rem;
    font-weight: 500;
    white-space: nowrap;
}

.user-chevron[b-zhcahc1hkn] {
    font-size: 0.75rem;
    transition: transform 0.2s;
}

    .user-chevron.rotated[b-zhcahc1hkn] {
        transform: rotate(180deg);
    }

.user-menu-backdrop[b-zhcahc1hkn] {
    position: fixed;
    inset: 0;
    z-index: 999;
}

.user-menu-dropdown[b-zhcahc1hkn] {
    position: absolute;
    right: 0;
    top: calc(100% + 4px);
    min-width: 180px;
    background: var(--menu-bg);
    border: 1px solid var(--menu-border);
    border-radius: 6px;
    box-shadow: 0 4px 12px rgba(0,0,0,0.12);
    z-index: 1000;
}

.user-menu-divider[b-zhcahc1hkn] {
    height: 1px;
    background: var(--menu-border);
    margin: 4px 8px;
}

.user-menu-item[b-zhcahc1hkn] {
    display: flex;
    align-items: center;
    width: 100%;
    padding: 10px 16px;
    text-decoration: none;
    color: var(--text-color);
    font-size: 0.875rem;
    border-radius: 6px;
    background: none;
    border: none;
    text-align: left;
    cursor: pointer;
    white-space: nowrap;
}

    .user-menu-item:hover[b-zhcahc1hkn] {
        background: rgba(128,128,128,0.12);
    }

    .user-menu-item.active[b-zhcahc1hkn] {
        font-weight: 600;
    }
/* /Components/Modules/Reviews/Admin_Audit.razor.rz.scp.css */
.stack[b-pgk6mcttia] {
    display: flex;
    flex-direction: column;
    gap: 16px;
    height: 98%;
    min-height: 0;
}

.page-head[b-pgk6mcttia] {
    display: flex;
    align-items: flex-start;
    gap: 16px;
    flex-wrap: wrap;
}

.page-head .grow[b-pgk6mcttia] { flex: 1; min-width: 260px; }

.page-head h1[b-pgk6mcttia] {
    margin: 0;
    font-size: 22px;
    font-weight: 650;
}

.card-shell[b-pgk6mcttia] {
    display: flex;
    flex-direction: column;
    flex: 1;
    min-height: 0;
    border: 1px solid var(--rz-border-color, #e0e0e0);
    border-radius: 14px;
    background: var(--bg-main);
    overflow: hidden;
}

.card-head[b-pgk6mcttia] {
    display: flex;
    align-items: center;
    gap: 10px;
    flex-wrap: wrap;
    padding: 12px 16px;
    border-bottom: 1px solid var(--rz-border-color, #e0e0e0);
    /*Scoped Radzen overrides - the clear (X) and chevron read the leaf var directly*/
    --rz-input-height: 2.2rem;
    --rz-dropdown-trigger-icon-height: 1.3rem;
}

/*Only the closed trigger is reachable via ::deep - the popup is teleported to <body> and tuned through PopupStyle*/
.card-head[b-pgk6mcttia]  .rz-textbox,
.card-head[b-pgk6mcttia]  .rz-dropdown {
    border-radius: 99px;
    font-size: 13px;
}

.card-head[b-pgk6mcttia]  .rz-textbox { padding: 0 14px; }
.card-head[b-pgk6mcttia]  .rz-dropdown { padding-right: 6px; }

.card-head[b-pgk6mcttia]  .rz-dropdown .rz-dropdown-label,
.card-head[b-pgk6mcttia]  .rz-dropdown .rz-placeholder {
    font-size: 13px;
}

.card-head[b-pgk6mcttia]  .rz-dropdown-trigger .rzi-chevron-down::before {
    color: var(--rz-text-secondary-color, #6c6c6c);
}

/*Drop the focus ring - it lingers lit after a selection until you click away*/
.card-head[b-pgk6mcttia]  .rz-dropdown:focus,
.card-head[b-pgk6mcttia]  .rz-dropdown.rz-state-focused {
    box-shadow: none !important;
    outline: none !important;
    border: var(--rz-input-border) !important;
}

.mono[b-pgk6mcttia] {
    font-size: 12px;
    color: var(--accent-gray);
}

.emp-name[b-pgk6mcttia] { font-weight: 600; font-size: 13px; }

.sentence[b-pgk6mcttia] { font-size: 13px; }
/* /Components/Modules/Reviews/Admin_Campaigns.razor.rz.scp.css */
.stack[b-9zvt75hx9v] {
    display: flex;
    flex-direction: column;
    gap: 16px;
    height: 98%;
    min-height: 0;
}

/*Head stays put - everything below scrolls as one block*/
.body-scroll[b-9zvt75hx9v] {
    flex: 1;
    min-height: 0;
    overflow-y: auto;
    display: flex;
    flex-direction: column;
    gap: 16px;
    padding-bottom: 24px;
}

/*Cards keep their natural height - only the wrapper scrolls*/
.body-scroll > *[b-9zvt75hx9v] { flex-shrink: 0; }

.page-head[b-9zvt75hx9v] {
    display: flex;
    align-items: flex-start;
    gap: 16px;
    flex-wrap: wrap;
}

.page-head .grow[b-9zvt75hx9v] { flex: 1; min-width: 260px; }

.page-head h1[b-9zvt75hx9v] {
    margin: 0;
    font-size: 22px;
    font-weight: 650;
}

.sub[b-9zvt75hx9v] {
    margin: 4px 0 0;
    font-size: 13px;
    color: var(--accent-gray);
    max-width: 80ch;
}

.card-shell[b-9zvt75hx9v] {
    border: 1px solid var(--rz-border-color, #e0e0e0);
    border-radius: 14px;
    background: var(--bg-main);
    overflow: hidden;
}

.card-head[b-9zvt75hx9v] {
    display: flex;
    align-items: center;
    gap: 10px;
    flex-wrap: wrap;
    padding: 12px 16px;
    border-bottom: 1px solid var(--rz-border-color, #e0e0e0);
}

.card-title[b-9zvt75hx9v] {
    font-weight: 600;
    font-size: 15px;
    flex: 1;
    min-width: 160px;
}

.card-pad[b-9zvt75hx9v] {
    padding: 16px;
    display: flex;
    flex-direction: column;
    gap: 16px;
}

.muted[b-9zvt75hx9v] { color: var(--accent-gray); }

.metrics[b-9zvt75hx9v] {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(160px, 1fr));
    gap: 16px;
}

.metric .k[b-9zvt75hx9v] {
    font-size: 10.5px;
    font-weight: 700;
    letter-spacing: .07em;
    text-transform: uppercase;
    color: var(--accent-gray);
}

.metric .v[b-9zvt75hx9v] {
    font-size: 26px;
    font-weight: 700;
    line-height: 1.15;
    font-variant-numeric: tabular-nums;
}

.metric .v.ok[b-9zvt75hx9v] { color: var(--accent-green); }
.metric .v.bad[b-9zvt75hx9v] { color: var(--accent-red); }

.mono[b-9zvt75hx9v] {
    font-size: 12px;
    color: var(--accent-gray);
}

/*Reasons on the left, the person checker on the right*/
.fig-split[b-9zvt75hx9v] {
    display: grid;
    grid-template-columns: 1.2fr 1fr;
    gap: 20px;
    align-items: start;
}

@media (max-width: 1100px) {
    .fig-split[b-9zvt75hx9v] { grid-template-columns: 1fr; }
}

.fig-panel[b-9zvt75hx9v] {
    display: flex;
    flex-direction: column;
    gap: 4px;
    min-width: 0;
}

.panel-title[b-9zvt75hx9v] {
    font-size: 10.5px;
    font-weight: 700;
    letter-spacing: .07em;
    text-transform: uppercase;
    color: var(--accent-gray);
    margin-bottom: 4px;
}

/*Chip, name, count - the countries breakdown fills whatever is left*/
.reason-row[b-9zvt75hx9v] {
    display: grid;
    grid-template-columns: auto 220px 48px 1fr;
    gap: 10px;
    align-items: center;
    padding: 5px 0;
    border-bottom: 1px solid var(--rz-border-color, #e0e0e0);
    font-size: 13px;
}

.reason-row:last-child[b-9zvt75hx9v] { border-bottom: 0; }

/*Clickable reason - picks the people listed in the checker on the right*/
button.reason-row[b-9zvt75hx9v] {
    width: 100%;
    margin: 0;
    padding-inline: 6px;
    background: none;
    border: 0;
    border-bottom: 1px solid var(--rz-border-color, #e0e0e0);
    border-radius: 6px;
    font: inherit;
    font-size: 13px;
    color: inherit;
    text-align: start;
    cursor: pointer;
}

button.reason-row:hover[b-9zvt75hx9v] { background: var(--surface-readonly); }

button.reason-row.on[b-9zvt75hx9v] { background: color-mix(in srgb, var(--accent-blue) 12%, transparent); }

button.reason-row:focus-visible[b-9zvt75hx9v] {
    outline: 2px solid var(--accent-blue);
    outline-offset: -2px;
}

.reason-head[b-9zvt75hx9v] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 8px;
    margin-top: 6px;
    font-size: 12px;
    font-weight: 700;
}

.reason-clear[b-9zvt75hx9v] {
    padding: 2px 6px;
    background: none;
    border: 0;
    border-radius: 6px;
    color: var(--accent-gray);
    cursor: pointer;
}

.reason-clear:hover[b-9zvt75hx9v] { background: var(--surface-readonly); }

.reason-name[b-9zvt75hx9v] {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.reason-count[b-9zvt75hx9v] {
    font-weight: 700;
    text-align: right;
    font-variant-numeric: tabular-nums;
}

.reason-countries[b-9zvt75hx9v] {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.check-input[b-9zvt75hx9v] {
    width: 100%;
    height: 34px;
    padding: 0 14px;
    font-size: 13px;
    border: var(--rz-input-border);
    border-radius: 99px;
    background: var(--bg-main);
    color: var(--text-color);
    outline: none;
}

.check-input:focus[b-9zvt75hx9v] { border-color: var(--rz-primary, #0f3d2e); }

.check-results[b-9zvt75hx9v] {
    max-height: 300px;
    overflow-y: auto;
    display: flex;
    flex-direction: column;
    padding-right: 10px;
}

.check-row[b-9zvt75hx9v] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
    padding: 5px 2px;
    border-bottom: 1px solid var(--rz-border-color, #e0e0e0);
}

.check-row:last-child[b-9zvt75hx9v] { border-bottom: 0; }

.check-row .who[b-9zvt75hx9v] { min-width: 0; }
.check-row .emp-name[b-9zvt75hx9v] { display: block; font-size: 13px; font-weight: 600; }

.check-row .emp-sub[b-9zvt75hx9v] {
    display: block;
    font-size: 11.5px;
    color: var(--accent-gray);
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

/*"Cannot evaluate" list - the reason is what HR reads, so it wraps in full*/
.skip-panel[b-9zvt75hx9v] { margin-top: 16px; }

/*The panel heading doubles as the fold toggle*/
.skip-toggle[b-9zvt75hx9v] {
    display: flex;
    align-items: center;
    gap: 6px;
    padding: 0;
    border: 0;
    background: none;
    font-family: inherit;
    text-align: start;
    cursor: pointer;
}

.skip-toggle:hover[b-9zvt75hx9v] { color: var(--text-color); }

.skip-toggle:focus-visible[b-9zvt75hx9v] {
    outline: 2px solid var(--accent-blue);
    outline-offset: 2px;
}

.skip-reason[b-9zvt75hx9v] {
    display: block;
    margin: 2px 0;
    font-size: 12.5px;
    font-style: italic;
    color: var(--text-color);
    white-space: normal;
}

.hint[b-9zvt75hx9v] {
    font-size: 11.5px;
    color: var(--accent-gray);
}

.form-chips[b-9zvt75hx9v] {
    display: flex;
    gap: 6px;
    flex-wrap: wrap;
}

.actions[b-9zvt75hx9v] {
    display: flex;
    gap: 8px;
    flex-wrap: wrap;
    align-items: center;
}
/* /Components/Modules/Reviews/Admin_Campaigns_DialogEditor.razor.rz.scp.css */
.dlg[b-lla1nn4e1w] {
    display: flex;
    flex-direction: column;
    gap: 16px;
}

.req[b-lla1nn4e1w] { color: var(--accent-red); }

.pair[b-lla1nn4e1w] {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 12px;
}

.scope[b-lla1nn4e1w] {
    display: flex;
    flex-direction: column;
    gap: 10px;
}

.scope-head[b-lla1nn4e1w] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    flex-wrap: wrap;
}

.scope-head label[b-lla1nn4e1w] {
    font-size: 12.5px;
    font-weight: 600;
    color: var(--text-color);
}

.country-checks[b-lla1nn4e1w] { display: flex; align-items: center; gap: 18px; flex-wrap: wrap; }

/*Pulled up to the fields above, it reads as their result*/
.hint[b-lla1nn4e1w] {
    margin-top: -8px;
    font-size: 12.5px;
    font-weight: 600;
    color: var(--text-color);
}

@media (max-width: 479.98px) {
    .pair[b-lla1nn4e1w] { grid-template-columns: 1fr; }
}

.actions[b-lla1nn4e1w] {
    display: flex;
    justify-content: flex-end;
    gap: 8px;
}
/* /Components/Modules/Reviews/Admin_FormEdit.razor.rz.scp.css */
.stack[b-ldblqyha3w] {
    display: flex;
    flex-direction: column;
    gap: 16px;
    height: 98%;
    min-height: 0;
}

/*Head with the save buttons stays put - the settings, the scope and the questions scroll as one block*/
.body-scroll[b-ldblqyha3w] {
    flex: 1;
    min-height: 0;
    overflow-y: auto;
    display: flex;
    flex-direction: column;
    gap: 16px;
    padding-bottom: 24px;
}

/*Cards keep their natural height - only the wrapper scrolls*/
.body-scroll > *[b-ldblqyha3w] { flex-shrink: 0; }

.page-head[b-ldblqyha3w] {
    display: flex;
    align-items: flex-start;
    gap: 16px;
    flex-wrap: wrap;
}

.page-head .grow[b-ldblqyha3w] { flex: 1; min-width: 260px; }

.eyebrow[b-ldblqyha3w] {
    font-size: 10.5px;
    font-weight: 700;
    letter-spacing: .1em;
    text-transform: uppercase;
    color: var(--accent-gray);
}

.page-head h1[b-ldblqyha3w] {
    margin: 2px 0 0;
    font-size: 22px;
    font-weight: 650;
}

.head-sub[b-ldblqyha3w] {
    display: flex;
    align-items: center;
    gap: 8px;
}

.head-actions[b-ldblqyha3w] {
    display: flex;
    gap: 8px;
    flex-wrap: wrap;
}

.card-shell[b-ldblqyha3w] {
    border: 1px solid var(--rz-border-color, #e0e0e0);
    border-radius: 14px;
    background: var(--bg-main);
    overflow: hidden;
}

/*A name and a few position chips - full width would leave the field mostly empty*/
.card-shell.basic[b-ldblqyha3w] { width: 60%; }

@media (max-width: 1100px) {
    .card-shell.basic[b-ldblqyha3w] { width: 100%; }
}

.card-head[b-ldblqyha3w] {
    display: flex;
    align-items: center;
    gap: 12px;
    flex-wrap: wrap;
    padding: 12px 16px;
    border-bottom: 1px solid var(--rz-border-color, #e0e0e0);
}

.card-title[b-ldblqyha3w] {
    font-weight: 600;
    font-size: 15px;
    flex: 1;
    min-width: 120px;
}

.card-pad[b-ldblqyha3w] {
    padding: 14px 16px;
    display: flex;
    flex-direction: column;
    gap: 14px;
}

.field[b-ldblqyha3w] { display: flex; flex-direction: column; gap: 4px; }

.field label[b-ldblqyha3w] {
    font-size: 12px;
    font-weight: 650;
    color: var(--accent-gray);
    display: flex;
    align-items: center;
    gap: 6px;
}

.req[b-ldblqyha3w] { color: var(--accent-red); }

.pillset[b-ldblqyha3w] { display: flex; align-items: center; gap: 6px; flex-wrap: wrap; }

.ro-tag[b-ldblqyha3w] {
    font-size: 10.5px;
    font-weight: 700;
    letter-spacing: .05em;
    text-transform: uppercase;
    color: var(--accent-gray);
}

.ro-tag.inline[b-ldblqyha3w] { text-transform: none; letter-spacing: 0; font-weight: 600; }

/*Language tabs sit in the questions card header*/
/*Each question is its own box, so rows do not visually run into each other*/
.qrow[b-ldblqyha3w] {
    margin: 12px 16px;
    border: 1px solid var(--rz-border-color, #e0e0e0);
    border-radius: 10px;
    overflow: hidden;
}

.qrow-head[b-ldblqyha3w] {
    display: flex;
    align-items: center;
    gap: 10px;
    flex-wrap: wrap;
    padding: 6px 16px;
    background: var(--surface-head);
    border-bottom: 1px solid var(--rz-border-color, #e0e0e0);
}

.qi[b-ldblqyha3w] {
    flex: 1;
    font-size: 13px;
    font-weight: 650;
}

/*One column per side - always exactly two, so the editor mirrors what the form will look like*/
.qvariants[b-ldblqyha3w] { display: grid; grid-template-columns: 1fr 1fr; }

.qvariant[b-ldblqyha3w] {
    padding: 14px 16px;
    display: flex;
    flex-direction: column;
    gap: 12px;
}

.qvariant + .qvariant[b-ldblqyha3w] { border-left: 1px solid var(--rz-border-color, #e0e0e0); }

/*Grows with the content - browsers without field-sizing keep the fixed rows with a scrollbar*/
.qvariant[b-ldblqyha3w]  .rz-textarea {
    field-sizing: content;
    min-height: 92px;
    max-height: 400px;
}

@media (max-width: 1100px) {
    .qvariants[b-ldblqyha3w] { grid-template-columns: 1fr; }
    .qvariant + .qvariant[b-ldblqyha3w] { border-left: 0; border-top: 1px solid var(--rz-border-color, #e0e0e0); }
}

.side-h[b-ldblqyha3w] {
    display: flex;
    align-items: center;
    gap: 6px;
    font-size: 11px;
    font-weight: 700;
    letter-spacing: .06em;
    text-transform: uppercase;
    color: var(--accent-gray);
}

.banner[b-ldblqyha3w] {
    display: flex;
    gap: 10px;
    align-items: flex-start;
    padding: 10px 14px;
    border-radius: 10px;
    font-size: 12.5px;
    line-height: 1.5;
}

.banner.info[b-ldblqyha3w] {
    color: var(--text-color);
    background: color-mix(in srgb, var(--accent-blue) 10%, transparent);
    border: 1px solid color-mix(in srgb, var(--accent-blue) 32%, transparent);
}

.banner.info i[b-ldblqyha3w] { color: var(--accent-blue); }

.empty[b-ldblqyha3w] {
    display: grid;
    place-items: center;
    height: 55vh;
    color: var(--accent-gray);
}

.empty.small[b-ldblqyha3w] { height: 140px; }
/* /Components/Modules/Reviews/Admin_FormEdit_DialogPositions.razor.rz.scp.css */
.dlg[b-1vlqvzeol1] {
    display: flex;
    flex-direction: column;
    gap: 16px;
}

/*The scroll container clips the hover halo - the gaps must clear --sc-halo-pad (14px), otherwise neighbouring halos overlap*/
.picker[b-1vlqvzeol1] {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(250px, 1fr));
    gap: 16px 28px;
    padding: 10px;
    max-height: 60vh;
    overflow-y: auto;
}

.actions[b-1vlqvzeol1] {
    display: flex;
    justify-content: flex-end;
    gap: 8px;
}
/* /Components/Modules/Reviews/Admin_Forms.razor.rz.scp.css */
.card-shell[b-39p9s77032] {
    height: 98%;
    display: flex;
    flex-direction: column;
    min-height: 0;
    overflow: hidden;
    border: 1px solid var(--rz-border-color, #e0e0e0);
    border-radius: 14px;
    background: var(--bg-main);
}

.card-head[b-39p9s77032] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    padding: 12px 16px;
    border-bottom: 1px solid var(--rz-border-color, #e0e0e0);
}

.card-title[b-39p9s77032] {
    font-weight: 600;
    font-size: 15px;
    display: flex;
    align-items: center;
    gap: 8px;
}

.card-body[b-39p9s77032] {
    flex: 1;
    min-height: 0;
    padding: 8px 12px;
}

.name[b-39p9s77032] {
    display: flex;
    align-items: center;
    gap: 6px;
    min-width: 0;
    font-weight: 600;
    line-height: 1.25;
}

.name-text[b-39p9s77032] {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.sub[b-39p9s77032] {
    font-size: 12px;
    color: var(--accent-gray);
    line-height: 1.25;
}

.empty[b-39p9s77032] {
    display: grid;
    place-items: center;
    height: 55vh;
    color: var(--accent-gray);
}
/* /Components/Modules/Reviews/Dev_ViewAs.razor.rz.scp.css */
.dev-view[b-yu3vueemg2] {
    display: flex;
    align-items: center;
    gap: 12px;
    flex-wrap: wrap;
}

/*Hard to miss on purpose - the screen shows somebody else's data*/
.dev-banner[b-yu3vueemg2] {
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 6px 12px;
    border-radius: 10px;
    font-size: 12.5px;
    font-weight: 600;
    color: var(--text-color);
    background: color-mix(in srgb, var(--accent-amber) 14%, transparent);
    border: 1px solid color-mix(in srgb, var(--accent-amber) 40%, transparent);
}

.dev-banner i[b-yu3vueemg2] { color: var(--accent-amber); }
/* /Components/Modules/Reviews/EvaluationWizard.razor.rz.scp.css */
.wizard[b-0hwvjwp1j1] {
    max-width: 800px;
    display: flex;
    flex-direction: column;
    gap: 16px;
    padding-bottom: 24px;
    height: 98%;
    min-height: 0;
}

.page-head[b-0hwvjwp1j1] {
    display: flex;
    align-items: flex-start;
    gap: 16px;
    flex-wrap: wrap;
}

.page-head .grow[b-0hwvjwp1j1] { flex: 1; min-width: 220px; }

.page-head h1[b-0hwvjwp1j1] {
    margin: 0;
    font-size: 22px;
    font-weight: 650;
}

.eyebrow[b-0hwvjwp1j1] {
    font-size: 11px;
    font-weight: 700;
    letter-spacing: .07em;
    text-transform: uppercase;
    color: var(--accent-gray);
}

.card-shell[b-0hwvjwp1j1] {
    border: 1px solid var(--rz-border-color, #e0e0e0);
    border-radius: 14px;
    background: var(--bg-main);
    overflow: hidden;
}

/*The card fits the wizard height - the comment box shrinks first and scrolls inside, the card scrolls only when even the smallest box does not fit*/
.qcard[b-0hwvjwp1j1] {
    display: flex;
    flex-direction: column;
    min-height: 0;
}

/*The pad scrolls instead of the card, so its bottom padding stays under the buttons*/
.qcard > .card-pad[b-0hwvjwp1j1] {
    min-height: 0;
    overflow-y: auto;
}

/*The textarea is a direct flex item of the card, so it stops shrinking at its own min-height instead of the block overflowing the buttons*/
.block.comment-block[b-0hwvjwp1j1] {
    display: contents;
}

.comment-block > .comment-area[b-0hwvjwp1j1],
.comment-block > .charcount[b-0hwvjwp1j1] {
    margin-top: -6px;
}

/*Same look as the 1:1 banners*/
.banner[b-0hwvjwp1j1] {
    display: flex;
    gap: 8px;
    align-items: flex-start;
    padding: 10px 13px;
    border-radius: 9px;
    font-size: 13px;
    line-height: 1.5;
    flex-shrink: 0;
    border: 1px solid color-mix(in srgb, var(--bc) 32%, transparent);
    background: color-mix(in srgb, var(--bc) 10%, transparent);
}

.banner i[b-0hwvjwp1j1] { color: var(--bc); }
.banner.warn[b-0hwvjwp1j1] { --bc: var(--accent-amber); }

.card-pad[b-0hwvjwp1j1] {
    padding: 20px 22px 22px;
    display: flex;
    flex-direction: column;
    gap: 14px;
}

.card-shell.done[b-0hwvjwp1j1] { border: 2px solid var(--accent-green); }
.card-shell.done h2[b-0hwvjwp1j1] { margin: 0; font-size: 19px; font-weight: 650; }

.hrow[b-0hwvjwp1j1] { display: flex; gap: 8px; flex-wrap: wrap; align-items: center; }
.muted[b-0hwvjwp1j1] { color: var(--accent-gray); }

.stepper[b-0hwvjwp1j1] {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
}

.step[b-0hwvjwp1j1] {
    display: flex;
    align-items: center;
    gap: 7px;
    background: none;
    border: 0;
    cursor: pointer;
    padding: 5px 8px;
    border-radius: 8px;
}

.step:hover[b-0hwvjwp1j1] { background: var(--surface-readonly); }

.step .bub[b-0hwvjwp1j1] {
    width: 32px;
    height: 32px;
    border-radius: 50%;
    display: grid;
    place-items: center;
    font-size: 13px;
    font-weight: 700;
    border: 2px solid var(--rz-border-color, #e0e0e0);
    color: var(--accent-gray);
    background: var(--bg-main);
}

.step[data-state="done"] .bub[b-0hwvjwp1j1] {
    background: var(--accent-green);
    border-color: var(--accent-green);
    color: #fff;
}

.step[data-state="partial"] .bub[b-0hwvjwp1j1] {
    border-color: var(--accent-amber);
    color: var(--accent-amber);
}

.step[aria-current="true"] .bub[b-0hwvjwp1j1] {
    box-shadow: 0 0 0 3px color-mix(in srgb, var(--text-color) 12%, transparent);
}

/*A finished step keeps its green fill and white check even while it is the active one*/
.step[aria-current="true"]:not([data-state="done"]) .bub[b-0hwvjwp1j1] {
    border-color: var(--text-color);
    color: var(--text-color);
}

.step-sep[b-0hwvjwp1j1] {
    flex: 1;
    min-width: 8px;
    height: 1px;
    background: var(--rz-border-color, #e0e0e0);
}

.qtopic[b-0hwvjwp1j1] {
    display: flex;
    align-items: baseline;
    gap: 10px;
    flex-wrap: wrap;
}

.qtext[b-0hwvjwp1j1] {
    font-size: 19px;
    font-weight: 650;
    line-height: 1.3;
    margin: 0;
    text-wrap: balance;
}

.qdesc[b-0hwvjwp1j1] {
    font-size: 13.5px;
    line-height: 1.5;
    color: var(--accent-gray);
    margin: -4px 0 0;
    white-space: pre-line;
}

.block[b-0hwvjwp1j1] { display: flex; flex-direction: column; gap: 8px; }

.fl[b-0hwvjwp1j1] {
    font-size: 12px;
    font-weight: 650;
    color: var(--accent-gray);
}

.req[b-0hwvjwp1j1] { color: var(--accent-red); }

.scale[b-0hwvjwp1j1] {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(140px, 1fr));
    gap: 8px;
}

.sc[b-0hwvjwp1j1] {
    display: flex;
    flex-direction: column;
    gap: 3px;
    padding: 11px 12px;
    border: 1.5px solid var(--rz-border-color, #e0e0e0);
    border-radius: 9px;
    background: var(--bg-main);
    cursor: pointer;
    text-align: left;
}

.sc .n[b-0hwvjwp1j1] {
    font-size: 20px;
    font-weight: 700;
    line-height: 1;
    color: var(--v);
}

.sc .t[b-0hwvjwp1j1] {
    font-size: 11.5px;
    line-height: 1.3;
    color: var(--accent-gray);
}

.sc:hover[b-0hwvjwp1j1] { border-color: var(--v); }

.sc[aria-pressed="true"][b-0hwvjwp1j1] {
    border-color: var(--v);
    background: color-mix(in srgb, var(--v) 10%, transparent);
    box-shadow: inset 0 0 0 1px var(--v);
}

.sc[aria-pressed="true"] .t[b-0hwvjwp1j1] { color: var(--text-color); font-weight: 600; }

.comment-area[b-0hwvjwp1j1] {
    width: 100%;
    border: var(--rz-input-border);
    border-radius: 14px;
    padding: 10px 14px;
    font: inherit;
    font-size: 13.5px;
    line-height: 1.5;
    background: var(--bg-main);
    color: var(--text-color);
    resize: vertical;
    outline: none;
    /*Grows with the content - browsers without field-sizing keep the fixed rows*/
    field-sizing: content;
    min-height: 112px;
    max-height: 400px;
}

.comment-area:focus[b-0hwvjwp1j1] { border-color: var(--rz-primary, #0f3d2e); }

.charcount.under[b-0hwvjwp1j1] { color: var(--accent-red); font-weight: 600; }

.sc[data-v="1"][b-0hwvjwp1j1] { --v: var(--sc-1); }
.sc[data-v="2"][b-0hwvjwp1j1] { --v: var(--sc-2); }
.sc[data-v="3"][b-0hwvjwp1j1] { --v: var(--sc-3); }
.sc[data-v="4"][b-0hwvjwp1j1] { --v: var(--sc-4); }

.ro-panel[b-0hwvjwp1j1] {
    background: var(--surface-readonly);
    border: 1px solid var(--surface-readonly-border);
    border-radius: 9px;
    padding: 10px 12px;
}

.readonly-tag[b-0hwvjwp1j1] {
    display: flex;
    align-items: center;
    gap: 6px;
    font-size: 10.5px;
    font-weight: 700;
    letter-spacing: .06em;
    text-transform: uppercase;
    color: var(--accent-gray);
    margin-bottom: 6px;
}

/*The tag line doubles as the toggle - the panel starts closed because the questions are optional
  and expanded they push the answer box off a phone screen*/
.hints[b-0hwvjwp1j1] {
    padding: 8px 12px;
}

.hints > summary[b-0hwvjwp1j1] {
    cursor: pointer;
    list-style: none;
    margin-bottom: 0;
}

.hints > summary[b-0hwvjwp1j1]::-webkit-details-marker {
    display: none;
}

.hints .chev[b-0hwvjwp1j1] {
    margin-left: auto;
    font-size: 11px;
    transition: transform .15s ease;
}

.hints[open] > summary[b-0hwvjwp1j1] {
    margin-bottom: 8px;
}

.hints[open] .chev[b-0hwvjwp1j1] {
    transform: rotate(180deg);
}

.hintlist[b-0hwvjwp1j1] {
    margin: 0;
    padding-left: 17px;
    display: flex;
    flex-direction: column;
    gap: 5px;
}

.hintlist li[b-0hwvjwp1j1] {
    font-size: 12.5px;
    line-height: 1.45;
    color: var(--accent-gray);
}

.hint[b-0hwvjwp1j1] {
    font-size: 11.5px;
    color: var(--accent-gray);
}

.wizfoot[b-0hwvjwp1j1] {
    display: flex;
    align-items: center;
    gap: 8px;
    flex-wrap: wrap;
    margin-top: 6px;
    padding-top: 14px;
    border-top: 1px solid var(--rz-border-color, #e0e0e0);
}

.wizfoot .spacer[b-0hwvjwp1j1] { flex: 1; }

.wizfoot-main[b-0hwvjwp1j1] {
    display: flex;
    align-items: center;
    gap: 8px;
}

/*Phone and tablet - the question card is taller than the screen, and the fixed height would clip it
  with no way to reach the buttons, so the page grows and the article scrolls instead*/
@media (max-width: 1023.98px) {
    .wizard[b-0hwvjwp1j1] {
        height: auto;
    }

    .card-pad[b-0hwvjwp1j1] {
        padding: 16px 14px 18px;
    }
}

/*Phone - every line above the question is one the reader has to scroll past five times, so the
  campaign line, the step count and the back label go away - the circles already say which step it is*/
@media (max-width: 639.98px) {
    .eyebrow[b-0hwvjwp1j1],
    .qtopic[b-0hwvjwp1j1] {
        display: none;
    }

    .page-head[b-0hwvjwp1j1] {
        align-items: center;
        gap: 10px;
    }

    .page-head .grow[b-0hwvjwp1j1] {
        min-width: 0;
    }

    .page-head[b-0hwvjwp1j1]  .sb-label {
        display: none;
    }

    /*Three buttons do not fit one phone row - the action that moves you on gets its own centred line*/
    .wizfoot-main[b-0hwvjwp1j1] {
        flex-basis: 100%;
        justify-content: center;
        margin-top: 4px;
    }
}
/* /Components/Modules/Reviews/Meeting.razor.rz.scp.css */
.stack[b-l0zf0gtdnc] {
    display: flex;
    flex-direction: column;
    gap: 16px;
    height: 98%;
    min-height: 0;
    max-width: 1200px;
}

/*Head stays put - everything below scrolls as one block*/
.body-scroll[b-l0zf0gtdnc] {
    flex: 1;
    min-height: 0;
    overflow-y: auto;
    display: flex;
    flex-direction: column;
    gap: 16px;
    padding-bottom: 24px;
}

/*Cards keep their natural height - only the wrapper scrolls*/
.body-scroll > *[b-l0zf0gtdnc] { flex-shrink: 0; }

.head-sub[b-l0zf0gtdnc] {
    display: flex;
    align-items: center;
    gap: 10px;
    flex-wrap: wrap;
}

.page-head[b-l0zf0gtdnc] {
    display: flex;
    align-items: flex-start;
    gap: 16px;
    flex-wrap: wrap;
}

.page-head .grow[b-l0zf0gtdnc] { flex: 1; min-width: 260px; }

.page-head h1[b-l0zf0gtdnc] {
    margin: 0;
    font-size: 22px;
    font-weight: 650;
}

.eyebrow[b-l0zf0gtdnc] {
    font-size: 11px;
    font-weight: 700;
    letter-spacing: .07em;
    text-transform: uppercase;
    color: var(--accent-gray);
}

.card-shell[b-l0zf0gtdnc] {
    border: 1px solid var(--rz-border-color, #e0e0e0);
    border-radius: 14px;
    background: var(--bg-main);
    overflow: hidden;
}

.card-head[b-l0zf0gtdnc] {
    display: flex;
    align-items: center;
    gap: 10px;
    flex-wrap: wrap;
    padding: 12px 16px;
    border-bottom: 1px solid var(--rz-border-color, #e0e0e0);
}

.card-title[b-l0zf0gtdnc] {
    font-weight: 600;
    font-size: 15px;
    flex: 1;
    min-width: 160px;
}

.card-pad[b-l0zf0gtdnc] {
    padding: 16px;
    display: flex;
    flex-direction: column;
    gap: 12px;
}

.muted[b-l0zf0gtdnc] { color: var(--accent-gray); }
.req[b-l0zf0gtdnc] { color: var(--accent-red); }
.hrow[b-l0zf0gtdnc] { display: flex; gap: 10px; flex-wrap: wrap; align-items: center; }

.summary-strip[b-l0zf0gtdnc] {
    display: flex;
    gap: 26px;
    flex-wrap: wrap;
    align-items: center;
    padding: 14px 18px;
    background: var(--surface-readonly);
    border: 1px solid var(--surface-readonly-border);
    border-radius: 12px;
}

.summary-strip .spacer[b-l0zf0gtdnc] { flex: 1; }

.metric .k[b-l0zf0gtdnc] {
    font-size: 10.5px;
    font-weight: 700;
    letter-spacing: .07em;
    text-transform: uppercase;
    color: var(--accent-gray);
}

.metric .v[b-l0zf0gtdnc] {
    font-size: 22px;
    font-weight: 700;
    line-height: 1.1;
    font-variant-numeric: tabular-nums;
}

.metric .v.self[b-l0zf0gtdnc] { color: var(--ch-self); }
.metric .v.mgr[b-l0zf0gtdnc] { color: var(--ch-mgr); }
.metric .v.final[b-l0zf0gtdnc] { color: var(--ch-final); }

.banner[b-l0zf0gtdnc] {
    display: flex;
    gap: 8px;
    align-items: flex-start;
    max-width: 330px;
    padding: 10px 13px;
    border-radius: 9px;
    font-size: 12.5px;
    line-height: 1.5;
    border: 1px solid color-mix(in srgb, var(--bc) 32%, transparent);
    background: color-mix(in srgb, var(--bc) 10%, transparent);
}

.banner i[b-l0zf0gtdnc] { color: var(--bc); }
.banner.ok[b-l0zf0gtdnc] { --bc: var(--accent-green); }
.banner.warn[b-l0zf0gtdnc] { --bc: var(--accent-amber); }
.banner.stop[b-l0zf0gtdnc] { --bc: var(--accent-red); }

.sbs[b-l0zf0gtdnc] {
    display: grid;
    grid-template-columns: 1fr 1fr;
}

.sbs > .side[b-l0zf0gtdnc], .sbs > .side-h[b-l0zf0gtdnc] { padding: 13px 15px; }
.sbs > .side + .side[b-l0zf0gtdnc], .sbs > .side-h + .side-h[b-l0zf0gtdnc] { border-left: 1px solid var(--rz-border-color, #e0e0e0); }

@media (max-width: 800px) {
    .sbs[b-l0zf0gtdnc] { grid-template-columns: 1fr; }
    .sbs > .side + .side[b-l0zf0gtdnc] { border-left: 0; border-top: 1px solid var(--rz-border-color, #e0e0e0); }
    .sbs-head[b-l0zf0gtdnc] { display: none; }
}

.sbs-head[b-l0zf0gtdnc] {
    background: var(--surface-readonly);
    border-bottom: 1px solid var(--rz-border-color, #e0e0e0);
}

.side-h[b-l0zf0gtdnc] {
    display: flex;
    align-items: center;
    gap: 7px;
    font-size: 11px;
    font-weight: 700;
    letter-spacing: .06em;
    text-transform: uppercase;
    color: var(--accent-gray);
}

/*min-width lets the column shrink under its content - without it one long answer widens the whole
  grid past the screen and takes the edit button with it*/
.side[b-l0zf0gtdnc] { display: flex; flex-direction: column; gap: 8px; min-width: 0; }

/*Grows with the content - browsers without field-sizing keep the fixed rows*/
.side[b-l0zf0gtdnc]  .rz-textarea,
.card-pad[b-l0zf0gtdnc]  .rz-textarea {
    field-sizing: content;
    min-height: 92px;
    max-height: 400px;
}

.side-top[b-l0zf0gtdnc] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 10px;
}

.qrow[b-l0zf0gtdnc] { border-bottom: 1px solid var(--rz-border-color, #e0e0e0); }
.qrow:last-child[b-l0zf0gtdnc] { border-bottom: 0; }

.qrow-head[b-l0zf0gtdnc] {
    display: flex;
    align-items: center;
    gap: 10px;
    flex-wrap: wrap;
    padding: 9px 15px;
    background: var(--surface-readonly);
    border-bottom: 1px solid var(--rz-border-color, #e0e0e0);
}

.qrow-head h4[b-l0zf0gtdnc] {
    flex: 1;
    min-width: 120px;
    margin: 0;
    font-size: 14px;
    font-weight: 600;
}

.scorebox[b-l0zf0gtdnc] {
    display: inline-flex;
    align-items: baseline;
    gap: 2px;
    font-weight: 700;
    font-size: 15px;
    color: var(--v);
    padding: 2px 9px;
    border-radius: 6px;
    background: color-mix(in srgb, var(--v) 12%, transparent);
}

.scorebox .of[b-l0zf0gtdnc] { font-size: 10px; font-weight: 600; opacity: .8; }

.scorebox[data-v="1"][b-l0zf0gtdnc] { --v: var(--sc-1); }
.scorebox[data-v="2"][b-l0zf0gtdnc] { --v: var(--sc-2); }
.scorebox[data-v="3"][b-l0zf0gtdnc] { --v: var(--sc-3); }
.scorebox[data-v="4"][b-l0zf0gtdnc] { --v: var(--sc-4); }

.answer-text[b-l0zf0gtdnc] {
    margin: 0;
    font-size: 12.5px;
    line-height: 1.55;
    white-space: pre-wrap;
    /*pre-wrap breaks on spaces only, so a long unbroken string would still run off the side*/
    overflow-wrap: anywhere;
}

.delta[b-l0zf0gtdnc] {
    font-size: 11px;
    font-weight: 700;
    color: var(--accent-amber);
}

.hint[b-l0zf0gtdnc] {
    font-size: 11.5px;
    color: var(--accent-gray);
}

.scale-mini[b-l0zf0gtdnc] {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 6px;
}

.scale-mini .sc[b-l0zf0gtdnc] {
    padding: 6px 7px;
    border: 1.5px solid var(--rz-border-color, #e0e0e0);
    border-radius: 8px;
    background: var(--bg-main);
    cursor: pointer;
}

.scale-mini .sc .n[b-l0zf0gtdnc] {
    font-size: 16px;
    font-weight: 700;
    color: var(--v);
}

.scale-mini .sc:hover[b-l0zf0gtdnc] { border-color: var(--v); }

.scale-mini .sc[aria-pressed="true"][b-l0zf0gtdnc] {
    border-color: var(--v);
    background: color-mix(in srgb, var(--v) 10%, transparent);
    box-shadow: inset 0 0 0 1px var(--v);
}

.scale-mini .sc[data-v="1"][b-l0zf0gtdnc] { --v: var(--sc-1); }
.scale-mini .sc[data-v="2"][b-l0zf0gtdnc] { --v: var(--sc-2); }
.scale-mini .sc[data-v="3"][b-l0zf0gtdnc] { --v: var(--sc-3); }
.scale-mini .sc[data-v="4"][b-l0zf0gtdnc] { --v: var(--sc-4); }

/*Phone and tablet - pinning the head costs too much of a short screen, so the whole page scrolls*/
@media (max-width: 1023.98px) {
    .stack[b-l0zf0gtdnc] {
        height: auto;
    }

    .body-scroll[b-l0zf0gtdnc] {
        overflow-y: visible;
    }
}



/* /Components/Modules/Reviews/Meeting_DialogDetail.razor.rz.scp.css */
.dlg[b-2spifm9cys] {
    display: flex;
    flex-direction: column;
    gap: 14px;
}

.head-row[b-2spifm9cys] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
    flex-wrap: wrap;
}

.emp-sub[b-2spifm9cys] {
    font-size: 12.5px;
    color: var(--accent-gray);
}

.sums[b-2spifm9cys] {
    display: flex;
    gap: 26px;
    padding: 12px 16px;
    background: var(--surface-readonly);
    border: 1px solid var(--surface-readonly-border);
    border-radius: 12px;
}

.metric .k[b-2spifm9cys] {
    font-size: 10.5px;
    font-weight: 700;
    letter-spacing: .07em;
    text-transform: uppercase;
    color: var(--accent-gray);
}

.metric .v[b-2spifm9cys] {
    font-size: 20px;
    font-weight: 700;
    line-height: 1.1;
    font-variant-numeric: tabular-nums;
}

.metric .v.self[b-2spifm9cys] { color: var(--ch-self); }
.metric .v.mgr[b-2spifm9cys] { color: var(--ch-mgr); }
.metric .v.final[b-2spifm9cys] { color: var(--ch-final); }

.q[b-2spifm9cys] {
    border: 1px solid var(--rz-border-color, #e0e0e0);
    border-radius: 10px;
    overflow: hidden;
}

.q-head[b-2spifm9cys] {
    padding: 7px 14px;
    font-size: 13px;
    font-weight: 600;
    background: var(--surface-head);
    border-bottom: 1px solid var(--rz-border-color, #e0e0e0);
}

.q-sides[b-2spifm9cys] {
    display: grid;
    grid-template-columns: 1fr 1fr;
}

.q-side[b-2spifm9cys] {
    padding: 10px 14px;
    display: flex;
    flex-direction: column;
    gap: 7px;
}

.q-side + .q-side[b-2spifm9cys] { border-left: 1px solid var(--rz-border-color, #e0e0e0); }

@media (max-width: 700px) {
    .q-sides[b-2spifm9cys] { grid-template-columns: 1fr; }
    .q-side + .q-side[b-2spifm9cys] { border-left: 0; border-top: 1px solid var(--rz-border-color, #e0e0e0); }
}

.side-h[b-2spifm9cys] {
    display: flex;
    align-items: center;
    gap: 6px;
    font-size: 10.5px;
    font-weight: 700;
    letter-spacing: .06em;
    text-transform: uppercase;
    color: var(--accent-gray);
}

.scorebox[b-2spifm9cys] {
    align-self: flex-start;
    display: inline-flex;
    align-items: baseline;
    gap: 2px;
    font-weight: 700;
    font-size: 15px;
    color: var(--v);
    padding: 2px 9px;
    border-radius: 6px;
    background: color-mix(in srgb, var(--v) 12%, transparent);
}

.scorebox .of[b-2spifm9cys] { font-size: 10px; font-weight: 600; opacity: .8; }

.scorebox[data-v="1"][b-2spifm9cys] { --v: var(--sc-1); }
.scorebox[data-v="2"][b-2spifm9cys] { --v: var(--sc-2); }
.scorebox[data-v="3"][b-2spifm9cys] { --v: var(--sc-3); }
.scorebox[data-v="4"][b-2spifm9cys] { --v: var(--sc-4); }

.answer-text[b-2spifm9cys] {
    margin: 0;
    font-size: 12.5px;
    line-height: 1.55;
    white-space: pre-wrap;
}

.hint[b-2spifm9cys] {
    font-size: 11.5px;
    color: var(--accent-gray);
}

.final .q-head[b-2spifm9cys] {
    background: transparent;
    border: 0;
    padding: 0 0 4px;
}
/* /Components/Modules/Reviews/My_Evaluation.razor.rz.scp.css */
.stack[b-rp1d0110sd] {
    display: flex;
    flex-direction: column;
    gap: 16px;
    height: 98%;
    min-height: 0;
    max-width: 1200px;
}

/*Head stays put - everything below scrolls as one block*/
.body-scroll[b-rp1d0110sd] {
    flex: 1;
    min-height: 0;
    overflow-y: auto;
    display: flex;
    flex-direction: column;
    gap: 16px;
    padding-bottom: 24px;
}

/*Cards keep their natural height - only the wrapper scrolls*/
.body-scroll > *[b-rp1d0110sd] { flex-shrink: 0; }

.page-head[b-rp1d0110sd] {
    display: flex;
    align-items: flex-start;
    gap: 16px;
    flex-wrap: wrap;
}

.page-head .grow[b-rp1d0110sd] { flex: 1; min-width: 260px; }

.page-head h1[b-rp1d0110sd] {
    margin: 0;
    font-size: 22px;
    font-weight: 650;
}

.sub[b-rp1d0110sd] {
    margin: 4px 0 0;
    font-size: 13px;
    color: var(--accent-gray);
}

.card-shell[b-rp1d0110sd] {
    border: 1px solid var(--rz-border-color, #e0e0e0);
    border-radius: 14px;
    background: var(--bg-main);
    overflow: hidden;
}

.card-head[b-rp1d0110sd] {
    display: flex;
    align-items: center;
    gap: 10px;
    flex-wrap: wrap;
    padding: 12px 16px;
    border-bottom: 1px solid var(--rz-border-color, #e0e0e0);
}

.card-title[b-rp1d0110sd] {
    font-weight: 600;
    font-size: 15px;
    flex: 1;
    min-width: 140px;
}

.card-pad[b-rp1d0110sd] {
    padding: 16px;
    display: flex;
    flex-direction: column;
    gap: 12px;
}

.muted[b-rp1d0110sd] { color: var(--accent-gray); }
.hrow[b-rp1d0110sd] { display: flex; gap: 8px; flex-wrap: wrap; align-items: center; }

.head-card[b-rp1d0110sd] {
    flex-direction: row;
    align-items: center;
    gap: 22px;
    flex-wrap: wrap;
}

.head-card .grow[b-rp1d0110sd] { flex: 1; min-width: 250px; }

.head-card h2[b-rp1d0110sd] {
    margin: 8px 0 0;
    font-size: 19px;
    font-weight: 650;
}

.metric.end[b-rp1d0110sd] { text-align: right; }

.metric .k[b-rp1d0110sd] {
    font-size: 10.5px;
    font-weight: 700;
    letter-spacing: .07em;
    text-transform: uppercase;
    color: var(--accent-gray);
}

.metric .v[b-rp1d0110sd] {
    font-size: 24px;
    font-weight: 700;
    line-height: 1.15;
    font-variant-numeric: tabular-nums;
}

.metric .v.warn[b-rp1d0110sd] { color: var(--accent-amber); }
.metric .v.bad[b-rp1d0110sd] { color: var(--accent-red); }

.g2[b-rp1d0110sd] {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(320px, 1fr));
    gap: 16px;
    align-items: start;
}

.timeline[b-rp1d0110sd] { gap: 10px; }

.tl-row[b-rp1d0110sd] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 10px;
}

.mono[b-rp1d0110sd] {
    font-size: 12px;
    color: var(--accent-gray);
}

/*Radzen renders the rows itself, so the scope attribute never lands on them*/
[b-rp1d0110sd] .rz-datatable tbody tr { cursor: pointer; }

/*Phone and tablet - pinning the head costs too much of a short screen, so the whole page scrolls*/
@media (max-width: 1023.98px) {
    .stack[b-rp1d0110sd] {
        height: auto;
    }

    .body-scroll[b-rp1d0110sd] {
        overflow-y: visible;
    }
}
/* /Components/Modules/Reviews/My_Report.razor.rz.scp.css */
.stack[b-kp3w0ug99r] {
    display: flex;
    flex-direction: column;
    gap: 16px;
    height: 98%;
    min-height: 0;
    max-width: 1200px;
}

/*Head stays put - everything below scrolls as one block*/
.body-scroll[b-kp3w0ug99r] {
    flex: 1;
    min-height: 0;
    overflow-y: auto;
    display: flex;
    flex-direction: column;
    gap: 16px;
    padding-bottom: 24px;
}

/*Cards keep their natural height - only the wrapper scrolls*/
.body-scroll > *[b-kp3w0ug99r] { flex-shrink: 0; }

.page-head[b-kp3w0ug99r] {
    display: flex;
    align-items: flex-start;
    gap: 16px;
    flex-wrap: wrap;
}

.page-head .grow[b-kp3w0ug99r] { flex: 1; min-width: 260px; }

.page-head h1[b-kp3w0ug99r] {
    margin: 0;
    font-size: 22px;
    font-weight: 650;
}

.sub[b-kp3w0ug99r] {
    margin: 4px 0 0;
    font-size: 13px;
    color: var(--accent-gray);
    max-width: 80ch;
}

.card-shell[b-kp3w0ug99r] {
    border: 1px solid var(--rz-border-color, #e0e0e0);
    border-radius: 14px;
    background: var(--bg-main);
    overflow: hidden;
}

.card-head[b-kp3w0ug99r] {
    display: flex;
    align-items: center;
    gap: 10px;
    flex-wrap: wrap;
    padding: 12px 16px;
    border-bottom: 1px solid var(--rz-border-color, #e0e0e0);
}

.card-title[b-kp3w0ug99r] {
    font-weight: 600;
    font-size: 15px;
    flex: 1;
    min-width: 160px;
}

.card-pad[b-kp3w0ug99r] { padding: 16px; }

.muted[b-kp3w0ug99r] { color: var(--accent-gray); }

.summary-strip[b-kp3w0ug99r] {
    display: flex;
    gap: 26px;
    flex-wrap: wrap;
    align-items: center;
    padding: 14px 18px;
    background: var(--surface-readonly);
    border: 1px solid var(--surface-readonly-border);
    border-radius: 12px;
}

.metric .k[b-kp3w0ug99r] {
    font-size: 10.5px;
    font-weight: 700;
    letter-spacing: .07em;
    text-transform: uppercase;
    color: var(--accent-gray);
}

.metric .v[b-kp3w0ug99r] {
    font-size: 22px;
    font-weight: 700;
    line-height: 1.1;
    font-variant-numeric: tabular-nums;
}

.metric .v.self[b-kp3w0ug99r] { color: var(--ch-self); }
.metric .v.mgr[b-kp3w0ug99r] { color: var(--ch-mgr); }
.metric .v.final[b-kp3w0ug99r] { color: var(--ch-final); }
.metric .v.up[b-kp3w0ug99r] { color: var(--accent-green); }
.metric .v.down[b-kp3w0ug99r] { color: var(--accent-red); }

.legend[b-kp3w0ug99r] {
    display: flex;
    gap: 16px;
    flex-wrap: wrap;
    font-size: 11.5px;
    color: var(--accent-gray);
}

.legend .sw[b-kp3w0ug99r] {
    display: inline-block;
    width: 10px;
    height: 10px;
    border-radius: 2px;
    margin-right: 5px;
    vertical-align: -1px;
}

.legend .sw.self[b-kp3w0ug99r] { background: var(--ch-self); }
.legend .sw.mgr[b-kp3w0ug99r] { background: var(--ch-mgr); }

.final-note[b-kp3w0ug99r] {
    margin: 0;
    font-size: 13px;
    line-height: 1.6;
    white-space: pre-wrap;
}

/*Phone and tablet - pinning the head costs too much of a short screen, so the whole page scrolls*/
@media (max-width: 1023.98px) {
    .stack[b-kp3w0ug99r] {
        height: auto;
    }

    .body-scroll[b-kp3w0ug99r] {
        overflow-y: visible;
    }
}
/* /Components/Modules/Reviews/ReportBars.razor.rz.scp.css */
.bars[b-nwpuq97b5m] {
    display: flex;
    flex-direction: column;
    gap: 5px;
}

.barrow[b-nwpuq97b5m] {
    display: grid;
    grid-template-columns: minmax(120px, 200px) 1fr 44px;
    gap: 13px;
    align-items: center;
}

.barrow .lbl[b-nwpuq97b5m] {
    font-size: 12.5px;
    font-weight: 600;
}

.bars.stacked[b-nwpuq97b5m] { gap: 13px; }

.bars.stacked .barrow[b-nwpuq97b5m] {
    grid-template-columns: 1fr 44px;
    gap: 3px 13px;
}

.bars.stacked .lbl[b-nwpuq97b5m] {
    grid-column: 1 / -1;
    line-height: 1.4;
}

.bars.stacked .baraxis[b-nwpuq97b5m] { grid-template-columns: 1fr 44px; }
.bars.stacked .baraxis > span:first-child[b-nwpuq97b5m] { display: none; }

.barrow .lbl.mono[b-nwpuq97b5m] {
    font-size: 12px;
    font-weight: 500;
    color: var(--accent-gray);
}

.bartrack[b-nwpuq97b5m] {
    position: relative;
    height: 34px;
}

.bartrack.single[b-nwpuq97b5m] { height: 22px; }

.bargrid[b-nwpuq97b5m] {
    position: absolute;
    inset: 0;
    display: grid;
    grid-template-columns: repeat(4, 1fr);
}

.bargrid span[b-nwpuq97b5m] { border-right: 1px solid var(--rz-border-color, #e0e0e0); }
.bargrid span:last-child[b-nwpuq97b5m] { border-right: 0; }

.bar[b-nwpuq97b5m] {
    position: absolute;
    height: 10px;
    border-radius: 0 4px 4px 0;
}

.bar.self[b-nwpuq97b5m] { top: 6px; background: var(--ch-self); }
.bar.mgr[b-nwpuq97b5m] { top: 18px; background: var(--ch-mgr); }
.bar.solo[b-nwpuq97b5m] { top: 6px; background: var(--ch-final); }

.barvals[b-nwpuq97b5m] {
    position: relative;
    height: 34px;
    text-align: right;
    font-variant-numeric: tabular-nums;
    font-size: 11.5px;
    font-weight: 700;
    color: var(--accent-gray);
}

.barvals.single[b-nwpuq97b5m] { height: 22px; }

.barvals span[b-nwpuq97b5m] {
    position: absolute;
    right: 0;
    height: 10px;
    line-height: 10px;
}

.barvals .v-self[b-nwpuq97b5m] { top: 6px; }
.barvals .v-mgr[b-nwpuq97b5m] { top: 18px; }
.barvals .v-solo[b-nwpuq97b5m] { top: 6px; }

.baraxis[b-nwpuq97b5m] {
    display: grid;
    grid-template-columns: minmax(120px, 200px) 1fr 44px;
    gap: 13px;
    margin-top: 5px;
}

.baraxis .ticks[b-nwpuq97b5m] {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    font-size: 10.5px;
    color: var(--accent-gray);
}

.baraxis .ticks span[b-nwpuq97b5m] {
    text-align: right;
    padding-right: 3px;
}
/* /Components/Modules/Reviews/ScoreCell.razor.rz.scp.css */
.cell[b-93ay2s64m7] {
    display: inline-block;
    min-width: 38px;
    text-align: center;
    font-weight: 700;
    font-size: 12.5px;
    font-variant-numeric: tabular-nums;
    padding: 2px 6px;
    border-radius: 5px;
    color: var(--v);
    background: color-mix(in srgb, var(--v) 14%, transparent);
}

.cell[data-band="1"][b-93ay2s64m7] { --v: var(--sc-1); }
.cell[data-band="2"][b-93ay2s64m7] { --v: var(--sc-2); }
.cell[data-band="3"][b-93ay2s64m7] { --v: var(--sc-3); }
.cell[data-band="4"][b-93ay2s64m7] { --v: var(--sc-4); }

.cell.empty[b-93ay2s64m7] {
    background: transparent;
    color: var(--accent-gray);
}
/* /Components/Modules/Reviews/Team_Report.razor.rz.scp.css */
/*Column widths as variables so the breakpoint can shrink them without JS - the name column has no
  Width and lives on what the fixed ones leave, so it starves unless they give room back*/
.stack[b-nmx7nmq0b9] {
    display: flex;
    flex-direction: column;
    gap: 16px;
    height: 98%;
    min-height: 0;
    max-width: 1200px;
    --c-name: auto;
    --c-below: 110px;
    --c-done: 160px;
    --c-self: 130px;
    --c-score: 90px;
    --c-act: 110px;
}

.stack > *[b-nmx7nmq0b9] { flex-shrink: 0; }

/*The tree card takes what is left of the page and scrolls inside, keeping the column headers*/
.card-shell.grid-card[b-nmx7nmq0b9] {
    flex: 1;
    min-height: 0;
    display: flex;
    flex-direction: column;
}

.page-head[b-nmx7nmq0b9] {
    display: flex;
    align-items: flex-start;
    gap: 16px;
    flex-wrap: wrap;
}

.page-head .grow[b-nmx7nmq0b9] { flex: 1; min-width: 260px; }

.page-head h1[b-nmx7nmq0b9] {
    margin: 0;
    font-size: 22px;
    font-weight: 650;
}

.hrow[b-nmx7nmq0b9] {
    display: flex;
    gap: 8px;
    flex-wrap: wrap;
    align-items: center;
    /*Scoped Radzen overrides - the clear (X) and chevron read the leaf var directly*/
    --rz-input-height: 2.2rem;
    --rz-dropdown-trigger-icon-height: 1.3rem;
}

/*Only the closed trigger is reachable via ::deep - the popup is teleported to <body> and tuned through PopupStyle*/
.hrow[b-nmx7nmq0b9]  .rz-dropdown {
    border-radius: 99px;
    font-size: 13px;
    padding-right: 6px;
}

.hrow[b-nmx7nmq0b9]  .rz-dropdown .rz-dropdown-label,
.hrow[b-nmx7nmq0b9]  .rz-dropdown .rz-placeholder {
    font-size: 13px;
}

.hrow[b-nmx7nmq0b9]  .rz-dropdown-trigger .rzi-chevron-down::before {
    color: var(--rz-text-secondary-color, #6c6c6c);
}

/*Drop the focus ring - it lingers lit after a selection until you click away*/
.hrow[b-nmx7nmq0b9]  .rz-dropdown:focus,
.hrow[b-nmx7nmq0b9]  .rz-dropdown.rz-state-focused {
    box-shadow: none !important;
    outline: none !important;
    border: var(--rz-input-border) !important;
}

.card-shell[b-nmx7nmq0b9] {
    border: 1px solid var(--rz-border-color, #e0e0e0);
    border-radius: 14px;
    background: var(--bg-main);
    overflow: hidden;
}

.card-head[b-nmx7nmq0b9] {
    display: flex;
    align-items: center;
    gap: 10px;
    flex-wrap: wrap;
    padding: 12px 16px;
    border-bottom: 1px solid var(--rz-border-color, #e0e0e0);
}

.card-title[b-nmx7nmq0b9] {
    font-weight: 600;
    font-size: 15px;
    flex: 1;
    min-width: 160px;
}

.card-pad[b-nmx7nmq0b9] { padding: 16px; }
.muted[b-nmx7nmq0b9] { color: var(--accent-gray); }

.summary-strip[b-nmx7nmq0b9] {
    display: flex;
    gap: 26px;
    flex-wrap: wrap;
    align-items: center;
    padding: 14px 18px;
    background: var(--surface-readonly);
    border: 1px solid var(--surface-readonly-border);
    border-radius: 12px;
}

.metric .k[b-nmx7nmq0b9] {
    font-size: 10.5px;
    font-weight: 700;
    letter-spacing: .07em;
    text-transform: uppercase;
    color: var(--accent-gray);
}

.metric .v[b-nmx7nmq0b9] {
    font-size: 22px;
    font-weight: 700;
    line-height: 1.1;
    font-variant-numeric: tabular-nums;
}

.metric .v.ok[b-nmx7nmq0b9] { color: var(--accent-green); }
.metric .v.warn[b-nmx7nmq0b9] { color: var(--accent-amber); }

.tw[b-nmx7nmq0b9] {
    display: inline-flex;
    align-items: center;
    gap: 7px;
}

/*One fixed slot whether the toggle is there or not, so siblings line up in the same column*/
.twig[b-nmx7nmq0b9] {
    width: 30px;
    display: grid;
    place-items: center;
    flex-shrink: 0;
}

.twig-icon[b-nmx7nmq0b9] {
    font-size: 14px;
    color: var(--accent-gray);
}

/*Whole-row toggle - the extra .grid-card level beats Radzen's striped-row selector on even rows*/
[b-nmx7nmq0b9] tr.can-toggle { cursor: pointer; }
.grid-card[b-nmx7nmq0b9]  tr.can-toggle:hover > td { background: rgba(2, 97, 177, 0.08); }

/*The frozen name cell paints its own solid background so the scrolled columns never show through -
  the same tint is mixed into it, a see-through one would let them in*/
.grid-card[b-nmx7nmq0b9]  tr.can-toggle:hover > td.rz-frozen-cell {
    background: color-mix(in srgb, rgb(2, 97, 177) 8%, var(--bg-main));
}

.emp-name[b-nmx7nmq0b9] { font-weight: 600; }

.store-lead[b-nmx7nmq0b9] {
    font-size: 12px;
    font-weight: 700;
    color: var(--accent-blue);
    margin-right: 8px;
}

/*Radzen renders the rows itself, so the scope attribute never lands on them*/
[b-nmx7nmq0b9] tr.country { background: var(--surface-readonly); }
[b-nmx7nmq0b9] tr.country .emp-name { font-weight: 700; letter-spacing: .04em; }
[b-nmx7nmq0b9] tr.structure .emp-name { font-weight: 650; }
[b-nmx7nmq0b9] tr.excluded .emp-name, [b-nmx7nmq0b9] tr.excluded .emp-sub { color: var(--accent-gray); }

.emp-sub[b-nmx7nmq0b9] {
    font-size: 12px;
    color: var(--accent-gray);
}

/*Same line as the subtitle - the responsible position when it is not the row above, amber as in the queue*/
.emp-resp[b-nmx7nmq0b9] {
    font-size: 12px;
    font-weight: 600;
    color: var(--accent-amber);
    margin-left: 8px;
    white-space: nowrap;
}

/*Not named "progress" - Bootstrap owns that class and paints its own track over the wrapper*/
.pwrap[b-nmx7nmq0b9] {
    display: flex;
    align-items: center;
    gap: 8px;
    flex-wrap: nowrap;
    min-width: 120px;
}

.pbar[b-nmx7nmq0b9] {
    flex: 1;
    height: 6px;
    border-radius: 99px;
    background: var(--rz-border-color, #e0e0e0);
    overflow: hidden;
    min-width: 60px;
}

.pbar .fill[b-nmx7nmq0b9] {
    display: block;
    height: 100%;
    background: var(--accent-green);
}

.mono[b-nmx7nmq0b9] {
    font-size: 11.5px;
    color: var(--accent-gray);
    font-variant-numeric: tabular-nums;
}

.hint[b-nmx7nmq0b9] {
    font-size: 11.5px;
    color: var(--accent-gray);
}

/*Wider than the 1024 layout breakpoint on purpose - with the sidebar shown the name column still
  starves up to about 1400 - last in the file because a media query adds no specificity of its own*/
@media (max-width: 1399.98px) {
    .stack[b-nmx7nmq0b9] {
        --c-below: 0px;
        --c-done: 130px;
        --c-self: 80px;
        --c-score: 80px;
        --c-act: 100px;
    }

    /*Collapsed to nothing rather than display:none - a hidden cell shifts the row off its <col> widths*/
    .grid-card[b-nmx7nmq0b9]  .c-below {
        padding: 0 !important;
        visibility: hidden;
        overflow: hidden;
    }

    .summary-strip[b-nmx7nmq0b9] {
        gap: 18px;
        padding: 12px 14px;
    }

    .pwrap[b-nmx7nmq0b9] {
        min-width: 0;
        gap: 6px;
    }

    .pbar[b-nmx7nmq0b9] {
        min-width: 40px;
    }

    /*The percentage keeps its width - the bar is what gives way*/
    .pwrap .mono[b-nmx7nmq0b9] {
        flex-shrink: 0;
    }

    /*Store above the name instead of beside it - side by side neither of them fits -
      the nowrap sits on Radzen's own .rz-cell-data wrapper, so the cell itself is not enough*/
    .grid-card[b-nmx7nmq0b9]  .c-name .rz-cell-data {
        white-space: normal;
    }

    .store-lead[b-nmx7nmq0b9] {
        display: block;
        margin-right: 0;
    }

    /*The inline-flex row and its text child both need to give, or the long store names just overflow*/
    .tw[b-nmx7nmq0b9] {
        max-width: 100%;
    }

    .tw > span:last-child[b-nmx7nmq0b9] {
        min-width: 0;
    }
}

/*Phone - the rest of the columns cannot fit next to a readable name, so they move into a
  sideways scroll and the name gets a fixed width to stay frozen against*/
@media (max-width: 639.98px) {
    .stack[b-nmx7nmq0b9] {
        --c-name: 170px;
    }

    .summary-strip[b-nmx7nmq0b9] {
        gap: 14px;
        padding: 12px;
    }
}
/* /Components/Modules/Reviews/ToEvaluate.razor.rz.scp.css */
/*Column widths as variables so the breakpoint can shrink them without JS - ToEvaluate_Group reads them*/
.stack[b-1h5joa5dhf] {
    display: flex;
    flex-direction: column;
    gap: 16px;
    height: 98%;
    min-height: 0;
    max-width: 1200px;
    --c-store: 220px;
    --c-emp: 220px;
    --c-sent: 170px;
    --c-status: 230px;
    --c-act: 330px;
}

/*Wider than the 1024 layout breakpoint on purpose - with the sidebar shown the fixed columns
  still overflow up to about 1400*/
@media (max-width: 1399.98px) {
    .stack[b-1h5joa5dhf] {
        --c-store: 120px;
        --c-sent: 0px;
        --c-act: 270px;
    }
}

/*Head stays put - everything below scrolls as one block*/
.body-scroll[b-1h5joa5dhf] {
    flex: 1;
    min-height: 0;
    overflow-y: auto;
    display: flex;
    flex-direction: column;
    gap: 16px;
    padding-bottom: 24px;
}

/*Cards keep their natural height - only the wrapper scrolls*/
.body-scroll > *[b-1h5joa5dhf] { flex-shrink: 0; }

.head-line[b-1h5joa5dhf] {
    display: flex;
    align-items: center;
    gap: 12px;
}

.head-line h1[b-1h5joa5dhf] { margin: 0; }

.page-head[b-1h5joa5dhf] {
    display: flex;
    align-items: flex-start;
    gap: 16px;
    flex-wrap: wrap;
}

.page-head .grow[b-1h5joa5dhf] { flex: 1; min-width: 260px; }

.page-head h1[b-1h5joa5dhf] {
    margin: 0;
    font-size: 22px;
    font-weight: 650;
}

.card-shell[b-1h5joa5dhf] {
    border: 1px solid var(--rz-border-color, #e0e0e0);
    border-radius: 14px;
    background: var(--bg-main);
    overflow: hidden;
}

.card-head[b-1h5joa5dhf] {
    display: flex;
    align-items: center;
    gap: 10px;
    flex-wrap: wrap;
    padding: 12px 16px;
    border-bottom: 1px solid var(--rz-border-color, #e0e0e0);
}

.card-title[b-1h5joa5dhf] {
    font-weight: 600;
    font-size: 15px;
    flex: 1;
    min-width: 160px;
}

.card-pad[b-1h5joa5dhf] { padding: 16px; }

.muted[b-1h5joa5dhf] { color: var(--accent-gray); }

/*Block heading - same bar for both blocks, the second one is also the fold toggle*/
.sec-head[b-1h5joa5dhf] {
    display: flex;
    align-items: center;
    gap: 8px;
    width: 100%;
    padding: 8px 16px;
    font-size: 11px;
    font-weight: 700;
    letter-spacing: .07em;
    text-transform: uppercase;
    color: var(--accent-gray);
    background: var(--surface-readonly);
    border-bottom: 1px solid var(--rz-border-color, #e0e0e0);
}

.sec-head i[b-1h5joa5dhf] { font-size: 13px; }

/*People reached through the position - a stripe down the side and its own heading keep them apart from
  the reader's own people / the stripe is drawn over the edge, a real border would narrow the grid and
  its columns would stop lining up with the block above*/
.sec-others[b-1h5joa5dhf] {
    position: relative;
    border-top: 1px solid var(--rz-border-color, #e0e0e0);
}

.sec-others[b-1h5joa5dhf]::before {
    content: "";
    position: absolute;
    inset-block: 0;
    inset-inline-start: 0;
    width: 4px;
    background: color-mix(in srgb, var(--accent-gray) 45%, transparent);
    z-index: 3;
    pointer-events: none;
}

.sec-others .sec-head[b-1h5joa5dhf] {
    background: var(--surface-head);
    color: var(--text-color);
}

/*"Cannot evaluate" - under a stronger line and greyed out, it is no longer anybody's turn*/
.sec-skipped[b-1h5joa5dhf] {
    border-top: 2px solid var(--rz-border-color, #e0e0e0);
}

.sec-skipped[b-1h5joa5dhf]  .group { opacity: .7; }

/*Delegated - the same quiet block as "cannot evaluate", the row is somebody else's turn now*/
.sec-delegated[b-1h5joa5dhf] {
    border-top: 2px solid var(--rz-border-color, #e0e0e0);
}

.sec-delegated[b-1h5joa5dhf]  .group { opacity: .8; }

.sec-toggle[b-1h5joa5dhf] {
    border: 0;
    border-bottom: 1px solid var(--rz-border-color, #e0e0e0);
    font-family: inherit;
    text-align: start;
    cursor: pointer;
}

.sec-toggle:hover[b-1h5joa5dhf] { filter: brightness(.97); }

.sec-toggle:focus-visible[b-1h5joa5dhf] {
    outline: 2px solid var(--accent-blue);
    outline-offset: -2px;
}

/*Folded - no line under the heading, the card border closes it*/
.sec-toggle[aria-expanded="false"][b-1h5joa5dhf] { border-bottom: 0; }

/*Phone and tablet - pinning the head costs too much of a short screen, so the whole page scrolls*/
@media (max-width: 1023.98px) {
    .stack[b-1h5joa5dhf] {
        height: auto;
    }

    .body-scroll[b-1h5joa5dhf] {
        overflow-y: visible;
    }
}
/* /Components/Modules/Reviews/ToEvaluate_Actions.razor.rz.scp.css */
.act[b-vc9m2p01va] {
    display: flex;
    justify-content: flex-end;
    align-items: center;
    flex-wrap: wrap;
    gap: 6px;
}

/*Only in the grid - below the wide desktop the column has no room for labels, so the buttons
  fall back to icons - the label is dropped, not the button*/
@media (max-width: 1399.98px) {
    .act-compact[b-vc9m2p01va]  .sb-label {
        display: none;
    }

    .act-compact[b-vc9m2p01va]  .SimoButton {
        padding: 4px 5px;
    }

    .act-compact[b-vc9m2p01va]  .SimoButton i {
        font-size: 18px !important;
    }
}
/* /Components/Modules/Reviews/ToEvaluate_DialogDelegate.razor.rz.scp.css */
.dlg[b-yb8e1zv3gj] {
    display: flex;
    flex-direction: column;
    gap: 12px;
}

.lead[b-yb8e1zv3gj] {
    margin: 0;
    font-size: 13.5px;
    color: var(--text-color);
}

/*Long areas scroll inside the dialog - the buttons stay in view*/
.list[b-yb8e1zv3gj] {
    display: flex;
    flex-direction: column;
    max-height: 55vh;
    overflow-y: auto;
    border: 1px solid var(--rz-border-color, #e0e0e0);
    border-radius: 10px;
}

.store[b-yb8e1zv3gj] {
    padding: 8px 12px;
    font-weight: 600;
    background: var(--surface-readonly);
    border-bottom: 1px solid var(--rz-border-color, #e0e0e0);
}

.person[b-yb8e1zv3gj] {
    display: flex;
    align-items: center;
    gap: 8px;
    flex-wrap: wrap;
    padding: 6px 12px 6px 32px;
}

.person + .store[b-yb8e1zv3gj] { border-top: 1px solid var(--rz-border-color, #e0e0e0); }

.sub[b-yb8e1zv3gj] {
    font-size: 12px;
    color: var(--accent-gray);
}

.target[b-yb8e1zv3gj] {
    display: flex;
    align-items: flex-start;
    gap: 10px;
    padding: 10px 12px;
    cursor: pointer;
}

.target + .target[b-yb8e1zv3gj] { border-top: 1px solid var(--rz-border-color, #e0e0e0); }

.target:hover[b-yb8e1zv3gj] { background: var(--surface-readonly); }

.target.on[b-yb8e1zv3gj] { background: color-mix(in srgb, var(--accent-blue) 10%, transparent); }

.target input[b-yb8e1zv3gj] { margin-top: 3px; }

.t-text[b-yb8e1zv3gj] {
    display: flex;
    flex-direction: column;
    gap: 2px;
}

.t-head[b-yb8e1zv3gj] { font-weight: 600; }

.empty[b-yb8e1zv3gj] {
    padding: 12px;
    color: var(--accent-gray);
}

.actions[b-yb8e1zv3gj] {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: 8px;
    flex-wrap: wrap;
}

.count[b-yb8e1zv3gj] {
    margin-inline-end: auto;
    font-size: 12px;
    color: var(--accent-gray);
}

.spacer[b-yb8e1zv3gj] { margin-inline-end: auto; }
/* /Components/Modules/Reviews/ToEvaluate_DialogSkip.razor.rz.scp.css */
.dlg[b-t6g5zhaqtk] {
    display: flex;
    flex-direction: column;
    gap: 12px;
}

.lead[b-t6g5zhaqtk] {
    margin: 0;
    font-size: 13.5px;
    color: var(--text-color);
}

.req[b-t6g5zhaqtk] { color: var(--accent-red); }

/*Pulled up to the field, it reads as its counter*/
.count[b-t6g5zhaqtk] {
    margin-top: -6px;
    font-size: 12px;
    color: var(--accent-gray);
}

.count.ok[b-t6g5zhaqtk] { color: var(--accent-green); }

.actions[b-t6g5zhaqtk] {
    display: flex;
    justify-content: flex-end;
    gap: 8px;
}
/* /Components/Modules/Reviews/ToEvaluate_Group.razor.rz.scp.css */
/*Column widths come from ToEvaluate.razor.css as variables*/

/*State, draft and deadline are up to three chips - they wrap instead of ellipsing away in the longer
  languages - the nowrap sits on Radzen's own .rz-cell-data wrapper, so the cell itself is not enough*/
.group[b-mrk38ct9k2]  .c-status .rz-cell-data {
    white-space: normal;
}

@media (max-width: 1399.98px) {
    /*Collapsed to nothing rather than display:none - a hidden cell shifts the row off its <col> widths*/
    .group[b-mrk38ct9k2]  .c-sent {
        padding: 0 !important;
        visibility: hidden;
        overflow: hidden;
    }
}

.mono[b-mrk38ct9k2] {
    font-size: 12px;
    color: var(--accent-gray);
}

.emp-name[b-mrk38ct9k2] { font-weight: 600; }

.emp-sub[b-mrk38ct9k2] {
    font-size: 12px;
    color: var(--accent-gray);
}

.emp-store[b-mrk38ct9k2] {
    font-size: 12px;
    color: var(--accent-blue);
    font-weight: 600;
}

/*Who is responsible for a row reached through the position - amber, so it does not read as the blue store line*/
.emp-resp[b-mrk38ct9k2] {
    display: flex;
    align-items: center;
    gap: 4px;
    font-size: 12px;
    font-weight: 600;
    color: var(--accent-amber);
}

/*Where a delegated row came from - quieter than the responsible line, it is only background*/
.emp-from[b-mrk38ct9k2] {
    display: flex;
    align-items: center;
    gap: 4px;
    font-size: 12px;
    color: var(--accent-gray);
}

/*One line in the grid, the full reason sits in the tooltip - the phone card lets it wrap*/
.emp-skip[b-mrk38ct9k2] {
    font-size: 12px;
    font-style: italic;
    color: var(--accent-gray);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.pcard .emp-skip[b-mrk38ct9k2] { white-space: normal; }

.cards[b-mrk38ct9k2] { display: none; }

.pcard[b-mrk38ct9k2] {
    display: flex;
    flex-direction: column;
    gap: 6px;
    padding: 14px 12px;
}

.pcard + .pcard[b-mrk38ct9k2] { border-top: 1px solid var(--rz-border-color, #e0e0e0); }

.pcard-state[b-mrk38ct9k2] {
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
    margin-top: 2px;
}

.pcard-sent[b-mrk38ct9k2] {
    font-size: 12px;
    color: var(--accent-gray);
}

/*The buttons sit on their own line and start where the text does*/
.pcard-act[b-mrk38ct9k2] {
    margin-top: 4px;
}

.pcard-act[b-mrk38ct9k2]  .act {
    justify-content: flex-start;
}

/*Phone - a fixed-layout table cannot reflow, so the grid gives way to the cards*/
@media (max-width: 639.98px) {
    .group[b-mrk38ct9k2]  .rz-data-grid {
        display: none;
    }

    .cards[b-mrk38ct9k2] {
        display: block;
    }
}
/* /Components/Pages/Home.razor.rz.scp.css */
/*Signed in with no roles - deliberately muted, this is a state and not an error*/
.no-access[b-55rp2l7jjx] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    height: 70vh;
    text-align: center;
    padding: 0 1rem;
    color: var(--text-color);
}

.no-access i[b-55rp2l7jjx] {
    font-size: 2.75rem;
    color: var(--accent-gray);
    margin-bottom: .75rem;
}

.no-access h4[b-55rp2l7jjx] {
    margin-bottom: .5rem;
}

.no-access p[b-55rp2l7jjx] {
    max-width: 46ch;
    margin: 0;
    color: var(--accent-gray);
    line-height: 1.55;
}

.no-access .no-access-help[b-55rp2l7jjx] {
    margin-top: .9rem;
    padding: .7rem 1rem;
    font-size: .9rem;
    background: var(--surface-readonly);
    border: 1px solid var(--surface-readonly-border);
    border-radius: 8px;
}
/* /Components/Pages/Login.razor.rz.scp.css */
.login-title[b-423pxwto9d] {
    margin: 0 0 22px;
    font-size: 20px;
    font-weight: 700;
    text-align: center;
    color: var(--text-color);
}

.login-intro[b-423pxwto9d] {
    margin: 0 0 22px;
    font-size: 13px;
    line-height: 1.5;
    text-align: center;
    color: var(--text-color);
    opacity: .7;
}

.btn-gate[b-423pxwto9d] {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    width: 100%;
    padding: 11px 16px;
    border: 1px solid transparent;
    border-radius: 6px;
    font-size: 14px;
    font-weight: 600;
    cursor: pointer;
    text-decoration: none;
}

/*In dark mode both buttons become a dark plate with a coloured border - in light the border falls back to the fill*/
.btn-entra[b-423pxwto9d] {
    background: var(--button-brandblue-bg);
    border-color: var(--button-brandblue-border, var(--button-brandblue-bg));
    color: var(--button-brandblue-text);
}

.btn-ks[b-423pxwto9d] {
    margin-top: 20px;
    background: var(--button-emerald-bg);
    border-color: var(--button-emerald-border, var(--button-emerald-bg));
    color: var(--button-emerald-text);
}

.btn-gate:hover[b-423pxwto9d] {
    filter: brightness(1.08);
}

.gate-separator[b-423pxwto9d] {
    display: flex;
    align-items: center;
    gap: 12px;
    margin: 18px 0;
    font-size: 12px;
    color: var(--text-color);
    opacity: .55;
}

.gate-separator[b-423pxwto9d]::before,
.gate-separator[b-423pxwto9d]::after {
    content: "";
    flex: 1 1 auto;
    min-width: 20px;
    height: 1px;
    background: var(--rz-border-color, rgba(0, 0, 0, .18));
}

.dark-theme .gate-separator[b-423pxwto9d]::before,
.dark-theme .gate-separator[b-423pxwto9d]::after {
    background: rgba(255, 255, 255, .12);
}

.field[b-423pxwto9d] {
    margin-bottom: 14px;
}

.field label[b-423pxwto9d] {
    display: block;
    margin-bottom: 5px;
    font-size: 13px;
    font-weight: 600;
    color: var(--text-color);
}

/*InputText is a component, so its <input> never gets the scope attribute - without ::deep these rules would not reach it*/
.field[b-423pxwto9d]  input {
    display: block;
    width: 100%;
    box-sizing: border-box;
    padding: 11px 12px;
    border: 1px solid var(--rz-border-color, rgba(0, 0, 0, .18));
    border-radius: 6px;
    background: var(--modal-bg);
    color: var(--text-color);
    font-size: 14px;
    outline: none;
}

.field[b-423pxwto9d]  input:focus {
    border-color: var(--button-brandblue-bg);
    box-shadow: 0 0 0 3px rgba(0, 92, 169, .18);
}

/*Dark mode separates a field by making it darker, not by outlining - a bright border would pull more attention than the buttons*/
.dark-theme .field[b-423pxwto9d]  input {
    background: var(--bg-main);
    border-color: rgba(255, 255, 255, .13);
}

.dark-theme .field[b-423pxwto9d]  input:focus {
    border-color: var(--button-brandblue-border);
    box-shadow: 0 0 0 3px rgba(74, 171, 239, .18);
}

/*The invalid class comes from Blazor validation - in dark --button-red-bg flips to a dark plate, so the foreground red is used*/
.field[b-423pxwto9d]  input.invalid {
    border-color: var(--button-red-bg);
    background: color-mix(in srgb, var(--button-red-bg) 5%, var(--modal-bg));
}

.field[b-423pxwto9d]  input.invalid:focus {
    box-shadow: 0 0 0 3px color-mix(in srgb, var(--button-red-bg) 25%, transparent);
}

.dark-theme .field[b-423pxwto9d]  input.invalid {
    border-color: var(--accent-red);
    background: color-mix(in srgb, var(--accent-red) 10%, var(--modal-bg));
}

.dark-theme .field[b-423pxwto9d]  input.invalid:focus {
    box-shadow: 0 0 0 3px color-mix(in srgb, var(--accent-red) 25%, transparent);
}

.field-hint[b-423pxwto9d] {
    margin: 5px 0 0;
    font-size: 12px;
    color: var(--text-color);
    opacity: .6;
}

.login-error[b-423pxwto9d] {
    display: flex;
    align-items: flex-start;
    gap: 8px;
    margin-bottom: 16px;
    padding: 10px 12px;
    border: 1px solid color-mix(in srgb, var(--button-red-bg) 45%, transparent);
    border-radius: 6px;
    font-size: 13px;
    /*Text keeps the darker accent - the vivid red is hard to read on its own tint*/
    color: var(--accent-red);
    background: color-mix(in srgb, var(--button-red-bg) 10%, var(--modal-bg));
}

.dark-theme .login-error[b-423pxwto9d] {
    border-color: color-mix(in srgb, var(--accent-red) 45%, transparent);
    background: color-mix(in srgb, var(--accent-red) 12%, var(--modal-bg));
}
/* /Components/Pages/NotFound.razor.rz.scp.css */
.notfound[b-veixph4iue] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 3rem 0;
    text-align: center;
}

.notfound-icon[b-veixph4iue] {
    font-size: 2.5rem;
    color: #e0a800;
}

.notfound-title[b-veixph4iue] {
    margin: 1rem 0 0.25rem;
}

.notfound-message[b-veixph4iue] {
    margin-bottom: 1rem;
    font-size: 0.85rem;
    color: var(--text-color);
    opacity: 0.7;
}
/* /Components/Pages/UserClaims.razor.rz.scp.css */
li[b-o51xhff2xz] {
    overflow-wrap: break-word;
    word-break: break-word;
}
