@fundamental-ngx/platform 0.46.0-rc.2 → 0.46.0-rc.21

package/fesm2022/fundamental-ngx-platform-form.mjs

@@ -1,75 +1,73 @@
 import * as i0 from '@angular/core';
-import { InjectionToken, Directive, Input, Component, ChangeDetectionStrategy, ViewEncapsulation, ContentChild, Injectable, Inject, forwardRef, EventEmitter, TemplateRef, ElementRef, Optional, Self, SkipSelf, Output, ViewChild, ContentChildren, Host, NgModule, Attribute, ViewChildren, HostListener, Injector, Pipe, isDevMode, LOCALE_ID } from '@angular/core';
+import { InjectionToken, Directive, Input, Component, ChangeDetectionStrategy, ViewEncapsulation, ContentChild, Injectable, Inject, forwardRef, EventEmitter, TemplateRef, ElementRef, Optional, Self, SkipSelf, Output, ViewChild, ContentChildren, ViewChildren, Host, NgModule, Attribute, HostListener, Injector, Pipe, isDevMode, LOCALE_ID } from '@angular/core';
 import * as i1$1 from '@angular/forms';
 import { Validators, FormControl, FormGroup, FormsModule, ReactiveFormsModule, NgForm, NgControl, FormGroupDirective } from '@angular/forms';
 import { coerceBooleanProperty, coerceNumberProperty } from '@angular/cdk/coercion';
 import { FD_FORM_FIELD, FD_FORM_FIELD_CONTROL } from '@fundamental-ngx/cdk/forms';
 import { uniqBy, merge as merge$1, cloneDeep } from 'lodash-es';
-import * as i14 from 'rxjs';
+import * as i11 from 'rxjs';
 import { Subject, BehaviorSubject, tap, combineLatest, filter, Subscription, merge, fromEvent, isObservable, firstValueFrom, of, timer, interval } from 'rxjs';
 import { distinctUntilChanged, map, takeUntil, switchMap, startWith, debounceTime, filter as filter$1, take, skip } from 'rxjs/operators';
 import * as i1 from '@fundamental-ngx/platform/shared';
 import { ColumnLayoutGridClass, ResponsiveBreakPointConfig, RESPONSIVE_BREAKPOINTS_CONFIG, FormFieldGroup, BaseInput, InLineLayoutCollectionBaseInput, coerceArraySafe, CollectionBaseInput, isOptionItem, isJsObject, isString, MatchingStrategy, isFunction, isDataSource, ArrayMultiInputDataSource, ObservableMultiInputDataSource, MultiInputDataSource, DATA_PROVIDERS, FormGroupContainer, ArrayComboBoxDataSource, ObservableComboBoxDataSource, ComboBoxDataSource, FDP_DO_CHECK, ArrayMultiComboBoxDataSource, ObservableMultiComboBoxDataSource, isSelectableOptionItem, MultiComboBoxDataSource } from '@fundamental-ngx/platform/shared';
-import * as i4 from '@fundamental-ngx/core/form';
-import { FormInputMessageGroupComponent, FormModule, FormItemModule, FormGroupModule, FormControlModule, FormInputMessageGroupModule, FormMessageModule } from '@fundamental-ngx/core/form';
-import * as i3 from '@angular/common';
-import { CommonModule, NgIf, NgFor, NgTemplateOutlet, formatNumber } from '@angular/common';
-import * as i2 from '@fundamental-ngx/core/popover';
-import { PopoverModule } from '@fundamental-ngx/core/popover';
+import * as i3 from '@fundamental-ngx/core/form';
+import { FormInputMessageGroupComponent, FormItemModule, FormMessageModule, FormLabelModule, FormControlModule, FormGroupModule, FormInputMessageGroupModule } from '@fundamental-ngx/core/form';
+import { PopoverComponent, PopoverControlComponent, PopoverBodyComponent } from '@fundamental-ngx/core/popover';
+import { NgTemplateOutlet, NgIf, NgFor, AsyncPipe, NgClass, KeyValuePipe, formatNumber } from '@angular/common';
 import { GRID_COLUMNS_NUMBER } from '@fundamental-ngx/core/layout-grid';
 import * as i5 from '@fundamental-ngx/core/inline-help';
 import { InlineHelpModule } from '@fundamental-ngx/core/inline-help';
-import * as i6 from '@fundamental-ngx/core/icon';
+import * as i4 from '@fundamental-ngx/core/icon';
 import { IconModule } from '@fundamental-ngx/core/icon';
-import * as i7 from '@fundamental-ngx/core/link';
-import { LinkModule } from '@fundamental-ngx/core/link';
-import * as i3$2 from '@fundamental-ngx/cdk/utils';
-import { PipeModule, RangeSelector, KeyUtil, warnOnce, TemplateDirective, TemplateModule, DynamicComponentService, InitialFocusModule, isFunction as isFunction$1, selectStrategy, resizeObservable, OnlyDigitsModule } from '@fundamental-ngx/cdk/utils';
-import * as i5$2 from '@fundamental-ngx/core/content-density';
-import { ContentDensityModule, contentDensityObserverProviders, CONTENT_DENSITY_DIRECTIVE, ContentDensityGlobalKeyword } from '@fundamental-ngx/core/content-density';
+import { LinkComponent } from '@fundamental-ngx/core/link';
+import * as i3$1 from '@fundamental-ngx/cdk/utils';
+import { RangeSelector, KeyUtil, warnOnce, TemplateDirective, DynamicComponentService, InitialFocusDirective, DisplayFnPipe, isFunction as isFunction$1, selectStrategy, resizeObservable, SearchHighlightPipe, OnlyDigitsDirective } from '@fundamental-ngx/cdk/utils';
 import { SelectionModel } from '@angular/cdk/collections';
-import * as i7$4 from '@fundamental-ngx/core/checkbox';
-import { CheckboxComponent as CheckboxComponent$1, CheckboxModule } from '@fundamental-ngx/core/checkbox';
-import * as i3$1 from '@fundamental-ngx/core/radio';
-import { RadioButtonComponent as RadioButtonComponent$1, RadioModule } from '@fundamental-ngx/core/radio';
+import { CheckboxComponent as CheckboxComponent$1 } from '@fundamental-ngx/core/checkbox';
 import { FocusKeyManager } from '@angular/cdk/a11y';
 import { DOWN_ARROW, UP_ARROW, LEFT_ARROW, RIGHT_ARROW, DELETE, BACKSPACE, ENTER, ESCAPE, CONTROL, TAB, SHIFT, ALT, NUMPAD_ZERO, NUMPAD_ONE, NUMPAD_TWO, NUMPAD_THREE, NUMPAD_FOUR, NUMPAD_FIVE, NUMPAD_SIX, NUMPAD_SEVEN, NUMPAD_EIGHT, NUMPAD_NINE, A, SPACE, PAGE_UP, PAGE_DOWN } from '@angular/cdk/keycodes';
-import * as i5$1 from '@fundamental-ngx/i18n';
-import { I18nModule, TranslationResolver, FD_LANGUAGE } from '@fundamental-ngx/i18n';
-import * as i5$3 from '@fundamental-ngx/core/button';
-import { ButtonModule } from '@fundamental-ngx/core/button';
-import * as i10 from '@fundamental-ngx/core/input-group';
-import { InputGroupModule } from '@fundamental-ngx/core/input-group';
-import * as i7$1 from '@fundamental-ngx/core/list';
-import { ListComponent, ListModule } from '@fundamental-ngx/core/list';
-import * as i7$2 from '@fundamental-ngx/core/select';
+import * as i2 from '@fundamental-ngx/core/radio';
+import { RadioButtonComponent as RadioButtonComponent$1, RadioModule } from '@fundamental-ngx/core/radio';
+import { FdTranslatePipe, TranslationResolver, FD_LANGUAGE } from '@fundamental-ngx/i18n';
+import * as i4$1 from '@fundamental-ngx/core/select';
 import { SelectComponent as SelectComponent$1, SelectModule } from '@fundamental-ngx/core/select';
+import * as i7$1 from '@fundamental-ngx/core/list';
+import { ListComponent, ListSecondaryDirective, ListModule } from '@fundamental-ngx/core/list';
 import '@fundamental-ngx/core/calendar';
 import * as i2$1 from '@fundamental-ngx/core/datetime';
 import { DATE_TIME_FORMATS } from '@fundamental-ngx/core/datetime';
 import { DatePickerComponent } from '@fundamental-ngx/core/date-picker';
-import * as i3$3 from '@fundamental-ngx/core/switch';
+import * as i3$2 from '@fundamental-ngx/core/switch';
 import { SwitchModule } from '@fundamental-ngx/core/switch';
-import * as i8 from '@fundamental-ngx/core/token';
+import * as i7 from '@fundamental-ngx/core/token';
 import { TokenizerComponent, TokenModule } from '@fundamental-ngx/core/token';
-import * as i7$3 from '@fundamental-ngx/platform/list';
-import { FdpListComponent, ListComponent as ListComponent$1, BaseListItem, PlatformListModule, StandardListItemModule } from '@fundamental-ngx/platform/list';
 import * as i1$2 from '@fundamental-ngx/core/dialog';
 import { DialogModule } from '@fundamental-ngx/core/dialog';
+import * as i9 from '@fundamental-ngx/platform/list';
+import { FdpListComponent, ListComponent as ListComponent$1, BaseListItem, PlatformListModule, StandardListItemModule } from '@fundamental-ngx/platform/list';
 import { MobileModeBase, MobileModeControl, MOBILE_MODE_CONFIG } from '@fundamental-ngx/core/mobile-mode';
+import { CdkScrollable } from '@angular/cdk/overlay';
 import * as i2$2 from '@fundamental-ngx/core/bar';
 import { BarModule } from '@fundamental-ngx/core/bar';
+import { ScrollbarDirective } from '@fundamental-ngx/core/scrollbar';
+import * as i5$1 from '@fundamental-ngx/core/content-density';
+import { contentDensityObserverProviders, ContentDensityModule, CONTENT_DENSITY_DIRECTIVE, ContentDensityGlobalKeyword } from '@fundamental-ngx/core/content-density';
 import equal from 'fast-deep-equal';
+import * as i6 from '@fundamental-ngx/core/input-group';
+import { InputGroupModule } from '@fundamental-ngx/core/input-group';
 import * as i2$3 from '@fundamental-ngx/platform/object-status';
 import { PlatformObjectStatusModule } from '@fundamental-ngx/platform/object-status';
-import * as i3$4 from '@fundamental-ngx/core/title';
+import * as i3$3 from '@fundamental-ngx/core/title';
+import { TitleComponent } from '@fundamental-ngx/core/title';
 import { DatetimePickerComponent } from '@fundamental-ngx/core/datetime-picker';
-import * as i10$1 from '@fundamental-ngx/core/skeleton';
+import * as i10 from '@fundamental-ngx/core/skeleton';
 import { SkeletonModule } from '@fundamental-ngx/core/skeleton';
 import * as i2$4 from '@fundamental-ngx/core/busy-indicator';
 import { BusyIndicatorModule } from '@fundamental-ngx/core/busy-indicator';
 import { ButtonComponent } from '@fundamental-ngx/platform/button';
-import * as i3$5 from '@fundamental-ngx/core/file-uploader';
+import * as i5$2 from '@fundamental-ngx/core/button';
+import { ButtonModule } from '@fundamental-ngx/core/button';
+import * as i3$4 from '@fundamental-ngx/core/file-uploader';
 import { FileUploaderModule } from '@fundamental-ngx/core/file-uploader';
 import * as i2$5 from '@fundamental-ngx/core/time-picker';
 import { TimePickerComponent, TimePickerModule } from '@fundamental-ngx/core/time-picker';
@@ -176,7 +174,7 @@ class FormFieldErrorDirective {
         }, 5);
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.1.0", ngImport: i0, type: FormFieldErrorDirective, deps: [{ token: i0.TemplateRef }, { token: i0.ViewContainerRef }, { token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Directive }); }
-    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "16.1.0", type: FormFieldErrorDirective, selector: "[fdpFormFieldError]", inputs: { fdpFormFieldErrorAs: "fdpFormFieldErrorAs", error: ["fdpFormFieldError", "error"], fdpFormFieldErrorType: "fdpFormFieldErrorType" }, providers: [
+    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "16.1.0", type: FormFieldErrorDirective, isStandalone: true, selector: "[fdpFormFieldError]", inputs: { fdpFormFieldErrorAs: "fdpFormFieldErrorAs", error: ["fdpFormFieldError", "error"], fdpFormFieldErrorType: "fdpFormFieldErrorType" }, providers: [
             {
                 provide: FDP_FORM_ERROR_DIRECTIVE,
                 useExisting: FormFieldErrorDirective
@@ -192,7 +190,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.1.0", ngImpor
                             provide: FDP_FORM_ERROR_DIRECTIVE,
                             useExisting: FormFieldErrorDirective
                         }
-                    ]
+                    ],
+                    standalone: true
                 }]
         }], ctorParameters: function () { return [{ type: i0.TemplateRef }, { type: i0.ViewContainerRef }, { type: i0.ChangeDetectorRef }]; }, propDecorators: { fdpFormFieldErrorAs: [{
                 type: Input
@@ -223,11 +222,11 @@ function generateColumnClass(layout) {
 
 class FormFieldControlExtrasComponent {
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.1.0", ngImport: i0, type: FormFieldControlExtrasComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.1.0", type: FormFieldControlExtrasComponent, selector: "fdp-form-field-extras", ngImport: i0, template: '<ng-content></ng-content>', isInline: true, styles: [":host{display:flex;white-space:normal}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.1.0", type: FormFieldControlExtrasComponent, isStandalone: true, selector: "fdp-form-field-extras", ngImport: i0, template: '<ng-content></ng-content>', isInline: true, styles: [":host{display:flex;white-space:normal}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.1.0", ngImport: i0, type: FormFieldControlExtrasComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'fdp-form-field-extras', template: '<ng-content></ng-content>', changeDetection: ChangeDetectionStrategy.OnPush, styles: [":host{display:flex;white-space:normal}\n"] }]
+            args: [{ selector: 'fdp-form-field-extras', template: '<ng-content></ng-content>', changeDetection: ChangeDetectionStrategy.OnPush, standalone: true, styles: [":host{display:flex;white-space:normal}\n"] }]
         }] });
 
 /**
@@ -258,11 +257,11 @@ class InputMessageGroupWithTemplate extends FormInputMessageGroupComponent {
         ];
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.1.0", ngImport: i0, type: InputMessageGroupWithTemplate, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.1.0", type: InputMessageGroupWithTemplate, selector: "fdp-input-message-group", inputs: { triggers: "triggers" }, queries: [{ propertyName: "triggerItemTemplate", first: true, predicate: ["triggerItem"], descendants: true }], usesInheritance: true, ngImport: i0, template: "<fd-popover\n    (isOpenChange)=\"openChanged($event)\"\n    additionalBodyClass=\"fd-popover__body--input-message-group\"\n    [closeOnOutsideClick]=\"closeOnOutsideClick\"\n    [closeOnEscapeKey]=\"closeOnEscapeKey\"\n    [fillControlMode]=\"fillControlMode\"\n    [isOpen]=\"isOpen\"\n    [placement]=\"placement\"\n    [triggers]=\"triggers\"\n    class=\"fd-form-input-message-group fd-popover--input-message-group\"\n>\n    <fd-popover-control>\n        <ng-container *ngTemplateOutlet=\"triggerItemTemplate\"></ng-container>\n    </fd-popover-control>\n    <fd-popover-body>\n        <ng-content></ng-content>\n    </fd-popover-body>\n</fd-popover>\n", styles: [".fd-popover-container-custom--message{flex-grow:1}.fd-popover-container-custom{border:none}.fd-popover__control{cursor:auto!important}fdp-input-message-group .fd-popover-custom{display:inline}fdp-input-message-group .fd-datetime .fd-popover-custom{display:inline-block}.fd-popover__body.fd-popover__body--input-message-group{margin-top:0!important;z-index:999}\n"], dependencies: [{ kind: "directive", type: i3.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: i2.PopoverControlComponent, selector: "fd-popover-control" }, { kind: "component", type: i2.PopoverBodyComponent, selector: "fd-popover-body" }, { kind: "component", type: i2.PopoverComponent, selector: "fd-popover", inputs: ["title", "trigger", "fixedPosition", "id", "mobile", "mobileConfig"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.1.0", type: InputMessageGroupWithTemplate, isStandalone: true, selector: "fdp-input-message-group", inputs: { triggers: "triggers" }, queries: [{ propertyName: "triggerItemTemplate", first: true, predicate: ["triggerItem"], descendants: true }], usesInheritance: true, ngImport: i0, template: "<fd-popover\n    #popover\n    (isOpenChange)=\"openChanged($event)\"\n    additionalBodyClass=\"fd-popover__body--input-message-group\"\n    [closeOnOutsideClick]=\"closeOnOutsideClick\"\n    [closeOnEscapeKey]=\"closeOnEscapeKey\"\n    [fillControlMode]=\"fillControlMode\"\n    [isOpen]=\"isOpen\"\n    [placement]=\"placement\"\n    [triggers]=\"triggers\"\n    [disableScrollbar]=\"true\"\n    class=\"fd-form-input-message-group fd-popover--input-message-group\"\n>\n    <fd-popover-control>\n        <ng-container *ngTemplateOutlet=\"triggerItemTemplate\"></ng-container>\n    </fd-popover-control>\n    <fd-popover-body>\n        <ng-content></ng-content>\n    </fd-popover-body>\n</fd-popover>\n", styles: [".fd-popover-container-custom--message{flex-grow:1}.fd-popover-container-custom{border:none}.fd-popover__control{cursor:auto!important}fdp-input-message-group .fd-popover-custom{display:inline}fdp-input-message-group .fd-datetime .fd-popover-custom{display:inline-block}.fd-popover__body.fd-popover__body--input-message-group{margin-top:0!important;z-index:999}\n"], dependencies: [{ kind: "component", type: PopoverComponent, selector: "fd-popover", inputs: ["title", "trigger", "fixedPosition", "id", "mobile", "mobileConfig"] }, { kind: "component", type: PopoverControlComponent, selector: "fd-popover-control" }, { kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: PopoverBodyComponent, selector: "fd-popover-body" }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.1.0", ngImport: i0, type: InputMessageGroupWithTemplate, decorators: [{
             type: Component,
-            args: [{ selector: 'fdp-input-message-group', encapsulation: ViewEncapsulation.None, changeDetection: ChangeDetectionStrategy.OnPush, template: "<fd-popover\n    (isOpenChange)=\"openChanged($event)\"\n    additionalBodyClass=\"fd-popover__body--input-message-group\"\n    [closeOnOutsideClick]=\"closeOnOutsideClick\"\n    [closeOnEscapeKey]=\"closeOnEscapeKey\"\n    [fillControlMode]=\"fillControlMode\"\n    [isOpen]=\"isOpen\"\n    [placement]=\"placement\"\n    [triggers]=\"triggers\"\n    class=\"fd-form-input-message-group fd-popover--input-message-group\"\n>\n    <fd-popover-control>\n        <ng-container *ngTemplateOutlet=\"triggerItemTemplate\"></ng-container>\n    </fd-popover-control>\n    <fd-popover-body>\n        <ng-content></ng-content>\n    </fd-popover-body>\n</fd-popover>\n", styles: [".fd-popover-container-custom--message{flex-grow:1}.fd-popover-container-custom{border:none}.fd-popover__control{cursor:auto!important}fdp-input-message-group .fd-popover-custom{display:inline}fdp-input-message-group .fd-datetime .fd-popover-custom{display:inline-block}.fd-popover__body.fd-popover__body--input-message-group{margin-top:0!important;z-index:999}\n"] }]
+            args: [{ selector: 'fdp-input-message-group', encapsulation: ViewEncapsulation.None, changeDetection: ChangeDetectionStrategy.OnPush, standalone: true, imports: [PopoverComponent, PopoverControlComponent, NgTemplateOutlet, PopoverBodyComponent], template: "<fd-popover\n    #popover\n    (isOpenChange)=\"openChanged($event)\"\n    additionalBodyClass=\"fd-popover__body--input-message-group\"\n    [closeOnOutsideClick]=\"closeOnOutsideClick\"\n    [closeOnEscapeKey]=\"closeOnEscapeKey\"\n    [fillControlMode]=\"fillControlMode\"\n    [isOpen]=\"isOpen\"\n    [placement]=\"placement\"\n    [triggers]=\"triggers\"\n    [disableScrollbar]=\"true\"\n    class=\"fd-form-input-message-group fd-popover--input-message-group\"\n>\n    <fd-popover-control>\n        <ng-container *ngTemplateOutlet=\"triggerItemTemplate\"></ng-container>\n    </fd-popover-control>\n    <fd-popover-body>\n        <ng-content></ng-content>\n    </fd-popover-body>\n</fd-popover>\n", styles: [".fd-popover-container-custom--message{flex-grow:1}.fd-popover-container-custom{border:none}.fd-popover__control{cursor:auto!important}fdp-input-message-group .fd-popover-custom{display:inline}fdp-input-message-group .fd-datetime .fd-popover-custom{display:inline-block}.fd-popover__body.fd-popover__body--input-message-group{margin-top:0!important;z-index:999}\n"] }]
         }], propDecorators: { triggers: [{
                 type: Input
             }], triggerItemTemplate: [{
@@ -659,6 +658,7 @@ class FormFieldComponent {
         });
         this._updateControlProperties();
         this._validateErrorHandler();
+        this._listenToFormMessage();
         this._cd.detectChanges();
     }
     /** @hidden */
@@ -795,6 +795,20 @@ class FormFieldComponent {
     isStringHint(hintOptions) {
         return typeof hintOptions === 'string';
     }
+    /**
+     * @hidden
+     * Listens to form message component changes and passes its instance to the form control component.
+     */
+    _listenToFormMessage() {
+        this._inputMessageGroupCmp.changes
+            .pipe(startWith(null), map(() => this._inputMessageGroupCmp.first), takeUntil(this._destroyed$))
+            .subscribe((component) => {
+            if (!this.control) {
+                return;
+            }
+            this.control.formMessage = component;
+        });
+    }
     /** @hidden */
     _validateErrorHandler() {
         if (this._editable &&
@@ -931,11 +945,23 @@ class FormFieldComponent {
         });
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.1.0", ngImport: i0, type: FormFieldComponent, deps: [{ token: i0.ChangeDetectorRef }, { token: i1.FormGroupContainer, optional: true }, { token: i1.FormFieldGroup, optional: true }, { token: RESPONSIVE_BREAKPOINTS_CONFIG, optional: true }, { token: i1.ResponsiveBreakpointsService }, { token: FDP_FORM_FIELD_HINT_OPTIONS_DEFAULT }, { token: FDP_FORM_FIELD_HINT_LAYOUT_CONFIG }, { token: FormFieldLayoutService, self: true }, { token: FormFieldLayoutService, optional: true, skipSelf: true }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.1.0", type: FormFieldComponent, selector: "fdp-form-field", inputs: { label: "label", id: "id", hint: "hint", noLabelLayout: "noLabelLayout", validators: "validators", rank: "rank", placeholder: "placeholder", column: "column", columnLayout: "columnLayout", labelColumnLayout: "labelColumnLayout", fieldColumnLayout: "fieldColumnLayout", gapColumnLayout: "gapColumnLayout", i18Strings: "i18Strings", required: "required", editable: "editable", columns: "columns", disabled: "disabled", colon: "colon", formGroupContainer: "formGroupContainer" }, outputs: { onChange: "onChange", onColumnChange: "onColumnChange" }, providers: [formFieldProvider$1, formGroupChildProvider$2, FormFieldLayoutService], queries: [{ propertyName: "formFieldExtras", first: true, predicate: FormFieldControlExtrasComponent, descendants: true, read: ElementRef }, { propertyName: "_errorDirectiveQuery", predicate: FormFieldErrorDirective }], viewQueries: [{ propertyName: "renderer", first: true, predicate: ["renderer"], descendants: true, static: true }, { propertyName: "labelCol", first: true, predicate: ["labelCol"], descendants: true }, { propertyName: "inputMessageGroup", first: true, predicate: InputMessageGroupWithTemplate, descendants: true, read: ElementRef }], usesOnChanges: true, ngImport: i0, template: "<ng-template #renderer>\n    <div [horizontal]=\"true\" fd-form-item class=\"fd-row\">\n        <div\n            class=\"fd-col\"\n            #labelCol\n            [class]=\"_labelColumnLayoutClass\"\n            *ngIf=\"!noLabelLayout\"\n            [style.margin-bottom.px]=\"_controlExtrasHeightPx\"\n        >\n            <ng-template [ngTemplateOutlet]=\"labelTemplate\"></ng-template>\n        </div>\n        <ng-container *ngTemplateOutlet=\"withFormMessage\"></ng-container>\n        <ng-container *ngTemplateOutlet=\"gapTemplate\"></ng-container>\n    </div>\n    <span aria-hidden=\"true\" style=\"display: none\" [id]=\"'fdp-form-hint-' + id\">\n        <ng-container *ngIf=\"isStringHint(hintOptions.content); else hintTemplate\">\n            {{ hintOptions.content }}\n        </ng-container>\n        <ng-template #hintTemplate>\n            <ng-template [ngTemplateOutlet]=\"$any(hintOptions.content)\"></ng-template>\n        </ng-template>\n    </span>\n</ng-template>\n\n<ng-template #withFormMessage>\n    <fdp-input-message-group\n        class=\"fd-col\"\n        [class]=\"_fieldColumnLayoutClass\"\n        [attr.aria-labelledby]=\"'fdp-form-label-' + id\"\n    >\n        <!--\n         Todo: we should extend this on FormGroup Level and have error trigger strategy that will be applied to\n         all the field e.g.: [triggers]=\"['mouseenter', 'mouseleave']\"\n         -->\n\n        <ng-template #triggerItem>\n            <ng-content></ng-content>\n        </ng-template>\n\n        <ng-container *ngIf=\"hasErrors() && groupedErrors.length > 0\">\n            <fd-form-message *ngFor=\"let error of groupedErrors\" [type]=\"error.directive.type\">\n                <ng-template\n                    [ngIf]=\"error.directive._headingTemplateRef\"\n                    [ngTemplateOutlet]=\"error.directive._headingTemplateRef\"\n                    [ngTemplateOutletContext]=\"{ $implicit: error.error, label: label }\"\n                >\n                </ng-template>\n                <ng-container *ngIf=\"error.directive._headingTemplateRef && error.directive._descriptionTemplateRef\">\n                    <br />\n                </ng-container>\n                <ng-template\n                    [ngIf]=\"error.directive._descriptionTemplateRef\"\n                    [ngTemplateOutlet]=\"error.directive._descriptionTemplateRef\"\n                    [ngTemplateOutletContext]=\"{ $implicit: error.error, label: label }\"\n                >\n                </ng-template>\n            </fd-form-message>\n        </ng-container>\n\n        <fd-form-message *ngIf=\"groupedErrors.length === 0 && hasErrors() && i18Strings\" type=\"error\">\n            <ng-container *ngTemplateOutlet=\"i18Strings; context: { $implicit: control?.ngControl?.errors }\">\n            </ng-container>\n        </fd-form-message>\n    </fdp-input-message-group>\n</ng-template>\n\n<ng-template #labelTemplate>\n    <ng-container *ngIf=\"hintTarget === 'label'; else withoutHint\">\n        <label\n            [id]=\"'fdp-form-label-' + id\"\n            [required]=\"editable && required\"\n            fd-form-label\n            [inlineHelpContent]=\"hintOptions.content\"\n            [inlineHelpBodyPlacement]=\"hintOptions.placement || 'top'\"\n            [inlineHelpPlacement]=\"hintOptions.position || 'after'\"\n            [inlineHelpGlyph]=\"hintOptions.glyph || ''\"\n            [inlineHelpTriggers]=\"hintOptions.trigger || []\"\n            [alignLabelEnd]=\"!!(isHorizontal$ | async)\"\n            [colon]=\"colon\"\n        >\n            <span [id]=\"'fdp-form-label-content-' + id\">{{ label }}</span>\n        </label>\n    </ng-container>\n    <ng-template #withoutHint>\n        <label\n            [id]=\"'fdp-form-label-' + id\"\n            [required]=\"editable && required\"\n            fd-form-label\n            [colon]=\"colon\"\n            [alignLabelEnd]=\"!!(isHorizontal$ | async)\"\n        >\n            <span [id]=\"'fdp-form-label-content-' + id\">{{ label }}</span>\n        </label>\n    </ng-template>\n</ng-template>\n\n<ng-template #gapTemplate>\n    <ng-container *ngIf=\"hintTarget === 'input' && hintOptions.content; else withoutHint\">\n        <div class=\"fd-col fd-form-field-inline-help-container\" [class]=\"_gapColumnLayoutClass\">\n            <span fd-link [undecorated]=\"true\">\n                <fd-icon\n                    [fd-inline-help]=\"hintOptions.content\"\n                    [glyph]=\"hintOptions.glyph\"\n                    [placement]=\"hintOptions.placement || null\"\n                    [triggers]=\"hintOptions.trigger || []\"\n                    tabindex=\"0\"\n                >\n                </fd-icon>\n            </span>\n        </div>\n    </ng-container>\n    <ng-template #withoutHint>\n        <div class=\"fd-col\" [class]=\"_gapColumnLayoutClass\"></div>\n    </ng-template>\n</ng-template>\n", styles: [".fd-form-label__wrapper{display:flex;width:100%;white-space:nowrap}.fd-form-field-inline-help-container{overflow:visible!important}.fd-form-field-inline-help-container [class*=sap-icon]{margin:0}\n"], dependencies: [{ kind: "directive", type: i3.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i3.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i3.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: i4.FormItemComponent, selector: "[fd-form-item]", inputs: ["isInline", "horizontal"] }, { kind: "component", type: i4.FormLabelComponent, selector: "[fd-form-label]", inputs: ["required", "colon", "alignLabelEnd", "inlineHelpContent", "inlineHelpGlyph", "inlineHelpTriggers", "inlineHelpBodyPlacement", "inlineHelpPlacement", "inlineHelpLabel", "id"] }, { kind: "component", type: i4.FormMessageComponent, selector: "fd-form-message", inputs: ["type", "static", "embedded", "class"] }, { kind: "directive", type: i5.InlineHelpDirective, selector: "[fd-inline-help]:not([fd-inline-help-template]), [fd-inline-help-template]:not([fd-inline-help])", inputs: ["triggers", "noArrow", "closeOnEscapeKey", "closeOnOutsideClick", "fd-inline-help"] }, { kind: "component", type: i6.IconComponent, selector: "fd-icon", inputs: ["glyph", "font", "class", "ariaLabel"] }, { kind: "component", type: i7.LinkComponent, selector: "[fdLink], [fd-link]", inputs: ["class", "emphasized", "disabled", "inverted", "subtle", "undecorated"] }, { kind: "component", type: InputMessageGroupWithTemplate, selector: "fdp-input-message-group", inputs: ["triggers"] }, { kind: "pipe", type: i3.AsyncPipe, name: "async" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.1.0", type: FormFieldComponent, isStandalone: true, selector: "fdp-form-field", inputs: { label: "label", id: "id", hint: "hint", noLabelLayout: "noLabelLayout", validators: "validators", rank: "rank", placeholder: "placeholder", column: "column", columnLayout: "columnLayout", labelColumnLayout: "labelColumnLayout", fieldColumnLayout: "fieldColumnLayout", gapColumnLayout: "gapColumnLayout", i18Strings: "i18Strings", required: "required", editable: "editable", columns: "columns", disabled: "disabled", colon: "colon", formGroupContainer: "formGroupContainer" }, outputs: { onChange: "onChange", onColumnChange: "onColumnChange" }, providers: [formFieldProvider$1, formGroupChildProvider$2, FormFieldLayoutService], queries: [{ propertyName: "formFieldExtras", first: true, predicate: FormFieldControlExtrasComponent, descendants: true, read: ElementRef }, { propertyName: "_errorDirectiveQuery", predicate: FormFieldErrorDirective }], viewQueries: [{ propertyName: "renderer", first: true, predicate: ["renderer"], descendants: true, static: true }, { propertyName: "labelCol", first: true, predicate: ["labelCol"], descendants: true }, { propertyName: "inputMessageGroup", first: true, predicate: InputMessageGroupWithTemplate, descendants: true, read: ElementRef }, { propertyName: "innerErrorRenderers", first: true, predicate: ["innerErrorRenderers"], descendants: true }, { propertyName: "_inputMessageGroupCmp", predicate: InputMessageGroupWithTemplate, descendants: true }], usesOnChanges: true, ngImport: i0, template: "<ng-template #renderer>\n    <div [horizontal]=\"true\" fd-form-item class=\"fd-row\">\n        <div\n            class=\"fd-col\"\n            #labelCol\n            [class]=\"_labelColumnLayoutClass\"\n            *ngIf=\"!noLabelLayout\"\n            [style.margin-bottom.px]=\"_controlExtrasHeightPx\"\n        >\n            <ng-template [ngTemplateOutlet]=\"labelTemplate\"></ng-template>\n        </div>\n        <ng-container *ngTemplateOutlet=\"withFormMessage\"></ng-container>\n        <ng-container *ngTemplateOutlet=\"gapTemplate\"></ng-container>\n    </div>\n    <span aria-hidden=\"true\" [style.display]=\"'none'\" [id]=\"'fdp-form-hint-' + id\">\n        <ng-container *ngIf=\"isStringHint(hintOptions.content); else hintTemplate\">\n            {{ hintOptions.content }}\n        </ng-container>\n        <ng-template #hintTemplate>\n            <ng-template [ngTemplateOutlet]=\"$any(hintOptions.content)\"></ng-template>\n        </ng-template>\n    </span>\n</ng-template>\n\n<ng-template #withFormMessage>\n    <fdp-input-message-group\n        class=\"fd-col\"\n        [class]=\"_fieldColumnLayoutClass\"\n        [attr.aria-labelledby]=\"'fdp-form-label-' + id\"\n    >\n        <ng-template #triggerItem>\n            <ng-content></ng-content>\n        </ng-template>\n\n        <ng-container *ngIf=\"hasErrors() && groupedErrors.length > 0\">\n            <fd-form-message *ngFor=\"let error of groupedErrors\" [type]=\"error.directive.type\">\n                <ng-template\n                    [ngIf]=\"error.directive._headingTemplateRef\"\n                    [ngTemplateOutlet]=\"error.directive._headingTemplateRef\"\n                    [ngTemplateOutletContext]=\"{ $implicit: error.error, label: label }\"\n                >\n                </ng-template>\n                <ng-container *ngIf=\"error.directive._headingTemplateRef && error.directive._descriptionTemplateRef\">\n                    <br />\n                </ng-container>\n                <ng-template\n                    [ngIf]=\"error.directive._descriptionTemplateRef\"\n                    [ngTemplateOutlet]=\"error.directive._descriptionTemplateRef\"\n                    [ngTemplateOutletContext]=\"{ $implicit: error.error, label: label }\"\n                >\n                </ng-template>\n            </fd-form-message>\n        </ng-container>\n\n        <fd-form-message *ngIf=\"groupedErrors.length === 0 && hasErrors() && i18Strings\" type=\"error\">\n            <ng-container *ngTemplateOutlet=\"i18Strings; context: { $implicit: control?.ngControl?.errors }\">\n            </ng-container>\n        </fd-form-message>\n    </fdp-input-message-group>\n</ng-template>\n\n<ng-template #innerErrorRenderers>\n    <ng-container *ngIf=\"hasErrors() && groupedErrors.length > 0\">\n        <ng-container *ngFor=\"let error of groupedErrors\">\n            <ng-template\n                [ngIf]=\"error.directive._headingTemplateRef\"\n                [ngTemplateOutlet]=\"error.directive._headingTemplateRef\"\n                [ngTemplateOutletContext]=\"{ $implicit: error.error, label: label }\"\n            >\n            </ng-template>\n            <ng-container *ngIf=\"error.directive._headingTemplateRef && error.directive._descriptionTemplateRef\">\n                <br />\n            </ng-container>\n            <ng-template\n                [ngIf]=\"error.directive._descriptionTemplateRef\"\n                [ngTemplateOutlet]=\"error.directive._descriptionTemplateRef\"\n                [ngTemplateOutletContext]=\"{ $implicit: error.error, label: label }\"\n            >\n            </ng-template>\n        </ng-container>\n    </ng-container>\n    <ng-container *ngIf=\"groupedErrors.length === 0 && hasErrors() && i18Strings\">\n        <ng-container *ngTemplateOutlet=\"i18Strings; context: { $implicit: control?.ngControl?.errors }\">\n        </ng-container>\n    </ng-container>\n</ng-template>\n\n<ng-template #labelTemplate>\n    <ng-container *ngIf=\"hintTarget === 'label'; else withoutHint\">\n        <label\n            [id]=\"'fdp-form-label-' + id\"\n            [required]=\"editable && required\"\n            fd-form-label\n            [inlineHelpContent]=\"hintOptions.content\"\n            [inlineHelpBodyPlacement]=\"hintOptions.placement || 'top'\"\n            [inlineHelpPlacement]=\"hintOptions.position || 'after'\"\n            [inlineHelpGlyph]=\"hintOptions.glyph || ''\"\n            [inlineHelpTriggers]=\"hintOptions.trigger || []\"\n            [alignLabelEnd]=\"!!(isHorizontal$ | async)\"\n            [colon]=\"colon\"\n        >\n            <span [id]=\"'fdp-form-label-content-' + id\">{{ label }}</span>\n        </label>\n    </ng-container>\n    <ng-template #withoutHint>\n        <label\n            [id]=\"'fdp-form-label-' + id\"\n            [required]=\"editable && required\"\n            fd-form-label\n            [colon]=\"colon\"\n            [alignLabelEnd]=\"!!(isHorizontal$ | async)\"\n        >\n            <span [id]=\"'fdp-form-label-content-' + id\">{{ label }}</span>\n        </label>\n    </ng-template>\n</ng-template>\n\n<ng-template #gapTemplate>\n    <ng-container *ngIf=\"hintTarget === 'input' && hintOptions.content; else withoutHint\">\n        <div class=\"fd-col fd-form-field-inline-help-container\" [class]=\"_gapColumnLayoutClass\">\n            <span fd-link [undecorated]=\"true\">\n                <fd-icon\n                    [fd-inline-help]=\"hintOptions.content\"\n                    [glyph]=\"hintOptions.glyph\"\n                    [placement]=\"hintOptions.placement || null\"\n                    [triggers]=\"hintOptions.trigger || []\"\n                    tabindex=\"0\"\n                >\n                </fd-icon>\n            </span>\n        </div>\n    </ng-container>\n    <ng-template #withoutHint>\n        <div class=\"fd-col\" [class]=\"_gapColumnLayoutClass\"></div>\n    </ng-template>\n</ng-template>\n", styles: [".fd-form-label__wrapper{display:flex;width:100%;white-space:nowrap}.fd-form-field-inline-help-container{overflow:visible!important}.fd-form-field-inline-help-container [class*=sap-icon]{margin:0}\n"], dependencies: [{ kind: "ngmodule", type: FormItemModule }, { kind: "component", type: i3.FormItemComponent, selector: "[fd-form-item]", inputs: ["isInline", "horizontal"] }, { kind: "directive", type: NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: InputMessageGroupWithTemplate, selector: "fdp-input-message-group", inputs: ["triggers"] }, { kind: "directive", type: NgFor, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "ngmodule", type: FormMessageModule }, { kind: "component", type: i3.FormMessageComponent, selector: "fd-form-message", inputs: ["type", "static", "embedded", "class"] }, { kind: "ngmodule", type: FormLabelModule }, { kind: "component", type: i3.FormLabelComponent, selector: "[fd-form-label]", inputs: ["required", "colon", "alignLabelEnd", "inlineHelpContent", "inlineHelpGlyph", "inlineHelpTriggers", "inlineHelpBodyPlacement", "inlineHelpPlacement", "inlineHelpLabel", "id"] }, { kind: "component", type: LinkComponent, selector: "[fdLink], [fd-link]", inputs: ["class", "emphasized", "disabled", "inverted", "subtle", "undecorated"] }, { kind: "ngmodule", type: IconModule }, { kind: "component", type: i4.IconComponent, selector: "fd-icon", inputs: ["glyph", "font", "class", "ariaLabel"] }, { kind: "ngmodule", type: InlineHelpModule }, { kind: "directive", type: i5.InlineHelpDirective, selector: "[fd-inline-help]:not([fd-inline-help-template]), [fd-inline-help-template]:not([fd-inline-help])", inputs: ["triggers", "noArrow", "closeOnEscapeKey", "closeOnOutsideClick", "fd-inline-help"] }, { kind: "pipe", type: AsyncPipe, name: "async" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.1.0", ngImport: i0, type: FormFieldComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'fdp-form-field', changeDetection: ChangeDetectionStrategy.OnPush, providers: [formFieldProvider$1, formGroupChildProvider$2, FormFieldLayoutService], template: "<ng-template #renderer>\n    <div [horizontal]=\"true\" fd-form-item class=\"fd-row\">\n        <div\n            class=\"fd-col\"\n            #labelCol\n            [class]=\"_labelColumnLayoutClass\"\n            *ngIf=\"!noLabelLayout\"\n            [style.margin-bottom.px]=\"_controlExtrasHeightPx\"\n        >\n            <ng-template [ngTemplateOutlet]=\"labelTemplate\"></ng-template>\n        </div>\n        <ng-container *ngTemplateOutlet=\"withFormMessage\"></ng-container>\n        <ng-container *ngTemplateOutlet=\"gapTemplate\"></ng-container>\n    </div>\n    <span aria-hidden=\"true\" style=\"display: none\" [id]=\"'fdp-form-hint-' + id\">\n        <ng-container *ngIf=\"isStringHint(hintOptions.content); else hintTemplate\">\n            {{ hintOptions.content }}\n        </ng-container>\n        <ng-template #hintTemplate>\n            <ng-template [ngTemplateOutlet]=\"$any(hintOptions.content)\"></ng-template>\n        </ng-template>\n    </span>\n</ng-template>\n\n<ng-template #withFormMessage>\n    <fdp-input-message-group\n        class=\"fd-col\"\n        [class]=\"_fieldColumnLayoutClass\"\n        [attr.aria-labelledby]=\"'fdp-form-label-' + id\"\n    >\n        <!--\n         Todo: we should extend this on FormGroup Level and have error trigger strategy that will be applied to\n         all the field e.g.: [triggers]=\"['mouseenter', 'mouseleave']\"\n         -->\n\n        <ng-template #triggerItem>\n            <ng-content></ng-content>\n        </ng-template>\n\n        <ng-container *ngIf=\"hasErrors() && groupedErrors.length > 0\">\n            <fd-form-message *ngFor=\"let error of groupedErrors\" [type]=\"error.directive.type\">\n                <ng-template\n                    [ngIf]=\"error.directive._headingTemplateRef\"\n                    [ngTemplateOutlet]=\"error.directive._headingTemplateRef\"\n                    [ngTemplateOutletContext]=\"{ $implicit: error.error, label: label }\"\n                >\n                </ng-template>\n                <ng-container *ngIf=\"error.directive._headingTemplateRef && error.directive._descriptionTemplateRef\">\n                    <br />\n                </ng-container>\n                <ng-template\n                    [ngIf]=\"error.directive._descriptionTemplateRef\"\n                    [ngTemplateOutlet]=\"error.directive._descriptionTemplateRef\"\n                    [ngTemplateOutletContext]=\"{ $implicit: error.error, label: label }\"\n                >\n                </ng-template>\n            </fd-form-message>\n        </ng-container>\n\n        <fd-form-message *ngIf=\"groupedErrors.length === 0 && hasErrors() && i18Strings\" type=\"error\">\n            <ng-container *ngTemplateOutlet=\"i18Strings; context: { $implicit: control?.ngControl?.errors }\">\n            </ng-container>\n        </fd-form-message>\n    </fdp-input-message-group>\n</ng-template>\n\n<ng-template #labelTemplate>\n    <ng-container *ngIf=\"hintTarget === 'label'; else withoutHint\">\n        <label\n            [id]=\"'fdp-form-label-' + id\"\n            [required]=\"editable && required\"\n            fd-form-label\n            [inlineHelpContent]=\"hintOptions.content\"\n            [inlineHelpBodyPlacement]=\"hintOptions.placement || 'top'\"\n            [inlineHelpPlacement]=\"hintOptions.position || 'after'\"\n            [inlineHelpGlyph]=\"hintOptions.glyph || ''\"\n            [inlineHelpTriggers]=\"hintOptions.trigger || []\"\n            [alignLabelEnd]=\"!!(isHorizontal$ | async)\"\n            [colon]=\"colon\"\n        >\n            <span [id]=\"'fdp-form-label-content-' + id\">{{ label }}</span>\n        </label>\n    </ng-container>\n    <ng-template #withoutHint>\n        <label\n            [id]=\"'fdp-form-label-' + id\"\n            [required]=\"editable && required\"\n            fd-form-label\n            [colon]=\"colon\"\n            [alignLabelEnd]=\"!!(isHorizontal$ | async)\"\n        >\n            <span [id]=\"'fdp-form-label-content-' + id\">{{ label }}</span>\n        </label>\n    </ng-template>\n</ng-template>\n\n<ng-template #gapTemplate>\n    <ng-container *ngIf=\"hintTarget === 'input' && hintOptions.content; else withoutHint\">\n        <div class=\"fd-col fd-form-field-inline-help-container\" [class]=\"_gapColumnLayoutClass\">\n            <span fd-link [undecorated]=\"true\">\n                <fd-icon\n                    [fd-inline-help]=\"hintOptions.content\"\n                    [glyph]=\"hintOptions.glyph\"\n                    [placement]=\"hintOptions.placement || null\"\n                    [triggers]=\"hintOptions.trigger || []\"\n                    tabindex=\"0\"\n                >\n                </fd-icon>\n            </span>\n        </div>\n    </ng-container>\n    <ng-template #withoutHint>\n        <div class=\"fd-col\" [class]=\"_gapColumnLayoutClass\"></div>\n    </ng-template>\n</ng-template>\n", styles: [".fd-form-label__wrapper{display:flex;width:100%;white-space:nowrap}.fd-form-field-inline-help-container{overflow:visible!important}.fd-form-field-inline-help-container [class*=sap-icon]{margin:0}\n"] }]
+            args: [{ selector: 'fdp-form-field', changeDetection: ChangeDetectionStrategy.OnPush, providers: [formFieldProvider$1, formGroupChildProvider$2, FormFieldLayoutService], standalone: true, imports: [
+                        FormItemModule,
+                        NgIf,
+                        NgTemplateOutlet,
+                        InputMessageGroupWithTemplate,
+                        NgFor,
+                        FormMessageModule,
+                        FormLabelModule,
+                        LinkComponent,
+                        IconModule,
+                        InlineHelpModule,
+                        AsyncPipe
+                    ], template: "<ng-template #renderer>\n    <div [horizontal]=\"true\" fd-form-item class=\"fd-row\">\n        <div\n            class=\"fd-col\"\n            #labelCol\n            [class]=\"_labelColumnLayoutClass\"\n            *ngIf=\"!noLabelLayout\"\n            [style.margin-bottom.px]=\"_controlExtrasHeightPx\"\n        >\n            <ng-template [ngTemplateOutlet]=\"labelTemplate\"></ng-template>\n        </div>\n        <ng-container *ngTemplateOutlet=\"withFormMessage\"></ng-container>\n        <ng-container *ngTemplateOutlet=\"gapTemplate\"></ng-container>\n    </div>\n    <span aria-hidden=\"true\" [style.display]=\"'none'\" [id]=\"'fdp-form-hint-' + id\">\n        <ng-container *ngIf=\"isStringHint(hintOptions.content); else hintTemplate\">\n            {{ hintOptions.content }}\n        </ng-container>\n        <ng-template #hintTemplate>\n            <ng-template [ngTemplateOutlet]=\"$any(hintOptions.content)\"></ng-template>\n        </ng-template>\n    </span>\n</ng-template>\n\n<ng-template #withFormMessage>\n    <fdp-input-message-group\n        class=\"fd-col\"\n        [class]=\"_fieldColumnLayoutClass\"\n        [attr.aria-labelledby]=\"'fdp-form-label-' + id\"\n    >\n        <ng-template #triggerItem>\n            <ng-content></ng-content>\n        </ng-template>\n\n        <ng-container *ngIf=\"hasErrors() && groupedErrors.length > 0\">\n            <fd-form-message *ngFor=\"let error of groupedErrors\" [type]=\"error.directive.type\">\n                <ng-template\n                    [ngIf]=\"error.directive._headingTemplateRef\"\n                    [ngTemplateOutlet]=\"error.directive._headingTemplateRef\"\n                    [ngTemplateOutletContext]=\"{ $implicit: error.error, label: label }\"\n                >\n                </ng-template>\n                <ng-container *ngIf=\"error.directive._headingTemplateRef && error.directive._descriptionTemplateRef\">\n                    <br />\n                </ng-container>\n                <ng-template\n                    [ngIf]=\"error.directive._descriptionTemplateRef\"\n                    [ngTemplateOutlet]=\"error.directive._descriptionTemplateRef\"\n                    [ngTemplateOutletContext]=\"{ $implicit: error.error, label: label }\"\n                >\n                </ng-template>\n            </fd-form-message>\n        </ng-container>\n\n        <fd-form-message *ngIf=\"groupedErrors.length === 0 && hasErrors() && i18Strings\" type=\"error\">\n            <ng-container *ngTemplateOutlet=\"i18Strings; context: { $implicit: control?.ngControl?.errors }\">\n            </ng-container>\n        </fd-form-message>\n    </fdp-input-message-group>\n</ng-template>\n\n<ng-template #innerErrorRenderers>\n    <ng-container *ngIf=\"hasErrors() && groupedErrors.length > 0\">\n        <ng-container *ngFor=\"let error of groupedErrors\">\n            <ng-template\n                [ngIf]=\"error.directive._headingTemplateRef\"\n                [ngTemplateOutlet]=\"error.directive._headingTemplateRef\"\n                [ngTemplateOutletContext]=\"{ $implicit: error.error, label: label }\"\n            >\n            </ng-template>\n            <ng-container *ngIf=\"error.directive._headingTemplateRef && error.directive._descriptionTemplateRef\">\n                <br />\n            </ng-container>\n            <ng-template\n                [ngIf]=\"error.directive._descriptionTemplateRef\"\n                [ngTemplateOutlet]=\"error.directive._descriptionTemplateRef\"\n                [ngTemplateOutletContext]=\"{ $implicit: error.error, label: label }\"\n            >\n            </ng-template>\n        </ng-container>\n    </ng-container>\n    <ng-container *ngIf=\"groupedErrors.length === 0 && hasErrors() && i18Strings\">\n        <ng-container *ngTemplateOutlet=\"i18Strings; context: { $implicit: control?.ngControl?.errors }\">\n        </ng-container>\n    </ng-container>\n</ng-template>\n\n<ng-template #labelTemplate>\n    <ng-container *ngIf=\"hintTarget === 'label'; else withoutHint\">\n        <label\n            [id]=\"'fdp-form-label-' + id\"\n            [required]=\"editable && required\"\n            fd-form-label\n            [inlineHelpContent]=\"hintOptions.content\"\n            [inlineHelpBodyPlacement]=\"hintOptions.placement || 'top'\"\n            [inlineHelpPlacement]=\"hintOptions.position || 'after'\"\n            [inlineHelpGlyph]=\"hintOptions.glyph || ''\"\n            [inlineHelpTriggers]=\"hintOptions.trigger || []\"\n            [alignLabelEnd]=\"!!(isHorizontal$ | async)\"\n            [colon]=\"colon\"\n        >\n            <span [id]=\"'fdp-form-label-content-' + id\">{{ label }}</span>\n        </label>\n    </ng-container>\n    <ng-template #withoutHint>\n        <label\n            [id]=\"'fdp-form-label-' + id\"\n            [required]=\"editable && required\"\n            fd-form-label\n            [colon]=\"colon\"\n            [alignLabelEnd]=\"!!(isHorizontal$ | async)\"\n        >\n            <span [id]=\"'fdp-form-label-content-' + id\">{{ label }}</span>\n        </label>\n    </ng-template>\n</ng-template>\n\n<ng-template #gapTemplate>\n    <ng-container *ngIf=\"hintTarget === 'input' && hintOptions.content; else withoutHint\">\n        <div class=\"fd-col fd-form-field-inline-help-container\" [class]=\"_gapColumnLayoutClass\">\n            <span fd-link [undecorated]=\"true\">\n                <fd-icon\n                    [fd-inline-help]=\"hintOptions.content\"\n                    [glyph]=\"hintOptions.glyph\"\n                    [placement]=\"hintOptions.placement || null\"\n                    [triggers]=\"hintOptions.trigger || []\"\n                    tabindex=\"0\"\n                >\n                </fd-icon>\n            </span>\n        </div>\n    </ng-container>\n    <ng-template #withoutHint>\n        <div class=\"fd-col\" [class]=\"_gapColumnLayoutClass\"></div>\n    </ng-template>\n</ng-template>\n", styles: [".fd-form-label__wrapper{display:flex;width:100%;white-space:nowrap}.fd-form-field-inline-help-container{overflow:visible!important}.fd-form-field-inline-help-container [class*=sap-icon]{margin:0}\n"] }]
         }], ctorParameters: function () { return [{ type: i0.ChangeDetectorRef }, { type: i1.FormGroupContainer, decorators: [{
                     type: Optional
                 }] }, { type: i1.FormFieldGroup, decorators: [{
@@ -1009,15 +1035,21 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.1.0", ngImpor
             }], formFieldExtras: [{
                 type: ContentChild,
                 args: [FormFieldControlExtrasComponent, { read: ElementRef }]
-            }], _errorDirectiveQuery: [{
-                type: ContentChildren,
-                args: [FormFieldErrorDirective]
             }], labelCol: [{
                 type: ViewChild,
                 args: ['labelCol']
             }], inputMessageGroup: [{
                 type: ViewChild,
                 args: [InputMessageGroupWithTemplate, { read: ElementRef }]
+            }], innerErrorRenderers: [{
+                type: ViewChild,
+                args: ['innerErrorRenderers']
+            }], _errorDirectiveQuery: [{
+                type: ContentChildren,
+                args: [FormFieldErrorDirective]
+            }], _inputMessageGroupCmp: [{
+                type: ViewChildren,
+                args: [InputMessageGroupWithTemplate]
             }] } });
 
 const formFieldGroupProvider = {
@@ -1100,11 +1132,11 @@ class FormFieldGroupComponent {
         this.formGroupContainer.removeFormFieldGroup(this);
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.1.0", ngImport: i0, type: FormFieldGroupComponent, deps: [{ token: i1.FormGroupContainer, optional: true }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.1.0", type: FormFieldGroupComponent, selector: "fdp-form-field-group", inputs: { label: "label", formName: "formName", formGroupContainer: "formGroupContainer", labelColumnLayout: "labelColumnLayout", fieldColumnLayout: "fieldColumnLayout", gapColumnLayout: "gapColumnLayout", hintOptions: "hintOptions" }, providers: [formFieldGroupProvider, formGroupChildProvider$1], queries: [{ propertyName: "fields", predicate: FD_FORM_FIELD, descendants: true }], ngImport: i0, template: ` <ng-content></ng-content>`, isInline: true, styles: ["/*!\n * Fundamental Library Styles v0.30.2-rc.6\n * Copyright (c) 2023 SAP SE or an SAP affiliate company.\n * Licensed under Apache License 2.0 (https://github.com/SAP/fundamental-styles/blob/main/LICENSE)\n */.fd-form-group{-webkit-box-sizing:border-box;border:0;box-sizing:border-box;color:var(--sapTextColor);font-family:var(--sapFontFamily);font-size:var(--sapFontSize);font-weight:400;forced-color-adjust:none;line-height:var(--sapContent_LineHeight);margin:0;padding:0}.fd-form-group:after,.fd-form-group:before{box-sizing:inherit;font-size:inherit}.fd-form-group--inline{-webkit-box-pack:start;-ms-flex-pack:start;-ms-flex-wrap:wrap;flex-direction:row;flex-wrap:wrap;justify-content:flex-start}.fd-form-group--inline,.fd-form-group__header{display:flex}.fd-form-group__header{-webkit-box-sizing:border-box;align-items:center;background-color:var(--sapGroup_TitleBackground);border:0;box-sizing:border-box;color:var(--sapTextColor);font-family:var(--sapFontFamily);font-size:var(--sapFontSize);font-weight:400;forced-color-adjust:none;height:2.75rem;line-height:var(--sapContent_LineHeight);margin:0;padding:0;width:100%}.fd-form-group__header:after,.fd-form-group__header:before{box-sizing:inherit;font-size:inherit}.fd-form-group__header[class*=-compact],.fd-form-group__header[class*=-condensed],[class*=-compact] .fd-form-group__header:not([class*=-cozy]),[class*=-condensed] .fd-form-group__header:not([class*=-cozy]){height:2rem}.fd-form-group__header-text{-webkit-box-sizing:border-box;border:0;box-sizing:border-box;color:var(--sapTextColor);color:var(--sapGroup_TitleTextColor);font-family:var(--sapFontFamily);font-family:var(--sapFontHeaderFamily);font-size:var(--sapFontSize);font-size:var(--sapFontHeader6Size);font-weight:400;font-weight:700;forced-color-adjust:none;line-height:var(--sapContent_LineHeight);margin:0;overflow:hidden;padding:0;text-overflow:ellipsis;white-space:nowrap}.fd-form-group__header-text:after,.fd-form-group__header-text:before{box-sizing:inherit;font-size:inherit}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.1.0", type: FormFieldGroupComponent, isStandalone: true, selector: "fdp-form-field-group", inputs: { label: "label", formName: "formName", formGroupContainer: "formGroupContainer", labelColumnLayout: "labelColumnLayout", fieldColumnLayout: "fieldColumnLayout", gapColumnLayout: "gapColumnLayout", hintOptions: "hintOptions" }, providers: [formFieldGroupProvider, formGroupChildProvider$1], queries: [{ propertyName: "fields", predicate: FD_FORM_FIELD, descendants: true }], ngImport: i0, template: ` <ng-content></ng-content>`, isInline: true, styles: ["/*!\n * Fundamental Library Styles v0.30.2-rc.6\n * Copyright (c) 2023 SAP SE or an SAP affiliate company.\n * Licensed under Apache License 2.0 (https://github.com/SAP/fundamental-styles/blob/main/LICENSE)\n */.fd-form-group{-webkit-box-sizing:border-box;border:0;box-sizing:border-box;color:var(--sapTextColor);font-family:var(--sapFontFamily);font-size:var(--sapFontSize);font-weight:400;forced-color-adjust:none;line-height:var(--sapContent_LineHeight);margin:0;padding:0}.fd-form-group:after,.fd-form-group:before{box-sizing:inherit;font-size:inherit}.fd-form-group--inline{-webkit-box-pack:start;-ms-flex-pack:start;-ms-flex-wrap:wrap;flex-direction:row;flex-wrap:wrap;justify-content:flex-start}.fd-form-group--inline,.fd-form-group__header{display:flex}.fd-form-group__header{-webkit-box-sizing:border-box;align-items:center;background-color:var(--sapGroup_TitleBackground);border:0;box-sizing:border-box;color:var(--sapTextColor);font-family:var(--sapFontFamily);font-size:var(--sapFontSize);font-weight:400;forced-color-adjust:none;height:2.75rem;line-height:var(--sapContent_LineHeight);margin:0;padding:0;width:100%}.fd-form-group__header:after,.fd-form-group__header:before{box-sizing:inherit;font-size:inherit}.fd-form-group__header[class*=-compact],.fd-form-group__header[class*=-condensed],[class*=-compact] .fd-form-group__header:not([class*=-cozy]),[class*=-condensed] .fd-form-group__header:not([class*=-cozy]){height:2rem}.fd-form-group__header-text{-webkit-box-sizing:border-box;border:0;box-sizing:border-box;color:var(--sapTextColor);color:var(--sapGroup_TitleTextColor);font-family:var(--sapFontFamily);font-family:var(--sapFontHeaderFamily);font-size:var(--sapFontSize);font-size:var(--sapFontHeader6Size);font-weight:400;font-weight:700;forced-color-adjust:none;line-height:var(--sapContent_LineHeight);margin:0;overflow:hidden;padding:0;text-overflow:ellipsis;white-space:nowrap}.fd-form-group__header-text:after,.fd-form-group__header-text:before{box-sizing:inherit;font-size:inherit}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.1.0", ngImport: i0, type: FormFieldGroupComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'fdp-form-field-group', template: ` <ng-content></ng-content>`, changeDetection: ChangeDetectionStrategy.OnPush, encapsulation: ViewEncapsulation.None, providers: [formFieldGroupProvider, formGroupChildProvider$1], styles: ["/*!\n * Fundamental Library Styles v0.30.2-rc.6\n * Copyright (c) 2023 SAP SE or an SAP affiliate company.\n * Licensed under Apache License 2.0 (https://github.com/SAP/fundamental-styles/blob/main/LICENSE)\n */.fd-form-group{-webkit-box-sizing:border-box;border:0;box-sizing:border-box;color:var(--sapTextColor);font-family:var(--sapFontFamily);font-size:var(--sapFontSize);font-weight:400;forced-color-adjust:none;line-height:var(--sapContent_LineHeight);margin:0;padding:0}.fd-form-group:after,.fd-form-group:before{box-sizing:inherit;font-size:inherit}.fd-form-group--inline{-webkit-box-pack:start;-ms-flex-pack:start;-ms-flex-wrap:wrap;flex-direction:row;flex-wrap:wrap;justify-content:flex-start}.fd-form-group--inline,.fd-form-group__header{display:flex}.fd-form-group__header{-webkit-box-sizing:border-box;align-items:center;background-color:var(--sapGroup_TitleBackground);border:0;box-sizing:border-box;color:var(--sapTextColor);font-family:var(--sapFontFamily);font-size:var(--sapFontSize);font-weight:400;forced-color-adjust:none;height:2.75rem;line-height:var(--sapContent_LineHeight);margin:0;padding:0;width:100%}.fd-form-group__header:after,.fd-form-group__header:before{box-sizing:inherit;font-size:inherit}.fd-form-group__header[class*=-compact],.fd-form-group__header[class*=-condensed],[class*=-compact] .fd-form-group__header:not([class*=-cozy]),[class*=-condensed] .fd-form-group__header:not([class*=-cozy]){height:2rem}.fd-form-group__header-text{-webkit-box-sizing:border-box;border:0;box-sizing:border-box;color:var(--sapTextColor);color:var(--sapGroup_TitleTextColor);font-family:var(--sapFontFamily);font-family:var(--sapFontHeaderFamily);font-size:var(--sapFontSize);font-size:var(--sapFontHeader6Size);font-weight:400;font-weight:700;forced-color-adjust:none;line-height:var(--sapContent_LineHeight);margin:0;overflow:hidden;padding:0;text-overflow:ellipsis;white-space:nowrap}.fd-form-group__header-text:after,.fd-form-group__header-text:before{box-sizing:inherit;font-size:inherit}\n"] }]
+            args: [{ selector: 'fdp-form-field-group', template: ` <ng-content></ng-content>`, changeDetection: ChangeDetectionStrategy.OnPush, encapsulation: ViewEncapsulation.None, providers: [formFieldGroupProvider, formGroupChildProvider$1], standalone: true, styles: ["/*!\n * Fundamental Library Styles v0.30.2-rc.6\n * Copyright (c) 2023 SAP SE or an SAP affiliate company.\n * Licensed under Apache License 2.0 (https://github.com/SAP/fundamental-styles/blob/main/LICENSE)\n */.fd-form-group{-webkit-box-sizing:border-box;border:0;box-sizing:border-box;color:var(--sapTextColor);font-family:var(--sapFontFamily);font-size:var(--sapFontSize);font-weight:400;forced-color-adjust:none;line-height:var(--sapContent_LineHeight);margin:0;padding:0}.fd-form-group:after,.fd-form-group:before{box-sizing:inherit;font-size:inherit}.fd-form-group--inline{-webkit-box-pack:start;-ms-flex-pack:start;-ms-flex-wrap:wrap;flex-direction:row;flex-wrap:wrap;justify-content:flex-start}.fd-form-group--inline,.fd-form-group__header{display:flex}.fd-form-group__header{-webkit-box-sizing:border-box;align-items:center;background-color:var(--sapGroup_TitleBackground);border:0;box-sizing:border-box;color:var(--sapTextColor);font-family:var(--sapFontFamily);font-size:var(--sapFontSize);font-weight:400;forced-color-adjust:none;height:2.75rem;line-height:var(--sapContent_LineHeight);margin:0;padding:0;width:100%}.fd-form-group__header:after,.fd-form-group__header:before{box-sizing:inherit;font-size:inherit}.fd-form-group__header[class*=-compact],.fd-form-group__header[class*=-condensed],[class*=-compact] .fd-form-group__header:not([class*=-cozy]),[class*=-condensed] .fd-form-group__header:not([class*=-cozy]){height:2rem}.fd-form-group__header-text{-webkit-box-sizing:border-box;border:0;box-sizing:border-box;color:var(--sapTextColor);color:var(--sapGroup_TitleTextColor);font-family:var(--sapFontFamily);font-family:var(--sapFontHeaderFamily);font-size:var(--sapFontSize);font-size:var(--sapFontHeader6Size);font-weight:400;font-weight:700;forced-color-adjust:none;line-height:var(--sapContent_LineHeight);margin:0;overflow:hidden;padding:0;text-overflow:ellipsis;white-space:nowrap}.fd-form-group__header-text:after,.fd-form-group__header-text:before{box-sizing:inherit;font-size:inherit}\n"] }]
         }], ctorParameters: function () { return [{ type: i1.FormGroupContainer, decorators: [{
                     type: Optional
                 }] }]; }, propDecorators: { label: [{
@@ -1291,11 +1323,11 @@ class InputComponent extends BaseInput {
         this.focusChange.emit(false);
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.1.0", ngImport: i0, type: InputComponent, deps: [{ token: i0.ChangeDetectorRef }, { token: i0.ElementRef }, { token: i1$1.NgControl, optional: true, self: true }, { token: i1$1.ControlContainer, optional: true, skipSelf: true }, { token: i1$1.NgForm, optional: true, skipSelf: true }, { token: FD_FORM_FIELD, host: true, optional: true, skipSelf: true }, { token: FD_FORM_FIELD_CONTROL, host: true, optional: true, skipSelf: true }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.1.0", type: InputComponent, selector: "fdp-input", inputs: { type: "type", required: "required", value: "value" }, outputs: { focusChange: "focusChange" }, providers: [{ provide: FD_FORM_FIELD_CONTROL, useExisting: InputComponent, multi: true }], usesInheritance: true, ngImport: i0, template: "<!--\n  Does it make sense to have some other state than error?\n-->\n<input\n    #inputElementRef\n    fd-form-control\n    [(ngModel)]=\"value\"\n    [ngModelOptions]=\"{ standalone: true }\"\n    [attr.id]=\"id\"\n    [attr.name]=\"name\"\n    [attr.type]=\"type\"\n    [attr.placeholder]=\"placeholder\"\n    [disabled]=\"disabled\"\n    [state]=\"state\"\n    [readOnly]=\"readonly\"\n    (blur)=\"_onBlur()\"\n    (focus)=\"_onFocus()\"\n    [ariaLabel]=\"ariaLabel\"\n    [ariaLabelledBy]=\"ariaLabelledBy\"\n    [attr.aria-required]=\"required\"\n/>\n", styles: [".fd-input{display:block}\n"], dependencies: [{ kind: "component", type: i4.FormControlComponent, selector: "[fd-form-control]", inputs: ["state", "type", "class", "ariaLabel", "ariaLabelledBy"] }, { kind: "directive", type: i4.InputFormControlDirective, selector: "input[fd-form-control]" }, { kind: "directive", type: i1$1.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i1$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$1.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.1.0", type: InputComponent, isStandalone: true, selector: "fdp-input", inputs: { type: "type", required: "required", value: "value" }, outputs: { focusChange: "focusChange" }, providers: [{ provide: FD_FORM_FIELD_CONTROL, useExisting: InputComponent, multi: true }], usesInheritance: true, ngImport: i0, template: "<!--\n  Does it make sense to have some other state than error?\n-->\n<input\n    #inputElementRef\n    fd-form-control\n    [(ngModel)]=\"value\"\n    [ngModelOptions]=\"{ standalone: true }\"\n    [attr.id]=\"id\"\n    [attr.name]=\"name\"\n    [attr.type]=\"type\"\n    [attr.placeholder]=\"placeholder\"\n    [disabled]=\"disabled\"\n    [state]=\"state\"\n    [readOnly]=\"readonly\"\n    (blur)=\"_onBlur()\"\n    (focus)=\"_onFocus()\"\n    [ariaLabel]=\"ariaLabel\"\n    [ariaLabelledBy]=\"ariaLabelledBy\"\n    [attr.aria-required]=\"required\"\n/>\n", styles: [".fd-input{display:block}\n"], dependencies: [{ kind: "ngmodule", type: FormControlModule }, { kind: "component", type: i3.FormControlComponent, selector: "[fd-form-control]", inputs: ["state", "type", "class", "ariaLabel", "ariaLabelledBy"] }, { kind: "directive", type: i3.InputFormControlDirective, selector: "input[fd-form-control]" }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1$1.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i1$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$1.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.1.0", ngImport: i0, type: InputComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'fdp-input', changeDetection: ChangeDetectionStrategy.OnPush, providers: [{ provide: FD_FORM_FIELD_CONTROL, useExisting: InputComponent, multi: true }], template: "<!--\n  Does it make sense to have some other state than error?\n-->\n<input\n    #inputElementRef\n    fd-form-control\n    [(ngModel)]=\"value\"\n    [ngModelOptions]=\"{ standalone: true }\"\n    [attr.id]=\"id\"\n    [attr.name]=\"name\"\n    [attr.type]=\"type\"\n    [attr.placeholder]=\"placeholder\"\n    [disabled]=\"disabled\"\n    [state]=\"state\"\n    [readOnly]=\"readonly\"\n    (blur)=\"_onBlur()\"\n    (focus)=\"_onFocus()\"\n    [ariaLabel]=\"ariaLabel\"\n    [ariaLabelledBy]=\"ariaLabelledBy\"\n    [attr.aria-required]=\"required\"\n/>\n", styles: [".fd-input{display:block}\n"] }]
+            args: [{ selector: 'fdp-input', changeDetection: ChangeDetectionStrategy.OnPush, providers: [{ provide: FD_FORM_FIELD_CONTROL, useExisting: InputComponent, multi: true }], standalone: true, imports: [FormControlModule, FormsModule], template: "<!--\n  Does it make sense to have some other state than error?\n-->\n<input\n    #inputElementRef\n    fd-form-control\n    [(ngModel)]=\"value\"\n    [ngModelOptions]=\"{ standalone: true }\"\n    [attr.id]=\"id\"\n    [attr.name]=\"name\"\n    [attr.type]=\"type\"\n    [attr.placeholder]=\"placeholder\"\n    [disabled]=\"disabled\"\n    [state]=\"state\"\n    [readOnly]=\"readonly\"\n    (blur)=\"_onBlur()\"\n    (focus)=\"_onFocus()\"\n    [ariaLabel]=\"ariaLabel\"\n    [ariaLabelledBy]=\"ariaLabelledBy\"\n    [attr.aria-required]=\"required\"\n/>\n", styles: [".fd-input{display:block}\n"] }]
         }], ctorParameters: function () { return [{ type: i0.ChangeDetectorRef }, { type: i0.ElementRef }, { type: i1$1.NgControl, decorators: [{
                     type: Optional
                 }, {
@@ -1338,15 +1370,14 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.1.0", ngImpor
 
 class PlatformInputModule {
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.1.0", ngImport: i0, type: PlatformInputModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
-    static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "16.1.0", ngImport: i0, type: PlatformInputModule, declarations: [InputComponent], imports: [CommonModule, FormModule, FormsModule, PipeModule, ContentDensityModule], exports: [InputComponent, ContentDensityModule] }); }
-    static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "16.1.0", ngImport: i0, type: PlatformInputModule, imports: [CommonModule, FormModule, FormsModule, PipeModule, ContentDensityModule, ContentDensityModule] }); }
+    static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "16.1.0", ngImport: i0, type: PlatformInputModule, imports: [InputComponent], exports: [InputComponent] }); }
+    static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "16.1.0", ngImport: i0, type: PlatformInputModule, imports: [InputComponent] }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.1.0", ngImport: i0, type: PlatformInputModule, decorators: [{
             type: NgModule,
             args: [{
-                    declarations: [InputComponent],
-                    imports: [CommonModule, FormModule, FormsModule, PipeModule, ContentDensityModule],
-                    exports: [InputComponent, ContentDensityModule]
+                    imports: [InputComponent],
+                    exports: [InputComponent]
                 }]
         }] });
 
@@ -1418,7 +1449,7 @@ class CheckboxComponent extends BaseInput {
         event.checked = this.value;
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.1.0", ngImport: i0, type: CheckboxComponent, deps: [{ token: i0.ElementRef }, { token: i1$1.NgControl, optional: true, self: true }, { token: i1$1.ControlContainer, optional: true, skipSelf: true }, { token: i1$1.NgForm, optional: true, skipSelf: true }, { token: FD_FORM_FIELD, host: true, optional: true, skipSelf: true }, { token: FD_FORM_FIELD_CONTROL, host: true, optional: true, skipSelf: true }, { token: i0.ChangeDetectorRef }, { token: 'tabIndexValue', attribute: true }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.1.0", type: CheckboxComponent, isStandalone: true, selector: "fdp-checkbox", inputs: { title: "title", label: "label", tristate: "tristate", value: ["checked", "value"], tristateSelectable: "tristateSelectable", values: "values", standalone: "standalone", displayOnly: "displayOnly" }, outputs: { checkedChange: "checkedChange" }, providers: [{ provide: FD_FORM_FIELD_CONTROL, useExisting: forwardRef(() => CheckboxComponent), multi: true }], viewQueries: [{ propertyName: "coreCheckbox", first: true, predicate: CheckboxComponent$1, descendants: true }], usesInheritance: true, ngImport: i0, template: "<div fd-form-item>\n    <fd-checkbox\n        [inputId]=\"id\"\n        [name]=\"name\"\n        [disabled]=\"disabled\"\n        [label]=\"label\"\n        [tristate]=\"tristate\"\n        [values]=\"values\"\n        [tristateSelectable]=\"tristateSelectable\"\n        [state]=\"state\"\n        [title]=\"title\"\n        [required]=\"required\"\n        [ariaLabel]=\"ariaLabel || null\"\n        [ariaLabelledBy]=\"ariaLabelledBy\"\n        [ariaDescribedBy]=\"ariaDescribedBy\"\n        [ngModel]=\"value\"\n        [standalone]=\"standalone\"\n        [displayOnly]=\"displayOnly\"\n        (ngModelChange)=\"onModelChange($event)\"\n        (focusChange)=\"_onFocusChanged($event)\"\n    >\n        <ng-content></ng-content>\n    </fd-checkbox>\n</div>\n", dependencies: [{ kind: "ngmodule", type: FormItemModule }, { kind: "component", type: i4.FormItemComponent, selector: "[fd-form-item]", inputs: ["isInline", "horizontal"] }, { kind: "component", type: CheckboxComponent$1, selector: "fd-checkbox", inputs: ["wrapLabel", "valignLabel", "ariaLabel", "value", "ariaLabelledBy", "ariaDescribedBy", "title", "inputId", "state", "name", "label", "disabled", "tristate", "tristateSelectable", "labelClass", "required", "displayOnly", "values", "standalone"], outputs: ["focusChange"] }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$1.RequiredValidator, selector: ":not([type=checkbox])[required][formControlName],:not([type=checkbox])[required][formControl],:not([type=checkbox])[required][ngModel]", inputs: ["required"] }, { kind: "directive", type: i1$1.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.1.0", type: CheckboxComponent, isStandalone: true, selector: "fdp-checkbox", inputs: { title: "title", label: "label", tristate: "tristate", value: ["checked", "value"], tristateSelectable: "tristateSelectable", values: "values", standalone: "standalone", displayOnly: "displayOnly" }, outputs: { checkedChange: "checkedChange" }, providers: [{ provide: FD_FORM_FIELD_CONTROL, useExisting: forwardRef(() => CheckboxComponent), multi: true }], viewQueries: [{ propertyName: "coreCheckbox", first: true, predicate: CheckboxComponent$1, descendants: true }], usesInheritance: true, ngImport: i0, template: "<div fd-form-item>\n    <fd-checkbox\n        [inputId]=\"id\"\n        [name]=\"name\"\n        [disabled]=\"disabled\"\n        [label]=\"label\"\n        [tristate]=\"tristate\"\n        [values]=\"values\"\n        [tristateSelectable]=\"tristateSelectable\"\n        [state]=\"state\"\n        [title]=\"title\"\n        [required]=\"required\"\n        [ariaLabel]=\"ariaLabel || null\"\n        [ariaLabelledBy]=\"ariaLabelledBy\"\n        [ariaDescribedBy]=\"ariaDescribedBy\"\n        [ngModel]=\"value\"\n        [standalone]=\"standalone\"\n        [displayOnly]=\"displayOnly\"\n        (ngModelChange)=\"onModelChange($event)\"\n        (focusChange)=\"_onFocusChanged($event)\"\n    >\n        <ng-content></ng-content>\n    </fd-checkbox>\n</div>\n", dependencies: [{ kind: "ngmodule", type: FormItemModule }, { kind: "component", type: i3.FormItemComponent, selector: "[fd-form-item]", inputs: ["isInline", "horizontal"] }, { kind: "component", type: CheckboxComponent$1, selector: "fd-checkbox", inputs: ["wrapLabel", "valignLabel", "ariaLabel", "value", "ariaLabelledBy", "ariaDescribedBy", "title", "inputId", "state", "name", "label", "disabled", "tristate", "tristateSelectable", "labelClass", "required", "displayOnly", "values", "standalone"], outputs: ["focusChange"] }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$1.RequiredValidator, selector: ":not([type=checkbox])[required][formControlName],:not([type=checkbox])[required][formControl],:not([type=checkbox])[required][ngModel]", inputs: ["required"] }, { kind: "directive", type: i1$1.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.1.0", ngImport: i0, type: CheckboxComponent, decorators: [{
             type: Component,
@@ -1598,7 +1629,7 @@ class CheckboxGroupComponent extends InLineLayoutCollectionBaseInput {
         this._cd.markForCheck();
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.1.0", ngImport: i0, type: CheckboxGroupComponent, deps: [{ token: i0.ChangeDetectorRef }, { token: i0.ElementRef }, { token: i1.ResponsiveBreakpointsService }, { token: i1$1.NgControl, optional: true, self: true }, { token: i1$1.ControlContainer, optional: true, skipSelf: true }, { token: i1$1.NgForm, optional: true, skipSelf: true }, { token: FD_FORM_FIELD, host: true, optional: true, skipSelf: true }, { token: FD_FORM_FIELD_CONTROL, host: true, optional: true, skipSelf: true }, { token: RESPONSIVE_BREAKPOINTS_CONFIG, optional: true }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.1.0", type: CheckboxGroupComponent, isStandalone: true, selector: "fdp-checkbox-group", inputs: { value: "value", isInline: "isInline" }, outputs: { valueChange: "valueChange" }, providers: [{ provide: FD_FORM_FIELD_CONTROL, useExisting: forwardRef(() => CheckboxGroupComponent), multi: true }], queries: [{ propertyName: "contentCheckboxes", predicate: CheckboxComponent }], viewQueries: [{ propertyName: "viewCheckboxes", predicate: CheckboxComponent, descendants: true }], usesInheritance: true, ngImport: i0, template: "<fd-form-group\n    [isInline]=\"isInline\"\n    role=\"group\"\n    [attr.aria-label]=\"ariaLabel\"\n    [attr.aria-labelledby]=\"ariaLabelledBy\"\n    [attr.aria-required]=\"required\"\n>\n    <ng-container *ngIf=\"!list\">\n        <ng-container *ngFor=\"let checkbox of contentCheckboxes; let i = index\">\n            <ng-container\n                *ngTemplateOutlet=\"\n                    checkboxtmpt;\n                    context: {\n                        id: id + i,\n                        idx: i,\n                        source: 'contentChildren',\n                        name: name,\n                        checkboxValue: checkbox.coreCheckbox?.values?.trueValue,\n                        labeltext: checkbox.label,\n                        disabled: disabled || checkbox.disabled,\n                        ariaLabel: checkbox.ariaLabel,\n                        ariaLabelledBy: checkbox.ariaLabelledBy,\n                        ariaDescribedBy: checkbox.ariaDescribedBy,\n                        title: checkbox.title\n                    }\n                \"\n            >\n            </ng-container>\n        </ng-container>\n    </ng-container>\n    <ng-container *ngIf=\"list\">\n        <ng-container *ngTemplateOutlet=\"listvalues\"></ng-container>\n    </ng-container>\n</fd-form-group>\n\n<ng-template #listvalues>\n    <ng-container *ngFor=\"let item of list; let i = index\">\n        <ng-container\n            *ngTemplateOutlet=\"\n                checkboxtmpt;\n                context: {\n                    id: id + i,\n                    idx: i,\n                    source: 'list',\n                    name: name,\n                    checkboxValue: getLookupValue(item),\n                    labeltext: getDisplayValue(item),\n                    disabled: getListItemDisabledValue(item)\n                }\n            \"\n        >\n        </ng-container>\n    </ng-container>\n</ng-template>\n\n<ng-template\n    #checkboxtmpt\n    let-id=\"id\"\n    let-idx=\"idx\"\n    let-source=\"source\"\n    let-name=\"name\"\n    let-checkboxValue=\"checkboxValue\"\n    let-labeltext=\"labeltext\"\n    let-checkboxDisabled=\"disabled\"\n    let-ariaLabel=\"ariaLabel\"\n    let-ariaLabelledBy=\"ariaLabelledBy\"\n    let-ariaDescribedBy=\"ariaDescribedBy\"\n    let-title=\"title\"\n>\n    <fdp-checkbox\n        [id]=\"id\"\n        [name]=\"name\"\n        [values]=\"{ trueValue: checkboxValue }\"\n        [label]=\"labeltext\"\n        [ariaLabel]=\"ariaLabel\"\n        [ariaLabelledBy]=\"ariaLabelledBy\"\n        [ariaDescribedBy]=\"ariaDescribedBy\"\n        [title]=\"title\"\n        [disabled]=\"checkboxDisabled\"\n        [state]=\"state\"\n        [ngModel]=\"_selectionModel.isSelected(checkboxValue) ? checkboxValue : false\"\n        (ngModelChange)=\"onModelChanged($event, checkboxValue)\"\n        (click)=\"onCheckboxClick(idx, source, $event)\"\n    >\n    </fdp-checkbox>\n</ng-template>\n", dependencies: [{ kind: "ngmodule", type: FormGroupModule }, { kind: "component", type: i4.FormGroupComponent, selector: "fd-form-group", inputs: ["isInline"] }, { kind: "directive", type: NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: NgFor, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: CheckboxComponent, selector: "fdp-checkbox", inputs: ["title", "label", "tristate", "checked", "tristateSelectable", "values", "standalone", "displayOnly"], outputs: ["checkedChange"] }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$1.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.1.0", type: CheckboxGroupComponent, isStandalone: true, selector: "fdp-checkbox-group", inputs: { value: "value", isInline: "isInline" }, outputs: { valueChange: "valueChange" }, providers: [{ provide: FD_FORM_FIELD_CONTROL, useExisting: forwardRef(() => CheckboxGroupComponent), multi: true }], queries: [{ propertyName: "contentCheckboxes", predicate: CheckboxComponent }], viewQueries: [{ propertyName: "viewCheckboxes", predicate: CheckboxComponent, descendants: true }], usesInheritance: true, ngImport: i0, template: "<fd-form-group\n    [isInline]=\"isInline\"\n    role=\"group\"\n    [attr.aria-label]=\"ariaLabel\"\n    [attr.aria-labelledby]=\"ariaLabelledBy\"\n    [attr.aria-required]=\"required\"\n>\n    <ng-container *ngIf=\"!list\">\n        <ng-container *ngFor=\"let checkbox of contentCheckboxes; let i = index\">\n            <ng-container\n                *ngTemplateOutlet=\"\n                    checkboxtmpt;\n                    context: {\n                        id: id + i,\n                        idx: i,\n                        source: 'contentChildren',\n                        name: name,\n                        checkboxValue: checkbox.coreCheckbox?.values?.trueValue,\n                        labeltext: checkbox.label,\n                        disabled: disabled || checkbox.disabled,\n                        ariaLabel: checkbox.ariaLabel,\n                        ariaLabelledBy: checkbox.ariaLabelledBy,\n                        ariaDescribedBy: checkbox.ariaDescribedBy,\n                        title: checkbox.title\n                    }\n                \"\n            >\n            </ng-container>\n        </ng-container>\n    </ng-container>\n    <ng-container *ngIf=\"list\">\n        <ng-container *ngTemplateOutlet=\"listvalues\"></ng-container>\n    </ng-container>\n</fd-form-group>\n\n<ng-template #listvalues>\n    <ng-container *ngFor=\"let item of list; let i = index\">\n        <ng-container\n            *ngTemplateOutlet=\"\n                checkboxtmpt;\n                context: {\n                    id: id + i,\n                    idx: i,\n                    source: 'list',\n                    name: name,\n                    checkboxValue: getLookupValue(item),\n                    labeltext: getDisplayValue(item),\n                    disabled: getListItemDisabledValue(item)\n                }\n            \"\n        >\n        </ng-container>\n    </ng-container>\n</ng-template>\n\n<ng-template\n    #checkboxtmpt\n    let-id=\"id\"\n    let-idx=\"idx\"\n    let-source=\"source\"\n    let-name=\"name\"\n    let-checkboxValue=\"checkboxValue\"\n    let-labeltext=\"labeltext\"\n    let-checkboxDisabled=\"disabled\"\n    let-ariaLabel=\"ariaLabel\"\n    let-ariaLabelledBy=\"ariaLabelledBy\"\n    let-ariaDescribedBy=\"ariaDescribedBy\"\n    let-title=\"title\"\n>\n    <fdp-checkbox\n        [id]=\"id\"\n        [name]=\"name\"\n        [values]=\"{ trueValue: checkboxValue }\"\n        [label]=\"labeltext\"\n        [ariaLabel]=\"ariaLabel\"\n        [ariaLabelledBy]=\"ariaLabelledBy\"\n        [ariaDescribedBy]=\"ariaDescribedBy\"\n        [title]=\"title\"\n        [disabled]=\"checkboxDisabled\"\n        [state]=\"state\"\n        [ngModel]=\"_selectionModel.isSelected(checkboxValue) ? checkboxValue : false\"\n        (ngModelChange)=\"onModelChanged($event, checkboxValue)\"\n        (click)=\"onCheckboxClick(idx, source, $event)\"\n    >\n    </fdp-checkbox>\n</ng-template>\n", dependencies: [{ kind: "ngmodule", type: FormGroupModule }, { kind: "component", type: i3.FormGroupComponent, selector: "fd-form-group", inputs: ["isInline"] }, { kind: "directive", type: NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: NgFor, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: CheckboxComponent, selector: "fdp-checkbox", inputs: ["title", "label", "tristate", "checked", "tristateSelectable", "values", "standalone", "displayOnly"], outputs: ["checkedChange"] }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$1.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.1.0", ngImport: i0, type: CheckboxGroupComponent, decorators: [{
             type: Component,
@@ -1657,14 +1688,14 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.1.0", ngImpor
 
 class PlatformCheckboxGroupModule {
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.1.0", ngImport: i0, type: PlatformCheckboxGroupModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
-    static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "16.1.0", ngImport: i0, type: PlatformCheckboxGroupModule, imports: [FormGroupModule, ContentDensityModule, CheckboxGroupComponent], exports: [CheckboxGroupComponent, ContentDensityModule] }); }
-    static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "16.1.0", ngImport: i0, type: PlatformCheckboxGroupModule, imports: [FormGroupModule, ContentDensityModule, CheckboxGroupComponent, ContentDensityModule] }); }
+    static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "16.1.0", ngImport: i0, type: PlatformCheckboxGroupModule, imports: [CheckboxGroupComponent], exports: [CheckboxGroupComponent] }); }
+    static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "16.1.0", ngImport: i0, type: PlatformCheckboxGroupModule, imports: [CheckboxGroupComponent] }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.1.0", ngImport: i0, type: PlatformCheckboxGroupModule, decorators: [{
             type: NgModule,
             args: [{
-                    imports: [FormGroupModule, ContentDensityModule, CheckboxGroupComponent],
-                    exports: [CheckboxGroupComponent, ContentDensityModule]
+                    imports: [CheckboxGroupComponent],
+                    exports: [CheckboxGroupComponent]
                 }]
         }] });
 
@@ -1754,11 +1785,11 @@ class RadioButtonComponent extends BaseInput {
         this._cd.markForCheck();
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.1.0", ngImport: i0, type: RadioButtonComponent, deps: [{ token: i0.ChangeDetectorRef }, { token: i0.ElementRef }, { token: i1$1.NgControl, optional: true, self: true }, { token: i1$1.ControlContainer, optional: true, skipSelf: true }, { token: i1$1.NgForm, optional: true, skipSelf: true }, { token: FD_FORM_FIELD, host: true, optional: true, skipSelf: true }, { token: FD_FORM_FIELD_CONTROL, host: true, optional: true, skipSelf: true }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.1.0", type: RadioButtonComponent, selector: "fdp-radio-button", inputs: { title: "title", tabIndex: "tabIndex", value: "value", forceRender: "forceRender" }, outputs: { checked: "checked" }, viewQueries: [{ propertyName: "renderer", first: true, predicate: ["renderer"], descendants: true }, { propertyName: "coreRadioButton", first: true, predicate: RadioButtonComponent$1, descendants: true }], usesInheritance: true, ngImport: i0, template: "<ng-template #renderer>\n    <fd-radio-button\n        [id]=\"id\"\n        [name]=\"name\"\n        [value]=\"value\"\n        [state]=\"state\"\n        [disabled]=\"disabled\"\n        [tabIndex]=\"_isChecked ? 0 : tabIndex\"\n        [title]=\"title\"\n        [ariaLabel]=\"ariaLabel\"\n        [ariaLabelledBy]=\"ariaLabelledBy\"\n        [ariaDescribedBy]=\"ariaDescribedBy\"\n        [ngModel]=\"_currentValue\"\n        (ngModelChange)=\"_valueChange($event, true)\"\n    >\n        <ng-content></ng-content>\n    </fd-radio-button>\n</ng-template>\n\n<ng-container *ngIf=\"forceRender\">\n    <ng-container *ngTemplateOutlet=\"renderer\"></ng-container>\n</ng-container>\n", dependencies: [{ kind: "directive", type: i3.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i3.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: i1$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$1.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "component", type: i3$1.RadioButtonComponent, selector: "fd-radio-button", inputs: ["ariaLabel", "ariaLabelledBy", "ariaDescribedBy", "title", "tabIndex", "state", "disabled", "selectedValue", "name", "id", "value", "required", "standalone"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.1.0", type: RadioButtonComponent, isStandalone: true, selector: "fdp-radio-button", inputs: { title: "title", tabIndex: "tabIndex", value: "value", forceRender: "forceRender" }, outputs: { checked: "checked" }, viewQueries: [{ propertyName: "renderer", first: true, predicate: ["renderer"], descendants: true }, { propertyName: "coreRadioButton", first: true, predicate: RadioButtonComponent$1, descendants: true }], usesInheritance: true, ngImport: i0, template: "<ng-template #renderer>\n    <fd-radio-button\n        [id]=\"id\"\n        [name]=\"name\"\n        [value]=\"value\"\n        [state]=\"state\"\n        [disabled]=\"disabled\"\n        [tabIndex]=\"_isChecked ? 0 : tabIndex\"\n        [title]=\"title\"\n        [ariaLabel]=\"ariaLabel\"\n        [ariaLabelledBy]=\"ariaLabelledBy\"\n        [ariaDescribedBy]=\"ariaDescribedBy\"\n        [ngModel]=\"_currentValue\"\n        (ngModelChange)=\"_valueChange($event, true)\"\n    >\n        <ng-content></ng-content>\n    </fd-radio-button>\n</ng-template>\n\n<ng-container *ngIf=\"forceRender\">\n    <ng-container *ngTemplateOutlet=\"renderer\"></ng-container>\n</ng-container>\n", dependencies: [{ kind: "ngmodule", type: RadioModule }, { kind: "component", type: i2.RadioButtonComponent, selector: "fd-radio-button", inputs: ["ariaLabel", "ariaLabelledBy", "ariaDescribedBy", "title", "tabIndex", "state", "disabled", "selectedValue", "name", "id", "value", "required", "standalone"] }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$1.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "directive", type: NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.1.0", ngImport: i0, type: RadioButtonComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'fdp-radio-button', changeDetection: ChangeDetectionStrategy.OnPush, template: "<ng-template #renderer>\n    <fd-radio-button\n        [id]=\"id\"\n        [name]=\"name\"\n        [value]=\"value\"\n        [state]=\"state\"\n        [disabled]=\"disabled\"\n        [tabIndex]=\"_isChecked ? 0 : tabIndex\"\n        [title]=\"title\"\n        [ariaLabel]=\"ariaLabel\"\n        [ariaLabelledBy]=\"ariaLabelledBy\"\n        [ariaDescribedBy]=\"ariaDescribedBy\"\n        [ngModel]=\"_currentValue\"\n        (ngModelChange)=\"_valueChange($event, true)\"\n    >\n        <ng-content></ng-content>\n    </fd-radio-button>\n</ng-template>\n\n<ng-container *ngIf=\"forceRender\">\n    <ng-container *ngTemplateOutlet=\"renderer\"></ng-container>\n</ng-container>\n" }]
+            args: [{ selector: 'fdp-radio-button', changeDetection: ChangeDetectionStrategy.OnPush, standalone: true, imports: [RadioModule, FormsModule, NgIf, NgTemplateOutlet], template: "<ng-template #renderer>\n    <fd-radio-button\n        [id]=\"id\"\n        [name]=\"name\"\n        [value]=\"value\"\n        [state]=\"state\"\n        [disabled]=\"disabled\"\n        [tabIndex]=\"_isChecked ? 0 : tabIndex\"\n        [title]=\"title\"\n        [ariaLabel]=\"ariaLabel\"\n        [ariaLabelledBy]=\"ariaLabelledBy\"\n        [ariaDescribedBy]=\"ariaDescribedBy\"\n        [ngModel]=\"_currentValue\"\n        (ngModelChange)=\"_valueChange($event, true)\"\n    >\n        <ng-content></ng-content>\n    </fd-radio-button>\n</ng-template>\n\n<ng-container *ngIf=\"forceRender\">\n    <ng-container *ngTemplateOutlet=\"renderer\"></ng-container>\n</ng-container>\n" }]
         }], ctorParameters: function () { return [{ type: i0.ChangeDetectorRef }, { type: i0.ElementRef }, { type: i1$1.NgControl, decorators: [{
                     type: Optional
                 }, {
@@ -2005,11 +2036,11 @@ class RadioGroupComponent extends InLineLayoutCollectionBaseInput {
             .length === 0);
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.1.0", ngImport: i0, type: RadioGroupComponent, deps: [{ token: i0.ChangeDetectorRef }, { token: i0.ElementRef }, { token: i1.ResponsiveBreakpointsService }, { token: i1$1.NgControl, optional: true, self: true }, { token: i1$1.ControlContainer, optional: true, skipSelf: true }, { token: i1$1.NgForm, optional: true, skipSelf: true }, { token: FD_FORM_FIELD, host: true, optional: true, skipSelf: true }, { token: FD_FORM_FIELD_CONTROL, host: true, optional: true, skipSelf: true }, { token: RESPONSIVE_BREAKPOINTS_CONFIG, optional: true }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.1.0", type: RadioGroupComponent, selector: "fdp-radio-group", inputs: { value: ["selected", "value"], isInline: "isInline", hasNoValue: "hasNoValue", noValueLabel: "noValueLabel" }, outputs: { change: "change" }, host: { listeners: { "keydown": "_handleKeydown($event)" } }, providers: [{ provide: FD_FORM_FIELD_CONTROL, useExisting: forwardRef(() => RadioGroupComponent), multi: true }], queries: [{ propertyName: "contentRadioButtons", predicate: RadioButtonComponent }], viewQueries: [{ propertyName: "viewRadioButtons", predicate: RadioButtonComponent, descendants: true }], usesInheritance: true, ngImport: i0, template: "<fd-form-group\n    [isInline]=\"isInline\"\n    role=\"radiogroup\"\n    [attr.aria-label]=\"ariaLabel\"\n    [attr.aria-labelledby]=\"ariaLabelledBy\"\n    [attr.aria-orientation]=\"isInline ? 'horizontal' : 'vertical'\"\n    [attr.aria-required]=\"required\"\n>\n    <ng-container *ngIf=\"!list\">\n        <ng-container *ngFor=\"let radio of contentRadioButtons\">\n            <div fd-form-item>\n                <ng-container\n                    *ngTemplateOutlet=\"\n                        radio?.renderer || null;\n                        context: {\n                            name: name,\n                            value: radio.value,\n                            state: state,\n                            disabled: disabled || radio.disabled,\n                            ariaLabel: radio.ariaLabel,\n                            ariaLabelledBy: radio.ariaLabelledBy,\n                            ariaDescribedBy: radio.ariaDescribedBy,\n                            title: radio.title\n                        }\n                    \"\n                ></ng-container>\n            </div>\n        </ng-container>\n    </ng-container>\n    <ng-container *ngIf=\"list\">\n        <ng-container *ngTemplateOutlet=\"listvalues\"></ng-container>\n    </ng-container>\n</fd-form-group>\n\n<ng-template #listvalues>\n    <ng-container *ngIf=\"hasNoValue\">\n        <div fd-form-item>\n            <fdp-radio-button [name]=\"name\" value=\"None\" [state]=\"state\" [disabled]=\"disabled\" [forceRender]=\"true\">\n                {{ noValueLabel }}\n            </fdp-radio-button>\n        </div>\n    </ng-container>\n    <ng-container *ngFor=\"let item of list\">\n        <div fd-form-item>\n            <fdp-radio-button\n                [name]=\"name\"\n                [value]=\"lookupValue(item)\"\n                [state]=\"state\"\n                [disabled]=\"_getListItemDisabledValue(item)\"\n                [forceRender]=\"true\"\n            >\n                {{ getDisplayValue(item) }}\n            </fdp-radio-button>\n        </div>\n    </ng-container>\n</ng-template>\n", dependencies: [{ kind: "directive", type: i3.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i3.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i3.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: i4.FormItemComponent, selector: "[fd-form-item]", inputs: ["isInline", "horizontal"] }, { kind: "component", type: i4.FormGroupComponent, selector: "fd-form-group", inputs: ["isInline"] }, { kind: "component", type: RadioButtonComponent, selector: "fdp-radio-button", inputs: ["title", "tabIndex", "value", "forceRender"], outputs: ["checked"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.1.0", type: RadioGroupComponent, isStandalone: true, selector: "fdp-radio-group", inputs: { value: ["selected", "value"], isInline: "isInline", hasNoValue: "hasNoValue", noValueLabel: "noValueLabel" }, outputs: { change: "change" }, host: { listeners: { "keydown": "_handleKeydown($event)" } }, providers: [{ provide: FD_FORM_FIELD_CONTROL, useExisting: forwardRef(() => RadioGroupComponent), multi: true }], queries: [{ propertyName: "contentRadioButtons", predicate: RadioButtonComponent }], viewQueries: [{ propertyName: "viewRadioButtons", predicate: RadioButtonComponent, descendants: true }], usesInheritance: true, ngImport: i0, template: "<fd-form-group\n    [isInline]=\"isInline\"\n    role=\"radiogroup\"\n    [attr.aria-label]=\"ariaLabel\"\n    [attr.aria-labelledby]=\"ariaLabelledBy\"\n    [attr.aria-orientation]=\"isInline ? 'horizontal' : 'vertical'\"\n    [attr.aria-required]=\"required\"\n>\n    <ng-container *ngIf=\"!list\">\n        <ng-container *ngFor=\"let radio of contentRadioButtons\">\n            <div fd-form-item>\n                <ng-container\n                    *ngTemplateOutlet=\"\n                        radio?.renderer || null;\n                        context: {\n                            name: name,\n                            value: radio.value,\n                            state: state,\n                            disabled: disabled || radio.disabled,\n                            ariaLabel: radio.ariaLabel,\n                            ariaLabelledBy: radio.ariaLabelledBy,\n                            ariaDescribedBy: radio.ariaDescribedBy,\n                            title: radio.title\n                        }\n                    \"\n                ></ng-container>\n            </div>\n        </ng-container>\n    </ng-container>\n    <ng-container *ngIf=\"list\">\n        <ng-container *ngTemplateOutlet=\"listvalues\"></ng-container>\n    </ng-container>\n</fd-form-group>\n\n<ng-template #listvalues>\n    <ng-container *ngIf=\"hasNoValue\">\n        <div fd-form-item>\n            <fdp-radio-button [name]=\"name\" value=\"None\" [state]=\"state\" [disabled]=\"disabled\" [forceRender]=\"true\">\n                {{ noValueLabel }}\n            </fdp-radio-button>\n        </div>\n    </ng-container>\n    <ng-container *ngFor=\"let item of list\">\n        <div fd-form-item>\n            <fdp-radio-button\n                [name]=\"name\"\n                [value]=\"lookupValue(item)\"\n                [state]=\"state\"\n                [disabled]=\"_getListItemDisabledValue(item)\"\n                [forceRender]=\"true\"\n            >\n                {{ getDisplayValue(item) }}\n            </fdp-radio-button>\n        </div>\n    </ng-container>\n</ng-template>\n", dependencies: [{ kind: "ngmodule", type: FormGroupModule }, { kind: "component", type: i3.FormGroupComponent, selector: "fd-form-group", inputs: ["isInline"] }, { kind: "directive", type: NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: NgFor, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "ngmodule", type: FormItemModule }, { kind: "component", type: i3.FormItemComponent, selector: "[fd-form-item]", inputs: ["isInline", "horizontal"] }, { kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: RadioButtonComponent, selector: "fdp-radio-button", inputs: ["title", "tabIndex", "value", "forceRender"], outputs: ["checked"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.1.0", ngImport: i0, type: RadioGroupComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'fdp-radio-group', changeDetection: ChangeDetectionStrategy.OnPush, encapsulation: ViewEncapsulation.None, providers: [{ provide: FD_FORM_FIELD_CONTROL, useExisting: forwardRef(() => RadioGroupComponent), multi: true }], template: "<fd-form-group\n    [isInline]=\"isInline\"\n    role=\"radiogroup\"\n    [attr.aria-label]=\"ariaLabel\"\n    [attr.aria-labelledby]=\"ariaLabelledBy\"\n    [attr.aria-orientation]=\"isInline ? 'horizontal' : 'vertical'\"\n    [attr.aria-required]=\"required\"\n>\n    <ng-container *ngIf=\"!list\">\n        <ng-container *ngFor=\"let radio of contentRadioButtons\">\n            <div fd-form-item>\n                <ng-container\n                    *ngTemplateOutlet=\"\n                        radio?.renderer || null;\n                        context: {\n                            name: name,\n                            value: radio.value,\n                            state: state,\n                            disabled: disabled || radio.disabled,\n                            ariaLabel: radio.ariaLabel,\n                            ariaLabelledBy: radio.ariaLabelledBy,\n                            ariaDescribedBy: radio.ariaDescribedBy,\n                            title: radio.title\n                        }\n                    \"\n                ></ng-container>\n            </div>\n        </ng-container>\n    </ng-container>\n    <ng-container *ngIf=\"list\">\n        <ng-container *ngTemplateOutlet=\"listvalues\"></ng-container>\n    </ng-container>\n</fd-form-group>\n\n<ng-template #listvalues>\n    <ng-container *ngIf=\"hasNoValue\">\n        <div fd-form-item>\n            <fdp-radio-button [name]=\"name\" value=\"None\" [state]=\"state\" [disabled]=\"disabled\" [forceRender]=\"true\">\n                {{ noValueLabel }}\n            </fdp-radio-button>\n        </div>\n    </ng-container>\n    <ng-container *ngFor=\"let item of list\">\n        <div fd-form-item>\n            <fdp-radio-button\n                [name]=\"name\"\n                [value]=\"lookupValue(item)\"\n                [state]=\"state\"\n                [disabled]=\"_getListItemDisabledValue(item)\"\n                [forceRender]=\"true\"\n            >\n                {{ getDisplayValue(item) }}\n            </fdp-radio-button>\n        </div>\n    </ng-container>\n</ng-template>\n" }]
+            args: [{ selector: 'fdp-radio-group', changeDetection: ChangeDetectionStrategy.OnPush, encapsulation: ViewEncapsulation.None, providers: [{ provide: FD_FORM_FIELD_CONTROL, useExisting: forwardRef(() => RadioGroupComponent), multi: true }], standalone: true, imports: [FormGroupModule, NgIf, NgFor, FormItemModule, NgTemplateOutlet, RadioButtonComponent], template: "<fd-form-group\n    [isInline]=\"isInline\"\n    role=\"radiogroup\"\n    [attr.aria-label]=\"ariaLabel\"\n    [attr.aria-labelledby]=\"ariaLabelledBy\"\n    [attr.aria-orientation]=\"isInline ? 'horizontal' : 'vertical'\"\n    [attr.aria-required]=\"required\"\n>\n    <ng-container *ngIf=\"!list\">\n        <ng-container *ngFor=\"let radio of contentRadioButtons\">\n            <div fd-form-item>\n                <ng-container\n                    *ngTemplateOutlet=\"\n                        radio?.renderer || null;\n                        context: {\n                            name: name,\n                            value: radio.value,\n                            state: state,\n                            disabled: disabled || radio.disabled,\n                            ariaLabel: radio.ariaLabel,\n                            ariaLabelledBy: radio.ariaLabelledBy,\n                            ariaDescribedBy: radio.ariaDescribedBy,\n                            title: radio.title\n                        }\n                    \"\n                ></ng-container>\n            </div>\n        </ng-container>\n    </ng-container>\n    <ng-container *ngIf=\"list\">\n        <ng-container *ngTemplateOutlet=\"listvalues\"></ng-container>\n    </ng-container>\n</fd-form-group>\n\n<ng-template #listvalues>\n    <ng-container *ngIf=\"hasNoValue\">\n        <div fd-form-item>\n            <fdp-radio-button [name]=\"name\" value=\"None\" [state]=\"state\" [disabled]=\"disabled\" [forceRender]=\"true\">\n                {{ noValueLabel }}\n            </fdp-radio-button>\n        </div>\n    </ng-container>\n    <ng-container *ngFor=\"let item of list\">\n        <div fd-form-item>\n            <fdp-radio-button\n                [name]=\"name\"\n                [value]=\"lookupValue(item)\"\n                [state]=\"state\"\n                [disabled]=\"_getListItemDisabledValue(item)\"\n                [forceRender]=\"true\"\n            >\n                {{ getDisplayValue(item) }}\n            </fdp-radio-button>\n        </div>\n    </ng-container>\n</ng-template>\n" }]
         }], ctorParameters: function () { return [{ type: i0.ChangeDetectorRef }, { type: i0.ElementRef }, { type: i1.ResponsiveBreakpointsService }, { type: i1$1.NgControl, decorators: [{
                     type: Optional
                 }, {
@@ -2071,35 +2102,14 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.1.0", ngImpor
 
 class PlatformRadioGroupModule {
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.1.0", ngImport: i0, type: PlatformRadioGroupModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
-    static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "16.1.0", ngImport: i0, type: PlatformRadioGroupModule, declarations: [RadioGroupComponent, RadioButtonComponent], imports: [CommonModule,
-            FormModule,
-            FormsModule,
-            RadioModule,
-            ReactiveFormsModule,
-            PipeModule,
-            ContentDensityModule], exports: [RadioGroupComponent, RadioButtonComponent, ContentDensityModule] }); }
-    static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "16.1.0", ngImport: i0, type: PlatformRadioGroupModule, imports: [CommonModule,
-            FormModule,
-            FormsModule,
-            RadioModule,
-            ReactiveFormsModule,
-            PipeModule,
-            ContentDensityModule, ContentDensityModule] }); }
+    static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "16.1.0", ngImport: i0, type: PlatformRadioGroupModule, imports: [RadioGroupComponent, RadioButtonComponent], exports: [RadioGroupComponent, RadioButtonComponent] }); }
+    static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "16.1.0", ngImport: i0, type: PlatformRadioGroupModule, imports: [RadioGroupComponent, RadioButtonComponent] }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.1.0", ngImport: i0, type: PlatformRadioGroupModule, decorators: [{
             type: NgModule,
             args: [{
-                    imports: [
-                        CommonModule,
-                        FormModule,
-                        FormsModule,
-                        RadioModule,
-                        ReactiveFormsModule,
-                        PipeModule,
-                        ContentDensityModule
-                    ],
-                    exports: [RadioGroupComponent, RadioButtonComponent, ContentDensityModule],
-                    declarations: [RadioGroupComponent, RadioButtonComponent]
+                    imports: [RadioGroupComponent, RadioButtonComponent],
+                    exports: [RadioGroupComponent, RadioButtonComponent]
                 }]
         }] });
 
@@ -2394,13 +2404,13 @@ class TextAreaComponent extends BaseInput {
         }
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.1.0", ngImport: i0, type: TextAreaComponent, deps: [{ token: i0.ChangeDetectorRef }, { token: i0.ElementRef }, { token: i1$1.NgControl, optional: true, self: true }, { token: i1$1.ControlContainer, optional: true, skipSelf: true }, { token: i1$1.NgForm, optional: true, skipSelf: true }, { token: FD_FORM_FIELD, host: true, optional: true, skipSelf: true }, { token: FD_FORM_FIELD_CONTROL, host: true, optional: true, skipSelf: true }, { token: TextAreaConfig }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.1.0", type: TextAreaComponent, selector: "fdp-textarea", inputs: { height: "height", growingMaxLines: "growingMaxLines", cols: "cols", wrapType: "wrapType", readonly: "readonly", maxLength: "maxLength", showExceededText: "showExceededText", growing: "growing", value: "value" }, host: { listeners: { "keyup": "handleBackPress($event)" } }, providers: [
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.1.0", type: TextAreaComponent, isStandalone: true, selector: "fdp-textarea", inputs: { height: "height", growingMaxLines: "growingMaxLines", cols: "cols", wrapType: "wrapType", readonly: "readonly", maxLength: "maxLength", showExceededText: "showExceededText", growing: "growing", value: "value" }, host: { listeners: { "keyup": "handleBackPress($event)" } }, providers: [
             {
                 provide: FD_FORM_FIELD_CONTROL,
                 useExisting: TextAreaComponent,
                 multi: true
             }
-        ], viewQueries: [{ propertyName: "_textareaCounter", first: true, predicate: ["counter"], descendants: true }], usesInheritance: true, ngImport: i0, template: "<textarea\n    #inputElementRef\n    fd-form-control\n    [disabled]=\"disabled\"\n    [attr.id]=\"id\"\n    [attr.aria-label]=\"ariaLabel\"\n    [attr.aria-labelledby]=\"ariaLabelledBy\"\n    [attr.aria-describedby]=\"id + '-counter'\"\n    [attr.aria-required]=\"required\"\n    [attr.placeholder]=\"placeholder\"\n    [attr.rows]=\"growing ? 2 : height ? 2 : growingMaxLines\"\n    [attr.cols]=\"cols\"\n    [attr.wrap]=\"wrapType\"\n    [attr.maxlength]=\"!showExceededText ? maxLength : null\"\n    [attr.readonly]=\"readonly ? true : null\"\n    [(ngModel)]=\"value\"\n    [state]=\"getUpdatedState()\"\n    (paste)=\"handlePasteInteraction()\"\n    (blur)=\"_onFocusChanged(false)\"\n    (focus)=\"_onFocusChanged(true)\"\n></textarea>\n\n<!-- ICU recommends full text in format -->\n<div\n    class=\"fd-textarea-counter\"\n    *ngIf=\"showExceededText\"\n    aria-live=\"polite\"\n    aria-atomic=\"true\"\n    [attr.id]=\"id + '-counter'\"\n    #counter\n>\n    <!-- render spaces instead of the actual value while translation string is loading in order to avoid content jumps -->\n    <ng-container *ngIf=\"counterExcessOrRemaining === 'excess'; else charactersRemaining\">\n        <span\n            [innerHtml]=\"\n                (exceededCharCount === 1\n                    ? 'platformTextarea.counterMessageCharactersOverTheLimitSingular'\n                    : 'platformTextarea.counterMessageCharactersOverTheLimitPlural'\n                ) | fdTranslate : { count: exceededCharCount } : '&nbsp;&nbsp;'\n            \"\n        ></span>\n    </ng-container>\n    <ng-template #charactersRemaining>\n        <span\n            [innerHtml]=\"\n                (exceededCharCount === 1\n                    ? 'platformTextarea.counterMessageCharactersRemainingSingular'\n                    : 'platformTextarea.counterMessageCharactersRemainingPlural'\n                ) | fdTranslate : { count: exceededCharCount } : '&nbsp;&nbsp;'\n            \"\n        ></span>\n    </ng-template>\n</div>\n", styles: [".fd-textarea-counter{display:inline-block;width:100%}\n"], dependencies: [{ kind: "directive", type: i3.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1$1.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i1$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$1.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "component", type: i4.FormControlComponent, selector: "[fd-form-control]", inputs: ["state", "type", "class", "ariaLabel", "ariaLabelledBy"] }, { kind: "directive", type: i4.TextareaFormControlDirective, selector: "textarea[fd-form-control]" }, { kind: "pipe", type: i5$1.FdTranslatePipe, name: "fdTranslate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
+        ], viewQueries: [{ propertyName: "_textareaCounter", first: true, predicate: ["counter"], descendants: true }], usesInheritance: true, ngImport: i0, template: "<textarea\n    #inputElementRef\n    fd-form-control\n    [disabled]=\"disabled\"\n    [attr.id]=\"id\"\n    [attr.aria-label]=\"ariaLabel\"\n    [attr.aria-labelledby]=\"ariaLabelledBy\"\n    [attr.aria-describedby]=\"id + '-counter'\"\n    [attr.aria-required]=\"required\"\n    [attr.placeholder]=\"placeholder\"\n    [attr.rows]=\"growing ? 2 : height ? 2 : growingMaxLines\"\n    [attr.cols]=\"cols\"\n    [attr.wrap]=\"wrapType\"\n    [attr.maxlength]=\"!showExceededText ? maxLength : null\"\n    [attr.readonly]=\"readonly ? true : null\"\n    [(ngModel)]=\"value\"\n    [state]=\"getUpdatedState()\"\n    (paste)=\"handlePasteInteraction()\"\n    (blur)=\"_onFocusChanged(false)\"\n    (focus)=\"_onFocusChanged(true)\"\n></textarea>\n\n<!-- ICU recommends full text in format -->\n<div\n    class=\"fd-textarea-counter\"\n    *ngIf=\"showExceededText\"\n    aria-live=\"polite\"\n    aria-atomic=\"true\"\n    [attr.id]=\"id + '-counter'\"\n    #counter\n>\n    <!-- render spaces instead of the actual value while translation string is loading in order to avoid content jumps -->\n    <ng-container *ngIf=\"counterExcessOrRemaining === 'excess'; else charactersRemaining\">\n        <span\n            [innerHtml]=\"\n                (exceededCharCount === 1\n                    ? 'platformTextarea.counterMessageCharactersOverTheLimitSingular'\n                    : 'platformTextarea.counterMessageCharactersOverTheLimitPlural'\n                ) | fdTranslate : { count: exceededCharCount } : '&nbsp;&nbsp;'\n            \"\n        ></span>\n    </ng-container>\n    <ng-template #charactersRemaining>\n        <span\n            [innerHtml]=\"\n                (exceededCharCount === 1\n                    ? 'platformTextarea.counterMessageCharactersRemainingSingular'\n                    : 'platformTextarea.counterMessageCharactersRemainingPlural'\n                ) | fdTranslate : { count: exceededCharCount } : '&nbsp;&nbsp;'\n            \"\n        ></span>\n    </ng-template>\n</div>\n", styles: [".fd-textarea-counter{display:inline-block;width:100%}\n"], dependencies: [{ kind: "ngmodule", type: FormControlModule }, { kind: "component", type: i3.FormControlComponent, selector: "[fd-form-control]", inputs: ["state", "type", "class", "ariaLabel", "ariaLabelledBy"] }, { kind: "directive", type: i3.TextareaFormControlDirective, selector: "textarea[fd-form-control]" }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1$1.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i1$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$1.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "directive", type: NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "pipe", type: FdTranslatePipe, name: "fdTranslate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.1.0", ngImport: i0, type: TextAreaComponent, decorators: [{
             type: Component,
@@ -2410,7 +2420,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.1.0", ngImpor
                             useExisting: TextAreaComponent,
                             multi: true
                         }
-                    ], template: "<textarea\n    #inputElementRef\n    fd-form-control\n    [disabled]=\"disabled\"\n    [attr.id]=\"id\"\n    [attr.aria-label]=\"ariaLabel\"\n    [attr.aria-labelledby]=\"ariaLabelledBy\"\n    [attr.aria-describedby]=\"id + '-counter'\"\n    [attr.aria-required]=\"required\"\n    [attr.placeholder]=\"placeholder\"\n    [attr.rows]=\"growing ? 2 : height ? 2 : growingMaxLines\"\n    [attr.cols]=\"cols\"\n    [attr.wrap]=\"wrapType\"\n    [attr.maxlength]=\"!showExceededText ? maxLength : null\"\n    [attr.readonly]=\"readonly ? true : null\"\n    [(ngModel)]=\"value\"\n    [state]=\"getUpdatedState()\"\n    (paste)=\"handlePasteInteraction()\"\n    (blur)=\"_onFocusChanged(false)\"\n    (focus)=\"_onFocusChanged(true)\"\n></textarea>\n\n<!-- ICU recommends full text in format -->\n<div\n    class=\"fd-textarea-counter\"\n    *ngIf=\"showExceededText\"\n    aria-live=\"polite\"\n    aria-atomic=\"true\"\n    [attr.id]=\"id + '-counter'\"\n    #counter\n>\n    <!-- render spaces instead of the actual value while translation string is loading in order to avoid content jumps -->\n    <ng-container *ngIf=\"counterExcessOrRemaining === 'excess'; else charactersRemaining\">\n        <span\n            [innerHtml]=\"\n                (exceededCharCount === 1\n                    ? 'platformTextarea.counterMessageCharactersOverTheLimitSingular'\n                    : 'platformTextarea.counterMessageCharactersOverTheLimitPlural'\n                ) | fdTranslate : { count: exceededCharCount } : '&nbsp;&nbsp;'\n            \"\n        ></span>\n    </ng-container>\n    <ng-template #charactersRemaining>\n        <span\n            [innerHtml]=\"\n                (exceededCharCount === 1\n                    ? 'platformTextarea.counterMessageCharactersRemainingSingular'\n                    : 'platformTextarea.counterMessageCharactersRemainingPlural'\n                ) | fdTranslate : { count: exceededCharCount } : '&nbsp;&nbsp;'\n            \"\n        ></span>\n    </ng-template>\n</div>\n", styles: [".fd-textarea-counter{display:inline-block;width:100%}\n"] }]
+                    ], standalone: true, imports: [FormControlModule, FormsModule, NgIf, FdTranslatePipe], template: "<textarea\n    #inputElementRef\n    fd-form-control\n    [disabled]=\"disabled\"\n    [attr.id]=\"id\"\n    [attr.aria-label]=\"ariaLabel\"\n    [attr.aria-labelledby]=\"ariaLabelledBy\"\n    [attr.aria-describedby]=\"id + '-counter'\"\n    [attr.aria-required]=\"required\"\n    [attr.placeholder]=\"placeholder\"\n    [attr.rows]=\"growing ? 2 : height ? 2 : growingMaxLines\"\n    [attr.cols]=\"cols\"\n    [attr.wrap]=\"wrapType\"\n    [attr.maxlength]=\"!showExceededText ? maxLength : null\"\n    [attr.readonly]=\"readonly ? true : null\"\n    [(ngModel)]=\"value\"\n    [state]=\"getUpdatedState()\"\n    (paste)=\"handlePasteInteraction()\"\n    (blur)=\"_onFocusChanged(false)\"\n    (focus)=\"_onFocusChanged(true)\"\n></textarea>\n\n<!-- ICU recommends full text in format -->\n<div\n    class=\"fd-textarea-counter\"\n    *ngIf=\"showExceededText\"\n    aria-live=\"polite\"\n    aria-atomic=\"true\"\n    [attr.id]=\"id + '-counter'\"\n    #counter\n>\n    <!-- render spaces instead of the actual value while translation string is loading in order to avoid content jumps -->\n    <ng-container *ngIf=\"counterExcessOrRemaining === 'excess'; else charactersRemaining\">\n        <span\n            [innerHtml]=\"\n                (exceededCharCount === 1\n                    ? 'platformTextarea.counterMessageCharactersOverTheLimitSingular'\n                    : 'platformTextarea.counterMessageCharactersOverTheLimitPlural'\n                ) | fdTranslate : { count: exceededCharCount } : '&nbsp;&nbsp;'\n            \"\n        ></span>\n    </ng-container>\n    <ng-template #charactersRemaining>\n        <span\n            [innerHtml]=\"\n                (exceededCharCount === 1\n                    ? 'platformTextarea.counterMessageCharactersRemainingSingular'\n                    : 'platformTextarea.counterMessageCharactersRemainingPlural'\n                ) | fdTranslate : { count: exceededCharCount } : '&nbsp;&nbsp;'\n            \"\n        ></span>\n    </ng-template>\n</div>\n", styles: [".fd-textarea-counter{display:inline-block;width:100%}\n"] }]
         }], ctorParameters: function () { return [{ type: i0.ChangeDetectorRef }, { type: i0.ElementRef }, { type: i1$1.NgControl, decorators: [{
                     type: Optional
                 }, {
@@ -2469,35 +2479,14 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.1.0", ngImpor
 
 class PlatformTextAreaModule {
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.1.0", ngImport: i0, type: PlatformTextAreaModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
-    static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "16.1.0", ngImport: i0, type: PlatformTextAreaModule, declarations: [TextAreaComponent], imports: [CommonModule,
-            FormsModule,
-            ReactiveFormsModule,
-            FormControlModule,
-            PipeModule,
-            ContentDensityModule,
-            I18nModule], exports: [TextAreaComponent, ContentDensityModule] }); }
-    static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "16.1.0", ngImport: i0, type: PlatformTextAreaModule, imports: [CommonModule,
-            FormsModule,
-            ReactiveFormsModule,
-            FormControlModule,
-            PipeModule,
-            ContentDensityModule,
-            I18nModule, ContentDensityModule] }); }
+    static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "16.1.0", ngImport: i0, type: PlatformTextAreaModule, imports: [TextAreaComponent], exports: [TextAreaComponent] }); }
+    static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "16.1.0", ngImport: i0, type: PlatformTextAreaModule, imports: [TextAreaComponent] }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.1.0", ngImport: i0, type: PlatformTextAreaModule, decorators: [{
             type: NgModule,
             args: [{
-                    imports: [
-                        CommonModule,
-                        FormsModule,
-                        ReactiveFormsModule,
-                        FormControlModule,
-                        PipeModule,
-                        ContentDensityModule,
-                        I18nModule
-                    ],
-                    exports: [TextAreaComponent, ContentDensityModule],
-                    declarations: [TextAreaComponent]
+                    imports: [TextAreaComponent],
+                    exports: [TextAreaComponent]
                 }]
         }] });
 
@@ -2985,6 +2974,13 @@ class SelectComponent extends BaseSelect {
         this.setValue(value);
     }
     /** @hidden */
+    _onOpenChange(isOpen) {
+        if (isOpen) {
+            this.formMessage._popover.close();
+        }
+        this.formMessage._popover.setIgnoreTriggers(isOpen);
+    }
+    /** @hidden */
     _setColumnsRatio(firstColumnRatio, secondColumnRatio) {
         const totalProportions = firstColumnRatio + secondColumnRatio;
         const firstColumnProportion = Math.round((firstColumnRatio / totalProportions) * 100);
@@ -3002,12 +2998,12 @@ class SelectComponent extends BaseSelect {
     _setOptionAttribute(element, proportion) {
         element.setAttribute('style', 'width: ' + proportion + '%; max-width: ' + proportion + '%');
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.1.0", ngImport: i0, type: SelectComponent, deps: [{ token: i0.ChangeDetectorRef }, { token: i0.ElementRef }, { token: i1$1.NgControl, optional: true, self: true }, { token: i1$1.ControlContainer, optional: true, skipSelf: true }, { token: i1$1.NgForm, optional: true, self: true }, { token: i3$2.DynamicComponentService }, { token: SelectConfig }, { token: FD_FORM_FIELD, host: true, optional: true, skipSelf: true }, { token: FD_FORM_FIELD_CONTROL, host: true, optional: true, skipSelf: true }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.1.0", type: SelectComponent, selector: "fdp-select", inputs: { value: "value", inline: "inline" }, providers: [{ provide: FD_FORM_FIELD_CONTROL, useExisting: SelectComponent, multi: true }], viewQueries: [{ propertyName: "select", first: true, predicate: SelectComponent$1, descendants: true, static: true }], usesInheritance: true, ngImport: i0, template: "<fd-select\n    [placeholder]=\"placeholder\"\n    [glyph]=\"glyph\"\n    [disabled]=\"disabled\"\n    [readonly]=\"readonly\"\n    [closeOnOutsideClick]=\"closeOnOutsideClick\"\n    [controlTemplate]=\"controlTemplate\"\n    [appendTo]=\"appendTo\"\n    [fillControlMode]=\"fillControlMode\"\n    [maxHeight]=\"maxHeight\"\n    [attr.aria-disabled]=\"disabled || readonly\"\n    [attr.aria-labelledby]=\"value\"\n    [attr.tooltip]=\"value\"\n    [attr.aria-readonly]=\"readonly\"\n    [attr.role]=\"'listbox'\"\n    [value]=\"value\"\n    [state]=\"state\"\n    [stateMessage]=\"stateMessage\"\n    [mobile]=\"mobile\"\n    [mobileConfig]=\"mobileConfig\"\n    [inline]=\"inline\"\n    [(ngModel)]=\"value\"\n    (valueChange)=\"_onSelection($event)\"\n>\n    <ng-content></ng-content>\n    <li fd-option *ngIf=\"noValueLabel\" [disabled]=\"false\" [value]=\"null\">\n        {{ noValueLabel }}\n    </li>\n    <li\n        fd-option\n        *ngFor=\"let item of _optionItems; index as index\"\n        [disabled]=\"!!item.disabled\"\n        [value]=\"item.value\"\n        [attr.aria-labelledby]=\"ariaLabel\"\n        [attr.aria-disabled]=\"disabled\"\n    >\n        <fd-icon *ngIf=\"item.icon\" [glyph]=\"item.icon\" class=\"fd-template-icon icon-margin\"></fd-icon>\n        <ng-container\n            [ngTemplateOutlet]=\"listItem\"\n            [ngTemplateOutletContext]=\"{ optionItem: item, index: index }\"\n        ></ng-container>\n        <ng-container\n            secondary\n            [ngTemplateOutlet]=\"secondaryTextSource\"\n            [ngTemplateOutletContext]=\"{ optionItem: item }\"\n        ></ng-container>\n    </li>\n</fd-select>\n\n<ng-template let-optionItem=\"optionItem\" let-index=\"index\" #listItem>\n    <ng-container\n        *ngIf=\"_isSelectedOptionItem(optionItem) && !!_selectedItemTemplate\"\n        [ngTemplateOutlet]=\"_selectedItemTemplate\"\n        [ngTemplateOutletContext]=\"{ $implicit: optionItem.value, index: index }\"\n    ></ng-container>\n\n    <ng-container *ngIf=\"!(_isSelectedOptionItem(optionItem) && _selectedItemTemplate)\">\n        <ng-container\n            [ngTemplateOutlet]=\"optionItemSource\"\n            [ngTemplateOutletContext]=\"{ optionItem: optionItem, index: index }\"\n        ></ng-container>\n    </ng-container>\n</ng-template>\n\n<ng-template let-optionItem=\"optionItem\" let-index=\"index\" #optionItemSource>\n    <ng-container *ngIf=\"!_optionItemTemplate\">\n        <span [innerHTML]=\"optionItem.label\"></span>\n    </ng-container>\n\n    <ng-container *ngIf=\"_optionItemTemplate\">\n        <ng-container\n            [ngTemplateOutlet]=\"_optionItemTemplate\"\n            [ngTemplateOutletContext]=\"{ $implicit: optionItem.value, index: index }\"\n        ></ng-container>\n    </ng-container>\n</ng-template>\n\n<ng-template let-optionItem=\"optionItem\" #secondaryTextSource>\n    <ng-container *ngIf=\"showSecondaryText\">\n        <ng-container *ngIf=\"!_secondaryItemTemplate\">\n            <span\n                [style.text-align]=\"secondaryTextAlignment\"\n                fd-list-secondary\n                [innerHTML]=\"optionItem.secondaryText\"\n            ></span>\n        </ng-container>\n\n        <ng-container *ngIf=\"_secondaryItemTemplate\">\n            <ng-container\n                [ngTemplateOutlet]=\"_secondaryItemTemplate\"\n                [ngTemplateOutletContext]=\"{ $implicit: optionItem.value }\"\n            ></ng-container>\n        </ng-container>\n    </ng-container>\n</ng-template>\n", styles: ["/*!\n * Fundamental Library Styles v0.30.2-rc.6\n * Copyright (c) 2023 SAP SE or an SAP affiliate company.\n * Licensed under Apache License 2.0 (https://github.com/SAP/fundamental-styles/blob/main/LICENSE)\n */.fd-select{-webkit-box-sizing:border-box;border:0;box-sizing:border-box;color:var(--sapTextColor);font-family:var(--sapFontFamily);font-size:var(--sapFontSize);font-weight:400;forced-color-adjust:none;line-height:var(--sapContent_LineHeight);margin:.25rem 0;padding:0;text-shadow:var(--fdSelect_Text_Shadow)}.fd-select:after,.fd-select:before{box-sizing:inherit;font-size:inherit}.fd-select__control{-webkit-box-sizing:border-box;-webkit-box-shadow:var(--sapField_Shadow);-moz-appearance:none;-webkit-appearance:none;-webkit-box-shadow:none;-webkit-box-pack:center;-ms-flex-pack:center;-webkit-box-align:center;-ms-flex-align:center;-webkit-box-pack:justify;-ms-flex-pack:justify;align-items:center;appearance:none;background:var(--fdSelect_Background, var(--sapField_BackgroundStyle));background-color:var(--fdSelect_Background_Color, var(--sapField_Background));border:0;border:var(--sapField_BorderWidth) var(--sapField_BorderStyle) var(--sapField_BorderColor);border-radius:var(--sapField_BorderCornerRadius);box-shadow:var(--sapField_Shadow);box-shadow:none;box-sizing:border-box;color:var(--sapTextColor);color:var(--sapField_TextColor);cursor:text;cursor:pointer;display:flex;font-family:var(--sapFontFamily);font-size:var(--sapFontSize);font-weight:400;forced-color-adjust:none;gap:.25rem;height:var(--sapElement_Height);justify-content:center;justify-content:space-between;line-height:var(--sapContent_LineHeight);margin:0;min-height:var(--sapElement_Height);min-width:var(--fdSelect_Min_Width, 2.75rem);outline:none;overflow:hidden;padding:0;text-overflow:ellipsis;text-shadow:var(--fdInput_Text_Shadow);white-space:nowrap;width:100%;z-index:1}.fd-select__control:after,.fd-select__control:before{box-sizing:inherit;font-size:inherit}.fd-select__control::placeholder{color:var(--sapField_PlaceholderTextColor);font-style:var(--fdPlaceholder_Font_Style)}.fd-select__control[dir=rtl]::placeholder,[dir=rtl] .fd-select__control::placeholder{text-indent:.125rem}.fd-select__control::selection{background-color:var(--sapSelectedColor);color:var(--sapContent_ContrastTextColor)}.fd-select__control::-ms-clear{display:none}.fd-select__control.is-hover,.fd-select__control:hover{-webkit-box-shadow:var(--fdInput_Box_Shadow_Hover);background:var(--fdSelect_Hover_Background, var(--sapField_Hover_BackgroundStyle));background-color:var(--fdSelect_Hover_Background_Color, var(--sapField_Hover_Background));border-color:var(--sapField_Hover_BorderColor);box-shadow:var(--fdInput_Box_Shadow_Hover)}.fd-select__control.is-focus,.fd-select__control:focus{-webkit-box-shadow:none;background:var(--fdSelect_Focus_Background, var(--sapField_Focus_Background));box-shadow:none;outline-color:var(--fdInput_Outline_Color);outline-offset:var(--fdInput_Outline_Offset);outline-style:var(--sapContent_FocusStyle);outline-width:var(--sapContent_FocusWidth);z-index:5}.fd-select__control.is-success{-webkit-box-shadow:var(--sapField_SuccessShadow);background:var(--sapField_SuccessBackgroundStyle);background-color:var(--sapField_SuccessBackground);border:var(--sapField_SuccessColor) var(--sapField_SuccessBorderWidth) var(--sapField_SuccessBorderStyle);box-shadow:var(--sapField_SuccessShadow)}.fd-select__control.is-success.is-hover,.fd-select__control.is-success:hover{-webkit-box-shadow:var(--fdInput_Success_Box_Shadow_Hover);background-color:var(--fdInput_Success_Background_Color_Hover);border-color:var(--sapField_SuccessColor);box-shadow:var(--fdInput_Success_Box_Shadow_Hover)}.fd-select__control.is-success.is-focus,.fd-select__control.is-success:focus{background:var(--sapField_Focus_Background);outline-color:var(--fdInput_Success_Outline_Color)}.fd-select__control.is-success.is-focus.is-hover,.fd-select__control.is-success.is-focus:hover,.fd-select__control.is-success:focus.is-hover,.fd-select__control.is-success:focus:hover{box-shadow:none}.fd-select__control.is-success.is-expanded,.fd-select__control.is-success[aria-expanded=true]{-webkit-box-shadow:none;background:var(--sapField_Focus_Background);box-shadow:none;outline:var(--sapContent_FocusWidth) var(--sapContent_FocusStyle) var(--fdInput_Success_Outline_Color);outline-offset:var(--fdInput_Outline_Offset)}.fd-select__control.is-error{-webkit-box-shadow:var(--sapField_InvalidShadow);background:var(--sapField_InvalidBackgroundStyle);background-color:var(--sapField_InvalidBackground);border:var(--sapField_InvalidColor) var(--sapField_InvalidBorderWidth) var(--sapField_InvalidBorderStyle);box-shadow:var(--sapField_InvalidShadow)}.fd-select__control.is-error.is-hover,.fd-select__control.is-error:hover{-webkit-box-shadow:var(--fdInput_Error_Box_Shadow_Hover);background-color:var(--fdInput_Error_Background_Color_Hover);border-color:var(--sapField_InvalidColor);box-shadow:var(--fdInput_Error_Box_Shadow_Hover)}.fd-select__control.is-error.is-focus,.fd-select__control.is-error:focus{background:var(--sapField_Focus_Background);outline-color:var(--fdInput_Error_Outline_Color)}.fd-select__control.is-error.is-focus.is-hover,.fd-select__control.is-error.is-focus:hover,.fd-select__control.is-error:focus.is-hover,.fd-select__control.is-error:focus:hover{box-shadow:none}.fd-select__control.is-error.is-expanded,.fd-select__control.is-error[aria-expanded=true]{-webkit-box-shadow:none;background:var(--sapField_Focus_Background);box-shadow:none;outline:var(--sapContent_FocusWidth) var(--sapContent_FocusStyle) var(--fdInput_Error_Outline_Color);outline-offset:var(--fdInput_Outline_Offset)}.fd-select__control.is-warning{-webkit-box-shadow:var(--sapField_WarningShadow);background:var(--sapField_WarningBackgroundStyle);background-color:var(--sapField_WarningBackground);border:var(--sapField_WarningColor) var(--sapField_WarningBorderWidth) var(--sapField_WarningBorderStyle);box-shadow:var(--sapField_WarningShadow)}.fd-select__control.is-warning.is-hover,.fd-select__control.is-warning:hover{-webkit-box-shadow:var(--fdInput_Warning_Box_Shadow_Hover);background-color:var(--fdInput_Warning_Background_Color_Hover);border-color:var(--sapField_WarningColor);box-shadow:var(--fdInput_Warning_Box_Shadow_Hover)}.fd-select__control.is-warning.is-focus,.fd-select__control.is-warning:focus{background:var(--sapField_Focus_Background);outline-color:var(--fdInput_Warning_Outline_Color)}.fd-select__control.is-warning.is-focus.is-hover,.fd-select__control.is-warning.is-focus:hover,.fd-select__control.is-warning:focus.is-hover,.fd-select__control.is-warning:focus:hover{box-shadow:none}.fd-select__control.is-warning.is-expanded,.fd-select__control.is-warning[aria-expanded=true]{-webkit-box-shadow:none;background:var(--sapField_Focus_Background);box-shadow:none;outline:var(--sapContent_FocusWidth) var(--sapContent_FocusStyle) var(--fdInput_Warning_Outline_Color);outline-offset:var(--fdInput_Outline_Offset)}.fd-select__control.is-alert{background:var(--sapField_WarningBackgroundStyle);background-color:var(--sapField_WarningBackground);border:var(--sapField_WarningColor) var(--sapField_WarningBorderWidth) var(--sapField_WarningBorderStyle)}.fd-select__control.is-alert.is-hover,.fd-select__control.is-alert:hover{-webkit-box-shadow:var(--fdInput_Warning_Box_Shadow_Hover);background-color:var(--fdInput_Warning_Background_Color_Hover);border-color:var(--sapField_WarningColor);box-shadow:var(--fdInput_Warning_Box_Shadow_Hover)}.fd-select__control.is-alert.is-focus,.fd-select__control.is-alert:focus{background:var(--sapField_Focus_Background);outline-color:var(--fdInput_Warning_Outline_Color)}.fd-select__control.is-alert.is-focus.is-hover,.fd-select__control.is-alert.is-focus:hover,.fd-select__control.is-alert:focus.is-hover,.fd-select__control.is-alert:focus:hover{box-shadow:none}.fd-select__control.is-alert.is-expanded,.fd-select__control.is-alert[aria-expanded=true]{-webkit-box-shadow:none;background:var(--sapField_Focus_Background);box-shadow:none;outline:var(--sapContent_FocusWidth) var(--sapContent_FocusStyle) var(--fdInput_Warning_Outline_Color);outline-offset:var(--fdInput_Outline_Offset)}.fd-select__control.is-information{-webkit-box-shadow:var(--sapField_InformationShadow);background:var(--sapField_InformationBackgroundStyle);background-color:var(--sapField_InformationBackground);border:var(--sapField_InformationColor) var(--sapField_InformationBorderWidth) var(--sapField_InformationBorderStyle);box-shadow:var(--sapField_InformationShadow)}.fd-select__control.is-information.is-hover,.fd-select__control.is-information:hover{-webkit-box-shadow:var(--fdInput_Information_Box_Shadow_Hover);background-color:var(--fdInput_Information_Background_Color_Hover);border-color:var(--sapField_InformationColor);box-shadow:var(--fdInput_Information_Box_Shadow_Hover)}.fd-select__control.is-information.is-focus,.fd-select__control.is-information:focus{background:var(--sapField_Focus_Background);outline-color:var(--fdInput_Information_Outline_Color)}.fd-select__control.is-information.is-focus.is-hover,.fd-select__control.is-information.is-focus:hover,.fd-select__control.is-information:focus.is-hover,.fd-select__control.is-information:focus:hover{box-shadow:none}.fd-select__control.is-information.is-expanded,.fd-select__control.is-information[aria-expanded=true]{-webkit-box-shadow:none;background:var(--sapField_Focus_Background);box-shadow:none;outline:var(--sapContent_FocusWidth) var(--sapContent_FocusStyle) var(--fdInput_Information_Outline_Color);outline-offset:var(--fdInput_Outline_Offset)}.fd-select__control.is-alert,.fd-select__control.is-error,.fd-select__control.is-warning{font-style:var(--fdInput_State_Text_Style);font-weight:var(--fdInput_State_Font_Weight)}.fd-select__control.is-alert::placeholder,.fd-select__control.is-error::placeholder,.fd-select__control.is-warning::placeholder{font-weight:var(--fdInput_State_Font_Weight)}.fd-select__control.is-alert.is-focus,.fd-select__control.is-alert:focus,.fd-select__control.is-error.is-focus,.fd-select__control.is-error:focus,.fd-select__control.is-information.is-focus,.fd-select__control.is-information:focus,.fd-select__control.is-warning.is-focus,.fd-select__control.is-warning:focus{outline-offset:var(--fdInput_Outline_Offset_States);z-index:5}.fd-select__control.is-error::placeholder{color:var(--sapField_TextColor)}.fd-select__control.is-disabled,.fd-select__control:disabled,.fd-select__control[aria-disabled=true]{opacity:var(--sapContent_DisabledOpacity)}.fd-select__control.is-disabled::placeholder,.fd-select__control:disabled::placeholder,.fd-select__control[aria-disabled=true]::placeholder{color:var(--fdInput_Non_Interactive_State_Placeholder_Color)}.fd-select__control.is-readonly,.fd-select__control[aria-readonly=true],.fd-select__control[readonly]{-webkit-box-shadow:none;background:var(--sapField_ReadOnly_BackgroundStyle);background-color:var(--sapField_ReadOnly_Background);border-color:var(--sapField_ReadOnly_BorderColor);box-shadow:none}.fd-select__control.is-readonly::placeholder,.fd-select__control[aria-readonly=true]::placeholder,.fd-select__control[readonly]::placeholder{color:var(--fdInput_Non_Interactive_State_Placeholder_Color)}.fd-select__control.is-readonly.is-hover,.fd-select__control.is-readonly:hover,.fd-select__control[aria-readonly=true].is-hover,.fd-select__control[aria-readonly=true]:hover,.fd-select__control[readonly].is-hover,.fd-select__control[readonly]:hover{-webkit-box-shadow:none;background:var(--sapField_ReadOnly_BackgroundStyle);background-color:var(--sapField_ReadOnly_Background);border-color:var(--sapField_ReadOnly_BorderColor);box-shadow:none}.fd-select__control.is-readonly.is-focus,.fd-select__control.is-readonly:focus,.fd-select__control[aria-readonly=true].is-focus,.fd-select__control[aria-readonly=true]:focus,.fd-select__control[readonly].is-focus,.fd-select__control[readonly]:focus{-webkit-box-shadow:none;background:var(--sapField_ReadOnly_BackgroundStyle);background-color:var(--sapField_ReadOnly_Background);border-color:var(--sapField_ReadOnly_BorderColor);box-shadow:none;z-index:5}.fd-select__control .fd-select__button:first-child{border-right:var(--fdInputGroup_ControlButton_SideBorder)}.fd-select__control .fd-select__button:first-child[dir=rtl],[dir=rtl] .fd-select__control .fd-select__button:first-child{border-left:var(--fdInputGroup_ControlButton_SideBorder);border-right-style:none}.fd-select__control .fd-select__button:first-child.is-hover,.fd-select__control .fd-select__button:first-child:hover{border-right:var(--fdInputGroup_ControlButton_SideBorder_Active)}.fd-select__control .fd-select__button:first-child.is-hover[dir=rtl],.fd-select__control .fd-select__button:first-child:hover[dir=rtl],[dir=rtl] .fd-select__control .fd-select__button:first-child.is-hover,[dir=rtl] .fd-select__control .fd-select__button:first-child:hover{border-left:var(--fdInputGroup_ControlButton_SideBorder_Active);border-right-style:none}.fd-select__control .fd-select__button:first-child.is-active,.fd-select__control .fd-select__button:first-child:active{border-right:var(--fdInputGroup_ControlButton_SideBorder_Active)}.fd-select__control .fd-select__button:first-child.is-active[dir=rtl],.fd-select__control .fd-select__button:first-child:active[dir=rtl],[dir=rtl] .fd-select__control .fd-select__button:first-child.is-active,[dir=rtl] .fd-select__control .fd-select__button:first-child:active{border-left:var(--fdInputGroup_ControlButton_SideBorder_Active);border-right-style:none}.fd-select__control .fd-select__button:not(:first-child){border-left:var(--fdInputGroup_ControlButton_SideBorder)}.fd-select__control .fd-select__button:not(:first-child)[dir=rtl],[dir=rtl] .fd-select__control .fd-select__button:not(:first-child){border-left-style:none;border-right:var(--fdInputGroup_ControlButton_SideBorder)}.fd-select__control .fd-select__button:not(:first-child).is-hover,.fd-select__control .fd-select__button:not(:first-child):hover{border-left:var(--fdInputGroup_ControlButton_SideBorder_Active)}.fd-select__control .fd-select__button:not(:first-child).is-hover[dir=rtl],.fd-select__control .fd-select__button:not(:first-child):hover[dir=rtl],[dir=rtl] .fd-select__control .fd-select__button:not(:first-child).is-hover,[dir=rtl] .fd-select__control .fd-select__button:not(:first-child):hover{border-left-style:none;border-right:var(--fdInputGroup_ControlButton_SideBorder_Active)}.fd-select__control .fd-select__button:not(:first-child).is-active,.fd-select__control .fd-select__button:not(:first-child):active{border-left:var(--fdInputGroup_ControlButton_SideBorder_Active)}.fd-select__control .fd-select__button:not(:first-child).is-active[dir=rtl],.fd-select__control .fd-select__button:not(:first-child):active[dir=rtl],[dir=rtl] .fd-select__control .fd-select__button:not(:first-child).is-active,[dir=rtl] .fd-select__control .fd-select__button:not(:first-child):active{border-left-style:none;border-right:var(--fdInputGroup_ControlButton_SideBorder_Active)}.fd-select__control .fd-select__addon:first-child .fd-select__button{border-right:var(--fdInputGroup_ControlButton_SideBorder)}.fd-select__control .fd-select__addon:first-child .fd-select__button[dir=rtl],[dir=rtl] .fd-select__control .fd-select__addon:first-child .fd-select__button{border-left:var(--fdInputGroup_ControlButton_SideBorder);border-right-style:none}.fd-select__control .fd-select__addon:first-child .fd-select__button.is-hover,.fd-select__control .fd-select__addon:first-child .fd-select__button:hover{border-right:var(--fdInputGroup_ControlButton_SideBorder_Active)}.fd-select__control .fd-select__addon:first-child .fd-select__button.is-hover[dir=rtl],.fd-select__control .fd-select__addon:first-child .fd-select__button:hover[dir=rtl],[dir=rtl] .fd-select__control .fd-select__addon:first-child .fd-select__button.is-hover,[dir=rtl] .fd-select__control .fd-select__addon:first-child .fd-select__button:hover{border-left:var(--fdInputGroup_ControlButton_SideBorder_Active);border-right-style:none}.fd-select__control .fd-select__addon:first-child .fd-select__button.is-active,.fd-select__control .fd-select__addon:first-child .fd-select__button:active{border-right:var(--fdInputGroup_ControlButton_SideBorder_Active)}.fd-select__control .fd-select__addon:first-child .fd-select__button.is-active[dir=rtl],.fd-select__control .fd-select__addon:first-child .fd-select__button:active[dir=rtl],[dir=rtl] .fd-select__control .fd-select__addon:first-child .fd-select__button.is-active,[dir=rtl] .fd-select__control .fd-select__addon:first-child .fd-select__button:active{border-left:var(--fdInputGroup_ControlButton_SideBorder_Active);border-right-style:none}.fd-select__control .fd-select__addon:not(:first-child) .fd-select__button{border-left:var(--fdInputGroup_ControlButton_SideBorder)}.fd-select__control .fd-select__addon:not(:first-child) .fd-select__button[dir=rtl],[dir=rtl] .fd-select__control .fd-select__addon:not(:first-child) .fd-select__button{border-left-style:none;border-right:var(--fdInputGroup_ControlButton_SideBorder)}.fd-select__control .fd-select__addon:not(:first-child) .fd-select__button.is-hover,.fd-select__control .fd-select__addon:not(:first-child) .fd-select__button:hover{border-left:var(--fdInputGroup_ControlButton_SideBorder_Active)}.fd-select__control .fd-select__addon:not(:first-child) .fd-select__button.is-hover[dir=rtl],.fd-select__control .fd-select__addon:not(:first-child) .fd-select__button:hover[dir=rtl],[dir=rtl] .fd-select__control .fd-select__addon:not(:first-child) .fd-select__button.is-hover,[dir=rtl] .fd-select__control .fd-select__addon:not(:first-child) .fd-select__button:hover{border-left-style:none;border-right:var(--fdInputGroup_ControlButton_SideBorder_Active)}.fd-select__control .fd-select__addon:not(:first-child) .fd-select__button.is-active,.fd-select__control .fd-select__addon:not(:first-child) .fd-select__button:active{border-left:var(--fdInputGroup_ControlButton_SideBorder_Active)}.fd-select__control .fd-select__addon:not(:first-child) .fd-select__button.is-active[dir=rtl],.fd-select__control .fd-select__addon:not(:first-child) .fd-select__button:active[dir=rtl],[dir=rtl] .fd-select__control .fd-select__addon:not(:first-child) .fd-select__button.is-active,[dir=rtl] .fd-select__control .fd-select__addon:not(:first-child) .fd-select__button:active{border-left-style:none;border-right:var(--fdInputGroup_ControlButton_SideBorder_Active)}.fd-select__control .fd-select__button{background:var(--fdInput_Group_Button_Background);background-color:var(--fdButtonBackgroundColor);border:none;border-radius:var(--fdInput_Group_Button_Border_Raduis);color:var(--fdInput_Group_Button_Text_Color);overflow:hidden;position:relative;text-overflow:ellipsis;white-space:nowrap;z-index:auto!important}.fd-select__control .fd-select__button:before{display:none!important}.fd-select__control .fd-select__button:after{border-radius:var(--fdInput_Outline_Border_Radius)}.fd-select__control .fd-select__button.is-hover,.fd-select__control .fd-select__button:hover{--fdInput_Group_Button_Text_Color:var(--fdInput_Group_Button_Hover_Text_Color);--fdButtonBackgroundColor:var(--fdInput_Group_Button_Hover_Background);box-shadow:var(--fdInput_Group_Button_Box_Shadow)}.fd-select__control .fd-select__button.is-active,.fd-select__control .fd-select__button:active{-webkit-box-shadow:var(--fdInput_Group_Button_Box_Shadow);background:var(--fdInput_Group_Button_Active_Background);box-shadow:var(--fdInput_Group_Button_Box_Shadow);color:var(--fdInput_Group_Button_Active_Text_Color)}.fd-select__control.is-success.is-focus,.fd-select__control.is-success:focus{z-index:5}.fd-select__control.is-success.is-focus .fd-select__button,.fd-select__control.is-success:focus .fd-select__button{-webkit-box-shadow:var(--fdInput_Group_Button_Success_Active_Box_Shadow);--fdButtonBackgroundColor:var(--fdInput_Group_Button_Active_Background);box-shadow:var(--fdInput_Group_Button_Success_Active_Box_Shadow);color:var(--fdInput_Group_Button_Success_Active_Text_Color)}.fd-select__control.is-success.is-focus .fd-select__button.is-hover,.fd-select__control.is-success.is-focus .fd-select__button:hover,.fd-select__control.is-success:focus .fd-select__button.is-hover,.fd-select__control.is-success:focus .fd-select__button:hover{--fdButtonBackgroundColor:var(--fdInput_Group_Button_Active_Background)}.fd-select__control.is-success.is-expanded .fd-select__button,.fd-select__control.is-success[aria-expanded=true] .fd-select__button{-webkit-box-shadow:var(--fdInput_Group_Button_Success_Active_Box_Shadow);--fdButtonBackgroundColor:var(--fdInput_Group_Button_Active_Background);box-shadow:var(--fdInput_Group_Button_Success_Active_Box_Shadow);color:var(--fdInput_Group_Button_Success_Active_Text_Color)}.fd-select__control.is-success.is-expanded .fd-select__button.is-hover,.fd-select__control.is-success.is-expanded .fd-select__button:hover,.fd-select__control.is-success[aria-expanded=true] .fd-select__button.is-hover,.fd-select__control.is-success[aria-expanded=true] .fd-select__button:hover{--fdButtonBackgroundColor:var(--fdInput_Group_Button_Active_Background)}.fd-select__control.is-success .fd-select__button.is-active,.fd-select__control.is-success .fd-select__button.is-hover,.fd-select__control.is-success .fd-select__button:active,.fd-select__control.is-success .fd-select__button:hover{box-shadow:var(--fdInput_Group_Button_Success_Active_Box_Shadow)}.fd-select__control.is-success .fd-select__button.is-active,.fd-select__control.is-success .fd-select__button:active{color:var(--fdInput_Group_Button_Success_Active_Text_Color)}.fd-select__control.is-error.is-focus,.fd-select__control.is-error:focus{z-index:5}.fd-select__control.is-error.is-focus .fd-select__button,.fd-select__control.is-error:focus .fd-select__button{-webkit-box-shadow:var(--fdInput_Group_Button_Error_Active_Box_Shadow);--fdButtonBackgroundColor:var(--fdInput_Group_Button_Active_Background);box-shadow:var(--fdInput_Group_Button_Error_Active_Box_Shadow);color:var(--fdInput_Group_Button_Error_Active_Text_Color)}.fd-select__control.is-error.is-focus .fd-select__button.is-hover,.fd-select__control.is-error.is-focus .fd-select__button:hover,.fd-select__control.is-error:focus .fd-select__button.is-hover,.fd-select__control.is-error:focus .fd-select__button:hover{--fdButtonBackgroundColor:var(--fdInput_Group_Button_Active_Background)}.fd-select__control.is-error.is-expanded .fd-select__button,.fd-select__control.is-error[aria-expanded=true] .fd-select__button{-webkit-box-shadow:var(--fdInput_Group_Button_Error_Active_Box_Shadow);--fdButtonBackgroundColor:var(--fdInput_Group_Button_Active_Background);box-shadow:var(--fdInput_Group_Button_Error_Active_Box_Shadow);color:var(--fdInput_Group_Button_Error_Active_Text_Color)}.fd-select__control.is-error.is-expanded .fd-select__button.is-hover,.fd-select__control.is-error.is-expanded .fd-select__button:hover,.fd-select__control.is-error[aria-expanded=true] .fd-select__button.is-hover,.fd-select__control.is-error[aria-expanded=true] .fd-select__button:hover{--fdButtonBackgroundColor:var(--fdInput_Group_Button_Active_Background)}.fd-select__control.is-error .fd-select__button.is-active,.fd-select__control.is-error .fd-select__button.is-hover,.fd-select__control.is-error .fd-select__button:active,.fd-select__control.is-error .fd-select__button:hover{box-shadow:var(--fdInput_Group_Button_Error_Active_Box_Shadow)}.fd-select__control.is-error .fd-select__button.is-active,.fd-select__control.is-error .fd-select__button:active{color:var(--fdInput_Group_Button_Error_Active_Text_Color)}.fd-select__control.is-warning.is-focus,.fd-select__control.is-warning:focus{z-index:5}.fd-select__control.is-warning.is-focus .fd-select__button,.fd-select__control.is-warning:focus .fd-select__button{-webkit-box-shadow:var(--fdInput_Group_Button_Warning_Active_Box_Shadow);--fdButtonBackgroundColor:var(--fdInput_Group_Button_Active_Background);box-shadow:var(--fdInput_Group_Button_Warning_Active_Box_Shadow);color:var(--fdInput_Group_Button_Warning_Active_Text_Color)}.fd-select__control.is-warning.is-focus .fd-select__button.is-hover,.fd-select__control.is-warning.is-focus .fd-select__button:hover,.fd-select__control.is-warning:focus .fd-select__button.is-hover,.fd-select__control.is-warning:focus .fd-select__button:hover{--fdButtonBackgroundColor:var(--fdInput_Group_Button_Active_Background)}.fd-select__control.is-warning.is-expanded .fd-select__button,.fd-select__control.is-warning[aria-expanded=true] .fd-select__button{-webkit-box-shadow:var(--fdInput_Group_Button_Warning_Active_Box_Shadow);--fdButtonBackgroundColor:var(--fdInput_Group_Button_Active_Background);box-shadow:var(--fdInput_Group_Button_Warning_Active_Box_Shadow);color:var(--fdInput_Group_Button_Warning_Active_Text_Color)}.fd-select__control.is-warning.is-expanded .fd-select__button.is-hover,.fd-select__control.is-warning.is-expanded .fd-select__button:hover,.fd-select__control.is-warning[aria-expanded=true] .fd-select__button.is-hover,.fd-select__control.is-warning[aria-expanded=true] .fd-select__button:hover{--fdButtonBackgroundColor:var(--fdInput_Group_Button_Active_Background)}.fd-select__control.is-warning .fd-select__button.is-active,.fd-select__control.is-warning .fd-select__button.is-hover,.fd-select__control.is-warning .fd-select__button:active,.fd-select__control.is-warning .fd-select__button:hover{box-shadow:var(--fdInput_Group_Button_Warning_Active_Box_Shadow)}.fd-select__control.is-warning .fd-select__button.is-active,.fd-select__control.is-warning .fd-select__button:active{color:var(--fdInput_Group_Button_Warning_Active_Text_Color)}.fd-select__control.is-alert.is-focus,.fd-select__control.is-alert:focus{z-index:5}.fd-select__control.is-alert.is-focus .fd-select__button,.fd-select__control.is-alert:focus .fd-select__button{-webkit-box-shadow:var(--fdInput_Group_Button_Warning_Active_Box_Shadow);--fdButtonBackgroundColor:var(--fdInput_Group_Button_Active_Background);box-shadow:var(--fdInput_Group_Button_Warning_Active_Box_Shadow);color:var(--fdInput_Group_Button_Warning_Active_Text_Color)}.fd-select__control.is-alert.is-focus .fd-select__button.is-hover,.fd-select__control.is-alert.is-focus .fd-select__button:hover,.fd-select__control.is-alert:focus .fd-select__button.is-hover,.fd-select__control.is-alert:focus .fd-select__button:hover{--fdButtonBackgroundColor:var(--fdInput_Group_Button_Active_Background)}.fd-select__control.is-alert.is-expanded .fd-select__button,.fd-select__control.is-alert[aria-expanded=true] .fd-select__button{-webkit-box-shadow:var(--fdInput_Group_Button_Warning_Active_Box_Shadow);--fdButtonBackgroundColor:var(--fdInput_Group_Button_Active_Background);box-shadow:var(--fdInput_Group_Button_Warning_Active_Box_Shadow);color:var(--fdInput_Group_Button_Warning_Active_Text_Color)}.fd-select__control.is-alert.is-expanded .fd-select__button.is-hover,.fd-select__control.is-alert.is-expanded .fd-select__button:hover,.fd-select__control.is-alert[aria-expanded=true] .fd-select__button.is-hover,.fd-select__control.is-alert[aria-expanded=true] .fd-select__button:hover{--fdButtonBackgroundColor:var(--fdInput_Group_Button_Active_Background)}.fd-select__control.is-alert .fd-select__button.is-active,.fd-select__control.is-alert .fd-select__button.is-hover,.fd-select__control.is-alert .fd-select__button:active,.fd-select__control.is-alert .fd-select__button:hover{box-shadow:var(--fdInput_Group_Button_Warning_Active_Box_Shadow)}.fd-select__control.is-alert .fd-select__button.is-active,.fd-select__control.is-alert .fd-select__button:active{color:var(--fdInput_Group_Button_Warning_Active_Text_Color)}.fd-select__control.is-information.is-focus,.fd-select__control.is-information:focus{z-index:5}.fd-select__control.is-information.is-focus .fd-select__button,.fd-select__control.is-information:focus .fd-select__button{-webkit-box-shadow:var(--fdInput_Group_Button_Information_Active_Box_Shadow);--fdButtonBackgroundColor:var(--fdInput_Group_Button_Active_Background);box-shadow:var(--fdInput_Group_Button_Information_Active_Box_Shadow);color:var(--fdInput_Group_Button_Information_Active_Text_Color)}.fd-select__control.is-information.is-focus .fd-select__button.is-hover,.fd-select__control.is-information.is-focus .fd-select__button:hover,.fd-select__control.is-information:focus .fd-select__button.is-hover,.fd-select__control.is-information:focus .fd-select__button:hover{--fdButtonBackgroundColor:var(--fdInput_Group_Button_Active_Background)}.fd-select__control.is-information.is-expanded .fd-select__button,.fd-select__control.is-information[aria-expanded=true] .fd-select__button{-webkit-box-shadow:var(--fdInput_Group_Button_Information_Active_Box_Shadow);--fdButtonBackgroundColor:var(--fdInput_Group_Button_Active_Background);box-shadow:var(--fdInput_Group_Button_Information_Active_Box_Shadow);color:var(--fdInput_Group_Button_Information_Active_Text_Color)}.fd-select__control.is-information.is-expanded .fd-select__button.is-hover,.fd-select__control.is-information.is-expanded .fd-select__button:hover,.fd-select__control.is-information[aria-expanded=true] .fd-select__button.is-hover,.fd-select__control.is-information[aria-expanded=true] .fd-select__button:hover{--fdButtonBackgroundColor:var(--fdInput_Group_Button_Active_Background)}.fd-select__control.is-information .fd-select__button.is-active,.fd-select__control.is-information .fd-select__button.is-hover,.fd-select__control.is-information .fd-select__button:active,.fd-select__control.is-information .fd-select__button:hover{box-shadow:var(--fdInput_Group_Button_Information_Active_Box_Shadow)}.fd-select__control.is-information .fd-select__button.is-active,.fd-select__control.is-information .fd-select__button:active{color:var(--fdInput_Group_Button_Information_Active_Text_Color)}.fd-select__control.is-disabled,.fd-select__control:disabled,.fd-select__control[aria-disabled=true]{pointer-events:none}.fd-select__control:after{-webkit-box-shadow:var(--sapField_Shadow);border-radius:var(--sapField_BorderCornerRadius);box-shadow:var(--sapField_Shadow);content:\"\";inset:0;pointer-events:none;position:absolute}.fd-select__control.is-readonly,.fd-select__control[aria-readonly=true],.fd-select__control[readonly]{cursor:text}.fd-select__control.is-readonly .fd-select__text-content,.fd-select__control[aria-readonly=true] .fd-select__text-content,.fd-select__control[readonly] .fd-select__text-content{--fdSelect_Min_Width:5rem;padding-left:.625rem;padding-right:.625rem}.fd-select__control.is-readonly .fd-select__button,.fd-select__control[aria-readonly=true] .fd-select__button,.fd-select__control[readonly] .fd-select__button{opacity:0}.fd-select__control[aria-selected=false] .fd-select__text-content{padding:0 .625rem}.fd-select__control[aria-selected=false] .fd-select__text-content,.fd-select__control[aria-selected=false] .fd-select__text-content [class*=sap-icon]{color:var(--sapField_PlaceholderTextColor);font-style:italic;font-weight:400}.fd-select__text-content{-webkit-box-sizing:border-box;--fdSelect_Min_Width:2.5rem;border:0;box-sizing:border-box;color:var(--sapTextColor);color:var(--fdSelect_Text_Content_Color, var(--sapTextColor));cursor:pointer;display:var(--fdSelect_Text_Content_Display, inline-block);font-family:var(--sapFontFamily);font-size:var(--sapFontSize);font-weight:400;forced-color-adjust:none;line-height:var(--sapContent_LineHeight);margin:0;min-width:calc(var(--fdSelect_Min_Width) - var(--sapField_BorderWidth) * 2);overflow:hidden;padding:0 0 0 .625rem;text-overflow:ellipsis;white-space:nowrap}.fd-select__text-content:after,.fd-select__text-content:before{box-sizing:inherit;font-size:inherit}.fd-select__text-content[dir=rtl],[dir=rtl] .fd-select__text-content{padding-left:0;padding-right:.625rem}.fd-select[class*=-compact],.fd-select[class*=-condensed],[class*=-compact] .fd-select:not([class*=-cozy]),[class*=-condensed] .fd-select:not([class*=-cozy]){margin:.1875rem 0}.fd-select[class*=-compact] .fd-select__control,.fd-select[class*=-condensed] .fd-select__control,[class*=-compact] .fd-select:not([class*=-cozy]) .fd-select__control,[class*=-condensed] .fd-select:not([class*=-cozy]) .fd-select__control{height:1.625rem;min-height:1.625rem}.fd-select[class*=-compact] .fd-select__control .fd-select__text-content,.fd-select[class*=-condensed] .fd-select__control .fd-select__text-content,[class*=-compact] .fd-select:not([class*=-cozy]) .fd-select__control .fd-select__text-content,[class*=-condensed] .fd-select:not([class*=-cozy]) .fd-select__control .fd-select__text-content{--fdSelect_Min_Width:2.75rem;padding-left:.5rem}.fd-select[class*=-compact] .fd-select__control .fd-select__text-content[dir=rtl],.fd-select[class*=-condensed] .fd-select__control .fd-select__text-content[dir=rtl],[class*=-compact] .fd-select:not([class*=-cozy]) .fd-select__control .fd-select__text-content[dir=rtl],[class*=-condensed] .fd-select:not([class*=-cozy]) .fd-select__control .fd-select__text-content[dir=rtl],[dir=rtl] .fd-select[class*=-compact] .fd-select__control .fd-select__text-content,[dir=rtl] .fd-select[class*=-condensed] .fd-select__control .fd-select__text-content,[dir=rtl] [class*=-compact] .fd-select:not([class*=-cozy]) .fd-select__control .fd-select__text-content,[dir=rtl] [class*=-condensed] .fd-select:not([class*=-cozy]) .fd-select__control .fd-select__text-content{padding-left:0;padding-right:.5rem}.fd-select[class*=-compact] .fd-select__control.is-readonly .fd-select__text-content,.fd-select[class*=-compact] .fd-select__control[aria-readonly=true] .fd-select__text-content,.fd-select[class*=-compact] .fd-select__control[readonly] .fd-select__text-content,.fd-select[class*=-condensed] .fd-select__control.is-readonly .fd-select__text-content,.fd-select[class*=-condensed] .fd-select__control[aria-readonly=true] .fd-select__text-content,.fd-select[class*=-condensed] .fd-select__control[readonly] .fd-select__text-content,[class*=-compact] .fd-select:not([class*=-cozy]) .fd-select__control.is-readonly .fd-select__text-content,[class*=-compact] .fd-select:not([class*=-cozy]) .fd-select__control[aria-readonly=true] .fd-select__text-content,[class*=-compact] .fd-select:not([class*=-cozy]) .fd-select__control[readonly] .fd-select__text-content,[class*=-condensed] .fd-select:not([class*=-cozy]) .fd-select__control.is-readonly .fd-select__text-content,[class*=-condensed] .fd-select:not([class*=-cozy]) .fd-select__control[aria-readonly=true] .fd-select__text-content,[class*=-condensed] .fd-select:not([class*=-cozy]) .fd-select__control[readonly] .fd-select__text-content{padding-left:.5rem;padding-right:.5rem}@media (min-width: 600px){[dir=rtl] .fd-container.fd-form-layout-grid-container .fd-row .fd-col-md--10{text-align:right!important}}\n"], dependencies: [{ kind: "directive", type: i3.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i3.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i3.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: i1$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$1.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "directive", type: i7$1.ListSecondaryDirective, selector: "[fd-list-secondary], [fdListSecondary]", inputs: ["type"] }, { kind: "component", type: i6.IconComponent, selector: "fd-icon", inputs: ["glyph", "font", "class", "ariaLabel"] }, { kind: "component", type: i7$2.SelectComponent, selector: "fd-select", inputs: ["extendedBodyTemplate", "controlId", "state", "mobile", "stateMessage", "disabled", "required", "readonly", "placeholder", "value", "maxHeight", "glyph", "closeOnOutsideClick", "fillControlMode", "controlTemplate", "appendTo", "unselectMissingOption", "typeaheadDebounceInterval", "ariaLabelledBy", "ariaLabel", "mobileConfig", "inline", "selectControlClass", "selectDropdownButtonClass", "compareWith"], outputs: ["isOpenChange", "valueChange"] }, { kind: "component", type: i7$2.OptionComponent, selector: "[fd-option], fd-option", inputs: ["id", "value", "disabled"], outputs: ["selectionChange"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.1.0", ngImport: i0, type: SelectComponent, deps: [{ token: i0.ChangeDetectorRef }, { token: i0.ElementRef }, { token: i1$1.NgControl, optional: true, self: true }, { token: i1$1.ControlContainer, optional: true, skipSelf: true }, { token: i1$1.NgForm, optional: true, self: true }, { token: i3$1.DynamicComponentService }, { token: SelectConfig }, { token: FD_FORM_FIELD, host: true, optional: true, skipSelf: true }, { token: FD_FORM_FIELD_CONTROL, host: true, optional: true, skipSelf: true }], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.1.0", type: SelectComponent, isStandalone: true, selector: "fdp-select", inputs: { value: "value", inline: "inline" }, providers: [DynamicComponentService, { provide: FD_FORM_FIELD_CONTROL, useExisting: SelectComponent, multi: true }], viewQueries: [{ propertyName: "select", first: true, predicate: SelectComponent$1, descendants: true, static: true }], usesInheritance: true, ngImport: i0, template: "<fd-select\n    [placeholder]=\"placeholder\"\n    [glyph]=\"glyph\"\n    [disabled]=\"disabled\"\n    [readonly]=\"readonly\"\n    [closeOnOutsideClick]=\"closeOnOutsideClick\"\n    [controlTemplate]=\"controlTemplate\"\n    [appendTo]=\"appendTo\"\n    [fillControlMode]=\"fillControlMode\"\n    [maxHeight]=\"maxHeight\"\n    [attr.aria-disabled]=\"disabled || readonly\"\n    [attr.aria-labelledby]=\"value\"\n    [attr.tooltip]=\"value\"\n    [attr.aria-readonly]=\"readonly\"\n    [attr.role]=\"'listbox'\"\n    [value]=\"value\"\n    [state]=\"state\"\n    [stateMessage]=\"stateMessage\"\n    [advancedStateMessage]=\"advancedStateMessage\"\n    [mobile]=\"mobile\"\n    [mobileConfig]=\"mobileConfig\"\n    [inline]=\"inline\"\n    [(ngModel)]=\"value\"\n    (valueChange)=\"_onSelection($event)\"\n    (isOpenChange)=\"_onOpenChange($event)\"\n>\n    <ng-content></ng-content>\n    <li fd-option *ngIf=\"noValueLabel\" [disabled]=\"false\" [value]=\"null\">\n        {{ noValueLabel }}\n    </li>\n    <li\n        fd-option\n        *ngFor=\"let item of _optionItems; index as index\"\n        [disabled]=\"!!item.disabled\"\n        [value]=\"item.value\"\n        [attr.aria-labelledby]=\"ariaLabel\"\n        [attr.aria-disabled]=\"disabled\"\n    >\n        <fd-icon *ngIf=\"item.icon\" [glyph]=\"item.icon\" class=\"fd-template-icon icon-margin\"></fd-icon>\n        <ng-container\n            [ngTemplateOutlet]=\"listItem\"\n            [ngTemplateOutletContext]=\"{ optionItem: item, index: index }\"\n        ></ng-container>\n        <ng-container\n            secondary\n            [ngTemplateOutlet]=\"secondaryTextSource\"\n            [ngTemplateOutletContext]=\"{ optionItem: item }\"\n        ></ng-container>\n    </li>\n</fd-select>\n\n<ng-template let-optionItem=\"optionItem\" let-index=\"index\" #listItem>\n    <ng-container\n        *ngIf=\"_isSelectedOptionItem(optionItem) && !!_selectedItemTemplate\"\n        [ngTemplateOutlet]=\"_selectedItemTemplate\"\n        [ngTemplateOutletContext]=\"{ $implicit: optionItem.value, index: index }\"\n    ></ng-container>\n\n    <ng-container *ngIf=\"!(_isSelectedOptionItem(optionItem) && _selectedItemTemplate)\">\n        <ng-container\n            [ngTemplateOutlet]=\"optionItemSource\"\n            [ngTemplateOutletContext]=\"{ optionItem: optionItem, index: index }\"\n        ></ng-container>\n    </ng-container>\n</ng-template>\n\n<ng-template let-optionItem=\"optionItem\" let-index=\"index\" #optionItemSource>\n    <ng-container *ngIf=\"!_optionItemTemplate\">\n        <span [innerHTML]=\"optionItem.label\"></span>\n    </ng-container>\n\n    <ng-container *ngIf=\"_optionItemTemplate\">\n        <ng-container\n            [ngTemplateOutlet]=\"_optionItemTemplate\"\n            [ngTemplateOutletContext]=\"{ $implicit: optionItem.value, index: index }\"\n        ></ng-container>\n    </ng-container>\n</ng-template>\n\n<ng-template let-optionItem=\"optionItem\" #secondaryTextSource>\n    <ng-container *ngIf=\"showSecondaryText\">\n        <ng-container *ngIf=\"!_secondaryItemTemplate\">\n            <span\n                [style.text-align]=\"secondaryTextAlignment\"\n                fd-list-secondary\n                [innerHTML]=\"optionItem.secondaryText\"\n            ></span>\n        </ng-container>\n\n        <ng-container *ngIf=\"_secondaryItemTemplate\">\n            <ng-container\n                [ngTemplateOutlet]=\"_secondaryItemTemplate\"\n                [ngTemplateOutletContext]=\"{ $implicit: optionItem.value }\"\n            ></ng-container>\n        </ng-container>\n    </ng-container>\n</ng-template>\n", styles: ["/*!\n * Fundamental Library Styles v0.30.2-rc.6\n * Copyright (c) 2023 SAP SE or an SAP affiliate company.\n * Licensed under Apache License 2.0 (https://github.com/SAP/fundamental-styles/blob/main/LICENSE)\n */.fd-select{-webkit-box-sizing:border-box;border:0;box-sizing:border-box;color:var(--sapTextColor);font-family:var(--sapFontFamily);font-size:var(--sapFontSize);font-weight:400;forced-color-adjust:none;line-height:var(--sapContent_LineHeight);margin:.25rem 0;padding:0;text-shadow:var(--fdSelect_Text_Shadow)}.fd-select:after,.fd-select:before{box-sizing:inherit;font-size:inherit}.fd-select__control{-webkit-box-sizing:border-box;-webkit-box-shadow:var(--sapField_Shadow);-moz-appearance:none;-webkit-appearance:none;-webkit-box-shadow:none;-webkit-box-pack:center;-ms-flex-pack:center;-webkit-box-align:center;-ms-flex-align:center;-webkit-box-pack:justify;-ms-flex-pack:justify;align-items:center;appearance:none;background:var(--fdSelect_Background, var(--sapField_BackgroundStyle));background-color:var(--fdSelect_Background_Color, var(--sapField_Background));border:0;border:var(--sapField_BorderWidth) var(--sapField_BorderStyle) var(--sapField_BorderColor);border-radius:var(--sapField_BorderCornerRadius);box-shadow:var(--sapField_Shadow);box-shadow:none;box-sizing:border-box;color:var(--sapTextColor);color:var(--sapField_TextColor);cursor:text;cursor:pointer;display:flex;font-family:var(--sapFontFamily);font-size:var(--sapFontSize);font-weight:400;forced-color-adjust:none;gap:.25rem;height:var(--sapElement_Height);justify-content:center;justify-content:space-between;line-height:var(--sapContent_LineHeight);margin:0;min-height:var(--sapElement_Height);min-width:var(--fdSelect_Min_Width, 2.75rem);outline:none;overflow:hidden;padding:0;text-overflow:ellipsis;text-shadow:var(--fdInput_Text_Shadow);white-space:nowrap;width:100%;z-index:1}.fd-select__control:after,.fd-select__control:before{box-sizing:inherit;font-size:inherit}.fd-select__control::placeholder{color:var(--sapField_PlaceholderTextColor);font-style:var(--fdPlaceholder_Font_Style)}.fd-select__control[dir=rtl]::placeholder,[dir=rtl] .fd-select__control::placeholder{text-indent:.125rem}.fd-select__control::selection{background-color:var(--sapSelectedColor);color:var(--sapContent_ContrastTextColor)}.fd-select__control::-ms-clear{display:none}.fd-select__control.is-hover,.fd-select__control:hover{-webkit-box-shadow:var(--fdInput_Box_Shadow_Hover);background:var(--fdSelect_Hover_Background, var(--sapField_Hover_BackgroundStyle));background-color:var(--fdSelect_Hover_Background_Color, var(--sapField_Hover_Background));border-color:var(--sapField_Hover_BorderColor);box-shadow:var(--fdInput_Box_Shadow_Hover)}.fd-select__control.is-focus,.fd-select__control:focus{-webkit-box-shadow:none;background:var(--fdSelect_Focus_Background, var(--sapField_Focus_Background));box-shadow:none;outline-color:var(--fdInput_Outline_Color);outline-offset:var(--fdInput_Outline_Offset);outline-style:var(--sapContent_FocusStyle);outline-width:var(--sapContent_FocusWidth);z-index:5}.fd-select__control.is-success{-webkit-box-shadow:var(--sapField_SuccessShadow);background:var(--sapField_SuccessBackgroundStyle);background-color:var(--sapField_SuccessBackground);border:var(--sapField_SuccessColor) var(--sapField_SuccessBorderWidth) var(--sapField_SuccessBorderStyle);box-shadow:var(--sapField_SuccessShadow)}.fd-select__control.is-success.is-hover,.fd-select__control.is-success:hover{-webkit-box-shadow:var(--fdInput_Success_Box_Shadow_Hover);background-color:var(--fdInput_Success_Background_Color_Hover);border-color:var(--sapField_SuccessColor);box-shadow:var(--fdInput_Success_Box_Shadow_Hover)}.fd-select__control.is-success.is-focus,.fd-select__control.is-success:focus{background:var(--sapField_Focus_Background);outline-color:var(--fdInput_Success_Outline_Color)}.fd-select__control.is-success.is-focus.is-hover,.fd-select__control.is-success.is-focus:hover,.fd-select__control.is-success:focus.is-hover,.fd-select__control.is-success:focus:hover{box-shadow:none}.fd-select__control.is-success.is-expanded,.fd-select__control.is-success[aria-expanded=true]{-webkit-box-shadow:none;background:var(--sapField_Focus_Background);box-shadow:none;outline:var(--sapContent_FocusWidth) var(--sapContent_FocusStyle) var(--fdInput_Success_Outline_Color);outline-offset:var(--fdInput_Outline_Offset)}.fd-select__control.is-error{-webkit-box-shadow:var(--sapField_InvalidShadow);background:var(--sapField_InvalidBackgroundStyle);background-color:var(--sapField_InvalidBackground);border:var(--sapField_InvalidColor) var(--sapField_InvalidBorderWidth) var(--sapField_InvalidBorderStyle);box-shadow:var(--sapField_InvalidShadow)}.fd-select__control.is-error.is-hover,.fd-select__control.is-error:hover{-webkit-box-shadow:var(--fdInput_Error_Box_Shadow_Hover);background-color:var(--fdInput_Error_Background_Color_Hover);border-color:var(--sapField_InvalidColor);box-shadow:var(--fdInput_Error_Box_Shadow_Hover)}.fd-select__control.is-error.is-focus,.fd-select__control.is-error:focus{background:var(--sapField_Focus_Background);outline-color:var(--fdInput_Error_Outline_Color)}.fd-select__control.is-error.is-focus.is-hover,.fd-select__control.is-error.is-focus:hover,.fd-select__control.is-error:focus.is-hover,.fd-select__control.is-error:focus:hover{box-shadow:none}.fd-select__control.is-error.is-expanded,.fd-select__control.is-error[aria-expanded=true]{-webkit-box-shadow:none;background:var(--sapField_Focus_Background);box-shadow:none;outline:var(--sapContent_FocusWidth) var(--sapContent_FocusStyle) var(--fdInput_Error_Outline_Color);outline-offset:var(--fdInput_Outline_Offset)}.fd-select__control.is-warning{-webkit-box-shadow:var(--sapField_WarningShadow);background:var(--sapField_WarningBackgroundStyle);background-color:var(--sapField_WarningBackground);border:var(--sapField_WarningColor) var(--sapField_WarningBorderWidth) var(--sapField_WarningBorderStyle);box-shadow:var(--sapField_WarningShadow)}.fd-select__control.is-warning.is-hover,.fd-select__control.is-warning:hover{-webkit-box-shadow:var(--fdInput_Warning_Box_Shadow_Hover);background-color:var(--fdInput_Warning_Background_Color_Hover);border-color:var(--sapField_WarningColor);box-shadow:var(--fdInput_Warning_Box_Shadow_Hover)}.fd-select__control.is-warning.is-focus,.fd-select__control.is-warning:focus{background:var(--sapField_Focus_Background);outline-color:var(--fdInput_Warning_Outline_Color)}.fd-select__control.is-warning.is-focus.is-hover,.fd-select__control.is-warning.is-focus:hover,.fd-select__control.is-warning:focus.is-hover,.fd-select__control.is-warning:focus:hover{box-shadow:none}.fd-select__control.is-warning.is-expanded,.fd-select__control.is-warning[aria-expanded=true]{-webkit-box-shadow:none;background:var(--sapField_Focus_Background);box-shadow:none;outline:var(--sapContent_FocusWidth) var(--sapContent_FocusStyle) var(--fdInput_Warning_Outline_Color);outline-offset:var(--fdInput_Outline_Offset)}.fd-select__control.is-alert{background:var(--sapField_WarningBackgroundStyle);background-color:var(--sapField_WarningBackground);border:var(--sapField_WarningColor) var(--sapField_WarningBorderWidth) var(--sapField_WarningBorderStyle)}.fd-select__control.is-alert.is-hover,.fd-select__control.is-alert:hover{-webkit-box-shadow:var(--fdInput_Warning_Box_Shadow_Hover);background-color:var(--fdInput_Warning_Background_Color_Hover);border-color:var(--sapField_WarningColor);box-shadow:var(--fdInput_Warning_Box_Shadow_Hover)}.fd-select__control.is-alert.is-focus,.fd-select__control.is-alert:focus{background:var(--sapField_Focus_Background);outline-color:var(--fdInput_Warning_Outline_Color)}.fd-select__control.is-alert.is-focus.is-hover,.fd-select__control.is-alert.is-focus:hover,.fd-select__control.is-alert:focus.is-hover,.fd-select__control.is-alert:focus:hover{box-shadow:none}.fd-select__control.is-alert.is-expanded,.fd-select__control.is-alert[aria-expanded=true]{-webkit-box-shadow:none;background:var(--sapField_Focus_Background);box-shadow:none;outline:var(--sapContent_FocusWidth) var(--sapContent_FocusStyle) var(--fdInput_Warning_Outline_Color);outline-offset:var(--fdInput_Outline_Offset)}.fd-select__control.is-information{-webkit-box-shadow:var(--sapField_InformationShadow);background:var(--sapField_InformationBackgroundStyle);background-color:var(--sapField_InformationBackground);border:var(--sapField_InformationColor) var(--sapField_InformationBorderWidth) var(--sapField_InformationBorderStyle);box-shadow:var(--sapField_InformationShadow)}.fd-select__control.is-information.is-hover,.fd-select__control.is-information:hover{-webkit-box-shadow:var(--fdInput_Information_Box_Shadow_Hover);background-color:var(--fdInput_Information_Background_Color_Hover);border-color:var(--sapField_InformationColor);box-shadow:var(--fdInput_Information_Box_Shadow_Hover)}.fd-select__control.is-information.is-focus,.fd-select__control.is-information:focus{background:var(--sapField_Focus_Background);outline-color:var(--fdInput_Information_Outline_Color)}.fd-select__control.is-information.is-focus.is-hover,.fd-select__control.is-information.is-focus:hover,.fd-select__control.is-information:focus.is-hover,.fd-select__control.is-information:focus:hover{box-shadow:none}.fd-select__control.is-information.is-expanded,.fd-select__control.is-information[aria-expanded=true]{-webkit-box-shadow:none;background:var(--sapField_Focus_Background);box-shadow:none;outline:var(--sapContent_FocusWidth) var(--sapContent_FocusStyle) var(--fdInput_Information_Outline_Color);outline-offset:var(--fdInput_Outline_Offset)}.fd-select__control.is-alert,.fd-select__control.is-error,.fd-select__control.is-warning{font-style:var(--fdInput_State_Text_Style);font-weight:var(--fdInput_State_Font_Weight)}.fd-select__control.is-alert::placeholder,.fd-select__control.is-error::placeholder,.fd-select__control.is-warning::placeholder{font-weight:var(--fdInput_State_Font_Weight)}.fd-select__control.is-alert.is-focus,.fd-select__control.is-alert:focus,.fd-select__control.is-error.is-focus,.fd-select__control.is-error:focus,.fd-select__control.is-information.is-focus,.fd-select__control.is-information:focus,.fd-select__control.is-warning.is-focus,.fd-select__control.is-warning:focus{outline-offset:var(--fdInput_Outline_Offset_States);z-index:5}.fd-select__control.is-error::placeholder{color:var(--sapField_TextColor)}.fd-select__control.is-disabled,.fd-select__control:disabled,.fd-select__control[aria-disabled=true]{opacity:var(--sapContent_DisabledOpacity)}.fd-select__control.is-disabled::placeholder,.fd-select__control:disabled::placeholder,.fd-select__control[aria-disabled=true]::placeholder{color:var(--fdInput_Non_Interactive_State_Placeholder_Color)}.fd-select__control.is-readonly,.fd-select__control[aria-readonly=true],.fd-select__control[readonly]{-webkit-box-shadow:none;background:var(--sapField_ReadOnly_BackgroundStyle);background-color:var(--sapField_ReadOnly_Background);border-color:var(--sapField_ReadOnly_BorderColor);box-shadow:none}.fd-select__control.is-readonly::placeholder,.fd-select__control[aria-readonly=true]::placeholder,.fd-select__control[readonly]::placeholder{color:var(--fdInput_Non_Interactive_State_Placeholder_Color)}.fd-select__control.is-readonly.is-hover,.fd-select__control.is-readonly:hover,.fd-select__control[aria-readonly=true].is-hover,.fd-select__control[aria-readonly=true]:hover,.fd-select__control[readonly].is-hover,.fd-select__control[readonly]:hover{-webkit-box-shadow:none;background:var(--sapField_ReadOnly_BackgroundStyle);background-color:var(--sapField_ReadOnly_Background);border-color:var(--sapField_ReadOnly_BorderColor);box-shadow:none}.fd-select__control.is-readonly.is-focus,.fd-select__control.is-readonly:focus,.fd-select__control[aria-readonly=true].is-focus,.fd-select__control[aria-readonly=true]:focus,.fd-select__control[readonly].is-focus,.fd-select__control[readonly]:focus{-webkit-box-shadow:none;background:var(--sapField_ReadOnly_BackgroundStyle);background-color:var(--sapField_ReadOnly_Background);border-color:var(--sapField_ReadOnly_BorderColor);box-shadow:none;z-index:5}.fd-select__control .fd-select__button:first-child{border-right:var(--fdInputGroup_ControlButton_SideBorder)}.fd-select__control .fd-select__button:first-child[dir=rtl],[dir=rtl] .fd-select__control .fd-select__button:first-child{border-left:var(--fdInputGroup_ControlButton_SideBorder);border-right-style:none}.fd-select__control .fd-select__button:first-child.is-hover,.fd-select__control .fd-select__button:first-child:hover{border-right:var(--fdInputGroup_ControlButton_SideBorder_Active)}.fd-select__control .fd-select__button:first-child.is-hover[dir=rtl],.fd-select__control .fd-select__button:first-child:hover[dir=rtl],[dir=rtl] .fd-select__control .fd-select__button:first-child.is-hover,[dir=rtl] .fd-select__control .fd-select__button:first-child:hover{border-left:var(--fdInputGroup_ControlButton_SideBorder_Active);border-right-style:none}.fd-select__control .fd-select__button:first-child.is-active,.fd-select__control .fd-select__button:first-child:active{border-right:var(--fdInputGroup_ControlButton_SideBorder_Active)}.fd-select__control .fd-select__button:first-child.is-active[dir=rtl],.fd-select__control .fd-select__button:first-child:active[dir=rtl],[dir=rtl] .fd-select__control .fd-select__button:first-child.is-active,[dir=rtl] .fd-select__control .fd-select__button:first-child:active{border-left:var(--fdInputGroup_ControlButton_SideBorder_Active);border-right-style:none}.fd-select__control .fd-select__button:not(:first-child){border-left:var(--fdInputGroup_ControlButton_SideBorder)}.fd-select__control .fd-select__button:not(:first-child)[dir=rtl],[dir=rtl] .fd-select__control .fd-select__button:not(:first-child){border-left-style:none;border-right:var(--fdInputGroup_ControlButton_SideBorder)}.fd-select__control .fd-select__button:not(:first-child).is-hover,.fd-select__control .fd-select__button:not(:first-child):hover{border-left:var(--fdInputGroup_ControlButton_SideBorder_Active)}.fd-select__control .fd-select__button:not(:first-child).is-hover[dir=rtl],.fd-select__control .fd-select__button:not(:first-child):hover[dir=rtl],[dir=rtl] .fd-select__control .fd-select__button:not(:first-child).is-hover,[dir=rtl] .fd-select__control .fd-select__button:not(:first-child):hover{border-left-style:none;border-right:var(--fdInputGroup_ControlButton_SideBorder_Active)}.fd-select__control .fd-select__button:not(:first-child).is-active,.fd-select__control .fd-select__button:not(:first-child):active{border-left:var(--fdInputGroup_ControlButton_SideBorder_Active)}.fd-select__control .fd-select__button:not(:first-child).is-active[dir=rtl],.fd-select__control .fd-select__button:not(:first-child):active[dir=rtl],[dir=rtl] .fd-select__control .fd-select__button:not(:first-child).is-active,[dir=rtl] .fd-select__control .fd-select__button:not(:first-child):active{border-left-style:none;border-right:var(--fdInputGroup_ControlButton_SideBorder_Active)}.fd-select__control .fd-select__addon:first-child .fd-select__button{border-right:var(--fdInputGroup_ControlButton_SideBorder)}.fd-select__control .fd-select__addon:first-child .fd-select__button[dir=rtl],[dir=rtl] .fd-select__control .fd-select__addon:first-child .fd-select__button{border-left:var(--fdInputGroup_ControlButton_SideBorder);border-right-style:none}.fd-select__control .fd-select__addon:first-child .fd-select__button.is-hover,.fd-select__control .fd-select__addon:first-child .fd-select__button:hover{border-right:var(--fdInputGroup_ControlButton_SideBorder_Active)}.fd-select__control .fd-select__addon:first-child .fd-select__button.is-hover[dir=rtl],.fd-select__control .fd-select__addon:first-child .fd-select__button:hover[dir=rtl],[dir=rtl] .fd-select__control .fd-select__addon:first-child .fd-select__button.is-hover,[dir=rtl] .fd-select__control .fd-select__addon:first-child .fd-select__button:hover{border-left:var(--fdInputGroup_ControlButton_SideBorder_Active);border-right-style:none}.fd-select__control .fd-select__addon:first-child .fd-select__button.is-active,.fd-select__control .fd-select__addon:first-child .fd-select__button:active{border-right:var(--fdInputGroup_ControlButton_SideBorder_Active)}.fd-select__control .fd-select__addon:first-child .fd-select__button.is-active[dir=rtl],.fd-select__control .fd-select__addon:first-child .fd-select__button:active[dir=rtl],[dir=rtl] .fd-select__control .fd-select__addon:first-child .fd-select__button.is-active,[dir=rtl] .fd-select__control .fd-select__addon:first-child .fd-select__button:active{border-left:var(--fdInputGroup_ControlButton_SideBorder_Active);border-right-style:none}.fd-select__control .fd-select__addon:not(:first-child) .fd-select__button{border-left:var(--fdInputGroup_ControlButton_SideBorder)}.fd-select__control .fd-select__addon:not(:first-child) .fd-select__button[dir=rtl],[dir=rtl] .fd-select__control .fd-select__addon:not(:first-child) .fd-select__button{border-left-style:none;border-right:var(--fdInputGroup_ControlButton_SideBorder)}.fd-select__control .fd-select__addon:not(:first-child) .fd-select__button.is-hover,.fd-select__control .fd-select__addon:not(:first-child) .fd-select__button:hover{border-left:var(--fdInputGroup_ControlButton_SideBorder_Active)}.fd-select__control .fd-select__addon:not(:first-child) .fd-select__button.is-hover[dir=rtl],.fd-select__control .fd-select__addon:not(:first-child) .fd-select__button:hover[dir=rtl],[dir=rtl] .fd-select__control .fd-select__addon:not(:first-child) .fd-select__button.is-hover,[dir=rtl] .fd-select__control .fd-select__addon:not(:first-child) .fd-select__button:hover{border-left-style:none;border-right:var(--fdInputGroup_ControlButton_SideBorder_Active)}.fd-select__control .fd-select__addon:not(:first-child) .fd-select__button.is-active,.fd-select__control .fd-select__addon:not(:first-child) .fd-select__button:active{border-left:var(--fdInputGroup_ControlButton_SideBorder_Active)}.fd-select__control .fd-select__addon:not(:first-child) .fd-select__button.is-active[dir=rtl],.fd-select__control .fd-select__addon:not(:first-child) .fd-select__button:active[dir=rtl],[dir=rtl] .fd-select__control .fd-select__addon:not(:first-child) .fd-select__button.is-active,[dir=rtl] .fd-select__control .fd-select__addon:not(:first-child) .fd-select__button:active{border-left-style:none;border-right:var(--fdInputGroup_ControlButton_SideBorder_Active)}.fd-select__control .fd-select__button{background:var(--fdInput_Group_Button_Background);background-color:var(--fdButtonBackgroundColor);border:none;border-radius:var(--fdInput_Group_Button_Border_Raduis);color:var(--fdInput_Group_Button_Text_Color);overflow:hidden;position:relative;text-overflow:ellipsis;white-space:nowrap;z-index:auto!important}.fd-select__control .fd-select__button:before{display:none!important}.fd-select__control .fd-select__button:after{border-radius:var(--fdInput_Outline_Border_Radius)}.fd-select__control .fd-select__button.is-hover,.fd-select__control .fd-select__button:hover{--fdInput_Group_Button_Text_Color:var(--fdInput_Group_Button_Hover_Text_Color);--fdButtonBackgroundColor:var(--fdInput_Group_Button_Hover_Background);box-shadow:var(--fdInput_Group_Button_Box_Shadow)}.fd-select__control .fd-select__button.is-active,.fd-select__control .fd-select__button:active{-webkit-box-shadow:var(--fdInput_Group_Button_Box_Shadow);background:var(--fdInput_Group_Button_Active_Background);box-shadow:var(--fdInput_Group_Button_Box_Shadow);color:var(--fdInput_Group_Button_Active_Text_Color)}.fd-select__control.is-success.is-focus,.fd-select__control.is-success:focus{z-index:5}.fd-select__control.is-success.is-focus .fd-select__button,.fd-select__control.is-success:focus .fd-select__button{-webkit-box-shadow:var(--fdInput_Group_Button_Success_Active_Box_Shadow);--fdButtonBackgroundColor:var(--fdInput_Group_Button_Active_Background);box-shadow:var(--fdInput_Group_Button_Success_Active_Box_Shadow);color:var(--fdInput_Group_Button_Success_Active_Text_Color)}.fd-select__control.is-success.is-focus .fd-select__button.is-hover,.fd-select__control.is-success.is-focus .fd-select__button:hover,.fd-select__control.is-success:focus .fd-select__button.is-hover,.fd-select__control.is-success:focus .fd-select__button:hover{--fdButtonBackgroundColor:var(--fdInput_Group_Button_Active_Background)}.fd-select__control.is-success.is-expanded .fd-select__button,.fd-select__control.is-success[aria-expanded=true] .fd-select__button{-webkit-box-shadow:var(--fdInput_Group_Button_Success_Active_Box_Shadow);--fdButtonBackgroundColor:var(--fdInput_Group_Button_Active_Background);box-shadow:var(--fdInput_Group_Button_Success_Active_Box_Shadow);color:var(--fdInput_Group_Button_Success_Active_Text_Color)}.fd-select__control.is-success.is-expanded .fd-select__button.is-hover,.fd-select__control.is-success.is-expanded .fd-select__button:hover,.fd-select__control.is-success[aria-expanded=true] .fd-select__button.is-hover,.fd-select__control.is-success[aria-expanded=true] .fd-select__button:hover{--fdButtonBackgroundColor:var(--fdInput_Group_Button_Active_Background)}.fd-select__control.is-success .fd-select__button.is-active,.fd-select__control.is-success .fd-select__button.is-hover,.fd-select__control.is-success .fd-select__button:active,.fd-select__control.is-success .fd-select__button:hover{box-shadow:var(--fdInput_Group_Button_Success_Active_Box_Shadow)}.fd-select__control.is-success .fd-select__button.is-active,.fd-select__control.is-success .fd-select__button:active{color:var(--fdInput_Group_Button_Success_Active_Text_Color)}.fd-select__control.is-error.is-focus,.fd-select__control.is-error:focus{z-index:5}.fd-select__control.is-error.is-focus .fd-select__button,.fd-select__control.is-error:focus .fd-select__button{-webkit-box-shadow:var(--fdInput_Group_Button_Error_Active_Box_Shadow);--fdButtonBackgroundColor:var(--fdInput_Group_Button_Active_Background);box-shadow:var(--fdInput_Group_Button_Error_Active_Box_Shadow);color:var(--fdInput_Group_Button_Error_Active_Text_Color)}.fd-select__control.is-error.is-focus .fd-select__button.is-hover,.fd-select__control.is-error.is-focus .fd-select__button:hover,.fd-select__control.is-error:focus .fd-select__button.is-hover,.fd-select__control.is-error:focus .fd-select__button:hover{--fdButtonBackgroundColor:var(--fdInput_Group_Button_Active_Background)}.fd-select__control.is-error.is-expanded .fd-select__button,.fd-select__control.is-error[aria-expanded=true] .fd-select__button{-webkit-box-shadow:var(--fdInput_Group_Button_Error_Active_Box_Shadow);--fdButtonBackgroundColor:var(--fdInput_Group_Button_Active_Background);box-shadow:var(--fdInput_Group_Button_Error_Active_Box_Shadow);color:var(--fdInput_Group_Button_Error_Active_Text_Color)}.fd-select__control.is-error.is-expanded .fd-select__button.is-hover,.fd-select__control.is-error.is-expanded .fd-select__button:hover,.fd-select__control.is-error[aria-expanded=true] .fd-select__button.is-hover,.fd-select__control.is-error[aria-expanded=true] .fd-select__button:hover{--fdButtonBackgroundColor:var(--fdInput_Group_Button_Active_Background)}.fd-select__control.is-error .fd-select__button.is-active,.fd-select__control.is-error .fd-select__button.is-hover,.fd-select__control.is-error .fd-select__button:active,.fd-select__control.is-error .fd-select__button:hover{box-shadow:var(--fdInput_Group_Button_Error_Active_Box_Shadow)}.fd-select__control.is-error .fd-select__button.is-active,.fd-select__control.is-error .fd-select__button:active{color:var(--fdInput_Group_Button_Error_Active_Text_Color)}.fd-select__control.is-warning.is-focus,.fd-select__control.is-warning:focus{z-index:5}.fd-select__control.is-warning.is-focus .fd-select__button,.fd-select__control.is-warning:focus .fd-select__button{-webkit-box-shadow:var(--fdInput_Group_Button_Warning_Active_Box_Shadow);--fdButtonBackgroundColor:var(--fdInput_Group_Button_Active_Background);box-shadow:var(--fdInput_Group_Button_Warning_Active_Box_Shadow);color:var(--fdInput_Group_Button_Warning_Active_Text_Color)}.fd-select__control.is-warning.is-focus .fd-select__button.is-hover,.fd-select__control.is-warning.is-focus .fd-select__button:hover,.fd-select__control.is-warning:focus .fd-select__button.is-hover,.fd-select__control.is-warning:focus .fd-select__button:hover{--fdButtonBackgroundColor:var(--fdInput_Group_Button_Active_Background)}.fd-select__control.is-warning.is-expanded .fd-select__button,.fd-select__control.is-warning[aria-expanded=true] .fd-select__button{-webkit-box-shadow:var(--fdInput_Group_Button_Warning_Active_Box_Shadow);--fdButtonBackgroundColor:var(--fdInput_Group_Button_Active_Background);box-shadow:var(--fdInput_Group_Button_Warning_Active_Box_Shadow);color:var(--fdInput_Group_Button_Warning_Active_Text_Color)}.fd-select__control.is-warning.is-expanded .fd-select__button.is-hover,.fd-select__control.is-warning.is-expanded .fd-select__button:hover,.fd-select__control.is-warning[aria-expanded=true] .fd-select__button.is-hover,.fd-select__control.is-warning[aria-expanded=true] .fd-select__button:hover{--fdButtonBackgroundColor:var(--fdInput_Group_Button_Active_Background)}.fd-select__control.is-warning .fd-select__button.is-active,.fd-select__control.is-warning .fd-select__button.is-hover,.fd-select__control.is-warning .fd-select__button:active,.fd-select__control.is-warning .fd-select__button:hover{box-shadow:var(--fdInput_Group_Button_Warning_Active_Box_Shadow)}.fd-select__control.is-warning .fd-select__button.is-active,.fd-select__control.is-warning .fd-select__button:active{color:var(--fdInput_Group_Button_Warning_Active_Text_Color)}.fd-select__control.is-alert.is-focus,.fd-select__control.is-alert:focus{z-index:5}.fd-select__control.is-alert.is-focus .fd-select__button,.fd-select__control.is-alert:focus .fd-select__button{-webkit-box-shadow:var(--fdInput_Group_Button_Warning_Active_Box_Shadow);--fdButtonBackgroundColor:var(--fdInput_Group_Button_Active_Background);box-shadow:var(--fdInput_Group_Button_Warning_Active_Box_Shadow);color:var(--fdInput_Group_Button_Warning_Active_Text_Color)}.fd-select__control.is-alert.is-focus .fd-select__button.is-hover,.fd-select__control.is-alert.is-focus .fd-select__button:hover,.fd-select__control.is-alert:focus .fd-select__button.is-hover,.fd-select__control.is-alert:focus .fd-select__button:hover{--fdButtonBackgroundColor:var(--fdInput_Group_Button_Active_Background)}.fd-select__control.is-alert.is-expanded .fd-select__button,.fd-select__control.is-alert[aria-expanded=true] .fd-select__button{-webkit-box-shadow:var(--fdInput_Group_Button_Warning_Active_Box_Shadow);--fdButtonBackgroundColor:var(--fdInput_Group_Button_Active_Background);box-shadow:var(--fdInput_Group_Button_Warning_Active_Box_Shadow);color:var(--fdInput_Group_Button_Warning_Active_Text_Color)}.fd-select__control.is-alert.is-expanded .fd-select__button.is-hover,.fd-select__control.is-alert.is-expanded .fd-select__button:hover,.fd-select__control.is-alert[aria-expanded=true] .fd-select__button.is-hover,.fd-select__control.is-alert[aria-expanded=true] .fd-select__button:hover{--fdButtonBackgroundColor:var(--fdInput_Group_Button_Active_Background)}.fd-select__control.is-alert .fd-select__button.is-active,.fd-select__control.is-alert .fd-select__button.is-hover,.fd-select__control.is-alert .fd-select__button:active,.fd-select__control.is-alert .fd-select__button:hover{box-shadow:var(--fdInput_Group_Button_Warning_Active_Box_Shadow)}.fd-select__control.is-alert .fd-select__button.is-active,.fd-select__control.is-alert .fd-select__button:active{color:var(--fdInput_Group_Button_Warning_Active_Text_Color)}.fd-select__control.is-information.is-focus,.fd-select__control.is-information:focus{z-index:5}.fd-select__control.is-information.is-focus .fd-select__button,.fd-select__control.is-information:focus .fd-select__button{-webkit-box-shadow:var(--fdInput_Group_Button_Information_Active_Box_Shadow);--fdButtonBackgroundColor:var(--fdInput_Group_Button_Active_Background);box-shadow:var(--fdInput_Group_Button_Information_Active_Box_Shadow);color:var(--fdInput_Group_Button_Information_Active_Text_Color)}.fd-select__control.is-information.is-focus .fd-select__button.is-hover,.fd-select__control.is-information.is-focus .fd-select__button:hover,.fd-select__control.is-information:focus .fd-select__button.is-hover,.fd-select__control.is-information:focus .fd-select__button:hover{--fdButtonBackgroundColor:var(--fdInput_Group_Button_Active_Background)}.fd-select__control.is-information.is-expanded .fd-select__button,.fd-select__control.is-information[aria-expanded=true] .fd-select__button{-webkit-box-shadow:var(--fdInput_Group_Button_Information_Active_Box_Shadow);--fdButtonBackgroundColor:var(--fdInput_Group_Button_Active_Background);box-shadow:var(--fdInput_Group_Button_Information_Active_Box_Shadow);color:var(--fdInput_Group_Button_Information_Active_Text_Color)}.fd-select__control.is-information.is-expanded .fd-select__button.is-hover,.fd-select__control.is-information.is-expanded .fd-select__button:hover,.fd-select__control.is-information[aria-expanded=true] .fd-select__button.is-hover,.fd-select__control.is-information[aria-expanded=true] .fd-select__button:hover{--fdButtonBackgroundColor:var(--fdInput_Group_Button_Active_Background)}.fd-select__control.is-information .fd-select__button.is-active,.fd-select__control.is-information .fd-select__button.is-hover,.fd-select__control.is-information .fd-select__button:active,.fd-select__control.is-information .fd-select__button:hover{box-shadow:var(--fdInput_Group_Button_Information_Active_Box_Shadow)}.fd-select__control.is-information .fd-select__button.is-active,.fd-select__control.is-information .fd-select__button:active{color:var(--fdInput_Group_Button_Information_Active_Text_Color)}.fd-select__control.is-disabled,.fd-select__control:disabled,.fd-select__control[aria-disabled=true]{pointer-events:none}.fd-select__control:after{-webkit-box-shadow:var(--sapField_Shadow);border-radius:var(--sapField_BorderCornerRadius);box-shadow:var(--sapField_Shadow);content:\"\";inset:0;pointer-events:none;position:absolute}.fd-select__control.is-readonly,.fd-select__control[aria-readonly=true],.fd-select__control[readonly]{cursor:text}.fd-select__control.is-readonly .fd-select__text-content,.fd-select__control[aria-readonly=true] .fd-select__text-content,.fd-select__control[readonly] .fd-select__text-content{--fdSelect_Min_Width:5rem;padding-left:.625rem;padding-right:.625rem}.fd-select__control.is-readonly .fd-select__button,.fd-select__control[aria-readonly=true] .fd-select__button,.fd-select__control[readonly] .fd-select__button{opacity:0}.fd-select__control[aria-selected=false] .fd-select__text-content{padding:0 .625rem}.fd-select__control[aria-selected=false] .fd-select__text-content,.fd-select__control[aria-selected=false] .fd-select__text-content [class*=sap-icon]{color:var(--sapField_PlaceholderTextColor);font-style:italic;font-weight:400}.fd-select__text-content{-webkit-box-sizing:border-box;--fdSelect_Min_Width:2.5rem;border:0;box-sizing:border-box;color:var(--sapTextColor);color:var(--fdSelect_Text_Content_Color, var(--sapTextColor));cursor:pointer;display:var(--fdSelect_Text_Content_Display, inline-block);font-family:var(--sapFontFamily);font-size:var(--sapFontSize);font-weight:400;forced-color-adjust:none;line-height:var(--sapContent_LineHeight);margin:0;min-width:calc(var(--fdSelect_Min_Width) - var(--sapField_BorderWidth) * 2);overflow:hidden;padding:0 0 0 .625rem;text-overflow:ellipsis;white-space:nowrap}.fd-select__text-content:after,.fd-select__text-content:before{box-sizing:inherit;font-size:inherit}.fd-select__text-content[dir=rtl],[dir=rtl] .fd-select__text-content{padding-left:0;padding-right:.625rem}.fd-select[class*=-compact],.fd-select[class*=-condensed],[class*=-compact] .fd-select:not([class*=-cozy]),[class*=-condensed] .fd-select:not([class*=-cozy]){margin:.1875rem 0}.fd-select[class*=-compact] .fd-select__control,.fd-select[class*=-condensed] .fd-select__control,[class*=-compact] .fd-select:not([class*=-cozy]) .fd-select__control,[class*=-condensed] .fd-select:not([class*=-cozy]) .fd-select__control{height:1.625rem;min-height:1.625rem}.fd-select[class*=-compact] .fd-select__control .fd-select__text-content,.fd-select[class*=-condensed] .fd-select__control .fd-select__text-content,[class*=-compact] .fd-select:not([class*=-cozy]) .fd-select__control .fd-select__text-content,[class*=-condensed] .fd-select:not([class*=-cozy]) .fd-select__control .fd-select__text-content{--fdSelect_Min_Width:2.75rem;padding-left:.5rem}.fd-select[class*=-compact] .fd-select__control .fd-select__text-content[dir=rtl],.fd-select[class*=-condensed] .fd-select__control .fd-select__text-content[dir=rtl],[class*=-compact] .fd-select:not([class*=-cozy]) .fd-select__control .fd-select__text-content[dir=rtl],[class*=-condensed] .fd-select:not([class*=-cozy]) .fd-select__control .fd-select__text-content[dir=rtl],[dir=rtl] .fd-select[class*=-compact] .fd-select__control .fd-select__text-content,[dir=rtl] .fd-select[class*=-condensed] .fd-select__control .fd-select__text-content,[dir=rtl] [class*=-compact] .fd-select:not([class*=-cozy]) .fd-select__control .fd-select__text-content,[dir=rtl] [class*=-condensed] .fd-select:not([class*=-cozy]) .fd-select__control .fd-select__text-content{padding-left:0;padding-right:.5rem}.fd-select[class*=-compact] .fd-select__control.is-readonly .fd-select__text-content,.fd-select[class*=-compact] .fd-select__control[aria-readonly=true] .fd-select__text-content,.fd-select[class*=-compact] .fd-select__control[readonly] .fd-select__text-content,.fd-select[class*=-condensed] .fd-select__control.is-readonly .fd-select__text-content,.fd-select[class*=-condensed] .fd-select__control[aria-readonly=true] .fd-select__text-content,.fd-select[class*=-condensed] .fd-select__control[readonly] .fd-select__text-content,[class*=-compact] .fd-select:not([class*=-cozy]) .fd-select__control.is-readonly .fd-select__text-content,[class*=-compact] .fd-select:not([class*=-cozy]) .fd-select__control[aria-readonly=true] .fd-select__text-content,[class*=-compact] .fd-select:not([class*=-cozy]) .fd-select__control[readonly] .fd-select__text-content,[class*=-condensed] .fd-select:not([class*=-cozy]) .fd-select__control.is-readonly .fd-select__text-content,[class*=-condensed] .fd-select:not([class*=-cozy]) .fd-select__control[aria-readonly=true] .fd-select__text-content,[class*=-condensed] .fd-select:not([class*=-cozy]) .fd-select__control[readonly] .fd-select__text-content{padding-left:.5rem;padding-right:.5rem}@media (min-width: 600px){[dir=rtl] .fd-container.fd-form-layout-grid-container .fd-row .fd-col-md--10{text-align:right!important}}\n"], dependencies: [{ kind: "ngmodule", type: SelectModule }, { kind: "component", type: i4$1.SelectComponent, selector: "fd-select", inputs: ["extendedBodyTemplate", "controlId", "state", "mobile", "stateMessage", "disabled", "required", "readonly", "placeholder", "value", "maxHeight", "glyph", "closeOnOutsideClick", "fillControlMode", "controlTemplate", "appendTo", "unselectMissingOption", "typeaheadDebounceInterval", "ariaLabelledBy", "ariaLabel", "mobileConfig", "inline", "selectControlClass", "selectDropdownButtonClass", "advancedStateMessage", "compareWith"], outputs: ["isOpenChange", "valueChange"] }, { kind: "component", type: i4$1.OptionComponent, selector: "[fd-option], fd-option", inputs: ["id", "value", "disabled"], outputs: ["selectionChange"] }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$1.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "directive", type: NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: NgFor, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "ngmodule", type: IconModule }, { kind: "component", type: i4.IconComponent, selector: "fd-icon", inputs: ["glyph", "font", "class", "ariaLabel"] }, { kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: ListSecondaryDirective, selector: "[fd-list-secondary], [fdListSecondary]", inputs: ["type"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.1.0", ngImport: i0, type: SelectComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'fdp-select', changeDetection: ChangeDetectionStrategy.OnPush, encapsulation: ViewEncapsulation.None, providers: [{ provide: FD_FORM_FIELD_CONTROL, useExisting: SelectComponent, multi: true }], template: "<fd-select\n    [placeholder]=\"placeholder\"\n    [glyph]=\"glyph\"\n    [disabled]=\"disabled\"\n    [readonly]=\"readonly\"\n    [closeOnOutsideClick]=\"closeOnOutsideClick\"\n    [controlTemplate]=\"controlTemplate\"\n    [appendTo]=\"appendTo\"\n    [fillControlMode]=\"fillControlMode\"\n    [maxHeight]=\"maxHeight\"\n    [attr.aria-disabled]=\"disabled || readonly\"\n    [attr.aria-labelledby]=\"value\"\n    [attr.tooltip]=\"value\"\n    [attr.aria-readonly]=\"readonly\"\n    [attr.role]=\"'listbox'\"\n    [value]=\"value\"\n    [state]=\"state\"\n    [stateMessage]=\"stateMessage\"\n    [mobile]=\"mobile\"\n    [mobileConfig]=\"mobileConfig\"\n    [inline]=\"inline\"\n    [(ngModel)]=\"value\"\n    (valueChange)=\"_onSelection($event)\"\n>\n    <ng-content></ng-content>\n    <li fd-option *ngIf=\"noValueLabel\" [disabled]=\"false\" [value]=\"null\">\n        {{ noValueLabel }}\n    </li>\n    <li\n        fd-option\n        *ngFor=\"let item of _optionItems; index as index\"\n        [disabled]=\"!!item.disabled\"\n        [value]=\"item.value\"\n        [attr.aria-labelledby]=\"ariaLabel\"\n        [attr.aria-disabled]=\"disabled\"\n    >\n        <fd-icon *ngIf=\"item.icon\" [glyph]=\"item.icon\" class=\"fd-template-icon icon-margin\"></fd-icon>\n        <ng-container\n            [ngTemplateOutlet]=\"listItem\"\n            [ngTemplateOutletContext]=\"{ optionItem: item, index: index }\"\n        ></ng-container>\n        <ng-container\n            secondary\n            [ngTemplateOutlet]=\"secondaryTextSource\"\n            [ngTemplateOutletContext]=\"{ optionItem: item }\"\n        ></ng-container>\n    </li>\n</fd-select>\n\n<ng-template let-optionItem=\"optionItem\" let-index=\"index\" #listItem>\n    <ng-container\n        *ngIf=\"_isSelectedOptionItem(optionItem) && !!_selectedItemTemplate\"\n        [ngTemplateOutlet]=\"_selectedItemTemplate\"\n        [ngTemplateOutletContext]=\"{ $implicit: optionItem.value, index: index }\"\n    ></ng-container>\n\n    <ng-container *ngIf=\"!(_isSelectedOptionItem(optionItem) && _selectedItemTemplate)\">\n        <ng-container\n            [ngTemplateOutlet]=\"optionItemSource\"\n            [ngTemplateOutletContext]=\"{ optionItem: optionItem, index: index }\"\n        ></ng-container>\n    </ng-container>\n</ng-template>\n\n<ng-template let-optionItem=\"optionItem\" let-index=\"index\" #optionItemSource>\n    <ng-container *ngIf=\"!_optionItemTemplate\">\n        <span [innerHTML]=\"optionItem.label\"></span>\n    </ng-container>\n\n    <ng-container *ngIf=\"_optionItemTemplate\">\n        <ng-container\n            [ngTemplateOutlet]=\"_optionItemTemplate\"\n            [ngTemplateOutletContext]=\"{ $implicit: optionItem.value, index: index }\"\n        ></ng-container>\n    </ng-container>\n</ng-template>\n\n<ng-template let-optionItem=\"optionItem\" #secondaryTextSource>\n    <ng-container *ngIf=\"showSecondaryText\">\n        <ng-container *ngIf=\"!_secondaryItemTemplate\">\n            <span\n                [style.text-align]=\"secondaryTextAlignment\"\n                fd-list-secondary\n                [innerHTML]=\"optionItem.secondaryText\"\n            ></span>\n        </ng-container>\n\n        <ng-container *ngIf=\"_secondaryItemTemplate\">\n            <ng-container\n                [ngTemplateOutlet]=\"_secondaryItemTemplate\"\n                [ngTemplateOutletContext]=\"{ $implicit: optionItem.value }\"\n            ></ng-container>\n        </ng-container>\n    </ng-container>\n</ng-template>\n", styles: ["/*!\n * Fundamental Library Styles v0.30.2-rc.6\n * Copyright (c) 2023 SAP SE or an SAP affiliate company.\n * Licensed under Apache License 2.0 (https://github.com/SAP/fundamental-styles/blob/main/LICENSE)\n */.fd-select{-webkit-box-sizing:border-box;border:0;box-sizing:border-box;color:var(--sapTextColor);font-family:var(--sapFontFamily);font-size:var(--sapFontSize);font-weight:400;forced-color-adjust:none;line-height:var(--sapContent_LineHeight);margin:.25rem 0;padding:0;text-shadow:var(--fdSelect_Text_Shadow)}.fd-select:after,.fd-select:before{box-sizing:inherit;font-size:inherit}.fd-select__control{-webkit-box-sizing:border-box;-webkit-box-shadow:var(--sapField_Shadow);-moz-appearance:none;-webkit-appearance:none;-webkit-box-shadow:none;-webkit-box-pack:center;-ms-flex-pack:center;-webkit-box-align:center;-ms-flex-align:center;-webkit-box-pack:justify;-ms-flex-pack:justify;align-items:center;appearance:none;background:var(--fdSelect_Background, var(--sapField_BackgroundStyle));background-color:var(--fdSelect_Background_Color, var(--sapField_Background));border:0;border:var(--sapField_BorderWidth) var(--sapField_BorderStyle) var(--sapField_BorderColor);border-radius:var(--sapField_BorderCornerRadius);box-shadow:var(--sapField_Shadow);box-shadow:none;box-sizing:border-box;color:var(--sapTextColor);color:var(--sapField_TextColor);cursor:text;cursor:pointer;display:flex;font-family:var(--sapFontFamily);font-size:var(--sapFontSize);font-weight:400;forced-color-adjust:none;gap:.25rem;height:var(--sapElement_Height);justify-content:center;justify-content:space-between;line-height:var(--sapContent_LineHeight);margin:0;min-height:var(--sapElement_Height);min-width:var(--fdSelect_Min_Width, 2.75rem);outline:none;overflow:hidden;padding:0;text-overflow:ellipsis;text-shadow:var(--fdInput_Text_Shadow);white-space:nowrap;width:100%;z-index:1}.fd-select__control:after,.fd-select__control:before{box-sizing:inherit;font-size:inherit}.fd-select__control::placeholder{color:var(--sapField_PlaceholderTextColor);font-style:var(--fdPlaceholder_Font_Style)}.fd-select__control[dir=rtl]::placeholder,[dir=rtl] .fd-select__control::placeholder{text-indent:.125rem}.fd-select__control::selection{background-color:var(--sapSelectedColor);color:var(--sapContent_ContrastTextColor)}.fd-select__control::-ms-clear{display:none}.fd-select__control.is-hover,.fd-select__control:hover{-webkit-box-shadow:var(--fdInput_Box_Shadow_Hover);background:var(--fdSelect_Hover_Background, var(--sapField_Hover_BackgroundStyle));background-color:var(--fdSelect_Hover_Background_Color, var(--sapField_Hover_Background));border-color:var(--sapField_Hover_BorderColor);box-shadow:var(--fdInput_Box_Shadow_Hover)}.fd-select__control.is-focus,.fd-select__control:focus{-webkit-box-shadow:none;background:var(--fdSelect_Focus_Background, var(--sapField_Focus_Background));box-shadow:none;outline-color:var(--fdInput_Outline_Color);outline-offset:var(--fdInput_Outline_Offset);outline-style:var(--sapContent_FocusStyle);outline-width:var(--sapContent_FocusWidth);z-index:5}.fd-select__control.is-success{-webkit-box-shadow:var(--sapField_SuccessShadow);background:var(--sapField_SuccessBackgroundStyle);background-color:var(--sapField_SuccessBackground);border:var(--sapField_SuccessColor) var(--sapField_SuccessBorderWidth) var(--sapField_SuccessBorderStyle);box-shadow:var(--sapField_SuccessShadow)}.fd-select__control.is-success.is-hover,.fd-select__control.is-success:hover{-webkit-box-shadow:var(--fdInput_Success_Box_Shadow_Hover);background-color:var(--fdInput_Success_Background_Color_Hover);border-color:var(--sapField_SuccessColor);box-shadow:var(--fdInput_Success_Box_Shadow_Hover)}.fd-select__control.is-success.is-focus,.fd-select__control.is-success:focus{background:var(--sapField_Focus_Background);outline-color:var(--fdInput_Success_Outline_Color)}.fd-select__control.is-success.is-focus.is-hover,.fd-select__control.is-success.is-focus:hover,.fd-select__control.is-success:focus.is-hover,.fd-select__control.is-success:focus:hover{box-shadow:none}.fd-select__control.is-success.is-expanded,.fd-select__control.is-success[aria-expanded=true]{-webkit-box-shadow:none;background:var(--sapField_Focus_Background);box-shadow:none;outline:var(--sapContent_FocusWidth) var(--sapContent_FocusStyle) var(--fdInput_Success_Outline_Color);outline-offset:var(--fdInput_Outline_Offset)}.fd-select__control.is-error{-webkit-box-shadow:var(--sapField_InvalidShadow);background:var(--sapField_InvalidBackgroundStyle);background-color:var(--sapField_InvalidBackground);border:var(--sapField_InvalidColor) var(--sapField_InvalidBorderWidth) var(--sapField_InvalidBorderStyle);box-shadow:var(--sapField_InvalidShadow)}.fd-select__control.is-error.is-hover,.fd-select__control.is-error:hover{-webkit-box-shadow:var(--fdInput_Error_Box_Shadow_Hover);background-color:var(--fdInput_Error_Background_Color_Hover);border-color:var(--sapField_InvalidColor);box-shadow:var(--fdInput_Error_Box_Shadow_Hover)}.fd-select__control.is-error.is-focus,.fd-select__control.is-error:focus{background:var(--sapField_Focus_Background);outline-color:var(--fdInput_Error_Outline_Color)}.fd-select__control.is-error.is-focus.is-hover,.fd-select__control.is-error.is-focus:hover,.fd-select__control.is-error:focus.is-hover,.fd-select__control.is-error:focus:hover{box-shadow:none}.fd-select__control.is-error.is-expanded,.fd-select__control.is-error[aria-expanded=true]{-webkit-box-shadow:none;background:var(--sapField_Focus_Background);box-shadow:none;outline:var(--sapContent_FocusWidth) var(--sapContent_FocusStyle) var(--fdInput_Error_Outline_Color);outline-offset:var(--fdInput_Outline_Offset)}.fd-select__control.is-warning{-webkit-box-shadow:var(--sapField_WarningShadow);background:var(--sapField_WarningBackgroundStyle);background-color:var(--sapField_WarningBackground);border:var(--sapField_WarningColor) var(--sapField_WarningBorderWidth) var(--sapField_WarningBorderStyle);box-shadow:var(--sapField_WarningShadow)}.fd-select__control.is-warning.is-hover,.fd-select__control.is-warning:hover{-webkit-box-shadow:var(--fdInput_Warning_Box_Shadow_Hover);background-color:var(--fdInput_Warning_Background_Color_Hover);border-color:var(--sapField_WarningColor);box-shadow:var(--fdInput_Warning_Box_Shadow_Hover)}.fd-select__control.is-warning.is-focus,.fd-select__control.is-warning:focus{background:var(--sapField_Focus_Background);outline-color:var(--fdInput_Warning_Outline_Color)}.fd-select__control.is-warning.is-focus.is-hover,.fd-select__control.is-warning.is-focus:hover,.fd-select__control.is-warning:focus.is-hover,.fd-select__control.is-warning:focus:hover{box-shadow:none}.fd-select__control.is-warning.is-expanded,.fd-select__control.is-warning[aria-expanded=true]{-webkit-box-shadow:none;background:var(--sapField_Focus_Background);box-shadow:none;outline:var(--sapContent_FocusWidth) var(--sapContent_FocusStyle) var(--fdInput_Warning_Outline_Color);outline-offset:var(--fdInput_Outline_Offset)}.fd-select__control.is-alert{background:var(--sapField_WarningBackgroundStyle);background-color:var(--sapField_WarningBackground);border:var(--sapField_WarningColor) var(--sapField_WarningBorderWidth) var(--sapField_WarningBorderStyle)}.fd-select__control.is-alert.is-hover,.fd-select__control.is-alert:hover{-webkit-box-shadow:var(--fdInput_Warning_Box_Shadow_Hover);background-color:var(--fdInput_Warning_Background_Color_Hover);border-color:var(--sapField_WarningColor);box-shadow:var(--fdInput_Warning_Box_Shadow_Hover)}.fd-select__control.is-alert.is-focus,.fd-select__control.is-alert:focus{background:var(--sapField_Focus_Background);outline-color:var(--fdInput_Warning_Outline_Color)}.fd-select__control.is-alert.is-focus.is-hover,.fd-select__control.is-alert.is-focus:hover,.fd-select__control.is-alert:focus.is-hover,.fd-select__control.is-alert:focus:hover{box-shadow:none}.fd-select__control.is-alert.is-expanded,.fd-select__control.is-alert[aria-expanded=true]{-webkit-box-shadow:none;background:var(--sapField_Focus_Background);box-shadow:none;outline:var(--sapContent_FocusWidth) var(--sapContent_FocusStyle) var(--fdInput_Warning_Outline_Color);outline-offset:var(--fdInput_Outline_Offset)}.fd-select__control.is-information{-webkit-box-shadow:var(--sapField_InformationShadow);background:var(--sapField_InformationBackgroundStyle);background-color:var(--sapField_InformationBackground);border:var(--sapField_InformationColor) var(--sapField_InformationBorderWidth) var(--sapField_InformationBorderStyle);box-shadow:var(--sapField_InformationShadow)}.fd-select__control.is-information.is-hover,.fd-select__control.is-information:hover{-webkit-box-shadow:var(--fdInput_Information_Box_Shadow_Hover);background-color:var(--fdInput_Information_Background_Color_Hover);border-color:var(--sapField_InformationColor);box-shadow:var(--fdInput_Information_Box_Shadow_Hover)}.fd-select__control.is-information.is-focus,.fd-select__control.is-information:focus{background:var(--sapField_Focus_Background);outline-color:var(--fdInput_Information_Outline_Color)}.fd-select__control.is-information.is-focus.is-hover,.fd-select__control.is-information.is-focus:hover,.fd-select__control.is-information:focus.is-hover,.fd-select__control.is-information:focus:hover{box-shadow:none}.fd-select__control.is-information.is-expanded,.fd-select__control.is-information[aria-expanded=true]{-webkit-box-shadow:none;background:var(--sapField_Focus_Background);box-shadow:none;outline:var(--sapContent_FocusWidth) var(--sapContent_FocusStyle) var(--fdInput_Information_Outline_Color);outline-offset:var(--fdInput_Outline_Offset)}.fd-select__control.is-alert,.fd-select__control.is-error,.fd-select__control.is-warning{font-style:var(--fdInput_State_Text_Style);font-weight:var(--fdInput_State_Font_Weight)}.fd-select__control.is-alert::placeholder,.fd-select__control.is-error::placeholder,.fd-select__control.is-warning::placeholder{font-weight:var(--fdInput_State_Font_Weight)}.fd-select__control.is-alert.is-focus,.fd-select__control.is-alert:focus,.fd-select__control.is-error.is-focus,.fd-select__control.is-error:focus,.fd-select__control.is-information.is-focus,.fd-select__control.is-information:focus,.fd-select__control.is-warning.is-focus,.fd-select__control.is-warning:focus{outline-offset:var(--fdInput_Outline_Offset_States);z-index:5}.fd-select__control.is-error::placeholder{color:var(--sapField_TextColor)}.fd-select__control.is-disabled,.fd-select__control:disabled,.fd-select__control[aria-disabled=true]{opacity:var(--sapContent_DisabledOpacity)}.fd-select__control.is-disabled::placeholder,.fd-select__control:disabled::placeholder,.fd-select__control[aria-disabled=true]::placeholder{color:var(--fdInput_Non_Interactive_State_Placeholder_Color)}.fd-select__control.is-readonly,.fd-select__control[aria-readonly=true],.fd-select__control[readonly]{-webkit-box-shadow:none;background:var(--sapField_ReadOnly_BackgroundStyle);background-color:var(--sapField_ReadOnly_Background);border-color:var(--sapField_ReadOnly_BorderColor);box-shadow:none}.fd-select__control.is-readonly::placeholder,.fd-select__control[aria-readonly=true]::placeholder,.fd-select__control[readonly]::placeholder{color:var(--fdInput_Non_Interactive_State_Placeholder_Color)}.fd-select__control.is-readonly.is-hover,.fd-select__control.is-readonly:hover,.fd-select__control[aria-readonly=true].is-hover,.fd-select__control[aria-readonly=true]:hover,.fd-select__control[readonly].is-hover,.fd-select__control[readonly]:hover{-webkit-box-shadow:none;background:var(--sapField_ReadOnly_BackgroundStyle);background-color:var(--sapField_ReadOnly_Background);border-color:var(--sapField_ReadOnly_BorderColor);box-shadow:none}.fd-select__control.is-readonly.is-focus,.fd-select__control.is-readonly:focus,.fd-select__control[aria-readonly=true].is-focus,.fd-select__control[aria-readonly=true]:focus,.fd-select__control[readonly].is-focus,.fd-select__control[readonly]:focus{-webkit-box-shadow:none;background:var(--sapField_ReadOnly_BackgroundStyle);background-color:var(--sapField_ReadOnly_Background);border-color:var(--sapField_ReadOnly_BorderColor);box-shadow:none;z-index:5}.fd-select__control .fd-select__button:first-child{border-right:var(--fdInputGroup_ControlButton_SideBorder)}.fd-select__control .fd-select__button:first-child[dir=rtl],[dir=rtl] .fd-select__control .fd-select__button:first-child{border-left:var(--fdInputGroup_ControlButton_SideBorder);border-right-style:none}.fd-select__control .fd-select__button:first-child.is-hover,.fd-select__control .fd-select__button:first-child:hover{border-right:var(--fdInputGroup_ControlButton_SideBorder_Active)}.fd-select__control .fd-select__button:first-child.is-hover[dir=rtl],.fd-select__control .fd-select__button:first-child:hover[dir=rtl],[dir=rtl] .fd-select__control .fd-select__button:first-child.is-hover,[dir=rtl] .fd-select__control .fd-select__button:first-child:hover{border-left:var(--fdInputGroup_ControlButton_SideBorder_Active);border-right-style:none}.fd-select__control .fd-select__button:first-child.is-active,.fd-select__control .fd-select__button:first-child:active{border-right:var(--fdInputGroup_ControlButton_SideBorder_Active)}.fd-select__control .fd-select__button:first-child.is-active[dir=rtl],.fd-select__control .fd-select__button:first-child:active[dir=rtl],[dir=rtl] .fd-select__control .fd-select__button:first-child.is-active,[dir=rtl] .fd-select__control .fd-select__button:first-child:active{border-left:var(--fdInputGroup_ControlButton_SideBorder_Active);border-right-style:none}.fd-select__control .fd-select__button:not(:first-child){border-left:var(--fdInputGroup_ControlButton_SideBorder)}.fd-select__control .fd-select__button:not(:first-child)[dir=rtl],[dir=rtl] .fd-select__control .fd-select__button:not(:first-child){border-left-style:none;border-right:var(--fdInputGroup_ControlButton_SideBorder)}.fd-select__control .fd-select__button:not(:first-child).is-hover,.fd-select__control .fd-select__button:not(:first-child):hover{border-left:var(--fdInputGroup_ControlButton_SideBorder_Active)}.fd-select__control .fd-select__button:not(:first-child).is-hover[dir=rtl],.fd-select__control .fd-select__button:not(:first-child):hover[dir=rtl],[dir=rtl] .fd-select__control .fd-select__button:not(:first-child).is-hover,[dir=rtl] .fd-select__control .fd-select__button:not(:first-child):hover{border-left-style:none;border-right:var(--fdInputGroup_ControlButton_SideBorder_Active)}.fd-select__control .fd-select__button:not(:first-child).is-active,.fd-select__control .fd-select__button:not(:first-child):active{border-left:var(--fdInputGroup_ControlButton_SideBorder_Active)}.fd-select__control .fd-select__button:not(:first-child).is-active[dir=rtl],.fd-select__control .fd-select__button:not(:first-child):active[dir=rtl],[dir=rtl] .fd-select__control .fd-select__button:not(:first-child).is-active,[dir=rtl] .fd-select__control .fd-select__button:not(:first-child):active{border-left-style:none;border-right:var(--fdInputGroup_ControlButton_SideBorder_Active)}.fd-select__control .fd-select__addon:first-child .fd-select__button{border-right:var(--fdInputGroup_ControlButton_SideBorder)}.fd-select__control .fd-select__addon:first-child .fd-select__button[dir=rtl],[dir=rtl] .fd-select__control .fd-select__addon:first-child .fd-select__button{border-left:var(--fdInputGroup_ControlButton_SideBorder);border-right-style:none}.fd-select__control .fd-select__addon:first-child .fd-select__button.is-hover,.fd-select__control .fd-select__addon:first-child .fd-select__button:hover{border-right:var(--fdInputGroup_ControlButton_SideBorder_Active)}.fd-select__control .fd-select__addon:first-child .fd-select__button.is-hover[dir=rtl],.fd-select__control .fd-select__addon:first-child .fd-select__button:hover[dir=rtl],[dir=rtl] .fd-select__control .fd-select__addon:first-child .fd-select__button.is-hover,[dir=rtl] .fd-select__control .fd-select__addon:first-child .fd-select__button:hover{border-left:var(--fdInputGroup_ControlButton_SideBorder_Active);border-right-style:none}.fd-select__control .fd-select__addon:first-child .fd-select__button.is-active,.fd-select__control .fd-select__addon:first-child .fd-select__button:active{border-right:var(--fdInputGroup_ControlButton_SideBorder_Active)}.fd-select__control .fd-select__addon:first-child .fd-select__button.is-active[dir=rtl],.fd-select__control .fd-select__addon:first-child .fd-select__button:active[dir=rtl],[dir=rtl] .fd-select__control .fd-select__addon:first-child .fd-select__button.is-active,[dir=rtl] .fd-select__control .fd-select__addon:first-child .fd-select__button:active{border-left:var(--fdInputGroup_ControlButton_SideBorder_Active);border-right-style:none}.fd-select__control .fd-select__addon:not(:first-child) .fd-select__button{border-left:var(--fdInputGroup_ControlButton_SideBorder)}.fd-select__control .fd-select__addon:not(:first-child) .fd-select__button[dir=rtl],[dir=rtl] .fd-select__control .fd-select__addon:not(:first-child) .fd-select__button{border-left-style:none;border-right:var(--fdInputGroup_ControlButton_SideBorder)}.fd-select__control .fd-select__addon:not(:first-child) .fd-select__button.is-hover,.fd-select__control .fd-select__addon:not(:first-child) .fd-select__button:hover{border-left:var(--fdInputGroup_ControlButton_SideBorder_Active)}.fd-select__control .fd-select__addon:not(:first-child) .fd-select__button.is-hover[dir=rtl],.fd-select__control .fd-select__addon:not(:first-child) .fd-select__button:hover[dir=rtl],[dir=rtl] .fd-select__control .fd-select__addon:not(:first-child) .fd-select__button.is-hover,[dir=rtl] .fd-select__control .fd-select__addon:not(:first-child) .fd-select__button:hover{border-left-style:none;border-right:var(--fdInputGroup_ControlButton_SideBorder_Active)}.fd-select__control .fd-select__addon:not(:first-child) .fd-select__button.is-active,.fd-select__control .fd-select__addon:not(:first-child) .fd-select__button:active{border-left:var(--fdInputGroup_ControlButton_SideBorder_Active)}.fd-select__control .fd-select__addon:not(:first-child) .fd-select__button.is-active[dir=rtl],.fd-select__control .fd-select__addon:not(:first-child) .fd-select__button:active[dir=rtl],[dir=rtl] .fd-select__control .fd-select__addon:not(:first-child) .fd-select__button.is-active,[dir=rtl] .fd-select__control .fd-select__addon:not(:first-child) .fd-select__button:active{border-left-style:none;border-right:var(--fdInputGroup_ControlButton_SideBorder_Active)}.fd-select__control .fd-select__button{background:var(--fdInput_Group_Button_Background);background-color:var(--fdButtonBackgroundColor);border:none;border-radius:var(--fdInput_Group_Button_Border_Raduis);color:var(--fdInput_Group_Button_Text_Color);overflow:hidden;position:relative;text-overflow:ellipsis;white-space:nowrap;z-index:auto!important}.fd-select__control .fd-select__button:before{display:none!important}.fd-select__control .fd-select__button:after{border-radius:var(--fdInput_Outline_Border_Radius)}.fd-select__control .fd-select__button.is-hover,.fd-select__control .fd-select__button:hover{--fdInput_Group_Button_Text_Color:var(--fdInput_Group_Button_Hover_Text_Color);--fdButtonBackgroundColor:var(--fdInput_Group_Button_Hover_Background);box-shadow:var(--fdInput_Group_Button_Box_Shadow)}.fd-select__control .fd-select__button.is-active,.fd-select__control .fd-select__button:active{-webkit-box-shadow:var(--fdInput_Group_Button_Box_Shadow);background:var(--fdInput_Group_Button_Active_Background);box-shadow:var(--fdInput_Group_Button_Box_Shadow);color:var(--fdInput_Group_Button_Active_Text_Color)}.fd-select__control.is-success.is-focus,.fd-select__control.is-success:focus{z-index:5}.fd-select__control.is-success.is-focus .fd-select__button,.fd-select__control.is-success:focus .fd-select__button{-webkit-box-shadow:var(--fdInput_Group_Button_Success_Active_Box_Shadow);--fdButtonBackgroundColor:var(--fdInput_Group_Button_Active_Background);box-shadow:var(--fdInput_Group_Button_Success_Active_Box_Shadow);color:var(--fdInput_Group_Button_Success_Active_Text_Color)}.fd-select__control.is-success.is-focus .fd-select__button.is-hover,.fd-select__control.is-success.is-focus .fd-select__button:hover,.fd-select__control.is-success:focus .fd-select__button.is-hover,.fd-select__control.is-success:focus .fd-select__button:hover{--fdButtonBackgroundColor:var(--fdInput_Group_Button_Active_Background)}.fd-select__control.is-success.is-expanded .fd-select__button,.fd-select__control.is-success[aria-expanded=true] .fd-select__button{-webkit-box-shadow:var(--fdInput_Group_Button_Success_Active_Box_Shadow);--fdButtonBackgroundColor:var(--fdInput_Group_Button_Active_Background);box-shadow:var(--fdInput_Group_Button_Success_Active_Box_Shadow);color:var(--fdInput_Group_Button_Success_Active_Text_Color)}.fd-select__control.is-success.is-expanded .fd-select__button.is-hover,.fd-select__control.is-success.is-expanded .fd-select__button:hover,.fd-select__control.is-success[aria-expanded=true] .fd-select__button.is-hover,.fd-select__control.is-success[aria-expanded=true] .fd-select__button:hover{--fdButtonBackgroundColor:var(--fdInput_Group_Button_Active_Background)}.fd-select__control.is-success .fd-select__button.is-active,.fd-select__control.is-success .fd-select__button.is-hover,.fd-select__control.is-success .fd-select__button:active,.fd-select__control.is-success .fd-select__button:hover{box-shadow:var(--fdInput_Group_Button_Success_Active_Box_Shadow)}.fd-select__control.is-success .fd-select__button.is-active,.fd-select__control.is-success .fd-select__button:active{color:var(--fdInput_Group_Button_Success_Active_Text_Color)}.fd-select__control.is-error.is-focus,.fd-select__control.is-error:focus{z-index:5}.fd-select__control.is-error.is-focus .fd-select__button,.fd-select__control.is-error:focus .fd-select__button{-webkit-box-shadow:var(--fdInput_Group_Button_Error_Active_Box_Shadow);--fdButtonBackgroundColor:var(--fdInput_Group_Button_Active_Background);box-shadow:var(--fdInput_Group_Button_Error_Active_Box_Shadow);color:var(--fdInput_Group_Button_Error_Active_Text_Color)}.fd-select__control.is-error.is-focus .fd-select__button.is-hover,.fd-select__control.is-error.is-focus .fd-select__button:hover,.fd-select__control.is-error:focus .fd-select__button.is-hover,.fd-select__control.is-error:focus .fd-select__button:hover{--fdButtonBackgroundColor:var(--fdInput_Group_Button_Active_Background)}.fd-select__control.is-error.is-expanded .fd-select__button,.fd-select__control.is-error[aria-expanded=true] .fd-select__button{-webkit-box-shadow:var(--fdInput_Group_Button_Error_Active_Box_Shadow);--fdButtonBackgroundColor:var(--fdInput_Group_Button_Active_Background);box-shadow:var(--fdInput_Group_Button_Error_Active_Box_Shadow);color:var(--fdInput_Group_Button_Error_Active_Text_Color)}.fd-select__control.is-error.is-expanded .fd-select__button.is-hover,.fd-select__control.is-error.is-expanded .fd-select__button:hover,.fd-select__control.is-error[aria-expanded=true] .fd-select__button.is-hover,.fd-select__control.is-error[aria-expanded=true] .fd-select__button:hover{--fdButtonBackgroundColor:var(--fdInput_Group_Button_Active_Background)}.fd-select__control.is-error .fd-select__button.is-active,.fd-select__control.is-error .fd-select__button.is-hover,.fd-select__control.is-error .fd-select__button:active,.fd-select__control.is-error .fd-select__button:hover{box-shadow:var(--fdInput_Group_Button_Error_Active_Box_Shadow)}.fd-select__control.is-error .fd-select__button.is-active,.fd-select__control.is-error .fd-select__button:active{color:var(--fdInput_Group_Button_Error_Active_Text_Color)}.fd-select__control.is-warning.is-focus,.fd-select__control.is-warning:focus{z-index:5}.fd-select__control.is-warning.is-focus .fd-select__button,.fd-select__control.is-warning:focus .fd-select__button{-webkit-box-shadow:var(--fdInput_Group_Button_Warning_Active_Box_Shadow);--fdButtonBackgroundColor:var(--fdInput_Group_Button_Active_Background);box-shadow:var(--fdInput_Group_Button_Warning_Active_Box_Shadow);color:var(--fdInput_Group_Button_Warning_Active_Text_Color)}.fd-select__control.is-warning.is-focus .fd-select__button.is-hover,.fd-select__control.is-warning.is-focus .fd-select__button:hover,.fd-select__control.is-warning:focus .fd-select__button.is-hover,.fd-select__control.is-warning:focus .fd-select__button:hover{--fdButtonBackgroundColor:var(--fdInput_Group_Button_Active_Background)}.fd-select__control.is-warning.is-expanded .fd-select__button,.fd-select__control.is-warning[aria-expanded=true] .fd-select__button{-webkit-box-shadow:var(--fdInput_Group_Button_Warning_Active_Box_Shadow);--fdButtonBackgroundColor:var(--fdInput_Group_Button_Active_Background);box-shadow:var(--fdInput_Group_Button_Warning_Active_Box_Shadow);color:var(--fdInput_Group_Button_Warning_Active_Text_Color)}.fd-select__control.is-warning.is-expanded .fd-select__button.is-hover,.fd-select__control.is-warning.is-expanded .fd-select__button:hover,.fd-select__control.is-warning[aria-expanded=true] .fd-select__button.is-hover,.fd-select__control.is-warning[aria-expanded=true] .fd-select__button:hover{--fdButtonBackgroundColor:var(--fdInput_Group_Button_Active_Background)}.fd-select__control.is-warning .fd-select__button.is-active,.fd-select__control.is-warning .fd-select__button.is-hover,.fd-select__control.is-warning .fd-select__button:active,.fd-select__control.is-warning .fd-select__button:hover{box-shadow:var(--fdInput_Group_Button_Warning_Active_Box_Shadow)}.fd-select__control.is-warning .fd-select__button.is-active,.fd-select__control.is-warning .fd-select__button:active{color:var(--fdInput_Group_Button_Warning_Active_Text_Color)}.fd-select__control.is-alert.is-focus,.fd-select__control.is-alert:focus{z-index:5}.fd-select__control.is-alert.is-focus .fd-select__button,.fd-select__control.is-alert:focus .fd-select__button{-webkit-box-shadow:var(--fdInput_Group_Button_Warning_Active_Box_Shadow);--fdButtonBackgroundColor:var(--fdInput_Group_Button_Active_Background);box-shadow:var(--fdInput_Group_Button_Warning_Active_Box_Shadow);color:var(--fdInput_Group_Button_Warning_Active_Text_Color)}.fd-select__control.is-alert.is-focus .fd-select__button.is-hover,.fd-select__control.is-alert.is-focus .fd-select__button:hover,.fd-select__control.is-alert:focus .fd-select__button.is-hover,.fd-select__control.is-alert:focus .fd-select__button:hover{--fdButtonBackgroundColor:var(--fdInput_Group_Button_Active_Background)}.fd-select__control.is-alert.is-expanded .fd-select__button,.fd-select__control.is-alert[aria-expanded=true] .fd-select__button{-webkit-box-shadow:var(--fdInput_Group_Button_Warning_Active_Box_Shadow);--fdButtonBackgroundColor:var(--fdInput_Group_Button_Active_Background);box-shadow:var(--fdInput_Group_Button_Warning_Active_Box_Shadow);color:var(--fdInput_Group_Button_Warning_Active_Text_Color)}.fd-select__control.is-alert.is-expanded .fd-select__button.is-hover,.fd-select__control.is-alert.is-expanded .fd-select__button:hover,.fd-select__control.is-alert[aria-expanded=true] .fd-select__button.is-hover,.fd-select__control.is-alert[aria-expanded=true] .fd-select__button:hover{--fdButtonBackgroundColor:var(--fdInput_Group_Button_Active_Background)}.fd-select__control.is-alert .fd-select__button.is-active,.fd-select__control.is-alert .fd-select__button.is-hover,.fd-select__control.is-alert .fd-select__button:active,.fd-select__control.is-alert .fd-select__button:hover{box-shadow:var(--fdInput_Group_Button_Warning_Active_Box_Shadow)}.fd-select__control.is-alert .fd-select__button.is-active,.fd-select__control.is-alert .fd-select__button:active{color:var(--fdInput_Group_Button_Warning_Active_Text_Color)}.fd-select__control.is-information.is-focus,.fd-select__control.is-information:focus{z-index:5}.fd-select__control.is-information.is-focus .fd-select__button,.fd-select__control.is-information:focus .fd-select__button{-webkit-box-shadow:var(--fdInput_Group_Button_Information_Active_Box_Shadow);--fdButtonBackgroundColor:var(--fdInput_Group_Button_Active_Background);box-shadow:var(--fdInput_Group_Button_Information_Active_Box_Shadow);color:var(--fdInput_Group_Button_Information_Active_Text_Color)}.fd-select__control.is-information.is-focus .fd-select__button.is-hover,.fd-select__control.is-information.is-focus .fd-select__button:hover,.fd-select__control.is-information:focus .fd-select__button.is-hover,.fd-select__control.is-information:focus .fd-select__button:hover{--fdButtonBackgroundColor:var(--fdInput_Group_Button_Active_Background)}.fd-select__control.is-information.is-expanded .fd-select__button,.fd-select__control.is-information[aria-expanded=true] .fd-select__button{-webkit-box-shadow:var(--fdInput_Group_Button_Information_Active_Box_Shadow);--fdButtonBackgroundColor:var(--fdInput_Group_Button_Active_Background);box-shadow:var(--fdInput_Group_Button_Information_Active_Box_Shadow);color:var(--fdInput_Group_Button_Information_Active_Text_Color)}.fd-select__control.is-information.is-expanded .fd-select__button.is-hover,.fd-select__control.is-information.is-expanded .fd-select__button:hover,.fd-select__control.is-information[aria-expanded=true] .fd-select__button.is-hover,.fd-select__control.is-information[aria-expanded=true] .fd-select__button:hover{--fdButtonBackgroundColor:var(--fdInput_Group_Button_Active_Background)}.fd-select__control.is-information .fd-select__button.is-active,.fd-select__control.is-information .fd-select__button.is-hover,.fd-select__control.is-information .fd-select__button:active,.fd-select__control.is-information .fd-select__button:hover{box-shadow:var(--fdInput_Group_Button_Information_Active_Box_Shadow)}.fd-select__control.is-information .fd-select__button.is-active,.fd-select__control.is-information .fd-select__button:active{color:var(--fdInput_Group_Button_Information_Active_Text_Color)}.fd-select__control.is-disabled,.fd-select__control:disabled,.fd-select__control[aria-disabled=true]{pointer-events:none}.fd-select__control:after{-webkit-box-shadow:var(--sapField_Shadow);border-radius:var(--sapField_BorderCornerRadius);box-shadow:var(--sapField_Shadow);content:\"\";inset:0;pointer-events:none;position:absolute}.fd-select__control.is-readonly,.fd-select__control[aria-readonly=true],.fd-select__control[readonly]{cursor:text}.fd-select__control.is-readonly .fd-select__text-content,.fd-select__control[aria-readonly=true] .fd-select__text-content,.fd-select__control[readonly] .fd-select__text-content{--fdSelect_Min_Width:5rem;padding-left:.625rem;padding-right:.625rem}.fd-select__control.is-readonly .fd-select__button,.fd-select__control[aria-readonly=true] .fd-select__button,.fd-select__control[readonly] .fd-select__button{opacity:0}.fd-select__control[aria-selected=false] .fd-select__text-content{padding:0 .625rem}.fd-select__control[aria-selected=false] .fd-select__text-content,.fd-select__control[aria-selected=false] .fd-select__text-content [class*=sap-icon]{color:var(--sapField_PlaceholderTextColor);font-style:italic;font-weight:400}.fd-select__text-content{-webkit-box-sizing:border-box;--fdSelect_Min_Width:2.5rem;border:0;box-sizing:border-box;color:var(--sapTextColor);color:var(--fdSelect_Text_Content_Color, var(--sapTextColor));cursor:pointer;display:var(--fdSelect_Text_Content_Display, inline-block);font-family:var(--sapFontFamily);font-size:var(--sapFontSize);font-weight:400;forced-color-adjust:none;line-height:var(--sapContent_LineHeight);margin:0;min-width:calc(var(--fdSelect_Min_Width) - var(--sapField_BorderWidth) * 2);overflow:hidden;padding:0 0 0 .625rem;text-overflow:ellipsis;white-space:nowrap}.fd-select__text-content:after,.fd-select__text-content:before{box-sizing:inherit;font-size:inherit}.fd-select__text-content[dir=rtl],[dir=rtl] .fd-select__text-content{padding-left:0;padding-right:.625rem}.fd-select[class*=-compact],.fd-select[class*=-condensed],[class*=-compact] .fd-select:not([class*=-cozy]),[class*=-condensed] .fd-select:not([class*=-cozy]){margin:.1875rem 0}.fd-select[class*=-compact] .fd-select__control,.fd-select[class*=-condensed] .fd-select__control,[class*=-compact] .fd-select:not([class*=-cozy]) .fd-select__control,[class*=-condensed] .fd-select:not([class*=-cozy]) .fd-select__control{height:1.625rem;min-height:1.625rem}.fd-select[class*=-compact] .fd-select__control .fd-select__text-content,.fd-select[class*=-condensed] .fd-select__control .fd-select__text-content,[class*=-compact] .fd-select:not([class*=-cozy]) .fd-select__control .fd-select__text-content,[class*=-condensed] .fd-select:not([class*=-cozy]) .fd-select__control .fd-select__text-content{--fdSelect_Min_Width:2.75rem;padding-left:.5rem}.fd-select[class*=-compact] .fd-select__control .fd-select__text-content[dir=rtl],.fd-select[class*=-condensed] .fd-select__control .fd-select__text-content[dir=rtl],[class*=-compact] .fd-select:not([class*=-cozy]) .fd-select__control .fd-select__text-content[dir=rtl],[class*=-condensed] .fd-select:not([class*=-cozy]) .fd-select__control .fd-select__text-content[dir=rtl],[dir=rtl] .fd-select[class*=-compact] .fd-select__control .fd-select__text-content,[dir=rtl] .fd-select[class*=-condensed] .fd-select__control .fd-select__text-content,[dir=rtl] [class*=-compact] .fd-select:not([class*=-cozy]) .fd-select__control .fd-select__text-content,[dir=rtl] [class*=-condensed] .fd-select:not([class*=-cozy]) .fd-select__control .fd-select__text-content{padding-left:0;padding-right:.5rem}.fd-select[class*=-compact] .fd-select__control.is-readonly .fd-select__text-content,.fd-select[class*=-compact] .fd-select__control[aria-readonly=true] .fd-select__text-content,.fd-select[class*=-compact] .fd-select__control[readonly] .fd-select__text-content,.fd-select[class*=-condensed] .fd-select__control.is-readonly .fd-select__text-content,.fd-select[class*=-condensed] .fd-select__control[aria-readonly=true] .fd-select__text-content,.fd-select[class*=-condensed] .fd-select__control[readonly] .fd-select__text-content,[class*=-compact] .fd-select:not([class*=-cozy]) .fd-select__control.is-readonly .fd-select__text-content,[class*=-compact] .fd-select:not([class*=-cozy]) .fd-select__control[aria-readonly=true] .fd-select__text-content,[class*=-compact] .fd-select:not([class*=-cozy]) .fd-select__control[readonly] .fd-select__text-content,[class*=-condensed] .fd-select:not([class*=-cozy]) .fd-select__control.is-readonly .fd-select__text-content,[class*=-condensed] .fd-select:not([class*=-cozy]) .fd-select__control[aria-readonly=true] .fd-select__text-content,[class*=-condensed] .fd-select:not([class*=-cozy]) .fd-select__control[readonly] .fd-select__text-content{padding-left:.5rem;padding-right:.5rem}@media (min-width: 600px){[dir=rtl] .fd-container.fd-form-layout-grid-container .fd-row .fd-col-md--10{text-align:right!important}}\n"] }]
+            args: [{ selector: 'fdp-select', changeDetection: ChangeDetectionStrategy.OnPush, encapsulation: ViewEncapsulation.None, providers: [DynamicComponentService, { provide: FD_FORM_FIELD_CONTROL, useExisting: SelectComponent, multi: true }], standalone: true, imports: [SelectModule, FormsModule, NgIf, NgFor, IconModule, NgTemplateOutlet, NgClass, ListSecondaryDirective], template: "<fd-select\n    [placeholder]=\"placeholder\"\n    [glyph]=\"glyph\"\n    [disabled]=\"disabled\"\n    [readonly]=\"readonly\"\n    [closeOnOutsideClick]=\"closeOnOutsideClick\"\n    [controlTemplate]=\"controlTemplate\"\n    [appendTo]=\"appendTo\"\n    [fillControlMode]=\"fillControlMode\"\n    [maxHeight]=\"maxHeight\"\n    [attr.aria-disabled]=\"disabled || readonly\"\n    [attr.aria-labelledby]=\"value\"\n    [attr.tooltip]=\"value\"\n    [attr.aria-readonly]=\"readonly\"\n    [attr.role]=\"'listbox'\"\n    [value]=\"value\"\n    [state]=\"state\"\n    [stateMessage]=\"stateMessage\"\n    [advancedStateMessage]=\"advancedStateMessage\"\n    [mobile]=\"mobile\"\n    [mobileConfig]=\"mobileConfig\"\n    [inline]=\"inline\"\n    [(ngModel)]=\"value\"\n    (valueChange)=\"_onSelection($event)\"\n    (isOpenChange)=\"_onOpenChange($event)\"\n>\n    <ng-content></ng-content>\n    <li fd-option *ngIf=\"noValueLabel\" [disabled]=\"false\" [value]=\"null\">\n        {{ noValueLabel }}\n    </li>\n    <li\n        fd-option\n        *ngFor=\"let item of _optionItems; index as index\"\n        [disabled]=\"!!item.disabled\"\n        [value]=\"item.value\"\n        [attr.aria-labelledby]=\"ariaLabel\"\n        [attr.aria-disabled]=\"disabled\"\n    >\n        <fd-icon *ngIf=\"item.icon\" [glyph]=\"item.icon\" class=\"fd-template-icon icon-margin\"></fd-icon>\n        <ng-container\n            [ngTemplateOutlet]=\"listItem\"\n            [ngTemplateOutletContext]=\"{ optionItem: item, index: index }\"\n        ></ng-container>\n        <ng-container\n            secondary\n            [ngTemplateOutlet]=\"secondaryTextSource\"\n            [ngTemplateOutletContext]=\"{ optionItem: item }\"\n        ></ng-container>\n    </li>\n</fd-select>\n\n<ng-template let-optionItem=\"optionItem\" let-index=\"index\" #listItem>\n    <ng-container\n        *ngIf=\"_isSelectedOptionItem(optionItem) && !!_selectedItemTemplate\"\n        [ngTemplateOutlet]=\"_selectedItemTemplate\"\n        [ngTemplateOutletContext]=\"{ $implicit: optionItem.value, index: index }\"\n    ></ng-container>\n\n    <ng-container *ngIf=\"!(_isSelectedOptionItem(optionItem) && _selectedItemTemplate)\">\n        <ng-container\n            [ngTemplateOutlet]=\"optionItemSource\"\n            [ngTemplateOutletContext]=\"{ optionItem: optionItem, index: index }\"\n        ></ng-container>\n    </ng-container>\n</ng-template>\n\n<ng-template let-optionItem=\"optionItem\" let-index=\"index\" #optionItemSource>\n    <ng-container *ngIf=\"!_optionItemTemplate\">\n        <span [innerHTML]=\"optionItem.label\"></span>\n    </ng-container>\n\n    <ng-container *ngIf=\"_optionItemTemplate\">\n        <ng-container\n            [ngTemplateOutlet]=\"_optionItemTemplate\"\n            [ngTemplateOutletContext]=\"{ $implicit: optionItem.value, index: index }\"\n        ></ng-container>\n    </ng-container>\n</ng-template>\n\n<ng-template let-optionItem=\"optionItem\" #secondaryTextSource>\n    <ng-container *ngIf=\"showSecondaryText\">\n        <ng-container *ngIf=\"!_secondaryItemTemplate\">\n            <span\n                [style.text-align]=\"secondaryTextAlignment\"\n                fd-list-secondary\n                [innerHTML]=\"optionItem.secondaryText\"\n            ></span>\n        </ng-container>\n\n        <ng-container *ngIf=\"_secondaryItemTemplate\">\n            <ng-container\n                [ngTemplateOutlet]=\"_secondaryItemTemplate\"\n                [ngTemplateOutletContext]=\"{ $implicit: optionItem.value }\"\n            ></ng-container>\n        </ng-container>\n    </ng-container>\n</ng-template>\n", styles: ["/*!\n * Fundamental Library Styles v0.30.2-rc.6\n * Copyright (c) 2023 SAP SE or an SAP affiliate company.\n * Licensed under Apache License 2.0 (https://github.com/SAP/fundamental-styles/blob/main/LICENSE)\n */.fd-select{-webkit-box-sizing:border-box;border:0;box-sizing:border-box;color:var(--sapTextColor);font-family:var(--sapFontFamily);font-size:var(--sapFontSize);font-weight:400;forced-color-adjust:none;line-height:var(--sapContent_LineHeight);margin:.25rem 0;padding:0;text-shadow:var(--fdSelect_Text_Shadow)}.fd-select:after,.fd-select:before{box-sizing:inherit;font-size:inherit}.fd-select__control{-webkit-box-sizing:border-box;-webkit-box-shadow:var(--sapField_Shadow);-moz-appearance:none;-webkit-appearance:none;-webkit-box-shadow:none;-webkit-box-pack:center;-ms-flex-pack:center;-webkit-box-align:center;-ms-flex-align:center;-webkit-box-pack:justify;-ms-flex-pack:justify;align-items:center;appearance:none;background:var(--fdSelect_Background, var(--sapField_BackgroundStyle));background-color:var(--fdSelect_Background_Color, var(--sapField_Background));border:0;border:var(--sapField_BorderWidth) var(--sapField_BorderStyle) var(--sapField_BorderColor);border-radius:var(--sapField_BorderCornerRadius);box-shadow:var(--sapField_Shadow);box-shadow:none;box-sizing:border-box;color:var(--sapTextColor);color:var(--sapField_TextColor);cursor:text;cursor:pointer;display:flex;font-family:var(--sapFontFamily);font-size:var(--sapFontSize);font-weight:400;forced-color-adjust:none;gap:.25rem;height:var(--sapElement_Height);justify-content:center;justify-content:space-between;line-height:var(--sapContent_LineHeight);margin:0;min-height:var(--sapElement_Height);min-width:var(--fdSelect_Min_Width, 2.75rem);outline:none;overflow:hidden;padding:0;text-overflow:ellipsis;text-shadow:var(--fdInput_Text_Shadow);white-space:nowrap;width:100%;z-index:1}.fd-select__control:after,.fd-select__control:before{box-sizing:inherit;font-size:inherit}.fd-select__control::placeholder{color:var(--sapField_PlaceholderTextColor);font-style:var(--fdPlaceholder_Font_Style)}.fd-select__control[dir=rtl]::placeholder,[dir=rtl] .fd-select__control::placeholder{text-indent:.125rem}.fd-select__control::selection{background-color:var(--sapSelectedColor);color:var(--sapContent_ContrastTextColor)}.fd-select__control::-ms-clear{display:none}.fd-select__control.is-hover,.fd-select__control:hover{-webkit-box-shadow:var(--fdInput_Box_Shadow_Hover);background:var(--fdSelect_Hover_Background, var(--sapField_Hover_BackgroundStyle));background-color:var(--fdSelect_Hover_Background_Color, var(--sapField_Hover_Background));border-color:var(--sapField_Hover_BorderColor);box-shadow:var(--fdInput_Box_Shadow_Hover)}.fd-select__control.is-focus,.fd-select__control:focus{-webkit-box-shadow:none;background:var(--fdSelect_Focus_Background, var(--sapField_Focus_Background));box-shadow:none;outline-color:var(--fdInput_Outline_Color);outline-offset:var(--fdInput_Outline_Offset);outline-style:var(--sapContent_FocusStyle);outline-width:var(--sapContent_FocusWidth);z-index:5}.fd-select__control.is-success{-webkit-box-shadow:var(--sapField_SuccessShadow);background:var(--sapField_SuccessBackgroundStyle);background-color:var(--sapField_SuccessBackground);border:var(--sapField_SuccessColor) var(--sapField_SuccessBorderWidth) var(--sapField_SuccessBorderStyle);box-shadow:var(--sapField_SuccessShadow)}.fd-select__control.is-success.is-hover,.fd-select__control.is-success:hover{-webkit-box-shadow:var(--fdInput_Success_Box_Shadow_Hover);background-color:var(--fdInput_Success_Background_Color_Hover);border-color:var(--sapField_SuccessColor);box-shadow:var(--fdInput_Success_Box_Shadow_Hover)}.fd-select__control.is-success.is-focus,.fd-select__control.is-success:focus{background:var(--sapField_Focus_Background);outline-color:var(--fdInput_Success_Outline_Color)}.fd-select__control.is-success.is-focus.is-hover,.fd-select__control.is-success.is-focus:hover,.fd-select__control.is-success:focus.is-hover,.fd-select__control.is-success:focus:hover{box-shadow:none}.fd-select__control.is-success.is-expanded,.fd-select__control.is-success[aria-expanded=true]{-webkit-box-shadow:none;background:var(--sapField_Focus_Background);box-shadow:none;outline:var(--sapContent_FocusWidth) var(--sapContent_FocusStyle) var(--fdInput_Success_Outline_Color);outline-offset:var(--fdInput_Outline_Offset)}.fd-select__control.is-error{-webkit-box-shadow:var(--sapField_InvalidShadow);background:var(--sapField_InvalidBackgroundStyle);background-color:var(--sapField_InvalidBackground);border:var(--sapField_InvalidColor) var(--sapField_InvalidBorderWidth) var(--sapField_InvalidBorderStyle);box-shadow:var(--sapField_InvalidShadow)}.fd-select__control.is-error.is-hover,.fd-select__control.is-error:hover{-webkit-box-shadow:var(--fdInput_Error_Box_Shadow_Hover);background-color:var(--fdInput_Error_Background_Color_Hover);border-color:var(--sapField_InvalidColor);box-shadow:var(--fdInput_Error_Box_Shadow_Hover)}.fd-select__control.is-error.is-focus,.fd-select__control.is-error:focus{background:var(--sapField_Focus_Background);outline-color:var(--fdInput_Error_Outline_Color)}.fd-select__control.is-error.is-focus.is-hover,.fd-select__control.is-error.is-focus:hover,.fd-select__control.is-error:focus.is-hover,.fd-select__control.is-error:focus:hover{box-shadow:none}.fd-select__control.is-error.is-expanded,.fd-select__control.is-error[aria-expanded=true]{-webkit-box-shadow:none;background:var(--sapField_Focus_Background);box-shadow:none;outline:var(--sapContent_FocusWidth) var(--sapContent_FocusStyle) var(--fdInput_Error_Outline_Color);outline-offset:var(--fdInput_Outline_Offset)}.fd-select__control.is-warning{-webkit-box-shadow:var(--sapField_WarningShadow);background:var(--sapField_WarningBackgroundStyle);background-color:var(--sapField_WarningBackground);border:var(--sapField_WarningColor) var(--sapField_WarningBorderWidth) var(--sapField_WarningBorderStyle);box-shadow:var(--sapField_WarningShadow)}.fd-select__control.is-warning.is-hover,.fd-select__control.is-warning:hover{-webkit-box-shadow:var(--fdInput_Warning_Box_Shadow_Hover);background-color:var(--fdInput_Warning_Background_Color_Hover);border-color:var(--sapField_WarningColor);box-shadow:var(--fdInput_Warning_Box_Shadow_Hover)}.fd-select__control.is-warning.is-focus,.fd-select__control.is-warning:focus{background:var(--sapField_Focus_Background);outline-color:var(--fdInput_Warning_Outline_Color)}.fd-select__control.is-warning.is-focus.is-hover,.fd-select__control.is-warning.is-focus:hover,.fd-select__control.is-warning:focus.is-hover,.fd-select__control.is-warning:focus:hover{box-shadow:none}.fd-select__control.is-warning.is-expanded,.fd-select__control.is-warning[aria-expanded=true]{-webkit-box-shadow:none;background:var(--sapField_Focus_Background);box-shadow:none;outline:var(--sapContent_FocusWidth) var(--sapContent_FocusStyle) var(--fdInput_Warning_Outline_Color);outline-offset:var(--fdInput_Outline_Offset)}.fd-select__control.is-alert{background:var(--sapField_WarningBackgroundStyle);background-color:var(--sapField_WarningBackground);border:var(--sapField_WarningColor) var(--sapField_WarningBorderWidth) var(--sapField_WarningBorderStyle)}.fd-select__control.is-alert.is-hover,.fd-select__control.is-alert:hover{-webkit-box-shadow:var(--fdInput_Warning_Box_Shadow_Hover);background-color:var(--fdInput_Warning_Background_Color_Hover);border-color:var(--sapField_WarningColor);box-shadow:var(--fdInput_Warning_Box_Shadow_Hover)}.fd-select__control.is-alert.is-focus,.fd-select__control.is-alert:focus{background:var(--sapField_Focus_Background);outline-color:var(--fdInput_Warning_Outline_Color)}.fd-select__control.is-alert.is-focus.is-hover,.fd-select__control.is-alert.is-focus:hover,.fd-select__control.is-alert:focus.is-hover,.fd-select__control.is-alert:focus:hover{box-shadow:none}.fd-select__control.is-alert.is-expanded,.fd-select__control.is-alert[aria-expanded=true]{-webkit-box-shadow:none;background:var(--sapField_Focus_Background);box-shadow:none;outline:var(--sapContent_FocusWidth) var(--sapContent_FocusStyle) var(--fdInput_Warning_Outline_Color);outline-offset:var(--fdInput_Outline_Offset)}.fd-select__control.is-information{-webkit-box-shadow:var(--sapField_InformationShadow);background:var(--sapField_InformationBackgroundStyle);background-color:var(--sapField_InformationBackground);border:var(--sapField_InformationColor) var(--sapField_InformationBorderWidth) var(--sapField_InformationBorderStyle);box-shadow:var(--sapField_InformationShadow)}.fd-select__control.is-information.is-hover,.fd-select__control.is-information:hover{-webkit-box-shadow:var(--fdInput_Information_Box_Shadow_Hover);background-color:var(--fdInput_Information_Background_Color_Hover);border-color:var(--sapField_InformationColor);box-shadow:var(--fdInput_Information_Box_Shadow_Hover)}.fd-select__control.is-information.is-focus,.fd-select__control.is-information:focus{background:var(--sapField_Focus_Background);outline-color:var(--fdInput_Information_Outline_Color)}.fd-select__control.is-information.is-focus.is-hover,.fd-select__control.is-information.is-focus:hover,.fd-select__control.is-information:focus.is-hover,.fd-select__control.is-information:focus:hover{box-shadow:none}.fd-select__control.is-information.is-expanded,.fd-select__control.is-information[aria-expanded=true]{-webkit-box-shadow:none;background:var(--sapField_Focus_Background);box-shadow:none;outline:var(--sapContent_FocusWidth) var(--sapContent_FocusStyle) var(--fdInput_Information_Outline_Color);outline-offset:var(--fdInput_Outline_Offset)}.fd-select__control.is-alert,.fd-select__control.is-error,.fd-select__control.is-warning{font-style:var(--fdInput_State_Text_Style);font-weight:var(--fdInput_State_Font_Weight)}.fd-select__control.is-alert::placeholder,.fd-select__control.is-error::placeholder,.fd-select__control.is-warning::placeholder{font-weight:var(--fdInput_State_Font_Weight)}.fd-select__control.is-alert.is-focus,.fd-select__control.is-alert:focus,.fd-select__control.is-error.is-focus,.fd-select__control.is-error:focus,.fd-select__control.is-information.is-focus,.fd-select__control.is-information:focus,.fd-select__control.is-warning.is-focus,.fd-select__control.is-warning:focus{outline-offset:var(--fdInput_Outline_Offset_States);z-index:5}.fd-select__control.is-error::placeholder{color:var(--sapField_TextColor)}.fd-select__control.is-disabled,.fd-select__control:disabled,.fd-select__control[aria-disabled=true]{opacity:var(--sapContent_DisabledOpacity)}.fd-select__control.is-disabled::placeholder,.fd-select__control:disabled::placeholder,.fd-select__control[aria-disabled=true]::placeholder{color:var(--fdInput_Non_Interactive_State_Placeholder_Color)}.fd-select__control.is-readonly,.fd-select__control[aria-readonly=true],.fd-select__control[readonly]{-webkit-box-shadow:none;background:var(--sapField_ReadOnly_BackgroundStyle);background-color:var(--sapField_ReadOnly_Background);border-color:var(--sapField_ReadOnly_BorderColor);box-shadow:none}.fd-select__control.is-readonly::placeholder,.fd-select__control[aria-readonly=true]::placeholder,.fd-select__control[readonly]::placeholder{color:var(--fdInput_Non_Interactive_State_Placeholder_Color)}.fd-select__control.is-readonly.is-hover,.fd-select__control.is-readonly:hover,.fd-select__control[aria-readonly=true].is-hover,.fd-select__control[aria-readonly=true]:hover,.fd-select__control[readonly].is-hover,.fd-select__control[readonly]:hover{-webkit-box-shadow:none;background:var(--sapField_ReadOnly_BackgroundStyle);background-color:var(--sapField_ReadOnly_Background);border-color:var(--sapField_ReadOnly_BorderColor);box-shadow:none}.fd-select__control.is-readonly.is-focus,.fd-select__control.is-readonly:focus,.fd-select__control[aria-readonly=true].is-focus,.fd-select__control[aria-readonly=true]:focus,.fd-select__control[readonly].is-focus,.fd-select__control[readonly]:focus{-webkit-box-shadow:none;background:var(--sapField_ReadOnly_BackgroundStyle);background-color:var(--sapField_ReadOnly_Background);border-color:var(--sapField_ReadOnly_BorderColor);box-shadow:none;z-index:5}.fd-select__control .fd-select__button:first-child{border-right:var(--fdInputGroup_ControlButton_SideBorder)}.fd-select__control .fd-select__button:first-child[dir=rtl],[dir=rtl] .fd-select__control .fd-select__button:first-child{border-left:var(--fdInputGroup_ControlButton_SideBorder);border-right-style:none}.fd-select__control .fd-select__button:first-child.is-hover,.fd-select__control .fd-select__button:first-child:hover{border-right:var(--fdInputGroup_ControlButton_SideBorder_Active)}.fd-select__control .fd-select__button:first-child.is-hover[dir=rtl],.fd-select__control .fd-select__button:first-child:hover[dir=rtl],[dir=rtl] .fd-select__control .fd-select__button:first-child.is-hover,[dir=rtl] .fd-select__control .fd-select__button:first-child:hover{border-left:var(--fdInputGroup_ControlButton_SideBorder_Active);border-right-style:none}.fd-select__control .fd-select__button:first-child.is-active,.fd-select__control .fd-select__button:first-child:active{border-right:var(--fdInputGroup_ControlButton_SideBorder_Active)}.fd-select__control .fd-select__button:first-child.is-active[dir=rtl],.fd-select__control .fd-select__button:first-child:active[dir=rtl],[dir=rtl] .fd-select__control .fd-select__button:first-child.is-active,[dir=rtl] .fd-select__control .fd-select__button:first-child:active{border-left:var(--fdInputGroup_ControlButton_SideBorder_Active);border-right-style:none}.fd-select__control .fd-select__button:not(:first-child){border-left:var(--fdInputGroup_ControlButton_SideBorder)}.fd-select__control .fd-select__button:not(:first-child)[dir=rtl],[dir=rtl] .fd-select__control .fd-select__button:not(:first-child){border-left-style:none;border-right:var(--fdInputGroup_ControlButton_SideBorder)}.fd-select__control .fd-select__button:not(:first-child).is-hover,.fd-select__control .fd-select__button:not(:first-child):hover{border-left:var(--fdInputGroup_ControlButton_SideBorder_Active)}.fd-select__control .fd-select__button:not(:first-child).is-hover[dir=rtl],.fd-select__control .fd-select__button:not(:first-child):hover[dir=rtl],[dir=rtl] .fd-select__control .fd-select__button:not(:first-child).is-hover,[dir=rtl] .fd-select__control .fd-select__button:not(:first-child):hover{border-left-style:none;border-right:var(--fdInputGroup_ControlButton_SideBorder_Active)}.fd-select__control .fd-select__button:not(:first-child).is-active,.fd-select__control .fd-select__button:not(:first-child):active{border-left:var(--fdInputGroup_ControlButton_SideBorder_Active)}.fd-select__control .fd-select__button:not(:first-child).is-active[dir=rtl],.fd-select__control .fd-select__button:not(:first-child):active[dir=rtl],[dir=rtl] .fd-select__control .fd-select__button:not(:first-child).is-active,[dir=rtl] .fd-select__control .fd-select__button:not(:first-child):active{border-left-style:none;border-right:var(--fdInputGroup_ControlButton_SideBorder_Active)}.fd-select__control .fd-select__addon:first-child .fd-select__button{border-right:var(--fdInputGroup_ControlButton_SideBorder)}.fd-select__control .fd-select__addon:first-child .fd-select__button[dir=rtl],[dir=rtl] .fd-select__control .fd-select__addon:first-child .fd-select__button{border-left:var(--fdInputGroup_ControlButton_SideBorder);border-right-style:none}.fd-select__control .fd-select__addon:first-child .fd-select__button.is-hover,.fd-select__control .fd-select__addon:first-child .fd-select__button:hover{border-right:var(--fdInputGroup_ControlButton_SideBorder_Active)}.fd-select__control .fd-select__addon:first-child .fd-select__button.is-hover[dir=rtl],.fd-select__control .fd-select__addon:first-child .fd-select__button:hover[dir=rtl],[dir=rtl] .fd-select__control .fd-select__addon:first-child .fd-select__button.is-hover,[dir=rtl] .fd-select__control .fd-select__addon:first-child .fd-select__button:hover{border-left:var(--fdInputGroup_ControlButton_SideBorder_Active);border-right-style:none}.fd-select__control .fd-select__addon:first-child .fd-select__button.is-active,.fd-select__control .fd-select__addon:first-child .fd-select__button:active{border-right:var(--fdInputGroup_ControlButton_SideBorder_Active)}.fd-select__control .fd-select__addon:first-child .fd-select__button.is-active[dir=rtl],.fd-select__control .fd-select__addon:first-child .fd-select__button:active[dir=rtl],[dir=rtl] .fd-select__control .fd-select__addon:first-child .fd-select__button.is-active,[dir=rtl] .fd-select__control .fd-select__addon:first-child .fd-select__button:active{border-left:var(--fdInputGroup_ControlButton_SideBorder_Active);border-right-style:none}.fd-select__control .fd-select__addon:not(:first-child) .fd-select__button{border-left:var(--fdInputGroup_ControlButton_SideBorder)}.fd-select__control .fd-select__addon:not(:first-child) .fd-select__button[dir=rtl],[dir=rtl] .fd-select__control .fd-select__addon:not(:first-child) .fd-select__button{border-left-style:none;border-right:var(--fdInputGroup_ControlButton_SideBorder)}.fd-select__control .fd-select__addon:not(:first-child) .fd-select__button.is-hover,.fd-select__control .fd-select__addon:not(:first-child) .fd-select__button:hover{border-left:var(--fdInputGroup_ControlButton_SideBorder_Active)}.fd-select__control .fd-select__addon:not(:first-child) .fd-select__button.is-hover[dir=rtl],.fd-select__control .fd-select__addon:not(:first-child) .fd-select__button:hover[dir=rtl],[dir=rtl] .fd-select__control .fd-select__addon:not(:first-child) .fd-select__button.is-hover,[dir=rtl] .fd-select__control .fd-select__addon:not(:first-child) .fd-select__button:hover{border-left-style:none;border-right:var(--fdInputGroup_ControlButton_SideBorder_Active)}.fd-select__control .fd-select__addon:not(:first-child) .fd-select__button.is-active,.fd-select__control .fd-select__addon:not(:first-child) .fd-select__button:active{border-left:var(--fdInputGroup_ControlButton_SideBorder_Active)}.fd-select__control .fd-select__addon:not(:first-child) .fd-select__button.is-active[dir=rtl],.fd-select__control .fd-select__addon:not(:first-child) .fd-select__button:active[dir=rtl],[dir=rtl] .fd-select__control .fd-select__addon:not(:first-child) .fd-select__button.is-active,[dir=rtl] .fd-select__control .fd-select__addon:not(:first-child) .fd-select__button:active{border-left-style:none;border-right:var(--fdInputGroup_ControlButton_SideBorder_Active)}.fd-select__control .fd-select__button{background:var(--fdInput_Group_Button_Background);background-color:var(--fdButtonBackgroundColor);border:none;border-radius:var(--fdInput_Group_Button_Border_Raduis);color:var(--fdInput_Group_Button_Text_Color);overflow:hidden;position:relative;text-overflow:ellipsis;white-space:nowrap;z-index:auto!important}.fd-select__control .fd-select__button:before{display:none!important}.fd-select__control .fd-select__button:after{border-radius:var(--fdInput_Outline_Border_Radius)}.fd-select__control .fd-select__button.is-hover,.fd-select__control .fd-select__button:hover{--fdInput_Group_Button_Text_Color:var(--fdInput_Group_Button_Hover_Text_Color);--fdButtonBackgroundColor:var(--fdInput_Group_Button_Hover_Background);box-shadow:var(--fdInput_Group_Button_Box_Shadow)}.fd-select__control .fd-select__button.is-active,.fd-select__control .fd-select__button:active{-webkit-box-shadow:var(--fdInput_Group_Button_Box_Shadow);background:var(--fdInput_Group_Button_Active_Background);box-shadow:var(--fdInput_Group_Button_Box_Shadow);color:var(--fdInput_Group_Button_Active_Text_Color)}.fd-select__control.is-success.is-focus,.fd-select__control.is-success:focus{z-index:5}.fd-select__control.is-success.is-focus .fd-select__button,.fd-select__control.is-success:focus .fd-select__button{-webkit-box-shadow:var(--fdInput_Group_Button_Success_Active_Box_Shadow);--fdButtonBackgroundColor:var(--fdInput_Group_Button_Active_Background);box-shadow:var(--fdInput_Group_Button_Success_Active_Box_Shadow);color:var(--fdInput_Group_Button_Success_Active_Text_Color)}.fd-select__control.is-success.is-focus .fd-select__button.is-hover,.fd-select__control.is-success.is-focus .fd-select__button:hover,.fd-select__control.is-success:focus .fd-select__button.is-hover,.fd-select__control.is-success:focus .fd-select__button:hover{--fdButtonBackgroundColor:var(--fdInput_Group_Button_Active_Background)}.fd-select__control.is-success.is-expanded .fd-select__button,.fd-select__control.is-success[aria-expanded=true] .fd-select__button{-webkit-box-shadow:var(--fdInput_Group_Button_Success_Active_Box_Shadow);--fdButtonBackgroundColor:var(--fdInput_Group_Button_Active_Background);box-shadow:var(--fdInput_Group_Button_Success_Active_Box_Shadow);color:var(--fdInput_Group_Button_Success_Active_Text_Color)}.fd-select__control.is-success.is-expanded .fd-select__button.is-hover,.fd-select__control.is-success.is-expanded .fd-select__button:hover,.fd-select__control.is-success[aria-expanded=true] .fd-select__button.is-hover,.fd-select__control.is-success[aria-expanded=true] .fd-select__button:hover{--fdButtonBackgroundColor:var(--fdInput_Group_Button_Active_Background)}.fd-select__control.is-success .fd-select__button.is-active,.fd-select__control.is-success .fd-select__button.is-hover,.fd-select__control.is-success .fd-select__button:active,.fd-select__control.is-success .fd-select__button:hover{box-shadow:var(--fdInput_Group_Button_Success_Active_Box_Shadow)}.fd-select__control.is-success .fd-select__button.is-active,.fd-select__control.is-success .fd-select__button:active{color:var(--fdInput_Group_Button_Success_Active_Text_Color)}.fd-select__control.is-error.is-focus,.fd-select__control.is-error:focus{z-index:5}.fd-select__control.is-error.is-focus .fd-select__button,.fd-select__control.is-error:focus .fd-select__button{-webkit-box-shadow:var(--fdInput_Group_Button_Error_Active_Box_Shadow);--fdButtonBackgroundColor:var(--fdInput_Group_Button_Active_Background);box-shadow:var(--fdInput_Group_Button_Error_Active_Box_Shadow);color:var(--fdInput_Group_Button_Error_Active_Text_Color)}.fd-select__control.is-error.is-focus .fd-select__button.is-hover,.fd-select__control.is-error.is-focus .fd-select__button:hover,.fd-select__control.is-error:focus .fd-select__button.is-hover,.fd-select__control.is-error:focus .fd-select__button:hover{--fdButtonBackgroundColor:var(--fdInput_Group_Button_Active_Background)}.fd-select__control.is-error.is-expanded .fd-select__button,.fd-select__control.is-error[aria-expanded=true] .fd-select__button{-webkit-box-shadow:var(--fdInput_Group_Button_Error_Active_Box_Shadow);--fdButtonBackgroundColor:var(--fdInput_Group_Button_Active_Background);box-shadow:var(--fdInput_Group_Button_Error_Active_Box_Shadow);color:var(--fdInput_Group_Button_Error_Active_Text_Color)}.fd-select__control.is-error.is-expanded .fd-select__button.is-hover,.fd-select__control.is-error.is-expanded .fd-select__button:hover,.fd-select__control.is-error[aria-expanded=true] .fd-select__button.is-hover,.fd-select__control.is-error[aria-expanded=true] .fd-select__button:hover{--fdButtonBackgroundColor:var(--fdInput_Group_Button_Active_Background)}.fd-select__control.is-error .fd-select__button.is-active,.fd-select__control.is-error .fd-select__button.is-hover,.fd-select__control.is-error .fd-select__button:active,.fd-select__control.is-error .fd-select__button:hover{box-shadow:var(--fdInput_Group_Button_Error_Active_Box_Shadow)}.fd-select__control.is-error .fd-select__button.is-active,.fd-select__control.is-error .fd-select__button:active{color:var(--fdInput_Group_Button_Error_Active_Text_Color)}.fd-select__control.is-warning.is-focus,.fd-select__control.is-warning:focus{z-index:5}.fd-select__control.is-warning.is-focus .fd-select__button,.fd-select__control.is-warning:focus .fd-select__button{-webkit-box-shadow:var(--fdInput_Group_Button_Warning_Active_Box_Shadow);--fdButtonBackgroundColor:var(--fdInput_Group_Button_Active_Background);box-shadow:var(--fdInput_Group_Button_Warning_Active_Box_Shadow);color:var(--fdInput_Group_Button_Warning_Active_Text_Color)}.fd-select__control.is-warning.is-focus .fd-select__button.is-hover,.fd-select__control.is-warning.is-focus .fd-select__button:hover,.fd-select__control.is-warning:focus .fd-select__button.is-hover,.fd-select__control.is-warning:focus .fd-select__button:hover{--fdButtonBackgroundColor:var(--fdInput_Group_Button_Active_Background)}.fd-select__control.is-warning.is-expanded .fd-select__button,.fd-select__control.is-warning[aria-expanded=true] .fd-select__button{-webkit-box-shadow:var(--fdInput_Group_Button_Warning_Active_Box_Shadow);--fdButtonBackgroundColor:var(--fdInput_Group_Button_Active_Background);box-shadow:var(--fdInput_Group_Button_Warning_Active_Box_Shadow);color:var(--fdInput_Group_Button_Warning_Active_Text_Color)}.fd-select__control.is-warning.is-expanded .fd-select__button.is-hover,.fd-select__control.is-warning.is-expanded .fd-select__button:hover,.fd-select__control.is-warning[aria-expanded=true] .fd-select__button.is-hover,.fd-select__control.is-warning[aria-expanded=true] .fd-select__button:hover{--fdButtonBackgroundColor:var(--fdInput_Group_Button_Active_Background)}.fd-select__control.is-warning .fd-select__button.is-active,.fd-select__control.is-warning .fd-select__button.is-hover,.fd-select__control.is-warning .fd-select__button:active,.fd-select__control.is-warning .fd-select__button:hover{box-shadow:var(--fdInput_Group_Button_Warning_Active_Box_Shadow)}.fd-select__control.is-warning .fd-select__button.is-active,.fd-select__control.is-warning .fd-select__button:active{color:var(--fdInput_Group_Button_Warning_Active_Text_Color)}.fd-select__control.is-alert.is-focus,.fd-select__control.is-alert:focus{z-index:5}.fd-select__control.is-alert.is-focus .fd-select__button,.fd-select__control.is-alert:focus .fd-select__button{-webkit-box-shadow:var(--fdInput_Group_Button_Warning_Active_Box_Shadow);--fdButtonBackgroundColor:var(--fdInput_Group_Button_Active_Background);box-shadow:var(--fdInput_Group_Button_Warning_Active_Box_Shadow);color:var(--fdInput_Group_Button_Warning_Active_Text_Color)}.fd-select__control.is-alert.is-focus .fd-select__button.is-hover,.fd-select__control.is-alert.is-focus .fd-select__button:hover,.fd-select__control.is-alert:focus .fd-select__button.is-hover,.fd-select__control.is-alert:focus .fd-select__button:hover{--fdButtonBackgroundColor:var(--fdInput_Group_Button_Active_Background)}.fd-select__control.is-alert.is-expanded .fd-select__button,.fd-select__control.is-alert[aria-expanded=true] .fd-select__button{-webkit-box-shadow:var(--fdInput_Group_Button_Warning_Active_Box_Shadow);--fdButtonBackgroundColor:var(--fdInput_Group_Button_Active_Background);box-shadow:var(--fdInput_Group_Button_Warning_Active_Box_Shadow);color:var(--fdInput_Group_Button_Warning_Active_Text_Color)}.fd-select__control.is-alert.is-expanded .fd-select__button.is-hover,.fd-select__control.is-alert.is-expanded .fd-select__button:hover,.fd-select__control.is-alert[aria-expanded=true] .fd-select__button.is-hover,.fd-select__control.is-alert[aria-expanded=true] .fd-select__button:hover{--fdButtonBackgroundColor:var(--fdInput_Group_Button_Active_Background)}.fd-select__control.is-alert .fd-select__button.is-active,.fd-select__control.is-alert .fd-select__button.is-hover,.fd-select__control.is-alert .fd-select__button:active,.fd-select__control.is-alert .fd-select__button:hover{box-shadow:var(--fdInput_Group_Button_Warning_Active_Box_Shadow)}.fd-select__control.is-alert .fd-select__button.is-active,.fd-select__control.is-alert .fd-select__button:active{color:var(--fdInput_Group_Button_Warning_Active_Text_Color)}.fd-select__control.is-information.is-focus,.fd-select__control.is-information:focus{z-index:5}.fd-select__control.is-information.is-focus .fd-select__button,.fd-select__control.is-information:focus .fd-select__button{-webkit-box-shadow:var(--fdInput_Group_Button_Information_Active_Box_Shadow);--fdButtonBackgroundColor:var(--fdInput_Group_Button_Active_Background);box-shadow:var(--fdInput_Group_Button_Information_Active_Box_Shadow);color:var(--fdInput_Group_Button_Information_Active_Text_Color)}.fd-select__control.is-information.is-focus .fd-select__button.is-hover,.fd-select__control.is-information.is-focus .fd-select__button:hover,.fd-select__control.is-information:focus .fd-select__button.is-hover,.fd-select__control.is-information:focus .fd-select__button:hover{--fdButtonBackgroundColor:var(--fdInput_Group_Button_Active_Background)}.fd-select__control.is-information.is-expanded .fd-select__button,.fd-select__control.is-information[aria-expanded=true] .fd-select__button{-webkit-box-shadow:var(--fdInput_Group_Button_Information_Active_Box_Shadow);--fdButtonBackgroundColor:var(--fdInput_Group_Button_Active_Background);box-shadow:var(--fdInput_Group_Button_Information_Active_Box_Shadow);color:var(--fdInput_Group_Button_Information_Active_Text_Color)}.fd-select__control.is-information.is-expanded .fd-select__button.is-hover,.fd-select__control.is-information.is-expanded .fd-select__button:hover,.fd-select__control.is-information[aria-expanded=true] .fd-select__button.is-hover,.fd-select__control.is-information[aria-expanded=true] .fd-select__button:hover{--fdButtonBackgroundColor:var(--fdInput_Group_Button_Active_Background)}.fd-select__control.is-information .fd-select__button.is-active,.fd-select__control.is-information .fd-select__button.is-hover,.fd-select__control.is-information .fd-select__button:active,.fd-select__control.is-information .fd-select__button:hover{box-shadow:var(--fdInput_Group_Button_Information_Active_Box_Shadow)}.fd-select__control.is-information .fd-select__button.is-active,.fd-select__control.is-information .fd-select__button:active{color:var(--fdInput_Group_Button_Information_Active_Text_Color)}.fd-select__control.is-disabled,.fd-select__control:disabled,.fd-select__control[aria-disabled=true]{pointer-events:none}.fd-select__control:after{-webkit-box-shadow:var(--sapField_Shadow);border-radius:var(--sapField_BorderCornerRadius);box-shadow:var(--sapField_Shadow);content:\"\";inset:0;pointer-events:none;position:absolute}.fd-select__control.is-readonly,.fd-select__control[aria-readonly=true],.fd-select__control[readonly]{cursor:text}.fd-select__control.is-readonly .fd-select__text-content,.fd-select__control[aria-readonly=true] .fd-select__text-content,.fd-select__control[readonly] .fd-select__text-content{--fdSelect_Min_Width:5rem;padding-left:.625rem;padding-right:.625rem}.fd-select__control.is-readonly .fd-select__button,.fd-select__control[aria-readonly=true] .fd-select__button,.fd-select__control[readonly] .fd-select__button{opacity:0}.fd-select__control[aria-selected=false] .fd-select__text-content{padding:0 .625rem}.fd-select__control[aria-selected=false] .fd-select__text-content,.fd-select__control[aria-selected=false] .fd-select__text-content [class*=sap-icon]{color:var(--sapField_PlaceholderTextColor);font-style:italic;font-weight:400}.fd-select__text-content{-webkit-box-sizing:border-box;--fdSelect_Min_Width:2.5rem;border:0;box-sizing:border-box;color:var(--sapTextColor);color:var(--fdSelect_Text_Content_Color, var(--sapTextColor));cursor:pointer;display:var(--fdSelect_Text_Content_Display, inline-block);font-family:var(--sapFontFamily);font-size:var(--sapFontSize);font-weight:400;forced-color-adjust:none;line-height:var(--sapContent_LineHeight);margin:0;min-width:calc(var(--fdSelect_Min_Width) - var(--sapField_BorderWidth) * 2);overflow:hidden;padding:0 0 0 .625rem;text-overflow:ellipsis;white-space:nowrap}.fd-select__text-content:after,.fd-select__text-content:before{box-sizing:inherit;font-size:inherit}.fd-select__text-content[dir=rtl],[dir=rtl] .fd-select__text-content{padding-left:0;padding-right:.625rem}.fd-select[class*=-compact],.fd-select[class*=-condensed],[class*=-compact] .fd-select:not([class*=-cozy]),[class*=-condensed] .fd-select:not([class*=-cozy]){margin:.1875rem 0}.fd-select[class*=-compact] .fd-select__control,.fd-select[class*=-condensed] .fd-select__control,[class*=-compact] .fd-select:not([class*=-cozy]) .fd-select__control,[class*=-condensed] .fd-select:not([class*=-cozy]) .fd-select__control{height:1.625rem;min-height:1.625rem}.fd-select[class*=-compact] .fd-select__control .fd-select__text-content,.fd-select[class*=-condensed] .fd-select__control .fd-select__text-content,[class*=-compact] .fd-select:not([class*=-cozy]) .fd-select__control .fd-select__text-content,[class*=-condensed] .fd-select:not([class*=-cozy]) .fd-select__control .fd-select__text-content{--fdSelect_Min_Width:2.75rem;padding-left:.5rem}.fd-select[class*=-compact] .fd-select__control .fd-select__text-content[dir=rtl],.fd-select[class*=-condensed] .fd-select__control .fd-select__text-content[dir=rtl],[class*=-compact] .fd-select:not([class*=-cozy]) .fd-select__control .fd-select__text-content[dir=rtl],[class*=-condensed] .fd-select:not([class*=-cozy]) .fd-select__control .fd-select__text-content[dir=rtl],[dir=rtl] .fd-select[class*=-compact] .fd-select__control .fd-select__text-content,[dir=rtl] .fd-select[class*=-condensed] .fd-select__control .fd-select__text-content,[dir=rtl] [class*=-compact] .fd-select:not([class*=-cozy]) .fd-select__control .fd-select__text-content,[dir=rtl] [class*=-condensed] .fd-select:not([class*=-cozy]) .fd-select__control .fd-select__text-content{padding-left:0;padding-right:.5rem}.fd-select[class*=-compact] .fd-select__control.is-readonly .fd-select__text-content,.fd-select[class*=-compact] .fd-select__control[aria-readonly=true] .fd-select__text-content,.fd-select[class*=-compact] .fd-select__control[readonly] .fd-select__text-content,.fd-select[class*=-condensed] .fd-select__control.is-readonly .fd-select__text-content,.fd-select[class*=-condensed] .fd-select__control[aria-readonly=true] .fd-select__text-content,.fd-select[class*=-condensed] .fd-select__control[readonly] .fd-select__text-content,[class*=-compact] .fd-select:not([class*=-cozy]) .fd-select__control.is-readonly .fd-select__text-content,[class*=-compact] .fd-select:not([class*=-cozy]) .fd-select__control[aria-readonly=true] .fd-select__text-content,[class*=-compact] .fd-select:not([class*=-cozy]) .fd-select__control[readonly] .fd-select__text-content,[class*=-condensed] .fd-select:not([class*=-cozy]) .fd-select__control.is-readonly .fd-select__text-content,[class*=-condensed] .fd-select:not([class*=-cozy]) .fd-select__control[aria-readonly=true] .fd-select__text-content,[class*=-condensed] .fd-select:not([class*=-cozy]) .fd-select__control[readonly] .fd-select__text-content{padding-left:.5rem;padding-right:.5rem}@media (min-width: 600px){[dir=rtl] .fd-container.fd-form-layout-grid-container .fd-row .fd-col-md--10{text-align:right!important}}\n"] }]
         }], ctorParameters: function () { return [{ type: i0.ChangeDetectorRef }, { type: i0.ElementRef }, { type: i1$1.NgControl, decorators: [{
                     type: Optional
                 }, {
@@ -3020,7 +3016,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.1.0", ngImpor
                     type: Optional
                 }, {
                     type: Self
-                }] }, { type: i3$2.DynamicComponentService }, { type: SelectConfig }, { type: i1.PlatformFormField, decorators: [{
+                }] }, { type: i3$1.DynamicComponentService }, { type: SelectConfig }, { type: i1.PlatformFormField, decorators: [{
                     type: Optional
                 }, {
                     type: SkipSelf
@@ -3047,151 +3043,6 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.1.0", ngImpor
                 args: [SelectComponent$1, { static: true }]
             }] } });
 
-class AutoCompleteDirective {
-    /** @hidden */
-    get _element() {
-        return this._elementRef.nativeElement;
-    }
-    /** @hidden */
-    constructor(_elementRef) {
-        this._elementRef = _elementRef;
-        /** Event thrown, when the auto ahead text is accepted */
-        this.onComplete = new EventEmitter();
-        /** @hidden */
-        this._completeKeys = [ENTER];
-        /** @hidden */
-        this._fillKeys = [LEFT_ARROW, RIGHT_ARROW];
-        /** @hidden */
-        this._stopKeys = [BACKSPACE, DELETE, ESCAPE];
-    }
-    /** @hidden */
-    handleBlur() {
-        if (Boolean(this.inputText) && !this.mobile) {
-            this._element.value = this.inputText;
-        }
-    }
-    /** @hidden */
-    handleKeyboardEvent(event) {
-        if (KeyUtil.isKeyCode(event, this._stopKeys)) {
-            this._element.value = this.inputText;
-        }
-        else if (KeyUtil.isKeyCode(event, this._completeKeys)) {
-            this._sendCompleteEvent(true);
-        }
-        else if (KeyUtil.isKeyCode(event, this._fillKeys)) {
-            this._sendCompleteEvent(false);
-        }
-        else if (!this._isControlKey(event) && this.inputText) {
-            /** Prevention from triggering typeahead, when having crtl/cmd + keys */
-            if (!this._triggerTypeAhead()) {
-                return;
-            }
-            this._oldValue = this.inputText;
-            const item = this._searchByStrategy();
-            if (item) {
-                this._typeahead(item.label);
-            }
-        }
-        this._lastKeyUpEvent = event;
-    }
-    /** @hidden */
-    _typeahead(displayedValue) {
-        const selectionStartIndex = this.inputText.length;
-        this._element.value = displayedValue;
-        this._setSelectionRange(selectionStartIndex, displayedValue.length);
-    }
-    /** @hidden */
-    _setSelectionRange(selectionStart, selectionEnd) {
-        const direction = this._element.selectionDirection;
-        this._element.setSelectionRange(selectionStart, selectionEnd, direction ?? undefined);
-    }
-    /** @hidden */
-    _isControlKey(event) {
-        return KeyUtil.isKeyCode(event, CONTROL) || event.ctrlKey;
-    }
-    /** @hidden */
-    _triggerTypeAhead() {
-        return !(this._lastKeyUpEvent &&
-            KeyUtil.isKeyCode(this._lastKeyUpEvent, CONTROL) &&
-            this.inputText === this._oldValue);
-    }
-    /** @hidden */
-    _sendCompleteEvent(forceClose) {
-        this.onComplete.emit({
-            term: this._element.value,
-            forceClose
-        });
-        if (this.inputText !== this._oldValue) {
-            const inputTextLength = this.inputText.length;
-            this._element.setSelectionRange(inputTextLength, inputTextLength);
-        }
-    }
-    /** @hidden */
-    _searchByStrategy() {
-        const [firstItem] = this.options;
-        if (!firstItem) {
-            return;
-        }
-        if (firstItem.isGroup) {
-            let matchedSelectItem;
-            for (const option of this.options) {
-                if (!option.children) {
-                    continue;
-                }
-                matchedSelectItem = this._findByStrategyStartsWith(option.children, this.inputText);
-                if (matchedSelectItem) {
-                    break;
-                }
-            }
-            if (matchedSelectItem) {
-                return matchedSelectItem;
-            }
-        }
-        return this._findByStrategyStartsWith(this.options, this.inputText);
-    }
-    /** @hidden */
-    _findByStrategyStartsWith(options, inputText) {
-        return options.find((option) => option.label.toLocaleLowerCase().startsWith(inputText.toLocaleLowerCase()));
-    }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.1.0", ngImport: i0, type: AutoCompleteDirective, deps: [{ token: i0.ElementRef }], target: i0.ɵɵFactoryTarget.Directive }); }
-    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "16.1.0", type: AutoCompleteDirective, selector: "[fdp-auto-complete]", inputs: { options: "options", inputText: "inputText", mobile: "mobile" }, outputs: { onComplete: "onComplete" }, host: { listeners: { "blur": "handleBlur()", "keyup": "handleKeyboardEvent($event)" } }, ngImport: i0 }); }
-}
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.1.0", ngImport: i0, type: AutoCompleteDirective, decorators: [{
-            type: Directive,
-            args: [{
-                    // eslint-disable-next-line @angular-eslint/directive-selector
-                    selector: '[fdp-auto-complete]'
-                }]
-        }], ctorParameters: function () { return [{ type: i0.ElementRef }]; }, propDecorators: { options: [{
-                type: Input
-            }], inputText: [{
-                type: Input
-            }], mobile: [{
-                type: Input
-            }], onComplete: [{
-                type: Output
-            }], handleBlur: [{
-                type: HostListener,
-                args: ['blur']
-            }], handleKeyboardEvent: [{
-                type: HostListener,
-                args: ['keyup', ['$event']]
-            }] } });
-
-class PlatformAutoCompleteModule {
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.1.0", ngImport: i0, type: PlatformAutoCompleteModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
-    static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "16.1.0", ngImport: i0, type: PlatformAutoCompleteModule, declarations: [AutoCompleteDirective], imports: [CommonModule], exports: [AutoCompleteDirective] }); }
-    static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "16.1.0", ngImport: i0, type: PlatformAutoCompleteModule, imports: [CommonModule] }); }
-}
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.1.0", ngImport: i0, type: PlatformAutoCompleteModule, decorators: [{
-            type: NgModule,
-            args: [{
-                    declarations: [AutoCompleteDirective],
-                    imports: [CommonModule],
-                    exports: [AutoCompleteDirective]
-                }]
-        }] });
-
 // Increasing integer for generating unique ids for radio components.
 let nextUniqueId = 0;
 /**
@@ -3205,7 +3056,7 @@ class OptionComponent {
         this.disabled = false;
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.1.0", ngImport: i0, type: OptionComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.1.0", type: OptionComponent, selector: "fdp-option", inputs: { id: "id", value: "value", disabled: "disabled" }, ngImport: i0, template: `<li fd-option [id]="id" [value]="value" [disabled]="disabled"><ng-content></ng-content></li>`, isInline: true, dependencies: [{ kind: "component", type: i7$2.OptionComponent, selector: "[fd-option], fd-option", inputs: ["id", "value", "disabled"], outputs: ["selectionChange"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.1.0", type: OptionComponent, isStandalone: true, selector: "fdp-option", inputs: { id: "id", value: "value", disabled: "disabled" }, ngImport: i0, template: `<li fd-option [id]="id" [value]="value" [disabled]="disabled"><ng-content></ng-content></li>`, isInline: true, dependencies: [{ kind: "ngmodule", type: SelectModule }, { kind: "component", type: i4$1.OptionComponent, selector: "[fd-option], fd-option", inputs: ["id", "value", "disabled"], outputs: ["selectionChange"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.1.0", ngImport: i0, type: OptionComponent, decorators: [{
             type: Component,
@@ -3213,7 +3064,9 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.1.0", ngImpor
                     selector: 'fdp-option',
                     template: `<li fd-option [id]="id" [value]="value" [disabled]="disabled"><ng-content></ng-content></li>`,
                     encapsulation: ViewEncapsulation.None,
-                    changeDetection: ChangeDetectionStrategy.OnPush
+                    changeDetection: ChangeDetectionStrategy.OnPush,
+                    standalone: true,
+                    imports: [SelectModule]
                 }]
         }], propDecorators: { id: [{
                 type: Input
@@ -3225,51 +3078,14 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.1.0", ngImpor
 
 class PlatformSelectModule {
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.1.0", ngImport: i0, type: PlatformSelectModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
-    static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "16.1.0", ngImport: i0, type: PlatformSelectModule, declarations: [SelectComponent, OptionComponent], imports: [CommonModule,
-            FormsModule,
-            InputGroupModule,
-            ListModule,
-            PipeModule,
-            ButtonModule,
-            PlatformAutoCompleteModule,
-            PopoverModule,
-            IconModule,
-            ReactiveFormsModule,
-            SelectModule,
-            ContentDensityModule], exports: [SelectComponent, OptionComponent, TemplateModule, ContentDensityModule] }); }
-    static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "16.1.0", ngImport: i0, type: PlatformSelectModule, providers: [DynamicComponentService], imports: [CommonModule,
-            FormsModule,
-            InputGroupModule,
-            ListModule,
-            PipeModule,
-            ButtonModule,
-            PlatformAutoCompleteModule,
-            PopoverModule,
-            IconModule,
-            ReactiveFormsModule,
-            SelectModule,
-            ContentDensityModule, TemplateModule, ContentDensityModule] }); }
+    static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "16.1.0", ngImport: i0, type: PlatformSelectModule, imports: [SelectComponent, OptionComponent], exports: [SelectComponent, OptionComponent] }); }
+    static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "16.1.0", ngImport: i0, type: PlatformSelectModule, imports: [SelectComponent, OptionComponent] }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.1.0", ngImport: i0, type: PlatformSelectModule, decorators: [{
             type: NgModule,
             args: [{
-                    declarations: [SelectComponent, OptionComponent],
-                    imports: [
-                        CommonModule,
-                        FormsModule,
-                        InputGroupModule,
-                        ListModule,
-                        PipeModule,
-                        ButtonModule,
-                        PlatformAutoCompleteModule,
-                        PopoverModule,
-                        IconModule,
-                        ReactiveFormsModule,
-                        SelectModule,
-                        ContentDensityModule
-                    ],
-                    providers: [DynamicComponentService],
-                    exports: [SelectComponent, OptionComponent, TemplateModule, ContentDensityModule]
+                    imports: [SelectComponent, OptionComponent],
+                    exports: [SelectComponent, OptionComponent]
                 }]
         }] });
 
@@ -3728,11 +3544,11 @@ class SwitchComponent extends BaseInput {
         this.switchChange.emit(event);
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.1.0", ngImport: i0, type: SwitchComponent, deps: [{ token: i0.ChangeDetectorRef }, { token: i0.ElementRef }, { token: i1$1.NgControl, optional: true, self: true }, { token: i1$1.ControlContainer, optional: true, skipSelf: true }, { token: i1$1.NgForm, optional: true, skipSelf: true }, { token: FD_FORM_FIELD, host: true, optional: true, skipSelf: true }, { token: FD_FORM_FIELD_CONTROL, host: true, optional: true, skipSelf: true }, { token: SwitchConfig }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.1.0", type: SwitchComponent, selector: "fdp-switch", inputs: { ariaLabel: "ariaLabel", ariaLabelledby: "ariaLabelledby", semantic: "semantic" }, outputs: { switchChange: "switchChange" }, providers: [{ provide: FD_FORM_FIELD_CONTROL, useExisting: SwitchComponent, multi: true }], usesInheritance: true, ngImport: i0, template: "<fd-switch\n    [id]=\"id\"\n    [required]=\"required\"\n    [name]=\"name\"\n    [disabled]=\"disabled\"\n    [semantic]=\"semantic\"\n    [ariaLabel]=\"ariaLabel\"\n    [ariaLabelledBy]=\"ariaLabelledby\"\n    [checked]=\"switchCurrentValue\"\n    (checkedChange)=\"onValueChange($event)\"\n></fd-switch>\n", dependencies: [{ kind: "component", type: i3$3.SwitchComponent, selector: "fd-switch", inputs: ["activeText", "inactiveText", "disabled", "id", "name", "required", "checked", "semantic", "ariaLabel", "ariaLabelledBy"], outputs: ["checkedChange"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.1.0", type: SwitchComponent, isStandalone: true, selector: "fdp-switch", inputs: { ariaLabel: "ariaLabel", ariaLabelledby: "ariaLabelledby", semantic: "semantic" }, outputs: { switchChange: "switchChange" }, providers: [{ provide: FD_FORM_FIELD_CONTROL, useExisting: SwitchComponent, multi: true }], usesInheritance: true, ngImport: i0, template: "<fd-switch\n    [id]=\"id\"\n    [required]=\"required\"\n    [name]=\"name\"\n    [disabled]=\"disabled\"\n    [semantic]=\"semantic\"\n    [ariaLabel]=\"ariaLabel\"\n    [ariaLabelledBy]=\"ariaLabelledby\"\n    [checked]=\"switchCurrentValue\"\n    (checkedChange)=\"onValueChange($event)\"\n></fd-switch>\n", dependencies: [{ kind: "ngmodule", type: SwitchModule }, { kind: "component", type: i3$2.SwitchComponent, selector: "fd-switch", inputs: ["activeText", "inactiveText", "disabled", "id", "name", "required", "checked", "semantic", "ariaLabel", "ariaLabelledBy"], outputs: ["checkedChange"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.1.0", ngImport: i0, type: SwitchComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'fdp-switch', changeDetection: ChangeDetectionStrategy.OnPush, providers: [{ provide: FD_FORM_FIELD_CONTROL, useExisting: SwitchComponent, multi: true }], template: "<fd-switch\n    [id]=\"id\"\n    [required]=\"required\"\n    [name]=\"name\"\n    [disabled]=\"disabled\"\n    [semantic]=\"semantic\"\n    [ariaLabel]=\"ariaLabel\"\n    [ariaLabelledBy]=\"ariaLabelledby\"\n    [checked]=\"switchCurrentValue\"\n    (checkedChange)=\"onValueChange($event)\"\n></fd-switch>\n" }]
+            args: [{ selector: 'fdp-switch', changeDetection: ChangeDetectionStrategy.OnPush, providers: [{ provide: FD_FORM_FIELD_CONTROL, useExisting: SwitchComponent, multi: true }], standalone: true, imports: [SwitchModule], template: "<fd-switch\n    [id]=\"id\"\n    [required]=\"required\"\n    [name]=\"name\"\n    [disabled]=\"disabled\"\n    [semantic]=\"semantic\"\n    [ariaLabel]=\"ariaLabel\"\n    [ariaLabelledBy]=\"ariaLabelledby\"\n    [checked]=\"switchCurrentValue\"\n    (checkedChange)=\"onValueChange($event)\"\n></fd-switch>\n" }]
         }], ctorParameters: function () { return [{ type: i0.ChangeDetectorRef }, { type: i0.ElementRef }, { type: i1$1.NgControl, decorators: [{
                     type: Optional
                 }, {
@@ -3775,15 +3591,14 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.1.0", ngImpor
 
 class PlatformSwitchModule {
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.1.0", ngImport: i0, type: PlatformSwitchModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
-    static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "16.1.0", ngImport: i0, type: PlatformSwitchModule, declarations: [SwitchComponent], imports: [CommonModule, FormsModule, SwitchModule, PipeModule, ContentDensityModule], exports: [SwitchComponent, ContentDensityModule] }); }
-    static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "16.1.0", ngImport: i0, type: PlatformSwitchModule, imports: [CommonModule, FormsModule, SwitchModule, PipeModule, ContentDensityModule, ContentDensityModule] }); }
+    static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "16.1.0", ngImport: i0, type: PlatformSwitchModule, imports: [SwitchComponent], exports: [SwitchComponent] }); }
+    static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "16.1.0", ngImport: i0, type: PlatformSwitchModule, imports: [SwitchComponent] }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.1.0", ngImport: i0, type: PlatformSwitchModule, decorators: [{
             type: NgModule,
             args: [{
-                    declarations: [SwitchComponent],
-                    imports: [CommonModule, FormsModule, SwitchModule, PipeModule, ContentDensityModule],
-                    exports: [SwitchComponent, ContentDensityModule]
+                    imports: [SwitchComponent],
+                    exports: [SwitchComponent]
                 }]
         }] });
 
@@ -3800,6 +3615,138 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.1.0", ngImpor
             args: [{ selector: 'fdp-dynamic-form-generator-switch', encapsulation: ViewEncapsulation.None, changeDetection: ChangeDetectionStrategy.OnPush, viewProviders: [dynamicFormFieldProvider, dynamicFormGroupChildProvider], standalone: true, imports: [FormsModule, ReactiveFormsModule, PlatformSwitchModule], template: "<ng-container [formGroup]=\"form\">\n    <ng-container [formGroupName]=\"formGroupName\">\n        <fdp-switch\n            [id]=\"id\"\n            [name]=\"name\"\n            [semantic]=\"formItem.guiOptions?.additionalData?.semantic\"\n            [formControlName]=\"name\"\n        ></fdp-switch>\n    </ng-container>\n</ng-container>\n" }]
         }], ctorParameters: function () { return []; } });
 
+class AutoCompleteDirective {
+    /** @hidden */
+    get _element() {
+        return this._elementRef.nativeElement;
+    }
+    /** @hidden */
+    constructor(_elementRef) {
+        this._elementRef = _elementRef;
+        /** Event thrown, when the auto ahead text is accepted */
+        this.onComplete = new EventEmitter();
+        /** @hidden */
+        this._completeKeys = [ENTER];
+        /** @hidden */
+        this._fillKeys = [LEFT_ARROW, RIGHT_ARROW];
+        /** @hidden */
+        this._stopKeys = [BACKSPACE, DELETE, ESCAPE];
+    }
+    /** @hidden */
+    handleBlur() {
+        if (Boolean(this.inputText) && !this.mobile) {
+            this._element.value = this.inputText;
+        }
+    }
+    /** @hidden */
+    handleKeyboardEvent(event) {
+        if (KeyUtil.isKeyCode(event, this._stopKeys)) {
+            this._element.value = this.inputText;
+        }
+        else if (KeyUtil.isKeyCode(event, this._completeKeys)) {
+            this._sendCompleteEvent(true);
+        }
+        else if (KeyUtil.isKeyCode(event, this._fillKeys)) {
+            this._sendCompleteEvent(false);
+        }
+        else if (!this._isControlKey(event) && this.inputText) {
+            /** Prevention from triggering typeahead, when having crtl/cmd + keys */
+            if (!this._triggerTypeAhead()) {
+                return;
+            }
+            this._oldValue = this.inputText;
+            const item = this._searchByStrategy();
+            if (item) {
+                this._typeahead(item.label);
+            }
+        }
+        this._lastKeyUpEvent = event;
+    }
+    /** @hidden */
+    _typeahead(displayedValue) {
+        const selectionStartIndex = this.inputText.length;
+        this._element.value = displayedValue;
+        this._setSelectionRange(selectionStartIndex, displayedValue.length);
+    }
+    /** @hidden */
+    _setSelectionRange(selectionStart, selectionEnd) {
+        const direction = this._element.selectionDirection;
+        this._element.setSelectionRange(selectionStart, selectionEnd, direction ?? undefined);
+    }
+    /** @hidden */
+    _isControlKey(event) {
+        return KeyUtil.isKeyCode(event, CONTROL) || event.ctrlKey;
+    }
+    /** @hidden */
+    _triggerTypeAhead() {
+        return !(this._lastKeyUpEvent &&
+            KeyUtil.isKeyCode(this._lastKeyUpEvent, CONTROL) &&
+            this.inputText === this._oldValue);
+    }
+    /** @hidden */
+    _sendCompleteEvent(forceClose) {
+        this.onComplete.emit({
+            term: this._element.value,
+            forceClose
+        });
+        if (this.inputText !== this._oldValue) {
+            const inputTextLength = this.inputText.length;
+            this._element.setSelectionRange(inputTextLength, inputTextLength);
+        }
+    }
+    /** @hidden */
+    _searchByStrategy() {
+        const [firstItem] = this.options;
+        if (!firstItem) {
+            return;
+        }
+        if (firstItem.isGroup) {
+            let matchedSelectItem;
+            for (const option of this.options) {
+                if (!option.children) {
+                    continue;
+                }
+                matchedSelectItem = this._findByStrategyStartsWith(option.children, this.inputText);
+                if (matchedSelectItem) {
+                    break;
+                }
+            }
+            if (matchedSelectItem) {
+                return matchedSelectItem;
+            }
+        }
+        return this._findByStrategyStartsWith(this.options, this.inputText);
+    }
+    /** @hidden */
+    _findByStrategyStartsWith(options, inputText) {
+        return options.find((option) => option.label.toLocaleLowerCase().startsWith(inputText.toLocaleLowerCase()));
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.1.0", ngImport: i0, type: AutoCompleteDirective, deps: [{ token: i0.ElementRef }], target: i0.ɵɵFactoryTarget.Directive }); }
+    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "16.1.0", type: AutoCompleteDirective, isStandalone: true, selector: "[fdp-auto-complete]", inputs: { options: "options", inputText: "inputText", mobile: "mobile" }, outputs: { onComplete: "onComplete" }, host: { listeners: { "blur": "handleBlur()", "keyup": "handleKeyboardEvent($event)" } }, ngImport: i0 }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.1.0", ngImport: i0, type: AutoCompleteDirective, decorators: [{
+            type: Directive,
+            args: [{
+                    // eslint-disable-next-line @angular-eslint/directive-selector
+                    selector: '[fdp-auto-complete]',
+                    standalone: true
+                }]
+        }], ctorParameters: function () { return [{ type: i0.ElementRef }]; }, propDecorators: { options: [{
+                type: Input
+            }], inputText: [{
+                type: Input
+            }], mobile: [{
+                type: Input
+            }], onComplete: [{
+                type: Output
+            }], handleBlur: [{
+                type: HostListener,
+                args: ['blur']
+            }], handleKeyboardEvent: [{
+                type: HostListener,
+                args: ['keyup', ['$event']]
+            }] } });
+
 /**
  * Default options for Multi-Input
  */
@@ -4457,11 +4404,11 @@ class PlatformMultiInputMobileComponent extends MobileModeBase {
         });
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.1.0", ngImport: i0, type: PlatformMultiInputMobileComponent, deps: [{ token: i0.ElementRef }, { token: i1$2.DialogService }, { token: MULTIINPUT_COMPONENT }, { token: MOBILE_MODE_CONFIG, optional: true }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.1.0", type: PlatformMultiInputMobileComponent, selector: "fdp-multi-input-mobile", viewQueries: [{ propertyName: "dialogTemplate", first: true, predicate: ["dialogTemplate"], descendants: true }], usesInheritance: true, ngImport: i0, template: "<ng-template let-dialog let-dialogConfig=\"dialogConfig\" #dialogTemplate>\n    <fd-dialog [dialogConfig]=\"dialogConfig\" [dialogRef]=\"dialog\">\n        <fd-dialog-header>\n            <h1 fd-dialog-title *ngIf=\"mobileConfig?.title\">{{ mobileConfig.title }}</h1>\n            <button\n                fd-dialog-close-button\n                *ngIf=\"mobileConfig?.hasCloseButton\"\n                [mobile]=\"true\"\n                (click)=\"_handleDismiss()\"\n            ></button>\n            <ng-template fdkTemplate=\"subheader\">\n                <div fd-bar-middle>\n                    <fd-bar-element [fullWidth]=\"true\" class=\"fdp-multi-dialog-input\">\n                        <ng-container *ngTemplateOutlet=\"childContent?.controlTemplate || null\"></ng-container>\n                    </fd-bar-element>\n                </div>\n            </ng-template>\n        </fd-dialog-header>\n\n        <fd-dialog-body>\n            <ng-container *ngTemplateOutlet=\"childContent?.listTemplate || null\"></ng-container>\n        </fd-dialog-body>\n\n        <fd-dialog-footer>\n            <fd-button-bar\n                *ngIf=\"mobileConfig?.approveButtonText\"\n                fdType=\"emphasized\"\n                [label]=\"mobileConfig.approveButtonText!\"\n                (click)=\"_handleApprove()\"\n            >\n            </fd-button-bar>\n            <fd-button-bar\n                *ngIf=\"mobileConfig?.cancelButtonText\"\n                [label]=\"mobileConfig.cancelButtonText!\"\n                (click)=\"_handleDismiss()\"\n            >\n            </fd-button-bar>\n        </fd-dialog-footer>\n    </fd-dialog>\n</ng-template>\n", styles: [".fdp-multi-dialog-input{display:inline!important}\n"], dependencies: [{ kind: "directive", type: i3.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i3.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: i2$2.BarMiddleDirective, selector: "[fd-bar-middle]" }, { kind: "directive", type: i2$2.BarElementDirective, selector: "fd-bar-element", inputs: ["fullWidth"] }, { kind: "component", type: i2$2.ButtonBarComponent, selector: "fd-button-bar", inputs: ["fullWidth", "fdType", "title", "ariaLabel", "ariaLabelledby", "id"] }, { kind: "component", type: i1$2.DialogComponent, selector: "fd-dialog", inputs: ["class", "dialogRef", "dialogConfig"] }, { kind: "component", type: i1$2.DialogBodyComponent, selector: "fd-dialog-body" }, { kind: "component", type: i1$2.DialogFooterComponent, selector: "fd-dialog-footer" }, { kind: "component", type: i1$2.DialogHeaderComponent, selector: "fd-dialog-header" }, { kind: "component", type: i1$2.DialogCloseButtonComponent, selector: "[fd-dialog-close-button]", inputs: ["mobile", "title"] }, { kind: "directive", type: i1$2.DialogTitleDirective, selector: "[fd-dialog-title]", inputs: ["id"] }, { kind: "directive", type: i3$2.TemplateDirective, selector: "[fdkTemplate]", inputs: ["fdkTemplate"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.1.0", type: PlatformMultiInputMobileComponent, isStandalone: true, selector: "fdp-multi-input-mobile", viewQueries: [{ propertyName: "dialogTemplate", first: true, predicate: ["dialogTemplate"], descendants: true }], usesInheritance: true, ngImport: i0, template: "<ng-template let-dialog let-dialogConfig=\"dialogConfig\" #dialogTemplate>\n    <fd-dialog [dialogConfig]=\"dialogConfig\" [dialogRef]=\"dialog\">\n        <fd-dialog-header>\n            <h1 fd-dialog-title *ngIf=\"mobileConfig?.title\">{{ mobileConfig.title }}</h1>\n            <button\n                fd-dialog-close-button\n                *ngIf=\"mobileConfig?.hasCloseButton\"\n                [mobile]=\"true\"\n                (click)=\"_handleDismiss()\"\n            ></button>\n            <ng-template fdkTemplate=\"subheader\">\n                <div fd-bar-middle>\n                    <fd-bar-element [fullWidth]=\"true\" class=\"fdp-multi-dialog-input\">\n                        <ng-container *ngTemplateOutlet=\"childContent?.controlTemplate || null\"></ng-container>\n                    </fd-bar-element>\n                </div>\n            </ng-template>\n        </fd-dialog-header>\n\n        <fd-dialog-body>\n            <ng-container *ngTemplateOutlet=\"childContent?.listTemplate || null\"></ng-container>\n        </fd-dialog-body>\n\n        <fd-dialog-footer>\n            <fd-button-bar\n                *ngIf=\"mobileConfig?.approveButtonText\"\n                fdType=\"emphasized\"\n                [label]=\"mobileConfig.approveButtonText!\"\n                (click)=\"_handleApprove()\"\n            >\n            </fd-button-bar>\n            <fd-button-bar\n                *ngIf=\"mobileConfig?.cancelButtonText\"\n                [label]=\"mobileConfig.cancelButtonText!\"\n                (click)=\"_handleDismiss()\"\n            >\n            </fd-button-bar>\n        </fd-dialog-footer>\n    </fd-dialog>\n</ng-template>\n", styles: [".fdp-multi-dialog-input{display:inline!important}\n"], dependencies: [{ kind: "ngmodule", type: DialogModule }, { kind: "component", type: i1$2.DialogComponent, selector: "fd-dialog", inputs: ["class", "dialogRef", "dialogConfig"] }, { kind: "component", type: i1$2.DialogBodyComponent, selector: "fd-dialog-body" }, { kind: "component", type: i1$2.DialogFooterComponent, selector: "fd-dialog-footer" }, { kind: "component", type: i1$2.DialogHeaderComponent, selector: "fd-dialog-header" }, { kind: "component", type: i1$2.DialogCloseButtonComponent, selector: "[fd-dialog-close-button]", inputs: ["mobile", "title"] }, { kind: "directive", type: i1$2.DialogTitleDirective, selector: "[fd-dialog-title]", inputs: ["id"] }, { kind: "directive", type: i2$2.BarMiddleDirective, selector: "[fd-bar-middle]" }, { kind: "directive", type: i2$2.BarElementDirective, selector: "fd-bar-element", inputs: ["fullWidth"] }, { kind: "component", type: i2$2.ButtonBarComponent, selector: "fd-button-bar", inputs: ["fullWidth", "fdType", "title", "ariaLabel", "ariaLabelledby", "id"] }, { kind: "directive", type: i3$1.TemplateDirective, selector: "[fdkTemplate]", inputs: ["fdkTemplate"] }, { kind: "directive", type: NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "ngmodule", type: BarModule }, { kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.1.0", ngImport: i0, type: PlatformMultiInputMobileComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'fdp-multi-input-mobile', changeDetection: ChangeDetectionStrategy.OnPush, encapsulation: ViewEncapsulation.None, template: "<ng-template let-dialog let-dialogConfig=\"dialogConfig\" #dialogTemplate>\n    <fd-dialog [dialogConfig]=\"dialogConfig\" [dialogRef]=\"dialog\">\n        <fd-dialog-header>\n            <h1 fd-dialog-title *ngIf=\"mobileConfig?.title\">{{ mobileConfig.title }}</h1>\n            <button\n                fd-dialog-close-button\n                *ngIf=\"mobileConfig?.hasCloseButton\"\n                [mobile]=\"true\"\n                (click)=\"_handleDismiss()\"\n            ></button>\n            <ng-template fdkTemplate=\"subheader\">\n                <div fd-bar-middle>\n                    <fd-bar-element [fullWidth]=\"true\" class=\"fdp-multi-dialog-input\">\n                        <ng-container *ngTemplateOutlet=\"childContent?.controlTemplate || null\"></ng-container>\n                    </fd-bar-element>\n                </div>\n            </ng-template>\n        </fd-dialog-header>\n\n        <fd-dialog-body>\n            <ng-container *ngTemplateOutlet=\"childContent?.listTemplate || null\"></ng-container>\n        </fd-dialog-body>\n\n        <fd-dialog-footer>\n            <fd-button-bar\n                *ngIf=\"mobileConfig?.approveButtonText\"\n                fdType=\"emphasized\"\n                [label]=\"mobileConfig.approveButtonText!\"\n                (click)=\"_handleApprove()\"\n            >\n            </fd-button-bar>\n            <fd-button-bar\n                *ngIf=\"mobileConfig?.cancelButtonText\"\n                [label]=\"mobileConfig.cancelButtonText!\"\n                (click)=\"_handleDismiss()\"\n            >\n            </fd-button-bar>\n        </fd-dialog-footer>\n    </fd-dialog>\n</ng-template>\n", styles: [".fdp-multi-dialog-input{display:inline!important}\n"] }]
+            args: [{ selector: 'fdp-multi-input-mobile', changeDetection: ChangeDetectionStrategy.OnPush, encapsulation: ViewEncapsulation.None, standalone: true, imports: [DialogModule, NgIf, TemplateDirective, BarModule, NgTemplateOutlet, CdkScrollable, ScrollbarDirective], template: "<ng-template let-dialog let-dialogConfig=\"dialogConfig\" #dialogTemplate>\n    <fd-dialog [dialogConfig]=\"dialogConfig\" [dialogRef]=\"dialog\">\n        <fd-dialog-header>\n            <h1 fd-dialog-title *ngIf=\"mobileConfig?.title\">{{ mobileConfig.title }}</h1>\n            <button\n                fd-dialog-close-button\n                *ngIf=\"mobileConfig?.hasCloseButton\"\n                [mobile]=\"true\"\n                (click)=\"_handleDismiss()\"\n            ></button>\n            <ng-template fdkTemplate=\"subheader\">\n                <div fd-bar-middle>\n                    <fd-bar-element [fullWidth]=\"true\" class=\"fdp-multi-dialog-input\">\n                        <ng-container *ngTemplateOutlet=\"childContent?.controlTemplate || null\"></ng-container>\n                    </fd-bar-element>\n                </div>\n            </ng-template>\n        </fd-dialog-header>\n\n        <fd-dialog-body>\n            <ng-container *ngTemplateOutlet=\"childContent?.listTemplate || null\"></ng-container>\n        </fd-dialog-body>\n\n        <fd-dialog-footer>\n            <fd-button-bar\n                *ngIf=\"mobileConfig?.approveButtonText\"\n                fdType=\"emphasized\"\n                [label]=\"mobileConfig.approveButtonText!\"\n                (click)=\"_handleApprove()\"\n            >\n            </fd-button-bar>\n            <fd-button-bar\n                *ngIf=\"mobileConfig?.cancelButtonText\"\n                [label]=\"mobileConfig.cancelButtonText!\"\n                (click)=\"_handleDismiss()\"\n            >\n            </fd-button-bar>\n        </fd-dialog-footer>\n    </fd-dialog>\n</ng-template>\n", styles: [".fdp-multi-dialog-input{display:inline!important}\n"] }]
         }], ctorParameters: function () { return [{ type: i0.ElementRef }, { type: i1$2.DialogService }, { type: undefined, decorators: [{
                     type: Inject,
                     args: [MULTIINPUT_COMPONENT]
@@ -4477,14 +4424,13 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.1.0", ngImpor
 
 class PlatformMultiInputMobileModule {
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.1.0", ngImport: i0, type: PlatformMultiInputMobileModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
-    static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "16.1.0", ngImport: i0, type: PlatformMultiInputMobileModule, declarations: [PlatformMultiInputMobileComponent], imports: [CommonModule, BarModule, DialogModule, ButtonModule], exports: [PlatformMultiInputMobileComponent] }); }
-    static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "16.1.0", ngImport: i0, type: PlatformMultiInputMobileModule, imports: [CommonModule, BarModule, DialogModule, ButtonModule] }); }
+    static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "16.1.0", ngImport: i0, type: PlatformMultiInputMobileModule, imports: [PlatformMultiInputMobileComponent], exports: [PlatformMultiInputMobileComponent] }); }
+    static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "16.1.0", ngImport: i0, type: PlatformMultiInputMobileModule, imports: [PlatformMultiInputMobileComponent] }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.1.0", ngImport: i0, type: PlatformMultiInputMobileModule, decorators: [{
             type: NgModule,
             args: [{
-                    declarations: [PlatformMultiInputMobileComponent],
-                    imports: [CommonModule, BarModule, DialogModule, ButtonModule],
+                    imports: [PlatformMultiInputMobileComponent],
                     exports: [PlatformMultiInputMobileComponent]
                 }]
         }] });
@@ -4822,15 +4768,15 @@ class PlatformMultiInputComponent extends BaseMultiInput {
         const lang = await firstValueFrom(this._language);
         this.ariaLabel = this._translationResolver.resolve(lang, 'coreMultiInput.multiInputAriaLabel');
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.1.0", ngImport: i0, type: PlatformMultiInputComponent, deps: [{ token: i0.ChangeDetectorRef }, { token: i0.ElementRef }, { token: i1$1.NgControl, optional: true, self: true }, { token: i1$1.ControlContainer, optional: true, skipSelf: true }, { token: i1$1.NgForm, optional: true, self: true }, { token: i1$2.DialogConfig, optional: true }, { token: i3$2.DynamicComponentService }, { token: i0.ViewContainerRef }, { token: i0.Injector }, { token: DATA_PROVIDERS, optional: true }, { token: MultiInputConfig }, { token: FD_FORM_FIELD, host: true, optional: true, skipSelf: true }, { token: FD_FORM_FIELD_CONTROL, host: true, optional: true, skipSelf: true }, { token: i5$2.ContentDensityObserver }, { token: FD_LANGUAGE }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.1.0", type: PlatformMultiInputComponent, selector: "fdp-multi-input", inputs: { tokenHiddenId: "tokenHiddenId", type: "type", autofocus: "autofocus", glyphAriaLabel: "glyphAriaLabel", selected: "selected", selectionMode: "selectionMode", hasByLine: "hasByLine", disabled: "disabled", fillControlMode: "fillControlMode", triggers: "triggers", closeOnOutsideClick: "closeOnOutsideClick", addOnButtonClickFn: "addOnButtonClickFn", displayFn: "displayFn" }, outputs: { selectionChange: "selectionChange" }, providers: [
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.1.0", ngImport: i0, type: PlatformMultiInputComponent, deps: [{ token: i0.ChangeDetectorRef }, { token: i0.ElementRef }, { token: i1$1.NgControl, optional: true, self: true }, { token: i1$1.ControlContainer, optional: true, skipSelf: true }, { token: i1$1.NgForm, optional: true, self: true }, { token: i1$2.DialogConfig, optional: true }, { token: i3$1.DynamicComponentService }, { token: i0.ViewContainerRef }, { token: i0.Injector }, { token: DATA_PROVIDERS, optional: true }, { token: MultiInputConfig }, { token: FD_FORM_FIELD, host: true, optional: true, skipSelf: true }, { token: FD_FORM_FIELD_CONTROL, host: true, optional: true, skipSelf: true }, { token: i5$1.ContentDensityObserver }, { token: FD_LANGUAGE }], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.1.0", type: PlatformMultiInputComponent, isStandalone: true, selector: "fdp-multi-input", inputs: { tokenHiddenId: "tokenHiddenId", type: "type", autofocus: "autofocus", glyphAriaLabel: "glyphAriaLabel", selected: "selected", selectionMode: "selectionMode", hasByLine: "hasByLine", disabled: "disabled", fillControlMode: "fillControlMode", triggers: "triggers", closeOnOutsideClick: "closeOnOutsideClick", addOnButtonClickFn: "addOnButtonClickFn", displayFn: "displayFn" }, outputs: { selectionChange: "selectionChange" }, providers: [
             {
                 provide: FD_FORM_FIELD_CONTROL,
                 useExisting: forwardRef(() => PlatformMultiInputComponent),
                 multi: true
             },
             contentDensityObserverProviders()
-        ], viewQueries: [{ propertyName: "listTemplateDD", first: true, predicate: ListComponent$1, descendants: true }, { propertyName: "tokenizer", first: true, predicate: TokenizerComponent, descendants: true }, { propertyName: "controlTemplate", first: true, predicate: ["controlTemplate"], descendants: true }, { propertyName: "listTemplate", first: true, predicate: ["listTemplate"], descendants: true }, { propertyName: "_listItems", predicate: BaseListItem, descendants: true }], usesInheritance: true, ngImport: i0, template: "<div class=\"fd-multi-input\">\n    <ng-container *ngTemplateOutlet=\"mobile ? mobileTemplate : desktopTemplate\"></ng-container>\n</div>\n<ng-template #desktopTemplate>\n    <fd-popover\n        additionalBodyClass=\"fdp-multi-input__list-container\"\n        [isOpen]=\"isOpen && _suggestions.length > 0\"\n        (isOpenChange)=\"_popoverOpenChangeHandle($event)\"\n        [fillControlMode]=\"fillControlMode\"\n        [focusTrapped]=\"true\"\n        [triggers]=\"triggers\"\n        [disabled]=\"disabled || readonly\"\n        [maxWidth]=\"(!autoResize && minWidth) || 0\"\n        [closeOnOutsideClick]=\"closeOnOutsideClick\"\n    >\n        <fd-popover-control>\n            <ng-container *ngTemplateOutlet=\"controlTemplate\"></ng-container>\n        </fd-popover-control>\n        <fd-popover-body>\n            <ng-container *ngTemplateOutlet=\"listTemplate\"></ng-container>\n            <ng-content></ng-content>\n        </fd-popover-body>\n    </fd-popover>\n</ng-template>\n\n<ng-template #mobileTemplate>\n    <ng-container [ngTemplateOutlet]=\"controlTemplate\"></ng-container>\n</ng-template>\n\n<ng-template #controlTemplate>\n    <fd-input-group\n        [button]=\"true\"\n        [buttonFocusable]=\"buttonFocusable\"\n        [isControl]=\"true\"\n        glyph=\"value-help\"\n        [state]=\"state\"\n        [disabled]=\"disabled\"\n        (keydown)=\"removeSelectedTokens($event)\"\n        (addOnButtonClicked)=\"addOnButtonClick($event)\"\n        (click)=\"onInputGroupClicked()\"\n        [glyphAriaLabel]=\"glyphAriaLabel\"\n    >\n        <span [attr.id]=\"tokenHiddenId\" aria-hidden=\"true\" class=\"fdp-multi-input__invisible-text\"\n            >Contains {{ selected.length || 'no' }} token</span\n        >\n        <fd-tokenizer\n            *ngIf=\"selected\"\n            [tokenizerFocusable]=\"false\"\n            [compactCollapse]=\"true\"\n            #tokenizer\n            class=\"fd-multi-input-tokenizer-custom\"\n            (moreClickedEvent)=\"moreClicked()\"\n            tabindex=\"-1\"\n            role=\"listbox\"\n        >\n            <fd-token\n                [readOnly]=\"disabled\"\n                (onCloseClick)=\"removeToken(token)\"\n                *ngFor=\"let token of selected; let i = index\"\n                [attr.aria-posinset]=\"i\"\n                [attr.aria-setsize]=\"selected.length\"\n            >\n                <span>{{ token.label | displayFnPipe : displayFn }}</span>\n            </fd-token>\n\n            <input\n                #searchInputElement\n                type=\"text\"\n                class=\"fd-input fd-multi-input-tokenizer-input fd-tokenizer__input\"\n                fdp-auto-complete\n                autocomplete=\"off\"\n                (onComplete)=\"_onAutoComplete($event)\"\n                (keydown.enter)=\"_onKeydownEnter($event)\"\n                (keydown)=\"onInputKeydownHandler($event)\"\n                [inputText]=\"inputText\"\n                [options]=\"_suggestions\"\n                fd-input-group-input\n                fd-form-control\n                [attr.id]=\"id\"\n                [disabled]=\"disabled\"\n                [(ngModel)]=\"inputText\"\n                (ngModelChange)=\"searchTermChanged()\"\n                [ngModelOptions]=\"{ standalone: true }\"\n                [placeholder]=\"placeholder\"\n                (focus)=\"onTouched(); tokenizer._showAllTokens()\"\n                (blur)=\"tokenizer._hideTokens()\"\n                [attr.aria-expanded]=\"isOpen && _suggestions.length > 0\"\n                [readonly]=\"readonly\"\n                aria-haspopup=\"listbox\"\n                [attr.aria-readonly]=\"readonly\"\n                [attr.aria-label]=\"ariaLabel\"\n                [attr.aria-labelledby]=\"ariaLabelledBy\"\n                [attr.aria-required]=\"required\"\n                [attr.aria-describedby]=\"tokenHiddenId\"\n                aria-roledescription=\"Multi Value Input\"\n                fdkInitialFocus\n                [enabled]=\"autofocus\"\n            />\n        </fd-tokenizer>\n    </fd-input-group>\n</ng-template>\n<ng-template #listTemplate>\n    <fdp-list\n        [noBorder]=\"true\"\n        #listTemplateDD\n        [hasByLine]=\"hasByLine\"\n        [selectionMode]=\"selectionMode\"\n        *ngIf=\"_suggestions && _suggestions.length\"\n        role=\"listbox\"\n        aria-multiselectable=\"true\"\n    >\n        <ng-container *ngIf=\"!isGroup\">\n            <fdp-standard-list-item\n                *ngFor=\"let listItem of _suggestions\"\n                [title]=\"listItem.label\"\n                [description]=\"listItem.description || ''\"\n                [avatar]=\"listItem.avatarSrc\"\n                [value]=\"listItem.value\"\n                (itemSelected)=\"selectionMode !== 'multi' && addToArray(listItem, true)\"\n                (itemCheckboxSelected)=\"_checkboxSelected(listItem, $event)\"\n                (buttonClicked)=\"deleteToken(listItem)\"\n                role=\"option\"\n            >\n            </fdp-standard-list-item>\n        </ng-container>\n        <ng-container *ngIf=\"isGroup\">\n            <ng-container *ngFor=\"let group of _suggestions\">\n                <ng-container *ngIf=\"!groupItemTemplate\">\n                    <fdp-list-group-header [groupHeaderTitle]=\"group.label\"></fdp-list-group-header>\n                </ng-container>\n\n                <ng-container *ngIf=\"groupItemTemplate\">\n                    <ng-container\n                        [ngTemplateOutlet]=\"groupItemTemplate\"\n                        [ngTemplateOutletContext]=\"{ $implicit: { label: group.label } }\"\n                    ></ng-container>\n                </ng-container>\n\n                <fdp-standard-list-item\n                    *ngFor=\"let optionItem of group.children; let i = index\"\n                    [title]=\"optionItem.label\"\n                    [value]=\"optionItem.value\"\n                    (itemSelected)=\"addToArray(optionItem, true)\"\n                    (itemCheckboxSelected)=\"addToArray(optionItem, false)\"\n                    (buttonClicked)=\"deleteToken(optionItem)\"\n                    role=\"option\"\n                >\n                </fdp-standard-list-item>\n            </ng-container>\n        </ng-container>\n    </fdp-list>\n</ng-template>\n", styles: [".fd-multi-input-tokenizer-custom{width:calc(100% - 2.25rem)}.fd-multi-input-tokenizer-custom--compact{width:calc(100% - 2rem)}.fdp-multi-input__list-container.fd-popover__body{width:100%;overflow:hidden;position:relative}.fdp-multi-input__invisible-text{display:none!important}\n"], dependencies: [{ kind: "directive", type: i3.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i3.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i3.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: i1$1.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i1$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$1.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "component", type: i7$3.ListComponent, selector: "fdp-list", inputs: ["selectedItems", "ariaSetsize", "ariaMultiselectable", "loadTitle", "loadingLabel", "delayTime", "itemSize", "loadMore", "loadOnScroll", "role", "listType", "maxHeight", "noBorder", "scrollOffsetPercentage", "selection", "selectionMode", "value", "rowSelection", "dataSource", "navigated", "navigationIndicator", "hasByLine", "hasObject", "unreadIndicator"], outputs: ["selectedItemChange"] }, { kind: "component", type: i7$3.ListGroupHeaderComponent, selector: "fdp-list-group-header", inputs: ["groupHeaderTitle"] }, { kind: "component", type: i7$3.StandardListItemComponent, selector: "fdp-standard-list-item" }, { kind: "component", type: i8.TokenComponent, selector: "fd-token", inputs: ["disabled", "selected", "readOnly"], outputs: ["onCloseClick", "onRemove", "onTokenClick", "onTokenKeydown", "elementFocused"] }, { kind: "component", type: i8.TokenizerComponent, selector: "fd-tokenizer", inputs: ["class", "disableKeyboardDeletion", "compactCollapse", "tokenizerFocusable", "inputValue", "glyph", "moreTerm", "open"], outputs: ["moreClickedEvent"] }, { kind: "component", type: i2.PopoverControlComponent, selector: "fd-popover-control" }, { kind: "component", type: i2.PopoverBodyComponent, selector: "fd-popover-body" }, { kind: "component", type: i2.PopoverComponent, selector: "fd-popover", inputs: ["title", "trigger", "fixedPosition", "id", "mobile", "mobileConfig"] }, { kind: "component", type: i10.InputGroupComponent, selector: "fd-input-group", inputs: ["placement", "required", "inline", "placeholder", "addOnText", "buttonFocusable", "type", "glyph", "button", "disabled", "readonly", "state", "isControl", "showFocus", "isExpanded", "glyphAriaLabel", "iconTitle", "ariaLabelledBy"], outputs: ["addOnButtonClicked", "search"] }, { kind: "directive", type: i10.InputGroupInputDirective, selector: "[fdInputGroupInput], [fd-input-group-input]", inputs: ["class"] }, { kind: "directive", type: AutoCompleteDirective, selector: "[fdp-auto-complete]", inputs: ["options", "inputText", "mobile"], outputs: ["onComplete"] }, { kind: "component", type: i4.FormControlComponent, selector: "[fd-form-control]", inputs: ["state", "type", "class", "ariaLabel", "ariaLabelledBy"] }, { kind: "directive", type: i4.InputFormControlDirective, selector: "input[fd-form-control]" }, { kind: "directive", type: i3$2.InitialFocusDirective, selector: "[fdkInitialFocus]", inputs: ["fdkInitialFocus", "enabled", "focusLastElement"] }, { kind: "pipe", type: i3$2.DisplayFnPipe, name: "displayFnPipe" }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
+        ], viewQueries: [{ propertyName: "listTemplateDD", first: true, predicate: ListComponent$1, descendants: true }, { propertyName: "tokenizer", first: true, predicate: TokenizerComponent, descendants: true }, { propertyName: "controlTemplate", first: true, predicate: ["controlTemplate"], descendants: true }, { propertyName: "listTemplate", first: true, predicate: ["listTemplate"], descendants: true }, { propertyName: "_listItems", predicate: BaseListItem, descendants: true }], usesInheritance: true, ngImport: i0, template: "<div class=\"fd-multi-input\">\n    <ng-container *ngTemplateOutlet=\"mobile ? mobileTemplate : desktopTemplate\"></ng-container>\n</div>\n<ng-template #desktopTemplate>\n    <fd-popover\n        additionalBodyClass=\"fdp-multi-input__list-container\"\n        [isOpen]=\"isOpen && _suggestions.length > 0\"\n        (isOpenChange)=\"_popoverOpenChangeHandle($event)\"\n        [fillControlMode]=\"fillControlMode\"\n        [focusTrapped]=\"true\"\n        [triggers]=\"triggers\"\n        [disabled]=\"disabled || readonly\"\n        [maxWidth]=\"(!autoResize && minWidth) || 0\"\n        [closeOnOutsideClick]=\"closeOnOutsideClick\"\n    >\n        <fd-popover-control>\n            <ng-container *ngTemplateOutlet=\"controlTemplate\"></ng-container>\n        </fd-popover-control>\n        <fd-popover-body>\n            <ng-container *ngTemplateOutlet=\"listTemplate\"></ng-container>\n            <ng-content></ng-content>\n        </fd-popover-body>\n    </fd-popover>\n</ng-template>\n\n<ng-template #mobileTemplate>\n    <ng-container [ngTemplateOutlet]=\"controlTemplate\"></ng-container>\n</ng-template>\n\n<ng-template #controlTemplate>\n    <fd-input-group\n        [button]=\"true\"\n        [buttonFocusable]=\"buttonFocusable\"\n        [isControl]=\"true\"\n        glyph=\"value-help\"\n        [state]=\"state\"\n        [disabled]=\"disabled\"\n        (keydown)=\"removeSelectedTokens($event)\"\n        (addOnButtonClicked)=\"addOnButtonClick($event)\"\n        (click)=\"onInputGroupClicked()\"\n        [glyphAriaLabel]=\"glyphAriaLabel\"\n    >\n        <span [attr.id]=\"tokenHiddenId\" aria-hidden=\"true\" class=\"fdp-multi-input__invisible-text\"\n            >Contains {{ selected.length || 'no' }} token</span\n        >\n        <fd-tokenizer\n            *ngIf=\"selected\"\n            [tokenizerFocusable]=\"false\"\n            [compactCollapse]=\"true\"\n            #tokenizer\n            class=\"fd-multi-input-tokenizer-custom\"\n            (moreClickedEvent)=\"moreClicked()\"\n            tabindex=\"-1\"\n            role=\"listbox\"\n        >\n            <fd-token\n                [readOnly]=\"disabled\"\n                (onCloseClick)=\"removeToken(token)\"\n                *ngFor=\"let token of selected; let i = index\"\n                [attr.aria-posinset]=\"i\"\n                [attr.aria-setsize]=\"selected.length\"\n            >\n                <span>{{ token.label | displayFnPipe : displayFn }}</span>\n            </fd-token>\n\n            <input\n                #searchInputElement\n                type=\"text\"\n                class=\"fd-input fd-multi-input-tokenizer-input fd-tokenizer__input\"\n                fdp-auto-complete\n                autocomplete=\"off\"\n                (onComplete)=\"_onAutoComplete($event)\"\n                (keydown.enter)=\"_onKeydownEnter($event)\"\n                (keydown)=\"onInputKeydownHandler($event)\"\n                [inputText]=\"inputText\"\n                [options]=\"_suggestions\"\n                fd-input-group-input\n                fd-form-control\n                [attr.id]=\"id\"\n                [disabled]=\"disabled\"\n                [(ngModel)]=\"inputText\"\n                (ngModelChange)=\"searchTermChanged()\"\n                [ngModelOptions]=\"{ standalone: true }\"\n                [placeholder]=\"placeholder\"\n                (focus)=\"onTouched(); tokenizer._showAllTokens()\"\n                (blur)=\"tokenizer._hideTokens()\"\n                [attr.aria-expanded]=\"isOpen && _suggestions.length > 0\"\n                [readonly]=\"readonly\"\n                aria-haspopup=\"listbox\"\n                [attr.aria-readonly]=\"readonly\"\n                [attr.aria-label]=\"ariaLabel\"\n                [attr.aria-labelledby]=\"ariaLabelledBy\"\n                [attr.aria-required]=\"required\"\n                [attr.aria-describedby]=\"tokenHiddenId\"\n                aria-roledescription=\"Multi Value Input\"\n                fdkInitialFocus\n                [enabled]=\"autofocus\"\n            />\n        </fd-tokenizer>\n    </fd-input-group>\n</ng-template>\n<ng-template #listTemplate>\n    <fdp-list\n        [noBorder]=\"true\"\n        #listTemplateDD\n        [hasByLine]=\"hasByLine\"\n        [selectionMode]=\"selectionMode\"\n        *ngIf=\"_suggestions && _suggestions.length\"\n        role=\"listbox\"\n        aria-multiselectable=\"true\"\n    >\n        <ng-container *ngIf=\"!isGroup\">\n            <fdp-standard-list-item\n                *ngFor=\"let listItem of _suggestions\"\n                [title]=\"listItem.label\"\n                [description]=\"listItem.description || ''\"\n                [avatar]=\"listItem.avatarSrc\"\n                [value]=\"listItem.value\"\n                (itemSelected)=\"selectionMode !== 'multi' && addToArray(listItem, true)\"\n                (itemCheckboxSelected)=\"_checkboxSelected(listItem, $event)\"\n                (buttonClicked)=\"deleteToken(listItem)\"\n                role=\"option\"\n            >\n            </fdp-standard-list-item>\n        </ng-container>\n        <ng-container *ngIf=\"isGroup\">\n            <ng-container *ngFor=\"let group of _suggestions\">\n                <ng-container *ngIf=\"!groupItemTemplate\">\n                    <fdp-list-group-header [groupHeaderTitle]=\"group.label\"></fdp-list-group-header>\n                </ng-container>\n\n                <ng-container *ngIf=\"groupItemTemplate\">\n                    <ng-container\n                        [ngTemplateOutlet]=\"groupItemTemplate\"\n                        [ngTemplateOutletContext]=\"{ $implicit: { label: group.label } }\"\n                    ></ng-container>\n                </ng-container>\n\n                <fdp-standard-list-item\n                    *ngFor=\"let optionItem of group.children; let i = index\"\n                    [title]=\"optionItem.label\"\n                    [value]=\"optionItem.value\"\n                    (itemSelected)=\"addToArray(optionItem, true)\"\n                    (itemCheckboxSelected)=\"addToArray(optionItem, false)\"\n                    (buttonClicked)=\"deleteToken(optionItem)\"\n                    role=\"option\"\n                >\n                </fdp-standard-list-item>\n            </ng-container>\n        </ng-container>\n    </fdp-list>\n</ng-template>\n", styles: [".fd-multi-input-tokenizer-custom{width:calc(100% - 2.25rem)}.fd-multi-input-tokenizer-custom--compact{width:calc(100% - 2rem)}.fdp-multi-input__list-container.fd-popover__body{width:100%;overflow:hidden;position:relative}.fdp-multi-input__invisible-text{display:none!important}\n"], dependencies: [{ kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: PopoverComponent, selector: "fd-popover", inputs: ["title", "trigger", "fixedPosition", "id", "mobile", "mobileConfig"] }, { kind: "component", type: PopoverControlComponent, selector: "fd-popover-control" }, { kind: "component", type: PopoverBodyComponent, selector: "fd-popover-body" }, { kind: "ngmodule", type: InputGroupModule }, { kind: "component", type: i6.InputGroupComponent, selector: "fd-input-group", inputs: ["placement", "required", "inline", "placeholder", "addOnText", "buttonFocusable", "type", "glyph", "button", "disabled", "readonly", "state", "isControl", "showFocus", "isExpanded", "glyphAriaLabel", "iconTitle", "ariaLabelledBy"], outputs: ["addOnButtonClicked", "search"] }, { kind: "directive", type: i6.InputGroupInputDirective, selector: "[fdInputGroupInput], [fd-input-group-input]", inputs: ["class"] }, { kind: "directive", type: NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "ngmodule", type: TokenModule }, { kind: "component", type: i7.TokenComponent, selector: "fd-token", inputs: ["disabled", "selected", "readOnly"], outputs: ["onCloseClick", "onRemove", "onTokenClick", "onTokenKeydown", "elementFocused"] }, { kind: "component", type: i7.TokenizerComponent, selector: "fd-tokenizer", inputs: ["class", "disableKeyboardDeletion", "compactCollapse", "tokenizerFocusable", "inputValue", "glyph", "moreTerm", "open"], outputs: ["moreClickedEvent"] }, { kind: "directive", type: NgFor, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "ngmodule", type: FormControlModule }, { kind: "component", type: i3.FormControlComponent, selector: "[fd-form-control]", inputs: ["state", "type", "class", "ariaLabel", "ariaLabelledBy"] }, { kind: "directive", type: i3.InputFormControlDirective, selector: "input[fd-form-control]" }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1$1.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i1$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$1.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "directive", type: AutoCompleteDirective, selector: "[fdp-auto-complete]", inputs: ["options", "inputText", "mobile"], outputs: ["onComplete"] }, { kind: "directive", type: InitialFocusDirective, selector: "[fdkInitialFocus]", inputs: ["fdkInitialFocus", "enabled", "focusLastElement"] }, { kind: "ngmodule", type: PlatformListModule }, { kind: "component", type: i9.ListComponent, selector: "fdp-list", inputs: ["selectedItems", "ariaSetsize", "ariaMultiselectable", "loadTitle", "loadingLabel", "delayTime", "itemSize", "loadMore", "loadOnScroll", "role", "listType", "maxHeight", "noBorder", "scrollOffsetPercentage", "selection", "selectionMode", "value", "rowSelection", "dataSource", "navigated", "navigationIndicator", "hasByLine", "hasObject", "unreadIndicator"], outputs: ["selectedItemChange"] }, { kind: "component", type: i9.ListGroupHeaderComponent, selector: "fdp-list-group-header", inputs: ["groupHeaderTitle"] }, { kind: "component", type: i9.StandardListItemComponent, selector: "fdp-standard-list-item" }, { kind: "ngmodule", type: StandardListItemModule }, { kind: "pipe", type: DisplayFnPipe, name: "displayFnPipe" }, { kind: "ngmodule", type: ContentDensityModule }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.1.0", ngImport: i0, type: PlatformMultiInputComponent, decorators: [{
             type: Component,
@@ -4841,6 +4787,23 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.1.0", ngImpor
                             multi: true
                         },
                         contentDensityObserverProviders()
+                    ], standalone: true, imports: [
+                        NgTemplateOutlet,
+                        PopoverComponent,
+                        PopoverControlComponent,
+                        PopoverBodyComponent,
+                        InputGroupModule,
+                        NgIf,
+                        TokenModule,
+                        NgFor,
+                        FormControlModule,
+                        FormsModule,
+                        AutoCompleteDirective,
+                        InitialFocusDirective,
+                        PlatformListModule,
+                        StandardListItemModule,
+                        DisplayFnPipe,
+                        ContentDensityModule
                     ], template: "<div class=\"fd-multi-input\">\n    <ng-container *ngTemplateOutlet=\"mobile ? mobileTemplate : desktopTemplate\"></ng-container>\n</div>\n<ng-template #desktopTemplate>\n    <fd-popover\n        additionalBodyClass=\"fdp-multi-input__list-container\"\n        [isOpen]=\"isOpen && _suggestions.length > 0\"\n        (isOpenChange)=\"_popoverOpenChangeHandle($event)\"\n        [fillControlMode]=\"fillControlMode\"\n        [focusTrapped]=\"true\"\n        [triggers]=\"triggers\"\n        [disabled]=\"disabled || readonly\"\n        [maxWidth]=\"(!autoResize && minWidth) || 0\"\n        [closeOnOutsideClick]=\"closeOnOutsideClick\"\n    >\n        <fd-popover-control>\n            <ng-container *ngTemplateOutlet=\"controlTemplate\"></ng-container>\n        </fd-popover-control>\n        <fd-popover-body>\n            <ng-container *ngTemplateOutlet=\"listTemplate\"></ng-container>\n            <ng-content></ng-content>\n        </fd-popover-body>\n    </fd-popover>\n</ng-template>\n\n<ng-template #mobileTemplate>\n    <ng-container [ngTemplateOutlet]=\"controlTemplate\"></ng-container>\n</ng-template>\n\n<ng-template #controlTemplate>\n    <fd-input-group\n        [button]=\"true\"\n        [buttonFocusable]=\"buttonFocusable\"\n        [isControl]=\"true\"\n        glyph=\"value-help\"\n        [state]=\"state\"\n        [disabled]=\"disabled\"\n        (keydown)=\"removeSelectedTokens($event)\"\n        (addOnButtonClicked)=\"addOnButtonClick($event)\"\n        (click)=\"onInputGroupClicked()\"\n        [glyphAriaLabel]=\"glyphAriaLabel\"\n    >\n        <span [attr.id]=\"tokenHiddenId\" aria-hidden=\"true\" class=\"fdp-multi-input__invisible-text\"\n            >Contains {{ selected.length || 'no' }} token</span\n        >\n        <fd-tokenizer\n            *ngIf=\"selected\"\n            [tokenizerFocusable]=\"false\"\n            [compactCollapse]=\"true\"\n            #tokenizer\n            class=\"fd-multi-input-tokenizer-custom\"\n            (moreClickedEvent)=\"moreClicked()\"\n            tabindex=\"-1\"\n            role=\"listbox\"\n        >\n            <fd-token\n                [readOnly]=\"disabled\"\n                (onCloseClick)=\"removeToken(token)\"\n                *ngFor=\"let token of selected; let i = index\"\n                [attr.aria-posinset]=\"i\"\n                [attr.aria-setsize]=\"selected.length\"\n            >\n                <span>{{ token.label | displayFnPipe : displayFn }}</span>\n            </fd-token>\n\n            <input\n                #searchInputElement\n                type=\"text\"\n                class=\"fd-input fd-multi-input-tokenizer-input fd-tokenizer__input\"\n                fdp-auto-complete\n                autocomplete=\"off\"\n                (onComplete)=\"_onAutoComplete($event)\"\n                (keydown.enter)=\"_onKeydownEnter($event)\"\n                (keydown)=\"onInputKeydownHandler($event)\"\n                [inputText]=\"inputText\"\n                [options]=\"_suggestions\"\n                fd-input-group-input\n                fd-form-control\n                [attr.id]=\"id\"\n                [disabled]=\"disabled\"\n                [(ngModel)]=\"inputText\"\n                (ngModelChange)=\"searchTermChanged()\"\n                [ngModelOptions]=\"{ standalone: true }\"\n                [placeholder]=\"placeholder\"\n                (focus)=\"onTouched(); tokenizer._showAllTokens()\"\n                (blur)=\"tokenizer._hideTokens()\"\n                [attr.aria-expanded]=\"isOpen && _suggestions.length > 0\"\n                [readonly]=\"readonly\"\n                aria-haspopup=\"listbox\"\n                [attr.aria-readonly]=\"readonly\"\n                [attr.aria-label]=\"ariaLabel\"\n                [attr.aria-labelledby]=\"ariaLabelledBy\"\n                [attr.aria-required]=\"required\"\n                [attr.aria-describedby]=\"tokenHiddenId\"\n                aria-roledescription=\"Multi Value Input\"\n                fdkInitialFocus\n                [enabled]=\"autofocus\"\n            />\n        </fd-tokenizer>\n    </fd-input-group>\n</ng-template>\n<ng-template #listTemplate>\n    <fdp-list\n        [noBorder]=\"true\"\n        #listTemplateDD\n        [hasByLine]=\"hasByLine\"\n        [selectionMode]=\"selectionMode\"\n        *ngIf=\"_suggestions && _suggestions.length\"\n        role=\"listbox\"\n        aria-multiselectable=\"true\"\n    >\n        <ng-container *ngIf=\"!isGroup\">\n            <fdp-standard-list-item\n                *ngFor=\"let listItem of _suggestions\"\n                [title]=\"listItem.label\"\n                [description]=\"listItem.description || ''\"\n                [avatar]=\"listItem.avatarSrc\"\n                [value]=\"listItem.value\"\n                (itemSelected)=\"selectionMode !== 'multi' && addToArray(listItem, true)\"\n                (itemCheckboxSelected)=\"_checkboxSelected(listItem, $event)\"\n                (buttonClicked)=\"deleteToken(listItem)\"\n                role=\"option\"\n            >\n            </fdp-standard-list-item>\n        </ng-container>\n        <ng-container *ngIf=\"isGroup\">\n            <ng-container *ngFor=\"let group of _suggestions\">\n                <ng-container *ngIf=\"!groupItemTemplate\">\n                    <fdp-list-group-header [groupHeaderTitle]=\"group.label\"></fdp-list-group-header>\n                </ng-container>\n\n                <ng-container *ngIf=\"groupItemTemplate\">\n                    <ng-container\n                        [ngTemplateOutlet]=\"groupItemTemplate\"\n                        [ngTemplateOutletContext]=\"{ $implicit: { label: group.label } }\"\n                    ></ng-container>\n                </ng-container>\n\n                <fdp-standard-list-item\n                    *ngFor=\"let optionItem of group.children; let i = index\"\n                    [title]=\"optionItem.label\"\n                    [value]=\"optionItem.value\"\n                    (itemSelected)=\"addToArray(optionItem, true)\"\n                    (itemCheckboxSelected)=\"addToArray(optionItem, false)\"\n                    (buttonClicked)=\"deleteToken(optionItem)\"\n                    role=\"option\"\n                >\n                </fdp-standard-list-item>\n            </ng-container>\n        </ng-container>\n    </fdp-list>\n</ng-template>\n", styles: [".fd-multi-input-tokenizer-custom{width:calc(100% - 2.25rem)}.fd-multi-input-tokenizer-custom--compact{width:calc(100% - 2rem)}.fdp-multi-input__list-container.fd-popover__body{width:100%;overflow:hidden;position:relative}.fdp-multi-input__invisible-text{display:none!important}\n"] }]
         }], ctorParameters: function () { return [{ type: i0.ChangeDetectorRef }, { type: i0.ElementRef }, { type: i1$1.NgControl, decorators: [{
                     type: Optional
@@ -4856,7 +4819,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.1.0", ngImpor
                     type: Self
                 }] }, { type: i1$2.DialogConfig, decorators: [{
                     type: Optional
-                }] }, { type: i3$2.DynamicComponentService }, { type: i0.ViewContainerRef }, { type: i0.Injector }, { type: Map, decorators: [{
+                }] }, { type: i3$1.DynamicComponentService }, { type: i0.ViewContainerRef }, { type: i0.Injector }, { type: Map, decorators: [{
                     type: Optional
                 }, {
                     type: Inject,
@@ -4879,7 +4842,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.1.0", ngImpor
                 }, {
                     type: Inject,
                     args: [FD_FORM_FIELD_CONTROL]
-                }] }, { type: i5$2.ContentDensityObserver }, { type: i14.Observable, decorators: [{
+                }] }, { type: i5$1.ContentDensityObserver }, { type: i11.Observable, decorators: [{
                     type: Inject,
                     args: [FD_LANGUAGE]
                 }] }]; }, propDecorators: { tokenHiddenId: [{
@@ -4929,50 +4892,14 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.1.0", ngImpor
 
 class PlatformMultiInputModule {
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.1.0", ngImport: i0, type: PlatformMultiInputModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
-    static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "16.1.0", ngImport: i0, type: PlatformMultiInputModule, declarations: [PlatformMultiInputComponent], imports: [CommonModule,
-            FormsModule,
-            PlatformListModule,
-            StandardListItemModule,
-            TokenModule,
-            PipeModule,
-            PopoverModule,
-            InputGroupModule,
-            PlatformAutoCompleteModule,
-            FormModule,
-            ContentDensityModule,
-            InitialFocusModule], exports: [PlatformMultiInputComponent, ContentDensityModule] }); }
-    static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "16.1.0", ngImport: i0, type: PlatformMultiInputModule, imports: [CommonModule,
-            FormsModule,
-            PlatformListModule,
-            StandardListItemModule,
-            TokenModule,
-            PipeModule,
-            PopoverModule,
-            InputGroupModule,
-            PlatformAutoCompleteModule,
-            FormModule,
-            ContentDensityModule,
-            InitialFocusModule, ContentDensityModule] }); }
+    static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "16.1.0", ngImport: i0, type: PlatformMultiInputModule, imports: [PlatformMultiInputComponent], exports: [PlatformMultiInputComponent] }); }
+    static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "16.1.0", ngImport: i0, type: PlatformMultiInputModule, imports: [PlatformMultiInputComponent] }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.1.0", ngImport: i0, type: PlatformMultiInputModule, decorators: [{
             type: NgModule,
             args: [{
-                    declarations: [PlatformMultiInputComponent],
-                    imports: [
-                        CommonModule,
-                        FormsModule,
-                        PlatformListModule,
-                        StandardListItemModule,
-                        TokenModule,
-                        PipeModule,
-                        PopoverModule,
-                        InputGroupModule,
-                        PlatformAutoCompleteModule,
-                        FormModule,
-                        ContentDensityModule,
-                        InitialFocusModule
-                    ],
-                    exports: [PlatformMultiInputComponent, ContentDensityModule]
+                    imports: [PlatformMultiInputComponent],
+                    exports: [PlatformMultiInputComponent]
                 }]
         }] });
 
@@ -5634,7 +5561,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.1.0", ngImpor
                     selector: '[fdpDynamicFormControl]',
                     standalone: true
                 }]
-        }], ctorParameters: function () { return [{ type: FormGeneratorService }, { type: i0.ViewContainerRef }, { type: i0.Injector }, { type: i14.Observable, decorators: [{
+        }], ctorParameters: function () { return [{ type: FormGeneratorService }, { type: i0.ViewContainerRef }, { type: i0.Injector }, { type: i11.Observable, decorators: [{
                     type: Optional
                 }, {
                     type: Inject,
@@ -5671,6 +5598,22 @@ class FieldGroup {
     }
 }
 
+class FieldGroupRowValuePipe {
+    /** @hidden */
+    transform(row) {
+        return row.value instanceof FieldGroup ? row.value.fields : row.value;
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.1.0", ngImport: i0, type: FieldGroupRowValuePipe, deps: [], target: i0.ɵɵFactoryTarget.Pipe }); }
+    static { this.ɵpipe = i0.ɵɵngDeclarePipe({ minVersion: "14.0.0", version: "16.1.0", ngImport: i0, type: FieldGroupRowValuePipe, isStandalone: true, name: "fieldGroupRowValue" }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.1.0", ngImport: i0, type: FieldGroupRowValuePipe, decorators: [{
+            type: Pipe,
+            args: [{
+                    name: 'fieldGroupRowValue',
+                    standalone: true
+                }]
+        }] });
+
 class FormGroupHeaderComponent {
     /** Hint options */
     get hintOptions() {
@@ -5680,30 +5623,17 @@ class FormGroupHeaderComponent {
         return;
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.1.0", ngImport: i0, type: FormGroupHeaderComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.1.0", type: FormGroupHeaderComponent, selector: "[fdp-form-group-header]", inputs: { fieldGroup: "fieldGroup" }, host: { properties: { "class.fd-form-group__header": "true" } }, ngImport: i0, template: "<ng-container *ngIf=\"fieldGroup && hintOptions?.position === 'before'\">\n    <ng-container *ngTemplateOutlet=\"inlineHelpRef\"></ng-container>\n</ng-container>\n\n<h6 class=\"fd-form-group__header-text\">\n    {{ fieldGroup?.label }}\n</h6>\n\n<ng-container *ngIf=\"fieldGroup && hintOptions?.position === 'after'\">\n    <ng-container *ngTemplateOutlet=\"inlineHelpRef\"></ng-container>\n</ng-container>\n\n<ng-template #inlineHelpRef>\n    <span *ngIf=\"hintOptions\" fd-link [undecorated]=\"true\">\n        <fd-icon\n            [style.vertical-align]=\"'middle'\"\n            [fd-inline-help]=\"hintOptions.content\"\n            [glyph]=\"hintOptions.glyph\"\n            [placement]=\"hintOptions.placement || null\"\n            [triggers]=\"hintOptions.trigger || []\"\n            tabindex=\"0\"\n        ></fd-icon>\n    </span>\n</ng-template>\n", dependencies: [{ kind: "directive", type: i3.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i3.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: i5.InlineHelpDirective, selector: "[fd-inline-help]:not([fd-inline-help-template]), [fd-inline-help-template]:not([fd-inline-help])", inputs: ["triggers", "noArrow", "closeOnEscapeKey", "closeOnOutsideClick", "fd-inline-help"] }, { kind: "component", type: i6.IconComponent, selector: "fd-icon", inputs: ["glyph", "font", "class", "ariaLabel"] }, { kind: "component", type: i7.LinkComponent, selector: "[fdLink], [fd-link]", inputs: ["class", "emphasized", "disabled", "inverted", "subtle", "undecorated"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.1.0", type: FormGroupHeaderComponent, isStandalone: true, selector: "[fdp-form-group-header]", inputs: { fieldGroup: "fieldGroup" }, host: { properties: { "class.fd-form-group__header": "true" } }, ngImport: i0, template: "<ng-container *ngIf=\"fieldGroup && hintOptions?.position === 'before'\">\n    <ng-container *ngTemplateOutlet=\"inlineHelpRef\"></ng-container>\n</ng-container>\n\n<h6 class=\"fd-form-group__header-text\">\n    {{ fieldGroup?.label }}\n</h6>\n\n<ng-container *ngIf=\"fieldGroup && hintOptions?.position === 'after'\">\n    <ng-container *ngTemplateOutlet=\"inlineHelpRef\"></ng-container>\n</ng-container>\n\n<ng-template #inlineHelpRef>\n    <span *ngIf=\"hintOptions\" fd-link [undecorated]=\"true\">\n        <fd-icon\n            [style.vertical-align]=\"'middle'\"\n            [fd-inline-help]=\"hintOptions.content\"\n            [glyph]=\"hintOptions.glyph\"\n            [placement]=\"hintOptions.placement || null\"\n            [triggers]=\"hintOptions.trigger || []\"\n            tabindex=\"0\"\n        ></fd-icon>\n    </span>\n</ng-template>\n", dependencies: [{ kind: "directive", type: NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: LinkComponent, selector: "[fdLink], [fd-link]", inputs: ["class", "emphasized", "disabled", "inverted", "subtle", "undecorated"] }, { kind: "ngmodule", type: IconModule }, { kind: "component", type: i4.IconComponent, selector: "fd-icon", inputs: ["glyph", "font", "class", "ariaLabel"] }, { kind: "ngmodule", type: InlineHelpModule }, { kind: "directive", type: i5.InlineHelpDirective, selector: "[fd-inline-help]:not([fd-inline-help-template]), [fd-inline-help-template]:not([fd-inline-help])", inputs: ["triggers", "noArrow", "closeOnEscapeKey", "closeOnOutsideClick", "fd-inline-help"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.1.0", ngImport: i0, type: FormGroupHeaderComponent, decorators: [{
             type: Component,
             args: [{ selector: '[fdp-form-group-header]', changeDetection: ChangeDetectionStrategy.OnPush, encapsulation: ViewEncapsulation.None, host: {
                         '[class.fd-form-group__header]': 'true'
-                    }, template: "<ng-container *ngIf=\"fieldGroup && hintOptions?.position === 'before'\">\n    <ng-container *ngTemplateOutlet=\"inlineHelpRef\"></ng-container>\n</ng-container>\n\n<h6 class=\"fd-form-group__header-text\">\n    {{ fieldGroup?.label }}\n</h6>\n\n<ng-container *ngIf=\"fieldGroup && hintOptions?.position === 'after'\">\n    <ng-container *ngTemplateOutlet=\"inlineHelpRef\"></ng-container>\n</ng-container>\n\n<ng-template #inlineHelpRef>\n    <span *ngIf=\"hintOptions\" fd-link [undecorated]=\"true\">\n        <fd-icon\n            [style.vertical-align]=\"'middle'\"\n            [fd-inline-help]=\"hintOptions.content\"\n            [glyph]=\"hintOptions.glyph\"\n            [placement]=\"hintOptions.placement || null\"\n            [triggers]=\"hintOptions.trigger || []\"\n            tabindex=\"0\"\n        ></fd-icon>\n    </span>\n</ng-template>\n" }]
+                    }, standalone: true, imports: [NgIf, NgTemplateOutlet, LinkComponent, IconModule, InlineHelpModule], template: "<ng-container *ngIf=\"fieldGroup && hintOptions?.position === 'before'\">\n    <ng-container *ngTemplateOutlet=\"inlineHelpRef\"></ng-container>\n</ng-container>\n\n<h6 class=\"fd-form-group__header-text\">\n    {{ fieldGroup?.label }}\n</h6>\n\n<ng-container *ngIf=\"fieldGroup && hintOptions?.position === 'after'\">\n    <ng-container *ngTemplateOutlet=\"inlineHelpRef\"></ng-container>\n</ng-container>\n\n<ng-template #inlineHelpRef>\n    <span *ngIf=\"hintOptions\" fd-link [undecorated]=\"true\">\n        <fd-icon\n            [style.vertical-align]=\"'middle'\"\n            [fd-inline-help]=\"hintOptions.content\"\n            [glyph]=\"hintOptions.glyph\"\n            [placement]=\"hintOptions.placement || null\"\n            [triggers]=\"hintOptions.trigger || []\"\n            tabindex=\"0\"\n        ></fd-icon>\n    </span>\n</ng-template>\n" }]
         }], propDecorators: { fieldGroup: [{
                 type: Input
             }] } });
 
-class FieldGroupRowValuePipe {
-    /** @hidden */
-    transform(row) {
-        return row.value instanceof FieldGroup ? row.value.fields : row.value;
-    }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.1.0", ngImport: i0, type: FieldGroupRowValuePipe, deps: [], target: i0.ɵɵFactoryTarget.Pipe }); }
-    static { this.ɵpipe = i0.ɵɵngDeclarePipe({ minVersion: "14.0.0", version: "16.1.0", ngImport: i0, type: FieldGroupRowValuePipe, name: "fieldGroupRowValue" }); }
-}
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.1.0", ngImport: i0, type: FieldGroupRowValuePipe, decorators: [{
-            type: Pipe,
-            args: [{ name: 'fieldGroupRowValue' }]
-        }] });
-
 /**
  * @license
  * F. Kolar
@@ -6148,15 +6078,28 @@ class FormGroupComponent {
             .pipe(debounceTime(20))
             .subscribe(() => this._cd.markForCheck()));
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.1.0", ngImport: i0, type: FormGroupComponent, deps: [{ token: i0.ChangeDetectorRef }, { token: i0.ElementRef }, { token: i1$1.ControlContainer, optional: true }, { token: i5$2.ContentDensityObserver }, { token: FDP_FORM_FIELD_HINT_OPTIONS_DEFAULT }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.1.0", type: FormGroupComponent, selector: "fdp-form-group", inputs: { id: "id", name: "name", editable: "editable", noLabelLayout: "noLabelLayout", class: "class", hint: "hint", inlineColumnLayout: "inlineColumnLayout", labelColumnLayout: "labelColumnLayout", fieldColumnLayout: "fieldColumnLayout", gapColumnLayout: "gapColumnLayout", formGroup: "formGroup", topTitle: "topTitle", mainTitle: "mainTitle", hideMainTItle: "hideMainTItle", object: "object", i18Strings: "i18Strings", useForm: "useForm", columnLayout: "columnLayout", unifiedLayout: "unifiedLayout" }, outputs: { onSubmit: "onSubmit" }, providers: [formGroupProvider, FormFieldLayoutService, contentDensityObserverProviders()], queries: [{ propertyName: "i18Template", first: true, predicate: ["i18n"], descendants: true, static: true }, { propertyName: "_errorDirectives", predicate: FormFieldErrorDirective }, { propertyName: "formGroupChildren", predicate: FORM_GROUP_CHILD_FIELD_TOKEN, descendants: true }], viewQueries: [{ propertyName: "nativeForm", first: true, predicate: ["nativeForm"], descendants: true, read: NgForm }], usesOnChanges: true, ngImport: i0, template: "<form #nativeForm (ngSubmit)=\"onSubmit.emit($event)\" *ngIf=\"useForm; else body\" [id]=\"id\" [name]=\"name\">\n    <ng-container *ngTemplateOutlet=\"body\"></ng-container>\n</form>\n\n<ng-template #body>\n    <!--  Render fields and field groups with assigned columns -->\n    <ng-container *ngTemplateOutlet=\"fields\"></ng-container>\n</ng-template>\n\n<ng-template #fields>\n    <div *ngIf=\"mainTitle && !hideMainTItle\" class=\"fd-form-header\">\n        <ng-template [ngTemplateOutlet]=\"mainTitleTemplate\"></ng-template>\n    </div>\n\n    <div\n        class=\"fd-container fd-form-layout-grid-container\"\n        [class.is-compact]=\"contentDensityObserver.isCompact$ | async\"\n    >\n        <div *ngFor=\"let column of formRows | keyvalue; trackBy: trackByFn\" class=\"fd-row\">\n            <div\n                *ngFor=\"let fields of column | fieldGroupRowValue | keyvalue; trackBy: trackByFn; let index = index\"\n                class=\"fd-col fd-form-group\"\n                [class]=\"xlCol\"\n            >\n                <div class=\"fd-row\" *ngIf=\"$fieldGroup(column.value) as value\">\n                    <div class=\"fd-col\">\n                        <div *ngIf=\"value.label\" fdp-form-group-header [fieldGroup]=\"index === 0 ? value : null\"></div>\n                    </div>\n                </div>\n\n                <div *ngFor=\"let field of fields.value; trackBy: trackByFieldName\" class=\"fd-row fd-form-item\">\n                    <div class=\"fd-col\" [class]=\"_inlineColumnLayoutClass\" [style.order]=\"field.rank\">\n                        <ng-container *ngTemplateOutlet=\"field?.renderer || null\"></ng-container>\n                    </div>\n                </div>\n            </div>\n        </div>\n    </div>\n</ng-template>\n\n<!-- For nested form-group -->\n<ng-content select=\"fdp-form-group\"></ng-content>\n\n<ng-template #mainTitleTemplate>\n    <ng-container *ngIf=\"_hintOptions?.content && _hintOptions.position === 'before'\">\n        <ng-template [ngTemplateOutlet]=\"hintTemplate\"></ng-template>\n    </ng-container>\n\n    <h5 class=\"fd-form-header__text\">\n        {{ mainTitle }}\n    </h5>\n\n    <ng-container *ngIf=\"_hintOptions?.content && _hintOptions.position === 'after'\">\n        <ng-template [ngTemplateOutlet]=\"hintTemplate\"></ng-template>\n    </ng-container>\n\n    <ng-template #hintTemplate>\n        <span fd-link [undecorated]=\"true\">\n            <fd-icon\n                [fd-inline-help]=\"_hintOptions.content\"\n                [glyph]=\"_hintOptions.glyph\"\n                [placement]=\"_hintOptions.placement || null\"\n                [triggers]=\"_hintOptions.trigger || []\"\n                tabindex=\"0\"\n            ></fd-icon>\n        </span>\n    </ng-template>\n</ng-template>\n", styles: [".fd-col,.fd-container,.fd-row{-webkit-box-sizing:border-box;border:0;box-sizing:border-box;color:var(--sapTextColor);font-family:var(--sapFontFamily);font-size:var(--sapFontSize);font-weight:400;forced-color-adjust:none;line-height:var(--sapContent_LineHeight);margin:0;padding:0}.fd-col:after,.fd-col:before,.fd-container:after,.fd-container:before,.fd-row:after,.fd-row:before{box-sizing:inherit;font-size:inherit}.fd-container{-ms-flex-wrap:wrap;-webkit-box-flex:0;-ms-flex:0 0 100%;display:flex;flex:0 0 100%;flex-wrap:wrap;padding:0 .25rem;position:relative}.fd-container .fd-row{margin-left:-.25rem;margin-right:-.25rem;min-width:calc(100% + .5rem)}.fd-container>.fd-row>.fd-col{padding-bottom:.25rem;padding-top:.25rem}.fd-container.fd-container--no-gap .fd-row,.fd-container.fd-container--no-horizontal-gap .fd-row{margin-left:0;margin-right:0}.fd-container.fd-container--no-gap .fd-row .fd-col,.fd-container.fd-container--no-horizontal-gap .fd-row .fd-col{padding-left:0;padding-right:0}.fd-container.fd-container--no-gap>.fd-row>.fd-col,.fd-container.fd-container--no-vertical-gap>.fd-row>.fd-col{padding-bottom:0;padding-top:0}.fd-container[dir=rtl],[dir=rtl] .fd-container{direction:rtl}.fd-row{-ms-flex-wrap:wrap;-webkit-box-flex:0;-ms-flex:0 0 100%;display:flex;flex:0 0 100%;flex-wrap:wrap;min-width:100%;position:relative}.fd-col{max-width:100%;min-width:100%;padding-left:.25rem;padding-right:.25rem}.fd-col--0{max-width:0;min-width:0%}.fd-col--offset-0{margin-left:0}.fd-col--offset-0[dir=rtl],[dir=rtl] .fd-col--offset-0{margin-left:0;margin-right:0}.fd-col--offset-after-0{margin-right:0}.fd-col--offset-after-0[dir=rtl],[dir=rtl] .fd-col--offset-after-0{margin-left:0;margin-right:0}.fd-col--1{max-width:8.3333333333%;min-width:8.3333333333%}.fd-col--offset-1{margin-left:8.3333333333%}.fd-col--offset-1[dir=rtl],[dir=rtl] .fd-col--offset-1{margin-left:0;margin-right:8.3333333333%}.fd-col--offset-after-1{margin-right:8.3333333333%}.fd-col--offset-after-1[dir=rtl],[dir=rtl] .fd-col--offset-after-1{margin-left:8.3333333333%;margin-right:0}.fd-col--2{max-width:16.6666666667%;min-width:16.6666666667%}.fd-col--offset-2{margin-left:16.6666666667%}.fd-col--offset-2[dir=rtl],[dir=rtl] .fd-col--offset-2{margin-left:0;margin-right:16.6666666667%}.fd-col--offset-after-2{margin-right:16.6666666667%}.fd-col--offset-after-2[dir=rtl],[dir=rtl] .fd-col--offset-after-2{margin-left:16.6666666667%;margin-right:0}.fd-col--3{max-width:25%;min-width:25%}.fd-col--offset-3{margin-left:25%}.fd-col--offset-3[dir=rtl],[dir=rtl] .fd-col--offset-3{margin-left:0;margin-right:25%}.fd-col--offset-after-3{margin-right:25%}.fd-col--offset-after-3[dir=rtl],[dir=rtl] .fd-col--offset-after-3{margin-left:25%;margin-right:0}.fd-col--4{max-width:33.3333333333%;min-width:33.3333333333%}.fd-col--offset-4{margin-left:33.3333333333%}.fd-col--offset-4[dir=rtl],[dir=rtl] .fd-col--offset-4{margin-left:0;margin-right:33.3333333333%}.fd-col--offset-after-4{margin-right:33.3333333333%}.fd-col--offset-after-4[dir=rtl],[dir=rtl] .fd-col--offset-after-4{margin-left:33.3333333333%;margin-right:0}.fd-col--5{max-width:41.6666666667%;min-width:41.6666666667%}.fd-col--offset-5{margin-left:41.6666666667%}.fd-col--offset-5[dir=rtl],[dir=rtl] .fd-col--offset-5{margin-left:0;margin-right:41.6666666667%}.fd-col--offset-after-5{margin-right:41.6666666667%}.fd-col--offset-after-5[dir=rtl],[dir=rtl] .fd-col--offset-after-5{margin-left:41.6666666667%;margin-right:0}.fd-col--6{max-width:50%;min-width:50%}.fd-col--offset-6{margin-left:50%}.fd-col--offset-6[dir=rtl],[dir=rtl] .fd-col--offset-6{margin-left:0;margin-right:50%}.fd-col--offset-after-6{margin-right:50%}.fd-col--offset-after-6[dir=rtl],[dir=rtl] .fd-col--offset-after-6{margin-left:50%;margin-right:0}.fd-col--7{max-width:58.3333333333%;min-width:58.3333333333%}.fd-col--offset-7{margin-left:58.3333333333%}.fd-col--offset-7[dir=rtl],[dir=rtl] .fd-col--offset-7{margin-left:0;margin-right:58.3333333333%}.fd-col--offset-after-7{margin-right:58.3333333333%}.fd-col--offset-after-7[dir=rtl],[dir=rtl] .fd-col--offset-after-7{margin-left:58.3333333333%;margin-right:0}.fd-col--8{max-width:66.6666666667%;min-width:66.6666666667%}.fd-col--offset-8{margin-left:66.6666666667%}.fd-col--offset-8[dir=rtl],[dir=rtl] .fd-col--offset-8{margin-left:0;margin-right:66.6666666667%}.fd-col--offset-after-8{margin-right:66.6666666667%}.fd-col--offset-after-8[dir=rtl],[dir=rtl] .fd-col--offset-after-8{margin-left:66.6666666667%;margin-right:0}.fd-col--9{max-width:75%;min-width:75%}.fd-col--offset-9{margin-left:75%}.fd-col--offset-9[dir=rtl],[dir=rtl] .fd-col--offset-9{margin-left:0;margin-right:75%}.fd-col--offset-after-9{margin-right:75%}.fd-col--offset-after-9[dir=rtl],[dir=rtl] .fd-col--offset-after-9{margin-left:75%;margin-right:0}.fd-col--10{max-width:83.3333333333%;min-width:83.3333333333%}.fd-col--offset-10{margin-left:83.3333333333%}.fd-col--offset-10[dir=rtl],[dir=rtl] .fd-col--offset-10{margin-left:0;margin-right:83.3333333333%}.fd-col--offset-after-10{margin-right:83.3333333333%}.fd-col--offset-after-10[dir=rtl],[dir=rtl] .fd-col--offset-after-10{margin-left:83.3333333333%;margin-right:0}.fd-col--11{max-width:91.6666666667%;min-width:91.6666666667%}.fd-col--offset-11{margin-left:91.6666666667%}.fd-col--offset-11[dir=rtl],[dir=rtl] .fd-col--offset-11{margin-left:0;margin-right:91.6666666667%}.fd-col--offset-after-11{margin-right:91.6666666667%}.fd-col--offset-after-11[dir=rtl],[dir=rtl] .fd-col--offset-after-11{margin-left:91.6666666667%;margin-right:0}.fd-col--12{max-width:100%;min-width:100%}.fd-col--offset-12{margin-left:100%}.fd-col--offset-12[dir=rtl],[dir=rtl] .fd-col--offset-12{margin-left:0;margin-right:100%}.fd-col--offset-after-12{margin-right:100%}.fd-col--offset-after-12[dir=rtl],[dir=rtl] .fd-col--offset-after-12{margin-left:100%;margin-right:0}.fd-col--full{flex:1;max-width:none;min-width:8.3333333333%}.fd-col--wrap{flex-wrap:wrap}@media (min-width: 600px){.fd-container{padding:0 .5rem}.fd-container .fd-row{margin-left:-.5rem;margin-right:-.5rem;min-width:calc(100% + 1rem)}.fd-container>.fd-row>.fd-col{padding-bottom:.5rem;padding-top:.5rem}.fd-col{padding-left:.5rem;padding-right:.5rem}.fd-col-md--0{max-width:0;min-width:0%}.fd-col-md--offset-0{margin-left:0}.fd-col-md--offset-0[dir=rtl],[dir=rtl] .fd-col-md--offset-0{margin-left:0;margin-right:0}.fd-col-md--offset-after-0{margin-right:0}.fd-col-md--offset-after-0[dir=rtl],[dir=rtl] .fd-col-md--offset-after-0{margin-left:0;margin-right:0}.fd-col-md--1{max-width:8.3333333333%;min-width:8.3333333333%}.fd-col-md--offset-1{margin-left:8.3333333333%}.fd-col-md--offset-1[dir=rtl],[dir=rtl] .fd-col-md--offset-1{margin-left:0;margin-right:8.3333333333%}.fd-col-md--offset-after-1{margin-right:8.3333333333%}.fd-col-md--offset-after-1[dir=rtl],[dir=rtl] .fd-col-md--offset-after-1{margin-left:8.3333333333%;margin-right:0}.fd-col-md--2{max-width:16.6666666667%;min-width:16.6666666667%}.fd-col-md--offset-2{margin-left:16.6666666667%}.fd-col-md--offset-2[dir=rtl],[dir=rtl] .fd-col-md--offset-2{margin-left:0;margin-right:16.6666666667%}.fd-col-md--offset-after-2{margin-right:16.6666666667%}.fd-col-md--offset-after-2[dir=rtl],[dir=rtl] .fd-col-md--offset-after-2{margin-left:16.6666666667%;margin-right:0}.fd-col-md--3{max-width:25%;min-width:25%}.fd-col-md--offset-3{margin-left:25%}.fd-col-md--offset-3[dir=rtl],[dir=rtl] .fd-col-md--offset-3{margin-left:0;margin-right:25%}.fd-col-md--offset-after-3{margin-right:25%}.fd-col-md--offset-after-3[dir=rtl],[dir=rtl] .fd-col-md--offset-after-3{margin-left:25%;margin-right:0}.fd-col-md--4{max-width:33.3333333333%;min-width:33.3333333333%}.fd-col-md--offset-4{margin-left:33.3333333333%}.fd-col-md--offset-4[dir=rtl],[dir=rtl] .fd-col-md--offset-4{margin-left:0;margin-right:33.3333333333%}.fd-col-md--offset-after-4{margin-right:33.3333333333%}.fd-col-md--offset-after-4[dir=rtl],[dir=rtl] .fd-col-md--offset-after-4{margin-left:33.3333333333%;margin-right:0}.fd-col-md--5{max-width:41.6666666667%;min-width:41.6666666667%}.fd-col-md--offset-5{margin-left:41.6666666667%}.fd-col-md--offset-5[dir=rtl],[dir=rtl] .fd-col-md--offset-5{margin-left:0;margin-right:41.6666666667%}.fd-col-md--offset-after-5{margin-right:41.6666666667%}.fd-col-md--offset-after-5[dir=rtl],[dir=rtl] .fd-col-md--offset-after-5{margin-left:41.6666666667%;margin-right:0}.fd-col-md--6{max-width:50%;min-width:50%}.fd-col-md--offset-6{margin-left:50%}.fd-col-md--offset-6[dir=rtl],[dir=rtl] .fd-col-md--offset-6{margin-left:0;margin-right:50%}.fd-col-md--offset-after-6{margin-right:50%}.fd-col-md--offset-after-6[dir=rtl],[dir=rtl] .fd-col-md--offset-after-6{margin-left:50%;margin-right:0}.fd-col-md--7{max-width:58.3333333333%;min-width:58.3333333333%}.fd-col-md--offset-7{margin-left:58.3333333333%}.fd-col-md--offset-7[dir=rtl],[dir=rtl] .fd-col-md--offset-7{margin-left:0;margin-right:58.3333333333%}.fd-col-md--offset-after-7{margin-right:58.3333333333%}.fd-col-md--offset-after-7[dir=rtl],[dir=rtl] .fd-col-md--offset-after-7{margin-left:58.3333333333%;margin-right:0}.fd-col-md--8{max-width:66.6666666667%;min-width:66.6666666667%}.fd-col-md--offset-8{margin-left:66.6666666667%}.fd-col-md--offset-8[dir=rtl],[dir=rtl] .fd-col-md--offset-8{margin-left:0;margin-right:66.6666666667%}.fd-col-md--offset-after-8{margin-right:66.6666666667%}.fd-col-md--offset-after-8[dir=rtl],[dir=rtl] .fd-col-md--offset-after-8{margin-left:66.6666666667%;margin-right:0}.fd-col-md--9{max-width:75%;min-width:75%}.fd-col-md--offset-9{margin-left:75%}.fd-col-md--offset-9[dir=rtl],[dir=rtl] .fd-col-md--offset-9{margin-left:0;margin-right:75%}.fd-col-md--offset-after-9{margin-right:75%}.fd-col-md--offset-after-9[dir=rtl],[dir=rtl] .fd-col-md--offset-after-9{margin-left:75%;margin-right:0}.fd-col-md--10{max-width:83.3333333333%;min-width:83.3333333333%}.fd-col-md--offset-10{margin-left:83.3333333333%}.fd-col-md--offset-10[dir=rtl],[dir=rtl] .fd-col-md--offset-10{margin-left:0;margin-right:83.3333333333%}.fd-col-md--offset-after-10{margin-right:83.3333333333%}.fd-col-md--offset-after-10[dir=rtl],[dir=rtl] .fd-col-md--offset-after-10{margin-left:83.3333333333%;margin-right:0}.fd-col-md--11{max-width:91.6666666667%;min-width:91.6666666667%}.fd-col-md--offset-11{margin-left:91.6666666667%}.fd-col-md--offset-11[dir=rtl],[dir=rtl] .fd-col-md--offset-11{margin-left:0;margin-right:91.6666666667%}.fd-col-md--offset-after-11{margin-right:91.6666666667%}.fd-col-md--offset-after-11[dir=rtl],[dir=rtl] .fd-col-md--offset-after-11{margin-left:91.6666666667%;margin-right:0}.fd-col-md--12{max-width:100%;min-width:100%}.fd-col-md--offset-12{margin-left:100%}.fd-col-md--offset-12[dir=rtl],[dir=rtl] .fd-col-md--offset-12{margin-left:0;margin-right:100%}.fd-col-md--offset-after-12{margin-right:100%}.fd-col-md--offset-after-12[dir=rtl],[dir=rtl] .fd-col-md--offset-after-12{margin-left:100%;margin-right:0}}@media (min-width: 1024px){.fd-col-lg--0{max-width:0;min-width:0%}.fd-col-lg--offset-0{margin-left:0}.fd-col-lg--offset-0[dir=rtl],[dir=rtl] .fd-col-lg--offset-0{margin-left:0;margin-right:0}.fd-col-lg--offset-after-0{margin-right:0}.fd-col-lg--offset-after-0[dir=rtl],[dir=rtl] .fd-col-lg--offset-after-0{margin-left:0;margin-right:0}.fd-col-lg--1{max-width:8.3333333333%;min-width:8.3333333333%}.fd-col-lg--offset-1{margin-left:8.3333333333%}.fd-col-lg--offset-1[dir=rtl],[dir=rtl] .fd-col-lg--offset-1{margin-left:0;margin-right:8.3333333333%}.fd-col-lg--offset-after-1{margin-right:8.3333333333%}.fd-col-lg--offset-after-1[dir=rtl],[dir=rtl] .fd-col-lg--offset-after-1{margin-left:8.3333333333%;margin-right:0}.fd-col-lg--2{max-width:16.6666666667%;min-width:16.6666666667%}.fd-col-lg--offset-2{margin-left:16.6666666667%}.fd-col-lg--offset-2[dir=rtl],[dir=rtl] .fd-col-lg--offset-2{margin-left:0;margin-right:16.6666666667%}.fd-col-lg--offset-after-2{margin-right:16.6666666667%}.fd-col-lg--offset-after-2[dir=rtl],[dir=rtl] .fd-col-lg--offset-after-2{margin-left:16.6666666667%;margin-right:0}.fd-col-lg--3{max-width:25%;min-width:25%}.fd-col-lg--offset-3{margin-left:25%}.fd-col-lg--offset-3[dir=rtl],[dir=rtl] .fd-col-lg--offset-3{margin-left:0;margin-right:25%}.fd-col-lg--offset-after-3{margin-right:25%}.fd-col-lg--offset-after-3[dir=rtl],[dir=rtl] .fd-col-lg--offset-after-3{margin-left:25%;margin-right:0}.fd-col-lg--4{max-width:33.3333333333%;min-width:33.3333333333%}.fd-col-lg--offset-4{margin-left:33.3333333333%}.fd-col-lg--offset-4[dir=rtl],[dir=rtl] .fd-col-lg--offset-4{margin-left:0;margin-right:33.3333333333%}.fd-col-lg--offset-after-4{margin-right:33.3333333333%}.fd-col-lg--offset-after-4[dir=rtl],[dir=rtl] .fd-col-lg--offset-after-4{margin-left:33.3333333333%;margin-right:0}.fd-col-lg--5{max-width:41.6666666667%;min-width:41.6666666667%}.fd-col-lg--offset-5{margin-left:41.6666666667%}.fd-col-lg--offset-5[dir=rtl],[dir=rtl] .fd-col-lg--offset-5{margin-left:0;margin-right:41.6666666667%}.fd-col-lg--offset-after-5{margin-right:41.6666666667%}.fd-col-lg--offset-after-5[dir=rtl],[dir=rtl] .fd-col-lg--offset-after-5{margin-left:41.6666666667%;margin-right:0}.fd-col-lg--6{max-width:50%;min-width:50%}.fd-col-lg--offset-6{margin-left:50%}.fd-col-lg--offset-6[dir=rtl],[dir=rtl] .fd-col-lg--offset-6{margin-left:0;margin-right:50%}.fd-col-lg--offset-after-6{margin-right:50%}.fd-col-lg--offset-after-6[dir=rtl],[dir=rtl] .fd-col-lg--offset-after-6{margin-left:50%;margin-right:0}.fd-col-lg--7{max-width:58.3333333333%;min-width:58.3333333333%}.fd-col-lg--offset-7{margin-left:58.3333333333%}.fd-col-lg--offset-7[dir=rtl],[dir=rtl] .fd-col-lg--offset-7{margin-left:0;margin-right:58.3333333333%}.fd-col-lg--offset-after-7{margin-right:58.3333333333%}.fd-col-lg--offset-after-7[dir=rtl],[dir=rtl] .fd-col-lg--offset-after-7{margin-left:58.3333333333%;margin-right:0}.fd-col-lg--8{max-width:66.6666666667%;min-width:66.6666666667%}.fd-col-lg--offset-8{margin-left:66.6666666667%}.fd-col-lg--offset-8[dir=rtl],[dir=rtl] .fd-col-lg--offset-8{margin-left:0;margin-right:66.6666666667%}.fd-col-lg--offset-after-8{margin-right:66.6666666667%}.fd-col-lg--offset-after-8[dir=rtl],[dir=rtl] .fd-col-lg--offset-after-8{margin-left:66.6666666667%;margin-right:0}.fd-col-lg--9{max-width:75%;min-width:75%}.fd-col-lg--offset-9{margin-left:75%}.fd-col-lg--offset-9[dir=rtl],[dir=rtl] .fd-col-lg--offset-9{margin-left:0;margin-right:75%}.fd-col-lg--offset-after-9{margin-right:75%}.fd-col-lg--offset-after-9[dir=rtl],[dir=rtl] .fd-col-lg--offset-after-9{margin-left:75%;margin-right:0}.fd-col-lg--10{max-width:83.3333333333%;min-width:83.3333333333%}.fd-col-lg--offset-10{margin-left:83.3333333333%}.fd-col-lg--offset-10[dir=rtl],[dir=rtl] .fd-col-lg--offset-10{margin-left:0;margin-right:83.3333333333%}.fd-col-lg--offset-after-10{margin-right:83.3333333333%}.fd-col-lg--offset-after-10[dir=rtl],[dir=rtl] .fd-col-lg--offset-after-10{margin-left:83.3333333333%;margin-right:0}.fd-col-lg--11{max-width:91.6666666667%;min-width:91.6666666667%}.fd-col-lg--offset-11{margin-left:91.6666666667%}.fd-col-lg--offset-11[dir=rtl],[dir=rtl] .fd-col-lg--offset-11{margin-left:0;margin-right:91.6666666667%}.fd-col-lg--offset-after-11{margin-right:91.6666666667%}.fd-col-lg--offset-after-11[dir=rtl],[dir=rtl] .fd-col-lg--offset-after-11{margin-left:91.6666666667%;margin-right:0}.fd-col-lg--12{max-width:100%;min-width:100%}.fd-col-lg--offset-12{margin-left:100%}.fd-col-lg--offset-12[dir=rtl],[dir=rtl] .fd-col-lg--offset-12{margin-left:0;margin-right:100%}.fd-col-lg--offset-after-12{margin-right:100%}.fd-col-lg--offset-after-12[dir=rtl],[dir=rtl] .fd-col-lg--offset-after-12{margin-left:100%;margin-right:0}}@media (min-width: 1440px){.fd-col-xl--0{max-width:0;min-width:0%}.fd-col-xl--offset-0{margin-left:0}.fd-col-xl--offset-0[dir=rtl],[dir=rtl] .fd-col-xl--offset-0{margin-left:0;margin-right:0}.fd-col-xl--offset-after-0{margin-right:0}.fd-col-xl--offset-after-0[dir=rtl],[dir=rtl] .fd-col-xl--offset-after-0{margin-left:0;margin-right:0}.fd-col-xl--1{max-width:8.3333333333%;min-width:8.3333333333%}.fd-col-xl--offset-1{margin-left:8.3333333333%}.fd-col-xl--offset-1[dir=rtl],[dir=rtl] .fd-col-xl--offset-1{margin-left:0;margin-right:8.3333333333%}.fd-col-xl--offset-after-1{margin-right:8.3333333333%}.fd-col-xl--offset-after-1[dir=rtl],[dir=rtl] .fd-col-xl--offset-after-1{margin-left:8.3333333333%;margin-right:0}.fd-col-xl--2{max-width:16.6666666667%;min-width:16.6666666667%}.fd-col-xl--offset-2{margin-left:16.6666666667%}.fd-col-xl--offset-2[dir=rtl],[dir=rtl] .fd-col-xl--offset-2{margin-left:0;margin-right:16.6666666667%}.fd-col-xl--offset-after-2{margin-right:16.6666666667%}.fd-col-xl--offset-after-2[dir=rtl],[dir=rtl] .fd-col-xl--offset-after-2{margin-left:16.6666666667%;margin-right:0}.fd-col-xl--3{max-width:25%;min-width:25%}.fd-col-xl--offset-3{margin-left:25%}.fd-col-xl--offset-3[dir=rtl],[dir=rtl] .fd-col-xl--offset-3{margin-left:0;margin-right:25%}.fd-col-xl--offset-after-3{margin-right:25%}.fd-col-xl--offset-after-3[dir=rtl],[dir=rtl] .fd-col-xl--offset-after-3{margin-left:25%;margin-right:0}.fd-col-xl--4{max-width:33.3333333333%;min-width:33.3333333333%}.fd-col-xl--offset-4{margin-left:33.3333333333%}.fd-col-xl--offset-4[dir=rtl],[dir=rtl] .fd-col-xl--offset-4{margin-left:0;margin-right:33.3333333333%}.fd-col-xl--offset-after-4{margin-right:33.3333333333%}.fd-col-xl--offset-after-4[dir=rtl],[dir=rtl] .fd-col-xl--offset-after-4{margin-left:33.3333333333%;margin-right:0}.fd-col-xl--5{max-width:41.6666666667%;min-width:41.6666666667%}.fd-col-xl--offset-5{margin-left:41.6666666667%}.fd-col-xl--offset-5[dir=rtl],[dir=rtl] .fd-col-xl--offset-5{margin-left:0;margin-right:41.6666666667%}.fd-col-xl--offset-after-5{margin-right:41.6666666667%}.fd-col-xl--offset-after-5[dir=rtl],[dir=rtl] .fd-col-xl--offset-after-5{margin-left:41.6666666667%;margin-right:0}.fd-col-xl--6{max-width:50%;min-width:50%}.fd-col-xl--offset-6{margin-left:50%}.fd-col-xl--offset-6[dir=rtl],[dir=rtl] .fd-col-xl--offset-6{margin-left:0;margin-right:50%}.fd-col-xl--offset-after-6{margin-right:50%}.fd-col-xl--offset-after-6[dir=rtl],[dir=rtl] .fd-col-xl--offset-after-6{margin-left:50%;margin-right:0}.fd-col-xl--7{max-width:58.3333333333%;min-width:58.3333333333%}.fd-col-xl--offset-7{margin-left:58.3333333333%}.fd-col-xl--offset-7[dir=rtl],[dir=rtl] .fd-col-xl--offset-7{margin-left:0;margin-right:58.3333333333%}.fd-col-xl--offset-after-7{margin-right:58.3333333333%}.fd-col-xl--offset-after-7[dir=rtl],[dir=rtl] .fd-col-xl--offset-after-7{margin-left:58.3333333333%;margin-right:0}.fd-col-xl--8{max-width:66.6666666667%;min-width:66.6666666667%}.fd-col-xl--offset-8{margin-left:66.6666666667%}.fd-col-xl--offset-8[dir=rtl],[dir=rtl] .fd-col-xl--offset-8{margin-left:0;margin-right:66.6666666667%}.fd-col-xl--offset-after-8{margin-right:66.6666666667%}.fd-col-xl--offset-after-8[dir=rtl],[dir=rtl] .fd-col-xl--offset-after-8{margin-left:66.6666666667%;margin-right:0}.fd-col-xl--9{max-width:75%;min-width:75%}.fd-col-xl--offset-9{margin-left:75%}.fd-col-xl--offset-9[dir=rtl],[dir=rtl] .fd-col-xl--offset-9{margin-left:0;margin-right:75%}.fd-col-xl--offset-after-9{margin-right:75%}.fd-col-xl--offset-after-9[dir=rtl],[dir=rtl] .fd-col-xl--offset-after-9{margin-left:75%;margin-right:0}.fd-col-xl--10{max-width:83.3333333333%;min-width:83.3333333333%}.fd-col-xl--offset-10{margin-left:83.3333333333%}.fd-col-xl--offset-10[dir=rtl],[dir=rtl] .fd-col-xl--offset-10{margin-left:0;margin-right:83.3333333333%}.fd-col-xl--offset-after-10{margin-right:83.3333333333%}.fd-col-xl--offset-after-10[dir=rtl],[dir=rtl] .fd-col-xl--offset-after-10{margin-left:83.3333333333%;margin-right:0}.fd-col-xl--11{max-width:91.6666666667%;min-width:91.6666666667%}.fd-col-xl--offset-11{margin-left:91.6666666667%}.fd-col-xl--offset-11[dir=rtl],[dir=rtl] .fd-col-xl--offset-11{margin-left:0;margin-right:91.6666666667%}.fd-col-xl--offset-after-11{margin-right:91.6666666667%}.fd-col-xl--offset-after-11[dir=rtl],[dir=rtl] .fd-col-xl--offset-after-11{margin-left:91.6666666667%;margin-right:0}.fd-col-xl--12{max-width:100%;min-width:100%}.fd-col-xl--offset-12{margin-left:100%}.fd-col-xl--offset-12[dir=rtl],[dir=rtl] .fd-col-xl--offset-12{margin-left:0;margin-right:100%}.fd-col-xl--offset-after-12{margin-right:100%}.fd-col-xl--offset-after-12[dir=rtl],[dir=rtl] .fd-col-xl--offset-after-12{margin-left:100%;margin-right:0}}.fd-container.fd-form-layout-grid-container .fd-form-group,.fd-container.fd-form-layout-grid-container.fd-form-group{padding:1rem!important}.fd-container.fd-form-layout-grid-container .fd-form-group .fd-form-group,.fd-container.fd-form-layout-grid-container.fd-form-group .fd-form-group{padding:0!important}.fd-container.fd-form-layout-grid-container .fd-form-group .fd-form-item .fd-form-label,.fd-container.fd-form-layout-grid-container.fd-form-group .fd-form-item .fd-form-label{margin-right:0;white-space:normal}.fd-container.fd-form-layout-grid-container .fd-form-group .fd-form-item .fd-form-label[dir=rtl],.fd-container.fd-form-layout-grid-container.fd-form-group .fd-form-item .fd-form-label[dir=rtl],[dir=rtl] .fd-container.fd-form-layout-grid-container .fd-form-group .fd-form-item .fd-form-label,[dir=rtl] .fd-container.fd-form-layout-grid-container.fd-form-group .fd-form-item .fd-form-label{margin-left:0;margin-right:0}.fd-container.fd-form-layout-grid-container .fd-form-group .fd-form-item .fd-form-label--required,.fd-container.fd-form-layout-grid-container.fd-form-group .fd-form-item .fd-form-label--required{padding-right:.5rem}.fd-container.fd-form-layout-grid-container .fd-form-group .fd-form-item .fd-form-label--required[dir=rtl],.fd-container.fd-form-layout-grid-container.fd-form-group .fd-form-item .fd-form-label--required[dir=rtl],[dir=rtl] .fd-container.fd-form-layout-grid-container .fd-form-group .fd-form-item .fd-form-label--required,[dir=rtl] .fd-container.fd-form-layout-grid-container.fd-form-group .fd-form-item .fd-form-label--required{padding-left:.5rem;padding-right:0}.fd-container.fd-form-layout-grid-container .fd-row{flex-direction:row}.fd-container.fd-form-layout-grid-container .fd-row .fd-col{overflow:hidden;padding-bottom:0;padding-top:0;text-overflow:ellipsis;white-space:nowrap}.fd-container.fd-form-layout-grid-container .fd-row .fd-col:not(.fd-form-group){align-self:center}@media (min-width: 0){.fd-container.fd-form-layout-grid-container.fd-form-layout-grid-container--vertical .fd-form-group .fd-form-item,.fd-container.fd-form-layout-grid-container.fd-form-layout-grid-container--vertical.fd-form-group .fd-form-item{margin-top:.625rem}.fd-container.fd-form-layout-grid-container.fd-form-layout-grid-container--vertical .fd-form-group .fd-form-item:first-of-type,.fd-container.fd-form-layout-grid-container.fd-form-layout-grid-container--vertical.fd-form-group .fd-form-item:first-of-type{margin-top:0}.fd-container.fd-form-layout-grid-container .fd-row .fd-col--1>.fd-form-label{float:right;padding-bottom:0;text-align:right;width:100%}.fd-container.fd-form-layout-grid-container .fd-row .fd-col--1>.fd-form-label[dir=rtl],[dir=rtl] .fd-container.fd-form-layout-grid-container .fd-row .fd-col--1>.fd-form-label{float:left;text-align:left}.fd-container.fd-form-layout-grid-container .fd-row .fd-col--2>.fd-form-label{float:right;padding-bottom:0;text-align:right;width:100%}.fd-container.fd-form-layout-grid-container .fd-row .fd-col--2>.fd-form-label[dir=rtl],[dir=rtl] .fd-container.fd-form-layout-grid-container .fd-row .fd-col--2>.fd-form-label{float:left;text-align:left}.fd-container.fd-form-layout-grid-container .fd-row .fd-col--3>.fd-form-label{float:right;padding-bottom:0;text-align:right;width:100%}.fd-container.fd-form-layout-grid-container .fd-row .fd-col--3>.fd-form-label[dir=rtl],[dir=rtl] .fd-container.fd-form-layout-grid-container .fd-row .fd-col--3>.fd-form-label{float:left;text-align:left}.fd-container.fd-form-layout-grid-container .fd-row .fd-col--4>.fd-form-label{float:right;padding-bottom:0;text-align:right;width:100%}.fd-container.fd-form-layout-grid-container .fd-row .fd-col--4>.fd-form-label[dir=rtl],[dir=rtl] .fd-container.fd-form-layout-grid-container .fd-row .fd-col--4>.fd-form-label{float:left;text-align:left}.fd-container.fd-form-layout-grid-container .fd-row .fd-col--5>.fd-form-label{float:right;padding-bottom:0;text-align:right;width:100%}.fd-container.fd-form-layout-grid-container .fd-row .fd-col--5>.fd-form-label[dir=rtl],[dir=rtl] .fd-container.fd-form-layout-grid-container .fd-row .fd-col--5>.fd-form-label{float:left;text-align:left}.fd-container.fd-form-layout-grid-container .fd-row .fd-col--6>.fd-form-label{float:right;padding-bottom:0;text-align:right;width:100%}.fd-container.fd-form-layout-grid-container .fd-row .fd-col--6>.fd-form-label[dir=rtl],[dir=rtl] .fd-container.fd-form-layout-grid-container .fd-row .fd-col--6>.fd-form-label{float:left;text-align:left}.fd-container.fd-form-layout-grid-container .fd-row .fd-col--7>.fd-form-label{float:right;padding-bottom:0;text-align:right;width:100%}.fd-container.fd-form-layout-grid-container .fd-row .fd-col--7>.fd-form-label[dir=rtl],[dir=rtl] .fd-container.fd-form-layout-grid-container .fd-row .fd-col--7>.fd-form-label{float:left;text-align:left}.fd-container.fd-form-layout-grid-container .fd-row .fd-col--8>.fd-form-label{float:right;padding-bottom:0;text-align:right;width:100%}.fd-container.fd-form-layout-grid-container .fd-row .fd-col--8>.fd-form-label[dir=rtl],[dir=rtl] .fd-container.fd-form-layout-grid-container .fd-row .fd-col--8>.fd-form-label{float:left;text-align:left}.fd-container.fd-form-layout-grid-container .fd-row .fd-col--9>.fd-form-label{float:right;padding-bottom:0;text-align:right;width:100%}.fd-container.fd-form-layout-grid-container .fd-row .fd-col--9>.fd-form-label[dir=rtl],[dir=rtl] .fd-container.fd-form-layout-grid-container .fd-row .fd-col--9>.fd-form-label{float:left;text-align:left}.fd-container.fd-form-layout-grid-container .fd-row .fd-col--10>.fd-form-label{float:right;padding-bottom:0;text-align:right;width:100%}.fd-container.fd-form-layout-grid-container .fd-row .fd-col--10>.fd-form-label[dir=rtl],[dir=rtl] .fd-container.fd-form-layout-grid-container .fd-row .fd-col--10>.fd-form-label{float:left;text-align:left}.fd-container.fd-form-layout-grid-container .fd-row .fd-col--11>.fd-form-label{float:right;padding-bottom:0;text-align:right;width:100%}.fd-container.fd-form-layout-grid-container .fd-row .fd-col--11>.fd-form-label[dir=rtl],[dir=rtl] .fd-container.fd-form-layout-grid-container .fd-row .fd-col--11>.fd-form-label{float:left;text-align:left}.fd-container.fd-form-layout-grid-container .fd-row .fd-col--12>.fd-form-label,.fd-container.fd-form-layout-grid-container .fd-row .fd-col>.fd-form-label{float:left;padding-bottom:.125rem;text-align:left;width:auto}.fd-container.fd-form-layout-grid-container .fd-row .fd-col--12>.fd-form-label[dir=rtl],.fd-container.fd-form-layout-grid-container .fd-row .fd-col>.fd-form-label[dir=rtl],[dir=rtl] .fd-container.fd-form-layout-grid-container .fd-row .fd-col--12>.fd-form-label,[dir=rtl] .fd-container.fd-form-layout-grid-container .fd-row .fd-col>.fd-form-label{float:right;text-align:right}}@media (min-width: 0) and (max-width: 599px){.fd-container.fd-form-layout-grid-container.fd-form-layout-grid-container .fd-form-group .fd-form-item,.fd-container.fd-form-layout-grid-container.fd-form-layout-grid-container.fd-form-group .fd-form-item{margin-top:.625rem}.fd-container.fd-form-layout-grid-container.fd-form-layout-grid-container .fd-form-group .fd-form-item:first-of-type,.fd-container.fd-form-layout-grid-container.fd-form-layout-grid-container.fd-form-group .fd-form-item:first-of-type{margin-top:0}}@media (min-width: 600px){.fd-container.fd-form-layout-grid-container{padding:0 .25rem}.fd-container.fd-form-layout-grid-container .fd-row{margin:0 -.25rem;min-width:calc(100% + .5rem)}.fd-container.fd-form-layout-grid-container .fd-row .fd-col{padding:0 .25rem}.fd-container.fd-form-layout-grid-container .fd-row .fd-col-md--1>.fd-form-label{float:right;padding-bottom:0;text-align:right;width:100%}.fd-container.fd-form-layout-grid-container .fd-row .fd-col-md--1>.fd-form-label[dir=rtl],[dir=rtl] .fd-container.fd-form-layout-grid-container .fd-row .fd-col-md--1>.fd-form-label{float:left;text-align:left}.fd-container.fd-form-layout-grid-container .fd-row .fd-col-md--2>.fd-form-label{float:right;padding-bottom:0;text-align:right;width:100%}.fd-container.fd-form-layout-grid-container .fd-row .fd-col-md--2>.fd-form-label[dir=rtl],[dir=rtl] .fd-container.fd-form-layout-grid-container .fd-row .fd-col-md--2>.fd-form-label{float:left;text-align:left}.fd-container.fd-form-layout-grid-container .fd-row .fd-col-md--3>.fd-form-label{float:right;padding-bottom:0;text-align:right;width:100%}.fd-container.fd-form-layout-grid-container .fd-row .fd-col-md--3>.fd-form-label[dir=rtl],[dir=rtl] .fd-container.fd-form-layout-grid-container .fd-row .fd-col-md--3>.fd-form-label{float:left;text-align:left}.fd-container.fd-form-layout-grid-container .fd-row .fd-col-md--4>.fd-form-label{float:right;padding-bottom:0;text-align:right;width:100%}.fd-container.fd-form-layout-grid-container .fd-row .fd-col-md--4>.fd-form-label[dir=rtl],[dir=rtl] .fd-container.fd-form-layout-grid-container .fd-row .fd-col-md--4>.fd-form-label{float:left;text-align:left}.fd-container.fd-form-layout-grid-container .fd-row .fd-col-md--5>.fd-form-label{float:right;padding-bottom:0;text-align:right;width:100%}.fd-container.fd-form-layout-grid-container .fd-row .fd-col-md--5>.fd-form-label[dir=rtl],[dir=rtl] .fd-container.fd-form-layout-grid-container .fd-row .fd-col-md--5>.fd-form-label{float:left;text-align:left}.fd-container.fd-form-layout-grid-container .fd-row .fd-col-md--6>.fd-form-label{float:right;padding-bottom:0;text-align:right;width:100%}.fd-container.fd-form-layout-grid-container .fd-row .fd-col-md--6>.fd-form-label[dir=rtl],[dir=rtl] .fd-container.fd-form-layout-grid-container .fd-row .fd-col-md--6>.fd-form-label{float:left;text-align:left}.fd-container.fd-form-layout-grid-container .fd-row .fd-col-md--7>.fd-form-label{float:right;padding-bottom:0;text-align:right;width:100%}.fd-container.fd-form-layout-grid-container .fd-row .fd-col-md--7>.fd-form-label[dir=rtl],[dir=rtl] .fd-container.fd-form-layout-grid-container .fd-row .fd-col-md--7>.fd-form-label{float:left;text-align:left}.fd-container.fd-form-layout-grid-container .fd-row .fd-col-md--8>.fd-form-label{float:right;padding-bottom:0;text-align:right;width:100%}.fd-container.fd-form-layout-grid-container .fd-row .fd-col-md--8>.fd-form-label[dir=rtl],[dir=rtl] .fd-container.fd-form-layout-grid-container .fd-row .fd-col-md--8>.fd-form-label{float:left;text-align:left}.fd-container.fd-form-layout-grid-container .fd-row .fd-col-md--9>.fd-form-label{float:right;padding-bottom:0;text-align:right;width:100%}.fd-container.fd-form-layout-grid-container .fd-row .fd-col-md--9>.fd-form-label[dir=rtl],[dir=rtl] .fd-container.fd-form-layout-grid-container .fd-row .fd-col-md--9>.fd-form-label{float:left;text-align:left}.fd-container.fd-form-layout-grid-container .fd-row .fd-col-md--10>.fd-form-label{float:right;padding-bottom:0;text-align:right;width:100%}.fd-container.fd-form-layout-grid-container .fd-row .fd-col-md--10>.fd-form-label[dir=rtl],[dir=rtl] .fd-container.fd-form-layout-grid-container .fd-row .fd-col-md--10>.fd-form-label{float:left;text-align:left}.fd-container.fd-form-layout-grid-container .fd-row .fd-col-md--11>.fd-form-label{float:right;padding-bottom:0;text-align:right;width:100%}.fd-container.fd-form-layout-grid-container .fd-row .fd-col-md--11>.fd-form-label[dir=rtl],[dir=rtl] .fd-container.fd-form-layout-grid-container .fd-row .fd-col-md--11>.fd-form-label{float:left;text-align:left}.fd-container.fd-form-layout-grid-container .fd-row .fd-col-md--12>.fd-form-label,.fd-container.fd-form-layout-grid-container .fd-row .fd-col-md>.fd-form-label{float:left;padding-bottom:.125rem;text-align:left;width:auto}.fd-container.fd-form-layout-grid-container .fd-row .fd-col-md--12>.fd-form-label[dir=rtl],.fd-container.fd-form-layout-grid-container .fd-row .fd-col-md>.fd-form-label[dir=rtl],[dir=rtl] .fd-container.fd-form-layout-grid-container .fd-row .fd-col-md--12>.fd-form-label,[dir=rtl] .fd-container.fd-form-layout-grid-container .fd-row .fd-col-md>.fd-form-label{float:right;text-align:right}}@media (min-width: 600px) and (max-width: 1023px){.fd-container.fd-form-layout-grid-container.fd-form-layout-grid-container--md-vertical .fd-form-group .fd-form-item,.fd-container.fd-form-layout-grid-container.fd-form-layout-grid-container--md-vertical.fd-form-group .fd-form-item{margin-top:.625rem}.fd-container.fd-form-layout-grid-container.fd-form-layout-grid-container--md-vertical .fd-form-group .fd-form-item:first-of-type,.fd-container.fd-form-layout-grid-container.fd-form-layout-grid-container--md-vertical.fd-form-group .fd-form-item:first-of-type{margin-top:0}}@media (min-width: 1024px){.fd-container.fd-form-layout-grid-container .fd-row .fd-col-lg--1>.fd-form-label{float:right;padding-bottom:0;text-align:right;width:100%}.fd-container.fd-form-layout-grid-container .fd-row .fd-col-lg--1>.fd-form-label[dir=rtl],[dir=rtl] .fd-container.fd-form-layout-grid-container .fd-row .fd-col-lg--1>.fd-form-label{float:left;text-align:left}.fd-container.fd-form-layout-grid-container .fd-row .fd-col-lg--2>.fd-form-label{float:right;padding-bottom:0;text-align:right;width:100%}.fd-container.fd-form-layout-grid-container .fd-row .fd-col-lg--2>.fd-form-label[dir=rtl],[dir=rtl] .fd-container.fd-form-layout-grid-container .fd-row .fd-col-lg--2>.fd-form-label{float:left;text-align:left}.fd-container.fd-form-layout-grid-container .fd-row .fd-col-lg--3>.fd-form-label{float:right;padding-bottom:0;text-align:right;width:100%}.fd-container.fd-form-layout-grid-container .fd-row .fd-col-lg--3>.fd-form-label[dir=rtl],[dir=rtl] .fd-container.fd-form-layout-grid-container .fd-row .fd-col-lg--3>.fd-form-label{float:left;text-align:left}.fd-container.fd-form-layout-grid-container .fd-row .fd-col-lg--4>.fd-form-label{float:right;padding-bottom:0;text-align:right;width:100%}.fd-container.fd-form-layout-grid-container .fd-row .fd-col-lg--4>.fd-form-label[dir=rtl],[dir=rtl] .fd-container.fd-form-layout-grid-container .fd-row .fd-col-lg--4>.fd-form-label{float:left;text-align:left}.fd-container.fd-form-layout-grid-container .fd-row .fd-col-lg--5>.fd-form-label{float:right;padding-bottom:0;text-align:right;width:100%}.fd-container.fd-form-layout-grid-container .fd-row .fd-col-lg--5>.fd-form-label[dir=rtl],[dir=rtl] .fd-container.fd-form-layout-grid-container .fd-row .fd-col-lg--5>.fd-form-label{float:left;text-align:left}.fd-container.fd-form-layout-grid-container .fd-row .fd-col-lg--6>.fd-form-label{float:right;padding-bottom:0;text-align:right;width:100%}.fd-container.fd-form-layout-grid-container .fd-row .fd-col-lg--6>.fd-form-label[dir=rtl],[dir=rtl] .fd-container.fd-form-layout-grid-container .fd-row .fd-col-lg--6>.fd-form-label{float:left;text-align:left}.fd-container.fd-form-layout-grid-container .fd-row .fd-col-lg--7>.fd-form-label{float:right;padding-bottom:0;text-align:right;width:100%}.fd-container.fd-form-layout-grid-container .fd-row .fd-col-lg--7>.fd-form-label[dir=rtl],[dir=rtl] .fd-container.fd-form-layout-grid-container .fd-row .fd-col-lg--7>.fd-form-label{float:left;text-align:left}.fd-container.fd-form-layout-grid-container .fd-row .fd-col-lg--8>.fd-form-label{float:right;padding-bottom:0;text-align:right;width:100%}.fd-container.fd-form-layout-grid-container .fd-row .fd-col-lg--8>.fd-form-label[dir=rtl],[dir=rtl] .fd-container.fd-form-layout-grid-container .fd-row .fd-col-lg--8>.fd-form-label{float:left;text-align:left}.fd-container.fd-form-layout-grid-container .fd-row .fd-col-lg--9>.fd-form-label{float:right;padding-bottom:0;text-align:right;width:100%}.fd-container.fd-form-layout-grid-container .fd-row .fd-col-lg--9>.fd-form-label[dir=rtl],[dir=rtl] .fd-container.fd-form-layout-grid-container .fd-row .fd-col-lg--9>.fd-form-label{float:left;text-align:left}.fd-container.fd-form-layout-grid-container .fd-row .fd-col-lg--10>.fd-form-label{float:right;padding-bottom:0;text-align:right;width:100%}.fd-container.fd-form-layout-grid-container .fd-row .fd-col-lg--10>.fd-form-label[dir=rtl],[dir=rtl] .fd-container.fd-form-layout-grid-container .fd-row .fd-col-lg--10>.fd-form-label{float:left;text-align:left}.fd-container.fd-form-layout-grid-container .fd-row .fd-col-lg--11>.fd-form-label{float:right;padding-bottom:0;text-align:right;width:100%}.fd-container.fd-form-layout-grid-container .fd-row .fd-col-lg--11>.fd-form-label[dir=rtl],[dir=rtl] .fd-container.fd-form-layout-grid-container .fd-row .fd-col-lg--11>.fd-form-label{float:left;text-align:left}.fd-container.fd-form-layout-grid-container .fd-row .fd-col-lg--12>.fd-form-label,.fd-container.fd-form-layout-grid-container .fd-row .fd-col-lg>.fd-form-label{float:left;padding-bottom:.125rem;text-align:left;width:auto}.fd-container.fd-form-layout-grid-container .fd-row .fd-col-lg--12>.fd-form-label[dir=rtl],.fd-container.fd-form-layout-grid-container .fd-row .fd-col-lg>.fd-form-label[dir=rtl],[dir=rtl] .fd-container.fd-form-layout-grid-container .fd-row .fd-col-lg--12>.fd-form-label,[dir=rtl] .fd-container.fd-form-layout-grid-container .fd-row .fd-col-lg>.fd-form-label{float:right;text-align:right}}@media (min-width: 1024px) and (max-width: 1443px){.fd-container.fd-form-layout-grid-container.fd-form-layout-grid-container--lg-vertical .fd-form-group .fd-form-item,.fd-container.fd-form-layout-grid-container.fd-form-layout-grid-container--lg-vertical.fd-form-group .fd-form-item{margin-top:.625rem}.fd-container.fd-form-layout-grid-container.fd-form-layout-grid-container--lg-vertical .fd-form-group .fd-form-item:first-of-type,.fd-container.fd-form-layout-grid-container.fd-form-layout-grid-container--lg-vertical.fd-form-group .fd-form-item:first-of-type{margin-top:0}}@media (min-width: 1440px){.fd-container.fd-form-layout-grid-container.fd-form-layout-grid-container--xl-vertical .fd-form-group .fd-form-item,.fd-container.fd-form-layout-grid-container.fd-form-layout-grid-container--xl-vertical.fd-form-group .fd-form-item{margin-top:.625rem}.fd-container.fd-form-layout-grid-container.fd-form-layout-grid-container--xl-vertical .fd-form-group .fd-form-item:first-of-type,.fd-container.fd-form-layout-grid-container.fd-form-layout-grid-container--xl-vertical.fd-form-group .fd-form-item:first-of-type{margin-top:0}.fd-container.fd-form-layout-grid-container .fd-row .fd-col-xl--1>.fd-form-label{float:right;padding-bottom:0;text-align:right;width:100%}.fd-container.fd-form-layout-grid-container .fd-row .fd-col-xl--1>.fd-form-label[dir=rtl],[dir=rtl] .fd-container.fd-form-layout-grid-container .fd-row .fd-col-xl--1>.fd-form-label{float:left;text-align:left}.fd-container.fd-form-layout-grid-container .fd-row .fd-col-xl--2>.fd-form-label{float:right;padding-bottom:0;text-align:right;width:100%}.fd-container.fd-form-layout-grid-container .fd-row .fd-col-xl--2>.fd-form-label[dir=rtl],[dir=rtl] .fd-container.fd-form-layout-grid-container .fd-row .fd-col-xl--2>.fd-form-label{float:left;text-align:left}.fd-container.fd-form-layout-grid-container .fd-row .fd-col-xl--3>.fd-form-label{float:right;padding-bottom:0;text-align:right;width:100%}.fd-container.fd-form-layout-grid-container .fd-row .fd-col-xl--3>.fd-form-label[dir=rtl],[dir=rtl] .fd-container.fd-form-layout-grid-container .fd-row .fd-col-xl--3>.fd-form-label{float:left;text-align:left}.fd-container.fd-form-layout-grid-container .fd-row .fd-col-xl--4>.fd-form-label{float:right;padding-bottom:0;text-align:right;width:100%}.fd-container.fd-form-layout-grid-container .fd-row .fd-col-xl--4>.fd-form-label[dir=rtl],[dir=rtl] .fd-container.fd-form-layout-grid-container .fd-row .fd-col-xl--4>.fd-form-label{float:left;text-align:left}.fd-container.fd-form-layout-grid-container .fd-row .fd-col-xl--5>.fd-form-label{float:right;padding-bottom:0;text-align:right;width:100%}.fd-container.fd-form-layout-grid-container .fd-row .fd-col-xl--5>.fd-form-label[dir=rtl],[dir=rtl] .fd-container.fd-form-layout-grid-container .fd-row .fd-col-xl--5>.fd-form-label{float:left;text-align:left}.fd-container.fd-form-layout-grid-container .fd-row .fd-col-xl--6>.fd-form-label{float:right;padding-bottom:0;text-align:right;width:100%}.fd-container.fd-form-layout-grid-container .fd-row .fd-col-xl--6>.fd-form-label[dir=rtl],[dir=rtl] .fd-container.fd-form-layout-grid-container .fd-row .fd-col-xl--6>.fd-form-label{float:left;text-align:left}.fd-container.fd-form-layout-grid-container .fd-row .fd-col-xl--7>.fd-form-label{float:right;padding-bottom:0;text-align:right;width:100%}.fd-container.fd-form-layout-grid-container .fd-row .fd-col-xl--7>.fd-form-label[dir=rtl],[dir=rtl] .fd-container.fd-form-layout-grid-container .fd-row .fd-col-xl--7>.fd-form-label{float:left;text-align:left}.fd-container.fd-form-layout-grid-container .fd-row .fd-col-xl--8>.fd-form-label{float:right;padding-bottom:0;text-align:right;width:100%}.fd-container.fd-form-layout-grid-container .fd-row .fd-col-xl--8>.fd-form-label[dir=rtl],[dir=rtl] .fd-container.fd-form-layout-grid-container .fd-row .fd-col-xl--8>.fd-form-label{float:left;text-align:left}.fd-container.fd-form-layout-grid-container .fd-row .fd-col-xl--9>.fd-form-label{float:right;padding-bottom:0;text-align:right;width:100%}.fd-container.fd-form-layout-grid-container .fd-row .fd-col-xl--9>.fd-form-label[dir=rtl],[dir=rtl] .fd-container.fd-form-layout-grid-container .fd-row .fd-col-xl--9>.fd-form-label{float:left;text-align:left}.fd-container.fd-form-layout-grid-container .fd-row .fd-col-xl--10>.fd-form-label{float:right;padding-bottom:0;text-align:right;width:100%}.fd-container.fd-form-layout-grid-container .fd-row .fd-col-xl--10>.fd-form-label[dir=rtl],[dir=rtl] .fd-container.fd-form-layout-grid-container .fd-row .fd-col-xl--10>.fd-form-label{float:left;text-align:left}.fd-container.fd-form-layout-grid-container .fd-row .fd-col-xl--11>.fd-form-label{float:right;padding-bottom:0;text-align:right;width:100%}.fd-container.fd-form-layout-grid-container .fd-row .fd-col-xl--11>.fd-form-label[dir=rtl],[dir=rtl] .fd-container.fd-form-layout-grid-container .fd-row .fd-col-xl--11>.fd-form-label{float:left;text-align:left}.fd-container.fd-form-layout-grid-container .fd-row .fd-col-xl--12>.fd-form-label,.fd-container.fd-form-layout-grid-container .fd-row .fd-col-xl>.fd-form-label{float:left;padding-bottom:.125rem;text-align:left;width:auto}.fd-container.fd-form-layout-grid-container .fd-row .fd-col-xl--12>.fd-form-label[dir=rtl],.fd-container.fd-form-layout-grid-container .fd-row .fd-col-xl>.fd-form-label[dir=rtl],[dir=rtl] .fd-container.fd-form-layout-grid-container .fd-row .fd-col-xl--12>.fd-form-label,[dir=rtl] .fd-container.fd-form-layout-grid-container .fd-row .fd-col-xl>.fd-form-label{float:right;text-align:right}}.fd-section{-webkit-box-sizing:border-box;background-color:var(--sapToolbar_Background);border:0;border-bottom:none;box-sizing:border-box;color:var(--sapTextColor);font-family:var(--sapFontFamily);font-size:var(--sapFontSize);font-weight:400;forced-color-adjust:none;line-height:var(--sapContent_LineHeight);margin:0;padding:1rem .5rem 1.5rem}.fd-section:after,.fd-section:before{box-sizing:inherit;font-size:inherit}.fd-section:after{clear:both;content:\"\";display:table}@media (min-width: 600px){.fd-section{padding-left:2rem;padding-right:2rem}}@media (min-width: 1440px){.fd-section{padding-left:3rem;padding-right:3rem}}.fd-section--no-border,.fd-section:last-child{border-bottom:0}.fd-section--bleed,.fd-section--full-bleed{-webkit-box-sizing:border-box;border:0;box-sizing:border-box;color:var(--sapTextColor);font-family:var(--sapFontFamily);font-size:var(--sapFontSize);font-weight:400;forced-color-adjust:none;line-height:var(--sapContent_LineHeight);margin:0;padding:0}.fd-section--bleed:after,.fd-section--bleed:before,.fd-section--full-bleed:after,.fd-section--full-bleed:before{box-sizing:inherit;font-size:inherit}.fd-section--bleed .fd-section__footer,.fd-section--bleed .fd-section__header,.fd-section--full-bleed .fd-section__footer,.fd-section--full-bleed .fd-section__header{padding-left:.5rem;padding-right:.5rem}@media (min-width: 600px){.fd-section--bleed .fd-section__footer,.fd-section--bleed .fd-section__header,.fd-section--full-bleed .fd-section__footer,.fd-section--full-bleed .fd-section__header{padding-left:2rem;padding-right:2rem}}@media (min-width: 1440px){.fd-section--bleed .fd-section__footer,.fd-section--bleed .fd-section__header,.fd-section--full-bleed .fd-section__footer,.fd-section--full-bleed .fd-section__header{padding-left:3rem;padding-right:3rem}}.fd-section__header{-webkit-box-sizing:border-box;align-items:center;border:0;box-sizing:border-box;color:var(--sapTextColor);display:flex;font-family:var(--sapFontFamily);font-size:var(--sapFontSize);font-weight:400;forced-color-adjust:none;line-height:var(--sapContent_LineHeight);margin:0 0 1.5rem;min-height:1.5rem;padding:0}.fd-section__header:after,.fd-section__header:before{box-sizing:inherit;font-size:inherit}.fd-section__title{-webkit-box-sizing:border-box;-webkit-box-flex:1;-ms-flex:1;border:0;box-sizing:border-box;color:var(--sapTextColor);color:var(--sapTitleColor);flex:1;font-family:var(--sapFontFamily);font-size:var(--sapFontSize);font-size:var(--sapFontHeader2Size);font-weight:400;forced-color-adjust:none;line-height:var(--sapContent_LineHeight);line-height:2rem;margin:0;padding:0}.fd-section__title:after,.fd-section__title:before{box-sizing:inherit;font-size:inherit}.fd-section__actions{-webkit-box-sizing:border-box;border:0;box-sizing:border-box;color:var(--sapTextColor);font-family:var(--sapFontFamily);font-size:var(--sapFontSize);font-weight:400;forced-color-adjust:none;line-height:var(--sapContent_LineHeight);margin:0 0 0 auto;padding:0}.fd-section__actions:after,.fd-section__actions:before{box-sizing:inherit;font-size:inherit}.fd-section__footer{-webkit-box-sizing:border-box;-webkit-box-pack:center;-ms-flex-pack:center;border:0;box-sizing:border-box;color:var(--sapTextColor);display:flex;font-family:var(--sapFontFamily);font-size:var(--sapFontSize);font-weight:400;forced-color-adjust:none;justify-content:center;line-height:var(--sapContent_LineHeight);margin:0;padding:0}.fd-section__footer:after,.fd-section__footer:before{box-sizing:inherit;font-size:inherit}.fd-form-group{-webkit-box-sizing:border-box;border:0;box-sizing:border-box;color:var(--sapTextColor);font-family:var(--sapFontFamily);font-size:var(--sapFontSize);font-weight:400;forced-color-adjust:none;line-height:var(--sapContent_LineHeight);margin:0;padding:0}.fd-form-group:after,.fd-form-group:before{box-sizing:inherit;font-size:inherit}.fd-form-group--inline{-webkit-box-pack:start;-ms-flex-pack:start;-ms-flex-wrap:wrap;flex-direction:row;flex-wrap:wrap;justify-content:flex-start}.fd-form-group--inline,.fd-form-group__header{display:flex}.fd-form-group__header{-webkit-box-sizing:border-box;align-items:center;background-color:var(--sapGroup_TitleBackground);border:0;box-sizing:border-box;color:var(--sapTextColor);font-family:var(--sapFontFamily);font-size:var(--sapFontSize);font-weight:400;forced-color-adjust:none;height:2.75rem;line-height:var(--sapContent_LineHeight);margin:0;padding:0;width:100%}.fd-form-group__header:after,.fd-form-group__header:before{box-sizing:inherit;font-size:inherit}.fd-form-group__header[class*=-compact],.fd-form-group__header[class*=-condensed],[class*=-compact] .fd-form-group__header:not([class*=-cozy]),[class*=-condensed] .fd-form-group__header:not([class*=-cozy]){height:2rem}.fd-form-group__header-text{-webkit-box-sizing:border-box;border:0;box-sizing:border-box;color:var(--sapTextColor);color:var(--sapGroup_TitleTextColor);font-family:var(--sapFontFamily);font-family:var(--sapFontHeaderFamily);font-size:var(--sapFontSize);font-size:var(--sapFontHeader6Size);font-weight:400;font-weight:700;forced-color-adjust:none;line-height:var(--sapContent_LineHeight);margin:0;overflow:hidden;padding:0;text-overflow:ellipsis;white-space:nowrap}.fd-form-group__header-text:after,.fd-form-group__header-text:before{box-sizing:inherit;font-size:inherit}/*!\n * Fundamental Library Styles v0.30.2-rc.6\n * Copyright (c) 2023 SAP SE or an SAP affiliate company.\n * Licensed under Apache License 2.0 (https://github.com/SAP/fundamental-styles/blob/main/LICENSE)\n */.fd-form-header{-webkit-box-sizing:border-box;-webkit-box-align:center;-ms-flex-align:center;-webkit-box-shadow:0 var(--fdFormHeader_Border_Width) 0 var(--sapGroup_TitleBorderColor);align-items:center;background-color:var(--sapGroup_TitleBackground);border:0;box-shadow:0 var(--fdFormHeader_Border_Width) 0 var(--sapGroup_TitleBorderColor);box-sizing:border-box;color:var(--sapTextColor);display:flex;font-family:var(--sapFontFamily);font-size:var(--sapFontSize);font-weight:400;forced-color-adjust:none;height:2.75rem;line-height:var(--sapContent_LineHeight);margin:0;padding:0 1rem;width:100%}.fd-form-header:after,.fd-form-header:before{box-sizing:inherit;font-size:inherit}.fd-form-header__text{-webkit-box-sizing:border-box;border:0;box-sizing:border-box;color:var(--sapTextColor);color:var(--sapGroup_TitleTextColor);font-family:var(--sapFontFamily);font-family:var(--sapFontHeaderFamily);font-size:var(--sapFontSize);font-size:var(--sapFontHeader4Size);font-weight:400;forced-color-adjust:none;line-height:var(--sapContent_LineHeight);margin:0;overflow:hidden;padding:0;text-overflow:ellipsis;white-space:nowrap}.fd-form-header__text:after,.fd-form-header__text:before{box-sizing:inherit;font-size:inherit}fdp-form-group{display:block}.fd-form-label{overflow:hidden}\n"], dependencies: [{ kind: "directive", type: i3.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i3.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i3.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: i1$1.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i1$1.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i1$1.NgForm, selector: "form:not([ngNoForm]):not([formGroup]),ng-form,[ngForm]", inputs: ["ngFormOptions"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i5.InlineHelpDirective, selector: "[fd-inline-help]:not([fd-inline-help-template]), [fd-inline-help-template]:not([fd-inline-help])", inputs: ["triggers", "noArrow", "closeOnEscapeKey", "closeOnOutsideClick", "fd-inline-help"] }, { kind: "component", type: i6.IconComponent, selector: "fd-icon", inputs: ["glyph", "font", "class", "ariaLabel"] }, { kind: "component", type: i7.LinkComponent, selector: "[fdLink], [fd-link]", inputs: ["class", "emphasized", "disabled", "inverted", "subtle", "undecorated"] }, { kind: "component", type: FormGroupHeaderComponent, selector: "[fdp-form-group-header]", inputs: ["fieldGroup"] }, { kind: "pipe", type: i3.AsyncPipe, name: "async" }, { kind: "pipe", type: i3.KeyValuePipe, name: "keyvalue" }, { kind: "pipe", type: FieldGroupRowValuePipe, name: "fieldGroupRowValue" }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.1.0", ngImport: i0, type: FormGroupComponent, deps: [{ token: i0.ChangeDetectorRef }, { token: i0.ElementRef }, { token: i1$1.ControlContainer, optional: true }, { token: i5$1.ContentDensityObserver }, { token: FDP_FORM_FIELD_HINT_OPTIONS_DEFAULT }], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.1.0", type: FormGroupComponent, isStandalone: true, selector: "fdp-form-group", inputs: { id: "id", name: "name", editable: "editable", noLabelLayout: "noLabelLayout", class: "class", hint: "hint", inlineColumnLayout: "inlineColumnLayout", labelColumnLayout: "labelColumnLayout", fieldColumnLayout: "fieldColumnLayout", gapColumnLayout: "gapColumnLayout", formGroup: "formGroup", topTitle: "topTitle", mainTitle: "mainTitle", hideMainTItle: "hideMainTItle", object: "object", i18Strings: "i18Strings", useForm: "useForm", columnLayout: "columnLayout", unifiedLayout: "unifiedLayout" }, outputs: { onSubmit: "onSubmit" }, providers: [formGroupProvider, FormFieldLayoutService, contentDensityObserverProviders()], queries: [{ propertyName: "i18Template", first: true, predicate: ["i18n"], descendants: true, static: true }, { propertyName: "_errorDirectives", predicate: FormFieldErrorDirective }, { propertyName: "formGroupChildren", predicate: FORM_GROUP_CHILD_FIELD_TOKEN, descendants: true }], viewQueries: [{ propertyName: "nativeForm", first: true, predicate: ["nativeForm"], descendants: true, read: NgForm }], usesOnChanges: true, ngImport: i0, template: "<form #nativeForm (ngSubmit)=\"onSubmit.emit($event)\" *ngIf=\"useForm; else body\" [id]=\"id\" [name]=\"name\">\n    <ng-container *ngTemplateOutlet=\"body\"></ng-container>\n</form>\n\n<ng-template #body>\n    <!--  Render fields and field groups with assigned columns -->\n    <ng-container *ngTemplateOutlet=\"fields\"></ng-container>\n</ng-template>\n\n<ng-template #fields>\n    <div *ngIf=\"mainTitle && !hideMainTItle\" class=\"fd-form-header\">\n        <ng-template [ngTemplateOutlet]=\"mainTitleTemplate\"></ng-template>\n    </div>\n\n    <div\n        class=\"fd-container fd-form-layout-grid-container\"\n        [class.is-compact]=\"contentDensityObserver.isCompact$ | async\"\n    >\n        <div *ngFor=\"let column of formRows | keyvalue; trackBy: trackByFn\" class=\"fd-row\">\n            <div\n                *ngFor=\"let fields of column | fieldGroupRowValue | keyvalue; trackBy: trackByFn; let index = index\"\n                class=\"fd-col fd-form-group\"\n                [class]=\"xlCol\"\n            >\n                <div class=\"fd-row\" *ngIf=\"$fieldGroup(column.value) as value\">\n                    <div class=\"fd-col\">\n                        <div *ngIf=\"value.label\" fdp-form-group-header [fieldGroup]=\"index === 0 ? value : null\"></div>\n                    </div>\n                </div>\n\n                <div *ngFor=\"let field of fields.value; trackBy: trackByFieldName\" class=\"fd-row fd-form-item\">\n                    <div class=\"fd-col\" [class]=\"_inlineColumnLayoutClass\" [style.order]=\"field.rank\">\n                        <ng-container *ngTemplateOutlet=\"field?.renderer || null\"></ng-container>\n                    </div>\n                </div>\n            </div>\n        </div>\n    </div>\n</ng-template>\n\n<!-- For nested form-group -->\n<ng-content select=\"fdp-form-group\"></ng-content>\n\n<ng-template #mainTitleTemplate>\n    <ng-container *ngIf=\"_hintOptions?.content && _hintOptions.position === 'before'\">\n        <ng-template [ngTemplateOutlet]=\"hintTemplate\"></ng-template>\n    </ng-container>\n\n    <h5 class=\"fd-form-header__text\">\n        {{ mainTitle }}\n    </h5>\n\n    <ng-container *ngIf=\"_hintOptions?.content && _hintOptions.position === 'after'\">\n        <ng-template [ngTemplateOutlet]=\"hintTemplate\"></ng-template>\n    </ng-container>\n\n    <ng-template #hintTemplate>\n        <span fd-link [undecorated]=\"true\">\n            <fd-icon\n                [fd-inline-help]=\"_hintOptions.content\"\n                [glyph]=\"_hintOptions.glyph\"\n                [placement]=\"_hintOptions.placement || null\"\n                [triggers]=\"_hintOptions.trigger || []\"\n                tabindex=\"0\"\n            ></fd-icon>\n        </span>\n    </ng-template>\n</ng-template>\n", styles: [".fd-col,.fd-container,.fd-row{-webkit-box-sizing:border-box;border:0;box-sizing:border-box;color:var(--sapTextColor);font-family:var(--sapFontFamily);font-size:var(--sapFontSize);font-weight:400;forced-color-adjust:none;line-height:var(--sapContent_LineHeight);margin:0;padding:0}.fd-col:after,.fd-col:before,.fd-container:after,.fd-container:before,.fd-row:after,.fd-row:before{box-sizing:inherit;font-size:inherit}.fd-container{-ms-flex-wrap:wrap;-webkit-box-flex:0;-ms-flex:0 0 100%;display:flex;flex:0 0 100%;flex-wrap:wrap;padding:0 .25rem;position:relative}.fd-container .fd-row{margin-left:-.25rem;margin-right:-.25rem;min-width:calc(100% + .5rem)}.fd-container>.fd-row>.fd-col{padding-bottom:.25rem;padding-top:.25rem}.fd-container.fd-container--no-gap .fd-row,.fd-container.fd-container--no-horizontal-gap .fd-row{margin-left:0;margin-right:0}.fd-container.fd-container--no-gap .fd-row .fd-col,.fd-container.fd-container--no-horizontal-gap .fd-row .fd-col{padding-left:0;padding-right:0}.fd-container.fd-container--no-gap>.fd-row>.fd-col,.fd-container.fd-container--no-vertical-gap>.fd-row>.fd-col{padding-bottom:0;padding-top:0}.fd-container[dir=rtl],[dir=rtl] .fd-container{direction:rtl}.fd-row{-ms-flex-wrap:wrap;-webkit-box-flex:0;-ms-flex:0 0 100%;display:flex;flex:0 0 100%;flex-wrap:wrap;min-width:100%;position:relative}.fd-col{max-width:100%;min-width:100%;padding-left:.25rem;padding-right:.25rem}.fd-col--0{max-width:0;min-width:0%}.fd-col--offset-0{margin-left:0}.fd-col--offset-0[dir=rtl],[dir=rtl] .fd-col--offset-0{margin-left:0;margin-right:0}.fd-col--offset-after-0{margin-right:0}.fd-col--offset-after-0[dir=rtl],[dir=rtl] .fd-col--offset-after-0{margin-left:0;margin-right:0}.fd-col--1{max-width:8.3333333333%;min-width:8.3333333333%}.fd-col--offset-1{margin-left:8.3333333333%}.fd-col--offset-1[dir=rtl],[dir=rtl] .fd-col--offset-1{margin-left:0;margin-right:8.3333333333%}.fd-col--offset-after-1{margin-right:8.3333333333%}.fd-col--offset-after-1[dir=rtl],[dir=rtl] .fd-col--offset-after-1{margin-left:8.3333333333%;margin-right:0}.fd-col--2{max-width:16.6666666667%;min-width:16.6666666667%}.fd-col--offset-2{margin-left:16.6666666667%}.fd-col--offset-2[dir=rtl],[dir=rtl] .fd-col--offset-2{margin-left:0;margin-right:16.6666666667%}.fd-col--offset-after-2{margin-right:16.6666666667%}.fd-col--offset-after-2[dir=rtl],[dir=rtl] .fd-col--offset-after-2{margin-left:16.6666666667%;margin-right:0}.fd-col--3{max-width:25%;min-width:25%}.fd-col--offset-3{margin-left:25%}.fd-col--offset-3[dir=rtl],[dir=rtl] .fd-col--offset-3{margin-left:0;margin-right:25%}.fd-col--offset-after-3{margin-right:25%}.fd-col--offset-after-3[dir=rtl],[dir=rtl] .fd-col--offset-after-3{margin-left:25%;margin-right:0}.fd-col--4{max-width:33.3333333333%;min-width:33.3333333333%}.fd-col--offset-4{margin-left:33.3333333333%}.fd-col--offset-4[dir=rtl],[dir=rtl] .fd-col--offset-4{margin-left:0;margin-right:33.3333333333%}.fd-col--offset-after-4{margin-right:33.3333333333%}.fd-col--offset-after-4[dir=rtl],[dir=rtl] .fd-col--offset-after-4{margin-left:33.3333333333%;margin-right:0}.fd-col--5{max-width:41.6666666667%;min-width:41.6666666667%}.fd-col--offset-5{margin-left:41.6666666667%}.fd-col--offset-5[dir=rtl],[dir=rtl] .fd-col--offset-5{margin-left:0;margin-right:41.6666666667%}.fd-col--offset-after-5{margin-right:41.6666666667%}.fd-col--offset-after-5[dir=rtl],[dir=rtl] .fd-col--offset-after-5{margin-left:41.6666666667%;margin-right:0}.fd-col--6{max-width:50%;min-width:50%}.fd-col--offset-6{margin-left:50%}.fd-col--offset-6[dir=rtl],[dir=rtl] .fd-col--offset-6{margin-left:0;margin-right:50%}.fd-col--offset-after-6{margin-right:50%}.fd-col--offset-after-6[dir=rtl],[dir=rtl] .fd-col--offset-after-6{margin-left:50%;margin-right:0}.fd-col--7{max-width:58.3333333333%;min-width:58.3333333333%}.fd-col--offset-7{margin-left:58.3333333333%}.fd-col--offset-7[dir=rtl],[dir=rtl] .fd-col--offset-7{margin-left:0;margin-right:58.3333333333%}.fd-col--offset-after-7{margin-right:58.3333333333%}.fd-col--offset-after-7[dir=rtl],[dir=rtl] .fd-col--offset-after-7{margin-left:58.3333333333%;margin-right:0}.fd-col--8{max-width:66.6666666667%;min-width:66.6666666667%}.fd-col--offset-8{margin-left:66.6666666667%}.fd-col--offset-8[dir=rtl],[dir=rtl] .fd-col--offset-8{margin-left:0;margin-right:66.6666666667%}.fd-col--offset-after-8{margin-right:66.6666666667%}.fd-col--offset-after-8[dir=rtl],[dir=rtl] .fd-col--offset-after-8{margin-left:66.6666666667%;margin-right:0}.fd-col--9{max-width:75%;min-width:75%}.fd-col--offset-9{margin-left:75%}.fd-col--offset-9[dir=rtl],[dir=rtl] .fd-col--offset-9{margin-left:0;margin-right:75%}.fd-col--offset-after-9{margin-right:75%}.fd-col--offset-after-9[dir=rtl],[dir=rtl] .fd-col--offset-after-9{margin-left:75%;margin-right:0}.fd-col--10{max-width:83.3333333333%;min-width:83.3333333333%}.fd-col--offset-10{margin-left:83.3333333333%}.fd-col--offset-10[dir=rtl],[dir=rtl] .fd-col--offset-10{margin-left:0;margin-right:83.3333333333%}.fd-col--offset-after-10{margin-right:83.3333333333%}.fd-col--offset-after-10[dir=rtl],[dir=rtl] .fd-col--offset-after-10{margin-left:83.3333333333%;margin-right:0}.fd-col--11{max-width:91.6666666667%;min-width:91.6666666667%}.fd-col--offset-11{margin-left:91.6666666667%}.fd-col--offset-11[dir=rtl],[dir=rtl] .fd-col--offset-11{margin-left:0;margin-right:91.6666666667%}.fd-col--offset-after-11{margin-right:91.6666666667%}.fd-col--offset-after-11[dir=rtl],[dir=rtl] .fd-col--offset-after-11{margin-left:91.6666666667%;margin-right:0}.fd-col--12{max-width:100%;min-width:100%}.fd-col--offset-12{margin-left:100%}.fd-col--offset-12[dir=rtl],[dir=rtl] .fd-col--offset-12{margin-left:0;margin-right:100%}.fd-col--offset-after-12{margin-right:100%}.fd-col--offset-after-12[dir=rtl],[dir=rtl] .fd-col--offset-after-12{margin-left:100%;margin-right:0}.fd-col--full{flex:1;max-width:none;min-width:8.3333333333%}.fd-col--wrap{flex-wrap:wrap}@media (min-width: 600px){.fd-container{padding:0 .5rem}.fd-container .fd-row{margin-left:-.5rem;margin-right:-.5rem;min-width:calc(100% + 1rem)}.fd-container>.fd-row>.fd-col{padding-bottom:.5rem;padding-top:.5rem}.fd-col{padding-left:.5rem;padding-right:.5rem}.fd-col-md--0{max-width:0;min-width:0%}.fd-col-md--offset-0{margin-left:0}.fd-col-md--offset-0[dir=rtl],[dir=rtl] .fd-col-md--offset-0{margin-left:0;margin-right:0}.fd-col-md--offset-after-0{margin-right:0}.fd-col-md--offset-after-0[dir=rtl],[dir=rtl] .fd-col-md--offset-after-0{margin-left:0;margin-right:0}.fd-col-md--1{max-width:8.3333333333%;min-width:8.3333333333%}.fd-col-md--offset-1{margin-left:8.3333333333%}.fd-col-md--offset-1[dir=rtl],[dir=rtl] .fd-col-md--offset-1{margin-left:0;margin-right:8.3333333333%}.fd-col-md--offset-after-1{margin-right:8.3333333333%}.fd-col-md--offset-after-1[dir=rtl],[dir=rtl] .fd-col-md--offset-after-1{margin-left:8.3333333333%;margin-right:0}.fd-col-md--2{max-width:16.6666666667%;min-width:16.6666666667%}.fd-col-md--offset-2{margin-left:16.6666666667%}.fd-col-md--offset-2[dir=rtl],[dir=rtl] .fd-col-md--offset-2{margin-left:0;margin-right:16.6666666667%}.fd-col-md--offset-after-2{margin-right:16.6666666667%}.fd-col-md--offset-after-2[dir=rtl],[dir=rtl] .fd-col-md--offset-after-2{margin-left:16.6666666667%;margin-right:0}.fd-col-md--3{max-width:25%;min-width:25%}.fd-col-md--offset-3{margin-left:25%}.fd-col-md--offset-3[dir=rtl],[dir=rtl] .fd-col-md--offset-3{margin-left:0;margin-right:25%}.fd-col-md--offset-after-3{margin-right:25%}.fd-col-md--offset-after-3[dir=rtl],[dir=rtl] .fd-col-md--offset-after-3{margin-left:25%;margin-right:0}.fd-col-md--4{max-width:33.3333333333%;min-width:33.3333333333%}.fd-col-md--offset-4{margin-left:33.3333333333%}.fd-col-md--offset-4[dir=rtl],[dir=rtl] .fd-col-md--offset-4{margin-left:0;margin-right:33.3333333333%}.fd-col-md--offset-after-4{margin-right:33.3333333333%}.fd-col-md--offset-after-4[dir=rtl],[dir=rtl] .fd-col-md--offset-after-4{margin-left:33.3333333333%;margin-right:0}.fd-col-md--5{max-width:41.6666666667%;min-width:41.6666666667%}.fd-col-md--offset-5{margin-left:41.6666666667%}.fd-col-md--offset-5[dir=rtl],[dir=rtl] .fd-col-md--offset-5{margin-left:0;margin-right:41.6666666667%}.fd-col-md--offset-after-5{margin-right:41.6666666667%}.fd-col-md--offset-after-5[dir=rtl],[dir=rtl] .fd-col-md--offset-after-5{margin-left:41.6666666667%;margin-right:0}.fd-col-md--6{max-width:50%;min-width:50%}.fd-col-md--offset-6{margin-left:50%}.fd-col-md--offset-6[dir=rtl],[dir=rtl] .fd-col-md--offset-6{margin-left:0;margin-right:50%}.fd-col-md--offset-after-6{margin-right:50%}.fd-col-md--offset-after-6[dir=rtl],[dir=rtl] .fd-col-md--offset-after-6{margin-left:50%;margin-right:0}.fd-col-md--7{max-width:58.3333333333%;min-width:58.3333333333%}.fd-col-md--offset-7{margin-left:58.3333333333%}.fd-col-md--offset-7[dir=rtl],[dir=rtl] .fd-col-md--offset-7{margin-left:0;margin-right:58.3333333333%}.fd-col-md--offset-after-7{margin-right:58.3333333333%}.fd-col-md--offset-after-7[dir=rtl],[dir=rtl] .fd-col-md--offset-after-7{margin-left:58.3333333333%;margin-right:0}.fd-col-md--8{max-width:66.6666666667%;min-width:66.6666666667%}.fd-col-md--offset-8{margin-left:66.6666666667%}.fd-col-md--offset-8[dir=rtl],[dir=rtl] .fd-col-md--offset-8{margin-left:0;margin-right:66.6666666667%}.fd-col-md--offset-after-8{margin-right:66.6666666667%}.fd-col-md--offset-after-8[dir=rtl],[dir=rtl] .fd-col-md--offset-after-8{margin-left:66.6666666667%;margin-right:0}.fd-col-md--9{max-width:75%;min-width:75%}.fd-col-md--offset-9{margin-left:75%}.fd-col-md--offset-9[dir=rtl],[dir=rtl] .fd-col-md--offset-9{margin-left:0;margin-right:75%}.fd-col-md--offset-after-9{margin-right:75%}.fd-col-md--offset-after-9[dir=rtl],[dir=rtl] .fd-col-md--offset-after-9{margin-left:75%;margin-right:0}.fd-col-md--10{max-width:83.3333333333%;min-width:83.3333333333%}.fd-col-md--offset-10{margin-left:83.3333333333%}.fd-col-md--offset-10[dir=rtl],[dir=rtl] .fd-col-md--offset-10{margin-left:0;margin-right:83.3333333333%}.fd-col-md--offset-after-10{margin-right:83.3333333333%}.fd-col-md--offset-after-10[dir=rtl],[dir=rtl] .fd-col-md--offset-after-10{margin-left:83.3333333333%;margin-right:0}.fd-col-md--11{max-width:91.6666666667%;min-width:91.6666666667%}.fd-col-md--offset-11{margin-left:91.6666666667%}.fd-col-md--offset-11[dir=rtl],[dir=rtl] .fd-col-md--offset-11{margin-left:0;margin-right:91.6666666667%}.fd-col-md--offset-after-11{margin-right:91.6666666667%}.fd-col-md--offset-after-11[dir=rtl],[dir=rtl] .fd-col-md--offset-after-11{margin-left:91.6666666667%;margin-right:0}.fd-col-md--12{max-width:100%;min-width:100%}.fd-col-md--offset-12{margin-left:100%}.fd-col-md--offset-12[dir=rtl],[dir=rtl] .fd-col-md--offset-12{margin-left:0;margin-right:100%}.fd-col-md--offset-after-12{margin-right:100%}.fd-col-md--offset-after-12[dir=rtl],[dir=rtl] .fd-col-md--offset-after-12{margin-left:100%;margin-right:0}}@media (min-width: 1024px){.fd-col-lg--0{max-width:0;min-width:0%}.fd-col-lg--offset-0{margin-left:0}.fd-col-lg--offset-0[dir=rtl],[dir=rtl] .fd-col-lg--offset-0{margin-left:0;margin-right:0}.fd-col-lg--offset-after-0{margin-right:0}.fd-col-lg--offset-after-0[dir=rtl],[dir=rtl] .fd-col-lg--offset-after-0{margin-left:0;margin-right:0}.fd-col-lg--1{max-width:8.3333333333%;min-width:8.3333333333%}.fd-col-lg--offset-1{margin-left:8.3333333333%}.fd-col-lg--offset-1[dir=rtl],[dir=rtl] .fd-col-lg--offset-1{margin-left:0;margin-right:8.3333333333%}.fd-col-lg--offset-after-1{margin-right:8.3333333333%}.fd-col-lg--offset-after-1[dir=rtl],[dir=rtl] .fd-col-lg--offset-after-1{margin-left:8.3333333333%;margin-right:0}.fd-col-lg--2{max-width:16.6666666667%;min-width:16.6666666667%}.fd-col-lg--offset-2{margin-left:16.6666666667%}.fd-col-lg--offset-2[dir=rtl],[dir=rtl] .fd-col-lg--offset-2{margin-left:0;margin-right:16.6666666667%}.fd-col-lg--offset-after-2{margin-right:16.6666666667%}.fd-col-lg--offset-after-2[dir=rtl],[dir=rtl] .fd-col-lg--offset-after-2{margin-left:16.6666666667%;margin-right:0}.fd-col-lg--3{max-width:25%;min-width:25%}.fd-col-lg--offset-3{margin-left:25%}.fd-col-lg--offset-3[dir=rtl],[dir=rtl] .fd-col-lg--offset-3{margin-left:0;margin-right:25%}.fd-col-lg--offset-after-3{margin-right:25%}.fd-col-lg--offset-after-3[dir=rtl],[dir=rtl] .fd-col-lg--offset-after-3{margin-left:25%;margin-right:0}.fd-col-lg--4{max-width:33.3333333333%;min-width:33.3333333333%}.fd-col-lg--offset-4{margin-left:33.3333333333%}.fd-col-lg--offset-4[dir=rtl],[dir=rtl] .fd-col-lg--offset-4{margin-left:0;margin-right:33.3333333333%}.fd-col-lg--offset-after-4{margin-right:33.3333333333%}.fd-col-lg--offset-after-4[dir=rtl],[dir=rtl] .fd-col-lg--offset-after-4{margin-left:33.3333333333%;margin-right:0}.fd-col-lg--5{max-width:41.6666666667%;min-width:41.6666666667%}.fd-col-lg--offset-5{margin-left:41.6666666667%}.fd-col-lg--offset-5[dir=rtl],[dir=rtl] .fd-col-lg--offset-5{margin-left:0;margin-right:41.6666666667%}.fd-col-lg--offset-after-5{margin-right:41.6666666667%}.fd-col-lg--offset-after-5[dir=rtl],[dir=rtl] .fd-col-lg--offset-after-5{margin-left:41.6666666667%;margin-right:0}.fd-col-lg--6{max-width:50%;min-width:50%}.fd-col-lg--offset-6{margin-left:50%}.fd-col-lg--offset-6[dir=rtl],[dir=rtl] .fd-col-lg--offset-6{margin-left:0;margin-right:50%}.fd-col-lg--offset-after-6{margin-right:50%}.fd-col-lg--offset-after-6[dir=rtl],[dir=rtl] .fd-col-lg--offset-after-6{margin-left:50%;margin-right:0}.fd-col-lg--7{max-width:58.3333333333%;min-width:58.3333333333%}.fd-col-lg--offset-7{margin-left:58.3333333333%}.fd-col-lg--offset-7[dir=rtl],[dir=rtl] .fd-col-lg--offset-7{margin-left:0;margin-right:58.3333333333%}.fd-col-lg--offset-after-7{margin-right:58.3333333333%}.fd-col-lg--offset-after-7[dir=rtl],[dir=rtl] .fd-col-lg--offset-after-7{margin-left:58.3333333333%;margin-right:0}.fd-col-lg--8{max-width:66.6666666667%;min-width:66.6666666667%}.fd-col-lg--offset-8{margin-left:66.6666666667%}.fd-col-lg--offset-8[dir=rtl],[dir=rtl] .fd-col-lg--offset-8{margin-left:0;margin-right:66.6666666667%}.fd-col-lg--offset-after-8{margin-right:66.6666666667%}.fd-col-lg--offset-after-8[dir=rtl],[dir=rtl] .fd-col-lg--offset-after-8{margin-left:66.6666666667%;margin-right:0}.fd-col-lg--9{max-width:75%;min-width:75%}.fd-col-lg--offset-9{margin-left:75%}.fd-col-lg--offset-9[dir=rtl],[dir=rtl] .fd-col-lg--offset-9{margin-left:0;margin-right:75%}.fd-col-lg--offset-after-9{margin-right:75%}.fd-col-lg--offset-after-9[dir=rtl],[dir=rtl] .fd-col-lg--offset-after-9{margin-left:75%;margin-right:0}.fd-col-lg--10{max-width:83.3333333333%;min-width:83.3333333333%}.fd-col-lg--offset-10{margin-left:83.3333333333%}.fd-col-lg--offset-10[dir=rtl],[dir=rtl] .fd-col-lg--offset-10{margin-left:0;margin-right:83.3333333333%}.fd-col-lg--offset-after-10{margin-right:83.3333333333%}.fd-col-lg--offset-after-10[dir=rtl],[dir=rtl] .fd-col-lg--offset-after-10{margin-left:83.3333333333%;margin-right:0}.fd-col-lg--11{max-width:91.6666666667%;min-width:91.6666666667%}.fd-col-lg--offset-11{margin-left:91.6666666667%}.fd-col-lg--offset-11[dir=rtl],[dir=rtl] .fd-col-lg--offset-11{margin-left:0;margin-right:91.6666666667%}.fd-col-lg--offset-after-11{margin-right:91.6666666667%}.fd-col-lg--offset-after-11[dir=rtl],[dir=rtl] .fd-col-lg--offset-after-11{margin-left:91.6666666667%;margin-right:0}.fd-col-lg--12{max-width:100%;min-width:100%}.fd-col-lg--offset-12{margin-left:100%}.fd-col-lg--offset-12[dir=rtl],[dir=rtl] .fd-col-lg--offset-12{margin-left:0;margin-right:100%}.fd-col-lg--offset-after-12{margin-right:100%}.fd-col-lg--offset-after-12[dir=rtl],[dir=rtl] .fd-col-lg--offset-after-12{margin-left:100%;margin-right:0}}@media (min-width: 1440px){.fd-col-xl--0{max-width:0;min-width:0%}.fd-col-xl--offset-0{margin-left:0}.fd-col-xl--offset-0[dir=rtl],[dir=rtl] .fd-col-xl--offset-0{margin-left:0;margin-right:0}.fd-col-xl--offset-after-0{margin-right:0}.fd-col-xl--offset-after-0[dir=rtl],[dir=rtl] .fd-col-xl--offset-after-0{margin-left:0;margin-right:0}.fd-col-xl--1{max-width:8.3333333333%;min-width:8.3333333333%}.fd-col-xl--offset-1{margin-left:8.3333333333%}.fd-col-xl--offset-1[dir=rtl],[dir=rtl] .fd-col-xl--offset-1{margin-left:0;margin-right:8.3333333333%}.fd-col-xl--offset-after-1{margin-right:8.3333333333%}.fd-col-xl--offset-after-1[dir=rtl],[dir=rtl] .fd-col-xl--offset-after-1{margin-left:8.3333333333%;margin-right:0}.fd-col-xl--2{max-width:16.6666666667%;min-width:16.6666666667%}.fd-col-xl--offset-2{margin-left:16.6666666667%}.fd-col-xl--offset-2[dir=rtl],[dir=rtl] .fd-col-xl--offset-2{margin-left:0;margin-right:16.6666666667%}.fd-col-xl--offset-after-2{margin-right:16.6666666667%}.fd-col-xl--offset-after-2[dir=rtl],[dir=rtl] .fd-col-xl--offset-after-2{margin-left:16.6666666667%;margin-right:0}.fd-col-xl--3{max-width:25%;min-width:25%}.fd-col-xl--offset-3{margin-left:25%}.fd-col-xl--offset-3[dir=rtl],[dir=rtl] .fd-col-xl--offset-3{margin-left:0;margin-right:25%}.fd-col-xl--offset-after-3{margin-right:25%}.fd-col-xl--offset-after-3[dir=rtl],[dir=rtl] .fd-col-xl--offset-after-3{margin-left:25%;margin-right:0}.fd-col-xl--4{max-width:33.3333333333%;min-width:33.3333333333%}.fd-col-xl--offset-4{margin-left:33.3333333333%}.fd-col-xl--offset-4[dir=rtl],[dir=rtl] .fd-col-xl--offset-4{margin-left:0;margin-right:33.3333333333%}.fd-col-xl--offset-after-4{margin-right:33.3333333333%}.fd-col-xl--offset-after-4[dir=rtl],[dir=rtl] .fd-col-xl--offset-after-4{margin-left:33.3333333333%;margin-right:0}.fd-col-xl--5{max-width:41.6666666667%;min-width:41.6666666667%}.fd-col-xl--offset-5{margin-left:41.6666666667%}.fd-col-xl--offset-5[dir=rtl],[dir=rtl] .fd-col-xl--offset-5{margin-left:0;margin-right:41.6666666667%}.fd-col-xl--offset-after-5{margin-right:41.6666666667%}.fd-col-xl--offset-after-5[dir=rtl],[dir=rtl] .fd-col-xl--offset-after-5{margin-left:41.6666666667%;margin-right:0}.fd-col-xl--6{max-width:50%;min-width:50%}.fd-col-xl--offset-6{margin-left:50%}.fd-col-xl--offset-6[dir=rtl],[dir=rtl] .fd-col-xl--offset-6{margin-left:0;margin-right:50%}.fd-col-xl--offset-after-6{margin-right:50%}.fd-col-xl--offset-after-6[dir=rtl],[dir=rtl] .fd-col-xl--offset-after-6{margin-left:50%;margin-right:0}.fd-col-xl--7{max-width:58.3333333333%;min-width:58.3333333333%}.fd-col-xl--offset-7{margin-left:58.3333333333%}.fd-col-xl--offset-7[dir=rtl],[dir=rtl] .fd-col-xl--offset-7{margin-left:0;margin-right:58.3333333333%}.fd-col-xl--offset-after-7{margin-right:58.3333333333%}.fd-col-xl--offset-after-7[dir=rtl],[dir=rtl] .fd-col-xl--offset-after-7{margin-left:58.3333333333%;margin-right:0}.fd-col-xl--8{max-width:66.6666666667%;min-width:66.6666666667%}.fd-col-xl--offset-8{margin-left:66.6666666667%}.fd-col-xl--offset-8[dir=rtl],[dir=rtl] .fd-col-xl--offset-8{margin-left:0;margin-right:66.6666666667%}.fd-col-xl--offset-after-8{margin-right:66.6666666667%}.fd-col-xl--offset-after-8[dir=rtl],[dir=rtl] .fd-col-xl--offset-after-8{margin-left:66.6666666667%;margin-right:0}.fd-col-xl--9{max-width:75%;min-width:75%}.fd-col-xl--offset-9{margin-left:75%}.fd-col-xl--offset-9[dir=rtl],[dir=rtl] .fd-col-xl--offset-9{margin-left:0;margin-right:75%}.fd-col-xl--offset-after-9{margin-right:75%}.fd-col-xl--offset-after-9[dir=rtl],[dir=rtl] .fd-col-xl--offset-after-9{margin-left:75%;margin-right:0}.fd-col-xl--10{max-width:83.3333333333%;min-width:83.3333333333%}.fd-col-xl--offset-10{margin-left:83.3333333333%}.fd-col-xl--offset-10[dir=rtl],[dir=rtl] .fd-col-xl--offset-10{margin-left:0;margin-right:83.3333333333%}.fd-col-xl--offset-after-10{margin-right:83.3333333333%}.fd-col-xl--offset-after-10[dir=rtl],[dir=rtl] .fd-col-xl--offset-after-10{margin-left:83.3333333333%;margin-right:0}.fd-col-xl--11{max-width:91.6666666667%;min-width:91.6666666667%}.fd-col-xl--offset-11{margin-left:91.6666666667%}.fd-col-xl--offset-11[dir=rtl],[dir=rtl] .fd-col-xl--offset-11{margin-left:0;margin-right:91.6666666667%}.fd-col-xl--offset-after-11{margin-right:91.6666666667%}.fd-col-xl--offset-after-11[dir=rtl],[dir=rtl] .fd-col-xl--offset-after-11{margin-left:91.6666666667%;margin-right:0}.fd-col-xl--12{max-width:100%;min-width:100%}.fd-col-xl--offset-12{margin-left:100%}.fd-col-xl--offset-12[dir=rtl],[dir=rtl] .fd-col-xl--offset-12{margin-left:0;margin-right:100%}.fd-col-xl--offset-after-12{margin-right:100%}.fd-col-xl--offset-after-12[dir=rtl],[dir=rtl] .fd-col-xl--offset-after-12{margin-left:100%;margin-right:0}}.fd-container.fd-form-layout-grid-container .fd-form-group,.fd-container.fd-form-layout-grid-container.fd-form-group{padding:1rem!important}.fd-container.fd-form-layout-grid-container .fd-form-group .fd-form-group,.fd-container.fd-form-layout-grid-container.fd-form-group .fd-form-group{padding:0!important}.fd-container.fd-form-layout-grid-container .fd-form-group .fd-form-item .fd-form-label,.fd-container.fd-form-layout-grid-container.fd-form-group .fd-form-item .fd-form-label{margin-right:0;white-space:normal}.fd-container.fd-form-layout-grid-container .fd-form-group .fd-form-item .fd-form-label[dir=rtl],.fd-container.fd-form-layout-grid-container.fd-form-group .fd-form-item .fd-form-label[dir=rtl],[dir=rtl] .fd-container.fd-form-layout-grid-container .fd-form-group .fd-form-item .fd-form-label,[dir=rtl] .fd-container.fd-form-layout-grid-container.fd-form-group .fd-form-item .fd-form-label{margin-left:0;margin-right:0}.fd-container.fd-form-layout-grid-container .fd-form-group .fd-form-item .fd-form-label--required,.fd-container.fd-form-layout-grid-container.fd-form-group .fd-form-item .fd-form-label--required{padding-right:.5rem}.fd-container.fd-form-layout-grid-container .fd-form-group .fd-form-item .fd-form-label--required[dir=rtl],.fd-container.fd-form-layout-grid-container.fd-form-group .fd-form-item .fd-form-label--required[dir=rtl],[dir=rtl] .fd-container.fd-form-layout-grid-container .fd-form-group .fd-form-item .fd-form-label--required,[dir=rtl] .fd-container.fd-form-layout-grid-container.fd-form-group .fd-form-item .fd-form-label--required{padding-left:.5rem;padding-right:0}.fd-container.fd-form-layout-grid-container .fd-row{flex-direction:row}.fd-container.fd-form-layout-grid-container .fd-row .fd-col{overflow:hidden;padding-bottom:0;padding-top:0;text-overflow:ellipsis;white-space:nowrap}.fd-container.fd-form-layout-grid-container .fd-row .fd-col:not(.fd-form-group){align-self:center}@media (min-width: 0){.fd-container.fd-form-layout-grid-container.fd-form-layout-grid-container--vertical .fd-form-group .fd-form-item,.fd-container.fd-form-layout-grid-container.fd-form-layout-grid-container--vertical.fd-form-group .fd-form-item{margin-top:.625rem}.fd-container.fd-form-layout-grid-container.fd-form-layout-grid-container--vertical .fd-form-group .fd-form-item:first-of-type,.fd-container.fd-form-layout-grid-container.fd-form-layout-grid-container--vertical.fd-form-group .fd-form-item:first-of-type{margin-top:0}.fd-container.fd-form-layout-grid-container .fd-row .fd-col--1>.fd-form-label{float:right;padding-bottom:0;text-align:right;width:100%}.fd-container.fd-form-layout-grid-container .fd-row .fd-col--1>.fd-form-label[dir=rtl],[dir=rtl] .fd-container.fd-form-layout-grid-container .fd-row .fd-col--1>.fd-form-label{float:left;text-align:left}.fd-container.fd-form-layout-grid-container .fd-row .fd-col--2>.fd-form-label{float:right;padding-bottom:0;text-align:right;width:100%}.fd-container.fd-form-layout-grid-container .fd-row .fd-col--2>.fd-form-label[dir=rtl],[dir=rtl] .fd-container.fd-form-layout-grid-container .fd-row .fd-col--2>.fd-form-label{float:left;text-align:left}.fd-container.fd-form-layout-grid-container .fd-row .fd-col--3>.fd-form-label{float:right;padding-bottom:0;text-align:right;width:100%}.fd-container.fd-form-layout-grid-container .fd-row .fd-col--3>.fd-form-label[dir=rtl],[dir=rtl] .fd-container.fd-form-layout-grid-container .fd-row .fd-col--3>.fd-form-label{float:left;text-align:left}.fd-container.fd-form-layout-grid-container .fd-row .fd-col--4>.fd-form-label{float:right;padding-bottom:0;text-align:right;width:100%}.fd-container.fd-form-layout-grid-container .fd-row .fd-col--4>.fd-form-label[dir=rtl],[dir=rtl] .fd-container.fd-form-layout-grid-container .fd-row .fd-col--4>.fd-form-label{float:left;text-align:left}.fd-container.fd-form-layout-grid-container .fd-row .fd-col--5>.fd-form-label{float:right;padding-bottom:0;text-align:right;width:100%}.fd-container.fd-form-layout-grid-container .fd-row .fd-col--5>.fd-form-label[dir=rtl],[dir=rtl] .fd-container.fd-form-layout-grid-container .fd-row .fd-col--5>.fd-form-label{float:left;text-align:left}.fd-container.fd-form-layout-grid-container .fd-row .fd-col--6>.fd-form-label{float:right;padding-bottom:0;text-align:right;width:100%}.fd-container.fd-form-layout-grid-container .fd-row .fd-col--6>.fd-form-label[dir=rtl],[dir=rtl] .fd-container.fd-form-layout-grid-container .fd-row .fd-col--6>.fd-form-label{float:left;text-align:left}.fd-container.fd-form-layout-grid-container .fd-row .fd-col--7>.fd-form-label{float:right;padding-bottom:0;text-align:right;width:100%}.fd-container.fd-form-layout-grid-container .fd-row .fd-col--7>.fd-form-label[dir=rtl],[dir=rtl] .fd-container.fd-form-layout-grid-container .fd-row .fd-col--7>.fd-form-label{float:left;text-align:left}.fd-container.fd-form-layout-grid-container .fd-row .fd-col--8>.fd-form-label{float:right;padding-bottom:0;text-align:right;width:100%}.fd-container.fd-form-layout-grid-container .fd-row .fd-col--8>.fd-form-label[dir=rtl],[dir=rtl] .fd-container.fd-form-layout-grid-container .fd-row .fd-col--8>.fd-form-label{float:left;text-align:left}.fd-container.fd-form-layout-grid-container .fd-row .fd-col--9>.fd-form-label{float:right;padding-bottom:0;text-align:right;width:100%}.fd-container.fd-form-layout-grid-container .fd-row .fd-col--9>.fd-form-label[dir=rtl],[dir=rtl] .fd-container.fd-form-layout-grid-container .fd-row .fd-col--9>.fd-form-label{float:left;text-align:left}.fd-container.fd-form-layout-grid-container .fd-row .fd-col--10>.fd-form-label{float:right;padding-bottom:0;text-align:right;width:100%}.fd-container.fd-form-layout-grid-container .fd-row .fd-col--10>.fd-form-label[dir=rtl],[dir=rtl] .fd-container.fd-form-layout-grid-container .fd-row .fd-col--10>.fd-form-label{float:left;text-align:left}.fd-container.fd-form-layout-grid-container .fd-row .fd-col--11>.fd-form-label{float:right;padding-bottom:0;text-align:right;width:100%}.fd-container.fd-form-layout-grid-container .fd-row .fd-col--11>.fd-form-label[dir=rtl],[dir=rtl] .fd-container.fd-form-layout-grid-container .fd-row .fd-col--11>.fd-form-label{float:left;text-align:left}.fd-container.fd-form-layout-grid-container .fd-row .fd-col--12>.fd-form-label,.fd-container.fd-form-layout-grid-container .fd-row .fd-col>.fd-form-label{float:left;padding-bottom:.125rem;text-align:left;width:auto}.fd-container.fd-form-layout-grid-container .fd-row .fd-col--12>.fd-form-label[dir=rtl],.fd-container.fd-form-layout-grid-container .fd-row .fd-col>.fd-form-label[dir=rtl],[dir=rtl] .fd-container.fd-form-layout-grid-container .fd-row .fd-col--12>.fd-form-label,[dir=rtl] .fd-container.fd-form-layout-grid-container .fd-row .fd-col>.fd-form-label{float:right;text-align:right}}@media (min-width: 0) and (max-width: 599px){.fd-container.fd-form-layout-grid-container.fd-form-layout-grid-container .fd-form-group .fd-form-item,.fd-container.fd-form-layout-grid-container.fd-form-layout-grid-container.fd-form-group .fd-form-item{margin-top:.625rem}.fd-container.fd-form-layout-grid-container.fd-form-layout-grid-container .fd-form-group .fd-form-item:first-of-type,.fd-container.fd-form-layout-grid-container.fd-form-layout-grid-container.fd-form-group .fd-form-item:first-of-type{margin-top:0}}@media (min-width: 600px){.fd-container.fd-form-layout-grid-container{padding:0 .25rem}.fd-container.fd-form-layout-grid-container .fd-row{margin:0 -.25rem;min-width:calc(100% + .5rem)}.fd-container.fd-form-layout-grid-container .fd-row .fd-col{padding:0 .25rem}.fd-container.fd-form-layout-grid-container .fd-row .fd-col-md--1>.fd-form-label{float:right;padding-bottom:0;text-align:right;width:100%}.fd-container.fd-form-layout-grid-container .fd-row .fd-col-md--1>.fd-form-label[dir=rtl],[dir=rtl] .fd-container.fd-form-layout-grid-container .fd-row .fd-col-md--1>.fd-form-label{float:left;text-align:left}.fd-container.fd-form-layout-grid-container .fd-row .fd-col-md--2>.fd-form-label{float:right;padding-bottom:0;text-align:right;width:100%}.fd-container.fd-form-layout-grid-container .fd-row .fd-col-md--2>.fd-form-label[dir=rtl],[dir=rtl] .fd-container.fd-form-layout-grid-container .fd-row .fd-col-md--2>.fd-form-label{float:left;text-align:left}.fd-container.fd-form-layout-grid-container .fd-row .fd-col-md--3>.fd-form-label{float:right;padding-bottom:0;text-align:right;width:100%}.fd-container.fd-form-layout-grid-container .fd-row .fd-col-md--3>.fd-form-label[dir=rtl],[dir=rtl] .fd-container.fd-form-layout-grid-container .fd-row .fd-col-md--3>.fd-form-label{float:left;text-align:left}.fd-container.fd-form-layout-grid-container .fd-row .fd-col-md--4>.fd-form-label{float:right;padding-bottom:0;text-align:right;width:100%}.fd-container.fd-form-layout-grid-container .fd-row .fd-col-md--4>.fd-form-label[dir=rtl],[dir=rtl] .fd-container.fd-form-layout-grid-container .fd-row .fd-col-md--4>.fd-form-label{float:left;text-align:left}.fd-container.fd-form-layout-grid-container .fd-row .fd-col-md--5>.fd-form-label{float:right;padding-bottom:0;text-align:right;width:100%}.fd-container.fd-form-layout-grid-container .fd-row .fd-col-md--5>.fd-form-label[dir=rtl],[dir=rtl] .fd-container.fd-form-layout-grid-container .fd-row .fd-col-md--5>.fd-form-label{float:left;text-align:left}.fd-container.fd-form-layout-grid-container .fd-row .fd-col-md--6>.fd-form-label{float:right;padding-bottom:0;text-align:right;width:100%}.fd-container.fd-form-layout-grid-container .fd-row .fd-col-md--6>.fd-form-label[dir=rtl],[dir=rtl] .fd-container.fd-form-layout-grid-container .fd-row .fd-col-md--6>.fd-form-label{float:left;text-align:left}.fd-container.fd-form-layout-grid-container .fd-row .fd-col-md--7>.fd-form-label{float:right;padding-bottom:0;text-align:right;width:100%}.fd-container.fd-form-layout-grid-container .fd-row .fd-col-md--7>.fd-form-label[dir=rtl],[dir=rtl] .fd-container.fd-form-layout-grid-container .fd-row .fd-col-md--7>.fd-form-label{float:left;text-align:left}.fd-container.fd-form-layout-grid-container .fd-row .fd-col-md--8>.fd-form-label{float:right;padding-bottom:0;text-align:right;width:100%}.fd-container.fd-form-layout-grid-container .fd-row .fd-col-md--8>.fd-form-label[dir=rtl],[dir=rtl] .fd-container.fd-form-layout-grid-container .fd-row .fd-col-md--8>.fd-form-label{float:left;text-align:left}.fd-container.fd-form-layout-grid-container .fd-row .fd-col-md--9>.fd-form-label{float:right;padding-bottom:0;text-align:right;width:100%}.fd-container.fd-form-layout-grid-container .fd-row .fd-col-md--9>.fd-form-label[dir=rtl],[dir=rtl] .fd-container.fd-form-layout-grid-container .fd-row .fd-col-md--9>.fd-form-label{float:left;text-align:left}.fd-container.fd-form-layout-grid-container .fd-row .fd-col-md--10>.fd-form-label{float:right;padding-bottom:0;text-align:right;width:100%}.fd-container.fd-form-layout-grid-container .fd-row .fd-col-md--10>.fd-form-label[dir=rtl],[dir=rtl] .fd-container.fd-form-layout-grid-container .fd-row .fd-col-md--10>.fd-form-label{float:left;text-align:left}.fd-container.fd-form-layout-grid-container .fd-row .fd-col-md--11>.fd-form-label{float:right;padding-bottom:0;text-align:right;width:100%}.fd-container.fd-form-layout-grid-container .fd-row .fd-col-md--11>.fd-form-label[dir=rtl],[dir=rtl] .fd-container.fd-form-layout-grid-container .fd-row .fd-col-md--11>.fd-form-label{float:left;text-align:left}.fd-container.fd-form-layout-grid-container .fd-row .fd-col-md--12>.fd-form-label,.fd-container.fd-form-layout-grid-container .fd-row .fd-col-md>.fd-form-label{float:left;padding-bottom:.125rem;text-align:left;width:auto}.fd-container.fd-form-layout-grid-container .fd-row .fd-col-md--12>.fd-form-label[dir=rtl],.fd-container.fd-form-layout-grid-container .fd-row .fd-col-md>.fd-form-label[dir=rtl],[dir=rtl] .fd-container.fd-form-layout-grid-container .fd-row .fd-col-md--12>.fd-form-label,[dir=rtl] .fd-container.fd-form-layout-grid-container .fd-row .fd-col-md>.fd-form-label{float:right;text-align:right}}@media (min-width: 600px) and (max-width: 1023px){.fd-container.fd-form-layout-grid-container.fd-form-layout-grid-container--md-vertical .fd-form-group .fd-form-item,.fd-container.fd-form-layout-grid-container.fd-form-layout-grid-container--md-vertical.fd-form-group .fd-form-item{margin-top:.625rem}.fd-container.fd-form-layout-grid-container.fd-form-layout-grid-container--md-vertical .fd-form-group .fd-form-item:first-of-type,.fd-container.fd-form-layout-grid-container.fd-form-layout-grid-container--md-vertical.fd-form-group .fd-form-item:first-of-type{margin-top:0}}@media (min-width: 1024px){.fd-container.fd-form-layout-grid-container .fd-row .fd-col-lg--1>.fd-form-label{float:right;padding-bottom:0;text-align:right;width:100%}.fd-container.fd-form-layout-grid-container .fd-row .fd-col-lg--1>.fd-form-label[dir=rtl],[dir=rtl] .fd-container.fd-form-layout-grid-container .fd-row .fd-col-lg--1>.fd-form-label{float:left;text-align:left}.fd-container.fd-form-layout-grid-container .fd-row .fd-col-lg--2>.fd-form-label{float:right;padding-bottom:0;text-align:right;width:100%}.fd-container.fd-form-layout-grid-container .fd-row .fd-col-lg--2>.fd-form-label[dir=rtl],[dir=rtl] .fd-container.fd-form-layout-grid-container .fd-row .fd-col-lg--2>.fd-form-label{float:left;text-align:left}.fd-container.fd-form-layout-grid-container .fd-row .fd-col-lg--3>.fd-form-label{float:right;padding-bottom:0;text-align:right;width:100%}.fd-container.fd-form-layout-grid-container .fd-row .fd-col-lg--3>.fd-form-label[dir=rtl],[dir=rtl] .fd-container.fd-form-layout-grid-container .fd-row .fd-col-lg--3>.fd-form-label{float:left;text-align:left}.fd-container.fd-form-layout-grid-container .fd-row .fd-col-lg--4>.fd-form-label{float:right;padding-bottom:0;text-align:right;width:100%}.fd-container.fd-form-layout-grid-container .fd-row .fd-col-lg--4>.fd-form-label[dir=rtl],[dir=rtl] .fd-container.fd-form-layout-grid-container .fd-row .fd-col-lg--4>.fd-form-label{float:left;text-align:left}.fd-container.fd-form-layout-grid-container .fd-row .fd-col-lg--5>.fd-form-label{float:right;padding-bottom:0;text-align:right;width:100%}.fd-container.fd-form-layout-grid-container .fd-row .fd-col-lg--5>.fd-form-label[dir=rtl],[dir=rtl] .fd-container.fd-form-layout-grid-container .fd-row .fd-col-lg--5>.fd-form-label{float:left;text-align:left}.fd-container.fd-form-layout-grid-container .fd-row .fd-col-lg--6>.fd-form-label{float:right;padding-bottom:0;text-align:right;width:100%}.fd-container.fd-form-layout-grid-container .fd-row .fd-col-lg--6>.fd-form-label[dir=rtl],[dir=rtl] .fd-container.fd-form-layout-grid-container .fd-row .fd-col-lg--6>.fd-form-label{float:left;text-align:left}.fd-container.fd-form-layout-grid-container .fd-row .fd-col-lg--7>.fd-form-label{float:right;padding-bottom:0;text-align:right;width:100%}.fd-container.fd-form-layout-grid-container .fd-row .fd-col-lg--7>.fd-form-label[dir=rtl],[dir=rtl] .fd-container.fd-form-layout-grid-container .fd-row .fd-col-lg--7>.fd-form-label{float:left;text-align:left}.fd-container.fd-form-layout-grid-container .fd-row .fd-col-lg--8>.fd-form-label{float:right;padding-bottom:0;text-align:right;width:100%}.fd-container.fd-form-layout-grid-container .fd-row .fd-col-lg--8>.fd-form-label[dir=rtl],[dir=rtl] .fd-container.fd-form-layout-grid-container .fd-row .fd-col-lg--8>.fd-form-label{float:left;text-align:left}.fd-container.fd-form-layout-grid-container .fd-row .fd-col-lg--9>.fd-form-label{float:right;padding-bottom:0;text-align:right;width:100%}.fd-container.fd-form-layout-grid-container .fd-row .fd-col-lg--9>.fd-form-label[dir=rtl],[dir=rtl] .fd-container.fd-form-layout-grid-container .fd-row .fd-col-lg--9>.fd-form-label{float:left;text-align:left}.fd-container.fd-form-layout-grid-container .fd-row .fd-col-lg--10>.fd-form-label{float:right;padding-bottom:0;text-align:right;width:100%}.fd-container.fd-form-layout-grid-container .fd-row .fd-col-lg--10>.fd-form-label[dir=rtl],[dir=rtl] .fd-container.fd-form-layout-grid-container .fd-row .fd-col-lg--10>.fd-form-label{float:left;text-align:left}.fd-container.fd-form-layout-grid-container .fd-row .fd-col-lg--11>.fd-form-label{float:right;padding-bottom:0;text-align:right;width:100%}.fd-container.fd-form-layout-grid-container .fd-row .fd-col-lg--11>.fd-form-label[dir=rtl],[dir=rtl] .fd-container.fd-form-layout-grid-container .fd-row .fd-col-lg--11>.fd-form-label{float:left;text-align:left}.fd-container.fd-form-layout-grid-container .fd-row .fd-col-lg--12>.fd-form-label,.fd-container.fd-form-layout-grid-container .fd-row .fd-col-lg>.fd-form-label{float:left;padding-bottom:.125rem;text-align:left;width:auto}.fd-container.fd-form-layout-grid-container .fd-row .fd-col-lg--12>.fd-form-label[dir=rtl],.fd-container.fd-form-layout-grid-container .fd-row .fd-col-lg>.fd-form-label[dir=rtl],[dir=rtl] .fd-container.fd-form-layout-grid-container .fd-row .fd-col-lg--12>.fd-form-label,[dir=rtl] .fd-container.fd-form-layout-grid-container .fd-row .fd-col-lg>.fd-form-label{float:right;text-align:right}}@media (min-width: 1024px) and (max-width: 1443px){.fd-container.fd-form-layout-grid-container.fd-form-layout-grid-container--lg-vertical .fd-form-group .fd-form-item,.fd-container.fd-form-layout-grid-container.fd-form-layout-grid-container--lg-vertical.fd-form-group .fd-form-item{margin-top:.625rem}.fd-container.fd-form-layout-grid-container.fd-form-layout-grid-container--lg-vertical .fd-form-group .fd-form-item:first-of-type,.fd-container.fd-form-layout-grid-container.fd-form-layout-grid-container--lg-vertical.fd-form-group .fd-form-item:first-of-type{margin-top:0}}@media (min-width: 1440px){.fd-container.fd-form-layout-grid-container.fd-form-layout-grid-container--xl-vertical .fd-form-group .fd-form-item,.fd-container.fd-form-layout-grid-container.fd-form-layout-grid-container--xl-vertical.fd-form-group .fd-form-item{margin-top:.625rem}.fd-container.fd-form-layout-grid-container.fd-form-layout-grid-container--xl-vertical .fd-form-group .fd-form-item:first-of-type,.fd-container.fd-form-layout-grid-container.fd-form-layout-grid-container--xl-vertical.fd-form-group .fd-form-item:first-of-type{margin-top:0}.fd-container.fd-form-layout-grid-container .fd-row .fd-col-xl--1>.fd-form-label{float:right;padding-bottom:0;text-align:right;width:100%}.fd-container.fd-form-layout-grid-container .fd-row .fd-col-xl--1>.fd-form-label[dir=rtl],[dir=rtl] .fd-container.fd-form-layout-grid-container .fd-row .fd-col-xl--1>.fd-form-label{float:left;text-align:left}.fd-container.fd-form-layout-grid-container .fd-row .fd-col-xl--2>.fd-form-label{float:right;padding-bottom:0;text-align:right;width:100%}.fd-container.fd-form-layout-grid-container .fd-row .fd-col-xl--2>.fd-form-label[dir=rtl],[dir=rtl] .fd-container.fd-form-layout-grid-container .fd-row .fd-col-xl--2>.fd-form-label{float:left;text-align:left}.fd-container.fd-form-layout-grid-container .fd-row .fd-col-xl--3>.fd-form-label{float:right;padding-bottom:0;text-align:right;width:100%}.fd-container.fd-form-layout-grid-container .fd-row .fd-col-xl--3>.fd-form-label[dir=rtl],[dir=rtl] .fd-container.fd-form-layout-grid-container .fd-row .fd-col-xl--3>.fd-form-label{float:left;text-align:left}.fd-container.fd-form-layout-grid-container .fd-row .fd-col-xl--4>.fd-form-label{float:right;padding-bottom:0;text-align:right;width:100%}.fd-container.fd-form-layout-grid-container .fd-row .fd-col-xl--4>.fd-form-label[dir=rtl],[dir=rtl] .fd-container.fd-form-layout-grid-container .fd-row .fd-col-xl--4>.fd-form-label{float:left;text-align:left}.fd-container.fd-form-layout-grid-container .fd-row .fd-col-xl--5>.fd-form-label{float:right;padding-bottom:0;text-align:right;width:100%}.fd-container.fd-form-layout-grid-container .fd-row .fd-col-xl--5>.fd-form-label[dir=rtl],[dir=rtl] .fd-container.fd-form-layout-grid-container .fd-row .fd-col-xl--5>.fd-form-label{float:left;text-align:left}.fd-container.fd-form-layout-grid-container .fd-row .fd-col-xl--6>.fd-form-label{float:right;padding-bottom:0;text-align:right;width:100%}.fd-container.fd-form-layout-grid-container .fd-row .fd-col-xl--6>.fd-form-label[dir=rtl],[dir=rtl] .fd-container.fd-form-layout-grid-container .fd-row .fd-col-xl--6>.fd-form-label{float:left;text-align:left}.fd-container.fd-form-layout-grid-container .fd-row .fd-col-xl--7>.fd-form-label{float:right;padding-bottom:0;text-align:right;width:100%}.fd-container.fd-form-layout-grid-container .fd-row .fd-col-xl--7>.fd-form-label[dir=rtl],[dir=rtl] .fd-container.fd-form-layout-grid-container .fd-row .fd-col-xl--7>.fd-form-label{float:left;text-align:left}.fd-container.fd-form-layout-grid-container .fd-row .fd-col-xl--8>.fd-form-label{float:right;padding-bottom:0;text-align:right;width:100%}.fd-container.fd-form-layout-grid-container .fd-row .fd-col-xl--8>.fd-form-label[dir=rtl],[dir=rtl] .fd-container.fd-form-layout-grid-container .fd-row .fd-col-xl--8>.fd-form-label{float:left;text-align:left}.fd-container.fd-form-layout-grid-container .fd-row .fd-col-xl--9>.fd-form-label{float:right;padding-bottom:0;text-align:right;width:100%}.fd-container.fd-form-layout-grid-container .fd-row .fd-col-xl--9>.fd-form-label[dir=rtl],[dir=rtl] .fd-container.fd-form-layout-grid-container .fd-row .fd-col-xl--9>.fd-form-label{float:left;text-align:left}.fd-container.fd-form-layout-grid-container .fd-row .fd-col-xl--10>.fd-form-label{float:right;padding-bottom:0;text-align:right;width:100%}.fd-container.fd-form-layout-grid-container .fd-row .fd-col-xl--10>.fd-form-label[dir=rtl],[dir=rtl] .fd-container.fd-form-layout-grid-container .fd-row .fd-col-xl--10>.fd-form-label{float:left;text-align:left}.fd-container.fd-form-layout-grid-container .fd-row .fd-col-xl--11>.fd-form-label{float:right;padding-bottom:0;text-align:right;width:100%}.fd-container.fd-form-layout-grid-container .fd-row .fd-col-xl--11>.fd-form-label[dir=rtl],[dir=rtl] .fd-container.fd-form-layout-grid-container .fd-row .fd-col-xl--11>.fd-form-label{float:left;text-align:left}.fd-container.fd-form-layout-grid-container .fd-row .fd-col-xl--12>.fd-form-label,.fd-container.fd-form-layout-grid-container .fd-row .fd-col-xl>.fd-form-label{float:left;padding-bottom:.125rem;text-align:left;width:auto}.fd-container.fd-form-layout-grid-container .fd-row .fd-col-xl--12>.fd-form-label[dir=rtl],.fd-container.fd-form-layout-grid-container .fd-row .fd-col-xl>.fd-form-label[dir=rtl],[dir=rtl] .fd-container.fd-form-layout-grid-container .fd-row .fd-col-xl--12>.fd-form-label,[dir=rtl] .fd-container.fd-form-layout-grid-container .fd-row .fd-col-xl>.fd-form-label{float:right;text-align:right}}.fd-section{-webkit-box-sizing:border-box;background-color:var(--sapToolbar_Background);border:0;border-bottom:none;box-sizing:border-box;color:var(--sapTextColor);font-family:var(--sapFontFamily);font-size:var(--sapFontSize);font-weight:400;forced-color-adjust:none;line-height:var(--sapContent_LineHeight);margin:0;padding:1rem .5rem 1.5rem}.fd-section:after,.fd-section:before{box-sizing:inherit;font-size:inherit}.fd-section:after{clear:both;content:\"\";display:table}@media (min-width: 600px){.fd-section{padding-left:2rem;padding-right:2rem}}@media (min-width: 1440px){.fd-section{padding-left:3rem;padding-right:3rem}}.fd-section--no-border,.fd-section:last-child{border-bottom:0}.fd-section--bleed,.fd-section--full-bleed{-webkit-box-sizing:border-box;border:0;box-sizing:border-box;color:var(--sapTextColor);font-family:var(--sapFontFamily);font-size:var(--sapFontSize);font-weight:400;forced-color-adjust:none;line-height:var(--sapContent_LineHeight);margin:0;padding:0}.fd-section--bleed:after,.fd-section--bleed:before,.fd-section--full-bleed:after,.fd-section--full-bleed:before{box-sizing:inherit;font-size:inherit}.fd-section--bleed .fd-section__footer,.fd-section--bleed .fd-section__header,.fd-section--full-bleed .fd-section__footer,.fd-section--full-bleed .fd-section__header{padding-left:.5rem;padding-right:.5rem}@media (min-width: 600px){.fd-section--bleed .fd-section__footer,.fd-section--bleed .fd-section__header,.fd-section--full-bleed .fd-section__footer,.fd-section--full-bleed .fd-section__header{padding-left:2rem;padding-right:2rem}}@media (min-width: 1440px){.fd-section--bleed .fd-section__footer,.fd-section--bleed .fd-section__header,.fd-section--full-bleed .fd-section__footer,.fd-section--full-bleed .fd-section__header{padding-left:3rem;padding-right:3rem}}.fd-section__header{-webkit-box-sizing:border-box;align-items:center;border:0;box-sizing:border-box;color:var(--sapTextColor);display:flex;font-family:var(--sapFontFamily);font-size:var(--sapFontSize);font-weight:400;forced-color-adjust:none;line-height:var(--sapContent_LineHeight);margin:0 0 1.5rem;min-height:1.5rem;padding:0}.fd-section__header:after,.fd-section__header:before{box-sizing:inherit;font-size:inherit}.fd-section__title{-webkit-box-sizing:border-box;-webkit-box-flex:1;-ms-flex:1;border:0;box-sizing:border-box;color:var(--sapTextColor);color:var(--sapTitleColor);flex:1;font-family:var(--sapFontFamily);font-size:var(--sapFontSize);font-size:var(--sapFontHeader2Size);font-weight:400;forced-color-adjust:none;line-height:var(--sapContent_LineHeight);line-height:2rem;margin:0;padding:0}.fd-section__title:after,.fd-section__title:before{box-sizing:inherit;font-size:inherit}.fd-section__actions{-webkit-box-sizing:border-box;border:0;box-sizing:border-box;color:var(--sapTextColor);font-family:var(--sapFontFamily);font-size:var(--sapFontSize);font-weight:400;forced-color-adjust:none;line-height:var(--sapContent_LineHeight);margin:0 0 0 auto;padding:0}.fd-section__actions:after,.fd-section__actions:before{box-sizing:inherit;font-size:inherit}.fd-section__footer{-webkit-box-sizing:border-box;-webkit-box-pack:center;-ms-flex-pack:center;border:0;box-sizing:border-box;color:var(--sapTextColor);display:flex;font-family:var(--sapFontFamily);font-size:var(--sapFontSize);font-weight:400;forced-color-adjust:none;justify-content:center;line-height:var(--sapContent_LineHeight);margin:0;padding:0}.fd-section__footer:after,.fd-section__footer:before{box-sizing:inherit;font-size:inherit}.fd-form-group{-webkit-box-sizing:border-box;border:0;box-sizing:border-box;color:var(--sapTextColor);font-family:var(--sapFontFamily);font-size:var(--sapFontSize);font-weight:400;forced-color-adjust:none;line-height:var(--sapContent_LineHeight);margin:0;padding:0}.fd-form-group:after,.fd-form-group:before{box-sizing:inherit;font-size:inherit}.fd-form-group--inline{-webkit-box-pack:start;-ms-flex-pack:start;-ms-flex-wrap:wrap;flex-direction:row;flex-wrap:wrap;justify-content:flex-start}.fd-form-group--inline,.fd-form-group__header{display:flex}.fd-form-group__header{-webkit-box-sizing:border-box;align-items:center;background-color:var(--sapGroup_TitleBackground);border:0;box-sizing:border-box;color:var(--sapTextColor);font-family:var(--sapFontFamily);font-size:var(--sapFontSize);font-weight:400;forced-color-adjust:none;height:2.75rem;line-height:var(--sapContent_LineHeight);margin:0;padding:0;width:100%}.fd-form-group__header:after,.fd-form-group__header:before{box-sizing:inherit;font-size:inherit}.fd-form-group__header[class*=-compact],.fd-form-group__header[class*=-condensed],[class*=-compact] .fd-form-group__header:not([class*=-cozy]),[class*=-condensed] .fd-form-group__header:not([class*=-cozy]){height:2rem}.fd-form-group__header-text{-webkit-box-sizing:border-box;border:0;box-sizing:border-box;color:var(--sapTextColor);color:var(--sapGroup_TitleTextColor);font-family:var(--sapFontFamily);font-family:var(--sapFontHeaderFamily);font-size:var(--sapFontSize);font-size:var(--sapFontHeader6Size);font-weight:400;font-weight:700;forced-color-adjust:none;line-height:var(--sapContent_LineHeight);margin:0;overflow:hidden;padding:0;text-overflow:ellipsis;white-space:nowrap}.fd-form-group__header-text:after,.fd-form-group__header-text:before{box-sizing:inherit;font-size:inherit}/*!\n * Fundamental Library Styles v0.30.2-rc.6\n * Copyright (c) 2023 SAP SE or an SAP affiliate company.\n * Licensed under Apache License 2.0 (https://github.com/SAP/fundamental-styles/blob/main/LICENSE)\n */.fd-form-header{-webkit-box-sizing:border-box;-webkit-box-align:center;-ms-flex-align:center;-webkit-box-shadow:0 var(--fdFormHeader_Border_Width) 0 var(--sapGroup_TitleBorderColor);align-items:center;background-color:var(--sapGroup_TitleBackground);border:0;box-shadow:0 var(--fdFormHeader_Border_Width) 0 var(--sapGroup_TitleBorderColor);box-sizing:border-box;color:var(--sapTextColor);display:flex;font-family:var(--sapFontFamily);font-size:var(--sapFontSize);font-weight:400;forced-color-adjust:none;height:2.75rem;line-height:var(--sapContent_LineHeight);margin:0;padding:0 1rem;width:100%}.fd-form-header:after,.fd-form-header:before{box-sizing:inherit;font-size:inherit}.fd-form-header__text{-webkit-box-sizing:border-box;border:0;box-sizing:border-box;color:var(--sapTextColor);color:var(--sapGroup_TitleTextColor);font-family:var(--sapFontFamily);font-family:var(--sapFontHeaderFamily);font-size:var(--sapFontSize);font-size:var(--sapFontHeader4Size);font-weight:400;forced-color-adjust:none;line-height:var(--sapContent_LineHeight);margin:0;overflow:hidden;padding:0;text-overflow:ellipsis;white-space:nowrap}.fd-form-header__text:after,.fd-form-header__text:before{box-sizing:inherit;font-size:inherit}fdp-form-group{display:block}.fd-form-label{overflow:hidden}\n"], dependencies: [{ kind: "directive", type: NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1$1.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i1$1.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i1$1.NgForm, selector: "form:not([ngNoForm]):not([formGroup]),ng-form,[ngForm]", inputs: ["ngFormOptions"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: NgFor, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "component", type: FormGroupHeaderComponent, selector: "[fdp-form-group-header]", inputs: ["fieldGroup"] }, { kind: "component", type: LinkComponent, selector: "[fdLink], [fd-link]", inputs: ["class", "emphasized", "disabled", "inverted", "subtle", "undecorated"] }, { kind: "ngmodule", type: IconModule }, { kind: "component", type: i4.IconComponent, selector: "fd-icon", inputs: ["glyph", "font", "class", "ariaLabel"] }, { kind: "ngmodule", type: InlineHelpModule }, { kind: "directive", type: i5.InlineHelpDirective, selector: "[fd-inline-help]:not([fd-inline-help-template]), [fd-inline-help-template]:not([fd-inline-help])", inputs: ["triggers", "noArrow", "closeOnEscapeKey", "closeOnOutsideClick", "fd-inline-help"] }, { kind: "pipe", type: AsyncPipe, name: "async" }, { kind: "pipe", type: KeyValuePipe, name: "keyvalue" }, { kind: "pipe", type: FieldGroupRowValuePipe, name: "fieldGroupRowValue" }, { kind: "ngmodule", type: ContentDensityModule }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.1.0", ngImport: i0, type: FormGroupComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'fdp-form-group', changeDetection: ChangeDetectionStrategy.OnPush, encapsulation: ViewEncapsulation.None, providers: [formGroupProvider, FormFieldLayoutService, contentDensityObserverProviders()], template: "<form #nativeForm (ngSubmit)=\"onSubmit.emit($event)\" *ngIf=\"useForm; else body\" [id]=\"id\" [name]=\"name\">\n    <ng-container *ngTemplateOutlet=\"body\"></ng-container>\n</form>\n\n<ng-template #body>\n    <!--  Render fields and field groups with assigned columns -->\n    <ng-container *ngTemplateOutlet=\"fields\"></ng-container>\n</ng-template>\n\n<ng-template #fields>\n    <div *ngIf=\"mainTitle && !hideMainTItle\" class=\"fd-form-header\">\n        <ng-template [ngTemplateOutlet]=\"mainTitleTemplate\"></ng-template>\n    </div>\n\n    <div\n        class=\"fd-container fd-form-layout-grid-container\"\n        [class.is-compact]=\"contentDensityObserver.isCompact$ | async\"\n    >\n        <div *ngFor=\"let column of formRows | keyvalue; trackBy: trackByFn\" class=\"fd-row\">\n            <div\n                *ngFor=\"let fields of column | fieldGroupRowValue | keyvalue; trackBy: trackByFn; let index = index\"\n                class=\"fd-col fd-form-group\"\n                [class]=\"xlCol\"\n            >\n                <div class=\"fd-row\" *ngIf=\"$fieldGroup(column.value) as value\">\n                    <div class=\"fd-col\">\n                        <div *ngIf=\"value.label\" fdp-form-group-header [fieldGroup]=\"index === 0 ? value : null\"></div>\n                    </div>\n                </div>\n\n                <div *ngFor=\"let field of fields.value; trackBy: trackByFieldName\" class=\"fd-row fd-form-item\">\n                    <div class=\"fd-col\" [class]=\"_inlineColumnLayoutClass\" [style.order]=\"field.rank\">\n                        <ng-container *ngTemplateOutlet=\"field?.renderer || null\"></ng-container>\n                    </div>\n                </div>\n            </div>\n        </div>\n    </div>\n</ng-template>\n\n<!-- For nested form-group -->\n<ng-content select=\"fdp-form-group\"></ng-content>\n\n<ng-template #mainTitleTemplate>\n    <ng-container *ngIf=\"_hintOptions?.content && _hintOptions.position === 'before'\">\n        <ng-template [ngTemplateOutlet]=\"hintTemplate\"></ng-template>\n    </ng-container>\n\n    <h5 class=\"fd-form-header__text\">\n        {{ mainTitle }}\n    </h5>\n\n    <ng-container *ngIf=\"_hintOptions?.content && _hintOptions.position === 'after'\">\n        <ng-template [ngTemplateOutlet]=\"hintTemplate\"></ng-template>\n    </ng-container>\n\n    <ng-template #hintTemplate>\n        <span fd-link [undecorated]=\"true\">\n            <fd-icon\n                [fd-inline-help]=\"_hintOptions.content\"\n                [glyph]=\"_hintOptions.glyph\"\n                [placement]=\"_hintOptions.placement || null\"\n                [triggers]=\"_hintOptions.trigger || []\"\n                tabindex=\"0\"\n            ></fd-icon>\n        </span>\n    </ng-template>\n</ng-template>\n", styles: [".fd-col,.fd-container,.fd-row{-webkit-box-sizing:border-box;border:0;box-sizing:border-box;color:var(--sapTextColor);font-family:var(--sapFontFamily);font-size:var(--sapFontSize);font-weight:400;forced-color-adjust:none;line-height:var(--sapContent_LineHeight);margin:0;padding:0}.fd-col:after,.fd-col:before,.fd-container:after,.fd-container:before,.fd-row:after,.fd-row:before{box-sizing:inherit;font-size:inherit}.fd-container{-ms-flex-wrap:wrap;-webkit-box-flex:0;-ms-flex:0 0 100%;display:flex;flex:0 0 100%;flex-wrap:wrap;padding:0 .25rem;position:relative}.fd-container .fd-row{margin-left:-.25rem;margin-right:-.25rem;min-width:calc(100% + .5rem)}.fd-container>.fd-row>.fd-col{padding-bottom:.25rem;padding-top:.25rem}.fd-container.fd-container--no-gap .fd-row,.fd-container.fd-container--no-horizontal-gap .fd-row{margin-left:0;margin-right:0}.fd-container.fd-container--no-gap .fd-row .fd-col,.fd-container.fd-container--no-horizontal-gap .fd-row .fd-col{padding-left:0;padding-right:0}.fd-container.fd-container--no-gap>.fd-row>.fd-col,.fd-container.fd-container--no-vertical-gap>.fd-row>.fd-col{padding-bottom:0;padding-top:0}.fd-container[dir=rtl],[dir=rtl] .fd-container{direction:rtl}.fd-row{-ms-flex-wrap:wrap;-webkit-box-flex:0;-ms-flex:0 0 100%;display:flex;flex:0 0 100%;flex-wrap:wrap;min-width:100%;position:relative}.fd-col{max-width:100%;min-width:100%;padding-left:.25rem;padding-right:.25rem}.fd-col--0{max-width:0;min-width:0%}.fd-col--offset-0{margin-left:0}.fd-col--offset-0[dir=rtl],[dir=rtl] .fd-col--offset-0{margin-left:0;margin-right:0}.fd-col--offset-after-0{margin-right:0}.fd-col--offset-after-0[dir=rtl],[dir=rtl] .fd-col--offset-after-0{margin-left:0;margin-right:0}.fd-col--1{max-width:8.3333333333%;min-width:8.3333333333%}.fd-col--offset-1{margin-left:8.3333333333%}.fd-col--offset-1[dir=rtl],[dir=rtl] .fd-col--offset-1{margin-left:0;margin-right:8.3333333333%}.fd-col--offset-after-1{margin-right:8.3333333333%}.fd-col--offset-after-1[dir=rtl],[dir=rtl] .fd-col--offset-after-1{margin-left:8.3333333333%;margin-right:0}.fd-col--2{max-width:16.6666666667%;min-width:16.6666666667%}.fd-col--offset-2{margin-left:16.6666666667%}.fd-col--offset-2[dir=rtl],[dir=rtl] .fd-col--offset-2{margin-left:0;margin-right:16.6666666667%}.fd-col--offset-after-2{margin-right:16.6666666667%}.fd-col--offset-after-2[dir=rtl],[dir=rtl] .fd-col--offset-after-2{margin-left:16.6666666667%;margin-right:0}.fd-col--3{max-width:25%;min-width:25%}.fd-col--offset-3{margin-left:25%}.fd-col--offset-3[dir=rtl],[dir=rtl] .fd-col--offset-3{margin-left:0;margin-right:25%}.fd-col--offset-after-3{margin-right:25%}.fd-col--offset-after-3[dir=rtl],[dir=rtl] .fd-col--offset-after-3{margin-left:25%;margin-right:0}.fd-col--4{max-width:33.3333333333%;min-width:33.3333333333%}.fd-col--offset-4{margin-left:33.3333333333%}.fd-col--offset-4[dir=rtl],[dir=rtl] .fd-col--offset-4{margin-left:0;margin-right:33.3333333333%}.fd-col--offset-after-4{margin-right:33.3333333333%}.fd-col--offset-after-4[dir=rtl],[dir=rtl] .fd-col--offset-after-4{margin-left:33.3333333333%;margin-right:0}.fd-col--5{max-width:41.6666666667%;min-width:41.6666666667%}.fd-col--offset-5{margin-left:41.6666666667%}.fd-col--offset-5[dir=rtl],[dir=rtl] .fd-col--offset-5{margin-left:0;margin-right:41.6666666667%}.fd-col--offset-after-5{margin-right:41.6666666667%}.fd-col--offset-after-5[dir=rtl],[dir=rtl] .fd-col--offset-after-5{margin-left:41.6666666667%;margin-right:0}.fd-col--6{max-width:50%;min-width:50%}.fd-col--offset-6{margin-left:50%}.fd-col--offset-6[dir=rtl],[dir=rtl] .fd-col--offset-6{margin-left:0;margin-right:50%}.fd-col--offset-after-6{margin-right:50%}.fd-col--offset-after-6[dir=rtl],[dir=rtl] .fd-col--offset-after-6{margin-left:50%;margin-right:0}.fd-col--7{max-width:58.3333333333%;min-width:58.3333333333%}.fd-col--offset-7{margin-left:58.3333333333%}.fd-col--offset-7[dir=rtl],[dir=rtl] .fd-col--offset-7{margin-left:0;margin-right:58.3333333333%}.fd-col--offset-after-7{margin-right:58.3333333333%}.fd-col--offset-after-7[dir=rtl],[dir=rtl] .fd-col--offset-after-7{margin-left:58.3333333333%;margin-right:0}.fd-col--8{max-width:66.6666666667%;min-width:66.6666666667%}.fd-col--offset-8{margin-left:66.6666666667%}.fd-col--offset-8[dir=rtl],[dir=rtl] .fd-col--offset-8{margin-left:0;margin-right:66.6666666667%}.fd-col--offset-after-8{margin-right:66.6666666667%}.fd-col--offset-after-8[dir=rtl],[dir=rtl] .fd-col--offset-after-8{margin-left:66.6666666667%;margin-right:0}.fd-col--9{max-width:75%;min-width:75%}.fd-col--offset-9{margin-left:75%}.fd-col--offset-9[dir=rtl],[dir=rtl] .fd-col--offset-9{margin-left:0;margin-right:75%}.fd-col--offset-after-9{margin-right:75%}.fd-col--offset-after-9[dir=rtl],[dir=rtl] .fd-col--offset-after-9{margin-left:75%;margin-right:0}.fd-col--10{max-width:83.3333333333%;min-width:83.3333333333%}.fd-col--offset-10{margin-left:83.3333333333%}.fd-col--offset-10[dir=rtl],[dir=rtl] .fd-col--offset-10{margin-left:0;margin-right:83.3333333333%}.fd-col--offset-after-10{margin-right:83.3333333333%}.fd-col--offset-after-10[dir=rtl],[dir=rtl] .fd-col--offset-after-10{margin-left:83.3333333333%;margin-right:0}.fd-col--11{max-width:91.6666666667%;min-width:91.6666666667%}.fd-col--offset-11{margin-left:91.6666666667%}.fd-col--offset-11[dir=rtl],[dir=rtl] .fd-col--offset-11{margin-left:0;margin-right:91.6666666667%}.fd-col--offset-after-11{margin-right:91.6666666667%}.fd-col--offset-after-11[dir=rtl],[dir=rtl] .fd-col--offset-after-11{margin-left:91.6666666667%;margin-right:0}.fd-col--12{max-width:100%;min-width:100%}.fd-col--offset-12{margin-left:100%}.fd-col--offset-12[dir=rtl],[dir=rtl] .fd-col--offset-12{margin-left:0;margin-right:100%}.fd-col--offset-after-12{margin-right:100%}.fd-col--offset-after-12[dir=rtl],[dir=rtl] .fd-col--offset-after-12{margin-left:100%;margin-right:0}.fd-col--full{flex:1;max-width:none;min-width:8.3333333333%}.fd-col--wrap{flex-wrap:wrap}@media (min-width: 600px){.fd-container{padding:0 .5rem}.fd-container .fd-row{margin-left:-.5rem;margin-right:-.5rem;min-width:calc(100% + 1rem)}.fd-container>.fd-row>.fd-col{padding-bottom:.5rem;padding-top:.5rem}.fd-col{padding-left:.5rem;padding-right:.5rem}.fd-col-md--0{max-width:0;min-width:0%}.fd-col-md--offset-0{margin-left:0}.fd-col-md--offset-0[dir=rtl],[dir=rtl] .fd-col-md--offset-0{margin-left:0;margin-right:0}.fd-col-md--offset-after-0{margin-right:0}.fd-col-md--offset-after-0[dir=rtl],[dir=rtl] .fd-col-md--offset-after-0{margin-left:0;margin-right:0}.fd-col-md--1{max-width:8.3333333333%;min-width:8.3333333333%}.fd-col-md--offset-1{margin-left:8.3333333333%}.fd-col-md--offset-1[dir=rtl],[dir=rtl] .fd-col-md--offset-1{margin-left:0;margin-right:8.3333333333%}.fd-col-md--offset-after-1{margin-right:8.3333333333%}.fd-col-md--offset-after-1[dir=rtl],[dir=rtl] .fd-col-md--offset-after-1{margin-left:8.3333333333%;margin-right:0}.fd-col-md--2{max-width:16.6666666667%;min-width:16.6666666667%}.fd-col-md--offset-2{margin-left:16.6666666667%}.fd-col-md--offset-2[dir=rtl],[dir=rtl] .fd-col-md--offset-2{margin-left:0;margin-right:16.6666666667%}.fd-col-md--offset-after-2{margin-right:16.6666666667%}.fd-col-md--offset-after-2[dir=rtl],[dir=rtl] .fd-col-md--offset-after-2{margin-left:16.6666666667%;margin-right:0}.fd-col-md--3{max-width:25%;min-width:25%}.fd-col-md--offset-3{margin-left:25%}.fd-col-md--offset-3[dir=rtl],[dir=rtl] .fd-col-md--offset-3{margin-left:0;margin-right:25%}.fd-col-md--offset-after-3{margin-right:25%}.fd-col-md--offset-after-3[dir=rtl],[dir=rtl] .fd-col-md--offset-after-3{margin-left:25%;margin-right:0}.fd-col-md--4{max-width:33.3333333333%;min-width:33.3333333333%}.fd-col-md--offset-4{margin-left:33.3333333333%}.fd-col-md--offset-4[dir=rtl],[dir=rtl] .fd-col-md--offset-4{margin-left:0;margin-right:33.3333333333%}.fd-col-md--offset-after-4{margin-right:33.3333333333%}.fd-col-md--offset-after-4[dir=rtl],[dir=rtl] .fd-col-md--offset-after-4{margin-left:33.3333333333%;margin-right:0}.fd-col-md--5{max-width:41.6666666667%;min-width:41.6666666667%}.fd-col-md--offset-5{margin-left:41.6666666667%}.fd-col-md--offset-5[dir=rtl],[dir=rtl] .fd-col-md--offset-5{margin-left:0;margin-right:41.6666666667%}.fd-col-md--offset-after-5{margin-right:41.6666666667%}.fd-col-md--offset-after-5[dir=rtl],[dir=rtl] .fd-col-md--offset-after-5{margin-left:41.6666666667%;margin-right:0}.fd-col-md--6{max-width:50%;min-width:50%}.fd-col-md--offset-6{margin-left:50%}.fd-col-md--offset-6[dir=rtl],[dir=rtl] .fd-col-md--offset-6{margin-left:0;margin-right:50%}.fd-col-md--offset-after-6{margin-right:50%}.fd-col-md--offset-after-6[dir=rtl],[dir=rtl] .fd-col-md--offset-after-6{margin-left:50%;margin-right:0}.fd-col-md--7{max-width:58.3333333333%;min-width:58.3333333333%}.fd-col-md--offset-7{margin-left:58.3333333333%}.fd-col-md--offset-7[dir=rtl],[dir=rtl] .fd-col-md--offset-7{margin-left:0;margin-right:58.3333333333%}.fd-col-md--offset-after-7{margin-right:58.3333333333%}.fd-col-md--offset-after-7[dir=rtl],[dir=rtl] .fd-col-md--offset-after-7{margin-left:58.3333333333%;margin-right:0}.fd-col-md--8{max-width:66.6666666667%;min-width:66.6666666667%}.fd-col-md--offset-8{margin-left:66.6666666667%}.fd-col-md--offset-8[dir=rtl],[dir=rtl] .fd-col-md--offset-8{margin-left:0;margin-right:66.6666666667%}.fd-col-md--offset-after-8{margin-right:66.6666666667%}.fd-col-md--offset-after-8[dir=rtl],[dir=rtl] .fd-col-md--offset-after-8{margin-left:66.6666666667%;margin-right:0}.fd-col-md--9{max-width:75%;min-width:75%}.fd-col-md--offset-9{margin-left:75%}.fd-col-md--offset-9[dir=rtl],[dir=rtl] .fd-col-md--offset-9{margin-left:0;margin-right:75%}.fd-col-md--offset-after-9{margin-right:75%}.fd-col-md--offset-after-9[dir=rtl],[dir=rtl] .fd-col-md--offset-after-9{margin-left:75%;margin-right:0}.fd-col-md--10{max-width:83.3333333333%;min-width:83.3333333333%}.fd-col-md--offset-10{margin-left:83.3333333333%}.fd-col-md--offset-10[dir=rtl],[dir=rtl] .fd-col-md--offset-10{margin-left:0;margin-right:83.3333333333%}.fd-col-md--offset-after-10{margin-right:83.3333333333%}.fd-col-md--offset-after-10[dir=rtl],[dir=rtl] .fd-col-md--offset-after-10{margin-left:83.3333333333%;margin-right:0}.fd-col-md--11{max-width:91.6666666667%;min-width:91.6666666667%}.fd-col-md--offset-11{margin-left:91.6666666667%}.fd-col-md--offset-11[dir=rtl],[dir=rtl] .fd-col-md--offset-11{margin-left:0;margin-right:91.6666666667%}.fd-col-md--offset-after-11{margin-right:91.6666666667%}.fd-col-md--offset-after-11[dir=rtl],[dir=rtl] .fd-col-md--offset-after-11{margin-left:91.6666666667%;margin-right:0}.fd-col-md--12{max-width:100%;min-width:100%}.fd-col-md--offset-12{margin-left:100%}.fd-col-md--offset-12[dir=rtl],[dir=rtl] .fd-col-md--offset-12{margin-left:0;margin-right:100%}.fd-col-md--offset-after-12{margin-right:100%}.fd-col-md--offset-after-12[dir=rtl],[dir=rtl] .fd-col-md--offset-after-12{margin-left:100%;margin-right:0}}@media (min-width: 1024px){.fd-col-lg--0{max-width:0;min-width:0%}.fd-col-lg--offset-0{margin-left:0}.fd-col-lg--offset-0[dir=rtl],[dir=rtl] .fd-col-lg--offset-0{margin-left:0;margin-right:0}.fd-col-lg--offset-after-0{margin-right:0}.fd-col-lg--offset-after-0[dir=rtl],[dir=rtl] .fd-col-lg--offset-after-0{margin-left:0;margin-right:0}.fd-col-lg--1{max-width:8.3333333333%;min-width:8.3333333333%}.fd-col-lg--offset-1{margin-left:8.3333333333%}.fd-col-lg--offset-1[dir=rtl],[dir=rtl] .fd-col-lg--offset-1{margin-left:0;margin-right:8.3333333333%}.fd-col-lg--offset-after-1{margin-right:8.3333333333%}.fd-col-lg--offset-after-1[dir=rtl],[dir=rtl] .fd-col-lg--offset-after-1{margin-left:8.3333333333%;margin-right:0}.fd-col-lg--2{max-width:16.6666666667%;min-width:16.6666666667%}.fd-col-lg--offset-2{margin-left:16.6666666667%}.fd-col-lg--offset-2[dir=rtl],[dir=rtl] .fd-col-lg--offset-2{margin-left:0;margin-right:16.6666666667%}.fd-col-lg--offset-after-2{margin-right:16.6666666667%}.fd-col-lg--offset-after-2[dir=rtl],[dir=rtl] .fd-col-lg--offset-after-2{margin-left:16.6666666667%;margin-right:0}.fd-col-lg--3{max-width:25%;min-width:25%}.fd-col-lg--offset-3{margin-left:25%}.fd-col-lg--offset-3[dir=rtl],[dir=rtl] .fd-col-lg--offset-3{margin-left:0;margin-right:25%}.fd-col-lg--offset-after-3{margin-right:25%}.fd-col-lg--offset-after-3[dir=rtl],[dir=rtl] .fd-col-lg--offset-after-3{margin-left:25%;margin-right:0}.fd-col-lg--4{max-width:33.3333333333%;min-width:33.3333333333%}.fd-col-lg--offset-4{margin-left:33.3333333333%}.fd-col-lg--offset-4[dir=rtl],[dir=rtl] .fd-col-lg--offset-4{margin-left:0;margin-right:33.3333333333%}.fd-col-lg--offset-after-4{margin-right:33.3333333333%}.fd-col-lg--offset-after-4[dir=rtl],[dir=rtl] .fd-col-lg--offset-after-4{margin-left:33.3333333333%;margin-right:0}.fd-col-lg--5{max-width:41.6666666667%;min-width:41.6666666667%}.fd-col-lg--offset-5{margin-left:41.6666666667%}.fd-col-lg--offset-5[dir=rtl],[dir=rtl] .fd-col-lg--offset-5{margin-left:0;margin-right:41.6666666667%}.fd-col-lg--offset-after-5{margin-right:41.6666666667%}.fd-col-lg--offset-after-5[dir=rtl],[dir=rtl] .fd-col-lg--offset-after-5{margin-left:41.6666666667%;margin-right:0}.fd-col-lg--6{max-width:50%;min-width:50%}.fd-col-lg--offset-6{margin-left:50%}.fd-col-lg--offset-6[dir=rtl],[dir=rtl] .fd-col-lg--offset-6{margin-left:0;margin-right:50%}.fd-col-lg--offset-after-6{margin-right:50%}.fd-col-lg--offset-after-6[dir=rtl],[dir=rtl] .fd-col-lg--offset-after-6{margin-left:50%;margin-right:0}.fd-col-lg--7{max-width:58.3333333333%;min-width:58.3333333333%}.fd-col-lg--offset-7{margin-left:58.3333333333%}.fd-col-lg--offset-7[dir=rtl],[dir=rtl] .fd-col-lg--offset-7{margin-left:0;margin-right:58.3333333333%}.fd-col-lg--offset-after-7{margin-right:58.3333333333%}.fd-col-lg--offset-after-7[dir=rtl],[dir=rtl] .fd-col-lg--offset-after-7{margin-left:58.3333333333%;margin-right:0}.fd-col-lg--8{max-width:66.6666666667%;min-width:66.6666666667%}.fd-col-lg--offset-8{margin-left:66.6666666667%}.fd-col-lg--offset-8[dir=rtl],[dir=rtl] .fd-col-lg--offset-8{margin-left:0;margin-right:66.6666666667%}.fd-col-lg--offset-after-8{margin-right:66.6666666667%}.fd-col-lg--offset-after-8[dir=rtl],[dir=rtl] .fd-col-lg--offset-after-8{margin-left:66.6666666667%;margin-right:0}.fd-col-lg--9{max-width:75%;min-width:75%}.fd-col-lg--offset-9{margin-left:75%}.fd-col-lg--offset-9[dir=rtl],[dir=rtl] .fd-col-lg--offset-9{margin-left:0;margin-right:75%}.fd-col-lg--offset-after-9{margin-right:75%}.fd-col-lg--offset-after-9[dir=rtl],[dir=rtl] .fd-col-lg--offset-after-9{margin-left:75%;margin-right:0}.fd-col-lg--10{max-width:83.3333333333%;min-width:83.3333333333%}.fd-col-lg--offset-10{margin-left:83.3333333333%}.fd-col-lg--offset-10[dir=rtl],[dir=rtl] .fd-col-lg--offset-10{margin-left:0;margin-right:83.3333333333%}.fd-col-lg--offset-after-10{margin-right:83.3333333333%}.fd-col-lg--offset-after-10[dir=rtl],[dir=rtl] .fd-col-lg--offset-after-10{margin-left:83.3333333333%;margin-right:0}.fd-col-lg--11{max-width:91.6666666667%;min-width:91.6666666667%}.fd-col-lg--offset-11{margin-left:91.6666666667%}.fd-col-lg--offset-11[dir=rtl],[dir=rtl] .fd-col-lg--offset-11{margin-left:0;margin-right:91.6666666667%}.fd-col-lg--offset-after-11{margin-right:91.6666666667%}.fd-col-lg--offset-after-11[dir=rtl],[dir=rtl] .fd-col-lg--offset-after-11{margin-left:91.6666666667%;margin-right:0}.fd-col-lg--12{max-width:100%;min-width:100%}.fd-col-lg--offset-12{margin-left:100%}.fd-col-lg--offset-12[dir=rtl],[dir=rtl] .fd-col-lg--offset-12{margin-left:0;margin-right:100%}.fd-col-lg--offset-after-12{margin-right:100%}.fd-col-lg--offset-after-12[dir=rtl],[dir=rtl] .fd-col-lg--offset-after-12{margin-left:100%;margin-right:0}}@media (min-width: 1440px){.fd-col-xl--0{max-width:0;min-width:0%}.fd-col-xl--offset-0{margin-left:0}.fd-col-xl--offset-0[dir=rtl],[dir=rtl] .fd-col-xl--offset-0{margin-left:0;margin-right:0}.fd-col-xl--offset-after-0{margin-right:0}.fd-col-xl--offset-after-0[dir=rtl],[dir=rtl] .fd-col-xl--offset-after-0{margin-left:0;margin-right:0}.fd-col-xl--1{max-width:8.3333333333%;min-width:8.3333333333%}.fd-col-xl--offset-1{margin-left:8.3333333333%}.fd-col-xl--offset-1[dir=rtl],[dir=rtl] .fd-col-xl--offset-1{margin-left:0;margin-right:8.3333333333%}.fd-col-xl--offset-after-1{margin-right:8.3333333333%}.fd-col-xl--offset-after-1[dir=rtl],[dir=rtl] .fd-col-xl--offset-after-1{margin-left:8.3333333333%;margin-right:0}.fd-col-xl--2{max-width:16.6666666667%;min-width:16.6666666667%}.fd-col-xl--offset-2{margin-left:16.6666666667%}.fd-col-xl--offset-2[dir=rtl],[dir=rtl] .fd-col-xl--offset-2{margin-left:0;margin-right:16.6666666667%}.fd-col-xl--offset-after-2{margin-right:16.6666666667%}.fd-col-xl--offset-after-2[dir=rtl],[dir=rtl] .fd-col-xl--offset-after-2{margin-left:16.6666666667%;margin-right:0}.fd-col-xl--3{max-width:25%;min-width:25%}.fd-col-xl--offset-3{margin-left:25%}.fd-col-xl--offset-3[dir=rtl],[dir=rtl] .fd-col-xl--offset-3{margin-left:0;margin-right:25%}.fd-col-xl--offset-after-3{margin-right:25%}.fd-col-xl--offset-after-3[dir=rtl],[dir=rtl] .fd-col-xl--offset-after-3{margin-left:25%;margin-right:0}.fd-col-xl--4{max-width:33.3333333333%;min-width:33.3333333333%}.fd-col-xl--offset-4{margin-left:33.3333333333%}.fd-col-xl--offset-4[dir=rtl],[dir=rtl] .fd-col-xl--offset-4{margin-left:0;margin-right:33.3333333333%}.fd-col-xl--offset-after-4{margin-right:33.3333333333%}.fd-col-xl--offset-after-4[dir=rtl],[dir=rtl] .fd-col-xl--offset-after-4{margin-left:33.3333333333%;margin-right:0}.fd-col-xl--5{max-width:41.6666666667%;min-width:41.6666666667%}.fd-col-xl--offset-5{margin-left:41.6666666667%}.fd-col-xl--offset-5[dir=rtl],[dir=rtl] .fd-col-xl--offset-5{margin-left:0;margin-right:41.6666666667%}.fd-col-xl--offset-after-5{margin-right:41.6666666667%}.fd-col-xl--offset-after-5[dir=rtl],[dir=rtl] .fd-col-xl--offset-after-5{margin-left:41.6666666667%;margin-right:0}.fd-col-xl--6{max-width:50%;min-width:50%}.fd-col-xl--offset-6{margin-left:50%}.fd-col-xl--offset-6[dir=rtl],[dir=rtl] .fd-col-xl--offset-6{margin-left:0;margin-right:50%}.fd-col-xl--offset-after-6{margin-right:50%}.fd-col-xl--offset-after-6[dir=rtl],[dir=rtl] .fd-col-xl--offset-after-6{margin-left:50%;margin-right:0}.fd-col-xl--7{max-width:58.3333333333%;min-width:58.3333333333%}.fd-col-xl--offset-7{margin-left:58.3333333333%}.fd-col-xl--offset-7[dir=rtl],[dir=rtl] .fd-col-xl--offset-7{margin-left:0;margin-right:58.3333333333%}.fd-col-xl--offset-after-7{margin-right:58.3333333333%}.fd-col-xl--offset-after-7[dir=rtl],[dir=rtl] .fd-col-xl--offset-after-7{margin-left:58.3333333333%;margin-right:0}.fd-col-xl--8{max-width:66.6666666667%;min-width:66.6666666667%}.fd-col-xl--offset-8{margin-left:66.6666666667%}.fd-col-xl--offset-8[dir=rtl],[dir=rtl] .fd-col-xl--offset-8{margin-left:0;margin-right:66.6666666667%}.fd-col-xl--offset-after-8{margin-right:66.6666666667%}.fd-col-xl--offset-after-8[dir=rtl],[dir=rtl] .fd-col-xl--offset-after-8{margin-left:66.6666666667%;margin-right:0}.fd-col-xl--9{max-width:75%;min-width:75%}.fd-col-xl--offset-9{margin-left:75%}.fd-col-xl--offset-9[dir=rtl],[dir=rtl] .fd-col-xl--offset-9{margin-left:0;margin-right:75%}.fd-col-xl--offset-after-9{margin-right:75%}.fd-col-xl--offset-after-9[dir=rtl],[dir=rtl] .fd-col-xl--offset-after-9{margin-left:75%;margin-right:0}.fd-col-xl--10{max-width:83.3333333333%;min-width:83.3333333333%}.fd-col-xl--offset-10{margin-left:83.3333333333%}.fd-col-xl--offset-10[dir=rtl],[dir=rtl] .fd-col-xl--offset-10{margin-left:0;margin-right:83.3333333333%}.fd-col-xl--offset-after-10{margin-right:83.3333333333%}.fd-col-xl--offset-after-10[dir=rtl],[dir=rtl] .fd-col-xl--offset-after-10{margin-left:83.3333333333%;margin-right:0}.fd-col-xl--11{max-width:91.6666666667%;min-width:91.6666666667%}.fd-col-xl--offset-11{margin-left:91.6666666667%}.fd-col-xl--offset-11[dir=rtl],[dir=rtl] .fd-col-xl--offset-11{margin-left:0;margin-right:91.6666666667%}.fd-col-xl--offset-after-11{margin-right:91.6666666667%}.fd-col-xl--offset-after-11[dir=rtl],[dir=rtl] .fd-col-xl--offset-after-11{margin-left:91.6666666667%;margin-right:0}.fd-col-xl--12{max-width:100%;min-width:100%}.fd-col-xl--offset-12{margin-left:100%}.fd-col-xl--offset-12[dir=rtl],[dir=rtl] .fd-col-xl--offset-12{margin-left:0;margin-right:100%}.fd-col-xl--offset-after-12{margin-right:100%}.fd-col-xl--offset-after-12[dir=rtl],[dir=rtl] .fd-col-xl--offset-after-12{margin-left:100%;margin-right:0}}.fd-container.fd-form-layout-grid-container .fd-form-group,.fd-container.fd-form-layout-grid-container.fd-form-group{padding:1rem!important}.fd-container.fd-form-layout-grid-container .fd-form-group .fd-form-group,.fd-container.fd-form-layout-grid-container.fd-form-group .fd-form-group{padding:0!important}.fd-container.fd-form-layout-grid-container .fd-form-group .fd-form-item .fd-form-label,.fd-container.fd-form-layout-grid-container.fd-form-group .fd-form-item .fd-form-label{margin-right:0;white-space:normal}.fd-container.fd-form-layout-grid-container .fd-form-group .fd-form-item .fd-form-label[dir=rtl],.fd-container.fd-form-layout-grid-container.fd-form-group .fd-form-item .fd-form-label[dir=rtl],[dir=rtl] .fd-container.fd-form-layout-grid-container .fd-form-group .fd-form-item .fd-form-label,[dir=rtl] .fd-container.fd-form-layout-grid-container.fd-form-group .fd-form-item .fd-form-label{margin-left:0;margin-right:0}.fd-container.fd-form-layout-grid-container .fd-form-group .fd-form-item .fd-form-label--required,.fd-container.fd-form-layout-grid-container.fd-form-group .fd-form-item .fd-form-label--required{padding-right:.5rem}.fd-container.fd-form-layout-grid-container .fd-form-group .fd-form-item .fd-form-label--required[dir=rtl],.fd-container.fd-form-layout-grid-container.fd-form-group .fd-form-item .fd-form-label--required[dir=rtl],[dir=rtl] .fd-container.fd-form-layout-grid-container .fd-form-group .fd-form-item .fd-form-label--required,[dir=rtl] .fd-container.fd-form-layout-grid-container.fd-form-group .fd-form-item .fd-form-label--required{padding-left:.5rem;padding-right:0}.fd-container.fd-form-layout-grid-container .fd-row{flex-direction:row}.fd-container.fd-form-layout-grid-container .fd-row .fd-col{overflow:hidden;padding-bottom:0;padding-top:0;text-overflow:ellipsis;white-space:nowrap}.fd-container.fd-form-layout-grid-container .fd-row .fd-col:not(.fd-form-group){align-self:center}@media (min-width: 0){.fd-container.fd-form-layout-grid-container.fd-form-layout-grid-container--vertical .fd-form-group .fd-form-item,.fd-container.fd-form-layout-grid-container.fd-form-layout-grid-container--vertical.fd-form-group .fd-form-item{margin-top:.625rem}.fd-container.fd-form-layout-grid-container.fd-form-layout-grid-container--vertical .fd-form-group .fd-form-item:first-of-type,.fd-container.fd-form-layout-grid-container.fd-form-layout-grid-container--vertical.fd-form-group .fd-form-item:first-of-type{margin-top:0}.fd-container.fd-form-layout-grid-container .fd-row .fd-col--1>.fd-form-label{float:right;padding-bottom:0;text-align:right;width:100%}.fd-container.fd-form-layout-grid-container .fd-row .fd-col--1>.fd-form-label[dir=rtl],[dir=rtl] .fd-container.fd-form-layout-grid-container .fd-row .fd-col--1>.fd-form-label{float:left;text-align:left}.fd-container.fd-form-layout-grid-container .fd-row .fd-col--2>.fd-form-label{float:right;padding-bottom:0;text-align:right;width:100%}.fd-container.fd-form-layout-grid-container .fd-row .fd-col--2>.fd-form-label[dir=rtl],[dir=rtl] .fd-container.fd-form-layout-grid-container .fd-row .fd-col--2>.fd-form-label{float:left;text-align:left}.fd-container.fd-form-layout-grid-container .fd-row .fd-col--3>.fd-form-label{float:right;padding-bottom:0;text-align:right;width:100%}.fd-container.fd-form-layout-grid-container .fd-row .fd-col--3>.fd-form-label[dir=rtl],[dir=rtl] .fd-container.fd-form-layout-grid-container .fd-row .fd-col--3>.fd-form-label{float:left;text-align:left}.fd-container.fd-form-layout-grid-container .fd-row .fd-col--4>.fd-form-label{float:right;padding-bottom:0;text-align:right;width:100%}.fd-container.fd-form-layout-grid-container .fd-row .fd-col--4>.fd-form-label[dir=rtl],[dir=rtl] .fd-container.fd-form-layout-grid-container .fd-row .fd-col--4>.fd-form-label{float:left;text-align:left}.fd-container.fd-form-layout-grid-container .fd-row .fd-col--5>.fd-form-label{float:right;padding-bottom:0;text-align:right;width:100%}.fd-container.fd-form-layout-grid-container .fd-row .fd-col--5>.fd-form-label[dir=rtl],[dir=rtl] .fd-container.fd-form-layout-grid-container .fd-row .fd-col--5>.fd-form-label{float:left;text-align:left}.fd-container.fd-form-layout-grid-container .fd-row .fd-col--6>.fd-form-label{float:right;padding-bottom:0;text-align:right;width:100%}.fd-container.fd-form-layout-grid-container .fd-row .fd-col--6>.fd-form-label[dir=rtl],[dir=rtl] .fd-container.fd-form-layout-grid-container .fd-row .fd-col--6>.fd-form-label{float:left;text-align:left}.fd-container.fd-form-layout-grid-container .fd-row .fd-col--7>.fd-form-label{float:right;padding-bottom:0;text-align:right;width:100%}.fd-container.fd-form-layout-grid-container .fd-row .fd-col--7>.fd-form-label[dir=rtl],[dir=rtl] .fd-container.fd-form-layout-grid-container .fd-row .fd-col--7>.fd-form-label{float:left;text-align:left}.fd-container.fd-form-layout-grid-container .fd-row .fd-col--8>.fd-form-label{float:right;padding-bottom:0;text-align:right;width:100%}.fd-container.fd-form-layout-grid-container .fd-row .fd-col--8>.fd-form-label[dir=rtl],[dir=rtl] .fd-container.fd-form-layout-grid-container .fd-row .fd-col--8>.fd-form-label{float:left;text-align:left}.fd-container.fd-form-layout-grid-container .fd-row .fd-col--9>.fd-form-label{float:right;padding-bottom:0;text-align:right;width:100%}.fd-container.fd-form-layout-grid-container .fd-row .fd-col--9>.fd-form-label[dir=rtl],[dir=rtl] .fd-container.fd-form-layout-grid-container .fd-row .fd-col--9>.fd-form-label{float:left;text-align:left}.fd-container.fd-form-layout-grid-container .fd-row .fd-col--10>.fd-form-label{float:right;padding-bottom:0;text-align:right;width:100%}.fd-container.fd-form-layout-grid-container .fd-row .fd-col--10>.fd-form-label[dir=rtl],[dir=rtl] .fd-container.fd-form-layout-grid-container .fd-row .fd-col--10>.fd-form-label{float:left;text-align:left}.fd-container.fd-form-layout-grid-container .fd-row .fd-col--11>.fd-form-label{float:right;padding-bottom:0;text-align:right;width:100%}.fd-container.fd-form-layout-grid-container .fd-row .fd-col--11>.fd-form-label[dir=rtl],[dir=rtl] .fd-container.fd-form-layout-grid-container .fd-row .fd-col--11>.fd-form-label{float:left;text-align:left}.fd-container.fd-form-layout-grid-container .fd-row .fd-col--12>.fd-form-label,.fd-container.fd-form-layout-grid-container .fd-row .fd-col>.fd-form-label{float:left;padding-bottom:.125rem;text-align:left;width:auto}.fd-container.fd-form-layout-grid-container .fd-row .fd-col--12>.fd-form-label[dir=rtl],.fd-container.fd-form-layout-grid-container .fd-row .fd-col>.fd-form-label[dir=rtl],[dir=rtl] .fd-container.fd-form-layout-grid-container .fd-row .fd-col--12>.fd-form-label,[dir=rtl] .fd-container.fd-form-layout-grid-container .fd-row .fd-col>.fd-form-label{float:right;text-align:right}}@media (min-width: 0) and (max-width: 599px){.fd-container.fd-form-layout-grid-container.fd-form-layout-grid-container .fd-form-group .fd-form-item,.fd-container.fd-form-layout-grid-container.fd-form-layout-grid-container.fd-form-group .fd-form-item{margin-top:.625rem}.fd-container.fd-form-layout-grid-container.fd-form-layout-grid-container .fd-form-group .fd-form-item:first-of-type,.fd-container.fd-form-layout-grid-container.fd-form-layout-grid-container.fd-form-group .fd-form-item:first-of-type{margin-top:0}}@media (min-width: 600px){.fd-container.fd-form-layout-grid-container{padding:0 .25rem}.fd-container.fd-form-layout-grid-container .fd-row{margin:0 -.25rem;min-width:calc(100% + .5rem)}.fd-container.fd-form-layout-grid-container .fd-row .fd-col{padding:0 .25rem}.fd-container.fd-form-layout-grid-container .fd-row .fd-col-md--1>.fd-form-label{float:right;padding-bottom:0;text-align:right;width:100%}.fd-container.fd-form-layout-grid-container .fd-row .fd-col-md--1>.fd-form-label[dir=rtl],[dir=rtl] .fd-container.fd-form-layout-grid-container .fd-row .fd-col-md--1>.fd-form-label{float:left;text-align:left}.fd-container.fd-form-layout-grid-container .fd-row .fd-col-md--2>.fd-form-label{float:right;padding-bottom:0;text-align:right;width:100%}.fd-container.fd-form-layout-grid-container .fd-row .fd-col-md--2>.fd-form-label[dir=rtl],[dir=rtl] .fd-container.fd-form-layout-grid-container .fd-row .fd-col-md--2>.fd-form-label{float:left;text-align:left}.fd-container.fd-form-layout-grid-container .fd-row .fd-col-md--3>.fd-form-label{float:right;padding-bottom:0;text-align:right;width:100%}.fd-container.fd-form-layout-grid-container .fd-row .fd-col-md--3>.fd-form-label[dir=rtl],[dir=rtl] .fd-container.fd-form-layout-grid-container .fd-row .fd-col-md--3>.fd-form-label{float:left;text-align:left}.fd-container.fd-form-layout-grid-container .fd-row .fd-col-md--4>.fd-form-label{float:right;padding-bottom:0;text-align:right;width:100%}.fd-container.fd-form-layout-grid-container .fd-row .fd-col-md--4>.fd-form-label[dir=rtl],[dir=rtl] .fd-container.fd-form-layout-grid-container .fd-row .fd-col-md--4>.fd-form-label{float:left;text-align:left}.fd-container.fd-form-layout-grid-container .fd-row .fd-col-md--5>.fd-form-label{float:right;padding-bottom:0;text-align:right;width:100%}.fd-container.fd-form-layout-grid-container .fd-row .fd-col-md--5>.fd-form-label[dir=rtl],[dir=rtl] .fd-container.fd-form-layout-grid-container .fd-row .fd-col-md--5>.fd-form-label{float:left;text-align:left}.fd-container.fd-form-layout-grid-container .fd-row .fd-col-md--6>.fd-form-label{float:right;padding-bottom:0;text-align:right;width:100%}.fd-container.fd-form-layout-grid-container .fd-row .fd-col-md--6>.fd-form-label[dir=rtl],[dir=rtl] .fd-container.fd-form-layout-grid-container .fd-row .fd-col-md--6>.fd-form-label{float:left;text-align:left}.fd-container.fd-form-layout-grid-container .fd-row .fd-col-md--7>.fd-form-label{float:right;padding-bottom:0;text-align:right;width:100%}.fd-container.fd-form-layout-grid-container .fd-row .fd-col-md--7>.fd-form-label[dir=rtl],[dir=rtl] .fd-container.fd-form-layout-grid-container .fd-row .fd-col-md--7>.fd-form-label{float:left;text-align:left}.fd-container.fd-form-layout-grid-container .fd-row .fd-col-md--8>.fd-form-label{float:right;padding-bottom:0;text-align:right;width:100%}.fd-container.fd-form-layout-grid-container .fd-row .fd-col-md--8>.fd-form-label[dir=rtl],[dir=rtl] .fd-container.fd-form-layout-grid-container .fd-row .fd-col-md--8>.fd-form-label{float:left;text-align:left}.fd-container.fd-form-layout-grid-container .fd-row .fd-col-md--9>.fd-form-label{float:right;padding-bottom:0;text-align:right;width:100%}.fd-container.fd-form-layout-grid-container .fd-row .fd-col-md--9>.fd-form-label[dir=rtl],[dir=rtl] .fd-container.fd-form-layout-grid-container .fd-row .fd-col-md--9>.fd-form-label{float:left;text-align:left}.fd-container.fd-form-layout-grid-container .fd-row .fd-col-md--10>.fd-form-label{float:right;padding-bottom:0;text-align:right;width:100%}.fd-container.fd-form-layout-grid-container .fd-row .fd-col-md--10>.fd-form-label[dir=rtl],[dir=rtl] .fd-container.fd-form-layout-grid-container .fd-row .fd-col-md--10>.fd-form-label{float:left;text-align:left}.fd-container.fd-form-layout-grid-container .fd-row .fd-col-md--11>.fd-form-label{float:right;padding-bottom:0;text-align:right;width:100%}.fd-container.fd-form-layout-grid-container .fd-row .fd-col-md--11>.fd-form-label[dir=rtl],[dir=rtl] .fd-container.fd-form-layout-grid-container .fd-row .fd-col-md--11>.fd-form-label{float:left;text-align:left}.fd-container.fd-form-layout-grid-container .fd-row .fd-col-md--12>.fd-form-label,.fd-container.fd-form-layout-grid-container .fd-row .fd-col-md>.fd-form-label{float:left;padding-bottom:.125rem;text-align:left;width:auto}.fd-container.fd-form-layout-grid-container .fd-row .fd-col-md--12>.fd-form-label[dir=rtl],.fd-container.fd-form-layout-grid-container .fd-row .fd-col-md>.fd-form-label[dir=rtl],[dir=rtl] .fd-container.fd-form-layout-grid-container .fd-row .fd-col-md--12>.fd-form-label,[dir=rtl] .fd-container.fd-form-layout-grid-container .fd-row .fd-col-md>.fd-form-label{float:right;text-align:right}}@media (min-width: 600px) and (max-width: 1023px){.fd-container.fd-form-layout-grid-container.fd-form-layout-grid-container--md-vertical .fd-form-group .fd-form-item,.fd-container.fd-form-layout-grid-container.fd-form-layout-grid-container--md-vertical.fd-form-group .fd-form-item{margin-top:.625rem}.fd-container.fd-form-layout-grid-container.fd-form-layout-grid-container--md-vertical .fd-form-group .fd-form-item:first-of-type,.fd-container.fd-form-layout-grid-container.fd-form-layout-grid-container--md-vertical.fd-form-group .fd-form-item:first-of-type{margin-top:0}}@media (min-width: 1024px){.fd-container.fd-form-layout-grid-container .fd-row .fd-col-lg--1>.fd-form-label{float:right;padding-bottom:0;text-align:right;width:100%}.fd-container.fd-form-layout-grid-container .fd-row .fd-col-lg--1>.fd-form-label[dir=rtl],[dir=rtl] .fd-container.fd-form-layout-grid-container .fd-row .fd-col-lg--1>.fd-form-label{float:left;text-align:left}.fd-container.fd-form-layout-grid-container .fd-row .fd-col-lg--2>.fd-form-label{float:right;padding-bottom:0;text-align:right;width:100%}.fd-container.fd-form-layout-grid-container .fd-row .fd-col-lg--2>.fd-form-label[dir=rtl],[dir=rtl] .fd-container.fd-form-layout-grid-container .fd-row .fd-col-lg--2>.fd-form-label{float:left;text-align:left}.fd-container.fd-form-layout-grid-container .fd-row .fd-col-lg--3>.fd-form-label{float:right;padding-bottom:0;text-align:right;width:100%}.fd-container.fd-form-layout-grid-container .fd-row .fd-col-lg--3>.fd-form-label[dir=rtl],[dir=rtl] .fd-container.fd-form-layout-grid-container .fd-row .fd-col-lg--3>.fd-form-label{float:left;text-align:left}.fd-container.fd-form-layout-grid-container .fd-row .fd-col-lg--4>.fd-form-label{float:right;padding-bottom:0;text-align:right;width:100%}.fd-container.fd-form-layout-grid-container .fd-row .fd-col-lg--4>.fd-form-label[dir=rtl],[dir=rtl] .fd-container.fd-form-layout-grid-container .fd-row .fd-col-lg--4>.fd-form-label{float:left;text-align:left}.fd-container.fd-form-layout-grid-container .fd-row .fd-col-lg--5>.fd-form-label{float:right;padding-bottom:0;text-align:right;width:100%}.fd-container.fd-form-layout-grid-container .fd-row .fd-col-lg--5>.fd-form-label[dir=rtl],[dir=rtl] .fd-container.fd-form-layout-grid-container .fd-row .fd-col-lg--5>.fd-form-label{float:left;text-align:left}.fd-container.fd-form-layout-grid-container .fd-row .fd-col-lg--6>.fd-form-label{float:right;padding-bottom:0;text-align:right;width:100%}.fd-container.fd-form-layout-grid-container .fd-row .fd-col-lg--6>.fd-form-label[dir=rtl],[dir=rtl] .fd-container.fd-form-layout-grid-container .fd-row .fd-col-lg--6>.fd-form-label{float:left;text-align:left}.fd-container.fd-form-layout-grid-container .fd-row .fd-col-lg--7>.fd-form-label{float:right;padding-bottom:0;text-align:right;width:100%}.fd-container.fd-form-layout-grid-container .fd-row .fd-col-lg--7>.fd-form-label[dir=rtl],[dir=rtl] .fd-container.fd-form-layout-grid-container .fd-row .fd-col-lg--7>.fd-form-label{float:left;text-align:left}.fd-container.fd-form-layout-grid-container .fd-row .fd-col-lg--8>.fd-form-label{float:right;padding-bottom:0;text-align:right;width:100%}.fd-container.fd-form-layout-grid-container .fd-row .fd-col-lg--8>.fd-form-label[dir=rtl],[dir=rtl] .fd-container.fd-form-layout-grid-container .fd-row .fd-col-lg--8>.fd-form-label{float:left;text-align:left}.fd-container.fd-form-layout-grid-container .fd-row .fd-col-lg--9>.fd-form-label{float:right;padding-bottom:0;text-align:right;width:100%}.fd-container.fd-form-layout-grid-container .fd-row .fd-col-lg--9>.fd-form-label[dir=rtl],[dir=rtl] .fd-container.fd-form-layout-grid-container .fd-row .fd-col-lg--9>.fd-form-label{float:left;text-align:left}.fd-container.fd-form-layout-grid-container .fd-row .fd-col-lg--10>.fd-form-label{float:right;padding-bottom:0;text-align:right;width:100%}.fd-container.fd-form-layout-grid-container .fd-row .fd-col-lg--10>.fd-form-label[dir=rtl],[dir=rtl] .fd-container.fd-form-layout-grid-container .fd-row .fd-col-lg--10>.fd-form-label{float:left;text-align:left}.fd-container.fd-form-layout-grid-container .fd-row .fd-col-lg--11>.fd-form-label{float:right;padding-bottom:0;text-align:right;width:100%}.fd-container.fd-form-layout-grid-container .fd-row .fd-col-lg--11>.fd-form-label[dir=rtl],[dir=rtl] .fd-container.fd-form-layout-grid-container .fd-row .fd-col-lg--11>.fd-form-label{float:left;text-align:left}.fd-container.fd-form-layout-grid-container .fd-row .fd-col-lg--12>.fd-form-label,.fd-container.fd-form-layout-grid-container .fd-row .fd-col-lg>.fd-form-label{float:left;padding-bottom:.125rem;text-align:left;width:auto}.fd-container.fd-form-layout-grid-container .fd-row .fd-col-lg--12>.fd-form-label[dir=rtl],.fd-container.fd-form-layout-grid-container .fd-row .fd-col-lg>.fd-form-label[dir=rtl],[dir=rtl] .fd-container.fd-form-layout-grid-container .fd-row .fd-col-lg--12>.fd-form-label,[dir=rtl] .fd-container.fd-form-layout-grid-container .fd-row .fd-col-lg>.fd-form-label{float:right;text-align:right}}@media (min-width: 1024px) and (max-width: 1443px){.fd-container.fd-form-layout-grid-container.fd-form-layout-grid-container--lg-vertical .fd-form-group .fd-form-item,.fd-container.fd-form-layout-grid-container.fd-form-layout-grid-container--lg-vertical.fd-form-group .fd-form-item{margin-top:.625rem}.fd-container.fd-form-layout-grid-container.fd-form-layout-grid-container--lg-vertical .fd-form-group .fd-form-item:first-of-type,.fd-container.fd-form-layout-grid-container.fd-form-layout-grid-container--lg-vertical.fd-form-group .fd-form-item:first-of-type{margin-top:0}}@media (min-width: 1440px){.fd-container.fd-form-layout-grid-container.fd-form-layout-grid-container--xl-vertical .fd-form-group .fd-form-item,.fd-container.fd-form-layout-grid-container.fd-form-layout-grid-container--xl-vertical.fd-form-group .fd-form-item{margin-top:.625rem}.fd-container.fd-form-layout-grid-container.fd-form-layout-grid-container--xl-vertical .fd-form-group .fd-form-item:first-of-type,.fd-container.fd-form-layout-grid-container.fd-form-layout-grid-container--xl-vertical.fd-form-group .fd-form-item:first-of-type{margin-top:0}.fd-container.fd-form-layout-grid-container .fd-row .fd-col-xl--1>.fd-form-label{float:right;padding-bottom:0;text-align:right;width:100%}.fd-container.fd-form-layout-grid-container .fd-row .fd-col-xl--1>.fd-form-label[dir=rtl],[dir=rtl] .fd-container.fd-form-layout-grid-container .fd-row .fd-col-xl--1>.fd-form-label{float:left;text-align:left}.fd-container.fd-form-layout-grid-container .fd-row .fd-col-xl--2>.fd-form-label{float:right;padding-bottom:0;text-align:right;width:100%}.fd-container.fd-form-layout-grid-container .fd-row .fd-col-xl--2>.fd-form-label[dir=rtl],[dir=rtl] .fd-container.fd-form-layout-grid-container .fd-row .fd-col-xl--2>.fd-form-label{float:left;text-align:left}.fd-container.fd-form-layout-grid-container .fd-row .fd-col-xl--3>.fd-form-label{float:right;padding-bottom:0;text-align:right;width:100%}.fd-container.fd-form-layout-grid-container .fd-row .fd-col-xl--3>.fd-form-label[dir=rtl],[dir=rtl] .fd-container.fd-form-layout-grid-container .fd-row .fd-col-xl--3>.fd-form-label{float:left;text-align:left}.fd-container.fd-form-layout-grid-container .fd-row .fd-col-xl--4>.fd-form-label{float:right;padding-bottom:0;text-align:right;width:100%}.fd-container.fd-form-layout-grid-container .fd-row .fd-col-xl--4>.fd-form-label[dir=rtl],[dir=rtl] .fd-container.fd-form-layout-grid-container .fd-row .fd-col-xl--4>.fd-form-label{float:left;text-align:left}.fd-container.fd-form-layout-grid-container .fd-row .fd-col-xl--5>.fd-form-label{float:right;padding-bottom:0;text-align:right;width:100%}.fd-container.fd-form-layout-grid-container .fd-row .fd-col-xl--5>.fd-form-label[dir=rtl],[dir=rtl] .fd-container.fd-form-layout-grid-container .fd-row .fd-col-xl--5>.fd-form-label{float:left;text-align:left}.fd-container.fd-form-layout-grid-container .fd-row .fd-col-xl--6>.fd-form-label{float:right;padding-bottom:0;text-align:right;width:100%}.fd-container.fd-form-layout-grid-container .fd-row .fd-col-xl--6>.fd-form-label[dir=rtl],[dir=rtl] .fd-container.fd-form-layout-grid-container .fd-row .fd-col-xl--6>.fd-form-label{float:left;text-align:left}.fd-container.fd-form-layout-grid-container .fd-row .fd-col-xl--7>.fd-form-label{float:right;padding-bottom:0;text-align:right;width:100%}.fd-container.fd-form-layout-grid-container .fd-row .fd-col-xl--7>.fd-form-label[dir=rtl],[dir=rtl] .fd-container.fd-form-layout-grid-container .fd-row .fd-col-xl--7>.fd-form-label{float:left;text-align:left}.fd-container.fd-form-layout-grid-container .fd-row .fd-col-xl--8>.fd-form-label{float:right;padding-bottom:0;text-align:right;width:100%}.fd-container.fd-form-layout-grid-container .fd-row .fd-col-xl--8>.fd-form-label[dir=rtl],[dir=rtl] .fd-container.fd-form-layout-grid-container .fd-row .fd-col-xl--8>.fd-form-label{float:left;text-align:left}.fd-container.fd-form-layout-grid-container .fd-row .fd-col-xl--9>.fd-form-label{float:right;padding-bottom:0;text-align:right;width:100%}.fd-container.fd-form-layout-grid-container .fd-row .fd-col-xl--9>.fd-form-label[dir=rtl],[dir=rtl] .fd-container.fd-form-layout-grid-container .fd-row .fd-col-xl--9>.fd-form-label{float:left;text-align:left}.fd-container.fd-form-layout-grid-container .fd-row .fd-col-xl--10>.fd-form-label{float:right;padding-bottom:0;text-align:right;width:100%}.fd-container.fd-form-layout-grid-container .fd-row .fd-col-xl--10>.fd-form-label[dir=rtl],[dir=rtl] .fd-container.fd-form-layout-grid-container .fd-row .fd-col-xl--10>.fd-form-label{float:left;text-align:left}.fd-container.fd-form-layout-grid-container .fd-row .fd-col-xl--11>.fd-form-label{float:right;padding-bottom:0;text-align:right;width:100%}.fd-container.fd-form-layout-grid-container .fd-row .fd-col-xl--11>.fd-form-label[dir=rtl],[dir=rtl] .fd-container.fd-form-layout-grid-container .fd-row .fd-col-xl--11>.fd-form-label{float:left;text-align:left}.fd-container.fd-form-layout-grid-container .fd-row .fd-col-xl--12>.fd-form-label,.fd-container.fd-form-layout-grid-container .fd-row .fd-col-xl>.fd-form-label{float:left;padding-bottom:.125rem;text-align:left;width:auto}.fd-container.fd-form-layout-grid-container .fd-row .fd-col-xl--12>.fd-form-label[dir=rtl],.fd-container.fd-form-layout-grid-container .fd-row .fd-col-xl>.fd-form-label[dir=rtl],[dir=rtl] .fd-container.fd-form-layout-grid-container .fd-row .fd-col-xl--12>.fd-form-label,[dir=rtl] .fd-container.fd-form-layout-grid-container .fd-row .fd-col-xl>.fd-form-label{float:right;text-align:right}}.fd-section{-webkit-box-sizing:border-box;background-color:var(--sapToolbar_Background);border:0;border-bottom:none;box-sizing:border-box;color:var(--sapTextColor);font-family:var(--sapFontFamily);font-size:var(--sapFontSize);font-weight:400;forced-color-adjust:none;line-height:var(--sapContent_LineHeight);margin:0;padding:1rem .5rem 1.5rem}.fd-section:after,.fd-section:before{box-sizing:inherit;font-size:inherit}.fd-section:after{clear:both;content:\"\";display:table}@media (min-width: 600px){.fd-section{padding-left:2rem;padding-right:2rem}}@media (min-width: 1440px){.fd-section{padding-left:3rem;padding-right:3rem}}.fd-section--no-border,.fd-section:last-child{border-bottom:0}.fd-section--bleed,.fd-section--full-bleed{-webkit-box-sizing:border-box;border:0;box-sizing:border-box;color:var(--sapTextColor);font-family:var(--sapFontFamily);font-size:var(--sapFontSize);font-weight:400;forced-color-adjust:none;line-height:var(--sapContent_LineHeight);margin:0;padding:0}.fd-section--bleed:after,.fd-section--bleed:before,.fd-section--full-bleed:after,.fd-section--full-bleed:before{box-sizing:inherit;font-size:inherit}.fd-section--bleed .fd-section__footer,.fd-section--bleed .fd-section__header,.fd-section--full-bleed .fd-section__footer,.fd-section--full-bleed .fd-section__header{padding-left:.5rem;padding-right:.5rem}@media (min-width: 600px){.fd-section--bleed .fd-section__footer,.fd-section--bleed .fd-section__header,.fd-section--full-bleed .fd-section__footer,.fd-section--full-bleed .fd-section__header{padding-left:2rem;padding-right:2rem}}@media (min-width: 1440px){.fd-section--bleed .fd-section__footer,.fd-section--bleed .fd-section__header,.fd-section--full-bleed .fd-section__footer,.fd-section--full-bleed .fd-section__header{padding-left:3rem;padding-right:3rem}}.fd-section__header{-webkit-box-sizing:border-box;align-items:center;border:0;box-sizing:border-box;color:var(--sapTextColor);display:flex;font-family:var(--sapFontFamily);font-size:var(--sapFontSize);font-weight:400;forced-color-adjust:none;line-height:var(--sapContent_LineHeight);margin:0 0 1.5rem;min-height:1.5rem;padding:0}.fd-section__header:after,.fd-section__header:before{box-sizing:inherit;font-size:inherit}.fd-section__title{-webkit-box-sizing:border-box;-webkit-box-flex:1;-ms-flex:1;border:0;box-sizing:border-box;color:var(--sapTextColor);color:var(--sapTitleColor);flex:1;font-family:var(--sapFontFamily);font-size:var(--sapFontSize);font-size:var(--sapFontHeader2Size);font-weight:400;forced-color-adjust:none;line-height:var(--sapContent_LineHeight);line-height:2rem;margin:0;padding:0}.fd-section__title:after,.fd-section__title:before{box-sizing:inherit;font-size:inherit}.fd-section__actions{-webkit-box-sizing:border-box;border:0;box-sizing:border-box;color:var(--sapTextColor);font-family:var(--sapFontFamily);font-size:var(--sapFontSize);font-weight:400;forced-color-adjust:none;line-height:var(--sapContent_LineHeight);margin:0 0 0 auto;padding:0}.fd-section__actions:after,.fd-section__actions:before{box-sizing:inherit;font-size:inherit}.fd-section__footer{-webkit-box-sizing:border-box;-webkit-box-pack:center;-ms-flex-pack:center;border:0;box-sizing:border-box;color:var(--sapTextColor);display:flex;font-family:var(--sapFontFamily);font-size:var(--sapFontSize);font-weight:400;forced-color-adjust:none;justify-content:center;line-height:var(--sapContent_LineHeight);margin:0;padding:0}.fd-section__footer:after,.fd-section__footer:before{box-sizing:inherit;font-size:inherit}.fd-form-group{-webkit-box-sizing:border-box;border:0;box-sizing:border-box;color:var(--sapTextColor);font-family:var(--sapFontFamily);font-size:var(--sapFontSize);font-weight:400;forced-color-adjust:none;line-height:var(--sapContent_LineHeight);margin:0;padding:0}.fd-form-group:after,.fd-form-group:before{box-sizing:inherit;font-size:inherit}.fd-form-group--inline{-webkit-box-pack:start;-ms-flex-pack:start;-ms-flex-wrap:wrap;flex-direction:row;flex-wrap:wrap;justify-content:flex-start}.fd-form-group--inline,.fd-form-group__header{display:flex}.fd-form-group__header{-webkit-box-sizing:border-box;align-items:center;background-color:var(--sapGroup_TitleBackground);border:0;box-sizing:border-box;color:var(--sapTextColor);font-family:var(--sapFontFamily);font-size:var(--sapFontSize);font-weight:400;forced-color-adjust:none;height:2.75rem;line-height:var(--sapContent_LineHeight);margin:0;padding:0;width:100%}.fd-form-group__header:after,.fd-form-group__header:before{box-sizing:inherit;font-size:inherit}.fd-form-group__header[class*=-compact],.fd-form-group__header[class*=-condensed],[class*=-compact] .fd-form-group__header:not([class*=-cozy]),[class*=-condensed] .fd-form-group__header:not([class*=-cozy]){height:2rem}.fd-form-group__header-text{-webkit-box-sizing:border-box;border:0;box-sizing:border-box;color:var(--sapTextColor);color:var(--sapGroup_TitleTextColor);font-family:var(--sapFontFamily);font-family:var(--sapFontHeaderFamily);font-size:var(--sapFontSize);font-size:var(--sapFontHeader6Size);font-weight:400;font-weight:700;forced-color-adjust:none;line-height:var(--sapContent_LineHeight);margin:0;overflow:hidden;padding:0;text-overflow:ellipsis;white-space:nowrap}.fd-form-group__header-text:after,.fd-form-group__header-text:before{box-sizing:inherit;font-size:inherit}/*!\n * Fundamental Library Styles v0.30.2-rc.6\n * Copyright (c) 2023 SAP SE or an SAP affiliate company.\n * Licensed under Apache License 2.0 (https://github.com/SAP/fundamental-styles/blob/main/LICENSE)\n */.fd-form-header{-webkit-box-sizing:border-box;-webkit-box-align:center;-ms-flex-align:center;-webkit-box-shadow:0 var(--fdFormHeader_Border_Width) 0 var(--sapGroup_TitleBorderColor);align-items:center;background-color:var(--sapGroup_TitleBackground);border:0;box-shadow:0 var(--fdFormHeader_Border_Width) 0 var(--sapGroup_TitleBorderColor);box-sizing:border-box;color:var(--sapTextColor);display:flex;font-family:var(--sapFontFamily);font-size:var(--sapFontSize);font-weight:400;forced-color-adjust:none;height:2.75rem;line-height:var(--sapContent_LineHeight);margin:0;padding:0 1rem;width:100%}.fd-form-header:after,.fd-form-header:before{box-sizing:inherit;font-size:inherit}.fd-form-header__text{-webkit-box-sizing:border-box;border:0;box-sizing:border-box;color:var(--sapTextColor);color:var(--sapGroup_TitleTextColor);font-family:var(--sapFontFamily);font-family:var(--sapFontHeaderFamily);font-size:var(--sapFontSize);font-size:var(--sapFontHeader4Size);font-weight:400;forced-color-adjust:none;line-height:var(--sapContent_LineHeight);margin:0;overflow:hidden;padding:0;text-overflow:ellipsis;white-space:nowrap}.fd-form-header__text:after,.fd-form-header__text:before{box-sizing:inherit;font-size:inherit}fdp-form-group{display:block}.fd-form-label{overflow:hidden}\n"] }]
+            args: [{ selector: 'fdp-form-group', changeDetection: ChangeDetectionStrategy.OnPush, encapsulation: ViewEncapsulation.None, providers: [formGroupProvider, FormFieldLayoutService, contentDensityObserverProviders()], standalone: true, imports: [
+                        NgIf,
+                        FormsModule,
+                        NgTemplateOutlet,
+                        NgFor,
+                        FormGroupHeaderComponent,
+                        LinkComponent,
+                        IconModule,
+                        InlineHelpModule,
+                        AsyncPipe,
+                        KeyValuePipe,
+                        FieldGroupRowValuePipe,
+                        ContentDensityModule
+                    ], template: "<form #nativeForm (ngSubmit)=\"onSubmit.emit($event)\" *ngIf=\"useForm; else body\" [id]=\"id\" [name]=\"name\">\n    <ng-container *ngTemplateOutlet=\"body\"></ng-container>\n</form>\n\n<ng-template #body>\n    <!--  Render fields and field groups with assigned columns -->\n    <ng-container *ngTemplateOutlet=\"fields\"></ng-container>\n</ng-template>\n\n<ng-template #fields>\n    <div *ngIf=\"mainTitle && !hideMainTItle\" class=\"fd-form-header\">\n        <ng-template [ngTemplateOutlet]=\"mainTitleTemplate\"></ng-template>\n    </div>\n\n    <div\n        class=\"fd-container fd-form-layout-grid-container\"\n        [class.is-compact]=\"contentDensityObserver.isCompact$ | async\"\n    >\n        <div *ngFor=\"let column of formRows | keyvalue; trackBy: trackByFn\" class=\"fd-row\">\n            <div\n                *ngFor=\"let fields of column | fieldGroupRowValue | keyvalue; trackBy: trackByFn; let index = index\"\n                class=\"fd-col fd-form-group\"\n                [class]=\"xlCol\"\n            >\n                <div class=\"fd-row\" *ngIf=\"$fieldGroup(column.value) as value\">\n                    <div class=\"fd-col\">\n                        <div *ngIf=\"value.label\" fdp-form-group-header [fieldGroup]=\"index === 0 ? value : null\"></div>\n                    </div>\n                </div>\n\n                <div *ngFor=\"let field of fields.value; trackBy: trackByFieldName\" class=\"fd-row fd-form-item\">\n                    <div class=\"fd-col\" [class]=\"_inlineColumnLayoutClass\" [style.order]=\"field.rank\">\n                        <ng-container *ngTemplateOutlet=\"field?.renderer || null\"></ng-container>\n                    </div>\n                </div>\n            </div>\n        </div>\n    </div>\n</ng-template>\n\n<!-- For nested form-group -->\n<ng-content select=\"fdp-form-group\"></ng-content>\n\n<ng-template #mainTitleTemplate>\n    <ng-container *ngIf=\"_hintOptions?.content && _hintOptions.position === 'before'\">\n        <ng-template [ngTemplateOutlet]=\"hintTemplate\"></ng-template>\n    </ng-container>\n\n    <h5 class=\"fd-form-header__text\">\n        {{ mainTitle }}\n    </h5>\n\n    <ng-container *ngIf=\"_hintOptions?.content && _hintOptions.position === 'after'\">\n        <ng-template [ngTemplateOutlet]=\"hintTemplate\"></ng-template>\n    </ng-container>\n\n    <ng-template #hintTemplate>\n        <span fd-link [undecorated]=\"true\">\n            <fd-icon\n                [fd-inline-help]=\"_hintOptions.content\"\n                [glyph]=\"_hintOptions.glyph\"\n                [placement]=\"_hintOptions.placement || null\"\n                [triggers]=\"_hintOptions.trigger || []\"\n                tabindex=\"0\"\n            ></fd-icon>\n        </span>\n    </ng-template>\n</ng-template>\n", styles: [".fd-col,.fd-container,.fd-row{-webkit-box-sizing:border-box;border:0;box-sizing:border-box;color:var(--sapTextColor);font-family:var(--sapFontFamily);font-size:var(--sapFontSize);font-weight:400;forced-color-adjust:none;line-height:var(--sapContent_LineHeight);margin:0;padding:0}.fd-col:after,.fd-col:before,.fd-container:after,.fd-container:before,.fd-row:after,.fd-row:before{box-sizing:inherit;font-size:inherit}.fd-container{-ms-flex-wrap:wrap;-webkit-box-flex:0;-ms-flex:0 0 100%;display:flex;flex:0 0 100%;flex-wrap:wrap;padding:0 .25rem;position:relative}.fd-container .fd-row{margin-left:-.25rem;margin-right:-.25rem;min-width:calc(100% + .5rem)}.fd-container>.fd-row>.fd-col{padding-bottom:.25rem;padding-top:.25rem}.fd-container.fd-container--no-gap .fd-row,.fd-container.fd-container--no-horizontal-gap .fd-row{margin-left:0;margin-right:0}.fd-container.fd-container--no-gap .fd-row .fd-col,.fd-container.fd-container--no-horizontal-gap .fd-row .fd-col{padding-left:0;padding-right:0}.fd-container.fd-container--no-gap>.fd-row>.fd-col,.fd-container.fd-container--no-vertical-gap>.fd-row>.fd-col{padding-bottom:0;padding-top:0}.fd-container[dir=rtl],[dir=rtl] .fd-container{direction:rtl}.fd-row{-ms-flex-wrap:wrap;-webkit-box-flex:0;-ms-flex:0 0 100%;display:flex;flex:0 0 100%;flex-wrap:wrap;min-width:100%;position:relative}.fd-col{max-width:100%;min-width:100%;padding-left:.25rem;padding-right:.25rem}.fd-col--0{max-width:0;min-width:0%}.fd-col--offset-0{margin-left:0}.fd-col--offset-0[dir=rtl],[dir=rtl] .fd-col--offset-0{margin-left:0;margin-right:0}.fd-col--offset-after-0{margin-right:0}.fd-col--offset-after-0[dir=rtl],[dir=rtl] .fd-col--offset-after-0{margin-left:0;margin-right:0}.fd-col--1{max-width:8.3333333333%;min-width:8.3333333333%}.fd-col--offset-1{margin-left:8.3333333333%}.fd-col--offset-1[dir=rtl],[dir=rtl] .fd-col--offset-1{margin-left:0;margin-right:8.3333333333%}.fd-col--offset-after-1{margin-right:8.3333333333%}.fd-col--offset-after-1[dir=rtl],[dir=rtl] .fd-col--offset-after-1{margin-left:8.3333333333%;margin-right:0}.fd-col--2{max-width:16.6666666667%;min-width:16.6666666667%}.fd-col--offset-2{margin-left:16.6666666667%}.fd-col--offset-2[dir=rtl],[dir=rtl] .fd-col--offset-2{margin-left:0;margin-right:16.6666666667%}.fd-col--offset-after-2{margin-right:16.6666666667%}.fd-col--offset-after-2[dir=rtl],[dir=rtl] .fd-col--offset-after-2{margin-left:16.6666666667%;margin-right:0}.fd-col--3{max-width:25%;min-width:25%}.fd-col--offset-3{margin-left:25%}.fd-col--offset-3[dir=rtl],[dir=rtl] .fd-col--offset-3{margin-left:0;margin-right:25%}.fd-col--offset-after-3{margin-right:25%}.fd-col--offset-after-3[dir=rtl],[dir=rtl] .fd-col--offset-after-3{margin-left:25%;margin-right:0}.fd-col--4{max-width:33.3333333333%;min-width:33.3333333333%}.fd-col--offset-4{margin-left:33.3333333333%}.fd-col--offset-4[dir=rtl],[dir=rtl] .fd-col--offset-4{margin-left:0;margin-right:33.3333333333%}.fd-col--offset-after-4{margin-right:33.3333333333%}.fd-col--offset-after-4[dir=rtl],[dir=rtl] .fd-col--offset-after-4{margin-left:33.3333333333%;margin-right:0}.fd-col--5{max-width:41.6666666667%;min-width:41.6666666667%}.fd-col--offset-5{margin-left:41.6666666667%}.fd-col--offset-5[dir=rtl],[dir=rtl] .fd-col--offset-5{margin-left:0;margin-right:41.6666666667%}.fd-col--offset-after-5{margin-right:41.6666666667%}.fd-col--offset-after-5[dir=rtl],[dir=rtl] .fd-col--offset-after-5{margin-left:41.6666666667%;margin-right:0}.fd-col--6{max-width:50%;min-width:50%}.fd-col--offset-6{margin-left:50%}.fd-col--offset-6[dir=rtl],[dir=rtl] .fd-col--offset-6{margin-left:0;margin-right:50%}.fd-col--offset-after-6{margin-right:50%}.fd-col--offset-after-6[dir=rtl],[dir=rtl] .fd-col--offset-after-6{margin-left:50%;margin-right:0}.fd-col--7{max-width:58.3333333333%;min-width:58.3333333333%}.fd-col--offset-7{margin-left:58.3333333333%}.fd-col--offset-7[dir=rtl],[dir=rtl] .fd-col--offset-7{margin-left:0;margin-right:58.3333333333%}.fd-col--offset-after-7{margin-right:58.3333333333%}.fd-col--offset-after-7[dir=rtl],[dir=rtl] .fd-col--offset-after-7{margin-left:58.3333333333%;margin-right:0}.fd-col--8{max-width:66.6666666667%;min-width:66.6666666667%}.fd-col--offset-8{margin-left:66.6666666667%}.fd-col--offset-8[dir=rtl],[dir=rtl] .fd-col--offset-8{margin-left:0;margin-right:66.6666666667%}.fd-col--offset-after-8{margin-right:66.6666666667%}.fd-col--offset-after-8[dir=rtl],[dir=rtl] .fd-col--offset-after-8{margin-left:66.6666666667%;margin-right:0}.fd-col--9{max-width:75%;min-width:75%}.fd-col--offset-9{margin-left:75%}.fd-col--offset-9[dir=rtl],[dir=rtl] .fd-col--offset-9{margin-left:0;margin-right:75%}.fd-col--offset-after-9{margin-right:75%}.fd-col--offset-after-9[dir=rtl],[dir=rtl] .fd-col--offset-after-9{margin-left:75%;margin-right:0}.fd-col--10{max-width:83.3333333333%;min-width:83.3333333333%}.fd-col--offset-10{margin-left:83.3333333333%}.fd-col--offset-10[dir=rtl],[dir=rtl] .fd-col--offset-10{margin-left:0;margin-right:83.3333333333%}.fd-col--offset-after-10{margin-right:83.3333333333%}.fd-col--offset-after-10[dir=rtl],[dir=rtl] .fd-col--offset-after-10{margin-left:83.3333333333%;margin-right:0}.fd-col--11{max-width:91.6666666667%;min-width:91.6666666667%}.fd-col--offset-11{margin-left:91.6666666667%}.fd-col--offset-11[dir=rtl],[dir=rtl] .fd-col--offset-11{margin-left:0;margin-right:91.6666666667%}.fd-col--offset-after-11{margin-right:91.6666666667%}.fd-col--offset-after-11[dir=rtl],[dir=rtl] .fd-col--offset-after-11{margin-left:91.6666666667%;margin-right:0}.fd-col--12{max-width:100%;min-width:100%}.fd-col--offset-12{margin-left:100%}.fd-col--offset-12[dir=rtl],[dir=rtl] .fd-col--offset-12{margin-left:0;margin-right:100%}.fd-col--offset-after-12{margin-right:100%}.fd-col--offset-after-12[dir=rtl],[dir=rtl] .fd-col--offset-after-12{margin-left:100%;margin-right:0}.fd-col--full{flex:1;max-width:none;min-width:8.3333333333%}.fd-col--wrap{flex-wrap:wrap}@media (min-width: 600px){.fd-container{padding:0 .5rem}.fd-container .fd-row{margin-left:-.5rem;margin-right:-.5rem;min-width:calc(100% + 1rem)}.fd-container>.fd-row>.fd-col{padding-bottom:.5rem;padding-top:.5rem}.fd-col{padding-left:.5rem;padding-right:.5rem}.fd-col-md--0{max-width:0;min-width:0%}.fd-col-md--offset-0{margin-left:0}.fd-col-md--offset-0[dir=rtl],[dir=rtl] .fd-col-md--offset-0{margin-left:0;margin-right:0}.fd-col-md--offset-after-0{margin-right:0}.fd-col-md--offset-after-0[dir=rtl],[dir=rtl] .fd-col-md--offset-after-0{margin-left:0;margin-right:0}.fd-col-md--1{max-width:8.3333333333%;min-width:8.3333333333%}.fd-col-md--offset-1{margin-left:8.3333333333%}.fd-col-md--offset-1[dir=rtl],[dir=rtl] .fd-col-md--offset-1{margin-left:0;margin-right:8.3333333333%}.fd-col-md--offset-after-1{margin-right:8.3333333333%}.fd-col-md--offset-after-1[dir=rtl],[dir=rtl] .fd-col-md--offset-after-1{margin-left:8.3333333333%;margin-right:0}.fd-col-md--2{max-width:16.6666666667%;min-width:16.6666666667%}.fd-col-md--offset-2{margin-left:16.6666666667%}.fd-col-md--offset-2[dir=rtl],[dir=rtl] .fd-col-md--offset-2{margin-left:0;margin-right:16.6666666667%}.fd-col-md--offset-after-2{margin-right:16.6666666667%}.fd-col-md--offset-after-2[dir=rtl],[dir=rtl] .fd-col-md--offset-after-2{margin-left:16.6666666667%;margin-right:0}.fd-col-md--3{max-width:25%;min-width:25%}.fd-col-md--offset-3{margin-left:25%}.fd-col-md--offset-3[dir=rtl],[dir=rtl] .fd-col-md--offset-3{margin-left:0;margin-right:25%}.fd-col-md--offset-after-3{margin-right:25%}.fd-col-md--offset-after-3[dir=rtl],[dir=rtl] .fd-col-md--offset-after-3{margin-left:25%;margin-right:0}.fd-col-md--4{max-width:33.3333333333%;min-width:33.3333333333%}.fd-col-md--offset-4{margin-left:33.3333333333%}.fd-col-md--offset-4[dir=rtl],[dir=rtl] .fd-col-md--offset-4{margin-left:0;margin-right:33.3333333333%}.fd-col-md--offset-after-4{margin-right:33.3333333333%}.fd-col-md--offset-after-4[dir=rtl],[dir=rtl] .fd-col-md--offset-after-4{margin-left:33.3333333333%;margin-right:0}.fd-col-md--5{max-width:41.6666666667%;min-width:41.6666666667%}.fd-col-md--offset-5{margin-left:41.6666666667%}.fd-col-md--offset-5[dir=rtl],[dir=rtl] .fd-col-md--offset-5{margin-left:0;margin-right:41.6666666667%}.fd-col-md--offset-after-5{margin-right:41.6666666667%}.fd-col-md--offset-after-5[dir=rtl],[dir=rtl] .fd-col-md--offset-after-5{margin-left:41.6666666667%;margin-right:0}.fd-col-md--6{max-width:50%;min-width:50%}.fd-col-md--offset-6{margin-left:50%}.fd-col-md--offset-6[dir=rtl],[dir=rtl] .fd-col-md--offset-6{margin-left:0;margin-right:50%}.fd-col-md--offset-after-6{margin-right:50%}.fd-col-md--offset-after-6[dir=rtl],[dir=rtl] .fd-col-md--offset-after-6{margin-left:50%;margin-right:0}.fd-col-md--7{max-width:58.3333333333%;min-width:58.3333333333%}.fd-col-md--offset-7{margin-left:58.3333333333%}.fd-col-md--offset-7[dir=rtl],[dir=rtl] .fd-col-md--offset-7{margin-left:0;margin-right:58.3333333333%}.fd-col-md--offset-after-7{margin-right:58.3333333333%}.fd-col-md--offset-after-7[dir=rtl],[dir=rtl] .fd-col-md--offset-after-7{margin-left:58.3333333333%;margin-right:0}.fd-col-md--8{max-width:66.6666666667%;min-width:66.6666666667%}.fd-col-md--offset-8{margin-left:66.6666666667%}.fd-col-md--offset-8[dir=rtl],[dir=rtl] .fd-col-md--offset-8{margin-left:0;margin-right:66.6666666667%}.fd-col-md--offset-after-8{margin-right:66.6666666667%}.fd-col-md--offset-after-8[dir=rtl],[dir=rtl] .fd-col-md--offset-after-8{margin-left:66.6666666667%;margin-right:0}.fd-col-md--9{max-width:75%;min-width:75%}.fd-col-md--offset-9{margin-left:75%}.fd-col-md--offset-9[dir=rtl],[dir=rtl] .fd-col-md--offset-9{margin-left:0;margin-right:75%}.fd-col-md--offset-after-9{margin-right:75%}.fd-col-md--offset-after-9[dir=rtl],[dir=rtl] .fd-col-md--offset-after-9{margin-left:75%;margin-right:0}.fd-col-md--10{max-width:83.3333333333%;min-width:83.3333333333%}.fd-col-md--offset-10{margin-left:83.3333333333%}.fd-col-md--offset-10[dir=rtl],[dir=rtl] .fd-col-md--offset-10{margin-left:0;margin-right:83.3333333333%}.fd-col-md--offset-after-10{margin-right:83.3333333333%}.fd-col-md--offset-after-10[dir=rtl],[dir=rtl] .fd-col-md--offset-after-10{margin-left:83.3333333333%;margin-right:0}.fd-col-md--11{max-width:91.6666666667%;min-width:91.6666666667%}.fd-col-md--offset-11{margin-left:91.6666666667%}.fd-col-md--offset-11[dir=rtl],[dir=rtl] .fd-col-md--offset-11{margin-left:0;margin-right:91.6666666667%}.fd-col-md--offset-after-11{margin-right:91.6666666667%}.fd-col-md--offset-after-11[dir=rtl],[dir=rtl] .fd-col-md--offset-after-11{margin-left:91.6666666667%;margin-right:0}.fd-col-md--12{max-width:100%;min-width:100%}.fd-col-md--offset-12{margin-left:100%}.fd-col-md--offset-12[dir=rtl],[dir=rtl] .fd-col-md--offset-12{margin-left:0;margin-right:100%}.fd-col-md--offset-after-12{margin-right:100%}.fd-col-md--offset-after-12[dir=rtl],[dir=rtl] .fd-col-md--offset-after-12{margin-left:100%;margin-right:0}}@media (min-width: 1024px){.fd-col-lg--0{max-width:0;min-width:0%}.fd-col-lg--offset-0{margin-left:0}.fd-col-lg--offset-0[dir=rtl],[dir=rtl] .fd-col-lg--offset-0{margin-left:0;margin-right:0}.fd-col-lg--offset-after-0{margin-right:0}.fd-col-lg--offset-after-0[dir=rtl],[dir=rtl] .fd-col-lg--offset-after-0{margin-left:0;margin-right:0}.fd-col-lg--1{max-width:8.3333333333%;min-width:8.3333333333%}.fd-col-lg--offset-1{margin-left:8.3333333333%}.fd-col-lg--offset-1[dir=rtl],[dir=rtl] .fd-col-lg--offset-1{margin-left:0;margin-right:8.3333333333%}.fd-col-lg--offset-after-1{margin-right:8.3333333333%}.fd-col-lg--offset-after-1[dir=rtl],[dir=rtl] .fd-col-lg--offset-after-1{margin-left:8.3333333333%;margin-right:0}.fd-col-lg--2{max-width:16.6666666667%;min-width:16.6666666667%}.fd-col-lg--offset-2{margin-left:16.6666666667%}.fd-col-lg--offset-2[dir=rtl],[dir=rtl] .fd-col-lg--offset-2{margin-left:0;margin-right:16.6666666667%}.fd-col-lg--offset-after-2{margin-right:16.6666666667%}.fd-col-lg--offset-after-2[dir=rtl],[dir=rtl] .fd-col-lg--offset-after-2{margin-left:16.6666666667%;margin-right:0}.fd-col-lg--3{max-width:25%;min-width:25%}.fd-col-lg--offset-3{margin-left:25%}.fd-col-lg--offset-3[dir=rtl],[dir=rtl] .fd-col-lg--offset-3{margin-left:0;margin-right:25%}.fd-col-lg--offset-after-3{margin-right:25%}.fd-col-lg--offset-after-3[dir=rtl],[dir=rtl] .fd-col-lg--offset-after-3{margin-left:25%;margin-right:0}.fd-col-lg--4{max-width:33.3333333333%;min-width:33.3333333333%}.fd-col-lg--offset-4{margin-left:33.3333333333%}.fd-col-lg--offset-4[dir=rtl],[dir=rtl] .fd-col-lg--offset-4{margin-left:0;margin-right:33.3333333333%}.fd-col-lg--offset-after-4{margin-right:33.3333333333%}.fd-col-lg--offset-after-4[dir=rtl],[dir=rtl] .fd-col-lg--offset-after-4{margin-left:33.3333333333%;margin-right:0}.fd-col-lg--5{max-width:41.6666666667%;min-width:41.6666666667%}.fd-col-lg--offset-5{margin-left:41.6666666667%}.fd-col-lg--offset-5[dir=rtl],[dir=rtl] .fd-col-lg--offset-5{margin-left:0;margin-right:41.6666666667%}.fd-col-lg--offset-after-5{margin-right:41.6666666667%}.fd-col-lg--offset-after-5[dir=rtl],[dir=rtl] .fd-col-lg--offset-after-5{margin-left:41.6666666667%;margin-right:0}.fd-col-lg--6{max-width:50%;min-width:50%}.fd-col-lg--offset-6{margin-left:50%}.fd-col-lg--offset-6[dir=rtl],[dir=rtl] .fd-col-lg--offset-6{margin-left:0;margin-right:50%}.fd-col-lg--offset-after-6{margin-right:50%}.fd-col-lg--offset-after-6[dir=rtl],[dir=rtl] .fd-col-lg--offset-after-6{margin-left:50%;margin-right:0}.fd-col-lg--7{max-width:58.3333333333%;min-width:58.3333333333%}.fd-col-lg--offset-7{margin-left:58.3333333333%}.fd-col-lg--offset-7[dir=rtl],[dir=rtl] .fd-col-lg--offset-7{margin-left:0;margin-right:58.3333333333%}.fd-col-lg--offset-after-7{margin-right:58.3333333333%}.fd-col-lg--offset-after-7[dir=rtl],[dir=rtl] .fd-col-lg--offset-after-7{margin-left:58.3333333333%;margin-right:0}.fd-col-lg--8{max-width:66.6666666667%;min-width:66.6666666667%}.fd-col-lg--offset-8{margin-left:66.6666666667%}.fd-col-lg--offset-8[dir=rtl],[dir=rtl] .fd-col-lg--offset-8{margin-left:0;margin-right:66.6666666667%}.fd-col-lg--offset-after-8{margin-right:66.6666666667%}.fd-col-lg--offset-after-8[dir=rtl],[dir=rtl] .fd-col-lg--offset-after-8{margin-left:66.6666666667%;margin-right:0}.fd-col-lg--9{max-width:75%;min-width:75%}.fd-col-lg--offset-9{margin-left:75%}.fd-col-lg--offset-9[dir=rtl],[dir=rtl] .fd-col-lg--offset-9{margin-left:0;margin-right:75%}.fd-col-lg--offset-after-9{margin-right:75%}.fd-col-lg--offset-after-9[dir=rtl],[dir=rtl] .fd-col-lg--offset-after-9{margin-left:75%;margin-right:0}.fd-col-lg--10{max-width:83.3333333333%;min-width:83.3333333333%}.fd-col-lg--offset-10{margin-left:83.3333333333%}.fd-col-lg--offset-10[dir=rtl],[dir=rtl] .fd-col-lg--offset-10{margin-left:0;margin-right:83.3333333333%}.fd-col-lg--offset-after-10{margin-right:83.3333333333%}.fd-col-lg--offset-after-10[dir=rtl],[dir=rtl] .fd-col-lg--offset-after-10{margin-left:83.3333333333%;margin-right:0}.fd-col-lg--11{max-width:91.6666666667%;min-width:91.6666666667%}.fd-col-lg--offset-11{margin-left:91.6666666667%}.fd-col-lg--offset-11[dir=rtl],[dir=rtl] .fd-col-lg--offset-11{margin-left:0;margin-right:91.6666666667%}.fd-col-lg--offset-after-11{margin-right:91.6666666667%}.fd-col-lg--offset-after-11[dir=rtl],[dir=rtl] .fd-col-lg--offset-after-11{margin-left:91.6666666667%;margin-right:0}.fd-col-lg--12{max-width:100%;min-width:100%}.fd-col-lg--offset-12{margin-left:100%}.fd-col-lg--offset-12[dir=rtl],[dir=rtl] .fd-col-lg--offset-12{margin-left:0;margin-right:100%}.fd-col-lg--offset-after-12{margin-right:100%}.fd-col-lg--offset-after-12[dir=rtl],[dir=rtl] .fd-col-lg--offset-after-12{margin-left:100%;margin-right:0}}@media (min-width: 1440px){.fd-col-xl--0{max-width:0;min-width:0%}.fd-col-xl--offset-0{margin-left:0}.fd-col-xl--offset-0[dir=rtl],[dir=rtl] .fd-col-xl--offset-0{margin-left:0;margin-right:0}.fd-col-xl--offset-after-0{margin-right:0}.fd-col-xl--offset-after-0[dir=rtl],[dir=rtl] .fd-col-xl--offset-after-0{margin-left:0;margin-right:0}.fd-col-xl--1{max-width:8.3333333333%;min-width:8.3333333333%}.fd-col-xl--offset-1{margin-left:8.3333333333%}.fd-col-xl--offset-1[dir=rtl],[dir=rtl] .fd-col-xl--offset-1{margin-left:0;margin-right:8.3333333333%}.fd-col-xl--offset-after-1{margin-right:8.3333333333%}.fd-col-xl--offset-after-1[dir=rtl],[dir=rtl] .fd-col-xl--offset-after-1{margin-left:8.3333333333%;margin-right:0}.fd-col-xl--2{max-width:16.6666666667%;min-width:16.6666666667%}.fd-col-xl--offset-2{margin-left:16.6666666667%}.fd-col-xl--offset-2[dir=rtl],[dir=rtl] .fd-col-xl--offset-2{margin-left:0;margin-right:16.6666666667%}.fd-col-xl--offset-after-2{margin-right:16.6666666667%}.fd-col-xl--offset-after-2[dir=rtl],[dir=rtl] .fd-col-xl--offset-after-2{margin-left:16.6666666667%;margin-right:0}.fd-col-xl--3{max-width:25%;min-width:25%}.fd-col-xl--offset-3{margin-left:25%}.fd-col-xl--offset-3[dir=rtl],[dir=rtl] .fd-col-xl--offset-3{margin-left:0;margin-right:25%}.fd-col-xl--offset-after-3{margin-right:25%}.fd-col-xl--offset-after-3[dir=rtl],[dir=rtl] .fd-col-xl--offset-after-3{margin-left:25%;margin-right:0}.fd-col-xl--4{max-width:33.3333333333%;min-width:33.3333333333%}.fd-col-xl--offset-4{margin-left:33.3333333333%}.fd-col-xl--offset-4[dir=rtl],[dir=rtl] .fd-col-xl--offset-4{margin-left:0;margin-right:33.3333333333%}.fd-col-xl--offset-after-4{margin-right:33.3333333333%}.fd-col-xl--offset-after-4[dir=rtl],[dir=rtl] .fd-col-xl--offset-after-4{margin-left:33.3333333333%;margin-right:0}.fd-col-xl--5{max-width:41.6666666667%;min-width:41.6666666667%}.fd-col-xl--offset-5{margin-left:41.6666666667%}.fd-col-xl--offset-5[dir=rtl],[dir=rtl] .fd-col-xl--offset-5{margin-left:0;margin-right:41.6666666667%}.fd-col-xl--offset-after-5{margin-right:41.6666666667%}.fd-col-xl--offset-after-5[dir=rtl],[dir=rtl] .fd-col-xl--offset-after-5{margin-left:41.6666666667%;margin-right:0}.fd-col-xl--6{max-width:50%;min-width:50%}.fd-col-xl--offset-6{margin-left:50%}.fd-col-xl--offset-6[dir=rtl],[dir=rtl] .fd-col-xl--offset-6{margin-left:0;margin-right:50%}.fd-col-xl--offset-after-6{margin-right:50%}.fd-col-xl--offset-after-6[dir=rtl],[dir=rtl] .fd-col-xl--offset-after-6{margin-left:50%;margin-right:0}.fd-col-xl--7{max-width:58.3333333333%;min-width:58.3333333333%}.fd-col-xl--offset-7{margin-left:58.3333333333%}.fd-col-xl--offset-7[dir=rtl],[dir=rtl] .fd-col-xl--offset-7{margin-left:0;margin-right:58.3333333333%}.fd-col-xl--offset-after-7{margin-right:58.3333333333%}.fd-col-xl--offset-after-7[dir=rtl],[dir=rtl] .fd-col-xl--offset-after-7{margin-left:58.3333333333%;margin-right:0}.fd-col-xl--8{max-width:66.6666666667%;min-width:66.6666666667%}.fd-col-xl--offset-8{margin-left:66.6666666667%}.fd-col-xl--offset-8[dir=rtl],[dir=rtl] .fd-col-xl--offset-8{margin-left:0;margin-right:66.6666666667%}.fd-col-xl--offset-after-8{margin-right:66.6666666667%}.fd-col-xl--offset-after-8[dir=rtl],[dir=rtl] .fd-col-xl--offset-after-8{margin-left:66.6666666667%;margin-right:0}.fd-col-xl--9{max-width:75%;min-width:75%}.fd-col-xl--offset-9{margin-left:75%}.fd-col-xl--offset-9[dir=rtl],[dir=rtl] .fd-col-xl--offset-9{margin-left:0;margin-right:75%}.fd-col-xl--offset-after-9{margin-right:75%}.fd-col-xl--offset-after-9[dir=rtl],[dir=rtl] .fd-col-xl--offset-after-9{margin-left:75%;margin-right:0}.fd-col-xl--10{max-width:83.3333333333%;min-width:83.3333333333%}.fd-col-xl--offset-10{margin-left:83.3333333333%}.fd-col-xl--offset-10[dir=rtl],[dir=rtl] .fd-col-xl--offset-10{margin-left:0;margin-right:83.3333333333%}.fd-col-xl--offset-after-10{margin-right:83.3333333333%}.fd-col-xl--offset-after-10[dir=rtl],[dir=rtl] .fd-col-xl--offset-after-10{margin-left:83.3333333333%;margin-right:0}.fd-col-xl--11{max-width:91.6666666667%;min-width:91.6666666667%}.fd-col-xl--offset-11{margin-left:91.6666666667%}.fd-col-xl--offset-11[dir=rtl],[dir=rtl] .fd-col-xl--offset-11{margin-left:0;margin-right:91.6666666667%}.fd-col-xl--offset-after-11{margin-right:91.6666666667%}.fd-col-xl--offset-after-11[dir=rtl],[dir=rtl] .fd-col-xl--offset-after-11{margin-left:91.6666666667%;margin-right:0}.fd-col-xl--12{max-width:100%;min-width:100%}.fd-col-xl--offset-12{margin-left:100%}.fd-col-xl--offset-12[dir=rtl],[dir=rtl] .fd-col-xl--offset-12{margin-left:0;margin-right:100%}.fd-col-xl--offset-after-12{margin-right:100%}.fd-col-xl--offset-after-12[dir=rtl],[dir=rtl] .fd-col-xl--offset-after-12{margin-left:100%;margin-right:0}}.fd-container.fd-form-layout-grid-container .fd-form-group,.fd-container.fd-form-layout-grid-container.fd-form-group{padding:1rem!important}.fd-container.fd-form-layout-grid-container .fd-form-group .fd-form-group,.fd-container.fd-form-layout-grid-container.fd-form-group .fd-form-group{padding:0!important}.fd-container.fd-form-layout-grid-container .fd-form-group .fd-form-item .fd-form-label,.fd-container.fd-form-layout-grid-container.fd-form-group .fd-form-item .fd-form-label{margin-right:0;white-space:normal}.fd-container.fd-form-layout-grid-container .fd-form-group .fd-form-item .fd-form-label[dir=rtl],.fd-container.fd-form-layout-grid-container.fd-form-group .fd-form-item .fd-form-label[dir=rtl],[dir=rtl] .fd-container.fd-form-layout-grid-container .fd-form-group .fd-form-item .fd-form-label,[dir=rtl] .fd-container.fd-form-layout-grid-container.fd-form-group .fd-form-item .fd-form-label{margin-left:0;margin-right:0}.fd-container.fd-form-layout-grid-container .fd-form-group .fd-form-item .fd-form-label--required,.fd-container.fd-form-layout-grid-container.fd-form-group .fd-form-item .fd-form-label--required{padding-right:.5rem}.fd-container.fd-form-layout-grid-container .fd-form-group .fd-form-item .fd-form-label--required[dir=rtl],.fd-container.fd-form-layout-grid-container.fd-form-group .fd-form-item .fd-form-label--required[dir=rtl],[dir=rtl] .fd-container.fd-form-layout-grid-container .fd-form-group .fd-form-item .fd-form-label--required,[dir=rtl] .fd-container.fd-form-layout-grid-container.fd-form-group .fd-form-item .fd-form-label--required{padding-left:.5rem;padding-right:0}.fd-container.fd-form-layout-grid-container .fd-row{flex-direction:row}.fd-container.fd-form-layout-grid-container .fd-row .fd-col{overflow:hidden;padding-bottom:0;padding-top:0;text-overflow:ellipsis;white-space:nowrap}.fd-container.fd-form-layout-grid-container .fd-row .fd-col:not(.fd-form-group){align-self:center}@media (min-width: 0){.fd-container.fd-form-layout-grid-container.fd-form-layout-grid-container--vertical .fd-form-group .fd-form-item,.fd-container.fd-form-layout-grid-container.fd-form-layout-grid-container--vertical.fd-form-group .fd-form-item{margin-top:.625rem}.fd-container.fd-form-layout-grid-container.fd-form-layout-grid-container--vertical .fd-form-group .fd-form-item:first-of-type,.fd-container.fd-form-layout-grid-container.fd-form-layout-grid-container--vertical.fd-form-group .fd-form-item:first-of-type{margin-top:0}.fd-container.fd-form-layout-grid-container .fd-row .fd-col--1>.fd-form-label{float:right;padding-bottom:0;text-align:right;width:100%}.fd-container.fd-form-layout-grid-container .fd-row .fd-col--1>.fd-form-label[dir=rtl],[dir=rtl] .fd-container.fd-form-layout-grid-container .fd-row .fd-col--1>.fd-form-label{float:left;text-align:left}.fd-container.fd-form-layout-grid-container .fd-row .fd-col--2>.fd-form-label{float:right;padding-bottom:0;text-align:right;width:100%}.fd-container.fd-form-layout-grid-container .fd-row .fd-col--2>.fd-form-label[dir=rtl],[dir=rtl] .fd-container.fd-form-layout-grid-container .fd-row .fd-col--2>.fd-form-label{float:left;text-align:left}.fd-container.fd-form-layout-grid-container .fd-row .fd-col--3>.fd-form-label{float:right;padding-bottom:0;text-align:right;width:100%}.fd-container.fd-form-layout-grid-container .fd-row .fd-col--3>.fd-form-label[dir=rtl],[dir=rtl] .fd-container.fd-form-layout-grid-container .fd-row .fd-col--3>.fd-form-label{float:left;text-align:left}.fd-container.fd-form-layout-grid-container .fd-row .fd-col--4>.fd-form-label{float:right;padding-bottom:0;text-align:right;width:100%}.fd-container.fd-form-layout-grid-container .fd-row .fd-col--4>.fd-form-label[dir=rtl],[dir=rtl] .fd-container.fd-form-layout-grid-container .fd-row .fd-col--4>.fd-form-label{float:left;text-align:left}.fd-container.fd-form-layout-grid-container .fd-row .fd-col--5>.fd-form-label{float:right;padding-bottom:0;text-align:right;width:100%}.fd-container.fd-form-layout-grid-container .fd-row .fd-col--5>.fd-form-label[dir=rtl],[dir=rtl] .fd-container.fd-form-layout-grid-container .fd-row .fd-col--5>.fd-form-label{float:left;text-align:left}.fd-container.fd-form-layout-grid-container .fd-row .fd-col--6>.fd-form-label{float:right;padding-bottom:0;text-align:right;width:100%}.fd-container.fd-form-layout-grid-container .fd-row .fd-col--6>.fd-form-label[dir=rtl],[dir=rtl] .fd-container.fd-form-layout-grid-container .fd-row .fd-col--6>.fd-form-label{float:left;text-align:left}.fd-container.fd-form-layout-grid-container .fd-row .fd-col--7>.fd-form-label{float:right;padding-bottom:0;text-align:right;width:100%}.fd-container.fd-form-layout-grid-container .fd-row .fd-col--7>.fd-form-label[dir=rtl],[dir=rtl] .fd-container.fd-form-layout-grid-container .fd-row .fd-col--7>.fd-form-label{float:left;text-align:left}.fd-container.fd-form-layout-grid-container .fd-row .fd-col--8>.fd-form-label{float:right;padding-bottom:0;text-align:right;width:100%}.fd-container.fd-form-layout-grid-container .fd-row .fd-col--8>.fd-form-label[dir=rtl],[dir=rtl] .fd-container.fd-form-layout-grid-container .fd-row .fd-col--8>.fd-form-label{float:left;text-align:left}.fd-container.fd-form-layout-grid-container .fd-row .fd-col--9>.fd-form-label{float:right;padding-bottom:0;text-align:right;width:100%}.fd-container.fd-form-layout-grid-container .fd-row .fd-col--9>.fd-form-label[dir=rtl],[dir=rtl] .fd-container.fd-form-layout-grid-container .fd-row .fd-col--9>.fd-form-label{float:left;text-align:left}.fd-container.fd-form-layout-grid-container .fd-row .fd-col--10>.fd-form-label{float:right;padding-bottom:0;text-align:right;width:100%}.fd-container.fd-form-layout-grid-container .fd-row .fd-col--10>.fd-form-label[dir=rtl],[dir=rtl] .fd-container.fd-form-layout-grid-container .fd-row .fd-col--10>.fd-form-label{float:left;text-align:left}.fd-container.fd-form-layout-grid-container .fd-row .fd-col--11>.fd-form-label{float:right;padding-bottom:0;text-align:right;width:100%}.fd-container.fd-form-layout-grid-container .fd-row .fd-col--11>.fd-form-label[dir=rtl],[dir=rtl] .fd-container.fd-form-layout-grid-container .fd-row .fd-col--11>.fd-form-label{float:left;text-align:left}.fd-container.fd-form-layout-grid-container .fd-row .fd-col--12>.fd-form-label,.fd-container.fd-form-layout-grid-container .fd-row .fd-col>.fd-form-label{float:left;padding-bottom:.125rem;text-align:left;width:auto}.fd-container.fd-form-layout-grid-container .fd-row .fd-col--12>.fd-form-label[dir=rtl],.fd-container.fd-form-layout-grid-container .fd-row .fd-col>.fd-form-label[dir=rtl],[dir=rtl] .fd-container.fd-form-layout-grid-container .fd-row .fd-col--12>.fd-form-label,[dir=rtl] .fd-container.fd-form-layout-grid-container .fd-row .fd-col>.fd-form-label{float:right;text-align:right}}@media (min-width: 0) and (max-width: 599px){.fd-container.fd-form-layout-grid-container.fd-form-layout-grid-container .fd-form-group .fd-form-item,.fd-container.fd-form-layout-grid-container.fd-form-layout-grid-container.fd-form-group .fd-form-item{margin-top:.625rem}.fd-container.fd-form-layout-grid-container.fd-form-layout-grid-container .fd-form-group .fd-form-item:first-of-type,.fd-container.fd-form-layout-grid-container.fd-form-layout-grid-container.fd-form-group .fd-form-item:first-of-type{margin-top:0}}@media (min-width: 600px){.fd-container.fd-form-layout-grid-container{padding:0 .25rem}.fd-container.fd-form-layout-grid-container .fd-row{margin:0 -.25rem;min-width:calc(100% + .5rem)}.fd-container.fd-form-layout-grid-container .fd-row .fd-col{padding:0 .25rem}.fd-container.fd-form-layout-grid-container .fd-row .fd-col-md--1>.fd-form-label{float:right;padding-bottom:0;text-align:right;width:100%}.fd-container.fd-form-layout-grid-container .fd-row .fd-col-md--1>.fd-form-label[dir=rtl],[dir=rtl] .fd-container.fd-form-layout-grid-container .fd-row .fd-col-md--1>.fd-form-label{float:left;text-align:left}.fd-container.fd-form-layout-grid-container .fd-row .fd-col-md--2>.fd-form-label{float:right;padding-bottom:0;text-align:right;width:100%}.fd-container.fd-form-layout-grid-container .fd-row .fd-col-md--2>.fd-form-label[dir=rtl],[dir=rtl] .fd-container.fd-form-layout-grid-container .fd-row .fd-col-md--2>.fd-form-label{float:left;text-align:left}.fd-container.fd-form-layout-grid-container .fd-row .fd-col-md--3>.fd-form-label{float:right;padding-bottom:0;text-align:right;width:100%}.fd-container.fd-form-layout-grid-container .fd-row .fd-col-md--3>.fd-form-label[dir=rtl],[dir=rtl] .fd-container.fd-form-layout-grid-container .fd-row .fd-col-md--3>.fd-form-label{float:left;text-align:left}.fd-container.fd-form-layout-grid-container .fd-row .fd-col-md--4>.fd-form-label{float:right;padding-bottom:0;text-align:right;width:100%}.fd-container.fd-form-layout-grid-container .fd-row .fd-col-md--4>.fd-form-label[dir=rtl],[dir=rtl] .fd-container.fd-form-layout-grid-container .fd-row .fd-col-md--4>.fd-form-label{float:left;text-align:left}.fd-container.fd-form-layout-grid-container .fd-row .fd-col-md--5>.fd-form-label{float:right;padding-bottom:0;text-align:right;width:100%}.fd-container.fd-form-layout-grid-container .fd-row .fd-col-md--5>.fd-form-label[dir=rtl],[dir=rtl] .fd-container.fd-form-layout-grid-container .fd-row .fd-col-md--5>.fd-form-label{float:left;text-align:left}.fd-container.fd-form-layout-grid-container .fd-row .fd-col-md--6>.fd-form-label{float:right;padding-bottom:0;text-align:right;width:100%}.fd-container.fd-form-layout-grid-container .fd-row .fd-col-md--6>.fd-form-label[dir=rtl],[dir=rtl] .fd-container.fd-form-layout-grid-container .fd-row .fd-col-md--6>.fd-form-label{float:left;text-align:left}.fd-container.fd-form-layout-grid-container .fd-row .fd-col-md--7>.fd-form-label{float:right;padding-bottom:0;text-align:right;width:100%}.fd-container.fd-form-layout-grid-container .fd-row .fd-col-md--7>.fd-form-label[dir=rtl],[dir=rtl] .fd-container.fd-form-layout-grid-container .fd-row .fd-col-md--7>.fd-form-label{float:left;text-align:left}.fd-container.fd-form-layout-grid-container .fd-row .fd-col-md--8>.fd-form-label{float:right;padding-bottom:0;text-align:right;width:100%}.fd-container.fd-form-layout-grid-container .fd-row .fd-col-md--8>.fd-form-label[dir=rtl],[dir=rtl] .fd-container.fd-form-layout-grid-container .fd-row .fd-col-md--8>.fd-form-label{float:left;text-align:left}.fd-container.fd-form-layout-grid-container .fd-row .fd-col-md--9>.fd-form-label{float:right;padding-bottom:0;text-align:right;width:100%}.fd-container.fd-form-layout-grid-container .fd-row .fd-col-md--9>.fd-form-label[dir=rtl],[dir=rtl] .fd-container.fd-form-layout-grid-container .fd-row .fd-col-md--9>.fd-form-label{float:left;text-align:left}.fd-container.fd-form-layout-grid-container .fd-row .fd-col-md--10>.fd-form-label{float:right;padding-bottom:0;text-align:right;width:100%}.fd-container.fd-form-layout-grid-container .fd-row .fd-col-md--10>.fd-form-label[dir=rtl],[dir=rtl] .fd-container.fd-form-layout-grid-container .fd-row .fd-col-md--10>.fd-form-label{float:left;text-align:left}.fd-container.fd-form-layout-grid-container .fd-row .fd-col-md--11>.fd-form-label{float:right;padding-bottom:0;text-align:right;width:100%}.fd-container.fd-form-layout-grid-container .fd-row .fd-col-md--11>.fd-form-label[dir=rtl],[dir=rtl] .fd-container.fd-form-layout-grid-container .fd-row .fd-col-md--11>.fd-form-label{float:left;text-align:left}.fd-container.fd-form-layout-grid-container .fd-row .fd-col-md--12>.fd-form-label,.fd-container.fd-form-layout-grid-container .fd-row .fd-col-md>.fd-form-label{float:left;padding-bottom:.125rem;text-align:left;width:auto}.fd-container.fd-form-layout-grid-container .fd-row .fd-col-md--12>.fd-form-label[dir=rtl],.fd-container.fd-form-layout-grid-container .fd-row .fd-col-md>.fd-form-label[dir=rtl],[dir=rtl] .fd-container.fd-form-layout-grid-container .fd-row .fd-col-md--12>.fd-form-label,[dir=rtl] .fd-container.fd-form-layout-grid-container .fd-row .fd-col-md>.fd-form-label{float:right;text-align:right}}@media (min-width: 600px) and (max-width: 1023px){.fd-container.fd-form-layout-grid-container.fd-form-layout-grid-container--md-vertical .fd-form-group .fd-form-item,.fd-container.fd-form-layout-grid-container.fd-form-layout-grid-container--md-vertical.fd-form-group .fd-form-item{margin-top:.625rem}.fd-container.fd-form-layout-grid-container.fd-form-layout-grid-container--md-vertical .fd-form-group .fd-form-item:first-of-type,.fd-container.fd-form-layout-grid-container.fd-form-layout-grid-container--md-vertical.fd-form-group .fd-form-item:first-of-type{margin-top:0}}@media (min-width: 1024px){.fd-container.fd-form-layout-grid-container .fd-row .fd-col-lg--1>.fd-form-label{float:right;padding-bottom:0;text-align:right;width:100%}.fd-container.fd-form-layout-grid-container .fd-row .fd-col-lg--1>.fd-form-label[dir=rtl],[dir=rtl] .fd-container.fd-form-layout-grid-container .fd-row .fd-col-lg--1>.fd-form-label{float:left;text-align:left}.fd-container.fd-form-layout-grid-container .fd-row .fd-col-lg--2>.fd-form-label{float:right;padding-bottom:0;text-align:right;width:100%}.fd-container.fd-form-layout-grid-container .fd-row .fd-col-lg--2>.fd-form-label[dir=rtl],[dir=rtl] .fd-container.fd-form-layout-grid-container .fd-row .fd-col-lg--2>.fd-form-label{float:left;text-align:left}.fd-container.fd-form-layout-grid-container .fd-row .fd-col-lg--3>.fd-form-label{float:right;padding-bottom:0;text-align:right;width:100%}.fd-container.fd-form-layout-grid-container .fd-row .fd-col-lg--3>.fd-form-label[dir=rtl],[dir=rtl] .fd-container.fd-form-layout-grid-container .fd-row .fd-col-lg--3>.fd-form-label{float:left;text-align:left}.fd-container.fd-form-layout-grid-container .fd-row .fd-col-lg--4>.fd-form-label{float:right;padding-bottom:0;text-align:right;width:100%}.fd-container.fd-form-layout-grid-container .fd-row .fd-col-lg--4>.fd-form-label[dir=rtl],[dir=rtl] .fd-container.fd-form-layout-grid-container .fd-row .fd-col-lg--4>.fd-form-label{float:left;text-align:left}.fd-container.fd-form-layout-grid-container .fd-row .fd-col-lg--5>.fd-form-label{float:right;padding-bottom:0;text-align:right;width:100%}.fd-container.fd-form-layout-grid-container .fd-row .fd-col-lg--5>.fd-form-label[dir=rtl],[dir=rtl] .fd-container.fd-form-layout-grid-container .fd-row .fd-col-lg--5>.fd-form-label{float:left;text-align:left}.fd-container.fd-form-layout-grid-container .fd-row .fd-col-lg--6>.fd-form-label{float:right;padding-bottom:0;text-align:right;width:100%}.fd-container.fd-form-layout-grid-container .fd-row .fd-col-lg--6>.fd-form-label[dir=rtl],[dir=rtl] .fd-container.fd-form-layout-grid-container .fd-row .fd-col-lg--6>.fd-form-label{float:left;text-align:left}.fd-container.fd-form-layout-grid-container .fd-row .fd-col-lg--7>.fd-form-label{float:right;padding-bottom:0;text-align:right;width:100%}.fd-container.fd-form-layout-grid-container .fd-row .fd-col-lg--7>.fd-form-label[dir=rtl],[dir=rtl] .fd-container.fd-form-layout-grid-container .fd-row .fd-col-lg--7>.fd-form-label{float:left;text-align:left}.fd-container.fd-form-layout-grid-container .fd-row .fd-col-lg--8>.fd-form-label{float:right;padding-bottom:0;text-align:right;width:100%}.fd-container.fd-form-layout-grid-container .fd-row .fd-col-lg--8>.fd-form-label[dir=rtl],[dir=rtl] .fd-container.fd-form-layout-grid-container .fd-row .fd-col-lg--8>.fd-form-label{float:left;text-align:left}.fd-container.fd-form-layout-grid-container .fd-row .fd-col-lg--9>.fd-form-label{float:right;padding-bottom:0;text-align:right;width:100%}.fd-container.fd-form-layout-grid-container .fd-row .fd-col-lg--9>.fd-form-label[dir=rtl],[dir=rtl] .fd-container.fd-form-layout-grid-container .fd-row .fd-col-lg--9>.fd-form-label{float:left;text-align:left}.fd-container.fd-form-layout-grid-container .fd-row .fd-col-lg--10>.fd-form-label{float:right;padding-bottom:0;text-align:right;width:100%}.fd-container.fd-form-layout-grid-container .fd-row .fd-col-lg--10>.fd-form-label[dir=rtl],[dir=rtl] .fd-container.fd-form-layout-grid-container .fd-row .fd-col-lg--10>.fd-form-label{float:left;text-align:left}.fd-container.fd-form-layout-grid-container .fd-row .fd-col-lg--11>.fd-form-label{float:right;padding-bottom:0;text-align:right;width:100%}.fd-container.fd-form-layout-grid-container .fd-row .fd-col-lg--11>.fd-form-label[dir=rtl],[dir=rtl] .fd-container.fd-form-layout-grid-container .fd-row .fd-col-lg--11>.fd-form-label{float:left;text-align:left}.fd-container.fd-form-layout-grid-container .fd-row .fd-col-lg--12>.fd-form-label,.fd-container.fd-form-layout-grid-container .fd-row .fd-col-lg>.fd-form-label{float:left;padding-bottom:.125rem;text-align:left;width:auto}.fd-container.fd-form-layout-grid-container .fd-row .fd-col-lg--12>.fd-form-label[dir=rtl],.fd-container.fd-form-layout-grid-container .fd-row .fd-col-lg>.fd-form-label[dir=rtl],[dir=rtl] .fd-container.fd-form-layout-grid-container .fd-row .fd-col-lg--12>.fd-form-label,[dir=rtl] .fd-container.fd-form-layout-grid-container .fd-row .fd-col-lg>.fd-form-label{float:right;text-align:right}}@media (min-width: 1024px) and (max-width: 1443px){.fd-container.fd-form-layout-grid-container.fd-form-layout-grid-container--lg-vertical .fd-form-group .fd-form-item,.fd-container.fd-form-layout-grid-container.fd-form-layout-grid-container--lg-vertical.fd-form-group .fd-form-item{margin-top:.625rem}.fd-container.fd-form-layout-grid-container.fd-form-layout-grid-container--lg-vertical .fd-form-group .fd-form-item:first-of-type,.fd-container.fd-form-layout-grid-container.fd-form-layout-grid-container--lg-vertical.fd-form-group .fd-form-item:first-of-type{margin-top:0}}@media (min-width: 1440px){.fd-container.fd-form-layout-grid-container.fd-form-layout-grid-container--xl-vertical .fd-form-group .fd-form-item,.fd-container.fd-form-layout-grid-container.fd-form-layout-grid-container--xl-vertical.fd-form-group .fd-form-item{margin-top:.625rem}.fd-container.fd-form-layout-grid-container.fd-form-layout-grid-container--xl-vertical .fd-form-group .fd-form-item:first-of-type,.fd-container.fd-form-layout-grid-container.fd-form-layout-grid-container--xl-vertical.fd-form-group .fd-form-item:first-of-type{margin-top:0}.fd-container.fd-form-layout-grid-container .fd-row .fd-col-xl--1>.fd-form-label{float:right;padding-bottom:0;text-align:right;width:100%}.fd-container.fd-form-layout-grid-container .fd-row .fd-col-xl--1>.fd-form-label[dir=rtl],[dir=rtl] .fd-container.fd-form-layout-grid-container .fd-row .fd-col-xl--1>.fd-form-label{float:left;text-align:left}.fd-container.fd-form-layout-grid-container .fd-row .fd-col-xl--2>.fd-form-label{float:right;padding-bottom:0;text-align:right;width:100%}.fd-container.fd-form-layout-grid-container .fd-row .fd-col-xl--2>.fd-form-label[dir=rtl],[dir=rtl] .fd-container.fd-form-layout-grid-container .fd-row .fd-col-xl--2>.fd-form-label{float:left;text-align:left}.fd-container.fd-form-layout-grid-container .fd-row .fd-col-xl--3>.fd-form-label{float:right;padding-bottom:0;text-align:right;width:100%}.fd-container.fd-form-layout-grid-container .fd-row .fd-col-xl--3>.fd-form-label[dir=rtl],[dir=rtl] .fd-container.fd-form-layout-grid-container .fd-row .fd-col-xl--3>.fd-form-label{float:left;text-align:left}.fd-container.fd-form-layout-grid-container .fd-row .fd-col-xl--4>.fd-form-label{float:right;padding-bottom:0;text-align:right;width:100%}.fd-container.fd-form-layout-grid-container .fd-row .fd-col-xl--4>.fd-form-label[dir=rtl],[dir=rtl] .fd-container.fd-form-layout-grid-container .fd-row .fd-col-xl--4>.fd-form-label{float:left;text-align:left}.fd-container.fd-form-layout-grid-container .fd-row .fd-col-xl--5>.fd-form-label{float:right;padding-bottom:0;text-align:right;width:100%}.fd-container.fd-form-layout-grid-container .fd-row .fd-col-xl--5>.fd-form-label[dir=rtl],[dir=rtl] .fd-container.fd-form-layout-grid-container .fd-row .fd-col-xl--5>.fd-form-label{float:left;text-align:left}.fd-container.fd-form-layout-grid-container .fd-row .fd-col-xl--6>.fd-form-label{float:right;padding-bottom:0;text-align:right;width:100%}.fd-container.fd-form-layout-grid-container .fd-row .fd-col-xl--6>.fd-form-label[dir=rtl],[dir=rtl] .fd-container.fd-form-layout-grid-container .fd-row .fd-col-xl--6>.fd-form-label{float:left;text-align:left}.fd-container.fd-form-layout-grid-container .fd-row .fd-col-xl--7>.fd-form-label{float:right;padding-bottom:0;text-align:right;width:100%}.fd-container.fd-form-layout-grid-container .fd-row .fd-col-xl--7>.fd-form-label[dir=rtl],[dir=rtl] .fd-container.fd-form-layout-grid-container .fd-row .fd-col-xl--7>.fd-form-label{float:left;text-align:left}.fd-container.fd-form-layout-grid-container .fd-row .fd-col-xl--8>.fd-form-label{float:right;padding-bottom:0;text-align:right;width:100%}.fd-container.fd-form-layout-grid-container .fd-row .fd-col-xl--8>.fd-form-label[dir=rtl],[dir=rtl] .fd-container.fd-form-layout-grid-container .fd-row .fd-col-xl--8>.fd-form-label{float:left;text-align:left}.fd-container.fd-form-layout-grid-container .fd-row .fd-col-xl--9>.fd-form-label{float:right;padding-bottom:0;text-align:right;width:100%}.fd-container.fd-form-layout-grid-container .fd-row .fd-col-xl--9>.fd-form-label[dir=rtl],[dir=rtl] .fd-container.fd-form-layout-grid-container .fd-row .fd-col-xl--9>.fd-form-label{float:left;text-align:left}.fd-container.fd-form-layout-grid-container .fd-row .fd-col-xl--10>.fd-form-label{float:right;padding-bottom:0;text-align:right;width:100%}.fd-container.fd-form-layout-grid-container .fd-row .fd-col-xl--10>.fd-form-label[dir=rtl],[dir=rtl] .fd-container.fd-form-layout-grid-container .fd-row .fd-col-xl--10>.fd-form-label{float:left;text-align:left}.fd-container.fd-form-layout-grid-container .fd-row .fd-col-xl--11>.fd-form-label{float:right;padding-bottom:0;text-align:right;width:100%}.fd-container.fd-form-layout-grid-container .fd-row .fd-col-xl--11>.fd-form-label[dir=rtl],[dir=rtl] .fd-container.fd-form-layout-grid-container .fd-row .fd-col-xl--11>.fd-form-label{float:left;text-align:left}.fd-container.fd-form-layout-grid-container .fd-row .fd-col-xl--12>.fd-form-label,.fd-container.fd-form-layout-grid-container .fd-row .fd-col-xl>.fd-form-label{float:left;padding-bottom:.125rem;text-align:left;width:auto}.fd-container.fd-form-layout-grid-container .fd-row .fd-col-xl--12>.fd-form-label[dir=rtl],.fd-container.fd-form-layout-grid-container .fd-row .fd-col-xl>.fd-form-label[dir=rtl],[dir=rtl] .fd-container.fd-form-layout-grid-container .fd-row .fd-col-xl--12>.fd-form-label,[dir=rtl] .fd-container.fd-form-layout-grid-container .fd-row .fd-col-xl>.fd-form-label{float:right;text-align:right}}.fd-section{-webkit-box-sizing:border-box;background-color:var(--sapToolbar_Background);border:0;border-bottom:none;box-sizing:border-box;color:var(--sapTextColor);font-family:var(--sapFontFamily);font-size:var(--sapFontSize);font-weight:400;forced-color-adjust:none;line-height:var(--sapContent_LineHeight);margin:0;padding:1rem .5rem 1.5rem}.fd-section:after,.fd-section:before{box-sizing:inherit;font-size:inherit}.fd-section:after{clear:both;content:\"\";display:table}@media (min-width: 600px){.fd-section{padding-left:2rem;padding-right:2rem}}@media (min-width: 1440px){.fd-section{padding-left:3rem;padding-right:3rem}}.fd-section--no-border,.fd-section:last-child{border-bottom:0}.fd-section--bleed,.fd-section--full-bleed{-webkit-box-sizing:border-box;border:0;box-sizing:border-box;color:var(--sapTextColor);font-family:var(--sapFontFamily);font-size:var(--sapFontSize);font-weight:400;forced-color-adjust:none;line-height:var(--sapContent_LineHeight);margin:0;padding:0}.fd-section--bleed:after,.fd-section--bleed:before,.fd-section--full-bleed:after,.fd-section--full-bleed:before{box-sizing:inherit;font-size:inherit}.fd-section--bleed .fd-section__footer,.fd-section--bleed .fd-section__header,.fd-section--full-bleed .fd-section__footer,.fd-section--full-bleed .fd-section__header{padding-left:.5rem;padding-right:.5rem}@media (min-width: 600px){.fd-section--bleed .fd-section__footer,.fd-section--bleed .fd-section__header,.fd-section--full-bleed .fd-section__footer,.fd-section--full-bleed .fd-section__header{padding-left:2rem;padding-right:2rem}}@media (min-width: 1440px){.fd-section--bleed .fd-section__footer,.fd-section--bleed .fd-section__header,.fd-section--full-bleed .fd-section__footer,.fd-section--full-bleed .fd-section__header{padding-left:3rem;padding-right:3rem}}.fd-section__header{-webkit-box-sizing:border-box;align-items:center;border:0;box-sizing:border-box;color:var(--sapTextColor);display:flex;font-family:var(--sapFontFamily);font-size:var(--sapFontSize);font-weight:400;forced-color-adjust:none;line-height:var(--sapContent_LineHeight);margin:0 0 1.5rem;min-height:1.5rem;padding:0}.fd-section__header:after,.fd-section__header:before{box-sizing:inherit;font-size:inherit}.fd-section__title{-webkit-box-sizing:border-box;-webkit-box-flex:1;-ms-flex:1;border:0;box-sizing:border-box;color:var(--sapTextColor);color:var(--sapTitleColor);flex:1;font-family:var(--sapFontFamily);font-size:var(--sapFontSize);font-size:var(--sapFontHeader2Size);font-weight:400;forced-color-adjust:none;line-height:var(--sapContent_LineHeight);line-height:2rem;margin:0;padding:0}.fd-section__title:after,.fd-section__title:before{box-sizing:inherit;font-size:inherit}.fd-section__actions{-webkit-box-sizing:border-box;border:0;box-sizing:border-box;color:var(--sapTextColor);font-family:var(--sapFontFamily);font-size:var(--sapFontSize);font-weight:400;forced-color-adjust:none;line-height:var(--sapContent_LineHeight);margin:0 0 0 auto;padding:0}.fd-section__actions:after,.fd-section__actions:before{box-sizing:inherit;font-size:inherit}.fd-section__footer{-webkit-box-sizing:border-box;-webkit-box-pack:center;-ms-flex-pack:center;border:0;box-sizing:border-box;color:var(--sapTextColor);display:flex;font-family:var(--sapFontFamily);font-size:var(--sapFontSize);font-weight:400;forced-color-adjust:none;justify-content:center;line-height:var(--sapContent_LineHeight);margin:0;padding:0}.fd-section__footer:after,.fd-section__footer:before{box-sizing:inherit;font-size:inherit}.fd-form-group{-webkit-box-sizing:border-box;border:0;box-sizing:border-box;color:var(--sapTextColor);font-family:var(--sapFontFamily);font-size:var(--sapFontSize);font-weight:400;forced-color-adjust:none;line-height:var(--sapContent_LineHeight);margin:0;padding:0}.fd-form-group:after,.fd-form-group:before{box-sizing:inherit;font-size:inherit}.fd-form-group--inline{-webkit-box-pack:start;-ms-flex-pack:start;-ms-flex-wrap:wrap;flex-direction:row;flex-wrap:wrap;justify-content:flex-start}.fd-form-group--inline,.fd-form-group__header{display:flex}.fd-form-group__header{-webkit-box-sizing:border-box;align-items:center;background-color:var(--sapGroup_TitleBackground);border:0;box-sizing:border-box;color:var(--sapTextColor);font-family:var(--sapFontFamily);font-size:var(--sapFontSize);font-weight:400;forced-color-adjust:none;height:2.75rem;line-height:var(--sapContent_LineHeight);margin:0;padding:0;width:100%}.fd-form-group__header:after,.fd-form-group__header:before{box-sizing:inherit;font-size:inherit}.fd-form-group__header[class*=-compact],.fd-form-group__header[class*=-condensed],[class*=-compact] .fd-form-group__header:not([class*=-cozy]),[class*=-condensed] .fd-form-group__header:not([class*=-cozy]){height:2rem}.fd-form-group__header-text{-webkit-box-sizing:border-box;border:0;box-sizing:border-box;color:var(--sapTextColor);color:var(--sapGroup_TitleTextColor);font-family:var(--sapFontFamily);font-family:var(--sapFontHeaderFamily);font-size:var(--sapFontSize);font-size:var(--sapFontHeader6Size);font-weight:400;font-weight:700;forced-color-adjust:none;line-height:var(--sapContent_LineHeight);margin:0;overflow:hidden;padding:0;text-overflow:ellipsis;white-space:nowrap}.fd-form-group__header-text:after,.fd-form-group__header-text:before{box-sizing:inherit;font-size:inherit}/*!\n * Fundamental Library Styles v0.30.2-rc.6\n * Copyright (c) 2023 SAP SE or an SAP affiliate company.\n * Licensed under Apache License 2.0 (https://github.com/SAP/fundamental-styles/blob/main/LICENSE)\n */.fd-form-header{-webkit-box-sizing:border-box;-webkit-box-align:center;-ms-flex-align:center;-webkit-box-shadow:0 var(--fdFormHeader_Border_Width) 0 var(--sapGroup_TitleBorderColor);align-items:center;background-color:var(--sapGroup_TitleBackground);border:0;box-shadow:0 var(--fdFormHeader_Border_Width) 0 var(--sapGroup_TitleBorderColor);box-sizing:border-box;color:var(--sapTextColor);display:flex;font-family:var(--sapFontFamily);font-size:var(--sapFontSize);font-weight:400;forced-color-adjust:none;height:2.75rem;line-height:var(--sapContent_LineHeight);margin:0;padding:0 1rem;width:100%}.fd-form-header:after,.fd-form-header:before{box-sizing:inherit;font-size:inherit}.fd-form-header__text{-webkit-box-sizing:border-box;border:0;box-sizing:border-box;color:var(--sapTextColor);color:var(--sapGroup_TitleTextColor);font-family:var(--sapFontFamily);font-family:var(--sapFontHeaderFamily);font-size:var(--sapFontSize);font-size:var(--sapFontHeader4Size);font-weight:400;forced-color-adjust:none;line-height:var(--sapContent_LineHeight);margin:0;overflow:hidden;padding:0;text-overflow:ellipsis;white-space:nowrap}.fd-form-header__text:after,.fd-form-header__text:before{box-sizing:inherit;font-size:inherit}fdp-form-group{display:block}.fd-form-label{overflow:hidden}\n"] }]
         }], ctorParameters: function () { return [{ type: i0.ChangeDetectorRef }, { type: i0.ElementRef }, { type: i1$1.ControlContainer, decorators: [{
                     type: Optional
-                }] }, { type: i5$2.ContentDensityObserver }, { type: undefined, decorators: [{
+                }] }, { type: i5$1.ContentDensityObserver }, { type: undefined, decorators: [{
                     type: Inject,
                     args: [FDP_FORM_FIELD_HINT_OPTIONS_DEFAULT]
                 }] }]; }, propDecorators: { id: [{
@@ -6227,12 +6170,13 @@ class FormFieldErrorHeadingDirective {
         this._formFieldErrorDirective?.registerHeading(this);
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.1.0", ngImport: i0, type: FormFieldErrorHeadingDirective, deps: [{ token: i0.TemplateRef }, { token: FDP_FORM_ERROR_DIRECTIVE, optional: true }], target: i0.ɵɵFactoryTarget.Directive }); }
-    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "16.1.0", type: FormFieldErrorHeadingDirective, selector: "[fdpFormFieldErrorHeading]", inputs: { fdpFormFieldErrorHeadingAs: "fdpFormFieldErrorHeadingAs", fdpFormFieldErrorHeadingType: "fdpFormFieldErrorHeadingType" }, ngImport: i0 }); }
+    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "16.1.0", type: FormFieldErrorHeadingDirective, isStandalone: true, selector: "[fdpFormFieldErrorHeading]", inputs: { fdpFormFieldErrorHeadingAs: "fdpFormFieldErrorHeadingAs", fdpFormFieldErrorHeadingType: "fdpFormFieldErrorHeadingType" }, ngImport: i0 }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.1.0", ngImport: i0, type: FormFieldErrorHeadingDirective, decorators: [{
             type: Directive,
             args: [{
-                    selector: '[fdpFormFieldErrorHeading]'
+                    selector: '[fdpFormFieldErrorHeading]',
+                    standalone: true
                 }]
         }], ctorParameters: function () { return [{ type: i0.TemplateRef }, { type: undefined, decorators: [{
                     type: Optional
@@ -6257,12 +6201,13 @@ class FormFieldErrorDescriptionDirective {
         this._formFieldErrorDirective?.registerDescription(this);
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.1.0", ngImport: i0, type: FormFieldErrorDescriptionDirective, deps: [{ token: i0.TemplateRef }, { token: FDP_FORM_ERROR_DIRECTIVE, optional: true }], target: i0.ɵɵFactoryTarget.Directive }); }
-    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "16.1.0", type: FormFieldErrorDescriptionDirective, selector: "[fdpFormFieldErrorDescription]", inputs: { fdpFormFieldErrorDescriptionAs: "fdpFormFieldErrorDescriptionAs" }, ngImport: i0 }); }
+    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "16.1.0", type: FormFieldErrorDescriptionDirective, isStandalone: true, selector: "[fdpFormFieldErrorDescription]", inputs: { fdpFormFieldErrorDescriptionAs: "fdpFormFieldErrorDescriptionAs" }, ngImport: i0 }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.1.0", ngImport: i0, type: FormFieldErrorDescriptionDirective, decorators: [{
             type: Directive,
             args: [{
-                    selector: '[fdpFormFieldErrorDescription]'
+                    selector: '[fdpFormFieldErrorDescription]',
+                    standalone: true
                 }]
         }], ctorParameters: function () { return [{ type: i0.TemplateRef }, { type: undefined, decorators: [{
                     type: Optional
@@ -6287,7 +6232,7 @@ const EXPORTABLE_DECLARATIONS = [
 ];
 class FdpFormGroupModule {
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.1.0", ngImport: i0, type: FdpFormGroupModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
-    static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "16.1.0", ngImport: i0, type: FdpFormGroupModule, declarations: [FormGroupComponent,
+    static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "16.1.0", ngImport: i0, type: FdpFormGroupModule, imports: [FormGroupComponent,
             FormFieldComponent,
             InputMessageGroupWithTemplate,
             FormFieldGroupComponent,
@@ -6296,15 +6241,7 @@ class FdpFormGroupModule {
             FieldGroupRowValuePipe,
             FormFieldErrorDirective,
             FormFieldErrorHeadingDirective,
-            FormFieldErrorDescriptionDirective], imports: [CommonModule,
-            FormsModule,
-            ReactiveFormsModule,
-            FormModule,
-            InlineHelpModule,
-            PopoverModule,
-            IconModule,
-            LinkModule,
-            ContentDensityModule], exports: [FormGroupComponent,
+            FormFieldErrorDescriptionDirective], exports: [FormGroupComponent,
             FormFieldComponent,
             InputMessageGroupWithTemplate,
             FormFieldGroupComponent,
@@ -6313,33 +6250,17 @@ class FdpFormGroupModule {
             FieldGroupRowValuePipe,
             FormFieldErrorDirective,
             FormFieldErrorHeadingDirective,
-            FormFieldErrorDescriptionDirective, ContentDensityModule] }); }
-    static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "16.1.0", ngImport: i0, type: FdpFormGroupModule, imports: [CommonModule,
-            FormsModule,
-            ReactiveFormsModule,
-            FormModule,
-            InlineHelpModule,
-            PopoverModule,
-            IconModule,
-            LinkModule,
-            ContentDensityModule, ContentDensityModule] }); }
+            FormFieldErrorDescriptionDirective] }); }
+    static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "16.1.0", ngImport: i0, type: FdpFormGroupModule, imports: [FormGroupComponent,
+            FormFieldComponent,
+            InputMessageGroupWithTemplate,
+            FormGroupHeaderComponent] }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.1.0", ngImport: i0, type: FdpFormGroupModule, decorators: [{
             type: NgModule,
             args: [{
-                    declarations: [...EXPORTABLE_DECLARATIONS],
-                    imports: [
-                        CommonModule,
-                        FormsModule,
-                        ReactiveFormsModule,
-                        FormModule,
-                        InlineHelpModule,
-                        PopoverModule,
-                        IconModule,
-                        LinkModule,
-                        ContentDensityModule
-                    ],
-                    exports: [...EXPORTABLE_DECLARATIONS, ContentDensityModule]
+                    imports: [...EXPORTABLE_DECLARATIONS],
+                    exports: [...EXPORTABLE_DECLARATIONS]
                 }]
         }] });
 
@@ -6452,16 +6373,29 @@ function getField(field) {
     return new Field(field.id, field.rank, field.renderer, field.column);
 }
 
+class PlatformAutoCompleteModule {
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.1.0", ngImport: i0, type: PlatformAutoCompleteModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
+    static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "16.1.0", ngImport: i0, type: PlatformAutoCompleteModule, imports: [AutoCompleteDirective], exports: [AutoCompleteDirective] }); }
+    static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "16.1.0", ngImport: i0, type: PlatformAutoCompleteModule }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.1.0", ngImport: i0, type: PlatformAutoCompleteModule, decorators: [{
+            type: NgModule,
+            args: [{
+                    imports: [AutoCompleteDirective],
+                    exports: [AutoCompleteDirective]
+                }]
+        }] });
+
 class PlatformCheckboxModule {
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.1.0", ngImport: i0, type: PlatformCheckboxModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
-    static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "16.1.0", ngImport: i0, type: PlatformCheckboxModule, imports: [PipeModule, FormItemModule, ContentDensityModule, CheckboxComponent], exports: [CheckboxComponent, ContentDensityModule] }); }
-    static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "16.1.0", ngImport: i0, type: PlatformCheckboxModule, imports: [PipeModule, FormItemModule, ContentDensityModule, CheckboxComponent, ContentDensityModule] }); }
+    static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "16.1.0", ngImport: i0, type: PlatformCheckboxModule, imports: [CheckboxComponent], exports: [CheckboxComponent] }); }
+    static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "16.1.0", ngImport: i0, type: PlatformCheckboxModule, imports: [CheckboxComponent] }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.1.0", ngImport: i0, type: PlatformCheckboxModule, decorators: [{
             type: NgModule,
             args: [{
-                    imports: [PipeModule, FormItemModule, ContentDensityModule, CheckboxComponent],
-                    exports: [CheckboxComponent, ContentDensityModule]
+                    imports: [CheckboxComponent],
+                    exports: [CheckboxComponent]
                 }]
         }] });
 
@@ -6681,9 +6615,17 @@ class BaseCombobox extends CollectionBaseInput {
         this.isOpen = isOpen;
         this.onTouched();
         this.openChange.next(isOpen);
+        this._onOpenChange(this.isOpen);
         this.cd.detectChanges();
     }
     /** @hidden */
+    _onOpenChange(isOpen) {
+        if (isOpen) {
+            this.formMessage._popover.close();
+        }
+        this.formMessage._popover.setIgnoreTriggers(isOpen);
+    }
+    /** @hidden */
     handleOptionItem(value) {
         if (value) {
             this.selectOptionItem(value);
@@ -7184,11 +7126,20 @@ class ComboboxMobileComponent extends MobileModeBase {
         });
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.1.0", ngImport: i0, type: ComboboxMobileComponent, deps: [{ token: i0.ElementRef }, { token: i1$2.DialogService }, { token: COMBOBOX_COMPONENT }, { token: MOBILE_MODE_CONFIG, optional: true }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.1.0", type: ComboboxMobileComponent, selector: "fdp-combobox-mobile", viewQueries: [{ propertyName: "dialogTemplate", first: true, predicate: ["dialogTemplate"], descendants: true }], usesInheritance: true, ngImport: i0, template: "<ng-template let-dialog let-dialogConfig=\"dialogConfig\" #dialogTemplate>\n    <fd-dialog [dialogConfig]=\"dialogConfig\" [dialogRef]=\"dialog\">\n        <fd-dialog-header>\n            <h1 fd-title *ngIf=\"mobileConfig?.title\">{{ mobileConfig.title }}</h1>\n            <button\n                fd-dialog-close-button\n                *ngIf=\"mobileConfig?.hasCloseButton\"\n                [mobile]=\"true\"\n                (click)=\"handleDismiss()\"\n            ></button>\n            <ng-template fdkTemplate=\"subheader\">\n                <div fd-bar-middle>\n                    <fd-bar-element [fullWidth]=\"true\">\n                        <ng-container *ngTemplateOutlet=\"childContent?.controlTemplate || null\"></ng-container>\n                    </fd-bar-element>\n                </div>\n            </ng-template>\n        </fd-dialog-header>\n\n        <fd-dialog-body>\n            <ng-container *ngTemplateOutlet=\"childContent?.listTemplate || null\"></ng-container>\n        </fd-dialog-body>\n\n        <fd-dialog-footer>\n            <fd-button-bar\n                *ngIf=\"mobileConfig.approveButtonText\"\n                fdType=\"emphasized\"\n                [label]=\"mobileConfig.approveButtonText!\"\n                (click)=\"handleApprove()\"\n            >\n            </fd-button-bar>\n            <fd-button-bar\n                *ngIf=\"mobileConfig?.cancelButtonText\"\n                [label]=\"mobileConfig.cancelButtonText!\"\n                (click)=\"handleDismiss()\"\n            >\n            </fd-button-bar>\n        </fd-dialog-footer>\n    </fd-dialog>\n</ng-template>\n", dependencies: [{ kind: "directive", type: i2$2.BarMiddleDirective, selector: "[fd-bar-middle]" }, { kind: "directive", type: i2$2.BarElementDirective, selector: "fd-bar-element", inputs: ["fullWidth"] }, { kind: "component", type: i2$2.ButtonBarComponent, selector: "fd-button-bar", inputs: ["fullWidth", "fdType", "title", "ariaLabel", "ariaLabelledby", "id"] }, { kind: "component", type: i1$2.DialogComponent, selector: "fd-dialog", inputs: ["class", "dialogRef", "dialogConfig"] }, { kind: "component", type: i1$2.DialogBodyComponent, selector: "fd-dialog-body" }, { kind: "component", type: i1$2.DialogFooterComponent, selector: "fd-dialog-footer" }, { kind: "component", type: i1$2.DialogHeaderComponent, selector: "fd-dialog-header" }, { kind: "component", type: i1$2.DialogCloseButtonComponent, selector: "[fd-dialog-close-button]", inputs: ["mobile", "title"] }, { kind: "component", type: i3$4.TitleComponent, selector: "h1[fd-title], h2[fd-title], h3[fd-title], h4[fd-title], h5[fd-title], h6[fd-title]", inputs: ["headerSize", "wrap"], exportAs: ["fd-title"] }, { kind: "directive", type: i3$2.TemplateDirective, selector: "[fdkTemplate]", inputs: ["fdkTemplate"] }, { kind: "directive", type: i3.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i3.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.1.0", type: ComboboxMobileComponent, isStandalone: true, selector: "fdp-combobox-mobile", viewQueries: [{ propertyName: "dialogTemplate", first: true, predicate: ["dialogTemplate"], descendants: true }], usesInheritance: true, ngImport: i0, template: "<ng-template let-dialog let-dialogConfig=\"dialogConfig\" #dialogTemplate>\n    <fd-dialog [dialogConfig]=\"dialogConfig\" [dialogRef]=\"dialog\">\n        <fd-dialog-header>\n            <h1 fd-title *ngIf=\"mobileConfig?.title\">{{ mobileConfig.title }}</h1>\n            <button\n                fd-dialog-close-button\n                *ngIf=\"mobileConfig?.hasCloseButton\"\n                [mobile]=\"true\"\n                (click)=\"handleDismiss()\"\n            ></button>\n            <ng-template fdkTemplate=\"subheader\">\n                <div fd-bar-middle>\n                    <fd-bar-element [fullWidth]=\"true\">\n                        <ng-container *ngTemplateOutlet=\"childContent?.controlTemplate || null\"></ng-container>\n                    </fd-bar-element>\n                </div>\n            </ng-template>\n        </fd-dialog-header>\n\n        <fd-dialog-body>\n            <ng-container *ngTemplateOutlet=\"childContent?.listTemplate || null\"></ng-container>\n        </fd-dialog-body>\n\n        <fd-dialog-footer>\n            <fd-button-bar\n                *ngIf=\"mobileConfig.approveButtonText\"\n                fdType=\"emphasized\"\n                [label]=\"mobileConfig.approveButtonText!\"\n                (click)=\"handleApprove()\"\n            >\n            </fd-button-bar>\n            <fd-button-bar\n                *ngIf=\"mobileConfig?.cancelButtonText\"\n                [label]=\"mobileConfig.cancelButtonText!\"\n                (click)=\"handleDismiss()\"\n            >\n            </fd-button-bar>\n        </fd-dialog-footer>\n    </fd-dialog>\n</ng-template>\n", dependencies: [{ kind: "ngmodule", type: DialogModule }, { kind: "component", type: i1$2.DialogComponent, selector: "fd-dialog", inputs: ["class", "dialogRef", "dialogConfig"] }, { kind: "component", type: i1$2.DialogBodyComponent, selector: "fd-dialog-body" }, { kind: "component", type: i1$2.DialogFooterComponent, selector: "fd-dialog-footer" }, { kind: "component", type: i1$2.DialogHeaderComponent, selector: "fd-dialog-header" }, { kind: "component", type: i1$2.DialogCloseButtonComponent, selector: "[fd-dialog-close-button]", inputs: ["mobile", "title"] }, { kind: "directive", type: i2$2.BarMiddleDirective, selector: "[fd-bar-middle]" }, { kind: "directive", type: i2$2.BarElementDirective, selector: "fd-bar-element", inputs: ["fullWidth"] }, { kind: "component", type: i2$2.ButtonBarComponent, selector: "fd-button-bar", inputs: ["fullWidth", "fdType", "title", "ariaLabel", "ariaLabelledby", "id"] }, { kind: "component", type: i3$3.TitleComponent, selector: "h1[fd-title], h2[fd-title], h3[fd-title], h4[fd-title], h5[fd-title], h6[fd-title]", inputs: ["headerSize", "wrap"], exportAs: ["fd-title"] }, { kind: "directive", type: i3$1.TemplateDirective, selector: "[fdkTemplate]", inputs: ["fdkTemplate"] }, { kind: "directive", type: NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "ngmodule", type: BarModule }, { kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.1.0", ngImport: i0, type: ComboboxMobileComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'fdp-combobox-mobile', changeDetection: ChangeDetectionStrategy.OnPush, encapsulation: ViewEncapsulation.None, template: "<ng-template let-dialog let-dialogConfig=\"dialogConfig\" #dialogTemplate>\n    <fd-dialog [dialogConfig]=\"dialogConfig\" [dialogRef]=\"dialog\">\n        <fd-dialog-header>\n            <h1 fd-title *ngIf=\"mobileConfig?.title\">{{ mobileConfig.title }}</h1>\n            <button\n                fd-dialog-close-button\n                *ngIf=\"mobileConfig?.hasCloseButton\"\n                [mobile]=\"true\"\n                (click)=\"handleDismiss()\"\n            ></button>\n            <ng-template fdkTemplate=\"subheader\">\n                <div fd-bar-middle>\n                    <fd-bar-element [fullWidth]=\"true\">\n                        <ng-container *ngTemplateOutlet=\"childContent?.controlTemplate || null\"></ng-container>\n                    </fd-bar-element>\n                </div>\n            </ng-template>\n        </fd-dialog-header>\n\n        <fd-dialog-body>\n            <ng-container *ngTemplateOutlet=\"childContent?.listTemplate || null\"></ng-container>\n        </fd-dialog-body>\n\n        <fd-dialog-footer>\n            <fd-button-bar\n                *ngIf=\"mobileConfig.approveButtonText\"\n                fdType=\"emphasized\"\n                [label]=\"mobileConfig.approveButtonText!\"\n                (click)=\"handleApprove()\"\n            >\n            </fd-button-bar>\n            <fd-button-bar\n                *ngIf=\"mobileConfig?.cancelButtonText\"\n                [label]=\"mobileConfig.cancelButtonText!\"\n                (click)=\"handleDismiss()\"\n            >\n            </fd-button-bar>\n        </fd-dialog-footer>\n    </fd-dialog>\n</ng-template>\n" }]
+            args: [{ selector: 'fdp-combobox-mobile', changeDetection: ChangeDetectionStrategy.OnPush, encapsulation: ViewEncapsulation.None, standalone: true, imports: [
+                        DialogModule,
+                        NgIf,
+                        TitleComponent,
+                        TemplateDirective,
+                        BarModule,
+                        NgTemplateOutlet,
+                        CdkScrollable,
+                        ScrollbarDirective
+                    ], template: "<ng-template let-dialog let-dialogConfig=\"dialogConfig\" #dialogTemplate>\n    <fd-dialog [dialogConfig]=\"dialogConfig\" [dialogRef]=\"dialog\">\n        <fd-dialog-header>\n            <h1 fd-title *ngIf=\"mobileConfig?.title\">{{ mobileConfig.title }}</h1>\n            <button\n                fd-dialog-close-button\n                *ngIf=\"mobileConfig?.hasCloseButton\"\n                [mobile]=\"true\"\n                (click)=\"handleDismiss()\"\n            ></button>\n            <ng-template fdkTemplate=\"subheader\">\n                <div fd-bar-middle>\n                    <fd-bar-element [fullWidth]=\"true\">\n                        <ng-container *ngTemplateOutlet=\"childContent?.controlTemplate || null\"></ng-container>\n                    </fd-bar-element>\n                </div>\n            </ng-template>\n        </fd-dialog-header>\n\n        <fd-dialog-body>\n            <ng-container *ngTemplateOutlet=\"childContent?.listTemplate || null\"></ng-container>\n        </fd-dialog-body>\n\n        <fd-dialog-footer>\n            <fd-button-bar\n                *ngIf=\"mobileConfig.approveButtonText\"\n                fdType=\"emphasized\"\n                [label]=\"mobileConfig.approveButtonText!\"\n                (click)=\"handleApprove()\"\n            >\n            </fd-button-bar>\n            <fd-button-bar\n                *ngIf=\"mobileConfig?.cancelButtonText\"\n                [label]=\"mobileConfig.cancelButtonText!\"\n                (click)=\"handleDismiss()\"\n            >\n            </fd-button-bar>\n        </fd-dialog-footer>\n    </fd-dialog>\n</ng-template>\n" }]
         }], ctorParameters: function () { return [{ type: i0.ElementRef }, { type: i1$2.DialogService }, { type: undefined, decorators: [{
                     type: Inject,
                     args: [COMBOBOX_COMPONENT]
@@ -7204,14 +7155,13 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.1.0", ngImpor
 
 class PlatformComboboxMobileModule {
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.1.0", ngImport: i0, type: PlatformComboboxMobileModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
-    static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "16.1.0", ngImport: i0, type: PlatformComboboxMobileModule, declarations: [ComboboxMobileComponent], imports: [BarModule, DialogModule, ButtonModule, CommonModule], exports: [ComboboxMobileComponent] }); }
-    static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "16.1.0", ngImport: i0, type: PlatformComboboxMobileModule, imports: [BarModule, DialogModule, ButtonModule, CommonModule] }); }
+    static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "16.1.0", ngImport: i0, type: PlatformComboboxMobileModule, imports: [ComboboxMobileComponent], exports: [ComboboxMobileComponent] }); }
+    static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "16.1.0", ngImport: i0, type: PlatformComboboxMobileModule, imports: [ComboboxMobileComponent] }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.1.0", ngImport: i0, type: PlatformComboboxMobileModule, decorators: [{
             type: NgModule,
             args: [{
-                    declarations: [ComboboxMobileComponent],
-                    imports: [BarModule, DialogModule, ButtonModule, CommonModule],
+                    imports: [ComboboxMobileComponent],
                     exports: [ComboboxMobileComponent]
                 }]
         }] });
@@ -7369,18 +7319,36 @@ class ComboboxComponent extends BaseCombobox {
         }, [])
             .find((item) => item.label === text);
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.1.0", ngImport: i0, type: ComboboxComponent, deps: [{ token: i0.ChangeDetectorRef }, { token: i0.ElementRef }, { token: i1$1.NgControl, optional: true, self: true }, { token: i1$1.ControlContainer, optional: true, skipSelf: true }, { token: i1$1.NgForm, optional: true, self: true }, { token: i1$2.DialogConfig, optional: true }, { token: i3$2.DynamicComponentService }, { token: i0.ViewContainerRef }, { token: i0.Injector }, { token: DATA_PROVIDERS, optional: true }, { token: ComboboxConfig }, { token: FD_FORM_FIELD, host: true, optional: true, skipSelf: true }, { token: FD_FORM_FIELD_CONTROL, host: true, optional: true, skipSelf: true }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.1.0", type: ComboboxComponent, selector: "fdp-combobox", outputs: { selectionChange: "selectionChange" }, providers: [
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.1.0", ngImport: i0, type: ComboboxComponent, deps: [{ token: i0.ChangeDetectorRef }, { token: i0.ElementRef }, { token: i1$1.NgControl, optional: true, self: true }, { token: i1$1.ControlContainer, optional: true, skipSelf: true }, { token: i1$1.NgForm, optional: true, self: true }, { token: i1$2.DialogConfig, optional: true }, { token: i3$1.DynamicComponentService }, { token: i0.ViewContainerRef }, { token: i0.Injector }, { token: DATA_PROVIDERS, optional: true }, { token: ComboboxConfig }, { token: FD_FORM_FIELD, host: true, optional: true, skipSelf: true }, { token: FD_FORM_FIELD_CONTROL, host: true, optional: true, skipSelf: true }], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.1.0", type: ComboboxComponent, isStandalone: true, selector: "fdp-combobox", outputs: { selectionChange: "selectionChange" }, providers: [
             { provide: FD_FORM_FIELD_CONTROL, useExisting: ComboboxComponent, multi: true },
             contentDensityObserverProviders()
-        ], viewQueries: [{ propertyName: "searchInputElement", first: true, predicate: ["searchInputElement"], descendants: true }, { propertyName: "controlTemplate", first: true, predicate: ["controlTemplate"], descendants: true }, { propertyName: "listTemplate", first: true, predicate: ["listTemplate"], descendants: true }], usesInheritance: true, ngImport: i0, template: "<ng-container *ngTemplateOutlet=\"mobile ? mobileTemplate : desktopTemplate\"></ng-container>\n\n<ng-template #desktopTemplate>\n    <fd-popover\n        [isOpen]=\"isOpen && _suggestions.length > 0\"\n        (isOpenChange)=\"isOpenChangeHandle($event)\"\n        [fillControlMode]=\"fillControlMode\"\n        [focusTrapped]=\"true\"\n        [triggers]=\"triggers\"\n        [disabled]=\"disabled || readonly\"\n        [maxWidth]=\"autoResize ? null : minWidth\"\n        [closeOnOutsideClick]=\"closeOnOutsideClick\"\n        additionalBodyClass=\"fdp-combobox__popover\"\n    >\n        <fd-popover-control>\n            <ng-container *ngTemplateOutlet=\"controlTemplate\"></ng-container>\n        </fd-popover-control>\n        <fd-popover-body [hidden]=\"_suggestions.length === 0\">\n            <ng-container *ngTemplateOutlet=\"listTemplate\"></ng-container>\n            <ng-content></ng-content>\n        </fd-popover-body>\n    </fd-popover>\n</ng-template>\n\n<ng-template #mobileTemplate>\n    <ng-container [ngTemplateOutlet]=\"controlTemplate\"></ng-container>\n</ng-template>\n\n<ng-template #controlTemplate>\n    <fd-form-input-message-group>\n        <fd-input-group\n            [id]=\"id + '-input-group-container'\"\n            [button]=\"!readonly\"\n            [glyph]=\"!readonly ? 'navigation-down-arrow' : ' '\"\n            [state]=\"mobile && isOpen ? null : state\"\n            [buttonFocusable]=\"buttonFocusable\"\n            [disabled]=\"disabled\"\n            [readonly]=\"readonly\"\n            [isControl]=\"true\"\n            (addOnButtonClicked)=\"onPrimaryButtonClick()\"\n            [isExpanded]=\"!mobile && isOpen && _suggestions.length > 0\"\n            [attr.aria-disabled]=\"disabled\"\n            [glyphAriaLabel]=\"ariaLabel\"\n            (click)=\"openInMobileMode()\"\n        >\n            <input\n                #searchInputElement\n                fdp-auto-complete\n                [options]=\"_suggestions\"\n                [inputText]=\"inputText\"\n                [mobile]=\"mobile\"\n                (onComplete)=\"_onCompleteTerm($event)\"\n                type=\"text\"\n                role=\"combobox\"\n                autocomplete=\"off\"\n                [attr.aria-label]=\"ariaLabel\"\n                [attr.aria-labelledby]=\"ariaLabelledBy\"\n                [attr.aria-autocomplete]=\"autoComplete && !mobile ? 'list' : null\"\n                [attr.aria-owns]=\"autoComplete && !mobile ? id + '-result' : null\"\n                [attr.aria-haspopup]=\"autoComplete && !mobile\"\n                [attr.aria-required]=\"required\"\n                fd-input-group-input\n                tabindex=\"0\"\n                [id]=\"id\"\n                [name]=\"name\"\n                (keydown)=\"onInputKeydownHandler($event)\"\n                [disabled]=\"disabled\"\n                [ngModel]=\"inputText\"\n                (ngModelChange)=\"searchTermChanged($event)\"\n                [placeholder]=\"placeholder\"\n                (focus)=\"onTouched()\"\n                (blur)=\"_onBlur($event)\"\n                [attr.aria-expanded]=\"isOpen && _suggestions.length > 0\"\n                [readonly]=\"readonly\"\n                [attr.aria-readonly]=\"readonly\"\n            />\n        </fd-input-group>\n        <div class=\"fdp-combobox__count-list-results\" role=\"status\" *ngIf=\"isOpen\">\n            <ng-container *ngIf=\"_flatSuggestions?.length || '0' as count\">\n                {{\n                    (count === 1\n                        ? 'platformCombobox.countListResultsSingular'\n                        : 'platformCombobox.countListResultsPlural'\n                    ) | fdTranslate : { count: count }\n                }}\n            </ng-container>\n        </div>\n        <fd-form-message\n            *ngIf=\"mobile || isOpen ? null : !!stateMessage\"\n            [type]=\"state\"\n            [innerHtml]=\"stateMessage\"\n        ></fd-form-message>\n    </fd-form-input-message-group>\n</ng-template>\n\n<ng-template #listTemplate>\n    <ul\n        fd-list\n        [hasMessage]=\"!!stateMessage\"\n        (focusEscapeList)=\"handleListFocusEscape($event)\"\n        [dropdownMode]=\"true\"\n        class=\"fdp-combobox__list {{ !!stateMessage && 'fdp-combobox__list--message' }}\"\n        [id]=\"id + '-result'\"\n        role=\"listbox\"\n        [byline]=\"byline\"\n        [attr.aria-labelledby]=\"id + '-search'\"\n        [style.maxHeight]=\"!mobile && maxHeight\"\n        [style.maxWidth]=\"autoResize && maxWidth + 'px'\"\n    >\n        <li\n            *ngIf=\"stateMessage\"\n            [attr.aria-label]=\"stateMessage\"\n            fd-list-message\n            tabindex=\"-1\"\n            role=\"presentation\"\n            [type]=\"state || 'default'\"\n            [innerHtml]=\"stateMessage\"\n        ></li>\n\n        <ng-content></ng-content>\n        <ng-container *ngIf=\"isGroup\">\n            <ng-container *ngFor=\"let group of _suggestions\">\n                <ng-container *ngIf=\"!groupItemTemplate\">\n                    <li fd-list-group-header role=\"option\">\n                        <span fd-list-title [attr.title]=\"group.label\">{{ group.label }}</span>\n                    </li>\n                </ng-container>\n\n                <ng-container *ngIf=\"groupItemTemplate\">\n                    <ng-container\n                        [ngTemplateOutlet]=\"groupItemTemplate\"\n                        [ngTemplateOutletContext]=\"{ $implicit: { label: group.label } }\"\n                    ></ng-container>\n                </ng-container>\n\n                <li\n                    *ngFor=\"let optionItem of group.children; let i = index\"\n                    (click)=\"handleOptionItem(optionItem)\"\n                    fd-list-item\n                    role=\"option\"\n                    [tabindex]=\"0\"\n                    (keyDown)=\"handlePressEnter($event, optionItem)\"\n                    [selected]=\"isSelectedOptionItem(optionItem)\"\n                >\n                    <ng-container\n                        [ngTemplateOutlet]=\"listItem\"\n                        [ngTemplateOutletContext]=\"{ optionItem: optionItem, index: i }\"\n                    ></ng-container>\n                </li>\n            </ng-container>\n        </ng-container>\n\n        <ng-container *ngIf=\"!isGroup\">\n            <li\n                *ngFor=\"let optionItem of _suggestions; let i = index\"\n                (click)=\"handleOptionItem(optionItem)\"\n                fd-list-item\n                role=\"option\"\n                [tabindex]=\"0\"\n                (keyDown)=\"handlePressEnter($event, optionItem)\"\n                [selected]=\"isSelectedOptionItem(optionItem)\"\n            >\n                <ng-container\n                    [ngTemplateOutlet]=\"listItem\"\n                    [ngTemplateOutletContext]=\"{ optionItem: optionItem, index: i }\"\n                ></ng-container>\n            </li>\n        </ng-container>\n    </ul>\n</ng-template>\n\n<ng-template let-optionItem=\"optionItem\" let-index=\"index\" #listItem>\n    <ng-container\n        *ngIf=\"isSelectedOptionItem(optionItem) && !!selectedItemTemplate\"\n        [ngTemplateOutlet]=\"selectedItemTemplate\"\n        [ngTemplateOutletContext]=\"{ $implicit: optionItem.value, index: index }\"\n    ></ng-container>\n\n    <ng-container *ngIf=\"!(isSelectedOptionItem(optionItem) && selectedItemTemplate)\">\n        <ng-container\n            [ngTemplateOutlet]=\"optionItemSource\"\n            [ngTemplateOutletContext]=\"{ optionItem: optionItem, index: index }\"\n        ></ng-container>\n\n        <ng-container\n            [ngTemplateOutlet]=\"secondaryTextSource\"\n            [ngTemplateOutletContext]=\"{ optionItem: optionItem }\"\n        ></ng-container>\n    </ng-container>\n</ng-template>\n\n<ng-template let-optionItem=\"optionItem\" let-index=\"index\" #optionItemSource>\n    <ng-container *ngIf=\"!optionItemTemplate\">\n        <span [attr.title]=\"optionItem.label\" [innerHTML]=\"optionItem.label | highlight : inputText\"></span>\n    </ng-container>\n\n    <ng-container *ngIf=\"optionItemTemplate\">\n        <ng-container\n            [ngTemplateOutlet]=\"optionItemTemplate\"\n            [ngTemplateOutletContext]=\"{ $implicit: optionItem.value, index: index }\"\n        ></ng-container>\n    </ng-container>\n</ng-template>\n\n<ng-template let-optionItem=\"optionItem\" #secondaryTextSource>\n    <ng-container *ngIf=\"showSecondaryText\">\n        <ng-container *ngIf=\"!secondaryItemTemplate\">\n            <span\n                [style.text-align]=\"secondaryTextAlignment\"\n                fd-list-secondary\n                [attr.title]=\"optionItem.secondaryText\"\n                [innerHTML]=\"optionItem.secondaryText | highlight : inputText\"\n            ></span>\n        </ng-container>\n\n        <ng-container *ngIf=\"secondaryItemTemplate\">\n            <ng-container\n                [ngTemplateOutlet]=\"secondaryItemTemplate\"\n                [ngTemplateOutletContext]=\"{ $implicit: optionItem.value }\"\n            ></ng-container>\n        </ng-container>\n    </ng-container>\n</ng-template>\n", styles: [".fdp-combobox__count-list-results{position:absolute;opacity:0;z-index:-1}.fdp-combobox__list .fd-list__item{justify-content:space-between}.fdp-combobox__list .fd-list__item span{overflow:hidden;text-overflow:ellipsis;width:100%}\n"], dependencies: [{ kind: "directive", type: i3.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i3.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i3.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: i1$1.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i1$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$1.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "component", type: i10.InputGroupComponent, selector: "fd-input-group", inputs: ["placement", "required", "inline", "placeholder", "addOnText", "buttonFocusable", "type", "glyph", "button", "disabled", "readonly", "state", "isControl", "showFocus", "isExpanded", "glyphAriaLabel", "iconTitle", "ariaLabelledBy"], outputs: ["addOnButtonClicked", "search"] }, { kind: "directive", type: i10.InputGroupInputDirective, selector: "[fdInputGroupInput], [fd-input-group-input]", inputs: ["class"] }, { kind: "component", type: i7$1.ListComponent, selector: "[fd-list], [fdList]", inputs: ["dropdownMode", "multiInputMode", "mobileMode", "hasMessage", "noBorder", "navigationIndicator", "selection", "keyboardSupport", "byline", "unreadIndicator"], outputs: ["focusEscapeList"] }, { kind: "component", type: i7$1.ListItemComponent, selector: "[fdListItem] ,[fd-list-item]", inputs: ["selected", "noData", "action", "interactive", "growing", "counter", "unread", "byline"], outputs: ["keyDown"] }, { kind: "directive", type: i7$1.ListTitleDirective, selector: "[fd-list-title], [fdListTitle]", inputs: ["wrap"] }, { kind: "directive", type: i7$1.ListGroupHeaderDirective, selector: "[fdListGroupHeader], [fd-list-group-header]", inputs: ["nativeElementId"], outputs: ["keyDown"] }, { kind: "directive", type: i7$1.ListSecondaryDirective, selector: "[fd-list-secondary], [fdListSecondary]", inputs: ["type"] }, { kind: "directive", type: i7$1.ListMessageDirective, selector: "[fd-list-message], [fdListMessage]", inputs: ["type", "class"] }, { kind: "component", type: i2.PopoverControlComponent, selector: "fd-popover-control" }, { kind: "component", type: i2.PopoverBodyComponent, selector: "fd-popover-body" }, { kind: "component", type: i2.PopoverComponent, selector: "fd-popover", inputs: ["title", "trigger", "fixedPosition", "id", "mobile", "mobileConfig"] }, { kind: "directive", type: AutoCompleteDirective, selector: "[fdp-auto-complete]", inputs: ["options", "inputText", "mobile"], outputs: ["onComplete"] }, { kind: "component", type: i4.FormMessageComponent, selector: "fd-form-message", inputs: ["type", "static", "embedded", "class"] }, { kind: "component", type: i4.FormInputMessageGroupComponent, selector: "fd-form-input-message-group", inputs: ["triggers", "closeOnOutsideClick", "fillControlMode", "noArrow", "closeOnEscapeKey", "placement", "placementContainer", "isOpen"], outputs: ["isOpenChange"] }, { kind: "pipe", type: i3$2.SearchHighlightPipe, name: "highlight" }, { kind: "pipe", type: i5$1.FdTranslatePipe, name: "fdTranslate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
+        ], viewQueries: [{ propertyName: "searchInputElement", first: true, predicate: ["searchInputElement"], descendants: true }, { propertyName: "controlTemplate", first: true, predicate: ["controlTemplate"], descendants: true }, { propertyName: "listTemplate", first: true, predicate: ["listTemplate"], descendants: true }], usesInheritance: true, ngImport: i0, template: "<ng-container *ngTemplateOutlet=\"mobile ? mobileTemplate : desktopTemplate\"></ng-container>\n\n<ng-template #desktopTemplate>\n    <fd-popover\n        [isOpen]=\"isOpen && _suggestions.length > 0\"\n        (isOpenChange)=\"isOpenChangeHandle($event)\"\n        [fillControlMode]=\"fillControlMode\"\n        [focusTrapped]=\"true\"\n        [triggers]=\"triggers\"\n        [disabled]=\"disabled || readonly\"\n        [maxWidth]=\"autoResize ? null : minWidth\"\n        [closeOnOutsideClick]=\"closeOnOutsideClick\"\n        additionalBodyClass=\"fdp-combobox__popover\"\n    >\n        <fd-popover-control>\n            <ng-container *ngTemplateOutlet=\"controlTemplate\"></ng-container>\n        </fd-popover-control>\n        <fd-popover-body [hidden]=\"_suggestions.length === 0\">\n            <ng-container *ngTemplateOutlet=\"listTemplate\"></ng-container>\n            <ng-content></ng-content>\n        </fd-popover-body>\n    </fd-popover>\n</ng-template>\n\n<ng-template #mobileTemplate>\n    <ng-container [ngTemplateOutlet]=\"controlTemplate\"></ng-container>\n</ng-template>\n\n<ng-template #controlTemplate>\n    <fd-form-input-message-group>\n        <fd-input-group\n            [id]=\"id + '-input-group-container'\"\n            [button]=\"!readonly\"\n            [glyph]=\"!readonly ? 'navigation-down-arrow' : ' '\"\n            [state]=\"mobile && isOpen ? null : state\"\n            [buttonFocusable]=\"buttonFocusable\"\n            [disabled]=\"disabled\"\n            [readonly]=\"readonly\"\n            [isControl]=\"true\"\n            (addOnButtonClicked)=\"onPrimaryButtonClick()\"\n            [isExpanded]=\"!mobile && isOpen && _suggestions.length > 0\"\n            [attr.aria-disabled]=\"disabled\"\n            [glyphAriaLabel]=\"ariaLabel\"\n            (click)=\"openInMobileMode()\"\n        >\n            <input\n                #searchInputElement\n                fdp-auto-complete\n                [options]=\"_suggestions\"\n                [inputText]=\"inputText\"\n                [mobile]=\"mobile\"\n                (onComplete)=\"_onCompleteTerm($event)\"\n                type=\"text\"\n                role=\"combobox\"\n                autocomplete=\"off\"\n                [attr.aria-label]=\"ariaLabel\"\n                [attr.aria-labelledby]=\"ariaLabelledBy\"\n                [attr.aria-autocomplete]=\"autoComplete && !mobile ? 'list' : null\"\n                [attr.aria-owns]=\"autoComplete && !mobile ? id + '-result' : null\"\n                [attr.aria-haspopup]=\"autoComplete && !mobile\"\n                [attr.aria-required]=\"required\"\n                fd-input-group-input\n                tabindex=\"0\"\n                [id]=\"id\"\n                [name]=\"name\"\n                (keydown)=\"onInputKeydownHandler($event)\"\n                [disabled]=\"disabled\"\n                [ngModel]=\"inputText\"\n                (ngModelChange)=\"searchTermChanged($event)\"\n                [placeholder]=\"placeholder\"\n                (focus)=\"onTouched()\"\n                (blur)=\"_onBlur($event)\"\n                [attr.aria-expanded]=\"isOpen && _suggestions.length > 0\"\n                [readonly]=\"readonly\"\n                [attr.aria-readonly]=\"readonly\"\n            />\n        </fd-input-group>\n        <div class=\"fdp-combobox__count-list-results\" role=\"status\" *ngIf=\"isOpen\">\n            <ng-container *ngIf=\"_flatSuggestions?.length || '0' as count\">\n                {{\n                    (count === 1\n                        ? 'platformCombobox.countListResultsSingular'\n                        : 'platformCombobox.countListResultsPlural'\n                    ) | fdTranslate : { count: count }\n                }}\n            </ng-container>\n        </div>\n        <fd-form-message\n            *ngIf=\"mobile || isOpen ? null : !!stateMessage\"\n            [type]=\"state\"\n            [innerHtml]=\"stateMessage\"\n        ></fd-form-message>\n    </fd-form-input-message-group>\n</ng-template>\n\n<ng-template #listTemplate>\n    <ul\n        fd-list\n        [hasMessage]=\"!!stateMessage\"\n        (focusEscapeList)=\"handleListFocusEscape($event)\"\n        [dropdownMode]=\"true\"\n        class=\"fdp-combobox__list\"\n        [hasMessage]=\"!!stateMessage || (!!advancedStateMessage?.hasErrors && !!advancedStateMessage?.template)\"\n        [id]=\"id + '-result'\"\n        role=\"listbox\"\n        [byline]=\"byline\"\n        [attr.aria-labelledby]=\"id + '-search'\"\n        [style.maxHeight]=\"!mobile && maxHeight\"\n        [style.maxWidth]=\"autoResize && maxWidth + 'px'\"\n    >\n        <li\n            *ngIf=\"stateMessage\"\n            [attr.aria-label]=\"stateMessage\"\n            fd-list-message\n            tabindex=\"-1\"\n            role=\"presentation\"\n            [type]=\"state || 'default'\"\n            [innerHtml]=\"stateMessage\"\n        ></li>\n\n        <li\n            *ngIf=\"advancedStateMessage?.hasErrors && advancedStateMessage?.template\"\n            fd-list-message\n            tabindex=\"-1\"\n            role=\"presentation\"\n            [type]=\"state || 'default'\"\n        >\n            <ng-template [ngTemplateOutlet]=\"advancedStateMessage!.template!\"></ng-template>\n        </li>\n\n        <ng-content></ng-content>\n        <ng-container *ngIf=\"isGroup\">\n            <ng-container *ngFor=\"let group of _suggestions\">\n                <ng-container *ngIf=\"!groupItemTemplate\">\n                    <li fd-list-group-header role=\"option\">\n                        <span fd-list-title [attr.title]=\"group.label\">{{ group.label }}</span>\n                    </li>\n                </ng-container>\n\n                <ng-container *ngIf=\"groupItemTemplate\">\n                    <ng-container\n                        [ngTemplateOutlet]=\"groupItemTemplate\"\n                        [ngTemplateOutletContext]=\"{ $implicit: { label: group.label } }\"\n                    ></ng-container>\n                </ng-container>\n\n                <li\n                    *ngFor=\"let optionItem of group.children; let i = index\"\n                    (click)=\"handleOptionItem(optionItem)\"\n                    fd-list-item\n                    role=\"option\"\n                    [tabindex]=\"0\"\n                    (keyDown)=\"handlePressEnter($event, optionItem)\"\n                    [selected]=\"isSelectedOptionItem(optionItem)\"\n                >\n                    <ng-container\n                        [ngTemplateOutlet]=\"listItem\"\n                        [ngTemplateOutletContext]=\"{ optionItem: optionItem, index: i }\"\n                    ></ng-container>\n                </li>\n            </ng-container>\n        </ng-container>\n\n        <ng-container *ngIf=\"!isGroup\">\n            <li\n                *ngFor=\"let optionItem of _suggestions; let i = index\"\n                (click)=\"handleOptionItem(optionItem)\"\n                fd-list-item\n                role=\"option\"\n                [tabindex]=\"0\"\n                (keyDown)=\"handlePressEnter($event, optionItem)\"\n                [selected]=\"isSelectedOptionItem(optionItem)\"\n            >\n                <ng-container\n                    [ngTemplateOutlet]=\"listItem\"\n                    [ngTemplateOutletContext]=\"{ optionItem: optionItem, index: i }\"\n                ></ng-container>\n            </li>\n        </ng-container>\n    </ul>\n</ng-template>\n\n<ng-template let-optionItem=\"optionItem\" let-index=\"index\" #listItem>\n    <ng-container\n        *ngIf=\"isSelectedOptionItem(optionItem) && !!selectedItemTemplate\"\n        [ngTemplateOutlet]=\"selectedItemTemplate\"\n        [ngTemplateOutletContext]=\"{ $implicit: optionItem.value, index: index }\"\n    ></ng-container>\n\n    <ng-container *ngIf=\"!(isSelectedOptionItem(optionItem) && selectedItemTemplate)\">\n        <ng-container\n            [ngTemplateOutlet]=\"optionItemSource\"\n            [ngTemplateOutletContext]=\"{ optionItem: optionItem, index: index }\"\n        ></ng-container>\n\n        <ng-container\n            [ngTemplateOutlet]=\"secondaryTextSource\"\n            [ngTemplateOutletContext]=\"{ optionItem: optionItem }\"\n        ></ng-container>\n    </ng-container>\n</ng-template>\n\n<ng-template let-optionItem=\"optionItem\" let-index=\"index\" #optionItemSource>\n    <ng-container *ngIf=\"!optionItemTemplate\">\n        <span [attr.title]=\"optionItem.label\" [innerHTML]=\"optionItem.label | highlight : inputText\"></span>\n    </ng-container>\n\n    <ng-container *ngIf=\"optionItemTemplate\">\n        <ng-container\n            [ngTemplateOutlet]=\"optionItemTemplate\"\n            [ngTemplateOutletContext]=\"{ $implicit: optionItem.value, index: index }\"\n        ></ng-container>\n    </ng-container>\n</ng-template>\n\n<ng-template let-optionItem=\"optionItem\" #secondaryTextSource>\n    <ng-container *ngIf=\"showSecondaryText\">\n        <ng-container *ngIf=\"!secondaryItemTemplate\">\n            <span\n                [style.text-align]=\"secondaryTextAlignment\"\n                fd-list-secondary\n                [attr.title]=\"optionItem.secondaryText\"\n                [innerHTML]=\"optionItem.secondaryText | highlight : inputText\"\n            ></span>\n        </ng-container>\n\n        <ng-container *ngIf=\"secondaryItemTemplate\">\n            <ng-container\n                [ngTemplateOutlet]=\"secondaryItemTemplate\"\n                [ngTemplateOutletContext]=\"{ $implicit: optionItem.value }\"\n            ></ng-container>\n        </ng-container>\n    </ng-container>\n</ng-template>\n", styles: [".fdp-combobox__count-list-results{position:absolute;opacity:0;z-index:-1}.fdp-combobox__list .fd-list__item{justify-content:space-between}.fdp-combobox__list .fd-list__item span{overflow:hidden;text-overflow:ellipsis;width:100%}\n"], dependencies: [{ kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: PopoverComponent, selector: "fd-popover", inputs: ["title", "trigger", "fixedPosition", "id", "mobile", "mobileConfig"] }, { kind: "component", type: PopoverControlComponent, selector: "fd-popover-control" }, { kind: "component", type: PopoverBodyComponent, selector: "fd-popover-body" }, { kind: "ngmodule", type: FormInputMessageGroupModule }, { kind: "component", type: i3.FormInputMessageGroupComponent, selector: "fd-form-input-message-group", inputs: ["triggers", "closeOnOutsideClick", "fillControlMode", "noArrow", "closeOnEscapeKey", "placement", "placementContainer", "isOpen"], outputs: ["isOpenChange"] }, { kind: "ngmodule", type: InputGroupModule }, { kind: "component", type: i6.InputGroupComponent, selector: "fd-input-group", inputs: ["placement", "required", "inline", "placeholder", "addOnText", "buttonFocusable", "type", "glyph", "button", "disabled", "readonly", "state", "isControl", "showFocus", "isExpanded", "glyphAriaLabel", "iconTitle", "ariaLabelledBy"], outputs: ["addOnButtonClicked", "search"] }, { kind: "directive", type: i6.InputGroupInputDirective, selector: "[fdInputGroupInput], [fd-input-group-input]", inputs: ["class"] }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1$1.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i1$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$1.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "directive", type: AutoCompleteDirective, selector: "[fdp-auto-complete]", inputs: ["options", "inputText", "mobile"], outputs: ["onComplete"] }, { kind: "directive", type: NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "ngmodule", type: FormMessageModule }, { kind: "component", type: i3.FormMessageComponent, selector: "fd-form-message", inputs: ["type", "static", "embedded", "class"] }, { kind: "ngmodule", type: ListModule }, { kind: "component", type: i7$1.ListComponent, selector: "[fd-list], [fdList]", inputs: ["dropdownMode", "multiInputMode", "mobileMode", "hasMessage", "noBorder", "navigationIndicator", "selection", "keyboardSupport", "byline", "unreadIndicator"], outputs: ["focusEscapeList"] }, { kind: "component", type: i7$1.ListItemComponent, selector: "[fdListItem] ,[fd-list-item]", inputs: ["selected", "noData", "action", "interactive", "growing", "counter", "unread", "byline"], outputs: ["keyDown"] }, { kind: "directive", type: i7$1.ListTitleDirective, selector: "[fd-list-title], [fdListTitle]", inputs: ["wrap"] }, { kind: "directive", type: i7$1.ListGroupHeaderDirective, selector: "[fdListGroupHeader], [fd-list-group-header]", inputs: ["nativeElementId"], outputs: ["keyDown"] }, { kind: "directive", type: i7$1.ListSecondaryDirective, selector: "[fd-list-secondary], [fdListSecondary]", inputs: ["type"] }, { kind: "directive", type: i7$1.ListMessageDirective, selector: "[fd-list-message], [fdListMessage]", inputs: ["type", "class"] }, { kind: "directive", type: NgFor, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "pipe", type: SearchHighlightPipe, name: "highlight" }, { kind: "pipe", type: FdTranslatePipe, name: "fdTranslate" }, { kind: "ngmodule", type: ContentDensityModule }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.1.0", ngImport: i0, type: ComboboxComponent, decorators: [{
             type: Component,
             args: [{ selector: 'fdp-combobox', changeDetection: ChangeDetectionStrategy.OnPush, encapsulation: ViewEncapsulation.None, providers: [
                         { provide: FD_FORM_FIELD_CONTROL, useExisting: ComboboxComponent, multi: true },
                         contentDensityObserverProviders()
-                    ], template: "<ng-container *ngTemplateOutlet=\"mobile ? mobileTemplate : desktopTemplate\"></ng-container>\n\n<ng-template #desktopTemplate>\n    <fd-popover\n        [isOpen]=\"isOpen && _suggestions.length > 0\"\n        (isOpenChange)=\"isOpenChangeHandle($event)\"\n        [fillControlMode]=\"fillControlMode\"\n        [focusTrapped]=\"true\"\n        [triggers]=\"triggers\"\n        [disabled]=\"disabled || readonly\"\n        [maxWidth]=\"autoResize ? null : minWidth\"\n        [closeOnOutsideClick]=\"closeOnOutsideClick\"\n        additionalBodyClass=\"fdp-combobox__popover\"\n    >\n        <fd-popover-control>\n            <ng-container *ngTemplateOutlet=\"controlTemplate\"></ng-container>\n        </fd-popover-control>\n        <fd-popover-body [hidden]=\"_suggestions.length === 0\">\n            <ng-container *ngTemplateOutlet=\"listTemplate\"></ng-container>\n            <ng-content></ng-content>\n        </fd-popover-body>\n    </fd-popover>\n</ng-template>\n\n<ng-template #mobileTemplate>\n    <ng-container [ngTemplateOutlet]=\"controlTemplate\"></ng-container>\n</ng-template>\n\n<ng-template #controlTemplate>\n    <fd-form-input-message-group>\n        <fd-input-group\n            [id]=\"id + '-input-group-container'\"\n            [button]=\"!readonly\"\n            [glyph]=\"!readonly ? 'navigation-down-arrow' : ' '\"\n            [state]=\"mobile && isOpen ? null : state\"\n            [buttonFocusable]=\"buttonFocusable\"\n            [disabled]=\"disabled\"\n            [readonly]=\"readonly\"\n            [isControl]=\"true\"\n            (addOnButtonClicked)=\"onPrimaryButtonClick()\"\n            [isExpanded]=\"!mobile && isOpen && _suggestions.length > 0\"\n            [attr.aria-disabled]=\"disabled\"\n            [glyphAriaLabel]=\"ariaLabel\"\n            (click)=\"openInMobileMode()\"\n        >\n            <input\n                #searchInputElement\n                fdp-auto-complete\n                [options]=\"_suggestions\"\n                [inputText]=\"inputText\"\n                [mobile]=\"mobile\"\n                (onComplete)=\"_onCompleteTerm($event)\"\n                type=\"text\"\n                role=\"combobox\"\n                autocomplete=\"off\"\n                [attr.aria-label]=\"ariaLabel\"\n                [attr.aria-labelledby]=\"ariaLabelledBy\"\n                [attr.aria-autocomplete]=\"autoComplete && !mobile ? 'list' : null\"\n                [attr.aria-owns]=\"autoComplete && !mobile ? id + '-result' : null\"\n                [attr.aria-haspopup]=\"autoComplete && !mobile\"\n                [attr.aria-required]=\"required\"\n                fd-input-group-input\n                tabindex=\"0\"\n                [id]=\"id\"\n                [name]=\"name\"\n                (keydown)=\"onInputKeydownHandler($event)\"\n                [disabled]=\"disabled\"\n                [ngModel]=\"inputText\"\n                (ngModelChange)=\"searchTermChanged($event)\"\n                [placeholder]=\"placeholder\"\n                (focus)=\"onTouched()\"\n                (blur)=\"_onBlur($event)\"\n                [attr.aria-expanded]=\"isOpen && _suggestions.length > 0\"\n                [readonly]=\"readonly\"\n                [attr.aria-readonly]=\"readonly\"\n            />\n        </fd-input-group>\n        <div class=\"fdp-combobox__count-list-results\" role=\"status\" *ngIf=\"isOpen\">\n            <ng-container *ngIf=\"_flatSuggestions?.length || '0' as count\">\n                {{\n                    (count === 1\n                        ? 'platformCombobox.countListResultsSingular'\n                        : 'platformCombobox.countListResultsPlural'\n                    ) | fdTranslate : { count: count }\n                }}\n            </ng-container>\n        </div>\n        <fd-form-message\n            *ngIf=\"mobile || isOpen ? null : !!stateMessage\"\n            [type]=\"state\"\n            [innerHtml]=\"stateMessage\"\n        ></fd-form-message>\n    </fd-form-input-message-group>\n</ng-template>\n\n<ng-template #listTemplate>\n    <ul\n        fd-list\n        [hasMessage]=\"!!stateMessage\"\n        (focusEscapeList)=\"handleListFocusEscape($event)\"\n        [dropdownMode]=\"true\"\n        class=\"fdp-combobox__list {{ !!stateMessage && 'fdp-combobox__list--message' }}\"\n        [id]=\"id + '-result'\"\n        role=\"listbox\"\n        [byline]=\"byline\"\n        [attr.aria-labelledby]=\"id + '-search'\"\n        [style.maxHeight]=\"!mobile && maxHeight\"\n        [style.maxWidth]=\"autoResize && maxWidth + 'px'\"\n    >\n        <li\n            *ngIf=\"stateMessage\"\n            [attr.aria-label]=\"stateMessage\"\n            fd-list-message\n            tabindex=\"-1\"\n            role=\"presentation\"\n            [type]=\"state || 'default'\"\n            [innerHtml]=\"stateMessage\"\n        ></li>\n\n        <ng-content></ng-content>\n        <ng-container *ngIf=\"isGroup\">\n            <ng-container *ngFor=\"let group of _suggestions\">\n                <ng-container *ngIf=\"!groupItemTemplate\">\n                    <li fd-list-group-header role=\"option\">\n                        <span fd-list-title [attr.title]=\"group.label\">{{ group.label }}</span>\n                    </li>\n                </ng-container>\n\n                <ng-container *ngIf=\"groupItemTemplate\">\n                    <ng-container\n                        [ngTemplateOutlet]=\"groupItemTemplate\"\n                        [ngTemplateOutletContext]=\"{ $implicit: { label: group.label } }\"\n                    ></ng-container>\n                </ng-container>\n\n                <li\n                    *ngFor=\"let optionItem of group.children; let i = index\"\n                    (click)=\"handleOptionItem(optionItem)\"\n                    fd-list-item\n                    role=\"option\"\n                    [tabindex]=\"0\"\n                    (keyDown)=\"handlePressEnter($event, optionItem)\"\n                    [selected]=\"isSelectedOptionItem(optionItem)\"\n                >\n                    <ng-container\n                        [ngTemplateOutlet]=\"listItem\"\n                        [ngTemplateOutletContext]=\"{ optionItem: optionItem, index: i }\"\n                    ></ng-container>\n                </li>\n            </ng-container>\n        </ng-container>\n\n        <ng-container *ngIf=\"!isGroup\">\n            <li\n                *ngFor=\"let optionItem of _suggestions; let i = index\"\n                (click)=\"handleOptionItem(optionItem)\"\n                fd-list-item\n                role=\"option\"\n                [tabindex]=\"0\"\n                (keyDown)=\"handlePressEnter($event, optionItem)\"\n                [selected]=\"isSelectedOptionItem(optionItem)\"\n            >\n                <ng-container\n                    [ngTemplateOutlet]=\"listItem\"\n                    [ngTemplateOutletContext]=\"{ optionItem: optionItem, index: i }\"\n                ></ng-container>\n            </li>\n        </ng-container>\n    </ul>\n</ng-template>\n\n<ng-template let-optionItem=\"optionItem\" let-index=\"index\" #listItem>\n    <ng-container\n        *ngIf=\"isSelectedOptionItem(optionItem) && !!selectedItemTemplate\"\n        [ngTemplateOutlet]=\"selectedItemTemplate\"\n        [ngTemplateOutletContext]=\"{ $implicit: optionItem.value, index: index }\"\n    ></ng-container>\n\n    <ng-container *ngIf=\"!(isSelectedOptionItem(optionItem) && selectedItemTemplate)\">\n        <ng-container\n            [ngTemplateOutlet]=\"optionItemSource\"\n            [ngTemplateOutletContext]=\"{ optionItem: optionItem, index: index }\"\n        ></ng-container>\n\n        <ng-container\n            [ngTemplateOutlet]=\"secondaryTextSource\"\n            [ngTemplateOutletContext]=\"{ optionItem: optionItem }\"\n        ></ng-container>\n    </ng-container>\n</ng-template>\n\n<ng-template let-optionItem=\"optionItem\" let-index=\"index\" #optionItemSource>\n    <ng-container *ngIf=\"!optionItemTemplate\">\n        <span [attr.title]=\"optionItem.label\" [innerHTML]=\"optionItem.label | highlight : inputText\"></span>\n    </ng-container>\n\n    <ng-container *ngIf=\"optionItemTemplate\">\n        <ng-container\n            [ngTemplateOutlet]=\"optionItemTemplate\"\n            [ngTemplateOutletContext]=\"{ $implicit: optionItem.value, index: index }\"\n        ></ng-container>\n    </ng-container>\n</ng-template>\n\n<ng-template let-optionItem=\"optionItem\" #secondaryTextSource>\n    <ng-container *ngIf=\"showSecondaryText\">\n        <ng-container *ngIf=\"!secondaryItemTemplate\">\n            <span\n                [style.text-align]=\"secondaryTextAlignment\"\n                fd-list-secondary\n                [attr.title]=\"optionItem.secondaryText\"\n                [innerHTML]=\"optionItem.secondaryText | highlight : inputText\"\n            ></span>\n        </ng-container>\n\n        <ng-container *ngIf=\"secondaryItemTemplate\">\n            <ng-container\n                [ngTemplateOutlet]=\"secondaryItemTemplate\"\n                [ngTemplateOutletContext]=\"{ $implicit: optionItem.value }\"\n            ></ng-container>\n        </ng-container>\n    </ng-container>\n</ng-template>\n", styles: [".fdp-combobox__count-list-results{position:absolute;opacity:0;z-index:-1}.fdp-combobox__list .fd-list__item{justify-content:space-between}.fdp-combobox__list .fd-list__item span{overflow:hidden;text-overflow:ellipsis;width:100%}\n"] }]
+                    ], standalone: true, imports: [
+                        NgTemplateOutlet,
+                        PopoverComponent,
+                        PopoverControlComponent,
+                        PopoverBodyComponent,
+                        FormInputMessageGroupModule,
+                        InputGroupModule,
+                        FormsModule,
+                        AutoCompleteDirective,
+                        NgIf,
+                        FormMessageModule,
+                        ListModule,
+                        NgFor,
+                        NgClass,
+                        ListSecondaryDirective,
+                        SearchHighlightPipe,
+                        FdTranslatePipe,
+                        ContentDensityModule
+                    ], template: "<ng-container *ngTemplateOutlet=\"mobile ? mobileTemplate : desktopTemplate\"></ng-container>\n\n<ng-template #desktopTemplate>\n    <fd-popover\n        [isOpen]=\"isOpen && _suggestions.length > 0\"\n        (isOpenChange)=\"isOpenChangeHandle($event)\"\n        [fillControlMode]=\"fillControlMode\"\n        [focusTrapped]=\"true\"\n        [triggers]=\"triggers\"\n        [disabled]=\"disabled || readonly\"\n        [maxWidth]=\"autoResize ? null : minWidth\"\n        [closeOnOutsideClick]=\"closeOnOutsideClick\"\n        additionalBodyClass=\"fdp-combobox__popover\"\n    >\n        <fd-popover-control>\n            <ng-container *ngTemplateOutlet=\"controlTemplate\"></ng-container>\n        </fd-popover-control>\n        <fd-popover-body [hidden]=\"_suggestions.length === 0\">\n            <ng-container *ngTemplateOutlet=\"listTemplate\"></ng-container>\n            <ng-content></ng-content>\n        </fd-popover-body>\n    </fd-popover>\n</ng-template>\n\n<ng-template #mobileTemplate>\n    <ng-container [ngTemplateOutlet]=\"controlTemplate\"></ng-container>\n</ng-template>\n\n<ng-template #controlTemplate>\n    <fd-form-input-message-group>\n        <fd-input-group\n            [id]=\"id + '-input-group-container'\"\n            [button]=\"!readonly\"\n            [glyph]=\"!readonly ? 'navigation-down-arrow' : ' '\"\n            [state]=\"mobile && isOpen ? null : state\"\n            [buttonFocusable]=\"buttonFocusable\"\n            [disabled]=\"disabled\"\n            [readonly]=\"readonly\"\n            [isControl]=\"true\"\n            (addOnButtonClicked)=\"onPrimaryButtonClick()\"\n            [isExpanded]=\"!mobile && isOpen && _suggestions.length > 0\"\n            [attr.aria-disabled]=\"disabled\"\n            [glyphAriaLabel]=\"ariaLabel\"\n            (click)=\"openInMobileMode()\"\n        >\n            <input\n                #searchInputElement\n                fdp-auto-complete\n                [options]=\"_suggestions\"\n                [inputText]=\"inputText\"\n                [mobile]=\"mobile\"\n                (onComplete)=\"_onCompleteTerm($event)\"\n                type=\"text\"\n                role=\"combobox\"\n                autocomplete=\"off\"\n                [attr.aria-label]=\"ariaLabel\"\n                [attr.aria-labelledby]=\"ariaLabelledBy\"\n                [attr.aria-autocomplete]=\"autoComplete && !mobile ? 'list' : null\"\n                [attr.aria-owns]=\"autoComplete && !mobile ? id + '-result' : null\"\n                [attr.aria-haspopup]=\"autoComplete && !mobile\"\n                [attr.aria-required]=\"required\"\n                fd-input-group-input\n                tabindex=\"0\"\n                [id]=\"id\"\n                [name]=\"name\"\n                (keydown)=\"onInputKeydownHandler($event)\"\n                [disabled]=\"disabled\"\n                [ngModel]=\"inputText\"\n                (ngModelChange)=\"searchTermChanged($event)\"\n                [placeholder]=\"placeholder\"\n                (focus)=\"onTouched()\"\n                (blur)=\"_onBlur($event)\"\n                [attr.aria-expanded]=\"isOpen && _suggestions.length > 0\"\n                [readonly]=\"readonly\"\n                [attr.aria-readonly]=\"readonly\"\n            />\n        </fd-input-group>\n        <div class=\"fdp-combobox__count-list-results\" role=\"status\" *ngIf=\"isOpen\">\n            <ng-container *ngIf=\"_flatSuggestions?.length || '0' as count\">\n                {{\n                    (count === 1\n                        ? 'platformCombobox.countListResultsSingular'\n                        : 'platformCombobox.countListResultsPlural'\n                    ) | fdTranslate : { count: count }\n                }}\n            </ng-container>\n        </div>\n        <fd-form-message\n            *ngIf=\"mobile || isOpen ? null : !!stateMessage\"\n            [type]=\"state\"\n            [innerHtml]=\"stateMessage\"\n        ></fd-form-message>\n    </fd-form-input-message-group>\n</ng-template>\n\n<ng-template #listTemplate>\n    <ul\n        fd-list\n        [hasMessage]=\"!!stateMessage\"\n        (focusEscapeList)=\"handleListFocusEscape($event)\"\n        [dropdownMode]=\"true\"\n        class=\"fdp-combobox__list\"\n        [hasMessage]=\"!!stateMessage || (!!advancedStateMessage?.hasErrors && !!advancedStateMessage?.template)\"\n        [id]=\"id + '-result'\"\n        role=\"listbox\"\n        [byline]=\"byline\"\n        [attr.aria-labelledby]=\"id + '-search'\"\n        [style.maxHeight]=\"!mobile && maxHeight\"\n        [style.maxWidth]=\"autoResize && maxWidth + 'px'\"\n    >\n        <li\n            *ngIf=\"stateMessage\"\n            [attr.aria-label]=\"stateMessage\"\n            fd-list-message\n            tabindex=\"-1\"\n            role=\"presentation\"\n            [type]=\"state || 'default'\"\n            [innerHtml]=\"stateMessage\"\n        ></li>\n\n        <li\n            *ngIf=\"advancedStateMessage?.hasErrors && advancedStateMessage?.template\"\n            fd-list-message\n            tabindex=\"-1\"\n            role=\"presentation\"\n            [type]=\"state || 'default'\"\n        >\n            <ng-template [ngTemplateOutlet]=\"advancedStateMessage!.template!\"></ng-template>\n        </li>\n\n        <ng-content></ng-content>\n        <ng-container *ngIf=\"isGroup\">\n            <ng-container *ngFor=\"let group of _suggestions\">\n                <ng-container *ngIf=\"!groupItemTemplate\">\n                    <li fd-list-group-header role=\"option\">\n                        <span fd-list-title [attr.title]=\"group.label\">{{ group.label }}</span>\n                    </li>\n                </ng-container>\n\n                <ng-container *ngIf=\"groupItemTemplate\">\n                    <ng-container\n                        [ngTemplateOutlet]=\"groupItemTemplate\"\n                        [ngTemplateOutletContext]=\"{ $implicit: { label: group.label } }\"\n                    ></ng-container>\n                </ng-container>\n\n                <li\n                    *ngFor=\"let optionItem of group.children; let i = index\"\n                    (click)=\"handleOptionItem(optionItem)\"\n                    fd-list-item\n                    role=\"option\"\n                    [tabindex]=\"0\"\n                    (keyDown)=\"handlePressEnter($event, optionItem)\"\n                    [selected]=\"isSelectedOptionItem(optionItem)\"\n                >\n                    <ng-container\n                        [ngTemplateOutlet]=\"listItem\"\n                        [ngTemplateOutletContext]=\"{ optionItem: optionItem, index: i }\"\n                    ></ng-container>\n                </li>\n            </ng-container>\n        </ng-container>\n\n        <ng-container *ngIf=\"!isGroup\">\n            <li\n                *ngFor=\"let optionItem of _suggestions; let i = index\"\n                (click)=\"handleOptionItem(optionItem)\"\n                fd-list-item\n                role=\"option\"\n                [tabindex]=\"0\"\n                (keyDown)=\"handlePressEnter($event, optionItem)\"\n                [selected]=\"isSelectedOptionItem(optionItem)\"\n            >\n                <ng-container\n                    [ngTemplateOutlet]=\"listItem\"\n                    [ngTemplateOutletContext]=\"{ optionItem: optionItem, index: i }\"\n                ></ng-container>\n            </li>\n        </ng-container>\n    </ul>\n</ng-template>\n\n<ng-template let-optionItem=\"optionItem\" let-index=\"index\" #listItem>\n    <ng-container\n        *ngIf=\"isSelectedOptionItem(optionItem) && !!selectedItemTemplate\"\n        [ngTemplateOutlet]=\"selectedItemTemplate\"\n        [ngTemplateOutletContext]=\"{ $implicit: optionItem.value, index: index }\"\n    ></ng-container>\n\n    <ng-container *ngIf=\"!(isSelectedOptionItem(optionItem) && selectedItemTemplate)\">\n        <ng-container\n            [ngTemplateOutlet]=\"optionItemSource\"\n            [ngTemplateOutletContext]=\"{ optionItem: optionItem, index: index }\"\n        ></ng-container>\n\n        <ng-container\n            [ngTemplateOutlet]=\"secondaryTextSource\"\n            [ngTemplateOutletContext]=\"{ optionItem: optionItem }\"\n        ></ng-container>\n    </ng-container>\n</ng-template>\n\n<ng-template let-optionItem=\"optionItem\" let-index=\"index\" #optionItemSource>\n    <ng-container *ngIf=\"!optionItemTemplate\">\n        <span [attr.title]=\"optionItem.label\" [innerHTML]=\"optionItem.label | highlight : inputText\"></span>\n    </ng-container>\n\n    <ng-container *ngIf=\"optionItemTemplate\">\n        <ng-container\n            [ngTemplateOutlet]=\"optionItemTemplate\"\n            [ngTemplateOutletContext]=\"{ $implicit: optionItem.value, index: index }\"\n        ></ng-container>\n    </ng-container>\n</ng-template>\n\n<ng-template let-optionItem=\"optionItem\" #secondaryTextSource>\n    <ng-container *ngIf=\"showSecondaryText\">\n        <ng-container *ngIf=\"!secondaryItemTemplate\">\n            <span\n                [style.text-align]=\"secondaryTextAlignment\"\n                fd-list-secondary\n                [attr.title]=\"optionItem.secondaryText\"\n                [innerHTML]=\"optionItem.secondaryText | highlight : inputText\"\n            ></span>\n        </ng-container>\n\n        <ng-container *ngIf=\"secondaryItemTemplate\">\n            <ng-container\n                [ngTemplateOutlet]=\"secondaryItemTemplate\"\n                [ngTemplateOutletContext]=\"{ $implicit: optionItem.value }\"\n            ></ng-container>\n        </ng-container>\n    </ng-container>\n</ng-template>\n", styles: [".fdp-combobox__count-list-results{position:absolute;opacity:0;z-index:-1}.fdp-combobox__list .fd-list__item{justify-content:space-between}.fdp-combobox__list .fd-list__item span{overflow:hidden;text-overflow:ellipsis;width:100%}\n"] }]
         }], ctorParameters: function () { return [{ type: i0.ChangeDetectorRef }, { type: i0.ElementRef }, { type: i1$1.NgControl, decorators: [{
                     type: Optional
                 }, {
@@ -7395,7 +7363,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.1.0", ngImpor
                     type: Self
                 }] }, { type: i1$2.DialogConfig, decorators: [{
                     type: Optional
-                }] }, { type: i3$2.DynamicComponentService }, { type: i0.ViewContainerRef }, { type: i0.Injector }, { type: Map, decorators: [{
+                }] }, { type: i3$1.DynamicComponentService }, { type: i0.ViewContainerRef }, { type: i0.Injector }, { type: Map, decorators: [{
                     type: Optional
                 }, {
                     type: Inject,
@@ -7433,48 +7401,14 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.1.0", ngImpor
 
 class PlatformComboboxModule {
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.1.0", ngImport: i0, type: PlatformComboboxModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
-    static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "16.1.0", ngImport: i0, type: PlatformComboboxModule, declarations: [ComboboxComponent], imports: [CommonModule,
-            FormsModule,
-            InputGroupModule,
-            PipeModule,
-            ListModule,
-            ButtonModule,
-            PopoverModule,
-            PlatformAutoCompleteModule,
-            FormModule,
-            I18nModule,
-            ContentDensityModule], exports: [ComboboxComponent, TemplateModule, ContentDensityModule] }); }
-    static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "16.1.0", ngImport: i0, type: PlatformComboboxModule, providers: [DynamicComponentService], imports: [CommonModule,
-            FormsModule,
-            InputGroupModule,
-            PipeModule,
-            ListModule,
-            ButtonModule,
-            PopoverModule,
-            PlatformAutoCompleteModule,
-            FormModule,
-            I18nModule,
-            ContentDensityModule, TemplateModule, ContentDensityModule] }); }
+    static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "16.1.0", ngImport: i0, type: PlatformComboboxModule, imports: [ComboboxComponent], exports: [ComboboxComponent] }); }
+    static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "16.1.0", ngImport: i0, type: PlatformComboboxModule, imports: [ComboboxComponent] }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.1.0", ngImport: i0, type: PlatformComboboxModule, decorators: [{
             type: NgModule,
             args: [{
-                    declarations: [ComboboxComponent],
-                    imports: [
-                        CommonModule,
-                        FormsModule,
-                        InputGroupModule,
-                        PipeModule,
-                        ListModule,
-                        ButtonModule,
-                        PopoverModule,
-                        PlatformAutoCompleteModule,
-                        FormModule,
-                        I18nModule,
-                        ContentDensityModule
-                    ],
-                    providers: [DynamicComponentService],
-                    exports: [ComboboxComponent, TemplateModule, ContentDensityModule]
+                    imports: [ComboboxComponent],
+                    exports: [ComboboxComponent]
                 }]
         }] });
 
@@ -8308,7 +8242,7 @@ class FormGeneratorComponent {
                 useFactory: (formGenerator) => formGenerator.doCheck$,
                 deps: [FormGeneratorComponent]
             }
-        ], viewQueries: [{ propertyName: "ngForm", first: true, predicate: NgForm, descendants: true }, { propertyName: "formGroup", first: true, predicate: FormGroupDirective, descendants: true }, { propertyName: "fields", predicate: FormGeneratorFieldComponent, descendants: true }], usesOnChanges: true, ngImport: i0, template: "<fd-busy-indicator *ngIf=\"_firstLoadingDone; else loadingTemplate\" [loading]=\"formLoading\" [block]=\"true\">\n    <fdp-form-group\n        *ngIf=\"form\"\n        [hint]=\"hint\"\n        [mainTitle]=\"mainTitle\"\n        [hideMainTItle]=\"hideMainTItle\"\n        [formGroup]=\"form\"\n        [columnLayout]=\"columnLayout\"\n        [labelColumnLayout]=\"labelColumnLayout\"\n        [fieldColumnLayout]=\"fieldColumnLayout\"\n        [gapColumnLayout]=\"gapColumnLayout\"\n        [unifiedLayout]=\"unifiedLayout\"\n        [inlineColumnLayout]=\"inlineColumnLayout\"\n        [useForm]=\"true\"\n    >\n        <ng-container *ngFor=\"let error of _errorModels; trackBy: _errorsTrackBy\">\n            <span *fdpFormFieldError=\"error.type; let directiveError\">\n                <ng-container *ngIf=\"_isAdvancedError(directiveError); else simpleErrorTemplate\">\n                    <ng-container *ngIf=\"directiveError.heading\">\n                        <span *fdpFormFieldErrorHeading=\"let validationError; type: directiveError.type\">\n                            {{ validationError.heading }}\n                        </span>\n                    </ng-container>\n                    <ng-container *ngIf=\"directiveError.description\">\n                        <span *fdpFormFieldErrorDescription=\"let validationError\">\n                            {{ validationError.description }}\n                        </span>\n                    </ng-container>\n                </ng-container>\n                <ng-template #simpleErrorTemplate>\n                    <span *fdpFormFieldErrorHeading=\"let validationError\">\n                        {{ error.value ? error.value : validationError }}\n                    </span>\n                </ng-template>\n            </span>\n        </ng-container>\n        <ng-container *ngFor=\"let field of formControlItems; trackBy: _trackFn\">\n            <ng-container\n                *ngTemplateOutlet=\"\n                    field.type === 'field' ? fieldRenderer : groupRenderer;\n                    context: { field: field, formFieldName: field.formItem.name, rank: field.formItem?.rank || 0 }\n                \"\n            ></ng-container>\n            <ng-template\n                #fieldRenderer\n                let-field=\"field\"\n                let-formFieldName=\"formFieldName\"\n                let-formGroupName=\"formGroupName\"\n                let-rank=\"rank\"\n            >\n                <ng-container\n                    *fdpDynamicFormControlField=\"field; show: shouldShowFields[field.formItem.name] !== false\"\n                >\n                    <fdp-form-generator-field\n                        [hintOptions]=\"field.formItem.guiOptions | getHintOptions\"\n                        [form]=\"form\"\n                        [shouldShow]=\"shouldShowFields[field.formItem.name] !== false\"\n                        [field]=\"field\"\n                        [formFieldName]=\"formFieldName\"\n                        [formGroupNamePath]=\"formGroupName\"\n                        [rank]=\"rank\"\n                    ></fdp-form-generator-field>\n                </ng-container>\n            </ng-template>\n            <ng-template #groupRenderer>\n                <fdp-form-field-group\n                    [hintOptions]=\"field.formItem.guiOptions | getHintOptions\"\n                    [label]=\"field.formItem.message || ''\"\n                    [labelColumnLayout]=\"field.formItem.guiOptions?.labelColumnLayout\"\n                    [fieldColumnLayout]=\"field.formItem.guiOptions?.fieldColumnLayout\"\n                    [gapColumnLayout]=\"field.formItem.guiOptions?.gapColumnLayout\"\n                    [formName]=\"field.formItem.name\"\n                >\n                    <ng-container *ngFor=\"let groupField of field | getOrderedFieldControls; trackBy: _groupTrackFn\">\n                        <ng-container\n                            *fdpDynamicFormControlField=\"\n                                groupField;\n                                show: shouldShowFields[groupField.formItem.name!] !== false\n                            \"\n                        >\n                            <fdp-form-generator-field\n                                [hintOptions]=\"groupField.formItem.guiOptions | getHintOptions\"\n                                [form]=\"form\"\n                                [field]=\"groupField\"\n                                [shouldShow]=\"shouldShowFields[groupField.formItem.name!] !== false\"\n                                [formFieldName]=\"groupField.formItem.name\"\n                                [formGroupNamePath]=\"field.formItem.name\"\n                                [rank]=\"groupField.formItem.rank || 0\"\n                            ></fdp-form-generator-field>\n                        </ng-container>\n                    </ng-container>\n                </fdp-form-field-group>\n            </ng-template>\n        </ng-container>\n        <fdp-form-field *ngIf=\"!noAdditionalContent\" [column]=\"1\" [rank]=\"formControlItems.length + 1\">\n            <!-- For user-defined elements, like submit button -->\n            <ng-content></ng-content>\n        </fdp-form-field>\n    </fdp-form-group>\n</fd-busy-indicator>\n\n<ng-template #loadingTemplate>\n    <fd-skeleton width=\"100%\" height=\"100px\" style=\"padding: 1rem\">\n        <svg:rect x=\"0\" y=\"0\" rx=\"4\" width=\"15%\" height=\"8\" />\n        <svg:rect x=\"0\" y=\"20\" rx=\"4\" width=\"25%\" height=\"16\" />\n\n        <svg:rect x=\"35%\" y=\"0\" rx=\"4\" width=\"15%\" height=\"8\" />\n        <svg:rect x=\"35%\" y=\"20\" rx=\"4\" width=\"25%\" height=\"16\" />\n\n        <svg:rect x=\"0\" y=\"60\" rx=\"4\" width=\"15%\" height=\"8\" />\n        <svg:rect x=\"0\" y=\"80\" rx=\"4\" width=\"25%\" height=\"16\" />\n    </fd-skeleton>\n</ng-template>\n", dependencies: [{ kind: "directive", type: NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "ngmodule", type: BusyIndicatorModule }, { kind: "component", type: i2$4.BusyIndicatorComponent, selector: "fd-busy-indicator", inputs: ["loading", "size", "block", "ariaLabel", "title", "label", "ariaLive"] }, { kind: "ngmodule", type: FdpFormGroupModule }, { kind: "component", type: FormGroupComponent, selector: "fdp-form-group", inputs: ["id", "name", "editable", "noLabelLayout", "class", "hint", "inlineColumnLayout", "labelColumnLayout", "fieldColumnLayout", "gapColumnLayout", "formGroup", "topTitle", "mainTitle", "hideMainTItle", "object", "i18Strings", "useForm", "columnLayout", "unifiedLayout"], outputs: ["onSubmit"] }, { kind: "component", type: FormFieldComponent, selector: "fdp-form-field", inputs: ["label", "id", "hint", "noLabelLayout", "validators", "rank", "placeholder", "column", "columnLayout", "labelColumnLayout", "fieldColumnLayout", "gapColumnLayout", "i18Strings", "required", "editable", "columns", "disabled", "colon", "formGroupContainer"], outputs: ["onChange", "onColumnChange"] }, { kind: "component", type: FormFieldGroupComponent, selector: "fdp-form-field-group", inputs: ["label", "formName", "formGroupContainer", "labelColumnLayout", "fieldColumnLayout", "gapColumnLayout", "hintOptions"] }, { kind: "directive", type: FormFieldErrorDirective, selector: "[fdpFormFieldError]", inputs: ["fdpFormFieldErrorAs", "fdpFormFieldError", "fdpFormFieldErrorType"] }, { kind: "directive", type: FormFieldErrorHeadingDirective, selector: "[fdpFormFieldErrorHeading]", inputs: ["fdpFormFieldErrorHeadingAs", "fdpFormFieldErrorHeadingType"] }, { kind: "directive", type: FormFieldErrorDescriptionDirective, selector: "[fdpFormFieldErrorDescription]", inputs: ["fdpFormFieldErrorDescriptionAs"] }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1$1.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i1$1.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: NgFor, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: DynamicFormControlFieldDirective, selector: "[fdpDynamicFormControlField]", inputs: ["fdpDynamicFormControlField", "fdpDynamicFormControlFieldShow"] }, { kind: "component", type: FormGeneratorFieldComponent, selector: "fdp-form-generator-field", inputs: ["field", "form", "i18n", "formFieldName", "formGroupNamePath", "rank", "shouldShow", "hintOptions"] }, { kind: "ngmodule", type: SkeletonModule }, { kind: "component", type: i10$1.SkeletonComponent, selector: "fd-skeleton", inputs: ["animated", "type", "textLines", "width", "height"] }, { kind: "pipe", type: GetOrderedFieldControlsPipe, name: "getOrderedFieldControls" }, { kind: "pipe", type: GetHintOptionsPipe, name: "getHintOptions" }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
+        ], viewQueries: [{ propertyName: "ngForm", first: true, predicate: NgForm, descendants: true }, { propertyName: "formGroup", first: true, predicate: FormGroupDirective, descendants: true }, { propertyName: "fields", predicate: FormGeneratorFieldComponent, descendants: true }], usesOnChanges: true, ngImport: i0, template: "<fd-busy-indicator *ngIf=\"_firstLoadingDone; else loadingTemplate\" [loading]=\"formLoading\" [block]=\"true\">\n    <fdp-form-group\n        *ngIf=\"form\"\n        [hint]=\"hint\"\n        [mainTitle]=\"mainTitle\"\n        [hideMainTItle]=\"hideMainTItle\"\n        [formGroup]=\"form\"\n        [columnLayout]=\"columnLayout\"\n        [labelColumnLayout]=\"labelColumnLayout\"\n        [fieldColumnLayout]=\"fieldColumnLayout\"\n        [gapColumnLayout]=\"gapColumnLayout\"\n        [unifiedLayout]=\"unifiedLayout\"\n        [inlineColumnLayout]=\"inlineColumnLayout\"\n        [useForm]=\"true\"\n    >\n        <ng-container *ngFor=\"let error of _errorModels; trackBy: _errorsTrackBy\">\n            <span *fdpFormFieldError=\"error.type; let directiveError\">\n                <ng-container *ngIf=\"_isAdvancedError(directiveError); else simpleErrorTemplate\">\n                    <ng-container *ngIf=\"directiveError.heading\">\n                        <span *fdpFormFieldErrorHeading=\"let validationError; type: directiveError.type\">\n                            {{ validationError.heading }}\n                        </span>\n                    </ng-container>\n                    <ng-container *ngIf=\"directiveError.description\">\n                        <span *fdpFormFieldErrorDescription=\"let validationError\">\n                            {{ validationError.description }}\n                        </span>\n                    </ng-container>\n                </ng-container>\n                <ng-template #simpleErrorTemplate>\n                    <span *fdpFormFieldErrorHeading=\"let validationError\">\n                        {{ error.value ? error.value : validationError }}\n                    </span>\n                </ng-template>\n            </span>\n        </ng-container>\n        <ng-container *ngFor=\"let field of formControlItems; trackBy: _trackFn\">\n            <ng-container\n                *ngTemplateOutlet=\"\n                    field.type === 'field' ? fieldRenderer : groupRenderer;\n                    context: { field: field, formFieldName: field.formItem.name, rank: field.formItem?.rank || 0 }\n                \"\n            ></ng-container>\n            <ng-template\n                #fieldRenderer\n                let-field=\"field\"\n                let-formFieldName=\"formFieldName\"\n                let-formGroupName=\"formGroupName\"\n                let-rank=\"rank\"\n            >\n                <ng-container\n                    *fdpDynamicFormControlField=\"field; show: shouldShowFields[field.formItem.name] !== false\"\n                >\n                    <fdp-form-generator-field\n                        [hintOptions]=\"field.formItem.guiOptions | getHintOptions\"\n                        [form]=\"form\"\n                        [shouldShow]=\"shouldShowFields[field.formItem.name] !== false\"\n                        [field]=\"field\"\n                        [formFieldName]=\"formFieldName\"\n                        [formGroupNamePath]=\"formGroupName\"\n                        [rank]=\"rank\"\n                    ></fdp-form-generator-field>\n                </ng-container>\n            </ng-template>\n            <ng-template #groupRenderer>\n                <fdp-form-field-group\n                    [hintOptions]=\"field.formItem.guiOptions | getHintOptions\"\n                    [label]=\"field.formItem.message || ''\"\n                    [labelColumnLayout]=\"field.formItem.guiOptions?.labelColumnLayout\"\n                    [fieldColumnLayout]=\"field.formItem.guiOptions?.fieldColumnLayout\"\n                    [gapColumnLayout]=\"field.formItem.guiOptions?.gapColumnLayout\"\n                    [formName]=\"field.formItem.name\"\n                >\n                    <ng-container *ngFor=\"let groupField of field | getOrderedFieldControls; trackBy: _groupTrackFn\">\n                        <ng-container\n                            *fdpDynamicFormControlField=\"\n                                groupField;\n                                show: shouldShowFields[groupField.formItem.name!] !== false\n                            \"\n                        >\n                            <fdp-form-generator-field\n                                [hintOptions]=\"groupField.formItem.guiOptions | getHintOptions\"\n                                [form]=\"form\"\n                                [field]=\"groupField\"\n                                [shouldShow]=\"shouldShowFields[groupField.formItem.name!] !== false\"\n                                [formFieldName]=\"groupField.formItem.name\"\n                                [formGroupNamePath]=\"field.formItem.name\"\n                                [rank]=\"groupField.formItem.rank || 0\"\n                            ></fdp-form-generator-field>\n                        </ng-container>\n                    </ng-container>\n                </fdp-form-field-group>\n            </ng-template>\n        </ng-container>\n        <fdp-form-field *ngIf=\"!noAdditionalContent\" [column]=\"1\" [rank]=\"formControlItems.length + 1\">\n            <!-- For user-defined elements, like submit button -->\n            <ng-content></ng-content>\n        </fdp-form-field>\n    </fdp-form-group>\n</fd-busy-indicator>\n\n<ng-template #loadingTemplate>\n    <fd-skeleton width=\"100%\" height=\"100px\" [style.padding.rem]=\"1\">\n        <svg:rect x=\"0\" y=\"0\" rx=\"4\" width=\"15%\" height=\"8\" />\n        <svg:rect x=\"0\" y=\"20\" rx=\"4\" width=\"25%\" height=\"16\" />\n\n        <svg:rect x=\"35%\" y=\"0\" rx=\"4\" width=\"15%\" height=\"8\" />\n        <svg:rect x=\"35%\" y=\"20\" rx=\"4\" width=\"25%\" height=\"16\" />\n\n        <svg:rect x=\"0\" y=\"60\" rx=\"4\" width=\"15%\" height=\"8\" />\n        <svg:rect x=\"0\" y=\"80\" rx=\"4\" width=\"25%\" height=\"16\" />\n    </fd-skeleton>\n</ng-template>\n", dependencies: [{ kind: "directive", type: NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "ngmodule", type: BusyIndicatorModule }, { kind: "component", type: i2$4.BusyIndicatorComponent, selector: "fd-busy-indicator", inputs: ["loading", "size", "block", "ariaLabel", "title", "label", "ariaLive"] }, { kind: "ngmodule", type: FdpFormGroupModule }, { kind: "component", type: FormGroupComponent, selector: "fdp-form-group", inputs: ["id", "name", "editable", "noLabelLayout", "class", "hint", "inlineColumnLayout", "labelColumnLayout", "fieldColumnLayout", "gapColumnLayout", "formGroup", "topTitle", "mainTitle", "hideMainTItle", "object", "i18Strings", "useForm", "columnLayout", "unifiedLayout"], outputs: ["onSubmit"] }, { kind: "component", type: FormFieldComponent, selector: "fdp-form-field", inputs: ["label", "id", "hint", "noLabelLayout", "validators", "rank", "placeholder", "column", "columnLayout", "labelColumnLayout", "fieldColumnLayout", "gapColumnLayout", "i18Strings", "required", "editable", "columns", "disabled", "colon", "formGroupContainer"], outputs: ["onChange", "onColumnChange"] }, { kind: "component", type: FormFieldGroupComponent, selector: "fdp-form-field-group", inputs: ["label", "formName", "formGroupContainer", "labelColumnLayout", "fieldColumnLayout", "gapColumnLayout", "hintOptions"] }, { kind: "directive", type: FormFieldErrorDirective, selector: "[fdpFormFieldError]", inputs: ["fdpFormFieldErrorAs", "fdpFormFieldError", "fdpFormFieldErrorType"] }, { kind: "directive", type: FormFieldErrorHeadingDirective, selector: "[fdpFormFieldErrorHeading]", inputs: ["fdpFormFieldErrorHeadingAs", "fdpFormFieldErrorHeadingType"] }, { kind: "directive", type: FormFieldErrorDescriptionDirective, selector: "[fdpFormFieldErrorDescription]", inputs: ["fdpFormFieldErrorDescriptionAs"] }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1$1.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i1$1.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: NgFor, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: DynamicFormControlFieldDirective, selector: "[fdpDynamicFormControlField]", inputs: ["fdpDynamicFormControlField", "fdpDynamicFormControlFieldShow"] }, { kind: "component", type: FormGeneratorFieldComponent, selector: "fdp-form-generator-field", inputs: ["field", "form", "i18n", "formFieldName", "formGroupNamePath", "rank", "shouldShow", "hintOptions"] }, { kind: "ngmodule", type: SkeletonModule }, { kind: "component", type: i10.SkeletonComponent, selector: "fd-skeleton", inputs: ["animated", "type", "textLines", "width", "height"] }, { kind: "pipe", type: GetOrderedFieldControlsPipe, name: "getOrderedFieldControls" }, { kind: "pipe", type: GetHintOptionsPipe, name: "getHintOptions" }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.1.0", ngImport: i0, type: FormGeneratorComponent, decorators: [{
             type: Component,
@@ -8331,7 +8265,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.1.0", ngImpor
                         SkeletonModule,
                         GetOrderedFieldControlsPipe,
                         GetHintOptionsPipe
-                    ], template: "<fd-busy-indicator *ngIf=\"_firstLoadingDone; else loadingTemplate\" [loading]=\"formLoading\" [block]=\"true\">\n    <fdp-form-group\n        *ngIf=\"form\"\n        [hint]=\"hint\"\n        [mainTitle]=\"mainTitle\"\n        [hideMainTItle]=\"hideMainTItle\"\n        [formGroup]=\"form\"\n        [columnLayout]=\"columnLayout\"\n        [labelColumnLayout]=\"labelColumnLayout\"\n        [fieldColumnLayout]=\"fieldColumnLayout\"\n        [gapColumnLayout]=\"gapColumnLayout\"\n        [unifiedLayout]=\"unifiedLayout\"\n        [inlineColumnLayout]=\"inlineColumnLayout\"\n        [useForm]=\"true\"\n    >\n        <ng-container *ngFor=\"let error of _errorModels; trackBy: _errorsTrackBy\">\n            <span *fdpFormFieldError=\"error.type; let directiveError\">\n                <ng-container *ngIf=\"_isAdvancedError(directiveError); else simpleErrorTemplate\">\n                    <ng-container *ngIf=\"directiveError.heading\">\n                        <span *fdpFormFieldErrorHeading=\"let validationError; type: directiveError.type\">\n                            {{ validationError.heading }}\n                        </span>\n                    </ng-container>\n                    <ng-container *ngIf=\"directiveError.description\">\n                        <span *fdpFormFieldErrorDescription=\"let validationError\">\n                            {{ validationError.description }}\n                        </span>\n                    </ng-container>\n                </ng-container>\n                <ng-template #simpleErrorTemplate>\n                    <span *fdpFormFieldErrorHeading=\"let validationError\">\n                        {{ error.value ? error.value : validationError }}\n                    </span>\n                </ng-template>\n            </span>\n        </ng-container>\n        <ng-container *ngFor=\"let field of formControlItems; trackBy: _trackFn\">\n            <ng-container\n                *ngTemplateOutlet=\"\n                    field.type === 'field' ? fieldRenderer : groupRenderer;\n                    context: { field: field, formFieldName: field.formItem.name, rank: field.formItem?.rank || 0 }\n                \"\n            ></ng-container>\n            <ng-template\n                #fieldRenderer\n                let-field=\"field\"\n                let-formFieldName=\"formFieldName\"\n                let-formGroupName=\"formGroupName\"\n                let-rank=\"rank\"\n            >\n                <ng-container\n                    *fdpDynamicFormControlField=\"field; show: shouldShowFields[field.formItem.name] !== false\"\n                >\n                    <fdp-form-generator-field\n                        [hintOptions]=\"field.formItem.guiOptions | getHintOptions\"\n                        [form]=\"form\"\n                        [shouldShow]=\"shouldShowFields[field.formItem.name] !== false\"\n                        [field]=\"field\"\n                        [formFieldName]=\"formFieldName\"\n                        [formGroupNamePath]=\"formGroupName\"\n                        [rank]=\"rank\"\n                    ></fdp-form-generator-field>\n                </ng-container>\n            </ng-template>\n            <ng-template #groupRenderer>\n                <fdp-form-field-group\n                    [hintOptions]=\"field.formItem.guiOptions | getHintOptions\"\n                    [label]=\"field.formItem.message || ''\"\n                    [labelColumnLayout]=\"field.formItem.guiOptions?.labelColumnLayout\"\n                    [fieldColumnLayout]=\"field.formItem.guiOptions?.fieldColumnLayout\"\n                    [gapColumnLayout]=\"field.formItem.guiOptions?.gapColumnLayout\"\n                    [formName]=\"field.formItem.name\"\n                >\n                    <ng-container *ngFor=\"let groupField of field | getOrderedFieldControls; trackBy: _groupTrackFn\">\n                        <ng-container\n                            *fdpDynamicFormControlField=\"\n                                groupField;\n                                show: shouldShowFields[groupField.formItem.name!] !== false\n                            \"\n                        >\n                            <fdp-form-generator-field\n                                [hintOptions]=\"groupField.formItem.guiOptions | getHintOptions\"\n                                [form]=\"form\"\n                                [field]=\"groupField\"\n                                [shouldShow]=\"shouldShowFields[groupField.formItem.name!] !== false\"\n                                [formFieldName]=\"groupField.formItem.name\"\n                                [formGroupNamePath]=\"field.formItem.name\"\n                                [rank]=\"groupField.formItem.rank || 0\"\n                            ></fdp-form-generator-field>\n                        </ng-container>\n                    </ng-container>\n                </fdp-form-field-group>\n            </ng-template>\n        </ng-container>\n        <fdp-form-field *ngIf=\"!noAdditionalContent\" [column]=\"1\" [rank]=\"formControlItems.length + 1\">\n            <!-- For user-defined elements, like submit button -->\n            <ng-content></ng-content>\n        </fdp-form-field>\n    </fdp-form-group>\n</fd-busy-indicator>\n\n<ng-template #loadingTemplate>\n    <fd-skeleton width=\"100%\" height=\"100px\" style=\"padding: 1rem\">\n        <svg:rect x=\"0\" y=\"0\" rx=\"4\" width=\"15%\" height=\"8\" />\n        <svg:rect x=\"0\" y=\"20\" rx=\"4\" width=\"25%\" height=\"16\" />\n\n        <svg:rect x=\"35%\" y=\"0\" rx=\"4\" width=\"15%\" height=\"8\" />\n        <svg:rect x=\"35%\" y=\"20\" rx=\"4\" width=\"25%\" height=\"16\" />\n\n        <svg:rect x=\"0\" y=\"60\" rx=\"4\" width=\"15%\" height=\"8\" />\n        <svg:rect x=\"0\" y=\"80\" rx=\"4\" width=\"25%\" height=\"16\" />\n    </fd-skeleton>\n</ng-template>\n" }]
+                    ], template: "<fd-busy-indicator *ngIf=\"_firstLoadingDone; else loadingTemplate\" [loading]=\"formLoading\" [block]=\"true\">\n    <fdp-form-group\n        *ngIf=\"form\"\n        [hint]=\"hint\"\n        [mainTitle]=\"mainTitle\"\n        [hideMainTItle]=\"hideMainTItle\"\n        [formGroup]=\"form\"\n        [columnLayout]=\"columnLayout\"\n        [labelColumnLayout]=\"labelColumnLayout\"\n        [fieldColumnLayout]=\"fieldColumnLayout\"\n        [gapColumnLayout]=\"gapColumnLayout\"\n        [unifiedLayout]=\"unifiedLayout\"\n        [inlineColumnLayout]=\"inlineColumnLayout\"\n        [useForm]=\"true\"\n    >\n        <ng-container *ngFor=\"let error of _errorModels; trackBy: _errorsTrackBy\">\n            <span *fdpFormFieldError=\"error.type; let directiveError\">\n                <ng-container *ngIf=\"_isAdvancedError(directiveError); else simpleErrorTemplate\">\n                    <ng-container *ngIf=\"directiveError.heading\">\n                        <span *fdpFormFieldErrorHeading=\"let validationError; type: directiveError.type\">\n                            {{ validationError.heading }}\n                        </span>\n                    </ng-container>\n                    <ng-container *ngIf=\"directiveError.description\">\n                        <span *fdpFormFieldErrorDescription=\"let validationError\">\n                            {{ validationError.description }}\n                        </span>\n                    </ng-container>\n                </ng-container>\n                <ng-template #simpleErrorTemplate>\n                    <span *fdpFormFieldErrorHeading=\"let validationError\">\n                        {{ error.value ? error.value : validationError }}\n                    </span>\n                </ng-template>\n            </span>\n        </ng-container>\n        <ng-container *ngFor=\"let field of formControlItems; trackBy: _trackFn\">\n            <ng-container\n                *ngTemplateOutlet=\"\n                    field.type === 'field' ? fieldRenderer : groupRenderer;\n                    context: { field: field, formFieldName: field.formItem.name, rank: field.formItem?.rank || 0 }\n                \"\n            ></ng-container>\n            <ng-template\n                #fieldRenderer\n                let-field=\"field\"\n                let-formFieldName=\"formFieldName\"\n                let-formGroupName=\"formGroupName\"\n                let-rank=\"rank\"\n            >\n                <ng-container\n                    *fdpDynamicFormControlField=\"field; show: shouldShowFields[field.formItem.name] !== false\"\n                >\n                    <fdp-form-generator-field\n                        [hintOptions]=\"field.formItem.guiOptions | getHintOptions\"\n                        [form]=\"form\"\n                        [shouldShow]=\"shouldShowFields[field.formItem.name] !== false\"\n                        [field]=\"field\"\n                        [formFieldName]=\"formFieldName\"\n                        [formGroupNamePath]=\"formGroupName\"\n                        [rank]=\"rank\"\n                    ></fdp-form-generator-field>\n                </ng-container>\n            </ng-template>\n            <ng-template #groupRenderer>\n                <fdp-form-field-group\n                    [hintOptions]=\"field.formItem.guiOptions | getHintOptions\"\n                    [label]=\"field.formItem.message || ''\"\n                    [labelColumnLayout]=\"field.formItem.guiOptions?.labelColumnLayout\"\n                    [fieldColumnLayout]=\"field.formItem.guiOptions?.fieldColumnLayout\"\n                    [gapColumnLayout]=\"field.formItem.guiOptions?.gapColumnLayout\"\n                    [formName]=\"field.formItem.name\"\n                >\n                    <ng-container *ngFor=\"let groupField of field | getOrderedFieldControls; trackBy: _groupTrackFn\">\n                        <ng-container\n                            *fdpDynamicFormControlField=\"\n                                groupField;\n                                show: shouldShowFields[groupField.formItem.name!] !== false\n                            \"\n                        >\n                            <fdp-form-generator-field\n                                [hintOptions]=\"groupField.formItem.guiOptions | getHintOptions\"\n                                [form]=\"form\"\n                                [field]=\"groupField\"\n                                [shouldShow]=\"shouldShowFields[groupField.formItem.name!] !== false\"\n                                [formFieldName]=\"groupField.formItem.name\"\n                                [formGroupNamePath]=\"field.formItem.name\"\n                                [rank]=\"groupField.formItem.rank || 0\"\n                            ></fdp-form-generator-field>\n                        </ng-container>\n                    </ng-container>\n                </fdp-form-field-group>\n            </ng-template>\n        </ng-container>\n        <fdp-form-field *ngIf=\"!noAdditionalContent\" [column]=\"1\" [rank]=\"formControlItems.length + 1\">\n            <!-- For user-defined elements, like submit button -->\n            <ng-content></ng-content>\n        </fdp-form-field>\n    </fdp-form-group>\n</fd-busy-indicator>\n\n<ng-template #loadingTemplate>\n    <fd-skeleton width=\"100%\" height=\"100px\" [style.padding.rem]=\"1\">\n        <svg:rect x=\"0\" y=\"0\" rx=\"4\" width=\"15%\" height=\"8\" />\n        <svg:rect x=\"0\" y=\"20\" rx=\"4\" width=\"25%\" height=\"16\" />\n\n        <svg:rect x=\"35%\" y=\"0\" rx=\"4\" width=\"15%\" height=\"8\" />\n        <svg:rect x=\"35%\" y=\"20\" rx=\"4\" width=\"25%\" height=\"16\" />\n\n        <svg:rect x=\"0\" y=\"60\" rx=\"4\" width=\"15%\" height=\"8\" />\n        <svg:rect x=\"0\" y=\"80\" rx=\"4\" width=\"25%\" height=\"16\" />\n    </fd-skeleton>\n</ng-template>\n" }]
         }], ctorParameters: function () { return [{ type: FormGeneratorService }, { type: i0.ChangeDetectorRef }, { type: undefined, decorators: [{
                     type: Inject,
                     args: [FDP_FORM_GENERATOR_DEFAULT_HINT_OPTIONS]
@@ -8556,7 +8490,6 @@ class InputGroupAddonComponent {
         if (!button) {
             return;
         }
-        // button.contentDensity = this._contentDensity;
         button.disabled = this._disabled;
         button.markForCheck();
     }
@@ -8569,7 +8502,7 @@ class InputGroupAddonComponent {
         this._renderer.addClass(button, CSS_CLASS_NAME.button);
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.1.0", ngImport: i0, type: InputGroupAddonComponent, deps: [{ token: i0.Renderer2 }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.1.0", type: InputGroupAddonComponent, selector: "fdp-input-group-addon", providers: [inputGroupAddonChildProvider], queries: [{ propertyName: "button", first: true, predicate: ButtonComponent, descendants: true }, { propertyName: "buttonElementRef", first: true, predicate: ButtonComponent, descendants: true, read: ElementRef }], viewQueries: [{ propertyName: "contentTemplateRef", first: true, predicate: TemplateRef, descendants: true }], ngImport: i0, template: '<ng-template><ng-content></ng-content></ng-template>', isInline: true, changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.1.0", type: InputGroupAddonComponent, isStandalone: true, selector: "fdp-input-group-addon", providers: [inputGroupAddonChildProvider], queries: [{ propertyName: "button", first: true, predicate: ButtonComponent, descendants: true }, { propertyName: "buttonElementRef", first: true, predicate: ButtonComponent, descendants: true, read: ElementRef }], viewQueries: [{ propertyName: "contentTemplateRef", first: true, predicate: TemplateRef, descendants: true }], ngImport: i0, template: '<ng-template><ng-content></ng-content></ng-template>', isInline: true, changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.1.0", ngImport: i0, type: InputGroupAddonComponent, decorators: [{
             type: Component,
@@ -8577,7 +8510,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.1.0", ngImpor
                     selector: 'fdp-input-group-addon',
                     template: '<ng-template><ng-content></ng-content></ng-template>',
                     providers: [inputGroupAddonChildProvider],
-                    changeDetection: ChangeDetectionStrategy.OnPush
+                    changeDetection: ChangeDetectionStrategy.OnPush,
+                    standalone: true
                 }]
         }], ctorParameters: function () { return [{ type: i0.Renderer2 }]; }, propDecorators: { contentTemplateRef: [{
                 type: ViewChild,
@@ -8624,8 +8558,8 @@ class InputGroupAddonBodyComponent {
     _removeClassNameFromHostElement(className) {
         this._renderer.removeClass(this._elementRef.nativeElement, className);
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.1.0", ngImport: i0, type: InputGroupAddonBodyComponent, deps: [{ token: i0.ElementRef }, { token: i0.Renderer2 }, { token: i5$2.ContentDensityObserver }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.1.0", type: InputGroupAddonBodyComponent, selector: "fdp-input-group-addon-body", inputs: { hasButton: "hasButton" }, providers: [contentDensityObserverProviders()], ngImport: i0, template: '<ng-content></ng-content>', isInline: true, changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.1.0", ngImport: i0, type: InputGroupAddonBodyComponent, deps: [{ token: i0.ElementRef }, { token: i0.Renderer2 }, { token: i5$1.ContentDensityObserver }], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.1.0", type: InputGroupAddonBodyComponent, isStandalone: true, selector: "fdp-input-group-addon-body", inputs: { hasButton: "hasButton" }, providers: [contentDensityObserverProviders()], ngImport: i0, template: '<ng-content></ng-content>', isInline: true, dependencies: [{ kind: "ngmodule", type: ContentDensityModule }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.1.0", ngImport: i0, type: InputGroupAddonBodyComponent, decorators: [{
             type: Component,
@@ -8633,9 +8567,11 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.1.0", ngImpor
                     selector: 'fdp-input-group-addon-body',
                     template: '<ng-content></ng-content>',
                     changeDetection: ChangeDetectionStrategy.OnPush,
-                    providers: [contentDensityObserverProviders()]
+                    providers: [contentDensityObserverProviders()],
+                    imports: [ContentDensityModule],
+                    standalone: true
                 }]
-        }], ctorParameters: function () { return [{ type: i0.ElementRef }, { type: i0.Renderer2 }, { type: i5$2.ContentDensityObserver }]; }, propDecorators: { hasButton: [{
+        }], ctorParameters: function () { return [{ type: i0.ElementRef }, { type: i0.Renderer2 }, { type: i5$1.ContentDensityObserver }]; }, propDecorators: { hasButton: [{
                 type: Input
             }] } });
 
@@ -8668,7 +8604,7 @@ class InputGroupInputComponent {
         this.type = 'text';
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.1.0", ngImport: i0, type: InputGroupInputComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.1.0", type: InputGroupInputComponent, selector: "fdp-input-group-input", inputs: { type: "type" }, providers: [inputGroupInputChildProvider], ngImport: i0, template: '', isInline: true, changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.1.0", type: InputGroupInputComponent, isStandalone: true, selector: "fdp-input-group-input", inputs: { type: "type" }, providers: [inputGroupInputChildProvider], ngImport: i0, template: '', isInline: true, changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.1.0", ngImport: i0, type: InputGroupInputComponent, decorators: [{
             type: Component,
@@ -8676,7 +8612,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.1.0", ngImpor
                     selector: 'fdp-input-group-input',
                     template: '',
                     providers: [inputGroupInputChildProvider],
-                    changeDetection: ChangeDetectionStrategy.OnPush
+                    changeDetection: ChangeDetectionStrategy.OnPush,
+                    standalone: true
                 }]
         }], propDecorators: { type: [{
                 type: Input
@@ -8834,17 +8771,17 @@ class InputGroupComponent extends BaseInput {
         this._renderer.addClass(this._hostElementRef.nativeElement, className);
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.1.0", ngImport: i0, type: InputGroupComponent, deps: [{ token: i0.ChangeDetectorRef }, { token: i0.ElementRef }, { token: i1$1.NgControl, optional: true, self: true }, { token: i1$1.ControlContainer, optional: true, skipSelf: true }, { token: i1$1.NgForm, optional: true, skipSelf: true }, { token: FD_FORM_FIELD, host: true, optional: true, skipSelf: true }, { token: FD_FORM_FIELD_CONTROL, host: true, optional: true, skipSelf: true }, { token: i0.Renderer2 }, { token: i0.ElementRef }, { token: InputGroupConfig }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.1.0", type: InputGroupComponent, selector: "fdp-input-group", inputs: { value: "value" }, providers: [
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.1.0", type: InputGroupComponent, isStandalone: true, selector: "fdp-input-group", inputs: { value: "value" }, providers: [
             { provide: FD_FORM_FIELD_CONTROL, useExisting: forwardRef(() => InputGroupComponent), multi: true },
             contentDensityObserverProviders()
-        ], queries: [{ propertyName: "_input", first: true, predicate: InputGroupInputComponent, descendants: true }, { propertyName: "_children", predicate: INPUT_GROUP_CHILD_TOKEN }], viewQueries: [{ propertyName: "_inputComponentElement", first: true, predicate: InputComponent, descendants: true, read: ElementRef }], usesInheritance: true, ngImport: i0, template: "<div class=\"fd-input-group\" [class.is-disabled]=\"disabled\" [class]=\"_controlStateClass\" [class.is-focus]=\"focused\">\n    <!-- Before input addons area -->\n    <fdp-input-group-addon-body *ngFor=\"let addon of _beforeInputAddons\">\n        <ng-container *ngTemplateOutlet=\"addon.contentTemplateRef\"></ng-container>\n    </fdp-input-group-addon-body>\n\n    <!-- Input -->\n    <ng-container *ngIf=\"_input\">\n        <fdp-input\n            [name]=\"name\"\n            [id]=\"id\"\n            [placeholder]=\"placeholder\"\n            [type]=\"_input.type\"\n            [disabled]=\"disabled\"\n            [value]=\"value\"\n            [ariaLabel]=\"ariaLabel\"\n            [ariaLabelledBy]=\"ariaLabelledBy\"\n            [required]=\"required\"\n            (input)=\"_onChangeInputValue($any($event.target)?.value)\"\n            (focusChange)=\"_onFocusChanged($event)\"\n            (keypress)=\"_onKeyPress($event)\"\n        ></fdp-input>\n    </ng-container>\n\n    <!-- After input addons area -->\n    <fdp-input-group-addon-body *ngFor=\"let addon of _afterInputAddons\" [hasButton]=\"!!addon.button\">\n        <ng-container *ngTemplateOutlet=\"addon.contentTemplateRef\"></ng-container>\n    </fdp-input-group-addon-body>\n</div>\n", styles: ["/*!\n * Fundamental Library Styles v0.30.2-rc.6\n * Copyright (c) 2023 SAP SE or an SAP affiliate company.\n * Licensed under Apache License 2.0 (https://github.com/SAP/fundamental-styles/blob/main/LICENSE)\n */.fd-input-group{-webkit-box-sizing:border-box;-webkit-box-shadow:var(--sapField_Shadow);-webkit-appearance:none;appearance:none;background:var(--fdInputGroup_Background, var(--sapField_BackgroundStyle));background-color:var(--fdInputGroup_Background_Color, var(--sapField_Background));border:0;border:var(--sapField_BorderWidth) var(--sapField_BorderStyle) var(--sapField_BorderColor);border-radius:var(--sapField_BorderCornerRadius);box-shadow:var(--sapField_Shadow);box-sizing:border-box;color:var(--sapTextColor);color:var(--sapField_TextColor);cursor:text;display:flex;font-family:var(--sapFontFamily);font-size:var(--sapFontSize);font-weight:400;forced-color-adjust:none;height:auto;line-height:var(--sapContent_LineHeight);margin:0;margin:var(--fdInput_Field_Margin, .25rem 0);min-width:var(2.75rem, 2.75rem);outline:none;overflow:hidden;padding:0;text-overflow:ellipsis;text-shadow:var(--fdInput_Text_Shadow);white-space:nowrap;width:100%;z-index:1}.fd-input-group:after,.fd-input-group:before{box-sizing:inherit;font-size:inherit}.fd-input-group::placeholder{color:var(--sapField_PlaceholderTextColor);font-style:var(--fdPlaceholder_Font_Style)}.fd-input-group[dir=rtl]::placeholder,[dir=rtl] .fd-input-group::placeholder{text-indent:.125rem}.fd-input-group::selection{background-color:var(--sapSelectedColor);color:var(--sapContent_ContrastTextColor)}.fd-input-group::-ms-clear{display:none}.fd-input-group.is-hover,.fd-input-group:hover{-webkit-box-shadow:var(--fdInput_Box_Shadow_Hover);background:var(--fdInputGroup_Hover_Background, var(--sapField_Hover_BackgroundStyle));background-color:var(--fdInputGroup_Hover_Background_Color, var(--sapField_Hover_Background));border-color:var(--sapField_Hover_BorderColor);box-shadow:var(--fdInput_Box_Shadow_Hover)}.fd-input-group.is-focus,.fd-input-group:focus{-webkit-box-shadow:none;background:var(--sapField_Focus_Background, var(--sapField_Focus_Background));box-shadow:none;outline-color:var(--fdInput_Outline_Color);outline-offset:var(--fdInput_Outline_Offset);outline-style:var(--sapContent_FocusStyle);outline-width:var(--sapContent_FocusWidth);z-index:5}.fd-input-group.is-success{-webkit-box-shadow:var(--sapField_SuccessShadow);background:var(--sapField_SuccessBackgroundStyle);background-color:var(--sapField_SuccessBackground);border:var(--sapField_SuccessColor) var(--sapField_SuccessBorderWidth) var(--sapField_SuccessBorderStyle);box-shadow:var(--sapField_SuccessShadow)}.fd-input-group.is-success.is-hover,.fd-input-group.is-success:hover{-webkit-box-shadow:var(--fdInput_Success_Box_Shadow_Hover);background-color:var(--fdInput_Success_Background_Color_Hover);border-color:var(--sapField_SuccessColor);box-shadow:var(--fdInput_Success_Box_Shadow_Hover)}.fd-input-group.is-success.is-focus,.fd-input-group.is-success:focus{background:var(--sapField_Focus_Background);outline-color:var(--fdInput_Success_Outline_Color)}.fd-input-group.is-success.is-focus.is-hover,.fd-input-group.is-success.is-focus:hover,.fd-input-group.is-success:focus.is-hover,.fd-input-group.is-success:focus:hover{box-shadow:none}.fd-input-group.is-success.is-expanded,.fd-input-group.is-success[aria-expanded=true]{-webkit-box-shadow:none;background:var(--sapField_Focus_Background);box-shadow:none;outline:var(--sapContent_FocusWidth) var(--sapContent_FocusStyle) var(--fdInput_Success_Outline_Color);outline-offset:var(--fdInput_Outline_Offset)}.fd-input-group.is-error{-webkit-box-shadow:var(--sapField_InvalidShadow);background:var(--sapField_InvalidBackgroundStyle);background-color:var(--sapField_InvalidBackground);border:var(--sapField_InvalidColor) var(--sapField_InvalidBorderWidth) var(--sapField_InvalidBorderStyle);box-shadow:var(--sapField_InvalidShadow)}.fd-input-group.is-error.is-hover,.fd-input-group.is-error:hover{-webkit-box-shadow:var(--fdInput_Error_Box_Shadow_Hover);background-color:var(--fdInput_Error_Background_Color_Hover);border-color:var(--sapField_InvalidColor);box-shadow:var(--fdInput_Error_Box_Shadow_Hover)}.fd-input-group.is-error.is-focus,.fd-input-group.is-error:focus{background:var(--sapField_Focus_Background);outline-color:var(--fdInput_Error_Outline_Color)}.fd-input-group.is-error.is-focus.is-hover,.fd-input-group.is-error.is-focus:hover,.fd-input-group.is-error:focus.is-hover,.fd-input-group.is-error:focus:hover{box-shadow:none}.fd-input-group.is-error.is-expanded,.fd-input-group.is-error[aria-expanded=true]{-webkit-box-shadow:none;background:var(--sapField_Focus_Background);box-shadow:none;outline:var(--sapContent_FocusWidth) var(--sapContent_FocusStyle) var(--fdInput_Error_Outline_Color);outline-offset:var(--fdInput_Outline_Offset)}.fd-input-group.is-warning{-webkit-box-shadow:var(--sapField_WarningShadow);background:var(--sapField_WarningBackgroundStyle);background-color:var(--sapField_WarningBackground);border:var(--sapField_WarningColor) var(--sapField_WarningBorderWidth) var(--sapField_WarningBorderStyle);box-shadow:var(--sapField_WarningShadow)}.fd-input-group.is-warning.is-hover,.fd-input-group.is-warning:hover{-webkit-box-shadow:var(--fdInput_Warning_Box_Shadow_Hover);background-color:var(--fdInput_Warning_Background_Color_Hover);border-color:var(--sapField_WarningColor);box-shadow:var(--fdInput_Warning_Box_Shadow_Hover)}.fd-input-group.is-warning.is-focus,.fd-input-group.is-warning:focus{background:var(--sapField_Focus_Background);outline-color:var(--fdInput_Warning_Outline_Color)}.fd-input-group.is-warning.is-focus.is-hover,.fd-input-group.is-warning.is-focus:hover,.fd-input-group.is-warning:focus.is-hover,.fd-input-group.is-warning:focus:hover{box-shadow:none}.fd-input-group.is-warning.is-expanded,.fd-input-group.is-warning[aria-expanded=true]{-webkit-box-shadow:none;background:var(--sapField_Focus_Background);box-shadow:none;outline:var(--sapContent_FocusWidth) var(--sapContent_FocusStyle) var(--fdInput_Warning_Outline_Color);outline-offset:var(--fdInput_Outline_Offset)}.fd-input-group.is-alert{background:var(--sapField_WarningBackgroundStyle);background-color:var(--sapField_WarningBackground);border:var(--sapField_WarningColor) var(--sapField_WarningBorderWidth) var(--sapField_WarningBorderStyle)}.fd-input-group.is-alert.is-hover,.fd-input-group.is-alert:hover{-webkit-box-shadow:var(--fdInput_Warning_Box_Shadow_Hover);background-color:var(--fdInput_Warning_Background_Color_Hover);border-color:var(--sapField_WarningColor);box-shadow:var(--fdInput_Warning_Box_Shadow_Hover)}.fd-input-group.is-alert.is-focus,.fd-input-group.is-alert:focus{background:var(--sapField_Focus_Background);outline-color:var(--fdInput_Warning_Outline_Color)}.fd-input-group.is-alert.is-focus.is-hover,.fd-input-group.is-alert.is-focus:hover,.fd-input-group.is-alert:focus.is-hover,.fd-input-group.is-alert:focus:hover{box-shadow:none}.fd-input-group.is-alert.is-expanded,.fd-input-group.is-alert[aria-expanded=true]{-webkit-box-shadow:none;background:var(--sapField_Focus_Background);box-shadow:none;outline:var(--sapContent_FocusWidth) var(--sapContent_FocusStyle) var(--fdInput_Warning_Outline_Color);outline-offset:var(--fdInput_Outline_Offset)}.fd-input-group.is-information{-webkit-box-shadow:var(--sapField_InformationShadow);background:var(--sapField_InformationBackgroundStyle);background-color:var(--sapField_InformationBackground);border:var(--sapField_InformationColor) var(--sapField_InformationBorderWidth) var(--sapField_InformationBorderStyle);box-shadow:var(--sapField_InformationShadow)}.fd-input-group.is-information.is-hover,.fd-input-group.is-information:hover{-webkit-box-shadow:var(--fdInput_Information_Box_Shadow_Hover);background-color:var(--fdInput_Information_Background_Color_Hover);border-color:var(--sapField_InformationColor);box-shadow:var(--fdInput_Information_Box_Shadow_Hover)}.fd-input-group.is-information.is-focus,.fd-input-group.is-information:focus{background:var(--sapField_Focus_Background);outline-color:var(--fdInput_Information_Outline_Color)}.fd-input-group.is-information.is-focus.is-hover,.fd-input-group.is-information.is-focus:hover,.fd-input-group.is-information:focus.is-hover,.fd-input-group.is-information:focus:hover{box-shadow:none}.fd-input-group.is-information.is-expanded,.fd-input-group.is-information[aria-expanded=true]{-webkit-box-shadow:none;background:var(--sapField_Focus_Background);box-shadow:none;outline:var(--sapContent_FocusWidth) var(--sapContent_FocusStyle) var(--fdInput_Information_Outline_Color);outline-offset:var(--fdInput_Outline_Offset)}.fd-input-group.is-alert,.fd-input-group.is-error,.fd-input-group.is-warning{font-style:var(--fdInput_State_Text_Style);font-weight:var(--fdInput_State_Font_Weight)}.fd-input-group.is-alert::placeholder,.fd-input-group.is-error::placeholder,.fd-input-group.is-warning::placeholder{font-weight:var(--fdInput_State_Font_Weight)}.fd-input-group.is-alert.is-focus,.fd-input-group.is-alert:focus,.fd-input-group.is-error.is-focus,.fd-input-group.is-error:focus,.fd-input-group.is-information.is-focus,.fd-input-group.is-information:focus,.fd-input-group.is-warning.is-focus,.fd-input-group.is-warning:focus{outline-offset:var(--fdInput_Outline_Offset_States);z-index:5}.fd-input-group.is-error::placeholder{color:var(--sapField_TextColor)}.fd-input-group.is-disabled,.fd-input-group:disabled,.fd-input-group[aria-disabled=true]{opacity:var(--sapContent_DisabledOpacity);pointer-events:none}.fd-input-group.is-disabled::placeholder,.fd-input-group:disabled::placeholder,.fd-input-group[aria-disabled=true]::placeholder{color:var(--fdInput_Non_Interactive_State_Placeholder_Color)}.fd-input-group.is-readonly,.fd-input-group[aria-readonly=true],.fd-input-group[readonly]{-webkit-box-shadow:none;background:var(--sapField_ReadOnly_BackgroundStyle);background-color:var(--sapField_ReadOnly_Background);border-color:var(--sapField_ReadOnly_BorderColor);box-shadow:none}.fd-input-group.is-readonly::placeholder,.fd-input-group[aria-readonly=true]::placeholder,.fd-input-group[readonly]::placeholder{color:var(--fdInput_Non_Interactive_State_Placeholder_Color)}.fd-input-group.is-readonly.is-hover,.fd-input-group.is-readonly:hover,.fd-input-group[aria-readonly=true].is-hover,.fd-input-group[aria-readonly=true]:hover,.fd-input-group[readonly].is-hover,.fd-input-group[readonly]:hover{-webkit-box-shadow:none;background:var(--sapField_ReadOnly_BackgroundStyle);background-color:var(--sapField_ReadOnly_Background);border-color:var(--sapField_ReadOnly_BorderColor);box-shadow:none}.fd-input-group.is-readonly.is-focus,.fd-input-group.is-readonly:focus,.fd-input-group[aria-readonly=true].is-focus,.fd-input-group[aria-readonly=true]:focus,.fd-input-group[readonly].is-focus,.fd-input-group[readonly]:focus{-webkit-box-shadow:none;background:var(--sapField_ReadOnly_BackgroundStyle);background-color:var(--sapField_ReadOnly_Background);border-color:var(--sapField_ReadOnly_BorderColor);box-shadow:none;z-index:5}.fd-input-group .fd-input-group__button:first-child{border-right:var(--fdInputGroup_ControlButton_SideBorder)}.fd-input-group .fd-input-group__button:first-child[dir=rtl],[dir=rtl] .fd-input-group .fd-input-group__button:first-child{border-left:var(--fdInputGroup_ControlButton_SideBorder);border-right-style:none}.fd-input-group .fd-input-group__button:first-child.is-hover,.fd-input-group .fd-input-group__button:first-child:hover{border-right:var(--fdInputGroup_ControlButton_SideBorder_Active)}.fd-input-group .fd-input-group__button:first-child.is-hover[dir=rtl],.fd-input-group .fd-input-group__button:first-child:hover[dir=rtl],[dir=rtl] .fd-input-group .fd-input-group__button:first-child.is-hover,[dir=rtl] .fd-input-group .fd-input-group__button:first-child:hover{border-left:var(--fdInputGroup_ControlButton_SideBorder_Active);border-right-style:none}.fd-input-group .fd-input-group__button:first-child.is-active,.fd-input-group .fd-input-group__button:first-child:active{border-right:var(--fdInputGroup_ControlButton_SideBorder_Active)}.fd-input-group .fd-input-group__button:first-child.is-active[dir=rtl],.fd-input-group .fd-input-group__button:first-child:active[dir=rtl],[dir=rtl] .fd-input-group .fd-input-group__button:first-child.is-active,[dir=rtl] .fd-input-group .fd-input-group__button:first-child:active{border-left:var(--fdInputGroup_ControlButton_SideBorder_Active);border-right-style:none}.fd-input-group .fd-input-group__button:not(:first-child){border-left:var(--fdInputGroup_ControlButton_SideBorder)}.fd-input-group .fd-input-group__button:not(:first-child)[dir=rtl],[dir=rtl] .fd-input-group .fd-input-group__button:not(:first-child){border-left-style:none;border-right:var(--fdInputGroup_ControlButton_SideBorder)}.fd-input-group .fd-input-group__button:not(:first-child).is-hover,.fd-input-group .fd-input-group__button:not(:first-child):hover{border-left:var(--fdInputGroup_ControlButton_SideBorder_Active)}.fd-input-group .fd-input-group__button:not(:first-child).is-hover[dir=rtl],.fd-input-group .fd-input-group__button:not(:first-child):hover[dir=rtl],[dir=rtl] .fd-input-group .fd-input-group__button:not(:first-child).is-hover,[dir=rtl] .fd-input-group .fd-input-group__button:not(:first-child):hover{border-left-style:none;border-right:var(--fdInputGroup_ControlButton_SideBorder_Active)}.fd-input-group .fd-input-group__button:not(:first-child).is-active,.fd-input-group .fd-input-group__button:not(:first-child):active{border-left:var(--fdInputGroup_ControlButton_SideBorder_Active)}.fd-input-group .fd-input-group__button:not(:first-child).is-active[dir=rtl],.fd-input-group .fd-input-group__button:not(:first-child):active[dir=rtl],[dir=rtl] .fd-input-group .fd-input-group__button:not(:first-child).is-active,[dir=rtl] .fd-input-group .fd-input-group__button:not(:first-child):active{border-left-style:none;border-right:var(--fdInputGroup_ControlButton_SideBorder_Active)}.fd-input-group .fd-input-group__addon:first-child .fd-input-group__button{border-right:var(--fdInputGroup_ControlButton_SideBorder)}.fd-input-group .fd-input-group__addon:first-child .fd-input-group__button[dir=rtl],[dir=rtl] .fd-input-group .fd-input-group__addon:first-child .fd-input-group__button{border-left:var(--fdInputGroup_ControlButton_SideBorder);border-right-style:none}.fd-input-group .fd-input-group__addon:first-child .fd-input-group__button.is-hover,.fd-input-group .fd-input-group__addon:first-child .fd-input-group__button:hover{border-right:var(--fdInputGroup_ControlButton_SideBorder_Active)}.fd-input-group .fd-input-group__addon:first-child .fd-input-group__button.is-hover[dir=rtl],.fd-input-group .fd-input-group__addon:first-child .fd-input-group__button:hover[dir=rtl],[dir=rtl] .fd-input-group .fd-input-group__addon:first-child .fd-input-group__button.is-hover,[dir=rtl] .fd-input-group .fd-input-group__addon:first-child .fd-input-group__button:hover{border-left:var(--fdInputGroup_ControlButton_SideBorder_Active);border-right-style:none}.fd-input-group .fd-input-group__addon:first-child .fd-input-group__button.is-active,.fd-input-group .fd-input-group__addon:first-child .fd-input-group__button:active{border-right:var(--fdInputGroup_ControlButton_SideBorder_Active)}.fd-input-group .fd-input-group__addon:first-child .fd-input-group__button.is-active[dir=rtl],.fd-input-group .fd-input-group__addon:first-child .fd-input-group__button:active[dir=rtl],[dir=rtl] .fd-input-group .fd-input-group__addon:first-child .fd-input-group__button.is-active,[dir=rtl] .fd-input-group .fd-input-group__addon:first-child .fd-input-group__button:active{border-left:var(--fdInputGroup_ControlButton_SideBorder_Active);border-right-style:none}.fd-input-group .fd-input-group__addon:not(:first-child) .fd-input-group__button{border-left:var(--fdInputGroup_ControlButton_SideBorder)}.fd-input-group .fd-input-group__addon:not(:first-child) .fd-input-group__button[dir=rtl],[dir=rtl] .fd-input-group .fd-input-group__addon:not(:first-child) .fd-input-group__button{border-left-style:none;border-right:var(--fdInputGroup_ControlButton_SideBorder)}.fd-input-group .fd-input-group__addon:not(:first-child) .fd-input-group__button.is-hover,.fd-input-group .fd-input-group__addon:not(:first-child) .fd-input-group__button:hover{border-left:var(--fdInputGroup_ControlButton_SideBorder_Active)}.fd-input-group .fd-input-group__addon:not(:first-child) .fd-input-group__button.is-hover[dir=rtl],.fd-input-group .fd-input-group__addon:not(:first-child) .fd-input-group__button:hover[dir=rtl],[dir=rtl] .fd-input-group .fd-input-group__addon:not(:first-child) .fd-input-group__button.is-hover,[dir=rtl] .fd-input-group .fd-input-group__addon:not(:first-child) .fd-input-group__button:hover{border-left-style:none;border-right:var(--fdInputGroup_ControlButton_SideBorder_Active)}.fd-input-group .fd-input-group__addon:not(:first-child) .fd-input-group__button.is-active,.fd-input-group .fd-input-group__addon:not(:first-child) .fd-input-group__button:active{border-left:var(--fdInputGroup_ControlButton_SideBorder_Active)}.fd-input-group .fd-input-group__addon:not(:first-child) .fd-input-group__button.is-active[dir=rtl],.fd-input-group .fd-input-group__addon:not(:first-child) .fd-input-group__button:active[dir=rtl],[dir=rtl] .fd-input-group .fd-input-group__addon:not(:first-child) .fd-input-group__button.is-active,[dir=rtl] .fd-input-group .fd-input-group__addon:not(:first-child) .fd-input-group__button:active{border-left-style:none;border-right:var(--fdInputGroup_ControlButton_SideBorder_Active)}.fd-input-group .fd-input-group__button{background:var(--fdInput_Group_Button_Background);background-color:var(--fdButtonBackgroundColor);border:none;border-radius:var(--fdInput_Group_Button_Border_Raduis);color:var(--fdInput_Group_Button_Text_Color);overflow:hidden;position:relative;text-overflow:ellipsis;white-space:nowrap;z-index:auto!important}.fd-input-group .fd-input-group__button:before{display:none!important}.fd-input-group .fd-input-group__button:after{border-radius:var(--fdInput_Outline_Border_Radius)}.fd-input-group .fd-input-group__button.is-hover,.fd-input-group .fd-input-group__button:hover{--fdInput_Group_Button_Text_Color:var(--fdInput_Group_Button_Hover_Text_Color);--fdButtonBackgroundColor:var(--fdInput_Group_Button_Hover_Background);box-shadow:var(--fdInput_Group_Button_Box_Shadow)}.fd-input-group .fd-input-group__button.is-active,.fd-input-group .fd-input-group__button:active{-webkit-box-shadow:var(--fdInput_Group_Button_Box_Shadow);background:var(--fdInput_Group_Button_Active_Background);box-shadow:var(--fdInput_Group_Button_Box_Shadow);color:var(--fdInput_Group_Button_Active_Text_Color)}.fd-input-group.is-success.is-focus,.fd-input-group.is-success:focus{z-index:5}.fd-input-group.is-success.is-focus .fd-input-group__button,.fd-input-group.is-success:focus .fd-input-group__button{-webkit-box-shadow:var(--fdInput_Group_Button_Success_Active_Box_Shadow);--fdButtonBackgroundColor:var(--fdInput_Group_Button_Active_Background);box-shadow:var(--fdInput_Group_Button_Success_Active_Box_Shadow);color:var(--fdInput_Group_Button_Success_Active_Text_Color)}.fd-input-group.is-success.is-focus .fd-input-group__button.is-hover,.fd-input-group.is-success.is-focus .fd-input-group__button:hover,.fd-input-group.is-success:focus .fd-input-group__button.is-hover,.fd-input-group.is-success:focus .fd-input-group__button:hover{--fdButtonBackgroundColor:var(--fdInput_Group_Button_Active_Background)}.fd-input-group.is-success.is-expanded .fd-input-group__button,.fd-input-group.is-success[aria-expanded=true] .fd-input-group__button{-webkit-box-shadow:var(--fdInput_Group_Button_Success_Active_Box_Shadow);--fdButtonBackgroundColor:var(--fdInput_Group_Button_Active_Background);box-shadow:var(--fdInput_Group_Button_Success_Active_Box_Shadow);color:var(--fdInput_Group_Button_Success_Active_Text_Color)}.fd-input-group.is-success.is-expanded .fd-input-group__button.is-hover,.fd-input-group.is-success.is-expanded .fd-input-group__button:hover,.fd-input-group.is-success[aria-expanded=true] .fd-input-group__button.is-hover,.fd-input-group.is-success[aria-expanded=true] .fd-input-group__button:hover{--fdButtonBackgroundColor:var(--fdInput_Group_Button_Active_Background)}.fd-input-group.is-success .fd-input-group__button.is-active,.fd-input-group.is-success .fd-input-group__button.is-hover,.fd-input-group.is-success .fd-input-group__button:active,.fd-input-group.is-success .fd-input-group__button:hover{box-shadow:var(--fdInput_Group_Button_Success_Active_Box_Shadow)}.fd-input-group.is-success .fd-input-group__button.is-active,.fd-input-group.is-success .fd-input-group__button:active{color:var(--fdInput_Group_Button_Success_Active_Text_Color)}.fd-input-group.is-error.is-focus,.fd-input-group.is-error:focus{z-index:5}.fd-input-group.is-error.is-focus .fd-input-group__button,.fd-input-group.is-error:focus .fd-input-group__button{-webkit-box-shadow:var(--fdInput_Group_Button_Error_Active_Box_Shadow);--fdButtonBackgroundColor:var(--fdInput_Group_Button_Active_Background);box-shadow:var(--fdInput_Group_Button_Error_Active_Box_Shadow);color:var(--fdInput_Group_Button_Error_Active_Text_Color)}.fd-input-group.is-error.is-focus .fd-input-group__button.is-hover,.fd-input-group.is-error.is-focus .fd-input-group__button:hover,.fd-input-group.is-error:focus .fd-input-group__button.is-hover,.fd-input-group.is-error:focus .fd-input-group__button:hover{--fdButtonBackgroundColor:var(--fdInput_Group_Button_Active_Background)}.fd-input-group.is-error.is-expanded .fd-input-group__button,.fd-input-group.is-error[aria-expanded=true] .fd-input-group__button{-webkit-box-shadow:var(--fdInput_Group_Button_Error_Active_Box_Shadow);--fdButtonBackgroundColor:var(--fdInput_Group_Button_Active_Background);box-shadow:var(--fdInput_Group_Button_Error_Active_Box_Shadow);color:var(--fdInput_Group_Button_Error_Active_Text_Color)}.fd-input-group.is-error.is-expanded .fd-input-group__button.is-hover,.fd-input-group.is-error.is-expanded .fd-input-group__button:hover,.fd-input-group.is-error[aria-expanded=true] .fd-input-group__button.is-hover,.fd-input-group.is-error[aria-expanded=true] .fd-input-group__button:hover{--fdButtonBackgroundColor:var(--fdInput_Group_Button_Active_Background)}.fd-input-group.is-error .fd-input-group__button.is-active,.fd-input-group.is-error .fd-input-group__button.is-hover,.fd-input-group.is-error .fd-input-group__button:active,.fd-input-group.is-error .fd-input-group__button:hover{box-shadow:var(--fdInput_Group_Button_Error_Active_Box_Shadow)}.fd-input-group.is-error .fd-input-group__button.is-active,.fd-input-group.is-error .fd-input-group__button:active{color:var(--fdInput_Group_Button_Error_Active_Text_Color)}.fd-input-group.is-warning.is-focus,.fd-input-group.is-warning:focus{z-index:5}.fd-input-group.is-warning.is-focus .fd-input-group__button,.fd-input-group.is-warning:focus .fd-input-group__button{-webkit-box-shadow:var(--fdInput_Group_Button_Warning_Active_Box_Shadow);--fdButtonBackgroundColor:var(--fdInput_Group_Button_Active_Background);box-shadow:var(--fdInput_Group_Button_Warning_Active_Box_Shadow);color:var(--fdInput_Group_Button_Warning_Active_Text_Color)}.fd-input-group.is-warning.is-focus .fd-input-group__button.is-hover,.fd-input-group.is-warning.is-focus .fd-input-group__button:hover,.fd-input-group.is-warning:focus .fd-input-group__button.is-hover,.fd-input-group.is-warning:focus .fd-input-group__button:hover{--fdButtonBackgroundColor:var(--fdInput_Group_Button_Active_Background)}.fd-input-group.is-warning.is-expanded .fd-input-group__button,.fd-input-group.is-warning[aria-expanded=true] .fd-input-group__button{-webkit-box-shadow:var(--fdInput_Group_Button_Warning_Active_Box_Shadow);--fdButtonBackgroundColor:var(--fdInput_Group_Button_Active_Background);box-shadow:var(--fdInput_Group_Button_Warning_Active_Box_Shadow);color:var(--fdInput_Group_Button_Warning_Active_Text_Color)}.fd-input-group.is-warning.is-expanded .fd-input-group__button.is-hover,.fd-input-group.is-warning.is-expanded .fd-input-group__button:hover,.fd-input-group.is-warning[aria-expanded=true] .fd-input-group__button.is-hover,.fd-input-group.is-warning[aria-expanded=true] .fd-input-group__button:hover{--fdButtonBackgroundColor:var(--fdInput_Group_Button_Active_Background)}.fd-input-group.is-warning .fd-input-group__button.is-active,.fd-input-group.is-warning .fd-input-group__button.is-hover,.fd-input-group.is-warning .fd-input-group__button:active,.fd-input-group.is-warning .fd-input-group__button:hover{box-shadow:var(--fdInput_Group_Button_Warning_Active_Box_Shadow)}.fd-input-group.is-warning .fd-input-group__button.is-active,.fd-input-group.is-warning .fd-input-group__button:active{color:var(--fdInput_Group_Button_Warning_Active_Text_Color)}.fd-input-group.is-alert.is-focus,.fd-input-group.is-alert:focus{z-index:5}.fd-input-group.is-alert.is-focus .fd-input-group__button,.fd-input-group.is-alert:focus .fd-input-group__button{-webkit-box-shadow:var(--fdInput_Group_Button_Warning_Active_Box_Shadow);--fdButtonBackgroundColor:var(--fdInput_Group_Button_Active_Background);box-shadow:var(--fdInput_Group_Button_Warning_Active_Box_Shadow);color:var(--fdInput_Group_Button_Warning_Active_Text_Color)}.fd-input-group.is-alert.is-focus .fd-input-group__button.is-hover,.fd-input-group.is-alert.is-focus .fd-input-group__button:hover,.fd-input-group.is-alert:focus .fd-input-group__button.is-hover,.fd-input-group.is-alert:focus .fd-input-group__button:hover{--fdButtonBackgroundColor:var(--fdInput_Group_Button_Active_Background)}.fd-input-group.is-alert.is-expanded .fd-input-group__button,.fd-input-group.is-alert[aria-expanded=true] .fd-input-group__button{-webkit-box-shadow:var(--fdInput_Group_Button_Warning_Active_Box_Shadow);--fdButtonBackgroundColor:var(--fdInput_Group_Button_Active_Background);box-shadow:var(--fdInput_Group_Button_Warning_Active_Box_Shadow);color:var(--fdInput_Group_Button_Warning_Active_Text_Color)}.fd-input-group.is-alert.is-expanded .fd-input-group__button.is-hover,.fd-input-group.is-alert.is-expanded .fd-input-group__button:hover,.fd-input-group.is-alert[aria-expanded=true] .fd-input-group__button.is-hover,.fd-input-group.is-alert[aria-expanded=true] .fd-input-group__button:hover{--fdButtonBackgroundColor:var(--fdInput_Group_Button_Active_Background)}.fd-input-group.is-alert .fd-input-group__button.is-active,.fd-input-group.is-alert .fd-input-group__button.is-hover,.fd-input-group.is-alert .fd-input-group__button:active,.fd-input-group.is-alert .fd-input-group__button:hover{box-shadow:var(--fdInput_Group_Button_Warning_Active_Box_Shadow)}.fd-input-group.is-alert .fd-input-group__button.is-active,.fd-input-group.is-alert .fd-input-group__button:active{color:var(--fdInput_Group_Button_Warning_Active_Text_Color)}.fd-input-group.is-information.is-focus,.fd-input-group.is-information:focus{z-index:5}.fd-input-group.is-information.is-focus .fd-input-group__button,.fd-input-group.is-information:focus .fd-input-group__button{-webkit-box-shadow:var(--fdInput_Group_Button_Information_Active_Box_Shadow);--fdButtonBackgroundColor:var(--fdInput_Group_Button_Active_Background);box-shadow:var(--fdInput_Group_Button_Information_Active_Box_Shadow);color:var(--fdInput_Group_Button_Information_Active_Text_Color)}.fd-input-group.is-information.is-focus .fd-input-group__button.is-hover,.fd-input-group.is-information.is-focus .fd-input-group__button:hover,.fd-input-group.is-information:focus .fd-input-group__button.is-hover,.fd-input-group.is-information:focus .fd-input-group__button:hover{--fdButtonBackgroundColor:var(--fdInput_Group_Button_Active_Background)}.fd-input-group.is-information.is-expanded .fd-input-group__button,.fd-input-group.is-information[aria-expanded=true] .fd-input-group__button{-webkit-box-shadow:var(--fdInput_Group_Button_Information_Active_Box_Shadow);--fdButtonBackgroundColor:var(--fdInput_Group_Button_Active_Background);box-shadow:var(--fdInput_Group_Button_Information_Active_Box_Shadow);color:var(--fdInput_Group_Button_Information_Active_Text_Color)}.fd-input-group.is-information.is-expanded .fd-input-group__button.is-hover,.fd-input-group.is-information.is-expanded .fd-input-group__button:hover,.fd-input-group.is-information[aria-expanded=true] .fd-input-group__button.is-hover,.fd-input-group.is-information[aria-expanded=true] .fd-input-group__button:hover{--fdButtonBackgroundColor:var(--fdInput_Group_Button_Active_Background)}.fd-input-group.is-information .fd-input-group__button.is-active,.fd-input-group.is-information .fd-input-group__button.is-hover,.fd-input-group.is-information .fd-input-group__button:active,.fd-input-group.is-information .fd-input-group__button:hover{box-shadow:var(--fdInput_Group_Button_Information_Active_Box_Shadow)}.fd-input-group.is-information .fd-input-group__button.is-active,.fd-input-group.is-information .fd-input-group__button:active{color:var(--fdInput_Group_Button_Information_Active_Text_Color)}.fd-input-group .fd-input-group__input{-webkit-box-flex:1;-ms-flex:1 1 10rem;-webkit-box-shadow:none;background:none;background-color:var(--fdInputGroup_Input_Background, transparent);border:var(--fdInputGroup_Input_Border, none);box-shadow:none;color:var(--fdInputGroup_Input_Color, inherit);flex:1 1 10rem;padding-left:.25rem;padding-right:.25rem;text-shadow:var(--fdInputGroup_Text_Shadow)}.fd-input-group .fd-input-group__input:nth-child(n+1){margin:0}.fd-input-group .fd-input-group__input::placeholder{color:var(--fdInputGroup_Input_Placeholder_Color, var(--sapField_PlaceholderTextColor));font-style:var(--fdInputGroup_Input_Placeholder_Style, italic)}.fd-input-group .fd-input-group__input.is-hover,.fd-input-group .fd-input-group__input:hover{-webkit-box-shadow:none;background:none;background-color:var(--fdInputGroup_Hover_Input_Background, transparent);box-shadow:none}.fd-input-group .fd-input-group__input.is-focus,.fd-input-group .fd-input-group__input:focus{-webkit-box-shadow:none;background:var(--fdInputGroup_Input_Background, none);border-radius:0;box-shadow:none;outline:none;z-index:5}.fd-input-group .fd-input-group__input:first-child{padding-left:.625rem}.fd-input-group .fd-input-group__input:first-child[dir=rtl],[dir=rtl] .fd-input-group .fd-input-group__input:first-child{padding-left:0;padding-right:.625rem}.fd-input-group .fd-input-group__input:last-child{padding-right:.625rem}.fd-input-group .fd-input-group__input:last-child[dir=rtl],[dir=rtl] .fd-input-group .fd-input-group__input:last-child{padding-left:.625rem;padding-right:.25rem}.fd-input-group--inline{display:inline-flex;vertical-align:bottom;width:auto}.fd-input-group__addon{-webkit-box-sizing:border-box;-webkit-box-pack:center;-ms-flex-pack:center;align-items:center;background:var(--fdInputGroup_Addon_Background, none);border:0;box-sizing:border-box;color:var(--sapTextColor);color:var(--sapContent_NonInteractiveIconColor);display:flex;font-family:var(--sapFontFamily);font-size:var(--sapFontSize);font-size:var(--sapFontLargeSize);font-weight:400;forced-color-adjust:none;justify-content:center;line-height:var(--sapContent_LineHeight);margin:0;min-height:var(--fdInput_Group_Addon_Height, 2.25rem);min-width:var(--fdInput_Group_Addon_Width, 2.25rem);overflow:hidden;padding:0 .625rem;text-overflow:ellipsis;white-space:nowrap}.fd-input-group__addon:after,.fd-input-group__addon:before{box-sizing:inherit;font-size:inherit}.fd-input-group__addon span[class*=sap-icon--]:before{font-size:var(--sapFontLargeSize)}.fd-input-group__addon--readonly{opacity:.4}.fd-input-group__addon--button{overflow:visible;padding:0}.fd-input-group--control[aria-expanded=true]{margin-bottom:0}.fd-input-group[class*=-compact],.fd-input-group[class*=-condensed],[class*=-compact] .fd-input-group:not([class*=-cozy]),[class*=-condensed] .fd-input-group:not([class*=-cozy]){--fdInput_Field_Margin:.1875rem 0;--fdInput_Field_Compact_Margin:0;--fdInput_Group_Addon_Width:2rem;--fdInput_Group_Addon_Height:1.625rem}.fd-input-group .fd-textarea{resize:vertical}.fd-input-group .is-disabled,.fd-input-group :disabled,.fd-input-group [aria-disabled=true]{opacity:1}.fd-input-group.is-readonly,.fd-input-group[readonly]{overflow:visible}.fd-input-group .fd-tokenizer,.fd-input-group .fd-tokenizer.is-focus,.fd-input-group .fd-tokenizer.is-hover,.fd-input-group .fd-tokenizer:focus,.fd-input-group .fd-tokenizer:hover{-webkit-box-shadow:none;background:none;background-color:var(transparent, transparent);box-shadow:none}.fd-input-group .fd-tokenizer.is-focus,.fd-input-group .fd-tokenizer:focus{outline:none;z-index:5}.fdp-input-group .fd-input-group>fdp-input{flex:1 1 auto;display:flex}.fdp-input-group .fd-input-group>fdp-input .fd-input-group__input,.fdp-input-group .fd-input-group>fdp-input .fd-input-group__input:first-child,.fdp-input-group .fd-input-group>fdp-input .fd-input-group__input:last-child{padding-left:.25rem;padding-right:.25rem}.fdp-input-group .fd-input-group>fdp-input:nth-child(n+1) .fd-input-group__input{margin:0}.fdp-input-group .fd-input-group>fdp-input:nth-child(1) .fd-input-group__input{padding-left:.625rem;padding-right:.25rem}.fdp-input-group .fd-input-group>fdp-input:nth-last-child(1) .fd-input-group__input{padding-left:.25rem;padding-right:.625rem}.fdp-input-group .fd-input-group__addon>fdp-button{display:flex;height:100%;max-height:100%}[dir=rtl] .fdp-input-group .fd-input-group fdp-input:nth-child(1) .fd-input-group__input{padding-left:.25rem;padding-right:.625rem}[dir=rtl] .fdp-input-group .fd-input-group fdp-input:nth-last-child(1) .fd-input-group__input{padding-left:.625rem;padding-right:.25rem}\n"], dependencies: [{ kind: "directive", type: i3.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i3.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i3.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: InputComponent, selector: "fdp-input", inputs: ["type", "required", "value"], outputs: ["focusChange"] }, { kind: "component", type: InputGroupAddonBodyComponent, selector: "fdp-input-group-addon-body", inputs: ["hasButton"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
+        ], queries: [{ propertyName: "_input", first: true, predicate: InputGroupInputComponent, descendants: true }, { propertyName: "_children", predicate: INPUT_GROUP_CHILD_TOKEN }], viewQueries: [{ propertyName: "_inputComponentElement", first: true, predicate: InputComponent, descendants: true, read: ElementRef }], usesInheritance: true, ngImport: i0, template: "<div class=\"fd-input-group\" [class.is-disabled]=\"disabled\" [class]=\"_controlStateClass\" [class.is-focus]=\"focused\">\n    <!-- Before input addons area -->\n    <fdp-input-group-addon-body *ngFor=\"let addon of _beforeInputAddons\">\n        <ng-container *ngTemplateOutlet=\"addon.contentTemplateRef\"></ng-container>\n    </fdp-input-group-addon-body>\n\n    <!-- Input -->\n    <ng-container *ngIf=\"_input\">\n        <fdp-input\n            [name]=\"name\"\n            [id]=\"id\"\n            [placeholder]=\"placeholder\"\n            [type]=\"_input.type\"\n            [disabled]=\"disabled\"\n            [value]=\"value\"\n            [ariaLabel]=\"ariaLabel\"\n            [ariaLabelledBy]=\"ariaLabelledBy\"\n            [required]=\"required\"\n            (input)=\"_onChangeInputValue($any($event.target)?.value)\"\n            (focusChange)=\"_onFocusChanged($event)\"\n            (keypress)=\"_onKeyPress($event)\"\n        ></fdp-input>\n    </ng-container>\n\n    <!-- After input addons area -->\n    <fdp-input-group-addon-body *ngFor=\"let addon of _afterInputAddons\" [hasButton]=\"!!addon.button\">\n        <ng-container *ngTemplateOutlet=\"addon.contentTemplateRef\"></ng-container>\n    </fdp-input-group-addon-body>\n</div>\n", styles: ["/*!\n * Fundamental Library Styles v0.30.2-rc.6\n * Copyright (c) 2023 SAP SE or an SAP affiliate company.\n * Licensed under Apache License 2.0 (https://github.com/SAP/fundamental-styles/blob/main/LICENSE)\n */.fd-input-group{-webkit-box-sizing:border-box;-webkit-box-shadow:var(--sapField_Shadow);-webkit-appearance:none;appearance:none;background:var(--fdInputGroup_Background, var(--sapField_BackgroundStyle));background-color:var(--fdInputGroup_Background_Color, var(--sapField_Background));border:0;border:var(--sapField_BorderWidth) var(--sapField_BorderStyle) var(--sapField_BorderColor);border-radius:var(--sapField_BorderCornerRadius);box-shadow:var(--sapField_Shadow);box-sizing:border-box;color:var(--sapTextColor);color:var(--sapField_TextColor);cursor:text;display:flex;font-family:var(--sapFontFamily);font-size:var(--sapFontSize);font-weight:400;forced-color-adjust:none;height:auto;line-height:var(--sapContent_LineHeight);margin:0;margin:var(--fdInput_Field_Margin, .25rem 0);min-width:var(2.75rem, 2.75rem);outline:none;overflow:hidden;padding:0;text-overflow:ellipsis;text-shadow:var(--fdInput_Text_Shadow);white-space:nowrap;width:100%;z-index:1}.fd-input-group:after,.fd-input-group:before{box-sizing:inherit;font-size:inherit}.fd-input-group::placeholder{color:var(--sapField_PlaceholderTextColor);font-style:var(--fdPlaceholder_Font_Style)}.fd-input-group[dir=rtl]::placeholder,[dir=rtl] .fd-input-group::placeholder{text-indent:.125rem}.fd-input-group::selection{background-color:var(--sapSelectedColor);color:var(--sapContent_ContrastTextColor)}.fd-input-group::-ms-clear{display:none}.fd-input-group.is-hover,.fd-input-group:hover{-webkit-box-shadow:var(--fdInput_Box_Shadow_Hover);background:var(--fdInputGroup_Hover_Background, var(--sapField_Hover_BackgroundStyle));background-color:var(--fdInputGroup_Hover_Background_Color, var(--sapField_Hover_Background));border-color:var(--sapField_Hover_BorderColor);box-shadow:var(--fdInput_Box_Shadow_Hover)}.fd-input-group.is-focus,.fd-input-group:focus{-webkit-box-shadow:none;background:var(--sapField_Focus_Background, var(--sapField_Focus_Background));box-shadow:none;outline-color:var(--fdInput_Outline_Color);outline-offset:var(--fdInput_Outline_Offset);outline-style:var(--sapContent_FocusStyle);outline-width:var(--sapContent_FocusWidth);z-index:5}.fd-input-group.is-success{-webkit-box-shadow:var(--sapField_SuccessShadow);background:var(--sapField_SuccessBackgroundStyle);background-color:var(--sapField_SuccessBackground);border:var(--sapField_SuccessColor) var(--sapField_SuccessBorderWidth) var(--sapField_SuccessBorderStyle);box-shadow:var(--sapField_SuccessShadow)}.fd-input-group.is-success.is-hover,.fd-input-group.is-success:hover{-webkit-box-shadow:var(--fdInput_Success_Box_Shadow_Hover);background-color:var(--fdInput_Success_Background_Color_Hover);border-color:var(--sapField_SuccessColor);box-shadow:var(--fdInput_Success_Box_Shadow_Hover)}.fd-input-group.is-success.is-focus,.fd-input-group.is-success:focus{background:var(--sapField_Focus_Background);outline-color:var(--fdInput_Success_Outline_Color)}.fd-input-group.is-success.is-focus.is-hover,.fd-input-group.is-success.is-focus:hover,.fd-input-group.is-success:focus.is-hover,.fd-input-group.is-success:focus:hover{box-shadow:none}.fd-input-group.is-success.is-expanded,.fd-input-group.is-success[aria-expanded=true]{-webkit-box-shadow:none;background:var(--sapField_Focus_Background);box-shadow:none;outline:var(--sapContent_FocusWidth) var(--sapContent_FocusStyle) var(--fdInput_Success_Outline_Color);outline-offset:var(--fdInput_Outline_Offset)}.fd-input-group.is-error{-webkit-box-shadow:var(--sapField_InvalidShadow);background:var(--sapField_InvalidBackgroundStyle);background-color:var(--sapField_InvalidBackground);border:var(--sapField_InvalidColor) var(--sapField_InvalidBorderWidth) var(--sapField_InvalidBorderStyle);box-shadow:var(--sapField_InvalidShadow)}.fd-input-group.is-error.is-hover,.fd-input-group.is-error:hover{-webkit-box-shadow:var(--fdInput_Error_Box_Shadow_Hover);background-color:var(--fdInput_Error_Background_Color_Hover);border-color:var(--sapField_InvalidColor);box-shadow:var(--fdInput_Error_Box_Shadow_Hover)}.fd-input-group.is-error.is-focus,.fd-input-group.is-error:focus{background:var(--sapField_Focus_Background);outline-color:var(--fdInput_Error_Outline_Color)}.fd-input-group.is-error.is-focus.is-hover,.fd-input-group.is-error.is-focus:hover,.fd-input-group.is-error:focus.is-hover,.fd-input-group.is-error:focus:hover{box-shadow:none}.fd-input-group.is-error.is-expanded,.fd-input-group.is-error[aria-expanded=true]{-webkit-box-shadow:none;background:var(--sapField_Focus_Background);box-shadow:none;outline:var(--sapContent_FocusWidth) var(--sapContent_FocusStyle) var(--fdInput_Error_Outline_Color);outline-offset:var(--fdInput_Outline_Offset)}.fd-input-group.is-warning{-webkit-box-shadow:var(--sapField_WarningShadow);background:var(--sapField_WarningBackgroundStyle);background-color:var(--sapField_WarningBackground);border:var(--sapField_WarningColor) var(--sapField_WarningBorderWidth) var(--sapField_WarningBorderStyle);box-shadow:var(--sapField_WarningShadow)}.fd-input-group.is-warning.is-hover,.fd-input-group.is-warning:hover{-webkit-box-shadow:var(--fdInput_Warning_Box_Shadow_Hover);background-color:var(--fdInput_Warning_Background_Color_Hover);border-color:var(--sapField_WarningColor);box-shadow:var(--fdInput_Warning_Box_Shadow_Hover)}.fd-input-group.is-warning.is-focus,.fd-input-group.is-warning:focus{background:var(--sapField_Focus_Background);outline-color:var(--fdInput_Warning_Outline_Color)}.fd-input-group.is-warning.is-focus.is-hover,.fd-input-group.is-warning.is-focus:hover,.fd-input-group.is-warning:focus.is-hover,.fd-input-group.is-warning:focus:hover{box-shadow:none}.fd-input-group.is-warning.is-expanded,.fd-input-group.is-warning[aria-expanded=true]{-webkit-box-shadow:none;background:var(--sapField_Focus_Background);box-shadow:none;outline:var(--sapContent_FocusWidth) var(--sapContent_FocusStyle) var(--fdInput_Warning_Outline_Color);outline-offset:var(--fdInput_Outline_Offset)}.fd-input-group.is-alert{background:var(--sapField_WarningBackgroundStyle);background-color:var(--sapField_WarningBackground);border:var(--sapField_WarningColor) var(--sapField_WarningBorderWidth) var(--sapField_WarningBorderStyle)}.fd-input-group.is-alert.is-hover,.fd-input-group.is-alert:hover{-webkit-box-shadow:var(--fdInput_Warning_Box_Shadow_Hover);background-color:var(--fdInput_Warning_Background_Color_Hover);border-color:var(--sapField_WarningColor);box-shadow:var(--fdInput_Warning_Box_Shadow_Hover)}.fd-input-group.is-alert.is-focus,.fd-input-group.is-alert:focus{background:var(--sapField_Focus_Background);outline-color:var(--fdInput_Warning_Outline_Color)}.fd-input-group.is-alert.is-focus.is-hover,.fd-input-group.is-alert.is-focus:hover,.fd-input-group.is-alert:focus.is-hover,.fd-input-group.is-alert:focus:hover{box-shadow:none}.fd-input-group.is-alert.is-expanded,.fd-input-group.is-alert[aria-expanded=true]{-webkit-box-shadow:none;background:var(--sapField_Focus_Background);box-shadow:none;outline:var(--sapContent_FocusWidth) var(--sapContent_FocusStyle) var(--fdInput_Warning_Outline_Color);outline-offset:var(--fdInput_Outline_Offset)}.fd-input-group.is-information{-webkit-box-shadow:var(--sapField_InformationShadow);background:var(--sapField_InformationBackgroundStyle);background-color:var(--sapField_InformationBackground);border:var(--sapField_InformationColor) var(--sapField_InformationBorderWidth) var(--sapField_InformationBorderStyle);box-shadow:var(--sapField_InformationShadow)}.fd-input-group.is-information.is-hover,.fd-input-group.is-information:hover{-webkit-box-shadow:var(--fdInput_Information_Box_Shadow_Hover);background-color:var(--fdInput_Information_Background_Color_Hover);border-color:var(--sapField_InformationColor);box-shadow:var(--fdInput_Information_Box_Shadow_Hover)}.fd-input-group.is-information.is-focus,.fd-input-group.is-information:focus{background:var(--sapField_Focus_Background);outline-color:var(--fdInput_Information_Outline_Color)}.fd-input-group.is-information.is-focus.is-hover,.fd-input-group.is-information.is-focus:hover,.fd-input-group.is-information:focus.is-hover,.fd-input-group.is-information:focus:hover{box-shadow:none}.fd-input-group.is-information.is-expanded,.fd-input-group.is-information[aria-expanded=true]{-webkit-box-shadow:none;background:var(--sapField_Focus_Background);box-shadow:none;outline:var(--sapContent_FocusWidth) var(--sapContent_FocusStyle) var(--fdInput_Information_Outline_Color);outline-offset:var(--fdInput_Outline_Offset)}.fd-input-group.is-alert,.fd-input-group.is-error,.fd-input-group.is-warning{font-style:var(--fdInput_State_Text_Style);font-weight:var(--fdInput_State_Font_Weight)}.fd-input-group.is-alert::placeholder,.fd-input-group.is-error::placeholder,.fd-input-group.is-warning::placeholder{font-weight:var(--fdInput_State_Font_Weight)}.fd-input-group.is-alert.is-focus,.fd-input-group.is-alert:focus,.fd-input-group.is-error.is-focus,.fd-input-group.is-error:focus,.fd-input-group.is-information.is-focus,.fd-input-group.is-information:focus,.fd-input-group.is-warning.is-focus,.fd-input-group.is-warning:focus{outline-offset:var(--fdInput_Outline_Offset_States);z-index:5}.fd-input-group.is-error::placeholder{color:var(--sapField_TextColor)}.fd-input-group.is-disabled,.fd-input-group:disabled,.fd-input-group[aria-disabled=true]{opacity:var(--sapContent_DisabledOpacity);pointer-events:none}.fd-input-group.is-disabled::placeholder,.fd-input-group:disabled::placeholder,.fd-input-group[aria-disabled=true]::placeholder{color:var(--fdInput_Non_Interactive_State_Placeholder_Color)}.fd-input-group.is-readonly,.fd-input-group[aria-readonly=true],.fd-input-group[readonly]{-webkit-box-shadow:none;background:var(--sapField_ReadOnly_BackgroundStyle);background-color:var(--sapField_ReadOnly_Background);border-color:var(--sapField_ReadOnly_BorderColor);box-shadow:none}.fd-input-group.is-readonly::placeholder,.fd-input-group[aria-readonly=true]::placeholder,.fd-input-group[readonly]::placeholder{color:var(--fdInput_Non_Interactive_State_Placeholder_Color)}.fd-input-group.is-readonly.is-hover,.fd-input-group.is-readonly:hover,.fd-input-group[aria-readonly=true].is-hover,.fd-input-group[aria-readonly=true]:hover,.fd-input-group[readonly].is-hover,.fd-input-group[readonly]:hover{-webkit-box-shadow:none;background:var(--sapField_ReadOnly_BackgroundStyle);background-color:var(--sapField_ReadOnly_Background);border-color:var(--sapField_ReadOnly_BorderColor);box-shadow:none}.fd-input-group.is-readonly.is-focus,.fd-input-group.is-readonly:focus,.fd-input-group[aria-readonly=true].is-focus,.fd-input-group[aria-readonly=true]:focus,.fd-input-group[readonly].is-focus,.fd-input-group[readonly]:focus{-webkit-box-shadow:none;background:var(--sapField_ReadOnly_BackgroundStyle);background-color:var(--sapField_ReadOnly_Background);border-color:var(--sapField_ReadOnly_BorderColor);box-shadow:none;z-index:5}.fd-input-group .fd-input-group__button:first-child{border-right:var(--fdInputGroup_ControlButton_SideBorder)}.fd-input-group .fd-input-group__button:first-child[dir=rtl],[dir=rtl] .fd-input-group .fd-input-group__button:first-child{border-left:var(--fdInputGroup_ControlButton_SideBorder);border-right-style:none}.fd-input-group .fd-input-group__button:first-child.is-hover,.fd-input-group .fd-input-group__button:first-child:hover{border-right:var(--fdInputGroup_ControlButton_SideBorder_Active)}.fd-input-group .fd-input-group__button:first-child.is-hover[dir=rtl],.fd-input-group .fd-input-group__button:first-child:hover[dir=rtl],[dir=rtl] .fd-input-group .fd-input-group__button:first-child.is-hover,[dir=rtl] .fd-input-group .fd-input-group__button:first-child:hover{border-left:var(--fdInputGroup_ControlButton_SideBorder_Active);border-right-style:none}.fd-input-group .fd-input-group__button:first-child.is-active,.fd-input-group .fd-input-group__button:first-child:active{border-right:var(--fdInputGroup_ControlButton_SideBorder_Active)}.fd-input-group .fd-input-group__button:first-child.is-active[dir=rtl],.fd-input-group .fd-input-group__button:first-child:active[dir=rtl],[dir=rtl] .fd-input-group .fd-input-group__button:first-child.is-active,[dir=rtl] .fd-input-group .fd-input-group__button:first-child:active{border-left:var(--fdInputGroup_ControlButton_SideBorder_Active);border-right-style:none}.fd-input-group .fd-input-group__button:not(:first-child){border-left:var(--fdInputGroup_ControlButton_SideBorder)}.fd-input-group .fd-input-group__button:not(:first-child)[dir=rtl],[dir=rtl] .fd-input-group .fd-input-group__button:not(:first-child){border-left-style:none;border-right:var(--fdInputGroup_ControlButton_SideBorder)}.fd-input-group .fd-input-group__button:not(:first-child).is-hover,.fd-input-group .fd-input-group__button:not(:first-child):hover{border-left:var(--fdInputGroup_ControlButton_SideBorder_Active)}.fd-input-group .fd-input-group__button:not(:first-child).is-hover[dir=rtl],.fd-input-group .fd-input-group__button:not(:first-child):hover[dir=rtl],[dir=rtl] .fd-input-group .fd-input-group__button:not(:first-child).is-hover,[dir=rtl] .fd-input-group .fd-input-group__button:not(:first-child):hover{border-left-style:none;border-right:var(--fdInputGroup_ControlButton_SideBorder_Active)}.fd-input-group .fd-input-group__button:not(:first-child).is-active,.fd-input-group .fd-input-group__button:not(:first-child):active{border-left:var(--fdInputGroup_ControlButton_SideBorder_Active)}.fd-input-group .fd-input-group__button:not(:first-child).is-active[dir=rtl],.fd-input-group .fd-input-group__button:not(:first-child):active[dir=rtl],[dir=rtl] .fd-input-group .fd-input-group__button:not(:first-child).is-active,[dir=rtl] .fd-input-group .fd-input-group__button:not(:first-child):active{border-left-style:none;border-right:var(--fdInputGroup_ControlButton_SideBorder_Active)}.fd-input-group .fd-input-group__addon:first-child .fd-input-group__button{border-right:var(--fdInputGroup_ControlButton_SideBorder)}.fd-input-group .fd-input-group__addon:first-child .fd-input-group__button[dir=rtl],[dir=rtl] .fd-input-group .fd-input-group__addon:first-child .fd-input-group__button{border-left:var(--fdInputGroup_ControlButton_SideBorder);border-right-style:none}.fd-input-group .fd-input-group__addon:first-child .fd-input-group__button.is-hover,.fd-input-group .fd-input-group__addon:first-child .fd-input-group__button:hover{border-right:var(--fdInputGroup_ControlButton_SideBorder_Active)}.fd-input-group .fd-input-group__addon:first-child .fd-input-group__button.is-hover[dir=rtl],.fd-input-group .fd-input-group__addon:first-child .fd-input-group__button:hover[dir=rtl],[dir=rtl] .fd-input-group .fd-input-group__addon:first-child .fd-input-group__button.is-hover,[dir=rtl] .fd-input-group .fd-input-group__addon:first-child .fd-input-group__button:hover{border-left:var(--fdInputGroup_ControlButton_SideBorder_Active);border-right-style:none}.fd-input-group .fd-input-group__addon:first-child .fd-input-group__button.is-active,.fd-input-group .fd-input-group__addon:first-child .fd-input-group__button:active{border-right:var(--fdInputGroup_ControlButton_SideBorder_Active)}.fd-input-group .fd-input-group__addon:first-child .fd-input-group__button.is-active[dir=rtl],.fd-input-group .fd-input-group__addon:first-child .fd-input-group__button:active[dir=rtl],[dir=rtl] .fd-input-group .fd-input-group__addon:first-child .fd-input-group__button.is-active,[dir=rtl] .fd-input-group .fd-input-group__addon:first-child .fd-input-group__button:active{border-left:var(--fdInputGroup_ControlButton_SideBorder_Active);border-right-style:none}.fd-input-group .fd-input-group__addon:not(:first-child) .fd-input-group__button{border-left:var(--fdInputGroup_ControlButton_SideBorder)}.fd-input-group .fd-input-group__addon:not(:first-child) .fd-input-group__button[dir=rtl],[dir=rtl] .fd-input-group .fd-input-group__addon:not(:first-child) .fd-input-group__button{border-left-style:none;border-right:var(--fdInputGroup_ControlButton_SideBorder)}.fd-input-group .fd-input-group__addon:not(:first-child) .fd-input-group__button.is-hover,.fd-input-group .fd-input-group__addon:not(:first-child) .fd-input-group__button:hover{border-left:var(--fdInputGroup_ControlButton_SideBorder_Active)}.fd-input-group .fd-input-group__addon:not(:first-child) .fd-input-group__button.is-hover[dir=rtl],.fd-input-group .fd-input-group__addon:not(:first-child) .fd-input-group__button:hover[dir=rtl],[dir=rtl] .fd-input-group .fd-input-group__addon:not(:first-child) .fd-input-group__button.is-hover,[dir=rtl] .fd-input-group .fd-input-group__addon:not(:first-child) .fd-input-group__button:hover{border-left-style:none;border-right:var(--fdInputGroup_ControlButton_SideBorder_Active)}.fd-input-group .fd-input-group__addon:not(:first-child) .fd-input-group__button.is-active,.fd-input-group .fd-input-group__addon:not(:first-child) .fd-input-group__button:active{border-left:var(--fdInputGroup_ControlButton_SideBorder_Active)}.fd-input-group .fd-input-group__addon:not(:first-child) .fd-input-group__button.is-active[dir=rtl],.fd-input-group .fd-input-group__addon:not(:first-child) .fd-input-group__button:active[dir=rtl],[dir=rtl] .fd-input-group .fd-input-group__addon:not(:first-child) .fd-input-group__button.is-active,[dir=rtl] .fd-input-group .fd-input-group__addon:not(:first-child) .fd-input-group__button:active{border-left-style:none;border-right:var(--fdInputGroup_ControlButton_SideBorder_Active)}.fd-input-group .fd-input-group__button{background:var(--fdInput_Group_Button_Background);background-color:var(--fdButtonBackgroundColor);border:none;border-radius:var(--fdInput_Group_Button_Border_Raduis);color:var(--fdInput_Group_Button_Text_Color);overflow:hidden;position:relative;text-overflow:ellipsis;white-space:nowrap;z-index:auto!important}.fd-input-group .fd-input-group__button:before{display:none!important}.fd-input-group .fd-input-group__button:after{border-radius:var(--fdInput_Outline_Border_Radius)}.fd-input-group .fd-input-group__button.is-hover,.fd-input-group .fd-input-group__button:hover{--fdInput_Group_Button_Text_Color:var(--fdInput_Group_Button_Hover_Text_Color);--fdButtonBackgroundColor:var(--fdInput_Group_Button_Hover_Background);box-shadow:var(--fdInput_Group_Button_Box_Shadow)}.fd-input-group .fd-input-group__button.is-active,.fd-input-group .fd-input-group__button:active{-webkit-box-shadow:var(--fdInput_Group_Button_Box_Shadow);background:var(--fdInput_Group_Button_Active_Background);box-shadow:var(--fdInput_Group_Button_Box_Shadow);color:var(--fdInput_Group_Button_Active_Text_Color)}.fd-input-group.is-success.is-focus,.fd-input-group.is-success:focus{z-index:5}.fd-input-group.is-success.is-focus .fd-input-group__button,.fd-input-group.is-success:focus .fd-input-group__button{-webkit-box-shadow:var(--fdInput_Group_Button_Success_Active_Box_Shadow);--fdButtonBackgroundColor:var(--fdInput_Group_Button_Active_Background);box-shadow:var(--fdInput_Group_Button_Success_Active_Box_Shadow);color:var(--fdInput_Group_Button_Success_Active_Text_Color)}.fd-input-group.is-success.is-focus .fd-input-group__button.is-hover,.fd-input-group.is-success.is-focus .fd-input-group__button:hover,.fd-input-group.is-success:focus .fd-input-group__button.is-hover,.fd-input-group.is-success:focus .fd-input-group__button:hover{--fdButtonBackgroundColor:var(--fdInput_Group_Button_Active_Background)}.fd-input-group.is-success.is-expanded .fd-input-group__button,.fd-input-group.is-success[aria-expanded=true] .fd-input-group__button{-webkit-box-shadow:var(--fdInput_Group_Button_Success_Active_Box_Shadow);--fdButtonBackgroundColor:var(--fdInput_Group_Button_Active_Background);box-shadow:var(--fdInput_Group_Button_Success_Active_Box_Shadow);color:var(--fdInput_Group_Button_Success_Active_Text_Color)}.fd-input-group.is-success.is-expanded .fd-input-group__button.is-hover,.fd-input-group.is-success.is-expanded .fd-input-group__button:hover,.fd-input-group.is-success[aria-expanded=true] .fd-input-group__button.is-hover,.fd-input-group.is-success[aria-expanded=true] .fd-input-group__button:hover{--fdButtonBackgroundColor:var(--fdInput_Group_Button_Active_Background)}.fd-input-group.is-success .fd-input-group__button.is-active,.fd-input-group.is-success .fd-input-group__button.is-hover,.fd-input-group.is-success .fd-input-group__button:active,.fd-input-group.is-success .fd-input-group__button:hover{box-shadow:var(--fdInput_Group_Button_Success_Active_Box_Shadow)}.fd-input-group.is-success .fd-input-group__button.is-active,.fd-input-group.is-success .fd-input-group__button:active{color:var(--fdInput_Group_Button_Success_Active_Text_Color)}.fd-input-group.is-error.is-focus,.fd-input-group.is-error:focus{z-index:5}.fd-input-group.is-error.is-focus .fd-input-group__button,.fd-input-group.is-error:focus .fd-input-group__button{-webkit-box-shadow:var(--fdInput_Group_Button_Error_Active_Box_Shadow);--fdButtonBackgroundColor:var(--fdInput_Group_Button_Active_Background);box-shadow:var(--fdInput_Group_Button_Error_Active_Box_Shadow);color:var(--fdInput_Group_Button_Error_Active_Text_Color)}.fd-input-group.is-error.is-focus .fd-input-group__button.is-hover,.fd-input-group.is-error.is-focus .fd-input-group__button:hover,.fd-input-group.is-error:focus .fd-input-group__button.is-hover,.fd-input-group.is-error:focus .fd-input-group__button:hover{--fdButtonBackgroundColor:var(--fdInput_Group_Button_Active_Background)}.fd-input-group.is-error.is-expanded .fd-input-group__button,.fd-input-group.is-error[aria-expanded=true] .fd-input-group__button{-webkit-box-shadow:var(--fdInput_Group_Button_Error_Active_Box_Shadow);--fdButtonBackgroundColor:var(--fdInput_Group_Button_Active_Background);box-shadow:var(--fdInput_Group_Button_Error_Active_Box_Shadow);color:var(--fdInput_Group_Button_Error_Active_Text_Color)}.fd-input-group.is-error.is-expanded .fd-input-group__button.is-hover,.fd-input-group.is-error.is-expanded .fd-input-group__button:hover,.fd-input-group.is-error[aria-expanded=true] .fd-input-group__button.is-hover,.fd-input-group.is-error[aria-expanded=true] .fd-input-group__button:hover{--fdButtonBackgroundColor:var(--fdInput_Group_Button_Active_Background)}.fd-input-group.is-error .fd-input-group__button.is-active,.fd-input-group.is-error .fd-input-group__button.is-hover,.fd-input-group.is-error .fd-input-group__button:active,.fd-input-group.is-error .fd-input-group__button:hover{box-shadow:var(--fdInput_Group_Button_Error_Active_Box_Shadow)}.fd-input-group.is-error .fd-input-group__button.is-active,.fd-input-group.is-error .fd-input-group__button:active{color:var(--fdInput_Group_Button_Error_Active_Text_Color)}.fd-input-group.is-warning.is-focus,.fd-input-group.is-warning:focus{z-index:5}.fd-input-group.is-warning.is-focus .fd-input-group__button,.fd-input-group.is-warning:focus .fd-input-group__button{-webkit-box-shadow:var(--fdInput_Group_Button_Warning_Active_Box_Shadow);--fdButtonBackgroundColor:var(--fdInput_Group_Button_Active_Background);box-shadow:var(--fdInput_Group_Button_Warning_Active_Box_Shadow);color:var(--fdInput_Group_Button_Warning_Active_Text_Color)}.fd-input-group.is-warning.is-focus .fd-input-group__button.is-hover,.fd-input-group.is-warning.is-focus .fd-input-group__button:hover,.fd-input-group.is-warning:focus .fd-input-group__button.is-hover,.fd-input-group.is-warning:focus .fd-input-group__button:hover{--fdButtonBackgroundColor:var(--fdInput_Group_Button_Active_Background)}.fd-input-group.is-warning.is-expanded .fd-input-group__button,.fd-input-group.is-warning[aria-expanded=true] .fd-input-group__button{-webkit-box-shadow:var(--fdInput_Group_Button_Warning_Active_Box_Shadow);--fdButtonBackgroundColor:var(--fdInput_Group_Button_Active_Background);box-shadow:var(--fdInput_Group_Button_Warning_Active_Box_Shadow);color:var(--fdInput_Group_Button_Warning_Active_Text_Color)}.fd-input-group.is-warning.is-expanded .fd-input-group__button.is-hover,.fd-input-group.is-warning.is-expanded .fd-input-group__button:hover,.fd-input-group.is-warning[aria-expanded=true] .fd-input-group__button.is-hover,.fd-input-group.is-warning[aria-expanded=true] .fd-input-group__button:hover{--fdButtonBackgroundColor:var(--fdInput_Group_Button_Active_Background)}.fd-input-group.is-warning .fd-input-group__button.is-active,.fd-input-group.is-warning .fd-input-group__button.is-hover,.fd-input-group.is-warning .fd-input-group__button:active,.fd-input-group.is-warning .fd-input-group__button:hover{box-shadow:var(--fdInput_Group_Button_Warning_Active_Box_Shadow)}.fd-input-group.is-warning .fd-input-group__button.is-active,.fd-input-group.is-warning .fd-input-group__button:active{color:var(--fdInput_Group_Button_Warning_Active_Text_Color)}.fd-input-group.is-alert.is-focus,.fd-input-group.is-alert:focus{z-index:5}.fd-input-group.is-alert.is-focus .fd-input-group__button,.fd-input-group.is-alert:focus .fd-input-group__button{-webkit-box-shadow:var(--fdInput_Group_Button_Warning_Active_Box_Shadow);--fdButtonBackgroundColor:var(--fdInput_Group_Button_Active_Background);box-shadow:var(--fdInput_Group_Button_Warning_Active_Box_Shadow);color:var(--fdInput_Group_Button_Warning_Active_Text_Color)}.fd-input-group.is-alert.is-focus .fd-input-group__button.is-hover,.fd-input-group.is-alert.is-focus .fd-input-group__button:hover,.fd-input-group.is-alert:focus .fd-input-group__button.is-hover,.fd-input-group.is-alert:focus .fd-input-group__button:hover{--fdButtonBackgroundColor:var(--fdInput_Group_Button_Active_Background)}.fd-input-group.is-alert.is-expanded .fd-input-group__button,.fd-input-group.is-alert[aria-expanded=true] .fd-input-group__button{-webkit-box-shadow:var(--fdInput_Group_Button_Warning_Active_Box_Shadow);--fdButtonBackgroundColor:var(--fdInput_Group_Button_Active_Background);box-shadow:var(--fdInput_Group_Button_Warning_Active_Box_Shadow);color:var(--fdInput_Group_Button_Warning_Active_Text_Color)}.fd-input-group.is-alert.is-expanded .fd-input-group__button.is-hover,.fd-input-group.is-alert.is-expanded .fd-input-group__button:hover,.fd-input-group.is-alert[aria-expanded=true] .fd-input-group__button.is-hover,.fd-input-group.is-alert[aria-expanded=true] .fd-input-group__button:hover{--fdButtonBackgroundColor:var(--fdInput_Group_Button_Active_Background)}.fd-input-group.is-alert .fd-input-group__button.is-active,.fd-input-group.is-alert .fd-input-group__button.is-hover,.fd-input-group.is-alert .fd-input-group__button:active,.fd-input-group.is-alert .fd-input-group__button:hover{box-shadow:var(--fdInput_Group_Button_Warning_Active_Box_Shadow)}.fd-input-group.is-alert .fd-input-group__button.is-active,.fd-input-group.is-alert .fd-input-group__button:active{color:var(--fdInput_Group_Button_Warning_Active_Text_Color)}.fd-input-group.is-information.is-focus,.fd-input-group.is-information:focus{z-index:5}.fd-input-group.is-information.is-focus .fd-input-group__button,.fd-input-group.is-information:focus .fd-input-group__button{-webkit-box-shadow:var(--fdInput_Group_Button_Information_Active_Box_Shadow);--fdButtonBackgroundColor:var(--fdInput_Group_Button_Active_Background);box-shadow:var(--fdInput_Group_Button_Information_Active_Box_Shadow);color:var(--fdInput_Group_Button_Information_Active_Text_Color)}.fd-input-group.is-information.is-focus .fd-input-group__button.is-hover,.fd-input-group.is-information.is-focus .fd-input-group__button:hover,.fd-input-group.is-information:focus .fd-input-group__button.is-hover,.fd-input-group.is-information:focus .fd-input-group__button:hover{--fdButtonBackgroundColor:var(--fdInput_Group_Button_Active_Background)}.fd-input-group.is-information.is-expanded .fd-input-group__button,.fd-input-group.is-information[aria-expanded=true] .fd-input-group__button{-webkit-box-shadow:var(--fdInput_Group_Button_Information_Active_Box_Shadow);--fdButtonBackgroundColor:var(--fdInput_Group_Button_Active_Background);box-shadow:var(--fdInput_Group_Button_Information_Active_Box_Shadow);color:var(--fdInput_Group_Button_Information_Active_Text_Color)}.fd-input-group.is-information.is-expanded .fd-input-group__button.is-hover,.fd-input-group.is-information.is-expanded .fd-input-group__button:hover,.fd-input-group.is-information[aria-expanded=true] .fd-input-group__button.is-hover,.fd-input-group.is-information[aria-expanded=true] .fd-input-group__button:hover{--fdButtonBackgroundColor:var(--fdInput_Group_Button_Active_Background)}.fd-input-group.is-information .fd-input-group__button.is-active,.fd-input-group.is-information .fd-input-group__button.is-hover,.fd-input-group.is-information .fd-input-group__button:active,.fd-input-group.is-information .fd-input-group__button:hover{box-shadow:var(--fdInput_Group_Button_Information_Active_Box_Shadow)}.fd-input-group.is-information .fd-input-group__button.is-active,.fd-input-group.is-information .fd-input-group__button:active{color:var(--fdInput_Group_Button_Information_Active_Text_Color)}.fd-input-group .fd-input-group__input{-webkit-box-flex:1;-ms-flex:1 1 10rem;-webkit-box-shadow:none;background:none;background-color:var(--fdInputGroup_Input_Background, transparent);border:var(--fdInputGroup_Input_Border, none);box-shadow:none;color:var(--fdInputGroup_Input_Color, inherit);flex:1 1 10rem;padding-left:.25rem;padding-right:.25rem;text-shadow:var(--fdInputGroup_Text_Shadow)}.fd-input-group .fd-input-group__input:nth-child(n+1){margin:0}.fd-input-group .fd-input-group__input::placeholder{color:var(--fdInputGroup_Input_Placeholder_Color, var(--sapField_PlaceholderTextColor));font-style:var(--fdInputGroup_Input_Placeholder_Style, italic)}.fd-input-group .fd-input-group__input.is-hover,.fd-input-group .fd-input-group__input:hover{-webkit-box-shadow:none;background:none;background-color:var(--fdInputGroup_Hover_Input_Background, transparent);box-shadow:none}.fd-input-group .fd-input-group__input.is-focus,.fd-input-group .fd-input-group__input:focus{-webkit-box-shadow:none;background:var(--fdInputGroup_Input_Background, none);border-radius:0;box-shadow:none;outline:none;z-index:5}.fd-input-group .fd-input-group__input:first-child{padding-left:.625rem}.fd-input-group .fd-input-group__input:first-child[dir=rtl],[dir=rtl] .fd-input-group .fd-input-group__input:first-child{padding-left:0;padding-right:.625rem}.fd-input-group .fd-input-group__input:last-child{padding-right:.625rem}.fd-input-group .fd-input-group__input:last-child[dir=rtl],[dir=rtl] .fd-input-group .fd-input-group__input:last-child{padding-left:.625rem;padding-right:.25rem}.fd-input-group--inline{display:inline-flex;vertical-align:bottom;width:auto}.fd-input-group__addon{-webkit-box-sizing:border-box;-webkit-box-pack:center;-ms-flex-pack:center;align-items:center;background:var(--fdInputGroup_Addon_Background, none);border:0;box-sizing:border-box;color:var(--sapTextColor);color:var(--sapContent_NonInteractiveIconColor);display:flex;font-family:var(--sapFontFamily);font-size:var(--sapFontSize);font-size:var(--sapFontLargeSize);font-weight:400;forced-color-adjust:none;justify-content:center;line-height:var(--sapContent_LineHeight);margin:0;min-height:var(--fdInput_Group_Addon_Height, 2.25rem);min-width:var(--fdInput_Group_Addon_Width, 2.25rem);overflow:hidden;padding:0 .625rem;text-overflow:ellipsis;white-space:nowrap}.fd-input-group__addon:after,.fd-input-group__addon:before{box-sizing:inherit;font-size:inherit}.fd-input-group__addon span[class*=sap-icon--]:before{font-size:var(--sapFontLargeSize)}.fd-input-group__addon--readonly{opacity:.4}.fd-input-group__addon--button{overflow:visible;padding:0}.fd-input-group--control[aria-expanded=true]{margin-bottom:0}.fd-input-group[class*=-compact],.fd-input-group[class*=-condensed],[class*=-compact] .fd-input-group:not([class*=-cozy]),[class*=-condensed] .fd-input-group:not([class*=-cozy]){--fdInput_Field_Margin:.1875rem 0;--fdInput_Field_Compact_Margin:0;--fdInput_Group_Addon_Width:2rem;--fdInput_Group_Addon_Height:1.625rem}.fd-input-group .fd-textarea{resize:vertical}.fd-input-group .is-disabled,.fd-input-group :disabled,.fd-input-group [aria-disabled=true]{opacity:1}.fd-input-group.is-readonly,.fd-input-group[readonly]{overflow:visible}.fd-input-group .fd-tokenizer,.fd-input-group .fd-tokenizer.is-focus,.fd-input-group .fd-tokenizer.is-hover,.fd-input-group .fd-tokenizer:focus,.fd-input-group .fd-tokenizer:hover{-webkit-box-shadow:none;background:none;background-color:var(transparent, transparent);box-shadow:none}.fd-input-group .fd-tokenizer.is-focus,.fd-input-group .fd-tokenizer:focus{outline:none;z-index:5}.fdp-input-group .fd-input-group>fdp-input{flex:1 1 auto;display:flex}.fdp-input-group .fd-input-group>fdp-input .fd-input-group__input,.fdp-input-group .fd-input-group>fdp-input .fd-input-group__input:first-child,.fdp-input-group .fd-input-group>fdp-input .fd-input-group__input:last-child{padding-left:.25rem;padding-right:.25rem}.fdp-input-group .fd-input-group>fdp-input:nth-child(n+1) .fd-input-group__input{margin:0}.fdp-input-group .fd-input-group>fdp-input:nth-child(1) .fd-input-group__input{padding-left:.625rem;padding-right:.25rem}.fdp-input-group .fd-input-group>fdp-input:nth-last-child(1) .fd-input-group__input{padding-left:.25rem;padding-right:.625rem}.fdp-input-group .fd-input-group__addon>fdp-button{display:flex;height:100%;max-height:100%}[dir=rtl] .fdp-input-group .fd-input-group fdp-input:nth-child(1) .fd-input-group__input{padding-left:.25rem;padding-right:.625rem}[dir=rtl] .fdp-input-group .fd-input-group fdp-input:nth-last-child(1) .fd-input-group__input{padding-left:.625rem;padding-right:.25rem}\n"], dependencies: [{ kind: "directive", type: NgFor, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "component", type: InputGroupAddonBodyComponent, selector: "fdp-input-group-addon-body", inputs: ["hasButton"] }, { kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: InputComponent, selector: "fdp-input", inputs: ["type", "required", "value"], outputs: ["focusChange"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.1.0", ngImport: i0, type: InputGroupComponent, decorators: [{
             type: Component,
             args: [{ selector: 'fdp-input-group', encapsulation: ViewEncapsulation.None, changeDetection: ChangeDetectionStrategy.OnPush, providers: [
                         { provide: FD_FORM_FIELD_CONTROL, useExisting: forwardRef(() => InputGroupComponent), multi: true },
                         contentDensityObserverProviders()
-                    ], template: "<div class=\"fd-input-group\" [class.is-disabled]=\"disabled\" [class]=\"_controlStateClass\" [class.is-focus]=\"focused\">\n    <!-- Before input addons area -->\n    <fdp-input-group-addon-body *ngFor=\"let addon of _beforeInputAddons\">\n        <ng-container *ngTemplateOutlet=\"addon.contentTemplateRef\"></ng-container>\n    </fdp-input-group-addon-body>\n\n    <!-- Input -->\n    <ng-container *ngIf=\"_input\">\n        <fdp-input\n            [name]=\"name\"\n            [id]=\"id\"\n            [placeholder]=\"placeholder\"\n            [type]=\"_input.type\"\n            [disabled]=\"disabled\"\n            [value]=\"value\"\n            [ariaLabel]=\"ariaLabel\"\n            [ariaLabelledBy]=\"ariaLabelledBy\"\n            [required]=\"required\"\n            (input)=\"_onChangeInputValue($any($event.target)?.value)\"\n            (focusChange)=\"_onFocusChanged($event)\"\n            (keypress)=\"_onKeyPress($event)\"\n        ></fdp-input>\n    </ng-container>\n\n    <!-- After input addons area -->\n    <fdp-input-group-addon-body *ngFor=\"let addon of _afterInputAddons\" [hasButton]=\"!!addon.button\">\n        <ng-container *ngTemplateOutlet=\"addon.contentTemplateRef\"></ng-container>\n    </fdp-input-group-addon-body>\n</div>\n", styles: ["/*!\n * Fundamental Library Styles v0.30.2-rc.6\n * Copyright (c) 2023 SAP SE or an SAP affiliate company.\n * Licensed under Apache License 2.0 (https://github.com/SAP/fundamental-styles/blob/main/LICENSE)\n */.fd-input-group{-webkit-box-sizing:border-box;-webkit-box-shadow:var(--sapField_Shadow);-webkit-appearance:none;appearance:none;background:var(--fdInputGroup_Background, var(--sapField_BackgroundStyle));background-color:var(--fdInputGroup_Background_Color, var(--sapField_Background));border:0;border:var(--sapField_BorderWidth) var(--sapField_BorderStyle) var(--sapField_BorderColor);border-radius:var(--sapField_BorderCornerRadius);box-shadow:var(--sapField_Shadow);box-sizing:border-box;color:var(--sapTextColor);color:var(--sapField_TextColor);cursor:text;display:flex;font-family:var(--sapFontFamily);font-size:var(--sapFontSize);font-weight:400;forced-color-adjust:none;height:auto;line-height:var(--sapContent_LineHeight);margin:0;margin:var(--fdInput_Field_Margin, .25rem 0);min-width:var(2.75rem, 2.75rem);outline:none;overflow:hidden;padding:0;text-overflow:ellipsis;text-shadow:var(--fdInput_Text_Shadow);white-space:nowrap;width:100%;z-index:1}.fd-input-group:after,.fd-input-group:before{box-sizing:inherit;font-size:inherit}.fd-input-group::placeholder{color:var(--sapField_PlaceholderTextColor);font-style:var(--fdPlaceholder_Font_Style)}.fd-input-group[dir=rtl]::placeholder,[dir=rtl] .fd-input-group::placeholder{text-indent:.125rem}.fd-input-group::selection{background-color:var(--sapSelectedColor);color:var(--sapContent_ContrastTextColor)}.fd-input-group::-ms-clear{display:none}.fd-input-group.is-hover,.fd-input-group:hover{-webkit-box-shadow:var(--fdInput_Box_Shadow_Hover);background:var(--fdInputGroup_Hover_Background, var(--sapField_Hover_BackgroundStyle));background-color:var(--fdInputGroup_Hover_Background_Color, var(--sapField_Hover_Background));border-color:var(--sapField_Hover_BorderColor);box-shadow:var(--fdInput_Box_Shadow_Hover)}.fd-input-group.is-focus,.fd-input-group:focus{-webkit-box-shadow:none;background:var(--sapField_Focus_Background, var(--sapField_Focus_Background));box-shadow:none;outline-color:var(--fdInput_Outline_Color);outline-offset:var(--fdInput_Outline_Offset);outline-style:var(--sapContent_FocusStyle);outline-width:var(--sapContent_FocusWidth);z-index:5}.fd-input-group.is-success{-webkit-box-shadow:var(--sapField_SuccessShadow);background:var(--sapField_SuccessBackgroundStyle);background-color:var(--sapField_SuccessBackground);border:var(--sapField_SuccessColor) var(--sapField_SuccessBorderWidth) var(--sapField_SuccessBorderStyle);box-shadow:var(--sapField_SuccessShadow)}.fd-input-group.is-success.is-hover,.fd-input-group.is-success:hover{-webkit-box-shadow:var(--fdInput_Success_Box_Shadow_Hover);background-color:var(--fdInput_Success_Background_Color_Hover);border-color:var(--sapField_SuccessColor);box-shadow:var(--fdInput_Success_Box_Shadow_Hover)}.fd-input-group.is-success.is-focus,.fd-input-group.is-success:focus{background:var(--sapField_Focus_Background);outline-color:var(--fdInput_Success_Outline_Color)}.fd-input-group.is-success.is-focus.is-hover,.fd-input-group.is-success.is-focus:hover,.fd-input-group.is-success:focus.is-hover,.fd-input-group.is-success:focus:hover{box-shadow:none}.fd-input-group.is-success.is-expanded,.fd-input-group.is-success[aria-expanded=true]{-webkit-box-shadow:none;background:var(--sapField_Focus_Background);box-shadow:none;outline:var(--sapContent_FocusWidth) var(--sapContent_FocusStyle) var(--fdInput_Success_Outline_Color);outline-offset:var(--fdInput_Outline_Offset)}.fd-input-group.is-error{-webkit-box-shadow:var(--sapField_InvalidShadow);background:var(--sapField_InvalidBackgroundStyle);background-color:var(--sapField_InvalidBackground);border:var(--sapField_InvalidColor) var(--sapField_InvalidBorderWidth) var(--sapField_InvalidBorderStyle);box-shadow:var(--sapField_InvalidShadow)}.fd-input-group.is-error.is-hover,.fd-input-group.is-error:hover{-webkit-box-shadow:var(--fdInput_Error_Box_Shadow_Hover);background-color:var(--fdInput_Error_Background_Color_Hover);border-color:var(--sapField_InvalidColor);box-shadow:var(--fdInput_Error_Box_Shadow_Hover)}.fd-input-group.is-error.is-focus,.fd-input-group.is-error:focus{background:var(--sapField_Focus_Background);outline-color:var(--fdInput_Error_Outline_Color)}.fd-input-group.is-error.is-focus.is-hover,.fd-input-group.is-error.is-focus:hover,.fd-input-group.is-error:focus.is-hover,.fd-input-group.is-error:focus:hover{box-shadow:none}.fd-input-group.is-error.is-expanded,.fd-input-group.is-error[aria-expanded=true]{-webkit-box-shadow:none;background:var(--sapField_Focus_Background);box-shadow:none;outline:var(--sapContent_FocusWidth) var(--sapContent_FocusStyle) var(--fdInput_Error_Outline_Color);outline-offset:var(--fdInput_Outline_Offset)}.fd-input-group.is-warning{-webkit-box-shadow:var(--sapField_WarningShadow);background:var(--sapField_WarningBackgroundStyle);background-color:var(--sapField_WarningBackground);border:var(--sapField_WarningColor) var(--sapField_WarningBorderWidth) var(--sapField_WarningBorderStyle);box-shadow:var(--sapField_WarningShadow)}.fd-input-group.is-warning.is-hover,.fd-input-group.is-warning:hover{-webkit-box-shadow:var(--fdInput_Warning_Box_Shadow_Hover);background-color:var(--fdInput_Warning_Background_Color_Hover);border-color:var(--sapField_WarningColor);box-shadow:var(--fdInput_Warning_Box_Shadow_Hover)}.fd-input-group.is-warning.is-focus,.fd-input-group.is-warning:focus{background:var(--sapField_Focus_Background);outline-color:var(--fdInput_Warning_Outline_Color)}.fd-input-group.is-warning.is-focus.is-hover,.fd-input-group.is-warning.is-focus:hover,.fd-input-group.is-warning:focus.is-hover,.fd-input-group.is-warning:focus:hover{box-shadow:none}.fd-input-group.is-warning.is-expanded,.fd-input-group.is-warning[aria-expanded=true]{-webkit-box-shadow:none;background:var(--sapField_Focus_Background);box-shadow:none;outline:var(--sapContent_FocusWidth) var(--sapContent_FocusStyle) var(--fdInput_Warning_Outline_Color);outline-offset:var(--fdInput_Outline_Offset)}.fd-input-group.is-alert{background:var(--sapField_WarningBackgroundStyle);background-color:var(--sapField_WarningBackground);border:var(--sapField_WarningColor) var(--sapField_WarningBorderWidth) var(--sapField_WarningBorderStyle)}.fd-input-group.is-alert.is-hover,.fd-input-group.is-alert:hover{-webkit-box-shadow:var(--fdInput_Warning_Box_Shadow_Hover);background-color:var(--fdInput_Warning_Background_Color_Hover);border-color:var(--sapField_WarningColor);box-shadow:var(--fdInput_Warning_Box_Shadow_Hover)}.fd-input-group.is-alert.is-focus,.fd-input-group.is-alert:focus{background:var(--sapField_Focus_Background);outline-color:var(--fdInput_Warning_Outline_Color)}.fd-input-group.is-alert.is-focus.is-hover,.fd-input-group.is-alert.is-focus:hover,.fd-input-group.is-alert:focus.is-hover,.fd-input-group.is-alert:focus:hover{box-shadow:none}.fd-input-group.is-alert.is-expanded,.fd-input-group.is-alert[aria-expanded=true]{-webkit-box-shadow:none;background:var(--sapField_Focus_Background);box-shadow:none;outline:var(--sapContent_FocusWidth) var(--sapContent_FocusStyle) var(--fdInput_Warning_Outline_Color);outline-offset:var(--fdInput_Outline_Offset)}.fd-input-group.is-information{-webkit-box-shadow:var(--sapField_InformationShadow);background:var(--sapField_InformationBackgroundStyle);background-color:var(--sapField_InformationBackground);border:var(--sapField_InformationColor) var(--sapField_InformationBorderWidth) var(--sapField_InformationBorderStyle);box-shadow:var(--sapField_InformationShadow)}.fd-input-group.is-information.is-hover,.fd-input-group.is-information:hover{-webkit-box-shadow:var(--fdInput_Information_Box_Shadow_Hover);background-color:var(--fdInput_Information_Background_Color_Hover);border-color:var(--sapField_InformationColor);box-shadow:var(--fdInput_Information_Box_Shadow_Hover)}.fd-input-group.is-information.is-focus,.fd-input-group.is-information:focus{background:var(--sapField_Focus_Background);outline-color:var(--fdInput_Information_Outline_Color)}.fd-input-group.is-information.is-focus.is-hover,.fd-input-group.is-information.is-focus:hover,.fd-input-group.is-information:focus.is-hover,.fd-input-group.is-information:focus:hover{box-shadow:none}.fd-input-group.is-information.is-expanded,.fd-input-group.is-information[aria-expanded=true]{-webkit-box-shadow:none;background:var(--sapField_Focus_Background);box-shadow:none;outline:var(--sapContent_FocusWidth) var(--sapContent_FocusStyle) var(--fdInput_Information_Outline_Color);outline-offset:var(--fdInput_Outline_Offset)}.fd-input-group.is-alert,.fd-input-group.is-error,.fd-input-group.is-warning{font-style:var(--fdInput_State_Text_Style);font-weight:var(--fdInput_State_Font_Weight)}.fd-input-group.is-alert::placeholder,.fd-input-group.is-error::placeholder,.fd-input-group.is-warning::placeholder{font-weight:var(--fdInput_State_Font_Weight)}.fd-input-group.is-alert.is-focus,.fd-input-group.is-alert:focus,.fd-input-group.is-error.is-focus,.fd-input-group.is-error:focus,.fd-input-group.is-information.is-focus,.fd-input-group.is-information:focus,.fd-input-group.is-warning.is-focus,.fd-input-group.is-warning:focus{outline-offset:var(--fdInput_Outline_Offset_States);z-index:5}.fd-input-group.is-error::placeholder{color:var(--sapField_TextColor)}.fd-input-group.is-disabled,.fd-input-group:disabled,.fd-input-group[aria-disabled=true]{opacity:var(--sapContent_DisabledOpacity);pointer-events:none}.fd-input-group.is-disabled::placeholder,.fd-input-group:disabled::placeholder,.fd-input-group[aria-disabled=true]::placeholder{color:var(--fdInput_Non_Interactive_State_Placeholder_Color)}.fd-input-group.is-readonly,.fd-input-group[aria-readonly=true],.fd-input-group[readonly]{-webkit-box-shadow:none;background:var(--sapField_ReadOnly_BackgroundStyle);background-color:var(--sapField_ReadOnly_Background);border-color:var(--sapField_ReadOnly_BorderColor);box-shadow:none}.fd-input-group.is-readonly::placeholder,.fd-input-group[aria-readonly=true]::placeholder,.fd-input-group[readonly]::placeholder{color:var(--fdInput_Non_Interactive_State_Placeholder_Color)}.fd-input-group.is-readonly.is-hover,.fd-input-group.is-readonly:hover,.fd-input-group[aria-readonly=true].is-hover,.fd-input-group[aria-readonly=true]:hover,.fd-input-group[readonly].is-hover,.fd-input-group[readonly]:hover{-webkit-box-shadow:none;background:var(--sapField_ReadOnly_BackgroundStyle);background-color:var(--sapField_ReadOnly_Background);border-color:var(--sapField_ReadOnly_BorderColor);box-shadow:none}.fd-input-group.is-readonly.is-focus,.fd-input-group.is-readonly:focus,.fd-input-group[aria-readonly=true].is-focus,.fd-input-group[aria-readonly=true]:focus,.fd-input-group[readonly].is-focus,.fd-input-group[readonly]:focus{-webkit-box-shadow:none;background:var(--sapField_ReadOnly_BackgroundStyle);background-color:var(--sapField_ReadOnly_Background);border-color:var(--sapField_ReadOnly_BorderColor);box-shadow:none;z-index:5}.fd-input-group .fd-input-group__button:first-child{border-right:var(--fdInputGroup_ControlButton_SideBorder)}.fd-input-group .fd-input-group__button:first-child[dir=rtl],[dir=rtl] .fd-input-group .fd-input-group__button:first-child{border-left:var(--fdInputGroup_ControlButton_SideBorder);border-right-style:none}.fd-input-group .fd-input-group__button:first-child.is-hover,.fd-input-group .fd-input-group__button:first-child:hover{border-right:var(--fdInputGroup_ControlButton_SideBorder_Active)}.fd-input-group .fd-input-group__button:first-child.is-hover[dir=rtl],.fd-input-group .fd-input-group__button:first-child:hover[dir=rtl],[dir=rtl] .fd-input-group .fd-input-group__button:first-child.is-hover,[dir=rtl] .fd-input-group .fd-input-group__button:first-child:hover{border-left:var(--fdInputGroup_ControlButton_SideBorder_Active);border-right-style:none}.fd-input-group .fd-input-group__button:first-child.is-active,.fd-input-group .fd-input-group__button:first-child:active{border-right:var(--fdInputGroup_ControlButton_SideBorder_Active)}.fd-input-group .fd-input-group__button:first-child.is-active[dir=rtl],.fd-input-group .fd-input-group__button:first-child:active[dir=rtl],[dir=rtl] .fd-input-group .fd-input-group__button:first-child.is-active,[dir=rtl] .fd-input-group .fd-input-group__button:first-child:active{border-left:var(--fdInputGroup_ControlButton_SideBorder_Active);border-right-style:none}.fd-input-group .fd-input-group__button:not(:first-child){border-left:var(--fdInputGroup_ControlButton_SideBorder)}.fd-input-group .fd-input-group__button:not(:first-child)[dir=rtl],[dir=rtl] .fd-input-group .fd-input-group__button:not(:first-child){border-left-style:none;border-right:var(--fdInputGroup_ControlButton_SideBorder)}.fd-input-group .fd-input-group__button:not(:first-child).is-hover,.fd-input-group .fd-input-group__button:not(:first-child):hover{border-left:var(--fdInputGroup_ControlButton_SideBorder_Active)}.fd-input-group .fd-input-group__button:not(:first-child).is-hover[dir=rtl],.fd-input-group .fd-input-group__button:not(:first-child):hover[dir=rtl],[dir=rtl] .fd-input-group .fd-input-group__button:not(:first-child).is-hover,[dir=rtl] .fd-input-group .fd-input-group__button:not(:first-child):hover{border-left-style:none;border-right:var(--fdInputGroup_ControlButton_SideBorder_Active)}.fd-input-group .fd-input-group__button:not(:first-child).is-active,.fd-input-group .fd-input-group__button:not(:first-child):active{border-left:var(--fdInputGroup_ControlButton_SideBorder_Active)}.fd-input-group .fd-input-group__button:not(:first-child).is-active[dir=rtl],.fd-input-group .fd-input-group__button:not(:first-child):active[dir=rtl],[dir=rtl] .fd-input-group .fd-input-group__button:not(:first-child).is-active,[dir=rtl] .fd-input-group .fd-input-group__button:not(:first-child):active{border-left-style:none;border-right:var(--fdInputGroup_ControlButton_SideBorder_Active)}.fd-input-group .fd-input-group__addon:first-child .fd-input-group__button{border-right:var(--fdInputGroup_ControlButton_SideBorder)}.fd-input-group .fd-input-group__addon:first-child .fd-input-group__button[dir=rtl],[dir=rtl] .fd-input-group .fd-input-group__addon:first-child .fd-input-group__button{border-left:var(--fdInputGroup_ControlButton_SideBorder);border-right-style:none}.fd-input-group .fd-input-group__addon:first-child .fd-input-group__button.is-hover,.fd-input-group .fd-input-group__addon:first-child .fd-input-group__button:hover{border-right:var(--fdInputGroup_ControlButton_SideBorder_Active)}.fd-input-group .fd-input-group__addon:first-child .fd-input-group__button.is-hover[dir=rtl],.fd-input-group .fd-input-group__addon:first-child .fd-input-group__button:hover[dir=rtl],[dir=rtl] .fd-input-group .fd-input-group__addon:first-child .fd-input-group__button.is-hover,[dir=rtl] .fd-input-group .fd-input-group__addon:first-child .fd-input-group__button:hover{border-left:var(--fdInputGroup_ControlButton_SideBorder_Active);border-right-style:none}.fd-input-group .fd-input-group__addon:first-child .fd-input-group__button.is-active,.fd-input-group .fd-input-group__addon:first-child .fd-input-group__button:active{border-right:var(--fdInputGroup_ControlButton_SideBorder_Active)}.fd-input-group .fd-input-group__addon:first-child .fd-input-group__button.is-active[dir=rtl],.fd-input-group .fd-input-group__addon:first-child .fd-input-group__button:active[dir=rtl],[dir=rtl] .fd-input-group .fd-input-group__addon:first-child .fd-input-group__button.is-active,[dir=rtl] .fd-input-group .fd-input-group__addon:first-child .fd-input-group__button:active{border-left:var(--fdInputGroup_ControlButton_SideBorder_Active);border-right-style:none}.fd-input-group .fd-input-group__addon:not(:first-child) .fd-input-group__button{border-left:var(--fdInputGroup_ControlButton_SideBorder)}.fd-input-group .fd-input-group__addon:not(:first-child) .fd-input-group__button[dir=rtl],[dir=rtl] .fd-input-group .fd-input-group__addon:not(:first-child) .fd-input-group__button{border-left-style:none;border-right:var(--fdInputGroup_ControlButton_SideBorder)}.fd-input-group .fd-input-group__addon:not(:first-child) .fd-input-group__button.is-hover,.fd-input-group .fd-input-group__addon:not(:first-child) .fd-input-group__button:hover{border-left:var(--fdInputGroup_ControlButton_SideBorder_Active)}.fd-input-group .fd-input-group__addon:not(:first-child) .fd-input-group__button.is-hover[dir=rtl],.fd-input-group .fd-input-group__addon:not(:first-child) .fd-input-group__button:hover[dir=rtl],[dir=rtl] .fd-input-group .fd-input-group__addon:not(:first-child) .fd-input-group__button.is-hover,[dir=rtl] .fd-input-group .fd-input-group__addon:not(:first-child) .fd-input-group__button:hover{border-left-style:none;border-right:var(--fdInputGroup_ControlButton_SideBorder_Active)}.fd-input-group .fd-input-group__addon:not(:first-child) .fd-input-group__button.is-active,.fd-input-group .fd-input-group__addon:not(:first-child) .fd-input-group__button:active{border-left:var(--fdInputGroup_ControlButton_SideBorder_Active)}.fd-input-group .fd-input-group__addon:not(:first-child) .fd-input-group__button.is-active[dir=rtl],.fd-input-group .fd-input-group__addon:not(:first-child) .fd-input-group__button:active[dir=rtl],[dir=rtl] .fd-input-group .fd-input-group__addon:not(:first-child) .fd-input-group__button.is-active,[dir=rtl] .fd-input-group .fd-input-group__addon:not(:first-child) .fd-input-group__button:active{border-left-style:none;border-right:var(--fdInputGroup_ControlButton_SideBorder_Active)}.fd-input-group .fd-input-group__button{background:var(--fdInput_Group_Button_Background);background-color:var(--fdButtonBackgroundColor);border:none;border-radius:var(--fdInput_Group_Button_Border_Raduis);color:var(--fdInput_Group_Button_Text_Color);overflow:hidden;position:relative;text-overflow:ellipsis;white-space:nowrap;z-index:auto!important}.fd-input-group .fd-input-group__button:before{display:none!important}.fd-input-group .fd-input-group__button:after{border-radius:var(--fdInput_Outline_Border_Radius)}.fd-input-group .fd-input-group__button.is-hover,.fd-input-group .fd-input-group__button:hover{--fdInput_Group_Button_Text_Color:var(--fdInput_Group_Button_Hover_Text_Color);--fdButtonBackgroundColor:var(--fdInput_Group_Button_Hover_Background);box-shadow:var(--fdInput_Group_Button_Box_Shadow)}.fd-input-group .fd-input-group__button.is-active,.fd-input-group .fd-input-group__button:active{-webkit-box-shadow:var(--fdInput_Group_Button_Box_Shadow);background:var(--fdInput_Group_Button_Active_Background);box-shadow:var(--fdInput_Group_Button_Box_Shadow);color:var(--fdInput_Group_Button_Active_Text_Color)}.fd-input-group.is-success.is-focus,.fd-input-group.is-success:focus{z-index:5}.fd-input-group.is-success.is-focus .fd-input-group__button,.fd-input-group.is-success:focus .fd-input-group__button{-webkit-box-shadow:var(--fdInput_Group_Button_Success_Active_Box_Shadow);--fdButtonBackgroundColor:var(--fdInput_Group_Button_Active_Background);box-shadow:var(--fdInput_Group_Button_Success_Active_Box_Shadow);color:var(--fdInput_Group_Button_Success_Active_Text_Color)}.fd-input-group.is-success.is-focus .fd-input-group__button.is-hover,.fd-input-group.is-success.is-focus .fd-input-group__button:hover,.fd-input-group.is-success:focus .fd-input-group__button.is-hover,.fd-input-group.is-success:focus .fd-input-group__button:hover{--fdButtonBackgroundColor:var(--fdInput_Group_Button_Active_Background)}.fd-input-group.is-success.is-expanded .fd-input-group__button,.fd-input-group.is-success[aria-expanded=true] .fd-input-group__button{-webkit-box-shadow:var(--fdInput_Group_Button_Success_Active_Box_Shadow);--fdButtonBackgroundColor:var(--fdInput_Group_Button_Active_Background);box-shadow:var(--fdInput_Group_Button_Success_Active_Box_Shadow);color:var(--fdInput_Group_Button_Success_Active_Text_Color)}.fd-input-group.is-success.is-expanded .fd-input-group__button.is-hover,.fd-input-group.is-success.is-expanded .fd-input-group__button:hover,.fd-input-group.is-success[aria-expanded=true] .fd-input-group__button.is-hover,.fd-input-group.is-success[aria-expanded=true] .fd-input-group__button:hover{--fdButtonBackgroundColor:var(--fdInput_Group_Button_Active_Background)}.fd-input-group.is-success .fd-input-group__button.is-active,.fd-input-group.is-success .fd-input-group__button.is-hover,.fd-input-group.is-success .fd-input-group__button:active,.fd-input-group.is-success .fd-input-group__button:hover{box-shadow:var(--fdInput_Group_Button_Success_Active_Box_Shadow)}.fd-input-group.is-success .fd-input-group__button.is-active,.fd-input-group.is-success .fd-input-group__button:active{color:var(--fdInput_Group_Button_Success_Active_Text_Color)}.fd-input-group.is-error.is-focus,.fd-input-group.is-error:focus{z-index:5}.fd-input-group.is-error.is-focus .fd-input-group__button,.fd-input-group.is-error:focus .fd-input-group__button{-webkit-box-shadow:var(--fdInput_Group_Button_Error_Active_Box_Shadow);--fdButtonBackgroundColor:var(--fdInput_Group_Button_Active_Background);box-shadow:var(--fdInput_Group_Button_Error_Active_Box_Shadow);color:var(--fdInput_Group_Button_Error_Active_Text_Color)}.fd-input-group.is-error.is-focus .fd-input-group__button.is-hover,.fd-input-group.is-error.is-focus .fd-input-group__button:hover,.fd-input-group.is-error:focus .fd-input-group__button.is-hover,.fd-input-group.is-error:focus .fd-input-group__button:hover{--fdButtonBackgroundColor:var(--fdInput_Group_Button_Active_Background)}.fd-input-group.is-error.is-expanded .fd-input-group__button,.fd-input-group.is-error[aria-expanded=true] .fd-input-group__button{-webkit-box-shadow:var(--fdInput_Group_Button_Error_Active_Box_Shadow);--fdButtonBackgroundColor:var(--fdInput_Group_Button_Active_Background);box-shadow:var(--fdInput_Group_Button_Error_Active_Box_Shadow);color:var(--fdInput_Group_Button_Error_Active_Text_Color)}.fd-input-group.is-error.is-expanded .fd-input-group__button.is-hover,.fd-input-group.is-error.is-expanded .fd-input-group__button:hover,.fd-input-group.is-error[aria-expanded=true] .fd-input-group__button.is-hover,.fd-input-group.is-error[aria-expanded=true] .fd-input-group__button:hover{--fdButtonBackgroundColor:var(--fdInput_Group_Button_Active_Background)}.fd-input-group.is-error .fd-input-group__button.is-active,.fd-input-group.is-error .fd-input-group__button.is-hover,.fd-input-group.is-error .fd-input-group__button:active,.fd-input-group.is-error .fd-input-group__button:hover{box-shadow:var(--fdInput_Group_Button_Error_Active_Box_Shadow)}.fd-input-group.is-error .fd-input-group__button.is-active,.fd-input-group.is-error .fd-input-group__button:active{color:var(--fdInput_Group_Button_Error_Active_Text_Color)}.fd-input-group.is-warning.is-focus,.fd-input-group.is-warning:focus{z-index:5}.fd-input-group.is-warning.is-focus .fd-input-group__button,.fd-input-group.is-warning:focus .fd-input-group__button{-webkit-box-shadow:var(--fdInput_Group_Button_Warning_Active_Box_Shadow);--fdButtonBackgroundColor:var(--fdInput_Group_Button_Active_Background);box-shadow:var(--fdInput_Group_Button_Warning_Active_Box_Shadow);color:var(--fdInput_Group_Button_Warning_Active_Text_Color)}.fd-input-group.is-warning.is-focus .fd-input-group__button.is-hover,.fd-input-group.is-warning.is-focus .fd-input-group__button:hover,.fd-input-group.is-warning:focus .fd-input-group__button.is-hover,.fd-input-group.is-warning:focus .fd-input-group__button:hover{--fdButtonBackgroundColor:var(--fdInput_Group_Button_Active_Background)}.fd-input-group.is-warning.is-expanded .fd-input-group__button,.fd-input-group.is-warning[aria-expanded=true] .fd-input-group__button{-webkit-box-shadow:var(--fdInput_Group_Button_Warning_Active_Box_Shadow);--fdButtonBackgroundColor:var(--fdInput_Group_Button_Active_Background);box-shadow:var(--fdInput_Group_Button_Warning_Active_Box_Shadow);color:var(--fdInput_Group_Button_Warning_Active_Text_Color)}.fd-input-group.is-warning.is-expanded .fd-input-group__button.is-hover,.fd-input-group.is-warning.is-expanded .fd-input-group__button:hover,.fd-input-group.is-warning[aria-expanded=true] .fd-input-group__button.is-hover,.fd-input-group.is-warning[aria-expanded=true] .fd-input-group__button:hover{--fdButtonBackgroundColor:var(--fdInput_Group_Button_Active_Background)}.fd-input-group.is-warning .fd-input-group__button.is-active,.fd-input-group.is-warning .fd-input-group__button.is-hover,.fd-input-group.is-warning .fd-input-group__button:active,.fd-input-group.is-warning .fd-input-group__button:hover{box-shadow:var(--fdInput_Group_Button_Warning_Active_Box_Shadow)}.fd-input-group.is-warning .fd-input-group__button.is-active,.fd-input-group.is-warning .fd-input-group__button:active{color:var(--fdInput_Group_Button_Warning_Active_Text_Color)}.fd-input-group.is-alert.is-focus,.fd-input-group.is-alert:focus{z-index:5}.fd-input-group.is-alert.is-focus .fd-input-group__button,.fd-input-group.is-alert:focus .fd-input-group__button{-webkit-box-shadow:var(--fdInput_Group_Button_Warning_Active_Box_Shadow);--fdButtonBackgroundColor:var(--fdInput_Group_Button_Active_Background);box-shadow:var(--fdInput_Group_Button_Warning_Active_Box_Shadow);color:var(--fdInput_Group_Button_Warning_Active_Text_Color)}.fd-input-group.is-alert.is-focus .fd-input-group__button.is-hover,.fd-input-group.is-alert.is-focus .fd-input-group__button:hover,.fd-input-group.is-alert:focus .fd-input-group__button.is-hover,.fd-input-group.is-alert:focus .fd-input-group__button:hover{--fdButtonBackgroundColor:var(--fdInput_Group_Button_Active_Background)}.fd-input-group.is-alert.is-expanded .fd-input-group__button,.fd-input-group.is-alert[aria-expanded=true] .fd-input-group__button{-webkit-box-shadow:var(--fdInput_Group_Button_Warning_Active_Box_Shadow);--fdButtonBackgroundColor:var(--fdInput_Group_Button_Active_Background);box-shadow:var(--fdInput_Group_Button_Warning_Active_Box_Shadow);color:var(--fdInput_Group_Button_Warning_Active_Text_Color)}.fd-input-group.is-alert.is-expanded .fd-input-group__button.is-hover,.fd-input-group.is-alert.is-expanded .fd-input-group__button:hover,.fd-input-group.is-alert[aria-expanded=true] .fd-input-group__button.is-hover,.fd-input-group.is-alert[aria-expanded=true] .fd-input-group__button:hover{--fdButtonBackgroundColor:var(--fdInput_Group_Button_Active_Background)}.fd-input-group.is-alert .fd-input-group__button.is-active,.fd-input-group.is-alert .fd-input-group__button.is-hover,.fd-input-group.is-alert .fd-input-group__button:active,.fd-input-group.is-alert .fd-input-group__button:hover{box-shadow:var(--fdInput_Group_Button_Warning_Active_Box_Shadow)}.fd-input-group.is-alert .fd-input-group__button.is-active,.fd-input-group.is-alert .fd-input-group__button:active{color:var(--fdInput_Group_Button_Warning_Active_Text_Color)}.fd-input-group.is-information.is-focus,.fd-input-group.is-information:focus{z-index:5}.fd-input-group.is-information.is-focus .fd-input-group__button,.fd-input-group.is-information:focus .fd-input-group__button{-webkit-box-shadow:var(--fdInput_Group_Button_Information_Active_Box_Shadow);--fdButtonBackgroundColor:var(--fdInput_Group_Button_Active_Background);box-shadow:var(--fdInput_Group_Button_Information_Active_Box_Shadow);color:var(--fdInput_Group_Button_Information_Active_Text_Color)}.fd-input-group.is-information.is-focus .fd-input-group__button.is-hover,.fd-input-group.is-information.is-focus .fd-input-group__button:hover,.fd-input-group.is-information:focus .fd-input-group__button.is-hover,.fd-input-group.is-information:focus .fd-input-group__button:hover{--fdButtonBackgroundColor:var(--fdInput_Group_Button_Active_Background)}.fd-input-group.is-information.is-expanded .fd-input-group__button,.fd-input-group.is-information[aria-expanded=true] .fd-input-group__button{-webkit-box-shadow:var(--fdInput_Group_Button_Information_Active_Box_Shadow);--fdButtonBackgroundColor:var(--fdInput_Group_Button_Active_Background);box-shadow:var(--fdInput_Group_Button_Information_Active_Box_Shadow);color:var(--fdInput_Group_Button_Information_Active_Text_Color)}.fd-input-group.is-information.is-expanded .fd-input-group__button.is-hover,.fd-input-group.is-information.is-expanded .fd-input-group__button:hover,.fd-input-group.is-information[aria-expanded=true] .fd-input-group__button.is-hover,.fd-input-group.is-information[aria-expanded=true] .fd-input-group__button:hover{--fdButtonBackgroundColor:var(--fdInput_Group_Button_Active_Background)}.fd-input-group.is-information .fd-input-group__button.is-active,.fd-input-group.is-information .fd-input-group__button.is-hover,.fd-input-group.is-information .fd-input-group__button:active,.fd-input-group.is-information .fd-input-group__button:hover{box-shadow:var(--fdInput_Group_Button_Information_Active_Box_Shadow)}.fd-input-group.is-information .fd-input-group__button.is-active,.fd-input-group.is-information .fd-input-group__button:active{color:var(--fdInput_Group_Button_Information_Active_Text_Color)}.fd-input-group .fd-input-group__input{-webkit-box-flex:1;-ms-flex:1 1 10rem;-webkit-box-shadow:none;background:none;background-color:var(--fdInputGroup_Input_Background, transparent);border:var(--fdInputGroup_Input_Border, none);box-shadow:none;color:var(--fdInputGroup_Input_Color, inherit);flex:1 1 10rem;padding-left:.25rem;padding-right:.25rem;text-shadow:var(--fdInputGroup_Text_Shadow)}.fd-input-group .fd-input-group__input:nth-child(n+1){margin:0}.fd-input-group .fd-input-group__input::placeholder{color:var(--fdInputGroup_Input_Placeholder_Color, var(--sapField_PlaceholderTextColor));font-style:var(--fdInputGroup_Input_Placeholder_Style, italic)}.fd-input-group .fd-input-group__input.is-hover,.fd-input-group .fd-input-group__input:hover{-webkit-box-shadow:none;background:none;background-color:var(--fdInputGroup_Hover_Input_Background, transparent);box-shadow:none}.fd-input-group .fd-input-group__input.is-focus,.fd-input-group .fd-input-group__input:focus{-webkit-box-shadow:none;background:var(--fdInputGroup_Input_Background, none);border-radius:0;box-shadow:none;outline:none;z-index:5}.fd-input-group .fd-input-group__input:first-child{padding-left:.625rem}.fd-input-group .fd-input-group__input:first-child[dir=rtl],[dir=rtl] .fd-input-group .fd-input-group__input:first-child{padding-left:0;padding-right:.625rem}.fd-input-group .fd-input-group__input:last-child{padding-right:.625rem}.fd-input-group .fd-input-group__input:last-child[dir=rtl],[dir=rtl] .fd-input-group .fd-input-group__input:last-child{padding-left:.625rem;padding-right:.25rem}.fd-input-group--inline{display:inline-flex;vertical-align:bottom;width:auto}.fd-input-group__addon{-webkit-box-sizing:border-box;-webkit-box-pack:center;-ms-flex-pack:center;align-items:center;background:var(--fdInputGroup_Addon_Background, none);border:0;box-sizing:border-box;color:var(--sapTextColor);color:var(--sapContent_NonInteractiveIconColor);display:flex;font-family:var(--sapFontFamily);font-size:var(--sapFontSize);font-size:var(--sapFontLargeSize);font-weight:400;forced-color-adjust:none;justify-content:center;line-height:var(--sapContent_LineHeight);margin:0;min-height:var(--fdInput_Group_Addon_Height, 2.25rem);min-width:var(--fdInput_Group_Addon_Width, 2.25rem);overflow:hidden;padding:0 .625rem;text-overflow:ellipsis;white-space:nowrap}.fd-input-group__addon:after,.fd-input-group__addon:before{box-sizing:inherit;font-size:inherit}.fd-input-group__addon span[class*=sap-icon--]:before{font-size:var(--sapFontLargeSize)}.fd-input-group__addon--readonly{opacity:.4}.fd-input-group__addon--button{overflow:visible;padding:0}.fd-input-group--control[aria-expanded=true]{margin-bottom:0}.fd-input-group[class*=-compact],.fd-input-group[class*=-condensed],[class*=-compact] .fd-input-group:not([class*=-cozy]),[class*=-condensed] .fd-input-group:not([class*=-cozy]){--fdInput_Field_Margin:.1875rem 0;--fdInput_Field_Compact_Margin:0;--fdInput_Group_Addon_Width:2rem;--fdInput_Group_Addon_Height:1.625rem}.fd-input-group .fd-textarea{resize:vertical}.fd-input-group .is-disabled,.fd-input-group :disabled,.fd-input-group [aria-disabled=true]{opacity:1}.fd-input-group.is-readonly,.fd-input-group[readonly]{overflow:visible}.fd-input-group .fd-tokenizer,.fd-input-group .fd-tokenizer.is-focus,.fd-input-group .fd-tokenizer.is-hover,.fd-input-group .fd-tokenizer:focus,.fd-input-group .fd-tokenizer:hover{-webkit-box-shadow:none;background:none;background-color:var(transparent, transparent);box-shadow:none}.fd-input-group .fd-tokenizer.is-focus,.fd-input-group .fd-tokenizer:focus{outline:none;z-index:5}.fdp-input-group .fd-input-group>fdp-input{flex:1 1 auto;display:flex}.fdp-input-group .fd-input-group>fdp-input .fd-input-group__input,.fdp-input-group .fd-input-group>fdp-input .fd-input-group__input:first-child,.fdp-input-group .fd-input-group>fdp-input .fd-input-group__input:last-child{padding-left:.25rem;padding-right:.25rem}.fdp-input-group .fd-input-group>fdp-input:nth-child(n+1) .fd-input-group__input{margin:0}.fdp-input-group .fd-input-group>fdp-input:nth-child(1) .fd-input-group__input{padding-left:.625rem;padding-right:.25rem}.fdp-input-group .fd-input-group>fdp-input:nth-last-child(1) .fd-input-group__input{padding-left:.25rem;padding-right:.625rem}.fdp-input-group .fd-input-group__addon>fdp-button{display:flex;height:100%;max-height:100%}[dir=rtl] .fdp-input-group .fd-input-group fdp-input:nth-child(1) .fd-input-group__input{padding-left:.25rem;padding-right:.625rem}[dir=rtl] .fdp-input-group .fd-input-group fdp-input:nth-last-child(1) .fd-input-group__input{padding-left:.625rem;padding-right:.25rem}\n"] }]
+                    ], standalone: true, imports: [NgFor, InputGroupAddonBodyComponent, NgTemplateOutlet, NgIf, InputComponent], template: "<div class=\"fd-input-group\" [class.is-disabled]=\"disabled\" [class]=\"_controlStateClass\" [class.is-focus]=\"focused\">\n    <!-- Before input addons area -->\n    <fdp-input-group-addon-body *ngFor=\"let addon of _beforeInputAddons\">\n        <ng-container *ngTemplateOutlet=\"addon.contentTemplateRef\"></ng-container>\n    </fdp-input-group-addon-body>\n\n    <!-- Input -->\n    <ng-container *ngIf=\"_input\">\n        <fdp-input\n            [name]=\"name\"\n            [id]=\"id\"\n            [placeholder]=\"placeholder\"\n            [type]=\"_input.type\"\n            [disabled]=\"disabled\"\n            [value]=\"value\"\n            [ariaLabel]=\"ariaLabel\"\n            [ariaLabelledBy]=\"ariaLabelledBy\"\n            [required]=\"required\"\n            (input)=\"_onChangeInputValue($any($event.target)?.value)\"\n            (focusChange)=\"_onFocusChanged($event)\"\n            (keypress)=\"_onKeyPress($event)\"\n        ></fdp-input>\n    </ng-container>\n\n    <!-- After input addons area -->\n    <fdp-input-group-addon-body *ngFor=\"let addon of _afterInputAddons\" [hasButton]=\"!!addon.button\">\n        <ng-container *ngTemplateOutlet=\"addon.contentTemplateRef\"></ng-container>\n    </fdp-input-group-addon-body>\n</div>\n", styles: ["/*!\n * Fundamental Library Styles v0.30.2-rc.6\n * Copyright (c) 2023 SAP SE or an SAP affiliate company.\n * Licensed under Apache License 2.0 (https://github.com/SAP/fundamental-styles/blob/main/LICENSE)\n */.fd-input-group{-webkit-box-sizing:border-box;-webkit-box-shadow:var(--sapField_Shadow);-webkit-appearance:none;appearance:none;background:var(--fdInputGroup_Background, var(--sapField_BackgroundStyle));background-color:var(--fdInputGroup_Background_Color, var(--sapField_Background));border:0;border:var(--sapField_BorderWidth) var(--sapField_BorderStyle) var(--sapField_BorderColor);border-radius:var(--sapField_BorderCornerRadius);box-shadow:var(--sapField_Shadow);box-sizing:border-box;color:var(--sapTextColor);color:var(--sapField_TextColor);cursor:text;display:flex;font-family:var(--sapFontFamily);font-size:var(--sapFontSize);font-weight:400;forced-color-adjust:none;height:auto;line-height:var(--sapContent_LineHeight);margin:0;margin:var(--fdInput_Field_Margin, .25rem 0);min-width:var(2.75rem, 2.75rem);outline:none;overflow:hidden;padding:0;text-overflow:ellipsis;text-shadow:var(--fdInput_Text_Shadow);white-space:nowrap;width:100%;z-index:1}.fd-input-group:after,.fd-input-group:before{box-sizing:inherit;font-size:inherit}.fd-input-group::placeholder{color:var(--sapField_PlaceholderTextColor);font-style:var(--fdPlaceholder_Font_Style)}.fd-input-group[dir=rtl]::placeholder,[dir=rtl] .fd-input-group::placeholder{text-indent:.125rem}.fd-input-group::selection{background-color:var(--sapSelectedColor);color:var(--sapContent_ContrastTextColor)}.fd-input-group::-ms-clear{display:none}.fd-input-group.is-hover,.fd-input-group:hover{-webkit-box-shadow:var(--fdInput_Box_Shadow_Hover);background:var(--fdInputGroup_Hover_Background, var(--sapField_Hover_BackgroundStyle));background-color:var(--fdInputGroup_Hover_Background_Color, var(--sapField_Hover_Background));border-color:var(--sapField_Hover_BorderColor);box-shadow:var(--fdInput_Box_Shadow_Hover)}.fd-input-group.is-focus,.fd-input-group:focus{-webkit-box-shadow:none;background:var(--sapField_Focus_Background, var(--sapField_Focus_Background));box-shadow:none;outline-color:var(--fdInput_Outline_Color);outline-offset:var(--fdInput_Outline_Offset);outline-style:var(--sapContent_FocusStyle);outline-width:var(--sapContent_FocusWidth);z-index:5}.fd-input-group.is-success{-webkit-box-shadow:var(--sapField_SuccessShadow);background:var(--sapField_SuccessBackgroundStyle);background-color:var(--sapField_SuccessBackground);border:var(--sapField_SuccessColor) var(--sapField_SuccessBorderWidth) var(--sapField_SuccessBorderStyle);box-shadow:var(--sapField_SuccessShadow)}.fd-input-group.is-success.is-hover,.fd-input-group.is-success:hover{-webkit-box-shadow:var(--fdInput_Success_Box_Shadow_Hover);background-color:var(--fdInput_Success_Background_Color_Hover);border-color:var(--sapField_SuccessColor);box-shadow:var(--fdInput_Success_Box_Shadow_Hover)}.fd-input-group.is-success.is-focus,.fd-input-group.is-success:focus{background:var(--sapField_Focus_Background);outline-color:var(--fdInput_Success_Outline_Color)}.fd-input-group.is-success.is-focus.is-hover,.fd-input-group.is-success.is-focus:hover,.fd-input-group.is-success:focus.is-hover,.fd-input-group.is-success:focus:hover{box-shadow:none}.fd-input-group.is-success.is-expanded,.fd-input-group.is-success[aria-expanded=true]{-webkit-box-shadow:none;background:var(--sapField_Focus_Background);box-shadow:none;outline:var(--sapContent_FocusWidth) var(--sapContent_FocusStyle) var(--fdInput_Success_Outline_Color);outline-offset:var(--fdInput_Outline_Offset)}.fd-input-group.is-error{-webkit-box-shadow:var(--sapField_InvalidShadow);background:var(--sapField_InvalidBackgroundStyle);background-color:var(--sapField_InvalidBackground);border:var(--sapField_InvalidColor) var(--sapField_InvalidBorderWidth) var(--sapField_InvalidBorderStyle);box-shadow:var(--sapField_InvalidShadow)}.fd-input-group.is-error.is-hover,.fd-input-group.is-error:hover{-webkit-box-shadow:var(--fdInput_Error_Box_Shadow_Hover);background-color:var(--fdInput_Error_Background_Color_Hover);border-color:var(--sapField_InvalidColor);box-shadow:var(--fdInput_Error_Box_Shadow_Hover)}.fd-input-group.is-error.is-focus,.fd-input-group.is-error:focus{background:var(--sapField_Focus_Background);outline-color:var(--fdInput_Error_Outline_Color)}.fd-input-group.is-error.is-focus.is-hover,.fd-input-group.is-error.is-focus:hover,.fd-input-group.is-error:focus.is-hover,.fd-input-group.is-error:focus:hover{box-shadow:none}.fd-input-group.is-error.is-expanded,.fd-input-group.is-error[aria-expanded=true]{-webkit-box-shadow:none;background:var(--sapField_Focus_Background);box-shadow:none;outline:var(--sapContent_FocusWidth) var(--sapContent_FocusStyle) var(--fdInput_Error_Outline_Color);outline-offset:var(--fdInput_Outline_Offset)}.fd-input-group.is-warning{-webkit-box-shadow:var(--sapField_WarningShadow);background:var(--sapField_WarningBackgroundStyle);background-color:var(--sapField_WarningBackground);border:var(--sapField_WarningColor) var(--sapField_WarningBorderWidth) var(--sapField_WarningBorderStyle);box-shadow:var(--sapField_WarningShadow)}.fd-input-group.is-warning.is-hover,.fd-input-group.is-warning:hover{-webkit-box-shadow:var(--fdInput_Warning_Box_Shadow_Hover);background-color:var(--fdInput_Warning_Background_Color_Hover);border-color:var(--sapField_WarningColor);box-shadow:var(--fdInput_Warning_Box_Shadow_Hover)}.fd-input-group.is-warning.is-focus,.fd-input-group.is-warning:focus{background:var(--sapField_Focus_Background);outline-color:var(--fdInput_Warning_Outline_Color)}.fd-input-group.is-warning.is-focus.is-hover,.fd-input-group.is-warning.is-focus:hover,.fd-input-group.is-warning:focus.is-hover,.fd-input-group.is-warning:focus:hover{box-shadow:none}.fd-input-group.is-warning.is-expanded,.fd-input-group.is-warning[aria-expanded=true]{-webkit-box-shadow:none;background:var(--sapField_Focus_Background);box-shadow:none;outline:var(--sapContent_FocusWidth) var(--sapContent_FocusStyle) var(--fdInput_Warning_Outline_Color);outline-offset:var(--fdInput_Outline_Offset)}.fd-input-group.is-alert{background:var(--sapField_WarningBackgroundStyle);background-color:var(--sapField_WarningBackground);border:var(--sapField_WarningColor) var(--sapField_WarningBorderWidth) var(--sapField_WarningBorderStyle)}.fd-input-group.is-alert.is-hover,.fd-input-group.is-alert:hover{-webkit-box-shadow:var(--fdInput_Warning_Box_Shadow_Hover);background-color:var(--fdInput_Warning_Background_Color_Hover);border-color:var(--sapField_WarningColor);box-shadow:var(--fdInput_Warning_Box_Shadow_Hover)}.fd-input-group.is-alert.is-focus,.fd-input-group.is-alert:focus{background:var(--sapField_Focus_Background);outline-color:var(--fdInput_Warning_Outline_Color)}.fd-input-group.is-alert.is-focus.is-hover,.fd-input-group.is-alert.is-focus:hover,.fd-input-group.is-alert:focus.is-hover,.fd-input-group.is-alert:focus:hover{box-shadow:none}.fd-input-group.is-alert.is-expanded,.fd-input-group.is-alert[aria-expanded=true]{-webkit-box-shadow:none;background:var(--sapField_Focus_Background);box-shadow:none;outline:var(--sapContent_FocusWidth) var(--sapContent_FocusStyle) var(--fdInput_Warning_Outline_Color);outline-offset:var(--fdInput_Outline_Offset)}.fd-input-group.is-information{-webkit-box-shadow:var(--sapField_InformationShadow);background:var(--sapField_InformationBackgroundStyle);background-color:var(--sapField_InformationBackground);border:var(--sapField_InformationColor) var(--sapField_InformationBorderWidth) var(--sapField_InformationBorderStyle);box-shadow:var(--sapField_InformationShadow)}.fd-input-group.is-information.is-hover,.fd-input-group.is-information:hover{-webkit-box-shadow:var(--fdInput_Information_Box_Shadow_Hover);background-color:var(--fdInput_Information_Background_Color_Hover);border-color:var(--sapField_InformationColor);box-shadow:var(--fdInput_Information_Box_Shadow_Hover)}.fd-input-group.is-information.is-focus,.fd-input-group.is-information:focus{background:var(--sapField_Focus_Background);outline-color:var(--fdInput_Information_Outline_Color)}.fd-input-group.is-information.is-focus.is-hover,.fd-input-group.is-information.is-focus:hover,.fd-input-group.is-information:focus.is-hover,.fd-input-group.is-information:focus:hover{box-shadow:none}.fd-input-group.is-information.is-expanded,.fd-input-group.is-information[aria-expanded=true]{-webkit-box-shadow:none;background:var(--sapField_Focus_Background);box-shadow:none;outline:var(--sapContent_FocusWidth) var(--sapContent_FocusStyle) var(--fdInput_Information_Outline_Color);outline-offset:var(--fdInput_Outline_Offset)}.fd-input-group.is-alert,.fd-input-group.is-error,.fd-input-group.is-warning{font-style:var(--fdInput_State_Text_Style);font-weight:var(--fdInput_State_Font_Weight)}.fd-input-group.is-alert::placeholder,.fd-input-group.is-error::placeholder,.fd-input-group.is-warning::placeholder{font-weight:var(--fdInput_State_Font_Weight)}.fd-input-group.is-alert.is-focus,.fd-input-group.is-alert:focus,.fd-input-group.is-error.is-focus,.fd-input-group.is-error:focus,.fd-input-group.is-information.is-focus,.fd-input-group.is-information:focus,.fd-input-group.is-warning.is-focus,.fd-input-group.is-warning:focus{outline-offset:var(--fdInput_Outline_Offset_States);z-index:5}.fd-input-group.is-error::placeholder{color:var(--sapField_TextColor)}.fd-input-group.is-disabled,.fd-input-group:disabled,.fd-input-group[aria-disabled=true]{opacity:var(--sapContent_DisabledOpacity);pointer-events:none}.fd-input-group.is-disabled::placeholder,.fd-input-group:disabled::placeholder,.fd-input-group[aria-disabled=true]::placeholder{color:var(--fdInput_Non_Interactive_State_Placeholder_Color)}.fd-input-group.is-readonly,.fd-input-group[aria-readonly=true],.fd-input-group[readonly]{-webkit-box-shadow:none;background:var(--sapField_ReadOnly_BackgroundStyle);background-color:var(--sapField_ReadOnly_Background);border-color:var(--sapField_ReadOnly_BorderColor);box-shadow:none}.fd-input-group.is-readonly::placeholder,.fd-input-group[aria-readonly=true]::placeholder,.fd-input-group[readonly]::placeholder{color:var(--fdInput_Non_Interactive_State_Placeholder_Color)}.fd-input-group.is-readonly.is-hover,.fd-input-group.is-readonly:hover,.fd-input-group[aria-readonly=true].is-hover,.fd-input-group[aria-readonly=true]:hover,.fd-input-group[readonly].is-hover,.fd-input-group[readonly]:hover{-webkit-box-shadow:none;background:var(--sapField_ReadOnly_BackgroundStyle);background-color:var(--sapField_ReadOnly_Background);border-color:var(--sapField_ReadOnly_BorderColor);box-shadow:none}.fd-input-group.is-readonly.is-focus,.fd-input-group.is-readonly:focus,.fd-input-group[aria-readonly=true].is-focus,.fd-input-group[aria-readonly=true]:focus,.fd-input-group[readonly].is-focus,.fd-input-group[readonly]:focus{-webkit-box-shadow:none;background:var(--sapField_ReadOnly_BackgroundStyle);background-color:var(--sapField_ReadOnly_Background);border-color:var(--sapField_ReadOnly_BorderColor);box-shadow:none;z-index:5}.fd-input-group .fd-input-group__button:first-child{border-right:var(--fdInputGroup_ControlButton_SideBorder)}.fd-input-group .fd-input-group__button:first-child[dir=rtl],[dir=rtl] .fd-input-group .fd-input-group__button:first-child{border-left:var(--fdInputGroup_ControlButton_SideBorder);border-right-style:none}.fd-input-group .fd-input-group__button:first-child.is-hover,.fd-input-group .fd-input-group__button:first-child:hover{border-right:var(--fdInputGroup_ControlButton_SideBorder_Active)}.fd-input-group .fd-input-group__button:first-child.is-hover[dir=rtl],.fd-input-group .fd-input-group__button:first-child:hover[dir=rtl],[dir=rtl] .fd-input-group .fd-input-group__button:first-child.is-hover,[dir=rtl] .fd-input-group .fd-input-group__button:first-child:hover{border-left:var(--fdInputGroup_ControlButton_SideBorder_Active);border-right-style:none}.fd-input-group .fd-input-group__button:first-child.is-active,.fd-input-group .fd-input-group__button:first-child:active{border-right:var(--fdInputGroup_ControlButton_SideBorder_Active)}.fd-input-group .fd-input-group__button:first-child.is-active[dir=rtl],.fd-input-group .fd-input-group__button:first-child:active[dir=rtl],[dir=rtl] .fd-input-group .fd-input-group__button:first-child.is-active,[dir=rtl] .fd-input-group .fd-input-group__button:first-child:active{border-left:var(--fdInputGroup_ControlButton_SideBorder_Active);border-right-style:none}.fd-input-group .fd-input-group__button:not(:first-child){border-left:var(--fdInputGroup_ControlButton_SideBorder)}.fd-input-group .fd-input-group__button:not(:first-child)[dir=rtl],[dir=rtl] .fd-input-group .fd-input-group__button:not(:first-child){border-left-style:none;border-right:var(--fdInputGroup_ControlButton_SideBorder)}.fd-input-group .fd-input-group__button:not(:first-child).is-hover,.fd-input-group .fd-input-group__button:not(:first-child):hover{border-left:var(--fdInputGroup_ControlButton_SideBorder_Active)}.fd-input-group .fd-input-group__button:not(:first-child).is-hover[dir=rtl],.fd-input-group .fd-input-group__button:not(:first-child):hover[dir=rtl],[dir=rtl] .fd-input-group .fd-input-group__button:not(:first-child).is-hover,[dir=rtl] .fd-input-group .fd-input-group__button:not(:first-child):hover{border-left-style:none;border-right:var(--fdInputGroup_ControlButton_SideBorder_Active)}.fd-input-group .fd-input-group__button:not(:first-child).is-active,.fd-input-group .fd-input-group__button:not(:first-child):active{border-left:var(--fdInputGroup_ControlButton_SideBorder_Active)}.fd-input-group .fd-input-group__button:not(:first-child).is-active[dir=rtl],.fd-input-group .fd-input-group__button:not(:first-child):active[dir=rtl],[dir=rtl] .fd-input-group .fd-input-group__button:not(:first-child).is-active,[dir=rtl] .fd-input-group .fd-input-group__button:not(:first-child):active{border-left-style:none;border-right:var(--fdInputGroup_ControlButton_SideBorder_Active)}.fd-input-group .fd-input-group__addon:first-child .fd-input-group__button{border-right:var(--fdInputGroup_ControlButton_SideBorder)}.fd-input-group .fd-input-group__addon:first-child .fd-input-group__button[dir=rtl],[dir=rtl] .fd-input-group .fd-input-group__addon:first-child .fd-input-group__button{border-left:var(--fdInputGroup_ControlButton_SideBorder);border-right-style:none}.fd-input-group .fd-input-group__addon:first-child .fd-input-group__button.is-hover,.fd-input-group .fd-input-group__addon:first-child .fd-input-group__button:hover{border-right:var(--fdInputGroup_ControlButton_SideBorder_Active)}.fd-input-group .fd-input-group__addon:first-child .fd-input-group__button.is-hover[dir=rtl],.fd-input-group .fd-input-group__addon:first-child .fd-input-group__button:hover[dir=rtl],[dir=rtl] .fd-input-group .fd-input-group__addon:first-child .fd-input-group__button.is-hover,[dir=rtl] .fd-input-group .fd-input-group__addon:first-child .fd-input-group__button:hover{border-left:var(--fdInputGroup_ControlButton_SideBorder_Active);border-right-style:none}.fd-input-group .fd-input-group__addon:first-child .fd-input-group__button.is-active,.fd-input-group .fd-input-group__addon:first-child .fd-input-group__button:active{border-right:var(--fdInputGroup_ControlButton_SideBorder_Active)}.fd-input-group .fd-input-group__addon:first-child .fd-input-group__button.is-active[dir=rtl],.fd-input-group .fd-input-group__addon:first-child .fd-input-group__button:active[dir=rtl],[dir=rtl] .fd-input-group .fd-input-group__addon:first-child .fd-input-group__button.is-active,[dir=rtl] .fd-input-group .fd-input-group__addon:first-child .fd-input-group__button:active{border-left:var(--fdInputGroup_ControlButton_SideBorder_Active);border-right-style:none}.fd-input-group .fd-input-group__addon:not(:first-child) .fd-input-group__button{border-left:var(--fdInputGroup_ControlButton_SideBorder)}.fd-input-group .fd-input-group__addon:not(:first-child) .fd-input-group__button[dir=rtl],[dir=rtl] .fd-input-group .fd-input-group__addon:not(:first-child) .fd-input-group__button{border-left-style:none;border-right:var(--fdInputGroup_ControlButton_SideBorder)}.fd-input-group .fd-input-group__addon:not(:first-child) .fd-input-group__button.is-hover,.fd-input-group .fd-input-group__addon:not(:first-child) .fd-input-group__button:hover{border-left:var(--fdInputGroup_ControlButton_SideBorder_Active)}.fd-input-group .fd-input-group__addon:not(:first-child) .fd-input-group__button.is-hover[dir=rtl],.fd-input-group .fd-input-group__addon:not(:first-child) .fd-input-group__button:hover[dir=rtl],[dir=rtl] .fd-input-group .fd-input-group__addon:not(:first-child) .fd-input-group__button.is-hover,[dir=rtl] .fd-input-group .fd-input-group__addon:not(:first-child) .fd-input-group__button:hover{border-left-style:none;border-right:var(--fdInputGroup_ControlButton_SideBorder_Active)}.fd-input-group .fd-input-group__addon:not(:first-child) .fd-input-group__button.is-active,.fd-input-group .fd-input-group__addon:not(:first-child) .fd-input-group__button:active{border-left:var(--fdInputGroup_ControlButton_SideBorder_Active)}.fd-input-group .fd-input-group__addon:not(:first-child) .fd-input-group__button.is-active[dir=rtl],.fd-input-group .fd-input-group__addon:not(:first-child) .fd-input-group__button:active[dir=rtl],[dir=rtl] .fd-input-group .fd-input-group__addon:not(:first-child) .fd-input-group__button.is-active,[dir=rtl] .fd-input-group .fd-input-group__addon:not(:first-child) .fd-input-group__button:active{border-left-style:none;border-right:var(--fdInputGroup_ControlButton_SideBorder_Active)}.fd-input-group .fd-input-group__button{background:var(--fdInput_Group_Button_Background);background-color:var(--fdButtonBackgroundColor);border:none;border-radius:var(--fdInput_Group_Button_Border_Raduis);color:var(--fdInput_Group_Button_Text_Color);overflow:hidden;position:relative;text-overflow:ellipsis;white-space:nowrap;z-index:auto!important}.fd-input-group .fd-input-group__button:before{display:none!important}.fd-input-group .fd-input-group__button:after{border-radius:var(--fdInput_Outline_Border_Radius)}.fd-input-group .fd-input-group__button.is-hover,.fd-input-group .fd-input-group__button:hover{--fdInput_Group_Button_Text_Color:var(--fdInput_Group_Button_Hover_Text_Color);--fdButtonBackgroundColor:var(--fdInput_Group_Button_Hover_Background);box-shadow:var(--fdInput_Group_Button_Box_Shadow)}.fd-input-group .fd-input-group__button.is-active,.fd-input-group .fd-input-group__button:active{-webkit-box-shadow:var(--fdInput_Group_Button_Box_Shadow);background:var(--fdInput_Group_Button_Active_Background);box-shadow:var(--fdInput_Group_Button_Box_Shadow);color:var(--fdInput_Group_Button_Active_Text_Color)}.fd-input-group.is-success.is-focus,.fd-input-group.is-success:focus{z-index:5}.fd-input-group.is-success.is-focus .fd-input-group__button,.fd-input-group.is-success:focus .fd-input-group__button{-webkit-box-shadow:var(--fdInput_Group_Button_Success_Active_Box_Shadow);--fdButtonBackgroundColor:var(--fdInput_Group_Button_Active_Background);box-shadow:var(--fdInput_Group_Button_Success_Active_Box_Shadow);color:var(--fdInput_Group_Button_Success_Active_Text_Color)}.fd-input-group.is-success.is-focus .fd-input-group__button.is-hover,.fd-input-group.is-success.is-focus .fd-input-group__button:hover,.fd-input-group.is-success:focus .fd-input-group__button.is-hover,.fd-input-group.is-success:focus .fd-input-group__button:hover{--fdButtonBackgroundColor:var(--fdInput_Group_Button_Active_Background)}.fd-input-group.is-success.is-expanded .fd-input-group__button,.fd-input-group.is-success[aria-expanded=true] .fd-input-group__button{-webkit-box-shadow:var(--fdInput_Group_Button_Success_Active_Box_Shadow);--fdButtonBackgroundColor:var(--fdInput_Group_Button_Active_Background);box-shadow:var(--fdInput_Group_Button_Success_Active_Box_Shadow);color:var(--fdInput_Group_Button_Success_Active_Text_Color)}.fd-input-group.is-success.is-expanded .fd-input-group__button.is-hover,.fd-input-group.is-success.is-expanded .fd-input-group__button:hover,.fd-input-group.is-success[aria-expanded=true] .fd-input-group__button.is-hover,.fd-input-group.is-success[aria-expanded=true] .fd-input-group__button:hover{--fdButtonBackgroundColor:var(--fdInput_Group_Button_Active_Background)}.fd-input-group.is-success .fd-input-group__button.is-active,.fd-input-group.is-success .fd-input-group__button.is-hover,.fd-input-group.is-success .fd-input-group__button:active,.fd-input-group.is-success .fd-input-group__button:hover{box-shadow:var(--fdInput_Group_Button_Success_Active_Box_Shadow)}.fd-input-group.is-success .fd-input-group__button.is-active,.fd-input-group.is-success .fd-input-group__button:active{color:var(--fdInput_Group_Button_Success_Active_Text_Color)}.fd-input-group.is-error.is-focus,.fd-input-group.is-error:focus{z-index:5}.fd-input-group.is-error.is-focus .fd-input-group__button,.fd-input-group.is-error:focus .fd-input-group__button{-webkit-box-shadow:var(--fdInput_Group_Button_Error_Active_Box_Shadow);--fdButtonBackgroundColor:var(--fdInput_Group_Button_Active_Background);box-shadow:var(--fdInput_Group_Button_Error_Active_Box_Shadow);color:var(--fdInput_Group_Button_Error_Active_Text_Color)}.fd-input-group.is-error.is-focus .fd-input-group__button.is-hover,.fd-input-group.is-error.is-focus .fd-input-group__button:hover,.fd-input-group.is-error:focus .fd-input-group__button.is-hover,.fd-input-group.is-error:focus .fd-input-group__button:hover{--fdButtonBackgroundColor:var(--fdInput_Group_Button_Active_Background)}.fd-input-group.is-error.is-expanded .fd-input-group__button,.fd-input-group.is-error[aria-expanded=true] .fd-input-group__button{-webkit-box-shadow:var(--fdInput_Group_Button_Error_Active_Box_Shadow);--fdButtonBackgroundColor:var(--fdInput_Group_Button_Active_Background);box-shadow:var(--fdInput_Group_Button_Error_Active_Box_Shadow);color:var(--fdInput_Group_Button_Error_Active_Text_Color)}.fd-input-group.is-error.is-expanded .fd-input-group__button.is-hover,.fd-input-group.is-error.is-expanded .fd-input-group__button:hover,.fd-input-group.is-error[aria-expanded=true] .fd-input-group__button.is-hover,.fd-input-group.is-error[aria-expanded=true] .fd-input-group__button:hover{--fdButtonBackgroundColor:var(--fdInput_Group_Button_Active_Background)}.fd-input-group.is-error .fd-input-group__button.is-active,.fd-input-group.is-error .fd-input-group__button.is-hover,.fd-input-group.is-error .fd-input-group__button:active,.fd-input-group.is-error .fd-input-group__button:hover{box-shadow:var(--fdInput_Group_Button_Error_Active_Box_Shadow)}.fd-input-group.is-error .fd-input-group__button.is-active,.fd-input-group.is-error .fd-input-group__button:active{color:var(--fdInput_Group_Button_Error_Active_Text_Color)}.fd-input-group.is-warning.is-focus,.fd-input-group.is-warning:focus{z-index:5}.fd-input-group.is-warning.is-focus .fd-input-group__button,.fd-input-group.is-warning:focus .fd-input-group__button{-webkit-box-shadow:var(--fdInput_Group_Button_Warning_Active_Box_Shadow);--fdButtonBackgroundColor:var(--fdInput_Group_Button_Active_Background);box-shadow:var(--fdInput_Group_Button_Warning_Active_Box_Shadow);color:var(--fdInput_Group_Button_Warning_Active_Text_Color)}.fd-input-group.is-warning.is-focus .fd-input-group__button.is-hover,.fd-input-group.is-warning.is-focus .fd-input-group__button:hover,.fd-input-group.is-warning:focus .fd-input-group__button.is-hover,.fd-input-group.is-warning:focus .fd-input-group__button:hover{--fdButtonBackgroundColor:var(--fdInput_Group_Button_Active_Background)}.fd-input-group.is-warning.is-expanded .fd-input-group__button,.fd-input-group.is-warning[aria-expanded=true] .fd-input-group__button{-webkit-box-shadow:var(--fdInput_Group_Button_Warning_Active_Box_Shadow);--fdButtonBackgroundColor:var(--fdInput_Group_Button_Active_Background);box-shadow:var(--fdInput_Group_Button_Warning_Active_Box_Shadow);color:var(--fdInput_Group_Button_Warning_Active_Text_Color)}.fd-input-group.is-warning.is-expanded .fd-input-group__button.is-hover,.fd-input-group.is-warning.is-expanded .fd-input-group__button:hover,.fd-input-group.is-warning[aria-expanded=true] .fd-input-group__button.is-hover,.fd-input-group.is-warning[aria-expanded=true] .fd-input-group__button:hover{--fdButtonBackgroundColor:var(--fdInput_Group_Button_Active_Background)}.fd-input-group.is-warning .fd-input-group__button.is-active,.fd-input-group.is-warning .fd-input-group__button.is-hover,.fd-input-group.is-warning .fd-input-group__button:active,.fd-input-group.is-warning .fd-input-group__button:hover{box-shadow:var(--fdInput_Group_Button_Warning_Active_Box_Shadow)}.fd-input-group.is-warning .fd-input-group__button.is-active,.fd-input-group.is-warning .fd-input-group__button:active{color:var(--fdInput_Group_Button_Warning_Active_Text_Color)}.fd-input-group.is-alert.is-focus,.fd-input-group.is-alert:focus{z-index:5}.fd-input-group.is-alert.is-focus .fd-input-group__button,.fd-input-group.is-alert:focus .fd-input-group__button{-webkit-box-shadow:var(--fdInput_Group_Button_Warning_Active_Box_Shadow);--fdButtonBackgroundColor:var(--fdInput_Group_Button_Active_Background);box-shadow:var(--fdInput_Group_Button_Warning_Active_Box_Shadow);color:var(--fdInput_Group_Button_Warning_Active_Text_Color)}.fd-input-group.is-alert.is-focus .fd-input-group__button.is-hover,.fd-input-group.is-alert.is-focus .fd-input-group__button:hover,.fd-input-group.is-alert:focus .fd-input-group__button.is-hover,.fd-input-group.is-alert:focus .fd-input-group__button:hover{--fdButtonBackgroundColor:var(--fdInput_Group_Button_Active_Background)}.fd-input-group.is-alert.is-expanded .fd-input-group__button,.fd-input-group.is-alert[aria-expanded=true] .fd-input-group__button{-webkit-box-shadow:var(--fdInput_Group_Button_Warning_Active_Box_Shadow);--fdButtonBackgroundColor:var(--fdInput_Group_Button_Active_Background);box-shadow:var(--fdInput_Group_Button_Warning_Active_Box_Shadow);color:var(--fdInput_Group_Button_Warning_Active_Text_Color)}.fd-input-group.is-alert.is-expanded .fd-input-group__button.is-hover,.fd-input-group.is-alert.is-expanded .fd-input-group__button:hover,.fd-input-group.is-alert[aria-expanded=true] .fd-input-group__button.is-hover,.fd-input-group.is-alert[aria-expanded=true] .fd-input-group__button:hover{--fdButtonBackgroundColor:var(--fdInput_Group_Button_Active_Background)}.fd-input-group.is-alert .fd-input-group__button.is-active,.fd-input-group.is-alert .fd-input-group__button.is-hover,.fd-input-group.is-alert .fd-input-group__button:active,.fd-input-group.is-alert .fd-input-group__button:hover{box-shadow:var(--fdInput_Group_Button_Warning_Active_Box_Shadow)}.fd-input-group.is-alert .fd-input-group__button.is-active,.fd-input-group.is-alert .fd-input-group__button:active{color:var(--fdInput_Group_Button_Warning_Active_Text_Color)}.fd-input-group.is-information.is-focus,.fd-input-group.is-information:focus{z-index:5}.fd-input-group.is-information.is-focus .fd-input-group__button,.fd-input-group.is-information:focus .fd-input-group__button{-webkit-box-shadow:var(--fdInput_Group_Button_Information_Active_Box_Shadow);--fdButtonBackgroundColor:var(--fdInput_Group_Button_Active_Background);box-shadow:var(--fdInput_Group_Button_Information_Active_Box_Shadow);color:var(--fdInput_Group_Button_Information_Active_Text_Color)}.fd-input-group.is-information.is-focus .fd-input-group__button.is-hover,.fd-input-group.is-information.is-focus .fd-input-group__button:hover,.fd-input-group.is-information:focus .fd-input-group__button.is-hover,.fd-input-group.is-information:focus .fd-input-group__button:hover{--fdButtonBackgroundColor:var(--fdInput_Group_Button_Active_Background)}.fd-input-group.is-information.is-expanded .fd-input-group__button,.fd-input-group.is-information[aria-expanded=true] .fd-input-group__button{-webkit-box-shadow:var(--fdInput_Group_Button_Information_Active_Box_Shadow);--fdButtonBackgroundColor:var(--fdInput_Group_Button_Active_Background);box-shadow:var(--fdInput_Group_Button_Information_Active_Box_Shadow);color:var(--fdInput_Group_Button_Information_Active_Text_Color)}.fd-input-group.is-information.is-expanded .fd-input-group__button.is-hover,.fd-input-group.is-information.is-expanded .fd-input-group__button:hover,.fd-input-group.is-information[aria-expanded=true] .fd-input-group__button.is-hover,.fd-input-group.is-information[aria-expanded=true] .fd-input-group__button:hover{--fdButtonBackgroundColor:var(--fdInput_Group_Button_Active_Background)}.fd-input-group.is-information .fd-input-group__button.is-active,.fd-input-group.is-information .fd-input-group__button.is-hover,.fd-input-group.is-information .fd-input-group__button:active,.fd-input-group.is-information .fd-input-group__button:hover{box-shadow:var(--fdInput_Group_Button_Information_Active_Box_Shadow)}.fd-input-group.is-information .fd-input-group__button.is-active,.fd-input-group.is-information .fd-input-group__button:active{color:var(--fdInput_Group_Button_Information_Active_Text_Color)}.fd-input-group .fd-input-group__input{-webkit-box-flex:1;-ms-flex:1 1 10rem;-webkit-box-shadow:none;background:none;background-color:var(--fdInputGroup_Input_Background, transparent);border:var(--fdInputGroup_Input_Border, none);box-shadow:none;color:var(--fdInputGroup_Input_Color, inherit);flex:1 1 10rem;padding-left:.25rem;padding-right:.25rem;text-shadow:var(--fdInputGroup_Text_Shadow)}.fd-input-group .fd-input-group__input:nth-child(n+1){margin:0}.fd-input-group .fd-input-group__input::placeholder{color:var(--fdInputGroup_Input_Placeholder_Color, var(--sapField_PlaceholderTextColor));font-style:var(--fdInputGroup_Input_Placeholder_Style, italic)}.fd-input-group .fd-input-group__input.is-hover,.fd-input-group .fd-input-group__input:hover{-webkit-box-shadow:none;background:none;background-color:var(--fdInputGroup_Hover_Input_Background, transparent);box-shadow:none}.fd-input-group .fd-input-group__input.is-focus,.fd-input-group .fd-input-group__input:focus{-webkit-box-shadow:none;background:var(--fdInputGroup_Input_Background, none);border-radius:0;box-shadow:none;outline:none;z-index:5}.fd-input-group .fd-input-group__input:first-child{padding-left:.625rem}.fd-input-group .fd-input-group__input:first-child[dir=rtl],[dir=rtl] .fd-input-group .fd-input-group__input:first-child{padding-left:0;padding-right:.625rem}.fd-input-group .fd-input-group__input:last-child{padding-right:.625rem}.fd-input-group .fd-input-group__input:last-child[dir=rtl],[dir=rtl] .fd-input-group .fd-input-group__input:last-child{padding-left:.625rem;padding-right:.25rem}.fd-input-group--inline{display:inline-flex;vertical-align:bottom;width:auto}.fd-input-group__addon{-webkit-box-sizing:border-box;-webkit-box-pack:center;-ms-flex-pack:center;align-items:center;background:var(--fdInputGroup_Addon_Background, none);border:0;box-sizing:border-box;color:var(--sapTextColor);color:var(--sapContent_NonInteractiveIconColor);display:flex;font-family:var(--sapFontFamily);font-size:var(--sapFontSize);font-size:var(--sapFontLargeSize);font-weight:400;forced-color-adjust:none;justify-content:center;line-height:var(--sapContent_LineHeight);margin:0;min-height:var(--fdInput_Group_Addon_Height, 2.25rem);min-width:var(--fdInput_Group_Addon_Width, 2.25rem);overflow:hidden;padding:0 .625rem;text-overflow:ellipsis;white-space:nowrap}.fd-input-group__addon:after,.fd-input-group__addon:before{box-sizing:inherit;font-size:inherit}.fd-input-group__addon span[class*=sap-icon--]:before{font-size:var(--sapFontLargeSize)}.fd-input-group__addon--readonly{opacity:.4}.fd-input-group__addon--button{overflow:visible;padding:0}.fd-input-group--control[aria-expanded=true]{margin-bottom:0}.fd-input-group[class*=-compact],.fd-input-group[class*=-condensed],[class*=-compact] .fd-input-group:not([class*=-cozy]),[class*=-condensed] .fd-input-group:not([class*=-cozy]){--fdInput_Field_Margin:.1875rem 0;--fdInput_Field_Compact_Margin:0;--fdInput_Group_Addon_Width:2rem;--fdInput_Group_Addon_Height:1.625rem}.fd-input-group .fd-textarea{resize:vertical}.fd-input-group .is-disabled,.fd-input-group :disabled,.fd-input-group [aria-disabled=true]{opacity:1}.fd-input-group.is-readonly,.fd-input-group[readonly]{overflow:visible}.fd-input-group .fd-tokenizer,.fd-input-group .fd-tokenizer.is-focus,.fd-input-group .fd-tokenizer.is-hover,.fd-input-group .fd-tokenizer:focus,.fd-input-group .fd-tokenizer:hover{-webkit-box-shadow:none;background:none;background-color:var(transparent, transparent);box-shadow:none}.fd-input-group .fd-tokenizer.is-focus,.fd-input-group .fd-tokenizer:focus{outline:none;z-index:5}.fdp-input-group .fd-input-group>fdp-input{flex:1 1 auto;display:flex}.fdp-input-group .fd-input-group>fdp-input .fd-input-group__input,.fdp-input-group .fd-input-group>fdp-input .fd-input-group__input:first-child,.fdp-input-group .fd-input-group>fdp-input .fd-input-group__input:last-child{padding-left:.25rem;padding-right:.25rem}.fdp-input-group .fd-input-group>fdp-input:nth-child(n+1) .fd-input-group__input{margin:0}.fdp-input-group .fd-input-group>fdp-input:nth-child(1) .fd-input-group__input{padding-left:.625rem;padding-right:.25rem}.fdp-input-group .fd-input-group>fdp-input:nth-last-child(1) .fd-input-group__input{padding-left:.25rem;padding-right:.625rem}.fdp-input-group .fd-input-group__addon>fdp-button{display:flex;height:100%;max-height:100%}[dir=rtl] .fdp-input-group .fd-input-group fdp-input:nth-child(1) .fd-input-group__input{padding-left:.25rem;padding-right:.625rem}[dir=rtl] .fdp-input-group .fd-input-group fdp-input:nth-last-child(1) .fd-input-group__input{padding-left:.625rem;padding-right:.25rem}\n"] }]
         }], ctorParameters: function () { return [{ type: i0.ChangeDetectorRef }, { type: i0.ElementRef }, { type: i1$1.NgControl, decorators: [{
                     type: Optional
                 }, {
@@ -8890,34 +8827,14 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.1.0", ngImpor
 
 class PlatformInputGroupModule {
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.1.0", ngImport: i0, type: PlatformInputGroupModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
-    static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "16.1.0", ngImport: i0, type: PlatformInputGroupModule, declarations: [InputGroupComponent,
-            InputGroupAddonComponent,
-            InputGroupAddonBodyComponent,
-            InputGroupInputComponent], imports: [CommonModule, FormsModule, PlatformInputModule, ContentDensityModule], exports: [PlatformInputModule,
-            InputGroupComponent,
-            InputGroupAddonComponent,
-            InputGroupInputComponent,
-            ContentDensityModule] }); }
-    static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "16.1.0", ngImport: i0, type: PlatformInputGroupModule, imports: [CommonModule, FormsModule, PlatformInputModule, ContentDensityModule, PlatformInputModule,
-            ContentDensityModule] }); }
+    static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "16.1.0", ngImport: i0, type: PlatformInputGroupModule, imports: [InputGroupComponent, InputGroupAddonComponent, InputGroupAddonBodyComponent, InputGroupInputComponent], exports: [InputGroupComponent, InputGroupAddonComponent, InputGroupInputComponent] }); }
+    static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "16.1.0", ngImport: i0, type: PlatformInputGroupModule, imports: [InputGroupComponent, InputGroupAddonBodyComponent] }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.1.0", ngImport: i0, type: PlatformInputGroupModule, decorators: [{
             type: NgModule,
             args: [{
-                    declarations: [
-                        InputGroupComponent,
-                        InputGroupAddonComponent,
-                        InputGroupAddonBodyComponent,
-                        InputGroupInputComponent
-                    ],
-                    imports: [CommonModule, FormsModule, PlatformInputModule, ContentDensityModule],
-                    exports: [
-                        PlatformInputModule,
-                        InputGroupComponent,
-                        InputGroupAddonComponent,
-                        InputGroupInputComponent,
-                        ContentDensityModule
-                    ]
+                    imports: [InputGroupComponent, InputGroupAddonComponent, InputGroupAddonBodyComponent, InputGroupInputComponent],
+                    exports: [InputGroupComponent, InputGroupAddonComponent, InputGroupInputComponent]
                 }]
         }] });
 
@@ -9144,6 +9061,14 @@ class BaseMultiCombobox extends CollectionBaseInput {
     popoverOpenChangeHandle(isOpen) {
         this.isOpen = isOpen;
         this._rangeSelector.reset();
+        this._onOpenChange(this.isOpen);
+    }
+    /** @hidden */
+    _onOpenChange(isOpen) {
+        if (isOpen) {
+            this.formMessage._popover.close();
+        }
+        this.formMessage._popover.setIgnoreTriggers(isOpen);
     }
     /** Opens the select popover body. */
     open() {
@@ -9782,11 +9707,23 @@ class MultiComboboxMobileComponent extends MobileModeBase {
         });
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.1.0", ngImport: i0, type: MultiComboboxMobileComponent, deps: [{ token: i0.ElementRef }, { token: i1$2.DialogService }, { token: MULTICOMBOBOX_COMPONENT }, { token: MOBILE_MODE_CONFIG, optional: true }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.1.0", type: MultiComboboxMobileComponent, selector: "fdp-multi-combobox-mobile", viewQueries: [{ propertyName: "dialogTemplate", first: true, predicate: ["dialogTemplate"], descendants: true }], usesInheritance: true, ngImport: i0, template: "<ng-template let-dialog let-dialogConfig=\"dialogConfig\" #dialogTemplate>\n    <fd-dialog [dialogConfig]=\"dialogConfig\" [dialogRef]=\"dialog\">\n        <fd-dialog-header>\n            <h1 fd-title fd-dialog-title *ngIf=\"mobileConfig?.title\">{{ mobileConfig.title }}</h1>\n            <button\n                fd-dialog-close-button\n                *ngIf=\"mobileConfig?.hasCloseButton\"\n                [mobile]=\"true\"\n                (click)=\"handleDismiss()\"\n            ></button>\n            <ng-template fdkTemplate=\"subheader\">\n                <div fd-bar-middle>\n                    <fd-bar-element [fullWidth]=\"true\">\n                        <ng-container *ngTemplateOutlet=\"childContent?.controlTemplate || null\"></ng-container>\n\n                        <button\n                            *ngIf=\"selectedShown$ | async\"\n                            fd-button\n                            glyph=\"multiselect-all\"\n                            fdType=\"emphasized\"\n                            [title]=\"'platformMultiCombobox.mobileShowAllItemsButton' | fdTranslate\"\n                            [attr.aria-label]=\"'platformMultiCombobox.mobileShowAllItemsButton' | fdTranslate\"\n                            class=\"fd-margin-begin--tiny\"\n                            (click)=\"showSelected()\"\n                        ></button>\n\n                        <button\n                            *ngIf=\"(selectedShown$ | async) === false\"\n                            fd-button\n                            glyph=\"multiselect-all\"\n                            fdType=\"transparent\"\n                            [title]=\"'platformMultiCombobox.mobileShowSelectedItemsButton' | fdTranslate\"\n                            [attr.aria-label]=\"'platformMultiCombobox.mobileShowSelectedItemsButton' | fdTranslate\"\n                            class=\"fd-margin-begin--tiny\"\n                            (click)=\"showSelected()\"\n                        ></button>\n                    </fd-bar-element>\n                </div>\n            </ng-template>\n        </fd-dialog-header>\n\n        <fd-dialog-body>\n            <ng-container *ngTemplateOutlet=\"childContent?.listTemplate || null\"></ng-container>\n        </fd-dialog-body>\n\n        <fd-dialog-footer>\n            <fd-button-bar\n                *ngIf=\"mobileConfig?.approveButtonText\"\n                fdType=\"emphasized\"\n                [label]=\"mobileConfig.approveButtonText!\"\n                (click)=\"handleApprove()\"\n            >\n            </fd-button-bar>\n            <fd-button-bar\n                *ngIf=\"mobileConfig?.cancelButtonText\"\n                [label]=\"mobileConfig.cancelButtonText!\"\n                (click)=\"handleDismiss()\"\n            >\n            </fd-button-bar>\n        </fd-dialog-footer>\n    </fd-dialog>\n</ng-template>\n", dependencies: [{ kind: "directive", type: i2$2.BarMiddleDirective, selector: "[fd-bar-middle]" }, { kind: "directive", type: i2$2.BarElementDirective, selector: "fd-bar-element", inputs: ["fullWidth"] }, { kind: "component", type: i2$2.ButtonBarComponent, selector: "fd-button-bar", inputs: ["fullWidth", "fdType", "title", "ariaLabel", "ariaLabelledby", "id"] }, { kind: "component", type: i1$2.DialogComponent, selector: "fd-dialog", inputs: ["class", "dialogRef", "dialogConfig"] }, { kind: "component", type: i1$2.DialogBodyComponent, selector: "fd-dialog-body" }, { kind: "component", type: i1$2.DialogFooterComponent, selector: "fd-dialog-footer" }, { kind: "component", type: i1$2.DialogHeaderComponent, selector: "fd-dialog-header" }, { kind: "component", type: i1$2.DialogCloseButtonComponent, selector: "[fd-dialog-close-button]", inputs: ["mobile", "title"] }, { kind: "directive", type: i1$2.DialogTitleDirective, selector: "[fd-dialog-title]", inputs: ["id"] }, { kind: "component", type: i3$4.TitleComponent, selector: "h1[fd-title], h2[fd-title], h3[fd-title], h4[fd-title], h5[fd-title], h6[fd-title]", inputs: ["headerSize", "wrap"], exportAs: ["fd-title"] }, { kind: "directive", type: i3$2.TemplateDirective, selector: "[fdkTemplate]", inputs: ["fdkTemplate"] }, { kind: "component", type: i5$3.ButtonComponent, selector: "button[fd-button], a[fd-button]", inputs: ["class"], exportAs: ["fd-button"] }, { kind: "directive", type: i3.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i3.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "pipe", type: i3.AsyncPipe, name: "async" }, { kind: "pipe", type: i5$1.FdTranslatePipe, name: "fdTranslate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.1.0", type: MultiComboboxMobileComponent, isStandalone: true, selector: "fdp-multi-combobox-mobile", viewQueries: [{ propertyName: "dialogTemplate", first: true, predicate: ["dialogTemplate"], descendants: true }], usesInheritance: true, ngImport: i0, template: "<ng-template let-dialog let-dialogConfig=\"dialogConfig\" #dialogTemplate>\n    <fd-dialog [dialogConfig]=\"dialogConfig\" [dialogRef]=\"dialog\">\n        <fd-dialog-header>\n            <h1 fd-title fd-dialog-title *ngIf=\"mobileConfig?.title\">{{ mobileConfig.title }}</h1>\n            <button\n                fd-dialog-close-button\n                *ngIf=\"mobileConfig?.hasCloseButton\"\n                [mobile]=\"true\"\n                (click)=\"handleDismiss()\"\n            ></button>\n            <ng-template fdkTemplate=\"subheader\">\n                <div fd-bar-middle>\n                    <fd-bar-element [fullWidth]=\"true\">\n                        <ng-container *ngTemplateOutlet=\"childContent?.controlTemplate || null\"></ng-container>\n\n                        <button\n                            *ngIf=\"selectedShown$ | async\"\n                            fd-button\n                            glyph=\"multiselect-all\"\n                            fdType=\"emphasized\"\n                            [title]=\"'platformMultiCombobox.mobileShowAllItemsButton' | fdTranslate\"\n                            [attr.aria-label]=\"'platformMultiCombobox.mobileShowAllItemsButton' | fdTranslate\"\n                            class=\"fd-margin-begin--tiny\"\n                            (click)=\"showSelected()\"\n                        ></button>\n\n                        <button\n                            *ngIf=\"(selectedShown$ | async) === false\"\n                            fd-button\n                            glyph=\"multiselect-all\"\n                            fdType=\"transparent\"\n                            [title]=\"'platformMultiCombobox.mobileShowSelectedItemsButton' | fdTranslate\"\n                            [attr.aria-label]=\"'platformMultiCombobox.mobileShowSelectedItemsButton' | fdTranslate\"\n                            class=\"fd-margin-begin--tiny\"\n                            (click)=\"showSelected()\"\n                        ></button>\n                    </fd-bar-element>\n                </div>\n            </ng-template>\n        </fd-dialog-header>\n\n        <fd-dialog-body>\n            <ng-container *ngTemplateOutlet=\"childContent?.listTemplate || null\"></ng-container>\n        </fd-dialog-body>\n\n        <fd-dialog-footer>\n            <fd-button-bar\n                *ngIf=\"mobileConfig?.approveButtonText\"\n                fdType=\"emphasized\"\n                [label]=\"mobileConfig.approveButtonText!\"\n                (click)=\"handleApprove()\"\n            >\n            </fd-button-bar>\n            <fd-button-bar\n                *ngIf=\"mobileConfig?.cancelButtonText\"\n                [label]=\"mobileConfig.cancelButtonText!\"\n                (click)=\"handleDismiss()\"\n            >\n            </fd-button-bar>\n        </fd-dialog-footer>\n    </fd-dialog>\n</ng-template>\n", dependencies: [{ kind: "ngmodule", type: DialogModule }, { kind: "component", type: i1$2.DialogComponent, selector: "fd-dialog", inputs: ["class", "dialogRef", "dialogConfig"] }, { kind: "component", type: i1$2.DialogBodyComponent, selector: "fd-dialog-body" }, { kind: "component", type: i1$2.DialogFooterComponent, selector: "fd-dialog-footer" }, { kind: "component", type: i1$2.DialogHeaderComponent, selector: "fd-dialog-header" }, { kind: "component", type: i1$2.DialogCloseButtonComponent, selector: "[fd-dialog-close-button]", inputs: ["mobile", "title"] }, { kind: "directive", type: i1$2.DialogTitleDirective, selector: "[fd-dialog-title]", inputs: ["id"] }, { kind: "directive", type: i2$2.BarMiddleDirective, selector: "[fd-bar-middle]" }, { kind: "directive", type: i2$2.BarElementDirective, selector: "fd-bar-element", inputs: ["fullWidth"] }, { kind: "component", type: i2$2.ButtonBarComponent, selector: "fd-button-bar", inputs: ["fullWidth", "fdType", "title", "ariaLabel", "ariaLabelledby", "id"] }, { kind: "component", type: i3$3.TitleComponent, selector: "h1[fd-title], h2[fd-title], h3[fd-title], h4[fd-title], h5[fd-title], h6[fd-title]", inputs: ["headerSize", "wrap"], exportAs: ["fd-title"] }, { kind: "directive", type: i3$1.TemplateDirective, selector: "[fdkTemplate]", inputs: ["fdkTemplate"] }, { kind: "directive", type: NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "ngmodule", type: BarModule }, { kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "ngmodule", type: ButtonModule }, { kind: "component", type: i5$2.ButtonComponent, selector: "button[fd-button], a[fd-button]", inputs: ["class"], exportAs: ["fd-button"] }, { kind: "pipe", type: AsyncPipe, name: "async" }, { kind: "pipe", type: FdTranslatePipe, name: "fdTranslate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.1.0", ngImport: i0, type: MultiComboboxMobileComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'fdp-multi-combobox-mobile', changeDetection: ChangeDetectionStrategy.OnPush, template: "<ng-template let-dialog let-dialogConfig=\"dialogConfig\" #dialogTemplate>\n    <fd-dialog [dialogConfig]=\"dialogConfig\" [dialogRef]=\"dialog\">\n        <fd-dialog-header>\n            <h1 fd-title fd-dialog-title *ngIf=\"mobileConfig?.title\">{{ mobileConfig.title }}</h1>\n            <button\n                fd-dialog-close-button\n                *ngIf=\"mobileConfig?.hasCloseButton\"\n                [mobile]=\"true\"\n                (click)=\"handleDismiss()\"\n            ></button>\n            <ng-template fdkTemplate=\"subheader\">\n                <div fd-bar-middle>\n                    <fd-bar-element [fullWidth]=\"true\">\n                        <ng-container *ngTemplateOutlet=\"childContent?.controlTemplate || null\"></ng-container>\n\n                        <button\n                            *ngIf=\"selectedShown$ | async\"\n                            fd-button\n                            glyph=\"multiselect-all\"\n                            fdType=\"emphasized\"\n                            [title]=\"'platformMultiCombobox.mobileShowAllItemsButton' | fdTranslate\"\n                            [attr.aria-label]=\"'platformMultiCombobox.mobileShowAllItemsButton' | fdTranslate\"\n                            class=\"fd-margin-begin--tiny\"\n                            (click)=\"showSelected()\"\n                        ></button>\n\n                        <button\n                            *ngIf=\"(selectedShown$ | async) === false\"\n                            fd-button\n                            glyph=\"multiselect-all\"\n                            fdType=\"transparent\"\n                            [title]=\"'platformMultiCombobox.mobileShowSelectedItemsButton' | fdTranslate\"\n                            [attr.aria-label]=\"'platformMultiCombobox.mobileShowSelectedItemsButton' | fdTranslate\"\n                            class=\"fd-margin-begin--tiny\"\n                            (click)=\"showSelected()\"\n                        ></button>\n                    </fd-bar-element>\n                </div>\n            </ng-template>\n        </fd-dialog-header>\n\n        <fd-dialog-body>\n            <ng-container *ngTemplateOutlet=\"childContent?.listTemplate || null\"></ng-container>\n        </fd-dialog-body>\n\n        <fd-dialog-footer>\n            <fd-button-bar\n                *ngIf=\"mobileConfig?.approveButtonText\"\n                fdType=\"emphasized\"\n                [label]=\"mobileConfig.approveButtonText!\"\n                (click)=\"handleApprove()\"\n            >\n            </fd-button-bar>\n            <fd-button-bar\n                *ngIf=\"mobileConfig?.cancelButtonText\"\n                [label]=\"mobileConfig.cancelButtonText!\"\n                (click)=\"handleDismiss()\"\n            >\n            </fd-button-bar>\n        </fd-dialog-footer>\n    </fd-dialog>\n</ng-template>\n" }]
+            args: [{ selector: 'fdp-multi-combobox-mobile', changeDetection: ChangeDetectionStrategy.OnPush, standalone: true, imports: [
+                        DialogModule,
+                        NgIf,
+                        TitleComponent,
+                        TemplateDirective,
+                        BarModule,
+                        NgTemplateOutlet,
+                        ButtonModule,
+                        CdkScrollable,
+                        ScrollbarDirective,
+                        AsyncPipe,
+                        FdTranslatePipe
+                    ], template: "<ng-template let-dialog let-dialogConfig=\"dialogConfig\" #dialogTemplate>\n    <fd-dialog [dialogConfig]=\"dialogConfig\" [dialogRef]=\"dialog\">\n        <fd-dialog-header>\n            <h1 fd-title fd-dialog-title *ngIf=\"mobileConfig?.title\">{{ mobileConfig.title }}</h1>\n            <button\n                fd-dialog-close-button\n                *ngIf=\"mobileConfig?.hasCloseButton\"\n                [mobile]=\"true\"\n                (click)=\"handleDismiss()\"\n            ></button>\n            <ng-template fdkTemplate=\"subheader\">\n                <div fd-bar-middle>\n                    <fd-bar-element [fullWidth]=\"true\">\n                        <ng-container *ngTemplateOutlet=\"childContent?.controlTemplate || null\"></ng-container>\n\n                        <button\n                            *ngIf=\"selectedShown$ | async\"\n                            fd-button\n                            glyph=\"multiselect-all\"\n                            fdType=\"emphasized\"\n                            [title]=\"'platformMultiCombobox.mobileShowAllItemsButton' | fdTranslate\"\n                            [attr.aria-label]=\"'platformMultiCombobox.mobileShowAllItemsButton' | fdTranslate\"\n                            class=\"fd-margin-begin--tiny\"\n                            (click)=\"showSelected()\"\n                        ></button>\n\n                        <button\n                            *ngIf=\"(selectedShown$ | async) === false\"\n                            fd-button\n                            glyph=\"multiselect-all\"\n                            fdType=\"transparent\"\n                            [title]=\"'platformMultiCombobox.mobileShowSelectedItemsButton' | fdTranslate\"\n                            [attr.aria-label]=\"'platformMultiCombobox.mobileShowSelectedItemsButton' | fdTranslate\"\n                            class=\"fd-margin-begin--tiny\"\n                            (click)=\"showSelected()\"\n                        ></button>\n                    </fd-bar-element>\n                </div>\n            </ng-template>\n        </fd-dialog-header>\n\n        <fd-dialog-body>\n            <ng-container *ngTemplateOutlet=\"childContent?.listTemplate || null\"></ng-container>\n        </fd-dialog-body>\n\n        <fd-dialog-footer>\n            <fd-button-bar\n                *ngIf=\"mobileConfig?.approveButtonText\"\n                fdType=\"emphasized\"\n                [label]=\"mobileConfig.approveButtonText!\"\n                (click)=\"handleApprove()\"\n            >\n            </fd-button-bar>\n            <fd-button-bar\n                *ngIf=\"mobileConfig?.cancelButtonText\"\n                [label]=\"mobileConfig.cancelButtonText!\"\n                (click)=\"handleDismiss()\"\n            >\n            </fd-button-bar>\n        </fd-dialog-footer>\n    </fd-dialog>\n</ng-template>\n" }]
         }], ctorParameters: function () { return [{ type: i0.ElementRef }, { type: i1$2.DialogService }, { type: undefined, decorators: [{
                     type: Inject,
                     args: [MULTICOMBOBOX_COMPONENT]
@@ -9802,14 +9739,13 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.1.0", ngImpor
 
 class PlatformMultiComboboxMobileModule {
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.1.0", ngImport: i0, type: PlatformMultiComboboxMobileModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
-    static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "16.1.0", ngImport: i0, type: PlatformMultiComboboxMobileModule, declarations: [MultiComboboxMobileComponent], imports: [BarModule, DialogModule, ButtonModule, CommonModule, I18nModule], exports: [MultiComboboxMobileComponent] }); }
-    static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "16.1.0", ngImport: i0, type: PlatformMultiComboboxMobileModule, imports: [BarModule, DialogModule, ButtonModule, CommonModule, I18nModule] }); }
+    static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "16.1.0", ngImport: i0, type: PlatformMultiComboboxMobileModule, imports: [MultiComboboxMobileComponent], exports: [MultiComboboxMobileComponent] }); }
+    static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "16.1.0", ngImport: i0, type: PlatformMultiComboboxMobileModule, imports: [MultiComboboxMobileComponent] }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.1.0", ngImport: i0, type: PlatformMultiComboboxMobileModule, decorators: [{
             type: NgModule,
             args: [{
-                    declarations: [MultiComboboxMobileComponent],
-                    imports: [BarModule, DialogModule, ButtonModule, CommonModule, I18nModule],
+                    imports: [MultiComboboxMobileComponent],
                     exports: [MultiComboboxMobileComponent]
                 }]
         }] });
@@ -10075,15 +10011,15 @@ class MultiComboboxComponent extends BaseMultiCombobox {
         });
         await this._dynamicComponentService.createDynamicModule({ listTemplate: this.listTemplate, controlTemplate: this.mobileControlTemplate }, PlatformMultiComboboxMobileModule, MultiComboboxMobileComponent, this._viewContainerRef, injector);
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.1.0", ngImport: i0, type: MultiComboboxComponent, deps: [{ token: i0.ChangeDetectorRef }, { token: i0.ElementRef }, { token: i1$1.NgControl, optional: true, self: true }, { token: i1$1.ControlContainer, optional: true, skipSelf: true }, { token: i1$1.NgForm, optional: true, skipSelf: true }, { token: i1$2.DialogConfig, optional: true }, { token: i3$2.DynamicComponentService }, { token: DATA_PROVIDERS, optional: true }, { token: MultiComboboxConfig }, { token: i0.ViewContainerRef }, { token: i0.Injector }, { token: FD_FORM_FIELD, host: true, optional: true, skipSelf: true }, { token: FD_FORM_FIELD_CONTROL, host: true, optional: true, skipSelf: true }, { token: MAP_LIMIT }, { token: i5$2.ContentDensityObserver }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.1.0", type: MultiComboboxComponent, selector: "fdp-multi-combobox", providers: [
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.1.0", ngImport: i0, type: MultiComboboxComponent, deps: [{ token: i0.ChangeDetectorRef }, { token: i0.ElementRef }, { token: i1$1.NgControl, optional: true, self: true }, { token: i1$1.ControlContainer, optional: true, skipSelf: true }, { token: i1$1.NgForm, optional: true, skipSelf: true }, { token: i1$2.DialogConfig, optional: true }, { token: i3$1.DynamicComponentService }, { token: DATA_PROVIDERS, optional: true }, { token: MultiComboboxConfig }, { token: i0.ViewContainerRef }, { token: i0.Injector }, { token: FD_FORM_FIELD, host: true, optional: true, skipSelf: true }, { token: FD_FORM_FIELD_CONTROL, host: true, optional: true, skipSelf: true }, { token: MAP_LIMIT }, { token: i5$1.ContentDensityObserver }], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.1.0", type: MultiComboboxComponent, isStandalone: true, selector: "fdp-multi-combobox", providers: [
             {
                 provide: FD_FORM_FIELD_CONTROL,
                 useExisting: MultiComboboxComponent,
                 multi: true
             },
             contentDensityObserverProviders()
-        ], viewQueries: [{ propertyName: "mobileControlTemplate", first: true, predicate: ["mobileControlTemplate"], descendants: true }, { propertyName: "listTemplate", first: true, predicate: ["listTemplate"], descendants: true }, { propertyName: "_tokenizer", first: true, predicate: TokenizerComponent, descendants: true }], usesInheritance: true, ngImport: i0, template: "<div class=\"fdp-multi-combobox\">\n    <ng-container [ngTemplateOutlet]=\"controlTemplate\" *ngIf=\"mobile\"></ng-container>\n\n    <fd-popover\n        *ngIf=\"!mobile\"\n        additionalBodyClass=\"fd-popover-custom-list fdp-multi-combobox__list-container\"\n        (isOpenChange)=\"popoverOpenChangeHandle($event)\"\n        [isOpen]=\"isOpen\"\n        [triggers]=\"[]\"\n        [disabled]=\"disabled\"\n        [fillControlMode]=\"fillControlMode\"\n    >\n        <fd-popover-control>\n            <ng-container>\n                <ng-container *ngTemplateOutlet=\"controlTemplate\"></ng-container>\n            </ng-container>\n        </fd-popover-control>\n        <fd-popover-body [style.width.%]=\"!autoResize && 100\">\n            <ng-container *ngTemplateOutlet=\"listTemplate\"></ng-container>\n            <ng-content></ng-content>\n        </fd-popover-body>\n    </fd-popover>\n</div>\n\n<ng-template #controlTemplate>\n    <fd-form-input-message-group>\n        <fd-input-group\n            [id]=\"id + '-input-group-container'\"\n            class=\"fdp-multi-combobox-input-group-custom\"\n            [state]=\"state\"\n            [buttonFocusable]=\"buttonFocusable\"\n            [button]=\"!readonly\"\n            [glyph]=\"!readonly ? 'navigation-down-arrow' : ' '\"\n            [isControl]=\"true\"\n            [disabled]=\"disabled || readonly\"\n            [isExpanded]=\"!mobile && isOpen && _suggestions.length > 0\"\n            [attr.aria-disabled]=\"disabled || readonly\"\n            [attr.aria-readonly]=\"readonly\"\n            [glyphAriaLabel]=\"ariaLabel || ('platformMultiCombobox.inputGlyphAriaLabel' | fdTranslate)\"\n            [iconTitle]=\"addonIconTitle || ('platformMultiCombobox.inputGlyphAriaLabel' | fdTranslate)\"\n            (addOnButtonClicked)=\"_addOnClicked($event)\"\n            (click)=\"mobile && !isOpen && onPrimaryButtonClick(false)\"\n            (keydown)=\"navigateByTokens($event)\"\n        >\n            <fd-tokenizer\n                #tokenizer\n                [compactCollapse]=\"true\"\n                *ngIf=\"_selectedSuggestions\"\n                [tokenizerFocusable]=\"false\"\n                class=\"fdp-multi-combobox-tokenizer-custom\"\n                (moreClickedEvent)=\"moreClicked()\"\n            >\n                <fd-token\n                    [readOnly]=\"disabled\"\n                    (onCloseClick)=\"removeToken(token, $event)\"\n                    *ngFor=\"let token of _selectedSuggestions\"\n                >\n                    {{ token.label }}\n                </fd-token>\n\n                <input\n                    #searchInputElement\n                    fdp-auto-complete\n                    (onComplete)=\"onCompleteTerm($event)\"\n                    [options]=\"_suggestions\"\n                    [inputText]=\"inputText\"\n                    [mobile]=\"mobile\"\n                    type=\"text\"\n                    role=\"combobox\"\n                    autocomplete=\"off\"\n                    [attr.aria-label]=\"ariaLabel\"\n                    [attr.aria-labelledby]=\"ariaLabelledBy\"\n                    [attr.aria-autocomplete]=\"autoComplete && !mobile ? 'list' : null\"\n                    [attr.aria-owns]=\"autoComplete && !mobile ? id + '-result' : null\"\n                    [attr.aria-haspopup]=\"autoComplete && !mobile\"\n                    fd-form-control\n                    fd-input-group-input\n                    tabindex=\"0\"\n                    [id]=\"id\"\n                    [name]=\"name\"\n                    (keydown)=\"onInputKeydownHandler($event)\"\n                    [disabled]=\"disabled\"\n                    [(ngModel)]=\"inputText\"\n                    (ngModelChange)=\"searchTermChanged()\"\n                    [placeholder]=\"placeholder\"\n                    (focus)=\"onTouched(); tokenizer._showAllTokens()\"\n                    (blur)=\"!mobile && onBlur($event); tokenizer._hideTokens()\"\n                    [attr.aria-expanded]=\"isOpen\"\n                    [readonly]=\"readonly\"\n                    [attr.aria-readonly]=\"readonly\"\n                    [attr.aria-required]=\"required\"\n                    class=\"fd-tokenizer__input\"\n                />\n            </fd-tokenizer>\n        </fd-input-group>\n\n        <fd-form-message\n            *ngIf=\"mobile && isOpen ? false : !!stateMessage\"\n            [type]=\"state\"\n            [innerHtml]=\"stateMessage\"\n        ></fd-form-message>\n    </fd-form-input-message-group>\n</ng-template>\n\n<ng-template #mobileControlTemplate>\n    <fd-input-group\n        [id]=\"id + '-input-group-container'\"\n        class=\"fdp-multi-combobox-input-group-custom\"\n        [state]=\"state\"\n        [buttonFocusable]=\"false\"\n        [isControl]=\"true\"\n        [disabled]=\"disabled || readonly\"\n        [isExpanded]=\"!mobile && isOpen && _suggestions.length > 0\"\n        [attr.aria-disabled]=\"disabled || readonly\"\n        [attr.aria-readonly]=\"readonly\"\n        [glyphAriaLabel]=\"ariaLabel\"\n    >\n        <input\n            fdp-auto-complete\n            (onComplete)=\"onCompleteTerm($event)\"\n            [options]=\"_suggestions\"\n            [inputText]=\"inputText\"\n            [mobile]=\"mobile\"\n            type=\"text\"\n            role=\"combobox\"\n            autocomplete=\"off\"\n            [attr.aria-label]=\"ariaLabel\"\n            [attr.aria-labelledby]=\"ariaLabelledBy\"\n            [attr.aria-autocomplete]=\"autoComplete && !mobile ? 'list' : null\"\n            [attr.aria-owns]=\"autoComplete && !mobile ? id + '-result' : null\"\n            [attr.aria-haspopup]=\"autoComplete && !mobile\"\n            fd-form-control\n            fd-input-group-input\n            tabindex=\"0\"\n            [id]=\"id\"\n            [name]=\"name\"\n            (keydown)=\"onInputKeydownHandler($event)\"\n            [disabled]=\"disabled\"\n            [(ngModel)]=\"inputText\"\n            (ngModelChange)=\"searchTermChanged()\"\n            [placeholder]=\"placeholder\"\n            (focus)=\"onTouched()\"\n            (blur)=\"!mobile && onBlur($event)\"\n            [attr.aria-expanded]=\"isOpen\"\n            [readonly]=\"readonly\"\n            [attr.aria-readonly]=\"readonly\"\n        />\n    </fd-input-group>\n</ng-template>\n\n<ng-template #listTemplate>\n    <ul\n        fd-list\n        [hasMessage]=\"!!stateMessage\"\n        (focusEscapeList)=\"handleListFocusEscape($event)\"\n        [dropdownMode]=\"true\"\n        class=\"fdp-multi-combobox__list fd-list--multi-input\"\n        [id]=\"id + '-result'\"\n        role=\"listbox\"\n        [style.maxHeight]=\"!mobile && maxHeight\"\n        [style.minWidth]=\"!mobile && minWidth + 'px'\"\n        [style.maxWidth]=\"autoResize && maxWidth + 'px'\"\n        [attr.aria-labelledby]=\"id + '-search'\"\n        aria-multiselectable=\"true\"\n    >\n        <li\n            *ngIf=\"stateMessage\"\n            [attr.aria-label]=\"stateMessage\"\n            fd-list-message\n            tabindex=\"-1\"\n            role=\"presentation\"\n            [type]=\"state || 'default'\"\n            [innerHtml]=\"stateMessage\"\n        ></li>\n\n        <ng-content></ng-content>\n        <ng-container *ngIf=\"isGroup\">\n            <ng-container *ngFor=\"let group of _suggestions\">\n                <ng-container *ngIf=\"!groupItemTemplate\">\n                    <label fd-list-item fd-list-group-header role=\"group\">\n                        <span fd-list-title>{{ group.label }}</span>\n                    </label>\n                </ng-container>\n\n                <ng-container *ngIf=\"groupItemTemplate\">\n                    <ng-container\n                        [ngTemplateOutlet]=\"groupItemTemplate\"\n                        [ngTemplateOutletContext]=\"{ $implicit: { label: group.label } }\"\n                    ></ng-container>\n                </ng-container>\n\n                <li\n                    *ngFor=\"let optionItem of group.children; let i = index\"\n                    fd-list-item\n                    role=\"option\"\n                    [tabindex]=\"0\"\n                    (click)=\"!mobile && close()\"\n                    (keyDown)=\"onItemKeyDownHandler($event, i)\"\n                    [selected]=\"!!optionItem.selected\"\n                >\n                    <fd-checkbox\n                        (click)=\"onOptionCheckboxClicked($event, i)\"\n                        (ngModelChange)=\"toggleSelection(optionItem)\"\n                        [ngModel]=\"optionItem.selected\"\n                    >\n                    </fd-checkbox>\n                    <ng-container\n                        [ngTemplateOutlet]=\"listItem\"\n                        [ngTemplateOutletContext]=\"{ optionItem: optionItem, index: i }\"\n                    ></ng-container>\n                </li>\n            </ng-container>\n        </ng-container>\n\n        <ng-container *ngIf=\"!isGroup\">\n            <li\n                *ngFor=\"let optionItem of _suggestions; let i = index\"\n                fd-list-item\n                role=\"option\"\n                [tabindex]=\"0\"\n                (click)=\"!mobile && onOptionClicked($event, i)\"\n                (keyDown)=\"onItemKeyDownHandler($event, i)\"\n                [selected]=\"!!optionItem.selected\"\n            >\n                <fd-checkbox\n                    (click)=\"onOptionCheckboxClicked($event, i)\"\n                    (ngModelChange)=\"toggleSelection(optionItem)\"\n                    [ngModel]=\"optionItem.selected\"\n                >\n                </fd-checkbox>\n                <ng-container\n                    [ngTemplateOutlet]=\"listItem\"\n                    [ngTemplateOutletContext]=\"{ optionItem: optionItem, index: i }\"\n                ></ng-container>\n            </li>\n        </ng-container>\n    </ul>\n</ng-template>\n\n<ng-template let-optionItem=\"optionItem\" let-index=\"index\" #listItem>\n    <ng-container\n        *ngIf=\"optionItem.selected && !!selectedItemTemplate\"\n        [ngTemplateOutlet]=\"selectedItemTemplate\"\n        [ngTemplateOutletContext]=\"{ $implicit: optionItem.value, index: index }\"\n    ></ng-container>\n\n    <ng-container *ngIf=\"!(optionItem.selected && selectedItemTemplate)\">\n        <ng-container\n            [ngTemplateOutlet]=\"optionItemSource\"\n            [ngTemplateOutletContext]=\"{ optionItem: optionItem, index: index }\"\n        ></ng-container>\n\n        <ng-container\n            [ngTemplateOutlet]=\"secondaryTextSource\"\n            [ngTemplateOutletContext]=\"{ optionItem: optionItem }\"\n        ></ng-container>\n    </ng-container>\n</ng-template>\n\n<ng-template let-optionItem=\"optionItem\" let-index=\"index\" #optionItemSource>\n    <ng-container *ngIf=\"!optionItemTemplate\">\n        <span\n            fd-list-title\n            [attr.title]=\"optionItem.label\"\n            [innerHTML]=\"optionItem.label | highlight : inputText\"\n        ></span>\n    </ng-container>\n\n    <ng-container *ngIf=\"optionItemTemplate\">\n        <ng-container\n            [ngTemplateOutlet]=\"optionItemTemplate\"\n            [ngTemplateOutletContext]=\"{ $implicit: optionItem.value, index: index }\"\n        ></ng-container>\n    </ng-container>\n</ng-template>\n\n<ng-template let-optionItem=\"optionItem\" #secondaryTextSource>\n    <ng-container *ngIf=\"showSecondaryText\">\n        <ng-container *ngIf=\"!secondaryItemTemplate\">\n            <span\n                [style.text-align]=\"secondaryTextAlignment\"\n                fd-list-secondary\n                [attr.title]=\"optionItem.secondaryText\"\n                [innerHTML]=\"optionItem.secondaryText | highlight : inputText\"\n            ></span>\n        </ng-container>\n\n        <ng-container *ngIf=\"secondaryItemTemplate\">\n            <ng-container\n                [ngTemplateOutlet]=\"secondaryItemTemplate\"\n                [ngTemplateOutletContext]=\"{ $implicit: optionItem.value }\"\n            ></ng-container>\n        </ng-container>\n    </ng-container>\n</ng-template>\n", styles: ["/*!\n * Fundamental Library Styles v0.30.2-rc.6\n * Copyright (c) 2023 SAP SE or an SAP affiliate company.\n * Licensed under Apache License 2.0 (https://github.com/SAP/fundamental-styles/blob/main/LICENSE)\n */.fd-margin--tiny{margin:.5rem!important}.fd-margin--sm{margin:1rem!important}.fd-margin--md{margin:2rem!important}.fd-margin--lg{margin:3rem!important}.fd-margin--none{margin:0!important}.fd-margin-top--tiny{margin-top:.5rem!important}.fd-margin-top--sm{margin-top:1rem!important}.fd-margin-top--md{margin-top:2rem!important}.fd-margin-top--lg{margin-top:3rem!important}.fd-margin-top--none{margin-top:0!important}.fd-margin-end--tiny{margin-right:.5rem!important}.fd-margin-end--tiny[dir=rtl],[dir=rtl] .fd-margin-end--tiny{margin-left:.5rem!important;margin-right:0!important}.fd-margin-end--sm{margin-right:1rem!important}.fd-margin-end--sm[dir=rtl],[dir=rtl] .fd-margin-end--sm{margin-left:1rem!important;margin-right:0!important}.fd-margin-end--md{margin-right:2rem!important}.fd-margin-end--md[dir=rtl],[dir=rtl] .fd-margin-end--md{margin-left:2rem!important;margin-right:0!important}.fd-margin-end--lg{margin-right:3rem!important}.fd-margin-end--lg[dir=rtl],[dir=rtl] .fd-margin-end--lg{margin-left:3rem!important;margin-right:0!important}.fd-margin-end--none{margin-right:0}.fd-margin-end--none[dir=rtl],[dir=rtl] .fd-margin-end--none{margin-left:0!important}.fd-margin-bottom--tiny{margin-bottom:.5rem!important}.fd-margin-bottom--sm{margin-bottom:1rem!important}.fd-margin-bottom--md{margin-bottom:2rem!important}.fd-margin-bottom--lg{margin-bottom:3rem!important}.fd-margin-bottom--none{margin-bottom:0!important}.fd-margin-begin--tiny{margin-left:.5rem!important}.fd-margin-begin--tiny[dir=rtl],[dir=rtl] .fd-margin-begin--tiny{margin-left:0!important;margin-right:.5rem!important}.fd-margin-begin--sm{margin-left:1rem!important}.fd-margin-begin--sm[dir=rtl],[dir=rtl] .fd-margin-begin--sm{margin-left:0!important;margin-right:1rem!important}.fd-margin-begin--md{margin-left:2rem!important}.fd-margin-begin--md[dir=rtl],[dir=rtl] .fd-margin-begin--md{margin-left:0!important;margin-right:2rem!important}.fd-margin-begin--lg{margin-left:3rem!important}.fd-margin-begin--lg[dir=rtl],[dir=rtl] .fd-margin-begin--lg{margin-left:0!important;margin-right:3rem!important}.fd-margin-begin--none{margin-left:0}.fd-margin-begin--none[dir=rtl],[dir=rtl] .fd-margin-begin--none{margin-right:0!important}.fd-margin-top-bottom--tiny{margin-bottom:.5rem!important;margin-top:.5rem!important}.fd-margin-top-bottom--sm{margin-bottom:1rem!important;margin-top:1rem!important}.fd-margin-top-bottom--md{margin-bottom:2rem!important;margin-top:2rem!important}.fd-margin-top-bottom--lg{margin-bottom:3rem!important;margin-top:3rem!important}.fd-margin-begin-end--tiny{margin-left:.5rem!important;margin-right:.5rem!important}.fd-margin-begin-end--sm{margin-left:1rem!important;margin-right:1rem!important}.fd-margin-begin-end--md{margin-left:2rem!important;margin-right:2rem!important}.fd-margin-begin-end--lg{margin-left:3rem!important;margin-right:3rem!important}.fd-margin-responsive--sm{margin:0 0 1rem!important}.fd-margin-responsive--md{margin:1rem!important}.fd-margin-responsive--lg{margin:1rem 2rem!important}.fd-margin-responsive--xl{margin:1rem 3rem!important}.fd-margin-negative-begin-end--tiny{margin:0 -.5rem!important}.fd-margin-negative-begin-end--sm{margin:0 -1rem!important}.fd-margin-negative-begin-end--md{margin:0 -2rem!important}.fd-margin-negative-begin-end--lg{margin:0 -3rem!important}.fdp-multi-combobox-tokenizer-custom{width:calc(100% - 2.25rem)}.fdp-multi-combobox-tokenizer-custom--compact{width:calc(100% - 2rem)}.fdp-multi-combobox__list-container .fd-list .fd-list__item.fd-list__group-header{padding:0 1rem}.fdp-multi-combobox__list-container .fd-list .fd-list__item .fd-list__title{max-width:inherit}.fdp-multi-combobox__list-container .fd-list.fd-list--compact .fd-list__item.fd-list__group-header{padding:0 .5rem}\n"], dependencies: [{ kind: "directive", type: i3.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i3.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i3.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: i1$1.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i1$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$1.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "component", type: i7$4.CheckboxComponent, selector: "fd-checkbox", inputs: ["wrapLabel", "valignLabel", "ariaLabel", "value", "ariaLabelledBy", "ariaDescribedBy", "title", "inputId", "state", "name", "label", "disabled", "tristate", "tristateSelectable", "labelClass", "required", "displayOnly", "values", "standalone"], outputs: ["focusChange"] }, { kind: "component", type: i10.InputGroupComponent, selector: "fd-input-group", inputs: ["placement", "required", "inline", "placeholder", "addOnText", "buttonFocusable", "type", "glyph", "button", "disabled", "readonly", "state", "isControl", "showFocus", "isExpanded", "glyphAriaLabel", "iconTitle", "ariaLabelledBy"], outputs: ["addOnButtonClicked", "search"] }, { kind: "directive", type: i10.InputGroupInputDirective, selector: "[fdInputGroupInput], [fd-input-group-input]", inputs: ["class"] }, { kind: "component", type: i8.TokenComponent, selector: "fd-token", inputs: ["disabled", "selected", "readOnly"], outputs: ["onCloseClick", "onRemove", "onTokenClick", "onTokenKeydown", "elementFocused"] }, { kind: "component", type: i8.TokenizerComponent, selector: "fd-tokenizer", inputs: ["class", "disableKeyboardDeletion", "compactCollapse", "tokenizerFocusable", "inputValue", "glyph", "moreTerm", "open"], outputs: ["moreClickedEvent"] }, { kind: "component", type: i7$1.ListComponent, selector: "[fd-list], [fdList]", inputs: ["dropdownMode", "multiInputMode", "mobileMode", "hasMessage", "noBorder", "navigationIndicator", "selection", "keyboardSupport", "byline", "unreadIndicator"], outputs: ["focusEscapeList"] }, { kind: "component", type: i7$1.ListItemComponent, selector: "[fdListItem] ,[fd-list-item]", inputs: ["selected", "noData", "action", "interactive", "growing", "counter", "unread", "byline"], outputs: ["keyDown"] }, { kind: "directive", type: i7$1.ListTitleDirective, selector: "[fd-list-title], [fdListTitle]", inputs: ["wrap"] }, { kind: "directive", type: i7$1.ListGroupHeaderDirective, selector: "[fdListGroupHeader], [fd-list-group-header]", inputs: ["nativeElementId"], outputs: ["keyDown"] }, { kind: "directive", type: i7$1.ListSecondaryDirective, selector: "[fd-list-secondary], [fdListSecondary]", inputs: ["type"] }, { kind: "directive", type: i7$1.ListMessageDirective, selector: "[fd-list-message], [fdListMessage]", inputs: ["type", "class"] }, { kind: "component", type: i4.FormControlComponent, selector: "[fd-form-control]", inputs: ["state", "type", "class", "ariaLabel", "ariaLabelledBy"] }, { kind: "directive", type: i4.InputFormControlDirective, selector: "input[fd-form-control]" }, { kind: "component", type: i4.FormMessageComponent, selector: "fd-form-message", inputs: ["type", "static", "embedded", "class"] }, { kind: "component", type: i4.FormInputMessageGroupComponent, selector: "fd-form-input-message-group", inputs: ["triggers", "closeOnOutsideClick", "fillControlMode", "noArrow", "closeOnEscapeKey", "placement", "placementContainer", "isOpen"], outputs: ["isOpenChange"] }, { kind: "component", type: i2.PopoverControlComponent, selector: "fd-popover-control" }, { kind: "component", type: i2.PopoverBodyComponent, selector: "fd-popover-body" }, { kind: "component", type: i2.PopoverComponent, selector: "fd-popover", inputs: ["title", "trigger", "fixedPosition", "id", "mobile", "mobileConfig"] }, { kind: "directive", type: AutoCompleteDirective, selector: "[fdp-auto-complete]", inputs: ["options", "inputText", "mobile"], outputs: ["onComplete"] }, { kind: "pipe", type: i3$2.SearchHighlightPipe, name: "highlight" }, { kind: "pipe", type: i5$1.FdTranslatePipe, name: "fdTranslate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
+        ], viewQueries: [{ propertyName: "mobileControlTemplate", first: true, predicate: ["mobileControlTemplate"], descendants: true }, { propertyName: "listTemplate", first: true, predicate: ["listTemplate"], descendants: true }, { propertyName: "_tokenizer", first: true, predicate: TokenizerComponent, descendants: true }], usesInheritance: true, ngImport: i0, template: "<div class=\"fdp-multi-combobox\">\n    <ng-container [ngTemplateOutlet]=\"controlTemplate\" *ngIf=\"mobile\"></ng-container>\n\n    <fd-popover\n        *ngIf=\"!mobile\"\n        additionalBodyClass=\"fd-popover-custom-list fdp-multi-combobox__list-container\"\n        (isOpenChange)=\"popoverOpenChangeHandle($event)\"\n        [isOpen]=\"isOpen\"\n        [triggers]=\"[]\"\n        [disabled]=\"disabled\"\n        [fillControlMode]=\"fillControlMode\"\n    >\n        <fd-popover-control>\n            <ng-container>\n                <ng-container *ngTemplateOutlet=\"controlTemplate\"></ng-container>\n            </ng-container>\n        </fd-popover-control>\n        <fd-popover-body [style.width.%]=\"!autoResize && 100\">\n            <ng-container *ngTemplateOutlet=\"listTemplate\"></ng-container>\n            <ng-content></ng-content>\n        </fd-popover-body>\n    </fd-popover>\n</div>\n\n<ng-template #controlTemplate>\n    <fd-form-input-message-group>\n        <fd-input-group\n            [id]=\"id + '-input-group-container'\"\n            class=\"fdp-multi-combobox-input-group-custom\"\n            [state]=\"state\"\n            [buttonFocusable]=\"buttonFocusable\"\n            [button]=\"!readonly\"\n            [glyph]=\"!readonly ? 'navigation-down-arrow' : ' '\"\n            [isControl]=\"true\"\n            [disabled]=\"disabled || readonly\"\n            [isExpanded]=\"!mobile && isOpen && _suggestions.length > 0\"\n            [attr.aria-disabled]=\"disabled || readonly\"\n            [attr.aria-readonly]=\"readonly\"\n            [glyphAriaLabel]=\"ariaLabel || ('platformMultiCombobox.inputGlyphAriaLabel' | fdTranslate)\"\n            [iconTitle]=\"addonIconTitle || ('platformMultiCombobox.inputGlyphAriaLabel' | fdTranslate)\"\n            (addOnButtonClicked)=\"_addOnClicked($event)\"\n            (click)=\"mobile && !isOpen && onPrimaryButtonClick(false)\"\n            (keydown)=\"navigateByTokens($event)\"\n        >\n            <fd-tokenizer\n                #tokenizer\n                [compactCollapse]=\"true\"\n                *ngIf=\"_selectedSuggestions\"\n                [tokenizerFocusable]=\"false\"\n                class=\"fdp-multi-combobox-tokenizer-custom\"\n                (moreClickedEvent)=\"moreClicked()\"\n            >\n                <fd-token\n                    [readOnly]=\"disabled\"\n                    (onCloseClick)=\"removeToken(token, $event)\"\n                    *ngFor=\"let token of _selectedSuggestions\"\n                >\n                    {{ token.label }}\n                </fd-token>\n\n                <input\n                    #searchInputElement\n                    fdp-auto-complete\n                    (onComplete)=\"onCompleteTerm($event)\"\n                    [options]=\"_suggestions\"\n                    [inputText]=\"inputText\"\n                    [mobile]=\"mobile\"\n                    type=\"text\"\n                    role=\"combobox\"\n                    autocomplete=\"off\"\n                    [attr.aria-label]=\"ariaLabel\"\n                    [attr.aria-labelledby]=\"ariaLabelledBy\"\n                    [attr.aria-autocomplete]=\"autoComplete && !mobile ? 'list' : null\"\n                    [attr.aria-owns]=\"autoComplete && !mobile ? id + '-result' : null\"\n                    [attr.aria-haspopup]=\"autoComplete && !mobile\"\n                    fd-form-control\n                    fd-input-group-input\n                    tabindex=\"0\"\n                    [id]=\"id\"\n                    [name]=\"name\"\n                    (keydown)=\"onInputKeydownHandler($event)\"\n                    [disabled]=\"disabled\"\n                    [(ngModel)]=\"inputText\"\n                    (ngModelChange)=\"searchTermChanged()\"\n                    [placeholder]=\"placeholder\"\n                    (focus)=\"onTouched(); tokenizer._showAllTokens()\"\n                    (blur)=\"!mobile && onBlur($event); tokenizer._hideTokens()\"\n                    [attr.aria-expanded]=\"isOpen\"\n                    [readonly]=\"readonly\"\n                    [attr.aria-readonly]=\"readonly\"\n                    [attr.aria-required]=\"required\"\n                    class=\"fd-tokenizer__input\"\n                />\n            </fd-tokenizer>\n        </fd-input-group>\n\n        <fd-form-message\n            *ngIf=\"mobile && isOpen ? false : !!stateMessage\"\n            [type]=\"state\"\n            [innerHtml]=\"stateMessage\"\n        ></fd-form-message>\n    </fd-form-input-message-group>\n</ng-template>\n\n<ng-template #mobileControlTemplate>\n    <fd-input-group\n        [id]=\"id + '-input-group-container'\"\n        class=\"fdp-multi-combobox-input-group-custom\"\n        [state]=\"state\"\n        [buttonFocusable]=\"false\"\n        [isControl]=\"true\"\n        [disabled]=\"disabled || readonly\"\n        [isExpanded]=\"!mobile && isOpen && _suggestions.length > 0\"\n        [attr.aria-disabled]=\"disabled || readonly\"\n        [attr.aria-readonly]=\"readonly\"\n        [glyphAriaLabel]=\"ariaLabel\"\n    >\n        <input\n            fdp-auto-complete\n            (onComplete)=\"onCompleteTerm($event)\"\n            [options]=\"_suggestions\"\n            [inputText]=\"inputText\"\n            [mobile]=\"mobile\"\n            type=\"text\"\n            role=\"combobox\"\n            autocomplete=\"off\"\n            [attr.aria-label]=\"ariaLabel\"\n            [attr.aria-labelledby]=\"ariaLabelledBy\"\n            [attr.aria-autocomplete]=\"autoComplete && !mobile ? 'list' : null\"\n            [attr.aria-owns]=\"autoComplete && !mobile ? id + '-result' : null\"\n            [attr.aria-haspopup]=\"autoComplete && !mobile\"\n            fd-form-control\n            fd-input-group-input\n            tabindex=\"0\"\n            [id]=\"id\"\n            [name]=\"name\"\n            (keydown)=\"onInputKeydownHandler($event)\"\n            [disabled]=\"disabled\"\n            [(ngModel)]=\"inputText\"\n            (ngModelChange)=\"searchTermChanged()\"\n            [placeholder]=\"placeholder\"\n            (focus)=\"onTouched()\"\n            (blur)=\"!mobile && onBlur($event)\"\n            [attr.aria-expanded]=\"isOpen\"\n            [readonly]=\"readonly\"\n            [attr.aria-readonly]=\"readonly\"\n        />\n    </fd-input-group>\n</ng-template>\n\n<ng-template #listTemplate>\n    <ul\n        fd-list\n        [hasMessage]=\"!!stateMessage\"\n        (focusEscapeList)=\"handleListFocusEscape($event)\"\n        [dropdownMode]=\"true\"\n        class=\"fdp-multi-combobox__list fd-list--multi-input\"\n        [hasMessage]=\"!!stateMessage || (!!advancedStateMessage?.hasErrors && !!advancedStateMessage?.template)\"\n        [id]=\"id + '-result'\"\n        role=\"listbox\"\n        [style.maxHeight]=\"!mobile && maxHeight\"\n        [style.minWidth]=\"!mobile && minWidth + 'px'\"\n        [style.maxWidth]=\"autoResize && maxWidth + 'px'\"\n        [attr.aria-labelledby]=\"id + '-search'\"\n        aria-multiselectable=\"true\"\n    >\n        <li\n            *ngIf=\"stateMessage\"\n            [attr.aria-label]=\"stateMessage\"\n            fd-list-message\n            tabindex=\"-1\"\n            role=\"presentation\"\n            [type]=\"state || 'default'\"\n            [innerHtml]=\"stateMessage\"\n        ></li>\n\n        <li\n            *ngIf=\"advancedStateMessage?.hasErrors && advancedStateMessage?.template\"\n            fd-list-message\n            tabindex=\"-1\"\n            role=\"presentation\"\n            [type]=\"state || 'default'\"\n        >\n            <ng-template [ngTemplateOutlet]=\"advancedStateMessage!.template!\"></ng-template>\n        </li>\n\n        <ng-content></ng-content>\n        <ng-container *ngIf=\"isGroup\">\n            <ng-container *ngFor=\"let group of _suggestions\">\n                <ng-container *ngIf=\"!groupItemTemplate\">\n                    <label fd-list-item fd-list-group-header role=\"group\">\n                        <span fd-list-title>{{ group.label }}</span>\n                    </label>\n                </ng-container>\n\n                <ng-container *ngIf=\"groupItemTemplate\">\n                    <ng-container\n                        [ngTemplateOutlet]=\"groupItemTemplate\"\n                        [ngTemplateOutletContext]=\"{ $implicit: { label: group.label } }\"\n                    ></ng-container>\n                </ng-container>\n\n                <li\n                    *ngFor=\"let optionItem of group.children; let i = index\"\n                    fd-list-item\n                    role=\"option\"\n                    [tabindex]=\"0\"\n                    (click)=\"!mobile && close()\"\n                    (keyDown)=\"onItemKeyDownHandler($event, i)\"\n                    [selected]=\"!!optionItem.selected\"\n                >\n                    <fd-checkbox\n                        (click)=\"onOptionCheckboxClicked($event, i)\"\n                        (ngModelChange)=\"toggleSelection(optionItem)\"\n                        [ngModel]=\"optionItem.selected\"\n                    >\n                    </fd-checkbox>\n                    <ng-container\n                        [ngTemplateOutlet]=\"listItem\"\n                        [ngTemplateOutletContext]=\"{ optionItem: optionItem, index: i }\"\n                    ></ng-container>\n                </li>\n            </ng-container>\n        </ng-container>\n\n        <ng-container *ngIf=\"!isGroup\">\n            <li\n                *ngFor=\"let optionItem of _suggestions; let i = index\"\n                fd-list-item\n                role=\"option\"\n                [tabindex]=\"0\"\n                (click)=\"!mobile && onOptionClicked($event, i)\"\n                (keyDown)=\"onItemKeyDownHandler($event, i)\"\n                [selected]=\"!!optionItem.selected\"\n            >\n                <fd-checkbox\n                    (click)=\"onOptionCheckboxClicked($event, i)\"\n                    (ngModelChange)=\"toggleSelection(optionItem)\"\n                    [ngModel]=\"optionItem.selected\"\n                >\n                </fd-checkbox>\n                <ng-container\n                    [ngTemplateOutlet]=\"listItem\"\n                    [ngTemplateOutletContext]=\"{ optionItem: optionItem, index: i }\"\n                ></ng-container>\n            </li>\n        </ng-container>\n    </ul>\n</ng-template>\n\n<ng-template let-optionItem=\"optionItem\" let-index=\"index\" #listItem>\n    <ng-container\n        *ngIf=\"optionItem.selected && !!selectedItemTemplate\"\n        [ngTemplateOutlet]=\"selectedItemTemplate\"\n        [ngTemplateOutletContext]=\"{ $implicit: optionItem.value, index: index }\"\n    ></ng-container>\n\n    <ng-container *ngIf=\"!(optionItem.selected && selectedItemTemplate)\">\n        <ng-container\n            [ngTemplateOutlet]=\"optionItemSource\"\n            [ngTemplateOutletContext]=\"{ optionItem: optionItem, index: index }\"\n        ></ng-container>\n\n        <ng-container\n            [ngTemplateOutlet]=\"secondaryTextSource\"\n            [ngTemplateOutletContext]=\"{ optionItem: optionItem }\"\n        ></ng-container>\n    </ng-container>\n</ng-template>\n\n<ng-template let-optionItem=\"optionItem\" let-index=\"index\" #optionItemSource>\n    <ng-container *ngIf=\"!optionItemTemplate\">\n        <span\n            fd-list-title\n            [attr.title]=\"optionItem.label\"\n            [innerHTML]=\"optionItem.label | highlight : inputText\"\n        ></span>\n    </ng-container>\n\n    <ng-container *ngIf=\"optionItemTemplate\">\n        <ng-container\n            [ngTemplateOutlet]=\"optionItemTemplate\"\n            [ngTemplateOutletContext]=\"{ $implicit: optionItem.value, index: index }\"\n        ></ng-container>\n    </ng-container>\n</ng-template>\n\n<ng-template let-optionItem=\"optionItem\" #secondaryTextSource>\n    <ng-container *ngIf=\"showSecondaryText\">\n        <ng-container *ngIf=\"!secondaryItemTemplate\">\n            <span\n                [style.text-align]=\"secondaryTextAlignment\"\n                fd-list-secondary\n                [attr.title]=\"optionItem.secondaryText\"\n                [innerHTML]=\"optionItem.secondaryText | highlight : inputText\"\n            ></span>\n        </ng-container>\n\n        <ng-container *ngIf=\"secondaryItemTemplate\">\n            <ng-container\n                [ngTemplateOutlet]=\"secondaryItemTemplate\"\n                [ngTemplateOutletContext]=\"{ $implicit: optionItem.value }\"\n            ></ng-container>\n        </ng-container>\n    </ng-container>\n</ng-template>\n", styles: ["/*!\n * Fundamental Library Styles v0.30.2-rc.6\n * Copyright (c) 2023 SAP SE or an SAP affiliate company.\n * Licensed under Apache License 2.0 (https://github.com/SAP/fundamental-styles/blob/main/LICENSE)\n */.fd-margin--tiny{margin:.5rem!important}.fd-margin--sm{margin:1rem!important}.fd-margin--md{margin:2rem!important}.fd-margin--lg{margin:3rem!important}.fd-margin--none{margin:0!important}.fd-margin-top--tiny{margin-top:.5rem!important}.fd-margin-top--sm{margin-top:1rem!important}.fd-margin-top--md{margin-top:2rem!important}.fd-margin-top--lg{margin-top:3rem!important}.fd-margin-top--none{margin-top:0!important}.fd-margin-end--tiny{margin-right:.5rem!important}.fd-margin-end--tiny[dir=rtl],[dir=rtl] .fd-margin-end--tiny{margin-left:.5rem!important;margin-right:0!important}.fd-margin-end--sm{margin-right:1rem!important}.fd-margin-end--sm[dir=rtl],[dir=rtl] .fd-margin-end--sm{margin-left:1rem!important;margin-right:0!important}.fd-margin-end--md{margin-right:2rem!important}.fd-margin-end--md[dir=rtl],[dir=rtl] .fd-margin-end--md{margin-left:2rem!important;margin-right:0!important}.fd-margin-end--lg{margin-right:3rem!important}.fd-margin-end--lg[dir=rtl],[dir=rtl] .fd-margin-end--lg{margin-left:3rem!important;margin-right:0!important}.fd-margin-end--none{margin-right:0}.fd-margin-end--none[dir=rtl],[dir=rtl] .fd-margin-end--none{margin-left:0!important}.fd-margin-bottom--tiny{margin-bottom:.5rem!important}.fd-margin-bottom--sm{margin-bottom:1rem!important}.fd-margin-bottom--md{margin-bottom:2rem!important}.fd-margin-bottom--lg{margin-bottom:3rem!important}.fd-margin-bottom--none{margin-bottom:0!important}.fd-margin-begin--tiny{margin-left:.5rem!important}.fd-margin-begin--tiny[dir=rtl],[dir=rtl] .fd-margin-begin--tiny{margin-left:0!important;margin-right:.5rem!important}.fd-margin-begin--sm{margin-left:1rem!important}.fd-margin-begin--sm[dir=rtl],[dir=rtl] .fd-margin-begin--sm{margin-left:0!important;margin-right:1rem!important}.fd-margin-begin--md{margin-left:2rem!important}.fd-margin-begin--md[dir=rtl],[dir=rtl] .fd-margin-begin--md{margin-left:0!important;margin-right:2rem!important}.fd-margin-begin--lg{margin-left:3rem!important}.fd-margin-begin--lg[dir=rtl],[dir=rtl] .fd-margin-begin--lg{margin-left:0!important;margin-right:3rem!important}.fd-margin-begin--none{margin-left:0}.fd-margin-begin--none[dir=rtl],[dir=rtl] .fd-margin-begin--none{margin-right:0!important}.fd-margin-top-bottom--tiny{margin-bottom:.5rem!important;margin-top:.5rem!important}.fd-margin-top-bottom--sm{margin-bottom:1rem!important;margin-top:1rem!important}.fd-margin-top-bottom--md{margin-bottom:2rem!important;margin-top:2rem!important}.fd-margin-top-bottom--lg{margin-bottom:3rem!important;margin-top:3rem!important}.fd-margin-begin-end--tiny{margin-left:.5rem!important;margin-right:.5rem!important}.fd-margin-begin-end--sm{margin-left:1rem!important;margin-right:1rem!important}.fd-margin-begin-end--md{margin-left:2rem!important;margin-right:2rem!important}.fd-margin-begin-end--lg{margin-left:3rem!important;margin-right:3rem!important}.fd-margin-responsive--sm{margin:0 0 1rem!important}.fd-margin-responsive--md{margin:1rem!important}.fd-margin-responsive--lg{margin:1rem 2rem!important}.fd-margin-responsive--xl{margin:1rem 3rem!important}.fd-margin-negative-begin-end--tiny{margin:0 -.5rem!important}.fd-margin-negative-begin-end--sm{margin:0 -1rem!important}.fd-margin-negative-begin-end--md{margin:0 -2rem!important}.fd-margin-negative-begin-end--lg{margin:0 -3rem!important}.fdp-multi-combobox-tokenizer-custom{width:calc(100% - 2.25rem)}.fdp-multi-combobox-tokenizer-custom--compact{width:calc(100% - 2rem)}.fdp-multi-combobox__list-container .fd-list .fd-list__item.fd-list__group-header{padding:0 1rem}.fdp-multi-combobox__list-container .fd-list .fd-list__item .fd-list__title{max-width:inherit}.fdp-multi-combobox__list-container .fd-list.fd-list--compact .fd-list__item.fd-list__group-header{padding:0 .5rem}\n"], dependencies: [{ kind: "directive", type: NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: PopoverComponent, selector: "fd-popover", inputs: ["title", "trigger", "fixedPosition", "id", "mobile", "mobileConfig"] }, { kind: "component", type: PopoverControlComponent, selector: "fd-popover-control" }, { kind: "component", type: PopoverBodyComponent, selector: "fd-popover-body" }, { kind: "ngmodule", type: FormInputMessageGroupModule }, { kind: "component", type: i3.FormInputMessageGroupComponent, selector: "fd-form-input-message-group", inputs: ["triggers", "closeOnOutsideClick", "fillControlMode", "noArrow", "closeOnEscapeKey", "placement", "placementContainer", "isOpen"], outputs: ["isOpenChange"] }, { kind: "ngmodule", type: InputGroupModule }, { kind: "component", type: i6.InputGroupComponent, selector: "fd-input-group", inputs: ["placement", "required", "inline", "placeholder", "addOnText", "buttonFocusable", "type", "glyph", "button", "disabled", "readonly", "state", "isControl", "showFocus", "isExpanded", "glyphAriaLabel", "iconTitle", "ariaLabelledBy"], outputs: ["addOnButtonClicked", "search"] }, { kind: "directive", type: i6.InputGroupInputDirective, selector: "[fdInputGroupInput], [fd-input-group-input]", inputs: ["class"] }, { kind: "ngmodule", type: TokenModule }, { kind: "component", type: i7.TokenComponent, selector: "fd-token", inputs: ["disabled", "selected", "readOnly"], outputs: ["onCloseClick", "onRemove", "onTokenClick", "onTokenKeydown", "elementFocused"] }, { kind: "component", type: i7.TokenizerComponent, selector: "fd-tokenizer", inputs: ["class", "disableKeyboardDeletion", "compactCollapse", "tokenizerFocusable", "inputValue", "glyph", "moreTerm", "open"], outputs: ["moreClickedEvent"] }, { kind: "directive", type: NgFor, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "ngmodule", type: FormControlModule }, { kind: "component", type: i3.FormControlComponent, selector: "[fd-form-control]", inputs: ["state", "type", "class", "ariaLabel", "ariaLabelledBy"] }, { kind: "directive", type: i3.InputFormControlDirective, selector: "input[fd-form-control]" }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1$1.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i1$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$1.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "directive", type: AutoCompleteDirective, selector: "[fdp-auto-complete]", inputs: ["options", "inputText", "mobile"], outputs: ["onComplete"] }, { kind: "ngmodule", type: FormMessageModule }, { kind: "component", type: i3.FormMessageComponent, selector: "fd-form-message", inputs: ["type", "static", "embedded", "class"] }, { kind: "ngmodule", type: ListModule }, { kind: "component", type: i7$1.ListComponent, selector: "[fd-list], [fdList]", inputs: ["dropdownMode", "multiInputMode", "mobileMode", "hasMessage", "noBorder", "navigationIndicator", "selection", "keyboardSupport", "byline", "unreadIndicator"], outputs: ["focusEscapeList"] }, { kind: "component", type: i7$1.ListItemComponent, selector: "[fdListItem] ,[fd-list-item]", inputs: ["selected", "noData", "action", "interactive", "growing", "counter", "unread", "byline"], outputs: ["keyDown"] }, { kind: "directive", type: i7$1.ListTitleDirective, selector: "[fd-list-title], [fdListTitle]", inputs: ["wrap"] }, { kind: "directive", type: i7$1.ListGroupHeaderDirective, selector: "[fdListGroupHeader], [fd-list-group-header]", inputs: ["nativeElementId"], outputs: ["keyDown"] }, { kind: "directive", type: i7$1.ListSecondaryDirective, selector: "[fd-list-secondary], [fdListSecondary]", inputs: ["type"] }, { kind: "directive", type: i7$1.ListMessageDirective, selector: "[fd-list-message], [fdListMessage]", inputs: ["type", "class"] }, { kind: "component", type: CheckboxComponent$1, selector: "fd-checkbox", inputs: ["wrapLabel", "valignLabel", "ariaLabel", "value", "ariaLabelledBy", "ariaDescribedBy", "title", "inputId", "state", "name", "label", "disabled", "tristate", "tristateSelectable", "labelClass", "required", "displayOnly", "values", "standalone"], outputs: ["focusChange"] }, { kind: "pipe", type: SearchHighlightPipe, name: "highlight" }, { kind: "pipe", type: FdTranslatePipe, name: "fdTranslate" }, { kind: "ngmodule", type: ContentDensityModule }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.1.0", ngImport: i0, type: MultiComboboxComponent, decorators: [{
             type: Component,
@@ -10094,7 +10030,28 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.1.0", ngImpor
                             multi: true
                         },
                         contentDensityObserverProviders()
-                    ], template: "<div class=\"fdp-multi-combobox\">\n    <ng-container [ngTemplateOutlet]=\"controlTemplate\" *ngIf=\"mobile\"></ng-container>\n\n    <fd-popover\n        *ngIf=\"!mobile\"\n        additionalBodyClass=\"fd-popover-custom-list fdp-multi-combobox__list-container\"\n        (isOpenChange)=\"popoverOpenChangeHandle($event)\"\n        [isOpen]=\"isOpen\"\n        [triggers]=\"[]\"\n        [disabled]=\"disabled\"\n        [fillControlMode]=\"fillControlMode\"\n    >\n        <fd-popover-control>\n            <ng-container>\n                <ng-container *ngTemplateOutlet=\"controlTemplate\"></ng-container>\n            </ng-container>\n        </fd-popover-control>\n        <fd-popover-body [style.width.%]=\"!autoResize && 100\">\n            <ng-container *ngTemplateOutlet=\"listTemplate\"></ng-container>\n            <ng-content></ng-content>\n        </fd-popover-body>\n    </fd-popover>\n</div>\n\n<ng-template #controlTemplate>\n    <fd-form-input-message-group>\n        <fd-input-group\n            [id]=\"id + '-input-group-container'\"\n            class=\"fdp-multi-combobox-input-group-custom\"\n            [state]=\"state\"\n            [buttonFocusable]=\"buttonFocusable\"\n            [button]=\"!readonly\"\n            [glyph]=\"!readonly ? 'navigation-down-arrow' : ' '\"\n            [isControl]=\"true\"\n            [disabled]=\"disabled || readonly\"\n            [isExpanded]=\"!mobile && isOpen && _suggestions.length > 0\"\n            [attr.aria-disabled]=\"disabled || readonly\"\n            [attr.aria-readonly]=\"readonly\"\n            [glyphAriaLabel]=\"ariaLabel || ('platformMultiCombobox.inputGlyphAriaLabel' | fdTranslate)\"\n            [iconTitle]=\"addonIconTitle || ('platformMultiCombobox.inputGlyphAriaLabel' | fdTranslate)\"\n            (addOnButtonClicked)=\"_addOnClicked($event)\"\n            (click)=\"mobile && !isOpen && onPrimaryButtonClick(false)\"\n            (keydown)=\"navigateByTokens($event)\"\n        >\n            <fd-tokenizer\n                #tokenizer\n                [compactCollapse]=\"true\"\n                *ngIf=\"_selectedSuggestions\"\n                [tokenizerFocusable]=\"false\"\n                class=\"fdp-multi-combobox-tokenizer-custom\"\n                (moreClickedEvent)=\"moreClicked()\"\n            >\n                <fd-token\n                    [readOnly]=\"disabled\"\n                    (onCloseClick)=\"removeToken(token, $event)\"\n                    *ngFor=\"let token of _selectedSuggestions\"\n                >\n                    {{ token.label }}\n                </fd-token>\n\n                <input\n                    #searchInputElement\n                    fdp-auto-complete\n                    (onComplete)=\"onCompleteTerm($event)\"\n                    [options]=\"_suggestions\"\n                    [inputText]=\"inputText\"\n                    [mobile]=\"mobile\"\n                    type=\"text\"\n                    role=\"combobox\"\n                    autocomplete=\"off\"\n                    [attr.aria-label]=\"ariaLabel\"\n                    [attr.aria-labelledby]=\"ariaLabelledBy\"\n                    [attr.aria-autocomplete]=\"autoComplete && !mobile ? 'list' : null\"\n                    [attr.aria-owns]=\"autoComplete && !mobile ? id + '-result' : null\"\n                    [attr.aria-haspopup]=\"autoComplete && !mobile\"\n                    fd-form-control\n                    fd-input-group-input\n                    tabindex=\"0\"\n                    [id]=\"id\"\n                    [name]=\"name\"\n                    (keydown)=\"onInputKeydownHandler($event)\"\n                    [disabled]=\"disabled\"\n                    [(ngModel)]=\"inputText\"\n                    (ngModelChange)=\"searchTermChanged()\"\n                    [placeholder]=\"placeholder\"\n                    (focus)=\"onTouched(); tokenizer._showAllTokens()\"\n                    (blur)=\"!mobile && onBlur($event); tokenizer._hideTokens()\"\n                    [attr.aria-expanded]=\"isOpen\"\n                    [readonly]=\"readonly\"\n                    [attr.aria-readonly]=\"readonly\"\n                    [attr.aria-required]=\"required\"\n                    class=\"fd-tokenizer__input\"\n                />\n            </fd-tokenizer>\n        </fd-input-group>\n\n        <fd-form-message\n            *ngIf=\"mobile && isOpen ? false : !!stateMessage\"\n            [type]=\"state\"\n            [innerHtml]=\"stateMessage\"\n        ></fd-form-message>\n    </fd-form-input-message-group>\n</ng-template>\n\n<ng-template #mobileControlTemplate>\n    <fd-input-group\n        [id]=\"id + '-input-group-container'\"\n        class=\"fdp-multi-combobox-input-group-custom\"\n        [state]=\"state\"\n        [buttonFocusable]=\"false\"\n        [isControl]=\"true\"\n        [disabled]=\"disabled || readonly\"\n        [isExpanded]=\"!mobile && isOpen && _suggestions.length > 0\"\n        [attr.aria-disabled]=\"disabled || readonly\"\n        [attr.aria-readonly]=\"readonly\"\n        [glyphAriaLabel]=\"ariaLabel\"\n    >\n        <input\n            fdp-auto-complete\n            (onComplete)=\"onCompleteTerm($event)\"\n            [options]=\"_suggestions\"\n            [inputText]=\"inputText\"\n            [mobile]=\"mobile\"\n            type=\"text\"\n            role=\"combobox\"\n            autocomplete=\"off\"\n            [attr.aria-label]=\"ariaLabel\"\n            [attr.aria-labelledby]=\"ariaLabelledBy\"\n            [attr.aria-autocomplete]=\"autoComplete && !mobile ? 'list' : null\"\n            [attr.aria-owns]=\"autoComplete && !mobile ? id + '-result' : null\"\n            [attr.aria-haspopup]=\"autoComplete && !mobile\"\n            fd-form-control\n            fd-input-group-input\n            tabindex=\"0\"\n            [id]=\"id\"\n            [name]=\"name\"\n            (keydown)=\"onInputKeydownHandler($event)\"\n            [disabled]=\"disabled\"\n            [(ngModel)]=\"inputText\"\n            (ngModelChange)=\"searchTermChanged()\"\n            [placeholder]=\"placeholder\"\n            (focus)=\"onTouched()\"\n            (blur)=\"!mobile && onBlur($event)\"\n            [attr.aria-expanded]=\"isOpen\"\n            [readonly]=\"readonly\"\n            [attr.aria-readonly]=\"readonly\"\n        />\n    </fd-input-group>\n</ng-template>\n\n<ng-template #listTemplate>\n    <ul\n        fd-list\n        [hasMessage]=\"!!stateMessage\"\n        (focusEscapeList)=\"handleListFocusEscape($event)\"\n        [dropdownMode]=\"true\"\n        class=\"fdp-multi-combobox__list fd-list--multi-input\"\n        [id]=\"id + '-result'\"\n        role=\"listbox\"\n        [style.maxHeight]=\"!mobile && maxHeight\"\n        [style.minWidth]=\"!mobile && minWidth + 'px'\"\n        [style.maxWidth]=\"autoResize && maxWidth + 'px'\"\n        [attr.aria-labelledby]=\"id + '-search'\"\n        aria-multiselectable=\"true\"\n    >\n        <li\n            *ngIf=\"stateMessage\"\n            [attr.aria-label]=\"stateMessage\"\n            fd-list-message\n            tabindex=\"-1\"\n            role=\"presentation\"\n            [type]=\"state || 'default'\"\n            [innerHtml]=\"stateMessage\"\n        ></li>\n\n        <ng-content></ng-content>\n        <ng-container *ngIf=\"isGroup\">\n            <ng-container *ngFor=\"let group of _suggestions\">\n                <ng-container *ngIf=\"!groupItemTemplate\">\n                    <label fd-list-item fd-list-group-header role=\"group\">\n                        <span fd-list-title>{{ group.label }}</span>\n                    </label>\n                </ng-container>\n\n                <ng-container *ngIf=\"groupItemTemplate\">\n                    <ng-container\n                        [ngTemplateOutlet]=\"groupItemTemplate\"\n                        [ngTemplateOutletContext]=\"{ $implicit: { label: group.label } }\"\n                    ></ng-container>\n                </ng-container>\n\n                <li\n                    *ngFor=\"let optionItem of group.children; let i = index\"\n                    fd-list-item\n                    role=\"option\"\n                    [tabindex]=\"0\"\n                    (click)=\"!mobile && close()\"\n                    (keyDown)=\"onItemKeyDownHandler($event, i)\"\n                    [selected]=\"!!optionItem.selected\"\n                >\n                    <fd-checkbox\n                        (click)=\"onOptionCheckboxClicked($event, i)\"\n                        (ngModelChange)=\"toggleSelection(optionItem)\"\n                        [ngModel]=\"optionItem.selected\"\n                    >\n                    </fd-checkbox>\n                    <ng-container\n                        [ngTemplateOutlet]=\"listItem\"\n                        [ngTemplateOutletContext]=\"{ optionItem: optionItem, index: i }\"\n                    ></ng-container>\n                </li>\n            </ng-container>\n        </ng-container>\n\n        <ng-container *ngIf=\"!isGroup\">\n            <li\n                *ngFor=\"let optionItem of _suggestions; let i = index\"\n                fd-list-item\n                role=\"option\"\n                [tabindex]=\"0\"\n                (click)=\"!mobile && onOptionClicked($event, i)\"\n                (keyDown)=\"onItemKeyDownHandler($event, i)\"\n                [selected]=\"!!optionItem.selected\"\n            >\n                <fd-checkbox\n                    (click)=\"onOptionCheckboxClicked($event, i)\"\n                    (ngModelChange)=\"toggleSelection(optionItem)\"\n                    [ngModel]=\"optionItem.selected\"\n                >\n                </fd-checkbox>\n                <ng-container\n                    [ngTemplateOutlet]=\"listItem\"\n                    [ngTemplateOutletContext]=\"{ optionItem: optionItem, index: i }\"\n                ></ng-container>\n            </li>\n        </ng-container>\n    </ul>\n</ng-template>\n\n<ng-template let-optionItem=\"optionItem\" let-index=\"index\" #listItem>\n    <ng-container\n        *ngIf=\"optionItem.selected && !!selectedItemTemplate\"\n        [ngTemplateOutlet]=\"selectedItemTemplate\"\n        [ngTemplateOutletContext]=\"{ $implicit: optionItem.value, index: index }\"\n    ></ng-container>\n\n    <ng-container *ngIf=\"!(optionItem.selected && selectedItemTemplate)\">\n        <ng-container\n            [ngTemplateOutlet]=\"optionItemSource\"\n            [ngTemplateOutletContext]=\"{ optionItem: optionItem, index: index }\"\n        ></ng-container>\n\n        <ng-container\n            [ngTemplateOutlet]=\"secondaryTextSource\"\n            [ngTemplateOutletContext]=\"{ optionItem: optionItem }\"\n        ></ng-container>\n    </ng-container>\n</ng-template>\n\n<ng-template let-optionItem=\"optionItem\" let-index=\"index\" #optionItemSource>\n    <ng-container *ngIf=\"!optionItemTemplate\">\n        <span\n            fd-list-title\n            [attr.title]=\"optionItem.label\"\n            [innerHTML]=\"optionItem.label | highlight : inputText\"\n        ></span>\n    </ng-container>\n\n    <ng-container *ngIf=\"optionItemTemplate\">\n        <ng-container\n            [ngTemplateOutlet]=\"optionItemTemplate\"\n            [ngTemplateOutletContext]=\"{ $implicit: optionItem.value, index: index }\"\n        ></ng-container>\n    </ng-container>\n</ng-template>\n\n<ng-template let-optionItem=\"optionItem\" #secondaryTextSource>\n    <ng-container *ngIf=\"showSecondaryText\">\n        <ng-container *ngIf=\"!secondaryItemTemplate\">\n            <span\n                [style.text-align]=\"secondaryTextAlignment\"\n                fd-list-secondary\n                [attr.title]=\"optionItem.secondaryText\"\n                [innerHTML]=\"optionItem.secondaryText | highlight : inputText\"\n            ></span>\n        </ng-container>\n\n        <ng-container *ngIf=\"secondaryItemTemplate\">\n            <ng-container\n                [ngTemplateOutlet]=\"secondaryItemTemplate\"\n                [ngTemplateOutletContext]=\"{ $implicit: optionItem.value }\"\n            ></ng-container>\n        </ng-container>\n    </ng-container>\n</ng-template>\n", styles: ["/*!\n * Fundamental Library Styles v0.30.2-rc.6\n * Copyright (c) 2023 SAP SE or an SAP affiliate company.\n * Licensed under Apache License 2.0 (https://github.com/SAP/fundamental-styles/blob/main/LICENSE)\n */.fd-margin--tiny{margin:.5rem!important}.fd-margin--sm{margin:1rem!important}.fd-margin--md{margin:2rem!important}.fd-margin--lg{margin:3rem!important}.fd-margin--none{margin:0!important}.fd-margin-top--tiny{margin-top:.5rem!important}.fd-margin-top--sm{margin-top:1rem!important}.fd-margin-top--md{margin-top:2rem!important}.fd-margin-top--lg{margin-top:3rem!important}.fd-margin-top--none{margin-top:0!important}.fd-margin-end--tiny{margin-right:.5rem!important}.fd-margin-end--tiny[dir=rtl],[dir=rtl] .fd-margin-end--tiny{margin-left:.5rem!important;margin-right:0!important}.fd-margin-end--sm{margin-right:1rem!important}.fd-margin-end--sm[dir=rtl],[dir=rtl] .fd-margin-end--sm{margin-left:1rem!important;margin-right:0!important}.fd-margin-end--md{margin-right:2rem!important}.fd-margin-end--md[dir=rtl],[dir=rtl] .fd-margin-end--md{margin-left:2rem!important;margin-right:0!important}.fd-margin-end--lg{margin-right:3rem!important}.fd-margin-end--lg[dir=rtl],[dir=rtl] .fd-margin-end--lg{margin-left:3rem!important;margin-right:0!important}.fd-margin-end--none{margin-right:0}.fd-margin-end--none[dir=rtl],[dir=rtl] .fd-margin-end--none{margin-left:0!important}.fd-margin-bottom--tiny{margin-bottom:.5rem!important}.fd-margin-bottom--sm{margin-bottom:1rem!important}.fd-margin-bottom--md{margin-bottom:2rem!important}.fd-margin-bottom--lg{margin-bottom:3rem!important}.fd-margin-bottom--none{margin-bottom:0!important}.fd-margin-begin--tiny{margin-left:.5rem!important}.fd-margin-begin--tiny[dir=rtl],[dir=rtl] .fd-margin-begin--tiny{margin-left:0!important;margin-right:.5rem!important}.fd-margin-begin--sm{margin-left:1rem!important}.fd-margin-begin--sm[dir=rtl],[dir=rtl] .fd-margin-begin--sm{margin-left:0!important;margin-right:1rem!important}.fd-margin-begin--md{margin-left:2rem!important}.fd-margin-begin--md[dir=rtl],[dir=rtl] .fd-margin-begin--md{margin-left:0!important;margin-right:2rem!important}.fd-margin-begin--lg{margin-left:3rem!important}.fd-margin-begin--lg[dir=rtl],[dir=rtl] .fd-margin-begin--lg{margin-left:0!important;margin-right:3rem!important}.fd-margin-begin--none{margin-left:0}.fd-margin-begin--none[dir=rtl],[dir=rtl] .fd-margin-begin--none{margin-right:0!important}.fd-margin-top-bottom--tiny{margin-bottom:.5rem!important;margin-top:.5rem!important}.fd-margin-top-bottom--sm{margin-bottom:1rem!important;margin-top:1rem!important}.fd-margin-top-bottom--md{margin-bottom:2rem!important;margin-top:2rem!important}.fd-margin-top-bottom--lg{margin-bottom:3rem!important;margin-top:3rem!important}.fd-margin-begin-end--tiny{margin-left:.5rem!important;margin-right:.5rem!important}.fd-margin-begin-end--sm{margin-left:1rem!important;margin-right:1rem!important}.fd-margin-begin-end--md{margin-left:2rem!important;margin-right:2rem!important}.fd-margin-begin-end--lg{margin-left:3rem!important;margin-right:3rem!important}.fd-margin-responsive--sm{margin:0 0 1rem!important}.fd-margin-responsive--md{margin:1rem!important}.fd-margin-responsive--lg{margin:1rem 2rem!important}.fd-margin-responsive--xl{margin:1rem 3rem!important}.fd-margin-negative-begin-end--tiny{margin:0 -.5rem!important}.fd-margin-negative-begin-end--sm{margin:0 -1rem!important}.fd-margin-negative-begin-end--md{margin:0 -2rem!important}.fd-margin-negative-begin-end--lg{margin:0 -3rem!important}.fdp-multi-combobox-tokenizer-custom{width:calc(100% - 2.25rem)}.fdp-multi-combobox-tokenizer-custom--compact{width:calc(100% - 2rem)}.fdp-multi-combobox__list-container .fd-list .fd-list__item.fd-list__group-header{padding:0 1rem}.fdp-multi-combobox__list-container .fd-list .fd-list__item .fd-list__title{max-width:inherit}.fdp-multi-combobox__list-container .fd-list.fd-list--compact .fd-list__item.fd-list__group-header{padding:0 .5rem}\n"] }]
+                    ], standalone: true, imports: [
+                        NgIf,
+                        NgTemplateOutlet,
+                        PopoverComponent,
+                        PopoverControlComponent,
+                        PopoverBodyComponent,
+                        FormInputMessageGroupModule,
+                        InputGroupModule,
+                        TokenModule,
+                        NgFor,
+                        FormControlModule,
+                        FormsModule,
+                        AutoCompleteDirective,
+                        FormMessageModule,
+                        ListModule,
+                        CheckboxComponent$1,
+                        NgClass,
+                        ListSecondaryDirective,
+                        SearchHighlightPipe,
+                        FdTranslatePipe,
+                        ContentDensityModule
+                    ], template: "<div class=\"fdp-multi-combobox\">\n    <ng-container [ngTemplateOutlet]=\"controlTemplate\" *ngIf=\"mobile\"></ng-container>\n\n    <fd-popover\n        *ngIf=\"!mobile\"\n        additionalBodyClass=\"fd-popover-custom-list fdp-multi-combobox__list-container\"\n        (isOpenChange)=\"popoverOpenChangeHandle($event)\"\n        [isOpen]=\"isOpen\"\n        [triggers]=\"[]\"\n        [disabled]=\"disabled\"\n        [fillControlMode]=\"fillControlMode\"\n    >\n        <fd-popover-control>\n            <ng-container>\n                <ng-container *ngTemplateOutlet=\"controlTemplate\"></ng-container>\n            </ng-container>\n        </fd-popover-control>\n        <fd-popover-body [style.width.%]=\"!autoResize && 100\">\n            <ng-container *ngTemplateOutlet=\"listTemplate\"></ng-container>\n            <ng-content></ng-content>\n        </fd-popover-body>\n    </fd-popover>\n</div>\n\n<ng-template #controlTemplate>\n    <fd-form-input-message-group>\n        <fd-input-group\n            [id]=\"id + '-input-group-container'\"\n            class=\"fdp-multi-combobox-input-group-custom\"\n            [state]=\"state\"\n            [buttonFocusable]=\"buttonFocusable\"\n            [button]=\"!readonly\"\n            [glyph]=\"!readonly ? 'navigation-down-arrow' : ' '\"\n            [isControl]=\"true\"\n            [disabled]=\"disabled || readonly\"\n            [isExpanded]=\"!mobile && isOpen && _suggestions.length > 0\"\n            [attr.aria-disabled]=\"disabled || readonly\"\n            [attr.aria-readonly]=\"readonly\"\n            [glyphAriaLabel]=\"ariaLabel || ('platformMultiCombobox.inputGlyphAriaLabel' | fdTranslate)\"\n            [iconTitle]=\"addonIconTitle || ('platformMultiCombobox.inputGlyphAriaLabel' | fdTranslate)\"\n            (addOnButtonClicked)=\"_addOnClicked($event)\"\n            (click)=\"mobile && !isOpen && onPrimaryButtonClick(false)\"\n            (keydown)=\"navigateByTokens($event)\"\n        >\n            <fd-tokenizer\n                #tokenizer\n                [compactCollapse]=\"true\"\n                *ngIf=\"_selectedSuggestions\"\n                [tokenizerFocusable]=\"false\"\n                class=\"fdp-multi-combobox-tokenizer-custom\"\n                (moreClickedEvent)=\"moreClicked()\"\n            >\n                <fd-token\n                    [readOnly]=\"disabled\"\n                    (onCloseClick)=\"removeToken(token, $event)\"\n                    *ngFor=\"let token of _selectedSuggestions\"\n                >\n                    {{ token.label }}\n                </fd-token>\n\n                <input\n                    #searchInputElement\n                    fdp-auto-complete\n                    (onComplete)=\"onCompleteTerm($event)\"\n                    [options]=\"_suggestions\"\n                    [inputText]=\"inputText\"\n                    [mobile]=\"mobile\"\n                    type=\"text\"\n                    role=\"combobox\"\n                    autocomplete=\"off\"\n                    [attr.aria-label]=\"ariaLabel\"\n                    [attr.aria-labelledby]=\"ariaLabelledBy\"\n                    [attr.aria-autocomplete]=\"autoComplete && !mobile ? 'list' : null\"\n                    [attr.aria-owns]=\"autoComplete && !mobile ? id + '-result' : null\"\n                    [attr.aria-haspopup]=\"autoComplete && !mobile\"\n                    fd-form-control\n                    fd-input-group-input\n                    tabindex=\"0\"\n                    [id]=\"id\"\n                    [name]=\"name\"\n                    (keydown)=\"onInputKeydownHandler($event)\"\n                    [disabled]=\"disabled\"\n                    [(ngModel)]=\"inputText\"\n                    (ngModelChange)=\"searchTermChanged()\"\n                    [placeholder]=\"placeholder\"\n                    (focus)=\"onTouched(); tokenizer._showAllTokens()\"\n                    (blur)=\"!mobile && onBlur($event); tokenizer._hideTokens()\"\n                    [attr.aria-expanded]=\"isOpen\"\n                    [readonly]=\"readonly\"\n                    [attr.aria-readonly]=\"readonly\"\n                    [attr.aria-required]=\"required\"\n                    class=\"fd-tokenizer__input\"\n                />\n            </fd-tokenizer>\n        </fd-input-group>\n\n        <fd-form-message\n            *ngIf=\"mobile && isOpen ? false : !!stateMessage\"\n            [type]=\"state\"\n            [innerHtml]=\"stateMessage\"\n        ></fd-form-message>\n    </fd-form-input-message-group>\n</ng-template>\n\n<ng-template #mobileControlTemplate>\n    <fd-input-group\n        [id]=\"id + '-input-group-container'\"\n        class=\"fdp-multi-combobox-input-group-custom\"\n        [state]=\"state\"\n        [buttonFocusable]=\"false\"\n        [isControl]=\"true\"\n        [disabled]=\"disabled || readonly\"\n        [isExpanded]=\"!mobile && isOpen && _suggestions.length > 0\"\n        [attr.aria-disabled]=\"disabled || readonly\"\n        [attr.aria-readonly]=\"readonly\"\n        [glyphAriaLabel]=\"ariaLabel\"\n    >\n        <input\n            fdp-auto-complete\n            (onComplete)=\"onCompleteTerm($event)\"\n            [options]=\"_suggestions\"\n            [inputText]=\"inputText\"\n            [mobile]=\"mobile\"\n            type=\"text\"\n            role=\"combobox\"\n            autocomplete=\"off\"\n            [attr.aria-label]=\"ariaLabel\"\n            [attr.aria-labelledby]=\"ariaLabelledBy\"\n            [attr.aria-autocomplete]=\"autoComplete && !mobile ? 'list' : null\"\n            [attr.aria-owns]=\"autoComplete && !mobile ? id + '-result' : null\"\n            [attr.aria-haspopup]=\"autoComplete && !mobile\"\n            fd-form-control\n            fd-input-group-input\n            tabindex=\"0\"\n            [id]=\"id\"\n            [name]=\"name\"\n            (keydown)=\"onInputKeydownHandler($event)\"\n            [disabled]=\"disabled\"\n            [(ngModel)]=\"inputText\"\n            (ngModelChange)=\"searchTermChanged()\"\n            [placeholder]=\"placeholder\"\n            (focus)=\"onTouched()\"\n            (blur)=\"!mobile && onBlur($event)\"\n            [attr.aria-expanded]=\"isOpen\"\n            [readonly]=\"readonly\"\n            [attr.aria-readonly]=\"readonly\"\n        />\n    </fd-input-group>\n</ng-template>\n\n<ng-template #listTemplate>\n    <ul\n        fd-list\n        [hasMessage]=\"!!stateMessage\"\n        (focusEscapeList)=\"handleListFocusEscape($event)\"\n        [dropdownMode]=\"true\"\n        class=\"fdp-multi-combobox__list fd-list--multi-input\"\n        [hasMessage]=\"!!stateMessage || (!!advancedStateMessage?.hasErrors && !!advancedStateMessage?.template)\"\n        [id]=\"id + '-result'\"\n        role=\"listbox\"\n        [style.maxHeight]=\"!mobile && maxHeight\"\n        [style.minWidth]=\"!mobile && minWidth + 'px'\"\n        [style.maxWidth]=\"autoResize && maxWidth + 'px'\"\n        [attr.aria-labelledby]=\"id + '-search'\"\n        aria-multiselectable=\"true\"\n    >\n        <li\n            *ngIf=\"stateMessage\"\n            [attr.aria-label]=\"stateMessage\"\n            fd-list-message\n            tabindex=\"-1\"\n            role=\"presentation\"\n            [type]=\"state || 'default'\"\n            [innerHtml]=\"stateMessage\"\n        ></li>\n\n        <li\n            *ngIf=\"advancedStateMessage?.hasErrors && advancedStateMessage?.template\"\n            fd-list-message\n            tabindex=\"-1\"\n            role=\"presentation\"\n            [type]=\"state || 'default'\"\n        >\n            <ng-template [ngTemplateOutlet]=\"advancedStateMessage!.template!\"></ng-template>\n        </li>\n\n        <ng-content></ng-content>\n        <ng-container *ngIf=\"isGroup\">\n            <ng-container *ngFor=\"let group of _suggestions\">\n                <ng-container *ngIf=\"!groupItemTemplate\">\n                    <label fd-list-item fd-list-group-header role=\"group\">\n                        <span fd-list-title>{{ group.label }}</span>\n                    </label>\n                </ng-container>\n\n                <ng-container *ngIf=\"groupItemTemplate\">\n                    <ng-container\n                        [ngTemplateOutlet]=\"groupItemTemplate\"\n                        [ngTemplateOutletContext]=\"{ $implicit: { label: group.label } }\"\n                    ></ng-container>\n                </ng-container>\n\n                <li\n                    *ngFor=\"let optionItem of group.children; let i = index\"\n                    fd-list-item\n                    role=\"option\"\n                    [tabindex]=\"0\"\n                    (click)=\"!mobile && close()\"\n                    (keyDown)=\"onItemKeyDownHandler($event, i)\"\n                    [selected]=\"!!optionItem.selected\"\n                >\n                    <fd-checkbox\n                        (click)=\"onOptionCheckboxClicked($event, i)\"\n                        (ngModelChange)=\"toggleSelection(optionItem)\"\n                        [ngModel]=\"optionItem.selected\"\n                    >\n                    </fd-checkbox>\n                    <ng-container\n                        [ngTemplateOutlet]=\"listItem\"\n                        [ngTemplateOutletContext]=\"{ optionItem: optionItem, index: i }\"\n                    ></ng-container>\n                </li>\n            </ng-container>\n        </ng-container>\n\n        <ng-container *ngIf=\"!isGroup\">\n            <li\n                *ngFor=\"let optionItem of _suggestions; let i = index\"\n                fd-list-item\n                role=\"option\"\n                [tabindex]=\"0\"\n                (click)=\"!mobile && onOptionClicked($event, i)\"\n                (keyDown)=\"onItemKeyDownHandler($event, i)\"\n                [selected]=\"!!optionItem.selected\"\n            >\n                <fd-checkbox\n                    (click)=\"onOptionCheckboxClicked($event, i)\"\n                    (ngModelChange)=\"toggleSelection(optionItem)\"\n                    [ngModel]=\"optionItem.selected\"\n                >\n                </fd-checkbox>\n                <ng-container\n                    [ngTemplateOutlet]=\"listItem\"\n                    [ngTemplateOutletContext]=\"{ optionItem: optionItem, index: i }\"\n                ></ng-container>\n            </li>\n        </ng-container>\n    </ul>\n</ng-template>\n\n<ng-template let-optionItem=\"optionItem\" let-index=\"index\" #listItem>\n    <ng-container\n        *ngIf=\"optionItem.selected && !!selectedItemTemplate\"\n        [ngTemplateOutlet]=\"selectedItemTemplate\"\n        [ngTemplateOutletContext]=\"{ $implicit: optionItem.value, index: index }\"\n    ></ng-container>\n\n    <ng-container *ngIf=\"!(optionItem.selected && selectedItemTemplate)\">\n        <ng-container\n            [ngTemplateOutlet]=\"optionItemSource\"\n            [ngTemplateOutletContext]=\"{ optionItem: optionItem, index: index }\"\n        ></ng-container>\n\n        <ng-container\n            [ngTemplateOutlet]=\"secondaryTextSource\"\n            [ngTemplateOutletContext]=\"{ optionItem: optionItem }\"\n        ></ng-container>\n    </ng-container>\n</ng-template>\n\n<ng-template let-optionItem=\"optionItem\" let-index=\"index\" #optionItemSource>\n    <ng-container *ngIf=\"!optionItemTemplate\">\n        <span\n            fd-list-title\n            [attr.title]=\"optionItem.label\"\n            [innerHTML]=\"optionItem.label | highlight : inputText\"\n        ></span>\n    </ng-container>\n\n    <ng-container *ngIf=\"optionItemTemplate\">\n        <ng-container\n            [ngTemplateOutlet]=\"optionItemTemplate\"\n            [ngTemplateOutletContext]=\"{ $implicit: optionItem.value, index: index }\"\n        ></ng-container>\n    </ng-container>\n</ng-template>\n\n<ng-template let-optionItem=\"optionItem\" #secondaryTextSource>\n    <ng-container *ngIf=\"showSecondaryText\">\n        <ng-container *ngIf=\"!secondaryItemTemplate\">\n            <span\n                [style.text-align]=\"secondaryTextAlignment\"\n                fd-list-secondary\n                [attr.title]=\"optionItem.secondaryText\"\n                [innerHTML]=\"optionItem.secondaryText | highlight : inputText\"\n            ></span>\n        </ng-container>\n\n        <ng-container *ngIf=\"secondaryItemTemplate\">\n            <ng-container\n                [ngTemplateOutlet]=\"secondaryItemTemplate\"\n                [ngTemplateOutletContext]=\"{ $implicit: optionItem.value }\"\n            ></ng-container>\n        </ng-container>\n    </ng-container>\n</ng-template>\n", styles: ["/*!\n * Fundamental Library Styles v0.30.2-rc.6\n * Copyright (c) 2023 SAP SE or an SAP affiliate company.\n * Licensed under Apache License 2.0 (https://github.com/SAP/fundamental-styles/blob/main/LICENSE)\n */.fd-margin--tiny{margin:.5rem!important}.fd-margin--sm{margin:1rem!important}.fd-margin--md{margin:2rem!important}.fd-margin--lg{margin:3rem!important}.fd-margin--none{margin:0!important}.fd-margin-top--tiny{margin-top:.5rem!important}.fd-margin-top--sm{margin-top:1rem!important}.fd-margin-top--md{margin-top:2rem!important}.fd-margin-top--lg{margin-top:3rem!important}.fd-margin-top--none{margin-top:0!important}.fd-margin-end--tiny{margin-right:.5rem!important}.fd-margin-end--tiny[dir=rtl],[dir=rtl] .fd-margin-end--tiny{margin-left:.5rem!important;margin-right:0!important}.fd-margin-end--sm{margin-right:1rem!important}.fd-margin-end--sm[dir=rtl],[dir=rtl] .fd-margin-end--sm{margin-left:1rem!important;margin-right:0!important}.fd-margin-end--md{margin-right:2rem!important}.fd-margin-end--md[dir=rtl],[dir=rtl] .fd-margin-end--md{margin-left:2rem!important;margin-right:0!important}.fd-margin-end--lg{margin-right:3rem!important}.fd-margin-end--lg[dir=rtl],[dir=rtl] .fd-margin-end--lg{margin-left:3rem!important;margin-right:0!important}.fd-margin-end--none{margin-right:0}.fd-margin-end--none[dir=rtl],[dir=rtl] .fd-margin-end--none{margin-left:0!important}.fd-margin-bottom--tiny{margin-bottom:.5rem!important}.fd-margin-bottom--sm{margin-bottom:1rem!important}.fd-margin-bottom--md{margin-bottom:2rem!important}.fd-margin-bottom--lg{margin-bottom:3rem!important}.fd-margin-bottom--none{margin-bottom:0!important}.fd-margin-begin--tiny{margin-left:.5rem!important}.fd-margin-begin--tiny[dir=rtl],[dir=rtl] .fd-margin-begin--tiny{margin-left:0!important;margin-right:.5rem!important}.fd-margin-begin--sm{margin-left:1rem!important}.fd-margin-begin--sm[dir=rtl],[dir=rtl] .fd-margin-begin--sm{margin-left:0!important;margin-right:1rem!important}.fd-margin-begin--md{margin-left:2rem!important}.fd-margin-begin--md[dir=rtl],[dir=rtl] .fd-margin-begin--md{margin-left:0!important;margin-right:2rem!important}.fd-margin-begin--lg{margin-left:3rem!important}.fd-margin-begin--lg[dir=rtl],[dir=rtl] .fd-margin-begin--lg{margin-left:0!important;margin-right:3rem!important}.fd-margin-begin--none{margin-left:0}.fd-margin-begin--none[dir=rtl],[dir=rtl] .fd-margin-begin--none{margin-right:0!important}.fd-margin-top-bottom--tiny{margin-bottom:.5rem!important;margin-top:.5rem!important}.fd-margin-top-bottom--sm{margin-bottom:1rem!important;margin-top:1rem!important}.fd-margin-top-bottom--md{margin-bottom:2rem!important;margin-top:2rem!important}.fd-margin-top-bottom--lg{margin-bottom:3rem!important;margin-top:3rem!important}.fd-margin-begin-end--tiny{margin-left:.5rem!important;margin-right:.5rem!important}.fd-margin-begin-end--sm{margin-left:1rem!important;margin-right:1rem!important}.fd-margin-begin-end--md{margin-left:2rem!important;margin-right:2rem!important}.fd-margin-begin-end--lg{margin-left:3rem!important;margin-right:3rem!important}.fd-margin-responsive--sm{margin:0 0 1rem!important}.fd-margin-responsive--md{margin:1rem!important}.fd-margin-responsive--lg{margin:1rem 2rem!important}.fd-margin-responsive--xl{margin:1rem 3rem!important}.fd-margin-negative-begin-end--tiny{margin:0 -.5rem!important}.fd-margin-negative-begin-end--sm{margin:0 -1rem!important}.fd-margin-negative-begin-end--md{margin:0 -2rem!important}.fd-margin-negative-begin-end--lg{margin:0 -3rem!important}.fdp-multi-combobox-tokenizer-custom{width:calc(100% - 2.25rem)}.fdp-multi-combobox-tokenizer-custom--compact{width:calc(100% - 2rem)}.fdp-multi-combobox__list-container .fd-list .fd-list__item.fd-list__group-header{padding:0 1rem}.fdp-multi-combobox__list-container .fd-list .fd-list__item .fd-list__title{max-width:inherit}.fdp-multi-combobox__list-container .fd-list.fd-list--compact .fd-list__item.fd-list__group-header{padding:0 .5rem}\n"] }]
         }], ctorParameters: function () { return [{ type: i0.ChangeDetectorRef }, { type: i0.ElementRef }, { type: i1$1.NgControl, decorators: [{
                     type: Optional
                 }, {
@@ -10109,7 +10066,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.1.0", ngImpor
                     type: SkipSelf
                 }] }, { type: i1$2.DialogConfig, decorators: [{
                     type: Optional
-                }] }, { type: i3$2.DynamicComponentService }, { type: Map, decorators: [{
+                }] }, { type: i3$1.DynamicComponentService }, { type: Map, decorators: [{
                     type: Optional
                 }, {
                     type: Inject,
@@ -10135,7 +10092,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.1.0", ngImpor
                 }] }, { type: undefined, decorators: [{
                     type: Inject,
                     args: [MAP_LIMIT]
-                }] }, { type: i5$2.ContentDensityObserver }]; }, propDecorators: { mobileControlTemplate: [{
+                }] }, { type: i5$1.ContentDensityObserver }]; }, propDecorators: { mobileControlTemplate: [{
                 type: ViewChild,
                 args: ['mobileControlTemplate']
             }], listTemplate: [{
@@ -10148,60 +10105,14 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.1.0", ngImpor
 
 class PlatformMultiComboboxModule {
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.1.0", ngImport: i0, type: PlatformMultiComboboxModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
-    static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "16.1.0", ngImport: i0, type: PlatformMultiComboboxModule, declarations: [MultiComboboxComponent], imports: [CommonModule,
-            FormsModule,
-            CheckboxModule,
-            InputGroupModule,
-            PipeModule,
-            TokenModule,
-            ListModule,
-            ButtonModule,
-            FormModule,
-            PopoverModule,
-            PlatformListModule,
-            StandardListItemModule,
-            PlatformAutoCompleteModule,
-            I18nModule,
-            ContentDensityModule], exports: [MultiComboboxComponent, TemplateModule, ContentDensityModule] }); }
-    static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "16.1.0", ngImport: i0, type: PlatformMultiComboboxModule, providers: [DynamicComponentService], imports: [CommonModule,
-            FormsModule,
-            CheckboxModule,
-            InputGroupModule,
-            PipeModule,
-            TokenModule,
-            ListModule,
-            ButtonModule,
-            FormModule,
-            PopoverModule,
-            PlatformListModule,
-            StandardListItemModule,
-            PlatformAutoCompleteModule,
-            I18nModule,
-            ContentDensityModule, TemplateModule, ContentDensityModule] }); }
+    static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "16.1.0", ngImport: i0, type: PlatformMultiComboboxModule, imports: [MultiComboboxComponent], exports: [MultiComboboxComponent] }); }
+    static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "16.1.0", ngImport: i0, type: PlatformMultiComboboxModule, imports: [MultiComboboxComponent] }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.1.0", ngImport: i0, type: PlatformMultiComboboxModule, decorators: [{
             type: NgModule,
             args: [{
-                    declarations: [MultiComboboxComponent],
-                    imports: [
-                        CommonModule,
-                        FormsModule,
-                        CheckboxModule,
-                        InputGroupModule,
-                        PipeModule,
-                        TokenModule,
-                        ListModule,
-                        ButtonModule,
-                        FormModule,
-                        PopoverModule,
-                        PlatformListModule,
-                        StandardListItemModule,
-                        PlatformAutoCompleteModule,
-                        I18nModule,
-                        ContentDensityModule
-                    ],
-                    providers: [DynamicComponentService],
-                    exports: [MultiComboboxComponent, TemplateModule, ContentDensityModule]
+                    imports: [MultiComboboxComponent],
+                    exports: [MultiComboboxComponent]
                 }]
         }] });
 
@@ -10277,12 +10188,12 @@ class PlatformFileUploaderComponent extends BaseInput {
         const event = new FileUploaderInvalidChangeEvent(this, this.files);
         this.invalidFileChange.emit(event);
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.1.0", ngImport: i0, type: PlatformFileUploaderComponent, deps: [{ token: i0.ChangeDetectorRef }, { token: i0.ElementRef }, { token: i1$1.NgControl, optional: true, self: true }, { token: i1$1.ControlContainer, optional: true, skipSelf: true }, { token: i1$1.NgForm, optional: true, skipSelf: true }, { token: FD_FORM_FIELD, host: true, optional: true, skipSelf: true }, { token: FD_FORM_FIELD_CONTROL, host: true, optional: true, skipSelf: true }, { token: i5$2.ContentDensityObserver }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.1.0", type: PlatformFileUploaderComponent, selector: "fdp-file-uploader", inputs: { buttonLabel: "buttonLabel", buttonAriaLabel: "buttonAriaLabel", dragndrop: "dragndrop", maxFileSize: "maxFileSize", minFileSize: "minFileSize", multiple: "multiple", accept: "accept", fileLimit: "fileLimit", value: "value" }, outputs: { selectionChange: "selectionChange", invalidFileChange: "invalidFileChange" }, providers: [contentDensityObserverProviders()], usesInheritance: true, ngImport: i0, template: "<fd-file-uploader\n    [id]=\"id\"\n    [ariaLabel]=\"ariaLabel\"\n    [ariaLabelledBy]=\"ariaLabelledBy\"\n    [placeholder]=\"placeholder\"\n    [buttonLabel]=\"buttonLabel\"\n    [buttonAriaLabel]=\"buttonAriaLabel\"\n    [disabled]=\"disabled\"\n    [accept]=\"accept\"\n    [multiple]=\"multiple\"\n    [maxFileSize]=\"maxFileSize\"\n    [minFileSize]=\"minFileSize\"\n    [state]=\"state\"\n    [required]=\"required\"\n    [width]=\"width\"\n    [(ngModel)]=\"value\"\n    (selectedInvalidFiles)=\"handleInvalidFiles($event)\"\n    (selectedFilesChanged)=\"handleFileChange($event)\"\n></fd-file-uploader>\n", dependencies: [{ kind: "component", type: i3$5.FileUploaderComponent, selector: "fd-file-uploader", inputs: ["disabled", "required", "multiple", "accept", "dragndrop", "maxFileSize", "minFileSize", "id", "ariaLabel", "ariaLabelledBy", "placeholder", "buttonLabel", "buttonAriaLabel", "state", "fileLimit", "inputHidden", "width"], outputs: ["selectedFilesChanged", "selectedInvalidFiles", "onDragEnter", "onDragLeave"] }, { kind: "directive", type: i1$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$1.RequiredValidator, selector: ":not([type=checkbox])[required][formControlName],:not([type=checkbox])[required][formControl],:not([type=checkbox])[required][ngModel]", inputs: ["required"] }, { kind: "directive", type: i1$1.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.1.0", ngImport: i0, type: PlatformFileUploaderComponent, deps: [{ token: i0.ChangeDetectorRef }, { token: i0.ElementRef }, { token: i1$1.NgControl, optional: true, self: true }, { token: i1$1.ControlContainer, optional: true, skipSelf: true }, { token: i1$1.NgForm, optional: true, skipSelf: true }, { token: FD_FORM_FIELD, host: true, optional: true, skipSelf: true }, { token: FD_FORM_FIELD_CONTROL, host: true, optional: true, skipSelf: true }, { token: i5$1.ContentDensityObserver }], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.1.0", type: PlatformFileUploaderComponent, isStandalone: true, selector: "fdp-file-uploader", inputs: { buttonLabel: "buttonLabel", buttonAriaLabel: "buttonAriaLabel", dragndrop: "dragndrop", maxFileSize: "maxFileSize", minFileSize: "minFileSize", multiple: "multiple", accept: "accept", fileLimit: "fileLimit", value: "value" }, outputs: { selectionChange: "selectionChange", invalidFileChange: "invalidFileChange" }, providers: [contentDensityObserverProviders()], usesInheritance: true, ngImport: i0, template: "<fd-file-uploader\n    [id]=\"id\"\n    [ariaLabel]=\"ariaLabel\"\n    [ariaLabelledBy]=\"ariaLabelledBy\"\n    [placeholder]=\"placeholder\"\n    [buttonLabel]=\"buttonLabel\"\n    [buttonAriaLabel]=\"buttonAriaLabel\"\n    [disabled]=\"disabled\"\n    [accept]=\"accept\"\n    [multiple]=\"multiple\"\n    [maxFileSize]=\"maxFileSize\"\n    [minFileSize]=\"minFileSize\"\n    [state]=\"state\"\n    [required]=\"required\"\n    [width]=\"width\"\n    [(ngModel)]=\"value\"\n    (selectedInvalidFiles)=\"handleInvalidFiles($event)\"\n    (selectedFilesChanged)=\"handleFileChange($event)\"\n></fd-file-uploader>\n", dependencies: [{ kind: "ngmodule", type: FileUploaderModule }, { kind: "component", type: i3$4.FileUploaderComponent, selector: "fd-file-uploader", inputs: ["disabled", "required", "multiple", "accept", "dragndrop", "maxFileSize", "minFileSize", "id", "ariaLabel", "ariaLabelledBy", "placeholder", "buttonLabel", "buttonAriaLabel", "state", "fileLimit", "inputHidden", "width"], outputs: ["selectedFilesChanged", "selectedInvalidFiles", "onDragEnter", "onDragLeave"] }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$1.RequiredValidator, selector: ":not([type=checkbox])[required][formControlName],:not([type=checkbox])[required][formControl],:not([type=checkbox])[required][ngModel]", inputs: ["required"] }, { kind: "directive", type: i1$1.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "ngmodule", type: ContentDensityModule }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.1.0", ngImport: i0, type: PlatformFileUploaderComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'fdp-file-uploader', changeDetection: ChangeDetectionStrategy.OnPush, providers: [contentDensityObserverProviders()], template: "<fd-file-uploader\n    [id]=\"id\"\n    [ariaLabel]=\"ariaLabel\"\n    [ariaLabelledBy]=\"ariaLabelledBy\"\n    [placeholder]=\"placeholder\"\n    [buttonLabel]=\"buttonLabel\"\n    [buttonAriaLabel]=\"buttonAriaLabel\"\n    [disabled]=\"disabled\"\n    [accept]=\"accept\"\n    [multiple]=\"multiple\"\n    [maxFileSize]=\"maxFileSize\"\n    [minFileSize]=\"minFileSize\"\n    [state]=\"state\"\n    [required]=\"required\"\n    [width]=\"width\"\n    [(ngModel)]=\"value\"\n    (selectedInvalidFiles)=\"handleInvalidFiles($event)\"\n    (selectedFilesChanged)=\"handleFileChange($event)\"\n></fd-file-uploader>\n" }]
+            args: [{ selector: 'fdp-file-uploader', changeDetection: ChangeDetectionStrategy.OnPush, providers: [contentDensityObserverProviders()], standalone: true, imports: [FileUploaderModule, FormsModule, ContentDensityModule], template: "<fd-file-uploader\n    [id]=\"id\"\n    [ariaLabel]=\"ariaLabel\"\n    [ariaLabelledBy]=\"ariaLabelledBy\"\n    [placeholder]=\"placeholder\"\n    [buttonLabel]=\"buttonLabel\"\n    [buttonAriaLabel]=\"buttonAriaLabel\"\n    [disabled]=\"disabled\"\n    [accept]=\"accept\"\n    [multiple]=\"multiple\"\n    [maxFileSize]=\"maxFileSize\"\n    [minFileSize]=\"minFileSize\"\n    [state]=\"state\"\n    [required]=\"required\"\n    [width]=\"width\"\n    [(ngModel)]=\"value\"\n    (selectedInvalidFiles)=\"handleInvalidFiles($event)\"\n    (selectedFilesChanged)=\"handleFileChange($event)\"\n></fd-file-uploader>\n" }]
         }], ctorParameters: function () { return [{ type: i0.ChangeDetectorRef }, { type: i0.ElementRef }, { type: i1$1.NgControl, decorators: [{
                     type: Optional
                 }, {
@@ -10313,7 +10224,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.1.0", ngImpor
                 }, {
                     type: Inject,
                     args: [FD_FORM_FIELD_CONTROL]
-                }] }, { type: i5$2.ContentDensityObserver }]; }, propDecorators: { buttonLabel: [{
+                }] }, { type: i5$1.ContentDensityObserver }]; }, propDecorators: { buttonLabel: [{
                 type: Input
             }], buttonAriaLabel: [{
                 type: Input
@@ -10339,15 +10250,14 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.1.0", ngImpor
 
 class PlatformFileUploaderModule {
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.1.0", ngImport: i0, type: PlatformFileUploaderModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
-    static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "16.1.0", ngImport: i0, type: PlatformFileUploaderModule, declarations: [PlatformFileUploaderComponent], imports: [CommonModule, FileUploaderModule, FormsModule, PipeModule, ContentDensityModule], exports: [PlatformFileUploaderComponent, ContentDensityModule] }); }
-    static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "16.1.0", ngImport: i0, type: PlatformFileUploaderModule, imports: [CommonModule, FileUploaderModule, FormsModule, PipeModule, ContentDensityModule, ContentDensityModule] }); }
+    static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "16.1.0", ngImport: i0, type: PlatformFileUploaderModule, imports: [PlatformFileUploaderComponent], exports: [PlatformFileUploaderComponent] }); }
+    static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "16.1.0", ngImport: i0, type: PlatformFileUploaderModule, imports: [PlatformFileUploaderComponent] }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.1.0", ngImport: i0, type: PlatformFileUploaderModule, decorators: [{
             type: NgModule,
             args: [{
-                    declarations: [PlatformFileUploaderComponent],
-                    imports: [CommonModule, FileUploaderModule, FormsModule, PipeModule, ContentDensityModule],
-                    exports: [PlatformFileUploaderComponent, ContentDensityModule]
+                    imports: [PlatformFileUploaderComponent],
+                    exports: [PlatformFileUploaderComponent]
                 }]
         }] });
 
@@ -10757,12 +10667,12 @@ class StepInputComponent extends BaseInput {
     _resetPendingEnteredValue() {
         this._pendingEnteredValue = null;
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.1.0", ngImport: i0, type: StepInputComponent, deps: [{ token: i0.ChangeDetectorRef }, { token: i0.ElementRef }, { token: i1$1.NgControl }, { token: i1$1.ControlContainer }, { token: i1$1.NgForm }, { token: i1.PlatformFormField }, { token: i1.PlatformFormFieldControl }, { token: StepInputConfig }, { token: i0.Renderer2 }, { token: i3$2.RtlService }], target: i0.ɵɵFactoryTarget.Directive }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.1.0", ngImport: i0, type: StepInputComponent, deps: [{ token: i0.ChangeDetectorRef }, { token: i0.ElementRef }, { token: i1$1.NgControl }, { token: i1$1.ControlContainer }, { token: i1$1.NgForm }, { token: i1.PlatformFormField }, { token: i1.PlatformFormFieldControl }, { token: StepInputConfig }, { token: i0.Renderer2 }, { token: i3$1.RtlService }], target: i0.ɵɵFactoryTarget.Directive }); }
     static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "16.1.0", type: StepInputComponent, inputs: { value: "value", min: "min", max: "max", step: "step", stepFn: "stepFn", precision: "precision", largerStep: "largerStep", showLabels: "showLabels", align: "align", incrementLabel: "incrementLabel", decrementLabel: "decrementLabel" }, outputs: { valueChange: "valueChange" }, usesInheritance: true, ngImport: i0 }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.1.0", ngImport: i0, type: StepInputComponent, decorators: [{
             type: Directive
-        }], ctorParameters: function () { return [{ type: i0.ChangeDetectorRef }, { type: i0.ElementRef }, { type: i1$1.NgControl }, { type: i1$1.ControlContainer }, { type: i1$1.NgForm }, { type: i1.PlatformFormField }, { type: i1.PlatformFormFieldControl }, { type: StepInputConfig }, { type: i0.Renderer2 }, { type: i3$2.RtlService }]; }, propDecorators: { value: [{
+        }], ctorParameters: function () { return [{ type: i0.ChangeDetectorRef }, { type: i0.ElementRef }, { type: i1$1.NgControl }, { type: i1$1.ControlContainer }, { type: i1$1.NgForm }, { type: i1.PlatformFormField }, { type: i1.PlatformFormFieldControl }, { type: StepInputConfig }, { type: i0.Renderer2 }, { type: i3$1.RtlService }]; }, propDecorators: { value: [{
                 type: Input
             }], min: [{
                 type: Input
@@ -10841,12 +10751,13 @@ class StepInputDecrementDirective extends StepInputActionButton {
         this.stepInput.decrease();
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.1.0", ngImport: i0, type: StepInputDecrementDirective, deps: [{ token: StepInputComponent, skipSelf: true }], target: i0.ɵɵFactoryTarget.Directive }); }
-    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "16.1.0", type: StepInputDecrementDirective, selector: "[fdpStepInputDecrement]", usesInheritance: true, ngImport: i0 }); }
+    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "16.1.0", type: StepInputDecrementDirective, isStandalone: true, selector: "[fdpStepInputDecrement]", usesInheritance: true, ngImport: i0 }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.1.0", ngImport: i0, type: StepInputDecrementDirective, decorators: [{
             type: Directive,
             args: [{
-                    selector: '[fdpStepInputDecrement]'
+                    selector: '[fdpStepInputDecrement]',
+                    standalone: true
                 }]
         }], ctorParameters: function () { return [{ type: StepInputComponent, decorators: [{
                     type: SkipSelf
@@ -10870,12 +10781,13 @@ class StepInputIncrementDirective extends StepInputActionButton {
         this.stepInput.increase();
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.1.0", ngImport: i0, type: StepInputIncrementDirective, deps: [{ token: StepInputComponent, skipSelf: true }], target: i0.ɵɵFactoryTarget.Directive }); }
-    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "16.1.0", type: StepInputIncrementDirective, selector: "[fdpStepInputIncrement]", usesInheritance: true, ngImport: i0 }); }
+    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "16.1.0", type: StepInputIncrementDirective, isStandalone: true, selector: "[fdpStepInputIncrement]", usesInheritance: true, ngImport: i0 }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.1.0", ngImport: i0, type: StepInputIncrementDirective, decorators: [{
             type: Directive,
             args: [{
-                    selector: '[fdpStepInputIncrement]'
+                    selector: '[fdpStepInputIncrement]',
+                    standalone: true
                 }]
         }], ctorParameters: function () { return [{ type: StepInputComponent, decorators: [{
                     type: SkipSelf
@@ -10974,12 +10886,13 @@ class StepInputControlDirective {
         e.preventDefault();
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.1.0", ngImport: i0, type: StepInputControlDirective, deps: [{ token: StepInputComponent, skipSelf: true }], target: i0.ɵɵFactoryTarget.Directive }); }
-    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "16.1.0", type: StepInputControlDirective, selector: "[fdpStepInputControl]", host: { listeners: { "input": "onInput($event)", "change": "onChange()", "focus": "onFocus()", "blur": "onBlur()", "keydown": "onKeyDown($event)", "wheel": "onMouseWheel($event)" } }, ngImport: i0 }); }
+    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "16.1.0", type: StepInputControlDirective, isStandalone: true, selector: "[fdpStepInputControl]", host: { listeners: { "input": "onInput($event)", "change": "onChange()", "focus": "onFocus()", "blur": "onBlur()", "keydown": "onKeyDown($event)", "wheel": "onMouseWheel($event)" } }, ngImport: i0 }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.1.0", ngImport: i0, type: StepInputControlDirective, decorators: [{
             type: Directive,
             args: [{
-                    selector: '[fdpStepInputControl]'
+                    selector: '[fdpStepInputControl]',
+                    standalone: true
                 }]
         }], ctorParameters: function () { return [{ type: StepInputComponent, decorators: [{
                     type: SkipSelf
@@ -11060,12 +10973,12 @@ class NumberStepInputComponent extends StepInputComponent {
         const parsedValue = Number.parseFloat(value);
         return isNaN(parsedValue) ? null : parsedValue;
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.1.0", ngImport: i0, type: NumberStepInputComponent, deps: [{ token: i0.ChangeDetectorRef }, { token: i0.ElementRef }, { token: i1$1.NgControl, optional: true, self: true }, { token: i1$1.ControlContainer, optional: true, skipSelf: true }, { token: i1$1.NgForm, optional: true, skipSelf: true }, { token: FD_FORM_FIELD, host: true, optional: true, skipSelf: true }, { token: FD_FORM_FIELD_CONTROL, host: true, optional: true, skipSelf: true }, { token: StepInputConfig }, { token: i0.Renderer2 }, { token: i3$2.RtlService, optional: true }, { token: LOCALE_ID }, { token: i5$2.ContentDensityObserver }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.1.0", type: NumberStepInputComponent, selector: "fdp-number-step-input", inputs: { description: "description" }, providers: [
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.1.0", ngImport: i0, type: NumberStepInputComponent, deps: [{ token: i0.ChangeDetectorRef }, { token: i0.ElementRef }, { token: i1$1.NgControl, optional: true, self: true }, { token: i1$1.ControlContainer, optional: true, skipSelf: true }, { token: i1$1.NgForm, optional: true, skipSelf: true }, { token: FD_FORM_FIELD, host: true, optional: true, skipSelf: true }, { token: FD_FORM_FIELD_CONTROL, host: true, optional: true, skipSelf: true }, { token: StepInputConfig }, { token: i0.Renderer2 }, { token: i3$1.RtlService, optional: true }, { token: LOCALE_ID }, { token: i5$1.ContentDensityObserver }], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.1.0", type: NumberStepInputComponent, isStandalone: true, selector: "fdp-number-step-input", inputs: { description: "description" }, providers: [
             { provide: FD_FORM_FIELD_CONTROL, useExisting: NumberStepInputComponent, multi: true },
             { provide: StepInputComponent, useExisting: NumberStepInputComponent },
             contentDensityObserverProviders()
-        ], usesInheritance: true, ngImport: i0, template: "<fd-form-input-message-group>\n    <div\n        class=\"fd-step-input\"\n        [class.is-focus]=\"focused\"\n        [class.is-readonly]=\"!editable\"\n        [class.is-disabled]=\"disabled\"\n        [class.fd-step-input--without-buttons]=\"showLabels\"\n        [class]=\"state ? 'is-' + state : ''\"\n    >\n        <button\n            class=\"fd-step-input__button\"\n            tabindex=\"-1\"\n            type=\"button\"\n            fd-button\n            fdType=\"transparent\"\n            [glyph]=\"showLabels ? null : 'less'\"\n            fdpStepInputDecrement\n            [attr.aria-disabled]=\"disabled || !canDecrement\"\n            [attr.title]=\"decrementLabel\"\n            [attr.aria-label]=\"decrementLabel\"\n            [attr.aria-controls]=\"id\"\n        >\n            {{ showLabels ? decrementLabel : '' }}\n        </button>\n        <input\n            #inputElementRef\n            class=\"fd-input fd-input--no-number-spinner fd-step-input__input\"\n            [id]=\"id\"\n            [name]=\"name\"\n            [disabled]=\"disabled\"\n            [readonly]=\"!editable\"\n            [attr.placeholder]=\"placeholder || ''\"\n            [attr.aria-label]=\"ariaLabel\"\n            [attr.aria-labelledby]=\"ariaLabelledBy\"\n            [attr.aria-describedby]=\"description ? id + '__description' : ''\"\n            [attr.aria-required]=\"required\"\n            [style.textAlign]=\"_align\"\n            fdpStepInputControl\n            type=\"text\"\n            inputmode=\"numeric\"\n            fdkOnlyDigits\n            [decimal]=\"true\"\n        />\n        <button\n            class=\"fd-step-input__button\"\n            tabindex=\"-1\"\n            type=\"button\"\n            fd-button\n            fdType=\"transparent\"\n            [glyph]=\"showLabels ? null : 'add'\"\n            fdpStepInputIncrement\n            [attr.aria-disabled]=\"disabled || !canIncrement\"\n            [attr.title]=\"incrementLabel\"\n            [attr.aria-label]=\"incrementLabel\"\n            [attr.aria-controls]=\"id\"\n        >\n            {{ showLabels ? incrementLabel : '' }}\n        </button>\n    </div>\n    <fd-form-message *ngIf=\"stateMessage\" [type]=\"state\" [innerHTML]=\"stateMessage\"></fd-form-message>\n</fd-form-input-message-group>\n<span *ngIf=\"description\" [id]=\"id + '__description'\" class=\"fd-form-label fd-form-label--unit-description\">\n    {{ description }}\n</span>\n", styles: [".fd-input{-webkit-box-sizing:border-box;-webkit-box-shadow:var(--sapField_Shadow);-webkit-appearance:none;appearance:none;background:var(--sapField_BackgroundStyle, var(--sapField_BackgroundStyle));background-color:var(--sapField_Background, var(--sapField_Background));border:0;border:var(--sapField_BorderWidth) var(--sapField_BorderStyle) var(--sapField_BorderColor);border-radius:var(--sapField_BorderCornerRadius);box-shadow:var(--sapField_Shadow);box-sizing:border-box;color:var(--sapTextColor);color:var(--sapField_TextColor);cursor:text;font-family:var(--sapFontFamily);font-size:var(--sapFontSize);font-weight:400;forced-color-adjust:none;height:var(--sapElement_Height);line-height:var(--sapContent_LineHeight);margin:0;margin:var(--fdInput_Field_Margin, .25rem 0);min-height:var(--sapElement_Height);min-width:var(2.75rem, 2.75rem);outline:none;overflow:hidden;padding:0;padding:var(--fdInput_Field_Padding, 0 .625rem);text-overflow:ellipsis;text-shadow:var(--fdInput_Text_Shadow);white-space:nowrap;width:100%;z-index:1}.fd-input:after,.fd-input:before{box-sizing:inherit;font-size:inherit}.fd-input::placeholder{color:var(--sapField_PlaceholderTextColor);font-style:var(--fdPlaceholder_Font_Style)}.fd-input[dir=rtl]::placeholder,[dir=rtl] .fd-input::placeholder{text-indent:.125rem}.fd-input::selection{background-color:var(--sapSelectedColor);color:var(--sapContent_ContrastTextColor)}.fd-input::-ms-clear{display:none}.fd-input.is-hover,.fd-input:hover{-webkit-box-shadow:var(--fdInput_Box_Shadow_Hover);background:var(--sapField_Hover_BackgroundStyle, var(--sapField_Hover_BackgroundStyle));background-color:var(--sapField_Hover_Background, var(--sapField_Hover_Background));border-color:var(--sapField_Hover_BorderColor);box-shadow:var(--fdInput_Box_Shadow_Hover)}.fd-input.is-focus,.fd-input:focus{-webkit-box-shadow:none;background:var(--sapField_Focus_Background, var(--sapField_Focus_Background));box-shadow:none;outline-color:var(--fdInput_Outline_Color);outline-offset:var(--fdInput_Outline_Offset);outline-style:var(--sapContent_FocusStyle);outline-width:var(--sapContent_FocusWidth);z-index:5}.fd-input[type=search]::-webkit-search-cancel-button,.fd-input[type=search]::-webkit-search-decoration,.fd-input[type=search]::-webkit-search-results-button,.fd-input[type=search]::-webkit-search-results-decoration{-webkit-appearance:none}.fd-input[aria-expanded=false]{z-index:0}.fd-input.is-expanded,.fd-input[aria-expanded=true]{z-index:4}.fd-input[class*=-compact],.fd-input[class*=-condensed],[class*=-compact] .fd-input:not([class*=-cozy]),[class*=-condensed] .fd-input:not([class*=-cozy]){box-sizing:border-box;height:var(--sapElement_Compact_Height);margin:var(--fdInput_Field_Compact_Margin, .1875rem 0);min-height:var(--sapElement_Compact_Height);min-width:var(--fdInput_Field_Compact_Min_Width, 2rem);padding:var(--fdInput_Field_Compact_Padding, 0 .5rem)}.fd-input--no-number-spinner{-moz-appearance:textfield}.fd-input--no-number-spinner::-webkit-inner-spin-button,.fd-input--no-number-spinner::-webkit-outer-spin-button{-webkit-appearance:none;margin:0}.fd-input.right-align{text-align:right}.fd-input.is-success{-webkit-box-shadow:var(--sapField_SuccessShadow);background:var(--sapField_SuccessBackgroundStyle);background-color:var(--sapField_SuccessBackground);border:var(--sapField_SuccessColor) var(--sapField_SuccessBorderWidth) var(--sapField_SuccessBorderStyle);box-shadow:var(--sapField_SuccessShadow)}.fd-input.is-success.is-hover,.fd-input.is-success:hover{-webkit-box-shadow:var(--fdInput_Success_Box_Shadow_Hover);background-color:var(--fdInput_Success_Background_Color_Hover);border-color:var(--sapField_SuccessColor);box-shadow:var(--fdInput_Success_Box_Shadow_Hover)}.fd-input.is-success.is-focus,.fd-input.is-success:focus{background:var(--sapField_Focus_Background);outline-color:var(--fdInput_Success_Outline_Color);z-index:5}.fd-input.is-success.is-focus.is-hover,.fd-input.is-success.is-focus:hover,.fd-input.is-success:focus.is-hover,.fd-input.is-success:focus:hover{box-shadow:none}.fd-input.is-success.is-expanded,.fd-input.is-success[aria-expanded=true]{-webkit-box-shadow:none;background:var(--sapField_Focus_Background);box-shadow:none;outline:var(--sapContent_FocusWidth) var(--sapContent_FocusStyle) var(--fdInput_Success_Outline_Color);outline-offset:var(--fdInput_Outline_Offset)}.fd-input.is-error{-webkit-box-shadow:var(--sapField_InvalidShadow);background:var(--sapField_InvalidBackgroundStyle);background-color:var(--sapField_InvalidBackground);border:var(--sapField_InvalidColor) var(--sapField_InvalidBorderWidth) var(--sapField_InvalidBorderStyle);box-shadow:var(--sapField_InvalidShadow)}.fd-input.is-error.is-hover,.fd-input.is-error:hover{-webkit-box-shadow:var(--fdInput_Error_Box_Shadow_Hover);background-color:var(--fdInput_Error_Background_Color_Hover);border-color:var(--sapField_InvalidColor);box-shadow:var(--fdInput_Error_Box_Shadow_Hover)}.fd-input.is-error.is-focus,.fd-input.is-error:focus{background:var(--sapField_Focus_Background);outline-color:var(--fdInput_Error_Outline_Color);z-index:5}.fd-input.is-error.is-focus.is-hover,.fd-input.is-error.is-focus:hover,.fd-input.is-error:focus.is-hover,.fd-input.is-error:focus:hover{box-shadow:none}.fd-input.is-error.is-expanded,.fd-input.is-error[aria-expanded=true]{-webkit-box-shadow:none;background:var(--sapField_Focus_Background);box-shadow:none;outline:var(--sapContent_FocusWidth) var(--sapContent_FocusStyle) var(--fdInput_Error_Outline_Color);outline-offset:var(--fdInput_Outline_Offset)}.fd-input.is-warning{-webkit-box-shadow:var(--sapField_WarningShadow);background:var(--sapField_WarningBackgroundStyle);background-color:var(--sapField_WarningBackground);border:var(--sapField_WarningColor) var(--sapField_WarningBorderWidth) var(--sapField_WarningBorderStyle);box-shadow:var(--sapField_WarningShadow)}.fd-input.is-warning.is-hover,.fd-input.is-warning:hover{-webkit-box-shadow:var(--fdInput_Warning_Box_Shadow_Hover);background-color:var(--fdInput_Warning_Background_Color_Hover);border-color:var(--sapField_WarningColor);box-shadow:var(--fdInput_Warning_Box_Shadow_Hover)}.fd-input.is-warning.is-focus,.fd-input.is-warning:focus{background:var(--sapField_Focus_Background);outline-color:var(--fdInput_Warning_Outline_Color);z-index:5}.fd-input.is-warning.is-focus.is-hover,.fd-input.is-warning.is-focus:hover,.fd-input.is-warning:focus.is-hover,.fd-input.is-warning:focus:hover{box-shadow:none}.fd-input.is-warning.is-expanded,.fd-input.is-warning[aria-expanded=true]{-webkit-box-shadow:none;background:var(--sapField_Focus_Background);box-shadow:none;outline:var(--sapContent_FocusWidth) var(--sapContent_FocusStyle) var(--fdInput_Warning_Outline_Color);outline-offset:var(--fdInput_Outline_Offset)}.fd-input.is-alert{background:var(--sapField_WarningBackgroundStyle);background-color:var(--sapField_WarningBackground);border:var(--sapField_WarningColor) var(--sapField_WarningBorderWidth) var(--sapField_WarningBorderStyle)}.fd-input.is-alert.is-hover,.fd-input.is-alert:hover{-webkit-box-shadow:var(--fdInput_Warning_Box_Shadow_Hover);background-color:var(--fdInput_Warning_Background_Color_Hover);border-color:var(--sapField_WarningColor);box-shadow:var(--fdInput_Warning_Box_Shadow_Hover)}.fd-input.is-alert.is-focus,.fd-input.is-alert:focus{background:var(--sapField_Focus_Background);outline-color:var(--fdInput_Warning_Outline_Color);z-index:5}.fd-input.is-alert.is-focus.is-hover,.fd-input.is-alert.is-focus:hover,.fd-input.is-alert:focus.is-hover,.fd-input.is-alert:focus:hover{box-shadow:none}.fd-input.is-alert.is-expanded,.fd-input.is-alert[aria-expanded=true]{-webkit-box-shadow:none;background:var(--sapField_Focus_Background);box-shadow:none;outline:var(--sapContent_FocusWidth) var(--sapContent_FocusStyle) var(--fdInput_Warning_Outline_Color);outline-offset:var(--fdInput_Outline_Offset)}.fd-input.is-information{-webkit-box-shadow:var(--sapField_InformationShadow);background:var(--sapField_InformationBackgroundStyle);background-color:var(--sapField_InformationBackground);border:var(--sapField_InformationColor) var(--sapField_InformationBorderWidth) var(--sapField_InformationBorderStyle);box-shadow:var(--sapField_InformationShadow)}.fd-input.is-information.is-hover,.fd-input.is-information:hover{-webkit-box-shadow:var(--fdInput_Information_Box_Shadow_Hover);background-color:var(--fdInput_Information_Background_Color_Hover);border-color:var(--sapField_InformationColor);box-shadow:var(--fdInput_Information_Box_Shadow_Hover)}.fd-input.is-information.is-focus,.fd-input.is-information:focus{background:var(--sapField_Focus_Background);outline-color:var(--fdInput_Information_Outline_Color);z-index:5}.fd-input.is-information.is-focus.is-hover,.fd-input.is-information.is-focus:hover,.fd-input.is-information:focus.is-hover,.fd-input.is-information:focus:hover{box-shadow:none}.fd-input.is-information.is-expanded,.fd-input.is-information[aria-expanded=true]{-webkit-box-shadow:none;background:var(--sapField_Focus_Background);box-shadow:none;outline:var(--sapContent_FocusWidth) var(--sapContent_FocusStyle) var(--fdInput_Information_Outline_Color);outline-offset:var(--fdInput_Outline_Offset)}.fd-input.is-alert,.fd-input.is-error,.fd-input.is-warning{font-style:var(--fdInput_State_Text_Style);font-weight:var(--fdInput_State_Font_Weight)}.fd-input.is-alert::placeholder,.fd-input.is-error::placeholder,.fd-input.is-warning::placeholder{font-weight:var(--fdInput_State_Font_Weight)}.fd-input.is-alert.is-focus,.fd-input.is-alert:focus,.fd-input.is-error.is-focus,.fd-input.is-error:focus,.fd-input.is-information.is-focus,.fd-input.is-information:focus,.fd-input.is-warning.is-focus,.fd-input.is-warning:focus{outline-offset:var(--fdInput_Outline_Offset_States);z-index:5}.fd-input.is-error::placeholder{color:var(--sapField_TextColor)}.fd-input.is-disabled,.fd-input:disabled,.fd-input[aria-disabled=true]{opacity:var(--sapContent_DisabledOpacity);pointer-events:none}.fd-input.is-disabled::placeholder,.fd-input:disabled::placeholder,.fd-input[aria-disabled=true]::placeholder{color:var(--fdInput_Non_Interactive_State_Placeholder_Color)}.fd-input.is-readonly,.fd-input[aria-readonly=true],.fd-input[readonly]{-webkit-box-shadow:none;background:var(--sapField_ReadOnly_BackgroundStyle);background-color:var(--sapField_ReadOnly_Background);border-color:var(--sapField_ReadOnly_BorderColor);box-shadow:none}.fd-input.is-readonly::placeholder,.fd-input[aria-readonly=true]::placeholder,.fd-input[readonly]::placeholder{color:var(--fdInput_Non_Interactive_State_Placeholder_Color)}.fd-input.is-readonly.is-focus,.fd-input.is-readonly.is-hover,.fd-input.is-readonly:focus,.fd-input.is-readonly:hover,.fd-input[aria-readonly=true].is-focus,.fd-input[aria-readonly=true].is-hover,.fd-input[aria-readonly=true]:focus,.fd-input[aria-readonly=true]:hover,.fd-input[readonly].is-focus,.fd-input[readonly].is-hover,.fd-input[readonly]:focus,.fd-input[readonly]:hover{-webkit-box-shadow:none;background:var(--sapField_ReadOnly_BackgroundStyle);background-color:var(--sapField_ReadOnly_Background);border-color:var(--sapField_ReadOnly_BorderColor);box-shadow:none}.fd-input.is-readonly.is-focus,.fd-input.is-readonly:focus,.fd-input[aria-readonly=true].is-focus,.fd-input[aria-readonly=true]:focus,.fd-input[readonly].is-focus,.fd-input[readonly]:focus{z-index:5}/*!\n * Fundamental Library Styles v0.30.2-rc.6\n * Copyright (c) 2023 SAP SE or an SAP affiliate company.\n * Licensed under Apache License 2.0 (https://github.com/SAP/fundamental-styles/blob/main/LICENSE)\n */.fd-step-input{--fdStepInput_Button_Width:var(--fdStepInput_Button_Width_Cozy);--fdStepInput_Bordered_Button_Width:var(--fdStepInput_Button_Width_Semantic_Cozy);-webkit-box-sizing:border-box;-webkit-box-shadow:var(--sapField_Shadow);-moz-appearance:none;-webkit-appearance:none;align-items:center;appearance:none;background:var(--sapField_BackgroundStyle, var(--sapField_BackgroundStyle));background-color:var(--sapField_Background, var(--sapField_Background));border:0;border:var(--sapField_BorderWidth) var(--sapField_BorderStyle) var(--sapField_BorderColor);border-radius:var(--sapField_BorderCornerRadius);box-shadow:var(--sapField_Shadow);box-sizing:border-box;color:var(--sapTextColor);color:var(--sapField_TextColor);cursor:text;display:inline-flex;font-family:var(--sapFontFamily);font-size:var(--sapFontSize);font-weight:400;forced-color-adjust:none;height:var(--sapElement_Height);line-height:var(--sapContent_LineHeight);margin:0;margin:var(--fdInput_Field_Margin, .25rem 0);min-height:var(--sapElement_Height);min-width:var(2.75rem, 2.75rem);outline:none;overflow:hidden;padding:0;position:relative;text-overflow:ellipsis;text-shadow:var(--fdInput_Text_Shadow);white-space:nowrap;width:100%;width:auto;z-index:1}.fd-step-input:after,.fd-step-input:before{box-sizing:inherit;font-size:inherit}.fd-step-input::placeholder{color:var(--sapField_PlaceholderTextColor);font-style:var(--fdPlaceholder_Font_Style)}.fd-step-input[dir=rtl]::placeholder,[dir=rtl] .fd-step-input::placeholder{text-indent:.125rem}.fd-step-input::selection{background-color:var(--sapSelectedColor);color:var(--sapContent_ContrastTextColor)}.fd-step-input::-ms-clear{display:none}.fd-step-input.is-hover,.fd-step-input:hover{-webkit-box-shadow:var(--fdInput_Box_Shadow_Hover);background:var(--sapField_Hover_BackgroundStyle, var(--sapField_Hover_BackgroundStyle));background-color:var(--sapField_Hover_Background, var(--sapField_Hover_Background));border-color:var(--sapField_Hover_BorderColor);box-shadow:var(--fdInput_Box_Shadow_Hover)}.fd-step-input.is-focus,.fd-step-input:focus{-webkit-box-shadow:none;background:var(--sapField_Focus_Background, var(--sapField_Focus_Background));box-shadow:none;outline-color:var(--fdInput_Outline_Color);outline-offset:var(--fdInput_Outline_Offset);outline-style:var(--sapContent_FocusStyle);outline-width:var(--sapContent_FocusWidth)}.fd-step-input:focus-within{-webkit-box-shadow:none;background:var(--sapField_Focus_Background, var(--sapField_Focus_Background));box-shadow:none;outline-color:var(--fdInput_Outline_Color);outline-offset:var(--fdInput_Outline_Offset_Focus_Within);outline-style:var(--sapContent_FocusStyle);outline-width:var(--sapContent_FocusWidth)}.fd-step-input.is-success{-webkit-box-shadow:var(--sapField_SuccessShadow);background:var(--sapField_SuccessBackgroundStyle);background-color:var(--sapField_SuccessBackground);border:var(--sapField_SuccessColor) var(--sapField_SuccessBorderWidth) var(--sapField_SuccessBorderStyle);box-shadow:var(--sapField_SuccessShadow)}.fd-step-input.is-success.is-hover,.fd-step-input.is-success:hover{-webkit-box-shadow:var(--fdInput_Success_Box_Shadow_Hover);background-color:var(--fdInput_Success_Background_Color_Hover);border-color:var(--sapField_SuccessColor);box-shadow:var(--fdInput_Success_Box_Shadow_Hover)}.fd-step-input.is-success.is-focus,.fd-step-input.is-success:focus{background:var(--sapField_Focus_Background);outline-color:var(--fdInput_Success_Outline_Color)}.fd-step-input.is-success.is-focus.is-hover,.fd-step-input.is-success.is-focus:hover,.fd-step-input.is-success:focus.is-hover,.fd-step-input.is-success:focus:hover{box-shadow:none}.fd-step-input.is-success:focus-within{background:var(--sapField_Focus_Background);outline-color:var(--fdInput_Success_Outline_Color)}.fd-step-input.is-success:focus-within.is-hover,.fd-step-input.is-success:focus-within:hover{box-shadow:none}.fd-step-input.is-success.is-expanded,.fd-step-input.is-success[aria-expanded=true]{-webkit-box-shadow:none;background:var(--sapField_Focus_Background);box-shadow:none;outline:var(--sapContent_FocusWidth) var(--sapContent_FocusStyle) var(--fdInput_Success_Outline_Color);outline-offset:var(--fdInput_Outline_Offset)}.fd-step-input.is-error{-webkit-box-shadow:var(--sapField_InvalidShadow);background:var(--sapField_InvalidBackgroundStyle);background-color:var(--sapField_InvalidBackground);border:var(--sapField_InvalidColor) var(--sapField_InvalidBorderWidth) var(--sapField_InvalidBorderStyle);box-shadow:var(--sapField_InvalidShadow)}.fd-step-input.is-error.is-hover,.fd-step-input.is-error:hover{-webkit-box-shadow:var(--fdInput_Error_Box_Shadow_Hover);background-color:var(--fdInput_Error_Background_Color_Hover);border-color:var(--sapField_InvalidColor);box-shadow:var(--fdInput_Error_Box_Shadow_Hover)}.fd-step-input.is-error.is-focus,.fd-step-input.is-error:focus{background:var(--sapField_Focus_Background);outline-color:var(--fdInput_Error_Outline_Color)}.fd-step-input.is-error.is-focus.is-hover,.fd-step-input.is-error.is-focus:hover,.fd-step-input.is-error:focus.is-hover,.fd-step-input.is-error:focus:hover{box-shadow:none}.fd-step-input.is-error:focus-within{background:var(--sapField_Focus_Background);outline-color:var(--fdInput_Error_Outline_Color)}.fd-step-input.is-error:focus-within.is-hover,.fd-step-input.is-error:focus-within:hover{box-shadow:none}.fd-step-input.is-error.is-expanded,.fd-step-input.is-error[aria-expanded=true]{-webkit-box-shadow:none;background:var(--sapField_Focus_Background);box-shadow:none;outline:var(--sapContent_FocusWidth) var(--sapContent_FocusStyle) var(--fdInput_Error_Outline_Color);outline-offset:var(--fdInput_Outline_Offset)}.fd-step-input.is-warning{-webkit-box-shadow:var(--sapField_WarningShadow);background:var(--sapField_WarningBackgroundStyle);background-color:var(--sapField_WarningBackground);border:var(--sapField_WarningColor) var(--sapField_WarningBorderWidth) var(--sapField_WarningBorderStyle);box-shadow:var(--sapField_WarningShadow)}.fd-step-input.is-warning.is-hover,.fd-step-input.is-warning:hover{-webkit-box-shadow:var(--fdInput_Warning_Box_Shadow_Hover);background-color:var(--fdInput_Warning_Background_Color_Hover);border-color:var(--sapField_WarningColor);box-shadow:var(--fdInput_Warning_Box_Shadow_Hover)}.fd-step-input.is-warning.is-focus,.fd-step-input.is-warning:focus{background:var(--sapField_Focus_Background);outline-color:var(--fdInput_Warning_Outline_Color)}.fd-step-input.is-warning.is-focus.is-hover,.fd-step-input.is-warning.is-focus:hover,.fd-step-input.is-warning:focus.is-hover,.fd-step-input.is-warning:focus:hover{box-shadow:none}.fd-step-input.is-warning:focus-within{background:var(--sapField_Focus_Background);outline-color:var(--fdInput_Warning_Outline_Color)}.fd-step-input.is-warning:focus-within.is-hover,.fd-step-input.is-warning:focus-within:hover{box-shadow:none}.fd-step-input.is-warning.is-expanded,.fd-step-input.is-warning[aria-expanded=true]{-webkit-box-shadow:none;background:var(--sapField_Focus_Background);box-shadow:none;outline:var(--sapContent_FocusWidth) var(--sapContent_FocusStyle) var(--fdInput_Warning_Outline_Color);outline-offset:var(--fdInput_Outline_Offset)}.fd-step-input.is-alert{background:var(--sapField_WarningBackgroundStyle);background-color:var(--sapField_WarningBackground);border:var(--sapField_WarningColor) var(--sapField_WarningBorderWidth) var(--sapField_WarningBorderStyle)}.fd-step-input.is-alert.is-hover,.fd-step-input.is-alert:hover{-webkit-box-shadow:var(--fdInput_Warning_Box_Shadow_Hover);background-color:var(--fdInput_Warning_Background_Color_Hover);border-color:var(--sapField_WarningColor);box-shadow:var(--fdInput_Warning_Box_Shadow_Hover)}.fd-step-input.is-alert.is-focus,.fd-step-input.is-alert:focus{background:var(--sapField_Focus_Background);outline-color:var(--fdInput_Warning_Outline_Color)}.fd-step-input.is-alert.is-focus.is-hover,.fd-step-input.is-alert.is-focus:hover,.fd-step-input.is-alert:focus.is-hover,.fd-step-input.is-alert:focus:hover{box-shadow:none}.fd-step-input.is-alert:focus-within{background:var(--sapField_Focus_Background);outline-color:var(--fdInput_Warning_Outline_Color)}.fd-step-input.is-alert:focus-within.is-hover,.fd-step-input.is-alert:focus-within:hover{box-shadow:none}.fd-step-input.is-alert.is-expanded,.fd-step-input.is-alert[aria-expanded=true]{-webkit-box-shadow:none;background:var(--sapField_Focus_Background);box-shadow:none;outline:var(--sapContent_FocusWidth) var(--sapContent_FocusStyle) var(--fdInput_Warning_Outline_Color);outline-offset:var(--fdInput_Outline_Offset)}.fd-step-input.is-information{-webkit-box-shadow:var(--sapField_InformationShadow);background:var(--sapField_InformationBackgroundStyle);background-color:var(--sapField_InformationBackground);border:var(--sapField_InformationColor) var(--sapField_InformationBorderWidth) var(--sapField_InformationBorderStyle);box-shadow:var(--sapField_InformationShadow)}.fd-step-input.is-information.is-hover,.fd-step-input.is-information:hover{-webkit-box-shadow:var(--fdInput_Information_Box_Shadow_Hover);background-color:var(--fdInput_Information_Background_Color_Hover);border-color:var(--sapField_InformationColor);box-shadow:var(--fdInput_Information_Box_Shadow_Hover)}.fd-step-input.is-information.is-focus,.fd-step-input.is-information:focus{background:var(--sapField_Focus_Background);outline-color:var(--fdInput_Information_Outline_Color)}.fd-step-input.is-information.is-focus.is-hover,.fd-step-input.is-information.is-focus:hover,.fd-step-input.is-information:focus.is-hover,.fd-step-input.is-information:focus:hover{box-shadow:none}.fd-step-input.is-information:focus-within{background:var(--sapField_Focus_Background);outline-color:var(--fdInput_Information_Outline_Color)}.fd-step-input.is-information:focus-within.is-hover,.fd-step-input.is-information:focus-within:hover{box-shadow:none}.fd-step-input.is-information.is-expanded,.fd-step-input.is-information[aria-expanded=true]{-webkit-box-shadow:none;background:var(--sapField_Focus_Background);box-shadow:none;outline:var(--sapContent_FocusWidth) var(--sapContent_FocusStyle) var(--fdInput_Information_Outline_Color);outline-offset:var(--fdInput_Outline_Offset)}.fd-step-input.is-alert,.fd-step-input.is-error,.fd-step-input.is-warning{font-style:var(--fdInput_State_Text_Style);font-weight:var(--fdInput_State_Font_Weight)}.fd-step-input.is-alert::placeholder,.fd-step-input.is-error::placeholder,.fd-step-input.is-warning::placeholder{font-weight:var(--fdInput_State_Font_Weight)}.fd-step-input.is-alert.is-focus,.fd-step-input.is-alert:focus,.fd-step-input.is-error.is-focus,.fd-step-input.is-error:focus,.fd-step-input.is-information.is-focus,.fd-step-input.is-information:focus,.fd-step-input.is-warning.is-focus,.fd-step-input.is-warning:focus{outline-offset:var(--fdInput_Outline_Offset_States);z-index:5}.fd-step-input.is-error::placeholder{color:var(--sapField_TextColor)}.fd-step-input.is-disabled,.fd-step-input:disabled,.fd-step-input[aria-disabled=true]{opacity:var(--sapContent_DisabledOpacity);pointer-events:none}.fd-step-input.is-disabled::placeholder,.fd-step-input:disabled::placeholder,.fd-step-input[aria-disabled=true]::placeholder{color:var(--fdInput_Non_Interactive_State_Placeholder_Color)}.fd-step-input.is-readonly,.fd-step-input[aria-readonly=true],.fd-step-input[readonly]{-webkit-box-shadow:none;background:var(--sapField_ReadOnly_BackgroundStyle);background-color:var(--sapField_ReadOnly_Background);border-color:var(--sapField_ReadOnly_BorderColor);box-shadow:none}.fd-step-input.is-readonly::placeholder,.fd-step-input[aria-readonly=true]::placeholder,.fd-step-input[readonly]::placeholder{color:var(--fdInput_Non_Interactive_State_Placeholder_Color)}.fd-step-input.is-readonly.is-hover,.fd-step-input.is-readonly:hover,.fd-step-input[aria-readonly=true].is-hover,.fd-step-input[aria-readonly=true]:hover,.fd-step-input[readonly].is-hover,.fd-step-input[readonly]:hover{-webkit-box-shadow:none;background:var(--sapField_ReadOnly_BackgroundStyle);background-color:var(--sapField_ReadOnly_Background);border-color:var(--sapField_ReadOnly_BorderColor);box-shadow:none}.fd-step-input.is-readonly.is-focus,.fd-step-input.is-readonly:focus,.fd-step-input[aria-readonly=true].is-focus,.fd-step-input[aria-readonly=true]:focus,.fd-step-input[readonly].is-focus,.fd-step-input[readonly]:focus{-webkit-box-shadow:none;background:var(--sapField_ReadOnly_BackgroundStyle);background-color:var(--sapField_ReadOnly_Background);border-color:var(--sapField_ReadOnly_BorderColor);box-shadow:none;z-index:5}.fd-step-input .fd-step-input__button:first-child{border-right:var(--fdInputGroup_ControlButton_SideBorder)}.fd-step-input .fd-step-input__button:first-child[dir=rtl],[dir=rtl] .fd-step-input .fd-step-input__button:first-child{border-left:var(--fdInputGroup_ControlButton_SideBorder);border-right-style:none}.fd-step-input .fd-step-input__button:first-child.is-hover,.fd-step-input .fd-step-input__button:first-child:hover{border-right:var(--fdInputGroup_ControlButton_SideBorder_Active)}.fd-step-input .fd-step-input__button:first-child.is-hover[dir=rtl],.fd-step-input .fd-step-input__button:first-child:hover[dir=rtl],[dir=rtl] .fd-step-input .fd-step-input__button:first-child.is-hover,[dir=rtl] .fd-step-input .fd-step-input__button:first-child:hover{border-left:var(--fdInputGroup_ControlButton_SideBorder_Active);border-right-style:none}.fd-step-input .fd-step-input__button:first-child.is-active,.fd-step-input .fd-step-input__button:first-child:active{border-right:var(--fdInputGroup_ControlButton_SideBorder_Active)}.fd-step-input .fd-step-input__button:first-child.is-active[dir=rtl],.fd-step-input .fd-step-input__button:first-child:active[dir=rtl],[dir=rtl] .fd-step-input .fd-step-input__button:first-child.is-active,[dir=rtl] .fd-step-input .fd-step-input__button:first-child:active{border-left:var(--fdInputGroup_ControlButton_SideBorder_Active);border-right-style:none}.fd-step-input .fd-step-input__button:not(:first-child){border-left:var(--fdInputGroup_ControlButton_SideBorder)}.fd-step-input .fd-step-input__button:not(:first-child)[dir=rtl],[dir=rtl] .fd-step-input .fd-step-input__button:not(:first-child){border-left-style:none;border-right:var(--fdInputGroup_ControlButton_SideBorder)}.fd-step-input .fd-step-input__button:not(:first-child).is-hover,.fd-step-input .fd-step-input__button:not(:first-child):hover{border-left:var(--fdInputGroup_ControlButton_SideBorder_Active)}.fd-step-input .fd-step-input__button:not(:first-child).is-hover[dir=rtl],.fd-step-input .fd-step-input__button:not(:first-child):hover[dir=rtl],[dir=rtl] .fd-step-input .fd-step-input__button:not(:first-child).is-hover,[dir=rtl] .fd-step-input .fd-step-input__button:not(:first-child):hover{border-left-style:none;border-right:var(--fdInputGroup_ControlButton_SideBorder_Active)}.fd-step-input .fd-step-input__button:not(:first-child).is-active,.fd-step-input .fd-step-input__button:not(:first-child):active{border-left:var(--fdInputGroup_ControlButton_SideBorder_Active)}.fd-step-input .fd-step-input__button:not(:first-child).is-active[dir=rtl],.fd-step-input .fd-step-input__button:not(:first-child):active[dir=rtl],[dir=rtl] .fd-step-input .fd-step-input__button:not(:first-child).is-active,[dir=rtl] .fd-step-input .fd-step-input__button:not(:first-child):active{border-left-style:none;border-right:var(--fdInputGroup_ControlButton_SideBorder_Active)}.fd-step-input .fd-step-input__addon:first-child .fd-step-input__button{border-right:var(--fdInputGroup_ControlButton_SideBorder)}.fd-step-input .fd-step-input__addon:first-child .fd-step-input__button[dir=rtl],[dir=rtl] .fd-step-input .fd-step-input__addon:first-child .fd-step-input__button{border-left:var(--fdInputGroup_ControlButton_SideBorder);border-right-style:none}.fd-step-input .fd-step-input__addon:first-child .fd-step-input__button.is-hover,.fd-step-input .fd-step-input__addon:first-child .fd-step-input__button:hover{border-right:var(--fdInputGroup_ControlButton_SideBorder_Active)}.fd-step-input .fd-step-input__addon:first-child .fd-step-input__button.is-hover[dir=rtl],.fd-step-input .fd-step-input__addon:first-child .fd-step-input__button:hover[dir=rtl],[dir=rtl] .fd-step-input .fd-step-input__addon:first-child .fd-step-input__button.is-hover,[dir=rtl] .fd-step-input .fd-step-input__addon:first-child .fd-step-input__button:hover{border-left:var(--fdInputGroup_ControlButton_SideBorder_Active);border-right-style:none}.fd-step-input .fd-step-input__addon:first-child .fd-step-input__button.is-active,.fd-step-input .fd-step-input__addon:first-child .fd-step-input__button:active{border-right:var(--fdInputGroup_ControlButton_SideBorder_Active)}.fd-step-input .fd-step-input__addon:first-child .fd-step-input__button.is-active[dir=rtl],.fd-step-input .fd-step-input__addon:first-child .fd-step-input__button:active[dir=rtl],[dir=rtl] .fd-step-input .fd-step-input__addon:first-child .fd-step-input__button.is-active,[dir=rtl] .fd-step-input .fd-step-input__addon:first-child .fd-step-input__button:active{border-left:var(--fdInputGroup_ControlButton_SideBorder_Active);border-right-style:none}.fd-step-input .fd-step-input__addon:not(:first-child) .fd-step-input__button{border-left:var(--fdInputGroup_ControlButton_SideBorder)}.fd-step-input .fd-step-input__addon:not(:first-child) .fd-step-input__button[dir=rtl],[dir=rtl] .fd-step-input .fd-step-input__addon:not(:first-child) .fd-step-input__button{border-left-style:none;border-right:var(--fdInputGroup_ControlButton_SideBorder)}.fd-step-input .fd-step-input__addon:not(:first-child) .fd-step-input__button.is-hover,.fd-step-input .fd-step-input__addon:not(:first-child) .fd-step-input__button:hover{border-left:var(--fdInputGroup_ControlButton_SideBorder_Active)}.fd-step-input .fd-step-input__addon:not(:first-child) .fd-step-input__button.is-hover[dir=rtl],.fd-step-input .fd-step-input__addon:not(:first-child) .fd-step-input__button:hover[dir=rtl],[dir=rtl] .fd-step-input .fd-step-input__addon:not(:first-child) .fd-step-input__button.is-hover,[dir=rtl] .fd-step-input .fd-step-input__addon:not(:first-child) .fd-step-input__button:hover{border-left-style:none;border-right:var(--fdInputGroup_ControlButton_SideBorder_Active)}.fd-step-input .fd-step-input__addon:not(:first-child) .fd-step-input__button.is-active,.fd-step-input .fd-step-input__addon:not(:first-child) .fd-step-input__button:active{border-left:var(--fdInputGroup_ControlButton_SideBorder_Active)}.fd-step-input .fd-step-input__addon:not(:first-child) .fd-step-input__button.is-active[dir=rtl],.fd-step-input .fd-step-input__addon:not(:first-child) .fd-step-input__button:active[dir=rtl],[dir=rtl] .fd-step-input .fd-step-input__addon:not(:first-child) .fd-step-input__button.is-active,[dir=rtl] .fd-step-input .fd-step-input__addon:not(:first-child) .fd-step-input__button:active{border-left-style:none;border-right:var(--fdInputGroup_ControlButton_SideBorder_Active)}.fd-step-input .fd-step-input__button{background:var(--fdInput_Group_Button_Background);background-color:var(--fdButtonBackgroundColor);border:none;border-radius:var(--fdInput_Group_Button_Border_Raduis);color:var(--fdInput_Group_Button_Text_Color);overflow:hidden;position:relative;text-overflow:ellipsis;white-space:nowrap;z-index:auto!important}.fd-step-input .fd-step-input__button:before{display:none!important}.fd-step-input .fd-step-input__button:after{border-radius:var(--fdInput_Outline_Border_Radius)}.fd-step-input .fd-step-input__button.is-hover,.fd-step-input .fd-step-input__button:hover{--fdInput_Group_Button_Text_Color:var(--fdInput_Group_Button_Hover_Text_Color);--fdButtonBackgroundColor:var(--fdInput_Group_Button_Hover_Background);box-shadow:var(--fdInput_Group_Button_Box_Shadow)}.fd-step-input .fd-step-input__button.is-active,.fd-step-input .fd-step-input__button:active{-webkit-box-shadow:var(--fdInput_Group_Button_Box_Shadow);background:var(--fdInput_Group_Button_Active_Background);box-shadow:var(--fdInput_Group_Button_Box_Shadow);color:var(--fdInput_Group_Button_Active_Text_Color)}.fd-step-input.is-success.is-focus,.fd-step-input.is-success:focus{z-index:5}.fd-step-input.is-success.is-focus .fd-step-input__button,.fd-step-input.is-success:focus .fd-step-input__button{-webkit-box-shadow:var(--fdInput_Group_Button_Success_Active_Box_Shadow);--fdButtonBackgroundColor:var(--fdInput_Group_Button_Active_Background);box-shadow:var(--fdInput_Group_Button_Success_Active_Box_Shadow);color:var(--fdInput_Group_Button_Success_Active_Text_Color)}.fd-step-input.is-success.is-focus .fd-step-input__button.is-hover,.fd-step-input.is-success.is-focus .fd-step-input__button:hover,.fd-step-input.is-success:focus .fd-step-input__button.is-hover,.fd-step-input.is-success:focus .fd-step-input__button:hover{--fdButtonBackgroundColor:var(--fdInput_Group_Button_Active_Background)}.fd-step-input.is-success.is-expanded .fd-step-input__button,.fd-step-input.is-success[aria-expanded=true] .fd-step-input__button{-webkit-box-shadow:var(--fdInput_Group_Button_Success_Active_Box_Shadow);--fdButtonBackgroundColor:var(--fdInput_Group_Button_Active_Background);box-shadow:var(--fdInput_Group_Button_Success_Active_Box_Shadow);color:var(--fdInput_Group_Button_Success_Active_Text_Color)}.fd-step-input.is-success.is-expanded .fd-step-input__button.is-hover,.fd-step-input.is-success.is-expanded .fd-step-input__button:hover,.fd-step-input.is-success[aria-expanded=true] .fd-step-input__button.is-hover,.fd-step-input.is-success[aria-expanded=true] .fd-step-input__button:hover{--fdButtonBackgroundColor:var(--fdInput_Group_Button_Active_Background)}.fd-step-input.is-success .fd-step-input__button.is-active,.fd-step-input.is-success .fd-step-input__button.is-hover,.fd-step-input.is-success .fd-step-input__button:active,.fd-step-input.is-success .fd-step-input__button:hover{box-shadow:var(--fdInput_Group_Button_Success_Active_Box_Shadow)}.fd-step-input.is-success .fd-step-input__button.is-active,.fd-step-input.is-success .fd-step-input__button:active{color:var(--fdInput_Group_Button_Success_Active_Text_Color)}.fd-step-input.is-error.is-focus,.fd-step-input.is-error:focus{z-index:5}.fd-step-input.is-error.is-focus .fd-step-input__button,.fd-step-input.is-error:focus .fd-step-input__button{-webkit-box-shadow:var(--fdInput_Group_Button_Error_Active_Box_Shadow);--fdButtonBackgroundColor:var(--fdInput_Group_Button_Active_Background);box-shadow:var(--fdInput_Group_Button_Error_Active_Box_Shadow);color:var(--fdInput_Group_Button_Error_Active_Text_Color)}.fd-step-input.is-error.is-focus .fd-step-input__button.is-hover,.fd-step-input.is-error.is-focus .fd-step-input__button:hover,.fd-step-input.is-error:focus .fd-step-input__button.is-hover,.fd-step-input.is-error:focus .fd-step-input__button:hover{--fdButtonBackgroundColor:var(--fdInput_Group_Button_Active_Background)}.fd-step-input.is-error.is-expanded .fd-step-input__button,.fd-step-input.is-error[aria-expanded=true] .fd-step-input__button{-webkit-box-shadow:var(--fdInput_Group_Button_Error_Active_Box_Shadow);--fdButtonBackgroundColor:var(--fdInput_Group_Button_Active_Background);box-shadow:var(--fdInput_Group_Button_Error_Active_Box_Shadow);color:var(--fdInput_Group_Button_Error_Active_Text_Color)}.fd-step-input.is-error.is-expanded .fd-step-input__button.is-hover,.fd-step-input.is-error.is-expanded .fd-step-input__button:hover,.fd-step-input.is-error[aria-expanded=true] .fd-step-input__button.is-hover,.fd-step-input.is-error[aria-expanded=true] .fd-step-input__button:hover{--fdButtonBackgroundColor:var(--fdInput_Group_Button_Active_Background)}.fd-step-input.is-error .fd-step-input__button.is-active,.fd-step-input.is-error .fd-step-input__button.is-hover,.fd-step-input.is-error .fd-step-input__button:active,.fd-step-input.is-error .fd-step-input__button:hover{box-shadow:var(--fdInput_Group_Button_Error_Active_Box_Shadow)}.fd-step-input.is-error .fd-step-input__button.is-active,.fd-step-input.is-error .fd-step-input__button:active{color:var(--fdInput_Group_Button_Error_Active_Text_Color)}.fd-step-input.is-warning.is-focus,.fd-step-input.is-warning:focus{z-index:5}.fd-step-input.is-warning.is-focus .fd-step-input__button,.fd-step-input.is-warning:focus .fd-step-input__button{-webkit-box-shadow:var(--fdInput_Group_Button_Warning_Active_Box_Shadow);--fdButtonBackgroundColor:var(--fdInput_Group_Button_Active_Background);box-shadow:var(--fdInput_Group_Button_Warning_Active_Box_Shadow);color:var(--fdInput_Group_Button_Warning_Active_Text_Color)}.fd-step-input.is-warning.is-focus .fd-step-input__button.is-hover,.fd-step-input.is-warning.is-focus .fd-step-input__button:hover,.fd-step-input.is-warning:focus .fd-step-input__button.is-hover,.fd-step-input.is-warning:focus .fd-step-input__button:hover{--fdButtonBackgroundColor:var(--fdInput_Group_Button_Active_Background)}.fd-step-input.is-warning.is-expanded .fd-step-input__button,.fd-step-input.is-warning[aria-expanded=true] .fd-step-input__button{-webkit-box-shadow:var(--fdInput_Group_Button_Warning_Active_Box_Shadow);--fdButtonBackgroundColor:var(--fdInput_Group_Button_Active_Background);box-shadow:var(--fdInput_Group_Button_Warning_Active_Box_Shadow);color:var(--fdInput_Group_Button_Warning_Active_Text_Color)}.fd-step-input.is-warning.is-expanded .fd-step-input__button.is-hover,.fd-step-input.is-warning.is-expanded .fd-step-input__button:hover,.fd-step-input.is-warning[aria-expanded=true] .fd-step-input__button.is-hover,.fd-step-input.is-warning[aria-expanded=true] .fd-step-input__button:hover{--fdButtonBackgroundColor:var(--fdInput_Group_Button_Active_Background)}.fd-step-input.is-warning .fd-step-input__button.is-active,.fd-step-input.is-warning .fd-step-input__button.is-hover,.fd-step-input.is-warning .fd-step-input__button:active,.fd-step-input.is-warning .fd-step-input__button:hover{box-shadow:var(--fdInput_Group_Button_Warning_Active_Box_Shadow)}.fd-step-input.is-warning .fd-step-input__button.is-active,.fd-step-input.is-warning .fd-step-input__button:active{color:var(--fdInput_Group_Button_Warning_Active_Text_Color)}.fd-step-input.is-alert.is-focus,.fd-step-input.is-alert:focus{z-index:5}.fd-step-input.is-alert.is-focus .fd-step-input__button,.fd-step-input.is-alert:focus .fd-step-input__button{-webkit-box-shadow:var(--fdInput_Group_Button_Warning_Active_Box_Shadow);--fdButtonBackgroundColor:var(--fdInput_Group_Button_Active_Background);box-shadow:var(--fdInput_Group_Button_Warning_Active_Box_Shadow);color:var(--fdInput_Group_Button_Warning_Active_Text_Color)}.fd-step-input.is-alert.is-focus .fd-step-input__button.is-hover,.fd-step-input.is-alert.is-focus .fd-step-input__button:hover,.fd-step-input.is-alert:focus .fd-step-input__button.is-hover,.fd-step-input.is-alert:focus .fd-step-input__button:hover{--fdButtonBackgroundColor:var(--fdInput_Group_Button_Active_Background)}.fd-step-input.is-alert.is-expanded .fd-step-input__button,.fd-step-input.is-alert[aria-expanded=true] .fd-step-input__button{-webkit-box-shadow:var(--fdInput_Group_Button_Warning_Active_Box_Shadow);--fdButtonBackgroundColor:var(--fdInput_Group_Button_Active_Background);box-shadow:var(--fdInput_Group_Button_Warning_Active_Box_Shadow);color:var(--fdInput_Group_Button_Warning_Active_Text_Color)}.fd-step-input.is-alert.is-expanded .fd-step-input__button.is-hover,.fd-step-input.is-alert.is-expanded .fd-step-input__button:hover,.fd-step-input.is-alert[aria-expanded=true] .fd-step-input__button.is-hover,.fd-step-input.is-alert[aria-expanded=true] .fd-step-input__button:hover{--fdButtonBackgroundColor:var(--fdInput_Group_Button_Active_Background)}.fd-step-input.is-alert .fd-step-input__button.is-active,.fd-step-input.is-alert .fd-step-input__button.is-hover,.fd-step-input.is-alert .fd-step-input__button:active,.fd-step-input.is-alert .fd-step-input__button:hover{box-shadow:var(--fdInput_Group_Button_Warning_Active_Box_Shadow)}.fd-step-input.is-alert .fd-step-input__button.is-active,.fd-step-input.is-alert .fd-step-input__button:active{color:var(--fdInput_Group_Button_Warning_Active_Text_Color)}.fd-step-input.is-information.is-focus,.fd-step-input.is-information:focus{z-index:5}.fd-step-input.is-information.is-focus .fd-step-input__button,.fd-step-input.is-information:focus .fd-step-input__button{-webkit-box-shadow:var(--fdInput_Group_Button_Information_Active_Box_Shadow);--fdButtonBackgroundColor:var(--fdInput_Group_Button_Active_Background);box-shadow:var(--fdInput_Group_Button_Information_Active_Box_Shadow);color:var(--fdInput_Group_Button_Information_Active_Text_Color)}.fd-step-input.is-information.is-focus .fd-step-input__button.is-hover,.fd-step-input.is-information.is-focus .fd-step-input__button:hover,.fd-step-input.is-information:focus .fd-step-input__button.is-hover,.fd-step-input.is-information:focus .fd-step-input__button:hover{--fdButtonBackgroundColor:var(--fdInput_Group_Button_Active_Background)}.fd-step-input.is-information.is-expanded .fd-step-input__button,.fd-step-input.is-information[aria-expanded=true] .fd-step-input__button{-webkit-box-shadow:var(--fdInput_Group_Button_Information_Active_Box_Shadow);--fdButtonBackgroundColor:var(--fdInput_Group_Button_Active_Background);box-shadow:var(--fdInput_Group_Button_Information_Active_Box_Shadow);color:var(--fdInput_Group_Button_Information_Active_Text_Color)}.fd-step-input.is-information.is-expanded .fd-step-input__button.is-hover,.fd-step-input.is-information.is-expanded .fd-step-input__button:hover,.fd-step-input.is-information[aria-expanded=true] .fd-step-input__button.is-hover,.fd-step-input.is-information[aria-expanded=true] .fd-step-input__button:hover{--fdButtonBackgroundColor:var(--fdInput_Group_Button_Active_Background)}.fd-step-input.is-information .fd-step-input__button.is-active,.fd-step-input.is-information .fd-step-input__button.is-hover,.fd-step-input.is-information .fd-step-input__button:active,.fd-step-input.is-information .fd-step-input__button:hover{box-shadow:var(--fdInput_Group_Button_Information_Active_Box_Shadow)}.fd-step-input.is-information .fd-step-input__button.is-active,.fd-step-input.is-information .fd-step-input__button:active{color:var(--fdInput_Group_Button_Information_Active_Text_Color)}.fd-step-input .fd-step-input__button.fd-button{min-width:var(--fdStepInput_Button_Width);width:var(--fdStepInput_Button_Width)}.fd-step-input .fd-step-input__button.fd-button:after,.fd-step-input .fd-step-input__button.fd-button:before{font-size:.875rem;margin:0}.fd-step-input .fd-step-input__button.fd-button.is-focus,.fd-step-input .fd-step-input__button.fd-button:focus{outline:none;z-index:5}.fd-step-input .fd-step-input__button.fd-button.is-focus:after,.fd-step-input .fd-step-input__button.fd-button:focus:after{display:none}.fd-step-input .fd-step-input__button.fd-button.is-focus.is-hover,.fd-step-input .fd-step-input__button.fd-button.is-focus:hover,.fd-step-input .fd-step-input__button.fd-button:focus.is-hover,.fd-step-input .fd-step-input__button.fd-button:focus:hover{z-index:auto}.fd-step-input__input.fd-input{--fdInput_Field_Padding:0 .25rem;-webkit-box-shadow:none;background:none;background-color:transparent;border:none;box-shadow:none;margin:0;text-align:right}.fd-step-input__input.fd-input[dir=rtl],[dir=rtl] .fd-step-input__input.fd-input{text-align:left}.fd-step-input__input.fd-input.is-focus,.fd-step-input__input.fd-input.is-hover,.fd-step-input__input.fd-input:focus,.fd-step-input__input.fd-input:hover{-webkit-box-shadow:none;background:none;background-color:var(transparent, transparent);box-shadow:none}.fd-step-input__input.fd-input.is-focus,.fd-step-input__input.fd-input:focus{outline:none;z-index:5}.fd-step-input__container{align-items:center;display:flex}.fd-step-input.is-error .fd-step-input__button.fd-button,.fd-step-input.is-information .fd-step-input__button.fd-button,.fd-step-input.is-warning .fd-step-input__button.fd-button{min-width:var(--fdStepInput_Button_Width_Semantic_Cozy);width:var(--fdStepInput_Button_Width_Semantic_Cozy)}.fd-step-input[class*=-compact],.fd-step-input[class*=-condensed],[class*=-compact] .fd-step-input:not([class*=-cozy]),[class*=-condensed] .fd-step-input:not([class*=-cozy]){--fdStepInput_Button_Width:var(--fdStepInput_Button_Width_Compact);--fdStepInput_Bordered_Button_Width:var(--fdStepInput_Button_Width_Semantic_Compact);--fdInput_Field_Compact_Padding:0 .25rem;height:1.625rem;min-height:1.625rem}.fd-step-input[class*=-compact] .fd-step-input__input.fd-input,.fd-step-input[class*=-condensed] .fd-step-input__input.fd-input,[class*=-compact] .fd-step-input:not([class*=-cozy]) .fd-step-input__input.fd-input,[class*=-condensed] .fd-step-input:not([class*=-cozy]) .fd-step-input__input.fd-input{height:100%}.fd-step-input[class*=-compact].is-readonly,.fd-step-input[class*=-condensed].is-readonly,[class*=-compact] .fd-step-input:not([class*=-cozy]).is-readonly,[class*=-condensed] .fd-step-input:not([class*=-cozy]).is-readonly{--fdInput_Field_Compact_Padding:0 .5rem}.fd-step-input.is-readonly .fd-step-input__input.fd-input{--fdInput_Field_Padding:0 .625rem}.fd-step-input.is-readonly .fd-step-input__button.fd-button{display:none}.fd-step-input.is-readonly:focus-within{border-radius:var(--sapField_BorderCornerRadius)}.fd-step-input.is-readonly:focus-within .fd-step-input__input{background:transparent}.fd-step-input.is-focus,.fd-step-input:focus{z-index:5}.fd-step-input.is-focus.is-error .fd-step-input__button.fd-button:not(:hover),.fd-step-input.is-focus.is-information .fd-step-input__button.fd-button:not(:hover),.fd-step-input.is-focus.is-success .fd-step-input__button.fd-button:not(:hover),.fd-step-input.is-focus.is-warning .fd-step-input__button.fd-button:not(:hover),.fd-step-input:focus.is-error .fd-step-input__button.fd-button:not(:hover),.fd-step-input:focus.is-information .fd-step-input__button.fd-button:not(:hover),.fd-step-input:focus.is-success .fd-step-input__button.fd-button:not(:hover),.fd-step-input:focus.is-warning .fd-step-input__button.fd-button:not(:hover){box-shadow:none}.fd-step-input{display:flex}\n"], dependencies: [{ kind: "directive", type: i3.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: i5$3.ButtonComponent, selector: "button[fd-button], a[fd-button]", inputs: ["class"], exportAs: ["fd-button"] }, { kind: "directive", type: i3$2.OnlyDigitsDirective, selector: "[fdkOnlyDigits]", inputs: ["decimal", "decimalSeparator"] }, { kind: "component", type: i4.FormInputMessageGroupComponent, selector: "fd-form-input-message-group", inputs: ["triggers", "closeOnOutsideClick", "fillControlMode", "noArrow", "closeOnEscapeKey", "placement", "placementContainer", "isOpen"], outputs: ["isOpenChange"] }, { kind: "component", type: i4.FormMessageComponent, selector: "fd-form-message", inputs: ["type", "static", "embedded", "class"] }, { kind: "directive", type: StepInputDecrementDirective, selector: "[fdpStepInputDecrement]" }, { kind: "directive", type: StepInputIncrementDirective, selector: "[fdpStepInputIncrement]" }, { kind: "directive", type: StepInputControlDirective, selector: "[fdpStepInputControl]" }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
+        ], usesInheritance: true, ngImport: i0, template: "<fd-form-input-message-group>\n    <div\n        class=\"fd-step-input\"\n        [class.is-focus]=\"focused\"\n        [class.is-readonly]=\"!editable\"\n        [class.is-disabled]=\"disabled\"\n        [class.fd-step-input--without-buttons]=\"showLabels\"\n        [class]=\"state ? 'is-' + state : ''\"\n    >\n        <button\n            class=\"fd-step-input__button\"\n            tabindex=\"-1\"\n            type=\"button\"\n            fd-button\n            fdType=\"transparent\"\n            [glyph]=\"showLabels ? null : 'less'\"\n            fdpStepInputDecrement\n            [attr.aria-disabled]=\"disabled || !canDecrement\"\n            [attr.title]=\"decrementLabel\"\n            [attr.aria-label]=\"decrementLabel\"\n            [attr.aria-controls]=\"id\"\n        >\n            {{ showLabels ? decrementLabel : '' }}\n        </button>\n        <input\n            #inputElementRef\n            class=\"fd-input fd-input--no-number-spinner fd-step-input__input\"\n            [id]=\"id\"\n            [name]=\"name\"\n            [disabled]=\"disabled\"\n            [readonly]=\"!editable\"\n            [attr.placeholder]=\"placeholder || ''\"\n            [attr.aria-label]=\"ariaLabel\"\n            [attr.aria-labelledby]=\"ariaLabelledBy\"\n            [attr.aria-describedby]=\"description ? id + '__description' : ''\"\n            [attr.aria-required]=\"required\"\n            [style.textAlign]=\"_align\"\n            fdpStepInputControl\n            type=\"text\"\n            inputmode=\"numeric\"\n            fdkOnlyDigits\n            [decimal]=\"true\"\n        />\n        <button\n            class=\"fd-step-input__button\"\n            tabindex=\"-1\"\n            type=\"button\"\n            fd-button\n            fdType=\"transparent\"\n            [glyph]=\"showLabels ? null : 'add'\"\n            fdpStepInputIncrement\n            [attr.aria-disabled]=\"disabled || !canIncrement\"\n            [attr.title]=\"incrementLabel\"\n            [attr.aria-label]=\"incrementLabel\"\n            [attr.aria-controls]=\"id\"\n        >\n            {{ showLabels ? incrementLabel : '' }}\n        </button>\n    </div>\n    <fd-form-message *ngIf=\"stateMessage\" [type]=\"state\" [innerHTML]=\"stateMessage\"></fd-form-message>\n</fd-form-input-message-group>\n<span *ngIf=\"description\" [id]=\"id + '__description'\" class=\"fd-form-label fd-form-label--unit-description\">\n    {{ description }}\n</span>\n", styles: [".fd-input{-webkit-box-sizing:border-box;-webkit-box-shadow:var(--sapField_Shadow);-webkit-appearance:none;appearance:none;background:var(--sapField_BackgroundStyle, var(--sapField_BackgroundStyle));background-color:var(--sapField_Background, var(--sapField_Background));border:0;border:var(--sapField_BorderWidth) var(--sapField_BorderStyle) var(--sapField_BorderColor);border-radius:var(--sapField_BorderCornerRadius);box-shadow:var(--sapField_Shadow);box-sizing:border-box;color:var(--sapTextColor);color:var(--sapField_TextColor);cursor:text;font-family:var(--sapFontFamily);font-size:var(--sapFontSize);font-weight:400;forced-color-adjust:none;height:var(--sapElement_Height);line-height:var(--sapContent_LineHeight);margin:0;margin:var(--fdInput_Field_Margin, .25rem 0);min-height:var(--sapElement_Height);min-width:var(2.75rem, 2.75rem);outline:none;overflow:hidden;padding:0;padding:var(--fdInput_Field_Padding, 0 .625rem);text-overflow:ellipsis;text-shadow:var(--fdInput_Text_Shadow);white-space:nowrap;width:100%;z-index:1}.fd-input:after,.fd-input:before{box-sizing:inherit;font-size:inherit}.fd-input::placeholder{color:var(--sapField_PlaceholderTextColor);font-style:var(--fdPlaceholder_Font_Style)}.fd-input[dir=rtl]::placeholder,[dir=rtl] .fd-input::placeholder{text-indent:.125rem}.fd-input::selection{background-color:var(--sapSelectedColor);color:var(--sapContent_ContrastTextColor)}.fd-input::-ms-clear{display:none}.fd-input.is-hover,.fd-input:hover{-webkit-box-shadow:var(--fdInput_Box_Shadow_Hover);background:var(--sapField_Hover_BackgroundStyle, var(--sapField_Hover_BackgroundStyle));background-color:var(--sapField_Hover_Background, var(--sapField_Hover_Background));border-color:var(--sapField_Hover_BorderColor);box-shadow:var(--fdInput_Box_Shadow_Hover)}.fd-input.is-focus,.fd-input:focus{-webkit-box-shadow:none;background:var(--sapField_Focus_Background, var(--sapField_Focus_Background));box-shadow:none;outline-color:var(--fdInput_Outline_Color);outline-offset:var(--fdInput_Outline_Offset);outline-style:var(--sapContent_FocusStyle);outline-width:var(--sapContent_FocusWidth);z-index:5}.fd-input[type=search]::-webkit-search-cancel-button,.fd-input[type=search]::-webkit-search-decoration,.fd-input[type=search]::-webkit-search-results-button,.fd-input[type=search]::-webkit-search-results-decoration{-webkit-appearance:none}.fd-input[aria-expanded=false]{z-index:0}.fd-input.is-expanded,.fd-input[aria-expanded=true]{z-index:4}.fd-input[class*=-compact],.fd-input[class*=-condensed],[class*=-compact] .fd-input:not([class*=-cozy]),[class*=-condensed] .fd-input:not([class*=-cozy]){box-sizing:border-box;height:var(--sapElement_Compact_Height);margin:var(--fdInput_Field_Compact_Margin, .1875rem 0);min-height:var(--sapElement_Compact_Height);min-width:var(--fdInput_Field_Compact_Min_Width, 2rem);padding:var(--fdInput_Field_Compact_Padding, 0 .5rem)}.fd-input--no-number-spinner{-moz-appearance:textfield}.fd-input--no-number-spinner::-webkit-inner-spin-button,.fd-input--no-number-spinner::-webkit-outer-spin-button{-webkit-appearance:none;margin:0}.fd-input.right-align{text-align:right}.fd-input.is-success{-webkit-box-shadow:var(--sapField_SuccessShadow);background:var(--sapField_SuccessBackgroundStyle);background-color:var(--sapField_SuccessBackground);border:var(--sapField_SuccessColor) var(--sapField_SuccessBorderWidth) var(--sapField_SuccessBorderStyle);box-shadow:var(--sapField_SuccessShadow)}.fd-input.is-success.is-hover,.fd-input.is-success:hover{-webkit-box-shadow:var(--fdInput_Success_Box_Shadow_Hover);background-color:var(--fdInput_Success_Background_Color_Hover);border-color:var(--sapField_SuccessColor);box-shadow:var(--fdInput_Success_Box_Shadow_Hover)}.fd-input.is-success.is-focus,.fd-input.is-success:focus{background:var(--sapField_Focus_Background);outline-color:var(--fdInput_Success_Outline_Color);z-index:5}.fd-input.is-success.is-focus.is-hover,.fd-input.is-success.is-focus:hover,.fd-input.is-success:focus.is-hover,.fd-input.is-success:focus:hover{box-shadow:none}.fd-input.is-success.is-expanded,.fd-input.is-success[aria-expanded=true]{-webkit-box-shadow:none;background:var(--sapField_Focus_Background);box-shadow:none;outline:var(--sapContent_FocusWidth) var(--sapContent_FocusStyle) var(--fdInput_Success_Outline_Color);outline-offset:var(--fdInput_Outline_Offset)}.fd-input.is-error{-webkit-box-shadow:var(--sapField_InvalidShadow);background:var(--sapField_InvalidBackgroundStyle);background-color:var(--sapField_InvalidBackground);border:var(--sapField_InvalidColor) var(--sapField_InvalidBorderWidth) var(--sapField_InvalidBorderStyle);box-shadow:var(--sapField_InvalidShadow)}.fd-input.is-error.is-hover,.fd-input.is-error:hover{-webkit-box-shadow:var(--fdInput_Error_Box_Shadow_Hover);background-color:var(--fdInput_Error_Background_Color_Hover);border-color:var(--sapField_InvalidColor);box-shadow:var(--fdInput_Error_Box_Shadow_Hover)}.fd-input.is-error.is-focus,.fd-input.is-error:focus{background:var(--sapField_Focus_Background);outline-color:var(--fdInput_Error_Outline_Color);z-index:5}.fd-input.is-error.is-focus.is-hover,.fd-input.is-error.is-focus:hover,.fd-input.is-error:focus.is-hover,.fd-input.is-error:focus:hover{box-shadow:none}.fd-input.is-error.is-expanded,.fd-input.is-error[aria-expanded=true]{-webkit-box-shadow:none;background:var(--sapField_Focus_Background);box-shadow:none;outline:var(--sapContent_FocusWidth) var(--sapContent_FocusStyle) var(--fdInput_Error_Outline_Color);outline-offset:var(--fdInput_Outline_Offset)}.fd-input.is-warning{-webkit-box-shadow:var(--sapField_WarningShadow);background:var(--sapField_WarningBackgroundStyle);background-color:var(--sapField_WarningBackground);border:var(--sapField_WarningColor) var(--sapField_WarningBorderWidth) var(--sapField_WarningBorderStyle);box-shadow:var(--sapField_WarningShadow)}.fd-input.is-warning.is-hover,.fd-input.is-warning:hover{-webkit-box-shadow:var(--fdInput_Warning_Box_Shadow_Hover);background-color:var(--fdInput_Warning_Background_Color_Hover);border-color:var(--sapField_WarningColor);box-shadow:var(--fdInput_Warning_Box_Shadow_Hover)}.fd-input.is-warning.is-focus,.fd-input.is-warning:focus{background:var(--sapField_Focus_Background);outline-color:var(--fdInput_Warning_Outline_Color);z-index:5}.fd-input.is-warning.is-focus.is-hover,.fd-input.is-warning.is-focus:hover,.fd-input.is-warning:focus.is-hover,.fd-input.is-warning:focus:hover{box-shadow:none}.fd-input.is-warning.is-expanded,.fd-input.is-warning[aria-expanded=true]{-webkit-box-shadow:none;background:var(--sapField_Focus_Background);box-shadow:none;outline:var(--sapContent_FocusWidth) var(--sapContent_FocusStyle) var(--fdInput_Warning_Outline_Color);outline-offset:var(--fdInput_Outline_Offset)}.fd-input.is-alert{background:var(--sapField_WarningBackgroundStyle);background-color:var(--sapField_WarningBackground);border:var(--sapField_WarningColor) var(--sapField_WarningBorderWidth) var(--sapField_WarningBorderStyle)}.fd-input.is-alert.is-hover,.fd-input.is-alert:hover{-webkit-box-shadow:var(--fdInput_Warning_Box_Shadow_Hover);background-color:var(--fdInput_Warning_Background_Color_Hover);border-color:var(--sapField_WarningColor);box-shadow:var(--fdInput_Warning_Box_Shadow_Hover)}.fd-input.is-alert.is-focus,.fd-input.is-alert:focus{background:var(--sapField_Focus_Background);outline-color:var(--fdInput_Warning_Outline_Color);z-index:5}.fd-input.is-alert.is-focus.is-hover,.fd-input.is-alert.is-focus:hover,.fd-input.is-alert:focus.is-hover,.fd-input.is-alert:focus:hover{box-shadow:none}.fd-input.is-alert.is-expanded,.fd-input.is-alert[aria-expanded=true]{-webkit-box-shadow:none;background:var(--sapField_Focus_Background);box-shadow:none;outline:var(--sapContent_FocusWidth) var(--sapContent_FocusStyle) var(--fdInput_Warning_Outline_Color);outline-offset:var(--fdInput_Outline_Offset)}.fd-input.is-information{-webkit-box-shadow:var(--sapField_InformationShadow);background:var(--sapField_InformationBackgroundStyle);background-color:var(--sapField_InformationBackground);border:var(--sapField_InformationColor) var(--sapField_InformationBorderWidth) var(--sapField_InformationBorderStyle);box-shadow:var(--sapField_InformationShadow)}.fd-input.is-information.is-hover,.fd-input.is-information:hover{-webkit-box-shadow:var(--fdInput_Information_Box_Shadow_Hover);background-color:var(--fdInput_Information_Background_Color_Hover);border-color:var(--sapField_InformationColor);box-shadow:var(--fdInput_Information_Box_Shadow_Hover)}.fd-input.is-information.is-focus,.fd-input.is-information:focus{background:var(--sapField_Focus_Background);outline-color:var(--fdInput_Information_Outline_Color);z-index:5}.fd-input.is-information.is-focus.is-hover,.fd-input.is-information.is-focus:hover,.fd-input.is-information:focus.is-hover,.fd-input.is-information:focus:hover{box-shadow:none}.fd-input.is-information.is-expanded,.fd-input.is-information[aria-expanded=true]{-webkit-box-shadow:none;background:var(--sapField_Focus_Background);box-shadow:none;outline:var(--sapContent_FocusWidth) var(--sapContent_FocusStyle) var(--fdInput_Information_Outline_Color);outline-offset:var(--fdInput_Outline_Offset)}.fd-input.is-alert,.fd-input.is-error,.fd-input.is-warning{font-style:var(--fdInput_State_Text_Style);font-weight:var(--fdInput_State_Font_Weight)}.fd-input.is-alert::placeholder,.fd-input.is-error::placeholder,.fd-input.is-warning::placeholder{font-weight:var(--fdInput_State_Font_Weight)}.fd-input.is-alert.is-focus,.fd-input.is-alert:focus,.fd-input.is-error.is-focus,.fd-input.is-error:focus,.fd-input.is-information.is-focus,.fd-input.is-information:focus,.fd-input.is-warning.is-focus,.fd-input.is-warning:focus{outline-offset:var(--fdInput_Outline_Offset_States);z-index:5}.fd-input.is-error::placeholder{color:var(--sapField_TextColor)}.fd-input.is-disabled,.fd-input:disabled,.fd-input[aria-disabled=true]{opacity:var(--sapContent_DisabledOpacity);pointer-events:none}.fd-input.is-disabled::placeholder,.fd-input:disabled::placeholder,.fd-input[aria-disabled=true]::placeholder{color:var(--fdInput_Non_Interactive_State_Placeholder_Color)}.fd-input.is-readonly,.fd-input[aria-readonly=true],.fd-input[readonly]{-webkit-box-shadow:none;background:var(--sapField_ReadOnly_BackgroundStyle);background-color:var(--sapField_ReadOnly_Background);border-color:var(--sapField_ReadOnly_BorderColor);box-shadow:none}.fd-input.is-readonly::placeholder,.fd-input[aria-readonly=true]::placeholder,.fd-input[readonly]::placeholder{color:var(--fdInput_Non_Interactive_State_Placeholder_Color)}.fd-input.is-readonly.is-focus,.fd-input.is-readonly.is-hover,.fd-input.is-readonly:focus,.fd-input.is-readonly:hover,.fd-input[aria-readonly=true].is-focus,.fd-input[aria-readonly=true].is-hover,.fd-input[aria-readonly=true]:focus,.fd-input[aria-readonly=true]:hover,.fd-input[readonly].is-focus,.fd-input[readonly].is-hover,.fd-input[readonly]:focus,.fd-input[readonly]:hover{-webkit-box-shadow:none;background:var(--sapField_ReadOnly_BackgroundStyle);background-color:var(--sapField_ReadOnly_Background);border-color:var(--sapField_ReadOnly_BorderColor);box-shadow:none}.fd-input.is-readonly.is-focus,.fd-input.is-readonly:focus,.fd-input[aria-readonly=true].is-focus,.fd-input[aria-readonly=true]:focus,.fd-input[readonly].is-focus,.fd-input[readonly]:focus{z-index:5}/*!\n * Fundamental Library Styles v0.30.2-rc.6\n * Copyright (c) 2023 SAP SE or an SAP affiliate company.\n * Licensed under Apache License 2.0 (https://github.com/SAP/fundamental-styles/blob/main/LICENSE)\n */.fd-step-input{--fdStepInput_Button_Width:var(--fdStepInput_Button_Width_Cozy);--fdStepInput_Bordered_Button_Width:var(--fdStepInput_Button_Width_Semantic_Cozy);-webkit-box-sizing:border-box;-webkit-box-shadow:var(--sapField_Shadow);-moz-appearance:none;-webkit-appearance:none;align-items:center;appearance:none;background:var(--sapField_BackgroundStyle, var(--sapField_BackgroundStyle));background-color:var(--sapField_Background, var(--sapField_Background));border:0;border:var(--sapField_BorderWidth) var(--sapField_BorderStyle) var(--sapField_BorderColor);border-radius:var(--sapField_BorderCornerRadius);box-shadow:var(--sapField_Shadow);box-sizing:border-box;color:var(--sapTextColor);color:var(--sapField_TextColor);cursor:text;display:inline-flex;font-family:var(--sapFontFamily);font-size:var(--sapFontSize);font-weight:400;forced-color-adjust:none;height:var(--sapElement_Height);line-height:var(--sapContent_LineHeight);margin:0;margin:var(--fdInput_Field_Margin, .25rem 0);min-height:var(--sapElement_Height);min-width:var(2.75rem, 2.75rem);outline:none;overflow:hidden;padding:0;position:relative;text-overflow:ellipsis;text-shadow:var(--fdInput_Text_Shadow);white-space:nowrap;width:100%;width:auto;z-index:1}.fd-step-input:after,.fd-step-input:before{box-sizing:inherit;font-size:inherit}.fd-step-input::placeholder{color:var(--sapField_PlaceholderTextColor);font-style:var(--fdPlaceholder_Font_Style)}.fd-step-input[dir=rtl]::placeholder,[dir=rtl] .fd-step-input::placeholder{text-indent:.125rem}.fd-step-input::selection{background-color:var(--sapSelectedColor);color:var(--sapContent_ContrastTextColor)}.fd-step-input::-ms-clear{display:none}.fd-step-input.is-hover,.fd-step-input:hover{-webkit-box-shadow:var(--fdInput_Box_Shadow_Hover);background:var(--sapField_Hover_BackgroundStyle, var(--sapField_Hover_BackgroundStyle));background-color:var(--sapField_Hover_Background, var(--sapField_Hover_Background));border-color:var(--sapField_Hover_BorderColor);box-shadow:var(--fdInput_Box_Shadow_Hover)}.fd-step-input.is-focus,.fd-step-input:focus{-webkit-box-shadow:none;background:var(--sapField_Focus_Background, var(--sapField_Focus_Background));box-shadow:none;outline-color:var(--fdInput_Outline_Color);outline-offset:var(--fdInput_Outline_Offset);outline-style:var(--sapContent_FocusStyle);outline-width:var(--sapContent_FocusWidth)}.fd-step-input:focus-within{-webkit-box-shadow:none;background:var(--sapField_Focus_Background, var(--sapField_Focus_Background));box-shadow:none;outline-color:var(--fdInput_Outline_Color);outline-offset:var(--fdInput_Outline_Offset_Focus_Within);outline-style:var(--sapContent_FocusStyle);outline-width:var(--sapContent_FocusWidth)}.fd-step-input.is-success{-webkit-box-shadow:var(--sapField_SuccessShadow);background:var(--sapField_SuccessBackgroundStyle);background-color:var(--sapField_SuccessBackground);border:var(--sapField_SuccessColor) var(--sapField_SuccessBorderWidth) var(--sapField_SuccessBorderStyle);box-shadow:var(--sapField_SuccessShadow)}.fd-step-input.is-success.is-hover,.fd-step-input.is-success:hover{-webkit-box-shadow:var(--fdInput_Success_Box_Shadow_Hover);background-color:var(--fdInput_Success_Background_Color_Hover);border-color:var(--sapField_SuccessColor);box-shadow:var(--fdInput_Success_Box_Shadow_Hover)}.fd-step-input.is-success.is-focus,.fd-step-input.is-success:focus{background:var(--sapField_Focus_Background);outline-color:var(--fdInput_Success_Outline_Color)}.fd-step-input.is-success.is-focus.is-hover,.fd-step-input.is-success.is-focus:hover,.fd-step-input.is-success:focus.is-hover,.fd-step-input.is-success:focus:hover{box-shadow:none}.fd-step-input.is-success:focus-within{background:var(--sapField_Focus_Background);outline-color:var(--fdInput_Success_Outline_Color)}.fd-step-input.is-success:focus-within.is-hover,.fd-step-input.is-success:focus-within:hover{box-shadow:none}.fd-step-input.is-success.is-expanded,.fd-step-input.is-success[aria-expanded=true]{-webkit-box-shadow:none;background:var(--sapField_Focus_Background);box-shadow:none;outline:var(--sapContent_FocusWidth) var(--sapContent_FocusStyle) var(--fdInput_Success_Outline_Color);outline-offset:var(--fdInput_Outline_Offset)}.fd-step-input.is-error{-webkit-box-shadow:var(--sapField_InvalidShadow);background:var(--sapField_InvalidBackgroundStyle);background-color:var(--sapField_InvalidBackground);border:var(--sapField_InvalidColor) var(--sapField_InvalidBorderWidth) var(--sapField_InvalidBorderStyle);box-shadow:var(--sapField_InvalidShadow)}.fd-step-input.is-error.is-hover,.fd-step-input.is-error:hover{-webkit-box-shadow:var(--fdInput_Error_Box_Shadow_Hover);background-color:var(--fdInput_Error_Background_Color_Hover);border-color:var(--sapField_InvalidColor);box-shadow:var(--fdInput_Error_Box_Shadow_Hover)}.fd-step-input.is-error.is-focus,.fd-step-input.is-error:focus{background:var(--sapField_Focus_Background);outline-color:var(--fdInput_Error_Outline_Color)}.fd-step-input.is-error.is-focus.is-hover,.fd-step-input.is-error.is-focus:hover,.fd-step-input.is-error:focus.is-hover,.fd-step-input.is-error:focus:hover{box-shadow:none}.fd-step-input.is-error:focus-within{background:var(--sapField_Focus_Background);outline-color:var(--fdInput_Error_Outline_Color)}.fd-step-input.is-error:focus-within.is-hover,.fd-step-input.is-error:focus-within:hover{box-shadow:none}.fd-step-input.is-error.is-expanded,.fd-step-input.is-error[aria-expanded=true]{-webkit-box-shadow:none;background:var(--sapField_Focus_Background);box-shadow:none;outline:var(--sapContent_FocusWidth) var(--sapContent_FocusStyle) var(--fdInput_Error_Outline_Color);outline-offset:var(--fdInput_Outline_Offset)}.fd-step-input.is-warning{-webkit-box-shadow:var(--sapField_WarningShadow);background:var(--sapField_WarningBackgroundStyle);background-color:var(--sapField_WarningBackground);border:var(--sapField_WarningColor) var(--sapField_WarningBorderWidth) var(--sapField_WarningBorderStyle);box-shadow:var(--sapField_WarningShadow)}.fd-step-input.is-warning.is-hover,.fd-step-input.is-warning:hover{-webkit-box-shadow:var(--fdInput_Warning_Box_Shadow_Hover);background-color:var(--fdInput_Warning_Background_Color_Hover);border-color:var(--sapField_WarningColor);box-shadow:var(--fdInput_Warning_Box_Shadow_Hover)}.fd-step-input.is-warning.is-focus,.fd-step-input.is-warning:focus{background:var(--sapField_Focus_Background);outline-color:var(--fdInput_Warning_Outline_Color)}.fd-step-input.is-warning.is-focus.is-hover,.fd-step-input.is-warning.is-focus:hover,.fd-step-input.is-warning:focus.is-hover,.fd-step-input.is-warning:focus:hover{box-shadow:none}.fd-step-input.is-warning:focus-within{background:var(--sapField_Focus_Background);outline-color:var(--fdInput_Warning_Outline_Color)}.fd-step-input.is-warning:focus-within.is-hover,.fd-step-input.is-warning:focus-within:hover{box-shadow:none}.fd-step-input.is-warning.is-expanded,.fd-step-input.is-warning[aria-expanded=true]{-webkit-box-shadow:none;background:var(--sapField_Focus_Background);box-shadow:none;outline:var(--sapContent_FocusWidth) var(--sapContent_FocusStyle) var(--fdInput_Warning_Outline_Color);outline-offset:var(--fdInput_Outline_Offset)}.fd-step-input.is-alert{background:var(--sapField_WarningBackgroundStyle);background-color:var(--sapField_WarningBackground);border:var(--sapField_WarningColor) var(--sapField_WarningBorderWidth) var(--sapField_WarningBorderStyle)}.fd-step-input.is-alert.is-hover,.fd-step-input.is-alert:hover{-webkit-box-shadow:var(--fdInput_Warning_Box_Shadow_Hover);background-color:var(--fdInput_Warning_Background_Color_Hover);border-color:var(--sapField_WarningColor);box-shadow:var(--fdInput_Warning_Box_Shadow_Hover)}.fd-step-input.is-alert.is-focus,.fd-step-input.is-alert:focus{background:var(--sapField_Focus_Background);outline-color:var(--fdInput_Warning_Outline_Color)}.fd-step-input.is-alert.is-focus.is-hover,.fd-step-input.is-alert.is-focus:hover,.fd-step-input.is-alert:focus.is-hover,.fd-step-input.is-alert:focus:hover{box-shadow:none}.fd-step-input.is-alert:focus-within{background:var(--sapField_Focus_Background);outline-color:var(--fdInput_Warning_Outline_Color)}.fd-step-input.is-alert:focus-within.is-hover,.fd-step-input.is-alert:focus-within:hover{box-shadow:none}.fd-step-input.is-alert.is-expanded,.fd-step-input.is-alert[aria-expanded=true]{-webkit-box-shadow:none;background:var(--sapField_Focus_Background);box-shadow:none;outline:var(--sapContent_FocusWidth) var(--sapContent_FocusStyle) var(--fdInput_Warning_Outline_Color);outline-offset:var(--fdInput_Outline_Offset)}.fd-step-input.is-information{-webkit-box-shadow:var(--sapField_InformationShadow);background:var(--sapField_InformationBackgroundStyle);background-color:var(--sapField_InformationBackground);border:var(--sapField_InformationColor) var(--sapField_InformationBorderWidth) var(--sapField_InformationBorderStyle);box-shadow:var(--sapField_InformationShadow)}.fd-step-input.is-information.is-hover,.fd-step-input.is-information:hover{-webkit-box-shadow:var(--fdInput_Information_Box_Shadow_Hover);background-color:var(--fdInput_Information_Background_Color_Hover);border-color:var(--sapField_InformationColor);box-shadow:var(--fdInput_Information_Box_Shadow_Hover)}.fd-step-input.is-information.is-focus,.fd-step-input.is-information:focus{background:var(--sapField_Focus_Background);outline-color:var(--fdInput_Information_Outline_Color)}.fd-step-input.is-information.is-focus.is-hover,.fd-step-input.is-information.is-focus:hover,.fd-step-input.is-information:focus.is-hover,.fd-step-input.is-information:focus:hover{box-shadow:none}.fd-step-input.is-information:focus-within{background:var(--sapField_Focus_Background);outline-color:var(--fdInput_Information_Outline_Color)}.fd-step-input.is-information:focus-within.is-hover,.fd-step-input.is-information:focus-within:hover{box-shadow:none}.fd-step-input.is-information.is-expanded,.fd-step-input.is-information[aria-expanded=true]{-webkit-box-shadow:none;background:var(--sapField_Focus_Background);box-shadow:none;outline:var(--sapContent_FocusWidth) var(--sapContent_FocusStyle) var(--fdInput_Information_Outline_Color);outline-offset:var(--fdInput_Outline_Offset)}.fd-step-input.is-alert,.fd-step-input.is-error,.fd-step-input.is-warning{font-style:var(--fdInput_State_Text_Style);font-weight:var(--fdInput_State_Font_Weight)}.fd-step-input.is-alert::placeholder,.fd-step-input.is-error::placeholder,.fd-step-input.is-warning::placeholder{font-weight:var(--fdInput_State_Font_Weight)}.fd-step-input.is-alert.is-focus,.fd-step-input.is-alert:focus,.fd-step-input.is-error.is-focus,.fd-step-input.is-error:focus,.fd-step-input.is-information.is-focus,.fd-step-input.is-information:focus,.fd-step-input.is-warning.is-focus,.fd-step-input.is-warning:focus{outline-offset:var(--fdInput_Outline_Offset_States);z-index:5}.fd-step-input.is-error::placeholder{color:var(--sapField_TextColor)}.fd-step-input.is-disabled,.fd-step-input:disabled,.fd-step-input[aria-disabled=true]{opacity:var(--sapContent_DisabledOpacity);pointer-events:none}.fd-step-input.is-disabled::placeholder,.fd-step-input:disabled::placeholder,.fd-step-input[aria-disabled=true]::placeholder{color:var(--fdInput_Non_Interactive_State_Placeholder_Color)}.fd-step-input.is-readonly,.fd-step-input[aria-readonly=true],.fd-step-input[readonly]{-webkit-box-shadow:none;background:var(--sapField_ReadOnly_BackgroundStyle);background-color:var(--sapField_ReadOnly_Background);border-color:var(--sapField_ReadOnly_BorderColor);box-shadow:none}.fd-step-input.is-readonly::placeholder,.fd-step-input[aria-readonly=true]::placeholder,.fd-step-input[readonly]::placeholder{color:var(--fdInput_Non_Interactive_State_Placeholder_Color)}.fd-step-input.is-readonly.is-hover,.fd-step-input.is-readonly:hover,.fd-step-input[aria-readonly=true].is-hover,.fd-step-input[aria-readonly=true]:hover,.fd-step-input[readonly].is-hover,.fd-step-input[readonly]:hover{-webkit-box-shadow:none;background:var(--sapField_ReadOnly_BackgroundStyle);background-color:var(--sapField_ReadOnly_Background);border-color:var(--sapField_ReadOnly_BorderColor);box-shadow:none}.fd-step-input.is-readonly.is-focus,.fd-step-input.is-readonly:focus,.fd-step-input[aria-readonly=true].is-focus,.fd-step-input[aria-readonly=true]:focus,.fd-step-input[readonly].is-focus,.fd-step-input[readonly]:focus{-webkit-box-shadow:none;background:var(--sapField_ReadOnly_BackgroundStyle);background-color:var(--sapField_ReadOnly_Background);border-color:var(--sapField_ReadOnly_BorderColor);box-shadow:none;z-index:5}.fd-step-input .fd-step-input__button:first-child{border-right:var(--fdInputGroup_ControlButton_SideBorder)}.fd-step-input .fd-step-input__button:first-child[dir=rtl],[dir=rtl] .fd-step-input .fd-step-input__button:first-child{border-left:var(--fdInputGroup_ControlButton_SideBorder);border-right-style:none}.fd-step-input .fd-step-input__button:first-child.is-hover,.fd-step-input .fd-step-input__button:first-child:hover{border-right:var(--fdInputGroup_ControlButton_SideBorder_Active)}.fd-step-input .fd-step-input__button:first-child.is-hover[dir=rtl],.fd-step-input .fd-step-input__button:first-child:hover[dir=rtl],[dir=rtl] .fd-step-input .fd-step-input__button:first-child.is-hover,[dir=rtl] .fd-step-input .fd-step-input__button:first-child:hover{border-left:var(--fdInputGroup_ControlButton_SideBorder_Active);border-right-style:none}.fd-step-input .fd-step-input__button:first-child.is-active,.fd-step-input .fd-step-input__button:first-child:active{border-right:var(--fdInputGroup_ControlButton_SideBorder_Active)}.fd-step-input .fd-step-input__button:first-child.is-active[dir=rtl],.fd-step-input .fd-step-input__button:first-child:active[dir=rtl],[dir=rtl] .fd-step-input .fd-step-input__button:first-child.is-active,[dir=rtl] .fd-step-input .fd-step-input__button:first-child:active{border-left:var(--fdInputGroup_ControlButton_SideBorder_Active);border-right-style:none}.fd-step-input .fd-step-input__button:not(:first-child){border-left:var(--fdInputGroup_ControlButton_SideBorder)}.fd-step-input .fd-step-input__button:not(:first-child)[dir=rtl],[dir=rtl] .fd-step-input .fd-step-input__button:not(:first-child){border-left-style:none;border-right:var(--fdInputGroup_ControlButton_SideBorder)}.fd-step-input .fd-step-input__button:not(:first-child).is-hover,.fd-step-input .fd-step-input__button:not(:first-child):hover{border-left:var(--fdInputGroup_ControlButton_SideBorder_Active)}.fd-step-input .fd-step-input__button:not(:first-child).is-hover[dir=rtl],.fd-step-input .fd-step-input__button:not(:first-child):hover[dir=rtl],[dir=rtl] .fd-step-input .fd-step-input__button:not(:first-child).is-hover,[dir=rtl] .fd-step-input .fd-step-input__button:not(:first-child):hover{border-left-style:none;border-right:var(--fdInputGroup_ControlButton_SideBorder_Active)}.fd-step-input .fd-step-input__button:not(:first-child).is-active,.fd-step-input .fd-step-input__button:not(:first-child):active{border-left:var(--fdInputGroup_ControlButton_SideBorder_Active)}.fd-step-input .fd-step-input__button:not(:first-child).is-active[dir=rtl],.fd-step-input .fd-step-input__button:not(:first-child):active[dir=rtl],[dir=rtl] .fd-step-input .fd-step-input__button:not(:first-child).is-active,[dir=rtl] .fd-step-input .fd-step-input__button:not(:first-child):active{border-left-style:none;border-right:var(--fdInputGroup_ControlButton_SideBorder_Active)}.fd-step-input .fd-step-input__addon:first-child .fd-step-input__button{border-right:var(--fdInputGroup_ControlButton_SideBorder)}.fd-step-input .fd-step-input__addon:first-child .fd-step-input__button[dir=rtl],[dir=rtl] .fd-step-input .fd-step-input__addon:first-child .fd-step-input__button{border-left:var(--fdInputGroup_ControlButton_SideBorder);border-right-style:none}.fd-step-input .fd-step-input__addon:first-child .fd-step-input__button.is-hover,.fd-step-input .fd-step-input__addon:first-child .fd-step-input__button:hover{border-right:var(--fdInputGroup_ControlButton_SideBorder_Active)}.fd-step-input .fd-step-input__addon:first-child .fd-step-input__button.is-hover[dir=rtl],.fd-step-input .fd-step-input__addon:first-child .fd-step-input__button:hover[dir=rtl],[dir=rtl] .fd-step-input .fd-step-input__addon:first-child .fd-step-input__button.is-hover,[dir=rtl] .fd-step-input .fd-step-input__addon:first-child .fd-step-input__button:hover{border-left:var(--fdInputGroup_ControlButton_SideBorder_Active);border-right-style:none}.fd-step-input .fd-step-input__addon:first-child .fd-step-input__button.is-active,.fd-step-input .fd-step-input__addon:first-child .fd-step-input__button:active{border-right:var(--fdInputGroup_ControlButton_SideBorder_Active)}.fd-step-input .fd-step-input__addon:first-child .fd-step-input__button.is-active[dir=rtl],.fd-step-input .fd-step-input__addon:first-child .fd-step-input__button:active[dir=rtl],[dir=rtl] .fd-step-input .fd-step-input__addon:first-child .fd-step-input__button.is-active,[dir=rtl] .fd-step-input .fd-step-input__addon:first-child .fd-step-input__button:active{border-left:var(--fdInputGroup_ControlButton_SideBorder_Active);border-right-style:none}.fd-step-input .fd-step-input__addon:not(:first-child) .fd-step-input__button{border-left:var(--fdInputGroup_ControlButton_SideBorder)}.fd-step-input .fd-step-input__addon:not(:first-child) .fd-step-input__button[dir=rtl],[dir=rtl] .fd-step-input .fd-step-input__addon:not(:first-child) .fd-step-input__button{border-left-style:none;border-right:var(--fdInputGroup_ControlButton_SideBorder)}.fd-step-input .fd-step-input__addon:not(:first-child) .fd-step-input__button.is-hover,.fd-step-input .fd-step-input__addon:not(:first-child) .fd-step-input__button:hover{border-left:var(--fdInputGroup_ControlButton_SideBorder_Active)}.fd-step-input .fd-step-input__addon:not(:first-child) .fd-step-input__button.is-hover[dir=rtl],.fd-step-input .fd-step-input__addon:not(:first-child) .fd-step-input__button:hover[dir=rtl],[dir=rtl] .fd-step-input .fd-step-input__addon:not(:first-child) .fd-step-input__button.is-hover,[dir=rtl] .fd-step-input .fd-step-input__addon:not(:first-child) .fd-step-input__button:hover{border-left-style:none;border-right:var(--fdInputGroup_ControlButton_SideBorder_Active)}.fd-step-input .fd-step-input__addon:not(:first-child) .fd-step-input__button.is-active,.fd-step-input .fd-step-input__addon:not(:first-child) .fd-step-input__button:active{border-left:var(--fdInputGroup_ControlButton_SideBorder_Active)}.fd-step-input .fd-step-input__addon:not(:first-child) .fd-step-input__button.is-active[dir=rtl],.fd-step-input .fd-step-input__addon:not(:first-child) .fd-step-input__button:active[dir=rtl],[dir=rtl] .fd-step-input .fd-step-input__addon:not(:first-child) .fd-step-input__button.is-active,[dir=rtl] .fd-step-input .fd-step-input__addon:not(:first-child) .fd-step-input__button:active{border-left-style:none;border-right:var(--fdInputGroup_ControlButton_SideBorder_Active)}.fd-step-input .fd-step-input__button{background:var(--fdInput_Group_Button_Background);background-color:var(--fdButtonBackgroundColor);border:none;border-radius:var(--fdInput_Group_Button_Border_Raduis);color:var(--fdInput_Group_Button_Text_Color);overflow:hidden;position:relative;text-overflow:ellipsis;white-space:nowrap;z-index:auto!important}.fd-step-input .fd-step-input__button:before{display:none!important}.fd-step-input .fd-step-input__button:after{border-radius:var(--fdInput_Outline_Border_Radius)}.fd-step-input .fd-step-input__button.is-hover,.fd-step-input .fd-step-input__button:hover{--fdInput_Group_Button_Text_Color:var(--fdInput_Group_Button_Hover_Text_Color);--fdButtonBackgroundColor:var(--fdInput_Group_Button_Hover_Background);box-shadow:var(--fdInput_Group_Button_Box_Shadow)}.fd-step-input .fd-step-input__button.is-active,.fd-step-input .fd-step-input__button:active{-webkit-box-shadow:var(--fdInput_Group_Button_Box_Shadow);background:var(--fdInput_Group_Button_Active_Background);box-shadow:var(--fdInput_Group_Button_Box_Shadow);color:var(--fdInput_Group_Button_Active_Text_Color)}.fd-step-input.is-success.is-focus,.fd-step-input.is-success:focus{z-index:5}.fd-step-input.is-success.is-focus .fd-step-input__button,.fd-step-input.is-success:focus .fd-step-input__button{-webkit-box-shadow:var(--fdInput_Group_Button_Success_Active_Box_Shadow);--fdButtonBackgroundColor:var(--fdInput_Group_Button_Active_Background);box-shadow:var(--fdInput_Group_Button_Success_Active_Box_Shadow);color:var(--fdInput_Group_Button_Success_Active_Text_Color)}.fd-step-input.is-success.is-focus .fd-step-input__button.is-hover,.fd-step-input.is-success.is-focus .fd-step-input__button:hover,.fd-step-input.is-success:focus .fd-step-input__button.is-hover,.fd-step-input.is-success:focus .fd-step-input__button:hover{--fdButtonBackgroundColor:var(--fdInput_Group_Button_Active_Background)}.fd-step-input.is-success.is-expanded .fd-step-input__button,.fd-step-input.is-success[aria-expanded=true] .fd-step-input__button{-webkit-box-shadow:var(--fdInput_Group_Button_Success_Active_Box_Shadow);--fdButtonBackgroundColor:var(--fdInput_Group_Button_Active_Background);box-shadow:var(--fdInput_Group_Button_Success_Active_Box_Shadow);color:var(--fdInput_Group_Button_Success_Active_Text_Color)}.fd-step-input.is-success.is-expanded .fd-step-input__button.is-hover,.fd-step-input.is-success.is-expanded .fd-step-input__button:hover,.fd-step-input.is-success[aria-expanded=true] .fd-step-input__button.is-hover,.fd-step-input.is-success[aria-expanded=true] .fd-step-input__button:hover{--fdButtonBackgroundColor:var(--fdInput_Group_Button_Active_Background)}.fd-step-input.is-success .fd-step-input__button.is-active,.fd-step-input.is-success .fd-step-input__button.is-hover,.fd-step-input.is-success .fd-step-input__button:active,.fd-step-input.is-success .fd-step-input__button:hover{box-shadow:var(--fdInput_Group_Button_Success_Active_Box_Shadow)}.fd-step-input.is-success .fd-step-input__button.is-active,.fd-step-input.is-success .fd-step-input__button:active{color:var(--fdInput_Group_Button_Success_Active_Text_Color)}.fd-step-input.is-error.is-focus,.fd-step-input.is-error:focus{z-index:5}.fd-step-input.is-error.is-focus .fd-step-input__button,.fd-step-input.is-error:focus .fd-step-input__button{-webkit-box-shadow:var(--fdInput_Group_Button_Error_Active_Box_Shadow);--fdButtonBackgroundColor:var(--fdInput_Group_Button_Active_Background);box-shadow:var(--fdInput_Group_Button_Error_Active_Box_Shadow);color:var(--fdInput_Group_Button_Error_Active_Text_Color)}.fd-step-input.is-error.is-focus .fd-step-input__button.is-hover,.fd-step-input.is-error.is-focus .fd-step-input__button:hover,.fd-step-input.is-error:focus .fd-step-input__button.is-hover,.fd-step-input.is-error:focus .fd-step-input__button:hover{--fdButtonBackgroundColor:var(--fdInput_Group_Button_Active_Background)}.fd-step-input.is-error.is-expanded .fd-step-input__button,.fd-step-input.is-error[aria-expanded=true] .fd-step-input__button{-webkit-box-shadow:var(--fdInput_Group_Button_Error_Active_Box_Shadow);--fdButtonBackgroundColor:var(--fdInput_Group_Button_Active_Background);box-shadow:var(--fdInput_Group_Button_Error_Active_Box_Shadow);color:var(--fdInput_Group_Button_Error_Active_Text_Color)}.fd-step-input.is-error.is-expanded .fd-step-input__button.is-hover,.fd-step-input.is-error.is-expanded .fd-step-input__button:hover,.fd-step-input.is-error[aria-expanded=true] .fd-step-input__button.is-hover,.fd-step-input.is-error[aria-expanded=true] .fd-step-input__button:hover{--fdButtonBackgroundColor:var(--fdInput_Group_Button_Active_Background)}.fd-step-input.is-error .fd-step-input__button.is-active,.fd-step-input.is-error .fd-step-input__button.is-hover,.fd-step-input.is-error .fd-step-input__button:active,.fd-step-input.is-error .fd-step-input__button:hover{box-shadow:var(--fdInput_Group_Button_Error_Active_Box_Shadow)}.fd-step-input.is-error .fd-step-input__button.is-active,.fd-step-input.is-error .fd-step-input__button:active{color:var(--fdInput_Group_Button_Error_Active_Text_Color)}.fd-step-input.is-warning.is-focus,.fd-step-input.is-warning:focus{z-index:5}.fd-step-input.is-warning.is-focus .fd-step-input__button,.fd-step-input.is-warning:focus .fd-step-input__button{-webkit-box-shadow:var(--fdInput_Group_Button_Warning_Active_Box_Shadow);--fdButtonBackgroundColor:var(--fdInput_Group_Button_Active_Background);box-shadow:var(--fdInput_Group_Button_Warning_Active_Box_Shadow);color:var(--fdInput_Group_Button_Warning_Active_Text_Color)}.fd-step-input.is-warning.is-focus .fd-step-input__button.is-hover,.fd-step-input.is-warning.is-focus .fd-step-input__button:hover,.fd-step-input.is-warning:focus .fd-step-input__button.is-hover,.fd-step-input.is-warning:focus .fd-step-input__button:hover{--fdButtonBackgroundColor:var(--fdInput_Group_Button_Active_Background)}.fd-step-input.is-warning.is-expanded .fd-step-input__button,.fd-step-input.is-warning[aria-expanded=true] .fd-step-input__button{-webkit-box-shadow:var(--fdInput_Group_Button_Warning_Active_Box_Shadow);--fdButtonBackgroundColor:var(--fdInput_Group_Button_Active_Background);box-shadow:var(--fdInput_Group_Button_Warning_Active_Box_Shadow);color:var(--fdInput_Group_Button_Warning_Active_Text_Color)}.fd-step-input.is-warning.is-expanded .fd-step-input__button.is-hover,.fd-step-input.is-warning.is-expanded .fd-step-input__button:hover,.fd-step-input.is-warning[aria-expanded=true] .fd-step-input__button.is-hover,.fd-step-input.is-warning[aria-expanded=true] .fd-step-input__button:hover{--fdButtonBackgroundColor:var(--fdInput_Group_Button_Active_Background)}.fd-step-input.is-warning .fd-step-input__button.is-active,.fd-step-input.is-warning .fd-step-input__button.is-hover,.fd-step-input.is-warning .fd-step-input__button:active,.fd-step-input.is-warning .fd-step-input__button:hover{box-shadow:var(--fdInput_Group_Button_Warning_Active_Box_Shadow)}.fd-step-input.is-warning .fd-step-input__button.is-active,.fd-step-input.is-warning .fd-step-input__button:active{color:var(--fdInput_Group_Button_Warning_Active_Text_Color)}.fd-step-input.is-alert.is-focus,.fd-step-input.is-alert:focus{z-index:5}.fd-step-input.is-alert.is-focus .fd-step-input__button,.fd-step-input.is-alert:focus .fd-step-input__button{-webkit-box-shadow:var(--fdInput_Group_Button_Warning_Active_Box_Shadow);--fdButtonBackgroundColor:var(--fdInput_Group_Button_Active_Background);box-shadow:var(--fdInput_Group_Button_Warning_Active_Box_Shadow);color:var(--fdInput_Group_Button_Warning_Active_Text_Color)}.fd-step-input.is-alert.is-focus .fd-step-input__button.is-hover,.fd-step-input.is-alert.is-focus .fd-step-input__button:hover,.fd-step-input.is-alert:focus .fd-step-input__button.is-hover,.fd-step-input.is-alert:focus .fd-step-input__button:hover{--fdButtonBackgroundColor:var(--fdInput_Group_Button_Active_Background)}.fd-step-input.is-alert.is-expanded .fd-step-input__button,.fd-step-input.is-alert[aria-expanded=true] .fd-step-input__button{-webkit-box-shadow:var(--fdInput_Group_Button_Warning_Active_Box_Shadow);--fdButtonBackgroundColor:var(--fdInput_Group_Button_Active_Background);box-shadow:var(--fdInput_Group_Button_Warning_Active_Box_Shadow);color:var(--fdInput_Group_Button_Warning_Active_Text_Color)}.fd-step-input.is-alert.is-expanded .fd-step-input__button.is-hover,.fd-step-input.is-alert.is-expanded .fd-step-input__button:hover,.fd-step-input.is-alert[aria-expanded=true] .fd-step-input__button.is-hover,.fd-step-input.is-alert[aria-expanded=true] .fd-step-input__button:hover{--fdButtonBackgroundColor:var(--fdInput_Group_Button_Active_Background)}.fd-step-input.is-alert .fd-step-input__button.is-active,.fd-step-input.is-alert .fd-step-input__button.is-hover,.fd-step-input.is-alert .fd-step-input__button:active,.fd-step-input.is-alert .fd-step-input__button:hover{box-shadow:var(--fdInput_Group_Button_Warning_Active_Box_Shadow)}.fd-step-input.is-alert .fd-step-input__button.is-active,.fd-step-input.is-alert .fd-step-input__button:active{color:var(--fdInput_Group_Button_Warning_Active_Text_Color)}.fd-step-input.is-information.is-focus,.fd-step-input.is-information:focus{z-index:5}.fd-step-input.is-information.is-focus .fd-step-input__button,.fd-step-input.is-information:focus .fd-step-input__button{-webkit-box-shadow:var(--fdInput_Group_Button_Information_Active_Box_Shadow);--fdButtonBackgroundColor:var(--fdInput_Group_Button_Active_Background);box-shadow:var(--fdInput_Group_Button_Information_Active_Box_Shadow);color:var(--fdInput_Group_Button_Information_Active_Text_Color)}.fd-step-input.is-information.is-focus .fd-step-input__button.is-hover,.fd-step-input.is-information.is-focus .fd-step-input__button:hover,.fd-step-input.is-information:focus .fd-step-input__button.is-hover,.fd-step-input.is-information:focus .fd-step-input__button:hover{--fdButtonBackgroundColor:var(--fdInput_Group_Button_Active_Background)}.fd-step-input.is-information.is-expanded .fd-step-input__button,.fd-step-input.is-information[aria-expanded=true] .fd-step-input__button{-webkit-box-shadow:var(--fdInput_Group_Button_Information_Active_Box_Shadow);--fdButtonBackgroundColor:var(--fdInput_Group_Button_Active_Background);box-shadow:var(--fdInput_Group_Button_Information_Active_Box_Shadow);color:var(--fdInput_Group_Button_Information_Active_Text_Color)}.fd-step-input.is-information.is-expanded .fd-step-input__button.is-hover,.fd-step-input.is-information.is-expanded .fd-step-input__button:hover,.fd-step-input.is-information[aria-expanded=true] .fd-step-input__button.is-hover,.fd-step-input.is-information[aria-expanded=true] .fd-step-input__button:hover{--fdButtonBackgroundColor:var(--fdInput_Group_Button_Active_Background)}.fd-step-input.is-information .fd-step-input__button.is-active,.fd-step-input.is-information .fd-step-input__button.is-hover,.fd-step-input.is-information .fd-step-input__button:active,.fd-step-input.is-information .fd-step-input__button:hover{box-shadow:var(--fdInput_Group_Button_Information_Active_Box_Shadow)}.fd-step-input.is-information .fd-step-input__button.is-active,.fd-step-input.is-information .fd-step-input__button:active{color:var(--fdInput_Group_Button_Information_Active_Text_Color)}.fd-step-input .fd-step-input__button.fd-button{min-width:var(--fdStepInput_Button_Width);width:var(--fdStepInput_Button_Width)}.fd-step-input .fd-step-input__button.fd-button:after,.fd-step-input .fd-step-input__button.fd-button:before{font-size:.875rem;margin:0}.fd-step-input .fd-step-input__button.fd-button.is-focus,.fd-step-input .fd-step-input__button.fd-button:focus{outline:none;z-index:5}.fd-step-input .fd-step-input__button.fd-button.is-focus:after,.fd-step-input .fd-step-input__button.fd-button:focus:after{display:none}.fd-step-input .fd-step-input__button.fd-button.is-focus.is-hover,.fd-step-input .fd-step-input__button.fd-button.is-focus:hover,.fd-step-input .fd-step-input__button.fd-button:focus.is-hover,.fd-step-input .fd-step-input__button.fd-button:focus:hover{z-index:auto}.fd-step-input__input.fd-input{--fdInput_Field_Padding:0 .25rem;-webkit-box-shadow:none;background:none;background-color:transparent;border:none;box-shadow:none;margin:0;text-align:right}.fd-step-input__input.fd-input[dir=rtl],[dir=rtl] .fd-step-input__input.fd-input{text-align:left}.fd-step-input__input.fd-input.is-focus,.fd-step-input__input.fd-input.is-hover,.fd-step-input__input.fd-input:focus,.fd-step-input__input.fd-input:hover{-webkit-box-shadow:none;background:none;background-color:var(transparent, transparent);box-shadow:none}.fd-step-input__input.fd-input.is-focus,.fd-step-input__input.fd-input:focus{outline:none;z-index:5}.fd-step-input__container{align-items:center;display:flex}.fd-step-input.is-error .fd-step-input__button.fd-button,.fd-step-input.is-information .fd-step-input__button.fd-button,.fd-step-input.is-warning .fd-step-input__button.fd-button{min-width:var(--fdStepInput_Button_Width_Semantic_Cozy);width:var(--fdStepInput_Button_Width_Semantic_Cozy)}.fd-step-input[class*=-compact],.fd-step-input[class*=-condensed],[class*=-compact] .fd-step-input:not([class*=-cozy]),[class*=-condensed] .fd-step-input:not([class*=-cozy]){--fdStepInput_Button_Width:var(--fdStepInput_Button_Width_Compact);--fdStepInput_Bordered_Button_Width:var(--fdStepInput_Button_Width_Semantic_Compact);--fdInput_Field_Compact_Padding:0 .25rem;height:1.625rem;min-height:1.625rem}.fd-step-input[class*=-compact] .fd-step-input__input.fd-input,.fd-step-input[class*=-condensed] .fd-step-input__input.fd-input,[class*=-compact] .fd-step-input:not([class*=-cozy]) .fd-step-input__input.fd-input,[class*=-condensed] .fd-step-input:not([class*=-cozy]) .fd-step-input__input.fd-input{height:100%}.fd-step-input[class*=-compact].is-readonly,.fd-step-input[class*=-condensed].is-readonly,[class*=-compact] .fd-step-input:not([class*=-cozy]).is-readonly,[class*=-condensed] .fd-step-input:not([class*=-cozy]).is-readonly{--fdInput_Field_Compact_Padding:0 .5rem}.fd-step-input.is-readonly .fd-step-input__input.fd-input{--fdInput_Field_Padding:0 .625rem}.fd-step-input.is-readonly .fd-step-input__button.fd-button{display:none}.fd-step-input.is-readonly:focus-within{border-radius:var(--sapField_BorderCornerRadius)}.fd-step-input.is-readonly:focus-within .fd-step-input__input{background:transparent}.fd-step-input.is-focus,.fd-step-input:focus{z-index:5}.fd-step-input.is-focus.is-error .fd-step-input__button.fd-button:not(:hover),.fd-step-input.is-focus.is-information .fd-step-input__button.fd-button:not(:hover),.fd-step-input.is-focus.is-success .fd-step-input__button.fd-button:not(:hover),.fd-step-input.is-focus.is-warning .fd-step-input__button.fd-button:not(:hover),.fd-step-input:focus.is-error .fd-step-input__button.fd-button:not(:hover),.fd-step-input:focus.is-information .fd-step-input__button.fd-button:not(:hover),.fd-step-input:focus.is-success .fd-step-input__button.fd-button:not(:hover),.fd-step-input:focus.is-warning .fd-step-input__button.fd-button:not(:hover){box-shadow:none}.fd-step-input{display:flex}\n"], dependencies: [{ kind: "ngmodule", type: FormInputMessageGroupModule }, { kind: "component", type: i3.FormInputMessageGroupComponent, selector: "fd-form-input-message-group", inputs: ["triggers", "closeOnOutsideClick", "fillControlMode", "noArrow", "closeOnEscapeKey", "placement", "placementContainer", "isOpen"], outputs: ["isOpenChange"] }, { kind: "ngmodule", type: ButtonModule }, { kind: "component", type: i5$2.ButtonComponent, selector: "button[fd-button], a[fd-button]", inputs: ["class"], exportAs: ["fd-button"] }, { kind: "directive", type: StepInputDecrementDirective, selector: "[fdpStepInputDecrement]" }, { kind: "directive", type: StepInputControlDirective, selector: "[fdpStepInputControl]" }, { kind: "directive", type: OnlyDigitsDirective, selector: "[fdkOnlyDigits]", inputs: ["decimal", "decimalSeparator"] }, { kind: "directive", type: StepInputIncrementDirective, selector: "[fdpStepInputIncrement]" }, { kind: "directive", type: NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "ngmodule", type: FormMessageModule }, { kind: "component", type: i3.FormMessageComponent, selector: "fd-form-message", inputs: ["type", "static", "embedded", "class"] }, { kind: "ngmodule", type: ContentDensityModule }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.1.0", ngImport: i0, type: NumberStepInputComponent, decorators: [{
             type: Component,
@@ -11073,6 +10986,16 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.1.0", ngImpor
                         { provide: FD_FORM_FIELD_CONTROL, useExisting: NumberStepInputComponent, multi: true },
                         { provide: StepInputComponent, useExisting: NumberStepInputComponent },
                         contentDensityObserverProviders()
+                    ], standalone: true, imports: [
+                        FormInputMessageGroupModule,
+                        ButtonModule,
+                        StepInputDecrementDirective,
+                        StepInputControlDirective,
+                        OnlyDigitsDirective,
+                        StepInputIncrementDirective,
+                        NgIf,
+                        FormMessageModule,
+                        ContentDensityModule
                     ], template: "<fd-form-input-message-group>\n    <div\n        class=\"fd-step-input\"\n        [class.is-focus]=\"focused\"\n        [class.is-readonly]=\"!editable\"\n        [class.is-disabled]=\"disabled\"\n        [class.fd-step-input--without-buttons]=\"showLabels\"\n        [class]=\"state ? 'is-' + state : ''\"\n    >\n        <button\n            class=\"fd-step-input__button\"\n            tabindex=\"-1\"\n            type=\"button\"\n            fd-button\n            fdType=\"transparent\"\n            [glyph]=\"showLabels ? null : 'less'\"\n            fdpStepInputDecrement\n            [attr.aria-disabled]=\"disabled || !canDecrement\"\n            [attr.title]=\"decrementLabel\"\n            [attr.aria-label]=\"decrementLabel\"\n            [attr.aria-controls]=\"id\"\n        >\n            {{ showLabels ? decrementLabel : '' }}\n        </button>\n        <input\n            #inputElementRef\n            class=\"fd-input fd-input--no-number-spinner fd-step-input__input\"\n            [id]=\"id\"\n            [name]=\"name\"\n            [disabled]=\"disabled\"\n            [readonly]=\"!editable\"\n            [attr.placeholder]=\"placeholder || ''\"\n            [attr.aria-label]=\"ariaLabel\"\n            [attr.aria-labelledby]=\"ariaLabelledBy\"\n            [attr.aria-describedby]=\"description ? id + '__description' : ''\"\n            [attr.aria-required]=\"required\"\n            [style.textAlign]=\"_align\"\n            fdpStepInputControl\n            type=\"text\"\n            inputmode=\"numeric\"\n            fdkOnlyDigits\n            [decimal]=\"true\"\n        />\n        <button\n            class=\"fd-step-input__button\"\n            tabindex=\"-1\"\n            type=\"button\"\n            fd-button\n            fdType=\"transparent\"\n            [glyph]=\"showLabels ? null : 'add'\"\n            fdpStepInputIncrement\n            [attr.aria-disabled]=\"disabled || !canIncrement\"\n            [attr.title]=\"incrementLabel\"\n            [attr.aria-label]=\"incrementLabel\"\n            [attr.aria-controls]=\"id\"\n        >\n            {{ showLabels ? incrementLabel : '' }}\n        </button>\n    </div>\n    <fd-form-message *ngIf=\"stateMessage\" [type]=\"state\" [innerHTML]=\"stateMessage\"></fd-form-message>\n</fd-form-input-message-group>\n<span *ngIf=\"description\" [id]=\"id + '__description'\" class=\"fd-form-label fd-form-label--unit-description\">\n    {{ description }}\n</span>\n", styles: [".fd-input{-webkit-box-sizing:border-box;-webkit-box-shadow:var(--sapField_Shadow);-webkit-appearance:none;appearance:none;background:var(--sapField_BackgroundStyle, var(--sapField_BackgroundStyle));background-color:var(--sapField_Background, var(--sapField_Background));border:0;border:var(--sapField_BorderWidth) var(--sapField_BorderStyle) var(--sapField_BorderColor);border-radius:var(--sapField_BorderCornerRadius);box-shadow:var(--sapField_Shadow);box-sizing:border-box;color:var(--sapTextColor);color:var(--sapField_TextColor);cursor:text;font-family:var(--sapFontFamily);font-size:var(--sapFontSize);font-weight:400;forced-color-adjust:none;height:var(--sapElement_Height);line-height:var(--sapContent_LineHeight);margin:0;margin:var(--fdInput_Field_Margin, .25rem 0);min-height:var(--sapElement_Height);min-width:var(2.75rem, 2.75rem);outline:none;overflow:hidden;padding:0;padding:var(--fdInput_Field_Padding, 0 .625rem);text-overflow:ellipsis;text-shadow:var(--fdInput_Text_Shadow);white-space:nowrap;width:100%;z-index:1}.fd-input:after,.fd-input:before{box-sizing:inherit;font-size:inherit}.fd-input::placeholder{color:var(--sapField_PlaceholderTextColor);font-style:var(--fdPlaceholder_Font_Style)}.fd-input[dir=rtl]::placeholder,[dir=rtl] .fd-input::placeholder{text-indent:.125rem}.fd-input::selection{background-color:var(--sapSelectedColor);color:var(--sapContent_ContrastTextColor)}.fd-input::-ms-clear{display:none}.fd-input.is-hover,.fd-input:hover{-webkit-box-shadow:var(--fdInput_Box_Shadow_Hover);background:var(--sapField_Hover_BackgroundStyle, var(--sapField_Hover_BackgroundStyle));background-color:var(--sapField_Hover_Background, var(--sapField_Hover_Background));border-color:var(--sapField_Hover_BorderColor);box-shadow:var(--fdInput_Box_Shadow_Hover)}.fd-input.is-focus,.fd-input:focus{-webkit-box-shadow:none;background:var(--sapField_Focus_Background, var(--sapField_Focus_Background));box-shadow:none;outline-color:var(--fdInput_Outline_Color);outline-offset:var(--fdInput_Outline_Offset);outline-style:var(--sapContent_FocusStyle);outline-width:var(--sapContent_FocusWidth);z-index:5}.fd-input[type=search]::-webkit-search-cancel-button,.fd-input[type=search]::-webkit-search-decoration,.fd-input[type=search]::-webkit-search-results-button,.fd-input[type=search]::-webkit-search-results-decoration{-webkit-appearance:none}.fd-input[aria-expanded=false]{z-index:0}.fd-input.is-expanded,.fd-input[aria-expanded=true]{z-index:4}.fd-input[class*=-compact],.fd-input[class*=-condensed],[class*=-compact] .fd-input:not([class*=-cozy]),[class*=-condensed] .fd-input:not([class*=-cozy]){box-sizing:border-box;height:var(--sapElement_Compact_Height);margin:var(--fdInput_Field_Compact_Margin, .1875rem 0);min-height:var(--sapElement_Compact_Height);min-width:var(--fdInput_Field_Compact_Min_Width, 2rem);padding:var(--fdInput_Field_Compact_Padding, 0 .5rem)}.fd-input--no-number-spinner{-moz-appearance:textfield}.fd-input--no-number-spinner::-webkit-inner-spin-button,.fd-input--no-number-spinner::-webkit-outer-spin-button{-webkit-appearance:none;margin:0}.fd-input.right-align{text-align:right}.fd-input.is-success{-webkit-box-shadow:var(--sapField_SuccessShadow);background:var(--sapField_SuccessBackgroundStyle);background-color:var(--sapField_SuccessBackground);border:var(--sapField_SuccessColor) var(--sapField_SuccessBorderWidth) var(--sapField_SuccessBorderStyle);box-shadow:var(--sapField_SuccessShadow)}.fd-input.is-success.is-hover,.fd-input.is-success:hover{-webkit-box-shadow:var(--fdInput_Success_Box_Shadow_Hover);background-color:var(--fdInput_Success_Background_Color_Hover);border-color:var(--sapField_SuccessColor);box-shadow:var(--fdInput_Success_Box_Shadow_Hover)}.fd-input.is-success.is-focus,.fd-input.is-success:focus{background:var(--sapField_Focus_Background);outline-color:var(--fdInput_Success_Outline_Color);z-index:5}.fd-input.is-success.is-focus.is-hover,.fd-input.is-success.is-focus:hover,.fd-input.is-success:focus.is-hover,.fd-input.is-success:focus:hover{box-shadow:none}.fd-input.is-success.is-expanded,.fd-input.is-success[aria-expanded=true]{-webkit-box-shadow:none;background:var(--sapField_Focus_Background);box-shadow:none;outline:var(--sapContent_FocusWidth) var(--sapContent_FocusStyle) var(--fdInput_Success_Outline_Color);outline-offset:var(--fdInput_Outline_Offset)}.fd-input.is-error{-webkit-box-shadow:var(--sapField_InvalidShadow);background:var(--sapField_InvalidBackgroundStyle);background-color:var(--sapField_InvalidBackground);border:var(--sapField_InvalidColor) var(--sapField_InvalidBorderWidth) var(--sapField_InvalidBorderStyle);box-shadow:var(--sapField_InvalidShadow)}.fd-input.is-error.is-hover,.fd-input.is-error:hover{-webkit-box-shadow:var(--fdInput_Error_Box_Shadow_Hover);background-color:var(--fdInput_Error_Background_Color_Hover);border-color:var(--sapField_InvalidColor);box-shadow:var(--fdInput_Error_Box_Shadow_Hover)}.fd-input.is-error.is-focus,.fd-input.is-error:focus{background:var(--sapField_Focus_Background);outline-color:var(--fdInput_Error_Outline_Color);z-index:5}.fd-input.is-error.is-focus.is-hover,.fd-input.is-error.is-focus:hover,.fd-input.is-error:focus.is-hover,.fd-input.is-error:focus:hover{box-shadow:none}.fd-input.is-error.is-expanded,.fd-input.is-error[aria-expanded=true]{-webkit-box-shadow:none;background:var(--sapField_Focus_Background);box-shadow:none;outline:var(--sapContent_FocusWidth) var(--sapContent_FocusStyle) var(--fdInput_Error_Outline_Color);outline-offset:var(--fdInput_Outline_Offset)}.fd-input.is-warning{-webkit-box-shadow:var(--sapField_WarningShadow);background:var(--sapField_WarningBackgroundStyle);background-color:var(--sapField_WarningBackground);border:var(--sapField_WarningColor) var(--sapField_WarningBorderWidth) var(--sapField_WarningBorderStyle);box-shadow:var(--sapField_WarningShadow)}.fd-input.is-warning.is-hover,.fd-input.is-warning:hover{-webkit-box-shadow:var(--fdInput_Warning_Box_Shadow_Hover);background-color:var(--fdInput_Warning_Background_Color_Hover);border-color:var(--sapField_WarningColor);box-shadow:var(--fdInput_Warning_Box_Shadow_Hover)}.fd-input.is-warning.is-focus,.fd-input.is-warning:focus{background:var(--sapField_Focus_Background);outline-color:var(--fdInput_Warning_Outline_Color);z-index:5}.fd-input.is-warning.is-focus.is-hover,.fd-input.is-warning.is-focus:hover,.fd-input.is-warning:focus.is-hover,.fd-input.is-warning:focus:hover{box-shadow:none}.fd-input.is-warning.is-expanded,.fd-input.is-warning[aria-expanded=true]{-webkit-box-shadow:none;background:var(--sapField_Focus_Background);box-shadow:none;outline:var(--sapContent_FocusWidth) var(--sapContent_FocusStyle) var(--fdInput_Warning_Outline_Color);outline-offset:var(--fdInput_Outline_Offset)}.fd-input.is-alert{background:var(--sapField_WarningBackgroundStyle);background-color:var(--sapField_WarningBackground);border:var(--sapField_WarningColor) var(--sapField_WarningBorderWidth) var(--sapField_WarningBorderStyle)}.fd-input.is-alert.is-hover,.fd-input.is-alert:hover{-webkit-box-shadow:var(--fdInput_Warning_Box_Shadow_Hover);background-color:var(--fdInput_Warning_Background_Color_Hover);border-color:var(--sapField_WarningColor);box-shadow:var(--fdInput_Warning_Box_Shadow_Hover)}.fd-input.is-alert.is-focus,.fd-input.is-alert:focus{background:var(--sapField_Focus_Background);outline-color:var(--fdInput_Warning_Outline_Color);z-index:5}.fd-input.is-alert.is-focus.is-hover,.fd-input.is-alert.is-focus:hover,.fd-input.is-alert:focus.is-hover,.fd-input.is-alert:focus:hover{box-shadow:none}.fd-input.is-alert.is-expanded,.fd-input.is-alert[aria-expanded=true]{-webkit-box-shadow:none;background:var(--sapField_Focus_Background);box-shadow:none;outline:var(--sapContent_FocusWidth) var(--sapContent_FocusStyle) var(--fdInput_Warning_Outline_Color);outline-offset:var(--fdInput_Outline_Offset)}.fd-input.is-information{-webkit-box-shadow:var(--sapField_InformationShadow);background:var(--sapField_InformationBackgroundStyle);background-color:var(--sapField_InformationBackground);border:var(--sapField_InformationColor) var(--sapField_InformationBorderWidth) var(--sapField_InformationBorderStyle);box-shadow:var(--sapField_InformationShadow)}.fd-input.is-information.is-hover,.fd-input.is-information:hover{-webkit-box-shadow:var(--fdInput_Information_Box_Shadow_Hover);background-color:var(--fdInput_Information_Background_Color_Hover);border-color:var(--sapField_InformationColor);box-shadow:var(--fdInput_Information_Box_Shadow_Hover)}.fd-input.is-information.is-focus,.fd-input.is-information:focus{background:var(--sapField_Focus_Background);outline-color:var(--fdInput_Information_Outline_Color);z-index:5}.fd-input.is-information.is-focus.is-hover,.fd-input.is-information.is-focus:hover,.fd-input.is-information:focus.is-hover,.fd-input.is-information:focus:hover{box-shadow:none}.fd-input.is-information.is-expanded,.fd-input.is-information[aria-expanded=true]{-webkit-box-shadow:none;background:var(--sapField_Focus_Background);box-shadow:none;outline:var(--sapContent_FocusWidth) var(--sapContent_FocusStyle) var(--fdInput_Information_Outline_Color);outline-offset:var(--fdInput_Outline_Offset)}.fd-input.is-alert,.fd-input.is-error,.fd-input.is-warning{font-style:var(--fdInput_State_Text_Style);font-weight:var(--fdInput_State_Font_Weight)}.fd-input.is-alert::placeholder,.fd-input.is-error::placeholder,.fd-input.is-warning::placeholder{font-weight:var(--fdInput_State_Font_Weight)}.fd-input.is-alert.is-focus,.fd-input.is-alert:focus,.fd-input.is-error.is-focus,.fd-input.is-error:focus,.fd-input.is-information.is-focus,.fd-input.is-information:focus,.fd-input.is-warning.is-focus,.fd-input.is-warning:focus{outline-offset:var(--fdInput_Outline_Offset_States);z-index:5}.fd-input.is-error::placeholder{color:var(--sapField_TextColor)}.fd-input.is-disabled,.fd-input:disabled,.fd-input[aria-disabled=true]{opacity:var(--sapContent_DisabledOpacity);pointer-events:none}.fd-input.is-disabled::placeholder,.fd-input:disabled::placeholder,.fd-input[aria-disabled=true]::placeholder{color:var(--fdInput_Non_Interactive_State_Placeholder_Color)}.fd-input.is-readonly,.fd-input[aria-readonly=true],.fd-input[readonly]{-webkit-box-shadow:none;background:var(--sapField_ReadOnly_BackgroundStyle);background-color:var(--sapField_ReadOnly_Background);border-color:var(--sapField_ReadOnly_BorderColor);box-shadow:none}.fd-input.is-readonly::placeholder,.fd-input[aria-readonly=true]::placeholder,.fd-input[readonly]::placeholder{color:var(--fdInput_Non_Interactive_State_Placeholder_Color)}.fd-input.is-readonly.is-focus,.fd-input.is-readonly.is-hover,.fd-input.is-readonly:focus,.fd-input.is-readonly:hover,.fd-input[aria-readonly=true].is-focus,.fd-input[aria-readonly=true].is-hover,.fd-input[aria-readonly=true]:focus,.fd-input[aria-readonly=true]:hover,.fd-input[readonly].is-focus,.fd-input[readonly].is-hover,.fd-input[readonly]:focus,.fd-input[readonly]:hover{-webkit-box-shadow:none;background:var(--sapField_ReadOnly_BackgroundStyle);background-color:var(--sapField_ReadOnly_Background);border-color:var(--sapField_ReadOnly_BorderColor);box-shadow:none}.fd-input.is-readonly.is-focus,.fd-input.is-readonly:focus,.fd-input[aria-readonly=true].is-focus,.fd-input[aria-readonly=true]:focus,.fd-input[readonly].is-focus,.fd-input[readonly]:focus{z-index:5}/*!\n * Fundamental Library Styles v0.30.2-rc.6\n * Copyright (c) 2023 SAP SE or an SAP affiliate company.\n * Licensed under Apache License 2.0 (https://github.com/SAP/fundamental-styles/blob/main/LICENSE)\n */.fd-step-input{--fdStepInput_Button_Width:var(--fdStepInput_Button_Width_Cozy);--fdStepInput_Bordered_Button_Width:var(--fdStepInput_Button_Width_Semantic_Cozy);-webkit-box-sizing:border-box;-webkit-box-shadow:var(--sapField_Shadow);-moz-appearance:none;-webkit-appearance:none;align-items:center;appearance:none;background:var(--sapField_BackgroundStyle, var(--sapField_BackgroundStyle));background-color:var(--sapField_Background, var(--sapField_Background));border:0;border:var(--sapField_BorderWidth) var(--sapField_BorderStyle) var(--sapField_BorderColor);border-radius:var(--sapField_BorderCornerRadius);box-shadow:var(--sapField_Shadow);box-sizing:border-box;color:var(--sapTextColor);color:var(--sapField_TextColor);cursor:text;display:inline-flex;font-family:var(--sapFontFamily);font-size:var(--sapFontSize);font-weight:400;forced-color-adjust:none;height:var(--sapElement_Height);line-height:var(--sapContent_LineHeight);margin:0;margin:var(--fdInput_Field_Margin, .25rem 0);min-height:var(--sapElement_Height);min-width:var(2.75rem, 2.75rem);outline:none;overflow:hidden;padding:0;position:relative;text-overflow:ellipsis;text-shadow:var(--fdInput_Text_Shadow);white-space:nowrap;width:100%;width:auto;z-index:1}.fd-step-input:after,.fd-step-input:before{box-sizing:inherit;font-size:inherit}.fd-step-input::placeholder{color:var(--sapField_PlaceholderTextColor);font-style:var(--fdPlaceholder_Font_Style)}.fd-step-input[dir=rtl]::placeholder,[dir=rtl] .fd-step-input::placeholder{text-indent:.125rem}.fd-step-input::selection{background-color:var(--sapSelectedColor);color:var(--sapContent_ContrastTextColor)}.fd-step-input::-ms-clear{display:none}.fd-step-input.is-hover,.fd-step-input:hover{-webkit-box-shadow:var(--fdInput_Box_Shadow_Hover);background:var(--sapField_Hover_BackgroundStyle, var(--sapField_Hover_BackgroundStyle));background-color:var(--sapField_Hover_Background, var(--sapField_Hover_Background));border-color:var(--sapField_Hover_BorderColor);box-shadow:var(--fdInput_Box_Shadow_Hover)}.fd-step-input.is-focus,.fd-step-input:focus{-webkit-box-shadow:none;background:var(--sapField_Focus_Background, var(--sapField_Focus_Background));box-shadow:none;outline-color:var(--fdInput_Outline_Color);outline-offset:var(--fdInput_Outline_Offset);outline-style:var(--sapContent_FocusStyle);outline-width:var(--sapContent_FocusWidth)}.fd-step-input:focus-within{-webkit-box-shadow:none;background:var(--sapField_Focus_Background, var(--sapField_Focus_Background));box-shadow:none;outline-color:var(--fdInput_Outline_Color);outline-offset:var(--fdInput_Outline_Offset_Focus_Within);outline-style:var(--sapContent_FocusStyle);outline-width:var(--sapContent_FocusWidth)}.fd-step-input.is-success{-webkit-box-shadow:var(--sapField_SuccessShadow);background:var(--sapField_SuccessBackgroundStyle);background-color:var(--sapField_SuccessBackground);border:var(--sapField_SuccessColor) var(--sapField_SuccessBorderWidth) var(--sapField_SuccessBorderStyle);box-shadow:var(--sapField_SuccessShadow)}.fd-step-input.is-success.is-hover,.fd-step-input.is-success:hover{-webkit-box-shadow:var(--fdInput_Success_Box_Shadow_Hover);background-color:var(--fdInput_Success_Background_Color_Hover);border-color:var(--sapField_SuccessColor);box-shadow:var(--fdInput_Success_Box_Shadow_Hover)}.fd-step-input.is-success.is-focus,.fd-step-input.is-success:focus{background:var(--sapField_Focus_Background);outline-color:var(--fdInput_Success_Outline_Color)}.fd-step-input.is-success.is-focus.is-hover,.fd-step-input.is-success.is-focus:hover,.fd-step-input.is-success:focus.is-hover,.fd-step-input.is-success:focus:hover{box-shadow:none}.fd-step-input.is-success:focus-within{background:var(--sapField_Focus_Background);outline-color:var(--fdInput_Success_Outline_Color)}.fd-step-input.is-success:focus-within.is-hover,.fd-step-input.is-success:focus-within:hover{box-shadow:none}.fd-step-input.is-success.is-expanded,.fd-step-input.is-success[aria-expanded=true]{-webkit-box-shadow:none;background:var(--sapField_Focus_Background);box-shadow:none;outline:var(--sapContent_FocusWidth) var(--sapContent_FocusStyle) var(--fdInput_Success_Outline_Color);outline-offset:var(--fdInput_Outline_Offset)}.fd-step-input.is-error{-webkit-box-shadow:var(--sapField_InvalidShadow);background:var(--sapField_InvalidBackgroundStyle);background-color:var(--sapField_InvalidBackground);border:var(--sapField_InvalidColor) var(--sapField_InvalidBorderWidth) var(--sapField_InvalidBorderStyle);box-shadow:var(--sapField_InvalidShadow)}.fd-step-input.is-error.is-hover,.fd-step-input.is-error:hover{-webkit-box-shadow:var(--fdInput_Error_Box_Shadow_Hover);background-color:var(--fdInput_Error_Background_Color_Hover);border-color:var(--sapField_InvalidColor);box-shadow:var(--fdInput_Error_Box_Shadow_Hover)}.fd-step-input.is-error.is-focus,.fd-step-input.is-error:focus{background:var(--sapField_Focus_Background);outline-color:var(--fdInput_Error_Outline_Color)}.fd-step-input.is-error.is-focus.is-hover,.fd-step-input.is-error.is-focus:hover,.fd-step-input.is-error:focus.is-hover,.fd-step-input.is-error:focus:hover{box-shadow:none}.fd-step-input.is-error:focus-within{background:var(--sapField_Focus_Background);outline-color:var(--fdInput_Error_Outline_Color)}.fd-step-input.is-error:focus-within.is-hover,.fd-step-input.is-error:focus-within:hover{box-shadow:none}.fd-step-input.is-error.is-expanded,.fd-step-input.is-error[aria-expanded=true]{-webkit-box-shadow:none;background:var(--sapField_Focus_Background);box-shadow:none;outline:var(--sapContent_FocusWidth) var(--sapContent_FocusStyle) var(--fdInput_Error_Outline_Color);outline-offset:var(--fdInput_Outline_Offset)}.fd-step-input.is-warning{-webkit-box-shadow:var(--sapField_WarningShadow);background:var(--sapField_WarningBackgroundStyle);background-color:var(--sapField_WarningBackground);border:var(--sapField_WarningColor) var(--sapField_WarningBorderWidth) var(--sapField_WarningBorderStyle);box-shadow:var(--sapField_WarningShadow)}.fd-step-input.is-warning.is-hover,.fd-step-input.is-warning:hover{-webkit-box-shadow:var(--fdInput_Warning_Box_Shadow_Hover);background-color:var(--fdInput_Warning_Background_Color_Hover);border-color:var(--sapField_WarningColor);box-shadow:var(--fdInput_Warning_Box_Shadow_Hover)}.fd-step-input.is-warning.is-focus,.fd-step-input.is-warning:focus{background:var(--sapField_Focus_Background);outline-color:var(--fdInput_Warning_Outline_Color)}.fd-step-input.is-warning.is-focus.is-hover,.fd-step-input.is-warning.is-focus:hover,.fd-step-input.is-warning:focus.is-hover,.fd-step-input.is-warning:focus:hover{box-shadow:none}.fd-step-input.is-warning:focus-within{background:var(--sapField_Focus_Background);outline-color:var(--fdInput_Warning_Outline_Color)}.fd-step-input.is-warning:focus-within.is-hover,.fd-step-input.is-warning:focus-within:hover{box-shadow:none}.fd-step-input.is-warning.is-expanded,.fd-step-input.is-warning[aria-expanded=true]{-webkit-box-shadow:none;background:var(--sapField_Focus_Background);box-shadow:none;outline:var(--sapContent_FocusWidth) var(--sapContent_FocusStyle) var(--fdInput_Warning_Outline_Color);outline-offset:var(--fdInput_Outline_Offset)}.fd-step-input.is-alert{background:var(--sapField_WarningBackgroundStyle);background-color:var(--sapField_WarningBackground);border:var(--sapField_WarningColor) var(--sapField_WarningBorderWidth) var(--sapField_WarningBorderStyle)}.fd-step-input.is-alert.is-hover,.fd-step-input.is-alert:hover{-webkit-box-shadow:var(--fdInput_Warning_Box_Shadow_Hover);background-color:var(--fdInput_Warning_Background_Color_Hover);border-color:var(--sapField_WarningColor);box-shadow:var(--fdInput_Warning_Box_Shadow_Hover)}.fd-step-input.is-alert.is-focus,.fd-step-input.is-alert:focus{background:var(--sapField_Focus_Background);outline-color:var(--fdInput_Warning_Outline_Color)}.fd-step-input.is-alert.is-focus.is-hover,.fd-step-input.is-alert.is-focus:hover,.fd-step-input.is-alert:focus.is-hover,.fd-step-input.is-alert:focus:hover{box-shadow:none}.fd-step-input.is-alert:focus-within{background:var(--sapField_Focus_Background);outline-color:var(--fdInput_Warning_Outline_Color)}.fd-step-input.is-alert:focus-within.is-hover,.fd-step-input.is-alert:focus-within:hover{box-shadow:none}.fd-step-input.is-alert.is-expanded,.fd-step-input.is-alert[aria-expanded=true]{-webkit-box-shadow:none;background:var(--sapField_Focus_Background);box-shadow:none;outline:var(--sapContent_FocusWidth) var(--sapContent_FocusStyle) var(--fdInput_Warning_Outline_Color);outline-offset:var(--fdInput_Outline_Offset)}.fd-step-input.is-information{-webkit-box-shadow:var(--sapField_InformationShadow);background:var(--sapField_InformationBackgroundStyle);background-color:var(--sapField_InformationBackground);border:var(--sapField_InformationColor) var(--sapField_InformationBorderWidth) var(--sapField_InformationBorderStyle);box-shadow:var(--sapField_InformationShadow)}.fd-step-input.is-information.is-hover,.fd-step-input.is-information:hover{-webkit-box-shadow:var(--fdInput_Information_Box_Shadow_Hover);background-color:var(--fdInput_Information_Background_Color_Hover);border-color:var(--sapField_InformationColor);box-shadow:var(--fdInput_Information_Box_Shadow_Hover)}.fd-step-input.is-information.is-focus,.fd-step-input.is-information:focus{background:var(--sapField_Focus_Background);outline-color:var(--fdInput_Information_Outline_Color)}.fd-step-input.is-information.is-focus.is-hover,.fd-step-input.is-information.is-focus:hover,.fd-step-input.is-information:focus.is-hover,.fd-step-input.is-information:focus:hover{box-shadow:none}.fd-step-input.is-information:focus-within{background:var(--sapField_Focus_Background);outline-color:var(--fdInput_Information_Outline_Color)}.fd-step-input.is-information:focus-within.is-hover,.fd-step-input.is-information:focus-within:hover{box-shadow:none}.fd-step-input.is-information.is-expanded,.fd-step-input.is-information[aria-expanded=true]{-webkit-box-shadow:none;background:var(--sapField_Focus_Background);box-shadow:none;outline:var(--sapContent_FocusWidth) var(--sapContent_FocusStyle) var(--fdInput_Information_Outline_Color);outline-offset:var(--fdInput_Outline_Offset)}.fd-step-input.is-alert,.fd-step-input.is-error,.fd-step-input.is-warning{font-style:var(--fdInput_State_Text_Style);font-weight:var(--fdInput_State_Font_Weight)}.fd-step-input.is-alert::placeholder,.fd-step-input.is-error::placeholder,.fd-step-input.is-warning::placeholder{font-weight:var(--fdInput_State_Font_Weight)}.fd-step-input.is-alert.is-focus,.fd-step-input.is-alert:focus,.fd-step-input.is-error.is-focus,.fd-step-input.is-error:focus,.fd-step-input.is-information.is-focus,.fd-step-input.is-information:focus,.fd-step-input.is-warning.is-focus,.fd-step-input.is-warning:focus{outline-offset:var(--fdInput_Outline_Offset_States);z-index:5}.fd-step-input.is-error::placeholder{color:var(--sapField_TextColor)}.fd-step-input.is-disabled,.fd-step-input:disabled,.fd-step-input[aria-disabled=true]{opacity:var(--sapContent_DisabledOpacity);pointer-events:none}.fd-step-input.is-disabled::placeholder,.fd-step-input:disabled::placeholder,.fd-step-input[aria-disabled=true]::placeholder{color:var(--fdInput_Non_Interactive_State_Placeholder_Color)}.fd-step-input.is-readonly,.fd-step-input[aria-readonly=true],.fd-step-input[readonly]{-webkit-box-shadow:none;background:var(--sapField_ReadOnly_BackgroundStyle);background-color:var(--sapField_ReadOnly_Background);border-color:var(--sapField_ReadOnly_BorderColor);box-shadow:none}.fd-step-input.is-readonly::placeholder,.fd-step-input[aria-readonly=true]::placeholder,.fd-step-input[readonly]::placeholder{color:var(--fdInput_Non_Interactive_State_Placeholder_Color)}.fd-step-input.is-readonly.is-hover,.fd-step-input.is-readonly:hover,.fd-step-input[aria-readonly=true].is-hover,.fd-step-input[aria-readonly=true]:hover,.fd-step-input[readonly].is-hover,.fd-step-input[readonly]:hover{-webkit-box-shadow:none;background:var(--sapField_ReadOnly_BackgroundStyle);background-color:var(--sapField_ReadOnly_Background);border-color:var(--sapField_ReadOnly_BorderColor);box-shadow:none}.fd-step-input.is-readonly.is-focus,.fd-step-input.is-readonly:focus,.fd-step-input[aria-readonly=true].is-focus,.fd-step-input[aria-readonly=true]:focus,.fd-step-input[readonly].is-focus,.fd-step-input[readonly]:focus{-webkit-box-shadow:none;background:var(--sapField_ReadOnly_BackgroundStyle);background-color:var(--sapField_ReadOnly_Background);border-color:var(--sapField_ReadOnly_BorderColor);box-shadow:none;z-index:5}.fd-step-input .fd-step-input__button:first-child{border-right:var(--fdInputGroup_ControlButton_SideBorder)}.fd-step-input .fd-step-input__button:first-child[dir=rtl],[dir=rtl] .fd-step-input .fd-step-input__button:first-child{border-left:var(--fdInputGroup_ControlButton_SideBorder);border-right-style:none}.fd-step-input .fd-step-input__button:first-child.is-hover,.fd-step-input .fd-step-input__button:first-child:hover{border-right:var(--fdInputGroup_ControlButton_SideBorder_Active)}.fd-step-input .fd-step-input__button:first-child.is-hover[dir=rtl],.fd-step-input .fd-step-input__button:first-child:hover[dir=rtl],[dir=rtl] .fd-step-input .fd-step-input__button:first-child.is-hover,[dir=rtl] .fd-step-input .fd-step-input__button:first-child:hover{border-left:var(--fdInputGroup_ControlButton_SideBorder_Active);border-right-style:none}.fd-step-input .fd-step-input__button:first-child.is-active,.fd-step-input .fd-step-input__button:first-child:active{border-right:var(--fdInputGroup_ControlButton_SideBorder_Active)}.fd-step-input .fd-step-input__button:first-child.is-active[dir=rtl],.fd-step-input .fd-step-input__button:first-child:active[dir=rtl],[dir=rtl] .fd-step-input .fd-step-input__button:first-child.is-active,[dir=rtl] .fd-step-input .fd-step-input__button:first-child:active{border-left:var(--fdInputGroup_ControlButton_SideBorder_Active);border-right-style:none}.fd-step-input .fd-step-input__button:not(:first-child){border-left:var(--fdInputGroup_ControlButton_SideBorder)}.fd-step-input .fd-step-input__button:not(:first-child)[dir=rtl],[dir=rtl] .fd-step-input .fd-step-input__button:not(:first-child){border-left-style:none;border-right:var(--fdInputGroup_ControlButton_SideBorder)}.fd-step-input .fd-step-input__button:not(:first-child).is-hover,.fd-step-input .fd-step-input__button:not(:first-child):hover{border-left:var(--fdInputGroup_ControlButton_SideBorder_Active)}.fd-step-input .fd-step-input__button:not(:first-child).is-hover[dir=rtl],.fd-step-input .fd-step-input__button:not(:first-child):hover[dir=rtl],[dir=rtl] .fd-step-input .fd-step-input__button:not(:first-child).is-hover,[dir=rtl] .fd-step-input .fd-step-input__button:not(:first-child):hover{border-left-style:none;border-right:var(--fdInputGroup_ControlButton_SideBorder_Active)}.fd-step-input .fd-step-input__button:not(:first-child).is-active,.fd-step-input .fd-step-input__button:not(:first-child):active{border-left:var(--fdInputGroup_ControlButton_SideBorder_Active)}.fd-step-input .fd-step-input__button:not(:first-child).is-active[dir=rtl],.fd-step-input .fd-step-input__button:not(:first-child):active[dir=rtl],[dir=rtl] .fd-step-input .fd-step-input__button:not(:first-child).is-active,[dir=rtl] .fd-step-input .fd-step-input__button:not(:first-child):active{border-left-style:none;border-right:var(--fdInputGroup_ControlButton_SideBorder_Active)}.fd-step-input .fd-step-input__addon:first-child .fd-step-input__button{border-right:var(--fdInputGroup_ControlButton_SideBorder)}.fd-step-input .fd-step-input__addon:first-child .fd-step-input__button[dir=rtl],[dir=rtl] .fd-step-input .fd-step-input__addon:first-child .fd-step-input__button{border-left:var(--fdInputGroup_ControlButton_SideBorder);border-right-style:none}.fd-step-input .fd-step-input__addon:first-child .fd-step-input__button.is-hover,.fd-step-input .fd-step-input__addon:first-child .fd-step-input__button:hover{border-right:var(--fdInputGroup_ControlButton_SideBorder_Active)}.fd-step-input .fd-step-input__addon:first-child .fd-step-input__button.is-hover[dir=rtl],.fd-step-input .fd-step-input__addon:first-child .fd-step-input__button:hover[dir=rtl],[dir=rtl] .fd-step-input .fd-step-input__addon:first-child .fd-step-input__button.is-hover,[dir=rtl] .fd-step-input .fd-step-input__addon:first-child .fd-step-input__button:hover{border-left:var(--fdInputGroup_ControlButton_SideBorder_Active);border-right-style:none}.fd-step-input .fd-step-input__addon:first-child .fd-step-input__button.is-active,.fd-step-input .fd-step-input__addon:first-child .fd-step-input__button:active{border-right:var(--fdInputGroup_ControlButton_SideBorder_Active)}.fd-step-input .fd-step-input__addon:first-child .fd-step-input__button.is-active[dir=rtl],.fd-step-input .fd-step-input__addon:first-child .fd-step-input__button:active[dir=rtl],[dir=rtl] .fd-step-input .fd-step-input__addon:first-child .fd-step-input__button.is-active,[dir=rtl] .fd-step-input .fd-step-input__addon:first-child .fd-step-input__button:active{border-left:var(--fdInputGroup_ControlButton_SideBorder_Active);border-right-style:none}.fd-step-input .fd-step-input__addon:not(:first-child) .fd-step-input__button{border-left:var(--fdInputGroup_ControlButton_SideBorder)}.fd-step-input .fd-step-input__addon:not(:first-child) .fd-step-input__button[dir=rtl],[dir=rtl] .fd-step-input .fd-step-input__addon:not(:first-child) .fd-step-input__button{border-left-style:none;border-right:var(--fdInputGroup_ControlButton_SideBorder)}.fd-step-input .fd-step-input__addon:not(:first-child) .fd-step-input__button.is-hover,.fd-step-input .fd-step-input__addon:not(:first-child) .fd-step-input__button:hover{border-left:var(--fdInputGroup_ControlButton_SideBorder_Active)}.fd-step-input .fd-step-input__addon:not(:first-child) .fd-step-input__button.is-hover[dir=rtl],.fd-step-input .fd-step-input__addon:not(:first-child) .fd-step-input__button:hover[dir=rtl],[dir=rtl] .fd-step-input .fd-step-input__addon:not(:first-child) .fd-step-input__button.is-hover,[dir=rtl] .fd-step-input .fd-step-input__addon:not(:first-child) .fd-step-input__button:hover{border-left-style:none;border-right:var(--fdInputGroup_ControlButton_SideBorder_Active)}.fd-step-input .fd-step-input__addon:not(:first-child) .fd-step-input__button.is-active,.fd-step-input .fd-step-input__addon:not(:first-child) .fd-step-input__button:active{border-left:var(--fdInputGroup_ControlButton_SideBorder_Active)}.fd-step-input .fd-step-input__addon:not(:first-child) .fd-step-input__button.is-active[dir=rtl],.fd-step-input .fd-step-input__addon:not(:first-child) .fd-step-input__button:active[dir=rtl],[dir=rtl] .fd-step-input .fd-step-input__addon:not(:first-child) .fd-step-input__button.is-active,[dir=rtl] .fd-step-input .fd-step-input__addon:not(:first-child) .fd-step-input__button:active{border-left-style:none;border-right:var(--fdInputGroup_ControlButton_SideBorder_Active)}.fd-step-input .fd-step-input__button{background:var(--fdInput_Group_Button_Background);background-color:var(--fdButtonBackgroundColor);border:none;border-radius:var(--fdInput_Group_Button_Border_Raduis);color:var(--fdInput_Group_Button_Text_Color);overflow:hidden;position:relative;text-overflow:ellipsis;white-space:nowrap;z-index:auto!important}.fd-step-input .fd-step-input__button:before{display:none!important}.fd-step-input .fd-step-input__button:after{border-radius:var(--fdInput_Outline_Border_Radius)}.fd-step-input .fd-step-input__button.is-hover,.fd-step-input .fd-step-input__button:hover{--fdInput_Group_Button_Text_Color:var(--fdInput_Group_Button_Hover_Text_Color);--fdButtonBackgroundColor:var(--fdInput_Group_Button_Hover_Background);box-shadow:var(--fdInput_Group_Button_Box_Shadow)}.fd-step-input .fd-step-input__button.is-active,.fd-step-input .fd-step-input__button:active{-webkit-box-shadow:var(--fdInput_Group_Button_Box_Shadow);background:var(--fdInput_Group_Button_Active_Background);box-shadow:var(--fdInput_Group_Button_Box_Shadow);color:var(--fdInput_Group_Button_Active_Text_Color)}.fd-step-input.is-success.is-focus,.fd-step-input.is-success:focus{z-index:5}.fd-step-input.is-success.is-focus .fd-step-input__button,.fd-step-input.is-success:focus .fd-step-input__button{-webkit-box-shadow:var(--fdInput_Group_Button_Success_Active_Box_Shadow);--fdButtonBackgroundColor:var(--fdInput_Group_Button_Active_Background);box-shadow:var(--fdInput_Group_Button_Success_Active_Box_Shadow);color:var(--fdInput_Group_Button_Success_Active_Text_Color)}.fd-step-input.is-success.is-focus .fd-step-input__button.is-hover,.fd-step-input.is-success.is-focus .fd-step-input__button:hover,.fd-step-input.is-success:focus .fd-step-input__button.is-hover,.fd-step-input.is-success:focus .fd-step-input__button:hover{--fdButtonBackgroundColor:var(--fdInput_Group_Button_Active_Background)}.fd-step-input.is-success.is-expanded .fd-step-input__button,.fd-step-input.is-success[aria-expanded=true] .fd-step-input__button{-webkit-box-shadow:var(--fdInput_Group_Button_Success_Active_Box_Shadow);--fdButtonBackgroundColor:var(--fdInput_Group_Button_Active_Background);box-shadow:var(--fdInput_Group_Button_Success_Active_Box_Shadow);color:var(--fdInput_Group_Button_Success_Active_Text_Color)}.fd-step-input.is-success.is-expanded .fd-step-input__button.is-hover,.fd-step-input.is-success.is-expanded .fd-step-input__button:hover,.fd-step-input.is-success[aria-expanded=true] .fd-step-input__button.is-hover,.fd-step-input.is-success[aria-expanded=true] .fd-step-input__button:hover{--fdButtonBackgroundColor:var(--fdInput_Group_Button_Active_Background)}.fd-step-input.is-success .fd-step-input__button.is-active,.fd-step-input.is-success .fd-step-input__button.is-hover,.fd-step-input.is-success .fd-step-input__button:active,.fd-step-input.is-success .fd-step-input__button:hover{box-shadow:var(--fdInput_Group_Button_Success_Active_Box_Shadow)}.fd-step-input.is-success .fd-step-input__button.is-active,.fd-step-input.is-success .fd-step-input__button:active{color:var(--fdInput_Group_Button_Success_Active_Text_Color)}.fd-step-input.is-error.is-focus,.fd-step-input.is-error:focus{z-index:5}.fd-step-input.is-error.is-focus .fd-step-input__button,.fd-step-input.is-error:focus .fd-step-input__button{-webkit-box-shadow:var(--fdInput_Group_Button_Error_Active_Box_Shadow);--fdButtonBackgroundColor:var(--fdInput_Group_Button_Active_Background);box-shadow:var(--fdInput_Group_Button_Error_Active_Box_Shadow);color:var(--fdInput_Group_Button_Error_Active_Text_Color)}.fd-step-input.is-error.is-focus .fd-step-input__button.is-hover,.fd-step-input.is-error.is-focus .fd-step-input__button:hover,.fd-step-input.is-error:focus .fd-step-input__button.is-hover,.fd-step-input.is-error:focus .fd-step-input__button:hover{--fdButtonBackgroundColor:var(--fdInput_Group_Button_Active_Background)}.fd-step-input.is-error.is-expanded .fd-step-input__button,.fd-step-input.is-error[aria-expanded=true] .fd-step-input__button{-webkit-box-shadow:var(--fdInput_Group_Button_Error_Active_Box_Shadow);--fdButtonBackgroundColor:var(--fdInput_Group_Button_Active_Background);box-shadow:var(--fdInput_Group_Button_Error_Active_Box_Shadow);color:var(--fdInput_Group_Button_Error_Active_Text_Color)}.fd-step-input.is-error.is-expanded .fd-step-input__button.is-hover,.fd-step-input.is-error.is-expanded .fd-step-input__button:hover,.fd-step-input.is-error[aria-expanded=true] .fd-step-input__button.is-hover,.fd-step-input.is-error[aria-expanded=true] .fd-step-input__button:hover{--fdButtonBackgroundColor:var(--fdInput_Group_Button_Active_Background)}.fd-step-input.is-error .fd-step-input__button.is-active,.fd-step-input.is-error .fd-step-input__button.is-hover,.fd-step-input.is-error .fd-step-input__button:active,.fd-step-input.is-error .fd-step-input__button:hover{box-shadow:var(--fdInput_Group_Button_Error_Active_Box_Shadow)}.fd-step-input.is-error .fd-step-input__button.is-active,.fd-step-input.is-error .fd-step-input__button:active{color:var(--fdInput_Group_Button_Error_Active_Text_Color)}.fd-step-input.is-warning.is-focus,.fd-step-input.is-warning:focus{z-index:5}.fd-step-input.is-warning.is-focus .fd-step-input__button,.fd-step-input.is-warning:focus .fd-step-input__button{-webkit-box-shadow:var(--fdInput_Group_Button_Warning_Active_Box_Shadow);--fdButtonBackgroundColor:var(--fdInput_Group_Button_Active_Background);box-shadow:var(--fdInput_Group_Button_Warning_Active_Box_Shadow);color:var(--fdInput_Group_Button_Warning_Active_Text_Color)}.fd-step-input.is-warning.is-focus .fd-step-input__button.is-hover,.fd-step-input.is-warning.is-focus .fd-step-input__button:hover,.fd-step-input.is-warning:focus .fd-step-input__button.is-hover,.fd-step-input.is-warning:focus .fd-step-input__button:hover{--fdButtonBackgroundColor:var(--fdInput_Group_Button_Active_Background)}.fd-step-input.is-warning.is-expanded .fd-step-input__button,.fd-step-input.is-warning[aria-expanded=true] .fd-step-input__button{-webkit-box-shadow:var(--fdInput_Group_Button_Warning_Active_Box_Shadow);--fdButtonBackgroundColor:var(--fdInput_Group_Button_Active_Background);box-shadow:var(--fdInput_Group_Button_Warning_Active_Box_Shadow);color:var(--fdInput_Group_Button_Warning_Active_Text_Color)}.fd-step-input.is-warning.is-expanded .fd-step-input__button.is-hover,.fd-step-input.is-warning.is-expanded .fd-step-input__button:hover,.fd-step-input.is-warning[aria-expanded=true] .fd-step-input__button.is-hover,.fd-step-input.is-warning[aria-expanded=true] .fd-step-input__button:hover{--fdButtonBackgroundColor:var(--fdInput_Group_Button_Active_Background)}.fd-step-input.is-warning .fd-step-input__button.is-active,.fd-step-input.is-warning .fd-step-input__button.is-hover,.fd-step-input.is-warning .fd-step-input__button:active,.fd-step-input.is-warning .fd-step-input__button:hover{box-shadow:var(--fdInput_Group_Button_Warning_Active_Box_Shadow)}.fd-step-input.is-warning .fd-step-input__button.is-active,.fd-step-input.is-warning .fd-step-input__button:active{color:var(--fdInput_Group_Button_Warning_Active_Text_Color)}.fd-step-input.is-alert.is-focus,.fd-step-input.is-alert:focus{z-index:5}.fd-step-input.is-alert.is-focus .fd-step-input__button,.fd-step-input.is-alert:focus .fd-step-input__button{-webkit-box-shadow:var(--fdInput_Group_Button_Warning_Active_Box_Shadow);--fdButtonBackgroundColor:var(--fdInput_Group_Button_Active_Background);box-shadow:var(--fdInput_Group_Button_Warning_Active_Box_Shadow);color:var(--fdInput_Group_Button_Warning_Active_Text_Color)}.fd-step-input.is-alert.is-focus .fd-step-input__button.is-hover,.fd-step-input.is-alert.is-focus .fd-step-input__button:hover,.fd-step-input.is-alert:focus .fd-step-input__button.is-hover,.fd-step-input.is-alert:focus .fd-step-input__button:hover{--fdButtonBackgroundColor:var(--fdInput_Group_Button_Active_Background)}.fd-step-input.is-alert.is-expanded .fd-step-input__button,.fd-step-input.is-alert[aria-expanded=true] .fd-step-input__button{-webkit-box-shadow:var(--fdInput_Group_Button_Warning_Active_Box_Shadow);--fdButtonBackgroundColor:var(--fdInput_Group_Button_Active_Background);box-shadow:var(--fdInput_Group_Button_Warning_Active_Box_Shadow);color:var(--fdInput_Group_Button_Warning_Active_Text_Color)}.fd-step-input.is-alert.is-expanded .fd-step-input__button.is-hover,.fd-step-input.is-alert.is-expanded .fd-step-input__button:hover,.fd-step-input.is-alert[aria-expanded=true] .fd-step-input__button.is-hover,.fd-step-input.is-alert[aria-expanded=true] .fd-step-input__button:hover{--fdButtonBackgroundColor:var(--fdInput_Group_Button_Active_Background)}.fd-step-input.is-alert .fd-step-input__button.is-active,.fd-step-input.is-alert .fd-step-input__button.is-hover,.fd-step-input.is-alert .fd-step-input__button:active,.fd-step-input.is-alert .fd-step-input__button:hover{box-shadow:var(--fdInput_Group_Button_Warning_Active_Box_Shadow)}.fd-step-input.is-alert .fd-step-input__button.is-active,.fd-step-input.is-alert .fd-step-input__button:active{color:var(--fdInput_Group_Button_Warning_Active_Text_Color)}.fd-step-input.is-information.is-focus,.fd-step-input.is-information:focus{z-index:5}.fd-step-input.is-information.is-focus .fd-step-input__button,.fd-step-input.is-information:focus .fd-step-input__button{-webkit-box-shadow:var(--fdInput_Group_Button_Information_Active_Box_Shadow);--fdButtonBackgroundColor:var(--fdInput_Group_Button_Active_Background);box-shadow:var(--fdInput_Group_Button_Information_Active_Box_Shadow);color:var(--fdInput_Group_Button_Information_Active_Text_Color)}.fd-step-input.is-information.is-focus .fd-step-input__button.is-hover,.fd-step-input.is-information.is-focus .fd-step-input__button:hover,.fd-step-input.is-information:focus .fd-step-input__button.is-hover,.fd-step-input.is-information:focus .fd-step-input__button:hover{--fdButtonBackgroundColor:var(--fdInput_Group_Button_Active_Background)}.fd-step-input.is-information.is-expanded .fd-step-input__button,.fd-step-input.is-information[aria-expanded=true] .fd-step-input__button{-webkit-box-shadow:var(--fdInput_Group_Button_Information_Active_Box_Shadow);--fdButtonBackgroundColor:var(--fdInput_Group_Button_Active_Background);box-shadow:var(--fdInput_Group_Button_Information_Active_Box_Shadow);color:var(--fdInput_Group_Button_Information_Active_Text_Color)}.fd-step-input.is-information.is-expanded .fd-step-input__button.is-hover,.fd-step-input.is-information.is-expanded .fd-step-input__button:hover,.fd-step-input.is-information[aria-expanded=true] .fd-step-input__button.is-hover,.fd-step-input.is-information[aria-expanded=true] .fd-step-input__button:hover{--fdButtonBackgroundColor:var(--fdInput_Group_Button_Active_Background)}.fd-step-input.is-information .fd-step-input__button.is-active,.fd-step-input.is-information .fd-step-input__button.is-hover,.fd-step-input.is-information .fd-step-input__button:active,.fd-step-input.is-information .fd-step-input__button:hover{box-shadow:var(--fdInput_Group_Button_Information_Active_Box_Shadow)}.fd-step-input.is-information .fd-step-input__button.is-active,.fd-step-input.is-information .fd-step-input__button:active{color:var(--fdInput_Group_Button_Information_Active_Text_Color)}.fd-step-input .fd-step-input__button.fd-button{min-width:var(--fdStepInput_Button_Width);width:var(--fdStepInput_Button_Width)}.fd-step-input .fd-step-input__button.fd-button:after,.fd-step-input .fd-step-input__button.fd-button:before{font-size:.875rem;margin:0}.fd-step-input .fd-step-input__button.fd-button.is-focus,.fd-step-input .fd-step-input__button.fd-button:focus{outline:none;z-index:5}.fd-step-input .fd-step-input__button.fd-button.is-focus:after,.fd-step-input .fd-step-input__button.fd-button:focus:after{display:none}.fd-step-input .fd-step-input__button.fd-button.is-focus.is-hover,.fd-step-input .fd-step-input__button.fd-button.is-focus:hover,.fd-step-input .fd-step-input__button.fd-button:focus.is-hover,.fd-step-input .fd-step-input__button.fd-button:focus:hover{z-index:auto}.fd-step-input__input.fd-input{--fdInput_Field_Padding:0 .25rem;-webkit-box-shadow:none;background:none;background-color:transparent;border:none;box-shadow:none;margin:0;text-align:right}.fd-step-input__input.fd-input[dir=rtl],[dir=rtl] .fd-step-input__input.fd-input{text-align:left}.fd-step-input__input.fd-input.is-focus,.fd-step-input__input.fd-input.is-hover,.fd-step-input__input.fd-input:focus,.fd-step-input__input.fd-input:hover{-webkit-box-shadow:none;background:none;background-color:var(transparent, transparent);box-shadow:none}.fd-step-input__input.fd-input.is-focus,.fd-step-input__input.fd-input:focus{outline:none;z-index:5}.fd-step-input__container{align-items:center;display:flex}.fd-step-input.is-error .fd-step-input__button.fd-button,.fd-step-input.is-information .fd-step-input__button.fd-button,.fd-step-input.is-warning .fd-step-input__button.fd-button{min-width:var(--fdStepInput_Button_Width_Semantic_Cozy);width:var(--fdStepInput_Button_Width_Semantic_Cozy)}.fd-step-input[class*=-compact],.fd-step-input[class*=-condensed],[class*=-compact] .fd-step-input:not([class*=-cozy]),[class*=-condensed] .fd-step-input:not([class*=-cozy]){--fdStepInput_Button_Width:var(--fdStepInput_Button_Width_Compact);--fdStepInput_Bordered_Button_Width:var(--fdStepInput_Button_Width_Semantic_Compact);--fdInput_Field_Compact_Padding:0 .25rem;height:1.625rem;min-height:1.625rem}.fd-step-input[class*=-compact] .fd-step-input__input.fd-input,.fd-step-input[class*=-condensed] .fd-step-input__input.fd-input,[class*=-compact] .fd-step-input:not([class*=-cozy]) .fd-step-input__input.fd-input,[class*=-condensed] .fd-step-input:not([class*=-cozy]) .fd-step-input__input.fd-input{height:100%}.fd-step-input[class*=-compact].is-readonly,.fd-step-input[class*=-condensed].is-readonly,[class*=-compact] .fd-step-input:not([class*=-cozy]).is-readonly,[class*=-condensed] .fd-step-input:not([class*=-cozy]).is-readonly{--fdInput_Field_Compact_Padding:0 .5rem}.fd-step-input.is-readonly .fd-step-input__input.fd-input{--fdInput_Field_Padding:0 .625rem}.fd-step-input.is-readonly .fd-step-input__button.fd-button{display:none}.fd-step-input.is-readonly:focus-within{border-radius:var(--sapField_BorderCornerRadius)}.fd-step-input.is-readonly:focus-within .fd-step-input__input{background:transparent}.fd-step-input.is-focus,.fd-step-input:focus{z-index:5}.fd-step-input.is-focus.is-error .fd-step-input__button.fd-button:not(:hover),.fd-step-input.is-focus.is-information .fd-step-input__button.fd-button:not(:hover),.fd-step-input.is-focus.is-success .fd-step-input__button.fd-button:not(:hover),.fd-step-input.is-focus.is-warning .fd-step-input__button.fd-button:not(:hover),.fd-step-input:focus.is-error .fd-step-input__button.fd-button:not(:hover),.fd-step-input:focus.is-information .fd-step-input__button.fd-button:not(:hover),.fd-step-input:focus.is-success .fd-step-input__button.fd-button:not(:hover),.fd-step-input:focus.is-warning .fd-step-input__button.fd-button:not(:hover){box-shadow:none}.fd-step-input{display:flex}\n"] }]
         }], ctorParameters: function () { return [{ type: i0.ChangeDetectorRef }, { type: i0.ElementRef }, { type: i1$1.NgControl, decorators: [{
                     type: Optional
@@ -11104,57 +11027,41 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.1.0", ngImpor
                 }, {
                     type: Inject,
                     args: [FD_FORM_FIELD_CONTROL]
-                }] }, { type: StepInputConfig }, { type: i0.Renderer2 }, { type: i3$2.RtlService, decorators: [{
+                }] }, { type: StepInputConfig }, { type: i0.Renderer2 }, { type: i3$1.RtlService, decorators: [{
                     type: Optional
                 }] }, { type: undefined, decorators: [{
                     type: Inject,
                     args: [LOCALE_ID]
-                }] }, { type: i5$2.ContentDensityObserver }]; }, propDecorators: { description: [{
+                }] }, { type: i5$1.ContentDensityObserver }]; }, propDecorators: { description: [{
                 type: Input
             }] } });
 
 class PlatformStepInputModule {
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.1.0", ngImport: i0, type: PlatformStepInputModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
-    static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "16.1.0", ngImport: i0, type: PlatformStepInputModule, declarations: [StepInputDecrementDirective,
+    static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "16.1.0", ngImport: i0, type: PlatformStepInputModule, imports: [StepInputDecrementDirective,
+            StepInputIncrementDirective,
+            StepInputControlDirective,
+            NumberStepInputComponent], exports: [StepInputDecrementDirective,
             StepInputIncrementDirective,
             StepInputControlDirective,
-            NumberStepInputComponent], imports: [CommonModule,
-            FormsModule,
-            PipeModule,
-            ButtonModule,
-            OnlyDigitsModule,
-            FormInputMessageGroupModule,
-            FormMessageModule,
-            ContentDensityModule], exports: [NumberStepInputComponent, ContentDensityModule] }); }
-    static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "16.1.0", ngImport: i0, type: PlatformStepInputModule, imports: [CommonModule,
-            FormsModule,
-            PipeModule,
-            ButtonModule,
-            OnlyDigitsModule,
-            FormInputMessageGroupModule,
-            FormMessageModule,
-            ContentDensityModule, ContentDensityModule] }); }
+            NumberStepInputComponent] }); }
+    static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "16.1.0", ngImport: i0, type: PlatformStepInputModule, imports: [NumberStepInputComponent] }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.1.0", ngImport: i0, type: PlatformStepInputModule, decorators: [{
             type: NgModule,
             args: [{
                     imports: [
-                        CommonModule,
-                        FormsModule,
-                        PipeModule,
-                        ButtonModule,
-                        OnlyDigitsModule,
-                        FormInputMessageGroupModule,
-                        FormMessageModule,
-                        ContentDensityModule
-                    ],
-                    declarations: [
                         StepInputDecrementDirective,
                         StepInputIncrementDirective,
                         StepInputControlDirective,
                         NumberStepInputComponent
                     ],
-                    exports: [NumberStepInputComponent, ContentDensityModule]
+                    exports: [
+                        StepInputDecrementDirective,
+                        StepInputIncrementDirective,
+                        StepInputControlDirective,
+                        NumberStepInputComponent
+                    ]
                 }]
         }] });
 
@@ -11255,11 +11162,11 @@ class PlatformTimePickerComponent extends BaseInput {
         this.onTouched();
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.1.0", ngImport: i0, type: PlatformTimePickerComponent, deps: [{ token: i0.ChangeDetectorRef }, { token: i0.ElementRef }, { token: i1$1.NgControl, optional: true, self: true }, { token: i1$1.ControlContainer, optional: true, skipSelf: true }, { token: i1$1.NgForm, optional: true, skipSelf: true }, { token: FD_FORM_FIELD, host: true, optional: true, skipSelf: true }, { token: FD_FORM_FIELD_CONTROL, host: true, optional: true, skipSelf: true }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.1.0", type: PlatformTimePickerComponent, selector: "fdp-time-picker", inputs: { value: "value", time: "time", spinnerButtons: "spinnerButtons", meridian: "meridian", displaySeconds: "displaySeconds", displayMinutes: "displayMinutes", displayHours: "displayHours", placeholder: "placeholder", timePickerInputLabel: "timePickerInputLabel", allowNull: "allowNull", tablet: "tablet", placement: "placement", state: "state", buttonFocusable: "buttonFocusable", useValidation: "useValidation", keepTwoDigitsTime: "keepTwoDigitsTime", displayFormat: "displayFormat", parseFormat: "parseFormat" }, outputs: { isOpenChange: "isOpenChange" }, providers: [{ provide: FD_FORM_FIELD_CONTROL, useExisting: PlatformTimePickerComponent, multi: true }], viewQueries: [{ propertyName: "timePickerComponent", first: true, predicate: TimePickerComponent, descendants: true }], usesInheritance: true, ngImport: i0, template: "<fd-time-picker\n    [attr.aria-label]=\"ariaLabel\"\n    [attr.ariaLabelledBy]=\"ariaLabelledBy\"\n    [attr.ariaDescribedBy]=\"ariaDescribedBy\"\n    [inputId]=\"id\"\n    [required]=\"required\"\n    [time]=\"time\"\n    [meridian]=\"meridian\"\n    [disabled]=\"disabled\"\n    [displayFormat]=\"displayFormat\"\n    [spinnerButtons]=\"spinnerButtons\"\n    [displaySeconds]=\"displaySeconds\"\n    [displayMinutes]=\"displayMinutes\"\n    [displayHours]=\"displayHours\"\n    [placeholder]=\"placeholder\"\n    [timePickerInputLabel]=\"timePickerInputLabel\"\n    [allowNull]=\"allowNull\"\n    [tablet]=\"tablet\"\n    [placement]=\"placement\"\n    [parseFormat]=\"parseFormat\"\n    [state]=\"state\"\n    [buttonFocusable]=\"buttonFocusable\"\n    [useValidation]=\"useValidation\"\n    [keepTwoDigitsTime]=\"keepTwoDigitsTime\"\n    (isOpenChange)=\"handleOpenChange($event)\"\n    (ngModelChange)=\"handleTimeChange($event)\"\n    [(ngModel)]=\"value\"\n>\n    <ng-content></ng-content>\n</fd-time-picker>\n", dependencies: [{ kind: "directive", type: i1$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$1.RequiredValidator, selector: ":not([type=checkbox])[required][formControlName],:not([type=checkbox])[required][formControl],:not([type=checkbox])[required][ngModel]", inputs: ["required"] }, { kind: "directive", type: i1$1.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "component", type: i2$5.TimePickerComponent, selector: "fd-time-picker", inputs: ["time", "inputId", "disabled", "required", "spinnerButtons", "meridian", "displaySeconds", "displayMinutes", "displayHours", "placeholder", "timePickerInputLabel", "timePickerButtonLabel", "ariaLabelledBy", "allowNull", "tablet", "message", "messageType", "messageTriggers", "placement", "useValidation", "state", "buttonFocusable", "keepTwoDigitsTime", "displayFormat", "parseFormat", "valueStateSuccessMessage", "valueStateInformationMessage", "valueStateWarningMessage", "valueStateErrorMessage"], outputs: ["isOpenChange"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.1.0", type: PlatformTimePickerComponent, isStandalone: true, selector: "fdp-time-picker", inputs: { value: "value", time: "time", spinnerButtons: "spinnerButtons", meridian: "meridian", displaySeconds: "displaySeconds", displayMinutes: "displayMinutes", displayHours: "displayHours", placeholder: "placeholder", timePickerInputLabel: "timePickerInputLabel", allowNull: "allowNull", tablet: "tablet", placement: "placement", state: "state", buttonFocusable: "buttonFocusable", useValidation: "useValidation", keepTwoDigitsTime: "keepTwoDigitsTime", displayFormat: "displayFormat", parseFormat: "parseFormat" }, outputs: { isOpenChange: "isOpenChange" }, providers: [{ provide: FD_FORM_FIELD_CONTROL, useExisting: PlatformTimePickerComponent, multi: true }], viewQueries: [{ propertyName: "timePickerComponent", first: true, predicate: TimePickerComponent, descendants: true }], usesInheritance: true, ngImport: i0, template: "<fd-time-picker\n    [attr.aria-label]=\"ariaLabel\"\n    [attr.ariaLabelledBy]=\"ariaLabelledBy\"\n    [attr.ariaDescribedBy]=\"ariaDescribedBy\"\n    [inputId]=\"id\"\n    [required]=\"required\"\n    [time]=\"time\"\n    [meridian]=\"meridian\"\n    [disabled]=\"disabled\"\n    [displayFormat]=\"displayFormat\"\n    [spinnerButtons]=\"spinnerButtons\"\n    [displaySeconds]=\"displaySeconds\"\n    [displayMinutes]=\"displayMinutes\"\n    [displayHours]=\"displayHours\"\n    [placeholder]=\"placeholder\"\n    [timePickerInputLabel]=\"timePickerInputLabel\"\n    [allowNull]=\"allowNull\"\n    [tablet]=\"tablet\"\n    [placement]=\"placement\"\n    [parseFormat]=\"parseFormat\"\n    [state]=\"state\"\n    [buttonFocusable]=\"buttonFocusable\"\n    [useValidation]=\"useValidation\"\n    [keepTwoDigitsTime]=\"keepTwoDigitsTime\"\n    (isOpenChange)=\"handleOpenChange($event)\"\n    (ngModelChange)=\"handleTimeChange($event)\"\n    [(ngModel)]=\"value\"\n>\n    <ng-content></ng-content>\n</fd-time-picker>\n", dependencies: [{ kind: "ngmodule", type: TimePickerModule }, { kind: "component", type: i2$5.TimePickerComponent, selector: "fd-time-picker", inputs: ["time", "inputId", "disabled", "required", "spinnerButtons", "meridian", "displaySeconds", "displayMinutes", "displayHours", "placeholder", "timePickerInputLabel", "timePickerButtonLabel", "ariaLabelledBy", "allowNull", "tablet", "message", "messageType", "messageTriggers", "placement", "useValidation", "state", "buttonFocusable", "keepTwoDigitsTime", "displayFormat", "parseFormat", "valueStateSuccessMessage", "valueStateInformationMessage", "valueStateWarningMessage", "valueStateErrorMessage"], outputs: ["isOpenChange"] }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$1.RequiredValidator, selector: ":not([type=checkbox])[required][formControlName],:not([type=checkbox])[required][formControl],:not([type=checkbox])[required][ngModel]", inputs: ["required"] }, { kind: "directive", type: i1$1.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.1.0", ngImport: i0, type: PlatformTimePickerComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'fdp-time-picker', changeDetection: ChangeDetectionStrategy.OnPush, providers: [{ provide: FD_FORM_FIELD_CONTROL, useExisting: PlatformTimePickerComponent, multi: true }], template: "<fd-time-picker\n    [attr.aria-label]=\"ariaLabel\"\n    [attr.ariaLabelledBy]=\"ariaLabelledBy\"\n    [attr.ariaDescribedBy]=\"ariaDescribedBy\"\n    [inputId]=\"id\"\n    [required]=\"required\"\n    [time]=\"time\"\n    [meridian]=\"meridian\"\n    [disabled]=\"disabled\"\n    [displayFormat]=\"displayFormat\"\n    [spinnerButtons]=\"spinnerButtons\"\n    [displaySeconds]=\"displaySeconds\"\n    [displayMinutes]=\"displayMinutes\"\n    [displayHours]=\"displayHours\"\n    [placeholder]=\"placeholder\"\n    [timePickerInputLabel]=\"timePickerInputLabel\"\n    [allowNull]=\"allowNull\"\n    [tablet]=\"tablet\"\n    [placement]=\"placement\"\n    [parseFormat]=\"parseFormat\"\n    [state]=\"state\"\n    [buttonFocusable]=\"buttonFocusable\"\n    [useValidation]=\"useValidation\"\n    [keepTwoDigitsTime]=\"keepTwoDigitsTime\"\n    (isOpenChange)=\"handleOpenChange($event)\"\n    (ngModelChange)=\"handleTimeChange($event)\"\n    [(ngModel)]=\"value\"\n>\n    <ng-content></ng-content>\n</fd-time-picker>\n" }]
+            args: [{ selector: 'fdp-time-picker', changeDetection: ChangeDetectionStrategy.OnPush, providers: [{ provide: FD_FORM_FIELD_CONTROL, useExisting: PlatformTimePickerComponent, multi: true }], standalone: true, imports: [TimePickerModule, FormsModule], template: "<fd-time-picker\n    [attr.aria-label]=\"ariaLabel\"\n    [attr.ariaLabelledBy]=\"ariaLabelledBy\"\n    [attr.ariaDescribedBy]=\"ariaDescribedBy\"\n    [inputId]=\"id\"\n    [required]=\"required\"\n    [time]=\"time\"\n    [meridian]=\"meridian\"\n    [disabled]=\"disabled\"\n    [displayFormat]=\"displayFormat\"\n    [spinnerButtons]=\"spinnerButtons\"\n    [displaySeconds]=\"displaySeconds\"\n    [displayMinutes]=\"displayMinutes\"\n    [displayHours]=\"displayHours\"\n    [placeholder]=\"placeholder\"\n    [timePickerInputLabel]=\"timePickerInputLabel\"\n    [allowNull]=\"allowNull\"\n    [tablet]=\"tablet\"\n    [placement]=\"placement\"\n    [parseFormat]=\"parseFormat\"\n    [state]=\"state\"\n    [buttonFocusable]=\"buttonFocusable\"\n    [useValidation]=\"useValidation\"\n    [keepTwoDigitsTime]=\"keepTwoDigitsTime\"\n    (isOpenChange)=\"handleOpenChange($event)\"\n    (ngModelChange)=\"handleTimeChange($event)\"\n    [(ngModel)]=\"value\"\n>\n    <ng-content></ng-content>\n</fd-time-picker>\n" }]
         }], ctorParameters: function () { return [{ type: i0.ChangeDetectorRef }, { type: i0.ElementRef }, { type: i1$1.NgControl, decorators: [{
                     type: Optional
                 }, {
@@ -11335,15 +11242,14 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.1.0", ngImpor
 
 class PlatformTimePickerModule {
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.1.0", ngImport: i0, type: PlatformTimePickerModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
-    static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "16.1.0", ngImport: i0, type: PlatformTimePickerModule, declarations: [PlatformTimePickerComponent], imports: [CommonModule, FormsModule, ReactiveFormsModule, TimePickerModule, PipeModule, ContentDensityModule], exports: [PlatformTimePickerComponent, ContentDensityModule] }); }
-    static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "16.1.0", ngImport: i0, type: PlatformTimePickerModule, imports: [CommonModule, FormsModule, ReactiveFormsModule, TimePickerModule, PipeModule, ContentDensityModule, ContentDensityModule] }); }
+    static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "16.1.0", ngImport: i0, type: PlatformTimePickerModule, imports: [PlatformTimePickerComponent], exports: [PlatformTimePickerComponent] }); }
+    static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "16.1.0", ngImport: i0, type: PlatformTimePickerModule, imports: [PlatformTimePickerComponent] }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.1.0", ngImport: i0, type: PlatformTimePickerModule, decorators: [{
             type: NgModule,
             args: [{
-                    declarations: [PlatformTimePickerComponent],
-                    imports: [CommonModule, FormsModule, ReactiveFormsModule, TimePickerModule, PipeModule, ContentDensityModule],
-                    exports: [PlatformTimePickerComponent, ContentDensityModule]
+                    imports: [PlatformTimePickerComponent],
+                    exports: [PlatformTimePickerComponent]
                 }]
         }] });