/* _content/Connect.UI.Accounts.Web/Components/Buttons/PrimaryButton.razor.rz.scp.css */
button[b-2bqqs3ay6a] {
    display: inline-flex;
    padding: 15.5px 16px;
    justify-content: center;
    align-items: center;
    gap: 8px;
    border-radius: 8px;
    background: var(--Orange, #FF7446);

    &[disabled] {
        opacity: 0.7;
        background: var(--Orange, #FF7446);
        cursor: not-allowed;
    }

    &:hover:not([disabled])[b-2bqqs3ay6a] {
        background: var(--Dark-orange, #FF6734);
    }

    &:focus:not(:active)[b-2bqqs3ay6a] {
        border: 2px solid var(--Message-blue, #1876FF);
        background: var(--Dark-orange, #FF6734);
        padding: 13.5px 14px;
    }

    &.loading[b-2bqqs3ay6a] {
        background: var(--Medium-grey, #DDE4EF);
        opacity: 1;

        span {
            color: var(--Grey, #4F5058);
        }
    }

    .start-icon[b-2bqqs3ay6a] {
        width: 16px;
        height: 16px;
    }

    span[b-2bqqs3ay6a] {
        color: var(--White, #FFF);
        font-size: 14px;
        font-weight: 600;
        line-height: normal;
        letter-spacing: 0.42px;
    }

    .loading-icon[b-2bqqs3ay6a] {
        display: none;
    }
}

@media (min-width: 768px) {
    button[b-2bqqs3ay6a] {
        &.for-desktop {
            display: inline-flex;
        }

        &.for-mobile[b-2bqqs3ay6a] {
            display: none;
        }
    }
}

@media (max-width: 767px) {
    button[b-2bqqs3ay6a] {
        display: flex;

        svg {
            flex-shrink: 0;
        }

        &.for-desktop[b-2bqqs3ay6a] {
            display: none;
        }

        &.for-mobile[b-2bqqs3ay6a] {
            display: flex;
        }
    }
}
/* _content/Connect.UI.Accounts.Web/Components/Buttons/SecondaryButton.razor.rz.scp.css */
button[b-rlhs5h15i3] {
    display: inline-flex;
    padding: 15.5px 16px;
    justify-content: center;
    align-items: center;
    gap: 8px;
    border-radius: 8px;
    background: var(--Black, #25252A);

    .start-icon {
        width: 16px;
        height: 16px;
    }

    span[b-rlhs5h15i3] {
        color: var(--White, #FFF);
        font-size: 14px;
        font-weight: 600;
        line-height: normal;
        letter-spacing: 0.42px;
    }

    &:hover[b-rlhs5h15i3] {
        background: var(--Dark-black, #202024);
    }

    &:focus:not(:active)[b-rlhs5h15i3] {
        border: 2px solid var(--Message-blue, #1876FF);
        background: var(--Dark-black, #202024);
        padding: 13.5px 14px;
    }

    &.loading[b-rlhs5h15i3] {
        background: var(--Grey, #4F5058);
        opacity: 1;

        span {
            color: var(--Grey, #4F5058);
        }
    }
}

@media (min-width: 768px) {
    button[b-rlhs5h15i3] {
        &.for-desktop {
            display: inline-flex;
        }

        &.for-mobile[b-rlhs5h15i3] {
            display: none;
        }
    }
}

@media (max-width: 767px) {
    button[b-rlhs5h15i3] {
        display: flex;

        svg {
            flex-shrink: 0;
        }

        &.for-desktop[b-rlhs5h15i3] {
            display: none;
        }

        &.for-mobile[b-rlhs5h15i3] {
            display: flex;
        }
    }
}
/* _content/Connect.UI.Accounts.Web/Components/Buttons/TertiaryLButton.razor.rz.scp.css */
button[b-ghpjgrv88f] {
    display: inline-flex;
    padding: 15.5px 16px;
    justify-content: center;
    align-items: center;
    gap: 8px;
    border-radius: 8px;
    border: 1px solid var(--Medium-grey, #DDE4EF);

    .start-icon {
        width: 16px;
        height: 16px;
    }

    span[b-ghpjgrv88f] {
        color: var(--Grey, #4F5058);
        font-size: 14px;
        font-weight: 600;
        line-height: normal;
        letter-spacing: 0.42px;
    }

    &[disabled][b-ghpjgrv88f] {
        opacity: 0.7;
        cursor: not-allowed;
    }

    &:hover:not([disabled])[b-ghpjgrv88f] {
        border: 1px solid var(--Grey, #4F5058);
    }

    &:focus:not(:active)[b-ghpjgrv88f] {
        border: 2px solid var(--Message-blue, #1876FF);
        padding: 13.5px 14px;
    }

    &.loading[b-ghpjgrv88f] {
        background: var(--Medium-grey, #DDE4EF);
        opacity: 1;

        span {
            color: var(--Grey, #4F5058);
        }
    }
}

@media (min-width: 768px) {
    button[b-ghpjgrv88f] {
        &.for-desktop {
            display: inline-flex;
        }

        &.for-mobile[b-ghpjgrv88f] {
            display: none;
        }
    }
}

@media (max-width: 767px) {
    button[b-ghpjgrv88f] {
        display: flex;

        svg {
            flex-shrink: 0;
        }

        &.for-desktop[b-ghpjgrv88f] {
            display: none;
        }

        &.for-mobile[b-ghpjgrv88f] {
            display: flex;
        }
    }
}
/* _content/Connect.UI.Accounts.Web/Components/Buttons/TertiarySButton.razor.rz.scp.css */
button[b-a9lo4xzfxt] {
    display: flex;
    padding: 7.5px 16px;
    justify-content: center;
    align-items: center;
    gap: 8px;
    border-radius: 8px;
    border: 1px solid var(--Medium-grey, #DDE4EF);
    background: var(--White, #FFF);

    &.square {
        width: 32px;
    }

    .start-icon[b-a9lo4xzfxt],
    .end-icon[b-a9lo4xzfxt] {
        display: inline-flex;
        width: 12px;
        height: 12px;
        justify-content: center;
        align-items: center;
        flex-shrink: 0;
    }

    span[b-a9lo4xzfxt] {
        color: var(--Grey, #4F5058);
        font-size: 12px;
        font-weight: 500;
        line-height: normal;
        letter-spacing: 0.36px;
    }

    &.disabled[b-a9lo4xzfxt] {
        opacity: 0.7;
    }
}

@media (min-width: 768px) {
    button[b-a9lo4xzfxt] {
        &.for-desktop {
            display: flex;
        }

        &.for-mobile[b-a9lo4xzfxt] {
            display: none;
        }
    }
}

@media (max-width: 767px) {
    button[b-a9lo4xzfxt] {
        display: flex;
        padding: 15.5px 16px;
        justify-content: center;
        align-items: center;
        gap: 8px;
        border-radius: 8px;
        border: 1px solid var(--Medium-grey, #DDE4EF);

        span {
            color: var(--Grey, #4F5058);
            font-size: 14px;
            font-weight: 600;
            line-height: normal;
            letter-spacing: 0.42px;
        }

        &.for-desktop[b-a9lo4xzfxt] {
            display: none;
        }

        &.for-mobile[b-a9lo4xzfxt] {
            display: flex;
        }
    }
}
/* _content/Connect.UI.Accounts.Web/Components/Buttons/TextLinkGrayLButton.razor.rz.scp.css */
a[b-gb20roja7y] {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 2px;

    color: var(--Black, #25252A);
    font-size: 14px;
    font-weight: 600;
    letter-spacing: 0.42px;

    &:focus-visible {
        border-radius: 4px;
        border: 2px solid var(--Message-blue, #1876FF);
        padding: 0;
    }

    &:hover[b-gb20roja7y] {
        border-bottom: 1px solid var(--Black, #25252A);
    }
}
/* _content/Connect.UI.Accounts.Web/Components/Buttons/TextLinkOrangeSButton.razor.rz.scp.css */
a[b-prck7pnz10] {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 2px;

    color: var(--Orange, #FF7446);

    font-size: 12px;
    font-weight: 500;
    letter-spacing: 0.36px;

    &:focus-visible {
        border-radius: 4px;
        border: 2px solid var(--Message-blue, #1876FF);
        padding: 0;
    }

    &:hover[b-prck7pnz10] {
        border-bottom: 1px solid var(--Orange, #FF7446);
    }
}
/* _content/Connect.UI.Accounts.Web/Components/FormElements/Dropdown.razor.rz.scp.css */
.select-container[b-r8ujyglgjo] {
    .mud-input-outlined-border {
        border-radius: 8px;
        border: 1px solid var(--Medium-grey, #DDE4EF);

        &:hover {
            border: 1px solid var(--Grey, #4F5058);
        }
    }

    &[b-r8ujyglgjo]  .mud-input {
        display: flex;
        min-width: 156px;
        padding: 15.5px 16px;
        align-items: center;
        gap: 16px;
        line-height: normal;

        .mud-input-slot {
            color: var(--Grey, #4F5058);

            font-size: 14px;
            font-weight: 400;
            line-height: normal;
            letter-spacing: 0.14px;
            padding: 0;
        }
    }
}
/* _content/Connect.UI.Accounts.Web/Components/FormElements/FormInput.razor.rz.scp.css */
.form-element[b-0b5nblnpij] {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 8px;
    align-self: stretch;

    .field {
        display: flex;
        flex-direction: column;
        align-items: flex-start;
        gap: 10px;
        border-radius: 8px;
        border: 1px solid var(--Medium-grey, #DDE4EF);

        &:has(input:not([class*="error"]):focus) {
            border: 2px solid var(--Message-blue, #1876FF);
        }

        &:has(input[disabled])[b-0b5nblnpij] {
            background-color: #F0F2F5;
        }

        .inner-stroke[b-0b5nblnpij] {
            display: flex;
            padding: 15.5px 16px;
            align-items: center;
            gap: 16px;
            align-self: stretch;

            &:has(input:not([class*="error"]):focus) {
                padding: 13.5px 14px;
                border-radius: 5.7px;
                border: 1px solid var(--Grey, #4F5058);
            }

            input[b-0b5nblnpij] {
                flex: 1 0 0;
                color: var(--Grey, #4F5058);
                outline: none;
                font-size: 14px;
                font-weight: 400;
                line-height: normal;
                letter-spacing: 0.14px;

                &[disabled] {
                    background-color: #F0F2F5;
                }
            }

            .visibility-icon[b-0b5nblnpij] {
                cursor: pointer;
            }
        }

        &:has(input.error)[b-0b5nblnpij] {
            border: 1px solid var(--Error-red, #E83434);
        }
    }

    .error[b-0b5nblnpij] {
        display: flex;
        align-items: flex-start;
        gap: 6px;
        align-self: stretch;

        .icon-space {
            display: flex;
            padding-top: 1.5px;
            align-items: center;
            gap: 10px;

            svg {
                width: 12px;
                height: 12px;
            }
        }
    }
}
/* _content/Connect.UI.Accounts.Web/Components/FormElements/Tile.razor.rz.scp.css */
.tile[b-g8jvf352kf] {
    display: flex;
    height: 72px;
    padding: 24px;
    align-items: center;
    flex-shrink: 0;
    border-radius: 8px;
    border: 1px solid var(--Medium-grey, #DDE4EF);
    gap: 16px;
    flex: 1 0 0;
    
    .tile-text {
        display: flex;
        align-items: center;
        gap: 16px;
        flex: 1 0 0;
    }

    &:hover[b-g8jvf352kf] {
        background: var(--Light-grey, #F0F2F5);
    }

    span[b-g8jvf352kf] {
        color: var(--Grey, #4F5058);
        font-size: 14px;
        font-style: normal;
        font-weight: 600;
        line-height: normal;
        letter-spacing: 0.42px;
    }

    .select-icon[b-g8jvf352kf] {
        display: flex;
        padding: 4px;
        align-items: center;
        gap: 10px;
        border-radius: 8px;
        background: var(--Positive-green, #1ABA00);
    }
}
/* _content/Connect.UI.Accounts.Web/Components/FormElements/Toggle.razor.rz.scp.css */
.toggle[b-j1cczax21j] {
    display: flex;
    align-items: center;
    gap: 16px;
    align-self: stretch;
    position: relative;

    input {
        position: absolute;
        top: 0;
        left: 0;
        z-index: -1;
    }

    .hover[b-j1cczax21j],
    .focus[b-j1cczax21j] {
        display: none;
    }

    &:not(:has(input:focus)):hover[b-j1cczax21j] {
        .default {
            display: none;
        }

        .hover[b-j1cczax21j] {
            display: initial;
        }
    }

    &:has(input:focus)[b-j1cczax21j] {

        .default,
        .hover {
            display: none;
        }

        .focus[b-j1cczax21j] {
            display: flex;
            flex-direction: column;
            align-items: flex-start;
            gap: 10px;

            border-radius: 50px;
            border: 2px solid var(--Message-blue, #1876FF);

            .inner-toggle {
                display: flex;
                width: 42px;
                height: 24px;
                align-items: center;
                gap: 10px;

                border-radius: 16px;
                border: 1px solid var(--Medium-grey, #DDE4EF);
                background: var(--Light-grey, #F0F2F5);

                svg {
                    width: 24px;
                    height: 24px;
                    flex-shrink: 0;

                    fill: var(--White, #FFF);
                    stroke-width: 1px;
                    stroke: var(--Medium-grey, #DDE4EF);
                }
            }

            &.on[b-j1cczax21j] {
                .inner-toggle {
                    justify-content: flex-end;
                    background: var(--Positive-green, #1ABA00);
                }
            }
        }
    }
}
/* _content/Connect.UI.Accounts.Web/Components/Images/BlueIcon.razor.rz.scp.css */
.icon-with-background[b-4y6p1g6kx8]  {
    svg {
        width: 16px;
        height: 16px;
        flex-shrink: 0;
        z-index: 1;
    }

    width: 40px;
    height: 40px;
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center;

    .background[b-4y6p1g6kx8] {
        width: 32px;
        height: 32px;
        transform: rotate(15deg);
        flex-shrink: 0;
        border-radius: 8px;
        background: var(--Blue, #77AEFF);
        position: absolute;
    }
}
/* _content/Connect.UI.Accounts.Web/Components/Images/LoadingIcon.razor.rz.scp.css */
svg[b-x8n9x65iek] {
    animation: rotation 2s;
    animation-timing-function: linear;
    animation-iteration-count: infinite;
}
/* _content/Connect.UI.Accounts.Web/Components/Layout/AuthLayout.razor.rz.scp.css */
.bg[b-6azpkew45d] {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: url("images/background.png");
    background-size: cover;

    .multiply {
        width: 100%;
        height: 100%;
        background: var(--Gradient, linear-gradient(316deg, #77AEFF 0%, #FFA98C 50%, #FF7446 100%));
        mix-blend-mode: multiply;

        .overlay {
            width: 100%;
            height: 100%;
            background: var(--Gradient, linear-gradient(316deg, #77AEFF 0%, #FFA98C 50%, #FF7446 100%));
            mix-blend-mode: overlay;
        }
    }
}

.container[b-6azpkew45d] {
    position: absolute;
    top: 50%;
    left: 50%;
    display: flex;
    flex-direction: column;
    align-items: center;
    width: 390px;
    background: #FFF;
    box-sizing: border-box;
    padding: 24px;
    border-radius: 8px;
    
    &:has(.content:empty) {
        display: none;
    }
}

[b-6azpkew45d] footer{
    color: var(--White, #FFF) !important;
}

.logo-container[b-6azpkew45d] {
    position: absolute;
    top: 32px;
    left: 32px;
}

.footer[b-6azpkew45d] {
    position: absolute;
    bottom: 24px;
    padding: 0 24px;
    display: flex;
    width: 100%;
    justify-content: space-between;
    align-items: center;

    .links
    {
        display: flex;
        align-items: center;
        gap: 16px;

        .button
        {
            display: flex;
            align-items: center;
            gap: 8px;
            
            span
            {
                color: var(--White, #FFF);
                font-size: 12px;
                font-weight: 500;
                line-height: normal;
                letter-spacing: 0.36px;
            }
        }
    }

    .copyright[b-6azpkew45d] {
        color: var(--White, #FFF);
        /* Caption */
        font-size: 12px;
        font-weight: 400;
        line-height: normal;
        letter-spacing: 0.12px;
    }
}


@media (max-width: 768px) {
    .container[b-6azpkew45d] {
        top: 80px;
        left: 24px;
        right: 24px;
        width: calc(100% - 48px);
    }

    .logo-container[b-6azpkew45d] {
        position: absolute;
        top: 24px;
        left: 24px;
    }

    .realto-logo[b-6azpkew45d] {
        width: 104px;
        height: 32px;
    }

    .footer[b-6azpkew45d] {
        flex-direction: column;
        gap: 16px;
    }
}

@media (min-width: 768px) and (max-width: 1279px) {
    .container[b-6azpkew45d] {
        -webkit-transform: translate(-50%, -50%);
        transform: translate(-50%, -50%);
    }
}


@media (min-width: 1280px) and (max-width: 1535px) {
    .container[b-6azpkew45d] {
        -webkit-transform: translate(-50%, -50%);
        transform: translate(-50%, -50%);
    }
}

@media (min-width: 1536px) {
    .container[b-6azpkew45d] {
        -webkit-transform: translate(-50%, -50%);
        transform: translate(-50%, -50%);
    }
}
/* _content/Connect.UI.Accounts.Web/Components/Layout/Error.razor.rz.scp.css */
.error[b-f0j17lln0w] {
    margin: auto;
    display: flex;
    padding: 241px 445px 242px 445px;
    justify-content: center;
    align-items: center;
}

.frame-2[b-f0j17lln0w] {
    overflow: hidden;
    display: flex;
    width: 390px;
    padding: 24px;
    flex-direction: column;
    align-items: flex-start;
    gap: 16px;
    flex-shrink: 0;

    border-radius: 8px;
    border: 1px solid var(--Medium-grey, #DDE4EF);
}

.frame-2-top[b-f0j17lln0w] {
    display: flex;
    align-items: center;
    gap: 16px;
    align-self: stretch;
}

.error-icon[b-f0j17lln0w]  svg {
    width: 56px;
    height: 56px;
}

.background[b-f0j17lln0w] {
    position: absolute;
    width: 44.419px;
    height: 44.419px;
    transform: rotate(15deg);
    flex-shrink: 0;
}

@media (max-width: 767px) {
    .error[b-f0j17lln0w] {
        display: flex;
        width: 375px;
        padding: 120px 24px 121px 24px;
        flex-direction: column;
        justify-content: center;
        align-items: center;
        background: #FFF;
    }

    .frame-2[b-f0j17lln0w] {
        display: flex;
        width: 327px;
        padding: 24px;
        flex-direction: column;
        align-items: flex-start;
        gap: 16px;
        border-radius: 8px;
        border: 1px solid var(--Medium-grey, #DDE4EF);
    }

    .frame-2-top[b-f0j17lln0w] {
        display: flex;
        flex-direction: column;
        align-items: flex-start;
        gap: 16px;
        align-self: stretch;
    }

    [b-f0j17lln0w] button {
        align-self: stretch;
    }

    [b-f0j17lln0w] a {
        align-self: stretch;
        justify-content: center;
    }
}
/* _content/Connect.UI.Accounts.Web/Components/Layout/Footer.razor.rz.scp.css */
footer[b-kmj0qxutau] {
    padding: 24px 0;

    display: flex;
    width: 100%;
    justify-content: space-between;
    align-items: center;
    min-width: 375px;

    .links {
        display: flex;
        align-items: center;
        gap: 16px;

        .button {
            display: flex;
            align-items: center;
            gap: 8px;

            span {
                color: var(--Grey, #4F5058);

                font-size: 12px;
                font-weight: 500;
                line-height: normal;
                letter-spacing: 0.36px;
            }
        }
    }

    .copyright[b-kmj0qxutau] {
        color: var(--Grey, #4F5058);

        /* Caption */
        font-size: 12px;
        font-weight: 400;
        line-height: normal;
        letter-spacing: 0.12px;
    }
}

@media (max-width: 767px) {
    footer[b-kmj0qxutau] {
        flex-direction: column;
        gap: 16px;
    }
}
/* _content/Connect.UI.Accounts.Web/Components/Layout/Header.razor.rz.scp.css */
header.top-navigation[b-bcstpe35pa] {
    display: flex;
    width: 100%;
    padding: 24px 0;
    justify-content: space-between;
    align-items: center;

    .logo {
        display: none;
    }

    .left-side[b-bcstpe35pa] {
        display: flex;
        align-items: center;
        gap: 24px;

        .logo {
            display: block;
            width: 40px;
            height: 40px;
        }

        .menu-items[b-bcstpe35pa] {
            display: flex;
            align-items: center;
            gap: 16px;
        }

    }

    .right-side[b-bcstpe35pa] {
        display: flex;
        align-items: center;
        gap: 16px;

        .trial {
            display: flex;
            align-items: center;
            gap: 12px;

            .icon-text {
                display: flex;
                justify-content: center;
                align-items: center;
                gap: 8px;
                min-width: 95px;
            }

        }

        .menu-item[b-bcstpe35pa] {
            display: flex;
            width: 32px;
            min-width: 32px;
            height: 32px;
            padding: 8px 16px;
            justify-content: center;
            align-items: center;
            gap: 8px;
            border-radius: 8px;
        }

    }
}

.mobile[b-bcstpe35pa] {
    display: none;
}

@media (max-width: 767px) {

    .mobile[b-bcstpe35pa] {
        display: block;
    }

    header.top-navigation[b-bcstpe35pa] {
        display: flex;
        padding: 24px;
        justify-content: space-between;
        align-items: center;

        .logo {
            display: block;
            width: 40px;
            height: 40px;
            flex-shrink: 0;
        }

        .left-side[b-bcstpe35pa] {
            display: none;
        }

        .right-side[b-bcstpe35pa] {
            display: flex;
            align-items: center;
            gap: 16px;

            .trial {
                display: flex;
                align-items: center;
                gap: 12px;

                .icon-text {
                    display: flex;
                    justify-content: center;
                    align-items: center;
                    gap: 8px;

                    svg {
                        width: 16px;
                        height: 16px;
                    }

                    span[b-bcstpe35pa] {
                        color: var(--Black, #25252A);
                        /* Caption */
                        font-size: 12px;
                        font-weight: 400;
                        line-height: normal;
                        letter-spacing: 0.12px;
                    }

                }

                button.upgrade[b-bcstpe35pa] {
                    display: flex;
                    align-items: center;
                    gap: 8px;

                    span {
                        color: var(--Orange, #FF7446);
                        /* Button 3 */
                        font-size: 12px;
                        font-weight: 500;
                        line-height: normal;
                        letter-spacing: 0.36px;
                    }

                }
            }
        }
    }

    [b-bcstpe35pa] .mobile-overlay {
        .mud-overlay-content {
            height: 100%;
            width: 100%;
            height: 100%;
            flex-direction: column;
            justify-content: center;
            align-items: center;
            background: #FFF;

            .mobile-menu {
                display: flex;
                width: 100%;
                height: 100%;
                position: fixed;
                padding: 24px 24px 24px 16px;
                flex-direction: column;
                justify-content: space-between;
                align-items: flex-start;
                flex-shrink: 0;
                background: var(--White, #FFF);

                .top {
                    display: flex;
                    flex-direction: column;
                    align-items: flex-start;
                    gap: 16px;
                    align-self: stretch;

                    .close {
                        display: flex;
                        justify-content: flex-end;
                        align-items: center;
                        gap: 10px;
                        align-self: stretch;

                        button {
                            display: flex;
                            width: 40px;
                            height: 40px;
                            padding: 16px;
                            justify-content: center;
                            align-items: center;
                            gap: 8px;
                            border-radius: 8px;
                            border: 1px solid var(--Medium-grey, #DDE4EF);

                            svg {
                                width: 16px;
                                height: 16px;
                                flex-shrink: 0;
                            }

                        }
                    }

                    .main-menu[b-bcstpe35pa] {
                        display: flex;
                        flex-direction: column;
                        align-items: flex-start;
                        gap: 12px;

                        .my-clients {
                            background: var(--Light-grey, #F0F2F5);
                        }

                        .menu-item[b-bcstpe35pa] {
                            display: flex;
                            padding: 8px 16px;
                            justify-content: center;
                            align-items: center;
                            gap: 8px;
                            border-radius: 8px;

                            svg {
                                width: 16px;
                                height: 16px;
                            }

                            span[b-bcstpe35pa] {
                                display: flex;
                                justify-content: center;
                                align-items: center;
                                gap: 4px;
                                color: var(--Black, #25252A);
                                /* Button 3 */
                                font-size: 12px;
                                font-weight: 500;
                                line-height: normal;
                                letter-spacing: 0.36px;
                            }

                        }
                    }
                }

                .bottom[b-bcstpe35pa] {
                    position: relative;
                    bottom: 0;
                    display: flex;
                    flex-direction: column;
                    align-items: flex-start;
                    gap: 16px;
                    width: 100%;

                    .sub-menu {
                        display: flex;
                        flex-direction: column;
                        align-items: flex-start;
                        gap: 12px;

                        .menu-item {
                            display: flex;
                            height: 32px;
                            padding: 8px 16px;
                            justify-content: center;
                            align-items: center;
                            gap: 8px;
                            border-radius: 8px;

                            svg {
                                width: 16px;
                                height: 16px;
                            }

                            span[b-bcstpe35pa] {
                                color: var(--Black, #25252A);
                                /* Button 3 */
                                font-size: 12px;
                                font-weight: 500;
                                line-height: normal;
                                letter-spacing: 0.36px;
                            }

                        }
                    }

                    .form-element[b-bcstpe35pa] {
                        display: flex;
                        width: 100%;
                        flex-direction: column;
                        align-items: flex-start;
                        gap: 8px;

                    }

                    .form-element[b-bcstpe35pa]  .select-container {
                        width: 100%;
                    }
                }
            }
        }
    }
}
/* _content/Connect.UI.Accounts.Web/Components/Layout/MainLayout.razor.rz.scp.css */
.container[b-rp15xbi54c] {
    margin: auto;
    display: flex;
    flex-direction: column;
    align-items: center;
    min-width: 375px;

    background: #FFF;

    box-sizing: border-box;
    width: 100%;
    padding: 0;
    height: 100%;

    .above-footer {
        flex-grow: 1;
    }
}

[b-rp15xbi54c] .popover {

    top: 64px !important;

    .menu-list {
        display: inline-flex;
        padding: 16px;
        flex-direction: column;
        align-items: flex-start;
        gap: 8px;

        border-radius: 8px;
        border: 1px solid var(--Medium-grey, #DDE4EF);
        background: var(--White, #FFF);

        .mud-list-item {
            display: flex;
            height: 32px;
            padding: 8px 16px;
            justify-content: center;
            align-items: center;
            gap: 8px;

            border-radius: 8px;

            .menu-item {
                display: flex;
                gap: 8px;

                .menu-text {
                    color: var(--Black, #25252A);
                    font-size: 12px;
                    font-weight: 500;
                    letter-spacing: 0.36px;
                }
            }
        }
    }
}

@media (min-width: 768px) {
    .container[b-rp15xbi54c] {
        width: 100%;
    }
}

@media (min-width: 768px) and (max-width: 1279px) {
    .container[b-rp15xbi54c] {
        padding: 0 24px;
    }
}


@media (min-width: 1280px) and (max-width: 1535px) {
    .container[b-rp15xbi54c] {
        padding: 0 32px;
    }
}

@media (min-width: 1536px) {
    .container[b-rp15xbi54c] {
        padding: 0 40px;
        max-width: var(--max-width);
    }
}
/* _content/Connect.UI.Accounts.Web/Components/Modals/Modal.razor.rz.scp.css */
.modal[b-2hbw61jfsz]  {
    .mud-overlay {
        justify-content: end;
    }

    &[b-2hbw61jfsz]  .mud-overlay-scrim {
        opacity: 0.8;
        background: var(--Dark-black, #202024);
    }

    &[b-2hbw61jfsz]  .mud-overlay-content {
        height: 100%;
        width: calc(30% + 48px);
    }

}

@media (max-width: 767px) {
    .modal[b-2hbw61jfsz]  .mud-overlay {
        justify-content: initial;

        .mud-overlay-content {
            height: initial;
            width: 100%;
            position: absolute;
            bottom: 0;
        }
    }
}

.modal-content[b-2hbw61jfsz] {
    display: flex;
    width: 100%;
    height: 100%;
    padding: 24px;
    flex-direction: column;
    gap: 16px;
    justify-content: space-between;
    flex-shrink: 0;
    background: var(--White, #FFF);
}

.top-modal[b-2hbw61jfsz] {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 16px;
    align-self: stretch;

    .top-intro {
        display: flex;
        flex-direction: column;
        align-items: flex-start;
        gap: 16px;
        align-self: stretch;

        .top {
            display: flex;
            width: 100%;
            height: 40px;
            align-items: center;
            gap: 24px;

            .icon-title {
                display: flex;
                height: 40px;
                align-items: center;
                gap: 16px;
                flex: 1 0 0;
            }

            &[b-2hbw61jfsz]  button.close {
                width: 40px;
                height: 40px;
            }

        }
    }
}

.bottom[b-2hbw61jfsz] {
    display: flex;
    flex-direction: column;
}
/* _content/Connect.UI.Accounts.Web/Components/Modals/Overlay.razor.rz.scp.css */
.mud-overlay[b-3q1wzhxc80] {
    justify-content: initial;
    align-items: flex-end;
    .mud-overlay-content {
        height: initial;
        width: 100%;
    }
}
/* _content/Connect.UI.Accounts.Web/Components/Navigation/MenuItem.razor.rz.scp.css */
.menu-item[b-vn5pxvjzok] {
    display: inline-flex;
    height: 32px;
    padding: 8px 16px;
    justify-content: center;
    align-items: center;
    gap: 8px;
    border-radius: 8px;
    cursor: pointer;

    &.square {
        width: 32px;
    }

    &:hover[b-vn5pxvjzok],
    &.selected[b-vn5pxvjzok] {
        background: var(--Light-grey, #F0F2F5);
    }

    &:focus-visible[b-vn5pxvjzok] {
        border: 2px solid var(--Message-blue, #1876FF);
        padding: 6px 14px;
    }

    .start-icon[b-vn5pxvjzok],
    .end-icon[b-vn5pxvjzok] {
        width: 16px;
        height: 16px;
    }

    span[b-vn5pxvjzok] {
        color: var(--Black, #25252A);
        font-size: 12px;
        font-weight: 500;
        line-height: normal;
        letter-spacing: 0.36px;
    }
}

@media (min-width: 768px) {
    .menu-item[b-vn5pxvjzok] {
        &.for-desktop {
            display: inline-flex;
        }

        &.for-mobile[b-vn5pxvjzok] {
            display: none;
        }
    }
}

@media (max-width: 767px) {
    .menu-item[b-vn5pxvjzok] {
        &.for-desktop {
            display: none;
        }

        &.for-mobile[b-vn5pxvjzok] {
            display: inline-flex;
        }
    }
}
/* _content/Connect.UI.Accounts.Web/Components/Notifications/NotificationToast.razor.rz.scp.css */
.toast[b-gabwyceg4e] {
    position: absolute;
    top: 16px;
    margin: auto;
    display: inline-flex;
    padding: 16px;
    align-items: center;
    gap: 16px;
    border-radius: 8px;
    background: var(--Error-red, #25252A);
    z-index: 1000;

    .title {
        display: flex;
        align-items: flex-start;
        gap: 12px;
        align-self: stretch;

        .icon-spacer {
            display: flex;
            padding: 1.5px 0px;
            align-items: center;
            gap: 10px;
        }
    }
}
/* _content/Connect.UI.Accounts.Web/Components/Pages/MyClients/AddClientFlow.razor.rz.scp.css */
.add-client-form[b-9zyu838l6i] {
    align-self: stretch;
}

.add-client-form[b-9zyu838l6i]  .form-element {
    align-self: stretch;

    .field {
        align-self: stretch;
    }
}

.client[b-9zyu838l6i] {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 16px;
    align-self: stretch;
}

.confirm-done[b-9zyu838l6i] {
    display: flex;
    padding: 16px;
    flex-direction: column;
    align-items: flex-start;
    gap: 16px;
    align-self: stretch;

    border-radius: 8px;
    border: 1px solid var(--Medium-grey, #DDE4EF);
}

.confirm-done[b-9zyu838l6i]  .done-button {
    align-self: stretch;
}
/* _content/Connect.UI.Accounts.Web/Components/Pages/MyClients/ClientList.razor.rz.scp.css */
table[b-stl6hr4o88] {
    border-spacing: 0 8px;
    width: 100%;

    th {
        text-align: left;
        padding: 0px 16px;
    }
}

.client-list[b-stl6hr4o88] {
    display: inline-flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 18px;
    padding: 2px;
}

@media (min-width: 768px) {
    .for-mobile[b-stl6hr4o88] {
        display: none;
    }
}

@media (max-width: 767px) {
    .for-desktop[b-stl6hr4o88] {
        display: none;
    }
}
/* _content/Connect.UI.Accounts.Web/Components/Pages/MyClients/DesktopClient.razor.rz.scp.css */
tr[b-0zr37t0kc4] {
    td {
        padding: 16px;
        border-top: 1px solid var(--Medium-grey, #DDE4EF);
        border-bottom: 1px solid var(--Medium-grey, #DDE4EF);
    }

    td:first-child[b-0zr37t0kc4] {
        border-top-left-radius: 8px;
        border-bottom-left-radius: 8px;
        border-left: 1px solid var(--Medium-grey, #DDE4EF);
    }

    td:last-child[b-0zr37t0kc4] {
        border-top-right-radius: 8px;
        border-bottom-right-radius: 8px;
        border-right: 1px solid var(--Medium-grey, #DDE4EF);
    }

    .client-name[b-0zr37t0kc4] {
        flex-shrink: 0;
    }

    .client-id[b-0zr37t0kc4] {
        display: flex;
        align-items: center;
        gap: 8px;
        flex-shrink: 0;

        & ::deep svg {
            width: 16px;
            height: 16px;
            flex-shrink: 0;
        }
    }

    .valid-to[b-0zr37t0kc4] {
        flex-shrink: 0;
    }

    .user[b-0zr37t0kc4] {
        display: flex;
        height: 17px;
        align-items: center;
        gap: 8px;
        flex: 1 0 0;
    }
}
/* _content/Connect.UI.Accounts.Web/Components/Pages/MyClients/GettingStarted.razor.rz.scp.css */
.call-to-action[b-x390i3w2pd] {
    width: 100%;
    height: 283px;
    flex-shrink: 0;
    position: relative;

    @media (min-width: 767px) {
        &[b-x390i3w2pd]>  button {
            margin: 40px;
        }
    }

    .bg {
        position: absolute;
        top: 0;
        left: 0;
        width: 100%;
        height: 100%;
        background: no-repeat url("images/getting-started.png");
        background-size: cover;

        .multiply {
            width: 100%;
            height: 100%;
            background: var(--Gradient, linear-gradient(316deg, #77AEFF 0%, #FFA98C 50%, #FF7446 100%));
            mix-blend-mode: multiply;
            border-radius: 8px;

            .overlay {
                width: 100%;
                height: 100%;
                background: var(--Gradient, linear-gradient(316deg, #77AEFF 0%, #FFA98C 50%, #FF7446 100%));
                mix-blend-mode: overlay;
                border-radius: 8px;
            }
        }
    }

    .title-intro[b-x390i3w2pd] {
        display: flex;
        flex-direction: column;
        align-items: flex-start;
        gap: 9px;
        margin: 40px;
    }
}

@media (max-width: 767px) {
    .call-to-action[b-x390i3w2pd] {
        height: 261px;

        .title-intro.mobile-title-intro {
            width: 327px;
            margin: 32px 24px;
        }

        .bg[b-x390i3w2pd] {
            .multiply {
                border-radius: inherit;
            }

            .overlay[b-x390i3w2pd] {
                border-radius: inherit;
            }
        }

        &[b-x390i3w2pd]>  button {
            width: calc(100% - 48px);
            margin: 32px 24px;
        }
    }
}
/* _content/Connect.UI.Accounts.Web/Components/Pages/MyClients/ManageClientFlow.razor.rz.scp.css */
.client-id-info[b-0dcijzy2lq] {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    align-self: stretch;
}

.client-id-info[b-0dcijzy2lq]  .info {
    padding: 0;
}

.client-id[b-0dcijzy2lq] {
    display: flex;
    height: 128px;
    padding: 16px;
    flex-direction: column;
    align-items: flex-start;
    gap: 16px;
    align-self: stretch;
}

.secrets[b-0dcijzy2lq] {
    max-height: 300px;
    overflow: auto;
    width: 100%;

    .item {
        display: flex;
        align-items: center;
        gap: 16px;
        align-self: stretch;
        margin-bottom: 16px;
        justify-content: space-between;
        .secret {
            display: flex;
            padding: 4px;
            flex-direction: column;
            justify-content: center;
            align-items: center;
            align-self: stretch;
            width: 133px;
            font-kerning: none;
            letter-spacing: .15rem;

            border-radius: 8px;
            background: rgba(255, 255, 255, 0.50);
        }
        .valid[b-0dcijzy2lq] {
            flex: 1 0 0;
            text-align: right;
        }
        &:last-child[b-0dcijzy2lq] {
            margin-bottom: 0;
        }
    }
}

.client-name[b-0dcijzy2lq] {
    width: 100%;
    display: flex;
    align-items: flex-end;
    gap: 16px;
    align-self: stretch;

    .form-element {
        flex-grow: 1;

        .field {
            width: 100%;
        }
    }
}

.actions[b-0dcijzy2lq] {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 8px;
    align-self: stretch;
}

.actions[b-0dcijzy2lq]  button {
    width: 100%;
}
/* _content/Connect.UI.Accounts.Web/Components/Pages/MyClients/MobileClient.razor.rz.scp.css */
.mobile-client[b-1ok2dajg97] {
    display: flex;
    min-width: 327px;
    width: 100%;
    padding: 16px;
    flex-direction: column;
    justify-content: center;
    align-items: flex-start;
    gap: 24px;
    border-radius: 8px;
    border: 1px solid var(--Medium-grey, #DDE4EF);

    .client-name {
        display: flex;
        flex-direction: column;
        align-items: flex-start;
        gap: 4px;
    }

    .client-id[b-1ok2dajg97] {
        display: flex;
        flex-direction: column;
        align-items: flex-start;
        gap: 4px;

        .value {
            display: flex;
            align-items: center;
            gap: 8px;
            align-self: stretch;

            & ::deep svg {
                width: 16px;
                height: 16px;
            }
        }
    }

    .valid-to[b-1ok2dajg97] {
        display: flex;
        flex-direction: column;
        align-items: flex-start;
        gap: 4px;
    }

    .created-by[b-1ok2dajg97] {
        display: flex;
        flex-direction: column;
        align-items: flex-start;
        gap: 4px;

        .value {
            display: flex;
            height: 17px;
            align-items: center;
            gap: 16px;
            align-self: stretch;

            & ::deep svg {
                width: 16px;
                height: 16px;
            }
        }
    }

    &[b-1ok2dajg97]  button {
        align-self: stretch;
        width: initial;
    }
}

/* _content/Connect.UI.Accounts.Web/Components/Pages/MyClients/MyClients.razor.rz.scp.css */
.my-clients-page[b-2jfzl9bxd0] {
    display: flex;
    flex-direction: column;
    width: 100%;
    gap: 7px;

    .loading {
        width: 100px;
        height: 100%;
        margin: auto;
        display: flex;
        flex-direction: column;
        justify-content: center;

        & ::deep svg {
            width: 100%;
            height: 100%;
        }
    }

    @media (max-width: 767px) {
        padding: 0 24px;[b-2jfzl9bxd0]
    }

    .active-clients-header[b-2jfzl9bxd0] {
        display: flex;
        justify-content: space-between;
        align-items: center;
    }

    .icon-title[b-2jfzl9bxd0] {
        display: inline-flex;
        justify-content: space-between;
        height: 40px;
        align-items: center;
        gap: 16px;
        flex-shrink: 0;

        color: var(--Black, #25252A);

        margin: 16px 0 15px 0;

        &.inactive-clients {
            margin-top: 34px;
            justify-content: flex-start;
        }
    }
}

.my-clients-page[b-2jfzl9bxd0]  .trial {
    padding: 24px;
    border-radius: 8px;
    background: var(--Light-grey, #F0F2F5);

    .trial-usps {
        .usp {
            background: var(--White, #FFF);
        }
    }
}

@media (max-width: 767px) {
    .my-clients-page[b-2jfzl9bxd0] {
        .secrets {
            max-height: 153px;
            overflow: auto;
        }
    }
}
/* _content/Connect.UI.Accounts.Web/Components/Pages/MyClients/NewClientSecretFlow.razor.rz.scp.css */
.client[b-h2pb7wlxzs] {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 16px;
    align-self: stretch;
}

.confirm-done[b-h2pb7wlxzs] {
    display: flex;
    padding: 16px;
    flex-direction: column;
    align-items: flex-start;
    gap: 16px;
    align-self: stretch;
    border-radius: 8px;
    border: 1px solid var(--Medium-grey, #DDE4EF);
}

.confirm-done[b-h2pb7wlxzs]  .done-button {
    align-self: stretch;
}
/* _content/Connect.UI.Accounts.Web/Components/Pages/PasswordReset.razor.rz.scp.css */
.title-row[b-78c3dbz6et] {
    display: flex;
    height: 40px;
    width: 100%;

    .icon-container {
        width: 40px;
        display: flex;
    
        .icon-bg {
            width: 32px;
            height: 32px;
            transform: rotate(15deg);
            border-radius: 8px;
            background: var(--Blue, #77aeff);
        }
    }

    .title[b-78c3dbz6et] {
        color: var(--Black, #25252a);
        font-size: 16px;
        font-style: normal;
        font-weight: 600;
        line-height: 32px;
        letter-spacing: 0.16px;
        margin-left: 16px;
    }
}

.create-password-description[b-78c3dbz6et] {
    align-self: stretch;
    color: var(--Grey, #4F5058);
    font-size: 14px;
    font-style: normal;
    font-weight: 400;
    line-height: normal;
    letter-spacing: 0.22px;
    margin: 16px 0px;
}

.info-container[b-78c3dbz6et] {
    display: flex;
    padding: 16px;
    flex-direction: column;
    justify-content: center;
    align-items: flex-start;
    gap: 16px;
    align-self: stretch;
    border-radius: 8px;
    background: var(--Light-grey, #F0F2F5);
    margin-bottom: 24px;

    .must {
        display: flex;
        justify-content: center;
        align-items: center;
        gap: 8px;

        .must-text {
            color: var(--Grey, #4F5058);
            font-size: 12px;
            font-style: normal;
            font-weight: 400;
            line-height: normal;
            letter-spacing: 0.12px;
        }
    }
}

.password-updated-description[b-78c3dbz6et] {
    align-self: stretch;
    margin-bottom: 24px;
}

.invalid-container[b-78c3dbz6et] {
    display: flex;
    padding: 16px;
    flex-direction: column;
    justify-content: center;
    align-items: flex-start;
    gap: 8px;
    align-self: stretch;
    border-radius: 8px;
    background: rgba(232, 52, 52, 0.10);
    margin: 24px 0px;

    .invalid-title {
        display: flex;
        align-items: flex-start;
        gap: 10px;
        align-self: stretch;
        color: var(--Error-red, #E83434);
        font-size: 14px;
        font-style: normal;
        font-weight: 600;
        line-height: normal;
        letter-spacing: 0.14px;
    }

    .invalid-description[b-78c3dbz6et] {
        color: var(--Black, #25252A);
        font-size: 14px;
        font-style: normal;
        font-weight: 400;
        line-height: normal;
        letter-spacing: 0.14px;
    }
}

[b-78c3dbz6et] button {
    width: 100%;
}

[b-78c3dbz6et] .form-element {
    margin-bottom: 24px;
}

[b-78c3dbz6et] .field {
    width: 100%;
}

.content[b-78c3dbz6et] {
    width: 100%;
}

[b-78c3dbz6et] .title-icon {
    position: absolute;
    margin: 8px;
}   

@media (max-width: 768px) {
    [b-78c3dbz6et] button {
        margin: 0px;
    }

    .title[b-78c3dbz6et] {
        line-height: normal !important;
    }

    .info-container[b-78c3dbz6et] {
        gap: 8px;
    }
}
/* _content/Connect.UI.Accounts.Web/Components/Pages/PasswordResetRequest.razor.rz.scp.css */
.edit-email[b-cbq17kzev7] {
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 8px;
    cursor: pointer;
}

.edit-email-text[b-cbq17kzev7] {
    color: var(--Grey, #4F5058);
    font-size: 12px;
    font-style: normal;
    font-weight: 500;
    line-height: normal;
    letter-spacing: 0.36px;
}

.email-sent-to[b-cbq17kzev7] {
    color: var(--Black, #25252A);
    font-size: 14px;
    font-style: normal;
    font-weight: 600;
    line-height: normal;
    letter-spacing: 0.14px;
}

.info-container[b-cbq17kzev7] {
    display: flex;
    padding: 16px;
    flex-direction: column;
    justify-content: center;
    align-items: flex-start;
    gap: 16px;
    align-self: stretch;
    border-radius: 8px;
    background: var(--Light-grey, #F0F2F5);
    margin-bottom: 24px;
}

.forgot-password-description[b-cbq17kzev7] {
    align-self: stretch;
    color: var(--Grey, #4F5058);
    font-size: 14px;
    font-style: normal;
    font-weight: 400;
    line-height: normal;
    letter-spacing: 0.22px;
    margin-bottom: 24px;
}

.title-row[b-cbq17kzev7] {
    display: flex;
    margin-bottom: 16px;
    height: 40px;
    width: 100%;

    .icon-container {
        width: 40px;
        display: flex;

        .icon-bg {
            width: 32px;
            height: 32px;
            transform: rotate(15deg);
            border-radius: 8px;
            background: var(--Blue, #77aeff);
        }
    }

    .title[b-cbq17kzev7] {
        color: var(--Black, #25252a);
        font-size: 16px;
        font-style: normal;
        font-weight: 600;
        line-height: 32px;
        letter-spacing: 0.16px;
        margin-left: 16px;
    }
}

.back-to-login[b-cbq17kzev7] {
    display: flex;
    gap: 8px;
    width: 100%;
    margin-top: 24px;

    span {
        color: var(--Grey, #4F5058);
        font-size: 12px;
        font-style: normal;
        font-weight: 500;
        line-height: normal;
        letter-spacing: 0.36px;
    }
}

[b-cbq17kzev7] button {
    width: 100%;
}

[b-cbq17kzev7] .form-element {
    margin-bottom: 24px;
}

[b-cbq17kzev7] .field {
    width: 100%;
}

.content[b-cbq17kzev7] {
    width: 100%;
}

.button-label[b-cbq17kzev7] {
    color: var(--Black, #25252A);
    font-size: 14px;
    font-style: normal;
    font-weight: 600;
    line-height: normal;
    letter-spacing: 0.14px;
    margin-bottom: 8px;
}

[b-cbq17kzev7] .title-icon {
    position: absolute;
    margin: 8px;
}

@media (max-width: 768px) {
    [b-cbq17kzev7] button {
        margin: 0px;
    }

    .title-row[b-cbq17kzev7] {
        .title {
            line-height: normal !important;
        }
    }
}
/* _content/Connect.UI.Accounts.Web/Components/Pages/Signup.razor.rz.scp.css */
.create-password-description[b-jz3lhk1fkf] {
    align-self: stretch;
    color: var(--Grey, #4F5058);
    font-size: 14px;
    font-style: normal;
    font-weight: 400;
    line-height: normal;
    letter-spacing: 0.22px;
    margin: 16px 0px;
}

.info-container[b-jz3lhk1fkf] {
    display: flex;
    padding: 16px;
    flex-direction: column;
    justify-content: center;
    align-items: flex-start;
    gap: 16px;
    align-self: stretch;
    border-radius: 8px;
    background: var(--Light-grey, #F0F2F5);
    margin-bottom: 24px;

    .must {
        display: flex;
        justify-content: center;
        align-items: center;
        gap: 8px;

        .must-text {
            color: var(--Grey, #4F5058);
            font-size: 12px;
            font-style: normal;
            font-weight: 400;
            line-height: normal;
            letter-spacing: 0.12px;
        }
    }
}

.password-updated-description[b-jz3lhk1fkf] {
    align-self: stretch;
    margin-bottom: 24px;
}

.invalid-container[b-jz3lhk1fkf] {
    display: flex;
    padding: 16px;
    flex-direction: column;
    justify-content: center;
    align-items: flex-start;
    gap: 8px;
    align-self: stretch;
    border-radius: 8px;
    background: rgba(232, 52, 52, 0.10);
    margin: 24px 0px;

    .invalid-title {
        display: flex;
        align-items: flex-start;
        gap: 10px;
        align-self: stretch;
        color: var(--Error-red, #E83434);
        font-size: 14px;
        font-style: normal;
        font-weight: 600;
        line-height: normal;
        letter-spacing: 0.14px;
    }

    .invalid-description[b-jz3lhk1fkf] {
        color: var(--Black, #25252A);
        font-size: 14px;
        font-style: normal;
        font-weight: 400;
        line-height: normal;
        letter-spacing: 0.14px;
    }
}

.title-row[b-jz3lhk1fkf] {
    display: flex;
    height: 40px;
    width: 100%;

    .icon-container {
    width: 40px;
    display: flex;
    
        .icon-bg {
            width: 32px;
            height: 32px;
            transform: rotate(15deg);
            border-radius: 8px;
            background: var(--Blue, #77aeff);
        }
    }

    .title[b-jz3lhk1fkf] {
        color: var(--Black, #25252a);
        font-size: 16px;
        font-style: normal;
        font-weight: 600;
        line-height: 32px;
        letter-spacing: 0.16px;
        margin-left: 16px;
    }
}

.bordered-container[b-jz3lhk1fkf] {
    display: flex;
    width: 342px;
    padding: 16px;
    flex-direction: column;
    align-items: flex-start;
    gap: 8px;
    border-radius: 8px;
    border: 1px solid #D9DDE3;
    
    .copy-to-clipboard {
        width: auto;
    }
}
.description[b-jz3lhk1fkf] {
    margin: 16px 0 16px 0;
}

[b-jz3lhk1fkf] button {
    width: 100%;
}

[b-jz3lhk1fkf] .form-element {
    margin-bottom: 24px;
}

[b-jz3lhk1fkf] .field {
    width: 100%;
}

.content[b-jz3lhk1fkf] {
    width: 100%;
}

[b-jz3lhk1fkf] .title-icon {
    position: absolute;
    margin: 8px;
}   

@media (max-width: 768px) {
    [b-jz3lhk1fkf] button {
        margin: 0px;
    }

    .title[b-jz3lhk1fkf] {
        line-height: normal !important;
    }

    .info-container[b-jz3lhk1fkf] {
        gap: 8px;
    }
}
/* _content/Connect.UI.Accounts.Web/Components/Pages/SignupRequest.razor.rz.scp.css */
.account-exists-description[b-owxxo7mvdz] {
    align-self: stretch;
    margin-bottom: 24px;
}

.buttons[b-owxxo7mvdz] {
    display: flex;
    flex-direction: column;
    gap: 16px;
}

.confirm-email-description[b-owxxo7mvdz] {
    margin-bottom: 24px;
}

.existing-email[b-owxxo7mvdz] {
    display: flex;
    padding: 16px;
    flex-direction: column;
    align-items: flex-start;
    gap: 8px;
    border-radius: 8px;
    border: 1px solid #D9DDE3;
    margin-bottom: 24px;
}

.logo-container[b-owxxo7mvdz] {
    width: 100%;
    height: 40px;

    .logo {
        height: 40px;
        width: 40px;
    }
}

.update-email-text[b-owxxo7mvdz] {
    color: var(--Orange, #FF7446);
    font-size: 12px;
    font-style: normal;
    font-weight: 500;
    line-height: normal;
    letter-spacing: 0.36px;
    cursor: pointer;
}

.user-type-description[b-owxxo7mvdz] {
    align-self: stretch;

    margin-bottom: 24px;
}

.title-row[b-owxxo7mvdz] {
    display: flex;
    margin-bottom: 16px;
    height: 40px;
    width: 100%;

    .icon-container {
        width: 40px;
        display: flex;

        .icon-bg {
            width: 32px;
            height: 32px;
            transform: rotate(15deg);
            border-radius: 8px;
            background: var(--Blue, #77aeff);
        }
    }

    .title[b-owxxo7mvdz] {
        color: var(--Black, #25252a);
        font-size: 16px;
        font-style: normal;
        font-weight: 600;
        line-height: normal;
        letter-spacing: 0.16px;
        margin-left: 16px;
    }
}

[b-owxxo7mvdz] button {
    width: 100%;
}

[b-owxxo7mvdz] .form-element {
    margin-bottom: 24px;
}

[b-owxxo7mvdz] .field {
    width: 100%;
}

.content[b-owxxo7mvdz] {
    width: 100%;
}

.icon-container[b-owxxo7mvdz]  .title-icon {
    position: absolute;
    margin: 8px;
}

.user-type-tile[b-owxxo7mvdz] {
    margin-bottom: 24px;
    cursor: pointer;
}

[b-owxxo7mvdz] .tile {
    width: 100%;
}

@media (max-width: 768px) {
    [b-owxxo7mvdz] button {
        margin: 0px;
    }

    .title-row[b-owxxo7mvdz] {
        .title {
            line-height: normal !important;
        }
    }
}
/* _content/Connect.UI.Accounts.Web/Components/Panels/CallToAction.razor.rz.scp.css */
.trial[b-t6om403s4q] {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 24px;
    margin-top: 45px;
    width: 100%;

    .section-header {
        display: flex;
        justify-content: space-between;
        align-items: center;
        align-self: stretch;

        .icon-title {
            display: flex;
            height: 40px;
            align-items: center;
            gap: 16px;
            position: relative;
        }

    }

    .trial-usps[b-t6om403s4q] {
        position: relative;
        top: -3px;
        display: flex;
        align-items: stretch;
        gap: 16px;
        align-self: stretch;

        .usp {
            display: flex;
            padding: 16px;
            flex-direction: column;
            align-items: flex-start;
            gap: 8px;
            flex: 1 0 0;
            border-radius: 8px;
            border: 1px solid #D9DDE3;

            .title {
                display: flex;
                align-items: center;
                gap: 12px;
                align-self: stretch;
            }

        }
    }
}

@media (max-width: 767px) {
    .trial[b-t6om403s4q] {
        padding: 0 24px;
        align-items: stretch;

        .section-header {
            .icon-title {
                .icon-with-background {
                    svg {
                        width: 16px;
                        height: 16px;
                        flex-shrink: 0;
                    }
                }
            }
        }

        .trial-usps[b-t6om403s4q] {
            flex-direction: column;
            justify-content: center;
            align-items: flex-start;
            gap: 16px;

            .usp {
                align-self: stretch;
            }
        }

        .for-mobile[b-t6om403s4q] {
            display: flex;
            flex-direction: column;
            align-items: stretch;
        }
    }
}

@media (min-width: 1280px) and (max-width: 1535px) {
    .trial[b-t6om403s4q] {
        .trial-usps.gap-container {
            gap: 24px;
        }
    }
}

@media (min-width: 1536px) {
    .trial[b-t6om403s4q] {
        .trial-usps.gap-container {
            gap: 32px;
        }
    }
}
/* _content/Connect.UI.Accounts.Web/Components/Panels/ErrorNotification.razor.rz.scp.css */
.notification[b-xu4c5zhlox] {
    display: flex;
    padding: 16px;
    flex-direction: column;
    justify-content: center;
    align-items: flex-start;
    gap: 8px;
    align-self: stretch;
    border-radius: 8px;
    background: rgba(232, 52, 52, 0.10);

    .title-row {
        display: flex;
        align-items: flex-start;
        gap: 10px;
        align-self: stretch;

        .icon-placement {
            display: flex;
            padding: 0.5px 0px;
            align-items: flex-start;
            gap: 10px;

            svg {
                width: 16px;
                height: 16px;
            }

        }

        .text[b-xu4c5zhlox] {
            display: flex;
            flex-direction: column;
            align-items: flex-start;
            gap: 8px;
            flex: 1 0 0;

            span {
                align-self: stretch;
                font-size: 14px;
                line-height: normal;
                letter-spacing: 0.14px;
            }

            span:first-child[b-xu4c5zhlox] {
                color: var(--Error-red, #E83434);
                font-weight: 600;
            }

            span:last-child[b-xu4c5zhlox] {
                color: var(--Black, #25252A);
                font-weight: 400;
            }

        }
    }
}
/* _content/Connect.UI.Accounts.Web/Components/Panels/Info.razor.rz.scp.css */
.info[b-e2xyi3tdad] {
    width: 100%;
    border: 1px solid #DDE4EF;
    background: #F0F2F5;
    &.rounded-border-top {
        border-radius: 8px 8px 0 0;
    }
    
    &.rounded-border-bottom[b-e2xyi3tdad] {
        border-radius: 0 0 8px 8px;
    }
    
    &.rounded-border-all[b-e2xyi3tdad] {
        border-radius: 8px;
    }
    
    &.no-border-top[b-e2xyi3tdad] {
        border-top: none;
    }

    .content[b-e2xyi3tdad] {
        display: flex;
        padding: 16px;
        flex-direction: column;
        align-items: flex-start;
        gap: 16px;
        align-self: stretch;

        .title {
            display: flex;
            align-items: center;
            gap: 12px;
            align-self: stretch;

            svg {
                width: 16px;
                height: 16px;
            }
        }
    }
}

/* _content/Connect.UI.Accounts.Web/Components/Panels/Notification.razor.rz.scp.css */
.notification[b-e9o2aroev7] {
    display: flex;
    padding: 16px;
    flex-direction: column;
    justify-content: center;
    align-items: flex-start;
    gap: 8px;
    align-self: stretch;
    border-radius: 8px;
    background: rgba(24, 118, 255, 0.10);

    .title-row {
        display: flex;
        align-items: flex-start;
        gap: 10px;
        align-self: stretch;

        .icon-placement {
            display: flex;
            padding: 0.5px 0px;
            align-items: flex-start;
            gap: 10px;

            svg {
                width: 16px;
                height: 16px;
            }

        }

        .text[b-e9o2aroev7] {
            display: flex;
            flex-direction: column;
            align-items: flex-start;
            gap: 8px;
            flex: 1 0 0;

            span {
                align-self: stretch;
                font-size: 14px;
                line-height: normal;
                letter-spacing: 0.14px;
            }

            span:first-child[b-e9o2aroev7] {
                color: var(--Message-blue, #1876FF);
                font-weight: 600;
            }

            span:last-child[b-e9o2aroev7] {
                color: var(--Black, #25252A);
                font-weight: 400;
            }

        }
    }
}
/* _content/Connect.UI.Accounts.Web/Components/Panels/WarningToast.razor.rz.scp.css */
.toast[b-zq9kzzzq9c] {
    position: absolute;
    top: 16px;
    margin: auto;
    display: inline-flex;
    padding: 16px;
    align-items: center;
    gap: 16px;
    border-radius: 8px;
    background: var(--Error-red, #E83434);

    .title {
        display: flex;
        align-items: flex-start;
        gap: 12px;
        align-self: stretch;

        .icon-spacer {
            display: flex;
            padding: 1.5px 0px;
            align-items: center;
            gap: 10px;
        }
    }
}
/* _content/Connect.UI.Accounts.Web/Components/Typography/Button1.razor.rz.scp.css */
span[b-k6017md02e] {
    font-size: 16px ;
    font-weight: 600;
    line-height: normal;
    letter-spacing: 0.48px;
}
/* _content/Connect.UI.Accounts.Web/Components/Typography/Button2.razor.rz.scp.css */
span[b-k5xkj91kmp] {
    font-size: 14px ;
    font-weight: 600;
    line-height: normal;
    letter-spacing: 0.42px;
}
/* _content/Connect.UI.Accounts.Web/Components/Typography/Button3.razor.rz.scp.css */
span[b-2fqykpr72n] {
    font-size: 12px;
    font-weight: 500;
    line-height: normal;
    letter-spacing: 0.36px;
}
/* _content/Connect.UI.Accounts.Web/Components/Typography/CaptionBold.razor.rz.scp.css */
span[b-qnyqopzj5n] {
    font-size: 12px;
    font-weight: 600;
    line-height: normal;
    letter-spacing: 0.12px;
}