body {
            /* background-image: linear-gradient(to bottom, #038864 0%,#046249 41%,#024A37 76%, #001D15 100%); */
            min-height: 100vh;
        }

        .container { background: none; }

        .login-container {
            width: 84%;
            padding: 1.25rem;
            margin: 0 auto;
            margin-top: 38%;
            background-image: linear-gradient(180deg, #00FFB6 0%, #007150 36%,#007150 100%);
            border-radius: 1rem;
            min-height: 29rem;
            position: fixed;
            top: 0;
            z-index: 9999;
            left: 50%;
            transform: translate(-50%, 0%);
            max-width: 36.75rem;
        }

        /* .logo-area {
            text-align: center;
            margin-bottom: 3.125rem;
        } */

       /* .logo-placeholder {
            width: 12.5rem;
            height: auto;
           
        } */

        .custom-input-group {
            background-color: #327364; /* Lighter green for inputs */
            border-radius: 0.625rem;
            padding: 0.3125rem 0.9375rem;
            margin-bottom: 1.25rem;
            display: flex;
            align-items: center;
            border: none;
        }

        .custom-input-group .input-group-text {
            background-color: transparent;
            border: none;
            color: #B8C5C2; /* Icon color */
            padding-left: 0;
        }

        .custom-input-group .form-control {
            background-color: transparent;
            border: none;
            color: #fff;
            box-shadow: none; /* Remove focus glow */
        }

        .custom-input-group .form-control::placeholder {
            color: #a8c6c0;
        }

		.btnLoginRe{
            width: 100%;
            /* background: linear-gradient(to bottom, #2b6a5d, #1a4d42); */
            background-size:cover;
            background-position: center;
            border: none;
            color: #fff;
            padding: 0.75rem;
            border-radius: 0.625rem;
            font-weight: bold;
            font-size: 1.1rem;
            margin-top: 0.625rem;
            box-shadow: 0 0.25rem 0.375rem rgba(0,0,0,0.2);
            margin-bottom: 2rem;
            }
			
        .btn-register,.btn-register:hover{
			color: #fff;
			background-image:url('../../img/common/registerBtn.png');
			background-size: 100% 100%;
			}
		.btn-login,.btn-login:hover{
			background-image:url('../../img/common/logoBtn.png');
		background-size: 100% 100%;color: #fff;}
        /* .btnLoginRe:hover {
            background: linear-gradient(to bottom, #358272, #205e51);
            color: #fff;
        } */
.btnOk{font-weight: normal;}
		.btnOk .iconfont{color: #DC9152;}
		.btnOk span{padding-left: 0.2rem;font-size: 1.2rem;}
        .eye-icon {
            cursor: pointer;
            color: #a8c6c0;
        }
		.navigation {
			margin-top: 2.5rem;
			margin-bottom: 1.875rem;
			font-size: 1.3rem;
		}
		.nav-tabs .nav-link{color: #fff;}
		.nav-item-con {
			background: none;
			height: 100%;
			width: 50%;
			/* box-shadow: 0 0.125rem 0 #218E75; */
			text-align: center;
		}
		.navigation .nav{border: none;}
		/* 2px */
		.nav-item-con .nav-link{background-color: none;}
		.nav-item-con.active {
			background: none;
			border-radius: 0;
			color: #FFEE00;
			border: none;
			font-weight: 500;
		}
		.closeLo{position: absolute;right: 0.8rem;top: 0.5rem;}
.closeLo .iconfont{font-size: 2.4rem;}
 /* 错误状态下的输入框容器：红框 */
    .custom-input-group.is-invalid {
        border: 1px solid #d32f2f !important; /* 红色边框 */
        /* box-shadow: 0 0 5px rgba(211, 47, 47, 0.5); 可选：加点红光 */
    }

    /* 错误提示文字 */
    .error-message {
        color: #d32f2f; /* 红色文字 */
        font-size: 0.85rem;
        margin-top: -15px; /* 紧贴上一行 */
        margin-bottom: 15px;
        padding-left: 5px;
        text-align: left;
    }
/* 当遮罩显示时的动画 */
        .verlayMaskLogin.show {
            pointer-events: all;
            opacity: 1;
        }
        
        .verlayMaskLogin.show .mask-background {
            animation: fadeIn 0.6s ease forwards;
        }
        
        .verlayMaskLogin.show .mask-content {
            animation: slideUp 0.5s ease forwards 0.2s;
        }
		/* 动画定义 */
		@keyframes fadeIn {
		    0% {
		        opacity: 0;
		    }
		    100% {
		        opacity: 1;
		    }
		}
		
		@keyframes slideUp {
		    0% {
		        transform: scale(0.7) translateY(50px);
		        opacity: 0;
		    }
		    100% {
		        transform: scale(1) translateY(0);
		        opacity: 1;
		    }
		}