tickera-angular-components 0.0.1-dev.197 → 0.0.1-dev.198

package/fesm2022/tickera-angular-components.mjs

@@ -1,8 +1,8 @@
 import * as i0 from '@angular/core';
 import { InjectionToken, makeEnvironmentProviders, PLATFORM_ID, Inject, Injectable, signal, LOCALE_ID, computed, inject, EventEmitter, Input, Output, Component, ViewEncapsulation, HostListener, Self, Optional, Injector, forwardRef, effect, untracked, ViewChild, viewChildren } from '@angular/core';
-import * as i1$3 from '@jsverse/transloco';
+import * as i2 from '@jsverse/transloco';
 import { provideTransloco, TranslocoModule, TranslocoService } from '@jsverse/transloco';
-import { from, throwError, BehaviorSubject, Subject, of, Observable, takeUntil as takeUntil$1 } from 'rxjs';
+import { from, throwError, BehaviorSubject, Subject, of, Observable, filter, takeUntil as takeUntil$1 } from 'rxjs';
 import * as i1$1 from '@angular/common';
 import { DATE_PIPE_DEFAULT_OPTIONS, isPlatformBrowser, formatDate, CommonModule, DatePipe } from '@angular/common';
 import { provideTippyLoader, provideTippyConfig, popperVariation, tooltipVariation } from '@ngneat/helipopper/config';
@@ -12,10 +12,10 @@ export { TippyDirective } from '@ngneat/helipopper';
 import * as i1 from '@angular/common/http';
 import { HttpHeaders, HttpErrorResponse } from '@angular/common/http';
 import { catchError, map, tap, distinctUntilChanged, debounceTime, switchMap, takeUntil } from 'rxjs/operators';
-import { toast } from 'ngx-sonner';
+import { toast, NgxSonnerToaster } from 'ngx-sonner';
 import { toObservable } from '@angular/core/rxjs-interop';
-import * as i3$1 from '@angular/router';
-import { RouterLink, RouterModule } from '@angular/router';
+import * as i1$3 from '@angular/router';
+import { RouterLink, RouterModule, NavigationEnd, RouterOutlet } from '@angular/router';
 import * as i1$2 from '@angular/forms';
 import { FormsModule, ReactiveFormsModule, Validators, NgControl, NG_VALUE_ACCESSOR, NG_VALIDATORS } from '@angular/forms';
 import * as i3 from '@ng-select/ng-select';
@@ -2690,6 +2690,30 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.25", ngImpo
                     args: [TICKERA_COMPONENTS_CONFIG]
                 }] }] });
 
