@nettyapps/ntybase 21.0.28 → 21.0.31

package/fesm2022/nettyapps-ntybase.mjs

@@ -1,24 +1,24 @@
 import * as i0 from '@angular/core';
-import { Component, Injectable, inject, NgModule, Inject, signal, input, output, computed, effect, model, ViewChild, InjectionToken, Optional, Input, makeEnvironmentProviders, provideAppInitializer } from '@angular/core';
-import * as i1$3 from '@angular/common/http';
+import { Component, Injectable, inject, NgModule, signal, input, output, computed, effect, ViewChild, model, InjectionToken, Optional, Inject, Input, makeEnvironmentProviders, provideAppInitializer } from '@angular/core';
+import * as i1$2 from '@angular/common/http';
 import { HttpErrorResponse, HttpResponse, HTTP_INTERCEPTORS, HttpClient, HttpHeaders } from '@angular/common/http';
 import { of, throwError, lastValueFrom, map, catchError as catchError$1, Subject, finalize, take as take$1, takeUntil } from 'rxjs';
 import { catchError, map as map$1, take, finalize as finalize$1 } from 'rxjs/operators';
 import { Router, ActivatedRoute } from '@angular/router';
 import * as i2$1 from '@nettyapps/ntycontract';
 import { EnvironmentProxy } from '@nettyapps/ntycontract';
-import { DatePipe, Location, DecimalPipe } from '@angular/common';
+import { DatePipe, CommonModule, Location, DecimalPipe } from '@angular/common';
 import { toSignal } from '@angular/core/rxjs-interop';
 import { Buffer } from 'buffer';
 import * as i1 from '@angular/material/dialog';
-import { MAT_DIALOG_DATA, MatDialogModule, MatDialog, MatDialogRef } from '@angular/material/dialog';
+import { MatDialogRef, MAT_DIALOG_DATA, MatDialogModule, MatDialog } from '@angular/material/dialog';
 import * as i3 from '@angular/material/divider';
 import { MatDividerModule } from '@angular/material/divider';
 import * as i2 from '@angular/material/icon';
 import { MatIconModule } from '@angular/material/icon';
-import * as i1$2 from '@angular/material/snack-bar';
+import * as i1$1 from '@angular/material/snack-bar';
 import { MatSnackBarModule } from '@angular/material/snack-bar';
-import * as i1$1 from '@ngx-translate/core';
+import * as i3$1 from '@ngx-translate/core';
 import { TranslateModule, TranslateService } from '@ngx-translate/core';
 import { Mutex } from 'async-mutex';
 import { ModuleRegistry, AllCommunityModule, ClientSideRowModelModule, HighlightChangesModule, themeQuartz } from 'ag-grid-community';
@@ -29,9 +29,9 @@ import * as i2$3 from '@angular/material/menu';
 import { MatMenuModule } from '@angular/material/menu';
 import * as XLSX from 'xlsx';
 import { I18nService } from '@nettyapps/ntyi18n';
-import * as i1$4 from '@angular/forms';
+import * as i1$3 from '@angular/forms';
 import { FormBuilder, Validators, FormsModule, ReactiveFormsModule } from '@angular/forms';
-import * as i3$1 from '@angular/material/input';
+import * as i3$2 from '@angular/material/input';
 import { MatInputModule } from '@angular/material/input';
 import { MatFormFieldModule } from '@angular/material/form-field';
 
@@ -384,14 +384,10 @@ class CurrentUserPreference {
 }
 
 class ConfirmDialog {
-    dialogRef;
-    data;
-    constructor(dialogRef, data) {
-        this.dialogRef = dialogRef;
-        this.data = data;
-    }
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.6", ngImport: i0, type: ConfirmDialog, deps: [{ token: i1.MatDialogRef }, { token: MAT_DIALOG_DATA }], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.0.6", type: ConfirmDialog, isStandalone: true, selector: "ntybase-confirm-dialog", ngImport: i0, template: "<div class=\"dialog-container\">\n  <h2 mat-dialog-title class=\"dialog-title\">\n    <mat-icon color=\"warn\" class=\"warning-icon\">warning</mat-icon>\n    <span>{{data.title}}</span>\n  </h2>\n\n  <mat-divider class=\"divider\"></mat-divider>\n\n  <mat-dialog-content class=\"dialog-content\">\n    <p class=\"message\">{{data.message}}</p>\n  </mat-dialog-content>\n\n  <mat-dialog-actions align=\"end\" class=\"dialog-actions\">\n    <button mat-stroked-button [mat-dialog-close]=\"false\" class=\"btn-cancel\">\n      {{'@btnCancel' | translate}}\n    </button>\n    <button\n      mat-flat-button\n      color=\"warn\"\n      [mat-dialog-close]=\"true\"\n      class=\"btn-ok\"\n    >\n      {{'@btnOK' | translate}}\n    </button>\n  </mat-dialog-actions>\n</div>\n", styles: [".dialog-container{display:flex;flex-direction:column;min-width:400px;max-width:90vw;padding:24px;border-radius:12px!important}.dialog-title{display:flex;align-items:center;margin:0 0 12px;padding:0;color:var(--mat-sys-primary)}.dialog-title span{margin-left:8px}.warning-icon{color:var(--mat-sys-primary);transform:scale(1.2)}.divider{margin:8px 0 16px;border-top-color:var(--mat-sys-primary)}.dialog-content{padding:8px 0 24px;margin:0;color:var(--mat-sys-primary);line-height:1.6}.dialog-content .message{margin:0;white-space:pre-wrap}.dialog-actions{padding:16px 0 0;margin:0;gap:8px}.btn-ok{padding:8px 16px;border-radius:6px;font-weight:500;background-color:var(--mat-sys-primary);color:var(--mat-sys-primary-container)}.btn-cancel{padding:8px 16px;border-radius:6px;color:var(--mat-sys-secondary-container);background-color:var(--mat-sys-secondary)}\n"], dependencies: [{ kind: "ngmodule", type: MatDialogModule }, { kind: "directive", type: i1.MatDialogClose, selector: "[mat-dialog-close], [matDialogClose]", inputs: ["aria-label", "type", "mat-dialog-close", "matDialogClose"], exportAs: ["matDialogClose"] }, { kind: "directive", type: i1.MatDialogTitle, selector: "[mat-dialog-title], [matDialogTitle]", inputs: ["id"], exportAs: ["matDialogTitle"] }, { kind: "directive", type: i1.MatDialogActions, selector: "[mat-dialog-actions], mat-dialog-actions, [matDialogActions]", inputs: ["align"] }, { kind: "directive", type: i1.MatDialogContent, selector: "[mat-dialog-content], mat-dialog-content, [matDialogContent]" }, { kind: "ngmodule", type: MatSnackBarModule }, { kind: "ngmodule", type: MatIconModule }, { kind: "component", type: i2.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "ngmodule", type: MatDividerModule }, { kind: "component", type: i3.MatDivider, selector: "mat-divider", inputs: ["vertical", "inset"] }, { kind: "ngmodule", type: TranslateModule }, { kind: "pipe", type: i1$1.TranslatePipe, name: "translate" }] });
+    dialogRef = inject((MatDialogRef));
+    data = inject(MAT_DIALOG_DATA);
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.6", ngImport: i0, type: ConfirmDialog, deps: [], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.0.6", type: ConfirmDialog, isStandalone: true, selector: "ntybase-confirm-dialog", ngImport: i0, template: "<div class=\"dialog-container\">\n  <h2 mat-dialog-title class=\"dialog-title\">\n    <mat-icon color=\"warn\" class=\"warning-icon\">warning</mat-icon>\n    <span>{{data.title}}</span>\n  </h2>\n\n  <mat-divider class=\"divider\"></mat-divider>\n\n  <mat-dialog-content class=\"dialog-content\">\n    <p class=\"message\">{{data.message}}</p>\n  </mat-dialog-content>\n\n  <mat-dialog-actions align=\"end\" class=\"dialog-actions\">\n    <button mat-stroked-button [mat-dialog-close]=\"false\" class=\"btn-cancel\">\n      {{'@btnCancel' | translate}}\n    </button>\n    <button\n      mat-flat-button\n      color=\"warn\"\n      [mat-dialog-close]=\"true\"\n      class=\"btn-ok\"\n    >\n      {{'@btnOK' | translate}}\n    </button>\n  </mat-dialog-actions>\n</div>\n", styles: [".dialog-container{display:flex;flex-direction:column;min-width:400px;max-width:90vw;padding:24px;border-radius:12px!important}.dialog-title{display:flex;align-items:center;margin:0 0 12px;padding:0;color:var(--mat-sys-primary)}.dialog-title span{margin-left:8px}.warning-icon{color:var(--mat-sys-primary);transform:scale(1.2)}.divider{margin:8px 0 16px;border-top-color:var(--mat-sys-primary)}.dialog-content{padding:8px 0 24px;margin:0;color:var(--mat-sys-primary);line-height:1.6}.dialog-content .message{margin:0;white-space:pre-wrap}.dialog-actions{padding:16px 0 0;margin:0;gap:8px}.btn-ok{padding:8px 16px;border-radius:6px;font-weight:500;background-color:var(--mat-sys-primary);color:var(--mat-sys-primary-container)}.btn-cancel{padding:8px 16px;border-radius:6px;color:var(--mat-sys-secondary-container);background-color:var(--mat-sys-secondary)}\n"], dependencies: [{ kind: "ngmodule", type: MatDialogModule }, { kind: "directive", type: i1.MatDialogClose, selector: "[mat-dialog-close], [matDialogClose]", inputs: ["aria-label", "type", "mat-dialog-close", "matDialogClose"], exportAs: ["matDialogClose"] }, { kind: "directive", type: i1.MatDialogTitle, selector: "[mat-dialog-title], [matDialogTitle]", inputs: ["id"], exportAs: ["matDialogTitle"] }, { kind: "directive", type: i1.MatDialogActions, selector: "[mat-dialog-actions], mat-dialog-actions, [matDialogActions]", inputs: ["align"] }, { kind: "directive", type: i1.MatDialogContent, selector: "[mat-dialog-content], mat-dialog-content, [matDialogContent]" }, { kind: "ngmodule", type: MatSnackBarModule }, { kind: "ngmodule", type: MatIconModule }, { kind: "component", type: i2.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "ngmodule", type: MatDividerModule }, { kind: "component", type: i3.MatDivider, selector: "mat-divider", inputs: ["vertical", "inset"] }, { kind: "ngmodule", type: TranslateModule }, { kind: "pipe", type: i3$1.TranslatePipe, name: "translate" }] });
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.6", ngImport: i0, type: ConfirmDialog, decorators: [{
             type: Component,
@@ -402,10 +398,18 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.6", ngImpor
                         MatDividerModule,
                         TranslateModule,
                     ], template: "<div class=\"dialog-container\">\n  <h2 mat-dialog-title class=\"dialog-title\">\n    <mat-icon color=\"warn\" class=\"warning-icon\">warning</mat-icon>\n    <span>{{data.title}}</span>\n  </h2>\n\n  <mat-divider class=\"divider\"></mat-divider>\n\n  <mat-dialog-content class=\"dialog-content\">\n    <p class=\"message\">{{data.message}}</p>\n  </mat-dialog-content>\n\n  <mat-dialog-actions align=\"end\" class=\"dialog-actions\">\n    <button mat-stroked-button [mat-dialog-close]=\"false\" class=\"btn-cancel\">\n      {{'@btnCancel' | translate}}\n    </button>\n    <button\n      mat-flat-button\n      color=\"warn\"\n      [mat-dialog-close]=\"true\"\n      class=\"btn-ok\"\n    >\n      {{'@btnOK' | translate}}\n    </button>\n  </mat-dialog-actions>\n</div>\n", styles: [".dialog-container{display:flex;flex-direction:column;min-width:400px;max-width:90vw;padding:24px;border-radius:12px!important}.dialog-title{display:flex;align-items:center;margin:0 0 12px;padding:0;color:var(--mat-sys-primary)}.dialog-title span{margin-left:8px}.warning-icon{color:var(--mat-sys-primary);transform:scale(1.2)}.divider{margin:8px 0 16px;border-top-color:var(--mat-sys-primary)}.dialog-content{padding:8px 0 24px;margin:0;color:var(--mat-sys-primary);line-height:1.6}.dialog-content .message{margin:0;white-space:pre-wrap}.dialog-actions{padding:16px 0 0;margin:0;gap:8px}.btn-ok{padding:8px 16px;border-radius:6px;font-weight:500;background-color:var(--mat-sys-primary);color:var(--mat-sys-primary-container)}.btn-cancel{padding:8px 16px;border-radius:6px;color:var(--mat-sys-secondary-container);background-color:var(--mat-sys-secondary)}\n"] }]
