@memberjunction/ng-dashboards 3.4.0 → 4.0.0

package/dist/Scheduling/components/job-slideout.component.js

@@ -1,12 +1,12 @@
 import { Component, Input, Output, EventEmitter, ChangeDetectionStrategy } from '@angular/core';
 import * as i0 from "@angular/core";
 import * as i1 from "../services/scheduling-instrumentation.service";
-import * as i2 from "@angular/common";
-import * as i3 from "@angular/forms";
-import * as i4 from "@memberjunction/ng-code-editor";
-function JobSlideoutComponent_div_9_Template(rf, ctx) { if (rf & 1) {
-    i0.ɵɵelementStart(0, "div", 34);
-    i0.ɵɵelement(1, "i", 35);
+import * as i2 from "@angular/forms";
+import * as i3 from "@memberjunction/ng-code-editor";
+import * as i4 from "@angular/common";
+function JobSlideoutComponent_Conditional_9_Template(rf, ctx) { if (rf & 1) {
+    i0.ɵɵelementStart(0, "div", 6);
+    i0.ɵɵelement(1, "i", 33);
     i0.ɵɵelementStart(2, "span");
     i0.ɵɵtext(3);
     i0.ɵɵelementEnd()();
@@ -15,8 +15,8 @@ function JobSlideoutComponent_div_9_Template(rf, ctx) { if (rf & 1) {
     i0.ɵɵadvance(3);
     i0.ɵɵtextInterpolate(ctx_r0.ErrorMessage);
 } }
-function JobSlideoutComponent_option_30_Template(rf, ctx) { if (rf & 1) {
-    i0.ɵɵelementStart(0, "option", 36);
+function JobSlideoutComponent_For_31_Template(rf, ctx) { if (rf & 1) {
+    i0.ɵɵelementStart(0, "option", 16);
     i0.ɵɵtext(1);
     i0.ɵɵelementEnd();
 } if (rf & 2) {
@@ -25,8 +25,8 @@ function JobSlideoutComponent_option_30_Template(rf, ctx) { if (rf & 1) {
     i0.ɵɵadvance();
     i0.ɵɵtextInterpolate(t_r2.name);
 } }
-function JobSlideoutComponent_option_35_Template(rf, ctx) { if (rf & 1) {
-    i0.ɵɵelementStart(0, "option", 36);
+function JobSlideoutComponent_For_37_Template(rf, ctx) { if (rf & 1) {
+    i0.ɵɵelementStart(0, "option", 16);
     i0.ɵɵtext(1);
     i0.ɵɵelementEnd();
 } if (rf & 2) {
@@ -35,8 +35,8 @@ function JobSlideoutComponent_option_35_Template(rf, ctx) { if (rf & 1) {
     i0.ɵɵadvance();
     i0.ɵɵtextInterpolate(s_r3);
 } }
-function JobSlideoutComponent_option_52_Template(rf, ctx) { if (rf & 1) {
-    i0.ɵɵelementStart(0, "option", 36);
+function JobSlideoutComponent_For_55_Template(rf, ctx) { if (rf & 1) {
+    i0.ɵɵelementStart(0, "option", 16);
     i0.ɵɵtext(1);
     i0.ɵɵelementEnd();
 } if (rf & 2) {
@@ -45,8 +45,8 @@ function JobSlideoutComponent_option_52_Template(rf, ctx) { if (rf & 1) {
     i0.ɵɵadvance();
     i0.ɵɵtextInterpolate(tz_r4);
 } }
-function JobSlideoutComponent_option_57_Template(rf, ctx) { if (rf & 1) {
-    i0.ɵɵelementStart(0, "option", 36);
+function JobSlideoutComponent_For_61_Template(rf, ctx) { if (rf & 1) {
+    i0.ɵɵelementStart(0, "option", 16);
     i0.ɵɵtext(1);
     i0.ɵɵelementEnd();
 } if (rf & 2) {
@@ -55,32 +55,32 @@ function JobSlideoutComponent_option_57_Template(rf, ctx) { if (rf & 1) {
     i0.ɵɵadvance();
     i0.ɵɵtextInterpolate(c_r5);
 } }
-function JobSlideoutComponent_div_80_Template(rf, ctx) { if (rf & 1) {
+function JobSlideoutComponent_Conditional_84_Template(rf, ctx) { if (rf & 1) {
     i0.ɵɵelementStart(0, "div", 7)(1, "div", 8);
     i0.ɵɵtext(2, "Statistics");
     i0.ɵɵelementEnd();
-    i0.ɵɵelementStart(3, "div", 37)(4, "div", 38)(5, "span", 39);
+    i0.ɵɵelementStart(3, "div", 34)(4, "div", 35)(5, "span", 36);
     i0.ɵɵtext(6, "Total Runs");
     i0.ɵɵelementEnd();
-    i0.ɵɵelementStart(7, "span", 40);
+    i0.ɵɵelementStart(7, "span", 37);
     i0.ɵɵtext(8);
     i0.ɵɵelementEnd()();
-    i0.ɵɵelementStart(9, "div", 38)(10, "span", 39);
+    i0.ɵɵelementStart(9, "div", 35)(10, "span", 36);
     i0.ɵɵtext(11, "Success");
     i0.ɵɵelementEnd();
-    i0.ɵɵelementStart(12, "span", 41);
+    i0.ɵɵelementStart(12, "span", 38);
     i0.ɵɵtext(13);
     i0.ɵɵelementEnd()();
-    i0.ɵɵelementStart(14, "div", 38)(15, "span", 39);
+    i0.ɵɵelementStart(14, "div", 35)(15, "span", 36);
     i0.ɵɵtext(16, "Failures");
     i0.ɵɵelementEnd();
-    i0.ɵɵelementStart(17, "span", 42);
+    i0.ɵɵelementStart(17, "span", 39);
     i0.ɵɵtext(18);
     i0.ɵɵelementEnd()();
-    i0.ɵɵelementStart(19, "div", 38)(20, "span", 39);
+    i0.ɵɵelementStart(19, "div", 35)(20, "span", 36);
     i0.ɵɵtext(21, "Created");
     i0.ɵɵelementEnd();
-    i0.ɵɵelementStart(22, "span", 40);
+    i0.ɵɵelementStart(22, "span", 37);
     i0.ɵɵtext(23);
     i0.ɵɵpipe(24, "date");
     i0.ɵɵelementEnd()()()();
@@ -95,30 +95,30 @@ function JobSlideoutComponent_div_80_Template(rf, ctx) { if (rf & 1) {
     i0.ɵɵadvance(5);
     i0.ɵɵtextInterpolate(i0.ɵɵpipeBind2(24, 4, ctx_r0.Job.createdAt, "short"));
 } }
-function JobSlideoutComponent_button_83_Template(rf, ctx) { if (rf & 1) {
+function JobSlideoutComponent_Conditional_87_Template(rf, ctx) { if (rf & 1) {
     const _r6 = i0.ɵɵgetCurrentView();
-    i0.ɵɵelementStart(0, "button", 43);
-    i0.ɵɵlistener("click", function JobSlideoutComponent_button_83_Template_button_click_0_listener() { i0.ɵɵrestoreView(_r6); const ctx_r0 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r0.ShowDeleteConfirm = true); });
-    i0.ɵɵelement(1, "i", 44);
+    i0.ɵɵelementStart(0, "button", 40);
+    i0.ɵɵlistener("click", function JobSlideoutComponent_Conditional_87_Template_button_click_0_listener() { i0.ɵɵrestoreView(_r6); const ctx_r0 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r0.ShowDeleteConfirm = true); });
+    i0.ɵɵelement(1, "i", 41);
     i0.ɵɵtext(2, " Delete ");
     i0.ɵɵelementEnd();
 } if (rf & 2) {
     const ctx_r0 = i0.ɵɵnextContext();
     i0.ɵɵproperty("disabled", ctx_r0.IsDeleting);
 } }
-function JobSlideoutComponent_i_88_Template(rf, ctx) { if (rf & 1) {
-    i0.ɵɵelement(0, "i", 45);
+function JobSlideoutComponent_Conditional_92_Template(rf, ctx) { if (rf & 1) {
+    i0.ɵɵelement(0, "i", 30);
 } }
-function JobSlideoutComponent_i_89_Template(rf, ctx) { if (rf & 1) {
-    i0.ɵɵelement(0, "i", 46);
+function JobSlideoutComponent_Conditional_93_Template(rf, ctx) { if (rf & 1) {
+    i0.ɵɵelement(0, "i", 31);
 } }
-function JobSlideoutComponent_div_91_i_10_Template(rf, ctx) { if (rf & 1) {
-    i0.ɵɵelement(0, "i", 45);
+function JobSlideoutComponent_Conditional_95_Conditional_10_Template(rf, ctx) { if (rf & 1) {
+    i0.ɵɵelement(0, "i", 30);
 } }
-function JobSlideoutComponent_div_91_Template(rf, ctx) { if (rf & 1) {
+function JobSlideoutComponent_Conditional_95_Template(rf, ctx) { if (rf & 1) {
     const _r7 = i0.ɵɵgetCurrentView();
-    i0.ɵɵelementStart(0, "div", 47)(1, "div", 48)(2, "div", 49);
-    i0.ɵɵelement(3, "i", 50);
+    i0.ɵɵelementStart(0, "div", 32)(1, "div", 42)(2, "div", 43);
+    i0.ɵɵelement(3, "i", 44);
     i0.ɵɵelementEnd();
     i0.ɵɵelementStart(4, "h3");
     i0.ɵɵtext(5, "Delete Job");
@@ -126,13 +126,13 @@ function JobSlideoutComponent_div_91_Template(rf, ctx) { if (rf & 1) {
     i0.ɵɵelementStart(6, "p");
     i0.ɵɵtext(7);
     i0.ɵɵelementEnd();
-    i0.ɵɵelementStart(8, "div", 51)(9, "button", 52);
-    i0.ɵɵlistener("click", function JobSlideoutComponent_div_91_Template_button_click_9_listener() { i0.ɵɵrestoreView(_r7); const ctx_r0 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r0.Delete()); });
-    i0.ɵɵtemplate(10, JobSlideoutComponent_div_91_i_10_Template, 1, 0, "i", 31);
+    i0.ɵɵelementStart(8, "div", 45)(9, "button", 46);
+    i0.ɵɵlistener("click", function JobSlideoutComponent_Conditional_95_Template_button_click_9_listener() { i0.ɵɵrestoreView(_r7); const ctx_r0 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r0.Delete()); });
+    i0.ɵɵconditionalCreate(10, JobSlideoutComponent_Conditional_95_Conditional_10_Template, 1, 0, "i", 30);
     i0.ɵɵtext(11, " Delete ");
     i0.ɵɵelementEnd();
-    i0.ɵɵelementStart(12, "button", 29);
-    i0.ɵɵlistener("click", function JobSlideoutComponent_div_91_Template_button_click_12_listener() { i0.ɵɵrestoreView(_r7); const ctx_r0 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r0.ShowDeleteConfirm = false); });
+    i0.ɵɵelementStart(12, "button", 28);
+    i0.ɵɵlistener("click", function JobSlideoutComponent_Conditional_95_Template_button_click_12_listener() { i0.ɵɵrestoreView(_r7); const ctx_r0 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r0.ShowDeleteConfirm = false); });
     i0.ɵɵtext(13, "Cancel");
     i0.ɵɵelementEnd()()()();
 } if (rf & 2) {
@@ -142,7 +142,7 @@ function JobSlideoutComponent_div_91_Template(rf, ctx) { if (rf & 1) {
     i0.ɵɵadvance(2);
     i0.ɵɵproperty("disabled", ctx_r0.IsDeleting);
     i0.ɵɵadvance();
-    i0.ɵɵproperty("ngIf", ctx_r0.IsDeleting);
+    i0.ɵɵconditional(ctx_r0.IsDeleting ? 10 : -1);
 } }
 export class JobSlideoutComponent {
     schedulingService;
@@ -275,7 +275,7 @@ export class JobSlideoutComponent {
         this.Close.emit();
     }
     static ɵfac = function JobSlideoutComponent_Factory(__ngFactoryType__) { return new (__ngFactoryType__ || JobSlideoutComponent)(i0.ɵɵdirectiveInject(i1.SchedulingInstrumentationService), i0.ɵɵdirectiveInject(i0.ChangeDetectorRef)); };
-    static ɵcmp = /*@__PURE__*/ i0.ɵɵdefineComponent({ type: JobSlideoutComponent, selectors: [["app-job-slideout"]], inputs: { Mode: "Mode", Job: "Job" }, outputs: { Close: "Close", Saved: "Saved" }, decls: 92, vars: 28, consts: [[1, "slideout-container"], [1, "slideout-header"], [1, "slideout-title"], [1, "close-btn", 3, "click"], [1, "fa-solid", "fa-xmark"], [1, "slideout-body"], ["class", "error-banner", 4, "ngIf"], [1, "form-section"], [1, "section-title"], [1, "form-group"], [1, "form-label"], [1, "required"], ["type", "text", "placeholder", "e.g., Daily Data Sync", 1, "form-input", 3, "ngModelChange", "ngModel"], ["rows", "3", "placeholder", "What does this job do?", 1, "form-textarea", 3, "ngModelChange", "ngModel"], [1, "form-row"], [1, "form-input", 3, "ngModelChange", "ngModel"], [3, "value", 4, "ngFor", "ngForOf"], ["type", "text", "placeholder", "0 */15 * * * *", 1, "form-input", "mono", 3, "ngModelChange", "ngModel"], [1, "form-hint"], [1, "code-editor-wrapper"], [3, "change", "value", "language", "lineWrapping", "placeholder"], [1, "form-row", "checkboxes"], [1, "checkbox-label"], ["type", "checkbox", 3, "ngModelChange", "ngModel"], ["class", "form-section", 4, "ngIf"], [1, "slideout-footer"], [1, "footer-left"], ["class", "delete-btn", 3, "disabled", "click", 4, "ngIf"], [1, "footer-right"], [1, "cancel-btn", 3, "click"], [1, "save-btn", 3, "click", "disabled"], ["class", "fa-solid fa-spinner fa-spin", 4, "ngIf"], ["class", "fa-solid fa-check", 4, "ngIf"], ["class", "confirm-overlay", 4, "ngIf"], [1, "error-banner"], [1, "fa-solid", "fa-circle-exclamation"], [3, "value"], [1, "stats-grid"], [1, "stat-item"], [1, "stat-label"], [1, "stat-value"], [1, "stat-value", "success"], [1, "stat-value", "failure"], [1, "delete-btn", 3, "click", "disabled"], [1, "fa-solid", "fa-trash-can"], [1, "fa-solid", "fa-spinner", "fa-spin"], [1, "fa-solid", "fa-check"], [1, "confirm-overlay"], [1, "confirm-dialog"], [1, "confirm-icon"], [1, "fa-solid", "fa-triangle-exclamation"], [1, "confirm-actions"], [1, "delete-confirm-btn", 3, "click", "disabled"]], template: function JobSlideoutComponent_Template(rf, ctx) { if (rf & 1) {
+    static ɵcmp = /*@__PURE__*/ i0.ɵɵdefineComponent({ type: JobSlideoutComponent, selectors: [["app-job-slideout"]], inputs: { Mode: "Mode", Job: "Job" }, outputs: { Close: "Close", Saved: "Saved" }, standalone: false, decls: 96, vars: 24, consts: [[1, "slideout-container"], [1, "slideout-header"], [1, "slideout-title"], [1, "close-btn", 3, "click"], [1, "fa-solid", "fa-xmark"], [1, "slideout-body"], [1, "error-banner"], [1, "form-section"], [1, "section-title"], [1, "form-group"], [1, "form-label"], [1, "required"], ["type", "text", "placeholder", "e.g., Daily Data Sync", 1, "form-input", 3, "ngModelChange", "ngModel"], ["rows", "3", "placeholder", "What does this job do?", 1, "form-textarea", 3, "ngModelChange", "ngModel"], [1, "form-row"], [1, "form-input", 3, "ngModelChange", "ngModel"], [3, "value"], ["type", "text", "placeholder", "0 */15 * * * *", 1, "form-input", "mono", 3, "ngModelChange", "ngModel"], [1, "form-hint"], [1, "code-editor-wrapper"], [3, "change", "value", "language", "lineWrapping", "placeholder"], [1, "form-row", "checkboxes"], [1, "checkbox-label"], ["type", "checkbox", 3, "ngModelChange", "ngModel"], [1, "slideout-footer"], [1, "footer-left"], [1, "delete-btn", 3, "disabled"], [1, "footer-right"], [1, "cancel-btn", 3, "click"], [1, "save-btn", 3, "click", "disabled"], [1, "fa-solid", "fa-spinner", "fa-spin"], [1, "fa-solid", "fa-check"], [1, "confirm-overlay"], [1, "fa-solid", "fa-circle-exclamation"], [1, "stats-grid"], [1, "stat-item"], [1, "stat-label"], [1, "stat-value"], [1, "stat-value", "success"], [1, "stat-value", "failure"], [1, "delete-btn", 3, "click", "disabled"], [1, "fa-solid", "fa-trash-can"], [1, "confirm-dialog"], [1, "confirm-icon"], [1, "fa-solid", "fa-triangle-exclamation"], [1, "confirm-actions"], [1, "delete-confirm-btn", 3, "click", "disabled"]], template: function JobSlideoutComponent_Template(rf, ctx) { if (rf & 1) {
             i0.ɵɵelementStart(0, "div", 0)(1, "div", 1)(2, "div", 2);
             i0.ɵɵelement(3, "i");
             i0.ɵɵelementStart(4, "span");
@@ -286,7 +286,7 @@ export class JobSlideoutComponent {
             i0.ɵɵelement(7, "i", 4);
             i0.ɵɵelementEnd()();
             i0.ɵɵelementStart(8, "div", 5);
-            i0.ɵɵtemplate(9, JobSlideoutComponent_div_9_Template, 4, 1, "div", 6);
+            i0.ɵɵconditionalCreate(9, JobSlideoutComponent_Conditional_9_Template, 4, 1, "div", 6);
             i0.ɵɵelementStart(10, "div", 7)(11, "div", 8);
             i0.ɵɵtext(12, "General");
             i0.ɵɵelementEnd();
@@ -311,85 +311,86 @@ export class JobSlideoutComponent {
             i0.ɵɵelementEnd()();
             i0.ɵɵelementStart(29, "select", 15);
             i0.ɵɵtwoWayListener("ngModelChange", function JobSlideoutComponent_Template_select_ngModelChange_29_listener($event) { i0.ɵɵtwoWayBindingSet(ctx.JobTypeID, $event) || (ctx.JobTypeID = $event); return $event; });
-            i0.ɵɵtemplate(30, JobSlideoutComponent_option_30_Template, 2, 2, "option", 16);
+            i0.ɵɵrepeaterCreate(30, JobSlideoutComponent_For_31_Template, 2, 2, "option", 16, i0.ɵɵrepeaterTrackByIdentity);
             i0.ɵɵelementEnd()();
-            i0.ɵɵelementStart(31, "div", 9)(32, "label", 10);
-            i0.ɵɵtext(33, "Status");
+            i0.ɵɵelementStart(32, "div", 9)(33, "label", 10);
+            i0.ɵɵtext(34, "Status");
             i0.ɵɵelementEnd();
-            i0.ɵɵelementStart(34, "select", 15);
-            i0.ɵɵtwoWayListener("ngModelChange", function JobSlideoutComponent_Template_select_ngModelChange_34_listener($event) { i0.ɵɵtwoWayBindingSet(ctx.Status, $event) || (ctx.Status = $event); return $event; });
-            i0.ɵɵtemplate(35, JobSlideoutComponent_option_35_Template, 2, 2, "option", 16);
+            i0.ɵɵelementStart(35, "select", 15);
+            i0.ɵɵtwoWayListener("ngModelChange", function JobSlideoutComponent_Template_select_ngModelChange_35_listener($event) { i0.ɵɵtwoWayBindingSet(ctx.Status, $event) || (ctx.Status = $event); return $event; });
+            i0.ɵɵrepeaterCreate(36, JobSlideoutComponent_For_37_Template, 2, 2, "option", 16, i0.ɵɵrepeaterTrackByIdentity);
             i0.ɵɵelementEnd()()()();
-            i0.ɵɵelementStart(36, "div", 7)(37, "div", 8);
-            i0.ɵɵtext(38, "Schedule");
+            i0.ɵɵelementStart(38, "div", 7)(39, "div", 8);
+            i0.ɵɵtext(40, "Schedule");
             i0.ɵɵelementEnd();
-            i0.ɵɵelementStart(39, "div", 9)(40, "label", 10);
-            i0.ɵɵtext(41, "Cron Expression ");
-            i0.ɵɵelementStart(42, "span", 11);
-            i0.ɵɵtext(43, "*");
+            i0.ɵɵelementStart(41, "div", 9)(42, "label", 10);
+            i0.ɵɵtext(43, "Cron Expression ");
+            i0.ɵɵelementStart(44, "span", 11);
+            i0.ɵɵtext(45, "*");
             i0.ɵɵelementEnd()();
-            i0.ɵɵelementStart(44, "input", 17);
-            i0.ɵɵtwoWayListener("ngModelChange", function JobSlideoutComponent_Template_input_ngModelChange_44_listener($event) { i0.ɵɵtwoWayBindingSet(ctx.CronExpression, $event) || (ctx.CronExpression = $event); return $event; });
+            i0.ɵɵelementStart(46, "input", 17);
+            i0.ɵɵtwoWayListener("ngModelChange", function JobSlideoutComponent_Template_input_ngModelChange_46_listener($event) { i0.ɵɵtwoWayBindingSet(ctx.CronExpression, $event) || (ctx.CronExpression = $event); return $event; });
             i0.ɵɵelementEnd();
-            i0.ɵɵelementStart(45, "div", 18);
-            i0.ɵɵtext(46, "e.g., 0 */15 * * * * (every 15 minutes)");
+            i0.ɵɵelementStart(47, "div", 18);
+            i0.ɵɵtext(48, "e.g., 0 */15 * * * * (every 15 minutes)");
             i0.ɵɵelementEnd()();
-            i0.ɵɵelementStart(47, "div", 14)(48, "div", 9)(49, "label", 10);
-            i0.ɵɵtext(50, "Timezone");
+            i0.ɵɵelementStart(49, "div", 14)(50, "div", 9)(51, "label", 10);
+            i0.ɵɵtext(52, "Timezone");
             i0.ɵɵelementEnd();
-            i0.ɵɵelementStart(51, "select", 15);
-            i0.ɵɵtwoWayListener("ngModelChange", function JobSlideoutComponent_Template_select_ngModelChange_51_listener($event) { i0.ɵɵtwoWayBindingSet(ctx.Timezone, $event) || (ctx.Timezone = $event); return $event; });
-            i0.ɵɵtemplate(52, JobSlideoutComponent_option_52_Template, 2, 2, "option", 16);
+            i0.ɵɵelementStart(53, "select", 15);
+            i0.ɵɵtwoWayListener("ngModelChange", function JobSlideoutComponent_Template_select_ngModelChange_53_listener($event) { i0.ɵɵtwoWayBindingSet(ctx.Timezone, $event) || (ctx.Timezone = $event); return $event; });
+            i0.ɵɵrepeaterCreate(54, JobSlideoutComponent_For_55_Template, 2, 2, "option", 16, i0.ɵɵrepeaterTrackByIdentity);
             i0.ɵɵelementEnd()();
-            i0.ɵɵelementStart(53, "div", 9)(54, "label", 10);
-            i0.ɵɵtext(55, "Concurrency");
+            i0.ɵɵelementStart(56, "div", 9)(57, "label", 10);
+            i0.ɵɵtext(58, "Concurrency");
             i0.ɵɵelementEnd();
-            i0.ɵɵelementStart(56, "select", 15);
-            i0.ɵɵtwoWayListener("ngModelChange", function JobSlideoutComponent_Template_select_ngModelChange_56_listener($event) { i0.ɵɵtwoWayBindingSet(ctx.ConcurrencyMode, $event) || (ctx.ConcurrencyMode = $event); return $event; });
-            i0.ɵɵtemplate(57, JobSlideoutComponent_option_57_Template, 2, 2, "option", 16);
+            i0.ɵɵelementStart(59, "select", 15);
+            i0.ɵɵtwoWayListener("ngModelChange", function JobSlideoutComponent_Template_select_ngModelChange_59_listener($event) { i0.ɵɵtwoWayBindingSet(ctx.ConcurrencyMode, $event) || (ctx.ConcurrencyMode = $event); return $event; });
+            i0.ɵɵrepeaterCreate(60, JobSlideoutComponent_For_61_Template, 2, 2, "option", 16, i0.ɵɵrepeaterTrackByIdentity);
             i0.ɵɵelementEnd()()()();
-            i0.ɵɵelementStart(58, "div", 7)(59, "div", 8);
-            i0.ɵɵtext(60, "Configuration");
+            i0.ɵɵelementStart(62, "div", 7)(63, "div", 8);
+            i0.ɵɵtext(64, "Configuration");
             i0.ɵɵelementEnd();
-            i0.ɵɵelementStart(61, "div", 9)(62, "label", 10);
-            i0.ɵɵtext(63, "Configuration JSON");
+            i0.ɵɵelementStart(65, "div", 9)(66, "label", 10);
+            i0.ɵɵtext(67, "Configuration JSON");
             i0.ɵɵelementEnd();
-            i0.ɵɵelementStart(64, "div", 19)(65, "mj-code-editor", 20);
-            i0.ɵɵlistener("change", function JobSlideoutComponent_Template_mj_code_editor_change_65_listener($event) { return ctx.OnConfigurationChange($event); });
+            i0.ɵɵelementStart(68, "div", 19)(69, "mj-code-editor", 20);
+            i0.ɵɵlistener("change", function JobSlideoutComponent_Template_mj_code_editor_change_69_listener($event) { return ctx.OnConfigurationChange($event); });
             i0.ɵɵelementEnd()();
-            i0.ɵɵelementStart(66, "div", 18);
-            i0.ɵɵtext(67, "Optional JSON configuration for the job type plugin");
+            i0.ɵɵelementStart(70, "div", 18);
+            i0.ɵɵtext(71, "Optional JSON configuration for the job type plugin");
             i0.ɵɵelementEnd()()();
-            i0.ɵɵelementStart(68, "div", 7)(69, "div", 8);
-            i0.ɵɵtext(70, "Notifications");
+            i0.ɵɵelementStart(72, "div", 7)(73, "div", 8);
+            i0.ɵɵtext(74, "Notifications");
             i0.ɵɵelementEnd();
-            i0.ɵɵelementStart(71, "div", 21)(72, "label", 22)(73, "input", 23);
-            i0.ɵɵtwoWayListener("ngModelChange", function JobSlideoutComponent_Template_input_ngModelChange_73_listener($event) { i0.ɵɵtwoWayBindingSet(ctx.NotifyOnSuccess, $event) || (ctx.NotifyOnSuccess = $event); return $event; });
+            i0.ɵɵelementStart(75, "div", 21)(76, "label", 22)(77, "input", 23);
+            i0.ɵɵtwoWayListener("ngModelChange", function JobSlideoutComponent_Template_input_ngModelChange_77_listener($event) { i0.ɵɵtwoWayBindingSet(ctx.NotifyOnSuccess, $event) || (ctx.NotifyOnSuccess = $event); return $event; });
             i0.ɵɵelementEnd();
-            i0.ɵɵelementStart(74, "span");
-            i0.ɵɵtext(75, "Notify on success");
+            i0.ɵɵelementStart(78, "span");
+            i0.ɵɵtext(79, "Notify on success");
             i0.ɵɵelementEnd()();
-            i0.ɵɵelementStart(76, "label", 22)(77, "input", 23);
-            i0.ɵɵtwoWayListener("ngModelChange", function JobSlideoutComponent_Template_input_ngModelChange_77_listener($event) { i0.ɵɵtwoWayBindingSet(ctx.NotifyOnFailure, $event) || (ctx.NotifyOnFailure = $event); return $event; });
+            i0.ɵɵelementStart(80, "label", 22)(81, "input", 23);
+            i0.ɵɵtwoWayListener("ngModelChange", function JobSlideoutComponent_Template_input_ngModelChange_81_listener($event) { i0.ɵɵtwoWayBindingSet(ctx.NotifyOnFailure, $event) || (ctx.NotifyOnFailure = $event); return $event; });
             i0.ɵɵelementEnd();
-            i0.ɵɵelementStart(78, "span");
-            i0.ɵɵtext(79, "Notify on failure");
+            i0.ɵɵelementStart(82, "span");
+            i0.ɵɵtext(83, "Notify on failure");
             i0.ɵɵelementEnd()()()();
-            i0.ɵɵtemplate(80, JobSlideoutComponent_div_80_Template, 25, 7, "div", 24);
+            i0.ɵɵconditionalCreate(84, JobSlideoutComponent_Conditional_84_Template, 25, 7, "div", 7);
             i0.ɵɵelementEnd();
-            i0.ɵɵelementStart(81, "div", 25)(82, "div", 26);
-            i0.ɵɵtemplate(83, JobSlideoutComponent_button_83_Template, 3, 1, "button", 27);
+            i0.ɵɵelementStart(85, "div", 24)(86, "div", 25);
+            i0.ɵɵconditionalCreate(87, JobSlideoutComponent_Conditional_87_Template, 3, 1, "button", 26);
             i0.ɵɵelementEnd();
-            i0.ɵɵelementStart(84, "div", 28)(85, "button", 29);
-            i0.ɵɵlistener("click", function JobSlideoutComponent_Template_button_click_85_listener() { return ctx.OnClose(); });
-            i0.ɵɵtext(86, "Cancel");
+            i0.ɵɵelementStart(88, "div", 27)(89, "button", 28);
+            i0.ɵɵlistener("click", function JobSlideoutComponent_Template_button_click_89_listener() { return ctx.OnClose(); });
+            i0.ɵɵtext(90, "Cancel");
             i0.ɵɵelementEnd();
-            i0.ɵɵelementStart(87, "button", 30);
-            i0.ɵɵlistener("click", function JobSlideoutComponent_Template_button_click_87_listener() { return ctx.Save(); });
-            i0.ɵɵtemplate(88, JobSlideoutComponent_i_88_Template, 1, 0, "i", 31)(89, JobSlideoutComponent_i_89_Template, 1, 0, "i", 32);
-            i0.ɵɵtext(90);
+            i0.ɵɵelementStart(91, "button", 29);
+            i0.ɵɵlistener("click", function JobSlideoutComponent_Template_button_click_91_listener() { return ctx.Save(); });
+            i0.ɵɵconditionalCreate(92, JobSlideoutComponent_Conditional_92_Template, 1, 0, "i", 30);
+            i0.ɵɵconditionalCreate(93, JobSlideoutComponent_Conditional_93_Template, 1, 0, "i", 31);
+            i0.ɵɵtext(94);
             i0.ɵɵelementEnd()()();
-            i0.ɵɵtemplate(91, JobSlideoutComponent_div_91_Template, 14, 3, "div", 33);
+            i0.ɵɵconditionalCreate(95, JobSlideoutComponent_Conditional_95_Template, 14, 3, "div", 32);
             i0.ɵɵelementEnd();
         } if (rf & 2) {
             i0.ɵɵadvance(3);
@@ -397,7 +398,7 @@ export class JobSlideoutComponent {
             i0.ɵɵadvance(2);
             i0.ɵɵtextInterpolate(ctx.Title);
             i0.ɵɵadvance(4);
-            i0.ɵɵproperty("ngIf", ctx.ErrorMessage);
+            i0.ɵɵconditional(ctx.ErrorMessage ? 9 : -1);
             i0.ɵɵadvance(9);
             i0.ɵɵtwoWayProperty("ngModel", ctx.Name);
             i0.ɵɵadvance(4);
@@ -405,46 +406,46 @@ export class JobSlideoutComponent {
             i0.ɵɵadvance(7);
             i0.ɵɵtwoWayProperty("ngModel", ctx.JobTypeID);
             i0.ɵɵadvance();
-            i0.ɵɵproperty("ngForOf", ctx.JobTypes);
-            i0.ɵɵadvance(4);
+            i0.ɵɵrepeater(ctx.JobTypes);
+            i0.ɵɵadvance(5);
             i0.ɵɵtwoWayProperty("ngModel", ctx.Status);
             i0.ɵɵadvance();
-            i0.ɵɵproperty("ngForOf", ctx.StatusOptions);
-            i0.ɵɵadvance(9);
+            i0.ɵɵrepeater(ctx.StatusOptions);
+            i0.ɵɵadvance(10);
             i0.ɵɵtwoWayProperty("ngModel", ctx.CronExpression);
             i0.ɵɵadvance(7);
             i0.ɵɵtwoWayProperty("ngModel", ctx.Timezone);
             i0.ɵɵadvance();
-            i0.ɵɵproperty("ngForOf", ctx.TimezoneOptions);
-            i0.ɵɵadvance(4);
+            i0.ɵɵrepeater(ctx.TimezoneOptions);
+            i0.ɵɵadvance(5);
             i0.ɵɵtwoWayProperty("ngModel", ctx.ConcurrencyMode);
             i0.ɵɵadvance();
-            i0.ɵɵproperty("ngForOf", ctx.ConcurrencyOptions);
-            i0.ɵɵadvance(8);
+            i0.ɵɵrepeater(ctx.ConcurrencyOptions);
+            i0.ɵɵadvance(9);
             i0.ɵɵproperty("value", ctx.Configuration)("language", "json")("lineWrapping", true)("placeholder", "{ }");
             i0.ɵɵadvance(8);
             i0.ɵɵtwoWayProperty("ngModel", ctx.NotifyOnSuccess);
             i0.ɵɵadvance(4);
             i0.ɵɵtwoWayProperty("ngModel", ctx.NotifyOnFailure);
             i0.ɵɵadvance(3);
-            i0.ɵɵproperty("ngIf", ctx.Mode === "edit" && ctx.Job);
+            i0.ɵɵconditional(ctx.Mode === "edit" && ctx.Job ? 84 : -1);
             i0.ɵɵadvance(3);
-            i0.ɵɵproperty("ngIf", ctx.Mode === "edit");
+            i0.ɵɵconditional(ctx.Mode === "edit" ? 87 : -1);
             i0.ɵɵadvance(4);
             i0.ɵɵproperty("disabled", !ctx.IsValid || ctx.IsSaving);
             i0.ɵɵadvance();
-            i0.ɵɵproperty("ngIf", ctx.IsSaving);
+            i0.ɵɵconditional(ctx.IsSaving ? 92 : -1);
             i0.ɵɵadvance();
-            i0.ɵɵproperty("ngIf", !ctx.IsSaving);
+            i0.ɵɵconditional(!ctx.IsSaving ? 93 : -1);
             i0.ɵɵadvance();
             i0.ɵɵtextInterpolate1(" ", ctx.Mode === "create" ? "Create Job" : "Save Changes", " ");
             i0.ɵɵadvance();
-            i0.ɵɵproperty("ngIf", ctx.ShowDeleteConfirm);
-        } }, dependencies: [i2.NgForOf, i2.NgIf, i3.NgSelectOption, i3.ɵNgSelectMultipleOption, i3.DefaultValueAccessor, i3.CheckboxControlValueAccessor, i3.SelectControlValueAccessor, i3.NgControlStatus, i3.NgModel, i4.CodeEditorComponent, i2.DatePipe], styles: [".slideout-container[_ngcontent-%COMP%] {\n    display: flex;\n    flex-direction: column;\n    height: 100%;\n}\n\n\n\n.slideout-header[_ngcontent-%COMP%] {\n    display: flex;\n    justify-content: space-between;\n    align-items: center;\n    padding: 20px 24px;\n    border-bottom: 1px solid #e2e8f0;\n    background: white;\n    flex-shrink: 0;\n}\n\n.slideout-title[_ngcontent-%COMP%] {\n    display: flex;\n    align-items: center;\n    gap: 10px;\n    font-size: 1.1rem;\n    font-weight: 700;\n    color: #0f172a;\n}\n\n.slideout-title[_ngcontent-%COMP%]   i[_ngcontent-%COMP%] {\n    color: #0076b6;\n}\n\n.close-btn[_ngcontent-%COMP%] {\n    width: 36px;\n    height: 36px;\n    display: flex;\n    align-items: center;\n    justify-content: center;\n    background: transparent;\n    border: 1px solid #e5e7eb;\n    border-radius: 8px;\n    cursor: pointer;\n    color: #64748b;\n    transition: all 0.2s;\n}\n\n.close-btn[_ngcontent-%COMP%]:hover {\n    background: #f1f5f9;\n    color: #0f172a;\n}\n\n\n\n.slideout-body[_ngcontent-%COMP%] {\n    flex: 1;\n    overflow-y: auto;\n    padding: 24px;\n}\n\n.error-banner[_ngcontent-%COMP%] {\n    display: flex;\n    align-items: center;\n    gap: 8px;\n    padding: 12px 16px;\n    background: #fef2f2;\n    border: 1px solid #fecaca;\n    border-radius: 10px;\n    color: #dc2626;\n    font-size: 0.85rem;\n    font-weight: 500;\n    margin-bottom: 20px;\n}\n\n\n\n.form-section[_ngcontent-%COMP%] {\n    margin-bottom: 28px;\n}\n\n.section-title[_ngcontent-%COMP%] {\n    font-size: 0.7rem;\n    font-weight: 700;\n    color: #94a3b8;\n    text-transform: uppercase;\n    letter-spacing: 0.05em;\n    margin-bottom: 16px;\n    padding-bottom: 8px;\n    border-bottom: 1px solid #f1f5f9;\n}\n\n.form-group[_ngcontent-%COMP%] {\n    margin-bottom: 16px;\n}\n\n.form-label[_ngcontent-%COMP%] {\n    display: block;\n    font-size: 0.8rem;\n    font-weight: 600;\n    color: #334155;\n    margin-bottom: 6px;\n}\n\n.required[_ngcontent-%COMP%] {\n    color: #ef4444;\n}\n\n.form-input[_ngcontent-%COMP%] {\n    width: 100%;\n    padding: 10px 14px;\n    border: 1px solid #e2e8f0;\n    border-radius: 10px;\n    font-size: 0.85rem;\n    color: #0f172a;\n    background: white;\n    outline: none;\n    transition: border-color 0.2s;\n    box-sizing: border-box;\n}\n\n.form-input[_ngcontent-%COMP%]:focus {\n    border-color: #0076b6;\n    box-shadow: 0 0 0 3px rgba(0, 118, 182, 0.1);\n}\n\n.form-textarea[_ngcontent-%COMP%] {\n    width: 100%;\n    padding: 10px 14px;\n    border: 1px solid #e2e8f0;\n    border-radius: 10px;\n    font-size: 0.85rem;\n    color: #0f172a;\n    background: white;\n    outline: none;\n    transition: border-color 0.2s;\n    resize: vertical;\n    font-family: inherit;\n    box-sizing: border-box;\n}\n\n.form-textarea[_ngcontent-%COMP%]:focus {\n    border-color: #0076b6;\n    box-shadow: 0 0 0 3px rgba(0, 118, 182, 0.1);\n}\n\n.form-textarea.mono[_ngcontent-%COMP%], \n.form-input.mono[_ngcontent-%COMP%] {\n    font-family: 'SFMono-Regular', Consolas, 'Liberation Mono', Menlo, monospace;\n    font-size: 0.8rem;\n}\n\n.form-hint[_ngcontent-%COMP%] {\n    font-size: 0.7rem;\n    color: #94a3b8;\n    margin-top: 4px;\n}\n\n.form-row[_ngcontent-%COMP%] {\n    display: grid;\n    grid-template-columns: 1fr 1fr;\n    gap: 12px;\n}\n\n.form-row.checkboxes[_ngcontent-%COMP%] {\n    display: flex;\n    gap: 24px;\n}\n\n.checkbox-label[_ngcontent-%COMP%] {\n    display: flex;\n    align-items: center;\n    gap: 8px;\n    font-size: 0.85rem;\n    color: #334155;\n    cursor: pointer;\n}\n\n.checkbox-label[_ngcontent-%COMP%]   input[type=\"checkbox\"][_ngcontent-%COMP%] {\n    width: 16px;\n    height: 16px;\n    accent-color: #0076b6;\n}\n\n\n\n.stats-grid[_ngcontent-%COMP%] {\n    display: grid;\n    grid-template-columns: repeat(2, 1fr);\n    gap: 12px;\n}\n\n.stat-item[_ngcontent-%COMP%] {\n    padding: 12px 16px;\n    background: #f8fafc;\n    border-radius: 10px;\n    border: 1px solid #f1f5f9;\n}\n\n.stat-label[_ngcontent-%COMP%] {\n    font-size: 0.7rem;\n    font-weight: 700;\n    color: #94a3b8;\n    text-transform: uppercase;\n    letter-spacing: 0.05em;\n    display: block;\n    margin-bottom: 4px;\n}\n\n.stat-value[_ngcontent-%COMP%] {\n    font-size: 1.1rem;\n    font-weight: 800;\n    color: #0f172a;\n}\n\n.stat-value.success[_ngcontent-%COMP%] { color: #10b981; }\n.stat-value.failure[_ngcontent-%COMP%] { color: #ef4444; }\n\n\n\n.slideout-footer[_ngcontent-%COMP%] {\n    display: flex;\n    justify-content: space-between;\n    align-items: center;\n    padding: 16px 24px;\n    border-top: 1px solid #e2e8f0;\n    background: #f1f5f9;\n    flex-shrink: 0;\n    box-shadow: 0 -2px 8px rgba(0, 0, 0, 0.06);\n    position: relative;\n    z-index: 1;\n}\n\n.footer-left[_ngcontent-%COMP%], .footer-right[_ngcontent-%COMP%] {\n    display: flex;\n    gap: 8px;\n}\n\n.save-btn[_ngcontent-%COMP%] {\n    display: inline-flex;\n    align-items: center;\n    gap: 6px;\n    padding: 10px 24px;\n    background: linear-gradient(135deg, #0076b6 0%, #005a8c 100%);\n    color: white;\n    border: none;\n    border-radius: 10px;\n    cursor: pointer;\n    font-size: 0.85rem;\n    font-weight: 600;\n    transition: all 0.2s ease;\n}\n\n.save-btn[_ngcontent-%COMP%]:hover:not(:disabled) {\n    transform: translateY(-1px);\n    box-shadow: 0 4px 12px rgba(0, 118, 182, 0.4);\n}\n\n.save-btn[_ngcontent-%COMP%]:disabled {\n    opacity: 0.5;\n    cursor: not-allowed;\n}\n\n.cancel-btn[_ngcontent-%COMP%] {\n    padding: 10px 20px;\n    background: white;\n    border: 1px solid #e5e7eb;\n    border-radius: 10px;\n    cursor: pointer;\n    font-size: 0.85rem;\n    font-weight: 500;\n    color: #475569;\n    transition: all 0.2s;\n}\n\n.cancel-btn[_ngcontent-%COMP%]:hover {\n    background: #f3f4f6;\n}\n\n.delete-btn[_ngcontent-%COMP%] {\n    display: inline-flex;\n    align-items: center;\n    gap: 6px;\n    padding: 10px 16px;\n    background: transparent;\n    color: #ef4444;\n    border: 1px solid #fecaca;\n    border-radius: 10px;\n    cursor: pointer;\n    font-size: 0.85rem;\n    font-weight: 500;\n    transition: all 0.2s;\n}\n\n.delete-btn[_ngcontent-%COMP%]:hover:not(:disabled) {\n    background: #fef2f2;\n}\n\n.delete-btn[_ngcontent-%COMP%]:disabled {\n    opacity: 0.5;\n    cursor: not-allowed;\n}\n\n\n\n.confirm-overlay[_ngcontent-%COMP%] {\n    position: absolute;\n    top: 0;\n    left: 0;\n    right: 0;\n    bottom: 0;\n    background: rgba(0,0,0,0.4);\n    display: flex;\n    align-items: center;\n    justify-content: center;\n    z-index: 10;\n}\n\n.confirm-dialog[_ngcontent-%COMP%] {\n    background: white;\n    border-radius: 16px;\n    padding: 32px;\n    max-width: 360px;\n    text-align: center;\n    box-shadow: 0 20px 40px rgba(0,0,0,0.2);\n}\n\n.confirm-icon[_ngcontent-%COMP%] {\n    width: 56px;\n    height: 56px;\n    border-radius: 50%;\n    background: #fef2f2;\n    display: flex;\n    align-items: center;\n    justify-content: center;\n    margin: 0 auto 16px;\n}\n\n.confirm-icon[_ngcontent-%COMP%]   i[_ngcontent-%COMP%] {\n    font-size: 1.5rem;\n    color: #ef4444;\n}\n\n.confirm-dialog[_ngcontent-%COMP%]   h3[_ngcontent-%COMP%] {\n    font-size: 1.1rem;\n    font-weight: 700;\n    color: #0f172a;\n    margin: 0 0 8px;\n}\n\n.confirm-dialog[_ngcontent-%COMP%]   p[_ngcontent-%COMP%] {\n    font-size: 0.85rem;\n    color: #64748b;\n    margin: 0 0 24px;\n    line-height: 1.4;\n}\n\n.confirm-actions[_ngcontent-%COMP%] {\n    display: flex;\n    gap: 8px;\n    justify-content: center;\n}\n\n.delete-confirm-btn[_ngcontent-%COMP%] {\n    display: inline-flex;\n    align-items: center;\n    gap: 6px;\n    padding: 10px 24px;\n    background: #ef4444;\n    color: white;\n    border: none;\n    border-radius: 10px;\n    cursor: pointer;\n    font-size: 0.85rem;\n    font-weight: 600;\n    transition: all 0.2s;\n}\n\n.delete-confirm-btn[_ngcontent-%COMP%]:hover:not(:disabled) {\n    background: #dc2626;\n}\n\n.delete-confirm-btn[_ngcontent-%COMP%]:disabled {\n    opacity: 0.5;\n    cursor: not-allowed;\n}\n\n\n\n.code-editor-wrapper[_ngcontent-%COMP%] {\n    border: 1px solid #e2e8f0;\n    border-radius: 10px;\n    overflow: hidden;\n    transition: border-color 0.2s;\n}\n\n.code-editor-wrapper[_ngcontent-%COMP%]:focus-within {\n    border-color: #0076b6;\n    box-shadow: 0 0 0 3px rgba(0, 118, 182, 0.1);\n}\n\n.code-editor-wrapper[_ngcontent-%COMP%]   mj-code-editor[_ngcontent-%COMP%] {\n    display: block;\n    height: 180px;\n}\n\n\n\n@media (max-width: 768px) {\n    .slideout-body[_ngcontent-%COMP%] {\n        padding: 16px;\n    }\n\n    .form-row[_ngcontent-%COMP%] {\n        grid-template-columns: 1fr;\n    }\n\n    .form-row.checkboxes[_ngcontent-%COMP%] {\n        flex-direction: column;\n        gap: 12px;\n    }\n\n    .code-editor-wrapper[_ngcontent-%COMP%]   mj-code-editor[_ngcontent-%COMP%] {\n        height: 140px;\n    }\n}\n\n@media (max-width: 480px) {\n    .slideout-header[_ngcontent-%COMP%] {\n        padding: 16px;\n    }\n\n    .slideout-footer[_ngcontent-%COMP%] {\n        padding: 12px 16px;\n        flex-direction: column;\n        gap: 10px;\n    }\n\n    .footer-left[_ngcontent-%COMP%], .footer-right[_ngcontent-%COMP%] {\n        width: 100%;\n    }\n\n    .footer-right[_ngcontent-%COMP%] {\n        justify-content: stretch;\n    }\n\n    .save-btn[_ngcontent-%COMP%], .cancel-btn[_ngcontent-%COMP%], .delete-btn[_ngcontent-%COMP%] {\n        flex: 1;\n        justify-content: center;\n    }\n\n    .stats-grid[_ngcontent-%COMP%] {\n        grid-template-columns: 1fr;\n    }\n}"], changeDetection: 0 });
+            i0.ɵɵconditional(ctx.ShowDeleteConfirm ? 95 : -1);
+        } }, dependencies: [i2.NgSelectOption, i2.ɵNgSelectMultipleOption, i2.DefaultValueAccessor, i2.CheckboxControlValueAccessor, i2.SelectControlValueAccessor, i2.NgControlStatus, i2.NgModel, i3.CodeEditorComponent, i4.DatePipe], styles: [".slideout-container[_ngcontent-%COMP%] {\n    display: flex;\n    flex-direction: column;\n    height: 100%;\n}\n\n\n\n.slideout-header[_ngcontent-%COMP%] {\n    display: flex;\n    justify-content: space-between;\n    align-items: center;\n    padding: 20px 24px;\n    border-bottom: 1px solid #e2e8f0;\n    background: white;\n    flex-shrink: 0;\n}\n\n.slideout-title[_ngcontent-%COMP%] {\n    display: flex;\n    align-items: center;\n    gap: 10px;\n    font-size: 1.1rem;\n    font-weight: 700;\n    color: #0f172a;\n}\n\n.slideout-title[_ngcontent-%COMP%]   i[_ngcontent-%COMP%] {\n    color: #0076b6;\n}\n\n.close-btn[_ngcontent-%COMP%] {\n    width: 36px;\n    height: 36px;\n    display: flex;\n    align-items: center;\n    justify-content: center;\n    background: transparent;\n    border: 1px solid #e5e7eb;\n    border-radius: 8px;\n    cursor: pointer;\n    color: #64748b;\n    transition: all 0.2s;\n}\n\n.close-btn[_ngcontent-%COMP%]:hover {\n    background: #f1f5f9;\n    color: #0f172a;\n}\n\n\n\n.slideout-body[_ngcontent-%COMP%] {\n    flex: 1;\n    overflow-y: auto;\n    padding: 24px;\n}\n\n.error-banner[_ngcontent-%COMP%] {\n    display: flex;\n    align-items: center;\n    gap: 8px;\n    padding: 12px 16px;\n    background: #fef2f2;\n    border: 1px solid #fecaca;\n    border-radius: 10px;\n    color: #dc2626;\n    font-size: 0.85rem;\n    font-weight: 500;\n    margin-bottom: 20px;\n}\n\n\n\n.form-section[_ngcontent-%COMP%] {\n    margin-bottom: 28px;\n}\n\n.section-title[_ngcontent-%COMP%] {\n    font-size: 0.7rem;\n    font-weight: 700;\n    color: #94a3b8;\n    text-transform: uppercase;\n    letter-spacing: 0.05em;\n    margin-bottom: 16px;\n    padding-bottom: 8px;\n    border-bottom: 1px solid #f1f5f9;\n}\n\n.form-group[_ngcontent-%COMP%] {\n    margin-bottom: 16px;\n}\n\n.form-label[_ngcontent-%COMP%] {\n    display: block;\n    font-size: 0.8rem;\n    font-weight: 600;\n    color: #334155;\n    margin-bottom: 6px;\n}\n\n.required[_ngcontent-%COMP%] {\n    color: #ef4444;\n}\n\n.form-input[_ngcontent-%COMP%] {\n    width: 100%;\n    padding: 10px 14px;\n    border: 1px solid #e2e8f0;\n    border-radius: 10px;\n    font-size: 0.85rem;\n    color: #0f172a;\n    background: white;\n    outline: none;\n    transition: border-color 0.2s;\n    box-sizing: border-box;\n}\n\n.form-input[_ngcontent-%COMP%]:focus {\n    border-color: #0076b6;\n    box-shadow: 0 0 0 3px rgba(0, 118, 182, 0.1);\n}\n\n.form-textarea[_ngcontent-%COMP%] {\n    width: 100%;\n    padding: 10px 14px;\n    border: 1px solid #e2e8f0;\n    border-radius: 10px;\n    font-size: 0.85rem;\n    color: #0f172a;\n    background: white;\n    outline: none;\n    transition: border-color 0.2s;\n    resize: vertical;\n    font-family: inherit;\n    box-sizing: border-box;\n}\n\n.form-textarea[_ngcontent-%COMP%]:focus {\n    border-color: #0076b6;\n    box-shadow: 0 0 0 3px rgba(0, 118, 182, 0.1);\n}\n\n.form-textarea.mono[_ngcontent-%COMP%], \n.form-input.mono[_ngcontent-%COMP%] {\n    font-family: 'SFMono-Regular', Consolas, 'Liberation Mono', Menlo, monospace;\n    font-size: 0.8rem;\n}\n\n.form-hint[_ngcontent-%COMP%] {\n    font-size: 0.7rem;\n    color: #94a3b8;\n    margin-top: 4px;\n}\n\n.form-row[_ngcontent-%COMP%] {\n    display: grid;\n    grid-template-columns: 1fr 1fr;\n    gap: 12px;\n}\n\n.form-row.checkboxes[_ngcontent-%COMP%] {\n    display: flex;\n    gap: 24px;\n}\n\n.checkbox-label[_ngcontent-%COMP%] {\n    display: flex;\n    align-items: center;\n    gap: 8px;\n    font-size: 0.85rem;\n    color: #334155;\n    cursor: pointer;\n}\n\n.checkbox-label[_ngcontent-%COMP%]   input[type=\"checkbox\"][_ngcontent-%COMP%] {\n    width: 16px;\n    height: 16px;\n    accent-color: #0076b6;\n}\n\n\n\n.stats-grid[_ngcontent-%COMP%] {\n    display: grid;\n    grid-template-columns: repeat(2, 1fr);\n    gap: 12px;\n}\n\n.stat-item[_ngcontent-%COMP%] {\n    padding: 12px 16px;\n    background: #f8fafc;\n    border-radius: 10px;\n    border: 1px solid #f1f5f9;\n}\n\n.stat-label[_ngcontent-%COMP%] {\n    font-size: 0.7rem;\n    font-weight: 700;\n    color: #94a3b8;\n    text-transform: uppercase;\n    letter-spacing: 0.05em;\n    display: block;\n    margin-bottom: 4px;\n}\n\n.stat-value[_ngcontent-%COMP%] {\n    font-size: 1.1rem;\n    font-weight: 800;\n    color: #0f172a;\n}\n\n.stat-value.success[_ngcontent-%COMP%] { color: #10b981; }\n.stat-value.failure[_ngcontent-%COMP%] { color: #ef4444; }\n\n\n\n.slideout-footer[_ngcontent-%COMP%] {\n    display: flex;\n    justify-content: space-between;\n    align-items: center;\n    padding: 16px 24px;\n    border-top: 1px solid #e2e8f0;\n    background: #f1f5f9;\n    flex-shrink: 0;\n    box-shadow: 0 -2px 8px rgba(0, 0, 0, 0.06);\n    position: relative;\n    z-index: 1;\n}\n\n.footer-left[_ngcontent-%COMP%], .footer-right[_ngcontent-%COMP%] {\n    display: flex;\n    gap: 8px;\n}\n\n.save-btn[_ngcontent-%COMP%] {\n    display: inline-flex;\n    align-items: center;\n    gap: 6px;\n    padding: 10px 24px;\n    background: linear-gradient(135deg, #0076b6 0%, #005a8c 100%);\n    color: white;\n    border: none;\n    border-radius: 10px;\n    cursor: pointer;\n    font-size: 0.85rem;\n    font-weight: 600;\n    transition: all 0.2s ease;\n}\n\n.save-btn[_ngcontent-%COMP%]:hover:not(:disabled) {\n    transform: translateY(-1px);\n    box-shadow: 0 4px 12px rgba(0, 118, 182, 0.4);\n}\n\n.save-btn[_ngcontent-%COMP%]:disabled {\n    opacity: 0.5;\n    cursor: not-allowed;\n}\n\n.cancel-btn[_ngcontent-%COMP%] {\n    padding: 10px 20px;\n    background: white;\n    border: 1px solid #e5e7eb;\n    border-radius: 10px;\n    cursor: pointer;\n    font-size: 0.85rem;\n    font-weight: 500;\n    color: #475569;\n    transition: all 0.2s;\n}\n\n.cancel-btn[_ngcontent-%COMP%]:hover {\n    background: #f3f4f6;\n}\n\n.delete-btn[_ngcontent-%COMP%] {\n    display: inline-flex;\n    align-items: center;\n    gap: 6px;\n    padding: 10px 16px;\n    background: transparent;\n    color: #ef4444;\n    border: 1px solid #fecaca;\n    border-radius: 10px;\n    cursor: pointer;\n    font-size: 0.85rem;\n    font-weight: 500;\n    transition: all 0.2s;\n}\n\n.delete-btn[_ngcontent-%COMP%]:hover:not(:disabled) {\n    background: #fef2f2;\n}\n\n.delete-btn[_ngcontent-%COMP%]:disabled {\n    opacity: 0.5;\n    cursor: not-allowed;\n}\n\n\n\n.confirm-overlay[_ngcontent-%COMP%] {\n    position: absolute;\n    top: 0;\n    left: 0;\n    right: 0;\n    bottom: 0;\n    background: rgba(0,0,0,0.4);\n    display: flex;\n    align-items: center;\n    justify-content: center;\n    z-index: 10;\n}\n\n.confirm-dialog[_ngcontent-%COMP%] {\n    background: white;\n    border-radius: 16px;\n    padding: 32px;\n    max-width: 360px;\n    text-align: center;\n    box-shadow: 0 20px 40px rgba(0,0,0,0.2);\n}\n\n.confirm-icon[_ngcontent-%COMP%] {\n    width: 56px;\n    height: 56px;\n    border-radius: 50%;\n    background: #fef2f2;\n    display: flex;\n    align-items: center;\n    justify-content: center;\n    margin: 0 auto 16px;\n}\n\n.confirm-icon[_ngcontent-%COMP%]   i[_ngcontent-%COMP%] {\n    font-size: 1.5rem;\n    color: #ef4444;\n}\n\n.confirm-dialog[_ngcontent-%COMP%]   h3[_ngcontent-%COMP%] {\n    font-size: 1.1rem;\n    font-weight: 700;\n    color: #0f172a;\n    margin: 0 0 8px;\n}\n\n.confirm-dialog[_ngcontent-%COMP%]   p[_ngcontent-%COMP%] {\n    font-size: 0.85rem;\n    color: #64748b;\n    margin: 0 0 24px;\n    line-height: 1.4;\n}\n\n.confirm-actions[_ngcontent-%COMP%] {\n    display: flex;\n    gap: 8px;\n    justify-content: center;\n}\n\n.delete-confirm-btn[_ngcontent-%COMP%] {\n    display: inline-flex;\n    align-items: center;\n    gap: 6px;\n    padding: 10px 24px;\n    background: #ef4444;\n    color: white;\n    border: none;\n    border-radius: 10px;\n    cursor: pointer;\n    font-size: 0.85rem;\n    font-weight: 600;\n    transition: all 0.2s;\n}\n\n.delete-confirm-btn[_ngcontent-%COMP%]:hover:not(:disabled) {\n    background: #dc2626;\n}\n\n.delete-confirm-btn[_ngcontent-%COMP%]:disabled {\n    opacity: 0.5;\n    cursor: not-allowed;\n}\n\n\n\n.code-editor-wrapper[_ngcontent-%COMP%] {\n    border: 1px solid #e2e8f0;\n    border-radius: 10px;\n    overflow: hidden;\n    transition: border-color 0.2s;\n}\n\n.code-editor-wrapper[_ngcontent-%COMP%]:focus-within {\n    border-color: #0076b6;\n    box-shadow: 0 0 0 3px rgba(0, 118, 182, 0.1);\n}\n\n.code-editor-wrapper[_ngcontent-%COMP%]   mj-code-editor[_ngcontent-%COMP%] {\n    display: block;\n    height: 180px;\n}\n\n\n\n@media (max-width: 768px) {\n    .slideout-body[_ngcontent-%COMP%] {\n        padding: 16px;\n    }\n\n    .form-row[_ngcontent-%COMP%] {\n        grid-template-columns: 1fr;\n    }\n\n    .form-row.checkboxes[_ngcontent-%COMP%] {\n        flex-direction: column;\n        gap: 12px;\n    }\n\n    .code-editor-wrapper[_ngcontent-%COMP%]   mj-code-editor[_ngcontent-%COMP%] {\n        height: 140px;\n    }\n}\n\n@media (max-width: 480px) {\n    .slideout-header[_ngcontent-%COMP%] {\n        padding: 16px;\n    }\n\n    .slideout-footer[_ngcontent-%COMP%] {\n        padding: 12px 16px;\n        flex-direction: column;\n        gap: 10px;\n    }\n\n    .footer-left[_ngcontent-%COMP%], .footer-right[_ngcontent-%COMP%] {\n        width: 100%;\n    }\n\n    .footer-right[_ngcontent-%COMP%] {\n        justify-content: stretch;\n    }\n\n    .save-btn[_ngcontent-%COMP%], .cancel-btn[_ngcontent-%COMP%], .delete-btn[_ngcontent-%COMP%] {\n        flex: 1;\n        justify-content: center;\n    }\n\n    .stats-grid[_ngcontent-%COMP%] {\n        grid-template-columns: 1fr;\n    }\n}"], changeDetection: 0 });
 }
 (() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(JobSlideoutComponent, [{
         type: Component,
-        args: [{ selector: 'app-job-slideout', changeDetection: ChangeDetectionStrategy.OnPush, template: "<div class=\"slideout-container\">\n    <!-- Header -->\n    <div class=\"slideout-header\">\n        <div class=\"slideout-title\">\n            <i [class]=\"Mode === 'create' ? 'fa-solid fa-plus-circle' : 'fa-solid fa-pen-to-square'\"></i>\n            <span>{{Title}}</span>\n        </div>\n        <button class=\"close-btn\" (click)=\"OnClose()\">\n            <i class=\"fa-solid fa-xmark\"></i>\n        </button>\n    </div>\n\n    <!-- Body -->\n    <div class=\"slideout-body\">\n        <!-- Error -->\n        <div class=\"error-banner\" *ngIf=\"ErrorMessage\">\n            <i class=\"fa-solid fa-circle-exclamation\"></i>\n            <span>{{ErrorMessage}}</span>\n        </div>\n\n        <!-- Form -->\n        <div class=\"form-section\">\n            <div class=\"section-title\">General</div>\n\n            <div class=\"form-group\">\n                <label class=\"form-label\">Name <span class=\"required\">*</span></label>\n                <input class=\"form-input\" type=\"text\" [(ngModel)]=\"Name\" placeholder=\"e.g., Daily Data Sync\" />\n            </div>\n\n            <div class=\"form-group\">\n                <label class=\"form-label\">Description</label>\n                <textarea class=\"form-textarea\" [(ngModel)]=\"Description\" rows=\"3\"\n                          placeholder=\"What does this job do?\"></textarea>\n            </div>\n\n            <div class=\"form-row\">\n                <div class=\"form-group\">\n                    <label class=\"form-label\">Job Type <span class=\"required\">*</span></label>\n                    <select class=\"form-input\" [(ngModel)]=\"JobTypeID\">\n                        <option *ngFor=\"let t of JobTypes\" [value]=\"t.id\">{{t.name}}</option>\n                    </select>\n                </div>\n                <div class=\"form-group\">\n                    <label class=\"form-label\">Status</label>\n                    <select class=\"form-input\" [(ngModel)]=\"Status\">\n                        <option *ngFor=\"let s of StatusOptions\" [value]=\"s\">{{s}}</option>\n                    </select>\n                </div>\n            </div>\n        </div>\n\n        <div class=\"form-section\">\n            <div class=\"section-title\">Schedule</div>\n\n            <div class=\"form-group\">\n                <label class=\"form-label\">Cron Expression <span class=\"required\">*</span></label>\n                <input class=\"form-input mono\" type=\"text\" [(ngModel)]=\"CronExpression\"\n                       placeholder=\"0 */15 * * * *\" />\n                <div class=\"form-hint\">e.g., 0 */15 * * * * (every 15 minutes)</div>\n            </div>\n\n            <div class=\"form-row\">\n                <div class=\"form-group\">\n                    <label class=\"form-label\">Timezone</label>\n                    <select class=\"form-input\" [(ngModel)]=\"Timezone\">\n                        <option *ngFor=\"let tz of TimezoneOptions\" [value]=\"tz\">{{tz}}</option>\n                    </select>\n                </div>\n                <div class=\"form-group\">\n                    <label class=\"form-label\">Concurrency</label>\n                    <select class=\"form-input\" [(ngModel)]=\"ConcurrencyMode\">\n                        <option *ngFor=\"let c of ConcurrencyOptions\" [value]=\"c\">{{c}}</option>\n                    </select>\n                </div>\n            </div>\n        </div>\n\n        <div class=\"form-section\">\n            <div class=\"section-title\">Configuration</div>\n            <div class=\"form-group\">\n                <label class=\"form-label\">Configuration JSON</label>\n                <div class=\"code-editor-wrapper\">\n                    <mj-code-editor\n                        [value]=\"Configuration\"\n                        [language]=\"'json'\"\n                        [lineWrapping]=\"true\"\n                        [placeholder]=\"'{ }'\"\n                        (change)=\"OnConfigurationChange($event)\">\n                    </mj-code-editor>\n                </div>\n                <div class=\"form-hint\">Optional JSON configuration for the job type plugin</div>\n            </div>\n        </div>\n\n        <div class=\"form-section\">\n            <div class=\"section-title\">Notifications</div>\n            <div class=\"form-row checkboxes\">\n                <label class=\"checkbox-label\">\n                    <input type=\"checkbox\" [(ngModel)]=\"NotifyOnSuccess\" />\n                    <span>Notify on success</span>\n                </label>\n                <label class=\"checkbox-label\">\n                    <input type=\"checkbox\" [(ngModel)]=\"NotifyOnFailure\" />\n                    <span>Notify on failure</span>\n                </label>\n            </div>\n        </div>\n\n        <!-- Job Stats (Edit Mode) -->\n        <div class=\"form-section\" *ngIf=\"Mode === 'edit' && Job\">\n            <div class=\"section-title\">Statistics</div>\n            <div class=\"stats-grid\">\n                <div class=\"stat-item\">\n                    <span class=\"stat-label\">Total Runs</span>\n                    <span class=\"stat-value\">{{Job.totalRuns}}</span>\n                </div>\n                <div class=\"stat-item\">\n                    <span class=\"stat-label\">Success</span>\n                    <span class=\"stat-value success\">{{Job.successCount}}</span>\n                </div>\n                <div class=\"stat-item\">\n                    <span class=\"stat-label\">Failures</span>\n                    <span class=\"stat-value failure\">{{Job.failureCount}}</span>\n                </div>\n                <div class=\"stat-item\">\n                    <span class=\"stat-label\">Created</span>\n                    <span class=\"stat-value\">{{Job.createdAt | date:'short'}}</span>\n                </div>\n            </div>\n        </div>\n    </div>\n\n    <!-- Footer -->\n    <div class=\"slideout-footer\">\n        <div class=\"footer-left\">\n            <button *ngIf=\"Mode === 'edit'\" class=\"delete-btn\" (click)=\"ShowDeleteConfirm = true\"\n                    [disabled]=\"IsDeleting\">\n                <i class=\"fa-solid fa-trash-can\"></i> Delete\n            </button>\n        </div>\n        <div class=\"footer-right\">\n            <button class=\"cancel-btn\" (click)=\"OnClose()\">Cancel</button>\n            <button class=\"save-btn\" (click)=\"Save()\" [disabled]=\"!IsValid || IsSaving\">\n                <i *ngIf=\"IsSaving\" class=\"fa-solid fa-spinner fa-spin\"></i>\n                <i *ngIf=\"!IsSaving\" class=\"fa-solid fa-check\"></i>\n                {{Mode === 'create' ? 'Create Job' : 'Save Changes'}}\n            </button>\n        </div>\n    </div>\n\n    <!-- Delete Confirmation -->\n    <div class=\"confirm-overlay\" *ngIf=\"ShowDeleteConfirm\">\n        <div class=\"confirm-dialog\">\n            <div class=\"confirm-icon\">\n                <i class=\"fa-solid fa-triangle-exclamation\"></i>\n            </div>\n            <h3>Delete Job</h3>\n            <p>Are you sure you want to delete \"{{Name}}\"? This action cannot be undone.</p>\n            <div class=\"confirm-actions\">\n                <button class=\"delete-confirm-btn\" (click)=\"Delete()\" [disabled]=\"IsDeleting\">\n                    <i *ngIf=\"IsDeleting\" class=\"fa-solid fa-spinner fa-spin\"></i>\n                    Delete\n                </button>\n                <button class=\"cancel-btn\" (click)=\"ShowDeleteConfirm = false\">Cancel</button>\n            </div>\n        </div>\n    </div>\n</div>\n", styles: [".slideout-container {\n    display: flex;\n    flex-direction: column;\n    height: 100%;\n}\n\n/* \u2500\u2500 Header \u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500 */\n.slideout-header {\n    display: flex;\n    justify-content: space-between;\n    align-items: center;\n    padding: 20px 24px;\n    border-bottom: 1px solid #e2e8f0;\n    background: white;\n    flex-shrink: 0;\n}\n\n.slideout-title {\n    display: flex;\n    align-items: center;\n    gap: 10px;\n    font-size: 1.1rem;\n    font-weight: 700;\n    color: #0f172a;\n}\n\n.slideout-title i {\n    color: #0076b6;\n}\n\n.close-btn {\n    width: 36px;\n    height: 36px;\n    display: flex;\n    align-items: center;\n    justify-content: center;\n    background: transparent;\n    border: 1px solid #e5e7eb;\n    border-radius: 8px;\n    cursor: pointer;\n    color: #64748b;\n    transition: all 0.2s;\n}\n\n.close-btn:hover {\n    background: #f1f5f9;\n    color: #0f172a;\n}\n\n/* \u2500\u2500 Body \u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500 */\n.slideout-body {\n    flex: 1;\n    overflow-y: auto;\n    padding: 24px;\n}\n\n.error-banner {\n    display: flex;\n    align-items: center;\n    gap: 8px;\n    padding: 12px 16px;\n    background: #fef2f2;\n    border: 1px solid #fecaca;\n    border-radius: 10px;\n    color: #dc2626;\n    font-size: 0.85rem;\n    font-weight: 500;\n    margin-bottom: 20px;\n}\n\n/* \u2500\u2500 Form \u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500 */\n.form-section {\n    margin-bottom: 28px;\n}\n\n.section-title {\n    font-size: 0.7rem;\n    font-weight: 700;\n    color: #94a3b8;\n    text-transform: uppercase;\n    letter-spacing: 0.05em;\n    margin-bottom: 16px;\n    padding-bottom: 8px;\n    border-bottom: 1px solid #f1f5f9;\n}\n\n.form-group {\n    margin-bottom: 16px;\n}\n\n.form-label {\n    display: block;\n    font-size: 0.8rem;\n    font-weight: 600;\n    color: #334155;\n    margin-bottom: 6px;\n}\n\n.required {\n    color: #ef4444;\n}\n\n.form-input {\n    width: 100%;\n    padding: 10px 14px;\n    border: 1px solid #e2e8f0;\n    border-radius: 10px;\n    font-size: 0.85rem;\n    color: #0f172a;\n    background: white;\n    outline: none;\n    transition: border-color 0.2s;\n    box-sizing: border-box;\n}\n\n.form-input:focus {\n    border-color: #0076b6;\n    box-shadow: 0 0 0 3px rgba(0, 118, 182, 0.1);\n}\n\n.form-textarea {\n    width: 100%;\n    padding: 10px 14px;\n    border: 1px solid #e2e8f0;\n    border-radius: 10px;\n    font-size: 0.85rem;\n    color: #0f172a;\n    background: white;\n    outline: none;\n    transition: border-color 0.2s;\n    resize: vertical;\n    font-family: inherit;\n    box-sizing: border-box;\n}\n\n.form-textarea:focus {\n    border-color: #0076b6;\n    box-shadow: 0 0 0 3px rgba(0, 118, 182, 0.1);\n}\n\n.form-textarea.mono,\n.form-input.mono {\n    font-family: 'SFMono-Regular', Consolas, 'Liberation Mono', Menlo, monospace;\n    font-size: 0.8rem;\n}\n\n.form-hint {\n    font-size: 0.7rem;\n    color: #94a3b8;\n    margin-top: 4px;\n}\n\n.form-row {\n    display: grid;\n    grid-template-columns: 1fr 1fr;\n    gap: 12px;\n}\n\n.form-row.checkboxes {\n    display: flex;\n    gap: 24px;\n}\n\n.checkbox-label {\n    display: flex;\n    align-items: center;\n    gap: 8px;\n    font-size: 0.85rem;\n    color: #334155;\n    cursor: pointer;\n}\n\n.checkbox-label input[type=\"checkbox\"] {\n    width: 16px;\n    height: 16px;\n    accent-color: #0076b6;\n}\n\n/* \u2500\u2500 Stats Grid \u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500 */\n.stats-grid {\n    display: grid;\n    grid-template-columns: repeat(2, 1fr);\n    gap: 12px;\n}\n\n.stat-item {\n    padding: 12px 16px;\n    background: #f8fafc;\n    border-radius: 10px;\n    border: 1px solid #f1f5f9;\n}\n\n.stat-label {\n    font-size: 0.7rem;\n    font-weight: 700;\n    color: #94a3b8;\n    text-transform: uppercase;\n    letter-spacing: 0.05em;\n    display: block;\n    margin-bottom: 4px;\n}\n\n.stat-value {\n    font-size: 1.1rem;\n    font-weight: 800;\n    color: #0f172a;\n}\n\n.stat-value.success { color: #10b981; }\n.stat-value.failure { color: #ef4444; }\n\n/* \u2500\u2500 Footer \u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500 */\n.slideout-footer {\n    display: flex;\n    justify-content: space-between;\n    align-items: center;\n    padding: 16px 24px;\n    border-top: 1px solid #e2e8f0;\n    background: #f1f5f9;\n    flex-shrink: 0;\n    box-shadow: 0 -2px 8px rgba(0, 0, 0, 0.06);\n    position: relative;\n    z-index: 1;\n}\n\n.footer-left, .footer-right {\n    display: flex;\n    gap: 8px;\n}\n\n.save-btn {\n    display: inline-flex;\n    align-items: center;\n    gap: 6px;\n    padding: 10px 24px;\n    background: linear-gradient(135deg, #0076b6 0%, #005a8c 100%);\n    color: white;\n    border: none;\n    border-radius: 10px;\n    cursor: pointer;\n    font-size: 0.85rem;\n    font-weight: 600;\n    transition: all 0.2s ease;\n}\n\n.save-btn:hover:not(:disabled) {\n    transform: translateY(-1px);\n    box-shadow: 0 4px 12px rgba(0, 118, 182, 0.4);\n}\n\n.save-btn:disabled {\n    opacity: 0.5;\n    cursor: not-allowed;\n}\n\n.cancel-btn {\n    padding: 10px 20px;\n    background: white;\n    border: 1px solid #e5e7eb;\n    border-radius: 10px;\n    cursor: pointer;\n    font-size: 0.85rem;\n    font-weight: 500;\n    color: #475569;\n    transition: all 0.2s;\n}\n\n.cancel-btn:hover {\n    background: #f3f4f6;\n}\n\n.delete-btn {\n    display: inline-flex;\n    align-items: center;\n    gap: 6px;\n    padding: 10px 16px;\n    background: transparent;\n    color: #ef4444;\n    border: 1px solid #fecaca;\n    border-radius: 10px;\n    cursor: pointer;\n    font-size: 0.85rem;\n    font-weight: 500;\n    transition: all 0.2s;\n}\n\n.delete-btn:hover:not(:disabled) {\n    background: #fef2f2;\n}\n\n.delete-btn:disabled {\n    opacity: 0.5;\n    cursor: not-allowed;\n}\n\n/* \u2500\u2500 Delete Confirmation \u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500 */\n.confirm-overlay {\n    position: absolute;\n    top: 0;\n    left: 0;\n    right: 0;\n    bottom: 0;\n    background: rgba(0,0,0,0.4);\n    display: flex;\n    align-items: center;\n    justify-content: center;\n    z-index: 10;\n}\n\n.confirm-dialog {\n    background: white;\n    border-radius: 16px;\n    padding: 32px;\n    max-width: 360px;\n    text-align: center;\n    box-shadow: 0 20px 40px rgba(0,0,0,0.2);\n}\n\n.confirm-icon {\n    width: 56px;\n    height: 56px;\n    border-radius: 50%;\n    background: #fef2f2;\n    display: flex;\n    align-items: center;\n    justify-content: center;\n    margin: 0 auto 16px;\n}\n\n.confirm-icon i {\n    font-size: 1.5rem;\n    color: #ef4444;\n}\n\n.confirm-dialog h3 {\n    font-size: 1.1rem;\n    font-weight: 700;\n    color: #0f172a;\n    margin: 0 0 8px;\n}\n\n.confirm-dialog p {\n    font-size: 0.85rem;\n    color: #64748b;\n    margin: 0 0 24px;\n    line-height: 1.4;\n}\n\n.confirm-actions {\n    display: flex;\n    gap: 8px;\n    justify-content: center;\n}\n\n.delete-confirm-btn {\n    display: inline-flex;\n    align-items: center;\n    gap: 6px;\n    padding: 10px 24px;\n    background: #ef4444;\n    color: white;\n    border: none;\n    border-radius: 10px;\n    cursor: pointer;\n    font-size: 0.85rem;\n    font-weight: 600;\n    transition: all 0.2s;\n}\n\n.delete-confirm-btn:hover:not(:disabled) {\n    background: #dc2626;\n}\n\n.delete-confirm-btn:disabled {\n    opacity: 0.5;\n    cursor: not-allowed;\n}\n\n/* \u2500\u2500 Code Editor \u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500 */\n.code-editor-wrapper {\n    border: 1px solid #e2e8f0;\n    border-radius: 10px;\n    overflow: hidden;\n    transition: border-color 0.2s;\n}\n\n.code-editor-wrapper:focus-within {\n    border-color: #0076b6;\n    box-shadow: 0 0 0 3px rgba(0, 118, 182, 0.1);\n}\n\n.code-editor-wrapper mj-code-editor {\n    display: block;\n    height: 180px;\n}\n\n/* \u2500\u2500 Responsive \u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500 */\n@media (max-width: 768px) {\n    .slideout-body {\n        padding: 16px;\n    }\n\n    .form-row {\n        grid-template-columns: 1fr;\n    }\n\n    .form-row.checkboxes {\n        flex-direction: column;\n        gap: 12px;\n    }\n\n    .code-editor-wrapper mj-code-editor {\n        height: 140px;\n    }\n}\n\n@media (max-width: 480px) {\n    .slideout-header {\n        padding: 16px;\n    }\n\n    .slideout-footer {\n        padding: 12px 16px;\n        flex-direction: column;\n        gap: 10px;\n    }\n\n    .footer-left, .footer-right {\n        width: 100%;\n    }\n\n    .footer-right {\n        justify-content: stretch;\n    }\n\n    .save-btn, .cancel-btn, .delete-btn {\n        flex: 1;\n        justify-content: center;\n    }\n\n    .stats-grid {\n        grid-template-columns: 1fr;\n    }\n}\n"] }]
+        args: [{ standalone: false, selector: 'app-job-slideout', changeDetection: ChangeDetectionStrategy.OnPush, template: "<div class=\"slideout-container\">\n  <!-- Header -->\n  <div class=\"slideout-header\">\n    <div class=\"slideout-title\">\n      <i [class]=\"Mode === 'create' ? 'fa-solid fa-plus-circle' : 'fa-solid fa-pen-to-square'\"></i>\n      <span>{{Title}}</span>\n    </div>\n    <button class=\"close-btn\" (click)=\"OnClose()\">\n      <i class=\"fa-solid fa-xmark\"></i>\n    </button>\n  </div>\n\n  <!-- Body -->\n  <div class=\"slideout-body\">\n    <!-- Error -->\n    @if (ErrorMessage) {\n      <div class=\"error-banner\">\n        <i class=\"fa-solid fa-circle-exclamation\"></i>\n        <span>{{ErrorMessage}}</span>\n      </div>\n    }\n\n    <!-- Form -->\n    <div class=\"form-section\">\n      <div class=\"section-title\">General</div>\n\n      <div class=\"form-group\">\n        <label class=\"form-label\">Name <span class=\"required\">*</span></label>\n        <input class=\"form-input\" type=\"text\" [(ngModel)]=\"Name\" placeholder=\"e.g., Daily Data Sync\" />\n      </div>\n\n      <div class=\"form-group\">\n        <label class=\"form-label\">Description</label>\n        <textarea class=\"form-textarea\" [(ngModel)]=\"Description\" rows=\"3\"\n        placeholder=\"What does this job do?\"></textarea>\n      </div>\n\n      <div class=\"form-row\">\n        <div class=\"form-group\">\n          <label class=\"form-label\">Job Type <span class=\"required\">*</span></label>\n          <select class=\"form-input\" [(ngModel)]=\"JobTypeID\">\n            @for (t of JobTypes; track t) {\n              <option [value]=\"t.id\">{{t.name}}</option>\n            }\n          </select>\n        </div>\n        <div class=\"form-group\">\n          <label class=\"form-label\">Status</label>\n          <select class=\"form-input\" [(ngModel)]=\"Status\">\n            @for (s of StatusOptions; track s) {\n              <option [value]=\"s\">{{s}}</option>\n            }\n          </select>\n        </div>\n      </div>\n    </div>\n\n    <div class=\"form-section\">\n      <div class=\"section-title\">Schedule</div>\n\n      <div class=\"form-group\">\n        <label class=\"form-label\">Cron Expression <span class=\"required\">*</span></label>\n        <input class=\"form-input mono\" type=\"text\" [(ngModel)]=\"CronExpression\"\n          placeholder=\"0 */15 * * * *\" />\n        <div class=\"form-hint\">e.g., 0 */15 * * * * (every 15 minutes)</div>\n      </div>\n\n      <div class=\"form-row\">\n        <div class=\"form-group\">\n          <label class=\"form-label\">Timezone</label>\n          <select class=\"form-input\" [(ngModel)]=\"Timezone\">\n            @for (tz of TimezoneOptions; track tz) {\n              <option [value]=\"tz\">{{tz}}</option>\n            }\n          </select>\n        </div>\n        <div class=\"form-group\">\n          <label class=\"form-label\">Concurrency</label>\n          <select class=\"form-input\" [(ngModel)]=\"ConcurrencyMode\">\n            @for (c of ConcurrencyOptions; track c) {\n              <option [value]=\"c\">{{c}}</option>\n            }\n          </select>\n        </div>\n      </div>\n    </div>\n\n    <div class=\"form-section\">\n      <div class=\"section-title\">Configuration</div>\n      <div class=\"form-group\">\n        <label class=\"form-label\">Configuration JSON</label>\n        <div class=\"code-editor-wrapper\">\n          <mj-code-editor\n            [value]=\"Configuration\"\n            [language]=\"'json'\"\n            [lineWrapping]=\"true\"\n            [placeholder]=\"'{ }'\"\n            (change)=\"OnConfigurationChange($event)\">\n          </mj-code-editor>\n        </div>\n        <div class=\"form-hint\">Optional JSON configuration for the job type plugin</div>\n      </div>\n    </div>\n\n    <div class=\"form-section\">\n      <div class=\"section-title\">Notifications</div>\n      <div class=\"form-row checkboxes\">\n        <label class=\"checkbox-label\">\n          <input type=\"checkbox\" [(ngModel)]=\"NotifyOnSuccess\" />\n          <span>Notify on success</span>\n        </label>\n        <label class=\"checkbox-label\">\n          <input type=\"checkbox\" [(ngModel)]=\"NotifyOnFailure\" />\n          <span>Notify on failure</span>\n        </label>\n      </div>\n    </div>\n\n    <!-- Job Stats (Edit Mode) -->\n    @if (Mode === 'edit' && Job) {\n      <div class=\"form-section\">\n        <div class=\"section-title\">Statistics</div>\n        <div class=\"stats-grid\">\n          <div class=\"stat-item\">\n            <span class=\"stat-label\">Total Runs</span>\n            <span class=\"stat-value\">{{Job.totalRuns}}</span>\n          </div>\n          <div class=\"stat-item\">\n            <span class=\"stat-label\">Success</span>\n            <span class=\"stat-value success\">{{Job.successCount}}</span>\n          </div>\n          <div class=\"stat-item\">\n            <span class=\"stat-label\">Failures</span>\n            <span class=\"stat-value failure\">{{Job.failureCount}}</span>\n          </div>\n          <div class=\"stat-item\">\n            <span class=\"stat-label\">Created</span>\n            <span class=\"stat-value\">{{Job.createdAt | date:'short'}}</span>\n          </div>\n        </div>\n      </div>\n    }\n  </div>\n\n  <!-- Footer -->\n  <div class=\"slideout-footer\">\n    <div class=\"footer-left\">\n      @if (Mode === 'edit') {\n        <button class=\"delete-btn\" (click)=\"ShowDeleteConfirm = true\"\n          [disabled]=\"IsDeleting\">\n          <i class=\"fa-solid fa-trash-can\"></i> Delete\n        </button>\n      }\n    </div>\n    <div class=\"footer-right\">\n      <button class=\"cancel-btn\" (click)=\"OnClose()\">Cancel</button>\n      <button class=\"save-btn\" (click)=\"Save()\" [disabled]=\"!IsValid || IsSaving\">\n        @if (IsSaving) {\n          <i class=\"fa-solid fa-spinner fa-spin\"></i>\n        }\n        @if (!IsSaving) {\n          <i class=\"fa-solid fa-check\"></i>\n        }\n        {{Mode === 'create' ? 'Create Job' : 'Save Changes'}}\n      </button>\n    </div>\n  </div>\n\n  <!-- Delete Confirmation -->\n  @if (ShowDeleteConfirm) {\n    <div class=\"confirm-overlay\">\n      <div class=\"confirm-dialog\">\n        <div class=\"confirm-icon\">\n          <i class=\"fa-solid fa-triangle-exclamation\"></i>\n        </div>\n        <h3>Delete Job</h3>\n        <p>Are you sure you want to delete \"{{Name}}\"? This action cannot be undone.</p>\n        <div class=\"confirm-actions\">\n          <button class=\"delete-confirm-btn\" (click)=\"Delete()\" [disabled]=\"IsDeleting\">\n            @if (IsDeleting) {\n              <i class=\"fa-solid fa-spinner fa-spin\"></i>\n            }\n            Delete\n          </button>\n          <button class=\"cancel-btn\" (click)=\"ShowDeleteConfirm = false\">Cancel</button>\n        </div>\n      </div>\n    </div>\n  }\n</div>\n", styles: [".slideout-container {\n    display: flex;\n    flex-direction: column;\n    height: 100%;\n}\n\n/* \u2500\u2500 Header \u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500 */\n.slideout-header {\n    display: flex;\n    justify-content: space-between;\n    align-items: center;\n    padding: 20px 24px;\n    border-bottom: 1px solid #e2e8f0;\n    background: white;\n    flex-shrink: 0;\n}\n\n.slideout-title {\n    display: flex;\n    align-items: center;\n    gap: 10px;\n    font-size: 1.1rem;\n    font-weight: 700;\n    color: #0f172a;\n}\n\n.slideout-title i {\n    color: #0076b6;\n}\n\n.close-btn {\n    width: 36px;\n    height: 36px;\n    display: flex;\n    align-items: center;\n    justify-content: center;\n    background: transparent;\n    border: 1px solid #e5e7eb;\n    border-radius: 8px;\n    cursor: pointer;\n    color: #64748b;\n    transition: all 0.2s;\n}\n\n.close-btn:hover {\n    background: #f1f5f9;\n    color: #0f172a;\n}\n\n/* \u2500\u2500 Body \u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500 */\n.slideout-body {\n    flex: 1;\n    overflow-y: auto;\n    padding: 24px;\n}\n\n.error-banner {\n    display: flex;\n    align-items: center;\n    gap: 8px;\n    padding: 12px 16px;\n    background: #fef2f2;\n    border: 1px solid #fecaca;\n    border-radius: 10px;\n    color: #dc2626;\n    font-size: 0.85rem;\n    font-weight: 500;\n    margin-bottom: 20px;\n}\n\n/* \u2500\u2500 Form \u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500 */\n.form-section {\n    margin-bottom: 28px;\n}\n\n.section-title {\n    font-size: 0.7rem;\n    font-weight: 700;\n    color: #94a3b8;\n    text-transform: uppercase;\n    letter-spacing: 0.05em;\n    margin-bottom: 16px;\n    padding-bottom: 8px;\n    border-bottom: 1px solid #f1f5f9;\n}\n\n.form-group {\n    margin-bottom: 16px;\n}\n\n.form-label {\n    display: block;\n    font-size: 0.8rem;\n    font-weight: 600;\n    color: #334155;\n    margin-bottom: 6px;\n}\n\n.required {\n    color: #ef4444;\n}\n\n.form-input {\n    width: 100%;\n    padding: 10px 14px;\n    border: 1px solid #e2e8f0;\n    border-radius: 10px;\n    font-size: 0.85rem;\n    color: #0f172a;\n    background: white;\n    outline: none;\n    transition: border-color 0.2s;\n    box-sizing: border-box;\n}\n\n.form-input:focus {\n    border-color: #0076b6;\n    box-shadow: 0 0 0 3px rgba(0, 118, 182, 0.1);\n}\n\n.form-textarea {\n    width: 100%;\n    padding: 10px 14px;\n    border: 1px solid #e2e8f0;\n    border-radius: 10px;\n    font-size: 0.85rem;\n    color: #0f172a;\n    background: white;\n    outline: none;\n    transition: border-color 0.2s;\n    resize: vertical;\n    font-family: inherit;\n    box-sizing: border-box;\n}\n\n.form-textarea:focus {\n    border-color: #0076b6;\n    box-shadow: 0 0 0 3px rgba(0, 118, 182, 0.1);\n}\n\n.form-textarea.mono,\n.form-input.mono {\n    font-family: 'SFMono-Regular', Consolas, 'Liberation Mono', Menlo, monospace;\n    font-size: 0.8rem;\n}\n\n.form-hint {\n    font-size: 0.7rem;\n    color: #94a3b8;\n    margin-top: 4px;\n}\n\n.form-row {\n    display: grid;\n    grid-template-columns: 1fr 1fr;\n    gap: 12px;\n}\n\n.form-row.checkboxes {\n    display: flex;\n    gap: 24px;\n}\n\n.checkbox-label {\n    display: flex;\n    align-items: center;\n    gap: 8px;\n    font-size: 0.85rem;\n    color: #334155;\n    cursor: pointer;\n}\n\n.checkbox-label input[type=\"checkbox\"] {\n    width: 16px;\n    height: 16px;\n    accent-color: #0076b6;\n}\n\n/* \u2500\u2500 Stats Grid \u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500 */\n.stats-grid {\n    display: grid;\n    grid-template-columns: repeat(2, 1fr);\n    gap: 12px;\n}\n\n.stat-item {\n    padding: 12px 16px;\n    background: #f8fafc;\n    border-radius: 10px;\n    border: 1px solid #f1f5f9;\n}\n\n.stat-label {\n    font-size: 0.7rem;\n    font-weight: 700;\n    color: #94a3b8;\n    text-transform: uppercase;\n    letter-spacing: 0.05em;\n    display: block;\n    margin-bottom: 4px;\n}\n\n.stat-value {\n    font-size: 1.1rem;\n    font-weight: 800;\n    color: #0f172a;\n}\n\n.stat-value.success { color: #10b981; }\n.stat-value.failure { color: #ef4444; }\n\n/* \u2500\u2500 Footer \u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500 */\n.slideout-footer {\n    display: flex;\n    justify-content: space-between;\n    align-items: center;\n    padding: 16px 24px;\n    border-top: 1px solid #e2e8f0;\n    background: #f1f5f9;\n    flex-shrink: 0;\n    box-shadow: 0 -2px 8px rgba(0, 0, 0, 0.06);\n    position: relative;\n    z-index: 1;\n}\n\n.footer-left, .footer-right {\n    display: flex;\n    gap: 8px;\n}\n\n.save-btn {\n    display: inline-flex;\n    align-items: center;\n    gap: 6px;\n    padding: 10px 24px;\n    background: linear-gradient(135deg, #0076b6 0%, #005a8c 100%);\n    color: white;\n    border: none;\n    border-radius: 10px;\n    cursor: pointer;\n    font-size: 0.85rem;\n    font-weight: 600;\n    transition: all 0.2s ease;\n}\n\n.save-btn:hover:not(:disabled) {\n    transform: translateY(-1px);\n    box-shadow: 0 4px 12px rgba(0, 118, 182, 0.4);\n}\n\n.save-btn:disabled {\n    opacity: 0.5;\n    cursor: not-allowed;\n}\n\n.cancel-btn {\n    padding: 10px 20px;\n    background: white;\n    border: 1px solid #e5e7eb;\n    border-radius: 10px;\n    cursor: pointer;\n    font-size: 0.85rem;\n    font-weight: 500;\n    color: #475569;\n    transition: all 0.2s;\n}\n\n.cancel-btn:hover {\n    background: #f3f4f6;\n}\n\n.delete-btn {\n    display: inline-flex;\n    align-items: center;\n    gap: 6px;\n    padding: 10px 16px;\n    background: transparent;\n    color: #ef4444;\n    border: 1px solid #fecaca;\n    border-radius: 10px;\n    cursor: pointer;\n    font-size: 0.85rem;\n    font-weight: 500;\n    transition: all 0.2s;\n}\n\n.delete-btn:hover:not(:disabled) {\n    background: #fef2f2;\n}\n\n.delete-btn:disabled {\n    opacity: 0.5;\n    cursor: not-allowed;\n}\n\n/* \u2500\u2500 Delete Confirmation \u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500 */\n.confirm-overlay {\n    position: absolute;\n    top: 0;\n    left: 0;\n    right: 0;\n    bottom: 0;\n    background: rgba(0,0,0,0.4);\n    display: flex;\n    align-items: center;\n    justify-content: center;\n    z-index: 10;\n}\n\n.confirm-dialog {\n    background: white;\n    border-radius: 16px;\n    padding: 32px;\n    max-width: 360px;\n    text-align: center;\n    box-shadow: 0 20px 40px rgba(0,0,0,0.2);\n}\n\n.confirm-icon {\n    width: 56px;\n    height: 56px;\n    border-radius: 50%;\n    background: #fef2f2;\n    display: flex;\n    align-items: center;\n    justify-content: center;\n    margin: 0 auto 16px;\n}\n\n.confirm-icon i {\n    font-size: 1.5rem;\n    color: #ef4444;\n}\n\n.confirm-dialog h3 {\n    font-size: 1.1rem;\n    font-weight: 700;\n    color: #0f172a;\n    margin: 0 0 8px;\n}\n\n.confirm-dialog p {\n    font-size: 0.85rem;\n    color: #64748b;\n    margin: 0 0 24px;\n    line-height: 1.4;\n}\n\n.confirm-actions {\n    display: flex;\n    gap: 8px;\n    justify-content: center;\n}\n\n.delete-confirm-btn {\n    display: inline-flex;\n    align-items: center;\n    gap: 6px;\n    padding: 10px 24px;\n    background: #ef4444;\n    color: white;\n    border: none;\n    border-radius: 10px;\n    cursor: pointer;\n    font-size: 0.85rem;\n    font-weight: 600;\n    transition: all 0.2s;\n}\n\n.delete-confirm-btn:hover:not(:disabled) {\n    background: #dc2626;\n}\n\n.delete-confirm-btn:disabled {\n    opacity: 0.5;\n    cursor: not-allowed;\n}\n\n/* \u2500\u2500 Code Editor \u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500 */\n.code-editor-wrapper {\n    border: 1px solid #e2e8f0;\n    border-radius: 10px;\n    overflow: hidden;\n    transition: border-color 0.2s;\n}\n\n.code-editor-wrapper:focus-within {\n    border-color: #0076b6;\n    box-shadow: 0 0 0 3px rgba(0, 118, 182, 0.1);\n}\n\n.code-editor-wrapper mj-code-editor {\n    display: block;\n    height: 180px;\n}\n\n/* \u2500\u2500 Responsive \u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500 */\n@media (max-width: 768px) {\n    .slideout-body {\n        padding: 16px;\n    }\n\n    .form-row {\n        grid-template-columns: 1fr;\n    }\n\n    .form-row.checkboxes {\n        flex-direction: column;\n        gap: 12px;\n    }\n\n    .code-editor-wrapper mj-code-editor {\n        height: 140px;\n    }\n}\n\n@media (max-width: 480px) {\n    .slideout-header {\n        padding: 16px;\n    }\n\n    .slideout-footer {\n        padding: 12px 16px;\n        flex-direction: column;\n        gap: 10px;\n    }\n\n    .footer-left, .footer-right {\n        width: 100%;\n    }\n\n    .footer-right {\n        justify-content: stretch;\n    }\n\n    .save-btn, .cancel-btn, .delete-btn {\n        flex: 1;\n        justify-content: center;\n    }\n\n    .stats-grid {\n        grid-template-columns: 1fr;\n    }\n}\n"] }]
     }], () => [{ type: i1.SchedulingInstrumentationService }, { type: i0.ChangeDetectorRef }], { Mode: [{
             type: Input
         }], Job: [{
@@ -454,5 +455,5 @@ export class JobSlideoutComponent {
         }], Saved: [{
             type: Output
         }] }); })();
-(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassDebugInfo(JobSlideoutComponent, { className: "JobSlideoutComponent", filePath: "src/Scheduling/components/job-slideout.component.ts", lineNumber: 10 }); })();
+(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassDebugInfo(JobSlideoutComponent, { className: "JobSlideoutComponent", filePath: "src/scheduling/components/job-slideout.component.ts", lineNumber: 11 }); })();
 //# sourceMappingURL=job-slideout.component.js.map