+/**
+ * Shared open/close state for the mobile off-canvas sidebar.
+ * On viewports >= lg the sidebar is always visible (see sidebar-menu.component.html),
+ * so this state only has a visual effect below the `lg` breakpoint.
+ */
+class SidebarStateService {
+    isMobileOpen = signal(false, ...(ngDevMode ? [{ debugName: "isMobileOpen" }] : []));
+    open() {
+        this.isMobileOpen.set(true);
+    }
+    close() {
+        this.isMobileOpen.set(false);
+    }
+    toggle() {
+        this.isMobileOpen.set(!this.isMobileOpen());
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.25", ngImport: i0, type: SidebarStateService, deps: [], target: i0.ɵɵFactoryTarget.Injectable });
+    static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "20.3.25", ngImport: i0, type: SidebarStateService, providedIn: 'root' });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.25", ngImport: i0, type: SidebarStateService, decorators: [{
+            type: Injectable,
+            args: [{ providedIn: 'root' }]
+        }] });
+
 /**
  * Deshabilita el zoom del NAVEGADOR (no el zoom interno del mapa de
  * asientos, que sigue funcionando igual). Se instancia una sola vez —
@@ -5389,7 +5413,7 @@ class FormInputComponent {
         }
         return baseClasses;
     }
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.25", ngImport: i0, type: FormInputComponent, deps: [{ token: i1$2.NgControl, optional: true, self: true }, { token: i1$3.TranslocoService }], target: i0.ɵɵFactoryTarget.Component });
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.25", ngImport: i0, type: FormInputComponent, deps: [{ token: i1$2.NgControl, optional: true, self: true }, { token: i2.TranslocoService }], target: i0.ɵɵFactoryTarget.Component });
     static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.25", type: FormInputComponent, isStandalone: true, selector: "form-input", inputs: { label: "label", type: "type", name: "name", id: "id", placeholder: "placeholder", required: "required", readonly: "readonly", maxlength: "maxlength", minlength: "minlength", max: "max", min: "min", step: "step", pattern: "pattern", fieldGroupClass: "fieldGroupClass", autocomplete: "autocomplete" }, ngImport: i0, template: "<div [class]=\"fieldGroupClasses\">\n  @if (label) {\n    <label [for]=\"inputId\" class=\"form-input-label\">\n      {{ label }}\n\n      @if (required) {\n        <span class=\"form-input-required\">*</span>\n      }\n    </label>\n  }\n\n  <div class=\"relative\">\n    <input\n      [type]=\"type\"\n      [id]=\"inputId\"\n      [name]=\"name\"\n      [placeholder]=\"placeholder\"\n      [required]=\"required\"\n      [minlength]=\"minlength\"\n      [maxlength]=\"maxlength\"\n      [pattern]=\"pattern || ''\"\n      [(ngModel)]=\"value\"\n      (ngModelChange)=\"onInput($event)\"\n      (blur)=\"onTouched()\"\n      [readonly]=\"readonly\"\n      [disabled]=\"disabled\"\n      [class.disabled]=\"readonly\"\n      [class.error]=\"showError\"\n      class=\"form-input\"\n      [autocomplete]=\"autocomplete\"\n      [min]=\"min\"\n      [max]=\"max\"\n      [step]=\"step\"\n    />\n  </div>\n\n  @if (showError) {\n    <div class=\"form-input-error-message\">\n      {{ errorMessage }}\n    </div>\n  }\n</div>\n", styles: [".form-input-label{color:#374151;display:block;font-size:.875rem;font-weight:600;margin-bottom:.25rem}@media(prefers-color-scheme:dark){.form-input-label{color:#d1d5db}}.form-input{background-color:#fff;border:1px solid #d1d5db;border-radius:.375rem;color:#111827;display:block;outline:0;padding:.375rem .75rem;width:100%}.form-input::placeholder{color:#9ca3af}.form-input:focus{border-color:#1f2937}.form-input.error{outline-color:#ef4444}@media(prefers-color-scheme:dark){.form-input.error{background-color:#374151;outline-color:#ef4444}}.form-input.disabled{background-color:#e5e7eb;color:#6b7280;cursor:not-allowed}@media(prefers-color-scheme:dark){.form-input.disabled{background-color:#374151;color:#d1d5db}}@media screen and (min-width:768px){.form-input{font-size:.875rem}}.form-input-required{color:#ef4444}.form-input-error-message{color:#ef4444;font-size:.75rem;margin-top:.25rem}\n"], dependencies: [{ kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1$2.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$2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$2.RequiredValidator, selector: ":not([type=checkbox])[required][formControlName],:not([type=checkbox])[required][formControl],:not([type=checkbox])[required][ngModel]", inputs: ["required"] }, { kind: "directive", type: i1$2.MinLengthValidator, selector: "[minlength][formControlName],[minlength][formControl],[minlength][ngModel]", inputs: ["minlength"] }, { kind: "directive", type: i1$2.MaxLengthValidator, selector: "[maxlength][formControlName],[maxlength][formControl],[maxlength][ngModel]", inputs: ["maxlength"] }, { kind: "directive", type: i1$2.PatternValidator, selector: "[pattern][formControlName],[pattern][formControl],[pattern][ngModel]", inputs: ["pattern"] }, { kind: "directive", type: i1$2.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "ngmodule", type: CommonModule }, { kind: "ngmodule", type: ReactiveFormsModule }] });
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.25", ngImport: i0, type: FormInputComponent, decorators: [{
@@ -5399,7 +5423,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.25", ngImpo
                     type: Self
                 }, {
                     type: Optional
-                }] }, { type: i1$3.TranslocoService }], propDecorators: { label: [{
+                }] }, { type: i2.TranslocoService }], propDecorators: { label: [{
                 type: Input
             }], type: [{
                 type: Input
@@ -5504,8 +5528,8 @@ class DeleteConfirmationComponent {
         this.deleteConfirmationForm.reset();
         this.step = 'input';
     }
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.25", ngImport: i0, type: DeleteConfirmationComponent, deps: [{ token: i1$2.FormBuilder }, { token: DeleteConfirmationService }, { token: i1$3.TranslocoService }], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.25", type: DeleteConfirmationComponent, isStandalone: true, selector: "delete-confirmation", ngImport: i0, template: "@if (isOpen()) {\n  <app-modal\n    [title]=\"title\"\n    [isOpen]=\"isOpen\"\n    (closeModal)=\"onCloseModal()\"\n    [interactiveClose]=\"false\"\n  >\n    @if (!isFinalStep) {\n      <form\n        [formGroup]=\"deleteConfirmationForm\"\n        method=\"POST\"\n        class=\"delete-confirmation-content\"\n        (ngSubmit)=\"onConfirmDelete()\"\n      >\n        <app-alert\n          type=\"warning\"\n          [text]=\"'deleteConfirmation.warning' | transloco\"\n          size=\"sm\"\n          [closeable]=\"false\"\n        />\n\n        <p class=\"delete-confirmation-instructions\">\n          {{ 'deleteConfirmation.instructions' | transloco }}\n\n          <span class=\"delete-confirmation-highlight\">\n            {{ confirmationText }}\n          </span>\n        </p>\n\n        <form-input\n          name=\"confirmationText\"\n          type=\"text\"\n          class=\"delete-confirmation-field\"\n          [required]=\"true\"\n          autocomplete=\"off\"\n          formControlName=\"confirmationText\"\n          [placeholder]=\"\n            transloco.translate('deleteConfirmation.placeholder', { text: confirmationText })\n          \"\n        />\n\n        <div class=\"delete-confirmation-actions\">\n          <app-button\n            variant=\"tertiary\"\n            [text]=\"'deleteConfirmation.cancel' | transloco\"\n            (click)=\"onCloseModal()\"\n            size=\"sm\"\n          />\n\n          <app-button\n            type=\"submit\"\n            variant=\"primary\"\n            [text]=\"'deleteConfirmation.delete' | transloco\"\n            [disabled]=\"!isConfirmationValid\"\n            size=\"sm\"\n          />\n        </div>\n      </form>\n    } @else {\n      <div class=\"delete-confirmation-content\" data-testid=\"delete-confirmation-final-step\">\n        <app-alert\n          type=\"warning\"\n          [text]=\"'deleteConfirmation.finalWarning' | transloco\"\n          size=\"sm\"\n          [closeable]=\"false\"\n        />\n\n        <p class=\"delete-confirmation-instructions\">\n          {{ transloco.translate('deleteConfirmation.finalMessage', { resource: resourceName }) }}\n        </p>\n\n        <div class=\"delete-confirmation-actions\">\n          <app-button\n            type=\"button\"\n            variant=\"tertiary\"\n            [text]=\"'deleteConfirmation.cancel' | transloco\"\n            (click)=\"onBackToInput()\"\n            size=\"sm\"\n          />\n\n          <app-button\n            type=\"button\"\n            variant=\"primary\"\n            [text]=\"'deleteConfirmation.finalConfirm' | transloco\"\n            (click)=\"onFinalConfirm()\"\n            size=\"sm\"\n          />\n        </div>\n      </div>\n    }\n  </app-modal>\n}\n", styles: [".delete-confirmation-content{display:flex;flex-direction:column;gap:1rem;animation:slideUp .3s ease-out}.delete-confirmation-instructions{font-size:.75rem;color:#4b5563;margin:0}@media(prefers-color-scheme:dark){.delete-confirmation-instructions{color:#9ca3af}}.delete-confirmation-highlight{display:inline-flex;align-items:center;gap:.25rem;padding:.25rem .5rem;margin-top:.25rem;background-color:#e5e7eb;color:#dc2626;font-weight:600;font-size:.875rem;border-radius:.375rem}@media(prefers-color-scheme:dark){.delete-confirmation-highlight{background-color:#374151}}.delete-confirmation-field{flex:1}.delete-confirmation-actions{display:flex;gap:.75rem}@keyframes slideUp{0%{transform:translateY(20px);opacity:0}to{transform:translateY(0);opacity:1}}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i1$2.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i1$2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$2.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i1$2.RequiredValidator, selector: ":not([type=checkbox])[required][formControlName],:not([type=checkbox])[required][formControl],:not([type=checkbox])[required][ngModel]", inputs: ["required"] }, { kind: "directive", type: i1$2.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i1$2.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "ngmodule", type: TranslocoModule }, { kind: "component", type: AppButtonComponent, selector: "app-button", inputs: ["disabled", "loading", "type", "variant", "text", "size", "loadingText", "icon", "tooltip"], outputs: ["clicked"] }, { kind: "component", type: FormInputComponent, selector: "form-input", inputs: ["label", "type", "name", "id", "placeholder", "required", "readonly", "maxlength", "minlength", "max", "min", "step", "pattern", "fieldGroupClass", "autocomplete"] }, { kind: "component", type: AppModalComponent, selector: "app-modal", inputs: ["title", "disableClose", "showHeader", "showCloseButton", "showTitle", "interactiveClose", "isOpen", "size"], outputs: ["closeModal"] }, { kind: "component", type: AppAlertComponent, selector: "app-alert", inputs: ["type", "text", "closeable", "size"] }, { kind: "pipe", type: i1$3.TranslocoPipe, name: "transloco" }], encapsulation: i0.ViewEncapsulation.None });
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.25", ngImport: i0, type: DeleteConfirmationComponent, deps: [{ token: i1$2.FormBuilder }, { token: DeleteConfirmationService }, { token: i2.TranslocoService }], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.25", type: DeleteConfirmationComponent, isStandalone: true, selector: "delete-confirmation", ngImport: i0, template: "@if (isOpen()) {\n  <app-modal\n    [title]=\"title\"\n    [isOpen]=\"isOpen\"\n    (closeModal)=\"onCloseModal()\"\n    [interactiveClose]=\"false\"\n  >\n    @if (!isFinalStep) {\n      <form\n        [formGroup]=\"deleteConfirmationForm\"\n        method=\"POST\"\n        class=\"delete-confirmation-content\"\n        (ngSubmit)=\"onConfirmDelete()\"\n      >\n        <app-alert\n          type=\"warning\"\n          [text]=\"'deleteConfirmation.warning' | transloco\"\n          size=\"sm\"\n          [closeable]=\"false\"\n        />\n\n        <p class=\"delete-confirmation-instructions\">\n          {{ 'deleteConfirmation.instructions' | transloco }}\n\n          <span class=\"delete-confirmation-highlight\">\n            {{ confirmationText }}\n          </span>\n        </p>\n\n        <form-input\n          name=\"confirmationText\"\n          type=\"text\"\n          class=\"delete-confirmation-field\"\n          [required]=\"true\"\n          autocomplete=\"off\"\n          formControlName=\"confirmationText\"\n          [placeholder]=\"\n            transloco.translate('deleteConfirmation.placeholder', { text: confirmationText })\n          \"\n        />\n\n        <div class=\"delete-confirmation-actions\">\n          <app-button\n            variant=\"tertiary\"\n            [text]=\"'deleteConfirmation.cancel' | transloco\"\n            (click)=\"onCloseModal()\"\n            size=\"sm\"\n          />\n\n          <app-button\n            type=\"submit\"\n            variant=\"primary\"\n            [text]=\"'deleteConfirmation.delete' | transloco\"\n            [disabled]=\"!isConfirmationValid\"\n            size=\"sm\"\n          />\n        </div>\n      </form>\n    } @else {\n      <div class=\"delete-confirmation-content\" data-testid=\"delete-confirmation-final-step\">\n        <app-alert\n          type=\"warning\"\n          [text]=\"'deleteConfirmation.finalWarning' | transloco\"\n          size=\"sm\"\n          [closeable]=\"false\"\n        />\n\n        <p class=\"delete-confirmation-instructions\">\n          {{ transloco.translate('deleteConfirmation.finalMessage', { resource: resourceName }) }}\n        </p>\n\n        <div class=\"delete-confirmation-actions\">\n          <app-button\n            type=\"button\"\n            variant=\"tertiary\"\n            [text]=\"'deleteConfirmation.cancel' | transloco\"\n            (click)=\"onBackToInput()\"\n            size=\"sm\"\n          />\n\n          <app-button\n            type=\"button\"\n            variant=\"primary\"\n            [text]=\"'deleteConfirmation.finalConfirm' | transloco\"\n            (click)=\"onFinalConfirm()\"\n            size=\"sm\"\n          />\n        </div>\n      </div>\n    }\n  </app-modal>\n}\n", styles: [".delete-confirmation-content{display:flex;flex-direction:column;gap:1rem;animation:slideUp .3s ease-out}.delete-confirmation-instructions{font-size:.75rem;color:#4b5563;margin:0}@media(prefers-color-scheme:dark){.delete-confirmation-instructions{color:#9ca3af}}.delete-confirmation-highlight{display:inline-flex;align-items:center;gap:.25rem;padding:.25rem .5rem;margin-top:.25rem;background-color:#e5e7eb;color:#dc2626;font-weight:600;font-size:.875rem;border-radius:.375rem}@media(prefers-color-scheme:dark){.delete-confirmation-highlight{background-color:#374151}}.delete-confirmation-field{flex:1}.delete-confirmation-actions{display:flex;gap:.75rem}@keyframes slideUp{0%{transform:translateY(20px);opacity:0}to{transform:translateY(0);opacity:1}}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i1$2.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i1$2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$2.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i1$2.RequiredValidator, selector: ":not([type=checkbox])[required][formControlName],:not([type=checkbox])[required][formControl],:not([type=checkbox])[required][ngModel]", inputs: ["required"] }, { kind: "directive", type: i1$2.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i1$2.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "ngmodule", type: TranslocoModule }, { kind: "component", type: AppButtonComponent, selector: "app-button", inputs: ["disabled", "loading", "type", "variant", "text", "size", "loadingText", "icon", "tooltip"], outputs: ["clicked"] }, { kind: "component", type: FormInputComponent, selector: "form-input", inputs: ["label", "type", "name", "id", "placeholder", "required", "readonly", "maxlength", "minlength", "max", "min", "step", "pattern", "fieldGroupClass", "autocomplete"] }, { kind: "component", type: AppModalComponent, selector: "app-modal", inputs: ["title", "disableClose", "showHeader", "showCloseButton", "showTitle", "interactiveClose", "isOpen", "size"], outputs: ["closeModal"] }, { kind: "component", type: AppAlertComponent, selector: "app-alert", inputs: ["type", "text", "closeable", "size"] }, { kind: "pipe", type: i2.TranslocoPipe, name: "transloco" }], encapsulation: i0.ViewEncapsulation.None });
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.25", ngImport: i0, type: DeleteConfirmationComponent, decorators: [{
             type: Component,
@@ -5518,7 +5542,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.25", ngImpo
                         AppModalComponent,
                         AppAlertComponent,
                     ], encapsulation: ViewEncapsulation.None, template: "@if (isOpen()) {\n  <app-modal\n    [title]=\"title\"\n    [isOpen]=\"isOpen\"\n    (closeModal)=\"onCloseModal()\"\n    [interactiveClose]=\"false\"\n  >\n    @if (!isFinalStep) {\n      <form\n        [formGroup]=\"deleteConfirmationForm\"\n        method=\"POST\"\n        class=\"delete-confirmation-content\"\n        (ngSubmit)=\"onConfirmDelete()\"\n      >\n        <app-alert\n          type=\"warning\"\n          [text]=\"'deleteConfirmation.warning' | transloco\"\n          size=\"sm\"\n          [closeable]=\"false\"\n        />\n\n        <p class=\"delete-confirmation-instructions\">\n          {{ 'deleteConfirmation.instructions' | transloco }}\n\n          <span class=\"delete-confirmation-highlight\">\n            {{ confirmationText }}\n          </span>\n        </p>\n\n        <form-input\n          name=\"confirmationText\"\n          type=\"text\"\n          class=\"delete-confirmation-field\"\n          [required]=\"true\"\n          autocomplete=\"off\"\n          formControlName=\"confirmationText\"\n          [placeholder]=\"\n            transloco.translate('deleteConfirmation.placeholder', { text: confirmationText })\n          \"\n        />\n\n        <div class=\"delete-confirmation-actions\">\n          <app-button\n            variant=\"tertiary\"\n            [text]=\"'deleteConfirmation.cancel' | transloco\"\n            (click)=\"onCloseModal()\"\n            size=\"sm\"\n          />\n\n          <app-button\n            type=\"submit\"\n            variant=\"primary\"\n            [text]=\"'deleteConfirmation.delete' | transloco\"\n            [disabled]=\"!isConfirmationValid\"\n            size=\"sm\"\n          />\n        </div>\n      </form>\n    } @else {\n      <div class=\"delete-confirmation-content\" data-testid=\"delete-confirmation-final-step\">\n        <app-alert\n          type=\"warning\"\n          [text]=\"'deleteConfirmation.finalWarning' | transloco\"\n          size=\"sm\"\n          [closeable]=\"false\"\n        />\n\n        <p class=\"delete-confirmation-instructions\">\n          {{ transloco.translate('deleteConfirmation.finalMessage', { resource: resourceName }) }}\n        </p>\n\n        <div class=\"delete-confirmation-actions\">\n          <app-button\n            type=\"button\"\n            variant=\"tertiary\"\n            [text]=\"'deleteConfirmation.cancel' | transloco\"\n            (click)=\"onBackToInput()\"\n            size=\"sm\"\n          />\n\n          <app-button\n            type=\"button\"\n            variant=\"primary\"\n            [text]=\"'deleteConfirmation.finalConfirm' | transloco\"\n            (click)=\"onFinalConfirm()\"\n            size=\"sm\"\n          />\n        </div>\n      </div>\n    }\n  </app-modal>\n}\n", styles: [".delete-confirmation-content{display:flex;flex-direction:column;gap:1rem;animation:slideUp .3s ease-out}.delete-confirmation-instructions{font-size:.75rem;color:#4b5563;margin:0}@media(prefers-color-scheme:dark){.delete-confirmation-instructions{color:#9ca3af}}.delete-confirmation-highlight{display:inline-flex;align-items:center;gap:.25rem;padding:.25rem .5rem;margin-top:.25rem;background-color:#e5e7eb;color:#dc2626;font-weight:600;font-size:.875rem;border-radius:.375rem}@media(prefers-color-scheme:dark){.delete-confirmation-highlight{background-color:#374151}}.delete-confirmation-field{flex:1}.delete-confirmation-actions{display:flex;gap:.75rem}@keyframes slideUp{0%{transform:translateY(20px);opacity:0}to{transform:translateY(0);opacity:1}}\n"] }]
-        }], ctorParameters: () => [{ type: i1$2.FormBuilder }, { type: DeleteConfirmationService }, { type: i1$3.TranslocoService }] });
+        }], ctorParameters: () => [{ type: i1$2.FormBuilder }, { type: DeleteConfirmationService }, { type: i2.TranslocoService }] });
 
 class AppBadgeComponent {
     text = '';
@@ -5698,7 +5722,7 @@ class TextExpandableComponent {
         this.expanded = !this.expanded;
     }
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.25", ngImport: i0, type: TextExpandableComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.25", type: TextExpandableComponent, isStandalone: true, selector: "text-expandable", inputs: { text: "text", maxLength: "maxLength", fontSize: "fontSize", allowHtml: "allowHtml", maxLines: "maxLines" }, usesOnChanges: true, ngImport: i0, template: "@if (allowHtml) {\n  <div class=\"text-expandable__html\" [ngClass]=\"`text-expandable__html--font-size-${fontSize}`\">\n    <div\n      class=\"text-expandable__html__content\"\n      [class.text-expandable__html__content--clamped]=\"truncated && !expanded\"\n      [style.--text-expandable-lines]=\"lines\"\n      [innerHTML]=\"text\"\n    ></div>\n\n    @if (truncated) {\n      <button type=\"button\" class=\"text-expandable__toggle\" (click)=\"toggleExpanded()\">\n        {{ (expanded ? 'common.showLess' : 'common.showMore') | transloco }}\n      </button>\n    }\n  </div>\n} @else {\n  <p\n    class=\"text-expandable__paragraph\"\n    [ngClass]=\"`text-expandable__paragraph--font-size-${fontSize}`\"\n  >\n    {{ visibleText }}\n\n    @if (truncated) {\n      <button type=\"button\" class=\"text-expandable__toggle\" (click)=\"toggleExpanded()\">\n        {{ (expanded ? 'common.showLess' : 'common.showMore') | transloco }}\n      </button>\n    }\n  </p>\n}\n", styles: [".text-expandable__paragraph{line-height:1.625}.text-expandable__paragraph--font-size-xs{font-size:.75rem}.text-expandable__paragraph--font-size-sm{font-size:.875rem}.text-expandable__paragraph--font-size-base{font-size:1rem}.text-expandable__paragraph--font-size-lg{font-size:1.125rem}.text-expandable__paragraph--font-size-xl{font-size:1.25rem}.text-expandable__paragraph--font-size-2xl{font-size:1.5rem}.text-expandable__paragraph--font-size-3xl{font-size:1.875rem}.text-expandable__paragraph--font-size-4xl{font-size:2.25rem}.text-expandable__paragraph--font-size-5xl{font-size:3rem}.text-expandable__paragraph--font-size-6xl{font-size:3.75rem}.text-expandable__html{line-height:1.625}.text-expandable__html--font-size-xs{font-size:.75rem}.text-expandable__html--font-size-sm{font-size:.875rem}.text-expandable__html--font-size-base{font-size:1rem}.text-expandable__html--font-size-lg{font-size:1.125rem}.text-expandable__html--font-size-xl{font-size:1.25rem}.text-expandable__html--font-size-2xl{font-size:1.5rem}.text-expandable__html--font-size-3xl{font-size:1.875rem}.text-expandable__html--font-size-4xl{font-size:2.25rem}.text-expandable__html--font-size-5xl{font-size:3rem}.text-expandable__html--font-size-6xl{font-size:3.75rem}.text-expandable__html__content--clamped{display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:var(--text-expandable-lines);overflow:hidden}.text-expandable__toggle{display:inline;margin-left:.25rem;padding:0;border:0;background:transparent;font-size:.875rem;font-weight:600;color:#2563eb;cursor:pointer;vertical-align:baseline}.text-expandable__toggle:hover{color:#1e40af;text-decoration:underline}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1$1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "ngmodule", type: TranslocoModule }, { kind: "pipe", type: i1$3.TranslocoPipe, name: "transloco" }] });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.25", type: TextExpandableComponent, isStandalone: true, selector: "text-expandable", inputs: { text: "text", maxLength: "maxLength", fontSize: "fontSize", allowHtml: "allowHtml", maxLines: "maxLines" }, usesOnChanges: true, ngImport: i0, template: "@if (allowHtml) {\n  <div class=\"text-expandable__html\" [ngClass]=\"`text-expandable__html--font-size-${fontSize}`\">\n    <div\n      class=\"text-expandable__html__content\"\n      [class.text-expandable__html__content--clamped]=\"truncated && !expanded\"\n      [style.--text-expandable-lines]=\"lines\"\n      [innerHTML]=\"text\"\n    ></div>\n\n    @if (truncated) {\n      <button type=\"button\" class=\"text-expandable__toggle\" (click)=\"toggleExpanded()\">\n        {{ (expanded ? 'common.showLess' : 'common.showMore') | transloco }}\n      </button>\n    }\n  </div>\n} @else {\n  <p\n    class=\"text-expandable__paragraph\"\n    [ngClass]=\"`text-expandable__paragraph--font-size-${fontSize}`\"\n  >\n    {{ visibleText }}\n\n    @if (truncated) {\n      <button type=\"button\" class=\"text-expandable__toggle\" (click)=\"toggleExpanded()\">\n        {{ (expanded ? 'common.showLess' : 'common.showMore') | transloco }}\n      </button>\n    }\n  </p>\n}\n", styles: [".text-expandable__paragraph{line-height:1.625}.text-expandable__paragraph--font-size-xs{font-size:.75rem}.text-expandable__paragraph--font-size-sm{font-size:.875rem}.text-expandable__paragraph--font-size-base{font-size:1rem}.text-expandable__paragraph--font-size-lg{font-size:1.125rem}.text-expandable__paragraph--font-size-xl{font-size:1.25rem}.text-expandable__paragraph--font-size-2xl{font-size:1.5rem}.text-expandable__paragraph--font-size-3xl{font-size:1.875rem}.text-expandable__paragraph--font-size-4xl{font-size:2.25rem}.text-expandable__paragraph--font-size-5xl{font-size:3rem}.text-expandable__paragraph--font-size-6xl{font-size:3.75rem}.text-expandable__html{line-height:1.625}.text-expandable__html--font-size-xs{font-size:.75rem}.text-expandable__html--font-size-sm{font-size:.875rem}.text-expandable__html--font-size-base{font-size:1rem}.text-expandable__html--font-size-lg{font-size:1.125rem}.text-expandable__html--font-size-xl{font-size:1.25rem}.text-expandable__html--font-size-2xl{font-size:1.5rem}.text-expandable__html--font-size-3xl{font-size:1.875rem}.text-expandable__html--font-size-4xl{font-size:2.25rem}.text-expandable__html--font-size-5xl{font-size:3rem}.text-expandable__html--font-size-6xl{font-size:3.75rem}.text-expandable__html__content--clamped{display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:var(--text-expandable-lines);overflow:hidden}.text-expandable__toggle{display:inline;margin-left:.25rem;padding:0;border:0;background:transparent;font-size:.875rem;font-weight:600;color:#2563eb;cursor:pointer;vertical-align:baseline}.text-expandable__toggle:hover{color:#1e40af;text-decoration:underline}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1$1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "ngmodule", type: TranslocoModule }, { kind: "pipe", type: i2.TranslocoPipe, name: "transloco" }] });
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.25", ngImport: i0, type: TextExpandableComponent, decorators: [{
             type: Component,
@@ -5821,7 +5845,7 @@ class ShowCardComponent {
         return new Date(date);
     }
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.25", ngImport: i0, type: ShowCardComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.25", type: ShowCardComponent, isStandalone: true, selector: "show-card", inputs: { show: "show", linkText: "linkText", linkUrlFn: "linkUrlFn", linkQueryParams: "linkQueryParams" }, ngImport: i0, template: "<div class=\"show-card\">\n  <div class=\"show-card__image\">\n    <show-type-badge [show]=\"show\" class=\"show-card__badge\" />\n\n    @if (show.images && show.images.length > 0) {\n      <img [src]=\"show.images[0].full_url\" class=\"show-card__image-img\" />\n    } @else {\n      <img\n        [src]=\"`https://placehold.co/400x400/1f2937/737373?text=${show.title}`\"\n        class=\"show-card__image-placeholder\"\n      />\n    }\n  </div>\n\n  <div class=\"show-card__info\">\n    <p class=\"show-card__title\">\n      {{ show.title }}\n    </p>\n\n    @if (show.next_performance) {\n      <div class=\"show-card__datetime\">\n        <span class=\"show-card__datetime-title\">\n          {{ 'show.next_performance' | transloco }}\n        </span>\n\n        <br />\n\n        <span class=\"show-card__date\">\n          {{ show.next_performance.start_time | date: `EEEE` | titlecase }}\n          {{ show.next_performance.start_time | date: `dd 'de' MMMM, hh:mm a` }}\n        </span>\n      </div>\n    }\n\n    @if (show.days_of_week && show.days_of_week.length > 0) {\n      <div class=\"show-card__days\">\n        @for (day of show.days_of_week; track $index) {\n          <app-badge\n            [text]=\"`common.daysOfWeekByNumber.${day}` | transloco\"\n            [bordered]=\"false\"\n            size=\"xs\"\n            backgroundColor=\"#525252\"\n            textColor=\"#e5e5e5\"\n          />\n        }\n      </div>\n    }\n\n    @if (show.unique_start_times && show.unique_start_times.length > 0) {\n      <div class=\"show-card__times\">\n        @for (time of show.unique_start_times; track $index) {\n          <app-badge\n            [text]=\"dateService.formatDate(formatTimeDate(time), 'hh:mm a')\"\n            [bordered]=\"false\"\n            size=\"xs\"\n            backgroundColor=\"#525252\"\n            textColor=\"#e5e5e5\"\n          />\n        }\n      </div>\n    }\n\n    <app-link-button\n      class=\"show-card__link\"\n      [route]=\"linkUrlFn ? linkUrlFn(show) : '#'\"\n      [queryParams]=\"linkQueryParams ?? {}\"\n      [text]=\"linkText\"\n      icon=\"ri-calendar-line\"\n      variant=\"primary\"\n      size=\"sm\"\n    />\n  </div>\n</div>\n", styles: [".show-card{align-items:center;background-color:#171717;border-radius:.5rem;display:flex;flex-direction:column;gap:0;justify-content:space-between;overflow:hidden;padding:0;position:relative;transition:all .2s ease-in-out;max-width:320px;width:100%}.show-card:hover{border-color:#525252}.show-card--selected{background-color:#262626;border-color:#ef4444;box-shadow:0 0 0 1px #ef444480,0 0 16px #ef444459}.show-card--selected:hover{border-color:#ef4444}.show-card__image{aspect-ratio:1/1;display:flex;border-radius:.125rem;overflow:hidden;position:relative;width:100%}.show-card__image-img{object-fit:cover;object-position:center;max-height:100%;max-width:100%;margin-left:auto;margin-right:auto}.show-card__image-placeholder{display:flex;background-color:#1f2937;height:100%;width:100%}.show-card__badge{position:absolute;left:1rem;top:1rem}.show-card__info{display:flex;flex-direction:column;flex:1;gap:.5rem;padding:1.5rem;width:100%}.show-card__title{color:#e5e7eb;font-size:1.5rem;font-weight:800;line-height:130%;margin:0}.show-card__datetime{line-height:1}.show-card__datetime-title{color:#a3a3a3;font-size:.75rem;font-weight:700;width:100%}.show-card__date{color:#a3a3a3;font-size:.875rem}.show-card__days,.show-card__times{color:#a3a3a3;display:flex;flex-flow:row wrap;font-size:.875rem;gap:.25rem}.show-card__times{margin-bottom:.5rem}.show-card__link{margin-top:auto}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "component", type: AppLinkButtonComponent, selector: "app-link-button", inputs: ["disabled", "loading", "target", "text", "icon", "loadingText", "route", "queryParams", "size", "variant", "tooltip"] }, { kind: "component", type: AppBadgeComponent, selector: "app-badge", inputs: ["text", "color", "size", "bordered", "backgroundColor", "textColor"] }, { kind: "ngmodule", type: TranslocoModule }, { kind: "component", type: ShowTypeBadgeComponent, selector: "show-type-badge", inputs: ["show", "size"] }, { kind: "pipe", type: i1$1.TitleCasePipe, name: "titlecase" }, { kind: "pipe", type: i1$1.DatePipe, name: "date" }, { kind: "pipe", type: i1$3.TranslocoPipe, name: "transloco" }] });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.25", type: ShowCardComponent, isStandalone: true, selector: "show-card", inputs: { show: "show", linkText: "linkText", linkUrlFn: "linkUrlFn", linkQueryParams: "linkQueryParams" }, ngImport: i0, template: "<div class=\"show-card\">\n  <div class=\"show-card__image\">\n    <show-type-badge [show]=\"show\" class=\"show-card__badge\" />\n\n    @if (show.images && show.images.length > 0) {\n      <img [src]=\"show.images[0].full_url\" class=\"show-card__image-img\" />\n    } @else {\n      <img\n        [src]=\"`https://placehold.co/400x400/1f2937/737373?text=${show.title}`\"\n        class=\"show-card__image-placeholder\"\n      />\n    }\n  </div>\n\n  <div class=\"show-card__info\">\n    <p class=\"show-card__title\">\n      {{ show.title }}\n    </p>\n\n    @if (show.next_performance) {\n      <div class=\"show-card__datetime\">\n        <span class=\"show-card__datetime-title\">\n          {{ 'show.next_performance' | transloco }}\n        </span>\n\n        <br />\n\n        <span class=\"show-card__date\">\n          {{ show.next_performance.start_time | date: `EEEE` | titlecase }}\n          {{ show.next_performance.start_time | date: `dd 'de' MMMM, hh:mm a` }}\n        </span>\n      </div>\n    }\n\n    @if (show.days_of_week && show.days_of_week.length > 0) {\n      <div class=\"show-card__days\">\n        @for (day of show.days_of_week; track $index) {\n          <app-badge\n            [text]=\"`common.daysOfWeekByNumber.${day}` | transloco\"\n            [bordered]=\"false\"\n            size=\"xs\"\n            backgroundColor=\"#525252\"\n            textColor=\"#e5e5e5\"\n          />\n        }\n      </div>\n    }\n\n    @if (show.unique_start_times && show.unique_start_times.length > 0) {\n      <div class=\"show-card__times\">\n        @for (time of show.unique_start_times; track $index) {\n          <app-badge\n            [text]=\"dateService.formatDate(formatTimeDate(time), 'hh:mm a')\"\n            [bordered]=\"false\"\n            size=\"xs\"\n            backgroundColor=\"#525252\"\n            textColor=\"#e5e5e5\"\n          />\n        }\n      </div>\n    }\n\n    <app-link-button\n      class=\"show-card__link\"\n      [route]=\"linkUrlFn ? linkUrlFn(show) : '#'\"\n      [queryParams]=\"linkQueryParams ?? {}\"\n      [text]=\"linkText\"\n      icon=\"ri-calendar-line\"\n      variant=\"primary\"\n      size=\"sm\"\n    />\n  </div>\n</div>\n", styles: [".show-card{align-items:center;background-color:#171717;border-radius:.5rem;display:flex;flex-direction:column;gap:0;justify-content:space-between;overflow:hidden;padding:0;position:relative;transition:all .2s ease-in-out;max-width:320px;width:100%}.show-card:hover{border-color:#525252}.show-card--selected{background-color:#262626;border-color:#ef4444;box-shadow:0 0 0 1px #ef444480,0 0 16px #ef444459}.show-card--selected:hover{border-color:#ef4444}.show-card__image{aspect-ratio:1/1;display:flex;border-radius:.125rem;overflow:hidden;position:relative;width:100%}.show-card__image-img{object-fit:cover;object-position:center;max-height:100%;max-width:100%;margin-left:auto;margin-right:auto}.show-card__image-placeholder{display:flex;background-color:#1f2937;height:100%;width:100%}.show-card__badge{position:absolute;left:1rem;top:1rem}.show-card__info{display:flex;flex-direction:column;flex:1;gap:.5rem;padding:1.5rem;width:100%}.show-card__title{color:#e5e7eb;font-size:1.5rem;font-weight:800;line-height:130%;margin:0}.show-card__datetime{line-height:1}.show-card__datetime-title{color:#a3a3a3;font-size:.75rem;font-weight:700;width:100%}.show-card__date{color:#a3a3a3;font-size:.875rem}.show-card__days,.show-card__times{color:#a3a3a3;display:flex;flex-flow:row wrap;font-size:.875rem;gap:.25rem}.show-card__times{margin-bottom:.5rem}.show-card__link{margin-top:auto}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "component", type: AppLinkButtonComponent, selector: "app-link-button", inputs: ["disabled", "loading", "target", "text", "icon", "loadingText", "route", "queryParams", "size", "variant", "tooltip"] }, { kind: "component", type: AppBadgeComponent, selector: "app-badge", inputs: ["text", "color", "size", "bordered", "backgroundColor", "textColor"] }, { kind: "ngmodule", type: TranslocoModule }, { kind: "component", type: ShowTypeBadgeComponent, selector: "show-type-badge", inputs: ["show", "size"] }, { kind: "pipe", type: i1$1.TitleCasePipe, name: "titlecase" }, { kind: "pipe", type: i1$1.DatePipe, name: "date" }, { kind: "pipe", type: i2.TranslocoPipe, name: "transloco" }] });
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.25", ngImport: i0, type: ShowCardComponent, decorators: [{
             type: Component,
@@ -5883,13 +5907,169 @@ class LanguageSwitcherComponent {
         this.transloco.setActiveLang(lang);
         setStoredLanguage(lang);
     }
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.25", ngImport: i0, type: LanguageSwitcherComponent, deps: [{ token: i1$3.TranslocoService }], target: i0.ɵɵFactoryTarget.Component });
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.25", ngImport: i0, type: LanguageSwitcherComponent, deps: [{ token: i2.TranslocoService }], target: i0.ɵɵFactoryTarget.Component });
     static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.25", type: LanguageSwitcherComponent, isStandalone: true, selector: "language-switcher", ngImport: i0, template: "<div class=\"lang-switcher\">\n  @for (lang of availableLangs; track lang) {\n    <button\n      (click)=\"switchLang(lang)\"\n      class=\"lang-switcher-btn\"\n      [class.active]=\"activeLang === lang\"\n      [class.inactive]=\"activeLang !== lang\"\n    >\n      {{ lang | uppercase }}\n    </button>\n  }\n</div>\n", styles: [".lang-switcher{display:flex;align-items:center;gap:.25rem}.lang-switcher-btn{cursor:pointer;padding:.25rem .5rem;font-size:.75rem;font-weight:500;border-radius:.125rem;transition:all .15s ease-in-out;border:none;background:transparent}.lang-switcher-btn.active{background-color:#1f2937;color:#fff}@media(prefers-color-scheme:dark){.lang-switcher-btn.active{background-color:#374151}}.lang-switcher-btn.inactive{color:#9ca3af}.lang-switcher-btn.inactive:hover{color:#fff}@media(prefers-color-scheme:dark){.lang-switcher-btn.inactive{color:#6b7280}}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "ngmodule", type: TranslocoModule }, { kind: "pipe", type: i1$1.UpperCasePipe, name: "uppercase" }] });
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.25", ngImport: i0, type: LanguageSwitcherComponent, decorators: [{
             type: Component,
             args: [{ selector: 'language-switcher', standalone: true, imports: [CommonModule, TranslocoModule], template: "<div class=\"lang-switcher\">\n  @for (lang of availableLangs; track lang) {\n    <button\n      (click)=\"switchLang(lang)\"\n      class=\"lang-switcher-btn\"\n      [class.active]=\"activeLang === lang\"\n      [class.inactive]=\"activeLang !== lang\"\n    >\n      {{ lang | uppercase }}\n    </button>\n  }\n</div>\n", styles: [".lang-switcher{display:flex;align-items:center;gap:.25rem}.lang-switcher-btn{cursor:pointer;padding:.25rem .5rem;font-size:.75rem;font-weight:500;border-radius:.125rem;transition:all .15s ease-in-out;border:none;background:transparent}.lang-switcher-btn.active{background-color:#1f2937;color:#fff}@media(prefers-color-scheme:dark){.lang-switcher-btn.active{background-color:#374151}}.lang-switcher-btn.inactive{color:#9ca3af}.lang-switcher-btn.inactive:hover{color:#fff}@media(prefers-color-scheme:dark){.lang-switcher-btn.inactive{color:#6b7280}}\n"] }]
-        }], ctorParameters: () => [{ type: i1$3.TranslocoService }] });
+        }], ctorParameters: () => [{ type: i2.TranslocoService }] });
+
+class SidebarMenuComponent {
+    router;
+    sidebarState;
+    /** Menu items to render. Each app owns its own routes/roles and passes them in here. */
+    items = [];
+    /** Route the brand/logo link should navigate to (e.g. the dashboard). */
+    homePath = '';
+    /** Optional brand logo shown in the sidebar header. Omit to render no logo. */
+    logoUrl = '';
+    logoAlt = '';
+    IS_ACTIVE_MATCH_OPTIONS = {
+        paths: 'subset',
+        queryParams: 'subset',
+        matrixParams: 'ignored',
+        fragment: 'ignored',
+    };
+    constructor(router, sidebarState) {
+        this.router = router;
+        this.sidebarState = sidebarState;
+    }
+    ngOnInit() {
+        this.updateSubmenuState();
+        this.router.events.pipe(filter((event) => event instanceof NavigationEnd)).subscribe(() => {
+            this.updateSubmenuState();
+            this.sidebarState.close();
+        });
+    }
+    updateSubmenuState() {
+        this.items.forEach((item) => {
+            if (item.submenu) {
+                item.isOpen = this.isSubmenuActive(item);
+            }
+        });
+    }
+    isSubmenuActive(item) {
+        if (!item.submenu)
+            return false;
+        return item.submenu.some((subItem) => !!subItem.path && this.router.isActive(subItem.path, this.IS_ACTIVE_MATCH_OPTIONS));
+    }
+    toggleSubmenu(item) {
+        item.isOpen = !item.isOpen;
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.25", ngImport: i0, type: SidebarMenuComponent, deps: [{ token: i1$3.Router }, { token: SidebarStateService }], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.25", type: SidebarMenuComponent, isStandalone: true, selector: "sidebar-menu", inputs: { items: "items", homePath: "homePath", logoUrl: "logoUrl", logoAlt: "logoAlt" }, ngImport: i0, template: "<!-- Mobile overlay -->\n<div\n  class=\"sidebar-overlay\"\n  [class.is-open]=\"sidebarState.isMobileOpen()\"\n  (click)=\"sidebarState.close()\"\n  aria-hidden=\"true\"\n></div>\n\n<!-- Sidebar -->\n<div\n  id=\"admin-sidebar\"\n  class=\"sidebar\"\n  [class.is-open]=\"sidebarState.isMobileOpen()\"\n  aria-label=\"Sidebar\"\n>\n  <div class=\"sidebar-inner\">\n    <!-- Header -->\n    <header class=\"sidebar-header\">\n      <a class=\"sidebar-brand\" [routerLink]=\"homePath\" aria-label=\"Brand\">\n        @if (logoUrl) {\n          <img [src]=\"logoUrl\" [alt]=\"logoAlt\" class=\"sidebar-logo\" />\n        }\n      </a>\n\n      <button\n        type=\"button\"\n        class=\"sidebar-close-btn\"\n        (click)=\"sidebarState.close()\"\n        aria-label=\"{{ 'navbar.closeMenu' | transloco }}\"\n      >\n        <i class=\"ri-close-line\"></i>\n      </button>\n    </header>\n    <!-- End Header -->\n\n    <!-- Body -->\n    <nav class=\"sidebar-nav\">\n      <ul class=\"sidebar-menu-list\">\n        @for (item of items; track $index) {\n          <li>\n            @if (!item.submenu) {\n              <a\n                class=\"sidebar-menu-item\"\n                [routerLink]=\"item.path\"\n                routerLinkActive=\"is-active\"\n                [routerLinkActiveOptions]=\"{ exact: true }\"\n              >\n                <i [class]=\"item.icon\"></i>\n                {{ item.labelKey | transloco }}\n              </a>\n            }\n\n            @if (item.submenu) {\n              <button\n                type=\"button\"\n                class=\"sidebar-menu-item sidebar-menu-item--parent\"\n                [class.is-active]=\"isSubmenuActive(item) || item.isOpen\"\n                (click)=\"toggleSubmenu(item)\"\n              >\n                <i [class]=\"item.icon\"></i>\n                {{ item.labelKey | transloco }}\n\n                <i class=\"ri-arrow-down-s-line sidebar-menu-item__chevron\" [class.rotated]=\"item.isOpen\"></i>\n              </button>\n            }\n\n            @if (item.submenu) {\n              <ul class=\"sidebar-submenu\" [class.hidden]=\"!item.isOpen\">\n                @for (subItem of item.submenu; track $index) {\n                  <li>\n                    <a\n                      class=\"sidebar-submenu-item\"\n                      [routerLink]=\"subItem.path\"\n                      routerLinkActive=\"is-active\"\n                      [routerLinkActiveOptions]=\"{ exact: true }\"\n                    >\n                      <i [class]=\"subItem.icon\"></i>\n                      {{ subItem.labelKey | transloco }}\n                    </a>\n                  </li>\n                }\n              </ul>\n            }\n          </li>\n        }\n      </ul>\n    </nav>\n    <!-- End Body -->\n  </div>\n</div>\n<!-- End Sidebar -->\n", styles: [".sidebar-overlay{display:none;position:fixed;inset:0;z-index:50;background-color:#00000080;transition:opacity .2s}.sidebar-overlay.is-open{display:block}@media(min-width:1024px){.sidebar-overlay{display:none!important}}.sidebar{position:fixed;inset-block:0;inset-inline-start:0;z-index:50;width:16rem;height:100%;max-width:85vw;background-color:#fff;border-inline-end:1px solid #e5e7eb;transform:translate(-100%);transition:transform .3s ease-in-out}.sidebar.is-open{transform:translate(0)}@media(prefers-color-scheme:dark){.sidebar{background-color:#171717;border-color:#404040}}@media(min-width:1024px){.sidebar{position:static;z-index:auto;max-width:none;transform:none;flex-shrink:0}}.sidebar-inner{position:relative;display:flex;flex-direction:column;height:100%;max-height:100%}.sidebar-header{height:4rem;background-color:#000;padding-block:.5rem;padding-inline:1rem;display:flex;justify-content:space-between;align-items:center;gap:.5rem}.sidebar-brand{flex:none;font-weight:600;font-size:1.25rem;color:#000;width:100%;text-decoration:none}.sidebar-brand:focus{outline:none;opacity:.75}@media(prefers-color-scheme:dark){.sidebar-brand{color:#fff}}.sidebar-logo{display:block;margin-inline:auto;height:auto;width:100%}.sidebar-close-btn{flex:none;cursor:pointer;border:none;background:transparent;border-radius:.5rem;padding:.375rem;color:#fff}.sidebar-close-btn:hover{background-color:#ffffff1a}.sidebar-close-btn:focus{outline:none}.sidebar-close-btn i{font-size:1.25rem}@media(min-width:1024px){.sidebar-close-btn{display:none}}.sidebar-nav{height:100%;overflow-y:auto}.sidebar-nav::-webkit-scrollbar{width:8px;height:8px}.sidebar-nav::-webkit-scrollbar-track{background:#f3f4f6;border-radius:9999px}.sidebar-nav::-webkit-scrollbar-thumb{background:#d1d5db;border-radius:9999px}.sidebar-nav::-webkit-scrollbar-thumb:hover{background:#9ca3af}.sidebar-menu-list{list-style:none;margin:0;padding:1rem;display:flex;flex-direction:column;flex-wrap:wrap;gap:.25rem}.sidebar-menu-item{display:flex;align-items:center;gap:.875rem;padding-block:.5rem;padding-inline:.625rem;font-size:.875rem;color:#1f2937;border-radius:.5rem;text-decoration:none;border:none;background:transparent;width:100%;cursor:pointer;text-align:left}.sidebar-menu-item:hover{background-color:#f3f4f6}.sidebar-menu-item:focus{outline:none}@media(prefers-color-scheme:dark){.sidebar-menu-item{color:#fff;background-color:#171717}.sidebar-menu-item:hover{background-color:#404040}}.sidebar-menu-item.is-active{background-color:#f3f4f6}@media(prefers-color-scheme:dark){.sidebar-menu-item.is-active{background-color:#404040}}.sidebar-menu-item__chevron{margin-inline-start:auto;transition:transform .2s}.sidebar-menu-item__chevron.rotated{transform:rotate(180deg)}.sidebar-submenu{list-style:none;margin:0;margin-top:.25rem;padding:0;background-color:#f3f4f6;border-radius:.5rem;display:flex;flex-direction:column;gap:.25rem}.sidebar-submenu.hidden{display:none}@media(prefers-color-scheme:dark){.sidebar-submenu{background-color:#404040}}.sidebar-submenu-item{display:flex;align-items:center;gap:.875rem;padding-block:.5rem;padding-inline:.625rem;font-size:.75rem;color:#1f2937;border-radius:.5rem;text-decoration:none}.sidebar-submenu-item:hover,.sidebar-submenu-item:focus{background-color:#e5e7eb}@media(prefers-color-scheme:dark){.sidebar-submenu-item{color:#fff;background-color:#404040}.sidebar-submenu-item:hover,.sidebar-submenu-item:focus{background-color:#525252}}.sidebar-submenu-item.is-active{background-color:#e5e7eb}@media(prefers-color-scheme:dark){.sidebar-submenu-item.is-active{background-color:#525252}}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "ngmodule", type: RouterModule }, { kind: "directive", type: i1$3.RouterLink, selector: "[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "state", "info", "relativeTo", "preserveFragment", "skipLocationChange", "replaceUrl", "routerLink"] }, { kind: "directive", type: i1$3.RouterLinkActive, selector: "[routerLinkActive]", inputs: ["routerLinkActiveOptions", "ariaCurrentWhenActive", "routerLinkActive"], outputs: ["isActiveChange"], exportAs: ["routerLinkActive"] }, { kind: "ngmodule", type: TranslocoModule }, { kind: "pipe", type: i2.TranslocoPipe, name: "transloco" }] });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.25", ngImport: i0, type: SidebarMenuComponent, decorators: [{
+            type: Component,
+            args: [{ selector: 'sidebar-menu', standalone: true, imports: [CommonModule, RouterModule, TranslocoModule], template: "<!-- Mobile overlay -->\n<div\n  class=\"sidebar-overlay\"\n  [class.is-open]=\"sidebarState.isMobileOpen()\"\n  (click)=\"sidebarState.close()\"\n  aria-hidden=\"true\"\n></div>\n\n<!-- Sidebar -->\n<div\n  id=\"admin-sidebar\"\n  class=\"sidebar\"\n  [class.is-open]=\"sidebarState.isMobileOpen()\"\n  aria-label=\"Sidebar\"\n>\n  <div class=\"sidebar-inner\">\n    <!-- Header -->\n    <header class=\"sidebar-header\">\n      <a class=\"sidebar-brand\" [routerLink]=\"homePath\" aria-label=\"Brand\">\n        @if (logoUrl) {\n          <img [src]=\"logoUrl\" [alt]=\"logoAlt\" class=\"sidebar-logo\" />\n        }\n      </a>\n\n      <button\n        type=\"button\"\n        class=\"sidebar-close-btn\"\n        (click)=\"sidebarState.close()\"\n        aria-label=\"{{ 'navbar.closeMenu' | transloco }}\"\n      >\n        <i class=\"ri-close-line\"></i>\n      </button>\n    </header>\n    <!-- End Header -->\n\n    <!-- Body -->\n    <nav class=\"sidebar-nav\">\n      <ul class=\"sidebar-menu-list\">\n        @for (item of items; track $index) {\n          <li>\n            @if (!item.submenu) {\n              <a\n                class=\"sidebar-menu-item\"\n                [routerLink]=\"item.path\"\n                routerLinkActive=\"is-active\"\n                [routerLinkActiveOptions]=\"{ exact: true }\"\n              >\n                <i [class]=\"item.icon\"></i>\n                {{ item.labelKey | transloco }}\n              </a>\n            }\n\n            @if (item.submenu) {\n              <button\n                type=\"button\"\n                class=\"sidebar-menu-item sidebar-menu-item--parent\"\n                [class.is-active]=\"isSubmenuActive(item) || item.isOpen\"\n                (click)=\"toggleSubmenu(item)\"\n              >\n                <i [class]=\"item.icon\"></i>\n                {{ item.labelKey | transloco }}\n\n                <i class=\"ri-arrow-down-s-line sidebar-menu-item__chevron\" [class.rotated]=\"item.isOpen\"></i>\n              </button>\n            }\n\n            @if (item.submenu) {\n              <ul class=\"sidebar-submenu\" [class.hidden]=\"!item.isOpen\">\n                @for (subItem of item.submenu; track $index) {\n                  <li>\n                    <a\n                      class=\"sidebar-submenu-item\"\n                      [routerLink]=\"subItem.path\"\n                      routerLinkActive=\"is-active\"\n                      [routerLinkActiveOptions]=\"{ exact: true }\"\n                    >\n                      <i [class]=\"subItem.icon\"></i>\n                      {{ subItem.labelKey | transloco }}\n                    </a>\n                  </li>\n                }\n              </ul>\n            }\n          </li>\n        }\n      </ul>\n    </nav>\n    <!-- End Body -->\n  </div>\n</div>\n<!-- End Sidebar -->\n", styles: [".sidebar-overlay{display:none;position:fixed;inset:0;z-index:50;background-color:#00000080;transition:opacity .2s}.sidebar-overlay.is-open{display:block}@media(min-width:1024px){.sidebar-overlay{display:none!important}}.sidebar{position:fixed;inset-block:0;inset-inline-start:0;z-index:50;width:16rem;height:100%;max-width:85vw;background-color:#fff;border-inline-end:1px solid #e5e7eb;transform:translate(-100%);transition:transform .3s ease-in-out}.sidebar.is-open{transform:translate(0)}@media(prefers-color-scheme:dark){.sidebar{background-color:#171717;border-color:#404040}}@media(min-width:1024px){.sidebar{position:static;z-index:auto;max-width:none;transform:none;flex-shrink:0}}.sidebar-inner{position:relative;display:flex;flex-direction:column;height:100%;max-height:100%}.sidebar-header{height:4rem;background-color:#000;padding-block:.5rem;padding-inline:1rem;display:flex;justify-content:space-between;align-items:center;gap:.5rem}.sidebar-brand{flex:none;font-weight:600;font-size:1.25rem;color:#000;width:100%;text-decoration:none}.sidebar-brand:focus{outline:none;opacity:.75}@media(prefers-color-scheme:dark){.sidebar-brand{color:#fff}}.sidebar-logo{display:block;margin-inline:auto;height:auto;width:100%}.sidebar-close-btn{flex:none;cursor:pointer;border:none;background:transparent;border-radius:.5rem;padding:.375rem;color:#fff}.sidebar-close-btn:hover{background-color:#ffffff1a}.sidebar-close-btn:focus{outline:none}.sidebar-close-btn i{font-size:1.25rem}@media(min-width:1024px){.sidebar-close-btn{display:none}}.sidebar-nav{height:100%;overflow-y:auto}.sidebar-nav::-webkit-scrollbar{width:8px;height:8px}.sidebar-nav::-webkit-scrollbar-track{background:#f3f4f6;border-radius:9999px}.sidebar-nav::-webkit-scrollbar-thumb{background:#d1d5db;border-radius:9999px}.sidebar-nav::-webkit-scrollbar-thumb:hover{background:#9ca3af}.sidebar-menu-list{list-style:none;margin:0;padding:1rem;display:flex;flex-direction:column;flex-wrap:wrap;gap:.25rem}.sidebar-menu-item{display:flex;align-items:center;gap:.875rem;padding-block:.5rem;padding-inline:.625rem;font-size:.875rem;color:#1f2937;border-radius:.5rem;text-decoration:none;border:none;background:transparent;width:100%;cursor:pointer;text-align:left}.sidebar-menu-item:hover{background-color:#f3f4f6}.sidebar-menu-item:focus{outline:none}@media(prefers-color-scheme:dark){.sidebar-menu-item{color:#fff;background-color:#171717}.sidebar-menu-item:hover{background-color:#404040}}.sidebar-menu-item.is-active{background-color:#f3f4f6}@media(prefers-color-scheme:dark){.sidebar-menu-item.is-active{background-color:#404040}}.sidebar-menu-item__chevron{margin-inline-start:auto;transition:transform .2s}.sidebar-menu-item__chevron.rotated{transform:rotate(180deg)}.sidebar-submenu{list-style:none;margin:0;margin-top:.25rem;padding:0;background-color:#f3f4f6;border-radius:.5rem;display:flex;flex-direction:column;gap:.25rem}.sidebar-submenu.hidden{display:none}@media(prefers-color-scheme:dark){.sidebar-submenu{background-color:#404040}}.sidebar-submenu-item{display:flex;align-items:center;gap:.875rem;padding-block:.5rem;padding-inline:.625rem;font-size:.75rem;color:#1f2937;border-radius:.5rem;text-decoration:none}.sidebar-submenu-item:hover,.sidebar-submenu-item:focus{background-color:#e5e7eb}@media(prefers-color-scheme:dark){.sidebar-submenu-item{color:#fff;background-color:#404040}.sidebar-submenu-item:hover,.sidebar-submenu-item:focus{background-color:#525252}}.sidebar-submenu-item.is-active{background-color:#e5e7eb}@media(prefers-color-scheme:dark){.sidebar-submenu-item.is-active{background-color:#525252}}\n"] }]
+        }], ctorParameters: () => [{ type: i1$3.Router }, { type: SidebarStateService }], propDecorators: { items: [{
+                type: Input,
+                args: [{ required: true }]
+            }], homePath: [{
+                type: Input,
+                args: [{ required: true }]
+            }], logoUrl: [{
+                type: Input
+            }], logoAlt: [{
+                type: Input
+            }] } });
+
+class AdminNavbarComponent {
+    sidebarState;
+    /** Currently logged-in admin, or null while it hasn't loaded yet. */
+    admin = null;
+    /** Route the "my account" menu item should link to. */
+    myAccountPath = '';
+    /** Emitted when the admin clicks "log out" in the profile menu. */
+    logout = new EventEmitter();
+    isProfileMenuOpen = signal(false, ...(ngDevMode ? [{ debugName: "isProfileMenuOpen" }] : []));
+    constructor(sidebarState) {
+        this.sidebarState = sidebarState;
+    }
+    toggleProfileMenu() {
+        this.isProfileMenuOpen.set(!this.isProfileMenuOpen());
+    }
+    onLogout() {
+        this.logout.emit();
+    }
+    clickout(event) {
+        const target = event.target;
+        if (!target?.closest('.admin-navbar__profile')) {
+            this.isProfileMenuOpen.set(false);
+        }
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.25", ngImport: i0, type: AdminNavbarComponent, deps: [{ token: SidebarStateService }], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.25", type: AdminNavbarComponent, isStandalone: true, selector: "admin-navbar", inputs: { admin: "admin", myAccountPath: "myAccountPath" }, outputs: { logout: "logout" }, host: { listeners: { "document:click": "clickout($event)" } }, ngImport: i0, template: "<nav class=\"admin-navbar\">\n  <div class=\"admin-navbar__left\">\n    <button\n      type=\"button\"\n      class=\"admin-navbar__menu-btn\"\n      (click)=\"sidebarState.toggle()\"\n      aria-controls=\"admin-sidebar\"\n      [attr.aria-expanded]=\"sidebarState.isMobileOpen()\"\n      aria-label=\"{{ 'navbar.toggleMenu' | transloco }}\"\n    >\n      <i class=\"ri-menu-line\"></i>\n    </button>\n\n    <h1 class=\"admin-navbar__title\">\n      {{ 'navbar.title' | transloco }}\n    </h1>\n  </div>\n\n  <div class=\"admin-navbar__right\">\n    @if (!!admin) {\n      <div class=\"admin-navbar__profile\">\n        <button\n          (click)=\"toggleProfileMenu()\"\n          type=\"button\"\n          class=\"admin-navbar__profile-btn\"\n        >\n          <img\n            class=\"admin-navbar__avatar\"\n            [src]=\"\n              'https://ui-avatars.com/api/?name=' +\n              (admin?.fullname || admin?.email) +\n              '&background=0D8ABC&color=fff'\n            \"\n            alt=\"{{ 'navbar.avatarAlt' | transloco }}\"\n          />\n\n          <div class=\"admin-navbar__profile-info\">\n            <p class=\"admin-navbar__profile-name\">\n              {{ admin?.fullname || admin?.email }}\n            </p>\n            <p class=\"admin-navbar__profile-email\">{{ admin?.email }}</p>\n          </div>\n\n          <i class=\"ri-arrow-down-s-line admin-navbar__chevron\" [class.is-open]=\"isProfileMenuOpen()\"></i>\n        </button>\n\n        <div class=\"admin-navbar__dropdown\" [hidden]=\"!isProfileMenuOpen()\">\n          <a [href]=\"myAccountPath\" class=\"admin-navbar__dropdown-item\">\n            <i class=\"ri-account-circle-line\"></i> {{ 'navbar.myAccount' | transloco }}\n          </a>\n\n          <hr class=\"admin-navbar__divider\" />\n\n          <button (click)=\"onLogout()\" class=\"admin-navbar__dropdown-item admin-navbar__dropdown-item--danger\">\n            <i class=\"ri-logout-box-line\"></i>\n\n            {{ 'navbar.logout' | transloco }}\n          </button>\n        </div>\n      </div>\n    }\n  </div>\n</nav>\n", styles: [".admin-navbar{display:flex;align-items:center;justify-content:space-between;gap:.5rem;height:4rem;padding-inline:.75rem;border-bottom:1px solid #e5e7eb;background-color:#fff;box-shadow:0 1px 2px #0000000d}@media(prefers-color-scheme:dark){.admin-navbar{background-color:#171717;border-color:#404040}}@media(min-width:640px){.admin-navbar{padding-inline:1rem}}.admin-navbar__left{display:flex;align-items:center;gap:.5rem;min-width:0}.admin-navbar__menu-btn{flex:none;cursor:pointer;border:none;background:transparent;border-radius:.5rem;padding:.5rem;color:#4b5563}.admin-navbar__menu-btn:hover{background-color:#f3f4f6}.admin-navbar__menu-btn:focus{outline:none}.admin-navbar__menu-btn i{font-size:1.25rem}@media(prefers-color-scheme:dark){.admin-navbar__menu-btn{color:#d1d5db}.admin-navbar__menu-btn:hover{background-color:#404040}}@media(min-width:1024px){.admin-navbar__menu-btn{display:none}}.admin-navbar__title{margin:0;font-size:1rem;font-weight:600;color:#1f2937;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}@media(prefers-color-scheme:dark){.admin-navbar__title{color:#fff}}@media(min-width:640px){.admin-navbar__title{font-size:1.125rem}}.admin-navbar__right{display:flex;align-items:center;gap:1rem}.admin-navbar__profile{position:relative}.admin-navbar__profile-btn{display:flex;align-items:center;gap:.75rem;border:none;background:transparent;border-radius:.5rem;padding:.375rem;cursor:pointer;transition:background-color .2s}.admin-navbar__profile-btn:hover{background-color:#f3f4f6}.admin-navbar__profile-btn:focus{outline:none}@media(prefers-color-scheme:dark){.admin-navbar__profile-btn{color:#fff}.admin-navbar__profile-btn:hover{background-color:#404040}}.admin-navbar__avatar{height:2rem;width:2rem;border-radius:9999px;object-fit:cover;box-shadow:0 0 0 2px #e5e7eb}@media(prefers-color-scheme:dark){.admin-navbar__avatar{box-shadow:0 0 0 2px #525252}}.admin-navbar__profile-info{display:none;text-align:left}@media(min-width:768px){.admin-navbar__profile-info{display:block}}.admin-navbar__profile-name{margin:0;font-size:.75rem;font-weight:500;color:#374151;line-height:1}@media(prefers-color-scheme:dark){.admin-navbar__profile-name{color:#e5e7eb}}.admin-navbar__profile-email{margin:0;font-size:.75rem;color:#6b7280}@media(prefers-color-scheme:dark){.admin-navbar__profile-email{color:#9ca3af}}.admin-navbar__chevron{transition:transform .2s}.admin-navbar__chevron.is-open{transform:rotate(180deg)}.admin-navbar__dropdown{position:absolute;right:0;margin-top:.5rem;width:12rem;border-radius:.375rem;background-color:#fff;overflow:hidden;box-shadow:0 10px 15px -3px #0000001a,0 4px 6px -4px #0000001a;z-index:50;transition:all .2s}@media(prefers-color-scheme:dark){.admin-navbar__dropdown{background-color:#262626;border:1px solid #404040}}.admin-navbar__dropdown-item{display:flex;align-items:center;gap:.5rem;width:100%;padding-block:.5rem;padding-inline:1rem;font-size:.75rem;color:#374151;border:none;background:transparent;text-decoration:none;text-align:left;cursor:pointer}.admin-navbar__dropdown-item:hover{background-color:#f3f4f6}@media(prefers-color-scheme:dark){.admin-navbar__dropdown-item{color:#e5e7eb}.admin-navbar__dropdown-item:hover{background-color:#404040}}.admin-navbar__dropdown-item--danger{color:#dc2626;background-color:#fef2f2}.admin-navbar__dropdown-item--danger:hover{background-color:#ef4444;color:#fff}@media(prefers-color-scheme:dark){.admin-navbar__dropdown-item--danger{background-color:#ef4444;color:#fff}.admin-navbar__dropdown-item--danger:hover{background-color:#991b1b}}.admin-navbar__divider{border:none;border-top:1px solid #f3f4f6;margin:0}@media(prefers-color-scheme:dark){.admin-navbar__divider{border-color:#404040}}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "ngmodule", type: TranslocoModule }, { kind: "pipe", type: i2.TranslocoPipe, name: "transloco" }] });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.25", ngImport: i0, type: AdminNavbarComponent, decorators: [{
+            type: Component,
+            args: [{ selector: 'admin-navbar', standalone: true, imports: [CommonModule, TranslocoModule], template: "<nav class=\"admin-navbar\">\n  <div class=\"admin-navbar__left\">\n    <button\n      type=\"button\"\n      class=\"admin-navbar__menu-btn\"\n      (click)=\"sidebarState.toggle()\"\n      aria-controls=\"admin-sidebar\"\n      [attr.aria-expanded]=\"sidebarState.isMobileOpen()\"\n      aria-label=\"{{ 'navbar.toggleMenu' | transloco }}\"\n    >\n      <i class=\"ri-menu-line\"></i>\n    </button>\n\n    <h1 class=\"admin-navbar__title\">\n      {{ 'navbar.title' | transloco }}\n    </h1>\n  </div>\n\n  <div class=\"admin-navbar__right\">\n    @if (!!admin) {\n      <div class=\"admin-navbar__profile\">\n        <button\n          (click)=\"toggleProfileMenu()\"\n          type=\"button\"\n          class=\"admin-navbar__profile-btn\"\n        >\n          <img\n            class=\"admin-navbar__avatar\"\n            [src]=\"\n              'https://ui-avatars.com/api/?name=' +\n              (admin?.fullname || admin?.email) +\n              '&background=0D8ABC&color=fff'\n            \"\n            alt=\"{{ 'navbar.avatarAlt' | transloco }}\"\n          />\n\n          <div class=\"admin-navbar__profile-info\">\n            <p class=\"admin-navbar__profile-name\">\n              {{ admin?.fullname || admin?.email }}\n            </p>\n            <p class=\"admin-navbar__profile-email\">{{ admin?.email }}</p>\n          </div>\n\n          <i class=\"ri-arrow-down-s-line admin-navbar__chevron\" [class.is-open]=\"isProfileMenuOpen()\"></i>\n        </button>\n\n        <div class=\"admin-navbar__dropdown\" [hidden]=\"!isProfileMenuOpen()\">\n          <a [href]=\"myAccountPath\" class=\"admin-navbar__dropdown-item\">\n            <i class=\"ri-account-circle-line\"></i> {{ 'navbar.myAccount' | transloco }}\n          </a>\n\n          <hr class=\"admin-navbar__divider\" />\n\n          <button (click)=\"onLogout()\" class=\"admin-navbar__dropdown-item admin-navbar__dropdown-item--danger\">\n            <i class=\"ri-logout-box-line\"></i>\n\n            {{ 'navbar.logout' | transloco }}\n          </button>\n        </div>\n      </div>\n    }\n  </div>\n</nav>\n", styles: [".admin-navbar{display:flex;align-items:center;justify-content:space-between;gap:.5rem;height:4rem;padding-inline:.75rem;border-bottom:1px solid #e5e7eb;background-color:#fff;box-shadow:0 1px 2px #0000000d}@media(prefers-color-scheme:dark){.admin-navbar{background-color:#171717;border-color:#404040}}@media(min-width:640px){.admin-navbar{padding-inline:1rem}}.admin-navbar__left{display:flex;align-items:center;gap:.5rem;min-width:0}.admin-navbar__menu-btn{flex:none;cursor:pointer;border:none;background:transparent;border-radius:.5rem;padding:.5rem;color:#4b5563}.admin-navbar__menu-btn:hover{background-color:#f3f4f6}.admin-navbar__menu-btn:focus{outline:none}.admin-navbar__menu-btn i{font-size:1.25rem}@media(prefers-color-scheme:dark){.admin-navbar__menu-btn{color:#d1d5db}.admin-navbar__menu-btn:hover{background-color:#404040}}@media(min-width:1024px){.admin-navbar__menu-btn{display:none}}.admin-navbar__title{margin:0;font-size:1rem;font-weight:600;color:#1f2937;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}@media(prefers-color-scheme:dark){.admin-navbar__title{color:#fff}}@media(min-width:640px){.admin-navbar__title{font-size:1.125rem}}.admin-navbar__right{display:flex;align-items:center;gap:1rem}.admin-navbar__profile{position:relative}.admin-navbar__profile-btn{display:flex;align-items:center;gap:.75rem;border:none;background:transparent;border-radius:.5rem;padding:.375rem;cursor:pointer;transition:background-color .2s}.admin-navbar__profile-btn:hover{background-color:#f3f4f6}.admin-navbar__profile-btn:focus{outline:none}@media(prefers-color-scheme:dark){.admin-navbar__profile-btn{color:#fff}.admin-navbar__profile-btn:hover{background-color:#404040}}.admin-navbar__avatar{height:2rem;width:2rem;border-radius:9999px;object-fit:cover;box-shadow:0 0 0 2px #e5e7eb}@media(prefers-color-scheme:dark){.admin-navbar__avatar{box-shadow:0 0 0 2px #525252}}.admin-navbar__profile-info{display:none;text-align:left}@media(min-width:768px){.admin-navbar__profile-info{display:block}}.admin-navbar__profile-name{margin:0;font-size:.75rem;font-weight:500;color:#374151;line-height:1}@media(prefers-color-scheme:dark){.admin-navbar__profile-name{color:#e5e7eb}}.admin-navbar__profile-email{margin:0;font-size:.75rem;color:#6b7280}@media(prefers-color-scheme:dark){.admin-navbar__profile-email{color:#9ca3af}}.admin-navbar__chevron{transition:transform .2s}.admin-navbar__chevron.is-open{transform:rotate(180deg)}.admin-navbar__dropdown{position:absolute;right:0;margin-top:.5rem;width:12rem;border-radius:.375rem;background-color:#fff;overflow:hidden;box-shadow:0 10px 15px -3px #0000001a,0 4px 6px -4px #0000001a;z-index:50;transition:all .2s}@media(prefers-color-scheme:dark){.admin-navbar__dropdown{background-color:#262626;border:1px solid #404040}}.admin-navbar__dropdown-item{display:flex;align-items:center;gap:.5rem;width:100%;padding-block:.5rem;padding-inline:1rem;font-size:.75rem;color:#374151;border:none;background:transparent;text-decoration:none;text-align:left;cursor:pointer}.admin-navbar__dropdown-item:hover{background-color:#f3f4f6}@media(prefers-color-scheme:dark){.admin-navbar__dropdown-item{color:#e5e7eb}.admin-navbar__dropdown-item:hover{background-color:#404040}}.admin-navbar__dropdown-item--danger{color:#dc2626;background-color:#fef2f2}.admin-navbar__dropdown-item--danger:hover{background-color:#ef4444;color:#fff}@media(prefers-color-scheme:dark){.admin-navbar__dropdown-item--danger{background-color:#ef4444;color:#fff}.admin-navbar__dropdown-item--danger:hover{background-color:#991b1b}}.admin-navbar__divider{border:none;border-top:1px solid #f3f4f6;margin:0}@media(prefers-color-scheme:dark){.admin-navbar__divider{border-color:#404040}}\n"] }]
+        }], ctorParameters: () => [{ type: SidebarStateService }], propDecorators: { admin: [{
+                type: Input
+            }], myAccountPath: [{
+                type: Input
+            }], logout: [{
+                type: Output
+            }], clickout: [{
+                type: HostListener,
+                args: ['document:click', ['$event']]
+            }] } });
+
+/**
+ * Reusable admin shell: sidebar + navbar + router-outlet.
+ *
+ * This component is intentionally free of any auth/session logic — that stays
+ * in the consuming app. Project app-specific global UI (e.g. a session-timeout
+ * modal) through the default content slot.
+ */
+class AdminLayoutComponent {
+    items = [];
+    homePath = '';
+    admin = null;
+    myAccountPath = '';
+    logoUrl = '';
+    logoAlt = '';
+    logout = new EventEmitter();
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.25", ngImport: i0, type: AdminLayoutComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.3.25", type: AdminLayoutComponent, isStandalone: true, selector: "admin-layout", inputs: { items: "items", homePath: "homePath", admin: "admin", myAccountPath: "myAccountPath", logoUrl: "logoUrl", logoAlt: "logoAlt" }, outputs: { logout: "logout" }, ngImport: i0, template: "<div class=\"admin-layout\">\n  <sidebar-menu [items]=\"items\" [homePath]=\"homePath\" [logoUrl]=\"logoUrl\" [logoAlt]=\"logoAlt\"></sidebar-menu>\n\n  <main class=\"admin-layout__main\">\n    <admin-navbar [admin]=\"admin\" [myAccountPath]=\"myAccountPath\" (logout)=\"logout.emit()\"></admin-navbar>\n\n    <div class=\"admin-layout__content\">\n      <router-outlet></router-outlet>\n    </div>\n\n    <delete-confirmation />\n    <ng-content></ng-content>\n    <ngx-sonner-toaster richColors [expand]=\"true\" />\n  </main>\n</div>\n", styles: [".admin-layout{display:flex;height:100vh;background-color:#e5e7eb}.admin-layout__main{flex:1 1 auto;min-width:0;overflow-x:hidden;overflow-y:auto;background-color:#f3f4f6}@media(prefers-color-scheme:dark){.admin-layout__main{background-color:#262626}}.admin-layout__content{padding:.75rem}@media(min-width:640px){.admin-layout__content{padding:1rem}}@media(min-width:1024px){.admin-layout__content{padding:1.5rem}}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: RouterOutlet, selector: "router-outlet", inputs: ["name", "routerOutletData"], outputs: ["activate", "deactivate", "attach", "detach"], exportAs: ["outlet"] }, { kind: "component", type: NgxSonnerToaster, selector: "ngx-sonner-toaster", inputs: ["invert", "theme", "position", "hotKey", "richColors", "expand", "duration", "visibleToasts", "closeButton", "toastOptions", "offset", "dir", "class", "style"] }, { kind: "component", type: AdminNavbarComponent, selector: "admin-navbar", inputs: ["admin", "myAccountPath"], outputs: ["logout"] }, { kind: "component", type: SidebarMenuComponent, selector: "sidebar-menu", inputs: ["items", "homePath", "logoUrl", "logoAlt"] }, { kind: "component", type: DeleteConfirmationComponent, selector: "delete-confirmation" }] });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.25", ngImport: i0, type: AdminLayoutComponent, decorators: [{
+            type: Component,
+            args: [{ selector: 'admin-layout', standalone: true, imports: [
+                        CommonModule,
+                        RouterOutlet,
+                        NgxSonnerToaster,
+                        AdminNavbarComponent,
+                        SidebarMenuComponent,
+                        DeleteConfirmationComponent,
+                    ], template: "<div class=\"admin-layout\">\n  <sidebar-menu [items]=\"items\" [homePath]=\"homePath\" [logoUrl]=\"logoUrl\" [logoAlt]=\"logoAlt\"></sidebar-menu>\n\n  <main class=\"admin-layout__main\">\n    <admin-navbar [admin]=\"admin\" [myAccountPath]=\"myAccountPath\" (logout)=\"logout.emit()\"></admin-navbar>\n\n    <div class=\"admin-layout__content\">\n      <router-outlet></router-outlet>\n    </div>\n\n    <delete-confirmation />\n    <ng-content></ng-content>\n    <ngx-sonner-toaster richColors [expand]=\"true\" />\n  </main>\n</div>\n", styles: [".admin-layout{display:flex;height:100vh;background-color:#e5e7eb}.admin-layout__main{flex:1 1 auto;min-width:0;overflow-x:hidden;overflow-y:auto;background-color:#f3f4f6}@media(prefers-color-scheme:dark){.admin-layout__main{background-color:#262626}}.admin-layout__content{padding:.75rem}@media(min-width:640px){.admin-layout__content{padding:1rem}}@media(min-width:1024px){.admin-layout__content{padding:1.5rem}}\n"] }]
+        }], propDecorators: { items: [{
+                type: Input,
+                args: [{ required: true }]
+            }], homePath: [{
+                type: Input,
+                args: [{ required: true }]
+            }], admin: [{
+                type: Input
+            }], myAccountPath: [{
+                type: Input
+            }], logoUrl: [{
+                type: Input
+            }], logoAlt: [{
+                type: Input
+            }], logout: [{
+                type: Output
+            }] } });
+
+class PublicLayoutComponent {
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.25", ngImport: i0, type: PublicLayoutComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.3.25", type: PublicLayoutComponent, isStandalone: true, selector: "app-public-layout", ngImport: i0, template: "<div class=\"public-layout\">\n  <router-outlet></router-outlet>\n  <ngx-sonner-toaster richColors [expand]=\"true\" />\n</div>\n", styles: [".public-layout{height:100vh;width:100%}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: RouterOutlet, selector: "router-outlet", inputs: ["name", "routerOutletData"], outputs: ["activate", "deactivate", "attach", "detach"], exportAs: ["outlet"] }, { kind: "component", type: NgxSonnerToaster, selector: "ngx-sonner-toaster", inputs: ["invert", "theme", "position", "hotKey", "richColors", "expand", "duration", "visibleToasts", "closeButton", "toastOptions", "offset", "dir", "class", "style"] }] });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.25", ngImport: i0, type: PublicLayoutComponent, decorators: [{
+            type: Component,
+            args: [{ selector: 'app-public-layout', standalone: true, imports: [CommonModule, RouterOutlet, NgxSonnerToaster], template: "<div class=\"public-layout\">\n  <router-outlet></router-outlet>\n  <ngx-sonner-toaster richColors [expand]=\"true\" />\n</div>\n", styles: [".public-layout{height:100vh;width:100%}\n"] }]
+        }] });
 
 // Reglas de formato/longitud por tipo de documento de identidad colombiano (QTN-44).
 const IDENTITY_DOCUMENT_RULES = {
@@ -6118,7 +6298,7 @@ class IdentityDocumentInputComponent {
         }
         return baseClasses;
     }
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.25", ngImport: i0, type: IdentityDocumentInputComponent, deps: [{ token: i1$3.TranslocoService }, { token: i0.Injector }, { token: i0.ElementRef }], target: i0.ɵɵFactoryTarget.Component });
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.25", ngImport: i0, type: IdentityDocumentInputComponent, deps: [{ token: i2.TranslocoService }, { token: i0.Injector }, { token: i0.ElementRef }], target: i0.ɵɵFactoryTarget.Component });
     static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.25", type: IdentityDocumentInputComponent, isStandalone: true, selector: "identity-document-input", inputs: { label: "label", name: "name", id: "id", placeholder: "placeholder", required: "required", readonly: "readonly", fieldGroupClass: "fieldGroupClass", documentType: "documentType", validateCheckDigit: "validateCheckDigit" }, providers: [
             {
                 provide: NG_VALUE_ACCESSOR,
@@ -6146,7 +6326,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.25", ngImpo
                             multi: true,
                         },
                     ], template: "<div [class]=\"fieldGroupClasses\">\n  @if (label) {\n    <label [for]=\"inputId\" class=\"identity-document-input-label\">\n      {{ label }}\n\n      @if (required) {\n        <span class=\"identity-document-input-required\">*</span>\n      }\n    </label>\n  }\n\n  <input\n    type=\"text\"\n    [id]=\"inputId\"\n    [name]=\"name\"\n    [placeholder]=\"placeholder\"\n    [required]=\"required\"\n    [inputMode]=\"inputMode\"\n    [attr.maxlength]=\"maxLength\"\n    [value]=\"value ?? ''\"\n    (input)=\"onInput($event.target.value)\"\n    (keydown)=\"onKeyDown($event)\"\n    (blur)=\"onTouched()\"\n    [readonly]=\"readonly\"\n    [disabled]=\"disabled\"\n    [class.disabled]=\"readonly\"\n    [class.error]=\"showError\"\n    class=\"identity-document-input\"\n  />\n\n  @if (showError) {\n    <div class=\"identity-document-input-error-message\">\n      {{ errorMessage }}\n    </div>\n  }\n</div>\n", styles: [".identity-document-input-label{color:#374151;display:block;font-size:.875rem;font-weight:600;margin-bottom:.25rem}@media(prefers-color-scheme:dark){.identity-document-input-label{color:#d1d5db}}.identity-document-input{background-color:#fff;border:1px solid #d1d5db;border-radius:.375rem;color:#111827;display:block;outline:0;padding:.375rem .75rem;width:100%}.identity-document-input::placeholder{color:#9ca3af}.identity-document-input:focus{border-color:#1f2937}.identity-document-input.error{outline-color:#ef4444}@media(prefers-color-scheme:dark){.identity-document-input.error{background-color:#374151;color:#fff;outline-color:#ef4444}}.identity-document-input.disabled{background-color:#e5e7eb;color:#6b7280;cursor:not-allowed}@media(prefers-color-scheme:dark){.identity-document-input.disabled{background-color:#374151;color:#d1d5db}}@media(prefers-color-scheme:dark){.identity-document-input{background-color:#1f2937;border-color:#4b5563;color:#f3f4f6}.identity-document-input::placeholder{color:#6b7280}}@media(min-width:768px){.identity-document-input{font-size:.875rem}}.identity-document-input-required{color:#ef4444}.identity-document-input-error-message{color:#ef4444;font-size:.75rem;margin-top:.25rem}\n"] }]