-        }], ctorParameters: () => [{ type: i1.MatDialogRef }, { type: undefined, decorators: [{
-                    type: Inject,
-                    args: [MAT_DIALOG_DATA]
-                }] }] });
+        }] });
+
+class ErrorAlert {
+    dialogRef = inject((MatDialogRef));
+    data = inject(MAT_DIALOG_DATA);
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.6", ngImport: i0, type: ErrorAlert, deps: [], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.0.6", type: ErrorAlert, isStandalone: true, selector: "ntybase-error-alert", ngImport: i0, template: "<div class=\"error-dialog-container\">\n  <div class=\"header\">\n    <mat-icon color=\"error\">error_outline</mat-icon>\n    <h2 class=\"error-title\">{{ data.title }}</h2>\n  </div>\n\n  <div class=\"error-content\">\n    <p>{{ data.message }}</p>\n  </div>\n\n  <mat-dialog-actions class=\"dialog-actions\">\n    <button mat-flat-button [mat-dialog-close]=\"true\" class=\"btn-ok\">\n      {{'@btnOK' | translate}}\n    </button>\n  </mat-dialog-actions>\n</div>\n", styles: [".error-dialog-container{padding:40px 32px;text-align:center;min-width:380px;max-width:450px;background:var(--mat-sys-primary);border-radius:20px;box-shadow:0 15px 35px #00000012}.error-dialog-container .header{display:flex;flex-direction:column;align-items:center;gap:12px}.error-dialog-container .header mat-icon{font-size:52px;width:52px;height:52px;color:var(--mat-sys-inverse-primary);margin-bottom:8px}.error-dialog-container .header .error-title{margin:0;font-size:1.4rem;font-weight:700;color:var(--mat-sys-surface);letter-spacing:-.02em}.error-dialog-container .error-content{margin:24px 0 32px;font-size:1rem;line-height:1.6;color:var(--mat-sys-surface)}.error-dialog-container .dialog-actions{display:flex;justify-content:center;padding:0;margin:0}.error-dialog-container .btn-ok{min-width:120px;padding:12px 24px;font-weight:600;font-size:1rem;border-radius:10px;background:var(--mat-sys-inverse-primary);color:var(--mat-sys-primary);border:none;cursor:pointer;transition:all .2s ease}.error-dialog-container .btn-ok:hover{background:var(--mat-sys-inverse-primary);opacity:.9;box-shadow:0 5px 15px #0000001a}\n"], dependencies: [{ kind: "ngmodule", type: MatDialogModule }, { kind: "directive", type: i1.MatDialogClose, selector: "[mat-dialog-close], [matDialogClose]", inputs: ["aria-label", "type", "mat-dialog-close", "matDialogClose"], exportAs: ["matDialogClose"] }, { kind: "directive", type: i1.MatDialogActions, selector: "[mat-dialog-actions], mat-dialog-actions, [matDialogActions]", inputs: ["align"] }, { kind: "ngmodule", type: MatIconModule }, { kind: "component", type: i2.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "ngmodule", type: CommonModule }, { kind: "ngmodule", type: TranslateModule }, { kind: "pipe", type: i3$1.TranslatePipe, name: "translate" }] });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.6", ngImport: i0, type: ErrorAlert, decorators: [{
+            type: Component,
+            args: [{ selector: 'ntybase-error-alert', imports: [MatDialogModule, MatIconModule, CommonModule, TranslateModule], template: "<div class=\"error-dialog-container\">\n  <div class=\"header\">\n    <mat-icon color=\"error\">error_outline</mat-icon>\n    <h2 class=\"error-title\">{{ data.title }}</h2>\n  </div>\n\n  <div class=\"error-content\">\n    <p>{{ data.message }}</p>\n  </div>\n\n  <mat-dialog-actions class=\"dialog-actions\">\n    <button mat-flat-button [mat-dialog-close]=\"true\" class=\"btn-ok\">\n      {{'@btnOK' | translate}}\n    </button>\n  </mat-dialog-actions>\n</div>\n", styles: [".error-dialog-container{padding:40px 32px;text-align:center;min-width:380px;max-width:450px;background:var(--mat-sys-primary);border-radius:20px;box-shadow:0 15px 35px #00000012}.error-dialog-container .header{display:flex;flex-direction:column;align-items:center;gap:12px}.error-dialog-container .header mat-icon{font-size:52px;width:52px;height:52px;color:var(--mat-sys-inverse-primary);margin-bottom:8px}.error-dialog-container .header .error-title{margin:0;font-size:1.4rem;font-weight:700;color:var(--mat-sys-surface);letter-spacing:-.02em}.error-dialog-container .error-content{margin:24px 0 32px;font-size:1rem;line-height:1.6;color:var(--mat-sys-surface)}.error-dialog-container .dialog-actions{display:flex;justify-content:center;padding:0;margin:0}.error-dialog-container .btn-ok{min-width:120px;padding:12px 24px;font-weight:600;font-size:1rem;border-radius:10px;background:var(--mat-sys-inverse-primary);color:var(--mat-sys-primary);border:none;cursor:pointer;transition:all .2s ease}.error-dialog-container .btn-ok:hover{background:var(--mat-sys-inverse-primary);opacity:.9;box-shadow:0 5px 15px #0000001a}\n"] }]
+        }] });
 
 // alert.service.ts
 class AlertService {
@@ -466,14 +470,21 @@ class AlertService {
         else {
             errorMessage = JSON.stringify(error);
         }
-        this.snackBar.open(this.translate.instant(errorMessage), this.translate.instant('@btnOK'), {
-            duration,
-            panelClass: ['error-snackbar'],
-            horizontalPosition: 'right',
-            verticalPosition: 'bottom',
+        return new Promise((resolve) => {
+            const dialogRef = this.dialog.open(ErrorAlert, {
+                width: 'auto',
+                height: 'auto',
+                data: {
+                    message: this.translate.instant(errorMessage),
+                    title: this.translate.instant('@errorOccurred'),
+                },
+            });
+            dialogRef.afterClosed().subscribe(() => {
+                resolve();
+            });
         });
     }
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.6", ngImport: i0, type: AlertService, deps: [{ token: i1$2.MatSnackBar }, { token: i1.MatDialog }, { token: i1$1.TranslateService }], target: i0.ɵɵFactoryTarget.Injectable });
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.6", ngImport: i0, type: AlertService, deps: [{ token: i1$1.MatSnackBar }, { token: i1.MatDialog }, { token: i3$1.TranslateService }], target: i0.ɵɵFactoryTarget.Injectable });
     static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "21.0.6", ngImport: i0, type: AlertService, providedIn: 'root' });
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.6", ngImport: i0, type: AlertService, decorators: [{
@@ -481,7 +492,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.6", ngImpor
             args: [{
                     providedIn: 'root',
                 }]
-        }], ctorParameters: () => [{ type: i1$2.MatSnackBar }, { type: i1.MatDialog }, { type: i1$1.TranslateService }] });
+        }], ctorParameters: () => [{ type: i1$1.MatSnackBar }, { type: i1.MatDialog }, { type: i3$1.TranslateService }] });
 
 class CommonService {
     // Services
@@ -1005,7 +1016,7 @@ class SysfunctionProxy {
             return throwError(() => new Error(errorMessage ?? ''));
         }));
     }
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.6", ngImport: i0, type: SysfunctionProxy, deps: [{ token: i1$3.HttpClient }, { token: i2$1.EnvironmentProxy }], target: i0.ɵɵFactoryTarget.Injectable });
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.6", ngImport: i0, type: SysfunctionProxy, deps: [{ token: i1$2.HttpClient }, { token: i2$1.EnvironmentProxy }], target: i0.ɵɵFactoryTarget.Injectable });
     static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "21.0.6", ngImport: i0, type: SysfunctionProxy, providedIn: 'root' });
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.6", ngImport: i0, type: SysfunctionProxy, decorators: [{
@@ -1013,7 +1024,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.6", ngImpor
             args: [{
                     providedIn: 'root',
                 }]
-        }], ctorParameters: () => [{ type: i1$3.HttpClient }, { type: i2$1.EnvironmentProxy }] });
+        }], ctorParameters: () => [{ type: i1$2.HttpClient }, { type: i2$1.EnvironmentProxy }] });
 
 class ButtonRenderer {
     params = null;
@@ -1307,8 +1318,6 @@ class NettyAgGridBase extends NettyAppsBase {
     readOnly = input(false, ...(ngDevMode ? [{ debugName: "readOnly" }] : []));
     popupFilterValid = input(false, ...(ngDevMode ? [{ debugName: "popupFilterValid" }] : []));
     popupValid = input(false, ...(ngDevMode ? [{ debugName: "popupValid" }] : []));
-    // params = input<any>('');
-    // parameters = input<string>('');
     isEmbedded = input(false, ...(ngDevMode ? [{ debugName: "isEmbedded" }] : []));
     // Parameters pass when the component is embeded into an other
     componantParameterGUID = input('', ...(ngDevMode ? [{ debugName: "componantParameterGUID" }] : []));
@@ -1576,20 +1585,6 @@ class NettyAgGridBase extends NettyAppsBase {
         }
         return null;
     }
-    /**
-     * Handle input changes for route parameters
-     */
-    // public ngOnChanges(changes: SimpleChanges): void {
-    //   if (changes['parameters']) {
-    //     const parameters = changes['parameters'].currentValue;
-    //     if (parameters) {
-    //       this.params =
-    //         typeof parameters === 'string' ? JSON.parse(parameters) : parameters;
-    //     } else {
-    //       this.commonService.clearOutlet();
-    //     }
-    //   }
-    // }
     // Common grid ready handler
     onGridReady(params) {
         this.gridApi = params.api;
@@ -1991,7 +1986,7 @@ class NettyAgGridBase extends NettyAppsBase {
     // --- Functions to Show / Hide Grid Columns ---
     // ---------------------------------------------
     onShowHideColumns() {
-        this.gridColumnsVisible.update(a => !a);
+        this.gridColumnsVisible.update((a) => !a);
         this.showHideColumnsAsync();
     }
     showHideColumnsAsync() {
@@ -2013,7 +2008,7 @@ class NettyAgGridBase extends NettyAppsBase {
         var fields = this.columnDefs()
             .filter((columnDef) => columnDef.ntyEmbeddedHide == 'x')
             .map((columnDef) => columnDef.field);
-        this.gridApi?.setColumnsVisible(fields, !this.isEmbedded);
+        this.gridApi?.setColumnsVisible(fields, !this.isEmbedded());
     }
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.6", ngImport: i0, type: NettyAgGridBase, deps: [], target: i0.ɵɵFactoryTarget.Component });
     static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "21.0.6", type: NettyAgGridBase, isStandalone: true, selector: "ntybase-ag-grid-base", inputs: { readOnly: { classPropertyName: "readOnly", publicName: "readOnly", isSignal: true, isRequired: false, transformFunction: null }, popupFilterValid: { classPropertyName: "popupFilterValid", publicName: "popupFilterValid", isSignal: true, isRequired: false, transformFunction: null }, popupValid: { classPropertyName: "popupValid", publicName: "popupValid", isSignal: true, isRequired: false, transformFunction: null }, isEmbedded: { classPropertyName: "isEmbedded", publicName: "isEmbedded", isSignal: true, isRequired: false, transformFunction: null }, componantParameterGUID: { classPropertyName: "componantParameterGUID", publicName: "componantParameterGUID", isSignal: true, isRequired: false, transformFunction: null }, componantParameterType: { classPropertyName: "componantParameterType", publicName: "componantParameterType", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { onElementSelect: "onElementSelect", selectedElement: "selectedElement" }, usesInheritance: true, ngImport: i0, template: "<p>ag-grid-base works!</p>\n", styles: [""] });
@@ -2043,11 +2038,6 @@ class NettyAgGridSaveBase extends NettyAppsBase {
     // Dialog related properties
     dialogRef = inject((MatDialogRef), { optional: true });
     dialogData = inject(MAT_DIALOG_DATA, { optional: true });
-    // Controls whether the panel should automatically close after saving user data
-    closeAfterSave = model(true, ...(ngDevMode ? [{ debugName: "closeAfterSave" }] : []));
-    setCloseAfterSave(value) {
-        this.closeAfterSave.set(value);
-    }
     // Controls the visibility of additional editable fields (e.g., password, extra settings)
     // When true, certain input fields become visible for editing
     updateValid = signal(false, ...(ngDevMode ? [{ debugName: "updateValid" }] : []));
@@ -2181,9 +2171,9 @@ class NettyAgGridSaveBase extends NettyAppsBase {
         // First check if there are any visual form changes
         if (!this.formChanged && recordGUID) {
             this.alertService.showAlert('@noChangesDetected');
-            if (this.closeAfterSave()) {
-                this.closeSidenav();
-            }
+            // if (this.closeAfterSave()) {
+            //   this.closeSidenav();
+            // }
             return false;
         }
         return true;
@@ -2217,6 +2207,7 @@ class NettyAgGridSaveBase extends NettyAppsBase {
                 },
                 maxWidth: '100vw',
                 disableClose: true,
+                hasBackdrop: false,
             })
                 .afterClosed()
                 .subscribe((result) => {
@@ -2260,7 +2251,7 @@ class NettyAgGridSaveBase extends NettyAppsBase {
         ]);
     }
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.6", ngImport: i0, type: NettyAgGridSaveBase, deps: null, target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "21.0.6", type: NettyAgGridSaveBase, isStandalone: true, selector: "ntybase-ag-grid-save-base", inputs: { parameters: { classPropertyName: "parameters", publicName: "parameters", isSignal: true, isRequired: false, transformFunction: null }, embedded: { classPropertyName: "embedded", publicName: "embedded", isSignal: true, isRequired: false, transformFunction: null }, isEmbedded: { classPropertyName: "isEmbedded", publicName: "isEmbedded", isSignal: true, isRequired: false, transformFunction: null }, closeAfterSave: { classPropertyName: "closeAfterSave", publicName: "closeAfterSave", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { closeAfterSave: "closeAfterSaveChange" }, viewQueries: [{ propertyName: "saveForm", first: true, predicate: ["saveForm"], descendants: true }], usesInheritance: true, usesOnChanges: true, ngImport: i0, template: "<p>ag-grid-save-base works!</p>\n", styles: [""] });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "21.0.6", type: NettyAgGridSaveBase, isStandalone: true, selector: "ntybase-ag-grid-save-base", inputs: { parameters: { classPropertyName: "parameters", publicName: "parameters", isSignal: true, isRequired: false, transformFunction: null }, embedded: { classPropertyName: "embedded", publicName: "embedded", isSignal: true, isRequired: false, transformFunction: null }, isEmbedded: { classPropertyName: "isEmbedded", publicName: "isEmbedded", isSignal: true, isRequired: false, transformFunction: null } }, viewQueries: [{ propertyName: "saveForm", first: true, predicate: ["saveForm"], descendants: true }], usesInheritance: true, usesOnChanges: true, ngImport: i0, template: "<p>ag-grid-save-base works!</p>\n", styles: [""] });
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.6", ngImport: i0, type: NettyAgGridSaveBase, decorators: [{
             type: Component,
@@ -2268,7 +2259,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.6", ngImpor
         }], propDecorators: { parameters: [{ type: i0.Input, args: [{ isSignal: true, alias: "parameters", required: false }] }], embedded: [{ type: i0.Input, args: [{ isSignal: true, alias: "embedded", required: false }] }], isEmbedded: [{ type: i0.Input, args: [{ isSignal: true, alias: "isEmbedded", required: false }] }], saveForm: [{
                 type: ViewChild,
                 args: ['saveForm']
-            }], closeAfterSave: [{ type: i0.Input, args: [{ isSignal: true, alias: "closeAfterSave", required: false }] }, { type: i0.Output, args: ["closeAfterSaveChange"] }] } });
+            }] } });
 
 class ExcelImportBase extends NettyAgGridBase {
     dataList = [];
@@ -2598,7 +2589,7 @@ class RangeDateTimeFilter {
         }
     }
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.6", ngImport: i0, type: RangeDateTimeFilter, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.0.6", type: RangeDateTimeFilter, isStandalone: true, selector: "ntybase-range-date-time-filter", ngImport: i0, template: "<div class=\"custom-filter\">\n  <div class=\"custom-filter__header\">\n    <label class=\"custom-filter__title\">\n      {{ '@dateTimeFilter' | translate }}\n    </label>\n    <input\n      type=\"text\"\n      class=\"custom-filter__input\"\n      [placeholder]=\"'@dateTimeFilterPlaceholder' | translate\"\n      [value]=\"filterText\"\n      (input)=\"onFilterTextChanged($event)\"\n    />\n  </div>\n\n  <div class=\"custom-filter__help\">\n    <strong class=\"custom-filter__help-title\">\n      {{ '@formats' | translate }}:\n    </strong>\n\n    <div class=\"custom-filter__format\">\n      {{ '@range' | translate }}:\n      <code>start..end</code>\n      <span class=\"custom-filter__example\">(today..yesterday)</span>\n    </div>\n\n    <div class=\"custom-filter__format\">\n      {{ '@singleDate' | translate }}:\n      <code>YYYY-MM-DD</code>\n      <span class=\"custom-filter__example\">(2024-05-15)</span>\n    </div>\n\n    <div class=\"custom-filter__format\">\n      {{ '@dateTime' | translate }}:\n      <code>YYYY-MM-DD HH:MM</code>\n      <span class=\"custom-filter__example\">(2024-05-15 14:30)</span>\n    </div>\n\n    <div class=\"custom-filter__format\">\n      {{ '@multiple' | translate }}:\n      <code>date1,date2,start..end</code>\n    </div>\n\n    <strong class=\"custom-filter__subtitle\">\n      {{ '@specialKeywords' | translate }}:\n    </strong>\n\n    <div class=\"custom-filter__format\">\n      {{ '@turkish' | translate }}:\n      <span class=\"custom-filter__keywords\">\n        <code class=\"custom-filter__keyword\">bug\u00FCn</code>\n        <code class=\"custom-filter__keyword\">d\u00FCn</code>\n        <code class=\"custom-filter__keyword\">bu hafta</code>\n        <code class=\"custom-filter__keyword\">bu ay</code>\n      </span>\n    </div>\n\n    <div class=\"custom-filter__format\">\n      {{ '@english' | translate }}:\n      <span class=\"custom-filter__keywords\">\n        <code class=\"custom-filter__keyword\">today</code>\n        <code class=\"custom-filter__keyword\">yesterday</code>\n        <code class=\"custom-filter__keyword\">thisWeek</code>\n        <code class=\"custom-filter__keyword\">thisMonth</code>\n      </span>\n    </div>\n\n    <div class=\"custom-filter__note\">{{ '@filterExample' | translate }}</div>\n  </div>\n</div>\n", styles: [""], dependencies: [{ kind: "ngmodule", type: TranslateModule }, { kind: "pipe", type: i1$1.TranslatePipe, name: "translate" }] });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.0.6", type: RangeDateTimeFilter, isStandalone: true, selector: "ntybase-range-date-time-filter", ngImport: i0, template: "<div class=\"custom-filter\">\n  <div class=\"custom-filter__header\">\n    <label class=\"custom-filter__title\">\n      {{ '@dateTimeFilter' | translate }}\n    </label>\n    <input\n      type=\"text\"\n      class=\"custom-filter__input\"\n      [placeholder]=\"'@dateTimeFilterPlaceholder' | translate\"\n      [value]=\"filterText\"\n      (input)=\"onFilterTextChanged($event)\"\n    />\n  </div>\n\n  <div class=\"custom-filter__help\">\n    <strong class=\"custom-filter__help-title\">\n      {{ '@formats' | translate }}:\n    </strong>\n\n    <div class=\"custom-filter__format\">\n      {{ '@range' | translate }}:\n      <code>start..end</code>\n      <span class=\"custom-filter__example\">(today..yesterday)</span>\n    </div>\n\n    <div class=\"custom-filter__format\">\n      {{ '@singleDate' | translate }}:\n      <code>YYYY-MM-DD</code>\n      <span class=\"custom-filter__example\">(2024-05-15)</span>\n    </div>\n\n    <div class=\"custom-filter__format\">\n      {{ '@dateTime' | translate }}:\n      <code>YYYY-MM-DD HH:MM</code>\n      <span class=\"custom-filter__example\">(2024-05-15 14:30)</span>\n    </div>\n\n    <div class=\"custom-filter__format\">\n      {{ '@multiple' | translate }}:\n      <code>date1,date2,start..end</code>\n    </div>\n\n    <strong class=\"custom-filter__subtitle\">\n      {{ '@specialKeywords' | translate }}:\n    </strong>\n\n    <div class=\"custom-filter__format\">\n      {{ '@turkish' | translate }}:\n      <span class=\"custom-filter__keywords\">\n        <code class=\"custom-filter__keyword\">bug\u00FCn</code>\n        <code class=\"custom-filter__keyword\">d\u00FCn</code>\n        <code class=\"custom-filter__keyword\">bu hafta</code>\n        <code class=\"custom-filter__keyword\">bu ay</code>\n      </span>\n    </div>\n\n    <div class=\"custom-filter__format\">\n      {{ '@english' | translate }}:\n      <span class=\"custom-filter__keywords\">\n        <code class=\"custom-filter__keyword\">today</code>\n        <code class=\"custom-filter__keyword\">yesterday</code>\n        <code class=\"custom-filter__keyword\">thisWeek</code>\n        <code class=\"custom-filter__keyword\">thisMonth</code>\n      </span>\n    </div>\n\n    <div class=\"custom-filter__note\">{{ '@filterExample' | translate }}</div>\n  </div>\n</div>\n", styles: [""], dependencies: [{ kind: "ngmodule", type: TranslateModule }, { kind: "pipe", type: i3$1.TranslatePipe, name: "translate" }] });
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.6", ngImport: i0, type: RangeDateTimeFilter, decorators: [{
             type: Component,
