Use all properties of Bootstrap's input error CSS - twitter-bootstrap-3

Question

I'd like my input to appear the same as Bootstrap's styling for errors. What should this class extend from bootstrap to do this? Including the styling for :focus which is red glow rather than the default blue glow.
.ng-invalid.ng-touched.ng-dirty:not(form) {
// extend bootstrap style?
}
I've used .has-error, this will only work if there is an element further up the tree with the class .has-error which doesn't make sense to me. So this works:
.ng-invalid.ng-touched.ng-dirty:not(form) {
#extend .has-error;
}
HTML
<div class="form-group has-error">
..
<input type="text" class="form-control" required>
</div>
How can I get it to work by having just .has-error applied to the input without putting on the upper level element.

Answer 1

Actually, you can't. This class appears not only for input, but for labels too. That's why .has-error using with .form-group.
Same question as yours.
You can just create new class and add styles straight to your input:
.some-class:focus {
border-color: #843534;
-webkit-box-shadow: inset 0 1px 1px rgba(0,0,0,.075), 0 0 6px #ce8483;
box-shadow: inset 0 1px 1px rgba(0,0,0,.075), 0 0 6px #ce8483;
}
.some-class {
border-color: #a94442;
-webkit-box-shadow: inset 0 1px 1px rgba(0,0,0,.075);
box-shadow: inset 0 1px 1px rgba(0,0,0,.075);
}