/* Login page styles */

body {
    font-family: "Lora", serif;
}


.login-container {
    max-width:500px;
    margin:100px auto;
    padding:30px;
    background-color: #ffffff;
    border:1px solid #cdcdcd;
    border-radius:12px;
    box-shadow: 0 4px 8px rgba(0,0,0,0.1);
}

.fieldset {
    display:block;
    border:none;
    margin:0;
    padding-left:0;
}

@media screen and (max-width: 600px) {
    .login-container {
        width:90%;
        box-shadow: none;
        border:none;
    }
    .login-container h1 {
        font-size:2rem;
        padding-bottom:20px;
    }
    .fieldset {
        margin-right:0px;
    }
}

.login-container h1 {
    text-align:center;
    color:#332d2b;
    font-weight:600;
    margin-bottom:20px;
}

.login-message {
    font-size:1.2rem;
    margin-bottom:20px;
    color:#000;
    text-align:center;
    font-weight:0;
}

.login-group {
    margin-bottom:15px;
    font-weight:600;
}

.login-group input {
    width:100%;
    padding:10px;
    font-size:1rem;
    border:1px solid #ccc;
    border-radius:4px;
}

.button-container {
    display: flex; /* Aligns buttons inline */
    justify-content: space-between; /* Space between Login and Register */
    margin-top: 20px; /* Adds spacing above the buttons */
}

.login-button {
    background-color:#007bff;
    color:#fff;
    text-shadow: 1px 1px 1px #000000;
    max-width:100px;
    border:none;
    border-radius:6px;
    padding:12px 20px;
    transition:background 0.3s ease;
    cursor:pointer;
    font-size:1rem;
}

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

.registration-button {
    background-color:#f4f4f4;
    color:#000;
    max-width:150px;
    border:none;
    border-radius:6px;
    padding:12px 20px;
    transition:background 0.3s ease;
    cursor:pointer;
    font-size:1rem;
    text-decoration:none;
}

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

.password-toggle {
    margin-left: 50px;
    z-index: 2;
}

.send-email-button {
    width:100%;
}