@testgorilla/tgo-ui 11.0.2 → 11.0.4

package/fesm2022/testgorilla-tgo-ui-components-field.mjs

@@ -464,10 +464,10 @@ class FieldComponent {
             btn.focus('keyboard');
         }, 0);
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.18", ngImport: i0, type: FieldComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.18", type: FieldComponent, isStandalone: true, selector: "ui-field", inputs: { fullWidth: { classPropertyName: "fullWidth", publicName: "fullWidth", isSignal: false, isRequired: false, transformFunction: null }, fullHeight: { classPropertyName: "fullHeight", publicName: "fullHeight", isSignal: false, isRequired: false, transformFunction: null }, label: { classPropertyName: "label", publicName: "label", isSignal: false, isRequired: false, transformFunction: null }, labelHtml: { classPropertyName: "labelHtml", publicName: "labelHtml", isSignal: true, isRequired: false, transformFunction: null }, labelIcon: { classPropertyName: "labelIcon", publicName: "labelIcon", isSignal: false, isRequired: false, transformFunction: null }, fieldName: { classPropertyName: "fieldName", publicName: "fieldName", isSignal: false, isRequired: false, transformFunction: null }, placeholder: { classPropertyName: "placeholder", publicName: "placeholder", isSignal: false, isRequired: false, transformFunction: null }, id: { classPropertyName: "id", publicName: "id", isSignal: true, isRequired: false, transformFunction: null }, value: { classPropertyName: "value", publicName: "value", isSignal: false, isRequired: false, transformFunction: null }, badgeVariant: { classPropertyName: "badgeVariant", publicName: "badgeVariant", isSignal: false, isRequired: false, transformFunction: null }, errors: { classPropertyName: "errors", publicName: "errors", isSignal: false, isRequired: false, transformFunction: null }, disabled: { classPropertyName: "disabled", publicName: "disabled", isSignal: false, isRequired: false, transformFunction: null }, required: { classPropertyName: "required", publicName: "required", isSignal: false, isRequired: false, transformFunction: null }, readOnly: { classPropertyName: "readOnly", publicName: "readOnly", isSignal: false, isRequired: false, transformFunction: null }, hintMessage: { classPropertyName: "hintMessage", publicName: "hintMessage", isSignal: false, isRequired: false, transformFunction: null }, type: { classPropertyName: "type", publicName: "type", isSignal: false, isRequired: false, transformFunction: null }, updateOnBlur: { classPropertyName: "updateOnBlur", publicName: "updateOnBlur", isSignal: false, isRequired: false, transformFunction: null }, allowOnlyDigits: { classPropertyName: "allowOnlyDigits", publicName: "allowOnlyDigits", isSignal: false, isRequired: false, transformFunction: null }, isAutocompleteOff: { classPropertyName: "isAutocompleteOff", publicName: "isAutocompleteOff", isSignal: false, isRequired: false, transformFunction: null }, allowNegative: { classPropertyName: "allowNegative", publicName: "allowNegative", isSignal: false, isRequired: false, transformFunction: null }, showBottomContent: { classPropertyName: "showBottomContent", publicName: "showBottomContent", isSignal: false, isRequired: false, transformFunction: null }, applicationTheme: { classPropertyName: "applicationTheme", publicName: "applicationTheme", isSignal: false, isRequired: false, transformFunction: null }, ariaLabel: { classPropertyName: "ariaLabel", publicName: "ariaLabel", isSignal: false, isRequired: false, transformFunction: null }, loading: { classPropertyName: "loading", publicName: "loading", isSignal: false, isRequired: false, transformFunction: null }, isValid: { classPropertyName: "isValid", publicName: "isValid", isSignal: false, isRequired: false, transformFunction: null }, maxCharacters: { classPropertyName: "maxCharacters", publicName: "maxCharacters", isSignal: false, isRequired: false, transformFunction: null }, trimOnBlur: { classPropertyName: "trimOnBlur", publicName: "trimOnBlur", isSignal: false, isRequired: false, transformFunction: null }, trimOnSubmit: { classPropertyName: "trimOnSubmit", publicName: "trimOnSubmit", isSignal: false, isRequired: false, transformFunction: null }, maxRows: { classPropertyName: "maxRows", publicName: "maxRows", isSignal: false, isRequired: false, transformFunction: null }, hasTextAreaCounter: { classPropertyName: "hasTextAreaCounter", publicName: "hasTextAreaCounter", isSignal: false, isRequired: false, transformFunction: null }, hideBuiltInErrors: { classPropertyName: "hideBuiltInErrors", publicName: "hideBuiltInErrors", isSignal: false, isRequired: false, transformFunction: null }, hideLabelInErrors: { classPropertyName: "hideLabelInErrors", publicName: "hideLabelInErrors", isSignal: false, isRequired: false, transformFunction: null }, max: { classPropertyName: "max", publicName: "max", isSignal: false, isRequired: false, transformFunction: null }, min: { classPropertyName: "min", publicName: "min", isSignal: false, isRequired: false, transformFunction: null }, textareaHeight: { classPropertyName: "textareaHeight", publicName: "textareaHeight", isSignal: false, isRequired: false, transformFunction: null }, borderless: { classPropertyName: "borderless", publicName: "borderless", isSignal: false, isRequired: false, transformFunction: null }, autosizableTextarea: { classPropertyName: "autosizableTextarea", publicName: "autosizableTextarea", isSignal: false, isRequired: false, transformFunction: null }, isAIVariant: { classPropertyName: "isAIVariant", publicName: "isAIVariant", isSignal: false, isRequired: false, transformFunction: null }, ariaLabelledby: { classPropertyName: "ariaLabelledby", publicName: "ariaLabelledby", isSignal: true, isRequired: false, transformFunction: null }, ariaDescribedby: { classPropertyName: "ariaDescribedby", publicName: "ariaDescribedby", isSignal: true, isRequired: false, transformFunction: null }, hasError: { classPropertyName: "hasError", publicName: "hasError", isSignal: false, isRequired: false, transformFunction: null } }, outputs: { validateEvent: "validateEvent", fieldBlur: "fieldBlur" }, host: { properties: { "class": "this.class", "class.full-width": "this.fullWidth", "class.full-height": "this.fullHeight", "attr.field-class": "this.type", "attr.theme": "this.applicationTheme" } }, viewQueries: [{ propertyName: "field", first: true, predicate: ["inputElement"], descendants: true, read: ElementRef }, { propertyName: "autosize", first: true, predicate: ["autosize"], descendants: true }], ngImport: i0, template: "<ng-container>\n  <mat-form-field\n    [ngStyle]=\"{\n      '--textarea-height': textareaHeight - 10 + 'px',\n      '--textarea-height-container': textareaHeight + 'px',\n    }\"\n    #uiField\n    appearance=\"outline\"\n    hideRequiredMarker=\"true\"\n    [color]=\"errorsLength || (ngControl?.errors && ngControl?.touched) || hasError ? 'warn' : 'accent'\"\n    [ngClass]=\"{\n      'hide-bottom-content': !showBottomContent,\n      textarea: type === 'textarea' || type === 'textarea-scrollable',\n      'textarea-scrollable': type === 'textarea-scrollable',\n      'multi-line': type === 'multi-line',\n      'multi-line-textarea': type === 'multi-line' && autosizableTextarea && borderless,\n      'keyboard-focused': keyboardFocused(),\n      'has-label': !!label,\n      'has-value': !!value,\n      'text-area-borderless': borderless && (type === 'textarea' || type === 'textarea-scrollable'),\n    }\"\n    (mouseenter)=\"onActive(true, 'hover')\"\n    (mouseleave)=\"onActive(false, 'hover')\"\n  >\n    <span [style.display]=\"'none'\" [id]=\"ariaDescribedbyId()\">\n      @if (required) {\n        <span>{{ 'ERRORS.REQUIRED' | uiTranslate | async }}</span>\n      }\n      {{ ariaDescribedby() }}\n    </span>\n    <span [style.display]=\"'none'\" [id]=\"ariaLabelledbyId()\">\n      {{ ariaLabelledby() ?? label }}\n    </span>\n    @if (\n      (label || labelHtml()) &&\n      ((type !== 'search' && applicationTheme === 'classic') || applicationTheme !== 'classic')\n    ) {\n      <mat-label class=\"label-with-icon\">\n        @if (isAIVariant || labelIcon) {\n          <ui-icon [name]=\"isAIVariant ? 'Sparkle-in-line' : labelIcon!\" [size]=\"'16'\" class=\"label-icon\"></ui-icon>\n        }\n        <span>\n          @if (labelHtml()) {\n            <span [innerHTML]=\"labelHtml()\"></span>\n          } @else {\n            {{ label }}\n          }\n          @if (required) {\n            <span>*</span>\n          }\n        </span>\n      </mat-label>\n    }\n    @if (type === 'search' || type === 'collapsed-search') {\n      <mat-icon matIconPrefix class=\"search-icon\" [svgIcon]=\"'Search'\"></mat-icon>\n    }\n    @if (type !== 'textarea' && type !== 'textarea-scrollable' && type !== 'multi-line') {\n      <input\n        data-testid=\"field-input\"\n        [readonly]=\"readOnly\"\n        matInput\n        #inputElement\n        (blur)=\"onTouch(); onActive(false, 'focus'); onBlur()\"\n        (input)=\"onInput($event)\"\n        [id]=\"id()\"\n        (keyup)=\"onChangeInputSearch()\"\n        [placeholder]=\"placeholder!\"\n        [value]=\"value\"\n        [disabled]=\"disabled || loading\"\n        [type]=\"currentType\"\n        (keyup.enter)=\"onSubmit()\"\n        [max]=\"max\"\n        [min]=\"min\"\n        [name]=\"fieldName!\"\n        [required]=\"required\"\n        [attr.aria-label]=\"ariaLabel\"\n        [attr.aria-invalid]=\"errorsLength || (ngControl?.errors && ngControl?.touched) || hasError\"\n        [attr.aria-labelledby]=\"ariaLabelledbyId()\"\n        [attr.aria-describedby]=\"ariaDescribedbyId()\"\n        role=\"textbox\"\n        digitsOnly\n        [autocomplete]=\"isAutocompleteOff ? 'off' : 'on'\"\n        [allowOnlyDigits]=\"allowOnlyDigits\"\n        [allowNegative]=\"allowNegative\"\n        (focusin)=\"onActive(true, 'focus')\"\n      />\n    } @else {\n      <textarea\n        matInput\n        #inputElement\n        #autosize=\"cdkTextareaAutosize\"\n        [readonly]=\"readOnly\"\n        (blur)=\"onTouch(); onActive(false, 'focus'); onBlur()\"\n        (input)=\"onInput($event)\"\n        [id]=\"id()\"\n        (keyup)=\"onChangeInputSearch()\"\n        (keyup.enter)=\"onSubmit()\"\n        [placeholder]=\"placeholder!\"\n        [value]=\"value\"\n        [disabled]=\"disabled\"\n        [name]=\"fieldName!\"\n        [required]=\"required\"\n        [attr.aria-label]=\"!label ? ariaLabel : ''\"\n        [attr.aria-invalid]=\"errorsLength || (ngControl?.errors && ngControl?.touched) || hasError\"\n        [attr.aria-labelledby]=\"ariaLabelledbyId()\"\n        [attr.aria-describedby]=\"ariaDescribedbyId()\"\n        role=\"textbox\"\n        [cdkTextareaAutosize]=\"type === 'multi-line'\"\n        [cdkAutosizeMinRows]=\"type === 'multi-line' ? 1 : 5\"\n        [cdkAutosizeMaxRows]=\"type === 'multi-line' ? maxRows : 5\"\n        [attr.maxlength]=\"maxCharacters\"\n        (focusin)=\"onActive(true, 'focus')\"\n      ></textarea>\n    }\n\n    @if (type === 'search' || type === 'collapsed-search' || type === 'password' || type === 'validation-text') {\n      <div class=\"options\">\n        <div class=\"options-container\">\n          @if (showClose) {\n            <ui-button\n              variant=\"secondary\"\n              [justIcon]=\"true\"\n              class=\"close\"\n              iconName=\"Close\"\n              [label]=\"('COMMON.CLEAR' | uiTranslate | async)!\"\n              (buttonClickEvent)=\"clearValue()\"\n              [ariaLabel]=\"ariaLabel + '--' + ('COMMON.CLEAR' | uiTranslate | async)\"\n            ></ui-button>\n          }\n          @if (type === 'password') {\n            <ui-button\n              class=\"password\"\n              variant=\"secondary\"\n              [tooltip]=\"((showPassword ? 'FIELD.HIDE_PASSWORD' : 'FIELD.SHOW_PASSWORD') | uiTranslate | async)!\"\n              [justIcon]=\"true\"\n              role=\"switch\"\n              [attr.aria-checked]=\"showPassword\"\n              [iconName]=\"getPasswordIcon\"\n              [applicationTheme]=\"applicationTheme\"\n              (click)=\"showPasswordClick()\"\n              #btn\n              (keydown.enter)=\"refocusPasswordButton(btn)\"\n              (keydown.space)=\"refocusPasswordButton(btn)\"\n            ></ui-button>\n          }\n          @if (\n            type === 'validation-text' && (applicationTheme === 'dark' || applicationTheme === 'light') && value.length\n          ) {\n            @if (!isValid) {\n              <ui-button\n                class=\"validation\"\n                [variant]=\"'text'\"\n                [applicationTheme]=\"'light'\"\n                [label]=\"'Validate'\"\n                [loading]=\"loading\"\n                (click)=\"validate()\"\n                [disabled]=\"disabled\"\n                [size]=\"'small'\"\n              ></ui-button>\n            }\n            @if (isValid) {\n              <ui-icon class=\"valid\" [color]=\"'white'\" applicationTheme=\"light\" [name]=\"'Check'\"></ui-icon>\n            }\n          }\n        </div>\n      </div>\n    }\n    @if (\n      hasTextAreaCounter &&\n      (type === 'textarea' || type === 'textarea-scrollable') &&\n      !errorsLength &&\n      !(ngControl?.errors | hasValidationError)\n    ) {\n      <mat-hint class=\"info\">{{ value.length }} / {{ maxCharacters }}</mat-hint>\n    }\n\n    @if (\n      hintMessage &&\n      !errorsLength &&\n      !(ngControl?.errors | hasValidationError) &&\n      type !== 'textarea' &&\n      type !== 'textarea-scrollable'\n    ) {\n      <mat-hint class=\"info\">{{ hintMessage }}</mat-hint>\n    }\n\n    @if (errorsLength || (ngControl?.errors | hasValidationError)) {\n      <mat-hint class=\"error\">\n        @if (errorsLength) {\n          @for (error of _errors; track trackByFn($index, error)) {\n            <div class=\"errors\">\n              <ui-icon [applicationTheme]=\"applicationTheme\" [name]=\"'Error'\"></ui-icon>\n              <span [innerHTML]=\"error\"></span>\n            </div>\n          }\n        }\n        @if (ngControl && !hideBuiltInErrors) {\n          <ui-validation-error [ngControl]=\"ngControl\" [label]=\"hideLabelInErrors ? null : label\"></ui-validation-error>\n        }\n      </mat-hint>\n    }\n\n    @if (badgeVariant) {\n      <ui-badge class=\"field-badge\" [variant]=\"badgeVariant\"></ui-badge>\n    }\n  </mat-form-field>\n</ng-container>\n", styles: [".bg-teal-60b{background:#1c443c}.bg-teal-30b{background:#31766a}.bg-teal-default{background:#46a997}.bg-teal-30w{background:#7ec3b6}.bg-teal-60w{background:#b5ddd5}.bg-teal-secondary{background:#cbd6cb}.bg-teal-90w{background:#ecf6f5}.bg-petrol-60b{background:#102930}.bg-petrol-30b{background:#1b4754}.bg-petrol-default{background:#276678}.bg-petrol-30w{background:#6894a0}.bg-petrol-60w{background:#a9c2c9}.bg-petrol-secondary{background:#c8d7de}.bg-petrol-90w{background:#e9f0f1}.bg-error-60b{background:#513131}.bg-error-30b{background:#8e5655}.bg-error-60w{background:#e3c3c6}.bg-error-secondary{background:#f0dad9}.bg-error-default{background:#cb7b7a}.bg-warning-secondary{background:#f0d6bb}.bg-warning-default{background:#cca45f}.bg-black{background:#000}.bg-dark{background:#888}.bg-medium{background:#e0e0e0}.bg-grey{background:#ededed}.bg-light{background:#f6f6f6}.bg-white{background:#fff}.bg-box-shadow{background:#00000014}.bg-navigation-subtitle{background:#528593}.bgc-teal-60b{background-color:#1c443c}.bgc-teal-30b{background-color:#31766a}.bgc-teal-default{background-color:#46a997}.bgc-teal-30w{background-color:#7ec3b6}.bgc-teal-60w{background-color:#b5ddd5}.bgc-teal-secondary{background-color:#cbd6cb}.bgc-teal-90w{background-color:#ecf6f5}.bgc-petrol-60b{background-color:#102930}.bgc-petrol-30b{background-color:#1b4754}.bgc-petrol-default{background-color:#276678}.bgc-petrol-30w{background-color:#6894a0}.bgc-petrol-60w{background-color:#a9c2c9}.bgc-petrol-secondary{background-color:#c8d7de}.bgc-petrol-90w{background-color:#e9f0f1}.bgc-error-60b{background-color:#513131}.bgc-error-30b{background-color:#8e5655}.bgc-error-60w{background-color:#e3c3c6}.bgc-error-secondary{background-color:#f0dad9}.bgc-error-default{background-color:#cb7b7a}.bgc-warning-secondary{background-color:#f0d6bb}.bgc-warning-default{background-color:#cca45f}.bgc-black{background-color:#000}.bgc-dark{background-color:#888}.bgc-medium{background-color:#e0e0e0}.bgc-grey{background-color:#ededed}.bgc-light{background-color:#f6f6f6}.bgc-white{background-color:#fff}.bgc-box-shadow{background-color:#00000014}.bgc-navigation-subtitle{background-color:#528593}.label-with-icon ui-icon{display:inline-block;vertical-align:middle;margin-right:4px}.label-with-icon>span{vertical-align:middle}.mat-mdc-form-field.mat-form-field-appearance-outline.mat-warn .label-with-icon .label-icon mat-icon svg{color:#e02800!important}.mat-mdc-form-field.mat-form-field-appearance-outline:not(.mat-warn):hover .mat-mdc-floating-label:not(.mdc-floating-label--float-above) .label-with-icon .label-icon mat-icon svg{color:#919191!important}.mat-mdc-form-field.mat-form-field-appearance-outline:not(.mat-warn) .mat-mdc-floating-label.mdc-floating-label--float-above .label-with-icon .label-icon mat-icon svg{color:#000!important}.mat-mdc-form-field.keyboard-focused{position:relative}.mat-mdc-form-field.keyboard-focused .mat-mdc-text-field-wrapper:after{content:\"\";position:absolute;top:0;border-radius:10px;left:0;width:100%;height:100%;outline:2px solid #ffffff;z-index:-1}.mat-mdc-form-field.keyboard-focused .mat-mdc-form-field-subscript-wrapper{z-index:-1}.mat-mdc-form-field.has-label .mdc-notched-outline__notch{position:relative}.mat-mdc-form-field.has-label .mdc-notched-outline__notch:after{content:\"\";position:absolute;top:0;left:0;background:#fff;width:100%;height:5px;z-index:-1}.active-field .mdc-notched-outline__leading,.ui-field[theme=dark] .mat-mdc-form-field.mat-form-field-appearance-outline .mat-mdc-text-field-wrapper:hover .mdc-notched-outline__leading,.ui-field[theme=dark] .mat-mdc-form-field.mat-form-field-appearance-outline .mat-mdc-text-field-wrapper.mdc-text-field--focused .mdc-notched-outline__leading,.ui-field[theme=light] .mat-mdc-form-field.mat-form-field-appearance-outline .mat-mdc-text-field-wrapper:hover .mdc-notched-outline__leading,.ui-field[theme=light] .mat-mdc-form-field.mat-form-field-appearance-outline .mat-mdc-text-field-wrapper.mdc-text-field--focused .mdc-notched-outline__leading,.ui-field .mat-mdc-form-field.mat-form-field-appearance-outline.mat-warn .mat-mdc-text-field-wrapper:hover .mdc-notched-outline__leading,.ui-field .mat-mdc-form-field.mat-form-field-appearance-outline:not(.mat-warn) .mat-mdc-text-field-wrapper:hover .mdc-notched-outline__leading{border-left-width:2px;border-top-width:2px;border-bottom-width:2px}.active-field .mdc-notched-outline__notch,.ui-field[theme=dark] .mat-mdc-form-field.mat-form-field-appearance-outline .mat-mdc-text-field-wrapper:hover .mdc-notched-outline__notch,.ui-field[theme=dark] .mat-mdc-form-field.mat-form-field-appearance-outline .mat-mdc-text-field-wrapper.mdc-text-field--focused .mdc-notched-outline__notch,.ui-field[theme=light] .mat-mdc-form-field.mat-form-field-appearance-outline .mat-mdc-text-field-wrapper:hover .mdc-notched-outline__notch,.ui-field[theme=light] .mat-mdc-form-field.mat-form-field-appearance-outline .mat-mdc-text-field-wrapper.mdc-text-field--focused .mdc-notched-outline__notch,.ui-field .mat-mdc-form-field.mat-form-field-appearance-outline.mat-warn .mat-mdc-text-field-wrapper:hover .mdc-notched-outline__notch,.ui-field .mat-mdc-form-field.mat-form-field-appearance-outline:not(.mat-warn) .mat-mdc-text-field-wrapper:hover .mdc-notched-outline__notch{border-top-width:2px;border-bottom-width:2px}.active-field .mdc-notched-outline__trailing,.ui-field[theme=dark] .mat-mdc-form-field.mat-form-field-appearance-outline .mat-mdc-text-field-wrapper:hover .mdc-notched-outline__trailing,.ui-field[theme=dark] .mat-mdc-form-field.mat-form-field-appearance-outline .mat-mdc-text-field-wrapper.mdc-text-field--focused .mdc-notched-outline__trailing,.ui-field[theme=light] .mat-mdc-form-field.mat-form-field-appearance-outline .mat-mdc-text-field-wrapper:hover .mdc-notched-outline__trailing,.ui-field[theme=light] .mat-mdc-form-field.mat-form-field-appearance-outline .mat-mdc-text-field-wrapper.mdc-text-field--focused .mdc-notched-outline__trailing,.ui-field .mat-mdc-form-field.mat-form-field-appearance-outline.mat-warn .mat-mdc-text-field-wrapper:hover .mdc-notched-outline__trailing,.ui-field .mat-mdc-form-field.mat-form-field-appearance-outline:not(.mat-warn) .mat-mdc-text-field-wrapper:hover .mdc-notched-outline__trailing{border-top-width:2px;border-bottom-width:2px;border-right-width:2px}.ui-field{display:block;width:320px}.ui-field.full-width{width:100%}.ui-field[field-class=textarea-scrollable]{min-width:370px}.ui-field[field-class=textarea-scrollable] .mat-mdc-form-field .mdc-notched-outline__notch .mat-mdc-floating-label{max-width:560px;padding:0 4px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.ui-field.full-height{height:100%}.ui-field.full-height mat-form-field{height:100%}.ui-field.full-height mat-form-field .mat-mdc-form-field-flex{height:100%}.ui-field.full-height mat-form-field .mat-mdc-form-field-flex .mat-mdc-form-field-infix{height:100%}.ui-field.full-height mat-form-field .mat-mdc-form-field-flex .mat-mdc-form-field-infix textarea{max-height:100%!important;height:100%!important}.ui-field[field-class=collapsed-search] mat-form-field:not(.mat-focused):not(.has-value){width:56px!important}.ui-field[field-class=collapsed-search] mat-form-field:not(.mat-focused):not(.has-value) .mat-mdc-floating-label{display:none!important}.ui-field[field-class=collapsed-search] mat-form-field:not(.mat-focused):not(.has-value) .mat-mdc-form-field-subscript-wrapper .mat-mdc-form-field-hint-wrapper{position:relative;width:100vw!important}.ui-field .mat-mdc-form-field-subscript-wrapper{margin:0!important}.ui-field[field-class=search][theme=classic] .mat-mdc-form-field:hover.mat-form-field-appearance-outline .mdc-notched-outline__notch,.ui-field[field-class=search][theme=classic] .mat-mdc-form-field.mat-form-field-appearance-outline.mat-focused .mdc-notched-outline__notch{border-top:2px solid #276678!important}.ui-field[field-class=search][theme=classic] .mat-mdc-form-field.mat-form-field-appearance-outline .mdc-notched-outline__notch{border-top:1px solid var(--mdc-outlined-text-field-outline-color)!important}.ui-field[field-class=search][theme=dark] .mat-mdc-form-field.mat-form-field-appearance-outline .mat-mdc-text-field-wrapper .mat-mdc-form-field-flex .mat-mdc-floating-label.mdc-floating-label--float-above,.ui-field[field-class=search][theme=light] .mat-mdc-form-field.mat-form-field-appearance-outline .mat-mdc-text-field-wrapper .mat-mdc-form-field-flex .mat-mdc-floating-label.mdc-floating-label--float-above{top:28px!important}.ui-field[field-class=search][theme=dark] .mat-mdc-form-field.mat-form-field-appearance-outline .mat-mdc-text-field-wrapper:hover .mat-mdc-form-field-flex .mat-mdc-floating-label:not(.mdc-floating-label--float-above),.ui-field[field-class=search][theme=light] .mat-mdc-form-field.mat-form-field-appearance-outline .mat-mdc-text-field-wrapper:hover .mat-mdc-form-field-flex .mat-mdc-floating-label:not(.mdc-floating-label--float-above){top:21px!important}.ui-field input[type=search]::-webkit-search-decoration,.ui-field input[type=search]::-webkit-search-cancel-button,.ui-field input[type=search]::-webkit-search-results-button,.ui-field input[type=search]::-webkit-search-results-decoration{display:none}.ui-field .mat-mdc-form-field{margin-top:0;width:100%}.ui-field .mat-mdc-form-field.hide-bottom-content .mat-mdc-form-field-subscript-wrapper{display:none}.ui-field .mat-mdc-form-field.multi-line .mat-mdc-text-field-wrapper{height:auto!important}.ui-field .mat-mdc-form-field.multi-line .mat-mdc-form-field-infix{min-height:48px!important}.ui-field .mat-mdc-form-field.multi-line textarea{margin-top:8px;min-height:32px!important}.ui-field .mat-mdc-form-field.multi-line-textarea .mat-mdc-text-field-wrapper{height:auto!important}.ui-field .mat-mdc-form-field.multi-line-textarea .mat-mdc-form-field-infix{min-height:48px!important}.ui-field .mat-mdc-form-field.multi-line-textarea textarea{margin-top:0;min-height:48px!important}.ui-field .mat-mdc-form-field.textarea .mat-mdc-text-field-wrapper{height:var(--textarea-height-container)!important}.ui-field .mat-mdc-form-field.textarea textarea{max-height:var(--textarea-height)!important;min-height:var(--textarea-height)!important;padding-top:8px}.ui-field .mat-mdc-form-field.textarea-scrollable .mat-mdc-text-field-wrapper{height:auto!important;min-height:var(--textarea-height-container)!important;padding:0!important;position:relative}.ui-field .mat-mdc-form-field.textarea-scrollable .mat-mdc-text-field-wrapper:after{content:\"\";position:absolute;bottom:8px;right:8px;width:9px;height:9px;background-image:url(\"data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='9' height='9' viewBox='0 0 9 9' fill='none'%3E%3Cline x1='0.646447' y1='8.64645' x2='8.64645' y2='0.646446' stroke='%23242424'/%3E%3Cline x1='3.64645' y1='8.64645' x2='8.64645' y2='3.64645' stroke='%23242424'/%3E%3C/svg%3E\");background-repeat:no-repeat;background-position:center;pointer-events:none;z-index:1}.ui-field .mat-mdc-form-field.textarea-scrollable .mat-mdc-form-field-flex{padding:0!important}.ui-field .mat-mdc-form-field.textarea-scrollable .mat-mdc-form-field-infix{padding:0;position:relative}.ui-field .mat-mdc-form-field.textarea-scrollable textarea{min-height:var(--textarea-height)!important;height:auto;max-height:none!important;box-sizing:border-box;overflow-x:hidden;overflow-y:auto;padding:12px 5px 12px 16px;margin-right:7px;resize:vertical;scrollbar-color:#d3d3d3 transparent;scrollbar-width:thin;word-break:break-word;overflow-wrap:break-word}.ui-field .mat-mdc-form-field.textarea-scrollable textarea::-webkit-scrollbar{width:4px}.ui-field .mat-mdc-form-field.textarea-scrollable textarea::-webkit-scrollbar-track{background:transparent;margin-top:11px;margin-bottom:17px}.ui-field .mat-mdc-form-field.textarea-scrollable textarea::-webkit-scrollbar-thumb{background-color:#d3d3d3;border-radius:999px}.ui-field .mat-mdc-form-field.textarea-scrollable textarea::-webkit-resizer{display:none}.ui-field .mat-mdc-form-field.mat-form-field-appearance-outline:not(.mat-warn) .mat-mdc-text-field-wrapper:hover .mat-mdc-form-field-flex .mat-mdc-floating-label:not(.mdc-floating-label--float-above){top:21px!important}.ui-field .mat-mdc-form-field.mat-form-field-appearance-outline:not(.mat-warn) .mat-mdc-text-field-wrapper:hover .mdc-notched-outline__leading,.ui-field .mat-mdc-form-field.mat-form-field-appearance-outline:not(.mat-warn) .mat-mdc-text-field-wrapper:hover .mdc-notched-outline__notch,.ui-field .mat-mdc-form-field.mat-form-field-appearance-outline:not(.mat-warn) .mat-mdc-text-field-wrapper:hover .mdc-notched-outline__trailing{border-color:#276678!important}.ui-field .mat-mdc-form-field.mat-form-field-appearance-outline.mat-warn .mat-mdc-text-field-wrapper:hover .mat-mdc-form-field-flex .mat-mdc-floating-label:not(.mdc-floating-label--float-above){top:21px!important}.ui-field .mat-mdc-form-field.mat-form-field-appearance-outline.mat-warn .mat-mdc-text-field-wrapper:hover .mdc-notched-outline__leading,.ui-field .mat-mdc-form-field.mat-form-field-appearance-outline.mat-warn .mat-mdc-text-field-wrapper:hover .mdc-notched-outline__notch,.ui-field .mat-mdc-form-field.mat-form-field-appearance-outline.mat-warn .mat-mdc-text-field-wrapper:hover .mdc-notched-outline__trailing{border-color:#cb7b7a!important}.ui-field .mat-mdc-form-field.mat-form-field-appearance-outline .mat-mdc-text-field-wrapper{height:48px}.ui-field .mat-mdc-form-field.mat-form-field-appearance-outline .mat-mdc-text-field-wrapper .mat-mdc-form-field-flex .mat-mdc-floating-label{background:#fff!important;top:22px}.ui-field .mat-mdc-form-field.mat-form-field-appearance-outline .mdc-notched-outline{color:#888}.ui-field .mat-mdc-form-field.mat-form-field-appearance-outline .mdc-notched-outline .mdc-floating-label--float-above{transform:translateY(-30px) scale(.75);margin-left:1px}.ui-field .mat-mdc-form-field.mat-form-field-appearance-outline .mat-mdc-form-field-infix{min-height:48px;padding:4px 0;line-height:22px;display:inline-flex;align-items:center}.ui-field .mat-mdc-form-field.mat-form-field-appearance-outline .mat-mdc-form-field-subscript-wrapper{padding:0 0 12px;margin-top:4px;font-size:12px;line-height:16px;position:relative}.ui-field .mat-mdc-form-field.mat-form-field-appearance-outline .mat-mdc-form-field-subscript-wrapper .mat-form-field-hint-spacer{display:none}.ui-field .mat-mdc-form-field.mat-form-field-appearance-outline .mat-mdc-form-field-hint.info{color:#888;width:100%;text-align:right}.ui-field .mat-mdc-form-field.mat-form-field-appearance-outline .mat-mdc-form-field-bottom-align:before{height:0}.ui-field .mat-mdc-form-field.mat-form-field-appearance-outline .mat-mdc-form-field-hint-wrapper{position:relative;padding:0}.ui-field .mat-mdc-form-field.mat-form-field-appearance-outline .mat-mdc-form-field-hint.error,.ui-field .mat-mdc-form-field.mat-form-field-appearance-outline .mat-mdc-form-field-hint.error svg{color:#cb7b7a}.ui-field .mat-mdc-form-field.mat-form-field-appearance-outline .mat-mdc-form-field-icon-prefix,.ui-field .mat-mdc-form-field.mat-form-field-appearance-outline .mat-mdc-form-field-icon-suffix{padding:0}.ui-field .mat-mdc-form-field.mat-form-field-appearance-outline .search-icon{padding:12px 8px 12px 16px;color:#888;--icon-color: #888888}.ui-field .mat-mdc-form-field.mat-form-field-appearance-outline .mat-mdc-form-field-hint.error{display:flex}.ui-field .mat-mdc-form-field.mat-warn.mat-form-field-appearance-outline:not(.mdc-text-field--disabled) .mat-mdc-form-field-flex:hover .mdc-notched-outline .mdc-notched-outline__leading,.ui-field .mat-mdc-form-field.mat-warn.mat-form-field-appearance-outline:not(.mdc-text-field--disabled) .mat-mdc-form-field-flex:hover .mdc-notched-outline .mdc-notched-outline__trailing,.ui-field .mat-mdc-form-field.mat-warn.mat-form-field-appearance-outline:not(.mdc-text-field--disabled) .mat-mdc-form-field-flex:hover .mdc-notched-outline .mdc-notched-outline__notch{border-color:#cb7b7a}.ui-field .mat-mdc-form-field.mat-warn.mat-form-field-appearance-outline .mdc-notched-outline .mdc-notched-outline__leading,.ui-field .mat-mdc-form-field.mat-warn.mat-form-field-appearance-outline .mdc-notched-outline .mdc-notched-outline__trailing,.ui-field .mat-mdc-form-field.mat-warn.mat-form-field-appearance-outline .mdc-notched-outline .mdc-notched-outline__notch{border-color:#cb7b7a}.ui-field .mat-mdc-form-field.mat-warn.mat-focused .mat-mdc-text-field-wrapper .mat-mdc-form-field-flex .mat-mdc-form-field-infix .mat-form-field-label mat-label{color:#cb7b7a}.ui-field .mat-mdc-form-field.mat-accent.mat-form-field-appearance-outline:not(.mat-form-field-disabled) .mat-mdc-form-field-flex:hover .mdc-notched-outline{color:#276678}.ui-field .mat-mdc-form-field.mat-accent.mat-form-field-appearance-outline:not(.mat-form-field-disabled) .mat-mdc-form-field-flex:hover .options .options-container ui-button.search svg,.ui-field .mat-mdc-form-field.mat-accent.mat-form-field-appearance-outline:not(.mat-form-field-disabled) .mat-mdc-form-field-flex:hover .options .options-container ui-button.password svg{color:#276678}.ui-field .mat-mdc-form-field.mat-accent.mat-focused .mat-mdc-text-field-wrapper .mat-mdc-form-field-flex .mat-mdc-form-field-infix .mat-form-field-label mat-label{color:#276678}.ui-field .mat-mdc-form-field.mat-accent.mat-focused .options .options-container ui-button svg,.ui-field .mat-mdc-form-field.mat-accent.mat-focused .options .options-container ui-icon svg{color:#276678}.ui-field .mat-mdc-form-field.mat-accent.mat-focused .options .options-container ui-button.close svg{color:#888}.ui-field .mat-mdc-form-field .options .options-container{display:flex;column-gap:8px;padding-left:8px}.ui-field .mat-mdc-form-field .options .options-container ui-button.password{width:24px!important}.ui-field .mat-mdc-form-field .options .options-container ui-button.password .button-wrapper .button-container button,.ui-field .mat-mdc-form-field .options .options-container ui-button.password .button-wrapper .button-container span{width:24px!important;height:24px!important}.ui-field .mat-mdc-form-field .options .options-container ui-icon.valid mat-icon{background:#3c9a13;border-radius:100%}.ui-field .mat-mdc-form-field .options .options-container ui-icon.valid mat-icon svg{color:#fff!important}.ui-field .mat-mdc-form-field .options .options-container ui-button.validation svg circle{stroke:#d410aa}.ui-field .mat-mdc-form-field .options .options-container ui-button.validation *{color:#d410aa}.ui-field .mat-mdc-form-field .options .options-container ui-button,.ui-field .mat-mdc-form-field .options .options-container ui-icon{display:flex}.ui-field .mat-mdc-form-field .options .options-container ui-button svg,.ui-field .mat-mdc-form-field .options .options-container ui-icon svg{color:#888}.ui-field .mat-mdc-form-field .options ui-button button.secondary.only-icon{padding:0;height:auto;background:transparent}.ui-field .mat-mdc-form-field .options ui-button button.secondary.only-icon:hover,.ui-field .mat-mdc-form-field .options ui-button button.secondary.only-icon:focus{background:transparent;color:inherit;border:none;outline:none}.ui-field .mat-mdc-form-field.mat-form-field-disabled .mat-mdc-input-element,.ui-field .mat-mdc-form-field.mat-form-field-disabled .mdc-floating-label{pointer-events:none}.ui-field .mat-mdc-form-field.mat-form-field-disabled.mat-form-field-appearance-outline .mdc-notched-outline{color:#e0e0e0}.ui-field .mat-mdc-form-field.mat-form-field-disabled .options .options-container ui-button svg,.ui-field .mat-mdc-form-field.mat-form-field-disabled .options .options-container ui-icon svg{color:#e0e0e0}.ui-field[theme=dark] .mat-mdc-form-field.mat-form-field-appearance-outline .mat-mdc-text-field-wrapper,.ui-field[theme=light] .mat-mdc-form-field.mat-form-field-appearance-outline .mat-mdc-text-field-wrapper{height:48px}.ui-field[theme=dark] .mat-mdc-form-field.mat-form-field-appearance-outline .mat-mdc-text-field-wrapper.mdc-text-field--disabled .mdc-notched-outline__notch label,.ui-field[theme=light] .mat-mdc-form-field.mat-form-field-appearance-outline .mat-mdc-text-field-wrapper.mdc-text-field--disabled .mdc-notched-outline__notch label{color:#e9e9e9!important}.ui-field[theme=dark] .mat-mdc-form-field.mat-form-field-appearance-outline .mat-mdc-text-field-wrapper .mat-mdc-form-field-flex .mat-mdc-floating-label.mdc-floating-label--float-above,.ui-field[theme=light] .mat-mdc-form-field.mat-form-field-appearance-outline .mat-mdc-text-field-wrapper .mat-mdc-form-field-flex .mat-mdc-floating-label.mdc-floating-label--float-above{color:#242424!important}.ui-field[theme=dark] .mat-mdc-form-field.mat-form-field-appearance-outline .mat-mdc-text-field-wrapper .mdc-notched-outline__leading,.ui-field[theme=light] .mat-mdc-form-field.mat-form-field-appearance-outline .mat-mdc-text-field-wrapper .mdc-notched-outline__leading{border-top-left-radius:10px;border-bottom-left-radius:10px}.ui-field[theme=dark] .mat-mdc-form-field.mat-form-field-appearance-outline .mat-mdc-text-field-wrapper .mdc-notched-outline__trailing,.ui-field[theme=light] .mat-mdc-form-field.mat-form-field-appearance-outline .mat-mdc-text-field-wrapper .mdc-notched-outline__trailing{border-top-right-radius:10px;border-bottom-right-radius:10px}.ui-field[theme=dark] .mat-mdc-form-field.mat-form-field-appearance-outline .mat-mdc-text-field-wrapper:hover .mat-mdc-form-field-icon-prefix svg,.ui-field[theme=light] .mat-mdc-form-field.mat-form-field-appearance-outline .mat-mdc-text-field-wrapper:hover .mat-mdc-form-field-icon-prefix svg{color:#242424!important}.ui-field[theme=dark] .mat-mdc-form-field.mat-form-field-appearance-outline .mat-mdc-text-field-wrapper:hover .password .icon-only-wrapper svg,.ui-field[theme=light] .mat-mdc-form-field.mat-form-field-appearance-outline .mat-mdc-text-field-wrapper:hover .password .icon-only-wrapper svg{color:#242424!important}.ui-field[theme=dark] .mat-mdc-form-field.mat-form-field-appearance-outline .mat-mdc-text-field-wrapper:hover .mat-mdc-form-field-flex .mat-mdc-floating-label:not(.mdc-floating-label--float-above),.ui-field[theme=light] .mat-mdc-form-field.mat-form-field-appearance-outline .mat-mdc-text-field-wrapper:hover .mat-mdc-form-field-flex .mat-mdc-floating-label:not(.mdc-floating-label--float-above){top:21px!important}.ui-field[theme=dark] .mat-mdc-form-field.mat-form-field-appearance-outline .mat-mdc-text-field-wrapper:hover .mat-mdc-form-field-icon-prefix svg,.ui-field[theme=dark] .mat-mdc-form-field.mat-form-field-appearance-outline .mat-mdc-text-field-wrapper.mdc-text-field--focused .mat-mdc-form-field-icon-prefix svg,.ui-field[theme=light] .mat-mdc-form-field.mat-form-field-appearance-outline .mat-mdc-text-field-wrapper:hover .mat-mdc-form-field-icon-prefix svg,.ui-field[theme=light] .mat-mdc-form-field.mat-form-field-appearance-outline .mat-mdc-text-field-wrapper.mdc-text-field--focused .mat-mdc-form-field-icon-prefix svg{color:#242424!important}.ui-field[theme=dark] .mat-mdc-form-field.mat-form-field-appearance-outline .mat-mdc-text-field-wrapper:hover .mdc-notched-outline__leading,.ui-field[theme=dark] .mat-mdc-form-field.mat-form-field-appearance-outline .mat-mdc-text-field-wrapper:hover .mdc-notched-outline__notch,.ui-field[theme=dark] .mat-mdc-form-field.mat-form-field-appearance-outline .mat-mdc-text-field-wrapper:hover .mdc-notched-outline__trailing,.ui-field[theme=dark] .mat-mdc-form-field.mat-form-field-appearance-outline .mat-mdc-text-field-wrapper.mdc-text-field--focused .mdc-notched-outline__leading,.ui-field[theme=dark] .mat-mdc-form-field.mat-form-field-appearance-outline .mat-mdc-text-field-wrapper.mdc-text-field--focused .mdc-notched-outline__notch,.ui-field[theme=dark] .mat-mdc-form-field.mat-form-field-appearance-outline .mat-mdc-text-field-wrapper.mdc-text-field--focused .mdc-notched-outline__trailing,.ui-field[theme=light] .mat-mdc-form-field.mat-form-field-appearance-outline .mat-mdc-text-field-wrapper:hover .mdc-notched-outline__leading,.ui-field[theme=light] .mat-mdc-form-field.mat-form-field-appearance-outline .mat-mdc-text-field-wrapper:hover .mdc-notched-outline__notch,.ui-field[theme=light] .mat-mdc-form-field.mat-form-field-appearance-outline .mat-mdc-text-field-wrapper:hover .mdc-notched-outline__trailing,.ui-field[theme=light] .mat-mdc-form-field.mat-form-field-appearance-outline .mat-mdc-text-field-wrapper.mdc-text-field--focused .mdc-notched-outline__leading,.ui-field[theme=light] .mat-mdc-form-field.mat-form-field-appearance-outline .mat-mdc-text-field-wrapper.mdc-text-field--focused .mdc-notched-outline__notch,.ui-field[theme=light] .mat-mdc-form-field.mat-form-field-appearance-outline .mat-mdc-text-field-wrapper.mdc-text-field--focused .mdc-notched-outline__trailing{border-color:#242424!important}.ui-field[theme=dark] .mat-mdc-form-field.mat-form-field-appearance-outline .mat-mdc-text-field-wrapper:hover .mat-mdc-form-field-flex .mat-mdc-floating-label.mdc-floating-label--float-above,.ui-field[theme=dark] .mat-mdc-form-field.mat-form-field-appearance-outline .mat-mdc-text-field-wrapper.mdc-text-field--focused .mat-mdc-form-field-flex .mat-mdc-floating-label.mdc-floating-label--float-above,.ui-field[theme=light] .mat-mdc-form-field.mat-form-field-appearance-outline .mat-mdc-text-field-wrapper:hover .mat-mdc-form-field-flex .mat-mdc-floating-label.mdc-floating-label--float-above,.ui-field[theme=light] .mat-mdc-form-field.mat-form-field-appearance-outline .mat-mdc-text-field-wrapper.mdc-text-field--focused .mat-mdc-form-field-flex .mat-mdc-floating-label.mdc-floating-label--float-above{color:#242424!important}.ui-field[theme=dark] .mat-mdc-form-field.mat-form-field-appearance-outline.mat-warn .mat-mdc-form-field-hint.error,.ui-field[theme=light] .mat-mdc-form-field.mat-form-field-appearance-outline.mat-warn .mat-mdc-form-field-hint.error{color:#e02800!important}.ui-field[theme=dark] .mat-mdc-form-field.mat-form-field-appearance-outline.mat-warn .mat-mdc-form-field-hint.error svg,.ui-field[theme=light] .mat-mdc-form-field.mat-form-field-appearance-outline.mat-warn .mat-mdc-form-field-hint.error svg{color:#e02800!important}.ui-field[theme=dark] .mat-mdc-form-field.mat-form-field-appearance-outline.mat-warn .mat-mdc-form-field-flex .mat-mdc-floating-label.mdc-floating-label--float-above,.ui-field[theme=light] .mat-mdc-form-field.mat-form-field-appearance-outline.mat-warn .mat-mdc-form-field-flex .mat-mdc-floating-label.mdc-floating-label--float-above{color:#e02800!important}.ui-field[theme=dark] .mat-mdc-form-field.mat-form-field-appearance-outline.mat-warn .mat-mdc-text-field-wrapper .mdc-notched-outline__leading,.ui-field[theme=dark] .mat-mdc-form-field.mat-form-field-appearance-outline.mat-warn .mat-mdc-text-field-wrapper .mdc-notched-outline__notch,.ui-field[theme=dark] .mat-mdc-form-field.mat-form-field-appearance-outline.mat-warn .mat-mdc-text-field-wrapper .mdc-notched-outline__trailing,.ui-field[theme=light] .mat-mdc-form-field.mat-form-field-appearance-outline.mat-warn .mat-mdc-text-field-wrapper .mdc-notched-outline__leading,.ui-field[theme=light] .mat-mdc-form-field.mat-form-field-appearance-outline.mat-warn .mat-mdc-text-field-wrapper .mdc-notched-outline__notch,.ui-field[theme=light] .mat-mdc-form-field.mat-form-field-appearance-outline.mat-warn .mat-mdc-text-field-wrapper .mdc-notched-outline__trailing{border-color:#e02800!important}.ui-field[theme=dark] .mat-mdc-form-field.mat-form-field-appearance-outline.mat-warn .mat-mdc-text-field-wrapper:hover .mat-mdc-form-field-icon-prefix svg,.ui-field[theme=dark] .mat-mdc-form-field.mat-form-field-appearance-outline.mat-warn .mat-mdc-text-field-wrapper.mdc-text-field--focused .mat-mdc-form-field-icon-prefix svg,.ui-field[theme=light] .mat-mdc-form-field.mat-form-field-appearance-outline.mat-warn .mat-mdc-text-field-wrapper:hover .mat-mdc-form-field-icon-prefix svg,.ui-field[theme=light] .mat-mdc-form-field.mat-form-field-appearance-outline.mat-warn .mat-mdc-text-field-wrapper.mdc-text-field--focused .mat-mdc-form-field-icon-prefix svg{color:#e02800!important}.ui-field[theme=dark] .mat-mdc-form-field.mat-form-field-appearance-outline.mat-warn .mat-mdc-text-field-wrapper:hover .mdc-notched-outline__leading,.ui-field[theme=dark] .mat-mdc-form-field.mat-form-field-appearance-outline.mat-warn .mat-mdc-text-field-wrapper:hover .mdc-notched-outline__notch,.ui-field[theme=dark] .mat-mdc-form-field.mat-form-field-appearance-outline.mat-warn .mat-mdc-text-field-wrapper:hover .mdc-notched-outline__trailing,.ui-field[theme=dark] .mat-mdc-form-field.mat-form-field-appearance-outline.mat-warn .mat-mdc-text-field-wrapper.mdc-text-field--focused .mdc-notched-outline__leading,.ui-field[theme=dark] .mat-mdc-form-field.mat-form-field-appearance-outline.mat-warn .mat-mdc-text-field-wrapper.mdc-text-field--focused .mdc-notched-outline__notch,.ui-field[theme=dark] .mat-mdc-form-field.mat-form-field-appearance-outline.mat-warn .mat-mdc-text-field-wrapper.mdc-text-field--focused .mdc-notched-outline__trailing,.ui-field[theme=light] .mat-mdc-form-field.mat-form-field-appearance-outline.mat-warn .mat-mdc-text-field-wrapper:hover .mdc-notched-outline__leading,.ui-field[theme=light] .mat-mdc-form-field.mat-form-field-appearance-outline.mat-warn .mat-mdc-text-field-wrapper:hover .mdc-notched-outline__notch,.ui-field[theme=light] .mat-mdc-form-field.mat-form-field-appearance-outline.mat-warn .mat-mdc-text-field-wrapper:hover .mdc-notched-outline__trailing,.ui-field[theme=light] .mat-mdc-form-field.mat-form-field-appearance-outline.mat-warn .mat-mdc-text-field-wrapper.mdc-text-field--focused .mdc-notched-outline__leading,.ui-field[theme=light] .mat-mdc-form-field.mat-form-field-appearance-outline.mat-warn .mat-mdc-text-field-wrapper.mdc-text-field--focused .mdc-notched-outline__notch,.ui-field[theme=light] .mat-mdc-form-field.mat-form-field-appearance-outline.mat-warn .mat-mdc-text-field-wrapper.mdc-text-field--focused .mdc-notched-outline__trailing{border-color:#e02800!important}.ui-field[theme=dark] .mat-mdc-form-field.mat-form-field-appearance-outline.mat-warn .mat-mdc-text-field-wrapper:hover .mat-mdc-form-field-flex .mat-mdc-floating-label.mdc-floating-label--float-above,.ui-field[theme=dark] .mat-mdc-form-field.mat-form-field-appearance-outline.mat-warn .mat-mdc-text-field-wrapper.mdc-text-field--focused .mat-mdc-form-field-flex .mat-mdc-floating-label.mdc-floating-label--float-above,.ui-field[theme=light] .mat-mdc-form-field.mat-form-field-appearance-outline.mat-warn .mat-mdc-text-field-wrapper:hover .mat-mdc-form-field-flex .mat-mdc-floating-label.mdc-floating-label--float-above,.ui-field[theme=light] .mat-mdc-form-field.mat-form-field-appearance-outline.mat-warn .mat-mdc-text-field-wrapper.mdc-text-field--focused .mat-mdc-form-field-flex .mat-mdc-floating-label.mdc-floating-label--float-above{color:#e02800!important}.ui-field[theme=dark] .mat-mdc-form-field.text-area-borderless.mat-mdc-form-field-type-mat-input.mat-form-field-appearance-outline .mat-mdc-text-field-wrapper .mdc-notched-outline__leading,.ui-field[theme=dark] .mat-mdc-form-field.text-area-borderless.mat-mdc-form-field-type-mat-input.mat-form-field-appearance-outline .mat-mdc-text-field-wrapper .mdc-notched-outline__leading:hover,.ui-field[theme=dark] .mat-mdc-form-field.multi-line-textarea.mat-mdc-form-field-type-mat-input.mat-form-field-appearance-outline .mat-mdc-text-field-wrapper .mdc-notched-outline__leading,.ui-field[theme=dark] .mat-mdc-form-field.multi-line-textarea.mat-mdc-form-field-type-mat-input.mat-form-field-appearance-outline .mat-mdc-text-field-wrapper .mdc-notched-outline__leading:hover,.ui-field[theme=light] .mat-mdc-form-field.text-area-borderless.mat-mdc-form-field-type-mat-input.mat-form-field-appearance-outline .mat-mdc-text-field-wrapper .mdc-notched-outline__leading,.ui-field[theme=light] .mat-mdc-form-field.text-area-borderless.mat-mdc-form-field-type-mat-input.mat-form-field-appearance-outline .mat-mdc-text-field-wrapper .mdc-notched-outline__leading:hover,.ui-field[theme=light] .mat-mdc-form-field.multi-line-textarea.mat-mdc-form-field-type-mat-input.mat-form-field-appearance-outline .mat-mdc-text-field-wrapper .mdc-notched-outline__leading,.ui-field[theme=light] .mat-mdc-form-field.multi-line-textarea.mat-mdc-form-field-type-mat-input.mat-form-field-appearance-outline .mat-mdc-text-field-wrapper .mdc-notched-outline__leading:hover,.ui-field[theme=dark] .mat-mdc-form-field.text-area-borderless.mat-mdc-form-field-type-mat-input.mat-form-field-appearance-outline .mat-mdc-text-field-wrapper .mdc-notched-outline__trailing,.ui-field[theme=dark] .mat-mdc-form-field.text-area-borderless.mat-mdc-form-field-type-mat-input.mat-form-field-appearance-outline .mat-mdc-text-field-wrapper .mdc-notched-outline__trailing:hover,.ui-field[theme=dark] .mat-mdc-form-field.multi-line-textarea.mat-mdc-form-field-type-mat-input.mat-form-field-appearance-outline .mat-mdc-text-field-wrapper .mdc-notched-outline__trailing,.ui-field[theme=dark] .mat-mdc-form-field.multi-line-textarea.mat-mdc-form-field-type-mat-input.mat-form-field-appearance-outline .mat-mdc-text-field-wrapper .mdc-notched-outline__trailing:hover,.ui-field[theme=light] .mat-mdc-form-field.text-area-borderless.mat-mdc-form-field-type-mat-input.mat-form-field-appearance-outline .mat-mdc-text-field-wrapper .mdc-notched-outline__trailing,.ui-field[theme=light] .mat-mdc-form-field.text-area-borderless.mat-mdc-form-field-type-mat-input.mat-form-field-appearance-outline .mat-mdc-text-field-wrapper .mdc-notched-outline__trailing:hover,.ui-field[theme=light] .mat-mdc-form-field.multi-line-textarea.mat-mdc-form-field-type-mat-input.mat-form-field-appearance-outline .mat-mdc-text-field-wrapper .mdc-notched-outline__trailing,.ui-field[theme=light] .mat-mdc-form-field.multi-line-textarea.mat-mdc-form-field-type-mat-input.mat-form-field-appearance-outline .mat-mdc-text-field-wrapper .mdc-notched-outline__trailing:hover,.ui-field[theme=dark] .mat-mdc-form-field.text-area-borderless.mat-mdc-form-field-type-mat-input.mat-form-field-appearance-outline .mat-mdc-text-field-wrapper .mdc-notched-outline__notch,.ui-field[theme=dark] .mat-mdc-form-field.text-area-borderless.mat-mdc-form-field-type-mat-input.mat-form-field-appearance-outline .mat-mdc-text-field-wrapper .mdc-notched-outline__notch:hover,.ui-field[theme=dark] .mat-mdc-form-field.multi-line-textarea.mat-mdc-form-field-type-mat-input.mat-form-field-appearance-outline .mat-mdc-text-field-wrapper .mdc-notched-outline__notch,.ui-field[theme=dark] .mat-mdc-form-field.multi-line-textarea.mat-mdc-form-field-type-mat-input.mat-form-field-appearance-outline .mat-mdc-text-field-wrapper .mdc-notched-outline__notch:hover,.ui-field[theme=light] .mat-mdc-form-field.text-area-borderless.mat-mdc-form-field-type-mat-input.mat-form-field-appearance-outline .mat-mdc-text-field-wrapper .mdc-notched-outline__notch,.ui-field[theme=light] .mat-mdc-form-field.text-area-borderless.mat-mdc-form-field-type-mat-input.mat-form-field-appearance-outline .mat-mdc-text-field-wrapper .mdc-notched-outline__notch:hover,.ui-field[theme=light] .mat-mdc-form-field.multi-line-textarea.mat-mdc-form-field-type-mat-input.mat-form-field-appearance-outline .mat-mdc-text-field-wrapper .mdc-notched-outline__notch,.ui-field[theme=light] .mat-mdc-form-field.multi-line-textarea.mat-mdc-form-field-type-mat-input.mat-form-field-appearance-outline .mat-mdc-text-field-wrapper .mdc-notched-outline__notch:hover{border-color:transparent!important}.ui-field[theme=dark] .mat-mdc-form-field.text-area-borderless.mat-mdc-form-field-type-mat-input.mat-form-field-appearance-outline .mat-mdc-text-field-wrapper .mdc-floating-label,.ui-field[theme=dark] .mat-mdc-form-field.multi-line-textarea.mat-mdc-form-field-type-mat-input.mat-form-field-appearance-outline .mat-mdc-text-field-wrapper .mdc-floating-label,.ui-field[theme=light] .mat-mdc-form-field.text-area-borderless.mat-mdc-form-field-type-mat-input.mat-form-field-appearance-outline .mat-mdc-text-field-wrapper .mdc-floating-label,.ui-field[theme=light] .mat-mdc-form-field.multi-line-textarea.mat-mdc-form-field-type-mat-input.mat-form-field-appearance-outline .mat-mdc-text-field-wrapper .mdc-floating-label{color:#919191!important}.ui-field[theme=dark] .mat-mdc-form-field.text-area-borderless.mat-mdc-form-field-type-mat-input.mat-form-field-appearance-outline .mat-mdc-text-field-wrapper .mat-mdc-input-element,.ui-field[theme=dark] .mat-mdc-form-field.multi-line-textarea.mat-mdc-form-field-type-mat-input.mat-form-field-appearance-outline .mat-mdc-text-field-wrapper .mat-mdc-input-element,.ui-field[theme=light] .mat-mdc-form-field.text-area-borderless.mat-mdc-form-field-type-mat-input.mat-form-field-appearance-outline .mat-mdc-text-field-wrapper .mat-mdc-input-element,.ui-field[theme=light] .mat-mdc-form-field.multi-line-textarea.mat-mdc-form-field-type-mat-input.mat-form-field-appearance-outline .mat-mdc-text-field-wrapper .mat-mdc-input-element{color:#242424}.ui-field[theme=dark] .mat-mdc-form-field.text-area-borderless.mat-mdc-form-field-type-mat-input.mat-form-field-appearance-outline .mat-mdc-form-field-infix,.ui-field[theme=dark] .mat-mdc-form-field.multi-line-textarea.mat-mdc-form-field-type-mat-input.mat-form-field-appearance-outline .mat-mdc-form-field-infix,.ui-field[theme=light] .mat-mdc-form-field.text-area-borderless.mat-mdc-form-field-type-mat-input.mat-form-field-appearance-outline .mat-mdc-form-field-infix,.ui-field[theme=light] .mat-mdc-form-field.multi-line-textarea.mat-mdc-form-field-type-mat-input.mat-form-field-appearance-outline .mat-mdc-form-field-infix{padding:12px 0!important}.ui-field[theme=dark] .mat-mdc-form-field.text-area-borderless.mat-mdc-form-field-type-mat-input.mat-form-field-appearance-outline .mdc-floating-label--float-above,.ui-field[theme=dark] .mat-mdc-form-field.multi-line-textarea.mat-mdc-form-field-type-mat-input.mat-form-field-appearance-outline .mdc-floating-label--float-above,.ui-field[theme=light] .mat-mdc-form-field.text-area-borderless.mat-mdc-form-field-type-mat-input.mat-form-field-appearance-outline .mdc-floating-label--float-above,.ui-field[theme=light] .mat-mdc-form-field.multi-line-textarea.mat-mdc-form-field-type-mat-input.mat-form-field-appearance-outline .mdc-floating-label--float-above{display:none!important}.ui-field[theme=dark] .mat-mdc-form-field.text-area-borderless.mat-mdc-form-field-type-mat-input.mat-form-field-appearance-outline .mat-mdc-text-field-wrapper,.ui-field[theme=dark] .mat-mdc-form-field.multi-line-textarea.mat-mdc-form-field-type-mat-input.mat-form-field-appearance-outline .mat-mdc-text-field-wrapper,.ui-field[theme=light] .mat-mdc-form-field.text-area-borderless.mat-mdc-form-field-type-mat-input.mat-form-field-appearance-outline .mat-mdc-text-field-wrapper,.ui-field[theme=light] .mat-mdc-form-field.multi-line-textarea.mat-mdc-form-field-type-mat-input.mat-form-field-appearance-outline .mat-mdc-text-field-wrapper{border-radius:0!important}.ui-field[theme=dark] .mat-mdc-form-field.text-area-borderless.textarea textarea,.ui-field[theme=dark] .mat-mdc-form-field.multi-line-textarea.textarea textarea,.ui-field[theme=light] .mat-mdc-form-field.text-area-borderless.textarea textarea,.ui-field[theme=light] .mat-mdc-form-field.multi-line-textarea.textarea textarea{padding-top:0}.ui-field[theme=dark] .field-badge,.ui-field[theme=light] .field-badge{position:absolute;left:-27px;top:-10px;z-index:1}\n"], dependencies: [{ kind: "component", type: MatFormField, selector: "mat-form-field", inputs: ["hideRequiredMarker", "color", "floatLabel", "appearance", "subscriptSizing", "hintLabel"], exportAs: ["matFormField"] }, { kind: "directive", type: NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }, { kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: MatLabel, selector: "mat-label" }, { kind: "ngmodule", type: IconComponentModule }, { kind: "component", type: i1.IconComponent, selector: "ui-icon", inputs: ["size", "cssClass", "name", "color", "filled", "toggleIconStyle", "applicationTheme", "useFullIconName"] }, { kind: "component", type: MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "directive", type: MatPrefix, selector: "[matPrefix], [matIconPrefix], [matTextPrefix]", inputs: ["matTextPrefix"] }, { kind: "directive", type: MatInput, selector: "input[matInput], textarea[matInput], select[matNativeControl],      input[matNativeControl], textarea[matNativeControl]", inputs: ["disabled", "id", "placeholder", "name", "required", "type", "errorStateMatcher", "aria-describedby", "value", "readonly", "disabledInteractive"], exportAs: ["matInput"] }, { kind: "directive", type: DigitsOnlyDirective, selector: "[digitsOnly]", inputs: ["allowNegative", "allowDecimal", "allowOnlyDigits"] }, { kind: "directive", type: CdkTextareaAutosize, selector: "textarea[cdkTextareaAutosize]", inputs: ["cdkAutosizeMinRows", "cdkAutosizeMaxRows", "cdkTextareaAutosize", "placeholder"], exportAs: ["cdkTextareaAutosize"] }, { kind: "component", type: ButtonComponent, selector: "ui-button", inputs: ["size", "variant", "label", "iconPosition", "justIcon", "iconName", "disabled", "loading", "loadingWithLabel", "fullWidth", "url", "urlTarget", "value", "tooltip", "isPremium", "type", "companyColor", "buttonBadgeConfig", "applicationTheme", "disabledScaleOnClick", "ariaLabel", "ariaExpanded", "ariaControls", "ariaPressed", "ariaRequired", "ariaLabelledby", "ariaDescribedby", "preventDefault", "hasBackground", "tooltipPosition", "role", "iconFilled"], outputs: ["buttonClickEvent", "buttonHoverEvent"] }, { kind: "directive", type: MatHint, selector: "mat-hint", inputs: ["align", "id"] }, { kind: "ngmodule", type: ValidationErrorModule }, { kind: "component", type: i2.ValidationErrorComponent, selector: "ui-validation-error", inputs: ["ngControl", "touchedOn", "errorMessage", "label", "applicationTheme", "customErrors"] }, { kind: "component", type: BadgeComponent, selector: "ui-badge", inputs: ["label", "staticLabel", "icon", "iconColor", "trailingIcon", "trailingIconColor", "color", "variant", "notificationsAmount", "applicationTheme", "rebrandColor", "truncateLabel", "enableAnimation"] }, { kind: "pipe", type: AsyncPipe, name: "async" }, { kind: "pipe", type: UiTranslatePipe, name: "uiTranslate" }, { kind: "pipe", type: HasValidationErrorPipe, name: "hasValidationError" }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.19", ngImport: i0, type: FieldComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.19", type: FieldComponent, isStandalone: true, selector: "ui-field", inputs: { fullWidth: { classPropertyName: "fullWidth", publicName: "fullWidth", isSignal: false, isRequired: false, transformFunction: null }, fullHeight: { classPropertyName: "fullHeight", publicName: "fullHeight", isSignal: false, isRequired: false, transformFunction: null }, label: { classPropertyName: "label", publicName: "label", isSignal: false, isRequired: false, transformFunction: null }, labelHtml: { classPropertyName: "labelHtml", publicName: "labelHtml", isSignal: true, isRequired: false, transformFunction: null }, labelIcon: { classPropertyName: "labelIcon", publicName: "labelIcon", isSignal: false, isRequired: false, transformFunction: null }, fieldName: { classPropertyName: "fieldName", publicName: "fieldName", isSignal: false, isRequired: false, transformFunction: null }, placeholder: { classPropertyName: "placeholder", publicName: "placeholder", isSignal: false, isRequired: false, transformFunction: null }, id: { classPropertyName: "id", publicName: "id", isSignal: true, isRequired: false, transformFunction: null }, value: { classPropertyName: "value", publicName: "value", isSignal: false, isRequired: false, transformFunction: null }, badgeVariant: { classPropertyName: "badgeVariant", publicName: "badgeVariant", isSignal: false, isRequired: false, transformFunction: null }, errors: { classPropertyName: "errors", publicName: "errors", isSignal: false, isRequired: false, transformFunction: null }, disabled: { classPropertyName: "disabled", publicName: "disabled", isSignal: false, isRequired: false, transformFunction: null }, required: { classPropertyName: "required", publicName: "required", isSignal: false, isRequired: false, transformFunction: null }, readOnly: { classPropertyName: "readOnly", publicName: "readOnly", isSignal: false, isRequired: false, transformFunction: null }, hintMessage: { classPropertyName: "hintMessage", publicName: "hintMessage", isSignal: false, isRequired: false, transformFunction: null }, type: { classPropertyName: "type", publicName: "type", isSignal: false, isRequired: false, transformFunction: null }, updateOnBlur: { classPropertyName: "updateOnBlur", publicName: "updateOnBlur", isSignal: false, isRequired: false, transformFunction: null }, allowOnlyDigits: { classPropertyName: "allowOnlyDigits", publicName: "allowOnlyDigits", isSignal: false, isRequired: false, transformFunction: null }, isAutocompleteOff: { classPropertyName: "isAutocompleteOff", publicName: "isAutocompleteOff", isSignal: false, isRequired: false, transformFunction: null }, allowNegative: { classPropertyName: "allowNegative", publicName: "allowNegative", isSignal: false, isRequired: false, transformFunction: null }, showBottomContent: { classPropertyName: "showBottomContent", publicName: "showBottomContent", isSignal: false, isRequired: false, transformFunction: null }, applicationTheme: { classPropertyName: "applicationTheme", publicName: "applicationTheme", isSignal: false, isRequired: false, transformFunction: null }, ariaLabel: { classPropertyName: "ariaLabel", publicName: "ariaLabel", isSignal: false, isRequired: false, transformFunction: null }, loading: { classPropertyName: "loading", publicName: "loading", isSignal: false, isRequired: false, transformFunction: null }, isValid: { classPropertyName: "isValid", publicName: "isValid", isSignal: false, isRequired: false, transformFunction: null }, maxCharacters: { classPropertyName: "maxCharacters", publicName: "maxCharacters", isSignal: false, isRequired: false, transformFunction: null }, trimOnBlur: { classPropertyName: "trimOnBlur", publicName: "trimOnBlur", isSignal: false, isRequired: false, transformFunction: null }, trimOnSubmit: { classPropertyName: "trimOnSubmit", publicName: "trimOnSubmit", isSignal: false, isRequired: false, transformFunction: null }, maxRows: { classPropertyName: "maxRows", publicName: "maxRows", isSignal: false, isRequired: false, transformFunction: null }, hasTextAreaCounter: { classPropertyName: "hasTextAreaCounter", publicName: "hasTextAreaCounter", isSignal: false, isRequired: false, transformFunction: null }, hideBuiltInErrors: { classPropertyName: "hideBuiltInErrors", publicName: "hideBuiltInErrors", isSignal: false, isRequired: false, transformFunction: null }, hideLabelInErrors: { classPropertyName: "hideLabelInErrors", publicName: "hideLabelInErrors", isSignal: false, isRequired: false, transformFunction: null }, max: { classPropertyName: "max", publicName: "max", isSignal: false, isRequired: false, transformFunction: null }, min: { classPropertyName: "min", publicName: "min", isSignal: false, isRequired: false, transformFunction: null }, textareaHeight: { classPropertyName: "textareaHeight", publicName: "textareaHeight", isSignal: false, isRequired: false, transformFunction: null }, borderless: { classPropertyName: "borderless", publicName: "borderless", isSignal: false, isRequired: false, transformFunction: null }, autosizableTextarea: { classPropertyName: "autosizableTextarea", publicName: "autosizableTextarea", isSignal: false, isRequired: false, transformFunction: null }, isAIVariant: { classPropertyName: "isAIVariant", publicName: "isAIVariant", isSignal: false, isRequired: false, transformFunction: null }, ariaLabelledby: { classPropertyName: "ariaLabelledby", publicName: "ariaLabelledby", isSignal: true, isRequired: false, transformFunction: null }, ariaDescribedby: { classPropertyName: "ariaDescribedby", publicName: "ariaDescribedby", isSignal: true, isRequired: false, transformFunction: null }, hasError: { classPropertyName: "hasError", publicName: "hasError", isSignal: false, isRequired: false, transformFunction: null } }, outputs: { validateEvent: "validateEvent", fieldBlur: "fieldBlur" }, host: { properties: { "class": "this.class", "class.full-width": "this.fullWidth", "class.full-height": "this.fullHeight", "attr.field-class": "this.type", "attr.theme": "this.applicationTheme" } }, viewQueries: [{ propertyName: "field", first: true, predicate: ["inputElement"], descendants: true, read: ElementRef }, { propertyName: "autosize", first: true, predicate: ["autosize"], descendants: true }], ngImport: i0, template: "<ng-container>\n  <mat-form-field\n    [ngStyle]=\"{\n      '--textarea-height': textareaHeight - 10 + 'px',\n      '--textarea-height-container': textareaHeight + 'px',\n    }\"\n    #uiField\n    appearance=\"outline\"\n    hideRequiredMarker=\"true\"\n    [color]=\"errorsLength || (ngControl?.errors && ngControl?.touched) || hasError ? 'warn' : 'accent'\"\n    [ngClass]=\"{\n      'hide-bottom-content': !showBottomContent,\n      textarea: type === 'textarea' || type === 'textarea-scrollable',\n      'textarea-scrollable': type === 'textarea-scrollable',\n      'multi-line': type === 'multi-line',\n      'multi-line-textarea': type === 'multi-line' && autosizableTextarea && borderless,\n      'keyboard-focused': keyboardFocused(),\n      'has-label': !!label,\n      'has-value': !!value,\n      'text-area-borderless': borderless && (type === 'textarea' || type === 'textarea-scrollable'),\n    }\"\n    (mouseenter)=\"onActive(true, 'hover')\"\n    (mouseleave)=\"onActive(false, 'hover')\"\n  >\n    <span [style.display]=\"'none'\" [id]=\"ariaDescribedbyId()\">\n      @if (required) {\n        <span>{{ 'ERRORS.REQUIRED' | uiTranslate | async }}</span>\n      }\n      {{ ariaDescribedby() }}\n    </span>\n    <span [style.display]=\"'none'\" [id]=\"ariaLabelledbyId()\">\n      {{ ariaLabelledby() ?? label }}\n    </span>\n    @if (\n      (label || labelHtml()) &&\n      ((type !== 'search' && applicationTheme === 'classic') || applicationTheme !== 'classic')\n    ) {\n      <mat-label class=\"label-with-icon\">\n        @if (isAIVariant || labelIcon) {\n          <ui-icon [name]=\"isAIVariant ? 'Sparkle-in-line' : labelIcon!\" [size]=\"'16'\" class=\"label-icon\"></ui-icon>\n        }\n        <span>\n          @if (labelHtml()) {\n            <span [innerHTML]=\"labelHtml()\"></span>\n          } @else {\n            {{ label }}\n          }\n          @if (required) {\n            <span>*</span>\n          }\n        </span>\n      </mat-label>\n    }\n    @if (type === 'search' || type === 'collapsed-search') {\n      <mat-icon matIconPrefix class=\"search-icon\" [svgIcon]=\"'Search'\"></mat-icon>\n    }\n    @if (type !== 'textarea' && type !== 'textarea-scrollable' && type !== 'multi-line') {\n      <input\n        data-testid=\"field-input\"\n        [readonly]=\"readOnly\"\n        matInput\n        #inputElement\n        (blur)=\"onTouch(); onActive(false, 'focus'); onBlur()\"\n        (input)=\"onInput($event)\"\n        [id]=\"id()\"\n        (keyup)=\"onChangeInputSearch()\"\n        [placeholder]=\"placeholder!\"\n        [value]=\"value\"\n        [disabled]=\"disabled || loading\"\n        [type]=\"currentType\"\n        (keyup.enter)=\"onSubmit()\"\n        [max]=\"max\"\n        [min]=\"min\"\n        [name]=\"fieldName!\"\n        [required]=\"required\"\n        [attr.aria-label]=\"ariaLabel\"\n        [attr.aria-invalid]=\"errorsLength || (ngControl?.errors && ngControl?.touched) || hasError\"\n        [attr.aria-labelledby]=\"ariaLabelledbyId()\"\n        [attr.aria-describedby]=\"ariaDescribedbyId()\"\n        role=\"textbox\"\n        digitsOnly\n        [autocomplete]=\"isAutocompleteOff ? 'off' : 'on'\"\n        [allowOnlyDigits]=\"allowOnlyDigits\"\n        [allowNegative]=\"allowNegative\"\n        (focusin)=\"onActive(true, 'focus')\"\n      />\n    } @else {\n      <textarea\n        matInput\n        #inputElement\n        #autosize=\"cdkTextareaAutosize\"\n        [readonly]=\"readOnly\"\n        (blur)=\"onTouch(); onActive(false, 'focus'); onBlur()\"\n        (input)=\"onInput($event)\"\n        [id]=\"id()\"\n        (keyup)=\"onChangeInputSearch()\"\n        (keyup.enter)=\"onSubmit()\"\n        [placeholder]=\"placeholder!\"\n        [value]=\"value\"\n        [disabled]=\"disabled\"\n        [name]=\"fieldName!\"\n        [required]=\"required\"\n        [attr.aria-label]=\"!label ? ariaLabel : ''\"\n        [attr.aria-invalid]=\"errorsLength || (ngControl?.errors && ngControl?.touched) || hasError\"\n        [attr.aria-labelledby]=\"ariaLabelledbyId()\"\n        [attr.aria-describedby]=\"ariaDescribedbyId()\"\n        role=\"textbox\"\n        [cdkTextareaAutosize]=\"type === 'multi-line'\"\n        [cdkAutosizeMinRows]=\"type === 'multi-line' ? 1 : 5\"\n        [cdkAutosizeMaxRows]=\"type === 'multi-line' ? maxRows : 5\"\n        [attr.maxlength]=\"maxCharacters\"\n        (focusin)=\"onActive(true, 'focus')\"\n      ></textarea>\n    }\n\n    @if (type === 'search' || type === 'collapsed-search' || type === 'password' || type === 'validation-text') {\n      <div class=\"options\">\n        <div class=\"options-container\">\n          @if (showClose) {\n            <ui-button\n              variant=\"secondary\"\n              [justIcon]=\"true\"\n              class=\"close\"\n              iconName=\"Close\"\n              [label]=\"('COMMON.CLEAR' | uiTranslate | async)!\"\n              (buttonClickEvent)=\"clearValue()\"\n              [ariaLabel]=\"ariaLabel + '--' + ('COMMON.CLEAR' | uiTranslate | async)\"\n            ></ui-button>\n          }\n          @if (type === 'password') {\n            <ui-button\n              class=\"password\"\n              variant=\"secondary\"\n              [tooltip]=\"((showPassword ? 'FIELD.HIDE_PASSWORD' : 'FIELD.SHOW_PASSWORD') | uiTranslate | async)!\"\n              [justIcon]=\"true\"\n              role=\"switch\"\n              [attr.aria-checked]=\"showPassword\"\n              [iconName]=\"getPasswordIcon\"\n              [applicationTheme]=\"applicationTheme\"\n              (click)=\"showPasswordClick()\"\n              #btn\n              (keydown.enter)=\"refocusPasswordButton(btn)\"\n              (keydown.space)=\"refocusPasswordButton(btn)\"\n            ></ui-button>\n          }\n          @if (\n            type === 'validation-text' && (applicationTheme === 'dark' || applicationTheme === 'light') && value.length\n          ) {\n            @if (!isValid) {\n              <ui-button\n                class=\"validation\"\n                [variant]=\"'text'\"\n                [applicationTheme]=\"'light'\"\n                [label]=\"'Validate'\"\n                [loading]=\"loading\"\n                (click)=\"validate()\"\n                [disabled]=\"disabled\"\n                [size]=\"'small'\"\n              ></ui-button>\n            }\n            @if (isValid) {\n              <ui-icon class=\"valid\" [color]=\"'white'\" applicationTheme=\"light\" [name]=\"'Check'\"></ui-icon>\n            }\n          }\n        </div>\n      </div>\n    }\n    @if (\n      hasTextAreaCounter &&\n      (type === 'textarea' || type === 'textarea-scrollable') &&\n      !errorsLength &&\n      !(ngControl?.errors | hasValidationError)\n    ) {\n      <mat-hint class=\"info\">{{ value.length }} / {{ maxCharacters }}</mat-hint>\n    }\n\n    @if (\n      hintMessage &&\n      !errorsLength &&\n      !(ngControl?.errors | hasValidationError) &&\n      type !== 'textarea' &&\n      type !== 'textarea-scrollable'\n    ) {\n      <mat-hint class=\"info\">{{ hintMessage }}</mat-hint>\n    }\n\n    @if (errorsLength || (ngControl?.errors | hasValidationError)) {\n      <mat-hint class=\"error\">\n        @if (errorsLength) {\n          @for (error of _errors; track trackByFn($index, error)) {\n            <div class=\"errors\">\n              <ui-icon [applicationTheme]=\"applicationTheme\" [name]=\"'Error'\"></ui-icon>\n              <span [innerHTML]=\"error\"></span>\n            </div>\n          }\n        }\n        @if (ngControl && !hideBuiltInErrors) {\n          <ui-validation-error [ngControl]=\"ngControl\" [label]=\"hideLabelInErrors ? null : label\"></ui-validation-error>\n        }\n      </mat-hint>\n    }\n\n    @if (badgeVariant) {\n      <ui-badge class=\"field-badge\" [variant]=\"badgeVariant\"></ui-badge>\n    }\n  </mat-form-field>\n</ng-container>\n", styles: [".bg-teal-60b{background:#1c443c}.bg-teal-30b{background:#31766a}.bg-teal-default{background:#46a997}.bg-teal-30w{background:#7ec3b6}.bg-teal-60w{background:#b5ddd5}.bg-teal-secondary{background:#cbd6cb}.bg-teal-90w{background:#ecf6f5}.bg-petrol-60b{background:#102930}.bg-petrol-30b{background:#1b4754}.bg-petrol-default{background:#276678}.bg-petrol-30w{background:#6894a0}.bg-petrol-60w{background:#a9c2c9}.bg-petrol-secondary{background:#c8d7de}.bg-petrol-90w{background:#e9f0f1}.bg-error-60b{background:#513131}.bg-error-30b{background:#8e5655}.bg-error-60w{background:#e3c3c6}.bg-error-secondary{background:#f0dad9}.bg-error-default{background:#cb7b7a}.bg-warning-secondary{background:#f0d6bb}.bg-warning-default{background:#cca45f}.bg-black{background:#000}.bg-dark{background:#888}.bg-medium{background:#e0e0e0}.bg-grey{background:#ededed}.bg-light{background:#f6f6f6}.bg-white{background:#fff}.bg-box-shadow{background:#00000014}.bg-navigation-subtitle{background:#528593}.bgc-teal-60b{background-color:#1c443c}.bgc-teal-30b{background-color:#31766a}.bgc-teal-default{background-color:#46a997}.bgc-teal-30w{background-color:#7ec3b6}.bgc-teal-60w{background-color:#b5ddd5}.bgc-teal-secondary{background-color:#cbd6cb}.bgc-teal-90w{background-color:#ecf6f5}.bgc-petrol-60b{background-color:#102930}.bgc-petrol-30b{background-color:#1b4754}.bgc-petrol-default{background-color:#276678}.bgc-petrol-30w{background-color:#6894a0}.bgc-petrol-60w{background-color:#a9c2c9}.bgc-petrol-secondary{background-color:#c8d7de}.bgc-petrol-90w{background-color:#e9f0f1}.bgc-error-60b{background-color:#513131}.bgc-error-30b{background-color:#8e5655}.bgc-error-60w{background-color:#e3c3c6}.bgc-error-secondary{background-color:#f0dad9}.bgc-error-default{background-color:#cb7b7a}.bgc-warning-secondary{background-color:#f0d6bb}.bgc-warning-default{background-color:#cca45f}.bgc-black{background-color:#000}.bgc-dark{background-color:#888}.bgc-medium{background-color:#e0e0e0}.bgc-grey{background-color:#ededed}.bgc-light{background-color:#f6f6f6}.bgc-white{background-color:#fff}.bgc-box-shadow{background-color:#00000014}.bgc-navigation-subtitle{background-color:#528593}.label-with-icon ui-icon{display:inline-block;vertical-align:middle;margin-right:4px}.label-with-icon>span{vertical-align:middle}.mat-mdc-form-field.mat-form-field-appearance-outline.mat-warn .label-with-icon .label-icon mat-icon svg{color:#e02800!important}.mat-mdc-form-field.mat-form-field-appearance-outline:not(.mat-warn):hover .mat-mdc-floating-label:not(.mdc-floating-label--float-above) .label-with-icon .label-icon mat-icon svg{color:#919191!important}.mat-mdc-form-field.mat-form-field-appearance-outline:not(.mat-warn) .mat-mdc-floating-label.mdc-floating-label--float-above .label-with-icon .label-icon mat-icon svg{color:#000!important}.mat-mdc-form-field.keyboard-focused{position:relative}.mat-mdc-form-field.keyboard-focused .mat-mdc-text-field-wrapper:after{content:\"\";position:absolute;top:0;border-radius:10px;left:0;width:100%;height:100%;outline:2px solid #ffffff;z-index:-1}.mat-mdc-form-field.keyboard-focused .mat-mdc-form-field-subscript-wrapper{z-index:-1}.mat-mdc-form-field.has-label .mdc-notched-outline__notch{position:relative}.mat-mdc-form-field.has-label .mdc-notched-outline__notch:after{content:\"\";position:absolute;top:0;left:0;background:#fff;width:100%;height:5px;z-index:-1}.active-field .mdc-notched-outline__leading,.ui-field[theme=dark] .mat-mdc-form-field.mat-form-field-appearance-outline .mat-mdc-text-field-wrapper:hover .mdc-notched-outline__leading,.ui-field[theme=dark] .mat-mdc-form-field.mat-form-field-appearance-outline .mat-mdc-text-field-wrapper.mdc-text-field--focused .mdc-notched-outline__leading,.ui-field[theme=light] .mat-mdc-form-field.mat-form-field-appearance-outline .mat-mdc-text-field-wrapper:hover .mdc-notched-outline__leading,.ui-field[theme=light] .mat-mdc-form-field.mat-form-field-appearance-outline .mat-mdc-text-field-wrapper.mdc-text-field--focused .mdc-notched-outline__leading,.ui-field .mat-mdc-form-field.mat-form-field-appearance-outline.mat-warn .mat-mdc-text-field-wrapper:hover .mdc-notched-outline__leading,.ui-field .mat-mdc-form-field.mat-form-field-appearance-outline:not(.mat-warn) .mat-mdc-text-field-wrapper:hover .mdc-notched-outline__leading{border-left-width:2px;border-top-width:2px;border-bottom-width:2px}.active-field .mdc-notched-outline__notch,.ui-field[theme=dark] .mat-mdc-form-field.mat-form-field-appearance-outline .mat-mdc-text-field-wrapper:hover .mdc-notched-outline__notch,.ui-field[theme=dark] .mat-mdc-form-field.mat-form-field-appearance-outline .mat-mdc-text-field-wrapper.mdc-text-field--focused .mdc-notched-outline__notch,.ui-field[theme=light] .mat-mdc-form-field.mat-form-field-appearance-outline .mat-mdc-text-field-wrapper:hover .mdc-notched-outline__notch,.ui-field[theme=light] .mat-mdc-form-field.mat-form-field-appearance-outline .mat-mdc-text-field-wrapper.mdc-text-field--focused .mdc-notched-outline__notch,.ui-field .mat-mdc-form-field.mat-form-field-appearance-outline.mat-warn .mat-mdc-text-field-wrapper:hover .mdc-notched-outline__notch,.ui-field .mat-mdc-form-field.mat-form-field-appearance-outline:not(.mat-warn) .mat-mdc-text-field-wrapper:hover .mdc-notched-outline__notch{border-top-width:2px;border-bottom-width:2px}.active-field .mdc-notched-outline__trailing,.ui-field[theme=dark] .mat-mdc-form-field.mat-form-field-appearance-outline .mat-mdc-text-field-wrapper:hover .mdc-notched-outline__trailing,.ui-field[theme=dark] .mat-mdc-form-field.mat-form-field-appearance-outline .mat-mdc-text-field-wrapper.mdc-text-field--focused .mdc-notched-outline__trailing,.ui-field[theme=light] .mat-mdc-form-field.mat-form-field-appearance-outline .mat-mdc-text-field-wrapper:hover .mdc-notched-outline__trailing,.ui-field[theme=light] .mat-mdc-form-field.mat-form-field-appearance-outline .mat-mdc-text-field-wrapper.mdc-text-field--focused .mdc-notched-outline__trailing,.ui-field .mat-mdc-form-field.mat-form-field-appearance-outline.mat-warn .mat-mdc-text-field-wrapper:hover .mdc-notched-outline__trailing,.ui-field .mat-mdc-form-field.mat-form-field-appearance-outline:not(.mat-warn) .mat-mdc-text-field-wrapper:hover .mdc-notched-outline__trailing{border-top-width:2px;border-bottom-width:2px;border-right-width:2px}.ui-field{display:block;width:320px}.ui-field.full-width{width:100%}.ui-field[field-class=textarea-scrollable]{min-width:370px}.ui-field[field-class=textarea-scrollable] .mat-mdc-form-field .mdc-notched-outline__notch .mat-mdc-floating-label{max-width:560px;padding:0 4px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.ui-field.full-height{height:100%}.ui-field.full-height mat-form-field{height:100%}.ui-field.full-height mat-form-field .mat-mdc-form-field-flex{height:100%}.ui-field.full-height mat-form-field .mat-mdc-form-field-flex .mat-mdc-form-field-infix{height:100%}.ui-field.full-height mat-form-field .mat-mdc-form-field-flex .mat-mdc-form-field-infix textarea{max-height:100%!important;height:100%!important}.ui-field[field-class=collapsed-search] mat-form-field:not(.mat-focused):not(.has-value){width:56px!important}.ui-field[field-class=collapsed-search] mat-form-field:not(.mat-focused):not(.has-value) .mat-mdc-floating-label{display:none!important}.ui-field[field-class=collapsed-search] mat-form-field:not(.mat-focused):not(.has-value) .mat-mdc-form-field-subscript-wrapper .mat-mdc-form-field-hint-wrapper{position:relative;width:100vw!important}.ui-field .mat-mdc-form-field-subscript-wrapper{margin:0!important}.ui-field[field-class=search][theme=classic] .mat-mdc-form-field:hover.mat-form-field-appearance-outline .mdc-notched-outline__notch,.ui-field[field-class=search][theme=classic] .mat-mdc-form-field.mat-form-field-appearance-outline.mat-focused .mdc-notched-outline__notch{border-top:2px solid #276678!important}.ui-field[field-class=search][theme=classic] .mat-mdc-form-field.mat-form-field-appearance-outline .mdc-notched-outline__notch{border-top:1px solid var(--mdc-outlined-text-field-outline-color)!important}.ui-field[field-class=search][theme=dark] .mat-mdc-form-field.mat-form-field-appearance-outline .mat-mdc-text-field-wrapper .mat-mdc-form-field-flex .mat-mdc-floating-label.mdc-floating-label--float-above,.ui-field[field-class=search][theme=light] .mat-mdc-form-field.mat-form-field-appearance-outline .mat-mdc-text-field-wrapper .mat-mdc-form-field-flex .mat-mdc-floating-label.mdc-floating-label--float-above{top:28px!important}.ui-field[field-class=search][theme=dark] .mat-mdc-form-field.mat-form-field-appearance-outline .mat-mdc-text-field-wrapper:hover .mat-mdc-form-field-flex .mat-mdc-floating-label:not(.mdc-floating-label--float-above),.ui-field[field-class=search][theme=light] .mat-mdc-form-field.mat-form-field-appearance-outline .mat-mdc-text-field-wrapper:hover .mat-mdc-form-field-flex .mat-mdc-floating-label:not(.mdc-floating-label--float-above){top:21px!important}.ui-field input[type=search]::-webkit-search-decoration,.ui-field input[type=search]::-webkit-search-cancel-button,.ui-field input[type=search]::-webkit-search-results-button,.ui-field input[type=search]::-webkit-search-results-decoration{display:none}.ui-field .mat-mdc-form-field{margin-top:0;width:100%}.ui-field .mat-mdc-form-field.hide-bottom-content .mat-mdc-form-field-subscript-wrapper{display:none}.ui-field .mat-mdc-form-field.multi-line .mat-mdc-text-field-wrapper{height:auto!important}.ui-field .mat-mdc-form-field.multi-line .mat-mdc-form-field-infix{min-height:48px!important}.ui-field .mat-mdc-form-field.multi-line textarea{margin-top:8px;min-height:32px!important}.ui-field .mat-mdc-form-field.multi-line-textarea .mat-mdc-text-field-wrapper{height:auto!important}.ui-field .mat-mdc-form-field.multi-line-textarea .mat-mdc-form-field-infix{min-height:48px!important}.ui-field .mat-mdc-form-field.multi-line-textarea textarea{margin-top:0;min-height:48px!important}.ui-field .mat-mdc-form-field.textarea .mat-mdc-text-field-wrapper{height:var(--textarea-height-container)!important}.ui-field .mat-mdc-form-field.textarea textarea{max-height:var(--textarea-height)!important;min-height:var(--textarea-height)!important;padding-top:8px}.ui-field .mat-mdc-form-field.textarea-scrollable .mat-mdc-text-field-wrapper{height:auto!important;min-height:var(--textarea-height-container)!important;padding:0!important;position:relative}.ui-field .mat-mdc-form-field.textarea-scrollable .mat-mdc-text-field-wrapper:after{content:\"\";position:absolute;bottom:8px;right:8px;width:9px;height:9px;background-image:url(\"data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='9' height='9' viewBox='0 0 9 9' fill='none'%3E%3Cline x1='0.646447' y1='8.64645' x2='8.64645' y2='0.646446' stroke='%23242424'/%3E%3Cline x1='3.64645' y1='8.64645' x2='8.64645' y2='3.64645' stroke='%23242424'/%3E%3C/svg%3E\");background-repeat:no-repeat;background-position:center;pointer-events:none;z-index:1}.ui-field .mat-mdc-form-field.textarea-scrollable .mat-mdc-form-field-flex{padding:0!important}.ui-field .mat-mdc-form-field.textarea-scrollable .mat-mdc-form-field-infix{padding:0;position:relative}.ui-field .mat-mdc-form-field.textarea-scrollable textarea{min-height:var(--textarea-height)!important;height:auto;max-height:none!important;box-sizing:border-box;overflow-x:hidden;overflow-y:auto;padding:12px 5px 12px 16px;margin-right:7px;resize:vertical;scrollbar-color:#d3d3d3 transparent;scrollbar-width:thin;word-break:break-word;overflow-wrap:break-word}.ui-field .mat-mdc-form-field.textarea-scrollable textarea::-webkit-scrollbar{width:4px}.ui-field .mat-mdc-form-field.textarea-scrollable textarea::-webkit-scrollbar-track{background:transparent;margin-top:11px;margin-bottom:17px}.ui-field .mat-mdc-form-field.textarea-scrollable textarea::-webkit-scrollbar-thumb{background-color:#d3d3d3;border-radius:999px}.ui-field .mat-mdc-form-field.textarea-scrollable textarea::-webkit-resizer{display:none}.ui-field .mat-mdc-form-field.mat-form-field-appearance-outline:not(.mat-warn) .mat-mdc-text-field-wrapper:hover .mat-mdc-form-field-flex .mat-mdc-floating-label:not(.mdc-floating-label--float-above){top:21px!important}.ui-field .mat-mdc-form-field.mat-form-field-appearance-outline:not(.mat-warn) .mat-mdc-text-field-wrapper:hover .mdc-notched-outline__leading,.ui-field .mat-mdc-form-field.mat-form-field-appearance-outline:not(.mat-warn) .mat-mdc-text-field-wrapper:hover .mdc-notched-outline__notch,.ui-field .mat-mdc-form-field.mat-form-field-appearance-outline:not(.mat-warn) .mat-mdc-text-field-wrapper:hover .mdc-notched-outline__trailing{border-color:#276678!important}.ui-field .mat-mdc-form-field.mat-form-field-appearance-outline.mat-warn .mat-mdc-text-field-wrapper:hover .mat-mdc-form-field-flex .mat-mdc-floating-label:not(.mdc-floating-label--float-above){top:21px!important}.ui-field .mat-mdc-form-field.mat-form-field-appearance-outline.mat-warn .mat-mdc-text-field-wrapper:hover .mdc-notched-outline__leading,.ui-field .mat-mdc-form-field.mat-form-field-appearance-outline.mat-warn .mat-mdc-text-field-wrapper:hover .mdc-notched-outline__notch,.ui-field .mat-mdc-form-field.mat-form-field-appearance-outline.mat-warn .mat-mdc-text-field-wrapper:hover .mdc-notched-outline__trailing{border-color:#cb7b7a!important}.ui-field .mat-mdc-form-field.mat-form-field-appearance-outline .mat-mdc-text-field-wrapper{height:48px}.ui-field .mat-mdc-form-field.mat-form-field-appearance-outline .mat-mdc-text-field-wrapper .mat-mdc-form-field-flex .mat-mdc-floating-label{background:#fff!important;top:22px}.ui-field .mat-mdc-form-field.mat-form-field-appearance-outline .mdc-notched-outline{color:#888}.ui-field .mat-mdc-form-field.mat-form-field-appearance-outline .mdc-notched-outline .mdc-floating-label--float-above{transform:translateY(-30px) scale(.75);margin-left:1px}.ui-field .mat-mdc-form-field.mat-form-field-appearance-outline .mat-mdc-form-field-infix{min-height:48px;padding:4px 0;line-height:22px;display:inline-flex;align-items:center}.ui-field .mat-mdc-form-field.mat-form-field-appearance-outline .mat-mdc-form-field-subscript-wrapper{padding:0 0 12px;margin-top:4px;font-size:12px;line-height:16px;position:relative}.ui-field .mat-mdc-form-field.mat-form-field-appearance-outline .mat-mdc-form-field-subscript-wrapper .mat-form-field-hint-spacer{display:none}.ui-field .mat-mdc-form-field.mat-form-field-appearance-outline .mat-mdc-form-field-hint.info{color:#888;width:100%;text-align:right}.ui-field .mat-mdc-form-field.mat-form-field-appearance-outline .mat-mdc-form-field-bottom-align:before{height:0}.ui-field .mat-mdc-form-field.mat-form-field-appearance-outline .mat-mdc-form-field-hint-wrapper{position:relative;padding:0}.ui-field .mat-mdc-form-field.mat-form-field-appearance-outline .mat-mdc-form-field-hint.error,.ui-field .mat-mdc-form-field.mat-form-field-appearance-outline .mat-mdc-form-field-hint.error svg{color:#cb7b7a}.ui-field .mat-mdc-form-field.mat-form-field-appearance-outline .mat-mdc-form-field-icon-prefix,.ui-field .mat-mdc-form-field.mat-form-field-appearance-outline .mat-mdc-form-field-icon-suffix{padding:0}.ui-field .mat-mdc-form-field.mat-form-field-appearance-outline .search-icon{padding:12px 8px 12px 16px;color:#888;--icon-color: #888888}.ui-field .mat-mdc-form-field.mat-form-field-appearance-outline .mat-mdc-form-field-hint.error{display:flex}.ui-field .mat-mdc-form-field.mat-warn.mat-form-field-appearance-outline:not(.mdc-text-field--disabled) .mat-mdc-form-field-flex:hover .mdc-notched-outline .mdc-notched-outline__leading,.ui-field .mat-mdc-form-field.mat-warn.mat-form-field-appearance-outline:not(.mdc-text-field--disabled) .mat-mdc-form-field-flex:hover .mdc-notched-outline .mdc-notched-outline__trailing,.ui-field .mat-mdc-form-field.mat-warn.mat-form-field-appearance-outline:not(.mdc-text-field--disabled) .mat-mdc-form-field-flex:hover .mdc-notched-outline .mdc-notched-outline__notch{border-color:#cb7b7a}.ui-field .mat-mdc-form-field.mat-warn.mat-form-field-appearance-outline .mdc-notched-outline .mdc-notched-outline__leading,.ui-field .mat-mdc-form-field.mat-warn.mat-form-field-appearance-outline .mdc-notched-outline .mdc-notched-outline__trailing,.ui-field .mat-mdc-form-field.mat-warn.mat-form-field-appearance-outline .mdc-notched-outline .mdc-notched-outline__notch{border-color:#cb7b7a}.ui-field .mat-mdc-form-field.mat-warn.mat-focused .mat-mdc-text-field-wrapper .mat-mdc-form-field-flex .mat-mdc-form-field-infix .mat-form-field-label mat-label{color:#cb7b7a}.ui-field .mat-mdc-form-field.mat-accent.mat-form-field-appearance-outline:not(.mat-form-field-disabled) .mat-mdc-form-field-flex:hover .mdc-notched-outline{color:#276678}.ui-field .mat-mdc-form-field.mat-accent.mat-form-field-appearance-outline:not(.mat-form-field-disabled) .mat-mdc-form-field-flex:hover .options .options-container ui-button.search svg,.ui-field .mat-mdc-form-field.mat-accent.mat-form-field-appearance-outline:not(.mat-form-field-disabled) .mat-mdc-form-field-flex:hover .options .options-container ui-button.password svg{color:#276678}.ui-field .mat-mdc-form-field.mat-accent.mat-focused .mat-mdc-text-field-wrapper .mat-mdc-form-field-flex .mat-mdc-form-field-infix .mat-form-field-label mat-label{color:#276678}.ui-field .mat-mdc-form-field.mat-accent.mat-focused .options .options-container ui-button svg,.ui-field .mat-mdc-form-field.mat-accent.mat-focused .options .options-container ui-icon svg{color:#276678}.ui-field .mat-mdc-form-field.mat-accent.mat-focused .options .options-container ui-button.close svg{color:#888}.ui-field .mat-mdc-form-field .options .options-container{display:flex;column-gap:8px;padding-left:8px}.ui-field .mat-mdc-form-field .options .options-container ui-button.password{width:24px!important}.ui-field .mat-mdc-form-field .options .options-container ui-button.password .button-wrapper .button-container button,.ui-field .mat-mdc-form-field .options .options-container ui-button.password .button-wrapper .button-container span{width:24px!important;height:24px!important}.ui-field .mat-mdc-form-field .options .options-container ui-icon.valid mat-icon{background:#3c9a13;border-radius:100%}.ui-field .mat-mdc-form-field .options .options-container ui-icon.valid mat-icon svg{color:#fff!important}.ui-field .mat-mdc-form-field .options .options-container ui-button.validation svg circle{stroke:#d410aa}.ui-field .mat-mdc-form-field .options .options-container ui-button.validation *{color:#d410aa}.ui-field .mat-mdc-form-field .options .options-container ui-button,.ui-field .mat-mdc-form-field .options .options-container ui-icon{display:flex}.ui-field .mat-mdc-form-field .options .options-container ui-button svg,.ui-field .mat-mdc-form-field .options .options-container ui-icon svg{color:#888}.ui-field .mat-mdc-form-field .options ui-button button.secondary.only-icon{padding:0;height:auto;background:transparent}.ui-field .mat-mdc-form-field .options ui-button button.secondary.only-icon:hover,.ui-field .mat-mdc-form-field .options ui-button button.secondary.only-icon:focus{background:transparent;color:inherit;border:none;outline:none}.ui-field .mat-mdc-form-field.mat-form-field-disabled .mat-mdc-input-element,.ui-field .mat-mdc-form-field.mat-form-field-disabled .mdc-floating-label{pointer-events:none}.ui-field .mat-mdc-form-field.mat-form-field-disabled.mat-form-field-appearance-outline .mdc-notched-outline{color:#e0e0e0}.ui-field .mat-mdc-form-field.mat-form-field-disabled .options .options-container ui-button svg,.ui-field .mat-mdc-form-field.mat-form-field-disabled .options .options-container ui-icon svg{color:#e0e0e0}.ui-field[theme=dark] .mat-mdc-form-field.mat-form-field-appearance-outline .mat-mdc-text-field-wrapper,.ui-field[theme=light] .mat-mdc-form-field.mat-form-field-appearance-outline .mat-mdc-text-field-wrapper{height:48px}.ui-field[theme=dark] .mat-mdc-form-field.mat-form-field-appearance-outline .mat-mdc-text-field-wrapper.mdc-text-field--disabled .mdc-notched-outline__notch label,.ui-field[theme=light] .mat-mdc-form-field.mat-form-field-appearance-outline .mat-mdc-text-field-wrapper.mdc-text-field--disabled .mdc-notched-outline__notch label{color:#e9e9e9!important}.ui-field[theme=dark] .mat-mdc-form-field.mat-form-field-appearance-outline .mat-mdc-text-field-wrapper .mat-mdc-form-field-flex .mat-mdc-floating-label.mdc-floating-label--float-above,.ui-field[theme=light] .mat-mdc-form-field.mat-form-field-appearance-outline .mat-mdc-text-field-wrapper .mat-mdc-form-field-flex .mat-mdc-floating-label.mdc-floating-label--float-above{color:#242424!important}.ui-field[theme=dark] .mat-mdc-form-field.mat-form-field-appearance-outline .mat-mdc-text-field-wrapper .mdc-notched-outline__leading,.ui-field[theme=light] .mat-mdc-form-field.mat-form-field-appearance-outline .mat-mdc-text-field-wrapper .mdc-notched-outline__leading{border-top-left-radius:10px;border-bottom-left-radius:10px}.ui-field[theme=dark] .mat-mdc-form-field.mat-form-field-appearance-outline .mat-mdc-text-field-wrapper .mdc-notched-outline__trailing,.ui-field[theme=light] .mat-mdc-form-field.mat-form-field-appearance-outline .mat-mdc-text-field-wrapper .mdc-notched-outline__trailing{border-top-right-radius:10px;border-bottom-right-radius:10px}.ui-field[theme=dark] .mat-mdc-form-field.mat-form-field-appearance-outline .mat-mdc-text-field-wrapper:hover .mat-mdc-form-field-icon-prefix svg,.ui-field[theme=light] .mat-mdc-form-field.mat-form-field-appearance-outline .mat-mdc-text-field-wrapper:hover .mat-mdc-form-field-icon-prefix svg{color:#242424!important}.ui-field[theme=dark] .mat-mdc-form-field.mat-form-field-appearance-outline .mat-mdc-text-field-wrapper:hover .password .icon-only-wrapper svg,.ui-field[theme=light] .mat-mdc-form-field.mat-form-field-appearance-outline .mat-mdc-text-field-wrapper:hover .password .icon-only-wrapper svg{color:#242424!important}.ui-field[theme=dark] .mat-mdc-form-field.mat-form-field-appearance-outline .mat-mdc-text-field-wrapper:hover .mat-mdc-form-field-flex .mat-mdc-floating-label:not(.mdc-floating-label--float-above),.ui-field[theme=light] .mat-mdc-form-field.mat-form-field-appearance-outline .mat-mdc-text-field-wrapper:hover .mat-mdc-form-field-flex .mat-mdc-floating-label:not(.mdc-floating-label--float-above){top:21px!important}.ui-field[theme=dark] .mat-mdc-form-field.mat-form-field-appearance-outline .mat-mdc-text-field-wrapper:hover .mat-mdc-form-field-icon-prefix svg,.ui-field[theme=dark] .mat-mdc-form-field.mat-form-field-appearance-outline .mat-mdc-text-field-wrapper.mdc-text-field--focused .mat-mdc-form-field-icon-prefix svg,.ui-field[theme=light] .mat-mdc-form-field.mat-form-field-appearance-outline .mat-mdc-text-field-wrapper:hover .mat-mdc-form-field-icon-prefix svg,.ui-field[theme=light] .mat-mdc-form-field.mat-form-field-appearance-outline .mat-mdc-text-field-wrapper.mdc-text-field--focused .mat-mdc-form-field-icon-prefix svg{color:#242424!important}.ui-field[theme=dark] .mat-mdc-form-field.mat-form-field-appearance-outline .mat-mdc-text-field-wrapper:hover .mdc-notched-outline__leading,.ui-field[theme=dark] .mat-mdc-form-field.mat-form-field-appearance-outline .mat-mdc-text-field-wrapper:hover .mdc-notched-outline__notch,.ui-field[theme=dark] .mat-mdc-form-field.mat-form-field-appearance-outline .mat-mdc-text-field-wrapper:hover .mdc-notched-outline__trailing,.ui-field[theme=dark] .mat-mdc-form-field.mat-form-field-appearance-outline .mat-mdc-text-field-wrapper.mdc-text-field--focused .mdc-notched-outline__leading,.ui-field[theme=dark] .mat-mdc-form-field.mat-form-field-appearance-outline .mat-mdc-text-field-wrapper.mdc-text-field--focused .mdc-notched-outline__notch,.ui-field[theme=dark] .mat-mdc-form-field.mat-form-field-appearance-outline .mat-mdc-text-field-wrapper.mdc-text-field--focused .mdc-notched-outline__trailing,.ui-field[theme=light] .mat-mdc-form-field.mat-form-field-appearance-outline .mat-mdc-text-field-wrapper:hover .mdc-notched-outline__leading,.ui-field[theme=light] .mat-mdc-form-field.mat-form-field-appearance-outline .mat-mdc-text-field-wrapper:hover .mdc-notched-outline__notch,.ui-field[theme=light] .mat-mdc-form-field.mat-form-field-appearance-outline .mat-mdc-text-field-wrapper:hover .mdc-notched-outline__trailing,.ui-field[theme=light] .mat-mdc-form-field.mat-form-field-appearance-outline .mat-mdc-text-field-wrapper.mdc-text-field--focused .mdc-notched-outline__leading,.ui-field[theme=light] .mat-mdc-form-field.mat-form-field-appearance-outline .mat-mdc-text-field-wrapper.mdc-text-field--focused .mdc-notched-outline__notch,.ui-field[theme=light] .mat-mdc-form-field.mat-form-field-appearance-outline .mat-mdc-text-field-wrapper.mdc-text-field--focused .mdc-notched-outline__trailing{border-color:#242424!important}.ui-field[theme=dark] .mat-mdc-form-field.mat-form-field-appearance-outline .mat-mdc-text-field-wrapper:hover .mat-mdc-form-field-flex .mat-mdc-floating-label.mdc-floating-label--float-above,.ui-field[theme=dark] .mat-mdc-form-field.mat-form-field-appearance-outline .mat-mdc-text-field-wrapper.mdc-text-field--focused .mat-mdc-form-field-flex .mat-mdc-floating-label.mdc-floating-label--float-above,.ui-field[theme=light] .mat-mdc-form-field.mat-form-field-appearance-outline .mat-mdc-text-field-wrapper:hover .mat-mdc-form-field-flex .mat-mdc-floating-label.mdc-floating-label--float-above,.ui-field[theme=light] .mat-mdc-form-field.mat-form-field-appearance-outline .mat-mdc-text-field-wrapper.mdc-text-field--focused .mat-mdc-form-field-flex .mat-mdc-floating-label.mdc-floating-label--float-above{color:#242424!important}.ui-field[theme=dark] .mat-mdc-form-field.mat-form-field-appearance-outline.mat-warn .mat-mdc-form-field-hint.error,.ui-field[theme=light] .mat-mdc-form-field.mat-form-field-appearance-outline.mat-warn .mat-mdc-form-field-hint.error{color:#e02800!important}.ui-field[theme=dark] .mat-mdc-form-field.mat-form-field-appearance-outline.mat-warn .mat-mdc-form-field-hint.error svg,.ui-field[theme=light] .mat-mdc-form-field.mat-form-field-appearance-outline.mat-warn .mat-mdc-form-field-hint.error svg{color:#e02800!important}.ui-field[theme=dark] .mat-mdc-form-field.mat-form-field-appearance-outline.mat-warn .mat-mdc-form-field-flex .mat-mdc-floating-label.mdc-floating-label--float-above,.ui-field[theme=light] .mat-mdc-form-field.mat-form-field-appearance-outline.mat-warn .mat-mdc-form-field-flex .mat-mdc-floating-label.mdc-floating-label--float-above{color:#e02800!important}.ui-field[theme=dark] .mat-mdc-form-field.mat-form-field-appearance-outline.mat-warn .mat-mdc-text-field-wrapper .mdc-notched-outline__leading,.ui-field[theme=dark] .mat-mdc-form-field.mat-form-field-appearance-outline.mat-warn .mat-mdc-text-field-wrapper .mdc-notched-outline__notch,.ui-field[theme=dark] .mat-mdc-form-field.mat-form-field-appearance-outline.mat-warn .mat-mdc-text-field-wrapper .mdc-notched-outline__trailing,.ui-field[theme=light] .mat-mdc-form-field.mat-form-field-appearance-outline.mat-warn .mat-mdc-text-field-wrapper .mdc-notched-outline__leading,.ui-field[theme=light] .mat-mdc-form-field.mat-form-field-appearance-outline.mat-warn .mat-mdc-text-field-wrapper .mdc-notched-outline__notch,.ui-field[theme=light] .mat-mdc-form-field.mat-form-field-appearance-outline.mat-warn .mat-mdc-text-field-wrapper .mdc-notched-outline__trailing{border-color:#e02800!important}.ui-field[theme=dark] .mat-mdc-form-field.mat-form-field-appearance-outline.mat-warn .mat-mdc-text-field-wrapper:hover .mat-mdc-form-field-icon-prefix svg,.ui-field[theme=dark] .mat-mdc-form-field.mat-form-field-appearance-outline.mat-warn .mat-mdc-text-field-wrapper.mdc-text-field--focused .mat-mdc-form-field-icon-prefix svg,.ui-field[theme=light] .mat-mdc-form-field.mat-form-field-appearance-outline.mat-warn .mat-mdc-text-field-wrapper:hover .mat-mdc-form-field-icon-prefix svg,.ui-field[theme=light] .mat-mdc-form-field.mat-form-field-appearance-outline.mat-warn .mat-mdc-text-field-wrapper.mdc-text-field--focused .mat-mdc-form-field-icon-prefix svg{color:#e02800!important}.ui-field[theme=dark] .mat-mdc-form-field.mat-form-field-appearance-outline.mat-warn .mat-mdc-text-field-wrapper:hover .mdc-notched-outline__leading,.ui-field[theme=dark] .mat-mdc-form-field.mat-form-field-appearance-outline.mat-warn .mat-mdc-text-field-wrapper:hover .mdc-notched-outline__notch,.ui-field[theme=dark] .mat-mdc-form-field.mat-form-field-appearance-outline.mat-warn .mat-mdc-text-field-wrapper:hover .mdc-notched-outline__trailing,.ui-field[theme=dark] .mat-mdc-form-field.mat-form-field-appearance-outline.mat-warn .mat-mdc-text-field-wrapper.mdc-text-field--focused .mdc-notched-outline__leading,.ui-field[theme=dark] .mat-mdc-form-field.mat-form-field-appearance-outline.mat-warn .mat-mdc-text-field-wrapper.mdc-text-field--focused .mdc-notched-outline__notch,.ui-field[theme=dark] .mat-mdc-form-field.mat-form-field-appearance-outline.mat-warn .mat-mdc-text-field-wrapper.mdc-text-field--focused .mdc-notched-outline__trailing,.ui-field[theme=light] .mat-mdc-form-field.mat-form-field-appearance-outline.mat-warn .mat-mdc-text-field-wrapper:hover .mdc-notched-outline__leading,.ui-field[theme=light] .mat-mdc-form-field.mat-form-field-appearance-outline.mat-warn .mat-mdc-text-field-wrapper:hover .mdc-notched-outline__notch,.ui-field[theme=light] .mat-mdc-form-field.mat-form-field-appearance-outline.mat-warn .mat-mdc-text-field-wrapper:hover .mdc-notched-outline__trailing,.ui-field[theme=light] .mat-mdc-form-field.mat-form-field-appearance-outline.mat-warn .mat-mdc-text-field-wrapper.mdc-text-field--focused .mdc-notched-outline__leading,.ui-field[theme=light] .mat-mdc-form-field.mat-form-field-appearance-outline.mat-warn .mat-mdc-text-field-wrapper.mdc-text-field--focused .mdc-notched-outline__notch,.ui-field[theme=light] .mat-mdc-form-field.mat-form-field-appearance-outline.mat-warn .mat-mdc-text-field-wrapper.mdc-text-field--focused .mdc-notched-outline__trailing{border-color:#e02800!important}.ui-field[theme=dark] .mat-mdc-form-field.mat-form-field-appearance-outline.mat-warn .mat-mdc-text-field-wrapper:hover .mat-mdc-form-field-flex .mat-mdc-floating-label.mdc-floating-label--float-above,.ui-field[theme=dark] .mat-mdc-form-field.mat-form-field-appearance-outline.mat-warn .mat-mdc-text-field-wrapper.mdc-text-field--focused .mat-mdc-form-field-flex .mat-mdc-floating-label.mdc-floating-label--float-above,.ui-field[theme=light] .mat-mdc-form-field.mat-form-field-appearance-outline.mat-warn .mat-mdc-text-field-wrapper:hover .mat-mdc-form-field-flex .mat-mdc-floating-label.mdc-floating-label--float-above,.ui-field[theme=light] .mat-mdc-form-field.mat-form-field-appearance-outline.mat-warn .mat-mdc-text-field-wrapper.mdc-text-field--focused .mat-mdc-form-field-flex .mat-mdc-floating-label.mdc-floating-label--float-above{color:#e02800!important}.ui-field[theme=dark] .mat-mdc-form-field.text-area-borderless.mat-mdc-form-field-type-mat-input.mat-form-field-appearance-outline .mat-mdc-text-field-wrapper .mdc-notched-outline__leading,.ui-field[theme=dark] .mat-mdc-form-field.text-area-borderless.mat-mdc-form-field-type-mat-input.mat-form-field-appearance-outline .mat-mdc-text-field-wrapper .mdc-notched-outline__leading:hover,.ui-field[theme=dark] .mat-mdc-form-field.multi-line-textarea.mat-mdc-form-field-type-mat-input.mat-form-field-appearance-outline .mat-mdc-text-field-wrapper .mdc-notched-outline__leading,.ui-field[theme=dark] .mat-mdc-form-field.multi-line-textarea.mat-mdc-form-field-type-mat-input.mat-form-field-appearance-outline .mat-mdc-text-field-wrapper .mdc-notched-outline__leading:hover,.ui-field[theme=light] .mat-mdc-form-field.text-area-borderless.mat-mdc-form-field-type-mat-input.mat-form-field-appearance-outline .mat-mdc-text-field-wrapper .mdc-notched-outline__leading,.ui-field[theme=light] .mat-mdc-form-field.text-area-borderless.mat-mdc-form-field-type-mat-input.mat-form-field-appearance-outline .mat-mdc-text-field-wrapper .mdc-notched-outline__leading:hover,.ui-field[theme=light] .mat-mdc-form-field.multi-line-textarea.mat-mdc-form-field-type-mat-input.mat-form-field-appearance-outline .mat-mdc-text-field-wrapper .mdc-notched-outline__leading,.ui-field[theme=light] .mat-mdc-form-field.multi-line-textarea.mat-mdc-form-field-type-mat-input.mat-form-field-appearance-outline .mat-mdc-text-field-wrapper .mdc-notched-outline__leading:hover,.ui-field[theme=dark] .mat-mdc-form-field.text-area-borderless.mat-mdc-form-field-type-mat-input.mat-form-field-appearance-outline .mat-mdc-text-field-wrapper .mdc-notched-outline__trailing,.ui-field[theme=dark] .mat-mdc-form-field.text-area-borderless.mat-mdc-form-field-type-mat-input.mat-form-field-appearance-outline .mat-mdc-text-field-wrapper .mdc-notched-outline__trailing:hover,.ui-field[theme=dark] .mat-mdc-form-field.multi-line-textarea.mat-mdc-form-field-type-mat-input.mat-form-field-appearance-outline .mat-mdc-text-field-wrapper .mdc-notched-outline__trailing,.ui-field[theme=dark] .mat-mdc-form-field.multi-line-textarea.mat-mdc-form-field-type-mat-input.mat-form-field-appearance-outline .mat-mdc-text-field-wrapper .mdc-notched-outline__trailing:hover,.ui-field[theme=light] .mat-mdc-form-field.text-area-borderless.mat-mdc-form-field-type-mat-input.mat-form-field-appearance-outline .mat-mdc-text-field-wrapper .mdc-notched-outline__trailing,.ui-field[theme=light] .mat-mdc-form-field.text-area-borderless.mat-mdc-form-field-type-mat-input.mat-form-field-appearance-outline .mat-mdc-text-field-wrapper .mdc-notched-outline__trailing:hover,.ui-field[theme=light] .mat-mdc-form-field.multi-line-textarea.mat-mdc-form-field-type-mat-input.mat-form-field-appearance-outline .mat-mdc-text-field-wrapper .mdc-notched-outline__trailing,.ui-field[theme=light] .mat-mdc-form-field.multi-line-textarea.mat-mdc-form-field-type-mat-input.mat-form-field-appearance-outline .mat-mdc-text-field-wrapper .mdc-notched-outline__trailing:hover,.ui-field[theme=dark] .mat-mdc-form-field.text-area-borderless.mat-mdc-form-field-type-mat-input.mat-form-field-appearance-outline .mat-mdc-text-field-wrapper .mdc-notched-outline__notch,.ui-field[theme=dark] .mat-mdc-form-field.text-area-borderless.mat-mdc-form-field-type-mat-input.mat-form-field-appearance-outline .mat-mdc-text-field-wrapper .mdc-notched-outline__notch:hover,.ui-field[theme=dark] .mat-mdc-form-field.multi-line-textarea.mat-mdc-form-field-type-mat-input.mat-form-field-appearance-outline .mat-mdc-text-field-wrapper .mdc-notched-outline__notch,.ui-field[theme=dark] .mat-mdc-form-field.multi-line-textarea.mat-mdc-form-field-type-mat-input.mat-form-field-appearance-outline .mat-mdc-text-field-wrapper .mdc-notched-outline__notch:hover,.ui-field[theme=light] .mat-mdc-form-field.text-area-borderless.mat-mdc-form-field-type-mat-input.mat-form-field-appearance-outline .mat-mdc-text-field-wrapper .mdc-notched-outline__notch,.ui-field[theme=light] .mat-mdc-form-field.text-area-borderless.mat-mdc-form-field-type-mat-input.mat-form-field-appearance-outline .mat-mdc-text-field-wrapper .mdc-notched-outline__notch:hover,.ui-field[theme=light] .mat-mdc-form-field.multi-line-textarea.mat-mdc-form-field-type-mat-input.mat-form-field-appearance-outline .mat-mdc-text-field-wrapper .mdc-notched-outline__notch,.ui-field[theme=light] .mat-mdc-form-field.multi-line-textarea.mat-mdc-form-field-type-mat-input.mat-form-field-appearance-outline .mat-mdc-text-field-wrapper .mdc-notched-outline__notch:hover{border-color:transparent!important}.ui-field[theme=dark] .mat-mdc-form-field.text-area-borderless.mat-mdc-form-field-type-mat-input.mat-form-field-appearance-outline .mat-mdc-text-field-wrapper .mdc-floating-label,.ui-field[theme=dark] .mat-mdc-form-field.multi-line-textarea.mat-mdc-form-field-type-mat-input.mat-form-field-appearance-outline .mat-mdc-text-field-wrapper .mdc-floating-label,.ui-field[theme=light] .mat-mdc-form-field.text-area-borderless.mat-mdc-form-field-type-mat-input.mat-form-field-appearance-outline .mat-mdc-text-field-wrapper .mdc-floating-label,.ui-field[theme=light] .mat-mdc-form-field.multi-line-textarea.mat-mdc-form-field-type-mat-input.mat-form-field-appearance-outline .mat-mdc-text-field-wrapper .mdc-floating-label{color:#919191!important}.ui-field[theme=dark] .mat-mdc-form-field.text-area-borderless.mat-mdc-form-field-type-mat-input.mat-form-field-appearance-outline .mat-mdc-text-field-wrapper .mat-mdc-input-element,.ui-field[theme=dark] .mat-mdc-form-field.multi-line-textarea.mat-mdc-form-field-type-mat-input.mat-form-field-appearance-outline .mat-mdc-text-field-wrapper .mat-mdc-input-element,.ui-field[theme=light] .mat-mdc-form-field.text-area-borderless.mat-mdc-form-field-type-mat-input.mat-form-field-appearance-outline .mat-mdc-text-field-wrapper .mat-mdc-input-element,.ui-field[theme=light] .mat-mdc-form-field.multi-line-textarea.mat-mdc-form-field-type-mat-input.mat-form-field-appearance-outline .mat-mdc-text-field-wrapper .mat-mdc-input-element{color:#242424}.ui-field[theme=dark] .mat-mdc-form-field.text-area-borderless.mat-mdc-form-field-type-mat-input.mat-form-field-appearance-outline .mat-mdc-form-field-infix,.ui-field[theme=dark] .mat-mdc-form-field.multi-line-textarea.mat-mdc-form-field-type-mat-input.mat-form-field-appearance-outline .mat-mdc-form-field-infix,.ui-field[theme=light] .mat-mdc-form-field.text-area-borderless.mat-mdc-form-field-type-mat-input.mat-form-field-appearance-outline .mat-mdc-form-field-infix,.ui-field[theme=light] .mat-mdc-form-field.multi-line-textarea.mat-mdc-form-field-type-mat-input.mat-form-field-appearance-outline .mat-mdc-form-field-infix{padding:12px 0!important}.ui-field[theme=dark] .mat-mdc-form-field.text-area-borderless.mat-mdc-form-field-type-mat-input.mat-form-field-appearance-outline .mdc-floating-label--float-above,.ui-field[theme=dark] .mat-mdc-form-field.multi-line-textarea.mat-mdc-form-field-type-mat-input.mat-form-field-appearance-outline .mdc-floating-label--float-above,.ui-field[theme=light] .mat-mdc-form-field.text-area-borderless.mat-mdc-form-field-type-mat-input.mat-form-field-appearance-outline .mdc-floating-label--float-above,.ui-field[theme=light] .mat-mdc-form-field.multi-line-textarea.mat-mdc-form-field-type-mat-input.mat-form-field-appearance-outline .mdc-floating-label--float-above{display:none!important}.ui-field[theme=dark] .mat-mdc-form-field.text-area-borderless.mat-mdc-form-field-type-mat-input.mat-form-field-appearance-outline .mat-mdc-text-field-wrapper,.ui-field[theme=dark] .mat-mdc-form-field.multi-line-textarea.mat-mdc-form-field-type-mat-input.mat-form-field-appearance-outline .mat-mdc-text-field-wrapper,.ui-field[theme=light] .mat-mdc-form-field.text-area-borderless.mat-mdc-form-field-type-mat-input.mat-form-field-appearance-outline .mat-mdc-text-field-wrapper,.ui-field[theme=light] .mat-mdc-form-field.multi-line-textarea.mat-mdc-form-field-type-mat-input.mat-form-field-appearance-outline .mat-mdc-text-field-wrapper{border-radius:0!important}.ui-field[theme=dark] .mat-mdc-form-field.text-area-borderless.textarea textarea,.ui-field[theme=dark] .mat-mdc-form-field.multi-line-textarea.textarea textarea,.ui-field[theme=light] .mat-mdc-form-field.text-area-borderless.textarea textarea,.ui-field[theme=light] .mat-mdc-form-field.multi-line-textarea.textarea textarea{padding-top:0}.ui-field[theme=dark] .field-badge,.ui-field[theme=light] .field-badge{position:absolute;left:-27px;top:-10px;z-index:1}\n"], dependencies: [{ kind: "component", type: MatFormField, selector: "mat-form-field", inputs: ["hideRequiredMarker", "color", "floatLabel", "appearance", "subscriptSizing", "hintLabel"], exportAs: ["matFormField"] }, { kind: "directive", type: NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }, { kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: MatLabel, selector: "mat-label" }, { kind: "ngmodule", type: IconComponentModule }, { kind: "component", type: i1.IconComponent, selector: "ui-icon", inputs: ["size", "cssClass", "name", "color", "filled", "toggleIconStyle", "applicationTheme", "useFullIconName"] }, { kind: "component", type: MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "directive", type: MatPrefix, selector: "[matPrefix], [matIconPrefix], [matTextPrefix]", inputs: ["matTextPrefix"] }, { kind: "directive", type: MatInput, selector: "input[matInput], textarea[matInput], select[matNativeControl],      input[matNativeControl], textarea[matNativeControl]", inputs: ["disabled", "id", "placeholder", "name", "required", "type", "errorStateMatcher", "aria-describedby", "value", "readonly", "disabledInteractive"], exportAs: ["matInput"] }, { kind: "directive", type: DigitsOnlyDirective, selector: "[digitsOnly]", inputs: ["allowNegative", "allowDecimal", "allowOnlyDigits"] }, { kind: "directive", type: CdkTextareaAutosize, selector: "textarea[cdkTextareaAutosize]", inputs: ["cdkAutosizeMinRows", "cdkAutosizeMaxRows", "cdkTextareaAutosize", "placeholder"], exportAs: ["cdkTextareaAutosize"] }, { kind: "component", type: ButtonComponent, selector: "ui-button", inputs: ["size", "variant", "label", "iconPosition", "justIcon", "iconName", "disabled", "loading", "loadingWithLabel", "fullWidth", "url", "urlTarget", "value", "tooltip", "isPremium", "type", "companyColor", "buttonBadgeConfig", "applicationTheme", "disabledScaleOnClick", "ariaLabel", "ariaExpanded", "ariaControls", "ariaPressed", "ariaRequired", "ariaLabelledby", "ariaDescribedby", "preventDefault", "hasBackground", "tooltipPosition", "role", "iconFilled"], outputs: ["buttonClickEvent", "buttonHoverEvent"] }, { kind: "directive", type: MatHint, selector: "mat-hint", inputs: ["align", "id"] }, { kind: "ngmodule", type: ValidationErrorModule }, { kind: "component", type: i2.ValidationErrorComponent, selector: "ui-validation-error", inputs: ["ngControl", "touchedOn", "errorMessage", "label", "applicationTheme", "customErrors"] }, { kind: "component", type: BadgeComponent, selector: "ui-badge", inputs: ["label", "staticLabel", "icon", "iconColor", "trailingIcon", "trailingIconColor", "color", "variant", "notificationsAmount", "applicationTheme", "rebrandColor", "truncateLabel", "enableAnimation"] }, { kind: "pipe", type: AsyncPipe, name: "async" }, { kind: "pipe", type: UiTranslatePipe, name: "uiTranslate" }, { kind: "pipe", type: HasValidationErrorPipe, name: "hasValidationError" }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.18", ngImport: i0, type: FieldComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.19", ngImport: i0, type: FieldComponent, decorators: [{
             type: Component,
             args: [{ selector: 'ui-field', encapsulation: ViewEncapsulation.None, changeDetection: ChangeDetectionStrategy.OnPush, imports: [
                         MatFormField,
@@ -589,8 +589,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.18", ngImpo
             }] } });
 
 class FieldComponentModule {
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.18", ngImport: i0, type: FieldComponentModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
-    static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "21.2.18", ngImport: i0, type: FieldComponentModule, imports: [CommonModule,
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.19", ngImport: i0, type: FieldComponentModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
+    static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "21.2.19", ngImport: i0, type: FieldComponentModule, imports: [CommonModule,
             MatFormFieldModule,
             MatInputModule,
             IconComponentModule,
@@ -604,7 +604,7 @@ class FieldComponentModule {
             DigitsOnlyDirective,
             BadgeComponentModule,
             FieldComponent], exports: [FieldComponent] }); }
-    static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "21.2.18", ngImport: i0, type: FieldComponentModule, imports: [CommonModule,
+    static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "21.2.19", ngImport: i0, type: FieldComponentModule, imports: [CommonModule,
             MatFormFieldModule,
             MatInputModule,
             IconComponentModule,
@@ -616,7 +616,7 @@ class FieldComponentModule {
             BadgeComponentModule,
             FieldComponent] }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.18", ngImport: i0, type: FieldComponentModule, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.19", ngImport: i0, type: FieldComponentModule, decorators: [{
             type: NgModule,
             args: [{
                     imports: [

package/fesm2022/testgorilla-tgo-ui-components-file-upload.mjs

@@ -38,10 +38,10 @@ class DragDropDirective {
             }
         }
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.18", ngImport: i0, type: DragDropDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
-    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "21.2.18", type: DragDropDirective, isStandalone: true, selector: "[uiDragDrop]", outputs: { fileDropped: "fileDropped" }, host: { listeners: { "dragover": "onDragOver($event)", "dragleave": "onDragLeave($event)", "drop": "ondrop($event)" }, properties: { "class.file-over": "this.file" } }, ngImport: i0 }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.19", ngImport: i0, type: DragDropDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
+    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "21.2.19", type: DragDropDirective, isStandalone: true, selector: "[uiDragDrop]", outputs: { fileDropped: "fileDropped" }, host: { listeners: { "dragover": "onDragOver($event)", "dragleave": "onDragLeave($event)", "drop": "ondrop($event)" }, properties: { "class.file-over": "this.file" } }, ngImport: i0 }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.18", ngImport: i0, type: DragDropDirective, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.19", ngImport: i0, type: DragDropDirective, decorators: [{
             type: Directive,
             args: [{ selector: '[uiDragDrop]' }]
         }], ctorParameters: () => [], propDecorators: { file: [{
@@ -238,8 +238,8 @@ class FileUploadComponent {
             this.isCanceled = true;
         }
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.18", ngImport: i0, type: FileUploadComponent, deps: [{ token: 'CANOPYUI_DEFAULT_APPLICATION_THEME', optional: true }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.18", type: FileUploadComponent, isStandalone: true, selector: "ui-file-upload", inputs: { maxFileSizeMB: "maxFileSizeMB", minFileSizeMB: "minFileSizeMB", supportedFileTypes: "supportedFileTypes", uploadProgress: "uploadProgress", showUploadProgress: "showUploadProgress", fileProcessingMessage: "fileProcessingMessage", errors: "errors", disabled: "disabled", file: "file", companyColor: "companyColor", applicationTheme: "applicationTheme", ariaLabel: "ariaLabel", ariaRequired: "ariaRequired", showFileSize: "showFileSize" }, outputs: { OnDrop: "OnDrop" }, host: { properties: { "class": "this.class", "style.--color": "this.compColor" } }, providers: [
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.19", ngImport: i0, type: FileUploadComponent, deps: [{ token: 'CANOPYUI_DEFAULT_APPLICATION_THEME', optional: true }], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.19", type: FileUploadComponent, isStandalone: true, selector: "ui-file-upload", inputs: { maxFileSizeMB: "maxFileSizeMB", minFileSizeMB: "minFileSizeMB", supportedFileTypes: "supportedFileTypes", uploadProgress: "uploadProgress", showUploadProgress: "showUploadProgress", fileProcessingMessage: "fileProcessingMessage", errors: "errors", disabled: "disabled", file: "file", companyColor: "companyColor", applicationTheme: "applicationTheme", ariaLabel: "ariaLabel", ariaRequired: "ariaRequired", showFileSize: "showFileSize" }, outputs: { OnDrop: "OnDrop" }, host: { properties: { "class": "this.class", "style.--color": "this.compColor" } }, providers: [
             {
                 provide: NG_VALUE_ACCESSOR,
                 useExisting: forwardRef(() => FileUploadComponent),
@@ -278,7 +278,7 @@ class FileUploadComponent {
             ]),
         ], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.18", ngImport: i0, type: FileUploadComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.19", ngImport: i0, type: FileUploadComponent, decorators: [{
             type: Component,
             args: [{ selector: 'ui-file-upload', encapsulation: ViewEncapsulation.None, providers: [
                         {
@@ -373,8 +373,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.18", ngImpo
             }] } });
 
 class FileUploadComponentModule {
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.18", ngImport: i0, type: FileUploadComponentModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
-    static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "21.2.18", ngImport: i0, type: FileUploadComponentModule, imports: [CommonModule,
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.19", ngImport: i0, type: FileUploadComponentModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
+    static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "21.2.19", ngImport: i0, type: FileUploadComponentModule, imports: [CommonModule,
             MatFormFieldModule,
             MatInputModule,
             IconComponentModule,
@@ -382,14 +382,14 @@ class FileUploadComponentModule {
             UiTranslatePipe,
             FileUploadComponent,
             DragDropDirective], exports: [FileUploadComponent] }); }
-    static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "21.2.18", ngImport: i0, type: FileUploadComponentModule, imports: [CommonModule,
+    static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "21.2.19", ngImport: i0, type: FileUploadComponentModule, imports: [CommonModule,
             MatFormFieldModule,
             MatInputModule,
             IconComponentModule,
             ProgressBarComponentModule,
             FileUploadComponent] }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.18", ngImport: i0, type: FileUploadComponentModule, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.19", ngImport: i0, type: FileUploadComponentModule, decorators: [{
             type: NgModule,
             args: [{
                     imports: [

package/fesm2022/testgorilla-tgo-ui-components-filter-button.mjs

@@ -311,10 +311,10 @@ class FilterButtonComponent {
         this.tooltip.set(tooltip);
         this.cdr.markForCheck();
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.18", ngImport: i0, type: FilterButtonComponent, deps: [{ token: 'CANOPYUI_DEFAULT_APPLICATION_THEME', optional: true }, { token: i0.ChangeDetectorRef }, { token: i0.DestroyRef }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.18", type: FilterButtonComponent, isStandalone: true, selector: "ui-filter-button", inputs: { label: { classPropertyName: "label", publicName: "label", isSignal: false, isRequired: false, transformFunction: null }, message: { classPropertyName: "message", publicName: "message", isSignal: false, isRequired: false, transformFunction: null }, value: { classPropertyName: "value", publicName: "value", isSignal: false, isRequired: false, transformFunction: null }, disabled: { classPropertyName: "disabled", publicName: "disabled", isSignal: false, isRequired: false, transformFunction: null }, options: { classPropertyName: "options", publicName: "options", isSignal: true, isRequired: false, transformFunction: null }, allowClear: { classPropertyName: "allowClear", publicName: "allowClear", isSignal: false, isRequired: false, transformFunction: null }, singleSelection: { classPropertyName: "singleSelection", publicName: "singleSelection", isSignal: false, isRequired: false, transformFunction: null }, iconName: { classPropertyName: "iconName", publicName: "iconName", isSignal: false, isRequired: false, transformFunction: null }, iconPosition: { classPropertyName: "iconPosition", publicName: "iconPosition", isSignal: false, isRequired: false, transformFunction: null }, noOptionsMessage: { classPropertyName: "noOptionsMessage", publicName: "noOptionsMessage", isSignal: false, isRequired: false, transformFunction: null }, fullWidth: { classPropertyName: "fullWidth", publicName: "fullWidth", isSignal: false, isRequired: false, transformFunction: booleanAttribute }, applicationTheme: { classPropertyName: "applicationTheme", publicName: "applicationTheme", isSignal: false, isRequired: false, transformFunction: null } }, outputs: { changed: "changed", optionChange: "optionChange" }, host: { properties: { "class": "this.class", "attr.theme": "this.applicationTheme", "class.ui-filter-button-full-width": "this.fullWidthClass" } }, viewQueries: [{ propertyName: "overlayContainer", first: true, predicate: ["overlayContainer"], descendants: true }, { propertyName: "viewport", first: true, predicate: CdkVirtualScrollViewport, descendants: true }, { propertyName: "triggerOrigin", first: true, predicate: CdkOverlayOrigin, descendants: true }, { propertyName: "connectedOverlay", first: true, predicate: CdkConnectedOverlay, descendants: true }], usesOnChanges: true, ngImport: i0, template: "<ng-container>\n  <ui-button\n    [matTooltip]=\"tooltip()\"\n    [matTooltipClass]=\"'tooltip-multi-line ' + applicationTheme\"\n    [matTooltipPosition]=\"'above'\"\n    class=\"ui-filter-button-trigger\"\n    [class.button-opened]=\"isOpen()\"\n    [variant]=\"value.length || isOpen() ? 'secondary' : 'ghost'\"\n    [label]=\"displayedLabel() || label\"\n    [disabled]=\"disabled || (options().length === 0 && !noOptionsMessage)\"\n    (click)=\"toggle()\"\n    type=\"button\"\n    size=\"small\"\n    [role]=\"'combobox'\"\n    [tooltip]=\"value.length ? ' ' : ''\"\n    [attr.aria-expanded]=\"isOpen()\"\n    [iconName]=\"iconName || (isOpen() ? 'Arrow-chevron-up-filled' : 'Arrow-chevron-down-filled')\"\n    [iconPosition]=\"iconPosition\"\n    [applicationTheme]=\"applicationTheme\"\n    [fullWidth]=\"fullWidth\"\n    cdkOverlayOrigin\n    #trigger=\"cdkOverlayOrigin\"\n  ></ui-button>\n  <ng-template\n    cdkConnectedOverlay\n    [cdkConnectedOverlayOrigin]=\"trigger\"\n    [cdkConnectedOverlayOpen]=\"isOpen()\"\n    [cdkConnectedOverlayMatchWidth]=\"fullWidth\"\n    [cdkConnectedOverlayMinWidth]=\"fullWidth ? PANEL_MIN_WIDTH : ''\"\n    [cdkConnectedOverlayPanelClass]=\"fullWidth ? MATCH_TRIGGER_PANEL_CLASS : ''\"\n    (overlayOutsideClick)=\"outsideClick()\"\n  >\n    @if (activeOption(); as active) {\n      <div style=\"position: absolute; left: -9999px\" [attr.aria-live]=\"'polite'\">\n        {{ active.label }}\n        {{\n          translationContext + 'ACTIVE_ITEM' | uiTranslate: { active: activePosition(), total: optionCount() } | async\n        }}\n      </div>\n      <div style=\"position: absolute; left: -9999px\" [attr.aria-live]=\"'polite'\">\n        {{ active.label }}\n        {{\n          (value.includes(active.value) ? translationContext + 'SELECTED' : translationContext + 'DESELECTED')\n            | uiTranslate\n            | async\n        }}\n      </div>\n    }\n    <div class=\"ui-filter-button\" #overlayContainer>\n      @if (options().length > MIN_OPTIONS_LENGTH_FOR_SEARCH) {\n        <div class=\"ui-filter-button-header\">\n          <ui-field\n            type=\"search\"\n            [showBottomContent]=\"false\"\n            [ngModel]=\"search()\"\n            (ngModelChange)=\"onSearchChange($event)\"\n            [applicationTheme]=\"applicationTheme\"\n          ></ui-field>\n        </div>\n      }\n      <div\n        class=\"ui-filter-button-list\"\n        #list\n        tabindex=\"0\"\n        role=\"listbox\"\n        [attr.aria-activedescendant]=\"isOpen() && activeOption() ? 'ui-fb-option-' + activeIndex() : null\"\n        (keydown)=\"keyDownHandler($event)\"\n      >\n        @if (!displayedOptions().length && options().length) {\n          <div class=\"no-results-found\">\n            <span>{{ translationContext + 'NO_RESULTS_FOUND' | uiTranslate | async }}</span>\n          </div>\n        } @else {\n          <cdk-virtual-scroll-viewport\n            class=\"ui-filter-button-viewport\"\n            [itemSize]=\"ITEM_SIZE\"\n            [style.height.px]=\"listHeight()\"\n          >\n            <ng-container *cdkVirtualFor=\"let row of flatOptions(); let i = index; trackBy: trackByRow\">\n              @if (row.kind === 'header') {\n                <div class=\"section-title\">\n                  {{ row.title }}\n                </div>\n              } @else {\n                <div\n                  class=\"item\"\n                  role=\"option\"\n                  tabindex=\"-1\"\n                  [id]=\"'ui-fb-option-' + i\"\n                  [class.item-selected]=\"isSelected(row.option.value)\"\n                  [class.item-active]=\"activeIndex() === i\"\n                  [attr.aria-selected]=\"isSelected(row.option.value)\"\n                  (click)=\"activeIndex.set(i); optionChanged(!isSelected(row.option.value), row.option)\"\n                  (keydown.enter)=\"optionChanged(!isSelected(row.option.value), row.option)\"\n                >\n                  @if (singleSelection) {\n                    <ui-radio-button\n                      (click)=\"$event.stopPropagation()\"\n                      [tabIndex]=\"-1\"\n                      [selected]=\"isSelected(row.option.value)\"\n                      (changeRadio)=\"optionChanged($event.optionChecked, row.option)\"\n                      [applicationTheme]=\"applicationTheme\"\n                    >\n                    </ui-radio-button>\n                  }\n                  @if (!singleSelection) {\n                    <ui-checkbox\n                      (click)=\"$event.stopPropagation()\"\n                      [class.with-label-number]=\"row.option.labelNumber !== undefined\"\n                      [tabIndex]=\"-1\"\n                      [checked]=\"isSelected(row.option.value)\"\n                      (changed)=\"optionChanged($event, row.option)\"\n                      [applicationTheme]=\"applicationTheme\"\n                    ></ui-checkbox>\n                  }\n                  @if (row.option.icon) {\n                    <ui-icon [applicationTheme]=\"applicationTheme\" [name]=\"row.option.icon\"></ui-icon>\n                  }\n                  <span\n                    #tooltip=\"matTooltip\"\n                    class=\"item-label\"\n                    uiEllipseText\n                    [refresh]=\"row.option.value\"\n                    (onChangeTextState)=\"onLabelEllipsisChange($event, row.option.value)\"\n                    [matTooltip]=\"showTooltip[row.option.value] ? row.option.label : ''\"\n                    [matTooltipClass]=\"applicationTheme\"\n                  >\n                    {{ row.option.label }}\n                  </span>\n                  @if (row.option.labelNumber !== undefined) {\n                    <span class=\"item-number\">({{ row.option.labelNumber }})</span>\n                  }\n                </div>\n              }\n            </ng-container>\n          </cdk-virtual-scroll-viewport>\n        }\n      </div>\n      @if (!options().length && !!noOptionsMessage) {\n        <div class=\"ui-filter-button-no-options\" [innerHTML]=\"noOptionsMessage\"></div>\n      } @else {\n        @if (allowClear || message) {\n          <div class=\"ui-filter-button-footer\">\n            @if (allowClear) {\n              <ui-button\n                variant=\"text\"\n                size=\"small\"\n                [label]=\"('COMMON.RESET' | uiTranslate | async)!\"\n                (click)=\"clearValue()\"\n                [applicationTheme]=\"applicationTheme\"\n                (keydown.escape)=\"toggle()\"\n              ></ui-button>\n            }\n            <div class=\"ui-filter-button-footer-message\">\n              {{ message }}\n            </div>\n          </div>\n        }\n      }\n    </div>\n  </ng-template>\n</ng-container>\n", styles: [".bg-teal-60b{background:#1c443c}.bg-teal-30b{background:#31766a}.bg-teal-default{background:#46a997}.bg-teal-30w{background:#7ec3b6}.bg-teal-60w{background:#b5ddd5}.bg-teal-secondary{background:#cbd6cb}.bg-teal-90w{background:#ecf6f5}.bg-petrol-60b{background:#102930}.bg-petrol-30b{background:#1b4754}.bg-petrol-default{background:#276678}.bg-petrol-30w{background:#6894a0}.bg-petrol-60w{background:#a9c2c9}.bg-petrol-secondary{background:#c8d7de}.bg-petrol-90w{background:#e9f0f1}.bg-error-60b{background:#513131}.bg-error-30b{background:#8e5655}.bg-error-60w{background:#e3c3c6}.bg-error-secondary{background:#f0dad9}.bg-error-default{background:#cb7b7a}.bg-warning-secondary{background:#f0d6bb}.bg-warning-default{background:#cca45f}.bg-black{background:#000}.bg-dark{background:#888}.bg-medium{background:#e0e0e0}.bg-grey{background:#ededed}.bg-light{background:#f6f6f6}.bg-white{background:#fff}.bg-box-shadow{background:#00000014}.bg-navigation-subtitle{background:#528593}.bgc-teal-60b{background-color:#1c443c}.bgc-teal-30b{background-color:#31766a}.bgc-teal-default{background-color:#46a997}.bgc-teal-30w{background-color:#7ec3b6}.bgc-teal-60w{background-color:#b5ddd5}.bgc-teal-secondary{background-color:#cbd6cb}.bgc-teal-90w{background-color:#ecf6f5}.bgc-petrol-60b{background-color:#102930}.bgc-petrol-30b{background-color:#1b4754}.bgc-petrol-default{background-color:#276678}.bgc-petrol-30w{background-color:#6894a0}.bgc-petrol-60w{background-color:#a9c2c9}.bgc-petrol-secondary{background-color:#c8d7de}.bgc-petrol-90w{background-color:#e9f0f1}.bgc-error-60b{background-color:#513131}.bgc-error-30b{background-color:#8e5655}.bgc-error-60w{background-color:#e3c3c6}.bgc-error-secondary{background-color:#f0dad9}.bgc-error-default{background-color:#cb7b7a}.bgc-warning-secondary{background-color:#f0d6bb}.bgc-warning-default{background-color:#cca45f}.bgc-black{background-color:#000}.bgc-dark{background-color:#888}.bgc-medium{background-color:#e0e0e0}.bgc-grey{background-color:#ededed}.bgc-light{background-color:#f6f6f6}.bgc-white{background-color:#fff}.bgc-box-shadow{background-color:#00000014}.bgc-navigation-subtitle{background-color:#528593}ui-filter-button{display:inline-block}ui-filter-button.ui-filter-button-full-width{display:block;width:100%}ui-filter-button ui-button .button-wrapper button{padding:7px 24px!important}ui-filter-button ui-button .button-wrapper button .icon ui-icon mat-icon.size-16 svg{width:24px;height:24px}ui-filter-button ui-button .button-wrapper button .label{line-clamp:1;-webkit-line-clamp:1!important}ui-filter-button ui-button.button-opened .button-wrapper button{background-color:#666!important;border-color:#666}ui-filter-button ui-button button.secondary{border:1px solid #242424}ui-filter-button ui-button button.secondary:hover{border-color:#666}.cdk-overlay-container .cdk-overlay-pane .ui-filter-button{margin-top:4px;box-shadow:0 4px 16px #24242414;border-radius:10px;background-color:#fff;padding:0 0 8px;width:240px}.cdk-overlay-container .cdk-overlay-pane .ui-filter-button-header{padding:8px 16px 0}.cdk-overlay-container .cdk-overlay-pane .ui-filter-button-list .section-title{display:flex;align-items:center;height:48px;padding:0 16px}.cdk-overlay-container .cdk-overlay-pane .ui-filter-button-list .no-results-found{padding:8px 16px}.cdk-overlay-container .cdk-overlay-pane .ui-filter-button-list .item{padding:0 16px 0 5px;display:flex;align-items:center;gap:5px;height:48px;cursor:pointer}.cdk-overlay-container .cdk-overlay-pane .ui-filter-button-list .item:hover,.cdk-overlay-container .cdk-overlay-pane .ui-filter-button-list .item.item-active,.cdk-overlay-container .cdk-overlay-pane .ui-filter-button-list .item.item-selected{background-color:#f4f4f4}.cdk-overlay-container .cdk-overlay-pane .ui-filter-button-list .item ui-radio-button{margin-right:4px}.cdk-overlay-container .cdk-overlay-pane .ui-filter-button-list .item ui-checkbox{max-width:100%}.cdk-overlay-container .cdk-overlay-pane .ui-filter-button-list .item ui-checkbox.with-label-number{max-width:calc(100% - 25px)}.cdk-overlay-container .cdk-overlay-pane .ui-filter-button-list .item-number{color:#666}.cdk-overlay-container .cdk-overlay-pane .ui-filter-button-list .item-label{-webkit-user-select:none;user-select:none;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.cdk-overlay-container .cdk-overlay-pane .ui-filter-button-viewport{width:100%;max-height:290px;overflow-x:hidden}.cdk-overlay-container .cdk-overlay-pane .ui-filter-button-viewport .cdk-virtual-scroll-content-wrapper{max-width:100%}.cdk-overlay-container .cdk-overlay-pane .ui-filter-button-footer{display:flex;justify-content:space-between;align-items:center;padding:0 16px 0 5px}.cdk-overlay-container .cdk-overlay-pane .ui-filter-button-footer ui-button{margin-left:-5px}.cdk-overlay-container .cdk-overlay-pane .ui-filter-button-footer-message{color:#666}.cdk-overlay-container .cdk-overlay-pane .ui-filter-button-no-options{padding:24px}.cdk-overlay-container .cdk-overlay-pane.ui-filter-button-panel-match-trigger .ui-filter-button{width:100%}.tooltip-multi-line .mdc-tooltip__surface{text-align:left;white-space:pre-line}\n"], dependencies: [{ kind: "component", type: ButtonComponent, selector: "ui-button", inputs: ["size", "variant", "label", "iconPosition", "justIcon", "iconName", "disabled", "loading", "loadingWithLabel", "fullWidth", "url", "urlTarget", "value", "tooltip", "isPremium", "type", "companyColor", "buttonBadgeConfig", "applicationTheme", "disabledScaleOnClick", "ariaLabel", "ariaExpanded", "ariaControls", "ariaPressed", "ariaRequired", "ariaLabelledby", "ariaDescribedby", "preventDefault", "hasBackground", "tooltipPosition", "role", "iconFilled"], outputs: ["buttonClickEvent", "buttonHoverEvent"] }, { kind: "directive", type: CdkOverlayOrigin, selector: "[cdk-overlay-origin], [overlay-origin], [cdkOverlayOrigin]", exportAs: ["cdkOverlayOrigin"] }, { kind: "directive", type: MatTooltip, selector: "[matTooltip]", inputs: ["matTooltipPosition", "matTooltipPositionAtOrigin", "matTooltipDisabled", "matTooltipShowDelay", "matTooltipHideDelay", "matTooltipTouchGestures", "matTooltip", "matTooltipClass"], exportAs: ["matTooltip"] }, { kind: "directive", type: CdkConnectedOverlay, selector: "[cdk-connected-overlay], [connected-overlay], [cdkConnectedOverlay]", inputs: ["cdkConnectedOverlayOrigin", "cdkConnectedOverlayPositions", "cdkConnectedOverlayPositionStrategy", "cdkConnectedOverlayOffsetX", "cdkConnectedOverlayOffsetY", "cdkConnectedOverlayWidth", "cdkConnectedOverlayHeight", "cdkConnectedOverlayMinWidth", "cdkConnectedOverlayMinHeight", "cdkConnectedOverlayBackdropClass", "cdkConnectedOverlayPanelClass", "cdkConnectedOverlayViewportMargin", "cdkConnectedOverlayScrollStrategy", "cdkConnectedOverlayOpen", "cdkConnectedOverlayDisableClose", "cdkConnectedOverlayTransformOriginOn", "cdkConnectedOverlayHasBackdrop", "cdkConnectedOverlayLockPosition", "cdkConnectedOverlayFlexibleDimensions", "cdkConnectedOverlayGrowAfterOpen", "cdkConnectedOverlayPush", "cdkConnectedOverlayDisposeOnNavigation", "cdkConnectedOverlayUsePopover", "cdkConnectedOverlayMatchWidth", "cdkConnectedOverlay"], outputs: ["backdropClick", "positionChange", "attach", "detach", "overlayKeydown", "overlayOutsideClick"], exportAs: ["cdkConnectedOverlay"] }, { kind: "component", type: CdkVirtualScrollViewport, selector: "cdk-virtual-scroll-viewport", inputs: ["orientation", "appendOnly"], outputs: ["scrolledIndexChange"] }, { kind: "directive", type: CdkFixedSizeVirtualScroll, selector: "cdk-virtual-scroll-viewport[itemSize]", inputs: ["itemSize", "minBufferPx", "maxBufferPx"] }, { kind: "directive", type: CdkVirtualForOf, selector: "[cdkVirtualFor][cdkVirtualForOf]", inputs: ["cdkVirtualForOf", "cdkVirtualForTrackBy", "cdkVirtualForTemplate", "cdkVirtualForTemplateCacheSize"] }, { kind: "component", type: FieldComponent, selector: "ui-field", inputs: ["fullWidth", "fullHeight", "label", "labelHtml", "labelIcon", "fieldName", "placeholder", "id", "value", "badgeVariant", "errors", "disabled", "required", "readOnly", "hintMessage", "type", "updateOnBlur", "allowOnlyDigits", "isAutocompleteOff", "allowNegative", "showBottomContent", "applicationTheme", "ariaLabel", "loading", "isValid", "maxCharacters", "trimOnBlur", "trimOnSubmit", "maxRows", "hasTextAreaCounter", "hideBuiltInErrors", "hideLabelInErrors", "max", "min", "textareaHeight", "borderless", "autosizableTextarea", "isAIVariant", "ariaLabelledby", "ariaDescribedby", "hasError"], outputs: ["validateEvent", "fieldBlur"] }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "component", type: RadioButtonComponent, selector: "ui-radio-button", inputs: ["disabled", "selected", "allowUnselect", "companyColor", "name", "label", "multiple", "mediaCard", "value", "applicationTheme", "ariaLabel", "ariaRequired", "hasError", "ariaLabelledby", "ariaDescribedby", "truncateText", "alignment", "tabIndex", "hideTooltipOnEllipsis"], outputs: ["changeRadio"] }, { kind: "component", type: CheckboxComponent, selector: "ui-checkbox", inputs: ["disabled", "checked", "indeterminate", "companyColor", "name", "label", "multiple", "applicationTheme", "ariaLabel", "ariaRequired", "hasError", "hideBuiltInErrors", "hideLabelInErrors", "ariaLabelledby", "ariaDescribedby", "truncateText", "alignment", "tabIndex"], outputs: ["changed"] }, { kind: "component", type: IconComponent, selector: "ui-icon", inputs: ["size", "cssClass", "name", "color", "filled", "toggleIconStyle", "applicationTheme", "useFullIconName"] }, { kind: "directive", type: EllipseTextDirective, selector: "[uiEllipseText]", inputs: ["isMultiline", "maxDiffPixels", "refresh"], outputs: ["onChangeTextState"] }, { kind: "pipe", type: AsyncPipe, name: "async" }, { kind: "pipe", type: UiTranslatePipe, name: "uiTranslate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.19", ngImport: i0, type: FilterButtonComponent, deps: [{ token: 'CANOPYUI_DEFAULT_APPLICATION_THEME', optional: true }, { token: i0.ChangeDetectorRef }, { token: i0.DestroyRef }], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.19", type: FilterButtonComponent, isStandalone: true, selector: "ui-filter-button", inputs: { label: { classPropertyName: "label", publicName: "label", isSignal: false, isRequired: false, transformFunction: null }, message: { classPropertyName: "message", publicName: "message", isSignal: false, isRequired: false, transformFunction: null }, value: { classPropertyName: "value", publicName: "value", isSignal: false, isRequired: false, transformFunction: null }, disabled: { classPropertyName: "disabled", publicName: "disabled", isSignal: false, isRequired: false, transformFunction: null }, options: { classPropertyName: "options", publicName: "options", isSignal: true, isRequired: false, transformFunction: null }, allowClear: { classPropertyName: "allowClear", publicName: "allowClear", isSignal: false, isRequired: false, transformFunction: null }, singleSelection: { classPropertyName: "singleSelection", publicName: "singleSelection", isSignal: false, isRequired: false, transformFunction: null }, iconName: { classPropertyName: "iconName", publicName: "iconName", isSignal: false, isRequired: false, transformFunction: null }, iconPosition: { classPropertyName: "iconPosition", publicName: "iconPosition", isSignal: false, isRequired: false, transformFunction: null }, noOptionsMessage: { classPropertyName: "noOptionsMessage", publicName: "noOptionsMessage", isSignal: false, isRequired: false, transformFunction: null }, fullWidth: { classPropertyName: "fullWidth", publicName: "fullWidth", isSignal: false, isRequired: false, transformFunction: booleanAttribute }, applicationTheme: { classPropertyName: "applicationTheme", publicName: "applicationTheme", isSignal: false, isRequired: false, transformFunction: null } }, outputs: { changed: "changed", optionChange: "optionChange" }, host: { properties: { "class": "this.class", "attr.theme": "this.applicationTheme", "class.ui-filter-button-full-width": "this.fullWidthClass" } }, viewQueries: [{ propertyName: "overlayContainer", first: true, predicate: ["overlayContainer"], descendants: true }, { propertyName: "viewport", first: true, predicate: CdkVirtualScrollViewport, descendants: true }, { propertyName: "triggerOrigin", first: true, predicate: CdkOverlayOrigin, descendants: true }, { propertyName: "connectedOverlay", first: true, predicate: CdkConnectedOverlay, descendants: true }], usesOnChanges: true, ngImport: i0, template: "<ng-container>\n  <ui-button\n    [matTooltip]=\"tooltip()\"\n    [matTooltipClass]=\"'tooltip-multi-line ' + applicationTheme\"\n    [matTooltipPosition]=\"'above'\"\n    class=\"ui-filter-button-trigger\"\n    [class.button-opened]=\"isOpen()\"\n    [variant]=\"value.length || isOpen() ? 'secondary' : 'ghost'\"\n    [label]=\"displayedLabel() || label\"\n    [disabled]=\"disabled || (options().length === 0 && !noOptionsMessage)\"\n    (click)=\"toggle()\"\n    type=\"button\"\n    size=\"small\"\n    [role]=\"'combobox'\"\n    [tooltip]=\"value.length ? ' ' : ''\"\n    [attr.aria-expanded]=\"isOpen()\"\n    [iconName]=\"iconName || (isOpen() ? 'Arrow-chevron-up-filled' : 'Arrow-chevron-down-filled')\"\n    [iconPosition]=\"iconPosition\"\n    [applicationTheme]=\"applicationTheme\"\n    [fullWidth]=\"fullWidth\"\n    cdkOverlayOrigin\n    #trigger=\"cdkOverlayOrigin\"\n  ></ui-button>\n  <ng-template\n    cdkConnectedOverlay\n    [cdkConnectedOverlayOrigin]=\"trigger\"\n    [cdkConnectedOverlayOpen]=\"isOpen()\"\n    [cdkConnectedOverlayMatchWidth]=\"fullWidth\"\n    [cdkConnectedOverlayMinWidth]=\"fullWidth ? PANEL_MIN_WIDTH : ''\"\n    [cdkConnectedOverlayPanelClass]=\"fullWidth ? MATCH_TRIGGER_PANEL_CLASS : ''\"\n    (overlayOutsideClick)=\"outsideClick()\"\n  >\n    @if (activeOption(); as active) {\n      <div style=\"position: absolute; left: -9999px\" [attr.aria-live]=\"'polite'\">\n        {{ active.label }}\n        {{\n          translationContext + 'ACTIVE_ITEM' | uiTranslate: { active: activePosition(), total: optionCount() } | async\n        }}\n      </div>\n      <div style=\"position: absolute; left: -9999px\" [attr.aria-live]=\"'polite'\">\n        {{ active.label }}\n        {{\n          (value.includes(active.value) ? translationContext + 'SELECTED' : translationContext + 'DESELECTED')\n            | uiTranslate\n            | async\n        }}\n      </div>\n    }\n    <div class=\"ui-filter-button\" #overlayContainer>\n      @if (options().length > MIN_OPTIONS_LENGTH_FOR_SEARCH) {\n        <div class=\"ui-filter-button-header\">\n          <ui-field\n            type=\"search\"\n            [showBottomContent]=\"false\"\n            [ngModel]=\"search()\"\n            (ngModelChange)=\"onSearchChange($event)\"\n            [applicationTheme]=\"applicationTheme\"\n          ></ui-field>\n        </div>\n      }\n      <div\n        class=\"ui-filter-button-list\"\n        #list\n        tabindex=\"0\"\n        role=\"listbox\"\n        [attr.aria-activedescendant]=\"isOpen() && activeOption() ? 'ui-fb-option-' + activeIndex() : null\"\n        (keydown)=\"keyDownHandler($event)\"\n      >\n        @if (!displayedOptions().length && options().length) {\n          <div class=\"no-results-found\">\n            <span>{{ translationContext + 'NO_RESULTS_FOUND' | uiTranslate | async }}</span>\n          </div>\n        } @else {\n          <cdk-virtual-scroll-viewport\n            class=\"ui-filter-button-viewport\"\n            [itemSize]=\"ITEM_SIZE\"\n            [style.height.px]=\"listHeight()\"\n          >\n            <ng-container *cdkVirtualFor=\"let row of flatOptions(); let i = index; trackBy: trackByRow\">\n              @if (row.kind === 'header') {\n                <div class=\"section-title\">\n                  {{ row.title }}\n                </div>\n              } @else {\n                <div\n                  class=\"item\"\n                  role=\"option\"\n                  tabindex=\"-1\"\n                  [id]=\"'ui-fb-option-' + i\"\n                  [class.item-selected]=\"isSelected(row.option.value)\"\n                  [class.item-active]=\"activeIndex() === i\"\n                  [attr.aria-selected]=\"isSelected(row.option.value)\"\n                  (click)=\"activeIndex.set(i); optionChanged(!isSelected(row.option.value), row.option)\"\n                  (keydown.enter)=\"optionChanged(!isSelected(row.option.value), row.option)\"\n                >\n                  @if (singleSelection) {\n                    <ui-radio-button\n                      (click)=\"$event.stopPropagation()\"\n                      [tabIndex]=\"-1\"\n                      [selected]=\"isSelected(row.option.value)\"\n                      (changeRadio)=\"optionChanged($event.optionChecked, row.option)\"\n                      [applicationTheme]=\"applicationTheme\"\n                    >\n                    </ui-radio-button>\n                  }\n                  @if (!singleSelection) {\n                    <ui-checkbox\n                      (click)=\"$event.stopPropagation()\"\n                      [class.with-label-number]=\"row.option.labelNumber !== undefined\"\n                      [tabIndex]=\"-1\"\n                      [checked]=\"isSelected(row.option.value)\"\n                      (changed)=\"optionChanged($event, row.option)\"\n                      [applicationTheme]=\"applicationTheme\"\n                    ></ui-checkbox>\n                  }\n                  @if (row.option.icon) {\n                    <ui-icon [applicationTheme]=\"applicationTheme\" [name]=\"row.option.icon\"></ui-icon>\n                  }\n                  <span\n                    #tooltip=\"matTooltip\"\n                    class=\"item-label\"\n                    uiEllipseText\n                    [refresh]=\"row.option.value\"\n                    (onChangeTextState)=\"onLabelEllipsisChange($event, row.option.value)\"\n                    [matTooltip]=\"showTooltip[row.option.value] ? row.option.label : ''\"\n                    [matTooltipClass]=\"applicationTheme\"\n                  >\n                    {{ row.option.label }}\n                  </span>\n                  @if (row.option.labelNumber !== undefined) {\n                    <span class=\"item-number\">({{ row.option.labelNumber }})</span>\n                  }\n                </div>\n              }\n            </ng-container>\n          </cdk-virtual-scroll-viewport>\n        }\n      </div>\n      @if (!options().length && !!noOptionsMessage) {\n        <div class=\"ui-filter-button-no-options\" [innerHTML]=\"noOptionsMessage\"></div>\n      } @else {\n        @if (allowClear || message) {\n          <div class=\"ui-filter-button-footer\">\n            @if (allowClear) {\n              <ui-button\n                variant=\"text\"\n                size=\"small\"\n                [label]=\"('COMMON.RESET' | uiTranslate | async)!\"\n                (click)=\"clearValue()\"\n                [applicationTheme]=\"applicationTheme\"\n                (keydown.escape)=\"toggle()\"\n              ></ui-button>\n            }\n            <div class=\"ui-filter-button-footer-message\">\n              {{ message }}\n            </div>\n          </div>\n        }\n      }\n    </div>\n  </ng-template>\n</ng-container>\n", styles: [".bg-teal-60b{background:#1c443c}.bg-teal-30b{background:#31766a}.bg-teal-default{background:#46a997}.bg-teal-30w{background:#7ec3b6}.bg-teal-60w{background:#b5ddd5}.bg-teal-secondary{background:#cbd6cb}.bg-teal-90w{background:#ecf6f5}.bg-petrol-60b{background:#102930}.bg-petrol-30b{background:#1b4754}.bg-petrol-default{background:#276678}.bg-petrol-30w{background:#6894a0}.bg-petrol-60w{background:#a9c2c9}.bg-petrol-secondary{background:#c8d7de}.bg-petrol-90w{background:#e9f0f1}.bg-error-60b{background:#513131}.bg-error-30b{background:#8e5655}.bg-error-60w{background:#e3c3c6}.bg-error-secondary{background:#f0dad9}.bg-error-default{background:#cb7b7a}.bg-warning-secondary{background:#f0d6bb}.bg-warning-default{background:#cca45f}.bg-black{background:#000}.bg-dark{background:#888}.bg-medium{background:#e0e0e0}.bg-grey{background:#ededed}.bg-light{background:#f6f6f6}.bg-white{background:#fff}.bg-box-shadow{background:#00000014}.bg-navigation-subtitle{background:#528593}.bgc-teal-60b{background-color:#1c443c}.bgc-teal-30b{background-color:#31766a}.bgc-teal-default{background-color:#46a997}.bgc-teal-30w{background-color:#7ec3b6}.bgc-teal-60w{background-color:#b5ddd5}.bgc-teal-secondary{background-color:#cbd6cb}.bgc-teal-90w{background-color:#ecf6f5}.bgc-petrol-60b{background-color:#102930}.bgc-petrol-30b{background-color:#1b4754}.bgc-petrol-default{background-color:#276678}.bgc-petrol-30w{background-color:#6894a0}.bgc-petrol-60w{background-color:#a9c2c9}.bgc-petrol-secondary{background-color:#c8d7de}.bgc-petrol-90w{background-color:#e9f0f1}.bgc-error-60b{background-color:#513131}.bgc-error-30b{background-color:#8e5655}.bgc-error-60w{background-color:#e3c3c6}.bgc-error-secondary{background-color:#f0dad9}.bgc-error-default{background-color:#cb7b7a}.bgc-warning-secondary{background-color:#f0d6bb}.bgc-warning-default{background-color:#cca45f}.bgc-black{background-color:#000}.bgc-dark{background-color:#888}.bgc-medium{background-color:#e0e0e0}.bgc-grey{background-color:#ededed}.bgc-light{background-color:#f6f6f6}.bgc-white{background-color:#fff}.bgc-box-shadow{background-color:#00000014}.bgc-navigation-subtitle{background-color:#528593}ui-filter-button{display:inline-block}ui-filter-button.ui-filter-button-full-width{display:block;width:100%}ui-filter-button ui-button .button-wrapper button{padding:7px 24px!important}ui-filter-button ui-button .button-wrapper button .icon ui-icon mat-icon.size-16 svg{width:24px;height:24px}ui-filter-button ui-button .button-wrapper button .label{line-clamp:1;-webkit-line-clamp:1!important}ui-filter-button ui-button.button-opened .button-wrapper button{background-color:#666!important;border-color:#666}ui-filter-button ui-button button.secondary{border:1px solid #242424}ui-filter-button ui-button button.secondary:hover{border-color:#666}.cdk-overlay-container .cdk-overlay-pane .ui-filter-button{margin-top:4px;box-shadow:0 4px 16px #24242414;border-radius:10px;background-color:#fff;padding:0 0 8px;width:240px}.cdk-overlay-container .cdk-overlay-pane .ui-filter-button-header{padding:8px 16px 0}.cdk-overlay-container .cdk-overlay-pane .ui-filter-button-list .section-title{display:flex;align-items:center;height:48px;padding:0 16px}.cdk-overlay-container .cdk-overlay-pane .ui-filter-button-list .no-results-found{padding:8px 16px}.cdk-overlay-container .cdk-overlay-pane .ui-filter-button-list .item{padding:0 16px 0 5px;display:flex;align-items:center;gap:5px;height:48px;cursor:pointer}.cdk-overlay-container .cdk-overlay-pane .ui-filter-button-list .item:hover,.cdk-overlay-container .cdk-overlay-pane .ui-filter-button-list .item.item-active,.cdk-overlay-container .cdk-overlay-pane .ui-filter-button-list .item.item-selected{background-color:#f4f4f4}.cdk-overlay-container .cdk-overlay-pane .ui-filter-button-list .item ui-radio-button{margin-right:4px}.cdk-overlay-container .cdk-overlay-pane .ui-filter-button-list .item ui-checkbox{max-width:100%}.cdk-overlay-container .cdk-overlay-pane .ui-filter-button-list .item ui-checkbox.with-label-number{max-width:calc(100% - 25px)}.cdk-overlay-container .cdk-overlay-pane .ui-filter-button-list .item-number{color:#666}.cdk-overlay-container .cdk-overlay-pane .ui-filter-button-list .item-label{-webkit-user-select:none;user-select:none;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.cdk-overlay-container .cdk-overlay-pane .ui-filter-button-viewport{width:100%;max-height:290px;overflow-x:hidden}.cdk-overlay-container .cdk-overlay-pane .ui-filter-button-viewport .cdk-virtual-scroll-content-wrapper{max-width:100%}.cdk-overlay-container .cdk-overlay-pane .ui-filter-button-footer{display:flex;justify-content:space-between;align-items:center;padding:0 16px 0 5px}.cdk-overlay-container .cdk-overlay-pane .ui-filter-button-footer ui-button{margin-left:-5px}.cdk-overlay-container .cdk-overlay-pane .ui-filter-button-footer-message{color:#666}.cdk-overlay-container .cdk-overlay-pane .ui-filter-button-no-options{padding:24px}.cdk-overlay-container .cdk-overlay-pane.ui-filter-button-panel-match-trigger .ui-filter-button{width:100%}.tooltip-multi-line .mdc-tooltip__surface{text-align:left;white-space:pre-line}\n"], dependencies: [{ kind: "component", type: ButtonComponent, selector: "ui-button", inputs: ["size", "variant", "label", "iconPosition", "justIcon", "iconName", "disabled", "loading", "loadingWithLabel", "fullWidth", "url", "urlTarget", "value", "tooltip", "isPremium", "type", "companyColor", "buttonBadgeConfig", "applicationTheme", "disabledScaleOnClick", "ariaLabel", "ariaExpanded", "ariaControls", "ariaPressed", "ariaRequired", "ariaLabelledby", "ariaDescribedby", "preventDefault", "hasBackground", "tooltipPosition", "role", "iconFilled"], outputs: ["buttonClickEvent", "buttonHoverEvent"] }, { kind: "directive", type: CdkOverlayOrigin, selector: "[cdk-overlay-origin], [overlay-origin], [cdkOverlayOrigin]", exportAs: ["cdkOverlayOrigin"] }, { kind: "directive", type: MatTooltip, selector: "[matTooltip]", inputs: ["matTooltipPosition", "matTooltipPositionAtOrigin", "matTooltipDisabled", "matTooltipShowDelay", "matTooltipHideDelay", "matTooltipTouchGestures", "matTooltip", "matTooltipClass"], exportAs: ["matTooltip"] }, { kind: "directive", type: CdkConnectedOverlay, selector: "[cdk-connected-overlay], [connected-overlay], [cdkConnectedOverlay]", inputs: ["cdkConnectedOverlayOrigin", "cdkConnectedOverlayPositions", "cdkConnectedOverlayPositionStrategy", "cdkConnectedOverlayOffsetX", "cdkConnectedOverlayOffsetY", "cdkConnectedOverlayWidth", "cdkConnectedOverlayHeight", "cdkConnectedOverlayMinWidth", "cdkConnectedOverlayMinHeight", "cdkConnectedOverlayBackdropClass", "cdkConnectedOverlayPanelClass", "cdkConnectedOverlayViewportMargin", "cdkConnectedOverlayScrollStrategy", "cdkConnectedOverlayOpen", "cdkConnectedOverlayDisableClose", "cdkConnectedOverlayTransformOriginOn", "cdkConnectedOverlayHasBackdrop", "cdkConnectedOverlayLockPosition", "cdkConnectedOverlayFlexibleDimensions", "cdkConnectedOverlayGrowAfterOpen", "cdkConnectedOverlayPush", "cdkConnectedOverlayDisposeOnNavigation", "cdkConnectedOverlayUsePopover", "cdkConnectedOverlayMatchWidth", "cdkConnectedOverlay"], outputs: ["backdropClick", "positionChange", "attach", "detach", "overlayKeydown", "overlayOutsideClick"], exportAs: ["cdkConnectedOverlay"] }, { kind: "component", type: CdkVirtualScrollViewport, selector: "cdk-virtual-scroll-viewport", inputs: ["orientation", "appendOnly"], outputs: ["scrolledIndexChange"] }, { kind: "directive", type: CdkFixedSizeVirtualScroll, selector: "cdk-virtual-scroll-viewport[itemSize]", inputs: ["itemSize", "minBufferPx", "maxBufferPx"] }, { kind: "directive", type: CdkVirtualForOf, selector: "[cdkVirtualFor][cdkVirtualForOf]", inputs: ["cdkVirtualForOf", "cdkVirtualForTrackBy", "cdkVirtualForTemplate", "cdkVirtualForTemplateCacheSize"] }, { kind: "component", type: FieldComponent, selector: "ui-field", inputs: ["fullWidth", "fullHeight", "label", "labelHtml", "labelIcon", "fieldName", "placeholder", "id", "value", "badgeVariant", "errors", "disabled", "required", "readOnly", "hintMessage", "type", "updateOnBlur", "allowOnlyDigits", "isAutocompleteOff", "allowNegative", "showBottomContent", "applicationTheme", "ariaLabel", "loading", "isValid", "maxCharacters", "trimOnBlur", "trimOnSubmit", "maxRows", "hasTextAreaCounter", "hideBuiltInErrors", "hideLabelInErrors", "max", "min", "textareaHeight", "borderless", "autosizableTextarea", "isAIVariant", "ariaLabelledby", "ariaDescribedby", "hasError"], outputs: ["validateEvent", "fieldBlur"] }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "component", type: RadioButtonComponent, selector: "ui-radio-button", inputs: ["disabled", "selected", "allowUnselect", "companyColor", "name", "label", "multiple", "mediaCard", "value", "applicationTheme", "ariaLabel", "ariaRequired", "hasError", "ariaLabelledby", "ariaDescribedby", "truncateText", "alignment", "tabIndex", "hideTooltipOnEllipsis"], outputs: ["changeRadio"] }, { kind: "component", type: CheckboxComponent, selector: "ui-checkbox", inputs: ["disabled", "checked", "indeterminate", "companyColor", "name", "label", "multiple", "applicationTheme", "ariaLabel", "ariaRequired", "hasError", "hideBuiltInErrors", "hideLabelInErrors", "ariaLabelledby", "ariaDescribedby", "truncateText", "alignment", "tabIndex"], outputs: ["changed"] }, { kind: "component", type: IconComponent, selector: "ui-icon", inputs: ["size", "cssClass", "name", "color", "filled", "toggleIconStyle", "applicationTheme", "useFullIconName"] }, { kind: "directive", type: EllipseTextDirective, selector: "[uiEllipseText]", inputs: ["isMultiline", "maxDiffPixels", "refresh"], outputs: ["onChangeTextState"] }, { kind: "pipe", type: AsyncPipe, name: "async" }, { kind: "pipe", type: UiTranslatePipe, name: "uiTranslate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.18", ngImport: i0, type: FilterButtonComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.19", ngImport: i0, type: FilterButtonComponent, decorators: [{
             type: Component,
             args: [{ selector: 'ui-filter-button', encapsulation: ViewEncapsulation.None, changeDetection: ChangeDetectionStrategy.OnPush, imports: [
                         ButtonComponent,
@@ -388,8 +388,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.18", ngImpo
             }] } });
 
 class FilterButtonComponentModule {
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.18", ngImport: i0, type: FilterButtonComponentModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
-    static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "21.2.18", ngImport: i0, type: FilterButtonComponentModule, imports: [CommonModule,
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.19", ngImport: i0, type: FilterButtonComponentModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
+    static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "21.2.19", ngImport: i0, type: FilterButtonComponentModule, imports: [CommonModule,
             FormsModule,
             MatTooltipModule,
             OverlayModule,
@@ -401,7 +401,7 @@ class FilterButtonComponentModule {
             EllipseTextDirective,
             RadioButtonComponentModule,
             FilterButtonComponent], exports: [FilterButtonComponent] }); }
-    static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "21.2.18", ngImport: i0, type: FilterButtonComponentModule, imports: [CommonModule,
+    static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "21.2.19", ngImport: i0, type: FilterButtonComponentModule, imports: [CommonModule,
             FormsModule,
             MatTooltipModule,
             OverlayModule,
@@ -412,7 +412,7 @@ class FilterButtonComponentModule {
             RadioButtonComponentModule,
             FilterButtonComponent] }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.18", ngImport: i0, type: FilterButtonComponentModule, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.19", ngImport: i0, type: FilterButtonComponentModule, decorators: [{
             type: NgModule,
             args: [{
                     imports: [