@pepperi-addons/ngx-lib 0.4.1-cards-list-scroll.32 → 0.4.1

package/fesm2020/pepperi-addons-ngx-lib-date.mjs

@@ -30,419 +30,424 @@ import { MomentDateAdapter } from '@angular/material-moment-adapter';
 import { MomentDatetimeAdapter } from '@mat-datetimepicker/moment';
 import * as i13 from '@ngx-translate/core';
 
-class MomentUtcDateAdapter extends MomentDateAdapter {
-    constructor(dateLocale) {
-        super(dateLocale);
-    }
-}
-MomentUtcDateAdapter.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.0.2", ngImport: i0, type: MomentUtcDateAdapter, deps: [{ token: MAT_DATE_LOCALE, optional: true }], target: i0.ɵɵFactoryTarget.Injectable });
-MomentUtcDateAdapter.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "14.0.2", ngImport: i0, type: MomentUtcDateAdapter });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.0.2", ngImport: i0, type: MomentUtcDateAdapter, decorators: [{
-            type: Injectable
-        }], ctorParameters: function () { return [{ type: undefined, decorators: [{
-                    type: Optional
-                }, {
-                    type: Inject,
-                    args: [MAT_DATE_LOCALE]
-                }] }]; } });
-class MomentUtcDateTimeAdapter extends MomentDatetimeAdapter {
-    constructor(dateLocale) {
-        super(dateLocale, { strict: false, useUtc: false }, new MomentUtcDateAdapter(dateLocale));
-    }
-}
-MomentUtcDateTimeAdapter.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.0.2", ngImport: i0, type: MomentUtcDateTimeAdapter, deps: [{ token: MAT_DATE_LOCALE, optional: true }], target: i0.ɵɵFactoryTarget.Injectable });
-MomentUtcDateTimeAdapter.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "14.0.2", ngImport: i0, type: MomentUtcDateTimeAdapter });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.0.2", ngImport: i0, type: MomentUtcDateTimeAdapter, decorators: [{
-            type: Injectable
-        }], ctorParameters: function () { return [{ type: undefined, decorators: [{
-                    type: Optional
-                }, {
-                    type: Inject,
-                    args: [MAT_DATE_LOCALE]
-                }] }]; } });
-const MY_DATE_FORMATS = {
-    parse: {
-        dateInput: 'L',
-        monthInput: 'MMMM',
-        timeInput: 'LT',
-        datetimeInput: 'L LT',
-    },
-    display: {
-        dateInput: 'L',
-        monthInput: 'MMMM',
-        timeInput: 'LT',
-        datetimeInput: 'L LT',
-        monthYearLabel: 'MMM YYYY',
-        dateA11yLabel: 'LL',
-        monthYearA11yLabel: 'MMMM YYYY',
-        popupHeaderDateLabel: 'ddd, DD MMM',
-    },
+class MomentUtcDateAdapter extends MomentDateAdapter {
+    constructor(dateLocale) {
+        super(dateLocale);
+    }
+}
+MomentUtcDateAdapter.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.0.2", ngImport: i0, type: MomentUtcDateAdapter, deps: [{ token: MAT_DATE_LOCALE, optional: true }], target: i0.ɵɵFactoryTarget.Injectable });
+MomentUtcDateAdapter.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "14.0.2", ngImport: i0, type: MomentUtcDateAdapter });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.0.2", ngImport: i0, type: MomentUtcDateAdapter, decorators: [{
+            type: Injectable
+        }], ctorParameters: function () { return [{ type: undefined, decorators: [{
+                    type: Optional
+                }, {
+                    type: Inject,
+                    args: [MAT_DATE_LOCALE]
+                }] }]; } });
+class MomentUtcDateTimeAdapter extends MomentDatetimeAdapter {
+    constructor(dateLocale) {
+        super(dateLocale, { strict: false, useUtc: false }, new MomentUtcDateAdapter(dateLocale));
+    }
+}
+MomentUtcDateTimeAdapter.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.0.2", ngImport: i0, type: MomentUtcDateTimeAdapter, deps: [{ token: MAT_DATE_LOCALE, optional: true }], target: i0.ɵɵFactoryTarget.Injectable });
+MomentUtcDateTimeAdapter.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "14.0.2", ngImport: i0, type: MomentUtcDateTimeAdapter });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.0.2", ngImport: i0, type: MomentUtcDateTimeAdapter, decorators: [{
+            type: Injectable
+        }], ctorParameters: function () { return [{ type: undefined, decorators: [{
+                    type: Optional
+                }, {
+                    type: Inject,
+                    args: [MAT_DATE_LOCALE]
+                }] }]; } });
+const MY_DATE_FORMATS = {
+    parse: {
+        dateInput: 'L',
+        monthInput: 'MMMM',
+        timeInput: 'LT',
+        datetimeInput: 'L LT',
+    },
+    display: {
+        dateInput: 'L',
+        monthInput: 'MMMM',
+        timeInput: 'LT',
+        datetimeInput: 'L LT',
+        monthYearLabel: 'MMM YYYY',
+        dateA11yLabel: 'LL',
+        monthYearA11yLabel: 'MMMM YYYY',
+        popupHeaderDateLabel: 'ddd, DD MMM',
+    },
 };
 