-        }], ctorParameters: () => [{ type: i1$3.TranslocoService }, { type: i0.Injector }, { type: i0.ElementRef }], propDecorators: { label: [{
+        }], ctorParameters: () => [{ type: i2.TranslocoService }, { type: i0.Injector }, { type: i0.ElementRef }], propDecorators: { label: [{
                 type: Input
             }], name: [{
                 type: Input
@@ -6235,8 +6415,8 @@ class FormSelectComponent {
         }
         return baseClasses;
     }
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.25", ngImport: i0, type: FormSelectComponent, deps: [{ token: i1$2.NgControl, optional: true, self: true }, { token: i1$3.TranslocoService }], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.25", type: FormSelectComponent, isStandalone: true, selector: "form-select", inputs: { label: "label", name: "name", id: "id", placeholder: "placeholder", required: "required", disabled: "disabled", readonly: "readonly", options: "options", fieldGroupClass: "fieldGroupClass", showDefaultOption: "showDefaultOption", defaultOptionLabel: "defaultOptionLabel" }, ngImport: i0, template: "<div [class]=\"fieldGroupClasses\">\n  @if (label) {\n    <label [for]=\"inputId\" class=\"form-select-label\">\n      {{ label }}\n\n      @if (required) {\n        <span class=\"form-select-required\">*</span>\n      }\n    </label>\n  }\n\n  <div class=\"relative\">\n    <select\n      [id]=\"inputId\"\n      [name]=\"name\"\n      [required]=\"required\"\n      [disabled]=\"disabled\"\n      [(ngModel)]=\"value\"\n      (ngModelChange)=\"onSelectChange($event)\"\n      (blur)=\"onTouched()\"\n      class=\"form-select\"\n      [class.disabled]=\"readonly\"\n      [class.error]=\"showError\"\n    >\n      @if (showDefaultOption && this.defaultOptionLabel) {\n        <option [value]=\"null\" disabled selected>{{ this.defaultOptionLabel }}</option>\n      } @else if (showDefaultOption) {\n        <option [value]=\"null\" disabled selected>{{ 'common.selectOption' | transloco }}</option>\n      }\n\n      @for (option of options; track option.value) {\n        <option [value]=\"option.value\" [disabled]=\"option.disabled\">\n          {{ option.label }}\n        </option>\n      }\n    </select>\n  </div>\n\n  @if (showError) {\n    <div class=\"form-select-error-message\">\n      {{ errorMessage }}\n    </div>\n  }\n</div>\n", styles: [".form-select-label{color:#374151;display:block;font-size:.875rem;font-weight:600;margin-bottom:.25rem}@media(prefers-color-scheme:dark){.form-select-label{color:#d1d5db}}.form-select{background-color:#fff;border:1px solid #d1d5db;border-radius:.375rem;color:#111827;display:block;padding:.375rem 2.5rem .375rem .75rem;outline:1px solid #d1d5db;outline-offset:1px;width:100%;-webkit-appearance:none;-moz-appearance:none;appearance:none;background-image:url(\"data:image/svg+xml;charset=US-ASCII,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 24 24' fill='none' stroke='%236b7280' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='6 9 12 15 18 9'%3E%3C/polyline%3E%3C/svg%3E\");background-repeat:no-repeat;background-position:right .75rem center;background-size:1em}.form-select::-ms-expand{display:none}@-moz-document url-prefix(){.form-select{text-indent:.01px;text-overflow:\"\";padding-right:.75rem}}.form-select:focus{outline:2px solid #4f46e5;outline-offset:2px}.form-select.error{outline-color:#ef4444}@media(prefers-color-scheme:dark){.form-select.error{background-color:#374151;color:#fff;outline-color:#ef4444}}.form-select.disabled{background-color:#e5e7eb;color:#6b7280;cursor:not-allowed}@media(prefers-color-scheme:dark){.form-select.disabled{background-color:#374151;color:#d1d5db}}@media(min-width:768px){.form-select{font-size:.875rem}}.form-select-required{color:#ef4444}.form-select-error-message{color:#ef4444;font-size:.75rem;margin-top:.25rem}\n"], dependencies: [{ kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1$2.NgSelectOption, selector: "option", inputs: ["ngValue", "value"] }, { kind: "directive", type: i1$2.ɵNgSelectMultipleOption, selector: "option", inputs: ["ngValue", "value"] }, { kind: "directive", type: i1$2.SelectControlValueAccessor, selector: "select:not([multiple])[formControlName],select:not([multiple])[formControl],select:not([multiple])[ngModel]", inputs: ["compareWith"] }, { kind: "directive", type: i1$2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$2.RequiredValidator, selector: ":not([type=checkbox])[required][formControlName],:not([type=checkbox])[required][formControl],:not([type=checkbox])[required][ngModel]", inputs: ["required"] }, { kind: "directive", type: i1$2.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "ngmodule", type: CommonModule }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "ngmodule", type: TranslocoModule }, { kind: "pipe", type: i1$3.TranslocoPipe, name: "transloco" }] });
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.25", ngImport: i0, type: FormSelectComponent, deps: [{ token: i1$2.NgControl, optional: true, self: true }, { token: i2.TranslocoService }], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.25", type: FormSelectComponent, isStandalone: true, selector: "form-select", inputs: { label: "label", name: "name", id: "id", placeholder: "placeholder", required: "required", disabled: "disabled", readonly: "readonly", options: "options", fieldGroupClass: "fieldGroupClass", showDefaultOption: "showDefaultOption", defaultOptionLabel: "defaultOptionLabel" }, ngImport: i0, template: "<div [class]=\"fieldGroupClasses\">\n  @if (label) {\n    <label [for]=\"inputId\" class=\"form-select-label\">\n      {{ label }}\n\n      @if (required) {\n        <span class=\"form-select-required\">*</span>\n      }\n    </label>\n  }\n\n  <div class=\"relative\">\n    <select\n      [id]=\"inputId\"\n      [name]=\"name\"\n      [required]=\"required\"\n      [disabled]=\"disabled\"\n      [(ngModel)]=\"value\"\n      (ngModelChange)=\"onSelectChange($event)\"\n      (blur)=\"onTouched()\"\n      class=\"form-select\"\n      [class.disabled]=\"readonly\"\n      [class.error]=\"showError\"\n    >\n      @if (showDefaultOption && this.defaultOptionLabel) {\n        <option [value]=\"null\" disabled selected>{{ this.defaultOptionLabel }}</option>\n      } @else if (showDefaultOption) {\n        <option [value]=\"null\" disabled selected>{{ 'common.selectOption' | transloco }}</option>\n      }\n\n      @for (option of options; track option.value) {\n        <option [value]=\"option.value\" [disabled]=\"option.disabled\">\n          {{ option.label }}\n        </option>\n      }\n    </select>\n  </div>\n\n  @if (showError) {\n    <div class=\"form-select-error-message\">\n      {{ errorMessage }}\n    </div>\n  }\n</div>\n", styles: [".form-select-label{color:#374151;display:block;font-size:.875rem;font-weight:600;margin-bottom:.25rem}@media(prefers-color-scheme:dark){.form-select-label{color:#d1d5db}}.form-select{background-color:#fff;border:1px solid #d1d5db;border-radius:.375rem;color:#111827;display:block;padding:.375rem 2.5rem .375rem .75rem;outline:1px solid #d1d5db;outline-offset:1px;width:100%;-webkit-appearance:none;-moz-appearance:none;appearance:none;background-image:url(\"data:image/svg+xml;charset=US-ASCII,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 24 24' fill='none' stroke='%236b7280' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='6 9 12 15 18 9'%3E%3C/polyline%3E%3C/svg%3E\");background-repeat:no-repeat;background-position:right .75rem center;background-size:1em}.form-select::-ms-expand{display:none}@-moz-document url-prefix(){.form-select{text-indent:.01px;text-overflow:\"\";padding-right:.75rem}}.form-select:focus{outline:2px solid #4f46e5;outline-offset:2px}.form-select.error{outline-color:#ef4444}@media(prefers-color-scheme:dark){.form-select.error{background-color:#374151;color:#fff;outline-color:#ef4444}}.form-select.disabled{background-color:#e5e7eb;color:#6b7280;cursor:not-allowed}@media(prefers-color-scheme:dark){.form-select.disabled{background-color:#374151;color:#d1d5db}}@media(min-width:768px){.form-select{font-size:.875rem}}.form-select-required{color:#ef4444}.form-select-error-message{color:#ef4444;font-size:.75rem;margin-top:.25rem}\n"], dependencies: [{ kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1$2.NgSelectOption, selector: "option", inputs: ["ngValue", "value"] }, { kind: "directive", type: i1$2.ɵNgSelectMultipleOption, selector: "option", inputs: ["ngValue", "value"] }, { kind: "directive", type: i1$2.SelectControlValueAccessor, selector: "select:not([multiple])[formControlName],select:not([multiple])[formControl],select:not([multiple])[ngModel]", inputs: ["compareWith"] }, { kind: "directive", type: i1$2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$2.RequiredValidator, selector: ":not([type=checkbox])[required][formControlName],:not([type=checkbox])[required][formControl],:not([type=checkbox])[required][ngModel]", inputs: ["required"] }, { kind: "directive", type: i1$2.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "ngmodule", type: CommonModule }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "ngmodule", type: TranslocoModule }, { kind: "pipe", type: i2.TranslocoPipe, name: "transloco" }] });
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.25", ngImport: i0, type: FormSelectComponent, decorators: [{
             type: Component,
