npm - mis-crystal-design-system - Versions diffs - 18.1.0-signal-test → 18.1.0-signal - Mend

mis-crystal-design-system 18.1.0-signal-test → 18.1.0-signal

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (114) hide show

package/esm2022/datepicker_v2/tz-dp-container/tz-dp-container.component.mjs CHANGED Viewed

@@ -861,11 +861,11 @@ export class TzDpContainerComponent {
             i0.ɵɵproperty("ngIf", ctx.data.dpConfig.enableTime === true);
             i0.ɵɵadvance();
             i0.ɵɵproperty("ngIf", ctx.data.dpConfig.showApplyButton || ctx.data.dpConfig.enableTime);
-        } }, dependencies: [i2.NgClass, i2.NgForOf, i2.NgIf, i3.NgSelectOption, i3.ɵNgSelectMultipleOption, i3.DefaultValueAccessor, i3.NumberValueAccessor, i3.SelectControlValueAccessor, i3.NgControlStatus, i3.MinValidator, i3.MaxValidator, i3.NgModel, i4.ButtonDirective, i5.CdkTrapFocus], styles: [".h1[_ngcontent-%COMP%]{font-size:40px;font-weight:400;letter-spacing:0px;line-height:48px}.h2[_ngcontent-%COMP%]{font-size:32px;font-weight:400;letter-spacing:0px;line-height:40px}.h3[_ngcontent-%COMP%]{font-size:28px;font-weight:400;letter-spacing:0px;line-height:36px}.h4[_ngcontent-%COMP%]{font-size:24px;font-weight:400;letter-spacing:0px;line-height:32px}.h5-b[_ngcontent-%COMP%]{font-size:20px;font-weight:700;letter-spacing:.25px;line-height:28px}.h5[_ngcontent-%COMP%]{font-size:20px;font-weight:400;letter-spacing:.15px;line-height:28px}.h6-b[_ngcontent-%COMP%]{font-size:16px;font-weight:700;letter-spacing:0px;line-height:24px}.h6[_ngcontent-%COMP%]{font-size:16px;font-weight:400;letter-spacing:0px;line-height:24px}.p[_ngcontent-%COMP%]{font-size:16px;font-weight:400;letter-spacing:0px;line-height:180%}.h7-b[_ngcontent-%COMP%]{font-size:14px;font-weight:700;letter-spacing:.25px;line-height:20px}.h7[_ngcontent-%COMP%], .datepicker-container[_ngcontent-%COMP%]   .datepicker-container__body[_ngcontent-%COMP%]   .month[_ngcontent-%COMP%], .datepicker-container[_ngcontent-%COMP%]   .datepicker-container__body[_ngcontent-%COMP%]   .year[_ngcontent-%COMP%]{font-size:14px;font-weight:400;letter-spacing:.2px;line-height:20px}.h8-b[_ngcontent-%COMP%]{font-size:12px;font-weight:700;letter-spacing:.25px;line-height:18px}.h8[_ngcontent-%COMP%]{font-size:12px;font-weight:400;letter-spacing:.2px;line-height:18px}.h9[_ngcontent-%COMP%]{font-size:10px;font-weight:400;letter-spacing:0px;line-height:15px}.btn-lg-b[_ngcontent-%COMP%]{font-size:16px;font-weight:700;letter-spacing:.5px;line-height:24px}.btn-lg[_ngcontent-%COMP%]{font-size:16px;font-weight:400;letter-spacing:.2px;line-height:24px}.btn-sm[_ngcontent-%COMP%]{font-size:14px;font-weight:400;letter-spacing:.25px;line-height:20px}.btn-link[_ngcontent-%COMP%]{font-size:16px;font-weight:400;letter-spacing:0px;line-height:24px}.display-1[_ngcontent-%COMP%]{font-size:48px;font-weight:400;letter-spacing:0px;line-height:56px}.display-2[_ngcontent-%COMP%]{font-size:14px;font-weight:400;letter-spacing:.5px;line-height:20px}[_ngcontent-%COMP%]:root{--pmry-200: #99BAF7;--pmry-100: #CBDDFB;--pmry-500: #0937B2;--pmry-400: #3C68D0;--pmry-600: #062A99;--pmry-700: #041F80;--pmry-300: #638FE7;--pmry-800: #021567;--pmry-900: #010F55;--sec-d-purple: #40447F;--sec-maroon: #6B034E;--sec-mud-red: #B23600;--sec-orange: #ED711C;--sec-purple: #815FD5;--sec-teal: #10ADAE;--sec-yellow: #D4900C;--sec-green: #547F40;--sec-bright-green: #27D22E;--sec-dark-teal: #035F6B;--sec-chocolate: #7C2F33;--sec-rube-pink: #C13D6D;--sec-cerulean: #0087B2;--sem-error: #B00020;--sem-info: #0091FF;--sem-warning: #FF9D00;--sem-success: #38AF49;--grey-bg-1: #FAFAFA;--grey-bg: #F5F5F5;--grey-seperators: #E0E0E0;--grey-disabled: #C8CDD3;--grey-hover: #F5F7FC;--grey-pressed: #E6EBF7;--grey-row: #F5F7FC;--dec-light-yellow: #F4E7C3;--dec-light-purple: #DACFF9;--dec-light-green: #E4F5E9;--dec-light-green2: #F1FFF3;--dec-light-pink: #FAE1EA;--dec-: #F4CBC1;--dec-lt-orange: #FAEFED;--dec-light-blue: #CFECF9;--dec-row-selection: #F1FDF8;--dec-row-selection2: #F2FBFF;--dec-row-lines: #D3E1E9;--text-white: #FFFFFF;--text-disabled: #929DAB;--text-muted: #6A737D;--text-black: #181F33;--MR-solid-blue2:#C8D5F6;--MR-solid-purple:#C9C3FB;--MR-solid-orange:#EEAC9F;--MR-solid-green:#ACDADA;--MR-solid-brown:#E8C8AF;--MR-solid-yellow:#FFEFC7;--MR-solid-blue:#BBE6FF;--MR-solid-pink:#FFC6F2;--tr-hover:#F0F3FA;--tr-pressed:#DAE1F3}.datepicker-container[_ngcontent-%COMP%]{background:#fff;border:1px solid #e0e0e0;box-shadow:0 12px 24px #0000001f,0 4px 8px #0000001f;border-radius:12px;display:flex;flex-direction:column;font-family:Lato;-webkit-user-select:none;user-select:none;box-sizing:border-box;width:290px}.datepicker-container[_ngcontent-%COMP%]   .datepicker-container__header[_ngcontent-%COMP%]{display:flex;height:32px;margin:16px;justify-content:space-between;align-items:center;width:258px}.datepicker-container[_ngcontent-%COMP%]   .datepicker-container__header[_ngcontent-%COMP%]   span[_ngcontent-%COMP%]{font-size:16px;font-style:normal;font-weight:700;line-height:24px;letter-spacing:.2px;text-align:center}.datepicker-container[_ngcontent-%COMP%]   .datepicker-container__header[_ngcontent-%COMP%]   .month-header[_ngcontent-%COMP%], .datepicker-container[_ngcontent-%COMP%]   .datepicker-container__header[_ngcontent-%COMP%]   .year-header[_ngcontent-%COMP%]{padding:8px;border-radius:10px}.datepicker-container[_ngcontent-%COMP%]   .datepicker-container__header[_ngcontent-%COMP%]   .month-header[_ngcontent-%COMP%]:hover, .datepicker-container[_ngcontent-%COMP%]   .datepicker-container__header[_ngcontent-%COMP%]   .year-header[_ngcontent-%COMP%]:hover{cursor:pointer;background-color:#e6ebf7}.datepicker-container[_ngcontent-%COMP%]   .datepicker-container__header[_ngcontent-%COMP%]   .datepicker-container__arrow__icon[_ngcontent-%COMP%]{height:20px;width:20px;display:flex;align-items:center;justify-content:center;border-radius:4px;padding:4px}.datepicker-container[_ngcontent-%COMP%]   .datepicker-container__header[_ngcontent-%COMP%]   .datepicker-container__arrow__icon.disabled-month[_ngcontent-%COMP%]{opacity:.5;cursor:not-allowed}.datepicker-container[_ngcontent-%COMP%]   .datepicker-container__header[_ngcontent-%COMP%]   .datepicker-container__arrow__icon[_ngcontent-%COMP%]:not(.disabled-month):hover{cursor:pointer;background-color:#cbddfb}.datepicker-container[_ngcontent-%COMP%]   .datepicker-container__header[_ngcontent-%COMP%]   .datepicker-container__arrow__icon[_ngcontent-%COMP%]:nth-child(1){transform:rotate(180deg)}.datepicker-container[_ngcontent-%COMP%]   .datepicker-container__body[_ngcontent-%COMP%]{width:258px;height:100%;margin:0 16px 16px}.datepicker-container[_ngcontent-%COMP%]   .datepicker-container__body[_ngcontent-%COMP%]   .row[_ngcontent-%COMP%]{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;margin-bottom:10px}.datepicker-container[_ngcontent-%COMP%]   .datepicker-container__body[_ngcontent-%COMP%]   .month[_ngcontent-%COMP%], .datepicker-container[_ngcontent-%COMP%]   .datepicker-container__body[_ngcontent-%COMP%]   .year[_ngcontent-%COMP%]{padding:10px 6px;cursor:pointer;border-radius:5px;text-align:center;background-color:#fff}.datepicker-container[_ngcontent-%COMP%]   .datepicker-container__body[_ngcontent-%COMP%]   .month[_ngcontent-%COMP%]:hover, .datepicker-container[_ngcontent-%COMP%]   .datepicker-container__body[_ngcontent-%COMP%]   .year[_ngcontent-%COMP%]:hover{background-color:#cbddfb}.datepicker-container[_ngcontent-%COMP%]   .datepicker-container__body[_ngcontent-%COMP%]   .disable-month[_ngcontent-%COMP%], .datepicker-container[_ngcontent-%COMP%]   .datepicker-container__body[_ngcontent-%COMP%]   .disable-year[_ngcontent-%COMP%]{cursor:default;color:#c8cdd3}.datepicker-container[_ngcontent-%COMP%]   .datepicker-container__body[_ngcontent-%COMP%]   .disable-month[_ngcontent-%COMP%]:hover, .datepicker-container[_ngcontent-%COMP%]   .datepicker-container__body[_ngcontent-%COMP%]   .disable-year[_ngcontent-%COMP%]:hover{background-color:transparent}.datepicker-container[_ngcontent-%COMP%]   .datepicker-container__body[_ngcontent-%COMP%]   .select-month[_ngcontent-%COMP%], .datepicker-container[_ngcontent-%COMP%]   .datepicker-container__body[_ngcontent-%COMP%]   .select-year[_ngcontent-%COMP%]{background-color:#0937b2;color:#fff}.datepicker-container[_ngcontent-%COMP%]   .datepicker-container__body[_ngcontent-%COMP%]   .select-month[_ngcontent-%COMP%]:hover, .datepicker-container[_ngcontent-%COMP%]   .datepicker-container__body[_ngcontent-%COMP%]   .select-year[_ngcontent-%COMP%]:hover{cursor:pointer;background-color:#cbddfb}.datepicker-container[_ngcontent-%COMP%]   .datepicker-container__body[_ngcontent-%COMP%]   .datepicker-container__weekdays[_ngcontent-%COMP%]{width:100%;display:flex;padding-bottom:10px}.datepicker-container[_ngcontent-%COMP%]   .datepicker-container__body[_ngcontent-%COMP%]   .datepicker-container__weekdays[_ngcontent-%COMP%]   .datepicker-container__weekday[_ngcontent-%COMP%]{width:36px;height:18px;text-align:center}.datepicker-container[_ngcontent-%COMP%]   .datepicker-container__body[_ngcontent-%COMP%]   .datepicker-container__weekdays[_ngcontent-%COMP%]   .datepicker-container__weekday[_ngcontent-%COMP%]   span[_ngcontent-%COMP%]{font-size:12px;font-style:normal;font-weight:400;line-height:18px;letter-spacing:.2px;text-align:center;color:#c7c7c7}.datepicker-container[_ngcontent-%COMP%]   .datepicker-container__body[_ngcontent-%COMP%]   .datepicker-container__weekdays[_ngcontent-%COMP%]   .datepicker-container__weekday[_ngcontent-%COMP%]   span.current-day[_ngcontent-%COMP%]{font-weight:700;letter-spacing:.25px;color:#181f33}.datepicker-container[_ngcontent-%COMP%]   .datepicker-container__body[_ngcontent-%COMP%]   .datepicker-container__days[_ngcontent-%COMP%]{display:flex;flex-wrap:wrap;gap:2px}.datepicker-container[_ngcontent-%COMP%]   .datepicker-container__body[_ngcontent-%COMP%]   .datepicker-container__days[_ngcontent-%COMP%]   .datepicker-container__day[_ngcontent-%COMP%]{width:34px;height:34px;display:flex;align-items:center;justify-content:center;border-radius:4px}.datepicker-container[_ngcontent-%COMP%]   .datepicker-container__body[_ngcontent-%COMP%]   .datepicker-container__days[_ngcontent-%COMP%]   .datepicker-container__day.selected-day[_ngcontent-%COMP%]{background-color:#0937b2;cursor:pointer}.datepicker-container[_ngcontent-%COMP%]   .datepicker-container__body[_ngcontent-%COMP%]   .datepicker-container__days[_ngcontent-%COMP%]   .datepicker-container__day.disabled-day[_ngcontent-%COMP%]{cursor:default}.datepicker-container[_ngcontent-%COMP%]   .datepicker-container__body[_ngcontent-%COMP%]   .datepicker-container__days[_ngcontent-%COMP%]   .datepicker-container__day.disabled-day[_ngcontent-%COMP%]:hover{background-color:transparent}.datepicker-container[_ngcontent-%COMP%]   .datepicker-container__body[_ngcontent-%COMP%]   .datepicker-container__days[_ngcontent-%COMP%]   .datepicker-container__day.is-valid-date[_ngcontent-%COMP%]:not(.disabled-day):not(.selected-day):hover{background-color:#cbddfb;cursor:pointer}.datepicker-container[_ngcontent-%COMP%]   .datepicker-container__body[_ngcontent-%COMP%]   .datepicker-container__days[_ngcontent-%COMP%]   .datepicker-container__day.is-valid-date[_ngcontent-%COMP%]:not(.disabled-day):not(.selected-day):hover   span.selected-day[_ngcontent-%COMP%]{color:#181f33!important}.datepicker-container[_ngcontent-%COMP%]   .datepicker-container__body[_ngcontent-%COMP%]   .datepicker-container__days[_ngcontent-%COMP%]   .datepicker-container__day[_ngcontent-%COMP%]   span[_ngcontent-%COMP%]{font-size:14px;font-style:normal;font-weight:400;line-height:20px;letter-spacing:.2px;text-align:center;color:#181f33}.datepicker-container[_ngcontent-%COMP%]   .datepicker-container__body[_ngcontent-%COMP%]   .datepicker-container__days[_ngcontent-%COMP%]   .datepicker-container__day[_ngcontent-%COMP%]   span.current-day[_ngcontent-%COMP%]{font-weight:700;letter-spacing:.25px}.datepicker-container[_ngcontent-%COMP%]   .datepicker-container__body[_ngcontent-%COMP%]   .datepicker-container__days[_ngcontent-%COMP%]   .datepicker-container__day[_ngcontent-%COMP%]   span.selected-day[_ngcontent-%COMP%]{color:#fff}.datepicker-container[_ngcontent-%COMP%]   .datepicker-container__body[_ngcontent-%COMP%]   .datepicker-container__days[_ngcontent-%COMP%]   .datepicker-container__day[_ngcontent-%COMP%]   span.disabled-day[_ngcontent-%COMP%]{color:#c7c7c7}.datepicker-container[_ngcontent-%COMP%]   .datepicker-container__time[_ngcontent-%COMP%]{border-top:1px solid #e0e0e0;padding:16px;margin:0 16px}.datepicker-container[_ngcontent-%COMP%]   .datepicker-container__time[_ngcontent-%COMP%]   .time-picker-header[_ngcontent-%COMP%]{margin-bottom:12px}.datepicker-container[_ngcontent-%COMP%]   .datepicker-container__time[_ngcontent-%COMP%]   .time-picker-header[_ngcontent-%COMP%]   span[_ngcontent-%COMP%]{font-size:14px;font-weight:600;color:#181f33}.datepicker-container[_ngcontent-%COMP%]   .datepicker-container__time[_ngcontent-%COMP%]   .time-picker-controls[_ngcontent-%COMP%]{display:flex;align-items:center;gap:8px}.datepicker-container[_ngcontent-%COMP%]   .datepicker-container__time[_ngcontent-%COMP%]   .time-picker-controls[_ngcontent-%COMP%]   .time-input-group[_ngcontent-%COMP%]{display:flex;flex-direction:column;gap:4px}.datepicker-container[_ngcontent-%COMP%]   .datepicker-container__time[_ngcontent-%COMP%]   .time-picker-controls[_ngcontent-%COMP%]   .time-input-group[_ngcontent-%COMP%]   label[_ngcontent-%COMP%]{font-size:12px;font-weight:500;color:#6a737d}.datepicker-container[_ngcontent-%COMP%]   .datepicker-container__time[_ngcontent-%COMP%]   .time-picker-controls[_ngcontent-%COMP%]   .time-input-group[_ngcontent-%COMP%]   .time-input[_ngcontent-%COMP%]{width:50px;height:32px;padding:4px 8px;border:1px solid #e0e0e0;border-radius:4px;font-size:14px;text-align:center}.datepicker-container[_ngcontent-%COMP%]   .datepicker-container__time[_ngcontent-%COMP%]   .time-picker-controls[_ngcontent-%COMP%]   .time-input-group[_ngcontent-%COMP%]   .time-input[_ngcontent-%COMP%]:focus{outline:none;border-color:#0937b2;box-shadow:0 0 0 2px #0937b21a}.datepicker-container[_ngcontent-%COMP%]   .datepicker-container__time[_ngcontent-%COMP%]   .time-picker-controls[_ngcontent-%COMP%]   .time-input-group[_ngcontent-%COMP%]   .time-input[_ngcontent-%COMP%]:invalid{border-color:#dc3545;background-color:#fff5f5}.datepicker-container[_ngcontent-%COMP%]   .datepicker-container__time[_ngcontent-%COMP%]   .time-picker-controls[_ngcontent-%COMP%]   .time-input-group[_ngcontent-%COMP%]   .time-input[_ngcontent-%COMP%]::-webkit-inner-spin-button, .datepicker-container[_ngcontent-%COMP%]   .datepicker-container__time[_ngcontent-%COMP%]   .time-picker-controls[_ngcontent-%COMP%]   .time-input-group[_ngcontent-%COMP%]   .time-input[_ngcontent-%COMP%]::-webkit-outer-spin-button{-webkit-appearance:none;margin:0}.datepicker-container[_ngcontent-%COMP%]   .datepicker-container__time[_ngcontent-%COMP%]   .time-picker-controls[_ngcontent-%COMP%]   .time-input-group[_ngcontent-%COMP%]   .time-input[type=number][_ngcontent-%COMP%]{-moz-appearance:textfield}.datepicker-container[_ngcontent-%COMP%]   .datepicker-container__time[_ngcontent-%COMP%]   .time-picker-controls[_ngcontent-%COMP%]   .time-separator[_ngcontent-%COMP%]{font-size:18px;font-weight:600;color:#181f33;margin-top:20px}.datepicker-container[_ngcontent-%COMP%]   .datepicker-container__time[_ngcontent-%COMP%]   .time-picker-controls[_ngcontent-%COMP%]   .am-pm-selector[_ngcontent-%COMP%]{display:flex;flex-direction:column;gap:4px}.datepicker-container[_ngcontent-%COMP%]   .datepicker-container__time[_ngcontent-%COMP%]   .time-picker-controls[_ngcontent-%COMP%]   .am-pm-selector[_ngcontent-%COMP%]   label[_ngcontent-%COMP%]{font-size:12px;font-weight:500;color:#6a737d}.datepicker-container[_ngcontent-%COMP%]   .datepicker-container__time[_ngcontent-%COMP%]   .time-picker-controls[_ngcontent-%COMP%]   .am-pm-selector[_ngcontent-%COMP%]   .am-pm-select[_ngcontent-%COMP%]{width:60px;height:42px;padding:4px 8px;border:1px solid #e0e0e0;border-radius:4px;font-size:14px;background-color:#fff}.datepicker-container[_ngcontent-%COMP%]   .datepicker-container__time[_ngcontent-%COMP%]   .time-picker-controls[_ngcontent-%COMP%]   .am-pm-selector[_ngcontent-%COMP%]   .am-pm-select[_ngcontent-%COMP%]:focus{outline:none;border-color:#0937b2;box-shadow:0 0 0 2px #0937b21a}.datepicker-container[_ngcontent-%COMP%]   .datepicker-container__footer[_ngcontent-%COMP%]{display:flex;justify-content:flex-end;gap:8px;bottom:0;align-items:center;position:sticky;padding:16px;border-top:1px solid #e0e0e0}.remove-box-shadow[_ngcontent-%COMP%]{box-shadow:none!important;border:none!important;border-radius:0!important}"] }); }
+        } }, dependencies: [i2.NgClass, i2.NgForOf, i2.NgIf, i3.NgSelectOption, i3.ɵNgSelectMultipleOption, i3.DefaultValueAccessor, i3.NumberValueAccessor, i3.SelectControlValueAccessor, i3.NgControlStatus, i3.MinValidator, i3.MaxValidator, i3.NgModel, i4.ButtonDirective, i5.CdkTrapFocus], styles: [".h1[_ngcontent-%COMP%]{font-size:40px;font-weight:400;letter-spacing:0px;line-height:48px}.h2[_ngcontent-%COMP%]{font-size:32px;font-weight:400;letter-spacing:0px;line-height:40px}.h3[_ngcontent-%COMP%]{font-size:28px;font-weight:400;letter-spacing:0px;line-height:36px}.h4[_ngcontent-%COMP%]{font-size:24px;font-weight:400;letter-spacing:0px;line-height:32px}.h5-b[_ngcontent-%COMP%]{font-size:20px;font-weight:700;letter-spacing:.25px;line-height:28px}.h5[_ngcontent-%COMP%]{font-size:20px;font-weight:400;letter-spacing:.15px;line-height:28px}.h6-b[_ngcontent-%COMP%]{font-size:16px;font-weight:700;letter-spacing:0px;line-height:24px}.h6[_ngcontent-%COMP%]{font-size:16px;font-weight:400;letter-spacing:0px;line-height:24px}.p[_ngcontent-%COMP%]{font-size:16px;font-weight:400;letter-spacing:0px;line-height:180%}.h7-b[_ngcontent-%COMP%]{font-size:14px;font-weight:700;letter-spacing:.25px;line-height:20px}.h7[_ngcontent-%COMP%], .datepicker-container[_ngcontent-%COMP%]   .datepicker-container__body[_ngcontent-%COMP%]   .month[_ngcontent-%COMP%], .datepicker-container[_ngcontent-%COMP%]   .datepicker-container__body[_ngcontent-%COMP%]   .year[_ngcontent-%COMP%]{font-size:14px;font-weight:400;letter-spacing:.2px;line-height:20px}.h8-b[_ngcontent-%COMP%]{font-size:12px;font-weight:700;letter-spacing:.25px;line-height:18px}.h8[_ngcontent-%COMP%]{font-size:12px;font-weight:400;letter-spacing:.2px;line-height:18px}.h9[_ngcontent-%COMP%]{font-size:10px;font-weight:400;letter-spacing:0px;line-height:15px}.btn-lg-b[_ngcontent-%COMP%]{font-size:16px;font-weight:700;letter-spacing:.5px;line-height:24px}.btn-lg[_ngcontent-%COMP%]{font-size:16px;font-weight:400;letter-spacing:.2px;line-height:24px}.btn-sm[_ngcontent-%COMP%]{font-size:14px;font-weight:400;letter-spacing:.25px;line-height:20px}.btn-link[_ngcontent-%COMP%]{font-size:16px;font-weight:400;letter-spacing:0px;line-height:24px}.display-1[_ngcontent-%COMP%]{font-size:48px;font-weight:400;letter-spacing:0px;line-height:56px}.display-2[_ngcontent-%COMP%]{font-size:14px;font-weight:400;letter-spacing:.5px;line-height:20px}[_ngcontent-%COMP%]:root{--pmry-200: #99BAF7;--pmry-100: #CBDDFB;--pmry-500: #0937B2;--pmry-400: #3C68D0;--pmry-600: #062A99;--pmry-700: #041F80;--pmry-300: #638FE7;--pmry-800: #021567;--pmry-900: #010F55;--sec-d-purple: #40447F;--sec-maroon: #6B034E;--sec-mud-red: #B23600;--sec-orange: #ED711C;--sec-purple: #815FD5;--sec-teal: #10ADAE;--sec-yellow: #D4900C;--sec-green: #547F40;--sec-bright-green: #27D22E;--sec-dark-teal: #035F6B;--sec-chocolate: #7C2F33;--sec-rube-pink: #C13D6D;--sec-cerulean: #0087B2;--sem-error: #B00020;--sem-info: #0091FF;--sem-warning: #FF9D00;--sem-success: #38AF49;--grey-bg-1: #FAFAFA;--grey-bg: #F5F5F5;--grey-seperators: #E0E0E0;--grey-disabled: #C8CDD3;--grey-hover: #F5F7FC;--grey-pressed: #E6EBF7;--grey-row: #F5F7FC;--dec-light-yellow: #F4E7C3;--dec-light-purple: #DACFF9;--dec-light-green: #E4F5E9;--dec-light-green2: #F1FFF3;--dec-light-pink: #FAE1EA;--dec-: #F4CBC1;--dec-lt-orange: #FAEFED;--dec-light-blue: #CFECF9;--dec-row-selection: #F1FDF8;--dec-row-selection2: #F2FBFF;--dec-row-lines: #D3E1E9;--text-white: #FFFFFF;--text-muted: #6A737D;--text-black: #181F33;--MR-solid-blue2:#C8D5F6;--MR-solid-purple:#C9C3FB;--MR-solid-orange:#EEAC9F;--MR-solid-green:#ACDADA;--MR-solid-brown:#E8C8AF;--MR-solid-yellow:#FFEFC7;--MR-solid-blue:#BBE6FF;--MR-solid-pink:#FFC6F2;--tr-hover:#F0F3FA;--tr-pressed:#DAE1F3;--brand-primary: #0937B2;--brand-primary-light: #3C68D0;--brand-primary-dark: #062A99;--brand-primary-darker: #041F80;--brand-primary-lighter: #638FE7;--brand-primary-lightest: #CBDDFB;--brand-primary-hover: #F0F3FA;--brand-primary-active: #DAE1F3;--brand-secondary: #ED711C;--brand-secondary-light: #F09E65;--brand-secondary-dark: #B23600;--brand-secondary-lighter: #FFC6F2;--brand-accent: #10ADAE;--brand-accent-light: #16CBBC;--brand-accent-dark: #035F6B;--brand-accent-lighter: #ACDADA;--brand-success: #38AF49;--brand-success-light: #4CAF50;--brand-success-dark: #216531;--brand-success-lighter: #E4F5E9;--brand-success-lightest: #F1FFF3;--brand-error: #B00020;--brand-error-light: #F04E4E;--brand-error-dark: #A60060;--brand-error-lighter: #FAE1EA;--brand-error-lightest: #FDF2F2;--brand-warning: #FF9D00;--brand-warning-light: #D4900C;--brand-warning-dark: #624000;--brand-warning-lighter: #F4E7C3;--brand-warning-lightest: #FAEFED;--brand-info: #0091FF;--brand-info-light: #35A1FF;--brand-info-dark: #0087B2;--brand-info-lighter: #CFECF9;--text-primary: #181F33;--text-secondary: #6A737D;--text-tertiary: #929DAB;--text-disabled: #929DAB;--text-primary-87: rgba(24, 31, 51, .87);--text-primary-60: rgba(24, 31, 51, .6);--text-primary-38: rgba(24, 31, 51, .38);--text-primary-12: rgba(24, 31, 51, .12);--bg-primary: #FFFFFF;--bg-secondary: #FAFAFA;--bg-tertiary: #F5F5F5;--bg-overlay: rgba(0, 0, 0, .32);--bg-overlay-light: rgba(0, 0, 0, .12);--bg-overlay-lighter: rgba(0, 0, 0, .08);--bg-overlay-lightest: rgba(0, 0, 0, .04);--border-primary: #E0E0E0;--border-secondary: #D6DCE2;--border-tertiary: #C8CDD3;--border-light: #F1F4F8;--border-primary-12: rgba(0, 0, 0, .12);--border-primary-08: rgba(0, 0, 0, .08);--border-primary-06: rgba(0, 0, 0, .06);--shadow-primary: rgba(0, 0, 0, .12);--shadow-secondary: rgba(0, 0, 0, .08);--shadow-tertiary: rgba(0, 0, 0, .04);--shadow-light: rgba(0, 0, 0, .06);--status-available: #929DAB;--status-unavailable: #CCD3DA;--status-hotseat: #857BFF;--status-multiteam: #10ADAE;--status-selected: #10ADAE;--status-upcoming: #D4900C;--status-room: #38AF49;--status-room-booked: #B23600;--status-room-unavailable: #181F33;--team-color-1: #F8C52E;--team-color-2: #FA8E20;--team-color-3: #987CDD;--team-color-4: #16CBBC;--team-color-5: #E65010;--team-color-6: #A60060;--team-color-7: #ED323B;--team-color-8: #35A1FF;--team-color-9: #80D348}.datepicker-container[_ngcontent-%COMP%]{background:var(--bg-primary, #FFFFFF);border:1px solid var(--border-primary, #E0E0E0);box-shadow:0 12px 24px #0000001f,0 4px 8px #0000001f;border-radius:12px;display:flex;flex-direction:column;font-family:Lato;-webkit-user-select:none;user-select:none;box-sizing:border-box;width:290px}.datepicker-container[_ngcontent-%COMP%]   .datepicker-container__header[_ngcontent-%COMP%]{display:flex;height:32px;margin:16px;justify-content:space-between;align-items:center;width:258px}.datepicker-container[_ngcontent-%COMP%]   .datepicker-container__header[_ngcontent-%COMP%]   span[_ngcontent-%COMP%]{font-size:16px;font-style:normal;font-weight:700;line-height:24px;letter-spacing:.2px;text-align:center}.datepicker-container[_ngcontent-%COMP%]   .datepicker-container__header[_ngcontent-%COMP%]   .month-header[_ngcontent-%COMP%], .datepicker-container[_ngcontent-%COMP%]   .datepicker-container__header[_ngcontent-%COMP%]   .year-header[_ngcontent-%COMP%]{padding:8px;border-radius:10px}.datepicker-container[_ngcontent-%COMP%]   .datepicker-container__header[_ngcontent-%COMP%]   .month-header[_ngcontent-%COMP%]:hover, .datepicker-container[_ngcontent-%COMP%]   .datepicker-container__header[_ngcontent-%COMP%]   .year-header[_ngcontent-%COMP%]:hover{cursor:pointer;background-color:var(--brand-primary-active, #DAE1F3)}.datepicker-container[_ngcontent-%COMP%]   .datepicker-container__header[_ngcontent-%COMP%]   .datepicker-container__arrow__icon[_ngcontent-%COMP%]{height:20px;width:20px;display:flex;align-items:center;justify-content:center;border-radius:4px;padding:4px}.datepicker-container[_ngcontent-%COMP%]   .datepicker-container__header[_ngcontent-%COMP%]   .datepicker-container__arrow__icon.disabled-month[_ngcontent-%COMP%]{opacity:.5;cursor:not-allowed}.datepicker-container[_ngcontent-%COMP%]   .datepicker-container__header[_ngcontent-%COMP%]   .datepicker-container__arrow__icon[_ngcontent-%COMP%]:not(.disabled-month):hover{cursor:pointer;background-color:var(--brand-primary-lightest, #CBDDFB)}.datepicker-container[_ngcontent-%COMP%]   .datepicker-container__header[_ngcontent-%COMP%]   .datepicker-container__arrow__icon[_ngcontent-%COMP%]:nth-child(1){transform:rotate(180deg)}.datepicker-container[_ngcontent-%COMP%]   .datepicker-container__body[_ngcontent-%COMP%]{width:258px;height:100%;margin:0 16px 16px}.datepicker-container[_ngcontent-%COMP%]   .datepicker-container__body[_ngcontent-%COMP%]   .row[_ngcontent-%COMP%]{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;margin-bottom:10px}.datepicker-container[_ngcontent-%COMP%]   .datepicker-container__body[_ngcontent-%COMP%]   .month[_ngcontent-%COMP%], .datepicker-container[_ngcontent-%COMP%]   .datepicker-container__body[_ngcontent-%COMP%]   .year[_ngcontent-%COMP%]{padding:10px 6px;cursor:pointer;border-radius:5px;text-align:center;background-color:var(--bg-primary, #FFFFFF)}.datepicker-container[_ngcontent-%COMP%]   .datepicker-container__body[_ngcontent-%COMP%]   .month[_ngcontent-%COMP%]:hover, .datepicker-container[_ngcontent-%COMP%]   .datepicker-container__body[_ngcontent-%COMP%]   .year[_ngcontent-%COMP%]:hover{background-color:var(--brand-primary-lightest, #CBDDFB)}.datepicker-container[_ngcontent-%COMP%]   .datepicker-container__body[_ngcontent-%COMP%]   .disable-month[_ngcontent-%COMP%], .datepicker-container[_ngcontent-%COMP%]   .datepicker-container__body[_ngcontent-%COMP%]   .disable-year[_ngcontent-%COMP%]{cursor:default;color:var(--text-disabled, #C8CDD3)}.datepicker-container[_ngcontent-%COMP%]   .datepicker-container__body[_ngcontent-%COMP%]   .disable-month[_ngcontent-%COMP%]:hover, .datepicker-container[_ngcontent-%COMP%]   .datepicker-container__body[_ngcontent-%COMP%]   .disable-year[_ngcontent-%COMP%]:hover{background-color:transparent}.datepicker-container[_ngcontent-%COMP%]   .datepicker-container__body[_ngcontent-%COMP%]   .select-month[_ngcontent-%COMP%], .datepicker-container[_ngcontent-%COMP%]   .datepicker-container__body[_ngcontent-%COMP%]   .select-year[_ngcontent-%COMP%]{background-color:var(--brand-primary, #0937B2);color:var(--bg-primary, #FFFFFF)}.datepicker-container[_ngcontent-%COMP%]   .datepicker-container__body[_ngcontent-%COMP%]   .select-month[_ngcontent-%COMP%]:hover, .datepicker-container[_ngcontent-%COMP%]   .datepicker-container__body[_ngcontent-%COMP%]   .select-year[_ngcontent-%COMP%]:hover{cursor:pointer;background-color:var(--brand-primary-lightest, #CBDDFB)}.datepicker-container[_ngcontent-%COMP%]   .datepicker-container__body[_ngcontent-%COMP%]   .datepicker-container__weekdays[_ngcontent-%COMP%]{width:100%;display:flex;padding-bottom:10px}.datepicker-container[_ngcontent-%COMP%]   .datepicker-container__body[_ngcontent-%COMP%]   .datepicker-container__weekdays[_ngcontent-%COMP%]   .datepicker-container__weekday[_ngcontent-%COMP%]{width:36px;height:18px;text-align:center}.datepicker-container[_ngcontent-%COMP%]   .datepicker-container__body[_ngcontent-%COMP%]   .datepicker-container__weekdays[_ngcontent-%COMP%]   .datepicker-container__weekday[_ngcontent-%COMP%]   span[_ngcontent-%COMP%]{font-size:12px;font-style:normal;font-weight:400;line-height:18px;letter-spacing:.2px;text-align:center;color:var(--text-disabled, #C8CDD3)}.datepicker-container[_ngcontent-%COMP%]   .datepicker-container__body[_ngcontent-%COMP%]   .datepicker-container__weekdays[_ngcontent-%COMP%]   .datepicker-container__weekday[_ngcontent-%COMP%]   span.current-day[_ngcontent-%COMP%]{font-weight:700;letter-spacing:.25px;color:var(--text-primary, #181F33)}.datepicker-container[_ngcontent-%COMP%]   .datepicker-container__body[_ngcontent-%COMP%]   .datepicker-container__days[_ngcontent-%COMP%]{display:flex;flex-wrap:wrap;gap:2px}.datepicker-container[_ngcontent-%COMP%]   .datepicker-container__body[_ngcontent-%COMP%]   .datepicker-container__days[_ngcontent-%COMP%]   .datepicker-container__day[_ngcontent-%COMP%]{width:34px;height:34px;display:flex;align-items:center;justify-content:center;border-radius:4px}.datepicker-container[_ngcontent-%COMP%]   .datepicker-container__body[_ngcontent-%COMP%]   .datepicker-container__days[_ngcontent-%COMP%]   .datepicker-container__day.selected-day[_ngcontent-%COMP%]{background-color:var(--brand-primary, #0937B2);cursor:pointer}.datepicker-container[_ngcontent-%COMP%]   .datepicker-container__body[_ngcontent-%COMP%]   .datepicker-container__days[_ngcontent-%COMP%]   .datepicker-container__day.disabled-day[_ngcontent-%COMP%]{cursor:default}.datepicker-container[_ngcontent-%COMP%]   .datepicker-container__body[_ngcontent-%COMP%]   .datepicker-container__days[_ngcontent-%COMP%]   .datepicker-container__day.disabled-day[_ngcontent-%COMP%]:hover{background-color:transparent}.datepicker-container[_ngcontent-%COMP%]   .datepicker-container__body[_ngcontent-%COMP%]   .datepicker-container__days[_ngcontent-%COMP%]   .datepicker-container__day.is-valid-date[_ngcontent-%COMP%]:not(.disabled-day):not(.selected-day):hover{background-color:var(--brand-primary-lightest, #CBDDFB);cursor:pointer}.datepicker-container[_ngcontent-%COMP%]   .datepicker-container__body[_ngcontent-%COMP%]   .datepicker-container__days[_ngcontent-%COMP%]   .datepicker-container__day.is-valid-date[_ngcontent-%COMP%]:not(.disabled-day):not(.selected-day):hover   span.selected-day[_ngcontent-%COMP%]{color:var(--text-primary, #181F33)!important}.datepicker-container[_ngcontent-%COMP%]   .datepicker-container__body[_ngcontent-%COMP%]   .datepicker-container__days[_ngcontent-%COMP%]   .datepicker-container__day[_ngcontent-%COMP%]   span[_ngcontent-%COMP%]{font-size:14px;font-style:normal;font-weight:400;line-height:20px;letter-spacing:.2px;text-align:center;color:var(--text-primary, #181F33)}.datepicker-container[_ngcontent-%COMP%]   .datepicker-container__body[_ngcontent-%COMP%]   .datepicker-container__days[_ngcontent-%COMP%]   .datepicker-container__day[_ngcontent-%COMP%]   span.current-day[_ngcontent-%COMP%]{font-weight:700;letter-spacing:.25px}.datepicker-container[_ngcontent-%COMP%]   .datepicker-container__body[_ngcontent-%COMP%]   .datepicker-container__days[_ngcontent-%COMP%]   .datepicker-container__day[_ngcontent-%COMP%]   span.selected-day[_ngcontent-%COMP%]{color:var(--bg-primary, #FFFFFF)}.datepicker-container[_ngcontent-%COMP%]   .datepicker-container__body[_ngcontent-%COMP%]   .datepicker-container__days[_ngcontent-%COMP%]   .datepicker-container__day[_ngcontent-%COMP%]   span.disabled-day[_ngcontent-%COMP%]{color:var(--text-disabled, #C8CDD3)}.datepicker-container[_ngcontent-%COMP%]   .datepicker-container__time[_ngcontent-%COMP%]{border-top:1px solid var(--border-primary, #E0E0E0);padding:16px;margin:0 16px}.datepicker-container[_ngcontent-%COMP%]   .datepicker-container__time[_ngcontent-%COMP%]   .time-picker-header[_ngcontent-%COMP%]{margin-bottom:12px}.datepicker-container[_ngcontent-%COMP%]   .datepicker-container__time[_ngcontent-%COMP%]   .time-picker-header[_ngcontent-%COMP%]   span[_ngcontent-%COMP%]{font-size:14px;font-weight:600;color:var(--text-primary, #181F33)}.datepicker-container[_ngcontent-%COMP%]   .datepicker-container__time[_ngcontent-%COMP%]   .time-picker-controls[_ngcontent-%COMP%]{display:flex;align-items:center;gap:8px}.datepicker-container[_ngcontent-%COMP%]   .datepicker-container__time[_ngcontent-%COMP%]   .time-picker-controls[_ngcontent-%COMP%]   .time-input-group[_ngcontent-%COMP%]{display:flex;flex-direction:column;gap:4px}.datepicker-container[_ngcontent-%COMP%]   .datepicker-container__time[_ngcontent-%COMP%]   .time-picker-controls[_ngcontent-%COMP%]   .time-input-group[_ngcontent-%COMP%]   label[_ngcontent-%COMP%]{font-size:12px;font-weight:500;color:var(--text-secondary, #6A737D)}.datepicker-container[_ngcontent-%COMP%]   .datepicker-container__time[_ngcontent-%COMP%]   .time-picker-controls[_ngcontent-%COMP%]   .time-input-group[_ngcontent-%COMP%]   .time-input[_ngcontent-%COMP%]{width:50px;height:32px;padding:4px 8px;border:1px solid var(--border-primary, #E0E0E0);border-radius:4px;font-size:14px;text-align:center}.datepicker-container[_ngcontent-%COMP%]   .datepicker-container__time[_ngcontent-%COMP%]   .time-picker-controls[_ngcontent-%COMP%]   .time-input-group[_ngcontent-%COMP%]   .time-input[_ngcontent-%COMP%]:focus{outline:none;border-color:var(--brand-primary, #0937B2);box-shadow:0 0 0 2px #0937b21a}.datepicker-container[_ngcontent-%COMP%]   .datepicker-container__time[_ngcontent-%COMP%]   .time-picker-controls[_ngcontent-%COMP%]   .time-input-group[_ngcontent-%COMP%]   .time-input[_ngcontent-%COMP%]:invalid{border-color:#dc3545;background-color:#fff5f5}.datepicker-container[_ngcontent-%COMP%]   .datepicker-container__time[_ngcontent-%COMP%]   .time-picker-controls[_ngcontent-%COMP%]   .time-input-group[_ngcontent-%COMP%]   .time-input[_ngcontent-%COMP%]::-webkit-inner-spin-button, .datepicker-container[_ngcontent-%COMP%]   .datepicker-container__time[_ngcontent-%COMP%]   .time-picker-controls[_ngcontent-%COMP%]   .time-input-group[_ngcontent-%COMP%]   .time-input[_ngcontent-%COMP%]::-webkit-outer-spin-button{-webkit-appearance:none;margin:0}.datepicker-container[_ngcontent-%COMP%]   .datepicker-container__time[_ngcontent-%COMP%]   .time-picker-controls[_ngcontent-%COMP%]   .time-input-group[_ngcontent-%COMP%]   .time-input[type=number][_ngcontent-%COMP%]{-moz-appearance:textfield}.datepicker-container[_ngcontent-%COMP%]   .datepicker-container__time[_ngcontent-%COMP%]   .time-picker-controls[_ngcontent-%COMP%]   .time-separator[_ngcontent-%COMP%]{font-size:18px;font-weight:600;color:var(--text-primary, #181F33);margin-top:20px}.datepicker-container[_ngcontent-%COMP%]   .datepicker-container__time[_ngcontent-%COMP%]   .time-picker-controls[_ngcontent-%COMP%]   .am-pm-selector[_ngcontent-%COMP%]{display:flex;flex-direction:column;gap:4px}.datepicker-container[_ngcontent-%COMP%]   .datepicker-container__time[_ngcontent-%COMP%]   .time-picker-controls[_ngcontent-%COMP%]   .am-pm-selector[_ngcontent-%COMP%]   label[_ngcontent-%COMP%]{font-size:12px;font-weight:500;color:var(--text-secondary, #6A737D)}.datepicker-container[_ngcontent-%COMP%]   .datepicker-container__time[_ngcontent-%COMP%]   .time-picker-controls[_ngcontent-%COMP%]   .am-pm-selector[_ngcontent-%COMP%]   .am-pm-select[_ngcontent-%COMP%]{width:60px;height:42px;padding:4px 8px;border:1px solid var(--border-primary, #E0E0E0);border-radius:4px;font-size:14px;background-color:#fff}.datepicker-container[_ngcontent-%COMP%]   .datepicker-container__time[_ngcontent-%COMP%]   .time-picker-controls[_ngcontent-%COMP%]   .am-pm-selector[_ngcontent-%COMP%]   .am-pm-select[_ngcontent-%COMP%]:focus{outline:none;border-color:var(--brand-primary, #0937B2);box-shadow:0 0 0 2px #0937b21a}.datepicker-container[_ngcontent-%COMP%]   .datepicker-container__footer[_ngcontent-%COMP%]{display:flex;justify-content:flex-end;gap:8px;bottom:0;align-items:center;position:sticky;padding:16px;border-top:1px solid var(--border-primary, #E0E0E0)}.remove-box-shadow[_ngcontent-%COMP%]{box-shadow:none!important;border:none!important;border-radius:0!important}"] }); }
 }
 (() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(TzDpContainerComponent, [{
         type: Component,
-        args: [{ selector: "mis-tz-dp", template: "<div class=\"datepicker-container\" [ngClass]=\"data.disableBoxShadow?'remove-box-shadow':''\" aria-label=\"date picker\" cdkTrapFocus [cdkTrapFocusAutoCapture]=\"true\">\n  <div tabindex=\"-1\" cdkFocusInitial></div>\n  <div class=\"datepicker-container__header\">\n    <div\n      class=\"datepicker-container__arrow__icon\"\n      (click)=\"navigateView('PREVIOUS')\"\n      tabindex=\"0\"\n      aria-label=\"Previous Month\"\n      (keyup.enter)=\"navigateView('PREVIOUS')\"\n      [ngClass]=\"{\n        'disabled-month': isPreviousMonthDisabled() || isSelectingMonth()\n      }\"\n    >\n      <svg width=\"20\" height=\"16\" viewBox=\"0 0 20 16\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n        <path\n          d=\"M19.7071 8.70711C20.0976 8.31658 20.0976 7.68342 19.7071 7.29289L13.3431 0.928933C12.9526 0.538409 12.3195 0.538409 11.9289 0.928933C11.5384 1.31946 11.5384 1.95262 11.9289 2.34315L17.5858 8L11.9289 13.6569C11.5384 14.0474 11.5384 14.6805 11.9289 15.0711C12.3195 15.4616 12.9526 15.4616 13.3431 15.0711L19.7071 8.70711ZM-8.74228e-08 9L19 9L19 7L8.74228e-08 7L-8.74228e-08 9Z\"\n          fill=\"#181F33\"\n        ></path>\n      </svg>\n    </div>\n\n    <div *ngIf=\"!isSelectingYear()\" (click)=\"toggleMonthSelector()\" class=\"month-header\">\n      {{ isYearSelectionFlow() ? selectedYear() : availableMonths()[currentMonthNumber()] }}\n    </div>\n    <div *ngIf=\"!isSelectingMonth()\" (click)=\"toggleYearSelector()\" class=\"year-header\">\n      {{ isSelectingYear() ? yearRange : currentYearNumber() }}\n    </div>\n\n\n    <div\n      class=\"datepicker-container__arrow__icon\"\n      (click)=\"navigateView('NEXT')\"\n      tabindex=\"0\"\n      aria-label=\"Next Month\"\n      (keyup.enter)=\"navigateView('NEXT')\"\n      [ngClass]=\"{\n        'disabled-month': isNextMonthDisabled() || isSelectingMonth()\n      }\"\n    >\n      <svg width=\"20\" height=\"16\" viewBox=\"0 0 20 16\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n        <path\n          d=\"M19.7071 8.70711C20.0976 8.31658 20.0976 7.68342 19.7071 7.29289L13.3431 0.928933C12.9526 0.538409 12.3195 0.538409 11.9289 0.928933C11.5384 1.31946 11.5384 1.95262 11.9289 2.34315L17.5858 8L11.9289 13.6569C11.5384 14.0474 11.5384 14.6805 11.9289 15.0711C12.3195 15.4616 12.9526 15.4616 13.3431 15.0711L19.7071 8.70711ZM-8.74228e-08 9L19 9L19 7L8.74228e-08 7L-8.74228e-08 9Z\"\n          fill=\"#181F33\"\n        ></path>\n      </svg>\n    </div>\n  </div>\n  <div class=\"datepicker-container__body\">\n\n    <div *ngIf=\"isSelectingMonth() && !isSelectingYear()\" class=\"month-selector\">\n      <div class=\"row\">\n        <div *ngFor=\"let month of availableMonths(); let i = index\" \n            class=\"month\" \n            (click)=\"!disabledMonths()[i] && selectMonth(month)\" \n            [ngClass]=\"{\n              'disable-month': disabledMonths()[i],\n              'select-month': !disabledMonths()[currentMonthNumber()] && month === availableMonths()[currentMonthNumber()]\n            }\">\n          {{ month }}\n        </div>\n      </div>\n    </div>\n  \n    <div *ngIf=\"isSelectingYear() && !isSelectingMonth()\" class=\"year-selector\">\n      <div class=\"row\">\n        <div *ngFor=\"let year of availableYears(); let i = index\" \n            class=\"year\" \n            (click)=\"!disabledYears()[i] && selectYear(year)\" \n            [ngClass]=\"{\n              'disable-year': disabledYears()[i],\n              'select-year': year === currentYearNumber()\n            }\">\n          {{ year }}\n        </div>\n      </div>\n    </div>\n\n    <div *ngIf=\"!isSelectingMonth() && !isSelectingYear()\" class=\"datepicker-container__weekdays\">\n      <div class=\"datepicker-container__weekday\" *ngFor=\"let weekDay of weekDays()\">\n        <span [ngClass]=\"{ 'current-day': weekDay.isCurrentDay }\">{{ weekDay.label }}</span>\n      </div>\n    </div>\n    <div *ngIf=\"!isSelectingMonth() && !isSelectingYear()\" class=\"datepicker-container__days\">\n      <div\n        class=\"datepicker-container__day\"\n        [ngClass]=\"{\n          'selected-day': day.isSelectedDay,\n          'disabled-day': day.isDisabledDay,\n          'is-valid-date': day.date > 0 && !day.isSelectedDay\n        }\"\n        *ngFor=\"let day of currentMonthDates()\"\n        (click)=\"selectDay(day)\"\n        (keyup.enter)=\"selectDay(day)\"\n      >\n        <span\n          *ngIf=\"day.date > 0\"\n          [tabindex]=\"day.isDisabledDay ? -1 : 0\"\n          [ngClass]=\"{\n            'current-day': day.isCurrentDay,\n            'selected-day': day.isSelectedDay,\n            'disabled-day': day.isDisabledDay\n          }\"\n          [attr.aria-label]=\"retractDayMonth(day.date, currentMonth(), currentYearNumber())\"\n        >\n          {{ day.date }}\n        </span>\n      </div>\n    </div>\n  </div>\n\n  <!-- Time Picker Section -->\n  <div class=\"datepicker-container__time\" *ngIf=\"data.dpConfig.enableTime === true\">\n    <div class=\"time-picker-header\">\n      <span>Time</span>\n    </div>\n    <div class=\"time-picker-controls\">\n      <div class=\"time-input-group\">\n        <label for=\"hourInput\">Hour</label>\n        <input \n          id=\"hourInput\"\n          type=\"number\" \n          [min]=\"is12HourFormat() ? 1 : 0\"\n          [max]=\"is12HourFormat() ? 12 : 23\"\n          [step]=\"1\"\n          [ngModel]=\"selectedHour()\"\n          (ngModelChange)=\"selectedHourSignal.set($event)\"\n          (input)=\"onHourInput($event)\"\n          (blur)=\"validateHourInput()\"\n          class=\"time-input\"\n          [title]=\"is12HourFormat() ? 'Enter hour (1-12)' : 'Enter hour (0-23)'\">\n      </div>\n      <div class=\"time-separator\">:</div>\n      <div class=\"time-input-group\">\n        <label for=\"minuteInput\">Minute</label>\n        <input \n          id=\"minuteInput\"\n          type=\"number\" \n          min=\"0\" \n          max=\"59\"\n          [step]=\"1\"\n          [ngModel]=\"selectedMinute()\"\n          (ngModelChange)=\"selectedMinuteSignal.set($event)\"\n          (input)=\"onMinuteInput($event)\"\n          (blur)=\"validateMinuteInput()\"\n          class=\"time-input\"\n          title=\"Enter minute (0-59)\">\n      </div>\n      <div class=\"am-pm-selector\" *ngIf=\"is12HourFormat()\">\n        <label for=\"amPmSelect\">AM/PM</label>\n        <select \n          id=\"amPmSelect\"\n          [ngModel]=\"selectedAmPm()\"\n          (ngModelChange)=\"selectedAmPmSignal.set($event)\"\n          class=\"am-pm-select\">\n          <option value=\"AM\">AM</option>\n          <option value=\"PM\">PM</option>\n        </select>\n      </div>\n    </div>\n  </div>\n\n  <div class=\"datepicker-container__footer\" *ngIf=\"data.dpConfig.showApplyButton || data.dpConfig.enableTime\">\n    <button mis-button size=\"md\" type=\"'none'\" (click)=\"cancelDatePicker()\">Cancel</button>\n    <button mis-button size=\"md\" type=\"primary\" (click)=\"applyDate()\" [disabled]=\"!(data.date || localSelectedDate()?.date)\">Apply</button>\n  </div>\n</div>\n", styles: [".h1{font-size:40px;font-weight:400;letter-spacing:0px;line-height:48px}.h2{font-size:32px;font-weight:400;letter-spacing:0px;line-height:40px}.h3{font-size:28px;font-weight:400;letter-spacing:0px;line-height:36px}.h4{font-size:24px;font-weight:400;letter-spacing:0px;line-height:32px}.h5-b{font-size:20px;font-weight:700;letter-spacing:.25px;line-height:28px}.h5{font-size:20px;font-weight:400;letter-spacing:.15px;line-height:28px}.h6-b{font-size:16px;font-weight:700;letter-spacing:0px;line-height:24px}.h6{font-size:16px;font-weight:400;letter-spacing:0px;line-height:24px}.p{font-size:16px;font-weight:400;letter-spacing:0px;line-height:180%}.h7-b{font-size:14px;font-weight:700;letter-spacing:.25px;line-height:20px}.h7,.datepicker-container .datepicker-container__body .month,.datepicker-container .datepicker-container__body .year{font-size:14px;font-weight:400;letter-spacing:.2px;line-height:20px}.h8-b{font-size:12px;font-weight:700;letter-spacing:.25px;line-height:18px}.h8{font-size:12px;font-weight:400;letter-spacing:.2px;line-height:18px}.h9{font-size:10px;font-weight:400;letter-spacing:0px;line-height:15px}.btn-lg-b{font-size:16px;font-weight:700;letter-spacing:.5px;line-height:24px}.btn-lg{font-size:16px;font-weight:400;letter-spacing:.2px;line-height:24px}.btn-sm{font-size:14px;font-weight:400;letter-spacing:.25px;line-height:20px}.btn-link{font-size:16px;font-weight:400;letter-spacing:0px;line-height:24px}.display-1{font-size:48px;font-weight:400;letter-spacing:0px;line-height:56px}.display-2{font-size:14px;font-weight:400;letter-spacing:.5px;line-height:20px}:root{--pmry-200: #99BAF7;--pmry-100: #CBDDFB;--pmry-500: #0937B2;--pmry-400: #3C68D0;--pmry-600: #062A99;--pmry-700: #041F80;--pmry-300: #638FE7;--pmry-800: #021567;--pmry-900: #010F55;--sec-d-purple: #40447F;--sec-maroon: #6B034E;--sec-mud-red: #B23600;--sec-orange: #ED711C;--sec-purple: #815FD5;--sec-teal: #10ADAE;--sec-yellow: #D4900C;--sec-green: #547F40;--sec-bright-green: #27D22E;--sec-dark-teal: #035F6B;--sec-chocolate: #7C2F33;--sec-rube-pink: #C13D6D;--sec-cerulean: #0087B2;--sem-error: #B00020;--sem-info: #0091FF;--sem-warning: #FF9D00;--sem-success: #38AF49;--grey-bg-1: #FAFAFA;--grey-bg: #F5F5F5;--grey-seperators: #E0E0E0;--grey-disabled: #C8CDD3;--grey-hover: #F5F7FC;--grey-pressed: #E6EBF7;--grey-row: #F5F7FC;--dec-light-yellow: #F4E7C3;--dec-light-purple: #DACFF9;--dec-light-green: #E4F5E9;--dec-light-green2: #F1FFF3;--dec-light-pink: #FAE1EA;--dec-: #F4CBC1;--dec-lt-orange: #FAEFED;--dec-light-blue: #CFECF9;--dec-row-selection: #F1FDF8;--dec-row-selection2: #F2FBFF;--dec-row-lines: #D3E1E9;--text-white: #FFFFFF;--text-disabled: #929DAB;--text-muted: #6A737D;--text-black: #181F33;--MR-solid-blue2:#C8D5F6;--MR-solid-purple:#C9C3FB;--MR-solid-orange:#EEAC9F;--MR-solid-green:#ACDADA;--MR-solid-brown:#E8C8AF;--MR-solid-yellow:#FFEFC7;--MR-solid-blue:#BBE6FF;--MR-solid-pink:#FFC6F2;--tr-hover:#F0F3FA;--tr-pressed:#DAE1F3}.datepicker-container{background:#fff;border:1px solid #e0e0e0;box-shadow:0 12px 24px #0000001f,0 4px 8px #0000001f;border-radius:12px;display:flex;flex-direction:column;font-family:Lato;-webkit-user-select:none;user-select:none;box-sizing:border-box;width:290px}.datepicker-container .datepicker-container__header{display:flex;height:32px;margin:16px;justify-content:space-between;align-items:center;width:258px}.datepicker-container .datepicker-container__header span{font-size:16px;font-style:normal;font-weight:700;line-height:24px;letter-spacing:.2px;text-align:center}.datepicker-container .datepicker-container__header .month-header,.datepicker-container .datepicker-container__header .year-header{padding:8px;border-radius:10px}.datepicker-container .datepicker-container__header .month-header:hover,.datepicker-container .datepicker-container__header .year-header:hover{cursor:pointer;background-color:#e6ebf7}.datepicker-container .datepicker-container__header .datepicker-container__arrow__icon{height:20px;width:20px;display:flex;align-items:center;justify-content:center;border-radius:4px;padding:4px}.datepicker-container .datepicker-container__header .datepicker-container__arrow__icon.disabled-month{opacity:.5;cursor:not-allowed}.datepicker-container .datepicker-container__header .datepicker-container__arrow__icon:not(.disabled-month):hover{cursor:pointer;background-color:#cbddfb}.datepicker-container .datepicker-container__header .datepicker-container__arrow__icon:nth-child(1){transform:rotate(180deg)}.datepicker-container .datepicker-container__body{width:258px;height:100%;margin:0 16px 16px}.datepicker-container .datepicker-container__body .row{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;margin-bottom:10px}.datepicker-container .datepicker-container__body .month,.datepicker-container .datepicker-container__body .year{padding:10px 6px;cursor:pointer;border-radius:5px;text-align:center;background-color:#fff}.datepicker-container .datepicker-container__body .month:hover,.datepicker-container .datepicker-container__body .year:hover{background-color:#cbddfb}.datepicker-container .datepicker-container__body .disable-month,.datepicker-container .datepicker-container__body .disable-year{cursor:default;color:#c8cdd3}.datepicker-container .datepicker-container__body .disable-month:hover,.datepicker-container .datepicker-container__body .disable-year:hover{background-color:transparent}.datepicker-container .datepicker-container__body .select-month,.datepicker-container .datepicker-container__body .select-year{background-color:#0937b2;color:#fff}.datepicker-container .datepicker-container__body .select-month:hover,.datepicker-container .datepicker-container__body .select-year:hover{cursor:pointer;background-color:#cbddfb}.datepicker-container .datepicker-container__body .datepicker-container__weekdays{width:100%;display:flex;padding-bottom:10px}.datepicker-container .datepicker-container__body .datepicker-container__weekdays .datepicker-container__weekday{width:36px;height:18px;text-align:center}.datepicker-container .datepicker-container__body .datepicker-container__weekdays .datepicker-container__weekday span{font-size:12px;font-style:normal;font-weight:400;line-height:18px;letter-spacing:.2px;text-align:center;color:#c7c7c7}.datepicker-container .datepicker-container__body .datepicker-container__weekdays .datepicker-container__weekday span.current-day{font-weight:700;letter-spacing:.25px;color:#181f33}.datepicker-container .datepicker-container__body .datepicker-container__days{display:flex;flex-wrap:wrap;gap:2px}.datepicker-container .datepicker-container__body .datepicker-container__days .datepicker-container__day{width:34px;height:34px;display:flex;align-items:center;justify-content:center;border-radius:4px}.datepicker-container .datepicker-container__body .datepicker-container__days .datepicker-container__day.selected-day{background-color:#0937b2;cursor:pointer}.datepicker-container .datepicker-container__body .datepicker-container__days .datepicker-container__day.disabled-day{cursor:default}.datepicker-container .datepicker-container__body .datepicker-container__days .datepicker-container__day.disabled-day:hover{background-color:transparent}.datepicker-container .datepicker-container__body .datepicker-container__days .datepicker-container__day.is-valid-date:not(.disabled-day):not(.selected-day):hover{background-color:#cbddfb;cursor:pointer}.datepicker-container .datepicker-container__body .datepicker-container__days .datepicker-container__day.is-valid-date:not(.disabled-day):not(.selected-day):hover span.selected-day{color:#181f33!important}.datepicker-container .datepicker-container__body .datepicker-container__days .datepicker-container__day span{font-size:14px;font-style:normal;font-weight:400;line-height:20px;letter-spacing:.2px;text-align:center;color:#181f33}.datepicker-container .datepicker-container__body .datepicker-container__days .datepicker-container__day span.current-day{font-weight:700;letter-spacing:.25px}.datepicker-container .datepicker-container__body .datepicker-container__days .datepicker-container__day span.selected-day{color:#fff}.datepicker-container .datepicker-container__body .datepicker-container__days .datepicker-container__day span.disabled-day{color:#c7c7c7}.datepicker-container .datepicker-container__time{border-top:1px solid #e0e0e0;padding:16px;margin:0 16px}.datepicker-container .datepicker-container__time .time-picker-header{margin-bottom:12px}.datepicker-container .datepicker-container__time .time-picker-header span{font-size:14px;font-weight:600;color:#181f33}.datepicker-container .datepicker-container__time .time-picker-controls{display:flex;align-items:center;gap:8px}.datepicker-container .datepicker-container__time .time-picker-controls .time-input-group{display:flex;flex-direction:column;gap:4px}.datepicker-container .datepicker-container__time .time-picker-controls .time-input-group label{font-size:12px;font-weight:500;color:#6a737d}.datepicker-container .datepicker-container__time .time-picker-controls .time-input-group .time-input{width:50px;height:32px;padding:4px 8px;border:1px solid #e0e0e0;border-radius:4px;font-size:14px;text-align:center}.datepicker-container .datepicker-container__time .time-picker-controls .time-input-group .time-input:focus{outline:none;border-color:#0937b2;box-shadow:0 0 0 2px #0937b21a}.datepicker-container .datepicker-container__time .time-picker-controls .time-input-group .time-input:invalid{border-color:#dc3545;background-color:#fff5f5}.datepicker-container .datepicker-container__time .time-picker-controls .time-input-group .time-input::-webkit-inner-spin-button,.datepicker-container .datepicker-container__time .time-picker-controls .time-input-group .time-input::-webkit-outer-spin-button{-webkit-appearance:none;margin:0}.datepicker-container .datepicker-container__time .time-picker-controls .time-input-group .time-input[type=number]{-moz-appearance:textfield}.datepicker-container .datepicker-container__time .time-picker-controls .time-separator{font-size:18px;font-weight:600;color:#181f33;margin-top:20px}.datepicker-container .datepicker-container__time .time-picker-controls .am-pm-selector{display:flex;flex-direction:column;gap:4px}.datepicker-container .datepicker-container__time .time-picker-controls .am-pm-selector label{font-size:12px;font-weight:500;color:#6a737d}.datepicker-container .datepicker-container__time .time-picker-controls .am-pm-selector .am-pm-select{width:60px;height:42px;padding:4px 8px;border:1px solid #e0e0e0;border-radius:4px;font-size:14px;background-color:#fff}.datepicker-container .datepicker-container__time .time-picker-controls .am-pm-selector .am-pm-select:focus{outline:none;border-color:#0937b2;box-shadow:0 0 0 2px #0937b21a}.datepicker-container .datepicker-container__footer{display:flex;justify-content:flex-end;gap:8px;bottom:0;align-items:center;position:sticky;padding:16px;border-top:1px solid #e0e0e0}.remove-box-shadow{box-shadow:none!important;border:none!important;border-radius:0!important}\n"] }]
+        args: [{ selector: "mis-tz-dp", template: "<div class=\"datepicker-container\" [ngClass]=\"data.disableBoxShadow?'remove-box-shadow':''\" aria-label=\"date picker\" cdkTrapFocus [cdkTrapFocusAutoCapture]=\"true\">\n  <div tabindex=\"-1\" cdkFocusInitial></div>\n  <div class=\"datepicker-container__header\">\n    <div\n      class=\"datepicker-container__arrow__icon\"\n      (click)=\"navigateView('PREVIOUS')\"\n      tabindex=\"0\"\n      aria-label=\"Previous Month\"\n      (keyup.enter)=\"navigateView('PREVIOUS')\"\n      [ngClass]=\"{\n        'disabled-month': isPreviousMonthDisabled() || isSelectingMonth()\n      }\"\n    >\n      <svg width=\"20\" height=\"16\" viewBox=\"0 0 20 16\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n        <path\n          d=\"M19.7071 8.70711C20.0976 8.31658 20.0976 7.68342 19.7071 7.29289L13.3431 0.928933C12.9526 0.538409 12.3195 0.538409 11.9289 0.928933C11.5384 1.31946 11.5384 1.95262 11.9289 2.34315L17.5858 8L11.9289 13.6569C11.5384 14.0474 11.5384 14.6805 11.9289 15.0711C12.3195 15.4616 12.9526 15.4616 13.3431 15.0711L19.7071 8.70711ZM-8.74228e-08 9L19 9L19 7L8.74228e-08 7L-8.74228e-08 9Z\"\n          fill=\"#181F33\"\n        ></path>\n      </svg>\n    </div>\n\n    <div *ngIf=\"!isSelectingYear()\" (click)=\"toggleMonthSelector()\" class=\"month-header\">\n      {{ isYearSelectionFlow() ? selectedYear() : availableMonths()[currentMonthNumber()] }}\n    </div>\n    <div *ngIf=\"!isSelectingMonth()\" (click)=\"toggleYearSelector()\" class=\"year-header\">\n      {{ isSelectingYear() ? yearRange : currentYearNumber() }}\n    </div>\n\n\n    <div\n      class=\"datepicker-container__arrow__icon\"\n      (click)=\"navigateView('NEXT')\"\n      tabindex=\"0\"\n      aria-label=\"Next Month\"\n      (keyup.enter)=\"navigateView('NEXT')\"\n      [ngClass]=\"{\n        'disabled-month': isNextMonthDisabled() || isSelectingMonth()\n      }\"\n    >\n      <svg width=\"20\" height=\"16\" viewBox=\"0 0 20 16\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n        <path\n          d=\"M19.7071 8.70711C20.0976 8.31658 20.0976 7.68342 19.7071 7.29289L13.3431 0.928933C12.9526 0.538409 12.3195 0.538409 11.9289 0.928933C11.5384 1.31946 11.5384 1.95262 11.9289 2.34315L17.5858 8L11.9289 13.6569C11.5384 14.0474 11.5384 14.6805 11.9289 15.0711C12.3195 15.4616 12.9526 15.4616 13.3431 15.0711L19.7071 8.70711ZM-8.74228e-08 9L19 9L19 7L8.74228e-08 7L-8.74228e-08 9Z\"\n          fill=\"#181F33\"\n        ></path>\n      </svg>\n    </div>\n  </div>\n  <div class=\"datepicker-container__body\">\n\n    <div *ngIf=\"isSelectingMonth() && !isSelectingYear()\" class=\"month-selector\">\n      <div class=\"row\">\n        <div *ngFor=\"let month of availableMonths(); let i = index\" \n            class=\"month\" \n            (click)=\"!disabledMonths()[i] && selectMonth(month)\" \n            [ngClass]=\"{\n              'disable-month': disabledMonths()[i],\n              'select-month': !disabledMonths()[currentMonthNumber()] && month === availableMonths()[currentMonthNumber()]\n            }\">\n          {{ month }}\n        </div>\n      </div>\n    </div>\n  \n    <div *ngIf=\"isSelectingYear() && !isSelectingMonth()\" class=\"year-selector\">\n      <div class=\"row\">\n        <div *ngFor=\"let year of availableYears(); let i = index\" \n            class=\"year\" \n            (click)=\"!disabledYears()[i] && selectYear(year)\" \n            [ngClass]=\"{\n              'disable-year': disabledYears()[i],\n              'select-year': year === currentYearNumber()\n            }\">\n          {{ year }}\n        </div>\n      </div>\n    </div>\n\n    <div *ngIf=\"!isSelectingMonth() && !isSelectingYear()\" class=\"datepicker-container__weekdays\">\n      <div class=\"datepicker-container__weekday\" *ngFor=\"let weekDay of weekDays()\">\n        <span [ngClass]=\"{ 'current-day': weekDay.isCurrentDay }\">{{ weekDay.label }}</span>\n      </div>\n    </div>\n    <div *ngIf=\"!isSelectingMonth() && !isSelectingYear()\" class=\"datepicker-container__days\">\n      <div\n        class=\"datepicker-container__day\"\n        [ngClass]=\"{\n          'selected-day': day.isSelectedDay,\n          'disabled-day': day.isDisabledDay,\n          'is-valid-date': day.date > 0 && !day.isSelectedDay\n        }\"\n        *ngFor=\"let day of currentMonthDates()\"\n        (click)=\"selectDay(day)\"\n        (keyup.enter)=\"selectDay(day)\"\n      >\n        <span\n          *ngIf=\"day.date > 0\"\n          [tabindex]=\"day.isDisabledDay ? -1 : 0\"\n          [ngClass]=\"{\n            'current-day': day.isCurrentDay,\n            'selected-day': day.isSelectedDay,\n            'disabled-day': day.isDisabledDay\n          }\"\n          [attr.aria-label]=\"retractDayMonth(day.date, currentMonth(), currentYearNumber())\"\n        >\n          {{ day.date }}\n        </span>\n      </div>\n    </div>\n  </div>\n\n  <!-- Time Picker Section -->\n  <div class=\"datepicker-container__time\" *ngIf=\"data.dpConfig.enableTime === true\">\n    <div class=\"time-picker-header\">\n      <span>Time</span>\n    </div>\n    <div class=\"time-picker-controls\">\n      <div class=\"time-input-group\">\n        <label for=\"hourInput\">Hour</label>\n        <input \n          id=\"hourInput\"\n          type=\"number\" \n          [min]=\"is12HourFormat() ? 1 : 0\"\n          [max]=\"is12HourFormat() ? 12 : 23\"\n          [step]=\"1\"\n          [ngModel]=\"selectedHour()\"\n          (ngModelChange)=\"selectedHourSignal.set($event)\"\n          (input)=\"onHourInput($event)\"\n          (blur)=\"validateHourInput()\"\n          class=\"time-input\"\n          [title]=\"is12HourFormat() ? 'Enter hour (1-12)' : 'Enter hour (0-23)'\">\n      </div>\n      <div class=\"time-separator\">:</div>\n      <div class=\"time-input-group\">\n        <label for=\"minuteInput\">Minute</label>\n        <input \n          id=\"minuteInput\"\n          type=\"number\" \n          min=\"0\" \n          max=\"59\"\n          [step]=\"1\"\n          [ngModel]=\"selectedMinute()\"\n          (ngModelChange)=\"selectedMinuteSignal.set($event)\"\n          (input)=\"onMinuteInput($event)\"\n          (blur)=\"validateMinuteInput()\"\n          class=\"time-input\"\n          title=\"Enter minute (0-59)\">\n      </div>\n      <div class=\"am-pm-selector\" *ngIf=\"is12HourFormat()\">\n        <label for=\"amPmSelect\">AM/PM</label>\n        <select \n          id=\"amPmSelect\"\n          [ngModel]=\"selectedAmPm()\"\n          (ngModelChange)=\"selectedAmPmSignal.set($event)\"\n          class=\"am-pm-select\">\n          <option value=\"AM\">AM</option>\n          <option value=\"PM\">PM</option>\n        </select>\n      </div>\n    </div>\n  </div>\n\n  <div class=\"datepicker-container__footer\" *ngIf=\"data.dpConfig.showApplyButton || data.dpConfig.enableTime\">\n    <button mis-button size=\"md\" type=\"'none'\" (click)=\"cancelDatePicker()\">Cancel</button>\n    <button mis-button size=\"md\" type=\"primary\" (click)=\"applyDate()\" [disabled]=\"!(data.date || localSelectedDate()?.date)\">Apply</button>\n  </div>\n</div>\n", styles: [".h1{font-size:40px;font-weight:400;letter-spacing:0px;line-height:48px}.h2{font-size:32px;font-weight:400;letter-spacing:0px;line-height:40px}.h3{font-size:28px;font-weight:400;letter-spacing:0px;line-height:36px}.h4{font-size:24px;font-weight:400;letter-spacing:0px;line-height:32px}.h5-b{font-size:20px;font-weight:700;letter-spacing:.25px;line-height:28px}.h5{font-size:20px;font-weight:400;letter-spacing:.15px;line-height:28px}.h6-b{font-size:16px;font-weight:700;letter-spacing:0px;line-height:24px}.h6{font-size:16px;font-weight:400;letter-spacing:0px;line-height:24px}.p{font-size:16px;font-weight:400;letter-spacing:0px;line-height:180%}.h7-b{font-size:14px;font-weight:700;letter-spacing:.25px;line-height:20px}.h7,.datepicker-container .datepicker-container__body .month,.datepicker-container .datepicker-container__body .year{font-size:14px;font-weight:400;letter-spacing:.2px;line-height:20px}.h8-b{font-size:12px;font-weight:700;letter-spacing:.25px;line-height:18px}.h8{font-size:12px;font-weight:400;letter-spacing:.2px;line-height:18px}.h9{font-size:10px;font-weight:400;letter-spacing:0px;line-height:15px}.btn-lg-b{font-size:16px;font-weight:700;letter-spacing:.5px;line-height:24px}.btn-lg{font-size:16px;font-weight:400;letter-spacing:.2px;line-height:24px}.btn-sm{font-size:14px;font-weight:400;letter-spacing:.25px;line-height:20px}.btn-link{font-size:16px;font-weight:400;letter-spacing:0px;line-height:24px}.display-1{font-size:48px;font-weight:400;letter-spacing:0px;line-height:56px}.display-2{font-size:14px;font-weight:400;letter-spacing:.5px;line-height:20px}:root{--pmry-200: #99BAF7;--pmry-100: #CBDDFB;--pmry-500: #0937B2;--pmry-400: #3C68D0;--pmry-600: #062A99;--pmry-700: #041F80;--pmry-300: #638FE7;--pmry-800: #021567;--pmry-900: #010F55;--sec-d-purple: #40447F;--sec-maroon: #6B034E;--sec-mud-red: #B23600;--sec-orange: #ED711C;--sec-purple: #815FD5;--sec-teal: #10ADAE;--sec-yellow: #D4900C;--sec-green: #547F40;--sec-bright-green: #27D22E;--sec-dark-teal: #035F6B;--sec-chocolate: #7C2F33;--sec-rube-pink: #C13D6D;--sec-cerulean: #0087B2;--sem-error: #B00020;--sem-info: #0091FF;--sem-warning: #FF9D00;--sem-success: #38AF49;--grey-bg-1: #FAFAFA;--grey-bg: #F5F5F5;--grey-seperators: #E0E0E0;--grey-disabled: #C8CDD3;--grey-hover: #F5F7FC;--grey-pressed: #E6EBF7;--grey-row: #F5F7FC;--dec-light-yellow: #F4E7C3;--dec-light-purple: #DACFF9;--dec-light-green: #E4F5E9;--dec-light-green2: #F1FFF3;--dec-light-pink: #FAE1EA;--dec-: #F4CBC1;--dec-lt-orange: #FAEFED;--dec-light-blue: #CFECF9;--dec-row-selection: #F1FDF8;--dec-row-selection2: #F2FBFF;--dec-row-lines: #D3E1E9;--text-white: #FFFFFF;--text-muted: #6A737D;--text-black: #181F33;--MR-solid-blue2:#C8D5F6;--MR-solid-purple:#C9C3FB;--MR-solid-orange:#EEAC9F;--MR-solid-green:#ACDADA;--MR-solid-brown:#E8C8AF;--MR-solid-yellow:#FFEFC7;--MR-solid-blue:#BBE6FF;--MR-solid-pink:#FFC6F2;--tr-hover:#F0F3FA;--tr-pressed:#DAE1F3;--brand-primary: #0937B2;--brand-primary-light: #3C68D0;--brand-primary-dark: #062A99;--brand-primary-darker: #041F80;--brand-primary-lighter: #638FE7;--brand-primary-lightest: #CBDDFB;--brand-primary-hover: #F0F3FA;--brand-primary-active: #DAE1F3;--brand-secondary: #ED711C;--brand-secondary-light: #F09E65;--brand-secondary-dark: #B23600;--brand-secondary-lighter: #FFC6F2;--brand-accent: #10ADAE;--brand-accent-light: #16CBBC;--brand-accent-dark: #035F6B;--brand-accent-lighter: #ACDADA;--brand-success: #38AF49;--brand-success-light: #4CAF50;--brand-success-dark: #216531;--brand-success-lighter: #E4F5E9;--brand-success-lightest: #F1FFF3;--brand-error: #B00020;--brand-error-light: #F04E4E;--brand-error-dark: #A60060;--brand-error-lighter: #FAE1EA;--brand-error-lightest: #FDF2F2;--brand-warning: #FF9D00;--brand-warning-light: #D4900C;--brand-warning-dark: #624000;--brand-warning-lighter: #F4E7C3;--brand-warning-lightest: #FAEFED;--brand-info: #0091FF;--brand-info-light: #35A1FF;--brand-info-dark: #0087B2;--brand-info-lighter: #CFECF9;--text-primary: #181F33;--text-secondary: #6A737D;--text-tertiary: #929DAB;--text-disabled: #929DAB;--text-primary-87: rgba(24, 31, 51, .87);--text-primary-60: rgba(24, 31, 51, .6);--text-primary-38: rgba(24, 31, 51, .38);--text-primary-12: rgba(24, 31, 51, .12);--bg-primary: #FFFFFF;--bg-secondary: #FAFAFA;--bg-tertiary: #F5F5F5;--bg-overlay: rgba(0, 0, 0, .32);--bg-overlay-light: rgba(0, 0, 0, .12);--bg-overlay-lighter: rgba(0, 0, 0, .08);--bg-overlay-lightest: rgba(0, 0, 0, .04);--border-primary: #E0E0E0;--border-secondary: #D6DCE2;--border-tertiary: #C8CDD3;--border-light: #F1F4F8;--border-primary-12: rgba(0, 0, 0, .12);--border-primary-08: rgba(0, 0, 0, .08);--border-primary-06: rgba(0, 0, 0, .06);--shadow-primary: rgba(0, 0, 0, .12);--shadow-secondary: rgba(0, 0, 0, .08);--shadow-tertiary: rgba(0, 0, 0, .04);--shadow-light: rgba(0, 0, 0, .06);--status-available: #929DAB;--status-unavailable: #CCD3DA;--status-hotseat: #857BFF;--status-multiteam: #10ADAE;--status-selected: #10ADAE;--status-upcoming: #D4900C;--status-room: #38AF49;--status-room-booked: #B23600;--status-room-unavailable: #181F33;--team-color-1: #F8C52E;--team-color-2: #FA8E20;--team-color-3: #987CDD;--team-color-4: #16CBBC;--team-color-5: #E65010;--team-color-6: #A60060;--team-color-7: #ED323B;--team-color-8: #35A1FF;--team-color-9: #80D348}.datepicker-container{background:var(--bg-primary, #FFFFFF);border:1px solid var(--border-primary, #E0E0E0);box-shadow:0 12px 24px #0000001f,0 4px 8px #0000001f;border-radius:12px;display:flex;flex-direction:column;font-family:Lato;-webkit-user-select:none;user-select:none;box-sizing:border-box;width:290px}.datepicker-container .datepicker-container__header{display:flex;height:32px;margin:16px;justify-content:space-between;align-items:center;width:258px}.datepicker-container .datepicker-container__header span{font-size:16px;font-style:normal;font-weight:700;line-height:24px;letter-spacing:.2px;text-align:center}.datepicker-container .datepicker-container__header .month-header,.datepicker-container .datepicker-container__header .year-header{padding:8px;border-radius:10px}.datepicker-container .datepicker-container__header .month-header:hover,.datepicker-container .datepicker-container__header .year-header:hover{cursor:pointer;background-color:var(--brand-primary-active, #DAE1F3)}.datepicker-container .datepicker-container__header .datepicker-container__arrow__icon{height:20px;width:20px;display:flex;align-items:center;justify-content:center;border-radius:4px;padding:4px}.datepicker-container .datepicker-container__header .datepicker-container__arrow__icon.disabled-month{opacity:.5;cursor:not-allowed}.datepicker-container .datepicker-container__header .datepicker-container__arrow__icon:not(.disabled-month):hover{cursor:pointer;background-color:var(--brand-primary-lightest, #CBDDFB)}.datepicker-container .datepicker-container__header .datepicker-container__arrow__icon:nth-child(1){transform:rotate(180deg)}.datepicker-container .datepicker-container__body{width:258px;height:100%;margin:0 16px 16px}.datepicker-container .datepicker-container__body .row{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;margin-bottom:10px}.datepicker-container .datepicker-container__body .month,.datepicker-container .datepicker-container__body .year{padding:10px 6px;cursor:pointer;border-radius:5px;text-align:center;background-color:var(--bg-primary, #FFFFFF)}.datepicker-container .datepicker-container__body .month:hover,.datepicker-container .datepicker-container__body .year:hover{background-color:var(--brand-primary-lightest, #CBDDFB)}.datepicker-container .datepicker-container__body .disable-month,.datepicker-container .datepicker-container__body .disable-year{cursor:default;color:var(--text-disabled, #C8CDD3)}.datepicker-container .datepicker-container__body .disable-month:hover,.datepicker-container .datepicker-container__body .disable-year:hover{background-color:transparent}.datepicker-container .datepicker-container__body .select-month,.datepicker-container .datepicker-container__body .select-year{background-color:var(--brand-primary, #0937B2);color:var(--bg-primary, #FFFFFF)}.datepicker-container .datepicker-container__body .select-month:hover,.datepicker-container .datepicker-container__body .select-year:hover{cursor:pointer;background-color:var(--brand-primary-lightest, #CBDDFB)}.datepicker-container .datepicker-container__body .datepicker-container__weekdays{width:100%;display:flex;padding-bottom:10px}.datepicker-container .datepicker-container__body .datepicker-container__weekdays .datepicker-container__weekday{width:36px;height:18px;text-align:center}.datepicker-container .datepicker-container__body .datepicker-container__weekdays .datepicker-container__weekday span{font-size:12px;font-style:normal;font-weight:400;line-height:18px;letter-spacing:.2px;text-align:center;color:var(--text-disabled, #C8CDD3)}.datepicker-container .datepicker-container__body .datepicker-container__weekdays .datepicker-container__weekday span.current-day{font-weight:700;letter-spacing:.25px;color:var(--text-primary, #181F33)}.datepicker-container .datepicker-container__body .datepicker-container__days{display:flex;flex-wrap:wrap;gap:2px}.datepicker-container .datepicker-container__body .datepicker-container__days .datepicker-container__day{width:34px;height:34px;display:flex;align-items:center;justify-content:center;border-radius:4px}.datepicker-container .datepicker-container__body .datepicker-container__days .datepicker-container__day.selected-day{background-color:var(--brand-primary, #0937B2);cursor:pointer}.datepicker-container .datepicker-container__body .datepicker-container__days .datepicker-container__day.disabled-day{cursor:default}.datepicker-container .datepicker-container__body .datepicker-container__days .datepicker-container__day.disabled-day:hover{background-color:transparent}.datepicker-container .datepicker-container__body .datepicker-container__days .datepicker-container__day.is-valid-date:not(.disabled-day):not(.selected-day):hover{background-color:var(--brand-primary-lightest, #CBDDFB);cursor:pointer}.datepicker-container .datepicker-container__body .datepicker-container__days .datepicker-container__day.is-valid-date:not(.disabled-day):not(.selected-day):hover span.selected-day{color:var(--text-primary, #181F33)!important}.datepicker-container .datepicker-container__body .datepicker-container__days .datepicker-container__day span{font-size:14px;font-style:normal;font-weight:400;line-height:20px;letter-spacing:.2px;text-align:center;color:var(--text-primary, #181F33)}.datepicker-container .datepicker-container__body .datepicker-container__days .datepicker-container__day span.current-day{font-weight:700;letter-spacing:.25px}.datepicker-container .datepicker-container__body .datepicker-container__days .datepicker-container__day span.selected-day{color:var(--bg-primary, #FFFFFF)}.datepicker-container .datepicker-container__body .datepicker-container__days .datepicker-container__day span.disabled-day{color:var(--text-disabled, #C8CDD3)}.datepicker-container .datepicker-container__time{border-top:1px solid var(--border-primary, #E0E0E0);padding:16px;margin:0 16px}.datepicker-container .datepicker-container__time .time-picker-header{margin-bottom:12px}.datepicker-container .datepicker-container__time .time-picker-header span{font-size:14px;font-weight:600;color:var(--text-primary, #181F33)}.datepicker-container .datepicker-container__time .time-picker-controls{display:flex;align-items:center;gap:8px}.datepicker-container .datepicker-container__time .time-picker-controls .time-input-group{display:flex;flex-direction:column;gap:4px}.datepicker-container .datepicker-container__time .time-picker-controls .time-input-group label{font-size:12px;font-weight:500;color:var(--text-secondary, #6A737D)}.datepicker-container .datepicker-container__time .time-picker-controls .time-input-group .time-input{width:50px;height:32px;padding:4px 8px;border:1px solid var(--border-primary, #E0E0E0);border-radius:4px;font-size:14px;text-align:center}.datepicker-container .datepicker-container__time .time-picker-controls .time-input-group .time-input:focus{outline:none;border-color:var(--brand-primary, #0937B2);box-shadow:0 0 0 2px #0937b21a}.datepicker-container .datepicker-container__time .time-picker-controls .time-input-group .time-input:invalid{border-color:#dc3545;background-color:#fff5f5}.datepicker-container .datepicker-container__time .time-picker-controls .time-input-group .time-input::-webkit-inner-spin-button,.datepicker-container .datepicker-container__time .time-picker-controls .time-input-group .time-input::-webkit-outer-spin-button{-webkit-appearance:none;margin:0}.datepicker-container .datepicker-container__time .time-picker-controls .time-input-group .time-input[type=number]{-moz-appearance:textfield}.datepicker-container .datepicker-container__time .time-picker-controls .time-separator{font-size:18px;font-weight:600;color:var(--text-primary, #181F33);margin-top:20px}.datepicker-container .datepicker-container__time .time-picker-controls .am-pm-selector{display:flex;flex-direction:column;gap:4px}.datepicker-container .datepicker-container__time .time-picker-controls .am-pm-selector label{font-size:12px;font-weight:500;color:var(--text-secondary, #6A737D)}.datepicker-container .datepicker-container__time .time-picker-controls .am-pm-selector .am-pm-select{width:60px;height:42px;padding:4px 8px;border:1px solid var(--border-primary, #E0E0E0);border-radius:4px;font-size:14px;background-color:#fff}.datepicker-container .datepicker-container__time .time-picker-controls .am-pm-selector .am-pm-select:focus{outline:none;border-color:var(--brand-primary, #0937B2);box-shadow:0 0 0 2px #0937b21a}.datepicker-container .datepicker-container__footer{display:flex;justify-content:flex-end;gap:8px;bottom:0;align-items:center;position:sticky;padding:16px;border-top:1px solid var(--border-primary, #E0E0E0)}.remove-box-shadow{box-shadow:none!important;border:none!important;border-radius:0!important}\n"] }]
     }], () => [{ type: undefined, decorators: [{
                 type: Inject,
                 args: [CONTAINER_DATA]

package/esm2022/daterangepicker_v2/tz-drp-container/tz-drp-container.component.mjs CHANGED Viewed

@@ -961,11 +961,11 @@ export class TzDrpContainerComponent {
             i0.ɵɵproperty("ngIf", ctx.data.dpConfig.enableTime === true);
             i0.ɵɵadvance(4);
             i0.ɵɵproperty("disabled", !ctx.isDatesValid());
-        } }, dependencies: [i2.NgClass, i2.NgForOf, i2.NgIf, i3.NgSelectOption, i3.ɵNgSelectMultipleOption, i3.DefaultValueAccessor, i3.NumberValueAccessor, i3.SelectControlValueAccessor, i3.NgControlStatus, i3.MinValidator, i3.MaxValidator, i3.NgModel, i4.ButtonDirective, i5.CdkTrapFocus], styles: ["[_ngcontent-%COMP%]:root{--pmry-200: #99BAF7;--pmry-100: #CBDDFB;--pmry-500: #0937B2;--pmry-400: #3C68D0;--pmry-600: #062A99;--pmry-700: #041F80;--pmry-300: #638FE7;--pmry-800: #021567;--pmry-900: #010F55;--sec-d-purple: #40447F;--sec-maroon: #6B034E;--sec-mud-red: #B23600;--sec-orange: #ED711C;--sec-purple: #815FD5;--sec-teal: #10ADAE;--sec-yellow: #D4900C;--sec-green: #547F40;--sec-bright-green: #27D22E;--sec-dark-teal: #035F6B;--sec-chocolate: #7C2F33;--sec-rube-pink: #C13D6D;--sec-cerulean: #0087B2;--sem-error: #B00020;--sem-info: #0091FF;--sem-warning: #FF9D00;--sem-success: #38AF49;--grey-bg-1: #FAFAFA;--grey-bg: #F5F5F5;--grey-seperators: #E0E0E0;--grey-disabled: #C8CDD3;--grey-hover: #F5F7FC;--grey-pressed: #E6EBF7;--grey-row: #F5F7FC;--dec-light-yellow: #F4E7C3;--dec-light-purple: #DACFF9;--dec-light-green: #E4F5E9;--dec-light-green2: #F1FFF3;--dec-light-pink: #FAE1EA;--dec-: #F4CBC1;--dec-lt-orange: #FAEFED;--dec-light-blue: #CFECF9;--dec-row-selection: #F1FDF8;--dec-row-selection2: #F2FBFF;--dec-row-lines: #D3E1E9;--text-white: #FFFFFF;--text-disabled: #929DAB;--text-muted: #6A737D;--text-black: #181F33;--MR-solid-blue2:#C8D5F6;--MR-solid-purple:#C9C3FB;--MR-solid-orange:#EEAC9F;--MR-solid-green:#ACDADA;--MR-solid-brown:#E8C8AF;--MR-solid-yellow:#FFEFC7;--MR-solid-blue:#BBE6FF;--MR-solid-pink:#FFC6F2;--tr-hover:#F0F3FA;--tr-pressed:#DAE1F3}.daterangepicker-container[_ngcontent-%COMP%]{background:#fff;border:1px solid #e0e0e0;box-shadow:0 12px 24px #0000001f,0 4px 8px #0000001f;border-radius:12px;display:flex;flex-direction:column;font-family:Lato;overflow:hidden;-webkit-user-select:none;user-select:none}@media only screen and (max-width: 900px){.daterangepicker-container[_ngcontent-%COMP%]{max-width:100vw;border:none}}.daterangepicker-container[_ngcontent-%COMP%]   .daterangepicker-container__view[_ngcontent-%COMP%]{display:flex;gap:24px;padding:16px}.daterangepicker-container[_ngcontent-%COMP%]   .daterangepicker-container__view[_ngcontent-%COMP%]   .daterangepicker-container__ranges[_ngcontent-%COMP%]{display:flex;flex-direction:column}.daterangepicker-container[_ngcontent-%COMP%]   .daterangepicker-container__view[_ngcontent-%COMP%]   .mis-btn[_ngcontent-%COMP%]{background:none;outline:none;border:none;cursor:pointer;border-radius:4px;vertical-align:middle;text-align:center;box-sizing:border-box;display:flex;align-items:center;text-decoration:none;justify-content:center;padding:10px 16px;font-size:16px;line-height:24px;background-color:transparent;color:#0937b2}.daterangepicker-container[_ngcontent-%COMP%]   .daterangepicker-container__view[_ngcontent-%COMP%]   .active-range[_ngcontent-%COMP%]{background-color:#cadcfb}@media only screen and (max-width: 900px){.daterangepicker-container[_ngcontent-%COMP%]   .daterangepicker-container__view[_ngcontent-%COMP%]{flex-direction:column;align-items:center;position:fixed;bottom:0;left:0;background-color:#fff;width:100%;max-height:68vh;overflow-y:auto;border-radius:30px;gap:24px;padding:10% 0 30%;box-shadow:0 -4px 8px 10000px #0000001f;scrollbar-width:none;-ms-overflow-style:none}.daterangepicker-container[_ngcontent-%COMP%]   .daterangepicker-container__view[_ngcontent-%COMP%]   .daterangepicker-container__view[_ngcontent-%COMP%]::-webkit-scrollbar{display:none}}.daterangepicker-container[_ngcontent-%COMP%]   .daterangepicker-container__view[_ngcontent-%COMP%]   .datepicker__left[_ngcontent-%COMP%], .daterangepicker-container[_ngcontent-%COMP%]   .daterangepicker-container__view[_ngcontent-%COMP%]   .datepicker__right[_ngcontent-%COMP%]{display:flex;flex-direction:column}@media only screen and (max-width: 900px){.daterangepicker-container[_ngcontent-%COMP%]   .daterangepicker-container__view[_ngcontent-%COMP%]   .datepicker__left[_ngcontent-%COMP%], .daterangepicker-container[_ngcontent-%COMP%]   .daterangepicker-container__view[_ngcontent-%COMP%]   .datepicker__right[_ngcontent-%COMP%]{width:90%}}.daterangepicker-container[_ngcontent-%COMP%]   .daterangepicker-container__view[_ngcontent-%COMP%]   .daterangepicker-container__header__prabu[_ngcontent-%COMP%]{display:flex;height:32px;justify-content:space-between;align-items:center;width:100%;padding-bottom:10%}.daterangepicker-container[_ngcontent-%COMP%]   .daterangepicker-container__view[_ngcontent-%COMP%]   .daterangepicker-container__header__prabu[_ngcontent-%COMP%]   span[_ngcontent-%COMP%]{font-size:16px;font-style:normal;font-weight:700;line-height:24px;letter-spacing:.2px;text-align:center}@media only screen and (max-width: 900px){.daterangepicker-container[_ngcontent-%COMP%]   .daterangepicker-container__view[_ngcontent-%COMP%]   .daterangepicker-container__header__prabu[_ngcontent-%COMP%]   span[_ngcontent-%COMP%]{margin:0 auto;font-size:4vw}}.daterangepicker-container[_ngcontent-%COMP%]   .daterangepicker-container__view[_ngcontent-%COMP%]   .daterangepicker-container__header__prabu[_ngcontent-%COMP%]   .daterangepicker-container__arrow__icon[_ngcontent-%COMP%]{height:20px;width:20px;display:flex;align-items:center;justify-content:center;border-radius:4px;padding:4px}.daterangepicker-container[_ngcontent-%COMP%]   .daterangepicker-container__view[_ngcontent-%COMP%]   .daterangepicker-container__header__prabu[_ngcontent-%COMP%]   .daterangepicker-container__arrow__icon.disabled-month[_ngcontent-%COMP%]{opacity:.5;cursor:not-allowed}.daterangepicker-container[_ngcontent-%COMP%]   .daterangepicker-container__view[_ngcontent-%COMP%]   .daterangepicker-container__header__prabu[_ngcontent-%COMP%]   .daterangepicker-container__arrow__icon[_ngcontent-%COMP%]:not(.disabled-month):hover{cursor:pointer;background-color:#cbddfb}.daterangepicker-container[_ngcontent-%COMP%]   .daterangepicker-container__view[_ngcontent-%COMP%]   .daterangepicker-container__header__prabu[_ngcontent-%COMP%]   .daterangepicker-container__arrow__icon[_ngcontent-%COMP%]:nth-child(1){transform:rotate(180deg)}@media only screen and (max-width: 900px){.daterangepicker-container[_ngcontent-%COMP%]   .daterangepicker-container__view[_ngcontent-%COMP%]   .daterangepicker-container__header__prabu[_ngcontent-%COMP%]   .daterangepicker-container__arrow__icon[_ngcontent-%COMP%]{width:7%}}@media only screen and (min-width: 900px){.daterangepicker-container[_ngcontent-%COMP%]   .daterangepicker-container__view[_ngcontent-%COMP%]   .daterangepicker-container__header__prabu[_ngcontent-%COMP%]   .mobile_view[_ngcontent-%COMP%]{display:none}}@media only screen and (max-width: 900px){.daterangepicker-container[_ngcontent-%COMP%]   .daterangepicker-container__view[_ngcontent-%COMP%]   .daterangepicker-container__header__prabu[_ngcontent-%COMP%]   .pc_view[_ngcontent-%COMP%]{display:none}}.daterangepicker-container[_ngcontent-%COMP%]   .daterangepicker-container__view[_ngcontent-%COMP%]   .daterangepicker-container__body[_ngcontent-%COMP%]{height:100%;width:252px}@media only screen and (max-width: 900px){.daterangepicker-container[_ngcontent-%COMP%]   .daterangepicker-container__view[_ngcontent-%COMP%]   .daterangepicker-container__body[_ngcontent-%COMP%]{width:100%}}.daterangepicker-container[_ngcontent-%COMP%]   .daterangepicker-container__view[_ngcontent-%COMP%]   .daterangepicker-container__body[_ngcontent-%COMP%]   .daterangepicker-container__weekdays[_ngcontent-%COMP%]{width:100%;display:flex;padding-bottom:10px}@media only screen and (max-width: 900px){.daterangepicker-container[_ngcontent-%COMP%]   .daterangepicker-container__view[_ngcontent-%COMP%]   .daterangepicker-container__body[_ngcontent-%COMP%]   .daterangepicker-container__weekdays[_ngcontent-%COMP%]{display:flex;flex-direction:row;flex-wrap:wrap;flex:0 0 14.2857142857%}}.daterangepicker-container[_ngcontent-%COMP%]   .daterangepicker-container__view[_ngcontent-%COMP%]   .daterangepicker-container__body[_ngcontent-%COMP%]   .daterangepicker-container__weekdays[_ngcontent-%COMP%]   .daterangepicker-container__weekday[_ngcontent-%COMP%]{width:36px;height:18px;text-align:center}@media only screen and (max-width: 900px){.daterangepicker-container[_ngcontent-%COMP%]   .daterangepicker-container__view[_ngcontent-%COMP%]   .daterangepicker-container__body[_ngcontent-%COMP%]   .daterangepicker-container__weekdays[_ngcontent-%COMP%]   .daterangepicker-container__weekday[_ngcontent-%COMP%]{margin:0 auto}}.daterangepicker-container[_ngcontent-%COMP%]   .daterangepicker-container__view[_ngcontent-%COMP%]   .daterangepicker-container__body[_ngcontent-%COMP%]   .daterangepicker-container__weekdays[_ngcontent-%COMP%]   .daterangepicker-container__weekday[_ngcontent-%COMP%]   span[_ngcontent-%COMP%]{font-size:12px;font-style:normal;font-weight:400;line-height:18px;letter-spacing:.2px;text-align:center;color:#6a737d}@media only screen and (max-width: 900px){.daterangepicker-container[_ngcontent-%COMP%]   .daterangepicker-container__view[_ngcontent-%COMP%]   .daterangepicker-container__body[_ngcontent-%COMP%]   .daterangepicker-container__weekdays[_ngcontent-%COMP%]   .daterangepicker-container__weekday[_ngcontent-%COMP%]   span[_ngcontent-%COMP%]{font-size:3vw}}.daterangepicker-container[_ngcontent-%COMP%]   .daterangepicker-container__view[_ngcontent-%COMP%]   .daterangepicker-container__body[_ngcontent-%COMP%]   .daterangepicker-container__weekdays[_ngcontent-%COMP%]   .daterangepicker-container__weekday[_ngcontent-%COMP%]   span.current-day[_ngcontent-%COMP%]{font-weight:700;letter-spacing:.25px;color:#181f33}.daterangepicker-container[_ngcontent-%COMP%]   .daterangepicker-container__view[_ngcontent-%COMP%]   .daterangepicker-container__body[_ngcontent-%COMP%]   .daterangepicker-container__days[_ngcontent-%COMP%]{display:flex;flex-wrap:wrap}@media only screen and (max-width: 900px){.daterangepicker-container[_ngcontent-%COMP%]   .daterangepicker-container__view[_ngcontent-%COMP%]   .daterangepicker-container__body[_ngcontent-%COMP%]   .daterangepicker-container__days[_ngcontent-%COMP%]{display:flex;flex-direction:row;flex-wrap:wrap;flex:0 0 14.2857142857%}}.daterangepicker-container[_ngcontent-%COMP%]   .daterangepicker-container__view[_ngcontent-%COMP%]   .daterangepicker-container__body[_ngcontent-%COMP%]   .daterangepicker-container__days[_ngcontent-%COMP%]   .daterangepicker-container__day[_ngcontent-%COMP%]{width:36px;height:36px;display:flex;align-items:center;justify-content:center}@media only screen and (max-width: 900px){.daterangepicker-container[_ngcontent-%COMP%]   .daterangepicker-container__view[_ngcontent-%COMP%]   .daterangepicker-container__body[_ngcontent-%COMP%]   .daterangepicker-container__days[_ngcontent-%COMP%]   .daterangepicker-container__day[_ngcontent-%COMP%]{flex:0 0 14.2857142857%;width:14.2857142857%;height:14.2857142857%;aspect-ratio:1}}.daterangepicker-container[_ngcontent-%COMP%]   .daterangepicker-container__view[_ngcontent-%COMP%]   .daterangepicker-container__body[_ngcontent-%COMP%]   .daterangepicker-container__days[_ngcontent-%COMP%]   .daterangepicker-container__day[_ngcontent-%COMP%]:not(.in-range-day):not(.selected-start-day):not(.selected-end-day){border-radius:4px}.daterangepicker-container[_ngcontent-%COMP%]   .daterangepicker-container__view[_ngcontent-%COMP%]   .daterangepicker-container__body[_ngcontent-%COMP%]   .daterangepicker-container__days[_ngcontent-%COMP%]   .daterangepicker-container__day.disabled-day[_ngcontent-%COMP%]{cursor:default}.daterangepicker-container[_ngcontent-%COMP%]   .daterangepicker-container__view[_ngcontent-%COMP%]   .daterangepicker-container__body[_ngcontent-%COMP%]   .daterangepicker-container__days[_ngcontent-%COMP%]   .daterangepicker-container__day.disabled-day[_ngcontent-%COMP%]:hover{background-color:transparent}.daterangepicker-container[_ngcontent-%COMP%]   .daterangepicker-container__view[_ngcontent-%COMP%]   .daterangepicker-container__body[_ngcontent-%COMP%]   .daterangepicker-container__days[_ngcontent-%COMP%]   .daterangepicker-container__day.disabled-day[_ngcontent-%COMP%] > span[_ngcontent-%COMP%]{color:#6a737d}.daterangepicker-container[_ngcontent-%COMP%]   .daterangepicker-container__view[_ngcontent-%COMP%]   .daterangepicker-container__body[_ngcontent-%COMP%]   .daterangepicker-container__days[_ngcontent-%COMP%]   .daterangepicker-container__day.is-valid-date[_ngcontent-%COMP%]:not(.disabled-day):not(.selected-start-day):not(.selected-end-day) > span[_ngcontent-%COMP%]{color:#181f33}.daterangepicker-container[_ngcontent-%COMP%]   .daterangepicker-container__view[_ngcontent-%COMP%]   .daterangepicker-container__body[_ngcontent-%COMP%]   .daterangepicker-container__days[_ngcontent-%COMP%]   .daterangepicker-container__day.is-valid-date[_ngcontent-%COMP%]:not(.disabled-day):not(.selected-start-day):not(.selected-end-day):hover{background-color:#cbddfb;cursor:pointer}.daterangepicker-container[_ngcontent-%COMP%]   .daterangepicker-container__view[_ngcontent-%COMP%]   .daterangepicker-container__body[_ngcontent-%COMP%]   .daterangepicker-container__days[_ngcontent-%COMP%]   .daterangepicker-container__day[_ngcontent-%COMP%]   span[_ngcontent-%COMP%]{font-size:14px;font-style:normal;font-weight:400;line-height:20px;letter-spacing:.2px;text-align:center;color:#181f33}@media only screen and (max-width: 900px){.daterangepicker-container[_ngcontent-%COMP%]   .daterangepicker-container__view[_ngcontent-%COMP%]   .daterangepicker-container__body[_ngcontent-%COMP%]   .daterangepicker-container__days[_ngcontent-%COMP%]   .daterangepicker-container__day[_ngcontent-%COMP%]   span[_ngcontent-%COMP%]{font-size:3.4vw}}.daterangepicker-container[_ngcontent-%COMP%]   .daterangepicker-container__view[_ngcontent-%COMP%]   .daterangepicker-container__body[_ngcontent-%COMP%]   .daterangepicker-container__days[_ngcontent-%COMP%]   .daterangepicker-container__day[_ngcontent-%COMP%]   span.current-day[_ngcontent-%COMP%]{font-weight:700;letter-spacing:.25px}.daterangepicker-container[_ngcontent-%COMP%]   .daterangepicker-container__view[_ngcontent-%COMP%]   .daterangepicker-container__body[_ngcontent-%COMP%]   .daterangepicker-container__days[_ngcontent-%COMP%]   .daterangepicker-container__day[_ngcontent-%COMP%]   span.selected-day[_ngcontent-%COMP%]{color:#fff}.daterangepicker-container[_ngcontent-%COMP%]   .daterangepicker-container__view[_ngcontent-%COMP%]   .daterangepicker-container__body[_ngcontent-%COMP%]   .daterangepicker-container__days[_ngcontent-%COMP%]   .daterangepicker-container__day[_ngcontent-%COMP%]   span.disabled-day[_ngcontent-%COMP%]{color:#6a737d}.daterangepicker-container[_ngcontent-%COMP%]   .daterangepicker-container__view[_ngcontent-%COMP%]   .daterangepicker-container__body[_ngcontent-%COMP%]   .daterangepicker-container__days[_ngcontent-%COMP%]   .selected-same-day[_ngcontent-%COMP%]{background-color:#0937b2;border-radius:50%!important}.daterangepicker-container[_ngcontent-%COMP%]   .daterangepicker-container__view[_ngcontent-%COMP%]   .daterangepicker-container__body[_ngcontent-%COMP%]   .daterangepicker-container__days[_ngcontent-%COMP%]   .selected-same-day[_ngcontent-%COMP%] > span[_ngcontent-%COMP%]{color:#fff}.daterangepicker-container[_ngcontent-%COMP%]   .daterangepicker-container__view[_ngcontent-%COMP%]   .daterangepicker-container__body[_ngcontent-%COMP%]   .daterangepicker-container__days[_ngcontent-%COMP%]   .selected-start-day[_ngcontent-%COMP%]{background-color:#0937b2;border-radius:20px 4px 4px 20px}.daterangepicker-container[_ngcontent-%COMP%]   .daterangepicker-container__view[_ngcontent-%COMP%]   .daterangepicker-container__body[_ngcontent-%COMP%]   .daterangepicker-container__days[_ngcontent-%COMP%]   .selected-start-day[_ngcontent-%COMP%] > span[_ngcontent-%COMP%]{color:#fff}.daterangepicker-container[_ngcontent-%COMP%]   .daterangepicker-container__view[_ngcontent-%COMP%]   .daterangepicker-container__body[_ngcontent-%COMP%]   .daterangepicker-container__days[_ngcontent-%COMP%]   .selected-end-day[_ngcontent-%COMP%]{background-color:#0937b2;border-radius:0 20px 20px 0}.daterangepicker-container[_ngcontent-%COMP%]   .daterangepicker-container__view[_ngcontent-%COMP%]   .daterangepicker-container__body[_ngcontent-%COMP%]   .daterangepicker-container__days[_ngcontent-%COMP%]   .selected-end-day[_ngcontent-%COMP%] > span[_ngcontent-%COMP%]{color:#fff}.daterangepicker-container[_ngcontent-%COMP%]   .daterangepicker-container__view[_ngcontent-%COMP%]   .daterangepicker-container__body[_ngcontent-%COMP%]   .daterangepicker-container__days[_ngcontent-%COMP%]   .in-range-day[_ngcontent-%COMP%]:not(.disabled-day){background-color:#cbddfb}.daterangepicker-container[_ngcontent-%COMP%]   .daterangepicker-container__time[_ngcontent-%COMP%]{border-top:1px solid #e0e0e0;padding:16px 24px;background-color:#f8f9fa;display:flex;gap:24px}.daterangepicker-container[_ngcontent-%COMP%]   .daterangepicker-container__time[_ngcontent-%COMP%]   .time-section[_ngcontent-%COMP%]{flex:1}.daterangepicker-container[_ngcontent-%COMP%]   .daterangepicker-container__time[_ngcontent-%COMP%]   .time-section[_ngcontent-%COMP%]   h4[_ngcontent-%COMP%]{margin:0 0 8px;font-size:14px;font-weight:600;color:#333}.daterangepicker-container[_ngcontent-%COMP%]   .daterangepicker-container__time[_ngcontent-%COMP%]   .time-section[_ngcontent-%COMP%]   .time-inputs[_ngcontent-%COMP%]{display:flex;align-items:center;gap:8px}.daterangepicker-container[_ngcontent-%COMP%]   .daterangepicker-container__time[_ngcontent-%COMP%]   .time-section[_ngcontent-%COMP%]   .time-inputs[_ngcontent-%COMP%]   .time-input[_ngcontent-%COMP%]{width:60px;padding:8px;border:1px solid #ddd;border-radius:4px;text-align:center;font-size:14px}.daterangepicker-container[_ngcontent-%COMP%]   .daterangepicker-container__time[_ngcontent-%COMP%]   .time-section[_ngcontent-%COMP%]   .time-inputs[_ngcontent-%COMP%]   .time-input[_ngcontent-%COMP%]:focus{outline:none;border-color:#0937b2;box-shadow:0 0 0 2px #0937b233}.daterangepicker-container[_ngcontent-%COMP%]   .daterangepicker-container__time[_ngcontent-%COMP%]   .time-section[_ngcontent-%COMP%]   .time-inputs[_ngcontent-%COMP%]   .time-input.hour-input[_ngcontent-%COMP%], .daterangepicker-container[_ngcontent-%COMP%]   .daterangepicker-container__time[_ngcontent-%COMP%]   .time-section[_ngcontent-%COMP%]   .time-inputs[_ngcontent-%COMP%]   .time-input.minute-input[_ngcontent-%COMP%]{width:50px}.daterangepicker-container[_ngcontent-%COMP%]   .daterangepicker-container__time[_ngcontent-%COMP%]   .time-section[_ngcontent-%COMP%]   .time-inputs[_ngcontent-%COMP%]   .time-separator[_ngcontent-%COMP%]{font-size:16px;font-weight:600;color:#666}.daterangepicker-container[_ngcontent-%COMP%]   .daterangepicker-container__time[_ngcontent-%COMP%]   .time-section[_ngcontent-%COMP%]   .time-inputs[_ngcontent-%COMP%]   .am-pm-selector[_ngcontent-%COMP%]{padding:7.1px 12px;border:1px solid #ddd;border-radius:4px;background-color:#fff;font-size:14px;cursor:pointer}.daterangepicker-container[_ngcontent-%COMP%]   .daterangepicker-container__time[_ngcontent-%COMP%]   .time-section[_ngcontent-%COMP%]   .time-inputs[_ngcontent-%COMP%]   .am-pm-selector[_ngcontent-%COMP%]:focus{outline:none;border-color:#0937b2}.daterangepicker-container[_ngcontent-%COMP%]   .daterangepicker__footer[_ngcontent-%COMP%]{display:flex;justify-content:flex-end;border-top:1px solid #e0e0e0;padding:16px 24px;gap:24px}@media only screen and (max-width: 900px){.daterangepicker-container[_ngcontent-%COMP%]   .daterangepicker__footer[_ngcontent-%COMP%]{justify-content:space-evenly;padding:2% 0;background-color:#fff;position:fixed;bottom:0;left:0;width:100%;height:8vh;border-top:2px solid #C8CDD3}.daterangepicker-container[_ngcontent-%COMP%]   .daterangepicker__footer[_ngcontent-%COMP%]   #mobile-footer-btn[_ngcontent-%COMP%]{width:36%;font-size:3.8vw}}"] }); }
+        } }, dependencies: [i2.NgClass, i2.NgForOf, i2.NgIf, i3.NgSelectOption, i3.ɵNgSelectMultipleOption, i3.DefaultValueAccessor, i3.NumberValueAccessor, i3.SelectControlValueAccessor, i3.NgControlStatus, i3.MinValidator, i3.MaxValidator, i3.NgModel, i4.ButtonDirective, i5.CdkTrapFocus], styles: ["[_ngcontent-%COMP%]:root{--pmry-200: #99BAF7;--pmry-100: #CBDDFB;--pmry-500: #0937B2;--pmry-400: #3C68D0;--pmry-600: #062A99;--pmry-700: #041F80;--pmry-300: #638FE7;--pmry-800: #021567;--pmry-900: #010F55;--sec-d-purple: #40447F;--sec-maroon: #6B034E;--sec-mud-red: #B23600;--sec-orange: #ED711C;--sec-purple: #815FD5;--sec-teal: #10ADAE;--sec-yellow: #D4900C;--sec-green: #547F40;--sec-bright-green: #27D22E;--sec-dark-teal: #035F6B;--sec-chocolate: #7C2F33;--sec-rube-pink: #C13D6D;--sec-cerulean: #0087B2;--sem-error: #B00020;--sem-info: #0091FF;--sem-warning: #FF9D00;--sem-success: #38AF49;--grey-bg-1: #FAFAFA;--grey-bg: #F5F5F5;--grey-seperators: #E0E0E0;--grey-disabled: #C8CDD3;--grey-hover: #F5F7FC;--grey-pressed: #E6EBF7;--grey-row: #F5F7FC;--dec-light-yellow: #F4E7C3;--dec-light-purple: #DACFF9;--dec-light-green: #E4F5E9;--dec-light-green2: #F1FFF3;--dec-light-pink: #FAE1EA;--dec-: #F4CBC1;--dec-lt-orange: #FAEFED;--dec-light-blue: #CFECF9;--dec-row-selection: #F1FDF8;--dec-row-selection2: #F2FBFF;--dec-row-lines: #D3E1E9;--text-white: #FFFFFF;--text-muted: #6A737D;--text-black: #181F33;--MR-solid-blue2:#C8D5F6;--MR-solid-purple:#C9C3FB;--MR-solid-orange:#EEAC9F;--MR-solid-green:#ACDADA;--MR-solid-brown:#E8C8AF;--MR-solid-yellow:#FFEFC7;--MR-solid-blue:#BBE6FF;--MR-solid-pink:#FFC6F2;--tr-hover:#F0F3FA;--tr-pressed:#DAE1F3;--brand-primary: #0937B2;--brand-primary-light: #3C68D0;--brand-primary-dark: #062A99;--brand-primary-darker: #041F80;--brand-primary-lighter: #638FE7;--brand-primary-lightest: #CBDDFB;--brand-primary-hover: #F0F3FA;--brand-primary-active: #DAE1F3;--brand-secondary: #ED711C;--brand-secondary-light: #F09E65;--brand-secondary-dark: #B23600;--brand-secondary-lighter: #FFC6F2;--brand-accent: #10ADAE;--brand-accent-light: #16CBBC;--brand-accent-dark: #035F6B;--brand-accent-lighter: #ACDADA;--brand-success: #38AF49;--brand-success-light: #4CAF50;--brand-success-dark: #216531;--brand-success-lighter: #E4F5E9;--brand-success-lightest: #F1FFF3;--brand-error: #B00020;--brand-error-light: #F04E4E;--brand-error-dark: #A60060;--brand-error-lighter: #FAE1EA;--brand-error-lightest: #FDF2F2;--brand-warning: #FF9D00;--brand-warning-light: #D4900C;--brand-warning-dark: #624000;--brand-warning-lighter: #F4E7C3;--brand-warning-lightest: #FAEFED;--brand-info: #0091FF;--brand-info-light: #35A1FF;--brand-info-dark: #0087B2;--brand-info-lighter: #CFECF9;--text-primary: #181F33;--text-secondary: #6A737D;--text-tertiary: #929DAB;--text-disabled: #929DAB;--text-primary-87: rgba(24, 31, 51, .87);--text-primary-60: rgba(24, 31, 51, .6);--text-primary-38: rgba(24, 31, 51, .38);--text-primary-12: rgba(24, 31, 51, .12);--bg-primary: #FFFFFF;--bg-secondary: #FAFAFA;--bg-tertiary: #F5F5F5;--bg-overlay: rgba(0, 0, 0, .32);--bg-overlay-light: rgba(0, 0, 0, .12);--bg-overlay-lighter: rgba(0, 0, 0, .08);--bg-overlay-lightest: rgba(0, 0, 0, .04);--border-primary: #E0E0E0;--border-secondary: #D6DCE2;--border-tertiary: #C8CDD3;--border-light: #F1F4F8;--border-primary-12: rgba(0, 0, 0, .12);--border-primary-08: rgba(0, 0, 0, .08);--border-primary-06: rgba(0, 0, 0, .06);--shadow-primary: rgba(0, 0, 0, .12);--shadow-secondary: rgba(0, 0, 0, .08);--shadow-tertiary: rgba(0, 0, 0, .04);--shadow-light: rgba(0, 0, 0, .06);--status-available: #929DAB;--status-unavailable: #CCD3DA;--status-hotseat: #857BFF;--status-multiteam: #10ADAE;--status-selected: #10ADAE;--status-upcoming: #D4900C;--status-room: #38AF49;--status-room-booked: #B23600;--status-room-unavailable: #181F33;--team-color-1: #F8C52E;--team-color-2: #FA8E20;--team-color-3: #987CDD;--team-color-4: #16CBBC;--team-color-5: #E65010;--team-color-6: #A60060;--team-color-7: #ED323B;--team-color-8: #35A1FF;--team-color-9: #80D348}.daterangepicker-container[_ngcontent-%COMP%]{background:var(--bg-primary, #FFFFFF);border:1px solid var(--border-primary, #E0E0E0);box-shadow:0 12px 24px #0000001f,0 4px 8px #0000001f;border-radius:12px;display:flex;flex-direction:column;font-family:Lato;overflow:hidden;-webkit-user-select:none;user-select:none}@media only screen and (max-width: 900px){.daterangepicker-container[_ngcontent-%COMP%]{max-width:100vw;border:none}}.daterangepicker-container[_ngcontent-%COMP%]   .daterangepicker-container__view[_ngcontent-%COMP%]{display:flex;gap:24px;padding:16px}.daterangepicker-container[_ngcontent-%COMP%]   .daterangepicker-container__view[_ngcontent-%COMP%]   .daterangepicker-container__ranges[_ngcontent-%COMP%]{display:flex;flex-direction:column}.daterangepicker-container[_ngcontent-%COMP%]   .daterangepicker-container__view[_ngcontent-%COMP%]   .mis-btn[_ngcontent-%COMP%]{background:none;outline:none;border:none;cursor:pointer;border-radius:4px;vertical-align:middle;text-align:center;box-sizing:border-box;display:flex;align-items:center;text-decoration:none;justify-content:center;padding:10px 16px;font-size:16px;line-height:24px;background-color:transparent;color:var(--brand-primary, #0937B2)}.daterangepicker-container[_ngcontent-%COMP%]   .daterangepicker-container__view[_ngcontent-%COMP%]   .active-range[_ngcontent-%COMP%]{background-color:var(--brand-primary-lightest, #CBDDFB)}@media only screen and (max-width: 900px){.daterangepicker-container[_ngcontent-%COMP%]   .daterangepicker-container__view[_ngcontent-%COMP%]{flex-direction:column;align-items:center;position:fixed;bottom:0;left:0;background-color:#fff;width:100%;max-height:68vh;overflow-y:auto;border-radius:30px;gap:24px;padding:10% 0 30%;box-shadow:0 -4px 8px 10000px #0000001f;scrollbar-width:none;-ms-overflow-style:none}.daterangepicker-container[_ngcontent-%COMP%]   .daterangepicker-container__view[_ngcontent-%COMP%]   .daterangepicker-container__view[_ngcontent-%COMP%]::-webkit-scrollbar{display:none}}.daterangepicker-container[_ngcontent-%COMP%]   .daterangepicker-container__view[_ngcontent-%COMP%]   .datepicker__left[_ngcontent-%COMP%], .daterangepicker-container[_ngcontent-%COMP%]   .daterangepicker-container__view[_ngcontent-%COMP%]   .datepicker__right[_ngcontent-%COMP%]{display:flex;flex-direction:column}@media only screen and (max-width: 900px){.daterangepicker-container[_ngcontent-%COMP%]   .daterangepicker-container__view[_ngcontent-%COMP%]   .datepicker__left[_ngcontent-%COMP%], .daterangepicker-container[_ngcontent-%COMP%]   .daterangepicker-container__view[_ngcontent-%COMP%]   .datepicker__right[_ngcontent-%COMP%]{width:90%}}.daterangepicker-container[_ngcontent-%COMP%]   .daterangepicker-container__view[_ngcontent-%COMP%]   .daterangepicker-container__header__prabu[_ngcontent-%COMP%]{display:flex;height:32px;justify-content:space-between;align-items:center;width:100%;padding-bottom:10%}.daterangepicker-container[_ngcontent-%COMP%]   .daterangepicker-container__view[_ngcontent-%COMP%]   .daterangepicker-container__header__prabu[_ngcontent-%COMP%]   span[_ngcontent-%COMP%]{font-size:16px;font-style:normal;font-weight:700;line-height:24px;letter-spacing:.2px;text-align:center}@media only screen and (max-width: 900px){.daterangepicker-container[_ngcontent-%COMP%]   .daterangepicker-container__view[_ngcontent-%COMP%]   .daterangepicker-container__header__prabu[_ngcontent-%COMP%]   span[_ngcontent-%COMP%]{margin:0 auto;font-size:4vw}}.daterangepicker-container[_ngcontent-%COMP%]   .daterangepicker-container__view[_ngcontent-%COMP%]   .daterangepicker-container__header__prabu[_ngcontent-%COMP%]   .daterangepicker-container__arrow__icon[_ngcontent-%COMP%]{height:20px;width:20px;display:flex;align-items:center;justify-content:center;border-radius:4px;padding:4px}.daterangepicker-container[_ngcontent-%COMP%]   .daterangepicker-container__view[_ngcontent-%COMP%]   .daterangepicker-container__header__prabu[_ngcontent-%COMP%]   .daterangepicker-container__arrow__icon.disabled-month[_ngcontent-%COMP%]{opacity:.5;cursor:not-allowed}.daterangepicker-container[_ngcontent-%COMP%]   .daterangepicker-container__view[_ngcontent-%COMP%]   .daterangepicker-container__header__prabu[_ngcontent-%COMP%]   .daterangepicker-container__arrow__icon[_ngcontent-%COMP%]:not(.disabled-month):hover{cursor:pointer;background-color:var(--brand-primary-lightest, #CBDDFB)}.daterangepicker-container[_ngcontent-%COMP%]   .daterangepicker-container__view[_ngcontent-%COMP%]   .daterangepicker-container__header__prabu[_ngcontent-%COMP%]   .daterangepicker-container__arrow__icon[_ngcontent-%COMP%]:nth-child(1){transform:rotate(180deg)}@media only screen and (max-width: 900px){.daterangepicker-container[_ngcontent-%COMP%]   .daterangepicker-container__view[_ngcontent-%COMP%]   .daterangepicker-container__header__prabu[_ngcontent-%COMP%]   .daterangepicker-container__arrow__icon[_ngcontent-%COMP%]{width:7%}}@media only screen and (min-width: 900px){.daterangepicker-container[_ngcontent-%COMP%]   .daterangepicker-container__view[_ngcontent-%COMP%]   .daterangepicker-container__header__prabu[_ngcontent-%COMP%]   .mobile_view[_ngcontent-%COMP%]{display:none}}@media only screen and (max-width: 900px){.daterangepicker-container[_ngcontent-%COMP%]   .daterangepicker-container__view[_ngcontent-%COMP%]   .daterangepicker-container__header__prabu[_ngcontent-%COMP%]   .pc_view[_ngcontent-%COMP%]{display:none}}.daterangepicker-container[_ngcontent-%COMP%]   .daterangepicker-container__view[_ngcontent-%COMP%]   .daterangepicker-container__body[_ngcontent-%COMP%]{height:100%;width:252px}@media only screen and (max-width: 900px){.daterangepicker-container[_ngcontent-%COMP%]   .daterangepicker-container__view[_ngcontent-%COMP%]   .daterangepicker-container__body[_ngcontent-%COMP%]{width:100%}}.daterangepicker-container[_ngcontent-%COMP%]   .daterangepicker-container__view[_ngcontent-%COMP%]   .daterangepicker-container__body[_ngcontent-%COMP%]   .daterangepicker-container__weekdays[_ngcontent-%COMP%]{width:100%;display:flex;padding-bottom:10px}@media only screen and (max-width: 900px){.daterangepicker-container[_ngcontent-%COMP%]   .daterangepicker-container__view[_ngcontent-%COMP%]   .daterangepicker-container__body[_ngcontent-%COMP%]   .daterangepicker-container__weekdays[_ngcontent-%COMP%]{display:flex;flex-direction:row;flex-wrap:wrap;flex:0 0 14.2857142857%}}.daterangepicker-container[_ngcontent-%COMP%]   .daterangepicker-container__view[_ngcontent-%COMP%]   .daterangepicker-container__body[_ngcontent-%COMP%]   .daterangepicker-container__weekdays[_ngcontent-%COMP%]   .daterangepicker-container__weekday[_ngcontent-%COMP%]{width:36px;height:18px;text-align:center}@media only screen and (max-width: 900px){.daterangepicker-container[_ngcontent-%COMP%]   .daterangepicker-container__view[_ngcontent-%COMP%]   .daterangepicker-container__body[_ngcontent-%COMP%]   .daterangepicker-container__weekdays[_ngcontent-%COMP%]   .daterangepicker-container__weekday[_ngcontent-%COMP%]{margin:0 auto}}.daterangepicker-container[_ngcontent-%COMP%]   .daterangepicker-container__view[_ngcontent-%COMP%]   .daterangepicker-container__body[_ngcontent-%COMP%]   .daterangepicker-container__weekdays[_ngcontent-%COMP%]   .daterangepicker-container__weekday[_ngcontent-%COMP%]   span[_ngcontent-%COMP%]{font-size:12px;font-style:normal;font-weight:400;line-height:18px;letter-spacing:.2px;text-align:center;color:var(--text-secondary, #6A737D)}@media only screen and (max-width: 900px){.daterangepicker-container[_ngcontent-%COMP%]   .daterangepicker-container__view[_ngcontent-%COMP%]   .daterangepicker-container__body[_ngcontent-%COMP%]   .daterangepicker-container__weekdays[_ngcontent-%COMP%]   .daterangepicker-container__weekday[_ngcontent-%COMP%]   span[_ngcontent-%COMP%]{font-size:3vw}}.daterangepicker-container[_ngcontent-%COMP%]   .daterangepicker-container__view[_ngcontent-%COMP%]   .daterangepicker-container__body[_ngcontent-%COMP%]   .daterangepicker-container__weekdays[_ngcontent-%COMP%]   .daterangepicker-container__weekday[_ngcontent-%COMP%]   span.current-day[_ngcontent-%COMP%]{font-weight:700;letter-spacing:.25px;color:var(--text-primary, #181F33)}.daterangepicker-container[_ngcontent-%COMP%]   .daterangepicker-container__view[_ngcontent-%COMP%]   .daterangepicker-container__body[_ngcontent-%COMP%]   .daterangepicker-container__days[_ngcontent-%COMP%]{display:flex;flex-wrap:wrap}@media only screen and (max-width: 900px){.daterangepicker-container[_ngcontent-%COMP%]   .daterangepicker-container__view[_ngcontent-%COMP%]   .daterangepicker-container__body[_ngcontent-%COMP%]   .daterangepicker-container__days[_ngcontent-%COMP%]{display:flex;flex-direction:row;flex-wrap:wrap;flex:0 0 14.2857142857%}}.daterangepicker-container[_ngcontent-%COMP%]   .daterangepicker-container__view[_ngcontent-%COMP%]   .daterangepicker-container__body[_ngcontent-%COMP%]   .daterangepicker-container__days[_ngcontent-%COMP%]   .daterangepicker-container__day[_ngcontent-%COMP%]{width:36px;height:36px;display:flex;align-items:center;justify-content:center}@media only screen and (max-width: 900px){.daterangepicker-container[_ngcontent-%COMP%]   .daterangepicker-container__view[_ngcontent-%COMP%]   .daterangepicker-container__body[_ngcontent-%COMP%]   .daterangepicker-container__days[_ngcontent-%COMP%]   .daterangepicker-container__day[_ngcontent-%COMP%]{flex:0 0 14.2857142857%;width:14.2857142857%;height:14.2857142857%;aspect-ratio:1}}.daterangepicker-container[_ngcontent-%COMP%]   .daterangepicker-container__view[_ngcontent-%COMP%]   .daterangepicker-container__body[_ngcontent-%COMP%]   .daterangepicker-container__days[_ngcontent-%COMP%]   .daterangepicker-container__day[_ngcontent-%COMP%]:not(.in-range-day):not(.selected-start-day):not(.selected-end-day){border-radius:4px}.daterangepicker-container[_ngcontent-%COMP%]   .daterangepicker-container__view[_ngcontent-%COMP%]   .daterangepicker-container__body[_ngcontent-%COMP%]   .daterangepicker-container__days[_ngcontent-%COMP%]   .daterangepicker-container__day.disabled-day[_ngcontent-%COMP%]{cursor:default}.daterangepicker-container[_ngcontent-%COMP%]   .daterangepicker-container__view[_ngcontent-%COMP%]   .daterangepicker-container__body[_ngcontent-%COMP%]   .daterangepicker-container__days[_ngcontent-%COMP%]   .daterangepicker-container__day.disabled-day[_ngcontent-%COMP%]:hover{background-color:transparent}.daterangepicker-container[_ngcontent-%COMP%]   .daterangepicker-container__view[_ngcontent-%COMP%]   .daterangepicker-container__body[_ngcontent-%COMP%]   .daterangepicker-container__days[_ngcontent-%COMP%]   .daterangepicker-container__day.disabled-day[_ngcontent-%COMP%] > span[_ngcontent-%COMP%]{color:var(--text-secondary, #6A737D)}.daterangepicker-container[_ngcontent-%COMP%]   .daterangepicker-container__view[_ngcontent-%COMP%]   .daterangepicker-container__body[_ngcontent-%COMP%]   .daterangepicker-container__days[_ngcontent-%COMP%]   .daterangepicker-container__day.is-valid-date[_ngcontent-%COMP%]:not(.disabled-day):not(.selected-start-day):not(.selected-end-day) > span[_ngcontent-%COMP%]{color:var(--text-primary, #181F33)}.daterangepicker-container[_ngcontent-%COMP%]   .daterangepicker-container__view[_ngcontent-%COMP%]   .daterangepicker-container__body[_ngcontent-%COMP%]   .daterangepicker-container__days[_ngcontent-%COMP%]   .daterangepicker-container__day.is-valid-date[_ngcontent-%COMP%]:not(.disabled-day):not(.selected-start-day):not(.selected-end-day):hover{background-color:var(--brand-primary-lightest, #CBDDFB);cursor:pointer}.daterangepicker-container[_ngcontent-%COMP%]   .daterangepicker-container__view[_ngcontent-%COMP%]   .daterangepicker-container__body[_ngcontent-%COMP%]   .daterangepicker-container__days[_ngcontent-%COMP%]   .daterangepicker-container__day[_ngcontent-%COMP%]   span[_ngcontent-%COMP%]{font-size:14px;font-style:normal;font-weight:400;line-height:20px;letter-spacing:.2px;text-align:center;color:var(--text-primary, #181F33)}@media only screen and (max-width: 900px){.daterangepicker-container[_ngcontent-%COMP%]   .daterangepicker-container__view[_ngcontent-%COMP%]   .daterangepicker-container__body[_ngcontent-%COMP%]   .daterangepicker-container__days[_ngcontent-%COMP%]   .daterangepicker-container__day[_ngcontent-%COMP%]   span[_ngcontent-%COMP%]{font-size:3.4vw}}.daterangepicker-container[_ngcontent-%COMP%]   .daterangepicker-container__view[_ngcontent-%COMP%]   .daterangepicker-container__body[_ngcontent-%COMP%]   .daterangepicker-container__days[_ngcontent-%COMP%]   .daterangepicker-container__day[_ngcontent-%COMP%]   span.current-day[_ngcontent-%COMP%]{font-weight:700;letter-spacing:.25px}.daterangepicker-container[_ngcontent-%COMP%]   .daterangepicker-container__view[_ngcontent-%COMP%]   .daterangepicker-container__body[_ngcontent-%COMP%]   .daterangepicker-container__days[_ngcontent-%COMP%]   .daterangepicker-container__day[_ngcontent-%COMP%]   span.selected-day[_ngcontent-%COMP%]{color:var(--bg-primary, #FFFFFF)}.daterangepicker-container[_ngcontent-%COMP%]   .daterangepicker-container__view[_ngcontent-%COMP%]   .daterangepicker-container__body[_ngcontent-%COMP%]   .daterangepicker-container__days[_ngcontent-%COMP%]   .daterangepicker-container__day[_ngcontent-%COMP%]   span.disabled-day[_ngcontent-%COMP%]{color:var(--text-secondary, #6A737D)}.daterangepicker-container[_ngcontent-%COMP%]   .daterangepicker-container__view[_ngcontent-%COMP%]   .daterangepicker-container__body[_ngcontent-%COMP%]   .daterangepicker-container__days[_ngcontent-%COMP%]   .selected-same-day[_ngcontent-%COMP%]{background-color:var(--brand-primary, #0937B2);border-radius:50%!important}.daterangepicker-container[_ngcontent-%COMP%]   .daterangepicker-container__view[_ngcontent-%COMP%]   .daterangepicker-container__body[_ngcontent-%COMP%]   .daterangepicker-container__days[_ngcontent-%COMP%]   .selected-same-day[_ngcontent-%COMP%] > span[_ngcontent-%COMP%]{color:var(--bg-primary, #FFFFFF)}.daterangepicker-container[_ngcontent-%COMP%]   .daterangepicker-container__view[_ngcontent-%COMP%]   .daterangepicker-container__body[_ngcontent-%COMP%]   .daterangepicker-container__days[_ngcontent-%COMP%]   .selected-start-day[_ngcontent-%COMP%]{background-color:var(--brand-primary, #0937B2);border-radius:20px 4px 4px 20px}.daterangepicker-container[_ngcontent-%COMP%]   .daterangepicker-container__view[_ngcontent-%COMP%]   .daterangepicker-container__body[_ngcontent-%COMP%]   .daterangepicker-container__days[_ngcontent-%COMP%]   .selected-start-day[_ngcontent-%COMP%] > span[_ngcontent-%COMP%]{color:var(--bg-primary, #FFFFFF)}.daterangepicker-container[_ngcontent-%COMP%]   .daterangepicker-container__view[_ngcontent-%COMP%]   .daterangepicker-container__body[_ngcontent-%COMP%]   .daterangepicker-container__days[_ngcontent-%COMP%]   .selected-end-day[_ngcontent-%COMP%]{background-color:var(--brand-primary, #0937B2);border-radius:0 20px 20px 0}.daterangepicker-container[_ngcontent-%COMP%]   .daterangepicker-container__view[_ngcontent-%COMP%]   .daterangepicker-container__body[_ngcontent-%COMP%]   .daterangepicker-container__days[_ngcontent-%COMP%]   .selected-end-day[_ngcontent-%COMP%] > span[_ngcontent-%COMP%]{color:var(--bg-primary, #FFFFFF)}.daterangepicker-container[_ngcontent-%COMP%]   .daterangepicker-container__view[_ngcontent-%COMP%]   .daterangepicker-container__body[_ngcontent-%COMP%]   .daterangepicker-container__days[_ngcontent-%COMP%]   .in-range-day[_ngcontent-%COMP%]:not(.disabled-day){background-color:var(--brand-primary-lightest, #CBDDFB)}.daterangepicker-container[_ngcontent-%COMP%]   .daterangepicker-container__time[_ngcontent-%COMP%]{border-top:1px solid var(--border-primary, #E0E0E0);padding:16px 24px;background-color:#f8f9fa;display:flex;gap:24px}.daterangepicker-container[_ngcontent-%COMP%]   .daterangepicker-container__time[_ngcontent-%COMP%]   .time-section[_ngcontent-%COMP%]{flex:1}.daterangepicker-container[_ngcontent-%COMP%]   .daterangepicker-container__time[_ngcontent-%COMP%]   .time-section[_ngcontent-%COMP%]   h4[_ngcontent-%COMP%]{margin:0 0 8px;font-size:14px;font-weight:600;color:#333}.daterangepicker-container[_ngcontent-%COMP%]   .daterangepicker-container__time[_ngcontent-%COMP%]   .time-section[_ngcontent-%COMP%]   .time-inputs[_ngcontent-%COMP%]{display:flex;align-items:center;gap:8px}.daterangepicker-container[_ngcontent-%COMP%]   .daterangepicker-container__time[_ngcontent-%COMP%]   .time-section[_ngcontent-%COMP%]   .time-inputs[_ngcontent-%COMP%]   .time-input[_ngcontent-%COMP%]{width:60px;padding:8px;border:1px solid #ddd;border-radius:4px;text-align:center;font-size:14px}.daterangepicker-container[_ngcontent-%COMP%]   .daterangepicker-container__time[_ngcontent-%COMP%]   .time-section[_ngcontent-%COMP%]   .time-inputs[_ngcontent-%COMP%]   .time-input[_ngcontent-%COMP%]:focus{outline:none;border-color:var(--brand-primary, #0937B2);box-shadow:0 0 0 2px #0937b233}.daterangepicker-container[_ngcontent-%COMP%]   .daterangepicker-container__time[_ngcontent-%COMP%]   .time-section[_ngcontent-%COMP%]   .time-inputs[_ngcontent-%COMP%]   .time-input.hour-input[_ngcontent-%COMP%], .daterangepicker-container[_ngcontent-%COMP%]   .daterangepicker-container__time[_ngcontent-%COMP%]   .time-section[_ngcontent-%COMP%]   .time-inputs[_ngcontent-%COMP%]   .time-input.minute-input[_ngcontent-%COMP%]{width:50px}.daterangepicker-container[_ngcontent-%COMP%]   .daterangepicker-container__time[_ngcontent-%COMP%]   .time-section[_ngcontent-%COMP%]   .time-inputs[_ngcontent-%COMP%]   .time-separator[_ngcontent-%COMP%]{font-size:16px;font-weight:600;color:#666}.daterangepicker-container[_ngcontent-%COMP%]   .daterangepicker-container__time[_ngcontent-%COMP%]   .time-section[_ngcontent-%COMP%]   .time-inputs[_ngcontent-%COMP%]   .am-pm-selector[_ngcontent-%COMP%]{padding:7.1px 12px;border:1px solid #ddd;border-radius:4px;background-color:#fff;font-size:14px;cursor:pointer}.daterangepicker-container[_ngcontent-%COMP%]   .daterangepicker-container__time[_ngcontent-%COMP%]   .time-section[_ngcontent-%COMP%]   .time-inputs[_ngcontent-%COMP%]   .am-pm-selector[_ngcontent-%COMP%]:focus{outline:none;border-color:var(--brand-primary, #0937B2)}.daterangepicker-container[_ngcontent-%COMP%]   .daterangepicker__footer[_ngcontent-%COMP%]{display:flex;justify-content:flex-end;border-top:1px solid var(--border-primary, #E0E0E0);padding:16px 24px;gap:24px}@media only screen and (max-width: 900px){.daterangepicker-container[_ngcontent-%COMP%]   .daterangepicker__footer[_ngcontent-%COMP%]{justify-content:space-evenly;padding:2% 0;background-color:var(--bg-primary, #FFFFFF);position:fixed;bottom:0;left:0;width:100%;height:8vh;border-top:2px solid var(--text-disabled, #C8CDD3)}.daterangepicker-container[_ngcontent-%COMP%]   .daterangepicker__footer[_ngcontent-%COMP%]   #mobile-footer-btn[_ngcontent-%COMP%]{width:36%;font-size:3.8vw}}"] }); }
 }
 (() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(TzDrpContainerComponent, [{
         type: Component,
-        args: [{ selector: "mis-tz-drp", template: "<div class=\"daterangepicker-container\" aria-label=\"date range picker\" cdkTrapFocus [cdkTrapFocusAutoCapture]=\"true\">\n  <div class=\"daterangepicker-container__view\">\n    <div tabindex=\"-1\" cdkFocusInitial></div>\n    <div *ngIf=\"data?.dpConfig?.ranges?.length > 0\" class=\"daterangepicker-container__ranges\">\n      <div *ngFor=\"let item of data?.dpConfig?.ranges ?? []\" >\n        <button\n        [ngClass]=\"{'active-range' : selectedItemLabel() === item.label}\"\n          (click)=\"selectRange(item)\"\n          class=\"mis-btn\"\n        >\n          {{ item.label }}\n        </button>\n      </div>\n      <div> <button class=\"mis-btn\" [ngClass]=\"{'active-range' : selectedItemLabel() === 'Custom Range'}\" (click)=\"resetRange()\">Custom Range</button> </div>\n  </div>\n    <div class=\"datepicker__left\">\n      <div class=\"daterangepicker-container__header__prabu\">\n        <div\n          class=\"daterangepicker-container__arrow__icon\"\n          tabindex=\"0\"\n          (click)=\"!isPreviousMonthDisabled() && navigateMonth('PREVIOUS')\"\n          (keyup.enter)=\"!isPreviousMonthDisabled() && navigateMonth('PREVIOUS')\"\n          aria-label=\"Previous Month\"\n          [ngClass]=\"{\n            'disabled-month': isPreviousMonthDisabled()\n          }\"\n        >\n          <svg width=\"20\" height=\"16\" viewBox=\"0 0 20 16\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n            <path\n              d=\"M19.7071 8.70711C20.0976 8.31658 20.0976 7.68342 19.7071 7.29289L13.3431 0.928933C12.9526 0.538409 12.3195 0.538409 11.9289 0.928933C11.5384 1.31946 11.5384 1.95262 11.9289 2.34315L17.5858 8L11.9289 13.6569C11.5384 14.0474 11.5384 14.6805 11.9289 15.0711C12.3195 15.4616 12.9526 15.4616 13.3431 15.0711L19.7071 8.70711ZM-8.74228e-08 9L19 9L19 7L8.74228e-08 7L-8.74228e-08 9Z\"\n              fill=\"#181F33\"\n            ></path>\n          </svg>\n        </div>\n        <span> {{ currentMonth() }} {{ currentYearNumber() }} </span>\n        <div></div>\n        <!-- Button visible in mobile view -->\n        <div\n          class=\"daterangepicker-container__arrow__icon mobile_view\"\n          tabindex=\"0\"\n          (click)=\"!isNextMonthDisabled() && navigateMonth('NEXT')\"\n          (keyup.enter)=\"!isNextMonthDisabled() && navigateMonth('NEXT')\"\n          aria-label=\"Next Month\"\n          [ngClass]=\"{\n            'disabled-month': isNextMonthDisabled()\n          }\"\n        >\n          <svg width=\"20\" height=\"16\" viewBox=\"0 0 20 16\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n            <path\n              d=\"M19.7071 8.70711C20.0976 8.31658 20.0976 7.68342 19.7071 7.29289L13.3431 0.928933C12.9526 0.538409 12.3195 0.538409 11.9289 0.928933C11.5384 1.31946 11.5384 1.95262 11.9289 2.34315L17.5858 8L11.9289 13.6569C11.5384 14.0474 11.5384 14.6805 11.9289 15.0711C12.3195 15.4616 12.9526 15.4616 13.3431 15.0711L19.7071 8.70711ZM-8.74228e-08 9L19 9L19 7L8.74228e-08 7L-8.74228e-08 9Z\"\n              fill=\"#181F33\"\n            ></path>\n          </svg>\n        </div>\n      </div>\n      <div class=\"daterangepicker-container__body\">\n        <div class=\"daterangepicker-container__weekdays\">\n          <div class=\"daterangepicker-container__weekday\" *ngFor=\"let weekDay of weekDays()\">\n            <span>{{ weekDay.label }}</span>\n          </div>\n        </div>\n        <div class=\"daterangepicker-container__days\">\n          <div\n            class=\"daterangepicker-container__day\" \n            [ngClass]=\"{\n              'selected-same-day': day.isSelectedStartDay && day.isSelectedEndDay,\n              'selected-start-day': day.isSelectedStartDay,\n              'selected-end-day': day.isSelectedEndDay,\n              'disabled-day': day.isDisabledDay,\n              'in-range-day': day.inRangeDay,\n              'is-valid-date': day.date > 0 && !(day.isSelectedStartDay && day.isSelectedEndDay)\n            }\"\n            *ngFor=\"let day of currentMonthDates()\"\n            (click)=\"selectDay('LEFT', day)\"\n            (keyup.enter)=\"selectDay('LEFT', day)\"\n          >\n            <span *ngIf=\"day.date > 0\"\n              [tabindex]=\"day.isDisabledDay ? -1 : 0\"\n              [attr.aria-label]=\"retractDayMonth(day.date, currentMonth(), currentYearNumber())\">\n              {{ day.date }}\n            </span>\n          </div>\n        </div>\n      </div>\n    </div>\n    <div class=\"datepicker__right\">\n      <div class=\"daterangepicker-container__header__prabu\">\n        <div></div>\n        <span> {{ nextMonth() }} {{ nextYearNumber() }} </span>\n        <div\n          class=\"daterangepicker-container__arrow__icon pc_view\"\n          tabindex=\"0\"\n          (click)=\"!isNextMonthDisabled() && navigateMonth('NEXT')\"\n          (keyup.enter)=\"!isNextMonthDisabled() && navigateMonth('NEXT')\"\n          [ngClass]=\"{\n            'disabled-month': isNextMonthDisabled()\n          }\"\n        >\n          <svg width=\"20\" height=\"16\" viewBox=\"0 0 20 16\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n            <path\n              d=\"M19.7071 8.70711C20.0976 8.31658 20.0976 7.68342 19.7071 7.29289L13.3431 0.928933C12.9526 0.538409 12.3195 0.538409 11.9289 0.928933C11.5384 1.31946 11.5384 1.95262 11.9289 2.34315L17.5858 8L11.9289 13.6569C11.5384 14.0474 11.5384 14.6805 11.9289 15.0711C12.3195 15.4616 12.9526 15.4616 13.3431 15.0711L19.7071 8.70711ZM-8.74228e-08 9L19 9L19 7L8.74228e-08 7L-8.74228e-08 9Z\"\n              fill=\"#181F33\"\n            ></path>\n          </svg>\n        </div>\n      </div>\n      <div class=\"daterangepicker-container__body\">\n        <div class=\"daterangepicker-container__weekdays\">\n          <div class=\"daterangepicker-container__weekday\" *ngFor=\"let weekDay of weekDays()\">\n            <span>{{ weekDay.label }}</span>\n          </div>\n        </div>\n        <div class=\"daterangepicker-container__days\">\n          <div\n            class=\"daterangepicker-container__day\"\n            [ngClass]=\"{\n              'selected-same-day': day.isSelectedStartDay && day.isSelectedEndDay,\n              'selected-start-day': day.isSelectedStartDay,\n              'selected-end-day': day.isSelectedEndDay,\n              'disabled-day': day.isDisabledDay,\n              'in-range-day': day.inRangeDay,\n              'is-valid-date': day.date > 0 && !(day.isSelectedStartDay && day.isSelectedEndDay)\n            }\"\n            *ngFor=\"let day of nextMonthDates()\"\n            (click)=\"selectDay('RIGHT', day)\"\n            (keyup.enter)=\"selectDay('RIGHT', day)\"\n          >\n            <span *ngIf=\"day.date > 0\"\n              [tabindex]=\"day.isDisabledDay ? -1 : 0\"\n              [attr.aria-label]=\"retractDayMonth(day.date, nextMonth(), nextYearNumber())\">\n              {{ day.date }}\n            </span>\n          </div>\n        </div>\n      </div>\n    </div>\n  </div>\n  \n  <!-- Time Selection Section -->\n  <div class=\"daterangepicker-container__time\" *ngIf=\"data.dpConfig.enableTime === true\">\n    <div class=\"time-section\">\n      <h4>From</h4>\n      <div class=\"time-inputs\">\n        <input \n          type=\"number\" \n          [ngModel]=\"is12HourFormat() ? startHour() : startHour24()\" \n          (ngModelChange)=\"is12HourFormat() ? startHourSignal.set($event) : startHour24Signal.set($event); onStartHourInput()\"\n          [min]=\"is12HourFormat() ? 1 : 0\" \n          [max]=\"is12HourFormat() ? 12 : 23\" \n          step=\"1\"\n          class=\"time-input hour-input\"\n          placeholder=\"HH\">\n        <span class=\"time-separator\">:</span>\n        <input \n          type=\"number\" \n          [ngModel]=\"startMinute()\" (ngModelChange)=\"startMinuteSignal.set($event)\" \n          (input)=\"onStartMinuteInput()\"\n          min=\"0\" \n          max=\"59\" \n          step=\"1\"\n          class=\"time-input minute-input\"\n          placeholder=\"MM\">\n        <select \n          [ngModel]=\"startAmPm()\" (ngModelChange)=\"startAmPmSignal.set($event)\" \n          class=\"am-pm-selector\"\n          *ngIf=\"is12HourFormat()\">\n          <option value=\"AM\">AM</option>\n          <option value=\"PM\">PM</option>\n        </select>\n      </div>\n    </div>\n    \n    <div class=\"time-section\">\n      <h4>To</h4>\n      <div class=\"time-inputs\">\n        <input \n          type=\"number\" \n          [ngModel]=\"is12HourFormat() ? endHour() : endHour24()\" \n          (ngModelChange)=\"is12HourFormat() ? endHourSignal.set($event) : endHour24Signal.set($event); onEndHourInput()\"\n          [min]=\"is12HourFormat() ? 1 : 0\" \n          [max]=\"is12HourFormat() ? 12 : 23\" \n          step=\"1\"\n          class=\"time-input hour-input\"\n          placeholder=\"HH\">\n        <span class=\"time-separator\">:</span>\n        <input \n          type=\"number\" \n          [ngModel]=\"endMinute()\" (ngModelChange)=\"endMinuteSignal.set($event)\" \n          (input)=\"onEndMinuteInput()\"\n          min=\"0\" \n          max=\"59\" \n          step=\"1\"\n          class=\"time-input minute-input\"\n          placeholder=\"MM\">\n        <select \n          [ngModel]=\"endAmPm()\" (ngModelChange)=\"endAmPmSignal.set($event)\" \n          class=\"am-pm-selector\"\n          *ngIf=\"is12HourFormat()\">\n          <option value=\"AM\">AM</option>\n          <option value=\"PM\">PM</option>\n        </select>\n      </div>\n    </div>\n  </div>\n  \n  <div class=\"daterangepicker__footer\">\n    <button mis-button type=\"none\" id='mobile-footer-btn' (click)=\"cancelDatePicker()\">Cancel</button>\n    <button mis-button type=\"primary\" id=\"mobile-footer-btn\" (click)=\"applyDates()\" [disabled]=\"!isDatesValid()\">Apply</button>\n  </div>\n</div>", styles: [":root{--pmry-200: #99BAF7;--pmry-100: #CBDDFB;--pmry-500: #0937B2;--pmry-400: #3C68D0;--pmry-600: #062A99;--pmry-700: #041F80;--pmry-300: #638FE7;--pmry-800: #021567;--pmry-900: #010F55;--sec-d-purple: #40447F;--sec-maroon: #6B034E;--sec-mud-red: #B23600;--sec-orange: #ED711C;--sec-purple: #815FD5;--sec-teal: #10ADAE;--sec-yellow: #D4900C;--sec-green: #547F40;--sec-bright-green: #27D22E;--sec-dark-teal: #035F6B;--sec-chocolate: #7C2F33;--sec-rube-pink: #C13D6D;--sec-cerulean: #0087B2;--sem-error: #B00020;--sem-info: #0091FF;--sem-warning: #FF9D00;--sem-success: #38AF49;--grey-bg-1: #FAFAFA;--grey-bg: #F5F5F5;--grey-seperators: #E0E0E0;--grey-disabled: #C8CDD3;--grey-hover: #F5F7FC;--grey-pressed: #E6EBF7;--grey-row: #F5F7FC;--dec-light-yellow: #F4E7C3;--dec-light-purple: #DACFF9;--dec-light-green: #E4F5E9;--dec-light-green2: #F1FFF3;--dec-light-pink: #FAE1EA;--dec-: #F4CBC1;--dec-lt-orange: #FAEFED;--dec-light-blue: #CFECF9;--dec-row-selection: #F1FDF8;--dec-row-selection2: #F2FBFF;--dec-row-lines: #D3E1E9;--text-white: #FFFFFF;--text-disabled: #929DAB;--text-muted: #6A737D;--text-black: #181F33;--MR-solid-blue2:#C8D5F6;--MR-solid-purple:#C9C3FB;--MR-solid-orange:#EEAC9F;--MR-solid-green:#ACDADA;--MR-solid-brown:#E8C8AF;--MR-solid-yellow:#FFEFC7;--MR-solid-blue:#BBE6FF;--MR-solid-pink:#FFC6F2;--tr-hover:#F0F3FA;--tr-pressed:#DAE1F3}.daterangepicker-container{background:#fff;border:1px solid #e0e0e0;box-shadow:0 12px 24px #0000001f,0 4px 8px #0000001f;border-radius:12px;display:flex;flex-direction:column;font-family:Lato;overflow:hidden;-webkit-user-select:none;user-select:none}@media only screen and (max-width: 900px){.daterangepicker-container{max-width:100vw;border:none}}.daterangepicker-container .daterangepicker-container__view{display:flex;gap:24px;padding:16px}.daterangepicker-container .daterangepicker-container__view .daterangepicker-container__ranges{display:flex;flex-direction:column}.daterangepicker-container .daterangepicker-container__view .mis-btn{background:none;outline:none;border:none;cursor:pointer;border-radius:4px;vertical-align:middle;text-align:center;box-sizing:border-box;display:flex;align-items:center;text-decoration:none;justify-content:center;padding:10px 16px;font-size:16px;line-height:24px;background-color:transparent;color:#0937b2}.daterangepicker-container .daterangepicker-container__view .active-range{background-color:#cadcfb}@media only screen and (max-width: 900px){.daterangepicker-container .daterangepicker-container__view{flex-direction:column;align-items:center;position:fixed;bottom:0;left:0;background-color:#fff;width:100%;max-height:68vh;overflow-y:auto;border-radius:30px;gap:24px;padding:10% 0 30%;box-shadow:0 -4px 8px 10000px #0000001f;scrollbar-width:none;-ms-overflow-style:none}.daterangepicker-container .daterangepicker-container__view .daterangepicker-container__view::-webkit-scrollbar{display:none}}.daterangepicker-container .daterangepicker-container__view .datepicker__left,.daterangepicker-container .daterangepicker-container__view .datepicker__right{display:flex;flex-direction:column}@media only screen and (max-width: 900px){.daterangepicker-container .daterangepicker-container__view .datepicker__left,.daterangepicker-container .daterangepicker-container__view .datepicker__right{width:90%}}.daterangepicker-container .daterangepicker-container__view .daterangepicker-container__header__prabu{display:flex;height:32px;justify-content:space-between;align-items:center;width:100%;padding-bottom:10%}.daterangepicker-container .daterangepicker-container__view .daterangepicker-container__header__prabu span{font-size:16px;font-style:normal;font-weight:700;line-height:24px;letter-spacing:.2px;text-align:center}@media only screen and (max-width: 900px){.daterangepicker-container .daterangepicker-container__view .daterangepicker-container__header__prabu span{margin:0 auto;font-size:4vw}}.daterangepicker-container .daterangepicker-container__view .daterangepicker-container__header__prabu .daterangepicker-container__arrow__icon{height:20px;width:20px;display:flex;align-items:center;justify-content:center;border-radius:4px;padding:4px}.daterangepicker-container .daterangepicker-container__view .daterangepicker-container__header__prabu .daterangepicker-container__arrow__icon.disabled-month{opacity:.5;cursor:not-allowed}.daterangepicker-container .daterangepicker-container__view .daterangepicker-container__header__prabu .daterangepicker-container__arrow__icon:not(.disabled-month):hover{cursor:pointer;background-color:#cbddfb}.daterangepicker-container .daterangepicker-container__view .daterangepicker-container__header__prabu .daterangepicker-container__arrow__icon:nth-child(1){transform:rotate(180deg)}@media only screen and (max-width: 900px){.daterangepicker-container .daterangepicker-container__view .daterangepicker-container__header__prabu .daterangepicker-container__arrow__icon{width:7%}}@media only screen and (min-width: 900px){.daterangepicker-container .daterangepicker-container__view .daterangepicker-container__header__prabu .mobile_view{display:none}}@media only screen and (max-width: 900px){.daterangepicker-container .daterangepicker-container__view .daterangepicker-container__header__prabu .pc_view{display:none}}.daterangepicker-container .daterangepicker-container__view .daterangepicker-container__body{height:100%;width:252px}@media only screen and (max-width: 900px){.daterangepicker-container .daterangepicker-container__view .daterangepicker-container__body{width:100%}}.daterangepicker-container .daterangepicker-container__view .daterangepicker-container__body .daterangepicker-container__weekdays{width:100%;display:flex;padding-bottom:10px}@media only screen and (max-width: 900px){.daterangepicker-container .daterangepicker-container__view .daterangepicker-container__body .daterangepicker-container__weekdays{display:flex;flex-direction:row;flex-wrap:wrap;flex:0 0 14.2857142857%}}.daterangepicker-container .daterangepicker-container__view .daterangepicker-container__body .daterangepicker-container__weekdays .daterangepicker-container__weekday{width:36px;height:18px;text-align:center}@media only screen and (max-width: 900px){.daterangepicker-container .daterangepicker-container__view .daterangepicker-container__body .daterangepicker-container__weekdays .daterangepicker-container__weekday{margin:0 auto}}.daterangepicker-container .daterangepicker-container__view .daterangepicker-container__body .daterangepicker-container__weekdays .daterangepicker-container__weekday span{font-size:12px;font-style:normal;font-weight:400;line-height:18px;letter-spacing:.2px;text-align:center;color:#6a737d}@media only screen and (max-width: 900px){.daterangepicker-container .daterangepicker-container__view .daterangepicker-container__body .daterangepicker-container__weekdays .daterangepicker-container__weekday span{font-size:3vw}}.daterangepicker-container .daterangepicker-container__view .daterangepicker-container__body .daterangepicker-container__weekdays .daterangepicker-container__weekday span.current-day{font-weight:700;letter-spacing:.25px;color:#181f33}.daterangepicker-container .daterangepicker-container__view .daterangepicker-container__body .daterangepicker-container__days{display:flex;flex-wrap:wrap}@media only screen and (max-width: 900px){.daterangepicker-container .daterangepicker-container__view .daterangepicker-container__body .daterangepicker-container__days{display:flex;flex-direction:row;flex-wrap:wrap;flex:0 0 14.2857142857%}}.daterangepicker-container .daterangepicker-container__view .daterangepicker-container__body .daterangepicker-container__days .daterangepicker-container__day{width:36px;height:36px;display:flex;align-items:center;justify-content:center}@media only screen and (max-width: 900px){.daterangepicker-container .daterangepicker-container__view .daterangepicker-container__body .daterangepicker-container__days .daterangepicker-container__day{flex:0 0 14.2857142857%;width:14.2857142857%;height:14.2857142857%;aspect-ratio:1}}.daterangepicker-container .daterangepicker-container__view .daterangepicker-container__body .daterangepicker-container__days .daterangepicker-container__day:not(.in-range-day):not(.selected-start-day):not(.selected-end-day){border-radius:4px}.daterangepicker-container .daterangepicker-container__view .daterangepicker-container__body .daterangepicker-container__days .daterangepicker-container__day.disabled-day{cursor:default}.daterangepicker-container .daterangepicker-container__view .daterangepicker-container__body .daterangepicker-container__days .daterangepicker-container__day.disabled-day:hover{background-color:transparent}.daterangepicker-container .daterangepicker-container__view .daterangepicker-container__body .daterangepicker-container__days .daterangepicker-container__day.disabled-day>span{color:#6a737d}.daterangepicker-container .daterangepicker-container__view .daterangepicker-container__body .daterangepicker-container__days .daterangepicker-container__day.is-valid-date:not(.disabled-day):not(.selected-start-day):not(.selected-end-day)>span{color:#181f33}.daterangepicker-container .daterangepicker-container__view .daterangepicker-container__body .daterangepicker-container__days .daterangepicker-container__day.is-valid-date:not(.disabled-day):not(.selected-start-day):not(.selected-end-day):hover{background-color:#cbddfb;cursor:pointer}.daterangepicker-container .daterangepicker-container__view .daterangepicker-container__body .daterangepicker-container__days .daterangepicker-container__day span{font-size:14px;font-style:normal;font-weight:400;line-height:20px;letter-spacing:.2px;text-align:center;color:#181f33}@media only screen and (max-width: 900px){.daterangepicker-container .daterangepicker-container__view .daterangepicker-container__body .daterangepicker-container__days .daterangepicker-container__day span{font-size:3.4vw}}.daterangepicker-container .daterangepicker-container__view .daterangepicker-container__body .daterangepicker-container__days .daterangepicker-container__day span.current-day{font-weight:700;letter-spacing:.25px}.daterangepicker-container .daterangepicker-container__view .daterangepicker-container__body .daterangepicker-container__days .daterangepicker-container__day span.selected-day{color:#fff}.daterangepicker-container .daterangepicker-container__view .daterangepicker-container__body .daterangepicker-container__days .daterangepicker-container__day span.disabled-day{color:#6a737d}.daterangepicker-container .daterangepicker-container__view .daterangepicker-container__body .daterangepicker-container__days .selected-same-day{background-color:#0937b2;border-radius:50%!important}.daterangepicker-container .daterangepicker-container__view .daterangepicker-container__body .daterangepicker-container__days .selected-same-day>span{color:#fff}.daterangepicker-container .daterangepicker-container__view .daterangepicker-container__body .daterangepicker-container__days .selected-start-day{background-color:#0937b2;border-radius:20px 4px 4px 20px}.daterangepicker-container .daterangepicker-container__view .daterangepicker-container__body .daterangepicker-container__days .selected-start-day>span{color:#fff}.daterangepicker-container .daterangepicker-container__view .daterangepicker-container__body .daterangepicker-container__days .selected-end-day{background-color:#0937b2;border-radius:0 20px 20px 0}.daterangepicker-container .daterangepicker-container__view .daterangepicker-container__body .daterangepicker-container__days .selected-end-day>span{color:#fff}.daterangepicker-container .daterangepicker-container__view .daterangepicker-container__body .daterangepicker-container__days .in-range-day:not(.disabled-day){background-color:#cbddfb}.daterangepicker-container .daterangepicker-container__time{border-top:1px solid #e0e0e0;padding:16px 24px;background-color:#f8f9fa;display:flex;gap:24px}.daterangepicker-container .daterangepicker-container__time .time-section{flex:1}.daterangepicker-container .daterangepicker-container__time .time-section h4{margin:0 0 8px;font-size:14px;font-weight:600;color:#333}.daterangepicker-container .daterangepicker-container__time .time-section .time-inputs{display:flex;align-items:center;gap:8px}.daterangepicker-container .daterangepicker-container__time .time-section .time-inputs .time-input{width:60px;padding:8px;border:1px solid #ddd;border-radius:4px;text-align:center;font-size:14px}.daterangepicker-container .daterangepicker-container__time .time-section .time-inputs .time-input:focus{outline:none;border-color:#0937b2;box-shadow:0 0 0 2px #0937b233}.daterangepicker-container .daterangepicker-container__time .time-section .time-inputs .time-input.hour-input,.daterangepicker-container .daterangepicker-container__time .time-section .time-inputs .time-input.minute-input{width:50px}.daterangepicker-container .daterangepicker-container__time .time-section .time-inputs .time-separator{font-size:16px;font-weight:600;color:#666}.daterangepicker-container .daterangepicker-container__time .time-section .time-inputs .am-pm-selector{padding:7.1px 12px;border:1px solid #ddd;border-radius:4px;background-color:#fff;font-size:14px;cursor:pointer}.daterangepicker-container .daterangepicker-container__time .time-section .time-inputs .am-pm-selector:focus{outline:none;border-color:#0937b2}.daterangepicker-container .daterangepicker__footer{display:flex;justify-content:flex-end;border-top:1px solid #e0e0e0;padding:16px 24px;gap:24px}@media only screen and (max-width: 900px){.daterangepicker-container .daterangepicker__footer{justify-content:space-evenly;padding:2% 0;background-color:#fff;position:fixed;bottom:0;left:0;width:100%;height:8vh;border-top:2px solid #C8CDD3}.daterangepicker-container .daterangepicker__footer #mobile-footer-btn{width:36%;font-size:3.8vw}}\n"] }]
+        args: [{ selector: "mis-tz-drp", template: "<div class=\"daterangepicker-container\" aria-label=\"date range picker\" cdkTrapFocus [cdkTrapFocusAutoCapture]=\"true\">\n  <div class=\"daterangepicker-container__view\">\n    <div tabindex=\"-1\" cdkFocusInitial></div>\n    <div *ngIf=\"data?.dpConfig?.ranges?.length > 0\" class=\"daterangepicker-container__ranges\">\n      <div *ngFor=\"let item of data?.dpConfig?.ranges ?? []\" >\n        <button\n        [ngClass]=\"{'active-range' : selectedItemLabel() === item.label}\"\n          (click)=\"selectRange(item)\"\n          class=\"mis-btn\"\n        >\n          {{ item.label }}\n        </button>\n      </div>\n      <div> <button class=\"mis-btn\" [ngClass]=\"{'active-range' : selectedItemLabel() === 'Custom Range'}\" (click)=\"resetRange()\">Custom Range</button> </div>\n  </div>\n    <div class=\"datepicker__left\">\n      <div class=\"daterangepicker-container__header__prabu\">\n        <div\n          class=\"daterangepicker-container__arrow__icon\"\n          tabindex=\"0\"\n          (click)=\"!isPreviousMonthDisabled() && navigateMonth('PREVIOUS')\"\n          (keyup.enter)=\"!isPreviousMonthDisabled() && navigateMonth('PREVIOUS')\"\n          aria-label=\"Previous Month\"\n          [ngClass]=\"{\n            'disabled-month': isPreviousMonthDisabled()\n          }\"\n        >\n          <svg width=\"20\" height=\"16\" viewBox=\"0 0 20 16\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n            <path\n              d=\"M19.7071 8.70711C20.0976 8.31658 20.0976 7.68342 19.7071 7.29289L13.3431 0.928933C12.9526 0.538409 12.3195 0.538409 11.9289 0.928933C11.5384 1.31946 11.5384 1.95262 11.9289 2.34315L17.5858 8L11.9289 13.6569C11.5384 14.0474 11.5384 14.6805 11.9289 15.0711C12.3195 15.4616 12.9526 15.4616 13.3431 15.0711L19.7071 8.70711ZM-8.74228e-08 9L19 9L19 7L8.74228e-08 7L-8.74228e-08 9Z\"\n              fill=\"#181F33\"\n            ></path>\n          </svg>\n        </div>\n        <span> {{ currentMonth() }} {{ currentYearNumber() }} </span>\n        <div></div>\n        <!-- Button visible in mobile view -->\n        <div\n          class=\"daterangepicker-container__arrow__icon mobile_view\"\n          tabindex=\"0\"\n          (click)=\"!isNextMonthDisabled() && navigateMonth('NEXT')\"\n          (keyup.enter)=\"!isNextMonthDisabled() && navigateMonth('NEXT')\"\n          aria-label=\"Next Month\"\n          [ngClass]=\"{\n            'disabled-month': isNextMonthDisabled()\n          }\"\n        >\n          <svg width=\"20\" height=\"16\" viewBox=\"0 0 20 16\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n            <path\n              d=\"M19.7071 8.70711C20.0976 8.31658 20.0976 7.68342 19.7071 7.29289L13.3431 0.928933C12.9526 0.538409 12.3195 0.538409 11.9289 0.928933C11.5384 1.31946 11.5384 1.95262 11.9289 2.34315L17.5858 8L11.9289 13.6569C11.5384 14.0474 11.5384 14.6805 11.9289 15.0711C12.3195 15.4616 12.9526 15.4616 13.3431 15.0711L19.7071 8.70711ZM-8.74228e-08 9L19 9L19 7L8.74228e-08 7L-8.74228e-08 9Z\"\n              fill=\"#181F33\"\n            ></path>\n          </svg>\n        </div>\n      </div>\n      <div class=\"daterangepicker-container__body\">\n        <div class=\"daterangepicker-container__weekdays\">\n          <div class=\"daterangepicker-container__weekday\" *ngFor=\"let weekDay of weekDays()\">\n            <span>{{ weekDay.label }}</span>\n          </div>\n        </div>\n        <div class=\"daterangepicker-container__days\">\n          <div\n            class=\"daterangepicker-container__day\" \n            [ngClass]=\"{\n              'selected-same-day': day.isSelectedStartDay && day.isSelectedEndDay,\n              'selected-start-day': day.isSelectedStartDay,\n              'selected-end-day': day.isSelectedEndDay,\n              'disabled-day': day.isDisabledDay,\n              'in-range-day': day.inRangeDay,\n              'is-valid-date': day.date > 0 && !(day.isSelectedStartDay && day.isSelectedEndDay)\n            }\"\n            *ngFor=\"let day of currentMonthDates()\"\n            (click)=\"selectDay('LEFT', day)\"\n            (keyup.enter)=\"selectDay('LEFT', day)\"\n          >\n            <span *ngIf=\"day.date > 0\"\n              [tabindex]=\"day.isDisabledDay ? -1 : 0\"\n              [attr.aria-label]=\"retractDayMonth(day.date, currentMonth(), currentYearNumber())\">\n              {{ day.date }}\n            </span>\n          </div>\n        </div>\n      </div>\n    </div>\n    <div class=\"datepicker__right\">\n      <div class=\"daterangepicker-container__header__prabu\">\n        <div></div>\n        <span> {{ nextMonth() }} {{ nextYearNumber() }} </span>\n        <div\n          class=\"daterangepicker-container__arrow__icon pc_view\"\n          tabindex=\"0\"\n          (click)=\"!isNextMonthDisabled() && navigateMonth('NEXT')\"\n          (keyup.enter)=\"!isNextMonthDisabled() && navigateMonth('NEXT')\"\n          [ngClass]=\"{\n            'disabled-month': isNextMonthDisabled()\n          }\"\n        >\n          <svg width=\"20\" height=\"16\" viewBox=\"0 0 20 16\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n            <path\n              d=\"M19.7071 8.70711C20.0976 8.31658 20.0976 7.68342 19.7071 7.29289L13.3431 0.928933C12.9526 0.538409 12.3195 0.538409 11.9289 0.928933C11.5384 1.31946 11.5384 1.95262 11.9289 2.34315L17.5858 8L11.9289 13.6569C11.5384 14.0474 11.5384 14.6805 11.9289 15.0711C12.3195 15.4616 12.9526 15.4616 13.3431 15.0711L19.7071 8.70711ZM-8.74228e-08 9L19 9L19 7L8.74228e-08 7L-8.74228e-08 9Z\"\n              fill=\"#181F33\"\n            ></path>\n          </svg>\n        </div>\n      </div>\n      <div class=\"daterangepicker-container__body\">\n        <div class=\"daterangepicker-container__weekdays\">\n          <div class=\"daterangepicker-container__weekday\" *ngFor=\"let weekDay of weekDays()\">\n            <span>{{ weekDay.label }}</span>\n          </div>\n        </div>\n        <div class=\"daterangepicker-container__days\">\n          <div\n            class=\"daterangepicker-container__day\"\n            [ngClass]=\"{\n              'selected-same-day': day.isSelectedStartDay && day.isSelectedEndDay,\n              'selected-start-day': day.isSelectedStartDay,\n              'selected-end-day': day.isSelectedEndDay,\n              'disabled-day': day.isDisabledDay,\n              'in-range-day': day.inRangeDay,\n              'is-valid-date': day.date > 0 && !(day.isSelectedStartDay && day.isSelectedEndDay)\n            }\"\n            *ngFor=\"let day of nextMonthDates()\"\n            (click)=\"selectDay('RIGHT', day)\"\n            (keyup.enter)=\"selectDay('RIGHT', day)\"\n          >\n            <span *ngIf=\"day.date > 0\"\n              [tabindex]=\"day.isDisabledDay ? -1 : 0\"\n              [attr.aria-label]=\"retractDayMonth(day.date, nextMonth(), nextYearNumber())\">\n              {{ day.date }}\n            </span>\n          </div>\n        </div>\n      </div>\n    </div>\n  </div>\n  \n  <!-- Time Selection Section -->\n  <div class=\"daterangepicker-container__time\" *ngIf=\"data.dpConfig.enableTime === true\">\n    <div class=\"time-section\">\n      <h4>From</h4>\n      <div class=\"time-inputs\">\n        <input \n          type=\"number\" \n          [ngModel]=\"is12HourFormat() ? startHour() : startHour24()\" \n          (ngModelChange)=\"is12HourFormat() ? startHourSignal.set($event) : startHour24Signal.set($event); onStartHourInput()\"\n          [min]=\"is12HourFormat() ? 1 : 0\" \n          [max]=\"is12HourFormat() ? 12 : 23\" \n          step=\"1\"\n          class=\"time-input hour-input\"\n          placeholder=\"HH\">\n        <span class=\"time-separator\">:</span>\n        <input \n          type=\"number\" \n          [ngModel]=\"startMinute()\" (ngModelChange)=\"startMinuteSignal.set($event)\" \n          (input)=\"onStartMinuteInput()\"\n          min=\"0\" \n          max=\"59\" \n          step=\"1\"\n          class=\"time-input minute-input\"\n          placeholder=\"MM\">\n        <select \n          [ngModel]=\"startAmPm()\" (ngModelChange)=\"startAmPmSignal.set($event)\" \n          class=\"am-pm-selector\"\n          *ngIf=\"is12HourFormat()\">\n          <option value=\"AM\">AM</option>\n          <option value=\"PM\">PM</option>\n        </select>\n      </div>\n    </div>\n    \n    <div class=\"time-section\">\n      <h4>To</h4>\n      <div class=\"time-inputs\">\n        <input \n          type=\"number\" \n          [ngModel]=\"is12HourFormat() ? endHour() : endHour24()\" \n          (ngModelChange)=\"is12HourFormat() ? endHourSignal.set($event) : endHour24Signal.set($event); onEndHourInput()\"\n          [min]=\"is12HourFormat() ? 1 : 0\" \n          [max]=\"is12HourFormat() ? 12 : 23\" \n          step=\"1\"\n          class=\"time-input hour-input\"\n          placeholder=\"HH\">\n        <span class=\"time-separator\">:</span>\n        <input \n          type=\"number\" \n          [ngModel]=\"endMinute()\" (ngModelChange)=\"endMinuteSignal.set($event)\" \n          (input)=\"onEndMinuteInput()\"\n          min=\"0\" \n          max=\"59\" \n          step=\"1\"\n          class=\"time-input minute-input\"\n          placeholder=\"MM\">\n        <select \n          [ngModel]=\"endAmPm()\" (ngModelChange)=\"endAmPmSignal.set($event)\" \n          class=\"am-pm-selector\"\n          *ngIf=\"is12HourFormat()\">\n          <option value=\"AM\">AM</option>\n          <option value=\"PM\">PM</option>\n        </select>\n      </div>\n    </div>\n  </div>\n  \n  <div class=\"daterangepicker__footer\">\n    <button mis-button type=\"none\" id='mobile-footer-btn' (click)=\"cancelDatePicker()\">Cancel</button>\n    <button mis-button type=\"primary\" id=\"mobile-footer-btn\" (click)=\"applyDates()\" [disabled]=\"!isDatesValid()\">Apply</button>\n  </div>\n</div>", styles: [":root{--pmry-200: #99BAF7;--pmry-100: #CBDDFB;--pmry-500: #0937B2;--pmry-400: #3C68D0;--pmry-600: #062A99;--pmry-700: #041F80;--pmry-300: #638FE7;--pmry-800: #021567;--pmry-900: #010F55;--sec-d-purple: #40447F;--sec-maroon: #6B034E;--sec-mud-red: #B23600;--sec-orange: #ED711C;--sec-purple: #815FD5;--sec-teal: #10ADAE;--sec-yellow: #D4900C;--sec-green: #547F40;--sec-bright-green: #27D22E;--sec-dark-teal: #035F6B;--sec-chocolate: #7C2F33;--sec-rube-pink: #C13D6D;--sec-cerulean: #0087B2;--sem-error: #B00020;--sem-info: #0091FF;--sem-warning: #FF9D00;--sem-success: #38AF49;--grey-bg-1: #FAFAFA;--grey-bg: #F5F5F5;--grey-seperators: #E0E0E0;--grey-disabled: #C8CDD3;--grey-hover: #F5F7FC;--grey-pressed: #E6EBF7;--grey-row: #F5F7FC;--dec-light-yellow: #F4E7C3;--dec-light-purple: #DACFF9;--dec-light-green: #E4F5E9;--dec-light-green2: #F1FFF3;--dec-light-pink: #FAE1EA;--dec-: #F4CBC1;--dec-lt-orange: #FAEFED;--dec-light-blue: #CFECF9;--dec-row-selection: #F1FDF8;--dec-row-selection2: #F2FBFF;--dec-row-lines: #D3E1E9;--text-white: #FFFFFF;--text-muted: #6A737D;--text-black: #181F33;--MR-solid-blue2:#C8D5F6;--MR-solid-purple:#C9C3FB;--MR-solid-orange:#EEAC9F;--MR-solid-green:#ACDADA;--MR-solid-brown:#E8C8AF;--MR-solid-yellow:#FFEFC7;--MR-solid-blue:#BBE6FF;--MR-solid-pink:#FFC6F2;--tr-hover:#F0F3FA;--tr-pressed:#DAE1F3;--brand-primary: #0937B2;--brand-primary-light: #3C68D0;--brand-primary-dark: #062A99;--brand-primary-darker: #041F80;--brand-primary-lighter: #638FE7;--brand-primary-lightest: #CBDDFB;--brand-primary-hover: #F0F3FA;--brand-primary-active: #DAE1F3;--brand-secondary: #ED711C;--brand-secondary-light: #F09E65;--brand-secondary-dark: #B23600;--brand-secondary-lighter: #FFC6F2;--brand-accent: #10ADAE;--brand-accent-light: #16CBBC;--brand-accent-dark: #035F6B;--brand-accent-lighter: #ACDADA;--brand-success: #38AF49;--brand-success-light: #4CAF50;--brand-success-dark: #216531;--brand-success-lighter: #E4F5E9;--brand-success-lightest: #F1FFF3;--brand-error: #B00020;--brand-error-light: #F04E4E;--brand-error-dark: #A60060;--brand-error-lighter: #FAE1EA;--brand-error-lightest: #FDF2F2;--brand-warning: #FF9D00;--brand-warning-light: #D4900C;--brand-warning-dark: #624000;--brand-warning-lighter: #F4E7C3;--brand-warning-lightest: #FAEFED;--brand-info: #0091FF;--brand-info-light: #35A1FF;--brand-info-dark: #0087B2;--brand-info-lighter: #CFECF9;--text-primary: #181F33;--text-secondary: #6A737D;--text-tertiary: #929DAB;--text-disabled: #929DAB;--text-primary-87: rgba(24, 31, 51, .87);--text-primary-60: rgba(24, 31, 51, .6);--text-primary-38: rgba(24, 31, 51, .38);--text-primary-12: rgba(24, 31, 51, .12);--bg-primary: #FFFFFF;--bg-secondary: #FAFAFA;--bg-tertiary: #F5F5F5;--bg-overlay: rgba(0, 0, 0, .32);--bg-overlay-light: rgba(0, 0, 0, .12);--bg-overlay-lighter: rgba(0, 0, 0, .08);--bg-overlay-lightest: rgba(0, 0, 0, .04);--border-primary: #E0E0E0;--border-secondary: #D6DCE2;--border-tertiary: #C8CDD3;--border-light: #F1F4F8;--border-primary-12: rgba(0, 0, 0, .12);--border-primary-08: rgba(0, 0, 0, .08);--border-primary-06: rgba(0, 0, 0, .06);--shadow-primary: rgba(0, 0, 0, .12);--shadow-secondary: rgba(0, 0, 0, .08);--shadow-tertiary: rgba(0, 0, 0, .04);--shadow-light: rgba(0, 0, 0, .06);--status-available: #929DAB;--status-unavailable: #CCD3DA;--status-hotseat: #857BFF;--status-multiteam: #10ADAE;--status-selected: #10ADAE;--status-upcoming: #D4900C;--status-room: #38AF49;--status-room-booked: #B23600;--status-room-unavailable: #181F33;--team-color-1: #F8C52E;--team-color-2: #FA8E20;--team-color-3: #987CDD;--team-color-4: #16CBBC;--team-color-5: #E65010;--team-color-6: #A60060;--team-color-7: #ED323B;--team-color-8: #35A1FF;--team-color-9: #80D348}.daterangepicker-container{background:var(--bg-primary, #FFFFFF);border:1px solid var(--border-primary, #E0E0E0);box-shadow:0 12px 24px #0000001f,0 4px 8px #0000001f;border-radius:12px;display:flex;flex-direction:column;font-family:Lato;overflow:hidden;-webkit-user-select:none;user-select:none}@media only screen and (max-width: 900px){.daterangepicker-container{max-width:100vw;border:none}}.daterangepicker-container .daterangepicker-container__view{display:flex;gap:24px;padding:16px}.daterangepicker-container .daterangepicker-container__view .daterangepicker-container__ranges{display:flex;flex-direction:column}.daterangepicker-container .daterangepicker-container__view .mis-btn{background:none;outline:none;border:none;cursor:pointer;border-radius:4px;vertical-align:middle;text-align:center;box-sizing:border-box;display:flex;align-items:center;text-decoration:none;justify-content:center;padding:10px 16px;font-size:16px;line-height:24px;background-color:transparent;color:var(--brand-primary, #0937B2)}.daterangepicker-container .daterangepicker-container__view .active-range{background-color:var(--brand-primary-lightest, #CBDDFB)}@media only screen and (max-width: 900px){.daterangepicker-container .daterangepicker-container__view{flex-direction:column;align-items:center;position:fixed;bottom:0;left:0;background-color:#fff;width:100%;max-height:68vh;overflow-y:auto;border-radius:30px;gap:24px;padding:10% 0 30%;box-shadow:0 -4px 8px 10000px #0000001f;scrollbar-width:none;-ms-overflow-style:none}.daterangepicker-container .daterangepicker-container__view .daterangepicker-container__view::-webkit-scrollbar{display:none}}.daterangepicker-container .daterangepicker-container__view .datepicker__left,.daterangepicker-container .daterangepicker-container__view .datepicker__right{display:flex;flex-direction:column}@media only screen and (max-width: 900px){.daterangepicker-container .daterangepicker-container__view .datepicker__left,.daterangepicker-container .daterangepicker-container__view .datepicker__right{width:90%}}.daterangepicker-container .daterangepicker-container__view .daterangepicker-container__header__prabu{display:flex;height:32px;justify-content:space-between;align-items:center;width:100%;padding-bottom:10%}.daterangepicker-container .daterangepicker-container__view .daterangepicker-container__header__prabu span{font-size:16px;font-style:normal;font-weight:700;line-height:24px;letter-spacing:.2px;text-align:center}@media only screen and (max-width: 900px){.daterangepicker-container .daterangepicker-container__view .daterangepicker-container__header__prabu span{margin:0 auto;font-size:4vw}}.daterangepicker-container .daterangepicker-container__view .daterangepicker-container__header__prabu .daterangepicker-container__arrow__icon{height:20px;width:20px;display:flex;align-items:center;justify-content:center;border-radius:4px;padding:4px}.daterangepicker-container .daterangepicker-container__view .daterangepicker-container__header__prabu .daterangepicker-container__arrow__icon.disabled-month{opacity:.5;cursor:not-allowed}.daterangepicker-container .daterangepicker-container__view .daterangepicker-container__header__prabu .daterangepicker-container__arrow__icon:not(.disabled-month):hover{cursor:pointer;background-color:var(--brand-primary-lightest, #CBDDFB)}.daterangepicker-container .daterangepicker-container__view .daterangepicker-container__header__prabu .daterangepicker-container__arrow__icon:nth-child(1){transform:rotate(180deg)}@media only screen and (max-width: 900px){.daterangepicker-container .daterangepicker-container__view .daterangepicker-container__header__prabu .daterangepicker-container__arrow__icon{width:7%}}@media only screen and (min-width: 900px){.daterangepicker-container .daterangepicker-container__view .daterangepicker-container__header__prabu .mobile_view{display:none}}@media only screen and (max-width: 900px){.daterangepicker-container .daterangepicker-container__view .daterangepicker-container__header__prabu .pc_view{display:none}}.daterangepicker-container .daterangepicker-container__view .daterangepicker-container__body{height:100%;width:252px}@media only screen and (max-width: 900px){.daterangepicker-container .daterangepicker-container__view .daterangepicker-container__body{width:100%}}.daterangepicker-container .daterangepicker-container__view .daterangepicker-container__body .daterangepicker-container__weekdays{width:100%;display:flex;padding-bottom:10px}@media only screen and (max-width: 900px){.daterangepicker-container .daterangepicker-container__view .daterangepicker-container__body .daterangepicker-container__weekdays{display:flex;flex-direction:row;flex-wrap:wrap;flex:0 0 14.2857142857%}}.daterangepicker-container .daterangepicker-container__view .daterangepicker-container__body .daterangepicker-container__weekdays .daterangepicker-container__weekday{width:36px;height:18px;text-align:center}@media only screen and (max-width: 900px){.daterangepicker-container .daterangepicker-container__view .daterangepicker-container__body .daterangepicker-container__weekdays .daterangepicker-container__weekday{margin:0 auto}}.daterangepicker-container .daterangepicker-container__view .daterangepicker-container__body .daterangepicker-container__weekdays .daterangepicker-container__weekday span{font-size:12px;font-style:normal;font-weight:400;line-height:18px;letter-spacing:.2px;text-align:center;color:var(--text-secondary, #6A737D)}@media only screen and (max-width: 900px){.daterangepicker-container .daterangepicker-container__view .daterangepicker-container__body .daterangepicker-container__weekdays .daterangepicker-container__weekday span{font-size:3vw}}.daterangepicker-container .daterangepicker-container__view .daterangepicker-container__body .daterangepicker-container__weekdays .daterangepicker-container__weekday span.current-day{font-weight:700;letter-spacing:.25px;color:var(--text-primary, #181F33)}.daterangepicker-container .daterangepicker-container__view .daterangepicker-container__body .daterangepicker-container__days{display:flex;flex-wrap:wrap}@media only screen and (max-width: 900px){.daterangepicker-container .daterangepicker-container__view .daterangepicker-container__body .daterangepicker-container__days{display:flex;flex-direction:row;flex-wrap:wrap;flex:0 0 14.2857142857%}}.daterangepicker-container .daterangepicker-container__view .daterangepicker-container__body .daterangepicker-container__days .daterangepicker-container__day{width:36px;height:36px;display:flex;align-items:center;justify-content:center}@media only screen and (max-width: 900px){.daterangepicker-container .daterangepicker-container__view .daterangepicker-container__body .daterangepicker-container__days .daterangepicker-container__day{flex:0 0 14.2857142857%;width:14.2857142857%;height:14.2857142857%;aspect-ratio:1}}.daterangepicker-container .daterangepicker-container__view .daterangepicker-container__body .daterangepicker-container__days .daterangepicker-container__day:not(.in-range-day):not(.selected-start-day):not(.selected-end-day){border-radius:4px}.daterangepicker-container .daterangepicker-container__view .daterangepicker-container__body .daterangepicker-container__days .daterangepicker-container__day.disabled-day{cursor:default}.daterangepicker-container .daterangepicker-container__view .daterangepicker-container__body .daterangepicker-container__days .daterangepicker-container__day.disabled-day:hover{background-color:transparent}.daterangepicker-container .daterangepicker-container__view .daterangepicker-container__body .daterangepicker-container__days .daterangepicker-container__day.disabled-day>span{color:var(--text-secondary, #6A737D)}.daterangepicker-container .daterangepicker-container__view .daterangepicker-container__body .daterangepicker-container__days .daterangepicker-container__day.is-valid-date:not(.disabled-day):not(.selected-start-day):not(.selected-end-day)>span{color:var(--text-primary, #181F33)}.daterangepicker-container .daterangepicker-container__view .daterangepicker-container__body .daterangepicker-container__days .daterangepicker-container__day.is-valid-date:not(.disabled-day):not(.selected-start-day):not(.selected-end-day):hover{background-color:var(--brand-primary-lightest, #CBDDFB);cursor:pointer}.daterangepicker-container .daterangepicker-container__view .daterangepicker-container__body .daterangepicker-container__days .daterangepicker-container__day span{font-size:14px;font-style:normal;font-weight:400;line-height:20px;letter-spacing:.2px;text-align:center;color:var(--text-primary, #181F33)}@media only screen and (max-width: 900px){.daterangepicker-container .daterangepicker-container__view .daterangepicker-container__body .daterangepicker-container__days .daterangepicker-container__day span{font-size:3.4vw}}.daterangepicker-container .daterangepicker-container__view .daterangepicker-container__body .daterangepicker-container__days .daterangepicker-container__day span.current-day{font-weight:700;letter-spacing:.25px}.daterangepicker-container .daterangepicker-container__view .daterangepicker-container__body .daterangepicker-container__days .daterangepicker-container__day span.selected-day{color:var(--bg-primary, #FFFFFF)}.daterangepicker-container .daterangepicker-container__view .daterangepicker-container__body .daterangepicker-container__days .daterangepicker-container__day span.disabled-day{color:var(--text-secondary, #6A737D)}.daterangepicker-container .daterangepicker-container__view .daterangepicker-container__body .daterangepicker-container__days .selected-same-day{background-color:var(--brand-primary, #0937B2);border-radius:50%!important}.daterangepicker-container .daterangepicker-container__view .daterangepicker-container__body .daterangepicker-container__days .selected-same-day>span{color:var(--bg-primary, #FFFFFF)}.daterangepicker-container .daterangepicker-container__view .daterangepicker-container__body .daterangepicker-container__days .selected-start-day{background-color:var(--brand-primary, #0937B2);border-radius:20px 4px 4px 20px}.daterangepicker-container .daterangepicker-container__view .daterangepicker-container__body .daterangepicker-container__days .selected-start-day>span{color:var(--bg-primary, #FFFFFF)}.daterangepicker-container .daterangepicker-container__view .daterangepicker-container__body .daterangepicker-container__days .selected-end-day{background-color:var(--brand-primary, #0937B2);border-radius:0 20px 20px 0}.daterangepicker-container .daterangepicker-container__view .daterangepicker-container__body .daterangepicker-container__days .selected-end-day>span{color:var(--bg-primary, #FFFFFF)}.daterangepicker-container .daterangepicker-container__view .daterangepicker-container__body .daterangepicker-container__days .in-range-day:not(.disabled-day){background-color:var(--brand-primary-lightest, #CBDDFB)}.daterangepicker-container .daterangepicker-container__time{border-top:1px solid var(--border-primary, #E0E0E0);padding:16px 24px;background-color:#f8f9fa;display:flex;gap:24px}.daterangepicker-container .daterangepicker-container__time .time-section{flex:1}.daterangepicker-container .daterangepicker-container__time .time-section h4{margin:0 0 8px;font-size:14px;font-weight:600;color:#333}.daterangepicker-container .daterangepicker-container__time .time-section .time-inputs{display:flex;align-items:center;gap:8px}.daterangepicker-container .daterangepicker-container__time .time-section .time-inputs .time-input{width:60px;padding:8px;border:1px solid #ddd;border-radius:4px;text-align:center;font-size:14px}.daterangepicker-container .daterangepicker-container__time .time-section .time-inputs .time-input:focus{outline:none;border-color:var(--brand-primary, #0937B2);box-shadow:0 0 0 2px #0937b233}.daterangepicker-container .daterangepicker-container__time .time-section .time-inputs .time-input.hour-input,.daterangepicker-container .daterangepicker-container__time .time-section .time-inputs .time-input.minute-input{width:50px}.daterangepicker-container .daterangepicker-container__time .time-section .time-inputs .time-separator{font-size:16px;font-weight:600;color:#666}.daterangepicker-container .daterangepicker-container__time .time-section .time-inputs .am-pm-selector{padding:7.1px 12px;border:1px solid #ddd;border-radius:4px;background-color:#fff;font-size:14px;cursor:pointer}.daterangepicker-container .daterangepicker-container__time .time-section .time-inputs .am-pm-selector:focus{outline:none;border-color:var(--brand-primary, #0937B2)}.daterangepicker-container .daterangepicker__footer{display:flex;justify-content:flex-end;border-top:1px solid var(--border-primary, #E0E0E0);padding:16px 24px;gap:24px}@media only screen and (max-width: 900px){.daterangepicker-container .daterangepicker__footer{justify-content:space-evenly;padding:2% 0;background-color:var(--bg-primary, #FFFFFF);position:fixed;bottom:0;left:0;width:100%;height:8vh;border-top:2px solid var(--text-disabled, #C8CDD3)}.daterangepicker-container .daterangepicker__footer #mobile-footer-btn{width:36%;font-size:3.8vw}}\n"] }]
     }], () => [{ type: undefined, decorators: [{
                 type: Inject,
                 args: [CONTAINER_DATA]

package/esm2022/dropdown/dropdown.component.mjs CHANGED Viewed

@@ -469,11 +469,11 @@ export class DropdownComponent {
             i0.ɵɵproperty("ngIf", !ctx.showOnlyIcon())("ngIfElse", showIcon_r9);
             i0.ɵɵadvance(3);
             i0.ɵɵproperty("ngStyle", i0.ɵɵpureFunction1(14, _c6, ctx.isOpen() ? "rotate(180deg)" : "rotate(0deg)"));
-        } }, dependencies: [i2.NgClass, i2.NgIf, i2.NgTemplateOutlet, i2.NgStyle, i3.DefaultValueAccessor, i3.NgControlStatus, i3.NgModel, i4.CdkFixedSizeVirtualScroll, i4.CdkVirtualForOf, i4.CdkVirtualScrollViewport, i5.LoaderComponent, i6.CdkTrapFocus], styles: [".main-container[_ngcontent-%COMP%]{position:relative;display:flex;flex-wrap:wrap;justify-content:center;align-items:center;height:32px;width:256px;font-family:Lato,sans-serif!important}.main-container[_ngcontent-%COMP%]   .dropdown[_ngcontent-%COMP%]{overflow:hidden;white-space:nowrap;text-overflow:ellipsis;height:inherit;border:1px solid #e0e0e0;border-radius:6px;background-color:#fff;cursor:pointer;display:flex;gap:4px;align-items:center;width:100%;box-sizing:border-box;padding:0 12px}.main-container[_ngcontent-%COMP%]   .dropdown[_ngcontent-%COMP%]:hover, .main-container[_ngcontent-%COMP%]   .dropdown[_ngcontent-%COMP%]:focus-visible{background-color:#f5f7fc;outline:none}.main-container[_ngcontent-%COMP%]   .dropdown[_ngcontent-%COMP%]   .label[_ngcontent-%COMP%]{box-sizing:border-box;display:flex;justify-content:flex-start;align-items:center;font-style:normal;font-weight:400;font-size:14px;line-height:20px;letter-spacing:.2px;color:#181f33}.main-container[_ngcontent-%COMP%]   .dropdown[_ngcontent-%COMP%]   .label[_ngcontent-%COMP%]   .text[_ngcontent-%COMP%]{margin:0!important;text-overflow:ellipsis;overflow:hidden;white-space:nowrap;font-style:normal;font-weight:400;font-size:14px;line-height:20px;letter-spacing:.2px;color:#181f33}.main-container[_ngcontent-%COMP%]   .dropdown[_ngcontent-%COMP%]   .label[_ngcontent-%COMP%]   .count[_ngcontent-%COMP%]{background-color:#e0e0e0;border-radius:50%;padding:2px 7px;margin:0}.main-container[_ngcontent-%COMP%]   .dropdown[_ngcontent-%COMP%]   .handle[_ngcontent-%COMP%]{width:24px;height:24px;transition:.3s;position:absolute;right:12px;border-radius:50%;overflow:hidden}.main-container[_ngcontent-%COMP%]   .dropdown-port[_ngcontent-%COMP%]{background:#e6ebf7}.popup-container[_ngcontent-%COMP%]{width:100%;max-height:340px;padding-bottom:0;border:1px solid #e0e0e0;border-radius:8px;background-color:#fff;box-shadow:0 12px 24px #0000001f;display:flex;flex-direction:column;overflow:hidden;justify-content:space-between}.popup-container[_ngcontent-%COMP%]::-webkit-scrollbar{width:0;height:0}.popup-container[_ngcontent-%COMP%]   .search-container[_ngcontent-%COMP%]{position:relative;box-sizing:border-box;padding:8px}.popup-container[_ngcontent-%COMP%]   .search-container[_ngcontent-%COMP%]   .search-icon[_ngcontent-%COMP%]{position:absolute;width:24px;height:24px;top:50%;transform:translateY(-50%);left:18px;z-index:1}.popup-container[_ngcontent-%COMP%]   .search-container[_ngcontent-%COMP%]   .search-input[_ngcontent-%COMP%]{height:40px;width:100%;padding:12px;border:1px solid #e0e0e0;box-sizing:border-box;border-radius:8px;outline:none;caret-color:#0937b2;font-style:normal;font-weight:400;font-size:12px;line-height:18px;display:flex;align-items:center;letter-spacing:.2px;color:#181f33}.popup-container[_ngcontent-%COMP%]   .search-container[_ngcontent-%COMP%]   .cancel-icon[_ngcontent-%COMP%]{position:absolute;cursor:pointer;width:24px;height:24px;top:50%;transform:translateY(-50%);right:18px;z-index:1}.popup-container[_ngcontent-%COMP%]   .items[_ngcontent-%COMP%]{padding:0 0 8px 8px;overflow-y:auto}.popup-container[_ngcontent-%COMP%]   .items[_ngcontent-%COMP%]::-webkit-scrollbar{width:5px;height:0}.popup-container[_ngcontent-%COMP%]   .items[_ngcontent-%COMP%]::-webkit-scrollbar-thumb{background:#9aa7b4;border-radius:10px}.popup-container[_ngcontent-%COMP%]   .items[_ngcontent-%COMP%]   .noData[_ngcontent-%COMP%]{display:flex;justify-content:center;align-items:center;height:44px;font-style:normal;font-weight:400;font-size:14px;line-height:20px;letter-spacing:.2px;color:#181f33}.popup-container[_ngcontent-%COMP%]   .items[_ngcontent-%COMP%]   .dropdown-viewport[_ngcontent-%COMP%]{height:100%}.popup-container[_ngcontent-%COMP%]   .items[_ngcontent-%COMP%]   .dropdown-viewport[_ngcontent-%COMP%]   .item[_ngcontent-%COMP%]{cursor:pointer;display:flex;justify-content:flex-start;align-items:center;gap:10px;padding:4px 12px;border-radius:6px;min-height:40px;height:auto;letter-spacing:.2px;color:#181f33}.popup-container[_ngcontent-%COMP%]   .items[_ngcontent-%COMP%]   .dropdown-viewport[_ngcontent-%COMP%]   .item[_ngcontent-%COMP%]:hover, .popup-container[_ngcontent-%COMP%]   .items[_ngcontent-%COMP%]   .dropdown-viewport[_ngcontent-%COMP%]   .item[_ngcontent-%COMP%]:focus-visible{background-color:#f5f7fc;outline:none}.popup-container[_ngcontent-%COMP%]   .items[_ngcontent-%COMP%]   .dropdown-viewport[_ngcontent-%COMP%]   .item[_ngcontent-%COMP%]   .label[_ngcontent-%COMP%]{width:100%;line-height:20px;font-size:14px;font-style:normal;font-weight:400}.popup-container[_ngcontent-%COMP%]   .items[_ngcontent-%COMP%]   .dropdown-viewport[_ngcontent-%COMP%]   .item[_ngcontent-%COMP%]   .label[_ngcontent-%COMP%]   .primaryText[_ngcontent-%COMP%]{color:#181f33;font-family:Lato;font-size:14px;line-height:20px;letter-spacing:.2px;white-space:normal;word-wrap:break-word}.popup-container[_ngcontent-%COMP%]   .items[_ngcontent-%COMP%]   .dropdown-viewport[_ngcontent-%COMP%]   .item[_ngcontent-%COMP%]   .label[_ngcontent-%COMP%]   .secondaryText[_ngcontent-%COMP%]{color:#6a737d;font-family:Lato;font-size:14px;line-height:20px;letter-spacing:.2px;white-space:normal;word-wrap:break-word}.popup-container[_ngcontent-%COMP%]   .items[_ngcontent-%COMP%]   .dropdown-viewport[_ngcontent-%COMP%]   .item[_ngcontent-%COMP%]   .icon-container[_ngcontent-%COMP%]{width:10%;display:flex;justify-content:flex-end}.popup-container[_ngcontent-%COMP%]   .items[_ngcontent-%COMP%]   .dropdown-viewport[_ngcontent-%COMP%]   .item[_ngcontent-%COMP%]   .icon-container[_ngcontent-%COMP%]   .icon[_ngcontent-%COMP%]{width:20px;height:20px}.popup-container[_ngcontent-%COMP%]   .items[_ngcontent-%COMP%]   .item-disabled[_ngcontent-%COMP%]{cursor:not-allowed!important}.popup-container[_ngcontent-%COMP%]   .items[_ngcontent-%COMP%]   .item-disabled[_ngcontent-%COMP%]:hover, .popup-container[_ngcontent-%COMP%]   .items[_ngcontent-%COMP%]   .item-disabled[_ngcontent-%COMP%]:focus-visible{background-color:transparent!important;outline:none!important}.popup-container[_ngcontent-%COMP%]   .items[_ngcontent-%COMP%]   .item-disabled[_ngcontent-%COMP%]   .label[_ngcontent-%COMP%] > span[_ngcontent-%COMP%]{color:#929dab!important;-webkit-user-select:none!important;user-select:none!important}.popup-container[_ngcontent-%COMP%]   .items[_ngcontent-%COMP%]   .item-selected[_ngcontent-%COMP%]{background-color:#e0e6f6;outline:none}.popup-container[_ngcontent-%COMP%]   .items[_ngcontent-%COMP%]   .icon-only[_ngcontent-%COMP%]{justify-content:center!important}[_ngcontent-%COMP%]::-webkit-scrollbar{height:8px;width:8px;background:#fff;border-radius:13px}[_ngcontent-%COMP%]::-webkit-scrollbar-thumb{background:#c8cdd3;border-radius:13px;cursor:pointer}.status-container[_ngcontent-%COMP%]{display:flex;justify-content:center;align-items:center;height:128px}.status-container[_ngcontent-%COMP%]   p[_ngcontent-%COMP%]{text-align:center}"] }); }
+        } }, dependencies: [i2.NgClass, i2.NgIf, i2.NgTemplateOutlet, i2.NgStyle, i3.DefaultValueAccessor, i3.NgControlStatus, i3.NgModel, i4.CdkFixedSizeVirtualScroll, i4.CdkVirtualForOf, i4.CdkVirtualScrollViewport, i5.LoaderComponent, i6.CdkTrapFocus], styles: ["[_ngcontent-%COMP%]:root{--pmry-200: #99BAF7;--pmry-100: #CBDDFB;--pmry-500: #0937B2;--pmry-400: #3C68D0;--pmry-600: #062A99;--pmry-700: #041F80;--pmry-300: #638FE7;--pmry-800: #021567;--pmry-900: #010F55;--sec-d-purple: #40447F;--sec-maroon: #6B034E;--sec-mud-red: #B23600;--sec-orange: #ED711C;--sec-purple: #815FD5;--sec-teal: #10ADAE;--sec-yellow: #D4900C;--sec-green: #547F40;--sec-bright-green: #27D22E;--sec-dark-teal: #035F6B;--sec-chocolate: #7C2F33;--sec-rube-pink: #C13D6D;--sec-cerulean: #0087B2;--sem-error: #B00020;--sem-info: #0091FF;--sem-warning: #FF9D00;--sem-success: #38AF49;--grey-bg-1: #FAFAFA;--grey-bg: #F5F5F5;--grey-seperators: #E0E0E0;--grey-disabled: #C8CDD3;--grey-hover: #F5F7FC;--grey-pressed: #E6EBF7;--grey-row: #F5F7FC;--dec-light-yellow: #F4E7C3;--dec-light-purple: #DACFF9;--dec-light-green: #E4F5E9;--dec-light-green2: #F1FFF3;--dec-light-pink: #FAE1EA;--dec-: #F4CBC1;--dec-lt-orange: #FAEFED;--dec-light-blue: #CFECF9;--dec-row-selection: #F1FDF8;--dec-row-selection2: #F2FBFF;--dec-row-lines: #D3E1E9;--text-white: #FFFFFF;--text-muted: #6A737D;--text-black: #181F33;--MR-solid-blue2:#C8D5F6;--MR-solid-purple:#C9C3FB;--MR-solid-orange:#EEAC9F;--MR-solid-green:#ACDADA;--MR-solid-brown:#E8C8AF;--MR-solid-yellow:#FFEFC7;--MR-solid-blue:#BBE6FF;--MR-solid-pink:#FFC6F2;--tr-hover:#F0F3FA;--tr-pressed:#DAE1F3;--brand-primary: #0937B2;--brand-primary-light: #3C68D0;--brand-primary-dark: #062A99;--brand-primary-darker: #041F80;--brand-primary-lighter: #638FE7;--brand-primary-lightest: #CBDDFB;--brand-primary-hover: #F0F3FA;--brand-primary-active: #DAE1F3;--brand-secondary: #ED711C;--brand-secondary-light: #F09E65;--brand-secondary-dark: #B23600;--brand-secondary-lighter: #FFC6F2;--brand-accent: #10ADAE;--brand-accent-light: #16CBBC;--brand-accent-dark: #035F6B;--brand-accent-lighter: #ACDADA;--brand-success: #38AF49;--brand-success-light: #4CAF50;--brand-success-dark: #216531;--brand-success-lighter: #E4F5E9;--brand-success-lightest: #F1FFF3;--brand-error: #B00020;--brand-error-light: #F04E4E;--brand-error-dark: #A60060;--brand-error-lighter: #FAE1EA;--brand-error-lightest: #FDF2F2;--brand-warning: #FF9D00;--brand-warning-light: #D4900C;--brand-warning-dark: #624000;--brand-warning-lighter: #F4E7C3;--brand-warning-lightest: #FAEFED;--brand-info: #0091FF;--brand-info-light: #35A1FF;--brand-info-dark: #0087B2;--brand-info-lighter: #CFECF9;--text-primary: #181F33;--text-secondary: #6A737D;--text-tertiary: #929DAB;--text-disabled: #929DAB;--text-primary-87: rgba(24, 31, 51, .87);--text-primary-60: rgba(24, 31, 51, .6);--text-primary-38: rgba(24, 31, 51, .38);--text-primary-12: rgba(24, 31, 51, .12);--bg-primary: #FFFFFF;--bg-secondary: #FAFAFA;--bg-tertiary: #F5F5F5;--bg-overlay: rgba(0, 0, 0, .32);--bg-overlay-light: rgba(0, 0, 0, .12);--bg-overlay-lighter: rgba(0, 0, 0, .08);--bg-overlay-lightest: rgba(0, 0, 0, .04);--border-primary: #E0E0E0;--border-secondary: #D6DCE2;--border-tertiary: #C8CDD3;--border-light: #F1F4F8;--border-primary-12: rgba(0, 0, 0, .12);--border-primary-08: rgba(0, 0, 0, .08);--border-primary-06: rgba(0, 0, 0, .06);--shadow-primary: rgba(0, 0, 0, .12);--shadow-secondary: rgba(0, 0, 0, .08);--shadow-tertiary: rgba(0, 0, 0, .04);--shadow-light: rgba(0, 0, 0, .06);--status-available: #929DAB;--status-unavailable: #CCD3DA;--status-hotseat: #857BFF;--status-multiteam: #10ADAE;--status-selected: #10ADAE;--status-upcoming: #D4900C;--status-room: #38AF49;--status-room-booked: #B23600;--status-room-unavailable: #181F33;--team-color-1: #F8C52E;--team-color-2: #FA8E20;--team-color-3: #987CDD;--team-color-4: #16CBBC;--team-color-5: #E65010;--team-color-6: #A60060;--team-color-7: #ED323B;--team-color-8: #35A1FF;--team-color-9: #80D348}.main-container[_ngcontent-%COMP%]{position:relative;display:flex;flex-wrap:wrap;justify-content:center;align-items:center;height:32px;width:256px;font-family:Lato,sans-serif!important}.main-container[_ngcontent-%COMP%]   .dropdown[_ngcontent-%COMP%]{overflow:hidden;white-space:nowrap;text-overflow:ellipsis;height:inherit;border:1px solid var(--border-primary, #E0E0E0);border-radius:6px;background-color:var(--bg-primary, #FFFFFF);cursor:pointer;display:flex;gap:4px;align-items:center;width:100%;box-sizing:border-box;padding:0 12px}.main-container[_ngcontent-%COMP%]   .dropdown[_ngcontent-%COMP%]:hover, .main-container[_ngcontent-%COMP%]   .dropdown[_ngcontent-%COMP%]:focus-visible{background-color:var(--brand-primary-hover, #F0F3FA);outline:none}.main-container[_ngcontent-%COMP%]   .dropdown[_ngcontent-%COMP%]   .label[_ngcontent-%COMP%]{box-sizing:border-box;display:flex;justify-content:flex-start;align-items:center;font-style:normal;font-weight:400;font-size:14px;line-height:20px;letter-spacing:.2px;color:var(--text-primary, #181F33)}.main-container[_ngcontent-%COMP%]   .dropdown[_ngcontent-%COMP%]   .label[_ngcontent-%COMP%]   .text[_ngcontent-%COMP%]{margin:0!important;text-overflow:ellipsis;overflow:hidden;white-space:nowrap;font-style:normal;font-weight:400;font-size:14px;line-height:20px;letter-spacing:.2px;color:var(--text-primary, #181F33)}.main-container[_ngcontent-%COMP%]   .dropdown[_ngcontent-%COMP%]   .label[_ngcontent-%COMP%]   .count[_ngcontent-%COMP%]{background-color:var(--border-primary, #E0E0E0);border-radius:50%;padding:2px 7px;margin:0}.main-container[_ngcontent-%COMP%]   .dropdown[_ngcontent-%COMP%]   .handle[_ngcontent-%COMP%]{width:24px;height:24px;transition:.3s;position:absolute;right:12px;border-radius:50%;overflow:hidden}.main-container[_ngcontent-%COMP%]   .dropdown-port[_ngcontent-%COMP%]{background:var(--brand-primary-active, #DAE1F3)}.popup-container[_ngcontent-%COMP%]{width:100%;max-height:340px;padding-bottom:0;border:1px solid var(--border-primary, #E0E0E0);border-radius:8px;background-color:var(--bg-primary, #FFFFFF);box-shadow:0 12px 24px #0000001f;display:flex;flex-direction:column;overflow:hidden;justify-content:space-between}.popup-container[_ngcontent-%COMP%]::-webkit-scrollbar{width:0;height:0}.popup-container[_ngcontent-%COMP%]   .search-container[_ngcontent-%COMP%]{position:relative;box-sizing:border-box;padding:8px}.popup-container[_ngcontent-%COMP%]   .search-container[_ngcontent-%COMP%]   .search-icon[_ngcontent-%COMP%]{position:absolute;width:24px;height:24px;top:50%;transform:translateY(-50%);left:18px;z-index:1}.popup-container[_ngcontent-%COMP%]   .search-container[_ngcontent-%COMP%]   .search-input[_ngcontent-%COMP%]{height:40px;width:100%;padding:12px;border:1px solid var(--border-primary, #E0E0E0);box-sizing:border-box;border-radius:8px;outline:none;caret-color:var(--brand-primary, #0937B2);font-style:normal;font-weight:400;font-size:12px;line-height:18px;display:flex;align-items:center;letter-spacing:.2px;color:var(--text-primary, #181F33)}.popup-container[_ngcontent-%COMP%]   .search-container[_ngcontent-%COMP%]   .cancel-icon[_ngcontent-%COMP%]{position:absolute;cursor:pointer;width:24px;height:24px;top:50%;transform:translateY(-50%);right:18px;z-index:1}.popup-container[_ngcontent-%COMP%]   .items[_ngcontent-%COMP%]{padding:0 0 8px 8px;overflow-y:auto}.popup-container[_ngcontent-%COMP%]   .items[_ngcontent-%COMP%]::-webkit-scrollbar{width:5px;height:0}.popup-container[_ngcontent-%COMP%]   .items[_ngcontent-%COMP%]::-webkit-scrollbar-thumb{background:var(--text-tertiary, #929DAB);border-radius:10px}.popup-container[_ngcontent-%COMP%]   .items[_ngcontent-%COMP%]   .noData[_ngcontent-%COMP%]{display:flex;justify-content:center;align-items:center;height:44px;font-style:normal;font-weight:400;font-size:14px;line-height:20px;letter-spacing:.2px;color:var(--text-primary, #181F33)}.popup-container[_ngcontent-%COMP%]   .items[_ngcontent-%COMP%]   .dropdown-viewport[_ngcontent-%COMP%]{height:100%}.popup-container[_ngcontent-%COMP%]   .items[_ngcontent-%COMP%]   .dropdown-viewport[_ngcontent-%COMP%]   .item[_ngcontent-%COMP%]{cursor:pointer;display:flex;justify-content:flex-start;align-items:center;gap:10px;padding:4px 12px;border-radius:6px;min-height:40px;height:auto;letter-spacing:.2px;color:var(--text-primary, #181F33)}.popup-container[_ngcontent-%COMP%]   .items[_ngcontent-%COMP%]   .dropdown-viewport[_ngcontent-%COMP%]   .item[_ngcontent-%COMP%]:hover, .popup-container[_ngcontent-%COMP%]   .items[_ngcontent-%COMP%]   .dropdown-viewport[_ngcontent-%COMP%]   .item[_ngcontent-%COMP%]:focus-visible{background-color:var(--brand-primary-hover, #F0F3FA);outline:none}.popup-container[_ngcontent-%COMP%]   .items[_ngcontent-%COMP%]   .dropdown-viewport[_ngcontent-%COMP%]   .item[_ngcontent-%COMP%]   .label[_ngcontent-%COMP%]{width:100%;line-height:20px;font-size:14px;font-style:normal;font-weight:400}.popup-container[_ngcontent-%COMP%]   .items[_ngcontent-%COMP%]   .dropdown-viewport[_ngcontent-%COMP%]   .item[_ngcontent-%COMP%]   .label[_ngcontent-%COMP%]   .primaryText[_ngcontent-%COMP%]{color:var(--text-primary, #181F33);font-family:Lato;font-size:14px;line-height:20px;letter-spacing:.2px;white-space:normal;word-wrap:break-word}.popup-container[_ngcontent-%COMP%]   .items[_ngcontent-%COMP%]   .dropdown-viewport[_ngcontent-%COMP%]   .item[_ngcontent-%COMP%]   .label[_ngcontent-%COMP%]   .secondaryText[_ngcontent-%COMP%]{color:var(--text-secondary, #6A737D);font-family:Lato;font-size:14px;line-height:20px;letter-spacing:.2px;white-space:normal;word-wrap:break-word}.popup-container[_ngcontent-%COMP%]   .items[_ngcontent-%COMP%]   .dropdown-viewport[_ngcontent-%COMP%]   .item[_ngcontent-%COMP%]   .icon-container[_ngcontent-%COMP%]{width:10%;display:flex;justify-content:flex-end}.popup-container[_ngcontent-%COMP%]   .items[_ngcontent-%COMP%]   .dropdown-viewport[_ngcontent-%COMP%]   .item[_ngcontent-%COMP%]   .icon-container[_ngcontent-%COMP%]   .icon[_ngcontent-%COMP%]{width:20px;height:20px}.popup-container[_ngcontent-%COMP%]   .items[_ngcontent-%COMP%]   .item-disabled[_ngcontent-%COMP%]{cursor:not-allowed!important}.popup-container[_ngcontent-%COMP%]   .items[_ngcontent-%COMP%]   .item-disabled[_ngcontent-%COMP%]:hover, .popup-container[_ngcontent-%COMP%]   .items[_ngcontent-%COMP%]   .item-disabled[_ngcontent-%COMP%]:focus-visible{background-color:transparent!important;outline:none!important}.popup-container[_ngcontent-%COMP%]   .items[_ngcontent-%COMP%]   .item-disabled[_ngcontent-%COMP%]   .label[_ngcontent-%COMP%] > span[_ngcontent-%COMP%]{color:var(--text-tertiary, #929DAB)!important;-webkit-user-select:none!important;user-select:none!important}.popup-container[_ngcontent-%COMP%]   .items[_ngcontent-%COMP%]   .item-selected[_ngcontent-%COMP%]{background-color:var(--brand-primary-active, #DAE1F3);outline:none}.popup-container[_ngcontent-%COMP%]   .items[_ngcontent-%COMP%]   .icon-only[_ngcontent-%COMP%]{justify-content:center!important}[_ngcontent-%COMP%]::-webkit-scrollbar{height:8px;width:8px;background:var(--bg-primary, #FFFFFF);border-radius:13px}[_ngcontent-%COMP%]::-webkit-scrollbar-thumb{background:var(--text-disabled, #C8CDD3);border-radius:13px;cursor:pointer}.status-container[_ngcontent-%COMP%]{display:flex;justify-content:center;align-items:center;height:128px}.status-container[_ngcontent-%COMP%]   p[_ngcontent-%COMP%]{text-align:center}"] }); }
 }
 (() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(DropdownComponent, [{
         type: Component,
-        args: [{ selector: "mis-dropdown", template: "<div (click)=\"setUpAsyncDataSearch()\"\n(keyup.enter)=\"setUpAsyncDataSearch()\"\n  class=\"main-container\"\n  [ngStyle]=\"{\n    height: height().length > 0 ? height() : '',\n    width: width().length > 0 ? width() : ''\n  }\"\n>\n  <div\n    class=\"dropdown\"\n    #select\n    tabindex=\"0\"\n    (keyup.enter)=\"toggleDropdown()\"\n    (click)=\"toggleDropdown()\"\n    [ngStyle]=\"customStyles()\"\n    [attr.aria-label]=\"ariaLabel()\"\n    [ngClass]=\"isOpen() ? 'dropdown-port': ''\"\n  >\n    <img class=\"img-container\" [width]=\"16\" [height]=\"16\" [src]=\"selectedItem()?.customIcon\" *ngIf=\"selectedItem()?.customIcon\">\n    <div class=\"label\" [ngStyle]=\"{width: selectedItem()?.customIcon ? 'calc(100% - 48px)' : 'calc(100% - 32px)'}\">\n      <p class=\"text\" *ngIf=\"!showOnlyIcon(); else showIcon\">\n        {{ multiLine() ? selectedItem()?.label?.primaryText : selectedItem()?.label || label() }}\n      </p>\n      <ng-template #showIcon>\n        <p class=\"text\" *ngIf=\"!selectedItem()?.icon\">\n          {{ label() }}\n        </p>\n        <img class=\"icon\" *ngIf=\"!!selectedItem()?.icon\" [src]=\"selectedItem()?.icon\" alt=\"no img\" />\n      </ng-template>\n    </div>\n    <svg\n      class=\"handle\"\n      [ngStyle]=\"{ transform: isOpen() ? 'rotate(180deg)' : 'rotate(0deg)' }\"\n      width=\"20\"\n      height=\"20\"\n      viewBox=\"0 0 20 20\"\n      fill=\"none\"\n      xmlns=\"http://www.w3.org/2000/svg\"\n    >\n      <path\n        fill-rule=\"evenodd\"\n        clip-rule=\"evenodd\"\n        d=\"M13.825 7.15845L10 10.9751L6.175 7.15845L5 8.33345L10 13.3334L15 8.33345L13.825 7.15845Z\"\n        fill=\"#181F33\"\n      />\n    </svg>\n  </div>\n</div>\n\n<ng-template #popupContainer>\n  <div\n    class=\"popup-container\" \n    cdkTrapFocus \n    [cdkTrapFocusAutoCapture]=\"true\" \n    tabindex=\"0\"\n    [ngStyle]=\"{\n      height: dropdownListHeight(),\n      width: dropdownListWidth()\n    }\"\n    (keyup.esc)=\"closeOnEsc($event)\"\n    aria-label=\"dropdown\"\n  >\n    <div *ngIf=\"searchEnabled()\" class=\"search-container\">\n      <svg\n        *ngIf=\"!isSearchInputFocused()\"\n        class=\"search-icon\"\n        width=\"24\"\n        height=\"24\"\n        viewBox=\"0 0 24 24\"\n        fill=\"none\"\n        xmlns=\"http://www.w3.org/2000/svg\"\n      >\n        <path\n          fill-rule=\"evenodd\"\n          clip-rule=\"evenodd\"\n          d=\"M4.21508 11.1456C4.21508 7.3179 7.33722 4.21165 11.1926 4.21165C15.048 4.21165 18.1702 7.3179 18.1702 11.1456C18.1702 12.6931 17.6599 14.1226 16.7972 15.2767L15.3685 16.7013C14.2044 17.5668 12.759 18.0796 11.1926 18.0796C7.33722 18.0796 4.21508 14.9734 4.21508 11.1456ZM15.9421 17.7835C14.6021 18.7329 12.9627 19.2913 11.1926 19.2913C6.66977 19.2913 3 15.6461 3 11.1456C3 6.64512 6.66977 3 11.1926 3C15.7155 3 19.3852 6.64512 19.3852 11.1456C19.3852 12.9371 18.8037 14.5931 17.8184 15.9375L19.8361 17.4048C20.6705 17.912 21.7554 18.6543 20.2454 20.215C18.7353 21.7756 18.0099 20.6663 17.4991 19.8364L15.9421 17.7835Z\"\n          fill=\"#6A737D\"\n        />\n      </svg>\n      <input\n        [ngModel]=\"searchInput()\"\n        [ngStyle]=\"{\n          paddingLeft: isSearchInputFocused() ? '12px' : '45px',\n          border: isSearchInputFocused() ? '1px solid #0937B2' : '1px solid #e0e0e0',\n          paddingRight: isSearchInputFocused() ? '45px' : '10px'\n        }\"\n        [tabIndex]=\"0\"\n        (ngModelChange)=\"searchInputOnChange($event)\"\n        [placeholder]=\"isSearchInputFocused() ? '' : searchLabel()\"\n        (focus)=\"searchInputFocused(true)\"\n        class=\"search-input\"\n        [attr.aria-label]=\"searchLabel()\"\n      />\n      <svg\n        *ngIf=\"isSearchInputFocused()\"\n        class=\"cancel-icon\"\n        (click)=\"searchInputCanceled($event)\"\n        width=\"24\"\n        height=\"24\"\n        viewBox=\"0 0 24 24\"\n        fill=\"none\"\n        xmlns=\"http://www.w3.org/2000/svg\"\n      >\n        <path\n          fill-rule=\"evenodd\"\n          clip-rule=\"evenodd\"\n          d=\"M8.87446 7.32144C8.44588 6.89285 7.751 6.89285 7.32242 7.32144C6.89383 7.75002 6.89383 8.4449 7.32242 8.87349L10.4488 11.9999L7.32357 15.1252C6.89498 15.5538 6.89498 16.2486 7.32357 16.6772C7.75215 17.1058 8.44703 17.1058 8.87561 16.6772L12.0009 13.552L15.1261 16.6772C15.5547 17.1058 16.2496 17.1058 16.6781 16.6772C17.1067 16.2486 17.1067 15.5537 16.6781 15.1251L13.5529 11.9999L16.6793 8.87354C17.1079 8.44496 17.1079 7.75008 16.6793 7.3215C16.2507 6.89291 15.5558 6.89291 15.1273 7.3215L12.0009 10.4479L8.87446 7.32144Z\"\n          fill=\"#6A737D\"\n        />\n      </svg>\n    </div>\n    <div class=\"status-container\" *ngIf=\"loading()\">\n      <mis-loader [mobileView]=\"true\"></mis-loader>\n    </div>\n    <div tabindex=\"-1\" *ngIf=\"!searchEnabled()\" cdkFocusInitial></div>\n    <div class=\"items\" #itemsContainer [ngStyle]=\"itemsContainerStyle\" *ngIf=\"!loading()\">\n      <cdk-virtual-scroll-viewport *ngIf=\"currentData.length > 0\" \n        [itemSize]=\"itemSizeForCdk() || 36\" \n        class=\"dropdown-viewport\"\n        [minBufferPx]=\"200\"\n        [maxBufferPx]=\"400\">\n        <div\n          class=\"item\"\n          tabindex=\"0\"\n          [ngClass]=\"{ \n            'item-disabled': item.disabled, \n            'item-selected': (higlightSelectedValue() && item.value === selectedItem()?.value), \n            'icon-only': showOnlyIcon() \n          }\"\n          (click)=\"item.disabled ? null : selectItem(item)\"\n          (keyup.enter)=\"item.disabled ? null : selectItem(item)\"\n          *cdkVirtualFor=\"let item of currentData; let i = index\"\n          tabIndex=\"0\"\n        >\n          <ng-container *ngIf=\"customItem; else standardItem\">\n            <ng-container\n              [ngTemplateOutlet]=\"customItem\"\n              [ngTemplateOutletContext]=\"{ $implicit: item }\"\n            ></ng-container>\n          </ng-container>\n          <ng-template #standardItem>\n            <div class=\"label\" *ngIf=\"!showOnlyIcon()\" [ngStyle]=\"{ \n              width: item.icon ? '90%' : '100%', \n              'display': multiLine() ? 'flex': 'inherit', \n              'flex-direction': multiLine() ? 'column': 'inherit' \n            }\">\n              <span class=\"primaryText\">\n                {{ multiLine() ? item?.label?.primaryText : item?.label }}\n              </span>\n              <span class=\"secondaryText\" *ngIf=\"multiLine()\">\n                {{ item?.label?.secondaryText ? item?.label?.secondaryText : additionalInfoMessage() }}\n              </span>\n            </div>\n            <div class=\"icon-container\" *ngIf=\"item.icon\">\n              <img class=\"icon\" [src]=\"item.icon\" alt=\"no img\" />\n            </div>\n          </ng-template>\n        </div>\n      </cdk-virtual-scroll-viewport>\n      <div class=\"noData\" *ngIf=\"currentData.length === 0\">\n        {{ searchInput() === \"\" ? noDataMessage() : \"No results\" }}\n      </div>\n    </div>\n  </div>\n</ng-template>", styles: [".main-container{position:relative;display:flex;flex-wrap:wrap;justify-content:center;align-items:center;height:32px;width:256px;font-family:Lato,sans-serif!important}.main-container .dropdown{overflow:hidden;white-space:nowrap;text-overflow:ellipsis;height:inherit;border:1px solid #e0e0e0;border-radius:6px;background-color:#fff;cursor:pointer;display:flex;gap:4px;align-items:center;width:100%;box-sizing:border-box;padding:0 12px}.main-container .dropdown:hover,.main-container .dropdown:focus-visible{background-color:#f5f7fc;outline:none}.main-container .dropdown .label{box-sizing:border-box;display:flex;justify-content:flex-start;align-items:center;font-style:normal;font-weight:400;font-size:14px;line-height:20px;letter-spacing:.2px;color:#181f33}.main-container .dropdown .label .text{margin:0!important;text-overflow:ellipsis;overflow:hidden;white-space:nowrap;font-style:normal;font-weight:400;font-size:14px;line-height:20px;letter-spacing:.2px;color:#181f33}.main-container .dropdown .label .count{background-color:#e0e0e0;border-radius:50%;padding:2px 7px;margin:0}.main-container .dropdown .handle{width:24px;height:24px;transition:.3s;position:absolute;right:12px;border-radius:50%;overflow:hidden}.main-container .dropdown-port{background:#e6ebf7}.popup-container{width:100%;max-height:340px;padding-bottom:0;border:1px solid #e0e0e0;border-radius:8px;background-color:#fff;box-shadow:0 12px 24px #0000001f;display:flex;flex-direction:column;overflow:hidden;justify-content:space-between}.popup-container::-webkit-scrollbar{width:0;height:0}.popup-container .search-container{position:relative;box-sizing:border-box;padding:8px}.popup-container .search-container .search-icon{position:absolute;width:24px;height:24px;top:50%;transform:translateY(-50%);left:18px;z-index:1}.popup-container .search-container .search-input{height:40px;width:100%;padding:12px;border:1px solid #e0e0e0;box-sizing:border-box;border-radius:8px;outline:none;caret-color:#0937b2;font-style:normal;font-weight:400;font-size:12px;line-height:18px;display:flex;align-items:center;letter-spacing:.2px;color:#181f33}.popup-container .search-container .cancel-icon{position:absolute;cursor:pointer;width:24px;height:24px;top:50%;transform:translateY(-50%);right:18px;z-index:1}.popup-container .items{padding:0 0 8px 8px;overflow-y:auto}.popup-container .items::-webkit-scrollbar{width:5px;height:0}.popup-container .items::-webkit-scrollbar-thumb{background:#9aa7b4;border-radius:10px}.popup-container .items .noData{display:flex;justify-content:center;align-items:center;height:44px;font-style:normal;font-weight:400;font-size:14px;line-height:20px;letter-spacing:.2px;color:#181f33}.popup-container .items .dropdown-viewport{height:100%}.popup-container .items .dropdown-viewport .item{cursor:pointer;display:flex;justify-content:flex-start;align-items:center;gap:10px;padding:4px 12px;border-radius:6px;min-height:40px;height:auto;letter-spacing:.2px;color:#181f33}.popup-container .items .dropdown-viewport .item:hover,.popup-container .items .dropdown-viewport .item:focus-visible{background-color:#f5f7fc;outline:none}.popup-container .items .dropdown-viewport .item .label{width:100%;line-height:20px;font-size:14px;font-style:normal;font-weight:400}.popup-container .items .dropdown-viewport .item .label .primaryText{color:#181f33;font-family:Lato;font-size:14px;line-height:20px;letter-spacing:.2px;white-space:normal;word-wrap:break-word}.popup-container .items .dropdown-viewport .item .label .secondaryText{color:#6a737d;font-family:Lato;font-size:14px;line-height:20px;letter-spacing:.2px;white-space:normal;word-wrap:break-word}.popup-container .items .dropdown-viewport .item .icon-container{width:10%;display:flex;justify-content:flex-end}.popup-container .items .dropdown-viewport .item .icon-container .icon{width:20px;height:20px}.popup-container .items .item-disabled{cursor:not-allowed!important}.popup-container .items .item-disabled:hover,.popup-container .items .item-disabled:focus-visible{background-color:transparent!important;outline:none!important}.popup-container .items .item-disabled .label>span{color:#929dab!important;-webkit-user-select:none!important;user-select:none!important}.popup-container .items .item-selected{background-color:#e0e6f6;outline:none}.popup-container .items .icon-only{justify-content:center!important}::-webkit-scrollbar{height:8px;width:8px;background:#fff;border-radius:13px}::-webkit-scrollbar-thumb{background:#c8cdd3;border-radius:13px;cursor:pointer}.status-container{display:flex;justify-content:center;align-items:center;height:128px}.status-container p{text-align:center}\n"] }]
+        args: [{ selector: "mis-dropdown", template: "<div (click)=\"setUpAsyncDataSearch()\"\n(keyup.enter)=\"setUpAsyncDataSearch()\"\n  class=\"main-container\"\n  [ngStyle]=\"{\n    height: height().length > 0 ? height() : '',\n    width: width().length > 0 ? width() : ''\n  }\"\n>\n  <div\n    class=\"dropdown\"\n    #select\n    tabindex=\"0\"\n    (keyup.enter)=\"toggleDropdown()\"\n    (click)=\"toggleDropdown()\"\n    [ngStyle]=\"customStyles()\"\n    [attr.aria-label]=\"ariaLabel()\"\n    [ngClass]=\"isOpen() ? 'dropdown-port': ''\"\n  >\n    <img class=\"img-container\" [width]=\"16\" [height]=\"16\" [src]=\"selectedItem()?.customIcon\" *ngIf=\"selectedItem()?.customIcon\">\n    <div class=\"label\" [ngStyle]=\"{width: selectedItem()?.customIcon ? 'calc(100% - 48px)' : 'calc(100% - 32px)'}\">\n      <p class=\"text\" *ngIf=\"!showOnlyIcon(); else showIcon\">\n        {{ multiLine() ? selectedItem()?.label?.primaryText : selectedItem()?.label || label() }}\n      </p>\n      <ng-template #showIcon>\n        <p class=\"text\" *ngIf=\"!selectedItem()?.icon\">\n          {{ label() }}\n        </p>\n        <img class=\"icon\" *ngIf=\"!!selectedItem()?.icon\" [src]=\"selectedItem()?.icon\" alt=\"no img\" />\n      </ng-template>\n    </div>\n    <svg\n      class=\"handle\"\n      [ngStyle]=\"{ transform: isOpen() ? 'rotate(180deg)' : 'rotate(0deg)' }\"\n      width=\"20\"\n      height=\"20\"\n      viewBox=\"0 0 20 20\"\n      fill=\"none\"\n      xmlns=\"http://www.w3.org/2000/svg\"\n    >\n      <path\n        fill-rule=\"evenodd\"\n        clip-rule=\"evenodd\"\n        d=\"M13.825 7.15845L10 10.9751L6.175 7.15845L5 8.33345L10 13.3334L15 8.33345L13.825 7.15845Z\"\n        fill=\"#181F33\"\n      />\n    </svg>\n  </div>\n</div>\n\n<ng-template #popupContainer>\n  <div\n    class=\"popup-container\" \n    cdkTrapFocus \n    [cdkTrapFocusAutoCapture]=\"true\" \n    tabindex=\"0\"\n    [ngStyle]=\"{\n      height: dropdownListHeight(),\n      width: dropdownListWidth()\n    }\"\n    (keyup.esc)=\"closeOnEsc($event)\"\n    aria-label=\"dropdown\"\n  >\n    <div *ngIf=\"searchEnabled()\" class=\"search-container\">\n      <svg\n        *ngIf=\"!isSearchInputFocused()\"\n        class=\"search-icon\"\n        width=\"24\"\n        height=\"24\"\n        viewBox=\"0 0 24 24\"\n        fill=\"none\"\n        xmlns=\"http://www.w3.org/2000/svg\"\n      >\n        <path\n          fill-rule=\"evenodd\"\n          clip-rule=\"evenodd\"\n          d=\"M4.21508 11.1456C4.21508 7.3179 7.33722 4.21165 11.1926 4.21165C15.048 4.21165 18.1702 7.3179 18.1702 11.1456C18.1702 12.6931 17.6599 14.1226 16.7972 15.2767L15.3685 16.7013C14.2044 17.5668 12.759 18.0796 11.1926 18.0796C7.33722 18.0796 4.21508 14.9734 4.21508 11.1456ZM15.9421 17.7835C14.6021 18.7329 12.9627 19.2913 11.1926 19.2913C6.66977 19.2913 3 15.6461 3 11.1456C3 6.64512 6.66977 3 11.1926 3C15.7155 3 19.3852 6.64512 19.3852 11.1456C19.3852 12.9371 18.8037 14.5931 17.8184 15.9375L19.8361 17.4048C20.6705 17.912 21.7554 18.6543 20.2454 20.215C18.7353 21.7756 18.0099 20.6663 17.4991 19.8364L15.9421 17.7835Z\"\n          fill=\"#6A737D\"\n        />\n      </svg>\n      <input\n        [ngModel]=\"searchInput()\"\n        [ngStyle]=\"{\n          paddingLeft: isSearchInputFocused() ? '12px' : '45px',\n          border: isSearchInputFocused() ? '1px solid #0937B2' : '1px solid #e0e0e0',\n          paddingRight: isSearchInputFocused() ? '45px' : '10px'\n        }\"\n        [tabIndex]=\"0\"\n        (ngModelChange)=\"searchInputOnChange($event)\"\n        [placeholder]=\"isSearchInputFocused() ? '' : searchLabel()\"\n        (focus)=\"searchInputFocused(true)\"\n        class=\"search-input\"\n        [attr.aria-label]=\"searchLabel()\"\n      />\n      <svg\n        *ngIf=\"isSearchInputFocused()\"\n        class=\"cancel-icon\"\n        (click)=\"searchInputCanceled($event)\"\n        width=\"24\"\n        height=\"24\"\n        viewBox=\"0 0 24 24\"\n        fill=\"none\"\n        xmlns=\"http://www.w3.org/2000/svg\"\n      >\n        <path\n          fill-rule=\"evenodd\"\n          clip-rule=\"evenodd\"\n          d=\"M8.87446 7.32144C8.44588 6.89285 7.751 6.89285 7.32242 7.32144C6.89383 7.75002 6.89383 8.4449 7.32242 8.87349L10.4488 11.9999L7.32357 15.1252C6.89498 15.5538 6.89498 16.2486 7.32357 16.6772C7.75215 17.1058 8.44703 17.1058 8.87561 16.6772L12.0009 13.552L15.1261 16.6772C15.5547 17.1058 16.2496 17.1058 16.6781 16.6772C17.1067 16.2486 17.1067 15.5537 16.6781 15.1251L13.5529 11.9999L16.6793 8.87354C17.1079 8.44496 17.1079 7.75008 16.6793 7.3215C16.2507 6.89291 15.5558 6.89291 15.1273 7.3215L12.0009 10.4479L8.87446 7.32144Z\"\n          fill=\"#6A737D\"\n        />\n      </svg>\n    </div>\n    <div class=\"status-container\" *ngIf=\"loading()\">\n      <mis-loader [mobileView]=\"true\"></mis-loader>\n    </div>\n    <div tabindex=\"-1\" *ngIf=\"!searchEnabled()\" cdkFocusInitial></div>\n    <div class=\"items\" #itemsContainer [ngStyle]=\"itemsContainerStyle\" *ngIf=\"!loading()\">\n      <cdk-virtual-scroll-viewport *ngIf=\"currentData.length > 0\" \n        [itemSize]=\"itemSizeForCdk() || 36\" \n        class=\"dropdown-viewport\"\n        [minBufferPx]=\"200\"\n        [maxBufferPx]=\"400\">\n        <div\n          class=\"item\"\n          tabindex=\"0\"\n          [ngClass]=\"{ \n            'item-disabled': item.disabled, \n            'item-selected': (higlightSelectedValue() && item.value === selectedItem()?.value), \n            'icon-only': showOnlyIcon() \n          }\"\n          (click)=\"item.disabled ? null : selectItem(item)\"\n          (keyup.enter)=\"item.disabled ? null : selectItem(item)\"\n          *cdkVirtualFor=\"let item of currentData; let i = index\"\n          tabIndex=\"0\"\n        >\n          <ng-container *ngIf=\"customItem; else standardItem\">\n            <ng-container\n              [ngTemplateOutlet]=\"customItem\"\n              [ngTemplateOutletContext]=\"{ $implicit: item }\"\n            ></ng-container>\n          </ng-container>\n          <ng-template #standardItem>\n            <div class=\"label\" *ngIf=\"!showOnlyIcon()\" [ngStyle]=\"{ \n              width: item.icon ? '90%' : '100%', \n              'display': multiLine() ? 'flex': 'inherit', \n              'flex-direction': multiLine() ? 'column': 'inherit' \n            }\">\n              <span class=\"primaryText\">\n                {{ multiLine() ? item?.label?.primaryText : item?.label }}\n              </span>\n              <span class=\"secondaryText\" *ngIf=\"multiLine()\">\n                {{ item?.label?.secondaryText ? item?.label?.secondaryText : additionalInfoMessage() }}\n              </span>\n            </div>\n            <div class=\"icon-container\" *ngIf=\"item.icon\">\n              <img class=\"icon\" [src]=\"item.icon\" alt=\"no img\" />\n            </div>\n          </ng-template>\n        </div>\n      </cdk-virtual-scroll-viewport>\n      <div class=\"noData\" *ngIf=\"currentData.length === 0\">\n        {{ searchInput() === \"\" ? noDataMessage() : \"No results\" }}\n      </div>\n    </div>\n  </div>\n</ng-template>", styles: [":root{--pmry-200: #99BAF7;--pmry-100: #CBDDFB;--pmry-500: #0937B2;--pmry-400: #3C68D0;--pmry-600: #062A99;--pmry-700: #041F80;--pmry-300: #638FE7;--pmry-800: #021567;--pmry-900: #010F55;--sec-d-purple: #40447F;--sec-maroon: #6B034E;--sec-mud-red: #B23600;--sec-orange: #ED711C;--sec-purple: #815FD5;--sec-teal: #10ADAE;--sec-yellow: #D4900C;--sec-green: #547F40;--sec-bright-green: #27D22E;--sec-dark-teal: #035F6B;--sec-chocolate: #7C2F33;--sec-rube-pink: #C13D6D;--sec-cerulean: #0087B2;--sem-error: #B00020;--sem-info: #0091FF;--sem-warning: #FF9D00;--sem-success: #38AF49;--grey-bg-1: #FAFAFA;--grey-bg: #F5F5F5;--grey-seperators: #E0E0E0;--grey-disabled: #C8CDD3;--grey-hover: #F5F7FC;--grey-pressed: #E6EBF7;--grey-row: #F5F7FC;--dec-light-yellow: #F4E7C3;--dec-light-purple: #DACFF9;--dec-light-green: #E4F5E9;--dec-light-green2: #F1FFF3;--dec-light-pink: #FAE1EA;--dec-: #F4CBC1;--dec-lt-orange: #FAEFED;--dec-light-blue: #CFECF9;--dec-row-selection: #F1FDF8;--dec-row-selection2: #F2FBFF;--dec-row-lines: #D3E1E9;--text-white: #FFFFFF;--text-muted: #6A737D;--text-black: #181F33;--MR-solid-blue2:#C8D5F6;--MR-solid-purple:#C9C3FB;--MR-solid-orange:#EEAC9F;--MR-solid-green:#ACDADA;--MR-solid-brown:#E8C8AF;--MR-solid-yellow:#FFEFC7;--MR-solid-blue:#BBE6FF;--MR-solid-pink:#FFC6F2;--tr-hover:#F0F3FA;--tr-pressed:#DAE1F3;--brand-primary: #0937B2;--brand-primary-light: #3C68D0;--brand-primary-dark: #062A99;--brand-primary-darker: #041F80;--brand-primary-lighter: #638FE7;--brand-primary-lightest: #CBDDFB;--brand-primary-hover: #F0F3FA;--brand-primary-active: #DAE1F3;--brand-secondary: #ED711C;--brand-secondary-light: #F09E65;--brand-secondary-dark: #B23600;--brand-secondary-lighter: #FFC6F2;--brand-accent: #10ADAE;--brand-accent-light: #16CBBC;--brand-accent-dark: #035F6B;--brand-accent-lighter: #ACDADA;--brand-success: #38AF49;--brand-success-light: #4CAF50;--brand-success-dark: #216531;--brand-success-lighter: #E4F5E9;--brand-success-lightest: #F1FFF3;--brand-error: #B00020;--brand-error-light: #F04E4E;--brand-error-dark: #A60060;--brand-error-lighter: #FAE1EA;--brand-error-lightest: #FDF2F2;--brand-warning: #FF9D00;--brand-warning-light: #D4900C;--brand-warning-dark: #624000;--brand-warning-lighter: #F4E7C3;--brand-warning-lightest: #FAEFED;--brand-info: #0091FF;--brand-info-light: #35A1FF;--brand-info-dark: #0087B2;--brand-info-lighter: #CFECF9;--text-primary: #181F33;--text-secondary: #6A737D;--text-tertiary: #929DAB;--text-disabled: #929DAB;--text-primary-87: rgba(24, 31, 51, .87);--text-primary-60: rgba(24, 31, 51, .6);--text-primary-38: rgba(24, 31, 51, .38);--text-primary-12: rgba(24, 31, 51, .12);--bg-primary: #FFFFFF;--bg-secondary: #FAFAFA;--bg-tertiary: #F5F5F5;--bg-overlay: rgba(0, 0, 0, .32);--bg-overlay-light: rgba(0, 0, 0, .12);--bg-overlay-lighter: rgba(0, 0, 0, .08);--bg-overlay-lightest: rgba(0, 0, 0, .04);--border-primary: #E0E0E0;--border-secondary: #D6DCE2;--border-tertiary: #C8CDD3;--border-light: #F1F4F8;--border-primary-12: rgba(0, 0, 0, .12);--border-primary-08: rgba(0, 0, 0, .08);--border-primary-06: rgba(0, 0, 0, .06);--shadow-primary: rgba(0, 0, 0, .12);--shadow-secondary: rgba(0, 0, 0, .08);--shadow-tertiary: rgba(0, 0, 0, .04);--shadow-light: rgba(0, 0, 0, .06);--status-available: #929DAB;--status-unavailable: #CCD3DA;--status-hotseat: #857BFF;--status-multiteam: #10ADAE;--status-selected: #10ADAE;--status-upcoming: #D4900C;--status-room: #38AF49;--status-room-booked: #B23600;--status-room-unavailable: #181F33;--team-color-1: #F8C52E;--team-color-2: #FA8E20;--team-color-3: #987CDD;--team-color-4: #16CBBC;--team-color-5: #E65010;--team-color-6: #A60060;--team-color-7: #ED323B;--team-color-8: #35A1FF;--team-color-9: #80D348}.main-container{position:relative;display:flex;flex-wrap:wrap;justify-content:center;align-items:center;height:32px;width:256px;font-family:Lato,sans-serif!important}.main-container .dropdown{overflow:hidden;white-space:nowrap;text-overflow:ellipsis;height:inherit;border:1px solid var(--border-primary, #E0E0E0);border-radius:6px;background-color:var(--bg-primary, #FFFFFF);cursor:pointer;display:flex;gap:4px;align-items:center;width:100%;box-sizing:border-box;padding:0 12px}.main-container .dropdown:hover,.main-container .dropdown:focus-visible{background-color:var(--brand-primary-hover, #F0F3FA);outline:none}.main-container .dropdown .label{box-sizing:border-box;display:flex;justify-content:flex-start;align-items:center;font-style:normal;font-weight:400;font-size:14px;line-height:20px;letter-spacing:.2px;color:var(--text-primary, #181F33)}.main-container .dropdown .label .text{margin:0!important;text-overflow:ellipsis;overflow:hidden;white-space:nowrap;font-style:normal;font-weight:400;font-size:14px;line-height:20px;letter-spacing:.2px;color:var(--text-primary, #181F33)}.main-container .dropdown .label .count{background-color:var(--border-primary, #E0E0E0);border-radius:50%;padding:2px 7px;margin:0}.main-container .dropdown .handle{width:24px;height:24px;transition:.3s;position:absolute;right:12px;border-radius:50%;overflow:hidden}.main-container .dropdown-port{background:var(--brand-primary-active, #DAE1F3)}.popup-container{width:100%;max-height:340px;padding-bottom:0;border:1px solid var(--border-primary, #E0E0E0);border-radius:8px;background-color:var(--bg-primary, #FFFFFF);box-shadow:0 12px 24px #0000001f;display:flex;flex-direction:column;overflow:hidden;justify-content:space-between}.popup-container::-webkit-scrollbar{width:0;height:0}.popup-container .search-container{position:relative;box-sizing:border-box;padding:8px}.popup-container .search-container .search-icon{position:absolute;width:24px;height:24px;top:50%;transform:translateY(-50%);left:18px;z-index:1}.popup-container .search-container .search-input{height:40px;width:100%;padding:12px;border:1px solid var(--border-primary, #E0E0E0);box-sizing:border-box;border-radius:8px;outline:none;caret-color:var(--brand-primary, #0937B2);font-style:normal;font-weight:400;font-size:12px;line-height:18px;display:flex;align-items:center;letter-spacing:.2px;color:var(--text-primary, #181F33)}.popup-container .search-container .cancel-icon{position:absolute;cursor:pointer;width:24px;height:24px;top:50%;transform:translateY(-50%);right:18px;z-index:1}.popup-container .items{padding:0 0 8px 8px;overflow-y:auto}.popup-container .items::-webkit-scrollbar{width:5px;height:0}.popup-container .items::-webkit-scrollbar-thumb{background:var(--text-tertiary, #929DAB);border-radius:10px}.popup-container .items .noData{display:flex;justify-content:center;align-items:center;height:44px;font-style:normal;font-weight:400;font-size:14px;line-height:20px;letter-spacing:.2px;color:var(--text-primary, #181F33)}.popup-container .items .dropdown-viewport{height:100%}.popup-container .items .dropdown-viewport .item{cursor:pointer;display:flex;justify-content:flex-start;align-items:center;gap:10px;padding:4px 12px;border-radius:6px;min-height:40px;height:auto;letter-spacing:.2px;color:var(--text-primary, #181F33)}.popup-container .items .dropdown-viewport .item:hover,.popup-container .items .dropdown-viewport .item:focus-visible{background-color:var(--brand-primary-hover, #F0F3FA);outline:none}.popup-container .items .dropdown-viewport .item .label{width:100%;line-height:20px;font-size:14px;font-style:normal;font-weight:400}.popup-container .items .dropdown-viewport .item .label .primaryText{color:var(--text-primary, #181F33);font-family:Lato;font-size:14px;line-height:20px;letter-spacing:.2px;white-space:normal;word-wrap:break-word}.popup-container .items .dropdown-viewport .item .label .secondaryText{color:var(--text-secondary, #6A737D);font-family:Lato;font-size:14px;line-height:20px;letter-spacing:.2px;white-space:normal;word-wrap:break-word}.popup-container .items .dropdown-viewport .item .icon-container{width:10%;display:flex;justify-content:flex-end}.popup-container .items .dropdown-viewport .item .icon-container .icon{width:20px;height:20px}.popup-container .items .item-disabled{cursor:not-allowed!important}.popup-container .items .item-disabled:hover,.popup-container .items .item-disabled:focus-visible{background-color:transparent!important;outline:none!important}.popup-container .items .item-disabled .label>span{color:var(--text-tertiary, #929DAB)!important;-webkit-user-select:none!important;user-select:none!important}.popup-container .items .item-selected{background-color:var(--brand-primary-active, #DAE1F3);outline:none}.popup-container .items .icon-only{justify-content:center!important}::-webkit-scrollbar{height:8px;width:8px;background:var(--bg-primary, #FFFFFF);border-radius:13px}::-webkit-scrollbar-thumb{background:var(--text-disabled, #C8CDD3);border-radius:13px;cursor:pointer}.status-container{display:flex;justify-content:center;align-items:center;height:128px}.status-container p{text-align:center}\n"] }]
     }], () => [{ type: i0.ElementRef }, { type: i1.Overlay }, { type: i0.ViewContainerRef }, { type: i0.ChangeDetectorRef }], { selectElement: [{
             type: ViewChild,
             args: ["select", { static: false }]