Ao ponto que somos apresentados à funcionalidade paciente.classList.add("paciente-invalido" e troco pela utilização passada anterior a esta (paciente.style.backgroundColor = "lightcoral";) o site volta a "cara" inicial, com o titulo padrão "Aparecida Nutrição" e sem a consideração dos dados de contas de imc que fizemos e ainda temos no codigo do JS.

Só estou mudando isso no código. E obviamente incluindo a alteração de background-color no css nessa nova classe que criamos, fora isso tudo esta funcionando, mas quando incluo a nova lógica o site simplesmente desconsidera todo resto por algum motivo.

Segue respectivamente as partes convenientes a que me refiro:

HTML:

<tbody id="tabela-pacientes">
                        <tr class="paciente" >
                            <td class="info-nome">Paulo</td>
                            <td class="info-peso">100</td>
                            <td class="info-altura">2.00</td>
                            <td class="info-gordura">10</td>
                            <td class="info-imc">0</td>
                        </tr>

                        <tr class="paciente" >
                            <td class="info-nome">João</td>
                            <td class="info-peso">80</td>
                            <td class="info-altura">1.72</td>
                            <td class="info-gordura">40</td>
                            <td class="info-imc">0</td>
                        </tr>

                        <tr class="paciente" >
                            <td class="info-nome">Erica</td>
                            <td class="info-peso">54</td>
                            <td class="info-altura">1.64</td>
                            <td class="info-gordura">14</td>
                            <td class="info-imc">0</td>
                        </tr>

                        <tr class="paciente">
                            <td class="info-nome">Douglas</td>
                            <td class="info-peso">85</td>
                            <td class="info-altura">1.73</td>
                            <td class="info-gordura">24</td>
                            <td class="info-imc">0</td>
                        </tr>
                        <tr class="paciente" >
                            <td class="info-nome">Tatiana</td>
                            <td class="info-peso">46</td>
                            <td class="info-altura">1.55</td>
                            <td class="info-gordura">19</td>
                            <td class="info-imc">0</td>
                        </tr>
                    </tbody>

CSS:

.paciente-invalido{
    background-color: lightcoral;
}

JS:

var titulo = document.querySelector(".titulo");
titulo.textContent = "Novinha Nutricionista";


var pacientes = document.querySelectorAll(".paciente");


for(var i = 0; i < pacientes.length ; i++){

    var paciente = pacientes[i];

    var tdPeso = paciente.querySelector(".info-peso");
    var peso = tdPeso.textContent;

    var tdAltura = paciente.querySelector(".info-altura")
    var altura = tdAltura.textContent;

    var tdImc = paciente.querySelector(".info-imc");


    var alturaEhValida = true;
    var pesoEhValido = true;

    if(peso <= 0 || peso >= 1000){
        console.log("Peso inválido");
        pesoEhValido = false;
        tdImc.textContent = "Peso inválido!";
        paciente.classList.add("paciente-invalido");
    }

    if(altura <= 0 || altura >= 3.00){
        console.log("Altura inválida");
        alturaEhValida = false;
        tdImc.textContent = "Altura inválida!";
         paciente.classList.add("paciente-invalido");

    if (alturaEhValida && pesoEhValido) {

        var imc = peso / (altura * altura);
        tdImc.textContent = imc.toFixed(2);
    }
}

Alguém pode me ajudar a identificar porque acontece isso?