@@ -2797,7 +2788,7 @@ class RangeNumberFilter {
         }
     }
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.6", ngImport: i0, type: RangeNumberFilter, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.0.6", type: RangeNumberFilter, isStandalone: true, selector: "ntybase-range-number-filter", ngImport: i0, template: "<div class=\"custom-filter\">\n  <div class=\"custom-filter__header\">\n    <label class=\"custom-filter__title\">\n      {{ '@numberFilter' | translate }}\n    </label>\n    <input\n      type=\"text\"\n      class=\"custom-filter__input\"\n      [placeholder]=\"'@numberFilterPlaceholder' | translate\"\n      [value]=\"filterText\"\n      (input)=\"onFilterTextChanged($event)\"\n    />\n  </div>\n\n  <div class=\"custom-filter__help\">\n    <strong class=\"custom-filter__help-title\"\n      >{{ '@formats' | translate }}:</strong\n    >\n\n    <div class=\"custom-filter__format\">\n      {{ '@closedRange' | translate }}:\n      <code>min..max</code>\n      <span class=\"custom-filter__example\">(0..5)</span>\n    </div>\n\n    <div class=\"custom-filter__format\">\n      {{ '@equalOrGreater' | translate }}:\n      <code>min..</code>\n      <span class=\"custom-filter__example\">(5..)</span>\n    </div>\n\n    <div class=\"custom-filter__format\">\n      {{ '@equalOrLess' | translate }}:\n      <code>..max</code>\n      <span class=\"custom-filter__example\">(..10)</span>\n    </div>\n\n    <div class=\"custom-filter__format\">\n      {{ '@singleValue' | translate }}:\n      <code>number</code>\n      <span class=\"custom-filter__example\">(10)</span>\n    </div>\n\n    <div class=\"custom-filter__format\">\n      {{ '@exclusion' | translate }}:\n      <code>!number</code>\n      <span class=\"custom-filter__example\">(!5)</span>\n    </div>\n\n    <div class=\"custom-filter__format\">\n      {{ '@rangeExclusion' | translate }}:\n      <code>!min..max</code>\n      <span class=\"custom-filter__example\">(!5..10)</span>\n    </div>\n\n    <div class=\"custom-filter__format\">\n      {{ '@multiple' | translate }}:\n      <code>value1,value2,range</code>\n    </div>\n  </div>\n</div>\n", styles: [""], dependencies: [{ kind: "ngmodule", type: TranslateModule }, { kind: "pipe", type: i1$1.TranslatePipe, name: "translate" }] });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.0.6", type: RangeNumberFilter, isStandalone: true, selector: "ntybase-range-number-filter", ngImport: i0, template: "<div class=\"custom-filter\">\n  <div class=\"custom-filter__header\">\n    <label class=\"custom-filter__title\">\n      {{ '@numberFilter' | translate }}\n    </label>\n    <input\n      type=\"text\"\n      class=\"custom-filter__input\"\n      [placeholder]=\"'@numberFilterPlaceholder' | translate\"\n      [value]=\"filterText\"\n      (input)=\"onFilterTextChanged($event)\"\n    />\n  </div>\n\n  <div class=\"custom-filter__help\">\n    <strong class=\"custom-filter__help-title\"\n      >{{ '@formats' | translate }}:</strong\n    >\n\n    <div class=\"custom-filter__format\">\n      {{ '@closedRange' | translate }}:\n      <code>min..max</code>\n      <span class=\"custom-filter__example\">(0..5)</span>\n    </div>\n\n    <div class=\"custom-filter__format\">\n      {{ '@equalOrGreater' | translate }}:\n      <code>min..</code>\n      <span class=\"custom-filter__example\">(5..)</span>\n    </div>\n\n    <div class=\"custom-filter__format\">\n      {{ '@equalOrLess' | translate }}:\n      <code>..max</code>\n      <span class=\"custom-filter__example\">(..10)</span>\n    </div>\n\n    <div class=\"custom-filter__format\">\n      {{ '@singleValue' | translate }}:\n      <code>number</code>\n      <span class=\"custom-filter__example\">(10)</span>\n    </div>\n\n    <div class=\"custom-filter__format\">\n      {{ '@exclusion' | translate }}:\n      <code>!number</code>\n      <span class=\"custom-filter__example\">(!5)</span>\n    </div>\n\n    <div class=\"custom-filter__format\">\n      {{ '@rangeExclusion' | translate }}:\n      <code>!min..max</code>\n      <span class=\"custom-filter__example\">(!5..10)</span>\n    </div>\n\n    <div class=\"custom-filter__format\">\n      {{ '@multiple' | translate }}:\n      <code>value1,value2,range</code>\n    </div>\n  </div>\n</div>\n", styles: [""], dependencies: [{ kind: "ngmodule", type: TranslateModule }, { kind: "pipe", type: i3$1.TranslatePipe, name: "translate" }] });
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.6", ngImport: i0, type: RangeNumberFilter, decorators: [{
             type: Component,
@@ -3050,7 +3041,7 @@ class RangeStringFilter {
         }
     }
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.6", ngImport: i0, type: RangeStringFilter, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.0.6", type: RangeStringFilter, isStandalone: true, selector: "ntybase-range-string-filter", ngImport: i0, template: "<div class=\"custom-filter\">\n  <div class=\"custom-filter__header\">\n    <label class=\"custom-filter__title\">\n      {{ '@stringFilter' | translate }}\n    </label>\n    <input\n      type=\"text\"\n      class=\"custom-filter__input\"\n      [placeholder]=\"'@stringFilterPlaceholder' | translate\"\n      [value]=\"filterText\"\n      (input)=\"onFilterTextChanged($event)\"\n    />\n  </div>\n\n  <div class=\"custom-filter__help\">\n    <strong class=\"custom-filter__help-title\">\n      {{ '@formats' | translate }}:\n    </strong>\n\n    <div class=\"custom-filter__format\">\n      {{ '@exactMatch' | translate }}:\n      <code>text</code>\n      <span class=\"custom-filter__example\">(ahmet)</span>\n    </div>\n\n    <div class=\"custom-filter__format\">\n      {{ '@startsWith' | translate }}:\n      <code>text*</code>\n      <span class=\"custom-filter__example\">(ahmet*)</span>\n    </div>\n\n    <div class=\"custom-filter__format\">\n      {{ '@endsWith' | translate }}:\n      <code>*text</code>\n      <span class=\"custom-filter__example\">(*metin)</span>\n    </div>\n\n    <div class=\"custom-filter__format\">\n      {{ '@contains' | translate }}:\n      <code>*text*</code>\n      <span class=\"custom-filter__example\">(*ahmet*)</span>\n    </div>\n\n    <div class=\"custom-filter__format\">\n      {{ '@range' | translate }}:\n      <code>start..end</code>\n      <span class=\"custom-filter__example\">(ali..veli)</span>\n    </div>\n\n    <div class=\"custom-filter__format\">\n      <span class=\"custom-filter__description\">\n        {{ '@singleCharacter' | translate }}:\n      </span>\n      <code>?em</code>\n      <span class=\"custom-filter__example\">\n        (?em = 3 characters, 2nd and 3rd letters \"em\")\n      </span>\n    </div>\n\n    <div class=\"custom-filter__format\">\n      <span class=\"custom-filter__description\">\n        {{ '@multipleCharacters' | translate }}:\n      </span>\n      <code>???in</code>\n      <span class=\"custom-filter__example\">\n        (5 characters, last 2 letters \"in\")\n      </span>\n    </div>\n\n    <div class=\"custom-filter__format\">\n      {{ '@not' | translate }}:\n      <code>!condition</code>\n      <span class=\"custom-filter__example\">(!*ahmet*, !?hmet)</span>\n    </div>\n\n    <div class=\"custom-filter__format\">\n      {{ '@regex' | translate }}:\n      <code>$$pattern</code>\n      <span class=\"custom-filter__example\">($$^[A-Z].*, $$a.*b)</span>\n    </div>\n\n    <div class=\"custom-filter__format\">\n      {{ '@multiple' | translate }}:\n      <code>value1,value2,*end,$$pattern</code>\n    </div>\n  </div>\n</div>\n", styles: [""], dependencies: [{ kind: "ngmodule", type: TranslateModule }, { kind: "pipe", type: i1$1.TranslatePipe, name: "translate" }] });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.0.6", type: RangeStringFilter, isStandalone: true, selector: "ntybase-range-string-filter", ngImport: i0, template: "<div class=\"custom-filter\">\n  <div class=\"custom-filter__header\">\n    <label class=\"custom-filter__title\">\n      {{ '@stringFilter' | translate }}\n    </label>\n    <input\n      type=\"text\"\n      class=\"custom-filter__input\"\n      [placeholder]=\"'@stringFilterPlaceholder' | translate\"\n      [value]=\"filterText\"\n      (input)=\"onFilterTextChanged($event)\"\n    />\n  </div>\n\n  <div class=\"custom-filter__help\">\n    <strong class=\"custom-filter__help-title\">\n      {{ '@formats' | translate }}:\n    </strong>\n\n    <div class=\"custom-filter__format\">\n      {{ '@exactMatch' | translate }}:\n      <code>text</code>\n      <span class=\"custom-filter__example\">(ahmet)</span>\n    </div>\n\n    <div class=\"custom-filter__format\">\n      {{ '@startsWith' | translate }}:\n      <code>text*</code>\n      <span class=\"custom-filter__example\">(ahmet*)</span>\n    </div>\n\n    <div class=\"custom-filter__format\">\n      {{ '@endsWith' | translate }}:\n      <code>*text</code>\n      <span class=\"custom-filter__example\">(*metin)</span>\n    </div>\n\n    <div class=\"custom-filter__format\">\n      {{ '@contains' | translate }}:\n      <code>*text*</code>\n      <span class=\"custom-filter__example\">(*ahmet*)</span>\n    </div>\n\n    <div class=\"custom-filter__format\">\n      {{ '@range' | translate }}:\n      <code>start..end</code>\n      <span class=\"custom-filter__example\">(ali..veli)</span>\n    </div>\n\n    <div class=\"custom-filter__format\">\n      <span class=\"custom-filter__description\">\n        {{ '@singleCharacter' | translate }}:\n      </span>\n      <code>?em</code>\n      <span class=\"custom-filter__example\">\n        (?em = 3 characters, 2nd and 3rd letters \"em\")\n      </span>\n    </div>\n\n    <div class=\"custom-filter__format\">\n      <span class=\"custom-filter__description\">\n        {{ '@multipleCharacters' | translate }}:\n      </span>\n      <code>???in</code>\n      <span class=\"custom-filter__example\">\n        (5 characters, last 2 letters \"in\")\n      </span>\n    </div>\n\n    <div class=\"custom-filter__format\">\n      {{ '@not' | translate }}:\n      <code>!condition</code>\n      <span class=\"custom-filter__example\">(!*ahmet*, !?hmet)</span>\n    </div>\n\n    <div class=\"custom-filter__format\">\n      {{ '@regex' | translate }}:\n      <code>$$pattern</code>\n      <span class=\"custom-filter__example\">($$^[A-Z].*, $$a.*b)</span>\n    </div>\n\n    <div class=\"custom-filter__format\">\n      {{ '@multiple' | translate }}:\n      <code>value1,value2,*end,$$pattern</code>\n    </div>\n  </div>\n</div>\n", styles: [""], dependencies: [{ kind: "ngmodule", type: TranslateModule }, { kind: "pipe", type: i3$1.TranslatePipe, name: "translate" }] });
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.6", ngImport: i0, type: RangeStringFilter, decorators: [{
             type: Component,
