body > .content {
    align-items: center;
    display: flex;
    border-radius: var(--tokens-radius-radius-md);
    background: var(--colors-color-neutral-white);
    justify-content: center;
    width: fit-content;
    height: fit-content;
    margin: auto;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    position: absolute;
}

.ui.header > .sub.header {
    white-space: normal !important;
}

.ui.segment {
    align-items: center;
    justify-content: center;
    background-color: var(--colors-color-neutral-white);
    padding: var(--tokens-spacing-spacing-xl);
    border: none !important;
    width: 416px;
    height: fit-content;
    box-shadow: var(--shadow-10);
}

.ui.segment > .ui.backButton.button {
    position: absolute;
    top: 38px;
    left: -18px;
    background-color: var(--colors-color-neutral-white);
}

.ui.segment > img {
    width: 115.77px !important;
    height: 48px !important;
    border-radius: unset !important;
}

.ui.segment .ui.form {
    align-items: flex-start;
    display: flex;
    flex-direction: column;
    gap: var(--tokens-spacing-spacing-md);
    position: relative;
    width: 100%;
}

.ui.segment .ui.form > .field {
    width: 100% !important;
    color: var(--colors-color-neutral-black);
    font-family: var(--body-15-regular-font-family);
    font-size: var(--body-15-regular-font-size);
    font-style: var(--body-15-regular-font-style);
    font-weight: var(--body-15-regular-font-weight);
    letter-spacing: var(--body-15-regular-letter-spacing);
    line-height: var(--body-15-regular-line-height);
}

.ui.segment .ui.form > .field b {
    width: 100% !important;
    color: var(--colors-color-neutral-black);
    font-family: var(--body-15-medium-font-family);
    font-size: var(--body-15-medium-font-size);
    font-style: var(--body-15-medium-font-style);
    font-weight: var(--body-15-medium-font-weight);
    letter-spacing: var(--body-15-medium-letter-spacing);
    line-height: var(--body-15-medium-line-height);
}

.ui.segment .ui.form > .rememberMe.field {
    align-items: center;
    align-self: stretch;
    display: flex;
    justify-content: space-between;
}

.ui.segment .ui.form > .rememberMe.field:not(:has(>.item)) {
    justify-content: flex-end !important;
}

.ui.segment .ui.form > .rememberMe.field > .item {
    width: auto;
}

.ui.segment .ui.form > .captcha.field {
    align-items: center;
    align-self: stretch;
    display: flex;
    flex-direction: column;
    border-radius: var(--tokens-radius-radius-xs);
    background-color: var(--colors-color-neutral-gray-background);
}

.ui.segment .ui.form > .captcha.field > captcha,
.ui.segment .ui.form > .captcha.field > .recapthca {
    padding: var(--tokens-spacing-spacing-sm);
}

.ui.segment > .ui.label {
    align-items: center;
    align-self: center;
    display: flex;
    width: 72px;
    height: 72px;
    padding: var(--tokens-spacing-spacing-sm);
    justify-content: center;
}

.ui.segment > .ui.label > .icon {
    width: 32px;
    height: 32px;
}

.ui.segment > .ui.form .field.step {
    align-items: flex-start;
    align-self: stretch;
    display: flex;
    gap: var(--tokens-spacing-spacing-md);
}

.ui.segment > .ui.form .field.step > .ui.blue.label {
    color: var(--colors-color-brand-primary);
    justify-content: center;
    flex-shrink: 0;
}

.ui.segment > .ui.form .field.step > .stepTwo {
    display: flex;
    flex-direction: column;
    gap: var(--tokens-spacing-spacing-xs);
}

.ui.segment > .ui.form .field.step > .qrCode > img {
    width: 80px;
    height: 80px;
    flex-shrink: 0;
}

.ui.segment > .ui.form .field.counter {
    align-items: center;
    background-color: var(--colors-color-neutral-gray-background);
    border-radius: var(--tokens-radius-radius-xs);
    display: flex;
    gap: 10px;
    height: 44px;
    justify-content: center;
    position: relative;
}

.ui.segment > .ui.form .field.counter.timeIsAlmostDone {
    background-color: var(--colors-color-alerts-warning-lighter) !important;
}

.ui.segment > .ui.form .field.counter.timeIsUp {
    background-color: var(--colors-color-alerts-error-lighter) !important;
    gap: var(--tokens-spacing-spacing-md) !important;
    padding: var(--tokens-spacing-spacing-xs) var(--tokens-spacing-spacing-md) var(--tokens-spacing-spacing-xs) var(--tokens-spacing-spacing-md);
}

.ui.segment > .ui.form .field.counter.timeIsUp .content {
    color: var(--colors-color-alerts-error);
    font-family: var(--body-16-medium-font-family);
    font-size: var(--body-16-medium-font-size);
    font-style: var(--body-16-medium-font-style);
    font-weight: var(--body-16-medium-font-weight);
    letter-spacing: var(--body-16-medium-letter-spacing);
    line-height: var(--body-16-medium-line-height);
    position: relative;
    text-align: center;
    white-space: nowrap;
    width: fit-content;
}

.ui.disclaimer.segment {
    display: flex;
    max-height: 360px;
    -ms-overflow-style: none;
    scrollbar-width: none;
    overflow-y: scroll;
    background: unset !important;
    box-shadow: unset !important;
}

.ui.disclaimer.segment > .content {
    max-height: 360px;
    width: 100%;
    border: none !important;
    overflow-y: auto;
    box-sizing: content-box;
    padding-inline-end: var(--tokens-spacing-spacing-md);
    font-size: var(--body-13-regular-font-size);
}

.ui.disclaimer.segment > .content * {
    font-family: var(--body-13-regular-font-family);
    color: inherit;
}

.ui.disclaimer.segment > .content > .ql-editor {
    padding: unset !important;
}

/* Mobile View */
@media screen and (max-width: 767px) {
    body > .content {
        width: 90% !important;
    }

    .ui.segment {
        width: 100% !important;
        padding: var(--tokens-spacing-spacing-lg) !important;
    }

    .ui.disclaimer.segment {
        display: none !important;
    }
}

/* Tablet View */
@media screen and (min-width: 768px) and (max-width: 1024px) {
    body > .content {
        width: 94% !important;
    }

    .ui.segment {
        width: 50% !important;
    }
}