@@ -6245,7 +6425,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.25", ngImpo
                     type: Self
                 }, {
                     type: Optional
-                }] }, { type: i1$3.TranslocoService }], propDecorators: { label: [{
+                }] }, { type: i2.TranslocoService }], propDecorators: { label: [{
                 type: Input
             }], name: [{
                 type: Input
@@ -6349,7 +6529,7 @@ class FormTextareaComponent {
         }
         return baseClasses;
     }
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.25", ngImport: i0, type: FormTextareaComponent, deps: [{ token: i1$2.NgControl, optional: true, self: true }, { token: i1$3.TranslocoService }], target: i0.ɵɵFactoryTarget.Component });
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.25", ngImport: i0, type: FormTextareaComponent, deps: [{ token: i1$2.NgControl, optional: true, self: true }, { token: i2.TranslocoService }], target: i0.ɵɵFactoryTarget.Component });
     static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.25", type: FormTextareaComponent, isStandalone: true, selector: "form-textarea", inputs: { label: "label", name: "name", id: "id", placeholder: "placeholder", required: "required", readonly: "readonly", minlength: "minlength", maxlength: "maxlength", rows: "rows", cols: "cols", fieldGroupClass: "fieldGroupClass" }, ngImport: i0, template: "<div [class]=\"fieldGroupClasses\">\n  @if (label) {\n    <label [for]=\"inputId\" class=\"form-textarea-label\">\n      {{ label }}\n\n      @if (required) {\n        <span class=\"form-textarea-required\">*</span>\n      }\n    </label>\n  }\n\n  <div class=\"relative\">\n    <textarea\n      [id]=\"inputId\"\n      [name]=\"name\"\n      [placeholder]=\"placeholder\"\n      [required]=\"required\"\n      [minlength]=\"minlength\"\n      [maxlength]=\"maxlength\"\n      [rows]=\"rows\"\n      [cols]=\"cols\"\n      [(ngModel)]=\"value\"\n      (ngModelChange)=\"onInput($event)\"\n      (blur)=\"onTouched()\"\n      [readonly]=\"readonly\"\n      [disabled]=\"disabled\"\n      class=\"form-textarea\"\n      [class.disabled]=\"readonly\"\n      [class.error]=\"showError\"\n    ></textarea>\n  </div>\n\n  @if (showError) {\n    <div class=\"form-textarea-error-message\">\n      {{ errorMessage }}\n    </div>\n  }\n</div>\n", styles: [".form-textarea-label{color:#374151;display:block;font-size:.875rem;font-weight:600;margin-bottom:.25rem}@media(prefers-color-scheme:dark){.form-textarea-label{color:#d1d5db}}.form-textarea{background-color:#fff;border:1px solid #d1d5db;border-radius:.375rem;color:#111827;display:block;padding:.375rem .75rem;outline:1px solid #d1d5db;outline-offset:1px;width:100%}.form-textarea::placeholder{color:#9ca3af}.form-textarea:focus{outline:2px solid #4f46e5;outline-offset:2px}.form-textarea.error{outline-color:#ef4444}@media(prefers-color-scheme:dark){.form-textarea.error{background-color:#374151;color:#fff;outline-color:#ef4444}}.form-textarea.disabled{background-color:#e5e7eb;color:#6b7280;cursor:not-allowed}@media(prefers-color-scheme:dark){.form-textarea.disabled{background-color:#374151;color:#d1d5db}}@media(min-width:768px){.form-textarea{font-size:.875rem}}.form-textarea-required{color:#ef4444}.form-textarea-error-message{color:#ef4444;font-size:.75rem;margin-top:.25rem}\n"], dependencies: [{ kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1$2.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$2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$2.RequiredValidator, selector: ":not([type=checkbox])[required][formControlName],:not([type=checkbox])[required][formControl],:not([type=checkbox])[required][ngModel]", inputs: ["required"] }, { kind: "directive", type: i1$2.MinLengthValidator, selector: "[minlength][formControlName],[minlength][formControl],[minlength][ngModel]", inputs: ["minlength"] }, { kind: "directive", type: i1$2.MaxLengthValidator, selector: "[maxlength][formControlName],[maxlength][formControl],[maxlength][ngModel]", inputs: ["maxlength"] }, { kind: "directive", type: i1$2.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "ngmodule", type: CommonModule }, { kind: "ngmodule", type: ReactiveFormsModule }] });
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.25", ngImport: i0, type: FormTextareaComponent, decorators: [{
@@ -6359,7 +6539,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.25", ngImpo
                     type: Self
                 }, {
                     type: Optional
-                }] }, { type: i1$3.TranslocoService }], propDecorators: { label: [{
+                }] }, { type: i2.TranslocoService }], propDecorators: { label: [{
                 type: Input
             }], name: [{
                 type: Input
@@ -6552,7 +6732,7 @@ class NumberInputComponent {
             return null;
         return num > this.max ? { max: { max: this.max, actual: num } } : null;
     }
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.25", ngImport: i0, type: NumberInputComponent, deps: [{ token: i1$3.TranslocoService }, { token: i0.Injector }, { token: i0.ElementRef }], target: i0.ɵɵFactoryTarget.Component });
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.25", ngImport: i0, type: NumberInputComponent, deps: [{ token: i2.TranslocoService }, { token: i0.Injector }, { token: i0.ElementRef }], target: i0.ɵɵFactoryTarget.Component });
     static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.25", type: NumberInputComponent, isStandalone: true, selector: "number-input", inputs: { label: "label", name: "name", id: "id", placeholder: "placeholder", required: "required", readonly: "readonly", min: "min", max: "max", step: "step", fieldGroupClass: "fieldGroupClass" }, providers: [
             {
                 provide: NG_VALUE_ACCESSOR,
@@ -6572,7 +6752,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.25", ngImpo
                         },
                         { provide: NG_VALIDATORS, useExisting: forwardRef(() => NumberInputComponent), multi: true },
                     ], template: "<div [class]=\"fieldGroupClasses\">\n  @if (label) {\n    <label [for]=\"inputId\" class=\"number-input-label\">\n      {{ label }}\n\n      @if (required) {\n        <span class=\"number-input-required\">*</span>\n      }\n    </label>\n  }\n\n  <div class=\"number-input-group\" [class.error]=\"showError\">\n    <button\n      type=\"button\"\n      class=\"number-input-button\"\n      [attr.aria-label]=\"transloco.translate('numberInput.decrement')\"\n      [disabled]=\"!canDecrement\"\n      (click)=\"decrement()\"\n    >\n      <i class=\"ri-subtract-line\"></i>\n    </button>\n\n    <input\n      type=\"number\"\n      [id]=\"inputId\"\n      [name]=\"name\"\n      [placeholder]=\"placeholder\"\n      [required]=\"required\"\n      [min]=\"min\"\n      [max]=\"max\"\n      [step]=\"step\"\n      [value]=\"value ?? ''\"\n      (input)=\"onInput($event.target.value)\"\n      (blur)=\"onTouched()\"\n      [readonly]=\"readonly\"\n      [disabled]=\"disabled\"\n      [class.disabled]=\"readonly\"\n      class=\"number-input\"\n    />\n\n    <button\n      type=\"button\"\n      class=\"number-input-button\"\n      [attr.aria-label]=\"transloco.translate('numberInput.increment')\"\n      [disabled]=\"!canIncrement\"\n      (click)=\"increment()\"\n    >\n      <i class=\"ri-add-line\"></i>\n    </button>\n  </div>\n\n  @if (showError) {\n    <div class=\"number-input-error-message\">\n      {{ errorMessage }}\n    </div>\n  }\n</div>\n", styles: [".number-input-label{color:#374151;display:block;font-size:.875rem;font-weight:600;margin-bottom:.25rem}@media(prefers-color-scheme:dark){.number-input-label{color:#d1d5db}}.number-input-group{display:flex;align-items:stretch}.number-input-group.error .number-input{outline-color:#ef4444}@media(prefers-color-scheme:dark){.number-input-group.error .number-input{background-color:#374151;color:#fff;outline-color:#ef4444}}.number-input-group.error .number-input-button{border-color:#ef4444}@media(prefers-color-scheme:dark){.number-input-group.error .number-input-button{background-color:#374151;color:#fff}}.number-input-button{align-items:center;background-color:#fff;border:1px solid #d1d5db;color:#4b5563;cursor:pointer;display:flex;justify-content:center;padding:0;width:2.5rem;transition:background-color .15s ease}.number-input-button:first-child{border-radius:.375rem 0 0 .375rem;margin-right:-1px}.number-input-button:last-child{border-radius:0 .375rem .375rem 0;margin-left:-1px}.number-input-button i{font-size:1.125rem;line-height:1}.number-input-button:hover:not(:disabled){background-color:#f3f4f6;color:#111827}.number-input-button:disabled{background-color:#e5e7eb;color:#9ca3af;cursor:not-allowed}@media(prefers-color-scheme:dark){.number-input-button{background-color:#1f2937;border-color:#4b5563;color:#d1d5db}.number-input-button:hover:not(:disabled){background-color:#374151;color:#fff}.number-input-button:disabled{background-color:#374151;color:#6b7280}}.number-input{background-color:#fff;border:1px solid #d1d5db;color:#111827;display:block;font-weight:500;outline:1px solid #d1d5db;outline-offset:-1px;padding:.375rem .75rem;text-align:center;width:100%}.number-input::placeholder{color:#9ca3af}.number-input:focus{outline:2px solid #4f46e5;outline-offset:-2px}.number-input.disabled{background-color:#e5e7eb;color:#6b7280;cursor:not-allowed}@media(prefers-color-scheme:dark){.number-input.disabled{background-color:#374151;color:#d1d5db}}.number-input::-webkit-inner-spin-button,.number-input::-webkit-outer-spin-button{-webkit-appearance:none;margin:0}.number-input[type=number]{-moz-appearance:textfield;appearance:textfield}@media(prefers-color-scheme:dark){.number-input{background-color:#1f2937;border-color:#4b5563;color:#f3f4f6}.number-input::placeholder{color:#6b7280}}@media(min-width:768px){.number-input{font-size:.875rem}}.number-input-required{color:#ef4444}.number-input-error-message{color:#ef4444;font-size:.75rem;margin-top:.25rem}\n"] }]
-        }], ctorParameters: () => [{ type: i1$3.TranslocoService }, { type: i0.Injector }, { type: i0.ElementRef }], propDecorators: { label: [{
+        }], ctorParameters: () => [{ type: i2.TranslocoService }, { type: i0.Injector }, { type: i0.ElementRef }], propDecorators: { label: [{
                 type: Input
             }], name: [{
                 type: Input
@@ -6756,7 +6936,7 @@ class PhoneInputComponent {
         const dialDigits = this.dialCode.replace('+', '');
         return digits.startsWith(dialDigits) ? digits.slice(dialDigits.length) : digits;
     }
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.25", ngImport: i0, type: PhoneInputComponent, deps: [{ token: i1$3.TranslocoService }, { token: i0.Injector }], target: i0.ɵɵFactoryTarget.Component });
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.25", ngImport: i0, type: PhoneInputComponent, deps: [{ token: i2.TranslocoService }, { token: i0.Injector }], target: i0.ɵɵFactoryTarget.Component });
     static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.25", type: PhoneInputComponent, isStandalone: true, selector: "phone-input", inputs: { label: "label", name: "name", id: "id", placeholder: "placeholder", required: "required", readonly: "readonly", maxNationalDigits: "maxNationalDigits", minNationalDigits: "minNationalDigits", defaultCountry: "defaultCountry", fieldGroupClass: "fieldGroupClass" }, providers: [
             {
                 provide: NG_VALUE_ACCESSOR,
@@ -6776,7 +6956,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.25", ngImpo
                         },
                         { provide: NG_VALIDATORS, useExisting: forwardRef(() => PhoneInputComponent), multi: true },
                     ], template: "<div [class]=\"fieldGroupClasses\">\n  @if (label) {\n    <label [for]=\"inputId\" class=\"phone-input-label\">\n      {{ label }}\n\n      @if (required) {\n        <span class=\"phone-input-required\">*</span>\n      }\n    </label>\n  }\n\n  <div class=\"phone-input-field\">\n    <div class=\"phone-prefix-wrapper\">\n      <ng-select\n        class=\"phone-prefix-select\"\n        [items]=\"phoneOptions\"\n        bindValue=\"isoCode\"\n        bindLabel=\"search\"\n        [searchable]=\"true\"\n        [clearable]=\"false\"\n        [virtualScroll]=\"true\"\n        placeholder=\"\"\n        [disabled]=\"disabled || readonly\"\n        [ngModel]=\"selectedIso\"\n        (ngModelChange)=\"onCountryChange($event)\"\n      >\n        <ng-template ng-label-tmp let-item=\"item\">\n          {{ flag(item.isoCode) }} {{ item.dialCode }}\n        </ng-template>\n        <ng-template ng-option-tmp let-item=\"item\">\n          {{ flag(item.isoCode) }} {{ item.name }} ({{ item.dialCode }})\n        </ng-template>\n      </ng-select>\n    </div>\n\n    <input\n      [id]=\"inputId\"\n      [name]=\"name\"\n      [placeholder]=\"effectivePlaceholder\"\n      [required]=\"required\"\n      [attr.minlength]=\"minNationalDigits\"\n      [attr.maxlength]=\"maxNationalDigits\"\n      [readonly]=\"readonly\"\n      [disabled]=\"disabled\"\n      [value]=\"nationalNumber\"\n      [class.error]=\"showError\"\n      [class.disabled]=\"disabled || readonly\"\n      [attr.inputmode]=\"'numeric'\"\n      [autocomplete]=\"'tel-national'\"\n      (input)=\"onInput($event)\"\n      (blur)=\"onTouched()\"\n      class=\"phone-input form-input\"\n    />\n  </div>\n\n  @if (showError) {\n    <div class=\"phone-input-error-message\">\n      {{ errorMessage }}\n    </div>\n  }\n</div>\n", styles: [".phone-input-group{width:100%}.phone-input-label{color:#374151;display:block;font-size:.875rem;font-weight:600;margin-bottom:.25rem}.phone-input-field{position:relative}.phone-prefix-wrapper{align-items:stretch;bottom:0;display:flex;left:0;position:absolute;top:0;z-index:10}.phone-prefix-wrapper .ng-select.phone-prefix-select{width:6rem}.phone-prefix-wrapper .ng-select.phone-prefix-select .ng-select-container{background-color:transparent;border:none;border-radius:0;border-right:1px solid #d1d5db;box-shadow:none;height:100%;min-height:0}.phone-prefix-wrapper .ng-select.phone-prefix-select .ng-select-container .ng-value-container{align-items:center;padding:0 .25rem 0 .5rem;white-space:nowrap}.phone-prefix-wrapper .ng-select.phone-prefix-select .ng-select-container .ng-value-container .ng-placeholder{color:#9ca3af}.phone-prefix-wrapper .ng-select.phone-prefix-select .ng-select-container .ng-value-container .ng-value{color:#374151;display:inline-flex;font-size:.75rem;height:auto;line-height:normal}.phone-prefix-wrapper .ng-select.phone-prefix-select .ng-select-container .ng-value-container .ng-value .ng-value-label{color:#374151;font-size:.75rem;white-space:nowrap}.phone-prefix-wrapper .ng-select.phone-prefix-select .ng-select-container .ng-value-container .ng-input>input{color:#111827;font-size:.75rem;padding-left:.5rem;height:100%}.phone-prefix-wrapper .ng-select.phone-prefix-select .ng-arrow-wrapper{padding-right:.25rem}.phone-prefix-wrapper .ng-select.phone-prefix-select.ng-select-focused:not(.ng-select-opened)>.ng-select-container{outline:none}.form-input.phone-input{padding-left:7rem}.phone-input-required{color:#ef4444}.phone-input-error-message{color:#ef4444;font-size:.75rem;margin-top:.25rem}.ng-select.ng-select-opened>.ng-select-container{background-color:#fff;border-color:#d1d5db}.ng-select.ng-select-opened>.ng-select-container .ng-arrow{border-top-color:#6b7280}.ng-select.ng-select-focused:not(.ng-select-opened)>.ng-select-container{border-color:#d1d5db;outline:2px solid #4f46e5;outline-offset:2px}.ng-select.ng-select-disabled>.ng-select-container{background-color:#e5e7eb;color:#6b7280;cursor:not-allowed}.ng-select.error>.ng-select-container{outline:2px solid #ef4444;outline-offset:2px}.ng-select .ng-has-value .ng-placeholder{display:none}.ng-select .ng-select-container{color:#111827;background-color:#fff;border:1px solid #d1d5db;border-radius:.375rem;min-height:0}.ng-select .ng-select-container .ng-value-container{padding:.375rem 0 .375rem .75rem}.ng-select .ng-select-container .ng-value-container .ng-placeholder{color:#9ca3af}.ng-select.ng-select-single .ng-select-container{display:flex;gap:.25rem;height:auto;height:33px}.ng-select.ng-select-single .ng-select-container .ng-value-container .ng-input{top:50%;transform:translateY(-50%);left:.75rem}.ng-select.ng-select-single .ng-select-container .ng-value-container .ng-input>input{font-size:.75rem;height:20px}.ng-select.ng-select-single .ng-select-container .ng-value-container .ng-value{height:auto;line-height:100%}.ng-select.ng-select-single .ng-select-container .ng-value-container .ng-value .ng-value-label{font-size:.75rem}.ng-select.ng-select-multiple .ng-select-container .ng-value-container{gap:.25rem}.ng-select.ng-select-multiple .ng-select-container .ng-value-container .ng-input>input{font-size:.75rem}.ng-select.ng-select-multiple .ng-select-container .ng-value-container .ng-value{align-items:center;background-color:#eef2ff;border-radius:.125rem;display:flex;color:#4338ca;flex-flow:row nowrap;font-size:.75rem;height:22px;line-height:100%;gap:.25rem;overflow:hidden;padding:.25rem}.ng-select.ng-select-multiple .ng-select-container .ng-value-container .ng-value .ng-value-label{font-size:.75rem}.ng-select.ng-select-multiple .ng-select-container .ng-value-container .ng-value .ng-value-icon:hover{background-color:#e0e7ff}.ng-select.ng-select-multiple .ng-select-container .ng-value-container .ng-value.ng-value-disabled{color:#6b7280;background-color:#f3f4f6}.ng-select .ng-clear-wrapper{align-items:center;color:#9ca3af;display:flex;flex-flow:column nowrap;justify-content:center}.ng-select .ng-clear-wrapper:hover .ng-clear{color:#ef4444}.ng-select .ng-spinner-loader{border-top-color:#4f46e533;border-right-color:#4f46e533;border-bottom-color:#4f46e533;border-left-color:#4f46e5}.ng-select .ng-arrow-wrapper .ng-arrow{border-top-color:#9ca3af}.ng-select .ng-arrow-wrapper:hover .ng-arrow{border-top-color:#4b5563}@media(prefers-color-scheme:dark){.ng-select.ng-select-opened>.ng-select-container{background-color:#1f2937;border-color:#4b5563}.ng-select.ng-select-disabled>.ng-select-container{background-color:#374151;color:#d1d5db}.ng-select .ng-select-container{color:#fff;background-color:#1f2937;border-color:#4b5563}.ng-select .ng-select-container .ng-value-container .ng-placeholder{color:#6b7280}.ng-select.ng-select-multiple .ng-select-container .ng-value-container .ng-value{color:#a5b4fc;background-color:#4f46e533}.ng-select.ng-select-multiple .ng-select-container .ng-value-container .ng-value.ng-value-disabled{color:#9ca3af;background-color:#374151}}.ng-dropdown-panel{background-color:#fff;border:1px solid #e5e7eb;border-radius:.375rem;box-shadow:0 10px 15px -3px #0000001a,0 4px 6px -4px #0000001a}.ng-dropdown-panel.ng-select-bottom{margin-top:.25rem}.ng-dropdown-panel.ng-select-top{margin-bottom:.25rem}.ng-dropdown-panel .ng-dropdown-header,.ng-dropdown-panel .ng-dropdown-footer{border-color:#e5e7eb;padding:.5rem}.ng-dropdown-panel .ng-dropdown-panel-items::-webkit-scrollbar{width:4px;height:4px}.ng-dropdown-panel .ng-dropdown-panel-items::-webkit-scrollbar-track{background:transparent}.ng-dropdown-panel .ng-dropdown-panel-items::-webkit-scrollbar-thumb{background:#d1d5db;border-radius:9999px}.ng-dropdown-panel .ng-dropdown-panel-items::-webkit-scrollbar-thumb:hover{background:#9ca3af}.ng-dropdown-panel .ng-dropdown-panel-items .ng-optgroup{font-weight:500;color:#6b7280}.ng-dropdown-panel .ng-dropdown-panel-items .ng-optgroup.ng-option-marked{background-color:#f9fafb;font-size:.75rem}.ng-dropdown-panel .ng-dropdown-panel-items .ng-optgroup.ng-option-selected{color:#374151;background-color:#eef2ff;font-weight:600;font-size:.75rem}.ng-dropdown-panel .ng-dropdown-panel-items .ng-option{background-color:#fff!important;color:#111827!important;font-size:.75rem!important;padding:.5rem .75rem}.ng-dropdown-panel .ng-dropdown-panel-items .ng-option.ng-option-selected{color:#4338ca!important;background-color:#eef2ff!important}.ng-dropdown-panel .ng-dropdown-panel-items .ng-option.ng-option-marked{background-color:#f9fafb!important}.ng-dropdown-panel .ng-dropdown-panel-items .ng-option.ng-option-disabled{color:#d1d5db!important}@media(prefers-color-scheme:dark){.ng-dropdown-panel{background-color:#1f2937;border-color:#374151}.ng-dropdown-panel .ng-dropdown-header,.ng-dropdown-panel .ng-dropdown-footer{border-color:#374151}.ng-dropdown-panel .ng-dropdown-panel-items .ng-optgroup{color:#9ca3af}.ng-dropdown-panel .ng-dropdown-panel-items .ng-optgroup.ng-option-marked{background-color:#374151}.ng-dropdown-panel .ng-dropdown-panel-items .ng-optgroup.ng-option-selected{color:#fff;background-color:#4f46e533}.ng-dropdown-panel .ng-dropdown-panel-items .ng-option{background-color:#1f2937!important;color:#f3f4f6!important}.ng-dropdown-panel .ng-dropdown-panel-items .ng-option.ng-option-selected{color:#a5b4fc;background-color:#4f46e533}.ng-dropdown-panel .ng-dropdown-panel-items .ng-option.ng-option-marked{background-color:#374151!important}.ng-dropdown-panel .ng-dropdown-panel-items .ng-option.ng-option-disabled{color:#4b5563!important}}\n", ".form-input-label{color:#374151;display:block;font-size:.875rem;font-weight:600;margin-bottom:.25rem}@media(prefers-color-scheme:dark){.form-input-label{color:#d1d5db}}.form-input{background-color:#fff;border:1px solid #d1d5db;border-radius:.375rem;color:#111827;display:block;outline:0;padding:.375rem .75rem;width:100%}.form-input::placeholder{color:#9ca3af}.form-input:focus{border-color:#1f2937}.form-input.error{outline-color:#ef4444}@media(prefers-color-scheme:dark){.form-input.error{background-color:#374151;outline-color:#ef4444}}.form-input.disabled{background-color:#e5e7eb;color:#6b7280;cursor:not-allowed}@media(prefers-color-scheme:dark){.form-input.disabled{background-color:#374151;color:#d1d5db}}@media screen and (min-width:768px){.form-input{font-size:.875rem}}.form-input-required{color:#ef4444}.form-input-error-message{color:#ef4444;font-size:.75rem;margin-top:.25rem}\n"] }]
-        }], ctorParameters: () => [{ type: i1$3.TranslocoService }, { type: i0.Injector }], propDecorators: { label: [{
+        }], ctorParameters: () => [{ type: i2.TranslocoService }, { type: i0.Injector }], propDecorators: { label: [{
                 type: Input
             }], name: [{
                 type: Input
@@ -6894,7 +7074,7 @@ class FormEditorComponent {
         }
         return baseClasses;
     }
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.25", ngImport: i0, type: FormEditorComponent, deps: [{ token: i1$2.NgControl, optional: true, self: true }, { token: i1$3.TranslocoService }, { token: PLATFORM_ID }], target: i0.ɵɵFactoryTarget.Component });
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.25", ngImport: i0, type: FormEditorComponent, deps: [{ token: i1$2.NgControl, optional: true, self: true }, { token: i2.TranslocoService }, { token: PLATFORM_ID }], target: i0.ɵɵFactoryTarget.Component });
     static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.25", type: FormEditorComponent, isStandalone: true, selector: "form-editor", inputs: { label: "label", name: "name", id: "id", placeholder: "placeholder", required: "required", readonly: "readonly", toolbar: "toolbar", fieldGroupClass: "fieldGroupClass" }, host: { attributes: { "ngSkipHydration": "true" } }, ngImport: i0, template: "<div [class]=\"fieldGroupClasses\">\n  @if (label) {\n    <label [for]=\"inputId\" class=\"form-editor-label\">\n      {{ label }}\n\n      @if (required) {\n        <span class=\"form-editor-required\">*</span>\n      }\n    </label>\n  }\n\n  @if (isBrowser) {\n    <div class=\"form-editor-wrapper\" [class.disabled]=\"disabled\">\n      <ngx-editor [editor]=\"editor\" outputFormat=\"html\" [placeholder]=\"placeholder\">\n        <ngx-editor-menu\n          [editor]=\"editor\"\n          [toolbar]=\"toolbar\"\n          [disabled]=\"disabled\"\n        ></ngx-editor-menu>\n      </ngx-editor>\n    </div>\n  }\n\n  @if (showError) {\n    <div class=\"form-editor-error-message\">\n      {{ errorMessage }}\n    </div>\n  }\n</div>\n", styles: [".form-editor-label{color:#374151;display:block;font-size:.875rem;font-weight:600;margin-bottom:.25rem}@media(prefers-color-scheme:dark){.form-editor-label{color:#d1d5db}}.form-editor-wrapper{position:relative}.form-editor-wrapper.disabled{opacity:.5;pointer-events:none;cursor:not-allowed}.form-editor-required{color:#ef4444}.form-editor-error-message{color:#ef4444;font-size:.75rem;margin-top:.25rem}\n"], dependencies: [{ kind: "ngmodule", type: FormsModule }, { kind: "ngmodule", type: CommonModule }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "component", type: NgxEditorComponent, selector: "ngx-editor", inputs: ["editor", "outputFormat", "placeholder"], outputs: ["focusOut", "focusIn"] }, { kind: "component", type: NgxEditorMenuComponent, selector: "ngx-editor-menu", inputs: ["toolbar", "colorPresets", "disabled", "editor", "customMenuRef", "dropdownPlacement"] }] });
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.25", ngImport: i0, type: FormEditorComponent, decorators: [{
@@ -6910,7 +7090,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.25", ngImpo
                     type: Self
                 }, {
                     type: Optional
-                }] }, { type: i1$3.TranslocoService }, { type: undefined, decorators: [{
+                }] }, { type: i2.TranslocoService }, { type: undefined, decorators: [{
                     type: Inject,
                     args: [PLATFORM_ID]
                 }] }], propDecorators: { label: [{
@@ -7186,7 +7366,7 @@ class DateInputComponent {
         }
         return baseClasses;
     }
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.25", ngImport: i0, type: DateInputComponent, deps: [{ token: i1$2.NgControl, optional: true, self: true }, { token: i1$3.TranslocoService }], target: i0.ɵɵFactoryTarget.Component });
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.25", ngImport: i0, type: DateInputComponent, deps: [{ token: i1$2.NgControl, optional: true, self: true }, { token: i2.TranslocoService }], target: i0.ɵɵFactoryTarget.Component });
     static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.25", type: DateInputComponent, isStandalone: true, selector: "date-input", inputs: { label: "label", type: "type", includeTime: "includeTime", name: "name", id: "id", placeholder: "placeholder", required: "required", readonly: "readonly", min: "min", max: "max", fieldGroupClass: "fieldGroupClass", dateFormat: "dateFormat" }, ngImport: i0, template: "<div [class]=\"fieldGroupClasses\">\n  @if (label) {\n    <label [for]=\"inputId\" class=\"date-input-label\">\n      {{ label }}\n\n      @if (required) {\n        <span class=\"date-input-required\">*</span>\n      }\n    </label>\n  }\n\n  <div class=\"relative\">\n    <input\n      [type]=\"includeTime ? 'datetime-local' : type\"\n      [id]=\"inputId\"\n      [name]=\"name\"\n      [placeholder]=\"placeholder\"\n      [required]=\"required\"\n      [min]=\"min\"\n      [max]=\"max\"\n      [(ngModel)]=\"value\"\n      (ngModelChange)=\"onInput($event)\"\n      (blur)=\"onTouched()\"\n      [disabled]=\"disabled\"\n      class=\"date-input\"\n      [class.disabled]=\"readonly\"\n      [class.error]=\"showError\"\n      [readonly]=\"readonly\"\n    />\n  </div>\n\n  @if (showError) {\n    <div class=\"date-input-error-message\">\n      {{ errorMessage }}\n    </div>\n  }\n</div>\n", styles: [".date-input-label{color:#374151;display:block;font-size:.875rem;font-weight:600;margin-bottom:.25rem}@media(prefers-color-scheme:dark){.date-input-label{color:#d1d5db}}.date-input{background-color:#fff;border:1px solid #d1d5db;border-radius:.375rem;color:#111827;display:block;padding:.375rem .75rem;outline:1px solid #d1d5db;outline-offset:1px;width:100%}.date-input::placeholder{color:#9ca3af}.date-input:focus{outline:2px solid #4f46e5;outline-offset:2px}.date-input.error{outline-color:#ef4444}@media(prefers-color-scheme:dark){.date-input.error{background-color:#374151;color:#fff;outline-color:#ef4444}}.date-input.disabled{background-color:#e5e7eb;color:#6b7280;cursor:not-allowed}@media(prefers-color-scheme:dark){.date-input.disabled{background-color:#374151;color:#d1d5db}}@media(min-width:768px){.date-input{font-size:.875rem}}.date-input-required{color:#ef4444}.date-input-error-message{color:#ef4444;font-size:.75rem;margin-top:.25rem}\n"], dependencies: [{ kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1$2.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$2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$2.RequiredValidator, selector: ":not([type=checkbox])[required][formControlName],:not([type=checkbox])[required][formControl],:not([type=checkbox])[required][ngModel]", inputs: ["required"] }, { kind: "directive", type: i1$2.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "ngmodule", type: CommonModule }, { kind: "ngmodule", type: ReactiveFormsModule }] });
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.25", ngImport: i0, type: DateInputComponent, decorators: [{
@@ -7196,7 +7376,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.25", ngImpo
                     type: Self
                 }, {
                     type: Optional
-                }] }, { type: i1$3.TranslocoService }], propDecorators: { label: [{
+                }] }, { type: i2.TranslocoService }], propDecorators: { label: [{
                 type: Input
             }], type: [{
                 type: Input
@@ -7600,8 +7780,8 @@ class FileUploadComponent {
         }
         return baseClasses;
     }
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.25", ngImport: i0, type: FileUploadComponent, deps: [{ token: i1$2.NgControl, optional: true, self: true }, { token: i1$3.TranslocoService }], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.25", type: FileUploadComponent, isStandalone: true, selector: "file-upload", inputs: { label: "label", name: "name", id: "id", required: "required", readonly: "readonly", fieldGroupClass: "fieldGroupClass", config: "config", accept: "accept" }, outputs: { fileSelected: "fileSelected", fileRemoved: "fileRemoved", validationError: "validationError" }, ngImport: i0, template: "<div [class]=\"fieldGroupClasses\">\n  @if (label) {\n    <label [for]=\"inputId\" class=\"file-upload-label\">\n      {{ label }}\n\n      @if (required) {\n        <span class=\"file-upload-required\">*</span>\n      }\n    </label>\n  }\n\n  <!-- Upload Area -->\n  <div\n    class=\"file-upload-container\"\n    (drop)=\"onDrop($event)\"\n    (dragover)=\"onDragOver($event)\"\n    (dragleave)=\"onDragLeave($event)\"\n  >\n    <div [class]=\"uploadAreaClasses\" (click)=\"!disabled && triggerFileInput()\">\n      <input\n        [id]=\"inputId\"\n        [name]=\"name\"\n        type=\"file\"\n        [accept]=\"accept\"\n        [multiple]=\"config.multiple\"\n        [disabled]=\"disabled\"\n        [required]=\"required\"\n        (change)=\"onFileSelect($event)\"\n        (blur)=\"onTouched()\"\n        class=\"file-upload-hidden\"\n      />\n\n      <div class=\"file-upload-content\">\n        <i class=\"ri-upload-cloud-2-line file-upload-icon\"></i>\n        <div class=\"file-upload-text\">\n          <p class=\"file-upload-primary-text\">\n            @if (config.multiple) {\n              {{ 'fileUpload.dropMultiple' | transloco }}\n            } @else {\n              {{ 'fileUpload.dropSingle' | transloco }}\n            }\n          </p>\n          <p class=\"file-upload-secondary-text\">\n            @if (config.allowedExtensions && config.allowedExtensions.length > 0) {\n              {{ 'fileUpload.allowedExtensions' | transloco }}\n              {{ config.allowedExtensions.join(', ') }}\n            }\n            @if (config.maxFileSize) {\n              \u2022 {{ 'fileUpload.maxSize' | transloco }} {{ formatFileSize(config.maxFileSize) }}\n            }\n          </p>\n        </div>\n      </div>\n    </div>\n  </div>\n\n  <!-- Files Preview -->\n  @if (files.length > 0) {\n    <div class=\"file-upload-list\">\n      @for (file of files; track file; let i = $index) {\n        <file-upload-preview [file]=\"file\" (remove)=\"removeFile(i)\" />\n      }\n    </div>\n  }\n\n  <!-- Validation Error -->\n  @if (showError) {\n    <div class=\"file-upload-error\">\n      {{ errorMessage }}\n    </div>\n  }\n\n  <!-- File Type Legend -->\n  @if (files.length === 0) {\n    <div class=\"file-upload-legend\">\n      <div class=\"file-upload-legend-item\">\n        <i class=\"ri-image-line file-upload-legend-icon-blue\"></i>\n        <span>{{ 'fileUpload.fileTypeImages' | transloco }}</span>\n      </div>\n      <div class=\"file-upload-legend-item\">\n        <i class=\"ri-file-pdf-line file-upload-legend-icon-red\"></i>\n        <span>PDF</span>\n      </div>\n      <div class=\"file-upload-legend-item\">\n        <i class=\"ri-file-excel-line file-upload-legend-icon-green\"></i>\n        <span>{{ 'fileUpload.fileTypeExcel' | transloco }}</span>\n      </div>\n      <div class=\"file-upload-legend-item\">\n        <i class=\"ri-file-word-line file-upload-legend-icon-word\"></i>\n        <span>{{ 'fileUpload.fileTypeWord' | transloco }}</span>\n      </div>\n      <div class=\"file-upload-legend-item\">\n        <i class=\"ri-file-text-line file-upload-legend-icon-gray\"></i>\n        <span>{{ 'fileUpload.fileTypeText' | transloco }}</span>\n      </div>\n      <div class=\"file-upload-legend-item\">\n        <i class=\"ri-file-line file-upload-legend-icon-muted\"></i>\n        <span>{{ 'fileUpload.fileTypeOther' | transloco }}</span>\n      </div>\n    </div>\n  }\n</div>\n", styles: [".file-upload-label{display:block;font-family:Open Sans,Helvetica Neue,Helvetica,Arial,sans-serif;font-size:.875rem;font-weight:500;color:#374151;margin-bottom:.25rem}@media(prefers-color-scheme:dark){.file-upload-label{color:#d1d5db}}.file-upload-required{color:#ef4444}.file-upload-container{position:relative;width:100%}.file-upload-hidden{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border-width:0}.file-upload-content{display:flex;flex-direction:column;align-items:center;gap:.5rem}.file-upload-icon{font-size:1.875rem;color:#9ca3af}.file-upload-text{font-family:Open Sans,Helvetica Neue,Helvetica,Arial,sans-serif;font-size:.875rem;color:#4b5563}.file-upload-primary-text{font-family:Open Sans,Helvetica Neue,Helvetica,Arial,sans-serif;font-weight:500;margin:0}.file-upload-secondary-text{color:#6b7280;font-family:Open Sans,Helvetica Neue,Helvetica,Arial,sans-serif;font-size:.75rem;margin-top:.25rem;margin-bottom:0}.file-upload-area{border:2px dashed #d1d5db;border-radius:.5rem;padding:1.5rem;text-align:center;transition:all .2s ease-in-out;cursor:pointer}.file-upload-area:hover:not(.disabled):not(.drag-over){border-color:#9ca3af;background-color:#f9fafb}.file-upload-area.drag-over{border-color:#60a5fa;background-color:#eff6ff}.file-upload-area.disabled{border-color:#e5e7eb;background-color:#f9fafb;cursor:not-allowed}.file-upload-list{display:flex;flex-direction:column;gap:.5rem;margin-top:1rem}.file-upload-error{color:#ef4444;font-family:Open Sans,Helvetica Neue,Helvetica,Arial,sans-serif;font-size:.75rem;margin-top:.25rem}.file-upload-legend{display:flex;flex-wrap:wrap;gap:1rem;margin-top:.75rem;font-family:Open Sans,Helvetica Neue,Helvetica,Arial,sans-serif;font-size:.75rem;color:#6b7280}@media(prefers-color-scheme:dark){.file-upload-legend{color:#9ca3af}}.file-upload-legend-item{display:flex;align-items:center;gap:.25rem}.file-upload-legend-icon-blue{color:#3b82f6}.file-upload-legend-icon-red{color:#ef4444}.file-upload-legend-icon-green{color:#10b981}.file-upload-legend-icon-word{color:#2563eb}.file-upload-legend-icon-gray{color:#6b7280}.file-upload-legend-icon-muted{color:#9ca3af}@keyframes pulse{0%,to{opacity:1}50%{opacity:.5}}.file-upload-drag-active{animation:pulse 2s cubic-bezier(.4,0,.6,1) infinite}.file-upload-file-list{max-height:15rem;overflow-y:auto}.file-upload-file-list::-webkit-scrollbar{width:.5rem}.file-upload-file-list::-webkit-scrollbar-track{background-color:#f3f4f6;border-radius:9999px}.file-upload-file-list::-webkit-scrollbar-thumb{background-color:#d1d5db;border-radius:9999px}.file-upload-file-list::-webkit-scrollbar-thumb:hover{background-color:#9ca3af}.file-type-icon--image{color:#3b82f6}.file-type-icon--pdf{color:#ef4444}.file-type-icon--excel{color:#10b981}.file-type-icon--word{color:#2563eb}.file-type-icon--text{color:#6b7280}.file-type-icon--default{color:#9ca3af}@media(max-width:640px){.file-upload-area{padding:1rem}.file-upload-icon{font-size:1.25rem}.file-upload-text{font-size:.75rem}}@media(prefers-color-scheme:dark){.file-upload-area{border-color:#4b5563;background-color:#1f2937}.file-upload-area:hover:not(.disabled):not(.drag-over){border-color:#6b7280;background-color:#374151}.file-upload-area.drag-over{border-color:#60a5fa;background-color:#eff6ff}.file-upload-area.disabled{border-color:#374151;background-color:#111827}.file-upload-text{color:#d1d5db}.file-upload-primary-text{color:#f3f4f6}.file-upload-secondary-text{color:#9ca3af}}\n"], dependencies: [{ kind: "ngmodule", type: FormsModule }, { kind: "ngmodule", type: CommonModule }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "ngmodule", type: TranslocoModule }, { kind: "component", type: FileUploadPreviewComponent, selector: "file-upload-preview", inputs: ["file"], outputs: ["remove"] }, { kind: "pipe", type: i1$3.TranslocoPipe, name: "transloco" }] });
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.25", ngImport: i0, type: FileUploadComponent, deps: [{ token: i1$2.NgControl, optional: true, self: true }, { token: i2.TranslocoService }], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.25", type: FileUploadComponent, isStandalone: true, selector: "file-upload", inputs: { label: "label", name: "name", id: "id", required: "required", readonly: "readonly", fieldGroupClass: "fieldGroupClass", config: "config", accept: "accept" }, outputs: { fileSelected: "fileSelected", fileRemoved: "fileRemoved", validationError: "validationError" }, ngImport: i0, template: "<div [class]=\"fieldGroupClasses\">\n  @if (label) {\n    <label [for]=\"inputId\" class=\"file-upload-label\">\n      {{ label }}\n\n      @if (required) {\n        <span class=\"file-upload-required\">*</span>\n      }\n    </label>\n  }\n\n  <!-- Upload Area -->\n  <div\n    class=\"file-upload-container\"\n    (drop)=\"onDrop($event)\"\n    (dragover)=\"onDragOver($event)\"\n    (dragleave)=\"onDragLeave($event)\"\n  >\n    <div [class]=\"uploadAreaClasses\" (click)=\"!disabled && triggerFileInput()\">\n      <input\n        [id]=\"inputId\"\n        [name]=\"name\"\n        type=\"file\"\n        [accept]=\"accept\"\n        [multiple]=\"config.multiple\"\n        [disabled]=\"disabled\"\n        [required]=\"required\"\n        (change)=\"onFileSelect($event)\"\n        (blur)=\"onTouched()\"\n        class=\"file-upload-hidden\"\n      />\n\n      <div class=\"file-upload-content\">\n        <i class=\"ri-upload-cloud-2-line file-upload-icon\"></i>\n        <div class=\"file-upload-text\">\n          <p class=\"file-upload-primary-text\">\n            @if (config.multiple) {\n              {{ 'fileUpload.dropMultiple' | transloco }}\n            } @else {\n              {{ 'fileUpload.dropSingle' | transloco }}\n            }\n          </p>\n          <p class=\"file-upload-secondary-text\">\n            @if (config.allowedExtensions && config.allowedExtensions.length > 0) {\n              {{ 'fileUpload.allowedExtensions' | transloco }}\n              {{ config.allowedExtensions.join(', ') }}\n            }\n            @if (config.maxFileSize) {\n              \u2022 {{ 'fileUpload.maxSize' | transloco }} {{ formatFileSize(config.maxFileSize) }}\n            }\n          </p>\n        </div>\n      </div>\n    </div>\n  </div>\n\n  <!-- Files Preview -->\n  @if (files.length > 0) {\n    <div class=\"file-upload-list\">\n      @for (file of files; track file; let i = $index) {\n        <file-upload-preview [file]=\"file\" (remove)=\"removeFile(i)\" />\n      }\n    </div>\n  }\n\n  <!-- Validation Error -->\n  @if (showError) {\n    <div class=\"file-upload-error\">\n      {{ errorMessage }}\n    </div>\n  }\n\n  <!-- File Type Legend -->\n  @if (files.length === 0) {\n    <div class=\"file-upload-legend\">\n      <div class=\"file-upload-legend-item\">\n        <i class=\"ri-image-line file-upload-legend-icon-blue\"></i>\n        <span>{{ 'fileUpload.fileTypeImages' | transloco }}</span>\n      </div>\n      <div class=\"file-upload-legend-item\">\n        <i class=\"ri-file-pdf-line file-upload-legend-icon-red\"></i>\n        <span>PDF</span>\n      </div>\n      <div class=\"file-upload-legend-item\">\n        <i class=\"ri-file-excel-line file-upload-legend-icon-green\"></i>\n        <span>{{ 'fileUpload.fileTypeExcel' | transloco }}</span>\n      </div>\n      <div class=\"file-upload-legend-item\">\n        <i class=\"ri-file-word-line file-upload-legend-icon-word\"></i>\n        <span>{{ 'fileUpload.fileTypeWord' | transloco }}</span>\n      </div>\n      <div class=\"file-upload-legend-item\">\n        <i class=\"ri-file-text-line file-upload-legend-icon-gray\"></i>\n        <span>{{ 'fileUpload.fileTypeText' | transloco }}</span>\n      </div>\n      <div class=\"file-upload-legend-item\">\n        <i class=\"ri-file-line file-upload-legend-icon-muted\"></i>\n        <span>{{ 'fileUpload.fileTypeOther' | transloco }}</span>\n      </div>\n    </div>\n  }\n</div>\n", styles: [".file-upload-label{display:block;font-family:Open Sans,Helvetica Neue,Helvetica,Arial,sans-serif;font-size:.875rem;font-weight:500;color:#374151;margin-bottom:.25rem}@media(prefers-color-scheme:dark){.file-upload-label{color:#d1d5db}}.file-upload-required{color:#ef4444}.file-upload-container{position:relative;width:100%}.file-upload-hidden{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border-width:0}.file-upload-content{display:flex;flex-direction:column;align-items:center;gap:.5rem}.file-upload-icon{font-size:1.875rem;color:#9ca3af}.file-upload-text{font-family:Open Sans,Helvetica Neue,Helvetica,Arial,sans-serif;font-size:.875rem;color:#4b5563}.file-upload-primary-text{font-family:Open Sans,Helvetica Neue,Helvetica,Arial,sans-serif;font-weight:500;margin:0}.file-upload-secondary-text{color:#6b7280;font-family:Open Sans,Helvetica Neue,Helvetica,Arial,sans-serif;font-size:.75rem;margin-top:.25rem;margin-bottom:0}.file-upload-area{border:2px dashed #d1d5db;border-radius:.5rem;padding:1.5rem;text-align:center;transition:all .2s ease-in-out;cursor:pointer}.file-upload-area:hover:not(.disabled):not(.drag-over){border-color:#9ca3af;background-color:#f9fafb}.file-upload-area.drag-over{border-color:#60a5fa;background-color:#eff6ff}.file-upload-area.disabled{border-color:#e5e7eb;background-color:#f9fafb;cursor:not-allowed}.file-upload-list{display:flex;flex-direction:column;gap:.5rem;margin-top:1rem}.file-upload-error{color:#ef4444;font-family:Open Sans,Helvetica Neue,Helvetica,Arial,sans-serif;font-size:.75rem;margin-top:.25rem}.file-upload-legend{display:flex;flex-wrap:wrap;gap:1rem;margin-top:.75rem;font-family:Open Sans,Helvetica Neue,Helvetica,Arial,sans-serif;font-size:.75rem;color:#6b7280}@media(prefers-color-scheme:dark){.file-upload-legend{color:#9ca3af}}.file-upload-legend-item{display:flex;align-items:center;gap:.25rem}.file-upload-legend-icon-blue{color:#3b82f6}.file-upload-legend-icon-red{color:#ef4444}.file-upload-legend-icon-green{color:#10b981}.file-upload-legend-icon-word{color:#2563eb}.file-upload-legend-icon-gray{color:#6b7280}.file-upload-legend-icon-muted{color:#9ca3af}@keyframes pulse{0%,to{opacity:1}50%{opacity:.5}}.file-upload-drag-active{animation:pulse 2s cubic-bezier(.4,0,.6,1) infinite}.file-upload-file-list{max-height:15rem;overflow-y:auto}.file-upload-file-list::-webkit-scrollbar{width:.5rem}.file-upload-file-list::-webkit-scrollbar-track{background-color:#f3f4f6;border-radius:9999px}.file-upload-file-list::-webkit-scrollbar-thumb{background-color:#d1d5db;border-radius:9999px}.file-upload-file-list::-webkit-scrollbar-thumb:hover{background-color:#9ca3af}.file-type-icon--image{color:#3b82f6}.file-type-icon--pdf{color:#ef4444}.file-type-icon--excel{color:#10b981}.file-type-icon--word{color:#2563eb}.file-type-icon--text{color:#6b7280}.file-type-icon--default{color:#9ca3af}@media(max-width:640px){.file-upload-area{padding:1rem}.file-upload-icon{font-size:1.25rem}.file-upload-text{font-size:.75rem}}@media(prefers-color-scheme:dark){.file-upload-area{border-color:#4b5563;background-color:#1f2937}.file-upload-area:hover:not(.disabled):not(.drag-over){border-color:#6b7280;background-color:#374151}.file-upload-area.drag-over{border-color:#60a5fa;background-color:#eff6ff}.file-upload-area.disabled{border-color:#374151;background-color:#111827}.file-upload-text{color:#d1d5db}.file-upload-primary-text{color:#f3f4f6}.file-upload-secondary-text{color:#9ca3af}}\n"], dependencies: [{ kind: "ngmodule", type: FormsModule }, { kind: "ngmodule", type: CommonModule }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "ngmodule", type: TranslocoModule }, { kind: "component", type: FileUploadPreviewComponent, selector: "file-upload-preview", inputs: ["file"], outputs: ["remove"] }, { kind: "pipe", type: i2.TranslocoPipe, name: "transloco" }] });
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.25", ngImport: i0, type: FileUploadComponent, decorators: [{
             type: Component,