@@ -3567,7 +3558,7 @@ class Login extends AuthBase {
         });
     }
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.6", ngImport: i0, type: Login, deps: null, target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.0.6", type: Login, isStandalone: true, selector: "ntybase-login", usesInheritance: true, ngImport: i0, template: "<div class=\"login-page-container\">\n  <div class=\"login-image-container\"></div>\n\n  <div class=\"login-container glass-effect\">\n    <!-- Language Button -->\n    <div class=\"language-toggle\">\n      @if (icon()) {\n      <button mat-icon-button [matMenuTriggerFor]=\"languageMenu\">\n        <span class=\"{{ getCurrentLanguageIcon() }}\"></span>\n      </button>\n      } @else {\n      <button\n        mat-raised-button\n        color=\"primary\"\n        [matMenuTriggerFor]=\"languageMenu\"\n      >\n        {{ currentLanguage }}\n      </button>\n      }\n    </div>\n\n    <h2>{{'app_name' | translate }}</h2>\n\n    <!-- Language Menu -->\n    <mat-menu #languageMenu=\"matMenu\">\n      @for (language of languages; track language) {\n      <button mat-menu-item (click)=\"setLanguage(language)\">\n        <span class=\"{{ getLanguageIcon(language) }}\"></span>\n        {{ language }}\n      </button>\n      }\n    </mat-menu>\n\n    @if (!isLoading()) {\n    <form (ngSubmit)=\"login()\" [formGroup]=\"loginForm\" novalidate>\n      @if (error()) {\n      <div class=\"error-message\">\n        <span class=\"error-icon\">!</span>\n        {{ error() }}\n      </div>\n      }\n\n      <div class=\"form-group\">\n        <label for=\"username\">{{'@username' | translate}}</label>\n        <input\n          type=\"text\"\n          id=\"username\"\n          formControlName=\"username\"\n          [placeholder]=\"'@username' | translate\"\n          required\n        />\n        @if (loginForm.controls['username'].invalid &&\n        loginForm.controls['username'].touched) {\n        <mat-error class=\"validation-error\">\n          <span class=\"error-icon\">!</span>\n          {{ 'username is required' | translate }}\n        </mat-error>\n        }\n      </div>\n\n      <div class=\"form-group\">\n        <label for=\"password\">{{'@password' | translate}}</label>\n        <input\n          type=\"password\"\n          id=\"password\"\n          formControlName=\"password\"\n          [placeholder]=\"'@password' | translate\"\n          required\n        />\n        @if (loginForm.controls['password'].invalid &&\n        loginForm.controls['password'].touched) {\n        <div class=\"validation-error\">\n          <span class=\"error-icon\">!</span>\n          {{ 'password is required' | translate }}\n        </div>\n        }\n      </div>\n\n      <div class=\"form-group remember\">\n        <input type=\"checkbox\" id=\"remember\" formControlName=\"remember\" />\n        <label for=\"remember\">{{ '@rememberMe' | translate }}</label>\n        <a class=\"forgot-password\" (click)=\"onForgotPassword()\"\n          >{{ '@forgotPassword' | translate }}</a\n        >\n      </div>\n\n      <button\n        type=\"submit\"\n        class=\"login-button\"\n        [disabled]=\"loginForm.invalid || isLoading()\"\n      >\n        {{ '@login' | translate }}\n      </button>\n    </form>\n    } @else {\n    <div class=\"loading-spinner\">\n      <span>{{ '@loggingIn' | translate }}</span>\n    </div>\n    }\n\n    <div class=\"footer\">\n      @if(version() && version() !== '?.?'){\n      <div class=\"version\">{{ version() }}</div>\n      }\n    </div>\n  </div>\n</div>\n", styles: [".login-page-container{position:relative;display:flex;height:100vh;background-image:var(--login-bg-image, url(https://images.unsplash.com/photo-1519681393784-d120267933ba?ixid=MnwxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8&ixlib=rb-1.2.1&auto=format&fit=crop&w=1124&q=100));background-position:center;background-repeat:no-repeat;background-size:cover;background-attachment:fixed;justify-content:flex-end;padding-right:5%}.login-image-container{display:none}.login-container{width:100%;max-width:400px;padding:2.5rem;display:flex;flex-direction:column;justify-content:center;background:#ffffff1a;border-radius:16px;box-shadow:0 8px 32px #0003;backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);border:1px solid rgba(255,255,255,.2);margin:20px;height:fit-content;align-self:center}.login-container h2{color:#fff;text-align:center;margin-bottom:2rem;font-size:1.8rem;font-weight:600;text-shadow:0 2px 4px rgba(0,0,0,.3)}.form-group{margin-bottom:1.5rem}.form-group label{display:block;font-weight:500;color:#fff;font-size:.9rem;text-shadow:0 1px 2px rgba(0,0,0,.3)}.form-group input[type=text],.form-group input[type=password]{width:100%;padding:.85rem 1rem;margin-top:.5rem;border:1px solid rgba(255,255,255,.3);border-radius:8px;font-size:.95rem;background-color:#ffffff26;color:#fff}.form-group input::placeholder{color:#ffffffb3}.form-group input[type=text]:focus,.form-group input[type=password]:focus{outline:none;border-color:#ffffff80;background-color:#ffffff40;box-shadow:0 0 0 3px #ffffff1a}.remember{display:flex;align-items:center;margin-bottom:1.5rem}.remember input{width:18px;height:18px;margin-right:.75rem;cursor:pointer}.remember label{color:#fff;font-size:.9rem;cursor:pointer;-webkit-user-select:none;user-select:none;text-shadow:0 1px 2px rgba(0,0,0,.3)}.forgot-password{margin-left:auto;color:#ffffffe6;font-size:.85rem;text-decoration:none}.forgot-password:hover{text-decoration:underline}.login-button{width:100%;padding:1rem;background-color:#fff3;color:#fff;border:1px solid rgba(255,255,255,.4);border-radius:8px;font-size:1rem;font-weight:500;cursor:pointer;transition:all .2s}.login-button:hover{background-color:#ffffff4d}.loading-spinner{text-align:center;padding:2rem}.loading-spinner p{margin-top:1rem;color:#fff}.footer{margin-top:2rem;text-align:center}.version{color:#ffffffb3;font-size:.8rem;display:block;text-shadow:0 1px 2px rgba(0,0,0,.3)}@media(max-width:768px){.login-page-container{justify-content:center;padding-right:0;align-items:center}.login-container{max-width:90%;margin:20px auto}}.language-toggle{position:absolute;top:20px;right:20px;z-index:10}.language-toggle button{background:#fff3;-webkit-backdrop-filter:blur(5px);backdrop-filter:blur(5px);border:1px solid rgba(255,255,255,.3);cursor:pointer}.language-toggle button:hover{background:#ffffff4d}.language-toggle button mat-icon{color:#fff}.login-container h2{margin-top:.5rem}.flag-icon{width:24px;height:16px;margin-right:8px;border:1px solid #ddd}.error-message{background-color:#f8d7da;color:#721c24;padding:12px 15px;border-radius:4px;margin-bottom:20px;display:flex;align-items:center;border:1px solid #f5c6cb;font-size:14px;animation:fadeIn .3s ease-in-out}.error-message .error-icon{display:inline-block;width:20px;height:20px;background-color:#dc3545;color:#fff;border-radius:50%;text-align:center;line-height:20px;margin-right:10px;font-weight:700;font-size:12px}.validation-error{color:#dc3545;font-size:12px;margin-top:5px;display:flex;align-items:center;animation:fadeIn .3s ease-in-out}.validation-error .error-icon{display:inline-block;width:16px;height:16px;background-color:#dc3545;color:#fff;border-radius:50%;text-align:center;line-height:16px;margin-right:6px;font-weight:700;font-size:10px}input.ng-invalid.ng-touched{border:1px solid #dc3545!important}@keyframes fadeIn{0%{opacity:0;transform:translateY(-5px)}to{opacity:1;transform:translateY(0)}}\n"], dependencies: [{ kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1$4.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i1$4.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i1$4.CheckboxControlValueAccessor, selector: "input[type=checkbox][formControlName],input[type=checkbox][formControl],input[type=checkbox][ngModel]" }, { kind: "directive", type: i1$4.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$4.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],[formArray],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i1$4.RequiredValidator, selector: ":not([type=checkbox])[required][formControlName],:not([type=checkbox])[required][formControl],:not([type=checkbox])[required][ngModel]", inputs: ["required"] }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i1$4.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i1$4.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "ngmodule", type: MatMenuModule }, { kind: "component", type: i2$3.MatMenu, selector: "mat-menu", inputs: ["backdropClass", "aria-label", "aria-labelledby", "aria-describedby", "xPosition", "yPosition", "overlapTrigger", "hasBackdrop", "class", "classList"], outputs: ["closed", "close"], exportAs: ["matMenu"] }, { kind: "component", type: i2$3.MatMenuItem, selector: "[mat-menu-item]", inputs: ["role", "disabled", "disableRipple"], exportAs: ["matMenuItem"] }, { kind: "directive", type: i2$3.MatMenuTrigger, selector: "[mat-menu-trigger-for], [matMenuTriggerFor]", inputs: ["mat-menu-trigger-for", "matMenuTriggerFor", "matMenuTriggerData", "matMenuTriggerRestoreFocus"], outputs: ["menuOpened", "onMenuOpen", "menuClosed", "onMenuClose"], exportAs: ["matMenuTrigger"] }, { kind: "ngmodule", type: MatIconModule }, { kind: "ngmodule", type: MatInputModule }, { kind: "directive", type: i3$1.MatError, selector: "mat-error, [matError]", inputs: ["id"] }, { kind: "ngmodule", type: MatFormFieldModule }, { kind: "ngmodule", type: TranslateModule }, { kind: "pipe", type: i1$1.TranslatePipe, name: "translate" }] });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.0.6", type: Login, isStandalone: true, selector: "ntybase-login", usesInheritance: true, ngImport: i0, template: "<div class=\"login-page-container\">\n  <div class=\"login-image-container\"></div>\n\n  <div class=\"login-container glass-effect\">\n    <!-- Language Button -->\n    <div class=\"language-toggle\">\n      @if (icon()) {\n      <button mat-icon-button [matMenuTriggerFor]=\"languageMenu\">\n        <span class=\"{{ getCurrentLanguageIcon() }}\"></span>\n      </button>\n      } @else {\n      <button\n        mat-raised-button\n        color=\"primary\"\n        [matMenuTriggerFor]=\"languageMenu\"\n      >\n        {{ currentLanguage }}\n      </button>\n      }\n    </div>\n\n    <h2>{{'app_name' | translate }}</h2>\n\n    <!-- Language Menu -->\n    <mat-menu #languageMenu=\"matMenu\">\n      @for (language of languages; track language) {\n      <button mat-menu-item (click)=\"setLanguage(language)\">\n        <span class=\"{{ getLanguageIcon(language) }}\"></span>\n        {{ language }}\n      </button>\n      }\n    </mat-menu>\n\n    @if (!isLoading()) {\n    <form (ngSubmit)=\"login()\" [formGroup]=\"loginForm\" novalidate>\n      @if (error()) {\n      <div class=\"error-message\">\n        <span class=\"error-icon\">!</span>\n        {{ error() }}\n      </div>\n      }\n\n      <div class=\"form-group\">\n        <label for=\"username\">{{'@username' | translate}}</label>\n        <input\n          type=\"text\"\n          id=\"username\"\n          formControlName=\"username\"\n          [placeholder]=\"'@username' | translate\"\n          required\n        />\n        @if (loginForm.controls['username'].invalid &&\n        loginForm.controls['username'].touched) {\n        <mat-error class=\"validation-error\">\n          <span class=\"error-icon\">!</span>\n          {{ 'username is required' | translate }}\n        </mat-error>\n        }\n      </div>\n\n      <div class=\"form-group\">\n        <label for=\"password\">{{'@password' | translate}}</label>\n        <input\n          type=\"password\"\n          id=\"password\"\n          formControlName=\"password\"\n          [placeholder]=\"'@password' | translate\"\n          required\n        />\n        @if (loginForm.controls['password'].invalid &&\n        loginForm.controls['password'].touched) {\n        <div class=\"validation-error\">\n          <span class=\"error-icon\">!</span>\n          {{ 'password is required' | translate }}\n        </div>\n        }\n      </div>\n\n      <div class=\"form-group remember\">\n        <input type=\"checkbox\" id=\"remember\" formControlName=\"remember\" />\n        <label for=\"remember\">{{ '@rememberMe' | translate }}</label>\n        <a class=\"forgot-password\" (click)=\"onForgotPassword()\"\n          >{{ '@forgotPassword' | translate }}</a\n        >\n      </div>\n\n      <button\n        type=\"submit\"\n        class=\"login-button\"\n        [disabled]=\"loginForm.invalid || isLoading()\"\n      >\n        {{ '@login' | translate }}\n      </button>\n    </form>\n    } @else {\n    <div class=\"loading-spinner\">\n      <span>{{ '@loggingIn' | translate }}</span>\n    </div>\n    }\n\n    <div class=\"footer\">\n      @if(version() && version() !== '?.?'){\n      <div class=\"version\">{{ version() }}</div>\n      }\n    </div>\n  </div>\n</div>\n", styles: [".login-page-container{position:relative;display:flex;height:100vh;background-image:var(--login-bg-image, url(https://images.unsplash.com/photo-1519681393784-d120267933ba?ixid=MnwxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8&ixlib=rb-1.2.1&auto=format&fit=crop&w=1124&q=100));background-position:center;background-repeat:no-repeat;background-size:cover;background-attachment:fixed;justify-content:flex-end;padding-right:5%}.login-image-container{display:none}.login-container{width:100%;max-width:400px;padding:2.5rem;display:flex;flex-direction:column;justify-content:center;background:#ffffff1a;border-radius:16px;box-shadow:0 8px 32px #0003;backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);border:1px solid rgba(255,255,255,.2);margin:20px;height:fit-content;align-self:center}.login-container h2{color:#fff;text-align:center;margin-bottom:2rem;font-size:1.8rem;font-weight:600;text-shadow:0 2px 4px rgba(0,0,0,.3)}.form-group{margin-bottom:1.5rem}.form-group label{display:block;font-weight:500;color:#fff;font-size:.9rem;text-shadow:0 1px 2px rgba(0,0,0,.3)}.form-group input[type=text],.form-group input[type=password]{width:100%;padding:.85rem 1rem;margin-top:.5rem;border:1px solid rgba(255,255,255,.3);border-radius:8px;font-size:.95rem;background-color:#ffffff26;color:#fff}.form-group input::placeholder{color:#ffffffb3}.form-group input[type=text]:focus,.form-group input[type=password]:focus{outline:none;border-color:#ffffff80;background-color:#ffffff40;box-shadow:0 0 0 3px #ffffff1a}.remember{display:flex;align-items:center;margin-bottom:1.5rem}.remember input{width:18px;height:18px;margin-right:.75rem;cursor:pointer}.remember label{color:#fff;font-size:.9rem;cursor:pointer;-webkit-user-select:none;user-select:none;text-shadow:0 1px 2px rgba(0,0,0,.3)}.forgot-password{margin-left:auto;color:#ffffffe6;font-size:.85rem;text-decoration:none}.forgot-password:hover{text-decoration:underline}.login-button{width:100%;padding:1rem;background-color:#fff3;color:#fff;border:1px solid rgba(255,255,255,.4);border-radius:8px;font-size:1rem;font-weight:500;cursor:pointer;transition:all .2s}.login-button:hover{background-color:#ffffff4d}.loading-spinner{text-align:center;padding:2rem}.loading-spinner p{margin-top:1rem;color:#fff}.footer{margin-top:2rem;text-align:center}.version{color:#ffffffb3;font-size:.8rem;display:block;text-shadow:0 1px 2px rgba(0,0,0,.3)}@media(max-width:768px){.login-page-container{justify-content:center;padding-right:0;align-items:center}.login-container{max-width:90%;margin:20px auto}}.language-toggle{position:absolute;top:20px;right:20px;z-index:10}.language-toggle button{background:#fff3;-webkit-backdrop-filter:blur(5px);backdrop-filter:blur(5px);border:1px solid rgba(255,255,255,.3);cursor:pointer}.language-toggle button:hover{background:#ffffff4d}.language-toggle button mat-icon{color:#fff}.login-container h2{margin-top:.5rem}.flag-icon{width:24px;height:16px;margin-right:8px;border:1px solid #ddd}.error-message{background-color:#f8d7da;color:#721c24;padding:12px 15px;border-radius:4px;margin-bottom:20px;display:flex;align-items:center;border:1px solid #f5c6cb;font-size:14px;animation:fadeIn .3s ease-in-out}.error-message .error-icon{display:inline-block;width:20px;height:20px;background-color:#dc3545;color:#fff;border-radius:50%;text-align:center;line-height:20px;margin-right:10px;font-weight:700;font-size:12px}.validation-error{color:#dc3545;font-size:12px;margin-top:5px;display:flex;align-items:center;animation:fadeIn .3s ease-in-out}.validation-error .error-icon{display:inline-block;width:16px;height:16px;background-color:#dc3545;color:#fff;border-radius:50%;text-align:center;line-height:16px;margin-right:6px;font-weight:700;font-size:10px}input.ng-invalid.ng-touched{border:1px solid #dc3545!important}@keyframes fadeIn{0%{opacity:0;transform:translateY(-5px)}to{opacity:1;transform:translateY(0)}}\n"], dependencies: [{ kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1$3.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i1$3.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i1$3.CheckboxControlValueAccessor, selector: "input[type=checkbox][formControlName],input[type=checkbox][formControl],input[type=checkbox][ngModel]" }, { kind: "directive", type: i1$3.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$3.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],[formArray],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i1$3.RequiredValidator, selector: ":not([type=checkbox])[required][formControlName],:not([type=checkbox])[required][formControl],:not([type=checkbox])[required][ngModel]", inputs: ["required"] }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i1$3.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i1$3.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "ngmodule", type: MatMenuModule }, { kind: "component", type: i2$3.MatMenu, selector: "mat-menu", inputs: ["backdropClass", "aria-label", "aria-labelledby", "aria-describedby", "xPosition", "yPosition", "overlapTrigger", "hasBackdrop", "class", "classList"], outputs: ["closed", "close"], exportAs: ["matMenu"] }, { kind: "component", type: i2$3.MatMenuItem, selector: "[mat-menu-item]", inputs: ["role", "disabled", "disableRipple"], exportAs: ["matMenuItem"] }, { kind: "directive", type: i2$3.MatMenuTrigger, selector: "[mat-menu-trigger-for], [matMenuTriggerFor]", inputs: ["mat-menu-trigger-for", "matMenuTriggerFor", "matMenuTriggerData", "matMenuTriggerRestoreFocus"], outputs: ["menuOpened", "onMenuOpen", "menuClosed", "onMenuClose"], exportAs: ["matMenuTrigger"] }, { kind: "ngmodule", type: MatIconModule }, { kind: "ngmodule", type: MatInputModule }, { kind: "directive", type: i3$2.MatError, selector: "mat-error, [matError]", inputs: ["id"] }, { kind: "ngmodule", type: MatFormFieldModule }, { kind: "ngmodule", type: TranslateModule }, { kind: "pipe", type: i3$1.TranslatePipe, name: "translate" }] });
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.6", ngImport: i0, type: Login, decorators: [{
             type: Component,