-// Set the calture for the adapter.
-function getCalture(layoutService) {
-    const culture = layoutService.getCurrentLanguage();
-    return culture;
-}
-class PepDateComponent {
-    constructor(adapter, element, layoutService, utilitiesService, customizationService, renderer) {
-        this.adapter = adapter;
-        this.element = element;
-        this.layoutService = layoutService;
-        this.utilitiesService = utilitiesService;
-        this.customizationService = customizationService;
-        this.renderer = renderer;
-        this.key = '';
-        this._value = '';
-        this.formattedValue = '';
-        // private _formattedValue = '';
-        // @Input()
-        // set formattedValue(value: string) {
-        //     // if (!value) {
-        //     //     value = '';
-        //     // }
-        //     // if (this._calculateFormattedValue) {
-        //     //     this._calculateFormattedValue = false;
-        //     // }
-        //     // this.setFormattedValue(value);
-        // }
-        // get formattedValue(): string {
-        //     return this._formattedValue;
-        // }
-        this.label = '';
-        this._type = 'date';
-        this.mandatory = false;
-        this.disabled = false;
-        this.readonly = false;
-        this.textColor = '';
-        this.xAlignment = DEFAULT_HORIZONTAL_ALIGNMENT;
-        this.rowSpan = 1;
-        this._visible = true;
-        this.controlType = 'date';
-        this.form = null;
-        this.isActive = false;
-        this.showTitle = true;
-        this.renderTitle = true;
-        this.renderError = true;
-        this.renderSymbol = true;
-        this.layoutType = 'form';
-        this.valueChange = new EventEmitter();
-        this.standAlone = false;
-        this.isInEditMode = false;
-        this.showDatepicker = false;
-        this.showTime = false;
-    }
-    set value(value) {
-        this._value = value;
-        this.setDateModel();
-    }
-    get value() {
-        return this._value;
-    }
-    set type(type) {
-        this._type = type;
-        this.showTime = type === 'datetime';
-    }
-    get type() {
-        return this._type;
-    }
-    set visible(visible) {
-        this._visible = visible;
-        if (visible) {
-            this.renderer.removeClass(this.element.nativeElement, 'hidden-element');
-        }
-        else {
-            this.renderer.addClass(this.element.nativeElement, 'hidden-element');
-        }
-    }
-    get visible() {
-        return this._visible;
-    }
-    // Minimum in thicks
-    set minValue(value) {
-        if (value > 0) {
-            this.minDate = new Date(value * 1000 * 60 * 60 * 24);
-        }
-    }
-    // Maximum in thicks
-    set maxValue(value) {
-        if (value > 0) {
-            this.maxDate = new Date(value * 1000 * 60 * 60 * 24);
-        }
-    }
-    // Minimum in date
-    set minDateValue(date) {
-        this.minDate = date ? new Date(date) : null;
-    }
-    // Maximum in date
-    set maxDateValue(date) {
-        this.maxDate = date ? new Date(date) : null;
-    }
-    setDefaultForm() {
-        const pepField = new PepDateField({
-            key: this.key,
-            value: this.value,
-            mandatory: this.mandatory,
-            readonly: this.readonly,
-            disabled: this.disabled,
-        });
-        this.form = this.customizationService.getDefaultFromGroup(pepField);
-    }
-    ngOnInit() {
-        if (this.form === null) {
-            this.standAlone = true;
-            this.setDefaultForm();
-            this.renderer.addClass(this.element.nativeElement, PepCustomizationService.STAND_ALONE_FIELD_CLASS_NAME);
-            if (!this.renderTitle) {
-                this.renderer.addClass(this.element.nativeElement, PepCustomizationService.STAND_ALONE_FIELD_NO_SPACING_CLASS_NAME);
-            }
-        }
-        // This is not working for the dateModel so I use set calure in the useFactory: getCalture function.
-        // const culture = this.layoutService.getCurrentLanguage();
-        // this.adapter.setLocale(culture);
-        this.setDateModel();
-    }
-    ngOnChanges(changes) {
-        if (this.standAlone) {
-            this.setDefaultForm();
-        }
-    }
-    ngOnDestroy() {
-        //
-    }
-    setFormattedValueFromModel() {
-        if (this.dateModel === null || !this.dateModel.isValid()) {
-            this.formattedValue = '';
-        }
-        else {
-            const formatString = this.showTime
-                ? MY_DATE_FORMATS.display.datetimeInput
-                : MY_DATE_FORMATS.display.dateInput;
-            this.formattedValue = this.adapter.format(this.dateModel, formatString);
-        }
-    }
-    setDateModel() {
-        if (!this.value ||
-            this.value === '' ||
-            this.value.indexOf('1900-1-1') >= 0 ||
-            this.value.indexOf('1900-01-01') >= 0 ||
-            this.value.indexOf('1970-1-1') >= 0 ||
-            this.value.indexOf('1970-01-01') >= 0) {
-            this._value = '';
-            this.dateModel = null;
-        }
-        else {
-            const parseDate = this.utilitiesService.parseDate(this.value, this.showTime);
-            this.dateModel = utc(parseDate);
-        }
-        this.setFormattedValueFromModel();
-    }
-    openDatetimePicker(datetimePicker) {
-        datetimePicker.opened = false;
-        datetimePicker.open();
-    }
-    onBlur(event) {
-        // Don't remove the timeout cause a bug DI-17819.
-        setTimeout(() => {
-            if (this.isInEditMode && !this.datetimePicker.opened) {
-                this.isInEditMode = false;
-            }
-        }, 0);
-    }
-    onDateChange(event) {
-        let value = '';
-        if (event.value != null) {
-            const date = event.value.toDate();
-            value = this.utilitiesService.stringifyDate(date, this.showTime);
-            // Update the formatted value.
-            this.setFormattedValueFromModel();
-        }
-        this.customizationService.updateFormFieldValue(this.form, this.key, 
-        // this.formattedValue
-        value);
-        this.valueChange.emit(value);
-        setTimeout(() => {
-            if (this.isInEditMode) {
-                this.isInEditMode = false;
-            }
-        }, 0);
-    }
-    cardTemplateClicked(event) {
-        this.isInEditMode = true;
-        setTimeout(() => {
-            this.input.nativeElement.focus();
-            this.openDatetimePicker(this.datetimePicker);
-        }, 0);
-    }
-}
-PepDateComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.0.2", ngImport: i0, type: PepDateComponent, deps: [{ token: i1.DateAdapter }, { token: i0.ElementRef }, { token: i2.PepLayoutService }, { token: i2.PepUtilitiesService }, { token: i2.PepCustomizationService }, { token: i0.Renderer2 }], target: i0.ɵɵFactoryTarget.Component });
-PepDateComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.0.2", type: PepDateComponent, selector: "pep-date", inputs: { key: "key", value: "value", label: "label", type: "type", mandatory: "mandatory", disabled: "disabled", readonly: "readonly", textColor: "textColor", xAlignment: "xAlignment", rowSpan: "rowSpan", visible: "visible", minValue: "minValue", maxValue: "maxValue", minDateValue: "minDateValue", maxDateValue: "maxDateValue", form: "form", isActive: "isActive", showTitle: "showTitle", renderTitle: "renderTitle", renderError: "renderError", renderSymbol: "renderSymbol", layoutType: "layoutType" }, outputs: { valueChange: "valueChange" }, providers: [
-        // CUSTOM_INPUT_CONTROL_VALUE_ACCESSOR,
-        // The locale would typically be provided on the root module of your application. We do it at
-        // the component level here, due to limitations of our example generation script.
-        // { provide: MAT_DATE_LOCALE, useValue: 'he' },
-        { provide: MAT_DATE_LOCALE, useFactory: getCalture, deps: [PepLayoutService] },
-        // `MomentDateAdapter` and `MAT_MOMENT_DATE_FORMATS` can be automatically provided by importing
-        // `MatMomentDateModule` in your applications root module. We provide it at the component level
-        // here, due to limitations of our example generation script.
-        //{ provide: DateAdapter, useClass: MomentDateAdapter, deps: [MAT_DATE_LOCALE] },
-        //{ provide: MAT_DATE_FORMATS, useValue: MAT_MOMENT_DATE_FORMATS },
-        { provide: DateAdapter, useClass: MomentUtcDateAdapter },
-        { provide: MAT_DATE_FORMATS, useValue: MY_DATE_FORMATS },
-        { provide: DatetimeAdapter, useClass: MomentUtcDateTimeAdapter },
-        //{ provide: MAT_DATETIME_FORMATS, useValue: MAT_NATIVE_DATETIME_FORMATS }
-        { provide: MAT_DATETIME_FORMATS, useValue: MY_DATE_FORMATS },
-    ], viewQueries: [{ propertyName: "datetimePicker", first: true, predicate: ["datetimePicker"], descendants: true }, { propertyName: "input", first: true, predicate: ["input"], descendants: true }], usesOnChanges: true, ngImport: i0, template: "<ng-container [formGroup]=\"form\">\n    <ng-template #pepTemplate let-showIcon=\"showIcon\">\n        <mat-form-field appearance=\"outline\">\n            <input #input [id]=\"key\" title=\"{{ formattedValue }}\" matInput class=\"body-sm\" autocomplete=\"false\"\n                [ngStyle]=\"{ color: textColor, 'text-align': xAlignment == 'center' ? 'center' : xAlignment == 'right' ? 'right' : 'left'}\"\n                [(ngModel)]=\"dateModel\" [ngModelOptions]=\"{standalone: true}\" [matDatetimepicker]=\"datetimePicker\"\n                [min]=\"minDate\" [max]=\"maxDate\" [required]=\"mandatory\" [disabled]=\"disabled\"\n                (dateChange)=\"onDateChange($event)\" (click)=\"openDatetimePicker(datetimePicker)\"\n                (blur)=\"onBlur($event)\" />\n            <mat-error *ngIf=\"renderError\"><span class=\"body-xs\"\n                    [title]=\"mandatory && formattedValue?.length == 0 ? ('MESSAGES.ERROR_IS_REQUIRED' | translate: {field: label}) : ('MESSAGES.ERROR_IS_NOT_VALID' | translate: {field: label})\"\n                    [innerText]=\"mandatory && formattedValue?.length == 0 ? ('MESSAGES.ERROR_IS_REQUIRED' | translate: {field: label}) : ('MESSAGES.ERROR_IS_NOT_VALID' | translate: {field: label})\"></span>\n            </mat-error>\n            <pep-textbox-icon *ngIf=\"renderSymbol && showIcon && xAlignment == 'right'\" matPrefix [value]=\"value\"\n                [label]=\"label\" [type]=\"type\" [disabled]=\"disabled\" (iconClick)=\"openDatetimePicker(datetimePicker)\">\n            </pep-textbox-icon>\n            <pep-textbox-icon *ngIf=\"renderSymbol && showIcon && xAlignment == 'left'\" matSuffix [value]=\"value\"\n                [label]=\"label\" [type]=\"type\" [disabled]=\"disabled\" (iconClick)=\"openDatetimePicker(datetimePicker)\">\n            </pep-textbox-icon>\n            <mat-datetimepicker #datetimePicker [type]=\"showTime ? 'datetime' : 'date'\" [openOnFocus]=\"false\"\n                [touchUi]=\"true\" [timeInterval]=\"1\"></mat-datetimepicker>\n        </mat-form-field>\n    </ng-template>\n\n    <ng-container *ngIf=\"layoutType === 'form'\">\n        <pep-field-title *ngIf=\"renderTitle\" [label]=\"label\" [mandatory]=\"mandatory\" [disabled]=\"disabled\"\n            [xAlignment]=\"xAlignment\" [showTitle]=\"showTitle\">\n        </pep-field-title>\n        <ng-container *ngTemplateOutlet=\"pepTemplate; context: {showIcon: true}\"></ng-container>\n    </ng-container>\n\n    <ng-container *ngIf=\"layoutType === 'card'\">\n        <ng-container *ngIf=\"isInEditMode; then editBlock; else readOnlyBlock\"></ng-container>\n        <ng-template #editBlock>\n            <div [ngClass]=\"{'one-row': rowSpan === 1}\">\n                <ng-container *ngTemplateOutlet=\"pepTemplate; context: {showIcon: false}\"></ng-container>\n            </div>\n        </ng-template>\n        <ng-template #readOnlyBlock>\n            <div class=\"pep-card-input card-flex-container\"\n                [ngClass]=\"{'one-row': rowSpan === 1, 'pep-button weak': isActive && !disabled }\"\n                [ngStyle]=\"{ color: textColor }\" [class]=\"'text-align-' + xAlignment\"\n                (click)=\"!disabled ? cardTemplateClicked($event) : ''\">\n                <span *ngIf=\"showTitle && label != ''\" class=\"body-xs title\" title=\"{{ label }}\">{{ label\n                    }}&nbsp;</span>\n                <span [id]=\"key\" title=\"{{ formattedValue }}\" class=\"body-sm value\">{{ formattedValue }}</span>\n                <button *ngIf=\"isActive && !disabled\" class=\"pep-button weak card-edit-button\" mat-button>\n                    <mat-icon>\n                        <pep-icon name=\"system_edit\">\n                        </pep-icon>\n                    </mat-icon>\n                </button>\n            </div>\n        </ng-template>\n    </ng-container>\n\n    <ng-container *ngIf=\"layoutType === 'table'\">\n        <ng-container *ngIf=\"isActive && !disabled; then selectedBlock; else notSelectedBlock\"></ng-container>\n        <ng-template #selectedBlock>\n            <ng-container *ngTemplateOutlet=\"pepTemplate; context: {showIcon: true}\"></ng-container>\n        </ng-template>\n        <ng-template #notSelectedBlock>\n            <ng-container *ngIf=\"formattedValue?.length > 0; then notEmptyBlock; else emptyBlock\"></ng-container>\n            <ng-template #notEmptyBlock>\n                <ng-container [ngSwitch]=\"type\">\n                    <ng-container *ngSwitchDefault>\n                        <span [id]=\"key\" class=\"body-sm pep-report-input\" [ngStyle]=\"{ color: textColor }\"\n                            [ngClass]=\"{readonly: disabled}\" title=\"{{ formattedValue }}\">{{ formattedValue }}</span>\n                    </ng-container>\n                </ng-container>\n            </ng-template>\n            <ng-template #emptyBlock>\n                <span [id]=\"key\">&nbsp;</span>\n            </ng-template>\n        </ng-template>\n    </ng-container>\n</ng-container>", styles: [":host{height:inherit;display:grid}:host>*{align-self:center}::ng-deep .mat-form-field .mat-form-field-wrapper .mat-form-field-prefix .mat-datetimepicker-toggle.mat-button,::ng-deep .mat-form-field .mat-form-field-wrapper .mat-form-field-suffix .mat-datetimepicker-toggle.mat-button{padding:0}\n", "::ng-deep .mat-datetimepicker-dialog{max-width:90vw!important}::ng-deep .mat-datetimepicker-content{border-radius:inherit}::ng-deep .mat-datetimepicker-content .mat-datetimepicker-calendar-header{font-weight:var(--pep-font-weight-bold, 600);background:hsl(var(--pep-color-strong-h, 78),var(--pep-color-strong-s, 87%),var(--pep-color-strong-l, 27%));box-shadow:var(--pep-shadow-sm-offset, 0 .25rem .5rem 0) hsla(var(--pep-color-system-primary-h, 0),var(--pep-color-system-primary-s, 0%),var(--pep-color-system-primary-l, 10%),.08);color:hsl(var(--pep-color-system-primary-invert-h, 255),var(--pep-color-system-primary-invert-s, 100%),var(--pep-color-system-primary-invert-l, 100%))}::ng-deep .mat-datetimepicker-content .mat-datetimepicker-calendar-header .svg-icon{fill:hsl(var(--pep-color-system-primary-invert-h, 255),var(--pep-color-system-primary-invert-s, 100%),var(--pep-color-system-primary-invert-l, 100%))}::ng-deep .mat-datetimepicker-content .mat-datetimepicker-calendar-header .svg-icon.stroke{fill:unset;stroke:hsl(var(--pep-color-system-primary-invert-h, 255),var(--pep-color-system-primary-invert-s, 100%),var(--pep-color-system-primary-invert-l, 100%))}::ng-deep .mat-datetimepicker-content .mat-datetimepicker-calendar-content .mat-month-content .mat-datetimepicker-calendar-controls{color:hsl(var(--pep-color-system-primary-h, 0),var(--pep-color-system-primary-s, 0%),var(--pep-color-system-primary-l, 10%))}::ng-deep .mat-datetimepicker-content .mat-datetimepicker-calendar-content .mat-month-content .mat-datetimepicker-calendar-controls .mat-datetimepicker-calendar-previous-button{content:url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0iVVRGLTgiIHN0YW5kYWxvbmU9Im5vIj8+CjxzdmcKICAgeG1sbnM6ZGM9Imh0dHA6Ly9wdXJsLm9yZy9kYy9lbGVtZW50cy8xLjEvIgogICB4bWxuczpjYz0iaHR0cDovL2NyZWF0aXZlY29tbW9ucy5vcmcvbnMjIgogICB4bWxuczpyZGY9Imh0dHA6Ly93d3cudzMub3JnLzE5OTkvMDIvMjItcmRmLXN5bnRheC1ucyMiCiAgIHhtbG5zOnN2Zz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciCiAgIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIKICAgaWQ9InN2ZzQiCiAgIHZlcnNpb249IjEuMSIKICAgdmlld0JveD0iMCAwIDI0IDI0IgogICBoZWlnaHQ9IjE2IgogICB3aWR0aD0iMTYiPgogIDxtZXRhZGF0YQogICAgIGlkPSJtZXRhZGF0YTEwIj4KICAgIDxyZGY6UkRGPgogICAgICA8Y2M6V29yawogICAgICAgICByZGY6YWJvdXQ9IiI+CiAgICAgICAgPGRjOmZvcm1hdD5pbWFnZS9zdmcreG1sPC9kYzpmb3JtYXQ+CiAgICAgICAgPGRjOnR5cGUKICAgICAgICAgICByZGY6cmVzb3VyY2U9Imh0dHA6Ly9wdXJsLm9yZy9kYy9kY21pdHlwZS9TdGlsbEltYWdlIiAvPgogICAgICA8L2NjOldvcms+CiAgICA8L3JkZjpSREY+CiAgPC9tZXRhZGF0YT4KICA8ZGVmcwogICAgIGlkPSJkZWZzOCIgLz4KICA8cGF0aAogICAgIGlkPSJwYXRoMiIKICAgICBkPSJNNS44MDAzMjE0OCw5LjI4Njc0MzU0IEwxMS4yNTQyODI0LDEzLjIwMjc1ODMgQzExLjY2NjEzMDksMTMuNTg1MDgzIDEyLjMzMzg2OTEsMTMuNTg1MDgzIDEyLjc0NTcxNzYsMTMuMjAyNzU4MyBMMTguMTk5Njc4NSw5LjI4Njc0MzU0IEMxOC42MTE1MjcsOC45MDQ0MTg4MiAxOS4yNzkyNjUyLDguOTA0NDE4ODIgMTkuNjkxMTEzNyw5LjI4Njc0MzU0IEMyMC4xMDI5NjIxLDkuNjY5MDY4MjYgMjAuMTAyOTYyMSwxMC4yODg5MzkxIDE5LjY5MTExMzcsMTAuNjcxMjYzOCBMMTMuNDkxNDM1MSwxNi40MjY1MTI5IEMxMi42Njc3MzgzLDE3LjE5MTE2MjQgMTEuMzMyMjYxNywxNy4xOTExNjI0IDEwLjUwODU2NDksMTYuNDI2NTEyOSBMNC4zMDg4ODYzMywxMC42NzEyNjM4IEMzLjg5NzAzNzg5LDEwLjI4ODkzOTEgMy44OTcwMzc4OSw5LjY2OTA2ODI2IDQuMzA4ODg2MzMsOS4yODY3NDM1NCBDNC43MjA3MzQ3OCw4LjkwNDQxODgyIDUuMzg4NDczMDMsOC45MDQ0MTg4MiA1LjgwMDMyMTQ4LDkuMjg2NzQzNTQgWiIKICAgICBmaWxsLXJ1bGU9ImV2ZW5vZGQiCiAgICAgZmlsbC1vcGFjaXR5PSIuNSIgLz4KPC9zdmc+Cg==);transform:rotate(90deg)}::ng-deep .mat-datetimepicker-content .mat-datetimepicker-calendar-content .mat-month-content .mat-datetimepicker-calendar-controls .mat-datetimepicker-calendar-previous-button svg{fill:hsla(var(--pep-color-system-primary-h, 0),var(--pep-color-system-primary-s, 0%),var(--pep-color-system-primary-l, 10%),.8)}::ng-deep .mat-datetimepicker-content .mat-datetimepicker-calendar-content .mat-month-content .mat-datetimepicker-calendar-controls .mat-datetimepicker-calendar-previous-button svg.stroke{fill:unset;stroke:hsla(var(--pep-color-system-primary-h, 0),var(--pep-color-system-primary-s, 0%),var(--pep-color-system-primary-l, 10%),.8)}::ng-deep .mat-datetimepicker-content .mat-datetimepicker-calendar-content .mat-month-content .mat-datetimepicker-calendar-controls .mat-datetimepicker-calendar-previous-button svg:hover{fill:hsla(var(--pep-color-system-primary-h, 0),var(--pep-color-system-primary-s, 0%),var(--pep-color-system-primary-l, 10%),.97)}::ng-deep .mat-datetimepicker-content .mat-datetimepicker-calendar-content .mat-month-content .mat-datetimepicker-calendar-controls .mat-datetimepicker-calendar-previous-button svg:hover.stroke{fill:unset;stroke:hsla(var(--pep-color-system-primary-h, 0),var(--pep-color-system-primary-s, 0%),var(--pep-color-system-primary-l, 10%),.97)}::ng-deep .mat-datetimepicker-content .mat-datetimepicker-calendar-content .mat-month-content .mat-datetimepicker-calendar-controls .mat-datetimepicker-calendar-previous-button svg:active{fill:hsl(var(--pep-color-system-primary-h, 0),var(--pep-color-system-primary-s, 0%),var(--pep-color-system-primary-l, 10%))}::ng-deep .mat-datetimepicker-content .mat-datetimepicker-calendar-content .mat-month-content .mat-datetimepicker-calendar-controls .mat-datetimepicker-calendar-previous-button svg:active.stroke{fill:unset;stroke:hsl(var(--pep-color-system-primary-h, 0),var(--pep-color-system-primary-s, 0%),var(--pep-color-system-primary-l, 10%))}::ng-deep .mat-datetimepicker-content .mat-datetimepicker-calendar-content .mat-month-content .mat-datetimepicker-calendar-controls .mat-datetimepicker-calendar-previous-button svg:disabled{fill:hsla(var(--pep-color-system-primary-h, 0),var(--pep-color-system-primary-s, 0%),var(--pep-color-system-primary-l, 10%),.35)}::ng-deep .mat-datetimepicker-content .mat-datetimepicker-calendar-content .mat-month-content .mat-datetimepicker-calendar-controls .mat-datetimepicker-calendar-previous-button svg:disabled.stroke{fill:unset;stroke:hsla(var(--pep-color-system-primary-h, 0),var(--pep-color-system-primary-s, 0%),var(--pep-color-system-primary-l, 10%),.35)}::ng-deep .mat-datetimepicker-content .mat-datetimepicker-calendar-content .mat-month-content .mat-datetimepicker-calendar-controls .mat-datetimepicker-calendar-next-button{content:url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0iVVRGLTgiIHN0YW5kYWxvbmU9Im5vIj8+CjxzdmcKICAgeG1sbnM6ZGM9Imh0dHA6Ly9wdXJsLm9yZy9kYy9lbGVtZW50cy8xLjEvIgogICB4bWxuczpjYz0iaHR0cDovL2NyZWF0aXZlY29tbW9ucy5vcmcvbnMjIgogICB4bWxuczpyZGY9Imh0dHA6Ly93d3cudzMub3JnLzE5OTkvMDIvMjItcmRmLXN5bnRheC1ucyMiCiAgIHhtbG5zOnN2Zz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciCiAgIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIKICAgaWQ9InN2ZzQiCiAgIHZlcnNpb249IjEuMSIKICAgdmlld0JveD0iMCAwIDI0IDI0IgogICBoZWlnaHQ9IjE2IgogICB3aWR0aD0iMTYiPgogIDxtZXRhZGF0YQogICAgIGlkPSJtZXRhZGF0YTEwIj4KICAgIDxyZGY6UkRGPgogICAgICA8Y2M6V29yawogICAgICAgICByZGY6YWJvdXQ9IiI+CiAgICAgICAgPGRjOmZvcm1hdD5pbWFnZS9zdmcreG1sPC9kYzpmb3JtYXQ+CiAgICAgICAgPGRjOnR5cGUKICAgICAgICAgICByZGY6cmVzb3VyY2U9Imh0dHA6Ly9wdXJsLm9yZy9kYy9kY21pdHlwZS9TdGlsbEltYWdlIiAvPgogICAgICA8L2NjOldvcms+CiAgICA8L3JkZjpSREY+CiAgPC9tZXRhZGF0YT4KICA8ZGVmcwogICAgIGlkPSJkZWZzOCIgLz4KICA8cGF0aAogICAgIGlkPSJwYXRoMiIKICAgICBkPSJNNS44MDAzMjE0OCw5LjI4Njc0MzU0IEwxMS4yNTQyODI0LDEzLjIwMjc1ODMgQzExLjY2NjEzMDksMTMuNTg1MDgzIDEyLjMzMzg2OTEsMTMuNTg1MDgzIDEyLjc0NTcxNzYsMTMuMjAyNzU4MyBMMTguMTk5Njc4NSw5LjI4Njc0MzU0IEMxOC42MTE1MjcsOC45MDQ0MTg4MiAxOS4yNzkyNjUyLDguOTA0NDE4ODIgMTkuNjkxMTEzNyw5LjI4Njc0MzU0IEMyMC4xMDI5NjIxLDkuNjY5MDY4MjYgMjAuMTAyOTYyMSwxMC4yODg5MzkxIDE5LjY5MTExMzcsMTAuNjcxMjYzOCBMMTMuNDkxNDM1MSwxNi40MjY1MTI5IEMxMi42Njc3MzgzLDE3LjE5MTE2MjQgMTEuMzMyMjYxNywxNy4xOTExNjI0IDEwLjUwODU2NDksMTYuNDI2NTEyOSBMNC4zMDg4ODYzMywxMC42NzEyNjM4IEMzLjg5NzAzNzg5LDEwLjI4ODkzOTEgMy44OTcwMzc4OSw5LjY2OTA2ODI2IDQuMzA4ODg2MzMsOS4yODY3NDM1NCBDNC43MjA3MzQ3OCw4LjkwNDQxODgyIDUuMzg4NDczMDMsOC45MDQ0MTg4MiA1LjgwMDMyMTQ4LDkuMjg2NzQzNTQgWiIKICAgICBmaWxsLXJ1bGU9ImV2ZW5vZGQiCiAgICAgZmlsbC1vcGFjaXR5PSIuNSIgLz4KPC9zdmc+Cg==);transform:rotate(-90deg)}::ng-deep .mat-datetimepicker-content .mat-datetimepicker-calendar-content .mat-month-content .mat-datetimepicker-calendar-controls .mat-datetimepicker-calendar-next-button svg{fill:hsla(var(--pep-color-system-primary-h, 0),var(--pep-color-system-primary-s, 0%),var(--pep-color-system-primary-l, 10%),.8)}::ng-deep .mat-datetimepicker-content .mat-datetimepicker-calendar-content .mat-month-content .mat-datetimepicker-calendar-controls .mat-datetimepicker-calendar-next-button svg.stroke{fill:unset;stroke:hsla(var(--pep-color-system-primary-h, 0),var(--pep-color-system-primary-s, 0%),var(--pep-color-system-primary-l, 10%),.8)}::ng-deep .mat-datetimepicker-content .mat-datetimepicker-calendar-content .mat-month-content .mat-datetimepicker-calendar-controls .mat-datetimepicker-calendar-next-button svg:hover{fill:hsla(var(--pep-color-system-primary-h, 0),var(--pep-color-system-primary-s, 0%),var(--pep-color-system-primary-l, 10%),.97)}::ng-deep .mat-datetimepicker-content .mat-datetimepicker-calendar-content .mat-month-content .mat-datetimepicker-calendar-controls .mat-datetimepicker-calendar-next-button svg:hover.stroke{fill:unset;stroke:hsla(var(--pep-color-system-primary-h, 0),var(--pep-color-system-primary-s, 0%),var(--pep-color-system-primary-l, 10%),.97)}::ng-deep .mat-datetimepicker-content .mat-datetimepicker-calendar-content .mat-month-content .mat-datetimepicker-calendar-controls .mat-datetimepicker-calendar-next-button svg:active{fill:hsl(var(--pep-color-system-primary-h, 0),var(--pep-color-system-primary-s, 0%),var(--pep-color-system-primary-l, 10%))}::ng-deep .mat-datetimepicker-content .mat-datetimepicker-calendar-content .mat-month-content .mat-datetimepicker-calendar-controls .mat-datetimepicker-calendar-next-button svg:active.stroke{fill:unset;stroke:hsl(var(--pep-color-system-primary-h, 0),var(--pep-color-system-primary-s, 0%),var(--pep-color-system-primary-l, 10%))}::ng-deep .mat-datetimepicker-content .mat-datetimepicker-calendar-content .mat-month-content .mat-datetimepicker-calendar-controls .mat-datetimepicker-calendar-next-button svg:disabled{fill:hsla(var(--pep-color-system-primary-h, 0),var(--pep-color-system-primary-s, 0%),var(--pep-color-system-primary-l, 10%),.35)}::ng-deep .mat-datetimepicker-content .mat-datetimepicker-calendar-content .mat-month-content .mat-datetimepicker-calendar-controls .mat-datetimepicker-calendar-next-button svg:disabled.stroke{fill:unset;stroke:hsla(var(--pep-color-system-primary-h, 0),var(--pep-color-system-primary-s, 0%),var(--pep-color-system-primary-l, 10%),.35)}::ng-deep .mat-datetimepicker-content .mat-datetimepicker-calendar-content mat-datetimepicker-year-view .mat-datetimepicker-calendar-table .mat-datetimepicker-calendar-table-header,::ng-deep .mat-datetimepicker-content .mat-datetimepicker-calendar-content mat-datetimepicker-month-view .mat-datetimepicker-calendar-table .mat-datetimepicker-calendar-table-header{color:hsla(var(--pep-color-system-primary-h, 0),var(--pep-color-system-primary-s, 0%),var(--pep-color-system-primary-l, 10%),.7)}::ng-deep .mat-datetimepicker-content .mat-datetimepicker-calendar-content mat-datetimepicker-year-view .mat-datetimepicker-calendar-table .mat-datetimepicker-calendar-body,::ng-deep .mat-datetimepicker-content .mat-datetimepicker-calendar-content mat-datetimepicker-month-view .mat-datetimepicker-calendar-table .mat-datetimepicker-calendar-body{color:hsl(var(--pep-color-system-primary-h, 0),var(--pep-color-system-primary-s, 0%),var(--pep-color-system-primary-l, 10%))}::ng-deep .mat-datetimepicker-content .mat-datetimepicker-calendar-content mat-datetimepicker-year-view .mat-datetimepicker-calendar-table .mat-datetimepicker-calendar-body .mat-datetimepicker-calendar-body-label,::ng-deep .mat-datetimepicker-content .mat-datetimepicker-calendar-content mat-datetimepicker-month-view .mat-datetimepicker-calendar-table .mat-datetimepicker-calendar-body .mat-datetimepicker-calendar-body-label{color:hsla(var(--pep-color-system-primary-h, 0),var(--pep-color-system-primary-s, 0%),var(--pep-color-system-primary-l, 10%),.7)}::ng-deep .mat-datetimepicker-content .mat-datetimepicker-calendar-content mat-datetimepicker-year-view .mat-datetimepicker-calendar-table .mat-datetimepicker-calendar-body .mat-datetimepicker-calendar-body-cell:hover .mat-datetimepicker-calendar-body-cell-content,::ng-deep .mat-datetimepicker-content .mat-datetimepicker-calendar-content mat-datetimepicker-month-view .mat-datetimepicker-calendar-table .mat-datetimepicker-calendar-body .mat-datetimepicker-calendar-body-cell:hover .mat-datetimepicker-calendar-body-cell-content{background:hsla(var(--pep-color-weak-h, 0),var(--pep-color-weak-s, 0%),var(--pep-color-weak-l, 10%),.16)}::ng-deep .mat-datetimepicker-content .mat-datetimepicker-calendar-content mat-datetimepicker-year-view .mat-datetimepicker-calendar-table .mat-datetimepicker-calendar-body .mat-datetimepicker-calendar-body-cell:active .mat-datetimepicker-calendar-body-cell-content,::ng-deep .mat-datetimepicker-content .mat-datetimepicker-calendar-content mat-datetimepicker-month-view .mat-datetimepicker-calendar-table .mat-datetimepicker-calendar-body .mat-datetimepicker-calendar-body-cell:active .mat-datetimepicker-calendar-body-cell-content{box-shadow:var(--pep-shadow-xs-offset, 0 .125rem .25rem 0) hsla(var(--pep-color-system-primary-h, 0),var(--pep-color-system-primary-s, 0%),var(--pep-color-system-primary-l, 10%),.08);border:1px solid hsl(var(--pep-color-weak-h, 0),var(--pep-color-weak-s, 0%),var(--pep-color-weak-l, 10%))}::ng-deep .mat-datetimepicker-content .mat-datetimepicker-calendar-content mat-datetimepicker-year-view .mat-datetimepicker-calendar-table .mat-datetimepicker-calendar-body .mat-datetimepicker-calendar-body-cell:active .mat-datetimepicker-calendar-body-cell-content:not(.keep-background-on-focus),::ng-deep .mat-datetimepicker-content .mat-datetimepicker-calendar-content mat-datetimepicker-month-view .mat-datetimepicker-calendar-table .mat-datetimepicker-calendar-body .mat-datetimepicker-calendar-body-cell:active .mat-datetimepicker-calendar-body-cell-content:not(.keep-background-on-focus){background:hsl(var(--pep-color-system-primary-invert-h, 255),var(--pep-color-system-primary-invert-s, 100%),var(--pep-color-system-primary-invert-l, 100%))}::ng-deep .mat-datetimepicker-content .mat-datetimepicker-calendar-content mat-datetimepicker-year-view .mat-datetimepicker-calendar-table .mat-datetimepicker-calendar-body .mat-datetimepicker-calendar-body-cell .mat-datetimepicker-calendar-body-cell-content.mat-datetimepicker-calendar-body-today,::ng-deep .mat-datetimepicker-content .mat-datetimepicker-calendar-content mat-datetimepicker-month-view .mat-datetimepicker-calendar-table .mat-datetimepicker-calendar-body .mat-datetimepicker-calendar-body-cell .mat-datetimepicker-calendar-body-cell-content.mat-datetimepicker-calendar-body-today{background:hsl(var(--pep-color-regular-h, 0),var(--pep-color-regular-s, 0%),98%);box-shadow:var(--pep-shadow-xs-offset, 0 .125rem .25rem 0) hsla(var(--pep-color-system-primary-h, 0),var(--pep-color-system-primary-s, 0%),var(--pep-color-system-primary-l, 10%),.08);border:1px solid hsl(var(--pep-color-regular-h, 0),var(--pep-color-regular-s, 0%),calc(var(--pep-color-regular-l, 10%) + 30%))}::ng-deep .mat-datetimepicker-content .mat-datetimepicker-calendar-content mat-datetimepicker-year-view .mat-datetimepicker-calendar-table .mat-datetimepicker-calendar-body .mat-datetimepicker-calendar-body-cell .mat-datetimepicker-calendar-body-cell-content.mat-datetimepicker-calendar-body-today:hover,::ng-deep .mat-datetimepicker-content .mat-datetimepicker-calendar-content mat-datetimepicker-month-view .mat-datetimepicker-calendar-table .mat-datetimepicker-calendar-body .mat-datetimepicker-calendar-body-cell .mat-datetimepicker-calendar-body-cell-content.mat-datetimepicker-calendar-body-today:hover{background:hsl(var(--pep-color-regular-h, 0),var(--pep-color-regular-s, 0%),98%);box-shadow:var(--pep-shadow-xs-offset, 0 .125rem .25rem 0) hsla(var(--pep-color-system-primary-h, 0),var(--pep-color-system-primary-s, 0%),var(--pep-color-system-primary-l, 10%),.16);border:1px solid hsl(var(--pep-color-regular-h, 0),var(--pep-color-regular-s, 0%),calc(var(--pep-color-regular-l, 10%) + 20%))}::ng-deep .mat-datetimepicker-content .mat-datetimepicker-calendar-content mat-datetimepicker-year-view .mat-datetimepicker-calendar-table .mat-datetimepicker-calendar-body .mat-datetimepicker-calendar-body-cell .mat-datetimepicker-calendar-body-cell-content.mat-datetimepicker-calendar-body-today:active,::ng-deep .mat-datetimepicker-content .mat-datetimepicker-calendar-content mat-datetimepicker-month-view .mat-datetimepicker-calendar-table .mat-datetimepicker-calendar-body .mat-datetimepicker-calendar-body-cell .mat-datetimepicker-calendar-body-cell-content.mat-datetimepicker-calendar-body-today:active{background:hsl(var(--pep-color-regular-h, 0),var(--pep-color-regular-s, 0%),88%);box-shadow:var(--pep-shadow-xs-offset, 0 .125rem .25rem 0) hsla(var(--pep-color-system-primary-h, 0),var(--pep-color-system-primary-s, 0%),var(--pep-color-system-primary-l, 10%),.16);border:1px solid hsl(var(--pep-color-regular-h, 0),var(--pep-color-regular-s, 0%),var(--pep-color-regular-l, 10%));box-shadow:0 0 0 var(--pep-spacing-xs, .25rem) hsla(var(--pep-color-text-link-h, 207),var(--pep-color-text-link-s, 76%),var(--pep-color-text-link-l, 37%),.5)}::ng-deep .mat-datetimepicker-content .mat-datetimepicker-calendar-content mat-datetimepicker-year-view .mat-datetimepicker-calendar-table .mat-datetimepicker-calendar-body .mat-datetimepicker-calendar-body-cell .mat-datetimepicker-calendar-body-cell-content.mat-datetimepicker-calendar-body-selected,::ng-deep .mat-datetimepicker-content .mat-datetimepicker-calendar-content mat-datetimepicker-month-view .mat-datetimepicker-calendar-table .mat-datetimepicker-calendar-body .mat-datetimepicker-calendar-body-cell .mat-datetimepicker-calendar-body-cell-content.mat-datetimepicker-calendar-body-selected{font-weight:var(--pep-font-weight-bold, 600);background:hsl(var(--pep-color-strong-h, 78),var(--pep-color-strong-s, 87%),var(--pep-color-strong-l, 27%));box-shadow:var(--pep-shadow-sm-offset, 0 .25rem .5rem 0) hsla(var(--pep-color-system-primary-h, 0),var(--pep-color-system-primary-s, 0%),var(--pep-color-system-primary-l, 10%),.08);color:hsl(var(--pep-color-system-primary-invert-h, 255),var(--pep-color-system-primary-invert-s, 100%),var(--pep-color-system-primary-invert-l, 100%))}::ng-deep .mat-datetimepicker-content .mat-datetimepicker-calendar-content mat-datetimepicker-year-view .mat-datetimepicker-calendar-table .mat-datetimepicker-calendar-body .mat-datetimepicker-calendar-body-cell .mat-datetimepicker-calendar-body-cell-content.mat-datetimepicker-calendar-body-selected .svg-icon,::ng-deep .mat-datetimepicker-content .mat-datetimepicker-calendar-content mat-datetimepicker-month-view .mat-datetimepicker-calendar-table .mat-datetimepicker-calendar-body .mat-datetimepicker-calendar-body-cell .mat-datetimepicker-calendar-body-cell-content.mat-datetimepicker-calendar-body-selected .svg-icon{fill:hsl(var(--pep-color-system-primary-invert-h, 255),var(--pep-color-system-primary-invert-s, 100%),var(--pep-color-system-primary-invert-l, 100%))}::ng-deep .mat-datetimepicker-content .mat-datetimepicker-calendar-content mat-datetimepicker-year-view .mat-datetimepicker-calendar-table .mat-datetimepicker-calendar-body .mat-datetimepicker-calendar-body-cell .mat-datetimepicker-calendar-body-cell-content.mat-datetimepicker-calendar-body-selected .svg-icon.stroke,::ng-deep .mat-datetimepicker-content .mat-datetimepicker-calendar-content mat-datetimepicker-month-view .mat-datetimepicker-calendar-table .mat-datetimepicker-calendar-body .mat-datetimepicker-calendar-body-cell .mat-datetimepicker-calendar-body-cell-content.mat-datetimepicker-calendar-body-selected .svg-icon.stroke{fill:unset;stroke:hsl(var(--pep-color-system-primary-invert-h, 255),var(--pep-color-system-primary-invert-s, 100%),var(--pep-color-system-primary-invert-l, 100%))}::ng-deep .mat-datetimepicker-content .mat-datetimepicker-calendar-content mat-datetimepicker-year-view .mat-datetimepicker-calendar-table .mat-datetimepicker-calendar-body .mat-datetimepicker-calendar-body-cell .mat-datetimepicker-calendar-body-cell-content.mat-datetimepicker-calendar-body-selected:hover,::ng-deep .mat-datetimepicker-content .mat-datetimepicker-calendar-content mat-datetimepicker-month-view .mat-datetimepicker-calendar-table .mat-datetimepicker-calendar-body .mat-datetimepicker-calendar-body-cell .mat-datetimepicker-calendar-body-cell-content.mat-datetimepicker-calendar-body-selected:hover{background:hsl(var(--pep-color-strong-h, 78),var(--pep-color-strong-s, 87%),calc(var(--pep-color-strong-l, 27%) - 8%));box-shadow:var(--pep-shadow-sm-offset, 0 .25rem .5rem 0) hsla(var(--pep-color-system-primary-h, 0),var(--pep-color-system-primary-s, 0%),var(--pep-color-system-primary-l, 10%),.16)}::ng-deep .mat-datetimepicker-content .mat-datetimepicker-calendar-content mat-datetimepicker-year-view .mat-datetimepicker-calendar-table .mat-datetimepicker-calendar-body .mat-datetimepicker-calendar-body-cell .mat-datetimepicker-calendar-body-cell-content.mat-datetimepicker-calendar-body-selected:active,::ng-deep .mat-datetimepicker-content .mat-datetimepicker-calendar-content mat-datetimepicker-month-view .mat-datetimepicker-calendar-table .mat-datetimepicker-calendar-body .mat-datetimepicker-calendar-body-cell .mat-datetimepicker-calendar-body-cell-content.mat-datetimepicker-calendar-body-selected:active{background:hsl(var(--pep-color-strong-h, 78),var(--pep-color-strong-s, 87%),calc(var(--pep-color-strong-l, 27%) - 15%));box-shadow:var(--pep-shadow-sm-offset, 0 .25rem .5rem 0) hsla(var(--pep-color-system-primary-h, 0),var(--pep-color-system-primary-s, 0%),var(--pep-color-system-primary-l, 10%),.08);box-shadow:0 0 0 var(--pep-spacing-xs, .25rem) hsla(var(--pep-color-text-link-h, 207),var(--pep-color-text-link-s, 76%),var(--pep-color-text-link-l, 37%),.5)}::ng-deep .mat-datetimepicker-content .mat-datetimepicker-calendar-content mat-datetimepicker-clock .mat-datetimepicker-clock{background:hsla(var(--pep-color-weak-h, 0),var(--pep-color-weak-s, 0%),var(--pep-color-weak-l, 10%),.12)}::ng-deep .mat-datetimepicker-content .mat-datetimepicker-calendar-content mat-datetimepicker-clock .mat-datetimepicker-clock .mat-datetimepicker-clock-center{font-weight:var(--pep-font-weight-bold, 600);background:hsl(var(--pep-color-strong-h, 78),var(--pep-color-strong-s, 87%),var(--pep-color-strong-l, 27%));box-shadow:var(--pep-shadow-sm-offset, 0 .25rem .5rem 0) hsla(var(--pep-color-system-primary-h, 0),var(--pep-color-system-primary-s, 0%),var(--pep-color-system-primary-l, 10%),.08);color:hsl(var(--pep-color-system-primary-invert-h, 255),var(--pep-color-system-primary-invert-s, 100%),var(--pep-color-system-primary-invert-l, 100%))}::ng-deep .mat-datetimepicker-content .mat-datetimepicker-calendar-content mat-datetimepicker-clock .mat-datetimepicker-clock .mat-datetimepicker-clock-center .svg-icon{fill:hsl(var(--pep-color-system-primary-invert-h, 255),var(--pep-color-system-primary-invert-s, 100%),var(--pep-color-system-primary-invert-l, 100%))}::ng-deep .mat-datetimepicker-content .mat-datetimepicker-calendar-content mat-datetimepicker-clock .mat-datetimepicker-clock .mat-datetimepicker-clock-center .svg-icon.stroke{fill:unset;stroke:hsl(var(--pep-color-system-primary-invert-h, 255),var(--pep-color-system-primary-invert-s, 100%),var(--pep-color-system-primary-invert-l, 100%))}::ng-deep .mat-datetimepicker-content .mat-datetimepicker-calendar-content mat-datetimepicker-clock .mat-datetimepicker-clock .mat-datetimepicker-clock-hand{font-weight:var(--pep-font-weight-bold, 600);background:hsl(var(--pep-color-strong-h, 78),var(--pep-color-strong-s, 87%),var(--pep-color-strong-l, 27%));box-shadow:var(--pep-shadow-sm-offset, 0 .25rem .5rem 0) hsla(var(--pep-color-system-primary-h, 0),var(--pep-color-system-primary-s, 0%),var(--pep-color-system-primary-l, 10%),.08);color:hsl(var(--pep-color-system-primary-invert-h, 255),var(--pep-color-system-primary-invert-s, 100%),var(--pep-color-system-primary-invert-l, 100%))}::ng-deep .mat-datetimepicker-content .mat-datetimepicker-calendar-content mat-datetimepicker-clock .mat-datetimepicker-clock .mat-datetimepicker-clock-hand .svg-icon{fill:hsl(var(--pep-color-system-primary-invert-h, 255),var(--pep-color-system-primary-invert-s, 100%),var(--pep-color-system-primary-invert-l, 100%))}::ng-deep .mat-datetimepicker-content .mat-datetimepicker-calendar-content mat-datetimepicker-clock .mat-datetimepicker-clock .mat-datetimepicker-clock-hand .svg-icon.stroke{fill:unset;stroke:hsl(var(--pep-color-system-primary-invert-h, 255),var(--pep-color-system-primary-invert-s, 100%),var(--pep-color-system-primary-invert-l, 100%))}::ng-deep .mat-datetimepicker-content .mat-datetimepicker-calendar-content mat-datetimepicker-clock .mat-datetimepicker-clock .mat-datetimepicker-clock-hand:before{font-weight:var(--pep-font-weight-bold, 600);background:hsl(var(--pep-color-strong-h, 78),var(--pep-color-strong-s, 87%),var(--pep-color-strong-l, 27%));box-shadow:var(--pep-shadow-sm-offset, 0 .25rem .5rem 0) hsla(var(--pep-color-system-primary-h, 0),var(--pep-color-system-primary-s, 0%),var(--pep-color-system-primary-l, 10%),.08);color:hsl(var(--pep-color-system-primary-invert-h, 255),var(--pep-color-system-primary-invert-s, 100%),var(--pep-color-system-primary-invert-l, 100%))}::ng-deep .mat-datetimepicker-content .mat-datetimepicker-calendar-content mat-datetimepicker-clock .mat-datetimepicker-clock .mat-datetimepicker-clock-hand:before .svg-icon{fill:hsl(var(--pep-color-system-primary-invert-h, 255),var(--pep-color-system-primary-invert-s, 100%),var(--pep-color-system-primary-invert-l, 100%))}::ng-deep .mat-datetimepicker-content .mat-datetimepicker-calendar-content mat-datetimepicker-clock .mat-datetimepicker-clock .mat-datetimepicker-clock-hand:before .svg-icon.stroke{fill:unset;stroke:hsl(var(--pep-color-system-primary-invert-h, 255),var(--pep-color-system-primary-invert-s, 100%),var(--pep-color-system-primary-invert-l, 100%))}::ng-deep .mat-datetimepicker-content .mat-datetimepicker-calendar-content mat-datetimepicker-clock .mat-datetimepicker-clock .mat-datetimepicker-clock-hours .mat-datetimepicker-clock-cell,::ng-deep .mat-datetimepicker-content .mat-datetimepicker-calendar-content mat-datetimepicker-clock .mat-datetimepicker-clock .mat-datetimepicker-clock-minutes .mat-datetimepicker-clock-cell{color:hsl(var(--pep-color-system-primary-h, 0),var(--pep-color-system-primary-s, 0%),var(--pep-color-system-primary-l, 10%))}::ng-deep .mat-datetimepicker-content .mat-datetimepicker-calendar-content mat-datetimepicker-clock .mat-datetimepicker-clock .mat-datetimepicker-clock-hours .mat-datetimepicker-clock-cell:hover,::ng-deep .mat-datetimepicker-content .mat-datetimepicker-calendar-content mat-datetimepicker-clock .mat-datetimepicker-clock .mat-datetimepicker-clock-minutes .mat-datetimepicker-clock-cell:hover{background:hsla(var(--pep-color-weak-h, 0),var(--pep-color-weak-s, 0%),var(--pep-color-weak-l, 10%),.16)}::ng-deep .mat-datetimepicker-content .mat-datetimepicker-calendar-content mat-datetimepicker-clock .mat-datetimepicker-clock .mat-datetimepicker-clock-hours .mat-datetimepicker-clock-cell.mat-datetimepicker-clock-cell-selected,::ng-deep .mat-datetimepicker-content .mat-datetimepicker-calendar-content mat-datetimepicker-clock .mat-datetimepicker-clock .mat-datetimepicker-clock-minutes .mat-datetimepicker-clock-cell.mat-datetimepicker-clock-cell-selected{font-weight:var(--pep-font-weight-bold, 600);background:hsl(var(--pep-color-strong-h, 78),var(--pep-color-strong-s, 87%),var(--pep-color-strong-l, 27%));box-shadow:var(--pep-shadow-sm-offset, 0 .25rem .5rem 0) hsla(var(--pep-color-system-primary-h, 0),var(--pep-color-system-primary-s, 0%),var(--pep-color-system-primary-l, 10%),.08);color:hsl(var(--pep-color-system-primary-invert-h, 255),var(--pep-color-system-primary-invert-s, 100%),var(--pep-color-system-primary-invert-l, 100%))}::ng-deep .mat-datetimepicker-content .mat-datetimepicker-calendar-content mat-datetimepicker-clock .mat-datetimepicker-clock .mat-datetimepicker-clock-hours .mat-datetimepicker-clock-cell.mat-datetimepicker-clock-cell-selected .svg-icon,::ng-deep .mat-datetimepicker-content .mat-datetimepicker-calendar-content mat-datetimepicker-clock .mat-datetimepicker-clock .mat-datetimepicker-clock-minutes .mat-datetimepicker-clock-cell.mat-datetimepicker-clock-cell-selected .svg-icon{fill:hsl(var(--pep-color-system-primary-invert-h, 255),var(--pep-color-system-primary-invert-s, 100%),var(--pep-color-system-primary-invert-l, 100%))}::ng-deep .mat-datetimepicker-content .mat-datetimepicker-calendar-content mat-datetimepicker-clock .mat-datetimepicker-clock .mat-datetimepicker-clock-hours .mat-datetimepicker-clock-cell.mat-datetimepicker-clock-cell-selected .svg-icon.stroke,::ng-deep .mat-datetimepicker-content .mat-datetimepicker-calendar-content mat-datetimepicker-clock .mat-datetimepicker-clock .mat-datetimepicker-clock-minutes .mat-datetimepicker-clock-cell.mat-datetimepicker-clock-cell-selected .svg-icon.stroke{fill:unset;stroke:hsl(var(--pep-color-system-primary-invert-h, 255),var(--pep-color-system-primary-invert-s, 100%),var(--pep-color-system-primary-invert-l, 100%))}::ng-deep .mat-datetimepicker-content .mat-datetimepicker-calendar-content mat-datetimepicker-clock .mat-datetimepicker-clock .mat-datetimepicker-clock-hours .mat-datetimepicker-clock-cell.mat-datetimepicker-clock-cell-selected:hover,::ng-deep .mat-datetimepicker-content .mat-datetimepicker-calendar-content mat-datetimepicker-clock .mat-datetimepicker-clock .mat-datetimepicker-clock-minutes .mat-datetimepicker-clock-cell.mat-datetimepicker-clock-cell-selected:hover{background:hsl(var(--pep-color-strong-h, 78),var(--pep-color-strong-s, 87%),calc(var(--pep-color-strong-l, 27%) - 8%));box-shadow:var(--pep-shadow-sm-offset, 0 .25rem .5rem 0) hsla(var(--pep-color-system-primary-h, 0),var(--pep-color-system-primary-s, 0%),var(--pep-color-system-primary-l, 10%),.16)}::ng-deep .mat-datetimepicker-content .mat-datetimepicker-calendar-content mat-datetimepicker-clock .mat-datetimepicker-clock .mat-datetimepicker-clock-hours .mat-datetimepicker-clock-cell.mat-datetimepicker-clock-cell-selected:active,::ng-deep .mat-datetimepicker-content .mat-datetimepicker-calendar-content mat-datetimepicker-clock .mat-datetimepicker-clock .mat-datetimepicker-clock-minutes .mat-datetimepicker-clock-cell.mat-datetimepicker-clock-cell-selected:active{background:hsl(var(--pep-color-strong-h, 78),var(--pep-color-strong-s, 87%),calc(var(--pep-color-strong-l, 27%) - 15%));box-shadow:var(--pep-shadow-sm-offset, 0 .25rem .5rem 0) hsla(var(--pep-color-system-primary-h, 0),var(--pep-color-system-primary-s, 0%),var(--pep-color-system-primary-l, 10%),.08);box-shadow:0 0 0 var(--pep-spacing-xs, .25rem) hsla(var(--pep-color-text-link-h, 207),var(--pep-color-text-link-s, 76%),var(--pep-color-text-link-l, 37%),.5)}\n"], dependencies: [{ kind: "directive", type: i3.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { 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: i3.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }, { kind: "directive", type: i3.NgSwitch, selector: "[ngSwitch]", inputs: ["ngSwitch"] }, { kind: "directive", type: i3.NgSwitchDefault, selector: "[ngSwitchDefault]" }, { kind: "directive", type: i4.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: i4.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i4.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i4.RequiredValidator, selector: ":not([type=checkbox])[required][formControlName],:not([type=checkbox])[required][formControl],:not([type=checkbox])[required][ngModel]", inputs: ["required"] }, { kind: "directive", type: i4.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i4.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "component", type: i5.MatButton, selector: "button[mat-button], button[mat-raised-button], button[mat-icon-button],             button[mat-fab], button[mat-mini-fab], button[mat-stroked-button],             button[mat-flat-button]", inputs: ["disabled", "disableRipple", "color"], exportAs: ["matButton"] }, { kind: "component", type: i6.MatDatetimepickerComponent, selector: "mat-datetimepicker", inputs: ["multiYearSelector", "twelvehour", "startView", "mode", "timeInterval", "ariaNextMonthLabel", "ariaPrevMonthLabel", "ariaNextYearLabel", "ariaPrevYearLabel", "preventSameDateTimeSelection", "panelClass", "startAt", "openOnFocus", "type", "touchUi", "disabled"], outputs: ["selectedChanged", "opened", "closed", "viewChanged"], exportAs: ["matDatetimepicker"] }, { kind: "directive", type: i6.MatDatetimepickerInputDirective, selector: "input[matDatetimepicker]", inputs: ["matDatetimepicker", "matDatepickerFilter", "value", "min", "max", "disabled"], outputs: ["dateChange", "dateInput"], exportAs: ["matDatepickerInput"] }, { kind: "directive", type: i7.MatError, selector: "mat-error", inputs: ["id"] }, { kind: "component", type: i7.MatFormField, selector: "mat-form-field", inputs: ["color", "appearance", "hideRequiredMarker", "hintLabel", "floatLabel"], exportAs: ["matFormField"] }, { kind: "directive", type: i7.MatPrefix, selector: "[matPrefix]" }, { kind: "directive", type: i7.MatSuffix, selector: "[matSuffix]" }, { kind: "directive", type: i8.MatInput, selector: "input[matInput], textarea[matInput], select[matNativeControl],      input[matNativeControl], textarea[matNativeControl]", inputs: ["disabled", "id", "placeholder", "name", "required", "type", "errorStateMatcher", "aria-describedby", "value", "readonly"], exportAs: ["matInput"] }, { kind: "component", type: i9.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "component", type: i1$1.PepIconComponent, selector: "pep-icon", inputs: ["spin", "name", "fill"] }, { kind: "component", type: i11.PepFieldTitleComponent, selector: "pep-field-title", inputs: ["label", "mandatory", "disabled", "maxFieldCharacters", "hint", "xAlignment", "showTitle", "inputLength", "fontBodyType"] }, { kind: "component", type: i12.PepTextboxIconComponent, selector: "pep-textbox-icon", inputs: ["value", "label", "type", "disabled"], outputs: ["iconClick"] }, { kind: "pipe", type: i13.TranslatePipe, name: "translate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.0.2", ngImport: i0, type: PepDateComponent, decorators: [{
-            type: Component,
-            args: [{ selector: 'pep-date', changeDetection: ChangeDetectionStrategy.OnPush, providers: [
-                        // CUSTOM_INPUT_CONTROL_VALUE_ACCESSOR,
-                        // The locale would typically be provided on the root module of your application. We do it at
-                        // the component level here, due to limitations of our example generation script.
-                        // { provide: MAT_DATE_LOCALE, useValue: 'he' },
-                        { provide: MAT_DATE_LOCALE, useFactory: getCalture, deps: [PepLayoutService] },
-                        // `MomentDateAdapter` and `MAT_MOMENT_DATE_FORMATS` can be automatically provided by importing
-                        // `MatMomentDateModule` in your applications root module. We provide it at the component level
-                        // here, due to limitations of our example generation script.
-                        //{ provide: DateAdapter, useClass: MomentDateAdapter, deps: [MAT_DATE_LOCALE] },
-                        //{ provide: MAT_DATE_FORMATS, useValue: MAT_MOMENT_DATE_FORMATS },
-                        { provide: DateAdapter, useClass: MomentUtcDateAdapter },
-                        { provide: MAT_DATE_FORMATS, useValue: MY_DATE_FORMATS },
-                        { provide: DatetimeAdapter, useClass: MomentUtcDateTimeAdapter },
-                        //{ provide: MAT_DATETIME_FORMATS, useValue: MAT_NATIVE_DATETIME_FORMATS }
-                        { provide: MAT_DATETIME_FORMATS, useValue: MY_DATE_FORMATS },
-                    ], template: "<ng-container [formGroup]=\"form\">\n    <ng-template #pepTemplate let-showIcon=\"showIcon\">\n        <mat-form-field appearance=\"outline\">\n            <input #input [id]=\"key\" title=\"{{ formattedValue }}\" matInput class=\"body-sm\" autocomplete=\"false\"\n                [ngStyle]=\"{ color: textColor, 'text-align': xAlignment == 'center' ? 'center' : xAlignment == 'right' ? 'right' : 'left'}\"\n                [(ngModel)]=\"dateModel\" [ngModelOptions]=\"{standalone: true}\" [matDatetimepicker]=\"datetimePicker\"\n                [min]=\"minDate\" [max]=\"maxDate\" [required]=\"mandatory\" [disabled]=\"disabled\"\n                (dateChange)=\"onDateChange($event)\" (click)=\"openDatetimePicker(datetimePicker)\"\n                (blur)=\"onBlur($event)\" />\n            <mat-error *ngIf=\"renderError\"><span class=\"body-xs\"\n                    [title]=\"mandatory && formattedValue?.length == 0 ? ('MESSAGES.ERROR_IS_REQUIRED' | translate: {field: label}) : ('MESSAGES.ERROR_IS_NOT_VALID' | translate: {field: label})\"\n                    [innerText]=\"mandatory && formattedValue?.length == 0 ? ('MESSAGES.ERROR_IS_REQUIRED' | translate: {field: label}) : ('MESSAGES.ERROR_IS_NOT_VALID' | translate: {field: label})\"></span>\n            </mat-error>\n            <pep-textbox-icon *ngIf=\"renderSymbol && showIcon && xAlignment == 'right'\" matPrefix [value]=\"value\"\n                [label]=\"label\" [type]=\"type\" [disabled]=\"disabled\" (iconClick)=\"openDatetimePicker(datetimePicker)\">\n            </pep-textbox-icon>\n            <pep-textbox-icon *ngIf=\"renderSymbol && showIcon && xAlignment == 'left'\" matSuffix [value]=\"value\"\n                [label]=\"label\" [type]=\"type\" [disabled]=\"disabled\" (iconClick)=\"openDatetimePicker(datetimePicker)\">\n            </pep-textbox-icon>\n            <mat-datetimepicker #datetimePicker [type]=\"showTime ? 'datetime' : 'date'\" [openOnFocus]=\"false\"\n                [touchUi]=\"true\" [timeInterval]=\"1\"></mat-datetimepicker>\n        </mat-form-field>\n    </ng-template>\n\n    <ng-container *ngIf=\"layoutType === 'form'\">\n        <pep-field-title *ngIf=\"renderTitle\" [label]=\"label\" [mandatory]=\"mandatory\" [disabled]=\"disabled\"\n            [xAlignment]=\"xAlignment\" [showTitle]=\"showTitle\">\n        </pep-field-title>\n        <ng-container *ngTemplateOutlet=\"pepTemplate; context: {showIcon: true}\"></ng-container>\n    </ng-container>\n\n    <ng-container *ngIf=\"layoutType === 'card'\">\n        <ng-container *ngIf=\"isInEditMode; then editBlock; else readOnlyBlock\"></ng-container>\n        <ng-template #editBlock>\n            <div [ngClass]=\"{'one-row': rowSpan === 1}\">\n                <ng-container *ngTemplateOutlet=\"pepTemplate; context: {showIcon: false}\"></ng-container>\n            </div>\n        </ng-template>\n        <ng-template #readOnlyBlock>\n            <div class=\"pep-card-input card-flex-container\"\n                [ngClass]=\"{'one-row': rowSpan === 1, 'pep-button weak': isActive && !disabled }\"\n                [ngStyle]=\"{ color: textColor }\" [class]=\"'text-align-' + xAlignment\"\n                (click)=\"!disabled ? cardTemplateClicked($event) : ''\">\n                <span *ngIf=\"showTitle && label != ''\" class=\"body-xs title\" title=\"{{ label }}\">{{ label\n                    }}&nbsp;</span>\n                <span [id]=\"key\" title=\"{{ formattedValue }}\" class=\"body-sm value\">{{ formattedValue }}</span>\n                <button *ngIf=\"isActive && !disabled\" class=\"pep-button weak card-edit-button\" mat-button>\n                    <mat-icon>\n                        <pep-icon name=\"system_edit\">\n                        </pep-icon>\n                    </mat-icon>\n                </button>\n            </div>\n        </ng-template>\n    </ng-container>\n\n    <ng-container *ngIf=\"layoutType === 'table'\">\n        <ng-container *ngIf=\"isActive && !disabled; then selectedBlock; else notSelectedBlock\"></ng-container>\n        <ng-template #selectedBlock>\n            <ng-container *ngTemplateOutlet=\"pepTemplate; context: {showIcon: true}\"></ng-container>\n        </ng-template>\n        <ng-template #notSelectedBlock>\n            <ng-container *ngIf=\"formattedValue?.length > 0; then notEmptyBlock; else emptyBlock\"></ng-container>\n            <ng-template #notEmptyBlock>\n                <ng-container [ngSwitch]=\"type\">\n                    <ng-container *ngSwitchDefault>\n                        <span [id]=\"key\" class=\"body-sm pep-report-input\" [ngStyle]=\"{ color: textColor }\"\n                            [ngClass]=\"{readonly: disabled}\" title=\"{{ formattedValue }}\">{{ formattedValue }}</span>\n                    </ng-container>\n                </ng-container>\n            </ng-template>\n            <ng-template #emptyBlock>\n                <span [id]=\"key\">&nbsp;</span>\n            </ng-template>\n        </ng-template>\n    </ng-container>\n</ng-container>", styles: [":host{height:inherit;display:grid}:host>*{align-self:center}::ng-deep .mat-form-field .mat-form-field-wrapper .mat-form-field-prefix .mat-datetimepicker-toggle.mat-button,::ng-deep .mat-form-field .mat-form-field-wrapper .mat-form-field-suffix .mat-datetimepicker-toggle.mat-button{padding:0}\n", "::ng-deep .mat-datetimepicker-dialog{max-width:90vw!important}::ng-deep .mat-datetimepicker-content{border-radius:inherit}::ng-deep .mat-datetimepicker-content .mat-datetimepicker-calendar-header{font-weight:var(--pep-font-weight-bold, 600);background:hsl(var(--pep-color-strong-h, 78),var(--pep-color-strong-s, 87%),var(--pep-color-strong-l, 27%));box-shadow:var(--pep-shadow-sm-offset, 0 .25rem .5rem 0) hsla(var(--pep-color-system-primary-h, 0),var(--pep-color-system-primary-s, 0%),var(--pep-color-system-primary-l, 10%),.08);color:hsl(var(--pep-color-system-primary-invert-h, 255),var(--pep-color-system-primary-invert-s, 100%),var(--pep-color-system-primary-invert-l, 100%))}::ng-deep .mat-datetimepicker-content .mat-datetimepicker-calendar-header .svg-icon{fill:hsl(var(--pep-color-system-primary-invert-h, 255),var(--pep-color-system-primary-invert-s, 100%),var(--pep-color-system-primary-invert-l, 100%))}::ng-deep .mat-datetimepicker-content .mat-datetimepicker-calendar-header .svg-icon.stroke{fill:unset;stroke:hsl(var(--pep-color-system-primary-invert-h, 255),var(--pep-color-system-primary-invert-s, 100%),var(--pep-color-system-primary-invert-l, 100%))}::ng-deep .mat-datetimepicker-content .mat-datetimepicker-calendar-content .mat-month-content .mat-datetimepicker-calendar-controls{color:hsl(var(--pep-color-system-primary-h, 0),var(--pep-color-system-primary-s, 0%),var(--pep-color-system-primary-l, 10%))}::ng-deep .mat-datetimepicker-content .mat-datetimepicker-calendar-content .mat-month-content .mat-datetimepicker-calendar-controls .mat-datetimepicker-calendar-previous-button{content:url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0iVVRGLTgiIHN0YW5kYWxvbmU9Im5vIj8+CjxzdmcKICAgeG1sbnM6ZGM9Imh0dHA6Ly9wdXJsLm9yZy9kYy9lbGVtZW50cy8xLjEvIgogICB4bWxuczpjYz0iaHR0cDovL2NyZWF0aXZlY29tbW9ucy5vcmcvbnMjIgogICB4bWxuczpyZGY9Imh0dHA6Ly93d3cudzMub3JnLzE5OTkvMDIvMjItcmRmLXN5bnRheC1ucyMiCiAgIHhtbG5zOnN2Zz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciCiAgIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIKICAgaWQ9InN2ZzQiCiAgIHZlcnNpb249IjEuMSIKICAgdmlld0JveD0iMCAwIDI0IDI0IgogICBoZWlnaHQ9IjE2IgogICB3aWR0aD0iMTYiPgogIDxtZXRhZGF0YQogICAgIGlkPSJtZXRhZGF0YTEwIj4KICAgIDxyZGY6UkRGPgogICAgICA8Y2M6V29yawogICAgICAgICByZGY6YWJvdXQ9IiI+CiAgICAgICAgPGRjOmZvcm1hdD5pbWFnZS9zdmcreG1sPC9kYzpmb3JtYXQ+CiAgICAgICAgPGRjOnR5cGUKICAgICAgICAgICByZGY6cmVzb3VyY2U9Imh0dHA6Ly9wdXJsLm9yZy9kYy9kY21pdHlwZS9TdGlsbEltYWdlIiAvPgogICAgICA8L2NjOldvcms+CiAgICA8L3JkZjpSREY+CiAgPC9tZXRhZGF0YT4KICA8ZGVmcwogICAgIGlkPSJkZWZzOCIgLz4KICA8cGF0aAogICAgIGlkPSJwYXRoMiIKICAgICBkPSJNNS44MDAzMjE0OCw5LjI4Njc0MzU0IEwxMS4yNTQyODI0LDEzLjIwMjc1ODMgQzExLjY2NjEzMDksMTMuNTg1MDgzIDEyLjMzMzg2OTEsMTMuNTg1MDgzIDEyLjc0NTcxNzYsMTMuMjAyNzU4MyBMMTguMTk5Njc4NSw5LjI4Njc0MzU0IEMxOC42MTE1MjcsOC45MDQ0MTg4MiAxOS4yNzkyNjUyLDguOTA0NDE4ODIgMTkuNjkxMTEzNyw5LjI4Njc0MzU0IEMyMC4xMDI5NjIxLDkuNjY5MDY4MjYgMjAuMTAyOTYyMSwxMC4yODg5MzkxIDE5LjY5MTExMzcsMTAuNjcxMjYzOCBMMTMuNDkxNDM1MSwxNi40MjY1MTI5IEMxMi42Njc3MzgzLDE3LjE5MTE2MjQgMTEuMzMyMjYxNywxNy4xOTExNjI0IDEwLjUwODU2NDksMTYuNDI2NTEyOSBMNC4zMDg4ODYzMywxMC42NzEyNjM4IEMzLjg5NzAzNzg5LDEwLjI4ODkzOTEgMy44OTcwMzc4OSw5LjY2OTA2ODI2IDQuMzA4ODg2MzMsOS4yODY3NDM1NCBDNC43MjA3MzQ3OCw4LjkwNDQxODgyIDUuMzg4NDczMDMsOC45MDQ0MTg4MiA1LjgwMDMyMTQ4LDkuMjg2NzQzNTQgWiIKICAgICBmaWxsLXJ1bGU9ImV2ZW5vZGQiCiAgICAgZmlsbC1vcGFjaXR5PSIuNSIgLz4KPC9zdmc+Cg==);transform:rotate(90deg)}::ng-deep .mat-datetimepicker-content .mat-datetimepicker-calendar-content .mat-month-content .mat-datetimepicker-calendar-controls .mat-datetimepicker-calendar-previous-button svg{fill:hsla(var(--pep-color-system-primary-h, 0),var(--pep-color-system-primary-s, 0%),var(--pep-color-system-primary-l, 10%),.8)}::ng-deep .mat-datetimepicker-content .mat-datetimepicker-calendar-content .mat-month-content .mat-datetimepicker-calendar-controls .mat-datetimepicker-calendar-previous-button svg.stroke{fill:unset;stroke:hsla(var(--pep-color-system-primary-h, 0),var(--pep-color-system-primary-s, 0%),var(--pep-color-system-primary-l, 10%),.8)}::ng-deep .mat-datetimepicker-content .mat-datetimepicker-calendar-content .mat-month-content .mat-datetimepicker-calendar-controls .mat-datetimepicker-calendar-previous-button svg:hover{fill:hsla(var(--pep-color-system-primary-h, 0),var(--pep-color-system-primary-s, 0%),var(--pep-color-system-primary-l, 10%),.97)}::ng-deep .mat-datetimepicker-content .mat-datetimepicker-calendar-content .mat-month-content .mat-datetimepicker-calendar-controls .mat-datetimepicker-calendar-previous-button svg:hover.stroke{fill:unset;stroke:hsla(var(--pep-color-system-primary-h, 0),var(--pep-color-system-primary-s, 0%),var(--pep-color-system-primary-l, 10%),.97)}::ng-deep .mat-datetimepicker-content .mat-datetimepicker-calendar-content .mat-month-content .mat-datetimepicker-calendar-controls .mat-datetimepicker-calendar-previous-button svg:active{fill:hsl(var(--pep-color-system-primary-h, 0),var(--pep-color-system-primary-s, 0%),var(--pep-color-system-primary-l, 10%))}::ng-deep .mat-datetimepicker-content .mat-datetimepicker-calendar-content .mat-month-content .mat-datetimepicker-calendar-controls .mat-datetimepicker-calendar-previous-button svg:active.stroke{fill:unset;stroke:hsl(var(--pep-color-system-primary-h, 0),var(--pep-color-system-primary-s, 0%),var(--pep-color-system-primary-l, 10%))}::ng-deep .mat-datetimepicker-content .mat-datetimepicker-calendar-content .mat-month-content .mat-datetimepicker-calendar-controls .mat-datetimepicker-calendar-previous-button svg:disabled{fill:hsla(var(--pep-color-system-primary-h, 0),var(--pep-color-system-primary-s, 0%),var(--pep-color-system-primary-l, 10%),.35)}::ng-deep .mat-datetimepicker-content .mat-datetimepicker-calendar-content .mat-month-content .mat-datetimepicker-calendar-controls .mat-datetimepicker-calendar-previous-button svg:disabled.stroke{fill:unset;stroke:hsla(var(--pep-color-system-primary-h, 0),var(--pep-color-system-primary-s, 0%),var(--pep-color-system-primary-l, 10%),.35)}::ng-deep .mat-datetimepicker-content .mat-datetimepicker-calendar-content .mat-month-content .mat-datetimepicker-calendar-controls .mat-datetimepicker-calendar-next-button{content:url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0iVVRGLTgiIHN0YW5kYWxvbmU9Im5vIj8+CjxzdmcKICAgeG1sbnM6ZGM9Imh0dHA6Ly9wdXJsLm9yZy9kYy9lbGVtZW50cy8xLjEvIgogICB4bWxuczpjYz0iaHR0cDovL2NyZWF0aXZlY29tbW9ucy5vcmcvbnMjIgogICB4bWxuczpyZGY9Imh0dHA6Ly93d3cudzMub3JnLzE5OTkvMDIvMjItcmRmLXN5bnRheC1ucyMiCiAgIHhtbG5zOnN2Zz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciCiAgIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIKICAgaWQ9InN2ZzQiCiAgIHZlcnNpb249IjEuMSIKICAgdmlld0JveD0iMCAwIDI0IDI0IgogICBoZWlnaHQ9IjE2IgogICB3aWR0aD0iMTYiPgogIDxtZXRhZGF0YQogICAgIGlkPSJtZXRhZGF0YTEwIj4KICAgIDxyZGY6UkRGPgogICAgICA8Y2M6V29yawogICAgICAgICByZGY6YWJvdXQ9IiI+CiAgICAgICAgPGRjOmZvcm1hdD5pbWFnZS9zdmcreG1sPC9kYzpmb3JtYXQ+CiAgICAgICAgPGRjOnR5cGUKICAgICAgICAgICByZGY6cmVzb3VyY2U9Imh0dHA6Ly9wdXJsLm9yZy9kYy9kY21pdHlwZS9TdGlsbEltYWdlIiAvPgogICAgICA8L2NjOldvcms+CiAgICA8L3JkZjpSREY+CiAgPC9tZXRhZGF0YT4KICA8ZGVmcwogICAgIGlkPSJkZWZzOCIgLz4KICA8cGF0aAogICAgIGlkPSJwYXRoMiIKICAgICBkPSJNNS44MDAzMjE0OCw5LjI4Njc0MzU0IEwxMS4yNTQyODI0LDEzLjIwMjc1ODMgQzExLjY2NjEzMDksMTMuNTg1MDgzIDEyLjMzMzg2OTEsMTMuNTg1MDgzIDEyLjc0NTcxNzYsMTMuMjAyNzU4MyBMMTguMTk5Njc4NSw5LjI4Njc0MzU0IEMxOC42MTE1MjcsOC45MDQ0MTg4MiAxOS4yNzkyNjUyLDguOTA0NDE4ODIgMTkuNjkxMTEzNyw5LjI4Njc0MzU0IEMyMC4xMDI5NjIxLDkuNjY5MDY4MjYgMjAuMTAyOTYyMSwxMC4yODg5MzkxIDE5LjY5MTExMzcsMTAuNjcxMjYzOCBMMTMuNDkxNDM1MSwxNi40MjY1MTI5IEMxMi42Njc3MzgzLDE3LjE5MTE2MjQgMTEuMzMyMjYxNywxNy4xOTExNjI0IDEwLjUwODU2NDksMTYuNDI2NTEyOSBMNC4zMDg4ODYzMywxMC42NzEyNjM4IEMzLjg5NzAzNzg5LDEwLjI4ODkzOTEgMy44OTcwMzc4OSw5LjY2OTA2ODI2IDQuMzA4ODg2MzMsOS4yODY3NDM1NCBDNC43MjA3MzQ3OCw4LjkwNDQxODgyIDUuMzg4NDczMDMsOC45MDQ0MTg4MiA1LjgwMDMyMTQ4LDkuMjg2NzQzNTQgWiIKICAgICBmaWxsLXJ1bGU9ImV2ZW5vZGQiCiAgICAgZmlsbC1vcGFjaXR5PSIuNSIgLz4KPC9zdmc+Cg==);transform:rotate(-90deg)}::ng-deep .mat-datetimepicker-content .mat-datetimepicker-calendar-content .mat-month-content .mat-datetimepicker-calendar-controls .mat-datetimepicker-calendar-next-button svg{fill:hsla(var(--pep-color-system-primary-h, 0),var(--pep-color-system-primary-s, 0%),var(--pep-color-system-primary-l, 10%),.8)}::ng-deep .mat-datetimepicker-content .mat-datetimepicker-calendar-content .mat-month-content .mat-datetimepicker-calendar-controls .mat-datetimepicker-calendar-next-button svg.stroke{fill:unset;stroke:hsla(var(--pep-color-system-primary-h, 0),var(--pep-color-system-primary-s, 0%),var(--pep-color-system-primary-l, 10%),.8)}::ng-deep .mat-datetimepicker-content .mat-datetimepicker-calendar-content .mat-month-content .mat-datetimepicker-calendar-controls .mat-datetimepicker-calendar-next-button svg:hover{fill:hsla(var(--pep-color-system-primary-h, 0),var(--pep-color-system-primary-s, 0%),var(--pep-color-system-primary-l, 10%),.97)}::ng-deep .mat-datetimepicker-content .mat-datetimepicker-calendar-content .mat-month-content .mat-datetimepicker-calendar-controls .mat-datetimepicker-calendar-next-button svg:hover.stroke{fill:unset;stroke:hsla(var(--pep-color-system-primary-h, 0),var(--pep-color-system-primary-s, 0%),var(--pep-color-system-primary-l, 10%),.97)}::ng-deep .mat-datetimepicker-content .mat-datetimepicker-calendar-content .mat-month-content .mat-datetimepicker-calendar-controls .mat-datetimepicker-calendar-next-button svg:active{fill:hsl(var(--pep-color-system-primary-h, 0),var(--pep-color-system-primary-s, 0%),var(--pep-color-system-primary-l, 10%))}::ng-deep .mat-datetimepicker-content .mat-datetimepicker-calendar-content .mat-month-content .mat-datetimepicker-calendar-controls .mat-datetimepicker-calendar-next-button svg:active.stroke{fill:unset;stroke:hsl(var(--pep-color-system-primary-h, 0),var(--pep-color-system-primary-s, 0%),var(--pep-color-system-primary-l, 10%))}::ng-deep .mat-datetimepicker-content .mat-datetimepicker-calendar-content .mat-month-content .mat-datetimepicker-calendar-controls .mat-datetimepicker-calendar-next-button svg:disabled{fill:hsla(var(--pep-color-system-primary-h, 0),var(--pep-color-system-primary-s, 0%),var(--pep-color-system-primary-l, 10%),.35)}::ng-deep .mat-datetimepicker-content .mat-datetimepicker-calendar-content .mat-month-content .mat-datetimepicker-calendar-controls .mat-datetimepicker-calendar-next-button svg:disabled.stroke{fill:unset;stroke:hsla(var(--pep-color-system-primary-h, 0),var(--pep-color-system-primary-s, 0%),var(--pep-color-system-primary-l, 10%),.35)}::ng-deep .mat-datetimepicker-content .mat-datetimepicker-calendar-content mat-datetimepicker-year-view .mat-datetimepicker-calendar-table .mat-datetimepicker-calendar-table-header,::ng-deep .mat-datetimepicker-content .mat-datetimepicker-calendar-content mat-datetimepicker-month-view .mat-datetimepicker-calendar-table .mat-datetimepicker-calendar-table-header{color:hsla(var(--pep-color-system-primary-h, 0),var(--pep-color-system-primary-s, 0%),var(--pep-color-system-primary-l, 10%),.7)}::ng-deep .mat-datetimepicker-content .mat-datetimepicker-calendar-content mat-datetimepicker-year-view .mat-datetimepicker-calendar-table .mat-datetimepicker-calendar-body,::ng-deep .mat-datetimepicker-content .mat-datetimepicker-calendar-content mat-datetimepicker-month-view .mat-datetimepicker-calendar-table .mat-datetimepicker-calendar-body{color:hsl(var(--pep-color-system-primary-h, 0),var(--pep-color-system-primary-s, 0%),var(--pep-color-system-primary-l, 10%))}::ng-deep .mat-datetimepicker-content .mat-datetimepicker-calendar-content mat-datetimepicker-year-view .mat-datetimepicker-calendar-table .mat-datetimepicker-calendar-body .mat-datetimepicker-calendar-body-label,::ng-deep .mat-datetimepicker-content .mat-datetimepicker-calendar-content mat-datetimepicker-month-view .mat-datetimepicker-calendar-table .mat-datetimepicker-calendar-body .mat-datetimepicker-calendar-body-label{color:hsla(var(--pep-color-system-primary-h, 0),var(--pep-color-system-primary-s, 0%),var(--pep-color-system-primary-l, 10%),.7)}::ng-deep .mat-datetimepicker-content .mat-datetimepicker-calendar-content mat-datetimepicker-year-view .mat-datetimepicker-calendar-table .mat-datetimepicker-calendar-body .mat-datetimepicker-calendar-body-cell:hover .mat-datetimepicker-calendar-body-cell-content,::ng-deep .mat-datetimepicker-content .mat-datetimepicker-calendar-content mat-datetimepicker-month-view .mat-datetimepicker-calendar-table .mat-datetimepicker-calendar-body .mat-datetimepicker-calendar-body-cell:hover .mat-datetimepicker-calendar-body-cell-content{background:hsla(var(--pep-color-weak-h, 0),var(--pep-color-weak-s, 0%),var(--pep-color-weak-l, 10%),.16)}::ng-deep .mat-datetimepicker-content .mat-datetimepicker-calendar-content mat-datetimepicker-year-view .mat-datetimepicker-calendar-table .mat-datetimepicker-calendar-body .mat-datetimepicker-calendar-body-cell:active .mat-datetimepicker-calendar-body-cell-content,::ng-deep .mat-datetimepicker-content .mat-datetimepicker-calendar-content mat-datetimepicker-month-view .mat-datetimepicker-calendar-table .mat-datetimepicker-calendar-body .mat-datetimepicker-calendar-body-cell:active .mat-datetimepicker-calendar-body-cell-content{box-shadow:var(--pep-shadow-xs-offset, 0 .125rem .25rem 0) hsla(var(--pep-color-system-primary-h, 0),var(--pep-color-system-primary-s, 0%),var(--pep-color-system-primary-l, 10%),.08);border:1px solid hsl(var(--pep-color-weak-h, 0),var(--pep-color-weak-s, 0%),var(--pep-color-weak-l, 10%))}::ng-deep .mat-datetimepicker-content .mat-datetimepicker-calendar-content mat-datetimepicker-year-view .mat-datetimepicker-calendar-table .mat-datetimepicker-calendar-body .mat-datetimepicker-calendar-body-cell:active .mat-datetimepicker-calendar-body-cell-content:not(.keep-background-on-focus),::ng-deep .mat-datetimepicker-content .mat-datetimepicker-calendar-content mat-datetimepicker-month-view .mat-datetimepicker-calendar-table .mat-datetimepicker-calendar-body .mat-datetimepicker-calendar-body-cell:active .mat-datetimepicker-calendar-body-cell-content:not(.keep-background-on-focus){background:hsl(var(--pep-color-system-primary-invert-h, 255),var(--pep-color-system-primary-invert-s, 100%),var(--pep-color-system-primary-invert-l, 100%))}::ng-deep .mat-datetimepicker-content .mat-datetimepicker-calendar-content mat-datetimepicker-year-view .mat-datetimepicker-calendar-table .mat-datetimepicker-calendar-body .mat-datetimepicker-calendar-body-cell .mat-datetimepicker-calendar-body-cell-content.mat-datetimepicker-calendar-body-today,::ng-deep .mat-datetimepicker-content .mat-datetimepicker-calendar-content mat-datetimepicker-month-view .mat-datetimepicker-calendar-table .mat-datetimepicker-calendar-body .mat-datetimepicker-calendar-body-cell .mat-datetimepicker-calendar-body-cell-content.mat-datetimepicker-calendar-body-today{background:hsl(var(--pep-color-regular-h, 0),var(--pep-color-regular-s, 0%),98%);box-shadow:var(--pep-shadow-xs-offset, 0 .125rem .25rem 0) hsla(var(--pep-color-system-primary-h, 0),var(--pep-color-system-primary-s, 0%),var(--pep-color-system-primary-l, 10%),.08);border:1px solid hsl(var(--pep-color-regular-h, 0),var(--pep-color-regular-s, 0%),calc(var(--pep-color-regular-l, 10%) + 30%))}::ng-deep .mat-datetimepicker-content .mat-datetimepicker-calendar-content mat-datetimepicker-year-view .mat-datetimepicker-calendar-table .mat-datetimepicker-calendar-body .mat-datetimepicker-calendar-body-cell .mat-datetimepicker-calendar-body-cell-content.mat-datetimepicker-calendar-body-today:hover,::ng-deep .mat-datetimepicker-content .mat-datetimepicker-calendar-content mat-datetimepicker-month-view .mat-datetimepicker-calendar-table .mat-datetimepicker-calendar-body .mat-datetimepicker-calendar-body-cell .mat-datetimepicker-calendar-body-cell-content.mat-datetimepicker-calendar-body-today:hover{background:hsl(var(--pep-color-regular-h, 0),var(--pep-color-regular-s, 0%),98%);box-shadow:var(--pep-shadow-xs-offset, 0 .125rem .25rem 0) hsla(var(--pep-color-system-primary-h, 0),var(--pep-color-system-primary-s, 0%),var(--pep-color-system-primary-l, 10%),.16);border:1px solid hsl(var(--pep-color-regular-h, 0),var(--pep-color-regular-s, 0%),calc(var(--pep-color-regular-l, 10%) + 20%))}::ng-deep .mat-datetimepicker-content .mat-datetimepicker-calendar-content mat-datetimepicker-year-view .mat-datetimepicker-calendar-table .mat-datetimepicker-calendar-body .mat-datetimepicker-calendar-body-cell .mat-datetimepicker-calendar-body-cell-content.mat-datetimepicker-calendar-body-today:active,::ng-deep .mat-datetimepicker-content .mat-datetimepicker-calendar-content mat-datetimepicker-month-view .mat-datetimepicker-calendar-table .mat-datetimepicker-calendar-body .mat-datetimepicker-calendar-body-cell .mat-datetimepicker-calendar-body-cell-content.mat-datetimepicker-calendar-body-today:active{background:hsl(var(--pep-color-regular-h, 0),var(--pep-color-regular-s, 0%),88%);box-shadow:var(--pep-shadow-xs-offset, 0 .125rem .25rem 0) hsla(var(--pep-color-system-primary-h, 0),var(--pep-color-system-primary-s, 0%),var(--pep-color-system-primary-l, 10%),.16);border:1px solid hsl(var(--pep-color-regular-h, 0),var(--pep-color-regular-s, 0%),var(--pep-color-regular-l, 10%));box-shadow:0 0 0 var(--pep-spacing-xs, .25rem) hsla(var(--pep-color-text-link-h, 207),var(--pep-color-text-link-s, 76%),var(--pep-color-text-link-l, 37%),.5)}::ng-deep .mat-datetimepicker-content .mat-datetimepicker-calendar-content mat-datetimepicker-year-view .mat-datetimepicker-calendar-table .mat-datetimepicker-calendar-body .mat-datetimepicker-calendar-body-cell .mat-datetimepicker-calendar-body-cell-content.mat-datetimepicker-calendar-body-selected,::ng-deep .mat-datetimepicker-content .mat-datetimepicker-calendar-content mat-datetimepicker-month-view .mat-datetimepicker-calendar-table .mat-datetimepicker-calendar-body .mat-datetimepicker-calendar-body-cell .mat-datetimepicker-calendar-body-cell-content.mat-datetimepicker-calendar-body-selected{font-weight:var(--pep-font-weight-bold, 600);background:hsl(var(--pep-color-strong-h, 78),var(--pep-color-strong-s, 87%),var(--pep-color-strong-l, 27%));box-shadow:var(--pep-shadow-sm-offset, 0 .25rem .5rem 0) hsla(var(--pep-color-system-primary-h, 0),var(--pep-color-system-primary-s, 0%),var(--pep-color-system-primary-l, 10%),.08);color:hsl(var(--pep-color-system-primary-invert-h, 255),var(--pep-color-system-primary-invert-s, 100%),var(--pep-color-system-primary-invert-l, 100%))}::ng-deep .mat-datetimepicker-content .mat-datetimepicker-calendar-content mat-datetimepicker-year-view .mat-datetimepicker-calendar-table .mat-datetimepicker-calendar-body .mat-datetimepicker-calendar-body-cell .mat-datetimepicker-calendar-body-cell-content.mat-datetimepicker-calendar-body-selected .svg-icon,::ng-deep .mat-datetimepicker-content .mat-datetimepicker-calendar-content mat-datetimepicker-month-view .mat-datetimepicker-calendar-table .mat-datetimepicker-calendar-body .mat-datetimepicker-calendar-body-cell .mat-datetimepicker-calendar-body-cell-content.mat-datetimepicker-calendar-body-selected .svg-icon{fill:hsl(var(--pep-color-system-primary-invert-h, 255),var(--pep-color-system-primary-invert-s, 100%),var(--pep-color-system-primary-invert-l, 100%))}::ng-deep .mat-datetimepicker-content .mat-datetimepicker-calendar-content mat-datetimepicker-year-view .mat-datetimepicker-calendar-table .mat-datetimepicker-calendar-body .mat-datetimepicker-calendar-body-cell .mat-datetimepicker-calendar-body-cell-content.mat-datetimepicker-calendar-body-selected .svg-icon.stroke,::ng-deep .mat-datetimepicker-content .mat-datetimepicker-calendar-content mat-datetimepicker-month-view .mat-datetimepicker-calendar-table .mat-datetimepicker-calendar-body .mat-datetimepicker-calendar-body-cell .mat-datetimepicker-calendar-body-cell-content.mat-datetimepicker-calendar-body-selected .svg-icon.stroke{fill:unset;stroke:hsl(var(--pep-color-system-primary-invert-h, 255),var(--pep-color-system-primary-invert-s, 100%),var(--pep-color-system-primary-invert-l, 100%))}::ng-deep .mat-datetimepicker-content .mat-datetimepicker-calendar-content mat-datetimepicker-year-view .mat-datetimepicker-calendar-table .mat-datetimepicker-calendar-body .mat-datetimepicker-calendar-body-cell .mat-datetimepicker-calendar-body-cell-content.mat-datetimepicker-calendar-body-selected:hover,::ng-deep .mat-datetimepicker-content .mat-datetimepicker-calendar-content mat-datetimepicker-month-view .mat-datetimepicker-calendar-table .mat-datetimepicker-calendar-body .mat-datetimepicker-calendar-body-cell .mat-datetimepicker-calendar-body-cell-content.mat-datetimepicker-calendar-body-selected:hover{background:hsl(var(--pep-color-strong-h, 78),var(--pep-color-strong-s, 87%),calc(var(--pep-color-strong-l, 27%) - 8%));box-shadow:var(--pep-shadow-sm-offset, 0 .25rem .5rem 0) hsla(var(--pep-color-system-primary-h, 0),var(--pep-color-system-primary-s, 0%),var(--pep-color-system-primary-l, 10%),.16)}::ng-deep .mat-datetimepicker-content .mat-datetimepicker-calendar-content mat-datetimepicker-year-view .mat-datetimepicker-calendar-table .mat-datetimepicker-calendar-body .mat-datetimepicker-calendar-body-cell .mat-datetimepicker-calendar-body-cell-content.mat-datetimepicker-calendar-body-selected:active,::ng-deep .mat-datetimepicker-content .mat-datetimepicker-calendar-content mat-datetimepicker-month-view .mat-datetimepicker-calendar-table .mat-datetimepicker-calendar-body .mat-datetimepicker-calendar-body-cell .mat-datetimepicker-calendar-body-cell-content.mat-datetimepicker-calendar-body-selected:active{background:hsl(var(--pep-color-strong-h, 78),var(--pep-color-strong-s, 87%),calc(var(--pep-color-strong-l, 27%) - 15%));box-shadow:var(--pep-shadow-sm-offset, 0 .25rem .5rem 0) hsla(var(--pep-color-system-primary-h, 0),var(--pep-color-system-primary-s, 0%),var(--pep-color-system-primary-l, 10%),.08);box-shadow:0 0 0 var(--pep-spacing-xs, .25rem) hsla(var(--pep-color-text-link-h, 207),var(--pep-color-text-link-s, 76%),var(--pep-color-text-link-l, 37%),.5)}::ng-deep .mat-datetimepicker-content .mat-datetimepicker-calendar-content mat-datetimepicker-clock .mat-datetimepicker-clock{background:hsla(var(--pep-color-weak-h, 0),var(--pep-color-weak-s, 0%),var(--pep-color-weak-l, 10%),.12)}::ng-deep .mat-datetimepicker-content .mat-datetimepicker-calendar-content mat-datetimepicker-clock .mat-datetimepicker-clock .mat-datetimepicker-clock-center{font-weight:var(--pep-font-weight-bold, 600);background:hsl(var(--pep-color-strong-h, 78),var(--pep-color-strong-s, 87%),var(--pep-color-strong-l, 27%));box-shadow:var(--pep-shadow-sm-offset, 0 .25rem .5rem 0) hsla(var(--pep-color-system-primary-h, 0),var(--pep-color-system-primary-s, 0%),var(--pep-color-system-primary-l, 10%),.08);color:hsl(var(--pep-color-system-primary-invert-h, 255),var(--pep-color-system-primary-invert-s, 100%),var(--pep-color-system-primary-invert-l, 100%))}::ng-deep .mat-datetimepicker-content .mat-datetimepicker-calendar-content mat-datetimepicker-clock .mat-datetimepicker-clock .mat-datetimepicker-clock-center .svg-icon{fill:hsl(var(--pep-color-system-primary-invert-h, 255),var(--pep-color-system-primary-invert-s, 100%),var(--pep-color-system-primary-invert-l, 100%))}::ng-deep .mat-datetimepicker-content .mat-datetimepicker-calendar-content mat-datetimepicker-clock .mat-datetimepicker-clock .mat-datetimepicker-clock-center .svg-icon.stroke{fill:unset;stroke:hsl(var(--pep-color-system-primary-invert-h, 255),var(--pep-color-system-primary-invert-s, 100%),var(--pep-color-system-primary-invert-l, 100%))}::ng-deep .mat-datetimepicker-content .mat-datetimepicker-calendar-content mat-datetimepicker-clock .mat-datetimepicker-clock .mat-datetimepicker-clock-hand{font-weight:var(--pep-font-weight-bold, 600);background:hsl(var(--pep-color-strong-h, 78),var(--pep-color-strong-s, 87%),var(--pep-color-strong-l, 27%));box-shadow:var(--pep-shadow-sm-offset, 0 .25rem .5rem 0) hsla(var(--pep-color-system-primary-h, 0),var(--pep-color-system-primary-s, 0%),var(--pep-color-system-primary-l, 10%),.08);color:hsl(var(--pep-color-system-primary-invert-h, 255),var(--pep-color-system-primary-invert-s, 100%),var(--pep-color-system-primary-invert-l, 100%))}::ng-deep .mat-datetimepicker-content .mat-datetimepicker-calendar-content mat-datetimepicker-clock .mat-datetimepicker-clock .mat-datetimepicker-clock-hand .svg-icon{fill:hsl(var(--pep-color-system-primary-invert-h, 255),var(--pep-color-system-primary-invert-s, 100%),var(--pep-color-system-primary-invert-l, 100%))}::ng-deep .mat-datetimepicker-content .mat-datetimepicker-calendar-content mat-datetimepicker-clock .mat-datetimepicker-clock .mat-datetimepicker-clock-hand .svg-icon.stroke{fill:unset;stroke:hsl(var(--pep-color-system-primary-invert-h, 255),var(--pep-color-system-primary-invert-s, 100%),var(--pep-color-system-primary-invert-l, 100%))}::ng-deep .mat-datetimepicker-content .mat-datetimepicker-calendar-content mat-datetimepicker-clock .mat-datetimepicker-clock .mat-datetimepicker-clock-hand:before{font-weight:var(--pep-font-weight-bold, 600);background:hsl(var(--pep-color-strong-h, 78),var(--pep-color-strong-s, 87%),var(--pep-color-strong-l, 27%));box-shadow:var(--pep-shadow-sm-offset, 0 .25rem .5rem 0) hsla(var(--pep-color-system-primary-h, 0),var(--pep-color-system-primary-s, 0%),var(--pep-color-system-primary-l, 10%),.08);color:hsl(var(--pep-color-system-primary-invert-h, 255),var(--pep-color-system-primary-invert-s, 100%),var(--pep-color-system-primary-invert-l, 100%))}::ng-deep .mat-datetimepicker-content .mat-datetimepicker-calendar-content mat-datetimepicker-clock .mat-datetimepicker-clock .mat-datetimepicker-clock-hand:before .svg-icon{fill:hsl(var(--pep-color-system-primary-invert-h, 255),var(--pep-color-system-primary-invert-s, 100%),var(--pep-color-system-primary-invert-l, 100%))}::ng-deep .mat-datetimepicker-content .mat-datetimepicker-calendar-content mat-datetimepicker-clock .mat-datetimepicker-clock .mat-datetimepicker-clock-hand:before .svg-icon.stroke{fill:unset;stroke:hsl(var(--pep-color-system-primary-invert-h, 255),var(--pep-color-system-primary-invert-s, 100%),var(--pep-color-system-primary-invert-l, 100%))}::ng-deep .mat-datetimepicker-content .mat-datetimepicker-calendar-content mat-datetimepicker-clock .mat-datetimepicker-clock .mat-datetimepicker-clock-hours .mat-datetimepicker-clock-cell,::ng-deep .mat-datetimepicker-content .mat-datetimepicker-calendar-content mat-datetimepicker-clock .mat-datetimepicker-clock .mat-datetimepicker-clock-minutes .mat-datetimepicker-clock-cell{color:hsl(var(--pep-color-system-primary-h, 0),var(--pep-color-system-primary-s, 0%),var(--pep-color-system-primary-l, 10%))}::ng-deep .mat-datetimepicker-content .mat-datetimepicker-calendar-content mat-datetimepicker-clock .mat-datetimepicker-clock .mat-datetimepicker-clock-hours .mat-datetimepicker-clock-cell:hover,::ng-deep .mat-datetimepicker-content .mat-datetimepicker-calendar-content mat-datetimepicker-clock .mat-datetimepicker-clock .mat-datetimepicker-clock-minutes .mat-datetimepicker-clock-cell:hover{background:hsla(var(--pep-color-weak-h, 0),var(--pep-color-weak-s, 0%),var(--pep-color-weak-l, 10%),.16)}::ng-deep .mat-datetimepicker-content .mat-datetimepicker-calendar-content mat-datetimepicker-clock .mat-datetimepicker-clock .mat-datetimepicker-clock-hours .mat-datetimepicker-clock-cell.mat-datetimepicker-clock-cell-selected,::ng-deep .mat-datetimepicker-content .mat-datetimepicker-calendar-content mat-datetimepicker-clock .mat-datetimepicker-clock .mat-datetimepicker-clock-minutes .mat-datetimepicker-clock-cell.mat-datetimepicker-clock-cell-selected{font-weight:var(--pep-font-weight-bold, 600);background:hsl(var(--pep-color-strong-h, 78),var(--pep-color-strong-s, 87%),var(--pep-color-strong-l, 27%));box-shadow:var(--pep-shadow-sm-offset, 0 .25rem .5rem 0) hsla(var(--pep-color-system-primary-h, 0),var(--pep-color-system-primary-s, 0%),var(--pep-color-system-primary-l, 10%),.08);color:hsl(var(--pep-color-system-primary-invert-h, 255),var(--pep-color-system-primary-invert-s, 100%),var(--pep-color-system-primary-invert-l, 100%))}::ng-deep .mat-datetimepicker-content .mat-datetimepicker-calendar-content mat-datetimepicker-clock .mat-datetimepicker-clock .mat-datetimepicker-clock-hours .mat-datetimepicker-clock-cell.mat-datetimepicker-clock-cell-selected .svg-icon,::ng-deep .mat-datetimepicker-content .mat-datetimepicker-calendar-content mat-datetimepicker-clock .mat-datetimepicker-clock .mat-datetimepicker-clock-minutes .mat-datetimepicker-clock-cell.mat-datetimepicker-clock-cell-selected .svg-icon{fill:hsl(var(--pep-color-system-primary-invert-h, 255),var(--pep-color-system-primary-invert-s, 100%),var(--pep-color-system-primary-invert-l, 100%))}::ng-deep .mat-datetimepicker-content .mat-datetimepicker-calendar-content mat-datetimepicker-clock .mat-datetimepicker-clock .mat-datetimepicker-clock-hours .mat-datetimepicker-clock-cell.mat-datetimepicker-clock-cell-selected .svg-icon.stroke,::ng-deep .mat-datetimepicker-content .mat-datetimepicker-calendar-content mat-datetimepicker-clock .mat-datetimepicker-clock .mat-datetimepicker-clock-minutes .mat-datetimepicker-clock-cell.mat-datetimepicker-clock-cell-selected .svg-icon.stroke{fill:unset;stroke:hsl(var(--pep-color-system-primary-invert-h, 255),var(--pep-color-system-primary-invert-s, 100%),var(--pep-color-system-primary-invert-l, 100%))}::ng-deep .mat-datetimepicker-content .mat-datetimepicker-calendar-content mat-datetimepicker-clock .mat-datetimepicker-clock .mat-datetimepicker-clock-hours .mat-datetimepicker-clock-cell.mat-datetimepicker-clock-cell-selected:hover,::ng-deep .mat-datetimepicker-content .mat-datetimepicker-calendar-content mat-datetimepicker-clock .mat-datetimepicker-clock .mat-datetimepicker-clock-minutes .mat-datetimepicker-clock-cell.mat-datetimepicker-clock-cell-selected:hover{background:hsl(var(--pep-color-strong-h, 78),var(--pep-color-strong-s, 87%),calc(var(--pep-color-strong-l, 27%) - 8%));box-shadow:var(--pep-shadow-sm-offset, 0 .25rem .5rem 0) hsla(var(--pep-color-system-primary-h, 0),var(--pep-color-system-primary-s, 0%),var(--pep-color-system-primary-l, 10%),.16)}::ng-deep .mat-datetimepicker-content .mat-datetimepicker-calendar-content mat-datetimepicker-clock .mat-datetimepicker-clock .mat-datetimepicker-clock-hours .mat-datetimepicker-clock-cell.mat-datetimepicker-clock-cell-selected:active,::ng-deep .mat-datetimepicker-content .mat-datetimepicker-calendar-content mat-datetimepicker-clock .mat-datetimepicker-clock .mat-datetimepicker-clock-minutes .mat-datetimepicker-clock-cell.mat-datetimepicker-clock-cell-selected:active{background:hsl(var(--pep-color-strong-h, 78),var(--pep-color-strong-s, 87%),calc(var(--pep-color-strong-l, 27%) - 15%));box-shadow:var(--pep-shadow-sm-offset, 0 .25rem .5rem 0) hsla(var(--pep-color-system-primary-h, 0),var(--pep-color-system-primary-s, 0%),var(--pep-color-system-primary-l, 10%),.08);box-shadow:0 0 0 var(--pep-spacing-xs, .25rem) hsla(var(--pep-color-text-link-h, 207),var(--pep-color-text-link-s, 76%),var(--pep-color-text-link-l, 37%),.5)}\n"] }]
-        }], ctorParameters: function () { return [{ type: i1.DateAdapter }, { type: i0.ElementRef }, { type: i2.PepLayoutService }, { type: i2.PepUtilitiesService }, { type: i2.PepCustomizationService }, { type: i0.Renderer2 }]; }, propDecorators: { key: [{
-                type: Input
-            }], value: [{
-                type: Input
-            }], label: [{
-                type: Input
-            }], type: [{
-                type: Input
-            }], mandatory: [{
-                type: Input
-            }], disabled: [{
-                type: Input
-            }], readonly: [{
-                type: Input
-            }], textColor: [{
-                type: Input
-            }], xAlignment: [{
-                type: Input
-            }], rowSpan: [{
-                type: Input
-            }], visible: [{
-                type: Input
-            }], minValue: [{
-                type: Input
-            }], maxValue: [{
-                type: Input
-            }], minDateValue: [{
-                type: Input
-            }], maxDateValue: [{
-                type: Input
-            }], form: [{
-                type: Input
-            }], isActive: [{
-                type: Input
-            }], showTitle: [{
-                type: Input
-            }], renderTitle: [{
-                type: Input
-            }], renderError: [{
-                type: Input
-            }], renderSymbol: [{
-                type: Input
-            }], layoutType: [{
-                type: Input
-            }], valueChange: [{
-                type: Output
-            }], datetimePicker: [{
-                type: ViewChild,
-                args: ['datetimePicker']
-            }], input: [{
-                type: ViewChild,
-                args: ['input']
+// Set the calture for the adapter.
+function getCalture(layoutService) {
+    const culture = layoutService.getCurrentLanguage();
+    return culture;
+}
+class PepDateComponent {
+    constructor(adapter, element, layoutService, utilitiesService, customizationService, renderer) {
+        this.adapter = adapter;
+        this.element = element;
+        this.layoutService = layoutService;
+        this.utilitiesService = utilitiesService;
+        this.customizationService = customizationService;
+        this.renderer = renderer;
+        this.key = '';
+        this._value = '';
+        this.formattedValue = '';
+        // private _formattedValue = '';
+        // @Input()
+        // set formattedValue(value: string) {
+        //     // if (!value) {
+        //     //     value = '';
+        //     // }
+        //     // if (this._calculateFormattedValue) {
+        //     //     this._calculateFormattedValue = false;
+        //     // }
+        //     // this.setFormattedValue(value);
+        // }
+        // get formattedValue(): string {
+        //     return this._formattedValue;
+        // }
+        this.label = '';
+        this._type = 'date';
+        this.mandatory = false;
+        this.disabled = false;
+        this.readonly = false;
+        this.textColor = '';
+        this.xAlignment = DEFAULT_HORIZONTAL_ALIGNMENT;
+        this.rowSpan = 1;
+        this._visible = true;
+        this.controlType = 'date';
+        this.form = null;
+        this.isActive = false;
+        this.showTitle = true;
+        this.renderTitle = true;
+        this.renderError = true;
+        this.renderSymbol = true;
+        this.layoutType = 'form';
+        this.valueChange = new EventEmitter();
+        this.standAlone = false;
+        this.isInEditMode = false;
+        this.showDatepicker = false;
+        this.showTime = false;
+    }
+    set value(value) {
+        this._value = value;
+        this.setDateModel();
+    }
+    get value() {
+        return this._value;
+    }
+    set type(type) {
+        this._type = type;
+        this.showTime = type === 'datetime';
+    }
+    get type() {
+        return this._type;
+    }
+    set visible(visible) {
+        this._visible = visible;
+        if (visible) {
+            this.renderer.removeClass(this.element.nativeElement, 'hidden-element');
+        }
+        else {
+            this.renderer.addClass(this.element.nativeElement, 'hidden-element');
+        }
+    }
+    get visible() {
+        return this._visible;
+    }
+    // Minimum in thicks
+    set minValue(value) {
+        if (value > 0) {
+            this.minDate = new Date(value * 1000 * 60 * 60 * 24);
+        }
+    }
+    // Maximum in thicks
+    set maxValue(value) {
+        if (value > 0) {
+            this.maxDate = new Date(value * 1000 * 60 * 60 * 24);
+        }
+    }
+    // Minimum in date
+    set minDateValue(date) {
+        this.minDate = date ? new Date(date) : null;
+    }
+    // Maximum in date
+    set maxDateValue(date) {
+        this.maxDate = date ? new Date(date) : null;
+    }
+    setDefaultForm() {
+        const pepField = new PepDateField({
+            key: this.key,
+            value: this.value,
+            mandatory: this.mandatory,
+            readonly: this.readonly,
+            disabled: this.disabled,
+        });
+        this.form = this.customizationService.getDefaultFromGroup(pepField);
+    }
+    ngOnInit() {
+        if (this.form === null) {
+            this.standAlone = true;
+            this.setDefaultForm();
+            this.renderer.addClass(this.element.nativeElement, PepCustomizationService.STAND_ALONE_FIELD_CLASS_NAME);
+            if (!this.renderTitle) {
+                this.renderer.addClass(this.element.nativeElement, PepCustomizationService.STAND_ALONE_FIELD_NO_SPACING_CLASS_NAME);
+            }
+        }
+        // This is not working for the dateModel so I use set calure in the useFactory: getCalture function.
+        // const culture = this.layoutService.getCurrentLanguage();
+        // this.adapter.setLocale(culture);
+        this.setDateModel();
+        this.updateFormFieldValue();
+    }
+    ngOnChanges(changes) {
+        if (this.standAlone) {
+            this.setDefaultForm();
+        }
+    }
+    ngOnDestroy() {
+        //
+    }
+    setFormattedValueFromModel() {
+        if (this.dateModel === null || !this.dateModel.isValid()) {
+            this.formattedValue = '';
+        }
+        else {
+            const formatString = this.showTime
+                ? MY_DATE_FORMATS.display.datetimeInput
+                : MY_DATE_FORMATS.display.dateInput;
+            this.formattedValue = this.adapter.format(this.dateModel, formatString);
+        }
+    }
+    setDateModel() {
+        if (!this.value ||
+            this.value === '' ||
+            this.value.indexOf('1900-1-1') >= 0 ||
+            this.value.indexOf('1900-01-01') >= 0 ||
+            this.value.indexOf('1970-1-1') >= 0 ||
+            this.value.indexOf('1970-01-01') >= 0) {
+            this._value = '';
+            this.dateModel = null;
+        }
+        else {
+            const parseDate = this.utilitiesService.parseDate(this.value, this.showTime);
+            this.dateModel = utc(parseDate);
+        }
+        this.setFormattedValueFromModel();
+    }
+    openDatetimePicker(datetimePicker) {
+        datetimePicker.opened = false;
+        datetimePicker.open();
+    }
+    onBlur(event) {
+        // Don't remove the timeout cause a bug DI-17819.
+        setTimeout(() => {
+            if (this.isInEditMode && !this.datetimePicker.opened) {
+                this.isInEditMode = false;
+            }
+        }, 0);
+    }
+    updateFormFieldValue() {
+        this.customizationService.updateFormFieldValue(this.form, this.key, 
+        // this.formattedValue
+        this.value);
+    }
+    onDateChange(event) {
+        let value = '';
+        if (event.value != null) {
+            const date = event.value.toDate();
+            value = this.utilitiesService.stringifyDate(date, this.showTime);
+            // Update the formatted value.
+            this.setFormattedValueFromModel();
+        }
+        this._value = value;
+        this.updateFormFieldValue();
+        this.valueChange.emit(value);
+        setTimeout(() => {
+            if (this.isInEditMode) {
+                this.isInEditMode = false;
+            }
+        }, 0);
+    }
+    cardTemplateClicked(event) {
+        this.isInEditMode = true;
+        setTimeout(() => {
+            this.input.nativeElement.focus();
+            this.openDatetimePicker(this.datetimePicker);
+        }, 0);
+    }
+}
+PepDateComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.0.2", ngImport: i0, type: PepDateComponent, deps: [{ token: i1.DateAdapter }, { token: i0.ElementRef }, { token: i2.PepLayoutService }, { token: i2.PepUtilitiesService }, { token: i2.PepCustomizationService }, { token: i0.Renderer2 }], target: i0.ɵɵFactoryTarget.Component });
+PepDateComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.0.2", type: PepDateComponent, selector: "pep-date", inputs: { key: "key", value: "value", label: "label", type: "type", mandatory: "mandatory", disabled: "disabled", readonly: "readonly", textColor: "textColor", xAlignment: "xAlignment", rowSpan: "rowSpan", visible: "visible", minValue: "minValue", maxValue: "maxValue", minDateValue: "minDateValue", maxDateValue: "maxDateValue", form: "form", isActive: "isActive", showTitle: "showTitle", renderTitle: "renderTitle", renderError: "renderError", renderSymbol: "renderSymbol", layoutType: "layoutType" }, outputs: { valueChange: "valueChange" }, providers: [
+        // CUSTOM_INPUT_CONTROL_VALUE_ACCESSOR,
+        // The locale would typically be provided on the root module of your application. We do it at
+        // the component level here, due to limitations of our example generation script.
+        // { provide: MAT_DATE_LOCALE, useValue: 'he' },
+        { provide: MAT_DATE_LOCALE, useFactory: getCalture, deps: [PepLayoutService] },
+        // `MomentDateAdapter` and `MAT_MOMENT_DATE_FORMATS` can be automatically provided by importing
+        // `MatMomentDateModule` in your applications root module. We provide it at the component level
+        // here, due to limitations of our example generation script.
+        //{ provide: DateAdapter, useClass: MomentDateAdapter, deps: [MAT_DATE_LOCALE] },
+        //{ provide: MAT_DATE_FORMATS, useValue: MAT_MOMENT_DATE_FORMATS },
+        { provide: DateAdapter, useClass: MomentUtcDateAdapter },
+        { provide: MAT_DATE_FORMATS, useValue: MY_DATE_FORMATS },
+        { provide: DatetimeAdapter, useClass: MomentUtcDateTimeAdapter },
+        //{ provide: MAT_DATETIME_FORMATS, useValue: MAT_NATIVE_DATETIME_FORMATS }
+        { provide: MAT_DATETIME_FORMATS, useValue: MY_DATE_FORMATS },
+    ], viewQueries: [{ propertyName: "datetimePicker", first: true, predicate: ["datetimePicker"], descendants: true }, { propertyName: "input", first: true, predicate: ["input"], descendants: true }], usesOnChanges: true, ngImport: i0, template: "<ng-container [formGroup]=\"form\">\n    <ng-template #pepTemplate let-showIcon=\"showIcon\">\n        <mat-form-field appearance=\"outline\">\n            <input #input [id]=\"key\" title=\"{{ formattedValue }}\" matInput class=\"body-sm\" autocomplete=\"false\"\n                [ngStyle]=\"{ color: textColor, 'text-align': xAlignment == 'center' ? 'center' : xAlignment == 'right' ? 'right' : 'left'}\"\n                [(ngModel)]=\"dateModel\" [ngModelOptions]=\"{standalone: true}\" [matDatetimepicker]=\"datetimePicker\"\n                [min]=\"minDate\" [max]=\"maxDate\" [required]=\"mandatory\" [disabled]=\"disabled\"\n                (dateChange)=\"onDateChange($event)\" (click)=\"openDatetimePicker(datetimePicker)\"\n                (blur)=\"onBlur($event)\" />\n            <mat-error *ngIf=\"renderError\"><span class=\"body-xs\"\n                    [title]=\"mandatory && formattedValue?.length == 0 ? ('MESSAGES.ERROR_IS_REQUIRED' | translate: {field: label}) : ('MESSAGES.ERROR_IS_NOT_VALID' | translate: {field: label})\"\n                    [innerText]=\"mandatory && formattedValue?.length == 0 ? ('MESSAGES.ERROR_IS_REQUIRED' | translate: {field: label}) : ('MESSAGES.ERROR_IS_NOT_VALID' | translate: {field: label})\"></span>\n            </mat-error>\n            <pep-textbox-icon *ngIf=\"renderSymbol && showIcon && xAlignment == 'right'\" matPrefix [value]=\"value\"\n                [label]=\"label\" [type]=\"type\" [disabled]=\"disabled\" (iconClick)=\"openDatetimePicker(datetimePicker)\">\n            </pep-textbox-icon>\n            <pep-textbox-icon *ngIf=\"renderSymbol && showIcon && xAlignment == 'left'\" matSuffix [value]=\"value\"\n                [label]=\"label\" [type]=\"type\" [disabled]=\"disabled\" (iconClick)=\"openDatetimePicker(datetimePicker)\">\n            </pep-textbox-icon>\n            <mat-datetimepicker #datetimePicker [type]=\"showTime ? 'datetime' : 'date'\" [openOnFocus]=\"false\"\n                [touchUi]=\"true\" [timeInterval]=\"1\"></mat-datetimepicker>\n        </mat-form-field>\n    </ng-template>\n\n    <ng-container *ngIf=\"layoutType === 'form'\">\n        <pep-field-title *ngIf=\"renderTitle\" [label]=\"label\" [mandatory]=\"mandatory\" [disabled]=\"disabled\"\n            [xAlignment]=\"xAlignment\" [showTitle]=\"showTitle\">\n        </pep-field-title>\n        <ng-container *ngTemplateOutlet=\"pepTemplate; context: {showIcon: true}\"></ng-container>\n    </ng-container>\n\n    <ng-container *ngIf=\"layoutType === 'card'\">\n        <ng-container *ngIf=\"isInEditMode; then editBlock; else readOnlyBlock\"></ng-container>\n        <ng-template #editBlock>\n            <div [ngClass]=\"{'one-row': rowSpan === 1}\">\n                <ng-container *ngTemplateOutlet=\"pepTemplate; context: {showIcon: false}\"></ng-container>\n            </div>\n        </ng-template>\n        <ng-template #readOnlyBlock>\n            <div class=\"pep-card-input card-flex-container\"\n                [ngClass]=\"{'one-row': rowSpan === 1, 'pep-button weak': isActive && !disabled }\"\n                [ngStyle]=\"{ color: textColor }\" [class]=\"'text-align-' + xAlignment\"\n                (click)=\"!disabled ? cardTemplateClicked($event) : ''\">\n                <span *ngIf=\"showTitle && label != ''\" class=\"body-xs title\" title=\"{{ label }}\">{{ label\n                    }}&nbsp;</span>\n                <span [id]=\"key\" title=\"{{ formattedValue }}\" class=\"body-sm value\">{{ formattedValue }}</span>\n                <button *ngIf=\"isActive && !disabled\" class=\"pep-button weak card-edit-button\" mat-button>\n                    <mat-icon>\n                        <pep-icon name=\"system_edit\">\n                        </pep-icon>\n                    </mat-icon>\n                </button>\n            </div>\n        </ng-template>\n    </ng-container>\n\n    <ng-container *ngIf=\"layoutType === 'table'\">\n        <ng-container *ngIf=\"isActive && !disabled; then selectedBlock; else notSelectedBlock\"></ng-container>\n        <ng-template #selectedBlock>\n            <ng-container *ngTemplateOutlet=\"pepTemplate; context: {showIcon: true}\"></ng-container>\n        </ng-template>\n        <ng-template #notSelectedBlock>\n            <ng-container *ngIf=\"formattedValue?.length > 0; then notEmptyBlock; else emptyBlock\"></ng-container>\n            <ng-template #notEmptyBlock>\n                <ng-container [ngSwitch]=\"type\">\n                    <ng-container *ngSwitchDefault>\n                        <span [id]=\"key\" class=\"body-sm pep-report-input\" [ngStyle]=\"{ color: textColor }\"\n                            [ngClass]=\"{readonly: disabled}\" title=\"{{ formattedValue }}\">{{ formattedValue }}</span>\n                    </ng-container>\n                </ng-container>\n            </ng-template>\n            <ng-template #emptyBlock>\n                <span [id]=\"key\">&nbsp;</span>\n            </ng-template>\n        </ng-template>\n    </ng-container>\n</ng-container>", styles: [":host{height:inherit;display:grid}:host>*{align-self:center}::ng-deep .mat-form-field .mat-form-field-wrapper .mat-form-field-prefix .mat-datetimepicker-toggle.mat-button,::ng-deep .mat-form-field .mat-form-field-wrapper .mat-form-field-suffix .mat-datetimepicker-toggle.mat-button{padding:0}\n", "::ng-deep .mat-datetimepicker-dialog{max-width:90vw!important}::ng-deep .mat-datetimepicker-content{border-radius:inherit}::ng-deep .mat-datetimepicker-content .mat-datetimepicker-calendar-header{font-weight:var(--pep-font-weight-bold, 600);background:hsl(var(--pep-color-strong-h, 78),var(--pep-color-strong-s, 87%),var(--pep-color-strong-l, 27%));box-shadow:var(--pep-shadow-sm-offset, 0 .25rem .5rem 0) hsla(var(--pep-color-system-primary-h, 0),var(--pep-color-system-primary-s, 0%),var(--pep-color-system-primary-l, 10%),.08);color:hsl(var(--pep-color-system-primary-invert-h, 255),var(--pep-color-system-primary-invert-s, 100%),var(--pep-color-system-primary-invert-l, 100%))}::ng-deep .mat-datetimepicker-content .mat-datetimepicker-calendar-header .svg-icon{fill:hsl(var(--pep-color-system-primary-invert-h, 255),var(--pep-color-system-primary-invert-s, 100%),var(--pep-color-system-primary-invert-l, 100%))}::ng-deep .mat-datetimepicker-content .mat-datetimepicker-calendar-header .svg-icon.stroke{fill:unset;stroke:hsl(var(--pep-color-system-primary-invert-h, 255),var(--pep-color-system-primary-invert-s, 100%),var(--pep-color-system-primary-invert-l, 100%))}::ng-deep .mat-datetimepicker-content .mat-datetimepicker-calendar-content .mat-month-content .mat-datetimepicker-calendar-controls{color:hsl(var(--pep-color-system-primary-h, 0),var(--pep-color-system-primary-s, 0%),var(--pep-color-system-primary-l, 10%))}::ng-deep .mat-datetimepicker-content .mat-datetimepicker-calendar-content .mat-month-content .mat-datetimepicker-calendar-controls .mat-datetimepicker-calendar-previous-button{content:url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0iVVRGLTgiIHN0YW5kYWxvbmU9Im5vIj8+CjxzdmcKICAgeG1sbnM6ZGM9Imh0dHA6Ly9wdXJsLm9yZy9kYy9lbGVtZW50cy8xLjEvIgogICB4bWxuczpjYz0iaHR0cDovL2NyZWF0aXZlY29tbW9ucy5vcmcvbnMjIgogICB4bWxuczpyZGY9Imh0dHA6Ly93d3cudzMub3JnLzE5OTkvMDIvMjItcmRmLXN5bnRheC1ucyMiCiAgIHhtbG5zOnN2Zz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciCiAgIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIKICAgaWQ9InN2ZzQiCiAgIHZlcnNpb249IjEuMSIKICAgdmlld0JveD0iMCAwIDI0IDI0IgogICBoZWlnaHQ9IjE2IgogICB3aWR0aD0iMTYiPgogIDxtZXRhZGF0YQogICAgIGlkPSJtZXRhZGF0YTEwIj4KICAgIDxyZGY6UkRGPgogICAgICA8Y2M6V29yawogICAgICAgICByZGY6YWJvdXQ9IiI+CiAgICAgICAgPGRjOmZvcm1hdD5pbWFnZS9zdmcreG1sPC9kYzpmb3JtYXQ+CiAgICAgICAgPGRjOnR5cGUKICAgICAgICAgICByZGY6cmVzb3VyY2U9Imh0dHA6Ly9wdXJsLm9yZy9kYy9kY21pdHlwZS9TdGlsbEltYWdlIiAvPgogICAgICA8L2NjOldvcms+CiAgICA8L3JkZjpSREY+CiAgPC9tZXRhZGF0YT4KICA8ZGVmcwogICAgIGlkPSJkZWZzOCIgLz4KICA8cGF0aAogICAgIGlkPSJwYXRoMiIKICAgICBkPSJNNS44MDAzMjE0OCw5LjI4Njc0MzU0IEwxMS4yNTQyODI0LDEzLjIwMjc1ODMgQzExLjY2NjEzMDksMTMuNTg1MDgzIDEyLjMzMzg2OTEsMTMuNTg1MDgzIDEyLjc0NTcxNzYsMTMuMjAyNzU4MyBMMTguMTk5Njc4NSw5LjI4Njc0MzU0IEMxOC42MTE1MjcsOC45MDQ0MTg4MiAxOS4yNzkyNjUyLDguOTA0NDE4ODIgMTkuNjkxMTEzNyw5LjI4Njc0MzU0IEMyMC4xMDI5NjIxLDkuNjY5MDY4MjYgMjAuMTAyOTYyMSwxMC4yODg5MzkxIDE5LjY5MTExMzcsMTAuNjcxMjYzOCBMMTMuNDkxNDM1MSwxNi40MjY1MTI5IEMxMi42Njc3MzgzLDE3LjE5MTE2MjQgMTEuMzMyMjYxNywxNy4xOTExNjI0IDEwLjUwODU2NDksMTYuNDI2NTEyOSBMNC4zMDg4ODYzMywxMC42NzEyNjM4IEMzLjg5NzAzNzg5LDEwLjI4ODkzOTEgMy44OTcwMzc4OSw5LjY2OTA2ODI2IDQuMzA4ODg2MzMsOS4yODY3NDM1NCBDNC43MjA3MzQ3OCw4LjkwNDQxODgyIDUuMzg4NDczMDMsOC45MDQ0MTg4MiA1LjgwMDMyMTQ4LDkuMjg2NzQzNTQgWiIKICAgICBmaWxsLXJ1bGU9ImV2ZW5vZGQiCiAgICAgZmlsbC1vcGFjaXR5PSIuNSIgLz4KPC9zdmc+Cg==);transform:rotate(90deg)}::ng-deep .mat-datetimepicker-content .mat-datetimepicker-calendar-content .mat-month-content .mat-datetimepicker-calendar-controls .mat-datetimepicker-calendar-previous-button svg{fill:hsla(var(--pep-color-system-primary-h, 0),var(--pep-color-system-primary-s, 0%),var(--pep-color-system-primary-l, 10%),.8)}::ng-deep .mat-datetimepicker-content .mat-datetimepicker-calendar-content .mat-month-content .mat-datetimepicker-calendar-controls .mat-datetimepicker-calendar-previous-button svg.stroke{fill:unset;stroke:hsla(var(--pep-color-system-primary-h, 0),var(--pep-color-system-primary-s, 0%),var(--pep-color-system-primary-l, 10%),.8)}::ng-deep .mat-datetimepicker-content .mat-datetimepicker-calendar-content .mat-month-content .mat-datetimepicker-calendar-controls .mat-datetimepicker-calendar-previous-button svg:hover{fill:hsla(var(--pep-color-system-primary-h, 0),var(--pep-color-system-primary-s, 0%),var(--pep-color-system-primary-l, 10%),.97)}::ng-deep .mat-datetimepicker-content .mat-datetimepicker-calendar-content .mat-month-content .mat-datetimepicker-calendar-controls .mat-datetimepicker-calendar-previous-button svg:hover.stroke{fill:unset;stroke:hsla(var(--pep-color-system-primary-h, 0),var(--pep-color-system-primary-s, 0%),var(--pep-color-system-primary-l, 10%),.97)}::ng-deep .mat-datetimepicker-content .mat-datetimepicker-calendar-content .mat-month-content .mat-datetimepicker-calendar-controls .mat-datetimepicker-calendar-previous-button svg:active{fill:hsl(var(--pep-color-system-primary-h, 0),var(--pep-color-system-primary-s, 0%),var(--pep-color-system-primary-l, 10%))}::ng-deep .mat-datetimepicker-content .mat-datetimepicker-calendar-content .mat-month-content .mat-datetimepicker-calendar-controls .mat-datetimepicker-calendar-previous-button svg:active.stroke{fill:unset;stroke:hsl(var(--pep-color-system-primary-h, 0),var(--pep-color-system-primary-s, 0%),var(--pep-color-system-primary-l, 10%))}::ng-deep .mat-datetimepicker-content .mat-datetimepicker-calendar-content .mat-month-content .mat-datetimepicker-calendar-controls .mat-datetimepicker-calendar-previous-button svg:disabled{fill:hsla(var(--pep-color-system-primary-h, 0),var(--pep-color-system-primary-s, 0%),var(--pep-color-system-primary-l, 10%),.35)}::ng-deep .mat-datetimepicker-content .mat-datetimepicker-calendar-content .mat-month-content .mat-datetimepicker-calendar-controls .mat-datetimepicker-calendar-previous-button svg:disabled.stroke{fill:unset;stroke:hsla(var(--pep-color-system-primary-h, 0),var(--pep-color-system-primary-s, 0%),var(--pep-color-system-primary-l, 10%),.35)}::ng-deep .mat-datetimepicker-content .mat-datetimepicker-calendar-content .mat-month-content .mat-datetimepicker-calendar-controls .mat-datetimepicker-calendar-next-button{content:url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0iVVRGLTgiIHN0YW5kYWxvbmU9Im5vIj8+CjxzdmcKICAgeG1sbnM6ZGM9Imh0dHA6Ly9wdXJsLm9yZy9kYy9lbGVtZW50cy8xLjEvIgogICB4bWxuczpjYz0iaHR0cDovL2NyZWF0aXZlY29tbW9ucy5vcmcvbnMjIgogICB4bWxuczpyZGY9Imh0dHA6Ly93d3cudzMub3JnLzE5OTkvMDIvMjItcmRmLXN5bnRheC1ucyMiCiAgIHhtbG5zOnN2Zz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciCiAgIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIKICAgaWQ9InN2ZzQiCiAgIHZlcnNpb249IjEuMSIKICAgdmlld0JveD0iMCAwIDI0IDI0IgogICBoZWlnaHQ9IjE2IgogICB3aWR0aD0iMTYiPgogIDxtZXRhZGF0YQogICAgIGlkPSJtZXRhZGF0YTEwIj4KICAgIDxyZGY6UkRGPgogICAgICA8Y2M6V29yawogICAgICAgICByZGY6YWJvdXQ9IiI+CiAgICAgICAgPGRjOmZvcm1hdD5pbWFnZS9zdmcreG1sPC9kYzpmb3JtYXQ+CiAgICAgICAgPGRjOnR5cGUKICAgICAgICAgICByZGY6cmVzb3VyY2U9Imh0dHA6Ly9wdXJsLm9yZy9kYy9kY21pdHlwZS9TdGlsbEltYWdlIiAvPgogICAgICA8L2NjOldvcms+CiAgICA8L3JkZjpSREY+CiAgPC9tZXRhZGF0YT4KICA8ZGVmcwogICAgIGlkPSJkZWZzOCIgLz4KICA8cGF0aAogICAgIGlkPSJwYXRoMiIKICAgICBkPSJNNS44MDAzMjE0OCw5LjI4Njc0MzU0IEwxMS4yNTQyODI0LDEzLjIwMjc1ODMgQzExLjY2NjEzMDksMTMuNTg1MDgzIDEyLjMzMzg2OTEsMTMuNTg1MDgzIDEyLjc0NTcxNzYsMTMuMjAyNzU4MyBMMTguMTk5Njc4NSw5LjI4Njc0MzU0IEMxOC42MTE1MjcsOC45MDQ0MTg4MiAxOS4yNzkyNjUyLDguOTA0NDE4ODIgMTkuNjkxMTEzNyw5LjI4Njc0MzU0IEMyMC4xMDI5NjIxLDkuNjY5MDY4MjYgMjAuMTAyOTYyMSwxMC4yODg5MzkxIDE5LjY5MTExMzcsMTAuNjcxMjYzOCBMMTMuNDkxNDM1MSwxNi40MjY1MTI5IEMxMi42Njc3MzgzLDE3LjE5MTE2MjQgMTEuMzMyMjYxNywxNy4xOTExNjI0IDEwLjUwODU2NDksMTYuNDI2NTEyOSBMNC4zMDg4ODYzMywxMC42NzEyNjM4IEMzLjg5NzAzNzg5LDEwLjI4ODkzOTEgMy44OTcwMzc4OSw5LjY2OTA2ODI2IDQuMzA4ODg2MzMsOS4yODY3NDM1NCBDNC43MjA3MzQ3OCw4LjkwNDQxODgyIDUuMzg4NDczMDMsOC45MDQ0MTg4MiA1LjgwMDMyMTQ4LDkuMjg2NzQzNTQgWiIKICAgICBmaWxsLXJ1bGU9ImV2ZW5vZGQiCiAgICAgZmlsbC1vcGFjaXR5PSIuNSIgLz4KPC9zdmc+Cg==);transform:rotate(-90deg)}::ng-deep .mat-datetimepicker-content .mat-datetimepicker-calendar-content .mat-month-content .mat-datetimepicker-calendar-controls .mat-datetimepicker-calendar-next-button svg{fill:hsla(var(--pep-color-system-primary-h, 0),var(--pep-color-system-primary-s, 0%),var(--pep-color-system-primary-l, 10%),.8)}::ng-deep .mat-datetimepicker-content .mat-datetimepicker-calendar-content .mat-month-content .mat-datetimepicker-calendar-controls .mat-datetimepicker-calendar-next-button svg.stroke{fill:unset;stroke:hsla(var(--pep-color-system-primary-h, 0),var(--pep-color-system-primary-s, 0%),var(--pep-color-system-primary-l, 10%),.8)}::ng-deep .mat-datetimepicker-content .mat-datetimepicker-calendar-content .mat-month-content .mat-datetimepicker-calendar-controls .mat-datetimepicker-calendar-next-button svg:hover{fill:hsla(var(--pep-color-system-primary-h, 0),var(--pep-color-system-primary-s, 0%),var(--pep-color-system-primary-l, 10%),.97)}::ng-deep .mat-datetimepicker-content .mat-datetimepicker-calendar-content .mat-month-content .mat-datetimepicker-calendar-controls .mat-datetimepicker-calendar-next-button svg:hover.stroke{fill:unset;stroke:hsla(var(--pep-color-system-primary-h, 0),var(--pep-color-system-primary-s, 0%),var(--pep-color-system-primary-l, 10%),.97)}::ng-deep .mat-datetimepicker-content .mat-datetimepicker-calendar-content .mat-month-content .mat-datetimepicker-calendar-controls .mat-datetimepicker-calendar-next-button svg:active{fill:hsl(var(--pep-color-system-primary-h, 0),var(--pep-color-system-primary-s, 0%),var(--pep-color-system-primary-l, 10%))}::ng-deep .mat-datetimepicker-content .mat-datetimepicker-calendar-content .mat-month-content .mat-datetimepicker-calendar-controls .mat-datetimepicker-calendar-next-button svg:active.stroke{fill:unset;stroke:hsl(var(--pep-color-system-primary-h, 0),var(--pep-color-system-primary-s, 0%),var(--pep-color-system-primary-l, 10%))}::ng-deep .mat-datetimepicker-content .mat-datetimepicker-calendar-content .mat-month-content .mat-datetimepicker-calendar-controls .mat-datetimepicker-calendar-next-button svg:disabled{fill:hsla(var(--pep-color-system-primary-h, 0),var(--pep-color-system-primary-s, 0%),var(--pep-color-system-primary-l, 10%),.35)}::ng-deep .mat-datetimepicker-content .mat-datetimepicker-calendar-content .mat-month-content .mat-datetimepicker-calendar-controls .mat-datetimepicker-calendar-next-button svg:disabled.stroke{fill:unset;stroke:hsla(var(--pep-color-system-primary-h, 0),var(--pep-color-system-primary-s, 0%),var(--pep-color-system-primary-l, 10%),.35)}::ng-deep .mat-datetimepicker-content .mat-datetimepicker-calendar-content mat-datetimepicker-year-view .mat-datetimepicker-calendar-table .mat-datetimepicker-calendar-table-header,::ng-deep .mat-datetimepicker-content .mat-datetimepicker-calendar-content mat-datetimepicker-month-view .mat-datetimepicker-calendar-table .mat-datetimepicker-calendar-table-header{color:hsla(var(--pep-color-system-primary-h, 0),var(--pep-color-system-primary-s, 0%),var(--pep-color-system-primary-l, 10%),.7)}::ng-deep .mat-datetimepicker-content .mat-datetimepicker-calendar-content mat-datetimepicker-year-view .mat-datetimepicker-calendar-table .mat-datetimepicker-calendar-body,::ng-deep .mat-datetimepicker-content .mat-datetimepicker-calendar-content mat-datetimepicker-month-view .mat-datetimepicker-calendar-table .mat-datetimepicker-calendar-body{color:hsl(var(--pep-color-system-primary-h, 0),var(--pep-color-system-primary-s, 0%),var(--pep-color-system-primary-l, 10%))}::ng-deep .mat-datetimepicker-content .mat-datetimepicker-calendar-content mat-datetimepicker-year-view .mat-datetimepicker-calendar-table .mat-datetimepicker-calendar-body .mat-datetimepicker-calendar-body-label,::ng-deep .mat-datetimepicker-content .mat-datetimepicker-calendar-content mat-datetimepicker-month-view .mat-datetimepicker-calendar-table .mat-datetimepicker-calendar-body .mat-datetimepicker-calendar-body-label{color:hsla(var(--pep-color-system-primary-h, 0),var(--pep-color-system-primary-s, 0%),var(--pep-color-system-primary-l, 10%),.7)}::ng-deep .mat-datetimepicker-content .mat-datetimepicker-calendar-content mat-datetimepicker-year-view .mat-datetimepicker-calendar-table .mat-datetimepicker-calendar-body .mat-datetimepicker-calendar-body-cell:hover .mat-datetimepicker-calendar-body-cell-content,::ng-deep .mat-datetimepicker-content .mat-datetimepicker-calendar-content mat-datetimepicker-month-view .mat-datetimepicker-calendar-table .mat-datetimepicker-calendar-body .mat-datetimepicker-calendar-body-cell:hover .mat-datetimepicker-calendar-body-cell-content{background:hsla(var(--pep-color-weak-h, 0),var(--pep-color-weak-s, 0%),var(--pep-color-weak-l, 10%),.16)}::ng-deep .mat-datetimepicker-content .mat-datetimepicker-calendar-content mat-datetimepicker-year-view .mat-datetimepicker-calendar-table .mat-datetimepicker-calendar-body .mat-datetimepicker-calendar-body-cell:active .mat-datetimepicker-calendar-body-cell-content,::ng-deep .mat-datetimepicker-content .mat-datetimepicker-calendar-content mat-datetimepicker-month-view .mat-datetimepicker-calendar-table .mat-datetimepicker-calendar-body .mat-datetimepicker-calendar-body-cell:active .mat-datetimepicker-calendar-body-cell-content{box-shadow:var(--pep-shadow-xs-offset, 0 .125rem .25rem 0) hsla(var(--pep-color-system-primary-h, 0),var(--pep-color-system-primary-s, 0%),var(--pep-color-system-primary-l, 10%),.08);border:1px solid hsl(var(--pep-color-weak-h, 0),var(--pep-color-weak-s, 0%),var(--pep-color-weak-l, 10%))}::ng-deep .mat-datetimepicker-content .mat-datetimepicker-calendar-content mat-datetimepicker-year-view .mat-datetimepicker-calendar-table .mat-datetimepicker-calendar-body .mat-datetimepicker-calendar-body-cell:active .mat-datetimepicker-calendar-body-cell-content:not(.keep-background-on-focus),::ng-deep .mat-datetimepicker-content .mat-datetimepicker-calendar-content mat-datetimepicker-month-view .mat-datetimepicker-calendar-table .mat-datetimepicker-calendar-body .mat-datetimepicker-calendar-body-cell:active .mat-datetimepicker-calendar-body-cell-content:not(.keep-background-on-focus){background:hsl(var(--pep-color-system-primary-invert-h, 255),var(--pep-color-system-primary-invert-s, 100%),var(--pep-color-system-primary-invert-l, 100%))}::ng-deep .mat-datetimepicker-content .mat-datetimepicker-calendar-content mat-datetimepicker-year-view .mat-datetimepicker-calendar-table .mat-datetimepicker-calendar-body .mat-datetimepicker-calendar-body-cell .mat-datetimepicker-calendar-body-cell-content.mat-datetimepicker-calendar-body-today,::ng-deep .mat-datetimepicker-content .mat-datetimepicker-calendar-content mat-datetimepicker-month-view .mat-datetimepicker-calendar-table .mat-datetimepicker-calendar-body .mat-datetimepicker-calendar-body-cell .mat-datetimepicker-calendar-body-cell-content.mat-datetimepicker-calendar-body-today{background:hsl(var(--pep-color-regular-h, 0),var(--pep-color-regular-s, 0%),98%);box-shadow:var(--pep-shadow-xs-offset, 0 .125rem .25rem 0) hsla(var(--pep-color-system-primary-h, 0),var(--pep-color-system-primary-s, 0%),var(--pep-color-system-primary-l, 10%),.08);border:1px solid hsl(var(--pep-color-regular-h, 0),var(--pep-color-regular-s, 0%),calc(var(--pep-color-regular-l, 10%) + 30%))}::ng-deep .mat-datetimepicker-content .mat-datetimepicker-calendar-content mat-datetimepicker-year-view .mat-datetimepicker-calendar-table .mat-datetimepicker-calendar-body .mat-datetimepicker-calendar-body-cell .mat-datetimepicker-calendar-body-cell-content.mat-datetimepicker-calendar-body-today:hover,::ng-deep .mat-datetimepicker-content .mat-datetimepicker-calendar-content mat-datetimepicker-month-view .mat-datetimepicker-calendar-table .mat-datetimepicker-calendar-body .mat-datetimepicker-calendar-body-cell .mat-datetimepicker-calendar-body-cell-content.mat-datetimepicker-calendar-body-today:hover{background:hsl(var(--pep-color-regular-h, 0),var(--pep-color-regular-s, 0%),98%);box-shadow:var(--pep-shadow-xs-offset, 0 .125rem .25rem 0) hsla(var(--pep-color-system-primary-h, 0),var(--pep-color-system-primary-s, 0%),var(--pep-color-system-primary-l, 10%),.16);border:1px solid hsl(var(--pep-color-regular-h, 0),var(--pep-color-regular-s, 0%),calc(var(--pep-color-regular-l, 10%) + 20%))}::ng-deep .mat-datetimepicker-content .mat-datetimepicker-calendar-content mat-datetimepicker-year-view .mat-datetimepicker-calendar-table .mat-datetimepicker-calendar-body .mat-datetimepicker-calendar-body-cell .mat-datetimepicker-calendar-body-cell-content.mat-datetimepicker-calendar-body-today:active,::ng-deep .mat-datetimepicker-content .mat-datetimepicker-calendar-content mat-datetimepicker-month-view .mat-datetimepicker-calendar-table .mat-datetimepicker-calendar-body .mat-datetimepicker-calendar-body-cell .mat-datetimepicker-calendar-body-cell-content.mat-datetimepicker-calendar-body-today:active{background:hsl(var(--pep-color-regular-h, 0),var(--pep-color-regular-s, 0%),88%);box-shadow:var(--pep-shadow-xs-offset, 0 .125rem .25rem 0) hsla(var(--pep-color-system-primary-h, 0),var(--pep-color-system-primary-s, 0%),var(--pep-color-system-primary-l, 10%),.16);border:1px solid hsl(var(--pep-color-regular-h, 0),var(--pep-color-regular-s, 0%),var(--pep-color-regular-l, 10%));box-shadow:0 0 0 var(--pep-spacing-xs, .25rem) hsla(var(--pep-color-text-link-h, 207),var(--pep-color-text-link-s, 76%),var(--pep-color-text-link-l, 37%),.5)}::ng-deep .mat-datetimepicker-content .mat-datetimepicker-calendar-content mat-datetimepicker-year-view .mat-datetimepicker-calendar-table .mat-datetimepicker-calendar-body .mat-datetimepicker-calendar-body-cell .mat-datetimepicker-calendar-body-cell-content.mat-datetimepicker-calendar-body-selected,::ng-deep .mat-datetimepicker-content .mat-datetimepicker-calendar-content mat-datetimepicker-month-view .mat-datetimepicker-calendar-table .mat-datetimepicker-calendar-body .mat-datetimepicker-calendar-body-cell .mat-datetimepicker-calendar-body-cell-content.mat-datetimepicker-calendar-body-selected{font-weight:var(--pep-font-weight-bold, 600);background:hsl(var(--pep-color-strong-h, 78),var(--pep-color-strong-s, 87%),var(--pep-color-strong-l, 27%));box-shadow:var(--pep-shadow-sm-offset, 0 .25rem .5rem 0) hsla(var(--pep-color-system-primary-h, 0),var(--pep-color-system-primary-s, 0%),var(--pep-color-system-primary-l, 10%),.08);color:hsl(var(--pep-color-system-primary-invert-h, 255),var(--pep-color-system-primary-invert-s, 100%),var(--pep-color-system-primary-invert-l, 100%))}::ng-deep .mat-datetimepicker-content .mat-datetimepicker-calendar-content mat-datetimepicker-year-view .mat-datetimepicker-calendar-table .mat-datetimepicker-calendar-body .mat-datetimepicker-calendar-body-cell .mat-datetimepicker-calendar-body-cell-content.mat-datetimepicker-calendar-body-selected .svg-icon,::ng-deep .mat-datetimepicker-content .mat-datetimepicker-calendar-content mat-datetimepicker-month-view .mat-datetimepicker-calendar-table .mat-datetimepicker-calendar-body .mat-datetimepicker-calendar-body-cell .mat-datetimepicker-calendar-body-cell-content.mat-datetimepicker-calendar-body-selected .svg-icon{fill:hsl(var(--pep-color-system-primary-invert-h, 255),var(--pep-color-system-primary-invert-s, 100%),var(--pep-color-system-primary-invert-l, 100%))}::ng-deep .mat-datetimepicker-content .mat-datetimepicker-calendar-content mat-datetimepicker-year-view .mat-datetimepicker-calendar-table .mat-datetimepicker-calendar-body .mat-datetimepicker-calendar-body-cell .mat-datetimepicker-calendar-body-cell-content.mat-datetimepicker-calendar-body-selected .svg-icon.stroke,::ng-deep .mat-datetimepicker-content .mat-datetimepicker-calendar-content mat-datetimepicker-month-view .mat-datetimepicker-calendar-table .mat-datetimepicker-calendar-body .mat-datetimepicker-calendar-body-cell .mat-datetimepicker-calendar-body-cell-content.mat-datetimepicker-calendar-body-selected .svg-icon.stroke{fill:unset;stroke:hsl(var(--pep-color-system-primary-invert-h, 255),var(--pep-color-system-primary-invert-s, 100%),var(--pep-color-system-primary-invert-l, 100%))}::ng-deep .mat-datetimepicker-content .mat-datetimepicker-calendar-content mat-datetimepicker-year-view .mat-datetimepicker-calendar-table .mat-datetimepicker-calendar-body .mat-datetimepicker-calendar-body-cell .mat-datetimepicker-calendar-body-cell-content.mat-datetimepicker-calendar-body-selected:hover,::ng-deep .mat-datetimepicker-content .mat-datetimepicker-calendar-content mat-datetimepicker-month-view .mat-datetimepicker-calendar-table .mat-datetimepicker-calendar-body .mat-datetimepicker-calendar-body-cell .mat-datetimepicker-calendar-body-cell-content.mat-datetimepicker-calendar-body-selected:hover{background:hsl(var(--pep-color-strong-h, 78),var(--pep-color-strong-s, 87%),calc(var(--pep-color-strong-l, 27%) - 8%));box-shadow:var(--pep-shadow-sm-offset, 0 .25rem .5rem 0) hsla(var(--pep-color-system-primary-h, 0),var(--pep-color-system-primary-s, 0%),var(--pep-color-system-primary-l, 10%),.16)}::ng-deep .mat-datetimepicker-content .mat-datetimepicker-calendar-content mat-datetimepicker-year-view .mat-datetimepicker-calendar-table .mat-datetimepicker-calendar-body .mat-datetimepicker-calendar-body-cell .mat-datetimepicker-calendar-body-cell-content.mat-datetimepicker-calendar-body-selected:active,::ng-deep .mat-datetimepicker-content .mat-datetimepicker-calendar-content mat-datetimepicker-month-view .mat-datetimepicker-calendar-table .mat-datetimepicker-calendar-body .mat-datetimepicker-calendar-body-cell .mat-datetimepicker-calendar-body-cell-content.mat-datetimepicker-calendar-body-selected:active{background:hsl(var(--pep-color-strong-h, 78),var(--pep-color-strong-s, 87%),calc(var(--pep-color-strong-l, 27%) - 15%));box-shadow:var(--pep-shadow-sm-offset, 0 .25rem .5rem 0) hsla(var(--pep-color-system-primary-h, 0),var(--pep-color-system-primary-s, 0%),var(--pep-color-system-primary-l, 10%),.08);box-shadow:0 0 0 var(--pep-spacing-xs, .25rem) hsla(var(--pep-color-text-link-h, 207),var(--pep-color-text-link-s, 76%),var(--pep-color-text-link-l, 37%),.5)}::ng-deep .mat-datetimepicker-content .mat-datetimepicker-calendar-content mat-datetimepicker-clock .mat-datetimepicker-clock{background:hsla(var(--pep-color-weak-h, 0),var(--pep-color-weak-s, 0%),var(--pep-color-weak-l, 10%),.12)}::ng-deep .mat-datetimepicker-content .mat-datetimepicker-calendar-content mat-datetimepicker-clock .mat-datetimepicker-clock .mat-datetimepicker-clock-center{font-weight:var(--pep-font-weight-bold, 600);background:hsl(var(--pep-color-strong-h, 78),var(--pep-color-strong-s, 87%),var(--pep-color-strong-l, 27%));box-shadow:var(--pep-shadow-sm-offset, 0 .25rem .5rem 0) hsla(var(--pep-color-system-primary-h, 0),var(--pep-color-system-primary-s, 0%),var(--pep-color-system-primary-l, 10%),.08);color:hsl(var(--pep-color-system-primary-invert-h, 255),var(--pep-color-system-primary-invert-s, 100%),var(--pep-color-system-primary-invert-l, 100%))}::ng-deep .mat-datetimepicker-content .mat-datetimepicker-calendar-content mat-datetimepicker-clock .mat-datetimepicker-clock .mat-datetimepicker-clock-center .svg-icon{fill:hsl(var(--pep-color-system-primary-invert-h, 255),var(--pep-color-system-primary-invert-s, 100%),var(--pep-color-system-primary-invert-l, 100%))}::ng-deep .mat-datetimepicker-content .mat-datetimepicker-calendar-content mat-datetimepicker-clock .mat-datetimepicker-clock .mat-datetimepicker-clock-center .svg-icon.stroke{fill:unset;stroke:hsl(var(--pep-color-system-primary-invert-h, 255),var(--pep-color-system-primary-invert-s, 100%),var(--pep-color-system-primary-invert-l, 100%))}::ng-deep .mat-datetimepicker-content .mat-datetimepicker-calendar-content mat-datetimepicker-clock .mat-datetimepicker-clock .mat-datetimepicker-clock-hand{font-weight:var(--pep-font-weight-bold, 600);background:hsl(var(--pep-color-strong-h, 78),var(--pep-color-strong-s, 87%),var(--pep-color-strong-l, 27%));box-shadow:var(--pep-shadow-sm-offset, 0 .25rem .5rem 0) hsla(var(--pep-color-system-primary-h, 0),var(--pep-color-system-primary-s, 0%),var(--pep-color-system-primary-l, 10%),.08);color:hsl(var(--pep-color-system-primary-invert-h, 255),var(--pep-color-system-primary-invert-s, 100%),var(--pep-color-system-primary-invert-l, 100%))}::ng-deep .mat-datetimepicker-content .mat-datetimepicker-calendar-content mat-datetimepicker-clock .mat-datetimepicker-clock .mat-datetimepicker-clock-hand .svg-icon{fill:hsl(var(--pep-color-system-primary-invert-h, 255),var(--pep-color-system-primary-invert-s, 100%),var(--pep-color-system-primary-invert-l, 100%))}::ng-deep .mat-datetimepicker-content .mat-datetimepicker-calendar-content mat-datetimepicker-clock .mat-datetimepicker-clock .mat-datetimepicker-clock-hand .svg-icon.stroke{fill:unset;stroke:hsl(var(--pep-color-system-primary-invert-h, 255),var(--pep-color-system-primary-invert-s, 100%),var(--pep-color-system-primary-invert-l, 100%))}::ng-deep .mat-datetimepicker-content .mat-datetimepicker-calendar-content mat-datetimepicker-clock .mat-datetimepicker-clock .mat-datetimepicker-clock-hand:before{font-weight:var(--pep-font-weight-bold, 600);background:hsl(var(--pep-color-strong-h, 78),var(--pep-color-strong-s, 87%),var(--pep-color-strong-l, 27%));box-shadow:var(--pep-shadow-sm-offset, 0 .25rem .5rem 0) hsla(var(--pep-color-system-primary-h, 0),var(--pep-color-system-primary-s, 0%),var(--pep-color-system-primary-l, 10%),.08);color:hsl(var(--pep-color-system-primary-invert-h, 255),var(--pep-color-system-primary-invert-s, 100%),var(--pep-color-system-primary-invert-l, 100%))}::ng-deep .mat-datetimepicker-content .mat-datetimepicker-calendar-content mat-datetimepicker-clock .mat-datetimepicker-clock .mat-datetimepicker-clock-hand:before .svg-icon{fill:hsl(var(--pep-color-system-primary-invert-h, 255),var(--pep-color-system-primary-invert-s, 100%),var(--pep-color-system-primary-invert-l, 100%))}::ng-deep .mat-datetimepicker-content .mat-datetimepicker-calendar-content mat-datetimepicker-clock .mat-datetimepicker-clock .mat-datetimepicker-clock-hand:before .svg-icon.stroke{fill:unset;stroke:hsl(var(--pep-color-system-primary-invert-h, 255),var(--pep-color-system-primary-invert-s, 100%),var(--pep-color-system-primary-invert-l, 100%))}::ng-deep .mat-datetimepicker-content .mat-datetimepicker-calendar-content mat-datetimepicker-clock .mat-datetimepicker-clock .mat-datetimepicker-clock-hours .mat-datetimepicker-clock-cell,::ng-deep .mat-datetimepicker-content .mat-datetimepicker-calendar-content mat-datetimepicker-clock .mat-datetimepicker-clock .mat-datetimepicker-clock-minutes .mat-datetimepicker-clock-cell{color:hsl(var(--pep-color-system-primary-h, 0),var(--pep-color-system-primary-s, 0%),var(--pep-color-system-primary-l, 10%))}::ng-deep .mat-datetimepicker-content .mat-datetimepicker-calendar-content mat-datetimepicker-clock .mat-datetimepicker-clock .mat-datetimepicker-clock-hours .mat-datetimepicker-clock-cell:hover,::ng-deep .mat-datetimepicker-content .mat-datetimepicker-calendar-content mat-datetimepicker-clock .mat-datetimepicker-clock .mat-datetimepicker-clock-minutes .mat-datetimepicker-clock-cell:hover{background:hsla(var(--pep-color-weak-h, 0),var(--pep-color-weak-s, 0%),var(--pep-color-weak-l, 10%),.16)}::ng-deep .mat-datetimepicker-content .mat-datetimepicker-calendar-content mat-datetimepicker-clock .mat-datetimepicker-clock .mat-datetimepicker-clock-hours .mat-datetimepicker-clock-cell.mat-datetimepicker-clock-cell-selected,::ng-deep .mat-datetimepicker-content .mat-datetimepicker-calendar-content mat-datetimepicker-clock .mat-datetimepicker-clock .mat-datetimepicker-clock-minutes .mat-datetimepicker-clock-cell.mat-datetimepicker-clock-cell-selected{font-weight:var(--pep-font-weight-bold, 600);background:hsl(var(--pep-color-strong-h, 78),var(--pep-color-strong-s, 87%),var(--pep-color-strong-l, 27%));box-shadow:var(--pep-shadow-sm-offset, 0 .25rem .5rem 0) hsla(var(--pep-color-system-primary-h, 0),var(--pep-color-system-primary-s, 0%),var(--pep-color-system-primary-l, 10%),.08);color:hsl(var(--pep-color-system-primary-invert-h, 255),var(--pep-color-system-primary-invert-s, 100%),var(--pep-color-system-primary-invert-l, 100%))}::ng-deep .mat-datetimepicker-content .mat-datetimepicker-calendar-content mat-datetimepicker-clock .mat-datetimepicker-clock .mat-datetimepicker-clock-hours .mat-datetimepicker-clock-cell.mat-datetimepicker-clock-cell-selected .svg-icon,::ng-deep .mat-datetimepicker-content .mat-datetimepicker-calendar-content mat-datetimepicker-clock .mat-datetimepicker-clock .mat-datetimepicker-clock-minutes .mat-datetimepicker-clock-cell.mat-datetimepicker-clock-cell-selected .svg-icon{fill:hsl(var(--pep-color-system-primary-invert-h, 255),var(--pep-color-system-primary-invert-s, 100%),var(--pep-color-system-primary-invert-l, 100%))}::ng-deep .mat-datetimepicker-content .mat-datetimepicker-calendar-content mat-datetimepicker-clock .mat-datetimepicker-clock .mat-datetimepicker-clock-hours .mat-datetimepicker-clock-cell.mat-datetimepicker-clock-cell-selected .svg-icon.stroke,::ng-deep .mat-datetimepicker-content .mat-datetimepicker-calendar-content mat-datetimepicker-clock .mat-datetimepicker-clock .mat-datetimepicker-clock-minutes .mat-datetimepicker-clock-cell.mat-datetimepicker-clock-cell-selected .svg-icon.stroke{fill:unset;stroke:hsl(var(--pep-color-system-primary-invert-h, 255),var(--pep-color-system-primary-invert-s, 100%),var(--pep-color-system-primary-invert-l, 100%))}::ng-deep .mat-datetimepicker-content .mat-datetimepicker-calendar-content mat-datetimepicker-clock .mat-datetimepicker-clock .mat-datetimepicker-clock-hours .mat-datetimepicker-clock-cell.mat-datetimepicker-clock-cell-selected:hover,::ng-deep .mat-datetimepicker-content .mat-datetimepicker-calendar-content mat-datetimepicker-clock .mat-datetimepicker-clock .mat-datetimepicker-clock-minutes .mat-datetimepicker-clock-cell.mat-datetimepicker-clock-cell-selected:hover{background:hsl(var(--pep-color-strong-h, 78),var(--pep-color-strong-s, 87%),calc(var(--pep-color-strong-l, 27%) - 8%));box-shadow:var(--pep-shadow-sm-offset, 0 .25rem .5rem 0) hsla(var(--pep-color-system-primary-h, 0),var(--pep-color-system-primary-s, 0%),var(--pep-color-system-primary-l, 10%),.16)}::ng-deep .mat-datetimepicker-content .mat-datetimepicker-calendar-content mat-datetimepicker-clock .mat-datetimepicker-clock .mat-datetimepicker-clock-hours .mat-datetimepicker-clock-cell.mat-datetimepicker-clock-cell-selected:active,::ng-deep .mat-datetimepicker-content .mat-datetimepicker-calendar-content mat-datetimepicker-clock .mat-datetimepicker-clock .mat-datetimepicker-clock-minutes .mat-datetimepicker-clock-cell.mat-datetimepicker-clock-cell-selected:active{background:hsl(var(--pep-color-strong-h, 78),var(--pep-color-strong-s, 87%),calc(var(--pep-color-strong-l, 27%) - 15%));box-shadow:var(--pep-shadow-sm-offset, 0 .25rem .5rem 0) hsla(var(--pep-color-system-primary-h, 0),var(--pep-color-system-primary-s, 0%),var(--pep-color-system-primary-l, 10%),.08);box-shadow:0 0 0 var(--pep-spacing-xs, .25rem) hsla(var(--pep-color-text-link-h, 207),var(--pep-color-text-link-s, 76%),var(--pep-color-text-link-l, 37%),.5)}\n"], dependencies: [{ kind: "directive", type: i3.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { 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: i3.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }, { kind: "directive", type: i3.NgSwitch, selector: "[ngSwitch]", inputs: ["ngSwitch"] }, { kind: "directive", type: i3.NgSwitchDefault, selector: "[ngSwitchDefault]" }, { kind: "directive", type: i4.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: i4.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i4.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i4.RequiredValidator, selector: ":not([type=checkbox])[required][formControlName],:not([type=checkbox])[required][formControl],:not([type=checkbox])[required][ngModel]", inputs: ["required"] }, { kind: "directive", type: i4.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i4.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "component", type: i5.MatButton, selector: "button[mat-button], button[mat-raised-button], button[mat-icon-button],             button[mat-fab], button[mat-mini-fab], button[mat-stroked-button],             button[mat-flat-button]", inputs: ["disabled", "disableRipple", "color"], exportAs: ["matButton"] }, { kind: "component", type: i6.MatDatetimepickerComponent, selector: "mat-datetimepicker", inputs: ["multiYearSelector", "twelvehour", "startView", "mode", "timeInterval", "ariaNextMonthLabel", "ariaPrevMonthLabel", "ariaNextYearLabel", "ariaPrevYearLabel", "preventSameDateTimeSelection", "panelClass", "startAt", "openOnFocus", "type", "touchUi", "disabled"], outputs: ["selectedChanged", "opened", "closed", "viewChanged"], exportAs: ["matDatetimepicker"] }, { kind: "directive", type: i6.MatDatetimepickerInputDirective, selector: "input[matDatetimepicker]", inputs: ["matDatetimepicker", "matDatepickerFilter", "value", "min", "max", "disabled"], outputs: ["dateChange", "dateInput"], exportAs: ["matDatepickerInput"] }, { kind: "directive", type: i7.MatError, selector: "mat-error", inputs: ["id"] }, { kind: "component", type: i7.MatFormField, selector: "mat-form-field", inputs: ["color", "appearance", "hideRequiredMarker", "hintLabel", "floatLabel"], exportAs: ["matFormField"] }, { kind: "directive", type: i7.MatPrefix, selector: "[matPrefix]" }, { kind: "directive", type: i7.MatSuffix, selector: "[matSuffix]" }, { kind: "directive", type: i8.MatInput, selector: "input[matInput], textarea[matInput], select[matNativeControl],      input[matNativeControl], textarea[matNativeControl]", inputs: ["disabled", "id", "placeholder", "name", "required", "type", "errorStateMatcher", "aria-describedby", "value", "readonly"], exportAs: ["matInput"] }, { kind: "component", type: i9.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "component", type: i1$1.PepIconComponent, selector: "pep-icon", inputs: ["spin", "name", "fill"] }, { kind: "component", type: i11.PepFieldTitleComponent, selector: "pep-field-title", inputs: ["label", "mandatory", "disabled", "maxFieldCharacters", "hint", "xAlignment", "showTitle", "inputLength", "fontBodyType"] }, { kind: "component", type: i12.PepTextboxIconComponent, selector: "pep-textbox-icon", inputs: ["value", "label", "type", "disabled"], outputs: ["iconClick"] }, { kind: "pipe", type: i13.TranslatePipe, name: "translate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.0.2", ngImport: i0, type: PepDateComponent, decorators: [{
+            type: Component,
+            args: [{ selector: 'pep-date', changeDetection: ChangeDetectionStrategy.OnPush, providers: [
+                        // CUSTOM_INPUT_CONTROL_VALUE_ACCESSOR,
+                        // The locale would typically be provided on the root module of your application. We do it at
+                        // the component level here, due to limitations of our example generation script.
+                        // { provide: MAT_DATE_LOCALE, useValue: 'he' },
+                        { provide: MAT_DATE_LOCALE, useFactory: getCalture, deps: [PepLayoutService] },
+                        // `MomentDateAdapter` and `MAT_MOMENT_DATE_FORMATS` can be automatically provided by importing
+                        // `MatMomentDateModule` in your applications root module. We provide it at the component level
+                        // here, due to limitations of our example generation script.
+                        //{ provide: DateAdapter, useClass: MomentDateAdapter, deps: [MAT_DATE_LOCALE] },
+                        //{ provide: MAT_DATE_FORMATS, useValue: MAT_MOMENT_DATE_FORMATS },
+                        { provide: DateAdapter, useClass: MomentUtcDateAdapter },
+                        { provide: MAT_DATE_FORMATS, useValue: MY_DATE_FORMATS },
+                        { provide: DatetimeAdapter, useClass: MomentUtcDateTimeAdapter },
+                        //{ provide: MAT_DATETIME_FORMATS, useValue: MAT_NATIVE_DATETIME_FORMATS }
+                        { provide: MAT_DATETIME_FORMATS, useValue: MY_DATE_FORMATS },
+                    ], template: "<ng-container [formGroup]=\"form\">\n    <ng-template #pepTemplate let-showIcon=\"showIcon\">\n        <mat-form-field appearance=\"outline\">\n            <input #input [id]=\"key\" title=\"{{ formattedValue }}\" matInput class=\"body-sm\" autocomplete=\"false\"\n                [ngStyle]=\"{ color: textColor, 'text-align': xAlignment == 'center' ? 'center' : xAlignment == 'right' ? 'right' : 'left'}\"\n                [(ngModel)]=\"dateModel\" [ngModelOptions]=\"{standalone: true}\" [matDatetimepicker]=\"datetimePicker\"\n                [min]=\"minDate\" [max]=\"maxDate\" [required]=\"mandatory\" [disabled]=\"disabled\"\n                (dateChange)=\"onDateChange($event)\" (click)=\"openDatetimePicker(datetimePicker)\"\n                (blur)=\"onBlur($event)\" />\n            <mat-error *ngIf=\"renderError\"><span class=\"body-xs\"\n                    [title]=\"mandatory && formattedValue?.length == 0 ? ('MESSAGES.ERROR_IS_REQUIRED' | translate: {field: label}) : ('MESSAGES.ERROR_IS_NOT_VALID' | translate: {field: label})\"\n                    [innerText]=\"mandatory && formattedValue?.length == 0 ? ('MESSAGES.ERROR_IS_REQUIRED' | translate: {field: label}) : ('MESSAGES.ERROR_IS_NOT_VALID' | translate: {field: label})\"></span>\n            </mat-error>\n            <pep-textbox-icon *ngIf=\"renderSymbol && showIcon && xAlignment == 'right'\" matPrefix [value]=\"value\"\n                [label]=\"label\" [type]=\"type\" [disabled]=\"disabled\" (iconClick)=\"openDatetimePicker(datetimePicker)\">\n            </pep-textbox-icon>\n            <pep-textbox-icon *ngIf=\"renderSymbol && showIcon && xAlignment == 'left'\" matSuffix [value]=\"value\"\n                [label]=\"label\" [type]=\"type\" [disabled]=\"disabled\" (iconClick)=\"openDatetimePicker(datetimePicker)\">\n            </pep-textbox-icon>\n            <mat-datetimepicker #datetimePicker [type]=\"showTime ? 'datetime' : 'date'\" [openOnFocus]=\"false\"\n                [touchUi]=\"true\" [timeInterval]=\"1\"></mat-datetimepicker>\n        </mat-form-field>\n    </ng-template>\n\n    <ng-container *ngIf=\"layoutType === 'form'\">\n        <pep-field-title *ngIf=\"renderTitle\" [label]=\"label\" [mandatory]=\"mandatory\" [disabled]=\"disabled\"\n            [xAlignment]=\"xAlignment\" [showTitle]=\"showTitle\">\n        </pep-field-title>\n        <ng-container *ngTemplateOutlet=\"pepTemplate; context: {showIcon: true}\"></ng-container>\n    </ng-container>\n\n    <ng-container *ngIf=\"layoutType === 'card'\">\n        <ng-container *ngIf=\"isInEditMode; then editBlock; else readOnlyBlock\"></ng-container>\n        <ng-template #editBlock>\n            <div [ngClass]=\"{'one-row': rowSpan === 1}\">\n                <ng-container *ngTemplateOutlet=\"pepTemplate; context: {showIcon: false}\"></ng-container>\n            </div>\n        </ng-template>\n        <ng-template #readOnlyBlock>\n            <div class=\"pep-card-input card-flex-container\"\n                [ngClass]=\"{'one-row': rowSpan === 1, 'pep-button weak': isActive && !disabled }\"\n                [ngStyle]=\"{ color: textColor }\" [class]=\"'text-align-' + xAlignment\"\n                (click)=\"!disabled ? cardTemplateClicked($event) : ''\">\n                <span *ngIf=\"showTitle && label != ''\" class=\"body-xs title\" title=\"{{ label }}\">{{ label\n                    }}&nbsp;</span>\n                <span [id]=\"key\" title=\"{{ formattedValue }}\" class=\"body-sm value\">{{ formattedValue }}</span>\n                <button *ngIf=\"isActive && !disabled\" class=\"pep-button weak card-edit-button\" mat-button>\n                    <mat-icon>\n                        <pep-icon name=\"system_edit\">\n                        </pep-icon>\n                    </mat-icon>\n                </button>\n            </div>\n        </ng-template>\n    </ng-container>\n\n    <ng-container *ngIf=\"layoutType === 'table'\">\n        <ng-container *ngIf=\"isActive && !disabled; then selectedBlock; else notSelectedBlock\"></ng-container>\n        <ng-template #selectedBlock>\n            <ng-container *ngTemplateOutlet=\"pepTemplate; context: {showIcon: true}\"></ng-container>\n        </ng-template>\n        <ng-template #notSelectedBlock>\n            <ng-container *ngIf=\"formattedValue?.length > 0; then notEmptyBlock; else emptyBlock\"></ng-container>\n            <ng-template #notEmptyBlock>\n                <ng-container [ngSwitch]=\"type\">\n                    <ng-container *ngSwitchDefault>\n                        <span [id]=\"key\" class=\"body-sm pep-report-input\" [ngStyle]=\"{ color: textColor }\"\n                            [ngClass]=\"{readonly: disabled}\" title=\"{{ formattedValue }}\">{{ formattedValue }}</span>\n                    </ng-container>\n                </ng-container>\n            </ng-template>\n            <ng-template #emptyBlock>\n                <span [id]=\"key\">&nbsp;</span>\n            </ng-template>\n        </ng-template>\n    </ng-container>\n</ng-container>", styles: [":host{height:inherit;display:grid}:host>*{align-self:center}::ng-deep .mat-form-field .mat-form-field-wrapper .mat-form-field-prefix .mat-datetimepicker-toggle.mat-button,::ng-deep .mat-form-field .mat-form-field-wrapper .mat-form-field-suffix .mat-datetimepicker-toggle.mat-button{padding:0}\n", "::ng-deep .mat-datetimepicker-dialog{max-width:90vw!important}::ng-deep .mat-datetimepicker-content{border-radius:inherit}::ng-deep .mat-datetimepicker-content .mat-datetimepicker-calendar-header{font-weight:var(--pep-font-weight-bold, 600);background:hsl(var(--pep-color-strong-h, 78),var(--pep-color-strong-s, 87%),var(--pep-color-strong-l, 27%));box-shadow:var(--pep-shadow-sm-offset, 0 .25rem .5rem 0) hsla(var(--pep-color-system-primary-h, 0),var(--pep-color-system-primary-s, 0%),var(--pep-color-system-primary-l, 10%),.08);color:hsl(var(--pep-color-system-primary-invert-h, 255),var(--pep-color-system-primary-invert-s, 100%),var(--pep-color-system-primary-invert-l, 100%))}::ng-deep .mat-datetimepicker-content .mat-datetimepicker-calendar-header .svg-icon{fill:hsl(var(--pep-color-system-primary-invert-h, 255),var(--pep-color-system-primary-invert-s, 100%),var(--pep-color-system-primary-invert-l, 100%))}::ng-deep .mat-datetimepicker-content .mat-datetimepicker-calendar-header .svg-icon.stroke{fill:unset;stroke:hsl(var(--pep-color-system-primary-invert-h, 255),var(--pep-color-system-primary-invert-s, 100%),var(--pep-color-system-primary-invert-l, 100%))}::ng-deep .mat-datetimepicker-content .mat-datetimepicker-calendar-content .mat-month-content .mat-datetimepicker-calendar-controls{color:hsl(var(--pep-color-system-primary-h, 0),var(--pep-color-system-primary-s, 0%),var(--pep-color-system-primary-l, 10%))}::ng-deep .mat-datetimepicker-content .mat-datetimepicker-calendar-content .mat-month-content .mat-datetimepicker-calendar-controls .mat-datetimepicker-calendar-previous-button{content:url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0iVVRGLTgiIHN0YW5kYWxvbmU9Im5vIj8+CjxzdmcKICAgeG1sbnM6ZGM9Imh0dHA6Ly9wdXJsLm9yZy9kYy9lbGVtZW50cy8xLjEvIgogICB4bWxuczpjYz0iaHR0cDovL2NyZWF0aXZlY29tbW9ucy5vcmcvbnMjIgogICB4bWxuczpyZGY9Imh0dHA6Ly93d3cudzMub3JnLzE5OTkvMDIvMjItcmRmLXN5bnRheC1ucyMiCiAgIHhtbG5zOnN2Zz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciCiAgIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIKICAgaWQ9InN2ZzQiCiAgIHZlcnNpb249IjEuMSIKICAgdmlld0JveD0iMCAwIDI0IDI0IgogICBoZWlnaHQ9IjE2IgogICB3aWR0aD0iMTYiPgogIDxtZXRhZGF0YQogICAgIGlkPSJtZXRhZGF0YTEwIj4KICAgIDxyZGY6UkRGPgogICAgICA8Y2M6V29yawogICAgICAgICByZGY6YWJvdXQ9IiI+CiAgICAgICAgPGRjOmZvcm1hdD5pbWFnZS9zdmcreG1sPC9kYzpmb3JtYXQ+CiAgICAgICAgPGRjOnR5cGUKICAgICAgICAgICByZGY6cmVzb3VyY2U9Imh0dHA6Ly9wdXJsLm9yZy9kYy9kY21pdHlwZS9TdGlsbEltYWdlIiAvPgogICAgICA8L2NjOldvcms+CiAgICA8L3JkZjpSREY+CiAgPC9tZXRhZGF0YT4KICA8ZGVmcwogICAgIGlkPSJkZWZzOCIgLz4KICA8cGF0aAogICAgIGlkPSJwYXRoMiIKICAgICBkPSJNNS44MDAzMjE0OCw5LjI4Njc0MzU0IEwxMS4yNTQyODI0LDEzLjIwMjc1ODMgQzExLjY2NjEzMDksMTMuNTg1MDgzIDEyLjMzMzg2OTEsMTMuNTg1MDgzIDEyLjc0NTcxNzYsMTMuMjAyNzU4MyBMMTguMTk5Njc4NSw5LjI4Njc0MzU0IEMxOC42MTE1MjcsOC45MDQ0MTg4MiAxOS4yNzkyNjUyLDguOTA0NDE4ODIgMTkuNjkxMTEzNyw5LjI4Njc0MzU0IEMyMC4xMDI5NjIxLDkuNjY5MDY4MjYgMjAuMTAyOTYyMSwxMC4yODg5MzkxIDE5LjY5MTExMzcsMTAuNjcxMjYzOCBMMTMuNDkxNDM1MSwxNi40MjY1MTI5IEMxMi42Njc3MzgzLDE3LjE5MTE2MjQgMTEuMzMyMjYxNywxNy4xOTExNjI0IDEwLjUwODU2NDksMTYuNDI2NTEyOSBMNC4zMDg4ODYzMywxMC42NzEyNjM4IEMzLjg5NzAzNzg5LDEwLjI4ODkzOTEgMy44OTcwMzc4OSw5LjY2OTA2ODI2IDQuMzA4ODg2MzMsOS4yODY3NDM1NCBDNC43MjA3MzQ3OCw4LjkwNDQxODgyIDUuMzg4NDczMDMsOC45MDQ0MTg4MiA1LjgwMDMyMTQ4LDkuMjg2NzQzNTQgWiIKICAgICBmaWxsLXJ1bGU9ImV2ZW5vZGQiCiAgICAgZmlsbC1vcGFjaXR5PSIuNSIgLz4KPC9zdmc+Cg==);transform:rotate(90deg)}::ng-deep .mat-datetimepicker-content .mat-datetimepicker-calendar-content .mat-month-content .mat-datetimepicker-calendar-controls .mat-datetimepicker-calendar-previous-button svg{fill:hsla(var(--pep-color-system-primary-h, 0),var(--pep-color-system-primary-s, 0%),var(--pep-color-system-primary-l, 10%),.8)}::ng-deep .mat-datetimepicker-content .mat-datetimepicker-calendar-content .mat-month-content .mat-datetimepicker-calendar-controls .mat-datetimepicker-calendar-previous-button svg.stroke{fill:unset;stroke:hsla(var(--pep-color-system-primary-h, 0),var(--pep-color-system-primary-s, 0%),var(--pep-color-system-primary-l, 10%),.8)}::ng-deep .mat-datetimepicker-content .mat-datetimepicker-calendar-content .mat-month-content .mat-datetimepicker-calendar-controls .mat-datetimepicker-calendar-previous-button svg:hover{fill:hsla(var(--pep-color-system-primary-h, 0),var(--pep-color-system-primary-s, 0%),var(--pep-color-system-primary-l, 10%),.97)}::ng-deep .mat-datetimepicker-content .mat-datetimepicker-calendar-content .mat-month-content .mat-datetimepicker-calendar-controls .mat-datetimepicker-calendar-previous-button svg:hover.stroke{fill:unset;stroke:hsla(var(--pep-color-system-primary-h, 0),var(--pep-color-system-primary-s, 0%),var(--pep-color-system-primary-l, 10%),.97)}::ng-deep .mat-datetimepicker-content .mat-datetimepicker-calendar-content .mat-month-content .mat-datetimepicker-calendar-controls .mat-datetimepicker-calendar-previous-button svg:active{fill:hsl(var(--pep-color-system-primary-h, 0),var(--pep-color-system-primary-s, 0%),var(--pep-color-system-primary-l, 10%))}::ng-deep .mat-datetimepicker-content .mat-datetimepicker-calendar-content .mat-month-content .mat-datetimepicker-calendar-controls .mat-datetimepicker-calendar-previous-button svg:active.stroke{fill:unset;stroke:hsl(var(--pep-color-system-primary-h, 0),var(--pep-color-system-primary-s, 0%),var(--pep-color-system-primary-l, 10%))}::ng-deep .mat-datetimepicker-content .mat-datetimepicker-calendar-content .mat-month-content .mat-datetimepicker-calendar-controls .mat-datetimepicker-calendar-previous-button svg:disabled{fill:hsla(var(--pep-color-system-primary-h, 0),var(--pep-color-system-primary-s, 0%),var(--pep-color-system-primary-l, 10%),.35)}::ng-deep .mat-datetimepicker-content .mat-datetimepicker-calendar-content .mat-month-content .mat-datetimepicker-calendar-controls .mat-datetimepicker-calendar-previous-button svg:disabled.stroke{fill:unset;stroke:hsla(var(--pep-color-system-primary-h, 0),var(--pep-color-system-primary-s, 0%),var(--pep-color-system-primary-l, 10%),.35)}::ng-deep .mat-datetimepicker-content .mat-datetimepicker-calendar-content .mat-month-content .mat-datetimepicker-calendar-controls .mat-datetimepicker-calendar-next-button{content:url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0iVVRGLTgiIHN0YW5kYWxvbmU9Im5vIj8+CjxzdmcKICAgeG1sbnM6ZGM9Imh0dHA6Ly9wdXJsLm9yZy9kYy9lbGVtZW50cy8xLjEvIgogICB4bWxuczpjYz0iaHR0cDovL2NyZWF0aXZlY29tbW9ucy5vcmcvbnMjIgogICB4bWxuczpyZGY9Imh0dHA6Ly93d3cudzMub3JnLzE5OTkvMDIvMjItcmRmLXN5bnRheC1ucyMiCiAgIHhtbG5zOnN2Zz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciCiAgIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIKICAgaWQ9InN2ZzQiCiAgIHZlcnNpb249IjEuMSIKICAgdmlld0JveD0iMCAwIDI0IDI0IgogICBoZWlnaHQ9IjE2IgogICB3aWR0aD0iMTYiPgogIDxtZXRhZGF0YQogICAgIGlkPSJtZXRhZGF0YTEwIj4KICAgIDxyZGY6UkRGPgogICAgICA8Y2M6V29yawogICAgICAgICByZGY6YWJvdXQ9IiI+CiAgICAgICAgPGRjOmZvcm1hdD5pbWFnZS9zdmcreG1sPC9kYzpmb3JtYXQ+CiAgICAgICAgPGRjOnR5cGUKICAgICAgICAgICByZGY6cmVzb3VyY2U9Imh0dHA6Ly9wdXJsLm9yZy9kYy9kY21pdHlwZS9TdGlsbEltYWdlIiAvPgogICAgICA8L2NjOldvcms+CiAgICA8L3JkZjpSREY+CiAgPC9tZXRhZGF0YT4KICA8ZGVmcwogICAgIGlkPSJkZWZzOCIgLz4KICA8cGF0aAogICAgIGlkPSJwYXRoMiIKICAgICBkPSJNNS44MDAzMjE0OCw5LjI4Njc0MzU0IEwxMS4yNTQyODI0LDEzLjIwMjc1ODMgQzExLjY2NjEzMDksMTMuNTg1MDgzIDEyLjMzMzg2OTEsMTMuNTg1MDgzIDEyLjc0NTcxNzYsMTMuMjAyNzU4MyBMMTguMTk5Njc4NSw5LjI4Njc0MzU0IEMxOC42MTE1MjcsOC45MDQ0MTg4MiAxOS4yNzkyNjUyLDguOTA0NDE4ODIgMTkuNjkxMTEzNyw5LjI4Njc0MzU0IEMyMC4xMDI5NjIxLDkuNjY5MDY4MjYgMjAuMTAyOTYyMSwxMC4yODg5MzkxIDE5LjY5MTExMzcsMTAuNjcxMjYzOCBMMTMuNDkxNDM1MSwxNi40MjY1MTI5IEMxMi42Njc3MzgzLDE3LjE5MTE2MjQgMTEuMzMyMjYxNywxNy4xOTExNjI0IDEwLjUwODU2NDksMTYuNDI2NTEyOSBMNC4zMDg4ODYzMywxMC42NzEyNjM4IEMzLjg5NzAzNzg5LDEwLjI4ODkzOTEgMy44OTcwMzc4OSw5LjY2OTA2ODI2IDQuMzA4ODg2MzMsOS4yODY3NDM1NCBDNC43MjA3MzQ3OCw4LjkwNDQxODgyIDUuMzg4NDczMDMsOC45MDQ0MTg4MiA1LjgwMDMyMTQ4LDkuMjg2NzQzNTQgWiIKICAgICBmaWxsLXJ1bGU9ImV2ZW5vZGQiCiAgICAgZmlsbC1vcGFjaXR5PSIuNSIgLz4KPC9zdmc+Cg==);transform:rotate(-90deg)}::ng-deep .mat-datetimepicker-content .mat-datetimepicker-calendar-content .mat-month-content .mat-datetimepicker-calendar-controls .mat-datetimepicker-calendar-next-button svg{fill:hsla(var(--pep-color-system-primary-h, 0),var(--pep-color-system-primary-s, 0%),var(--pep-color-system-primary-l, 10%),.8)}::ng-deep .mat-datetimepicker-content .mat-datetimepicker-calendar-content .mat-month-content .mat-datetimepicker-calendar-controls .mat-datetimepicker-calendar-next-button svg.stroke{fill:unset;stroke:hsla(var(--pep-color-system-primary-h, 0),var(--pep-color-system-primary-s, 0%),var(--pep-color-system-primary-l, 10%),.8)}::ng-deep .mat-datetimepicker-content .mat-datetimepicker-calendar-content .mat-month-content .mat-datetimepicker-calendar-controls .mat-datetimepicker-calendar-next-button svg:hover{fill:hsla(var(--pep-color-system-primary-h, 0),var(--pep-color-system-primary-s, 0%),var(--pep-color-system-primary-l, 10%),.97)}::ng-deep .mat-datetimepicker-content .mat-datetimepicker-calendar-content .mat-month-content .mat-datetimepicker-calendar-controls .mat-datetimepicker-calendar-next-button svg:hover.stroke{fill:unset;stroke:hsla(var(--pep-color-system-primary-h, 0),var(--pep-color-system-primary-s, 0%),var(--pep-color-system-primary-l, 10%),.97)}::ng-deep .mat-datetimepicker-content .mat-datetimepicker-calendar-content .mat-month-content .mat-datetimepicker-calendar-controls .mat-datetimepicker-calendar-next-button svg:active{fill:hsl(var(--pep-color-system-primary-h, 0),var(--pep-color-system-primary-s, 0%),var(--pep-color-system-primary-l, 10%))}::ng-deep .mat-datetimepicker-content .mat-datetimepicker-calendar-content .mat-month-content .mat-datetimepicker-calendar-controls .mat-datetimepicker-calendar-next-button svg:active.stroke{fill:unset;stroke:hsl(var(--pep-color-system-primary-h, 0),var(--pep-color-system-primary-s, 0%),var(--pep-color-system-primary-l, 10%))}::ng-deep .mat-datetimepicker-content .mat-datetimepicker-calendar-content .mat-month-content .mat-datetimepicker-calendar-controls .mat-datetimepicker-calendar-next-button svg:disabled{fill:hsla(var(--pep-color-system-primary-h, 0),var(--pep-color-system-primary-s, 0%),var(--pep-color-system-primary-l, 10%),.35)}::ng-deep .mat-datetimepicker-content .mat-datetimepicker-calendar-content .mat-month-content .mat-datetimepicker-calendar-controls .mat-datetimepicker-calendar-next-button svg:disabled.stroke{fill:unset;stroke:hsla(var(--pep-color-system-primary-h, 0),var(--pep-color-system-primary-s, 0%),var(--pep-color-system-primary-l, 10%),.35)}::ng-deep .mat-datetimepicker-content .mat-datetimepicker-calendar-content mat-datetimepicker-year-view .mat-datetimepicker-calendar-table .mat-datetimepicker-calendar-table-header,::ng-deep .mat-datetimepicker-content .mat-datetimepicker-calendar-content mat-datetimepicker-month-view .mat-datetimepicker-calendar-table .mat-datetimepicker-calendar-table-header{color:hsla(var(--pep-color-system-primary-h, 0),var(--pep-color-system-primary-s, 0%),var(--pep-color-system-primary-l, 10%),.7)}::ng-deep .mat-datetimepicker-content .mat-datetimepicker-calendar-content mat-datetimepicker-year-view .mat-datetimepicker-calendar-table .mat-datetimepicker-calendar-body,::ng-deep .mat-datetimepicker-content .mat-datetimepicker-calendar-content mat-datetimepicker-month-view .mat-datetimepicker-calendar-table .mat-datetimepicker-calendar-body{color:hsl(var(--pep-color-system-primary-h, 0),var(--pep-color-system-primary-s, 0%),var(--pep-color-system-primary-l, 10%))}::ng-deep .mat-datetimepicker-content .mat-datetimepicker-calendar-content mat-datetimepicker-year-view .mat-datetimepicker-calendar-table .mat-datetimepicker-calendar-body .mat-datetimepicker-calendar-body-label,::ng-deep .mat-datetimepicker-content .mat-datetimepicker-calendar-content mat-datetimepicker-month-view .mat-datetimepicker-calendar-table .mat-datetimepicker-calendar-body .mat-datetimepicker-calendar-body-label{color:hsla(var(--pep-color-system-primary-h, 0),var(--pep-color-system-primary-s, 0%),var(--pep-color-system-primary-l, 10%),.7)}::ng-deep .mat-datetimepicker-content .mat-datetimepicker-calendar-content mat-datetimepicker-year-view .mat-datetimepicker-calendar-table .mat-datetimepicker-calendar-body .mat-datetimepicker-calendar-body-cell:hover .mat-datetimepicker-calendar-body-cell-content,::ng-deep .mat-datetimepicker-content .mat-datetimepicker-calendar-content mat-datetimepicker-month-view .mat-datetimepicker-calendar-table .mat-datetimepicker-calendar-body .mat-datetimepicker-calendar-body-cell:hover .mat-datetimepicker-calendar-body-cell-content{background:hsla(var(--pep-color-weak-h, 0),var(--pep-color-weak-s, 0%),var(--pep-color-weak-l, 10%),.16)}::ng-deep .mat-datetimepicker-content .mat-datetimepicker-calendar-content mat-datetimepicker-year-view .mat-datetimepicker-calendar-table .mat-datetimepicker-calendar-body .mat-datetimepicker-calendar-body-cell:active .mat-datetimepicker-calendar-body-cell-content,::ng-deep .mat-datetimepicker-content .mat-datetimepicker-calendar-content mat-datetimepicker-month-view .mat-datetimepicker-calendar-table .mat-datetimepicker-calendar-body .mat-datetimepicker-calendar-body-cell:active .mat-datetimepicker-calendar-body-cell-content{box-shadow:var(--pep-shadow-xs-offset, 0 .125rem .25rem 0) hsla(var(--pep-color-system-primary-h, 0),var(--pep-color-system-primary-s, 0%),var(--pep-color-system-primary-l, 10%),.08);border:1px solid hsl(var(--pep-color-weak-h, 0),var(--pep-color-weak-s, 0%),var(--pep-color-weak-l, 10%))}::ng-deep .mat-datetimepicker-content .mat-datetimepicker-calendar-content mat-datetimepicker-year-view .mat-datetimepicker-calendar-table .mat-datetimepicker-calendar-body .mat-datetimepicker-calendar-body-cell:active .mat-datetimepicker-calendar-body-cell-content:not(.keep-background-on-focus),::ng-deep .mat-datetimepicker-content .mat-datetimepicker-calendar-content mat-datetimepicker-month-view .mat-datetimepicker-calendar-table .mat-datetimepicker-calendar-body .mat-datetimepicker-calendar-body-cell:active .mat-datetimepicker-calendar-body-cell-content:not(.keep-background-on-focus){background:hsl(var(--pep-color-system-primary-invert-h, 255),var(--pep-color-system-primary-invert-s, 100%),var(--pep-color-system-primary-invert-l, 100%))}::ng-deep .mat-datetimepicker-content .mat-datetimepicker-calendar-content mat-datetimepicker-year-view .mat-datetimepicker-calendar-table .mat-datetimepicker-calendar-body .mat-datetimepicker-calendar-body-cell .mat-datetimepicker-calendar-body-cell-content.mat-datetimepicker-calendar-body-today,::ng-deep .mat-datetimepicker-content .mat-datetimepicker-calendar-content mat-datetimepicker-month-view .mat-datetimepicker-calendar-table .mat-datetimepicker-calendar-body .mat-datetimepicker-calendar-body-cell .mat-datetimepicker-calendar-body-cell-content.mat-datetimepicker-calendar-body-today{background:hsl(var(--pep-color-regular-h, 0),var(--pep-color-regular-s, 0%),98%);box-shadow:var(--pep-shadow-xs-offset, 0 .125rem .25rem 0) hsla(var(--pep-color-system-primary-h, 0),var(--pep-color-system-primary-s, 0%),var(--pep-color-system-primary-l, 10%),.08);border:1px solid hsl(var(--pep-color-regular-h, 0),var(--pep-color-regular-s, 0%),calc(var(--pep-color-regular-l, 10%) + 30%))}::ng-deep .mat-datetimepicker-content .mat-datetimepicker-calendar-content mat-datetimepicker-year-view .mat-datetimepicker-calendar-table .mat-datetimepicker-calendar-body .mat-datetimepicker-calendar-body-cell .mat-datetimepicker-calendar-body-cell-content.mat-datetimepicker-calendar-body-today:hover,::ng-deep .mat-datetimepicker-content .mat-datetimepicker-calendar-content mat-datetimepicker-month-view .mat-datetimepicker-calendar-table .mat-datetimepicker-calendar-body .mat-datetimepicker-calendar-body-cell .mat-datetimepicker-calendar-body-cell-content.mat-datetimepicker-calendar-body-today:hover{background:hsl(var(--pep-color-regular-h, 0),var(--pep-color-regular-s, 0%),98%);box-shadow:var(--pep-shadow-xs-offset, 0 .125rem .25rem 0) hsla(var(--pep-color-system-primary-h, 0),var(--pep-color-system-primary-s, 0%),var(--pep-color-system-primary-l, 10%),.16);border:1px solid hsl(var(--pep-color-regular-h, 0),var(--pep-color-regular-s, 0%),calc(var(--pep-color-regular-l, 10%) + 20%))}::ng-deep .mat-datetimepicker-content .mat-datetimepicker-calendar-content mat-datetimepicker-year-view .mat-datetimepicker-calendar-table .mat-datetimepicker-calendar-body .mat-datetimepicker-calendar-body-cell .mat-datetimepicker-calendar-body-cell-content.mat-datetimepicker-calendar-body-today:active,::ng-deep .mat-datetimepicker-content .mat-datetimepicker-calendar-content mat-datetimepicker-month-view .mat-datetimepicker-calendar-table .mat-datetimepicker-calendar-body .mat-datetimepicker-calendar-body-cell .mat-datetimepicker-calendar-body-cell-content.mat-datetimepicker-calendar-body-today:active{background:hsl(var(--pep-color-regular-h, 0),var(--pep-color-regular-s, 0%),88%);box-shadow:var(--pep-shadow-xs-offset, 0 .125rem .25rem 0) hsla(var(--pep-color-system-primary-h, 0),var(--pep-color-system-primary-s, 0%),var(--pep-color-system-primary-l, 10%),.16);border:1px solid hsl(var(--pep-color-regular-h, 0),var(--pep-color-regular-s, 0%),var(--pep-color-regular-l, 10%));box-shadow:0 0 0 var(--pep-spacing-xs, .25rem) hsla(var(--pep-color-text-link-h, 207),var(--pep-color-text-link-s, 76%),var(--pep-color-text-link-l, 37%),.5)}::ng-deep .mat-datetimepicker-content .mat-datetimepicker-calendar-content mat-datetimepicker-year-view .mat-datetimepicker-calendar-table .mat-datetimepicker-calendar-body .mat-datetimepicker-calendar-body-cell .mat-datetimepicker-calendar-body-cell-content.mat-datetimepicker-calendar-body-selected,::ng-deep .mat-datetimepicker-content .mat-datetimepicker-calendar-content mat-datetimepicker-month-view .mat-datetimepicker-calendar-table .mat-datetimepicker-calendar-body .mat-datetimepicker-calendar-body-cell .mat-datetimepicker-calendar-body-cell-content.mat-datetimepicker-calendar-body-selected{font-weight:var(--pep-font-weight-bold, 600);background:hsl(var(--pep-color-strong-h, 78),var(--pep-color-strong-s, 87%),var(--pep-color-strong-l, 27%));box-shadow:var(--pep-shadow-sm-offset, 0 .25rem .5rem 0) hsla(var(--pep-color-system-primary-h, 0),var(--pep-color-system-primary-s, 0%),var(--pep-color-system-primary-l, 10%),.08);color:hsl(var(--pep-color-system-primary-invert-h, 255),var(--pep-color-system-primary-invert-s, 100%),var(--pep-color-system-primary-invert-l, 100%))}::ng-deep .mat-datetimepicker-content .mat-datetimepicker-calendar-content mat-datetimepicker-year-view .mat-datetimepicker-calendar-table .mat-datetimepicker-calendar-body .mat-datetimepicker-calendar-body-cell .mat-datetimepicker-calendar-body-cell-content.mat-datetimepicker-calendar-body-selected .svg-icon,::ng-deep .mat-datetimepicker-content .mat-datetimepicker-calendar-content mat-datetimepicker-month-view .mat-datetimepicker-calendar-table .mat-datetimepicker-calendar-body .mat-datetimepicker-calendar-body-cell .mat-datetimepicker-calendar-body-cell-content.mat-datetimepicker-calendar-body-selected .svg-icon{fill:hsl(var(--pep-color-system-primary-invert-h, 255),var(--pep-color-system-primary-invert-s, 100%),var(--pep-color-system-primary-invert-l, 100%))}::ng-deep .mat-datetimepicker-content .mat-datetimepicker-calendar-content mat-datetimepicker-year-view .mat-datetimepicker-calendar-table .mat-datetimepicker-calendar-body .mat-datetimepicker-calendar-body-cell .mat-datetimepicker-calendar-body-cell-content.mat-datetimepicker-calendar-body-selected .svg-icon.stroke,::ng-deep .mat-datetimepicker-content .mat-datetimepicker-calendar-content mat-datetimepicker-month-view .mat-datetimepicker-calendar-table .mat-datetimepicker-calendar-body .mat-datetimepicker-calendar-body-cell .mat-datetimepicker-calendar-body-cell-content.mat-datetimepicker-calendar-body-selected .svg-icon.stroke{fill:unset;stroke:hsl(var(--pep-color-system-primary-invert-h, 255),var(--pep-color-system-primary-invert-s, 100%),var(--pep-color-system-primary-invert-l, 100%))}::ng-deep .mat-datetimepicker-content .mat-datetimepicker-calendar-content mat-datetimepicker-year-view .mat-datetimepicker-calendar-table .mat-datetimepicker-calendar-body .mat-datetimepicker-calendar-body-cell .mat-datetimepicker-calendar-body-cell-content.mat-datetimepicker-calendar-body-selected:hover,::ng-deep .mat-datetimepicker-content .mat-datetimepicker-calendar-content mat-datetimepicker-month-view .mat-datetimepicker-calendar-table .mat-datetimepicker-calendar-body .mat-datetimepicker-calendar-body-cell .mat-datetimepicker-calendar-body-cell-content.mat-datetimepicker-calendar-body-selected:hover{background:hsl(var(--pep-color-strong-h, 78),var(--pep-color-strong-s, 87%),calc(var(--pep-color-strong-l, 27%) - 8%));box-shadow:var(--pep-shadow-sm-offset, 0 .25rem .5rem 0) hsla(var(--pep-color-system-primary-h, 0),var(--pep-color-system-primary-s, 0%),var(--pep-color-system-primary-l, 10%),.16)}::ng-deep .mat-datetimepicker-content .mat-datetimepicker-calendar-content mat-datetimepicker-year-view .mat-datetimepicker-calendar-table .mat-datetimepicker-calendar-body .mat-datetimepicker-calendar-body-cell .mat-datetimepicker-calendar-body-cell-content.mat-datetimepicker-calendar-body-selected:active,::ng-deep .mat-datetimepicker-content .mat-datetimepicker-calendar-content mat-datetimepicker-month-view .mat-datetimepicker-calendar-table .mat-datetimepicker-calendar-body .mat-datetimepicker-calendar-body-cell .mat-datetimepicker-calendar-body-cell-content.mat-datetimepicker-calendar-body-selected:active{background:hsl(var(--pep-color-strong-h, 78),var(--pep-color-strong-s, 87%),calc(var(--pep-color-strong-l, 27%) - 15%));box-shadow:var(--pep-shadow-sm-offset, 0 .25rem .5rem 0) hsla(var(--pep-color-system-primary-h, 0),var(--pep-color-system-primary-s, 0%),var(--pep-color-system-primary-l, 10%),.08);box-shadow:0 0 0 var(--pep-spacing-xs, .25rem) hsla(var(--pep-color-text-link-h, 207),var(--pep-color-text-link-s, 76%),var(--pep-color-text-link-l, 37%),.5)}::ng-deep .mat-datetimepicker-content .mat-datetimepicker-calendar-content mat-datetimepicker-clock .mat-datetimepicker-clock{background:hsla(var(--pep-color-weak-h, 0),var(--pep-color-weak-s, 0%),var(--pep-color-weak-l, 10%),.12)}::ng-deep .mat-datetimepicker-content .mat-datetimepicker-calendar-content mat-datetimepicker-clock .mat-datetimepicker-clock .mat-datetimepicker-clock-center{font-weight:var(--pep-font-weight-bold, 600);background:hsl(var(--pep-color-strong-h, 78),var(--pep-color-strong-s, 87%),var(--pep-color-strong-l, 27%));box-shadow:var(--pep-shadow-sm-offset, 0 .25rem .5rem 0) hsla(var(--pep-color-system-primary-h, 0),var(--pep-color-system-primary-s, 0%),var(--pep-color-system-primary-l, 10%),.08);color:hsl(var(--pep-color-system-primary-invert-h, 255),var(--pep-color-system-primary-invert-s, 100%),var(--pep-color-system-primary-invert-l, 100%))}::ng-deep .mat-datetimepicker-content .mat-datetimepicker-calendar-content mat-datetimepicker-clock .mat-datetimepicker-clock .mat-datetimepicker-clock-center .svg-icon{fill:hsl(var(--pep-color-system-primary-invert-h, 255),var(--pep-color-system-primary-invert-s, 100%),var(--pep-color-system-primary-invert-l, 100%))}::ng-deep .mat-datetimepicker-content .mat-datetimepicker-calendar-content mat-datetimepicker-clock .mat-datetimepicker-clock .mat-datetimepicker-clock-center .svg-icon.stroke{fill:unset;stroke:hsl(var(--pep-color-system-primary-invert-h, 255),var(--pep-color-system-primary-invert-s, 100%),var(--pep-color-system-primary-invert-l, 100%))}::ng-deep .mat-datetimepicker-content .mat-datetimepicker-calendar-content mat-datetimepicker-clock .mat-datetimepicker-clock .mat-datetimepicker-clock-hand{font-weight:var(--pep-font-weight-bold, 600);background:hsl(var(--pep-color-strong-h, 78),var(--pep-color-strong-s, 87%),var(--pep-color-strong-l, 27%));box-shadow:var(--pep-shadow-sm-offset, 0 .25rem .5rem 0) hsla(var(--pep-color-system-primary-h, 0),var(--pep-color-system-primary-s, 0%),var(--pep-color-system-primary-l, 10%),.08);color:hsl(var(--pep-color-system-primary-invert-h, 255),var(--pep-color-system-primary-invert-s, 100%),var(--pep-color-system-primary-invert-l, 100%))}::ng-deep .mat-datetimepicker-content .mat-datetimepicker-calendar-content mat-datetimepicker-clock .mat-datetimepicker-clock .mat-datetimepicker-clock-hand .svg-icon{fill:hsl(var(--pep-color-system-primary-invert-h, 255),var(--pep-color-system-primary-invert-s, 100%),var(--pep-color-system-primary-invert-l, 100%))}::ng-deep .mat-datetimepicker-content .mat-datetimepicker-calendar-content mat-datetimepicker-clock .mat-datetimepicker-clock .mat-datetimepicker-clock-hand .svg-icon.stroke{fill:unset;stroke:hsl(var(--pep-color-system-primary-invert-h, 255),var(--pep-color-system-primary-invert-s, 100%),var(--pep-color-system-primary-invert-l, 100%))}::ng-deep .mat-datetimepicker-content .mat-datetimepicker-calendar-content mat-datetimepicker-clock .mat-datetimepicker-clock .mat-datetimepicker-clock-hand:before{font-weight:var(--pep-font-weight-bold, 600);background:hsl(var(--pep-color-strong-h, 78),var(--pep-color-strong-s, 87%),var(--pep-color-strong-l, 27%));box-shadow:var(--pep-shadow-sm-offset, 0 .25rem .5rem 0) hsla(var(--pep-color-system-primary-h, 0),var(--pep-color-system-primary-s, 0%),var(--pep-color-system-primary-l, 10%),.08);color:hsl(var(--pep-color-system-primary-invert-h, 255),var(--pep-color-system-primary-invert-s, 100%),var(--pep-color-system-primary-invert-l, 100%))}::ng-deep .mat-datetimepicker-content .mat-datetimepicker-calendar-content mat-datetimepicker-clock .mat-datetimepicker-clock .mat-datetimepicker-clock-hand:before .svg-icon{fill:hsl(var(--pep-color-system-primary-invert-h, 255),var(--pep-color-system-primary-invert-s, 100%),var(--pep-color-system-primary-invert-l, 100%))}::ng-deep .mat-datetimepicker-content .mat-datetimepicker-calendar-content mat-datetimepicker-clock .mat-datetimepicker-clock .mat-datetimepicker-clock-hand:before .svg-icon.stroke{fill:unset;stroke:hsl(var(--pep-color-system-primary-invert-h, 255),var(--pep-color-system-primary-invert-s, 100%),var(--pep-color-system-primary-invert-l, 100%))}::ng-deep .mat-datetimepicker-content .mat-datetimepicker-calendar-content mat-datetimepicker-clock .mat-datetimepicker-clock .mat-datetimepicker-clock-hours .mat-datetimepicker-clock-cell,::ng-deep .mat-datetimepicker-content .mat-datetimepicker-calendar-content mat-datetimepicker-clock .mat-datetimepicker-clock .mat-datetimepicker-clock-minutes .mat-datetimepicker-clock-cell{color:hsl(var(--pep-color-system-primary-h, 0),var(--pep-color-system-primary-s, 0%),var(--pep-color-system-primary-l, 10%))}::ng-deep .mat-datetimepicker-content .mat-datetimepicker-calendar-content mat-datetimepicker-clock .mat-datetimepicker-clock .mat-datetimepicker-clock-hours .mat-datetimepicker-clock-cell:hover,::ng-deep .mat-datetimepicker-content .mat-datetimepicker-calendar-content mat-datetimepicker-clock .mat-datetimepicker-clock .mat-datetimepicker-clock-minutes .mat-datetimepicker-clock-cell:hover{background:hsla(var(--pep-color-weak-h, 0),var(--pep-color-weak-s, 0%),var(--pep-color-weak-l, 10%),.16)}::ng-deep .mat-datetimepicker-content .mat-datetimepicker-calendar-content mat-datetimepicker-clock .mat-datetimepicker-clock .mat-datetimepicker-clock-hours .mat-datetimepicker-clock-cell.mat-datetimepicker-clock-cell-selected,::ng-deep .mat-datetimepicker-content .mat-datetimepicker-calendar-content mat-datetimepicker-clock .mat-datetimepicker-clock .mat-datetimepicker-clock-minutes .mat-datetimepicker-clock-cell.mat-datetimepicker-clock-cell-selected{font-weight:var(--pep-font-weight-bold, 600);background:hsl(var(--pep-color-strong-h, 78),var(--pep-color-strong-s, 87%),var(--pep-color-strong-l, 27%));box-shadow:var(--pep-shadow-sm-offset, 0 .25rem .5rem 0) hsla(var(--pep-color-system-primary-h, 0),var(--pep-color-system-primary-s, 0%),var(--pep-color-system-primary-l, 10%),.08);color:hsl(var(--pep-color-system-primary-invert-h, 255),var(--pep-color-system-primary-invert-s, 100%),var(--pep-color-system-primary-invert-l, 100%))}::ng-deep .mat-datetimepicker-content .mat-datetimepicker-calendar-content mat-datetimepicker-clock .mat-datetimepicker-clock .mat-datetimepicker-clock-hours .mat-datetimepicker-clock-cell.mat-datetimepicker-clock-cell-selected .svg-icon,::ng-deep .mat-datetimepicker-content .mat-datetimepicker-calendar-content mat-datetimepicker-clock .mat-datetimepicker-clock .mat-datetimepicker-clock-minutes .mat-datetimepicker-clock-cell.mat-datetimepicker-clock-cell-selected .svg-icon{fill:hsl(var(--pep-color-system-primary-invert-h, 255),var(--pep-color-system-primary-invert-s, 100%),var(--pep-color-system-primary-invert-l, 100%))}::ng-deep .mat-datetimepicker-content .mat-datetimepicker-calendar-content mat-datetimepicker-clock .mat-datetimepicker-clock .mat-datetimepicker-clock-hours .mat-datetimepicker-clock-cell.mat-datetimepicker-clock-cell-selected .svg-icon.stroke,::ng-deep .mat-datetimepicker-content .mat-datetimepicker-calendar-content mat-datetimepicker-clock .mat-datetimepicker-clock .mat-datetimepicker-clock-minutes .mat-datetimepicker-clock-cell.mat-datetimepicker-clock-cell-selected .svg-icon.stroke{fill:unset;stroke:hsl(var(--pep-color-system-primary-invert-h, 255),var(--pep-color-system-primary-invert-s, 100%),var(--pep-color-system-primary-invert-l, 100%))}::ng-deep .mat-datetimepicker-content .mat-datetimepicker-calendar-content mat-datetimepicker-clock .mat-datetimepicker-clock .mat-datetimepicker-clock-hours .mat-datetimepicker-clock-cell.mat-datetimepicker-clock-cell-selected:hover,::ng-deep .mat-datetimepicker-content .mat-datetimepicker-calendar-content mat-datetimepicker-clock .mat-datetimepicker-clock .mat-datetimepicker-clock-minutes .mat-datetimepicker-clock-cell.mat-datetimepicker-clock-cell-selected:hover{background:hsl(var(--pep-color-strong-h, 78),var(--pep-color-strong-s, 87%),calc(var(--pep-color-strong-l, 27%) - 8%));box-shadow:var(--pep-shadow-sm-offset, 0 .25rem .5rem 0) hsla(var(--pep-color-system-primary-h, 0),var(--pep-color-system-primary-s, 0%),var(--pep-color-system-primary-l, 10%),.16)}::ng-deep .mat-datetimepicker-content .mat-datetimepicker-calendar-content mat-datetimepicker-clock .mat-datetimepicker-clock .mat-datetimepicker-clock-hours .mat-datetimepicker-clock-cell.mat-datetimepicker-clock-cell-selected:active,::ng-deep .mat-datetimepicker-content .mat-datetimepicker-calendar-content mat-datetimepicker-clock .mat-datetimepicker-clock .mat-datetimepicker-clock-minutes .mat-datetimepicker-clock-cell.mat-datetimepicker-clock-cell-selected:active{background:hsl(var(--pep-color-strong-h, 78),var(--pep-color-strong-s, 87%),calc(var(--pep-color-strong-l, 27%) - 15%));box-shadow:var(--pep-shadow-sm-offset, 0 .25rem .5rem 0) hsla(var(--pep-color-system-primary-h, 0),var(--pep-color-system-primary-s, 0%),var(--pep-color-system-primary-l, 10%),.08);box-shadow:0 0 0 var(--pep-spacing-xs, .25rem) hsla(var(--pep-color-text-link-h, 207),var(--pep-color-text-link-s, 76%),var(--pep-color-text-link-l, 37%),.5)}\n"] }]
+        }], ctorParameters: function () { return [{ type: i1.DateAdapter }, { type: i0.ElementRef }, { type: i2.PepLayoutService }, { type: i2.PepUtilitiesService }, { type: i2.PepCustomizationService }, { type: i0.Renderer2 }]; }, propDecorators: { key: [{
+                type: Input
+            }], value: [{
+                type: Input
+            }], label: [{
+                type: Input
+            }], type: [{
+                type: Input
+            }], mandatory: [{
+                type: Input
+            }], disabled: [{
+                type: Input
+            }], readonly: [{
+                type: Input
+            }], textColor: [{
+                type: Input
+            }], xAlignment: [{
+                type: Input
+            }], rowSpan: [{
+                type: Input
+            }], visible: [{
+                type: Input
+            }], minValue: [{
+                type: Input
+            }], maxValue: [{
+                type: Input
+            }], minDateValue: [{
+                type: Input
+            }], maxDateValue: [{
+                type: Input
+            }], form: [{
+                type: Input
+            }], isActive: [{
+                type: Input
+            }], showTitle: [{
+                type: Input
+            }], renderTitle: [{
+                type: Input
+            }], renderError: [{
+                type: Input
+            }], renderSymbol: [{
+                type: Input
+            }], layoutType: [{
+                type: Input
+            }], valueChange: [{
+                type: Output
+            }], datetimePicker: [{
+                type: ViewChild,
+                args: ['datetimePicker']
+            }], input: [{
+                type: ViewChild,
+                args: ['input']
             }] } });
 
-class PepDateModule {
-    constructor(pepIconRegistry) {
-        this.pepIconRegistry = pepIconRegistry;
-        this.pepIconRegistry.registerIcons([pepIconSystemEdit]);
-    }
-}
-PepDateModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.0.2", ngImport: i0, type: PepDateModule, deps: [{ token: i1$1.PepIconRegistry }], target: i0.ɵɵFactoryTarget.NgModule });
-PepDateModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "14.0.2", ngImport: i0, type: PepDateModule, declarations: [PepDateComponent], imports: [CommonModule,
-        ReactiveFormsModule,
-        FormsModule,
-        // Material modules,
-        MatCommonModule,
-        MatButtonModule,
-        MatNativeDateModule,
-        MatDatepickerModule,
-        MatDatetimepickerModule,
-        MatNativeDatetimeModule,
-        MatFormFieldModule,
-        MatInputModule,
-        MatIconModule,
-        // ngx-lib modules
-        PepNgxLibModule,
-        PepIconModule,
-        PepFieldTitleModule,
-        PepTextboxIconModule], exports: [PepDateComponent] });
-PepDateModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "14.0.2", ngImport: i0, type: PepDateModule, imports: [CommonModule,
-        ReactiveFormsModule,
-        FormsModule,
-        // Material modules,
-        MatCommonModule,
-        MatButtonModule,
-        MatNativeDateModule,
-        MatDatepickerModule,
-        MatDatetimepickerModule,
-        MatNativeDatetimeModule,
-        MatFormFieldModule,
-        MatInputModule,
-        MatIconModule,
-        // ngx-lib modules
-        PepNgxLibModule,
-        PepIconModule,
-        PepFieldTitleModule,
-        PepTextboxIconModule] });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.0.2", ngImport: i0, type: PepDateModule, decorators: [{
-            type: NgModule,
-            args: [{
-                    imports: [
-                        CommonModule,
-                        ReactiveFormsModule,
-                        FormsModule,
-                        // Material modules,
-                        MatCommonModule,
-                        MatButtonModule,
-                        MatNativeDateModule,
-                        MatDatepickerModule,
-                        MatDatetimepickerModule,
-                        MatNativeDatetimeModule,
-                        MatFormFieldModule,
-                        MatInputModule,
-                        MatIconModule,
-                        // ngx-lib modules
-                        PepNgxLibModule,
-                        PepIconModule,
-                        PepFieldTitleModule,
-                        PepTextboxIconModule,
-                    ],
-                    exports: [PepDateComponent],
-                    declarations: [PepDateComponent],
-                }]
+class PepDateModule {
+    constructor(pepIconRegistry) {
+        this.pepIconRegistry = pepIconRegistry;
+        this.pepIconRegistry.registerIcons([pepIconSystemEdit]);
+    }
+}
+PepDateModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.0.2", ngImport: i0, type: PepDateModule, deps: [{ token: i1$1.PepIconRegistry }], target: i0.ɵɵFactoryTarget.NgModule });
+PepDateModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "14.0.2", ngImport: i0, type: PepDateModule, declarations: [PepDateComponent], imports: [CommonModule,
+        ReactiveFormsModule,
+        FormsModule,
+        // Material modules,
+        MatCommonModule,
+        MatButtonModule,
+        MatNativeDateModule,
+        MatDatepickerModule,
+        MatDatetimepickerModule,
+        MatNativeDatetimeModule,
+        MatFormFieldModule,
+        MatInputModule,
+        MatIconModule,
+        // ngx-lib modules
+        PepNgxLibModule,
+        PepIconModule,
+        PepFieldTitleModule,
+        PepTextboxIconModule], exports: [PepDateComponent] });
+PepDateModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "14.0.2", ngImport: i0, type: PepDateModule, imports: [CommonModule,
+        ReactiveFormsModule,
+        FormsModule,
+        // Material modules,
+        MatCommonModule,
+        MatButtonModule,
+        MatNativeDateModule,
+        MatDatepickerModule,
+        MatDatetimepickerModule,
+        MatNativeDatetimeModule,
+        MatFormFieldModule,
+        MatInputModule,
+        MatIconModule,
+        // ngx-lib modules
+        PepNgxLibModule,
+        PepIconModule,
+        PepFieldTitleModule,
+        PepTextboxIconModule] });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.0.2", ngImport: i0, type: PepDateModule, decorators: [{
+            type: NgModule,
+            args: [{
+                    imports: [
+                        CommonModule,
+                        ReactiveFormsModule,
+                        FormsModule,
+                        // Material modules,
+                        MatCommonModule,
+                        MatButtonModule,
+                        MatNativeDateModule,
+                        MatDatepickerModule,
+                        MatDatetimepickerModule,
+                        MatNativeDatetimeModule,
+                        MatFormFieldModule,
+                        MatInputModule,
+                        MatIconModule,
+                        // ngx-lib modules
+                        PepNgxLibModule,
+                        PepIconModule,
+                        PepFieldTitleModule,
+                        PepTextboxIconModule,
+                    ],
+                    exports: [PepDateComponent],
+                    declarations: [PepDateComponent],
+                }]
         }], ctorParameters: function () { return [{ type: i1$1.PepIconRegistry }]; } });
 
-/*
- * Public API Surface of ngx-lib/date
+/*
+ * Public API Surface of ngx-lib/date
  */
 
-/**
- * Generated bundle index. Do not edit.
+/**
+ * Generated bundle index. Do not edit.
  */
 
 export { PepDateComponent, PepDateModule, getCalture };