@@ -7616,7 +7796,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.25", ngImpo
                     type: Self
                 }, {
                     type: Optional
-                }] }, { type: i1$3.TranslocoService }], propDecorators: { label: [{
+                }] }, { type: i2.TranslocoService }], propDecorators: { label: [{
                 type: Input
             }], name: [{
                 type: Input
@@ -7899,8 +8079,8 @@ class ChangePasswordFormComponent {
             },
         });
     }
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.25", ngImport: i0, type: ChangePasswordFormComponent, deps: [{ token: i1$2.FormBuilder }, { token: ChangePasswordFormService }, { token: CustomerService }, { token: AdminService }, { token: ToastService }, { token: i1$3.TranslocoService }], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.25", type: ChangePasswordFormComponent, isStandalone: true, selector: "change-password-form", providers: [AdminService, CustomerService], ngImport: i0, template: "@if (isOpen()) {\n  <app-modal\n    [title]=\"'changePassword.title' | transloco\"\n    [isOpen]=\"isOpen\"\n    (closeModal)=\"onCloseModal()\"\n  >\n    <form\n      [formGroup]=\"changePasswordForm\"\n      method=\"POST\"\n      class=\"change-password-form-body\"\n      (ngSubmit)=\"onConfirmDelete()\"\n    >\n      <form-input\n        [label]=\"'changePassword.newPasswordLabel' | transloco\"\n        [placeholder]=\"'changePassword.newPasswordPlaceholder' | transloco\"\n        name=\"password\"\n        type=\"password\"\n        class=\"change-password-form-field\"\n        [required]=\"true\"\n        autocomplete=\"off\"\n        formControlName=\"password\"\n      />\n\n      <form-input\n        [label]=\"'changePassword.confirmPasswordLabel' | transloco\"\n        [placeholder]=\"'changePassword.confirmPasswordPlaceholder' | transloco\"\n        name=\"confirm_password\"\n        type=\"password\"\n        class=\"change-password-form-field\"\n        [required]=\"true\"\n        autocomplete=\"off\"\n        formControlName=\"confirm_password\"\n      />\n\n      <div class=\"change-password-form-actions\">\n        <app-button\n          variant=\"tertiary\"\n          [text]=\"'changePassword.cancel' | transloco\"\n          (click)=\"onCloseModal()\"\n          size=\"sm\"\n        />\n\n        <app-button\n          [disabled]=\"loading() || changePasswordForm.invalid || changePasswordForm.pristine\"\n          [loading]=\"loading()\"\n          type=\"submit\"\n          variant=\"primary\"\n          [text]=\"'changePassword.save' | transloco\"\n          [loadingText]=\"'changePassword.saving' | transloco\"\n          size=\"sm\"\n        />\n      </div>\n    </form>\n  </app-modal>\n}\n", styles: [".change-password-form-body{display:flex;flex-direction:column;gap:1rem}.change-password-form-field{flex:1}.change-password-form-actions{display:flex;gap:.75rem}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i1$2.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i1$2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$2.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i1$2.RequiredValidator, selector: ":not([type=checkbox])[required][formControlName],:not([type=checkbox])[required][formControl],:not([type=checkbox])[required][ngModel]", inputs: ["required"] }, { kind: "directive", type: i1$2.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i1$2.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "ngmodule", type: TranslocoModule }, { kind: "component", type: AppButtonComponent, selector: "app-button", inputs: ["disabled", "loading", "type", "variant", "text", "size", "loadingText", "icon", "tooltip"], outputs: ["clicked"] }, { kind: "component", type: FormInputComponent, selector: "form-input", inputs: ["label", "type", "name", "id", "placeholder", "required", "readonly", "maxlength", "minlength", "max", "min", "step", "pattern", "fieldGroupClass", "autocomplete"] }, { kind: "component", type: AppModalComponent, selector: "app-modal", inputs: ["title", "disableClose", "showHeader", "showCloseButton", "showTitle", "interactiveClose", "isOpen", "size"], outputs: ["closeModal"] }, { kind: "pipe", type: i1$3.TranslocoPipe, name: "transloco" }], encapsulation: i0.ViewEncapsulation.None });
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.25", ngImport: i0, type: ChangePasswordFormComponent, deps: [{ token: i1$2.FormBuilder }, { token: ChangePasswordFormService }, { token: CustomerService }, { token: AdminService }, { token: ToastService }, { token: i2.TranslocoService }], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.25", type: ChangePasswordFormComponent, isStandalone: true, selector: "change-password-form", providers: [AdminService, CustomerService], ngImport: i0, template: "@if (isOpen()) {\n  <app-modal\n    [title]=\"'changePassword.title' | transloco\"\n    [isOpen]=\"isOpen\"\n    (closeModal)=\"onCloseModal()\"\n  >\n    <form\n      [formGroup]=\"changePasswordForm\"\n      method=\"POST\"\n      class=\"change-password-form-body\"\n      (ngSubmit)=\"onConfirmDelete()\"\n    >\n      <form-input\n        [label]=\"'changePassword.newPasswordLabel' | transloco\"\n        [placeholder]=\"'changePassword.newPasswordPlaceholder' | transloco\"\n        name=\"password\"\n        type=\"password\"\n        class=\"change-password-form-field\"\n        [required]=\"true\"\n        autocomplete=\"off\"\n        formControlName=\"password\"\n      />\n\n      <form-input\n        [label]=\"'changePassword.confirmPasswordLabel' | transloco\"\n        [placeholder]=\"'changePassword.confirmPasswordPlaceholder' | transloco\"\n        name=\"confirm_password\"\n        type=\"password\"\n        class=\"change-password-form-field\"\n        [required]=\"true\"\n        autocomplete=\"off\"\n        formControlName=\"confirm_password\"\n      />\n\n      <div class=\"change-password-form-actions\">\n        <app-button\n          variant=\"tertiary\"\n          [text]=\"'changePassword.cancel' | transloco\"\n          (click)=\"onCloseModal()\"\n          size=\"sm\"\n        />\n\n        <app-button\n          [disabled]=\"loading() || changePasswordForm.invalid || changePasswordForm.pristine\"\n          [loading]=\"loading()\"\n          type=\"submit\"\n          variant=\"primary\"\n          [text]=\"'changePassword.save' | transloco\"\n          [loadingText]=\"'changePassword.saving' | transloco\"\n          size=\"sm\"\n        />\n      </div>\n    </form>\n  </app-modal>\n}\n", styles: [".change-password-form-body{display:flex;flex-direction:column;gap:1rem}.change-password-form-field{flex:1}.change-password-form-actions{display:flex;gap:.75rem}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i1$2.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i1$2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$2.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i1$2.RequiredValidator, selector: ":not([type=checkbox])[required][formControlName],:not([type=checkbox])[required][formControl],:not([type=checkbox])[required][ngModel]", inputs: ["required"] }, { kind: "directive", type: i1$2.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i1$2.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "ngmodule", type: TranslocoModule }, { kind: "component", type: AppButtonComponent, selector: "app-button", inputs: ["disabled", "loading", "type", "variant", "text", "size", "loadingText", "icon", "tooltip"], outputs: ["clicked"] }, { kind: "component", type: FormInputComponent, selector: "form-input", inputs: ["label", "type", "name", "id", "placeholder", "required", "readonly", "maxlength", "minlength", "max", "min", "step", "pattern", "fieldGroupClass", "autocomplete"] }, { kind: "component", type: AppModalComponent, selector: "app-modal", inputs: ["title", "disableClose", "showHeader", "showCloseButton", "showTitle", "interactiveClose", "isOpen", "size"], outputs: ["closeModal"] }, { kind: "pipe", type: i2.TranslocoPipe, name: "transloco" }], encapsulation: i0.ViewEncapsulation.None });
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.25", ngImport: i0, type: ChangePasswordFormComponent, decorators: [{
             type: Component,
@@ -7912,7 +8092,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.25", ngImpo
                         FormInputComponent,
                         AppModalComponent,
                     ], providers: [AdminService, CustomerService], encapsulation: ViewEncapsulation.None, template: "@if (isOpen()) {\n  <app-modal\n    [title]=\"'changePassword.title' | transloco\"\n    [isOpen]=\"isOpen\"\n    (closeModal)=\"onCloseModal()\"\n  >\n    <form\n      [formGroup]=\"changePasswordForm\"\n      method=\"POST\"\n      class=\"change-password-form-body\"\n      (ngSubmit)=\"onConfirmDelete()\"\n    >\n      <form-input\n        [label]=\"'changePassword.newPasswordLabel' | transloco\"\n        [placeholder]=\"'changePassword.newPasswordPlaceholder' | transloco\"\n        name=\"password\"\n        type=\"password\"\n        class=\"change-password-form-field\"\n        [required]=\"true\"\n        autocomplete=\"off\"\n        formControlName=\"password\"\n      />\n\n      <form-input\n        [label]=\"'changePassword.confirmPasswordLabel' | transloco\"\n        [placeholder]=\"'changePassword.confirmPasswordPlaceholder' | transloco\"\n        name=\"confirm_password\"\n        type=\"password\"\n        class=\"change-password-form-field\"\n        [required]=\"true\"\n        autocomplete=\"off\"\n        formControlName=\"confirm_password\"\n      />\n\n      <div class=\"change-password-form-actions\">\n        <app-button\n          variant=\"tertiary\"\n          [text]=\"'changePassword.cancel' | transloco\"\n          (click)=\"onCloseModal()\"\n          size=\"sm\"\n        />\n\n        <app-button\n          [disabled]=\"loading() || changePasswordForm.invalid || changePasswordForm.pristine\"\n          [loading]=\"loading()\"\n          type=\"submit\"\n          variant=\"primary\"\n          [text]=\"'changePassword.save' | transloco\"\n          [loadingText]=\"'changePassword.saving' | transloco\"\n          size=\"sm\"\n        />\n      </div>\n    </form>\n  </app-modal>\n}\n", styles: [".change-password-form-body{display:flex;flex-direction:column;gap:1rem}.change-password-form-field{flex:1}.change-password-form-actions{display:flex;gap:.75rem}\n"] }]
-        }], ctorParameters: () => [{ type: i1$2.FormBuilder }, { type: ChangePasswordFormService }, { type: CustomerService }, { type: AdminService }, { type: ToastService }, { type: i1$3.TranslocoService }] });
+        }], ctorParameters: () => [{ type: i1$2.FormBuilder }, { type: ChangePasswordFormService }, { type: CustomerService }, { type: AdminService }, { type: ToastService }, { type: i2.TranslocoService }] });
 
 class AdminSelectComponent {
     platformId;
@@ -9427,7 +9607,7 @@ class PerformanceTicketStatusBadgeComponent {
         return PERFORMANCE_TICKET_STATUS_COLORS[this.ticket.status];
     }
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.25", ngImport: i0, type: PerformanceTicketStatusBadgeComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.3.25", type: PerformanceTicketStatusBadgeComponent, isStandalone: true, selector: "performance-ticket-status-badge", inputs: { ticket: "ticket", size: "size" }, ngImport: i0, template: "<app-badge\n  [text]=\"`performance.ticketStatus.${ticket.status}` | transloco\"\n  [backgroundColor]=\"statusColors.bg\"\n  [textColor]=\"statusColors.text\"\n  [size]=\"size\"\n/>\n", dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "ngmodule", type: TranslocoModule }, { kind: "component", type: AppBadgeComponent, selector: "app-badge", inputs: ["text", "color", "size", "bordered", "backgroundColor", "textColor"] }, { kind: "pipe", type: i1$3.TranslocoPipe, name: "transloco" }] });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.3.25", type: PerformanceTicketStatusBadgeComponent, isStandalone: true, selector: "performance-ticket-status-badge", inputs: { ticket: "ticket", size: "size" }, ngImport: i0, template: "<app-badge\n  [text]=\"`performance.ticketStatus.${ticket.status}` | transloco\"\n  [backgroundColor]=\"statusColors.bg\"\n  [textColor]=\"statusColors.text\"\n  [size]=\"size\"\n/>\n", dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "ngmodule", type: TranslocoModule }, { kind: "component", type: AppBadgeComponent, selector: "app-badge", inputs: ["text", "color", "size", "bordered", "backgroundColor", "textColor"] }, { kind: "pipe", type: i2.TranslocoPipe, name: "transloco" }] });
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.25", ngImport: i0, type: PerformanceTicketStatusBadgeComponent, decorators: [{
             type: Component,
@@ -9446,7 +9626,7 @@ class PerformanceStatusBadgeComponent {
         return PERFORMANCE_STATUS_COLORS[this.performance.status];
     }
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.25", ngImport: i0, type: PerformanceStatusBadgeComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.3.25", type: PerformanceStatusBadgeComponent, isStandalone: true, selector: "performance-status-badge", inputs: { performance: "performance", size: "size" }, ngImport: i0, template: "<app-badge\n  [text]=\"`performance.status.${performance.status}` | transloco\"\n  [backgroundColor]=\"statusColors.bg\"\n  [textColor]=\"statusColors.text\"\n  [size]=\"size\"\n/>\n", dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "ngmodule", type: TranslocoModule }, { kind: "component", type: AppBadgeComponent, selector: "app-badge", inputs: ["text", "color", "size", "bordered", "backgroundColor", "textColor"] }, { kind: "pipe", type: i1$3.TranslocoPipe, name: "transloco" }] });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.3.25", type: PerformanceStatusBadgeComponent, isStandalone: true, selector: "performance-status-badge", inputs: { performance: "performance", size: "size" }, ngImport: i0, template: "<app-badge\n  [text]=\"`performance.status.${performance.status}` | transloco\"\n  [backgroundColor]=\"statusColors.bg\"\n  [textColor]=\"statusColors.text\"\n  [size]=\"size\"\n/>\n", dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "ngmodule", type: TranslocoModule }, { kind: "component", type: AppBadgeComponent, selector: "app-badge", inputs: ["text", "color", "size", "bordered", "backgroundColor", "textColor"] }, { kind: "pipe", type: i2.TranslocoPipe, name: "transloco" }] });
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.25", ngImport: i0, type: PerformanceStatusBadgeComponent, decorators: [{
             type: Component,