@@ -3679,7 +3670,7 @@ class MfaLogin extends AuthBase {
         clearInterval(this.countdownInterval);
     }
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.6", ngImport: i0, type: MfaLogin, deps: null, target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.0.6", type: MfaLogin, isStandalone: true, selector: "ntybase-mfa-login", usesInheritance: true, ngImport: i0, template: "<div class=\"login-page-container\">\n  <div class=\"login-image-container\"></div>\n\n  <div class=\"login-container glass-effect\">\n    <!-- Language Button -->\n    <div class=\"language-toggle\">\n      @if (icon()) {\n      <button mat-icon-button [matMenuTriggerFor]=\"languageMenu\">\n        <span class=\"{{ getCurrentLanguageIcon() }}\"></span>\n      </button>\n      } @else {\n      <button\n        mat-raised-button\n        color=\"primary\"\n        [matMenuTriggerFor]=\"languageMenu\"\n      >\n        {{ currentLanguage }}\n      </button>\n      }\n    </div>\n\n    <h2>{{'app_name' | translate }}</h2>\n\n    <!-- Language Menu -->\n    <mat-menu #languageMenu=\"matMenu\">\n      @for (language of languages; track language) {\n      <button mat-menu-item (click)=\"setLanguage(language)\">\n        <span class=\"{{ getLanguageIcon(language) }}\"></span>\n        {{ language }}\n      </button>\n      }\n    </mat-menu>\n\n    @if (!isLoading()) {\n    <form (ngSubmit)=\"login()\" [formGroup]=\"loginForm\" novalidate>\n      @if (error()) {\n      <div class=\"error-message\">\n        <span class=\"error-icon\">!</span>\n        {{ error() }}\n      </div>\n      }\n\n      <div class=\"form-group\">\n        <label for=\"mfaCode\">{{'mfaCode' | translate}}</label>\n        <input\n          type=\"text\"\n          id=\"mfaCode\"\n          formControlName=\"mfaCode\"\n          [placeholder]=\"'mfaCode' | translate\"\n          required\n        />\n        @if (loginForm.controls['mfaCode'].invalid &&\n        loginForm.controls['mfaCode'].touched) {\n        <div class=\"validation-error\">\n          <span class=\"error-icon\">!</span>\n          {{ 'mfaCode is required' | translate }}\n        </div>\n        }\n\n        <!-- Time -->\n        @if (!resendable()) {\n        <div class=\"time-remaining\">\n          {{ '@tokenCount' | translate }}: {{ getFormattedTime() }}\n        </div>\n        }\n      </div>\n\n      <button\n        type=\"submit\"\n        class=\"login-button\"\n        [disabled]=\"loginForm.invalid || isLoading() || !resendable()\"\n      >\n        {{ '@login' | translate }}\n      </button>\n\n      @if (resendable()) {\n      <div class=\"resend-container\">\n        <span (click)=\"onResendMFACode()\" class=\"resend-link\">\n          {{ 'resend MFACode' | translate }}\n        </span>\n      </div>\n      }\n    </form>\n    } @else {\n    <div class=\"loading-spinner\">\n      <span>{{ '@loggingIn' | translate }}</span>\n    </div>\n    }\n\n    <div class=\"footer\">\n      <span class=\"version\">v{{version}}</span>\n    </div>\n  </div>\n</div>\n", styles: [".login-page-container{position:relative;display:flex;height:100vh;background-image:var(--mfa-login-bg-image, url(https://images.unsplash.com/photo-1519681393784-d120267933ba?ixid=MnwxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8&ixlib=rb-1.2.1&auto=format&fit=crop&w=1124&q=100));background-position:center;background-repeat:no-repeat;background-size:cover;background-attachment:fixed;justify-content:flex-end;padding-right:5%}.login-image-container{display:none}.login-container{width:100%;max-width:400px;padding:2.5rem;display:flex;flex-direction:column;justify-content:center;background:#ffffff1a;border-radius:16px;box-shadow:0 8px 32px #0003;backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);border:1px solid rgba(255,255,255,.2);margin:20px;height:fit-content;align-self:center}.login-container h2{color:#fff;text-align:center;margin-bottom:2rem;font-size:1.8rem;font-weight:600;text-shadow:0 2px 4px rgba(0,0,0,.3)}.form-group{margin-bottom:1.5rem}.form-group label{display:block;font-weight:500;color:#fff;font-size:.9rem;text-shadow:0 1px 2px rgba(0,0,0,.3)}.form-group input[type=text],.form-group input[type=password]{width:100%;padding:.85rem 1rem;margin-top:.5rem;border:1px solid rgba(255,255,255,.3);border-radius:8px;font-size:.95rem;background-color:#ffffff26;color:#fff}.form-group input::placeholder{color:#ffffffb3}.form-group input[type=text]:focus,.form-group input[type=password]:focus{outline:none;border-color:#ffffff80;background-color:#ffffff40;box-shadow:0 0 0 3px #ffffff1a}.login-button{width:100%;padding:1rem;background-color:#fff3;color:#fff;border:1px solid rgba(255,255,255,.4);border-radius:8px;font-size:1rem;font-weight:500;cursor:pointer;transition:all .2s}.login-button:hover{background-color:#ffffff4d}.loading-spinner{text-align:center;padding:2rem}.loading-spinner p{margin-top:1rem;color:#fff}.footer{margin-top:2rem;text-align:center}.version{color:#ffffffb3;font-size:.8rem;display:block;text-shadow:0 1px 2px rgba(0,0,0,.3)}.language-toggle{position:absolute;top:20px;right:20px;z-index:10}.language-toggle button{background:#fff3;-webkit-backdrop-filter:blur(5px);backdrop-filter:blur(5px);border:1px solid rgba(255,255,255,.3);cursor:pointer}.language-toggle button:hover{background:#ffffff4d}.language-toggle button mat-icon{color:#fff}.login-container h2{margin-top:.5rem}.flag-icon{width:24px;height:16px;margin-right:8px;border:1px solid #ddd}.error-message{background-color:#f8d7da;color:#721c24;padding:12px 15px;border-radius:4px;margin-bottom:20px;display:flex;align-items:center;border:1px solid #f5c6cb;font-size:14px;animation:fadeIn .3s ease-in-out}.error-message .error-icon{display:inline-block;width:20px;height:20px;background-color:#dc3545;color:#fff;border-radius:50%;text-align:center;line-height:20px;margin-right:10px;font-weight:700;font-size:12px}.validation-error{color:#dc3545;font-size:12px;margin-top:5px;display:flex;align-items:center;animation:fadeIn .3s ease-in-out}.validation-error .error-icon{display:inline-block;width:16px;height:16px;background-color:#dc3545;color:#fff;border-radius:50%;text-align:center;line-height:16px;margin-right:6px;font-weight:700;font-size:10px}.invalid-input{border:1px solid #dc3545!important}.invalid-input:focus{box-shadow:0 0 0 .2rem #dc354540}.resend-container{margin-top:15px;text-align:center}.resend-container .resend-link{color:#007bff;cursor:pointer;text-decoration:underline;font-size:13px}.resend-container .resend-link:hover{color:#0056b3}.time-remaining{margin-top:16px;font-size:1rem;color:#f5f5f5}@keyframes fadeIn{0%{opacity:0;transform:translateY(-5px)}to{opacity:1;transform:translateY(0)}}@media(max-width:768px){.login-page-container{justify-content:center;padding-right:0;align-items:center}.login-container{max-width:90%;margin:20px auto}}\n"], dependencies: [{ kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1$4.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i1$4.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i1$4.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$4.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],[formArray],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i1$4.RequiredValidator, selector: ":not([type=checkbox])[required][formControlName],:not([type=checkbox])[required][formControl],:not([type=checkbox])[required][ngModel]", inputs: ["required"] }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i1$4.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i1$4.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "ngmodule", type: MatMenuModule }, { kind: "component", type: i2$3.MatMenu, selector: "mat-menu", inputs: ["backdropClass", "aria-label", "aria-labelledby", "aria-describedby", "xPosition", "yPosition", "overlapTrigger", "hasBackdrop", "class", "classList"], outputs: ["closed", "close"], exportAs: ["matMenu"] }, { kind: "component", type: i2$3.MatMenuItem, selector: "[mat-menu-item]", inputs: ["role", "disabled", "disableRipple"], exportAs: ["matMenuItem"] }, { kind: "directive", type: i2$3.MatMenuTrigger, selector: "[mat-menu-trigger-for], [matMenuTriggerFor]", inputs: ["mat-menu-trigger-for", "matMenuTriggerFor", "matMenuTriggerData", "matMenuTriggerRestoreFocus"], outputs: ["menuOpened", "onMenuOpen", "menuClosed", "onMenuClose"], exportAs: ["matMenuTrigger"] }, { kind: "ngmodule", type: MatIconModule }, { kind: "ngmodule", type: TranslateModule }, { kind: "pipe", type: i1$1.TranslatePipe, name: "translate" }] });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.0.6", type: MfaLogin, isStandalone: true, selector: "ntybase-mfa-login", usesInheritance: true, ngImport: i0, template: "<div class=\"login-page-container\">\n  <div class=\"login-image-container\"></div>\n\n  <div class=\"login-container glass-effect\">\n    <!-- Language Button -->\n    <div class=\"language-toggle\">\n      @if (icon()) {\n      <button mat-icon-button [matMenuTriggerFor]=\"languageMenu\">\n        <span class=\"{{ getCurrentLanguageIcon() }}\"></span>\n      </button>\n      } @else {\n      <button\n        mat-raised-button\n        color=\"primary\"\n        [matMenuTriggerFor]=\"languageMenu\"\n      >\n        {{ currentLanguage }}\n      </button>\n      }\n    </div>\n\n    <h2>{{'app_name' | translate }}</h2>\n\n    <!-- Language Menu -->\n    <mat-menu #languageMenu=\"matMenu\">\n      @for (language of languages; track language) {\n      <button mat-menu-item (click)=\"setLanguage(language)\">\n        <span class=\"{{ getLanguageIcon(language) }}\"></span>\n        {{ language }}\n      </button>\n      }\n    </mat-menu>\n\n    @if (!isLoading()) {\n    <form (ngSubmit)=\"login()\" [formGroup]=\"loginForm\" novalidate>\n      @if (error()) {\n      <div class=\"error-message\">\n        <span class=\"error-icon\">!</span>\n        {{ error() }}\n      </div>\n      }\n\n      <div class=\"form-group\">\n        <label for=\"mfaCode\">{{'mfaCode' | translate}}</label>\n        <input\n          type=\"text\"\n          id=\"mfaCode\"\n          formControlName=\"mfaCode\"\n          [placeholder]=\"'mfaCode' | translate\"\n          required\n        />\n        @if (loginForm.controls['mfaCode'].invalid &&\n        loginForm.controls['mfaCode'].touched) {\n        <div class=\"validation-error\">\n          <span class=\"error-icon\">!</span>\n          {{ 'mfaCode is required' | translate }}\n        </div>\n        }\n\n        <!-- Time -->\n        @if (!resendable()) {\n        <div class=\"time-remaining\">\n          {{ '@tokenCount' | translate }}: {{ getFormattedTime() }}\n        </div>\n        }\n      </div>\n\n      <button\n        type=\"submit\"\n        class=\"login-button\"\n        [disabled]=\"loginForm.invalid || isLoading() || !resendable()\"\n      >\n        {{ '@login' | translate }}\n      </button>\n\n      @if (resendable()) {\n      <div class=\"resend-container\">\n        <span (click)=\"onResendMFACode()\" class=\"resend-link\">\n          {{ 'resend MFACode' | translate }}\n        </span>\n      </div>\n      }\n    </form>\n    } @else {\n    <div class=\"loading-spinner\">\n      <span>{{ '@loggingIn' | translate }}</span>\n    </div>\n    }\n\n    <div class=\"footer\">\n      <span class=\"version\">v{{version}}</span>\n    </div>\n  </div>\n</div>\n", styles: [".login-page-container{position:relative;display:flex;height:100vh;background-image:var(--mfa-login-bg-image, url(https://images.unsplash.com/photo-1519681393784-d120267933ba?ixid=MnwxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8&ixlib=rb-1.2.1&auto=format&fit=crop&w=1124&q=100));background-position:center;background-repeat:no-repeat;background-size:cover;background-attachment:fixed;justify-content:flex-end;padding-right:5%}.login-image-container{display:none}.login-container{width:100%;max-width:400px;padding:2.5rem;display:flex;flex-direction:column;justify-content:center;background:#ffffff1a;border-radius:16px;box-shadow:0 8px 32px #0003;backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);border:1px solid rgba(255,255,255,.2);margin:20px;height:fit-content;align-self:center}.login-container h2{color:#fff;text-align:center;margin-bottom:2rem;font-size:1.8rem;font-weight:600;text-shadow:0 2px 4px rgba(0,0,0,.3)}.form-group{margin-bottom:1.5rem}.form-group label{display:block;font-weight:500;color:#fff;font-size:.9rem;text-shadow:0 1px 2px rgba(0,0,0,.3)}.form-group input[type=text],.form-group input[type=password]{width:100%;padding:.85rem 1rem;margin-top:.5rem;border:1px solid rgba(255,255,255,.3);border-radius:8px;font-size:.95rem;background-color:#ffffff26;color:#fff}.form-group input::placeholder{color:#ffffffb3}.form-group input[type=text]:focus,.form-group input[type=password]:focus{outline:none;border-color:#ffffff80;background-color:#ffffff40;box-shadow:0 0 0 3px #ffffff1a}.login-button{width:100%;padding:1rem;background-color:#fff3;color:#fff;border:1px solid rgba(255,255,255,.4);border-radius:8px;font-size:1rem;font-weight:500;cursor:pointer;transition:all .2s}.login-button:hover{background-color:#ffffff4d}.loading-spinner{text-align:center;padding:2rem}.loading-spinner p{margin-top:1rem;color:#fff}.footer{margin-top:2rem;text-align:center}.version{color:#ffffffb3;font-size:.8rem;display:block;text-shadow:0 1px 2px rgba(0,0,0,.3)}.language-toggle{position:absolute;top:20px;right:20px;z-index:10}.language-toggle button{background:#fff3;-webkit-backdrop-filter:blur(5px);backdrop-filter:blur(5px);border:1px solid rgba(255,255,255,.3);cursor:pointer}.language-toggle button:hover{background:#ffffff4d}.language-toggle button mat-icon{color:#fff}.login-container h2{margin-top:.5rem}.flag-icon{width:24px;height:16px;margin-right:8px;border:1px solid #ddd}.error-message{background-color:#f8d7da;color:#721c24;padding:12px 15px;border-radius:4px;margin-bottom:20px;display:flex;align-items:center;border:1px solid #f5c6cb;font-size:14px;animation:fadeIn .3s ease-in-out}.error-message .error-icon{display:inline-block;width:20px;height:20px;background-color:#dc3545;color:#fff;border-radius:50%;text-align:center;line-height:20px;margin-right:10px;font-weight:700;font-size:12px}.validation-error{color:#dc3545;font-size:12px;margin-top:5px;display:flex;align-items:center;animation:fadeIn .3s ease-in-out}.validation-error .error-icon{display:inline-block;width:16px;height:16px;background-color:#dc3545;color:#fff;border-radius:50%;text-align:center;line-height:16px;margin-right:6px;font-weight:700;font-size:10px}.invalid-input{border:1px solid #dc3545!important}.invalid-input:focus{box-shadow:0 0 0 .2rem #dc354540}.resend-container{margin-top:15px;text-align:center}.resend-container .resend-link{color:#007bff;cursor:pointer;text-decoration:underline;font-size:13px}.resend-container .resend-link:hover{color:#0056b3}.time-remaining{margin-top:16px;font-size:1rem;color:#f5f5f5}@keyframes fadeIn{0%{opacity:0;transform:translateY(-5px)}to{opacity:1;transform:translateY(0)}}@media(max-width:768px){.login-page-container{justify-content:center;padding-right:0;align-items:center}.login-container{max-width:90%;margin:20px auto}}\n"], dependencies: [{ kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1$3.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i1$3.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i1$3.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$3.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],[formArray],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i1$3.RequiredValidator, selector: ":not([type=checkbox])[required][formControlName],:not([type=checkbox])[required][formControl],:not([type=checkbox])[required][ngModel]", inputs: ["required"] }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i1$3.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i1$3.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "ngmodule", type: MatMenuModule }, { kind: "component", type: i2$3.MatMenu, selector: "mat-menu", inputs: ["backdropClass", "aria-label", "aria-labelledby", "aria-describedby", "xPosition", "yPosition", "overlapTrigger", "hasBackdrop", "class", "classList"], outputs: ["closed", "close"], exportAs: ["matMenu"] }, { kind: "component", type: i2$3.MatMenuItem, selector: "[mat-menu-item]", inputs: ["role", "disabled", "disableRipple"], exportAs: ["matMenuItem"] }, { kind: "directive", type: i2$3.MatMenuTrigger, selector: "[mat-menu-trigger-for], [matMenuTriggerFor]", inputs: ["mat-menu-trigger-for", "matMenuTriggerFor", "matMenuTriggerData", "matMenuTriggerRestoreFocus"], outputs: ["menuOpened", "onMenuOpen", "menuClosed", "onMenuClose"], exportAs: ["matMenuTrigger"] }, { kind: "ngmodule", type: MatIconModule }, { kind: "ngmodule", type: TranslateModule }, { kind: "pipe", type: i3$1.TranslatePipe, name: "translate" }] });
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.6", ngImport: i0, type: MfaLogin, decorators: [{
             type: Component,
