fix: use appendChild instead of insertBefore for theme styles to ensure correct CSS cascade order

Agent-Logs-Url: https://github.com/IgniteUI/igniteui-angular-samples/sessions/b7433c38-919d-4392-a94a-cb4ae0dbede8

Co-authored-by: viktorkombov <75325639+viktorkombov@users.noreply.github.com>

Author: Copilot

projects/app-lob/src/app/app.component.ts

@@ -62,13 +62,13 @@ export class AppComponent implements OnInit {
         typefaceElem.rel = 'stylesheet';
         typefaceElem.id = 'ignteui-theme-typeface';
         typefaceElem.href = this.typefaceUrl + typeface.split(' ').join('+');
-        this.document.head.insertBefore(typefaceElem, this.document.head.lastElementChild);
+        this.document.head.appendChild(typefaceElem);
     }
 
     private createThemeStyle() {
         this.styleElem = this.document.createElement('style');
         this.styleElem.id = 'igniteui-theme';
-        this.document.head.insertBefore(this.styleElem, this.document.head.lastElementChild);
+        this.document.head.appendChild(this.styleElem);
         this.document.body.classList.add('custom-body');
     }
 }

projects/app-lob/src/app/index/docs-layout.component.ts

@@ -42,7 +42,7 @@ export class DocsLayoutComponent implements OnInit {
     private createThemeStyle() {
         this.styleElem = this.document.createElement('style');
         this.styleElem.id = 'igniteui-theme';
-        this.document.head.insertBefore(this.styleElem, this.document.head.lastElementChild);
+        this.document.head.appendChild(this.styleElem);
         this.document.body.classList.add('custom-body');
     }
 
@@ -51,6 +51,6 @@ export class DocsLayoutComponent implements OnInit {
         typefaceElem.rel = 'stylesheet';
         typefaceElem.id = 'ignteui-theme-typeface';
         typefaceElem.href = this.typefaceUrl + typeface.split(' ').join('+');
-        this.document.head.insertBefore(typefaceElem, this.document.head.lastElementChild);
+        this.document.head.appendChild(typefaceElem);
     }
 }

src/app/app.component.ts

@@ -44,13 +44,13 @@ export class AppComponent implements OnInit {
         typefaceElem.rel = 'stylesheet';
         typefaceElem.id = 'ignteui-theme-typeface';
         typefaceElem.href = this.typefaceUrl + typeface.split(' ').join('+');
-        this.document.head.insertBefore(typefaceElem, this.document.head.lastElementChild);
+        this.document.head.appendChild(typefaceElem);
     }
 
     private createThemeStyle() {
         this.styleElem = this.document.createElement('style');
         this.styleElem.id = 'igniteui-theme';
-        this.document.head.insertBefore(this.styleElem, this.document.head.lastElementChild);
+        this.document.head.appendChild(this.styleElem);
         this.document.body.classList.add('custom-body');
     }
 }