.form-tabs {
    border: none !important;
    width: 100%;
    overflow: hidden;
}

/**  页面标签 部分**/

.login-form-title {
    color: #2c3e50 !important;

    .active {
        border: none !important;
        position: relative;
        background-color: white;
        margin-bottom: -1px;
        border-radius: 10px 10px 0 0;
        transition: 0s;
        color: #1AA2E7FF !important;
        cursor: default;
    }

    .active::before,
    .active::after {
        position: absolute;
        bottom: 0px;
        content: ' ';
        width: 20px;
        height: 20px;
        border-radius: 100%;
        box-shadow: 0 0 0 40px white;
        transition: 0s;
        opacity: 1;

    }

    .active::before {
        left: -20px;
        clip-path: inset(50% -10px 0 50%);
    }

    .active::after {
        right: -20px;
        clip-path: inset(50% 50% 0 -10px);
    }


    .nav-link {
        color: #666666;
        padding: 10px 16px 8px 16px;
    }

    .nav-link:not(.active):hover {
        color: #303133;
    }
}


/** 表单内容 **/
.login-form__body {
    background: white;
    padding: 20px;
    min-width: 400px;

    .login-form__bottom {
        display: flex;
        flex-direction: column;
        gap: 5px;
        padding: 5px 0;

        .form-check-group {
            display: flex;
            align-items: center;
            justify-content: start;
            padding: 5px 0;

            .form-check-input {
                margin: 0 5px 0 0;
            }
            .login-item-link {
                line-height: 14px;
                font-size: 14px;
                color: #909399 !important;
                text-decoration: none;
                -webkit-user-select: none; /* Chrome, Safari */
                -moz-user-select: none; /* Firefox */
                -ms-user-select: none; /* Internet Explorer/Edge */
                user-select: none;
            }

            .login-item-link:hover {
                color: #409EFF !important;
            }

            .login-item-text {
                font-size: 14px;
                color: #909399 !important;
                line-height: 14px;
                -webkit-user-select: none; /* Chrome, Safari */
                -moz-user-select: none; /* Firefox */
                -ms-user-select: none; /* Internet Explorer/Edge */
                user-select: none;
            }


        }




        .login-submit-button {
            width: 100%;
            height: 42px;
        }

    }
}



.form-item {
    margin-bottom: 10px;
    .form-label {
        font-size: 14px;
        color: #303133;
    }

    .form-item-input {
        outline: none !important;
        height: 42px;
    }

    .form-item-input.is-invalid {
        background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 12' width='12' height='12' fill='none' stroke='%23f56c6c'%3e%3ccircle cx='6' cy='6' r='4.5'/%3e%3cpath stroke-linejoin='round' d='M5.8 3.6h.4L6 6.5z'/%3e%3ccircle cx='6' cy='8.2' r='.6' fill='%23f56c6c' stroke='none'/%3e%3c/svg%3e");
    }

    .form-item-input.is-valid {
        background-image: url("data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1024 1024'><path fill='%23dedfe0' d='M512 896a384 384 0 1 0 0-768 384 384 0 0 0 0 768m0 64a448 448 0 1 1 0-896 448 448 0 0 1 0 896'></path><path fill='%23dedfe0' d='M745.344 361.344a32 32 0 0 1 45.312 45.312l-288 288a32 32 0 0 1-45.312 0l-160-160a32 32 0 1 1 45.312-45.312L480 626.752l265.344-265.408z'></path></svg>");
    }
    .form-btn-sent {
        font-size: 14px;
        width: 110px;
        padding: 0px;
    }
}


.message {
    position: relative;
    min-height: 22px;
    line-height: 22px;
    vertical-align: center;
}

.invalid-feedback {
    margin-top: 0 !important;
}


/***********************************************************/

.common-dialog {
    --bs-modal-header-padding: 15px 10px;
    --bs-border-radius-lg: 5px;
    --bs-modal-width: 600px;

    .modal-header {
        display: flex;
        justify-content: space-between;
        align-items: center;
        border-bottom: none;
        padding: 10px;
    }

    .modal-header .btn-close {
        padding: 0 !important;
        margin-top: 0 !important;
        margin-right: 0 !important;
        margin-bottom: 0 !important;
        margin-left: 0 !important;
    }

    .modal-title {
        font-size: 14px;
        font-weight: bold;
    }

    .modal-body {
        padding: 15px;
        background: #f2f2f2;
        border-radius: 5px;
        margin: 0 10px;
    }

    .modal-footer {
        border-top: none;
        display: flex;
        justify-content: space-between;


        padding: 10px 5px
    }

    .modal-footer .btn {
        flex: 1;

    }

}

/**  **/
.privacy-context {
    font-size: 14px;
    color: #303133;
    line-height: 1.5em;
}

.third-login-wrapper {
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: space-around;
    padding: 10px;


}

.provider-item {
    font-size: 12px;
    margin: 5px;
    color: #606266;
    -webkit-user-select: none; /* Chrome, Safari */
    -moz-user-select: none; /* Firefox */
    -ms-user-select: none; /* Internet Explorer/Edge */
    user-select: none;
}

.provider-logo {
    display: inline;
    height: 20px;
    margin-right: 5px;
}

.provider-item:hover {
    color: #409EFF;
}