@@ -3853,7 +3844,7 @@ class ForgotPassword extends AuthBase {
         });
     }
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.6", ngImport: i0, type: ForgotPassword, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.0.6", type: ForgotPassword, isStandalone: true, selector: "ntybase-forgot-password", usesInheritance: true, ngImport: i0, template: "<div class=\"login-page-container\">\n  <div class=\"login-image-container\"></div>\n\n  <div class=\"login-container glass-effect\">\n    <!-- Language Button -->\n    <div class=\"language-toggle\">\n      @if (icon()) {\n      <button mat-icon-button [matMenuTriggerFor]=\"languageMenu\">\n        <span class=\"{{ getCurrentLanguageIcon() }}\"></span>\n      </button>\n      } @else {\n      <button\n        mat-raised-button\n        color=\"primary\"\n        [matMenuTriggerFor]=\"languageMenu\"\n      >\n        {{ currentLanguage }}\n      </button>\n      }\n    </div>\n\n    <h2>{{'app_name' | translate }}</h2>\n\n    <!-- Language Menu -->\n    <mat-menu #languageMenu=\"matMenu\">\n      @for (language of languages; track language) {\n      <button mat-menu-item (click)=\"setLanguage(language)\">\n        <span class=\"{{ getLanguageIcon(language) }}\"></span>\n        {{ language }}\n      </button>\n      }\n    </mat-menu>\n\n    @if (!isLoading()) {\n    <form\n      (ngSubmit)=\"updatePassword()\"\n      [formGroup]=\"updatePasswordForm\"\n      novalidate\n    >\n      @if (error()) {\n      <div class=\"error-message\">\n        <span class=\"error-icon\">!</span>\n        {{ error() }}\n      </div>\n      }\n\n      <div class=\"form-group\">\n        <label for=\"username\">{{'@username' | translate}}</label>\n        <input\n          type=\"text\"\n          id=\"username\"\n          [placeholder]=\"'@username' | translate\"\n          formControlName=\"username\"\n          required\n        />\n      </div>\n\n      <div class=\"form-group\">\n        <label for=\"newPassword\">{{'@password' | translate}}</label>\n        <input\n          type=\"password\"\n          id=\"newPassword\"\n          [placeholder]=\"'@password' | translate\"\n          formControlName=\"newPassword\"\n          required\n        />\n        @if (updatePasswordForm.controls['newPassword'].invalid &&\n        updatePasswordForm.controls['newPassword'].touched) {\n        <mat-error class=\"validation-error\">\n          <span class=\"error-icon\">!</span>\n          {{ 'password is required' | translate }}\n        </mat-error>\n        }\n      </div>\n\n      <div class=\"form-group\">\n        <label for=\"newPasswordCheck\">{{'@passwordCheck' | translate}}</label>\n        <input\n          type=\"password\"\n          id=\"newPasswordCheck\"\n          [placeholder]=\"'@passwordCheck' | translate\"\n          formControlName=\"newPasswordCheck\"\n          required\n        />\n        @if (updatePasswordForm.controls['newPasswordCheck'].invalid &&\n        updatePasswordForm.controls['newPasswordCheck'].touched) {\n        <mat-error class=\"validation-error\">\n          <span class=\"error-icon\">!</span>\n          {{ 'password is required' | translate }}\n        </mat-error>\n        }\n      </div>\n\n      <button\n        type=\"submit\"\n        class=\"login-button\"\n        [disabled]=\"updatePasswordForm.invalid\"\n      >\n        {{ '@setPassword' | translate }}\n      </button>\n    </form>\n    } @else {\n    <!-- Burada eski #loading template'inin i\u00E7eri\u011Fi direkt olarak kullan\u0131l\u0131yor -->\n    <div class=\"loading-spinner\">\n      <span>{{ '@updatingPassword' | translate }}</span>\n    </div>\n    }\n\n    <div class=\"footer\">\n      <span class=\"version\">v{{version}}</span>\n    </div>\n  </div>\n</div>\n", styles: [".login-page-container{position:relative;display:flex;height:100vh;background-image:var(--forgot-password-bg-image, url(https://images.unsplash.com/photo-1519681393784-d120267933ba?ixid=MnwxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8&ixlib=rb-1.2.1&auto=format&fit=crop&w=1124&q=100));background-position:center;background-repeat:no-repeat;background-size:cover;background-attachment:fixed;justify-content:flex-end;padding-right:5%}.login-image-container{display:none}.login-container{width:100%;max-width:400px;padding:2.5rem;display:flex;flex-direction:column;justify-content:center;background:#ffffff1a;border-radius:16px;box-shadow:0 8px 32px #0003;backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);border:1px solid rgba(255,255,255,.2);margin:20px;height:fit-content;align-self:center}.login-container h2{color:#fff;text-align:center;margin-bottom:2rem;font-size:1.8rem;font-weight:600;text-shadow:0 2px 4px rgba(0,0,0,.3)}.form-group{margin-bottom:1.5rem}.form-group label{display:block;font-weight:500;color:#fff;font-size:.9rem;text-shadow:0 1px 2px rgba(0,0,0,.3)}.form-group input[type=text],.form-group input[type=password]{width:100%;padding:.85rem 1rem;margin-top:.5rem;border:1px solid rgba(255,255,255,.3);border-radius:8px;font-size:.95rem;background-color:#ffffff26;color:#fff}.form-group input::placeholder{color:#ffffffb3}.form-group input[type=text]:focus,.form-group input[type=password]:focus{outline:none;border-color:#ffffff80;background-color:#ffffff40;box-shadow:0 0 0 3px #ffffff1a}.remember{display:flex;align-items:center;margin-bottom:1.5rem}.remember input{width:18px;height:18px;margin-right:.75rem;cursor:pointer}.remember label{color:#fff;font-size:.9rem;cursor:pointer;-webkit-user-select:none;user-select:none;text-shadow:0 1px 2px rgba(0,0,0,.3)}.forgot-password{margin-left:auto;color:#ffffffe6;font-size:.85rem;text-decoration:none}.forgot-password:hover{text-decoration:underline}.login-button{width:100%;padding:1rem;background-color:#fff3;color:#fff;border:1px solid rgba(255,255,255,.4);border-radius:8px;font-size:1rem;font-weight:500;cursor:pointer;transition:all .2s}.login-button:hover{background-color:#ffffff4d}.loading-spinner{text-align:center;padding:2rem}.loading-spinner p{margin-top:1rem;color:#fff}.footer{margin-top:2rem;text-align:center}.version{color:#ffffffb3;font-size:.8rem;display:block;text-shadow:0 1px 2px rgba(0,0,0,.3)}@media(max-width:768px){.login-page-container{justify-content:center;padding-right:0;align-items:center}.login-container{max-width:90%;margin:20px auto}}.language-toggle{position:absolute;top:20px;right:20px;z-index:10}.language-toggle button{background:#fff3;-webkit-backdrop-filter:blur(5px);backdrop-filter:blur(5px);border:1px solid rgba(255,255,255,.3);cursor:pointer}.language-toggle button:hover{background:#ffffff4d}.language-toggle button mat-icon{color:#fff}.login-container h2{margin-top:.5rem}.flag-icon{width:24px;height:16px;margin-right:8px;border:1px solid #ddd}.error-message{background-color:#f8d7da;color:#721c24;padding:12px 15px;border-radius:4px;margin-bottom:20px;display:flex;align-items:center;border:1px solid #f5c6cb;font-size:14px;animation:fadeIn .3s ease-in-out}.error-message .error-icon{display:inline-block;width:20px;height:20px;background-color:#dc3545;color:#fff;border-radius:50%;text-align:center;line-height:20px;margin-right:10px;font-weight:700;font-size:12px}.validation-error{color:#dc3545;font-size:12px;margin-top:5px;display:flex;align-items:center;animation:fadeIn .3s ease-in-out}.validation-error .error-icon{display:inline-block;width:16px;height:16px;background-color:#dc3545;color:#fff;border-radius:50%;text-align:center;line-height:16px;margin-right:6px;font-weight:700;font-size:10px}input.ng-invalid.ng-touched{border:1px solid #dc3545!important}@keyframes fadeIn{0%{opacity:0;transform:translateY(-5px)}to{opacity:1;transform:translateY(0)}}\n"], dependencies: [{ kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1$4.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i1$4.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i1$4.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$4.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],[formArray],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i1$4.RequiredValidator, selector: ":not([type=checkbox])[required][formControlName],:not([type=checkbox])[required][formControl],:not([type=checkbox])[required][ngModel]", inputs: ["required"] }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i1$4.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i1$4.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "ngmodule", type: MatMenuModule }, { kind: "component", type: i2$3.MatMenu, selector: "mat-menu", inputs: ["backdropClass", "aria-label", "aria-labelledby", "aria-describedby", "xPosition", "yPosition", "overlapTrigger", "hasBackdrop", "class", "classList"], outputs: ["closed", "close"], exportAs: ["matMenu"] }, { kind: "component", type: i2$3.MatMenuItem, selector: "[mat-menu-item]", inputs: ["role", "disabled", "disableRipple"], exportAs: ["matMenuItem"] }, { kind: "directive", type: i2$3.MatMenuTrigger, selector: "[mat-menu-trigger-for], [matMenuTriggerFor]", inputs: ["mat-menu-trigger-for", "matMenuTriggerFor", "matMenuTriggerData", "matMenuTriggerRestoreFocus"], outputs: ["menuOpened", "onMenuOpen", "menuClosed", "onMenuClose"], exportAs: ["matMenuTrigger"] }, { kind: "ngmodule", type: MatIconModule }, { kind: "ngmodule", type: MatInputModule }, { kind: "directive", type: i3$1.MatError, selector: "mat-error, [matError]", inputs: ["id"] }, { kind: "ngmodule", type: MatFormFieldModule }, { kind: "ngmodule", type: TranslateModule }, { kind: "pipe", type: i1$1.TranslatePipe, name: "translate" }] });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.0.6", type: ForgotPassword, isStandalone: true, selector: "ntybase-forgot-password", usesInheritance: true, ngImport: i0, template: "<div class=\"login-page-container\">\n  <div class=\"login-image-container\"></div>\n\n  <div class=\"login-container glass-effect\">\n    <!-- Language Button -->\n    <div class=\"language-toggle\">\n      @if (icon()) {\n      <button mat-icon-button [matMenuTriggerFor]=\"languageMenu\">\n        <span class=\"{{ getCurrentLanguageIcon() }}\"></span>\n      </button>\n      } @else {\n      <button\n        mat-raised-button\n        color=\"primary\"\n        [matMenuTriggerFor]=\"languageMenu\"\n      >\n        {{ currentLanguage }}\n      </button>\n      }\n    </div>\n\n    <h2>{{'app_name' | translate }}</h2>\n\n    <!-- Language Menu -->\n    <mat-menu #languageMenu=\"matMenu\">\n      @for (language of languages; track language) {\n      <button mat-menu-item (click)=\"setLanguage(language)\">\n        <span class=\"{{ getLanguageIcon(language) }}\"></span>\n        {{ language }}\n      </button>\n      }\n    </mat-menu>\n\n    @if (!isLoading()) {\n    <form\n      (ngSubmit)=\"updatePassword()\"\n      [formGroup]=\"updatePasswordForm\"\n      novalidate\n    >\n      @if (error()) {\n      <div class=\"error-message\">\n        <span class=\"error-icon\">!</span>\n        {{ error() }}\n      </div>\n      }\n\n      <div class=\"form-group\">\n        <label for=\"username\">{{'@username' | translate}}</label>\n        <input\n          type=\"text\"\n          id=\"username\"\n          [placeholder]=\"'@username' | translate\"\n          formControlName=\"username\"\n          required\n        />\n      </div>\n\n      <div class=\"form-group\">\n        <label for=\"newPassword\">{{'@password' | translate}}</label>\n        <input\n          type=\"password\"\n          id=\"newPassword\"\n          [placeholder]=\"'@password' | translate\"\n          formControlName=\"newPassword\"\n          required\n        />\n        @if (updatePasswordForm.controls['newPassword'].invalid &&\n        updatePasswordForm.controls['newPassword'].touched) {\n        <mat-error class=\"validation-error\">\n          <span class=\"error-icon\">!</span>\n          {{ 'password is required' | translate }}\n        </mat-error>\n        }\n      </div>\n\n      <div class=\"form-group\">\n        <label for=\"newPasswordCheck\">{{'@passwordCheck' | translate}}</label>\n        <input\n          type=\"password\"\n          id=\"newPasswordCheck\"\n          [placeholder]=\"'@passwordCheck' | translate\"\n          formControlName=\"newPasswordCheck\"\n          required\n        />\n        @if (updatePasswordForm.controls['newPasswordCheck'].invalid &&\n        updatePasswordForm.controls['newPasswordCheck'].touched) {\n        <mat-error class=\"validation-error\">\n          <span class=\"error-icon\">!</span>\n          {{ 'password is required' | translate }}\n        </mat-error>\n        }\n      </div>\n\n      <button\n        type=\"submit\"\n        class=\"login-button\"\n        [disabled]=\"updatePasswordForm.invalid\"\n      >\n        {{ '@setPassword' | translate }}\n      </button>\n    </form>\n    } @else {\n    <!-- Burada eski #loading template'inin i\u00E7eri\u011Fi direkt olarak kullan\u0131l\u0131yor -->\n    <div class=\"loading-spinner\">\n      <span>{{ '@updatingPassword' | translate }}</span>\n    </div>\n    }\n\n    <div class=\"footer\">\n      <span class=\"version\">v{{version}}</span>\n    </div>\n  </div>\n</div>\n", styles: [".login-page-container{position:relative;display:flex;height:100vh;background-image:var(--forgot-password-bg-image, url(https://images.unsplash.com/photo-1519681393784-d120267933ba?ixid=MnwxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8&ixlib=rb-1.2.1&auto=format&fit=crop&w=1124&q=100));background-position:center;background-repeat:no-repeat;background-size:cover;background-attachment:fixed;justify-content:flex-end;padding-right:5%}.login-image-container{display:none}.login-container{width:100%;max-width:400px;padding:2.5rem;display:flex;flex-direction:column;justify-content:center;background:#ffffff1a;border-radius:16px;box-shadow:0 8px 32px #0003;backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);border:1px solid rgba(255,255,255,.2);margin:20px;height:fit-content;align-self:center}.login-container h2{color:#fff;text-align:center;margin-bottom:2rem;font-size:1.8rem;font-weight:600;text-shadow:0 2px 4px rgba(0,0,0,.3)}.form-group{margin-bottom:1.5rem}.form-group label{display:block;font-weight:500;color:#fff;font-size:.9rem;text-shadow:0 1px 2px rgba(0,0,0,.3)}.form-group input[type=text],.form-group input[type=password]{width:100%;padding:.85rem 1rem;margin-top:.5rem;border:1px solid rgba(255,255,255,.3);border-radius:8px;font-size:.95rem;background-color:#ffffff26;color:#fff}.form-group input::placeholder{color:#ffffffb3}.form-group input[type=text]:focus,.form-group input[type=password]:focus{outline:none;border-color:#ffffff80;background-color:#ffffff40;box-shadow:0 0 0 3px #ffffff1a}.remember{display:flex;align-items:center;margin-bottom:1.5rem}.remember input{width:18px;height:18px;margin-right:.75rem;cursor:pointer}.remember label{color:#fff;font-size:.9rem;cursor:pointer;-webkit-user-select:none;user-select:none;text-shadow:0 1px 2px rgba(0,0,0,.3)}.forgot-password{margin-left:auto;color:#ffffffe6;font-size:.85rem;text-decoration:none}.forgot-password:hover{text-decoration:underline}.login-button{width:100%;padding:1rem;background-color:#fff3;color:#fff;border:1px solid rgba(255,255,255,.4);border-radius:8px;font-size:1rem;font-weight:500;cursor:pointer;transition:all .2s}.login-button:hover{background-color:#ffffff4d}.loading-spinner{text-align:center;padding:2rem}.loading-spinner p{margin-top:1rem;color:#fff}.footer{margin-top:2rem;text-align:center}.version{color:#ffffffb3;font-size:.8rem;display:block;text-shadow:0 1px 2px rgba(0,0,0,.3)}@media(max-width:768px){.login-page-container{justify-content:center;padding-right:0;align-items:center}.login-container{max-width:90%;margin:20px auto}}.language-toggle{position:absolute;top:20px;right:20px;z-index:10}.language-toggle button{background:#fff3;-webkit-backdrop-filter:blur(5px);backdrop-filter:blur(5px);border:1px solid rgba(255,255,255,.3);cursor:pointer}.language-toggle button:hover{background:#ffffff4d}.language-toggle button mat-icon{color:#fff}.login-container h2{margin-top:.5rem}.flag-icon{width:24px;height:16px;margin-right:8px;border:1px solid #ddd}.error-message{background-color:#f8d7da;color:#721c24;padding:12px 15px;border-radius:4px;margin-bottom:20px;display:flex;align-items:center;border:1px solid #f5c6cb;font-size:14px;animation:fadeIn .3s ease-in-out}.error-message .error-icon{display:inline-block;width:20px;height:20px;background-color:#dc3545;color:#fff;border-radius:50%;text-align:center;line-height:20px;margin-right:10px;font-weight:700;font-size:12px}.validation-error{color:#dc3545;font-size:12px;margin-top:5px;display:flex;align-items:center;animation:fadeIn .3s ease-in-out}.validation-error .error-icon{display:inline-block;width:16px;height:16px;background-color:#dc3545;color:#fff;border-radius:50%;text-align:center;line-height:16px;margin-right:6px;font-weight:700;font-size:10px}input.ng-invalid.ng-touched{border:1px solid #dc3545!important}@keyframes fadeIn{0%{opacity:0;transform:translateY(-5px)}to{opacity:1;transform:translateY(0)}}\n"], dependencies: [{ kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1$3.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i1$3.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i1$3.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$3.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],[formArray],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i1$3.RequiredValidator, selector: ":not([type=checkbox])[required][formControlName],:not([type=checkbox])[required][formControl],:not([type=checkbox])[required][ngModel]", inputs: ["required"] }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i1$3.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i1$3.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "ngmodule", type: MatMenuModule }, { kind: "component", type: i2$3.MatMenu, selector: "mat-menu", inputs: ["backdropClass", "aria-label", "aria-labelledby", "aria-describedby", "xPosition", "yPosition", "overlapTrigger", "hasBackdrop", "class", "classList"], outputs: ["closed", "close"], exportAs: ["matMenu"] }, { kind: "component", type: i2$3.MatMenuItem, selector: "[mat-menu-item]", inputs: ["role", "disabled", "disableRipple"], exportAs: ["matMenuItem"] }, { kind: "directive", type: i2$3.MatMenuTrigger, selector: "[mat-menu-trigger-for], [matMenuTriggerFor]", inputs: ["mat-menu-trigger-for", "matMenuTriggerFor", "matMenuTriggerData", "matMenuTriggerRestoreFocus"], outputs: ["menuOpened", "onMenuOpen", "menuClosed", "onMenuClose"], exportAs: ["matMenuTrigger"] }, { kind: "ngmodule", type: MatIconModule }, { kind: "ngmodule", type: MatInputModule }, { kind: "directive", type: i3$2.MatError, selector: "mat-error, [matError]", inputs: ["id"] }, { kind: "ngmodule", type: MatFormFieldModule }, { kind: "ngmodule", type: TranslateModule }, { kind: "pipe", type: i3$1.TranslatePipe, name: "translate" }] });
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.6", ngImport: i0, type: ForgotPassword, decorators: [{
             type: Component,
