Para destacar apenas os inputs que são obrigatórios:
/* Aplicar o vermelho apenas em campos obrigatórios válidos quando não estão focados*/
input[required]:invalid:not(:focus),
textarea[required]:invalid:not(:focus),
select[required]:invalid:not(:focus){
border-color: red;
}
/* Aplicar o verde apenas em campos obrigatórios válidos */
input[required]:valid,
textarea[required]:valid,
select[required]:valid{
border-color: #2ecc71;
}
Para destacar o checkbox de consentimento com a pesquisa:
/* muda a cor da label para vermelho se o checkbox estiver desmarcado*/
input[type="checkbox"][required]:invalid + label{
color: #e74c3c;
font-weight: bold;
}
/* coloca uma borda verde no checkbox quando marcado */
input[type="checkbox"][required]:valid{
outline: 2px solid #2ecc71;
outline-offset: 2px;
}
adiciona uma borda azul quando os campos forem focados
/* azul ao focar (sobrepõe vermelho, mas não o verde) */
input:focus,
textarea:focus,
select:focus{
border-color: #3498db;
box-shadow: 0 0 0 4px rgba(52,152,219,0.12);
outline: none;
}