body {
		font-family: Arial, sans-serif;
		margin: 0;
		padding: 0;
		background: url('/modules/common/login/img/company-background.png') no-repeat center center fixed;
		background-size: cover;
		background-color: rgb(252 252 252);
		display: flex;
		justify-content: center;
		align-items: center;
		height: 100vh;
		position: relative;
		overflow: hidden;
	}
	
	.error-message {
            color: red;
            margin-top: 10px;
            font-size: 14px;
        }

        /* Faded overlay effect for background */
	body::before {
		content: "";
		position: absolute;
		top: 0;
		left: 0;
		width: 100%;
		height: 100%;
		background-color: rgba(0, 0, 0, 0.5); /* 50% transparent black overlay */
		z-index: 1;
	}

	/* Login container styling */
	.login-container {
		background-color: rgb(252 252 252); /* Semi-transparent background */
		padding: 60px 40px;
		box-shadow: 0 0 15px rgba(51, 48, 48, 0.3);
		border-radius: 20px;
		width: 400px;
		text-align: center;
		position: relative;
		z-index: 2; /* Ensure it's above the overlay */
	}

	/* Enlarged logo styling */
	.logo {
		width: 200px;
		height: auto;
		margin-bottom: 20px;
	}

	/* Input field styling */
	input[type="text"], input[type="password"] {
		width: 100%;
		padding: 12px;
		margin: 10px 0;
		border: 1px solid #ccc;
		border-radius: 5px;
		font-size: 16px;
	}

	/* Button styling */
	button {
		width: 100%;
		padding: 12px;
		background-color: #007bff;
		color: white;
		border: none;
		border-radius: 5px;
		font-size: 16px;
		cursor: pointer;
		margin-top: 10px;
	}

	button:hover {
		background-color: #0056b3;
	}

	/* Footer link styling */
	.footer {
		margin-top: 15px;
		font-size: 14px;
		color: #555;
	}

	a {
		color: #007bff;
		text-decoration: none;
	}

	a:hover {
		text-decoration: underline;
	}