A Trindade da Web

A regra de ouro de um projeto profissional: O HTML estrutura, o CSS veste e o JavaScript orquestra. Não use o JavaScript para injetar dezenas de estilos e cores complexas diretamente no elemento (`style.backgroundColor`). O correto é criar classes bem definidas no seu Tailwind ou arquivo CSS, e usar o JS apenas como um maestro, ativando e desativando classes quando o usuário interagir.

script.js
// ❌ Jeito Frágil (Hardcoded)
function exibirErroHardcoded() {
  const modal = document.querySelector('#modal');
  modal.style.display = 'block';
  modal.style.backgroundColor = 'red';
  modal.style.color = 'white';
}

// ✅ Jeito Escalável (Tailwind ou Bootstrap gerenciam a beleza)
function exibirErroElegante() {
  const modal = document.querySelector('#modal');
  // O JS só diz "Adicione a classe de erro animado"
  modal.classList.add('alerta-erro-vermelho', 'fade-in'); 
}
Card 1 de 2