*{
    margin: 0;
    padding: 0;
}

body {
    font-family: Arial, sans-serif;
    margin: 0;
    padding: 0;
    background-color: #f4f4f4;
    color: #333;
}


footer {
    background-color: #037786;
    color: #fff;
    padding: 20px 10%;
    text-align: center;
}

footer p {
    margin: 0;
    font-size: 1em;
}

footer>div>p{
    color: #fff !important;
}
.messages {
    list-style-type: none;
    padding: 0;
    margin: 0;
}

.message {
    padding: 10px;
    border: 1px solid transparent;
    border-radius: 4px;
    margin-bottom: 10px;
}

.message.success {
    color: #155724;
    background-color: #d4edda;
    border-color: #c3e6cb;
}

.link_login {
    color: #fff;
    font-weight: bold;
    float: right;
    margin-top: -20px;
    margin-right: -40px;
}

.nav_item_login {
    background: #004750;
    float: right;
    right: 0;
    border-radius: 4px;
    transition: 0.5s;
}

.nav_item_login:hover {
    border: 1px solid #fecd28;
}

form.form_person{
    width: 50%;
    margin: auto;
    border: 1px solid #ccc;
    padding: 1rem;
    background: #fff;
    border-radius: 4px;
}

form.form_person>h2{
    margin: auto;
    text-align: center;
    border-bottom: 1px solid #037786;
    margin: 0rem 1rem 2rem 1rem;
    color: #000;
}

input{
        /* display: block; */
    width: 100%;
    padding: .375rem .75rem;
    font-size: 1rem;
    font-weight: 400;
    line-height: 1.5;
    color: var(--bs-body-color);
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    background-color: var(--bs-body-bg);
    background-clip: padding-box;
    border: var(--bs-border-width) solid var(--bs-border-color);
    border-radius: var(--bs-border-radius);
    transition: border-color .15s ease-in-out, box-shadow .15s ease-in-out;
}

input[type=button], button {
    color: #fff;
    background: #0d6efd;
    border: 0px solid #0753c5;
    border-radius: 4px;
    padding: 0.4rem;
}
/* Estilo geral para todos os <li> */
li {
    padding: 10px;
    margin-bottom: 10px;
    border-radius: 4px;
    font-size: 16px;
    list-style-type: none;
    color: #fff;
}

/* Mensagem de sucesso */
li.success {
    background-color: #4CAF50; /* Verde */
    border-left: 5px solid #2E7D32;
}

/* Mensagem de erro */
li.error {
    background-color: #F44336; /* Vermelho */
    border-left: 5px solid #C62828;
}

/* Mensagem de informação */
li.info {
    background-color: #2196F3; /* Azul */
    border-left: 5px solid #1565C0;
}

/* Mensagem de alerta/aviso */
li.warning {
    background-color: #FFC107; /* Amarelo */
    border-left: 5px solid #FFA000;
    color: #333; /* Texto escuro para contraste com o amarelo */
}

/* Animação para uma transição suave ao mostrar a mensagem */
li {
    opacity: 0;
    animation: fadeIn 0.5s forwards;
}

@keyframes fadeIn {
    from { opacity: 0; }
    to { opacity: 1; }
}

/* Adicionando ícones antes do texto da mensagem */
li.success::before {
    content: '✔'; /* Ícone de check */
    margin-right: 8px;
}

li.error::before {
    content: '✖'; /* Ícone de erro */
    margin-right: 8px;
}

li.info::before {
    content: 'ℹ'; /* Ícone de informação */
    margin-right: 8px;
}

li.warning::before {
    content: '⚠'; /* Ícone de aviso */
    margin-right: 8px;
}