@import '_content/QuantumERP.AccountSettingsUI/QuantumERP.AccountSettingsUI.p8ad23kvbd.bundle.scp.css';
@import '_content/QuantumERP.ApplicationAccountUI/QuantumERP.ApplicationAccountUI.lv88eac13m.bundle.scp.css';
@import '_content/QuantumERP.GeneralSettingUI/QuantumERP.GeneralSettingUI.l52egqtr45.bundle.scp.css';
@import '_content/QuantumERP.HRUI/QuantumERP.HRUI.h3tfsmjrx5.bundle.scp.css';
@import '_content/QuantumERP.InventoryUI/QuantumERP.InventoryUI.3am49poahl.bundle.scp.css';
@import '_content/QuantumERP.LightSharedUI/QuantumERP.LightSharedUI.pw1d23itxs.bundle.scp.css';
@import '_content/QuantumERP.POSUI/QuantumERP.POSUI.qbpj4bmyes.bundle.scp.css';
@import '_content/QuantumERP.ReportsUI/QuantumERP.ReportsUI.gh2uf18nj0.bundle.scp.css';
@import '_content/QuantumERP.SharedUI/QuantumERP.SharedUI.uoqoqauv99.bundle.scp.css';

/* /App.razor.rz.scp.css */
:root[b-kdb40f37zs] {
    --route-primary: #00a59e;
    --route-primary-dark: #087f79;
    --route-navy: #102f43;
    --route-text: #294c59;
    --route-muted: #71858f;
    --route-border: #dfeaec;
    --route-surface: rgba(255, 255, 255, 0.94);
    --route-error: #d3485a;
    --route-warning: #d58b00;
}

.route-state-page[b-kdb40f37zs],
.route-state-page *[b-kdb40f37zs],
.route-state-page *[b-kdb40f37zs]::before,
.route-state-page *[b-kdb40f37zs]::after {
    box-sizing: border-box;
}

/* =========================================================
   Page
   ========================================================= */

