What is encapsulation in Angular components?

encapsulation in Angular components determines how a component's styles are applied to the DOM and isolated from other components.

Angular supports three modes:

1. ViewEncapsulation.Emulated (default) - the component's styles are virtually isolated by adding attributes to elements. They apply only inside the component, but the browser sees regular CSS.
2. ViewEncapsulation.None - the component's styles are global and affect all elements in the application, there is no isolation.
3. ViewEncapsulation.ShadowDom - uses the browser's native Shadow DOM; styles are fully isolated and do not affect other components.

The main purpose of encapsulation is to control the scope of CSS and prevent style conflicts between components.