I'm wondered by answers we have clear attribute to get empty input boxes, take a look at this code
/*empty input*/
input:empty{
border-color: red;
}
/*input with value*/
input:not(:empty){
border-color: black;
}
UPDATE
input, select, textarea {
border-color: @green;
&:empty {
border-color: @red;
}
}
More over for having a great look in the validation
input, select, textarea {
&[aria-invalid="true"] {
border-color: amber !important;
}
&[aria-invalid="false"], &.valid {
border-color: green !important;
}
}