function mensagensVazias(errorMessageElement, usernameElement, passwordElement) {


    errorMessageElement.innerHTML = `<p>Preencha ambos os campos</p>`;//mensagem de erro padrão

    usernameElement.style.borderColor = 'red';//corpo do input usuario em vermelho.
    passwordElement.style.borderColor = 'red';//corpo do input senha em vermelho.

    errorMessageElement.style.height = '10vh';//Altura do bloco de apresentação
    errorMessageElement.style.opacity = '1';//Opacidade do bloco de apresentação
    errorMessageElement.style.transition = '1s ease';//transição

    setTimeout(() => {//Aplicação de tempo para retirar os efeitos

        errorMessageElement.style.height = '0vh'; // Reduz o tamanho do bloco para  Oculta a mensagem
        usernameElement.style.borderColor = '#1478cf'; //volta a cor do inptu, de usuário ao seu padrão
        passwordElement.style.borderColor = '#1478cf';
        //volta a cor do inptu, de senha ao seu padrão
        errorMessageElement.style.opacity = '0'; // define a opacidade do painel de erro a zero
        errorMessageElement.style.transition = '1s ease'; // define uma tansição suave para tudo isso.
    }, 5000); //definie um time de 5 segundos, contados em milesegundos 5.000

}

async function RespostasErro(comunica, response, errorMessageElement, usernameElement, passwordElement) {


    /*Caso erro, onde o email usado é invalido*/
    if (comunica === 400) {


        errorMessageElement.innerHTML = `<p>O E-mail usado é invalido, o formato esperado é "usuario@domino.com.br"</p>`;

        errorMessageElement.classList.add('Status_400')


        errorMessageElement.style.height = '10vh';
        errorMessageElement.style.opacity = '1';

        usernameElement.style.borderColor = 'red'; // Marca o campo do usuário com erro
        errorMessageElement.style.transition = ' 1s ease';

        const tempoDeExibicao = 5000;
        setTimeout(() => {

            errorMessageElement.classList.remove('Status_400')

            usernameElement.style.borderColor = '#1478cf'; // Marca o campo do usuário com erro
            errorMessageElement.style.height = '0vh'; // Oculta a mensagem
            errorMessageElement.style.opacity = '0';
            errorMessageElement.style.transition = ' 1s ease';
        }, tempoDeExibicao);

    }

    /*Caso erro, quando há um erro na autenticação com o banco de dados*/
    if (comunica === 401) {

        errorMessageElement.innerHTML = `<p>Erro na autenticação, informe ao suporte, no e-mail suporte@itguys.com.br</p>`;

        errorMessageElement.classList.add('Status_401')


        errorMessageElement.style.height = '10vh';
        errorMessageElement.style.opacity = '1';
        errorMessageElement.style.transition = ' 1s ease';

        const tempoDeExibicao = 5000;
        setTimeout(() => {

            errorMessageElement.classList.remove('Status_401')

            errorMessageElement.style.height = '0vh'; // Oculta a mensagem
            errorMessageElement.style.opacity = '0';
            errorMessageElement.style.transition = ' 1s ease';
        }, tempoDeExibicao);

    }

    /*Caso erro, onde o usuário ou senha podem estar incorretos*/
    if (comunica === 404) {

        errorMessageElement.innerHTML = `<p>Usuário ou Senha, estão incorretos</p>`;


        errorMessageElement.style.height = '10vh';
        errorMessageElement.style.opacity = '1';

        errorMessageElement.classList.add('Status_404')


        usernameElement.style.borderColor = 'red'; // Marca o campo do usuário com erro
        passwordElement.style.borderColor = 'red'; // Marca o campo da senha com erro
        errorMessageElement.style.transition = ' 1s ease';

        const tempoDeExibicao = 5000;
        setTimeout(() => {

            errorMessageElement.classList.remove('Status_404')

            usernameElement.style.borderColor = '#1478cf'; // Marca o campo do usuário com erro
            passwordElement.style.borderColor = '#1478cf'; // Marca o campo da senha com erro
            errorMessageElement.style.height = '0vh'; // Oculta a mensagem
            errorMessageElement.style.opacity = '0';
            errorMessageElement.style.transition = ' 1s ease';
        }, tempoDeExibicao);

    }

    /*Caso erro, onde o usuário ou senha podem estar incorretos*/
    if (comunica === 500) {

        errorMessageElement.innerHTML = `<p>Estamos enfrentando dificuldades técnicas no momento. Por favor, tente novamente mais tarde.</p>`;


        errorMessageElement.style.height = '10vh';
        errorMessageElement.style.opacity = '1';


        errorMessageElement.classList.add('Status_500')

        usernameElement.style.borderColor = 'red'; // Marca o campo do usuário com erro
        passwordElement.style.borderColor = 'red'; // Marca o campo da senha com erro
        errorMessageElement.style.transition = ' 1s ease';

        const tempoDeExibicao = 5000;
        setTimeout(() => {

            errorMessageElement.classList.remove('Status_500')

            usernameElement.style.borderColor = '#1478cf'; // Marca o campo do usuário com erro
            passwordElement.style.borderColor = '#1478cf'; // Marca o campo da senha com erro
            errorMessageElement.style.height = '0vh'; // Oculta a mensagem
            errorMessageElement.style.opacity = '0';
            errorMessageElement.style.transition = ' 1s ease';
        }, tempoDeExibicao);

    }

    /*Caso de erro especial, que é apresentado em um pop up, essa estrutura pega a informações da resposta em json e os apresenta sobre o pop up na tela*/

    /*Caso de erro, onde acontece um problema na comunicação com o proprio servidor*/
    if (comunica === 503) {

        errorMessageElement.innerHTML = `<p>Estamos realizando manutenções necessárias. Agradecemos por sua compreensão.</p>`;

        errorMessageElement.style.height = '15vh';
        errorMessageElement.style.opacity = '1';

        errorMessageElement.classList.add('Status_503')

        errorMessageElement.style.transition = ' 1s ease';

        const tempoDeExibicao = 5000;
        setTimeout(() => {

            errorMessageElement.classList.remove('Status_503')

            errorMessageElement.style.height = '0vh'; // Oculta a mensagem
            errorMessageElement.style.opacity = '0';
            errorMessageElement.style.transition = ' 1s ease';
        }, tempoDeExibicao);

    }

    /*Caso de erro, onde acontece um problema na comunicação com o proprio servidor*/
    if (comunica === 502) {

        errorMessageElement.innerHTML = `<p> Houve um problema ao processar sua solicitação. Estamos trabalhando para corrigir a situação. </p>`;

        errorMessageElement.style.height = '15vh';
        errorMessageElement.style.opacity = '1';

        errorMessageElement.classList.add('Status_502')

        errorMessageElement.style.transition = ' 1s ease';

        const tempoDeExibicao = 5000;
        setTimeout(() => {

            errorMessageElement.classList.remove('Status_502')

            errorMessageElement.style.height = '0vh'; // Oculta a mensagem
            errorMessageElement.style.opacity = '0';
            errorMessageElement.style.transition = ' 1s ease';
        }, tempoDeExibicao);

    }


}