/* Pagina de Login */

.form-container {
    margin-left: 8%;
    display: flex; /* Use flexbox for layout */
    flex-grow: 1; /* Allow form container to grow and fill space */
}

.background-image {
    width: 500px; /* Fixed width for background image */
    height: 500px; /* Fixed height for background image */
}

.form-content {
    position: relative; /* Positioning for form content */
    background-color: white;
    padding: 30px; /* Added padding for better spacing */
    border-radius: 10px; /* Rounded corners */
    margin-right: 20px; /* Space between form and background image */
    flex-grow: 1; /* Allow form content to grow and fill space */
}

.subtitle {
    color: #0a5cb8; /* Updated subtitle color */
    font-size: 26px;
    margin-bottom: 10px; /* Space below subtitle */
}

.blue-line {
    width: 100%;
    height: 1px; /* Thickness of the line */
    background-color: #0a5cb8; /* Updated line color */
    margin-bottom: 6px; /* Space below line */
}

.alerta {
    color: tomato;
    font-weight: bold;
}

.texto-alerta {
    color: #4b87cb;
    margin-bottom: 22px;
}

.label {
    color: #5f6368;
    margin-bottom: 5px; /* Space below label */
    font-weight: bold; /* Make label bold */
}

.input-field {
    width: calc(100% - 20px); /* Full width minus padding */
    padding: 10px;
    margin-top: 5px;
    margin-bottom: 15px; /* Space between inputs */
    border-radius: 5px; /* Rounded corners */
    border: 1px solid #ccc; /* Border color */
    background-color: #f2f0f0; /* Updated input background color */
}

.checkbox-container {
   margin-bottom: 15px; /* Space below checkbox */
   display: flex; 
   align-items: center; 
}

.submit-button {
   width: 100px;
   padding: 10px;
   background-color: #0a5cb8; /* Updated button color */
   color: white; /* Text color */
   border-radius: 5px; /* Rounded corners */
   border: none; /* Remove border */
   cursor: pointer; /* Pointer on hover */
   font-size: 16px; /* Font size */
   transition: background-color 0.3s ease; /* Smooth transition on hover */
}

.submit-button:hover {
   background-color: #3482da; /* Darker blue on hover (optional) */
}



/* Pagina de Confirmação de Logout */

.confirm-button,
.cancel-button {
    padding: 10px 20px;
    font-size: 16px;
    border: none;
    border-radius: 5px;
    cursor: pointer;
}

.confirm-button {
    background-color: #d9534f; /* Cor de fundo do botão 'Sim' */
    color: white;
}

.cancel-button {
    background-color: #5bc0de; /* Cor de fundo do botão 'Não' */
    color: white;
}

.confirm-button:hover {
    background-color: #c9302c;
}

.cancel-button:hover {
    background-color: #31b0d5;
}

@media only screen and (max-width: 1400px) {

    .form-container {
        margin-left: 10px;
    }

    .background-image {
        width: 400px; /* Fixed width for background image */
        height: 400px; /* Fixed height for background image */
    }

}

@media only screen and (max-width: 950px) {

    .form-container {
        flex-direction: column;
    }

    .div_background-image {
        text-align: center;
    }
}