@@ -9716,7 +9896,7 @@ class ShowsFilterComponent {
         this.listEventService.setSelectedDay(null);
         this.listEventService.setSelectedPerformance(null);
     }
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.25", ngImport: i0, type: ShowsFilterComponent, deps: [{ token: PLATFORM_ID }, { token: ShowService }, { token: PerformancesListEventsService }, { token: ToastService }, { token: i3$1.Router }], target: i0.ɵɵFactoryTarget.Component });
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.25", ngImport: i0, type: ShowsFilterComponent, deps: [{ token: PLATFORM_ID }, { token: ShowService }, { token: PerformancesListEventsService }, { token: ToastService }, { token: i1$3.Router }], target: i0.ɵɵFactoryTarget.Component });
     static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.25", type: ShowsFilterComponent, isStandalone: true, selector: "shows-filter", ngImport: i0, template: "<div class=\"shows-filter\">\n  <p class=\"shows-filter-heading\">Filtrar por evento</p>\n\n  @if (loadingData()) {\n    @for (i of [1, 2, 3]; track $index) {\n      <div class=\"shows-filter-skeleton\"></div>\n    }\n  }\n\n  @if (!loadingData() && shows().length < 1) {\n    <app-alert text=\"No hay shows disponibles para filtrar\" size=\"xs\" type=\"error\" />\n  }\n\n  @for (show of shows(); track $index) {\n    <div class=\"shows-filter-item\" [class.shows-filter-item--active]=\"isActive(show.id)\">\n      <div class=\"shows-filter-item-info\">\n        <span class=\"shows-filter-item-image\">\n          @if (show.images.length > 0) {\n            <img [src]=\"show.images[0].full_url\" class=\"shows-filter-item-image-img\" />\n          } @else {\n            <span class=\"shows-filter-item-image-placeholder\"></span>\n          }\n        </span>\n\n        <div>\n          <div class=\"shows-filter-item-title\">{{ show.title }}</div>\n          @if (show.performances_quantity && show.performances_quantity > 0) {\n            <div class=\"shows-filter-item-count\">{{ show.performances_quantity }} funciones</div>\n          }\n        </div>\n      </div>\n\n      <div class=\"shows-filter-item-actions\">\n        @if (isActive(show.id)) {\n          <app-button\n            variant=\"tertiary\"\n            icon=\"ri-close-line\"\n            size=\"xs\"\n            (clicked)=\"onFilter(show)\"\n          />\n        } @else {\n          <app-button variant=\"primary\" text=\"Filtrar\" size=\"xs\" (clicked)=\"onFilter(show)\" />\n        }\n      </div>\n    </div>\n  }\n</div>\n", styles: [".shows-filter{display:flex;flex-direction:column;gap:.5rem;width:100%}.shows-filter-heading{font-size:11px;font-weight:600;letter-spacing:.25em;color:#737373;text-transform:uppercase}.shows-filter-skeleton{height:3.75rem;width:100%;border-radius:.5rem;border:1px solid #171717;background-color:#404040;animation:shows-filter-pulse 2s cubic-bezier(.4,0,.6,1) infinite}.shows-filter-item{display:flex;align-items:center;background-color:#171717;border-radius:.5rem;border:1px solid #404040;justify-content:space-between;padding:.75rem;width:100%}.shows-filter-item--active{box-shadow:0 0 0 1px #ef444480,0 0 16px #ef444459}.shows-filter-item-info{display:flex;align-items:center;gap:.75rem}.shows-filter-item-image{height:2.5rem;width:2.5rem;border-radius:.125rem;overflow:hidden}.shows-filter-item-image-img{object-fit:contain;object-position:center;max-height:100%;max-width:100%;margin-left:auto;margin-right:auto}.shows-filter-item-image-placeholder{display:flex;background-color:#e5e5e5;height:100%;width:100%}.shows-filter-item-title{font-size:.875rem;font-weight:600;color:#d4d4d4}.shows-filter-item-count{font-size:11px;color:#737373}.shows-filter-item-actions{font-size:.875rem;font-weight:700;color:#737373}\n"], dependencies: [{ kind: "component", type: AppButtonComponent, selector: "app-button", inputs: ["disabled", "loading", "type", "variant", "text", "size", "loadingText", "icon", "tooltip"], outputs: ["clicked"] }, { kind: "ngmodule", type: CommonModule }, { kind: "component", type: AppAlertComponent, selector: "app-alert", inputs: ["type", "text", "closeable", "size"] }] });
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.25", ngImport: i0, type: ShowsFilterComponent, decorators: [{
@@ -9725,7 +9905,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.25", ngImpo
         }], ctorParameters: () => [{ type: undefined, decorators: [{
                     type: Inject,
                     args: [PLATFORM_ID]
-                }] }, { type: ShowService }, { type: PerformancesListEventsService }, { type: ToastService }, { type: i3$1.Router }] });
+                }] }, { type: ShowService }, { type: PerformancesListEventsService }, { type: ToastService }, { type: i1$3.Router }] });
 
 class ZonePriceItemComponent {
     zone;
@@ -10228,7 +10408,7 @@ class TicketMapTotalsComponent {
     get selectedTicketIds() {
         return this.selectionService.selectedTicketIdList();
     }
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.25", ngImport: i0, type: TicketMapTotalsComponent, deps: [{ token: PerformanceBookingDataService }, { token: TicketSelectionDetailsService }, { token: TicketSelectionDiscountService }, { token: TicketSelectionTotalsService }, { token: TicketSelectionService }, { token: i3$1.ActivatedRoute }], target: i0.ɵɵFactoryTarget.Component });
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.25", ngImport: i0, type: TicketMapTotalsComponent, deps: [{ token: PerformanceBookingDataService }, { token: TicketSelectionDetailsService }, { token: TicketSelectionDiscountService }, { token: TicketSelectionTotalsService }, { token: TicketSelectionService }, { token: i1$3.ActivatedRoute }], target: i0.ɵɵFactoryTarget.Component });
     static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.25", type: TicketMapTotalsComponent, isStandalone: true, selector: "ticket-map-totals", inputs: { title: "title", buttonText: "buttonText", loadingButtonText: "loadingButtonText", isLoading: "isLoading" }, outputs: { onPurchaseClick: "onPurchaseClick" }, ngImport: i0, template: "<ticket-map-widget class=\"w-full\">\n  <ticket-map-widget-header [title]=\"title\" />\n\n  <div class=\"ticket-map-totals\">\n    <p class=\"ticket-map-totals__item\">\n      <span>Entradas ({{ selectionService.selectedCount() | number: '1.0-2' }}):</span>\n      <span> ${{ selectionTotalsService.ticketSubtotal() | number: '1.0-2' }} </span>\n    </p>\n\n    @if (selectionService.selectedProductCount() > 0) {\n      <p class=\"ticket-map-totals__item\">\n        <span>Productos ({{ selectionService.selectedProductCount() | number: '1.0-2' }}):</span>\n        <span>${{ selectionTotalsService.productSubtotal() | number: '1.0-2' }}</span>\n      </p>\n    }\n\n    @if (serviceFee > 0) {\n      <p class=\"ticket-map-totals__item\">\n        <span>Tarifa de servicio:</span>\n        <span>${{ bookingDataService.show()?.service_fee ?? '0' | number: '1.0-2' }}</span>\n      </p>\n    }\n\n    @if (!!selectionDiscountService.coupon() && selectionTotalsService.discountAmount()) {\n      <p class=\"ticket-map-totals__item\">\n        <span>Cup\u00F3n de descuento:</span>\n        <span class=\"line-through\">\n          -${{ selectionTotalsService.discountAmount() | number: '1.0-2' }}\n          @if (selectionDiscountService.selectedDiscount()?.discountType === 'percentage') {\n            ({{ selectionDiscountService.coupon()?.discount_value }}%)\n          }\n        </span>\n      </p>\n    }\n\n    @if (!!selectionDiscountService.corporateBond()) {\n      <p class=\"ticket-map-totals__item\">\n        <span>Bono corporativo:</span>\n        <span class=\"line-through\">\n          ${{ selectionDiscountService.corporateBond()?.value ?? '0' | number: '1.0-2' }}\n        </span>\n      </p>\n    }\n\n    @if (!!selectionDiscountService.giftBond()) {\n      <p class=\"ticket-map-totals__item\">\n        <span>Bono de regalo:</span>\n        <span class=\"line-through\">\n          ${{ selectionDiscountService.giftBond()?.original_value ?? '0' | number: '1.0-2' }}\n        </span>\n      </p>\n    }\n\n    @if (!!selectionDiscountService.vipCard() && selectionTotalsService.discountAmount()) {\n      <p class=\"ticket-map-totals__item\">\n        <span>Tarjeta VIP:</span>\n        <span class=\"line-through\">\n          -${{ selectionTotalsService.discountAmount() | number: '1.0-2' }} ({{\n            selectionDiscountService.vipCard()?.category_snapshot?.discount_percentage\n          }}%)\n        </span>\n      </p>\n    }\n\n    <hr class=\"ticket-map-totals__divider\" />\n\n    <div class=\"ticket-map-totals__calculated\">\n      <span class=\"ticket-map-totals__calculated-title\">Total:</span>\n\n      @if (\n        selectionTotalsService.totalDiscounted() || selectionTotalsService.totalDiscounted() === 0\n      ) {\n        <span class=\"ticket-map-totals__calculated-inline\">\n          <span class=\"ticket-map-totals__calculated-discount\">\n            ${{ selectionTotalsService.totalValue() | currency: 'COP' : 'symbol' : '1.0-2' }}\n          </span>\n          <span class=\"ticket-map-totals__calculated-total\">\n            ${{ selectionTotalsService.totalDiscounted() | currency: 'COP' : 'symbol' : '1.0-2' }}\n          </span>\n        </span>\n      } @else {\n        <span class=\"ticket-map-totals__calculated-total\">\n          ${{ selectionTotalsService.totalValue() | number: '1.0-2' }}\n        </span>\n      }\n    </div>\n\n    @if (selectionService.selectedCount() > 0 || selectionService.selectedProductCount() > 0) {\n      <div class=\"flex flex-col gap-2\">\n        <app-button\n          (click)=\"onPurchaseClick.emit()\"\n          size=\"sm\"\n          icon=\"ri-dashboard-3-line\"\n          [text]=\"buttonText\"\n          [loadingText]=\"loadingButtonText\"\n          [loading]=\"isLoading\"\n          variant=\"primary\"\n        />\n      </div>\n    }\n  </div>\n</ticket-map-widget>\n", styles: [".ticket-map-totals{display:flex;flex-direction:column;gap:.5rem;margin-top:.5rem;width:100%}.ticket-map-totals__item{align-items:center;color:#9ca3af;display:flex;flex-direction:row;font-size:.75rem;justify-content:space-between;margin:0}.ticket-map-totals__divider{border:none;border-top:1px solid #e5e7eb;width:100%}.ticket-map-totals__calculated{display:flex;flex-direction:row;align-items:center;justify-content:space-between;margin:0}.ticket-map-totals__calculated-title{color:#4b5563;font-size:1rem;font-weight:700}.ticket-map-totals__calculated-inline{display:flex;flex-direction:column;align-items:flex-end}.ticket-map-totals__calculated-discount{color:#9ca3af;font-size:.75rem;text-decoration:line-through}.ticket-map-totals__calculated-total{color:#4b5563;font-size:1rem;font-weight:700}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "component", type: AppButtonComponent, selector: "app-button", inputs: ["disabled", "loading", "type", "variant", "text", "size", "loadingText", "icon", "tooltip"], outputs: ["clicked"] }, { kind: "component", type: TicketMapWidgetHeaderComponent, selector: "ticket-map-widget-header", inputs: ["title", "subtitle"] }, { kind: "component", type: TicketMapWidgetComponent, selector: "ticket-map-widget" }, { kind: "pipe", type: i1$1.DecimalPipe, name: "number" }, { kind: "pipe", type: i1$1.CurrencyPipe, name: "currency" }] });
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.25", ngImport: i0, type: TicketMapTotalsComponent, decorators: [{
@@ -10239,7 +10419,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.25", ngImpo
                         TicketMapWidgetHeaderComponent,
                         TicketMapWidgetComponent,
                     ], template: "<ticket-map-widget class=\"w-full\">\n  <ticket-map-widget-header [title]=\"title\" />\n\n  <div class=\"ticket-map-totals\">\n    <p class=\"ticket-map-totals__item\">\n      <span>Entradas ({{ selectionService.selectedCount() | number: '1.0-2' }}):</span>\n      <span> ${{ selectionTotalsService.ticketSubtotal() | number: '1.0-2' }} </span>\n    </p>\n\n    @if (selectionService.selectedProductCount() > 0) {\n      <p class=\"ticket-map-totals__item\">\n        <span>Productos ({{ selectionService.selectedProductCount() | number: '1.0-2' }}):</span>\n        <span>${{ selectionTotalsService.productSubtotal() | number: '1.0-2' }}</span>\n      </p>\n    }\n\n    @if (serviceFee > 0) {\n      <p class=\"ticket-map-totals__item\">\n        <span>Tarifa de servicio:</span>\n        <span>${{ bookingDataService.show()?.service_fee ?? '0' | number: '1.0-2' }}</span>\n      </p>\n    }\n\n    @if (!!selectionDiscountService.coupon() && selectionTotalsService.discountAmount()) {\n      <p class=\"ticket-map-totals__item\">\n        <span>Cup\u00F3n de descuento:</span>\n        <span class=\"line-through\">\n          -${{ selectionTotalsService.discountAmount() | number: '1.0-2' }}\n          @if (selectionDiscountService.selectedDiscount()?.discountType === 'percentage') {\n            ({{ selectionDiscountService.coupon()?.discount_value }}%)\n          }\n        </span>\n      </p>\n    }\n\n    @if (!!selectionDiscountService.corporateBond()) {\n      <p class=\"ticket-map-totals__item\">\n        <span>Bono corporativo:</span>\n        <span class=\"line-through\">\n          ${{ selectionDiscountService.corporateBond()?.value ?? '0' | number: '1.0-2' }}\n        </span>\n      </p>\n    }\n\n    @if (!!selectionDiscountService.giftBond()) {\n      <p class=\"ticket-map-totals__item\">\n        <span>Bono de regalo:</span>\n        <span class=\"line-through\">\n          ${{ selectionDiscountService.giftBond()?.original_value ?? '0' | number: '1.0-2' }}\n        </span>\n      </p>\n    }\n\n    @if (!!selectionDiscountService.vipCard() && selectionTotalsService.discountAmount()) {\n      <p class=\"ticket-map-totals__item\">\n        <span>Tarjeta VIP:</span>\n        <span class=\"line-through\">\n          -${{ selectionTotalsService.discountAmount() | number: '1.0-2' }} ({{\n            selectionDiscountService.vipCard()?.category_snapshot?.discount_percentage\n          }}%)\n        </span>\n      </p>\n    }\n\n    <hr class=\"ticket-map-totals__divider\" />\n\n    <div class=\"ticket-map-totals__calculated\">\n      <span class=\"ticket-map-totals__calculated-title\">Total:</span>\n\n      @if (\n        selectionTotalsService.totalDiscounted() || selectionTotalsService.totalDiscounted() === 0\n      ) {\n        <span class=\"ticket-map-totals__calculated-inline\">\n          <span class=\"ticket-map-totals__calculated-discount\">\n            ${{ selectionTotalsService.totalValue() | currency: 'COP' : 'symbol' : '1.0-2' }}\n          </span>\n          <span class=\"ticket-map-totals__calculated-total\">\n            ${{ selectionTotalsService.totalDiscounted() | currency: 'COP' : 'symbol' : '1.0-2' }}\n          </span>\n        </span>\n      } @else {\n        <span class=\"ticket-map-totals__calculated-total\">\n          ${{ selectionTotalsService.totalValue() | number: '1.0-2' }}\n        </span>\n      }\n    </div>\n\n    @if (selectionService.selectedCount() > 0 || selectionService.selectedProductCount() > 0) {\n      <div class=\"flex flex-col gap-2\">\n        <app-button\n          (click)=\"onPurchaseClick.emit()\"\n          size=\"sm\"\n          icon=\"ri-dashboard-3-line\"\n          [text]=\"buttonText\"\n          [loadingText]=\"loadingButtonText\"\n          [loading]=\"isLoading\"\n          variant=\"primary\"\n        />\n      </div>\n    }\n  </div>\n</ticket-map-widget>\n", styles: [".ticket-map-totals{display:flex;flex-direction:column;gap:.5rem;margin-top:.5rem;width:100%}.ticket-map-totals__item{align-items:center;color:#9ca3af;display:flex;flex-direction:row;font-size:.75rem;justify-content:space-between;margin:0}.ticket-map-totals__divider{border:none;border-top:1px solid #e5e7eb;width:100%}.ticket-map-totals__calculated{display:flex;flex-direction:row;align-items:center;justify-content:space-between;margin:0}.ticket-map-totals__calculated-title{color:#4b5563;font-size:1rem;font-weight:700}.ticket-map-totals__calculated-inline{display:flex;flex-direction:column;align-items:flex-end}.ticket-map-totals__calculated-discount{color:#9ca3af;font-size:.75rem;text-decoration:line-through}.ticket-map-totals__calculated-total{color:#4b5563;font-size:1rem;font-weight:700}\n"] }]
-        }], ctorParameters: () => [{ type: PerformanceBookingDataService }, { type: TicketSelectionDetailsService }, { type: TicketSelectionDiscountService }, { type: TicketSelectionTotalsService }, { type: TicketSelectionService }, { type: i3$1.ActivatedRoute }], propDecorators: { title: [{
+        }], ctorParameters: () => [{ type: PerformanceBookingDataService }, { type: TicketSelectionDetailsService }, { type: TicketSelectionDiscountService }, { type: TicketSelectionTotalsService }, { type: TicketSelectionService }, { type: i1$3.ActivatedRoute }], propDecorators: { title: [{
                 type: Input
             }], buttonText: [{
                 type: Input
@@ -10510,13 +10690,13 @@ class OrderStatusBadgeComponent {
     get statusColors() {
         return ORDER_STATUS_COLORS[this.order.status] ?? null;
     }
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.25", ngImport: i0, type: OrderStatusBadgeComponent, deps: [{ token: i1$3.TranslocoService }], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.3.25", type: OrderStatusBadgeComponent, isStandalone: true, selector: "order-status-badge", inputs: { order: "order", size: "size" }, ngImport: i0, template: "<app-badge\n  [text]=\"`order.status.${order.status}` | transloco\"\n  [backgroundColor]=\"statusColors.bg\"\n  [textColor]=\"statusColors.text\"\n  [size]=\"size\"\n/>\n", dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "ngmodule", type: TranslocoModule }, { kind: "component", type: AppBadgeComponent, selector: "app-badge", inputs: ["text", "color", "size", "bordered", "backgroundColor", "textColor"] }, { kind: "pipe", type: i1$3.TranslocoPipe, name: "transloco" }] });
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.25", ngImport: i0, type: OrderStatusBadgeComponent, deps: [{ token: i2.TranslocoService }], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.3.25", type: OrderStatusBadgeComponent, isStandalone: true, selector: "order-status-badge", inputs: { order: "order", size: "size" }, ngImport: i0, template: "<app-badge\n  [text]=\"`order.status.${order.status}` | transloco\"\n  [backgroundColor]=\"statusColors.bg\"\n  [textColor]=\"statusColors.text\"\n  [size]=\"size\"\n/>\n", dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "ngmodule", type: TranslocoModule }, { kind: "component", type: AppBadgeComponent, selector: "app-badge", inputs: ["text", "color", "size", "bordered", "backgroundColor", "textColor"] }, { kind: "pipe", type: i2.TranslocoPipe, name: "transloco" }] });
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.25", ngImport: i0, type: OrderStatusBadgeComponent, decorators: [{
             type: Component,
             args: [{ selector: 'order-status-badge', standalone: true, imports: [CommonModule, TranslocoModule, AppBadgeComponent], template: "<app-badge\n  [text]=\"`order.status.${order.status}` | transloco\"\n  [backgroundColor]=\"statusColors.bg\"\n  [textColor]=\"statusColors.text\"\n  [size]=\"size\"\n/>\n" }]
-        }], ctorParameters: () => [{ type: i1$3.TranslocoService }], propDecorators: { order: [{
+        }], ctorParameters: () => [{ type: i2.TranslocoService }], propDecorators: { order: [{
                 type: Input,
                 args: [{ required: true }]
             }], size: [{
@@ -10560,8 +10740,8 @@ class OrderInformationComponent {
             },
         });
     }
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.25", ngImport: i0, type: OrderInformationComponent, deps: [{ token: i1$3.TranslocoService }, { token: ToastService }], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.25", type: OrderInformationComponent, isStandalone: true, selector: "order-information", inputs: { order: "order", showPayButton: "showPayButton", createMpPreference: "createMpPreference" }, outputs: { paymentLinkCreated: "paymentLinkCreated" }, ngImport: i0, template: "@if (!!order) {\n  <div class=\"order-information\">\n    <div class=\"order-information__header\">\n      <div>\n        <p class=\"order-information__header-id\">Orden #{{ order.id }}</p>\n        <p class=\"order-information__header-uuid\">{{ order.uuid }}</p>\n      </div>\n\n      <div class=\"order-information__header-actions\">\n        <order-status-badge [order]=\"order\" size=\"xs\" />\n\n        @if (showMpButton) {\n          <app-button\n            [text]=\"'order.mpPayButton' | transloco\"\n            [loadingText]=\"'order.mpPayButtonLoading' | transloco\"\n            [loading]=\"isLoading\"\n            variant=\"secondary\"\n            size=\"xs\"\n            icon=\"ri-wallet-3-line\"\n            (clicked)=\"payWithMercadoPago()\"\n          />\n        }\n      </div>\n    </div>\n\n    <div class=\"order-information__content\">\n      @if (order.show_snapshot && order.show_snapshot['title']) {\n        <div class=\"order-information__content-item\">\n          <p class=\"order-information__content-item-title\">Evento</p>\n          <p class=\"order-information__content-item-value\">\n            {{ order.show_snapshot['title'] }}\n          </p>\n        </div>\n      }\n\n      @if (order.performance_snapshot && order.performance_snapshot['start_time']) {\n        <div class=\"order-information__content-item\">\n          <p class=\"order-information__content-item-title\">Fecha de la funci\u00F3n</p>\n          <p class=\"order-information__content-item-value\">\n            {{ order.performance_snapshot['start_time'] | date: 'dd/MM/yyyy hh:mm a' }}\n          </p>\n        </div>\n      }\n\n      <div class=\"order-information__content-item\">\n        <p class=\"order-information__content-item-title\">Fecha de la compra</p>\n        <p class=\"order-information__content-item-value\">\n          {{ order.created_at | date: 'dd/MM/yyyy hh:mm a' }}\n        </p>\n      </div>\n\n      @if (order.payment_method) {\n        <div class=\"order-information__content-item\">\n          <p class=\"order-information__content-item-title\">M\u00E9todo de pago</p>\n          <p class=\"order-information__content-item-value\">\n            {{ `order.paymentMethods.${order.payment_method}` | transloco }}\n          </p>\n        </div>\n      }\n\n      @if (order.service_fee && order.service_fee > 0) {\n        <div class=\"order-information__content-item\">\n          <p class=\"order-information__content-item-title\">Tarifa de servicio</p>\n          <p class=\"order-information__content-item-value\">\n            ${{ order.service_fee | currency: 'COP' : '' : '1.0-2' }}\n          </p>\n        </div>\n      }\n\n      @if (!!order.discount_amount && order.discount_amount > 0) {\n        <div class=\"order-information__content-item\">\n          <p class=\"order-information__content-item-title\">Descuento</p>\n          <p class=\"order-information__content-item-value\">\n            ${{ order.discount_amount | currency: 'COP' : '' : '1.0-2' }}\n          </p>\n        </div>\n      }\n\n      <div class=\"order-information__content-item\">\n        <p class=\"order-information__content-item-title\">Total</p>\n        @if (order.total_discounted && order.total_discounted >= 0) {\n          <p class=\"order-information__content-item-total_discounted\">\n            <span class=\"discounted\">\n              ${{ order.total_discounted | currency: 'COP' : '' : '1.0-2' }}\n            </span>\n            <span class=\"order-information__content-item-value total\">\n              ${{ order.total | currency: 'COP' : '' : '1.0-2' }}\n            </span>\n          </p>\n        } @else {\n          <p class=\"order-information__content-item-value total\">\n            ${{ order.total | currency: 'COP' : '' : '1.0-2' }}\n          </p>\n        }\n      </div>\n\n      <div class=\"order-information__content-item\">\n        <p class=\"order-information__content-item-title\">T\u00E9rminos aceptados</p>\n        <app-badge\n          [text]=\"order.terms_accepted ? 'Aceptado' : 'No aceptado'\"\n          [backgroundColor]=\"order.terms_accepted ? '#dcfce7' : '#fee2e2'\"\n          [textColor]=\"order.terms_accepted ? '#16a34a' : '#dc2626'\"\n          size=\"xs\"\n        />\n      </div>\n\n      <div class=\"order-information__content-item\">\n        <p class=\"order-information__content-item-title\">Procesamiento de datos aceptado</p>\n        <app-badge\n          [text]=\"order.data_processing_accepted ? 'Aceptado' : 'No aceptado'\"\n          [backgroundColor]=\"order.data_processing_accepted ? '#dcfce7' : '#fee2e2'\"\n          [textColor]=\"order.data_processing_accepted ? '#16a34a' : '#dc2626'\"\n          size=\"xs\"\n        />\n      </div>\n\n      @if (order.comments) {\n        <div class=\"order-information__content-item\">\n          <p class=\"order-information__content-item-title\">Comentarios</p>\n          <p class=\"order-information__content-item-value\">{{ order.comments }}</p>\n        </div>\n      }\n\n      @if (order.address_notes) {\n        <div class=\"order-information__content-item\">\n          <p class=\"order-information__content-item-title\">Notas de direcci\u00F3n</p>\n          <p class=\"order-information__content-item-value\">{{ order.address_notes }}</p>\n        </div>\n      }\n    </div>\n  </div>\n}\n", styles: [".order-information{background-color:#fff;border-radius:.5rem;border:1px solid #f3f4f6;box-sizing:border-box;overflow:hidden;position:relative;width:100%}.order-information__header{align-items:center;border-bottom:1px solid #f3f4f6;display:flex;flex-flow:row wrap;gap:.75rem;justify-content:space-between;padding:1rem;width:100%}.order-information__header-id{color:#6b7280;font-size:.875rem;font-weight:700;margin:0}.order-information__header-uuid{color:#9ca3af;font-family:ui-monospace,SFMono-Regular,SF Mono,Menlo,Consolas,Liberation Mono,monospace;font-size:.75rem;margin:0;word-break:break-all}.order-information__header-actions{display:inline-flex;flex-flow:row wrap;gap:1rem}.order-information__content{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:1rem;padding:1rem}@media(min-width:768px){.order-information__content{grid-template-columns:repeat(3,minmax(0,1fr))}}.order-information__content-item{align-items:flex-start;display:flex;flex-flow:column nowrap;position:relative;width:100%}.order-information__content-item-title{color:#9ca3af;font-size:.75rem;margin:0;text-transform:uppercase}.order-information__content-item-value{color:#111827;font-weight:500;font-size:.875rem;margin:0}.order-information__content-item-value.total{font-weight:700}.order-information__content-item-total_discounted{display:flex;flex-flow:row nowrap;gap:.25rem;margin:0;width:100%}.order-information__content-item-total_discounted .discounted{color:#111827;font-size:.875rem;font-weight:700}.order-information__content-item-total_discounted .total{color:#9ca3af;margin:0;text-decoration:line-through}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "component", type: OrderStatusBadgeComponent, selector: "order-status-badge", inputs: ["order", "size"] }, { kind: "ngmodule", type: TranslocoModule }, { kind: "component", type: AppBadgeComponent, selector: "app-badge", inputs: ["text", "color", "size", "bordered", "backgroundColor", "textColor"] }, { kind: "component", type: AppButtonComponent, selector: "app-button", inputs: ["disabled", "loading", "type", "variant", "text", "size", "loadingText", "icon", "tooltip"], outputs: ["clicked"] }, { kind: "pipe", type: i1$1.CurrencyPipe, name: "currency" }, { kind: "pipe", type: i1$1.DatePipe, name: "date" }, { kind: "pipe", type: i1$3.TranslocoPipe, name: "transloco" }], encapsulation: i0.ViewEncapsulation.None });
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.25", ngImport: i0, type: OrderInformationComponent, deps: [{ token: i2.TranslocoService }, { token: ToastService }], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.25", type: OrderInformationComponent, isStandalone: true, selector: "order-information", inputs: { order: "order", showPayButton: "showPayButton", createMpPreference: "createMpPreference" }, outputs: { paymentLinkCreated: "paymentLinkCreated" }, ngImport: i0, template: "@if (!!order) {\n  <div class=\"order-information\">\n    <div class=\"order-information__header\">\n      <div>\n        <p class=\"order-information__header-id\">Orden #{{ order.id }}</p>\n        <p class=\"order-information__header-uuid\">{{ order.uuid }}</p>\n      </div>\n\n      <div class=\"order-information__header-actions\">\n        <order-status-badge [order]=\"order\" size=\"xs\" />\n\n        @if (showMpButton) {\n          <app-button\n            [text]=\"'order.mpPayButton' | transloco\"\n            [loadingText]=\"'order.mpPayButtonLoading' | transloco\"\n            [loading]=\"isLoading\"\n            variant=\"secondary\"\n            size=\"xs\"\n            icon=\"ri-wallet-3-line\"\n            (clicked)=\"payWithMercadoPago()\"\n          />\n        }\n      </div>\n    </div>\n\n    <div class=\"order-information__content\">\n      @if (order.show_snapshot && order.show_snapshot['title']) {\n        <div class=\"order-information__content-item\">\n          <p class=\"order-information__content-item-title\">Evento</p>\n          <p class=\"order-information__content-item-value\">\n            {{ order.show_snapshot['title'] }}\n          </p>\n        </div>\n      }\n\n      @if (order.performance_snapshot && order.performance_snapshot['start_time']) {\n        <div class=\"order-information__content-item\">\n          <p class=\"order-information__content-item-title\">Fecha de la funci\u00F3n</p>\n          <p class=\"order-information__content-item-value\">\n            {{ order.performance_snapshot['start_time'] | date: 'dd/MM/yyyy hh:mm a' }}\n          </p>\n        </div>\n      }\n\n      <div class=\"order-information__content-item\">\n        <p class=\"order-information__content-item-title\">Fecha de la compra</p>\n        <p class=\"order-information__content-item-value\">\n          {{ order.created_at | date: 'dd/MM/yyyy hh:mm a' }}\n        </p>\n      </div>\n\n      @if (order.payment_method) {\n        <div class=\"order-information__content-item\">\n          <p class=\"order-information__content-item-title\">M\u00E9todo de pago</p>\n          <p class=\"order-information__content-item-value\">\n            {{ `order.paymentMethods.${order.payment_method}` | transloco }}\n          </p>\n        </div>\n      }\n\n      @if (order.service_fee && order.service_fee > 0) {\n        <div class=\"order-information__content-item\">\n          <p class=\"order-information__content-item-title\">Tarifa de servicio</p>\n          <p class=\"order-information__content-item-value\">\n            ${{ order.service_fee | currency: 'COP' : '' : '1.0-2' }}\n          </p>\n        </div>\n      }\n\n      @if (!!order.discount_amount && order.discount_amount > 0) {\n        <div class=\"order-information__content-item\">\n          <p class=\"order-information__content-item-title\">Descuento</p>\n          <p class=\"order-information__content-item-value\">\n            ${{ order.discount_amount | currency: 'COP' : '' : '1.0-2' }}\n          </p>\n        </div>\n      }\n\n      <div class=\"order-information__content-item\">\n        <p class=\"order-information__content-item-title\">Total</p>\n        @if (order.total_discounted && order.total_discounted >= 0) {\n          <p class=\"order-information__content-item-total_discounted\">\n            <span class=\"discounted\">\n              ${{ order.total_discounted | currency: 'COP' : '' : '1.0-2' }}\n            </span>\n            <span class=\"order-information__content-item-value total\">\n              ${{ order.total | currency: 'COP' : '' : '1.0-2' }}\n            </span>\n          </p>\n        } @else {\n          <p class=\"order-information__content-item-value total\">\n            ${{ order.total | currency: 'COP' : '' : '1.0-2' }}\n          </p>\n        }\n      </div>\n\n      <div class=\"order-information__content-item\">\n        <p class=\"order-information__content-item-title\">T\u00E9rminos aceptados</p>\n        <app-badge\n          [text]=\"order.terms_accepted ? 'Aceptado' : 'No aceptado'\"\n          [backgroundColor]=\"order.terms_accepted ? '#dcfce7' : '#fee2e2'\"\n          [textColor]=\"order.terms_accepted ? '#16a34a' : '#dc2626'\"\n          size=\"xs\"\n        />\n      </div>\n\n      <div class=\"order-information__content-item\">\n        <p class=\"order-information__content-item-title\">Procesamiento de datos aceptado</p>\n        <app-badge\n          [text]=\"order.data_processing_accepted ? 'Aceptado' : 'No aceptado'\"\n          [backgroundColor]=\"order.data_processing_accepted ? '#dcfce7' : '#fee2e2'\"\n          [textColor]=\"order.data_processing_accepted ? '#16a34a' : '#dc2626'\"\n          size=\"xs\"\n        />\n      </div>\n\n      @if (order.comments) {\n        <div class=\"order-information__content-item\">\n          <p class=\"order-information__content-item-title\">Comentarios</p>\n          <p class=\"order-information__content-item-value\">{{ order.comments }}</p>\n        </div>\n      }\n\n      @if (order.address_notes) {\n        <div class=\"order-information__content-item\">\n          <p class=\"order-information__content-item-title\">Notas de direcci\u00F3n</p>\n          <p class=\"order-information__content-item-value\">{{ order.address_notes }}</p>\n        </div>\n      }\n    </div>\n  </div>\n}\n", styles: [".order-information{background-color:#fff;border-radius:.5rem;border:1px solid #f3f4f6;box-sizing:border-box;overflow:hidden;position:relative;width:100%}.order-information__header{align-items:center;border-bottom:1px solid #f3f4f6;display:flex;flex-flow:row wrap;gap:.75rem;justify-content:space-between;padding:1rem;width:100%}.order-information__header-id{color:#6b7280;font-size:.875rem;font-weight:700;margin:0}.order-information__header-uuid{color:#9ca3af;font-family:ui-monospace,SFMono-Regular,SF Mono,Menlo,Consolas,Liberation Mono,monospace;font-size:.75rem;margin:0;word-break:break-all}.order-information__header-actions{display:inline-flex;flex-flow:row wrap;gap:1rem}.order-information__content{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:1rem;padding:1rem}@media(min-width:768px){.order-information__content{grid-template-columns:repeat(3,minmax(0,1fr))}}.order-information__content-item{align-items:flex-start;display:flex;flex-flow:column nowrap;position:relative;width:100%}.order-information__content-item-title{color:#9ca3af;font-size:.75rem;margin:0;text-transform:uppercase}.order-information__content-item-value{color:#111827;font-weight:500;font-size:.875rem;margin:0}.order-information__content-item-value.total{font-weight:700}.order-information__content-item-total_discounted{display:flex;flex-flow:row nowrap;gap:.25rem;margin:0;width:100%}.order-information__content-item-total_discounted .discounted{color:#111827;font-size:.875rem;font-weight:700}.order-information__content-item-total_discounted .total{color:#9ca3af;margin:0;text-decoration:line-through}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "component", type: OrderStatusBadgeComponent, selector: "order-status-badge", inputs: ["order", "size"] }, { kind: "ngmodule", type: TranslocoModule }, { kind: "component", type: AppBadgeComponent, selector: "app-badge", inputs: ["text", "color", "size", "bordered", "backgroundColor", "textColor"] }, { kind: "component", type: AppButtonComponent, selector: "app-button", inputs: ["disabled", "loading", "type", "variant", "text", "size", "loadingText", "icon", "tooltip"], outputs: ["clicked"] }, { kind: "pipe", type: i1$1.CurrencyPipe, name: "currency" }, { kind: "pipe", type: i1$1.DatePipe, name: "date" }, { kind: "pipe", type: i2.TranslocoPipe, name: "transloco" }], encapsulation: i0.ViewEncapsulation.None });
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.25", ngImport: i0, type: OrderInformationComponent, decorators: [{
             type: Component,
@@ -10572,7 +10752,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.25", ngImpo
                         AppBadgeComponent,
                         AppButtonComponent,
                     ], encapsulation: ViewEncapsulation.None, template: "@if (!!order) {\n  <div class=\"order-information\">\n    <div class=\"order-information__header\">\n      <div>\n        <p class=\"order-information__header-id\">Orden #{{ order.id }}</p>\n        <p class=\"order-information__header-uuid\">{{ order.uuid }}</p>\n      </div>\n\n      <div class=\"order-information__header-actions\">\n        <order-status-badge [order]=\"order\" size=\"xs\" />\n\n        @if (showMpButton) {\n          <app-button\n            [text]=\"'order.mpPayButton' | transloco\"\n            [loadingText]=\"'order.mpPayButtonLoading' | transloco\"\n            [loading]=\"isLoading\"\n            variant=\"secondary\"\n            size=\"xs\"\n            icon=\"ri-wallet-3-line\"\n            (clicked)=\"payWithMercadoPago()\"\n          />\n        }\n      </div>\n    </div>\n\n    <div class=\"order-information__content\">\n      @if (order.show_snapshot && order.show_snapshot['title']) {\n        <div class=\"order-information__content-item\">\n          <p class=\"order-information__content-item-title\">Evento</p>\n          <p class=\"order-information__content-item-value\">\n            {{ order.show_snapshot['title'] }}\n          </p>\n        </div>\n      }\n\n      @if (order.performance_snapshot && order.performance_snapshot['start_time']) {\n        <div class=\"order-information__content-item\">\n          <p class=\"order-information__content-item-title\">Fecha de la funci\u00F3n</p>\n          <p class=\"order-information__content-item-value\">\n            {{ order.performance_snapshot['start_time'] | date: 'dd/MM/yyyy hh:mm a' }}\n          </p>\n        </div>\n      }\n\n      <div class=\"order-information__content-item\">\n        <p class=\"order-information__content-item-title\">Fecha de la compra</p>\n        <p class=\"order-information__content-item-value\">\n          {{ order.created_at | date: 'dd/MM/yyyy hh:mm a' }}\n        </p>\n      </div>\n\n      @if (order.payment_method) {\n        <div class=\"order-information__content-item\">\n          <p class=\"order-information__content-item-title\">M\u00E9todo de pago</p>\n          <p class=\"order-information__content-item-value\">\n            {{ `order.paymentMethods.${order.payment_method}` | transloco }}\n          </p>\n        </div>\n      }\n\n      @if (order.service_fee && order.service_fee > 0) {\n        <div class=\"order-information__content-item\">\n          <p class=\"order-information__content-item-title\">Tarifa de servicio</p>\n          <p class=\"order-information__content-item-value\">\n            ${{ order.service_fee | currency: 'COP' : '' : '1.0-2' }}\n          </p>\n        </div>\n      }\n\n      @if (!!order.discount_amount && order.discount_amount > 0) {\n        <div class=\"order-information__content-item\">\n          <p class=\"order-information__content-item-title\">Descuento</p>\n          <p class=\"order-information__content-item-value\">\n            ${{ order.discount_amount | currency: 'COP' : '' : '1.0-2' }}\n          </p>\n        </div>\n      }\n\n      <div class=\"order-information__content-item\">\n        <p class=\"order-information__content-item-title\">Total</p>\n        @if (order.total_discounted && order.total_discounted >= 0) {\n          <p class=\"order-information__content-item-total_discounted\">\n            <span class=\"discounted\">\n              ${{ order.total_discounted | currency: 'COP' : '' : '1.0-2' }}\n            </span>\n            <span class=\"order-information__content-item-value total\">\n              ${{ order.total | currency: 'COP' : '' : '1.0-2' }}\n            </span>\n          </p>\n        } @else {\n          <p class=\"order-information__content-item-value total\">\n            ${{ order.total | currency: 'COP' : '' : '1.0-2' }}\n          </p>\n        }\n      </div>\n\n      <div class=\"order-information__content-item\">\n        <p class=\"order-information__content-item-title\">T\u00E9rminos aceptados</p>\n        <app-badge\n          [text]=\"order.terms_accepted ? 'Aceptado' : 'No aceptado'\"\n          [backgroundColor]=\"order.terms_accepted ? '#dcfce7' : '#fee2e2'\"\n          [textColor]=\"order.terms_accepted ? '#16a34a' : '#dc2626'\"\n          size=\"xs\"\n        />\n      </div>\n\n      <div class=\"order-information__content-item\">\n        <p class=\"order-information__content-item-title\">Procesamiento de datos aceptado</p>\n        <app-badge\n          [text]=\"order.data_processing_accepted ? 'Aceptado' : 'No aceptado'\"\n          [backgroundColor]=\"order.data_processing_accepted ? '#dcfce7' : '#fee2e2'\"\n          [textColor]=\"order.data_processing_accepted ? '#16a34a' : '#dc2626'\"\n          size=\"xs\"\n        />\n      </div>\n\n      @if (order.comments) {\n        <div class=\"order-information__content-item\">\n          <p class=\"order-information__content-item-title\">Comentarios</p>\n          <p class=\"order-information__content-item-value\">{{ order.comments }}</p>\n        </div>\n      }\n\n      @if (order.address_notes) {\n        <div class=\"order-information__content-item\">\n          <p class=\"order-information__content-item-title\">Notas de direcci\u00F3n</p>\n          <p class=\"order-information__content-item-value\">{{ order.address_notes }}</p>\n        </div>\n      }\n    </div>\n  </div>\n}\n", styles: [".order-information{background-color:#fff;border-radius:.5rem;border:1px solid #f3f4f6;box-sizing:border-box;overflow:hidden;position:relative;width:100%}.order-information__header{align-items:center;border-bottom:1px solid #f3f4f6;display:flex;flex-flow:row wrap;gap:.75rem;justify-content:space-between;padding:1rem;width:100%}.order-information__header-id{color:#6b7280;font-size:.875rem;font-weight:700;margin:0}.order-information__header-uuid{color:#9ca3af;font-family:ui-monospace,SFMono-Regular,SF Mono,Menlo,Consolas,Liberation Mono,monospace;font-size:.75rem;margin:0;word-break:break-all}.order-information__header-actions{display:inline-flex;flex-flow:row wrap;gap:1rem}.order-information__content{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:1rem;padding:1rem}@media(min-width:768px){.order-information__content{grid-template-columns:repeat(3,minmax(0,1fr))}}.order-information__content-item{align-items:flex-start;display:flex;flex-flow:column nowrap;position:relative;width:100%}.order-information__content-item-title{color:#9ca3af;font-size:.75rem;margin:0;text-transform:uppercase}.order-information__content-item-value{color:#111827;font-weight:500;font-size:.875rem;margin:0}.order-information__content-item-value.total{font-weight:700}.order-information__content-item-total_discounted{display:flex;flex-flow:row nowrap;gap:.25rem;margin:0;width:100%}.order-information__content-item-total_discounted .discounted{color:#111827;font-size:.875rem;font-weight:700}.order-information__content-item-total_discounted .total{color:#9ca3af;margin:0;text-decoration:line-through}\n"] }]
