tickera-angular-components 0.0.1-dev.134 → 0.0.1-dev.136

package/fesm2022/tickera-angular-components.mjs

@@ -26,8 +26,8 @@ import QRCode from 'qrcode';
 
 var formErrors$1 = {
 	required: "Este campo es requerido",
-	minlength: "Debe tener al menos {{minLength}} caracteres",
-	maxlength: "No debe exceder {{maxLength}} caracteres",
+	minlength: "Debe tener al menos {{length}} caracteres",
+	maxlength: "No debe exceder {{length}} caracteres",
 	pattern: "El formato no es válido",
 	email: "El formato no es válido",
 	mustMatch: "Las contraseñas no coinciden",
@@ -2445,6 +2445,24 @@ const transformImageToFile = (image) => {
     };
 };
 
+const transformUrlParams = (params) => {
+    const queryParams = new URLSearchParams();
+    Object.entries(params).forEach(([key, value]) => {
+        if (typeof value === 'number') {
+            queryParams.append(key, value.toString());
+        }
+        else if (Array.isArray(value)) {
+            value.forEach((item) => {
+                queryParams.append(key, typeof item === 'number' ? item?.toString() : item);
+            });
+        }
+        else if (typeof value === 'string') {
+            queryParams.append(key, value);
+        }
+    });
+    return queryParams;
+};
+
 const formatCitiesResponseToSelect = (res) => {
     if (!res.data.cities || res.data.cities.length < 1) {
         return [];
@@ -2591,7 +2609,10 @@ class ApiService {
         return throwError(() => error);
     }
     get(path) {
-        return this.http.get(`${this.apiUrl}${path}`).pipe(catchError(this.handleError.bind(this)));
+        const headers = this.getHeaders(this.validateContentType(null));
+        return this.http
+            .get(`${this.apiUrl}${path}`, { headers })
+            .pipe(catchError(this.handleError.bind(this)));
     }
     post(path, body) {
         const headers = this.getHeaders(this.validateContentType(body));
@@ -3358,24 +3379,6 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.25", ngImpo
                 }]
         }], ctorParameters: () => [{ type: ApiService }] });
 