.route-state-page[b-kdb40f37zs] {
    position: fixed;
    inset: 0;
    z-index: 2147483000;
    isolation: isolate;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 100vw;
    max-width: 100vw;
    min-width: 0;
    height: 100vh;
    min-height: 100vh;
    margin: 0;
    padding: max(24px, env(safe-area-inset-top)) max(24px, env(safe-area-inset-right)) max(24px, env(safe-area-inset-bottom)) max(24px, env(safe-area-inset-left));
    overflow-x: hidden;
    overflow-y: auto;
    overscroll-behavior: contain;
    color: var(--route-text);
    background: radial-gradient( circle at 100% 0%, rgba(82, 204, 198, 0.19) 0, rgba(82, 204, 198, 0.07) 18%, transparent 41% ), radial-gradient( circle at 0% 100%, rgba(16, 47, 67, 0.11) 0, rgba(16, 47, 67, 0.04) 21%, transparent 42% ), linear-gradient( 145deg, #f8fbfd 0%, #eef5f7 52%, #e8f1f4 100% );
    animation: route-page-fade-in-b-kdb40f37zs 180ms ease-out both;
}

@supports (height: 100dvh) {
    .route-state-page[b-kdb40f37zs] {
        height: 100dvh;
        min-height: 100dvh;
    }
}

.route-state-page[b-kdb40f37zs]::before {
    content: "";
    position: absolute;
    top: -180px;
    inset-inline-end: -150px;
    z-index: -1;
    width: 440px;
    height: 440px;
    pointer-events: none;
    border: 1px solid rgba(82, 204, 198, 0.17);
    border-radius: 50%;
    box-shadow: inset 0 0 0 35px rgba(82, 204, 198, 0.025), inset 0 0 0 70px rgba(82, 204, 198, 0.018);
}

.route-state-page[b-kdb40f37zs]::after {
    content: "";
    position: absolute;
    top: 42%;
    inset-inline-start: -105px;
    z-index: -1;
    width: 210px;
    height: 210px;
    pointer-events: none;
    border: 1px solid rgba(16, 47, 67, 0.10);
    border-radius: 50%;
    box-shadow: inset 0 0 0 24px rgba(82, 204, 198, 0.024);
}

/* =========================================================
   Common card
   ========================================================= */

.route-state-card[b-kdb40f37zs] {
    position: relative;
    z-index: 2;
    width: min(100%, 590px);
    max-width: 100%;
    min-width: 0;
    margin: auto;
    padding: 42px;
    overflow: hidden;
    color: var(--route-text);
    background: var(--route-surface);
    border: 1px solid rgba(214, 229, 233, 0.95);
    border-radius: 24px;
    box-shadow: 0 30px 70px rgba(16, 47, 67, 0.12), 0 8px 22px rgba(16, 47, 67, 0.06), inset 0 1px 0 rgba(255, 255, 255, 0.95);
    backdrop-filter: blur(18px);
    -webkit-backdrop-filter: blur(18px);
    animation: route-card-enter-b-kdb40f37zs 280ms cubic-bezier(0.22, 1, 0.36, 1) both;
}

    .route-state-card[b-kdb40f37zs]::before {
        content: "";
        position: absolute;
        top: 0;
        bottom: 0;
        inset-inline-start: 0;
        width: 5px;
        background: linear-gradient( 180deg, var(--route-navy) 0%, var(--route-primary) 50%, #52ccc6 100% );
    }

    .route-state-card[b-kdb40f37zs]::after {
        content: "";
        position: absolute;
        top: -100px;
        inset-inline-end: -100px;
        width: 240px;
        height: 240px;
        pointer-events: none;
        background: radial-gradient( circle, rgba(82, 204, 198, 0.10), transparent 68% );
        border-radius: 50%;
    }

.route-state-badge[b-kdb40f37zs] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 7px;
    width: fit-content;
    min-height: 30px;
    margin: 0 0 15px;
    padding: 5px 12px;
    color: var(--route-primary-dark);
    background: linear-gradient(135deg, #e4f8ef, #effbf7);
    border: 1px solid rgba(8, 125, 82, 0.14);
    border-radius: 999px;
    font-size: clamp(0.7rem, 1.8vw, 0.8rem);
    font-weight: 800;
    line-height: 1.3;
    white-space: nowrap;
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.75);
}

    .route-state-badge i[b-kdb40f37zs] {
        display: inline-flex;
        align-items: center;
        justify-content: center;
        font-size: 0.95rem;
        line-height: 1;
    }

    .route-state-badge.error[b-kdb40f37zs] {
        color: var(--route-error);
        background: rgba(211, 72, 90, 0.08);
        border-color: rgba(211, 72, 90, 0.20);
    }

    .route-state-badge.warning[b-kdb40f37zs] {
        color: #956100;
        background: rgba(255, 190, 50, 0.12);
        border-color: rgba(213, 139, 0, 0.22);
    }

.state-title[b-kdb40f37zs] {
    margin: 0;
    color: var(--route-navy);
    font-size: clamp(25px, 4vw, 34px);
    font-weight: 900;
    line-height: 1.35;
    overflow-wrap: anywhere;
}

.state-description[b-kdb40f37zs] {
    max-width: 500px;
    margin: 12px auto 0;
    color: var(--route-muted);
    font-size: 14px;
    line-height: 1.9;
    overflow-wrap: anywhere;
}

/* =========================================================
   Loading state
   ========================================================= */

.loading-card[b-kdb40f37zs] {
    display: grid;
    grid-template-columns: minmax(115px, 150px) minmax(0, 1fr);
    align-items: center;
    gap: 34px;
    width: min(100%, 680px);
    text-align: start;
}

.loading-visual[b-kdb40f37zs] {
    position: relative;
    z-index: 2;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 100%;
    min-width: 0;
}

.loading-spinner[b-kdb40f37zs] {
    position: relative;
    display: grid;
    place-items: center;
    width: 118px;
    height: 118px;
    flex: 0 0 auto;
}

.loading-spinner__outer[b-kdb40f37zs],
.loading-spinner__inner[b-kdb40f37zs] {
    position: absolute;
    display: block;
    border-style: solid;
    border-radius: 50%;
}

.loading-spinner__outer[b-kdb40f37zs] {
    inset: 0;
    border-width: 4px;
    border-color: rgba(0, 165, 158, 0.13);
    border-top-color: var(--route-primary);
    border-inline-end-color: #52ccc6;
    box-shadow: 0 0 20px rgba(82, 204, 198, 0.08);
    animation: route-spin-b-kdb40f37zs 1.05s linear infinite;
}

.loading-spinner__inner[b-kdb40f37zs] {
    inset: 14px;
    border-width: 3px;
    border-color: rgba(16, 47, 67, 0.10);
    border-bottom-color: var(--route-navy);
    border-inline-start-color: var(--route-primary);
    animation: route-spin-reverse-b-kdb40f37zs 1.35s linear infinite;
}

.loading-spinner__icon[b-kdb40f37zs] {
    position: relative;
    z-index: 3;
    display: grid;
    place-items: center;
    width: 65px;
    height: 65px;
    color: #ffffff;
    font-size: 27px;
    background: linear-gradient( 145deg, var(--route-navy) 0%, #06437d 45%, var(--route-primary) 100% );
    border: 1px solid rgba(255, 255, 255, 0.18);
    border-radius: 19px;
    box-shadow: 0 14px 30px rgba(0, 165, 158, 0.24), inset 0 1px 0 rgba(255, 255, 255, 0.19);
    animation: route-icon-pulse-b-kdb40f37zs 1.7s ease-in-out infinite;
}

    .loading-spinner__icon i[b-kdb40f37zs] {
        display: inline-flex;
        align-items: center;
        justify-content: center;
        line-height: 1;
    }

.route-state-content[b-kdb40f37zs] {
    position: relative;
    z-index: 2;
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    width: 100%;
    max-width: 100%;
    min-width: 0;
    text-align: start;
}

    .route-state-content h2[b-kdb40f37zs] {
        width: 100%;
        max-width: 100%;
        margin: 0 0 11px;
        color: var(--route-navy);
        font-size: clamp(24px, 3vw, 31px);
        font-weight: 900;
        line-height: 1.35;
        overflow-wrap: anywhere;
    }

    .route-state-content > p[b-kdb40f37zs] {
        width: 100%;
        max-width: 590px;
        margin: 0;
        color: var(--route-muted);
        font-size: 14px;
        line-height: 1.8;
        overflow-wrap: anywhere;
    }

.loading-progress[b-kdb40f37zs] {
    position: relative;
    width: 100%;
    max-width: 100%;
    height: 8px;
    margin: 22px 0 0;
    overflow: hidden;
    background: linear-gradient(180deg, #e2eaf1, #edf2f6);
    border: 1px solid rgba(16, 47, 67, 0.04);
    border-radius: 999px;
    box-shadow: inset 0 1px 3px rgba(16, 47, 67, 0.06);
}

    .loading-progress > span[b-kdb40f37zs] {
        position: absolute;
        inset-block: 0;
        inset-inline-start: -43%;
        display: block;
        width: 43%;
        height: 100%;
        background: linear-gradient( 90deg, var(--route-primary-dark) 0%, #1bc6bd 50%, var(--route-primary-dark) 100% );
        border-radius: inherit;
        box-shadow: 0 0 14px rgba(0, 165, 158, 0.32);
        animation: route-progress-b-kdb40f37zs 1.4s ease-in-out infinite;
    }

.loading-note[b-kdb40f37zs] {
    display: flex;
    align-items: flex-start;
    justify-content: flex-start;
    gap: 7px;
    width: 100%;
    margin: 12px 0 0;
    color: #81939b;
    font-size: 11px;
    line-height: 1.65;
    text-align: start;
    overflow-wrap: anywhere;
}

    .loading-note i[b-kdb40f37zs] {
        margin-top: 3px;
        flex: 0 0 auto;
        color: var(--route-primary);
    }

/* =========================================================
   Error and Not Found states
   ========================================================= */

.error-card[b-kdb40f37zs],
.notfound-card[b-kdb40f37zs] {
    text-align: center;
}

.state-icon[b-kdb40f37zs] {
    display: grid;
    place-items: center;
    width: 78px;
    height: 78px;
    margin: 0 auto 16px;
    border-radius: 23px;
    font-size: 34px;
}

.error-icon[b-kdb40f37zs] {
    color: var(--route-error);
    background: rgba(211, 72, 90, 0.10);
    box-shadow: 0 12px 25px rgba(211, 72, 90, 0.12);
}

.notfound-icon[b-kdb40f37zs] {
    color: var(--route-primary-dark);
    background: rgba(0, 165, 158, 0.10);
    box-shadow: 0 12px 25px rgba(0, 165, 158, 0.12);
}

.error-message-box[b-kdb40f37zs] {
    display: flex;
    align-items: flex-start;
    gap: 9px;
    margin-top: 20px;
    padding: 12px 14px;
    color: #91404d;
    background: rgba(211, 72, 90, 0.06);
    border: 1px solid rgba(211, 72, 90, 0.18);
    border-radius: 12px;
    font-size: 12px;
    line-height: 1.65;
    text-align: start;
    overflow-wrap: anywhere;
}

    .error-message-box i[b-kdb40f37zs] {
        margin-top: 2px;
        flex: 0 0 auto;
        color: var(--route-error);
    }

.notfound-code[b-kdb40f37zs] {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 11px;
    margin: 2px 0 8px;
    font-size: clamp(70px, 14vw, 105px);
    font-weight: 950;
    line-height: 1;
    letter-spacing: -8px;
}

    .notfound-code > span:not(.notfound-code-icon)[b-kdb40f37zs] {
        color: transparent;
        background: linear-gradient(145deg, var(--route-navy), var(--route-primary));
        background-clip: text;
        -webkit-background-clip: text;
    }

.notfound-code-icon[b-kdb40f37zs] {
    display: grid;
    place-items: center;
    width: 66px;
    height: 66px;
    margin-inline: 4px;
    color: var(--route-primary-dark);
    background: #ffffff;
    border: 6px solid #e7f4f3;
    border-radius: 50%;
    font-size: 27px;
    letter-spacing: 0;
    box-shadow: 0 10px 25px rgba(16, 47, 67, 0.10);
}

.notfound-decoration[b-kdb40f37zs] {
    position: absolute;
    pointer-events: none;
    border-radius: 50%;
}

.decoration-one[b-kdb40f37zs] {
    top: -52px;
    inset-inline-end: -52px;
    width: 125px;
    height: 125px;
    background: rgba(0, 165, 158, 0.07);
}

.decoration-two[b-kdb40f37zs] {
    bottom: -37px;
    inset-inline-start: -37px;
    width: 90px;
    height: 90px;
    background: rgba(16, 47, 67, 0.05);
}

/* =========================================================
   Actions
   ========================================================= */

.state-actions[b-kdb40f37zs] {
    display: flex;
    align-items: center;
    justify-content: center;
    flex-wrap: wrap;
    gap: 10px;
    margin-top: 25px;
}

.state-button[b-kdb40f37zs] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 7px;
    min-height: 43px;
    padding: 9px 17px;
    border: 1px solid transparent;
    border-radius: 11px;
    font-family: inherit;
    font-size: 13px;
    font-weight: 800;
    text-decoration: none;
    cursor: pointer;
    transition: transform 0.18s ease, box-shadow 0.18s ease, border-color 0.18s ease, background-color 0.18s ease;
}

    .state-button:hover[b-kdb40f37zs] {
        transform: translateY(-2px);
    }

.state-button-primary[b-kdb40f37zs] {
    color: #ffffff;
    background: linear-gradient(135deg, var(--route-primary-dark), var(--route-primary));
    border-color: var(--route-primary);
    box-shadow: 0 9px 20px rgba(0, 165, 158, 0.20);
}

    .state-button-primary:hover[b-kdb40f37zs] {
        color: #ffffff;
        box-shadow: 0 12px 26px rgba(0, 165, 158, 0.28);
    }

.state-button-secondary[b-kdb40f37zs] {
    color: #425e6a;
    background: #ffffff;
    border-color: #d7e3e7;
}

    .state-button-secondary:hover[b-kdb40f37zs] {
        color: var(--route-navy);
        background: #f8fbfc;
        border-color: #acc8d0;
    }

.state-help[b-kdb40f37zs] {
    display: flex;
    align-items: flex-start;
    justify-content: center;
    gap: 7px;
    margin-top: 24px;
    padding-top: 17px;
    color: #84959d;
    border-top: 1px solid #e8eff1;
    font-size: 11px;
    line-height: 1.7;
}

/* =========================================================
   Responsive
   ========================================================= */

@media (max-width: 991.98px) {
    .route-state-card[b-kdb40f37zs] {
        padding: 35px;
    }

    .loading-card[b-kdb40f37zs] {
        grid-template-columns: minmax(95px, 125px) minmax(0, 1fr);
        gap: 28px;
        width: min(100%, 680px);
    }

    .loading-spinner[b-kdb40f37zs] {
        width: 108px;
        height: 108px;
    }

    .loading-spinner__inner[b-kdb40f37zs] {
        inset: 13px;
    }

    .loading-spinner__icon[b-kdb40f37zs] {
        width: 56px;
        height: 56px;
        font-size: 23px;
        border-radius: 16px;
    }
}

@media (max-width: 700px) {
    .route-state-page[b-kdb40f37zs] {
        padding: max(14px, env(safe-area-inset-top)) max(12px, env(safe-area-inset-right)) max(14px, env(safe-area-inset-bottom)) max(12px, env(safe-area-inset-left));
    }

        .route-state-page[b-kdb40f37zs]::before {
            top: -120px;
            inset-inline-end: -125px;
            width: 305px;
            height: 305px;
            box-shadow: inset 0 0 0 25px rgba(82, 204, 198, 0.022), inset 0 0 0 50px rgba(82, 204, 198, 0.015);
        }

        .route-state-page[b-kdb40f37zs]::after {
            inset-inline-start: -85px;
            width: 150px;
            height: 150px;
        }

    .route-state-card[b-kdb40f37zs] {
        width: 100%;
        max-width: 560px;
        padding: 24px 16px;
        border-radius: 18px;
        box-shadow: 0 18px 42px rgba(16, 47, 67, 0.11), 0 5px 16px rgba(16, 47, 67, 0.055), inset 0 1px 0 rgba(255, 255, 255, 0.93);
        backdrop-filter: blur(12px);
        -webkit-backdrop-filter: blur(12px);
    }

        .route-state-card[b-kdb40f37zs]::before {
            inset-inline: 0;
            top: 0;
            bottom: auto;
            width: 100%;
            height: 4px;
        }

    .loading-card[b-kdb40f37zs] {
        grid-template-columns: 1fr;
        gap: 18px;
        width: 100%;
        text-align: center;
    }

    .loading-visual[b-kdb40f37zs] {
        min-height: 92px;
    }

    .loading-spinner[b-kdb40f37zs] {
        width: 88px;
        height: 88px;
    }

    .loading-spinner__outer[b-kdb40f37zs] {
        border-width: 3px;
    }

    .loading-spinner__inner[b-kdb40f37zs] {
        inset: 11px;
        border-width: 2px;
    }

    .loading-spinner__icon[b-kdb40f37zs] {
        width: 48px;
        height: 48px;
        font-size: 21px;
        border-radius: 15px;
    }

    .route-state-content[b-kdb40f37zs] {
        align-items: center;
        text-align: center;
    }

        .route-state-content h2[b-kdb40f37zs],
        .state-title[b-kdb40f37zs] {
            font-size: clamp(21px, 7vw, 27px);
            line-height: 1.4;
        }

        .route-state-content > p[b-kdb40f37zs],
        .state-description[b-kdb40f37zs] {
            margin-top: 8px;
            font-size: 13px;
            line-height: 1.75;
            text-align: center;
        }

    .loading-progress[b-kdb40f37zs] {
        height: 6px;
        margin-top: 17px;
    }

    .loading-note[b-kdb40f37zs] {
        justify-content: center;
        margin-top: 10px;
        font-size: 10px;
        line-height: 1.6;
        text-align: center;
    }

    .state-icon[b-kdb40f37zs] {
        width: 64px;
        height: 64px;
        margin-bottom: 13px;
        border-radius: 19px;
        font-size: 28px;
    }

    .error-message-box[b-kdb40f37zs] {
        gap: 7px;
        margin-top: 16px;
        padding: 10px 11px;
        border-radius: 10px;
        font-size: 11px;
        line-height: 1.65;
    }

    .notfound-code[b-kdb40f37zs] {
        gap: 6px;
        margin-bottom: 7px;
        font-size: clamp(58px, 20vw, 82px);
        letter-spacing: -5px;
    }

    .notfound-code-icon[b-kdb40f37zs] {
        width: 50px;
        height: 50px;
        margin-inline: 2px;
        border-width: 5px;
        font-size: 21px;
    }

    .state-actions[b-kdb40f37zs] {
        flex-direction: column;
        gap: 8px;
        margin-top: 20px;
    }

    .state-button[b-kdb40f37zs] {
        width: 100%;
        min-height: 46px;
        padding: 10px 14px;
        border-radius: 10px;
        font-size: 13px;
    }

    .state-help[b-kdb40f37zs] {
        margin-top: 19px;
        padding-top: 14px;
        font-size: 10px;
        line-height: 1.65;
        text-align: center;
    }
}

@media (max-width: 390px) {
    .route-state-page[b-kdb40f37zs] {
        padding: max(10px, env(safe-area-inset-top)) max(9px, env(safe-area-inset-right)) max(10px, env(safe-area-inset-bottom)) max(9px, env(safe-area-inset-left));
    }

    .route-state-card[b-kdb40f37zs] {
        padding: 20px 13px;
        border-radius: 16px;
    }

    .loading-card[b-kdb40f37zs] {
        gap: 14px;
    }

    .loading-spinner[b-kdb40f37zs] {
        width: 78px;
        height: 78px;
    }

    .loading-spinner__inner[b-kdb40f37zs] {
        inset: 10px;
    }

    .loading-spinner__icon[b-kdb40f37zs] {
        width: 43px;
        height: 43px;
        font-size: 19px;
        border-radius: 13px;
    }

    .route-state-content h2[b-kdb40f37zs],
    .state-title[b-kdb40f37zs] {
        font-size: clamp(20px, 7.2vw, 24px);
    }

    .route-state-content > p[b-kdb40f37zs],
    .state-description[b-kdb40f37zs] {
        font-size: 12px;
    }

    .notfound-code[b-kdb40f37zs] {
        gap: 4px;
        font-size: clamp(52px, 21vw, 70px);
        letter-spacing: -4px;
    }

    .notfound-code-icon[b-kdb40f37zs] {
        width: 44px;
        height: 44px;
        border-width: 4px;
        font-size: 19px;
    }

    .state-button[b-kdb40f37zs] {
        min-height: 44px;
        font-size: 12px;
    }
}

/* Short portrait screens */

@media (max-width: 700px) and (max-height: 680px) {
    .route-state-page[b-kdb40f37zs] {
        align-items: center;
        padding: 7px 9px;
    }

    .route-state-card[b-kdb40f37zs] {
        padding: 14px 13px;
        border-radius: 15px;
    }

    .loading-card[b-kdb40f37zs] {
        gap: 9px;
    }

    .loading-visual[b-kdb40f37zs] {
        min-height: 62px;
    }

    .loading-spinner[b-kdb40f37zs] {
        width: 62px;
        height: 62px;
    }

    .loading-spinner__outer[b-kdb40f37zs] {
        border-width: 3px;
    }

    .loading-spinner__inner[b-kdb40f37zs] {
        inset: 8px;
        border-width: 2px;
    }

    .loading-spinner__icon[b-kdb40f37zs] {
        width: 35px;
        height: 35px;
        font-size: 16px;
        border-radius: 10px;
    }

    .route-state-badge[b-kdb40f37zs] {
        margin-bottom: 6px;
        padding: 4px 8px;
        font-size: 9px;
    }

    .route-state-content h2[b-kdb40f37zs],
    .state-title[b-kdb40f37zs] {
        font-size: clamp(17px, 5.7vw, 21px);
        line-height: 1.3;
    }

    .route-state-content > p[b-kdb40f37zs],
    .state-description[b-kdb40f37zs] {
        margin-top: 4px;
        font-size: 11px;
        line-height: 1.5;
    }

    .loading-progress[b-kdb40f37zs] {
        height: 5px;
        margin-top: 9px;
    }

    .loading-note[b-kdb40f37zs] {
        margin-top: 5px;
        font-size: 9px;
        line-height: 1.35;
    }

    .state-icon[b-kdb40f37zs] {
        width: 48px;
        height: 48px;
        margin-bottom: 7px;
        border-radius: 14px;
        font-size: 21px;
    }

    .error-message-box[b-kdb40f37zs] {
        margin-top: 9px;
        padding: 7px 9px;
        font-size: 9.5px;
        line-height: 1.4;
    }

    .notfound-code[b-kdb40f37zs] {
        gap: 3px;
        margin: 0 0 4px;
        font-size: clamp(47px, 16vw, 62px);
        letter-spacing: -3px;
    }

    .notfound-code-icon[b-kdb40f37zs] {
        width: 39px;
        height: 39px;
        border-width: 4px;
        font-size: 17px;
    }

    .state-actions[b-kdb40f37zs] {
        gap: 6px;
        margin-top: 10px;
    }

    .state-button[b-kdb40f37zs] {
        min-height: 38px;
        padding: 7px 11px;
        font-size: 11px;
    }

    .state-help[b-kdb40f37zs] {
        margin-top: 9px;
        padding-top: 7px;
        font-size: 9px;
        line-height: 1.35;
    }
}

/* Short landscape screens */

@media (orientation: landscape) and (max-height: 520px) {
    .route-state-page[b-kdb40f37zs] {
        align-items: center;
        padding: 6px max(14px, env(safe-area-inset-right)) 6px max(14px, env(safe-area-inset-left));
    }

    .route-state-card[b-kdb40f37zs] {
        width: min(100%, 680px);
        padding: 12px 16px;
        border-radius: 15px;
    }

    .loading-card[b-kdb40f37zs] {
        grid-template-columns: 86px minmax(0, 1fr);
        gap: 18px;
        text-align: start;
    }

    .loading-spinner[b-kdb40f37zs] {
        width: 74px;
        height: 74px;
    }

    .loading-spinner__inner[b-kdb40f37zs] {
        inset: 9px;
    }

    .loading-spinner__icon[b-kdb40f37zs] {
        width: 41px;
        height: 41px;
        font-size: 18px;
        border-radius: 12px;
    }

    .route-state-content[b-kdb40f37zs] {
        align-items: flex-start;
        text-align: start;
    }

        .route-state-content h2[b-kdb40f37zs],
        .state-title[b-kdb40f37zs] {
            font-size: 21px;
        }

        .route-state-content > p[b-kdb40f37zs],
        .state-description[b-kdb40f37zs] {
            margin-top: 5px;
            font-size: 12px;
            line-height: 1.55;
            text-align: start;
        }

    .loading-progress[b-kdb40f37zs] {
        margin-top: 11px;
    }

    .loading-note[b-kdb40f37zs] {
        justify-content: flex-start;
        margin-top: 7px;
        text-align: start;
    }

    .state-actions[b-kdb40f37zs] {
        flex-direction: row;
        margin-top: 13px;
    }

    .state-button[b-kdb40f37zs] {
        width: auto;
        min-width: 135px;
        min-height: 40px;
        padding-block: 7px;
    }
}

/* =========================================================
   Animations and accessibility
   ========================================================= */

@keyframes route-spin-b-kdb40f37zs {
    to {
        transform: rotate(360deg);
    }
}

@keyframes route-spin-reverse-b-kdb40f37zs {
    to {
        transform: rotate(-360deg);
    }
}

@keyframes route-icon-pulse-b-kdb40f37zs {
    0%, 100% {
        transform: scale(1);
    }

    50% {
        transform: scale(1.06);
    }
}

@keyframes route-progress-b-kdb40f37zs {
    0% {
        inset-inline-start: -45%;
    }

    50% {
        width: 58%;
    }

    100% {
        inset-inline-start: 105%;
    }
}

@keyframes route-page-fade-in-b-kdb40f37zs {
    from {
        opacity: 0;
    }

    to {
        opacity: 1;
    }
}

@keyframes route-card-enter-b-kdb40f37zs {
    from {
        opacity: 0;
        transform: translateY(14px) scale(0.982);
    }

    to {
        opacity: 1;
        transform: translateY(0) scale(1);
    }
}

@media (prefers-reduced-motion: reduce) {
    .route-state-page[b-kdb40f37zs],
    .route-state-card[b-kdb40f37zs],
    .loading-spinner__outer[b-kdb40f37zs],
    .loading-spinner__inner[b-kdb40f37zs],
    .loading-spinner__icon[b-kdb40f37zs],
    .loading-progress > span[b-kdb40f37zs] {
        animation: none !important;
    }

    .loading-progress > span[b-kdb40f37zs] {
        inset-inline-start: 0;
        width: 55%;
    }

    .state-button[b-kdb40f37zs] {
        transition: none;
    }
}

@media (forced-colors: active) {
    .route-state-page[b-kdb40f37zs] {
        background: Canvas;
    }

    .route-state-card[b-kdb40f37zs] {
        color: CanvasText;
        background: Canvas;
        border: 2px solid CanvasText;
        box-shadow: none;
    }

    .loading-spinner__icon[b-kdb40f37zs] {
        color: HighlightText;
        background: Highlight;
    }

    .loading-progress[b-kdb40f37zs] {
        border: 1px solid CanvasText;
    }

        .loading-progress > span[b-kdb40f37zs] {
            background: Highlight;
        }
}
/* /Pages/ForgotPassword.razor.rz.scp.css */
html[b-ff4955u7c9],
body[b-ff4955u7c9] {
    margin: 0;
    min-height: 100%;
    background: #eef1f7;
}

.q-login-page[b-ff4955u7c9] {
    min-height: 100vh;
    display: flex;
    align-items: flex-start;
    justify-content: center;
    padding: 35px 16px 20px;
    background: radial-gradient(circle at top right, rgba(18,168,157,.20), transparent 32%), linear-gradient(135deg, #eef1f7 0%, #f8fafc 100%);
}

.q-login-card[b-ff4955u7c9] {
    width: min(100%, 470px);
    background: #fff;
    border-radius: 22px;
    overflow: hidden;
    box-shadow: 0 20px 45px rgba(15, 23, 42, .16);
}

.q-login-top[b-ff4955u7c9] {
    position: relative;
    padding: 18px 22px 8px;
    display: flex;
    justify-content: center;
    align-items: center;
}

.q-lang[b-ff4955u7c9] {
    position: absolute;
    inset-inline-start: 18px;
    top: 16px;
}

.q-login-logo[b-ff4955u7c9] {
    width: 120px;
    display: block;
}

.q-login-body[b-ff4955u7c9] {
    padding: 0 42px 26px;
    text-align: center;
}

.q-login-title[b-ff4955u7c9] {
    margin: 10px 0 4px;
    color: #022964;
    font-size: 22px;
    font-weight: 900;
}

.q-login-subtitle[b-ff4955u7c9] {
    margin: 0 0 18px;
    color: #12a89d;
    font-weight: 800;
}

.q-login-form[b-ff4955u7c9] {
    width: 100%;
}

.q-field[b-ff4955u7c9] {
    height: 46px;
    margin-top: 12px;
    border: 1px solid #dbe3ee;
    border-radius: 14px;
    background: #f8fafc;
    display: flex;
    align-items: center;
    gap: 10px;
    padding-inline: 13px;
    transition: .2s ease;
}

    .q-field:focus-within[b-ff4955u7c9] {
        background: #fff;
        border-color: #12a89d;
        box-shadow: 0 0 0 4px rgba(18,168,157,.12);
    }

    .q-field > i[b-ff4955u7c9] {
        color: #12a89d;
        font-size: 17px;
    }

    .q-field .k-input[b-ff4955u7c9],
    .q-field .k-textbox[b-ff4955u7c9] {
        width: 100%;
        border: 0 !important;
        background: transparent !important;
        box-shadow: none !important;
    }

    .q-field .k-input-inner[b-ff4955u7c9] {
        height: 42px !important;
        background: transparent !important;
        font-weight: 700;
    }

.q-eye-btn[b-ff4955u7c9] {
    width: 34px;
    height: 32px;
    border: 0;
    border-radius: 10px;
    background: #eef2f7;
    color: #64748b;
    display: inline-flex;
    align-items: center;
    justify-content: center;
}

    .q-eye-btn:hover[b-ff4955u7c9] {
        background: #12a89d;
        color: #fff;
    }

.q-login-btn[b-ff4955u7c9] {
    width: 100%;
    height: 44px;
    margin-top: 18px;
    border-radius: 14px !important;
    background: #12a89d !important;
    border-color: #12a89d !important;
    font-weight: 900 !important;
}

.q-forgot-btn[b-ff4955u7c9] {
    margin-top: 12px;
    border: 0;
    background: transparent;
    color: #12a89d;
    font-weight: 800;
}

.q-register-section[b-ff4955u7c9] {
    background: #022964;
    color: #fff;
    padding: 20px 24px;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 14px;
    font-weight: 900;
}

.q-register-btn[b-ff4955u7c9] {
    border: 0;
    border-radius: 999px;
    background: #12d4c4;
    color: #fff;
    padding: 10px 22px;
    font-weight: 900;
    box-shadow: 0 8px 20px rgba(18, 212, 196, .25);
}

.q-bottom-bar[b-ff4955u7c9] {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    background: #12a89d;
}

.q-bottom-item[b-ff4955u7c9] {
    border: 0;
    background: transparent;
    color: #fff;
    padding: 12px 6px;
    min-height: 68px;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 5px;
    font-weight: 800;
    transition: .2s ease;
}

    .q-bottom-item:hover[b-ff4955u7c9] {
        background: rgba(255,255,255,.12);
    }

    .q-bottom-item i[b-ff4955u7c9] {
        font-size: 20px;
    }

.k-textbox .k-input-inner[b-ff4955u7c9],
.k-input-value-text[b-ff4955u7c9],
.k-input-md[b-ff4955u7c9],
.k-picker-md[b-ff4955u7c9] {
    height: 42px;
}

@media (max-width: 576px) {
    .q-login-page[b-ff4955u7c9] {
        padding: 14px 10px;
    }

    .q-login-card[b-ff4955u7c9] {
        border-radius: 18px;
    }

    .q-login-logo[b-ff4955u7c9] {
        width: 100px;
    }

    .q-login-body[b-ff4955u7c9] {
        padding: 0 22px 22px;
    }

    .q-register-section[b-ff4955u7c9] {
        flex-direction: column;
        gap: 10px;
        padding: 18px;
        text-align: center;
    }

    .q-bottom-item[b-ff4955u7c9] {
        font-size: 12px;
        min-height: 62px;
    }
}

.q-back-btn[b-ff4955u7c9] {
    width: 100%;
    height: 48px;
    border: 0;
    background: #022964;
    color: #fff;
    font-weight: 900;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
}
/* /Pages/Login.razor.rz.scp.css */
html[b-95a48vcqmr],
body[b-95a48vcqmr] {
    margin: 0;
    min-height: 100%;
    background: #eef1f7;
}

.q-login-page[b-95a48vcqmr] {
    min-height: 100vh;
    display: flex;
    align-items: flex-start;
    justify-content: center;
    padding: 35px 16px 20px;
    background: radial-gradient(circle at top right, rgba(18,168,157,.20), transparent 32%), linear-gradient(135deg, #eef1f7 0%, #f8fafc 100%);
}

.q-login-card[b-95a48vcqmr] {
    width: min(100%, 470px);
    background: #fff;
    border-radius: 22px;
    overflow: hidden;
    box-shadow: 0 20px 45px rgba(15, 23, 42, .16);
}

.q-login-top[b-95a48vcqmr] {
    position: relative;
    padding: 18px 22px 8px;
    display: flex;
    justify-content: center;
    align-items: center;
}

.q-lang[b-95a48vcqmr] {
    position: absolute;
    inset-inline-start: 18px;
    top: 16px;
}

.q-login-logo[b-95a48vcqmr] {
    width: 120px;
    display: block;
}

.q-login-body[b-95a48vcqmr] {
    padding: 0 42px 26px;
    text-align: center;
}

.q-login-title[b-95a48vcqmr] {
    margin: 10px 0 4px;
    color: #022964;
    font-size: 22px;
    font-weight: 900;
}

.q-login-subtitle[b-95a48vcqmr] {
    margin: 0 0 18px;
    color: #12a89d;
    font-weight: 800;
}

.q-login-form[b-95a48vcqmr] {
    width: 100%;
}

.q-field[b-95a48vcqmr] {
    height: 46px;
    margin-top: 12px;
    border: 1px solid #dbe3ee;
    border-radius: 14px;
    background: #f8fafc;
    display: flex;
    align-items: center;
    gap: 10px;
    padding-inline: 13px;
    transition: .2s ease;
}

    .q-field:focus-within[b-95a48vcqmr] {
        background: #fff;
        border-color: #12a89d;
        box-shadow: 0 0 0 4px rgba(18,168,157,.12);
    }

    .q-field > i[b-95a48vcqmr] {
        color: #12a89d;
        font-size: 17px;
    }

    .q-field .k-input[b-95a48vcqmr],
    .q-field .k-textbox[b-95a48vcqmr] {
        width: 100%;
        border: 0 !important;
        background: transparent !important;
        box-shadow: none !important;
    }

    .q-field .k-input-inner[b-95a48vcqmr] {
        height: 42px !important;
        background: transparent !important;
        font-weight: 700;
    }

.q-eye-btn[b-95a48vcqmr] {
    width: 34px;
    height: 32px;
    border: 0;
    border-radius: 10px;
    background: #eef2f7;
    color: #64748b;
    display: inline-flex;
    align-items: center;
    justify-content: center;
}

    .q-eye-btn:hover[b-95a48vcqmr] {
        background: #12a89d;
        color: #fff;
    }

.q-login-btn[b-95a48vcqmr] {
    width: 100%;
    height: 44px;
    margin-top: 18px;
    border-radius: 14px !important;
    background: #12a89d !important;
    border-color: #12a89d !important;
    font-weight: 900 !important;
}

.q-forgot-btn[b-95a48vcqmr] {
    margin-top: 12px;
    border: 0;
    background: transparent;
    color: #12a89d;
    font-weight: 800;
}

.q-register-section[b-95a48vcqmr] {
    background: #022964;
    color: #fff;
    padding: 20px 24px;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 14px;
    font-weight: 900;
}

.q-register-btn[b-95a48vcqmr] {
    border: 0;
    border-radius: 999px;
    background: #12d4c4;
    color: #fff;
    padding: 10px 22px;
    font-weight: 900;
    box-shadow: 0 8px 20px rgba(18, 212, 196, .25);
}

.q-bottom-bar[b-95a48vcqmr] {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    background: #12a89d;
}

.q-bottom-item[b-95a48vcqmr] {
    border: 0;
    background: transparent;
    color: #fff;
    padding: 12px 6px;
    min-height: 68px;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 5px;
    font-weight: 800;
    transition: .2s ease;
}

    .q-bottom-item:hover[b-95a48vcqmr] {
        background: rgba(255,255,255,.12);
    }

    .q-bottom-item i[b-95a48vcqmr] {
        font-size: 20px;
    }

.k-textbox .k-input-inner[b-95a48vcqmr],
.k-input-value-text[b-95a48vcqmr],
.k-input-md[b-95a48vcqmr],
.k-picker-md[b-95a48vcqmr] {
    height: 42px;
}

@media (max-width: 576px) {
    .q-login-page[b-95a48vcqmr] {
        padding: 14px 10px;
    }

    .q-login-card[b-95a48vcqmr] {
        border-radius: 18px;
    }

    .q-login-logo[b-95a48vcqmr] {
        width: 100px;
    }

    .q-login-body[b-95a48vcqmr] {
        padding: 0 22px 22px;
    }

    .q-register-section[b-95a48vcqmr] {
        flex-direction: column;
        gap: 10px;
        padding: 18px;
        text-align: center;
    }

    .q-bottom-item[b-95a48vcqmr] {
        font-size: 12px;
        min-height: 62px;
    }
}
/* =========================================================
       SYSTEM INFO
    ========================================================== */

.qhr-system-info[b-95a48vcqmr] {
    min-height: 82px;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 12px;
    padding: 15px 25px;
    background: linear-gradient( 135deg, #0b3b82, #082f70 );
    color: #fff;
}


.qhr-system-icon[b-95a48vcqmr] {
    width: 42px;
    height: 42px;
    flex: 0 0 42px;
    display: grid;
    place-items: center;
    border-radius: 50%;
    background: rgba(20,199,194,.15);
    color: #3be1db;
}


.qhr-system-info > div[b-95a48vcqmr] {
    display: flex;
    flex-direction: column;
    min-width: 0;
}


.qhr-system-info b[b-95a48vcqmr] {
    font-size: .72rem;
    font-weight: 800;
}


.qhr-system-info span:not(.qhr-system-icon)[b-95a48vcqmr] {
    margin-top: 3px;
    color: rgba(255,255,255,.72);
    font-size: .59rem;
    line-height: 1.6;
}


/* =========================================================
       MODULES
    ========================================================== */

.qhr-login-modules[b-95a48vcqmr] {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    overflow: hidden;
    border-radius: 0 0 23px 23px;
    background: #18aba8;
}


.qhr-module-item[b-95a48vcqmr] {
    min-height: 73px;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 5px;
    padding: 9px;
    color: #fff;
    border-inline-end: 1px solid rgba(255,255,255,.16);
    font-size: .67rem;
    font-weight: 700;
}


    .qhr-module-item:last-child[b-95a48vcqmr] {
        border-inline-end: 0;
    }
/* /Pages/ResetPassword.razor.rz.scp.css */
html[b-hdg9vu41vh],
body[b-hdg9vu41vh] {
    margin: 0;
    min-height: 100%;
    background: #eef1f7;
}

.q-login-page[b-hdg9vu41vh] {
    min-height: 100vh;
    display: flex;
    align-items: flex-start;
    justify-content: center;
    padding: 35px 16px 20px;
    background: radial-gradient(circle at top right, rgba(18,168,157,.20), transparent 32%), linear-gradient(135deg, #eef1f7 0%, #f8fafc 100%);
}

.q-login-card[b-hdg9vu41vh] {
    width: min(100%, 470px);
    background: #fff;
    border-radius: 22px;
    overflow: hidden;
    box-shadow: 0 20px 45px rgba(15, 23, 42, .16);
}

.q-login-top[b-hdg9vu41vh] {
    position: relative;
    padding: 18px 22px 8px;
    display: flex;
    justify-content: center;
    align-items: center;
}

.q-lang[b-hdg9vu41vh] {
    position: absolute;
    inset-inline-start: 18px;
    top: 16px;
}

.q-login-logo[b-hdg9vu41vh] {
    width: 120px;
    display: block;
}

.q-login-body[b-hdg9vu41vh] {
    padding: 0 42px 26px;
    text-align: center;
}

.q-login-title[b-hdg9vu41vh] {
    margin: 10px 0 4px;
    color: #022964;
    font-size: 22px;
    font-weight: 900;
}

.q-login-subtitle[b-hdg9vu41vh] {
    margin: 0 0 18px;
    color: #12a89d;
    font-weight: 800;
}

.q-login-form[b-hdg9vu41vh] {
    width: 100%;
}

.q-field[b-hdg9vu41vh] {
    height: 46px;
    margin-top: 12px;
    border: 1px solid #dbe3ee;
    border-radius: 14px;
    background: #f8fafc;
    display: flex;
    align-items: center;
    gap: 10px;
    padding-inline: 13px;
    transition: .2s ease;
}

    .q-field:focus-within[b-hdg9vu41vh] {
        background: #fff;
        border-color: #12a89d;
        box-shadow: 0 0 0 4px rgba(18,168,157,.12);
    }

    .q-field > i[b-hdg9vu41vh] {
        color: #12a89d;
        font-size: 17px;
    }

    .q-field .k-input[b-hdg9vu41vh],
    .q-field .k-textbox[b-hdg9vu41vh] {
        width: 100%;
        border: 0 !important;
        background: transparent !important;
        box-shadow: none !important;
    }

    .q-field .k-input-inner[b-hdg9vu41vh] {
        height: 42px !important;
        background: transparent !important;
        font-weight: 700;
    }

.q-eye-btn[b-hdg9vu41vh] {
    width: 34px;
    height: 32px;
    border: 0;
    border-radius: 10px;
    background: #eef2f7;
    color: #64748b;
    display: inline-flex;
    align-items: center;
    justify-content: center;
}

    .q-eye-btn:hover[b-hdg9vu41vh] {
        background: #12a89d;
        color: #fff;
    }

.q-login-btn[b-hdg9vu41vh] {
    width: 100%;
    height: 44px;
    margin-top: 18px;
    border-radius: 14px !important;
    background: #12a89d !important;
    border-color: #12a89d !important;
    font-weight: 900 !important;
}

.q-forgot-btn[b-hdg9vu41vh] {
    margin-top: 12px;
    border: 0;
    background: transparent;
    color: #12a89d;
    font-weight: 800;
}

.q-register-section[b-hdg9vu41vh] {
    background: #022964;
    color: #fff;
    padding: 20px 24px;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 14px;
    font-weight: 900;
}

.q-register-btn[b-hdg9vu41vh] {
    border: 0;
    border-radius: 999px;
    background: #12d4c4;
    color: #fff;
    padding: 10px 22px;
    font-weight: 900;
    box-shadow: 0 8px 20px rgba(18, 212, 196, .25);
}

.q-bottom-bar[b-hdg9vu41vh] {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    background: #12a89d;
}

.q-bottom-item[b-hdg9vu41vh] {
    border: 0;
    background: transparent;
    color: #fff;
    padding: 12px 6px;
    min-height: 68px;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 5px;
    font-weight: 800;
    transition: .2s ease;
}

    .q-bottom-item:hover[b-hdg9vu41vh] {
        background: rgba(255,255,255,.12);
    }

    .q-bottom-item i[b-hdg9vu41vh] {
        font-size: 20px;
    }

.k-textbox .k-input-inner[b-hdg9vu41vh],
.k-input-value-text[b-hdg9vu41vh],
.k-input-md[b-hdg9vu41vh],
.k-picker-md[b-hdg9vu41vh] {
    height: 42px;
}

@media (max-width: 576px) {
    .q-login-page[b-hdg9vu41vh] {
        padding: 14px 10px;
    }

    .q-login-card[b-hdg9vu41vh] {
        border-radius: 18px;
    }

    .q-login-logo[b-hdg9vu41vh] {
        width: 100px;
    }

    .q-login-body[b-hdg9vu41vh] {
        padding: 0 22px 22px;
    }

    .q-register-section[b-hdg9vu41vh] {
        flex-direction: column;
        gap: 10px;
        padding: 18px;
        text-align: center;
    }

    .q-bottom-item[b-hdg9vu41vh] {
        font-size: 12px;
        min-height: 62px;
    }
}
.q-back-btn[b-hdg9vu41vh] {
    width: 100%;
    height: 48px;
    border: 0;
    background: #022964;
    color: #fff;
    font-weight: 900;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
}