@@ -4027,7 +4018,7 @@ class EnvironmentInfo {
         }
     }
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.6", ngImport: i0, type: EnvironmentInfo, deps: [{ token: EnvironmentInfoService }], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.0.6", type: EnvironmentInfo, isStandalone: true, selector: "ntybase-environment-info", inputs: { showNettyInfo: "showNettyInfo" }, ngImport: i0, template: "<div class=\"environment-info\" [class.production]=\"isProduction\">\n  <div class=\"info-card\">\n    <div class=\"card-header\">\n      <h3>{{ 'ENVIRONMENT_INFO.applicationInfo' | translate }}</h3>\n      <span class=\"env-badge\" [class.prod]=\"isProduction\">\n        {{ isProduction ? ('ENVIRONMENT_INFO.prod' | translate) :\n        ('ENVIRONMENT_INFO.dev' | translate) }}\n      </span>\n    </div>\n\n    <div class=\"info-grid\">\n      <div class=\"info-item\">\n        <span class=\"label\">{{ 'ENVIRONMENT_INFO.version' | translate }}</span>\n        <span class=\"value\">{{ version }}</span>\n      </div>\n\n      <div class=\"info-item\">\n        <span class=\"label\"\n          >{{ 'ENVIRONMENT_INFO.defaultLanguage' | translate }}</span\n        >\n        <span class=\"value\">{{ defaultLanguage }}</span>\n      </div>\n\n      <div class=\"info-item\">\n        <span class=\"label\"\n          >{{ 'ENVIRONMENT_INFO.supportedLanguages' | translate }}</span\n        >\n        <span class=\"value\">{{ supportedLanguages.join(', ') }}</span>\n      </div>\n    </div>\n\n    @if (showNettyInfo) {\n    <div class=\"netty-info\">\n      <h4>{{ 'ENVIRONMENT_INFO.nettyConnections' | translate }}</h4>\n\n      <div class=\"info-grid\">\n        <div class=\"info-item\">\n          <span class=\"label\">{{ 'ENVIRONMENT_INFO.apiUrl' | translate }}</span>\n          <span class=\"value\">{{ apiUrl }}</span>\n        </div>\n\n        <div class=\"info-item\">\n          <span class=\"label\"\n            >{{ 'ENVIRONMENT_INFO.adminUrl' | translate }}</span\n          >\n          <span class=\"value\">{{ adminUrl }}</span>\n        </div>\n\n        <div class=\"info-item\">\n          <span class=\"label\"\n            >{{ 'ENVIRONMENT_INFO.baseHref' | translate }}</span\n          >\n          <span class=\"value\">{{ baseHref }}</span>\n        </div>\n\n        <div class=\"info-item\">\n          <span class=\"label\"\n            >{{ 'ENVIRONMENT_INFO.application' | translate }}</span\n          >\n          <span class=\"value\">{{ application }}</span>\n        </div>\n      </div>\n    </div>\n    } @if (!hasConfig) {\n    <div class=\"no-config\">{{ 'ENVIRONMENT_INFO.noConfig' | translate }}</div>\n    }\n  </div>\n</div>\n", styles: ["@charset \"UTF-8\";.environment-info{padding:24px;font-family:Inter,Arial,sans-serif;display:flex;justify-content:center}.info-card{width:100%;max-width:720px;background:var(--mat-sys-on-primary);border-radius:12px;padding:24px;box-shadow:0 8px 24px #0000000f;transition:all .3s ease;border:2px solid var(--mat-sys-on-primary-container)}.card-header{display:flex;align-items:center;justify-content:space-between;margin-bottom:24px}.card-header h3{margin:0;font-size:20px;font-weight:600;color:var(--mat-sys-on-primary-container)}.env-badge{padding:6px 12px;border-radius:999px;font-size:12px;font-weight:600;background:var(--mat-sys-on-primary-container);color:var(--mat-sys-surface)}.env-badge.prod{background:var(--mat-sys-on-primary-container);color:var(--mat-sys-surface)}.info-grid{display:grid;grid-template-columns:1fr 2fr;gap:14px 20px;margin-bottom:20px}.info-item{display:contents}.label{color:var(--mat-sys-on-primary-container);font-size:13px;font-weight:500}.value{color:var(--mat-sys-on-primary-container);font-size:14px;font-weight:500;word-break:break-word}.netty-info{margin-top:24px;padding-top:20px;border-top:1px solid var(--mat-sys-primary)}.netty-info h4{margin:0 0 16px;font-size:20px;font-weight:600;color:var(--mat-sys-on-primary-container)}.production .info-card{border-left:6px solid #ef4444}.no-config{margin-top:20px;padding:14px;background:var(--mat-sys-primary-fixed);border:1px solid #fed7aa;border-radius:8px;color:#c2410c;font-weight:600;text-align:center}\n"], dependencies: [{ kind: "ngmodule", type: TranslateModule }, { kind: "pipe", type: i1$1.TranslatePipe, name: "translate" }] });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.0.6", type: EnvironmentInfo, isStandalone: true, selector: "ntybase-environment-info", inputs: { showNettyInfo: "showNettyInfo" }, ngImport: i0, template: "<div class=\"environment-info\" [class.production]=\"isProduction\">\n  <div class=\"info-card\">\n    <div class=\"card-header\">\n      <h3>{{ 'ENVIRONMENT_INFO.applicationInfo' | translate }}</h3>\n      <span class=\"env-badge\" [class.prod]=\"isProduction\">\n        {{ isProduction ? ('ENVIRONMENT_INFO.prod' | translate) :\n        ('ENVIRONMENT_INFO.dev' | translate) }}\n      </span>\n    </div>\n\n    <div class=\"info-grid\">\n      <div class=\"info-item\">\n        <span class=\"label\">{{ 'ENVIRONMENT_INFO.version' | translate }}</span>\n        <span class=\"value\">{{ version }}</span>\n      </div>\n\n      <div class=\"info-item\">\n        <span class=\"label\"\n          >{{ 'ENVIRONMENT_INFO.defaultLanguage' | translate }}</span\n        >\n        <span class=\"value\">{{ defaultLanguage }}</span>\n      </div>\n\n      <div class=\"info-item\">\n        <span class=\"label\"\n          >{{ 'ENVIRONMENT_INFO.supportedLanguages' | translate }}</span\n        >\n        <span class=\"value\">{{ supportedLanguages.join(', ') }}</span>\n      </div>\n    </div>\n\n    @if (showNettyInfo) {\n    <div class=\"netty-info\">\n      <h4>{{ 'ENVIRONMENT_INFO.nettyConnections' | translate }}</h4>\n\n      <div class=\"info-grid\">\n        <div class=\"info-item\">\n          <span class=\"label\">{{ 'ENVIRONMENT_INFO.apiUrl' | translate }}</span>\n          <span class=\"value\">{{ apiUrl }}</span>\n        </div>\n\n        <div class=\"info-item\">\n          <span class=\"label\"\n            >{{ 'ENVIRONMENT_INFO.adminUrl' | translate }}</span\n          >\n          <span class=\"value\">{{ adminUrl }}</span>\n        </div>\n\n        <div class=\"info-item\">\n          <span class=\"label\"\n            >{{ 'ENVIRONMENT_INFO.baseHref' | translate }}</span\n          >\n          <span class=\"value\">{{ baseHref }}</span>\n        </div>\n\n        <div class=\"info-item\">\n          <span class=\"label\"\n            >{{ 'ENVIRONMENT_INFO.application' | translate }}</span\n          >\n          <span class=\"value\">{{ application }}</span>\n        </div>\n      </div>\n    </div>\n    } @if (!hasConfig) {\n    <div class=\"no-config\">{{ 'ENVIRONMENT_INFO.noConfig' | translate }}</div>\n    }\n  </div>\n</div>\n", styles: ["@charset \"UTF-8\";.environment-info{padding:24px;font-family:Inter,Arial,sans-serif;display:flex;justify-content:center}.info-card{width:100%;max-width:720px;background:var(--mat-sys-on-primary);border-radius:12px;padding:24px;box-shadow:0 8px 24px #0000000f;transition:all .3s ease;border:2px solid var(--mat-sys-on-primary-container)}.card-header{display:flex;align-items:center;justify-content:space-between;margin-bottom:24px}.card-header h3{margin:0;font-size:20px;font-weight:600;color:var(--mat-sys-on-primary-container)}.env-badge{padding:6px 12px;border-radius:999px;font-size:12px;font-weight:600;background:var(--mat-sys-on-primary-container);color:var(--mat-sys-surface)}.env-badge.prod{background:var(--mat-sys-on-primary-container);color:var(--mat-sys-surface)}.info-grid{display:grid;grid-template-columns:1fr 2fr;gap:14px 20px;margin-bottom:20px}.info-item{display:contents}.label{color:var(--mat-sys-on-primary-container);font-size:13px;font-weight:500}.value{color:var(--mat-sys-on-primary-container);font-size:14px;font-weight:500;word-break:break-word}.netty-info{margin-top:24px;padding-top:20px;border-top:1px solid var(--mat-sys-primary)}.netty-info h4{margin:0 0 16px;font-size:20px;font-weight:600;color:var(--mat-sys-on-primary-container)}.production .info-card{border-left:6px solid #ef4444}.no-config{margin-top:20px;padding:14px;background:var(--mat-sys-primary-fixed);border:1px solid #fed7aa;border-radius:8px;color:#c2410c;font-weight:600;text-align:center}\n"], dependencies: [{ kind: "ngmodule", type: TranslateModule }, { kind: "pipe", type: i3$1.TranslatePipe, name: "translate" }] });
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.6", ngImport: i0, type: EnvironmentInfo, decorators: [{
             type: Component,