-const transformUrlParams = (params) => {
-    const queryParams = new URLSearchParams();
-    Object.entries(params).forEach(([key, value]) => {
-        if (typeof value === 'number') {
-            queryParams.append(key, value.toString());
-        }
-        else if (Array.isArray(value)) {
-            value.forEach((item) => {
-                queryParams.append(key, typeof item === 'number' ? item?.toString() : item);
-            });
-        }
-        else if (typeof value === 'string') {
-            queryParams.append(key, value);
-        }
-    });
-    return queryParams;
-};
-
 class ProductService {
     apiService;
     productsSubject = new BehaviorSubject([]);
@@ -5455,8 +5458,8 @@ class PhoneInputComponent {
     placeholder = '';
     required = false;
     readonly = false;
-    maxlength = null;
-    minlength = null;
+    maxNationalDigits = null;
+    minNationalDigits = null;
     defaultCountry = 'CO';
     fieldGroupClass = '';
     countries = PHONE_COUNTRIES;
@@ -5469,6 +5472,7 @@ class PhoneInputComponent {
     disabled = false;
     onChange = () => { };
     onTouched = () => { };
+    onValidatorChange = () => { };
     _ngControl;
     constructor(transloco, injector) {
         this.transloco = transloco;
@@ -5495,11 +5499,14 @@ class PhoneInputComponent {
     ngOnChanges(changes) {
         if (changes['required'] ||
             changes['defaultCountry'] ||
-            changes['minlength'] ||
-            changes['maxlength']) {
-            this.ngControl?.control?.updateValueAndValidity();
+            changes['minNationalDigits'] ||
+            changes['maxNationalDigits']) {
+            this.onValidatorChange();
         }
     }
+    registerOnValidatorChange(fn) {
+        this.onValidatorChange = fn;
+    }
     validate(control) {
         if (this.required && !control.value) {
             return { required: true };
@@ -5509,11 +5516,11 @@ class PhoneInputComponent {
         }
         const length = this.nationalDigits(control.value).length;
         const errors = {};
-        if (this.minlength !== null && length < this.minlength) {
-            errors['minlength'] = { requiredLength: this.minlength, actualLength: length };
+        if (this.minNationalDigits !== null && length < this.minNationalDigits) {
+            errors['minlength'] = { requiredLength: this.minNationalDigits, actualLength: length };
         }
-        if (this.maxlength !== null && length > this.maxlength) {
-            errors['maxlength'] = { requiredLength: this.maxlength, actualLength: length };
+        if (this.maxNationalDigits !== null && length > this.maxNationalDigits) {
+            errors['maxlength'] = { requiredLength: this.maxNationalDigits, actualLength: length };
         }
         return Object.keys(errors).length ? errors : null;
     }
@@ -5597,7 +5604,7 @@ class PhoneInputComponent {
     }
     sanitize(value) {
         const digits = value.replace(/\D/g, '');
-        return this.maxlength !== null ? digits.slice(0, this.maxlength) : digits;
+        return this.maxNationalDigits !== null ? digits.slice(0, this.maxNationalDigits) : digits;
     }
     nationalDigits(value) {
         const digits = String(value ?? '').replace(/\D/g, '');
@@ -5605,14 +5612,14 @@ class PhoneInputComponent {
         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 ɵ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", maxlength: "maxlength", minlength: "minlength", defaultCountry: "defaultCountry", fieldGroupClass: "fieldGroupClass" }, providers: [
+    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,
                 useExisting: forwardRef(() => PhoneInputComponent),
                 multi: true,
             },
             { provide: NG_VALIDATORS, useExisting: forwardRef(() => PhoneInputComponent), multi: true },
-        ], usesOnChanges: true, ngImport: i0, 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]=\"minlength\"\n      [attr.maxlength]=\"maxlength\"\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"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1$2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$2.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "ngmodule", type: NgSelectModule }, { kind: "component", type: i3.NgSelectComponent, selector: "ng-select", inputs: ["ariaLabelDropdown", "ariaLabel", "markFirst", "placeholder", "fixedPlaceholder", "notFoundText", "typeToSearchText", "preventToggleOnRightClick", "addTagText", "loadingText", "clearAllText", "dropdownPosition", "appendTo", "outsideClickEvent", "loading", "closeOnSelect", "hideSelected", "selectOnTab", "openOnEnter", "maxSelectedItems", "groupBy", "groupValue", "bufferAmount", "virtualScroll", "selectableGroup", "tabFocusOnClearButton", "selectableGroupAsModel", "searchFn", "trackByFn", "clearOnBackspace", "labelForId", "inputAttrs", "tabIndex", "readonly", "searchWhileComposing", "minTermLength", "editableSearchTerm", "ngClass", "typeahead", "multiple", "addTag", "searchable", "clearable", "deselectOnClick", "clearSearchOnAdd", "compareWith", "keyDownFn", "bindLabel", "bindValue", "appearance", "isOpen", "items"], outputs: ["bindLabelChange", "bindValueChange", "appearanceChange", "isOpenChange", "itemsChange", "blur", "focus", "change", "open", "close", "search", "clear", "add", "remove", "scroll", "scrollToEnd"], exportAs: ["ngSelect"] }, { kind: "directive", type: i3.NgOptionTemplateDirective, selector: "[ng-option-tmp]" }, { kind: "directive", type: i3.NgLabelTemplateDirective, selector: "[ng-label-tmp]" }], encapsulation: i0.ViewEncapsulation.None });
+        ], usesOnChanges: true, ngImport: i0, 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"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1$2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$2.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "ngmodule", type: NgSelectModule }, { kind: "component", type: i3.NgSelectComponent, selector: "ng-select", inputs: ["ariaLabelDropdown", "ariaLabel", "markFirst", "placeholder", "fixedPlaceholder", "notFoundText", "typeToSearchText", "preventToggleOnRightClick", "addTagText", "loadingText", "clearAllText", "dropdownPosition", "appendTo", "outsideClickEvent", "loading", "closeOnSelect", "hideSelected", "selectOnTab", "openOnEnter", "maxSelectedItems", "groupBy", "groupValue", "bufferAmount", "virtualScroll", "selectableGroup", "tabFocusOnClearButton", "selectableGroupAsModel", "searchFn", "trackByFn", "clearOnBackspace", "labelForId", "inputAttrs", "tabIndex", "readonly", "searchWhileComposing", "minTermLength", "editableSearchTerm", "ngClass", "typeahead", "multiple", "addTag", "searchable", "clearable", "deselectOnClick", "clearSearchOnAdd", "compareWith", "keyDownFn", "bindLabel", "bindValue", "appearance", "isOpen", "items"], outputs: ["bindLabelChange", "bindValueChange", "appearanceChange", "isOpenChange", "itemsChange", "blur", "focus", "change", "open", "close", "search", "clear", "add", "remove", "scroll", "scrollToEnd"], exportAs: ["ngSelect"] }, { kind: "directive", type: i3.NgOptionTemplateDirective, selector: "[ng-option-tmp]" }, { kind: "directive", type: i3.NgLabelTemplateDirective, selector: "[ng-label-tmp]" }], encapsulation: i0.ViewEncapsulation.None });
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.25", ngImport: i0, type: PhoneInputComponent, decorators: [{
             type: Component,
@@ -5623,7 +5630,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.25", ngImpo
                             multi: true,
                         },
                         { 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]=\"minlength\"\n      [attr.maxlength]=\"maxlength\"\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"] }]
