/* CSS styles for the login container */

.login-container { display: flex; justify-content: center; align-items: center; height: 100vh; background-color: #f4f4f4; font-family: ‘Arial’, sans-serif; /* Use a suitable font-family */ }

.login-container .card { background-color: #fff; padding: 20px; border-radius: 10px; box-shadow: 0 0 10px rgba(0, 0, 0, 0.1); }

.login-container .card h3 { text-align: center; color: #333; margin-bottom: 20px; }

.login-container .card .Email, .login-container .card .Password { margin-bottom: 15px; }

.login-container .card input { width: 100%; padding: 10px; border: 1px solid #ccc; border-radius: 5px; font-size: 16px; outline: none; }

.login-container .card input::placeholder { color: #999; }

.login-container .card .Buttons button { width: 100%; padding: 12px; background-color: #4caf50; color: #fff; border: none; border-radius: 5px; cursor: pointer; font-size: 18px; transition: background-color 0.3s ease; }

.login-container .card .Buttons button:hover { background-color: #45a049; }