-        }], ctorParameters: () => [{ type: i1$3.TranslocoService }, { type: ToastService }], propDecorators: { order: [{
+        }], ctorParameters: () => [{ type: i2.TranslocoService }, { type: ToastService }], propDecorators: { order: [{
                 type: Input,
                 args: [{ required: true }]
             }], showPayButton: [{
@@ -10593,13 +10773,13 @@ class OrderItemTypeBadgeComponent {
     get statusColors() {
         return ORDER_ITEM_TYPES_COLORS[this.item.item_type] ?? null;
     }
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.25", ngImport: i0, type: OrderItemTypeBadgeComponent, deps: [{ token: i1$3.TranslocoService }], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.3.25", type: OrderItemTypeBadgeComponent, isStandalone: true, selector: "order-item-type-badge", inputs: { item: "item", size: "size" }, ngImport: i0, template: "<app-badge\n  [text]=\"`order.itemType.${item.item_type}` | transloco\"\n  [backgroundColor]=\"statusColors.bg\"\n  [textColor]=\"statusColors.text\"\n  [size]=\"size\"\n/>\n", dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "ngmodule", type: TranslocoModule }, { kind: "component", type: AppBadgeComponent, selector: "app-badge", inputs: ["text", "color", "size", "bordered", "backgroundColor", "textColor"] }, { kind: "pipe", type: i1$3.TranslocoPipe, name: "transloco" }] });
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.25", ngImport: i0, type: OrderItemTypeBadgeComponent, deps: [{ token: i2.TranslocoService }], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.3.25", type: OrderItemTypeBadgeComponent, isStandalone: true, selector: "order-item-type-badge", inputs: { item: "item", size: "size" }, ngImport: i0, template: "<app-badge\n  [text]=\"`order.itemType.${item.item_type}` | transloco\"\n  [backgroundColor]=\"statusColors.bg\"\n  [textColor]=\"statusColors.text\"\n  [size]=\"size\"\n/>\n", dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "ngmodule", type: TranslocoModule }, { kind: "component", type: AppBadgeComponent, selector: "app-badge", inputs: ["text", "color", "size", "bordered", "backgroundColor", "textColor"] }, { kind: "pipe", type: i2.TranslocoPipe, name: "transloco" }] });
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.25", ngImport: i0, type: OrderItemTypeBadgeComponent, decorators: [{
             type: Component,
             args: [{ selector: 'order-item-type-badge', standalone: true, imports: [CommonModule, TranslocoModule, AppBadgeComponent], template: "<app-badge\n  [text]=\"`order.itemType.${item.item_type}` | transloco\"\n  [backgroundColor]=\"statusColors.bg\"\n  [textColor]=\"statusColors.text\"\n  [size]=\"size\"\n/>\n" }]
-        }], ctorParameters: () => [{ type: i1$3.TranslocoService }], propDecorators: { item: [{
+        }], ctorParameters: () => [{ type: i2.TranslocoService }], propDecorators: { item: [{
                 type: Input,
                 args: [{ required: true }]
             }], size: [{
@@ -10901,7 +11081,7 @@ class OrderDiscountAppliedComponent {
         return ORDER_DISCOUNT_COLORS[this.discountInfo.type] ?? { text: '', bg: '' };
     }
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.25", ngImport: i0, type: OrderDiscountAppliedComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.25", type: OrderDiscountAppliedComponent, isStandalone: true, selector: "order-discount-applied", inputs: { order: "order" }, ngImport: i0, template: "@if (hasDiscount) {\n  <div class=\"order-discount-applied\">\n    <div class=\"order-discount-applied__content\">\n      <div class=\"order-discount-applied__content-item discount-icon\">\n        <div class=\"order-discount-applied__content-item-icon-wrapper\">\n          <i class=\"order-discount-applied__content-item-icon\" [class]=\"discountInfo.icon\"></i>\n        </div>\n      </div>\n\n      <div class=\"order-discount-applied__content-item\">\n        <p class=\"order-discount-applied__content-item-title\">Tipo de descuento</p>\n        <app-badge\n          [text]=\"'order.discountTypes.' + discountInfo.type | transloco\"\n          [backgroundColor]=\"badgeColors.bg\"\n          [textColor]=\"badgeColors.text\"\n          size=\"xs\"\n        />\n      </div>\n\n      @if (discountInfo.code) {\n        <div class=\"order-discount-applied__content-item\">\n          <p class=\"order-discount-applied__content-item-title\">C\u00F3digo</p>\n          <p class=\"order-discount-applied__content-item-value\">{{ discountInfo.code }}</p>\n        </div>\n      }\n\n      @if (discountInfo.name && discountInfo.name !== discountInfo.code) {\n        <div class=\"order-discount-applied__content-item\">\n          <p class=\"order-discount-applied__content-item-title\">Nombre</p>\n          <p class=\"order-discount-applied__content-item-value\">{{ discountInfo.name }}</p>\n        </div>\n      }\n\n      <div class=\"order-discount-applied__content-item\">\n        <p class=\"order-discount-applied__content-item-title\">Valor del descuento</p>\n        <p class=\"order-discount-applied__content-item-value\">\n          ${{ discountInfo.value | currency: 'COP' : '' : '1.0-2' }}\n        </p>\n      </div>\n    </div>\n  </div>\n}\n", styles: [".order-discount-applied{background-color:#fff;border-radius:.5rem;border:1px solid #f3f4f6;box-sizing:border-box;overflow:hidden;position:relative;width:100%}.order-discount-applied__content{display:flex;flex-flow:row wrap;gap:1rem;padding:1rem}.order-discount-applied__content-item{align-items:flex-start;display:flex;flex-flow:column nowrap;flex:1 1 calc(50% - 1rem);position:relative}@media(min-width:768px){.order-discount-applied__content-item{flex:1 1 0}}.order-discount-applied__content-item.discount-icon{flex:0 0 auto;justify-content:center;width:auto}@media(min-width:768px){.order-discount-applied__content-item.discount-icon{flex:0 0 auto}}.order-discount-applied__content-item-title{color:#9ca3af;font-size:.75rem;margin:0;text-transform:uppercase}.order-discount-applied__content-item-value{color:#111827;font-weight:500;font-size:.875rem;margin:0}.order-discount-applied__content-item-icon-wrapper{align-items:center;border-radius:.375rem;border:1px solid #e5e7eb;display:flex;height:2.5rem;justify-content:center;width:2.5rem}.order-discount-applied__content-item-icon-wrapper i{font-size:1.25rem}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "ngmodule", type: TranslocoModule }, { kind: "component", type: AppBadgeComponent, selector: "app-badge", inputs: ["text", "color", "size", "bordered", "backgroundColor", "textColor"] }, { kind: "pipe", type: i1$1.CurrencyPipe, name: "currency" }, { kind: "pipe", type: i1$3.TranslocoPipe, name: "transloco" }], encapsulation: i0.ViewEncapsulation.None });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.25", type: OrderDiscountAppliedComponent, isStandalone: true, selector: "order-discount-applied", inputs: { order: "order" }, ngImport: i0, template: "@if (hasDiscount) {\n  <div class=\"order-discount-applied\">\n    <div class=\"order-discount-applied__content\">\n      <div class=\"order-discount-applied__content-item discount-icon\">\n        <div class=\"order-discount-applied__content-item-icon-wrapper\">\n          <i class=\"order-discount-applied__content-item-icon\" [class]=\"discountInfo.icon\"></i>\n        </div>\n      </div>\n\n      <div class=\"order-discount-applied__content-item\">\n        <p class=\"order-discount-applied__content-item-title\">Tipo de descuento</p>\n        <app-badge\n          [text]=\"'order.discountTypes.' + discountInfo.type | transloco\"\n          [backgroundColor]=\"badgeColors.bg\"\n          [textColor]=\"badgeColors.text\"\n          size=\"xs\"\n        />\n      </div>\n\n      @if (discountInfo.code) {\n        <div class=\"order-discount-applied__content-item\">\n          <p class=\"order-discount-applied__content-item-title\">C\u00F3digo</p>\n          <p class=\"order-discount-applied__content-item-value\">{{ discountInfo.code }}</p>\n        </div>\n      }\n\n      @if (discountInfo.name && discountInfo.name !== discountInfo.code) {\n        <div class=\"order-discount-applied__content-item\">\n          <p class=\"order-discount-applied__content-item-title\">Nombre</p>\n          <p class=\"order-discount-applied__content-item-value\">{{ discountInfo.name }}</p>\n        </div>\n      }\n\n      <div class=\"order-discount-applied__content-item\">\n        <p class=\"order-discount-applied__content-item-title\">Valor del descuento</p>\n        <p class=\"order-discount-applied__content-item-value\">\n          ${{ discountInfo.value | currency: 'COP' : '' : '1.0-2' }}\n        </p>\n      </div>\n    </div>\n  </div>\n}\n", styles: [".order-discount-applied{background-color:#fff;border-radius:.5rem;border:1px solid #f3f4f6;box-sizing:border-box;overflow:hidden;position:relative;width:100%}.order-discount-applied__content{display:flex;flex-flow:row wrap;gap:1rem;padding:1rem}.order-discount-applied__content-item{align-items:flex-start;display:flex;flex-flow:column nowrap;flex:1 1 calc(50% - 1rem);position:relative}@media(min-width:768px){.order-discount-applied__content-item{flex:1 1 0}}.order-discount-applied__content-item.discount-icon{flex:0 0 auto;justify-content:center;width:auto}@media(min-width:768px){.order-discount-applied__content-item.discount-icon{flex:0 0 auto}}.order-discount-applied__content-item-title{color:#9ca3af;font-size:.75rem;margin:0;text-transform:uppercase}.order-discount-applied__content-item-value{color:#111827;font-weight:500;font-size:.875rem;margin:0}.order-discount-applied__content-item-icon-wrapper{align-items:center;border-radius:.375rem;border:1px solid #e5e7eb;display:flex;height:2.5rem;justify-content:center;width:2.5rem}.order-discount-applied__content-item-icon-wrapper i{font-size:1.25rem}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "ngmodule", type: TranslocoModule }, { kind: "component", type: AppBadgeComponent, selector: "app-badge", inputs: ["text", "color", "size", "bordered", "backgroundColor", "textColor"] }, { kind: "pipe", type: i1$1.CurrencyPipe, name: "currency" }, { kind: "pipe", type: i2.TranslocoPipe, name: "transloco" }], encapsulation: i0.ViewEncapsulation.None });
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.25", ngImport: i0, type: OrderDiscountAppliedComponent, decorators: [{
             type: Component,
@@ -11001,7 +11181,7 @@ class OrderTransactionDetailsModalComponent {
         this.modalService.close();
     }
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.25", ngImport: i0, type: OrderTransactionDetailsModalComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.25", type: OrderTransactionDetailsModalComponent, isStandalone: true, selector: "order-transaction-details-modal", inputs: { isOpen: "isOpen", transaction: "transaction" }, ngImport: i0, template: "<app-modal\n  [isOpen]=\"modalIsOpen\"\n  (closeModal)=\"onClose()\"\n  [title]=\"'order.transactionDetails.title' | transloco\"\n  size=\"lg\"\n>\n  @if (selectedTransaction(); as tx) {\n    <div class=\"order-transaction-details\">\n      <div class=\"order-transaction-details__grid\">\n        <div class=\"order-transaction-details__item\">\n          <span class=\"order-transaction-details__label\">\n            {{ 'order.transactionDetails.labels.id' | transloco }}\n          </span>\n          <span class=\"order-transaction-details__value\">{{ tx.id }}</span>\n        </div>\n\n        <div class=\"order-transaction-details__item\">\n          <span class=\"order-transaction-details__label\">\n            {{ 'order.transactionDetails.labels.paymentMethod' | transloco }}\n          </span>\n          <span class=\"order-transaction-details__value\">\n            {{ 'order.paymentMethods.' + tx.payment_gateway | transloco }}\n          </span>\n        </div>\n\n        <div class=\"order-transaction-details__item\">\n          <span class=\"order-transaction-details__label\">\n            {{ 'order.transactionDetails.labels.status' | transloco }}\n          </span>\n          <span class=\"order-transaction-details__value\">\n            <app-badge\n              [text]=\"'order.transactionStatus.' + tx.status | transloco\"\n              [backgroundColor]=\"txColors[tx.status].bg\"\n              [textColor]=\"txColors[tx.status].text\"\n              size=\"xs\"\n            />\n          </span>\n        </div>\n\n        <div class=\"order-transaction-details__item\">\n          <span class=\"order-transaction-details__label\">\n            {{ 'order.transactionDetails.labels.amount' | transloco }}\n          </span>\n          <span class=\"order-transaction-details__value\">\n            ${{ tx.amount | number: '1.0-2' }} {{ tx.currency }}\n          </span>\n        </div>\n\n        <div class=\"order-transaction-details__item\">\n          <span class=\"order-transaction-details__label\">\n            {{ 'order.transactionDetails.labels.currency' | transloco }}\n          </span>\n          <span class=\"order-transaction-details__value\">{{ tx.currency }}</span>\n        </div>\n\n        <div class=\"order-transaction-details__item\">\n          <span class=\"order-transaction-details__label\">\n            {{ 'order.transactionDetails.labels.gatewayId' | transloco }}\n          </span>\n          <span class=\"order-transaction-details__value gateway-id\">\n            {{ tx.gateway_transaction_id }}\n          </span>\n        </div>\n\n        <div class=\"order-transaction-details__item\">\n          <span class=\"order-transaction-details__label\">\n            {{ 'order.transactionDetails.labels.createdAt' | transloco }}\n          </span>\n          <span class=\"order-transaction-details__value\">{{ tx.created_at | date: 'medium' }}</span>\n        </div>\n\n        <div class=\"order-transaction-details__item\">\n          <span class=\"order-transaction-details__label\">\n            {{ 'order.transactionDetails.labels.updatedAt' | transloco }}\n          </span>\n          <span class=\"order-transaction-details__value\">{{ tx.updated_at | date: 'medium' }}</span>\n        </div>\n      </div>\n\n      <div class=\"order-transaction-details__item\">\n        <span class=\"order-transaction-details__label\">\n          {{ 'order.transactionDetails.labels.gatewayResponse' | transloco }}\n        </span>\n        @if (gatewayResponse) {\n          <pre class=\"order-transaction-details__json\">{{ gatewayResponse }}</pre>\n        } @else {\n          <span class=\"order-transaction-details__value\">\u2014</span>\n        }\n      </div>\n    </div>\n  }\n</app-modal>\n", styles: [".order-transaction-details{display:flex;flex-direction:column;gap:1.5rem}.order-transaction-details__grid{display:grid;gap:1rem 1.5rem;grid-template-columns:repeat(2,minmax(0,1fr))}.order-transaction-details__item{display:flex;flex-direction:column;gap:.25rem}.order-transaction-details__label{color:#6b7280;font-size:.75rem;font-weight:700;text-transform:uppercase}.order-transaction-details__value{color:#374151;font-size:.875rem}@media(prefers-color-scheme:dark){.order-transaction-details__value{color:#d1d5db}}.order-transaction-details__json{background-color:#f9fafb;border:1px solid #f3f4f6;border-radius:.375rem;color:#374151;font-family:ui-monospace,SFMono-Regular,SF Mono,Menlo,Consolas,Liberation Mono,monospace;font-size:.75rem;line-height:1.625;margin:0;max-height:20rem;overflow:auto;padding:.75rem 1rem;white-space:pre-wrap;word-break:break-word}@media(prefers-color-scheme:dark){.order-transaction-details__json{background-color:#111827}}@media(prefers-color-scheme:dark){.order-transaction-details__json{border-color:#374151}}@media(prefers-color-scheme:dark){.order-transaction-details__json{color:#d1d5db}}.order-transaction-details .gateway-id{font-family:ui-monospace,SFMono-Regular,SF Mono,Menlo,Consolas,Liberation Mono,monospace;font-size:.75rem}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "ngmodule", type: TranslocoModule }, { kind: "component", type: AppModalComponent, selector: "app-modal", inputs: ["title", "disableClose", "showHeader", "showCloseButton", "showTitle", "interactiveClose", "isOpen", "size"], outputs: ["closeModal"] }, { kind: "component", type: AppBadgeComponent, selector: "app-badge", inputs: ["text", "color", "size", "bordered", "backgroundColor", "textColor"] }, { kind: "pipe", type: i1$1.DecimalPipe, name: "number" }, { kind: "pipe", type: i1$1.DatePipe, name: "date" }, { kind: "pipe", type: i1$3.TranslocoPipe, name: "transloco" }] });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.25", type: OrderTransactionDetailsModalComponent, isStandalone: true, selector: "order-transaction-details-modal", inputs: { isOpen: "isOpen", transaction: "transaction" }, ngImport: i0, template: "<app-modal\n  [isOpen]=\"modalIsOpen\"\n  (closeModal)=\"onClose()\"\n  [title]=\"'order.transactionDetails.title' | transloco\"\n  size=\"lg\"\n>\n  @if (selectedTransaction(); as tx) {\n    <div class=\"order-transaction-details\">\n      <div class=\"order-transaction-details__grid\">\n        <div class=\"order-transaction-details__item\">\n          <span class=\"order-transaction-details__label\">\n            {{ 'order.transactionDetails.labels.id' | transloco }}\n          </span>\n          <span class=\"order-transaction-details__value\">{{ tx.id }}</span>\n        </div>\n\n        <div class=\"order-transaction-details__item\">\n          <span class=\"order-transaction-details__label\">\n            {{ 'order.transactionDetails.labels.paymentMethod' | transloco }}\n          </span>\n          <span class=\"order-transaction-details__value\">\n            {{ 'order.paymentMethods.' + tx.payment_gateway | transloco }}\n          </span>\n        </div>\n\n        <div class=\"order-transaction-details__item\">\n          <span class=\"order-transaction-details__label\">\n            {{ 'order.transactionDetails.labels.status' | transloco }}\n          </span>\n          <span class=\"order-transaction-details__value\">\n            <app-badge\n              [text]=\"'order.transactionStatus.' + tx.status | transloco\"\n              [backgroundColor]=\"txColors[tx.status].bg\"\n              [textColor]=\"txColors[tx.status].text\"\n              size=\"xs\"\n            />\n          </span>\n        </div>\n\n        <div class=\"order-transaction-details__item\">\n          <span class=\"order-transaction-details__label\">\n            {{ 'order.transactionDetails.labels.amount' | transloco }}\n          </span>\n          <span class=\"order-transaction-details__value\">\n            ${{ tx.amount | number: '1.0-2' }} {{ tx.currency }}\n          </span>\n        </div>\n\n        <div class=\"order-transaction-details__item\">\n          <span class=\"order-transaction-details__label\">\n            {{ 'order.transactionDetails.labels.currency' | transloco }}\n          </span>\n          <span class=\"order-transaction-details__value\">{{ tx.currency }}</span>\n        </div>\n\n        <div class=\"order-transaction-details__item\">\n          <span class=\"order-transaction-details__label\">\n            {{ 'order.transactionDetails.labels.gatewayId' | transloco }}\n          </span>\n          <span class=\"order-transaction-details__value gateway-id\">\n            {{ tx.gateway_transaction_id }}\n          </span>\n        </div>\n\n        <div class=\"order-transaction-details__item\">\n          <span class=\"order-transaction-details__label\">\n            {{ 'order.transactionDetails.labels.createdAt' | transloco }}\n          </span>\n          <span class=\"order-transaction-details__value\">{{ tx.created_at | date: 'medium' }}</span>\n        </div>\n\n        <div class=\"order-transaction-details__item\">\n          <span class=\"order-transaction-details__label\">\n            {{ 'order.transactionDetails.labels.updatedAt' | transloco }}\n          </span>\n          <span class=\"order-transaction-details__value\">{{ tx.updated_at | date: 'medium' }}</span>\n        </div>\n      </div>\n\n      <div class=\"order-transaction-details__item\">\n        <span class=\"order-transaction-details__label\">\n          {{ 'order.transactionDetails.labels.gatewayResponse' | transloco }}\n        </span>\n        @if (gatewayResponse) {\n          <pre class=\"order-transaction-details__json\">{{ gatewayResponse }}</pre>\n        } @else {\n          <span class=\"order-transaction-details__value\">\u2014</span>\n        }\n      </div>\n    </div>\n  }\n</app-modal>\n", styles: [".order-transaction-details{display:flex;flex-direction:column;gap:1.5rem}.order-transaction-details__grid{display:grid;gap:1rem 1.5rem;grid-template-columns:repeat(2,minmax(0,1fr))}.order-transaction-details__item{display:flex;flex-direction:column;gap:.25rem}.order-transaction-details__label{color:#6b7280;font-size:.75rem;font-weight:700;text-transform:uppercase}.order-transaction-details__value{color:#374151;font-size:.875rem}@media(prefers-color-scheme:dark){.order-transaction-details__value{color:#d1d5db}}.order-transaction-details__json{background-color:#f9fafb;border:1px solid #f3f4f6;border-radius:.375rem;color:#374151;font-family:ui-monospace,SFMono-Regular,SF Mono,Menlo,Consolas,Liberation Mono,monospace;font-size:.75rem;line-height:1.625;margin:0;max-height:20rem;overflow:auto;padding:.75rem 1rem;white-space:pre-wrap;word-break:break-word}@media(prefers-color-scheme:dark){.order-transaction-details__json{background-color:#111827}}@media(prefers-color-scheme:dark){.order-transaction-details__json{border-color:#374151}}@media(prefers-color-scheme:dark){.order-transaction-details__json{color:#d1d5db}}.order-transaction-details .gateway-id{font-family:ui-monospace,SFMono-Regular,SF Mono,Menlo,Consolas,Liberation Mono,monospace;font-size:.75rem}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "ngmodule", type: TranslocoModule }, { kind: "component", type: AppModalComponent, selector: "app-modal", inputs: ["title", "disableClose", "showHeader", "showCloseButton", "showTitle", "interactiveClose", "isOpen", "size"], outputs: ["closeModal"] }, { kind: "component", type: AppBadgeComponent, selector: "app-badge", inputs: ["text", "color", "size", "bordered", "backgroundColor", "textColor"] }, { kind: "pipe", type: i1$1.DecimalPipe, name: "number" }, { kind: "pipe", type: i1$1.DatePipe, name: "date" }, { kind: "pipe", type: i2.TranslocoPipe, name: "transloco" }] });
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.25", ngImport: i0, type: OrderTransactionDetailsModalComponent, decorators: [{
             type: Component,
@@ -11031,7 +11211,7 @@ class OrderTransactionsComponent {
         this.transactionDetailsModalService.open(transaction);
     }
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.25", ngImport: i0, type: OrderTransactionsComponent, deps: [{ token: OrderTransactionDetailsModalService }], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.25", type: OrderTransactionsComponent, isStandalone: true, selector: "order-transactions", inputs: { order: "order" }, ngImport: i0, template: "@if (hasTransactions) {\n  <div class=\"order-transactions\">\n    <div class=\"order-transactions__header\">\n      <p class=\"order-transactions__header-title\">\n        Transacciones ({{ transactions.length | number: '1.0' }})\n      </p>\n    </div>\n    <div class=\"order-transactions__table-container\">\n      <table class=\"order-transactions__table\">\n        <thead class=\"order-transactions__table-head\">\n          <tr class=\"order-transactions__table-head-row\">\n            <th class=\"order-transactions__table-head-cell\">Medio de pago</th>\n            <th class=\"order-transactions__table-head-cell\">Estado</th>\n            <th class=\"order-transactions__table-head-cell text-right\">Valor</th>\n            <th class=\"order-transactions__table-head-cell\">ID transacci\u00F3n</th>\n            <th class=\"order-transactions__table-head-cell text-right\">Acciones</th>\n          </tr>\n        </thead>\n        <tbody class=\"order-transactions__table-body\">\n          @for (tx of transactions; track tx.id) {\n            <tr class=\"order-transactions__table-body-row\">\n              <td class=\"order-transactions__table-body-cell\">\n                {{ 'order.paymentMethods.' + tx.payment_gateway | transloco }}\n              </td>\n              <td class=\"order-transactions__table-body-cell\">\n                <app-badge\n                  [text]=\"'order.transactionStatus.' + tx.status | transloco\"\n                  [backgroundColor]=\"txColors[tx.status].bg\"\n                  [textColor]=\"txColors[tx.status].text\"\n                  size=\"xs\"\n                />\n              </td>\n              <td class=\"order-transactions__table-body-cell text-right\">\n                ${{ tx.amount | number: '1.0-2' }}\n              </td>\n              <td class=\"order-transactions__table-body-cell\">\n                {{ tx.gateway_transaction_id }}\n              </td>\n              <td class=\"order-transactions__table-body-cell text-right\">\n                <app-button\n                  icon=\"ri-eye-line\"\n                  variant=\"tertiary\"\n                  size=\"xs\"\n                  (clicked)=\"openTransaction(tx)\"\n                  [title]=\"'order.transactionDetails.actions.view' | transloco\"\n                />\n              </td>\n            </tr>\n          }\n        </tbody>\n      </table>\n    </div>\n  </div>\n\n  <order-transaction-details-modal />\n}\n", styles: [".order-transactions{background-color:#fff;border-radius:.5rem;border:1px solid #f3f4f6;box-sizing:border-box;overflow:hidden;position:relative;width:100%}.order-transactions__header{align-items:center;display:flex;padding:1rem;width:100%}.order-transactions__header-title{color:#6b7280;font-size:.875rem;font-weight:700;margin:0}.order-transactions__table-container{overflow-x:auto}.order-transactions__table{border-collapse:collapse;font-size:.875rem;width:100%}.order-transactions__table-head-row{background-color:#f9fafb;text-align:left}.order-transactions__table-head-cell{color:#6b7280;font-size:.75rem;font-weight:700;padding:.75rem 1.5rem;text-transform:uppercase}.order-transactions__table-head-cell.text-right{text-align:right}.order-transactions__table-body>:not(:last-child){border-bottom:1px solid #f9fafb}.order-transactions__table-body-row{transition:all .4s ease}.order-transactions__table-body-row:hover{background-color:#f9fafb}.order-transactions__table-body-cell{color:#374151;padding:.75rem 1.5rem;white-space:nowrap}.order-transactions__table-body-cell.text-right{text-align:right}.order-transactions__table-body-cell .gateway-id{font-family:ui-monospace,SFMono-Regular,SF Mono,Menlo,Consolas,Liberation Mono,monospace;font-size:.75rem}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "ngmodule", type: TranslocoModule }, { kind: "component", type: AppBadgeComponent, selector: "app-badge", inputs: ["text", "color", "size", "bordered", "backgroundColor", "textColor"] }, { kind: "component", type: AppButtonComponent, selector: "app-button", inputs: ["disabled", "loading", "type", "variant", "text", "size", "loadingText", "icon", "tooltip"], outputs: ["clicked"] }, { kind: "component", type: OrderTransactionDetailsModalComponent, selector: "order-transaction-details-modal", inputs: ["isOpen", "transaction"] }, { kind: "pipe", type: i1$1.DecimalPipe, name: "number" }, { kind: "pipe", type: i1$3.TranslocoPipe, name: "transloco" }], encapsulation: i0.ViewEncapsulation.None });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.25", type: OrderTransactionsComponent, isStandalone: true, selector: "order-transactions", inputs: { order: "order" }, ngImport: i0, template: "@if (hasTransactions) {\n  <div class=\"order-transactions\">\n    <div class=\"order-transactions__header\">\n      <p class=\"order-transactions__header-title\">\n        Transacciones ({{ transactions.length | number: '1.0' }})\n      </p>\n    </div>\n    <div class=\"order-transactions__table-container\">\n      <table class=\"order-transactions__table\">\n        <thead class=\"order-transactions__table-head\">\n          <tr class=\"order-transactions__table-head-row\">\n            <th class=\"order-transactions__table-head-cell\">Medio de pago</th>\n            <th class=\"order-transactions__table-head-cell\">Estado</th>\n            <th class=\"order-transactions__table-head-cell text-right\">Valor</th>\n            <th class=\"order-transactions__table-head-cell\">ID transacci\u00F3n</th>\n            <th class=\"order-transactions__table-head-cell text-right\">Acciones</th>\n          </tr>\n        </thead>\n        <tbody class=\"order-transactions__table-body\">\n          @for (tx of transactions; track tx.id) {\n            <tr class=\"order-transactions__table-body-row\">\n              <td class=\"order-transactions__table-body-cell\">\n                {{ 'order.paymentMethods.' + tx.payment_gateway | transloco }}\n              </td>\n              <td class=\"order-transactions__table-body-cell\">\n                <app-badge\n                  [text]=\"'order.transactionStatus.' + tx.status | transloco\"\n                  [backgroundColor]=\"txColors[tx.status].bg\"\n                  [textColor]=\"txColors[tx.status].text\"\n                  size=\"xs\"\n                />\n              </td>\n              <td class=\"order-transactions__table-body-cell text-right\">\n                ${{ tx.amount | number: '1.0-2' }}\n              </td>\n              <td class=\"order-transactions__table-body-cell\">\n                {{ tx.gateway_transaction_id }}\n              </td>\n              <td class=\"order-transactions__table-body-cell text-right\">\n                <app-button\n                  icon=\"ri-eye-line\"\n                  variant=\"tertiary\"\n                  size=\"xs\"\n                  (clicked)=\"openTransaction(tx)\"\n                  [title]=\"'order.transactionDetails.actions.view' | transloco\"\n                />\n              </td>\n            </tr>\n          }\n        </tbody>\n      </table>\n    </div>\n  </div>\n\n  <order-transaction-details-modal />\n}\n", styles: [".order-transactions{background-color:#fff;border-radius:.5rem;border:1px solid #f3f4f6;box-sizing:border-box;overflow:hidden;position:relative;width:100%}.order-transactions__header{align-items:center;display:flex;padding:1rem;width:100%}.order-transactions__header-title{color:#6b7280;font-size:.875rem;font-weight:700;margin:0}.order-transactions__table-container{overflow-x:auto}.order-transactions__table{border-collapse:collapse;font-size:.875rem;width:100%}.order-transactions__table-head-row{background-color:#f9fafb;text-align:left}.order-transactions__table-head-cell{color:#6b7280;font-size:.75rem;font-weight:700;padding:.75rem 1.5rem;text-transform:uppercase}.order-transactions__table-head-cell.text-right{text-align:right}.order-transactions__table-body>:not(:last-child){border-bottom:1px solid #f9fafb}.order-transactions__table-body-row{transition:all .4s ease}.order-transactions__table-body-row:hover{background-color:#f9fafb}.order-transactions__table-body-cell{color:#374151;padding:.75rem 1.5rem;white-space:nowrap}.order-transactions__table-body-cell.text-right{text-align:right}.order-transactions__table-body-cell .gateway-id{font-family:ui-monospace,SFMono-Regular,SF Mono,Menlo,Consolas,Liberation Mono,monospace;font-size:.75rem}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "ngmodule", type: TranslocoModule }, { kind: "component", type: AppBadgeComponent, selector: "app-badge", inputs: ["text", "color", "size", "bordered", "backgroundColor", "textColor"] }, { kind: "component", type: AppButtonComponent, selector: "app-button", inputs: ["disabled", "loading", "type", "variant", "text", "size", "loadingText", "icon", "tooltip"], outputs: ["clicked"] }, { kind: "component", type: OrderTransactionDetailsModalComponent, selector: "order-transaction-details-modal", inputs: ["isOpen", "transaction"] }, { kind: "pipe", type: i1$1.DecimalPipe, name: "number" }, { kind: "pipe", type: i2.TranslocoPipe, name: "transloco" }], encapsulation: i0.ViewEncapsulation.None });
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.25", ngImport: i0, type: OrderTransactionsComponent, decorators: [{
             type: Component,
@@ -11068,7 +11248,7 @@ class VipCardStatusBadgeComponent {
         return `vipCard.status.${this.card.status}`;
     }
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.25", ngImport: i0, type: VipCardStatusBadgeComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.3.25", type: VipCardStatusBadgeComponent, isStandalone: true, selector: "vip-card-status-badge", inputs: { card: "card" }, ngImport: i0, template: "<app-badge [text]=\"statusTranslationKey | transloco\" [color]=\"statusColor\" size=\"xs\" />\n", styles: [""], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "component", type: AppBadgeComponent, selector: "app-badge", inputs: ["text", "color", "size", "bordered", "backgroundColor", "textColor"] }, { kind: "ngmodule", type: TranslocoModule }, { kind: "pipe", type: i1$3.TranslocoPipe, name: "transloco" }], encapsulation: i0.ViewEncapsulation.None });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.3.25", type: VipCardStatusBadgeComponent, isStandalone: true, selector: "vip-card-status-badge", inputs: { card: "card" }, ngImport: i0, template: "<app-badge [text]=\"statusTranslationKey | transloco\" [color]=\"statusColor\" size=\"xs\" />\n", styles: [""], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "component", type: AppBadgeComponent, selector: "app-badge", inputs: ["text", "color", "size", "bordered", "backgroundColor", "textColor"] }, { kind: "ngmodule", type: TranslocoModule }, { kind: "pipe", type: i2.TranslocoPipe, name: "transloco" }], encapsulation: i0.ViewEncapsulation.None });
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.25", ngImport: i0, type: VipCardStatusBadgeComponent, decorators: [{
             type: Component,
@@ -11182,7 +11362,7 @@ class VipRechargeModalComponent {
             data_processing_accepted: !!value.data_processing_accepted,
         });
     }
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.25", ngImport: i0, type: VipRechargeModalComponent, deps: [{ token: i1$2.FormBuilder }, { token: i1$3.TranslocoService }], target: i0.ɵɵFactoryTarget.Component });
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.25", ngImport: i0, type: VipRechargeModalComponent, deps: [{ token: i1$2.FormBuilder }, { token: i2.TranslocoService }], target: i0.ɵɵFactoryTarget.Component });
     static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.25", type: VipRechargeModalComponent, isStandalone: true, selector: "vip-recharge-modal", inputs: { title: "title", submitLabel: "submitLabel", loading: "loading", amountStep: "amountStep", minAmount: "minAmount", maxAmount: "maxAmount", isOpen: "isOpen", restrictToMercadoPago: "restrictToMercadoPago" }, outputs: { closeModal: "closeModal", confirm: "confirm" }, usesOnChanges: true, ngImport: i0, template: "<app-modal [isOpen]=\"isOpen\" [title]=\"title\" size=\"md\" (closeModal)=\"onClose()\">\n  <form [formGroup]=\"rechargeForm\" (ngSubmit)=\"onSubmit()\">\n    <div class=\"vip-recharge-modal\">\n      @if (restrictToMercadoPago) {\n        <div class=\"vip-recharge-modal-payment-locked\">\n          <span class=\"vip-recharge-modal-payment-locked-label\">M\u00E9todo de pago</span>\n          <span class=\"vip-recharge-modal-payment-locked-value\">Mercado Pago</span>\n        </div>\n      } @else {\n        <async-select\n          label=\"M\u00E9todo de pago\"\n          placeholder=\"Selecciona un m\u00E9todo de pago\"\n          name=\"payment_method\"\n          class=\"flex-1\"\n          [required]=\"true\"\n          [items]=\"paymentMethodOptions\"\n          formControlName=\"payment_method\"\n        />\n      }\n\n      <div>\n        <number-input\n          formControlName=\"amount\"\n          label=\"Monto\"\n          type=\"number\"\n          [min]=\"minAmount\"\n          [max]=\"maxAmount\"\n          [step]=\"amountStep\"\n          [required]=\"true\"\n          placeholder=\"Ingresa el monto a recargar\"\n        />\n\n        <p class=\"vip-recharge-modal-hint\">\n          Monto m\u00EDnimo: {{ minAmount | currency: 'COP' : 'symbol-narrow' : '1.0-0' }}\n        </p>\n      </div>\n\n      <div class=\"vip-recharge-modal-notice\">\n        Esta acci\u00F3n generar\u00E1 una orden de compra por el monto indicado. El saldo solo se acreditar\u00E1\n        a la Tarjeta VIP una vez se confirme el pago de esa orden.\n      </div>\n\n      <div class=\"vip-recharge-modal-terms\">\n        <div class=\"vip-recharge-modal-terms-row\">\n          <toggle-switch\n            size=\"sm\"\n            id=\"vip_recharge_terms_accepted\"\n            formControlName=\"terms_accepted\"\n          />\n          <label for=\"vip_recharge_terms_accepted\" class=\"vip-recharge-modal-terms-label\">\n            Acepto los t\u00E9rminos y condiciones y la pol\u00EDtica de privacidad\n          </label>\n        </div>\n\n        <div class=\"vip-recharge-modal-terms-row\">\n          <toggle-switch\n            size=\"sm\"\n            id=\"vip_recharge_data_processing_accepted\"\n            formControlName=\"data_processing_accepted\"\n          />\n          <label for=\"vip_recharge_data_processing_accepted\" class=\"vip-recharge-modal-terms-label\">\n            Autorizo el tratamiento de mis datos personales\n          </label>\n        </div>\n\n        <div class=\"vip-recharge-modal-terms-row\">\n          <toggle-switch\n            size=\"sm\"\n            id=\"vip_recharge_order_notice_accepted\"\n            formControlName=\"order_notice_accepted\"\n          />\n          <label for=\"vip_recharge_order_notice_accepted\" class=\"vip-recharge-modal-terms-label\">\n            Entiendo que esto generar\u00E1 una orden de compra y que el saldo se activar\u00E1 solo cuando se\n            confirme el pago\n          </label>\n        </div>\n      </div>\n    </div>\n\n    <div class=\"vip-recharge-modal-actions\">\n      <app-button\n        type=\"button\"\n        variant=\"tertiary\"\n        text=\"Cancelar\"\n        size=\"sm\"\n        (clicked)=\"onClose()\"\n      />\n\n      <app-button\n        type=\"submit\"\n        size=\"sm\"\n        variant=\"primary\"\n        [text]=\"submitLabel\"\n        [loading]=\"loading\"\n        [disabled]=\"rechargeForm.invalid\"\n      />\n    </div>\n  </form>\n</app-modal>\n", styles: [".vip-recharge-modal{display:flex;flex-flow:column;gap:1rem;width:100%}.vip-recharge-modal-hint{display:inline-flex;margin-top:1rem;font-size:12px;color:#6b7280}.vip-recharge-modal-payment-locked{display:flex;flex-direction:column;gap:2px}.vip-recharge-modal-payment-locked-label{font-size:.75rem;color:#6b7280}.vip-recharge-modal-payment-locked-value{font-size:.875rem;font-weight:600;color:#374151}.vip-recharge-modal-notice{background-color:#fffbeb;border:1px solid #fde68a;color:#92400e;border-radius:.375rem;padding:.75rem;font-size:.75rem;line-height:1.4}.vip-recharge-modal-terms{display:flex;flex-flow:column;gap:.5rem}.vip-recharge-modal-terms-row{display:flex;align-items:center;gap:.5rem}.vip-recharge-modal-terms-label{font-size:.875rem;color:#374151}.vip-recharge-modal-actions{display:flex;justify-content:flex-end;gap:12px;margin-top:1rem}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i1$2.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i1$2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$2.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i1$2.RequiredValidator, selector: ":not([type=checkbox])[required][formControlName],:not([type=checkbox])[required][formControl],:not([type=checkbox])[required][ngModel]", inputs: ["required"] }, { kind: "directive", type: i1$2.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i1$2.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "component", type: AppModalComponent, selector: "app-modal", inputs: ["title", "disableClose", "showHeader", "showCloseButton", "showTitle", "interactiveClose", "isOpen", "size"], outputs: ["closeModal"] }, { kind: "component", type: NumberInputComponent, selector: "number-input", inputs: ["label", "name", "id", "placeholder", "required", "readonly", "min", "max", "step", "fieldGroupClass"] }, { kind: "component", type: AppButtonComponent, selector: "app-button", inputs: ["disabled", "loading", "type", "variant", "text", "size", "loadingText", "icon", "tooltip"], outputs: ["clicked"] }, { kind: "component", type: AsyncSelectComponent, selector: "async-select", inputs: ["config", "items", "parentId", "label", "placeholder", "name", "required", "multiple", "clearable", "searchable", "loading", "virtualScroll", "notFoundText", "bindLabel", "bindValue", "disabled"] }, { kind: "component", type: ToggleSwitchComponent, selector: "toggle-switch", inputs: ["label", "name", "id", "required", "disabled", "size", "fieldGroupClass", "description"], outputs: ["toggleClick"] }, { kind: "pipe", type: i1$1.CurrencyPipe, name: "currency" }], encapsulation: i0.ViewEncapsulation.None });
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.25", ngImport: i0, type: VipRechargeModalComponent, decorators: [{
@@ -11196,7 +11376,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.25", ngImpo
                         AsyncSelectComponent,
                         ToggleSwitchComponent,
                     ], encapsulation: ViewEncapsulation.None, template: "<app-modal [isOpen]=\"isOpen\" [title]=\"title\" size=\"md\" (closeModal)=\"onClose()\">\n  <form [formGroup]=\"rechargeForm\" (ngSubmit)=\"onSubmit()\">\n    <div class=\"vip-recharge-modal\">\n      @if (restrictToMercadoPago) {\n        <div class=\"vip-recharge-modal-payment-locked\">\n          <span class=\"vip-recharge-modal-payment-locked-label\">M\u00E9todo de pago</span>\n          <span class=\"vip-recharge-modal-payment-locked-value\">Mercado Pago</span>\n        </div>\n      } @else {\n        <async-select\n          label=\"M\u00E9todo de pago\"\n          placeholder=\"Selecciona un m\u00E9todo de pago\"\n          name=\"payment_method\"\n          class=\"flex-1\"\n          [required]=\"true\"\n          [items]=\"paymentMethodOptions\"\n          formControlName=\"payment_method\"\n        />\n      }\n\n      <div>\n        <number-input\n          formControlName=\"amount\"\n          label=\"Monto\"\n          type=\"number\"\n          [min]=\"minAmount\"\n          [max]=\"maxAmount\"\n          [step]=\"amountStep\"\n          [required]=\"true\"\n          placeholder=\"Ingresa el monto a recargar\"\n        />\n\n        <p class=\"vip-recharge-modal-hint\">\n          Monto m\u00EDnimo: {{ minAmount | currency: 'COP' : 'symbol-narrow' : '1.0-0' }}\n        </p>\n      </div>\n\n      <div class=\"vip-recharge-modal-notice\">\n        Esta acci\u00F3n generar\u00E1 una orden de compra por el monto indicado. El saldo solo se acreditar\u00E1\n        a la Tarjeta VIP una vez se confirme el pago de esa orden.\n      </div>\n\n      <div class=\"vip-recharge-modal-terms\">\n        <div class=\"vip-recharge-modal-terms-row\">\n          <toggle-switch\n            size=\"sm\"\n            id=\"vip_recharge_terms_accepted\"\n            formControlName=\"terms_accepted\"\n          />\n          <label for=\"vip_recharge_terms_accepted\" class=\"vip-recharge-modal-terms-label\">\n            Acepto los t\u00E9rminos y condiciones y la pol\u00EDtica de privacidad\n          </label>\n        </div>\n\n        <div class=\"vip-recharge-modal-terms-row\">\n          <toggle-switch\n            size=\"sm\"\n            id=\"vip_recharge_data_processing_accepted\"\n            formControlName=\"data_processing_accepted\"\n          />\n          <label for=\"vip_recharge_data_processing_accepted\" class=\"vip-recharge-modal-terms-label\">\n            Autorizo el tratamiento de mis datos personales\n          </label>\n        </div>\n\n        <div class=\"vip-recharge-modal-terms-row\">\n          <toggle-switch\n            size=\"sm\"\n            id=\"vip_recharge_order_notice_accepted\"\n            formControlName=\"order_notice_accepted\"\n          />\n          <label for=\"vip_recharge_order_notice_accepted\" class=\"vip-recharge-modal-terms-label\">\n            Entiendo que esto generar\u00E1 una orden de compra y que el saldo se activar\u00E1 solo cuando se\n            confirme el pago\n          </label>\n        </div>\n      </div>\n    </div>\n\n    <div class=\"vip-recharge-modal-actions\">\n      <app-button\n        type=\"button\"\n        variant=\"tertiary\"\n        text=\"Cancelar\"\n        size=\"sm\"\n        (clicked)=\"onClose()\"\n      />\n\n      <app-button\n        type=\"submit\"\n        size=\"sm\"\n        variant=\"primary\"\n        [text]=\"submitLabel\"\n        [loading]=\"loading\"\n        [disabled]=\"rechargeForm.invalid\"\n      />\n    </div>\n  </form>\n</app-modal>\n", styles: [".vip-recharge-modal{display:flex;flex-flow:column;gap:1rem;width:100%}.vip-recharge-modal-hint{display:inline-flex;margin-top:1rem;font-size:12px;color:#6b7280}.vip-recharge-modal-payment-locked{display:flex;flex-direction:column;gap:2px}.vip-recharge-modal-payment-locked-label{font-size:.75rem;color:#6b7280}.vip-recharge-modal-payment-locked-value{font-size:.875rem;font-weight:600;color:#374151}.vip-recharge-modal-notice{background-color:#fffbeb;border:1px solid #fde68a;color:#92400e;border-radius:.375rem;padding:.75rem;font-size:.75rem;line-height:1.4}.vip-recharge-modal-terms{display:flex;flex-flow:column;gap:.5rem}.vip-recharge-modal-terms-row{display:flex;align-items:center;gap:.5rem}.vip-recharge-modal-terms-label{font-size:.875rem;color:#374151}.vip-recharge-modal-actions{display:flex;justify-content:flex-end;gap:12px;margin-top:1rem}\n"] }]