+                    ], 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: [{
                 type: Input
             }], name: [{
@@ -5636,9 +5643,9 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.25", ngImpo
                 type: Input
             }], readonly: [{
                 type: Input
-            }], maxlength: [{
+            }], maxNationalDigits: [{
                 type: Input
-            }], minlength: [{
+            }], minNationalDigits: [{
                 type: Input
             }], defaultCountry: [{
                 type: Input
@@ -9476,13 +9483,7 @@ class OrderItemsComponent {
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.25", ngImport: i0, type: OrderItemsComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'order-items', standalone: true, imports: [
-                        CommonModule,
-                        AppButtonComponent,
-                        TicketQrModalComponent,
-                        TicketMapWidgetHeaderComponent,
-                        OrderItemTypeBadgeComponent,
-                    ], encapsulation: ViewEncapsulation.None, template: "@if (!!order) {\n  <div class=\"order-items\">\n    <div class=\"order-items__header\">\n      <p class=\"order-items__header-title\">\n        Informaci\u00F3n de los art\u00EDculos comprados ({{ order.order_items.length | number: '1.0' }})\n      </p>\n    </div>\n    <div class=\"order-items__table-container\">\n      <table class=\"order-items__table\">\n        <thead class=\"order-items__table-head\">\n          <tr class=\"order-items__table-head-row\">\n            <th class=\"order-items__table-head-cell\">Tipo</th>\n            <th class=\"order-items__table-head-cell\">Descripci\u00F3n</th>\n\n            <th class=\"order-items__table-head-cell text-right\">Cant.</th>\n            <th class=\"order-items__table-head-cell text-right\">Precio</th>\n            <th class=\"order-items__table-head-cell text-right\">Total</th>\n            @if (showActionColumn) {\n              <th class=\"order-items__table-head-cell\">Acciones</th>\n            }\n          </tr>\n        </thead>\n        <tbody class=\"order-items__table-body\">\n          @for (item of order.order_items; track $index) {\n            <tr class=\"order-items__table-body-row\">\n              <td class=\"order-items__table-body-cell\">\n                <order-item-type-badge [item]=\"item\" size=\"xs\" />\n              </td>\n\n              <td class=\"order-items__table-body-cell\">\n                {{ item.description }}\n              </td>\n\n              <td class=\"order-items__table-body-cell text-right\">\n                {{ item.quantity }}\n              </td>\n\n              <td class=\"order-items__table-body-cell text-right\">\n                ${{ item.normal_price | number: '1.0-2' }}\n              </td>\n\n              <td class=\"order-items__table-body-cell text-right\">\n                <strong>\n                  ${{ itemTotal(item.quantity, item.normal_price) | number: '1.0-2' }}\n                </strong>\n              </td>\n\n              @if (item.ticket_uuid && order.status === 'completed' && showActionColumn) {\n                <td class=\"order-items__table-body-cell actions\">\n                  <app-button\n                    text=\"Ver ticket\"\n                    size=\"xs\"\n                    icon=\"ri-eye-line\"\n                    (clicked)=\"openTicketQr(item.ticket_uuid!, item.description)\"\n                  />\n                </td>\n              }\n            </tr>\n          }\n        </tbody>\n      </table>\n    </div>\n\n    <div class=\"order-items__totals\">\n      <dl class=\"order-items__totals-container\">\n        @if (giftBonds.length > 0 && totals.giftBonds > 0) {\n          <div class=\"order-items__totals-item\">\n            <dt class=\"order-items__totals-item-title\">Bonos de regalo ({{ giftBonds.length }})</dt>\n            <dd class=\"order-items__totals-item-value\">\n              @if (totals.giftBonds > 0) {\n                <span class=\"text-gray-900\"> ${{ totals.giftBonds | number: '1.0-2' }} </span>\n              }\n            </dd>\n          </div>\n        }\n\n        @if (corporateBonds.length > 0 && totals.corporateBonds > 0) {\n          <div class=\"order-items__totals-item\">\n            <dt class=\"order-items__totals-item-title\">\n              Bonos corporativos ({{ corporateBonds.length }})\n            </dt>\n            <dd class=\"order-items__totals-item-value\">\n              @if (totals.corporateBonds > 0) {\n                <span class=\"text-gray-900\"> ${{ totals.corporateBonds | number: '1.0-2' }} </span>\n              }\n            </dd>\n          </div>\n        }\n\n        @if (tickets.length > 0 && totals.tickets > 0) {\n          <div class=\"order-items__totals-item\">\n            <dt class=\"order-items__totals-item-title\">Entradas ({{ tickets.length }})</dt>\n            <dd class=\"order-items__totals-item-value\">\n              @if (totals.tickets > 0) {\n                <span class=\"text-gray-900\"> ${{ totals.tickets | number: '1.0-2' }} </span>\n              }\n            </dd>\n          </div>\n        }\n\n        @if (products.length > 0 && totals.products > 0) {\n          <div class=\"order-items__totals-item\">\n            <dt class=\"order-items__totals-item-title\">Productos</dt>\n            <dd class=\"order-items__totals-item-value\">\n              @if (totals.products > 0) {\n                <span class=\"text-gray-900\"> ${{ totals.products | number: '1.0-2' }} </span>\n              }\n            </dd>\n          </div>\n        }\n\n        @if (order.service_fee && order.service_fee > 0) {\n          <div class=\"order-items__totals-item\">\n            <dt class=\"order-items__totals-item-title\">Tarifa de servicio</dt>\n            <dd class=\"order-items__totals-item-value\">\n              <span class=\"text-gray-900\"> ${{ order.service_fee | number: '1.0-2' }} </span>\n            </dd>\n          </div>\n        }\n\n        @if (hasDiscount()) {\n          <div class=\"order-items__totals-item\">\n            <dt class=\"order-items__totals-item-title\">Descuento</dt>\n            <dd class=\"order-items__totals-item-title\">\n              $-{{ order.discount_amount | number: '1.0-2' }}\n            </dd>\n          </div>\n        }\n\n        <div class=\"order-items__totals-item total-item\">\n          <dt class=\"order-items__totals-item-total\">Total</dt>\n          <dd class=\"order-items__totals-item-value\">\n            @if (!hasDiscount()) {\n              <span class=\"order-items__totals-item-total\">\n                ${{ order.total | number: '1.0-2' }}\n              </span>\n            }\n            @if (hasDiscount()) {\n              <span class=\"order-items__totals-item-discount-wrapper\">\n                <span class=\"order-items__totals-item-discount\">\n                  ${{ order.total | number: '1.0-2' }}\n                </span>\n                <span class=\"order-items__totals-item-total\">\n                  ${{ order.total_discounted | number: '1.0-2' }}\n                </span>\n              </span>\n            }\n          </dd>\n        </div>\n      </dl>\n    </div>\n  </div>\n\n  <ticket-qr-modal />\n}\n", styles: [".order-items{background-color:#fff;border-radius:.5rem;border:1px solid #f3f4f6;box-sizing:border-box;overflow:hidden;position:relative;width:100%}.order-items__header{align-items:center;display:flex;flex-flow:row wrap;gap:1rem;padding:1rem;width:100%}.order-items__header-title{color:#6b7280;font-size:.875rem;font-weight:700;margin:0}.order-items__table-container{overflow-x:auto}.order-items__table{border-collapse:collapse;font-size:.875rem;width:100%}.order-items__table-head-row{background-color:#f9fafb;text-align:left}.order-items__table-head-cell{color:#6b7280;font-size:.75rem;font-weight:700;padding:.75rem 1.5rem;text-transform:uppercase}.order-items__table-head-cell.text-right{text-align:right}.order-items__table-body>:not(:last-child){border-bottom:1px solid #f9fafb}.order-items__table-body-row{transition:all .4s ease}.order-items__table-body-row:hover{background-color:#f9fafb}.order-items__table-body-cell{color:#374151;padding:.75rem 1.5rem;white-space:nowrap}.order-items__table-body-cell.text-right{text-align:right}.order-items__totals{background-color:#f9fafb;border-top:1px solid #f3f4f6;padding:1rem 1.5rem;width:100%}.order-items__totals-container{display:flex;flex-flow:column;gap:.5rem;margin-left:auto;max-width:20rem;width:100%}.order-items__totals-item{display:flex;font-size:.875rem;justify-content:space-between;width:100%}.order-items__totals-item.actions{text-align:left}.order-items__totals-item.total-item{border-top:1px solid #e5e7eb;padding-top:.5rem}.order-items__totals-item-title{color:#6b7280}.order-items__totals-item-total{color:#111827;font-size:1.125rem;font-weight:700;line-height:100%}.order-items__totals-item-discount-wrapper{align-items:flex-end;display:flex;flex-flow:column nowrap;width:100%}.order-items__totals-item-discount{color:#9ca3af;font-size:.75rem;text-decoration:line-through}\n"] }]
+            args: [{ selector: 'order-items', standalone: true, imports: [CommonModule, AppButtonComponent, TicketQrModalComponent, OrderItemTypeBadgeComponent], encapsulation: ViewEncapsulation.None, template: "@if (!!order) {\n  <div class=\"order-items\">\n    <div class=\"order-items__header\">\n      <p class=\"order-items__header-title\">\n        Informaci\u00F3n de los art\u00EDculos comprados ({{ order.order_items.length | number: '1.0' }})\n      </p>\n    </div>\n    <div class=\"order-items__table-container\">\n      <table class=\"order-items__table\">\n        <thead class=\"order-items__table-head\">\n          <tr class=\"order-items__table-head-row\">\n            <th class=\"order-items__table-head-cell\">Tipo</th>\n            <th class=\"order-items__table-head-cell\">Descripci\u00F3n</th>\n\n            <th class=\"order-items__table-head-cell text-right\">Cant.</th>\n            <th class=\"order-items__table-head-cell text-right\">Precio</th>\n            <th class=\"order-items__table-head-cell text-right\">Total</th>\n            @if (showActionColumn) {\n              <th class=\"order-items__table-head-cell\">Acciones</th>\n            }\n          </tr>\n        </thead>\n        <tbody class=\"order-items__table-body\">\n          @for (item of order.order_items; track $index) {\n            <tr class=\"order-items__table-body-row\">\n              <td class=\"order-items__table-body-cell\">\n                <order-item-type-badge [item]=\"item\" size=\"xs\" />\n              </td>\n\n              <td class=\"order-items__table-body-cell\">\n                {{ item.description }}\n              </td>\n\n              <td class=\"order-items__table-body-cell text-right\">\n                {{ item.quantity }}\n              </td>\n\n              <td class=\"order-items__table-body-cell text-right\">\n                ${{ item.normal_price | number: '1.0-2' }}\n              </td>\n\n              <td class=\"order-items__table-body-cell text-right\">\n                <strong>\n                  ${{ itemTotal(item.quantity, item.normal_price) | number: '1.0-2' }}\n                </strong>\n              </td>\n\n              @if (item.ticket_uuid && order.status === 'completed' && showActionColumn) {\n                <td class=\"order-items__table-body-cell actions\">\n                  <app-button\n                    text=\"Ver ticket\"\n                    size=\"xs\"\n                    icon=\"ri-eye-line\"\n                    (clicked)=\"openTicketQr(item.ticket_uuid!, item.description)\"\n                  />\n                </td>\n              }\n            </tr>\n          }\n        </tbody>\n      </table>\n    </div>\n\n    <div class=\"order-items__totals\">\n      <dl class=\"order-items__totals-container\">\n        @if (giftBonds.length > 0 && totals.giftBonds > 0) {\n          <div class=\"order-items__totals-item\">\n            <dt class=\"order-items__totals-item-title\">Bonos de regalo ({{ giftBonds.length }})</dt>\n            <dd class=\"order-items__totals-item-value\">\n              @if (totals.giftBonds > 0) {\n                <span class=\"text-gray-900\"> ${{ totals.giftBonds | number: '1.0-2' }} </span>\n              }\n            </dd>\n          </div>\n        }\n\n        @if (corporateBonds.length > 0 && totals.corporateBonds > 0) {\n          <div class=\"order-items__totals-item\">\n            <dt class=\"order-items__totals-item-title\">\n              Bonos corporativos ({{ corporateBonds.length }})\n            </dt>\n            <dd class=\"order-items__totals-item-value\">\n              @if (totals.corporateBonds > 0) {\n                <span class=\"text-gray-900\"> ${{ totals.corporateBonds | number: '1.0-2' }} </span>\n              }\n            </dd>\n          </div>\n        }\n\n        @if (tickets.length > 0 && totals.tickets > 0) {\n          <div class=\"order-items__totals-item\">\n            <dt class=\"order-items__totals-item-title\">Entradas ({{ tickets.length }})</dt>\n            <dd class=\"order-items__totals-item-value\">\n              @if (totals.tickets > 0) {\n                <span class=\"text-gray-900\"> ${{ totals.tickets | number: '1.0-2' }} </span>\n              }\n            </dd>\n          </div>\n        }\n\n        @if (products.length > 0 && totals.products > 0) {\n          <div class=\"order-items__totals-item\">\n            <dt class=\"order-items__totals-item-title\">Productos</dt>\n            <dd class=\"order-items__totals-item-value\">\n              @if (totals.products > 0) {\n                <span class=\"text-gray-900\"> ${{ totals.products | number: '1.0-2' }} </span>\n              }\n            </dd>\n          </div>\n        }\n\n        @if (order.service_fee && order.service_fee > 0) {\n          <div class=\"order-items__totals-item\">\n            <dt class=\"order-items__totals-item-title\">Tarifa de servicio</dt>\n            <dd class=\"order-items__totals-item-value\">\n              <span class=\"text-gray-900\"> ${{ order.service_fee | number: '1.0-2' }} </span>\n            </dd>\n          </div>\n        }\n\n        @if (hasDiscount()) {\n          <div class=\"order-items__totals-item\">\n            <dt class=\"order-items__totals-item-title\">Descuento</dt>\n            <dd class=\"order-items__totals-item-title\">\n              $-{{ order.discount_amount | number: '1.0-2' }}\n            </dd>\n          </div>\n        }\n\n        <div class=\"order-items__totals-item total-item\">\n          <dt class=\"order-items__totals-item-total\">Total</dt>\n          <dd class=\"order-items__totals-item-value\">\n            @if (!hasDiscount()) {\n              <span class=\"order-items__totals-item-total\">\n                ${{ order.total | number: '1.0-2' }}\n              </span>\n            }\n            @if (hasDiscount()) {\n              <span class=\"order-items__totals-item-discount-wrapper\">\n                <span class=\"order-items__totals-item-discount\">\n                  ${{ order.total | number: '1.0-2' }}\n                </span>\n                <span class=\"order-items__totals-item-total\">\n                  ${{ order.total_discounted | number: '1.0-2' }}\n                </span>\n              </span>\n            }\n          </dd>\n        </div>\n      </dl>\n    </div>\n  </div>\n\n  <ticket-qr-modal />\n}\n", styles: [".order-items{background-color:#fff;border-radius:.5rem;border:1px solid #f3f4f6;box-sizing:border-box;overflow:hidden;position:relative;width:100%}.order-items__header{align-items:center;display:flex;flex-flow:row wrap;gap:1rem;padding:1rem;width:100%}.order-items__header-title{color:#6b7280;font-size:.875rem;font-weight:700;margin:0}.order-items__table-container{overflow-x:auto}.order-items__table{border-collapse:collapse;font-size:.875rem;width:100%}.order-items__table-head-row{background-color:#f9fafb;text-align:left}.order-items__table-head-cell{color:#6b7280;font-size:.75rem;font-weight:700;padding:.75rem 1.5rem;text-transform:uppercase}.order-items__table-head-cell.text-right{text-align:right}.order-items__table-body>:not(:last-child){border-bottom:1px solid #f9fafb}.order-items__table-body-row{transition:all .4s ease}.order-items__table-body-row:hover{background-color:#f9fafb}.order-items__table-body-cell{color:#374151;padding:.75rem 1.5rem;white-space:nowrap}.order-items__table-body-cell.text-right{text-align:right}.order-items__totals{background-color:#f9fafb;border-top:1px solid #f3f4f6;padding:1rem 1.5rem;width:100%}.order-items__totals-container{display:flex;flex-flow:column;gap:.5rem;margin-left:auto;max-width:20rem;width:100%}.order-items__totals-item{display:flex;font-size:.875rem;justify-content:space-between;width:100%}.order-items__totals-item.actions{text-align:left}.order-items__totals-item.total-item{border-top:1px solid #e5e7eb;padding-top:.5rem}.order-items__totals-item-title{color:#6b7280}.order-items__totals-item-total{color:#111827;font-size:1.125rem;font-weight:700;line-height:100%}.order-items__totals-item-discount-wrapper{align-items:flex-end;display:flex;flex-flow:column nowrap;width:100%}.order-items__totals-item-discount{color:#9ca3af;font-size:.75rem;text-decoration:line-through}\n"] }]
         }], ctorParameters: () => [{ type: TicketQrModalService }], propDecorators: { order: [{
                 type: Input,
                 args: [{ required: true }]
@@ -9782,5 +9783,5 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.25", ngImpo
  * Generated bundle index. Do not edit.
  */
 
-export { ADMIN_API_ROUTES, ALERT_ICONS, AdminSelectComponent, AdminService, ApiService, AppAlertComponent, AppBadgeComponent, AppBreadcumbComponent, AppButtonComponent, AppLinkButtonComponent, AppModalComponent, AsyncSelectComponent, AuditInformationComponent, BASE_BUTTON_CLASSES, BASE_INPUT_CLASSES, BUTTON_SIZES_CLASSES, BUTTON_VARIANT_CLASSES, BaseModalService, 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, 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, PerformanceBookingDataService, PerformanceCardComponent, PerformanceCardListComponent, PerformanceMultiSelectComponent, PerformanceSelectComponent, PerformanceService, PerformanceStatus, PerformanceStatusBadgeComponent, PerformanceStepperComponent, PerformanceTicketMapComponent, PerformanceTicketStatus, PerformanceTicketStatusBadgeComponent, PerformancesListEventsService, PhoneInputComponent, PriceZoneEventService, PriceZoneFormModalService, PriceZoneSelectComponent, PriceZoneService, ProductCategoryService, ProductMultiSelectComponent, ProductSelectComponent, ProductService, ProductTagService, ProductTypeService, RoomMapElementOrientation, RoomMapElementType, SHOWS_API_ROUTES, SHOW_TYPE_COLORS, STATE_API_ENDPOINTS, SeatSelectionEmptySummaryComponent, SeatSelectionSummaryComponent, SeatSelectionSummaryItemComponent, SelectedDiscountCardType, ShowCardComponent, ShowCardSkeletonComponent, ShowMultiSelectComponent, ShowSelectComponent, ShowService, ShowType, ShowTypeBadgeComponent, ShowsFilterComponent, StateSelectComponent, StatesService, TICKERA_COMPONENTS_CONFIG, TICKET_ELEMENT_TYPES, 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, 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, findElementAtPosition, findTicketAtPosition, formatCitiesResponseToSelect, generateExitScene, generateHallwayScene, generateProductionAreaScene, generateSeatBlockScene, generateSeatBlockTicketScene, generateStageScene, generateStairScene, generateTableScene, generateTableTicketScene, generateUnavailableSpaceScene, generateZoneScene, getBrowserLanguage, getCustomerFullname, getItemTypeIcon, getOrderDiscount, getStoredLanguage, numberToLetter$1 as numberToLetter, parseJsonToFormDataAdvanced, phoneCountryFlag, processElementsToRenderData, provideTickeraComponents, resolveLanguage, setStoredLanguage, tintColor, transformImageToFile };
+export { ADMIN_API_ROUTES, ALERT_ICONS, AdminSelectComponent, AdminService, ApiService, AppAlertComponent, AppBadgeComponent, AppBreadcumbComponent, AppButtonComponent, AppLinkButtonComponent, AppModalComponent, AsyncSelectComponent, AuditInformationComponent, BASE_BUTTON_CLASSES, BASE_INPUT_CLASSES, BUTTON_SIZES_CLASSES, BUTTON_VARIANT_CLASSES, BaseModalService, 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, 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, PerformanceBookingDataService, PerformanceCardComponent, PerformanceCardListComponent, PerformanceMultiSelectComponent, PerformanceSelectComponent, PerformanceService, PerformanceStatus, PerformanceStatusBadgeComponent, PerformanceStepperComponent, PerformanceTicketMapComponent, PerformanceTicketStatus, PerformanceTicketStatusBadgeComponent, PerformancesListEventsService, PhoneInputComponent, PriceZoneEventService, PriceZoneFormModalService, PriceZoneSelectComponent, PriceZoneService, ProductCategoryService, ProductMultiSelectComponent, ProductSelectComponent, ProductService, ProductTagService, ProductTypeService, RoomMapElementOrientation, RoomMapElementType, SHOWS_API_ROUTES, SHOW_TYPE_COLORS, STATE_API_ENDPOINTS, SeatSelectionEmptySummaryComponent, SeatSelectionSummaryComponent, SeatSelectionSummaryItemComponent, SelectedDiscountCardType, ShowCardComponent, ShowCardSkeletonComponent, ShowMultiSelectComponent, ShowSelectComponent, ShowService, ShowType, ShowTypeBadgeComponent, ShowsFilterComponent, StateSelectComponent, StatesService, TICKERA_COMPONENTS_CONFIG, TICKET_ELEMENT_TYPES, 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, 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, findElementAtPosition, findTicketAtPosition, formatCitiesResponseToSelect, generateExitScene, generateHallwayScene, generateProductionAreaScene, generateSeatBlockScene, generateSeatBlockTicketScene, generateStageScene, generateStairScene, generateTableScene, generateTableTicketScene, generateUnavailableSpaceScene, generateZoneScene, getBrowserLanguage, getCustomerFullname, getItemTypeIcon, getOrderDiscount, getStoredLanguage, numberToLetter$1 as numberToLetter, parseJsonToFormDataAdvanced, phoneCountryFlag, processElementsToRenderData, provideTickeraComponents, resolveLanguage, setStoredLanguage, tintColor, transformImageToFile, transformUrlParams };
 //# sourceMappingURL=tickera-angular-components.mjs.map