@@ -4167,7 +4158,7 @@ class NtyLoadingComponent {
     loadingService = inject(NtyLoadingService);
     isLoading = this.loadingService.isLoading;
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.6", ngImport: i0, type: NtyLoadingComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.0.6", type: NtyLoadingComponent, isStandalone: true, selector: "app-nty-loading", ngImport: i0, template: "@if (isLoading()) {\n<div class=\"loading-overlay\" (click)=\"$event.stopPropagation(); $event.preventDefault()\">\n    <div class=\"spinner\">\n        <i class=\"fas fa-spinner\"></i>\n    </div>\n    <div style=\"margin-top: 10px;\">{{'@loading' | translate}}</div>\n</div>\n}", styles: [".loading-overlay{position:fixed;top:0;left:0;width:100%;height:100%;background-color:#00000080;z-index:2147483647;display:flex;justify-content:center;align-items:center;color:#fff;flex-direction:column;pointer-events:all;cursor:wait;-webkit-user-select:none;user-select:none}.spinner{font-size:3rem}@keyframes spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}.fa-spinner{animation:spin 1s linear infinite}\n"], dependencies: [{ kind: "ngmodule", type: TranslateModule }, { kind: "pipe", type: i1$1.TranslatePipe, name: "translate" }] });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.0.6", type: NtyLoadingComponent, isStandalone: true, selector: "app-nty-loading", ngImport: i0, template: "@if (isLoading()) {\n<div class=\"loading-overlay\" (click)=\"$event.stopPropagation(); $event.preventDefault()\">\n    <div class=\"spinner\">\n        <i class=\"fas fa-spinner\"></i>\n    </div>\n    <div style=\"margin-top: 10px;\">{{'@loading' | translate}}</div>\n</div>\n}", styles: [".loading-overlay{position:fixed;top:0;left:0;width:100%;height:100%;background-color:#00000080;z-index:2147483647;display:flex;justify-content:center;align-items:center;color:#fff;flex-direction:column;pointer-events:all;cursor:wait;-webkit-user-select:none;user-select:none}.spinner{font-size:3rem}@keyframes spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}.fa-spinner{animation:spin 1s linear infinite}\n"], dependencies: [{ kind: "ngmodule", type: TranslateModule }, { kind: "pipe", type: i3$1.TranslatePipe, name: "translate" }] });
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.6", ngImport: i0, type: NtyLoadingComponent, decorators: [{
             type: Component,