iptdevs-design-system 3.1.772 → 3.1.773

package/fesm2020/iptdevs-design-system.mjs

@@ -62,33 +62,33 @@ class AsideButtonComponent {
     }
 }
 AsideButtonComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.0.7", ngImport: i0, type: AsideButtonComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-AsideButtonComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.0.7", type: AsideButtonComponent, selector: "ipt-aside-button", inputs: { icon: "icon", text: "text", buttonActive: "buttonActive" }, outputs: { isClicked: "isClicked" }, ngImport: i0, template: `
-    <div [ngSwitch]="buttonActive">
-      <a *ngSwitchCase="0" class="flex-item-menu__link" (click)="clickAction()">
-        <img src="{{ icon }}" alt="icon_url" />
-        <p>{{ text }}</p>
-      </a>
-
-      <a *ngSwitchCase="1" class="flex-item-menu__link flex-item-active" (click)="clickAction()">
-        <img src="{{ icon }}" alt="icon_url" />
-        <p>{{ text }}</p>
-      </a>
-    </div>
+AsideButtonComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.0.7", type: AsideButtonComponent, selector: "ipt-aside-button", inputs: { icon: "icon", text: "text", buttonActive: "buttonActive" }, outputs: { isClicked: "isClicked" }, ngImport: i0, template: `
+    <div [ngSwitch]="buttonActive">
+      <a *ngSwitchCase="0" class="flex-item-menu__link" (click)="clickAction()">
+        <img src="{{ icon }}" alt="icon_url" />
+        <p>{{ text }}</p>
+      </a>
+
+      <a *ngSwitchCase="1" class="flex-item-menu__link flex-item-active" (click)="clickAction()">
+        <img src="{{ icon }}" alt="icon_url" />
+        <p>{{ text }}</p>
+      </a>
+    </div>
   `, isInline: true, styles: ["*{font-family:Poppins,sans-serif}@media (min-width: 320px){.flex-item-menu__link{cursor:pointer;width:-webkit-fill-available;width:-moz-available;text-decoration:none;display:flex;justify-items:center;padding:.4rem 1rem;transition:all .3s ease 0s;border-radius:30px;margin:15px}.flex-item-menu__link img{cursor:pointer;width:1.4rem;height:1.4rem}.flex-item-menu__link p{cursor:pointer;display:inline;font-weight:500;font-family:Poppins,sans-serif;font-size:.8rem;padding:0 .8rem;margin:auto 0;color:#fff}a:hover,a:focus,.flex-item-menu__link:hover,.flex-item-menu__link p:focus{color:#fff;background-color:#ffffff4f;-webkit-backdrop-filter:blur(100px);backdrop-filter:blur(100px);box-shadow:#0006 0 30px 90px;border-radius:50px}.flex-item-img{width:2.5rem;height:2.5rem;padding:.4rem}.flex-item-active{box-shadow:#0006 0 30px 90px;background:transparent;border:1px solid white}}@media (min-width: 1024px){.flex-item-menu__link{padding:.4rem 1rem}.flex-item-menu__link:focus{border:1px solid white}.flex-item-menu__link img{cursor:pointer;width:1.6rem;height:1.6rem}.flex-item-menu__link p{font-size:1rem;color:#fff}a:hover,a:focus,.flex-item-menu__link:hover,.flex-item-menu__link p:focus{color:#fff;background-color:#ffffff4f;-webkit-backdrop-filter:blur(100px);backdrop-filter:blur(100px);box-shadow:#0006 0 30px 90px}.flex-item-img{width:2.5rem;height:2.5rem;padding:.4rem}}\n"], dependencies: [{ kind: "directive", type: i1.NgSwitch, selector: "[ngSwitch]", inputs: ["ngSwitch"] }, { kind: "directive", type: i1.NgSwitchCase, selector: "[ngSwitchCase]", inputs: ["ngSwitchCase"] }] });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.0.7", ngImport: i0, type: AsideButtonComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'ipt-aside-button', template: `
-    <div [ngSwitch]="buttonActive">
-      <a *ngSwitchCase="0" class="flex-item-menu__link" (click)="clickAction()">
-        <img src="{{ icon }}" alt="icon_url" />
-        <p>{{ text }}</p>
-      </a>
-
-      <a *ngSwitchCase="1" class="flex-item-menu__link flex-item-active" (click)="clickAction()">
-        <img src="{{ icon }}" alt="icon_url" />
-        <p>{{ text }}</p>
-      </a>
-    </div>
+            args: [{ selector: 'ipt-aside-button', template: `
+    <div [ngSwitch]="buttonActive">
+      <a *ngSwitchCase="0" class="flex-item-menu__link" (click)="clickAction()">
+        <img src="{{ icon }}" alt="icon_url" />
+        <p>{{ text }}</p>
+      </a>
+
+      <a *ngSwitchCase="1" class="flex-item-menu__link flex-item-active" (click)="clickAction()">
+        <img src="{{ icon }}" alt="icon_url" />
+        <p>{{ text }}</p>
+      </a>
+    </div>
   `, styles: ["*{font-family:Poppins,sans-serif}@media (min-width: 320px){.flex-item-menu__link{cursor:pointer;width:-webkit-fill-available;width:-moz-available;text-decoration:none;display:flex;justify-items:center;padding:.4rem 1rem;transition:all .3s ease 0s;border-radius:30px;margin:15px}.flex-item-menu__link img{cursor:pointer;width:1.4rem;height:1.4rem}.flex-item-menu__link p{cursor:pointer;display:inline;font-weight:500;font-family:Poppins,sans-serif;font-size:.8rem;padding:0 .8rem;margin:auto 0;color:#fff}a:hover,a:focus,.flex-item-menu__link:hover,.flex-item-menu__link p:focus{color:#fff;background-color:#ffffff4f;-webkit-backdrop-filter:blur(100px);backdrop-filter:blur(100px);box-shadow:#0006 0 30px 90px;border-radius:50px}.flex-item-img{width:2.5rem;height:2.5rem;padding:.4rem}.flex-item-active{box-shadow:#0006 0 30px 90px;background:transparent;border:1px solid white}}@media (min-width: 1024px){.flex-item-menu__link{padding:.4rem 1rem}.flex-item-menu__link:focus{border:1px solid white}.flex-item-menu__link img{cursor:pointer;width:1.6rem;height:1.6rem}.flex-item-menu__link p{font-size:1rem;color:#fff}a:hover,a:focus,.flex-item-menu__link:hover,.flex-item-menu__link p:focus{color:#fff;background-color:#ffffff4f;-webkit-backdrop-filter:blur(100px);backdrop-filter:blur(100px);box-shadow:#0006 0 30px 90px}.flex-item-img{width:2.5rem;height:2.5rem;padding:.4rem}}\n"] }]
         }], propDecorators: { icon: [{
                 type: Input
@@ -117,35 +117,35 @@ class ButtonComponent {
     }
 }
 ButtonComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.0.7", ngImport: i0, type: ButtonComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-ButtonComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.0.7", type: ButtonComponent, selector: "ipt-button", inputs: { primary: "primary", size: "size", label: "label", buttonType: "buttonType", isEnabled: "isEnabled" }, outputs: { onClick: "onClick" }, ngImport: i0, template: `<button *ngIf="isEnabled"
-    type="{{ buttonType }}"
-    (click)="onClick.emit($event)"
-    [ngClass]="classes"
-  >
-    {{ label }}
-  </button>
-
-  <button *ngIf="!isEnabled"
-    type="{{ buttonType }}"
-    [ngClass]="classes"
-  >
-    {{ label }}
+ButtonComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.0.7", type: ButtonComponent, selector: "ipt-button", inputs: { primary: "primary", size: "size", label: "label", buttonType: "buttonType", isEnabled: "isEnabled" }, outputs: { onClick: "onClick" }, ngImport: i0, template: `<button *ngIf="isEnabled"
+    type="{{ buttonType }}"
+    (click)="onClick.emit($event)"
+    [ngClass]="classes"
+  >
+    {{ label }}
+  </button>
+
+  <button *ngIf="!isEnabled"
+    type="{{ buttonType }}"
+    [ngClass]="classes"
+  >
+    {{ label }}
   </button>`, isInline: true, styles: [".ipt-button{font-family:Poppins,sans-serif;font-weight:700;border:0;border-radius:4px;cursor:pointer;display:inline-block;line-height:1;transition:.4s;width:100%;box-shadow:#06182c66 0 0,#06182ca6 1px 1px 1px 1px,#ffffff14 0 0 inset}.ipt-button:hover{box-shadow:0 10px 20px #1b1b1b80;transform:translateY(-3px)}.ipt-button:active{transform:scale(.99)}.ipt-button--primary{color:#fff;background-color:#1c77f7}.ipt-button--primary-disabled{color:gray;background-color:#fff;border:1px solid gray;box-shadow:none;cursor:not-allowed}.ipt-button--primary-disabled:hover{box-shadow:none;transform:translateY(0)}.ipt-button--secondary{color:#1c77f7;background-color:#fff;box-shadow:#06182c66 0 0 0 2px,#06182ca6 0 4px 6px -1px,#ffffff14 0 1px inset}.ipt-button--small{font-size:12px;padding:10px 16px}.ipt-button--medium{font-size:14px;padding:11px 20px}.ipt-button--large{font-size:16px;padding:12px 24px}\n"], dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }] });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.0.7", ngImport: i0, type: ButtonComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'ipt-button', template: `<button *ngIf="isEnabled"
-    type="{{ buttonType }}"
-    (click)="onClick.emit($event)"
-    [ngClass]="classes"
-  >
-    {{ label }}
-  </button>
-
-  <button *ngIf="!isEnabled"
-    type="{{ buttonType }}"
-    [ngClass]="classes"
-  >
-    {{ label }}
+            args: [{ selector: 'ipt-button', template: `<button *ngIf="isEnabled"
+    type="{{ buttonType }}"
+    (click)="onClick.emit($event)"
+    [ngClass]="classes"
+  >
+    {{ label }}
+  </button>
+
+  <button *ngIf="!isEnabled"
+    type="{{ buttonType }}"
+    [ngClass]="classes"
+  >
+    {{ label }}
   </button>`, styles: [".ipt-button{font-family:Poppins,sans-serif;font-weight:700;border:0;border-radius:4px;cursor:pointer;display:inline-block;line-height:1;transition:.4s;width:100%;box-shadow:#06182c66 0 0,#06182ca6 1px 1px 1px 1px,#ffffff14 0 0 inset}.ipt-button:hover{box-shadow:0 10px 20px #1b1b1b80;transform:translateY(-3px)}.ipt-button:active{transform:scale(.99)}.ipt-button--primary{color:#fff;background-color:#1c77f7}.ipt-button--primary-disabled{color:gray;background-color:#fff;border:1px solid gray;box-shadow:none;cursor:not-allowed}.ipt-button--primary-disabled:hover{box-shadow:none;transform:translateY(0)}.ipt-button--secondary{color:#1c77f7;background-color:#fff;box-shadow:#06182c66 0 0 0 2px,#06182ca6 0 4px 6px -1px,#ffffff14 0 1px inset}.ipt-button--small{font-size:12px;padding:10px 16px}.ipt-button--medium{font-size:14px;padding:11px 20px}.ipt-button--large{font-size:16px;padding:12px 24px}\n"] }]
         }], propDecorators: { primary: [{
                 type: Input
@@ -173,29 +173,29 @@ class CheckboxComponent {
     }
 }
 CheckboxComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.0.7", ngImport: i0, type: CheckboxComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-CheckboxComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.0.7", type: CheckboxComponent, selector: "ipt-checkbox", inputs: { checkboxOption: "checkboxOption", control: "control" }, outputs: { onChecked: "onChecked" }, ngImport: i0, template: `
-    <label class="cont">
-      <input
-        class="checkbox"
-        [formControl]="formControl"
-        [checked]="checkboxOption"
-        (click)="onChecked.emit($event)"
-        type="checkbox">
-      <span></span>
-    </label>
+CheckboxComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.0.7", type: CheckboxComponent, selector: "ipt-checkbox", inputs: { checkboxOption: "checkboxOption", control: "control" }, outputs: { onChecked: "onChecked" }, ngImport: i0, template: `
+    <label class="cont">
+      <input
+        class="checkbox"
+        [formControl]="formControl"
+        [checked]="checkboxOption"
+        (click)="onChecked.emit($event)"
+        type="checkbox">
+      <span></span>
+    </label>
   `, isInline: true, styles: [".cont{display:flex;align-items:center;transform:scale(1)}@media screen and (min-width: 320px){input[type=checkbox]{height:1rem;width:1.1rem;margin:5px;display:inline-block;-webkit-appearance:none;appearance:none;position:relative;background-color:#1c77f733;border-radius:15%;cursor:pointer;overflow:hidden}input[type=checkbox]:after{content:\"\";display:block;height:.4rem;width:.2rem;border-bottom:.21rem solid white;border-right:.21rem solid white;opacity:0;transform:rotate(45deg) translate(-50%,-50%);position:absolute;top:50%;left:20%;transition:.25s ease}input[type=checkbox]:before{content:\"\";display:block;height:0;width:0;background-color:#1c77f7;border-radius:50%;opacity:.5;transform:translate(-50%,-50%);position:absolute;top:50%;left:50%;transition:.3s ease}input[type=checkbox]:checked:before{height:130%;width:130%;opacity:100%}input[type=checkbox]:checked:after{opacity:100%}span{font-size:1rem}}@media screen and (min-width: 375px){input[type=checkbox]{height:1.2rem;width:1.3rem}input[type=checkbox]:after{height:.5rem;width:.2rem;border-bottom:.21rem solid white;border-right:.21rem solid white}}@media screen and (min-width: 1024px){input[type=checkbox]{height:1.3rem;width:1.4rem}input[type=checkbox]:after{height:.6rem;width:.3rem;border-bottom:.21rem solid white;border-right:.21rem solid white}}\n"], dependencies: [{ kind: "directive", type: i1$1.CheckboxControlValueAccessor, selector: "input[type=checkbox][formControlName],input[type=checkbox][formControl],input[type=checkbox][ngModel]" }, { kind: "directive", type: i1$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$1.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }] });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.0.7", ngImport: i0, type: CheckboxComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'ipt-checkbox', template: `
-    <label class="cont">
-      <input
-        class="checkbox"
-        [formControl]="formControl"
-        [checked]="checkboxOption"
-        (click)="onChecked.emit($event)"
-        type="checkbox">
-      <span></span>
-    </label>
+            args: [{ selector: 'ipt-checkbox', template: `
+    <label class="cont">
+      <input
+        class="checkbox"
+        [formControl]="formControl"
+        [checked]="checkboxOption"
+        (click)="onChecked.emit($event)"
+        type="checkbox">
+      <span></span>
+    </label>
   `, styles: [".cont{display:flex;align-items:center;transform:scale(1)}@media screen and (min-width: 320px){input[type=checkbox]{height:1rem;width:1.1rem;margin:5px;display:inline-block;-webkit-appearance:none;appearance:none;position:relative;background-color:#1c77f733;border-radius:15%;cursor:pointer;overflow:hidden}input[type=checkbox]:after{content:\"\";display:block;height:.4rem;width:.2rem;border-bottom:.21rem solid white;border-right:.21rem solid white;opacity:0;transform:rotate(45deg) translate(-50%,-50%);position:absolute;top:50%;left:20%;transition:.25s ease}input[type=checkbox]:before{content:\"\";display:block;height:0;width:0;background-color:#1c77f7;border-radius:50%;opacity:.5;transform:translate(-50%,-50%);position:absolute;top:50%;left:50%;transition:.3s ease}input[type=checkbox]:checked:before{height:130%;width:130%;opacity:100%}input[type=checkbox]:checked:after{opacity:100%}span{font-size:1rem}}@media screen and (min-width: 375px){input[type=checkbox]{height:1.2rem;width:1.3rem}input[type=checkbox]:after{height:.5rem;width:.2rem;border-bottom:.21rem solid white;border-right:.21rem solid white}}@media screen and (min-width: 1024px){input[type=checkbox]{height:1.3rem;width:1.4rem}input[type=checkbox]:after{height:.6rem;width:.3rem;border-bottom:.21rem solid white;border-right:.21rem solid white}}\n"] }]
         }], propDecorators: { checkboxOption: [{
                 type: Input
@@ -237,47 +237,47 @@ class DatalistComponent {
     }
 }
 DatalistComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.0.7", ngImport: i0, type: DatalistComponent, deps: [{ token: i1$1.FormBuilder }], target: i0.ɵɵFactoryTarget.Component });
-DatalistComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.0.7", type: DatalistComponent, selector: "ipt-datalist", inputs: { datalistId: "datalistId", datalistData: "datalistData", placeHolder: "placeHolder", validateText: "validateText", initalData: "initalData", disabledSel: "disabledSel" }, outputs: { isChanged: "isChanged" }, ngImport: i0, template: `
-    <div class="input-container">
-      <label [ngClass]="labelClass">{{ placeHolder }}</label>
-      <input
-        type="text"
-        class="input"
-        (click)="click($event)"
-        [attr.list]="datalistId"
-        (change)="optionChanged($event)"
-        [disabled]="disabledSel"
-        [value]="setDataListValue()"
-      />
-
-      <datalist id="{{ datalistId }}">
-        <option *ngFor="let item of datalistData; index as i" [value]="item.name">
-          {{item.id_card}} {{item.name}}
-        </option>
-      </datalist>
-    </div>
+DatalistComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.0.7", type: DatalistComponent, selector: "ipt-datalist", inputs: { datalistId: "datalistId", datalistData: "datalistData", placeHolder: "placeHolder", validateText: "validateText", initalData: "initalData", disabledSel: "disabledSel" }, outputs: { isChanged: "isChanged" }, ngImport: i0, template: `
+    <div class="input-container">
+      <label [ngClass]="labelClass">{{ placeHolder }}</label>
+      <input
+        type="text"
+        class="input"
+        (click)="click($event)"
+        [attr.list]="datalistId"
+        (change)="optionChanged($event)"
+        [disabled]="disabledSel"
+        [value]="setDataListValue()"
+      />
+
+      <datalist id="{{ datalistId }}">
+        <option *ngFor="let item of datalistData; index as i" [value]="item.name">
+          {{item.id_card}} {{item.name}}
+        </option>
+      </datalist>
+    </div>
   `, isInline: true, styles: ["*{font-family:Poppins,sans-serif}.input-container{position:relative;margin-top:15px}.input{box-shadow:#64646f33 0 7px 29px;border-radius:3px;border:none;outline:none;display:block;transition:.2s;font-weight:300;width:-webkit-fill-available;width:-moz-available;height:28px;padding-left:8px;background-color:#fff}.input:hover{box-shadow:#00000029 0 3px 6px,#0000003b 0 3px 6px}.input:focus{box-shadow:#00000029 0 3px 6px,#0000003b 0 3px 6px;transition:0s;border:1.5px solid #1c77f7}.label{color:#999;font-size:15px;font-weight:400;position:absolute;pointer-events:none;left:20px;top:7px;transition:.2s ease all;-moz-transition:.2s ease all;-webkit-transition:.2s ease all}.labelUp{color:#1c77f7;font-size:15px;font-weight:400;position:absolute;pointer-events:none;left:9px;top:-20px;transition:.2s ease all;-moz-transition:.2s ease all;-webkit-transition:.2s ease all}\n"], dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1$1.NgSelectOption, selector: "option", inputs: ["ngValue", "value"] }, { kind: "directive", type: i1$1.ɵNgSelectMultipleOption, selector: "option", inputs: ["ngValue", "value"] }] });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.0.7", ngImport: i0, type: DatalistComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'ipt-datalist', template: `
-    <div class="input-container">
-      <label [ngClass]="labelClass">{{ placeHolder }}</label>
-      <input
-        type="text"
-        class="input"
-        (click)="click($event)"
-        [attr.list]="datalistId"
-        (change)="optionChanged($event)"
-        [disabled]="disabledSel"
-        [value]="setDataListValue()"
-      />
-
-      <datalist id="{{ datalistId }}">
-        <option *ngFor="let item of datalistData; index as i" [value]="item.name">
-          {{item.id_card}} {{item.name}}
-        </option>
-      </datalist>
-    </div>
+            args: [{ selector: 'ipt-datalist', template: `
+    <div class="input-container">
+      <label [ngClass]="labelClass">{{ placeHolder }}</label>
+      <input
+        type="text"
+        class="input"
+        (click)="click($event)"
+        [attr.list]="datalistId"
+        (change)="optionChanged($event)"
+        [disabled]="disabledSel"
+        [value]="setDataListValue()"
+      />
+
+      <datalist id="{{ datalistId }}">
+        <option *ngFor="let item of datalistData; index as i" [value]="item.name">
+          {{item.id_card}} {{item.name}}
+        </option>
+      </datalist>
+    </div>
   `, styles: ["*{font-family:Poppins,sans-serif}.input-container{position:relative;margin-top:15px}.input{box-shadow:#64646f33 0 7px 29px;border-radius:3px;border:none;outline:none;display:block;transition:.2s;font-weight:300;width:-webkit-fill-available;width:-moz-available;height:28px;padding-left:8px;background-color:#fff}.input:hover{box-shadow:#00000029 0 3px 6px,#0000003b 0 3px 6px}.input:focus{box-shadow:#00000029 0 3px 6px,#0000003b 0 3px 6px;transition:0s;border:1.5px solid #1c77f7}.label{color:#999;font-size:15px;font-weight:400;position:absolute;pointer-events:none;left:20px;top:7px;transition:.2s ease all;-moz-transition:.2s ease all;-webkit-transition:.2s ease all}.labelUp{color:#1c77f7;font-size:15px;font-weight:400;position:absolute;pointer-events:none;left:9px;top:-20px;transition:.2s ease all;-moz-transition:.2s ease all;-webkit-transition:.2s ease all}\n"] }]
         }], ctorParameters: function () { return [{ type: i1$1.FormBuilder }]; }, propDecorators: { datalistId: [{
                 type: Input
@@ -320,99 +320,99 @@ class InputComponent {
     }
 }
 InputComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.0.7", ngImport: i0, type: InputComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-InputComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.0.7", type: InputComponent, selector: "ipt-input", inputs: { inputType: "inputType", placeHolder: "placeHolder", validateText: "validateText", withPipe: "withPipe", list: "list", iconUrl: "iconUrl", control: "control", prefix: "prefix", thousands: "thousands", decimal: "decimal", disabledSel: "disabledSel" }, outputs: { dateSelected: "dateSelected" }, ngImport: i0, template: `
-    <div class="input-container">
-      <!-- Resto del código... -->
-      <input *ngIf="inputType === 'date'"
-        class="input"
-        type="{{ inputType ? 'text' : 'date' }}"
-        [formControl]="formControl"
-        (ngModelChange)="selectedDate($event)"
-        onfocus="this.type='date';"
-        onblur="javascript: if( !this.value ) this.type='text';"
-        uib-datepicker-popup="dd/MM/yyyy"
-        ng-model="inputType"/>
-
-      <input *ngIf="inputType !== 'date' && inputType !== 'time' && !withPipe"
-        class="input"
-        type="{{ inputType }}"
-        [formControl]="formControl"
-        [attr.list]="list"/>
-
-        <input *ngIf="inputType === 'text' && withPipe"
-          class="input"
-          currencyMask
-          [options]="{ prefix: prefix, thousands: thousands, decimal: decimal, allowNegative: false }"
-          type="{{ inputType }}"
-          [formControl]="formControl"
-          [attr.list]="list"/>
-
-        <input *ngIf="inputType === 'time'"
-          class="input"
-          type="time"
-          [formControl]="formControl"
-          [min]="'06:00:00'"
-          max="22:00:00"
-          step="900"
-          autocomplete="on"
-          value="08:00:00"
-          (click)="click($event)"
-        />
-
-      <label [ngClass]="{'labelUp': formControl.value !== ''}">{{ placeHolder }}</label>
-
-      <p *ngIf="(formControl.invalid && formControl.value !== '')">
-        {{ validateText }}
-      </p>
-    </div>
+InputComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.0.7", type: InputComponent, selector: "ipt-input", inputs: { inputType: "inputType", placeHolder: "placeHolder", validateText: "validateText", withPipe: "withPipe", list: "list", iconUrl: "iconUrl", control: "control", prefix: "prefix", thousands: "thousands", decimal: "decimal", disabledSel: "disabledSel" }, outputs: { dateSelected: "dateSelected" }, ngImport: i0, template: `
+    <div class="input-container">
+      <!-- Resto del código... -->
+      <input *ngIf="inputType === 'date'"
+        class="input"
+        type="{{ inputType ? 'text' : 'date' }}"
+        [formControl]="formControl"
+        (ngModelChange)="selectedDate($event)"
+        onfocus="this.type='date';"
+        onblur="javascript: if( !this.value ) this.type='text';"
+        uib-datepicker-popup="dd/MM/yyyy"
+        ng-model="inputType"/>
+
+      <input *ngIf="inputType !== 'date' && inputType !== 'time' && !withPipe"
+        class="input"
+        type="{{ inputType }}"
+        [formControl]="formControl"
+        [attr.list]="list"/>
+
+        <input *ngIf="inputType === 'text' && withPipe"
+          class="input"
+          currencyMask
+          [options]="{ prefix: prefix, thousands: thousands, decimal: decimal, allowNegative: false }"
+          type="{{ inputType }}"
+          [formControl]="formControl"
+          [attr.list]="list"/>
+
+        <input *ngIf="inputType === 'time'"
+          class="input"
+          type="time"
+          [formControl]="formControl"
+          [min]="'06:00:00'"
+          max="22:00:00"
+          step="900"
+          autocomplete="on"
+          value="08:00:00"
+          (click)="click($event)"
+        />
+
+      <label [ngClass]="{'labelUp': formControl.value !== ''}">{{ placeHolder }}</label>
+
+      <p *ngIf="(formControl.invalid && formControl.value !== '')">
+        {{ validateText }}
+      </p>
+    </div>
     `, isInline: true, styles: ["*{font-family:Poppins,sans-serif}@media screen and (min-width: 320px){p{color:#c73a3a;font-size:12px;padding-left:9px}}@media screen and (min-width: 768px){p{color:#c73a3a;font-size:13px;padding-left:9px}}@media screen and (min-width: 1024px){p{color:#c73a3a;font-size:13px;padding-left:9px}}.input-container{position:relative;margin-top:30px}input{box-shadow:#64646f33 0 7px 29px;border-radius:3px;border:none;outline:none;display:block;transition:.2s;font-weight:300;width:-webkit-fill-available;width:-moz-available;height:28px;padding-left:9px;background-color:#fff;-webkit-appearance:none}input:hover{box-shadow:#00000029 0 3px 6px,#0000003b 0 3px 6px}input:focus{box-shadow:#00000029 0 3px 6px,#0000003b 0 3px 6px;transition:0s;border:1.5px solid #1c77f7}label{color:#999;font-size:15px;font-weight:400;position:absolute;pointer-events:none;left:20px;top:7px;transition:.2s ease all;-moz-transition:.2s ease all;-webkit-transition:.2s ease all}.input:focus~label,.input:invalid~label{top:-20px;font-size:15px;color:#1c77f7}.labelUp{color:#999;font-size:15px;font-weight:400;position:absolute;pointer-events:none;left:9px;top:-20px;transition:.2s ease all;-moz-transition:.2s ease all;-webkit-transition:.2s ease all}\n"], dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1$1.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i1$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$1.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { kind: "directive", type: i3.CurrencyMaskDirective, selector: "[currencyMask]", inputs: ["max", "min", "options"] }] });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.0.7", ngImport: i0, type: InputComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'ipt-input', template: `
-    <div class="input-container">
-      <!-- Resto del código... -->
-      <input *ngIf="inputType === 'date'"
-        class="input"
-        type="{{ inputType ? 'text' : 'date' }}"
-        [formControl]="formControl"
-        (ngModelChange)="selectedDate($event)"
-        onfocus="this.type='date';"
-        onblur="javascript: if( !this.value ) this.type='text';"
-        uib-datepicker-popup="dd/MM/yyyy"
-        ng-model="inputType"/>
-
-      <input *ngIf="inputType !== 'date' && inputType !== 'time' && !withPipe"
-        class="input"
-        type="{{ inputType }}"
-        [formControl]="formControl"
-        [attr.list]="list"/>
-
-        <input *ngIf="inputType === 'text' && withPipe"
-          class="input"
-          currencyMask
-          [options]="{ prefix: prefix, thousands: thousands, decimal: decimal, allowNegative: false }"
-          type="{{ inputType }}"
-          [formControl]="formControl"
-          [attr.list]="list"/>
-
-        <input *ngIf="inputType === 'time'"
-          class="input"
-          type="time"
-          [formControl]="formControl"
-          [min]="'06:00:00'"
-          max="22:00:00"
-          step="900"
-          autocomplete="on"
-          value="08:00:00"
-          (click)="click($event)"
-        />
-
-      <label [ngClass]="{'labelUp': formControl.value !== ''}">{{ placeHolder }}</label>
-
-      <p *ngIf="(formControl.invalid && formControl.value !== '')">
-        {{ validateText }}
-      </p>
-    </div>
+            args: [{ selector: 'ipt-input', template: `
+    <div class="input-container">
+      <!-- Resto del código... -->
+      <input *ngIf="inputType === 'date'"
+        class="input"
+        type="{{ inputType ? 'text' : 'date' }}"
+        [formControl]="formControl"
+        (ngModelChange)="selectedDate($event)"
+        onfocus="this.type='date';"
+        onblur="javascript: if( !this.value ) this.type='text';"
+        uib-datepicker-popup="dd/MM/yyyy"
+        ng-model="inputType"/>
+
+      <input *ngIf="inputType !== 'date' && inputType !== 'time' && !withPipe"
+        class="input"
+        type="{{ inputType }}"
+        [formControl]="formControl"
+        [attr.list]="list"/>
+
+        <input *ngIf="inputType === 'text' && withPipe"
+          class="input"
+          currencyMask
+          [options]="{ prefix: prefix, thousands: thousands, decimal: decimal, allowNegative: false }"
+          type="{{ inputType }}"
+          [formControl]="formControl"
+          [attr.list]="list"/>
+
+        <input *ngIf="inputType === 'time'"
+          class="input"
+          type="time"
+          [formControl]="formControl"
+          [min]="'06:00:00'"
+          max="22:00:00"
+          step="900"
+          autocomplete="on"
+          value="08:00:00"
+          (click)="click($event)"
+        />
+
+      <label [ngClass]="{'labelUp': formControl.value !== ''}">{{ placeHolder }}</label>
+
+      <p *ngIf="(formControl.invalid && formControl.value !== '')">
+        {{ validateText }}
+      </p>
+    </div>
     `, styles: ["*{font-family:Poppins,sans-serif}@media screen and (min-width: 320px){p{color:#c73a3a;font-size:12px;padding-left:9px}}@media screen and (min-width: 768px){p{color:#c73a3a;font-size:13px;padding-left:9px}}@media screen and (min-width: 1024px){p{color:#c73a3a;font-size:13px;padding-left:9px}}.input-container{position:relative;margin-top:30px}input{box-shadow:#64646f33 0 7px 29px;border-radius:3px;border:none;outline:none;display:block;transition:.2s;font-weight:300;width:-webkit-fill-available;width:-moz-available;height:28px;padding-left:9px;background-color:#fff;-webkit-appearance:none}input:hover{box-shadow:#00000029 0 3px 6px,#0000003b 0 3px 6px}input:focus{box-shadow:#00000029 0 3px 6px,#0000003b 0 3px 6px;transition:0s;border:1.5px solid #1c77f7}label{color:#999;font-size:15px;font-weight:400;position:absolute;pointer-events:none;left:20px;top:7px;transition:.2s ease all;-moz-transition:.2s ease all;-webkit-transition:.2s ease all}.input:focus~label,.input:invalid~label{top:-20px;font-size:15px;color:#1c77f7}.labelUp{color:#999;font-size:15px;font-weight:400;position:absolute;pointer-events:none;left:9px;top:-20px;transition:.2s ease all;-moz-transition:.2s ease all;-webkit-transition:.2s ease all}\n"] }]
         }], ctorParameters: function () { return []; }, propDecorators: { inputType: [{
                 type: Input
@@ -449,47 +449,47 @@ class LevelButtonComponent {
     }
 }
 LevelButtonComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.0.7", ngImport: i0, type: LevelButtonComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-LevelButtonComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.0.7", type: LevelButtonComponent, selector: "ipt-level-button", inputs: { level: "level", buttonActive: "buttonActive", idColor: "idColor" }, outputs: { isClicked: "isClicked" }, ngImport: i0, template: `
-    <div [ngSwitch]="buttonActive">
-      <button
-        *ngSwitchCase="0"
-        (click)="clickAction()"
-        id="level"
-        class="courses"
-      >
-      <p class="p-level">{{ level }}</p>
-      </button>
-
-      <button
-        *ngSwitchCase="1"
-        (click)="clickAction()"
-        id="{{ idColor }}"
-        class="courses">
-      <p class="p-level p-level-active">{{ level }}</p>
-      </button>
-    </div>
+LevelButtonComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.0.7", type: LevelButtonComponent, selector: "ipt-level-button", inputs: { level: "level", buttonActive: "buttonActive", idColor: "idColor" }, outputs: { isClicked: "isClicked" }, ngImport: i0, template: `
+    <div [ngSwitch]="buttonActive">
+      <button
+        *ngSwitchCase="0"
+        (click)="clickAction()"
+        id="level"
+        class="courses"
+      >
+      <p class="p-level">{{ level }}</p>
+      </button>
+
+      <button
+        *ngSwitchCase="1"
+        (click)="clickAction()"
+        id="{{ idColor }}"
+        class="courses">
+      <p class="p-level p-level-active">{{ level }}</p>
+      </button>
+    </div>
   `, isInline: true, styles: ["*{font-family:Poppins,sans-serif}@media (min-width: 320px){.courses{cursor:pointer;text-decoration:none;display:flex;border-radius:3px;width:100%;height:30px;box-shadow:#06182c66 0 0 0 2px,#06182ca6 0 4px 6px -1px,#ffffff14 0 1px inset;border:none;outline:none;align-items:center;background-color:transparent;color:#1c77f7}.p-level{display:flex;align-items:center;justify-content:center;font-weight:600;font-size:16px}#level-1{background-color:#02eed8}#level-2{background-color:#61acff}#level-3{background-color:#f168f4}#level-4{background-color:#ff3737}#level-5{background-color:#004dfa}#level-6{background-color:#14c25a}#level-7{background-color:#a052da}#level-8{background-color:#f2583d}#level-9{background-color:#291d26}#level-10{background-color:#1c77f7}.p-level-active{color:#fff}}@media (min-width: 375px){.courses{height:40px}.p-level{font-size:18px}}@media (min-width: 425px){.courses{height:30px}}@media (min-width: 768px){.courses{height:40px}}@media (min-width: 1024px){.courses{transition:.6s}.courses:active{transform:scale(1.05);box-shadow:#06182c66 0 0 0 2px,#06182ca6 0 4px 6px -1px,#ffffff14 0 1px inset}.p-level{font-weight:700}}@media (min-width: 1440px){.p-level{font-weight:600}}\n"], dependencies: [{ kind: "directive", type: i1.NgSwitch, selector: "[ngSwitch]", inputs: ["ngSwitch"] }, { kind: "directive", type: i1.NgSwitchCase, selector: "[ngSwitchCase]", inputs: ["ngSwitchCase"] }] });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.0.7", ngImport: i0, type: LevelButtonComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'ipt-level-button', template: `
-    <div [ngSwitch]="buttonActive">
-      <button
-        *ngSwitchCase="0"
-        (click)="clickAction()"
-        id="level"
-        class="courses"
-      >
-      <p class="p-level">{{ level }}</p>
-      </button>
-
-      <button
-        *ngSwitchCase="1"
-        (click)="clickAction()"
-        id="{{ idColor }}"
-        class="courses">
-      <p class="p-level p-level-active">{{ level }}</p>
-      </button>
-    </div>
+            args: [{ selector: 'ipt-level-button', template: `
+    <div [ngSwitch]="buttonActive">
+      <button
+        *ngSwitchCase="0"
+        (click)="clickAction()"
+        id="level"
+        class="courses"
+      >
+      <p class="p-level">{{ level }}</p>
+      </button>
+
+      <button
+        *ngSwitchCase="1"
+        (click)="clickAction()"
+        id="{{ idColor }}"
+        class="courses">
+      <p class="p-level p-level-active">{{ level }}</p>
+      </button>
+    </div>
   `, styles: ["*{font-family:Poppins,sans-serif}@media (min-width: 320px){.courses{cursor:pointer;text-decoration:none;display:flex;border-radius:3px;width:100%;height:30px;box-shadow:#06182c66 0 0 0 2px,#06182ca6 0 4px 6px -1px,#ffffff14 0 1px inset;border:none;outline:none;align-items:center;background-color:transparent;color:#1c77f7}.p-level{display:flex;align-items:center;justify-content:center;font-weight:600;font-size:16px}#level-1{background-color:#02eed8}#level-2{background-color:#61acff}#level-3{background-color:#f168f4}#level-4{background-color:#ff3737}#level-5{background-color:#004dfa}#level-6{background-color:#14c25a}#level-7{background-color:#a052da}#level-8{background-color:#f2583d}#level-9{background-color:#291d26}#level-10{background-color:#1c77f7}.p-level-active{color:#fff}}@media (min-width: 375px){.courses{height:40px}.p-level{font-size:18px}}@media (min-width: 425px){.courses{height:30px}}@media (min-width: 768px){.courses{height:40px}}@media (min-width: 1024px){.courses{transition:.6s}.courses:active{transform:scale(1.05);box-shadow:#06182c66 0 0 0 2px,#06182ca6 0 4px 6px -1px,#ffffff14 0 1px inset}.p-level{font-weight:700}}@media (min-width: 1440px){.p-level{font-weight:600}}\n"] }]
         }], propDecorators: { level: [{
                 type: Input
@@ -504,13 +504,13 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.0.7", ngImpor
 class LevelTextComponent {
 }
 LevelTextComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.0.7", ngImport: i0, type: LevelTextComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-LevelTextComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.0.7", type: LevelTextComponent, selector: "ipt-level-button", inputs: { level: "level", total: "total" }, ngImport: i0, template: `
-    <p class="p-table-course">{{ level }}: {{ total }}</p>
+LevelTextComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.0.7", type: LevelTextComponent, selector: "ipt-level-button", inputs: { level: "level", total: "total" }, ngImport: i0, template: `
+    <p class="p-table-course">{{ level }}: {{ total }}</p>
   `, isInline: true, styles: ["@media (min-width: 320px){.p-table-course{background-color:#4b4a4a;color:#fff;font-size:14px;font-weight:700;padding:5px;width:100%;text-align:center}}@media (min-width: 375px){.p-table-course{background-color:#4b4a4a;color:#fff;font-size:14px;font-weight:700;padding:5px;width:100%;text-align:center}}@media (min-width: 425px){.p-table-course{font-size:18px}}@media (min-width: 1024px){.p-table-course{font-size:20px}}\n"] });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.0.7", ngImport: i0, type: LevelTextComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'ipt-level-button', template: `
-    <p class="p-table-course">{{ level }}: {{ total }}</p>
+            args: [{ selector: 'ipt-level-button', template: `
+    <p class="p-table-course">{{ level }}: {{ total }}</p>
   `, styles: ["@media (min-width: 320px){.p-table-course{background-color:#4b4a4a;color:#fff;font-size:14px;font-weight:700;padding:5px;width:100%;text-align:center}}@media (min-width: 375px){.p-table-course{background-color:#4b4a4a;color:#fff;font-size:14px;font-weight:700;padding:5px;width:100%;text-align:center}}@media (min-width: 425px){.p-table-course{font-size:18px}}@media (min-width: 1024px){.p-table-course{font-size:20px}}\n"] }]
         }], propDecorators: { level: [{
                 type: Input
@@ -525,37 +525,37 @@ class LoaderComponent {
     }
 }
 LoaderComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.0.7", ngImport: i0, type: LoaderComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-LoaderComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.0.7", type: LoaderComponent, selector: "ipt-loader", inputs: { message: "message", isDialog: "isDialog" }, ngImport: i0, template: `
-  <div [ngClass]="{'dialog': isDialog}">
-    <div [ngClass]="{'loader_container' : isDialog}">
-      <span>{{ message }}</span>
-      <div class="container">
-        <div class="spinner">
-          <div class="dot"></div>
-          <div class="dot"></div>
-          <div class="dot"></div>
-          <div class="dot"></div>
-          <div class="dot"></div>
-        </div>
-      </div>
-    </div>
+LoaderComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.0.7", type: LoaderComponent, selector: "ipt-loader", inputs: { message: "message", isDialog: "isDialog" }, ngImport: i0, template: `
+  <div [ngClass]="{'dialog': isDialog}">
+    <div [ngClass]="{'loader_container' : isDialog}">
+      <span>{{ message }}</span>
+      <div class="container">
+        <div class="spinner">
+          <div class="dot"></div>
+          <div class="dot"></div>
+          <div class="dot"></div>
+          <div class="dot"></div>
+          <div class="dot"></div>
+        </div>
+      </div>
+    </div>
   </div>`, isInline: true, styles: [".dialog{background:rgba(0,0,0,.472);color:#fff;position:fixed;top:0;left:0;height:100vh;width:100vw;transition:all .5s;z-index:9999}.loader_container{height:-moz-fit-content;height:fit-content;width:-moz-fit-content;width:fit-content;position:absolute;inset:0;margin:auto;background-color:#fff;border-radius:3px;padding:1rem;z-index:9999}span{display:flex;justify-content:center;color:#1c77f7;font:bold;margin-bottom:1rem}.container{display:flex;justify-content:center}.spinner{width:60px;height:60px;position:relative}.spinner .dot{position:absolute;inset:0;display:flex;justify-content:center}.spinner .dot:after{content:\"\";width:7px;height:7px;border-radius:50%;background-color:#1c77f7}@keyframes spin{to{transform:rotate(360deg)}}.spinner .dot{animation:spin 2s infinite}.spinner .dot:nth-child(2){animation-delay:.1s}.spinner .dot:nth-child(3){animation-delay:.2s}.spinner .dot:nth-child(4){animation-delay:.3s}.spinner .dot:nth-child(5){animation-delay:.4s}\n"], dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }] });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.0.7", ngImport: i0, type: LoaderComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'ipt-loader', template: `
-  <div [ngClass]="{'dialog': isDialog}">
-    <div [ngClass]="{'loader_container' : isDialog}">
-      <span>{{ message }}</span>
-      <div class="container">
-        <div class="spinner">
-          <div class="dot"></div>
-          <div class="dot"></div>
-          <div class="dot"></div>
-          <div class="dot"></div>
-          <div class="dot"></div>
-        </div>
-      </div>
-    </div>
+            args: [{ selector: 'ipt-loader', template: `
+  <div [ngClass]="{'dialog': isDialog}">
+    <div [ngClass]="{'loader_container' : isDialog}">
+      <span>{{ message }}</span>
+      <div class="container">
+        <div class="spinner">
+          <div class="dot"></div>
+          <div class="dot"></div>
+          <div class="dot"></div>
+          <div class="dot"></div>
+          <div class="dot"></div>
+        </div>
+      </div>
+    </div>
   </div>`, styles: [".dialog{background:rgba(0,0,0,.472);color:#fff;position:fixed;top:0;left:0;height:100vh;width:100vw;transition:all .5s;z-index:9999}.loader_container{height:-moz-fit-content;height:fit-content;width:-moz-fit-content;width:fit-content;position:absolute;inset:0;margin:auto;background-color:#fff;border-radius:3px;padding:1rem;z-index:9999}span{display:flex;justify-content:center;color:#1c77f7;font:bold;margin-bottom:1rem}.container{display:flex;justify-content:center}.spinner{width:60px;height:60px;position:relative}.spinner .dot{position:absolute;inset:0;display:flex;justify-content:center}.spinner .dot:after{content:\"\";width:7px;height:7px;border-radius:50%;background-color:#1c77f7}@keyframes spin{to{transform:rotate(360deg)}}.spinner .dot{animation:spin 2s infinite}.spinner .dot:nth-child(2){animation-delay:.1s}.spinner .dot:nth-child(3){animation-delay:.2s}.spinner .dot:nth-child(4){animation-delay:.3s}.spinner .dot:nth-child(5){animation-delay:.4s}\n"] }]
         }], propDecorators: { message: [{
                 type: Input
@@ -575,29 +575,29 @@ class RadioComponent {
     }
 }
 RadioComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.0.7", ngImport: i0, type: RadioComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-RadioComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.0.7", type: RadioComponent, selector: "ipt-radio", inputs: { radioOption: "radioOption", control: "control" }, outputs: { onSelected: "onSelected" }, ngImport: i0, template: `
-    <label class="cont">
-      <input
-        class="radio"
-        [formControl]="formControl"
-        [checked]="radioOption"
-        (click)="onSelected.emit($event)"
-        type="radio">
-      <span></span>
-    </label>
+RadioComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.0.7", type: RadioComponent, selector: "ipt-radio", inputs: { radioOption: "radioOption", control: "control" }, outputs: { onSelected: "onSelected" }, ngImport: i0, template: `
+    <label class="cont">
+      <input
+        class="radio"
+        [formControl]="formControl"
+        [checked]="radioOption"
+        (click)="onSelected.emit($event)"
+        type="radio">
+      <span></span>
+    </label>
   `, isInline: true, styles: [""], dependencies: [{ kind: "directive", type: i1$1.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i1$1.RadioControlValueAccessor, selector: "input[type=radio][formControlName],input[type=radio][formControl],input[type=radio][ngModel]", inputs: ["name", "formControlName", "value"] }, { kind: "directive", type: i1$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$1.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }] });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.0.7", ngImport: i0, type: RadioComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'ipt-radio', template: `
-    <label class="cont">
-      <input
-        class="radio"
-        [formControl]="formControl"
-        [checked]="radioOption"
-        (click)="onSelected.emit($event)"
-        type="radio">
-      <span></span>
-    </label>
+            args: [{ selector: 'ipt-radio', template: `
+    <label class="cont">
+      <input
+        class="radio"
+        [formControl]="formControl"
+        [checked]="radioOption"
+        (click)="onSelected.emit($event)"
+        type="radio">
+      <span></span>
+    </label>
   ` }]
         }], propDecorators: { radioOption: [{
                 type: Input
@@ -655,37 +655,37 @@ class SelectComponent {
     }
 }
 SelectComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.0.7", ngImport: i0, type: SelectComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-SelectComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.0.7", type: SelectComponent, selector: "ipt-select", inputs: { isRequired: "isRequired", data: "data", defaultText: "defaultText", selectCode: "selectCode", disabledSel: "disabledSel", initialValue: "initialValue", control: "control" }, outputs: { eventSelect: "eventSelect" }, usesOnChanges: true, ngImport: i0, template: `
-    <div class="select-container">
-      <label [ngClass]="labelClass">{{ defaultText }}</label>
-      <select
-        [(ngModel)]="binding"
-        (ngModelChange)="seleccionar($event)"
-        (click)="click($event)"
-        [ngClass]="textClass"
-        [disabled]="disabledSel">
-        <option *ngFor="let item of data; index as i" [value]="item.code">
-          {{ item.name }} {{ item.prefix }}
-        </option>
-      </select>
-    </div>
+SelectComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.0.7", type: SelectComponent, selector: "ipt-select", inputs: { isRequired: "isRequired", data: "data", defaultText: "defaultText", selectCode: "selectCode", disabledSel: "disabledSel", initialValue: "initialValue", control: "control" }, outputs: { eventSelect: "eventSelect" }, usesOnChanges: true, ngImport: i0, template: `
+    <div class="select-container">
+      <label [ngClass]="labelClass">{{ defaultText }}</label>
+      <select
+        [(ngModel)]="binding"
+        (ngModelChange)="seleccionar($event)"
+        (click)="click($event)"
+        [ngClass]="textClass"
+        [disabled]="disabledSel">
+        <option *ngFor="let item of data; index as i" [value]="item.code">
+          {{ item.name }} {{ item.prefix }}
+        </option>
+      </select>
+    </div>
   `, isInline: true, styles: ["*{font-family:Poppins,sans-serif}.select-container{position:relative;margin-top:30px}.select{box-shadow:#64646f33 0 7px 29px;border-radius:3px;border:none;outline:none;display:block;transition:.2s;font-weight:300;width:-webkit-fill-available;width:-moz-available;height:28px;padding-left:9px;background-color:#fff;-webkit-appearance:none}.selected{box-shadow:#64646f33 0 7px 29px;border-radius:3px;border:none;outline:none;transition:.5s;font-weight:300;width:-webkit-fill-available;width:-moz-available;height:28px;background-color:#fff;padding-left:10px}select:hover{box-shadow:#00000029 0 3px 6px,#0000003b 0 3px 6px}.select:focus{box-shadow:#00000029 0 3px 6px,#0000003b 0 3px 6px;transition:0s;border:1.5px solid #1c77f7}.label{color:#999;font-size:15px;font-weight:400;position:absolute;pointer-events:none;left:9px;top:7px;transition:.2s ease all;-moz-transition:.2s ease all;-webkit-transition:.2s ease all}.labelUp{color:#1c77f7;font-size:15px;font-weight:400;position:absolute;pointer-events:none;left:9px;top:-20px;transition:.2s ease all;-moz-transition:.2s ease all;-webkit-transition:.2s ease all}\n"], dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1$1.NgSelectOption, selector: "option", inputs: ["ngValue", "value"] }, { kind: "directive", type: i1$1.ɵNgSelectMultipleOption, selector: "option", inputs: ["ngValue", "value"] }, { kind: "directive", type: i1$1.SelectControlValueAccessor, selector: "select:not([multiple])[formControlName],select:not([multiple])[formControl],select:not([multiple])[ngModel]", inputs: ["compareWith"] }, { kind: "directive", type: i1$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$1.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }] });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.0.7", ngImport: i0, type: SelectComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'ipt-select', template: `
-    <div class="select-container">
-      <label [ngClass]="labelClass">{{ defaultText }}</label>
-      <select
-        [(ngModel)]="binding"
-        (ngModelChange)="seleccionar($event)"
-        (click)="click($event)"
-        [ngClass]="textClass"
-        [disabled]="disabledSel">
-        <option *ngFor="let item of data; index as i" [value]="item.code">
-          {{ item.name }} {{ item.prefix }}
-        </option>
-      </select>
-    </div>
+            args: [{ selector: 'ipt-select', template: `
+    <div class="select-container">
+      <label [ngClass]="labelClass">{{ defaultText }}</label>
+      <select
+        [(ngModel)]="binding"
+        (ngModelChange)="seleccionar($event)"
+        (click)="click($event)"
+        [ngClass]="textClass"
+        [disabled]="disabledSel">
+        <option *ngFor="let item of data; index as i" [value]="item.code">
+          {{ item.name }} {{ item.prefix }}
+        </option>
+      </select>
+    </div>
   `, styles: ["*{font-family:Poppins,sans-serif}.select-container{position:relative;margin-top:30px}.select{box-shadow:#64646f33 0 7px 29px;border-radius:3px;border:none;outline:none;display:block;transition:.2s;font-weight:300;width:-webkit-fill-available;width:-moz-available;height:28px;padding-left:9px;background-color:#fff;-webkit-appearance:none}.selected{box-shadow:#64646f33 0 7px 29px;border-radius:3px;border:none;outline:none;transition:.5s;font-weight:300;width:-webkit-fill-available;width:-moz-available;height:28px;background-color:#fff;padding-left:10px}select:hover{box-shadow:#00000029 0 3px 6px,#0000003b 0 3px 6px}.select:focus{box-shadow:#00000029 0 3px 6px,#0000003b 0 3px 6px;transition:0s;border:1.5px solid #1c77f7}.label{color:#999;font-size:15px;font-weight:400;position:absolute;pointer-events:none;left:9px;top:7px;transition:.2s ease all;-moz-transition:.2s ease all;-webkit-transition:.2s ease all}.labelUp{color:#1c77f7;font-size:15px;font-weight:400;position:absolute;pointer-events:none;left:9px;top:-20px;transition:.2s ease all;-moz-transition:.2s ease all;-webkit-transition:.2s ease all}\n"] }]
         }], propDecorators: { isRequired: [{
                 type: Input
@@ -714,23 +714,23 @@ class TextLinkComponent {
     }
 }
 TextLinkComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.0.7", ngImport: i0, type: TextLinkComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-TextLinkComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.0.7", type: TextLinkComponent, selector: "ipt-text-link", inputs: { text: "text", blank: "blank", icon: "icon" }, outputs: { isClicked: "isClicked" }, ngImport: i0, template: `
-    <a class="text-link" (click)='isLinkClicked()'>
-      <p class="text-link__paragraph">
-        <i class="{{icon}}" aria-hidden="true"></i>
-        {{text}}
-      </p>
-    </a>
+TextLinkComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.0.7", type: TextLinkComponent, selector: "ipt-text-link", inputs: { text: "text", blank: "blank", icon: "icon" }, outputs: { isClicked: "isClicked" }, ngImport: i0, template: `
+    <a class="text-link" (click)='isLinkClicked()'>
+      <p class="text-link__paragraph">
+        <i class="{{icon}}" aria-hidden="true"></i>
+        {{text}}
+      </p>
+    </a>
   `, isInline: true, styles: [".text-link{font-family:Poppins,sans-serif;font-size:1.1rem;color:gray;display:flex;flex-direction:row}.text-link__image{height:1rem;background-position:center;fill:#0ff}.text-link__paragraph{margin:0;text-align:end}a:hover,a:focus,.text-link:hover,.text-link:focus{color:#1c77f7;cursor:pointer}@media (max-width: 1200px){.text-link{font-size:.9rem;width:160px}}@media (max-width: 450px){.text-link{font-size:.9rem;width:150px}}\n"] });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.0.7", ngImport: i0, type: TextLinkComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'ipt-text-link', template: `
-    <a class="text-link" (click)='isLinkClicked()'>
-      <p class="text-link__paragraph">
-        <i class="{{icon}}" aria-hidden="true"></i>
-        {{text}}
-      </p>
-    </a>
+            args: [{ selector: 'ipt-text-link', template: `
+    <a class="text-link" (click)='isLinkClicked()'>
+      <p class="text-link__paragraph">
+        <i class="{{icon}}" aria-hidden="true"></i>
+        {{text}}
+      </p>
+    </a>
   `, styles: [".text-link{font-family:Poppins,sans-serif;font-size:1.1rem;color:gray;display:flex;flex-direction:row}.text-link__image{height:1rem;background-position:center;fill:#0ff}.text-link__paragraph{margin:0;text-align:end}a:hover,a:focus,.text-link:hover,.text-link:focus{color:#1c77f7;cursor:pointer}@media (max-width: 1200px){.text-link{font-size:.9rem;width:160px}}@media (max-width: 450px){.text-link{font-size:.9rem;width:150px}}\n"] }]
         }], ctorParameters: function () { return []; }, propDecorators: { text: [{
                 type: Input
@@ -1292,71 +1292,71 @@ class LoginFormComponent {
     }
 }
 LoginFormComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.0.7", ngImport: i0, type: LoginFormComponent, deps: [{ token: i1$1.FormBuilder }, { token: BaseService }], target: i0.ɵɵFactoryTarget.Component });
-LoginFormComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.0.7", type: LoginFormComponent, selector: "ipt-login-form", outputs: { isLogged: "isLogged" }, ngImport: i0, template: `
-    <div class="form-container">
-
-      <h2 style="text-align: center;">IPT PLATFORM</h2>
-      <hr>
-
-      <form (ngSubmit)="login(loginForm)" [formGroup]="loginForm">
-        <ipt-input
-          [inputType]="'text'"
-          [placeHolder]="'Email'"
-          [validateText]="'Debe ser @inglesparatodos.edu.co'"
-          [control]="loginForm.controls['email']"
-        ></ipt-input>
-
-        <ipt-input
-          [inputType]="'password'"
-          [placeHolder]="'Password'"
-          [control]="loginForm.controls['password']"
-        ></ipt-input>
-      </form>
-
-      <div class="button-container">
-        <ipt-button
-          [label]="'Login'"
-          [primary]="true"
-          [isEnabled]="loginForm.valid"
-          (onClick)="login(loginForm)"
-        ></ipt-button>
-      </div>
-
-    </div>
+LoginFormComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.0.7", type: LoginFormComponent, selector: "ipt-login-form", outputs: { isLogged: "isLogged" }, ngImport: i0, template: `
+    <div class="form-container">
+
+      <h2 style="text-align: center;">IPT PLATFORM</h2>
+      <hr>
+
+      <form (ngSubmit)="login(loginForm)" [formGroup]="loginForm">
+        <ipt-input
+          [inputType]="'text'"
+          [placeHolder]="'Email'"
+          [validateText]="'Debe ser @inglesparatodos.edu.co'"
+          [control]="loginForm.controls['email']"
+        ></ipt-input>
+
+        <ipt-input
+          [inputType]="'password'"
+          [placeHolder]="'Password'"
+          [control]="loginForm.controls['password']"
+        ></ipt-input>
+      </form>
+
+      <div class="button-container">
+        <ipt-button
+          [label]="'Login'"
+          [primary]="true"
+          [isEnabled]="loginForm.valid"
+          (onClick)="login(loginForm)"
+        ></ipt-button>
+      </div>
+
+    </div>
   `, isInline: true, styles: [".form-container{display:grid;grid-template-columns:1fr;justify-items:center;width:350px}.with-background{background-color:#fff;border-radius:25px;box-shadow:#32325d40 0 50px 100px -20px,#0000004d 0 30px 60px -30px}h2{color:#1c77f7}hr{width:80%}form{margin-bottom:60px;display:grid;grid-template-columns:1fr;gap:30px;width:100%}.button-container{margin-bottom:70px;align-items:center;display:flex;gap:50px}footer{background-color:#1c77f7;border-top-left-radius:25px;border-top-right-radius:25px;width:100%;height:100px;display:flex;align-items:center;justify-content:center}\n"], dependencies: [{ kind: "directive", type: i1$1.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i1$1.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i1$1.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "component", type: ButtonComponent, selector: "ipt-button", inputs: ["primary", "size", "label", "buttonType", "isEnabled"], outputs: ["onClick"] }, { kind: "component", type: InputComponent, selector: "ipt-input", inputs: ["inputType", "placeHolder", "validateText", "withPipe", "list", "iconUrl", "control", "prefix", "thousands", "decimal", "disabledSel"], outputs: ["dateSelected"] }] });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.0.7", ngImport: i0, type: LoginFormComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'ipt-login-form', template: `
-    <div class="form-container">
-
-      <h2 style="text-align: center;">IPT PLATFORM</h2>
-      <hr>
-
-      <form (ngSubmit)="login(loginForm)" [formGroup]="loginForm">
-        <ipt-input
-          [inputType]="'text'"
-          [placeHolder]="'Email'"
-          [validateText]="'Debe ser @inglesparatodos.edu.co'"
-          [control]="loginForm.controls['email']"
-        ></ipt-input>
-
-        <ipt-input
-          [inputType]="'password'"
-          [placeHolder]="'Password'"
-          [control]="loginForm.controls['password']"
-        ></ipt-input>
-      </form>
-
-      <div class="button-container">
-        <ipt-button
-          [label]="'Login'"
-          [primary]="true"
-          [isEnabled]="loginForm.valid"
-          (onClick)="login(loginForm)"
-        ></ipt-button>
-      </div>
-
-    </div>
+            args: [{ selector: 'ipt-login-form', template: `
+    <div class="form-container">
+
+      <h2 style="text-align: center;">IPT PLATFORM</h2>
+      <hr>
+
+      <form (ngSubmit)="login(loginForm)" [formGroup]="loginForm">
+        <ipt-input
+          [inputType]="'text'"
+          [placeHolder]="'Email'"
+          [validateText]="'Debe ser @inglesparatodos.edu.co'"
+          [control]="loginForm.controls['email']"
+        ></ipt-input>
+
+        <ipt-input
+          [inputType]="'password'"
+          [placeHolder]="'Password'"
+          [control]="loginForm.controls['password']"
+        ></ipt-input>
+      </form>
+
+      <div class="button-container">
+        <ipt-button
+          [label]="'Login'"
+          [primary]="true"
+          [isEnabled]="loginForm.valid"
+          (onClick)="login(loginForm)"
+        ></ipt-button>
+      </div>
+
+    </div>
   `, styles: [".form-container{display:grid;grid-template-columns:1fr;justify-items:center;width:350px}.with-background{background-color:#fff;border-radius:25px;box-shadow:#32325d40 0 50px 100px -20px,#0000004d 0 30px 60px -30px}h2{color:#1c77f7}hr{width:80%}form{margin-bottom:60px;display:grid;grid-template-columns:1fr;gap:30px;width:100%}.button-container{margin-bottom:70px;align-items:center;display:flex;gap:50px}footer{background-color:#1c77f7;border-top-left-radius:25px;border-top-right-radius:25px;width:100%;height:100px;display:flex;align-items:center;justify-content:center}\n"] }]
         }], ctorParameters: function () { return [{ type: i1$1.FormBuilder }, { type: BaseService }]; }, propDecorators: { isLogged: [{
                 type: Output
@@ -1759,7 +1759,7 @@ class CreateUserFormComponent {
     }
 }
 CreateUserFormComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.0.7", ngImport: i0, type: CreateUserFormComponent, deps: [{ token: i1$1.FormBuilder }, { token: ParameterService }, { token: UserService }], target: i0.ɵɵFactoryTarget.Component });
-CreateUserFormComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.0.7", type: CreateUserFormComponent, selector: "ipt-create-user-form", inputs: { userType: "userType", visibility: "visibility" }, outputs: { userCreated: "userCreated", onHide: "onHide" }, ngImport: i0, template: "<main *ngIf=\"visibility\">\r\n  <div @fade class=\"modal_container\">\r\n    <div class=\"header_modal\">\r\n      <h1>Crear usuario de {{ userType | titlecase}}</h1>\r\n      <button (click)=\"closeModal()\">x</button>\r\n    </div>\r\n    <div class=\"grid_container\">\r\n      <div>\r\n        <form autocomplete=\"off\" [formGroup]=\"createUserForm\">\r\n          <ipt-input\r\n            [inputType]=\"'text'\"\r\n            [placeHolder]=\"'Nombres'\"\r\n            [control]=\"createUserForm.controls['name']\"\r\n            [validateText]=\"'Debe ingresar el nombre'\"\r\n          ></ipt-input>\r\n          <ipt-input\r\n            [inputType]=\"'text'\"\r\n            [placeHolder]=\"'Apellidos'\"\r\n            [control]=\"createUserForm.controls['last_name']\"\r\n            [validateText]=\"'Debe ingresar los apellidos'\"\r\n          ></ipt-input>\r\n          <ipt-input\r\n            [inputType]=\"'text'\"\r\n            [placeHolder]=\"'Email'\"\r\n            [control]=\"createUserForm.controls['email']\"\r\n            [validateText]=\"'Debe tener dominio @inglesparatodos.edu.co'\"\r\n          ></ipt-input>\r\n          <ipt-select\r\n            [isRequired]=\"true\"\r\n            [defaultText]=\"'Rol'\"\r\n            (eventSelect)=\"selectRol($event)\"\r\n            [data]=\"getRolesOptions()\"\r\n          ></ipt-select>\r\n          <ipt-select\r\n            [isRequired]=\"true\"\r\n            [data]=\"phoneNumberIndicatives\"\r\n            (eventSelect)=\"selectIndicatives($event)\"\r\n            [defaultText]=\"'Indicativo'\"\r\n          ></ipt-select>\r\n          <ipt-input\r\n            [inputType]=\"'number'\"\r\n            [placeHolder]=\"'Tel\u00E9fono'\"\r\n            [control]=\"createUserForm.controls['phone_number']\"\r\n            [validateText]=\"'Debe ingresar un n\u00FAmero de tel\u00E9fono v\u00E1lido'\"\r\n          ></ipt-input>\r\n          <ipt-select\r\n            [isRequired]=\"true\"\r\n            [data]=\"idTypes\"\r\n            (eventSelect)=\"selectIdType($event)\"\r\n            [defaultText]=\"'Tipo de documento'\"\r\n          ></ipt-select>\r\n          <ipt-input\r\n            [inputType]=\"'number'\"\r\n            [placeHolder]=\"'Documento'\"\r\n            [control]=\"createUserForm.controls['id_card']\"\r\n            [validateText]=\"'Debe ingresar el n\u00FAmero de documento'\"\r\n          ></ipt-input>\r\n          <ipt-select\r\n            [isRequired]=\"true\"\r\n            (eventSelect)=\"selectState($event)\"\r\n            [data]=\"states\"\r\n            [defaultText]=\"'Departamento'\"\r\n          ></ipt-select>\r\n          <ipt-select\r\n            [isRequired]=\"true\"\r\n            (eventSelect)=\"selectCity($event)\"\r\n            [data]=\"cities\"\r\n            [defaultText]=\"'Ciudad'\"\r\n          ></ipt-select>\r\n          <ipt-input *ngIf=\"!(userType === 'student')\"\r\n            [inputType]=\"'number'\"\r\n            [placeHolder]=\"'Horas de servicio'\"\r\n            [control]=\"createUserForm.controls['service_hour']\"\r\n            [validateText]=\"'Debe ingresar las horas de servicio'\"\r\n          ></ipt-input>\r\n          <ipt-input\r\n            [inputType]=\"'password'\"\r\n            [placeHolder]=\"'Contrase\u00F1a'\"\r\n            [control]=\"createUserForm.controls['password']\"\r\n          >\r\n          </ipt-input>\r\n          <ipt-input\r\n            [inputType]=\"'password'\"\r\n            [placeHolder]=\"'Repetir contrase\u00F1a'\"\r\n            [control]=\"createUserForm.controls['re_password']\"\r\n          >\r\n          </ipt-input>\r\n        </form>\r\n\r\n        <div class=\"buttons-container\">\r\n          <ipt-button\r\n            [label]=\"'Crear usuario'\"\r\n            [isEnabled]=\"\r\n              !loader &&\r\n              createUserForm.value['re_password'] ===\r\n              createUserForm.value['password']\r\n            \"\r\n            (onClick)=\"createUser()\"\r\n            [primary]=\"true\"\r\n          >\r\n          </ipt-button>\r\n        </div>\r\n      </div>\r\n      <div [ngStyle]=\"{'background-image': 'url(' + photo + ')'}\" class=\"user_type_image\"></div>\r\n    </div>\r\n  </div>\r\n</main>\r\n", styles: ["@media screen and (min-width: 320px){main{background:rgba(0,0,0,.472);color:#fff;position:fixed;top:0;left:0;height:100vh;width:100vw;transition:all .5s}main .modal_container{width:60%;height:-moz-fit-content;height:fit-content;position:absolute;inset:0;margin:auto;background-color:#fff;border-radius:3px}.header_modal{display:flex;padding:15px 15px 0;gap:1rem;align-items:center}.header_modal h1{padding:.5rem;background-color:#1c77f7;color:#fff;width:100%;border-radius:10px;font-size:1.25rem;font-weight:700}.header_modal button{margin-left:auto;font-size:26px;padding:1.2rem;font-weight:200;color:#6c7f7d;display:flex;width:25px;height:25px;align-items:center;justify-content:center;transition:50ms;background-color:transparent;border:none}.header_modal button:hover{cursor:pointer;border-radius:50%;background-color:#d4d4d4}.grid_container{display:grid;grid-template-columns:1fr;padding:0 15px}form{display:grid;grid-template-columns:1fr;gap:.25rem;justify-content:center;padding:0 1rem}.buttons-container{margin-top:2rem;margin-bottom:2rem;display:flex;justify-content:center;align-items:center;justify-items:center;align-content:center}.user_type_image{display:none}}@media screen and (min-width: 768px){form{display:grid;grid-template-columns:1fr 1fr;gap:1rem;justify-content:center}}@media screen and (min-width: 1366px){form{padding:0rem}.grid_container{display:grid;grid-template-columns:1fr 250px;gap:1rem}.user_type_image{display:flex;background-size:cover;background-repeat:no-repeat;background-position:center;height:100%;border-radius:1rem;padding:1rem}}\n"], dependencies: [{ kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }, { kind: "directive", type: i1$1.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i1$1.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i1$1.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "component", type: ButtonComponent, selector: "ipt-button", inputs: ["primary", "size", "label", "buttonType", "isEnabled"], outputs: ["onClick"] }, { kind: "component", type: InputComponent, selector: "ipt-input", inputs: ["inputType", "placeHolder", "validateText", "withPipe", "list", "iconUrl", "control", "prefix", "thousands", "decimal", "disabledSel"], outputs: ["dateSelected"] }, { kind: "component", type: SelectComponent, selector: "ipt-select", inputs: ["isRequired", "data", "defaultText", "selectCode", "disabledSel", "initialValue", "control"], outputs: ["eventSelect"] }, { kind: "pipe", type: i1.TitleCasePipe, name: "titlecase" }], animations: [
+CreateUserFormComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.0.7", type: CreateUserFormComponent, selector: "ipt-create-user-form", inputs: { userType: "userType", visibility: "visibility" }, outputs: { userCreated: "userCreated", onHide: "onHide" }, ngImport: i0, template: "<main *ngIf=\"visibility\">\n  <div @fade class=\"modal_container\">\n    <div class=\"header_modal\">\n      <h1>Crear usuario de {{ userType | titlecase}}</h1>\n      <button (click)=\"closeModal()\">x</button>\n    </div>\n    <div class=\"grid_container\">\n      <div>\n        <form autocomplete=\"off\" [formGroup]=\"createUserForm\">\n          <ipt-input\n            [inputType]=\"'text'\"\n            [placeHolder]=\"'Nombres'\"\n            [control]=\"createUserForm.controls['name']\"\n            [validateText]=\"'Debe ingresar el nombre'\"\n          ></ipt-input>\n          <ipt-input\n            [inputType]=\"'text'\"\n            [placeHolder]=\"'Apellidos'\"\n            [control]=\"createUserForm.controls['last_name']\"\n            [validateText]=\"'Debe ingresar los apellidos'\"\n          ></ipt-input>\n          <ipt-input\n            [inputType]=\"'text'\"\n            [placeHolder]=\"'Email'\"\n            [control]=\"createUserForm.controls['email']\"\n            [validateText]=\"'Debe tener dominio @inglesparatodos.edu.co'\"\n          ></ipt-input>\n          <ipt-select\n            [isRequired]=\"true\"\n            [defaultText]=\"'Rol'\"\n            (eventSelect)=\"selectRol($event)\"\n            [data]=\"getRolesOptions()\"\n          ></ipt-select>\n          <ipt-select\n            [isRequired]=\"true\"\n            [data]=\"phoneNumberIndicatives\"\n            (eventSelect)=\"selectIndicatives($event)\"\n            [defaultText]=\"'Indicativo'\"\n          ></ipt-select>\n          <ipt-input\n            [inputType]=\"'number'\"\n            [placeHolder]=\"'Tel\u00E9fono'\"\n            [control]=\"createUserForm.controls['phone_number']\"\n            [validateText]=\"'Debe ingresar un n\u00FAmero de tel\u00E9fono v\u00E1lido'\"\n          ></ipt-input>\n          <ipt-select\n            [isRequired]=\"true\"\n            [data]=\"idTypes\"\n            (eventSelect)=\"selectIdType($event)\"\n            [defaultText]=\"'Tipo de documento'\"\n          ></ipt-select>\n          <ipt-input\n            [inputType]=\"'number'\"\n            [placeHolder]=\"'Documento'\"\n            [control]=\"createUserForm.controls['id_card']\"\n            [validateText]=\"'Debe ingresar el n\u00FAmero de documento'\"\n          ></ipt-input>\n          <ipt-select\n            [isRequired]=\"true\"\n            (eventSelect)=\"selectState($event)\"\n            [data]=\"states\"\n            [defaultText]=\"'Departamento'\"\n          ></ipt-select>\n          <ipt-select\n            [isRequired]=\"true\"\n            (eventSelect)=\"selectCity($event)\"\n            [data]=\"cities\"\n            [defaultText]=\"'Ciudad'\"\n          ></ipt-select>\n          <ipt-input *ngIf=\"!(userType === 'student')\"\n            [inputType]=\"'number'\"\n            [placeHolder]=\"'Horas de servicio'\"\n            [control]=\"createUserForm.controls['service_hour']\"\n            [validateText]=\"'Debe ingresar las horas de servicio'\"\n          ></ipt-input>\n          <ipt-input\n            [inputType]=\"'password'\"\n            [placeHolder]=\"'Contrase\u00F1a'\"\n            [control]=\"createUserForm.controls['password']\"\n          >\n          </ipt-input>\n          <ipt-input\n            [inputType]=\"'password'\"\n            [placeHolder]=\"'Repetir contrase\u00F1a'\"\n            [control]=\"createUserForm.controls['re_password']\"\n          >\n          </ipt-input>\n        </form>\n\n        <div class=\"buttons-container\">\n          <ipt-button\n            [label]=\"'Crear usuario'\"\n            [isEnabled]=\"\n              !loader &&\n              createUserForm.value['re_password'] ===\n              createUserForm.value['password']\n            \"\n            (onClick)=\"createUser()\"\n            [primary]=\"true\"\n          >\n          </ipt-button>\n        </div>\n      </div>\n      <div [ngStyle]=\"{'background-image': 'url(' + photo + ')'}\" class=\"user_type_image\"></div>\n    </div>\n  </div>\n</main>\n", styles: ["@media screen and (min-width: 320px){main{background:rgba(0,0,0,.472);color:#fff;position:fixed;top:0;left:0;height:100vh;width:100vw;transition:all .5s}main .modal_container{width:60%;height:-moz-fit-content;height:fit-content;position:absolute;inset:0;margin:auto;background-color:#fff;border-radius:3px}.header_modal{display:flex;padding:15px 15px 0;gap:1rem;align-items:center}.header_modal h1{padding:.5rem;background-color:#1c77f7;color:#fff;width:100%;border-radius:10px;font-size:1.25rem;font-weight:700}.header_modal button{margin-left:auto;font-size:26px;padding:1.2rem;font-weight:200;color:#6c7f7d;display:flex;width:25px;height:25px;align-items:center;justify-content:center;transition:50ms;background-color:transparent;border:none}.header_modal button:hover{cursor:pointer;border-radius:50%;background-color:#d4d4d4}.grid_container{display:grid;grid-template-columns:1fr;padding:0 15px}form{display:grid;grid-template-columns:1fr;gap:.25rem;justify-content:center;padding:0 1rem}.buttons-container{margin-top:2rem;margin-bottom:2rem;display:flex;justify-content:center;align-items:center;justify-items:center;align-content:center}.user_type_image{display:none}}@media screen and (min-width: 768px){form{display:grid;grid-template-columns:1fr 1fr;gap:1rem;justify-content:center}}@media screen and (min-width: 1366px){form{padding:0rem}.grid_container{display:grid;grid-template-columns:1fr 250px;gap:1rem}.user_type_image{display:flex;background-size:cover;background-repeat:no-repeat;background-position:center;height:100%;border-radius:1rem;padding:1rem}}\n"], dependencies: [{ kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }, { kind: "directive", type: i1$1.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i1$1.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i1$1.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "component", type: ButtonComponent, selector: "ipt-button", inputs: ["primary", "size", "label", "buttonType", "isEnabled"], outputs: ["onClick"] }, { kind: "component", type: InputComponent, selector: "ipt-input", inputs: ["inputType", "placeHolder", "validateText", "withPipe", "list", "iconUrl", "control", "prefix", "thousands", "decimal", "disabledSel"], outputs: ["dateSelected"] }, { kind: "component", type: SelectComponent, selector: "ipt-select", inputs: ["isRequired", "data", "defaultText", "selectCode", "disabledSel", "initialValue", "control"], outputs: ["eventSelect"] }, { kind: "pipe", type: i1.TitleCasePipe, name: "titlecase" }], animations: [
         trigger('fade', [
             transition('void => *', [
                 style({ opacity: 0 }),
@@ -1776,7 +1776,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.0.7", ngImpor
                                 animate(200, style({ opacity: 1 }))
                             ])
                         ])
-                    ], template: "<main *ngIf=\"visibility\">\r\n  <div @fade class=\"modal_container\">\r\n    <div class=\"header_modal\">\r\n      <h1>Crear usuario de {{ userType | titlecase}}</h1>\r\n      <button (click)=\"closeModal()\">x</button>\r\n    </div>\r\n    <div class=\"grid_container\">\r\n      <div>\r\n        <form autocomplete=\"off\" [formGroup]=\"createUserForm\">\r\n          <ipt-input\r\n            [inputType]=\"'text'\"\r\n            [placeHolder]=\"'Nombres'\"\r\n            [control]=\"createUserForm.controls['name']\"\r\n            [validateText]=\"'Debe ingresar el nombre'\"\r\n          ></ipt-input>\r\n          <ipt-input\r\n            [inputType]=\"'text'\"\r\n            [placeHolder]=\"'Apellidos'\"\r\n            [control]=\"createUserForm.controls['last_name']\"\r\n            [validateText]=\"'Debe ingresar los apellidos'\"\r\n          ></ipt-input>\r\n          <ipt-input\r\n            [inputType]=\"'text'\"\r\n            [placeHolder]=\"'Email'\"\r\n            [control]=\"createUserForm.controls['email']\"\r\n            [validateText]=\"'Debe tener dominio @inglesparatodos.edu.co'\"\r\n          ></ipt-input>\r\n          <ipt-select\r\n            [isRequired]=\"true\"\r\n            [defaultText]=\"'Rol'\"\r\n            (eventSelect)=\"selectRol($event)\"\r\n            [data]=\"getRolesOptions()\"\r\n          ></ipt-select>\r\n          <ipt-select\r\n            [isRequired]=\"true\"\r\n            [data]=\"phoneNumberIndicatives\"\r\n            (eventSelect)=\"selectIndicatives($event)\"\r\n            [defaultText]=\"'Indicativo'\"\r\n          ></ipt-select>\r\n          <ipt-input\r\n            [inputType]=\"'number'\"\r\n            [placeHolder]=\"'Tel\u00E9fono'\"\r\n            [control]=\"createUserForm.controls['phone_number']\"\r\n            [validateText]=\"'Debe ingresar un n\u00FAmero de tel\u00E9fono v\u00E1lido'\"\r\n          ></ipt-input>\r\n          <ipt-select\r\n            [isRequired]=\"true\"\r\n            [data]=\"idTypes\"\r\n            (eventSelect)=\"selectIdType($event)\"\r\n            [defaultText]=\"'Tipo de documento'\"\r\n          ></ipt-select>\r\n          <ipt-input\r\n            [inputType]=\"'number'\"\r\n            [placeHolder]=\"'Documento'\"\r\n            [control]=\"createUserForm.controls['id_card']\"\r\n            [validateText]=\"'Debe ingresar el n\u00FAmero de documento'\"\r\n          ></ipt-input>\r\n          <ipt-select\r\n            [isRequired]=\"true\"\r\n            (eventSelect)=\"selectState($event)\"\r\n            [data]=\"states\"\r\n            [defaultText]=\"'Departamento'\"\r\n          ></ipt-select>\r\n          <ipt-select\r\n            [isRequired]=\"true\"\r\n            (eventSelect)=\"selectCity($event)\"\r\n            [data]=\"cities\"\r\n            [defaultText]=\"'Ciudad'\"\r\n          ></ipt-select>\r\n          <ipt-input *ngIf=\"!(userType === 'student')\"\r\n            [inputType]=\"'number'\"\r\n            [placeHolder]=\"'Horas de servicio'\"\r\n            [control]=\"createUserForm.controls['service_hour']\"\r\n            [validateText]=\"'Debe ingresar las horas de servicio'\"\r\n          ></ipt-input>\r\n          <ipt-input\r\n            [inputType]=\"'password'\"\r\n            [placeHolder]=\"'Contrase\u00F1a'\"\r\n            [control]=\"createUserForm.controls['password']\"\r\n          >\r\n          </ipt-input>\r\n          <ipt-input\r\n            [inputType]=\"'password'\"\r\n            [placeHolder]=\"'Repetir contrase\u00F1a'\"\r\n            [control]=\"createUserForm.controls['re_password']\"\r\n          >\r\n          </ipt-input>\r\n        </form>\r\n\r\n        <div class=\"buttons-container\">\r\n          <ipt-button\r\n            [label]=\"'Crear usuario'\"\r\n            [isEnabled]=\"\r\n              !loader &&\r\n              createUserForm.value['re_password'] ===\r\n              createUserForm.value['password']\r\n            \"\r\n            (onClick)=\"createUser()\"\r\n            [primary]=\"true\"\r\n          >\r\n          </ipt-button>\r\n        </div>\r\n      </div>\r\n      <div [ngStyle]=\"{'background-image': 'url(' + photo + ')'}\" class=\"user_type_image\"></div>\r\n    </div>\r\n  </div>\r\n</main>\r\n", styles: ["@media screen and (min-width: 320px){main{background:rgba(0,0,0,.472);color:#fff;position:fixed;top:0;left:0;height:100vh;width:100vw;transition:all .5s}main .modal_container{width:60%;height:-moz-fit-content;height:fit-content;position:absolute;inset:0;margin:auto;background-color:#fff;border-radius:3px}.header_modal{display:flex;padding:15px 15px 0;gap:1rem;align-items:center}.header_modal h1{padding:.5rem;background-color:#1c77f7;color:#fff;width:100%;border-radius:10px;font-size:1.25rem;font-weight:700}.header_modal button{margin-left:auto;font-size:26px;padding:1.2rem;font-weight:200;color:#6c7f7d;display:flex;width:25px;height:25px;align-items:center;justify-content:center;transition:50ms;background-color:transparent;border:none}.header_modal button:hover{cursor:pointer;border-radius:50%;background-color:#d4d4d4}.grid_container{display:grid;grid-template-columns:1fr;padding:0 15px}form{display:grid;grid-template-columns:1fr;gap:.25rem;justify-content:center;padding:0 1rem}.buttons-container{margin-top:2rem;margin-bottom:2rem;display:flex;justify-content:center;align-items:center;justify-items:center;align-content:center}.user_type_image{display:none}}@media screen and (min-width: 768px){form{display:grid;grid-template-columns:1fr 1fr;gap:1rem;justify-content:center}}@media screen and (min-width: 1366px){form{padding:0rem}.grid_container{display:grid;grid-template-columns:1fr 250px;gap:1rem}.user_type_image{display:flex;background-size:cover;background-repeat:no-repeat;background-position:center;height:100%;border-radius:1rem;padding:1rem}}\n"] }]
+                    ], template: "<main *ngIf=\"visibility\">\n  <div @fade class=\"modal_container\">\n    <div class=\"header_modal\">\n      <h1>Crear usuario de {{ userType | titlecase}}</h1>\n      <button (click)=\"closeModal()\">x</button>\n    </div>\n    <div class=\"grid_container\">\n      <div>\n        <form autocomplete=\"off\" [formGroup]=\"createUserForm\">\n          <ipt-input\n            [inputType]=\"'text'\"\n            [placeHolder]=\"'Nombres'\"\n            [control]=\"createUserForm.controls['name']\"\n            [validateText]=\"'Debe ingresar el nombre'\"\n          ></ipt-input>\n          <ipt-input\n            [inputType]=\"'text'\"\n            [placeHolder]=\"'Apellidos'\"\n            [control]=\"createUserForm.controls['last_name']\"\n            [validateText]=\"'Debe ingresar los apellidos'\"\n          ></ipt-input>\n          <ipt-input\n            [inputType]=\"'text'\"\n            [placeHolder]=\"'Email'\"\n            [control]=\"createUserForm.controls['email']\"\n            [validateText]=\"'Debe tener dominio @inglesparatodos.edu.co'\"\n          ></ipt-input>\n          <ipt-select\n            [isRequired]=\"true\"\n            [defaultText]=\"'Rol'\"\n            (eventSelect)=\"selectRol($event)\"\n            [data]=\"getRolesOptions()\"\n          ></ipt-select>\n          <ipt-select\n            [isRequired]=\"true\"\n            [data]=\"phoneNumberIndicatives\"\n            (eventSelect)=\"selectIndicatives($event)\"\n            [defaultText]=\"'Indicativo'\"\n          ></ipt-select>\n          <ipt-input\n            [inputType]=\"'number'\"\n            [placeHolder]=\"'Tel\u00E9fono'\"\n            [control]=\"createUserForm.controls['phone_number']\"\n            [validateText]=\"'Debe ingresar un n\u00FAmero de tel\u00E9fono v\u00E1lido'\"\n          ></ipt-input>\n          <ipt-select\n            [isRequired]=\"true\"\n            [data]=\"idTypes\"\n            (eventSelect)=\"selectIdType($event)\"\n            [defaultText]=\"'Tipo de documento'\"\n          ></ipt-select>\n          <ipt-input\n            [inputType]=\"'number'\"\n            [placeHolder]=\"'Documento'\"\n            [control]=\"createUserForm.controls['id_card']\"\n            [validateText]=\"'Debe ingresar el n\u00FAmero de documento'\"\n          ></ipt-input>\n          <ipt-select\n            [isRequired]=\"true\"\n            (eventSelect)=\"selectState($event)\"\n            [data]=\"states\"\n            [defaultText]=\"'Departamento'\"\n          ></ipt-select>\n          <ipt-select\n            [isRequired]=\"true\"\n            (eventSelect)=\"selectCity($event)\"\n            [data]=\"cities\"\n            [defaultText]=\"'Ciudad'\"\n          ></ipt-select>\n          <ipt-input *ngIf=\"!(userType === 'student')\"\n            [inputType]=\"'number'\"\n            [placeHolder]=\"'Horas de servicio'\"\n            [control]=\"createUserForm.controls['service_hour']\"\n            [validateText]=\"'Debe ingresar las horas de servicio'\"\n          ></ipt-input>\n          <ipt-input\n            [inputType]=\"'password'\"\n            [placeHolder]=\"'Contrase\u00F1a'\"\n            [control]=\"createUserForm.controls['password']\"\n          >\n          </ipt-input>\n          <ipt-input\n            [inputType]=\"'password'\"\n            [placeHolder]=\"'Repetir contrase\u00F1a'\"\n            [control]=\"createUserForm.controls['re_password']\"\n          >\n          </ipt-input>\n        </form>\n\n        <div class=\"buttons-container\">\n          <ipt-button\n            [label]=\"'Crear usuario'\"\n            [isEnabled]=\"\n              !loader &&\n              createUserForm.value['re_password'] ===\n              createUserForm.value['password']\n            \"\n            (onClick)=\"createUser()\"\n            [primary]=\"true\"\n          >\n          </ipt-button>\n        </div>\n      </div>\n      <div [ngStyle]=\"{'background-image': 'url(' + photo + ')'}\" class=\"user_type_image\"></div>\n    </div>\n  </div>\n</main>\n", styles: ["@media screen and (min-width: 320px){main{background:rgba(0,0,0,.472);color:#fff;position:fixed;top:0;left:0;height:100vh;width:100vw;transition:all .5s}main .modal_container{width:60%;height:-moz-fit-content;height:fit-content;position:absolute;inset:0;margin:auto;background-color:#fff;border-radius:3px}.header_modal{display:flex;padding:15px 15px 0;gap:1rem;align-items:center}.header_modal h1{padding:.5rem;background-color:#1c77f7;color:#fff;width:100%;border-radius:10px;font-size:1.25rem;font-weight:700}.header_modal button{margin-left:auto;font-size:26px;padding:1.2rem;font-weight:200;color:#6c7f7d;display:flex;width:25px;height:25px;align-items:center;justify-content:center;transition:50ms;background-color:transparent;border:none}.header_modal button:hover{cursor:pointer;border-radius:50%;background-color:#d4d4d4}.grid_container{display:grid;grid-template-columns:1fr;padding:0 15px}form{display:grid;grid-template-columns:1fr;gap:.25rem;justify-content:center;padding:0 1rem}.buttons-container{margin-top:2rem;margin-bottom:2rem;display:flex;justify-content:center;align-items:center;justify-items:center;align-content:center}.user_type_image{display:none}}@media screen and (min-width: 768px){form{display:grid;grid-template-columns:1fr 1fr;gap:1rem;justify-content:center}}@media screen and (min-width: 1366px){form{padding:0rem}.grid_container{display:grid;grid-template-columns:1fr 250px;gap:1rem}.user_type_image{display:flex;background-size:cover;background-repeat:no-repeat;background-position:center;height:100%;border-radius:1rem;padding:1rem}}\n"] }]
         }], ctorParameters: function () { return [{ type: i1$1.FormBuilder }, { type: ParameterService }, { type: UserService }]; }, propDecorators: { userType: [{
                 type: Input
             }], visibility: [{
@@ -1820,103 +1820,103 @@ class SidenavComponent {
     }
 }
 SidenavComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.0.7", ngImport: i0, type: SidenavComponent, deps: [{ token: UserService }, { token: BaseService }, { token: StorageService }], target: i0.ɵɵFactoryTarget.Component });
-SidenavComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.0.7", type: SidenavComponent, selector: "ipt-sidenav", inputs: { department: "department", setPage: "setPage", userName: "userName" }, outputs: { pageChangeEvent: "pageChangeEvent" }, ngImport: i0, template: `
-    <mat-sidenav #sidenav mode="push" >
-      <mat-toolbar color="primary" (click)="sidenav.toggle()">
-        <span style="font-size: 15px;">{{department}}</span>
-        <span class="menu-icon-close"></span>
-      </mat-toolbar>
-
-      <mat-nav-list *ngFor="let route of routes">
-        <nav class="flex-container-menu">
-          <ipt-aside-button
-            [buttonActive]="this.setPage === route.page"
-            [icon]="route.icon"
-            [text]="route.text"
-            (isClicked)="clickPage(route.page)"
-            (click)="sidenav.toggle()"
-          >
-          </ipt-aside-button>
-        </nav>
-      </mat-nav-list>
-    </mat-sidenav>
-
-    <mat-toolbar class="header">
-      <div class="menu-container" (click)="sidenav.toggle()">
-        <p>Menu</p>
-        <div class="menu-icon"></div>
-      </div>
-
-      <img class="img-logo" src="./assets/logos/IPT-logo.png" alt="" />
-
-      <div class="text-container">
-        <span class="p1">{{ currentDay }}</span>
-        <span *ngIf="hour >= 0 && hour < 12" class="p2">
-          Hey {{ userName }}, Good morning!
-        </span>
-        <p *ngIf="hour >= 12 && hour < 18" class="p2">
-          Hey {{ userName }}, Good afternoon!
-        </p>
-        <p *ngIf="hour >= 18 && hour < 24" class="p2">
-          Hey {{ userName }}, Good evening!
-        </p>
-      </div>
-
-      <div *ngIf="!this.appUser" class="logout-container" (click)="logout()">
-        <p class="logout-button">Cerrar sesión</p>
-        <div class="photo-logout"></div>
-      </div>
-    </mat-toolbar>
+SidenavComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.0.7", type: SidenavComponent, selector: "ipt-sidenav", inputs: { department: "department", setPage: "setPage", userName: "userName" }, outputs: { pageChangeEvent: "pageChangeEvent" }, ngImport: i0, template: `
+    <mat-sidenav #sidenav mode="push" >
+      <mat-toolbar color="primary" (click)="sidenav.toggle()">
+        <span style="font-size: 15px;">{{department}}</span>
+        <span class="menu-icon-close"></span>
+      </mat-toolbar>
+
+      <mat-nav-list *ngFor="let route of routes">
+        <nav class="flex-container-menu">
+          <ipt-aside-button
+            [buttonActive]="this.setPage === route.page"
+            [icon]="route.icon"
+            [text]="route.text"
+            (isClicked)="clickPage(route.page)"
+            (click)="sidenav.toggle()"
+          >
+          </ipt-aside-button>
+        </nav>
+      </mat-nav-list>
+    </mat-sidenav>
+
+    <mat-toolbar class="header">
+      <div class="menu-container" (click)="sidenav.toggle()">
+        <p>Menu</p>
+        <div class="menu-icon"></div>
+      </div>
+
+      <img class="img-logo" src="./assets/logos/IPT-logo.png" alt="" />
+
+      <div class="text-container">
+        <span class="p1">{{ currentDay }}</span>
+        <span *ngIf="hour >= 0 && hour < 12" class="p2">
+          Hey {{ userName }}, Good morning!
+        </span>
+        <p *ngIf="hour >= 12 && hour < 18" class="p2">
+          Hey {{ userName }}, Good afternoon!
+        </p>
+        <p *ngIf="hour >= 18 && hour < 24" class="p2">
+          Hey {{ userName }}, Good evening!
+        </p>
+      </div>
+
+      <div *ngIf="!this.appUser" class="logout-container" (click)="logout()">
+        <p class="logout-button">Cerrar sesión</p>
+        <div class="photo-logout"></div>
+      </div>
+    </mat-toolbar>
   `, isInline: true, styles: ["*{font-family:Poppins,sans-serif}@media screen and (min-width: 320px){.header{background-color:#fff;display:flex;justify-content:space-between;filter:drop-shadow(0px -1px 7px #000)}mat-sidenav{width:-moz-fit-content!important;width:fit-content!important;background-color:#1c77f7!important}.img-logo,.text-container{display:none}.mat-toolbar.mat-primary{background-color:#fff!important;color:#003d99!important;filter:drop-shadow(0px -1px 7px #000)}.logout-container{box-shadow:#11111a1a 0 8px 24px,#11111a1a 0 16px 56px,#11111a1a 0 24px 80px;height:35px;width:auto;border-radius:30px;display:flex;margin-left:10px}.logout-button{display:flex;align-items:center;color:#1c77f7;font-weight:500;font-size:16px;margin-left:20px;text-align:center;width:150px}.photo-logout{background:url(./assets/icons/exit.png);background-size:25px 25px;background-position:center;background-repeat:no-repeat}.menu-icon{background:url(./assets/icons/icon-menu.png);background-size:25px 25px;background-position:center;background-repeat:no-repeat}.menu-icon-close{background:url(./assets/icons/cruz.png);background-size:25px 25px;background-position:center;background-repeat:no-repeat;width:35px;height:35px}.menu-container{box-shadow:#11111a1a 0 8px 24px,#11111a1a 0 16px 56px,#11111a1a 0 24px 80px;height:35px;width:52.5px;width:auto;border-radius:30px;display:flex}.menu-container:hover{cursor:pointer}.menu-container p{width:85px;display:flex;align-items:center;color:#1c77f7;font-weight:500;font-size:16px;margin:0 0 0 15px;text-align:center}}@media screen and (min-width: 768px){.img-logo{display:flex;width:120px;height:60px}.text-container{border-radius:40px;height:45px;width:100%;display:flex;gap:-100px;justify-content:center;flex-direction:column;align-items:flex-start}}.p1{color:gray;margin-left:30px;font-size:13px;height:20px}.p2{margin-left:30px;font-size:14px;font-weight:600;color:#1c77f7}.flex-container-menu{font-size:18px;color:#fff!important}.mat-nav-list{padding:0}\n"], dependencies: [{ kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: i5.MatSidenav, selector: "mat-sidenav", inputs: ["fixedInViewport", "fixedTopGap", "fixedBottomGap"], exportAs: ["matSidenav"] }, { kind: "component", type: i6.MatToolbar, selector: "mat-toolbar", inputs: ["color"], exportAs: ["matToolbar"] }, { kind: "component", type: i7.MatNavList, selector: "mat-nav-list", inputs: ["disableRipple", "disabled"], exportAs: ["matNavList"] }, { kind: "component", type: AsideButtonComponent, selector: "ipt-aside-button", inputs: ["icon", "text", "buttonActive"], outputs: ["isClicked"] }] });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.0.7", ngImport: i0, type: SidenavComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'ipt-sidenav', template: `
-    <mat-sidenav #sidenav mode="push" >
-      <mat-toolbar color="primary" (click)="sidenav.toggle()">
-        <span style="font-size: 15px;">{{department}}</span>
-        <span class="menu-icon-close"></span>
-      </mat-toolbar>
-
-      <mat-nav-list *ngFor="let route of routes">
-        <nav class="flex-container-menu">
-          <ipt-aside-button
-            [buttonActive]="this.setPage === route.page"
-            [icon]="route.icon"
-            [text]="route.text"
-            (isClicked)="clickPage(route.page)"
-            (click)="sidenav.toggle()"
-          >
-          </ipt-aside-button>
-        </nav>
-      </mat-nav-list>
-    </mat-sidenav>
-
-    <mat-toolbar class="header">
-      <div class="menu-container" (click)="sidenav.toggle()">
-        <p>Menu</p>
-        <div class="menu-icon"></div>
-      </div>
-
-      <img class="img-logo" src="./assets/logos/IPT-logo.png" alt="" />
-
-      <div class="text-container">
-        <span class="p1">{{ currentDay }}</span>
-        <span *ngIf="hour >= 0 && hour < 12" class="p2">
-          Hey {{ userName }}, Good morning!
-        </span>
-        <p *ngIf="hour >= 12 && hour < 18" class="p2">
-          Hey {{ userName }}, Good afternoon!
-        </p>
-        <p *ngIf="hour >= 18 && hour < 24" class="p2">
-          Hey {{ userName }}, Good evening!
-        </p>
-      </div>
-
-      <div *ngIf="!this.appUser" class="logout-container" (click)="logout()">
-        <p class="logout-button">Cerrar sesión</p>
-        <div class="photo-logout"></div>
-      </div>
-    </mat-toolbar>
+            args: [{ selector: 'ipt-sidenav', template: `
+    <mat-sidenav #sidenav mode="push" >
+      <mat-toolbar color="primary" (click)="sidenav.toggle()">
+        <span style="font-size: 15px;">{{department}}</span>
+        <span class="menu-icon-close"></span>
+      </mat-toolbar>
+
+      <mat-nav-list *ngFor="let route of routes">
+        <nav class="flex-container-menu">
+          <ipt-aside-button
+            [buttonActive]="this.setPage === route.page"
+            [icon]="route.icon"
+            [text]="route.text"
+            (isClicked)="clickPage(route.page)"
+            (click)="sidenav.toggle()"
+          >
+          </ipt-aside-button>
+        </nav>
+      </mat-nav-list>
+    </mat-sidenav>
+
+    <mat-toolbar class="header">
+      <div class="menu-container" (click)="sidenav.toggle()">
+        <p>Menu</p>
+        <div class="menu-icon"></div>
+      </div>
+
+      <img class="img-logo" src="./assets/logos/IPT-logo.png" alt="" />
+
+      <div class="text-container">
+        <span class="p1">{{ currentDay }}</span>
+        <span *ngIf="hour >= 0 && hour < 12" class="p2">
+          Hey {{ userName }}, Good morning!
+        </span>
+        <p *ngIf="hour >= 12 && hour < 18" class="p2">
+          Hey {{ userName }}, Good afternoon!
+        </p>
+        <p *ngIf="hour >= 18 && hour < 24" class="p2">
+          Hey {{ userName }}, Good evening!
+        </p>
+      </div>
+
+      <div *ngIf="!this.appUser" class="logout-container" (click)="logout()">
+        <p class="logout-button">Cerrar sesión</p>
+        <div class="photo-logout"></div>
+      </div>
+    </mat-toolbar>
   `, styles: ["*{font-family:Poppins,sans-serif}@media screen and (min-width: 320px){.header{background-color:#fff;display:flex;justify-content:space-between;filter:drop-shadow(0px -1px 7px #000)}mat-sidenav{width:-moz-fit-content!important;width:fit-content!important;background-color:#1c77f7!important}.img-logo,.text-container{display:none}.mat-toolbar.mat-primary{background-color:#fff!important;color:#003d99!important;filter:drop-shadow(0px -1px 7px #000)}.logout-container{box-shadow:#11111a1a 0 8px 24px,#11111a1a 0 16px 56px,#11111a1a 0 24px 80px;height:35px;width:auto;border-radius:30px;display:flex;margin-left:10px}.logout-button{display:flex;align-items:center;color:#1c77f7;font-weight:500;font-size:16px;margin-left:20px;text-align:center;width:150px}.photo-logout{background:url(./assets/icons/exit.png);background-size:25px 25px;background-position:center;background-repeat:no-repeat}.menu-icon{background:url(./assets/icons/icon-menu.png);background-size:25px 25px;background-position:center;background-repeat:no-repeat}.menu-icon-close{background:url(./assets/icons/cruz.png);background-size:25px 25px;background-position:center;background-repeat:no-repeat;width:35px;height:35px}.menu-container{box-shadow:#11111a1a 0 8px 24px,#11111a1a 0 16px 56px,#11111a1a 0 24px 80px;height:35px;width:52.5px;width:auto;border-radius:30px;display:flex}.menu-container:hover{cursor:pointer}.menu-container p{width:85px;display:flex;align-items:center;color:#1c77f7;font-weight:500;font-size:16px;margin:0 0 0 15px;text-align:center}}@media screen and (min-width: 768px){.img-logo{display:flex;width:120px;height:60px}.text-container{border-radius:40px;height:45px;width:100%;display:flex;gap:-100px;justify-content:center;flex-direction:column;align-items:flex-start}}.p1{color:gray;margin-left:30px;font-size:13px;height:20px}.p2{margin-left:30px;font-size:14px;font-weight:600;color:#1c77f7}.flex-container-menu{font-size:18px;color:#fff!important}.mat-nav-list{padding:0}\n"] }]
         }], ctorParameters: function () { return [{ type: UserService }, { type: BaseService }, { type: StorageService }]; }, propDecorators: { department: [{
                 type: Input
@@ -1982,299 +1982,299 @@ class QuestionTypeComponent {
     }
 }
 QuestionTypeComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.0.7", ngImport: i0, type: QuestionTypeComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-QuestionTypeComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.0.7", type: QuestionTypeComponent, selector: "ipt-question-types", inputs: { questionType: "questionType", formGruoup: "formGruoup" }, usesOnChanges: true, ngImport: i0, template: `
-    <div
-      *ngIf="
-        this.questionType === 'True or False' ||
-        this.questionType === 'Correct or Incorrect'
-      "
-      class="sectionABCD"
-    >
-      <fieldset disabled="disabled">
-        <ipt-input
-          [control]="formGruoup.controls['answer1']"
-          [inputType]="'text'"
-          [placeHolder]="
-            this.questionType === 'True or False' ? 'True' : 'Correct'
-          "
-          [validateText]="'Este campo es requerido'"
-        >
-        </ipt-input>
-      </fieldset>
-      <ipt-input
-        [control]="formGruoup.controls['value1']"
-        [inputType]="'number'"
-        [placeHolder]="'Valor *'"
-        [validateText]="'Debe ser 0 o 1'"
-        (click)='clickDetection("value1")'
-      >
-      </ipt-input>
-      <fieldset disabled="disabled">
-        <ipt-input
-          [control]="formGruoup.controls['answer2']"
-          [inputType]="'text'"
-          [placeHolder]="
-            this.questionType === 'True or False' ? 'False' : 'Incorrect'
-          "
-          [validateText]="'Este campo es requerido'"
-        >
-        </ipt-input>
-      </fieldset>
-      <ipt-input
-        [control]="formGruoup.controls['value2']"
-        [inputType]="'number'"
-        [placeHolder]="'Valor *'"
-        [validateText]="'Debe ser 0 o 1'"
-        (click)='clickDetection("value2")'
-      >
-      </ipt-input>
-    </div>
-
-    <div
-      *ngIf="
-        this.questionType === 'Relationship' ||
-        this.questionType === 'Complete' ||
-        this.questionType === 'Conversation'
-      "
-      class="sectionABCD"
-    >
-      <ipt-input
-        [control]="formGruoup.controls['answer1']"
-        [inputType]="'text'"
-        [placeHolder]="'Ingrese la opción'"
-        [validateText]="'Este campo es requerido'"
-      >
-      </ipt-input>
-      <ipt-input
-        [control]="formGruoup.controls['value1']"
-        [inputType]="'number'"
-        [placeHolder]="'Valor *'"
-        [validateText]="'Debe ser 0 o 1'"
-        (click)='clickDetection("value1")'
-      >
-      </ipt-input>
-    </div>
-
-    <div
-      *ngIf="
-        this.questionType === 'A, B, C' || this.questionType === 'A, B, C, D'
-      "
-      class="sectionABCD"
-    >
-      <ipt-input
-        [control]="formGruoup.controls['answer1']"
-        [inputType]="'text'"
-        [placeHolder]="'Opción A *'"
-        [validateText]="'Este campo es requerido'"
-      >
-      </ipt-input>
-      <ipt-input
-        [control]="formGruoup.controls['value1']"
-        [inputType]="'number'"
-        [placeHolder]="'Valor *'"
-        [validateText]="'Debe ser 0 o 1'"
-        (click)='clickDetection("value1")'
-      >
-      </ipt-input>
-
-      <ipt-input
-        [control]="formGruoup.controls['answer2']"
-        [inputType]="'text'"
-        [placeHolder]="'Opción B *'"
-        [validateText]="'Este campo es requerido'"
-      >
-      </ipt-input>
-      <ipt-input
-        [control]="formGruoup.controls['value2']"
-        [inputType]="'number'"
-        [placeHolder]="'Valor *'"
-        [validateText]="'Debe ser 0 o 1'"
-        (click)='clickDetection("value2")'
-      >
-      </ipt-input>
-
-      <ipt-input
-        [control]="formGruoup.controls['answer3']"
-        [inputType]="'text'"
-        [placeHolder]="'Opción C *'"
-        [validateText]="'Este campo es requerido'"
-      >
-      </ipt-input>
-      <ipt-input
-        [control]="formGruoup.controls['value3']"
-        [inputType]="'number'"
-        [placeHolder]="'Valor *'"
-        [validateText]="'Debe ser 0 o 1'"
-        (click)='clickDetection("value3")'
-      >
-      </ipt-input>
-
-      <ipt-input
-        *ngIf="this.questionType === 'A, B, C, D'"
-        [control]="formGruoup.controls['answer4']"
-        [inputType]="'text'"
-        [placeHolder]="'Opción D *'"
-        [validateText]="'Este campo es requerido'"
-      >
-      </ipt-input>
-      <ipt-input
-        *ngIf="this.questionType === 'A, B, C, D'"
-        [control]="formGruoup.controls['value4']"
-        [inputType]="'number'"
-        [placeHolder]="'Valor *'"
-        [validateText]="'Debe ser 0 o 1'"
-        (click)='clickDetection("value4")'
-      >
-      </ipt-input>
-    </div>
+QuestionTypeComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.0.7", type: QuestionTypeComponent, selector: "ipt-question-types", inputs: { questionType: "questionType", formGruoup: "formGruoup" }, usesOnChanges: true, ngImport: i0, template: `
+    <div
+      *ngIf="
+        this.questionType === 'True or False' ||
+        this.questionType === 'Correct or Incorrect'
+      "
+      class="sectionABCD"
+    >
+      <fieldset disabled="disabled">
+        <ipt-input
+          [control]="formGruoup.controls['answer1']"
+          [inputType]="'text'"
+          [placeHolder]="
+            this.questionType === 'True or False' ? 'True' : 'Correct'
+          "
+          [validateText]="'Este campo es requerido'"
+        >
+        </ipt-input>
+      </fieldset>
+      <ipt-input
+        [control]="formGruoup.controls['value1']"
+        [inputType]="'number'"
+        [placeHolder]="'Valor *'"
+        [validateText]="'Debe ser 0 o 1'"
+        (click)='clickDetection("value1")'
+      >
+      </ipt-input>
+      <fieldset disabled="disabled">
+        <ipt-input
+          [control]="formGruoup.controls['answer2']"
+          [inputType]="'text'"
+          [placeHolder]="
+            this.questionType === 'True or False' ? 'False' : 'Incorrect'
+          "
+          [validateText]="'Este campo es requerido'"
+        >
+        </ipt-input>
+      </fieldset>
+      <ipt-input
+        [control]="formGruoup.controls['value2']"
+        [inputType]="'number'"
+        [placeHolder]="'Valor *'"
+        [validateText]="'Debe ser 0 o 1'"
+        (click)='clickDetection("value2")'
+      >
+      </ipt-input>
+    </div>
+
+    <div
+      *ngIf="
+        this.questionType === 'Relationship' ||
+        this.questionType === 'Complete' ||
+        this.questionType === 'Conversation'
+      "
+      class="sectionABCD"
+    >
+      <ipt-input
+        [control]="formGruoup.controls['answer1']"
+        [inputType]="'text'"
+        [placeHolder]="'Ingrese la opción'"
+        [validateText]="'Este campo es requerido'"
+      >
+      </ipt-input>
+      <ipt-input
+        [control]="formGruoup.controls['value1']"
+        [inputType]="'number'"
+        [placeHolder]="'Valor *'"
+        [validateText]="'Debe ser 0 o 1'"
+        (click)='clickDetection("value1")'
+      >
+      </ipt-input>
+    </div>
+
+    <div
+      *ngIf="
+        this.questionType === 'A, B, C' || this.questionType === 'A, B, C, D'
+      "
+      class="sectionABCD"
+    >
+      <ipt-input
+        [control]="formGruoup.controls['answer1']"
+        [inputType]="'text'"
+        [placeHolder]="'Opción A *'"
+        [validateText]="'Este campo es requerido'"
+      >
+      </ipt-input>
+      <ipt-input
+        [control]="formGruoup.controls['value1']"
+        [inputType]="'number'"
+        [placeHolder]="'Valor *'"
+        [validateText]="'Debe ser 0 o 1'"
+        (click)='clickDetection("value1")'
+      >
+      </ipt-input>
+
+      <ipt-input
+        [control]="formGruoup.controls['answer2']"
+        [inputType]="'text'"
+        [placeHolder]="'Opción B *'"
+        [validateText]="'Este campo es requerido'"
+      >
+      </ipt-input>
+      <ipt-input
+        [control]="formGruoup.controls['value2']"
+        [inputType]="'number'"
+        [placeHolder]="'Valor *'"
+        [validateText]="'Debe ser 0 o 1'"
+        (click)='clickDetection("value2")'
+      >
+      </ipt-input>
+
+      <ipt-input
+        [control]="formGruoup.controls['answer3']"
+        [inputType]="'text'"
+        [placeHolder]="'Opción C *'"
+        [validateText]="'Este campo es requerido'"
+      >
+      </ipt-input>
+      <ipt-input
+        [control]="formGruoup.controls['value3']"
+        [inputType]="'number'"
+        [placeHolder]="'Valor *'"
+        [validateText]="'Debe ser 0 o 1'"
+        (click)='clickDetection("value3")'
+      >
+      </ipt-input>
+
+      <ipt-input
+        *ngIf="this.questionType === 'A, B, C, D'"
+        [control]="formGruoup.controls['answer4']"
+        [inputType]="'text'"
+        [placeHolder]="'Opción D *'"
+        [validateText]="'Este campo es requerido'"
+      >
+      </ipt-input>
+      <ipt-input
+        *ngIf="this.questionType === 'A, B, C, D'"
+        [control]="formGruoup.controls['value4']"
+        [inputType]="'number'"
+        [placeHolder]="'Valor *'"
+        [validateText]="'Debe ser 0 o 1'"
+        (click)='clickDetection("value4")'
+      >
+      </ipt-input>
+    </div>
   `, isInline: true, styles: ["form{display:grid;grid-template-columns:1fr}.sectionABCD{display:grid;grid-template-columns:12fr 0fr;gap:0px 10px}fieldset{background:transparent;border:none}\n"], dependencies: [{ kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: InputComponent, selector: "ipt-input", inputs: ["inputType", "placeHolder", "validateText", "withPipe", "list", "iconUrl", "control", "prefix", "thousands", "decimal", "disabledSel"], outputs: ["dateSelected"] }] });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.0.7", ngImport: i0, type: QuestionTypeComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'ipt-question-types', template: `
-    <div
-      *ngIf="
-        this.questionType === 'True or False' ||
-        this.questionType === 'Correct or Incorrect'
-      "
-      class="sectionABCD"
-    >
-      <fieldset disabled="disabled">
-        <ipt-input
-          [control]="formGruoup.controls['answer1']"
-          [inputType]="'text'"
-          [placeHolder]="
-            this.questionType === 'True or False' ? 'True' : 'Correct'
-          "
-          [validateText]="'Este campo es requerido'"
-        >
-        </ipt-input>
-      </fieldset>
-      <ipt-input
-        [control]="formGruoup.controls['value1']"
-        [inputType]="'number'"
-        [placeHolder]="'Valor *'"
-        [validateText]="'Debe ser 0 o 1'"
-        (click)='clickDetection("value1")'
-      >
-      </ipt-input>
-      <fieldset disabled="disabled">
-        <ipt-input
-          [control]="formGruoup.controls['answer2']"
-          [inputType]="'text'"
-          [placeHolder]="
-            this.questionType === 'True or False' ? 'False' : 'Incorrect'
-          "
-          [validateText]="'Este campo es requerido'"
-        >
-        </ipt-input>
-      </fieldset>
-      <ipt-input
-        [control]="formGruoup.controls['value2']"
-        [inputType]="'number'"
-        [placeHolder]="'Valor *'"
-        [validateText]="'Debe ser 0 o 1'"
-        (click)='clickDetection("value2")'
-      >
-      </ipt-input>
-    </div>
-
-    <div
-      *ngIf="
-        this.questionType === 'Relationship' ||
-        this.questionType === 'Complete' ||
-        this.questionType === 'Conversation'
-      "
-      class="sectionABCD"
-    >
-      <ipt-input
-        [control]="formGruoup.controls['answer1']"
-        [inputType]="'text'"
-        [placeHolder]="'Ingrese la opción'"
-        [validateText]="'Este campo es requerido'"
-      >
-      </ipt-input>
-      <ipt-input
-        [control]="formGruoup.controls['value1']"
-        [inputType]="'number'"
-        [placeHolder]="'Valor *'"
-        [validateText]="'Debe ser 0 o 1'"
-        (click)='clickDetection("value1")'
-      >
-      </ipt-input>
-    </div>
-
-    <div
-      *ngIf="
-        this.questionType === 'A, B, C' || this.questionType === 'A, B, C, D'
-      "
-      class="sectionABCD"
-    >
-      <ipt-input
-        [control]="formGruoup.controls['answer1']"
-        [inputType]="'text'"
-        [placeHolder]="'Opción A *'"
-        [validateText]="'Este campo es requerido'"
-      >
-      </ipt-input>
-      <ipt-input
-        [control]="formGruoup.controls['value1']"
-        [inputType]="'number'"
-        [placeHolder]="'Valor *'"
-        [validateText]="'Debe ser 0 o 1'"
-        (click)='clickDetection("value1")'
-      >
-      </ipt-input>
-
-      <ipt-input
-        [control]="formGruoup.controls['answer2']"
-        [inputType]="'text'"
-        [placeHolder]="'Opción B *'"
-        [validateText]="'Este campo es requerido'"
-      >
-      </ipt-input>
-      <ipt-input
-        [control]="formGruoup.controls['value2']"
-        [inputType]="'number'"
-        [placeHolder]="'Valor *'"
-        [validateText]="'Debe ser 0 o 1'"
-        (click)='clickDetection("value2")'
-      >
-      </ipt-input>
-
-      <ipt-input
-        [control]="formGruoup.controls['answer3']"
-        [inputType]="'text'"
-        [placeHolder]="'Opción C *'"
-        [validateText]="'Este campo es requerido'"
-      >
-      </ipt-input>
-      <ipt-input
-        [control]="formGruoup.controls['value3']"
-        [inputType]="'number'"
-        [placeHolder]="'Valor *'"
-        [validateText]="'Debe ser 0 o 1'"
-        (click)='clickDetection("value3")'
-      >
-      </ipt-input>
-
-      <ipt-input
-        *ngIf="this.questionType === 'A, B, C, D'"
-        [control]="formGruoup.controls['answer4']"
-        [inputType]="'text'"
-        [placeHolder]="'Opción D *'"
-        [validateText]="'Este campo es requerido'"
-      >
-      </ipt-input>
-      <ipt-input
-        *ngIf="this.questionType === 'A, B, C, D'"
-        [control]="formGruoup.controls['value4']"
-        [inputType]="'number'"
-        [placeHolder]="'Valor *'"
-        [validateText]="'Debe ser 0 o 1'"
-        (click)='clickDetection("value4")'
-      >
-      </ipt-input>
-    </div>
+            args: [{ selector: 'ipt-question-types', template: `
+    <div
+      *ngIf="
+        this.questionType === 'True or False' ||
+        this.questionType === 'Correct or Incorrect'
+      "
+      class="sectionABCD"
+    >
+      <fieldset disabled="disabled">
+        <ipt-input
+          [control]="formGruoup.controls['answer1']"
+          [inputType]="'text'"
+          [placeHolder]="
+            this.questionType === 'True or False' ? 'True' : 'Correct'
+          "
+          [validateText]="'Este campo es requerido'"
+        >
+        </ipt-input>
+      </fieldset>
+      <ipt-input
+        [control]="formGruoup.controls['value1']"
+        [inputType]="'number'"
+        [placeHolder]="'Valor *'"
+        [validateText]="'Debe ser 0 o 1'"
+        (click)='clickDetection("value1")'
+      >
+      </ipt-input>
+      <fieldset disabled="disabled">
+        <ipt-input
+          [control]="formGruoup.controls['answer2']"
+          [inputType]="'text'"
+          [placeHolder]="
+            this.questionType === 'True or False' ? 'False' : 'Incorrect'
+          "
+          [validateText]="'Este campo es requerido'"
+        >
+        </ipt-input>
+      </fieldset>
+      <ipt-input
+        [control]="formGruoup.controls['value2']"
+        [inputType]="'number'"
+        [placeHolder]="'Valor *'"
+        [validateText]="'Debe ser 0 o 1'"
+        (click)='clickDetection("value2")'
+      >
+      </ipt-input>
+    </div>
+
+    <div
+      *ngIf="
+        this.questionType === 'Relationship' ||
+        this.questionType === 'Complete' ||
+        this.questionType === 'Conversation'
+      "
+      class="sectionABCD"
+    >
+      <ipt-input
+        [control]="formGruoup.controls['answer1']"
+        [inputType]="'text'"
+        [placeHolder]="'Ingrese la opción'"
+        [validateText]="'Este campo es requerido'"
+      >
+      </ipt-input>
+      <ipt-input
+        [control]="formGruoup.controls['value1']"
+        [inputType]="'number'"
+        [placeHolder]="'Valor *'"
+        [validateText]="'Debe ser 0 o 1'"
+        (click)='clickDetection("value1")'
+      >
+      </ipt-input>
+    </div>
+
+    <div
+      *ngIf="
+        this.questionType === 'A, B, C' || this.questionType === 'A, B, C, D'
+      "
+      class="sectionABCD"
+    >
+      <ipt-input
+        [control]="formGruoup.controls['answer1']"
+        [inputType]="'text'"
+        [placeHolder]="'Opción A *'"
+        [validateText]="'Este campo es requerido'"
+      >
+      </ipt-input>
+      <ipt-input
+        [control]="formGruoup.controls['value1']"
+        [inputType]="'number'"
+        [placeHolder]="'Valor *'"
+        [validateText]="'Debe ser 0 o 1'"
+        (click)='clickDetection("value1")'
+      >
+      </ipt-input>
+
+      <ipt-input
+        [control]="formGruoup.controls['answer2']"
+        [inputType]="'text'"
+        [placeHolder]="'Opción B *'"
+        [validateText]="'Este campo es requerido'"
+      >
+      </ipt-input>
+      <ipt-input
+        [control]="formGruoup.controls['value2']"
+        [inputType]="'number'"
+        [placeHolder]="'Valor *'"
+        [validateText]="'Debe ser 0 o 1'"
+        (click)='clickDetection("value2")'
+      >
+      </ipt-input>
+
+      <ipt-input
+        [control]="formGruoup.controls['answer3']"
+        [inputType]="'text'"
+        [placeHolder]="'Opción C *'"
+        [validateText]="'Este campo es requerido'"
+      >
+      </ipt-input>
+      <ipt-input
+        [control]="formGruoup.controls['value3']"
+        [inputType]="'number'"
+        [placeHolder]="'Valor *'"
+        [validateText]="'Debe ser 0 o 1'"
+        (click)='clickDetection("value3")'
+      >
+      </ipt-input>
+
+      <ipt-input
+        *ngIf="this.questionType === 'A, B, C, D'"
+        [control]="formGruoup.controls['answer4']"
+        [inputType]="'text'"
+        [placeHolder]="'Opción D *'"
+        [validateText]="'Este campo es requerido'"
+      >
+      </ipt-input>
+      <ipt-input
+        *ngIf="this.questionType === 'A, B, C, D'"
+        [control]="formGruoup.controls['value4']"
+        [inputType]="'number'"
+        [placeHolder]="'Valor *'"
+        [validateText]="'Debe ser 0 o 1'"
+        (click)='clickDetection("value4")'
+      >
+      </ipt-input>
+    </div>
   `, styles: ["form{display:grid;grid-template-columns:1fr}.sectionABCD{display:grid;grid-template-columns:12fr 0fr;gap:0px 10px}fieldset{background:transparent;border:none}\n"] }]
         }], propDecorators: { questionType: [{
                 type: Input
@@ -2487,10 +2487,10 @@ class CardCourseComponent {
     }
 }
 CardCourseComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.0.7", ngImport: i0, type: CardCourseComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-CardCourseComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.0.7", type: CardCourseComponent, selector: "ipt-card-course-self-cod-managed", inputs: { CourseData: "CourseData", isLoading: "isLoading" }, outputs: { codeCourse: "codeCourse" }, usesOnChanges: true, ngImport: i0, template: "<div *ngIf=\"!isLoading\" class=\"main-container\">\r\n\r\n  <!-- cards Academy -->\r\n  <div class=\"container__span-header flex justify-content-start\" *ngIf=\"visibleAcademy || visibleKids || visibleSchools\">\r\n    <span>Selecciona un Plan</span>\r\n  </div>\r\n\r\n  <p-panel\r\n  *ngIf=\"visibleAcademy\"\r\n  header=\"Plan Academy\"\r\n  [toggleable]=\"true\"\r\n  [collapsed]=\"false\"\r\n  id=\"academic_plan\"\r\n  class=\"academic_plan\"\r\n  >\r\n  <ng-template pTemplate=\"icons\"> </ng-template>\r\n    <main *ngIf=\"!isLoading\" class=\"flex flex-col\">\r\n      <section *ngFor=\"let course of courseAcademy\" class=\"card1 animate__animated\"  (click)=\"viewDataCourse(course)\">\r\n        <h3 class=\"card1__title__academic\">{{ course.course_type.label }}</h3>\r\n        <p class=\"card1__content\">\r\n          <strong class=\"type-theory\">Clases Teoricas: </strong>{{ course.course_schedule | scheduleFormat }}<br>\r\n          <strong class=\"type-theory\">Horario Teorico: </strong>{{ course.course_schedule | scheduleTimeFormat }}<br>\r\n          <!-- <strong class=\"type-theory\">Theory Teacher: </strong>{{ course.teacher | titlecase }}<br> -->\r\n          <!-- <strong class=\"type-theory\">Theory Classroom: </strong><span>{{ course.course_scheduleDetails[0].ClassRoom.name  | titlecase}}</span><br> -->\r\n          <strong><hr></strong>\r\n          <strong class=\"type-club\">Clases Club: </strong>\r\n            <span *ngIf=\"course.course_club\">{{ course.course_club.course_schedule | scheduleFormat }}</span><br>\r\n          <strong class=\"type-club\">Horario Club: </strong>\r\n            <span *ngIf=\"course.course_club\">{{ course.course_club.course_schedule | scheduleTimeFormat }}</span><br>\r\n          <strong>Modalidad: </strong>\r\n            <span *ngIf=\"course.course_modality\">{{ course.course_modality.name | titlecase }}</span><br>\r\n          <!-- <strong class=\"type-club\">Club Teacher: </strong>\r\n            <span *ngIf=\"course.course_club\">{{ course.course_club.teacher | titlecase }}</span><br> -->\r\n          <!-- <strong class=\"type-club\">Club Classroom: </strong>\r\n            <span *ngIf=\"course.course_club\">{{ course.course_club.course_scheduleDetails[0].ClassRoom.name  | titlecase}}</span><br> -->\r\n          <!-- <strong><hr></strong> -->\r\n          <!-- <strong *ngIf=\"course.start_date === null\">Posible inicio: </strong>{{ course.start_date === null ? course.to_start : null | date:'dd/MM/yyyy' }}<br *ngIf=\"course.start_date === null\">\r\n          <strong *ngIf=\"course.start_date !== null\">Fecha Inicio: </strong>{{ course.start_date !== null ? course.start_date : null | date:'dd/MM/yyyy' }}<br *ngIf=\"course.finish_date !== null\">\r\n          <strong *ngIf=\"course.finish_date !== null\">Fecha culminacion: </strong>{{ course.finish_date !== null ? course.finish_date : null | date:'dd/MM/yyyy' }}<br *ngIf=\"course.finish_date !== null\"> -->\r\n          <!-- <strong>Created: </strong>{{ course.created_at | date:'dd/MM/yyyy' }}<br> -->\r\n        </p>\r\n        <div class=\"card1__date\">\r\n          <!-- <span\r\n          [ngClass]=\"course.status?.color_status\"\r\n          ></span> -->\r\n          <!-- <span class=\"course-code\">Code: {{course.code}}</span> -->\r\n        </div>\r\n        <div class=\"card1__arrow\" [ngClass]=\"getCssClass(course.english_level.name)\">\r\n          <span>{{ course.english_level.name | typeLevel}}</span>\r\n        </div>\r\n      </section>\r\n    </main>\r\n    <ipt-loader *ngIf=\"isLoading\"></ipt-loader>\r\n  </p-panel>\r\n\r\n  <!-- cards Kids -->\r\n\r\n  <p-panel\r\n  *ngIf=\"visibleKids\"\r\n  header=\"Plan Kids\"\r\n  [toggleable]=\"true\"\r\n  [collapsed]=\"false\"\r\n  id=\"social_kids\"\r\n  >\r\n  <ng-template pTemplate=\"icons\"> </ng-template>\r\n    <main *ngIf=\"!isLoading\" class=\"flex flex-col\">\r\n      <section *ngFor=\"let course of courseKids\" class=\"card1 animate__animated\"  (click)=\"viewDataCourse(course)\">\r\n        <h3 class=\"card1__title__kids\">{{ course.course_type.label }}</h3>\r\n        <p class=\"card1__content\">\r\n          <strong class=\"type-theory\">Clases Teoricas: </strong>{{ course.course_schedule | scheduleFormat }}<br>\r\n          <strong class=\"type-theory\">Horario Teorico: </strong>{{ course.course_schedule | scheduleTimeFormat }}<br>\r\n          <!-- <strong class=\"type-theory\">Theory Teacher: </strong>{{ course.teacher | titlecase }}<br>\r\n          <strong class=\"type-theory\">Theory Classroom: </strong><span>{{ course.course_scheduleDetails[0].ClassRoom.name  | titlecase}}</span><br> -->\r\n          <strong><hr></strong>\r\n          <strong class=\"type-club\">Clases Club: </strong>\r\n            <span *ngIf=\"course.course_club\">{{ course.course_club.course_schedule | scheduleFormat }}</span><br>\r\n          <strong class=\"type-club\">Horario Club: </strong>\r\n            <span *ngIf=\"course.course_club\">{{ course.course_club.course_schedule | scheduleTimeFormat }}</span><br>\r\n          <strong>Modalidad: </strong>\r\n            <span *ngIf=\"course.course_modality\">{{ course.course_modality.name | titlecase }}</span><br>\r\n          <!-- <strong class=\"type-club\">Club Teacher: </strong>\r\n            <span *ngIf=\"course.course_club\">{{ course.course_club.teacher | titlecase }}</span><br> -->\r\n          <!-- <strong class=\"type-club\">Club Classroom: </strong>\r\n            <span *ngIf=\"course.course_club\">{{ course.course_club.course_scheduleDetails[0].ClassRoom.name  | titlecase}}</span><br> -->\r\n          <!-- <strong><hr></strong> -->\r\n          <!-- <strong *ngIf=\"course.start_date === null\">Posible inicio: </strong>{{ course.start_date === null ? course.to_start : null | date:'dd/MM/yyyy' }}<br *ngIf=\"course.start_date === null\">\r\n          <strong *ngIf=\"course.start_date !== null\">Fecha Inicio: </strong>{{ course.start_date !== null ? course.start_date : null | date:'dd/MM/yyyy' }}<br *ngIf=\"course.finish_date !== null\">\r\n          <strong *ngIf=\"course.finish_date !== null\">Fecha culminacion: </strong>{{ course.finish_date !== null ? course.finish_date : null | date:'dd/MM/yyyy' }}<br *ngIf=\"course.finish_date !== null\"> -->\r\n          <!-- <strong>Created: </strong>{{ course.created_at | date:'dd/MM/yyyy' }}<br> -->\r\n        </p>\r\n        <div class=\"card1__date\">\r\n          <!-- <span\r\n          [ngClass]=\"course.status?.color_status\"\r\n          ></span> -->\r\n          <!-- <span class=\"course-code\">Code: {{course.code}}</span> -->\r\n        </div>\r\n        <div class=\"card1__arrow\" [ngClass]=\"getCssClass(course.english_level.name)\">\r\n          <span>{{ course.english_level.name | typeLevel}}</span>\r\n        </div>\r\n      </section>\r\n    </main>\r\n    <ipt-loader *ngIf=\"isLoading\"></ipt-loader>\r\n  </p-panel>\r\n\r\n  <!-- cards Schools -->\r\n\r\n  <p-panel\r\n  *ngIf=\"visibleSchools\"\r\n  header=\"Plan Schools\"\r\n  [toggleable]=\"true\"\r\n  [collapsed]=\"false\"\r\n  id=\"social_school\"\r\n  >\r\n  <ng-template pTemplate=\"icons\"> </ng-template>\r\n    <main *ngIf=\"!isLoading\" class=\"flex flex-col\">\r\n      <section *ngFor=\"let course of courseSchools\" class=\"card1 animate__animated\"  (click)=\"viewDataCourse(course)\">\r\n        <h3 class=\"card1__title__schools\">{{ course.course_type.label }}</h3>\r\n        <p class=\"card1__content\">\r\n          <strong class=\"type-theory\">Clases Teoricas: </strong>{{ course.course_schedule | scheduleFormat }}<br>\r\n          <strong class=\"type-theory\">Horario Teorico: </strong>{{ course.course_schedule | scheduleTimeFormat }}<br>\r\n          <!-- <strong class=\"type-theory\">Theory Teacher: </strong>{{ course.teacher | titlecase }}<br>\r\n          <strong class=\"type-theory\">Theory Classroom: </strong><span>{{ course.course_scheduleDetails[0].ClassRoom.name  | titlecase}}</span><br> -->\r\n          <strong><hr></strong>\r\n          <strong class=\"type-club\">Clases Club: </strong>\r\n            <span *ngIf=\"course.course_club\">{{ course.course_club.course_schedule | scheduleFormat }}</span><br>\r\n          <strong class=\"type-club\">Horario Club: </strong>\r\n            <span *ngIf=\"course.course_club\">{{ course.course_club.course_schedule | scheduleTimeFormat }}</span><br>\r\n          <strong>Modalidad: </strong>\r\n            <span *ngIf=\"course.course_modality\">{{ course.course_modality.name | titlecase }}</span><br>\r\n          <!-- <strong class=\"type-club\">Club Teacher: </strong>\r\n            <span *ngIf=\"course.course_club\">{{ course.course_club.teacher | titlecase }}</span><br>\r\n          <strong class=\"type-club\">Club Classroom: </strong>\r\n            <span *ngIf=\"course.course_club\">{{ course.course_club.course_scheduleDetails[0].ClassRoom.name  | titlecase}}</span><br> -->\r\n          <!-- <strong><hr></strong> -->\r\n          <!-- <strong *ngIf=\"course.start_date === null\">Posible inicio: </strong>{{ course.start_date === null ? course.to_start : null | date:'dd/MM/yyyy' }}<br *ngIf=\"course.start_date === null\">\r\n          <strong *ngIf=\"course.start_date !== null\">Fecha Inicio: </strong>{{ course.start_date !== null ? course.start_date : null | date:'dd/MM/yyyy' }}<br *ngIf=\"course.finish_date !== null\">\r\n          <strong *ngIf=\"course.finish_date !== null\">Fecha culminacion: </strong>{{ course.finish_date !== null ? course.finish_date : null | date:'dd/MM/yyyy' }}<br *ngIf=\"course.finish_date !== null\"> -->\r\n          <!-- <strong>Created: </strong>{{ course.created_at | date:'dd/MM/yyyy' }}<br> -->\r\n        </p>\r\n        <div class=\"card1__date\">\r\n          <!-- <span\r\n          [ngClass]=\"course.status?.color_status\"\r\n          ></span> -->\r\n          <!-- <span class=\"course-code\">Code: {{course.code}}</span> -->\r\n        </div>\r\n        <div class=\"card1__arrow\" [ngClass]=\"getCssClass(course.english_level.name)\">\r\n          <span>{{ course.english_level.name | typeLevel}}</span>\r\n        </div>\r\n      </section>\r\n    </main>\r\n    <ipt-loader *ngIf=\"isLoading\"></ipt-loader>\r\n  </p-panel>\r\n\r\n  <div class=\"container__span-footer flex justify-content-center\" *ngIf=\"!visibleAcademy && !visibleKids && !visibleSchools\">\r\n    <span>No se encontraron planes</span>\r\n  </div>\r\n</div>\r\n<div *ngIf=\"isLoading\">\r\n\r\n  <p-panel\r\n  header=\"\"\r\n  [toggleable]=\"true\"\r\n  [collapsed]=\"false\"\r\n  id=\"p-component panel-skeleton\"\r\n  >\r\n  <ng-template pTemplate=\"icons\"> </ng-template>\r\n    <main class=\"flex flex-col\">\r\n      <section *ngFor=\"let course of skeleton\" class=\"card1 animate__animated\"  >\r\n        <p-skeleton width=\"12rem\" height=\"2rem\" styleClass=\"mb-2\" ></p-skeleton>\r\n        <p class=\"card1__content_skeleton\">\r\n          <p-skeleton width=\"9rem\" height=\"1rem\" styleClass=\"mb-2\" ></p-skeleton>\r\n          <p-skeleton width=\"9rem\" height=\"1rem\" styleClass=\"mb-2\" ></p-skeleton>\r\n          <strong><hr></strong>\r\n          <p-skeleton width=\"9rem\" height=\"1rem\" styleClass=\"mb-2\" ></p-skeleton>\r\n          <p-skeleton width=\"9rem\" height=\"1rem\" styleClass=\"mb-2\" ></p-skeleton>\r\n        </p>\r\n        <div class=\"card1__date__skeleton\">\r\n        </div>\r\n        <div class=\"card1__arrow\" >\r\n          <p-skeleton size=\"3rem\" styleClass=\"mr-2\" ></p-skeleton>\r\n        </div>\r\n      </section>\r\n    </main>\r\n  </p-panel>\r\n\r\n</div>\r\n\r\n", styles: ["main{display:flex;gap:.7rem;flex-wrap:wrap}.card1{--border-radius: 3px;--primary-color: #1c77f7;--secondary-color: #2c2c2c;--tertiary-color: #ffffff;width:340px;font-family:Poppins,sans-serif;cursor:pointer;border-radius:var(--border-radius);background:#f1f1f3;box-shadow:0 8px 16px #00000008;position:relative;transition:.3s;border:solid .5px #e0e0e0}.type-theory{color:#00aecc}.type-club{color:#0d9d36}.msg-two-coup{color:#000!important;padding-left:7px;padding-right:7px;border-radius:5px;background-color:#4ed1e9}.msg-two-lev{color:#000!important;padding-left:5px;padding-right:5px;border-radius:5px;margin-left:13px;background-color:#fb8f42}.beginner{color:#fff!important;padding-left:5px;padding-right:5px;border-radius:5px;margin-left:13px;background-color:#94b9aa}.levelAone{color:#fff!important;padding-left:5px;padding-right:5px;border-radius:5px;margin-left:13px;background-color:#c4291c}.levelAonetwo{color:#fff!important;padding-left:5px;padding-right:5px;border-radius:5px;margin-left:13px;background-color:#418ed1}.levelAtwo{color:#fff!important;padding-left:5px;padding-right:5px;border-radius:5px;margin-left:13px;background-color:#4fad65}.levelBone{color:#fff!important;padding-left:5px;padding-right:5px;border-radius:5px;margin-left:13px;background-color:#6824b8}.levelBtwo{color:#fff!important;padding-left:5px;padding-right:5px;border-radius:5px;margin-left:13px;background-color:#06161e}.levelBplus{color:#fff!important;padding-left:5px;padding-right:5px;border-radius:5px;margin-left:13px;background-color:#cc6529}.main-container{margin-top:1%}.course-code{font-size:12px;font-weight:400;margin-left:.5rem}.card1:hover{box-shadow:#0000003d 0 3px 8px}.card1>*+*{margin-top:.7em}.card1 .card1__content{padding-left:10px;color:var(--secondary-color);font-size:.86rem;font-weight:200;z-index:1;position:relative}strong{color:var(--secondary-color);font-weight:300}:host ::ng-deep .p-panel .p-panel-header .p-panel-header-icon{color:#fff!important}.card1 .card1__title__academic{color:#fff;padding-left:10px;padding-right:10px;font-size:1.1rem;font-weight:300;z-index:1;position:relative;background:rgb(4,18,106);background:linear-gradient(175deg,rgba(4,18,106,1) 27%,rgba(48,63,155,1) 53%,rgba(28,119,247,1)90%);border-radius:6px 6px 0 0}:host ::ng-deep #academic_plan .p-panel .p-panel-header{color:#fff!important;background:rgb(4,18,106);background:linear-gradient(175deg,rgba(4,18,106,1) 27%,rgba(48,63,155,1) 53%,rgba(28,119,247,1)90%);border-radius:6px 6px 0 0}.card1 .card1__title__kids{color:#fff;padding-left:10px;padding-right:10px;font-size:1.1rem;font-weight:300;z-index:1;position:relative;background:rgb(127,33,99);background:linear-gradient(175deg,rgba(127,33,99,1) 27%,rgba(171,49,135,1) 53%,rgba(220,76,178,1) 90%);border-radius:6px 6px 0 0}:host ::ng-deep #social_kids .p-panel .p-panel-header{color:#fff!important;background:rgb(127,33,99);background:linear-gradient(175deg,rgba(127,33,99,1) 27%,rgba(171,49,135,1) 53%,rgba(220,76,178,1) 90%);border-radius:6px 6px 0 0}.card1 .card1__title__schools{color:#fff;padding-left:10px;padding-right:10px;font-size:1.1rem;font-weight:300;z-index:1;position:relative;background:rgb(57,130,154);background:linear-gradient(175deg,rgba(57,130,154,1) 27%,rgba(44,147,180,1) 53%,rgba(135,182,197,1) 90%);border-radius:6px 6px 0 0}:host ::ng-deep #social_school .p-panel .p-panel-header{color:#fff!important;background:rgb(57,130,154);background:linear-gradient(175deg,rgba(57,130,154,1) 27%,rgba(44,147,180,1) 53%,rgba(135,182,197,1) 90%);border-radius:6px 6px 0 0}.card1 .card1__date{color:#807c7c;padding-left:10px;font-size:.4rem;z-index:1;position:relative;margin-bottom:2%;margin-top:.7rem}.card1 .card1__arrow{padding-left:10px;position:absolute;padding:.3rem;border-top-left-radius:var(--border-radius);border-bottom-right-radius:var(--border-radius);bottom:0;right:0;transition:.2s;display:flex;justify-content:center;align-items:center}.card1 svg{transition:.2s}.card1:hover .card1__title{color:var(--secondary-color)}.card1:hover .card1__arrow{background:rgb(170,41,170)}.card1:hover .card1__arrow svg{transform:translate(3px)}.card1:hover strong{color:#aa29aa;font-weight:400}.card1:hover .course-code{color:#aa29aa;font-weight:500}.image-container{display:flex;border-radius:6px;width:250px;height:207px;box-shadow:#3c40434d 0 1px 2px,#3c404326 0 1px 3px 1px}:host ::ng-deep .p-menubar .p-menuitem{position:relative;width:auto}.green300{height:2%;width:2%;padding-right:9px;border-radius:70%;background:#76db9b;box-shadow:-1px 0 1px 1px #000000fa;border:1px solid rgb(0 0 0 / 40%)}.red300{height:2%;width:2%;padding-right:9px;border-radius:70%;background:#e35b53;box-shadow:-1px 0 1px 1px #000000fa;border:1px solid rgb(0 0 0 / 40%)}.gray300{height:2%;width:2%;padding-right:9px;border-radius:70%;color:#9e9a99;background-color:#9e9a99;box-shadow:-1px 0 1px 1px #000000fa;border:1px solid rgb(0 0 0 / 40%)}label{border-radius:50%}#panel-skeleton{position:relative;overflow:hidden;background:#f0f0f0}#panel-skeleton:after{content:\"\";animation:p-skeleton-animation 1.2s infinite;height:100%;left:0;position:absolute;right:0;top:0;transform:translate(-100%);z-index:1;background:linear-gradient(90deg,rgba(255,255,255,0),rgba(255,255,255,.4),rgba(255,255,255,0))}@keyframes p-skeleton-animation{0%{transform:translate(-100%)}to{transform:translate(100%)}}.container__span-header,.container__span-footer{margin:20px 0;font-weight:700}\n"], dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: i2.Panel, selector: "p-panel", inputs: ["toggleable", "header", "collapsed", "style", "styleClass", "iconPos", "expandIcon", "collapseIcon", "showHeader", "toggler", "transitionOptions"], outputs: ["collapsedChange", "onBeforeToggle", "onAfterToggle"] }, { kind: "directive", type: i2$1.PrimeTemplate, selector: "[pTemplate]", inputs: ["type", "pTemplate"] }, { kind: "component", type: i4.Skeleton, selector: "p-skeleton", inputs: ["styleClass", "style", "shape", "animation", "borderRadius", "size", "width", "height"] }, { kind: "component", type: LoaderComponent, selector: "ipt-loader", inputs: ["message", "isDialog"] }, { kind: "pipe", type: i1.TitleCasePipe, name: "titlecase" }, { kind: "pipe", type: ScheduleFormatPipe, name: "scheduleFormat" }, { kind: "pipe", type: ScheduleTimeFormatPipe, name: "scheduleTimeFormat" }, { kind: "pipe", type: TypeLevelPipe, name: "typeLevel" }] });
+CardCourseComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.0.7", type: CardCourseComponent, selector: "ipt-card-course-self-cod-managed", inputs: { CourseData: "CourseData", isLoading: "isLoading" }, outputs: { codeCourse: "codeCourse" }, usesOnChanges: true, ngImport: i0, template: "<div *ngIf=\"!isLoading\" class=\"main-container\">\n\n  <!-- cards Academy -->\n  <div class=\"container__span-header flex justify-content-start\" *ngIf=\"visibleAcademy || visibleKids || visibleSchools\">\n    <span>Selecciona un Plan</span>\n  </div>\n\n  <p-panel\n  *ngIf=\"visibleAcademy\"\n  header=\"Plan Academy\"\n  [toggleable]=\"true\"\n  [collapsed]=\"false\"\n  id=\"academic_plan\"\n  class=\"academic_plan\"\n  >\n  <ng-template pTemplate=\"icons\"> </ng-template>\n    <main *ngIf=\"!isLoading\" class=\"flex flex-col\">\n      <section *ngFor=\"let course of courseAcademy\" class=\"card1 animate__animated\"  (click)=\"viewDataCourse(course)\">\n        <h3 class=\"card1__title__academic\">{{ course.course_type.label }}</h3>\n        <p class=\"card1__content\">\n          <strong class=\"type-theory\">Clases Teoricas: </strong>{{ course.course_schedule | scheduleFormat }}<br>\n          <strong class=\"type-theory\">Horario Teorico: </strong>{{ course.course_schedule | scheduleTimeFormat }}<br>\n          <!-- <strong class=\"type-theory\">Theory Teacher: </strong>{{ course.teacher | titlecase }}<br> -->\n          <!-- <strong class=\"type-theory\">Theory Classroom: </strong><span>{{ course.course_scheduleDetails[0].ClassRoom.name  | titlecase}}</span><br> -->\n          <strong><hr></strong>\n          <strong class=\"type-club\">Clases Club: </strong>\n            <span *ngIf=\"course.course_club\">{{ course.course_club.course_schedule | scheduleFormat }}</span><br>\n          <strong class=\"type-club\">Horario Club: </strong>\n            <span *ngIf=\"course.course_club\">{{ course.course_club.course_schedule | scheduleTimeFormat }}</span><br>\n          <strong>Modalidad: </strong>\n            <span *ngIf=\"course.course_modality\">{{ course.course_modality.name | titlecase }}</span><br>\n          <!-- <strong class=\"type-club\">Club Teacher: </strong>\n            <span *ngIf=\"course.course_club\">{{ course.course_club.teacher | titlecase }}</span><br> -->\n          <!-- <strong class=\"type-club\">Club Classroom: </strong>\n            <span *ngIf=\"course.course_club\">{{ course.course_club.course_scheduleDetails[0].ClassRoom.name  | titlecase}}</span><br> -->\n          <!-- <strong><hr></strong> -->\n          <!-- <strong *ngIf=\"course.start_date === null\">Posible inicio: </strong>{{ course.start_date === null ? course.to_start : null | date:'dd/MM/yyyy' }}<br *ngIf=\"course.start_date === null\">\n          <strong *ngIf=\"course.start_date !== null\">Fecha Inicio: </strong>{{ course.start_date !== null ? course.start_date : null | date:'dd/MM/yyyy' }}<br *ngIf=\"course.finish_date !== null\">\n          <strong *ngIf=\"course.finish_date !== null\">Fecha culminacion: </strong>{{ course.finish_date !== null ? course.finish_date : null | date:'dd/MM/yyyy' }}<br *ngIf=\"course.finish_date !== null\"> -->\n          <!-- <strong>Created: </strong>{{ course.created_at | date:'dd/MM/yyyy' }}<br> -->\n        </p>\n        <div class=\"card1__date\">\n          <!-- <span\n          [ngClass]=\"course.status?.color_status\"\n          ></span> -->\n          <!-- <span class=\"course-code\">Code: {{course.code}}</span> -->\n        </div>\n        <div class=\"card1__arrow\" [ngClass]=\"getCssClass(course.english_level.name)\">\n          <span>{{ course.english_level.name | typeLevel}}</span>\n        </div>\n      </section>\n    </main>\n    <ipt-loader *ngIf=\"isLoading\"></ipt-loader>\n  </p-panel>\n\n  <!-- cards Kids -->\n\n  <p-panel\n  *ngIf=\"visibleKids\"\n  header=\"Plan Kids\"\n  [toggleable]=\"true\"\n  [collapsed]=\"false\"\n  id=\"social_kids\"\n  >\n  <ng-template pTemplate=\"icons\"> </ng-template>\n    <main *ngIf=\"!isLoading\" class=\"flex flex-col\">\n      <section *ngFor=\"let course of courseKids\" class=\"card1 animate__animated\"  (click)=\"viewDataCourse(course)\">\n        <h3 class=\"card1__title__kids\">{{ course.course_type.label }}</h3>\n        <p class=\"card1__content\">\n          <strong class=\"type-theory\">Clases Teoricas: </strong>{{ course.course_schedule | scheduleFormat }}<br>\n          <strong class=\"type-theory\">Horario Teorico: </strong>{{ course.course_schedule | scheduleTimeFormat }}<br>\n          <!-- <strong class=\"type-theory\">Theory Teacher: </strong>{{ course.teacher | titlecase }}<br>\n          <strong class=\"type-theory\">Theory Classroom: </strong><span>{{ course.course_scheduleDetails[0].ClassRoom.name  | titlecase}}</span><br> -->\n          <strong><hr></strong>\n          <strong class=\"type-club\">Clases Club: </strong>\n            <span *ngIf=\"course.course_club\">{{ course.course_club.course_schedule | scheduleFormat }}</span><br>\n          <strong class=\"type-club\">Horario Club: </strong>\n            <span *ngIf=\"course.course_club\">{{ course.course_club.course_schedule | scheduleTimeFormat }}</span><br>\n          <strong>Modalidad: </strong>\n            <span *ngIf=\"course.course_modality\">{{ course.course_modality.name | titlecase }}</span><br>\n          <!-- <strong class=\"type-club\">Club Teacher: </strong>\n            <span *ngIf=\"course.course_club\">{{ course.course_club.teacher | titlecase }}</span><br> -->\n          <!-- <strong class=\"type-club\">Club Classroom: </strong>\n            <span *ngIf=\"course.course_club\">{{ course.course_club.course_scheduleDetails[0].ClassRoom.name  | titlecase}}</span><br> -->\n          <!-- <strong><hr></strong> -->\n          <!-- <strong *ngIf=\"course.start_date === null\">Posible inicio: </strong>{{ course.start_date === null ? course.to_start : null | date:'dd/MM/yyyy' }}<br *ngIf=\"course.start_date === null\">\n          <strong *ngIf=\"course.start_date !== null\">Fecha Inicio: </strong>{{ course.start_date !== null ? course.start_date : null | date:'dd/MM/yyyy' }}<br *ngIf=\"course.finish_date !== null\">\n          <strong *ngIf=\"course.finish_date !== null\">Fecha culminacion: </strong>{{ course.finish_date !== null ? course.finish_date : null | date:'dd/MM/yyyy' }}<br *ngIf=\"course.finish_date !== null\"> -->\n          <!-- <strong>Created: </strong>{{ course.created_at | date:'dd/MM/yyyy' }}<br> -->\n        </p>\n        <div class=\"card1__date\">\n          <!-- <span\n          [ngClass]=\"course.status?.color_status\"\n          ></span> -->\n          <!-- <span class=\"course-code\">Code: {{course.code}}</span> -->\n        </div>\n        <div class=\"card1__arrow\" [ngClass]=\"getCssClass(course.english_level.name)\">\n          <span>{{ course.english_level.name | typeLevel}}</span>\n        </div>\n      </section>\n    </main>\n    <ipt-loader *ngIf=\"isLoading\"></ipt-loader>\n  </p-panel>\n\n  <!-- cards Schools -->\n\n  <p-panel\n  *ngIf=\"visibleSchools\"\n  header=\"Plan Schools\"\n  [toggleable]=\"true\"\n  [collapsed]=\"false\"\n  id=\"social_school\"\n  >\n  <ng-template pTemplate=\"icons\"> </ng-template>\n    <main *ngIf=\"!isLoading\" class=\"flex flex-col\">\n      <section *ngFor=\"let course of courseSchools\" class=\"card1 animate__animated\"  (click)=\"viewDataCourse(course)\">\n        <h3 class=\"card1__title__schools\">{{ course.course_type.label }}</h3>\n        <p class=\"card1__content\">\n          <strong class=\"type-theory\">Clases Teoricas: </strong>{{ course.course_schedule | scheduleFormat }}<br>\n          <strong class=\"type-theory\">Horario Teorico: </strong>{{ course.course_schedule | scheduleTimeFormat }}<br>\n          <!-- <strong class=\"type-theory\">Theory Teacher: </strong>{{ course.teacher | titlecase }}<br>\n          <strong class=\"type-theory\">Theory Classroom: </strong><span>{{ course.course_scheduleDetails[0].ClassRoom.name  | titlecase}}</span><br> -->\n          <strong><hr></strong>\n          <strong class=\"type-club\">Clases Club: </strong>\n            <span *ngIf=\"course.course_club\">{{ course.course_club.course_schedule | scheduleFormat }}</span><br>\n          <strong class=\"type-club\">Horario Club: </strong>\n            <span *ngIf=\"course.course_club\">{{ course.course_club.course_schedule | scheduleTimeFormat }}</span><br>\n          <strong>Modalidad: </strong>\n            <span *ngIf=\"course.course_modality\">{{ course.course_modality.name | titlecase }}</span><br>\n          <!-- <strong class=\"type-club\">Club Teacher: </strong>\n            <span *ngIf=\"course.course_club\">{{ course.course_club.teacher | titlecase }}</span><br>\n          <strong class=\"type-club\">Club Classroom: </strong>\n            <span *ngIf=\"course.course_club\">{{ course.course_club.course_scheduleDetails[0].ClassRoom.name  | titlecase}}</span><br> -->\n          <!-- <strong><hr></strong> -->\n          <!-- <strong *ngIf=\"course.start_date === null\">Posible inicio: </strong>{{ course.start_date === null ? course.to_start : null | date:'dd/MM/yyyy' }}<br *ngIf=\"course.start_date === null\">\n          <strong *ngIf=\"course.start_date !== null\">Fecha Inicio: </strong>{{ course.start_date !== null ? course.start_date : null | date:'dd/MM/yyyy' }}<br *ngIf=\"course.finish_date !== null\">\n          <strong *ngIf=\"course.finish_date !== null\">Fecha culminacion: </strong>{{ course.finish_date !== null ? course.finish_date : null | date:'dd/MM/yyyy' }}<br *ngIf=\"course.finish_date !== null\"> -->\n          <!-- <strong>Created: </strong>{{ course.created_at | date:'dd/MM/yyyy' }}<br> -->\n        </p>\n        <div class=\"card1__date\">\n          <!-- <span\n          [ngClass]=\"course.status?.color_status\"\n          ></span> -->\n          <!-- <span class=\"course-code\">Code: {{course.code}}</span> -->\n        </div>\n        <div class=\"card1__arrow\" [ngClass]=\"getCssClass(course.english_level.name)\">\n          <span>{{ course.english_level.name | typeLevel}}</span>\n        </div>\n      </section>\n    </main>\n    <ipt-loader *ngIf=\"isLoading\"></ipt-loader>\n  </p-panel>\n\n  <div class=\"container__span-footer flex justify-content-center\" *ngIf=\"!visibleAcademy && !visibleKids && !visibleSchools\">\n    <span>No se encontraron planes</span>\n  </div>\n</div>\n<div *ngIf=\"isLoading\">\n\n  <p-panel\n  header=\"\"\n  [toggleable]=\"true\"\n  [collapsed]=\"false\"\n  id=\"p-component panel-skeleton\"\n  >\n  <ng-template pTemplate=\"icons\"> </ng-template>\n    <main class=\"flex flex-col\">\n      <section *ngFor=\"let course of skeleton\" class=\"card1 animate__animated\"  >\n        <p-skeleton width=\"12rem\" height=\"2rem\" styleClass=\"mb-2\" ></p-skeleton>\n        <p class=\"card1__content_skeleton\">\n          <p-skeleton width=\"9rem\" height=\"1rem\" styleClass=\"mb-2\" ></p-skeleton>\n          <p-skeleton width=\"9rem\" height=\"1rem\" styleClass=\"mb-2\" ></p-skeleton>\n          <strong><hr></strong>\n          <p-skeleton width=\"9rem\" height=\"1rem\" styleClass=\"mb-2\" ></p-skeleton>\n          <p-skeleton width=\"9rem\" height=\"1rem\" styleClass=\"mb-2\" ></p-skeleton>\n        </p>\n        <div class=\"card1__date__skeleton\">\n        </div>\n        <div class=\"card1__arrow\" >\n          <p-skeleton size=\"3rem\" styleClass=\"mr-2\" ></p-skeleton>\n        </div>\n      </section>\n    </main>\n  </p-panel>\n\n</div>\n\n", styles: ["main{display:flex;gap:.7rem;flex-wrap:wrap}.card1{--border-radius: 3px;--primary-color: #1c77f7;--secondary-color: #2c2c2c;--tertiary-color: #ffffff;width:340px;font-family:Poppins,sans-serif;cursor:pointer;border-radius:var(--border-radius);background:#f1f1f3;box-shadow:0 8px 16px #00000008;position:relative;transition:.3s;border:solid .5px #e0e0e0}.type-theory{color:#00aecc}.type-club{color:#0d9d36}.msg-two-coup{color:#000!important;padding-left:7px;padding-right:7px;border-radius:5px;background-color:#4ed1e9}.msg-two-lev{color:#000!important;padding-left:5px;padding-right:5px;border-radius:5px;margin-left:13px;background-color:#fb8f42}.beginner{color:#fff!important;padding-left:5px;padding-right:5px;border-radius:5px;margin-left:13px;background-color:#94b9aa}.levelAone{color:#fff!important;padding-left:5px;padding-right:5px;border-radius:5px;margin-left:13px;background-color:#c4291c}.levelAonetwo{color:#fff!important;padding-left:5px;padding-right:5px;border-radius:5px;margin-left:13px;background-color:#418ed1}.levelAtwo{color:#fff!important;padding-left:5px;padding-right:5px;border-radius:5px;margin-left:13px;background-color:#4fad65}.levelBone{color:#fff!important;padding-left:5px;padding-right:5px;border-radius:5px;margin-left:13px;background-color:#6824b8}.levelBtwo{color:#fff!important;padding-left:5px;padding-right:5px;border-radius:5px;margin-left:13px;background-color:#06161e}.levelBplus{color:#fff!important;padding-left:5px;padding-right:5px;border-radius:5px;margin-left:13px;background-color:#cc6529}.main-container{margin-top:1%}.course-code{font-size:12px;font-weight:400;margin-left:.5rem}.card1:hover{box-shadow:#0000003d 0 3px 8px}.card1>*+*{margin-top:.7em}.card1 .card1__content{padding-left:10px;color:var(--secondary-color);font-size:.86rem;font-weight:200;z-index:1;position:relative}strong{color:var(--secondary-color);font-weight:300}:host ::ng-deep .p-panel .p-panel-header .p-panel-header-icon{color:#fff!important}.card1 .card1__title__academic{color:#fff;padding-left:10px;padding-right:10px;font-size:1.1rem;font-weight:300;z-index:1;position:relative;background:rgb(4,18,106);background:linear-gradient(175deg,rgba(4,18,106,1) 27%,rgba(48,63,155,1) 53%,rgba(28,119,247,1)90%);border-radius:6px 6px 0 0}:host ::ng-deep #academic_plan .p-panel .p-panel-header{color:#fff!important;background:rgb(4,18,106);background:linear-gradient(175deg,rgba(4,18,106,1) 27%,rgba(48,63,155,1) 53%,rgba(28,119,247,1)90%);border-radius:6px 6px 0 0}.card1 .card1__title__kids{color:#fff;padding-left:10px;padding-right:10px;font-size:1.1rem;font-weight:300;z-index:1;position:relative;background:rgb(127,33,99);background:linear-gradient(175deg,rgba(127,33,99,1) 27%,rgba(171,49,135,1) 53%,rgba(220,76,178,1) 90%);border-radius:6px 6px 0 0}:host ::ng-deep #social_kids .p-panel .p-panel-header{color:#fff!important;background:rgb(127,33,99);background:linear-gradient(175deg,rgba(127,33,99,1) 27%,rgba(171,49,135,1) 53%,rgba(220,76,178,1) 90%);border-radius:6px 6px 0 0}.card1 .card1__title__schools{color:#fff;padding-left:10px;padding-right:10px;font-size:1.1rem;font-weight:300;z-index:1;position:relative;background:rgb(57,130,154);background:linear-gradient(175deg,rgba(57,130,154,1) 27%,rgba(44,147,180,1) 53%,rgba(135,182,197,1) 90%);border-radius:6px 6px 0 0}:host ::ng-deep #social_school .p-panel .p-panel-header{color:#fff!important;background:rgb(57,130,154);background:linear-gradient(175deg,rgba(57,130,154,1) 27%,rgba(44,147,180,1) 53%,rgba(135,182,197,1) 90%);border-radius:6px 6px 0 0}.card1 .card1__date{color:#807c7c;padding-left:10px;font-size:.4rem;z-index:1;position:relative;margin-bottom:2%;margin-top:.7rem}.card1 .card1__arrow{padding-left:10px;position:absolute;padding:.3rem;border-top-left-radius:var(--border-radius);border-bottom-right-radius:var(--border-radius);bottom:0;right:0;transition:.2s;display:flex;justify-content:center;align-items:center}.card1 svg{transition:.2s}.card1:hover .card1__title{color:var(--secondary-color)}.card1:hover .card1__arrow{background:rgb(170,41,170)}.card1:hover .card1__arrow svg{transform:translate(3px)}.card1:hover strong{color:#aa29aa;font-weight:400}.card1:hover .course-code{color:#aa29aa;font-weight:500}.image-container{display:flex;border-radius:6px;width:250px;height:207px;box-shadow:#3c40434d 0 1px 2px,#3c404326 0 1px 3px 1px}:host ::ng-deep .p-menubar .p-menuitem{position:relative;width:auto}.green300{height:2%;width:2%;padding-right:9px;border-radius:70%;background:#76db9b;box-shadow:-1px 0 1px 1px #000000fa;border:1px solid rgb(0 0 0 / 40%)}.red300{height:2%;width:2%;padding-right:9px;border-radius:70%;background:#e35b53;box-shadow:-1px 0 1px 1px #000000fa;border:1px solid rgb(0 0 0 / 40%)}.gray300{height:2%;width:2%;padding-right:9px;border-radius:70%;color:#9e9a99;background-color:#9e9a99;box-shadow:-1px 0 1px 1px #000000fa;border:1px solid rgb(0 0 0 / 40%)}label{border-radius:50%}#panel-skeleton{position:relative;overflow:hidden;background:#f0f0f0}#panel-skeleton:after{content:\"\";animation:p-skeleton-animation 1.2s infinite;height:100%;left:0;position:absolute;right:0;top:0;transform:translate(-100%);z-index:1;background:linear-gradient(90deg,rgba(255,255,255,0),rgba(255,255,255,.4),rgba(255,255,255,0))}@keyframes p-skeleton-animation{0%{transform:translate(-100%)}to{transform:translate(100%)}}.container__span-header,.container__span-footer{margin:20px 0;font-weight:700}\n"], dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: i2.Panel, selector: "p-panel", inputs: ["toggleable", "header", "collapsed", "style", "styleClass", "iconPos", "expandIcon", "collapseIcon", "showHeader", "toggler", "transitionOptions"], outputs: ["collapsedChange", "onBeforeToggle", "onAfterToggle"] }, { kind: "directive", type: i2$1.PrimeTemplate, selector: "[pTemplate]", inputs: ["type", "pTemplate"] }, { kind: "component", type: i4.Skeleton, selector: "p-skeleton", inputs: ["styleClass", "style", "shape", "animation", "borderRadius", "size", "width", "height"] }, { kind: "component", type: LoaderComponent, selector: "ipt-loader", inputs: ["message", "isDialog"] }, { kind: "pipe", type: i1.TitleCasePipe, name: "titlecase" }, { kind: "pipe", type: ScheduleFormatPipe, name: "scheduleFormat" }, { kind: "pipe", type: ScheduleTimeFormatPipe, name: "scheduleTimeFormat" }, { kind: "pipe", type: TypeLevelPipe, name: "typeLevel" }] });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.0.7", ngImport: i0, type: CardCourseComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'ipt-card-course-self-cod-managed', template: "<div *ngIf=\"!isLoading\" class=\"main-container\">\r\n\r\n  <!-- cards Academy -->\r\n  <div class=\"container__span-header flex justify-content-start\" *ngIf=\"visibleAcademy || visibleKids || visibleSchools\">\r\n    <span>Selecciona un Plan</span>\r\n  </div>\r\n\r\n  <p-panel\r\n  *ngIf=\"visibleAcademy\"\r\n  header=\"Plan Academy\"\r\n  [toggleable]=\"true\"\r\n  [collapsed]=\"false\"\r\n  id=\"academic_plan\"\r\n  class=\"academic_plan\"\r\n  >\r\n  <ng-template pTemplate=\"icons\"> </ng-template>\r\n    <main *ngIf=\"!isLoading\" class=\"flex flex-col\">\r\n      <section *ngFor=\"let course of courseAcademy\" class=\"card1 animate__animated\"  (click)=\"viewDataCourse(course)\">\r\n        <h3 class=\"card1__title__academic\">{{ course.course_type.label }}</h3>\r\n        <p class=\"card1__content\">\r\n          <strong class=\"type-theory\">Clases Teoricas: </strong>{{ course.course_schedule | scheduleFormat }}<br>\r\n          <strong class=\"type-theory\">Horario Teorico: </strong>{{ course.course_schedule | scheduleTimeFormat }}<br>\r\n          <!-- <strong class=\"type-theory\">Theory Teacher: </strong>{{ course.teacher | titlecase }}<br> -->\r\n          <!-- <strong class=\"type-theory\">Theory Classroom: </strong><span>{{ course.course_scheduleDetails[0].ClassRoom.name  | titlecase}}</span><br> -->\r\n          <strong><hr></strong>\r\n          <strong class=\"type-club\">Clases Club: </strong>\r\n            <span *ngIf=\"course.course_club\">{{ course.course_club.course_schedule | scheduleFormat }}</span><br>\r\n          <strong class=\"type-club\">Horario Club: </strong>\r\n            <span *ngIf=\"course.course_club\">{{ course.course_club.course_schedule | scheduleTimeFormat }}</span><br>\r\n          <strong>Modalidad: </strong>\r\n            <span *ngIf=\"course.course_modality\">{{ course.course_modality.name | titlecase }}</span><br>\r\n          <!-- <strong class=\"type-club\">Club Teacher: </strong>\r\n            <span *ngIf=\"course.course_club\">{{ course.course_club.teacher | titlecase }}</span><br> -->\r\n          <!-- <strong class=\"type-club\">Club Classroom: </strong>\r\n            <span *ngIf=\"course.course_club\">{{ course.course_club.course_scheduleDetails[0].ClassRoom.name  | titlecase}}</span><br> -->\r\n          <!-- <strong><hr></strong> -->\r\n          <!-- <strong *ngIf=\"course.start_date === null\">Posible inicio: </strong>{{ course.start_date === null ? course.to_start : null | date:'dd/MM/yyyy' }}<br *ngIf=\"course.start_date === null\">\r\n          <strong *ngIf=\"course.start_date !== null\">Fecha Inicio: </strong>{{ course.start_date !== null ? course.start_date : null | date:'dd/MM/yyyy' }}<br *ngIf=\"course.finish_date !== null\">\r\n          <strong *ngIf=\"course.finish_date !== null\">Fecha culminacion: </strong>{{ course.finish_date !== null ? course.finish_date : null | date:'dd/MM/yyyy' }}<br *ngIf=\"course.finish_date !== null\"> -->\r\n          <!-- <strong>Created: </strong>{{ course.created_at | date:'dd/MM/yyyy' }}<br> -->\r\n        </p>\r\n        <div class=\"card1__date\">\r\n          <!-- <span\r\n          [ngClass]=\"course.status?.color_status\"\r\n          ></span> -->\r\n          <!-- <span class=\"course-code\">Code: {{course.code}}</span> -->\r\n        </div>\r\n        <div class=\"card1__arrow\" [ngClass]=\"getCssClass(course.english_level.name)\">\r\n          <span>{{ course.english_level.name | typeLevel}}</span>\r\n        </div>\r\n      </section>\r\n    </main>\r\n    <ipt-loader *ngIf=\"isLoading\"></ipt-loader>\r\n  </p-panel>\r\n\r\n  <!-- cards Kids -->\r\n\r\n  <p-panel\r\n  *ngIf=\"visibleKids\"\r\n  header=\"Plan Kids\"\r\n  [toggleable]=\"true\"\r\n  [collapsed]=\"false\"\r\n  id=\"social_kids\"\r\n  >\r\n  <ng-template pTemplate=\"icons\"> </ng-template>\r\n    <main *ngIf=\"!isLoading\" class=\"flex flex-col\">\r\n      <section *ngFor=\"let course of courseKids\" class=\"card1 animate__animated\"  (click)=\"viewDataCourse(course)\">\r\n        <h3 class=\"card1__title__kids\">{{ course.course_type.label }}</h3>\r\n        <p class=\"card1__content\">\r\n          <strong class=\"type-theory\">Clases Teoricas: </strong>{{ course.course_schedule | scheduleFormat }}<br>\r\n          <strong class=\"type-theory\">Horario Teorico: </strong>{{ course.course_schedule | scheduleTimeFormat }}<br>\r\n          <!-- <strong class=\"type-theory\">Theory Teacher: </strong>{{ course.teacher | titlecase }}<br>\r\n          <strong class=\"type-theory\">Theory Classroom: </strong><span>{{ course.course_scheduleDetails[0].ClassRoom.name  | titlecase}}</span><br> -->\r\n          <strong><hr></strong>\r\n          <strong class=\"type-club\">Clases Club: </strong>\r\n            <span *ngIf=\"course.course_club\">{{ course.course_club.course_schedule | scheduleFormat }}</span><br>\r\n          <strong class=\"type-club\">Horario Club: </strong>\r\n            <span *ngIf=\"course.course_club\">{{ course.course_club.course_schedule | scheduleTimeFormat }}</span><br>\r\n          <strong>Modalidad: </strong>\r\n            <span *ngIf=\"course.course_modality\">{{ course.course_modality.name | titlecase }}</span><br>\r\n          <!-- <strong class=\"type-club\">Club Teacher: </strong>\r\n            <span *ngIf=\"course.course_club\">{{ course.course_club.teacher | titlecase }}</span><br> -->\r\n          <!-- <strong class=\"type-club\">Club Classroom: </strong>\r\n            <span *ngIf=\"course.course_club\">{{ course.course_club.course_scheduleDetails[0].ClassRoom.name  | titlecase}}</span><br> -->\r\n          <!-- <strong><hr></strong> -->\r\n          <!-- <strong *ngIf=\"course.start_date === null\">Posible inicio: </strong>{{ course.start_date === null ? course.to_start : null | date:'dd/MM/yyyy' }}<br *ngIf=\"course.start_date === null\">\r\n          <strong *ngIf=\"course.start_date !== null\">Fecha Inicio: </strong>{{ course.start_date !== null ? course.start_date : null | date:'dd/MM/yyyy' }}<br *ngIf=\"course.finish_date !== null\">\r\n          <strong *ngIf=\"course.finish_date !== null\">Fecha culminacion: </strong>{{ course.finish_date !== null ? course.finish_date : null | date:'dd/MM/yyyy' }}<br *ngIf=\"course.finish_date !== null\"> -->\r\n          <!-- <strong>Created: </strong>{{ course.created_at | date:'dd/MM/yyyy' }}<br> -->\r\n        </p>\r\n        <div class=\"card1__date\">\r\n          <!-- <span\r\n          [ngClass]=\"course.status?.color_status\"\r\n          ></span> -->\r\n          <!-- <span class=\"course-code\">Code: {{course.code}}</span> -->\r\n        </div>\r\n        <div class=\"card1__arrow\" [ngClass]=\"getCssClass(course.english_level.name)\">\r\n          <span>{{ course.english_level.name | typeLevel}}</span>\r\n        </div>\r\n      </section>\r\n    </main>\r\n    <ipt-loader *ngIf=\"isLoading\"></ipt-loader>\r\n  </p-panel>\r\n\r\n  <!-- cards Schools -->\r\n\r\n  <p-panel\r\n  *ngIf=\"visibleSchools\"\r\n  header=\"Plan Schools\"\r\n  [toggleable]=\"true\"\r\n  [collapsed]=\"false\"\r\n  id=\"social_school\"\r\n  >\r\n  <ng-template pTemplate=\"icons\"> </ng-template>\r\n    <main *ngIf=\"!isLoading\" class=\"flex flex-col\">\r\n      <section *ngFor=\"let course of courseSchools\" class=\"card1 animate__animated\"  (click)=\"viewDataCourse(course)\">\r\n        <h3 class=\"card1__title__schools\">{{ course.course_type.label }}</h3>\r\n        <p class=\"card1__content\">\r\n          <strong class=\"type-theory\">Clases Teoricas: </strong>{{ course.course_schedule | scheduleFormat }}<br>\r\n          <strong class=\"type-theory\">Horario Teorico: </strong>{{ course.course_schedule | scheduleTimeFormat }}<br>\r\n          <!-- <strong class=\"type-theory\">Theory Teacher: </strong>{{ course.teacher | titlecase }}<br>\r\n          <strong class=\"type-theory\">Theory Classroom: </strong><span>{{ course.course_scheduleDetails[0].ClassRoom.name  | titlecase}}</span><br> -->\r\n          <strong><hr></strong>\r\n          <strong class=\"type-club\">Clases Club: </strong>\r\n            <span *ngIf=\"course.course_club\">{{ course.course_club.course_schedule | scheduleFormat }}</span><br>\r\n          <strong class=\"type-club\">Horario Club: </strong>\r\n            <span *ngIf=\"course.course_club\">{{ course.course_club.course_schedule | scheduleTimeFormat }}</span><br>\r\n          <strong>Modalidad: </strong>\r\n            <span *ngIf=\"course.course_modality\">{{ course.course_modality.name | titlecase }}</span><br>\r\n          <!-- <strong class=\"type-club\">Club Teacher: </strong>\r\n            <span *ngIf=\"course.course_club\">{{ course.course_club.teacher | titlecase }}</span><br>\r\n          <strong class=\"type-club\">Club Classroom: </strong>\r\n            <span *ngIf=\"course.course_club\">{{ course.course_club.course_scheduleDetails[0].ClassRoom.name  | titlecase}}</span><br> -->\r\n          <!-- <strong><hr></strong> -->\r\n          <!-- <strong *ngIf=\"course.start_date === null\">Posible inicio: </strong>{{ course.start_date === null ? course.to_start : null | date:'dd/MM/yyyy' }}<br *ngIf=\"course.start_date === null\">\r\n          <strong *ngIf=\"course.start_date !== null\">Fecha Inicio: </strong>{{ course.start_date !== null ? course.start_date : null | date:'dd/MM/yyyy' }}<br *ngIf=\"course.finish_date !== null\">\r\n          <strong *ngIf=\"course.finish_date !== null\">Fecha culminacion: </strong>{{ course.finish_date !== null ? course.finish_date : null | date:'dd/MM/yyyy' }}<br *ngIf=\"course.finish_date !== null\"> -->\r\n          <!-- <strong>Created: </strong>{{ course.created_at | date:'dd/MM/yyyy' }}<br> -->\r\n        </p>\r\n        <div class=\"card1__date\">\r\n          <!-- <span\r\n          [ngClass]=\"course.status?.color_status\"\r\n          ></span> -->\r\n          <!-- <span class=\"course-code\">Code: {{course.code}}</span> -->\r\n        </div>\r\n        <div class=\"card1__arrow\" [ngClass]=\"getCssClass(course.english_level.name)\">\r\n          <span>{{ course.english_level.name | typeLevel}}</span>\r\n        </div>\r\n      </section>\r\n    </main>\r\n    <ipt-loader *ngIf=\"isLoading\"></ipt-loader>\r\n  </p-panel>\r\n\r\n  <div class=\"container__span-footer flex justify-content-center\" *ngIf=\"!visibleAcademy && !visibleKids && !visibleSchools\">\r\n    <span>No se encontraron planes</span>\r\n  </div>\r\n</div>\r\n<div *ngIf=\"isLoading\">\r\n\r\n  <p-panel\r\n  header=\"\"\r\n  [toggleable]=\"true\"\r\n  [collapsed]=\"false\"\r\n  id=\"p-component panel-skeleton\"\r\n  >\r\n  <ng-template pTemplate=\"icons\"> </ng-template>\r\n    <main class=\"flex flex-col\">\r\n      <section *ngFor=\"let course of skeleton\" class=\"card1 animate__animated\"  >\r\n        <p-skeleton width=\"12rem\" height=\"2rem\" styleClass=\"mb-2\" ></p-skeleton>\r\n        <p class=\"card1__content_skeleton\">\r\n          <p-skeleton width=\"9rem\" height=\"1rem\" styleClass=\"mb-2\" ></p-skeleton>\r\n          <p-skeleton width=\"9rem\" height=\"1rem\" styleClass=\"mb-2\" ></p-skeleton>\r\n          <strong><hr></strong>\r\n          <p-skeleton width=\"9rem\" height=\"1rem\" styleClass=\"mb-2\" ></p-skeleton>\r\n          <p-skeleton width=\"9rem\" height=\"1rem\" styleClass=\"mb-2\" ></p-skeleton>\r\n        </p>\r\n        <div class=\"card1__date__skeleton\">\r\n        </div>\r\n        <div class=\"card1__arrow\" >\r\n          <p-skeleton size=\"3rem\" styleClass=\"mr-2\" ></p-skeleton>\r\n        </div>\r\n      </section>\r\n    </main>\r\n  </p-panel>\r\n\r\n</div>\r\n\r\n", styles: ["main{display:flex;gap:.7rem;flex-wrap:wrap}.card1{--border-radius: 3px;--primary-color: #1c77f7;--secondary-color: #2c2c2c;--tertiary-color: #ffffff;width:340px;font-family:Poppins,sans-serif;cursor:pointer;border-radius:var(--border-radius);background:#f1f1f3;box-shadow:0 8px 16px #00000008;position:relative;transition:.3s;border:solid .5px #e0e0e0}.type-theory{color:#00aecc}.type-club{color:#0d9d36}.msg-two-coup{color:#000!important;padding-left:7px;padding-right:7px;border-radius:5px;background-color:#4ed1e9}.msg-two-lev{color:#000!important;padding-left:5px;padding-right:5px;border-radius:5px;margin-left:13px;background-color:#fb8f42}.beginner{color:#fff!important;padding-left:5px;padding-right:5px;border-radius:5px;margin-left:13px;background-color:#94b9aa}.levelAone{color:#fff!important;padding-left:5px;padding-right:5px;border-radius:5px;margin-left:13px;background-color:#c4291c}.levelAonetwo{color:#fff!important;padding-left:5px;padding-right:5px;border-radius:5px;margin-left:13px;background-color:#418ed1}.levelAtwo{color:#fff!important;padding-left:5px;padding-right:5px;border-radius:5px;margin-left:13px;background-color:#4fad65}.levelBone{color:#fff!important;padding-left:5px;padding-right:5px;border-radius:5px;margin-left:13px;background-color:#6824b8}.levelBtwo{color:#fff!important;padding-left:5px;padding-right:5px;border-radius:5px;margin-left:13px;background-color:#06161e}.levelBplus{color:#fff!important;padding-left:5px;padding-right:5px;border-radius:5px;margin-left:13px;background-color:#cc6529}.main-container{margin-top:1%}.course-code{font-size:12px;font-weight:400;margin-left:.5rem}.card1:hover{box-shadow:#0000003d 0 3px 8px}.card1>*+*{margin-top:.7em}.card1 .card1__content{padding-left:10px;color:var(--secondary-color);font-size:.86rem;font-weight:200;z-index:1;position:relative}strong{color:var(--secondary-color);font-weight:300}:host ::ng-deep .p-panel .p-panel-header .p-panel-header-icon{color:#fff!important}.card1 .card1__title__academic{color:#fff;padding-left:10px;padding-right:10px;font-size:1.1rem;font-weight:300;z-index:1;position:relative;background:rgb(4,18,106);background:linear-gradient(175deg,rgba(4,18,106,1) 27%,rgba(48,63,155,1) 53%,rgba(28,119,247,1)90%);border-radius:6px 6px 0 0}:host ::ng-deep #academic_plan .p-panel .p-panel-header{color:#fff!important;background:rgb(4,18,106);background:linear-gradient(175deg,rgba(4,18,106,1) 27%,rgba(48,63,155,1) 53%,rgba(28,119,247,1)90%);border-radius:6px 6px 0 0}.card1 .card1__title__kids{color:#fff;padding-left:10px;padding-right:10px;font-size:1.1rem;font-weight:300;z-index:1;position:relative;background:rgb(127,33,99);background:linear-gradient(175deg,rgba(127,33,99,1) 27%,rgba(171,49,135,1) 53%,rgba(220,76,178,1) 90%);border-radius:6px 6px 0 0}:host ::ng-deep #social_kids .p-panel .p-panel-header{color:#fff!important;background:rgb(127,33,99);background:linear-gradient(175deg,rgba(127,33,99,1) 27%,rgba(171,49,135,1) 53%,rgba(220,76,178,1) 90%);border-radius:6px 6px 0 0}.card1 .card1__title__schools{color:#fff;padding-left:10px;padding-right:10px;font-size:1.1rem;font-weight:300;z-index:1;position:relative;background:rgb(57,130,154);background:linear-gradient(175deg,rgba(57,130,154,1) 27%,rgba(44,147,180,1) 53%,rgba(135,182,197,1) 90%);border-radius:6px 6px 0 0}:host ::ng-deep #social_school .p-panel .p-panel-header{color:#fff!important;background:rgb(57,130,154);background:linear-gradient(175deg,rgba(57,130,154,1) 27%,rgba(44,147,180,1) 53%,rgba(135,182,197,1) 90%);border-radius:6px 6px 0 0}.card1 .card1__date{color:#807c7c;padding-left:10px;font-size:.4rem;z-index:1;position:relative;margin-bottom:2%;margin-top:.7rem}.card1 .card1__arrow{padding-left:10px;position:absolute;padding:.3rem;border-top-left-radius:var(--border-radius);border-bottom-right-radius:var(--border-radius);bottom:0;right:0;transition:.2s;display:flex;justify-content:center;align-items:center}.card1 svg{transition:.2s}.card1:hover .card1__title{color:var(--secondary-color)}.card1:hover .card1__arrow{background:rgb(170,41,170)}.card1:hover .card1__arrow svg{transform:translate(3px)}.card1:hover strong{color:#aa29aa;font-weight:400}.card1:hover .course-code{color:#aa29aa;font-weight:500}.image-container{display:flex;border-radius:6px;width:250px;height:207px;box-shadow:#3c40434d 0 1px 2px,#3c404326 0 1px 3px 1px}:host ::ng-deep .p-menubar .p-menuitem{position:relative;width:auto}.green300{height:2%;width:2%;padding-right:9px;border-radius:70%;background:#76db9b;box-shadow:-1px 0 1px 1px #000000fa;border:1px solid rgb(0 0 0 / 40%)}.red300{height:2%;width:2%;padding-right:9px;border-radius:70%;background:#e35b53;box-shadow:-1px 0 1px 1px #000000fa;border:1px solid rgb(0 0 0 / 40%)}.gray300{height:2%;width:2%;padding-right:9px;border-radius:70%;color:#9e9a99;background-color:#9e9a99;box-shadow:-1px 0 1px 1px #000000fa;border:1px solid rgb(0 0 0 / 40%)}label{border-radius:50%}#panel-skeleton{position:relative;overflow:hidden;background:#f0f0f0}#panel-skeleton:after{content:\"\";animation:p-skeleton-animation 1.2s infinite;height:100%;left:0;position:absolute;right:0;top:0;transform:translate(-100%);z-index:1;background:linear-gradient(90deg,rgba(255,255,255,0),rgba(255,255,255,.4),rgba(255,255,255,0))}@keyframes p-skeleton-animation{0%{transform:translate(-100%)}to{transform:translate(100%)}}.container__span-header,.container__span-footer{margin:20px 0;font-weight:700}\n"] }]
+            args: [{ selector: 'ipt-card-course-self-cod-managed', template: "<div *ngIf=\"!isLoading\" class=\"main-container\">\n\n  <!-- cards Academy -->\n  <div class=\"container__span-header flex justify-content-start\" *ngIf=\"visibleAcademy || visibleKids || visibleSchools\">\n    <span>Selecciona un Plan</span>\n  </div>\n\n  <p-panel\n  *ngIf=\"visibleAcademy\"\n  header=\"Plan Academy\"\n  [toggleable]=\"true\"\n  [collapsed]=\"false\"\n  id=\"academic_plan\"\n  class=\"academic_plan\"\n  >\n  <ng-template pTemplate=\"icons\"> </ng-template>\n    <main *ngIf=\"!isLoading\" class=\"flex flex-col\">\n      <section *ngFor=\"let course of courseAcademy\" class=\"card1 animate__animated\"  (click)=\"viewDataCourse(course)\">\n        <h3 class=\"card1__title__academic\">{{ course.course_type.label }}</h3>\n        <p class=\"card1__content\">\n          <strong class=\"type-theory\">Clases Teoricas: </strong>{{ course.course_schedule | scheduleFormat }}<br>\n          <strong class=\"type-theory\">Horario Teorico: </strong>{{ course.course_schedule | scheduleTimeFormat }}<br>\n          <!-- <strong class=\"type-theory\">Theory Teacher: </strong>{{ course.teacher | titlecase }}<br> -->\n          <!-- <strong class=\"type-theory\">Theory Classroom: </strong><span>{{ course.course_scheduleDetails[0].ClassRoom.name  | titlecase}}</span><br> -->\n          <strong><hr></strong>\n          <strong class=\"type-club\">Clases Club: </strong>\n            <span *ngIf=\"course.course_club\">{{ course.course_club.course_schedule | scheduleFormat }}</span><br>\n          <strong class=\"type-club\">Horario Club: </strong>\n            <span *ngIf=\"course.course_club\">{{ course.course_club.course_schedule | scheduleTimeFormat }}</span><br>\n          <strong>Modalidad: </strong>\n            <span *ngIf=\"course.course_modality\">{{ course.course_modality.name | titlecase }}</span><br>\n          <!-- <strong class=\"type-club\">Club Teacher: </strong>\n            <span *ngIf=\"course.course_club\">{{ course.course_club.teacher | titlecase }}</span><br> -->\n          <!-- <strong class=\"type-club\">Club Classroom: </strong>\n            <span *ngIf=\"course.course_club\">{{ course.course_club.course_scheduleDetails[0].ClassRoom.name  | titlecase}}</span><br> -->\n          <!-- <strong><hr></strong> -->\n          <!-- <strong *ngIf=\"course.start_date === null\">Posible inicio: </strong>{{ course.start_date === null ? course.to_start : null | date:'dd/MM/yyyy' }}<br *ngIf=\"course.start_date === null\">\n          <strong *ngIf=\"course.start_date !== null\">Fecha Inicio: </strong>{{ course.start_date !== null ? course.start_date : null | date:'dd/MM/yyyy' }}<br *ngIf=\"course.finish_date !== null\">\n          <strong *ngIf=\"course.finish_date !== null\">Fecha culminacion: </strong>{{ course.finish_date !== null ? course.finish_date : null | date:'dd/MM/yyyy' }}<br *ngIf=\"course.finish_date !== null\"> -->\n          <!-- <strong>Created: </strong>{{ course.created_at | date:'dd/MM/yyyy' }}<br> -->\n        </p>\n        <div class=\"card1__date\">\n          <!-- <span\n          [ngClass]=\"course.status?.color_status\"\n          ></span> -->\n          <!-- <span class=\"course-code\">Code: {{course.code}}</span> -->\n        </div>\n        <div class=\"card1__arrow\" [ngClass]=\"getCssClass(course.english_level.name)\">\n          <span>{{ course.english_level.name | typeLevel}}</span>\n        </div>\n      </section>\n    </main>\n    <ipt-loader *ngIf=\"isLoading\"></ipt-loader>\n  </p-panel>\n\n  <!-- cards Kids -->\n\n  <p-panel\n  *ngIf=\"visibleKids\"\n  header=\"Plan Kids\"\n  [toggleable]=\"true\"\n  [collapsed]=\"false\"\n  id=\"social_kids\"\n  >\n  <ng-template pTemplate=\"icons\"> </ng-template>\n    <main *ngIf=\"!isLoading\" class=\"flex flex-col\">\n      <section *ngFor=\"let course of courseKids\" class=\"card1 animate__animated\"  (click)=\"viewDataCourse(course)\">\n        <h3 class=\"card1__title__kids\">{{ course.course_type.label }}</h3>\n        <p class=\"card1__content\">\n          <strong class=\"type-theory\">Clases Teoricas: </strong>{{ course.course_schedule | scheduleFormat }}<br>\n          <strong class=\"type-theory\">Horario Teorico: </strong>{{ course.course_schedule | scheduleTimeFormat }}<br>\n          <!-- <strong class=\"type-theory\">Theory Teacher: </strong>{{ course.teacher | titlecase }}<br>\n          <strong class=\"type-theory\">Theory Classroom: </strong><span>{{ course.course_scheduleDetails[0].ClassRoom.name  | titlecase}}</span><br> -->\n          <strong><hr></strong>\n          <strong class=\"type-club\">Clases Club: </strong>\n            <span *ngIf=\"course.course_club\">{{ course.course_club.course_schedule | scheduleFormat }}</span><br>\n          <strong class=\"type-club\">Horario Club: </strong>\n            <span *ngIf=\"course.course_club\">{{ course.course_club.course_schedule | scheduleTimeFormat }}</span><br>\n          <strong>Modalidad: </strong>\n            <span *ngIf=\"course.course_modality\">{{ course.course_modality.name | titlecase }}</span><br>\n          <!-- <strong class=\"type-club\">Club Teacher: </strong>\n            <span *ngIf=\"course.course_club\">{{ course.course_club.teacher | titlecase }}</span><br> -->\n          <!-- <strong class=\"type-club\">Club Classroom: </strong>\n            <span *ngIf=\"course.course_club\">{{ course.course_club.course_scheduleDetails[0].ClassRoom.name  | titlecase}}</span><br> -->\n          <!-- <strong><hr></strong> -->\n          <!-- <strong *ngIf=\"course.start_date === null\">Posible inicio: </strong>{{ course.start_date === null ? course.to_start : null | date:'dd/MM/yyyy' }}<br *ngIf=\"course.start_date === null\">\n          <strong *ngIf=\"course.start_date !== null\">Fecha Inicio: </strong>{{ course.start_date !== null ? course.start_date : null | date:'dd/MM/yyyy' }}<br *ngIf=\"course.finish_date !== null\">\n          <strong *ngIf=\"course.finish_date !== null\">Fecha culminacion: </strong>{{ course.finish_date !== null ? course.finish_date : null | date:'dd/MM/yyyy' }}<br *ngIf=\"course.finish_date !== null\"> -->\n          <!-- <strong>Created: </strong>{{ course.created_at | date:'dd/MM/yyyy' }}<br> -->\n        </p>\n        <div class=\"card1__date\">\n          <!-- <span\n          [ngClass]=\"course.status?.color_status\"\n          ></span> -->\n          <!-- <span class=\"course-code\">Code: {{course.code}}</span> -->\n        </div>\n        <div class=\"card1__arrow\" [ngClass]=\"getCssClass(course.english_level.name)\">\n          <span>{{ course.english_level.name | typeLevel}}</span>\n        </div>\n      </section>\n    </main>\n    <ipt-loader *ngIf=\"isLoading\"></ipt-loader>\n  </p-panel>\n\n  <!-- cards Schools -->\n\n  <p-panel\n  *ngIf=\"visibleSchools\"\n  header=\"Plan Schools\"\n  [toggleable]=\"true\"\n  [collapsed]=\"false\"\n  id=\"social_school\"\n  >\n  <ng-template pTemplate=\"icons\"> </ng-template>\n    <main *ngIf=\"!isLoading\" class=\"flex flex-col\">\n      <section *ngFor=\"let course of courseSchools\" class=\"card1 animate__animated\"  (click)=\"viewDataCourse(course)\">\n        <h3 class=\"card1__title__schools\">{{ course.course_type.label }}</h3>\n        <p class=\"card1__content\">\n          <strong class=\"type-theory\">Clases Teoricas: </strong>{{ course.course_schedule | scheduleFormat }}<br>\n          <strong class=\"type-theory\">Horario Teorico: </strong>{{ course.course_schedule | scheduleTimeFormat }}<br>\n          <!-- <strong class=\"type-theory\">Theory Teacher: </strong>{{ course.teacher | titlecase }}<br>\n          <strong class=\"type-theory\">Theory Classroom: </strong><span>{{ course.course_scheduleDetails[0].ClassRoom.name  | titlecase}}</span><br> -->\n          <strong><hr></strong>\n          <strong class=\"type-club\">Clases Club: </strong>\n            <span *ngIf=\"course.course_club\">{{ course.course_club.course_schedule | scheduleFormat }}</span><br>\n          <strong class=\"type-club\">Horario Club: </strong>\n            <span *ngIf=\"course.course_club\">{{ course.course_club.course_schedule | scheduleTimeFormat }}</span><br>\n          <strong>Modalidad: </strong>\n            <span *ngIf=\"course.course_modality\">{{ course.course_modality.name | titlecase }}</span><br>\n          <!-- <strong class=\"type-club\">Club Teacher: </strong>\n            <span *ngIf=\"course.course_club\">{{ course.course_club.teacher | titlecase }}</span><br>\n          <strong class=\"type-club\">Club Classroom: </strong>\n            <span *ngIf=\"course.course_club\">{{ course.course_club.course_scheduleDetails[0].ClassRoom.name  | titlecase}}</span><br> -->\n          <!-- <strong><hr></strong> -->\n          <!-- <strong *ngIf=\"course.start_date === null\">Posible inicio: </strong>{{ course.start_date === null ? course.to_start : null | date:'dd/MM/yyyy' }}<br *ngIf=\"course.start_date === null\">\n          <strong *ngIf=\"course.start_date !== null\">Fecha Inicio: </strong>{{ course.start_date !== null ? course.start_date : null | date:'dd/MM/yyyy' }}<br *ngIf=\"course.finish_date !== null\">\n          <strong *ngIf=\"course.finish_date !== null\">Fecha culminacion: </strong>{{ course.finish_date !== null ? course.finish_date : null | date:'dd/MM/yyyy' }}<br *ngIf=\"course.finish_date !== null\"> -->\n          <!-- <strong>Created: </strong>{{ course.created_at | date:'dd/MM/yyyy' }}<br> -->\n        </p>\n        <div class=\"card1__date\">\n          <!-- <span\n          [ngClass]=\"course.status?.color_status\"\n          ></span> -->\n          <!-- <span class=\"course-code\">Code: {{course.code}}</span> -->\n        </div>\n        <div class=\"card1__arrow\" [ngClass]=\"getCssClass(course.english_level.name)\">\n          <span>{{ course.english_level.name | typeLevel}}</span>\n        </div>\n      </section>\n    </main>\n    <ipt-loader *ngIf=\"isLoading\"></ipt-loader>\n  </p-panel>\n\n  <div class=\"container__span-footer flex justify-content-center\" *ngIf=\"!visibleAcademy && !visibleKids && !visibleSchools\">\n    <span>No se encontraron planes</span>\n  </div>\n</div>\n<div *ngIf=\"isLoading\">\n\n  <p-panel\n  header=\"\"\n  [toggleable]=\"true\"\n  [collapsed]=\"false\"\n  id=\"p-component panel-skeleton\"\n  >\n  <ng-template pTemplate=\"icons\"> </ng-template>\n    <main class=\"flex flex-col\">\n      <section *ngFor=\"let course of skeleton\" class=\"card1 animate__animated\"  >\n        <p-skeleton width=\"12rem\" height=\"2rem\" styleClass=\"mb-2\" ></p-skeleton>\n        <p class=\"card1__content_skeleton\">\n          <p-skeleton width=\"9rem\" height=\"1rem\" styleClass=\"mb-2\" ></p-skeleton>\n          <p-skeleton width=\"9rem\" height=\"1rem\" styleClass=\"mb-2\" ></p-skeleton>\n          <strong><hr></strong>\n          <p-skeleton width=\"9rem\" height=\"1rem\" styleClass=\"mb-2\" ></p-skeleton>\n          <p-skeleton width=\"9rem\" height=\"1rem\" styleClass=\"mb-2\" ></p-skeleton>\n        </p>\n        <div class=\"card1__date__skeleton\">\n        </div>\n        <div class=\"card1__arrow\" >\n          <p-skeleton size=\"3rem\" styleClass=\"mr-2\" ></p-skeleton>\n        </div>\n      </section>\n    </main>\n  </p-panel>\n\n</div>\n\n", styles: ["main{display:flex;gap:.7rem;flex-wrap:wrap}.card1{--border-radius: 3px;--primary-color: #1c77f7;--secondary-color: #2c2c2c;--tertiary-color: #ffffff;width:340px;font-family:Poppins,sans-serif;cursor:pointer;border-radius:var(--border-radius);background:#f1f1f3;box-shadow:0 8px 16px #00000008;position:relative;transition:.3s;border:solid .5px #e0e0e0}.type-theory{color:#00aecc}.type-club{color:#0d9d36}.msg-two-coup{color:#000!important;padding-left:7px;padding-right:7px;border-radius:5px;background-color:#4ed1e9}.msg-two-lev{color:#000!important;padding-left:5px;padding-right:5px;border-radius:5px;margin-left:13px;background-color:#fb8f42}.beginner{color:#fff!important;padding-left:5px;padding-right:5px;border-radius:5px;margin-left:13px;background-color:#94b9aa}.levelAone{color:#fff!important;padding-left:5px;padding-right:5px;border-radius:5px;margin-left:13px;background-color:#c4291c}.levelAonetwo{color:#fff!important;padding-left:5px;padding-right:5px;border-radius:5px;margin-left:13px;background-color:#418ed1}.levelAtwo{color:#fff!important;padding-left:5px;padding-right:5px;border-radius:5px;margin-left:13px;background-color:#4fad65}.levelBone{color:#fff!important;padding-left:5px;padding-right:5px;border-radius:5px;margin-left:13px;background-color:#6824b8}.levelBtwo{color:#fff!important;padding-left:5px;padding-right:5px;border-radius:5px;margin-left:13px;background-color:#06161e}.levelBplus{color:#fff!important;padding-left:5px;padding-right:5px;border-radius:5px;margin-left:13px;background-color:#cc6529}.main-container{margin-top:1%}.course-code{font-size:12px;font-weight:400;margin-left:.5rem}.card1:hover{box-shadow:#0000003d 0 3px 8px}.card1>*+*{margin-top:.7em}.card1 .card1__content{padding-left:10px;color:var(--secondary-color);font-size:.86rem;font-weight:200;z-index:1;position:relative}strong{color:var(--secondary-color);font-weight:300}:host ::ng-deep .p-panel .p-panel-header .p-panel-header-icon{color:#fff!important}.card1 .card1__title__academic{color:#fff;padding-left:10px;padding-right:10px;font-size:1.1rem;font-weight:300;z-index:1;position:relative;background:rgb(4,18,106);background:linear-gradient(175deg,rgba(4,18,106,1) 27%,rgba(48,63,155,1) 53%,rgba(28,119,247,1)90%);border-radius:6px 6px 0 0}:host ::ng-deep #academic_plan .p-panel .p-panel-header{color:#fff!important;background:rgb(4,18,106);background:linear-gradient(175deg,rgba(4,18,106,1) 27%,rgba(48,63,155,1) 53%,rgba(28,119,247,1)90%);border-radius:6px 6px 0 0}.card1 .card1__title__kids{color:#fff;padding-left:10px;padding-right:10px;font-size:1.1rem;font-weight:300;z-index:1;position:relative;background:rgb(127,33,99);background:linear-gradient(175deg,rgba(127,33,99,1) 27%,rgba(171,49,135,1) 53%,rgba(220,76,178,1) 90%);border-radius:6px 6px 0 0}:host ::ng-deep #social_kids .p-panel .p-panel-header{color:#fff!important;background:rgb(127,33,99);background:linear-gradient(175deg,rgba(127,33,99,1) 27%,rgba(171,49,135,1) 53%,rgba(220,76,178,1) 90%);border-radius:6px 6px 0 0}.card1 .card1__title__schools{color:#fff;padding-left:10px;padding-right:10px;font-size:1.1rem;font-weight:300;z-index:1;position:relative;background:rgb(57,130,154);background:linear-gradient(175deg,rgba(57,130,154,1) 27%,rgba(44,147,180,1) 53%,rgba(135,182,197,1) 90%);border-radius:6px 6px 0 0}:host ::ng-deep #social_school .p-panel .p-panel-header{color:#fff!important;background:rgb(57,130,154);background:linear-gradient(175deg,rgba(57,130,154,1) 27%,rgba(44,147,180,1) 53%,rgba(135,182,197,1) 90%);border-radius:6px 6px 0 0}.card1 .card1__date{color:#807c7c;padding-left:10px;font-size:.4rem;z-index:1;position:relative;margin-bottom:2%;margin-top:.7rem}.card1 .card1__arrow{padding-left:10px;position:absolute;padding:.3rem;border-top-left-radius:var(--border-radius);border-bottom-right-radius:var(--border-radius);bottom:0;right:0;transition:.2s;display:flex;justify-content:center;align-items:center}.card1 svg{transition:.2s}.card1:hover .card1__title{color:var(--secondary-color)}.card1:hover .card1__arrow{background:rgb(170,41,170)}.card1:hover .card1__arrow svg{transform:translate(3px)}.card1:hover strong{color:#aa29aa;font-weight:400}.card1:hover .course-code{color:#aa29aa;font-weight:500}.image-container{display:flex;border-radius:6px;width:250px;height:207px;box-shadow:#3c40434d 0 1px 2px,#3c404326 0 1px 3px 1px}:host ::ng-deep .p-menubar .p-menuitem{position:relative;width:auto}.green300{height:2%;width:2%;padding-right:9px;border-radius:70%;background:#76db9b;box-shadow:-1px 0 1px 1px #000000fa;border:1px solid rgb(0 0 0 / 40%)}.red300{height:2%;width:2%;padding-right:9px;border-radius:70%;background:#e35b53;box-shadow:-1px 0 1px 1px #000000fa;border:1px solid rgb(0 0 0 / 40%)}.gray300{height:2%;width:2%;padding-right:9px;border-radius:70%;color:#9e9a99;background-color:#9e9a99;box-shadow:-1px 0 1px 1px #000000fa;border:1px solid rgb(0 0 0 / 40%)}label{border-radius:50%}#panel-skeleton{position:relative;overflow:hidden;background:#f0f0f0}#panel-skeleton:after{content:\"\";animation:p-skeleton-animation 1.2s infinite;height:100%;left:0;position:absolute;right:0;top:0;transform:translate(-100%);z-index:1;background:linear-gradient(90deg,rgba(255,255,255,0),rgba(255,255,255,.4),rgba(255,255,255,0))}@keyframes p-skeleton-animation{0%{transform:translate(-100%)}to{transform:translate(100%)}}.container__span-header,.container__span-footer{margin:20px 0;font-weight:700}\n"] }]
         }], propDecorators: { CourseData: [{
                 type: Input
             }], isLoading: [{
@@ -2563,10 +2563,10 @@ class CardSelectCourseComponent {
     }
 }
 CardSelectCourseComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.0.7", ngImport: i0, type: CardSelectCourseComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-CardSelectCourseComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.0.7", type: CardSelectCourseComponent, selector: "ipt-card-select-course-self-cod-managed", inputs: { courseSelect: "courseSelect" }, ngImport: i0, template: "<!-- <main class=\"container-card\">\r\n  <div class=\"w-auto\" >\r\n    <div class=\"card\" (click)=\"selectDepartment(courseSelect)\">\r\n      <div class=\"card-text\">\r\n        <span class=\"date\">{{ courseSelect.course_type.label }}</span><br>\r\n        <strong class=\"type-theory\">Clases Teoricas: </strong>{{ courseSelect.course_schedule | scheduleFormat }}<br>\r\n        <strong class=\"type-theory\">Horario Teorico: </strong>{{ courseSelect.course_schedule | scheduleTimeFormat }}<br>\r\n        <strong><hr></strong>\r\n        <strong class=\"type-club\">Clases Club: </strong>\r\n          <span *ngIf=\"courseSelect.course_club\">{{ courseSelect.course_club.course_schedule | scheduleFormat }}</span><br>\r\n        <strong class=\"type-club\">Horario Club: </strong>\r\n          <span *ngIf=\"courseSelect.course_club\">{{ courseSelect.course_club.course_schedule | scheduleTimeFormat }}</span><br>\r\n        <strong>Modalidad: </strong>\r\n        <span *ngIf=\"courseSelect.course_modality\">{{ courseSelect.course_modality.name | titlecase }}</span><br>\r\n        <strong *ngIf=\"courseSelect.start_date === null\">Posible inicio: </strong>{{ courseSelect.start_date === null ? courseSelect.to_start : null | date:'dd/MM/yyyy' }}<br *ngIf=\"courseSelect.start_date === null\">\r\n        <strong *ngIf=\"courseSelect.start_date !== null\">Fecha Inicio: </strong>{{ courseSelect.start_date !== null ? courseSelect.start_date : null | date:'dd/MM/yyyy' }}<br *ngIf=\"courseSelect.finish_date !== null\">\r\n        <strong *ngIf=\"courseSelect.finish_date !== null\">Fecha culminacion: </strong>{{ courseSelect.finish_date !== null ? courseSelect.finish_date : null | date:'dd/MM/yyyy' }}<br *ngIf=\"courseSelect.finish_date !== null\">\r\n      </div>\r\n    </div>\r\n  </div>\r\n</main> -->\r\n<main>\r\n<div class=\"container__tittle__card flex justify-content-center\">\r\n  Plan Seleccionado\r\n</div>\r\n<div class=\"container-card\">\r\n  <div class=\"card\">\r\n    <p class=\"heading\">\r\n      {{ courseSelect.course_type.label }}<br>\r\n    </p>\r\n    <div class=\"card-text\">\r\n      <strong class=\"type-theory\">Clases Teoricas: </strong><span>{{ courseSelect.course_schedule | scheduleFormat }}</span><br>\r\n      <strong class=\"type-theory\">Horario Teorico: </strong> <span>{{ courseSelect.course_schedule | scheduleTimeFormat }}</span><br>\r\n      <strong><hr></strong>\r\n      <strong class=\"type-club\">Clases Club: </strong><span *ngIf=\"courseSelect.course_club\">{{ courseSelect.course_club.course_schedule | scheduleFormat }}</span><br>\r\n      <strong class=\"type-club\">Horario Club: </strong><span *ngIf=\"courseSelect.course_club\">{{ courseSelect.course_club.course_schedule | scheduleTimeFormat }}</span><br>\r\n      <strong>Modalidad: </strong><span *ngIf=\"courseSelect.course_modality\">{{ courseSelect.course_modality.name | titlecase }}</span><br>\r\n      <strong *ngIf=\"courseSelect.start_date === null\">Posible inicio: </strong><span>{{ courseSelect.start_date === null ? courseSelect.to_start : null | date:'dd/MM/yyyy' }}</span><br *ngIf=\"courseSelect.start_date === null\">\r\n    </div>\r\n    <p>{{ courseSelect.english_level.name | typeLevel}}\r\n    </p>\r\n  </div>\r\n</div>\r\n</main>\r\n<!-- <main *ngIf=\"jornada === 2\" class=\"container-card\">\r\n  <div class=\"w-auto\" >\r\n    <div class=\"card\" (click)=\"selectDepartment(courseSelect)\">\r\n      <div class=\"card-image\" [style.background-image]=\"'url(' + courseSelect.imageUrl + ')'\"></div>\r\n      <div class=\"card-text\">\r\n        <span class=\"date\">{{ courseSelect.course_type.label }}</span><br>\r\n        <strong class=\"type-theory\">Clases Teoricas: </strong>{{ courseSelect.course_schedule | scheduleFormat }}<br>\r\n        <strong class=\"type-theory\">Horario Teorico: </strong>{{ courseSelect.course_schedule | scheduleTimeFormat }}<br>\r\n        <strong><hr></strong>\r\n        <strong class=\"type-club\">Clases Club: </strong>\r\n          <span *ngIf=\"courseSelect.course_club\">{{ courseSelect.course_club.course_schedule | scheduleFormat }}</span><br>\r\n        <strong class=\"type-club\">Horario Club: </strong>\r\n          <span *ngIf=\"courseSelect.course_club\">{{ courseSelect.course_club.course_schedule | scheduleTimeFormat }}</span><br>\r\n        <strong>Modalidad: </strong>\r\n        <span *ngIf=\"courseSelect.course_modality\">{{ courseSelect.course_modality.name | titlecase }}</span><br>\r\n        <strong *ngIf=\"courseSelect.start_date === null\">Posible inicio: </strong>{{ courseSelect.start_date === null ? courseSelect.to_start : null | date:'dd/MM/yyyy' }}<br *ngIf=\"courseSelect.start_date === null\">\r\n        <strong *ngIf=\"courseSelect.start_date !== null\">Fecha Inicio: </strong>{{ courseSelect.start_date !== null ? courseSelect.start_date : null | date:'dd/MM/yyyy' }}<br *ngIf=\"courseSelect.finish_date !== null\">\r\n        <strong *ngIf=\"courseSelect.finish_date !== null\">Fecha culminacion: </strong>{{ courseSelect.finish_date !== null ? courseSelect.finish_date : null | date:'dd/MM/yyyy' }}<br *ngIf=\"courseSelect.finish_date !== null\">\r\n      </div>\r\n    </div>\r\n  </div>\r\n</main>\r\n<main *ngIf=\"jornada === 3\" class=\"container-card\">\r\n  <div class=\"w-auto\" >\r\n    <div class=\"card\" (click)=\"selectDepartment(courseSelect)\">\r\n      <div class=\"card-image\" [style.background-image]=\"'url(' + courseSelect.imageUrl + ')'\"></div>\r\n      <div class=\"card-text\">\r\n        <span class=\"date\">{{ courseSelect.course_type.label }}</span><br>\r\n        <strong class=\"type-theory\">Clases Teoricas: </strong>{{ courseSelect.course_schedule | scheduleFormat }}<br>\r\n        <strong class=\"type-theory\">Horario Teorico: </strong>{{ courseSelect.course_schedule | scheduleTimeFormat }}<br>\r\n        <strong><hr></strong>\r\n        <strong class=\"type-club\">Clases Club: </strong>\r\n          <span *ngIf=\"courseSelect.course_club\">{{ courseSelect.course_club.course_schedule | scheduleFormat }}</span><br>\r\n        <strong class=\"type-club\">Horario Club: </strong>\r\n          <span *ngIf=\"courseSelect.course_club\">{{ courseSelect.course_club.course_schedule | scheduleTimeFormat }}</span><br>\r\n        <strong>Modalidad: </strong>\r\n        <span *ngIf=\"courseSelect.course_modality\">{{ courseSelect.course_modality.name | titlecase }}</span><br>\r\n        <strong *ngIf=\"courseSelect.start_date === null\">Posible inicio: </strong>{{ courseSelect.start_date === null ? courseSelect.to_start : null | date:'dd/MM/yyyy' }}<br *ngIf=\"courseSelect.start_date === null\">\r\n        <strong *ngIf=\"courseSelect.start_date !== null\">Fecha Inicio: </strong>{{ courseSelect.start_date !== null ? courseSelect.start_date : null | date:'dd/MM/yyyy' }}<br *ngIf=\"courseSelect.finish_date !== null\">\r\n        <strong *ngIf=\"courseSelect.finish_date !== null\">Fecha culminacion: </strong>{{ courseSelect.finish_date !== null ? courseSelect.finish_date : null | date:'dd/MM/yyyy' }}<br *ngIf=\"courseSelect.finish_date !== null\">\r\n      </div>\r\n    </div>\r\n  </div>\r\n</main> -->\r\n", styles: [".container-card{display:flex;flex-direction:row;flex-wrap:wrap;justify-content:space-evenly}.card-image{grid-area:image;border-top-left-radius:65px;border-top-right-radius:65px;background-color:coral;background-size:cover;box-shadow:0 2px 5px #5e6173}.card-text .date{color:#fff;font-size:15px}.card-text p{color:gray;font-size:13px;font-weight:300}.card-text h2{margin-top:0;font-size:28px}.type-theory{color:#c2f0f8;font-weight:100;font-size:small}.type-club{color:#92f7af;font-weight:100;font-size:small}.card{position:relative;width:190px;height:254px;background-color:#565656;display:flex;flex-direction:column;justify-content:end;padding:12px;gap:12px;border-radius:8px;cursor:pointer}.card:before{content:\"\";position:absolute;inset:0 0 0 -5px;margin:auto;width:200px;height:264px;border-radius:10px;background:linear-gradient(175deg,rgba(4,18,106,1) 27%,rgba(48,63,155,1) 53%,rgba(28,119,247,1) 90%);z-index:-10;pointer-events:none;transition:all .6s cubic-bezier(.175,.885,.32,1.275)}.card:after{content:\"\";z-index:-1;position:absolute;inset:0;background:linear-gradient(-45deg,rgba(0,63,255,1) 0%,rgba(4,18,106,1) 100%);transform:translateZ(0) scale(.95);filter:blur(20px)}.heading{text-transform:capitalize;font-weight:700;color:#fff}.card p:not(.heading){font-size:14px}.card p:last-child{color:#0497d9;font-weight:600}.card:hover:after{filter:blur(30px)}.card:hover:before{transform:rotate(-90deg) scaleX(1.34) scaleY(.77)}span,strong{color:#fff;font-weight:100;font-size:small}.container-card{z-index:0;position:relative;justify-content:center;display:flex;margin:1rem 0 3rem}.container__tittle__card{margin-top:2rem;font-weight:700}\n"], dependencies: [{ kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "pipe", type: i1.TitleCasePipe, name: "titlecase" }, { kind: "pipe", type: i1.DatePipe, name: "date" }, { kind: "pipe", type: ScheduleFormatPipe, name: "scheduleFormat" }, { kind: "pipe", type: ScheduleTimeFormatPipe, name: "scheduleTimeFormat" }, { kind: "pipe", type: TypeLevelPipe, name: "typeLevel" }] });
+CardSelectCourseComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.0.7", type: CardSelectCourseComponent, selector: "ipt-card-select-course-self-cod-managed", inputs: { courseSelect: "courseSelect" }, ngImport: i0, template: "<!-- <main class=\"container-card\">\n  <div class=\"w-auto\" >\n    <div class=\"card\" (click)=\"selectDepartment(courseSelect)\">\n      <div class=\"card-text\">\n        <span class=\"date\">{{ courseSelect.course_type.label }}</span><br>\n        <strong class=\"type-theory\">Clases Teoricas: </strong>{{ courseSelect.course_schedule | scheduleFormat }}<br>\n        <strong class=\"type-theory\">Horario Teorico: </strong>{{ courseSelect.course_schedule | scheduleTimeFormat }}<br>\n        <strong><hr></strong>\n        <strong class=\"type-club\">Clases Club: </strong>\n          <span *ngIf=\"courseSelect.course_club\">{{ courseSelect.course_club.course_schedule | scheduleFormat }}</span><br>\n        <strong class=\"type-club\">Horario Club: </strong>\n          <span *ngIf=\"courseSelect.course_club\">{{ courseSelect.course_club.course_schedule | scheduleTimeFormat }}</span><br>\n        <strong>Modalidad: </strong>\n        <span *ngIf=\"courseSelect.course_modality\">{{ courseSelect.course_modality.name | titlecase }}</span><br>\n        <strong *ngIf=\"courseSelect.start_date === null\">Posible inicio: </strong>{{ courseSelect.start_date === null ? courseSelect.to_start : null | date:'dd/MM/yyyy' }}<br *ngIf=\"courseSelect.start_date === null\">\n        <strong *ngIf=\"courseSelect.start_date !== null\">Fecha Inicio: </strong>{{ courseSelect.start_date !== null ? courseSelect.start_date : null | date:'dd/MM/yyyy' }}<br *ngIf=\"courseSelect.finish_date !== null\">\n        <strong *ngIf=\"courseSelect.finish_date !== null\">Fecha culminacion: </strong>{{ courseSelect.finish_date !== null ? courseSelect.finish_date : null | date:'dd/MM/yyyy' }}<br *ngIf=\"courseSelect.finish_date !== null\">\n      </div>\n    </div>\n  </div>\n</main> -->\n<main>\n<div class=\"container__tittle__card flex justify-content-center\">\n  Plan Seleccionado\n</div>\n<div class=\"container-card\">\n  <div class=\"card\">\n    <p class=\"heading\">\n      {{ courseSelect.course_type.label }}<br>\n    </p>\n    <div class=\"card-text\">\n      <strong class=\"type-theory\">Clases Teoricas: </strong><span>{{ courseSelect.course_schedule | scheduleFormat }}</span><br>\n      <strong class=\"type-theory\">Horario Teorico: </strong> <span>{{ courseSelect.course_schedule | scheduleTimeFormat }}</span><br>\n      <strong><hr></strong>\n      <strong class=\"type-club\">Clases Club: </strong><span *ngIf=\"courseSelect.course_club\">{{ courseSelect.course_club.course_schedule | scheduleFormat }}</span><br>\n      <strong class=\"type-club\">Horario Club: </strong><span *ngIf=\"courseSelect.course_club\">{{ courseSelect.course_club.course_schedule | scheduleTimeFormat }}</span><br>\n      <strong>Modalidad: </strong><span *ngIf=\"courseSelect.course_modality\">{{ courseSelect.course_modality.name | titlecase }}</span><br>\n      <strong *ngIf=\"courseSelect.start_date === null\">Posible inicio: </strong><span>{{ courseSelect.start_date === null ? courseSelect.to_start : null | date:'dd/MM/yyyy' }}</span><br *ngIf=\"courseSelect.start_date === null\">\n    </div>\n    <p>{{ courseSelect.english_level.name | typeLevel}}\n    </p>\n  </div>\n</div>\n</main>\n<!-- <main *ngIf=\"jornada === 2\" class=\"container-card\">\n  <div class=\"w-auto\" >\n    <div class=\"card\" (click)=\"selectDepartment(courseSelect)\">\n      <div class=\"card-image\" [style.background-image]=\"'url(' + courseSelect.imageUrl + ')'\"></div>\n      <div class=\"card-text\">\n        <span class=\"date\">{{ courseSelect.course_type.label }}</span><br>\n        <strong class=\"type-theory\">Clases Teoricas: </strong>{{ courseSelect.course_schedule | scheduleFormat }}<br>\n        <strong class=\"type-theory\">Horario Teorico: </strong>{{ courseSelect.course_schedule | scheduleTimeFormat }}<br>\n        <strong><hr></strong>\n        <strong class=\"type-club\">Clases Club: </strong>\n          <span *ngIf=\"courseSelect.course_club\">{{ courseSelect.course_club.course_schedule | scheduleFormat }}</span><br>\n        <strong class=\"type-club\">Horario Club: </strong>\n          <span *ngIf=\"courseSelect.course_club\">{{ courseSelect.course_club.course_schedule | scheduleTimeFormat }}</span><br>\n        <strong>Modalidad: </strong>\n        <span *ngIf=\"courseSelect.course_modality\">{{ courseSelect.course_modality.name | titlecase }}</span><br>\n        <strong *ngIf=\"courseSelect.start_date === null\">Posible inicio: </strong>{{ courseSelect.start_date === null ? courseSelect.to_start : null | date:'dd/MM/yyyy' }}<br *ngIf=\"courseSelect.start_date === null\">\n        <strong *ngIf=\"courseSelect.start_date !== null\">Fecha Inicio: </strong>{{ courseSelect.start_date !== null ? courseSelect.start_date : null | date:'dd/MM/yyyy' }}<br *ngIf=\"courseSelect.finish_date !== null\">\n        <strong *ngIf=\"courseSelect.finish_date !== null\">Fecha culminacion: </strong>{{ courseSelect.finish_date !== null ? courseSelect.finish_date : null | date:'dd/MM/yyyy' }}<br *ngIf=\"courseSelect.finish_date !== null\">\n      </div>\n    </div>\n  </div>\n</main>\n<main *ngIf=\"jornada === 3\" class=\"container-card\">\n  <div class=\"w-auto\" >\n    <div class=\"card\" (click)=\"selectDepartment(courseSelect)\">\n      <div class=\"card-image\" [style.background-image]=\"'url(' + courseSelect.imageUrl + ')'\"></div>\n      <div class=\"card-text\">\n        <span class=\"date\">{{ courseSelect.course_type.label }}</span><br>\n        <strong class=\"type-theory\">Clases Teoricas: </strong>{{ courseSelect.course_schedule | scheduleFormat }}<br>\n        <strong class=\"type-theory\">Horario Teorico: </strong>{{ courseSelect.course_schedule | scheduleTimeFormat }}<br>\n        <strong><hr></strong>\n        <strong class=\"type-club\">Clases Club: </strong>\n          <span *ngIf=\"courseSelect.course_club\">{{ courseSelect.course_club.course_schedule | scheduleFormat }}</span><br>\n        <strong class=\"type-club\">Horario Club: </strong>\n          <span *ngIf=\"courseSelect.course_club\">{{ courseSelect.course_club.course_schedule | scheduleTimeFormat }}</span><br>\n        <strong>Modalidad: </strong>\n        <span *ngIf=\"courseSelect.course_modality\">{{ courseSelect.course_modality.name | titlecase }}</span><br>\n        <strong *ngIf=\"courseSelect.start_date === null\">Posible inicio: </strong>{{ courseSelect.start_date === null ? courseSelect.to_start : null | date:'dd/MM/yyyy' }}<br *ngIf=\"courseSelect.start_date === null\">\n        <strong *ngIf=\"courseSelect.start_date !== null\">Fecha Inicio: </strong>{{ courseSelect.start_date !== null ? courseSelect.start_date : null | date:'dd/MM/yyyy' }}<br *ngIf=\"courseSelect.finish_date !== null\">\n        <strong *ngIf=\"courseSelect.finish_date !== null\">Fecha culminacion: </strong>{{ courseSelect.finish_date !== null ? courseSelect.finish_date : null | date:'dd/MM/yyyy' }}<br *ngIf=\"courseSelect.finish_date !== null\">\n      </div>\n    </div>\n  </div>\n</main> -->\n", styles: [".container-card{display:flex;flex-direction:row;flex-wrap:wrap;justify-content:space-evenly}.card-image{grid-area:image;border-top-left-radius:65px;border-top-right-radius:65px;background-color:coral;background-size:cover;box-shadow:0 2px 5px #5e6173}.card-text .date{color:#fff;font-size:15px}.card-text p{color:gray;font-size:13px;font-weight:300}.card-text h2{margin-top:0;font-size:28px}.type-theory{color:#c2f0f8;font-weight:100;font-size:small}.type-club{color:#92f7af;font-weight:100;font-size:small}.card{position:relative;width:190px;height:254px;background-color:#565656;display:flex;flex-direction:column;justify-content:end;padding:12px;gap:12px;border-radius:8px;cursor:pointer}.card:before{content:\"\";position:absolute;inset:0 0 0 -5px;margin:auto;width:200px;height:264px;border-radius:10px;background:linear-gradient(175deg,rgba(4,18,106,1) 27%,rgba(48,63,155,1) 53%,rgba(28,119,247,1) 90%);z-index:-10;pointer-events:none;transition:all .6s cubic-bezier(.175,.885,.32,1.275)}.card:after{content:\"\";z-index:-1;position:absolute;inset:0;background:linear-gradient(-45deg,rgba(0,63,255,1) 0%,rgba(4,18,106,1) 100%);transform:translateZ(0) scale(.95);filter:blur(20px)}.heading{text-transform:capitalize;font-weight:700;color:#fff}.card p:not(.heading){font-size:14px}.card p:last-child{color:#0497d9;font-weight:600}.card:hover:after{filter:blur(30px)}.card:hover:before{transform:rotate(-90deg) scaleX(1.34) scaleY(.77)}span,strong{color:#fff;font-weight:100;font-size:small}.container-card{z-index:0;position:relative;justify-content:center;display:flex;margin:1rem 0 3rem}.container__tittle__card{margin-top:2rem;font-weight:700}\n"], dependencies: [{ kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "pipe", type: i1.TitleCasePipe, name: "titlecase" }, { kind: "pipe", type: i1.DatePipe, name: "date" }, { kind: "pipe", type: ScheduleFormatPipe, name: "scheduleFormat" }, { kind: "pipe", type: ScheduleTimeFormatPipe, name: "scheduleTimeFormat" }, { kind: "pipe", type: TypeLevelPipe, name: "typeLevel" }] });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.0.7", ngImport: i0, type: CardSelectCourseComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'ipt-card-select-course-self-cod-managed', template: "<!-- <main class=\"container-card\">\r\n  <div class=\"w-auto\" >\r\n    <div class=\"card\" (click)=\"selectDepartment(courseSelect)\">\r\n      <div class=\"card-text\">\r\n        <span class=\"date\">{{ courseSelect.course_type.label }}</span><br>\r\n        <strong class=\"type-theory\">Clases Teoricas: </strong>{{ courseSelect.course_schedule | scheduleFormat }}<br>\r\n        <strong class=\"type-theory\">Horario Teorico: </strong>{{ courseSelect.course_schedule | scheduleTimeFormat }}<br>\r\n        <strong><hr></strong>\r\n        <strong class=\"type-club\">Clases Club: </strong>\r\n          <span *ngIf=\"courseSelect.course_club\">{{ courseSelect.course_club.course_schedule | scheduleFormat }}</span><br>\r\n        <strong class=\"type-club\">Horario Club: </strong>\r\n          <span *ngIf=\"courseSelect.course_club\">{{ courseSelect.course_club.course_schedule | scheduleTimeFormat }}</span><br>\r\n        <strong>Modalidad: </strong>\r\n        <span *ngIf=\"courseSelect.course_modality\">{{ courseSelect.course_modality.name | titlecase }}</span><br>\r\n        <strong *ngIf=\"courseSelect.start_date === null\">Posible inicio: </strong>{{ courseSelect.start_date === null ? courseSelect.to_start : null | date:'dd/MM/yyyy' }}<br *ngIf=\"courseSelect.start_date === null\">\r\n        <strong *ngIf=\"courseSelect.start_date !== null\">Fecha Inicio: </strong>{{ courseSelect.start_date !== null ? courseSelect.start_date : null | date:'dd/MM/yyyy' }}<br *ngIf=\"courseSelect.finish_date !== null\">\r\n        <strong *ngIf=\"courseSelect.finish_date !== null\">Fecha culminacion: </strong>{{ courseSelect.finish_date !== null ? courseSelect.finish_date : null | date:'dd/MM/yyyy' }}<br *ngIf=\"courseSelect.finish_date !== null\">\r\n      </div>\r\n    </div>\r\n  </div>\r\n</main> -->\r\n<main>\r\n<div class=\"container__tittle__card flex justify-content-center\">\r\n  Plan Seleccionado\r\n</div>\r\n<div class=\"container-card\">\r\n  <div class=\"card\">\r\n    <p class=\"heading\">\r\n      {{ courseSelect.course_type.label }}<br>\r\n    </p>\r\n    <div class=\"card-text\">\r\n      <strong class=\"type-theory\">Clases Teoricas: </strong><span>{{ courseSelect.course_schedule | scheduleFormat }}</span><br>\r\n      <strong class=\"type-theory\">Horario Teorico: </strong> <span>{{ courseSelect.course_schedule | scheduleTimeFormat }}</span><br>\r\n      <strong><hr></strong>\r\n      <strong class=\"type-club\">Clases Club: </strong><span *ngIf=\"courseSelect.course_club\">{{ courseSelect.course_club.course_schedule | scheduleFormat }}</span><br>\r\n      <strong class=\"type-club\">Horario Club: </strong><span *ngIf=\"courseSelect.course_club\">{{ courseSelect.course_club.course_schedule | scheduleTimeFormat }}</span><br>\r\n      <strong>Modalidad: </strong><span *ngIf=\"courseSelect.course_modality\">{{ courseSelect.course_modality.name | titlecase }}</span><br>\r\n      <strong *ngIf=\"courseSelect.start_date === null\">Posible inicio: </strong><span>{{ courseSelect.start_date === null ? courseSelect.to_start : null | date:'dd/MM/yyyy' }}</span><br *ngIf=\"courseSelect.start_date === null\">\r\n    </div>\r\n    <p>{{ courseSelect.english_level.name | typeLevel}}\r\n    </p>\r\n  </div>\r\n</div>\r\n</main>\r\n<!-- <main *ngIf=\"jornada === 2\" class=\"container-card\">\r\n  <div class=\"w-auto\" >\r\n    <div class=\"card\" (click)=\"selectDepartment(courseSelect)\">\r\n      <div class=\"card-image\" [style.background-image]=\"'url(' + courseSelect.imageUrl + ')'\"></div>\r\n      <div class=\"card-text\">\r\n        <span class=\"date\">{{ courseSelect.course_type.label }}</span><br>\r\n        <strong class=\"type-theory\">Clases Teoricas: </strong>{{ courseSelect.course_schedule | scheduleFormat }}<br>\r\n        <strong class=\"type-theory\">Horario Teorico: </strong>{{ courseSelect.course_schedule | scheduleTimeFormat }}<br>\r\n        <strong><hr></strong>\r\n        <strong class=\"type-club\">Clases Club: </strong>\r\n          <span *ngIf=\"courseSelect.course_club\">{{ courseSelect.course_club.course_schedule | scheduleFormat }}</span><br>\r\n        <strong class=\"type-club\">Horario Club: </strong>\r\n          <span *ngIf=\"courseSelect.course_club\">{{ courseSelect.course_club.course_schedule | scheduleTimeFormat }}</span><br>\r\n        <strong>Modalidad: </strong>\r\n        <span *ngIf=\"courseSelect.course_modality\">{{ courseSelect.course_modality.name | titlecase }}</span><br>\r\n        <strong *ngIf=\"courseSelect.start_date === null\">Posible inicio: </strong>{{ courseSelect.start_date === null ? courseSelect.to_start : null | date:'dd/MM/yyyy' }}<br *ngIf=\"courseSelect.start_date === null\">\r\n        <strong *ngIf=\"courseSelect.start_date !== null\">Fecha Inicio: </strong>{{ courseSelect.start_date !== null ? courseSelect.start_date : null | date:'dd/MM/yyyy' }}<br *ngIf=\"courseSelect.finish_date !== null\">\r\n        <strong *ngIf=\"courseSelect.finish_date !== null\">Fecha culminacion: </strong>{{ courseSelect.finish_date !== null ? courseSelect.finish_date : null | date:'dd/MM/yyyy' }}<br *ngIf=\"courseSelect.finish_date !== null\">\r\n      </div>\r\n    </div>\r\n  </div>\r\n</main>\r\n<main *ngIf=\"jornada === 3\" class=\"container-card\">\r\n  <div class=\"w-auto\" >\r\n    <div class=\"card\" (click)=\"selectDepartment(courseSelect)\">\r\n      <div class=\"card-image\" [style.background-image]=\"'url(' + courseSelect.imageUrl + ')'\"></div>\r\n      <div class=\"card-text\">\r\n        <span class=\"date\">{{ courseSelect.course_type.label }}</span><br>\r\n        <strong class=\"type-theory\">Clases Teoricas: </strong>{{ courseSelect.course_schedule | scheduleFormat }}<br>\r\n        <strong class=\"type-theory\">Horario Teorico: </strong>{{ courseSelect.course_schedule | scheduleTimeFormat }}<br>\r\n        <strong><hr></strong>\r\n        <strong class=\"type-club\">Clases Club: </strong>\r\n          <span *ngIf=\"courseSelect.course_club\">{{ courseSelect.course_club.course_schedule | scheduleFormat }}</span><br>\r\n        <strong class=\"type-club\">Horario Club: </strong>\r\n          <span *ngIf=\"courseSelect.course_club\">{{ courseSelect.course_club.course_schedule | scheduleTimeFormat }}</span><br>\r\n        <strong>Modalidad: </strong>\r\n        <span *ngIf=\"courseSelect.course_modality\">{{ courseSelect.course_modality.name | titlecase }}</span><br>\r\n        <strong *ngIf=\"courseSelect.start_date === null\">Posible inicio: </strong>{{ courseSelect.start_date === null ? courseSelect.to_start : null | date:'dd/MM/yyyy' }}<br *ngIf=\"courseSelect.start_date === null\">\r\n        <strong *ngIf=\"courseSelect.start_date !== null\">Fecha Inicio: </strong>{{ courseSelect.start_date !== null ? courseSelect.start_date : null | date:'dd/MM/yyyy' }}<br *ngIf=\"courseSelect.finish_date !== null\">\r\n        <strong *ngIf=\"courseSelect.finish_date !== null\">Fecha culminacion: </strong>{{ courseSelect.finish_date !== null ? courseSelect.finish_date : null | date:'dd/MM/yyyy' }}<br *ngIf=\"courseSelect.finish_date !== null\">\r\n      </div>\r\n    </div>\r\n  </div>\r\n</main> -->\r\n", styles: [".container-card{display:flex;flex-direction:row;flex-wrap:wrap;justify-content:space-evenly}.card-image{grid-area:image;border-top-left-radius:65px;border-top-right-radius:65px;background-color:coral;background-size:cover;box-shadow:0 2px 5px #5e6173}.card-text .date{color:#fff;font-size:15px}.card-text p{color:gray;font-size:13px;font-weight:300}.card-text h2{margin-top:0;font-size:28px}.type-theory{color:#c2f0f8;font-weight:100;font-size:small}.type-club{color:#92f7af;font-weight:100;font-size:small}.card{position:relative;width:190px;height:254px;background-color:#565656;display:flex;flex-direction:column;justify-content:end;padding:12px;gap:12px;border-radius:8px;cursor:pointer}.card:before{content:\"\";position:absolute;inset:0 0 0 -5px;margin:auto;width:200px;height:264px;border-radius:10px;background:linear-gradient(175deg,rgba(4,18,106,1) 27%,rgba(48,63,155,1) 53%,rgba(28,119,247,1) 90%);z-index:-10;pointer-events:none;transition:all .6s cubic-bezier(.175,.885,.32,1.275)}.card:after{content:\"\";z-index:-1;position:absolute;inset:0;background:linear-gradient(-45deg,rgba(0,63,255,1) 0%,rgba(4,18,106,1) 100%);transform:translateZ(0) scale(.95);filter:blur(20px)}.heading{text-transform:capitalize;font-weight:700;color:#fff}.card p:not(.heading){font-size:14px}.card p:last-child{color:#0497d9;font-weight:600}.card:hover:after{filter:blur(30px)}.card:hover:before{transform:rotate(-90deg) scaleX(1.34) scaleY(.77)}span,strong{color:#fff;font-weight:100;font-size:small}.container-card{z-index:0;position:relative;justify-content:center;display:flex;margin:1rem 0 3rem}.container__tittle__card{margin-top:2rem;font-weight:700}\n"] }]
+            args: [{ selector: 'ipt-card-select-course-self-cod-managed', template: "<!-- <main class=\"container-card\">\n  <div class=\"w-auto\" >\n    <div class=\"card\" (click)=\"selectDepartment(courseSelect)\">\n      <div class=\"card-text\">\n        <span class=\"date\">{{ courseSelect.course_type.label }}</span><br>\n        <strong class=\"type-theory\">Clases Teoricas: </strong>{{ courseSelect.course_schedule | scheduleFormat }}<br>\n        <strong class=\"type-theory\">Horario Teorico: </strong>{{ courseSelect.course_schedule | scheduleTimeFormat }}<br>\n        <strong><hr></strong>\n        <strong class=\"type-club\">Clases Club: </strong>\n          <span *ngIf=\"courseSelect.course_club\">{{ courseSelect.course_club.course_schedule | scheduleFormat }}</span><br>\n        <strong class=\"type-club\">Horario Club: </strong>\n          <span *ngIf=\"courseSelect.course_club\">{{ courseSelect.course_club.course_schedule | scheduleTimeFormat }}</span><br>\n        <strong>Modalidad: </strong>\n        <span *ngIf=\"courseSelect.course_modality\">{{ courseSelect.course_modality.name | titlecase }}</span><br>\n        <strong *ngIf=\"courseSelect.start_date === null\">Posible inicio: </strong>{{ courseSelect.start_date === null ? courseSelect.to_start : null | date:'dd/MM/yyyy' }}<br *ngIf=\"courseSelect.start_date === null\">\n        <strong *ngIf=\"courseSelect.start_date !== null\">Fecha Inicio: </strong>{{ courseSelect.start_date !== null ? courseSelect.start_date : null | date:'dd/MM/yyyy' }}<br *ngIf=\"courseSelect.finish_date !== null\">\n        <strong *ngIf=\"courseSelect.finish_date !== null\">Fecha culminacion: </strong>{{ courseSelect.finish_date !== null ? courseSelect.finish_date : null | date:'dd/MM/yyyy' }}<br *ngIf=\"courseSelect.finish_date !== null\">\n      </div>\n    </div>\n  </div>\n</main> -->\n<main>\n<div class=\"container__tittle__card flex justify-content-center\">\n  Plan Seleccionado\n</div>\n<div class=\"container-card\">\n  <div class=\"card\">\n    <p class=\"heading\">\n      {{ courseSelect.course_type.label }}<br>\n    </p>\n    <div class=\"card-text\">\n      <strong class=\"type-theory\">Clases Teoricas: </strong><span>{{ courseSelect.course_schedule | scheduleFormat }}</span><br>\n      <strong class=\"type-theory\">Horario Teorico: </strong> <span>{{ courseSelect.course_schedule | scheduleTimeFormat }}</span><br>\n      <strong><hr></strong>\n      <strong class=\"type-club\">Clases Club: </strong><span *ngIf=\"courseSelect.course_club\">{{ courseSelect.course_club.course_schedule | scheduleFormat }}</span><br>\n      <strong class=\"type-club\">Horario Club: </strong><span *ngIf=\"courseSelect.course_club\">{{ courseSelect.course_club.course_schedule | scheduleTimeFormat }}</span><br>\n      <strong>Modalidad: </strong><span *ngIf=\"courseSelect.course_modality\">{{ courseSelect.course_modality.name | titlecase }}</span><br>\n      <strong *ngIf=\"courseSelect.start_date === null\">Posible inicio: </strong><span>{{ courseSelect.start_date === null ? courseSelect.to_start : null | date:'dd/MM/yyyy' }}</span><br *ngIf=\"courseSelect.start_date === null\">\n    </div>\n    <p>{{ courseSelect.english_level.name | typeLevel}}\n    </p>\n  </div>\n</div>\n</main>\n<!-- <main *ngIf=\"jornada === 2\" class=\"container-card\">\n  <div class=\"w-auto\" >\n    <div class=\"card\" (click)=\"selectDepartment(courseSelect)\">\n      <div class=\"card-image\" [style.background-image]=\"'url(' + courseSelect.imageUrl + ')'\"></div>\n      <div class=\"card-text\">\n        <span class=\"date\">{{ courseSelect.course_type.label }}</span><br>\n        <strong class=\"type-theory\">Clases Teoricas: </strong>{{ courseSelect.course_schedule | scheduleFormat }}<br>\n        <strong class=\"type-theory\">Horario Teorico: </strong>{{ courseSelect.course_schedule | scheduleTimeFormat }}<br>\n        <strong><hr></strong>\n        <strong class=\"type-club\">Clases Club: </strong>\n          <span *ngIf=\"courseSelect.course_club\">{{ courseSelect.course_club.course_schedule | scheduleFormat }}</span><br>\n        <strong class=\"type-club\">Horario Club: </strong>\n          <span *ngIf=\"courseSelect.course_club\">{{ courseSelect.course_club.course_schedule | scheduleTimeFormat }}</span><br>\n        <strong>Modalidad: </strong>\n        <span *ngIf=\"courseSelect.course_modality\">{{ courseSelect.course_modality.name | titlecase }}</span><br>\n        <strong *ngIf=\"courseSelect.start_date === null\">Posible inicio: </strong>{{ courseSelect.start_date === null ? courseSelect.to_start : null | date:'dd/MM/yyyy' }}<br *ngIf=\"courseSelect.start_date === null\">\n        <strong *ngIf=\"courseSelect.start_date !== null\">Fecha Inicio: </strong>{{ courseSelect.start_date !== null ? courseSelect.start_date : null | date:'dd/MM/yyyy' }}<br *ngIf=\"courseSelect.finish_date !== null\">\n        <strong *ngIf=\"courseSelect.finish_date !== null\">Fecha culminacion: </strong>{{ courseSelect.finish_date !== null ? courseSelect.finish_date : null | date:'dd/MM/yyyy' }}<br *ngIf=\"courseSelect.finish_date !== null\">\n      </div>\n    </div>\n  </div>\n</main>\n<main *ngIf=\"jornada === 3\" class=\"container-card\">\n  <div class=\"w-auto\" >\n    <div class=\"card\" (click)=\"selectDepartment(courseSelect)\">\n      <div class=\"card-image\" [style.background-image]=\"'url(' + courseSelect.imageUrl + ')'\"></div>\n      <div class=\"card-text\">\n        <span class=\"date\">{{ courseSelect.course_type.label }}</span><br>\n        <strong class=\"type-theory\">Clases Teoricas: </strong>{{ courseSelect.course_schedule | scheduleFormat }}<br>\n        <strong class=\"type-theory\">Horario Teorico: </strong>{{ courseSelect.course_schedule | scheduleTimeFormat }}<br>\n        <strong><hr></strong>\n        <strong class=\"type-club\">Clases Club: </strong>\n          <span *ngIf=\"courseSelect.course_club\">{{ courseSelect.course_club.course_schedule | scheduleFormat }}</span><br>\n        <strong class=\"type-club\">Horario Club: </strong>\n          <span *ngIf=\"courseSelect.course_club\">{{ courseSelect.course_club.course_schedule | scheduleTimeFormat }}</span><br>\n        <strong>Modalidad: </strong>\n        <span *ngIf=\"courseSelect.course_modality\">{{ courseSelect.course_modality.name | titlecase }}</span><br>\n        <strong *ngIf=\"courseSelect.start_date === null\">Posible inicio: </strong>{{ courseSelect.start_date === null ? courseSelect.to_start : null | date:'dd/MM/yyyy' }}<br *ngIf=\"courseSelect.start_date === null\">\n        <strong *ngIf=\"courseSelect.start_date !== null\">Fecha Inicio: </strong>{{ courseSelect.start_date !== null ? courseSelect.start_date : null | date:'dd/MM/yyyy' }}<br *ngIf=\"courseSelect.finish_date !== null\">\n        <strong *ngIf=\"courseSelect.finish_date !== null\">Fecha culminacion: </strong>{{ courseSelect.finish_date !== null ? courseSelect.finish_date : null | date:'dd/MM/yyyy' }}<br *ngIf=\"courseSelect.finish_date !== null\">\n      </div>\n    </div>\n  </div>\n</main> -->\n", styles: [".container-card{display:flex;flex-direction:row;flex-wrap:wrap;justify-content:space-evenly}.card-image{grid-area:image;border-top-left-radius:65px;border-top-right-radius:65px;background-color:coral;background-size:cover;box-shadow:0 2px 5px #5e6173}.card-text .date{color:#fff;font-size:15px}.card-text p{color:gray;font-size:13px;font-weight:300}.card-text h2{margin-top:0;font-size:28px}.type-theory{color:#c2f0f8;font-weight:100;font-size:small}.type-club{color:#92f7af;font-weight:100;font-size:small}.card{position:relative;width:190px;height:254px;background-color:#565656;display:flex;flex-direction:column;justify-content:end;padding:12px;gap:12px;border-radius:8px;cursor:pointer}.card:before{content:\"\";position:absolute;inset:0 0 0 -5px;margin:auto;width:200px;height:264px;border-radius:10px;background:linear-gradient(175deg,rgba(4,18,106,1) 27%,rgba(48,63,155,1) 53%,rgba(28,119,247,1) 90%);z-index:-10;pointer-events:none;transition:all .6s cubic-bezier(.175,.885,.32,1.275)}.card:after{content:\"\";z-index:-1;position:absolute;inset:0;background:linear-gradient(-45deg,rgba(0,63,255,1) 0%,rgba(4,18,106,1) 100%);transform:translateZ(0) scale(.95);filter:blur(20px)}.heading{text-transform:capitalize;font-weight:700;color:#fff}.card p:not(.heading){font-size:14px}.card p:last-child{color:#0497d9;font-weight:600}.card:hover:after{filter:blur(30px)}.card:hover:before{transform:rotate(-90deg) scaleX(1.34) scaleY(.77)}span,strong{color:#fff;font-weight:100;font-size:small}.container-card{z-index:0;position:relative;justify-content:center;display:flex;margin:1rem 0 3rem}.container__tittle__card{margin-top:2rem;font-weight:700}\n"] }]
         }], propDecorators: { courseSelect: [{
                 type: Input
             }] } });
@@ -2811,10 +2811,10 @@ class CodDocumentsSectionComponent {
     }
 }
 CodDocumentsSectionComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.0.7", ngImport: i0, type: CodDocumentsSectionComponent, deps: [{ token: i1$1.FormBuilder }, { token: MediaService }, { token: UserService }, { token: BaseService }], target: i0.ɵɵFactoryTarget.Component });
-CodDocumentsSectionComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.0.7", type: CodDocumentsSectionComponent, selector: "ipt-cod-documents-section", ngImport: i0, template: "<div class=\"container flex flex-column bg-white border-round-2xl p-3 container animate__animated animate__fadeInUp\">\r\n\r\n  <span class=\"bg-primary p-2 border-round mb-2 w-auto text-lg font-semibold\">Documentos del COD</span>\r\n\r\n  <div class=\"document_item flex flex-column align-items-center p-2 border-round\">\r\n    <div class=\"ml-auto\">\r\n      <div class=\"inp w-10\">\r\n        <ipt-input\r\n        [inputType]=\"'file'\"\r\n        [placeHolder]=\"'Doc. Estudiante'\"\r\n        [control]=\"documentsForm.controls['doc_student']\"\r\n        (change)=\"catchDocument($event, 'doc_student')\"\r\n        ></ipt-input>\r\n      </div>\r\n      <div class=\"btn flex justify-content-center flex-wrap w-8 p-2\" *ngIf=\"docStudent\">\r\n        <button pButton pRipple type=\"button\" icon=\"pi pi-eye\" class=\"p-button-rounded p-button-sm ml-auto mr-1\" (click)=\"showIdDocument()\"></button>\r\n        <button pButton pRipple type=\"button\" icon=\"pi pi-trash\" class=\"p-button-rounded p-button-sm p-button-danger ml-auto\" (click)=\"clearDocStudent('doc_student')\"></button>\r\n      </div>\r\n    </div>\r\n  </div>\r\n\r\n  <div class=\"document_item flex flex-column align-items-center p-2 border-round\">\r\n    <div class=\"ml-auto\">\r\n      <div class=\"inp w-10\">\r\n        <ipt-input\r\n        [inputType]=\"'file'\"\r\n        [placeHolder]=\"'Doc. Convenio'\"\r\n        [control]=\"documentsForm.controls['doc_agreement']\"\r\n        (change)=\"catchDocument($event, 'doc_agreement')\"\r\n        ></ipt-input>\r\n      </div>\r\n      <div class=\"btn flex justify-content-center flex-wrap w-8 p-2\" *ngIf=\"docAgreement\">\r\n        <button pButton pRipple type=\"button\" icon=\"pi pi-eye\" class=\"p-button-rounded p-button-sm ml-auto mr-1\" (click)=\"showIdDocument()\"></button>\r\n        <button pButton pRipple type=\"button\" icon=\"pi pi-trash\" class=\"p-button-rounded p-button-sm p-button-danger ml-auto\" (click)=\"clearDocStudent('doc_agreement')\"></button>\r\n      </div>\r\n    </div>\r\n  </div>\r\n\r\n  <div class=\"document_item flex flex-column align-items-center p-2 border-round\">\r\n    <div class=\"ml-auto\">\r\n      <div class=\"inp w-10\">\r\n        <ipt-input\r\n        [inputType]=\"'file'\"\r\n        [placeHolder]=\"'Doc. Acudiente'\"\r\n        [control]=\"documentsForm.controls['doc_parent']\"\r\n        (change)=\"catchDocument($event, 'doc_parent')\"\r\n        ></ipt-input>\r\n      </div>\r\n      <div class=\"btn flex justify-content-center flex-wrap w-8 p-2\" *ngIf=\"docParent\">\r\n        <button pButton pRipple type=\"button\" icon=\"pi pi-eye\" class=\"p-button-rounded p-button-sm ml-auto mr-1\" (click)=\"showIdDocument()\"></button>\r\n        <button pButton pRipple type=\"button\" icon=\"pi pi-trash\" class=\"p-button-rounded p-button-sm p-button-danger ml-auto\" (click)=\"clearDocStudent('doc_parent')\"></button>\r\n      </div>\r\n    </div>\r\n  </div>\r\n\r\n  <div class=\"document_item flex flex-column align-items-center p-2 border-round\">\r\n    <div class=\"ml-auto\">\r\n      <div class=\"inp w-10\">\r\n        <ipt-input\r\n        [inputType]=\"'file'\"\r\n        [placeHolder]=\"'Doc. Confanorte'\"\r\n        [control]=\"documentsForm.controls['doc_confanorte']\"\r\n        (change)=\"catchDocument($event, 'doc_confanorte')\"\r\n        ></ipt-input>\r\n      </div>\r\n      <div class=\"btn flex justify-content-center flex-wrap w-8 p-2\" *ngIf=\"docConfanorte\">\r\n        <button pButton pRipple type=\"button\" icon=\"pi pi-eye\" class=\"p-button-rounded p-button-sm ml-auto mr-1\" (click)=\"showIdDocument()\"></button>\r\n        <button pButton pRipple type=\"button\" icon=\"pi pi-trash\" class=\"p-button-rounded p-button-sm p-button-danger ml-auto\" (click)=\"clearDocStudent('doc_confanorte')\"></button>\r\n      </div>\r\n    </div>\r\n  </div>\r\n\r\n  <hr>\r\n  <button pButton pRipple type=\"button\" icon=\"pi pi-plus\" label=\"Agregar\" class=\"p-button-rounded p-button-sm ml-auto mt-2\" (click)=\"filesUploaded()\"></button>\r\n\r\n</div>\r\n", styles: [".document_item{transition:.15s;gap:1rem;max-height:150px}.document_item:hover{cursor:pointer;box-shadow:#64646f33 0 7px 29px}\n"], dependencies: [{ kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: InputComponent, selector: "ipt-input", inputs: ["inputType", "placeHolder", "validateText", "withPipe", "list", "iconUrl", "control", "prefix", "thousands", "decimal", "disabledSel"], outputs: ["dateSelected"] }, { kind: "directive", type: i7$1.ButtonDirective, selector: "[pButton]", inputs: ["iconPos", "loadingIcon", "label", "icon", "loading"] }] });
+CodDocumentsSectionComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.0.7", type: CodDocumentsSectionComponent, selector: "ipt-cod-documents-section", ngImport: i0, template: "<div class=\"container flex flex-column bg-white border-round-2xl p-3 container animate__animated animate__fadeInUp\">\n\n  <span class=\"bg-primary p-2 border-round mb-2 w-auto text-lg font-semibold\">Documentos del COD</span>\n\n  <div class=\"document_item flex flex-column align-items-center p-2 border-round\">\n    <div class=\"ml-auto\">\n      <div class=\"inp w-10\">\n        <ipt-input\n        [inputType]=\"'file'\"\n        [placeHolder]=\"'Doc. Estudiante'\"\n        [control]=\"documentsForm.controls['doc_student']\"\n        (change)=\"catchDocument($event, 'doc_student')\"\n        ></ipt-input>\n      </div>\n      <div class=\"btn flex justify-content-center flex-wrap w-8 p-2\" *ngIf=\"docStudent\">\n        <button pButton pRipple type=\"button\" icon=\"pi pi-eye\" class=\"p-button-rounded p-button-sm ml-auto mr-1\" (click)=\"showIdDocument()\"></button>\n        <button pButton pRipple type=\"button\" icon=\"pi pi-trash\" class=\"p-button-rounded p-button-sm p-button-danger ml-auto\" (click)=\"clearDocStudent('doc_student')\"></button>\n      </div>\n    </div>\n  </div>\n\n  <div class=\"document_item flex flex-column align-items-center p-2 border-round\">\n    <div class=\"ml-auto\">\n      <div class=\"inp w-10\">\n        <ipt-input\n        [inputType]=\"'file'\"\n        [placeHolder]=\"'Doc. Convenio'\"\n        [control]=\"documentsForm.controls['doc_agreement']\"\n        (change)=\"catchDocument($event, 'doc_agreement')\"\n        ></ipt-input>\n      </div>\n      <div class=\"btn flex justify-content-center flex-wrap w-8 p-2\" *ngIf=\"docAgreement\">\n        <button pButton pRipple type=\"button\" icon=\"pi pi-eye\" class=\"p-button-rounded p-button-sm ml-auto mr-1\" (click)=\"showIdDocument()\"></button>\n        <button pButton pRipple type=\"button\" icon=\"pi pi-trash\" class=\"p-button-rounded p-button-sm p-button-danger ml-auto\" (click)=\"clearDocStudent('doc_agreement')\"></button>\n      </div>\n    </div>\n  </div>\n\n  <div class=\"document_item flex flex-column align-items-center p-2 border-round\">\n    <div class=\"ml-auto\">\n      <div class=\"inp w-10\">\n        <ipt-input\n        [inputType]=\"'file'\"\n        [placeHolder]=\"'Doc. Acudiente'\"\n        [control]=\"documentsForm.controls['doc_parent']\"\n        (change)=\"catchDocument($event, 'doc_parent')\"\n        ></ipt-input>\n      </div>\n      <div class=\"btn flex justify-content-center flex-wrap w-8 p-2\" *ngIf=\"docParent\">\n        <button pButton pRipple type=\"button\" icon=\"pi pi-eye\" class=\"p-button-rounded p-button-sm ml-auto mr-1\" (click)=\"showIdDocument()\"></button>\n        <button pButton pRipple type=\"button\" icon=\"pi pi-trash\" class=\"p-button-rounded p-button-sm p-button-danger ml-auto\" (click)=\"clearDocStudent('doc_parent')\"></button>\n      </div>\n    </div>\n  </div>\n\n  <div class=\"document_item flex flex-column align-items-center p-2 border-round\">\n    <div class=\"ml-auto\">\n      <div class=\"inp w-10\">\n        <ipt-input\n        [inputType]=\"'file'\"\n        [placeHolder]=\"'Doc. Confanorte'\"\n        [control]=\"documentsForm.controls['doc_confanorte']\"\n        (change)=\"catchDocument($event, 'doc_confanorte')\"\n        ></ipt-input>\n      </div>\n      <div class=\"btn flex justify-content-center flex-wrap w-8 p-2\" *ngIf=\"docConfanorte\">\n        <button pButton pRipple type=\"button\" icon=\"pi pi-eye\" class=\"p-button-rounded p-button-sm ml-auto mr-1\" (click)=\"showIdDocument()\"></button>\n        <button pButton pRipple type=\"button\" icon=\"pi pi-trash\" class=\"p-button-rounded p-button-sm p-button-danger ml-auto\" (click)=\"clearDocStudent('doc_confanorte')\"></button>\n      </div>\n    </div>\n  </div>\n\n  <hr>\n  <button pButton pRipple type=\"button\" icon=\"pi pi-plus\" label=\"Agregar\" class=\"p-button-rounded p-button-sm ml-auto mt-2\" (click)=\"filesUploaded()\"></button>\n\n</div>\n", styles: [".document_item{transition:.15s;gap:1rem;max-height:150px}.document_item:hover{cursor:pointer;box-shadow:#64646f33 0 7px 29px}\n"], dependencies: [{ kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: InputComponent, selector: "ipt-input", inputs: ["inputType", "placeHolder", "validateText", "withPipe", "list", "iconUrl", "control", "prefix", "thousands", "decimal", "disabledSel"], outputs: ["dateSelected"] }, { kind: "directive", type: i7$1.ButtonDirective, selector: "[pButton]", inputs: ["iconPos", "loadingIcon", "label", "icon", "loading"] }] });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.0.7", ngImport: i0, type: CodDocumentsSectionComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'ipt-cod-documents-section', template: "<div class=\"container flex flex-column bg-white border-round-2xl p-3 container animate__animated animate__fadeInUp\">\r\n\r\n  <span class=\"bg-primary p-2 border-round mb-2 w-auto text-lg font-semibold\">Documentos del COD</span>\r\n\r\n  <div class=\"document_item flex flex-column align-items-center p-2 border-round\">\r\n    <div class=\"ml-auto\">\r\n      <div class=\"inp w-10\">\r\n        <ipt-input\r\n        [inputType]=\"'file'\"\r\n        [placeHolder]=\"'Doc. Estudiante'\"\r\n        [control]=\"documentsForm.controls['doc_student']\"\r\n        (change)=\"catchDocument($event, 'doc_student')\"\r\n        ></ipt-input>\r\n      </div>\r\n      <div class=\"btn flex justify-content-center flex-wrap w-8 p-2\" *ngIf=\"docStudent\">\r\n        <button pButton pRipple type=\"button\" icon=\"pi pi-eye\" class=\"p-button-rounded p-button-sm ml-auto mr-1\" (click)=\"showIdDocument()\"></button>\r\n        <button pButton pRipple type=\"button\" icon=\"pi pi-trash\" class=\"p-button-rounded p-button-sm p-button-danger ml-auto\" (click)=\"clearDocStudent('doc_student')\"></button>\r\n      </div>\r\n    </div>\r\n  </div>\r\n\r\n  <div class=\"document_item flex flex-column align-items-center p-2 border-round\">\r\n    <div class=\"ml-auto\">\r\n      <div class=\"inp w-10\">\r\n        <ipt-input\r\n        [inputType]=\"'file'\"\r\n        [placeHolder]=\"'Doc. Convenio'\"\r\n        [control]=\"documentsForm.controls['doc_agreement']\"\r\n        (change)=\"catchDocument($event, 'doc_agreement')\"\r\n        ></ipt-input>\r\n      </div>\r\n      <div class=\"btn flex justify-content-center flex-wrap w-8 p-2\" *ngIf=\"docAgreement\">\r\n        <button pButton pRipple type=\"button\" icon=\"pi pi-eye\" class=\"p-button-rounded p-button-sm ml-auto mr-1\" (click)=\"showIdDocument()\"></button>\r\n        <button pButton pRipple type=\"button\" icon=\"pi pi-trash\" class=\"p-button-rounded p-button-sm p-button-danger ml-auto\" (click)=\"clearDocStudent('doc_agreement')\"></button>\r\n      </div>\r\n    </div>\r\n  </div>\r\n\r\n  <div class=\"document_item flex flex-column align-items-center p-2 border-round\">\r\n    <div class=\"ml-auto\">\r\n      <div class=\"inp w-10\">\r\n        <ipt-input\r\n        [inputType]=\"'file'\"\r\n        [placeHolder]=\"'Doc. Acudiente'\"\r\n        [control]=\"documentsForm.controls['doc_parent']\"\r\n        (change)=\"catchDocument($event, 'doc_parent')\"\r\n        ></ipt-input>\r\n      </div>\r\n      <div class=\"btn flex justify-content-center flex-wrap w-8 p-2\" *ngIf=\"docParent\">\r\n        <button pButton pRipple type=\"button\" icon=\"pi pi-eye\" class=\"p-button-rounded p-button-sm ml-auto mr-1\" (click)=\"showIdDocument()\"></button>\r\n        <button pButton pRipple type=\"button\" icon=\"pi pi-trash\" class=\"p-button-rounded p-button-sm p-button-danger ml-auto\" (click)=\"clearDocStudent('doc_parent')\"></button>\r\n      </div>\r\n    </div>\r\n  </div>\r\n\r\n  <div class=\"document_item flex flex-column align-items-center p-2 border-round\">\r\n    <div class=\"ml-auto\">\r\n      <div class=\"inp w-10\">\r\n        <ipt-input\r\n        [inputType]=\"'file'\"\r\n        [placeHolder]=\"'Doc. Confanorte'\"\r\n        [control]=\"documentsForm.controls['doc_confanorte']\"\r\n        (change)=\"catchDocument($event, 'doc_confanorte')\"\r\n        ></ipt-input>\r\n      </div>\r\n      <div class=\"btn flex justify-content-center flex-wrap w-8 p-2\" *ngIf=\"docConfanorte\">\r\n        <button pButton pRipple type=\"button\" icon=\"pi pi-eye\" class=\"p-button-rounded p-button-sm ml-auto mr-1\" (click)=\"showIdDocument()\"></button>\r\n        <button pButton pRipple type=\"button\" icon=\"pi pi-trash\" class=\"p-button-rounded p-button-sm p-button-danger ml-auto\" (click)=\"clearDocStudent('doc_confanorte')\"></button>\r\n      </div>\r\n    </div>\r\n  </div>\r\n\r\n  <hr>\r\n  <button pButton pRipple type=\"button\" icon=\"pi pi-plus\" label=\"Agregar\" class=\"p-button-rounded p-button-sm ml-auto mt-2\" (click)=\"filesUploaded()\"></button>\r\n\r\n</div>\r\n", styles: [".document_item{transition:.15s;gap:1rem;max-height:150px}.document_item:hover{cursor:pointer;box-shadow:#64646f33 0 7px 29px}\n"] }]
+            args: [{ selector: 'ipt-cod-documents-section', template: "<div class=\"container flex flex-column bg-white border-round-2xl p-3 container animate__animated animate__fadeInUp\">\n\n  <span class=\"bg-primary p-2 border-round mb-2 w-auto text-lg font-semibold\">Documentos del COD</span>\n\n  <div class=\"document_item flex flex-column align-items-center p-2 border-round\">\n    <div class=\"ml-auto\">\n      <div class=\"inp w-10\">\n        <ipt-input\n        [inputType]=\"'file'\"\n        [placeHolder]=\"'Doc. Estudiante'\"\n        [control]=\"documentsForm.controls['doc_student']\"\n        (change)=\"catchDocument($event, 'doc_student')\"\n        ></ipt-input>\n      </div>\n      <div class=\"btn flex justify-content-center flex-wrap w-8 p-2\" *ngIf=\"docStudent\">\n        <button pButton pRipple type=\"button\" icon=\"pi pi-eye\" class=\"p-button-rounded p-button-sm ml-auto mr-1\" (click)=\"showIdDocument()\"></button>\n        <button pButton pRipple type=\"button\" icon=\"pi pi-trash\" class=\"p-button-rounded p-button-sm p-button-danger ml-auto\" (click)=\"clearDocStudent('doc_student')\"></button>\n      </div>\n    </div>\n  </div>\n\n  <div class=\"document_item flex flex-column align-items-center p-2 border-round\">\n    <div class=\"ml-auto\">\n      <div class=\"inp w-10\">\n        <ipt-input\n        [inputType]=\"'file'\"\n        [placeHolder]=\"'Doc. Convenio'\"\n        [control]=\"documentsForm.controls['doc_agreement']\"\n        (change)=\"catchDocument($event, 'doc_agreement')\"\n        ></ipt-input>\n      </div>\n      <div class=\"btn flex justify-content-center flex-wrap w-8 p-2\" *ngIf=\"docAgreement\">\n        <button pButton pRipple type=\"button\" icon=\"pi pi-eye\" class=\"p-button-rounded p-button-sm ml-auto mr-1\" (click)=\"showIdDocument()\"></button>\n        <button pButton pRipple type=\"button\" icon=\"pi pi-trash\" class=\"p-button-rounded p-button-sm p-button-danger ml-auto\" (click)=\"clearDocStudent('doc_agreement')\"></button>\n      </div>\n    </div>\n  </div>\n\n  <div class=\"document_item flex flex-column align-items-center p-2 border-round\">\n    <div class=\"ml-auto\">\n      <div class=\"inp w-10\">\n        <ipt-input\n        [inputType]=\"'file'\"\n        [placeHolder]=\"'Doc. Acudiente'\"\n        [control]=\"documentsForm.controls['doc_parent']\"\n        (change)=\"catchDocument($event, 'doc_parent')\"\n        ></ipt-input>\n      </div>\n      <div class=\"btn flex justify-content-center flex-wrap w-8 p-2\" *ngIf=\"docParent\">\n        <button pButton pRipple type=\"button\" icon=\"pi pi-eye\" class=\"p-button-rounded p-button-sm ml-auto mr-1\" (click)=\"showIdDocument()\"></button>\n        <button pButton pRipple type=\"button\" icon=\"pi pi-trash\" class=\"p-button-rounded p-button-sm p-button-danger ml-auto\" (click)=\"clearDocStudent('doc_parent')\"></button>\n      </div>\n    </div>\n  </div>\n\n  <div class=\"document_item flex flex-column align-items-center p-2 border-round\">\n    <div class=\"ml-auto\">\n      <div class=\"inp w-10\">\n        <ipt-input\n        [inputType]=\"'file'\"\n        [placeHolder]=\"'Doc. Confanorte'\"\n        [control]=\"documentsForm.controls['doc_confanorte']\"\n        (change)=\"catchDocument($event, 'doc_confanorte')\"\n        ></ipt-input>\n      </div>\n      <div class=\"btn flex justify-content-center flex-wrap w-8 p-2\" *ngIf=\"docConfanorte\">\n        <button pButton pRipple type=\"button\" icon=\"pi pi-eye\" class=\"p-button-rounded p-button-sm ml-auto mr-1\" (click)=\"showIdDocument()\"></button>\n        <button pButton pRipple type=\"button\" icon=\"pi pi-trash\" class=\"p-button-rounded p-button-sm p-button-danger ml-auto\" (click)=\"clearDocStudent('doc_confanorte')\"></button>\n      </div>\n    </div>\n  </div>\n\n  <hr>\n  <button pButton pRipple type=\"button\" icon=\"pi pi-plus\" label=\"Agregar\" class=\"p-button-rounded p-button-sm ml-auto mt-2\" (click)=\"filesUploaded()\"></button>\n\n</div>\n", styles: [".document_item{transition:.15s;gap:1rem;max-height:150px}.document_item:hover{cursor:pointer;box-shadow:#64646f33 0 7px 29px}\n"] }]
         }], ctorParameters: function () { return [{ type: i1$1.FormBuilder }, { type: MediaService }, { type: UserService }, { type: BaseService }]; } });
 
 class LocalStorageCODService {
@@ -3835,10 +3835,10 @@ class CodFormStepOneComponent extends CodFormSteps {
     }
 }
 CodFormStepOneComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.0.7", ngImport: i0, type: CodFormStepOneComponent, deps: [{ token: i1$1.FormBuilder }, { token: ParameterService }, { token: CopiesService }, { token: BaseService }, { token: CourseService }, { token: CommunicatorService }, { token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component });
-CodFormStepOneComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.0.7", type: CodFormStepOneComponent, selector: "app-cod-form-step-one", inputs: { initialData: "initialData", dataPreviusCodData: "dataPreviusCodData", isEditCod: "isEditCod", courseSelectRenovation: "courseSelectRenovation", isRenovation: "isRenovation" }, outputs: { changeStepEvent: "changeStepEvent" }, usesInheritance: true, usesOnChanges: true, ngImport: i0, template: "<form [formGroup]=\"codFormStepOne\" class=\"grid\">\r\n  <div class=\"col\">\r\n    <ipt-select\r\n      [initialValue]=\"codFormStepOne.controls['academic_plan'].value\"\r\n      [selectCode]=\"codFormStepOne.controls['academic_plan'].value === null? 'Plan': codFormStepOne.controls['academic_plan'].value\"\r\n      [defaultText]=\"'Plan'\"\r\n      [isRequired]=\"true\"\r\n      (eventSelect)=\"selectAcademicPlan($event)\"\r\n      [data]=\"plans\"\r\n      [control]=\"codFormStepOne.controls['academic_plan']\"\r\n      [disabledSel]=\"isDisabledSel\"\r\n    ></ipt-select>\r\n    <ipt-select\r\n      [initialValue]=\"codFormStepOne.controls['course_type'].value\"\r\n      [selectCode]=\"codFormStepOne.controls['course_type'].value === null? 'Tipo de plan': codFormStepOne.controls['course_type'].value\"\r\n      [defaultText]=\"'Tipo de plan'\"\r\n      [isRequired]=\"true\"\r\n      (eventSelect)=\"selectCoursesTypesByPlan($event)\"\r\n      [data]=\"course_type\"\r\n      [control]=\"codFormStepOne.controls['course_type']\"\r\n      [disabledSel]=\"isDisabledSel\"\r\n    ></ipt-select>\r\n  </div>\r\n  <div class=\"col\">\r\n    <ipt-select\r\n      [initialValue]=\"codFormStepOne.controls['agreement_by_category'].value\"\r\n      [selectCode]=\"codFormStepOne.controls['agreement_by_category'].value === null? 'Convenio por categoria': codFormStepOne.controls['agreement_by_category'].value\"\r\n      [defaultText]=\"'Convenio por categoria'\"\r\n      [isRequired]=\"true\"\r\n      (eventSelect)=\"selectAgreementByCategory($event)\"\r\n      [data]=\"agreements\"\r\n      [control]=\"codFormStepOne.controls['agreement_by_category']\"\r\n      [disabledSel]=\"isDisabledSel\"\r\n    ></ipt-select>\r\n    <ipt-select\r\n      [initialValue]=\"codFormStepOne.controls['english_level'].value\"\r\n      [selectCode]=\"codFormStepOne.controls['english_level'].value === null? 'Nivel de ingl\u00E9s': codFormStepOne.controls['english_level'].value\"\r\n      [defaultText]=\"'Nivel de ingl\u00E9s'\"\r\n      [isRequired]=\"true\"\r\n      (eventSelect)=\"selectLevel($event)\"\r\n      [data]=\"levels\"\r\n      [control]=\"codFormStepOne.controls['english_level']\"\r\n      [disabledSel]=\"isDisabledSel\"\r\n    ></ipt-select>\r\n  </div>\r\n  <div class=\"col-12\">\r\n    <ipt-select\r\n      [initialValue]=\"codFormStepOne.controls['availible_courses'].value\"\r\n      [selectCode]=\"codFormStepOne.controls['availible_courses'].value === null? 'Grupos disponibles': codFormStepOne.controls['availible_courses'].value\"\r\n      [defaultText]=\"'Grupos disponibles'\"\r\n      [isRequired]=\"true\"\r\n      (eventSelect)=\"selectAvailibleCourses($event)\"\r\n      [data]=\"availibleCourses\"\r\n      [control]=\"codFormStepOne.controls['availible_courses']\"\r\n      [disabledSel]=\"isDisabledSel\"\r\n    ></ipt-select>\r\n  </div>\r\n  <span *ngIf=\"!hasAvailableCourse\" class=\"mt-1 pl-2 text-red-500\">Todav\u00EDa no hay cursos con estas caracter\u00EDsticas.</span>\r\n</form>\r\n\r\n<div class=\"flex mt-2 align-items-center gap-3\">\r\n  <span *ngIf=\"codFormStepOne.invalid && codFormStepOne.touched\" class=\"text-red-500 font-bold text-center mt-1 py-2 bg-red-100 w-full border-round-xl\">Faltan campos por llenar.</span>\r\n  <button type=\"submit\" [class]=\"isEditCod ? 'ml-auto yellow-300 p-button-sm' : 'ml-auto p-button-sm'\" (click)=\"sendForm()\" pButton label=\"Siguiente\" icon=\"pi pi-arrow-right\"></button>\r\n</div>\r\n", styles: [".yellow-300{background-color:var(--yellow-500)!important;color:#fff}\n"], dependencies: [{ kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: SelectComponent, selector: "ipt-select", inputs: ["isRequired", "data", "defaultText", "selectCode", "disabledSel", "initialValue", "control"], outputs: ["eventSelect"] }, { kind: "directive", type: i1$1.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i1$1.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i1$1.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i7$1.ButtonDirective, selector: "[pButton]", inputs: ["iconPos", "loadingIcon", "label", "icon", "loading"] }] });
+CodFormStepOneComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.0.7", type: CodFormStepOneComponent, selector: "app-cod-form-step-one", inputs: { initialData: "initialData", dataPreviusCodData: "dataPreviusCodData", isEditCod: "isEditCod", courseSelectRenovation: "courseSelectRenovation", isRenovation: "isRenovation" }, outputs: { changeStepEvent: "changeStepEvent" }, usesInheritance: true, usesOnChanges: true, ngImport: i0, template: "<form [formGroup]=\"codFormStepOne\" class=\"grid\">\n  <div class=\"col\">\n    <ipt-select\n      [initialValue]=\"codFormStepOne.controls['academic_plan'].value\"\n      [selectCode]=\"codFormStepOne.controls['academic_plan'].value === null? 'Plan': codFormStepOne.controls['academic_plan'].value\"\n      [defaultText]=\"'Plan'\"\n      [isRequired]=\"true\"\n      (eventSelect)=\"selectAcademicPlan($event)\"\n      [data]=\"plans\"\n      [control]=\"codFormStepOne.controls['academic_plan']\"\n      [disabledSel]=\"isDisabledSel\"\n    ></ipt-select>\n    <ipt-select\n      [initialValue]=\"codFormStepOne.controls['course_type'].value\"\n      [selectCode]=\"codFormStepOne.controls['course_type'].value === null? 'Tipo de plan': codFormStepOne.controls['course_type'].value\"\n      [defaultText]=\"'Tipo de plan'\"\n      [isRequired]=\"true\"\n      (eventSelect)=\"selectCoursesTypesByPlan($event)\"\n      [data]=\"course_type\"\n      [control]=\"codFormStepOne.controls['course_type']\"\n      [disabledSel]=\"isDisabledSel\"\n    ></ipt-select>\n  </div>\n  <div class=\"col\">\n    <ipt-select\n      [initialValue]=\"codFormStepOne.controls['agreement_by_category'].value\"\n      [selectCode]=\"codFormStepOne.controls['agreement_by_category'].value === null? 'Convenio por categoria': codFormStepOne.controls['agreement_by_category'].value\"\n      [defaultText]=\"'Convenio por categoria'\"\n      [isRequired]=\"true\"\n      (eventSelect)=\"selectAgreementByCategory($event)\"\n      [data]=\"agreements\"\n      [control]=\"codFormStepOne.controls['agreement_by_category']\"\n      [disabledSel]=\"isDisabledSel\"\n    ></ipt-select>\n    <ipt-select\n      [initialValue]=\"codFormStepOne.controls['english_level'].value\"\n      [selectCode]=\"codFormStepOne.controls['english_level'].value === null? 'Nivel de ingl\u00E9s': codFormStepOne.controls['english_level'].value\"\n      [defaultText]=\"'Nivel de ingl\u00E9s'\"\n      [isRequired]=\"true\"\n      (eventSelect)=\"selectLevel($event)\"\n      [data]=\"levels\"\n      [control]=\"codFormStepOne.controls['english_level']\"\n      [disabledSel]=\"isDisabledSel\"\n    ></ipt-select>\n  </div>\n  <div class=\"col-12\">\n    <ipt-select\n      [initialValue]=\"codFormStepOne.controls['availible_courses'].value\"\n      [selectCode]=\"codFormStepOne.controls['availible_courses'].value === null? 'Grupos disponibles': codFormStepOne.controls['availible_courses'].value\"\n      [defaultText]=\"'Grupos disponibles'\"\n      [isRequired]=\"true\"\n      (eventSelect)=\"selectAvailibleCourses($event)\"\n      [data]=\"availibleCourses\"\n      [control]=\"codFormStepOne.controls['availible_courses']\"\n      [disabledSel]=\"isDisabledSel\"\n    ></ipt-select>\n  </div>\n  <span *ngIf=\"!hasAvailableCourse\" class=\"mt-1 pl-2 text-red-500\">Todav\u00EDa no hay cursos con estas caracter\u00EDsticas.</span>\n</form>\n\n<div class=\"flex mt-2 align-items-center gap-3\">\n  <span *ngIf=\"codFormStepOne.invalid && codFormStepOne.touched\" class=\"text-red-500 font-bold text-center mt-1 py-2 bg-red-100 w-full border-round-xl\">Faltan campos por llenar.</span>\n  <button type=\"submit\" [class]=\"isEditCod ? 'ml-auto yellow-300 p-button-sm' : 'ml-auto p-button-sm'\" (click)=\"sendForm()\" pButton label=\"Siguiente\" icon=\"pi pi-arrow-right\"></button>\n</div>\n", styles: [".yellow-300{background-color:var(--yellow-500)!important;color:#fff}\n"], dependencies: [{ kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: SelectComponent, selector: "ipt-select", inputs: ["isRequired", "data", "defaultText", "selectCode", "disabledSel", "initialValue", "control"], outputs: ["eventSelect"] }, { kind: "directive", type: i1$1.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i1$1.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i1$1.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i7$1.ButtonDirective, selector: "[pButton]", inputs: ["iconPos", "loadingIcon", "label", "icon", "loading"] }] });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.0.7", ngImport: i0, type: CodFormStepOneComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'app-cod-form-step-one', template: "<form [formGroup]=\"codFormStepOne\" class=\"grid\">\r\n  <div class=\"col\">\r\n    <ipt-select\r\n      [initialValue]=\"codFormStepOne.controls['academic_plan'].value\"\r\n      [selectCode]=\"codFormStepOne.controls['academic_plan'].value === null? 'Plan': codFormStepOne.controls['academic_plan'].value\"\r\n      [defaultText]=\"'Plan'\"\r\n      [isRequired]=\"true\"\r\n      (eventSelect)=\"selectAcademicPlan($event)\"\r\n      [data]=\"plans\"\r\n      [control]=\"codFormStepOne.controls['academic_plan']\"\r\n      [disabledSel]=\"isDisabledSel\"\r\n    ></ipt-select>\r\n    <ipt-select\r\n      [initialValue]=\"codFormStepOne.controls['course_type'].value\"\r\n      [selectCode]=\"codFormStepOne.controls['course_type'].value === null? 'Tipo de plan': codFormStepOne.controls['course_type'].value\"\r\n      [defaultText]=\"'Tipo de plan'\"\r\n      [isRequired]=\"true\"\r\n      (eventSelect)=\"selectCoursesTypesByPlan($event)\"\r\n      [data]=\"course_type\"\r\n      [control]=\"codFormStepOne.controls['course_type']\"\r\n      [disabledSel]=\"isDisabledSel\"\r\n    ></ipt-select>\r\n  </div>\r\n  <div class=\"col\">\r\n    <ipt-select\r\n      [initialValue]=\"codFormStepOne.controls['agreement_by_category'].value\"\r\n      [selectCode]=\"codFormStepOne.controls['agreement_by_category'].value === null? 'Convenio por categoria': codFormStepOne.controls['agreement_by_category'].value\"\r\n      [defaultText]=\"'Convenio por categoria'\"\r\n      [isRequired]=\"true\"\r\n      (eventSelect)=\"selectAgreementByCategory($event)\"\r\n      [data]=\"agreements\"\r\n      [control]=\"codFormStepOne.controls['agreement_by_category']\"\r\n      [disabledSel]=\"isDisabledSel\"\r\n    ></ipt-select>\r\n    <ipt-select\r\n      [initialValue]=\"codFormStepOne.controls['english_level'].value\"\r\n      [selectCode]=\"codFormStepOne.controls['english_level'].value === null? 'Nivel de ingl\u00E9s': codFormStepOne.controls['english_level'].value\"\r\n      [defaultText]=\"'Nivel de ingl\u00E9s'\"\r\n      [isRequired]=\"true\"\r\n      (eventSelect)=\"selectLevel($event)\"\r\n      [data]=\"levels\"\r\n      [control]=\"codFormStepOne.controls['english_level']\"\r\n      [disabledSel]=\"isDisabledSel\"\r\n    ></ipt-select>\r\n  </div>\r\n  <div class=\"col-12\">\r\n    <ipt-select\r\n      [initialValue]=\"codFormStepOne.controls['availible_courses'].value\"\r\n      [selectCode]=\"codFormStepOne.controls['availible_courses'].value === null? 'Grupos disponibles': codFormStepOne.controls['availible_courses'].value\"\r\n      [defaultText]=\"'Grupos disponibles'\"\r\n      [isRequired]=\"true\"\r\n      (eventSelect)=\"selectAvailibleCourses($event)\"\r\n      [data]=\"availibleCourses\"\r\n      [control]=\"codFormStepOne.controls['availible_courses']\"\r\n      [disabledSel]=\"isDisabledSel\"\r\n    ></ipt-select>\r\n  </div>\r\n  <span *ngIf=\"!hasAvailableCourse\" class=\"mt-1 pl-2 text-red-500\">Todav\u00EDa no hay cursos con estas caracter\u00EDsticas.</span>\r\n</form>\r\n\r\n<div class=\"flex mt-2 align-items-center gap-3\">\r\n  <span *ngIf=\"codFormStepOne.invalid && codFormStepOne.touched\" class=\"text-red-500 font-bold text-center mt-1 py-2 bg-red-100 w-full border-round-xl\">Faltan campos por llenar.</span>\r\n  <button type=\"submit\" [class]=\"isEditCod ? 'ml-auto yellow-300 p-button-sm' : 'ml-auto p-button-sm'\" (click)=\"sendForm()\" pButton label=\"Siguiente\" icon=\"pi pi-arrow-right\"></button>\r\n</div>\r\n", styles: [".yellow-300{background-color:var(--yellow-500)!important;color:#fff}\n"] }]
+            args: [{ selector: 'app-cod-form-step-one', template: "<form [formGroup]=\"codFormStepOne\" class=\"grid\">\n  <div class=\"col\">\n    <ipt-select\n      [initialValue]=\"codFormStepOne.controls['academic_plan'].value\"\n      [selectCode]=\"codFormStepOne.controls['academic_plan'].value === null? 'Plan': codFormStepOne.controls['academic_plan'].value\"\n      [defaultText]=\"'Plan'\"\n      [isRequired]=\"true\"\n      (eventSelect)=\"selectAcademicPlan($event)\"\n      [data]=\"plans\"\n      [control]=\"codFormStepOne.controls['academic_plan']\"\n      [disabledSel]=\"isDisabledSel\"\n    ></ipt-select>\n    <ipt-select\n      [initialValue]=\"codFormStepOne.controls['course_type'].value\"\n      [selectCode]=\"codFormStepOne.controls['course_type'].value === null? 'Tipo de plan': codFormStepOne.controls['course_type'].value\"\n      [defaultText]=\"'Tipo de plan'\"\n      [isRequired]=\"true\"\n      (eventSelect)=\"selectCoursesTypesByPlan($event)\"\n      [data]=\"course_type\"\n      [control]=\"codFormStepOne.controls['course_type']\"\n      [disabledSel]=\"isDisabledSel\"\n    ></ipt-select>\n  </div>\n  <div class=\"col\">\n    <ipt-select\n      [initialValue]=\"codFormStepOne.controls['agreement_by_category'].value\"\n      [selectCode]=\"codFormStepOne.controls['agreement_by_category'].value === null? 'Convenio por categoria': codFormStepOne.controls['agreement_by_category'].value\"\n      [defaultText]=\"'Convenio por categoria'\"\n      [isRequired]=\"true\"\n      (eventSelect)=\"selectAgreementByCategory($event)\"\n      [data]=\"agreements\"\n      [control]=\"codFormStepOne.controls['agreement_by_category']\"\n      [disabledSel]=\"isDisabledSel\"\n    ></ipt-select>\n    <ipt-select\n      [initialValue]=\"codFormStepOne.controls['english_level'].value\"\n      [selectCode]=\"codFormStepOne.controls['english_level'].value === null? 'Nivel de ingl\u00E9s': codFormStepOne.controls['english_level'].value\"\n      [defaultText]=\"'Nivel de ingl\u00E9s'\"\n      [isRequired]=\"true\"\n      (eventSelect)=\"selectLevel($event)\"\n      [data]=\"levels\"\n      [control]=\"codFormStepOne.controls['english_level']\"\n      [disabledSel]=\"isDisabledSel\"\n    ></ipt-select>\n  </div>\n  <div class=\"col-12\">\n    <ipt-select\n      [initialValue]=\"codFormStepOne.controls['availible_courses'].value\"\n      [selectCode]=\"codFormStepOne.controls['availible_courses'].value === null? 'Grupos disponibles': codFormStepOne.controls['availible_courses'].value\"\n      [defaultText]=\"'Grupos disponibles'\"\n      [isRequired]=\"true\"\n      (eventSelect)=\"selectAvailibleCourses($event)\"\n      [data]=\"availibleCourses\"\n      [control]=\"codFormStepOne.controls['availible_courses']\"\n      [disabledSel]=\"isDisabledSel\"\n    ></ipt-select>\n  </div>\n  <span *ngIf=\"!hasAvailableCourse\" class=\"mt-1 pl-2 text-red-500\">Todav\u00EDa no hay cursos con estas caracter\u00EDsticas.</span>\n</form>\n\n<div class=\"flex mt-2 align-items-center gap-3\">\n  <span *ngIf=\"codFormStepOne.invalid && codFormStepOne.touched\" class=\"text-red-500 font-bold text-center mt-1 py-2 bg-red-100 w-full border-round-xl\">Faltan campos por llenar.</span>\n  <button type=\"submit\" [class]=\"isEditCod ? 'ml-auto yellow-300 p-button-sm' : 'ml-auto p-button-sm'\" (click)=\"sendForm()\" pButton label=\"Siguiente\" icon=\"pi pi-arrow-right\"></button>\n</div>\n", styles: [".yellow-300{background-color:var(--yellow-500)!important;color:#fff}\n"] }]
         }], ctorParameters: function () { return [{ type: i1$1.FormBuilder }, { type: ParameterService }, { type: CopiesService }, { type: BaseService }, { type: CourseService }, { type: CommunicatorService }, { type: i0.ChangeDetectorRef }]; }, propDecorators: { initialData: [{
                 type: Input
             }], dataPreviusCodData: [{
@@ -4133,10 +4133,10 @@ class CodFormStepTwoComponent extends CodFormSteps {
     }
 }
 CodFormStepTwoComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.0.7", ngImport: i0, type: CodFormStepTwoComponent, deps: [{ token: i1$1.FormBuilder }, { token: ParameterService }], target: i0.ɵɵFactoryTarget.Component });
-CodFormStepTwoComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.0.7", type: CodFormStepTwoComponent, selector: "app-cod-form-step-two", inputs: { initialData: "initialData", isEditCod: "isEditCod" }, outputs: { changeStepEvent: "changeStepEvent" }, usesInheritance: true, usesOnChanges: true, ngImport: i0, template: "<form autocomplete=\"off\" [formGroup]=\"codFormStepTwo\" class=\"grid\">\r\n\r\n  <div class=\"col\">\r\n    <ipt-input\r\n      [inputType]=\"'text'\"\r\n      [placeHolder]=\"'Nombres'\"\r\n      [control]=\"codFormStepTwo.controls['student_name']\"\r\n    ></ipt-input>\r\n    <ipt-select\r\n      [initialValue]=\"codFormStepTwo.controls['student_id_card_type'].value\"\r\n      [control]=\"codFormStepTwo.controls['student_id_card_type']\"\r\n      [selectCode]=\"codFormStepTwo.controls['student_id_card_type'].value === null ? 'Tipo de documento' : codFormStepTwo.controls['student_id_card_type'].value\"\r\n      [isRequired]=\"true\"\r\n      [data]=\"idTypes\"\r\n      (eventSelect)=\"selectIdType($event)\"\r\n      [defaultText]=\"'Tipo de documento'\"\r\n    ></ipt-select>\r\n    <ipt-select\r\n      [initialValue]=\"codFormStepTwo.controls['country'].value\"\r\n      [control]=\"codFormStepTwo.controls['country']\"\r\n      [selectCode]=\"codFormStepTwo.controls['country'].value === null ? 'Pa\u00EDs de residencia' : codFormStepTwo.controls['country'].value\"\r\n      (eventSelect)=\"selectCountry($event)\"\r\n      [data]=\"countries\"\r\n      [defaultText]=\"'Pa\u00EDs de residencia'\"\r\n    ></ipt-select>\r\n    <ipt-select\r\n      [initialValue]=\"codFormStepTwo.controls['city'].value\"\r\n      [control]=\"codFormStepTwo.controls['city']\"\r\n      [selectCode]=\"codFormStepTwo.controls['city'].value === null ? 'Ciudad de residencia' : codFormStepTwo.controls['city'].value\"\r\n      (eventSelect)=\"selectCity($event)\"\r\n      [data]=\"cities\"\r\n      [defaultText]=\"'Ciudad de residencia'\"\r\n    ></ipt-select>\r\n    <ipt-input\r\n      onfocus=\"(this.type='date')\"\r\n      [inputType]=\"'date'\"\r\n      [control]=\"codFormStepTwo.controls['birthdate']\"\r\n      [placeHolder]=\"'Fecha de nacimiento'\"\r\n    ></ipt-input>\r\n     <ipt-select\r\n      [initialValue]=\"codFormStepTwo.controls['gender'].value\"\r\n      [control]=\"codFormStepTwo.controls['gender']\"\r\n      [data]=\"genders\"\r\n      (eventSelect)=\"selectGender($event)\"\r\n      [defaultText]=\"'G\u00E9nero'\"\r\n    ></ipt-select>\r\n    <ipt-select\r\n      [initialValue]=\"codFormStepTwo.controls['stratum'].value\"\r\n      [control]=\"codFormStepTwo.controls['stratum']\"\r\n      [data]=\"stratums\"\r\n      (eventSelect)=\"selectStratum($event)\"\r\n      [defaultText]=\"'Estrato'\"\r\n    ></ipt-select>\r\n    <ipt-input\r\n      [inputType]=\"'text'\"\r\n      [placeHolder]=\"'Grado'\"\r\n      [control]=\"codFormStepTwo.controls['grade']\"\r\n    ></ipt-input>\r\n    <ipt-select\r\n      [initialValue]=\"codFormStepTwo.controls['student_phone_indicative'].value\"\r\n      [control]=\"codFormStepTwo.controls['student_phone_indicative']\"\r\n      [data]=\"indicatives\"\r\n      (eventSelect)=\"selectIndicatives($event)\"\r\n      [defaultText]=\"'Indicativo'\"\r\n    ></ipt-select>\r\n    <ipt-input\r\n      [inputType]=\"'email'\"\r\n      [placeHolder]=\"'Correo electr\u00F3nico'\"\r\n      [control]=\"codFormStepTwo.controls['student_email']\"\r\n    ></ipt-input>\r\n    <ipt-input\r\n      [inputType]=\"'password'\"\r\n      [placeHolder]=\"'Repetir contrase\u00F1a'\"\r\n      [control]=\"codFormStepTwo.controls['re_password']\"\r\n    ></ipt-input>\r\n  </div>\r\n\r\n  <div class=\"col\">\r\n    <ipt-input\r\n      [inputType]=\"'text'\"\r\n      [placeHolder]=\"'Apellidos'\"\r\n      [control]=\"codFormStepTwo.controls['student_last_name']\"\r\n    ></ipt-input>\r\n    <ipt-input\r\n      [inputType]=\"'number'\"\r\n      [placeHolder]=\"'N\u00FAmero de documento'\"\r\n      [control]=\"codFormStepTwo.controls['student_id_card']\"\r\n    ></ipt-input>\r\n    <ipt-select\r\n      [initialValue]=\"codFormStepTwo.controls['state'].value\"\r\n      [control]=\"codFormStepTwo.controls['state']\"\r\n      [selectCode]=\"codFormStepTwo.controls['state'].value === null ? 'Departamento o estado' : codFormStepTwo.controls['state'].value\"\r\n      [isRequired]=\"true\"\r\n      (eventSelect)=\"selectState($event)\"\r\n      [data]=\"states\"\r\n      [defaultText]=\"'Departamento o estado'\"\r\n    ></ipt-select>\r\n    <ipt-input\r\n      [inputType]=\"'text'\"\r\n      [placeHolder]=\"'Direcci\u00F3n'\"\r\n      [control]=\"codFormStepTwo.controls['student_address']\"\r\n    ></ipt-input>\r\n    <ipt-input\r\n      [inputType]=\"'number'\"\r\n      [placeHolder]=\"'Edad'\"\r\n      [control]=\"codFormStepTwo.controls['age']\"\r\n    ></ipt-input>\r\n    <ipt-input\r\n      [inputType]=\"'text'\"\r\n      [placeHolder]=\"'Nickname'\"\r\n      [control]=\"codFormStepTwo.controls['nickname']\"\r\n    ></ipt-input>\r\n    <ipt-input\r\n      [inputType]=\"'text'\"\r\n      [placeHolder]=\"'Ocupaci\u00F3n'\"\r\n      [control]=\"codFormStepTwo.controls['student_occupation']\"\r\n    ></ipt-input>\r\n    <ipt-select\r\n      [initialValue]=\"codFormStepTwo.controls['civil_status'].value\"\r\n      [control]=\"codFormStepTwo.controls['civil_status']\"\r\n      [data]=\"civilStatus\"\r\n      (eventSelect)=\"selectCivilStatus($event)\"\r\n      [defaultText]=\"'Estado civil'\"\r\n    ></ipt-select>\r\n    <ipt-input\r\n      [inputType]=\"'number'\"\r\n      [placeHolder]=\"'N\u00FAmero de tel\u00E9fono'\"\r\n      [control]=\"codFormStepTwo.controls['student_phone_number']\"\r\n    ></ipt-input>\r\n    <ipt-input\r\n      [inputType]=\"'password'\"\r\n      [placeHolder]=\"'Contrase\u00F1a'\"\r\n      [control]=\"codFormStepTwo.controls['password']\"\r\n    ></ipt-input>\r\n  </div>\r\n\r\n  <div class=\"col-12\"></div>\r\n\r\n</form>\r\n\r\n<div class=\"flex mt-3 align-items-center gap-3\">\r\n  <span *ngIf=\"codFormStepTwo.invalid && codFormStepTwo.touched\" class=\"text-red-500 font-bold text-center mt-1 py-2 bg-red-100 w-full border-round-xl\">{{ errorMessage }}</span>\r\n  <button type=\"submit\" [class]=\"isEditCod ? 'ml-auto yellow-300 p-button-sm' : 'ml-auto p-button-sm'\" (click)=\"sendForm()\" pButton label=\"Siguiente\" icon=\"pi pi-arrow-right\"></button>\r\n</div>\r\n", styles: [".yellow-300{background-color:var(--yellow-500)!important;color:#fff}\n"], dependencies: [{ kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: InputComponent, selector: "ipt-input", inputs: ["inputType", "placeHolder", "validateText", "withPipe", "list", "iconUrl", "control", "prefix", "thousands", "decimal", "disabledSel"], outputs: ["dateSelected"] }, { kind: "component", type: SelectComponent, selector: "ipt-select", inputs: ["isRequired", "data", "defaultText", "selectCode", "disabledSel", "initialValue", "control"], outputs: ["eventSelect"] }, { kind: "directive", type: i1$1.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i1$1.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i1$1.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i7$1.ButtonDirective, selector: "[pButton]", inputs: ["iconPos", "loadingIcon", "label", "icon", "loading"] }] });
+CodFormStepTwoComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.0.7", type: CodFormStepTwoComponent, selector: "app-cod-form-step-two", inputs: { initialData: "initialData", isEditCod: "isEditCod" }, outputs: { changeStepEvent: "changeStepEvent" }, usesInheritance: true, usesOnChanges: true, ngImport: i0, template: "<form autocomplete=\"off\" [formGroup]=\"codFormStepTwo\" class=\"grid\">\n\n  <div class=\"col\">\n    <ipt-input\n      [inputType]=\"'text'\"\n      [placeHolder]=\"'Nombres'\"\n      [control]=\"codFormStepTwo.controls['student_name']\"\n    ></ipt-input>\n    <ipt-select\n      [initialValue]=\"codFormStepTwo.controls['student_id_card_type'].value\"\n      [control]=\"codFormStepTwo.controls['student_id_card_type']\"\n      [selectCode]=\"codFormStepTwo.controls['student_id_card_type'].value === null ? 'Tipo de documento' : codFormStepTwo.controls['student_id_card_type'].value\"\n      [isRequired]=\"true\"\n      [data]=\"idTypes\"\n      (eventSelect)=\"selectIdType($event)\"\n      [defaultText]=\"'Tipo de documento'\"\n    ></ipt-select>\n    <ipt-select\n      [initialValue]=\"codFormStepTwo.controls['country'].value\"\n      [control]=\"codFormStepTwo.controls['country']\"\n      [selectCode]=\"codFormStepTwo.controls['country'].value === null ? 'Pa\u00EDs de residencia' : codFormStepTwo.controls['country'].value\"\n      (eventSelect)=\"selectCountry($event)\"\n      [data]=\"countries\"\n      [defaultText]=\"'Pa\u00EDs de residencia'\"\n    ></ipt-select>\n    <ipt-select\n      [initialValue]=\"codFormStepTwo.controls['city'].value\"\n      [control]=\"codFormStepTwo.controls['city']\"\n      [selectCode]=\"codFormStepTwo.controls['city'].value === null ? 'Ciudad de residencia' : codFormStepTwo.controls['city'].value\"\n      (eventSelect)=\"selectCity($event)\"\n      [data]=\"cities\"\n      [defaultText]=\"'Ciudad de residencia'\"\n    ></ipt-select>\n    <ipt-input\n      onfocus=\"(this.type='date')\"\n      [inputType]=\"'date'\"\n      [control]=\"codFormStepTwo.controls['birthdate']\"\n      [placeHolder]=\"'Fecha de nacimiento'\"\n    ></ipt-input>\n     <ipt-select\n      [initialValue]=\"codFormStepTwo.controls['gender'].value\"\n      [control]=\"codFormStepTwo.controls['gender']\"\n      [data]=\"genders\"\n      (eventSelect)=\"selectGender($event)\"\n      [defaultText]=\"'G\u00E9nero'\"\n    ></ipt-select>\n    <ipt-select\n      [initialValue]=\"codFormStepTwo.controls['stratum'].value\"\n      [control]=\"codFormStepTwo.controls['stratum']\"\n      [data]=\"stratums\"\n      (eventSelect)=\"selectStratum($event)\"\n      [defaultText]=\"'Estrato'\"\n    ></ipt-select>\n    <ipt-input\n      [inputType]=\"'text'\"\n      [placeHolder]=\"'Grado'\"\n      [control]=\"codFormStepTwo.controls['grade']\"\n    ></ipt-input>\n    <ipt-select\n      [initialValue]=\"codFormStepTwo.controls['student_phone_indicative'].value\"\n      [control]=\"codFormStepTwo.controls['student_phone_indicative']\"\n      [data]=\"indicatives\"\n      (eventSelect)=\"selectIndicatives($event)\"\n      [defaultText]=\"'Indicativo'\"\n    ></ipt-select>\n    <ipt-input\n      [inputType]=\"'email'\"\n      [placeHolder]=\"'Correo electr\u00F3nico'\"\n      [control]=\"codFormStepTwo.controls['student_email']\"\n    ></ipt-input>\n    <ipt-input\n      [inputType]=\"'password'\"\n      [placeHolder]=\"'Repetir contrase\u00F1a'\"\n      [control]=\"codFormStepTwo.controls['re_password']\"\n    ></ipt-input>\n  </div>\n\n  <div class=\"col\">\n    <ipt-input\n      [inputType]=\"'text'\"\n      [placeHolder]=\"'Apellidos'\"\n      [control]=\"codFormStepTwo.controls['student_last_name']\"\n    ></ipt-input>\n    <ipt-input\n      [inputType]=\"'number'\"\n      [placeHolder]=\"'N\u00FAmero de documento'\"\n      [control]=\"codFormStepTwo.controls['student_id_card']\"\n    ></ipt-input>\n    <ipt-select\n      [initialValue]=\"codFormStepTwo.controls['state'].value\"\n      [control]=\"codFormStepTwo.controls['state']\"\n      [selectCode]=\"codFormStepTwo.controls['state'].value === null ? 'Departamento o estado' : codFormStepTwo.controls['state'].value\"\n      [isRequired]=\"true\"\n      (eventSelect)=\"selectState($event)\"\n      [data]=\"states\"\n      [defaultText]=\"'Departamento o estado'\"\n    ></ipt-select>\n    <ipt-input\n      [inputType]=\"'text'\"\n      [placeHolder]=\"'Direcci\u00F3n'\"\n      [control]=\"codFormStepTwo.controls['student_address']\"\n    ></ipt-input>\n    <ipt-input\n      [inputType]=\"'number'\"\n      [placeHolder]=\"'Edad'\"\n      [control]=\"codFormStepTwo.controls['age']\"\n    ></ipt-input>\n    <ipt-input\n      [inputType]=\"'text'\"\n      [placeHolder]=\"'Nickname'\"\n      [control]=\"codFormStepTwo.controls['nickname']\"\n    ></ipt-input>\n    <ipt-input\n      [inputType]=\"'text'\"\n      [placeHolder]=\"'Ocupaci\u00F3n'\"\n      [control]=\"codFormStepTwo.controls['student_occupation']\"\n    ></ipt-input>\n    <ipt-select\n      [initialValue]=\"codFormStepTwo.controls['civil_status'].value\"\n      [control]=\"codFormStepTwo.controls['civil_status']\"\n      [data]=\"civilStatus\"\n      (eventSelect)=\"selectCivilStatus($event)\"\n      [defaultText]=\"'Estado civil'\"\n    ></ipt-select>\n    <ipt-input\n      [inputType]=\"'number'\"\n      [placeHolder]=\"'N\u00FAmero de tel\u00E9fono'\"\n      [control]=\"codFormStepTwo.controls['student_phone_number']\"\n    ></ipt-input>\n    <ipt-input\n      [inputType]=\"'password'\"\n      [placeHolder]=\"'Contrase\u00F1a'\"\n      [control]=\"codFormStepTwo.controls['password']\"\n    ></ipt-input>\n  </div>\n\n  <div class=\"col-12\"></div>\n\n</form>\n\n<div class=\"flex mt-3 align-items-center gap-3\">\n  <span *ngIf=\"codFormStepTwo.invalid && codFormStepTwo.touched\" class=\"text-red-500 font-bold text-center mt-1 py-2 bg-red-100 w-full border-round-xl\">{{ errorMessage }}</span>\n  <button type=\"submit\" [class]=\"isEditCod ? 'ml-auto yellow-300 p-button-sm' : 'ml-auto p-button-sm'\" (click)=\"sendForm()\" pButton label=\"Siguiente\" icon=\"pi pi-arrow-right\"></button>\n</div>\n", styles: [".yellow-300{background-color:var(--yellow-500)!important;color:#fff}\n"], dependencies: [{ kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: InputComponent, selector: "ipt-input", inputs: ["inputType", "placeHolder", "validateText", "withPipe", "list", "iconUrl", "control", "prefix", "thousands", "decimal", "disabledSel"], outputs: ["dateSelected"] }, { kind: "component", type: SelectComponent, selector: "ipt-select", inputs: ["isRequired", "data", "defaultText", "selectCode", "disabledSel", "initialValue", "control"], outputs: ["eventSelect"] }, { kind: "directive", type: i1$1.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i1$1.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i1$1.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i7$1.ButtonDirective, selector: "[pButton]", inputs: ["iconPos", "loadingIcon", "label", "icon", "loading"] }] });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.0.7", ngImport: i0, type: CodFormStepTwoComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'app-cod-form-step-two', template: "<form autocomplete=\"off\" [formGroup]=\"codFormStepTwo\" class=\"grid\">\r\n\r\n  <div class=\"col\">\r\n    <ipt-input\r\n      [inputType]=\"'text'\"\r\n      [placeHolder]=\"'Nombres'\"\r\n      [control]=\"codFormStepTwo.controls['student_name']\"\r\n    ></ipt-input>\r\n    <ipt-select\r\n      [initialValue]=\"codFormStepTwo.controls['student_id_card_type'].value\"\r\n      [control]=\"codFormStepTwo.controls['student_id_card_type']\"\r\n      [selectCode]=\"codFormStepTwo.controls['student_id_card_type'].value === null ? 'Tipo de documento' : codFormStepTwo.controls['student_id_card_type'].value\"\r\n      [isRequired]=\"true\"\r\n      [data]=\"idTypes\"\r\n      (eventSelect)=\"selectIdType($event)\"\r\n      [defaultText]=\"'Tipo de documento'\"\r\n    ></ipt-select>\r\n    <ipt-select\r\n      [initialValue]=\"codFormStepTwo.controls['country'].value\"\r\n      [control]=\"codFormStepTwo.controls['country']\"\r\n      [selectCode]=\"codFormStepTwo.controls['country'].value === null ? 'Pa\u00EDs de residencia' : codFormStepTwo.controls['country'].value\"\r\n      (eventSelect)=\"selectCountry($event)\"\r\n      [data]=\"countries\"\r\n      [defaultText]=\"'Pa\u00EDs de residencia'\"\r\n    ></ipt-select>\r\n    <ipt-select\r\n      [initialValue]=\"codFormStepTwo.controls['city'].value\"\r\n      [control]=\"codFormStepTwo.controls['city']\"\r\n      [selectCode]=\"codFormStepTwo.controls['city'].value === null ? 'Ciudad de residencia' : codFormStepTwo.controls['city'].value\"\r\n      (eventSelect)=\"selectCity($event)\"\r\n      [data]=\"cities\"\r\n      [defaultText]=\"'Ciudad de residencia'\"\r\n    ></ipt-select>\r\n    <ipt-input\r\n      onfocus=\"(this.type='date')\"\r\n      [inputType]=\"'date'\"\r\n      [control]=\"codFormStepTwo.controls['birthdate']\"\r\n      [placeHolder]=\"'Fecha de nacimiento'\"\r\n    ></ipt-input>\r\n     <ipt-select\r\n      [initialValue]=\"codFormStepTwo.controls['gender'].value\"\r\n      [control]=\"codFormStepTwo.controls['gender']\"\r\n      [data]=\"genders\"\r\n      (eventSelect)=\"selectGender($event)\"\r\n      [defaultText]=\"'G\u00E9nero'\"\r\n    ></ipt-select>\r\n    <ipt-select\r\n      [initialValue]=\"codFormStepTwo.controls['stratum'].value\"\r\n      [control]=\"codFormStepTwo.controls['stratum']\"\r\n      [data]=\"stratums\"\r\n      (eventSelect)=\"selectStratum($event)\"\r\n      [defaultText]=\"'Estrato'\"\r\n    ></ipt-select>\r\n    <ipt-input\r\n      [inputType]=\"'text'\"\r\n      [placeHolder]=\"'Grado'\"\r\n      [control]=\"codFormStepTwo.controls['grade']\"\r\n    ></ipt-input>\r\n    <ipt-select\r\n      [initialValue]=\"codFormStepTwo.controls['student_phone_indicative'].value\"\r\n      [control]=\"codFormStepTwo.controls['student_phone_indicative']\"\r\n      [data]=\"indicatives\"\r\n      (eventSelect)=\"selectIndicatives($event)\"\r\n      [defaultText]=\"'Indicativo'\"\r\n    ></ipt-select>\r\n    <ipt-input\r\n      [inputType]=\"'email'\"\r\n      [placeHolder]=\"'Correo electr\u00F3nico'\"\r\n      [control]=\"codFormStepTwo.controls['student_email']\"\r\n    ></ipt-input>\r\n    <ipt-input\r\n      [inputType]=\"'password'\"\r\n      [placeHolder]=\"'Repetir contrase\u00F1a'\"\r\n      [control]=\"codFormStepTwo.controls['re_password']\"\r\n    ></ipt-input>\r\n  </div>\r\n\r\n  <div class=\"col\">\r\n    <ipt-input\r\n      [inputType]=\"'text'\"\r\n      [placeHolder]=\"'Apellidos'\"\r\n      [control]=\"codFormStepTwo.controls['student_last_name']\"\r\n    ></ipt-input>\r\n    <ipt-input\r\n      [inputType]=\"'number'\"\r\n      [placeHolder]=\"'N\u00FAmero de documento'\"\r\n      [control]=\"codFormStepTwo.controls['student_id_card']\"\r\n    ></ipt-input>\r\n    <ipt-select\r\n      [initialValue]=\"codFormStepTwo.controls['state'].value\"\r\n      [control]=\"codFormStepTwo.controls['state']\"\r\n      [selectCode]=\"codFormStepTwo.controls['state'].value === null ? 'Departamento o estado' : codFormStepTwo.controls['state'].value\"\r\n      [isRequired]=\"true\"\r\n      (eventSelect)=\"selectState($event)\"\r\n      [data]=\"states\"\r\n      [defaultText]=\"'Departamento o estado'\"\r\n    ></ipt-select>\r\n    <ipt-input\r\n      [inputType]=\"'text'\"\r\n      [placeHolder]=\"'Direcci\u00F3n'\"\r\n      [control]=\"codFormStepTwo.controls['student_address']\"\r\n    ></ipt-input>\r\n    <ipt-input\r\n      [inputType]=\"'number'\"\r\n      [placeHolder]=\"'Edad'\"\r\n      [control]=\"codFormStepTwo.controls['age']\"\r\n    ></ipt-input>\r\n    <ipt-input\r\n      [inputType]=\"'text'\"\r\n      [placeHolder]=\"'Nickname'\"\r\n      [control]=\"codFormStepTwo.controls['nickname']\"\r\n    ></ipt-input>\r\n    <ipt-input\r\n      [inputType]=\"'text'\"\r\n      [placeHolder]=\"'Ocupaci\u00F3n'\"\r\n      [control]=\"codFormStepTwo.controls['student_occupation']\"\r\n    ></ipt-input>\r\n    <ipt-select\r\n      [initialValue]=\"codFormStepTwo.controls['civil_status'].value\"\r\n      [control]=\"codFormStepTwo.controls['civil_status']\"\r\n      [data]=\"civilStatus\"\r\n      (eventSelect)=\"selectCivilStatus($event)\"\r\n      [defaultText]=\"'Estado civil'\"\r\n    ></ipt-select>\r\n    <ipt-input\r\n      [inputType]=\"'number'\"\r\n      [placeHolder]=\"'N\u00FAmero de tel\u00E9fono'\"\r\n      [control]=\"codFormStepTwo.controls['student_phone_number']\"\r\n    ></ipt-input>\r\n    <ipt-input\r\n      [inputType]=\"'password'\"\r\n      [placeHolder]=\"'Contrase\u00F1a'\"\r\n      [control]=\"codFormStepTwo.controls['password']\"\r\n    ></ipt-input>\r\n  </div>\r\n\r\n  <div class=\"col-12\"></div>\r\n\r\n</form>\r\n\r\n<div class=\"flex mt-3 align-items-center gap-3\">\r\n  <span *ngIf=\"codFormStepTwo.invalid && codFormStepTwo.touched\" class=\"text-red-500 font-bold text-center mt-1 py-2 bg-red-100 w-full border-round-xl\">{{ errorMessage }}</span>\r\n  <button type=\"submit\" [class]=\"isEditCod ? 'ml-auto yellow-300 p-button-sm' : 'ml-auto p-button-sm'\" (click)=\"sendForm()\" pButton label=\"Siguiente\" icon=\"pi pi-arrow-right\"></button>\r\n</div>\r\n", styles: [".yellow-300{background-color:var(--yellow-500)!important;color:#fff}\n"] }]
+            args: [{ selector: 'app-cod-form-step-two', template: "<form autocomplete=\"off\" [formGroup]=\"codFormStepTwo\" class=\"grid\">\n\n  <div class=\"col\">\n    <ipt-input\n      [inputType]=\"'text'\"\n      [placeHolder]=\"'Nombres'\"\n      [control]=\"codFormStepTwo.controls['student_name']\"\n    ></ipt-input>\n    <ipt-select\n      [initialValue]=\"codFormStepTwo.controls['student_id_card_type'].value\"\n      [control]=\"codFormStepTwo.controls['student_id_card_type']\"\n      [selectCode]=\"codFormStepTwo.controls['student_id_card_type'].value === null ? 'Tipo de documento' : codFormStepTwo.controls['student_id_card_type'].value\"\n      [isRequired]=\"true\"\n      [data]=\"idTypes\"\n      (eventSelect)=\"selectIdType($event)\"\n      [defaultText]=\"'Tipo de documento'\"\n    ></ipt-select>\n    <ipt-select\n      [initialValue]=\"codFormStepTwo.controls['country'].value\"\n      [control]=\"codFormStepTwo.controls['country']\"\n      [selectCode]=\"codFormStepTwo.controls['country'].value === null ? 'Pa\u00EDs de residencia' : codFormStepTwo.controls['country'].value\"\n      (eventSelect)=\"selectCountry($event)\"\n      [data]=\"countries\"\n      [defaultText]=\"'Pa\u00EDs de residencia'\"\n    ></ipt-select>\n    <ipt-select\n      [initialValue]=\"codFormStepTwo.controls['city'].value\"\n      [control]=\"codFormStepTwo.controls['city']\"\n      [selectCode]=\"codFormStepTwo.controls['city'].value === null ? 'Ciudad de residencia' : codFormStepTwo.controls['city'].value\"\n      (eventSelect)=\"selectCity($event)\"\n      [data]=\"cities\"\n      [defaultText]=\"'Ciudad de residencia'\"\n    ></ipt-select>\n    <ipt-input\n      onfocus=\"(this.type='date')\"\n      [inputType]=\"'date'\"\n      [control]=\"codFormStepTwo.controls['birthdate']\"\n      [placeHolder]=\"'Fecha de nacimiento'\"\n    ></ipt-input>\n     <ipt-select\n      [initialValue]=\"codFormStepTwo.controls['gender'].value\"\n      [control]=\"codFormStepTwo.controls['gender']\"\n      [data]=\"genders\"\n      (eventSelect)=\"selectGender($event)\"\n      [defaultText]=\"'G\u00E9nero'\"\n    ></ipt-select>\n    <ipt-select\n      [initialValue]=\"codFormStepTwo.controls['stratum'].value\"\n      [control]=\"codFormStepTwo.controls['stratum']\"\n      [data]=\"stratums\"\n      (eventSelect)=\"selectStratum($event)\"\n      [defaultText]=\"'Estrato'\"\n    ></ipt-select>\n    <ipt-input\n      [inputType]=\"'text'\"\n      [placeHolder]=\"'Grado'\"\n      [control]=\"codFormStepTwo.controls['grade']\"\n    ></ipt-input>\n    <ipt-select\n      [initialValue]=\"codFormStepTwo.controls['student_phone_indicative'].value\"\n      [control]=\"codFormStepTwo.controls['student_phone_indicative']\"\n      [data]=\"indicatives\"\n      (eventSelect)=\"selectIndicatives($event)\"\n      [defaultText]=\"'Indicativo'\"\n    ></ipt-select>\n    <ipt-input\n      [inputType]=\"'email'\"\n      [placeHolder]=\"'Correo electr\u00F3nico'\"\n      [control]=\"codFormStepTwo.controls['student_email']\"\n    ></ipt-input>\n    <ipt-input\n      [inputType]=\"'password'\"\n      [placeHolder]=\"'Repetir contrase\u00F1a'\"\n      [control]=\"codFormStepTwo.controls['re_password']\"\n    ></ipt-input>\n  </div>\n\n  <div class=\"col\">\n    <ipt-input\n      [inputType]=\"'text'\"\n      [placeHolder]=\"'Apellidos'\"\n      [control]=\"codFormStepTwo.controls['student_last_name']\"\n    ></ipt-input>\n    <ipt-input\n      [inputType]=\"'number'\"\n      [placeHolder]=\"'N\u00FAmero de documento'\"\n      [control]=\"codFormStepTwo.controls['student_id_card']\"\n    ></ipt-input>\n    <ipt-select\n      [initialValue]=\"codFormStepTwo.controls['state'].value\"\n      [control]=\"codFormStepTwo.controls['state']\"\n      [selectCode]=\"codFormStepTwo.controls['state'].value === null ? 'Departamento o estado' : codFormStepTwo.controls['state'].value\"\n      [isRequired]=\"true\"\n      (eventSelect)=\"selectState($event)\"\n      [data]=\"states\"\n      [defaultText]=\"'Departamento o estado'\"\n    ></ipt-select>\n    <ipt-input\n      [inputType]=\"'text'\"\n      [placeHolder]=\"'Direcci\u00F3n'\"\n      [control]=\"codFormStepTwo.controls['student_address']\"\n    ></ipt-input>\n    <ipt-input\n      [inputType]=\"'number'\"\n      [placeHolder]=\"'Edad'\"\n      [control]=\"codFormStepTwo.controls['age']\"\n    ></ipt-input>\n    <ipt-input\n      [inputType]=\"'text'\"\n      [placeHolder]=\"'Nickname'\"\n      [control]=\"codFormStepTwo.controls['nickname']\"\n    ></ipt-input>\n    <ipt-input\n      [inputType]=\"'text'\"\n      [placeHolder]=\"'Ocupaci\u00F3n'\"\n      [control]=\"codFormStepTwo.controls['student_occupation']\"\n    ></ipt-input>\n    <ipt-select\n      [initialValue]=\"codFormStepTwo.controls['civil_status'].value\"\n      [control]=\"codFormStepTwo.controls['civil_status']\"\n      [data]=\"civilStatus\"\n      (eventSelect)=\"selectCivilStatus($event)\"\n      [defaultText]=\"'Estado civil'\"\n    ></ipt-select>\n    <ipt-input\n      [inputType]=\"'number'\"\n      [placeHolder]=\"'N\u00FAmero de tel\u00E9fono'\"\n      [control]=\"codFormStepTwo.controls['student_phone_number']\"\n    ></ipt-input>\n    <ipt-input\n      [inputType]=\"'password'\"\n      [placeHolder]=\"'Contrase\u00F1a'\"\n      [control]=\"codFormStepTwo.controls['password']\"\n    ></ipt-input>\n  </div>\n\n  <div class=\"col-12\"></div>\n\n</form>\n\n<div class=\"flex mt-3 align-items-center gap-3\">\n  <span *ngIf=\"codFormStepTwo.invalid && codFormStepTwo.touched\" class=\"text-red-500 font-bold text-center mt-1 py-2 bg-red-100 w-full border-round-xl\">{{ errorMessage }}</span>\n  <button type=\"submit\" [class]=\"isEditCod ? 'ml-auto yellow-300 p-button-sm' : 'ml-auto p-button-sm'\" (click)=\"sendForm()\" pButton label=\"Siguiente\" icon=\"pi pi-arrow-right\"></button>\n</div>\n", styles: [".yellow-300{background-color:var(--yellow-500)!important;color:#fff}\n"] }]
         }], ctorParameters: function () { return [{ type: i1$1.FormBuilder }, { type: ParameterService }]; }, propDecorators: { initialData: [{
                 type: Input
             }], isEditCod: [{
@@ -4350,10 +4350,10 @@ class CodFormStepThreeComponent extends CodFormSteps {
     }
 }
 CodFormStepThreeComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.0.7", ngImport: i0, type: CodFormStepThreeComponent, deps: [{ token: i1$1.FormBuilder }, { token: ParameterService }, { token: CodFormControls }], target: i0.ɵɵFactoryTarget.Component });
-CodFormStepThreeComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.0.7", type: CodFormStepThreeComponent, selector: "app-cod-form-step-three", inputs: { initialData: "initialData", isEditCod: "isEditCod" }, outputs: { changeStepEvent: "changeStepEvent" }, usesInheritance: true, usesOnChanges: true, ngImport: i0, template: "<form autocomplete=\"off\" [formGroup]=\"codFormStepThree\"class=\"grid\">\r\n  <div class=\"col-12\">\r\n    <ipt-select\r\n      [initialValue]=\"codFormStepThree.controls['needAtendant'].value\"\r\n      [control]=\"codFormStepThree.controls['needAtendant']\"\r\n      (eventSelect)=\"selectNeedAtendant($event)\"\r\n      [data]=\"needAtendants\"\r\n      [defaultText]=\"'Requiere acudiente'\"\r\n    ></ipt-select>\r\n  </div>\r\n\r\n  <div *ngIf=\"needAtendant()\" class=\"grid col-12\">\r\n    <div class=\"col-12 md:col-6\">\r\n      <ipt-input\r\n        [inputType]=\"'text'\"\r\n        [placeHolder]=\"'Nombres'\"\r\n        [control]=\"codFormStepThree.controls['parent_name']\"\r\n      ></ipt-input>\r\n      <ipt-select\r\n        [initialValue]=\"codFormStepThree.controls['parent_id_card_type'].value\"\r\n        [data]=\"idTypes\"\r\n        (eventSelect)=\"selectIdTypeParents($event)\"\r\n        [defaultText]=\"'Tipo de documento'\"\r\n        [control]=\"codFormStepThree.controls['parent_id_card_type']\"\r\n      ></ipt-select>\r\n      <ipt-select\r\n        [initialValue]=\"codFormStepThree.controls['parent_phone_indicative'].value\"\r\n        [data]=\"indicatives\"\r\n        (eventSelect)=\"selectIndicativesParents($event)\"\r\n        [defaultText]=\"'Indicativo'\"\r\n        [control]=\"codFormStepThree.controls['parent_phone_indicative']\"\r\n      ></ipt-select>\r\n      <ipt-input\r\n        [inputType]=\"'text'\"\r\n        [placeHolder]=\"'Ocupaci\u00F3n'\"\r\n        [control]=\"codFormStepThree.controls['parent_occupation']\"\r\n      ></ipt-input>\r\n    </div>\r\n    <div class=\"col-12 md:col-6\">\r\n      <ipt-input\r\n        [inputType]=\"'text'\"\r\n        [placeHolder]=\"'Apellidos'\"\r\n        [control]=\"codFormStepThree.controls['parent_last_name']\"\r\n      ></ipt-input>\r\n      <ipt-input\r\n        [inputType]=\"'number'\"\r\n        [placeHolder]=\"'N\u00FAmero de documento'\"\r\n        [control]=\"codFormStepThree.controls['parent_id_card']\"\r\n      ></ipt-input>\r\n      <ipt-input\r\n        [inputType]=\"'number'\"\r\n        [placeHolder]=\"'N\u00FAmero de tel\u00E9fono'\"\r\n        [control]=\"codFormStepThree.controls['parent_phone_number']\"\r\n      ></ipt-input>\r\n      <ipt-input\r\n        [inputType]=\"'text'\"\r\n        [placeHolder]=\"'Direcci\u00F3n - Oficina'\"\r\n        [control]=\"codFormStepThree.controls['parent_address']\"\r\n      ></ipt-input>\r\n    </div>\r\n  </div>\r\n</form>\r\n\r\n<div class=\"flex mt-3 align-items-center gap-3\">\r\n  <span *ngIf=\"(codFormStepThree.invalid && codFormStepThree.touched) && needAtendant()\" class=\"text-red-500 font-bold text-center mt-1 py-2 bg-red-100 w-full border-round-xl\">{{ errorMessage }}</span>\r\n  <button type=\"submit\" [class]=\"isEditCod ? 'ml-auto yellow-300 p-button-sm' : 'ml-auto p-button-sm'\" (click)=\"sendForm()\" pButton label=\"Siguiente\" icon=\"pi pi-arrow-right\"></button>\r\n</div>\r\n", styles: [".yellow-300{background-color:var(--yellow-500)!important;color:#fff}\n"], dependencies: [{ kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: InputComponent, selector: "ipt-input", inputs: ["inputType", "placeHolder", "validateText", "withPipe", "list", "iconUrl", "control", "prefix", "thousands", "decimal", "disabledSel"], outputs: ["dateSelected"] }, { kind: "component", type: SelectComponent, selector: "ipt-select", inputs: ["isRequired", "data", "defaultText", "selectCode", "disabledSel", "initialValue", "control"], outputs: ["eventSelect"] }, { kind: "directive", type: i1$1.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i1$1.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i1$1.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i7$1.ButtonDirective, selector: "[pButton]", inputs: ["iconPos", "loadingIcon", "label", "icon", "loading"] }] });
+CodFormStepThreeComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.0.7", type: CodFormStepThreeComponent, selector: "app-cod-form-step-three", inputs: { initialData: "initialData", isEditCod: "isEditCod" }, outputs: { changeStepEvent: "changeStepEvent" }, usesInheritance: true, usesOnChanges: true, ngImport: i0, template: "<form autocomplete=\"off\" [formGroup]=\"codFormStepThree\"class=\"grid\">\n  <div class=\"col-12\">\n    <ipt-select\n      [initialValue]=\"codFormStepThree.controls['needAtendant'].value\"\n      [control]=\"codFormStepThree.controls['needAtendant']\"\n      (eventSelect)=\"selectNeedAtendant($event)\"\n      [data]=\"needAtendants\"\n      [defaultText]=\"'Requiere acudiente'\"\n    ></ipt-select>\n  </div>\n\n  <div *ngIf=\"needAtendant()\" class=\"grid col-12\">\n    <div class=\"col-12 md:col-6\">\n      <ipt-input\n        [inputType]=\"'text'\"\n        [placeHolder]=\"'Nombres'\"\n        [control]=\"codFormStepThree.controls['parent_name']\"\n      ></ipt-input>\n      <ipt-select\n        [initialValue]=\"codFormStepThree.controls['parent_id_card_type'].value\"\n        [data]=\"idTypes\"\n        (eventSelect)=\"selectIdTypeParents($event)\"\n        [defaultText]=\"'Tipo de documento'\"\n        [control]=\"codFormStepThree.controls['parent_id_card_type']\"\n      ></ipt-select>\n      <ipt-select\n        [initialValue]=\"codFormStepThree.controls['parent_phone_indicative'].value\"\n        [data]=\"indicatives\"\n        (eventSelect)=\"selectIndicativesParents($event)\"\n        [defaultText]=\"'Indicativo'\"\n        [control]=\"codFormStepThree.controls['parent_phone_indicative']\"\n      ></ipt-select>\n      <ipt-input\n        [inputType]=\"'text'\"\n        [placeHolder]=\"'Ocupaci\u00F3n'\"\n        [control]=\"codFormStepThree.controls['parent_occupation']\"\n      ></ipt-input>\n    </div>\n    <div class=\"col-12 md:col-6\">\n      <ipt-input\n        [inputType]=\"'text'\"\n        [placeHolder]=\"'Apellidos'\"\n        [control]=\"codFormStepThree.controls['parent_last_name']\"\n      ></ipt-input>\n      <ipt-input\n        [inputType]=\"'number'\"\n        [placeHolder]=\"'N\u00FAmero de documento'\"\n        [control]=\"codFormStepThree.controls['parent_id_card']\"\n      ></ipt-input>\n      <ipt-input\n        [inputType]=\"'number'\"\n        [placeHolder]=\"'N\u00FAmero de tel\u00E9fono'\"\n        [control]=\"codFormStepThree.controls['parent_phone_number']\"\n      ></ipt-input>\n      <ipt-input\n        [inputType]=\"'text'\"\n        [placeHolder]=\"'Direcci\u00F3n - Oficina'\"\n        [control]=\"codFormStepThree.controls['parent_address']\"\n      ></ipt-input>\n    </div>\n  </div>\n</form>\n\n<div class=\"flex mt-3 align-items-center gap-3\">\n  <span *ngIf=\"(codFormStepThree.invalid && codFormStepThree.touched) && needAtendant()\" class=\"text-red-500 font-bold text-center mt-1 py-2 bg-red-100 w-full border-round-xl\">{{ errorMessage }}</span>\n  <button type=\"submit\" [class]=\"isEditCod ? 'ml-auto yellow-300 p-button-sm' : 'ml-auto p-button-sm'\" (click)=\"sendForm()\" pButton label=\"Siguiente\" icon=\"pi pi-arrow-right\"></button>\n</div>\n", styles: [".yellow-300{background-color:var(--yellow-500)!important;color:#fff}\n"], dependencies: [{ kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: InputComponent, selector: "ipt-input", inputs: ["inputType", "placeHolder", "validateText", "withPipe", "list", "iconUrl", "control", "prefix", "thousands", "decimal", "disabledSel"], outputs: ["dateSelected"] }, { kind: "component", type: SelectComponent, selector: "ipt-select", inputs: ["isRequired", "data", "defaultText", "selectCode", "disabledSel", "initialValue", "control"], outputs: ["eventSelect"] }, { kind: "directive", type: i1$1.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i1$1.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i1$1.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i7$1.ButtonDirective, selector: "[pButton]", inputs: ["iconPos", "loadingIcon", "label", "icon", "loading"] }] });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.0.7", ngImport: i0, type: CodFormStepThreeComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'app-cod-form-step-three', template: "<form autocomplete=\"off\" [formGroup]=\"codFormStepThree\"class=\"grid\">\r\n  <div class=\"col-12\">\r\n    <ipt-select\r\n      [initialValue]=\"codFormStepThree.controls['needAtendant'].value\"\r\n      [control]=\"codFormStepThree.controls['needAtendant']\"\r\n      (eventSelect)=\"selectNeedAtendant($event)\"\r\n      [data]=\"needAtendants\"\r\n      [defaultText]=\"'Requiere acudiente'\"\r\n    ></ipt-select>\r\n  </div>\r\n\r\n  <div *ngIf=\"needAtendant()\" class=\"grid col-12\">\r\n    <div class=\"col-12 md:col-6\">\r\n      <ipt-input\r\n        [inputType]=\"'text'\"\r\n        [placeHolder]=\"'Nombres'\"\r\n        [control]=\"codFormStepThree.controls['parent_name']\"\r\n      ></ipt-input>\r\n      <ipt-select\r\n        [initialValue]=\"codFormStepThree.controls['parent_id_card_type'].value\"\r\n        [data]=\"idTypes\"\r\n        (eventSelect)=\"selectIdTypeParents($event)\"\r\n        [defaultText]=\"'Tipo de documento'\"\r\n        [control]=\"codFormStepThree.controls['parent_id_card_type']\"\r\n      ></ipt-select>\r\n      <ipt-select\r\n        [initialValue]=\"codFormStepThree.controls['parent_phone_indicative'].value\"\r\n        [data]=\"indicatives\"\r\n        (eventSelect)=\"selectIndicativesParents($event)\"\r\n        [defaultText]=\"'Indicativo'\"\r\n        [control]=\"codFormStepThree.controls['parent_phone_indicative']\"\r\n      ></ipt-select>\r\n      <ipt-input\r\n        [inputType]=\"'text'\"\r\n        [placeHolder]=\"'Ocupaci\u00F3n'\"\r\n        [control]=\"codFormStepThree.controls['parent_occupation']\"\r\n      ></ipt-input>\r\n    </div>\r\n    <div class=\"col-12 md:col-6\">\r\n      <ipt-input\r\n        [inputType]=\"'text'\"\r\n        [placeHolder]=\"'Apellidos'\"\r\n        [control]=\"codFormStepThree.controls['parent_last_name']\"\r\n      ></ipt-input>\r\n      <ipt-input\r\n        [inputType]=\"'number'\"\r\n        [placeHolder]=\"'N\u00FAmero de documento'\"\r\n        [control]=\"codFormStepThree.controls['parent_id_card']\"\r\n      ></ipt-input>\r\n      <ipt-input\r\n        [inputType]=\"'number'\"\r\n        [placeHolder]=\"'N\u00FAmero de tel\u00E9fono'\"\r\n        [control]=\"codFormStepThree.controls['parent_phone_number']\"\r\n      ></ipt-input>\r\n      <ipt-input\r\n        [inputType]=\"'text'\"\r\n        [placeHolder]=\"'Direcci\u00F3n - Oficina'\"\r\n        [control]=\"codFormStepThree.controls['parent_address']\"\r\n      ></ipt-input>\r\n    </div>\r\n  </div>\r\n</form>\r\n\r\n<div class=\"flex mt-3 align-items-center gap-3\">\r\n  <span *ngIf=\"(codFormStepThree.invalid && codFormStepThree.touched) && needAtendant()\" class=\"text-red-500 font-bold text-center mt-1 py-2 bg-red-100 w-full border-round-xl\">{{ errorMessage }}</span>\r\n  <button type=\"submit\" [class]=\"isEditCod ? 'ml-auto yellow-300 p-button-sm' : 'ml-auto p-button-sm'\" (click)=\"sendForm()\" pButton label=\"Siguiente\" icon=\"pi pi-arrow-right\"></button>\r\n</div>\r\n", styles: [".yellow-300{background-color:var(--yellow-500)!important;color:#fff}\n"] }]
+            args: [{ selector: 'app-cod-form-step-three', template: "<form autocomplete=\"off\" [formGroup]=\"codFormStepThree\"class=\"grid\">\n  <div class=\"col-12\">\n    <ipt-select\n      [initialValue]=\"codFormStepThree.controls['needAtendant'].value\"\n      [control]=\"codFormStepThree.controls['needAtendant']\"\n      (eventSelect)=\"selectNeedAtendant($event)\"\n      [data]=\"needAtendants\"\n      [defaultText]=\"'Requiere acudiente'\"\n    ></ipt-select>\n  </div>\n\n  <div *ngIf=\"needAtendant()\" class=\"grid col-12\">\n    <div class=\"col-12 md:col-6\">\n      <ipt-input\n        [inputType]=\"'text'\"\n        [placeHolder]=\"'Nombres'\"\n        [control]=\"codFormStepThree.controls['parent_name']\"\n      ></ipt-input>\n      <ipt-select\n        [initialValue]=\"codFormStepThree.controls['parent_id_card_type'].value\"\n        [data]=\"idTypes\"\n        (eventSelect)=\"selectIdTypeParents($event)\"\n        [defaultText]=\"'Tipo de documento'\"\n        [control]=\"codFormStepThree.controls['parent_id_card_type']\"\n      ></ipt-select>\n      <ipt-select\n        [initialValue]=\"codFormStepThree.controls['parent_phone_indicative'].value\"\n        [data]=\"indicatives\"\n        (eventSelect)=\"selectIndicativesParents($event)\"\n        [defaultText]=\"'Indicativo'\"\n        [control]=\"codFormStepThree.controls['parent_phone_indicative']\"\n      ></ipt-select>\n      <ipt-input\n        [inputType]=\"'text'\"\n        [placeHolder]=\"'Ocupaci\u00F3n'\"\n        [control]=\"codFormStepThree.controls['parent_occupation']\"\n      ></ipt-input>\n    </div>\n    <div class=\"col-12 md:col-6\">\n      <ipt-input\n        [inputType]=\"'text'\"\n        [placeHolder]=\"'Apellidos'\"\n        [control]=\"codFormStepThree.controls['parent_last_name']\"\n      ></ipt-input>\n      <ipt-input\n        [inputType]=\"'number'\"\n        [placeHolder]=\"'N\u00FAmero de documento'\"\n        [control]=\"codFormStepThree.controls['parent_id_card']\"\n      ></ipt-input>\n      <ipt-input\n        [inputType]=\"'number'\"\n        [placeHolder]=\"'N\u00FAmero de tel\u00E9fono'\"\n        [control]=\"codFormStepThree.controls['parent_phone_number']\"\n      ></ipt-input>\n      <ipt-input\n        [inputType]=\"'text'\"\n        [placeHolder]=\"'Direcci\u00F3n - Oficina'\"\n        [control]=\"codFormStepThree.controls['parent_address']\"\n      ></ipt-input>\n    </div>\n  </div>\n</form>\n\n<div class=\"flex mt-3 align-items-center gap-3\">\n  <span *ngIf=\"(codFormStepThree.invalid && codFormStepThree.touched) && needAtendant()\" class=\"text-red-500 font-bold text-center mt-1 py-2 bg-red-100 w-full border-round-xl\">{{ errorMessage }}</span>\n  <button type=\"submit\" [class]=\"isEditCod ? 'ml-auto yellow-300 p-button-sm' : 'ml-auto p-button-sm'\" (click)=\"sendForm()\" pButton label=\"Siguiente\" icon=\"pi pi-arrow-right\"></button>\n</div>\n", styles: [".yellow-300{background-color:var(--yellow-500)!important;color:#fff}\n"] }]
         }], ctorParameters: function () { return [{ type: i1$1.FormBuilder }, { type: ParameterService }, { type: CodFormControls }]; }, propDecorators: { initialData: [{
                 type: Input
             }], isEditCod: [{
@@ -4828,10 +4828,10 @@ class CodFormStepFourComponent extends CodFormSteps {
     }
 }
 CodFormStepFourComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.0.7", ngImport: i0, type: CodFormStepFourComponent, deps: [{ token: i1$1.FormBuilder }, { token: CalculateQuotesService }, { token: CommunicatorService }, { token: ParameterService }, { token: CodFormControls }, { token: CommercialService }, { token: BaseService }], target: i0.ɵɵFactoryTarget.Component });
-CodFormStepFourComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.0.7", type: CodFormStepFourComponent, selector: "app-cod-form-step-four", inputs: { isEditCod: "isEditCod", initialData: "initialData" }, outputs: { changeStepEvent: "changeStepEvent", financingData: "financingData" }, usesInheritance: true, usesOnChanges: true, ngImport: i0, template: "<div *ngIf=\"isSemestral\" class=\"m-1 p-2 border-round-lg bg-blue-500 text-white\">\r\n  <strong>Nota: </strong>\r\n  El tipo de curso seleccionado fue semestral, por lo tanto el estudiante debe pagar matr\u00EDcula y primera cuota (M&M)\r\n</div>\r\n\r\n<form autocomplete=\"off\" [formGroup]=\"codFormStepFour\" class=\"grid mt-2\">\r\n\r\n  <div class=\"col-12\">\r\n    <ipt-select\r\n      [initialValue]=\"codFormStepFour.controls['payment_method'].value\"\r\n      [control]=\"codFormStepFour.controls['payment_method']\"\r\n      (eventSelect)=\"selectPaymentMethod($event)\"\r\n      [data]=\"paymentMethods\"\r\n      [defaultText]=\"'M\u00E9todo de pago'\"\r\n      [disabledSel]=\"isDisabledSel\"\r\n    ></ipt-select>\r\n    <ipt-loader *ngIf=\"feeResponse\"></ipt-loader>\r\n\r\n    <div class=\"col-12\" *ngIf=\"thereArePlans\">\r\n      <p-table\r\n        [value]=\"dataPrices\"\r\n        [tableStyle]=\"{'min-width': '100%'}\"\r\n        [rowHover]=\"true\"\r\n      >\r\n        <ng-template pTemplate=\"caption\">\r\n          <div class=\"flex align-items-center\">\r\n             Seleccion de niveles a cancelar.\r\n          </div>\r\n        </ng-template>\r\n        <ng-template pTemplate=\"header\">\r\n          <tr>\r\n            <th class=\"bg-blue-200 text-center font-medium pt-2 pb-2\">Cancelar</th>\r\n            <th class=\"bg-blue-200 text-center font-medium pt-2 pb-2\">Cuotas</th>\r\n            <th class=\"bg-blue-200 text-center font-medium pt-2 pb-2\">Admin</th>\r\n          </tr>\r\n        </ng-template>\r\n        <ng-template pTemplate=\"body\" let-data>\r\n          <tr>\r\n            <td>{{ data.paid_level }} Nivel(es)</td>\r\n            <td>{{ data.fee_number }}</td>\r\n            <td class=\"pt-2 pb-2\">\r\n              <button\r\n                pButton\r\n                pRipple\r\n                icon=\"pi pi-money-bill\"\r\n                class=\"p-button-sm p-button-rounded\"\r\n                (click)=\"selectLevels(data)\"\r\n\r\n              ></button>\r\n            </td>\r\n          </tr>\r\n        </ng-template>\r\n      </p-table>\r\n    </div>\r\n\r\n    <!-- [initialValue]=\"codFormStepFour.controls['quota_times'].value\" -->\r\n    <!-- <ipt-select *ngIf=\"isFinanced();\"\r\n      [initialValue]=\"'1'\"\r\n      [control]=\"codFormStepFour.controls['quota_times']\"\r\n      (eventSelect)=\"selectQuotas($event)\"\r\n      [defaultText]=\"'N\u00FAmero de cuotas'\"\r\n      [data]=\"codPrices\"\r\n      ></ipt-select> -->\r\n    </div>\r\n\r\n  <div class=\"col-12\">\r\n    <ipt-input\r\n      [inputType]=\"'text'\"\r\n      [placeHolder]=\"'Monto total de la matr\u00EDcula'\"\r\n      [control]=\"codFormStepFour.controls['total_price']\"\r\n      [withPipe]=\"true\"\r\n    ></ipt-input>\r\n  </div>\r\n\r\n  <div class=\"col-12\">\r\n    <ipt-input\r\n      [withPipe]=\"true\"\r\n      [inputType]=\"'text'\"\r\n      [control]=\"codFormStepFour.controls['program_price']\"\r\n      [placeHolder]=\"'Valor total del programa'\"\r\n    ></ipt-input>\r\n  </div>\r\n\r\n  <div class=\"col-12\">\r\n    <ipt-input\r\n      onfocus=\"(this.type='date')\"\r\n      [inputType]=\"'date'\"\r\n      [control]=\"codFormStepFour.controls['payment_date']\"\r\n      [placeHolder]=\"'Fecha de pago'\"\r\n    ></ipt-input>\r\n  </div>\r\n\r\n  <!-- Tabla de financiaci\u00F3n -->\r\n  <div class=\"col-12\" *ngIf=\"isFinancing\">\r\n    <p-table\r\n      [value]=\"dataFinancing\"\r\n      [tableStyle]=\"{'min-width': '100%'}\"\r\n      [rowHover]=\"true\"\r\n    >\r\n      <ng-template pTemplate=\"caption\">\r\n        <div class=\"flex align-items-center\">\r\n          C\u00E1lculo de cuotas\r\n          <button pButton class=\"p-button-sm ml-auto\" label=\"Nuevo c\u00E1lculo\" (click)=\"calculateNewQuotes()\" [disabled]=\"isDisabledSel\" lab icon=\"pi pi-replay\"></button>\r\n        </div>\r\n      </ng-template>\r\n      <ng-template pTemplate=\"header\">\r\n        <tr>\r\n          <th>#</th>\r\n          <th>Valor</th>\r\n          <th>Fecha</th>\r\n        </tr>\r\n      </ng-template>\r\n      <ng-template pTemplate=\"body\" let-data>\r\n        <tr>\r\n          <td>{{ data[0] }}</td>\r\n          <td>{{ data[1] }}</td>\r\n          <td>{{ data[2] }}</td>\r\n        </tr>\r\n      </ng-template>\r\n    </p-table>\r\n  </div>\r\n  <!-- ---------------------- -->\r\n\r\n</form>\r\n\r\n<div class=\"flex mt-3 align-items-center gap-3\">\r\n  <span *ngIf=\"codFormStepFour.invalid && codFormStepFour.touched\" class=\"text-red-500 font-bold text-center mt-1 py-2 bg-red-100 w-full border-round-xl\">{{ errorMessage }}</span>\r\n  <div class=\"flex ml-auto gap-2\">\r\n    <button *ngIf=\"codFormStepFour.controls['payment_method'].value === '1'\" [disabled]=\"isFinancing || codFormStepFour.controls['payment_method'].value !== '1'\"type=\"submit\" class=\"ml-auto p-button-sm p-button-secondary\" (click)=\"showTable()\" pButton label=\"Calcular cuotas\" icon=\"pi pi-sliders-h\"></button>\r\n    <button [disabled]=\"!isFinancing && codFormStepFour.controls['payment_method'].value === '1'\" type=\"submit\" [class]=\"isEditCod ? 'ml-auto yellow-300 p-button-sm' : 'ml-auto p-button-sm'\" (click)=\"sendForm()\" pButton label=\"Siguiente\" icon=\"pi pi-arrow-right\"></button>\r\n  </div>\r\n</div>\r\n", styles: [".yellow-300{background-color:var(--yellow-500)!important;color:#fff}\n"], dependencies: [{ kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i2$1.PrimeTemplate, selector: "[pTemplate]", inputs: ["type", "pTemplate"] }, { kind: "component", type: InputComponent, selector: "ipt-input", inputs: ["inputType", "placeHolder", "validateText", "withPipe", "list", "iconUrl", "control", "prefix", "thousands", "decimal", "disabledSel"], outputs: ["dateSelected"] }, { kind: "component", type: LoaderComponent, selector: "ipt-loader", inputs: ["message", "isDialog"] }, { kind: "component", type: SelectComponent, selector: "ipt-select", inputs: ["isRequired", "data", "defaultText", "selectCode", "disabledSel", "initialValue", "control"], outputs: ["eventSelect"] }, { kind: "directive", type: i1$1.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i1$1.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i1$1.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "component", type: i13.Table, selector: "p-table", inputs: ["frozenColumns", "frozenValue", "style", "styleClass", "tableStyle", "tableStyleClass", "paginator", "pageLinks", "rowsPerPageOptions", "alwaysShowPaginator", "paginatorPosition", "paginatorDropdownAppendTo", "paginatorDropdownScrollHeight", "currentPageReportTemplate", "showCurrentPageReport", "showJumpToPageDropdown", "showJumpToPageInput", "showFirstLastIcon", "showPageLinks", "defaultSortOrder", "sortMode", "resetPageOnSort", "selectionMode", "selectionPageOnly", "contextMenuSelection", "contextMenuSelectionMode", "dataKey", "metaKeySelection", "rowSelectable", "rowTrackBy", "lazy", "lazyLoadOnInit", "compareSelectionBy", "csvSeparator", "exportFilename", "filters", "globalFilterFields", "filterDelay", "filterLocale", "expandedRowKeys", "editingRowKeys", "rowExpandMode", "scrollable", "scrollDirection", "rowGroupMode", "scrollHeight", "virtualScroll", "virtualScrollItemSize", "virtualScrollOptions", "virtualScrollDelay", "frozenWidth", "responsive", "contextMenu", "resizableColumns", "columnResizeMode", "reorderableColumns", "loading", "loadingIcon", "showLoader", "rowHover", "customSort", "showInitialSortBadge", "autoLayout", "exportFunction", "exportHeader", "stateKey", "stateStorage", "editMode", "groupRowsBy", "groupRowsByOrder", "responsiveLayout", "breakpoint", "virtualRowHeight", "value", "columns", "first", "rows", "totalRecords", "sortField", "sortOrder", "multiSortMeta", "selection", "selectAll"], outputs: ["selectAllChange", "selectionChange", "contextMenuSelectionChange", "onRowSelect", "onRowUnselect", "onPage", "onSort", "onFilter", "onLazyLoad", "onRowExpand", "onRowCollapse", "onContextMenuSelect", "onColResize", "onColReorder", "onRowReorder", "onEditInit", "onEditComplete", "onEditCancel", "onHeaderCheckboxToggle", "sortFunction", "firstChange", "rowsChange", "onStateSave", "onStateRestore"] }, { kind: "directive", type: i7$1.ButtonDirective, selector: "[pButton]", inputs: ["iconPos", "loadingIcon", "label", "icon", "loading"] }] });
+CodFormStepFourComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.0.7", type: CodFormStepFourComponent, selector: "app-cod-form-step-four", inputs: { isEditCod: "isEditCod", initialData: "initialData" }, outputs: { changeStepEvent: "changeStepEvent", financingData: "financingData" }, usesInheritance: true, usesOnChanges: true, ngImport: i0, template: "<div *ngIf=\"isSemestral\" class=\"m-1 p-2 border-round-lg bg-blue-500 text-white\">\n  <strong>Nota: </strong>\n  El tipo de curso seleccionado fue semestral, por lo tanto el estudiante debe pagar matr\u00EDcula y primera cuota (M&M)\n</div>\n\n<form autocomplete=\"off\" [formGroup]=\"codFormStepFour\" class=\"grid mt-2\">\n\n  <div class=\"col-12\">\n    <ipt-select\n      [initialValue]=\"codFormStepFour.controls['payment_method'].value\"\n      [control]=\"codFormStepFour.controls['payment_method']\"\n      (eventSelect)=\"selectPaymentMethod($event)\"\n      [data]=\"paymentMethods\"\n      [defaultText]=\"'M\u00E9todo de pago'\"\n      [disabledSel]=\"isDisabledSel\"\n    ></ipt-select>\n    <ipt-loader *ngIf=\"feeResponse\"></ipt-loader>\n\n    <div class=\"col-12\" *ngIf=\"thereArePlans\">\n      <p-table\n        [value]=\"dataPrices\"\n        [tableStyle]=\"{'min-width': '100%'}\"\n        [rowHover]=\"true\"\n      >\n        <ng-template pTemplate=\"caption\">\n          <div class=\"flex align-items-center\">\n             Seleccion de niveles a cancelar.\n          </div>\n        </ng-template>\n        <ng-template pTemplate=\"header\">\n          <tr>\n            <th class=\"bg-blue-200 text-center font-medium pt-2 pb-2\">Cancelar</th>\n            <th class=\"bg-blue-200 text-center font-medium pt-2 pb-2\">Cuotas</th>\n            <th class=\"bg-blue-200 text-center font-medium pt-2 pb-2\">Admin</th>\n          </tr>\n        </ng-template>\n        <ng-template pTemplate=\"body\" let-data>\n          <tr>\n            <td>{{ data.paid_level }} Nivel(es)</td>\n            <td>{{ data.fee_number }}</td>\n            <td class=\"pt-2 pb-2\">\n              <button\n                pButton\n                pRipple\n                icon=\"pi pi-money-bill\"\n                class=\"p-button-sm p-button-rounded\"\n                (click)=\"selectLevels(data)\"\n\n              ></button>\n            </td>\n          </tr>\n        </ng-template>\n      </p-table>\n    </div>\n\n    <!-- [initialValue]=\"codFormStepFour.controls['quota_times'].value\" -->\n    <!-- <ipt-select *ngIf=\"isFinanced();\"\n      [initialValue]=\"'1'\"\n      [control]=\"codFormStepFour.controls['quota_times']\"\n      (eventSelect)=\"selectQuotas($event)\"\n      [defaultText]=\"'N\u00FAmero de cuotas'\"\n      [data]=\"codPrices\"\n      ></ipt-select> -->\n    </div>\n\n  <div class=\"col-12\">\n    <ipt-input\n      [inputType]=\"'text'\"\n      [placeHolder]=\"'Monto total de la matr\u00EDcula'\"\n      [control]=\"codFormStepFour.controls['total_price']\"\n      [withPipe]=\"true\"\n    ></ipt-input>\n  </div>\n\n  <div class=\"col-12\">\n    <ipt-input\n      [withPipe]=\"true\"\n      [inputType]=\"'text'\"\n      [control]=\"codFormStepFour.controls['program_price']\"\n      [placeHolder]=\"'Valor total del programa'\"\n    ></ipt-input>\n  </div>\n\n  <div class=\"col-12\">\n    <ipt-input\n      onfocus=\"(this.type='date')\"\n      [inputType]=\"'date'\"\n      [control]=\"codFormStepFour.controls['payment_date']\"\n      [placeHolder]=\"'Fecha de pago'\"\n    ></ipt-input>\n  </div>\n\n  <!-- Tabla de financiaci\u00F3n -->\n  <div class=\"col-12\" *ngIf=\"isFinancing\">\n    <p-table\n      [value]=\"dataFinancing\"\n      [tableStyle]=\"{'min-width': '100%'}\"\n      [rowHover]=\"true\"\n    >\n      <ng-template pTemplate=\"caption\">\n        <div class=\"flex align-items-center\">\n          C\u00E1lculo de cuotas\n          <button pButton class=\"p-button-sm ml-auto\" label=\"Nuevo c\u00E1lculo\" (click)=\"calculateNewQuotes()\" [disabled]=\"isDisabledSel\" lab icon=\"pi pi-replay\"></button>\n        </div>\n      </ng-template>\n      <ng-template pTemplate=\"header\">\n        <tr>\n          <th>#</th>\n          <th>Valor</th>\n          <th>Fecha</th>\n        </tr>\n      </ng-template>\n      <ng-template pTemplate=\"body\" let-data>\n        <tr>\n          <td>{{ data[0] }}</td>\n          <td>{{ data[1] }}</td>\n          <td>{{ data[2] }}</td>\n        </tr>\n      </ng-template>\n    </p-table>\n  </div>\n  <!-- ---------------------- -->\n\n</form>\n\n<div class=\"flex mt-3 align-items-center gap-3\">\n  <span *ngIf=\"codFormStepFour.invalid && codFormStepFour.touched\" class=\"text-red-500 font-bold text-center mt-1 py-2 bg-red-100 w-full border-round-xl\">{{ errorMessage }}</span>\n  <div class=\"flex ml-auto gap-2\">\n    <button *ngIf=\"codFormStepFour.controls['payment_method'].value === '1'\" [disabled]=\"isFinancing || codFormStepFour.controls['payment_method'].value !== '1'\"type=\"submit\" class=\"ml-auto p-button-sm p-button-secondary\" (click)=\"showTable()\" pButton label=\"Calcular cuotas\" icon=\"pi pi-sliders-h\"></button>\n    <button [disabled]=\"!isFinancing && codFormStepFour.controls['payment_method'].value === '1'\" type=\"submit\" [class]=\"isEditCod ? 'ml-auto yellow-300 p-button-sm' : 'ml-auto p-button-sm'\" (click)=\"sendForm()\" pButton label=\"Siguiente\" icon=\"pi pi-arrow-right\"></button>\n  </div>\n</div>\n", styles: [".yellow-300{background-color:var(--yellow-500)!important;color:#fff}\n"], dependencies: [{ kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i2$1.PrimeTemplate, selector: "[pTemplate]", inputs: ["type", "pTemplate"] }, { kind: "component", type: InputComponent, selector: "ipt-input", inputs: ["inputType", "placeHolder", "validateText", "withPipe", "list", "iconUrl", "control", "prefix", "thousands", "decimal", "disabledSel"], outputs: ["dateSelected"] }, { kind: "component", type: LoaderComponent, selector: "ipt-loader", inputs: ["message", "isDialog"] }, { kind: "component", type: SelectComponent, selector: "ipt-select", inputs: ["isRequired", "data", "defaultText", "selectCode", "disabledSel", "initialValue", "control"], outputs: ["eventSelect"] }, { kind: "directive", type: i1$1.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i1$1.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i1$1.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "component", type: i13.Table, selector: "p-table", inputs: ["frozenColumns", "frozenValue", "style", "styleClass", "tableStyle", "tableStyleClass", "paginator", "pageLinks", "rowsPerPageOptions", "alwaysShowPaginator", "paginatorPosition", "paginatorDropdownAppendTo", "paginatorDropdownScrollHeight", "currentPageReportTemplate", "showCurrentPageReport", "showJumpToPageDropdown", "showJumpToPageInput", "showFirstLastIcon", "showPageLinks", "defaultSortOrder", "sortMode", "resetPageOnSort", "selectionMode", "selectionPageOnly", "contextMenuSelection", "contextMenuSelectionMode", "dataKey", "metaKeySelection", "rowSelectable", "rowTrackBy", "lazy", "lazyLoadOnInit", "compareSelectionBy", "csvSeparator", "exportFilename", "filters", "globalFilterFields", "filterDelay", "filterLocale", "expandedRowKeys", "editingRowKeys", "rowExpandMode", "scrollable", "scrollDirection", "rowGroupMode", "scrollHeight", "virtualScroll", "virtualScrollItemSize", "virtualScrollOptions", "virtualScrollDelay", "frozenWidth", "responsive", "contextMenu", "resizableColumns", "columnResizeMode", "reorderableColumns", "loading", "loadingIcon", "showLoader", "rowHover", "customSort", "showInitialSortBadge", "autoLayout", "exportFunction", "exportHeader", "stateKey", "stateStorage", "editMode", "groupRowsBy", "groupRowsByOrder", "responsiveLayout", "breakpoint", "virtualRowHeight", "value", "columns", "first", "rows", "totalRecords", "sortField", "sortOrder", "multiSortMeta", "selection", "selectAll"], outputs: ["selectAllChange", "selectionChange", "contextMenuSelectionChange", "onRowSelect", "onRowUnselect", "onPage", "onSort", "onFilter", "onLazyLoad", "onRowExpand", "onRowCollapse", "onContextMenuSelect", "onColResize", "onColReorder", "onRowReorder", "onEditInit", "onEditComplete", "onEditCancel", "onHeaderCheckboxToggle", "sortFunction", "firstChange", "rowsChange", "onStateSave", "onStateRestore"] }, { kind: "directive", type: i7$1.ButtonDirective, selector: "[pButton]", inputs: ["iconPos", "loadingIcon", "label", "icon", "loading"] }] });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.0.7", ngImport: i0, type: CodFormStepFourComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'app-cod-form-step-four', template: "<div *ngIf=\"isSemestral\" class=\"m-1 p-2 border-round-lg bg-blue-500 text-white\">\r\n  <strong>Nota: </strong>\r\n  El tipo de curso seleccionado fue semestral, por lo tanto el estudiante debe pagar matr\u00EDcula y primera cuota (M&M)\r\n</div>\r\n\r\n<form autocomplete=\"off\" [formGroup]=\"codFormStepFour\" class=\"grid mt-2\">\r\n\r\n  <div class=\"col-12\">\r\n    <ipt-select\r\n      [initialValue]=\"codFormStepFour.controls['payment_method'].value\"\r\n      [control]=\"codFormStepFour.controls['payment_method']\"\r\n      (eventSelect)=\"selectPaymentMethod($event)\"\r\n      [data]=\"paymentMethods\"\r\n      [defaultText]=\"'M\u00E9todo de pago'\"\r\n      [disabledSel]=\"isDisabledSel\"\r\n    ></ipt-select>\r\n    <ipt-loader *ngIf=\"feeResponse\"></ipt-loader>\r\n\r\n    <div class=\"col-12\" *ngIf=\"thereArePlans\">\r\n      <p-table\r\n        [value]=\"dataPrices\"\r\n        [tableStyle]=\"{'min-width': '100%'}\"\r\n        [rowHover]=\"true\"\r\n      >\r\n        <ng-template pTemplate=\"caption\">\r\n          <div class=\"flex align-items-center\">\r\n             Seleccion de niveles a cancelar.\r\n          </div>\r\n        </ng-template>\r\n        <ng-template pTemplate=\"header\">\r\n          <tr>\r\n            <th class=\"bg-blue-200 text-center font-medium pt-2 pb-2\">Cancelar</th>\r\n            <th class=\"bg-blue-200 text-center font-medium pt-2 pb-2\">Cuotas</th>\r\n            <th class=\"bg-blue-200 text-center font-medium pt-2 pb-2\">Admin</th>\r\n          </tr>\r\n        </ng-template>\r\n        <ng-template pTemplate=\"body\" let-data>\r\n          <tr>\r\n            <td>{{ data.paid_level }} Nivel(es)</td>\r\n            <td>{{ data.fee_number }}</td>\r\n            <td class=\"pt-2 pb-2\">\r\n              <button\r\n                pButton\r\n                pRipple\r\n                icon=\"pi pi-money-bill\"\r\n                class=\"p-button-sm p-button-rounded\"\r\n                (click)=\"selectLevels(data)\"\r\n\r\n              ></button>\r\n            </td>\r\n          </tr>\r\n        </ng-template>\r\n      </p-table>\r\n    </div>\r\n\r\n    <!-- [initialValue]=\"codFormStepFour.controls['quota_times'].value\" -->\r\n    <!-- <ipt-select *ngIf=\"isFinanced();\"\r\n      [initialValue]=\"'1'\"\r\n      [control]=\"codFormStepFour.controls['quota_times']\"\r\n      (eventSelect)=\"selectQuotas($event)\"\r\n      [defaultText]=\"'N\u00FAmero de cuotas'\"\r\n      [data]=\"codPrices\"\r\n      ></ipt-select> -->\r\n    </div>\r\n\r\n  <div class=\"col-12\">\r\n    <ipt-input\r\n      [inputType]=\"'text'\"\r\n      [placeHolder]=\"'Monto total de la matr\u00EDcula'\"\r\n      [control]=\"codFormStepFour.controls['total_price']\"\r\n      [withPipe]=\"true\"\r\n    ></ipt-input>\r\n  </div>\r\n\r\n  <div class=\"col-12\">\r\n    <ipt-input\r\n      [withPipe]=\"true\"\r\n      [inputType]=\"'text'\"\r\n      [control]=\"codFormStepFour.controls['program_price']\"\r\n      [placeHolder]=\"'Valor total del programa'\"\r\n    ></ipt-input>\r\n  </div>\r\n\r\n  <div class=\"col-12\">\r\n    <ipt-input\r\n      onfocus=\"(this.type='date')\"\r\n      [inputType]=\"'date'\"\r\n      [control]=\"codFormStepFour.controls['payment_date']\"\r\n      [placeHolder]=\"'Fecha de pago'\"\r\n    ></ipt-input>\r\n  </div>\r\n\r\n  <!-- Tabla de financiaci\u00F3n -->\r\n  <div class=\"col-12\" *ngIf=\"isFinancing\">\r\n    <p-table\r\n      [value]=\"dataFinancing\"\r\n      [tableStyle]=\"{'min-width': '100%'}\"\r\n      [rowHover]=\"true\"\r\n    >\r\n      <ng-template pTemplate=\"caption\">\r\n        <div class=\"flex align-items-center\">\r\n          C\u00E1lculo de cuotas\r\n          <button pButton class=\"p-button-sm ml-auto\" label=\"Nuevo c\u00E1lculo\" (click)=\"calculateNewQuotes()\" [disabled]=\"isDisabledSel\" lab icon=\"pi pi-replay\"></button>\r\n        </div>\r\n      </ng-template>\r\n      <ng-template pTemplate=\"header\">\r\n        <tr>\r\n          <th>#</th>\r\n          <th>Valor</th>\r\n          <th>Fecha</th>\r\n        </tr>\r\n      </ng-template>\r\n      <ng-template pTemplate=\"body\" let-data>\r\n        <tr>\r\n          <td>{{ data[0] }}</td>\r\n          <td>{{ data[1] }}</td>\r\n          <td>{{ data[2] }}</td>\r\n        </tr>\r\n      </ng-template>\r\n    </p-table>\r\n  </div>\r\n  <!-- ---------------------- -->\r\n\r\n</form>\r\n\r\n<div class=\"flex mt-3 align-items-center gap-3\">\r\n  <span *ngIf=\"codFormStepFour.invalid && codFormStepFour.touched\" class=\"text-red-500 font-bold text-center mt-1 py-2 bg-red-100 w-full border-round-xl\">{{ errorMessage }}</span>\r\n  <div class=\"flex ml-auto gap-2\">\r\n    <button *ngIf=\"codFormStepFour.controls['payment_method'].value === '1'\" [disabled]=\"isFinancing || codFormStepFour.controls['payment_method'].value !== '1'\"type=\"submit\" class=\"ml-auto p-button-sm p-button-secondary\" (click)=\"showTable()\" pButton label=\"Calcular cuotas\" icon=\"pi pi-sliders-h\"></button>\r\n    <button [disabled]=\"!isFinancing && codFormStepFour.controls['payment_method'].value === '1'\" type=\"submit\" [class]=\"isEditCod ? 'ml-auto yellow-300 p-button-sm' : 'ml-auto p-button-sm'\" (click)=\"sendForm()\" pButton label=\"Siguiente\" icon=\"pi pi-arrow-right\"></button>\r\n  </div>\r\n</div>\r\n", styles: [".yellow-300{background-color:var(--yellow-500)!important;color:#fff}\n"] }]
+            args: [{ selector: 'app-cod-form-step-four', template: "<div *ngIf=\"isSemestral\" class=\"m-1 p-2 border-round-lg bg-blue-500 text-white\">\n  <strong>Nota: </strong>\n  El tipo de curso seleccionado fue semestral, por lo tanto el estudiante debe pagar matr\u00EDcula y primera cuota (M&M)\n</div>\n\n<form autocomplete=\"off\" [formGroup]=\"codFormStepFour\" class=\"grid mt-2\">\n\n  <div class=\"col-12\">\n    <ipt-select\n      [initialValue]=\"codFormStepFour.controls['payment_method'].value\"\n      [control]=\"codFormStepFour.controls['payment_method']\"\n      (eventSelect)=\"selectPaymentMethod($event)\"\n      [data]=\"paymentMethods\"\n      [defaultText]=\"'M\u00E9todo de pago'\"\n      [disabledSel]=\"isDisabledSel\"\n    ></ipt-select>\n    <ipt-loader *ngIf=\"feeResponse\"></ipt-loader>\n\n    <div class=\"col-12\" *ngIf=\"thereArePlans\">\n      <p-table\n        [value]=\"dataPrices\"\n        [tableStyle]=\"{'min-width': '100%'}\"\n        [rowHover]=\"true\"\n      >\n        <ng-template pTemplate=\"caption\">\n          <div class=\"flex align-items-center\">\n             Seleccion de niveles a cancelar.\n          </div>\n        </ng-template>\n        <ng-template pTemplate=\"header\">\n          <tr>\n            <th class=\"bg-blue-200 text-center font-medium pt-2 pb-2\">Cancelar</th>\n            <th class=\"bg-blue-200 text-center font-medium pt-2 pb-2\">Cuotas</th>\n            <th class=\"bg-blue-200 text-center font-medium pt-2 pb-2\">Admin</th>\n          </tr>\n        </ng-template>\n        <ng-template pTemplate=\"body\" let-data>\n          <tr>\n            <td>{{ data.paid_level }} Nivel(es)</td>\n            <td>{{ data.fee_number }}</td>\n            <td class=\"pt-2 pb-2\">\n              <button\n                pButton\n                pRipple\n                icon=\"pi pi-money-bill\"\n                class=\"p-button-sm p-button-rounded\"\n                (click)=\"selectLevels(data)\"\n\n              ></button>\n            </td>\n          </tr>\n        </ng-template>\n      </p-table>\n    </div>\n\n    <!-- [initialValue]=\"codFormStepFour.controls['quota_times'].value\" -->\n    <!-- <ipt-select *ngIf=\"isFinanced();\"\n      [initialValue]=\"'1'\"\n      [control]=\"codFormStepFour.controls['quota_times']\"\n      (eventSelect)=\"selectQuotas($event)\"\n      [defaultText]=\"'N\u00FAmero de cuotas'\"\n      [data]=\"codPrices\"\n      ></ipt-select> -->\n    </div>\n\n  <div class=\"col-12\">\n    <ipt-input\n      [inputType]=\"'text'\"\n      [placeHolder]=\"'Monto total de la matr\u00EDcula'\"\n      [control]=\"codFormStepFour.controls['total_price']\"\n      [withPipe]=\"true\"\n    ></ipt-input>\n  </div>\n\n  <div class=\"col-12\">\n    <ipt-input\n      [withPipe]=\"true\"\n      [inputType]=\"'text'\"\n      [control]=\"codFormStepFour.controls['program_price']\"\n      [placeHolder]=\"'Valor total del programa'\"\n    ></ipt-input>\n  </div>\n\n  <div class=\"col-12\">\n    <ipt-input\n      onfocus=\"(this.type='date')\"\n      [inputType]=\"'date'\"\n      [control]=\"codFormStepFour.controls['payment_date']\"\n      [placeHolder]=\"'Fecha de pago'\"\n    ></ipt-input>\n  </div>\n\n  <!-- Tabla de financiaci\u00F3n -->\n  <div class=\"col-12\" *ngIf=\"isFinancing\">\n    <p-table\n      [value]=\"dataFinancing\"\n      [tableStyle]=\"{'min-width': '100%'}\"\n      [rowHover]=\"true\"\n    >\n      <ng-template pTemplate=\"caption\">\n        <div class=\"flex align-items-center\">\n          C\u00E1lculo de cuotas\n          <button pButton class=\"p-button-sm ml-auto\" label=\"Nuevo c\u00E1lculo\" (click)=\"calculateNewQuotes()\" [disabled]=\"isDisabledSel\" lab icon=\"pi pi-replay\"></button>\n        </div>\n      </ng-template>\n      <ng-template pTemplate=\"header\">\n        <tr>\n          <th>#</th>\n          <th>Valor</th>\n          <th>Fecha</th>\n        </tr>\n      </ng-template>\n      <ng-template pTemplate=\"body\" let-data>\n        <tr>\n          <td>{{ data[0] }}</td>\n          <td>{{ data[1] }}</td>\n          <td>{{ data[2] }}</td>\n        </tr>\n      </ng-template>\n    </p-table>\n  </div>\n  <!-- ---------------------- -->\n\n</form>\n\n<div class=\"flex mt-3 align-items-center gap-3\">\n  <span *ngIf=\"codFormStepFour.invalid && codFormStepFour.touched\" class=\"text-red-500 font-bold text-center mt-1 py-2 bg-red-100 w-full border-round-xl\">{{ errorMessage }}</span>\n  <div class=\"flex ml-auto gap-2\">\n    <button *ngIf=\"codFormStepFour.controls['payment_method'].value === '1'\" [disabled]=\"isFinancing || codFormStepFour.controls['payment_method'].value !== '1'\"type=\"submit\" class=\"ml-auto p-button-sm p-button-secondary\" (click)=\"showTable()\" pButton label=\"Calcular cuotas\" icon=\"pi pi-sliders-h\"></button>\n    <button [disabled]=\"!isFinancing && codFormStepFour.controls['payment_method'].value === '1'\" type=\"submit\" [class]=\"isEditCod ? 'ml-auto yellow-300 p-button-sm' : 'ml-auto p-button-sm'\" (click)=\"sendForm()\" pButton label=\"Siguiente\" icon=\"pi pi-arrow-right\"></button>\n  </div>\n</div>\n", styles: [".yellow-300{background-color:var(--yellow-500)!important;color:#fff}\n"] }]
         }], ctorParameters: function () { return [{ type: i1$1.FormBuilder }, { type: CalculateQuotesService }, { type: CommunicatorService }, { type: ParameterService }, { type: CodFormControls }, { type: CommercialService }, { type: BaseService }]; }, propDecorators: { isEditCod: [{
                 type: Input
             }], initialData: [{
@@ -4909,10 +4909,10 @@ class ModalReferredComponent {
     }
 }
 ModalReferredComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.0.7", ngImport: i0, type: ModalReferredComponent, deps: [{ token: i1$1.FormBuilder }, { token: BaseService }, { token: UserService }], target: i0.ɵɵFactoryTarget.Component });
-ModalReferredComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.0.7", type: ModalReferredComponent, selector: "cod-modal-referred", inputs: { visibility: "visibility" }, outputs: { userSelect: "userSelect" }, ngImport: i0, template: "<main *ngIf=\"visibility\">\r\n  <div class=\"modal_container\">\r\n    <div class=\"header_modal\">\r\n      <h1>Datos de quien lo refiere</h1>\r\n      <button (click)=\"closeModal()\">x</button>\r\n    </div>\r\n    <div class=\"grid_container\">\r\n      <div>\r\n        <section\r\n          id=\"container\"\r\n          class=\"flex flex-column bg-white border-round-2xl\"\r\n        >\r\n          <form\r\n            autocomplete=\"off\"\r\n            (ngSubmit)=\"search(searchUserForm)\"\r\n            class=\"form\"\r\n            [formGroup]=\"searchUserForm\"\r\n          >\r\n            <input\r\n              placeholder=\"Buscar por nombre, documento o tel\u00E9fono\"\r\n              [formControl]=\"$any(searchUserForm.controls['searchUser'])\"\r\n              type=\"text\"\r\n              pInputText\r\n            />\r\n            <p-button\r\n              type=\"submit\"\r\n              label=\"Buscar\"\r\n              icon=\"pi pi-search\"\r\n              (onClick)=\"load(0, searchUserForm)\"\r\n            ></p-button>\r\n          </form>\r\n        </section>\r\n\r\n        <div *ngIf=\"userExists\" class=\"referrerInformation\">\r\n          <section class=\"userList\">\r\n              <p-table\r\n                [value]=\"allUsers\"\r\n                [scrollable]=\"true\"\r\n                scrollHeight=\"150px\"\r\n                [tableStyle]=\"{'min-width': '50rem'}\">\r\n                <ng-template pTemplate=\"header\">\r\n                    <tr>\r\n                      <th class=\"bg-blue-500 text-white text-center w-2 p-0 m-0\">Documento</th>\r\n                      <th class=\"bg-blue-500 text-white text-center w-2 p-0 m-0\">Nombres</th>\r\n                      <th class=\"bg-blue-500 text-white text-center w-2 p-0 m-0\">Apellidos</th>\r\n                      <th class=\"bg-blue-500 text-white text-center w-2 p-0 m-0\">Email</th>\r\n                      <th class=\"bg-blue-500 text-white text-center w-2 p-0 m-0\">Telefono</th>\r\n                      <th class=\"bg-blue-500 text-white text-center w-2 p-0 m-0\">Rol</th>\r\n                      <th class=\"bg-blue-500 text-white text-center w-2 p-0 m-0\">Admin</th>\r\n                    </tr>\r\n                </ng-template>\r\n                <ng-template pTemplate=\"body\" let-user>\r\n                    <tr>\r\n                        <td class=\"pt-2 pb-2 text-sm text-left\">{{user.id_card}}</td>\r\n                        <td class=\"pt-2 pb-2 text-sm text-left\">{{user.name}}</td>\r\n                        <td class=\"pt-2 pb-2 text-sm text-left\">{{user.last_name}}</td>\r\n                        <td class=\"pt-2 pb-2 text-sm text-left\">{{user.email}}</td>\r\n                        <td class=\"pt-2 pb-2 text-sm text-right\">{{user.phone_number}}</td>\r\n                        <td class=\"pt-2 pb-2 text-sm text-center\">{{user.role}}</td>\r\n                        <td class=\"pt-2 pb-2 min-w-min\" style=\"text-align: center\">\r\n                          <p-button\r\n                          icon=\"pi pi-chevron-circle-right\"\r\n                          (click)=\"selectUser(user)\"\r\n                        ></p-button>\r\n                        </td>\r\n                    </tr>\r\n                </ng-template>\r\n            </p-table>\r\n          </section>\r\n        </div>\r\n      </div>\r\n    </div>\r\n  </div>\r\n</main>\r\n", styles: [":host ::ng-deep .p-datatable .p-datatable-header{background:#3c82f6;color:#2e2e2e;border:1px solid #dee2e6;padding:0 0 15px;font-weight:500;height:2rem;border-top-left-radius:5px;border-top-right-radius:5px}:host ::ng-deep .p-datatable-table{padding-left:.5rem;padding-right:.5rem}#container{display:flex;flex-direction:row;justify-content:space-between}@media screen and (min-width: 320px){main{background:rgba(0,0,0,.472);color:#fff;position:fixed;top:0;left:0;height:100%;width:100vw;transition:all .5s;z-index:999}.referrerInformation{overflow:auto}main .modal_container{width:85%;height:-moz-fit-content;height:fit-content;position:absolute;inset:0;margin-top:5rem;margin-left:7%;background-color:#fff;border-radius:3px}.btn_select{margin:2px}.header_modal{display:flex;padding:15px 15px 0;align-items:center}.header_modal h1{padding:.5rem;background-color:#1c77f7;color:#fff;width:100%;border-radius:10px;font-size:1rem;font-weight:700;margin-bottom:0}.header_modal button{margin-left:auto;font-size:26px;padding:1.2rem;font-weight:200;color:#6c7f7d;display:flex;width:25px;height:25px;align-items:center;justify-content:center;transition:50ms;background-color:transparent;border:none}.header_modal button:hover{cursor:pointer;border-radius:50%;background-color:#d4d4d4}.referrer_Information{overflow:auto}.grid_container{display:grid;grid-template-columns:1fr;padding:10px;margin-bottom:1rem}form{display:flex;justify-content:start;flex-wrap:nowrap;flex-direction:row;align-items:center}.buttons-container{margin-top:2rem;margin-bottom:2rem;display:flex;justify-content:center;align-items:center;justify-items:center;align-content:center}}@media screen and (min-width: 768px){form{gap:1rem;height:90px}.header_modal h1{font-size:1.25rem}}@media screen and (min-width: 1366px){form{padding:0rem}}\n"], dependencies: [{ kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i2$1.PrimeTemplate, selector: "[pTemplate]", inputs: ["type", "pTemplate"] }, { kind: "directive", type: i1$1.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i1$1.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i1$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$1.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i1$1.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { kind: "directive", type: i1$1.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "component", type: i13.Table, selector: "p-table", inputs: ["frozenColumns", "frozenValue", "style", "styleClass", "tableStyle", "tableStyleClass", "paginator", "pageLinks", "rowsPerPageOptions", "alwaysShowPaginator", "paginatorPosition", "paginatorDropdownAppendTo", "paginatorDropdownScrollHeight", "currentPageReportTemplate", "showCurrentPageReport", "showJumpToPageDropdown", "showJumpToPageInput", "showFirstLastIcon", "showPageLinks", "defaultSortOrder", "sortMode", "resetPageOnSort", "selectionMode", "selectionPageOnly", "contextMenuSelection", "contextMenuSelectionMode", "dataKey", "metaKeySelection", "rowSelectable", "rowTrackBy", "lazy", "lazyLoadOnInit", "compareSelectionBy", "csvSeparator", "exportFilename", "filters", "globalFilterFields", "filterDelay", "filterLocale", "expandedRowKeys", "editingRowKeys", "rowExpandMode", "scrollable", "scrollDirection", "rowGroupMode", "scrollHeight", "virtualScroll", "virtualScrollItemSize", "virtualScrollOptions", "virtualScrollDelay", "frozenWidth", "responsive", "contextMenu", "resizableColumns", "columnResizeMode", "reorderableColumns", "loading", "loadingIcon", "showLoader", "rowHover", "customSort", "showInitialSortBadge", "autoLayout", "exportFunction", "exportHeader", "stateKey", "stateStorage", "editMode", "groupRowsBy", "groupRowsByOrder", "responsiveLayout", "breakpoint", "virtualRowHeight", "value", "columns", "first", "rows", "totalRecords", "sortField", "sortOrder", "multiSortMeta", "selection", "selectAll"], outputs: ["selectAllChange", "selectionChange", "contextMenuSelectionChange", "onRowSelect", "onRowUnselect", "onPage", "onSort", "onFilter", "onLazyLoad", "onRowExpand", "onRowCollapse", "onContextMenuSelect", "onColResize", "onColReorder", "onRowReorder", "onEditInit", "onEditComplete", "onEditCancel", "onHeaderCheckboxToggle", "sortFunction", "firstChange", "rowsChange", "onStateSave", "onStateRestore"] }, { kind: "component", type: i7$1.Button, selector: "p-button", inputs: ["type", "iconPos", "icon", "badge", "label", "disabled", "loading", "loadingIcon", "style", "styleClass", "badgeClass", "ariaLabel"], outputs: ["onClick", "onFocus", "onBlur"] }, { kind: "directive", type: i8.InputText, selector: "[pInputText]" }] });
+ModalReferredComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.0.7", type: ModalReferredComponent, selector: "cod-modal-referred", inputs: { visibility: "visibility" }, outputs: { userSelect: "userSelect" }, ngImport: i0, template: "<main *ngIf=\"visibility\">\n  <div class=\"modal_container\">\n    <div class=\"header_modal\">\n      <h1>Datos de quien lo refiere</h1>\n      <button (click)=\"closeModal()\">x</button>\n    </div>\n    <div class=\"grid_container\">\n      <div>\n        <section\n          id=\"container\"\n          class=\"flex flex-column bg-white border-round-2xl\"\n        >\n          <form\n            autocomplete=\"off\"\n            (ngSubmit)=\"search(searchUserForm)\"\n            class=\"form\"\n            [formGroup]=\"searchUserForm\"\n          >\n            <input\n              placeholder=\"Buscar por nombre, documento o tel\u00E9fono\"\n              [formControl]=\"$any(searchUserForm.controls['searchUser'])\"\n              type=\"text\"\n              pInputText\n            />\n            <p-button\n              type=\"submit\"\n              label=\"Buscar\"\n              icon=\"pi pi-search\"\n              (onClick)=\"load(0, searchUserForm)\"\n            ></p-button>\n          </form>\n        </section>\n\n        <div *ngIf=\"userExists\" class=\"referrerInformation\">\n          <section class=\"userList\">\n              <p-table\n                [value]=\"allUsers\"\n                [scrollable]=\"true\"\n                scrollHeight=\"150px\"\n                [tableStyle]=\"{'min-width': '50rem'}\">\n                <ng-template pTemplate=\"header\">\n                    <tr>\n                      <th class=\"bg-blue-500 text-white text-center w-2 p-0 m-0\">Documento</th>\n                      <th class=\"bg-blue-500 text-white text-center w-2 p-0 m-0\">Nombres</th>\n                      <th class=\"bg-blue-500 text-white text-center w-2 p-0 m-0\">Apellidos</th>\n                      <th class=\"bg-blue-500 text-white text-center w-2 p-0 m-0\">Email</th>\n                      <th class=\"bg-blue-500 text-white text-center w-2 p-0 m-0\">Telefono</th>\n                      <th class=\"bg-blue-500 text-white text-center w-2 p-0 m-0\">Rol</th>\n                      <th class=\"bg-blue-500 text-white text-center w-2 p-0 m-0\">Admin</th>\n                    </tr>\n                </ng-template>\n                <ng-template pTemplate=\"body\" let-user>\n                    <tr>\n                        <td class=\"pt-2 pb-2 text-sm text-left\">{{user.id_card}}</td>\n                        <td class=\"pt-2 pb-2 text-sm text-left\">{{user.name}}</td>\n                        <td class=\"pt-2 pb-2 text-sm text-left\">{{user.last_name}}</td>\n                        <td class=\"pt-2 pb-2 text-sm text-left\">{{user.email}}</td>\n                        <td class=\"pt-2 pb-2 text-sm text-right\">{{user.phone_number}}</td>\n                        <td class=\"pt-2 pb-2 text-sm text-center\">{{user.role}}</td>\n                        <td class=\"pt-2 pb-2 min-w-min\" style=\"text-align: center\">\n                          <p-button\n                          icon=\"pi pi-chevron-circle-right\"\n                          (click)=\"selectUser(user)\"\n                        ></p-button>\n                        </td>\n                    </tr>\n                </ng-template>\n            </p-table>\n          </section>\n        </div>\n      </div>\n    </div>\n  </div>\n</main>\n", styles: [":host ::ng-deep .p-datatable .p-datatable-header{background:#3c82f6;color:#2e2e2e;border:1px solid #dee2e6;padding:0 0 15px;font-weight:500;height:2rem;border-top-left-radius:5px;border-top-right-radius:5px}:host ::ng-deep .p-datatable-table{padding-left:.5rem;padding-right:.5rem}#container{display:flex;flex-direction:row;justify-content:space-between}@media screen and (min-width: 320px){main{background:rgba(0,0,0,.472);color:#fff;position:fixed;top:0;left:0;height:100%;width:100vw;transition:all .5s;z-index:999}.referrerInformation{overflow:auto}main .modal_container{width:85%;height:-moz-fit-content;height:fit-content;position:absolute;inset:0;margin-top:5rem;margin-left:7%;background-color:#fff;border-radius:3px}.btn_select{margin:2px}.header_modal{display:flex;padding:15px 15px 0;align-items:center}.header_modal h1{padding:.5rem;background-color:#1c77f7;color:#fff;width:100%;border-radius:10px;font-size:1rem;font-weight:700;margin-bottom:0}.header_modal button{margin-left:auto;font-size:26px;padding:1.2rem;font-weight:200;color:#6c7f7d;display:flex;width:25px;height:25px;align-items:center;justify-content:center;transition:50ms;background-color:transparent;border:none}.header_modal button:hover{cursor:pointer;border-radius:50%;background-color:#d4d4d4}.referrer_Information{overflow:auto}.grid_container{display:grid;grid-template-columns:1fr;padding:10px;margin-bottom:1rem}form{display:flex;justify-content:start;flex-wrap:nowrap;flex-direction:row;align-items:center}.buttons-container{margin-top:2rem;margin-bottom:2rem;display:flex;justify-content:center;align-items:center;justify-items:center;align-content:center}}@media screen and (min-width: 768px){form{gap:1rem;height:90px}.header_modal h1{font-size:1.25rem}}@media screen and (min-width: 1366px){form{padding:0rem}}\n"], dependencies: [{ kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i2$1.PrimeTemplate, selector: "[pTemplate]", inputs: ["type", "pTemplate"] }, { kind: "directive", type: i1$1.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i1$1.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i1$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$1.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i1$1.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { kind: "directive", type: i1$1.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "component", type: i13.Table, selector: "p-table", inputs: ["frozenColumns", "frozenValue", "style", "styleClass", "tableStyle", "tableStyleClass", "paginator", "pageLinks", "rowsPerPageOptions", "alwaysShowPaginator", "paginatorPosition", "paginatorDropdownAppendTo", "paginatorDropdownScrollHeight", "currentPageReportTemplate", "showCurrentPageReport", "showJumpToPageDropdown", "showJumpToPageInput", "showFirstLastIcon", "showPageLinks", "defaultSortOrder", "sortMode", "resetPageOnSort", "selectionMode", "selectionPageOnly", "contextMenuSelection", "contextMenuSelectionMode", "dataKey", "metaKeySelection", "rowSelectable", "rowTrackBy", "lazy", "lazyLoadOnInit", "compareSelectionBy", "csvSeparator", "exportFilename", "filters", "globalFilterFields", "filterDelay", "filterLocale", "expandedRowKeys", "editingRowKeys", "rowExpandMode", "scrollable", "scrollDirection", "rowGroupMode", "scrollHeight", "virtualScroll", "virtualScrollItemSize", "virtualScrollOptions", "virtualScrollDelay", "frozenWidth", "responsive", "contextMenu", "resizableColumns", "columnResizeMode", "reorderableColumns", "loading", "loadingIcon", "showLoader", "rowHover", "customSort", "showInitialSortBadge", "autoLayout", "exportFunction", "exportHeader", "stateKey", "stateStorage", "editMode", "groupRowsBy", "groupRowsByOrder", "responsiveLayout", "breakpoint", "virtualRowHeight", "value", "columns", "first", "rows", "totalRecords", "sortField", "sortOrder", "multiSortMeta", "selection", "selectAll"], outputs: ["selectAllChange", "selectionChange", "contextMenuSelectionChange", "onRowSelect", "onRowUnselect", "onPage", "onSort", "onFilter", "onLazyLoad", "onRowExpand", "onRowCollapse", "onContextMenuSelect", "onColResize", "onColReorder", "onRowReorder", "onEditInit", "onEditComplete", "onEditCancel", "onHeaderCheckboxToggle", "sortFunction", "firstChange", "rowsChange", "onStateSave", "onStateRestore"] }, { kind: "component", type: i7$1.Button, selector: "p-button", inputs: ["type", "iconPos", "icon", "badge", "label", "disabled", "loading", "loadingIcon", "style", "styleClass", "badgeClass", "ariaLabel"], outputs: ["onClick", "onFocus", "onBlur"] }, { kind: "directive", type: i8.InputText, selector: "[pInputText]" }] });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.0.7", ngImport: i0, type: ModalReferredComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'cod-modal-referred', template: "<main *ngIf=\"visibility\">\r\n  <div class=\"modal_container\">\r\n    <div class=\"header_modal\">\r\n      <h1>Datos de quien lo refiere</h1>\r\n      <button (click)=\"closeModal()\">x</button>\r\n    </div>\r\n    <div class=\"grid_container\">\r\n      <div>\r\n        <section\r\n          id=\"container\"\r\n          class=\"flex flex-column bg-white border-round-2xl\"\r\n        >\r\n          <form\r\n            autocomplete=\"off\"\r\n            (ngSubmit)=\"search(searchUserForm)\"\r\n            class=\"form\"\r\n            [formGroup]=\"searchUserForm\"\r\n          >\r\n            <input\r\n              placeholder=\"Buscar por nombre, documento o tel\u00E9fono\"\r\n              [formControl]=\"$any(searchUserForm.controls['searchUser'])\"\r\n              type=\"text\"\r\n              pInputText\r\n            />\r\n            <p-button\r\n              type=\"submit\"\r\n              label=\"Buscar\"\r\n              icon=\"pi pi-search\"\r\n              (onClick)=\"load(0, searchUserForm)\"\r\n            ></p-button>\r\n          </form>\r\n        </section>\r\n\r\n        <div *ngIf=\"userExists\" class=\"referrerInformation\">\r\n          <section class=\"userList\">\r\n              <p-table\r\n                [value]=\"allUsers\"\r\n                [scrollable]=\"true\"\r\n                scrollHeight=\"150px\"\r\n                [tableStyle]=\"{'min-width': '50rem'}\">\r\n                <ng-template pTemplate=\"header\">\r\n                    <tr>\r\n                      <th class=\"bg-blue-500 text-white text-center w-2 p-0 m-0\">Documento</th>\r\n                      <th class=\"bg-blue-500 text-white text-center w-2 p-0 m-0\">Nombres</th>\r\n                      <th class=\"bg-blue-500 text-white text-center w-2 p-0 m-0\">Apellidos</th>\r\n                      <th class=\"bg-blue-500 text-white text-center w-2 p-0 m-0\">Email</th>\r\n                      <th class=\"bg-blue-500 text-white text-center w-2 p-0 m-0\">Telefono</th>\r\n                      <th class=\"bg-blue-500 text-white text-center w-2 p-0 m-0\">Rol</th>\r\n                      <th class=\"bg-blue-500 text-white text-center w-2 p-0 m-0\">Admin</th>\r\n                    </tr>\r\n                </ng-template>\r\n                <ng-template pTemplate=\"body\" let-user>\r\n                    <tr>\r\n                        <td class=\"pt-2 pb-2 text-sm text-left\">{{user.id_card}}</td>\r\n                        <td class=\"pt-2 pb-2 text-sm text-left\">{{user.name}}</td>\r\n                        <td class=\"pt-2 pb-2 text-sm text-left\">{{user.last_name}}</td>\r\n                        <td class=\"pt-2 pb-2 text-sm text-left\">{{user.email}}</td>\r\n                        <td class=\"pt-2 pb-2 text-sm text-right\">{{user.phone_number}}</td>\r\n                        <td class=\"pt-2 pb-2 text-sm text-center\">{{user.role}}</td>\r\n                        <td class=\"pt-2 pb-2 min-w-min\" style=\"text-align: center\">\r\n                          <p-button\r\n                          icon=\"pi pi-chevron-circle-right\"\r\n                          (click)=\"selectUser(user)\"\r\n                        ></p-button>\r\n                        </td>\r\n                    </tr>\r\n                </ng-template>\r\n            </p-table>\r\n          </section>\r\n        </div>\r\n      </div>\r\n    </div>\r\n  </div>\r\n</main>\r\n", styles: [":host ::ng-deep .p-datatable .p-datatable-header{background:#3c82f6;color:#2e2e2e;border:1px solid #dee2e6;padding:0 0 15px;font-weight:500;height:2rem;border-top-left-radius:5px;border-top-right-radius:5px}:host ::ng-deep .p-datatable-table{padding-left:.5rem;padding-right:.5rem}#container{display:flex;flex-direction:row;justify-content:space-between}@media screen and (min-width: 320px){main{background:rgba(0,0,0,.472);color:#fff;position:fixed;top:0;left:0;height:100%;width:100vw;transition:all .5s;z-index:999}.referrerInformation{overflow:auto}main .modal_container{width:85%;height:-moz-fit-content;height:fit-content;position:absolute;inset:0;margin-top:5rem;margin-left:7%;background-color:#fff;border-radius:3px}.btn_select{margin:2px}.header_modal{display:flex;padding:15px 15px 0;align-items:center}.header_modal h1{padding:.5rem;background-color:#1c77f7;color:#fff;width:100%;border-radius:10px;font-size:1rem;font-weight:700;margin-bottom:0}.header_modal button{margin-left:auto;font-size:26px;padding:1.2rem;font-weight:200;color:#6c7f7d;display:flex;width:25px;height:25px;align-items:center;justify-content:center;transition:50ms;background-color:transparent;border:none}.header_modal button:hover{cursor:pointer;border-radius:50%;background-color:#d4d4d4}.referrer_Information{overflow:auto}.grid_container{display:grid;grid-template-columns:1fr;padding:10px;margin-bottom:1rem}form{display:flex;justify-content:start;flex-wrap:nowrap;flex-direction:row;align-items:center}.buttons-container{margin-top:2rem;margin-bottom:2rem;display:flex;justify-content:center;align-items:center;justify-items:center;align-content:center}}@media screen and (min-width: 768px){form{gap:1rem;height:90px}.header_modal h1{font-size:1.25rem}}@media screen and (min-width: 1366px){form{padding:0rem}}\n"] }]
+            args: [{ selector: 'cod-modal-referred', template: "<main *ngIf=\"visibility\">\n  <div class=\"modal_container\">\n    <div class=\"header_modal\">\n      <h1>Datos de quien lo refiere</h1>\n      <button (click)=\"closeModal()\">x</button>\n    </div>\n    <div class=\"grid_container\">\n      <div>\n        <section\n          id=\"container\"\n          class=\"flex flex-column bg-white border-round-2xl\"\n        >\n          <form\n            autocomplete=\"off\"\n            (ngSubmit)=\"search(searchUserForm)\"\n            class=\"form\"\n            [formGroup]=\"searchUserForm\"\n          >\n            <input\n              placeholder=\"Buscar por nombre, documento o tel\u00E9fono\"\n              [formControl]=\"$any(searchUserForm.controls['searchUser'])\"\n              type=\"text\"\n              pInputText\n            />\n            <p-button\n              type=\"submit\"\n              label=\"Buscar\"\n              icon=\"pi pi-search\"\n              (onClick)=\"load(0, searchUserForm)\"\n            ></p-button>\n          </form>\n        </section>\n\n        <div *ngIf=\"userExists\" class=\"referrerInformation\">\n          <section class=\"userList\">\n              <p-table\n                [value]=\"allUsers\"\n                [scrollable]=\"true\"\n                scrollHeight=\"150px\"\n                [tableStyle]=\"{'min-width': '50rem'}\">\n                <ng-template pTemplate=\"header\">\n                    <tr>\n                      <th class=\"bg-blue-500 text-white text-center w-2 p-0 m-0\">Documento</th>\n                      <th class=\"bg-blue-500 text-white text-center w-2 p-0 m-0\">Nombres</th>\n                      <th class=\"bg-blue-500 text-white text-center w-2 p-0 m-0\">Apellidos</th>\n                      <th class=\"bg-blue-500 text-white text-center w-2 p-0 m-0\">Email</th>\n                      <th class=\"bg-blue-500 text-white text-center w-2 p-0 m-0\">Telefono</th>\n                      <th class=\"bg-blue-500 text-white text-center w-2 p-0 m-0\">Rol</th>\n                      <th class=\"bg-blue-500 text-white text-center w-2 p-0 m-0\">Admin</th>\n                    </tr>\n                </ng-template>\n                <ng-template pTemplate=\"body\" let-user>\n                    <tr>\n                        <td class=\"pt-2 pb-2 text-sm text-left\">{{user.id_card}}</td>\n                        <td class=\"pt-2 pb-2 text-sm text-left\">{{user.name}}</td>\n                        <td class=\"pt-2 pb-2 text-sm text-left\">{{user.last_name}}</td>\n                        <td class=\"pt-2 pb-2 text-sm text-left\">{{user.email}}</td>\n                        <td class=\"pt-2 pb-2 text-sm text-right\">{{user.phone_number}}</td>\n                        <td class=\"pt-2 pb-2 text-sm text-center\">{{user.role}}</td>\n                        <td class=\"pt-2 pb-2 min-w-min\" style=\"text-align: center\">\n                          <p-button\n                          icon=\"pi pi-chevron-circle-right\"\n                          (click)=\"selectUser(user)\"\n                        ></p-button>\n                        </td>\n                    </tr>\n                </ng-template>\n            </p-table>\n          </section>\n        </div>\n      </div>\n    </div>\n  </div>\n</main>\n", styles: [":host ::ng-deep .p-datatable .p-datatable-header{background:#3c82f6;color:#2e2e2e;border:1px solid #dee2e6;padding:0 0 15px;font-weight:500;height:2rem;border-top-left-radius:5px;border-top-right-radius:5px}:host ::ng-deep .p-datatable-table{padding-left:.5rem;padding-right:.5rem}#container{display:flex;flex-direction:row;justify-content:space-between}@media screen and (min-width: 320px){main{background:rgba(0,0,0,.472);color:#fff;position:fixed;top:0;left:0;height:100%;width:100vw;transition:all .5s;z-index:999}.referrerInformation{overflow:auto}main .modal_container{width:85%;height:-moz-fit-content;height:fit-content;position:absolute;inset:0;margin-top:5rem;margin-left:7%;background-color:#fff;border-radius:3px}.btn_select{margin:2px}.header_modal{display:flex;padding:15px 15px 0;align-items:center}.header_modal h1{padding:.5rem;background-color:#1c77f7;color:#fff;width:100%;border-radius:10px;font-size:1rem;font-weight:700;margin-bottom:0}.header_modal button{margin-left:auto;font-size:26px;padding:1.2rem;font-weight:200;color:#6c7f7d;display:flex;width:25px;height:25px;align-items:center;justify-content:center;transition:50ms;background-color:transparent;border:none}.header_modal button:hover{cursor:pointer;border-radius:50%;background-color:#d4d4d4}.referrer_Information{overflow:auto}.grid_container{display:grid;grid-template-columns:1fr;padding:10px;margin-bottom:1rem}form{display:flex;justify-content:start;flex-wrap:nowrap;flex-direction:row;align-items:center}.buttons-container{margin-top:2rem;margin-bottom:2rem;display:flex;justify-content:center;align-items:center;justify-items:center;align-content:center}}@media screen and (min-width: 768px){form{gap:1rem;height:90px}.header_modal h1{font-size:1.25rem}}@media screen and (min-width: 1366px){form{padding:0rem}}\n"] }]
         }], ctorParameters: function () { return [{ type: i1$1.FormBuilder }, { type: BaseService }, { type: UserService }]; }, propDecorators: { visibility: [{
                 type: Input
             }], userSelect: [{
@@ -5123,10 +5123,10 @@ class CodFormStepFiveComponent extends CodFormSteps {
     }
 }
 CodFormStepFiveComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.0.7", ngImport: i0, type: CodFormStepFiveComponent, deps: [{ token: i1$1.FormBuilder }, { token: ParameterService }], target: i0.ɵɵFactoryTarget.Component });
-CodFormStepFiveComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.0.7", type: CodFormStepFiveComponent, selector: "app-cod-form-step-five", inputs: { userRole: "userRole", initialData: "initialData", isEditCod: "isEditCod", isRenovation: "isRenovation" }, outputs: { changeStepEvent: "changeStepEvent", action: "action" }, usesInheritance: true, usesOnChanges: true, ngImport: i0, template: "<form autocomplete=\"off\" [formGroup]=\"codFormStepFive\" class=\"grid\">\r\n  <div class=\"col-12 md:col-6\">\r\n    <cod-modal-referred\r\n    *ngIf=\"modalVisible\"\r\n    [visibility]=\"modalVisible\"\r\n    (userSelect)=\"referredUser($event)\"\r\n    ></cod-modal-referred>\r\n\r\n    <div class=\"container_referred flex flex-row justify-content-between align-items-end\">\r\n      <div class=\"containe_select1\">\r\n        <ipt-select\r\n          [control]=\"codFormStepFive.controls['marketing_reasons']\"\r\n          [initialValue]=\"codFormStepFive.controls['marketing_reasons'].value\"\r\n          (eventSelect)=\"selectMarketingReasons($event)\"\r\n          [data]=\"marketingReasons\"\r\n          [defaultText]=\"'\u00BFC\u00F3mo se enter\u00F3 del programa?'\"\r\n        ></ipt-select>\r\n      </div>\r\n      <p-button\r\n      *ngIf=\"visbleReferred\"\r\n      styleClass=\"p-button-sm w-max\"\r\n      label=\"Cambiar Referido\"\r\n      icon=\"pi pi-sync\"\r\n      (onClick)=\"openModalReferred()\"\r\n    ></p-button>\r\n    </div>\r\n\r\n    <ipt-input\r\n      [inputType]=\"'text'\"\r\n      [placeHolder]=\"'Discapacidad'\"\r\n      [control]=\"codFormStepFive.controls['disability']\"\r\n    ></ipt-input>\r\n  </div>\r\n  <div class=\"col-12 md:col-6\">\r\n    <ipt-select\r\n      [control]=\"codFormStepFive.controls['study_reasons']\"\r\n      [initialValue]=\"codFormStepFive.controls['study_reasons'].value\"\r\n      (eventSelect)=\"selectStudyReasons($event)\"\r\n      [data]=\"studyReasons\"\r\n      [defaultText]=\"'Motivo'\"\r\n    ></ipt-select>\r\n    <ipt-input\r\n      [inputType]=\"'text'\"\r\n      [placeHolder]=\"'R\u00E9gimen de salud'\"\r\n      [control]=\"codFormStepFive.controls['health_regimen']\"\r\n    ></ipt-input>\r\n  </div>\r\n  <div class=\"col-12\">\r\n    <h3 *ngIf=\"visbleReferred\" class=\"referred_title\">Datos del referido</h3>\r\n    <div *ngIf=\"visbleReferred\" class=\"referred_user_data\">\r\n      <ipt-input\r\n        [inputType]=\"'text'\"\r\n        [placeHolder]=\"'Documento'\"\r\n        [control]=\"codFormStepFive.controls['document_refers']\"\r\n      ></ipt-input>\r\n      <ipt-input\r\n        [inputType]=\"'text'\"\r\n        [placeHolder]=\"'Nombres'\"\r\n        [control]=\"codFormStepFive.controls['name_refers']\"\r\n      ></ipt-input>\r\n      <ipt-input\r\n        [inputType]=\"'text'\"\r\n        [placeHolder]=\"'Tel\u00E9fono'\"\r\n        [control]=\"codFormStepFive.controls['phone_refers']\"\r\n      ></ipt-input>\r\n      <ipt-input\r\n        [inputType]=\"'text'\"\r\n        [placeHolder]=\"'Email'\"\r\n        [control]=\"codFormStepFive.controls['email_refers']\"\r\n      ></ipt-input>\r\n    </div>\r\n    <span class=\"p-float-label\">\r\n      <textarea\r\n        id=\"float-input\"\r\n        rows=\"4\"\r\n        cols=\"30\"\r\n        pInputTextarea\r\n        formControlName=\"observation\"\r\n      ></textarea>\r\n      <label for=\"float-input\">Observaciones</label>\r\n    </span>\r\n    <div class=\"flex flex-wrap justify-content-between gap-2\">\r\n      <div\r\n        *ngFor=\"let option of multiculturalities; index as i\"\r\n        class=\"field-checkbox mt-4 flex align-items-center\"\r\n      >\r\n        <mat-checkbox\r\n          [formControlName]=\"'multiculturalism' + '_' + (i + 1)\"\r\n          class=\"example-margin\"\r\n        ></mat-checkbox>\r\n        <label [for]=\"option.code\">{{ option.name }}</label>\r\n      </div>\r\n    </div>\r\n  </div>\r\n\r\n  <div class=\"col-12 p-4 font-bold\">\r\n    <p>\r\n      * El estudiante o titular se comprometen a cancelar las cuotas\r\n      establecidas en este contrato, los primeros 5 (cinco) d\u00EDas del mes. En\r\n      caso de querer retirarse, deber\u00E1 informar por escrito 30 (treinta) d\u00EDas\r\n      antes y cancelar lo correspondiente hasta la fecha definida de retiro,\r\n      para poder obtener su paz y salvo.\r\n    </p>\r\n    <br /><br />\r\n    <div class=\"flex gap-2\">\r\n      <mat-checkbox\r\n        formControlName=\"terms\"\r\n        class=\"example-margin\"\r\n      ></mat-checkbox>\r\n      <!-- <p-checkbox [formControl]=\"getCheckboxControl()\"></p-checkbox> -->\r\n      <!-- <ipt-checkbox [control]=\"codFormStepFive.controls['terms']\" [checkboxOption]=\"termsCheckboxStatus\"></ipt-checkbox> -->\r\n      <p>\r\n        DECLARO HABER LE\u00CDDO Y ACEPTO LOS T\u00C9RMINOS Y CONDICIONES DE LAS POL\u00CDTICAS\r\n        ESTABLECIDAS EN LA INSTITUCI\u00D3N.\r\n      </p>\r\n    </div>\r\n  </div>\r\n</form>\r\n\r\n<div class=\"flex mt-3 align-items-center gap-3\">\r\n  <span\r\n    *ngIf=\"\r\n      (codFormStepFive.invalid && codFormStepFive.touched) ||\r\n      (!termsCheckboxStatus && codFormStepFive.touched)\r\n    \"\r\n    class=\"\r\n      text-red-500\r\n      font-bold\r\n      text-center\r\n      mt-1\r\n      py-2\r\n      bg-red-100\r\n      w-full\r\n      border-round-xl\r\n    \"\r\n    >{{ errorMessage }}</span\r\n  >\r\n  <button\r\n  type=\"submit\"\r\n  [class]=\"isEditCod ? 'ml-auto yellow-300 p-button-sm' : 'ml-auto p-button-success p-button-sm'\"\r\n  (click)=\"sendForm()\"\r\n  pButton\r\n  [label]=\"sendFormMsg\"\r\n  icon=\"pi pi-check\"\r\n></button>\r\n</div>\r\n", styles: [":host ::ng-deep .p-button.p-button-sm{padding:.4rem!important}.yellow-300{background-color:var(--yellow-500)!important;color:#fff}@media screen and (min-width: 320px){.referred_user_data{display:grid;grid-template-columns:1fr 1fr 1fr 1fr;gap:.8rem;margin-bottom:2rem;border:1px solid #ced4da;border-radius:3px;padding:.5rem}.referred_title{font-size:.8rem;font-weight:400;padding-left:1rem;color:#6c757d}.containe_select1{width:100%}}@media screen and (min-width: 768px){.referred_user_data{grid-template-columns:1fr 1fr}}\n"], dependencies: [{ kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: InputComponent, selector: "ipt-input", inputs: ["inputType", "placeHolder", "validateText", "withPipe", "list", "iconUrl", "control", "prefix", "thousands", "decimal", "disabledSel"], outputs: ["dateSelected"] }, { kind: "component", type: SelectComponent, selector: "ipt-select", inputs: ["isRequired", "data", "defaultText", "selectCode", "disabledSel", "initialValue", "control"], outputs: ["eventSelect"] }, { kind: "component", type: i6$1.MatCheckbox, selector: "mat-checkbox", inputs: ["disableRipple", "color", "tabIndex"], exportAs: ["matCheckbox"] }, { kind: "directive", type: i1$1.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i1$1.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i1$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$1.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i1$1.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i1$1.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "directive", type: i7$1.ButtonDirective, selector: "[pButton]", inputs: ["iconPos", "loadingIcon", "label", "icon", "loading"] }, { kind: "component", type: i7$1.Button, selector: "p-button", inputs: ["type", "iconPos", "icon", "badge", "label", "disabled", "loading", "loadingIcon", "style", "styleClass", "badgeClass", "ariaLabel"], outputs: ["onClick", "onFocus", "onBlur"] }, { kind: "directive", type: i8$1.InputTextarea, selector: "[pInputTextarea]", inputs: ["autoResize"], outputs: ["onResize"] }, { kind: "component", type: ModalReferredComponent, selector: "cod-modal-referred", inputs: ["visibility"], outputs: ["userSelect"] }] });
+CodFormStepFiveComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.0.7", type: CodFormStepFiveComponent, selector: "app-cod-form-step-five", inputs: { userRole: "userRole", initialData: "initialData", isEditCod: "isEditCod", isRenovation: "isRenovation" }, outputs: { changeStepEvent: "changeStepEvent", action: "action" }, usesInheritance: true, usesOnChanges: true, ngImport: i0, template: "<form autocomplete=\"off\" [formGroup]=\"codFormStepFive\" class=\"grid\">\n  <div class=\"col-12 md:col-6\">\n    <cod-modal-referred\n    *ngIf=\"modalVisible\"\n    [visibility]=\"modalVisible\"\n    (userSelect)=\"referredUser($event)\"\n    ></cod-modal-referred>\n\n    <div class=\"container_referred flex flex-row justify-content-between align-items-end\">\n      <div class=\"containe_select1\">\n        <ipt-select\n          [control]=\"codFormStepFive.controls['marketing_reasons']\"\n          [initialValue]=\"codFormStepFive.controls['marketing_reasons'].value\"\n          (eventSelect)=\"selectMarketingReasons($event)\"\n          [data]=\"marketingReasons\"\n          [defaultText]=\"'\u00BFC\u00F3mo se enter\u00F3 del programa?'\"\n        ></ipt-select>\n      </div>\n      <p-button\n      *ngIf=\"visbleReferred\"\n      styleClass=\"p-button-sm w-max\"\n      label=\"Cambiar Referido\"\n      icon=\"pi pi-sync\"\n      (onClick)=\"openModalReferred()\"\n    ></p-button>\n    </div>\n\n    <ipt-input\n      [inputType]=\"'text'\"\n      [placeHolder]=\"'Discapacidad'\"\n      [control]=\"codFormStepFive.controls['disability']\"\n    ></ipt-input>\n  </div>\n  <div class=\"col-12 md:col-6\">\n    <ipt-select\n      [control]=\"codFormStepFive.controls['study_reasons']\"\n      [initialValue]=\"codFormStepFive.controls['study_reasons'].value\"\n      (eventSelect)=\"selectStudyReasons($event)\"\n      [data]=\"studyReasons\"\n      [defaultText]=\"'Motivo'\"\n    ></ipt-select>\n    <ipt-input\n      [inputType]=\"'text'\"\n      [placeHolder]=\"'R\u00E9gimen de salud'\"\n      [control]=\"codFormStepFive.controls['health_regimen']\"\n    ></ipt-input>\n  </div>\n  <div class=\"col-12\">\n    <h3 *ngIf=\"visbleReferred\" class=\"referred_title\">Datos del referido</h3>\n    <div *ngIf=\"visbleReferred\" class=\"referred_user_data\">\n      <ipt-input\n        [inputType]=\"'text'\"\n        [placeHolder]=\"'Documento'\"\n        [control]=\"codFormStepFive.controls['document_refers']\"\n      ></ipt-input>\n      <ipt-input\n        [inputType]=\"'text'\"\n        [placeHolder]=\"'Nombres'\"\n        [control]=\"codFormStepFive.controls['name_refers']\"\n      ></ipt-input>\n      <ipt-input\n        [inputType]=\"'text'\"\n        [placeHolder]=\"'Tel\u00E9fono'\"\n        [control]=\"codFormStepFive.controls['phone_refers']\"\n      ></ipt-input>\n      <ipt-input\n        [inputType]=\"'text'\"\n        [placeHolder]=\"'Email'\"\n        [control]=\"codFormStepFive.controls['email_refers']\"\n      ></ipt-input>\n    </div>\n    <span class=\"p-float-label\">\n      <textarea\n        id=\"float-input\"\n        rows=\"4\"\n        cols=\"30\"\n        pInputTextarea\n        formControlName=\"observation\"\n      ></textarea>\n      <label for=\"float-input\">Observaciones</label>\n    </span>\n    <div class=\"flex flex-wrap justify-content-between gap-2\">\n      <div\n        *ngFor=\"let option of multiculturalities; index as i\"\n        class=\"field-checkbox mt-4 flex align-items-center\"\n      >\n        <mat-checkbox\n          [formControlName]=\"'multiculturalism' + '_' + (i + 1)\"\n          class=\"example-margin\"\n        ></mat-checkbox>\n        <label [for]=\"option.code\">{{ option.name }}</label>\n      </div>\n    </div>\n  </div>\n\n  <div class=\"col-12 p-4 font-bold\">\n    <p>\n      * El estudiante o titular se comprometen a cancelar las cuotas\n      establecidas en este contrato, los primeros 5 (cinco) d\u00EDas del mes. En\n      caso de querer retirarse, deber\u00E1 informar por escrito 30 (treinta) d\u00EDas\n      antes y cancelar lo correspondiente hasta la fecha definida de retiro,\n      para poder obtener su paz y salvo.\n    </p>\n    <br /><br />\n    <div class=\"flex gap-2\">\n      <mat-checkbox\n        formControlName=\"terms\"\n        class=\"example-margin\"\n      ></mat-checkbox>\n      <!-- <p-checkbox [formControl]=\"getCheckboxControl()\"></p-checkbox> -->\n      <!-- <ipt-checkbox [control]=\"codFormStepFive.controls['terms']\" [checkboxOption]=\"termsCheckboxStatus\"></ipt-checkbox> -->\n      <p>\n        DECLARO HABER LE\u00CDDO Y ACEPTO LOS T\u00C9RMINOS Y CONDICIONES DE LAS POL\u00CDTICAS\n        ESTABLECIDAS EN LA INSTITUCI\u00D3N.\n      </p>\n    </div>\n  </div>\n</form>\n\n<div class=\"flex mt-3 align-items-center gap-3\">\n  <span\n    *ngIf=\"\n      (codFormStepFive.invalid && codFormStepFive.touched) ||\n      (!termsCheckboxStatus && codFormStepFive.touched)\n    \"\n    class=\"\n      text-red-500\n      font-bold\n      text-center\n      mt-1\n      py-2\n      bg-red-100\n      w-full\n      border-round-xl\n    \"\n    >{{ errorMessage }}</span\n  >\n  <button\n  type=\"submit\"\n  [class]=\"isEditCod ? 'ml-auto yellow-300 p-button-sm' : 'ml-auto p-button-success p-button-sm'\"\n  (click)=\"sendForm()\"\n  pButton\n  [label]=\"sendFormMsg\"\n  icon=\"pi pi-check\"\n></button>\n</div>\n", styles: [":host ::ng-deep .p-button.p-button-sm{padding:.4rem!important}.yellow-300{background-color:var(--yellow-500)!important;color:#fff}@media screen and (min-width: 320px){.referred_user_data{display:grid;grid-template-columns:1fr 1fr 1fr 1fr;gap:.8rem;margin-bottom:2rem;border:1px solid #ced4da;border-radius:3px;padding:.5rem}.referred_title{font-size:.8rem;font-weight:400;padding-left:1rem;color:#6c757d}.containe_select1{width:100%}}@media screen and (min-width: 768px){.referred_user_data{grid-template-columns:1fr 1fr}}\n"], dependencies: [{ kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: InputComponent, selector: "ipt-input", inputs: ["inputType", "placeHolder", "validateText", "withPipe", "list", "iconUrl", "control", "prefix", "thousands", "decimal", "disabledSel"], outputs: ["dateSelected"] }, { kind: "component", type: SelectComponent, selector: "ipt-select", inputs: ["isRequired", "data", "defaultText", "selectCode", "disabledSel", "initialValue", "control"], outputs: ["eventSelect"] }, { kind: "component", type: i6$1.MatCheckbox, selector: "mat-checkbox", inputs: ["disableRipple", "color", "tabIndex"], exportAs: ["matCheckbox"] }, { kind: "directive", type: i1$1.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i1$1.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i1$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$1.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i1$1.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i1$1.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "directive", type: i7$1.ButtonDirective, selector: "[pButton]", inputs: ["iconPos", "loadingIcon", "label", "icon", "loading"] }, { kind: "component", type: i7$1.Button, selector: "p-button", inputs: ["type", "iconPos", "icon", "badge", "label", "disabled", "loading", "loadingIcon", "style", "styleClass", "badgeClass", "ariaLabel"], outputs: ["onClick", "onFocus", "onBlur"] }, { kind: "directive", type: i8$1.InputTextarea, selector: "[pInputTextarea]", inputs: ["autoResize"], outputs: ["onResize"] }, { kind: "component", type: ModalReferredComponent, selector: "cod-modal-referred", inputs: ["visibility"], outputs: ["userSelect"] }] });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.0.7", ngImport: i0, type: CodFormStepFiveComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'app-cod-form-step-five', template: "<form autocomplete=\"off\" [formGroup]=\"codFormStepFive\" class=\"grid\">\r\n  <div class=\"col-12 md:col-6\">\r\n    <cod-modal-referred\r\n    *ngIf=\"modalVisible\"\r\n    [visibility]=\"modalVisible\"\r\n    (userSelect)=\"referredUser($event)\"\r\n    ></cod-modal-referred>\r\n\r\n    <div class=\"container_referred flex flex-row justify-content-between align-items-end\">\r\n      <div class=\"containe_select1\">\r\n        <ipt-select\r\n          [control]=\"codFormStepFive.controls['marketing_reasons']\"\r\n          [initialValue]=\"codFormStepFive.controls['marketing_reasons'].value\"\r\n          (eventSelect)=\"selectMarketingReasons($event)\"\r\n          [data]=\"marketingReasons\"\r\n          [defaultText]=\"'\u00BFC\u00F3mo se enter\u00F3 del programa?'\"\r\n        ></ipt-select>\r\n      </div>\r\n      <p-button\r\n      *ngIf=\"visbleReferred\"\r\n      styleClass=\"p-button-sm w-max\"\r\n      label=\"Cambiar Referido\"\r\n      icon=\"pi pi-sync\"\r\n      (onClick)=\"openModalReferred()\"\r\n    ></p-button>\r\n    </div>\r\n\r\n    <ipt-input\r\n      [inputType]=\"'text'\"\r\n      [placeHolder]=\"'Discapacidad'\"\r\n      [control]=\"codFormStepFive.controls['disability']\"\r\n    ></ipt-input>\r\n  </div>\r\n  <div class=\"col-12 md:col-6\">\r\n    <ipt-select\r\n      [control]=\"codFormStepFive.controls['study_reasons']\"\r\n      [initialValue]=\"codFormStepFive.controls['study_reasons'].value\"\r\n      (eventSelect)=\"selectStudyReasons($event)\"\r\n      [data]=\"studyReasons\"\r\n      [defaultText]=\"'Motivo'\"\r\n    ></ipt-select>\r\n    <ipt-input\r\n      [inputType]=\"'text'\"\r\n      [placeHolder]=\"'R\u00E9gimen de salud'\"\r\n      [control]=\"codFormStepFive.controls['health_regimen']\"\r\n    ></ipt-input>\r\n  </div>\r\n  <div class=\"col-12\">\r\n    <h3 *ngIf=\"visbleReferred\" class=\"referred_title\">Datos del referido</h3>\r\n    <div *ngIf=\"visbleReferred\" class=\"referred_user_data\">\r\n      <ipt-input\r\n        [inputType]=\"'text'\"\r\n        [placeHolder]=\"'Documento'\"\r\n        [control]=\"codFormStepFive.controls['document_refers']\"\r\n      ></ipt-input>\r\n      <ipt-input\r\n        [inputType]=\"'text'\"\r\n        [placeHolder]=\"'Nombres'\"\r\n        [control]=\"codFormStepFive.controls['name_refers']\"\r\n      ></ipt-input>\r\n      <ipt-input\r\n        [inputType]=\"'text'\"\r\n        [placeHolder]=\"'Tel\u00E9fono'\"\r\n        [control]=\"codFormStepFive.controls['phone_refers']\"\r\n      ></ipt-input>\r\n      <ipt-input\r\n        [inputType]=\"'text'\"\r\n        [placeHolder]=\"'Email'\"\r\n        [control]=\"codFormStepFive.controls['email_refers']\"\r\n      ></ipt-input>\r\n    </div>\r\n    <span class=\"p-float-label\">\r\n      <textarea\r\n        id=\"float-input\"\r\n        rows=\"4\"\r\n        cols=\"30\"\r\n        pInputTextarea\r\n        formControlName=\"observation\"\r\n      ></textarea>\r\n      <label for=\"float-input\">Observaciones</label>\r\n    </span>\r\n    <div class=\"flex flex-wrap justify-content-between gap-2\">\r\n      <div\r\n        *ngFor=\"let option of multiculturalities; index as i\"\r\n        class=\"field-checkbox mt-4 flex align-items-center\"\r\n      >\r\n        <mat-checkbox\r\n          [formControlName]=\"'multiculturalism' + '_' + (i + 1)\"\r\n          class=\"example-margin\"\r\n        ></mat-checkbox>\r\n        <label [for]=\"option.code\">{{ option.name }}</label>\r\n      </div>\r\n    </div>\r\n  </div>\r\n\r\n  <div class=\"col-12 p-4 font-bold\">\r\n    <p>\r\n      * El estudiante o titular se comprometen a cancelar las cuotas\r\n      establecidas en este contrato, los primeros 5 (cinco) d\u00EDas del mes. En\r\n      caso de querer retirarse, deber\u00E1 informar por escrito 30 (treinta) d\u00EDas\r\n      antes y cancelar lo correspondiente hasta la fecha definida de retiro,\r\n      para poder obtener su paz y salvo.\r\n    </p>\r\n    <br /><br />\r\n    <div class=\"flex gap-2\">\r\n      <mat-checkbox\r\n        formControlName=\"terms\"\r\n        class=\"example-margin\"\r\n      ></mat-checkbox>\r\n      <!-- <p-checkbox [formControl]=\"getCheckboxControl()\"></p-checkbox> -->\r\n      <!-- <ipt-checkbox [control]=\"codFormStepFive.controls['terms']\" [checkboxOption]=\"termsCheckboxStatus\"></ipt-checkbox> -->\r\n      <p>\r\n        DECLARO HABER LE\u00CDDO Y ACEPTO LOS T\u00C9RMINOS Y CONDICIONES DE LAS POL\u00CDTICAS\r\n        ESTABLECIDAS EN LA INSTITUCI\u00D3N.\r\n      </p>\r\n    </div>\r\n  </div>\r\n</form>\r\n\r\n<div class=\"flex mt-3 align-items-center gap-3\">\r\n  <span\r\n    *ngIf=\"\r\n      (codFormStepFive.invalid && codFormStepFive.touched) ||\r\n      (!termsCheckboxStatus && codFormStepFive.touched)\r\n    \"\r\n    class=\"\r\n      text-red-500\r\n      font-bold\r\n      text-center\r\n      mt-1\r\n      py-2\r\n      bg-red-100\r\n      w-full\r\n      border-round-xl\r\n    \"\r\n    >{{ errorMessage }}</span\r\n  >\r\n  <button\r\n  type=\"submit\"\r\n  [class]=\"isEditCod ? 'ml-auto yellow-300 p-button-sm' : 'ml-auto p-button-success p-button-sm'\"\r\n  (click)=\"sendForm()\"\r\n  pButton\r\n  [label]=\"sendFormMsg\"\r\n  icon=\"pi pi-check\"\r\n></button>\r\n</div>\r\n", styles: [":host ::ng-deep .p-button.p-button-sm{padding:.4rem!important}.yellow-300{background-color:var(--yellow-500)!important;color:#fff}@media screen and (min-width: 320px){.referred_user_data{display:grid;grid-template-columns:1fr 1fr 1fr 1fr;gap:.8rem;margin-bottom:2rem;border:1px solid #ced4da;border-radius:3px;padding:.5rem}.referred_title{font-size:.8rem;font-weight:400;padding-left:1rem;color:#6c757d}.containe_select1{width:100%}}@media screen and (min-width: 768px){.referred_user_data{grid-template-columns:1fr 1fr}}\n"] }]
+            args: [{ selector: 'app-cod-form-step-five', template: "<form autocomplete=\"off\" [formGroup]=\"codFormStepFive\" class=\"grid\">\n  <div class=\"col-12 md:col-6\">\n    <cod-modal-referred\n    *ngIf=\"modalVisible\"\n    [visibility]=\"modalVisible\"\n    (userSelect)=\"referredUser($event)\"\n    ></cod-modal-referred>\n\n    <div class=\"container_referred flex flex-row justify-content-between align-items-end\">\n      <div class=\"containe_select1\">\n        <ipt-select\n          [control]=\"codFormStepFive.controls['marketing_reasons']\"\n          [initialValue]=\"codFormStepFive.controls['marketing_reasons'].value\"\n          (eventSelect)=\"selectMarketingReasons($event)\"\n          [data]=\"marketingReasons\"\n          [defaultText]=\"'\u00BFC\u00F3mo se enter\u00F3 del programa?'\"\n        ></ipt-select>\n      </div>\n      <p-button\n      *ngIf=\"visbleReferred\"\n      styleClass=\"p-button-sm w-max\"\n      label=\"Cambiar Referido\"\n      icon=\"pi pi-sync\"\n      (onClick)=\"openModalReferred()\"\n    ></p-button>\n    </div>\n\n    <ipt-input\n      [inputType]=\"'text'\"\n      [placeHolder]=\"'Discapacidad'\"\n      [control]=\"codFormStepFive.controls['disability']\"\n    ></ipt-input>\n  </div>\n  <div class=\"col-12 md:col-6\">\n    <ipt-select\n      [control]=\"codFormStepFive.controls['study_reasons']\"\n      [initialValue]=\"codFormStepFive.controls['study_reasons'].value\"\n      (eventSelect)=\"selectStudyReasons($event)\"\n      [data]=\"studyReasons\"\n      [defaultText]=\"'Motivo'\"\n    ></ipt-select>\n    <ipt-input\n      [inputType]=\"'text'\"\n      [placeHolder]=\"'R\u00E9gimen de salud'\"\n      [control]=\"codFormStepFive.controls['health_regimen']\"\n    ></ipt-input>\n  </div>\n  <div class=\"col-12\">\n    <h3 *ngIf=\"visbleReferred\" class=\"referred_title\">Datos del referido</h3>\n    <div *ngIf=\"visbleReferred\" class=\"referred_user_data\">\n      <ipt-input\n        [inputType]=\"'text'\"\n        [placeHolder]=\"'Documento'\"\n        [control]=\"codFormStepFive.controls['document_refers']\"\n      ></ipt-input>\n      <ipt-input\n        [inputType]=\"'text'\"\n        [placeHolder]=\"'Nombres'\"\n        [control]=\"codFormStepFive.controls['name_refers']\"\n      ></ipt-input>\n      <ipt-input\n        [inputType]=\"'text'\"\n        [placeHolder]=\"'Tel\u00E9fono'\"\n        [control]=\"codFormStepFive.controls['phone_refers']\"\n      ></ipt-input>\n      <ipt-input\n        [inputType]=\"'text'\"\n        [placeHolder]=\"'Email'\"\n        [control]=\"codFormStepFive.controls['email_refers']\"\n      ></ipt-input>\n    </div>\n    <span class=\"p-float-label\">\n      <textarea\n        id=\"float-input\"\n        rows=\"4\"\n        cols=\"30\"\n        pInputTextarea\n        formControlName=\"observation\"\n      ></textarea>\n      <label for=\"float-input\">Observaciones</label>\n    </span>\n    <div class=\"flex flex-wrap justify-content-between gap-2\">\n      <div\n        *ngFor=\"let option of multiculturalities; index as i\"\n        class=\"field-checkbox mt-4 flex align-items-center\"\n      >\n        <mat-checkbox\n          [formControlName]=\"'multiculturalism' + '_' + (i + 1)\"\n          class=\"example-margin\"\n        ></mat-checkbox>\n        <label [for]=\"option.code\">{{ option.name }}</label>\n      </div>\n    </div>\n  </div>\n\n  <div class=\"col-12 p-4 font-bold\">\n    <p>\n      * El estudiante o titular se comprometen a cancelar las cuotas\n      establecidas en este contrato, los primeros 5 (cinco) d\u00EDas del mes. En\n      caso de querer retirarse, deber\u00E1 informar por escrito 30 (treinta) d\u00EDas\n      antes y cancelar lo correspondiente hasta la fecha definida de retiro,\n      para poder obtener su paz y salvo.\n    </p>\n    <br /><br />\n    <div class=\"flex gap-2\">\n      <mat-checkbox\n        formControlName=\"terms\"\n        class=\"example-margin\"\n      ></mat-checkbox>\n      <!-- <p-checkbox [formControl]=\"getCheckboxControl()\"></p-checkbox> -->\n      <!-- <ipt-checkbox [control]=\"codFormStepFive.controls['terms']\" [checkboxOption]=\"termsCheckboxStatus\"></ipt-checkbox> -->\n      <p>\n        DECLARO HABER LE\u00CDDO Y ACEPTO LOS T\u00C9RMINOS Y CONDICIONES DE LAS POL\u00CDTICAS\n        ESTABLECIDAS EN LA INSTITUCI\u00D3N.\n      </p>\n    </div>\n  </div>\n</form>\n\n<div class=\"flex mt-3 align-items-center gap-3\">\n  <span\n    *ngIf=\"\n      (codFormStepFive.invalid && codFormStepFive.touched) ||\n      (!termsCheckboxStatus && codFormStepFive.touched)\n    \"\n    class=\"\n      text-red-500\n      font-bold\n      text-center\n      mt-1\n      py-2\n      bg-red-100\n      w-full\n      border-round-xl\n    \"\n    >{{ errorMessage }}</span\n  >\n  <button\n  type=\"submit\"\n  [class]=\"isEditCod ? 'ml-auto yellow-300 p-button-sm' : 'ml-auto p-button-success p-button-sm'\"\n  (click)=\"sendForm()\"\n  pButton\n  [label]=\"sendFormMsg\"\n  icon=\"pi pi-check\"\n></button>\n</div>\n", styles: [":host ::ng-deep .p-button.p-button-sm{padding:.4rem!important}.yellow-300{background-color:var(--yellow-500)!important;color:#fff}@media screen and (min-width: 320px){.referred_user_data{display:grid;grid-template-columns:1fr 1fr 1fr 1fr;gap:.8rem;margin-bottom:2rem;border:1px solid #ced4da;border-radius:3px;padding:.5rem}.referred_title{font-size:.8rem;font-weight:400;padding-left:1rem;color:#6c757d}.containe_select1{width:100%}}@media screen and (min-width: 768px){.referred_user_data{grid-template-columns:1fr 1fr}}\n"] }]
         }], ctorParameters: function () { return [{ type: i1$1.FormBuilder }, { type: ParameterService }]; }, propDecorators: { userRole: [{
                 type: Input
             }], initialData: [{
@@ -5336,9 +5336,9 @@ class CodFormComponent {
                     this.okCreatedCOD.emit(true);
                 }
                 else if (response.message.code === 3) {
-                    let alertHtml = `
-          <div class="my-custom-alert">
-              <h2>Warning!</h2>
+                    let alertHtml = `
+          <div class="my-custom-alert">
+              <h2>Warning!</h2>
           `;
                     if (!response.data.warning.average_score) {
                         alertHtml += `<p>No pasó el promedio final</p><br>`;
@@ -5523,10 +5523,10 @@ class CodFormComponent {
     }
 }
 CodFormComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.0.7", ngImport: i0, type: CodFormComponent, deps: [{ token: BaseService }, { token: LocalStorageCODService }, { token: CodFormControls }, { token: CommercialService }], target: i0.ɵɵFactoryTarget.Component });
-CodFormComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.0.7", type: CodFormComponent, selector: "ipt-cod-form", inputs: { dataFromPreviusCodData: "dataFromPreviusCodData", courseSelect: "courseSelect", isNewCod: "isNewCod", editCod: "editCod", CourseSelectRenovation: "CourseSelectRenovation", isRenovation: "isRenovation" }, outputs: { okCreatedCOD: "okCreatedCOD" }, usesOnChanges: true, ngImport: i0, template: "<div *ngIf=\"allowedRole() ; else Unauthorized\" class=\"container flex flex-column bg-white border-round-2xl p-3 container animate__animated animate__fadeInUp\">\r\n\r\n  <span *ngIf=\"editCod\" class=\"bg-yellow-500 p-2 border-round mb-2 w-auto text-lg font-semibold\" style=\"color: white;\">{{ formTitle }}</span>\r\n  <span *ngIf=\"!editCod && !dataFromPreviusCodData?.cod_renovation\" class=\"bg-primary p-2 border-round mb-2 w-auto text-lg font-semibold\">{{ formTitle }}</span>\r\n  <span *ngIf=\"!editCod && dataFromPreviusCodData?.cod_renovation == true\" class=\"p-2 border-round mb-2 w-auto text-lg font-semibold\" style=\"background-color:#1da750; color: white;\">{{ formTitle }}</span>\r\n\r\n  <p-tabView [activeIndex]=\"currentStep\" (activeIndexChange)=\"currentStep = $event\" [scrollable]=\"true\">\r\n    <p-tabPanel leftIcon=\"pi pi-star\" header=\"1. Planes y convenios\">\r\n      <app-cod-form-step-one (changeStepEvent)=\"changeStep($event)\" [initialData]=\"courseSelect\" [dataPreviusCodData]=\"dataFromPreviusCodData\" [isEditCod]=\"editCod\" [courseSelectRenovation]=\"CourseSelectRenovation\" [isRenovation]=\"isRenovation\" class=\"p-1\"></app-cod-form-step-one>\r\n    </p-tabPanel>\r\n    <p-tabPanel leftIcon=\"pi pi-id-card\" header=\"2. Datos del estudiante\">\r\n      <app-cod-form-step-two (changeStepEvent)=\"changeStep($event)\" [initialData]=\"dataFromPreviusCodData\" [isEditCod]=\"editCod\" class=\"p-1\"></app-cod-form-step-two>\r\n    </p-tabPanel>\r\n    <p-tabPanel leftIcon=\"pi pi-user-edit\" header=\"3. Datos del acudiente\">\r\n      <app-cod-form-step-three  (changeStepEvent)=\"changeStep($event)\" [initialData]=\"dataFromPreviusCodData\" [isEditCod]=\"editCod\" class=\"p-1\"></app-cod-form-step-three>\r\n    </p-tabPanel>\r\n    <p-tabPanel leftIcon=\"pi pi-money-bill\" header=\"4. Valores\">\r\n      <app-cod-form-step-four (changeStepEvent)=\"changeStep($event)\" (financingData)=\"saveFinancingData($event)\" [initialData]=\"dataFromPreviusCodData\" [isEditCod]=\"editCod\" class=\"p-1\"></app-cod-form-step-four>\r\n    </p-tabPanel>\r\n    <p-tabPanel leftIcon=\"pi pi-eye\" header=\"5. Observaciones\">\r\n      <app-cod-form-step-five (changeStepEvent)=\"changeStep($event)\" [userRole]=\"userRole\" [initialData]=\"dataFromPreviusCodData\" (action)=\"getFormAction($event)\" [isEditCod]=\"editCod\" [isRenovation]=\"isRenovation\" class=\"p-1\"></app-cod-form-step-five>\r\n    </p-tabPanel>\r\n  </p-tabView>\r\n\r\n</div>\r\n\r\n<ng-template #Unauthorized>\r\n  <span class=\"flex justify-content-center font-bold p-2 bg-yellow-200 border-round-lg w-full\">\r\n    No tienes los permisos para acceder a esta funcionalidad, comun\u00EDcate con el desarrollador.\r\n  </span>\r\n</ng-template>\r\n\r\n\r\n<ipt-loader *ngIf=\"isLoading\" [isDialog]=\"true\" [message]=\"loaderMessage\"></ipt-loader>\r\n", dependencies: [{ kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: i6$2.TabView, selector: "p-tabView", inputs: ["orientation", "style", "styleClass", "controlClose", "scrollable", "activeIndex"], outputs: ["onChange", "onClose", "activeIndexChange"] }, { kind: "component", type: i6$2.TabPanel, selector: "p-tabPanel", inputs: ["closable", "headerStyle", "headerStyleClass", "cache", "tooltip", "tooltipPosition", "tooltipPositionStyle", "tooltipStyleClass", "selected", "disabled", "header", "leftIcon", "rightIcon"] }, { kind: "component", type: LoaderComponent, selector: "ipt-loader", inputs: ["message", "isDialog"] }, { kind: "component", type: CodFormStepOneComponent, selector: "app-cod-form-step-one", inputs: ["initialData", "dataPreviusCodData", "isEditCod", "courseSelectRenovation", "isRenovation"], outputs: ["changeStepEvent"] }, { kind: "component", type: CodFormStepTwoComponent, selector: "app-cod-form-step-two", inputs: ["initialData", "isEditCod"], outputs: ["changeStepEvent"] }, { kind: "component", type: CodFormStepThreeComponent, selector: "app-cod-form-step-three", inputs: ["initialData", "isEditCod"], outputs: ["changeStepEvent"] }, { kind: "component", type: CodFormStepFourComponent, selector: "app-cod-form-step-four", inputs: ["isEditCod", "initialData"], outputs: ["changeStepEvent", "financingData"] }, { kind: "component", type: CodFormStepFiveComponent, selector: "app-cod-form-step-five", inputs: ["userRole", "initialData", "isEditCod", "isRenovation"], outputs: ["changeStepEvent", "action"] }] });
+CodFormComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.0.7", type: CodFormComponent, selector: "ipt-cod-form", inputs: { dataFromPreviusCodData: "dataFromPreviusCodData", courseSelect: "courseSelect", isNewCod: "isNewCod", editCod: "editCod", CourseSelectRenovation: "CourseSelectRenovation", isRenovation: "isRenovation" }, outputs: { okCreatedCOD: "okCreatedCOD" }, usesOnChanges: true, ngImport: i0, template: "<div *ngIf=\"allowedRole() ; else Unauthorized\" class=\"container flex flex-column bg-white border-round-2xl p-3 container animate__animated animate__fadeInUp\">\n\n  <span *ngIf=\"editCod\" class=\"bg-yellow-500 p-2 border-round mb-2 w-auto text-lg font-semibold\" style=\"color: white;\">{{ formTitle }}</span>\n  <span *ngIf=\"!editCod && !dataFromPreviusCodData?.cod_renovation\" class=\"bg-primary p-2 border-round mb-2 w-auto text-lg font-semibold\">{{ formTitle }}</span>\n  <span *ngIf=\"!editCod && dataFromPreviusCodData?.cod_renovation == true\" class=\"p-2 border-round mb-2 w-auto text-lg font-semibold\" style=\"background-color:#1da750; color: white;\">{{ formTitle }}</span>\n\n  <p-tabView [activeIndex]=\"currentStep\" (activeIndexChange)=\"currentStep = $event\" [scrollable]=\"true\">\n    <p-tabPanel leftIcon=\"pi pi-star\" header=\"1. Planes y convenios\">\n      <app-cod-form-step-one (changeStepEvent)=\"changeStep($event)\" [initialData]=\"courseSelect\" [dataPreviusCodData]=\"dataFromPreviusCodData\" [isEditCod]=\"editCod\" [courseSelectRenovation]=\"CourseSelectRenovation\" [isRenovation]=\"isRenovation\" class=\"p-1\"></app-cod-form-step-one>\n    </p-tabPanel>\n    <p-tabPanel leftIcon=\"pi pi-id-card\" header=\"2. Datos del estudiante\">\n      <app-cod-form-step-two (changeStepEvent)=\"changeStep($event)\" [initialData]=\"dataFromPreviusCodData\" [isEditCod]=\"editCod\" class=\"p-1\"></app-cod-form-step-two>\n    </p-tabPanel>\n    <p-tabPanel leftIcon=\"pi pi-user-edit\" header=\"3. Datos del acudiente\">\n      <app-cod-form-step-three  (changeStepEvent)=\"changeStep($event)\" [initialData]=\"dataFromPreviusCodData\" [isEditCod]=\"editCod\" class=\"p-1\"></app-cod-form-step-three>\n    </p-tabPanel>\n    <p-tabPanel leftIcon=\"pi pi-money-bill\" header=\"4. Valores\">\n      <app-cod-form-step-four (changeStepEvent)=\"changeStep($event)\" (financingData)=\"saveFinancingData($event)\" [initialData]=\"dataFromPreviusCodData\" [isEditCod]=\"editCod\" class=\"p-1\"></app-cod-form-step-four>\n    </p-tabPanel>\n    <p-tabPanel leftIcon=\"pi pi-eye\" header=\"5. Observaciones\">\n      <app-cod-form-step-five (changeStepEvent)=\"changeStep($event)\" [userRole]=\"userRole\" [initialData]=\"dataFromPreviusCodData\" (action)=\"getFormAction($event)\" [isEditCod]=\"editCod\" [isRenovation]=\"isRenovation\" class=\"p-1\"></app-cod-form-step-five>\n    </p-tabPanel>\n  </p-tabView>\n\n</div>\n\n<ng-template #Unauthorized>\n  <span class=\"flex justify-content-center font-bold p-2 bg-yellow-200 border-round-lg w-full\">\n    No tienes los permisos para acceder a esta funcionalidad, comun\u00EDcate con el desarrollador.\n  </span>\n</ng-template>\n\n\n<ipt-loader *ngIf=\"isLoading\" [isDialog]=\"true\" [message]=\"loaderMessage\"></ipt-loader>\n", dependencies: [{ kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: i6$2.TabView, selector: "p-tabView", inputs: ["orientation", "style", "styleClass", "controlClose", "scrollable", "activeIndex"], outputs: ["onChange", "onClose", "activeIndexChange"] }, { kind: "component", type: i6$2.TabPanel, selector: "p-tabPanel", inputs: ["closable", "headerStyle", "headerStyleClass", "cache", "tooltip", "tooltipPosition", "tooltipPositionStyle", "tooltipStyleClass", "selected", "disabled", "header", "leftIcon", "rightIcon"] }, { kind: "component", type: LoaderComponent, selector: "ipt-loader", inputs: ["message", "isDialog"] }, { kind: "component", type: CodFormStepOneComponent, selector: "app-cod-form-step-one", inputs: ["initialData", "dataPreviusCodData", "isEditCod", "courseSelectRenovation", "isRenovation"], outputs: ["changeStepEvent"] }, { kind: "component", type: CodFormStepTwoComponent, selector: "app-cod-form-step-two", inputs: ["initialData", "isEditCod"], outputs: ["changeStepEvent"] }, { kind: "component", type: CodFormStepThreeComponent, selector: "app-cod-form-step-three", inputs: ["initialData", "isEditCod"], outputs: ["changeStepEvent"] }, { kind: "component", type: CodFormStepFourComponent, selector: "app-cod-form-step-four", inputs: ["isEditCod", "initialData"], outputs: ["changeStepEvent", "financingData"] }, { kind: "component", type: CodFormStepFiveComponent, selector: "app-cod-form-step-five", inputs: ["userRole", "initialData", "isEditCod", "isRenovation"], outputs: ["changeStepEvent", "action"] }] });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.0.7", ngImport: i0, type: CodFormComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'ipt-cod-form', template: "<div *ngIf=\"allowedRole() ; else Unauthorized\" class=\"container flex flex-column bg-white border-round-2xl p-3 container animate__animated animate__fadeInUp\">\r\n\r\n  <span *ngIf=\"editCod\" class=\"bg-yellow-500 p-2 border-round mb-2 w-auto text-lg font-semibold\" style=\"color: white;\">{{ formTitle }}</span>\r\n  <span *ngIf=\"!editCod && !dataFromPreviusCodData?.cod_renovation\" class=\"bg-primary p-2 border-round mb-2 w-auto text-lg font-semibold\">{{ formTitle }}</span>\r\n  <span *ngIf=\"!editCod && dataFromPreviusCodData?.cod_renovation == true\" class=\"p-2 border-round mb-2 w-auto text-lg font-semibold\" style=\"background-color:#1da750; color: white;\">{{ formTitle }}</span>\r\n\r\n  <p-tabView [activeIndex]=\"currentStep\" (activeIndexChange)=\"currentStep = $event\" [scrollable]=\"true\">\r\n    <p-tabPanel leftIcon=\"pi pi-star\" header=\"1. Planes y convenios\">\r\n      <app-cod-form-step-one (changeStepEvent)=\"changeStep($event)\" [initialData]=\"courseSelect\" [dataPreviusCodData]=\"dataFromPreviusCodData\" [isEditCod]=\"editCod\" [courseSelectRenovation]=\"CourseSelectRenovation\" [isRenovation]=\"isRenovation\" class=\"p-1\"></app-cod-form-step-one>\r\n    </p-tabPanel>\r\n    <p-tabPanel leftIcon=\"pi pi-id-card\" header=\"2. Datos del estudiante\">\r\n      <app-cod-form-step-two (changeStepEvent)=\"changeStep($event)\" [initialData]=\"dataFromPreviusCodData\" [isEditCod]=\"editCod\" class=\"p-1\"></app-cod-form-step-two>\r\n    </p-tabPanel>\r\n    <p-tabPanel leftIcon=\"pi pi-user-edit\" header=\"3. Datos del acudiente\">\r\n      <app-cod-form-step-three  (changeStepEvent)=\"changeStep($event)\" [initialData]=\"dataFromPreviusCodData\" [isEditCod]=\"editCod\" class=\"p-1\"></app-cod-form-step-three>\r\n    </p-tabPanel>\r\n    <p-tabPanel leftIcon=\"pi pi-money-bill\" header=\"4. Valores\">\r\n      <app-cod-form-step-four (changeStepEvent)=\"changeStep($event)\" (financingData)=\"saveFinancingData($event)\" [initialData]=\"dataFromPreviusCodData\" [isEditCod]=\"editCod\" class=\"p-1\"></app-cod-form-step-four>\r\n    </p-tabPanel>\r\n    <p-tabPanel leftIcon=\"pi pi-eye\" header=\"5. Observaciones\">\r\n      <app-cod-form-step-five (changeStepEvent)=\"changeStep($event)\" [userRole]=\"userRole\" [initialData]=\"dataFromPreviusCodData\" (action)=\"getFormAction($event)\" [isEditCod]=\"editCod\" [isRenovation]=\"isRenovation\" class=\"p-1\"></app-cod-form-step-five>\r\n    </p-tabPanel>\r\n  </p-tabView>\r\n\r\n</div>\r\n\r\n<ng-template #Unauthorized>\r\n  <span class=\"flex justify-content-center font-bold p-2 bg-yellow-200 border-round-lg w-full\">\r\n    No tienes los permisos para acceder a esta funcionalidad, comun\u00EDcate con el desarrollador.\r\n  </span>\r\n</ng-template>\r\n\r\n\r\n<ipt-loader *ngIf=\"isLoading\" [isDialog]=\"true\" [message]=\"loaderMessage\"></ipt-loader>\r\n" }]
+            args: [{ selector: 'ipt-cod-form', template: "<div *ngIf=\"allowedRole() ; else Unauthorized\" class=\"container flex flex-column bg-white border-round-2xl p-3 container animate__animated animate__fadeInUp\">\n\n  <span *ngIf=\"editCod\" class=\"bg-yellow-500 p-2 border-round mb-2 w-auto text-lg font-semibold\" style=\"color: white;\">{{ formTitle }}</span>\n  <span *ngIf=\"!editCod && !dataFromPreviusCodData?.cod_renovation\" class=\"bg-primary p-2 border-round mb-2 w-auto text-lg font-semibold\">{{ formTitle }}</span>\n  <span *ngIf=\"!editCod && dataFromPreviusCodData?.cod_renovation == true\" class=\"p-2 border-round mb-2 w-auto text-lg font-semibold\" style=\"background-color:#1da750; color: white;\">{{ formTitle }}</span>\n\n  <p-tabView [activeIndex]=\"currentStep\" (activeIndexChange)=\"currentStep = $event\" [scrollable]=\"true\">\n    <p-tabPanel leftIcon=\"pi pi-star\" header=\"1. Planes y convenios\">\n      <app-cod-form-step-one (changeStepEvent)=\"changeStep($event)\" [initialData]=\"courseSelect\" [dataPreviusCodData]=\"dataFromPreviusCodData\" [isEditCod]=\"editCod\" [courseSelectRenovation]=\"CourseSelectRenovation\" [isRenovation]=\"isRenovation\" class=\"p-1\"></app-cod-form-step-one>\n    </p-tabPanel>\n    <p-tabPanel leftIcon=\"pi pi-id-card\" header=\"2. Datos del estudiante\">\n      <app-cod-form-step-two (changeStepEvent)=\"changeStep($event)\" [initialData]=\"dataFromPreviusCodData\" [isEditCod]=\"editCod\" class=\"p-1\"></app-cod-form-step-two>\n    </p-tabPanel>\n    <p-tabPanel leftIcon=\"pi pi-user-edit\" header=\"3. Datos del acudiente\">\n      <app-cod-form-step-three  (changeStepEvent)=\"changeStep($event)\" [initialData]=\"dataFromPreviusCodData\" [isEditCod]=\"editCod\" class=\"p-1\"></app-cod-form-step-three>\n    </p-tabPanel>\n    <p-tabPanel leftIcon=\"pi pi-money-bill\" header=\"4. Valores\">\n      <app-cod-form-step-four (changeStepEvent)=\"changeStep($event)\" (financingData)=\"saveFinancingData($event)\" [initialData]=\"dataFromPreviusCodData\" [isEditCod]=\"editCod\" class=\"p-1\"></app-cod-form-step-four>\n    </p-tabPanel>\n    <p-tabPanel leftIcon=\"pi pi-eye\" header=\"5. Observaciones\">\n      <app-cod-form-step-five (changeStepEvent)=\"changeStep($event)\" [userRole]=\"userRole\" [initialData]=\"dataFromPreviusCodData\" (action)=\"getFormAction($event)\" [isEditCod]=\"editCod\" [isRenovation]=\"isRenovation\" class=\"p-1\"></app-cod-form-step-five>\n    </p-tabPanel>\n  </p-tabView>\n\n</div>\n\n<ng-template #Unauthorized>\n  <span class=\"flex justify-content-center font-bold p-2 bg-yellow-200 border-round-lg w-full\">\n    No tienes los permisos para acceder a esta funcionalidad, comun\u00EDcate con el desarrollador.\n  </span>\n</ng-template>\n\n\n<ipt-loader *ngIf=\"isLoading\" [isDialog]=\"true\" [message]=\"loaderMessage\"></ipt-loader>\n" }]
         }], ctorParameters: function () { return [{ type: BaseService }, { type: LocalStorageCODService }, { type: CodFormControls }, { type: CommercialService }]; }, propDecorators: { dataFromPreviusCodData: [{
                 type: Input
             }], courseSelect: [{
@@ -7150,10 +7150,10 @@ class CodSelfFormStepOneComponent extends CodSelfManagedSteps {
     }
 }
 CodSelfFormStepOneComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.0.7", ngImport: i0, type: CodSelfFormStepOneComponent, deps: [{ token: i1$1.FormBuilder }, { token: ParameterService }, { token: i2$1.MessageService }, { token: UserService }, { token: BaseService }], target: i0.ɵɵFactoryTarget.Component });
-CodSelfFormStepOneComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.0.7", type: CodSelfFormStepOneComponent, selector: "app-cod-self-form-step-one", inputs: { userStudent: "userStudent" }, outputs: { completed: "completed", idTypesChanged: "idTypesChanged" }, usesInheritance: true, usesOnChanges: true, ngImport: i0, template: "<div class=\"container-main\">\r\n  <div class=\"container-form\">\r\n      <!-- <i class=\"pi pi-user-edit icon__tittle\"></i> -->\r\n      <h2>Datos Personales</h2>\r\n    <p-toast position=\"top-center\" key=\"confirm\" (onClose)=\"onReject()\" [baseZIndex]=\"10\">\r\n      <ng-template let-message pTemplate=\"message\">\r\n          <div class=\"flex flex-column align-items-start\" style=\"flex: 1\">\r\n              <div class=\"flex align-items-center gap-2\">\r\n                  <img src=\"./assets/logos/reading.png\" style=\"width: 65px;\" shape=\"circle\" />\r\n                  <span class=\"font-bold text-900\">Jacob</span>\r\n              </div>\r\n              <div class=\"font-medium text-lg my-3 text-900\">{{ messageInfo }}</div>\r\n          </div>\r\n      </ng-template>\r\n  </p-toast>\r\n\r\n    <i class=\"pi pi-exclamation-circle cursor-pointer w-auto\" (click)=\"showConfirm()\" pTooltip=\"Mas info.\" tooltipPosition=\"bottom\"></i>\r\n    <form [formGroup]=\"codSelfFormStepOne\">\r\n\r\n      <ipt-input\r\n        [inputType]=\"'text'\"\r\n        [placeHolder]=\"'Nombres'\"\r\n        [control]=\"codSelfFormStepOne.controls['student_name']\"\r\n      ></ipt-input>\r\n      <div *ngIf=\"codSelfFormStepOne.controls['student_name'].invalid && codSelfFormStepOne.controls['student_name'].touched\">\r\n        <span class=\"error-message\">Por favor ingresa un nombre v\u00E1lido.</span>\r\n      </div>\r\n      <ipt-input\r\n        [inputType]=\"'text'\"\r\n        [placeHolder]=\"'Apellidos'\"\r\n        [control]=\"codSelfFormStepOne.controls['student_last_name']\"\r\n      ></ipt-input>\r\n      <div *ngIf=\"codSelfFormStepOne.controls['student_last_name'].invalid && codSelfFormStepOne.controls['student_last_name'].touched\">\r\n        <span class=\"error-message\">Por favor ingresa un apellido v\u00E1lido.</span>\r\n      </div>\r\n      <ipt-select\r\n        [initialValue]=\"codSelfFormStepOne.controls['student_id_card_type'].value\"\r\n        [control]=\"codSelfFormStepOne.controls['student_id_card_type']\"\r\n        [selectCode]=\"codSelfFormStepOne.controls['student_id_card_type'].value === null ? 'Tipo de documento' : codSelfFormStepOne.controls['student_id_card_type'].value\"\r\n        [isRequired]=\"true\"\r\n        [data]=\"idTypes\"\r\n        (eventSelect)=\"selectIdType($event)\"\r\n        [defaultText]=\"'Tipo de documento'\"\r\n      ></ipt-select>\r\n      <div *ngIf=\"codSelfFormStepOne.controls['student_id_card_type'].invalid && codSelfFormStepOne.controls['student_id_card_type'].touched\">\r\n        <span class=\"error-message\">Por favor ingresa un tipo de documento v\u00E1lido.</span>\r\n      </div>\r\n      <ipt-input\r\n        [inputType]=\"'number'\"\r\n        [placeHolder]=\"'N\u00FAmero de documento'\"\r\n        [control]=\"codSelfFormStepOne.controls['student_id_card']\"\r\n      ></ipt-input>\r\n      <div *ngIf=\"codSelfFormStepOne.controls['student_id_card'].invalid && codSelfFormStepOne.controls['student_id_card'].touched\">\r\n        <span class=\"error-message\">Por favor ingresa un documento v\u00E1lido.</span>\r\n      </div>\r\n      <ipt-select\r\n        [initialValue]=\"codSelfFormStepOne.controls['gender'].value\"\r\n        [control]=\"codSelfFormStepOne.controls['gender']\"\r\n        [data]=\"genders\"\r\n        (eventSelect)=\"selectGender($event)\"\r\n        [defaultText]=\"'G\u00E9nero'\"\r\n      ></ipt-select>\r\n      <div *ngIf=\"codSelfFormStepOne.controls['gender'].invalid && codSelfFormStepOne.controls['gender'].touched\">\r\n        <span class=\"error-message\">Por favor ingresa un genero v\u00E1lido.</span>\r\n      </div>\r\n      <ipt-input\r\n        onfocus=\"(this.type='date')\"\r\n        [inputType]=\"'date'\"\r\n        [control]=\"codSelfFormStepOne.controls['birthdate']\"\r\n        [placeHolder]=\"'Fecha de nacimiento'\"\r\n      ></ipt-input>\r\n      <div *ngIf=\"codSelfFormStepOne.controls['birthdate'].invalid && codSelfFormStepOne.controls['birthdate'].touched\">\r\n        <span class=\"error-message\">Por favor ingresa una fecha mayor de 3 a\u00F1os.</span>\r\n      </div>\r\n      <ipt-select\r\n        [initialValue]=\"codSelfFormStepOne.controls['country'].value\"\r\n        [control]=\"codSelfFormStepOne.controls['country']\"\r\n        [selectCode]=\"codSelfFormStepOne.controls['country'].value === null ? 'Pa\u00EDs de residencia' : codSelfFormStepOne.controls['country'].value\"\r\n        (eventSelect)=\"selectCountry($event)\"\r\n        [data]=\"countries\"\r\n        [defaultText]=\"'Pa\u00EDs de residencia'\"\r\n      ></ipt-select>\r\n      <div *ngIf=\"codSelfFormStepOne.controls['country'].invalid && codSelfFormStepOne.controls['country'].touched\">\r\n        <span class=\"error-message\">Por favor ingresa un pais v\u00E1lido.</span>\r\n      </div>\r\n      <ipt-select\r\n        [initialValue]=\"codSelfFormStepOne.controls['state'].value\"\r\n        [control]=\"codSelfFormStepOne.controls['state']\"\r\n        [selectCode]=\"codSelfFormStepOne.controls['state'].value === null ? 'Departamento o estado' : codSelfFormStepOne.controls['state'].value\"\r\n        [isRequired]=\"true\"\r\n        (eventSelect)=\"selectState($event)\"\r\n        [data]=\"states\"\r\n        [defaultText]=\"'Departamento o estado'\"\r\n      ></ipt-select>\r\n      <div *ngIf=\"codSelfFormStepOne.controls['state'].invalid && codSelfFormStepOne.controls['state'].touched\">\r\n        <span class=\"error-message\">Por favor ingresa un departamento v\u00E1lido.</span>\r\n      </div>\r\n      <ipt-select\r\n        [initialValue]=\"codSelfFormStepOne.controls['city'].value\"\r\n        [control]=\"codSelfFormStepOne.controls['city']\"\r\n        [selectCode]=\"codSelfFormStepOne.controls['city'].value === null ? 'Ciudad de residencia' : codSelfFormStepOne.controls['city'].value\"\r\n        (eventSelect)=\"selectCity($event)\"\r\n        [data]=\"cities\"\r\n        [defaultText]=\"'Ciudad de residencia'\"\r\n      ></ipt-select>\r\n      <div *ngIf=\"codSelfFormStepOne.controls['city'].invalid && codSelfFormStepOne.controls['city'].touched\">\r\n        <span class=\"error-message\">Por favor ingresa una ciudad v\u00E1lido.</span>\r\n      </div>\r\n      <ipt-input\r\n        [inputType]=\"'email'\"\r\n        [placeHolder]=\"'Correo electr\u00F3nico'\"\r\n        [control]=\"codSelfFormStepOne.controls['student_email']\"\r\n      ></ipt-input>\r\n      <div *ngIf=\"codSelfFormStepOne.controls['student_email'].invalid && codSelfFormStepOne.controls['student_email'].touched\">\r\n        <span class=\"error-message\">Por favor ingresa un email valido.</span>\r\n      </div>\r\n      <ipt-select\r\n        [initialValue]=\"codSelfFormStepOne.controls['student_phone_indicative'].value\"\r\n        [control]=\"codSelfFormStepOne.controls['student_phone_indicative']\"\r\n        [data]=\"indicatives\"\r\n        (eventSelect)=\"selectIndicatives($event)\"\r\n        [defaultText]=\"'Indicativo'\"\r\n      ></ipt-select>\r\n      <div *ngIf=\"codSelfFormStepOne.controls['student_phone_indicative'].invalid && codSelfFormStepOne.controls['student_phone_indicative'].touched\">\r\n        <span class=\"error-message\">Por favor ingresa un indicativo valido.</span>\r\n      </div>\r\n      <ipt-input\r\n        [inputType]=\"'number'\"\r\n        [placeHolder]=\"'N\u00FAmero de tel\u00E9fono'\"\r\n        [control]=\"codSelfFormStepOne.controls['student_phone_number']\"\r\n      ></ipt-input>\r\n      <div *ngIf=\"codSelfFormStepOne.controls['student_phone_number'].invalid && codSelfFormStepOne.controls['student_phone_number'].touched\">\r\n        <span class=\"error-message\">Por favor ingresa un indicativo valido.</span>\r\n      </div>\r\n      <ipt-select\r\n        [initialValue]=\"codSelfFormStepOne.controls['grade'].value\"\r\n        [control]=\"codSelfFormStepOne.controls['grade']\"\r\n        [data]=\"grades\"\r\n        (eventSelect)=\"selectGrade($event)\"\r\n        [defaultText]=\"'Grado Educativo'\"\r\n      ></ipt-select>\r\n      <div *ngIf=\"codSelfFormStepOne.controls['grade'].invalid && codSelfFormStepOne.controls['grade'].touched\">\r\n        <span class=\"error-message\">Por favor selecciona un grado educativo</span>\r\n      </div>\r\n      <ipt-select\r\n      *ngIf=\"showAgreementSelect\"\r\n      [initialValue]=\"codSelfFormStepOne.controls['agreement_by_category'].value\"\r\n      [control]=\"codSelfFormStepOne.controls['agreement_by_category']\"\r\n      [data]=\"agreements\"\r\n      (eventSelect)=\"selectAgreement($event)\"\r\n      [defaultText]=\"'Convenio'\"\r\n    ></ipt-select>\r\n    <div *ngIf=\"codSelfFormStepOne.controls['agreement_by_category'].invalid && codSelfFormStepOne.controls['agreement_by_category'].touched\">\r\n      <span class=\"error-message\">Por favor selecciona un convenio valido</span>\r\n    </div>\r\n    </form>\r\n\r\n    <div class=\"flex justify-content-end mt-3 align-items-center gap-3\">\r\n      <button\r\n        pButton\r\n        icon=\"pi pi-arrow-right\"\r\n        type=\"submit\"\r\n        [disabled]=\"!codSelfFormStepOne.valid\"\r\n        (click)=\"sendForm()\"\r\n      ></button>\r\n    </div>\r\n  </div>\r\n\r\n</div>\r\n", styles: [".container-form{margin:5%;border-radius:3px;border:1px solid #2563eb;box-shadow:#3c40434d 0 1px 2px,#3c404326 0 2px 6px 2px;padding:1rem}.error-message{font-size:x-small;color:red}:host ::ng-deep .p-toast{width:20rem!important}.icon__tittle{color:#2563eb}\n"], dependencies: [{ kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: InputComponent, selector: "ipt-input", inputs: ["inputType", "placeHolder", "validateText", "withPipe", "list", "iconUrl", "control", "prefix", "thousands", "decimal", "disabledSel"], outputs: ["dateSelected"] }, { kind: "component", type: SelectComponent, selector: "ipt-select", inputs: ["isRequired", "data", "defaultText", "selectCode", "disabledSel", "initialValue", "control"], outputs: ["eventSelect"] }, { kind: "directive", type: i1$1.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i1$1.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i1$1.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i9.Tooltip, selector: "[pTooltip]", inputs: ["tooltipPosition", "tooltipEvent", "appendTo", "positionStyle", "tooltipStyleClass", "tooltipZIndex", "escape", "showDelay", "hideDelay", "life", "positionTop", "positionLeft", "fitContent", "pTooltip", "tooltipDisabled", "tooltipOptions"] }, { kind: "directive", type: i7$1.ButtonDirective, selector: "[pButton]", inputs: ["iconPos", "loadingIcon", "label", "icon", "loading"] }, { kind: "component", type: i11.Toast, selector: "p-toast", inputs: ["key", "autoZIndex", "baseZIndex", "style", "styleClass", "position", "preventOpenDuplicates", "preventDuplicates", "showTransformOptions", "hideTransformOptions", "showTransitionOptions", "hideTransitionOptions", "breakpoints"], outputs: ["onClose"] }, { kind: "directive", type: i2$1.PrimeTemplate, selector: "[pTemplate]", inputs: ["type", "pTemplate"] }] });
+CodSelfFormStepOneComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.0.7", type: CodSelfFormStepOneComponent, selector: "app-cod-self-form-step-one", inputs: { userStudent: "userStudent" }, outputs: { completed: "completed", idTypesChanged: "idTypesChanged" }, usesInheritance: true, usesOnChanges: true, ngImport: i0, template: "<div class=\"container-main\">\n  <div class=\"container-form\">\n      <!-- <i class=\"pi pi-user-edit icon__tittle\"></i> -->\n      <h2>Datos Personales</h2>\n    <p-toast position=\"top-center\" key=\"confirm\" (onClose)=\"onReject()\" [baseZIndex]=\"10\">\n      <ng-template let-message pTemplate=\"message\">\n          <div class=\"flex flex-column align-items-start\" style=\"flex: 1\">\n              <div class=\"flex align-items-center gap-2\">\n                  <img src=\"./assets/logos/reading.png\" style=\"width: 65px;\" shape=\"circle\" />\n                  <span class=\"font-bold text-900\">Jacob</span>\n              </div>\n              <div class=\"font-medium text-lg my-3 text-900\">{{ messageInfo }}</div>\n          </div>\n      </ng-template>\n  </p-toast>\n\n    <i class=\"pi pi-exclamation-circle cursor-pointer w-auto\" (click)=\"showConfirm()\" pTooltip=\"Mas info.\" tooltipPosition=\"bottom\"></i>\n    <form [formGroup]=\"codSelfFormStepOne\">\n\n      <ipt-input\n        [inputType]=\"'text'\"\n        [placeHolder]=\"'Nombres'\"\n        [control]=\"codSelfFormStepOne.controls['student_name']\"\n      ></ipt-input>\n      <div *ngIf=\"codSelfFormStepOne.controls['student_name'].invalid && codSelfFormStepOne.controls['student_name'].touched\">\n        <span class=\"error-message\">Por favor ingresa un nombre v\u00E1lido.</span>\n      </div>\n      <ipt-input\n        [inputType]=\"'text'\"\n        [placeHolder]=\"'Apellidos'\"\n        [control]=\"codSelfFormStepOne.controls['student_last_name']\"\n      ></ipt-input>\n      <div *ngIf=\"codSelfFormStepOne.controls['student_last_name'].invalid && codSelfFormStepOne.controls['student_last_name'].touched\">\n        <span class=\"error-message\">Por favor ingresa un apellido v\u00E1lido.</span>\n      </div>\n      <ipt-select\n        [initialValue]=\"codSelfFormStepOne.controls['student_id_card_type'].value\"\n        [control]=\"codSelfFormStepOne.controls['student_id_card_type']\"\n        [selectCode]=\"codSelfFormStepOne.controls['student_id_card_type'].value === null ? 'Tipo de documento' : codSelfFormStepOne.controls['student_id_card_type'].value\"\n        [isRequired]=\"true\"\n        [data]=\"idTypes\"\n        (eventSelect)=\"selectIdType($event)\"\n        [defaultText]=\"'Tipo de documento'\"\n      ></ipt-select>\n      <div *ngIf=\"codSelfFormStepOne.controls['student_id_card_type'].invalid && codSelfFormStepOne.controls['student_id_card_type'].touched\">\n        <span class=\"error-message\">Por favor ingresa un tipo de documento v\u00E1lido.</span>\n      </div>\n      <ipt-input\n        [inputType]=\"'number'\"\n        [placeHolder]=\"'N\u00FAmero de documento'\"\n        [control]=\"codSelfFormStepOne.controls['student_id_card']\"\n      ></ipt-input>\n      <div *ngIf=\"codSelfFormStepOne.controls['student_id_card'].invalid && codSelfFormStepOne.controls['student_id_card'].touched\">\n        <span class=\"error-message\">Por favor ingresa un documento v\u00E1lido.</span>\n      </div>\n      <ipt-select\n        [initialValue]=\"codSelfFormStepOne.controls['gender'].value\"\n        [control]=\"codSelfFormStepOne.controls['gender']\"\n        [data]=\"genders\"\n        (eventSelect)=\"selectGender($event)\"\n        [defaultText]=\"'G\u00E9nero'\"\n      ></ipt-select>\n      <div *ngIf=\"codSelfFormStepOne.controls['gender'].invalid && codSelfFormStepOne.controls['gender'].touched\">\n        <span class=\"error-message\">Por favor ingresa un genero v\u00E1lido.</span>\n      </div>\n      <ipt-input\n        onfocus=\"(this.type='date')\"\n        [inputType]=\"'date'\"\n        [control]=\"codSelfFormStepOne.controls['birthdate']\"\n        [placeHolder]=\"'Fecha de nacimiento'\"\n      ></ipt-input>\n      <div *ngIf=\"codSelfFormStepOne.controls['birthdate'].invalid && codSelfFormStepOne.controls['birthdate'].touched\">\n        <span class=\"error-message\">Por favor ingresa una fecha mayor de 3 a\u00F1os.</span>\n      </div>\n      <ipt-select\n        [initialValue]=\"codSelfFormStepOne.controls['country'].value\"\n        [control]=\"codSelfFormStepOne.controls['country']\"\n        [selectCode]=\"codSelfFormStepOne.controls['country'].value === null ? 'Pa\u00EDs de residencia' : codSelfFormStepOne.controls['country'].value\"\n        (eventSelect)=\"selectCountry($event)\"\n        [data]=\"countries\"\n        [defaultText]=\"'Pa\u00EDs de residencia'\"\n      ></ipt-select>\n      <div *ngIf=\"codSelfFormStepOne.controls['country'].invalid && codSelfFormStepOne.controls['country'].touched\">\n        <span class=\"error-message\">Por favor ingresa un pais v\u00E1lido.</span>\n      </div>\n      <ipt-select\n        [initialValue]=\"codSelfFormStepOne.controls['state'].value\"\n        [control]=\"codSelfFormStepOne.controls['state']\"\n        [selectCode]=\"codSelfFormStepOne.controls['state'].value === null ? 'Departamento o estado' : codSelfFormStepOne.controls['state'].value\"\n        [isRequired]=\"true\"\n        (eventSelect)=\"selectState($event)\"\n        [data]=\"states\"\n        [defaultText]=\"'Departamento o estado'\"\n      ></ipt-select>\n      <div *ngIf=\"codSelfFormStepOne.controls['state'].invalid && codSelfFormStepOne.controls['state'].touched\">\n        <span class=\"error-message\">Por favor ingresa un departamento v\u00E1lido.</span>\n      </div>\n      <ipt-select\n        [initialValue]=\"codSelfFormStepOne.controls['city'].value\"\n        [control]=\"codSelfFormStepOne.controls['city']\"\n        [selectCode]=\"codSelfFormStepOne.controls['city'].value === null ? 'Ciudad de residencia' : codSelfFormStepOne.controls['city'].value\"\n        (eventSelect)=\"selectCity($event)\"\n        [data]=\"cities\"\n        [defaultText]=\"'Ciudad de residencia'\"\n      ></ipt-select>\n      <div *ngIf=\"codSelfFormStepOne.controls['city'].invalid && codSelfFormStepOne.controls['city'].touched\">\n        <span class=\"error-message\">Por favor ingresa una ciudad v\u00E1lido.</span>\n      </div>\n      <ipt-input\n        [inputType]=\"'email'\"\n        [placeHolder]=\"'Correo electr\u00F3nico'\"\n        [control]=\"codSelfFormStepOne.controls['student_email']\"\n      ></ipt-input>\n      <div *ngIf=\"codSelfFormStepOne.controls['student_email'].invalid && codSelfFormStepOne.controls['student_email'].touched\">\n        <span class=\"error-message\">Por favor ingresa un email valido.</span>\n      </div>\n      <ipt-select\n        [initialValue]=\"codSelfFormStepOne.controls['student_phone_indicative'].value\"\n        [control]=\"codSelfFormStepOne.controls['student_phone_indicative']\"\n        [data]=\"indicatives\"\n        (eventSelect)=\"selectIndicatives($event)\"\n        [defaultText]=\"'Indicativo'\"\n      ></ipt-select>\n      <div *ngIf=\"codSelfFormStepOne.controls['student_phone_indicative'].invalid && codSelfFormStepOne.controls['student_phone_indicative'].touched\">\n        <span class=\"error-message\">Por favor ingresa un indicativo valido.</span>\n      </div>\n      <ipt-input\n        [inputType]=\"'number'\"\n        [placeHolder]=\"'N\u00FAmero de tel\u00E9fono'\"\n        [control]=\"codSelfFormStepOne.controls['student_phone_number']\"\n      ></ipt-input>\n      <div *ngIf=\"codSelfFormStepOne.controls['student_phone_number'].invalid && codSelfFormStepOne.controls['student_phone_number'].touched\">\n        <span class=\"error-message\">Por favor ingresa un indicativo valido.</span>\n      </div>\n      <ipt-select\n        [initialValue]=\"codSelfFormStepOne.controls['grade'].value\"\n        [control]=\"codSelfFormStepOne.controls['grade']\"\n        [data]=\"grades\"\n        (eventSelect)=\"selectGrade($event)\"\n        [defaultText]=\"'Grado Educativo'\"\n      ></ipt-select>\n      <div *ngIf=\"codSelfFormStepOne.controls['grade'].invalid && codSelfFormStepOne.controls['grade'].touched\">\n        <span class=\"error-message\">Por favor selecciona un grado educativo</span>\n      </div>\n      <ipt-select\n      *ngIf=\"showAgreementSelect\"\n      [initialValue]=\"codSelfFormStepOne.controls['agreement_by_category'].value\"\n      [control]=\"codSelfFormStepOne.controls['agreement_by_category']\"\n      [data]=\"agreements\"\n      (eventSelect)=\"selectAgreement($event)\"\n      [defaultText]=\"'Convenio'\"\n    ></ipt-select>\n    <div *ngIf=\"codSelfFormStepOne.controls['agreement_by_category'].invalid && codSelfFormStepOne.controls['agreement_by_category'].touched\">\n      <span class=\"error-message\">Por favor selecciona un convenio valido</span>\n    </div>\n    </form>\n\n    <div class=\"flex justify-content-end mt-3 align-items-center gap-3\">\n      <button\n        pButton\n        icon=\"pi pi-arrow-right\"\n        type=\"submit\"\n        [disabled]=\"!codSelfFormStepOne.valid\"\n        (click)=\"sendForm()\"\n      ></button>\n    </div>\n  </div>\n\n</div>\n", styles: [".container-form{margin:5%;border-radius:3px;border:1px solid #2563eb;box-shadow:#3c40434d 0 1px 2px,#3c404326 0 2px 6px 2px;padding:1rem}.error-message{font-size:x-small;color:red}:host ::ng-deep .p-toast{width:20rem!important}.icon__tittle{color:#2563eb}\n"], dependencies: [{ kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: InputComponent, selector: "ipt-input", inputs: ["inputType", "placeHolder", "validateText", "withPipe", "list", "iconUrl", "control", "prefix", "thousands", "decimal", "disabledSel"], outputs: ["dateSelected"] }, { kind: "component", type: SelectComponent, selector: "ipt-select", inputs: ["isRequired", "data", "defaultText", "selectCode", "disabledSel", "initialValue", "control"], outputs: ["eventSelect"] }, { kind: "directive", type: i1$1.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i1$1.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i1$1.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i9.Tooltip, selector: "[pTooltip]", inputs: ["tooltipPosition", "tooltipEvent", "appendTo", "positionStyle", "tooltipStyleClass", "tooltipZIndex", "escape", "showDelay", "hideDelay", "life", "positionTop", "positionLeft", "fitContent", "pTooltip", "tooltipDisabled", "tooltipOptions"] }, { kind: "directive", type: i7$1.ButtonDirective, selector: "[pButton]", inputs: ["iconPos", "loadingIcon", "label", "icon", "loading"] }, { kind: "component", type: i11.Toast, selector: "p-toast", inputs: ["key", "autoZIndex", "baseZIndex", "style", "styleClass", "position", "preventOpenDuplicates", "preventDuplicates", "showTransformOptions", "hideTransformOptions", "showTransitionOptions", "hideTransitionOptions", "breakpoints"], outputs: ["onClose"] }, { kind: "directive", type: i2$1.PrimeTemplate, selector: "[pTemplate]", inputs: ["type", "pTemplate"] }] });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.0.7", ngImport: i0, type: CodSelfFormStepOneComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'app-cod-self-form-step-one', template: "<div class=\"container-main\">\r\n  <div class=\"container-form\">\r\n      <!-- <i class=\"pi pi-user-edit icon__tittle\"></i> -->\r\n      <h2>Datos Personales</h2>\r\n    <p-toast position=\"top-center\" key=\"confirm\" (onClose)=\"onReject()\" [baseZIndex]=\"10\">\r\n      <ng-template let-message pTemplate=\"message\">\r\n          <div class=\"flex flex-column align-items-start\" style=\"flex: 1\">\r\n              <div class=\"flex align-items-center gap-2\">\r\n                  <img src=\"./assets/logos/reading.png\" style=\"width: 65px;\" shape=\"circle\" />\r\n                  <span class=\"font-bold text-900\">Jacob</span>\r\n              </div>\r\n              <div class=\"font-medium text-lg my-3 text-900\">{{ messageInfo }}</div>\r\n          </div>\r\n      </ng-template>\r\n  </p-toast>\r\n\r\n    <i class=\"pi pi-exclamation-circle cursor-pointer w-auto\" (click)=\"showConfirm()\" pTooltip=\"Mas info.\" tooltipPosition=\"bottom\"></i>\r\n    <form [formGroup]=\"codSelfFormStepOne\">\r\n\r\n      <ipt-input\r\n        [inputType]=\"'text'\"\r\n        [placeHolder]=\"'Nombres'\"\r\n        [control]=\"codSelfFormStepOne.controls['student_name']\"\r\n      ></ipt-input>\r\n      <div *ngIf=\"codSelfFormStepOne.controls['student_name'].invalid && codSelfFormStepOne.controls['student_name'].touched\">\r\n        <span class=\"error-message\">Por favor ingresa un nombre v\u00E1lido.</span>\r\n      </div>\r\n      <ipt-input\r\n        [inputType]=\"'text'\"\r\n        [placeHolder]=\"'Apellidos'\"\r\n        [control]=\"codSelfFormStepOne.controls['student_last_name']\"\r\n      ></ipt-input>\r\n      <div *ngIf=\"codSelfFormStepOne.controls['student_last_name'].invalid && codSelfFormStepOne.controls['student_last_name'].touched\">\r\n        <span class=\"error-message\">Por favor ingresa un apellido v\u00E1lido.</span>\r\n      </div>\r\n      <ipt-select\r\n        [initialValue]=\"codSelfFormStepOne.controls['student_id_card_type'].value\"\r\n        [control]=\"codSelfFormStepOne.controls['student_id_card_type']\"\r\n        [selectCode]=\"codSelfFormStepOne.controls['student_id_card_type'].value === null ? 'Tipo de documento' : codSelfFormStepOne.controls['student_id_card_type'].value\"\r\n        [isRequired]=\"true\"\r\n        [data]=\"idTypes\"\r\n        (eventSelect)=\"selectIdType($event)\"\r\n        [defaultText]=\"'Tipo de documento'\"\r\n      ></ipt-select>\r\n      <div *ngIf=\"codSelfFormStepOne.controls['student_id_card_type'].invalid && codSelfFormStepOne.controls['student_id_card_type'].touched\">\r\n        <span class=\"error-message\">Por favor ingresa un tipo de documento v\u00E1lido.</span>\r\n      </div>\r\n      <ipt-input\r\n        [inputType]=\"'number'\"\r\n        [placeHolder]=\"'N\u00FAmero de documento'\"\r\n        [control]=\"codSelfFormStepOne.controls['student_id_card']\"\r\n      ></ipt-input>\r\n      <div *ngIf=\"codSelfFormStepOne.controls['student_id_card'].invalid && codSelfFormStepOne.controls['student_id_card'].touched\">\r\n        <span class=\"error-message\">Por favor ingresa un documento v\u00E1lido.</span>\r\n      </div>\r\n      <ipt-select\r\n        [initialValue]=\"codSelfFormStepOne.controls['gender'].value\"\r\n        [control]=\"codSelfFormStepOne.controls['gender']\"\r\n        [data]=\"genders\"\r\n        (eventSelect)=\"selectGender($event)\"\r\n        [defaultText]=\"'G\u00E9nero'\"\r\n      ></ipt-select>\r\n      <div *ngIf=\"codSelfFormStepOne.controls['gender'].invalid && codSelfFormStepOne.controls['gender'].touched\">\r\n        <span class=\"error-message\">Por favor ingresa un genero v\u00E1lido.</span>\r\n      </div>\r\n      <ipt-input\r\n        onfocus=\"(this.type='date')\"\r\n        [inputType]=\"'date'\"\r\n        [control]=\"codSelfFormStepOne.controls['birthdate']\"\r\n        [placeHolder]=\"'Fecha de nacimiento'\"\r\n      ></ipt-input>\r\n      <div *ngIf=\"codSelfFormStepOne.controls['birthdate'].invalid && codSelfFormStepOne.controls['birthdate'].touched\">\r\n        <span class=\"error-message\">Por favor ingresa una fecha mayor de 3 a\u00F1os.</span>\r\n      </div>\r\n      <ipt-select\r\n        [initialValue]=\"codSelfFormStepOne.controls['country'].value\"\r\n        [control]=\"codSelfFormStepOne.controls['country']\"\r\n        [selectCode]=\"codSelfFormStepOne.controls['country'].value === null ? 'Pa\u00EDs de residencia' : codSelfFormStepOne.controls['country'].value\"\r\n        (eventSelect)=\"selectCountry($event)\"\r\n        [data]=\"countries\"\r\n        [defaultText]=\"'Pa\u00EDs de residencia'\"\r\n      ></ipt-select>\r\n      <div *ngIf=\"codSelfFormStepOne.controls['country'].invalid && codSelfFormStepOne.controls['country'].touched\">\r\n        <span class=\"error-message\">Por favor ingresa un pais v\u00E1lido.</span>\r\n      </div>\r\n      <ipt-select\r\n        [initialValue]=\"codSelfFormStepOne.controls['state'].value\"\r\n        [control]=\"codSelfFormStepOne.controls['state']\"\r\n        [selectCode]=\"codSelfFormStepOne.controls['state'].value === null ? 'Departamento o estado' : codSelfFormStepOne.controls['state'].value\"\r\n        [isRequired]=\"true\"\r\n        (eventSelect)=\"selectState($event)\"\r\n        [data]=\"states\"\r\n        [defaultText]=\"'Departamento o estado'\"\r\n      ></ipt-select>\r\n      <div *ngIf=\"codSelfFormStepOne.controls['state'].invalid && codSelfFormStepOne.controls['state'].touched\">\r\n        <span class=\"error-message\">Por favor ingresa un departamento v\u00E1lido.</span>\r\n      </div>\r\n      <ipt-select\r\n        [initialValue]=\"codSelfFormStepOne.controls['city'].value\"\r\n        [control]=\"codSelfFormStepOne.controls['city']\"\r\n        [selectCode]=\"codSelfFormStepOne.controls['city'].value === null ? 'Ciudad de residencia' : codSelfFormStepOne.controls['city'].value\"\r\n        (eventSelect)=\"selectCity($event)\"\r\n        [data]=\"cities\"\r\n        [defaultText]=\"'Ciudad de residencia'\"\r\n      ></ipt-select>\r\n      <div *ngIf=\"codSelfFormStepOne.controls['city'].invalid && codSelfFormStepOne.controls['city'].touched\">\r\n        <span class=\"error-message\">Por favor ingresa una ciudad v\u00E1lido.</span>\r\n      </div>\r\n      <ipt-input\r\n        [inputType]=\"'email'\"\r\n        [placeHolder]=\"'Correo electr\u00F3nico'\"\r\n        [control]=\"codSelfFormStepOne.controls['student_email']\"\r\n      ></ipt-input>\r\n      <div *ngIf=\"codSelfFormStepOne.controls['student_email'].invalid && codSelfFormStepOne.controls['student_email'].touched\">\r\n        <span class=\"error-message\">Por favor ingresa un email valido.</span>\r\n      </div>\r\n      <ipt-select\r\n        [initialValue]=\"codSelfFormStepOne.controls['student_phone_indicative'].value\"\r\n        [control]=\"codSelfFormStepOne.controls['student_phone_indicative']\"\r\n        [data]=\"indicatives\"\r\n        (eventSelect)=\"selectIndicatives($event)\"\r\n        [defaultText]=\"'Indicativo'\"\r\n      ></ipt-select>\r\n      <div *ngIf=\"codSelfFormStepOne.controls['student_phone_indicative'].invalid && codSelfFormStepOne.controls['student_phone_indicative'].touched\">\r\n        <span class=\"error-message\">Por favor ingresa un indicativo valido.</span>\r\n      </div>\r\n      <ipt-input\r\n        [inputType]=\"'number'\"\r\n        [placeHolder]=\"'N\u00FAmero de tel\u00E9fono'\"\r\n        [control]=\"codSelfFormStepOne.controls['student_phone_number']\"\r\n      ></ipt-input>\r\n      <div *ngIf=\"codSelfFormStepOne.controls['student_phone_number'].invalid && codSelfFormStepOne.controls['student_phone_number'].touched\">\r\n        <span class=\"error-message\">Por favor ingresa un indicativo valido.</span>\r\n      </div>\r\n      <ipt-select\r\n        [initialValue]=\"codSelfFormStepOne.controls['grade'].value\"\r\n        [control]=\"codSelfFormStepOne.controls['grade']\"\r\n        [data]=\"grades\"\r\n        (eventSelect)=\"selectGrade($event)\"\r\n        [defaultText]=\"'Grado Educativo'\"\r\n      ></ipt-select>\r\n      <div *ngIf=\"codSelfFormStepOne.controls['grade'].invalid && codSelfFormStepOne.controls['grade'].touched\">\r\n        <span class=\"error-message\">Por favor selecciona un grado educativo</span>\r\n      </div>\r\n      <ipt-select\r\n      *ngIf=\"showAgreementSelect\"\r\n      [initialValue]=\"codSelfFormStepOne.controls['agreement_by_category'].value\"\r\n      [control]=\"codSelfFormStepOne.controls['agreement_by_category']\"\r\n      [data]=\"agreements\"\r\n      (eventSelect)=\"selectAgreement($event)\"\r\n      [defaultText]=\"'Convenio'\"\r\n    ></ipt-select>\r\n    <div *ngIf=\"codSelfFormStepOne.controls['agreement_by_category'].invalid && codSelfFormStepOne.controls['agreement_by_category'].touched\">\r\n      <span class=\"error-message\">Por favor selecciona un convenio valido</span>\r\n    </div>\r\n    </form>\r\n\r\n    <div class=\"flex justify-content-end mt-3 align-items-center gap-3\">\r\n      <button\r\n        pButton\r\n        icon=\"pi pi-arrow-right\"\r\n        type=\"submit\"\r\n        [disabled]=\"!codSelfFormStepOne.valid\"\r\n        (click)=\"sendForm()\"\r\n      ></button>\r\n    </div>\r\n  </div>\r\n\r\n</div>\r\n", styles: [".container-form{margin:5%;border-radius:3px;border:1px solid #2563eb;box-shadow:#3c40434d 0 1px 2px,#3c404326 0 2px 6px 2px;padding:1rem}.error-message{font-size:x-small;color:red}:host ::ng-deep .p-toast{width:20rem!important}.icon__tittle{color:#2563eb}\n"] }]
+            args: [{ selector: 'app-cod-self-form-step-one', template: "<div class=\"container-main\">\n  <div class=\"container-form\">\n      <!-- <i class=\"pi pi-user-edit icon__tittle\"></i> -->\n      <h2>Datos Personales</h2>\n    <p-toast position=\"top-center\" key=\"confirm\" (onClose)=\"onReject()\" [baseZIndex]=\"10\">\n      <ng-template let-message pTemplate=\"message\">\n          <div class=\"flex flex-column align-items-start\" style=\"flex: 1\">\n              <div class=\"flex align-items-center gap-2\">\n                  <img src=\"./assets/logos/reading.png\" style=\"width: 65px;\" shape=\"circle\" />\n                  <span class=\"font-bold text-900\">Jacob</span>\n              </div>\n              <div class=\"font-medium text-lg my-3 text-900\">{{ messageInfo }}</div>\n          </div>\n      </ng-template>\n  </p-toast>\n\n    <i class=\"pi pi-exclamation-circle cursor-pointer w-auto\" (click)=\"showConfirm()\" pTooltip=\"Mas info.\" tooltipPosition=\"bottom\"></i>\n    <form [formGroup]=\"codSelfFormStepOne\">\n\n      <ipt-input\n        [inputType]=\"'text'\"\n        [placeHolder]=\"'Nombres'\"\n        [control]=\"codSelfFormStepOne.controls['student_name']\"\n      ></ipt-input>\n      <div *ngIf=\"codSelfFormStepOne.controls['student_name'].invalid && codSelfFormStepOne.controls['student_name'].touched\">\n        <span class=\"error-message\">Por favor ingresa un nombre v\u00E1lido.</span>\n      </div>\n      <ipt-input\n        [inputType]=\"'text'\"\n        [placeHolder]=\"'Apellidos'\"\n        [control]=\"codSelfFormStepOne.controls['student_last_name']\"\n      ></ipt-input>\n      <div *ngIf=\"codSelfFormStepOne.controls['student_last_name'].invalid && codSelfFormStepOne.controls['student_last_name'].touched\">\n        <span class=\"error-message\">Por favor ingresa un apellido v\u00E1lido.</span>\n      </div>\n      <ipt-select\n        [initialValue]=\"codSelfFormStepOne.controls['student_id_card_type'].value\"\n        [control]=\"codSelfFormStepOne.controls['student_id_card_type']\"\n        [selectCode]=\"codSelfFormStepOne.controls['student_id_card_type'].value === null ? 'Tipo de documento' : codSelfFormStepOne.controls['student_id_card_type'].value\"\n        [isRequired]=\"true\"\n        [data]=\"idTypes\"\n        (eventSelect)=\"selectIdType($event)\"\n        [defaultText]=\"'Tipo de documento'\"\n      ></ipt-select>\n      <div *ngIf=\"codSelfFormStepOne.controls['student_id_card_type'].invalid && codSelfFormStepOne.controls['student_id_card_type'].touched\">\n        <span class=\"error-message\">Por favor ingresa un tipo de documento v\u00E1lido.</span>\n      </div>\n      <ipt-input\n        [inputType]=\"'number'\"\n        [placeHolder]=\"'N\u00FAmero de documento'\"\n        [control]=\"codSelfFormStepOne.controls['student_id_card']\"\n      ></ipt-input>\n      <div *ngIf=\"codSelfFormStepOne.controls['student_id_card'].invalid && codSelfFormStepOne.controls['student_id_card'].touched\">\n        <span class=\"error-message\">Por favor ingresa un documento v\u00E1lido.</span>\n      </div>\n      <ipt-select\n        [initialValue]=\"codSelfFormStepOne.controls['gender'].value\"\n        [control]=\"codSelfFormStepOne.controls['gender']\"\n        [data]=\"genders\"\n        (eventSelect)=\"selectGender($event)\"\n        [defaultText]=\"'G\u00E9nero'\"\n      ></ipt-select>\n      <div *ngIf=\"codSelfFormStepOne.controls['gender'].invalid && codSelfFormStepOne.controls['gender'].touched\">\n        <span class=\"error-message\">Por favor ingresa un genero v\u00E1lido.</span>\n      </div>\n      <ipt-input\n        onfocus=\"(this.type='date')\"\n        [inputType]=\"'date'\"\n        [control]=\"codSelfFormStepOne.controls['birthdate']\"\n        [placeHolder]=\"'Fecha de nacimiento'\"\n      ></ipt-input>\n      <div *ngIf=\"codSelfFormStepOne.controls['birthdate'].invalid && codSelfFormStepOne.controls['birthdate'].touched\">\n        <span class=\"error-message\">Por favor ingresa una fecha mayor de 3 a\u00F1os.</span>\n      </div>\n      <ipt-select\n        [initialValue]=\"codSelfFormStepOne.controls['country'].value\"\n        [control]=\"codSelfFormStepOne.controls['country']\"\n        [selectCode]=\"codSelfFormStepOne.controls['country'].value === null ? 'Pa\u00EDs de residencia' : codSelfFormStepOne.controls['country'].value\"\n        (eventSelect)=\"selectCountry($event)\"\n        [data]=\"countries\"\n        [defaultText]=\"'Pa\u00EDs de residencia'\"\n      ></ipt-select>\n      <div *ngIf=\"codSelfFormStepOne.controls['country'].invalid && codSelfFormStepOne.controls['country'].touched\">\n        <span class=\"error-message\">Por favor ingresa un pais v\u00E1lido.</span>\n      </div>\n      <ipt-select\n        [initialValue]=\"codSelfFormStepOne.controls['state'].value\"\n        [control]=\"codSelfFormStepOne.controls['state']\"\n        [selectCode]=\"codSelfFormStepOne.controls['state'].value === null ? 'Departamento o estado' : codSelfFormStepOne.controls['state'].value\"\n        [isRequired]=\"true\"\n        (eventSelect)=\"selectState($event)\"\n        [data]=\"states\"\n        [defaultText]=\"'Departamento o estado'\"\n      ></ipt-select>\n      <div *ngIf=\"codSelfFormStepOne.controls['state'].invalid && codSelfFormStepOne.controls['state'].touched\">\n        <span class=\"error-message\">Por favor ingresa un departamento v\u00E1lido.</span>\n      </div>\n      <ipt-select\n        [initialValue]=\"codSelfFormStepOne.controls['city'].value\"\n        [control]=\"codSelfFormStepOne.controls['city']\"\n        [selectCode]=\"codSelfFormStepOne.controls['city'].value === null ? 'Ciudad de residencia' : codSelfFormStepOne.controls['city'].value\"\n        (eventSelect)=\"selectCity($event)\"\n        [data]=\"cities\"\n        [defaultText]=\"'Ciudad de residencia'\"\n      ></ipt-select>\n      <div *ngIf=\"codSelfFormStepOne.controls['city'].invalid && codSelfFormStepOne.controls['city'].touched\">\n        <span class=\"error-message\">Por favor ingresa una ciudad v\u00E1lido.</span>\n      </div>\n      <ipt-input\n        [inputType]=\"'email'\"\n        [placeHolder]=\"'Correo electr\u00F3nico'\"\n        [control]=\"codSelfFormStepOne.controls['student_email']\"\n      ></ipt-input>\n      <div *ngIf=\"codSelfFormStepOne.controls['student_email'].invalid && codSelfFormStepOne.controls['student_email'].touched\">\n        <span class=\"error-message\">Por favor ingresa un email valido.</span>\n      </div>\n      <ipt-select\n        [initialValue]=\"codSelfFormStepOne.controls['student_phone_indicative'].value\"\n        [control]=\"codSelfFormStepOne.controls['student_phone_indicative']\"\n        [data]=\"indicatives\"\n        (eventSelect)=\"selectIndicatives($event)\"\n        [defaultText]=\"'Indicativo'\"\n      ></ipt-select>\n      <div *ngIf=\"codSelfFormStepOne.controls['student_phone_indicative'].invalid && codSelfFormStepOne.controls['student_phone_indicative'].touched\">\n        <span class=\"error-message\">Por favor ingresa un indicativo valido.</span>\n      </div>\n      <ipt-input\n        [inputType]=\"'number'\"\n        [placeHolder]=\"'N\u00FAmero de tel\u00E9fono'\"\n        [control]=\"codSelfFormStepOne.controls['student_phone_number']\"\n      ></ipt-input>\n      <div *ngIf=\"codSelfFormStepOne.controls['student_phone_number'].invalid && codSelfFormStepOne.controls['student_phone_number'].touched\">\n        <span class=\"error-message\">Por favor ingresa un indicativo valido.</span>\n      </div>\n      <ipt-select\n        [initialValue]=\"codSelfFormStepOne.controls['grade'].value\"\n        [control]=\"codSelfFormStepOne.controls['grade']\"\n        [data]=\"grades\"\n        (eventSelect)=\"selectGrade($event)\"\n        [defaultText]=\"'Grado Educativo'\"\n      ></ipt-select>\n      <div *ngIf=\"codSelfFormStepOne.controls['grade'].invalid && codSelfFormStepOne.controls['grade'].touched\">\n        <span class=\"error-message\">Por favor selecciona un grado educativo</span>\n      </div>\n      <ipt-select\n      *ngIf=\"showAgreementSelect\"\n      [initialValue]=\"codSelfFormStepOne.controls['agreement_by_category'].value\"\n      [control]=\"codSelfFormStepOne.controls['agreement_by_category']\"\n      [data]=\"agreements\"\n      (eventSelect)=\"selectAgreement($event)\"\n      [defaultText]=\"'Convenio'\"\n    ></ipt-select>\n    <div *ngIf=\"codSelfFormStepOne.controls['agreement_by_category'].invalid && codSelfFormStepOne.controls['agreement_by_category'].touched\">\n      <span class=\"error-message\">Por favor selecciona un convenio valido</span>\n    </div>\n    </form>\n\n    <div class=\"flex justify-content-end mt-3 align-items-center gap-3\">\n      <button\n        pButton\n        icon=\"pi pi-arrow-right\"\n        type=\"submit\"\n        [disabled]=\"!codSelfFormStepOne.valid\"\n        (click)=\"sendForm()\"\n      ></button>\n    </div>\n  </div>\n\n</div>\n", styles: [".container-form{margin:5%;border-radius:3px;border:1px solid #2563eb;box-shadow:#3c40434d 0 1px 2px,#3c404326 0 2px 6px 2px;padding:1rem}.error-message{font-size:x-small;color:red}:host ::ng-deep .p-toast{width:20rem!important}.icon__tittle{color:#2563eb}\n"] }]
         }], ctorParameters: function () { return [{ type: i1$1.FormBuilder }, { type: ParameterService }, { type: i2$1.MessageService }, { type: UserService }, { type: BaseService }]; }, propDecorators: { userStudent: [{
                 type: Input
             }], completed: [{
@@ -7309,10 +7309,10 @@ class CodSelfFormStepTwoComponent extends CodSelfManagedSteps {
     }
 }
 CodSelfFormStepTwoComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.0.7", ngImport: i0, type: CodSelfFormStepTwoComponent, deps: [{ token: i1$1.FormBuilder }, { token: i2$1.MessageService }, { token: BaseService }, { token: AcademicService }], target: i0.ɵɵFactoryTarget.Component });
-CodSelfFormStepTwoComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.0.7", type: CodSelfFormStepTwoComponent, selector: "app-cod-self-form-step-two", inputs: { scorePlacementTest: "scorePlacementTest", codPrevious: "codPrevious" }, outputs: { completed: "completed" }, usesInheritance: true, ngImport: i0, template: "<div class=\"container-main\">\r\n  <div class=\"container-form\">\r\n    <h2>Planes</h2>\r\n      <p-toast position=\"top-center\" key=\"confirm\" (onClose)=\"onReject()\" [baseZIndex]=\"10\">\r\n        <ng-template let-message pTemplate=\"message\">\r\n            <div class=\"flex flex-column align-items-start\" style=\"flex: 1\">\r\n                <div class=\"flex align-items-center gap-2\">\r\n                    <img src=\"./assets/logos/reading.png\" style=\"width: 65px;\" shape=\"circle\" />\r\n                    <span class=\"font-bold text-900\">Jacob</span>\r\n                </div>\r\n                <div class=\"font-medium text-lg my-3 text-900\">{{ messageInfo }}</div>\r\n            </div>\r\n        </ng-template>\r\n    </p-toast>\r\n\r\n    <i class=\"pi pi-exclamation-circle cursor-pointer w-auto mt-4 mb-4\" (click)=\"showConfirm()\" pTooltip=\"Mas info.\" tooltipPosition=\"bottom\"></i>\r\n      <div class=\"animate__animated animate__slideInRight ng-star-inserted\">\r\n        <div class=\"container-button\" *ngIf=\"!SearchData\">\r\n          <ipt-button\r\n            [label]=\"'Filtrar'\"\r\n            (onClick)=\"filterAgain()\"\r\n            [primary]=\"true\">\r\n          </ipt-button>\r\n        </div>\r\n\r\n        <div *ngIf=\"SearchData\">\r\n          <p-accordion [multiple]=\"true\" [activeIndex]=\"[0]\">\r\n            <p-accordionTab header=\"Jornada\">\r\n              <div class=\"containerDay\">\r\n                <div class=\"checkBox flex flex-wrap justify-content-between m-3 gap-3\">\r\n                  <div *ngFor=\"let dayW of schedules; index as ind\" class=\"field-checkbox\">\r\n                    <p-checkbox\r\n                      name=\"group2\"\r\n                      value=\"category\"\r\n                      [value]=\"dayW\"\r\n                      [(ngModel)]=\"selectedSchedules\"\r\n                      [inputId]=\"dayW.key\"\r\n                      [disabled]=\"disableweekdays[ind]\"\r\n                      [ngModelOptions]=\"{ standalone: true }\"\r\n                      checkboxIcon=\"pi pi-check-circle\"\r\n                      (ngModelChange)=\"selectSchedules($event)\"\r\n                    ></p-checkbox>\r\n                    <label [for]=\"dayW.key\">{{ dayW.name }}</label>\r\n                  </div>\r\n                  <div *ngIf=\"messageAlertSchedules\">\r\n                    <span class=\"error-message\">Por favor selecciona una opcion</span>\r\n                  </div>\r\n              </div>\r\n            </div>\r\n            </p-accordionTab>\r\n            <p-accordionTab header=\"Modalidad\">\r\n              <div class=\"containerDay\">\r\n                <div class=\"checkBox flex flex-wrap justify-content-between m-3 gap-3\">\r\n                  <div *ngFor=\"let dayW of stateOptionsModality; index as ind\" class=\"field-checkbox\">\r\n                    <p-checkbox\r\n                      name=\"group2\"\r\n                      value=\"category\"\r\n                      [value]=\"dayW\"\r\n                      [(ngModel)]=\"selectedModality\"\r\n                      [inputId]=\"dayW.key\"\r\n                      [disabled]=\"disableweekdays[ind]\"\r\n                      [ngModelOptions]=\"{ standalone: true }\"\r\n                      checkboxIcon=\"pi pi-check-circle\"\r\n                      (ngModelChange)=\"selectModality($event)\"\r\n                    ></p-checkbox>\r\n                    <label [for]=\"dayW.key\">{{ dayW.name }}</label>\r\n                  </div>\r\n                  <div *ngIf=\"messageAlertModality\">\r\n                    <span class=\"error-message\">Por favor selecciona una opcion</span>\r\n                  </div>\r\n              </div>\r\n            </div>\r\n            </p-accordionTab>\r\n            <p-accordionTab *ngIf=\"scorePlacementTest != null\" header=\"Placement test\">\r\n              <span>Tienes un Placement Test realizado. Puedes comenzar con el nivel</span><h3>{{ scorePlacementTest?.level_inglish_next.name }}</h3>\r\n              <span>\"NO APLICA PLACEMENT TEST PARA PLANES TECNICOS\"</span>\r\n              <div class=\"containerDay mt-3\">\r\n                <h3>\u00BFDeseas iniciar en este nivel {{ scorePlacementTest?.level_inglish_next.name }}?</h3>\r\n\r\n              <div class=\"flex flex-column gap-3\">\r\n                <div *ngFor=\"let category of OptionPlacementTest; index as ind\" class=\"field-checkbox\">\r\n                    <p-radioButton\r\n                        [inputId]=\"category.key\"\r\n                        name=\"category\"\r\n                        [value]=\"category\"\r\n                        [(ngModel)]=\"selectedOptionPlacementTest\"\r\n                        [disabled]=\"disableweekdays[ind]\"\r\n                        [ngModelOptions]=\"{ standalone: true }\"\r\n                        (ngModelChange)=\"selectOpcionsPlacementTest($event)\"\r\n                        ></p-radioButton>\r\n                    <label [for]=\"category.key\" class=\"ml-2\">\r\n                        {{ category.name }}\r\n                    </label>\r\n                </div>\r\n              </div>\r\n            </div>\r\n            </p-accordionTab>\r\n            <p-accordionTab *ngIf=\"scorePlacementTest == null\" header=\"Prueba diagn\u00F3stico Placement Test\">\r\n              <span>Presenta totalmente gratis esta prueba para conocer tu nivel de ingl\u00E9s y nuestras ofertas para ti.</span>\r\n              <div class=\"containerDay mt-3\">\r\n                <ipt-button\r\n                [label]=\"'Presentar Test'\"\r\n                (onClick)=\"openTestInNewTab()\"\r\n                [primary]=\"true\">\r\n              </ipt-button>\r\n\r\n              <div class=\"flex flex-column gap-3\">\r\n\r\n            </div>\r\n            </div>\r\n            </p-accordionTab>\r\n\r\n          </p-accordion>\r\n          <div class=\"flex-none flex align-items-center justify-content-end m-2\">\r\n            <button\r\n              pTooltip=\"Buscar Planes\"\r\n              tooltipPosition=\"left\"\r\n              pButton\r\n              Ripple\r\n              type=\"button\"\r\n              icon=\"pi pi-search\"\r\n              class=\"p-button-rounded p-button-outlined\"\r\n              [disabled]=\"selectedSchedules.length === 0 || selectedModality.length === 0 || scorePlacementTest != null && selectedOptionPlacementTest.length === 0 \"\r\n              (click)=\"searchAvalaibleCourse()\"\r\n            ></button>\r\n          </div>\r\n        </div>\r\n\r\n\r\n        <ipt-card-select-course-self-cod-managed\r\n        *ngIf=\"courseSelect != null\"\r\n        [courseSelect]=\"courseSelect\">\r\n        </ipt-card-select-course-self-cod-managed>\r\n\r\n        <article *ngIf=\"visibleGroupReview\" class=\"cards-container\">\r\n\r\n          <ipt-card-course-self-cod-managed\r\n            [CourseData]=\"dataCourse\"\r\n            (codeCourse)=\"courseCode($event)\"\r\n            [isLoading]=\"isLoading\">\r\n          </ipt-card-course-self-cod-managed>\r\n        </article>\r\n      <div class=\"flex justify-content-between mt-3 align-items-center gap-3\">\r\n        <button\r\n        pButton\r\n        icon=\"pi pi-arrow-left\"\r\n        type=\"submit\"\r\n        (click)=\"back()\"\r\n        ></button>\r\n\r\n        <button\r\n        pButton\r\n        icon=\"pi pi-arrow-right\"\r\n        [disabled]=\"!codSelfFormStepTwo.valid || courseSelect === null\"\r\n        (click)=\"sendForm()\"\r\n        ></button>\r\n      </div>\r\n    </div>\r\n  </div>\r\n</div>\r\n\r\n\r\n\r\n", styles: [".container-form{margin:5%;border-radius:3px;border:1px solid #2563eb;box-shadow:#3c40434d 0 1px 2px,#3c404326 0 2px 6px 2px;padding:1rem}.error-message{font-size:x-small;color:red}:host ::ng-deep .p-toast{width:20rem!important}span{color:#999;font-size:15px;font-weight:400;pointer-events:none;left:20px;top:-20px}:host ::ng-deep .p-buttonset .p-button{box-shadow:#64646f33 0 7px 29px;border-radius:3px;border:none;outline:none;transition:.2s;font-weight:300;height:28px}:host ::ng-deep .p-calendar{position:relative;display:inline-flex;max-width:100%;height:28px;box-shadow:#64646f33 0 7px 29px;border-radius:3px;border:none;outline:none;transition:.2s;font-weight:300;width:-webkit-fill-available;width:-moz-available;background-color:#fff;-webkit-appearance:none}.cards-container{margin-top:10px}.container-button{width:7rem}.containerDay{justify-content:center;display:flex}.checkBox{gap:1rem}\n"], dependencies: [{ kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: ButtonComponent, selector: "ipt-button", inputs: ["primary", "size", "label", "buttonType", "isEnabled"], outputs: ["onClick"] }, { kind: "component", type: CardCourseComponent, selector: "ipt-card-course-self-cod-managed", inputs: ["CourseData", "isLoading"], outputs: ["codeCourse"] }, { kind: "component", type: CardSelectCourseComponent, selector: "ipt-card-select-course-self-cod-managed", inputs: ["courseSelect"] }, { kind: "directive", type: i1$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i9.Tooltip, selector: "[pTooltip]", inputs: ["tooltipPosition", "tooltipEvent", "appendTo", "positionStyle", "tooltipStyleClass", "tooltipZIndex", "escape", "showDelay", "hideDelay", "life", "positionTop", "positionLeft", "fitContent", "pTooltip", "tooltipDisabled", "tooltipOptions"] }, { kind: "directive", type: i1$1.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "directive", type: i7$1.ButtonDirective, selector: "[pButton]", inputs: ["iconPos", "loadingIcon", "label", "icon", "loading"] }, { kind: "component", type: i11.Toast, selector: "p-toast", inputs: ["key", "autoZIndex", "baseZIndex", "style", "styleClass", "position", "preventOpenDuplicates", "preventDuplicates", "showTransformOptions", "hideTransformOptions", "showTransitionOptions", "hideTransitionOptions", "breakpoints"], outputs: ["onClose"] }, { kind: "directive", type: i2$1.PrimeTemplate, selector: "[pTemplate]", inputs: ["type", "pTemplate"] }, { kind: "component", type: i12.Accordion, selector: "p-accordion", inputs: ["multiple", "style", "styleClass", "expandIcon", "collapseIcon", "activeIndex"], outputs: ["onClose", "onOpen", "activeIndexChange"] }, { kind: "component", type: i12.AccordionTab, selector: "p-accordionTab", inputs: ["header", "disabled", "cache", "transitionOptions", "selected"], outputs: ["selectedChange"] }, { kind: "component", type: i13$1.Checkbox, selector: "p-checkbox", inputs: ["value", "name", "disabled", "binary", "label", "ariaLabelledBy", "ariaLabel", "tabindex", "inputId", "style", "styleClass", "labelStyleClass", "formControl", "checkboxIcon", "readonly", "required", "trueValue", "falseValue"], outputs: ["onChange"] }, { kind: "component", type: i14.RadioButton, selector: "p-radioButton", inputs: ["value", "formControlName", "name", "disabled", "label", "tabindex", "inputId", "ariaLabelledBy", "ariaLabel", "style", "styleClass", "labelStyleClass"], outputs: ["onClick", "onFocus", "onBlur"] }] });
+CodSelfFormStepTwoComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.0.7", type: CodSelfFormStepTwoComponent, selector: "app-cod-self-form-step-two", inputs: { scorePlacementTest: "scorePlacementTest", codPrevious: "codPrevious" }, outputs: { completed: "completed" }, usesInheritance: true, ngImport: i0, template: "<div class=\"container-main\">\n  <div class=\"container-form\">\n    <h2>Planes</h2>\n      <p-toast position=\"top-center\" key=\"confirm\" (onClose)=\"onReject()\" [baseZIndex]=\"10\">\n        <ng-template let-message pTemplate=\"message\">\n            <div class=\"flex flex-column align-items-start\" style=\"flex: 1\">\n                <div class=\"flex align-items-center gap-2\">\n                    <img src=\"./assets/logos/reading.png\" style=\"width: 65px;\" shape=\"circle\" />\n                    <span class=\"font-bold text-900\">Jacob</span>\n                </div>\n                <div class=\"font-medium text-lg my-3 text-900\">{{ messageInfo }}</div>\n            </div>\n        </ng-template>\n    </p-toast>\n\n    <i class=\"pi pi-exclamation-circle cursor-pointer w-auto mt-4 mb-4\" (click)=\"showConfirm()\" pTooltip=\"Mas info.\" tooltipPosition=\"bottom\"></i>\n      <div class=\"animate__animated animate__slideInRight ng-star-inserted\">\n        <div class=\"container-button\" *ngIf=\"!SearchData\">\n          <ipt-button\n            [label]=\"'Filtrar'\"\n            (onClick)=\"filterAgain()\"\n            [primary]=\"true\">\n          </ipt-button>\n        </div>\n\n        <div *ngIf=\"SearchData\">\n          <p-accordion [multiple]=\"true\" [activeIndex]=\"[0]\">\n            <p-accordionTab header=\"Jornada\">\n              <div class=\"containerDay\">\n                <div class=\"checkBox flex flex-wrap justify-content-between m-3 gap-3\">\n                  <div *ngFor=\"let dayW of schedules; index as ind\" class=\"field-checkbox\">\n                    <p-checkbox\n                      name=\"group2\"\n                      value=\"category\"\n                      [value]=\"dayW\"\n                      [(ngModel)]=\"selectedSchedules\"\n                      [inputId]=\"dayW.key\"\n                      [disabled]=\"disableweekdays[ind]\"\n                      [ngModelOptions]=\"{ standalone: true }\"\n                      checkboxIcon=\"pi pi-check-circle\"\n                      (ngModelChange)=\"selectSchedules($event)\"\n                    ></p-checkbox>\n                    <label [for]=\"dayW.key\">{{ dayW.name }}</label>\n                  </div>\n                  <div *ngIf=\"messageAlertSchedules\">\n                    <span class=\"error-message\">Por favor selecciona una opcion</span>\n                  </div>\n              </div>\n            </div>\n            </p-accordionTab>\n            <p-accordionTab header=\"Modalidad\">\n              <div class=\"containerDay\">\n                <div class=\"checkBox flex flex-wrap justify-content-between m-3 gap-3\">\n                  <div *ngFor=\"let dayW of stateOptionsModality; index as ind\" class=\"field-checkbox\">\n                    <p-checkbox\n                      name=\"group2\"\n                      value=\"category\"\n                      [value]=\"dayW\"\n                      [(ngModel)]=\"selectedModality\"\n                      [inputId]=\"dayW.key\"\n                      [disabled]=\"disableweekdays[ind]\"\n                      [ngModelOptions]=\"{ standalone: true }\"\n                      checkboxIcon=\"pi pi-check-circle\"\n                      (ngModelChange)=\"selectModality($event)\"\n                    ></p-checkbox>\n                    <label [for]=\"dayW.key\">{{ dayW.name }}</label>\n                  </div>\n                  <div *ngIf=\"messageAlertModality\">\n                    <span class=\"error-message\">Por favor selecciona una opcion</span>\n                  </div>\n              </div>\n            </div>\n            </p-accordionTab>\n            <p-accordionTab *ngIf=\"scorePlacementTest != null\" header=\"Placement test\">\n              <span>Tienes un Placement Test realizado. Puedes comenzar con el nivel</span><h3>{{ scorePlacementTest?.level_inglish_next.name }}</h3>\n              <span>\"NO APLICA PLACEMENT TEST PARA PLANES TECNICOS\"</span>\n              <div class=\"containerDay mt-3\">\n                <h3>\u00BFDeseas iniciar en este nivel {{ scorePlacementTest?.level_inglish_next.name }}?</h3>\n\n              <div class=\"flex flex-column gap-3\">\n                <div *ngFor=\"let category of OptionPlacementTest; index as ind\" class=\"field-checkbox\">\n                    <p-radioButton\n                        [inputId]=\"category.key\"\n                        name=\"category\"\n                        [value]=\"category\"\n                        [(ngModel)]=\"selectedOptionPlacementTest\"\n                        [disabled]=\"disableweekdays[ind]\"\n                        [ngModelOptions]=\"{ standalone: true }\"\n                        (ngModelChange)=\"selectOpcionsPlacementTest($event)\"\n                        ></p-radioButton>\n                    <label [for]=\"category.key\" class=\"ml-2\">\n                        {{ category.name }}\n                    </label>\n                </div>\n              </div>\n            </div>\n            </p-accordionTab>\n            <p-accordionTab *ngIf=\"scorePlacementTest == null\" header=\"Prueba diagn\u00F3stico Placement Test\">\n              <span>Presenta totalmente gratis esta prueba para conocer tu nivel de ingl\u00E9s y nuestras ofertas para ti.</span>\n              <div class=\"containerDay mt-3\">\n                <ipt-button\n                [label]=\"'Presentar Test'\"\n                (onClick)=\"openTestInNewTab()\"\n                [primary]=\"true\">\n              </ipt-button>\n\n              <div class=\"flex flex-column gap-3\">\n\n            </div>\n            </div>\n            </p-accordionTab>\n\n          </p-accordion>\n          <div class=\"flex-none flex align-items-center justify-content-end m-2\">\n            <button\n              pTooltip=\"Buscar Planes\"\n              tooltipPosition=\"left\"\n              pButton\n              Ripple\n              type=\"button\"\n              icon=\"pi pi-search\"\n              class=\"p-button-rounded p-button-outlined\"\n              [disabled]=\"selectedSchedules.length === 0 || selectedModality.length === 0 || scorePlacementTest != null && selectedOptionPlacementTest.length === 0 \"\n              (click)=\"searchAvalaibleCourse()\"\n            ></button>\n          </div>\n        </div>\n\n\n        <ipt-card-select-course-self-cod-managed\n        *ngIf=\"courseSelect != null\"\n        [courseSelect]=\"courseSelect\">\n        </ipt-card-select-course-self-cod-managed>\n\n        <article *ngIf=\"visibleGroupReview\" class=\"cards-container\">\n\n          <ipt-card-course-self-cod-managed\n            [CourseData]=\"dataCourse\"\n            (codeCourse)=\"courseCode($event)\"\n            [isLoading]=\"isLoading\">\n          </ipt-card-course-self-cod-managed>\n        </article>\n      <div class=\"flex justify-content-between mt-3 align-items-center gap-3\">\n        <button\n        pButton\n        icon=\"pi pi-arrow-left\"\n        type=\"submit\"\n        (click)=\"back()\"\n        ></button>\n\n        <button\n        pButton\n        icon=\"pi pi-arrow-right\"\n        [disabled]=\"!codSelfFormStepTwo.valid || courseSelect === null\"\n        (click)=\"sendForm()\"\n        ></button>\n      </div>\n    </div>\n  </div>\n</div>\n\n\n\n", styles: [".container-form{margin:5%;border-radius:3px;border:1px solid #2563eb;box-shadow:#3c40434d 0 1px 2px,#3c404326 0 2px 6px 2px;padding:1rem}.error-message{font-size:x-small;color:red}:host ::ng-deep .p-toast{width:20rem!important}span{color:#999;font-size:15px;font-weight:400;pointer-events:none;left:20px;top:-20px}:host ::ng-deep .p-buttonset .p-button{box-shadow:#64646f33 0 7px 29px;border-radius:3px;border:none;outline:none;transition:.2s;font-weight:300;height:28px}:host ::ng-deep .p-calendar{position:relative;display:inline-flex;max-width:100%;height:28px;box-shadow:#64646f33 0 7px 29px;border-radius:3px;border:none;outline:none;transition:.2s;font-weight:300;width:-webkit-fill-available;width:-moz-available;background-color:#fff;-webkit-appearance:none}.cards-container{margin-top:10px}.container-button{width:7rem}.containerDay{justify-content:center;display:flex}.checkBox{gap:1rem}\n"], dependencies: [{ kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: ButtonComponent, selector: "ipt-button", inputs: ["primary", "size", "label", "buttonType", "isEnabled"], outputs: ["onClick"] }, { kind: "component", type: CardCourseComponent, selector: "ipt-card-course-self-cod-managed", inputs: ["CourseData", "isLoading"], outputs: ["codeCourse"] }, { kind: "component", type: CardSelectCourseComponent, selector: "ipt-card-select-course-self-cod-managed", inputs: ["courseSelect"] }, { kind: "directive", type: i1$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i9.Tooltip, selector: "[pTooltip]", inputs: ["tooltipPosition", "tooltipEvent", "appendTo", "positionStyle", "tooltipStyleClass", "tooltipZIndex", "escape", "showDelay", "hideDelay", "life", "positionTop", "positionLeft", "fitContent", "pTooltip", "tooltipDisabled", "tooltipOptions"] }, { kind: "directive", type: i1$1.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "directive", type: i7$1.ButtonDirective, selector: "[pButton]", inputs: ["iconPos", "loadingIcon", "label", "icon", "loading"] }, { kind: "component", type: i11.Toast, selector: "p-toast", inputs: ["key", "autoZIndex", "baseZIndex", "style", "styleClass", "position", "preventOpenDuplicates", "preventDuplicates", "showTransformOptions", "hideTransformOptions", "showTransitionOptions", "hideTransitionOptions", "breakpoints"], outputs: ["onClose"] }, { kind: "directive", type: i2$1.PrimeTemplate, selector: "[pTemplate]", inputs: ["type", "pTemplate"] }, { kind: "component", type: i12.Accordion, selector: "p-accordion", inputs: ["multiple", "style", "styleClass", "expandIcon", "collapseIcon", "activeIndex"], outputs: ["onClose", "onOpen", "activeIndexChange"] }, { kind: "component", type: i12.AccordionTab, selector: "p-accordionTab", inputs: ["header", "disabled", "cache", "transitionOptions", "selected"], outputs: ["selectedChange"] }, { kind: "component", type: i13$1.Checkbox, selector: "p-checkbox", inputs: ["value", "name", "disabled", "binary", "label", "ariaLabelledBy", "ariaLabel", "tabindex", "inputId", "style", "styleClass", "labelStyleClass", "formControl", "checkboxIcon", "readonly", "required", "trueValue", "falseValue"], outputs: ["onChange"] }, { kind: "component", type: i14.RadioButton, selector: "p-radioButton", inputs: ["value", "formControlName", "name", "disabled", "label", "tabindex", "inputId", "ariaLabelledBy", "ariaLabel", "style", "styleClass", "labelStyleClass"], outputs: ["onClick", "onFocus", "onBlur"] }] });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.0.7", ngImport: i0, type: CodSelfFormStepTwoComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'app-cod-self-form-step-two', template: "<div class=\"container-main\">\r\n  <div class=\"container-form\">\r\n    <h2>Planes</h2>\r\n      <p-toast position=\"top-center\" key=\"confirm\" (onClose)=\"onReject()\" [baseZIndex]=\"10\">\r\n        <ng-template let-message pTemplate=\"message\">\r\n            <div class=\"flex flex-column align-items-start\" style=\"flex: 1\">\r\n                <div class=\"flex align-items-center gap-2\">\r\n                    <img src=\"./assets/logos/reading.png\" style=\"width: 65px;\" shape=\"circle\" />\r\n                    <span class=\"font-bold text-900\">Jacob</span>\r\n                </div>\r\n                <div class=\"font-medium text-lg my-3 text-900\">{{ messageInfo }}</div>\r\n            </div>\r\n        </ng-template>\r\n    </p-toast>\r\n\r\n    <i class=\"pi pi-exclamation-circle cursor-pointer w-auto mt-4 mb-4\" (click)=\"showConfirm()\" pTooltip=\"Mas info.\" tooltipPosition=\"bottom\"></i>\r\n      <div class=\"animate__animated animate__slideInRight ng-star-inserted\">\r\n        <div class=\"container-button\" *ngIf=\"!SearchData\">\r\n          <ipt-button\r\n            [label]=\"'Filtrar'\"\r\n            (onClick)=\"filterAgain()\"\r\n            [primary]=\"true\">\r\n          </ipt-button>\r\n        </div>\r\n\r\n        <div *ngIf=\"SearchData\">\r\n          <p-accordion [multiple]=\"true\" [activeIndex]=\"[0]\">\r\n            <p-accordionTab header=\"Jornada\">\r\n              <div class=\"containerDay\">\r\n                <div class=\"checkBox flex flex-wrap justify-content-between m-3 gap-3\">\r\n                  <div *ngFor=\"let dayW of schedules; index as ind\" class=\"field-checkbox\">\r\n                    <p-checkbox\r\n                      name=\"group2\"\r\n                      value=\"category\"\r\n                      [value]=\"dayW\"\r\n                      [(ngModel)]=\"selectedSchedules\"\r\n                      [inputId]=\"dayW.key\"\r\n                      [disabled]=\"disableweekdays[ind]\"\r\n                      [ngModelOptions]=\"{ standalone: true }\"\r\n                      checkboxIcon=\"pi pi-check-circle\"\r\n                      (ngModelChange)=\"selectSchedules($event)\"\r\n                    ></p-checkbox>\r\n                    <label [for]=\"dayW.key\">{{ dayW.name }}</label>\r\n                  </div>\r\n                  <div *ngIf=\"messageAlertSchedules\">\r\n                    <span class=\"error-message\">Por favor selecciona una opcion</span>\r\n                  </div>\r\n              </div>\r\n            </div>\r\n            </p-accordionTab>\r\n            <p-accordionTab header=\"Modalidad\">\r\n              <div class=\"containerDay\">\r\n                <div class=\"checkBox flex flex-wrap justify-content-between m-3 gap-3\">\r\n                  <div *ngFor=\"let dayW of stateOptionsModality; index as ind\" class=\"field-checkbox\">\r\n                    <p-checkbox\r\n                      name=\"group2\"\r\n                      value=\"category\"\r\n                      [value]=\"dayW\"\r\n                      [(ngModel)]=\"selectedModality\"\r\n                      [inputId]=\"dayW.key\"\r\n                      [disabled]=\"disableweekdays[ind]\"\r\n                      [ngModelOptions]=\"{ standalone: true }\"\r\n                      checkboxIcon=\"pi pi-check-circle\"\r\n                      (ngModelChange)=\"selectModality($event)\"\r\n                    ></p-checkbox>\r\n                    <label [for]=\"dayW.key\">{{ dayW.name }}</label>\r\n                  </div>\r\n                  <div *ngIf=\"messageAlertModality\">\r\n                    <span class=\"error-message\">Por favor selecciona una opcion</span>\r\n                  </div>\r\n              </div>\r\n            </div>\r\n            </p-accordionTab>\r\n            <p-accordionTab *ngIf=\"scorePlacementTest != null\" header=\"Placement test\">\r\n              <span>Tienes un Placement Test realizado. Puedes comenzar con el nivel</span><h3>{{ scorePlacementTest?.level_inglish_next.name }}</h3>\r\n              <span>\"NO APLICA PLACEMENT TEST PARA PLANES TECNICOS\"</span>\r\n              <div class=\"containerDay mt-3\">\r\n                <h3>\u00BFDeseas iniciar en este nivel {{ scorePlacementTest?.level_inglish_next.name }}?</h3>\r\n\r\n              <div class=\"flex flex-column gap-3\">\r\n                <div *ngFor=\"let category of OptionPlacementTest; index as ind\" class=\"field-checkbox\">\r\n                    <p-radioButton\r\n                        [inputId]=\"category.key\"\r\n                        name=\"category\"\r\n                        [value]=\"category\"\r\n                        [(ngModel)]=\"selectedOptionPlacementTest\"\r\n                        [disabled]=\"disableweekdays[ind]\"\r\n                        [ngModelOptions]=\"{ standalone: true }\"\r\n                        (ngModelChange)=\"selectOpcionsPlacementTest($event)\"\r\n                        ></p-radioButton>\r\n                    <label [for]=\"category.key\" class=\"ml-2\">\r\n                        {{ category.name }}\r\n                    </label>\r\n                </div>\r\n              </div>\r\n            </div>\r\n            </p-accordionTab>\r\n            <p-accordionTab *ngIf=\"scorePlacementTest == null\" header=\"Prueba diagn\u00F3stico Placement Test\">\r\n              <span>Presenta totalmente gratis esta prueba para conocer tu nivel de ingl\u00E9s y nuestras ofertas para ti.</span>\r\n              <div class=\"containerDay mt-3\">\r\n                <ipt-button\r\n                [label]=\"'Presentar Test'\"\r\n                (onClick)=\"openTestInNewTab()\"\r\n                [primary]=\"true\">\r\n              </ipt-button>\r\n\r\n              <div class=\"flex flex-column gap-3\">\r\n\r\n            </div>\r\n            </div>\r\n            </p-accordionTab>\r\n\r\n          </p-accordion>\r\n          <div class=\"flex-none flex align-items-center justify-content-end m-2\">\r\n            <button\r\n              pTooltip=\"Buscar Planes\"\r\n              tooltipPosition=\"left\"\r\n              pButton\r\n              Ripple\r\n              type=\"button\"\r\n              icon=\"pi pi-search\"\r\n              class=\"p-button-rounded p-button-outlined\"\r\n              [disabled]=\"selectedSchedules.length === 0 || selectedModality.length === 0 || scorePlacementTest != null && selectedOptionPlacementTest.length === 0 \"\r\n              (click)=\"searchAvalaibleCourse()\"\r\n            ></button>\r\n          </div>\r\n        </div>\r\n\r\n\r\n        <ipt-card-select-course-self-cod-managed\r\n        *ngIf=\"courseSelect != null\"\r\n        [courseSelect]=\"courseSelect\">\r\n        </ipt-card-select-course-self-cod-managed>\r\n\r\n        <article *ngIf=\"visibleGroupReview\" class=\"cards-container\">\r\n\r\n          <ipt-card-course-self-cod-managed\r\n            [CourseData]=\"dataCourse\"\r\n            (codeCourse)=\"courseCode($event)\"\r\n            [isLoading]=\"isLoading\">\r\n          </ipt-card-course-self-cod-managed>\r\n        </article>\r\n      <div class=\"flex justify-content-between mt-3 align-items-center gap-3\">\r\n        <button\r\n        pButton\r\n        icon=\"pi pi-arrow-left\"\r\n        type=\"submit\"\r\n        (click)=\"back()\"\r\n        ></button>\r\n\r\n        <button\r\n        pButton\r\n        icon=\"pi pi-arrow-right\"\r\n        [disabled]=\"!codSelfFormStepTwo.valid || courseSelect === null\"\r\n        (click)=\"sendForm()\"\r\n        ></button>\r\n      </div>\r\n    </div>\r\n  </div>\r\n</div>\r\n\r\n\r\n\r\n", styles: [".container-form{margin:5%;border-radius:3px;border:1px solid #2563eb;box-shadow:#3c40434d 0 1px 2px,#3c404326 0 2px 6px 2px;padding:1rem}.error-message{font-size:x-small;color:red}:host ::ng-deep .p-toast{width:20rem!important}span{color:#999;font-size:15px;font-weight:400;pointer-events:none;left:20px;top:-20px}:host ::ng-deep .p-buttonset .p-button{box-shadow:#64646f33 0 7px 29px;border-radius:3px;border:none;outline:none;transition:.2s;font-weight:300;height:28px}:host ::ng-deep .p-calendar{position:relative;display:inline-flex;max-width:100%;height:28px;box-shadow:#64646f33 0 7px 29px;border-radius:3px;border:none;outline:none;transition:.2s;font-weight:300;width:-webkit-fill-available;width:-moz-available;background-color:#fff;-webkit-appearance:none}.cards-container{margin-top:10px}.container-button{width:7rem}.containerDay{justify-content:center;display:flex}.checkBox{gap:1rem}\n"] }]
+            args: [{ selector: 'app-cod-self-form-step-two', template: "<div class=\"container-main\">\n  <div class=\"container-form\">\n    <h2>Planes</h2>\n      <p-toast position=\"top-center\" key=\"confirm\" (onClose)=\"onReject()\" [baseZIndex]=\"10\">\n        <ng-template let-message pTemplate=\"message\">\n            <div class=\"flex flex-column align-items-start\" style=\"flex: 1\">\n                <div class=\"flex align-items-center gap-2\">\n                    <img src=\"./assets/logos/reading.png\" style=\"width: 65px;\" shape=\"circle\" />\n                    <span class=\"font-bold text-900\">Jacob</span>\n                </div>\n                <div class=\"font-medium text-lg my-3 text-900\">{{ messageInfo }}</div>\n            </div>\n        </ng-template>\n    </p-toast>\n\n    <i class=\"pi pi-exclamation-circle cursor-pointer w-auto mt-4 mb-4\" (click)=\"showConfirm()\" pTooltip=\"Mas info.\" tooltipPosition=\"bottom\"></i>\n      <div class=\"animate__animated animate__slideInRight ng-star-inserted\">\n        <div class=\"container-button\" *ngIf=\"!SearchData\">\n          <ipt-button\n            [label]=\"'Filtrar'\"\n            (onClick)=\"filterAgain()\"\n            [primary]=\"true\">\n          </ipt-button>\n        </div>\n\n        <div *ngIf=\"SearchData\">\n          <p-accordion [multiple]=\"true\" [activeIndex]=\"[0]\">\n            <p-accordionTab header=\"Jornada\">\n              <div class=\"containerDay\">\n                <div class=\"checkBox flex flex-wrap justify-content-between m-3 gap-3\">\n                  <div *ngFor=\"let dayW of schedules; index as ind\" class=\"field-checkbox\">\n                    <p-checkbox\n                      name=\"group2\"\n                      value=\"category\"\n                      [value]=\"dayW\"\n                      [(ngModel)]=\"selectedSchedules\"\n                      [inputId]=\"dayW.key\"\n                      [disabled]=\"disableweekdays[ind]\"\n                      [ngModelOptions]=\"{ standalone: true }\"\n                      checkboxIcon=\"pi pi-check-circle\"\n                      (ngModelChange)=\"selectSchedules($event)\"\n                    ></p-checkbox>\n                    <label [for]=\"dayW.key\">{{ dayW.name }}</label>\n                  </div>\n                  <div *ngIf=\"messageAlertSchedules\">\n                    <span class=\"error-message\">Por favor selecciona una opcion</span>\n                  </div>\n              </div>\n            </div>\n            </p-accordionTab>\n            <p-accordionTab header=\"Modalidad\">\n              <div class=\"containerDay\">\n                <div class=\"checkBox flex flex-wrap justify-content-between m-3 gap-3\">\n                  <div *ngFor=\"let dayW of stateOptionsModality; index as ind\" class=\"field-checkbox\">\n                    <p-checkbox\n                      name=\"group2\"\n                      value=\"category\"\n                      [value]=\"dayW\"\n                      [(ngModel)]=\"selectedModality\"\n                      [inputId]=\"dayW.key\"\n                      [disabled]=\"disableweekdays[ind]\"\n                      [ngModelOptions]=\"{ standalone: true }\"\n                      checkboxIcon=\"pi pi-check-circle\"\n                      (ngModelChange)=\"selectModality($event)\"\n                    ></p-checkbox>\n                    <label [for]=\"dayW.key\">{{ dayW.name }}</label>\n                  </div>\n                  <div *ngIf=\"messageAlertModality\">\n                    <span class=\"error-message\">Por favor selecciona una opcion</span>\n                  </div>\n              </div>\n            </div>\n            </p-accordionTab>\n            <p-accordionTab *ngIf=\"scorePlacementTest != null\" header=\"Placement test\">\n              <span>Tienes un Placement Test realizado. Puedes comenzar con el nivel</span><h3>{{ scorePlacementTest?.level_inglish_next.name }}</h3>\n              <span>\"NO APLICA PLACEMENT TEST PARA PLANES TECNICOS\"</span>\n              <div class=\"containerDay mt-3\">\n                <h3>\u00BFDeseas iniciar en este nivel {{ scorePlacementTest?.level_inglish_next.name }}?</h3>\n\n              <div class=\"flex flex-column gap-3\">\n                <div *ngFor=\"let category of OptionPlacementTest; index as ind\" class=\"field-checkbox\">\n                    <p-radioButton\n                        [inputId]=\"category.key\"\n                        name=\"category\"\n                        [value]=\"category\"\n                        [(ngModel)]=\"selectedOptionPlacementTest\"\n                        [disabled]=\"disableweekdays[ind]\"\n                        [ngModelOptions]=\"{ standalone: true }\"\n                        (ngModelChange)=\"selectOpcionsPlacementTest($event)\"\n                        ></p-radioButton>\n                    <label [for]=\"category.key\" class=\"ml-2\">\n                        {{ category.name }}\n                    </label>\n                </div>\n              </div>\n            </div>\n            </p-accordionTab>\n            <p-accordionTab *ngIf=\"scorePlacementTest == null\" header=\"Prueba diagn\u00F3stico Placement Test\">\n              <span>Presenta totalmente gratis esta prueba para conocer tu nivel de ingl\u00E9s y nuestras ofertas para ti.</span>\n              <div class=\"containerDay mt-3\">\n                <ipt-button\n                [label]=\"'Presentar Test'\"\n                (onClick)=\"openTestInNewTab()\"\n                [primary]=\"true\">\n              </ipt-button>\n\n              <div class=\"flex flex-column gap-3\">\n\n            </div>\n            </div>\n            </p-accordionTab>\n\n          </p-accordion>\n          <div class=\"flex-none flex align-items-center justify-content-end m-2\">\n            <button\n              pTooltip=\"Buscar Planes\"\n              tooltipPosition=\"left\"\n              pButton\n              Ripple\n              type=\"button\"\n              icon=\"pi pi-search\"\n              class=\"p-button-rounded p-button-outlined\"\n              [disabled]=\"selectedSchedules.length === 0 || selectedModality.length === 0 || scorePlacementTest != null && selectedOptionPlacementTest.length === 0 \"\n              (click)=\"searchAvalaibleCourse()\"\n            ></button>\n          </div>\n        </div>\n\n\n        <ipt-card-select-course-self-cod-managed\n        *ngIf=\"courseSelect != null\"\n        [courseSelect]=\"courseSelect\">\n        </ipt-card-select-course-self-cod-managed>\n\n        <article *ngIf=\"visibleGroupReview\" class=\"cards-container\">\n\n          <ipt-card-course-self-cod-managed\n            [CourseData]=\"dataCourse\"\n            (codeCourse)=\"courseCode($event)\"\n            [isLoading]=\"isLoading\">\n          </ipt-card-course-self-cod-managed>\n        </article>\n      <div class=\"flex justify-content-between mt-3 align-items-center gap-3\">\n        <button\n        pButton\n        icon=\"pi pi-arrow-left\"\n        type=\"submit\"\n        (click)=\"back()\"\n        ></button>\n\n        <button\n        pButton\n        icon=\"pi pi-arrow-right\"\n        [disabled]=\"!codSelfFormStepTwo.valid || courseSelect === null\"\n        (click)=\"sendForm()\"\n        ></button>\n      </div>\n    </div>\n  </div>\n</div>\n\n\n\n", styles: [".container-form{margin:5%;border-radius:3px;border:1px solid #2563eb;box-shadow:#3c40434d 0 1px 2px,#3c404326 0 2px 6px 2px;padding:1rem}.error-message{font-size:x-small;color:red}:host ::ng-deep .p-toast{width:20rem!important}span{color:#999;font-size:15px;font-weight:400;pointer-events:none;left:20px;top:-20px}:host ::ng-deep .p-buttonset .p-button{box-shadow:#64646f33 0 7px 29px;border-radius:3px;border:none;outline:none;transition:.2s;font-weight:300;height:28px}:host ::ng-deep .p-calendar{position:relative;display:inline-flex;max-width:100%;height:28px;box-shadow:#64646f33 0 7px 29px;border-radius:3px;border:none;outline:none;transition:.2s;font-weight:300;width:-webkit-fill-available;width:-moz-available;background-color:#fff;-webkit-appearance:none}.cards-container{margin-top:10px}.container-button{width:7rem}.containerDay{justify-content:center;display:flex}.checkBox{gap:1rem}\n"] }]
         }], ctorParameters: function () { return [{ type: i1$1.FormBuilder }, { type: i2$1.MessageService }, { type: BaseService }, { type: AcademicService }]; }, propDecorators: { completed: [{
                 type: Output
             }], scorePlacementTest: [{
@@ -7552,10 +7552,10 @@ class CodSelfFormStepThreeComponent extends CodSelfManagedSteps {
     }
 }
 CodSelfFormStepThreeComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.0.7", ngImport: i0, type: CodSelfFormStepThreeComponent, deps: [{ token: i1$1.FormBuilder }, { token: i2$1.MessageService }, { token: CommercialService }, { token: BaseService }, { token: CodSelfManagedControls }, { token: CalculateQuotesService }], target: i0.ɵɵFactoryTarget.Component });
-CodSelfFormStepThreeComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.0.7", type: CodSelfFormStepThreeComponent, selector: "app-cod-self-form-step-three", outputs: { completed: "completed", financingData: "financingData" }, usesInheritance: true, ngImport: i0, template: "<div class=\"container-main\">\r\n  <div class=\"container-form\">\r\n    <h2>Pagos</h2>\r\n    <p-toast position=\"top-center\" key=\"confirm\" (onClose)=\"onReject()\" [baseZIndex]=\"10\">\r\n      <ng-template let-message pTemplate=\"message\">\r\n          <div class=\"flex flex-column align-items-start\" style=\"flex: 1\">\r\n              <div class=\"flex align-items-center gap-2\">\r\n                  <img src=\"./assets/logos/reading.png\" style=\"width: 65px;\" shape=\"circle\" />\r\n                  <span class=\"font-bold text-900\">Jacob</span>\r\n              </div>\r\n              <div class=\"font-medium text-lg my-3 text-900\">{{ messageInfo }}</div>\r\n          </div>\r\n      </ng-template>\r\n    </p-toast>\r\n    <i class=\"pi pi-exclamation-circle cursor-pointer w-auto\" (click)=\"showConfirm()\" pTooltip=\"Mas info.\" tooltipPosition=\"bottom\"></i>\r\n    <div class=\"animate__animated animate__slideInRight ng-star-inserted\">\r\n      <div class=\"container__body__select flex justify-content-center flex-wrap\">\r\n\r\n        <form autocomplete=\"off\" [formGroup]=\"codSelfFormStepThree\" class=\"grid mt-2 flex flex-column align-items-center\">\r\n\r\n          <div class=\"container_selects col-12\">\r\n            <ipt-select\r\n              [initialValue]=\"codSelfFormStepThree.controls['payment_method'].value\"\r\n              [control]=\"codSelfFormStepThree.controls['payment_method']\"\r\n              (eventSelect)=\"selectPaymentMethod($event)\"\r\n              [data]=\"paymentMethods\"\r\n              [defaultText]=\"'M\u00E9todo de pago'\"\r\n            ></ipt-select>\r\n            <ipt-loader *ngIf=\"feeResponse\"></ipt-loader>\r\n\r\n            <div class=\"col-12\" *ngIf=\"thereArePlans\">\r\n              <p-table\r\n                [value]=\"dataPrices\"\r\n                [tableStyle]=\"{'min-width': '100%'}\"\r\n                [rowHover]=\"true\"\r\n              >\r\n                <ng-template pTemplate=\"caption\">\r\n                  <div class=\"flex align-items-center\">\r\n                    Click en niveles a cancelar\r\n                  </div>\r\n                </ng-template>\r\n                <ng-template pTemplate=\"header\">\r\n                  <tr>\r\n                    <th class=\"bg-blue-200 text-center font-medium pt-2 pb-2\"></th>\r\n                    <th class=\"bg-blue-200 text-center font-medium pt-2 pb-2\">Cancelar</th>\r\n                    <th class=\"bg-blue-200 text-center font-medium pt-2 pb-2\">Cuotas</th>\r\n                  </tr>\r\n                </ng-template>\r\n                <ng-template pTemplate=\"body\" let-data let-rowIndex=\"rowIndex\">\r\n                  <tr [class.selected-row]=\"selectedRow === rowIndex\" (click)=\"selectLevels(data, rowIndex)\">\r\n                    <td class=\"pt-0 pb-0 text-center\">\r\n                      <p-radioButton [value]=\"rowIndex\" formControlName=\"selectedRow\"></p-radioButton>\r\n                    </td>\r\n                    <td class=\"pt-1 pb-1\">{{ data.paid_level }} {{ data.paid_level == 1 ? \"Nivel\" : \"Niveles\"}}</td>\r\n                    <td class=\"pt-1 pb-1 text-center\">{{ data.fee_number }}</td>\r\n                  </tr>\r\n                </ng-template>\r\n              </p-table>\r\n            </div>\r\n          </div>\r\n\r\n          <div class=\"container_selects col-12\">\r\n            <ipt-input\r\n              [inputType]=\"'text'\"\r\n              [placeHolder]=\"'Monto total de la matr\u00EDcula'\"\r\n              [control]=\"codSelfFormStepThree.controls['total_price']\"\r\n              [withPipe]=\"true\"\r\n            ></ipt-input>\r\n          </div>\r\n\r\n          <div class=\"container_selects col-12\">\r\n            <ipt-input\r\n              [withPipe]=\"true\"\r\n              [inputType]=\"'text'\"\r\n              [control]=\"codSelfFormStepThree.controls['program_price']\"\r\n              [placeHolder]=\"'Valor total del programa'\"\r\n            ></ipt-input>\r\n          </div>\r\n\r\n          <div class=\"flex justify-content-center flex-wrap m-2\">\r\n          </div>\r\n\r\n          <!-- Tabla de financiaci\u00F3n -->\r\n          <div class=\"col-12\" *ngIf=\"codSelfFormStepThree.controls['payment_method'].value === '1' && isFinancing\">\r\n            <div class=\"flex gap-1 md:gap-4 xl:gap-8 m-1 p-2 border-round bg-blue-500 text-white\">\r\n              <div class=\"container_icon flex mr-4 justify-content-center align-items-start mt-1\">\r\n                <i class=\"pi pi-info-circle cursor-pointer w-auto mb-4\" pTooltip=\"Mas info.\" tooltipPosition=\"bottom\"></i>\r\n              </div>\r\n              <div class=\"flex flex-column container_info_span flex align-items-center justify-content-center\">\r\n                <span><strong>NOTA:</strong> Deber\u00E1 pagar la matr\u00EDcula y la primera cuota <strong>(total: ${{ totalInitialPaymentSpan }})</strong> para completar el proceso de inscripci\u00F3n.</span><br>\r\n                <span>Recuerda que las fechas cambian de acuerdo a la fecha que comienza el plan</span>\r\n              </div>\r\n            </div>\r\n\r\n            <p-table\r\n              *ngIf=\"!isLoadingSelectLevels\"\r\n              [value]=\"dataFinancing\"\r\n              [tableStyle]=\"{'min-width': '100%'}\"\r\n              [rowHover]=\"true\"\r\n            >\r\n              <ng-template pTemplate=\"caption\">\r\n                <div class=\"flex align-items-center\">\r\n                  C\u00E1lculo de cuotas\r\n                </div>\r\n              </ng-template>\r\n              <ng-template pTemplate=\"header\">\r\n                <tr>\r\n                  <th class=\"bg-blue-200 text-center font-medium pt-2 pb-2\">#</th>\r\n                  <th class=\"bg-blue-200 text-center font-medium pt-2 pb-2\">Valor</th>\r\n                  <th class=\"bg-blue-200 text-center font-medium pt-2 pb-2\">Fecha</th>\r\n                </tr>\r\n              </ng-template>\r\n              <ng-template pTemplate=\"body\" let-data>\r\n                <tr>\r\n                  <td class=\"p-0 text-center text-sm\">{{ data[0] }}</td>\r\n                  <td class=\"p-0 text-center text-sm\">{{ data[1] }}</td>\r\n                  <td class=\"p-0 text-center text-sm\">{{ data[2] }}</td>\r\n                </tr>\r\n              </ng-template>\r\n            </p-table>\r\n            <ipt-loader *ngIf=\"isLoadingSelectLevels\"></ipt-loader>\r\n          </div>\r\n\r\n        </form>\r\n      </div>\r\n\r\n      <div class=\"flex justify-content-between mt-3 align-items-center gap-3\">\r\n        <!-- <span *ngIf=\"codSelfFormStepOne.invalid && codSelfFormStepOne.touched\" class=\"text-red-500 font-bold text-center mt-1 py-2 bg-red-100 w-full border-round-xl\">{{ errorMessage }}</span> -->\r\n        <button\r\n        pButton\r\n        icon=\"pi pi-arrow-left\"\r\n        type=\"submit\"\r\n        (click)=\"back()\"\r\n        ></button>\r\n\r\n        <button\r\n        pButton\r\n        icon=\"pi pi-arrow-right\"\r\n        [disabled]=\"!codSelfFormStepThree.valid\"\r\n        (click)=\"sendForm()\"\r\n        ></button>\r\n      </div>\r\n    </div>\r\n  </div>\r\n</div>\r\n", styles: [".error-message{font-size:x-small;color:red}:host ::ng-deep .p-toast{width:20rem!important}.container-form{margin:5%;border-radius:3px;border:1px solid #2563eb;box-shadow:#3c40434d 0 1px 2px,#3c404326 0 2px 6px 2px;padding:1rem}:host ::ng-deep .p-datatable.p-datatable-hoverable-rows .p-datatable-tbody>tr:not(.p-highlight):hover{color:#1c77f7!important}.selected-row{background-color:#bfdbfe!important;color:#1c77f7!important}tr{cursor:pointer}td,.header-reports-advisers{font-family:Poppins,sans-serif}:host ::ng-deep .p-datatable .p-datatable-header{background:#f8f9fa;color:#f8f9fa;border:none;padding:1rem;font-weight:700;background-color:#1c77f7;border-radius:10px 10px 0 0}:host ::ng-deep .p-datatable{position:relative;border-radius:10px;border:1px solid #1c77f7}:host ::ng-deep .p-datatable>.p-datatable-wrapper{border-radius:0 0 10px 10px}.container_selects{width:16rem}.p-datatable .p-datatable-tbody>tr>td{padding:.1rem .5rem}:host ::ng-deep .p-datatable .p-datatable-tbody>tr>td{padding:0rem!important}\n"], dependencies: [{ kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: InputComponent, selector: "ipt-input", inputs: ["inputType", "placeHolder", "validateText", "withPipe", "list", "iconUrl", "control", "prefix", "thousands", "decimal", "disabledSel"], outputs: ["dateSelected"] }, { kind: "component", type: LoaderComponent, selector: "ipt-loader", inputs: ["message", "isDialog"] }, { kind: "component", type: SelectComponent, selector: "ipt-select", inputs: ["isRequired", "data", "defaultText", "selectCode", "disabledSel", "initialValue", "control"], outputs: ["eventSelect"] }, { kind: "directive", type: i1$1.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i1$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$1.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i1$1.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i1$1.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "directive", type: i9.Tooltip, selector: "[pTooltip]", inputs: ["tooltipPosition", "tooltipEvent", "appendTo", "positionStyle", "tooltipStyleClass", "tooltipZIndex", "escape", "showDelay", "hideDelay", "life", "positionTop", "positionLeft", "fitContent", "pTooltip", "tooltipDisabled", "tooltipOptions"] }, { kind: "directive", type: i7$1.ButtonDirective, selector: "[pButton]", inputs: ["iconPos", "loadingIcon", "label", "icon", "loading"] }, { kind: "component", type: i11.Toast, selector: "p-toast", inputs: ["key", "autoZIndex", "baseZIndex", "style", "styleClass", "position", "preventOpenDuplicates", "preventDuplicates", "showTransformOptions", "hideTransformOptions", "showTransitionOptions", "hideTransitionOptions", "breakpoints"], outputs: ["onClose"] }, { kind: "directive", type: i2$1.PrimeTemplate, selector: "[pTemplate]", inputs: ["type", "pTemplate"] }, { kind: "component", type: i14.RadioButton, selector: "p-radioButton", inputs: ["value", "formControlName", "name", "disabled", "label", "tabindex", "inputId", "ariaLabelledBy", "ariaLabel", "style", "styleClass", "labelStyleClass"], outputs: ["onClick", "onFocus", "onBlur"] }, { kind: "component", type: i13.Table, selector: "p-table", inputs: ["frozenColumns", "frozenValue", "style", "styleClass", "tableStyle", "tableStyleClass", "paginator", "pageLinks", "rowsPerPageOptions", "alwaysShowPaginator", "paginatorPosition", "paginatorDropdownAppendTo", "paginatorDropdownScrollHeight", "currentPageReportTemplate", "showCurrentPageReport", "showJumpToPageDropdown", "showJumpToPageInput", "showFirstLastIcon", "showPageLinks", "defaultSortOrder", "sortMode", "resetPageOnSort", "selectionMode", "selectionPageOnly", "contextMenuSelection", "contextMenuSelectionMode", "dataKey", "metaKeySelection", "rowSelectable", "rowTrackBy", "lazy", "lazyLoadOnInit", "compareSelectionBy", "csvSeparator", "exportFilename", "filters", "globalFilterFields", "filterDelay", "filterLocale", "expandedRowKeys", "editingRowKeys", "rowExpandMode", "scrollable", "scrollDirection", "rowGroupMode", "scrollHeight", "virtualScroll", "virtualScrollItemSize", "virtualScrollOptions", "virtualScrollDelay", "frozenWidth", "responsive", "contextMenu", "resizableColumns", "columnResizeMode", "reorderableColumns", "loading", "loadingIcon", "showLoader", "rowHover", "customSort", "showInitialSortBadge", "autoLayout", "exportFunction", "exportHeader", "stateKey", "stateStorage", "editMode", "groupRowsBy", "groupRowsByOrder", "responsiveLayout", "breakpoint", "virtualRowHeight", "value", "columns", "first", "rows", "totalRecords", "sortField", "sortOrder", "multiSortMeta", "selection", "selectAll"], outputs: ["selectAllChange", "selectionChange", "contextMenuSelectionChange", "onRowSelect", "onRowUnselect", "onPage", "onSort", "onFilter", "onLazyLoad", "onRowExpand", "onRowCollapse", "onContextMenuSelect", "onColResize", "onColReorder", "onRowReorder", "onEditInit", "onEditComplete", "onEditCancel", "onHeaderCheckboxToggle", "sortFunction", "firstChange", "rowsChange", "onStateSave", "onStateRestore"] }] });
+CodSelfFormStepThreeComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.0.7", type: CodSelfFormStepThreeComponent, selector: "app-cod-self-form-step-three", outputs: { completed: "completed", financingData: "financingData" }, usesInheritance: true, ngImport: i0, template: "<div class=\"container-main\">\n  <div class=\"container-form\">\n    <h2>Pagos</h2>\n    <p-toast position=\"top-center\" key=\"confirm\" (onClose)=\"onReject()\" [baseZIndex]=\"10\">\n      <ng-template let-message pTemplate=\"message\">\n          <div class=\"flex flex-column align-items-start\" style=\"flex: 1\">\n              <div class=\"flex align-items-center gap-2\">\n                  <img src=\"./assets/logos/reading.png\" style=\"width: 65px;\" shape=\"circle\" />\n                  <span class=\"font-bold text-900\">Jacob</span>\n              </div>\n              <div class=\"font-medium text-lg my-3 text-900\">{{ messageInfo }}</div>\n          </div>\n      </ng-template>\n    </p-toast>\n    <i class=\"pi pi-exclamation-circle cursor-pointer w-auto\" (click)=\"showConfirm()\" pTooltip=\"Mas info.\" tooltipPosition=\"bottom\"></i>\n    <div class=\"animate__animated animate__slideInRight ng-star-inserted\">\n      <div class=\"container__body__select flex justify-content-center flex-wrap\">\n\n        <form autocomplete=\"off\" [formGroup]=\"codSelfFormStepThree\" class=\"grid mt-2 flex flex-column align-items-center\">\n\n          <div class=\"container_selects col-12\">\n            <ipt-select\n              [initialValue]=\"codSelfFormStepThree.controls['payment_method'].value\"\n              [control]=\"codSelfFormStepThree.controls['payment_method']\"\n              (eventSelect)=\"selectPaymentMethod($event)\"\n              [data]=\"paymentMethods\"\n              [defaultText]=\"'M\u00E9todo de pago'\"\n            ></ipt-select>\n            <ipt-loader *ngIf=\"feeResponse\"></ipt-loader>\n\n            <div class=\"col-12\" *ngIf=\"thereArePlans\">\n              <p-table\n                [value]=\"dataPrices\"\n                [tableStyle]=\"{'min-width': '100%'}\"\n                [rowHover]=\"true\"\n              >\n                <ng-template pTemplate=\"caption\">\n                  <div class=\"flex align-items-center\">\n                    Click en niveles a cancelar\n                  </div>\n                </ng-template>\n                <ng-template pTemplate=\"header\">\n                  <tr>\n                    <th class=\"bg-blue-200 text-center font-medium pt-2 pb-2\"></th>\n                    <th class=\"bg-blue-200 text-center font-medium pt-2 pb-2\">Cancelar</th>\n                    <th class=\"bg-blue-200 text-center font-medium pt-2 pb-2\">Cuotas</th>\n                  </tr>\n                </ng-template>\n                <ng-template pTemplate=\"body\" let-data let-rowIndex=\"rowIndex\">\n                  <tr [class.selected-row]=\"selectedRow === rowIndex\" (click)=\"selectLevels(data, rowIndex)\">\n                    <td class=\"pt-0 pb-0 text-center\">\n                      <p-radioButton [value]=\"rowIndex\" formControlName=\"selectedRow\"></p-radioButton>\n                    </td>\n                    <td class=\"pt-1 pb-1\">{{ data.paid_level }} {{ data.paid_level == 1 ? \"Nivel\" : \"Niveles\"}}</td>\n                    <td class=\"pt-1 pb-1 text-center\">{{ data.fee_number }}</td>\n                  </tr>\n                </ng-template>\n              </p-table>\n            </div>\n          </div>\n\n          <div class=\"container_selects col-12\">\n            <ipt-input\n              [inputType]=\"'text'\"\n              [placeHolder]=\"'Monto total de la matr\u00EDcula'\"\n              [control]=\"codSelfFormStepThree.controls['total_price']\"\n              [withPipe]=\"true\"\n            ></ipt-input>\n          </div>\n\n          <div class=\"container_selects col-12\">\n            <ipt-input\n              [withPipe]=\"true\"\n              [inputType]=\"'text'\"\n              [control]=\"codSelfFormStepThree.controls['program_price']\"\n              [placeHolder]=\"'Valor total del programa'\"\n            ></ipt-input>\n          </div>\n\n          <div class=\"flex justify-content-center flex-wrap m-2\">\n          </div>\n\n          <!-- Tabla de financiaci\u00F3n -->\n          <div class=\"col-12\" *ngIf=\"codSelfFormStepThree.controls['payment_method'].value === '1' && isFinancing\">\n            <div class=\"flex gap-1 md:gap-4 xl:gap-8 m-1 p-2 border-round bg-blue-500 text-white\">\n              <div class=\"container_icon flex mr-4 justify-content-center align-items-start mt-1\">\n                <i class=\"pi pi-info-circle cursor-pointer w-auto mb-4\" pTooltip=\"Mas info.\" tooltipPosition=\"bottom\"></i>\n              </div>\n              <div class=\"flex flex-column container_info_span flex align-items-center justify-content-center\">\n                <span><strong>NOTA:</strong> Deber\u00E1 pagar la matr\u00EDcula y la primera cuota <strong>(total: ${{ totalInitialPaymentSpan }})</strong> para completar el proceso de inscripci\u00F3n.</span><br>\n                <span>Recuerda que las fechas cambian de acuerdo a la fecha que comienza el plan</span>\n              </div>\n            </div>\n\n            <p-table\n              *ngIf=\"!isLoadingSelectLevels\"\n              [value]=\"dataFinancing\"\n              [tableStyle]=\"{'min-width': '100%'}\"\n              [rowHover]=\"true\"\n            >\n              <ng-template pTemplate=\"caption\">\n                <div class=\"flex align-items-center\">\n                  C\u00E1lculo de cuotas\n                </div>\n              </ng-template>\n              <ng-template pTemplate=\"header\">\n                <tr>\n                  <th class=\"bg-blue-200 text-center font-medium pt-2 pb-2\">#</th>\n                  <th class=\"bg-blue-200 text-center font-medium pt-2 pb-2\">Valor</th>\n                  <th class=\"bg-blue-200 text-center font-medium pt-2 pb-2\">Fecha</th>\n                </tr>\n              </ng-template>\n              <ng-template pTemplate=\"body\" let-data>\n                <tr>\n                  <td class=\"p-0 text-center text-sm\">{{ data[0] }}</td>\n                  <td class=\"p-0 text-center text-sm\">{{ data[1] }}</td>\n                  <td class=\"p-0 text-center text-sm\">{{ data[2] }}</td>\n                </tr>\n              </ng-template>\n            </p-table>\n            <ipt-loader *ngIf=\"isLoadingSelectLevels\"></ipt-loader>\n          </div>\n\n        </form>\n      </div>\n\n      <div class=\"flex justify-content-between mt-3 align-items-center gap-3\">\n        <!-- <span *ngIf=\"codSelfFormStepOne.invalid && codSelfFormStepOne.touched\" class=\"text-red-500 font-bold text-center mt-1 py-2 bg-red-100 w-full border-round-xl\">{{ errorMessage }}</span> -->\n        <button\n        pButton\n        icon=\"pi pi-arrow-left\"\n        type=\"submit\"\n        (click)=\"back()\"\n        ></button>\n\n        <button\n        pButton\n        icon=\"pi pi-arrow-right\"\n        [disabled]=\"!codSelfFormStepThree.valid\"\n        (click)=\"sendForm()\"\n        ></button>\n      </div>\n    </div>\n  </div>\n</div>\n", styles: [".error-message{font-size:x-small;color:red}:host ::ng-deep .p-toast{width:20rem!important}.container-form{margin:5%;border-radius:3px;border:1px solid #2563eb;box-shadow:#3c40434d 0 1px 2px,#3c404326 0 2px 6px 2px;padding:1rem}:host ::ng-deep .p-datatable.p-datatable-hoverable-rows .p-datatable-tbody>tr:not(.p-highlight):hover{color:#1c77f7!important}.selected-row{background-color:#bfdbfe!important;color:#1c77f7!important}tr{cursor:pointer}td,.header-reports-advisers{font-family:Poppins,sans-serif}:host ::ng-deep .p-datatable .p-datatable-header{background:#f8f9fa;color:#f8f9fa;border:none;padding:1rem;font-weight:700;background-color:#1c77f7;border-radius:10px 10px 0 0}:host ::ng-deep .p-datatable{position:relative;border-radius:10px;border:1px solid #1c77f7}:host ::ng-deep .p-datatable>.p-datatable-wrapper{border-radius:0 0 10px 10px}.container_selects{width:16rem}.p-datatable .p-datatable-tbody>tr>td{padding:.1rem .5rem}:host ::ng-deep .p-datatable .p-datatable-tbody>tr>td{padding:0rem!important}\n"], dependencies: [{ kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: InputComponent, selector: "ipt-input", inputs: ["inputType", "placeHolder", "validateText", "withPipe", "list", "iconUrl", "control", "prefix", "thousands", "decimal", "disabledSel"], outputs: ["dateSelected"] }, { kind: "component", type: LoaderComponent, selector: "ipt-loader", inputs: ["message", "isDialog"] }, { kind: "component", type: SelectComponent, selector: "ipt-select", inputs: ["isRequired", "data", "defaultText", "selectCode", "disabledSel", "initialValue", "control"], outputs: ["eventSelect"] }, { kind: "directive", type: i1$1.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i1$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$1.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i1$1.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i1$1.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "directive", type: i9.Tooltip, selector: "[pTooltip]", inputs: ["tooltipPosition", "tooltipEvent", "appendTo", "positionStyle", "tooltipStyleClass", "tooltipZIndex", "escape", "showDelay", "hideDelay", "life", "positionTop", "positionLeft", "fitContent", "pTooltip", "tooltipDisabled", "tooltipOptions"] }, { kind: "directive", type: i7$1.ButtonDirective, selector: "[pButton]", inputs: ["iconPos", "loadingIcon", "label", "icon", "loading"] }, { kind: "component", type: i11.Toast, selector: "p-toast", inputs: ["key", "autoZIndex", "baseZIndex", "style", "styleClass", "position", "preventOpenDuplicates", "preventDuplicates", "showTransformOptions", "hideTransformOptions", "showTransitionOptions", "hideTransitionOptions", "breakpoints"], outputs: ["onClose"] }, { kind: "directive", type: i2$1.PrimeTemplate, selector: "[pTemplate]", inputs: ["type", "pTemplate"] }, { kind: "component", type: i14.RadioButton, selector: "p-radioButton", inputs: ["value", "formControlName", "name", "disabled", "label", "tabindex", "inputId", "ariaLabelledBy", "ariaLabel", "style", "styleClass", "labelStyleClass"], outputs: ["onClick", "onFocus", "onBlur"] }, { kind: "component", type: i13.Table, selector: "p-table", inputs: ["frozenColumns", "frozenValue", "style", "styleClass", "tableStyle", "tableStyleClass", "paginator", "pageLinks", "rowsPerPageOptions", "alwaysShowPaginator", "paginatorPosition", "paginatorDropdownAppendTo", "paginatorDropdownScrollHeight", "currentPageReportTemplate", "showCurrentPageReport", "showJumpToPageDropdown", "showJumpToPageInput", "showFirstLastIcon", "showPageLinks", "defaultSortOrder", "sortMode", "resetPageOnSort", "selectionMode", "selectionPageOnly", "contextMenuSelection", "contextMenuSelectionMode", "dataKey", "metaKeySelection", "rowSelectable", "rowTrackBy", "lazy", "lazyLoadOnInit", "compareSelectionBy", "csvSeparator", "exportFilename", "filters", "globalFilterFields", "filterDelay", "filterLocale", "expandedRowKeys", "editingRowKeys", "rowExpandMode", "scrollable", "scrollDirection", "rowGroupMode", "scrollHeight", "virtualScroll", "virtualScrollItemSize", "virtualScrollOptions", "virtualScrollDelay", "frozenWidth", "responsive", "contextMenu", "resizableColumns", "columnResizeMode", "reorderableColumns", "loading", "loadingIcon", "showLoader", "rowHover", "customSort", "showInitialSortBadge", "autoLayout", "exportFunction", "exportHeader", "stateKey", "stateStorage", "editMode", "groupRowsBy", "groupRowsByOrder", "responsiveLayout", "breakpoint", "virtualRowHeight", "value", "columns", "first", "rows", "totalRecords", "sortField", "sortOrder", "multiSortMeta", "selection", "selectAll"], outputs: ["selectAllChange", "selectionChange", "contextMenuSelectionChange", "onRowSelect", "onRowUnselect", "onPage", "onSort", "onFilter", "onLazyLoad", "onRowExpand", "onRowCollapse", "onContextMenuSelect", "onColResize", "onColReorder", "onRowReorder", "onEditInit", "onEditComplete", "onEditCancel", "onHeaderCheckboxToggle", "sortFunction", "firstChange", "rowsChange", "onStateSave", "onStateRestore"] }] });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.0.7", ngImport: i0, type: CodSelfFormStepThreeComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'app-cod-self-form-step-three', template: "<div class=\"container-main\">\r\n  <div class=\"container-form\">\r\n    <h2>Pagos</h2>\r\n    <p-toast position=\"top-center\" key=\"confirm\" (onClose)=\"onReject()\" [baseZIndex]=\"10\">\r\n      <ng-template let-message pTemplate=\"message\">\r\n          <div class=\"flex flex-column align-items-start\" style=\"flex: 1\">\r\n              <div class=\"flex align-items-center gap-2\">\r\n                  <img src=\"./assets/logos/reading.png\" style=\"width: 65px;\" shape=\"circle\" />\r\n                  <span class=\"font-bold text-900\">Jacob</span>\r\n              </div>\r\n              <div class=\"font-medium text-lg my-3 text-900\">{{ messageInfo }}</div>\r\n          </div>\r\n      </ng-template>\r\n    </p-toast>\r\n    <i class=\"pi pi-exclamation-circle cursor-pointer w-auto\" (click)=\"showConfirm()\" pTooltip=\"Mas info.\" tooltipPosition=\"bottom\"></i>\r\n    <div class=\"animate__animated animate__slideInRight ng-star-inserted\">\r\n      <div class=\"container__body__select flex justify-content-center flex-wrap\">\r\n\r\n        <form autocomplete=\"off\" [formGroup]=\"codSelfFormStepThree\" class=\"grid mt-2 flex flex-column align-items-center\">\r\n\r\n          <div class=\"container_selects col-12\">\r\n            <ipt-select\r\n              [initialValue]=\"codSelfFormStepThree.controls['payment_method'].value\"\r\n              [control]=\"codSelfFormStepThree.controls['payment_method']\"\r\n              (eventSelect)=\"selectPaymentMethod($event)\"\r\n              [data]=\"paymentMethods\"\r\n              [defaultText]=\"'M\u00E9todo de pago'\"\r\n            ></ipt-select>\r\n            <ipt-loader *ngIf=\"feeResponse\"></ipt-loader>\r\n\r\n            <div class=\"col-12\" *ngIf=\"thereArePlans\">\r\n              <p-table\r\n                [value]=\"dataPrices\"\r\n                [tableStyle]=\"{'min-width': '100%'}\"\r\n                [rowHover]=\"true\"\r\n              >\r\n                <ng-template pTemplate=\"caption\">\r\n                  <div class=\"flex align-items-center\">\r\n                    Click en niveles a cancelar\r\n                  </div>\r\n                </ng-template>\r\n                <ng-template pTemplate=\"header\">\r\n                  <tr>\r\n                    <th class=\"bg-blue-200 text-center font-medium pt-2 pb-2\"></th>\r\n                    <th class=\"bg-blue-200 text-center font-medium pt-2 pb-2\">Cancelar</th>\r\n                    <th class=\"bg-blue-200 text-center font-medium pt-2 pb-2\">Cuotas</th>\r\n                  </tr>\r\n                </ng-template>\r\n                <ng-template pTemplate=\"body\" let-data let-rowIndex=\"rowIndex\">\r\n                  <tr [class.selected-row]=\"selectedRow === rowIndex\" (click)=\"selectLevels(data, rowIndex)\">\r\n                    <td class=\"pt-0 pb-0 text-center\">\r\n                      <p-radioButton [value]=\"rowIndex\" formControlName=\"selectedRow\"></p-radioButton>\r\n                    </td>\r\n                    <td class=\"pt-1 pb-1\">{{ data.paid_level }} {{ data.paid_level == 1 ? \"Nivel\" : \"Niveles\"}}</td>\r\n                    <td class=\"pt-1 pb-1 text-center\">{{ data.fee_number }}</td>\r\n                  </tr>\r\n                </ng-template>\r\n              </p-table>\r\n            </div>\r\n          </div>\r\n\r\n          <div class=\"container_selects col-12\">\r\n            <ipt-input\r\n              [inputType]=\"'text'\"\r\n              [placeHolder]=\"'Monto total de la matr\u00EDcula'\"\r\n              [control]=\"codSelfFormStepThree.controls['total_price']\"\r\n              [withPipe]=\"true\"\r\n            ></ipt-input>\r\n          </div>\r\n\r\n          <div class=\"container_selects col-12\">\r\n            <ipt-input\r\n              [withPipe]=\"true\"\r\n              [inputType]=\"'text'\"\r\n              [control]=\"codSelfFormStepThree.controls['program_price']\"\r\n              [placeHolder]=\"'Valor total del programa'\"\r\n            ></ipt-input>\r\n          </div>\r\n\r\n          <div class=\"flex justify-content-center flex-wrap m-2\">\r\n          </div>\r\n\r\n          <!-- Tabla de financiaci\u00F3n -->\r\n          <div class=\"col-12\" *ngIf=\"codSelfFormStepThree.controls['payment_method'].value === '1' && isFinancing\">\r\n            <div class=\"flex gap-1 md:gap-4 xl:gap-8 m-1 p-2 border-round bg-blue-500 text-white\">\r\n              <div class=\"container_icon flex mr-4 justify-content-center align-items-start mt-1\">\r\n                <i class=\"pi pi-info-circle cursor-pointer w-auto mb-4\" pTooltip=\"Mas info.\" tooltipPosition=\"bottom\"></i>\r\n              </div>\r\n              <div class=\"flex flex-column container_info_span flex align-items-center justify-content-center\">\r\n                <span><strong>NOTA:</strong> Deber\u00E1 pagar la matr\u00EDcula y la primera cuota <strong>(total: ${{ totalInitialPaymentSpan }})</strong> para completar el proceso de inscripci\u00F3n.</span><br>\r\n                <span>Recuerda que las fechas cambian de acuerdo a la fecha que comienza el plan</span>\r\n              </div>\r\n            </div>\r\n\r\n            <p-table\r\n              *ngIf=\"!isLoadingSelectLevels\"\r\n              [value]=\"dataFinancing\"\r\n              [tableStyle]=\"{'min-width': '100%'}\"\r\n              [rowHover]=\"true\"\r\n            >\r\n              <ng-template pTemplate=\"caption\">\r\n                <div class=\"flex align-items-center\">\r\n                  C\u00E1lculo de cuotas\r\n                </div>\r\n              </ng-template>\r\n              <ng-template pTemplate=\"header\">\r\n                <tr>\r\n                  <th class=\"bg-blue-200 text-center font-medium pt-2 pb-2\">#</th>\r\n                  <th class=\"bg-blue-200 text-center font-medium pt-2 pb-2\">Valor</th>\r\n                  <th class=\"bg-blue-200 text-center font-medium pt-2 pb-2\">Fecha</th>\r\n                </tr>\r\n              </ng-template>\r\n              <ng-template pTemplate=\"body\" let-data>\r\n                <tr>\r\n                  <td class=\"p-0 text-center text-sm\">{{ data[0] }}</td>\r\n                  <td class=\"p-0 text-center text-sm\">{{ data[1] }}</td>\r\n                  <td class=\"p-0 text-center text-sm\">{{ data[2] }}</td>\r\n                </tr>\r\n              </ng-template>\r\n            </p-table>\r\n            <ipt-loader *ngIf=\"isLoadingSelectLevels\"></ipt-loader>\r\n          </div>\r\n\r\n        </form>\r\n      </div>\r\n\r\n      <div class=\"flex justify-content-between mt-3 align-items-center gap-3\">\r\n        <!-- <span *ngIf=\"codSelfFormStepOne.invalid && codSelfFormStepOne.touched\" class=\"text-red-500 font-bold text-center mt-1 py-2 bg-red-100 w-full border-round-xl\">{{ errorMessage }}</span> -->\r\n        <button\r\n        pButton\r\n        icon=\"pi pi-arrow-left\"\r\n        type=\"submit\"\r\n        (click)=\"back()\"\r\n        ></button>\r\n\r\n        <button\r\n        pButton\r\n        icon=\"pi pi-arrow-right\"\r\n        [disabled]=\"!codSelfFormStepThree.valid\"\r\n        (click)=\"sendForm()\"\r\n        ></button>\r\n      </div>\r\n    </div>\r\n  </div>\r\n</div>\r\n", styles: [".error-message{font-size:x-small;color:red}:host ::ng-deep .p-toast{width:20rem!important}.container-form{margin:5%;border-radius:3px;border:1px solid #2563eb;box-shadow:#3c40434d 0 1px 2px,#3c404326 0 2px 6px 2px;padding:1rem}:host ::ng-deep .p-datatable.p-datatable-hoverable-rows .p-datatable-tbody>tr:not(.p-highlight):hover{color:#1c77f7!important}.selected-row{background-color:#bfdbfe!important;color:#1c77f7!important}tr{cursor:pointer}td,.header-reports-advisers{font-family:Poppins,sans-serif}:host ::ng-deep .p-datatable .p-datatable-header{background:#f8f9fa;color:#f8f9fa;border:none;padding:1rem;font-weight:700;background-color:#1c77f7;border-radius:10px 10px 0 0}:host ::ng-deep .p-datatable{position:relative;border-radius:10px;border:1px solid #1c77f7}:host ::ng-deep .p-datatable>.p-datatable-wrapper{border-radius:0 0 10px 10px}.container_selects{width:16rem}.p-datatable .p-datatable-tbody>tr>td{padding:.1rem .5rem}:host ::ng-deep .p-datatable .p-datatable-tbody>tr>td{padding:0rem!important}\n"] }]
+            args: [{ selector: 'app-cod-self-form-step-three', template: "<div class=\"container-main\">\n  <div class=\"container-form\">\n    <h2>Pagos</h2>\n    <p-toast position=\"top-center\" key=\"confirm\" (onClose)=\"onReject()\" [baseZIndex]=\"10\">\n      <ng-template let-message pTemplate=\"message\">\n          <div class=\"flex flex-column align-items-start\" style=\"flex: 1\">\n              <div class=\"flex align-items-center gap-2\">\n                  <img src=\"./assets/logos/reading.png\" style=\"width: 65px;\" shape=\"circle\" />\n                  <span class=\"font-bold text-900\">Jacob</span>\n              </div>\n              <div class=\"font-medium text-lg my-3 text-900\">{{ messageInfo }}</div>\n          </div>\n      </ng-template>\n    </p-toast>\n    <i class=\"pi pi-exclamation-circle cursor-pointer w-auto\" (click)=\"showConfirm()\" pTooltip=\"Mas info.\" tooltipPosition=\"bottom\"></i>\n    <div class=\"animate__animated animate__slideInRight ng-star-inserted\">\n      <div class=\"container__body__select flex justify-content-center flex-wrap\">\n\n        <form autocomplete=\"off\" [formGroup]=\"codSelfFormStepThree\" class=\"grid mt-2 flex flex-column align-items-center\">\n\n          <div class=\"container_selects col-12\">\n            <ipt-select\n              [initialValue]=\"codSelfFormStepThree.controls['payment_method'].value\"\n              [control]=\"codSelfFormStepThree.controls['payment_method']\"\n              (eventSelect)=\"selectPaymentMethod($event)\"\n              [data]=\"paymentMethods\"\n              [defaultText]=\"'M\u00E9todo de pago'\"\n            ></ipt-select>\n            <ipt-loader *ngIf=\"feeResponse\"></ipt-loader>\n\n            <div class=\"col-12\" *ngIf=\"thereArePlans\">\n              <p-table\n                [value]=\"dataPrices\"\n                [tableStyle]=\"{'min-width': '100%'}\"\n                [rowHover]=\"true\"\n              >\n                <ng-template pTemplate=\"caption\">\n                  <div class=\"flex align-items-center\">\n                    Click en niveles a cancelar\n                  </div>\n                </ng-template>\n                <ng-template pTemplate=\"header\">\n                  <tr>\n                    <th class=\"bg-blue-200 text-center font-medium pt-2 pb-2\"></th>\n                    <th class=\"bg-blue-200 text-center font-medium pt-2 pb-2\">Cancelar</th>\n                    <th class=\"bg-blue-200 text-center font-medium pt-2 pb-2\">Cuotas</th>\n                  </tr>\n                </ng-template>\n                <ng-template pTemplate=\"body\" let-data let-rowIndex=\"rowIndex\">\n                  <tr [class.selected-row]=\"selectedRow === rowIndex\" (click)=\"selectLevels(data, rowIndex)\">\n                    <td class=\"pt-0 pb-0 text-center\">\n                      <p-radioButton [value]=\"rowIndex\" formControlName=\"selectedRow\"></p-radioButton>\n                    </td>\n                    <td class=\"pt-1 pb-1\">{{ data.paid_level }} {{ data.paid_level == 1 ? \"Nivel\" : \"Niveles\"}}</td>\n                    <td class=\"pt-1 pb-1 text-center\">{{ data.fee_number }}</td>\n                  </tr>\n                </ng-template>\n              </p-table>\n            </div>\n          </div>\n\n          <div class=\"container_selects col-12\">\n            <ipt-input\n              [inputType]=\"'text'\"\n              [placeHolder]=\"'Monto total de la matr\u00EDcula'\"\n              [control]=\"codSelfFormStepThree.controls['total_price']\"\n              [withPipe]=\"true\"\n            ></ipt-input>\n          </div>\n\n          <div class=\"container_selects col-12\">\n            <ipt-input\n              [withPipe]=\"true\"\n              [inputType]=\"'text'\"\n              [control]=\"codSelfFormStepThree.controls['program_price']\"\n              [placeHolder]=\"'Valor total del programa'\"\n            ></ipt-input>\n          </div>\n\n          <div class=\"flex justify-content-center flex-wrap m-2\">\n          </div>\n\n          <!-- Tabla de financiaci\u00F3n -->\n          <div class=\"col-12\" *ngIf=\"codSelfFormStepThree.controls['payment_method'].value === '1' && isFinancing\">\n            <div class=\"flex gap-1 md:gap-4 xl:gap-8 m-1 p-2 border-round bg-blue-500 text-white\">\n              <div class=\"container_icon flex mr-4 justify-content-center align-items-start mt-1\">\n                <i class=\"pi pi-info-circle cursor-pointer w-auto mb-4\" pTooltip=\"Mas info.\" tooltipPosition=\"bottom\"></i>\n              </div>\n              <div class=\"flex flex-column container_info_span flex align-items-center justify-content-center\">\n                <span><strong>NOTA:</strong> Deber\u00E1 pagar la matr\u00EDcula y la primera cuota <strong>(total: ${{ totalInitialPaymentSpan }})</strong> para completar el proceso de inscripci\u00F3n.</span><br>\n                <span>Recuerda que las fechas cambian de acuerdo a la fecha que comienza el plan</span>\n              </div>\n            </div>\n\n            <p-table\n              *ngIf=\"!isLoadingSelectLevels\"\n              [value]=\"dataFinancing\"\n              [tableStyle]=\"{'min-width': '100%'}\"\n              [rowHover]=\"true\"\n            >\n              <ng-template pTemplate=\"caption\">\n                <div class=\"flex align-items-center\">\n                  C\u00E1lculo de cuotas\n                </div>\n              </ng-template>\n              <ng-template pTemplate=\"header\">\n                <tr>\n                  <th class=\"bg-blue-200 text-center font-medium pt-2 pb-2\">#</th>\n                  <th class=\"bg-blue-200 text-center font-medium pt-2 pb-2\">Valor</th>\n                  <th class=\"bg-blue-200 text-center font-medium pt-2 pb-2\">Fecha</th>\n                </tr>\n              </ng-template>\n              <ng-template pTemplate=\"body\" let-data>\n                <tr>\n                  <td class=\"p-0 text-center text-sm\">{{ data[0] }}</td>\n                  <td class=\"p-0 text-center text-sm\">{{ data[1] }}</td>\n                  <td class=\"p-0 text-center text-sm\">{{ data[2] }}</td>\n                </tr>\n              </ng-template>\n            </p-table>\n            <ipt-loader *ngIf=\"isLoadingSelectLevels\"></ipt-loader>\n          </div>\n\n        </form>\n      </div>\n\n      <div class=\"flex justify-content-between mt-3 align-items-center gap-3\">\n        <!-- <span *ngIf=\"codSelfFormStepOne.invalid && codSelfFormStepOne.touched\" class=\"text-red-500 font-bold text-center mt-1 py-2 bg-red-100 w-full border-round-xl\">{{ errorMessage }}</span> -->\n        <button\n        pButton\n        icon=\"pi pi-arrow-left\"\n        type=\"submit\"\n        (click)=\"back()\"\n        ></button>\n\n        <button\n        pButton\n        icon=\"pi pi-arrow-right\"\n        [disabled]=\"!codSelfFormStepThree.valid\"\n        (click)=\"sendForm()\"\n        ></button>\n      </div>\n    </div>\n  </div>\n</div>\n", styles: [".error-message{font-size:x-small;color:red}:host ::ng-deep .p-toast{width:20rem!important}.container-form{margin:5%;border-radius:3px;border:1px solid #2563eb;box-shadow:#3c40434d 0 1px 2px,#3c404326 0 2px 6px 2px;padding:1rem}:host ::ng-deep .p-datatable.p-datatable-hoverable-rows .p-datatable-tbody>tr:not(.p-highlight):hover{color:#1c77f7!important}.selected-row{background-color:#bfdbfe!important;color:#1c77f7!important}tr{cursor:pointer}td,.header-reports-advisers{font-family:Poppins,sans-serif}:host ::ng-deep .p-datatable .p-datatable-header{background:#f8f9fa;color:#f8f9fa;border:none;padding:1rem;font-weight:700;background-color:#1c77f7;border-radius:10px 10px 0 0}:host ::ng-deep .p-datatable{position:relative;border-radius:10px;border:1px solid #1c77f7}:host ::ng-deep .p-datatable>.p-datatable-wrapper{border-radius:0 0 10px 10px}.container_selects{width:16rem}.p-datatable .p-datatable-tbody>tr>td{padding:.1rem .5rem}:host ::ng-deep .p-datatable .p-datatable-tbody>tr>td{padding:0rem!important}\n"] }]
         }], ctorParameters: function () { return [{ type: i1$1.FormBuilder }, { type: i2$1.MessageService }, { type: CommercialService }, { type: BaseService }, { type: CodSelfManagedControls }, { type: CalculateQuotesService }]; }, propDecorators: { completed: [{
                 type: Output
             }], financingData: [{
@@ -7579,7 +7579,8 @@ class CodSelfFormStepFourComponent extends CodSelfManagedSteps {
         this.isEditBillingData = true;
         this.OptionPayments = [
             { code: 1, key: 'in', name: 'Instalaciones' },
-            { code: 3, key: 'tr', name: 'Transferencia' },
+            // { code: 2, key: 'tr', name: 'Transferencia' },
+            { code: 3, key: 'ps', name: 'Pasarela pagos' },
         ];
         this.studentIdCardType = new FormControl();
         this.initForm();
@@ -7683,7 +7684,7 @@ class CodSelfFormStepFourComponent extends CodSelfManagedSteps {
             if (this.selectedOptionPayments.code === 1) { // Instalaciones
                 this.addValidators();
             }
-            else if (this.selectedOptionPayments.code === 3) { // Transferencia
+            else if (this.selectedOptionPayments.code === 3) { // Pasarela Pago
                 this.removeValidators();
             }
             // Aplicar el validador personalizado basado en la opción seleccionada
@@ -7728,7 +7729,7 @@ class CodSelfFormStepFourComponent extends CodSelfManagedSteps {
             return 'in';
         }
         else if (this.selectedOptionPayments?.code === 3) {
-            return 'tr';
+            return 'ps';
         }
         return 'default';
     }
@@ -7769,10 +7770,10 @@ class CodSelfFormStepFourComponent extends CodSelfManagedSteps {
     }
 }
 CodSelfFormStepFourComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.0.7", ngImport: i0, type: CodSelfFormStepFourComponent, deps: [{ token: i1$1.FormBuilder }, { token: i2$1.MessageService }, { token: CodSelfManagedControls }], target: i0.ɵɵFactoryTarget.Component });
-CodSelfFormStepFourComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.0.7", type: CodSelfFormStepFourComponent, selector: "app-cod-self-form-step-four", inputs: { idTypes: "idTypes" }, outputs: { completed: "completed", action: "action" }, usesInheritance: true, ngImport: i0, template: "<div class=\"container-main\">\r\n  <div class=\"container-form\">\r\n    <div class=\"title_step\">\r\n      <h2>Datos de Facturaci\u00F3n</h2>\r\n      <p-toast position=\"top-center\" key=\"confirm\" (onClose)=\"onReject()\" [baseZIndex]=\"10\">\r\n        <ng-template let-message pTemplate=\"message\">\r\n          <div class=\"flex flex-column align-items-start\" style=\"flex: 1\">\r\n            <div class=\"flex align-items-center gap-2\">\r\n              <img src=\"./assets/logos/reading.png\" style=\"width: 65px;\" shape=\"circle\" />\r\n              <span class=\"font-bold text-900\">Jacob</span>\r\n            </div>\r\n            <div class=\"font-medium text-lg my-3 text-900\">{{ messageInfo }}</div>\r\n          </div>\r\n        </ng-template>\r\n      </p-toast>\r\n    </div>\r\n\r\n    <i class=\"pi pi-exclamation-circle cursor-pointer w-auto \" (click)=\"showConfirm()\" pTooltip=\"M\u00E1s info.\" tooltipPosition=\"bottom\"></i>\r\n    <div class=\"animate__animated animate__slideInRight ng-star-inserted\">\r\n      <form autocomplete=\"off\" [formGroup]=\"codSelfFormStepFour\" class=\"grid mt-2 flex flex-column align-items-center\">\r\n        <div class=\"container__body__select flex justify-content-center flex-wrap\">\r\n          <div class=\"container__type__payments\" *ngIf=\"isSelectionOptionPayments\">\r\n            <div class=\"flex flex-column gap-3\">\r\n              <h3>\u00BFC\u00F3mo quieres pagar?</h3>\r\n              <div *ngFor=\"let category of OptionPayments; index as ind\" class=\"field-checkbox\">\r\n                <p-radioButton\r\n                  [inputId]=\"category.key\"\r\n                  name=\"category\"\r\n                  [value]=\"category\"\r\n                  [(ngModel)]=\"selectedOptionPayments\"\r\n                  [disabled]=\"disableweekdays[ind]\"\r\n                  [ngModelOptions]=\"{ standalone: true }\"\r\n                  (ngModelChange)=\"selectOpcionsPayments($event)\"\r\n                ></p-radioButton>\r\n                <label [for]=\"category.key\" class=\"ml-2\">\r\n                  {{ category.name }}\r\n                </label>\r\n              </div>\r\n            </div>\r\n          </div>\r\n\r\n          <div class=\"container__option__instalations\" *ngIf=\"!isSelectionOptionPayments\">\r\n            <!-- Vista para la opci\u00F3n de pago \"Instalaciones\" -->\r\n            <div *ngIf=\"getViewBasedOnPaymentOption() === 'in'\">\r\n              <div class=\"container__info flex flex-column align-items-center justify-content-center mt-1 mb-4\" *ngIf=\"isEditBillingData\">\r\n                <img src=\"./assets/logos/lobo-web.png\" alt=\"Receipt Icon\" shape=\"circle\" class=\"circular-image\" />\r\n                <strong>{{ codSelfFormStepFour.get('invoicing_name')?.value }} {{ codSelfFormStepFour.get('invoicing_Apellido')?.value }}</strong>\r\n                <span>{{ getIdTypeDescription(codSelfFormStepFour.get('invoicing_idType')?.value) }} {{ codSelfFormStepFour.get('invoicing_document')?.value }}</span>\r\n                <div class=\"container-button\">\r\n                  <ipt-button [label]=\"'Modificar Datos'\" (onClick)=\"editBillingData()\" [primary]=\"false\"></ipt-button>\r\n                </div>\r\n              </div>\r\n              <div class=\"m-2\" *ngIf=\"!isEditBillingData\">\r\n                <h3>Completa los nuevos datos para la emisi\u00F3n de tu factura</h3>\r\n                <div class=\"flex gap-1 md:gap-4 xl:gap-8 m-1 p-2 border-round bg-blue-500 text-white\">\r\n                  <div class=\"container_icon flex mr-4 justify-content-center align-items-start mt-1\">\r\n                    <i class=\"pi pi-info-circle cursor-pointer w-auto mb-4\" pTooltip=\"M\u00E1s info.\" tooltipPosition=\"bottom\"></i>\r\n                  </div>\r\n                  <div class=\"flex flex-column container_info_span flex align-items-center justify-content-center\">\r\n                    <span>Si proporcionas datos de un tercero, confirmas que los datos son correctos y que tienes su consentimiento para el uso de la informaci\u00F3n. Estos datos se tratar\u00E1n de acuerdo a nuestra <a href=\"\">Declaraci\u00F3n de Privacidad</a></span>\r\n                  </div>\r\n                </div>\r\n                <div>\r\n                  <ipt-input [inputType]=\"'text'\" [placeHolder]=\"'Nombres'\" [control]=\"codSelfFormStepFour.controls['invoicing_name']\"></ipt-input>\r\n                  <ipt-input [inputType]=\"'text'\" [placeHolder]=\"'Apellidos'\" [control]=\"codSelfFormStepFour.controls['invoicing_Apellido']\"></ipt-input>\r\n                  <ipt-select\r\n                    [initialValue]=\"codSelfFormStepFour.controls['invoicing_idType'].value\"\r\n                    [control]=\"codSelfFormStepFour.controls['invoicing_idType']\"\r\n                    [selectCode]=\"codSelfFormStepFour.controls['invoicing_idType'].value === null ? 'Tipo de documento' : codSelfFormStepFour.controls['invoicing_idType'].value\"\r\n                    [isRequired]=\"true\"\r\n                    [data]=\"idTypes\"\r\n                    (eventSelect)=\"selectIdType($event)\"\r\n                    [defaultText]=\"'Tipo de documento'\"\r\n                  ></ipt-select>\r\n                  <ipt-input [inputType]=\"'number'\" [placeHolder]=\"'N\u00FAmero de documento'\" [control]=\"codSelfFormStepFour.controls['invoicing_document']\"></ipt-input>\r\n                </div>\r\n                <div class=\"flex justify-content-end mt-3 align-items-center gap-3\">\r\n                  <button pButton [disabled]=\"!codSelfFormStepFour.valid\" label=\"Continuar\" type=\"button\" (click)=\"updateDatosBillingData()\"></button>\r\n                </div>\r\n              </div>\r\n            </div>\r\n\r\n            <!-- Vista para la opci\u00F3n de pago \"Transferencia\" -->\r\n            <div *ngIf=\"getViewBasedOnPaymentOption() === 'tr'\">\r\n              <!-- TODO:<h3>Completa los datos para Transferencia</h3> -->\r\n              <!-- Aqu\u00ED puedes agregar el formulario espec\u00EDfico para Transferencia -->\r\n            </div>\r\n          </div>\r\n        </div>\r\n      </form>\r\n\r\n      <div class=\"flex justify-content-between mt-3 align-items-center gap-3\">\r\n        <button pButton icon=\"pi pi-arrow-left\" type=\"button\" (click)=\"back()\"></button>\r\n        <button *ngIf=\"!isSelectionOptionPayments && isEditBillingData && codSelfFormStepFour.valid\" pButton label=\"\u00A1Matricularme!\" type=\"button\" (click)=\"sendForm()\"></button>\r\n      </div>\r\n    </div>\r\n  </div>\r\n</div>\r\n", styles: [".container-form{margin:5px;border-radius:3px;border:1px solid #2563eb;box-shadow:#3c40434d 0 1px 2px,#3c404326 0 2px 6px 2px;padding:.5rem}.error-message{font-size:x-small;color:red}:host ::ng-deep .p-toast{width:20rem!important}.circular-image{width:50px;height:50px;border-radius:50%;object-fit:cover;border:none}.container-button{width:10rem;margin-top:3%}\n"], dependencies: [{ kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: ButtonComponent, selector: "ipt-button", inputs: ["primary", "size", "label", "buttonType", "isEnabled"], outputs: ["onClick"] }, { kind: "component", type: InputComponent, selector: "ipt-input", inputs: ["inputType", "placeHolder", "validateText", "withPipe", "list", "iconUrl", "control", "prefix", "thousands", "decimal", "disabledSel"], outputs: ["dateSelected"] }, { kind: "component", type: SelectComponent, selector: "ipt-select", inputs: ["isRequired", "data", "defaultText", "selectCode", "disabledSel", "initialValue", "control"], outputs: ["eventSelect"] }, { kind: "directive", type: i1$1.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i1$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$1.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i1$1.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i9.Tooltip, selector: "[pTooltip]", inputs: ["tooltipPosition", "tooltipEvent", "appendTo", "positionStyle", "tooltipStyleClass", "tooltipZIndex", "escape", "showDelay", "hideDelay", "life", "positionTop", "positionLeft", "fitContent", "pTooltip", "tooltipDisabled", "tooltipOptions"] }, { kind: "directive", type: i1$1.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "directive", type: i7$1.ButtonDirective, selector: "[pButton]", inputs: ["iconPos", "loadingIcon", "label", "icon", "loading"] }, { kind: "component", type: i11.Toast, selector: "p-toast", inputs: ["key", "autoZIndex", "baseZIndex", "style", "styleClass", "position", "preventOpenDuplicates", "preventDuplicates", "showTransformOptions", "hideTransformOptions", "showTransitionOptions", "hideTransitionOptions", "breakpoints"], outputs: ["onClose"] }, { kind: "directive", type: i2$1.PrimeTemplate, selector: "[pTemplate]", inputs: ["type", "pTemplate"] }, { kind: "component", type: i14.RadioButton, selector: "p-radioButton", inputs: ["value", "formControlName", "name", "disabled", "label", "tabindex", "inputId", "ariaLabelledBy", "ariaLabel", "style", "styleClass", "labelStyleClass"], outputs: ["onClick", "onFocus", "onBlur"] }] });
+CodSelfFormStepFourComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.0.7", type: CodSelfFormStepFourComponent, selector: "app-cod-self-form-step-four", inputs: { idTypes: "idTypes" }, outputs: { completed: "completed", action: "action" }, usesInheritance: true, ngImport: i0, template: "<div class=\"container-main\">\n  <div class=\"container-form\">\n    <div class=\"title_step\">\n      <h2>Datos de Facturaci\u00F3n</h2>\n      <p-toast position=\"top-center\" key=\"confirm\" (onClose)=\"onReject()\" [baseZIndex]=\"10\">\n        <ng-template let-message pTemplate=\"message\">\n          <div class=\"flex flex-column align-items-start\" style=\"flex: 1\">\n            <div class=\"flex align-items-center gap-2\">\n              <img src=\"./assets/logos/reading.png\" style=\"width: 65px;\" shape=\"circle\" />\n              <span class=\"font-bold text-900\">Jacob</span>\n            </div>\n            <div class=\"font-medium text-lg my-3 text-900\">{{ messageInfo }}</div>\n          </div>\n        </ng-template>\n      </p-toast>\n    </div>\n\n    <i class=\"pi pi-exclamation-circle cursor-pointer w-auto \" (click)=\"showConfirm()\" pTooltip=\"M\u00E1s info.\" tooltipPosition=\"bottom\"></i>\n    <div class=\"animate__animated animate__slideInRight ng-star-inserted\">\n      <form autocomplete=\"off\" [formGroup]=\"codSelfFormStepFour\" class=\"grid mt-2 flex flex-column align-items-center\">\n        <div class=\"container__body__select flex justify-content-center flex-wrap\">\n          <div class=\"container__type__payments\" *ngIf=\"isSelectionOptionPayments\">\n            <div class=\"flex flex-column gap-3\">\n              <h3>\u00BFC\u00F3mo quieres pagar?</h3>\n              <div *ngFor=\"let category of OptionPayments; index as ind\" class=\"field-checkbox\">\n                <p-radioButton\n                  [inputId]=\"category.key\"\n                  name=\"category\"\n                  [value]=\"category\"\n                  [(ngModel)]=\"selectedOptionPayments\"\n                  [disabled]=\"disableweekdays[ind]\"\n                  [ngModelOptions]=\"{ standalone: true }\"\n                  (ngModelChange)=\"selectOpcionsPayments($event)\"\n                ></p-radioButton>\n                <label [for]=\"category.key\" class=\"ml-2\">\n                  {{ category.name }}\n                </label>\n              </div>\n            </div>\n          </div>\n\n          <div class=\"container__option__instalations\" *ngIf=\"!isSelectionOptionPayments\">\n            <!-- Vista para la opci\u00F3n de pago \"Instalaciones\" -->\n            <div *ngIf=\"getViewBasedOnPaymentOption() === 'in'\">\n              <div class=\"container__info flex flex-column align-items-center justify-content-center mt-1 mb-4\" *ngIf=\"isEditBillingData\">\n                <img src=\"./assets/logos/lobo-web.png\" alt=\"Receipt Icon\" shape=\"circle\" class=\"circular-image\" />\n                <strong>{{ codSelfFormStepFour.get('invoicing_name')?.value }} {{ codSelfFormStepFour.get('invoicing_Apellido')?.value }}</strong>\n                <span>{{ getIdTypeDescription(codSelfFormStepFour.get('invoicing_idType')?.value) }} {{ codSelfFormStepFour.get('invoicing_document')?.value }}</span>\n                <div class=\"container-button\">\n                  <ipt-button [label]=\"'Modificar Datos'\" (onClick)=\"editBillingData()\" [primary]=\"false\"></ipt-button>\n                </div>\n              </div>\n              <div class=\"m-2\" *ngIf=\"!isEditBillingData\">\n                <h3>Completa los nuevos datos para la emisi\u00F3n de tu factura</h3>\n                <div class=\"flex gap-1 md:gap-4 xl:gap-8 m-1 p-2 border-round bg-blue-500 text-white\">\n                  <div class=\"container_icon flex mr-4 justify-content-center align-items-start mt-1\">\n                    <i class=\"pi pi-info-circle cursor-pointer w-auto mb-4\" pTooltip=\"M\u00E1s info.\" tooltipPosition=\"bottom\"></i>\n                  </div>\n                  <div class=\"flex flex-column container_info_span flex align-items-center justify-content-center\">\n                    <span>Si proporcionas datos de un tercero, confirmas que los datos son correctos y que tienes su consentimiento para el uso de la informaci\u00F3n. Estos datos se tratar\u00E1n de acuerdo a nuestra <a href=\"\">Declaraci\u00F3n de Privacidad</a></span>\n                  </div>\n                </div>\n                <div>\n                  <ipt-input [inputType]=\"'text'\" [placeHolder]=\"'Nombres'\" [control]=\"codSelfFormStepFour.controls['invoicing_name']\"></ipt-input>\n                  <ipt-input [inputType]=\"'text'\" [placeHolder]=\"'Apellidos'\" [control]=\"codSelfFormStepFour.controls['invoicing_Apellido']\"></ipt-input>\n                  <ipt-select\n                    [initialValue]=\"codSelfFormStepFour.controls['invoicing_idType'].value\"\n                    [control]=\"codSelfFormStepFour.controls['invoicing_idType']\"\n                    [selectCode]=\"codSelfFormStepFour.controls['invoicing_idType'].value === null ? 'Tipo de documento' : codSelfFormStepFour.controls['invoicing_idType'].value\"\n                    [isRequired]=\"true\"\n                    [data]=\"idTypes\"\n                    (eventSelect)=\"selectIdType($event)\"\n                    [defaultText]=\"'Tipo de documento'\"\n                  ></ipt-select>\n                  <ipt-input [inputType]=\"'number'\" [placeHolder]=\"'N\u00FAmero de documento'\" [control]=\"codSelfFormStepFour.controls['invoicing_document']\"></ipt-input>\n                </div>\n                <div class=\"flex justify-content-end mt-3 align-items-center gap-3\">\n                  <button pButton [disabled]=\"!codSelfFormStepFour.valid\" label=\"Continuar\" type=\"button\" (click)=\"updateDatosBillingData()\"></button>\n                </div>\n              </div>\n            </div>\n\n            <!-- Vista para la opci\u00F3n de pago \"Pasarela pagos\" -->\n            <div *ngIf=\"getViewBasedOnPaymentOption() === 'ps'\">\n              <!-- TODO:<h3>Completa los datos para Pasarela pagos</h3> -->\n              <!-- Aqu\u00ED puedes agregar el formulario espec\u00EDfico para Pasarela pagos -->\n            </div>\n          </div>\n        </div>\n      </form>\n\n      <div class=\"flex justify-content-between mt-3 align-items-center gap-3\">\n        <button pButton icon=\"pi pi-arrow-left\" type=\"button\" (click)=\"back()\"></button>\n        <button *ngIf=\"!isSelectionOptionPayments && isEditBillingData && codSelfFormStepFour.valid\" pButton label=\"\u00A1Matricularme!\" type=\"button\" (click)=\"sendForm()\"></button>\n      </div>\n    </div>\n  </div>\n</div>\n", styles: [".container-form{margin:5px;border-radius:3px;border:1px solid #2563eb;box-shadow:#3c40434d 0 1px 2px,#3c404326 0 2px 6px 2px;padding:.5rem}.error-message{font-size:x-small;color:red}:host ::ng-deep .p-toast{width:20rem!important}.circular-image{width:50px;height:50px;border-radius:50%;object-fit:cover;border:none}.container-button{width:10rem;margin-top:3%}\n"], dependencies: [{ kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: ButtonComponent, selector: "ipt-button", inputs: ["primary", "size", "label", "buttonType", "isEnabled"], outputs: ["onClick"] }, { kind: "component", type: InputComponent, selector: "ipt-input", inputs: ["inputType", "placeHolder", "validateText", "withPipe", "list", "iconUrl", "control", "prefix", "thousands", "decimal", "disabledSel"], outputs: ["dateSelected"] }, { kind: "component", type: SelectComponent, selector: "ipt-select", inputs: ["isRequired", "data", "defaultText", "selectCode", "disabledSel", "initialValue", "control"], outputs: ["eventSelect"] }, { kind: "directive", type: i1$1.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i1$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$1.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i1$1.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i9.Tooltip, selector: "[pTooltip]", inputs: ["tooltipPosition", "tooltipEvent", "appendTo", "positionStyle", "tooltipStyleClass", "tooltipZIndex", "escape", "showDelay", "hideDelay", "life", "positionTop", "positionLeft", "fitContent", "pTooltip", "tooltipDisabled", "tooltipOptions"] }, { kind: "directive", type: i1$1.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "directive", type: i7$1.ButtonDirective, selector: "[pButton]", inputs: ["iconPos", "loadingIcon", "label", "icon", "loading"] }, { kind: "component", type: i11.Toast, selector: "p-toast", inputs: ["key", "autoZIndex", "baseZIndex", "style", "styleClass", "position", "preventOpenDuplicates", "preventDuplicates", "showTransformOptions", "hideTransformOptions", "showTransitionOptions", "hideTransitionOptions", "breakpoints"], outputs: ["onClose"] }, { kind: "directive", type: i2$1.PrimeTemplate, selector: "[pTemplate]", inputs: ["type", "pTemplate"] }, { kind: "component", type: i14.RadioButton, selector: "p-radioButton", inputs: ["value", "formControlName", "name", "disabled", "label", "tabindex", "inputId", "ariaLabelledBy", "ariaLabel", "style", "styleClass", "labelStyleClass"], outputs: ["onClick", "onFocus", "onBlur"] }] });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.0.7", ngImport: i0, type: CodSelfFormStepFourComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'app-cod-self-form-step-four', template: "<div class=\"container-main\">\r\n  <div class=\"container-form\">\r\n    <div class=\"title_step\">\r\n      <h2>Datos de Facturaci\u00F3n</h2>\r\n      <p-toast position=\"top-center\" key=\"confirm\" (onClose)=\"onReject()\" [baseZIndex]=\"10\">\r\n        <ng-template let-message pTemplate=\"message\">\r\n          <div class=\"flex flex-column align-items-start\" style=\"flex: 1\">\r\n            <div class=\"flex align-items-center gap-2\">\r\n              <img src=\"./assets/logos/reading.png\" style=\"width: 65px;\" shape=\"circle\" />\r\n              <span class=\"font-bold text-900\">Jacob</span>\r\n            </div>\r\n            <div class=\"font-medium text-lg my-3 text-900\">{{ messageInfo }}</div>\r\n          </div>\r\n        </ng-template>\r\n      </p-toast>\r\n    </div>\r\n\r\n    <i class=\"pi pi-exclamation-circle cursor-pointer w-auto \" (click)=\"showConfirm()\" pTooltip=\"M\u00E1s info.\" tooltipPosition=\"bottom\"></i>\r\n    <div class=\"animate__animated animate__slideInRight ng-star-inserted\">\r\n      <form autocomplete=\"off\" [formGroup]=\"codSelfFormStepFour\" class=\"grid mt-2 flex flex-column align-items-center\">\r\n        <div class=\"container__body__select flex justify-content-center flex-wrap\">\r\n          <div class=\"container__type__payments\" *ngIf=\"isSelectionOptionPayments\">\r\n            <div class=\"flex flex-column gap-3\">\r\n              <h3>\u00BFC\u00F3mo quieres pagar?</h3>\r\n              <div *ngFor=\"let category of OptionPayments; index as ind\" class=\"field-checkbox\">\r\n                <p-radioButton\r\n                  [inputId]=\"category.key\"\r\n                  name=\"category\"\r\n                  [value]=\"category\"\r\n                  [(ngModel)]=\"selectedOptionPayments\"\r\n                  [disabled]=\"disableweekdays[ind]\"\r\n                  [ngModelOptions]=\"{ standalone: true }\"\r\n                  (ngModelChange)=\"selectOpcionsPayments($event)\"\r\n                ></p-radioButton>\r\n                <label [for]=\"category.key\" class=\"ml-2\">\r\n                  {{ category.name }}\r\n                </label>\r\n              </div>\r\n            </div>\r\n          </div>\r\n\r\n          <div class=\"container__option__instalations\" *ngIf=\"!isSelectionOptionPayments\">\r\n            <!-- Vista para la opci\u00F3n de pago \"Instalaciones\" -->\r\n            <div *ngIf=\"getViewBasedOnPaymentOption() === 'in'\">\r\n              <div class=\"container__info flex flex-column align-items-center justify-content-center mt-1 mb-4\" *ngIf=\"isEditBillingData\">\r\n                <img src=\"./assets/logos/lobo-web.png\" alt=\"Receipt Icon\" shape=\"circle\" class=\"circular-image\" />\r\n                <strong>{{ codSelfFormStepFour.get('invoicing_name')?.value }} {{ codSelfFormStepFour.get('invoicing_Apellido')?.value }}</strong>\r\n                <span>{{ getIdTypeDescription(codSelfFormStepFour.get('invoicing_idType')?.value) }} {{ codSelfFormStepFour.get('invoicing_document')?.value }}</span>\r\n                <div class=\"container-button\">\r\n                  <ipt-button [label]=\"'Modificar Datos'\" (onClick)=\"editBillingData()\" [primary]=\"false\"></ipt-button>\r\n                </div>\r\n              </div>\r\n              <div class=\"m-2\" *ngIf=\"!isEditBillingData\">\r\n                <h3>Completa los nuevos datos para la emisi\u00F3n de tu factura</h3>\r\n                <div class=\"flex gap-1 md:gap-4 xl:gap-8 m-1 p-2 border-round bg-blue-500 text-white\">\r\n                  <div class=\"container_icon flex mr-4 justify-content-center align-items-start mt-1\">\r\n                    <i class=\"pi pi-info-circle cursor-pointer w-auto mb-4\" pTooltip=\"M\u00E1s info.\" tooltipPosition=\"bottom\"></i>\r\n                  </div>\r\n                  <div class=\"flex flex-column container_info_span flex align-items-center justify-content-center\">\r\n                    <span>Si proporcionas datos de un tercero, confirmas que los datos son correctos y que tienes su consentimiento para el uso de la informaci\u00F3n. Estos datos se tratar\u00E1n de acuerdo a nuestra <a href=\"\">Declaraci\u00F3n de Privacidad</a></span>\r\n                  </div>\r\n                </div>\r\n                <div>\r\n                  <ipt-input [inputType]=\"'text'\" [placeHolder]=\"'Nombres'\" [control]=\"codSelfFormStepFour.controls['invoicing_name']\"></ipt-input>\r\n                  <ipt-input [inputType]=\"'text'\" [placeHolder]=\"'Apellidos'\" [control]=\"codSelfFormStepFour.controls['invoicing_Apellido']\"></ipt-input>\r\n                  <ipt-select\r\n                    [initialValue]=\"codSelfFormStepFour.controls['invoicing_idType'].value\"\r\n                    [control]=\"codSelfFormStepFour.controls['invoicing_idType']\"\r\n                    [selectCode]=\"codSelfFormStepFour.controls['invoicing_idType'].value === null ? 'Tipo de documento' : codSelfFormStepFour.controls['invoicing_idType'].value\"\r\n                    [isRequired]=\"true\"\r\n                    [data]=\"idTypes\"\r\n                    (eventSelect)=\"selectIdType($event)\"\r\n                    [defaultText]=\"'Tipo de documento'\"\r\n                  ></ipt-select>\r\n                  <ipt-input [inputType]=\"'number'\" [placeHolder]=\"'N\u00FAmero de documento'\" [control]=\"codSelfFormStepFour.controls['invoicing_document']\"></ipt-input>\r\n                </div>\r\n                <div class=\"flex justify-content-end mt-3 align-items-center gap-3\">\r\n                  <button pButton [disabled]=\"!codSelfFormStepFour.valid\" label=\"Continuar\" type=\"button\" (click)=\"updateDatosBillingData()\"></button>\r\n                </div>\r\n              </div>\r\n            </div>\r\n\r\n            <!-- Vista para la opci\u00F3n de pago \"Transferencia\" -->\r\n            <div *ngIf=\"getViewBasedOnPaymentOption() === 'tr'\">\r\n              <!-- TODO:<h3>Completa los datos para Transferencia</h3> -->\r\n              <!-- Aqu\u00ED puedes agregar el formulario espec\u00EDfico para Transferencia -->\r\n            </div>\r\n          </div>\r\n        </div>\r\n      </form>\r\n\r\n      <div class=\"flex justify-content-between mt-3 align-items-center gap-3\">\r\n        <button pButton icon=\"pi pi-arrow-left\" type=\"button\" (click)=\"back()\"></button>\r\n        <button *ngIf=\"!isSelectionOptionPayments && isEditBillingData && codSelfFormStepFour.valid\" pButton label=\"\u00A1Matricularme!\" type=\"button\" (click)=\"sendForm()\"></button>\r\n      </div>\r\n    </div>\r\n  </div>\r\n</div>\r\n", styles: [".container-form{margin:5px;border-radius:3px;border:1px solid #2563eb;box-shadow:#3c40434d 0 1px 2px,#3c404326 0 2px 6px 2px;padding:.5rem}.error-message{font-size:x-small;color:red}:host ::ng-deep .p-toast{width:20rem!important}.circular-image{width:50px;height:50px;border-radius:50%;object-fit:cover;border:none}.container-button{width:10rem;margin-top:3%}\n"] }]
+            args: [{ selector: 'app-cod-self-form-step-four', template: "<div class=\"container-main\">\n  <div class=\"container-form\">\n    <div class=\"title_step\">\n      <h2>Datos de Facturaci\u00F3n</h2>\n      <p-toast position=\"top-center\" key=\"confirm\" (onClose)=\"onReject()\" [baseZIndex]=\"10\">\n        <ng-template let-message pTemplate=\"message\">\n          <div class=\"flex flex-column align-items-start\" style=\"flex: 1\">\n            <div class=\"flex align-items-center gap-2\">\n              <img src=\"./assets/logos/reading.png\" style=\"width: 65px;\" shape=\"circle\" />\n              <span class=\"font-bold text-900\">Jacob</span>\n            </div>\n            <div class=\"font-medium text-lg my-3 text-900\">{{ messageInfo }}</div>\n          </div>\n        </ng-template>\n      </p-toast>\n    </div>\n\n    <i class=\"pi pi-exclamation-circle cursor-pointer w-auto \" (click)=\"showConfirm()\" pTooltip=\"M\u00E1s info.\" tooltipPosition=\"bottom\"></i>\n    <div class=\"animate__animated animate__slideInRight ng-star-inserted\">\n      <form autocomplete=\"off\" [formGroup]=\"codSelfFormStepFour\" class=\"grid mt-2 flex flex-column align-items-center\">\n        <div class=\"container__body__select flex justify-content-center flex-wrap\">\n          <div class=\"container__type__payments\" *ngIf=\"isSelectionOptionPayments\">\n            <div class=\"flex flex-column gap-3\">\n              <h3>\u00BFC\u00F3mo quieres pagar?</h3>\n              <div *ngFor=\"let category of OptionPayments; index as ind\" class=\"field-checkbox\">\n                <p-radioButton\n                  [inputId]=\"category.key\"\n                  name=\"category\"\n                  [value]=\"category\"\n                  [(ngModel)]=\"selectedOptionPayments\"\n                  [disabled]=\"disableweekdays[ind]\"\n                  [ngModelOptions]=\"{ standalone: true }\"\n                  (ngModelChange)=\"selectOpcionsPayments($event)\"\n                ></p-radioButton>\n                <label [for]=\"category.key\" class=\"ml-2\">\n                  {{ category.name }}\n                </label>\n              </div>\n            </div>\n          </div>\n\n          <div class=\"container__option__instalations\" *ngIf=\"!isSelectionOptionPayments\">\n            <!-- Vista para la opci\u00F3n de pago \"Instalaciones\" -->\n            <div *ngIf=\"getViewBasedOnPaymentOption() === 'in'\">\n              <div class=\"container__info flex flex-column align-items-center justify-content-center mt-1 mb-4\" *ngIf=\"isEditBillingData\">\n                <img src=\"./assets/logos/lobo-web.png\" alt=\"Receipt Icon\" shape=\"circle\" class=\"circular-image\" />\n                <strong>{{ codSelfFormStepFour.get('invoicing_name')?.value }} {{ codSelfFormStepFour.get('invoicing_Apellido')?.value }}</strong>\n                <span>{{ getIdTypeDescription(codSelfFormStepFour.get('invoicing_idType')?.value) }} {{ codSelfFormStepFour.get('invoicing_document')?.value }}</span>\n                <div class=\"container-button\">\n                  <ipt-button [label]=\"'Modificar Datos'\" (onClick)=\"editBillingData()\" [primary]=\"false\"></ipt-button>\n                </div>\n              </div>\n              <div class=\"m-2\" *ngIf=\"!isEditBillingData\">\n                <h3>Completa los nuevos datos para la emisi\u00F3n de tu factura</h3>\n                <div class=\"flex gap-1 md:gap-4 xl:gap-8 m-1 p-2 border-round bg-blue-500 text-white\">\n                  <div class=\"container_icon flex mr-4 justify-content-center align-items-start mt-1\">\n                    <i class=\"pi pi-info-circle cursor-pointer w-auto mb-4\" pTooltip=\"M\u00E1s info.\" tooltipPosition=\"bottom\"></i>\n                  </div>\n                  <div class=\"flex flex-column container_info_span flex align-items-center justify-content-center\">\n                    <span>Si proporcionas datos de un tercero, confirmas que los datos son correctos y que tienes su consentimiento para el uso de la informaci\u00F3n. Estos datos se tratar\u00E1n de acuerdo a nuestra <a href=\"\">Declaraci\u00F3n de Privacidad</a></span>\n                  </div>\n                </div>\n                <div>\n                  <ipt-input [inputType]=\"'text'\" [placeHolder]=\"'Nombres'\" [control]=\"codSelfFormStepFour.controls['invoicing_name']\"></ipt-input>\n                  <ipt-input [inputType]=\"'text'\" [placeHolder]=\"'Apellidos'\" [control]=\"codSelfFormStepFour.controls['invoicing_Apellido']\"></ipt-input>\n                  <ipt-select\n                    [initialValue]=\"codSelfFormStepFour.controls['invoicing_idType'].value\"\n                    [control]=\"codSelfFormStepFour.controls['invoicing_idType']\"\n                    [selectCode]=\"codSelfFormStepFour.controls['invoicing_idType'].value === null ? 'Tipo de documento' : codSelfFormStepFour.controls['invoicing_idType'].value\"\n                    [isRequired]=\"true\"\n                    [data]=\"idTypes\"\n                    (eventSelect)=\"selectIdType($event)\"\n                    [defaultText]=\"'Tipo de documento'\"\n                  ></ipt-select>\n                  <ipt-input [inputType]=\"'number'\" [placeHolder]=\"'N\u00FAmero de documento'\" [control]=\"codSelfFormStepFour.controls['invoicing_document']\"></ipt-input>\n                </div>\n                <div class=\"flex justify-content-end mt-3 align-items-center gap-3\">\n                  <button pButton [disabled]=\"!codSelfFormStepFour.valid\" label=\"Continuar\" type=\"button\" (click)=\"updateDatosBillingData()\"></button>\n                </div>\n              </div>\n            </div>\n\n            <!-- Vista para la opci\u00F3n de pago \"Pasarela pagos\" -->\n            <div *ngIf=\"getViewBasedOnPaymentOption() === 'ps'\">\n              <!-- TODO:<h3>Completa los datos para Pasarela pagos</h3> -->\n              <!-- Aqu\u00ED puedes agregar el formulario espec\u00EDfico para Pasarela pagos -->\n            </div>\n          </div>\n        </div>\n      </form>\n\n      <div class=\"flex justify-content-between mt-3 align-items-center gap-3\">\n        <button pButton icon=\"pi pi-arrow-left\" type=\"button\" (click)=\"back()\"></button>\n        <button *ngIf=\"!isSelectionOptionPayments && isEditBillingData && codSelfFormStepFour.valid\" pButton label=\"\u00A1Matricularme!\" type=\"button\" (click)=\"sendForm()\"></button>\n      </div>\n    </div>\n  </div>\n</div>\n", styles: [".container-form{margin:5px;border-radius:3px;border:1px solid #2563eb;box-shadow:#3c40434d 0 1px 2px,#3c404326 0 2px 6px 2px;padding:.5rem}.error-message{font-size:x-small;color:red}:host ::ng-deep .p-toast{width:20rem!important}.circular-image{width:50px;height:50px;border-radius:50%;object-fit:cover;border:none}.container-button{width:10rem;margin-top:3%}\n"] }]
         }], ctorParameters: function () { return [{ type: i1$1.FormBuilder }, { type: i2$1.MessageService }, { type: CodSelfManagedControls }]; }, propDecorators: { idTypes: [{
                 type: Input
             }], completed: [{
@@ -7850,7 +7851,7 @@ class CodSelfManagedComponent {
     getFormAction(action) {
         if (!this.financingData && this.localStorageCodSelfManaged.getCodFormData(4, 'payment_method') === '1') {
             Swal.fire({
-                title: 'Querido asesor',
+                title: 'Opss',
                 text: 'Debe hacer el cálculo de las cuotas en el paso 4',
                 icon: 'error'
             });
@@ -7912,7 +7913,7 @@ class CodSelfManagedComponent {
                         icon: 'success'
                     });
                     this.localStorageCodSelfManaged.clearData();
-                    this.okCreatedCOD.emit(true);
+                    this.okCreatedCOD.emit(response.data);
                 }
                 else {
                     Swal.fire({
@@ -7978,10 +7979,10 @@ class CodSelfManagedComponent {
     }
 }
 CodSelfManagedComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.0.7", ngImport: i0, type: CodSelfManagedComponent, deps: [{ token: BaseService }, { token: CommercialService }, { token: CodSelfManagedControls }, { token: LocalStorageCodSelfMaganedService }], target: i0.ɵɵFactoryTarget.Component });
-CodSelfManagedComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.0.7", type: CodSelfManagedComponent, selector: "ipt-cod-self-managed", inputs: { user: "user", scorePlacementTest: "scorePlacementTest", codPrevious: "codPrevious" }, outputs: { okCreatedCOD: "okCreatedCOD" }, ngImport: i0, template: "<!-- <p-steps [model]=\"items\" [(activeIndex)]=\"currentStep\" (activeIndexChange)=\"currentStep = $event\" ></p-steps> -->\r\n<p-steps [model]=\"items\" [(activeIndex)]=\"currentStep\" (activeIndexChange)=\"currentStep = $event\">\r\n  <ng-template pTemplate=\"item\" let-item>\r\n    <span class=\"p-steps-number\">{{ item.id }}</span>\r\n    <i [class]=\"item.icon\"></i>\r\n    <span class=\"p-steps-title\">{{ item.label }}</span>\r\n  </ng-template>\r\n</p-steps>\r\n\r\n<p-tabView [activeIndex]=\"currentStep\" (activeIndexChange)=\"currentStep = $event\">\r\n  <p-tabPanel [disabled]=\"true\">\r\n    <app-cod-self-form-step-one (completed)=\"changeStep($event)\" [userStudent]=\"user\" (idTypesChanged)=\"handleIdTypesChanged($event)\"></app-cod-self-form-step-one>\r\n  </p-tabPanel>\r\n  <p-tabPanel [disabled]=\"true\">\r\n    <app-cod-self-form-step-two (completed)=\"changeStep($event)\" [codPrevious]=\"codPrevious\" [scorePlacementTest]=\"scorePlacementTest\"></app-cod-self-form-step-two>\r\n  </p-tabPanel>\r\n  <p-tabPanel [disabled]=\"true\">\r\n    <app-cod-self-form-step-three (completed)=\"changeStep($event)\" (financingData)=\"saveFinancingData($event)\"></app-cod-self-form-step-three>\r\n  </p-tabPanel>\r\n  <p-tabPanel [disabled]=\"true\">\r\n    <app-cod-self-form-step-four (completed)=\"changeStep($event)\" [idTypes]=\"idTypes\" (action)=\"getFormAction($event)\"></app-cod-self-form-step-four>\r\n  </p-tabPanel>\r\n</p-tabView>\r\n", styles: [":host ::ng-deep .p-tabview-nav{display:none!important}:host ::ng-deep .p-steps .p-steps-item.p-highlight .p-steps-title{font-weight:400;color:#fff;font-family:Poppins}:host ::ng-deep .p-steps .p-steps-item .p-menuitem-link{border-radius:4px;background:#2563eb;padding-top:5px;width:4.6rem}\n"], dependencies: [{ kind: "component", type: i5$1.Steps, selector: "p-steps", inputs: ["activeIndex", "model", "readonly", "style", "styleClass"], outputs: ["activeIndexChange"] }, { kind: "directive", type: i2$1.PrimeTemplate, selector: "[pTemplate]", inputs: ["type", "pTemplate"] }, { kind: "component", type: i6$2.TabView, selector: "p-tabView", inputs: ["orientation", "style", "styleClass", "controlClose", "scrollable", "activeIndex"], outputs: ["onChange", "onClose", "activeIndexChange"] }, { kind: "component", type: i6$2.TabPanel, selector: "p-tabPanel", inputs: ["closable", "headerStyle", "headerStyleClass", "cache", "tooltip", "tooltipPosition", "tooltipPositionStyle", "tooltipStyleClass", "selected", "disabled", "header", "leftIcon", "rightIcon"] }, { kind: "component", type: CodSelfFormStepOneComponent, selector: "app-cod-self-form-step-one", inputs: ["userStudent"], outputs: ["completed", "idTypesChanged"] }, { kind: "component", type: CodSelfFormStepTwoComponent, selector: "app-cod-self-form-step-two", inputs: ["scorePlacementTest", "codPrevious"], outputs: ["completed"] }, { kind: "component", type: CodSelfFormStepThreeComponent, selector: "app-cod-self-form-step-three", outputs: ["completed", "financingData"] }, { kind: "component", type: CodSelfFormStepFourComponent, selector: "app-cod-self-form-step-four", inputs: ["idTypes"], outputs: ["completed", "action"] }] });
+CodSelfManagedComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.0.7", type: CodSelfManagedComponent, selector: "ipt-cod-self-managed", inputs: { user: "user", scorePlacementTest: "scorePlacementTest", codPrevious: "codPrevious" }, outputs: { okCreatedCOD: "okCreatedCOD" }, ngImport: i0, template: "<!-- <p-steps [model]=\"items\" [(activeIndex)]=\"currentStep\" (activeIndexChange)=\"currentStep = $event\" ></p-steps> -->\n<p-steps [model]=\"items\" [(activeIndex)]=\"currentStep\" (activeIndexChange)=\"currentStep = $event\">\n  <ng-template pTemplate=\"item\" let-item>\n    <span class=\"p-steps-number\">{{ item.id }}</span>\n    <i [class]=\"item.icon\"></i>\n    <span class=\"p-steps-title\">{{ item.label }}</span>\n  </ng-template>\n</p-steps>\n\n<p-tabView [activeIndex]=\"currentStep\" (activeIndexChange)=\"currentStep = $event\">\n  <p-tabPanel [disabled]=\"true\">\n    <app-cod-self-form-step-one (completed)=\"changeStep($event)\" [userStudent]=\"user\" (idTypesChanged)=\"handleIdTypesChanged($event)\"></app-cod-self-form-step-one>\n  </p-tabPanel>\n  <p-tabPanel [disabled]=\"true\">\n    <app-cod-self-form-step-two (completed)=\"changeStep($event)\" [codPrevious]=\"codPrevious\" [scorePlacementTest]=\"scorePlacementTest\"></app-cod-self-form-step-two>\n  </p-tabPanel>\n  <p-tabPanel [disabled]=\"true\">\n    <app-cod-self-form-step-three (completed)=\"changeStep($event)\" (financingData)=\"saveFinancingData($event)\"></app-cod-self-form-step-three>\n  </p-tabPanel>\n  <p-tabPanel [disabled]=\"true\">\n    <app-cod-self-form-step-four (completed)=\"changeStep($event)\" [idTypes]=\"idTypes\" (action)=\"getFormAction($event)\"></app-cod-self-form-step-four>\n  </p-tabPanel>\n</p-tabView>\n", styles: [":host ::ng-deep .p-tabview-nav{display:none!important}:host ::ng-deep .p-steps .p-steps-item.p-highlight .p-steps-title{font-weight:400;color:#fff;font-family:Poppins}:host ::ng-deep .p-steps .p-steps-item .p-menuitem-link{border-radius:4px;background:#2563eb;padding-top:5px;width:4.6rem}\n"], dependencies: [{ kind: "component", type: i5$1.Steps, selector: "p-steps", inputs: ["activeIndex", "model", "readonly", "style", "styleClass"], outputs: ["activeIndexChange"] }, { kind: "directive", type: i2$1.PrimeTemplate, selector: "[pTemplate]", inputs: ["type", "pTemplate"] }, { kind: "component", type: i6$2.TabView, selector: "p-tabView", inputs: ["orientation", "style", "styleClass", "controlClose", "scrollable", "activeIndex"], outputs: ["onChange", "onClose", "activeIndexChange"] }, { kind: "component", type: i6$2.TabPanel, selector: "p-tabPanel", inputs: ["closable", "headerStyle", "headerStyleClass", "cache", "tooltip", "tooltipPosition", "tooltipPositionStyle", "tooltipStyleClass", "selected", "disabled", "header", "leftIcon", "rightIcon"] }, { kind: "component", type: CodSelfFormStepOneComponent, selector: "app-cod-self-form-step-one", inputs: ["userStudent"], outputs: ["completed", "idTypesChanged"] }, { kind: "component", type: CodSelfFormStepTwoComponent, selector: "app-cod-self-form-step-two", inputs: ["scorePlacementTest", "codPrevious"], outputs: ["completed"] }, { kind: "component", type: CodSelfFormStepThreeComponent, selector: "app-cod-self-form-step-three", outputs: ["completed", "financingData"] }, { kind: "component", type: CodSelfFormStepFourComponent, selector: "app-cod-self-form-step-four", inputs: ["idTypes"], outputs: ["completed", "action"] }] });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.0.7", ngImport: i0, type: CodSelfManagedComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'ipt-cod-self-managed', template: "<!-- <p-steps [model]=\"items\" [(activeIndex)]=\"currentStep\" (activeIndexChange)=\"currentStep = $event\" ></p-steps> -->\r\n<p-steps [model]=\"items\" [(activeIndex)]=\"currentStep\" (activeIndexChange)=\"currentStep = $event\">\r\n  <ng-template pTemplate=\"item\" let-item>\r\n    <span class=\"p-steps-number\">{{ item.id }}</span>\r\n    <i [class]=\"item.icon\"></i>\r\n    <span class=\"p-steps-title\">{{ item.label }}</span>\r\n  </ng-template>\r\n</p-steps>\r\n\r\n<p-tabView [activeIndex]=\"currentStep\" (activeIndexChange)=\"currentStep = $event\">\r\n  <p-tabPanel [disabled]=\"true\">\r\n    <app-cod-self-form-step-one (completed)=\"changeStep($event)\" [userStudent]=\"user\" (idTypesChanged)=\"handleIdTypesChanged($event)\"></app-cod-self-form-step-one>\r\n  </p-tabPanel>\r\n  <p-tabPanel [disabled]=\"true\">\r\n    <app-cod-self-form-step-two (completed)=\"changeStep($event)\" [codPrevious]=\"codPrevious\" [scorePlacementTest]=\"scorePlacementTest\"></app-cod-self-form-step-two>\r\n  </p-tabPanel>\r\n  <p-tabPanel [disabled]=\"true\">\r\n    <app-cod-self-form-step-three (completed)=\"changeStep($event)\" (financingData)=\"saveFinancingData($event)\"></app-cod-self-form-step-three>\r\n  </p-tabPanel>\r\n  <p-tabPanel [disabled]=\"true\">\r\n    <app-cod-self-form-step-four (completed)=\"changeStep($event)\" [idTypes]=\"idTypes\" (action)=\"getFormAction($event)\"></app-cod-self-form-step-four>\r\n  </p-tabPanel>\r\n</p-tabView>\r\n", styles: [":host ::ng-deep .p-tabview-nav{display:none!important}:host ::ng-deep .p-steps .p-steps-item.p-highlight .p-steps-title{font-weight:400;color:#fff;font-family:Poppins}:host ::ng-deep .p-steps .p-steps-item .p-menuitem-link{border-radius:4px;background:#2563eb;padding-top:5px;width:4.6rem}\n"] }]
+            args: [{ selector: 'ipt-cod-self-managed', template: "<!-- <p-steps [model]=\"items\" [(activeIndex)]=\"currentStep\" (activeIndexChange)=\"currentStep = $event\" ></p-steps> -->\n<p-steps [model]=\"items\" [(activeIndex)]=\"currentStep\" (activeIndexChange)=\"currentStep = $event\">\n  <ng-template pTemplate=\"item\" let-item>\n    <span class=\"p-steps-number\">{{ item.id }}</span>\n    <i [class]=\"item.icon\"></i>\n    <span class=\"p-steps-title\">{{ item.label }}</span>\n  </ng-template>\n</p-steps>\n\n<p-tabView [activeIndex]=\"currentStep\" (activeIndexChange)=\"currentStep = $event\">\n  <p-tabPanel [disabled]=\"true\">\n    <app-cod-self-form-step-one (completed)=\"changeStep($event)\" [userStudent]=\"user\" (idTypesChanged)=\"handleIdTypesChanged($event)\"></app-cod-self-form-step-one>\n  </p-tabPanel>\n  <p-tabPanel [disabled]=\"true\">\n    <app-cod-self-form-step-two (completed)=\"changeStep($event)\" [codPrevious]=\"codPrevious\" [scorePlacementTest]=\"scorePlacementTest\"></app-cod-self-form-step-two>\n  </p-tabPanel>\n  <p-tabPanel [disabled]=\"true\">\n    <app-cod-self-form-step-three (completed)=\"changeStep($event)\" (financingData)=\"saveFinancingData($event)\"></app-cod-self-form-step-three>\n  </p-tabPanel>\n  <p-tabPanel [disabled]=\"true\">\n    <app-cod-self-form-step-four (completed)=\"changeStep($event)\" [idTypes]=\"idTypes\" (action)=\"getFormAction($event)\"></app-cod-self-form-step-four>\n  </p-tabPanel>\n</p-tabView>\n", styles: [":host ::ng-deep .p-tabview-nav{display:none!important}:host ::ng-deep .p-steps .p-steps-item.p-highlight .p-steps-title{font-weight:400;color:#fff;font-family:Poppins}:host ::ng-deep .p-steps .p-steps-item .p-menuitem-link{border-radius:4px;background:#2563eb;padding-top:5px;width:4.6rem}\n"] }]
         }], ctorParameters: function () { return [{ type: BaseService }, { type: CommercialService }, { type: CodSelfManagedControls }, { type: LocalStorageCodSelfMaganedService }]; }, propDecorators: { user: [{
                 type: Input
             }], scorePlacementTest: [{