/* Ensure the login container looks clean */
.login-container {
    max-width: 400px; /* Set a fixed width for the login box */
    width: 100%; /* Responsive width */
    margin: auto; /* Center the box horizontally and vertically */
    padding: 30px;
    border: 1px solid #ddd;
    border-radius: 10px;
    box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);
}

/* Right-side content styling */
.content-area {
    text-align: center;
    padding: 20px; /* Add padding */
    max-width: 600px; /* Limit the content width */
    margin: auto; /* Center the content */
}

.text-primary {
    font-size: 2rem;
    font-weight: bold;
}

.text-secondary {
    font-size: 1.1rem;
    color: #6c757d;
}

/* Footer styling */
.footer {
    position: absolute;
    bottom: 10px;
    width: 100%;
    text-align: center;
    font-size: small;
    color: gray;
}

/* Adjust form field width */
.login-field {
    width: 100%;
    max-width: 100%;
}

.forgot-password-container {
    width: 100%; /* Responsive width */
    margin: auto; /* Center the box horizontally and vertically */
    border: 1px solid #ddd;
    border-radius: 10px;
    box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);
}