@import '_content/Bpsc.Blazor.Components/Bpsc.Blazor.Components.6zgvzofpz1.bundle.scp.css';
@import '_content/Microsoft.FluentUI.AspNetCore.Components/Microsoft.FluentUI.AspNetCore.Components.b6pgxrrsua.bundle.scp.css';

/* _content/Bpsc.Id/Components/Dialogs/ApplicationEditorDialog.razor.rz.scp.css */
[b-s3ph1jqkr5] .fluent-autocomplete-multiselect .auto-height
{
    width: 100% !important;
}
/* _content/Bpsc.Id/Components/Dialogs/ScopeEditorDialog.razor.rz.scp.css */
[b-t4na5wak9s] .fluent-autocomplete-multiselect .auto-height
{
    width: 100% !important;
}
/* _content/Bpsc.Id/Components/Dialogs/Select2FAMethodDialog.razor.rz.scp.css */
[b-8i6d753h7u] fluent-radio[checked]
{
    background-color: var(--neutral-layer-2);
}

[b-8i6d753h7u] fluent-radio::part(control)
{
    width: fit-content;
    height: fit-content;
}
/* _content/Bpsc.Id/Components/Dialogs/SelectApplicationTemplateDialog.razor.rz.scp.css */
[b-4v9a5n9tih] fluent-radio[checked]
{
    background-color: var(--neutral-layer-2);
}

[b-4v9a5n9tih] fluent-radio::part(control)
{
    width: fit-content;
    height: fit-content;
}
/* _content/Bpsc.Id/Components/Dialogs/SetupAuthenticatorDialog.razor.rz.scp.css */
[b-467utvgxdu] .fluent-wizard
{
    --fluent-wizard-circle-size: 40px !important;
    --fluent-wizard-spacing: 8px !important;
    
    ol
    {
        padding-bottom: 20px !important;
    }
}

[b-467utvgxdu] .fluent-wizard-buttons
{
    gap: 8px;


    @media screen and (max-width: 600px)
    {
        flex-direction: column-reverse;[b-467utvgxdu]
    }

    span
    {
        display: none;
    }
}   

[b-467utvgxdu] .fluent-wizard-buttons > fluent-button
{
    width: unset !important;
}

[b-467utvgxdu] .fluent-wizard li[status="current"] svg
{
    fill: var(--neutral-foreground-rest) !important;
}

[b-467utvgxdu] .fluent-wizard li[status="previous"] svg
{
    fill: var(--success) !important;
}

[b-467utvgxdu] .fluent-wizard .fluent-wizard-icon-number[status='next']:not([disabled])
{
    color: var(--neutral-foreground-rest) !important;
}

[b-467utvgxdu] .fluent-wizard-icon
{
    position: relative;
    display: flex;
    justify-content: center;
}

[b-467utvgxdu] .fluent-wizard-icon svg
{
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    fill: var(--neutral-stroke-rest) !important;
}

[b-467utvgxdu] .fluent-wizard-icon-number
{
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    margin-top: 0 !important;
}

[b-467utvgxdu] .e-barcode
{
    padding: 4px;
    background-color: var(--neutral-layer-floating);
    border-width: calc(var(--stroke-width) * 1px);
    border-color: var(--neutral-stroke-rest);
    border-radius: 8px;
}
/* _content/Bpsc.Id/Components/Dialogs/SetupEmail2FADialog.razor.rz.scp.css */
[b-qavf0o6fzs] .fluent-wizard
{
    --fluent-wizard-circle-size: 40px !important;
    --fluent-wizard-spacing: 8px !important;
    
    ol
    {
        padding-bottom: 20px !important;
    }
}

[b-qavf0o6fzs] .fluent-wizard-buttons
{
    gap: 8px;


    @media screen and (max-width: 600px)
    {
        flex-direction: column-reverse;[b-qavf0o6fzs]
    }

    span
    {
        display: none;
    }
}   

[b-qavf0o6fzs] .fluent-wizard-buttons > fluent-button
{
    width: unset !important;
}

[b-qavf0o6fzs] .fluent-wizard li[status="current"] svg
{
    fill: var(--neutral-foreground-rest) !important;
}

[b-qavf0o6fzs] .fluent-wizard li[status="previous"] svg
{
    fill: var(--success) !important;
}

[b-qavf0o6fzs] .fluent-wizard .fluent-wizard-icon-number[status='next']:not([disabled])
{
    color: var(--neutral-foreground-rest) !important;
}

[b-qavf0o6fzs] .fluent-wizard-icon
{
    position: relative;
    display: flex;
    justify-content: center;
}

