/* Password strength module */

.passwordStrength-extra {
    margin-top: 11px;
}

.passwordStrength-tip {
    font-family: Source Han Sans CN;
    font-size: 14px;
    font-weight: 400;
    line-height: 18px;
    color: #999999;
}

.passwordStrength-bar {
    display: flex;
    gap: 4px;
    align-items: center;
    margin-top: 15px;
}

.passwordStrength-item {
    flex: 1 1 0;
    width: auto;
    height: 8px;
    background: #EDEEF1;
    border-radius: 4px;
    transition: background-color 0.2s ease;
}

.passwordStrength-item.active.weak {
    background: #fa6262;
}

.passwordStrength-item.active.medium {
    background: #ffa820;
}

.passwordStrength-item.active.strong {
    background: #2bcb69;
}

.passwordStrength-text {
    flex: 0 0 auto;
    min-width: 55px;
    margin-left: 4px;
    font-size: 12px;
    color: #8d929d;
    white-space: nowrap;
}

.passwordStrength-text em {
    font-style: normal;
}

.passwordStrength-text em.weak {
    color: #fa6262;
}

.passwordStrength-text em.medium {
    color: #ffa820;
}

.passwordStrength-text em.strong {
    color: #2bcb69;
}

.passwordStrength-input.strength-weak,
.passwordStrength-input.strength-weak:focus,
.passwordStrength-input.strength-weak:focus-within {
    border-color: #fa6262;
    box-shadow: none;
}

@media only screen and (max-width: 600px) {
    .passwordStrength-tip {
        font-size: 12px;
    }

    .passwordStrength-bar {
        gap: 4px;
    }

    .passwordStrength-text {
        min-width: 52px;
        font-size: 11px;
    }
}
