fix: prevent nested CSS in components

The Angular encapsulation currently does not support CSS nesting syntax, which can lead to run-time errors or unexpected behavior when such styles are used in component stylesheets. This change ensures that nested CSS rules flattened to maintain compatibility with the compiler.

For more context, see: angular/angular#58996

Author: alan-agius4

src/lib/styles/stylesheets/bundle-options.ts

@@ -68,5 +68,10 @@ export function createStylesheetBundleOptions(
     // Preprocessor specific behavior is handled in each stylesheet language plugin.
     resolveExtensions: [],
     plugins,
+    // Angular encapsulation does not support nesting
+    // See: https://github.com/angular/angular/issues/58996
+    supported: {
+      nesting: false,
+    },
   };
 }