[b-qavf0o6fzs] .fluent-wizard-icon svg
{
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    fill: var(--neutral-stroke-rest) !important;
}

[b-qavf0o6fzs] .fluent-wizard-icon-number
{
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    margin-top: 0 !important;
}

[b-qavf0o6fzs] .e-barcode
{
    padding: 4px;
    background-color: var(--neutral-layer-floating);
    border-width: calc(var(--stroke-width) * 1px);
    border-color: var(--neutral-stroke-rest);
    border-radius: 8px;
}
/* _content/Bpsc.Id/Components/Layout/AuthLayout.razor.rz.scp.css */
/* Fix for labels to make them white */
[b-k0s5rb00eb] .fluent-input-label, [b-k0s5rb00eb] fluent-checkbox::part(label)
{
    color: inherit;
}

[b-k0s5rb00eb] .validation-message
{
    color: #F1BBBC;
}

/* Blazor default */
#blazor-error-ui[b-k0s5rb00eb] {
    background: lightyellow;
    bottom: 0;
    box-shadow: 0 -1px 2px rgba(0, 0, 0, 0.2);
    display: none;
    left: 0;
    padding: 0.6rem 1.25rem 0.7rem 1.25rem;
    position: fixed;
    width: 100%;
    z-index: 1000;
}

    #blazor-error-ui .dismiss[b-k0s5rb00eb] {
        cursor: pointer;
        position: absolute;
        right: 0.75rem;
        top: 0.5rem;
    }
/* _content/Bpsc.Id/Components/Layout/BackgroundDesign.razor.rz.scp.css */
/**
 * https://developer.mozilla.org/en-US/docs/Web/CSS/background
 * CSS code for the background layout component.
 *
 * The `.background` class is used to style the background element.
 * It sets the background image, position, and z-index.
 * The background image is set using CSS variables `--background-image`, `--engineer-image`, and `--dots-image`.
 *
 * The media query `@media (width >= 1100px)` applies additional styles to the `.background` class
 * when the viewport width is greater than or equal to 1100 pixels.
 * It sets multiple background images using CSS variables and adjusts their positioning and size.
 * https://squoosh.app/ - app used to convert images to webp format
 */
.background[b-q7q59zjxzx] {
    --background-image: url('assets/background.webp');
    --engineer-image: url('assets/arrow.webp');
    --dots-image: url('assets/dots.svg');

    position: fixed;
    /* inset is not supported in our xamarin apps */
    /* inset: 0; */
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;

    z-index: -1;

    background: var(--background-image) no-repeat center / cover;
}

@media (width >= 1024px){
    .background[b-q7q59zjxzx] {
        background:
            var(--dots-image) no-repeat left 5% bottom 5% / 130px,
            var(--engineer-image) no-repeat top -30px right -30px / min(1920px, 55vw),
            var(--background-image) no-repeat center / cover;
    }
}
/* _content/Bpsc.Id/Components/Layout/NavMenu.razor.rz.scp.css */
[b-ete35j59c1] .positioning-region {
    color: var(--neutral-foreground-rest);
}

[b-ete35j59c1] .active > .positioning-region::before {
    content: "";
    display: block;
    position: absolute;
    right: unset;
    background: var(--accent-fill-rest);
    width: 2px !important;
    height: 100% !important;
    margin: 0 !important;
}

[b-ete35j59c1] .active > .positioning-region {
    color: var(--accent-fill-rest);
    border-radius: calc(var(--control-corner-radius) * 1px);
    background-color: var(--neutral-fill-secondary-rest) !important;
}

[b-ete35j59c1] .active .fluent-nav-icon {
    fill: var(--accent-fill-rest) !important;
}

[b-ete35j59c1] span.fluent-nav-icon {
    display: none;
}

[b-ete35j59c1] .fluent-nav-group:has(.active) > .fluent-nav-link .fluent-nav-icon,
[b-ete35j59c1] .fluent-nav-group:has(.active) > .fluent-nav-link .fluent-nav-text {
    fill: var(--accent-fill-rest) !important;
    color: var(--accent-fill-rest) !important;
}
/* _content/Bpsc.Id/Components/Pages/Authentication/SignIn.razor.rz.scp.css */
[b-90tr6b4qkh] fluent-checkbox::part(control)
{
    width: fit-content;
    height: fit-content;
}
/* _content/Bpsc.Id/Components/Pages/Authentication/SignInWith2fa.razor.rz.scp.css */
[b-z04fh1d5xa] fluent-checkbox::part(control)
{
    width: fit-content;
    height: fit-content;
}