-        }], ctorParameters: () => [{ type: i1$2.FormBuilder }, { type: i1$3.TranslocoService }], propDecorators: { title: [{
+        }], ctorParameters: () => [{ type: i1$2.FormBuilder }, { type: i2.TranslocoService }], propDecorators: { title: [{
                 type: Input
             }], submitLabel: [{
                 type: Input
@@ -11251,5 +11431,5 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.25", ngImpo
  * Generated bundle index. Do not edit.
  */
 
-export { ADMIN_API_ROUTES, ADMISSION_API_ROUTES, ALERT_ICONS, AdminSelectComponent, AdminService, AdmissionQueueService, ApiService, AppAlertComponent, AppBadgeComponent, AppBreadcumbComponent, AppButtonComponent, AppLinkButtonComponent, AppModalComponent, AsyncSelectComponent, AuditInformationComponent, BASE_BUTTON_CLASSES, BASE_INPUT_CLASSES, BUTTON_SIZES_CLASSES, BUTTON_VARIANT_CLASSES, BaseModalService, BrowserZoomLockService, BulkSaveBarComponent, CITY_API_ENDPOINTS, COUNTRY_API_ENDPOINTS, CUSTOMERS_API_ROUTES, ChangePasswordFormComponent, ChangePasswordFormService, CitiesService, CitySelectComponent, ColorPickerComponent, ConfirmationOrderModalComponent, ConfirmationOrderModalService, CorporateBondStatus, CountrySelectComponent, CountryService, CouponApplicability, CouponDiscountType, CouponStatus, CreatorType, CustomerSelectComponent, CustomerService, DEFAULT_STAGE_CONFIG, DOCUMENT_TYPES_OPTIONS, DateInputComponent, DateService, DaySelectorGridComponent, DeleteConfirmationComponent, DeleteConfirmationService, DynamicTableComponent, ERROR_INPUT_CLASSES, EndDateGreaterThanStartValidator, FORM_ERROR_MESSAGES, FeedbackModalComponent, FeedbackModalService, FileType, FileUploadComponent, FileUploadPreviewComponent, FormEditorComponent, FormInputComponent, FormSelectComponent, FormTextareaComponent, GiftBondPurchaseStatus, GiftBondStatus, IdentityDocumentInputComponent, KONVA_SHAPE_MAPPINGS, LanguageSwitcherComponent, MembershipStatus, MinTodayValidator, MustMatchValidator, NumberInputComponent, ORDER_DISCOUNT_COLORS, ORDER_ITEM_TYPES_COLORS, ORDER_STATUS_COLORS, OrderBillingInfoComponent, OrderDiscountAppliedComponent, OrderInformationComponent, OrderItemType, OrderItemTypeBadgeComponent, OrderItemsComponent, OrderStatus, OrderStatusBadgeComponent, OrderTransactionDetailsModalComponent, OrderTransactionDetailsModalService, OrderTransactionsComponent, PAYMENT_METHODS_OPTIONS, PERFORMANCES_API_ROUTES, PERFORMANCE_STATUS_COLORS, PERFORMANCE_TICKET_STATUS_COLORS, PHONE_COUNTRIES, PRICE_ZONES_API_ROUTES, PRODUCTS_API_ROUTES, PRODUCT_CATEGORIES_API_ROUTES, PRODUCT_TAGS_API_ROUTES, PRODUCT_TYPES_API_ROUTES, PaymentMethod, PendingChangesService, PerformanceBookingDataService, PerformanceCardComponent, PerformanceCardListComponent, PerformanceMultiSelectComponent, PerformanceSelectComponent, PerformanceService, PerformanceStatus, PerformanceStatusBadgeComponent, PerformanceStepperComponent, PerformanceTicketMapComponent, PerformanceTicketStatus, PerformanceTicketStatusBadgeComponent, PerformancesListEventsService, PhoneInputComponent, PriceZoneEventService, PriceZoneFormModalService, PriceZoneSelectComponent, PriceZoneService, ProductCategoryService, ProductMultiSelectComponent, ProductSelectComponent, ProductService, ProductTagService, ProductTypeService, PurchaseLimitService, QuickStatusEditComponent, RoomMapElementOrientation, RoomMapElementType, SHOWS_API_ROUTES, STATE_API_ENDPOINTS, SeatAvailabilitySseService, SeatSelectionEmptySummaryComponent, SeatSelectionSummaryComponent, SeatSelectionSummaryItemComponent, SelectedDiscountCardType, ShowCardComponent, ShowCardSkeletonComponent, ShowMultiSelectComponent, ShowSelectComponent, ShowService, ShowTypeBadgeComponent, ShowsFilterComponent, StateSelectComponent, StatesService, TICKERA_COMPONENTS_CONFIG, TICKET_ELEMENT_TYPES, TICKET_MAP_FLOOR_HOVER_FADE_MS, TICKET_MAP_FLOOR_HOVER_OPACITY, TICKET_MAP_GRID_SIZE, TICKET_MAP_LAST_TICKETS_LIMIT, TICKET_MAP_TITLE_HEIGHT, TICKET_STATUS_COLORS, TICKET_STATUS_FILLS, TICKET_STATUS_LABELS, TIcketMapProductSelectionComponent, TRANSACTION_STATUS_COLORS, TextExpandableComponent, TickeraTranslocoLoader, TicketMapFloorSelectorComponent, TicketMapPriceZonesComponent, TicketMapProductSelectionItemComponent, TicketMapTotalsComponent, TicketMapWidgetComponent, TicketMapWidgetHeaderComponent, TicketMapWrapperComponent, TicketMapZoomControlsComponent, TicketMapZoomService, TicketQrComponent, TicketQrModalComponent, TicketQrModalService, TicketQrService, TicketSelectionDetailsService, TicketSelectionDiscountService, TicketSelectionService, TicketSelectionTotalsService, ToastService, ToggleSwitchComponent, TransactionStatus, VENUES_API_ROUTES, VIP_CARDS_API_ROUTES, VipBalanceCardComponent, VipCardService, VipCardStatus, VipCardStatusBadgeComponent, VipRechargeModalComponent, VipTransactionType, VipTransactionsTableComponent, ZonePriceItemComponent, ZonePriceListComponent, authInterceptor, drawChairIcon$1 as drawChairIcon, drawHappyFace, drawRoundedRect, drawWheelchairIcon, emailValidator, findElementAtPosition, findTicketAtPosition, formatCitiesResponseToSelect, generateExitScene, generateHallwayScene, generateProductionAreaScene, generateSeatBlockScene, generateSeatBlockTicketScene, generateStageScene, generateStairScene, generateTableScene, generateTableTicketScene, generateUnavailableSpaceScene, generateZoneScene, getAdminFullname, getBrowserLanguage, getCustomerFullname, getItemTypeIcon, getOrderDiscount, getStoredLanguage, numberToLetter$1 as numberToLetter, parseJsonToFormDataAdvanced, phoneCountryFlag, processElementsToRenderData, provideTickeraComponents, resolveLanguage, setStoredLanguage, ticketCanOpenQr, tintColor, transformImageToFile, transformUrlParams };
+export { ADMIN_API_ROUTES, ADMISSION_API_ROUTES, ALERT_ICONS, AdminLayoutComponent, AdminNavbarComponent, AdminSelectComponent, AdminService, AdmissionQueueService, ApiService, AppAlertComponent, AppBadgeComponent, AppBreadcumbComponent, AppButtonComponent, AppLinkButtonComponent, AppModalComponent, AsyncSelectComponent, AuditInformationComponent, BASE_BUTTON_CLASSES, BASE_INPUT_CLASSES, BUTTON_SIZES_CLASSES, BUTTON_VARIANT_CLASSES, BaseModalService, BrowserZoomLockService, BulkSaveBarComponent, CITY_API_ENDPOINTS, COUNTRY_API_ENDPOINTS, CUSTOMERS_API_ROUTES, ChangePasswordFormComponent, ChangePasswordFormService, CitiesService, CitySelectComponent, ColorPickerComponent, ConfirmationOrderModalComponent, ConfirmationOrderModalService, CorporateBondStatus, CountrySelectComponent, CountryService, CouponApplicability, CouponDiscountType, CouponStatus, CreatorType, CustomerSelectComponent, CustomerService, DEFAULT_STAGE_CONFIG, DOCUMENT_TYPES_OPTIONS, DateInputComponent, DateService, DaySelectorGridComponent, DeleteConfirmationComponent, DeleteConfirmationService, DynamicTableComponent, ERROR_INPUT_CLASSES, EndDateGreaterThanStartValidator, FORM_ERROR_MESSAGES, FeedbackModalComponent, FeedbackModalService, FileType, FileUploadComponent, FileUploadPreviewComponent, FormEditorComponent, FormInputComponent, FormSelectComponent, FormTextareaComponent, GiftBondPurchaseStatus, GiftBondStatus, IdentityDocumentInputComponent, KONVA_SHAPE_MAPPINGS, LanguageSwitcherComponent, MembershipStatus, MinTodayValidator, MustMatchValidator, NumberInputComponent, ORDER_DISCOUNT_COLORS, ORDER_ITEM_TYPES_COLORS, ORDER_STATUS_COLORS, OrderBillingInfoComponent, OrderDiscountAppliedComponent, OrderInformationComponent, OrderItemType, OrderItemTypeBadgeComponent, OrderItemsComponent, OrderStatus, OrderStatusBadgeComponent, OrderTransactionDetailsModalComponent, OrderTransactionDetailsModalService, OrderTransactionsComponent, PAYMENT_METHODS_OPTIONS, PERFORMANCES_API_ROUTES, PERFORMANCE_STATUS_COLORS, PERFORMANCE_TICKET_STATUS_COLORS, PHONE_COUNTRIES, PRICE_ZONES_API_ROUTES, PRODUCTS_API_ROUTES, PRODUCT_CATEGORIES_API_ROUTES, PRODUCT_TAGS_API_ROUTES, PRODUCT_TYPES_API_ROUTES, PaymentMethod, PendingChangesService, PerformanceBookingDataService, PerformanceCardComponent, PerformanceCardListComponent, PerformanceMultiSelectComponent, PerformanceSelectComponent, PerformanceService, PerformanceStatus, PerformanceStatusBadgeComponent, PerformanceStepperComponent, PerformanceTicketMapComponent, PerformanceTicketStatus, PerformanceTicketStatusBadgeComponent, PerformancesListEventsService, PhoneInputComponent, PriceZoneEventService, PriceZoneFormModalService, PriceZoneSelectComponent, PriceZoneService, ProductCategoryService, ProductMultiSelectComponent, ProductSelectComponent, ProductService, ProductTagService, ProductTypeService, PublicLayoutComponent, PurchaseLimitService, QuickStatusEditComponent, RoomMapElementOrientation, RoomMapElementType, SHOWS_API_ROUTES, STATE_API_ENDPOINTS, SeatAvailabilitySseService, SeatSelectionEmptySummaryComponent, SeatSelectionSummaryComponent, SeatSelectionSummaryItemComponent, SelectedDiscountCardType, ShowCardComponent, ShowCardSkeletonComponent, ShowMultiSelectComponent, ShowSelectComponent, ShowService, ShowTypeBadgeComponent, ShowsFilterComponent, SidebarMenuComponent, SidebarStateService, StateSelectComponent, StatesService, TICKERA_COMPONENTS_CONFIG, TICKET_ELEMENT_TYPES, TICKET_MAP_FLOOR_HOVER_FADE_MS, TICKET_MAP_FLOOR_HOVER_OPACITY, TICKET_MAP_GRID_SIZE, TICKET_MAP_LAST_TICKETS_LIMIT, TICKET_MAP_TITLE_HEIGHT, TICKET_STATUS_COLORS, TICKET_STATUS_FILLS, TICKET_STATUS_LABELS, TIcketMapProductSelectionComponent, TRANSACTION_STATUS_COLORS, TextExpandableComponent, TickeraTranslocoLoader, TicketMapFloorSelectorComponent, TicketMapPriceZonesComponent, TicketMapProductSelectionItemComponent, TicketMapTotalsComponent, TicketMapWidgetComponent, TicketMapWidgetHeaderComponent, TicketMapWrapperComponent, TicketMapZoomControlsComponent, TicketMapZoomService, TicketQrComponent, TicketQrModalComponent, TicketQrModalService, TicketQrService, TicketSelectionDetailsService, TicketSelectionDiscountService, TicketSelectionService, TicketSelectionTotalsService, ToastService, ToggleSwitchComponent, TransactionStatus, VENUES_API_ROUTES, VIP_CARDS_API_ROUTES, VipBalanceCardComponent, VipCardService, VipCardStatus, VipCardStatusBadgeComponent, VipRechargeModalComponent, VipTransactionType, VipTransactionsTableComponent, ZonePriceItemComponent, ZonePriceListComponent, authInterceptor, drawChairIcon$1 as drawChairIcon, drawHappyFace, drawRoundedRect, drawWheelchairIcon, emailValidator, findElementAtPosition, findTicketAtPosition, formatCitiesResponseToSelect, generateExitScene, generateHallwayScene, generateProductionAreaScene, generateSeatBlockScene, generateSeatBlockTicketScene, generateStageScene, generateStairScene, generateTableScene, generateTableTicketScene, generateUnavailableSpaceScene, generateZoneScene, getAdminFullname, getBrowserLanguage, getCustomerFullname, getItemTypeIcon, getOrderDiscount, getStoredLanguage, numberToLetter$1 as numberToLetter, parseJsonToFormDataAdvanced, phoneCountryFlag, processElementsToRenderData, provideTickeraComponents, resolveLanguage, setStoredLanguage, ticketCanOpenQr, tintColor, transformImageToFile, transformUrlParams };
 //# sourceMappingURL=tickera-angular-components.mjs.map