npm - @litigiovirtual/ius-design-components - Versions diffs - 1.0.247 → 1.0.248 - Mend

@litigiovirtual/ius-design-components 1.0.247 → 1.0.248

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

Files changed (22) hide show

package/fesm2022/litigiovirtual-ius-design-components.mjs CHANGED Viewed

@@ -1723,6 +1723,7 @@ class ButtonAccountsComponent {
         this.elementRef = elementRef;
         this.isOpen = false;
         this.openOptions = false;
+        this.showOptionsFlag = true;
         this.accountSelected = new EventEmitter();
         this.onPressedPredeterminado = new EventEmitter();
         this.onPressedDesvincular = new EventEmitter();
@@ -1745,19 +1746,22 @@ class ButtonAccountsComponent {
         this.openOptions = !this.openOptions;
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: ButtonAccountsComponent, deps: [{ token: i0.ElementRef }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "17.3.12", type: ButtonAccountsComponent, isStandalone: true, selector: "ius-button-accounts", inputs: { account: "account" }, outputs: { accountSelected: "accountSelected", onPressedPredeterminado: "onPressedPredeterminado", onPressedDesvincular: "onPressedDesvincular", onPressedEditar: "onPressedEditar" }, host: { listeners: { "document:click": "onDocumentClick($event)" } }, ngImport: i0, template: "<div class=\"general\">\r\n    <button type=\"button\" class=\"ius-btn\" [class.isOpen]=\"isOpen\" [class.menuOpen]=\"openOptions\"\r\n        [class.isPredetermined]=\"account.isPredetermined\" (click)=\"onClickAccount(account)\">\r\n\r\n        <div class=\"content\">\r\n            <ius-avatar-v2 [imageUrl]=\"account.logo\" [name]=\"account.name\" size=\"md\" shape=\"circle\"\r\n                fallbackIconName=\"icon-account-circle\">\r\n            </ius-avatar-v2>\r\n\r\n            <span class=\"name body-base-1\">{{ account.name }}</span>\r\n        </div>\r\n\r\n        <ius-button-circle-tertiary (click)=\"showOptions($event)\" [iconName]=\"'icon-more-vert'\">\r\n        </ius-button-circle-tertiary>\r\n    </button>\r\n\r\n    @if (openOptions) {\r\n    <div class=\"more-box active\">\r\n        <ius-option [checked]=\"account.isPredetermined!\" (optionClick)=\"onPressedPredeterminado.emit(account)\">\r\n            <span class=\"body-large\">Marcar como predeterminada</span>\r\n        </ius-option>\r\n\r\n        <ius-simple-divider></ius-simple-divider>\r\n\r\n        <ius-option [leadingIcon]=\"'icon-edit'\" (optionClick)=\"onPressedEditar.emit(account)\">\r\n            <span class=\"body-large\">Editar</span>\r\n        </ius-option>\r\n\r\n        <ius-option [leadingIcon]=\"'icon-delete'\" (optionClick)=\"onPressedDesvincular.emit(account)\">\r\n            <span class=\"body-large\">Desvincular</span>\r\n        </ius-option>\r\n    </div>\r\n    }\r\n</div>", styles: [".h1{font-family:Roboto,sans-serif;font-size:2.375rem;font-weight:500;line-height:46px}.h2{font-family:Roboto,sans-serif;font-size:1.875rem;font-weight:700;line-height:38px}.h3{font-family:Roboto,sans-serif;font-size:1.5rem;font-weight:500;line-height:32px}.h4{font-family:Roboto,sans-serif;font-size:1.25rem;font-weight:700;line-height:26px}.h5{font-family:Roboto,sans-serif;font-size:1.125rem;font-weight:500;line-height:24px;letter-spacing:.18px}.label-large{font-family:Roboto,sans-serif;font-size:1rem;font-weight:500;line-height:22px}.body-large{font-family:Rubik,sans-serif;font-size:1rem;font-weight:400;line-height:22px}.label-base{font-family:Rubik,sans-serif;font-size:.875rem;font-weight:500;line-height:20px;letter-spacing:.28px}.body-base{font-family:Rubik,sans-serif;font-size:.875rem;font-weight:400;line-height:20px;font-style:italic;letter-spacing:.28px}.body-base-1,.body-base-1-1{font-family:Rubik,sans-serif;font-size:.875rem;font-weight:400;line-height:20px;letter-spacing:.28px}.body-sm{font-family:Rubik,sans-serif;font-size:.75rem;font-weight:400;line-height:16px;letter-spacing:.28px}.body-sm-italic{font-family:Rubik,sans-serif;font-size:.75rem;font-weight:400;line-height:16px;font-style:italic;letter-spacing:.28px}.caption-sm{font-family:Rubik,sans-serif;font-size:.75rem;font-weight:500;line-height:16px;letter-spacing:.28px}.caption-sm-italic{font-family:Rubik,sans-serif;font-size:.75rem;font-weight:500;line-height:16px;font-style:italic;letter-spacing:.28px}.general{position:relative;width:100%}.ius-btn{display:inline-flex;align-items:center;justify-content:space-between;gap:8px;width:100%;box-sizing:border-box;padding:8px 12px;border-radius:8px;border:1px solid #eaeaea;background-color:#fff;color:#333;font-family:Rubik,sans-serif;font-size:.875rem;font-weight:500;line-height:20px;letter-spacing:.28px;cursor:pointer;transition:background-color .15s ease,border-color .15s ease,box-shadow .15s ease}.ius-btn:hover:not(:disabled){border-color:#f0f0f0;background-color:#f5f5f5;box-shadow:0 1px 3px #0000001f,0 1px 2px #00000014}.ius-btn:active:not(:disabled){border-color:#c4dfff;background-color:#c4dfff;box-shadow:none}.ius-btn.isOpen{border-color:#c4dfff;background-color:#edf6ff}.ius-btn.menuOpen{border-color:#f0f0f0;background-color:#f5f5f5;box-shadow:0 1px 3px #0000001f,0 1px 2px #00000014}.ius-btn.isOpen.menuOpen{border-color:#c4dfff;background-color:#edf6ff;box-shadow:0 1px 3px #0000001f,0 1px 2px #00000014}.content{display:flex;align-items:center;gap:12px;min-width:0;flex:1 1 auto}.name{flex:1 1 auto;min-width:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;text-align:left;color:#333}.more-box{position:absolute;top:100%;left:90%;margin-top:8px;min-width:240px;padding:8px;z-index:100;display:flex;flex-direction:column;border-radius:8px;background:#fff;box-shadow:0 2px 6px #00000024,0 1px 10px #0000001a;border:1px solid #f0f0f0;opacity:0;pointer-events:none;transform:translateY(-6px);transition:opacity .25s ease,transform .25s ease}.more-box.active{opacity:1;transform:translateY(0);pointer-events:all}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "component", type: ButtonCircleTertiaryComponent, selector: "ius-button-circle-tertiary", inputs: ["disabled", "iconName"], outputs: ["buttonClicked"] }, { kind: "component", type: OptionComponent, selector: "ius-option", inputs: ["disabled", "checked", "leadingIcon"], outputs: ["optionClick"] }, { kind: "component", type: SimpleDividerComponent, selector: "ius-simple-divider" }, { kind: "component", type: AvatarV2Component, selector: "ius-avatar-v2", inputs: ["imageUrl", "name", "size", "shape", "showEditButton", "backgroundColor", "fallbackIconName"], outputs: ["editClicked"] }] }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "17.3.12", type: ButtonAccountsComponent, isStandalone: true, selector: "ius-button-accounts", inputs: { account: "account", showOptionsFlag: "showOptionsFlag" }, outputs: { accountSelected: "accountSelected", onPressedPredeterminado: "onPressedPredeterminado", onPressedDesvincular: "onPressedDesvincular", onPressedEditar: "onPressedEditar" }, host: { listeners: { "document:click": "onDocumentClick($event)" } }, ngImport: i0, template: "<div class=\"general\">\r\n    <button type=\"button\" class=\"ius-btn\" [class.isOpen]=\"isOpen\" [class.menuOpen]=\"openOptions\"\r\n        [class.isPredetermined]=\"account.isPredetermined\" (click)=\"onClickAccount(account)\">\r\n\r\n        <div class=\"content\">\r\n            <ius-avatar-v2 [imageUrl]=\"account.logo\" [name]=\"account.name\" size=\"md\" shape=\"circle\"\r\n                fallbackIconName=\"icon-account-circle\">\r\n            </ius-avatar-v2>\r\n\r\n            <span class=\"name body-base-1\">{{ account.name }}</span>\r\n        </div>\r\n\r\n    @if (showOptionsFlag) {\r\n      <ius-button-circle-tertiary\r\n        (click)=\"showOptions($event)\"\r\n        [iconName]=\"'icon-more-vert'\"\r\n      >\r\n      </ius-button-circle-tertiary>\r\n    }\r\n    </button>\r\n\r\n    @if (openOptions) {\r\n    <div class=\"more-box active\">\r\n        <ius-option [checked]=\"true\" (optionClick)=\"onPressedPredeterminado.emit(account)\">\r\n            <span class=\"body-large\">Marcar como predeterminada</span>\r\n        </ius-option>\r\n\r\n        <ius-simple-divider></ius-simple-divider>\r\n\r\n        <ius-option [leadingIcon]=\"'icon-edit'\" (optionClick)=\"onPressedEditar.emit(account)\">\r\n            <span class=\"body-large\">Editar</span>\r\n        </ius-option>\r\n\r\n        <ius-option [leadingIcon]=\"'icon-delete'\" (optionClick)=\"onPressedDesvincular.emit(account)\">\r\n            <span class=\"body-large\">Desvincular</span>\r\n        </ius-option>\r\n    </div>\r\n  }\r\n</div>\r\n", styles: [".h1{font-family:Roboto,sans-serif;font-size:2.375rem;font-weight:500;line-height:46px}.h2{font-family:Roboto,sans-serif;font-size:1.875rem;font-weight:700;line-height:38px}.h3{font-family:Roboto,sans-serif;font-size:1.5rem;font-weight:500;line-height:32px}.h4{font-family:Roboto,sans-serif;font-size:1.25rem;font-weight:700;line-height:26px}.h5{font-family:Roboto,sans-serif;font-size:1.125rem;font-weight:500;line-height:24px;letter-spacing:.18px}.label-large{font-family:Roboto,sans-serif;font-size:1rem;font-weight:500;line-height:22px}.body-large{font-family:Rubik,sans-serif;font-size:1rem;font-weight:400;line-height:22px}.label-base{font-family:Rubik,sans-serif;font-size:.875rem;font-weight:500;line-height:20px;letter-spacing:.28px}.body-base{font-family:Rubik,sans-serif;font-size:.875rem;font-weight:400;line-height:20px;font-style:italic;letter-spacing:.28px}.body-base-1,.body-base-1-1{font-family:Rubik,sans-serif;font-size:.875rem;font-weight:400;line-height:20px;letter-spacing:.28px}.body-sm{font-family:Rubik,sans-serif;font-size:.75rem;font-weight:400;line-height:16px;letter-spacing:.28px}.body-sm-italic{font-family:Rubik,sans-serif;font-size:.75rem;font-weight:400;line-height:16px;font-style:italic;letter-spacing:.28px}.caption-sm{font-family:Rubik,sans-serif;font-size:.75rem;font-weight:500;line-height:16px;letter-spacing:.28px}.caption-sm-italic{font-family:Rubik,sans-serif;font-size:.75rem;font-weight:500;line-height:16px;font-style:italic;letter-spacing:.28px}.general{position:relative;width:100%}.ius-btn{display:inline-flex;align-items:center;justify-content:space-between;gap:8px;height:48px;width:100%;box-sizing:border-box;padding:8px;border-radius:8px;border:1px solid #eaeaea;background-color:#fff;color:#333;cursor:pointer;transition:background-color .15s ease,border-color .15s ease,box-shadow .15s ease}.ius-btn:hover:not(:disabled){border-color:#f0f0f0;background-color:#f5f5f5;box-shadow:0 1px 3px #0000001f,0 1px 2px #00000014}.ius-btn:active:not(:disabled){border-color:#c4dfff;background-color:#c4dfff;box-shadow:none}.ius-btn.isOpen{border-color:#c4dfff;background-color:#edf6ff}.ius-btn.menuOpen{border-color:#f0f0f0;background-color:#f5f5f5;box-shadow:0 1px 3px #0000001f,0 1px 2px #00000014}.ius-btn.isOpen.menuOpen{border-color:#c4dfff;background-color:#edf6ff;box-shadow:0 1px 3px #0000001f,0 1px 2px #00000014}.content{display:flex;align-items:center;gap:12px;min-width:0;flex:1 1 auto}.name{flex:1 1 auto;min-width:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;text-align:left;color:#333}.more-box{position:absolute;top:100%;left:90%;margin-top:8px;min-width:240px;padding:8px;z-index:100;display:flex;flex-direction:column;border-radius:8px;background:#fff;box-shadow:0 2px 6px #00000024,0 1px 10px #0000001a;border:1px solid #f0f0f0;opacity:0;pointer-events:none;transform:translateY(-6px);transition:opacity .25s ease,transform .25s ease}.more-box.active{opacity:1;transform:translateY(0);pointer-events:all}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "component", type: ButtonCircleTertiaryComponent, selector: "ius-button-circle-tertiary", inputs: ["disabled", "iconName"], outputs: ["buttonClicked"] }, { kind: "component", type: AvatarV2Component, selector: "ius-avatar-v2", inputs: ["imageUrl", "name", "size", "shape", "showEditButton", "backgroundColor", "fallbackIconName"], outputs: ["editClicked"] }, { kind: "component", type: OptionComponent, selector: "ius-option", inputs: ["disabled", "checked", "leadingIcon"], outputs: ["optionClick"] }, { kind: "component", type: SimpleDividerComponent, selector: "ius-simple-divider" }] }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: ButtonAccountsComponent, decorators: [{
             type: Component,
             args: [{ selector: 'ius-button-accounts', standalone: true, imports: [
                         CommonModule,
                         ButtonCircleTertiaryComponent,
+                        AvatarV2Component,
                         OptionComponent,
                         SimpleDividerComponent,
-                        AvatarV2Component
-                    ], template: "<div class=\"general\">\r\n    <button type=\"button\" class=\"ius-btn\" [class.isOpen]=\"isOpen\" [class.menuOpen]=\"openOptions\"\r\n        [class.isPredetermined]=\"account.isPredetermined\" (click)=\"onClickAccount(account)\">\r\n\r\n        <div class=\"content\">\r\n            <ius-avatar-v2 [imageUrl]=\"account.logo\" [name]=\"account.name\" size=\"md\" shape=\"circle\"\r\n                fallbackIconName=\"icon-account-circle\">\r\n            </ius-avatar-v2>\r\n\r\n            <span class=\"name body-base-1\">{{ account.name }}</span>\r\n        </div>\r\n\r\n        <ius-button-circle-tertiary (click)=\"showOptions($event)\" [iconName]=\"'icon-more-vert'\">\r\n        </ius-button-circle-tertiary>\r\n    </button>\r\n\r\n    @if (openOptions) {\r\n    <div class=\"more-box active\">\r\n        <ius-option [checked]=\"account.isPredetermined!\" (optionClick)=\"onPressedPredeterminado.emit(account)\">\r\n            <span class=\"body-large\">Marcar como predeterminada</span>\r\n        </ius-option>\r\n\r\n        <ius-simple-divider></ius-simple-divider>\r\n\r\n        <ius-option [leadingIcon]=\"'icon-edit'\" (optionClick)=\"onPressedEditar.emit(account)\">\r\n            <span class=\"body-large\">Editar</span>\r\n        </ius-option>\r\n\r\n        <ius-option [leadingIcon]=\"'icon-delete'\" (optionClick)=\"onPressedDesvincular.emit(account)\">\r\n            <span class=\"body-large\">Desvincular</span>\r\n        </ius-option>\r\n    </div>\r\n    }\r\n</div>", styles: [".h1{font-family:Roboto,sans-serif;font-size:2.375rem;font-weight:500;line-height:46px}.h2{font-family:Roboto,sans-serif;font-size:1.875rem;font-weight:700;line-height:38px}.h3{font-family:Roboto,sans-serif;font-size:1.5rem;font-weight:500;line-height:32px}.h4{font-family:Roboto,sans-serif;font-size:1.25rem;font-weight:700;line-height:26px}.h5{font-family:Roboto,sans-serif;font-size:1.125rem;font-weight:500;line-height:24px;letter-spacing:.18px}.label-large{font-family:Roboto,sans-serif;font-size:1rem;font-weight:500;line-height:22px}.body-large{font-family:Rubik,sans-serif;font-size:1rem;font-weight:400;line-height:22px}.label-base{font-family:Rubik,sans-serif;font-size:.875rem;font-weight:500;line-height:20px;letter-spacing:.28px}.body-base{font-family:Rubik,sans-serif;font-size:.875rem;font-weight:400;line-height:20px;font-style:italic;letter-spacing:.28px}.body-base-1,.body-base-1-1{font-family:Rubik,sans-serif;font-size:.875rem;font-weight:400;line-height:20px;letter-spacing:.28px}.body-sm{font-family:Rubik,sans-serif;font-size:.75rem;font-weight:400;line-height:16px;letter-spacing:.28px}.body-sm-italic{font-family:Rubik,sans-serif;font-size:.75rem;font-weight:400;line-height:16px;font-style:italic;letter-spacing:.28px}.caption-sm{font-family:Rubik,sans-serif;font-size:.75rem;font-weight:500;line-height:16px;letter-spacing:.28px}.caption-sm-italic{font-family:Rubik,sans-serif;font-size:.75rem;font-weight:500;line-height:16px;font-style:italic;letter-spacing:.28px}.general{position:relative;width:100%}.ius-btn{display:inline-flex;align-items:center;justify-content:space-between;gap:8px;width:100%;box-sizing:border-box;padding:8px 12px;border-radius:8px;border:1px solid #eaeaea;background-color:#fff;color:#333;font-family:Rubik,sans-serif;font-size:.875rem;font-weight:500;line-height:20px;letter-spacing:.28px;cursor:pointer;transition:background-color .15s ease,border-color .15s ease,box-shadow .15s ease}.ius-btn:hover:not(:disabled){border-color:#f0f0f0;background-color:#f5f5f5;box-shadow:0 1px 3px #0000001f,0 1px 2px #00000014}.ius-btn:active:not(:disabled){border-color:#c4dfff;background-color:#c4dfff;box-shadow:none}.ius-btn.isOpen{border-color:#c4dfff;background-color:#edf6ff}.ius-btn.menuOpen{border-color:#f0f0f0;background-color:#f5f5f5;box-shadow:0 1px 3px #0000001f,0 1px 2px #00000014}.ius-btn.isOpen.menuOpen{border-color:#c4dfff;background-color:#edf6ff;box-shadow:0 1px 3px #0000001f,0 1px 2px #00000014}.content{display:flex;align-items:center;gap:12px;min-width:0;flex:1 1 auto}.name{flex:1 1 auto;min-width:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;text-align:left;color:#333}.more-box{position:absolute;top:100%;left:90%;margin-top:8px;min-width:240px;padding:8px;z-index:100;display:flex;flex-direction:column;border-radius:8px;background:#fff;box-shadow:0 2px 6px #00000024,0 1px 10px #0000001a;border:1px solid #f0f0f0;opacity:0;pointer-events:none;transform:translateY(-6px);transition:opacity .25s ease,transform .25s ease}.more-box.active{opacity:1;transform:translateY(0);pointer-events:all}\n"] }]
+                        AvatarV2Component,
+                    ], template: "<div class=\"general\">\r\n    <button type=\"button\" class=\"ius-btn\" [class.isOpen]=\"isOpen\" [class.menuOpen]=\"openOptions\"\r\n        [class.isPredetermined]=\"account.isPredetermined\" (click)=\"onClickAccount(account)\">\r\n\r\n        <div class=\"content\">\r\n            <ius-avatar-v2 [imageUrl]=\"account.logo\" [name]=\"account.name\" size=\"md\" shape=\"circle\"\r\n                fallbackIconName=\"icon-account-circle\">\r\n            </ius-avatar-v2>\r\n\r\n            <span class=\"name body-base-1\">{{ account.name }}</span>\r\n        </div>\r\n\r\n    @if (showOptionsFlag) {\r\n      <ius-button-circle-tertiary\r\n        (click)=\"showOptions($event)\"\r\n        [iconName]=\"'icon-more-vert'\"\r\n      >\r\n      </ius-button-circle-tertiary>\r\n    }\r\n    </button>\r\n\r\n    @if (openOptions) {\r\n    <div class=\"more-box active\">\r\n        <ius-option [checked]=\"true\" (optionClick)=\"onPressedPredeterminado.emit(account)\">\r\n            <span class=\"body-large\">Marcar como predeterminada</span>\r\n        </ius-option>\r\n\r\n        <ius-simple-divider></ius-simple-divider>\r\n\r\n        <ius-option [leadingIcon]=\"'icon-edit'\" (optionClick)=\"onPressedEditar.emit(account)\">\r\n            <span class=\"body-large\">Editar</span>\r\n        </ius-option>\r\n\r\n        <ius-option [leadingIcon]=\"'icon-delete'\" (optionClick)=\"onPressedDesvincular.emit(account)\">\r\n            <span class=\"body-large\">Desvincular</span>\r\n        </ius-option>\r\n    </div>\r\n  }\r\n</div>\r\n", styles: [".h1{font-family:Roboto,sans-serif;font-size:2.375rem;font-weight:500;line-height:46px}.h2{font-family:Roboto,sans-serif;font-size:1.875rem;font-weight:700;line-height:38px}.h3{font-family:Roboto,sans-serif;font-size:1.5rem;font-weight:500;line-height:32px}.h4{font-family:Roboto,sans-serif;font-size:1.25rem;font-weight:700;line-height:26px}.h5{font-family:Roboto,sans-serif;font-size:1.125rem;font-weight:500;line-height:24px;letter-spacing:.18px}.label-large{font-family:Roboto,sans-serif;font-size:1rem;font-weight:500;line-height:22px}.body-large{font-family:Rubik,sans-serif;font-size:1rem;font-weight:400;line-height:22px}.label-base{font-family:Rubik,sans-serif;font-size:.875rem;font-weight:500;line-height:20px;letter-spacing:.28px}.body-base{font-family:Rubik,sans-serif;font-size:.875rem;font-weight:400;line-height:20px;font-style:italic;letter-spacing:.28px}.body-base-1,.body-base-1-1{font-family:Rubik,sans-serif;font-size:.875rem;font-weight:400;line-height:20px;letter-spacing:.28px}.body-sm{font-family:Rubik,sans-serif;font-size:.75rem;font-weight:400;line-height:16px;letter-spacing:.28px}.body-sm-italic{font-family:Rubik,sans-serif;font-size:.75rem;font-weight:400;line-height:16px;font-style:italic;letter-spacing:.28px}.caption-sm{font-family:Rubik,sans-serif;font-size:.75rem;font-weight:500;line-height:16px;letter-spacing:.28px}.caption-sm-italic{font-family:Rubik,sans-serif;font-size:.75rem;font-weight:500;line-height:16px;font-style:italic;letter-spacing:.28px}.general{position:relative;width:100%}.ius-btn{display:inline-flex;align-items:center;justify-content:space-between;gap:8px;height:48px;width:100%;box-sizing:border-box;padding:8px;border-radius:8px;border:1px solid #eaeaea;background-color:#fff;color:#333;cursor:pointer;transition:background-color .15s ease,border-color .15s ease,box-shadow .15s ease}.ius-btn:hover:not(:disabled){border-color:#f0f0f0;background-color:#f5f5f5;box-shadow:0 1px 3px #0000001f,0 1px 2px #00000014}.ius-btn:active:not(:disabled){border-color:#c4dfff;background-color:#c4dfff;box-shadow:none}.ius-btn.isOpen{border-color:#c4dfff;background-color:#edf6ff}.ius-btn.menuOpen{border-color:#f0f0f0;background-color:#f5f5f5;box-shadow:0 1px 3px #0000001f,0 1px 2px #00000014}.ius-btn.isOpen.menuOpen{border-color:#c4dfff;background-color:#edf6ff;box-shadow:0 1px 3px #0000001f,0 1px 2px #00000014}.content{display:flex;align-items:center;gap:12px;min-width:0;flex:1 1 auto}.name{flex:1 1 auto;min-width:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;text-align:left;color:#333}.more-box{position:absolute;top:100%;left:90%;margin-top:8px;min-width:240px;padding:8px;z-index:100;display:flex;flex-direction:column;border-radius:8px;background:#fff;box-shadow:0 2px 6px #00000024,0 1px 10px #0000001a;border:1px solid #f0f0f0;opacity:0;pointer-events:none;transform:translateY(-6px);transition:opacity .25s ease,transform .25s ease}.more-box.active{opacity:1;transform:translateY(0);pointer-events:all}\n"] }]
         }], ctorParameters: () => [{ type: i0.ElementRef }], propDecorators: { account: [{
                 type: Input
+            }], showOptionsFlag: [{
+                type: Input
             }], accountSelected: [{
                 type: Output
             }], onPressedPredeterminado: [{
@@ -2830,11 +2834,11 @@ class InputTextfieldComponent {
         event.preventDefault();
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: InputTextfieldComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "17.3.12", type: InputTextfieldComponent, isStandalone: true, selector: "ius-input-textfield", inputs: { textInput: "textInput", required: "required", disabled: "disabled", isEnableClearText: "isEnableClearText", showHelpText: "showHelpText", error: "error", labelSuperior: "labelSuperior", labelInferior: "labelInferior", errorText: "errorText", labelInput: "labelInput", iconInput: "iconInput", inputType: "inputType", maxlenght: "maxlenght", initialText: "initialText" }, outputs: { onChangesValueEvent: "onChangesValueEvent", onEnterKey: "onEnterKey", onBlurEvent: "onBlurEvent" }, ngImport: i0, template: "<div class=\"container-general\">\r\n  @if (labelSuperior) {\r\n  <div\r\n    class=\"container-label-sup\"\r\n    [ngClass]=\"{\r\n      disabled: disabled\r\n    }\"\r\n  >\r\n    @if(!disabled && required){\r\n    <div class=\"icon-dot\"></div>\r\n    }\r\n    <span class=\"\">{{ labelSuperior }}</span>\r\n    @if(!disabled && showHelpText){\r\n    <ius-icon-md iconName=\"icon-help\" class=\"icon-color-help\"></ius-icon-md>\r\n    }\r\n    <span>:</span>\r\n  </div>\r\n  }\r\n  <div\r\n    class=\"container-textfield\"\r\n    [ngClass]=\"{\r\n      disabled: disabled,\r\n      focused: isFocused,\r\n      alert: (!isFocused && isAlertText && !disabled) || (error && !disabled)\r\n    }\"\r\n  >\r\n    @if (iconInput) {\r\n    <ius-icon-md [iconName]=\"iconInput\" class=\"icon-color\"></ius-icon-md>\r\n    }\r\n    <input\r\n      [type]=\"inputType\"\r\n      [(ngModel)]=\"textInput\"\r\n      [placeholder]=\"labelInput\"\r\n      [disabled]=\"disabled\"\r\n      [autocomplete]=\"inputType\"\r\n      [name]=\"inputType\"\r\n      [maxlength]=\"maxlenght ?? null\"\r\n      (input)=\"onInput()\"\r\n      (focus)=\"onFocus()\"\r\n      (blur)=\"onBlur()\"\r\n      (keypress)=\"onKeyPress($event)\"\r\n      (keydown)=\"onKeyDown($event)\"\r\n      (drop)=\"onDropBlock($event)\"\r\n      (dragover)=\"onDragOverBlock($event)\"\r\n    />\r\n    @if (!disabled && textInput && isEnableClearText) {\r\n    <button class=\"button-delete\" (click)=\"clearSearch()\">\r\n      <ius-icon-md\r\n        iconName=\"icon-cancel\"\r\n        class=\"icon-color-cancel\"\r\n      ></ius-icon-md>\r\n    </button>\r\n    }\r\n  </div>\r\n  @if (labelInferior && isFocused && !error) {\r\n  <span class=\"label-inf\">{{ labelInferior }}</span>\r\n  } @if ((errorText || labelInferior) && ((!isFocused && isAlertText && !disabled) || (error && !disabled))) {\r\n  <span class=\"label-inf alert\">{{ errorText ?? labelInferior }}</span>\r\n  }\r\n</div>\r\n", styles: [".h1{font-family:Roboto,sans-serif;font-size:2.375rem;font-weight:500;line-height:46px}.h2{font-family:Roboto,sans-serif;font-size:1.875rem;font-weight:700;line-height:38px}.h3{font-family:Roboto,sans-serif;font-size:1.5rem;font-weight:500;line-height:32px}.h4{font-family:Roboto,sans-serif;font-size:1.25rem;font-weight:700;line-height:26px}.h5{font-family:Roboto,sans-serif;font-size:1.125rem;font-weight:500;line-height:24px;letter-spacing:.18px}.label-large{font-family:Roboto,sans-serif;font-size:1rem;font-weight:500;line-height:22px}.body-large{font-family:Rubik,sans-serif;font-size:1rem;font-weight:400;line-height:22px}.label-base{font-family:Rubik,sans-serif;font-size:.875rem;font-weight:500;line-height:20px;letter-spacing:.28px}.body-base{font-family:Rubik,sans-serif;font-size:.875rem;font-weight:400;line-height:20px;font-style:italic;letter-spacing:.28px}.body-base-1,.body-base-1-1{font-family:Rubik,sans-serif;font-size:.875rem;font-weight:400;line-height:20px;letter-spacing:.28px}.body-sm{font-family:Rubik,sans-serif;font-size:.75rem;font-weight:400;line-height:16px;letter-spacing:.28px}.body-sm-italic{font-family:Rubik,sans-serif;font-size:.75rem;font-weight:400;line-height:16px;font-style:italic;letter-spacing:.28px}.caption-sm{font-family:Rubik,sans-serif;font-size:.75rem;font-weight:500;line-height:16px;letter-spacing:.28px}.caption-sm-italic{font-family:Rubik,sans-serif;font-size:.75rem;font-weight:500;line-height:16px;font-style:italic;letter-spacing:.28px}.container-general{position:relative;height:100%}.container-textfield{display:flex;padding:10px 12px;justify-content:center;align-items:flex-start;gap:4px;border:1px solid #f5f5f5;border-radius:8px;background:#f5f5f5;font-family:Rubik,sans-serif;font-size:.875rem;font-weight:400;line-height:20px;letter-spacing:.28px;transition:all .2s ease-in-out}.container-textfield:hover:not(.disabled):not(.focused):not(.alert){background:#edf6ff}.container-textfield.focused{border:1px solid #0581BC;background:#edf6ff}.container-textfield.disabled{background:#f5f5f5}.container-textfield.disabled .icon-color,.container-textfield.disabled input{color:#bfbfbf}.container-textfield.disabled input::placeholder{color:#bfbfbf;opacity:1}.container-textfield.alert{border:1px solid #DB2E2A;background:#fff4f0}.icon-color{color:#595959}.icon-color-cancel{color:#013169}input{display:flex;align-items:center;flex:1 0 0;border:none;outline:none;background-color:transparent;font-family:Rubik,sans-serif;font-size:.875rem;font-weight:400;line-height:20px;letter-spacing:.28px}.button-delete{display:flex;align-items:center;justify-content:center;background:none;border:none;cursor:pointer;padding:0;color:#595959}.button-delete:hover{color:#013169}.container-label-sup{display:flex;align-items:center;gap:4px;margin-bottom:8px;color:#333;font-family:Roboto,sans-serif;font-size:.875rem;font-weight:500;line-height:20px;letter-spacing:.28px}.container-label-sup.disabled{color:#bfbfbf}.icon-dot{display:flex;align-items:center;width:4px;height:4px;aspect-ratio:1/1;background-color:#db2e2a;border-radius:100px}.icon-color-help{color:#8c8c8c}.label-inf{display:flex;position:absolute;margin-top:4px;color:#595959;font-family:Roboto,sans-serif;font-size:.75rem;font-style:italic;font-weight:500;line-height:16px;letter-spacing:.24px}.label-inf.alert{color:#931224}input::-webkit-outer-spin-button,input::-webkit-inner-spin-button{-webkit-appearance:none;margin:0}\n"], dependencies: [{ kind: "component", type: IconMdComponent, selector: "ius-icon-md", inputs: ["iconName", "color"] }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1$3.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$3.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$3.MaxLengthValidator, selector: "[maxlength][formControlName],[maxlength][formControl],[maxlength][ngModel]", inputs: ["maxlength"] }, { kind: "directive", type: i1$3.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1$1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }] }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "17.3.12", type: InputTextfieldComponent, isStandalone: true, selector: "ius-input-textfield", inputs: { textInput: "textInput", required: "required", disabled: "disabled", isEnableClearText: "isEnableClearText", showHelpText: "showHelpText", error: "error", labelSuperior: "labelSuperior", labelInferior: "labelInferior", errorText: "errorText", labelInput: "labelInput", iconInput: "iconInput", inputType: "inputType", maxlenght: "maxlenght", initialText: "initialText" }, outputs: { onChangesValueEvent: "onChangesValueEvent", onEnterKey: "onEnterKey", onBlurEvent: "onBlurEvent" }, ngImport: i0, template: "<div class=\"container-general\">\r\n  @if (labelSuperior) {\r\n  <div\r\n    class=\"container-label-sup\"\r\n    [ngClass]=\"{\r\n      disabled: disabled\r\n    }\"\r\n  >\r\n    @if(!disabled && required){\r\n    <div class=\"icon-dot\"></div>\r\n    }\r\n    <span class=\"\">{{ labelSuperior }}</span>\r\n    @if(!disabled && showHelpText){\r\n    <ius-icon-md iconName=\"icon-help\" class=\"icon-color-help\"></ius-icon-md>\r\n    }\r\n    <span>:</span>\r\n  </div>\r\n  }\r\n  <div\r\n    class=\"container-textfield\"\r\n    [ngClass]=\"{\r\n      disabled: disabled,\r\n      focused: isFocused,\r\n      alert: (!isFocused && isAlertText && !disabled) || (error && !disabled)\r\n    }\"\r\n  >\r\n    @if (iconInput) {\r\n    <ius-icon-md [iconName]=\"iconInput\" class=\"icon-color\"></ius-icon-md>\r\n    }\r\n    <input\r\n      [type]=\"inputType\"\r\n      [(ngModel)]=\"textInput\"\r\n      [placeholder]=\"labelInput\"\r\n      [disabled]=\"disabled\"\r\n      [autocomplete]=\"inputType\"\r\n      [name]=\"inputType\"\r\n      [maxlength]=\"maxlenght ?? null\"\r\n      (input)=\"onInput()\"\r\n      (focus)=\"onFocus()\"\r\n      (blur)=\"onBlur()\"\r\n      (keypress)=\"onKeyPress($event)\"\r\n      (keydown)=\"onKeyDown($event)\"\r\n      (drop)=\"onDropBlock($event)\"\r\n      (dragover)=\"onDragOverBlock($event)\"\r\n    />\r\n    @if (!disabled && textInput && isEnableClearText) {\r\n    <button class=\"button-delete\" (click)=\"clearSearch()\">\r\n      <ius-icon-md\r\n        iconName=\"icon-cancel\"\r\n        class=\"icon-color-cancel\"\r\n      ></ius-icon-md>\r\n    </button>\r\n    }\r\n  </div>\r\n  @if (labelInferior && isFocused && !error) {\r\n  <span class=\"label-inf\">{{ labelInferior }}</span>\r\n  } @if ((errorText || labelInferior) && ((!isFocused && isAlertText && !disabled) || (error && !disabled))) {\r\n  <span class=\"label-inf alert\">{{ errorText ?? labelInferior }}</span>\r\n  }\r\n</div>\r\n", styles: [".h1{font-family:Roboto,sans-serif;font-size:2.375rem;font-weight:500;line-height:46px}.h2{font-family:Roboto,sans-serif;font-size:1.875rem;font-weight:700;line-height:38px}.h3{font-family:Roboto,sans-serif;font-size:1.5rem;font-weight:500;line-height:32px}.h4{font-family:Roboto,sans-serif;font-size:1.25rem;font-weight:700;line-height:26px}.h5{font-family:Roboto,sans-serif;font-size:1.125rem;font-weight:500;line-height:24px;letter-spacing:.18px}.label-large{font-family:Roboto,sans-serif;font-size:1rem;font-weight:500;line-height:22px}.body-large{font-family:Rubik,sans-serif;font-size:1rem;font-weight:400;line-height:22px}.label-base{font-family:Rubik,sans-serif;font-size:.875rem;font-weight:500;line-height:20px;letter-spacing:.28px}.body-base{font-family:Rubik,sans-serif;font-size:.875rem;font-weight:400;line-height:20px;font-style:italic;letter-spacing:.28px}.body-base-1,.body-base-1-1{font-family:Rubik,sans-serif;font-size:.875rem;font-weight:400;line-height:20px;letter-spacing:.28px}.body-sm{font-family:Rubik,sans-serif;font-size:.75rem;font-weight:400;line-height:16px;letter-spacing:.28px}.body-sm-italic{font-family:Rubik,sans-serif;font-size:.75rem;font-weight:400;line-height:16px;font-style:italic;letter-spacing:.28px}.caption-sm{font-family:Rubik,sans-serif;font-size:.75rem;font-weight:500;line-height:16px;letter-spacing:.28px}.caption-sm-italic{font-family:Rubik,sans-serif;font-size:.75rem;font-weight:500;line-height:16px;font-style:italic;letter-spacing:.28px}.container-general{position:relative;height:100%}.container-textfield{display:flex;padding:10px 12px;justify-content:center;align-items:flex-start;gap:4px;border:1px solid #f5f5f5;border-radius:8px;background:#f5f5f5;font-family:Rubik,sans-serif;font-size:.875rem;font-weight:400;line-height:20px;letter-spacing:.28px;transition:all .2s ease-in-out}.container-textfield:hover:not(.disabled):not(.focused):not(.alert){background:#edf6ff}.container-textfield.focused{border:1px solid #0581BC;background:#edf6ff}.container-textfield.disabled{background:#f5f5f5}.container-textfield.disabled .icon-color,.container-textfield.disabled input{color:#bfbfbf}.container-textfield.disabled input::placeholder{color:#bfbfbf;opacity:1}.container-textfield.alert{border:1px solid #DB2E2A;background:#fff4f0}.icon-color{color:#595959}.icon-color-cancel{color:#013169}input{display:flex;align-items:center;flex:1 0 0;border:none;outline:none;background-color:transparent;font-family:Rubik,sans-serif;font-size:.875rem;font-weight:400;line-height:20px;letter-spacing:.28px}.button-delete{display:flex;align-items:center;justify-content:center;background:none;border:none;cursor:pointer;padding:0;color:#595959}.button-delete:hover{color:#013169}.container-label-sup{display:flex;align-items:center;gap:4px;margin-bottom:8px;color:#333;font-family:Rubik,sans-serif;font-size:.875rem;font-weight:500;line-height:20px;letter-spacing:.28px}.container-label-sup.disabled{color:#bfbfbf}.icon-dot{display:flex;align-items:center;width:4px;height:4px;aspect-ratio:1/1;background-color:#db2e2a;border-radius:100px}.icon-color-help{color:#8c8c8c}.label-inf{display:flex;position:absolute;margin-top:4px;color:#595959;font-family:Roboto,sans-serif;font-size:.75rem;font-style:italic;font-weight:500;line-height:16px;letter-spacing:.24px}.label-inf.alert{color:#931224}input::-webkit-outer-spin-button,input::-webkit-inner-spin-button{-webkit-appearance:none;margin:0}\n"], dependencies: [{ kind: "component", type: IconMdComponent, selector: "ius-icon-md", inputs: ["iconName", "color"] }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1$3.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$3.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$3.MaxLengthValidator, selector: "[maxlength][formControlName],[maxlength][formControl],[maxlength][ngModel]", inputs: ["maxlength"] }, { kind: "directive", type: i1$3.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1$1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }] }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: InputTextfieldComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'ius-input-textfield', standalone: true, imports: [IconMdComponent, FormsModule, CommonModule], template: "<div class=\"container-general\">\r\n  @if (labelSuperior) {\r\n  <div\r\n    class=\"container-label-sup\"\r\n    [ngClass]=\"{\r\n      disabled: disabled\r\n    }\"\r\n  >\r\n    @if(!disabled && required){\r\n    <div class=\"icon-dot\"></div>\r\n    }\r\n    <span class=\"\">{{ labelSuperior }}</span>\r\n    @if(!disabled && showHelpText){\r\n    <ius-icon-md iconName=\"icon-help\" class=\"icon-color-help\"></ius-icon-md>\r\n    }\r\n    <span>:</span>\r\n  </div>\r\n  }\r\n  <div\r\n    class=\"container-textfield\"\r\n    [ngClass]=\"{\r\n      disabled: disabled,\r\n      focused: isFocused,\r\n      alert: (!isFocused && isAlertText && !disabled) || (error && !disabled)\r\n    }\"\r\n  >\r\n    @if (iconInput) {\r\n    <ius-icon-md [iconName]=\"iconInput\" class=\"icon-color\"></ius-icon-md>\r\n    }\r\n    <input\r\n      [type]=\"inputType\"\r\n      [(ngModel)]=\"textInput\"\r\n      [placeholder]=\"labelInput\"\r\n      [disabled]=\"disabled\"\r\n      [autocomplete]=\"inputType\"\r\n      [name]=\"inputType\"\r\n      [maxlength]=\"maxlenght ?? null\"\r\n      (input)=\"onInput()\"\r\n      (focus)=\"onFocus()\"\r\n      (blur)=\"onBlur()\"\r\n      (keypress)=\"onKeyPress($event)\"\r\n      (keydown)=\"onKeyDown($event)\"\r\n      (drop)=\"onDropBlock($event)\"\r\n      (dragover)=\"onDragOverBlock($event)\"\r\n    />\r\n    @if (!disabled && textInput && isEnableClearText) {\r\n    <button class=\"button-delete\" (click)=\"clearSearch()\">\r\n      <ius-icon-md\r\n        iconName=\"icon-cancel\"\r\n        class=\"icon-color-cancel\"\r\n      ></ius-icon-md>\r\n    </button>\r\n    }\r\n  </div>\r\n  @if (labelInferior && isFocused && !error) {\r\n  <span class=\"label-inf\">{{ labelInferior }}</span>\r\n  } @if ((errorText || labelInferior) && ((!isFocused && isAlertText && !disabled) || (error && !disabled))) {\r\n  <span class=\"label-inf alert\">{{ errorText ?? labelInferior }}</span>\r\n  }\r\n</div>\r\n", styles: [".h1{font-family:Roboto,sans-serif;font-size:2.375rem;font-weight:500;line-height:46px}.h2{font-family:Roboto,sans-serif;font-size:1.875rem;font-weight:700;line-height:38px}.h3{font-family:Roboto,sans-serif;font-size:1.5rem;font-weight:500;line-height:32px}.h4{font-family:Roboto,sans-serif;font-size:1.25rem;font-weight:700;line-height:26px}.h5{font-family:Roboto,sans-serif;font-size:1.125rem;font-weight:500;line-height:24px;letter-spacing:.18px}.label-large{font-family:Roboto,sans-serif;font-size:1rem;font-weight:500;line-height:22px}.body-large{font-family:Rubik,sans-serif;font-size:1rem;font-weight:400;line-height:22px}.label-base{font-family:Rubik,sans-serif;font-size:.875rem;font-weight:500;line-height:20px;letter-spacing:.28px}.body-base{font-family:Rubik,sans-serif;font-size:.875rem;font-weight:400;line-height:20px;font-style:italic;letter-spacing:.28px}.body-base-1,.body-base-1-1{font-family:Rubik,sans-serif;font-size:.875rem;font-weight:400;line-height:20px;letter-spacing:.28px}.body-sm{font-family:Rubik,sans-serif;font-size:.75rem;font-weight:400;line-height:16px;letter-spacing:.28px}.body-sm-italic{font-family:Rubik,sans-serif;font-size:.75rem;font-weight:400;line-height:16px;font-style:italic;letter-spacing:.28px}.caption-sm{font-family:Rubik,sans-serif;font-size:.75rem;font-weight:500;line-height:16px;letter-spacing:.28px}.caption-sm-italic{font-family:Rubik,sans-serif;font-size:.75rem;font-weight:500;line-height:16px;font-style:italic;letter-spacing:.28px}.container-general{position:relative;height:100%}.container-textfield{display:flex;padding:10px 12px;justify-content:center;align-items:flex-start;gap:4px;border:1px solid #f5f5f5;border-radius:8px;background:#f5f5f5;font-family:Rubik,sans-serif;font-size:.875rem;font-weight:400;line-height:20px;letter-spacing:.28px;transition:all .2s ease-in-out}.container-textfield:hover:not(.disabled):not(.focused):not(.alert){background:#edf6ff}.container-textfield.focused{border:1px solid #0581BC;background:#edf6ff}.container-textfield.disabled{background:#f5f5f5}.container-textfield.disabled .icon-color,.container-textfield.disabled input{color:#bfbfbf}.container-textfield.disabled input::placeholder{color:#bfbfbf;opacity:1}.container-textfield.alert{border:1px solid #DB2E2A;background:#fff4f0}.icon-color{color:#595959}.icon-color-cancel{color:#013169}input{display:flex;align-items:center;flex:1 0 0;border:none;outline:none;background-color:transparent;font-family:Rubik,sans-serif;font-size:.875rem;font-weight:400;line-height:20px;letter-spacing:.28px}.button-delete{display:flex;align-items:center;justify-content:center;background:none;border:none;cursor:pointer;padding:0;color:#595959}.button-delete:hover{color:#013169}.container-label-sup{display:flex;align-items:center;gap:4px;margin-bottom:8px;color:#333;font-family:Roboto,sans-serif;font-size:.875rem;font-weight:500;line-height:20px;letter-spacing:.28px}.container-label-sup.disabled{color:#bfbfbf}.icon-dot{display:flex;align-items:center;width:4px;height:4px;aspect-ratio:1/1;background-color:#db2e2a;border-radius:100px}.icon-color-help{color:#8c8c8c}.label-inf{display:flex;position:absolute;margin-top:4px;color:#595959;font-family:Roboto,sans-serif;font-size:.75rem;font-style:italic;font-weight:500;line-height:16px;letter-spacing:.24px}.label-inf.alert{color:#931224}input::-webkit-outer-spin-button,input::-webkit-inner-spin-button{-webkit-appearance:none;margin:0}\n"] }]
+            args: [{ selector: 'ius-input-textfield', standalone: true, imports: [IconMdComponent, FormsModule, CommonModule], template: "<div class=\"container-general\">\r\n  @if (labelSuperior) {\r\n  <div\r\n    class=\"container-label-sup\"\r\n    [ngClass]=\"{\r\n      disabled: disabled\r\n    }\"\r\n  >\r\n    @if(!disabled && required){\r\n    <div class=\"icon-dot\"></div>\r\n    }\r\n    <span class=\"\">{{ labelSuperior }}</span>\r\n    @if(!disabled && showHelpText){\r\n    <ius-icon-md iconName=\"icon-help\" class=\"icon-color-help\"></ius-icon-md>\r\n    }\r\n    <span>:</span>\r\n  </div>\r\n  }\r\n  <div\r\n    class=\"container-textfield\"\r\n    [ngClass]=\"{\r\n      disabled: disabled,\r\n      focused: isFocused,\r\n      alert: (!isFocused && isAlertText && !disabled) || (error && !disabled)\r\n    }\"\r\n  >\r\n    @if (iconInput) {\r\n    <ius-icon-md [iconName]=\"iconInput\" class=\"icon-color\"></ius-icon-md>\r\n    }\r\n    <input\r\n      [type]=\"inputType\"\r\n      [(ngModel)]=\"textInput\"\r\n      [placeholder]=\"labelInput\"\r\n      [disabled]=\"disabled\"\r\n      [autocomplete]=\"inputType\"\r\n      [name]=\"inputType\"\r\n      [maxlength]=\"maxlenght ?? null\"\r\n      (input)=\"onInput()\"\r\n      (focus)=\"onFocus()\"\r\n      (blur)=\"onBlur()\"\r\n      (keypress)=\"onKeyPress($event)\"\r\n      (keydown)=\"onKeyDown($event)\"\r\n      (drop)=\"onDropBlock($event)\"\r\n      (dragover)=\"onDragOverBlock($event)\"\r\n    />\r\n    @if (!disabled && textInput && isEnableClearText) {\r\n    <button class=\"button-delete\" (click)=\"clearSearch()\">\r\n      <ius-icon-md\r\n        iconName=\"icon-cancel\"\r\n        class=\"icon-color-cancel\"\r\n      ></ius-icon-md>\r\n    </button>\r\n    }\r\n  </div>\r\n  @if (labelInferior && isFocused && !error) {\r\n  <span class=\"label-inf\">{{ labelInferior }}</span>\r\n  } @if ((errorText || labelInferior) && ((!isFocused && isAlertText && !disabled) || (error && !disabled))) {\r\n  <span class=\"label-inf alert\">{{ errorText ?? labelInferior }}</span>\r\n  }\r\n</div>\r\n", styles: [".h1{font-family:Roboto,sans-serif;font-size:2.375rem;font-weight:500;line-height:46px}.h2{font-family:Roboto,sans-serif;font-size:1.875rem;font-weight:700;line-height:38px}.h3{font-family:Roboto,sans-serif;font-size:1.5rem;font-weight:500;line-height:32px}.h4{font-family:Roboto,sans-serif;font-size:1.25rem;font-weight:700;line-height:26px}.h5{font-family:Roboto,sans-serif;font-size:1.125rem;font-weight:500;line-height:24px;letter-spacing:.18px}.label-large{font-family:Roboto,sans-serif;font-size:1rem;font-weight:500;line-height:22px}.body-large{font-family:Rubik,sans-serif;font-size:1rem;font-weight:400;line-height:22px}.label-base{font-family:Rubik,sans-serif;font-size:.875rem;font-weight:500;line-height:20px;letter-spacing:.28px}.body-base{font-family:Rubik,sans-serif;font-size:.875rem;font-weight:400;line-height:20px;font-style:italic;letter-spacing:.28px}.body-base-1,.body-base-1-1{font-family:Rubik,sans-serif;font-size:.875rem;font-weight:400;line-height:20px;letter-spacing:.28px}.body-sm{font-family:Rubik,sans-serif;font-size:.75rem;font-weight:400;line-height:16px;letter-spacing:.28px}.body-sm-italic{font-family:Rubik,sans-serif;font-size:.75rem;font-weight:400;line-height:16px;font-style:italic;letter-spacing:.28px}.caption-sm{font-family:Rubik,sans-serif;font-size:.75rem;font-weight:500;line-height:16px;letter-spacing:.28px}.caption-sm-italic{font-family:Rubik,sans-serif;font-size:.75rem;font-weight:500;line-height:16px;font-style:italic;letter-spacing:.28px}.container-general{position:relative;height:100%}.container-textfield{display:flex;padding:10px 12px;justify-content:center;align-items:flex-start;gap:4px;border:1px solid #f5f5f5;border-radius:8px;background:#f5f5f5;font-family:Rubik,sans-serif;font-size:.875rem;font-weight:400;line-height:20px;letter-spacing:.28px;transition:all .2s ease-in-out}.container-textfield:hover:not(.disabled):not(.focused):not(.alert){background:#edf6ff}.container-textfield.focused{border:1px solid #0581BC;background:#edf6ff}.container-textfield.disabled{background:#f5f5f5}.container-textfield.disabled .icon-color,.container-textfield.disabled input{color:#bfbfbf}.container-textfield.disabled input::placeholder{color:#bfbfbf;opacity:1}.container-textfield.alert{border:1px solid #DB2E2A;background:#fff4f0}.icon-color{color:#595959}.icon-color-cancel{color:#013169}input{display:flex;align-items:center;flex:1 0 0;border:none;outline:none;background-color:transparent;font-family:Rubik,sans-serif;font-size:.875rem;font-weight:400;line-height:20px;letter-spacing:.28px}.button-delete{display:flex;align-items:center;justify-content:center;background:none;border:none;cursor:pointer;padding:0;color:#595959}.button-delete:hover{color:#013169}.container-label-sup{display:flex;align-items:center;gap:4px;margin-bottom:8px;color:#333;font-family:Rubik,sans-serif;font-size:.875rem;font-weight:500;line-height:20px;letter-spacing:.28px}.container-label-sup.disabled{color:#bfbfbf}.icon-dot{display:flex;align-items:center;width:4px;height:4px;aspect-ratio:1/1;background-color:#db2e2a;border-radius:100px}.icon-color-help{color:#8c8c8c}.label-inf{display:flex;position:absolute;margin-top:4px;color:#595959;font-family:Roboto,sans-serif;font-size:.75rem;font-style:italic;font-weight:500;line-height:16px;letter-spacing:.24px}.label-inf.alert{color:#931224}input::-webkit-outer-spin-button,input::-webkit-inner-spin-button{-webkit-appearance:none;margin:0}\n"] }]
         }], propDecorators: { textInput: [{
                 type: Input
             }], required: [{
@@ -3006,11 +3010,11 @@ class InputSelectComponent {
         this._closePanel();
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: InputSelectComponent, deps: [{ token: i0.ElementRef }, { token: i1$2.Overlay }, { token: i0.ViewContainerRef }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "17.3.12", type: InputSelectComponent, isStandalone: true, selector: "ius-input-select", inputs: { componentId: "componentId", required: "required", disabled: "disabled", showHelpText: "showHelpText", error: "error", labelSuperior: "labelSuperior", labelInferior: "labelInferior", errorText: "errorText", labelInput: "labelInput", iconInput: "iconInput", textInput: "textInput", maxlenght: "maxlenght", inputType: "inputType" }, outputs: { onChangesValueEvent: "onChangesValueEvent", onEnterKey: "onEnterKey", onBlurEvent: "onBlurEvent" }, host: { listeners: { "document:click": "onClickOutside($event)" } }, viewQueries: [{ propertyName: "listPanel", first: true, predicate: ["listPanel"], descendants: true }], ngImport: i0, template: "<div class=\"container-general\" [id]=\"componentId\">\r\n  @if (labelSuperior) {\r\n  <div class=\"container-label-sup\" [ngClass]=\"{\r\n        'disabled': disabled\r\n    }\">\r\n    @if(!disabled && required){\r\n    <div class=\"icon-dot\"></div>\r\n    }\r\n    <span class=\"\">{{labelSuperior}}</span>\r\n    @if(!disabled && showHelpText){\r\n    <ius-icon-md iconName=\"icon-help\" class=\"icon-color-help\"></ius-icon-md>\r\n    }\r\n    <span>:</span>\r\n  </div>\r\n  }\r\n  <div class=\"container-textfield\" [ngClass]=\"{\r\n        'disabled': disabled,\r\n        'focused': isFocused,\r\n        'alert': (!isFocused && isAlertText && !disabled) || (error && !disabled)\r\n    }\" (click)=\"onFocus()\">\r\n    @if (iconInput) {\r\n    <ius-icon-md [iconName]=\"iconInput\" class=\"icon-color\"></ius-icon-md>\r\n    }\r\n    <input [type]=\"inputType\" [(ngModel)]=\"textInput\" [placeholder]=\"labelInput\" [disabled]=\"disabled\" (input)=\"onInput()\"\r\n      [maxlength]=\"maxlenght ?? null\" (focus)=\"onFocus()\" (blur)=\"onBlur()\"\r\n      (keypress)=\"onKeyPress($event)\" (drop)=\"onDropBlock($event)\" (dragover)=\"onDragOverBlock($event)\">\r\n    <div class=\"cnt-icon-right\">\r\n      @if(!showList){\r\n      <ius-icon-md iconName=\"icon-keyboard-arrow-down\" class=\"icon-arrows\"></ius-icon-md>\r\n      }@else{\r\n      <div (click)=\"closeList($event)\" style=\"height: 20px;\">\r\n        <ius-icon-md iconName=\"icon-keyboard-arrow-up\" class=\"icon-arrows\"></ius-icon-md>\r\n      </div>\r\n      }\r\n    </div>\r\n  </div>\r\n  @if (labelInferior && isFocused && !error) {\r\n  <span class=\"label-inf\">{{labelInferior}}</span>\r\n  }\r\n  @if ((errorText || labelInferior) && ((!isFocused && isAlertText && !disabled) || (error && !disabled))) {\r\n  <span class=\"label-inf\" [ngClass]=\"{\r\n        'alert': (!isFocused && isAlertText && !disabled) || (error && !disabled)\r\n    }\">{{errorText ?? labelInferior}}</span>\r\n  }\r\n  <ng-template #listPanel>\r\n    <div class=\"container-list scrollable-small\">\r\n      <div (click)=\"onSelectOption()\">\r\n        <ng-content selector=\"ius-option\"></ng-content>\r\n      </div>\r\n    </div>\r\n  </ng-template>\r\n</div>", styles: [".h1{font-family:Roboto,sans-serif;font-size:2.375rem;font-weight:500;line-height:46px}.h2{font-family:Roboto,sans-serif;font-size:1.875rem;font-weight:700;line-height:38px}.h3{font-family:Roboto,sans-serif;font-size:1.5rem;font-weight:500;line-height:32px}.h4{font-family:Roboto,sans-serif;font-size:1.25rem;font-weight:700;line-height:26px}.h5{font-family:Roboto,sans-serif;font-size:1.125rem;font-weight:500;line-height:24px;letter-spacing:.18px}.label-large{font-family:Roboto,sans-serif;font-size:1rem;font-weight:500;line-height:22px}.body-large{font-family:Rubik,sans-serif;font-size:1rem;font-weight:400;line-height:22px}.label-base{font-family:Rubik,sans-serif;font-size:.875rem;font-weight:500;line-height:20px;letter-spacing:.28px}.body-base{font-family:Rubik,sans-serif;font-size:.875rem;font-weight:400;line-height:20px;font-style:italic;letter-spacing:.28px}.body-base-1,.body-base-1-1{font-family:Rubik,sans-serif;font-size:.875rem;font-weight:400;line-height:20px;letter-spacing:.28px}.body-sm{font-family:Rubik,sans-serif;font-size:.75rem;font-weight:400;line-height:16px;letter-spacing:.28px}.body-sm-italic{font-family:Rubik,sans-serif;font-size:.75rem;font-weight:400;line-height:16px;font-style:italic;letter-spacing:.28px}.caption-sm{font-family:Rubik,sans-serif;font-size:.75rem;font-weight:500;line-height:16px;letter-spacing:.28px}.caption-sm-italic{font-family:Rubik,sans-serif;font-size:.75rem;font-weight:500;line-height:16px;font-style:italic;letter-spacing:.28px}.container-general{position:relative;height:100%}.container-textfield{display:flex;padding:10px 12px;justify-content:center;align-items:flex-start;gap:4px;cursor:pointer;border:1px solid #f5f5f5;border-radius:8px;background:#f5f5f5;font-family:Rubik,sans-serif;font-size:.875rem;font-weight:400;line-height:20px;letter-spacing:.28px}.container-textfield:hover:not(.disabled):not(.focused):not(.alert){background:#edf6ff}.container-textfield.focused{border:1px solid #0581BC;background:#edf6ff}.container-textfield.disabled{cursor:default;background:#f5f5f5}.container-textfield.disabled .icon-color,.container-textfield.disabled .icon-arrows,.container-textfield.disabled input{color:#bfbfbf}.container-textfield.disabled input::placeholder{color:#bfbfbf;opacity:1}.container-textfield.alert{border:1px solid #DB2E2A;background:#fff4f0}.container-textfield .icon-arrows{pointer-events:none}.container-textfield .icon-arrows svg{pointer-events:none}.icon-color{color:#595959}.icon-arrows{color:#333}input{display:flex;align-items:center;flex:1 0 0;border:none;outline:none;background-color:transparent;font-family:Rubik,sans-serif;font-size:.875rem;font-weight:400;line-height:20px;letter-spacing:.28px}.cnt-icon-right{display:flex;align-items:center;justify-content:center;background:none;padding:0;color:#333}.container-label-sup{display:flex;align-items:center;gap:4px;margin-bottom:8px;color:#333;font-family:Roboto,sans-serif;font-size:.875rem;font-weight:500;line-height:20px;letter-spacing:.28px}.container-label-sup.disabled{color:#bfbfbf}.icon-dot{display:flex;align-items:center;width:4px;height:4px;aspect-ratio:1/1;background-color:#db2e2a;border-radius:100px}.icon-color-help{color:#8c8c8c}.label-inf{display:flex;position:absolute;margin-top:4px;color:#595959;font-family:Roboto,sans-serif;font-size:.75rem;font-style:italic;font-weight:500;line-height:16px;letter-spacing:.24px}.label-inf.alert{color:#931224}.container-list{max-height:144px;width:100%;display:flex;flex-direction:column;border-radius:8px;background:#fff;box-shadow:0 2px 6px #00000024,0 1px 10px #0000001a;overflow-y:auto}.scrollable-small::-webkit-scrollbar{-webkit-appearance:none}.scrollable-small::-webkit-scrollbar:vertical{width:4px;height:32px;padding-top:2px;padding-bottom:2px}.scrollable-small::-webkit-scrollbar:horizontal{height:5px;padding-top:2px;padding-bottom:2px}.scrollable-small::-webkit-scrollbar-thumb{background-color:#08a6db;border-radius:4px}input::-webkit-outer-spin-button,input::-webkit-inner-spin-button{-webkit-appearance:none;margin:0}\n"], dependencies: [{ kind: "component", type: IconMdComponent, selector: "ius-icon-md", inputs: ["iconName", "color"] }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1$3.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$3.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$3.MaxLengthValidator, selector: "[maxlength][formControlName],[maxlength][formControl],[maxlength][ngModel]", inputs: ["maxlength"] }, { kind: "directive", type: i1$3.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1$1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }] }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "17.3.12", type: InputSelectComponent, isStandalone: true, selector: "ius-input-select", inputs: { componentId: "componentId", required: "required", disabled: "disabled", showHelpText: "showHelpText", error: "error", labelSuperior: "labelSuperior", labelInferior: "labelInferior", errorText: "errorText", labelInput: "labelInput", iconInput: "iconInput", textInput: "textInput", maxlenght: "maxlenght", inputType: "inputType" }, outputs: { onChangesValueEvent: "onChangesValueEvent", onEnterKey: "onEnterKey", onBlurEvent: "onBlurEvent" }, host: { listeners: { "document:click": "onClickOutside($event)" } }, viewQueries: [{ propertyName: "listPanel", first: true, predicate: ["listPanel"], descendants: true }], ngImport: i0, template: "<div class=\"container-general\" [id]=\"componentId\">\r\n  @if (labelSuperior) {\r\n  <div class=\"container-label-sup\" [ngClass]=\"{\r\n        'disabled': disabled\r\n    }\">\r\n    @if(!disabled && required){\r\n    <div class=\"icon-dot\"></div>\r\n    }\r\n    <span class=\"\">{{labelSuperior}}</span>\r\n    @if(!disabled && showHelpText){\r\n    <ius-icon-md iconName=\"icon-help\" class=\"icon-color-help\"></ius-icon-md>\r\n    }\r\n    <span>:</span>\r\n  </div>\r\n  }\r\n  <div class=\"container-textfield\" [ngClass]=\"{\r\n        'disabled': disabled,\r\n        'focused': isFocused,\r\n        'alert': (!isFocused && isAlertText && !disabled) || (error && !disabled)\r\n    }\" (click)=\"onFocus()\">\r\n    @if (iconInput) {\r\n    <ius-icon-md [iconName]=\"iconInput\" class=\"icon-color\"></ius-icon-md>\r\n    }\r\n    <input [type]=\"inputType\" [(ngModel)]=\"textInput\" [placeholder]=\"labelInput\" [disabled]=\"disabled\" (input)=\"onInput()\"\r\n      [maxlength]=\"maxlenght ?? null\" (focus)=\"onFocus()\" (blur)=\"onBlur()\"\r\n      (keypress)=\"onKeyPress($event)\" (drop)=\"onDropBlock($event)\" (dragover)=\"onDragOverBlock($event)\">\r\n    <div class=\"cnt-icon-right\">\r\n      @if(!showList){\r\n      <ius-icon-md iconName=\"icon-keyboard-arrow-down\" class=\"icon-arrows\"></ius-icon-md>\r\n      }@else{\r\n      <div (click)=\"closeList($event)\" style=\"height: 20px;\">\r\n        <ius-icon-md iconName=\"icon-keyboard-arrow-up\" class=\"icon-arrows\"></ius-icon-md>\r\n      </div>\r\n      }\r\n    </div>\r\n  </div>\r\n  @if (labelInferior && isFocused && !error) {\r\n  <span class=\"label-inf\">{{labelInferior}}</span>\r\n  }\r\n  @if ((errorText || labelInferior) && ((!isFocused && isAlertText && !disabled) || (error && !disabled))) {\r\n  <span class=\"label-inf\" [ngClass]=\"{\r\n        'alert': (!isFocused && isAlertText && !disabled) || (error && !disabled)\r\n    }\">{{errorText ?? labelInferior}}</span>\r\n  }\r\n  <ng-template #listPanel>\r\n    <div class=\"container-list scrollable-small\">\r\n      <div (click)=\"onSelectOption()\">\r\n        <ng-content selector=\"ius-option\"></ng-content>\r\n      </div>\r\n    </div>\r\n  </ng-template>\r\n</div>", styles: [".h1{font-family:Roboto,sans-serif;font-size:2.375rem;font-weight:500;line-height:46px}.h2{font-family:Roboto,sans-serif;font-size:1.875rem;font-weight:700;line-height:38px}.h3{font-family:Roboto,sans-serif;font-size:1.5rem;font-weight:500;line-height:32px}.h4{font-family:Roboto,sans-serif;font-size:1.25rem;font-weight:700;line-height:26px}.h5{font-family:Roboto,sans-serif;font-size:1.125rem;font-weight:500;line-height:24px;letter-spacing:.18px}.label-large{font-family:Roboto,sans-serif;font-size:1rem;font-weight:500;line-height:22px}.body-large{font-family:Rubik,sans-serif;font-size:1rem;font-weight:400;line-height:22px}.label-base{font-family:Rubik,sans-serif;font-size:.875rem;font-weight:500;line-height:20px;letter-spacing:.28px}.body-base{font-family:Rubik,sans-serif;font-size:.875rem;font-weight:400;line-height:20px;font-style:italic;letter-spacing:.28px}.body-base-1,.body-base-1-1{font-family:Rubik,sans-serif;font-size:.875rem;font-weight:400;line-height:20px;letter-spacing:.28px}.body-sm{font-family:Rubik,sans-serif;font-size:.75rem;font-weight:400;line-height:16px;letter-spacing:.28px}.body-sm-italic{font-family:Rubik,sans-serif;font-size:.75rem;font-weight:400;line-height:16px;font-style:italic;letter-spacing:.28px}.caption-sm{font-family:Rubik,sans-serif;font-size:.75rem;font-weight:500;line-height:16px;letter-spacing:.28px}.caption-sm-italic{font-family:Rubik,sans-serif;font-size:.75rem;font-weight:500;line-height:16px;font-style:italic;letter-spacing:.28px}.container-general{position:relative;height:100%}.container-textfield{display:flex;padding:10px 12px;justify-content:center;align-items:flex-start;gap:4px;cursor:pointer;border:1px solid #f5f5f5;border-radius:8px;background:#f5f5f5;font-family:Rubik,sans-serif;font-size:.875rem;font-weight:400;line-height:20px;letter-spacing:.28px}.container-textfield:hover:not(.disabled):not(.focused):not(.alert){background:#edf6ff}.container-textfield.focused{border:1px solid #0581BC;background:#edf6ff}.container-textfield.disabled{cursor:default;background:#f5f5f5}.container-textfield.disabled .icon-color,.container-textfield.disabled .icon-arrows,.container-textfield.disabled input{color:#bfbfbf}.container-textfield.disabled input::placeholder{color:#bfbfbf;opacity:1}.container-textfield.alert{border:1px solid #DB2E2A;background:#fff4f0}.container-textfield .icon-arrows{pointer-events:none}.container-textfield .icon-arrows svg{pointer-events:none}.icon-color{color:#595959}.icon-arrows{color:#333}input{display:flex;align-items:center;flex:1 0 0;border:none;outline:none;background-color:transparent;font-family:Rubik,sans-serif;font-size:.875rem;font-weight:400;line-height:20px;letter-spacing:.28px}.cnt-icon-right{display:flex;align-items:center;justify-content:center;background:none;padding:0;color:#333}.container-label-sup{display:flex;align-items:center;gap:4px;margin-bottom:8px;color:#333;font-family:Rubik,sans-serif;font-size:.875rem;font-weight:500;line-height:20px;letter-spacing:.28px}.container-label-sup.disabled{color:#bfbfbf}.icon-dot{display:flex;align-items:center;width:4px;height:4px;aspect-ratio:1/1;background-color:#db2e2a;border-radius:100px}.icon-color-help{color:#8c8c8c}.label-inf{display:flex;position:absolute;margin-top:4px;color:#595959;font-family:Roboto,sans-serif;font-size:.75rem;font-style:italic;font-weight:500;line-height:16px;letter-spacing:.24px}.label-inf.alert{color:#931224}.container-list{max-height:144px;width:100%;display:flex;flex-direction:column;border-radius:8px;background:#fff;box-shadow:0 2px 6px #00000024,0 1px 10px #0000001a;overflow-y:auto}.scrollable-small::-webkit-scrollbar{-webkit-appearance:none}.scrollable-small::-webkit-scrollbar:vertical{width:4px;height:32px;padding-top:2px;padding-bottom:2px}.scrollable-small::-webkit-scrollbar:horizontal{height:5px;padding-top:2px;padding-bottom:2px}.scrollable-small::-webkit-scrollbar-thumb{background-color:#08a6db;border-radius:4px}input::-webkit-outer-spin-button,input::-webkit-inner-spin-button{-webkit-appearance:none;margin:0}\n"], dependencies: [{ kind: "component", type: IconMdComponent, selector: "ius-icon-md", inputs: ["iconName", "color"] }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1$3.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$3.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$3.MaxLengthValidator, selector: "[maxlength][formControlName],[maxlength][formControl],[maxlength][ngModel]", inputs: ["maxlength"] }, { kind: "directive", type: i1$3.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1$1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }] }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: InputSelectComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'ius-input-select', standalone: true, imports: [IconMdComponent, FormsModule, CommonModule], template: "<div class=\"container-general\" [id]=\"componentId\">\r\n  @if (labelSuperior) {\r\n  <div class=\"container-label-sup\" [ngClass]=\"{\r\n        'disabled': disabled\r\n    }\">\r\n    @if(!disabled && required){\r\n    <div class=\"icon-dot\"></div>\r\n    }\r\n    <span class=\"\">{{labelSuperior}}</span>\r\n    @if(!disabled && showHelpText){\r\n    <ius-icon-md iconName=\"icon-help\" class=\"icon-color-help\"></ius-icon-md>\r\n    }\r\n    <span>:</span>\r\n  </div>\r\n  }\r\n  <div class=\"container-textfield\" [ngClass]=\"{\r\n        'disabled': disabled,\r\n        'focused': isFocused,\r\n        'alert': (!isFocused && isAlertText && !disabled) || (error && !disabled)\r\n    }\" (click)=\"onFocus()\">\r\n    @if (iconInput) {\r\n    <ius-icon-md [iconName]=\"iconInput\" class=\"icon-color\"></ius-icon-md>\r\n    }\r\n    <input [type]=\"inputType\" [(ngModel)]=\"textInput\" [placeholder]=\"labelInput\" [disabled]=\"disabled\" (input)=\"onInput()\"\r\n      [maxlength]=\"maxlenght ?? null\" (focus)=\"onFocus()\" (blur)=\"onBlur()\"\r\n      (keypress)=\"onKeyPress($event)\" (drop)=\"onDropBlock($event)\" (dragover)=\"onDragOverBlock($event)\">\r\n    <div class=\"cnt-icon-right\">\r\n      @if(!showList){\r\n      <ius-icon-md iconName=\"icon-keyboard-arrow-down\" class=\"icon-arrows\"></ius-icon-md>\r\n      }@else{\r\n      <div (click)=\"closeList($event)\" style=\"height: 20px;\">\r\n        <ius-icon-md iconName=\"icon-keyboard-arrow-up\" class=\"icon-arrows\"></ius-icon-md>\r\n      </div>\r\n      }\r\n    </div>\r\n  </div>\r\n  @if (labelInferior && isFocused && !error) {\r\n  <span class=\"label-inf\">{{labelInferior}}</span>\r\n  }\r\n  @if ((errorText || labelInferior) && ((!isFocused && isAlertText && !disabled) || (error && !disabled))) {\r\n  <span class=\"label-inf\" [ngClass]=\"{\r\n        'alert': (!isFocused && isAlertText && !disabled) || (error && !disabled)\r\n    }\">{{errorText ?? labelInferior}}</span>\r\n  }\r\n  <ng-template #listPanel>\r\n    <div class=\"container-list scrollable-small\">\r\n      <div (click)=\"onSelectOption()\">\r\n        <ng-content selector=\"ius-option\"></ng-content>\r\n      </div>\r\n    </div>\r\n  </ng-template>\r\n</div>", styles: [".h1{font-family:Roboto,sans-serif;font-size:2.375rem;font-weight:500;line-height:46px}.h2{font-family:Roboto,sans-serif;font-size:1.875rem;font-weight:700;line-height:38px}.h3{font-family:Roboto,sans-serif;font-size:1.5rem;font-weight:500;line-height:32px}.h4{font-family:Roboto,sans-serif;font-size:1.25rem;font-weight:700;line-height:26px}.h5{font-family:Roboto,sans-serif;font-size:1.125rem;font-weight:500;line-height:24px;letter-spacing:.18px}.label-large{font-family:Roboto,sans-serif;font-size:1rem;font-weight:500;line-height:22px}.body-large{font-family:Rubik,sans-serif;font-size:1rem;font-weight:400;line-height:22px}.label-base{font-family:Rubik,sans-serif;font-size:.875rem;font-weight:500;line-height:20px;letter-spacing:.28px}.body-base{font-family:Rubik,sans-serif;font-size:.875rem;font-weight:400;line-height:20px;font-style:italic;letter-spacing:.28px}.body-base-1,.body-base-1-1{font-family:Rubik,sans-serif;font-size:.875rem;font-weight:400;line-height:20px;letter-spacing:.28px}.body-sm{font-family:Rubik,sans-serif;font-size:.75rem;font-weight:400;line-height:16px;letter-spacing:.28px}.body-sm-italic{font-family:Rubik,sans-serif;font-size:.75rem;font-weight:400;line-height:16px;font-style:italic;letter-spacing:.28px}.caption-sm{font-family:Rubik,sans-serif;font-size:.75rem;font-weight:500;line-height:16px;letter-spacing:.28px}.caption-sm-italic{font-family:Rubik,sans-serif;font-size:.75rem;font-weight:500;line-height:16px;font-style:italic;letter-spacing:.28px}.container-general{position:relative;height:100%}.container-textfield{display:flex;padding:10px 12px;justify-content:center;align-items:flex-start;gap:4px;cursor:pointer;border:1px solid #f5f5f5;border-radius:8px;background:#f5f5f5;font-family:Rubik,sans-serif;font-size:.875rem;font-weight:400;line-height:20px;letter-spacing:.28px}.container-textfield:hover:not(.disabled):not(.focused):not(.alert){background:#edf6ff}.container-textfield.focused{border:1px solid #0581BC;background:#edf6ff}.container-textfield.disabled{cursor:default;background:#f5f5f5}.container-textfield.disabled .icon-color,.container-textfield.disabled .icon-arrows,.container-textfield.disabled input{color:#bfbfbf}.container-textfield.disabled input::placeholder{color:#bfbfbf;opacity:1}.container-textfield.alert{border:1px solid #DB2E2A;background:#fff4f0}.container-textfield .icon-arrows{pointer-events:none}.container-textfield .icon-arrows svg{pointer-events:none}.icon-color{color:#595959}.icon-arrows{color:#333}input{display:flex;align-items:center;flex:1 0 0;border:none;outline:none;background-color:transparent;font-family:Rubik,sans-serif;font-size:.875rem;font-weight:400;line-height:20px;letter-spacing:.28px}.cnt-icon-right{display:flex;align-items:center;justify-content:center;background:none;padding:0;color:#333}.container-label-sup{display:flex;align-items:center;gap:4px;margin-bottom:8px;color:#333;font-family:Roboto,sans-serif;font-size:.875rem;font-weight:500;line-height:20px;letter-spacing:.28px}.container-label-sup.disabled{color:#bfbfbf}.icon-dot{display:flex;align-items:center;width:4px;height:4px;aspect-ratio:1/1;background-color:#db2e2a;border-radius:100px}.icon-color-help{color:#8c8c8c}.label-inf{display:flex;position:absolute;margin-top:4px;color:#595959;font-family:Roboto,sans-serif;font-size:.75rem;font-style:italic;font-weight:500;line-height:16px;letter-spacing:.24px}.label-inf.alert{color:#931224}.container-list{max-height:144px;width:100%;display:flex;flex-direction:column;border-radius:8px;background:#fff;box-shadow:0 2px 6px #00000024,0 1px 10px #0000001a;overflow-y:auto}.scrollable-small::-webkit-scrollbar{-webkit-appearance:none}.scrollable-small::-webkit-scrollbar:vertical{width:4px;height:32px;padding-top:2px;padding-bottom:2px}.scrollable-small::-webkit-scrollbar:horizontal{height:5px;padding-top:2px;padding-bottom:2px}.scrollable-small::-webkit-scrollbar-thumb{background-color:#08a6db;border-radius:4px}input::-webkit-outer-spin-button,input::-webkit-inner-spin-button{-webkit-appearance:none;margin:0}\n"] }]
+            args: [{ selector: 'ius-input-select', standalone: true, imports: [IconMdComponent, FormsModule, CommonModule], template: "<div class=\"container-general\" [id]=\"componentId\">\r\n  @if (labelSuperior) {\r\n  <div class=\"container-label-sup\" [ngClass]=\"{\r\n        'disabled': disabled\r\n    }\">\r\n    @if(!disabled && required){\r\n    <div class=\"icon-dot\"></div>\r\n    }\r\n    <span class=\"\">{{labelSuperior}}</span>\r\n    @if(!disabled && showHelpText){\r\n    <ius-icon-md iconName=\"icon-help\" class=\"icon-color-help\"></ius-icon-md>\r\n    }\r\n    <span>:</span>\r\n  </div>\r\n  }\r\n  <div class=\"container-textfield\" [ngClass]=\"{\r\n        'disabled': disabled,\r\n        'focused': isFocused,\r\n        'alert': (!isFocused && isAlertText && !disabled) || (error && !disabled)\r\n    }\" (click)=\"onFocus()\">\r\n    @if (iconInput) {\r\n    <ius-icon-md [iconName]=\"iconInput\" class=\"icon-color\"></ius-icon-md>\r\n    }\r\n    <input [type]=\"inputType\" [(ngModel)]=\"textInput\" [placeholder]=\"labelInput\" [disabled]=\"disabled\" (input)=\"onInput()\"\r\n      [maxlength]=\"maxlenght ?? null\" (focus)=\"onFocus()\" (blur)=\"onBlur()\"\r\n      (keypress)=\"onKeyPress($event)\" (drop)=\"onDropBlock($event)\" (dragover)=\"onDragOverBlock($event)\">\r\n    <div class=\"cnt-icon-right\">\r\n      @if(!showList){\r\n      <ius-icon-md iconName=\"icon-keyboard-arrow-down\" class=\"icon-arrows\"></ius-icon-md>\r\n      }@else{\r\n      <div (click)=\"closeList($event)\" style=\"height: 20px;\">\r\n        <ius-icon-md iconName=\"icon-keyboard-arrow-up\" class=\"icon-arrows\"></ius-icon-md>\r\n      </div>\r\n      }\r\n    </div>\r\n  </div>\r\n  @if (labelInferior && isFocused && !error) {\r\n  <span class=\"label-inf\">{{labelInferior}}</span>\r\n  }\r\n  @if ((errorText || labelInferior) && ((!isFocused && isAlertText && !disabled) || (error && !disabled))) {\r\n  <span class=\"label-inf\" [ngClass]=\"{\r\n        'alert': (!isFocused && isAlertText && !disabled) || (error && !disabled)\r\n    }\">{{errorText ?? labelInferior}}</span>\r\n  }\r\n  <ng-template #listPanel>\r\n    <div class=\"container-list scrollable-small\">\r\n      <div (click)=\"onSelectOption()\">\r\n        <ng-content selector=\"ius-option\"></ng-content>\r\n      </div>\r\n    </div>\r\n  </ng-template>\r\n</div>", styles: [".h1{font-family:Roboto,sans-serif;font-size:2.375rem;font-weight:500;line-height:46px}.h2{font-family:Roboto,sans-serif;font-size:1.875rem;font-weight:700;line-height:38px}.h3{font-family:Roboto,sans-serif;font-size:1.5rem;font-weight:500;line-height:32px}.h4{font-family:Roboto,sans-serif;font-size:1.25rem;font-weight:700;line-height:26px}.h5{font-family:Roboto,sans-serif;font-size:1.125rem;font-weight:500;line-height:24px;letter-spacing:.18px}.label-large{font-family:Roboto,sans-serif;font-size:1rem;font-weight:500;line-height:22px}.body-large{font-family:Rubik,sans-serif;font-size:1rem;font-weight:400;line-height:22px}.label-base{font-family:Rubik,sans-serif;font-size:.875rem;font-weight:500;line-height:20px;letter-spacing:.28px}.body-base{font-family:Rubik,sans-serif;font-size:.875rem;font-weight:400;line-height:20px;font-style:italic;letter-spacing:.28px}.body-base-1,.body-base-1-1{font-family:Rubik,sans-serif;font-size:.875rem;font-weight:400;line-height:20px;letter-spacing:.28px}.body-sm{font-family:Rubik,sans-serif;font-size:.75rem;font-weight:400;line-height:16px;letter-spacing:.28px}.body-sm-italic{font-family:Rubik,sans-serif;font-size:.75rem;font-weight:400;line-height:16px;font-style:italic;letter-spacing:.28px}.caption-sm{font-family:Rubik,sans-serif;font-size:.75rem;font-weight:500;line-height:16px;letter-spacing:.28px}.caption-sm-italic{font-family:Rubik,sans-serif;font-size:.75rem;font-weight:500;line-height:16px;font-style:italic;letter-spacing:.28px}.container-general{position:relative;height:100%}.container-textfield{display:flex;padding:10px 12px;justify-content:center;align-items:flex-start;gap:4px;cursor:pointer;border:1px solid #f5f5f5;border-radius:8px;background:#f5f5f5;font-family:Rubik,sans-serif;font-size:.875rem;font-weight:400;line-height:20px;letter-spacing:.28px}.container-textfield:hover:not(.disabled):not(.focused):not(.alert){background:#edf6ff}.container-textfield.focused{border:1px solid #0581BC;background:#edf6ff}.container-textfield.disabled{cursor:default;background:#f5f5f5}.container-textfield.disabled .icon-color,.container-textfield.disabled .icon-arrows,.container-textfield.disabled input{color:#bfbfbf}.container-textfield.disabled input::placeholder{color:#bfbfbf;opacity:1}.container-textfield.alert{border:1px solid #DB2E2A;background:#fff4f0}.container-textfield .icon-arrows{pointer-events:none}.container-textfield .icon-arrows svg{pointer-events:none}.icon-color{color:#595959}.icon-arrows{color:#333}input{display:flex;align-items:center;flex:1 0 0;border:none;outline:none;background-color:transparent;font-family:Rubik,sans-serif;font-size:.875rem;font-weight:400;line-height:20px;letter-spacing:.28px}.cnt-icon-right{display:flex;align-items:center;justify-content:center;background:none;padding:0;color:#333}.container-label-sup{display:flex;align-items:center;gap:4px;margin-bottom:8px;color:#333;font-family:Rubik,sans-serif;font-size:.875rem;font-weight:500;line-height:20px;letter-spacing:.28px}.container-label-sup.disabled{color:#bfbfbf}.icon-dot{display:flex;align-items:center;width:4px;height:4px;aspect-ratio:1/1;background-color:#db2e2a;border-radius:100px}.icon-color-help{color:#8c8c8c}.label-inf{display:flex;position:absolute;margin-top:4px;color:#595959;font-family:Roboto,sans-serif;font-size:.75rem;font-style:italic;font-weight:500;line-height:16px;letter-spacing:.24px}.label-inf.alert{color:#931224}.container-list{max-height:144px;width:100%;display:flex;flex-direction:column;border-radius:8px;background:#fff;box-shadow:0 2px 6px #00000024,0 1px 10px #0000001a;overflow-y:auto}.scrollable-small::-webkit-scrollbar{-webkit-appearance:none}.scrollable-small::-webkit-scrollbar:vertical{width:4px;height:32px;padding-top:2px;padding-bottom:2px}.scrollable-small::-webkit-scrollbar:horizontal{height:5px;padding-top:2px;padding-bottom:2px}.scrollable-small::-webkit-scrollbar-thumb{background-color:#08a6db;border-radius:4px}input::-webkit-outer-spin-button,input::-webkit-inner-spin-button{-webkit-appearance:none;margin:0}\n"] }]
         }], ctorParameters: () => [{ type: i0.ElementRef }, { type: i1$2.Overlay }, { type: i0.ViewContainerRef }], propDecorators: { listPanel: [{
                 type: ViewChild,
                 args: ['listPanel']
@@ -4079,11 +4083,11 @@ class ToolbarUserMenuComponent {
         this.requestClose.emit();
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: ToolbarUserMenuComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "17.3.12", type: ToolbarUserMenuComponent, isStandalone: true, selector: "ius-toolbar-user-menu", inputs: { object: "object", subscripcionDetalle: "subscripcionDetalle", detallesConsumo: "detallesConsumo", accountList: "accountList" }, outputs: { clickPerfilPreferencias: "clickPerfilPreferencias", clickUsuariosRoles: "clickUsuariosRoles", clickConfiguracion: "clickConfiguracion", clickPagos: "clickPagos", clickSubsServicios: "clickSubsServicios", clickCambiarCuenta: "clickCambiarCuenta", clickCerrarSesion: "clickCerrarSesion", clickReferir: "clickReferir", requestClose: "requestClose", clickAccountSelected: "clickAccountSelected", clickAccountPredeterminada: "clickAccountPredeterminada", clickEditAccount: "clickEditAccount", clickDesvincularAccount: "clickDesvincularAccount", clickAgregarAccount: "clickAgregarAccount" }, ngImport: i0, template: "<div class=\"tbl-menu\">\r\n  <div class=\"body-menu scrollable\">\r\n    <div class=\"colum-mn-1 text-head-mn\">\r\n      <span>Estas navegando en</span>\r\n      <div class=\"tx-row-1\">\r\n        <ius-icon-sm\r\n          iconName=\"icon-account-circle\"\r\n          class=\"icon-acc-circle\"\r\n        ></ius-icon-sm>\r\n        <span class=\"h4 tx-abog\">{{ object.nombreCompany }}</span>\r\n      </div>\r\n      <div class=\"tx-row-1 id-ct\">\r\n        <span>ID Cuenta</span>\r\n        <span class=\"tx-id-ct\">{{ object.cuentaID }}</span>\r\n      </div>\r\n      <div class=\"tx-row-1 tx-rol\">\r\n        <span>Tu rol</span>\r\n        <span class=\"tx-name-rl\">{{ object.rol }}</span>\r\n      </div>\r\n    </div>\r\n    @if (!showFormSwitchAccount) {\r\n      <div class=\"colum-mn-1\">\r\n        <div class=\"email-inf\">\r\n          <ius-icon-xs\r\n            iconName=\"icon-alternate-email\"\r\n            class=\"icon-alt-email\"\r\n          ></ius-icon-xs>\r\n          <span>{{ object.correo }}</span>\r\n        </div>\r\n        <ius-dropdown-option-item (click)=\"onClickPerfilPreferencias()\"\r\n          >Perfil, preferencias y seguridad</ius-dropdown-option-item\r\n        >\r\n      </div>\r\n      <ius-simple-divider></ius-simple-divider>\r\n      <div class=\"container-plan\" [ngClass]=\"{ 'show-more': showMore }\">\r\n        <div class=\"inf-plan\">\r\n          <div class=\"row-plan-1\">\r\n            <div class=\"col-plan-1\">\r\n              <span class=\"tx-small tx-tipo-plan\">{{\r\n                subscripcionDetalle?.tipoServicio\r\n              }}</span>\r\n              <div class=\"tx-row-1\">\r\n                <span class=\"tx-base tx-name-plan\">{{\r\n                  subscripcionDetalle?.namePlan\r\n                }}</span>\r\n                <ius-icon-md\r\n                  iconName=\"icon-help\"\r\n                  class=\"icon-help\"\r\n                ></ius-icon-md>\r\n              </div>\r\n              <div class=\"tx-row-2 tx-small\">\r\n                <div class=\"tx-row-1\">\r\n                  <span class=\"tx-contador-1\">Total global</span>\r\n                  <span class=\"tx-contador-2\">{{\r\n                    subscripcionDetalle?.cantTotal\r\n                  }}</span>\r\n                </div>\r\n                <div class=\"tx-row-1\">\r\n                  <span class=\"tx-contador-1\">Disponible global</span>\r\n                  <span class=\"tx-contador-2\">{{\r\n                    subscripcionDetalle?.cantDisponible\r\n                  }}</span>\r\n                </div>\r\n              </div>\r\n              <span class=\"tx-base tx-estado-plan\">{{\r\n                subscripcionDetalle?.estado\r\n              }}</span>\r\n            </div>\r\n            <ius-button-circle-tertiary\r\n              iconName=\"icon-discover-tune\"\r\n            ></ius-button-circle-tertiary>\r\n          </div>\r\n          <div style=\"width: 100%\">\r\n            <ius-progress-bar\r\n              [total]=\"subscripcionDetalle?.cantTotal ?? 0\"\r\n              [titleV1]=\"'Judicial'\"\r\n              [v1]=\"subscripcionDetalle?.cantJudicial ?? 0\"\r\n              [titleV2]=\"'SuperSociedades'\"\r\n              [v2]=\"subscripcionDetalle?.cantProcesos2 ?? 0\"\r\n              [titleV3]=\"'Procuraduria'\"\r\n              [v3]=\"subscripcionDetalle?.cantProcesos3 ?? 0\"\r\n            >\r\n            </ius-progress-bar>\r\n          </div>\r\n          <div class=\"legend\">\r\n            <div class=\"item-counter tx-small\">\r\n              <ius-icon-xs\r\n                iconName=\"icon-storage-set\"\r\n                class=\"icon-storage-set\"\r\n              ></ius-icon-xs>\r\n              <span>{{ subscripcionDetalle?.asignados ?? 0 }}</span>\r\n            </div>\r\n            <div class=\"item-counter tx-small\">\r\n              <ius-icon-xs\r\n                iconName=\"icon-storage-plus\"\r\n                class=\"icon-storage-plus\"\r\n              ></ius-icon-xs>\r\n              <span>{{\r\n                subscripcionDetalle?.cantAsignadaDisponible ?? 0\r\n              }}</span>\r\n            </div>\r\n          </div>\r\n        </div>\r\n        <ius-simple-divider></ius-simple-divider>\r\n        @if (detallesConsumo) {\r\n          @for (detail of detallesConsumo; track $index) {\r\n            <div class=\"inf-plan\">\r\n              <div class=\"row-plan-1\">\r\n                <div class=\"col-plan-1\">\r\n                  <span class=\"tx-small tx-tipo-plan\">{{\r\n                    detail.tipoServicio\r\n                  }}</span>\r\n                  <div class=\"tx-row-1\">\r\n                    <span class=\"tx-base tx-name-plan\">Por consumo</span>\r\n                    <ius-icon-md\r\n                      iconName=\"icon-help\"\r\n                      class=\"icon-help\"\r\n                    ></ius-icon-md>\r\n                  </div>\r\n                  <div class=\"tx-row-2 tx-small\">\r\n                    <div class=\"tx-row-1\">\r\n                      <span class=\"tx-contador-1\">Consumo este mes</span>\r\n                      <span class=\"tx-contador-2\">{{\r\n                        detail.cantConsumida\r\n                      }}</span>\r\n                    </div>\r\n                  </div>\r\n                  <span class=\"tx-base tx-estado-plan\">{{\r\n                    detail.estado\r\n                  }}</span>\r\n                </div>\r\n                <ius-button-circle-tertiary\r\n                  iconName=\"icon-discover-tune\"\r\n                ></ius-button-circle-tertiary>\r\n              </div>\r\n            </div>\r\n            <ius-simple-divider></ius-simple-divider>\r\n          }\r\n        }\r\n      </div>\r\n      <ius-button-standard-tertiary\r\n        class=\"btn-list\"\r\n        [iconName]=\"\r\n          showMore ? 'icon-keyboard-arrow-up' : 'icon-keyboard-arrow-down'\r\n        \"\r\n        (buttonClicked)=\"clickShowMore()\"\r\n      >\r\n        {{ showMore ? \"Mostrar menos\" : \"Mostrar m\u00E1s\" }}\r\n      </ius-button-standard-tertiary>\r\n      <ius-simple-divider></ius-simple-divider>\r\n      <div class=\"ctn-items\">\r\n        <ius-menu-item\r\n          iconName=\"icon-groups\"\r\n          (buttonClicked)=\"onClickUsuariosRoles()\"\r\n          >Usuarios y roles</ius-menu-item\r\n        >\r\n        <ius-menu-item\r\n          iconName=\"icon-build\"\r\n          (buttonClicked)=\"onClickConfiguracion()\"\r\n          >Configuraci\u00F3n de la cuenta</ius-menu-item\r\n        >\r\n        <ius-menu-item\r\n          iconName=\"icon-finance-chip\"\r\n          (buttonClicked)=\"onClickPagos()\"\r\n          >Pagos y facturaci\u00F3n</ius-menu-item\r\n        >\r\n        <ius-menu-item\r\n          iconName=\"icon-enterprise\"\r\n          (buttonClicked)=\"onClickSubsServicios()\"\r\n          >Suscripciones y servicios</ius-menu-item\r\n        >\r\n        <ius-menu-item iconName=\"icon-stream\" (buttonClicked)=\"onClickReferir()\"\r\n          >Referir servicio</ius-menu-item\r\n        >\r\n      </div>\r\n\r\n      <ius-simple-divider></ius-simple-divider>\r\n    } @else {\r\n      <div class=\"container-bottom\">\r\n        <span class=\"tx-row-1 tx-rol\">Cambiar a</span>\r\n        <div class=\"container-list\">\r\n          @for (account of accountList; track account; let i = $index) {\r\n            <ius-button-accounts\r\n              (accountSelected)=\"onClickAccount(account)\"\r\n              (onPressedPredeterminado)=\"\r\n                clickAccountPredeterminada.emit(account)\r\n              \"\r\n              ,\r\n              (onPressedEditar)=\"clickEditAccount.emit(account)\"\r\n              ,\r\n              (onPressedDesvincular)=\"clickDesvincularAccount.emit(account)\"\r\n              [account]=\"account\"\r\n            ></ius-button-accounts>\r\n          }\r\n        </div>\r\n        <!-- <ius-button-standard-tertiary [iconName]=\"'icon-add'\" (buttonClicked)=\"addAccount()\">Agregar\r\n                nueva cuenta</ius-button-standard-tertiary> -->\r\n      </div>\r\n    }\r\n  </div>\r\n  <div class=\"ctn-items mgt-8\">\r\n    <ius-menu-item\r\n      iconName=\"{{\r\n        !showFormSwitchAccount ? 'icon-cases' : 'icon-arrow-left-alt'\r\n      }}\"\r\n      (buttonClicked)=\"onClickCambiarCuenta()\"\r\n      >{{\r\n        !showFormSwitchAccount\r\n          ? \"Cambiar de cuenta\"\r\n          : \"Volver al menu de usuario\"\r\n      }}</ius-menu-item\r\n    >\r\n    <ius-menu-item\r\n      iconName=\"icon-exit-to-app\"\r\n      (buttonClicked)=\"onClickCerrarSesion()\"\r\n      >Cerrar sesi\u00F3n</ius-menu-item\r\n    >\r\n  </div>\r\n</div>\r\n", styles: [".h1{font-family:Roboto,sans-serif;font-size:2.375rem;font-weight:500;line-height:46px}.h2{font-family:Roboto,sans-serif;font-size:1.875rem;font-weight:700;line-height:38px}.h3{font-family:Roboto,sans-serif;font-size:1.5rem;font-weight:500;line-height:32px}.h4{font-family:Roboto,sans-serif;font-size:1.25rem;font-weight:700;line-height:26px}.h5{font-family:Roboto,sans-serif;font-size:1.125rem;font-weight:500;line-height:24px;letter-spacing:.18px}.label-large{font-family:Roboto,sans-serif;font-size:1rem;font-weight:500;line-height:22px}.body-large{font-family:Rubik,sans-serif;font-size:1rem;font-weight:400;line-height:22px}.label-base{font-family:Rubik,sans-serif;font-size:.875rem;font-weight:500;line-height:20px;letter-spacing:.28px}.body-base{font-family:Rubik,sans-serif;font-size:.875rem;font-weight:400;line-height:20px;font-style:italic;letter-spacing:.28px}.body-base-1,.body-base-1-1{font-family:Rubik,sans-serif;font-size:.875rem;font-weight:400;line-height:20px;letter-spacing:.28px}.body-sm{font-family:Rubik,sans-serif;font-size:.75rem;font-weight:400;line-height:16px;letter-spacing:.28px}.body-sm-italic{font-family:Rubik,sans-serif;font-size:.75rem;font-weight:400;line-height:16px;font-style:italic;letter-spacing:.28px}.caption-sm{font-family:Rubik,sans-serif;font-size:.75rem;font-weight:500;line-height:16px;letter-spacing:.28px}.caption-sm-italic{font-family:Rubik,sans-serif;font-size:.75rem;font-weight:500;line-height:16px;font-style:italic;letter-spacing:.28px}.tbl-menu{display:flex;width:390px;height:85vh;padding:16px;flex-direction:column}.body-menu{display:flex;flex:1 0 0;flex-direction:column;padding-right:6px;gap:8px;font-family:Rubik,sans-serif;overflow-y:auto;min-height:0}.colum-mn-1{display:flex;flex-direction:column;align-items:flex-start;gap:4px}.text-head-mn{color:#8c8c8c;font-size:.75rem;line-height:16px;letter-spacing:.24px}.icon-acc-circle{color:#595959}.tx-row-1{display:flex;align-items:center;gap:4px}.tx-abog{color:#333;letter-spacing:.2px}.id-ct{padding:4px;border-radius:4px;border:1px solid #d9d9d9}.tx-id-ct{font-weight:500}.tx-rol{font-size:.875rem;color:#595959;line-height:20px}.tx-name-rl{color:#333;letter-spacing:.28px;font-weight:500}.email-inf{display:flex;padding:8px;align-items:center;gap:4px;color:#595959;font-size:.875rem;line-height:20px;letter-spacing:.28px}.icon-alt-email{color:#7caf25}ius-dropdown-option-item{width:100%}.container-plan{overflow:hidden;max-height:200px;transition:max-height .5s cubic-bezier(.4,0,.2,1);flex-shrink:0}.inf-plan{display:flex;padding:8px;flex-direction:column;align-items:flex-start;gap:8px}.show-more{max-height:10000px;transition:max-height .5s cubic-bezier(.4,0,.2,1)}.tx-small{font-size:.75rem;line-height:16px;letter-spacing:.24px}.tx-base{font-size:.875rem;line-height:20px;letter-spacing:.28px}.row-plan-1{display:flex;gap:12px;width:100%}.col-plan-1{display:flex;flex-direction:column;justify-content:center;align-items:flex-start;flex:1 0 0}.icon-help{color:#8c8c8c}.tx-tipo-plan{color:#595959;font-weight:500}.tx-name-plan{color:#333;font-weight:500}.tx-row-2{display:flex;align-items:center;gap:8px}.tx-contador-1{color:#8c8c8c;font-weight:500}.tx-contador-2{color:#333}.tx-estado-plan{color:#7caf25}.mgt-8{margin-top:8px}.progress-container{width:100%;border-radius:100px;height:23px;overflow:hidden;background:#f0f0f0}.progress-bar{display:flex;height:100%}.segment{height:100%}.tipo-1-color-bar{background:#5892ff}.tipo-1-color{color:#5892ff}.tipo-2-color-bar{background:#103ab7}.tipo-2-color{color:#103ab7}.legend{display:flex;width:100%;align-items:center;gap:8px;flex-wrap:wrap}.legend .icon-storage-set{color:#103ab7}.legend .icon-storage-plus{color:#629219}.item-counter{display:flex;align-items:center;gap:4px;color:#333}.tx-name-serv{color:#595959;font-weight:500}.btn-list{margin-bottom:8px}.ctn-items{display:flex;flex-direction:column;gap:4px}.scrollable{overflow-y:auto;overflow-x:hidden}.scrollable::-webkit-scrollbar{-webkit-appearance:none}.scrollable::-webkit-scrollbar:vertical{width:7px}.scrollable::-webkit-scrollbar-thumb{background-color:#d8d6d6;border-radius:20px}.container-bottom{padding:0 16px;display:flex;flex-direction:column;gap:8px}.container-list{display:flex;flex-direction:column;gap:4px;width:90%}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1$1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "component", type: IconSmComponent, selector: "ius-icon-sm", inputs: ["iconName", "color"] }, { kind: "component", type: IconXsComponent, selector: "ius-icon-xs", inputs: ["iconName", "color"] }, { kind: "component", type: DropdownOptionItemComponent, selector: "ius-dropdown-option-item", inputs: ["iconName", "route"], outputs: ["click"] }, { kind: "component", type: SimpleDividerComponent, selector: "ius-simple-divider" }, { kind: "component", type: IconMdComponent, selector: "ius-icon-md", inputs: ["iconName", "color"] }, { kind: "component", type: ButtonCircleTertiaryComponent, selector: "ius-button-circle-tertiary", inputs: ["disabled", "iconName"], outputs: ["buttonClicked"] }, { kind: "component", type: ButtonStandardTertiaryComponent, selector: "ius-button-standard-tertiary", inputs: ["disabled", "iconName"], outputs: ["buttonClicked"] }, { kind: "component", type: MenuItemComponent, selector: "ius-menu-item", inputs: ["isActive", "iconName", "numberAlerts"], outputs: ["buttonClicked"] }, { kind: "component", type: ProgressBarComponent, selector: "ius-progress-bar", inputs: ["total", "v1", "v2", "v3", "titleV1", "titleV2", "titleV3", "titleV4"] }, { kind: "component", type: ButtonAccountsComponent, selector: "ius-button-accounts", inputs: ["account"], outputs: ["accountSelected", "onPressedPredeterminado", "onPressedDesvincular", "onPressedEditar"] }] }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "17.3.12", type: ToolbarUserMenuComponent, isStandalone: true, selector: "ius-toolbar-user-menu", inputs: { object: "object", subscripcionDetalle: "subscripcionDetalle", detallesConsumo: "detallesConsumo", accountList: "accountList" }, outputs: { clickPerfilPreferencias: "clickPerfilPreferencias", clickUsuariosRoles: "clickUsuariosRoles", clickConfiguracion: "clickConfiguracion", clickPagos: "clickPagos", clickSubsServicios: "clickSubsServicios", clickCambiarCuenta: "clickCambiarCuenta", clickCerrarSesion: "clickCerrarSesion", clickReferir: "clickReferir", requestClose: "requestClose", clickAccountSelected: "clickAccountSelected", clickAccountPredeterminada: "clickAccountPredeterminada", clickEditAccount: "clickEditAccount", clickDesvincularAccount: "clickDesvincularAccount", clickAgregarAccount: "clickAgregarAccount" }, ngImport: i0, template: "<div class=\"tbl-menu\">\r\n  <div class=\"body-menu scrollable\">\r\n    <div class=\"colum-mn-1 text-head-mn\">\r\n      <span>Estas navegando en</span>\r\n      <div class=\"tx-row-1\">\r\n        <ius-icon-sm\r\n          iconName=\"icon-account-circle\"\r\n          class=\"icon-acc-circle\"\r\n        ></ius-icon-sm>\r\n        <span class=\"h4 tx-abog\">{{ object.nombreCompany }}</span>\r\n      </div>\r\n      <div class=\"tx-row-1 id-ct\">\r\n        <span>ID Cuenta</span>\r\n        <span class=\"tx-id-ct\">{{ object.cuentaID }}</span>\r\n      </div>\r\n      <div class=\"tx-row-1 tx-rol\">\r\n        <span>Tu rol</span>\r\n        <span class=\"tx-name-rl\">{{ object.rol }}</span>\r\n      </div>\r\n    </div>\r\n    @if (!showFormSwitchAccount) {\r\n      <div class=\"colum-mn-1\">\r\n        <div class=\"email-inf\">\r\n          <ius-icon-xs\r\n            iconName=\"icon-alternate-email\"\r\n            class=\"icon-alt-email\"\r\n          ></ius-icon-xs>\r\n          <span>{{ object.correo }}</span>\r\n        </div>\r\n        <ius-dropdown-option-item (click)=\"onClickPerfilPreferencias()\"\r\n          >Perfil, preferencias y seguridad</ius-dropdown-option-item\r\n        >\r\n      </div>\r\n      <ius-simple-divider></ius-simple-divider>\r\n      <div class=\"container-plan\" [ngClass]=\"{ 'show-more': showMore }\">\r\n        <div class=\"inf-plan\">\r\n          <div class=\"row-plan-1\">\r\n            <div class=\"col-plan-1\">\r\n              <span class=\"tx-small tx-tipo-plan\">{{\r\n                subscripcionDetalle?.tipoServicio\r\n              }}</span>\r\n              <div class=\"tx-row-1\">\r\n                <span class=\"tx-base tx-name-plan\">{{\r\n                  subscripcionDetalle?.namePlan\r\n                }}</span>\r\n                <ius-icon-md\r\n                  iconName=\"icon-help\"\r\n                  class=\"icon-help\"\r\n                ></ius-icon-md>\r\n              </div>\r\n              <div class=\"tx-row-2 tx-small\">\r\n                <div class=\"tx-row-1\">\r\n                  <span class=\"tx-contador-1\">Total global</span>\r\n                  <span class=\"tx-contador-2\">{{\r\n                    subscripcionDetalle?.cantTotal\r\n                  }}</span>\r\n                </div>\r\n                <div class=\"tx-row-1\">\r\n                  <span class=\"tx-contador-1\">Disponible global</span>\r\n                  <span class=\"tx-contador-2\">{{\r\n                    subscripcionDetalle?.cantDisponible\r\n                  }}</span>\r\n                </div>\r\n              </div>\r\n              <span class=\"tx-base tx-estado-plan\">{{\r\n                subscripcionDetalle?.estado\r\n              }}</span>\r\n            </div>\r\n            <ius-button-circle-tertiary\r\n              iconName=\"icon-discover-tune\"\r\n            ></ius-button-circle-tertiary>\r\n          </div>\r\n          <div style=\"width: 100%\">\r\n            <ius-progress-bar\r\n              [total]=\"subscripcionDetalle?.cantTotal ?? 0\"\r\n              [titleV1]=\"'Judicial'\"\r\n              [v1]=\"subscripcionDetalle?.cantJudicial ?? 0\"\r\n              [titleV2]=\"'SuperSociedades'\"\r\n              [v2]=\"subscripcionDetalle?.cantProcesos2 ?? 0\"\r\n              [titleV3]=\"'Procuraduria'\"\r\n              [v3]=\"subscripcionDetalle?.cantProcesos3 ?? 0\"\r\n            >\r\n            </ius-progress-bar>\r\n          </div>\r\n          <div class=\"legend\">\r\n            <div class=\"item-counter tx-small\">\r\n              <ius-icon-xs\r\n                iconName=\"icon-storage-set\"\r\n                class=\"icon-storage-set\"\r\n              ></ius-icon-xs>\r\n              <span>{{ subscripcionDetalle?.asignados ?? 0 }}</span>\r\n            </div>\r\n            <div class=\"item-counter tx-small\">\r\n              <ius-icon-xs\r\n                iconName=\"icon-storage-plus\"\r\n                class=\"icon-storage-plus\"\r\n              ></ius-icon-xs>\r\n              <span>{{\r\n                subscripcionDetalle?.cantAsignadaDisponible ?? 0\r\n              }}</span>\r\n            </div>\r\n          </div>\r\n        </div>\r\n        <ius-simple-divider></ius-simple-divider>\r\n        @if (detallesConsumo) {\r\n          @for (detail of detallesConsumo; track $index) {\r\n            <div class=\"inf-plan\">\r\n              <div class=\"row-plan-1\">\r\n                <div class=\"col-plan-1\">\r\n                  <span class=\"tx-small tx-tipo-plan\">{{\r\n                    detail.tipoServicio\r\n                  }}</span>\r\n                  <div class=\"tx-row-1\">\r\n                    <span class=\"tx-base tx-name-plan\">Por consumo</span>\r\n                    <ius-icon-md\r\n                      iconName=\"icon-help\"\r\n                      class=\"icon-help\"\r\n                    ></ius-icon-md>\r\n                  </div>\r\n                  <div class=\"tx-row-2 tx-small\">\r\n                    <div class=\"tx-row-1\">\r\n                      <span class=\"tx-contador-1\">Consumo este mes</span>\r\n                      <span class=\"tx-contador-2\">{{\r\n                        detail.cantConsumida\r\n                      }}</span>\r\n                    </div>\r\n                  </div>\r\n                  <span class=\"tx-base tx-estado-plan\">{{\r\n                    detail.estado\r\n                  }}</span>\r\n                </div>\r\n                <ius-button-circle-tertiary\r\n                  iconName=\"icon-discover-tune\"\r\n                ></ius-button-circle-tertiary>\r\n              </div>\r\n            </div>\r\n            <ius-simple-divider></ius-simple-divider>\r\n          }\r\n        }\r\n      </div>\r\n      <ius-button-standard-tertiary\r\n        class=\"btn-list\"\r\n        [iconName]=\"\r\n          showMore ? 'icon-keyboard-arrow-up' : 'icon-keyboard-arrow-down'\r\n        \"\r\n        (buttonClicked)=\"clickShowMore()\"\r\n      >\r\n        {{ showMore ? \"Mostrar menos\" : \"Mostrar m\u00E1s\" }}\r\n      </ius-button-standard-tertiary>\r\n      <ius-simple-divider></ius-simple-divider>\r\n      <div class=\"ctn-items\">\r\n        <ius-menu-item\r\n          iconName=\"icon-groups\"\r\n          (buttonClicked)=\"onClickUsuariosRoles()\"\r\n          >Usuarios y roles</ius-menu-item\r\n        >\r\n        <ius-menu-item\r\n          iconName=\"icon-build\"\r\n          (buttonClicked)=\"onClickConfiguracion()\"\r\n          >Configuraci\u00F3n de la cuenta</ius-menu-item\r\n        >\r\n        <ius-menu-item\r\n          iconName=\"icon-finance-chip\"\r\n          (buttonClicked)=\"onClickPagos()\"\r\n          >Pagos y facturaci\u00F3n</ius-menu-item\r\n        >\r\n        <ius-menu-item\r\n          iconName=\"icon-enterprise\"\r\n          (buttonClicked)=\"onClickSubsServicios()\"\r\n          >Suscripciones y servicios</ius-menu-item\r\n        >\r\n        <ius-menu-item iconName=\"icon-stream\" (buttonClicked)=\"onClickReferir()\"\r\n          >Referir servicio</ius-menu-item\r\n        >\r\n      </div>\r\n\r\n      <ius-simple-divider></ius-simple-divider>\r\n    } @else {\r\n      <div class=\"container-bottom\">\r\n        <span class=\"tx-row-1 tx-rol\">Cambiar a</span>\r\n        <div class=\"container-list\">\r\n          @for (account of accountList; track account; let i = $index) {\r\n            <ius-button-accounts\r\n              (accountSelected)=\"onClickAccount(account)\"\r\n              (onPressedPredeterminado)=\"\r\n                clickAccountPredeterminada.emit(account)\r\n              \"\r\n              ,\r\n              (onPressedEditar)=\"clickEditAccount.emit(account)\"\r\n              ,\r\n              (onPressedDesvincular)=\"clickDesvincularAccount.emit(account)\"\r\n              [account]=\"account\"\r\n              [showOptionsFlag]=\"false\"\r\n            ></ius-button-accounts>\r\n          }\r\n        </div>\r\n        <ius-button-standard-tertiary [iconName]=\"'icon-add'\" (buttonClicked)=\"addAccount()\">Agregar\r\n                nueva cuenta</ius-button-standard-tertiary>\r\n      </div>\r\n    }\r\n  </div>\r\n  <div class=\"ctn-items mgt-8\">\r\n    <ius-menu-item\r\n      iconName=\"{{\r\n        !showFormSwitchAccount ? 'icon-cases' : 'icon-arrow-left-alt'\r\n      }}\"\r\n      (buttonClicked)=\"onClickCambiarCuenta()\"\r\n      >{{\r\n        !showFormSwitchAccount\r\n          ? \"Cambiar de cuenta\"\r\n          : \"Volver al menu de usuario\"\r\n      }}</ius-menu-item\r\n    >\r\n    <ius-menu-item\r\n      iconName=\"icon-exit-to-app\"\r\n      (buttonClicked)=\"onClickCerrarSesion()\"\r\n      >Cerrar sesi\u00F3n</ius-menu-item\r\n    >\r\n  </div>\r\n</div>\r\n", styles: [".h1{font-family:Roboto,sans-serif;font-size:2.375rem;font-weight:500;line-height:46px}.h2{font-family:Roboto,sans-serif;font-size:1.875rem;font-weight:700;line-height:38px}.h3{font-family:Roboto,sans-serif;font-size:1.5rem;font-weight:500;line-height:32px}.h4{font-family:Roboto,sans-serif;font-size:1.25rem;font-weight:700;line-height:26px}.h5{font-family:Roboto,sans-serif;font-size:1.125rem;font-weight:500;line-height:24px;letter-spacing:.18px}.label-large{font-family:Roboto,sans-serif;font-size:1rem;font-weight:500;line-height:22px}.body-large{font-family:Rubik,sans-serif;font-size:1rem;font-weight:400;line-height:22px}.label-base{font-family:Rubik,sans-serif;font-size:.875rem;font-weight:500;line-height:20px;letter-spacing:.28px}.body-base{font-family:Rubik,sans-serif;font-size:.875rem;font-weight:400;line-height:20px;font-style:italic;letter-spacing:.28px}.body-base-1,.body-base-1-1{font-family:Rubik,sans-serif;font-size:.875rem;font-weight:400;line-height:20px;letter-spacing:.28px}.body-sm{font-family:Rubik,sans-serif;font-size:.75rem;font-weight:400;line-height:16px;letter-spacing:.28px}.body-sm-italic{font-family:Rubik,sans-serif;font-size:.75rem;font-weight:400;line-height:16px;font-style:italic;letter-spacing:.28px}.caption-sm{font-family:Rubik,sans-serif;font-size:.75rem;font-weight:500;line-height:16px;letter-spacing:.28px}.caption-sm-italic{font-family:Rubik,sans-serif;font-size:.75rem;font-weight:500;line-height:16px;font-style:italic;letter-spacing:.28px}.tbl-menu{display:flex;width:390px;height:85vh;padding:16px;flex-direction:column}.body-menu{display:flex;flex:1 0 0;flex-direction:column;padding-right:6px;gap:8px;font-family:Rubik,sans-serif;overflow-y:auto;min-height:0}.colum-mn-1{display:flex;flex-direction:column;align-items:flex-start;gap:4px}.text-head-mn{color:#8c8c8c;font-size:.75rem;line-height:16px;letter-spacing:.24px}.icon-acc-circle{color:#595959}.tx-row-1{display:flex;align-items:center;gap:4px}.tx-abog{color:#333;letter-spacing:.2px}.id-ct{padding:4px;border-radius:4px;border:1px solid #d9d9d9}.tx-id-ct{font-weight:500}.tx-rol{font-size:.875rem;color:#595959;line-height:20px}.tx-name-rl{color:#333;letter-spacing:.28px;font-weight:500}.email-inf{display:flex;padding:8px;align-items:center;gap:4px;color:#595959;font-size:.875rem;line-height:20px;letter-spacing:.28px}.icon-alt-email{color:#7caf25}ius-dropdown-option-item{width:100%}.container-plan{overflow:hidden;max-height:200px;transition:max-height .5s cubic-bezier(.4,0,.2,1);flex-shrink:0}.inf-plan{display:flex;padding:8px;flex-direction:column;align-items:flex-start;gap:8px}.show-more{max-height:10000px;transition:max-height .5s cubic-bezier(.4,0,.2,1)}.tx-small{font-size:.75rem;line-height:16px;letter-spacing:.24px}.tx-base{font-size:.875rem;line-height:20px;letter-spacing:.28px}.row-plan-1{display:flex;gap:12px;width:100%}.col-plan-1{display:flex;flex-direction:column;justify-content:center;align-items:flex-start;flex:1 0 0}.icon-help{color:#8c8c8c}.tx-tipo-plan{color:#595959;font-weight:500}.tx-name-plan{color:#333;font-weight:500}.tx-row-2{display:flex;align-items:center;gap:8px}.tx-contador-1{color:#8c8c8c;font-weight:500}.tx-contador-2{color:#333}.tx-estado-plan{color:#7caf25}.mgt-8{margin-top:8px}.progress-container{width:100%;border-radius:100px;height:23px;overflow:hidden;background:#f0f0f0}.progress-bar{display:flex;height:100%}.segment{height:100%}.tipo-1-color-bar{background:#5892ff}.tipo-1-color{color:#5892ff}.tipo-2-color-bar{background:#103ab7}.tipo-2-color{color:#103ab7}.legend{display:flex;width:100%;align-items:center;gap:8px;flex-wrap:wrap}.legend .icon-storage-set{color:#103ab7}.legend .icon-storage-plus{color:#629219}.item-counter{display:flex;align-items:center;gap:4px;color:#333}.tx-name-serv{color:#595959;font-weight:500}.btn-list{margin-bottom:8px}.ctn-items{display:flex;flex-direction:column;gap:4px}.scrollable{overflow-y:auto;overflow-x:hidden}.scrollable::-webkit-scrollbar{-webkit-appearance:none}.scrollable::-webkit-scrollbar:vertical{width:7px}.scrollable::-webkit-scrollbar-thumb{background-color:#d8d6d6;border-radius:20px}.container-bottom{padding:0 16px;display:flex;flex-direction:column;gap:8px}.container-list{display:flex;flex-direction:column;gap:4px;width:90%}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1$1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "component", type: IconSmComponent, selector: "ius-icon-sm", inputs: ["iconName", "color"] }, { kind: "component", type: IconXsComponent, selector: "ius-icon-xs", inputs: ["iconName", "color"] }, { kind: "component", type: DropdownOptionItemComponent, selector: "ius-dropdown-option-item", inputs: ["iconName", "route"], outputs: ["click"] }, { kind: "component", type: SimpleDividerComponent, selector: "ius-simple-divider" }, { kind: "component", type: IconMdComponent, selector: "ius-icon-md", inputs: ["iconName", "color"] }, { kind: "component", type: ButtonCircleTertiaryComponent, selector: "ius-button-circle-tertiary", inputs: ["disabled", "iconName"], outputs: ["buttonClicked"] }, { kind: "component", type: ButtonStandardTertiaryComponent, selector: "ius-button-standard-tertiary", inputs: ["disabled", "iconName"], outputs: ["buttonClicked"] }, { kind: "component", type: MenuItemComponent, selector: "ius-menu-item", inputs: ["isActive", "iconName", "numberAlerts"], outputs: ["buttonClicked"] }, { kind: "component", type: ProgressBarComponent, selector: "ius-progress-bar", inputs: ["total", "v1", "v2", "v3", "titleV1", "titleV2", "titleV3", "titleV4"] }, { kind: "component", type: ButtonAccountsComponent, selector: "ius-button-accounts", inputs: ["account", "showOptionsFlag"], outputs: ["accountSelected", "onPressedPredeterminado", "onPressedDesvincular", "onPressedEditar"] }] }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: ToolbarUserMenuComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'ius-toolbar-user-menu', standalone: true, imports: [CommonModule, IconSmComponent, IconXsComponent, DropdownOptionItemComponent, SimpleDividerComponent, IconMdComponent, ButtonCircleTertiaryComponent, ButtonStandardTertiaryComponent, MenuItemComponent, ProgressBarComponent, ButtonAccountsComponent], template: "<div class=\"tbl-menu\">\r\n  <div class=\"body-menu scrollable\">\r\n    <div class=\"colum-mn-1 text-head-mn\">\r\n      <span>Estas navegando en</span>\r\n      <div class=\"tx-row-1\">\r\n        <ius-icon-sm\r\n          iconName=\"icon-account-circle\"\r\n          class=\"icon-acc-circle\"\r\n        ></ius-icon-sm>\r\n        <span class=\"h4 tx-abog\">{{ object.nombreCompany }}</span>\r\n      </div>\r\n      <div class=\"tx-row-1 id-ct\">\r\n        <span>ID Cuenta</span>\r\n        <span class=\"tx-id-ct\">{{ object.cuentaID }}</span>\r\n      </div>\r\n      <div class=\"tx-row-1 tx-rol\">\r\n        <span>Tu rol</span>\r\n        <span class=\"tx-name-rl\">{{ object.rol }}</span>\r\n      </div>\r\n    </div>\r\n    @if (!showFormSwitchAccount) {\r\n      <div class=\"colum-mn-1\">\r\n        <div class=\"email-inf\">\r\n          <ius-icon-xs\r\n            iconName=\"icon-alternate-email\"\r\n            class=\"icon-alt-email\"\r\n          ></ius-icon-xs>\r\n          <span>{{ object.correo }}</span>\r\n        </div>\r\n        <ius-dropdown-option-item (click)=\"onClickPerfilPreferencias()\"\r\n          >Perfil, preferencias y seguridad</ius-dropdown-option-item\r\n        >\r\n      </div>\r\n      <ius-simple-divider></ius-simple-divider>\r\n      <div class=\"container-plan\" [ngClass]=\"{ 'show-more': showMore }\">\r\n        <div class=\"inf-plan\">\r\n          <div class=\"row-plan-1\">\r\n            <div class=\"col-plan-1\">\r\n              <span class=\"tx-small tx-tipo-plan\">{{\r\n                subscripcionDetalle?.tipoServicio\r\n              }}</span>\r\n              <div class=\"tx-row-1\">\r\n                <span class=\"tx-base tx-name-plan\">{{\r\n                  subscripcionDetalle?.namePlan\r\n                }}</span>\r\n                <ius-icon-md\r\n                  iconName=\"icon-help\"\r\n                  class=\"icon-help\"\r\n                ></ius-icon-md>\r\n              </div>\r\n              <div class=\"tx-row-2 tx-small\">\r\n                <div class=\"tx-row-1\">\r\n                  <span class=\"tx-contador-1\">Total global</span>\r\n                  <span class=\"tx-contador-2\">{{\r\n                    subscripcionDetalle?.cantTotal\r\n                  }}</span>\r\n                </div>\r\n                <div class=\"tx-row-1\">\r\n                  <span class=\"tx-contador-1\">Disponible global</span>\r\n                  <span class=\"tx-contador-2\">{{\r\n                    subscripcionDetalle?.cantDisponible\r\n                  }}</span>\r\n                </div>\r\n              </div>\r\n              <span class=\"tx-base tx-estado-plan\">{{\r\n                subscripcionDetalle?.estado\r\n              }}</span>\r\n            </div>\r\n            <ius-button-circle-tertiary\r\n              iconName=\"icon-discover-tune\"\r\n            ></ius-button-circle-tertiary>\r\n          </div>\r\n          <div style=\"width: 100%\">\r\n            <ius-progress-bar\r\n              [total]=\"subscripcionDetalle?.cantTotal ?? 0\"\r\n              [titleV1]=\"'Judicial'\"\r\n              [v1]=\"subscripcionDetalle?.cantJudicial ?? 0\"\r\n              [titleV2]=\"'SuperSociedades'\"\r\n              [v2]=\"subscripcionDetalle?.cantProcesos2 ?? 0\"\r\n              [titleV3]=\"'Procuraduria'\"\r\n              [v3]=\"subscripcionDetalle?.cantProcesos3 ?? 0\"\r\n            >\r\n            </ius-progress-bar>\r\n          </div>\r\n          <div class=\"legend\">\r\n            <div class=\"item-counter tx-small\">\r\n              <ius-icon-xs\r\n                iconName=\"icon-storage-set\"\r\n                class=\"icon-storage-set\"\r\n              ></ius-icon-xs>\r\n              <span>{{ subscripcionDetalle?.asignados ?? 0 }}</span>\r\n            </div>\r\n            <div class=\"item-counter tx-small\">\r\n              <ius-icon-xs\r\n                iconName=\"icon-storage-plus\"\r\n                class=\"icon-storage-plus\"\r\n              ></ius-icon-xs>\r\n              <span>{{\r\n                subscripcionDetalle?.cantAsignadaDisponible ?? 0\r\n              }}</span>\r\n            </div>\r\n          </div>\r\n        </div>\r\n        <ius-simple-divider></ius-simple-divider>\r\n        @if (detallesConsumo) {\r\n          @for (detail of detallesConsumo; track $index) {\r\n            <div class=\"inf-plan\">\r\n              <div class=\"row-plan-1\">\r\n                <div class=\"col-plan-1\">\r\n                  <span class=\"tx-small tx-tipo-plan\">{{\r\n                    detail.tipoServicio\r\n                  }}</span>\r\n                  <div class=\"tx-row-1\">\r\n                    <span class=\"tx-base tx-name-plan\">Por consumo</span>\r\n                    <ius-icon-md\r\n                      iconName=\"icon-help\"\r\n                      class=\"icon-help\"\r\n                    ></ius-icon-md>\r\n                  </div>\r\n                  <div class=\"tx-row-2 tx-small\">\r\n                    <div class=\"tx-row-1\">\r\n                      <span class=\"tx-contador-1\">Consumo este mes</span>\r\n                      <span class=\"tx-contador-2\">{{\r\n                        detail.cantConsumida\r\n                      }}</span>\r\n                    </div>\r\n                  </div>\r\n                  <span class=\"tx-base tx-estado-plan\">{{\r\n                    detail.estado\r\n                  }}</span>\r\n                </div>\r\n                <ius-button-circle-tertiary\r\n                  iconName=\"icon-discover-tune\"\r\n                ></ius-button-circle-tertiary>\r\n              </div>\r\n            </div>\r\n            <ius-simple-divider></ius-simple-divider>\r\n          }\r\n        }\r\n      </div>\r\n      <ius-button-standard-tertiary\r\n        class=\"btn-list\"\r\n        [iconName]=\"\r\n          showMore ? 'icon-keyboard-arrow-up' : 'icon-keyboard-arrow-down'\r\n        \"\r\n        (buttonClicked)=\"clickShowMore()\"\r\n      >\r\n        {{ showMore ? \"Mostrar menos\" : \"Mostrar m\u00E1s\" }}\r\n      </ius-button-standard-tertiary>\r\n      <ius-simple-divider></ius-simple-divider>\r\n      <div class=\"ctn-items\">\r\n        <ius-menu-item\r\n          iconName=\"icon-groups\"\r\n          (buttonClicked)=\"onClickUsuariosRoles()\"\r\n          >Usuarios y roles</ius-menu-item\r\n        >\r\n        <ius-menu-item\r\n          iconName=\"icon-build\"\r\n          (buttonClicked)=\"onClickConfiguracion()\"\r\n          >Configuraci\u00F3n de la cuenta</ius-menu-item\r\n        >\r\n        <ius-menu-item\r\n          iconName=\"icon-finance-chip\"\r\n          (buttonClicked)=\"onClickPagos()\"\r\n          >Pagos y facturaci\u00F3n</ius-menu-item\r\n        >\r\n        <ius-menu-item\r\n          iconName=\"icon-enterprise\"\r\n          (buttonClicked)=\"onClickSubsServicios()\"\r\n          >Suscripciones y servicios</ius-menu-item\r\n        >\r\n        <ius-menu-item iconName=\"icon-stream\" (buttonClicked)=\"onClickReferir()\"\r\n          >Referir servicio</ius-menu-item\r\n        >\r\n      </div>\r\n\r\n      <ius-simple-divider></ius-simple-divider>\r\n    } @else {\r\n      <div class=\"container-bottom\">\r\n        <span class=\"tx-row-1 tx-rol\">Cambiar a</span>\r\n        <div class=\"container-list\">\r\n          @for (account of accountList; track account; let i = $index) {\r\n            <ius-button-accounts\r\n              (accountSelected)=\"onClickAccount(account)\"\r\n              (onPressedPredeterminado)=\"\r\n                clickAccountPredeterminada.emit(account)\r\n              \"\r\n              ,\r\n              (onPressedEditar)=\"clickEditAccount.emit(account)\"\r\n              ,\r\n              (onPressedDesvincular)=\"clickDesvincularAccount.emit(account)\"\r\n              [account]=\"account\"\r\n            ></ius-button-accounts>\r\n          }\r\n        </div>\r\n        <!-- <ius-button-standard-tertiary [iconName]=\"'icon-add'\" (buttonClicked)=\"addAccount()\">Agregar\r\n                nueva cuenta</ius-button-standard-tertiary> -->\r\n      </div>\r\n    }\r\n  </div>\r\n  <div class=\"ctn-items mgt-8\">\r\n    <ius-menu-item\r\n      iconName=\"{{\r\n        !showFormSwitchAccount ? 'icon-cases' : 'icon-arrow-left-alt'\r\n      }}\"\r\n      (buttonClicked)=\"onClickCambiarCuenta()\"\r\n      >{{\r\n        !showFormSwitchAccount\r\n          ? \"Cambiar de cuenta\"\r\n          : \"Volver al menu de usuario\"\r\n      }}</ius-menu-item\r\n    >\r\n    <ius-menu-item\r\n      iconName=\"icon-exit-to-app\"\r\n      (buttonClicked)=\"onClickCerrarSesion()\"\r\n      >Cerrar sesi\u00F3n</ius-menu-item\r\n    >\r\n  </div>\r\n</div>\r\n", styles: [".h1{font-family:Roboto,sans-serif;font-size:2.375rem;font-weight:500;line-height:46px}.h2{font-family:Roboto,sans-serif;font-size:1.875rem;font-weight:700;line-height:38px}.h3{font-family:Roboto,sans-serif;font-size:1.5rem;font-weight:500;line-height:32px}.h4{font-family:Roboto,sans-serif;font-size:1.25rem;font-weight:700;line-height:26px}.h5{font-family:Roboto,sans-serif;font-size:1.125rem;font-weight:500;line-height:24px;letter-spacing:.18px}.label-large{font-family:Roboto,sans-serif;font-size:1rem;font-weight:500;line-height:22px}.body-large{font-family:Rubik,sans-serif;font-size:1rem;font-weight:400;line-height:22px}.label-base{font-family:Rubik,sans-serif;font-size:.875rem;font-weight:500;line-height:20px;letter-spacing:.28px}.body-base{font-family:Rubik,sans-serif;font-size:.875rem;font-weight:400;line-height:20px;font-style:italic;letter-spacing:.28px}.body-base-1,.body-base-1-1{font-family:Rubik,sans-serif;font-size:.875rem;font-weight:400;line-height:20px;letter-spacing:.28px}.body-sm{font-family:Rubik,sans-serif;font-size:.75rem;font-weight:400;line-height:16px;letter-spacing:.28px}.body-sm-italic{font-family:Rubik,sans-serif;font-size:.75rem;font-weight:400;line-height:16px;font-style:italic;letter-spacing:.28px}.caption-sm{font-family:Rubik,sans-serif;font-size:.75rem;font-weight:500;line-height:16px;letter-spacing:.28px}.caption-sm-italic{font-family:Rubik,sans-serif;font-size:.75rem;font-weight:500;line-height:16px;font-style:italic;letter-spacing:.28px}.tbl-menu{display:flex;width:390px;height:85vh;padding:16px;flex-direction:column}.body-menu{display:flex;flex:1 0 0;flex-direction:column;padding-right:6px;gap:8px;font-family:Rubik,sans-serif;overflow-y:auto;min-height:0}.colum-mn-1{display:flex;flex-direction:column;align-items:flex-start;gap:4px}.text-head-mn{color:#8c8c8c;font-size:.75rem;line-height:16px;letter-spacing:.24px}.icon-acc-circle{color:#595959}.tx-row-1{display:flex;align-items:center;gap:4px}.tx-abog{color:#333;letter-spacing:.2px}.id-ct{padding:4px;border-radius:4px;border:1px solid #d9d9d9}.tx-id-ct{font-weight:500}.tx-rol{font-size:.875rem;color:#595959;line-height:20px}.tx-name-rl{color:#333;letter-spacing:.28px;font-weight:500}.email-inf{display:flex;padding:8px;align-items:center;gap:4px;color:#595959;font-size:.875rem;line-height:20px;letter-spacing:.28px}.icon-alt-email{color:#7caf25}ius-dropdown-option-item{width:100%}.container-plan{overflow:hidden;max-height:200px;transition:max-height .5s cubic-bezier(.4,0,.2,1);flex-shrink:0}.inf-plan{display:flex;padding:8px;flex-direction:column;align-items:flex-start;gap:8px}.show-more{max-height:10000px;transition:max-height .5s cubic-bezier(.4,0,.2,1)}.tx-small{font-size:.75rem;line-height:16px;letter-spacing:.24px}.tx-base{font-size:.875rem;line-height:20px;letter-spacing:.28px}.row-plan-1{display:flex;gap:12px;width:100%}.col-plan-1{display:flex;flex-direction:column;justify-content:center;align-items:flex-start;flex:1 0 0}.icon-help{color:#8c8c8c}.tx-tipo-plan{color:#595959;font-weight:500}.tx-name-plan{color:#333;font-weight:500}.tx-row-2{display:flex;align-items:center;gap:8px}.tx-contador-1{color:#8c8c8c;font-weight:500}.tx-contador-2{color:#333}.tx-estado-plan{color:#7caf25}.mgt-8{margin-top:8px}.progress-container{width:100%;border-radius:100px;height:23px;overflow:hidden;background:#f0f0f0}.progress-bar{display:flex;height:100%}.segment{height:100%}.tipo-1-color-bar{background:#5892ff}.tipo-1-color{color:#5892ff}.tipo-2-color-bar{background:#103ab7}.tipo-2-color{color:#103ab7}.legend{display:flex;width:100%;align-items:center;gap:8px;flex-wrap:wrap}.legend .icon-storage-set{color:#103ab7}.legend .icon-storage-plus{color:#629219}.item-counter{display:flex;align-items:center;gap:4px;color:#333}.tx-name-serv{color:#595959;font-weight:500}.btn-list{margin-bottom:8px}.ctn-items{display:flex;flex-direction:column;gap:4px}.scrollable{overflow-y:auto;overflow-x:hidden}.scrollable::-webkit-scrollbar{-webkit-appearance:none}.scrollable::-webkit-scrollbar:vertical{width:7px}.scrollable::-webkit-scrollbar-thumb{background-color:#d8d6d6;border-radius:20px}.container-bottom{padding:0 16px;display:flex;flex-direction:column;gap:8px}.container-list{display:flex;flex-direction:column;gap:4px;width:90%}\n"] }]
+            args: [{ selector: 'ius-toolbar-user-menu', standalone: true, imports: [CommonModule, IconSmComponent, IconXsComponent, DropdownOptionItemComponent, SimpleDividerComponent, IconMdComponent, ButtonCircleTertiaryComponent, ButtonStandardTertiaryComponent, MenuItemComponent, ProgressBarComponent, ButtonAccountsComponent], template: "<div class=\"tbl-menu\">\r\n  <div class=\"body-menu scrollable\">\r\n    <div class=\"colum-mn-1 text-head-mn\">\r\n      <span>Estas navegando en</span>\r\n      <div class=\"tx-row-1\">\r\n        <ius-icon-sm\r\n          iconName=\"icon-account-circle\"\r\n          class=\"icon-acc-circle\"\r\n        ></ius-icon-sm>\r\n        <span class=\"h4 tx-abog\">{{ object.nombreCompany }}</span>\r\n      </div>\r\n      <div class=\"tx-row-1 id-ct\">\r\n        <span>ID Cuenta</span>\r\n        <span class=\"tx-id-ct\">{{ object.cuentaID }}</span>\r\n      </div>\r\n      <div class=\"tx-row-1 tx-rol\">\r\n        <span>Tu rol</span>\r\n        <span class=\"tx-name-rl\">{{ object.rol }}</span>\r\n      </div>\r\n    </div>\r\n    @if (!showFormSwitchAccount) {\r\n      <div class=\"colum-mn-1\">\r\n        <div class=\"email-inf\">\r\n          <ius-icon-xs\r\n            iconName=\"icon-alternate-email\"\r\n            class=\"icon-alt-email\"\r\n          ></ius-icon-xs>\r\n          <span>{{ object.correo }}</span>\r\n        </div>\r\n        <ius-dropdown-option-item (click)=\"onClickPerfilPreferencias()\"\r\n          >Perfil, preferencias y seguridad</ius-dropdown-option-item\r\n        >\r\n      </div>\r\n      <ius-simple-divider></ius-simple-divider>\r\n      <div class=\"container-plan\" [ngClass]=\"{ 'show-more': showMore }\">\r\n        <div class=\"inf-plan\">\r\n          <div class=\"row-plan-1\">\r\n            <div class=\"col-plan-1\">\r\n              <span class=\"tx-small tx-tipo-plan\">{{\r\n                subscripcionDetalle?.tipoServicio\r\n              }}</span>\r\n              <div class=\"tx-row-1\">\r\n                <span class=\"tx-base tx-name-plan\">{{\r\n                  subscripcionDetalle?.namePlan\r\n                }}</span>\r\n                <ius-icon-md\r\n                  iconName=\"icon-help\"\r\n                  class=\"icon-help\"\r\n                ></ius-icon-md>\r\n              </div>\r\n              <div class=\"tx-row-2 tx-small\">\r\n                <div class=\"tx-row-1\">\r\n                  <span class=\"tx-contador-1\">Total global</span>\r\n                  <span class=\"tx-contador-2\">{{\r\n                    subscripcionDetalle?.cantTotal\r\n                  }}</span>\r\n                </div>\r\n                <div class=\"tx-row-1\">\r\n                  <span class=\"tx-contador-1\">Disponible global</span>\r\n                  <span class=\"tx-contador-2\">{{\r\n                    subscripcionDetalle?.cantDisponible\r\n                  }}</span>\r\n                </div>\r\n              </div>\r\n              <span class=\"tx-base tx-estado-plan\">{{\r\n                subscripcionDetalle?.estado\r\n              }}</span>\r\n            </div>\r\n            <ius-button-circle-tertiary\r\n              iconName=\"icon-discover-tune\"\r\n            ></ius-button-circle-tertiary>\r\n          </div>\r\n          <div style=\"width: 100%\">\r\n            <ius-progress-bar\r\n              [total]=\"subscripcionDetalle?.cantTotal ?? 0\"\r\n              [titleV1]=\"'Judicial'\"\r\n              [v1]=\"subscripcionDetalle?.cantJudicial ?? 0\"\r\n              [titleV2]=\"'SuperSociedades'\"\r\n              [v2]=\"subscripcionDetalle?.cantProcesos2 ?? 0\"\r\n              [titleV3]=\"'Procuraduria'\"\r\n              [v3]=\"subscripcionDetalle?.cantProcesos3 ?? 0\"\r\n            >\r\n            </ius-progress-bar>\r\n          </div>\r\n          <div class=\"legend\">\r\n            <div class=\"item-counter tx-small\">\r\n              <ius-icon-xs\r\n                iconName=\"icon-storage-set\"\r\n                class=\"icon-storage-set\"\r\n              ></ius-icon-xs>\r\n              <span>{{ subscripcionDetalle?.asignados ?? 0 }}</span>\r\n            </div>\r\n            <div class=\"item-counter tx-small\">\r\n              <ius-icon-xs\r\n                iconName=\"icon-storage-plus\"\r\n                class=\"icon-storage-plus\"\r\n              ></ius-icon-xs>\r\n              <span>{{\r\n                subscripcionDetalle?.cantAsignadaDisponible ?? 0\r\n              }}</span>\r\n            </div>\r\n          </div>\r\n        </div>\r\n        <ius-simple-divider></ius-simple-divider>\r\n        @if (detallesConsumo) {\r\n          @for (detail of detallesConsumo; track $index) {\r\n            <div class=\"inf-plan\">\r\n              <div class=\"row-plan-1\">\r\n                <div class=\"col-plan-1\">\r\n                  <span class=\"tx-small tx-tipo-plan\">{{\r\n                    detail.tipoServicio\r\n                  }}</span>\r\n                  <div class=\"tx-row-1\">\r\n                    <span class=\"tx-base tx-name-plan\">Por consumo</span>\r\n                    <ius-icon-md\r\n                      iconName=\"icon-help\"\r\n                      class=\"icon-help\"\r\n                    ></ius-icon-md>\r\n                  </div>\r\n                  <div class=\"tx-row-2 tx-small\">\r\n                    <div class=\"tx-row-1\">\r\n                      <span class=\"tx-contador-1\">Consumo este mes</span>\r\n                      <span class=\"tx-contador-2\">{{\r\n                        detail.cantConsumida\r\n                      }}</span>\r\n                    </div>\r\n                  </div>\r\n                  <span class=\"tx-base tx-estado-plan\">{{\r\n                    detail.estado\r\n                  }}</span>\r\n                </div>\r\n                <ius-button-circle-tertiary\r\n                  iconName=\"icon-discover-tune\"\r\n                ></ius-button-circle-tertiary>\r\n              </div>\r\n            </div>\r\n            <ius-simple-divider></ius-simple-divider>\r\n          }\r\n        }\r\n      </div>\r\n      <ius-button-standard-tertiary\r\n        class=\"btn-list\"\r\n        [iconName]=\"\r\n          showMore ? 'icon-keyboard-arrow-up' : 'icon-keyboard-arrow-down'\r\n        \"\r\n        (buttonClicked)=\"clickShowMore()\"\r\n      >\r\n        {{ showMore ? \"Mostrar menos\" : \"Mostrar m\u00E1s\" }}\r\n      </ius-button-standard-tertiary>\r\n      <ius-simple-divider></ius-simple-divider>\r\n      <div class=\"ctn-items\">\r\n        <ius-menu-item\r\n          iconName=\"icon-groups\"\r\n          (buttonClicked)=\"onClickUsuariosRoles()\"\r\n          >Usuarios y roles</ius-menu-item\r\n        >\r\n        <ius-menu-item\r\n          iconName=\"icon-build\"\r\n          (buttonClicked)=\"onClickConfiguracion()\"\r\n          >Configuraci\u00F3n de la cuenta</ius-menu-item\r\n        >\r\n        <ius-menu-item\r\n          iconName=\"icon-finance-chip\"\r\n          (buttonClicked)=\"onClickPagos()\"\r\n          >Pagos y facturaci\u00F3n</ius-menu-item\r\n        >\r\n        <ius-menu-item\r\n          iconName=\"icon-enterprise\"\r\n          (buttonClicked)=\"onClickSubsServicios()\"\r\n          >Suscripciones y servicios</ius-menu-item\r\n        >\r\n        <ius-menu-item iconName=\"icon-stream\" (buttonClicked)=\"onClickReferir()\"\r\n          >Referir servicio</ius-menu-item\r\n        >\r\n      </div>\r\n\r\n      <ius-simple-divider></ius-simple-divider>\r\n    } @else {\r\n      <div class=\"container-bottom\">\r\n        <span class=\"tx-row-1 tx-rol\">Cambiar a</span>\r\n        <div class=\"container-list\">\r\n          @for (account of accountList; track account; let i = $index) {\r\n            <ius-button-accounts\r\n              (accountSelected)=\"onClickAccount(account)\"\r\n              (onPressedPredeterminado)=\"\r\n                clickAccountPredeterminada.emit(account)\r\n              \"\r\n              ,\r\n              (onPressedEditar)=\"clickEditAccount.emit(account)\"\r\n              ,\r\n              (onPressedDesvincular)=\"clickDesvincularAccount.emit(account)\"\r\n              [account]=\"account\"\r\n              [showOptionsFlag]=\"false\"\r\n            ></ius-button-accounts>\r\n          }\r\n        </div>\r\n        <ius-button-standard-tertiary [iconName]=\"'icon-add'\" (buttonClicked)=\"addAccount()\">Agregar\r\n                nueva cuenta</ius-button-standard-tertiary>\r\n      </div>\r\n    }\r\n  </div>\r\n  <div class=\"ctn-items mgt-8\">\r\n    <ius-menu-item\r\n      iconName=\"{{\r\n        !showFormSwitchAccount ? 'icon-cases' : 'icon-arrow-left-alt'\r\n      }}\"\r\n      (buttonClicked)=\"onClickCambiarCuenta()\"\r\n      >{{\r\n        !showFormSwitchAccount\r\n          ? \"Cambiar de cuenta\"\r\n          : \"Volver al menu de usuario\"\r\n      }}</ius-menu-item\r\n    >\r\n    <ius-menu-item\r\n      iconName=\"icon-exit-to-app\"\r\n      (buttonClicked)=\"onClickCerrarSesion()\"\r\n      >Cerrar sesi\u00F3n</ius-menu-item\r\n    >\r\n  </div>\r\n</div>\r\n", styles: [".h1{font-family:Roboto,sans-serif;font-size:2.375rem;font-weight:500;line-height:46px}.h2{font-family:Roboto,sans-serif;font-size:1.875rem;font-weight:700;line-height:38px}.h3{font-family:Roboto,sans-serif;font-size:1.5rem;font-weight:500;line-height:32px}.h4{font-family:Roboto,sans-serif;font-size:1.25rem;font-weight:700;line-height:26px}.h5{font-family:Roboto,sans-serif;font-size:1.125rem;font-weight:500;line-height:24px;letter-spacing:.18px}.label-large{font-family:Roboto,sans-serif;font-size:1rem;font-weight:500;line-height:22px}.body-large{font-family:Rubik,sans-serif;font-size:1rem;font-weight:400;line-height:22px}.label-base{font-family:Rubik,sans-serif;font-size:.875rem;font-weight:500;line-height:20px;letter-spacing:.28px}.body-base{font-family:Rubik,sans-serif;font-size:.875rem;font-weight:400;line-height:20px;font-style:italic;letter-spacing:.28px}.body-base-1,.body-base-1-1{font-family:Rubik,sans-serif;font-size:.875rem;font-weight:400;line-height:20px;letter-spacing:.28px}.body-sm{font-family:Rubik,sans-serif;font-size:.75rem;font-weight:400;line-height:16px;letter-spacing:.28px}.body-sm-italic{font-family:Rubik,sans-serif;font-size:.75rem;font-weight:400;line-height:16px;font-style:italic;letter-spacing:.28px}.caption-sm{font-family:Rubik,sans-serif;font-size:.75rem;font-weight:500;line-height:16px;letter-spacing:.28px}.caption-sm-italic{font-family:Rubik,sans-serif;font-size:.75rem;font-weight:500;line-height:16px;font-style:italic;letter-spacing:.28px}.tbl-menu{display:flex;width:390px;height:85vh;padding:16px;flex-direction:column}.body-menu{display:flex;flex:1 0 0;flex-direction:column;padding-right:6px;gap:8px;font-family:Rubik,sans-serif;overflow-y:auto;min-height:0}.colum-mn-1{display:flex;flex-direction:column;align-items:flex-start;gap:4px}.text-head-mn{color:#8c8c8c;font-size:.75rem;line-height:16px;letter-spacing:.24px}.icon-acc-circle{color:#595959}.tx-row-1{display:flex;align-items:center;gap:4px}.tx-abog{color:#333;letter-spacing:.2px}.id-ct{padding:4px;border-radius:4px;border:1px solid #d9d9d9}.tx-id-ct{font-weight:500}.tx-rol{font-size:.875rem;color:#595959;line-height:20px}.tx-name-rl{color:#333;letter-spacing:.28px;font-weight:500}.email-inf{display:flex;padding:8px;align-items:center;gap:4px;color:#595959;font-size:.875rem;line-height:20px;letter-spacing:.28px}.icon-alt-email{color:#7caf25}ius-dropdown-option-item{width:100%}.container-plan{overflow:hidden;max-height:200px;transition:max-height .5s cubic-bezier(.4,0,.2,1);flex-shrink:0}.inf-plan{display:flex;padding:8px;flex-direction:column;align-items:flex-start;gap:8px}.show-more{max-height:10000px;transition:max-height .5s cubic-bezier(.4,0,.2,1)}.tx-small{font-size:.75rem;line-height:16px;letter-spacing:.24px}.tx-base{font-size:.875rem;line-height:20px;letter-spacing:.28px}.row-plan-1{display:flex;gap:12px;width:100%}.col-plan-1{display:flex;flex-direction:column;justify-content:center;align-items:flex-start;flex:1 0 0}.icon-help{color:#8c8c8c}.tx-tipo-plan{color:#595959;font-weight:500}.tx-name-plan{color:#333;font-weight:500}.tx-row-2{display:flex;align-items:center;gap:8px}.tx-contador-1{color:#8c8c8c;font-weight:500}.tx-contador-2{color:#333}.tx-estado-plan{color:#7caf25}.mgt-8{margin-top:8px}.progress-container{width:100%;border-radius:100px;height:23px;overflow:hidden;background:#f0f0f0}.progress-bar{display:flex;height:100%}.segment{height:100%}.tipo-1-color-bar{background:#5892ff}.tipo-1-color{color:#5892ff}.tipo-2-color-bar{background:#103ab7}.tipo-2-color{color:#103ab7}.legend{display:flex;width:100%;align-items:center;gap:8px;flex-wrap:wrap}.legend .icon-storage-set{color:#103ab7}.legend .icon-storage-plus{color:#629219}.item-counter{display:flex;align-items:center;gap:4px;color:#333}.tx-name-serv{color:#595959;font-weight:500}.btn-list{margin-bottom:8px}.ctn-items{display:flex;flex-direction:column;gap:4px}.scrollable{overflow-y:auto;overflow-x:hidden}.scrollable::-webkit-scrollbar{-webkit-appearance:none}.scrollable::-webkit-scrollbar:vertical{width:7px}.scrollable::-webkit-scrollbar-thumb{background-color:#d8d6d6;border-radius:20px}.container-bottom{padding:0 16px;display:flex;flex-direction:column;gap:8px}.container-list{display:flex;flex-direction:column;gap:4px;width:90%}\n"] }]
         }], propDecorators: { object: [{
                 type: Input,
                 args: [{ required: true }]
@@ -4823,11 +4827,11 @@ class InputPasswordComponent {
         }
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: InputPasswordComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "17.3.12", type: InputPasswordComponent, isStandalone: true, selector: "ius-input-password", inputs: { textInput: "textInput", required: "required", disabled: "disabled", showHelpText: "showHelpText", labelSuperior: "labelSuperior", labelInferior: "labelInferior", errorText: "errorText", labelInput: "labelInput", iconInput: "iconInput", error: "error" }, outputs: { onChangesValueEvent: "onChangesValueEvent", onEnterKey: "onEnterKey", onBlurEvent: "onBlurEvent" }, ngImport: i0, template: "<div class=\"container-general\">\r\n    @if (labelSuperior) {\r\n    <div class=\"container-label-sup\" [ngClass]=\"{\r\n        'disabled': disabled\r\n    }\">\r\n        @if(!disabled && required){\r\n        <div class=\"icon-dot\"></div>\r\n        }\r\n        <span class=\"\">{{labelSuperior}}</span>\r\n        @if(!disabled && showHelpText){\r\n        <ius-icon-md iconName=\"icon-help\" class=\"icon-color-help\"></ius-icon-md>\r\n        }\r\n        <span>:</span>\r\n    </div>\r\n    }\r\n    <div class=\"container-textfield\" [ngClass]=\"{\r\n        'disabled': disabled,\r\n        'focused': isFocused,\r\n        'alert': (!isFocused && isAlertText && !disabled) || (error && !disabled)\r\n    }\">\r\n        @if (iconInput) {\r\n        <ius-icon-md [iconName]=\"iconInput\" class=\"icon-color\"></ius-icon-md>\r\n        }\r\n        <input [type]=\"passwordVisible ? 'text' : 'password'\" [(ngModel)]=\"textInput\" [placeholder]=\"labelInput\" [disabled]=\"disabled\"\r\n            (input)=\"onInput()\" (focus)=\"onFocus()\" (blur)=\"onBlur()\" (keypress)=\"onKeyPress($event)\" (keydown)=\"onKeyDown($event)\" />\r\n        @if (!disabled && textInput) {\r\n        <button class=\"button-delete\" (click)=\"togglePasswordVisibility()\">\r\n          @if (passwordVisible) {\r\n            <ius-icon-md iconName=\"icon-visibility\" class=\"icon-color-cancel\"></ius-icon-md>\r\n          }@else{\r\n            <ius-icon-md iconName=\"icon-visibility\" class=\"icon-color-cancel\"></ius-icon-md>\r\n          }\r\n        </button>\r\n        }\r\n    </div>\r\n    @if ((errorText || labelInferior) && ((!isFocused && isAlertText && !disabled) || (error && !disabled))) {\r\n    <span class=\"label-inf alert\">{{ errorText ?? labelInferior }}</span>\r\n    } @else if (isCapsLockOn && isFocused && !disabled) {\r\n    <span class=\"label-inf warning\">Bloq May\u00FAs activado</span>\r\n    } @else if (labelInferior && isFocused) {\r\n    <span class=\"label-inf\">{{labelInferior}}</span>\r\n    }\r\n\r\n</div>", styles: [".h1{font-family:Roboto,sans-serif;font-size:2.375rem;font-weight:500;line-height:46px}.h2{font-family:Roboto,sans-serif;font-size:1.875rem;font-weight:700;line-height:38px}.h3{font-family:Roboto,sans-serif;font-size:1.5rem;font-weight:500;line-height:32px}.h4{font-family:Roboto,sans-serif;font-size:1.25rem;font-weight:700;line-height:26px}.h5{font-family:Roboto,sans-serif;font-size:1.125rem;font-weight:500;line-height:24px;letter-spacing:.18px}.label-large{font-family:Roboto,sans-serif;font-size:1rem;font-weight:500;line-height:22px}.body-large{font-family:Rubik,sans-serif;font-size:1rem;font-weight:400;line-height:22px}.label-base{font-family:Rubik,sans-serif;font-size:.875rem;font-weight:500;line-height:20px;letter-spacing:.28px}.body-base{font-family:Rubik,sans-serif;font-size:.875rem;font-weight:400;line-height:20px;font-style:italic;letter-spacing:.28px}.body-base-1,.body-base-1-1{font-family:Rubik,sans-serif;font-size:.875rem;font-weight:400;line-height:20px;letter-spacing:.28px}.body-sm{font-family:Rubik,sans-serif;font-size:.75rem;font-weight:400;line-height:16px;letter-spacing:.28px}.body-sm-italic{font-family:Rubik,sans-serif;font-size:.75rem;font-weight:400;line-height:16px;font-style:italic;letter-spacing:.28px}.caption-sm{font-family:Rubik,sans-serif;font-size:.75rem;font-weight:500;line-height:16px;letter-spacing:.28px}.caption-sm-italic{font-family:Rubik,sans-serif;font-size:.75rem;font-weight:500;line-height:16px;font-style:italic;letter-spacing:.28px}.container-general{position:relative;height:100%}.container-textfield{display:flex;padding:10px 12px;justify-content:center;align-items:flex-start;gap:4px;border:1px solid #f5f5f5;border-radius:8px;background:#f5f5f5;font-family:Rubik,sans-serif;font-size:.875rem;font-weight:400;line-height:20px;letter-spacing:.28px;transition:all .2s ease-in-out}.container-textfield:hover:not(.disabled):not(.focused):not(.alert){background:#edf6ff}.container-textfield.focused{border:1px solid #0581BC;background:#edf6ff}.container-textfield.disabled{background:#f5f5f5}.container-textfield.disabled .icon-color{color:#bfbfbf}.container-textfield.disabled input::placeholder{color:#bfbfbf;opacity:1}.container-textfield.alert{border:1px solid #DB2E2A;background:#fff4f0}.icon-color{color:#595959}.icon-color-cancel{color:#013169}input{display:flex;align-items:center;flex:1 0 0;border:none;outline:none;background-color:transparent;font-family:Rubik,sans-serif;font-size:.875rem;font-weight:400;line-height:20px;letter-spacing:.28px}.button-delete{display:flex;align-items:center;justify-content:center;background:none;border:none;cursor:pointer;padding:0;color:#595959}.button-delete:hover{color:#013169}.container-label-sup{display:flex;align-items:center;gap:4px;margin-bottom:8px;color:#333;font-family:Roboto,sans-serif;font-size:.875rem;font-weight:500;line-height:20px;letter-spacing:.28px}.container-label-sup.disabled{color:#bfbfbf}.icon-dot{display:flex;align-items:center;width:4px;height:4px;aspect-ratio:1/1;background-color:#db2e2a;border-radius:100px}.icon-color-help{color:#8c8c8c}.label-inf{display:flex;position:absolute;margin-top:4px;color:#595959;font-family:Roboto,sans-serif;font-size:.75rem;font-style:italic;font-weight:500;line-height:16px;letter-spacing:.24px}.label-inf.alert{color:#931224}\n"], dependencies: [{ kind: "component", type: IconMdComponent, selector: "ius-icon-md", inputs: ["iconName", "color"] }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1$3.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$3.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$3.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1$1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }] }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "17.3.12", type: InputPasswordComponent, isStandalone: true, selector: "ius-input-password", inputs: { textInput: "textInput", required: "required", disabled: "disabled", showHelpText: "showHelpText", labelSuperior: "labelSuperior", labelInferior: "labelInferior", errorText: "errorText", labelInput: "labelInput", iconInput: "iconInput", error: "error" }, outputs: { onChangesValueEvent: "onChangesValueEvent", onEnterKey: "onEnterKey", onBlurEvent: "onBlurEvent" }, ngImport: i0, template: "<div class=\"container-general\">\r\n    @if (labelSuperior) {\r\n    <div class=\"container-label-sup\" [ngClass]=\"{\r\n        'disabled': disabled\r\n    }\">\r\n        @if(!disabled && required){\r\n        <div class=\"icon-dot\"></div>\r\n        }\r\n        <span class=\"\">{{labelSuperior}}</span>\r\n        @if(!disabled && showHelpText){\r\n        <ius-icon-md iconName=\"icon-help\" class=\"icon-color-help\"></ius-icon-md>\r\n        }\r\n        <span>:</span>\r\n    </div>\r\n    }\r\n    <div class=\"container-textfield\" [ngClass]=\"{\r\n        'disabled': disabled,\r\n        'focused': isFocused,\r\n        'alert': (!isFocused && isAlertText && !disabled) || (error && !disabled)\r\n    }\">\r\n        @if (iconInput) {\r\n        <ius-icon-md [iconName]=\"iconInput\" class=\"icon-color\"></ius-icon-md>\r\n        }\r\n        <input [type]=\"passwordVisible ? 'text' : 'password'\" [(ngModel)]=\"textInput\" [placeholder]=\"labelInput\" [disabled]=\"disabled\"\r\n            (input)=\"onInput()\" (focus)=\"onFocus()\" (blur)=\"onBlur()\" (keypress)=\"onKeyPress($event)\" (keydown)=\"onKeyDown($event)\" />\r\n        @if (!disabled && textInput) {\r\n        <button class=\"button-delete\" (click)=\"togglePasswordVisibility()\">\r\n          @if (passwordVisible) {\r\n            <ius-icon-md iconName=\"icon-visibility\" class=\"icon-color-cancel\"></ius-icon-md>\r\n          }@else{\r\n            <ius-icon-md iconName=\"icon-visibility\" class=\"icon-color-cancel\"></ius-icon-md>\r\n          }\r\n        </button>\r\n        }\r\n    </div>\r\n    @if ((errorText || labelInferior) && ((!isFocused && isAlertText && !disabled) || (error && !disabled))) {\r\n    <span class=\"label-inf alert\">{{ errorText ?? labelInferior }}</span>\r\n    } @else if (isCapsLockOn && isFocused && !disabled) {\r\n    <span class=\"label-inf warning\">Bloq May\u00FAs activado</span>\r\n    } @else if (labelInferior && isFocused) {\r\n    <span class=\"label-inf\">{{labelInferior}}</span>\r\n    }\r\n\r\n</div>", styles: [".h1{font-family:Roboto,sans-serif;font-size:2.375rem;font-weight:500;line-height:46px}.h2{font-family:Roboto,sans-serif;font-size:1.875rem;font-weight:700;line-height:38px}.h3{font-family:Roboto,sans-serif;font-size:1.5rem;font-weight:500;line-height:32px}.h4{font-family:Roboto,sans-serif;font-size:1.25rem;font-weight:700;line-height:26px}.h5{font-family:Roboto,sans-serif;font-size:1.125rem;font-weight:500;line-height:24px;letter-spacing:.18px}.label-large{font-family:Roboto,sans-serif;font-size:1rem;font-weight:500;line-height:22px}.body-large{font-family:Rubik,sans-serif;font-size:1rem;font-weight:400;line-height:22px}.label-base{font-family:Rubik,sans-serif;font-size:.875rem;font-weight:500;line-height:20px;letter-spacing:.28px}.body-base{font-family:Rubik,sans-serif;font-size:.875rem;font-weight:400;line-height:20px;font-style:italic;letter-spacing:.28px}.body-base-1,.body-base-1-1{font-family:Rubik,sans-serif;font-size:.875rem;font-weight:400;line-height:20px;letter-spacing:.28px}.body-sm{font-family:Rubik,sans-serif;font-size:.75rem;font-weight:400;line-height:16px;letter-spacing:.28px}.body-sm-italic{font-family:Rubik,sans-serif;font-size:.75rem;font-weight:400;line-height:16px;font-style:italic;letter-spacing:.28px}.caption-sm{font-family:Rubik,sans-serif;font-size:.75rem;font-weight:500;line-height:16px;letter-spacing:.28px}.caption-sm-italic{font-family:Rubik,sans-serif;font-size:.75rem;font-weight:500;line-height:16px;font-style:italic;letter-spacing:.28px}.container-general{position:relative;height:100%}.container-textfield{display:flex;padding:10px 12px;justify-content:center;align-items:flex-start;gap:4px;border:1px solid #f5f5f5;border-radius:8px;background:#f5f5f5;font-family:Rubik,sans-serif;font-size:.875rem;font-weight:400;line-height:20px;letter-spacing:.28px;transition:all .2s ease-in-out}.container-textfield:hover:not(.disabled):not(.focused):not(.alert){background:#edf6ff}.container-textfield.focused{border:1px solid #0581BC;background:#edf6ff}.container-textfield.disabled{background:#f5f5f5}.container-textfield.disabled .icon-color{color:#bfbfbf}.container-textfield.disabled input::placeholder{color:#bfbfbf;opacity:1}.container-textfield.alert{border:1px solid #DB2E2A;background:#fff4f0}.icon-color{color:#595959}.icon-color-cancel{color:#013169}input{display:flex;align-items:center;flex:1 0 0;border:none;outline:none;background-color:transparent;font-family:Rubik,sans-serif;font-size:.875rem;font-weight:400;line-height:20px;letter-spacing:.28px}.button-delete{display:flex;align-items:center;justify-content:center;background:none;border:none;cursor:pointer;padding:0;color:#595959}.button-delete:hover{color:#013169}.container-label-sup{display:flex;align-items:center;gap:4px;margin-bottom:8px;color:#333;font-family:Rubik,sans-serif;font-size:.875rem;font-weight:500;line-height:20px;letter-spacing:.28px}.container-label-sup.disabled{color:#bfbfbf}.icon-dot{display:flex;align-items:center;width:4px;height:4px;aspect-ratio:1/1;background-color:#db2e2a;border-radius:100px}.icon-color-help{color:#8c8c8c}.label-inf{display:flex;position:absolute;margin-top:4px;color:#595959;font-family:Roboto,sans-serif;font-size:.75rem;font-style:italic;font-weight:500;line-height:16px;letter-spacing:.24px}.label-inf.alert{color:#931224}\n"], dependencies: [{ kind: "component", type: IconMdComponent, selector: "ius-icon-md", inputs: ["iconName", "color"] }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1$3.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$3.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$3.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1$1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }] }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: InputPasswordComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'ius-input-password', standalone: true, imports: [IconMdComponent, FormsModule, CommonModule], template: "<div class=\"container-general\">\r\n    @if (labelSuperior) {\r\n    <div class=\"container-label-sup\" [ngClass]=\"{\r\n        'disabled': disabled\r\n    }\">\r\n        @if(!disabled && required){\r\n        <div class=\"icon-dot\"></div>\r\n        }\r\n        <span class=\"\">{{labelSuperior}}</span>\r\n        @if(!disabled && showHelpText){\r\n        <ius-icon-md iconName=\"icon-help\" class=\"icon-color-help\"></ius-icon-md>\r\n        }\r\n        <span>:</span>\r\n    </div>\r\n    }\r\n    <div class=\"container-textfield\" [ngClass]=\"{\r\n        'disabled': disabled,\r\n        'focused': isFocused,\r\n        'alert': (!isFocused && isAlertText && !disabled) || (error && !disabled)\r\n    }\">\r\n        @if (iconInput) {\r\n        <ius-icon-md [iconName]=\"iconInput\" class=\"icon-color\"></ius-icon-md>\r\n        }\r\n        <input [type]=\"passwordVisible ? 'text' : 'password'\" [(ngModel)]=\"textInput\" [placeholder]=\"labelInput\" [disabled]=\"disabled\"\r\n            (input)=\"onInput()\" (focus)=\"onFocus()\" (blur)=\"onBlur()\" (keypress)=\"onKeyPress($event)\" (keydown)=\"onKeyDown($event)\" />\r\n        @if (!disabled && textInput) {\r\n        <button class=\"button-delete\" (click)=\"togglePasswordVisibility()\">\r\n          @if (passwordVisible) {\r\n            <ius-icon-md iconName=\"icon-visibility\" class=\"icon-color-cancel\"></ius-icon-md>\r\n          }@else{\r\n            <ius-icon-md iconName=\"icon-visibility\" class=\"icon-color-cancel\"></ius-icon-md>\r\n          }\r\n        </button>\r\n        }\r\n    </div>\r\n    @if ((errorText || labelInferior) && ((!isFocused && isAlertText && !disabled) || (error && !disabled))) {\r\n    <span class=\"label-inf alert\">{{ errorText ?? labelInferior }}</span>\r\n    } @else if (isCapsLockOn && isFocused && !disabled) {\r\n    <span class=\"label-inf warning\">Bloq May\u00FAs activado</span>\r\n    } @else if (labelInferior && isFocused) {\r\n    <span class=\"label-inf\">{{labelInferior}}</span>\r\n    }\r\n\r\n</div>", styles: [".h1{font-family:Roboto,sans-serif;font-size:2.375rem;font-weight:500;line-height:46px}.h2{font-family:Roboto,sans-serif;font-size:1.875rem;font-weight:700;line-height:38px}.h3{font-family:Roboto,sans-serif;font-size:1.5rem;font-weight:500;line-height:32px}.h4{font-family:Roboto,sans-serif;font-size:1.25rem;font-weight:700;line-height:26px}.h5{font-family:Roboto,sans-serif;font-size:1.125rem;font-weight:500;line-height:24px;letter-spacing:.18px}.label-large{font-family:Roboto,sans-serif;font-size:1rem;font-weight:500;line-height:22px}.body-large{font-family:Rubik,sans-serif;font-size:1rem;font-weight:400;line-height:22px}.label-base{font-family:Rubik,sans-serif;font-size:.875rem;font-weight:500;line-height:20px;letter-spacing:.28px}.body-base{font-family:Rubik,sans-serif;font-size:.875rem;font-weight:400;line-height:20px;font-style:italic;letter-spacing:.28px}.body-base-1,.body-base-1-1{font-family:Rubik,sans-serif;font-size:.875rem;font-weight:400;line-height:20px;letter-spacing:.28px}.body-sm{font-family:Rubik,sans-serif;font-size:.75rem;font-weight:400;line-height:16px;letter-spacing:.28px}.body-sm-italic{font-family:Rubik,sans-serif;font-size:.75rem;font-weight:400;line-height:16px;font-style:italic;letter-spacing:.28px}.caption-sm{font-family:Rubik,sans-serif;font-size:.75rem;font-weight:500;line-height:16px;letter-spacing:.28px}.caption-sm-italic{font-family:Rubik,sans-serif;font-size:.75rem;font-weight:500;line-height:16px;font-style:italic;letter-spacing:.28px}.container-general{position:relative;height:100%}.container-textfield{display:flex;padding:10px 12px;justify-content:center;align-items:flex-start;gap:4px;border:1px solid #f5f5f5;border-radius:8px;background:#f5f5f5;font-family:Rubik,sans-serif;font-size:.875rem;font-weight:400;line-height:20px;letter-spacing:.28px;transition:all .2s ease-in-out}.container-textfield:hover:not(.disabled):not(.focused):not(.alert){background:#edf6ff}.container-textfield.focused{border:1px solid #0581BC;background:#edf6ff}.container-textfield.disabled{background:#f5f5f5}.container-textfield.disabled .icon-color{color:#bfbfbf}.container-textfield.disabled input::placeholder{color:#bfbfbf;opacity:1}.container-textfield.alert{border:1px solid #DB2E2A;background:#fff4f0}.icon-color{color:#595959}.icon-color-cancel{color:#013169}input{display:flex;align-items:center;flex:1 0 0;border:none;outline:none;background-color:transparent;font-family:Rubik,sans-serif;font-size:.875rem;font-weight:400;line-height:20px;letter-spacing:.28px}.button-delete{display:flex;align-items:center;justify-content:center;background:none;border:none;cursor:pointer;padding:0;color:#595959}.button-delete:hover{color:#013169}.container-label-sup{display:flex;align-items:center;gap:4px;margin-bottom:8px;color:#333;font-family:Roboto,sans-serif;font-size:.875rem;font-weight:500;line-height:20px;letter-spacing:.28px}.container-label-sup.disabled{color:#bfbfbf}.icon-dot{display:flex;align-items:center;width:4px;height:4px;aspect-ratio:1/1;background-color:#db2e2a;border-radius:100px}.icon-color-help{color:#8c8c8c}.label-inf{display:flex;position:absolute;margin-top:4px;color:#595959;font-family:Roboto,sans-serif;font-size:.75rem;font-style:italic;font-weight:500;line-height:16px;letter-spacing:.24px}.label-inf.alert{color:#931224}\n"] }]
+            args: [{ selector: 'ius-input-password', standalone: true, imports: [IconMdComponent, FormsModule, CommonModule], template: "<div class=\"container-general\">\r\n    @if (labelSuperior) {\r\n    <div class=\"container-label-sup\" [ngClass]=\"{\r\n        'disabled': disabled\r\n    }\">\r\n        @if(!disabled && required){\r\n        <div class=\"icon-dot\"></div>\r\n        }\r\n        <span class=\"\">{{labelSuperior}}</span>\r\n        @if(!disabled && showHelpText){\r\n        <ius-icon-md iconName=\"icon-help\" class=\"icon-color-help\"></ius-icon-md>\r\n        }\r\n        <span>:</span>\r\n    </div>\r\n    }\r\n    <div class=\"container-textfield\" [ngClass]=\"{\r\n        'disabled': disabled,\r\n        'focused': isFocused,\r\n        'alert': (!isFocused && isAlertText && !disabled) || (error && !disabled)\r\n    }\">\r\n        @if (iconInput) {\r\n        <ius-icon-md [iconName]=\"iconInput\" class=\"icon-color\"></ius-icon-md>\r\n        }\r\n        <input [type]=\"passwordVisible ? 'text' : 'password'\" [(ngModel)]=\"textInput\" [placeholder]=\"labelInput\" [disabled]=\"disabled\"\r\n            (input)=\"onInput()\" (focus)=\"onFocus()\" (blur)=\"onBlur()\" (keypress)=\"onKeyPress($event)\" (keydown)=\"onKeyDown($event)\" />\r\n        @if (!disabled && textInput) {\r\n        <button class=\"button-delete\" (click)=\"togglePasswordVisibility()\">\r\n          @if (passwordVisible) {\r\n            <ius-icon-md iconName=\"icon-visibility\" class=\"icon-color-cancel\"></ius-icon-md>\r\n          }@else{\r\n            <ius-icon-md iconName=\"icon-visibility\" class=\"icon-color-cancel\"></ius-icon-md>\r\n          }\r\n        </button>\r\n        }\r\n    </div>\r\n    @if ((errorText || labelInferior) && ((!isFocused && isAlertText && !disabled) || (error && !disabled))) {\r\n    <span class=\"label-inf alert\">{{ errorText ?? labelInferior }}</span>\r\n    } @else if (isCapsLockOn && isFocused && !disabled) {\r\n    <span class=\"label-inf warning\">Bloq May\u00FAs activado</span>\r\n    } @else if (labelInferior && isFocused) {\r\n    <span class=\"label-inf\">{{labelInferior}}</span>\r\n    }\r\n\r\n</div>", styles: [".h1{font-family:Roboto,sans-serif;font-size:2.375rem;font-weight:500;line-height:46px}.h2{font-family:Roboto,sans-serif;font-size:1.875rem;font-weight:700;line-height:38px}.h3{font-family:Roboto,sans-serif;font-size:1.5rem;font-weight:500;line-height:32px}.h4{font-family:Roboto,sans-serif;font-size:1.25rem;font-weight:700;line-height:26px}.h5{font-family:Roboto,sans-serif;font-size:1.125rem;font-weight:500;line-height:24px;letter-spacing:.18px}.label-large{font-family:Roboto,sans-serif;font-size:1rem;font-weight:500;line-height:22px}.body-large{font-family:Rubik,sans-serif;font-size:1rem;font-weight:400;line-height:22px}.label-base{font-family:Rubik,sans-serif;font-size:.875rem;font-weight:500;line-height:20px;letter-spacing:.28px}.body-base{font-family:Rubik,sans-serif;font-size:.875rem;font-weight:400;line-height:20px;font-style:italic;letter-spacing:.28px}.body-base-1,.body-base-1-1{font-family:Rubik,sans-serif;font-size:.875rem;font-weight:400;line-height:20px;letter-spacing:.28px}.body-sm{font-family:Rubik,sans-serif;font-size:.75rem;font-weight:400;line-height:16px;letter-spacing:.28px}.body-sm-italic{font-family:Rubik,sans-serif;font-size:.75rem;font-weight:400;line-height:16px;font-style:italic;letter-spacing:.28px}.caption-sm{font-family:Rubik,sans-serif;font-size:.75rem;font-weight:500;line-height:16px;letter-spacing:.28px}.caption-sm-italic{font-family:Rubik,sans-serif;font-size:.75rem;font-weight:500;line-height:16px;font-style:italic;letter-spacing:.28px}.container-general{position:relative;height:100%}.container-textfield{display:flex;padding:10px 12px;justify-content:center;align-items:flex-start;gap:4px;border:1px solid #f5f5f5;border-radius:8px;background:#f5f5f5;font-family:Rubik,sans-serif;font-size:.875rem;font-weight:400;line-height:20px;letter-spacing:.28px;transition:all .2s ease-in-out}.container-textfield:hover:not(.disabled):not(.focused):not(.alert){background:#edf6ff}.container-textfield.focused{border:1px solid #0581BC;background:#edf6ff}.container-textfield.disabled{background:#f5f5f5}.container-textfield.disabled .icon-color{color:#bfbfbf}.container-textfield.disabled input::placeholder{color:#bfbfbf;opacity:1}.container-textfield.alert{border:1px solid #DB2E2A;background:#fff4f0}.icon-color{color:#595959}.icon-color-cancel{color:#013169}input{display:flex;align-items:center;flex:1 0 0;border:none;outline:none;background-color:transparent;font-family:Rubik,sans-serif;font-size:.875rem;font-weight:400;line-height:20px;letter-spacing:.28px}.button-delete{display:flex;align-items:center;justify-content:center;background:none;border:none;cursor:pointer;padding:0;color:#595959}.button-delete:hover{color:#013169}.container-label-sup{display:flex;align-items:center;gap:4px;margin-bottom:8px;color:#333;font-family:Rubik,sans-serif;font-size:.875rem;font-weight:500;line-height:20px;letter-spacing:.28px}.container-label-sup.disabled{color:#bfbfbf}.icon-dot{display:flex;align-items:center;width:4px;height:4px;aspect-ratio:1/1;background-color:#db2e2a;border-radius:100px}.icon-color-help{color:#8c8c8c}.label-inf{display:flex;position:absolute;margin-top:4px;color:#595959;font-family:Roboto,sans-serif;font-size:.75rem;font-style:italic;font-weight:500;line-height:16px;letter-spacing:.24px}.label-inf.alert{color:#931224}\n"] }]
         }], propDecorators: { textInput: [{
                 type: Input
             }], required: [{
@@ -4997,11 +5001,11 @@ class InputOtpComponent {
         }
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: InputOtpComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "17.3.12", type: InputOtpComponent, isStandalone: true, selector: "ius-input-otp", inputs: { length: "length", disabled: "disabled", showHelpText: "showHelpText", labelSuperior: "labelSuperior", labelInferior: "labelInferior", required: "required" }, outputs: { onChangesValueEvent: "onChangesValueEvent", codeComplete: "codeComplete" }, viewQueries: [{ propertyName: "otpInputs", predicate: ["otpInput"], descendants: true }], ngImport: i0, template: "<div class=\"container-general\">\r\n  @if (labelSuperior) {\r\n    <div class=\"container-label-sup\" [ngClass]=\"{ 'disabled': disabled }\">\r\n      @if(!disabled && required){ <div class=\"icon-dot\"></div> }\r\n      <span>{{ labelSuperior }}</span>\r\n      @if(!disabled && showHelpText){\r\n        <ius-icon-md iconName=\"icon-help\" class=\"icon-color-help\"></ius-icon-md>\r\n      }\r\n      <span>:</span>\r\n    </div>\r\n  }\r\n\r\n  <div class=\"container-otp\">\r\n    <!-- Casillas OTP -->\r\n    <div class=\"otp-grid\">\r\n      @for (ctrl of boxes; track $index) {\r\n        <div\r\n          class=\"container-textfield\"\r\n          [ngClass]=\"{\r\n            'disabled': disabled,\r\n            'focused': focusedIndex === $index,\r\n            'alert': !disabled && isAlertText\r\n          }\"\r\n        >\r\n          <input\r\n            #otpInput\r\n            type=\"text\"\r\n            inputmode=\"numeric\"\r\n            pattern=\"[0-9]*\"\r\n            maxlength=\"1\"\r\n            [disabled]=\"disabled\"\r\n            [value]=\"values[$index]\"\r\n            (focus)=\"onFocus($index)\"\r\n            (blur)=\"onBlur()\"\r\n            (keydown)=\"onKeyDown($event, $index)\"\r\n            (input)=\"onInputBox($event, $index)\"\r\n            (paste)=\"onPaste($event)\"\r\n          />\r\n        </div>\r\n      }\r\n    </div>\r\n\r\n    @if (!disabled && this.code.length > 0 ) {\r\n      <button class=\"button-delete\" (click)=\"clearSearch()\" [ngClass]=\"{\r\n            'alert': !disabled && isAlertText\r\n          }\">\r\n        <ius-icon-md iconName=\"icon-cancel\" class=\"icon-color-cancel\" [ngClass]=\"{\r\n            'alert': !disabled && isAlertText\r\n          }\"></ius-icon-md>\r\n      </button>\r\n    }\r\n  </div>\r\n\r\n  @if (labelInferior && isAnyFocused) {\r\n    <span class=\"label-inf\">{{ labelInferior }}</span>\r\n  }\r\n  @if (labelInferior && !isAnyFocused && isAlertText) {\r\n    <span class=\"label-inf\" [ngClass]=\"{ 'alert': isAlertText }\">{{ labelInferior }}</span>\r\n  }\r\n</div>\r\n", styles: [".h1{font-family:Roboto,sans-serif;font-size:2.375rem;font-weight:500;line-height:46px}.h2{font-family:Roboto,sans-serif;font-size:1.875rem;font-weight:700;line-height:38px}.h3{font-family:Roboto,sans-serif;font-size:1.5rem;font-weight:500;line-height:32px}.h4{font-family:Roboto,sans-serif;font-size:1.25rem;font-weight:700;line-height:26px}.h5{font-family:Roboto,sans-serif;font-size:1.125rem;font-weight:500;line-height:24px;letter-spacing:.18px}.label-large{font-family:Roboto,sans-serif;font-size:1rem;font-weight:500;line-height:22px}.body-large{font-family:Rubik,sans-serif;font-size:1rem;font-weight:400;line-height:22px}.label-base{font-family:Rubik,sans-serif;font-size:.875rem;font-weight:500;line-height:20px;letter-spacing:.28px}.body-base{font-family:Rubik,sans-serif;font-size:.875rem;font-weight:400;line-height:20px;font-style:italic;letter-spacing:.28px}.body-base-1,.body-base-1-1{font-family:Rubik,sans-serif;font-size:.875rem;font-weight:400;line-height:20px;letter-spacing:.28px}.body-sm{font-family:Rubik,sans-serif;font-size:.75rem;font-weight:400;line-height:16px;letter-spacing:.28px}.body-sm-italic{font-family:Rubik,sans-serif;font-size:.75rem;font-weight:400;line-height:16px;font-style:italic;letter-spacing:.28px}.caption-sm{font-family:Rubik,sans-serif;font-size:.75rem;font-weight:500;line-height:16px;letter-spacing:.28px}.caption-sm-italic{font-family:Rubik,sans-serif;font-size:.75rem;font-weight:500;line-height:16px;font-style:italic;letter-spacing:.28px}.container-general{position:relative;height:100%}.container-otp{display:flex;align-items:center;gap:8px}.otp-grid{display:flex;gap:4px}.otp-grid:hover .container-textfield:not(.disabled){background:#edf6ff;border:1px solid #EDF6FF}.container-textfield{display:inline-flex;width:40px;height:40px;border:1px solid #f5f5f5;border-radius:8px;background:#f5f5f5;transition:all .15s ease-in-out}.container-textfield:hover:not(.disabled):not(.focused):not(.alert){background:#edf6ff;border:1px solid #EDF6FF}.container-textfield.focused{border:1px solid #0581BC;background:#edf6ff}.container-textfield.alert{border:1px solid #DB2E2A;background:#fff4f0}.container-textfield.disabled{background:#f5f5f5}.container-textfield input{width:100%;height:100%;border:none;outline:none;text-align:center;background:transparent;color:#8c8c8c;font-family:Rubik,sans-serif;font-size:.875rem;line-height:20px;letter-spacing:.28px}.container-textfield input::-webkit-outer-spin-button,.container-textfield input::-webkit-inner-spin-button{-webkit-appearance:none;margin:0}.button-delete{display:flex;align-items:center;justify-content:center;background:none;border:none;cursor:pointer;padding:0;color:#595959}.container-label-sup{display:flex;align-items:center;gap:4px;margin-bottom:8px;color:#333;font-family:Roboto,sans-serif;font-size:.875rem;font-weight:500;line-height:20px;letter-spacing:.28px}.container-label-sup.disabled{color:#bfbfbf}.icon-dot{width:4px;height:4px;background-color:#db2e2a;border-radius:100px}.icon-color-help{color:#8c8c8c}.icon-color-cancel{color:#013169}.icon-color-cancel.alert{color:#b71d26}.label-inf{position:absolute;margin-top:4px;color:#595959;font-family:Roboto,sans-serif;font-size:.75rem;font-style:italic;font-weight:500;line-height:16px;letter-spacing:.24px}.label-inf.alert{color:#931224}\n"], dependencies: [{ kind: "component", type: IconMdComponent, selector: "ius-icon-md", inputs: ["iconName", "color"] }, { kind: "ngmodule", type: FormsModule }, { kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1$1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }] }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "17.3.12", type: InputOtpComponent, isStandalone: true, selector: "ius-input-otp", inputs: { length: "length", disabled: "disabled", showHelpText: "showHelpText", labelSuperior: "labelSuperior", labelInferior: "labelInferior", required: "required" }, outputs: { onChangesValueEvent: "onChangesValueEvent", codeComplete: "codeComplete" }, viewQueries: [{ propertyName: "otpInputs", predicate: ["otpInput"], descendants: true }], ngImport: i0, template: "<div class=\"container-general\">\r\n  @if (labelSuperior) {\r\n    <div class=\"container-label-sup\" [ngClass]=\"{ 'disabled': disabled }\">\r\n      @if(!disabled && required){ <div class=\"icon-dot\"></div> }\r\n      <span>{{ labelSuperior }}</span>\r\n      @if(!disabled && showHelpText){\r\n        <ius-icon-md iconName=\"icon-help\" class=\"icon-color-help\"></ius-icon-md>\r\n      }\r\n      <span>:</span>\r\n    </div>\r\n  }\r\n\r\n  <div class=\"container-otp\">\r\n    <!-- Casillas OTP -->\r\n    <div class=\"otp-grid\">\r\n      @for (ctrl of boxes; track $index) {\r\n        <div\r\n          class=\"container-textfield\"\r\n          [ngClass]=\"{\r\n            'disabled': disabled,\r\n            'focused': focusedIndex === $index,\r\n            'alert': !disabled && isAlertText\r\n          }\"\r\n        >\r\n          <input\r\n            #otpInput\r\n            type=\"text\"\r\n            inputmode=\"numeric\"\r\n            pattern=\"[0-9]*\"\r\n            maxlength=\"1\"\r\n            [disabled]=\"disabled\"\r\n            [value]=\"values[$index]\"\r\n            (focus)=\"onFocus($index)\"\r\n            (blur)=\"onBlur()\"\r\n            (keydown)=\"onKeyDown($event, $index)\"\r\n            (input)=\"onInputBox($event, $index)\"\r\n            (paste)=\"onPaste($event)\"\r\n          />\r\n        </div>\r\n      }\r\n    </div>\r\n\r\n    @if (!disabled && this.code.length > 0 ) {\r\n      <button class=\"button-delete\" (click)=\"clearSearch()\" [ngClass]=\"{\r\n            'alert': !disabled && isAlertText\r\n          }\">\r\n        <ius-icon-md iconName=\"icon-cancel\" class=\"icon-color-cancel\" [ngClass]=\"{\r\n            'alert': !disabled && isAlertText\r\n          }\"></ius-icon-md>\r\n      </button>\r\n    }\r\n  </div>\r\n\r\n  @if (labelInferior && isAnyFocused) {\r\n    <span class=\"label-inf\">{{ labelInferior }}</span>\r\n  }\r\n  @if (labelInferior && !isAnyFocused && isAlertText) {\r\n    <span class=\"label-inf\" [ngClass]=\"{ 'alert': isAlertText }\">{{ labelInferior }}</span>\r\n  }\r\n</div>\r\n", styles: [".h1{font-family:Roboto,sans-serif;font-size:2.375rem;font-weight:500;line-height:46px}.h2{font-family:Roboto,sans-serif;font-size:1.875rem;font-weight:700;line-height:38px}.h3{font-family:Roboto,sans-serif;font-size:1.5rem;font-weight:500;line-height:32px}.h4{font-family:Roboto,sans-serif;font-size:1.25rem;font-weight:700;line-height:26px}.h5{font-family:Roboto,sans-serif;font-size:1.125rem;font-weight:500;line-height:24px;letter-spacing:.18px}.label-large{font-family:Roboto,sans-serif;font-size:1rem;font-weight:500;line-height:22px}.body-large{font-family:Rubik,sans-serif;font-size:1rem;font-weight:400;line-height:22px}.label-base{font-family:Rubik,sans-serif;font-size:.875rem;font-weight:500;line-height:20px;letter-spacing:.28px}.body-base{font-family:Rubik,sans-serif;font-size:.875rem;font-weight:400;line-height:20px;font-style:italic;letter-spacing:.28px}.body-base-1,.body-base-1-1{font-family:Rubik,sans-serif;font-size:.875rem;font-weight:400;line-height:20px;letter-spacing:.28px}.body-sm{font-family:Rubik,sans-serif;font-size:.75rem;font-weight:400;line-height:16px;letter-spacing:.28px}.body-sm-italic{font-family:Rubik,sans-serif;font-size:.75rem;font-weight:400;line-height:16px;font-style:italic;letter-spacing:.28px}.caption-sm{font-family:Rubik,sans-serif;font-size:.75rem;font-weight:500;line-height:16px;letter-spacing:.28px}.caption-sm-italic{font-family:Rubik,sans-serif;font-size:.75rem;font-weight:500;line-height:16px;font-style:italic;letter-spacing:.28px}.container-general{position:relative;height:100%}.container-otp{display:flex;align-items:center;gap:8px}.otp-grid{display:flex;gap:4px}.otp-grid:hover .container-textfield:not(.disabled){background:#edf6ff;border:1px solid #EDF6FF}.container-textfield{display:inline-flex;width:40px;height:40px;border:1px solid #f5f5f5;border-radius:8px;background:#f5f5f5;transition:all .15s ease-in-out}.container-textfield:hover:not(.disabled):not(.focused):not(.alert){background:#edf6ff;border:1px solid #EDF6FF}.container-textfield.focused{border:1px solid #0581BC;background:#edf6ff}.container-textfield.alert{border:1px solid #DB2E2A;background:#fff4f0}.container-textfield.disabled{background:#f5f5f5}.container-textfield input{width:100%;height:100%;border:none;outline:none;text-align:center;background:transparent;color:#8c8c8c;font-family:Rubik,sans-serif;font-size:.875rem;line-height:20px;letter-spacing:.28px}.container-textfield input::-webkit-outer-spin-button,.container-textfield input::-webkit-inner-spin-button{-webkit-appearance:none;margin:0}.button-delete{display:flex;align-items:center;justify-content:center;background:none;border:none;cursor:pointer;padding:0;color:#595959}.container-label-sup{display:flex;align-items:center;gap:4px;margin-bottom:8px;color:#333;font-family:Rubik,sans-serif;font-size:.875rem;font-weight:500;line-height:20px;letter-spacing:.28px}.container-label-sup.disabled{color:#bfbfbf}.icon-dot{width:4px;height:4px;background-color:#db2e2a;border-radius:100px}.icon-color-help{color:#8c8c8c}.icon-color-cancel{color:#013169}.icon-color-cancel.alert{color:#b71d26}.label-inf{position:absolute;margin-top:4px;color:#595959;font-family:Roboto,sans-serif;font-size:.75rem;font-style:italic;font-weight:500;line-height:16px;letter-spacing:.24px}.label-inf.alert{color:#931224}\n"], dependencies: [{ kind: "component", type: IconMdComponent, selector: "ius-icon-md", inputs: ["iconName", "color"] }, { kind: "ngmodule", type: FormsModule }, { kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1$1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }] }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: InputOtpComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'ius-input-otp', standalone: true, imports: [IconMdComponent, FormsModule, CommonModule], template: "<div class=\"container-general\">\r\n  @if (labelSuperior) {\r\n    <div class=\"container-label-sup\" [ngClass]=\"{ 'disabled': disabled }\">\r\n      @if(!disabled && required){ <div class=\"icon-dot\"></div> }\r\n      <span>{{ labelSuperior }}</span>\r\n      @if(!disabled && showHelpText){\r\n        <ius-icon-md iconName=\"icon-help\" class=\"icon-color-help\"></ius-icon-md>\r\n      }\r\n      <span>:</span>\r\n    </div>\r\n  }\r\n\r\n  <div class=\"container-otp\">\r\n    <!-- Casillas OTP -->\r\n    <div class=\"otp-grid\">\r\n      @for (ctrl of boxes; track $index) {\r\n        <div\r\n          class=\"container-textfield\"\r\n          [ngClass]=\"{\r\n            'disabled': disabled,\r\n            'focused': focusedIndex === $index,\r\n            'alert': !disabled && isAlertText\r\n          }\"\r\n        >\r\n          <input\r\n            #otpInput\r\n            type=\"text\"\r\n            inputmode=\"numeric\"\r\n            pattern=\"[0-9]*\"\r\n            maxlength=\"1\"\r\n            [disabled]=\"disabled\"\r\n            [value]=\"values[$index]\"\r\n            (focus)=\"onFocus($index)\"\r\n            (blur)=\"onBlur()\"\r\n            (keydown)=\"onKeyDown($event, $index)\"\r\n            (input)=\"onInputBox($event, $index)\"\r\n            (paste)=\"onPaste($event)\"\r\n          />\r\n        </div>\r\n      }\r\n    </div>\r\n\r\n    @if (!disabled && this.code.length > 0 ) {\r\n      <button class=\"button-delete\" (click)=\"clearSearch()\" [ngClass]=\"{\r\n            'alert': !disabled && isAlertText\r\n          }\">\r\n        <ius-icon-md iconName=\"icon-cancel\" class=\"icon-color-cancel\" [ngClass]=\"{\r\n            'alert': !disabled && isAlertText\r\n          }\"></ius-icon-md>\r\n      </button>\r\n    }\r\n  </div>\r\n\r\n  @if (labelInferior && isAnyFocused) {\r\n    <span class=\"label-inf\">{{ labelInferior }}</span>\r\n  }\r\n  @if (labelInferior && !isAnyFocused && isAlertText) {\r\n    <span class=\"label-inf\" [ngClass]=\"{ 'alert': isAlertText }\">{{ labelInferior }}</span>\r\n  }\r\n</div>\r\n", styles: [".h1{font-family:Roboto,sans-serif;font-size:2.375rem;font-weight:500;line-height:46px}.h2{font-family:Roboto,sans-serif;font-size:1.875rem;font-weight:700;line-height:38px}.h3{font-family:Roboto,sans-serif;font-size:1.5rem;font-weight:500;line-height:32px}.h4{font-family:Roboto,sans-serif;font-size:1.25rem;font-weight:700;line-height:26px}.h5{font-family:Roboto,sans-serif;font-size:1.125rem;font-weight:500;line-height:24px;letter-spacing:.18px}.label-large{font-family:Roboto,sans-serif;font-size:1rem;font-weight:500;line-height:22px}.body-large{font-family:Rubik,sans-serif;font-size:1rem;font-weight:400;line-height:22px}.label-base{font-family:Rubik,sans-serif;font-size:.875rem;font-weight:500;line-height:20px;letter-spacing:.28px}.body-base{font-family:Rubik,sans-serif;font-size:.875rem;font-weight:400;line-height:20px;font-style:italic;letter-spacing:.28px}.body-base-1,.body-base-1-1{font-family:Rubik,sans-serif;font-size:.875rem;font-weight:400;line-height:20px;letter-spacing:.28px}.body-sm{font-family:Rubik,sans-serif;font-size:.75rem;font-weight:400;line-height:16px;letter-spacing:.28px}.body-sm-italic{font-family:Rubik,sans-serif;font-size:.75rem;font-weight:400;line-height:16px;font-style:italic;letter-spacing:.28px}.caption-sm{font-family:Rubik,sans-serif;font-size:.75rem;font-weight:500;line-height:16px;letter-spacing:.28px}.caption-sm-italic{font-family:Rubik,sans-serif;font-size:.75rem;font-weight:500;line-height:16px;font-style:italic;letter-spacing:.28px}.container-general{position:relative;height:100%}.container-otp{display:flex;align-items:center;gap:8px}.otp-grid{display:flex;gap:4px}.otp-grid:hover .container-textfield:not(.disabled){background:#edf6ff;border:1px solid #EDF6FF}.container-textfield{display:inline-flex;width:40px;height:40px;border:1px solid #f5f5f5;border-radius:8px;background:#f5f5f5;transition:all .15s ease-in-out}.container-textfield:hover:not(.disabled):not(.focused):not(.alert){background:#edf6ff;border:1px solid #EDF6FF}.container-textfield.focused{border:1px solid #0581BC;background:#edf6ff}.container-textfield.alert{border:1px solid #DB2E2A;background:#fff4f0}.container-textfield.disabled{background:#f5f5f5}.container-textfield input{width:100%;height:100%;border:none;outline:none;text-align:center;background:transparent;color:#8c8c8c;font-family:Rubik,sans-serif;font-size:.875rem;line-height:20px;letter-spacing:.28px}.container-textfield input::-webkit-outer-spin-button,.container-textfield input::-webkit-inner-spin-button{-webkit-appearance:none;margin:0}.button-delete{display:flex;align-items:center;justify-content:center;background:none;border:none;cursor:pointer;padding:0;color:#595959}.container-label-sup{display:flex;align-items:center;gap:4px;margin-bottom:8px;color:#333;font-family:Roboto,sans-serif;font-size:.875rem;font-weight:500;line-height:20px;letter-spacing:.28px}.container-label-sup.disabled{color:#bfbfbf}.icon-dot{width:4px;height:4px;background-color:#db2e2a;border-radius:100px}.icon-color-help{color:#8c8c8c}.icon-color-cancel{color:#013169}.icon-color-cancel.alert{color:#b71d26}.label-inf{position:absolute;margin-top:4px;color:#595959;font-family:Roboto,sans-serif;font-size:.75rem;font-style:italic;font-weight:500;line-height:16px;letter-spacing:.24px}.label-inf.alert{color:#931224}\n"] }]
+            args: [{ selector: 'ius-input-otp', standalone: true, imports: [IconMdComponent, FormsModule, CommonModule], template: "<div class=\"container-general\">\r\n  @if (labelSuperior) {\r\n    <div class=\"container-label-sup\" [ngClass]=\"{ 'disabled': disabled }\">\r\n      @if(!disabled && required){ <div class=\"icon-dot\"></div> }\r\n      <span>{{ labelSuperior }}</span>\r\n      @if(!disabled && showHelpText){\r\n        <ius-icon-md iconName=\"icon-help\" class=\"icon-color-help\"></ius-icon-md>\r\n      }\r\n      <span>:</span>\r\n    </div>\r\n  }\r\n\r\n  <div class=\"container-otp\">\r\n    <!-- Casillas OTP -->\r\n    <div class=\"otp-grid\">\r\n      @for (ctrl of boxes; track $index) {\r\n        <div\r\n          class=\"container-textfield\"\r\n          [ngClass]=\"{\r\n            'disabled': disabled,\r\n            'focused': focusedIndex === $index,\r\n            'alert': !disabled && isAlertText\r\n          }\"\r\n        >\r\n          <input\r\n            #otpInput\r\n            type=\"text\"\r\n            inputmode=\"numeric\"\r\n            pattern=\"[0-9]*\"\r\n            maxlength=\"1\"\r\n            [disabled]=\"disabled\"\r\n            [value]=\"values[$index]\"\r\n            (focus)=\"onFocus($index)\"\r\n            (blur)=\"onBlur()\"\r\n            (keydown)=\"onKeyDown($event, $index)\"\r\n            (input)=\"onInputBox($event, $index)\"\r\n            (paste)=\"onPaste($event)\"\r\n          />\r\n        </div>\r\n      }\r\n    </div>\r\n\r\n    @if (!disabled && this.code.length > 0 ) {\r\n      <button class=\"button-delete\" (click)=\"clearSearch()\" [ngClass]=\"{\r\n            'alert': !disabled && isAlertText\r\n          }\">\r\n        <ius-icon-md iconName=\"icon-cancel\" class=\"icon-color-cancel\" [ngClass]=\"{\r\n            'alert': !disabled && isAlertText\r\n          }\"></ius-icon-md>\r\n      </button>\r\n    }\r\n  </div>\r\n\r\n  @if (labelInferior && isAnyFocused) {\r\n    <span class=\"label-inf\">{{ labelInferior }}</span>\r\n  }\r\n  @if (labelInferior && !isAnyFocused && isAlertText) {\r\n    <span class=\"label-inf\" [ngClass]=\"{ 'alert': isAlertText }\">{{ labelInferior }}</span>\r\n  }\r\n</div>\r\n", styles: [".h1{font-family:Roboto,sans-serif;font-size:2.375rem;font-weight:500;line-height:46px}.h2{font-family:Roboto,sans-serif;font-size:1.875rem;font-weight:700;line-height:38px}.h3{font-family:Roboto,sans-serif;font-size:1.5rem;font-weight:500;line-height:32px}.h4{font-family:Roboto,sans-serif;font-size:1.25rem;font-weight:700;line-height:26px}.h5{font-family:Roboto,sans-serif;font-size:1.125rem;font-weight:500;line-height:24px;letter-spacing:.18px}.label-large{font-family:Roboto,sans-serif;font-size:1rem;font-weight:500;line-height:22px}.body-large{font-family:Rubik,sans-serif;font-size:1rem;font-weight:400;line-height:22px}.label-base{font-family:Rubik,sans-serif;font-size:.875rem;font-weight:500;line-height:20px;letter-spacing:.28px}.body-base{font-family:Rubik,sans-serif;font-size:.875rem;font-weight:400;line-height:20px;font-style:italic;letter-spacing:.28px}.body-base-1,.body-base-1-1{font-family:Rubik,sans-serif;font-size:.875rem;font-weight:400;line-height:20px;letter-spacing:.28px}.body-sm{font-family:Rubik,sans-serif;font-size:.75rem;font-weight:400;line-height:16px;letter-spacing:.28px}.body-sm-italic{font-family:Rubik,sans-serif;font-size:.75rem;font-weight:400;line-height:16px;font-style:italic;letter-spacing:.28px}.caption-sm{font-family:Rubik,sans-serif;font-size:.75rem;font-weight:500;line-height:16px;letter-spacing:.28px}.caption-sm-italic{font-family:Rubik,sans-serif;font-size:.75rem;font-weight:500;line-height:16px;font-style:italic;letter-spacing:.28px}.container-general{position:relative;height:100%}.container-otp{display:flex;align-items:center;gap:8px}.otp-grid{display:flex;gap:4px}.otp-grid:hover .container-textfield:not(.disabled){background:#edf6ff;border:1px solid #EDF6FF}.container-textfield{display:inline-flex;width:40px;height:40px;border:1px solid #f5f5f5;border-radius:8px;background:#f5f5f5;transition:all .15s ease-in-out}.container-textfield:hover:not(.disabled):not(.focused):not(.alert){background:#edf6ff;border:1px solid #EDF6FF}.container-textfield.focused{border:1px solid #0581BC;background:#edf6ff}.container-textfield.alert{border:1px solid #DB2E2A;background:#fff4f0}.container-textfield.disabled{background:#f5f5f5}.container-textfield input{width:100%;height:100%;border:none;outline:none;text-align:center;background:transparent;color:#8c8c8c;font-family:Rubik,sans-serif;font-size:.875rem;line-height:20px;letter-spacing:.28px}.container-textfield input::-webkit-outer-spin-button,.container-textfield input::-webkit-inner-spin-button{-webkit-appearance:none;margin:0}.button-delete{display:flex;align-items:center;justify-content:center;background:none;border:none;cursor:pointer;padding:0;color:#595959}.container-label-sup{display:flex;align-items:center;gap:4px;margin-bottom:8px;color:#333;font-family:Rubik,sans-serif;font-size:.875rem;font-weight:500;line-height:20px;letter-spacing:.28px}.container-label-sup.disabled{color:#bfbfbf}.icon-dot{width:4px;height:4px;background-color:#db2e2a;border-radius:100px}.icon-color-help{color:#8c8c8c}.icon-color-cancel{color:#013169}.icon-color-cancel.alert{color:#b71d26}.label-inf{position:absolute;margin-top:4px;color:#595959;font-family:Roboto,sans-serif;font-size:.75rem;font-style:italic;font-weight:500;line-height:16px;letter-spacing:.24px}.label-inf.alert{color:#931224}\n"] }]
         }], propDecorators: { length: [{
                 type: Input
             }], disabled: [{
@@ -6130,11 +6134,11 @@ class InputSelectFilterComponent {
         this._closePanel();
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: InputSelectFilterComponent, deps: [{ token: i0.ElementRef }, { token: i1$2.Overlay }, { token: i0.ViewContainerRef }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "17.3.12", type: InputSelectFilterComponent, isStandalone: true, selector: "ius-input-select-filter", inputs: { filterData: "filterData", componentId: "componentId", disabled: "disabled", showHelpText: "showHelpText", labelSuperior: "labelSuperior", labelInput: "labelInput", iconInput: "iconInput", textInput: "textInput", maxlenght: "maxlenght", inputType: "inputType" }, outputs: { onChangesValueEvent: "onChangesValueEvent", onEnterKey: "onEnterKey" }, host: { listeners: { "document:click": "onClickOutside($event)" } }, viewQueries: [{ propertyName: "listPanel", first: true, predicate: ["listPanel"], descendants: true }], ngImport: i0, template: "<div class=\"container-general\" [id]=\"componentId\">\r\n    @if (labelSuperior) {\r\n    <div class=\"container-label-sup\" [ngClass]=\"{\r\n        'disabled': disabled\r\n    }\">\r\n        <span class=\"\">{{labelSuperior}}</span>\r\n        @if(!disabled && showHelpText){\r\n        <ius-icon-md iconName=\"icon-help\" class=\"icon-color-help\"></ius-icon-md>\r\n        }\r\n        <span>:</span>\r\n    </div>\r\n    }\r\n    <div class=\"container-textfield\" [ngClass]=\"{\r\n        'disabled': disabled,\r\n        'focused': isFocused || showList\r\n    }\" (click)=\"onFocus()\">\r\n        @if (iconInput) {\r\n        <ius-icon-md [iconName]=\"iconInput\" class=\"icon-color\"></ius-icon-md>\r\n        }\r\n        <input [type]=\"inputType\" [(ngModel)]=\"textInput\" readonly [placeholder]=\"labelInput\" [disabled]=\"disabled\"\r\n            [maxlength]=\"maxlenght ?? null\" (focus)=\"onFocus()\" (blur)=\"onBlur()\"\r\n            (drop)=\"onDropBlock($event)\" (dragover)=\"onDragOverBlock($event)\">\r\n        <div class=\"cnt-icon-right\">\r\n            @if(!showList){\r\n            <ius-icon-md iconName=\"icon-keyboard-arrow-down\" class=\"icon-arrows\"></ius-icon-md>\r\n            }@else{\r\n            <div (click)=\"closeList($event)\" style=\"height: 20px;\">\r\n                <ius-icon-md iconName=\"icon-keyboard-arrow-up\" class=\"icon-arrows\"></ius-icon-md>\r\n            </div>\r\n            }\r\n        </div>\r\n    </div>\r\n    <ng-template #listPanel>\r\n    <div class=\"container-list\">\r\n        <div class=\"ctn-items scrollable-small\">\r\n            @for (data of filterData; track $index) {\r\n            <button class=\"item-list\" (click)=\"selectedData(data)\">\r\n                <span class=\"tx-item body-b color-pry\">{{data.title}}</span>\r\n                <ius-icon-sm iconName=\"icon-arrow-forward-ios\" class=\"color-pry\"></ius-icon-sm>\r\n            </button>\r\n            }\r\n        </div>\r\n        @if(filterDataSelected){\r\n        <div class=\"separator\"></div>\r\n        <div class=\"ctn-items scrollable-small\">\r\n            @for (item of filterDataSelected.values; track $index) {\r\n            <div class=\"item-check\" (click)=\"selectedItem(item)\">\r\n                <ius-checkbox [checked]=\"item.checked\" (click)=\"$event.stopPropagation(); selectedItem(item)\"></ius-checkbox>\r\n                <span class=\"tx-item body-b color-pry\">{{item.text}}</span>\r\n            </div>\r\n            }\r\n        </div>\r\n        }\r\n    </div>\r\n    </ng-template>\r\n</div>", styles: [".h1{font-family:Roboto,sans-serif;font-size:2.375rem;font-weight:500;line-height:46px}.h2{font-family:Roboto,sans-serif;font-size:1.875rem;font-weight:700;line-height:38px}.h3{font-family:Roboto,sans-serif;font-size:1.5rem;font-weight:500;line-height:32px}.h4{font-family:Roboto,sans-serif;font-size:1.25rem;font-weight:700;line-height:26px}.h5{font-family:Roboto,sans-serif;font-size:1.125rem;font-weight:500;line-height:24px;letter-spacing:.18px}.label-large{font-family:Roboto,sans-serif;font-size:1rem;font-weight:500;line-height:22px}.body-large{font-family:Rubik,sans-serif;font-size:1rem;font-weight:400;line-height:22px}.label-base{font-family:Rubik,sans-serif;font-size:.875rem;font-weight:500;line-height:20px;letter-spacing:.28px}.body-base{font-family:Rubik,sans-serif;font-size:.875rem;font-weight:400;line-height:20px;font-style:italic;letter-spacing:.28px}.body-base-1,.body-base-1-1{font-family:Rubik,sans-serif;font-size:.875rem;font-weight:400;line-height:20px;letter-spacing:.28px}.body-sm{font-family:Rubik,sans-serif;font-size:.75rem;font-weight:400;line-height:16px;letter-spacing:.28px}.body-sm-italic{font-family:Rubik,sans-serif;font-size:.75rem;font-weight:400;line-height:16px;font-style:italic;letter-spacing:.28px}.caption-sm{font-family:Rubik,sans-serif;font-size:.75rem;font-weight:500;line-height:16px;letter-spacing:.28px}.caption-sm-italic{font-family:Rubik,sans-serif;font-size:.75rem;font-weight:500;line-height:16px;font-style:italic;letter-spacing:.28px}.container-general{position:relative;height:100%}.container-textfield{display:flex;padding:10px 12px;justify-content:center;align-items:flex-start;gap:4px;cursor:pointer;border:1px solid #f5f5f5;border-radius:8px;background:#f5f5f5;font-family:Rubik,sans-serif;font-size:.875rem;font-weight:400;line-height:20px;letter-spacing:.28px}.container-textfield:hover:not(.disabled):not(.focused){background:#edf6ff}.container-textfield.focused{border:1px solid #0581BC;background:#edf6ff}.container-textfield.disabled{cursor:default;background:#f5f5f5}.container-textfield.disabled .icon-color,.container-textfield.disabled .icon-arrows,.container-textfield.disabled input{color:#bfbfbf}.container-textfield.disabled input::placeholder{color:#bfbfbf;opacity:1}.container-textfield .icon-arrows{pointer-events:none}.container-textfield .icon-arrows svg{pointer-events:none}.icon-color{color:#595959}.icon-arrows{color:#333}input{display:flex;align-items:center;flex:1 0 0;border:none;outline:none;background-color:transparent;font-family:Rubik,sans-serif;font-size:.875rem;font-weight:400;line-height:20px;letter-spacing:.28px}.cnt-icon-right{display:flex;align-items:center;justify-content:center;background:none;padding:0;color:#333}.container-label-sup{display:flex;align-items:center;gap:4px;margin-bottom:8px;color:#333;font-family:Roboto,sans-serif;font-size:.875rem;font-weight:500;line-height:20px;letter-spacing:.28px}.container-label-sup.disabled{color:#bfbfbf}.icon-dot{display:flex;align-items:center;width:4px;height:4px;aspect-ratio:1/1;background-color:#db2e2a;border-radius:100px}.icon-color-help{color:#8c8c8c}.label-inf{display:flex;position:absolute;margin-top:4px;color:#595959;font-family:Roboto,sans-serif;font-size:.75rem;font-style:italic;font-weight:500;line-height:16px;letter-spacing:.24px}.container-list{height:176px;display:flex;gap:4px;padding:4px;border-radius:8px;background:#fff;box-shadow:0 2px 6px #00000024,0 1px 10px #0000001a}.ctn-items{display:flex;width:300px;height:100%;flex-direction:column;overflow-y:auto;overflow-x:hidden}.item-list{display:flex;height:42px;min-height:42px;flex-shrink:0;align-items:center;cursor:pointer;border:none;padding:0 8px 0 16px;gap:8px;border-radius:4px;background:#fff}.item-list:active:not(:disabled){background:#c4dfff!important}.item-list:hover:not(:disabled){background:#f5f5f5}.item-check{display:flex;height:42px;min-height:42px;flex-shrink:0;align-items:center;border:none;cursor:pointer;padding-right:8px;gap:8px;border-radius:4px;background:#fff}.item-check:active:not(:disabled){background:#c4dfff!important}.item-check:hover:not(:disabled){background:#f5f5f5}.tx-item{flex:1 0 0;overflow:hidden;white-space:nowrap;text-overflow:ellipsis;display:block;min-width:0;text-align:left}.body-b{font-family:Rubik,sans-serif;font-size:.875rem;font-weight:400;line-height:20px;letter-spacing:.28px}.color-pry{color:#333}.separator{width:.5px;background:#d9d9d9}.scrollable-small::-webkit-scrollbar{-webkit-appearance:none}.scrollable-small::-webkit-scrollbar:vertical{width:4px;height:32px;padding-top:2px;padding-bottom:2px}.scrollable-small::-webkit-scrollbar:horizontal{height:5px;padding-top:2px;padding-bottom:2px}.scrollable-small::-webkit-scrollbar-thumb{background-color:#08a6db;border-radius:4px}input::-webkit-outer-spin-button,input::-webkit-inner-spin-button{-webkit-appearance:none;margin:0}\n"], dependencies: [{ kind: "component", type: IconMdComponent, selector: "ius-icon-md", inputs: ["iconName", "color"] }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1$3.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$3.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$3.MaxLengthValidator, selector: "[maxlength][formControlName],[maxlength][formControl],[maxlength][ngModel]", inputs: ["maxlength"] }, { kind: "directive", type: i1$3.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1$1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "component", type: IconSmComponent, selector: "ius-icon-sm", inputs: ["iconName", "color"] }, { kind: "component", type: CheckboxComponent, selector: "ius-checkbox", inputs: ["checked", "disabled"], outputs: ["checkedChange"] }] }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "17.3.12", type: InputSelectFilterComponent, isStandalone: true, selector: "ius-input-select-filter", inputs: { filterData: "filterData", componentId: "componentId", disabled: "disabled", showHelpText: "showHelpText", labelSuperior: "labelSuperior", labelInput: "labelInput", iconInput: "iconInput", textInput: "textInput", maxlenght: "maxlenght", inputType: "inputType" }, outputs: { onChangesValueEvent: "onChangesValueEvent", onEnterKey: "onEnterKey" }, host: { listeners: { "document:click": "onClickOutside($event)" } }, viewQueries: [{ propertyName: "listPanel", first: true, predicate: ["listPanel"], descendants: true }], ngImport: i0, template: "<div class=\"container-general\" [id]=\"componentId\">\r\n    @if (labelSuperior) {\r\n    <div class=\"container-label-sup\" [ngClass]=\"{\r\n        'disabled': disabled\r\n    }\">\r\n        <span class=\"\">{{labelSuperior}}</span>\r\n        @if(!disabled && showHelpText){\r\n        <ius-icon-md iconName=\"icon-help\" class=\"icon-color-help\"></ius-icon-md>\r\n        }\r\n        <span>:</span>\r\n    </div>\r\n    }\r\n    <div class=\"container-textfield\" [ngClass]=\"{\r\n        'disabled': disabled,\r\n        'focused': isFocused || showList\r\n    }\" (click)=\"onFocus()\">\r\n        @if (iconInput) {\r\n        <ius-icon-md [iconName]=\"iconInput\" class=\"icon-color\"></ius-icon-md>\r\n        }\r\n        <input [type]=\"inputType\" [(ngModel)]=\"textInput\" readonly [placeholder]=\"labelInput\" [disabled]=\"disabled\"\r\n            [maxlength]=\"maxlenght ?? null\" (focus)=\"onFocus()\" (blur)=\"onBlur()\"\r\n            (drop)=\"onDropBlock($event)\" (dragover)=\"onDragOverBlock($event)\">\r\n        <div class=\"cnt-icon-right\">\r\n            @if(!showList){\r\n            <ius-icon-md iconName=\"icon-keyboard-arrow-down\" class=\"icon-arrows\"></ius-icon-md>\r\n            }@else{\r\n            <div (click)=\"closeList($event)\" style=\"height: 20px;\">\r\n                <ius-icon-md iconName=\"icon-keyboard-arrow-up\" class=\"icon-arrows\"></ius-icon-md>\r\n            </div>\r\n            }\r\n        </div>\r\n    </div>\r\n    <ng-template #listPanel>\r\n    <div class=\"container-list\">\r\n        <div class=\"ctn-items scrollable-small\">\r\n            @for (data of filterData; track $index) {\r\n            <button class=\"item-list\" (click)=\"selectedData(data)\">\r\n                <span class=\"tx-item body-b color-pry\">{{data.title}}</span>\r\n                <ius-icon-sm iconName=\"icon-arrow-forward-ios\" class=\"color-pry\"></ius-icon-sm>\r\n            </button>\r\n            }\r\n        </div>\r\n        @if(filterDataSelected){\r\n        <div class=\"separator\"></div>\r\n        <div class=\"ctn-items scrollable-small\">\r\n            @for (item of filterDataSelected.values; track $index) {\r\n            <div class=\"item-check\" (click)=\"selectedItem(item)\">\r\n                <ius-checkbox [checked]=\"item.checked\" (click)=\"$event.stopPropagation(); selectedItem(item)\"></ius-checkbox>\r\n                <span class=\"tx-item body-b color-pry\">{{item.text}}</span>\r\n            </div>\r\n            }\r\n        </div>\r\n        }\r\n    </div>\r\n    </ng-template>\r\n</div>", styles: [".h1{font-family:Roboto,sans-serif;font-size:2.375rem;font-weight:500;line-height:46px}.h2{font-family:Roboto,sans-serif;font-size:1.875rem;font-weight:700;line-height:38px}.h3{font-family:Roboto,sans-serif;font-size:1.5rem;font-weight:500;line-height:32px}.h4{font-family:Roboto,sans-serif;font-size:1.25rem;font-weight:700;line-height:26px}.h5{font-family:Roboto,sans-serif;font-size:1.125rem;font-weight:500;line-height:24px;letter-spacing:.18px}.label-large{font-family:Roboto,sans-serif;font-size:1rem;font-weight:500;line-height:22px}.body-large{font-family:Rubik,sans-serif;font-size:1rem;font-weight:400;line-height:22px}.label-base{font-family:Rubik,sans-serif;font-size:.875rem;font-weight:500;line-height:20px;letter-spacing:.28px}.body-base{font-family:Rubik,sans-serif;font-size:.875rem;font-weight:400;line-height:20px;font-style:italic;letter-spacing:.28px}.body-base-1,.body-base-1-1{font-family:Rubik,sans-serif;font-size:.875rem;font-weight:400;line-height:20px;letter-spacing:.28px}.body-sm{font-family:Rubik,sans-serif;font-size:.75rem;font-weight:400;line-height:16px;letter-spacing:.28px}.body-sm-italic{font-family:Rubik,sans-serif;font-size:.75rem;font-weight:400;line-height:16px;font-style:italic;letter-spacing:.28px}.caption-sm{font-family:Rubik,sans-serif;font-size:.75rem;font-weight:500;line-height:16px;letter-spacing:.28px}.caption-sm-italic{font-family:Rubik,sans-serif;font-size:.75rem;font-weight:500;line-height:16px;font-style:italic;letter-spacing:.28px}.container-general{position:relative;height:100%}.container-textfield{display:flex;padding:10px 12px;justify-content:center;align-items:flex-start;gap:4px;cursor:pointer;border:1px solid #f5f5f5;border-radius:8px;background:#f5f5f5;font-family:Rubik,sans-serif;font-size:.875rem;font-weight:400;line-height:20px;letter-spacing:.28px}.container-textfield:hover:not(.disabled):not(.focused){background:#edf6ff}.container-textfield.focused{border:1px solid #0581BC;background:#edf6ff}.container-textfield.disabled{cursor:default;background:#f5f5f5}.container-textfield.disabled .icon-color,.container-textfield.disabled .icon-arrows,.container-textfield.disabled input{color:#bfbfbf}.container-textfield.disabled input::placeholder{color:#bfbfbf;opacity:1}.container-textfield .icon-arrows{pointer-events:none}.container-textfield .icon-arrows svg{pointer-events:none}.icon-color{color:#595959}.icon-arrows{color:#333}input{display:flex;align-items:center;flex:1 0 0;border:none;outline:none;background-color:transparent;font-family:Rubik,sans-serif;font-size:.875rem;font-weight:400;line-height:20px;letter-spacing:.28px}.cnt-icon-right{display:flex;align-items:center;justify-content:center;background:none;padding:0;color:#333}.container-label-sup{display:flex;align-items:center;gap:4px;margin-bottom:8px;color:#333;font-family:Rubik,sans-serif;font-size:.875rem;font-weight:500;line-height:20px;letter-spacing:.28px}.container-label-sup.disabled{color:#bfbfbf}.icon-dot{display:flex;align-items:center;width:4px;height:4px;aspect-ratio:1/1;background-color:#db2e2a;border-radius:100px}.icon-color-help{color:#8c8c8c}.label-inf{display:flex;position:absolute;margin-top:4px;color:#595959;font-family:Roboto,sans-serif;font-size:.75rem;font-style:italic;font-weight:500;line-height:16px;letter-spacing:.24px}.container-list{height:176px;display:flex;gap:4px;padding:4px;border-radius:8px;background:#fff;box-shadow:0 2px 6px #00000024,0 1px 10px #0000001a}.ctn-items{display:flex;width:300px;height:100%;flex-direction:column;overflow-y:auto;overflow-x:hidden}.item-list{display:flex;height:42px;min-height:42px;flex-shrink:0;align-items:center;cursor:pointer;border:none;padding:0 8px 0 16px;gap:8px;border-radius:4px;background:#fff}.item-list:active:not(:disabled){background:#c4dfff!important}.item-list:hover:not(:disabled){background:#f5f5f5}.item-check{display:flex;height:42px;min-height:42px;flex-shrink:0;align-items:center;border:none;cursor:pointer;padding-right:8px;gap:8px;border-radius:4px;background:#fff}.item-check:active:not(:disabled){background:#c4dfff!important}.item-check:hover:not(:disabled){background:#f5f5f5}.tx-item{flex:1 0 0;overflow:hidden;white-space:nowrap;text-overflow:ellipsis;display:block;min-width:0;text-align:left}.body-b{font-family:Rubik,sans-serif;font-size:.875rem;font-weight:400;line-height:20px;letter-spacing:.28px}.color-pry{color:#333}.separator{width:.5px;background:#d9d9d9}.scrollable-small::-webkit-scrollbar{-webkit-appearance:none}.scrollable-small::-webkit-scrollbar:vertical{width:4px;height:32px;padding-top:2px;padding-bottom:2px}.scrollable-small::-webkit-scrollbar:horizontal{height:5px;padding-top:2px;padding-bottom:2px}.scrollable-small::-webkit-scrollbar-thumb{background-color:#08a6db;border-radius:4px}input::-webkit-outer-spin-button,input::-webkit-inner-spin-button{-webkit-appearance:none;margin:0}\n"], dependencies: [{ kind: "component", type: IconMdComponent, selector: "ius-icon-md", inputs: ["iconName", "color"] }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1$3.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$3.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$3.MaxLengthValidator, selector: "[maxlength][formControlName],[maxlength][formControl],[maxlength][ngModel]", inputs: ["maxlength"] }, { kind: "directive", type: i1$3.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1$1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "component", type: IconSmComponent, selector: "ius-icon-sm", inputs: ["iconName", "color"] }, { kind: "component", type: CheckboxComponent, selector: "ius-checkbox", inputs: ["checked", "disabled"], outputs: ["checkedChange"] }] }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: InputSelectFilterComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'ius-input-select-filter', standalone: true, imports: [IconMdComponent, FormsModule, CommonModule, IconSmComponent, CheckboxComponent], template: "<div class=\"container-general\" [id]=\"componentId\">\r\n    @if (labelSuperior) {\r\n    <div class=\"container-label-sup\" [ngClass]=\"{\r\n        'disabled': disabled\r\n    }\">\r\n        <span class=\"\">{{labelSuperior}}</span>\r\n        @if(!disabled && showHelpText){\r\n        <ius-icon-md iconName=\"icon-help\" class=\"icon-color-help\"></ius-icon-md>\r\n        }\r\n        <span>:</span>\r\n    </div>\r\n    }\r\n    <div class=\"container-textfield\" [ngClass]=\"{\r\n        'disabled': disabled,\r\n        'focused': isFocused || showList\r\n    }\" (click)=\"onFocus()\">\r\n        @if (iconInput) {\r\n        <ius-icon-md [iconName]=\"iconInput\" class=\"icon-color\"></ius-icon-md>\r\n        }\r\n        <input [type]=\"inputType\" [(ngModel)]=\"textInput\" readonly [placeholder]=\"labelInput\" [disabled]=\"disabled\"\r\n            [maxlength]=\"maxlenght ?? null\" (focus)=\"onFocus()\" (blur)=\"onBlur()\"\r\n            (drop)=\"onDropBlock($event)\" (dragover)=\"onDragOverBlock($event)\">\r\n        <div class=\"cnt-icon-right\">\r\n            @if(!showList){\r\n            <ius-icon-md iconName=\"icon-keyboard-arrow-down\" class=\"icon-arrows\"></ius-icon-md>\r\n            }@else{\r\n            <div (click)=\"closeList($event)\" style=\"height: 20px;\">\r\n                <ius-icon-md iconName=\"icon-keyboard-arrow-up\" class=\"icon-arrows\"></ius-icon-md>\r\n            </div>\r\n            }\r\n        </div>\r\n    </div>\r\n    <ng-template #listPanel>\r\n    <div class=\"container-list\">\r\n        <div class=\"ctn-items scrollable-small\">\r\n            @for (data of filterData; track $index) {\r\n            <button class=\"item-list\" (click)=\"selectedData(data)\">\r\n                <span class=\"tx-item body-b color-pry\">{{data.title}}</span>\r\n                <ius-icon-sm iconName=\"icon-arrow-forward-ios\" class=\"color-pry\"></ius-icon-sm>\r\n            </button>\r\n            }\r\n        </div>\r\n        @if(filterDataSelected){\r\n        <div class=\"separator\"></div>\r\n        <div class=\"ctn-items scrollable-small\">\r\n            @for (item of filterDataSelected.values; track $index) {\r\n            <div class=\"item-check\" (click)=\"selectedItem(item)\">\r\n                <ius-checkbox [checked]=\"item.checked\" (click)=\"$event.stopPropagation(); selectedItem(item)\"></ius-checkbox>\r\n                <span class=\"tx-item body-b color-pry\">{{item.text}}</span>\r\n            </div>\r\n            }\r\n        </div>\r\n        }\r\n    </div>\r\n    </ng-template>\r\n</div>", styles: [".h1{font-family:Roboto,sans-serif;font-size:2.375rem;font-weight:500;line-height:46px}.h2{font-family:Roboto,sans-serif;font-size:1.875rem;font-weight:700;line-height:38px}.h3{font-family:Roboto,sans-serif;font-size:1.5rem;font-weight:500;line-height:32px}.h4{font-family:Roboto,sans-serif;font-size:1.25rem;font-weight:700;line-height:26px}.h5{font-family:Roboto,sans-serif;font-size:1.125rem;font-weight:500;line-height:24px;letter-spacing:.18px}.label-large{font-family:Roboto,sans-serif;font-size:1rem;font-weight:500;line-height:22px}.body-large{font-family:Rubik,sans-serif;font-size:1rem;font-weight:400;line-height:22px}.label-base{font-family:Rubik,sans-serif;font-size:.875rem;font-weight:500;line-height:20px;letter-spacing:.28px}.body-base{font-family:Rubik,sans-serif;font-size:.875rem;font-weight:400;line-height:20px;font-style:italic;letter-spacing:.28px}.body-base-1,.body-base-1-1{font-family:Rubik,sans-serif;font-size:.875rem;font-weight:400;line-height:20px;letter-spacing:.28px}.body-sm{font-family:Rubik,sans-serif;font-size:.75rem;font-weight:400;line-height:16px;letter-spacing:.28px}.body-sm-italic{font-family:Rubik,sans-serif;font-size:.75rem;font-weight:400;line-height:16px;font-style:italic;letter-spacing:.28px}.caption-sm{font-family:Rubik,sans-serif;font-size:.75rem;font-weight:500;line-height:16px;letter-spacing:.28px}.caption-sm-italic{font-family:Rubik,sans-serif;font-size:.75rem;font-weight:500;line-height:16px;font-style:italic;letter-spacing:.28px}.container-general{position:relative;height:100%}.container-textfield{display:flex;padding:10px 12px;justify-content:center;align-items:flex-start;gap:4px;cursor:pointer;border:1px solid #f5f5f5;border-radius:8px;background:#f5f5f5;font-family:Rubik,sans-serif;font-size:.875rem;font-weight:400;line-height:20px;letter-spacing:.28px}.container-textfield:hover:not(.disabled):not(.focused){background:#edf6ff}.container-textfield.focused{border:1px solid #0581BC;background:#edf6ff}.container-textfield.disabled{cursor:default;background:#f5f5f5}.container-textfield.disabled .icon-color,.container-textfield.disabled .icon-arrows,.container-textfield.disabled input{color:#bfbfbf}.container-textfield.disabled input::placeholder{color:#bfbfbf;opacity:1}.container-textfield .icon-arrows{pointer-events:none}.container-textfield .icon-arrows svg{pointer-events:none}.icon-color{color:#595959}.icon-arrows{color:#333}input{display:flex;align-items:center;flex:1 0 0;border:none;outline:none;background-color:transparent;font-family:Rubik,sans-serif;font-size:.875rem;font-weight:400;line-height:20px;letter-spacing:.28px}.cnt-icon-right{display:flex;align-items:center;justify-content:center;background:none;padding:0;color:#333}.container-label-sup{display:flex;align-items:center;gap:4px;margin-bottom:8px;color:#333;font-family:Roboto,sans-serif;font-size:.875rem;font-weight:500;line-height:20px;letter-spacing:.28px}.container-label-sup.disabled{color:#bfbfbf}.icon-dot{display:flex;align-items:center;width:4px;height:4px;aspect-ratio:1/1;background-color:#db2e2a;border-radius:100px}.icon-color-help{color:#8c8c8c}.label-inf{display:flex;position:absolute;margin-top:4px;color:#595959;font-family:Roboto,sans-serif;font-size:.75rem;font-style:italic;font-weight:500;line-height:16px;letter-spacing:.24px}.container-list{height:176px;display:flex;gap:4px;padding:4px;border-radius:8px;background:#fff;box-shadow:0 2px 6px #00000024,0 1px 10px #0000001a}.ctn-items{display:flex;width:300px;height:100%;flex-direction:column;overflow-y:auto;overflow-x:hidden}.item-list{display:flex;height:42px;min-height:42px;flex-shrink:0;align-items:center;cursor:pointer;border:none;padding:0 8px 0 16px;gap:8px;border-radius:4px;background:#fff}.item-list:active:not(:disabled){background:#c4dfff!important}.item-list:hover:not(:disabled){background:#f5f5f5}.item-check{display:flex;height:42px;min-height:42px;flex-shrink:0;align-items:center;border:none;cursor:pointer;padding-right:8px;gap:8px;border-radius:4px;background:#fff}.item-check:active:not(:disabled){background:#c4dfff!important}.item-check:hover:not(:disabled){background:#f5f5f5}.tx-item{flex:1 0 0;overflow:hidden;white-space:nowrap;text-overflow:ellipsis;display:block;min-width:0;text-align:left}.body-b{font-family:Rubik,sans-serif;font-size:.875rem;font-weight:400;line-height:20px;letter-spacing:.28px}.color-pry{color:#333}.separator{width:.5px;background:#d9d9d9}.scrollable-small::-webkit-scrollbar{-webkit-appearance:none}.scrollable-small::-webkit-scrollbar:vertical{width:4px;height:32px;padding-top:2px;padding-bottom:2px}.scrollable-small::-webkit-scrollbar:horizontal{height:5px;padding-top:2px;padding-bottom:2px}.scrollable-small::-webkit-scrollbar-thumb{background-color:#08a6db;border-radius:4px}input::-webkit-outer-spin-button,input::-webkit-inner-spin-button{-webkit-appearance:none;margin:0}\n"] }]
+            args: [{ selector: 'ius-input-select-filter', standalone: true, imports: [IconMdComponent, FormsModule, CommonModule, IconSmComponent, CheckboxComponent], template: "<div class=\"container-general\" [id]=\"componentId\">\r\n    @if (labelSuperior) {\r\n    <div class=\"container-label-sup\" [ngClass]=\"{\r\n        'disabled': disabled\r\n    }\">\r\n        <span class=\"\">{{labelSuperior}}</span>\r\n        @if(!disabled && showHelpText){\r\n        <ius-icon-md iconName=\"icon-help\" class=\"icon-color-help\"></ius-icon-md>\r\n        }\r\n        <span>:</span>\r\n    </div>\r\n    }\r\n    <div class=\"container-textfield\" [ngClass]=\"{\r\n        'disabled': disabled,\r\n        'focused': isFocused || showList\r\n    }\" (click)=\"onFocus()\">\r\n        @if (iconInput) {\r\n        <ius-icon-md [iconName]=\"iconInput\" class=\"icon-color\"></ius-icon-md>\r\n        }\r\n        <input [type]=\"inputType\" [(ngModel)]=\"textInput\" readonly [placeholder]=\"labelInput\" [disabled]=\"disabled\"\r\n            [maxlength]=\"maxlenght ?? null\" (focus)=\"onFocus()\" (blur)=\"onBlur()\"\r\n            (drop)=\"onDropBlock($event)\" (dragover)=\"onDragOverBlock($event)\">\r\n        <div class=\"cnt-icon-right\">\r\n            @if(!showList){\r\n            <ius-icon-md iconName=\"icon-keyboard-arrow-down\" class=\"icon-arrows\"></ius-icon-md>\r\n            }@else{\r\n            <div (click)=\"closeList($event)\" style=\"height: 20px;\">\r\n                <ius-icon-md iconName=\"icon-keyboard-arrow-up\" class=\"icon-arrows\"></ius-icon-md>\r\n            </div>\r\n            }\r\n        </div>\r\n    </div>\r\n    <ng-template #listPanel>\r\n    <div class=\"container-list\">\r\n        <div class=\"ctn-items scrollable-small\">\r\n            @for (data of filterData; track $index) {\r\n            <button class=\"item-list\" (click)=\"selectedData(data)\">\r\n                <span class=\"tx-item body-b color-pry\">{{data.title}}</span>\r\n                <ius-icon-sm iconName=\"icon-arrow-forward-ios\" class=\"color-pry\"></ius-icon-sm>\r\n            </button>\r\n            }\r\n        </div>\r\n        @if(filterDataSelected){\r\n        <div class=\"separator\"></div>\r\n        <div class=\"ctn-items scrollable-small\">\r\n            @for (item of filterDataSelected.values; track $index) {\r\n            <div class=\"item-check\" (click)=\"selectedItem(item)\">\r\n                <ius-checkbox [checked]=\"item.checked\" (click)=\"$event.stopPropagation(); selectedItem(item)\"></ius-checkbox>\r\n                <span class=\"tx-item body-b color-pry\">{{item.text}}</span>\r\n            </div>\r\n            }\r\n        </div>\r\n        }\r\n    </div>\r\n    </ng-template>\r\n</div>", styles: [".h1{font-family:Roboto,sans-serif;font-size:2.375rem;font-weight:500;line-height:46px}.h2{font-family:Roboto,sans-serif;font-size:1.875rem;font-weight:700;line-height:38px}.h3{font-family:Roboto,sans-serif;font-size:1.5rem;font-weight:500;line-height:32px}.h4{font-family:Roboto,sans-serif;font-size:1.25rem;font-weight:700;line-height:26px}.h5{font-family:Roboto,sans-serif;font-size:1.125rem;font-weight:500;line-height:24px;letter-spacing:.18px}.label-large{font-family:Roboto,sans-serif;font-size:1rem;font-weight:500;line-height:22px}.body-large{font-family:Rubik,sans-serif;font-size:1rem;font-weight:400;line-height:22px}.label-base{font-family:Rubik,sans-serif;font-size:.875rem;font-weight:500;line-height:20px;letter-spacing:.28px}.body-base{font-family:Rubik,sans-serif;font-size:.875rem;font-weight:400;line-height:20px;font-style:italic;letter-spacing:.28px}.body-base-1,.body-base-1-1{font-family:Rubik,sans-serif;font-size:.875rem;font-weight:400;line-height:20px;letter-spacing:.28px}.body-sm{font-family:Rubik,sans-serif;font-size:.75rem;font-weight:400;line-height:16px;letter-spacing:.28px}.body-sm-italic{font-family:Rubik,sans-serif;font-size:.75rem;font-weight:400;line-height:16px;font-style:italic;letter-spacing:.28px}.caption-sm{font-family:Rubik,sans-serif;font-size:.75rem;font-weight:500;line-height:16px;letter-spacing:.28px}.caption-sm-italic{font-family:Rubik,sans-serif;font-size:.75rem;font-weight:500;line-height:16px;font-style:italic;letter-spacing:.28px}.container-general{position:relative;height:100%}.container-textfield{display:flex;padding:10px 12px;justify-content:center;align-items:flex-start;gap:4px;cursor:pointer;border:1px solid #f5f5f5;border-radius:8px;background:#f5f5f5;font-family:Rubik,sans-serif;font-size:.875rem;font-weight:400;line-height:20px;letter-spacing:.28px}.container-textfield:hover:not(.disabled):not(.focused){background:#edf6ff}.container-textfield.focused{border:1px solid #0581BC;background:#edf6ff}.container-textfield.disabled{cursor:default;background:#f5f5f5}.container-textfield.disabled .icon-color,.container-textfield.disabled .icon-arrows,.container-textfield.disabled input{color:#bfbfbf}.container-textfield.disabled input::placeholder{color:#bfbfbf;opacity:1}.container-textfield .icon-arrows{pointer-events:none}.container-textfield .icon-arrows svg{pointer-events:none}.icon-color{color:#595959}.icon-arrows{color:#333}input{display:flex;align-items:center;flex:1 0 0;border:none;outline:none;background-color:transparent;font-family:Rubik,sans-serif;font-size:.875rem;font-weight:400;line-height:20px;letter-spacing:.28px}.cnt-icon-right{display:flex;align-items:center;justify-content:center;background:none;padding:0;color:#333}.container-label-sup{display:flex;align-items:center;gap:4px;margin-bottom:8px;color:#333;font-family:Rubik,sans-serif;font-size:.875rem;font-weight:500;line-height:20px;letter-spacing:.28px}.container-label-sup.disabled{color:#bfbfbf}.icon-dot{display:flex;align-items:center;width:4px;height:4px;aspect-ratio:1/1;background-color:#db2e2a;border-radius:100px}.icon-color-help{color:#8c8c8c}.label-inf{display:flex;position:absolute;margin-top:4px;color:#595959;font-family:Roboto,sans-serif;font-size:.75rem;font-style:italic;font-weight:500;line-height:16px;letter-spacing:.24px}.container-list{height:176px;display:flex;gap:4px;padding:4px;border-radius:8px;background:#fff;box-shadow:0 2px 6px #00000024,0 1px 10px #0000001a}.ctn-items{display:flex;width:300px;height:100%;flex-direction:column;overflow-y:auto;overflow-x:hidden}.item-list{display:flex;height:42px;min-height:42px;flex-shrink:0;align-items:center;cursor:pointer;border:none;padding:0 8px 0 16px;gap:8px;border-radius:4px;background:#fff}.item-list:active:not(:disabled){background:#c4dfff!important}.item-list:hover:not(:disabled){background:#f5f5f5}.item-check{display:flex;height:42px;min-height:42px;flex-shrink:0;align-items:center;border:none;cursor:pointer;padding-right:8px;gap:8px;border-radius:4px;background:#fff}.item-check:active:not(:disabled){background:#c4dfff!important}.item-check:hover:not(:disabled){background:#f5f5f5}.tx-item{flex:1 0 0;overflow:hidden;white-space:nowrap;text-overflow:ellipsis;display:block;min-width:0;text-align:left}.body-b{font-family:Rubik,sans-serif;font-size:.875rem;font-weight:400;line-height:20px;letter-spacing:.28px}.color-pry{color:#333}.separator{width:.5px;background:#d9d9d9}.scrollable-small::-webkit-scrollbar{-webkit-appearance:none}.scrollable-small::-webkit-scrollbar:vertical{width:4px;height:32px;padding-top:2px;padding-bottom:2px}.scrollable-small::-webkit-scrollbar:horizontal{height:5px;padding-top:2px;padding-bottom:2px}.scrollable-small::-webkit-scrollbar-thumb{background-color:#08a6db;border-radius:4px}input::-webkit-outer-spin-button,input::-webkit-inner-spin-button{-webkit-appearance:none;margin:0}\n"] }]
         }], ctorParameters: () => [{ type: i0.ElementRef }, { type: i1$2.Overlay }, { type: i0.ViewContainerRef }], propDecorators: { filterData: [{
                 type: Input
             }], listPanel: [{
@@ -6332,11 +6336,11 @@ class CardPlanSubscriptionComponent {
         this.onClickCard.emit(this.planID);
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: CardPlanSubscriptionComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "17.3.12", type: CardPlanSubscriptionComponent, isStandalone: true, selector: "ius-card-plan-subscription", inputs: { planType: "planType", name: "name", role: "role", label1: "label1", data1: "data1", label2: "label2", data2: "data2", planID: "planID", titleDate: "titleDate", date: "date", iconName: "iconName", iconColor: "iconColor" }, outputs: { onClickCard: "onClickCard" }, ngImport: i0, template: "<div class=\"general-container\">\r\n    <div class=\"container-card\" (mouseenter)=\"onMouseEnter()\" (mouseleave)=\"onMouseLeave()\" (click)=\"clickCard($event)\">\r\n        <div class=\"data\">\r\n            <div class=\"left-data\">\r\n                <div class=\"image-container\">\r\n                    <ius-icon-sm [color]=\"iconColor\" [iconName]=\"iconName\"></ius-icon-sm>\r\n                </div>\r\n                <div class=\"data-container\">\r\n                    <div class=\"data-container-interno\">\r\n                        <p class=\"state\">\r\n                            {{ planType }}\r\n                        </p>\r\n                        <p class=\"name\">{{ name }}</p>\r\n                        <div class=\"container\">\r\n                            <div class=\"data-container\">\r\n                                <p class=\"title\">{{ label1 }}</p>\r\n                                <p class=\"data\">{{ data1 }}</p>\r\n                            </div>\r\n                            <div class=\"data-container\">\r\n                                <p class=\"title\">{{ label2 }}</p>\r\n                                <p class=\"data\">{{ data2 }}</p>\r\n                            </div>\r\n\r\n                        </div>\r\n                        <div class=\"container-active\">\r\n                            <p>Activo</p>\r\n                        </div>\r\n                    </div>\r\n                </div>\r\n            </div>\r\n            <div class=\"right-data\">\r\n                <div>\r\n                    <p class=\"title\">{{ titleDate }}</p>\r\n                    <p class=\"data\">{{ date }}</p>\r\n                </div>\r\n                @if (hover) {\r\n                <div class=\"buttons\">\r\n                    <div>\r\n                        <span class=\"data\">Asigna tus cupos</span>\r\n                    </div>\r\n                    <div>\r\n                        <ius-button-squared-tertiary iconName=\"icon-discover-tune\"\r\n                            (buttonClicked)=\"clickCard($event)\"></ius-button-squared-tertiary>\r\n                    </div>\r\n                </div>\r\n                }\r\n                <div class=\"btn\">\r\n                    <ius-button-squared-tertiary iconName=\"icon-keyboard-arrow-right\"\r\n                        (buttonClicked)=\"clickCard($event)\"></ius-button-squared-tertiary>\r\n                </div>\r\n            </div>\r\n        </div>\r\n    </div>\r\n</div>", styles: [".h1{font-family:Roboto,sans-serif;font-size:2.375rem;font-weight:500;line-height:46px}.h2{font-family:Roboto,sans-serif;font-size:1.875rem;font-weight:700;line-height:38px}.h3{font-family:Roboto,sans-serif;font-size:1.5rem;font-weight:500;line-height:32px}.h4{font-family:Roboto,sans-serif;font-size:1.25rem;font-weight:700;line-height:26px}.h5{font-family:Roboto,sans-serif;font-size:1.125rem;font-weight:500;line-height:24px;letter-spacing:.18px}.label-large{font-family:Roboto,sans-serif;font-size:1rem;font-weight:500;line-height:22px}.body-large{font-family:Rubik,sans-serif;font-size:1rem;font-weight:400;line-height:22px}.label-base{font-family:Rubik,sans-serif;font-size:.875rem;font-weight:500;line-height:20px;letter-spacing:.28px}.body-base{font-family:Rubik,sans-serif;font-size:.875rem;font-weight:400;line-height:20px;font-style:italic;letter-spacing:.28px}.body-base-1,.body-base-1-1{font-family:Rubik,sans-serif;font-size:.875rem;font-weight:400;line-height:20px;letter-spacing:.28px}.body-sm{font-family:Rubik,sans-serif;font-size:.75rem;font-weight:400;line-height:16px;letter-spacing:.28px}.body-sm-italic{font-family:Rubik,sans-serif;font-size:.75rem;font-weight:400;line-height:16px;font-style:italic;letter-spacing:.28px}.caption-sm{font-family:Rubik,sans-serif;font-size:.75rem;font-weight:500;line-height:16px;letter-spacing:.28px}.caption-sm-italic{font-family:Rubik,sans-serif;font-size:.75rem;font-weight:500;line-height:16px;font-style:italic;letter-spacing:.28px}.general-container{position:relative}.container-card{display:flex;padding:8px 16px;align-items:center;align-content:center;gap:12px;flex-wrap:wrap;border-radius:8px;border:1px solid #eaeaea;background:#fff}.container-card :hover{cursor:pointer}.data{display:flex;align-items:center;gap:40px;flex:1 0 0}.left-data{display:flex;min-width:280px;align-items:center;gap:8px;flex:1 0 0}.left-data .container-icon-letra{background-color:#dfe0ff;display:flex;width:20px;height:20px;padding:10px;margin-right:10px;justify-content:center;align-items:center;border-radius:100px;font-family:Rubik,sans-serif;font-size:.75rem;font-style:normal;font-weight:400;line-height:16px;letter-spacing:.24px}.left-data .container-icon-letra:hover{background-color:#6670c4!important}.left-data .container-icon-letra:hover>span{display:none}.left-data .container-icon-letra:hover .icon-letra-edit{display:block}.left-data .container-icon-letra span{color:#1b2678;text-align:center;font-size:18px;font-weight:500}.left-data .image-container{display:flex;align-items:center;gap:8px;border-radius:100px;border:.5px solid #f5f5f5;background:#c4dfff;width:32px;height:32px;justify-content:center;aspect-ratio:1/1}.left-data .data-container{display:flex;align-items:center;gap:4px}.left-data .data-container p{margin:0}.left-data .data-container .name{display:flex;align-items:center;gap:10px;color:#333;font-family:Roboto,sans-serif;font-size:1rem;font-style:normal;font-weight:500;line-height:22px}.left-data .data-container .state{display:flex;align-items:center;gap:10px;align-self:stretch;color:#595959;font-family:Rubik,sans-serif;font-size:.75rem;font-style:normal;font-weight:400;line-height:16px;letter-spacing:.24px}.left-data .data-container .role{display:flex;align-items:center;gap:10px;align-self:stretch;color:#8c8c8c;font-family:Rubik,sans-serif;font-size:.875rem;font-style:normal;font-weight:400;line-height:20px;letter-spacing:.28px}.left-data .container{display:flex;align-items:flex-start;gap:8px}.left-data .container .data-container{display:flex;align-items:center;gap:4px}.left-data .container .data-container .title{display:flex;align-items:center;gap:10px;color:#8c8c8c;font-family:Rubik,sans-serif;font-size:.75rem;font-style:normal;font-weight:400;line-height:16px;letter-spacing:.24px;align-self:start}.left-data .container .data-container .data{display:flex;align-items:center;gap:10px;align-self:stretch;color:#333;font-family:Rubik,sans-serif;font-size:.75rem;font-style:normal;font-weight:400;line-height:16px;letter-spacing:.24px}.right-data{display:flex;align-items:center;gap:40px}.right-data .title{display:flex;align-items:center;gap:10px;color:#8c8c8c;font-family:Rubik,sans-serif;font-size:.75rem;font-style:normal;font-weight:400;line-height:16px;letter-spacing:.24px;align-self:start}.right-data .data{display:flex;align-items:center;gap:10px;align-self:stretch;color:#333;font-family:Rubik,sans-serif;font-size:.75rem;font-style:normal;font-weight:400;line-height:16px;letter-spacing:.24px}.right-data p{margin:0}.right-data .buttons{display:flex;justify-content:flex-end;align-items:center;gap:8px}.right-data .btn{display:flex;width:40px;height:40px;padding:8px;justify-content:center;align-items:center;gap:4px;aspect-ratio:1/1;border-radius:8px;background:#fff}.dropdown{position:absolute;top:calc(100% + 8px);right:0;z-index:9999;min-width:max-content;white-space:nowrap}.options{display:flex;align-items:center;position:relative}.container-active{display:flex;align-items:center;gap:10px;align-self:stretch}.container-active p{color:#7caf25;font-family:Rubik,sans-serif;font-size:.875rem;font-style:normal;font-weight:400;line-height:20px;letter-spacing:.28px}\n"], dependencies: [{ kind: "component", type: ButtonSquaredTertiaryComponent, selector: "ius-button-squared-tertiary", inputs: ["disabled", "iconName"], outputs: ["buttonClicked"] }, { kind: "component", type: IconSmComponent, selector: "ius-icon-sm", inputs: ["iconName", "color"] }] }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "17.3.12", type: CardPlanSubscriptionComponent, isStandalone: true, selector: "ius-card-plan-subscription", inputs: { planType: "planType", name: "name", role: "role", label1: "label1", data1: "data1", label2: "label2", data2: "data2", planID: "planID", titleDate: "titleDate", date: "date", iconName: "iconName", iconColor: "iconColor" }, outputs: { onClickCard: "onClickCard" }, ngImport: i0, template: "<div class=\"general-container\">\r\n  <div\r\n    class=\"container-card\"\r\n    (mouseenter)=\"onMouseEnter()\"\r\n    (mouseleave)=\"onMouseLeave()\"\r\n    (click)=\"clickCard($event)\"\r\n  >\r\n    <div class=\"data\">\r\n      <div class=\"left-data\">\r\n        <div class=\"image-container\">\r\n          <ius-icon-sm [color]=\"iconColor\" [iconName]=\"iconName\"></ius-icon-sm>\r\n        </div>\r\n        <div class=\"data-container\">\r\n          <div class=\"data-container-interno\">\r\n            <p class=\"state\">\r\n              {{ planType }}\r\n            </p>\r\n            <p class=\"name\">{{ name }}</p>\r\n            <div class=\"container\">\r\n              <div class=\"data-container\">\r\n                <p class=\"title\">{{ label1 }}</p>\r\n                <p class=\"data\">{{ data1 }}</p>\r\n              </div>\r\n\r\n              <div class=\"data-container\">\r\n                <p class=\"title\">{{ label2 }}</p>\r\n                <p class=\"data\">{{ data2 }}</p>\r\n              </div>\r\n            </div>\r\n            <div class=\"container-active\">\r\n              <p>Activo</p>\r\n            </div>\r\n          </div>\r\n        </div>\r\n      </div>\r\n      <div class=\"right-data\">\r\n        @if (!hover) {\r\n          <div>\r\n            <p class=\"title\">{{ titleDate }}</p>\r\n            <p class=\"data\">{{ date }}</p>\r\n          </div>\r\n        }\r\n        @if (hover) {\r\n          <div class=\"buttons\">\r\n            <div>\r\n              <span class=\"data\">Asigna tus cupos</span>\r\n            </div>\r\n            <div>\r\n              <ius-button-squared-tertiary\r\n                iconName=\"icon-discover-tune\"\r\n                (buttonClicked)=\"clickCard($event)\"\r\n              ></ius-button-squared-tertiary>\r\n            </div>\r\n          </div>\r\n        }\r\n        <div class=\"btn\">\r\n          <ius-button-squared-tertiary\r\n            iconName=\"icon-keyboard-arrow-right\"\r\n            (buttonClicked)=\"clickCard($event)\"\r\n          ></ius-button-squared-tertiary>\r\n        </div>\r\n      </div>\r\n    </div>\r\n  </div>\r\n</div>\r\n", styles: [".h1{font-family:Roboto,sans-serif;font-size:2.375rem;font-weight:500;line-height:46px}.h2{font-family:Roboto,sans-serif;font-size:1.875rem;font-weight:700;line-height:38px}.h3{font-family:Roboto,sans-serif;font-size:1.5rem;font-weight:500;line-height:32px}.h4{font-family:Roboto,sans-serif;font-size:1.25rem;font-weight:700;line-height:26px}.h5{font-family:Roboto,sans-serif;font-size:1.125rem;font-weight:500;line-height:24px;letter-spacing:.18px}.label-large{font-family:Roboto,sans-serif;font-size:1rem;font-weight:500;line-height:22px}.body-large{font-family:Rubik,sans-serif;font-size:1rem;font-weight:400;line-height:22px}.label-base{font-family:Rubik,sans-serif;font-size:.875rem;font-weight:500;line-height:20px;letter-spacing:.28px}.body-base{font-family:Rubik,sans-serif;font-size:.875rem;font-weight:400;line-height:20px;font-style:italic;letter-spacing:.28px}.body-base-1,.body-base-1-1{font-family:Rubik,sans-serif;font-size:.875rem;font-weight:400;line-height:20px;letter-spacing:.28px}.body-sm{font-family:Rubik,sans-serif;font-size:.75rem;font-weight:400;line-height:16px;letter-spacing:.28px}.body-sm-italic{font-family:Rubik,sans-serif;font-size:.75rem;font-weight:400;line-height:16px;font-style:italic;letter-spacing:.28px}.caption-sm{font-family:Rubik,sans-serif;font-size:.75rem;font-weight:500;line-height:16px;letter-spacing:.28px}.caption-sm-italic{font-family:Rubik,sans-serif;font-size:.75rem;font-weight:500;line-height:16px;font-style:italic;letter-spacing:.28px}.general-container{position:relative}.container-card{display:flex;padding:8px 16px;align-items:center;align-content:center;gap:12px;flex-wrap:wrap;border-radius:8px;border:1px solid #eaeaea;background:#fff}.container-card:hover{cursor:pointer;box-shadow:0 1px 3px #0000001f,0 1px 2px #00000014}.data{display:flex;align-items:center;gap:40px;flex:1 0 0}.left-data{display:flex;min-width:280px;align-items:center;gap:8px;flex:1 0 0}.left-data .container-icon-letra{background-color:#dfe0ff;display:flex;width:20px;height:20px;padding:10px;margin-right:10px;justify-content:center;align-items:center;border-radius:100px;font-family:Rubik,sans-serif;font-size:.75rem;font-style:normal;font-weight:400;line-height:16px;letter-spacing:.24px}.left-data .container-icon-letra:hover{background-color:#6670c4!important}.left-data .container-icon-letra:hover>span{display:none}.left-data .container-icon-letra:hover .icon-letra-edit{display:block}.left-data .container-icon-letra span{color:#1b2678;text-align:center;font-size:18px;font-weight:500}.left-data .image-container{display:flex;align-items:center;gap:8px;border-radius:100px;border:.5px solid #f5f5f5;background:#c4dfff;width:32px;height:32px;justify-content:center;aspect-ratio:1/1}.left-data .data-container{display:flex;align-items:center;gap:4px}.left-data .data-container p{margin:0}.left-data .data-container .name{display:flex;align-items:center;gap:10px;color:#333;font-family:Roboto,sans-serif;font-size:1rem;font-style:normal;font-weight:500;line-height:22px}.left-data .data-container .state{display:flex;align-items:center;gap:10px;align-self:stretch;color:#595959;font-family:Rubik,sans-serif;font-size:.75rem;font-style:normal;font-weight:400;line-height:16px;letter-spacing:.24px}.left-data .data-container .role{display:flex;align-items:center;gap:10px;align-self:stretch;color:#8c8c8c;font-family:Rubik,sans-serif;font-size:.875rem;font-style:normal;font-weight:400;line-height:20px;letter-spacing:.28px}.left-data .container{display:flex;align-items:flex-start;gap:8px}.left-data .container .data-container{display:flex;align-items:center;gap:4px}.left-data .container .data-container .title{display:flex;align-items:center;gap:10px;color:#8c8c8c;font-family:Rubik,sans-serif;font-size:.75rem;font-style:normal;font-weight:400;line-height:16px;letter-spacing:.24px;align-self:start}.left-data .container .data-container .data{display:flex;align-items:center;gap:10px;align-self:stretch;color:#333;font-family:Rubik,sans-serif;font-size:.75rem;font-style:normal;font-weight:400;line-height:16px;letter-spacing:.24px}.right-data{display:flex;align-items:center;gap:40px}.right-data .title{display:flex;align-items:center;gap:10px;color:#8c8c8c;font-family:Rubik,sans-serif;font-size:.75rem;font-style:normal;font-weight:400;line-height:16px;letter-spacing:.24px;align-self:start}.right-data .data{display:flex;align-items:center;gap:10px;align-self:stretch;color:#333;font-family:Rubik,sans-serif;font-size:.75rem;font-style:normal;font-weight:400;line-height:16px;letter-spacing:.24px}.right-data p{margin:0}.right-data .buttons{display:flex;justify-content:flex-end;align-items:center;gap:8px}.right-data .btn{display:flex;width:40px;height:40px;padding:8px;justify-content:center;align-items:center;gap:4px;aspect-ratio:1/1;border-radius:8px;background:#fff}.dropdown{position:absolute;top:calc(100% + 8px);right:0;z-index:9999;min-width:max-content;white-space:nowrap}.options{display:flex;align-items:center;position:relative}.container-active{display:flex;align-items:center;gap:10px;align-self:stretch}.container-active p{color:#7caf25;font-family:Rubik,sans-serif;font-size:.875rem;font-style:normal;font-weight:400;line-height:20px;letter-spacing:.28px}\n"], dependencies: [{ kind: "component", type: ButtonSquaredTertiaryComponent, selector: "ius-button-squared-tertiary", inputs: ["disabled", "iconName"], outputs: ["buttonClicked"] }, { kind: "component", type: IconSmComponent, selector: "ius-icon-sm", inputs: ["iconName", "color"] }] }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: CardPlanSubscriptionComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'ius-card-plan-subscription', standalone: true, imports: [ButtonSquaredTertiaryComponent, IconSmComponent], template: "<div class=\"general-container\">\r\n    <div class=\"container-card\" (mouseenter)=\"onMouseEnter()\" (mouseleave)=\"onMouseLeave()\" (click)=\"clickCard($event)\">\r\n        <div class=\"data\">\r\n            <div class=\"left-data\">\r\n                <div class=\"image-container\">\r\n                    <ius-icon-sm [color]=\"iconColor\" [iconName]=\"iconName\"></ius-icon-sm>\r\n                </div>\r\n                <div class=\"data-container\">\r\n                    <div class=\"data-container-interno\">\r\n                        <p class=\"state\">\r\n                            {{ planType }}\r\n                        </p>\r\n                        <p class=\"name\">{{ name }}</p>\r\n                        <div class=\"container\">\r\n                            <div class=\"data-container\">\r\n                                <p class=\"title\">{{ label1 }}</p>\r\n                                <p class=\"data\">{{ data1 }}</p>\r\n                            </div>\r\n                            <div class=\"data-container\">\r\n                                <p class=\"title\">{{ label2 }}</p>\r\n                                <p class=\"data\">{{ data2 }}</p>\r\n                            </div>\r\n\r\n                        </div>\r\n                        <div class=\"container-active\">\r\n                            <p>Activo</p>\r\n                        </div>\r\n                    </div>\r\n                </div>\r\n            </div>\r\n            <div class=\"right-data\">\r\n                <div>\r\n                    <p class=\"title\">{{ titleDate }}</p>\r\n                    <p class=\"data\">{{ date }}</p>\r\n                </div>\r\n                @if (hover) {\r\n                <div class=\"buttons\">\r\n                    <div>\r\n                        <span class=\"data\">Asigna tus cupos</span>\r\n                    </div>\r\n                    <div>\r\n                        <ius-button-squared-tertiary iconName=\"icon-discover-tune\"\r\n                            (buttonClicked)=\"clickCard($event)\"></ius-button-squared-tertiary>\r\n                    </div>\r\n                </div>\r\n                }\r\n                <div class=\"btn\">\r\n                    <ius-button-squared-tertiary iconName=\"icon-keyboard-arrow-right\"\r\n                        (buttonClicked)=\"clickCard($event)\"></ius-button-squared-tertiary>\r\n                </div>\r\n            </div>\r\n        </div>\r\n    </div>\r\n</div>", styles: [".h1{font-family:Roboto,sans-serif;font-size:2.375rem;font-weight:500;line-height:46px}.h2{font-family:Roboto,sans-serif;font-size:1.875rem;font-weight:700;line-height:38px}.h3{font-family:Roboto,sans-serif;font-size:1.5rem;font-weight:500;line-height:32px}.h4{font-family:Roboto,sans-serif;font-size:1.25rem;font-weight:700;line-height:26px}.h5{font-family:Roboto,sans-serif;font-size:1.125rem;font-weight:500;line-height:24px;letter-spacing:.18px}.label-large{font-family:Roboto,sans-serif;font-size:1rem;font-weight:500;line-height:22px}.body-large{font-family:Rubik,sans-serif;font-size:1rem;font-weight:400;line-height:22px}.label-base{font-family:Rubik,sans-serif;font-size:.875rem;font-weight:500;line-height:20px;letter-spacing:.28px}.body-base{font-family:Rubik,sans-serif;font-size:.875rem;font-weight:400;line-height:20px;font-style:italic;letter-spacing:.28px}.body-base-1,.body-base-1-1{font-family:Rubik,sans-serif;font-size:.875rem;font-weight:400;line-height:20px;letter-spacing:.28px}.body-sm{font-family:Rubik,sans-serif;font-size:.75rem;font-weight:400;line-height:16px;letter-spacing:.28px}.body-sm-italic{font-family:Rubik,sans-serif;font-size:.75rem;font-weight:400;line-height:16px;font-style:italic;letter-spacing:.28px}.caption-sm{font-family:Rubik,sans-serif;font-size:.75rem;font-weight:500;line-height:16px;letter-spacing:.28px}.caption-sm-italic{font-family:Rubik,sans-serif;font-size:.75rem;font-weight:500;line-height:16px;font-style:italic;letter-spacing:.28px}.general-container{position:relative}.container-card{display:flex;padding:8px 16px;align-items:center;align-content:center;gap:12px;flex-wrap:wrap;border-radius:8px;border:1px solid #eaeaea;background:#fff}.container-card :hover{cursor:pointer}.data{display:flex;align-items:center;gap:40px;flex:1 0 0}.left-data{display:flex;min-width:280px;align-items:center;gap:8px;flex:1 0 0}.left-data .container-icon-letra{background-color:#dfe0ff;display:flex;width:20px;height:20px;padding:10px;margin-right:10px;justify-content:center;align-items:center;border-radius:100px;font-family:Rubik,sans-serif;font-size:.75rem;font-style:normal;font-weight:400;line-height:16px;letter-spacing:.24px}.left-data .container-icon-letra:hover{background-color:#6670c4!important}.left-data .container-icon-letra:hover>span{display:none}.left-data .container-icon-letra:hover .icon-letra-edit{display:block}.left-data .container-icon-letra span{color:#1b2678;text-align:center;font-size:18px;font-weight:500}.left-data .image-container{display:flex;align-items:center;gap:8px;border-radius:100px;border:.5px solid #f5f5f5;background:#c4dfff;width:32px;height:32px;justify-content:center;aspect-ratio:1/1}.left-data .data-container{display:flex;align-items:center;gap:4px}.left-data .data-container p{margin:0}.left-data .data-container .name{display:flex;align-items:center;gap:10px;color:#333;font-family:Roboto,sans-serif;font-size:1rem;font-style:normal;font-weight:500;line-height:22px}.left-data .data-container .state{display:flex;align-items:center;gap:10px;align-self:stretch;color:#595959;font-family:Rubik,sans-serif;font-size:.75rem;font-style:normal;font-weight:400;line-height:16px;letter-spacing:.24px}.left-data .data-container .role{display:flex;align-items:center;gap:10px;align-self:stretch;color:#8c8c8c;font-family:Rubik,sans-serif;font-size:.875rem;font-style:normal;font-weight:400;line-height:20px;letter-spacing:.28px}.left-data .container{display:flex;align-items:flex-start;gap:8px}.left-data .container .data-container{display:flex;align-items:center;gap:4px}.left-data .container .data-container .title{display:flex;align-items:center;gap:10px;color:#8c8c8c;font-family:Rubik,sans-serif;font-size:.75rem;font-style:normal;font-weight:400;line-height:16px;letter-spacing:.24px;align-self:start}.left-data .container .data-container .data{display:flex;align-items:center;gap:10px;align-self:stretch;color:#333;font-family:Rubik,sans-serif;font-size:.75rem;font-style:normal;font-weight:400;line-height:16px;letter-spacing:.24px}.right-data{display:flex;align-items:center;gap:40px}.right-data .title{display:flex;align-items:center;gap:10px;color:#8c8c8c;font-family:Rubik,sans-serif;font-size:.75rem;font-style:normal;font-weight:400;line-height:16px;letter-spacing:.24px;align-self:start}.right-data .data{display:flex;align-items:center;gap:10px;align-self:stretch;color:#333;font-family:Rubik,sans-serif;font-size:.75rem;font-style:normal;font-weight:400;line-height:16px;letter-spacing:.24px}.right-data p{margin:0}.right-data .buttons{display:flex;justify-content:flex-end;align-items:center;gap:8px}.right-data .btn{display:flex;width:40px;height:40px;padding:8px;justify-content:center;align-items:center;gap:4px;aspect-ratio:1/1;border-radius:8px;background:#fff}.dropdown{position:absolute;top:calc(100% + 8px);right:0;z-index:9999;min-width:max-content;white-space:nowrap}.options{display:flex;align-items:center;position:relative}.container-active{display:flex;align-items:center;gap:10px;align-self:stretch}.container-active p{color:#7caf25;font-family:Rubik,sans-serif;font-size:.875rem;font-style:normal;font-weight:400;line-height:20px;letter-spacing:.28px}\n"] }]
+            args: [{ selector: 'ius-card-plan-subscription', standalone: true, imports: [ButtonSquaredTertiaryComponent, IconSmComponent], template: "<div class=\"general-container\">\r\n  <div\r\n    class=\"container-card\"\r\n    (mouseenter)=\"onMouseEnter()\"\r\n    (mouseleave)=\"onMouseLeave()\"\r\n    (click)=\"clickCard($event)\"\r\n  >\r\n    <div class=\"data\">\r\n      <div class=\"left-data\">\r\n        <div class=\"image-container\">\r\n          <ius-icon-sm [color]=\"iconColor\" [iconName]=\"iconName\"></ius-icon-sm>\r\n        </div>\r\n        <div class=\"data-container\">\r\n          <div class=\"data-container-interno\">\r\n            <p class=\"state\">\r\n              {{ planType }}\r\n            </p>\r\n            <p class=\"name\">{{ name }}</p>\r\n            <div class=\"container\">\r\n              <div class=\"data-container\">\r\n                <p class=\"title\">{{ label1 }}</p>\r\n                <p class=\"data\">{{ data1 }}</p>\r\n              </div>\r\n\r\n              <div class=\"data-container\">\r\n                <p class=\"title\">{{ label2 }}</p>\r\n                <p class=\"data\">{{ data2 }}</p>\r\n              </div>\r\n            </div>\r\n            <div class=\"container-active\">\r\n              <p>Activo</p>\r\n            </div>\r\n          </div>\r\n        </div>\r\n      </div>\r\n      <div class=\"right-data\">\r\n        @if (!hover) {\r\n          <div>\r\n            <p class=\"title\">{{ titleDate }}</p>\r\n            <p class=\"data\">{{ date }}</p>\r\n          </div>\r\n        }\r\n        @if (hover) {\r\n          <div class=\"buttons\">\r\n            <div>\r\n              <span class=\"data\">Asigna tus cupos</span>\r\n            </div>\r\n            <div>\r\n              <ius-button-squared-tertiary\r\n                iconName=\"icon-discover-tune\"\r\n                (buttonClicked)=\"clickCard($event)\"\r\n              ></ius-button-squared-tertiary>\r\n            </div>\r\n          </div>\r\n        }\r\n        <div class=\"btn\">\r\n          <ius-button-squared-tertiary\r\n            iconName=\"icon-keyboard-arrow-right\"\r\n            (buttonClicked)=\"clickCard($event)\"\r\n          ></ius-button-squared-tertiary>\r\n        </div>\r\n      </div>\r\n    </div>\r\n  </div>\r\n</div>\r\n", styles: [".h1{font-family:Roboto,sans-serif;font-size:2.375rem;font-weight:500;line-height:46px}.h2{font-family:Roboto,sans-serif;font-size:1.875rem;font-weight:700;line-height:38px}.h3{font-family:Roboto,sans-serif;font-size:1.5rem;font-weight:500;line-height:32px}.h4{font-family:Roboto,sans-serif;font-size:1.25rem;font-weight:700;line-height:26px}.h5{font-family:Roboto,sans-serif;font-size:1.125rem;font-weight:500;line-height:24px;letter-spacing:.18px}.label-large{font-family:Roboto,sans-serif;font-size:1rem;font-weight:500;line-height:22px}.body-large{font-family:Rubik,sans-serif;font-size:1rem;font-weight:400;line-height:22px}.label-base{font-family:Rubik,sans-serif;font-size:.875rem;font-weight:500;line-height:20px;letter-spacing:.28px}.body-base{font-family:Rubik,sans-serif;font-size:.875rem;font-weight:400;line-height:20px;font-style:italic;letter-spacing:.28px}.body-base-1,.body-base-1-1{font-family:Rubik,sans-serif;font-size:.875rem;font-weight:400;line-height:20px;letter-spacing:.28px}.body-sm{font-family:Rubik,sans-serif;font-size:.75rem;font-weight:400;line-height:16px;letter-spacing:.28px}.body-sm-italic{font-family:Rubik,sans-serif;font-size:.75rem;font-weight:400;line-height:16px;font-style:italic;letter-spacing:.28px}.caption-sm{font-family:Rubik,sans-serif;font-size:.75rem;font-weight:500;line-height:16px;letter-spacing:.28px}.caption-sm-italic{font-family:Rubik,sans-serif;font-size:.75rem;font-weight:500;line-height:16px;font-style:italic;letter-spacing:.28px}.general-container{position:relative}.container-card{display:flex;padding:8px 16px;align-items:center;align-content:center;gap:12px;flex-wrap:wrap;border-radius:8px;border:1px solid #eaeaea;background:#fff}.container-card:hover{cursor:pointer;box-shadow:0 1px 3px #0000001f,0 1px 2px #00000014}.data{display:flex;align-items:center;gap:40px;flex:1 0 0}.left-data{display:flex;min-width:280px;align-items:center;gap:8px;flex:1 0 0}.left-data .container-icon-letra{background-color:#dfe0ff;display:flex;width:20px;height:20px;padding:10px;margin-right:10px;justify-content:center;align-items:center;border-radius:100px;font-family:Rubik,sans-serif;font-size:.75rem;font-style:normal;font-weight:400;line-height:16px;letter-spacing:.24px}.left-data .container-icon-letra:hover{background-color:#6670c4!important}.left-data .container-icon-letra:hover>span{display:none}.left-data .container-icon-letra:hover .icon-letra-edit{display:block}.left-data .container-icon-letra span{color:#1b2678;text-align:center;font-size:18px;font-weight:500}.left-data .image-container{display:flex;align-items:center;gap:8px;border-radius:100px;border:.5px solid #f5f5f5;background:#c4dfff;width:32px;height:32px;justify-content:center;aspect-ratio:1/1}.left-data .data-container{display:flex;align-items:center;gap:4px}.left-data .data-container p{margin:0}.left-data .data-container .name{display:flex;align-items:center;gap:10px;color:#333;font-family:Roboto,sans-serif;font-size:1rem;font-style:normal;font-weight:500;line-height:22px}.left-data .data-container .state{display:flex;align-items:center;gap:10px;align-self:stretch;color:#595959;font-family:Rubik,sans-serif;font-size:.75rem;font-style:normal;font-weight:400;line-height:16px;letter-spacing:.24px}.left-data .data-container .role{display:flex;align-items:center;gap:10px;align-self:stretch;color:#8c8c8c;font-family:Rubik,sans-serif;font-size:.875rem;font-style:normal;font-weight:400;line-height:20px;letter-spacing:.28px}.left-data .container{display:flex;align-items:flex-start;gap:8px}.left-data .container .data-container{display:flex;align-items:center;gap:4px}.left-data .container .data-container .title{display:flex;align-items:center;gap:10px;color:#8c8c8c;font-family:Rubik,sans-serif;font-size:.75rem;font-style:normal;font-weight:400;line-height:16px;letter-spacing:.24px;align-self:start}.left-data .container .data-container .data{display:flex;align-items:center;gap:10px;align-self:stretch;color:#333;font-family:Rubik,sans-serif;font-size:.75rem;font-style:normal;font-weight:400;line-height:16px;letter-spacing:.24px}.right-data{display:flex;align-items:center;gap:40px}.right-data .title{display:flex;align-items:center;gap:10px;color:#8c8c8c;font-family:Rubik,sans-serif;font-size:.75rem;font-style:normal;font-weight:400;line-height:16px;letter-spacing:.24px;align-self:start}.right-data .data{display:flex;align-items:center;gap:10px;align-self:stretch;color:#333;font-family:Rubik,sans-serif;font-size:.75rem;font-style:normal;font-weight:400;line-height:16px;letter-spacing:.24px}.right-data p{margin:0}.right-data .buttons{display:flex;justify-content:flex-end;align-items:center;gap:8px}.right-data .btn{display:flex;width:40px;height:40px;padding:8px;justify-content:center;align-items:center;gap:4px;aspect-ratio:1/1;border-radius:8px;background:#fff}.dropdown{position:absolute;top:calc(100% + 8px);right:0;z-index:9999;min-width:max-content;white-space:nowrap}.options{display:flex;align-items:center;position:relative}.container-active{display:flex;align-items:center;gap:10px;align-self:stretch}.container-active p{color:#7caf25;font-family:Rubik,sans-serif;font-size:.875rem;font-style:normal;font-weight:400;line-height:20px;letter-spacing:.28px}\n"] }]
         }], propDecorators: { planType: [{
                 type: Input
             }], name: [{
@@ -6537,11 +6541,11 @@ class InputLargeComponent {
         event.preventDefault();
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: InputLargeComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "17.3.12", type: InputLargeComponent, isStandalone: true, selector: "ius-input-large", inputs: { textInput: "textInput", required: "required", disabled: "disabled", showHelpText: "showHelpText", rows: "rows", error: "error", labelSuperior: "labelSuperior", labelInferior: "labelInferior", errorText: "errorText", labelInput: "labelInput", maxlenght: "maxlenght", initialText: "initialText" }, outputs: { onChangesValueEvent: "onChangesValueEvent", onEnterKey: "onEnterKey", onBlurEvent: "onBlurEvent" }, ngImport: i0, template: "<div class=\"container-general\">\r\n  @if (labelSuperior) {\r\n  <div\r\n    class=\"container-label-sup\"\r\n    [ngClass]=\"{\r\n      disabled: disabled\r\n    }\"\r\n  >\r\n    @if(!disabled && required){\r\n    <div class=\"icon-dot\"></div>\r\n    }\r\n    <span class=\"\">{{ labelSuperior }}</span>\r\n    @if(!disabled && showHelpText){\r\n    <ius-icon-md iconName=\"icon-help\" class=\"icon-color-help\"></ius-icon-md>\r\n    }\r\n    <span>:</span>\r\n  </div>\r\n  }\r\n  <div\r\n    class=\"container-textfield\"\r\n    [ngClass]=\"{\r\n      disabled: disabled,\r\n      focused: isFocused,\r\n      alert: (!isFocused && isAlertText && !disabled) || (error && !disabled)\r\n    }\"\r\n  >\r\n    <textarea class=\"scrollable-area\"\r\n      [(ngModel)]=\"textInput\"\r\n      [placeholder]=\"labelInput\"\r\n      [disabled]=\"disabled\"\r\n      [rows]=\"rows\"\r\n      [maxlength]=\"maxlenght ?? null\"\r\n      (input)=\"onInput()\"\r\n      (focus)=\"onFocus()\"\r\n      (blur)=\"onBlur()\"\r\n      (keypress)=\"onKeyPress($event)\"\r\n      (drop)=\"onDropBlock($event)\"\r\n      (dragover)=\"onDragOverBlock($event)\"\r\n    ></textarea>\r\n  </div>\r\n  @if (labelInferior && isFocused && !error) {\r\n  <span class=\"label-inf\">{{ labelInferior }}</span>\r\n  } @if ((errorText || labelInferior) && ((!isFocused && isAlertText && !disabled) || (error && !disabled))) {\r\n  <span class=\"label-inf alert\">{{ errorText ?? labelInferior }}</span>\r\n  }\r\n</div>\r\n", styles: [".h1{font-family:Roboto,sans-serif;font-size:2.375rem;font-weight:500;line-height:46px}.h2{font-family:Roboto,sans-serif;font-size:1.875rem;font-weight:700;line-height:38px}.h3{font-family:Roboto,sans-serif;font-size:1.5rem;font-weight:500;line-height:32px}.h4{font-family:Roboto,sans-serif;font-size:1.25rem;font-weight:700;line-height:26px}.h5{font-family:Roboto,sans-serif;font-size:1.125rem;font-weight:500;line-height:24px;letter-spacing:.18px}.label-large{font-family:Roboto,sans-serif;font-size:1rem;font-weight:500;line-height:22px}.body-large{font-family:Rubik,sans-serif;font-size:1rem;font-weight:400;line-height:22px}.label-base{font-family:Rubik,sans-serif;font-size:.875rem;font-weight:500;line-height:20px;letter-spacing:.28px}.body-base{font-family:Rubik,sans-serif;font-size:.875rem;font-weight:400;line-height:20px;font-style:italic;letter-spacing:.28px}.body-base-1,.body-base-1-1{font-family:Rubik,sans-serif;font-size:.875rem;font-weight:400;line-height:20px;letter-spacing:.28px}.body-sm{font-family:Rubik,sans-serif;font-size:.75rem;font-weight:400;line-height:16px;letter-spacing:.28px}.body-sm-italic{font-family:Rubik,sans-serif;font-size:.75rem;font-weight:400;line-height:16px;font-style:italic;letter-spacing:.28px}.caption-sm{font-family:Rubik,sans-serif;font-size:.75rem;font-weight:500;line-height:16px;letter-spacing:.28px}.caption-sm-italic{font-family:Rubik,sans-serif;font-size:.75rem;font-weight:500;line-height:16px;font-style:italic;letter-spacing:.28px}.container-general{position:relative;height:100%}.container-textfield{display:flex;padding:10px 12px;justify-content:flex-start;align-items:flex-start;gap:4px;border:1px solid #f5f5f5;border-radius:8px;background:#f5f5f5;font-family:Rubik,sans-serif;font-size:.875rem;font-weight:400;line-height:20px;letter-spacing:.28px;transition:all .2s ease-in-out}.container-textfield:hover:not(.disabled):not(.focused):not(.alert){background:#edf6ff}.container-textfield.focused{border:1px solid #0581BC;background:#edf6ff}.container-textfield.disabled{background:#f5f5f5}.container-textfield.disabled textarea{color:#bfbfbf}.container-textfield.disabled textarea::placeholder{color:#bfbfbf;opacity:1}.container-textfield.alert{border:1px solid #DB2E2A;background:#fff4f0}textarea{display:flex;flex:1 0 0;border:none;outline:none;background-color:transparent;font-family:Rubik,sans-serif;font-size:.875rem;font-weight:400;line-height:20px;letter-spacing:.28px;resize:vertical;padding:5px 0;overflow-y:auto;color:#333}textarea::placeholder{color:#8c8c8c}.scrollable-area{overflow:auto}.scrollable-area::-webkit-scrollbar-thumb:hover{background-color:#bfbfbf}.scrollable-area::-webkit-scrollbar-thumb:active{background-color:#8c8c8c}.scrollable-area::-webkit-scrollbar{-webkit-appearance:none}.scrollable-area::-webkit-scrollbar:vertical{width:7px}.scrollable-area::-webkit-scrollbar-thumb{background-color:#d8d6d6;border-radius:20px}.container-label-sup{display:flex;align-items:center;gap:4px;margin-bottom:8px;color:#333;font-family:Roboto,sans-serif;font-size:.875rem;font-weight:500;line-height:20px;letter-spacing:.28px}.container-label-sup.disabled{color:#bfbfbf}.icon-dot{display:flex;align-items:center;width:4px;height:4px;aspect-ratio:1/1;background-color:#db2e2a;border-radius:100px}.icon-color-help{color:#8c8c8c}.label-inf{display:flex;position:absolute;margin-top:4px;color:#595959;font-family:Roboto,sans-serif;font-size:.75rem;font-style:italic;font-weight:500;line-height:16px;letter-spacing:.24px}.label-inf.alert{color:#931224}\n"], dependencies: [{ kind: "component", type: IconMdComponent, selector: "ius-icon-md", inputs: ["iconName", "color"] }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1$3.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$3.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$3.MaxLengthValidator, selector: "[maxlength][formControlName],[maxlength][formControl],[maxlength][ngModel]", inputs: ["maxlength"] }, { kind: "directive", type: i1$3.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1$1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }] }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "17.3.12", type: InputLargeComponent, isStandalone: true, selector: "ius-input-large", inputs: { textInput: "textInput", required: "required", disabled: "disabled", showHelpText: "showHelpText", rows: "rows", error: "error", labelSuperior: "labelSuperior", labelInferior: "labelInferior", errorText: "errorText", labelInput: "labelInput", maxlenght: "maxlenght", initialText: "initialText" }, outputs: { onChangesValueEvent: "onChangesValueEvent", onEnterKey: "onEnterKey", onBlurEvent: "onBlurEvent" }, ngImport: i0, template: "<div class=\"container-general\">\r\n  @if (labelSuperior) {\r\n  <div\r\n    class=\"container-label-sup\"\r\n    [ngClass]=\"{\r\n      disabled: disabled\r\n    }\"\r\n  >\r\n    @if(!disabled && required){\r\n    <div class=\"icon-dot\"></div>\r\n    }\r\n    <span class=\"\">{{ labelSuperior }}</span>\r\n    @if(!disabled && showHelpText){\r\n    <ius-icon-md iconName=\"icon-help\" class=\"icon-color-help\"></ius-icon-md>\r\n    }\r\n    <span>:</span>\r\n  </div>\r\n  }\r\n  <div\r\n    class=\"container-textfield\"\r\n    [ngClass]=\"{\r\n      disabled: disabled,\r\n      focused: isFocused,\r\n      alert: (!isFocused && isAlertText && !disabled) || (error && !disabled)\r\n    }\"\r\n  >\r\n    <textarea class=\"scrollable-area\"\r\n      [(ngModel)]=\"textInput\"\r\n      [placeholder]=\"labelInput\"\r\n      [disabled]=\"disabled\"\r\n      [rows]=\"rows\"\r\n      [maxlength]=\"maxlenght ?? null\"\r\n      (input)=\"onInput()\"\r\n      (focus)=\"onFocus()\"\r\n      (blur)=\"onBlur()\"\r\n      (keypress)=\"onKeyPress($event)\"\r\n      (drop)=\"onDropBlock($event)\"\r\n      (dragover)=\"onDragOverBlock($event)\"\r\n    ></textarea>\r\n  </div>\r\n  @if (labelInferior && isFocused && !error) {\r\n  <span class=\"label-inf\">{{ labelInferior }}</span>\r\n  } @if ((errorText || labelInferior) && ((!isFocused && isAlertText && !disabled) || (error && !disabled))) {\r\n  <span class=\"label-inf alert\">{{ errorText ?? labelInferior }}</span>\r\n  }\r\n</div>\r\n", styles: [".h1{font-family:Roboto,sans-serif;font-size:2.375rem;font-weight:500;line-height:46px}.h2{font-family:Roboto,sans-serif;font-size:1.875rem;font-weight:700;line-height:38px}.h3{font-family:Roboto,sans-serif;font-size:1.5rem;font-weight:500;line-height:32px}.h4{font-family:Roboto,sans-serif;font-size:1.25rem;font-weight:700;line-height:26px}.h5{font-family:Roboto,sans-serif;font-size:1.125rem;font-weight:500;line-height:24px;letter-spacing:.18px}.label-large{font-family:Roboto,sans-serif;font-size:1rem;font-weight:500;line-height:22px}.body-large{font-family:Rubik,sans-serif;font-size:1rem;font-weight:400;line-height:22px}.label-base{font-family:Rubik,sans-serif;font-size:.875rem;font-weight:500;line-height:20px;letter-spacing:.28px}.body-base{font-family:Rubik,sans-serif;font-size:.875rem;font-weight:400;line-height:20px;font-style:italic;letter-spacing:.28px}.body-base-1,.body-base-1-1{font-family:Rubik,sans-serif;font-size:.875rem;font-weight:400;line-height:20px;letter-spacing:.28px}.body-sm{font-family:Rubik,sans-serif;font-size:.75rem;font-weight:400;line-height:16px;letter-spacing:.28px}.body-sm-italic{font-family:Rubik,sans-serif;font-size:.75rem;font-weight:400;line-height:16px;font-style:italic;letter-spacing:.28px}.caption-sm{font-family:Rubik,sans-serif;font-size:.75rem;font-weight:500;line-height:16px;letter-spacing:.28px}.caption-sm-italic{font-family:Rubik,sans-serif;font-size:.75rem;font-weight:500;line-height:16px;font-style:italic;letter-spacing:.28px}.container-general{position:relative;height:100%}.container-textfield{display:flex;padding:10px 12px;justify-content:flex-start;align-items:flex-start;gap:4px;border:1px solid #f5f5f5;border-radius:8px;background:#f5f5f5;font-family:Rubik,sans-serif;font-size:.875rem;font-weight:400;line-height:20px;letter-spacing:.28px;transition:all .2s ease-in-out}.container-textfield:hover:not(.disabled):not(.focused):not(.alert){background:#edf6ff}.container-textfield.focused{border:1px solid #0581BC;background:#edf6ff}.container-textfield.disabled{background:#f5f5f5}.container-textfield.disabled textarea{color:#bfbfbf}.container-textfield.disabled textarea::placeholder{color:#bfbfbf;opacity:1}.container-textfield.alert{border:1px solid #DB2E2A;background:#fff4f0}textarea{display:flex;flex:1 0 0;border:none;outline:none;background-color:transparent;font-family:Rubik,sans-serif;font-size:.875rem;font-weight:400;line-height:20px;letter-spacing:.28px;resize:vertical;padding:5px 0;overflow-y:auto;color:#333}textarea::placeholder{color:#8c8c8c}.scrollable-area{overflow:auto}.scrollable-area::-webkit-scrollbar-thumb:hover{background-color:#bfbfbf}.scrollable-area::-webkit-scrollbar-thumb:active{background-color:#8c8c8c}.scrollable-area::-webkit-scrollbar{-webkit-appearance:none}.scrollable-area::-webkit-scrollbar:vertical{width:7px}.scrollable-area::-webkit-scrollbar-thumb{background-color:#d8d6d6;border-radius:20px}.container-label-sup{display:flex;align-items:center;gap:4px;margin-bottom:8px;color:#333;font-family:Rubik,sans-serif;font-size:.875rem;font-weight:500;line-height:20px;letter-spacing:.28px}.container-label-sup.disabled{color:#bfbfbf}.icon-dot{display:flex;align-items:center;width:4px;height:4px;aspect-ratio:1/1;background-color:#db2e2a;border-radius:100px}.icon-color-help{color:#8c8c8c}.label-inf{display:flex;position:absolute;margin-top:4px;color:#595959;font-family:Roboto,sans-serif;font-size:.75rem;font-style:italic;font-weight:500;line-height:16px;letter-spacing:.24px}.label-inf.alert{color:#931224}\n"], dependencies: [{ kind: "component", type: IconMdComponent, selector: "ius-icon-md", inputs: ["iconName", "color"] }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1$3.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$3.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$3.MaxLengthValidator, selector: "[maxlength][formControlName],[maxlength][formControl],[maxlength][ngModel]", inputs: ["maxlength"] }, { kind: "directive", type: i1$3.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1$1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }] }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: InputLargeComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'ius-input-large', standalone: true, imports: [IconMdComponent, FormsModule, CommonModule], template: "<div class=\"container-general\">\r\n  @if (labelSuperior) {\r\n  <div\r\n    class=\"container-label-sup\"\r\n    [ngClass]=\"{\r\n      disabled: disabled\r\n    }\"\r\n  >\r\n    @if(!disabled && required){\r\n    <div class=\"icon-dot\"></div>\r\n    }\r\n    <span class=\"\">{{ labelSuperior }}</span>\r\n    @if(!disabled && showHelpText){\r\n    <ius-icon-md iconName=\"icon-help\" class=\"icon-color-help\"></ius-icon-md>\r\n    }\r\n    <span>:</span>\r\n  </div>\r\n  }\r\n  <div\r\n    class=\"container-textfield\"\r\n    [ngClass]=\"{\r\n      disabled: disabled,\r\n      focused: isFocused,\r\n      alert: (!isFocused && isAlertText && !disabled) || (error && !disabled)\r\n    }\"\r\n  >\r\n    <textarea class=\"scrollable-area\"\r\n      [(ngModel)]=\"textInput\"\r\n      [placeholder]=\"labelInput\"\r\n      [disabled]=\"disabled\"\r\n      [rows]=\"rows\"\r\n      [maxlength]=\"maxlenght ?? null\"\r\n      (input)=\"onInput()\"\r\n      (focus)=\"onFocus()\"\r\n      (blur)=\"onBlur()\"\r\n      (keypress)=\"onKeyPress($event)\"\r\n      (drop)=\"onDropBlock($event)\"\r\n      (dragover)=\"onDragOverBlock($event)\"\r\n    ></textarea>\r\n  </div>\r\n  @if (labelInferior && isFocused && !error) {\r\n  <span class=\"label-inf\">{{ labelInferior }}</span>\r\n  } @if ((errorText || labelInferior) && ((!isFocused && isAlertText && !disabled) || (error && !disabled))) {\r\n  <span class=\"label-inf alert\">{{ errorText ?? labelInferior }}</span>\r\n  }\r\n</div>\r\n", styles: [".h1{font-family:Roboto,sans-serif;font-size:2.375rem;font-weight:500;line-height:46px}.h2{font-family:Roboto,sans-serif;font-size:1.875rem;font-weight:700;line-height:38px}.h3{font-family:Roboto,sans-serif;font-size:1.5rem;font-weight:500;line-height:32px}.h4{font-family:Roboto,sans-serif;font-size:1.25rem;font-weight:700;line-height:26px}.h5{font-family:Roboto,sans-serif;font-size:1.125rem;font-weight:500;line-height:24px;letter-spacing:.18px}.label-large{font-family:Roboto,sans-serif;font-size:1rem;font-weight:500;line-height:22px}.body-large{font-family:Rubik,sans-serif;font-size:1rem;font-weight:400;line-height:22px}.label-base{font-family:Rubik,sans-serif;font-size:.875rem;font-weight:500;line-height:20px;letter-spacing:.28px}.body-base{font-family:Rubik,sans-serif;font-size:.875rem;font-weight:400;line-height:20px;font-style:italic;letter-spacing:.28px}.body-base-1,.body-base-1-1{font-family:Rubik,sans-serif;font-size:.875rem;font-weight:400;line-height:20px;letter-spacing:.28px}.body-sm{font-family:Rubik,sans-serif;font-size:.75rem;font-weight:400;line-height:16px;letter-spacing:.28px}.body-sm-italic{font-family:Rubik,sans-serif;font-size:.75rem;font-weight:400;line-height:16px;font-style:italic;letter-spacing:.28px}.caption-sm{font-family:Rubik,sans-serif;font-size:.75rem;font-weight:500;line-height:16px;letter-spacing:.28px}.caption-sm-italic{font-family:Rubik,sans-serif;font-size:.75rem;font-weight:500;line-height:16px;font-style:italic;letter-spacing:.28px}.container-general{position:relative;height:100%}.container-textfield{display:flex;padding:10px 12px;justify-content:flex-start;align-items:flex-start;gap:4px;border:1px solid #f5f5f5;border-radius:8px;background:#f5f5f5;font-family:Rubik,sans-serif;font-size:.875rem;font-weight:400;line-height:20px;letter-spacing:.28px;transition:all .2s ease-in-out}.container-textfield:hover:not(.disabled):not(.focused):not(.alert){background:#edf6ff}.container-textfield.focused{border:1px solid #0581BC;background:#edf6ff}.container-textfield.disabled{background:#f5f5f5}.container-textfield.disabled textarea{color:#bfbfbf}.container-textfield.disabled textarea::placeholder{color:#bfbfbf;opacity:1}.container-textfield.alert{border:1px solid #DB2E2A;background:#fff4f0}textarea{display:flex;flex:1 0 0;border:none;outline:none;background-color:transparent;font-family:Rubik,sans-serif;font-size:.875rem;font-weight:400;line-height:20px;letter-spacing:.28px;resize:vertical;padding:5px 0;overflow-y:auto;color:#333}textarea::placeholder{color:#8c8c8c}.scrollable-area{overflow:auto}.scrollable-area::-webkit-scrollbar-thumb:hover{background-color:#bfbfbf}.scrollable-area::-webkit-scrollbar-thumb:active{background-color:#8c8c8c}.scrollable-area::-webkit-scrollbar{-webkit-appearance:none}.scrollable-area::-webkit-scrollbar:vertical{width:7px}.scrollable-area::-webkit-scrollbar-thumb{background-color:#d8d6d6;border-radius:20px}.container-label-sup{display:flex;align-items:center;gap:4px;margin-bottom:8px;color:#333;font-family:Roboto,sans-serif;font-size:.875rem;font-weight:500;line-height:20px;letter-spacing:.28px}.container-label-sup.disabled{color:#bfbfbf}.icon-dot{display:flex;align-items:center;width:4px;height:4px;aspect-ratio:1/1;background-color:#db2e2a;border-radius:100px}.icon-color-help{color:#8c8c8c}.label-inf{display:flex;position:absolute;margin-top:4px;color:#595959;font-family:Roboto,sans-serif;font-size:.75rem;font-style:italic;font-weight:500;line-height:16px;letter-spacing:.24px}.label-inf.alert{color:#931224}\n"] }]
+            args: [{ selector: 'ius-input-large', standalone: true, imports: [IconMdComponent, FormsModule, CommonModule], template: "<div class=\"container-general\">\r\n  @if (labelSuperior) {\r\n  <div\r\n    class=\"container-label-sup\"\r\n    [ngClass]=\"{\r\n      disabled: disabled\r\n    }\"\r\n  >\r\n    @if(!disabled && required){\r\n    <div class=\"icon-dot\"></div>\r\n    }\r\n    <span class=\"\">{{ labelSuperior }}</span>\r\n    @if(!disabled && showHelpText){\r\n    <ius-icon-md iconName=\"icon-help\" class=\"icon-color-help\"></ius-icon-md>\r\n    }\r\n    <span>:</span>\r\n  </div>\r\n  }\r\n  <div\r\n    class=\"container-textfield\"\r\n    [ngClass]=\"{\r\n      disabled: disabled,\r\n      focused: isFocused,\r\n      alert: (!isFocused && isAlertText && !disabled) || (error && !disabled)\r\n    }\"\r\n  >\r\n    <textarea class=\"scrollable-area\"\r\n      [(ngModel)]=\"textInput\"\r\n      [placeholder]=\"labelInput\"\r\n      [disabled]=\"disabled\"\r\n      [rows]=\"rows\"\r\n      [maxlength]=\"maxlenght ?? null\"\r\n      (input)=\"onInput()\"\r\n      (focus)=\"onFocus()\"\r\n      (blur)=\"onBlur()\"\r\n      (keypress)=\"onKeyPress($event)\"\r\n      (drop)=\"onDropBlock($event)\"\r\n      (dragover)=\"onDragOverBlock($event)\"\r\n    ></textarea>\r\n  </div>\r\n  @if (labelInferior && isFocused && !error) {\r\n  <span class=\"label-inf\">{{ labelInferior }}</span>\r\n  } @if ((errorText || labelInferior) && ((!isFocused && isAlertText && !disabled) || (error && !disabled))) {\r\n  <span class=\"label-inf alert\">{{ errorText ?? labelInferior }}</span>\r\n  }\r\n</div>\r\n", styles: [".h1{font-family:Roboto,sans-serif;font-size:2.375rem;font-weight:500;line-height:46px}.h2{font-family:Roboto,sans-serif;font-size:1.875rem;font-weight:700;line-height:38px}.h3{font-family:Roboto,sans-serif;font-size:1.5rem;font-weight:500;line-height:32px}.h4{font-family:Roboto,sans-serif;font-size:1.25rem;font-weight:700;line-height:26px}.h5{font-family:Roboto,sans-serif;font-size:1.125rem;font-weight:500;line-height:24px;letter-spacing:.18px}.label-large{font-family:Roboto,sans-serif;font-size:1rem;font-weight:500;line-height:22px}.body-large{font-family:Rubik,sans-serif;font-size:1rem;font-weight:400;line-height:22px}.label-base{font-family:Rubik,sans-serif;font-size:.875rem;font-weight:500;line-height:20px;letter-spacing:.28px}.body-base{font-family:Rubik,sans-serif;font-size:.875rem;font-weight:400;line-height:20px;font-style:italic;letter-spacing:.28px}.body-base-1,.body-base-1-1{font-family:Rubik,sans-serif;font-size:.875rem;font-weight:400;line-height:20px;letter-spacing:.28px}.body-sm{font-family:Rubik,sans-serif;font-size:.75rem;font-weight:400;line-height:16px;letter-spacing:.28px}.body-sm-italic{font-family:Rubik,sans-serif;font-size:.75rem;font-weight:400;line-height:16px;font-style:italic;letter-spacing:.28px}.caption-sm{font-family:Rubik,sans-serif;font-size:.75rem;font-weight:500;line-height:16px;letter-spacing:.28px}.caption-sm-italic{font-family:Rubik,sans-serif;font-size:.75rem;font-weight:500;line-height:16px;font-style:italic;letter-spacing:.28px}.container-general{position:relative;height:100%}.container-textfield{display:flex;padding:10px 12px;justify-content:flex-start;align-items:flex-start;gap:4px;border:1px solid #f5f5f5;border-radius:8px;background:#f5f5f5;font-family:Rubik,sans-serif;font-size:.875rem;font-weight:400;line-height:20px;letter-spacing:.28px;transition:all .2s ease-in-out}.container-textfield:hover:not(.disabled):not(.focused):not(.alert){background:#edf6ff}.container-textfield.focused{border:1px solid #0581BC;background:#edf6ff}.container-textfield.disabled{background:#f5f5f5}.container-textfield.disabled textarea{color:#bfbfbf}.container-textfield.disabled textarea::placeholder{color:#bfbfbf;opacity:1}.container-textfield.alert{border:1px solid #DB2E2A;background:#fff4f0}textarea{display:flex;flex:1 0 0;border:none;outline:none;background-color:transparent;font-family:Rubik,sans-serif;font-size:.875rem;font-weight:400;line-height:20px;letter-spacing:.28px;resize:vertical;padding:5px 0;overflow-y:auto;color:#333}textarea::placeholder{color:#8c8c8c}.scrollable-area{overflow:auto}.scrollable-area::-webkit-scrollbar-thumb:hover{background-color:#bfbfbf}.scrollable-area::-webkit-scrollbar-thumb:active{background-color:#8c8c8c}.scrollable-area::-webkit-scrollbar{-webkit-appearance:none}.scrollable-area::-webkit-scrollbar:vertical{width:7px}.scrollable-area::-webkit-scrollbar-thumb{background-color:#d8d6d6;border-radius:20px}.container-label-sup{display:flex;align-items:center;gap:4px;margin-bottom:8px;color:#333;font-family:Rubik,sans-serif;font-size:.875rem;font-weight:500;line-height:20px;letter-spacing:.28px}.container-label-sup.disabled{color:#bfbfbf}.icon-dot{display:flex;align-items:center;width:4px;height:4px;aspect-ratio:1/1;background-color:#db2e2a;border-radius:100px}.icon-color-help{color:#8c8c8c}.label-inf{display:flex;position:absolute;margin-top:4px;color:#595959;font-family:Roboto,sans-serif;font-size:.75rem;font-style:italic;font-weight:500;line-height:16px;letter-spacing:.24px}.label-inf.alert{color:#931224}\n"] }]
         }], propDecorators: { textInput: [{
                 type: Input
             }], required: [{
@@ -6990,14 +6994,14 @@ class CardVigilanciaJudicialComponent {
     static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "17.3.12", type: CardVigilanciaJudicialComponent, isStandalone: true, selector: "ius-card-vigilancia-judicial", inputs: { collapse: "collapse", hasNotificacion: "hasNotificacion", hasAuto: "hasAuto", read: "read", titulo: "titulo", juzgado: "juzgado", fechaPrincipal: "fechaPrincipal", actuaciones: "actuaciones" }, outputs: { onClickButtonCopy: "onClickButtonCopy", onClickButtonRead: "onClickButtonRead", onClickButtonNotificacion: "onClickButtonNotificacion", onClickButtonAuto: "onClickButtonAuto" }, providers: [
             { provide: LOCALE_ID, useValue: 'es' },
             DatePipe
-        ], ngImport: i0, template: "<div class=\"ctn-gnrl\" (click)=\"toggleCollapse()\">\n    <div class=\"ctn-card\">\n        <div class=\"ctn-inf\">\n            <ius-icon-sm iconName=\"icon-account-balance\" class=\"icon-account\"\n                [ngClass]=\"{'priority-tx': hasNotificacion || hasAuto }\"></ius-icon-sm>\n            <div class=\"info\">\n                <span class=\"caption-sm txt-ter\">Vigilancia Judicial</span>\n                <span class=\"body-base-1 txt-pry\" [ngClass]=\"{'title-no-read': read === false}\">{{titulo}}</span>\n                <span class=\"body-base-1 txt-sec\">{{juzgado}}</span>\n            </div>\n        </div>\n        <div class=\"ctn-icons\">\n            @if (hasNotificacion || hasAuto) {\n            <div class=\"row-text-1\">\n                @if (hasNotificacion) {\n                <ius-icon-sm iconName=\"icon-notification-2\" class=\"txt-sec\"></ius-icon-sm>\n                }\n                @if (hasAuto) {\n                <ius-icon-sm iconName=\"icon-docs-2\" class=\"txt-sec\"></ius-icon-sm>\n                }\n            </div>\n            }\n            <div class=\"row-text-2\">\n                <div class=\"icon-dot\" [ngClass]=\"{'icon-dot-f': read === true}\"></div>\n                <span class=\"body-sm txt-ter fecha\">{{fechaPrincipal | date: 'd MMM y'}}</span>\n                <span class=\"buttons-hove\">\n                    <ius-button-circle-tertiary iconName=\"icon-mark-chat-read\"\n                        [iusPopoverContent]=\"read ? 'Marcar como no le\u00EDdo' : 'Marcar como le\u00EDdo'\"\n                        (buttonClicked)=\"clickButtonRead($event)\"></ius-button-circle-tertiary>\n                    <ius-button-circle-tertiary iconName=\"icon-content-copy\"\n                        iusPopoverContent=\"Copiar informaci\u00F3n\"\n                        (buttonClicked)=\"clickButtonCopy($event)\"></ius-button-circle-tertiary>\n                </span>\n            </div>\n            <ius-icon-sm [iconName]=\"collapse ? 'icon-keyboard-arrow-down' : 'icon-keyboard-arrow-up'\"\n                class=\"txt-pry\"></ius-icon-sm>\n        </div>\n    </div>\n    <div class=\"ctn-collapse-card\" [ngClass]=\"{'collapsed': collapse}\">\n        <ius-simple-divider></ius-simple-divider>\n        <div class=\"ctn-clp\">\n            <div class=\"ctn-info-clp\">\n                @for (act of actuaciones; track $index) {\n                <div class=\"text-info\">\n                    <div class=\"row-text-1 body-sm txt-ter\">\n                        @if (act.fechaIniciaTermino) {\n                            <span>Inicia t\u00E9rmino: {{act.fechaIniciaTermino | date: 'd MMM y'}}</span>\n                        } @else {\n                            <span>Fecha registro: {{act.fechaActuacion | date: 'd MMM y'}}</span>\n                        }\n                        @if (act.fechaFinalizaTermino) {\n                            <span>-</span>\n                            <span>Finaliza t\u00E9rmino: {{act.fechaFinalizaTermino | date: 'd MMM y'}}</span>\n                        }\n                    </div>\n                    <span class=\"label-base txt-ter\">{{act.actuacion}}</span>\n                    <span class=\"body-base-1 txt-sec\">{{act.anotacion}}</span>\n                </div>\n                }\n            </div>\n            <div class=\"buttons-clp\">\n                @if (hasNotificacion) {\n                <ius-button-menu-link iconName=\"icon-notificacion\" iconColor=\"#184FDB\"\n                    iusPopoverContent=\"Ver notificaci\u00F3n\"\n                    (buttonClicked)=\"clickButtonNotificacion($event)\"></ius-button-menu-link>\n                <ius-simple-divider></ius-simple-divider>\n                }\n                @if (hasAuto) {\n                <ius-button-menu-link iconName=\"icon-docs\" iconColor=\"#184FDB\" iusPopoverContent=\"Ver auto\"\n                    (buttonClicked)=\"clickButtonAuto($event)\"></ius-button-menu-link>\n                <ius-simple-divider></ius-simple-divider>\n                }\n            </div>\n        </div>\n    </div>\n</div>", styles: [".h1{font-family:Roboto,sans-serif;font-size:2.375rem;font-weight:500;line-height:46px}.h2{font-family:Roboto,sans-serif;font-size:1.875rem;font-weight:700;line-height:38px}.h3{font-family:Roboto,sans-serif;font-size:1.5rem;font-weight:500;line-height:32px}.h4{font-family:Roboto,sans-serif;font-size:1.25rem;font-weight:700;line-height:26px}.h5{font-family:Roboto,sans-serif;font-size:1.125rem;font-weight:500;line-height:24px;letter-spacing:.18px}.label-large{font-family:Roboto,sans-serif;font-size:1rem;font-weight:500;line-height:22px}.body-large{font-family:Rubik,sans-serif;font-size:1rem;font-weight:400;line-height:22px}.label-base{font-family:Rubik,sans-serif;font-size:.875rem;font-weight:500;line-height:20px;letter-spacing:.28px}.body-base{font-family:Rubik,sans-serif;font-size:.875rem;font-weight:400;line-height:20px;font-style:italic;letter-spacing:.28px}.body-base-1,.body-base-1-1{font-family:Rubik,sans-serif;font-size:.875rem;font-weight:400;line-height:20px;letter-spacing:.28px}.body-sm{font-family:Rubik,sans-serif;font-size:.75rem;font-weight:400;line-height:16px;letter-spacing:.28px}.body-sm-italic{font-family:Rubik,sans-serif;font-size:.75rem;font-weight:400;line-height:16px;font-style:italic;letter-spacing:.28px}.caption-sm{font-family:Rubik,sans-serif;font-size:.75rem;font-weight:500;line-height:16px;letter-spacing:.28px}.caption-sm-italic{font-family:Rubik,sans-serif;font-size:.75rem;font-weight:500;line-height:16px;font-style:italic;letter-spacing:.28px}.ctn-gnrl{position:relative;display:flex;flex-direction:column;cursor:pointer;padding:8px 12px;box-sizing:border-box;border-radius:4px;border:1px solid #eaeaea}.ctn-gnrl:hover{border:1px solid #C4DFFF;box-shadow:0 1px 3px #0000001f,0 1px 2px #00000014}.ctn-gnrl:hover .fecha{display:none;pointer-events:none}.ctn-gnrl:hover .buttons-hove{display:flex;pointer-events:auto}.ctn-card{position:relative;display:flex;align-items:center;gap:24px;min-height:40px;justify-content:center}.ctn-inf{display:flex;flex:1 0 0;align-items:center;gap:16px}.title-no-read{font-weight:500}.icon-account{color:#8c8c8c}.priority-tx{color:#497610}.info{display:flex;flex:1 0 0;flex-direction:column;align-items:flex-start}.ctn-icons{display:flex;align-items:center;gap:16px}.icon-dot{display:flex;align-items:center;width:8px;height:8px;aspect-ratio:1/1;background-color:#2167ff;border-radius:100px}.icon-dot-f{background-color:transparent}.fecha{width:76px}.buttons-hove{display:none;pointer-events:none;gap:4px;width:76px}.ctn-collapse-card{max-height:1000px;overflow:hidden;transition:max-height .3s ease-in-out}.ctn-collapse-card.collapsed{max-height:0px}.ctn-clp{display:flex;gap:8px}.buttons-clp{display:flex;padding:4px;flex-direction:column;gap:4px}.ctn-info-clp{display:flex;padding:4px 8px;flex-direction:column;gap:12px;flex:1 0 0}.text-info{display:flex;flex-direction:column;align-items:flex-start;flex:1 0 0}ius-simple-divider{margin:8px 0}.row-text-1{display:flex;align-items:center;gap:8px}.row-text-2{display:flex;align-items:center;gap:4px}.txt-pry{color:#333}.txt-sec{color:#595959}.txt-ter{color:#8c8c8c}\n"], dependencies: [{ kind: "component", type: IconSmComponent, selector: "ius-icon-sm", inputs: ["iconName", "color"] }, { kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "component", type: ButtonCircleTertiaryComponent, selector: "ius-button-circle-tertiary", inputs: ["disabled", "iconName"], outputs: ["buttonClicked"] }, { kind: "component", type: SimpleDividerComponent, selector: "ius-simple-divider" }, { kind: "component", type: ButtonMenuLinkComponent, selector: "ius-button-menu-link", inputs: ["disabled", "iconColor", "iconName"], outputs: ["buttonClicked"] }, { kind: "pipe", type: DatePipe, name: "date" }, { kind: "directive", type: PopoverDirective, selector: "[iusPopover], [iusPopoverTitle], [iusPopoverContent]", inputs: ["iusPopover", "iusPopoverTitle", "iusPopoverContent", "iusPopoverPosition", "iusPopoverOpenDelay", "iusPopoverCloseDelay"] }] }); }
+        ], ngImport: i0, template: "<div class=\"ctn-gnrl\" (click)=\"toggleCollapse()\">\r\n    <div class=\"ctn-card\">\r\n        <div class=\"ctn-inf\">\r\n            <ius-icon-sm iconName=\"icon-account-balance\" class=\"icon-account\"\r\n                [ngClass]=\"{'priority-tx': hasNotificacion || hasAuto }\"></ius-icon-sm>\r\n            <div class=\"info\">\r\n                <span class=\"caption-sm txt-ter\">Vigilancia Judicial</span>\r\n                <span class=\"body-base-1 txt-pry\" [ngClass]=\"{'title-no-read': read === false}\">{{titulo}}</span>\r\n                <span class=\"body-base-1 txt-sec\">{{juzgado}}</span>\r\n            </div>\r\n        </div>\r\n        <div class=\"ctn-icons\">\r\n            @if (hasNotificacion || hasAuto) {\r\n            <div class=\"row-text-1\">\r\n                @if (hasNotificacion) {\r\n                <ius-icon-sm iconName=\"icon-notification-2\" class=\"txt-sec\"></ius-icon-sm>\r\n                }\r\n                @if (hasAuto) {\r\n                <ius-icon-sm iconName=\"icon-docs-2\" class=\"txt-sec\"></ius-icon-sm>\r\n                }\r\n            </div>\r\n            }\r\n            <div class=\"row-text-2\">\r\n                <div class=\"icon-dot\" [ngClass]=\"{'icon-dot-f': read === true}\"></div>\r\n                <span class=\"body-sm txt-ter fecha\">{{fechaPrincipal | date: 'd MMM y'}}</span>\r\n                <span class=\"buttons-hove\">\r\n                    <ius-button-circle-tertiary iconName=\"icon-mark-chat-read\"\r\n                        [iusPopoverContent]=\"read ? 'Marcar como no le\u00EDdo' : 'Marcar como le\u00EDdo'\"\r\n                        (buttonClicked)=\"clickButtonRead($event)\"></ius-button-circle-tertiary>\r\n                    <ius-button-circle-tertiary iconName=\"icon-content-copy\"\r\n                        iusPopoverContent=\"Copiar informaci\u00F3n\"\r\n                        (buttonClicked)=\"clickButtonCopy($event)\"></ius-button-circle-tertiary>\r\n                </span>\r\n            </div>\r\n            <ius-icon-sm [iconName]=\"collapse ? 'icon-keyboard-arrow-down' : 'icon-keyboard-arrow-up'\"\r\n                class=\"txt-pry\"></ius-icon-sm>\r\n        </div>\r\n    </div>\r\n    <div class=\"ctn-collapse-card\" [ngClass]=\"{'collapsed': collapse}\">\r\n        <ius-simple-divider></ius-simple-divider>\r\n        <div class=\"ctn-clp\">\r\n            <div class=\"ctn-info-clp\">\r\n                @for (act of actuaciones; track $index) {\r\n                <div class=\"text-info\">\r\n                    <div class=\"row-text-1 body-sm txt-ter\">\r\n                        @if (act.fechaIniciaTermino) {\r\n                            <span>Inicia t\u00E9rmino: {{act.fechaIniciaTermino | date: 'd MMM y'}}</span>\r\n                        } @else {\r\n                            <span>Fecha registro: {{act.fechaActuacion | date: 'd MMM y'}}</span>\r\n                        }\r\n                        @if (act.fechaFinalizaTermino) {\r\n                            <span>-</span>\r\n                            <span>Finaliza t\u00E9rmino: {{act.fechaFinalizaTermino | date: 'd MMM y'}}</span>\r\n                        }\r\n                    </div>\r\n                    <span class=\"label-base txt-ter\">{{act.actuacion}}</span>\r\n                    <span class=\"body-base-1 txt-sec\">{{act.anotacion}}</span>\r\n                </div>\r\n                }\r\n            </div>\r\n            <div class=\"buttons-clp\">\r\n                @if (hasNotificacion) {\r\n                <ius-button-menu-link iconName=\"icon-notificacion\" iconColor=\"#184FDB\"\r\n                    iusPopoverContent=\"Ver notificaci\u00F3n\"\r\n                    (buttonClicked)=\"clickButtonNotificacion($event)\"></ius-button-menu-link>\r\n                <ius-simple-divider></ius-simple-divider>\r\n                }\r\n                @if (hasAuto) {\r\n                <ius-button-menu-link iconName=\"icon-docs\" iconColor=\"#184FDB\" iusPopoverContent=\"Ver auto\"\r\n                    (buttonClicked)=\"clickButtonAuto($event)\"></ius-button-menu-link>\r\n                <ius-simple-divider></ius-simple-divider>\r\n                }\r\n            </div>\r\n        </div>\r\n    </div>\r\n</div>", styles: [".h1{font-family:Roboto,sans-serif;font-size:2.375rem;font-weight:500;line-height:46px}.h2{font-family:Roboto,sans-serif;font-size:1.875rem;font-weight:700;line-height:38px}.h3{font-family:Roboto,sans-serif;font-size:1.5rem;font-weight:500;line-height:32px}.h4{font-family:Roboto,sans-serif;font-size:1.25rem;font-weight:700;line-height:26px}.h5{font-family:Roboto,sans-serif;font-size:1.125rem;font-weight:500;line-height:24px;letter-spacing:.18px}.label-large{font-family:Roboto,sans-serif;font-size:1rem;font-weight:500;line-height:22px}.body-large{font-family:Rubik,sans-serif;font-size:1rem;font-weight:400;line-height:22px}.label-base{font-family:Rubik,sans-serif;font-size:.875rem;font-weight:500;line-height:20px;letter-spacing:.28px}.body-base{font-family:Rubik,sans-serif;font-size:.875rem;font-weight:400;line-height:20px;font-style:italic;letter-spacing:.28px}.body-base-1,.body-base-1-1{font-family:Rubik,sans-serif;font-size:.875rem;font-weight:400;line-height:20px;letter-spacing:.28px}.body-sm{font-family:Rubik,sans-serif;font-size:.75rem;font-weight:400;line-height:16px;letter-spacing:.28px}.body-sm-italic{font-family:Rubik,sans-serif;font-size:.75rem;font-weight:400;line-height:16px;font-style:italic;letter-spacing:.28px}.caption-sm{font-family:Rubik,sans-serif;font-size:.75rem;font-weight:500;line-height:16px;letter-spacing:.28px}.caption-sm-italic{font-family:Rubik,sans-serif;font-size:.75rem;font-weight:500;line-height:16px;font-style:italic;letter-spacing:.28px}.ctn-gnrl{position:relative;display:flex;flex-direction:column;cursor:pointer;padding:8px 12px;box-sizing:border-box;border-radius:4px;border:1px solid #eaeaea}.ctn-gnrl:hover{border:1px solid #C4DFFF;box-shadow:0 1px 3px #0000001f,0 1px 2px #00000014}.ctn-gnrl:hover .fecha{display:none;pointer-events:none}.ctn-gnrl:hover .buttons-hove{display:flex;pointer-events:auto}.ctn-card{position:relative;display:flex;align-items:center;gap:24px;min-height:40px;justify-content:center}.ctn-inf{display:flex;flex:1 0 0;align-items:center;gap:16px}.title-no-read{font-weight:500}.icon-account{color:#8c8c8c}.priority-tx{color:#497610}.info{display:flex;flex:1 0 0;flex-direction:column;align-items:flex-start}.ctn-icons{display:flex;align-items:center;gap:16px}.icon-dot{display:flex;align-items:center;width:8px;height:8px;aspect-ratio:1/1;background-color:#2167ff;border-radius:100px}.icon-dot-f{background-color:transparent}.fecha{width:76px}.buttons-hove{display:none;pointer-events:none;gap:4px;width:76px}.ctn-collapse-card{max-height:1000px;overflow:hidden;transition:max-height .3s ease-in-out}.ctn-collapse-card.collapsed{max-height:0px}.ctn-clp{display:flex;gap:8px}.buttons-clp{display:flex;padding:4px;flex-direction:column;gap:4px}.ctn-info-clp{display:flex;padding:4px 8px;flex-direction:column;gap:12px;flex:1 0 0}.text-info{display:flex;flex-direction:column;align-items:flex-start;flex:1 0 0}ius-simple-divider{margin:8px 0}.row-text-1{display:flex;align-items:center;gap:8px}.row-text-2{display:flex;align-items:center;gap:4px}.txt-pry{color:#333}.txt-sec{color:#595959}.txt-ter{color:#8c8c8c}\n"], dependencies: [{ kind: "component", type: IconSmComponent, selector: "ius-icon-sm", inputs: ["iconName", "color"] }, { kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "component", type: ButtonCircleTertiaryComponent, selector: "ius-button-circle-tertiary", inputs: ["disabled", "iconName"], outputs: ["buttonClicked"] }, { kind: "component", type: SimpleDividerComponent, selector: "ius-simple-divider" }, { kind: "component", type: ButtonMenuLinkComponent, selector: "ius-button-menu-link", inputs: ["disabled", "iconColor", "iconName"], outputs: ["buttonClicked"] }, { kind: "pipe", type: DatePipe, name: "date" }, { kind: "directive", type: PopoverDirective, selector: "[iusPopover], [iusPopoverTitle], [iusPopoverContent]", inputs: ["iusPopover", "iusPopoverTitle", "iusPopoverContent", "iusPopoverPosition", "iusPopoverOpenDelay", "iusPopoverCloseDelay"] }] }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: CardVigilanciaJudicialComponent, decorators: [{
             type: Component,
             args: [{ selector: 'ius-card-vigilancia-judicial', standalone: true, imports: [IconSmComponent, NgClass, ButtonCircleTertiaryComponent, SimpleDividerComponent, ButtonMenuLinkComponent, DatePipe, PopoverDirective], providers: [
                         { provide: LOCALE_ID, useValue: 'es' },
                         DatePipe
-                    ], template: "<div class=\"ctn-gnrl\" (click)=\"toggleCollapse()\">\n    <div class=\"ctn-card\">\n        <div class=\"ctn-inf\">\n            <ius-icon-sm iconName=\"icon-account-balance\" class=\"icon-account\"\n                [ngClass]=\"{'priority-tx': hasNotificacion || hasAuto }\"></ius-icon-sm>\n            <div class=\"info\">\n                <span class=\"caption-sm txt-ter\">Vigilancia Judicial</span>\n                <span class=\"body-base-1 txt-pry\" [ngClass]=\"{'title-no-read': read === false}\">{{titulo}}</span>\n                <span class=\"body-base-1 txt-sec\">{{juzgado}}</span>\n            </div>\n        </div>\n        <div class=\"ctn-icons\">\n            @if (hasNotificacion || hasAuto) {\n            <div class=\"row-text-1\">\n                @if (hasNotificacion) {\n                <ius-icon-sm iconName=\"icon-notification-2\" class=\"txt-sec\"></ius-icon-sm>\n                }\n                @if (hasAuto) {\n                <ius-icon-sm iconName=\"icon-docs-2\" class=\"txt-sec\"></ius-icon-sm>\n                }\n            </div>\n            }\n            <div class=\"row-text-2\">\n                <div class=\"icon-dot\" [ngClass]=\"{'icon-dot-f': read === true}\"></div>\n                <span class=\"body-sm txt-ter fecha\">{{fechaPrincipal | date: 'd MMM y'}}</span>\n                <span class=\"buttons-hove\">\n                    <ius-button-circle-tertiary iconName=\"icon-mark-chat-read\"\n                        [iusPopoverContent]=\"read ? 'Marcar como no le\u00EDdo' : 'Marcar como le\u00EDdo'\"\n                        (buttonClicked)=\"clickButtonRead($event)\"></ius-button-circle-tertiary>\n                    <ius-button-circle-tertiary iconName=\"icon-content-copy\"\n                        iusPopoverContent=\"Copiar informaci\u00F3n\"\n                        (buttonClicked)=\"clickButtonCopy($event)\"></ius-button-circle-tertiary>\n                </span>\n            </div>\n            <ius-icon-sm [iconName]=\"collapse ? 'icon-keyboard-arrow-down' : 'icon-keyboard-arrow-up'\"\n                class=\"txt-pry\"></ius-icon-sm>\n        </div>\n    </div>\n    <div class=\"ctn-collapse-card\" [ngClass]=\"{'collapsed': collapse}\">\n        <ius-simple-divider></ius-simple-divider>\n        <div class=\"ctn-clp\">\n            <div class=\"ctn-info-clp\">\n                @for (act of actuaciones; track $index) {\n                <div class=\"text-info\">\n                    <div class=\"row-text-1 body-sm txt-ter\">\n                        @if (act.fechaIniciaTermino) {\n                            <span>Inicia t\u00E9rmino: {{act.fechaIniciaTermino | date: 'd MMM y'}}</span>\n                        } @else {\n                            <span>Fecha registro: {{act.fechaActuacion | date: 'd MMM y'}}</span>\n                        }\n                        @if (act.fechaFinalizaTermino) {\n                            <span>-</span>\n                            <span>Finaliza t\u00E9rmino: {{act.fechaFinalizaTermino | date: 'd MMM y'}}</span>\n                        }\n                    </div>\n                    <span class=\"label-base txt-ter\">{{act.actuacion}}</span>\n                    <span class=\"body-base-1 txt-sec\">{{act.anotacion}}</span>\n                </div>\n                }\n            </div>\n            <div class=\"buttons-clp\">\n                @if (hasNotificacion) {\n                <ius-button-menu-link iconName=\"icon-notificacion\" iconColor=\"#184FDB\"\n                    iusPopoverContent=\"Ver notificaci\u00F3n\"\n                    (buttonClicked)=\"clickButtonNotificacion($event)\"></ius-button-menu-link>\n                <ius-simple-divider></ius-simple-divider>\n                }\n                @if (hasAuto) {\n                <ius-button-menu-link iconName=\"icon-docs\" iconColor=\"#184FDB\" iusPopoverContent=\"Ver auto\"\n                    (buttonClicked)=\"clickButtonAuto($event)\"></ius-button-menu-link>\n                <ius-simple-divider></ius-simple-divider>\n                }\n            </div>\n        </div>\n    </div>\n</div>", styles: [".h1{font-family:Roboto,sans-serif;font-size:2.375rem;font-weight:500;line-height:46px}.h2{font-family:Roboto,sans-serif;font-size:1.875rem;font-weight:700;line-height:38px}.h3{font-family:Roboto,sans-serif;font-size:1.5rem;font-weight:500;line-height:32px}.h4{font-family:Roboto,sans-serif;font-size:1.25rem;font-weight:700;line-height:26px}.h5{font-family:Roboto,sans-serif;font-size:1.125rem;font-weight:500;line-height:24px;letter-spacing:.18px}.label-large{font-family:Roboto,sans-serif;font-size:1rem;font-weight:500;line-height:22px}.body-large{font-family:Rubik,sans-serif;font-size:1rem;font-weight:400;line-height:22px}.label-base{font-family:Rubik,sans-serif;font-size:.875rem;font-weight:500;line-height:20px;letter-spacing:.28px}.body-base{font-family:Rubik,sans-serif;font-size:.875rem;font-weight:400;line-height:20px;font-style:italic;letter-spacing:.28px}.body-base-1,.body-base-1-1{font-family:Rubik,sans-serif;font-size:.875rem;font-weight:400;line-height:20px;letter-spacing:.28px}.body-sm{font-family:Rubik,sans-serif;font-size:.75rem;font-weight:400;line-height:16px;letter-spacing:.28px}.body-sm-italic{font-family:Rubik,sans-serif;font-size:.75rem;font-weight:400;line-height:16px;font-style:italic;letter-spacing:.28px}.caption-sm{font-family:Rubik,sans-serif;font-size:.75rem;font-weight:500;line-height:16px;letter-spacing:.28px}.caption-sm-italic{font-family:Rubik,sans-serif;font-size:.75rem;font-weight:500;line-height:16px;font-style:italic;letter-spacing:.28px}.ctn-gnrl{position:relative;display:flex;flex-direction:column;cursor:pointer;padding:8px 12px;box-sizing:border-box;border-radius:4px;border:1px solid #eaeaea}.ctn-gnrl:hover{border:1px solid #C4DFFF;box-shadow:0 1px 3px #0000001f,0 1px 2px #00000014}.ctn-gnrl:hover .fecha{display:none;pointer-events:none}.ctn-gnrl:hover .buttons-hove{display:flex;pointer-events:auto}.ctn-card{position:relative;display:flex;align-items:center;gap:24px;min-height:40px;justify-content:center}.ctn-inf{display:flex;flex:1 0 0;align-items:center;gap:16px}.title-no-read{font-weight:500}.icon-account{color:#8c8c8c}.priority-tx{color:#497610}.info{display:flex;flex:1 0 0;flex-direction:column;align-items:flex-start}.ctn-icons{display:flex;align-items:center;gap:16px}.icon-dot{display:flex;align-items:center;width:8px;height:8px;aspect-ratio:1/1;background-color:#2167ff;border-radius:100px}.icon-dot-f{background-color:transparent}.fecha{width:76px}.buttons-hove{display:none;pointer-events:none;gap:4px;width:76px}.ctn-collapse-card{max-height:1000px;overflow:hidden;transition:max-height .3s ease-in-out}.ctn-collapse-card.collapsed{max-height:0px}.ctn-clp{display:flex;gap:8px}.buttons-clp{display:flex;padding:4px;flex-direction:column;gap:4px}.ctn-info-clp{display:flex;padding:4px 8px;flex-direction:column;gap:12px;flex:1 0 0}.text-info{display:flex;flex-direction:column;align-items:flex-start;flex:1 0 0}ius-simple-divider{margin:8px 0}.row-text-1{display:flex;align-items:center;gap:8px}.row-text-2{display:flex;align-items:center;gap:4px}.txt-pry{color:#333}.txt-sec{color:#595959}.txt-ter{color:#8c8c8c}\n"] }]
+                    ], template: "<div class=\"ctn-gnrl\" (click)=\"toggleCollapse()\">\r\n    <div class=\"ctn-card\">\r\n        <div class=\"ctn-inf\">\r\n            <ius-icon-sm iconName=\"icon-account-balance\" class=\"icon-account\"\r\n                [ngClass]=\"{'priority-tx': hasNotificacion || hasAuto }\"></ius-icon-sm>\r\n            <div class=\"info\">\r\n                <span class=\"caption-sm txt-ter\">Vigilancia Judicial</span>\r\n                <span class=\"body-base-1 txt-pry\" [ngClass]=\"{'title-no-read': read === false}\">{{titulo}}</span>\r\n                <span class=\"body-base-1 txt-sec\">{{juzgado}}</span>\r\n            </div>\r\n        </div>\r\n        <div class=\"ctn-icons\">\r\n            @if (hasNotificacion || hasAuto) {\r\n            <div class=\"row-text-1\">\r\n                @if (hasNotificacion) {\r\n                <ius-icon-sm iconName=\"icon-notification-2\" class=\"txt-sec\"></ius-icon-sm>\r\n                }\r\n                @if (hasAuto) {\r\n                <ius-icon-sm iconName=\"icon-docs-2\" class=\"txt-sec\"></ius-icon-sm>\r\n                }\r\n            </div>\r\n            }\r\n            <div class=\"row-text-2\">\r\n                <div class=\"icon-dot\" [ngClass]=\"{'icon-dot-f': read === true}\"></div>\r\n                <span class=\"body-sm txt-ter fecha\">{{fechaPrincipal | date: 'd MMM y'}}</span>\r\n                <span class=\"buttons-hove\">\r\n                    <ius-button-circle-tertiary iconName=\"icon-mark-chat-read\"\r\n                        [iusPopoverContent]=\"read ? 'Marcar como no le\u00EDdo' : 'Marcar como le\u00EDdo'\"\r\n                        (buttonClicked)=\"clickButtonRead($event)\"></ius-button-circle-tertiary>\r\n                    <ius-button-circle-tertiary iconName=\"icon-content-copy\"\r\n                        iusPopoverContent=\"Copiar informaci\u00F3n\"\r\n                        (buttonClicked)=\"clickButtonCopy($event)\"></ius-button-circle-tertiary>\r\n                </span>\r\n            </div>\r\n            <ius-icon-sm [iconName]=\"collapse ? 'icon-keyboard-arrow-down' : 'icon-keyboard-arrow-up'\"\r\n                class=\"txt-pry\"></ius-icon-sm>\r\n        </div>\r\n    </div>\r\n    <div class=\"ctn-collapse-card\" [ngClass]=\"{'collapsed': collapse}\">\r\n        <ius-simple-divider></ius-simple-divider>\r\n        <div class=\"ctn-clp\">\r\n            <div class=\"ctn-info-clp\">\r\n                @for (act of actuaciones; track $index) {\r\n                <div class=\"text-info\">\r\n                    <div class=\"row-text-1 body-sm txt-ter\">\r\n                        @if (act.fechaIniciaTermino) {\r\n                            <span>Inicia t\u00E9rmino: {{act.fechaIniciaTermino | date: 'd MMM y'}}</span>\r\n                        } @else {\r\n                            <span>Fecha registro: {{act.fechaActuacion | date: 'd MMM y'}}</span>\r\n                        }\r\n                        @if (act.fechaFinalizaTermino) {\r\n                            <span>-</span>\r\n                            <span>Finaliza t\u00E9rmino: {{act.fechaFinalizaTermino | date: 'd MMM y'}}</span>\r\n                        }\r\n                    </div>\r\n                    <span class=\"label-base txt-ter\">{{act.actuacion}}</span>\r\n                    <span class=\"body-base-1 txt-sec\">{{act.anotacion}}</span>\r\n                </div>\r\n                }\r\n            </div>\r\n            <div class=\"buttons-clp\">\r\n                @if (hasNotificacion) {\r\n                <ius-button-menu-link iconName=\"icon-notificacion\" iconColor=\"#184FDB\"\r\n                    iusPopoverContent=\"Ver notificaci\u00F3n\"\r\n                    (buttonClicked)=\"clickButtonNotificacion($event)\"></ius-button-menu-link>\r\n                <ius-simple-divider></ius-simple-divider>\r\n                }\r\n                @if (hasAuto) {\r\n                <ius-button-menu-link iconName=\"icon-docs\" iconColor=\"#184FDB\" iusPopoverContent=\"Ver auto\"\r\n                    (buttonClicked)=\"clickButtonAuto($event)\"></ius-button-menu-link>\r\n                <ius-simple-divider></ius-simple-divider>\r\n                }\r\n            </div>\r\n        </div>\r\n    </div>\r\n</div>", styles: [".h1{font-family:Roboto,sans-serif;font-size:2.375rem;font-weight:500;line-height:46px}.h2{font-family:Roboto,sans-serif;font-size:1.875rem;font-weight:700;line-height:38px}.h3{font-family:Roboto,sans-serif;font-size:1.5rem;font-weight:500;line-height:32px}.h4{font-family:Roboto,sans-serif;font-size:1.25rem;font-weight:700;line-height:26px}.h5{font-family:Roboto,sans-serif;font-size:1.125rem;font-weight:500;line-height:24px;letter-spacing:.18px}.label-large{font-family:Roboto,sans-serif;font-size:1rem;font-weight:500;line-height:22px}.body-large{font-family:Rubik,sans-serif;font-size:1rem;font-weight:400;line-height:22px}.label-base{font-family:Rubik,sans-serif;font-size:.875rem;font-weight:500;line-height:20px;letter-spacing:.28px}.body-base{font-family:Rubik,sans-serif;font-size:.875rem;font-weight:400;line-height:20px;font-style:italic;letter-spacing:.28px}.body-base-1,.body-base-1-1{font-family:Rubik,sans-serif;font-size:.875rem;font-weight:400;line-height:20px;letter-spacing:.28px}.body-sm{font-family:Rubik,sans-serif;font-size:.75rem;font-weight:400;line-height:16px;letter-spacing:.28px}.body-sm-italic{font-family:Rubik,sans-serif;font-size:.75rem;font-weight:400;line-height:16px;font-style:italic;letter-spacing:.28px}.caption-sm{font-family:Rubik,sans-serif;font-size:.75rem;font-weight:500;line-height:16px;letter-spacing:.28px}.caption-sm-italic{font-family:Rubik,sans-serif;font-size:.75rem;font-weight:500;line-height:16px;font-style:italic;letter-spacing:.28px}.ctn-gnrl{position:relative;display:flex;flex-direction:column;cursor:pointer;padding:8px 12px;box-sizing:border-box;border-radius:4px;border:1px solid #eaeaea}.ctn-gnrl:hover{border:1px solid #C4DFFF;box-shadow:0 1px 3px #0000001f,0 1px 2px #00000014}.ctn-gnrl:hover .fecha{display:none;pointer-events:none}.ctn-gnrl:hover .buttons-hove{display:flex;pointer-events:auto}.ctn-card{position:relative;display:flex;align-items:center;gap:24px;min-height:40px;justify-content:center}.ctn-inf{display:flex;flex:1 0 0;align-items:center;gap:16px}.title-no-read{font-weight:500}.icon-account{color:#8c8c8c}.priority-tx{color:#497610}.info{display:flex;flex:1 0 0;flex-direction:column;align-items:flex-start}.ctn-icons{display:flex;align-items:center;gap:16px}.icon-dot{display:flex;align-items:center;width:8px;height:8px;aspect-ratio:1/1;background-color:#2167ff;border-radius:100px}.icon-dot-f{background-color:transparent}.fecha{width:76px}.buttons-hove{display:none;pointer-events:none;gap:4px;width:76px}.ctn-collapse-card{max-height:1000px;overflow:hidden;transition:max-height .3s ease-in-out}.ctn-collapse-card.collapsed{max-height:0px}.ctn-clp{display:flex;gap:8px}.buttons-clp{display:flex;padding:4px;flex-direction:column;gap:4px}.ctn-info-clp{display:flex;padding:4px 8px;flex-direction:column;gap:12px;flex:1 0 0}.text-info{display:flex;flex-direction:column;align-items:flex-start;flex:1 0 0}ius-simple-divider{margin:8px 0}.row-text-1{display:flex;align-items:center;gap:8px}.row-text-2{display:flex;align-items:center;gap:4px}.txt-pry{color:#333}.txt-sec{color:#595959}.txt-ter{color:#8c8c8c}\n"] }]
         }], ctorParameters: () => [{ type: i1$1.DatePipe }], propDecorators: { collapse: [{
                 type: Input
             }], hasNotificacion: [{
@@ -7186,14 +7190,14 @@ class CardActividadEventoComponent {
     static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "17.3.12", type: CardActividadEventoComponent, isStandalone: true, selector: "ius-card-actividad-evento", inputs: { read: "read", warning: "warning", collapse: "collapse", done: "done", titulo: "titulo", usuarioAsignado: "usuarioAsignado", fechaProgramacion: "fechaProgramacion", fechaPrincipal: "fechaPrincipal", text1: "text1", estado: "estado", fechaInicio: "fechaInicio", fechaFin: "fechaFin", descripcion: "descripcion", link: "link" }, outputs: { onClickButtonCopy: "onClickButtonCopy", onClickButtonRead: "onClickButtonRead", onClickButtonEdit: "onClickButtonEdit", onClickButtonDelete: "onClickButtonDelete", onClickButtonDone: "onClickButtonDone" }, providers: [
             { provide: LOCALE_ID, useValue: 'es' },
             DatePipe
-        ], ngImport: i0, template: "<div class=\"ctn-gnrl\" (click)=\"toggleCollapse()\">\n    <div class=\"ctn-card\">\n        <div class=\"ctn-inf\">\n            <ius-icon-sm iconName=\"icon-calendar-clock\" class=\"priority-tx\"\n                [ngClass]=\"{'icon-calendar-clock': estado === 'FINALIZADA' }\"></ius-icon-sm>\n            <div class=\"info\">\n                <span class=\"caption-sm txt-ter\">Actividades y eventos</span>\n                <span class=\"label-base txt-pry\" [ngClass]=\"{'body-base-1': read}\">{{titulo}}</span>\n                <div class=\"tx-asig\">\n                    <div class=\"row-text-2\">\n                        <span class=\"caption-sm txt-ter\">Asignado a</span>\n                        <span class=\"body-base-1 txt-sec\">{{usuarioAsignado}}</span>\n                    </div>\n                    <div class=\"row-text-2\">\n                        <span class=\"caption-sm txt-ter\">{{ headerFechaLabel }}</span>\n                        <span class=\"body-base-1 txt-sec\">{{fechaProgramacion | date: 'dd MMM yyyy h:mm a'}}</span>\n                    </div>\n                </div>\n                <span class=\"body-base-1 txt-sec\">{{text1}}</span>\n            </div>\n        </div>\n        <div class=\"ctn-icons\">\n            <div class=\"row-text-2\">\n                @if (!read) {\n                <div class=\"icon-dot\"></div>\n                }\n                @if (warning && estado !== 'FINALIZADA') {\n                <ius-icon-xs iconName=\"icon-emergency-home\" class=\"icon-emergency-home\"></ius-icon-xs>\n                }\n                <span class=\"body-sm txt-ter fecha\">{{fechaPrincipal | date: 'd MMM y'}}</span>\n                <span class=\"buttons-hove\">\n                    <ius-button-circle-tertiary iconName=\"icon-mark-chat-read\"\n                        [iusPopoverContent]=\"read ? 'Marcar como no le\u00EDdo' : 'Marcar como le\u00EDdo'\"\n                        (buttonClicked)=\"clickButtonRead($event)\"></ius-button-circle-tertiary>\n                    <ius-button-circle-tertiary iconName=\"icon-content-copy\"\n                        iusPopoverContent=\"Copiar informaci\u00F3n\"\n                        (buttonClicked)=\"clickButtonCopy($event)\"></ius-button-circle-tertiary>\n                    <ius-button-circle-tertiary iconName=\"icon-done-outline\"\n                        [iusPopoverContent]=\"done ? 'Marcar como abierta' : 'Marcar como hecha'\"\n                        (buttonClicked)=\"clickButtonDone($event)\"></ius-button-circle-tertiary>\n                    <ius-button-circle-tertiary iconName=\"icon-edit\"\n                        iusPopoverContent=\"Editar\"\n                        (buttonClicked)=\"clickButtonEdit($event)\"></ius-button-circle-tertiary>\n                    <ius-button-circle-tertiary iconName=\"icon-delete\"\n                        iusPopoverContent=\"Eliminar\"\n                        (buttonClicked)=\"clickButtonDelete($event)\"></ius-button-circle-tertiary>\n                </span>\n            </div>\n            <ius-icon-sm [iconName]=\"collapse ? 'icon-keyboard-arrow-down' : 'icon-keyboard-arrow-up'\"\n                class=\"txt-pry\"></ius-icon-sm>\n        </div>\n    </div>\n    <div class=\"ctn-collapse-card\" [ngClass]=\"{'collapsed': collapse}\">\n        <ius-simple-divider></ius-simple-divider>\n        <div class=\"ctn-clp\">\n            <div class=\"ctn-info-clp\">\n                <div class=\"text-info\">\n                    <span class=\"label-base\" [ngClass]=\"estadoLabelClass\">{{ estadoLabel }}</span>\n                    <div class=\"row-text-1 body-sm txt-ter\">\n                        <span>{{fechaInicio | date: 'dd MMM yyyy h:mm a'}}</span>\n                        @if (fechaFin) {\n                        <span>-</span>\n                        <span>{{fechaFin | date: 'dd MMM yyyy h:mm a'}}</span>\n                        }\n                    </div>\n                    <span class=\"body-base-1 txt-pry\">{{descripcion}}</span>\n                    @if (link) {\n                        <a class=\"body-sm link-actividad\" (click)=\"openLink($event)\">\n                            <ius-icon-xs iconName=\"icon-link-2\"></ius-icon-xs>\n                            <span>{{ link }}</span>\n                        </a>\n                    }\n                </div>\n            </div>\n        </div>\n    </div>\n</div>\n", styles: [".h1{font-family:Roboto,sans-serif;font-size:2.375rem;font-weight:500;line-height:46px}.h2{font-family:Roboto,sans-serif;font-size:1.875rem;font-weight:700;line-height:38px}.h3{font-family:Roboto,sans-serif;font-size:1.5rem;font-weight:500;line-height:32px}.h4{font-family:Roboto,sans-serif;font-size:1.25rem;font-weight:700;line-height:26px}.h5{font-family:Roboto,sans-serif;font-size:1.125rem;font-weight:500;line-height:24px;letter-spacing:.18px}.label-large{font-family:Roboto,sans-serif;font-size:1rem;font-weight:500;line-height:22px}.body-large{font-family:Rubik,sans-serif;font-size:1rem;font-weight:400;line-height:22px}.label-base{font-family:Rubik,sans-serif;font-size:.875rem;font-weight:500;line-height:20px;letter-spacing:.28px}.body-base{font-family:Rubik,sans-serif;font-size:.875rem;font-weight:400;line-height:20px;font-style:italic;letter-spacing:.28px}.body-base-1,.body-base-1-1{font-family:Rubik,sans-serif;font-size:.875rem;font-weight:400;line-height:20px;letter-spacing:.28px}.body-sm{font-family:Rubik,sans-serif;font-size:.75rem;font-weight:400;line-height:16px;letter-spacing:.28px}.body-sm-italic{font-family:Rubik,sans-serif;font-size:.75rem;font-weight:400;line-height:16px;font-style:italic;letter-spacing:.28px}.caption-sm{font-family:Rubik,sans-serif;font-size:.75rem;font-weight:500;line-height:16px;letter-spacing:.28px}.caption-sm-italic{font-family:Rubik,sans-serif;font-size:.75rem;font-weight:500;line-height:16px;font-style:italic;letter-spacing:.28px}.ctn-gnrl{position:relative;display:flex;flex-direction:column;cursor:pointer;padding:8px 12px;box-sizing:border-box;border-radius:4px;border:1px solid #eaeaea}.ctn-gnrl:hover{border:1px solid #C4DFFF;box-shadow:0 1px 3px #0000001f,0 1px 2px #00000014}.ctn-gnrl:hover .fecha{display:none;pointer-events:none}.ctn-gnrl:hover .buttons-hove{display:flex;pointer-events:auto}.ctn-card{position:relative;display:flex;align-items:center;gap:24px}.ctn-inf{display:flex;flex:1 0 0;align-items:center;gap:16px}.icon-calendar-clock{color:#8c8c8c!important}.priority-tx{color:#184fdb}.tx-asig{display:flex;gap:24px}.info{display:flex;flex:1 0 0;flex-direction:column;align-items:flex-start}.ctn-icons{display:flex;align-items:center;gap:16px}.icon-dot{display:flex;align-items:center;width:8px;height:8px;aspect-ratio:1/1;background-color:#2167ff;border-radius:100px}.icon-dot-warning{display:flex;align-items:center;width:8px;height:8px;aspect-ratio:1/1;background-color:#ffae00;border-radius:100px}.icon-emergency-home{color:#ffae00}.fecha{width:76px}.buttons-hove{display:none;pointer-events:none;gap:4px}.ctn-collapse-card{max-height:1000px;overflow:hidden;transition:max-height .3s ease-in-out}.ctn-collapse-card.collapsed{max-height:0px}.ctn-clp{display:flex;gap:8px}.ctn-info-clp{display:flex;padding:4px 8px;flex-direction:column;gap:12px;flex:1 0 0}.text-info{display:flex;flex-direction:column;align-items:flex-start;flex:1 0 0}.tx-read{color:#629219}.tx-warn{color:#db8e00}ius-simple-divider{margin:8px 0}.row-text-1{display:flex;align-items:center;gap:8px}.row-text-2{display:flex;align-items:center;gap:4px}.txt-pry{color:#333}.txt-sec{color:#595959}.txt-ter{color:#8c8c8c}.link-actividad{display:inline-flex;align-items:center;gap:4px;margin-top:4px;padding:4px 8px;border-radius:4px;color:#595959;cursor:pointer;text-decoration:none;word-break:break-all}.link-actividad:hover{background-color:#edf6ff;text-decoration:underline}\n"], dependencies: [{ kind: "component", type: IconSmComponent, selector: "ius-icon-sm", inputs: ["iconName", "color"] }, { kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "component", type: ButtonCircleTertiaryComponent, selector: "ius-button-circle-tertiary", inputs: ["disabled", "iconName"], outputs: ["buttonClicked"] }, { kind: "component", type: SimpleDividerComponent, selector: "ius-simple-divider" }, { kind: "component", type: IconXsComponent, selector: "ius-icon-xs", inputs: ["iconName", "color"] }, { kind: "pipe", type: DatePipe, name: "date" }, { kind: "directive", type: PopoverDirective, selector: "[iusPopover], [iusPopoverTitle], [iusPopoverContent]", inputs: ["iusPopover", "iusPopoverTitle", "iusPopoverContent", "iusPopoverPosition", "iusPopoverOpenDelay", "iusPopoverCloseDelay"] }] }); }
+        ], ngImport: i0, template: "<div class=\"ctn-gnrl\" (click)=\"toggleCollapse()\">\r\n    <div class=\"ctn-card\">\r\n        <div class=\"ctn-inf\">\r\n            <ius-icon-sm iconName=\"icon-calendar-clock\" class=\"priority-tx\"\r\n                [ngClass]=\"{'icon-calendar-clock': estado === 'FINALIZADA' }\"></ius-icon-sm>\r\n            <div class=\"info\">\r\n                <span class=\"caption-sm txt-ter\">Actividades y eventos</span>\r\n                <span class=\"label-base txt-pry\" [ngClass]=\"{'body-base-1': read}\">{{titulo}}</span>\r\n                <div class=\"tx-asig\">\r\n                    <div class=\"row-text-2\">\r\n                        <span class=\"caption-sm txt-ter\">Asignado a</span>\r\n                        <span class=\"body-base-1 txt-sec\">{{usuarioAsignado}}</span>\r\n                    </div>\r\n                    <div class=\"row-text-2\">\r\n                        <span class=\"caption-sm txt-ter\">{{ headerFechaLabel }}</span>\r\n                        <span class=\"body-base-1 txt-sec\">{{fechaProgramacion | date: 'dd MMM yyyy h:mm a'}}</span>\r\n                    </div>\r\n                </div>\r\n                <span class=\"body-base-1 txt-sec\">{{text1}}</span>\r\n            </div>\r\n        </div>\r\n        <div class=\"ctn-icons\">\r\n            <div class=\"row-text-2\">\r\n                @if (!read) {\r\n                <div class=\"icon-dot\"></div>\r\n                }\r\n                @if (warning && estado !== 'FINALIZADA') {\r\n                <ius-icon-xs iconName=\"icon-emergency-home\" class=\"icon-emergency-home\"></ius-icon-xs>\r\n                }\r\n                <span class=\"body-sm txt-ter fecha\">{{fechaPrincipal | date: 'd MMM y'}}</span>\r\n                <span class=\"buttons-hove\">\r\n                    <ius-button-circle-tertiary iconName=\"icon-mark-chat-read\"\r\n                        [iusPopoverContent]=\"read ? 'Marcar como no le\u00EDdo' : 'Marcar como le\u00EDdo'\"\r\n                        (buttonClicked)=\"clickButtonRead($event)\"></ius-button-circle-tertiary>\r\n                    <ius-button-circle-tertiary iconName=\"icon-content-copy\"\r\n                        iusPopoverContent=\"Copiar informaci\u00F3n\"\r\n                        (buttonClicked)=\"clickButtonCopy($event)\"></ius-button-circle-tertiary>\r\n                    <ius-button-circle-tertiary iconName=\"icon-done-outline\"\r\n                        [iusPopoverContent]=\"done ? 'Marcar como abierta' : 'Marcar como hecha'\"\r\n                        (buttonClicked)=\"clickButtonDone($event)\"></ius-button-circle-tertiary>\r\n                    <ius-button-circle-tertiary iconName=\"icon-edit\"\r\n                        iusPopoverContent=\"Editar\"\r\n                        (buttonClicked)=\"clickButtonEdit($event)\"></ius-button-circle-tertiary>\r\n                    <ius-button-circle-tertiary iconName=\"icon-delete\"\r\n                        iusPopoverContent=\"Eliminar\"\r\n                        (buttonClicked)=\"clickButtonDelete($event)\"></ius-button-circle-tertiary>\r\n                </span>\r\n            </div>\r\n            <ius-icon-sm [iconName]=\"collapse ? 'icon-keyboard-arrow-down' : 'icon-keyboard-arrow-up'\"\r\n                class=\"txt-pry\"></ius-icon-sm>\r\n        </div>\r\n    </div>\r\n    <div class=\"ctn-collapse-card\" [ngClass]=\"{'collapsed': collapse}\">\r\n        <ius-simple-divider></ius-simple-divider>\r\n        <div class=\"ctn-clp\">\r\n            <div class=\"ctn-info-clp\">\r\n                <div class=\"text-info\">\r\n                    <span class=\"label-base\" [ngClass]=\"estadoLabelClass\">{{ estadoLabel }}</span>\r\n                    <div class=\"row-text-1 body-sm txt-ter\">\r\n                        <span>{{fechaInicio | date: 'dd MMM yyyy h:mm a'}}</span>\r\n                        @if (fechaFin) {\r\n                        <span>-</span>\r\n                        <span>{{fechaFin | date: 'dd MMM yyyy h:mm a'}}</span>\r\n                        }\r\n                    </div>\r\n                    <span class=\"body-base-1 txt-pry\">{{descripcion}}</span>\r\n                    @if (link) {\r\n                        <a class=\"body-sm link-actividad\" (click)=\"openLink($event)\">\r\n                            <ius-icon-xs iconName=\"icon-link-2\"></ius-icon-xs>\r\n                            <span>{{ link }}</span>\r\n                        </a>\r\n                    }\r\n                </div>\r\n            </div>\r\n        </div>\r\n    </div>\r\n</div>\r\n", styles: [".h1{font-family:Roboto,sans-serif;font-size:2.375rem;font-weight:500;line-height:46px}.h2{font-family:Roboto,sans-serif;font-size:1.875rem;font-weight:700;line-height:38px}.h3{font-family:Roboto,sans-serif;font-size:1.5rem;font-weight:500;line-height:32px}.h4{font-family:Roboto,sans-serif;font-size:1.25rem;font-weight:700;line-height:26px}.h5{font-family:Roboto,sans-serif;font-size:1.125rem;font-weight:500;line-height:24px;letter-spacing:.18px}.label-large{font-family:Roboto,sans-serif;font-size:1rem;font-weight:500;line-height:22px}.body-large{font-family:Rubik,sans-serif;font-size:1rem;font-weight:400;line-height:22px}.label-base{font-family:Rubik,sans-serif;font-size:.875rem;font-weight:500;line-height:20px;letter-spacing:.28px}.body-base{font-family:Rubik,sans-serif;font-size:.875rem;font-weight:400;line-height:20px;font-style:italic;letter-spacing:.28px}.body-base-1,.body-base-1-1{font-family:Rubik,sans-serif;font-size:.875rem;font-weight:400;line-height:20px;letter-spacing:.28px}.body-sm{font-family:Rubik,sans-serif;font-size:.75rem;font-weight:400;line-height:16px;letter-spacing:.28px}.body-sm-italic{font-family:Rubik,sans-serif;font-size:.75rem;font-weight:400;line-height:16px;font-style:italic;letter-spacing:.28px}.caption-sm{font-family:Rubik,sans-serif;font-size:.75rem;font-weight:500;line-height:16px;letter-spacing:.28px}.caption-sm-italic{font-family:Rubik,sans-serif;font-size:.75rem;font-weight:500;line-height:16px;font-style:italic;letter-spacing:.28px}.ctn-gnrl{position:relative;display:flex;flex-direction:column;cursor:pointer;padding:8px 12px;box-sizing:border-box;border-radius:4px;border:1px solid #eaeaea}.ctn-gnrl:hover{border:1px solid #C4DFFF;box-shadow:0 1px 3px #0000001f,0 1px 2px #00000014}.ctn-gnrl:hover .fecha{display:none;pointer-events:none}.ctn-gnrl:hover .buttons-hove{display:flex;pointer-events:auto}.ctn-card{position:relative;display:flex;align-items:center;gap:24px}.ctn-inf{display:flex;flex:1 0 0;align-items:center;gap:16px}.icon-calendar-clock{color:#8c8c8c!important}.priority-tx{color:#184fdb}.tx-asig{display:flex;gap:24px}.info{display:flex;flex:1 0 0;flex-direction:column;align-items:flex-start}.ctn-icons{display:flex;align-items:center;gap:16px}.icon-dot{display:flex;align-items:center;width:8px;height:8px;aspect-ratio:1/1;background-color:#2167ff;border-radius:100px}.icon-dot-warning{display:flex;align-items:center;width:8px;height:8px;aspect-ratio:1/1;background-color:#ffae00;border-radius:100px}.icon-emergency-home{color:#ffae00}.fecha{width:76px}.buttons-hove{display:none;pointer-events:none;gap:4px}.ctn-collapse-card{max-height:1000px;overflow:hidden;transition:max-height .3s ease-in-out}.ctn-collapse-card.collapsed{max-height:0px}.ctn-clp{display:flex;gap:8px}.ctn-info-clp{display:flex;padding:4px 8px;flex-direction:column;gap:12px;flex:1 0 0}.text-info{display:flex;flex-direction:column;align-items:flex-start;flex:1 0 0}.tx-read{color:#629219}.tx-warn{color:#db8e00}ius-simple-divider{margin:8px 0}.row-text-1{display:flex;align-items:center;gap:8px}.row-text-2{display:flex;align-items:center;gap:4px}.txt-pry{color:#333}.txt-sec{color:#595959}.txt-ter{color:#8c8c8c}.link-actividad{display:inline-flex;align-items:center;gap:4px;margin-top:4px;padding:4px 8px;border-radius:4px;color:#595959;cursor:pointer;text-decoration:none;word-break:break-all}.link-actividad:hover{background-color:#edf6ff;text-decoration:underline}\n"], dependencies: [{ kind: "component", type: IconSmComponent, selector: "ius-icon-sm", inputs: ["iconName", "color"] }, { kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "component", type: ButtonCircleTertiaryComponent, selector: "ius-button-circle-tertiary", inputs: ["disabled", "iconName"], outputs: ["buttonClicked"] }, { kind: "component", type: SimpleDividerComponent, selector: "ius-simple-divider" }, { kind: "component", type: IconXsComponent, selector: "ius-icon-xs", inputs: ["iconName", "color"] }, { kind: "pipe", type: DatePipe, name: "date" }, { kind: "directive", type: PopoverDirective, selector: "[iusPopover], [iusPopoverTitle], [iusPopoverContent]", inputs: ["iusPopover", "iusPopoverTitle", "iusPopoverContent", "iusPopoverPosition", "iusPopoverOpenDelay", "iusPopoverCloseDelay"] }] }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: CardActividadEventoComponent, decorators: [{
             type: Component,
             args: [{ selector: 'ius-card-actividad-evento', standalone: true, imports: [IconSmComponent, NgClass, ButtonCircleTertiaryComponent, SimpleDividerComponent, IconXsComponent, DatePipe, PopoverDirective], providers: [
                         { provide: LOCALE_ID, useValue: 'es' },
                         DatePipe
-                    ], template: "<div class=\"ctn-gnrl\" (click)=\"toggleCollapse()\">\n    <div class=\"ctn-card\">\n        <div class=\"ctn-inf\">\n            <ius-icon-sm iconName=\"icon-calendar-clock\" class=\"priority-tx\"\n                [ngClass]=\"{'icon-calendar-clock': estado === 'FINALIZADA' }\"></ius-icon-sm>\n            <div class=\"info\">\n                <span class=\"caption-sm txt-ter\">Actividades y eventos</span>\n                <span class=\"label-base txt-pry\" [ngClass]=\"{'body-base-1': read}\">{{titulo}}</span>\n                <div class=\"tx-asig\">\n                    <div class=\"row-text-2\">\n                        <span class=\"caption-sm txt-ter\">Asignado a</span>\n                        <span class=\"body-base-1 txt-sec\">{{usuarioAsignado}}</span>\n                    </div>\n                    <div class=\"row-text-2\">\n                        <span class=\"caption-sm txt-ter\">{{ headerFechaLabel }}</span>\n                        <span class=\"body-base-1 txt-sec\">{{fechaProgramacion | date: 'dd MMM yyyy h:mm a'}}</span>\n                    </div>\n                </div>\n                <span class=\"body-base-1 txt-sec\">{{text1}}</span>\n            </div>\n        </div>\n        <div class=\"ctn-icons\">\n            <div class=\"row-text-2\">\n                @if (!read) {\n                <div class=\"icon-dot\"></div>\n                }\n                @if (warning && estado !== 'FINALIZADA') {\n                <ius-icon-xs iconName=\"icon-emergency-home\" class=\"icon-emergency-home\"></ius-icon-xs>\n                }\n                <span class=\"body-sm txt-ter fecha\">{{fechaPrincipal | date: 'd MMM y'}}</span>\n                <span class=\"buttons-hove\">\n                    <ius-button-circle-tertiary iconName=\"icon-mark-chat-read\"\n                        [iusPopoverContent]=\"read ? 'Marcar como no le\u00EDdo' : 'Marcar como le\u00EDdo'\"\n                        (buttonClicked)=\"clickButtonRead($event)\"></ius-button-circle-tertiary>\n                    <ius-button-circle-tertiary iconName=\"icon-content-copy\"\n                        iusPopoverContent=\"Copiar informaci\u00F3n\"\n                        (buttonClicked)=\"clickButtonCopy($event)\"></ius-button-circle-tertiary>\n                    <ius-button-circle-tertiary iconName=\"icon-done-outline\"\n                        [iusPopoverContent]=\"done ? 'Marcar como abierta' : 'Marcar como hecha'\"\n                        (buttonClicked)=\"clickButtonDone($event)\"></ius-button-circle-tertiary>\n                    <ius-button-circle-tertiary iconName=\"icon-edit\"\n                        iusPopoverContent=\"Editar\"\n                        (buttonClicked)=\"clickButtonEdit($event)\"></ius-button-circle-tertiary>\n                    <ius-button-circle-tertiary iconName=\"icon-delete\"\n                        iusPopoverContent=\"Eliminar\"\n                        (buttonClicked)=\"clickButtonDelete($event)\"></ius-button-circle-tertiary>\n                </span>\n            </div>\n            <ius-icon-sm [iconName]=\"collapse ? 'icon-keyboard-arrow-down' : 'icon-keyboard-arrow-up'\"\n                class=\"txt-pry\"></ius-icon-sm>\n        </div>\n    </div>\n    <div class=\"ctn-collapse-card\" [ngClass]=\"{'collapsed': collapse}\">\n        <ius-simple-divider></ius-simple-divider>\n        <div class=\"ctn-clp\">\n            <div class=\"ctn-info-clp\">\n                <div class=\"text-info\">\n                    <span class=\"label-base\" [ngClass]=\"estadoLabelClass\">{{ estadoLabel }}</span>\n                    <div class=\"row-text-1 body-sm txt-ter\">\n                        <span>{{fechaInicio | date: 'dd MMM yyyy h:mm a'}}</span>\n                        @if (fechaFin) {\n                        <span>-</span>\n                        <span>{{fechaFin | date: 'dd MMM yyyy h:mm a'}}</span>\n                        }\n                    </div>\n                    <span class=\"body-base-1 txt-pry\">{{descripcion}}</span>\n                    @if (link) {\n                        <a class=\"body-sm link-actividad\" (click)=\"openLink($event)\">\n                            <ius-icon-xs iconName=\"icon-link-2\"></ius-icon-xs>\n                            <span>{{ link }}</span>\n                        </a>\n                    }\n                </div>\n            </div>\n        </div>\n    </div>\n</div>\n", styles: [".h1{font-family:Roboto,sans-serif;font-size:2.375rem;font-weight:500;line-height:46px}.h2{font-family:Roboto,sans-serif;font-size:1.875rem;font-weight:700;line-height:38px}.h3{font-family:Roboto,sans-serif;font-size:1.5rem;font-weight:500;line-height:32px}.h4{font-family:Roboto,sans-serif;font-size:1.25rem;font-weight:700;line-height:26px}.h5{font-family:Roboto,sans-serif;font-size:1.125rem;font-weight:500;line-height:24px;letter-spacing:.18px}.label-large{font-family:Roboto,sans-serif;font-size:1rem;font-weight:500;line-height:22px}.body-large{font-family:Rubik,sans-serif;font-size:1rem;font-weight:400;line-height:22px}.label-base{font-family:Rubik,sans-serif;font-size:.875rem;font-weight:500;line-height:20px;letter-spacing:.28px}.body-base{font-family:Rubik,sans-serif;font-size:.875rem;font-weight:400;line-height:20px;font-style:italic;letter-spacing:.28px}.body-base-1,.body-base-1-1{font-family:Rubik,sans-serif;font-size:.875rem;font-weight:400;line-height:20px;letter-spacing:.28px}.body-sm{font-family:Rubik,sans-serif;font-size:.75rem;font-weight:400;line-height:16px;letter-spacing:.28px}.body-sm-italic{font-family:Rubik,sans-serif;font-size:.75rem;font-weight:400;line-height:16px;font-style:italic;letter-spacing:.28px}.caption-sm{font-family:Rubik,sans-serif;font-size:.75rem;font-weight:500;line-height:16px;letter-spacing:.28px}.caption-sm-italic{font-family:Rubik,sans-serif;font-size:.75rem;font-weight:500;line-height:16px;font-style:italic;letter-spacing:.28px}.ctn-gnrl{position:relative;display:flex;flex-direction:column;cursor:pointer;padding:8px 12px;box-sizing:border-box;border-radius:4px;border:1px solid #eaeaea}.ctn-gnrl:hover{border:1px solid #C4DFFF;box-shadow:0 1px 3px #0000001f,0 1px 2px #00000014}.ctn-gnrl:hover .fecha{display:none;pointer-events:none}.ctn-gnrl:hover .buttons-hove{display:flex;pointer-events:auto}.ctn-card{position:relative;display:flex;align-items:center;gap:24px}.ctn-inf{display:flex;flex:1 0 0;align-items:center;gap:16px}.icon-calendar-clock{color:#8c8c8c!important}.priority-tx{color:#184fdb}.tx-asig{display:flex;gap:24px}.info{display:flex;flex:1 0 0;flex-direction:column;align-items:flex-start}.ctn-icons{display:flex;align-items:center;gap:16px}.icon-dot{display:flex;align-items:center;width:8px;height:8px;aspect-ratio:1/1;background-color:#2167ff;border-radius:100px}.icon-dot-warning{display:flex;align-items:center;width:8px;height:8px;aspect-ratio:1/1;background-color:#ffae00;border-radius:100px}.icon-emergency-home{color:#ffae00}.fecha{width:76px}.buttons-hove{display:none;pointer-events:none;gap:4px}.ctn-collapse-card{max-height:1000px;overflow:hidden;transition:max-height .3s ease-in-out}.ctn-collapse-card.collapsed{max-height:0px}.ctn-clp{display:flex;gap:8px}.ctn-info-clp{display:flex;padding:4px 8px;flex-direction:column;gap:12px;flex:1 0 0}.text-info{display:flex;flex-direction:column;align-items:flex-start;flex:1 0 0}.tx-read{color:#629219}.tx-warn{color:#db8e00}ius-simple-divider{margin:8px 0}.row-text-1{display:flex;align-items:center;gap:8px}.row-text-2{display:flex;align-items:center;gap:4px}.txt-pry{color:#333}.txt-sec{color:#595959}.txt-ter{color:#8c8c8c}.link-actividad{display:inline-flex;align-items:center;gap:4px;margin-top:4px;padding:4px 8px;border-radius:4px;color:#595959;cursor:pointer;text-decoration:none;word-break:break-all}.link-actividad:hover{background-color:#edf6ff;text-decoration:underline}\n"] }]
+                    ], template: "<div class=\"ctn-gnrl\" (click)=\"toggleCollapse()\">\r\n    <div class=\"ctn-card\">\r\n        <div class=\"ctn-inf\">\r\n            <ius-icon-sm iconName=\"icon-calendar-clock\" class=\"priority-tx\"\r\n                [ngClass]=\"{'icon-calendar-clock': estado === 'FINALIZADA' }\"></ius-icon-sm>\r\n            <div class=\"info\">\r\n                <span class=\"caption-sm txt-ter\">Actividades y eventos</span>\r\n                <span class=\"label-base txt-pry\" [ngClass]=\"{'body-base-1': read}\">{{titulo}}</span>\r\n                <div class=\"tx-asig\">\r\n                    <div class=\"row-text-2\">\r\n                        <span class=\"caption-sm txt-ter\">Asignado a</span>\r\n                        <span class=\"body-base-1 txt-sec\">{{usuarioAsignado}}</span>\r\n                    </div>\r\n                    <div class=\"row-text-2\">\r\n                        <span class=\"caption-sm txt-ter\">{{ headerFechaLabel }}</span>\r\n                        <span class=\"body-base-1 txt-sec\">{{fechaProgramacion | date: 'dd MMM yyyy h:mm a'}}</span>\r\n                    </div>\r\n                </div>\r\n                <span class=\"body-base-1 txt-sec\">{{text1}}</span>\r\n            </div>\r\n        </div>\r\n        <div class=\"ctn-icons\">\r\n            <div class=\"row-text-2\">\r\n                @if (!read) {\r\n                <div class=\"icon-dot\"></div>\r\n                }\r\n                @if (warning && estado !== 'FINALIZADA') {\r\n                <ius-icon-xs iconName=\"icon-emergency-home\" class=\"icon-emergency-home\"></ius-icon-xs>\r\n                }\r\n                <span class=\"body-sm txt-ter fecha\">{{fechaPrincipal | date: 'd MMM y'}}</span>\r\n                <span class=\"buttons-hove\">\r\n                    <ius-button-circle-tertiary iconName=\"icon-mark-chat-read\"\r\n                        [iusPopoverContent]=\"read ? 'Marcar como no le\u00EDdo' : 'Marcar como le\u00EDdo'\"\r\n                        (buttonClicked)=\"clickButtonRead($event)\"></ius-button-circle-tertiary>\r\n                    <ius-button-circle-tertiary iconName=\"icon-content-copy\"\r\n                        iusPopoverContent=\"Copiar informaci\u00F3n\"\r\n                        (buttonClicked)=\"clickButtonCopy($event)\"></ius-button-circle-tertiary>\r\n                    <ius-button-circle-tertiary iconName=\"icon-done-outline\"\r\n                        [iusPopoverContent]=\"done ? 'Marcar como abierta' : 'Marcar como hecha'\"\r\n                        (buttonClicked)=\"clickButtonDone($event)\"></ius-button-circle-tertiary>\r\n                    <ius-button-circle-tertiary iconName=\"icon-edit\"\r\n                        iusPopoverContent=\"Editar\"\r\n                        (buttonClicked)=\"clickButtonEdit($event)\"></ius-button-circle-tertiary>\r\n                    <ius-button-circle-tertiary iconName=\"icon-delete\"\r\n                        iusPopoverContent=\"Eliminar\"\r\n                        (buttonClicked)=\"clickButtonDelete($event)\"></ius-button-circle-tertiary>\r\n                </span>\r\n            </div>\r\n            <ius-icon-sm [iconName]=\"collapse ? 'icon-keyboard-arrow-down' : 'icon-keyboard-arrow-up'\"\r\n                class=\"txt-pry\"></ius-icon-sm>\r\n        </div>\r\n    </div>\r\n    <div class=\"ctn-collapse-card\" [ngClass]=\"{'collapsed': collapse}\">\r\n        <ius-simple-divider></ius-simple-divider>\r\n        <div class=\"ctn-clp\">\r\n            <div class=\"ctn-info-clp\">\r\n                <div class=\"text-info\">\r\n                    <span class=\"label-base\" [ngClass]=\"estadoLabelClass\">{{ estadoLabel }}</span>\r\n                    <div class=\"row-text-1 body-sm txt-ter\">\r\n                        <span>{{fechaInicio | date: 'dd MMM yyyy h:mm a'}}</span>\r\n                        @if (fechaFin) {\r\n                        <span>-</span>\r\n                        <span>{{fechaFin | date: 'dd MMM yyyy h:mm a'}}</span>\r\n                        }\r\n                    </div>\r\n                    <span class=\"body-base-1 txt-pry\">{{descripcion}}</span>\r\n                    @if (link) {\r\n                        <a class=\"body-sm link-actividad\" (click)=\"openLink($event)\">\r\n                            <ius-icon-xs iconName=\"icon-link-2\"></ius-icon-xs>\r\n                            <span>{{ link }}</span>\r\n                        </a>\r\n                    }\r\n                </div>\r\n            </div>\r\n        </div>\r\n    </div>\r\n</div>\r\n", styles: [".h1{font-family:Roboto,sans-serif;font-size:2.375rem;font-weight:500;line-height:46px}.h2{font-family:Roboto,sans-serif;font-size:1.875rem;font-weight:700;line-height:38px}.h3{font-family:Roboto,sans-serif;font-size:1.5rem;font-weight:500;line-height:32px}.h4{font-family:Roboto,sans-serif;font-size:1.25rem;font-weight:700;line-height:26px}.h5{font-family:Roboto,sans-serif;font-size:1.125rem;font-weight:500;line-height:24px;letter-spacing:.18px}.label-large{font-family:Roboto,sans-serif;font-size:1rem;font-weight:500;line-height:22px}.body-large{font-family:Rubik,sans-serif;font-size:1rem;font-weight:400;line-height:22px}.label-base{font-family:Rubik,sans-serif;font-size:.875rem;font-weight:500;line-height:20px;letter-spacing:.28px}.body-base{font-family:Rubik,sans-serif;font-size:.875rem;font-weight:400;line-height:20px;font-style:italic;letter-spacing:.28px}.body-base-1,.body-base-1-1{font-family:Rubik,sans-serif;font-size:.875rem;font-weight:400;line-height:20px;letter-spacing:.28px}.body-sm{font-family:Rubik,sans-serif;font-size:.75rem;font-weight:400;line-height:16px;letter-spacing:.28px}.body-sm-italic{font-family:Rubik,sans-serif;font-size:.75rem;font-weight:400;line-height:16px;font-style:italic;letter-spacing:.28px}.caption-sm{font-family:Rubik,sans-serif;font-size:.75rem;font-weight:500;line-height:16px;letter-spacing:.28px}.caption-sm-italic{font-family:Rubik,sans-serif;font-size:.75rem;font-weight:500;line-height:16px;font-style:italic;letter-spacing:.28px}.ctn-gnrl{position:relative;display:flex;flex-direction:column;cursor:pointer;padding:8px 12px;box-sizing:border-box;border-radius:4px;border:1px solid #eaeaea}.ctn-gnrl:hover{border:1px solid #C4DFFF;box-shadow:0 1px 3px #0000001f,0 1px 2px #00000014}.ctn-gnrl:hover .fecha{display:none;pointer-events:none}.ctn-gnrl:hover .buttons-hove{display:flex;pointer-events:auto}.ctn-card{position:relative;display:flex;align-items:center;gap:24px}.ctn-inf{display:flex;flex:1 0 0;align-items:center;gap:16px}.icon-calendar-clock{color:#8c8c8c!important}.priority-tx{color:#184fdb}.tx-asig{display:flex;gap:24px}.info{display:flex;flex:1 0 0;flex-direction:column;align-items:flex-start}.ctn-icons{display:flex;align-items:center;gap:16px}.icon-dot{display:flex;align-items:center;width:8px;height:8px;aspect-ratio:1/1;background-color:#2167ff;border-radius:100px}.icon-dot-warning{display:flex;align-items:center;width:8px;height:8px;aspect-ratio:1/1;background-color:#ffae00;border-radius:100px}.icon-emergency-home{color:#ffae00}.fecha{width:76px}.buttons-hove{display:none;pointer-events:none;gap:4px}.ctn-collapse-card{max-height:1000px;overflow:hidden;transition:max-height .3s ease-in-out}.ctn-collapse-card.collapsed{max-height:0px}.ctn-clp{display:flex;gap:8px}.ctn-info-clp{display:flex;padding:4px 8px;flex-direction:column;gap:12px;flex:1 0 0}.text-info{display:flex;flex-direction:column;align-items:flex-start;flex:1 0 0}.tx-read{color:#629219}.tx-warn{color:#db8e00}ius-simple-divider{margin:8px 0}.row-text-1{display:flex;align-items:center;gap:8px}.row-text-2{display:flex;align-items:center;gap:4px}.txt-pry{color:#333}.txt-sec{color:#595959}.txt-ter{color:#8c8c8c}.link-actividad{display:inline-flex;align-items:center;gap:4px;margin-top:4px;padding:4px 8px;border-radius:4px;color:#595959;cursor:pointer;text-decoration:none;word-break:break-all}.link-actividad:hover{background-color:#edf6ff;text-decoration:underline}\n"] }]
         }], ctorParameters: () => [{ type: i1$1.DatePipe }], propDecorators: { read: [{
                 type: Input
             }], warning: [{
@@ -7308,14 +7312,14 @@ class CardEtapaSubetapaComponent {
     static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "17.3.12", type: CardEtapaSubetapaComponent, isStandalone: true, selector: "ius-card-etapa-subetapa", inputs: { priority: "priority", hasDocuments: "hasDocuments", read: "read", collapse: "collapse", etapa: "etapa", subEtapa: "subEtapa", text1: "text1", origen: "origen", fechaPrincipal: "fechaPrincipal", descripcion: "descripcion" }, outputs: { onClickButtonCopy: "onClickButtonCopy", onClickButtonRead: "onClickButtonRead", onClickButtonEdit: "onClickButtonEdit", onClickButtonDelete: "onClickButtonDelete", onClickButtonDocs: "onClickButtonDocs" }, providers: [
             { provide: LOCALE_ID, useValue: 'es' },
             DatePipe
-        ], ngImport: i0, template: "<div class=\"ctn-gnrl\" (click)=\"toggleCollapse()\">\n    <div class=\"ctn-card\">\n        <div class=\"ctn-inf\">\n            <ius-icon-sm iconName=\"icon-book-5\" class=\"icon-book-5\"></ius-icon-sm>\n            <div class=\"info\">\n                <span class=\"caption-sm txt-ter\">Etapas Procesales</span>\n                <div class=\"body-base-1 row-text-1 txt-pry\" [ngClass]=\"{'title-no-read': read === false}\">\n                    <span>{{etapa}}</span>\n                    <span>-</span>\n                    <span>{{subEtapa}}</span>\n                </div>\n                <div class=\"body-base-1 txt-sec row-text-1\">\n                    <span>{{text1}}</span>\n                    @if (origen) {\n                    <span>-</span>\n                    <span>{{origen}}</span>\n                    }\n                </div>\n            </div>\n        </div>\n        <div class=\"ctn-icons\">\n            @if (hasDocuments) {\n            <div class=\"row-text-1\">\n                <ius-icon-sm iconName=\"icon-attach-file\" class=\"txt-sec\"></ius-icon-sm>\n            </div>\n            }\n            <div class=\"row-text-2\">\n                <div class=\"icon-dot\" [ngClass]=\"{'icon-dot-f': read === false}\"></div>\n                <span class=\"body-sm txt-ter fecha\">{{fechaPrincipal | date: 'd MMM yyyy'}}</span>\n                <span class=\"buttons-hove\">\n                    <ius-button-circle-tertiary iconName=\"icon-mark-chat-read\"\n                        [iusPopoverContent]=\"read ? 'Marcar como no le\u00EDdo' : 'Marcar como le\u00EDdo'\"\n                        (buttonClicked)=\"clickButtonRead($event)\"></ius-button-circle-tertiary>\n                    <ius-button-circle-tertiary iconName=\"icon-content-copy\"\n                        iusPopoverContent=\"Copiar informaci\u00F3n\"\n                        (buttonClicked)=\"clickButtonCopy($event)\"></ius-button-circle-tertiary>\n                    <ius-button-circle-tertiary iconName=\"icon-edit\"\n                        iusPopoverContent=\"Editar\"\n                        (buttonClicked)=\"clickButtonEdit($event)\"></ius-button-circle-tertiary>\n                    <ius-button-circle-tertiary iconName=\"icon-delete\"\n                        iusPopoverContent=\"Eliminar\"\n                        (buttonClicked)=\"clickButtonDelete($event)\"></ius-button-circle-tertiary>\n                </span>\n            </div>\n            <ius-icon-sm [iconName]=\"collapse ? 'icon-keyboard-arrow-down' : 'icon-keyboard-arrow-up'\"\n                class=\"txt-pry\"></ius-icon-sm>\n        </div>\n    </div>\n    <div class=\"ctn-collapse-card\" [ngClass]=\"{'collapsed': collapse}\">\n        <ius-simple-divider></ius-simple-divider>\n        <div class=\"ctn-clp\">\n            <div class=\"ctn-info-clp\">\n                <div class=\"text-info\">\n                    <span class=\"body-base-1 txt-pry\">{{descripcion}}</span>\n                </div>\n            </div>\n            <div class=\"buttons-clp\">\n                @if (hasDocuments) {\n                <ius-button-menu-link iconName=\"icon-attach-file\" iconColor=\"#184FDB\"\n                    iusPopoverContent=\"Ver documentos\"\n                    (buttonClicked)=\"clickButtonDocs($event)\"></ius-button-menu-link>\n                }\n            </div>\n        </div>\n    </div>\n</div>", styles: [".h1{font-family:Roboto,sans-serif;font-size:2.375rem;font-weight:500;line-height:46px}.h2{font-family:Roboto,sans-serif;font-size:1.875rem;font-weight:700;line-height:38px}.h3{font-family:Roboto,sans-serif;font-size:1.5rem;font-weight:500;line-height:32px}.h4{font-family:Roboto,sans-serif;font-size:1.25rem;font-weight:700;line-height:26px}.h5{font-family:Roboto,sans-serif;font-size:1.125rem;font-weight:500;line-height:24px;letter-spacing:.18px}.label-large{font-family:Roboto,sans-serif;font-size:1rem;font-weight:500;line-height:22px}.body-large{font-family:Rubik,sans-serif;font-size:1rem;font-weight:400;line-height:22px}.label-base{font-family:Rubik,sans-serif;font-size:.875rem;font-weight:500;line-height:20px;letter-spacing:.28px}.body-base{font-family:Rubik,sans-serif;font-size:.875rem;font-weight:400;line-height:20px;font-style:italic;letter-spacing:.28px}.body-base-1,.body-base-1-1{font-family:Rubik,sans-serif;font-size:.875rem;font-weight:400;line-height:20px;letter-spacing:.28px}.body-sm{font-family:Rubik,sans-serif;font-size:.75rem;font-weight:400;line-height:16px;letter-spacing:.28px}.body-sm-italic{font-family:Rubik,sans-serif;font-size:.75rem;font-weight:400;line-height:16px;font-style:italic;letter-spacing:.28px}.caption-sm{font-family:Rubik,sans-serif;font-size:.75rem;font-weight:500;line-height:16px;letter-spacing:.28px}.caption-sm-italic{font-family:Rubik,sans-serif;font-size:.75rem;font-weight:500;line-height:16px;font-style:italic;letter-spacing:.28px}.ctn-gnrl{position:relative;display:flex;flex-direction:column;cursor:pointer;padding:8px 12px;box-sizing:border-box;border-radius:4px;border:1px solid #eaeaea}.ctn-gnrl:hover{border:1px solid #C4DFFF;box-shadow:0 1px 3px #0000001f,0 1px 2px #00000014}.ctn-gnrl:hover .fecha{display:none;pointer-events:none}.ctn-gnrl:hover .buttons-hove{display:flex;pointer-events:auto}.ctn-card{position:relative;display:flex;align-items:center;gap:24px}.ctn-inf{display:flex;flex:1 0 0;align-items:center;gap:16px}.icon-book-5{color:#7caf25}.info{display:flex;flex:1 0 0;flex-direction:column;align-items:flex-start}.ctn-icons{display:flex;align-items:center;gap:16px}.icon-dot{background-color:transparent;display:none;align-items:center;width:8px;height:8px;aspect-ratio:1/1;border-radius:100px}.icon-dot-f{display:flex;background-color:#2167ff}.fecha{width:76px}.buttons-hove{display:none;pointer-events:none;gap:4px}.ctn-collapse-card{max-height:1000px;overflow:hidden;transition:max-height .3s ease-in-out}.ctn-collapse-card.collapsed{max-height:0px}.ctn-clp{display:flex;gap:8px}.buttons-clp{display:flex;padding:4px;flex-direction:column;width:44px;box-sizing:border-box;gap:4px;justify-content:center}.ctn-info-clp{display:flex;padding:4px 8px;flex-direction:column;gap:12px;flex:1 0 0}.text-info{display:flex;flex-direction:column;align-items:flex-start;flex:1 0 0}ius-simple-divider{margin:8px 0}.row-text-1{display:flex;align-items:center;gap:8px}.title-no-read{font-weight:500}.row-text-2{display:flex;align-items:center;gap:4px}.txt-pry{color:#333}.txt-sec{color:#595959}.txt-ter{color:#8c8c8c}\n"], dependencies: [{ kind: "component", type: IconSmComponent, selector: "ius-icon-sm", inputs: ["iconName", "color"] }, { kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "component", type: ButtonCircleTertiaryComponent, selector: "ius-button-circle-tertiary", inputs: ["disabled", "iconName"], outputs: ["buttonClicked"] }, { kind: "component", type: SimpleDividerComponent, selector: "ius-simple-divider" }, { kind: "component", type: ButtonMenuLinkComponent, selector: "ius-button-menu-link", inputs: ["disabled", "iconColor", "iconName"], outputs: ["buttonClicked"] }, { kind: "pipe", type: DatePipe, name: "date" }, { kind: "directive", type: PopoverDirective, selector: "[iusPopover], [iusPopoverTitle], [iusPopoverContent]", inputs: ["iusPopover", "iusPopoverTitle", "iusPopoverContent", "iusPopoverPosition", "iusPopoverOpenDelay", "iusPopoverCloseDelay"] }] }); }
+        ], ngImport: i0, template: "<div class=\"ctn-gnrl\" (click)=\"toggleCollapse()\">\r\n    <div class=\"ctn-card\">\r\n        <div class=\"ctn-inf\">\r\n            <ius-icon-sm iconName=\"icon-book-5\" class=\"icon-book-5\"></ius-icon-sm>\r\n            <div class=\"info\">\r\n                <span class=\"caption-sm txt-ter\">Etapas Procesales</span>\r\n                <div class=\"body-base-1 row-text-1 txt-pry\" [ngClass]=\"{'title-no-read': read === false}\">\r\n                    <span>{{etapa}}</span>\r\n                    <span>-</span>\r\n                    <span>{{subEtapa}}</span>\r\n                </div>\r\n                <div class=\"body-base-1 txt-sec row-text-1\">\r\n                    <span>{{text1}}</span>\r\n                    @if (origen) {\r\n                    <span>-</span>\r\n                    <span>{{origen}}</span>\r\n                    }\r\n                </div>\r\n            </div>\r\n        </div>\r\n        <div class=\"ctn-icons\">\r\n            @if (hasDocuments) {\r\n            <div class=\"row-text-1\">\r\n                <ius-icon-sm iconName=\"icon-attach-file\" class=\"txt-sec\"></ius-icon-sm>\r\n            </div>\r\n            }\r\n            <div class=\"row-text-2\">\r\n                <div class=\"icon-dot\" [ngClass]=\"{'icon-dot-f': read === false}\"></div>\r\n                <span class=\"body-sm txt-ter fecha\">{{fechaPrincipal | date: 'd MMM yyyy'}}</span>\r\n                <span class=\"buttons-hove\">\r\n                    <ius-button-circle-tertiary iconName=\"icon-mark-chat-read\"\r\n                        [iusPopoverContent]=\"read ? 'Marcar como no le\u00EDdo' : 'Marcar como le\u00EDdo'\"\r\n                        (buttonClicked)=\"clickButtonRead($event)\"></ius-button-circle-tertiary>\r\n                    <ius-button-circle-tertiary iconName=\"icon-content-copy\"\r\n                        iusPopoverContent=\"Copiar informaci\u00F3n\"\r\n                        (buttonClicked)=\"clickButtonCopy($event)\"></ius-button-circle-tertiary>\r\n                    <ius-button-circle-tertiary iconName=\"icon-edit\"\r\n                        iusPopoverContent=\"Editar\"\r\n                        (buttonClicked)=\"clickButtonEdit($event)\"></ius-button-circle-tertiary>\r\n                    <ius-button-circle-tertiary iconName=\"icon-delete\"\r\n                        iusPopoverContent=\"Eliminar\"\r\n                        (buttonClicked)=\"clickButtonDelete($event)\"></ius-button-circle-tertiary>\r\n                </span>\r\n            </div>\r\n            <ius-icon-sm [iconName]=\"collapse ? 'icon-keyboard-arrow-down' : 'icon-keyboard-arrow-up'\"\r\n                class=\"txt-pry\"></ius-icon-sm>\r\n        </div>\r\n    </div>\r\n    <div class=\"ctn-collapse-card\" [ngClass]=\"{'collapsed': collapse}\">\r\n        <ius-simple-divider></ius-simple-divider>\r\n        <div class=\"ctn-clp\">\r\n            <div class=\"ctn-info-clp\">\r\n                <div class=\"text-info\">\r\n                    <span class=\"body-base-1 txt-pry\">{{descripcion}}</span>\r\n                </div>\r\n            </div>\r\n            <div class=\"buttons-clp\">\r\n                @if (hasDocuments) {\r\n                <ius-button-menu-link iconName=\"icon-attach-file\" iconColor=\"#184FDB\"\r\n                    iusPopoverContent=\"Ver documentos\"\r\n                    (buttonClicked)=\"clickButtonDocs($event)\"></ius-button-menu-link>\r\n                }\r\n            </div>\r\n        </div>\r\n    </div>\r\n</div>", styles: [".h1{font-family:Roboto,sans-serif;font-size:2.375rem;font-weight:500;line-height:46px}.h2{font-family:Roboto,sans-serif;font-size:1.875rem;font-weight:700;line-height:38px}.h3{font-family:Roboto,sans-serif;font-size:1.5rem;font-weight:500;line-height:32px}.h4{font-family:Roboto,sans-serif;font-size:1.25rem;font-weight:700;line-height:26px}.h5{font-family:Roboto,sans-serif;font-size:1.125rem;font-weight:500;line-height:24px;letter-spacing:.18px}.label-large{font-family:Roboto,sans-serif;font-size:1rem;font-weight:500;line-height:22px}.body-large{font-family:Rubik,sans-serif;font-size:1rem;font-weight:400;line-height:22px}.label-base{font-family:Rubik,sans-serif;font-size:.875rem;font-weight:500;line-height:20px;letter-spacing:.28px}.body-base{font-family:Rubik,sans-serif;font-size:.875rem;font-weight:400;line-height:20px;font-style:italic;letter-spacing:.28px}.body-base-1,.body-base-1-1{font-family:Rubik,sans-serif;font-size:.875rem;font-weight:400;line-height:20px;letter-spacing:.28px}.body-sm{font-family:Rubik,sans-serif;font-size:.75rem;font-weight:400;line-height:16px;letter-spacing:.28px}.body-sm-italic{font-family:Rubik,sans-serif;font-size:.75rem;font-weight:400;line-height:16px;font-style:italic;letter-spacing:.28px}.caption-sm{font-family:Rubik,sans-serif;font-size:.75rem;font-weight:500;line-height:16px;letter-spacing:.28px}.caption-sm-italic{font-family:Rubik,sans-serif;font-size:.75rem;font-weight:500;line-height:16px;font-style:italic;letter-spacing:.28px}.ctn-gnrl{position:relative;display:flex;flex-direction:column;cursor:pointer;padding:8px 12px;box-sizing:border-box;border-radius:4px;border:1px solid #eaeaea}.ctn-gnrl:hover{border:1px solid #C4DFFF;box-shadow:0 1px 3px #0000001f,0 1px 2px #00000014}.ctn-gnrl:hover .fecha{display:none;pointer-events:none}.ctn-gnrl:hover .buttons-hove{display:flex;pointer-events:auto}.ctn-card{position:relative;display:flex;align-items:center;gap:24px}.ctn-inf{display:flex;flex:1 0 0;align-items:center;gap:16px}.icon-book-5{color:#7caf25}.info{display:flex;flex:1 0 0;flex-direction:column;align-items:flex-start}.ctn-icons{display:flex;align-items:center;gap:16px}.icon-dot{background-color:transparent;display:none;align-items:center;width:8px;height:8px;aspect-ratio:1/1;border-radius:100px}.icon-dot-f{display:flex;background-color:#2167ff}.fecha{width:76px}.buttons-hove{display:none;pointer-events:none;gap:4px}.ctn-collapse-card{max-height:1000px;overflow:hidden;transition:max-height .3s ease-in-out}.ctn-collapse-card.collapsed{max-height:0px}.ctn-clp{display:flex;gap:8px}.buttons-clp{display:flex;padding:4px;flex-direction:column;width:44px;box-sizing:border-box;gap:4px;justify-content:center}.ctn-info-clp{display:flex;padding:4px 8px;flex-direction:column;gap:12px;flex:1 0 0}.text-info{display:flex;flex-direction:column;align-items:flex-start;flex:1 0 0}ius-simple-divider{margin:8px 0}.row-text-1{display:flex;align-items:center;gap:8px}.title-no-read{font-weight:500}.row-text-2{display:flex;align-items:center;gap:4px}.txt-pry{color:#333}.txt-sec{color:#595959}.txt-ter{color:#8c8c8c}\n"], dependencies: [{ kind: "component", type: IconSmComponent, selector: "ius-icon-sm", inputs: ["iconName", "color"] }, { kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "component", type: ButtonCircleTertiaryComponent, selector: "ius-button-circle-tertiary", inputs: ["disabled", "iconName"], outputs: ["buttonClicked"] }, { kind: "component", type: SimpleDividerComponent, selector: "ius-simple-divider" }, { kind: "component", type: ButtonMenuLinkComponent, selector: "ius-button-menu-link", inputs: ["disabled", "iconColor", "iconName"], outputs: ["buttonClicked"] }, { kind: "pipe", type: DatePipe, name: "date" }, { kind: "directive", type: PopoverDirective, selector: "[iusPopover], [iusPopoverTitle], [iusPopoverContent]", inputs: ["iusPopover", "iusPopoverTitle", "iusPopoverContent", "iusPopoverPosition", "iusPopoverOpenDelay", "iusPopoverCloseDelay"] }] }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: CardEtapaSubetapaComponent, decorators: [{
             type: Component,
             args: [{ selector: 'ius-card-etapa-subetapa', standalone: true, imports: [IconSmComponent, NgClass, ButtonCircleTertiaryComponent, SimpleDividerComponent, ButtonMenuLinkComponent, DatePipe, PopoverDirective], providers: [
                         { provide: LOCALE_ID, useValue: 'es' },
                         DatePipe
-                    ], template: "<div class=\"ctn-gnrl\" (click)=\"toggleCollapse()\">\n    <div class=\"ctn-card\">\n        <div class=\"ctn-inf\">\n            <ius-icon-sm iconName=\"icon-book-5\" class=\"icon-book-5\"></ius-icon-sm>\n            <div class=\"info\">\n                <span class=\"caption-sm txt-ter\">Etapas Procesales</span>\n                <div class=\"body-base-1 row-text-1 txt-pry\" [ngClass]=\"{'title-no-read': read === false}\">\n                    <span>{{etapa}}</span>\n                    <span>-</span>\n                    <span>{{subEtapa}}</span>\n                </div>\n                <div class=\"body-base-1 txt-sec row-text-1\">\n                    <span>{{text1}}</span>\n                    @if (origen) {\n                    <span>-</span>\n                    <span>{{origen}}</span>\n                    }\n                </div>\n            </div>\n        </div>\n        <div class=\"ctn-icons\">\n            @if (hasDocuments) {\n            <div class=\"row-text-1\">\n                <ius-icon-sm iconName=\"icon-attach-file\" class=\"txt-sec\"></ius-icon-sm>\n            </div>\n            }\n            <div class=\"row-text-2\">\n                <div class=\"icon-dot\" [ngClass]=\"{'icon-dot-f': read === false}\"></div>\n                <span class=\"body-sm txt-ter fecha\">{{fechaPrincipal | date: 'd MMM yyyy'}}</span>\n                <span class=\"buttons-hove\">\n                    <ius-button-circle-tertiary iconName=\"icon-mark-chat-read\"\n                        [iusPopoverContent]=\"read ? 'Marcar como no le\u00EDdo' : 'Marcar como le\u00EDdo'\"\n                        (buttonClicked)=\"clickButtonRead($event)\"></ius-button-circle-tertiary>\n                    <ius-button-circle-tertiary iconName=\"icon-content-copy\"\n                        iusPopoverContent=\"Copiar informaci\u00F3n\"\n                        (buttonClicked)=\"clickButtonCopy($event)\"></ius-button-circle-tertiary>\n                    <ius-button-circle-tertiary iconName=\"icon-edit\"\n                        iusPopoverContent=\"Editar\"\n                        (buttonClicked)=\"clickButtonEdit($event)\"></ius-button-circle-tertiary>\n                    <ius-button-circle-tertiary iconName=\"icon-delete\"\n                        iusPopoverContent=\"Eliminar\"\n                        (buttonClicked)=\"clickButtonDelete($event)\"></ius-button-circle-tertiary>\n                </span>\n            </div>\n            <ius-icon-sm [iconName]=\"collapse ? 'icon-keyboard-arrow-down' : 'icon-keyboard-arrow-up'\"\n                class=\"txt-pry\"></ius-icon-sm>\n        </div>\n    </div>\n    <div class=\"ctn-collapse-card\" [ngClass]=\"{'collapsed': collapse}\">\n        <ius-simple-divider></ius-simple-divider>\n        <div class=\"ctn-clp\">\n            <div class=\"ctn-info-clp\">\n                <div class=\"text-info\">\n                    <span class=\"body-base-1 txt-pry\">{{descripcion}}</span>\n                </div>\n            </div>\n            <div class=\"buttons-clp\">\n                @if (hasDocuments) {\n                <ius-button-menu-link iconName=\"icon-attach-file\" iconColor=\"#184FDB\"\n                    iusPopoverContent=\"Ver documentos\"\n                    (buttonClicked)=\"clickButtonDocs($event)\"></ius-button-menu-link>\n                }\n            </div>\n        </div>\n    </div>\n</div>", styles: [".h1{font-family:Roboto,sans-serif;font-size:2.375rem;font-weight:500;line-height:46px}.h2{font-family:Roboto,sans-serif;font-size:1.875rem;font-weight:700;line-height:38px}.h3{font-family:Roboto,sans-serif;font-size:1.5rem;font-weight:500;line-height:32px}.h4{font-family:Roboto,sans-serif;font-size:1.25rem;font-weight:700;line-height:26px}.h5{font-family:Roboto,sans-serif;font-size:1.125rem;font-weight:500;line-height:24px;letter-spacing:.18px}.label-large{font-family:Roboto,sans-serif;font-size:1rem;font-weight:500;line-height:22px}.body-large{font-family:Rubik,sans-serif;font-size:1rem;font-weight:400;line-height:22px}.label-base{font-family:Rubik,sans-serif;font-size:.875rem;font-weight:500;line-height:20px;letter-spacing:.28px}.body-base{font-family:Rubik,sans-serif;font-size:.875rem;font-weight:400;line-height:20px;font-style:italic;letter-spacing:.28px}.body-base-1,.body-base-1-1{font-family:Rubik,sans-serif;font-size:.875rem;font-weight:400;line-height:20px;letter-spacing:.28px}.body-sm{font-family:Rubik,sans-serif;font-size:.75rem;font-weight:400;line-height:16px;letter-spacing:.28px}.body-sm-italic{font-family:Rubik,sans-serif;font-size:.75rem;font-weight:400;line-height:16px;font-style:italic;letter-spacing:.28px}.caption-sm{font-family:Rubik,sans-serif;font-size:.75rem;font-weight:500;line-height:16px;letter-spacing:.28px}.caption-sm-italic{font-family:Rubik,sans-serif;font-size:.75rem;font-weight:500;line-height:16px;font-style:italic;letter-spacing:.28px}.ctn-gnrl{position:relative;display:flex;flex-direction:column;cursor:pointer;padding:8px 12px;box-sizing:border-box;border-radius:4px;border:1px solid #eaeaea}.ctn-gnrl:hover{border:1px solid #C4DFFF;box-shadow:0 1px 3px #0000001f,0 1px 2px #00000014}.ctn-gnrl:hover .fecha{display:none;pointer-events:none}.ctn-gnrl:hover .buttons-hove{display:flex;pointer-events:auto}.ctn-card{position:relative;display:flex;align-items:center;gap:24px}.ctn-inf{display:flex;flex:1 0 0;align-items:center;gap:16px}.icon-book-5{color:#7caf25}.info{display:flex;flex:1 0 0;flex-direction:column;align-items:flex-start}.ctn-icons{display:flex;align-items:center;gap:16px}.icon-dot{background-color:transparent;display:none;align-items:center;width:8px;height:8px;aspect-ratio:1/1;border-radius:100px}.icon-dot-f{display:flex;background-color:#2167ff}.fecha{width:76px}.buttons-hove{display:none;pointer-events:none;gap:4px}.ctn-collapse-card{max-height:1000px;overflow:hidden;transition:max-height .3s ease-in-out}.ctn-collapse-card.collapsed{max-height:0px}.ctn-clp{display:flex;gap:8px}.buttons-clp{display:flex;padding:4px;flex-direction:column;width:44px;box-sizing:border-box;gap:4px;justify-content:center}.ctn-info-clp{display:flex;padding:4px 8px;flex-direction:column;gap:12px;flex:1 0 0}.text-info{display:flex;flex-direction:column;align-items:flex-start;flex:1 0 0}ius-simple-divider{margin:8px 0}.row-text-1{display:flex;align-items:center;gap:8px}.title-no-read{font-weight:500}.row-text-2{display:flex;align-items:center;gap:4px}.txt-pry{color:#333}.txt-sec{color:#595959}.txt-ter{color:#8c8c8c}\n"] }]
+                    ], template: "<div class=\"ctn-gnrl\" (click)=\"toggleCollapse()\">\r\n    <div class=\"ctn-card\">\r\n        <div class=\"ctn-inf\">\r\n            <ius-icon-sm iconName=\"icon-book-5\" class=\"icon-book-5\"></ius-icon-sm>\r\n            <div class=\"info\">\r\n                <span class=\"caption-sm txt-ter\">Etapas Procesales</span>\r\n                <div class=\"body-base-1 row-text-1 txt-pry\" [ngClass]=\"{'title-no-read': read === false}\">\r\n                    <span>{{etapa}}</span>\r\n                    <span>-</span>\r\n                    <span>{{subEtapa}}</span>\r\n                </div>\r\n                <div class=\"body-base-1 txt-sec row-text-1\">\r\n                    <span>{{text1}}</span>\r\n                    @if (origen) {\r\n                    <span>-</span>\r\n                    <span>{{origen}}</span>\r\n                    }\r\n                </div>\r\n            </div>\r\n        </div>\r\n        <div class=\"ctn-icons\">\r\n            @if (hasDocuments) {\r\n            <div class=\"row-text-1\">\r\n                <ius-icon-sm iconName=\"icon-attach-file\" class=\"txt-sec\"></ius-icon-sm>\r\n            </div>\r\n            }\r\n            <div class=\"row-text-2\">\r\n                <div class=\"icon-dot\" [ngClass]=\"{'icon-dot-f': read === false}\"></div>\r\n                <span class=\"body-sm txt-ter fecha\">{{fechaPrincipal | date: 'd MMM yyyy'}}</span>\r\n                <span class=\"buttons-hove\">\r\n                    <ius-button-circle-tertiary iconName=\"icon-mark-chat-read\"\r\n                        [iusPopoverContent]=\"read ? 'Marcar como no le\u00EDdo' : 'Marcar como le\u00EDdo'\"\r\n                        (buttonClicked)=\"clickButtonRead($event)\"></ius-button-circle-tertiary>\r\n                    <ius-button-circle-tertiary iconName=\"icon-content-copy\"\r\n                        iusPopoverContent=\"Copiar informaci\u00F3n\"\r\n                        (buttonClicked)=\"clickButtonCopy($event)\"></ius-button-circle-tertiary>\r\n                    <ius-button-circle-tertiary iconName=\"icon-edit\"\r\n                        iusPopoverContent=\"Editar\"\r\n                        (buttonClicked)=\"clickButtonEdit($event)\"></ius-button-circle-tertiary>\r\n                    <ius-button-circle-tertiary iconName=\"icon-delete\"\r\n                        iusPopoverContent=\"Eliminar\"\r\n                        (buttonClicked)=\"clickButtonDelete($event)\"></ius-button-circle-tertiary>\r\n                </span>\r\n            </div>\r\n            <ius-icon-sm [iconName]=\"collapse ? 'icon-keyboard-arrow-down' : 'icon-keyboard-arrow-up'\"\r\n                class=\"txt-pry\"></ius-icon-sm>\r\n        </div>\r\n    </div>\r\n    <div class=\"ctn-collapse-card\" [ngClass]=\"{'collapsed': collapse}\">\r\n        <ius-simple-divider></ius-simple-divider>\r\n        <div class=\"ctn-clp\">\r\n            <div class=\"ctn-info-clp\">\r\n                <div class=\"text-info\">\r\n                    <span class=\"body-base-1 txt-pry\">{{descripcion}}</span>\r\n                </div>\r\n            </div>\r\n            <div class=\"buttons-clp\">\r\n                @if (hasDocuments) {\r\n                <ius-button-menu-link iconName=\"icon-attach-file\" iconColor=\"#184FDB\"\r\n                    iusPopoverContent=\"Ver documentos\"\r\n                    (buttonClicked)=\"clickButtonDocs($event)\"></ius-button-menu-link>\r\n                }\r\n            </div>\r\n        </div>\r\n    </div>\r\n</div>", styles: [".h1{font-family:Roboto,sans-serif;font-size:2.375rem;font-weight:500;line-height:46px}.h2{font-family:Roboto,sans-serif;font-size:1.875rem;font-weight:700;line-height:38px}.h3{font-family:Roboto,sans-serif;font-size:1.5rem;font-weight:500;line-height:32px}.h4{font-family:Roboto,sans-serif;font-size:1.25rem;font-weight:700;line-height:26px}.h5{font-family:Roboto,sans-serif;font-size:1.125rem;font-weight:500;line-height:24px;letter-spacing:.18px}.label-large{font-family:Roboto,sans-serif;font-size:1rem;font-weight:500;line-height:22px}.body-large{font-family:Rubik,sans-serif;font-size:1rem;font-weight:400;line-height:22px}.label-base{font-family:Rubik,sans-serif;font-size:.875rem;font-weight:500;line-height:20px;letter-spacing:.28px}.body-base{font-family:Rubik,sans-serif;font-size:.875rem;font-weight:400;line-height:20px;font-style:italic;letter-spacing:.28px}.body-base-1,.body-base-1-1{font-family:Rubik,sans-serif;font-size:.875rem;font-weight:400;line-height:20px;letter-spacing:.28px}.body-sm{font-family:Rubik,sans-serif;font-size:.75rem;font-weight:400;line-height:16px;letter-spacing:.28px}.body-sm-italic{font-family:Rubik,sans-serif;font-size:.75rem;font-weight:400;line-height:16px;font-style:italic;letter-spacing:.28px}.caption-sm{font-family:Rubik,sans-serif;font-size:.75rem;font-weight:500;line-height:16px;letter-spacing:.28px}.caption-sm-italic{font-family:Rubik,sans-serif;font-size:.75rem;font-weight:500;line-height:16px;font-style:italic;letter-spacing:.28px}.ctn-gnrl{position:relative;display:flex;flex-direction:column;cursor:pointer;padding:8px 12px;box-sizing:border-box;border-radius:4px;border:1px solid #eaeaea}.ctn-gnrl:hover{border:1px solid #C4DFFF;box-shadow:0 1px 3px #0000001f,0 1px 2px #00000014}.ctn-gnrl:hover .fecha{display:none;pointer-events:none}.ctn-gnrl:hover .buttons-hove{display:flex;pointer-events:auto}.ctn-card{position:relative;display:flex;align-items:center;gap:24px}.ctn-inf{display:flex;flex:1 0 0;align-items:center;gap:16px}.icon-book-5{color:#7caf25}.info{display:flex;flex:1 0 0;flex-direction:column;align-items:flex-start}.ctn-icons{display:flex;align-items:center;gap:16px}.icon-dot{background-color:transparent;display:none;align-items:center;width:8px;height:8px;aspect-ratio:1/1;border-radius:100px}.icon-dot-f{display:flex;background-color:#2167ff}.fecha{width:76px}.buttons-hove{display:none;pointer-events:none;gap:4px}.ctn-collapse-card{max-height:1000px;overflow:hidden;transition:max-height .3s ease-in-out}.ctn-collapse-card.collapsed{max-height:0px}.ctn-clp{display:flex;gap:8px}.buttons-clp{display:flex;padding:4px;flex-direction:column;width:44px;box-sizing:border-box;gap:4px;justify-content:center}.ctn-info-clp{display:flex;padding:4px 8px;flex-direction:column;gap:12px;flex:1 0 0}.text-info{display:flex;flex-direction:column;align-items:flex-start;flex:1 0 0}ius-simple-divider{margin:8px 0}.row-text-1{display:flex;align-items:center;gap:8px}.title-no-read{font-weight:500}.row-text-2{display:flex;align-items:center;gap:4px}.txt-pry{color:#333}.txt-sec{color:#595959}.txt-ter{color:#8c8c8c}\n"] }]
         }], ctorParameters: () => [{ type: i1$1.DatePipe }], propDecorators: { priority: [{
                 type: Input
             }], hasDocuments: [{
@@ -7420,14 +7424,14 @@ class CardImpulsoProcesalComponent {
     static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "17.3.12", type: CardImpulsoProcesalComponent, isStandalone: true, selector: "ius-card-impulso-procesal", inputs: { priority: "priority", hasDocuments: "hasDocuments", read: "read", collapse: "collapse", titulo: "titulo", text1: "text1", origen: "origen", fechaPrincipal: "fechaPrincipal", descripcion: "descripcion" }, outputs: { onClickButtonCopy: "onClickButtonCopy", onClickButtonRead: "onClickButtonRead", onClickButtonEdit: "onClickButtonEdit", onClickButtonDelete: "onClickButtonDelete", onClickButtonDocs: "onClickButtonDocs" }, providers: [
             { provide: LOCALE_ID, useValue: 'es' },
             DatePipe
-        ], ngImport: i0, template: "<div class=\"ctn-gnrl\" (click)=\"toggleCollapse()\">\n    <div class=\"ctn-card\">\n        <div class=\"ctn-inf\">\n            <ius-icon-sm iconName=\"icon-article-person\" class=\"icon-article-person\"></ius-icon-sm>\n            <div class=\"info\">\n                <span class=\"caption-sm txt-ter\">Gesti\u00F3n - Impulso Procesal</span>\n                <span class=\"body-base-1\" [ngClass]=\"{'title-no-read': read === false}\">{{titulo}}</span>\n                <div class=\"body-base-1 txt-sec row-text-1\">\n                    <span>{{text1}}</span>\n                    @if (origen) {\n                    <span>-</span>\n                    <span>{{origen}}</span>\n                    }\n                </div>\n            </div>\n        </div>\n        <div class=\"ctn-icons\">\n            @if (hasDocuments) {\n            <div class=\"row-text-1\">\n                <ius-icon-sm iconName=\"icon-attach-file\" class=\"txt-sec\"></ius-icon-sm>\n            </div>\n            }\n            <div class=\"row-text-2\">\n                <div class=\"icon-dot\" [ngClass]=\"{'icon-dot-f': read === false}\"></div>\n                <span class=\"body-sm txt-ter fecha\">{{fechaPrincipal | date: 'd MMM yyyy'}}</span>\n                <span class=\"buttons-hove\">\n                    <ius-button-circle-tertiary iconName=\"icon-mark-chat-read\"\n                        [iusPopoverContent]=\"read ? 'Marcar como no le\u00EDdo' : 'Marcar como le\u00EDdo'\"\n                        (buttonClicked)=\"clickButtonRead($event)\"></ius-button-circle-tertiary>\n                    <ius-button-circle-tertiary iconName=\"icon-content-copy\"\n                        iusPopoverContent=\"Copiar informaci\u00F3n\"\n                        (buttonClicked)=\"clickButtonCopy($event)\"></ius-button-circle-tertiary>\n                    <ius-button-circle-tertiary iconName=\"icon-edit\"\n                        iusPopoverContent=\"Editar\"\n                        (buttonClicked)=\"clickButtonEdit($event)\"></ius-button-circle-tertiary>\n                    <ius-button-circle-tertiary iconName=\"icon-delete\"\n                        iusPopoverContent=\"Eliminar\"\n                        (buttonClicked)=\"clickButtonDelete($event)\"></ius-button-circle-tertiary>\n                </span>\n            </div>\n            <ius-icon-sm [iconName]=\"collapse ? 'icon-keyboard-arrow-down' : 'icon-keyboard-arrow-up'\"\n                class=\"txt-pry\"></ius-icon-sm>\n        </div>\n    </div>\n    <div class=\"ctn-collapse-card\" [ngClass]=\"{'collapsed': collapse}\">\n        <ius-simple-divider></ius-simple-divider>\n        <div class=\"ctn-clp\">\n            <div class=\"ctn-info-clp\">\n                <div class=\"text-info\">\n                    <span class=\"body-base-1 txt-pry\">{{descripcion}}</span>\n                </div>\n            </div>\n            <div class=\"buttons-clp\">\n                @if (hasDocuments) {\n                <ius-button-menu-link iconName=\"icon-attach-file\" iconColor=\"#184FDB\"\n                    iusPopoverContent=\"Ver documentos\"\n                    (buttonClicked)=\"clickButtonDocs($event)\"></ius-button-menu-link>\n                }\n            </div>\n        </div>\n    </div>\n</div>", styles: [".h1{font-family:Roboto,sans-serif;font-size:2.375rem;font-weight:500;line-height:46px}.h2{font-family:Roboto,sans-serif;font-size:1.875rem;font-weight:700;line-height:38px}.h3{font-family:Roboto,sans-serif;font-size:1.5rem;font-weight:500;line-height:32px}.h4{font-family:Roboto,sans-serif;font-size:1.25rem;font-weight:700;line-height:26px}.h5{font-family:Roboto,sans-serif;font-size:1.125rem;font-weight:500;line-height:24px;letter-spacing:.18px}.label-large{font-family:Roboto,sans-serif;font-size:1rem;font-weight:500;line-height:22px}.body-large{font-family:Rubik,sans-serif;font-size:1rem;font-weight:400;line-height:22px}.label-base{font-family:Rubik,sans-serif;font-size:.875rem;font-weight:500;line-height:20px;letter-spacing:.28px}.body-base{font-family:Rubik,sans-serif;font-size:.875rem;font-weight:400;line-height:20px;font-style:italic;letter-spacing:.28px}.body-base-1,.body-base-1-1{font-family:Rubik,sans-serif;font-size:.875rem;font-weight:400;line-height:20px;letter-spacing:.28px}.body-sm{font-family:Rubik,sans-serif;font-size:.75rem;font-weight:400;line-height:16px;letter-spacing:.28px}.body-sm-italic{font-family:Rubik,sans-serif;font-size:.75rem;font-weight:400;line-height:16px;font-style:italic;letter-spacing:.28px}.caption-sm{font-family:Rubik,sans-serif;font-size:.75rem;font-weight:500;line-height:16px;letter-spacing:.28px}.caption-sm-italic{font-family:Rubik,sans-serif;font-size:.75rem;font-weight:500;line-height:16px;font-style:italic;letter-spacing:.28px}.ctn-gnrl{position:relative;display:flex;flex-direction:column;cursor:pointer;padding:8px 12px;box-sizing:border-box;border-radius:4px;border:1px solid #eaeaea}.ctn-gnrl:hover{border:1px solid #C4DFFF;box-shadow:0 1px 3px #0000001f,0 1px 2px #00000014}.ctn-gnrl:hover .fecha{display:none;pointer-events:none}.ctn-gnrl:hover .buttons-hove{display:flex;pointer-events:auto}.ctn-card{position:relative;display:flex;align-items:center;gap:24px}.ctn-inf{display:flex;flex:1 0 0;align-items:center;gap:16px}.icon-article-person{color:#434343}.info{display:flex;flex:1 0 0;flex-direction:column;align-items:flex-start}.title-no-read{font-weight:500}.ctn-icons{display:flex;align-items:center;gap:16px}.icon-dot{background-color:transparent;display:none;align-items:center;width:8px;height:8px;aspect-ratio:1/1;border-radius:100px}.icon-dot-f{display:flex;background-color:#2167ff}.fecha{width:76px}.buttons-hove{display:none;pointer-events:none;gap:4px}.ctn-collapse-card{max-height:1000px;overflow:hidden;transition:max-height .3s ease-in-out}.ctn-collapse-card.collapsed{max-height:0px}.ctn-clp{display:flex;gap:8px}.buttons-clp{display:flex;padding:4px;flex-direction:column;width:44px;box-sizing:border-box;gap:4px;justify-content:center}.ctn-info-clp{display:flex;padding:4px 8px;flex-direction:column;gap:12px;flex:1 0 0}.text-info{display:flex;flex-direction:column;align-items:flex-start;flex:1 0 0}ius-simple-divider{margin:8px 0}.row-text-1{display:flex;align-items:center;gap:8px}.row-text-2{display:flex;align-items:center;gap:4px}.txt-pry{color:#333}.txt-sec{color:#595959}.txt-ter{color:#8c8c8c}\n"], dependencies: [{ kind: "component", type: IconSmComponent, selector: "ius-icon-sm", inputs: ["iconName", "color"] }, { kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "component", type: ButtonCircleTertiaryComponent, selector: "ius-button-circle-tertiary", inputs: ["disabled", "iconName"], outputs: ["buttonClicked"] }, { kind: "component", type: SimpleDividerComponent, selector: "ius-simple-divider" }, { kind: "component", type: ButtonMenuLinkComponent, selector: "ius-button-menu-link", inputs: ["disabled", "iconColor", "iconName"], outputs: ["buttonClicked"] }, { kind: "pipe", type: DatePipe, name: "date" }, { kind: "directive", type: PopoverDirective, selector: "[iusPopover], [iusPopoverTitle], [iusPopoverContent]", inputs: ["iusPopover", "iusPopoverTitle", "iusPopoverContent", "iusPopoverPosition", "iusPopoverOpenDelay", "iusPopoverCloseDelay"] }] }); }
+        ], ngImport: i0, template: "<div class=\"ctn-gnrl\" (click)=\"toggleCollapse()\">\r\n    <div class=\"ctn-card\">\r\n        <div class=\"ctn-inf\">\r\n            <ius-icon-sm iconName=\"icon-article-person\" class=\"icon-article-person\"></ius-icon-sm>\r\n            <div class=\"info\">\r\n                <span class=\"caption-sm txt-ter\">Gesti\u00F3n - Impulso Procesal</span>\r\n                <span class=\"body-base-1\" [ngClass]=\"{'title-no-read': read === false}\">{{titulo}}</span>\r\n                <div class=\"body-base-1 txt-sec row-text-1\">\r\n                    <span>{{text1}}</span>\r\n                    @if (origen) {\r\n                    <span>-</span>\r\n                    <span>{{origen}}</span>\r\n                    }\r\n                </div>\r\n            </div>\r\n        </div>\r\n        <div class=\"ctn-icons\">\r\n            @if (hasDocuments) {\r\n            <div class=\"row-text-1\">\r\n                <ius-icon-sm iconName=\"icon-attach-file\" class=\"txt-sec\"></ius-icon-sm>\r\n            </div>\r\n            }\r\n            <div class=\"row-text-2\">\r\n                <div class=\"icon-dot\" [ngClass]=\"{'icon-dot-f': read === false}\"></div>\r\n                <span class=\"body-sm txt-ter fecha\">{{fechaPrincipal | date: 'd MMM yyyy'}}</span>\r\n                <span class=\"buttons-hove\">\r\n                    <ius-button-circle-tertiary iconName=\"icon-mark-chat-read\"\r\n                        [iusPopoverContent]=\"read ? 'Marcar como no le\u00EDdo' : 'Marcar como le\u00EDdo'\"\r\n                        (buttonClicked)=\"clickButtonRead($event)\"></ius-button-circle-tertiary>\r\n                    <ius-button-circle-tertiary iconName=\"icon-content-copy\"\r\n                        iusPopoverContent=\"Copiar informaci\u00F3n\"\r\n                        (buttonClicked)=\"clickButtonCopy($event)\"></ius-button-circle-tertiary>\r\n                    <ius-button-circle-tertiary iconName=\"icon-edit\"\r\n                        iusPopoverContent=\"Editar\"\r\n                        (buttonClicked)=\"clickButtonEdit($event)\"></ius-button-circle-tertiary>\r\n                    <ius-button-circle-tertiary iconName=\"icon-delete\"\r\n                        iusPopoverContent=\"Eliminar\"\r\n                        (buttonClicked)=\"clickButtonDelete($event)\"></ius-button-circle-tertiary>\r\n                </span>\r\n            </div>\r\n            <ius-icon-sm [iconName]=\"collapse ? 'icon-keyboard-arrow-down' : 'icon-keyboard-arrow-up'\"\r\n                class=\"txt-pry\"></ius-icon-sm>\r\n        </div>\r\n    </div>\r\n    <div class=\"ctn-collapse-card\" [ngClass]=\"{'collapsed': collapse}\">\r\n        <ius-simple-divider></ius-simple-divider>\r\n        <div class=\"ctn-clp\">\r\n            <div class=\"ctn-info-clp\">\r\n                <div class=\"text-info\">\r\n                    <span class=\"body-base-1 txt-pry\">{{descripcion}}</span>\r\n                </div>\r\n            </div>\r\n            <div class=\"buttons-clp\">\r\n                @if (hasDocuments) {\r\n                <ius-button-menu-link iconName=\"icon-attach-file\" iconColor=\"#184FDB\"\r\n                    iusPopoverContent=\"Ver documentos\"\r\n                    (buttonClicked)=\"clickButtonDocs($event)\"></ius-button-menu-link>\r\n                }\r\n            </div>\r\n        </div>\r\n    </div>\r\n</div>", styles: [".h1{font-family:Roboto,sans-serif;font-size:2.375rem;font-weight:500;line-height:46px}.h2{font-family:Roboto,sans-serif;font-size:1.875rem;font-weight:700;line-height:38px}.h3{font-family:Roboto,sans-serif;font-size:1.5rem;font-weight:500;line-height:32px}.h4{font-family:Roboto,sans-serif;font-size:1.25rem;font-weight:700;line-height:26px}.h5{font-family:Roboto,sans-serif;font-size:1.125rem;font-weight:500;line-height:24px;letter-spacing:.18px}.label-large{font-family:Roboto,sans-serif;font-size:1rem;font-weight:500;line-height:22px}.body-large{font-family:Rubik,sans-serif;font-size:1rem;font-weight:400;line-height:22px}.label-base{font-family:Rubik,sans-serif;font-size:.875rem;font-weight:500;line-height:20px;letter-spacing:.28px}.body-base{font-family:Rubik,sans-serif;font-size:.875rem;font-weight:400;line-height:20px;font-style:italic;letter-spacing:.28px}.body-base-1,.body-base-1-1{font-family:Rubik,sans-serif;font-size:.875rem;font-weight:400;line-height:20px;letter-spacing:.28px}.body-sm{font-family:Rubik,sans-serif;font-size:.75rem;font-weight:400;line-height:16px;letter-spacing:.28px}.body-sm-italic{font-family:Rubik,sans-serif;font-size:.75rem;font-weight:400;line-height:16px;font-style:italic;letter-spacing:.28px}.caption-sm{font-family:Rubik,sans-serif;font-size:.75rem;font-weight:500;line-height:16px;letter-spacing:.28px}.caption-sm-italic{font-family:Rubik,sans-serif;font-size:.75rem;font-weight:500;line-height:16px;font-style:italic;letter-spacing:.28px}.ctn-gnrl{position:relative;display:flex;flex-direction:column;cursor:pointer;padding:8px 12px;box-sizing:border-box;border-radius:4px;border:1px solid #eaeaea}.ctn-gnrl:hover{border:1px solid #C4DFFF;box-shadow:0 1px 3px #0000001f,0 1px 2px #00000014}.ctn-gnrl:hover .fecha{display:none;pointer-events:none}.ctn-gnrl:hover .buttons-hove{display:flex;pointer-events:auto}.ctn-card{position:relative;display:flex;align-items:center;gap:24px}.ctn-inf{display:flex;flex:1 0 0;align-items:center;gap:16px}.icon-article-person{color:#434343}.info{display:flex;flex:1 0 0;flex-direction:column;align-items:flex-start}.title-no-read{font-weight:500}.ctn-icons{display:flex;align-items:center;gap:16px}.icon-dot{background-color:transparent;display:none;align-items:center;width:8px;height:8px;aspect-ratio:1/1;border-radius:100px}.icon-dot-f{display:flex;background-color:#2167ff}.fecha{width:76px}.buttons-hove{display:none;pointer-events:none;gap:4px}.ctn-collapse-card{max-height:1000px;overflow:hidden;transition:max-height .3s ease-in-out}.ctn-collapse-card.collapsed{max-height:0px}.ctn-clp{display:flex;gap:8px}.buttons-clp{display:flex;padding:4px;flex-direction:column;width:44px;box-sizing:border-box;gap:4px;justify-content:center}.ctn-info-clp{display:flex;padding:4px 8px;flex-direction:column;gap:12px;flex:1 0 0}.text-info{display:flex;flex-direction:column;align-items:flex-start;flex:1 0 0}ius-simple-divider{margin:8px 0}.row-text-1{display:flex;align-items:center;gap:8px}.row-text-2{display:flex;align-items:center;gap:4px}.txt-pry{color:#333}.txt-sec{color:#595959}.txt-ter{color:#8c8c8c}\n"], dependencies: [{ kind: "component", type: IconSmComponent, selector: "ius-icon-sm", inputs: ["iconName", "color"] }, { kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "component", type: ButtonCircleTertiaryComponent, selector: "ius-button-circle-tertiary", inputs: ["disabled", "iconName"], outputs: ["buttonClicked"] }, { kind: "component", type: SimpleDividerComponent, selector: "ius-simple-divider" }, { kind: "component", type: ButtonMenuLinkComponent, selector: "ius-button-menu-link", inputs: ["disabled", "iconColor", "iconName"], outputs: ["buttonClicked"] }, { kind: "pipe", type: DatePipe, name: "date" }, { kind: "directive", type: PopoverDirective, selector: "[iusPopover], [iusPopoverTitle], [iusPopoverContent]", inputs: ["iusPopover", "iusPopoverTitle", "iusPopoverContent", "iusPopoverPosition", "iusPopoverOpenDelay", "iusPopoverCloseDelay"] }] }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: CardImpulsoProcesalComponent, decorators: [{
             type: Component,
             args: [{ selector: 'ius-card-impulso-procesal', standalone: true, imports: [IconSmComponent, NgClass, ButtonCircleTertiaryComponent, SimpleDividerComponent, ButtonMenuLinkComponent, DatePipe, PopoverDirective], providers: [
                         { provide: LOCALE_ID, useValue: 'es' },
                         DatePipe
-                    ], template: "<div class=\"ctn-gnrl\" (click)=\"toggleCollapse()\">\n    <div class=\"ctn-card\">\n        <div class=\"ctn-inf\">\n            <ius-icon-sm iconName=\"icon-article-person\" class=\"icon-article-person\"></ius-icon-sm>\n            <div class=\"info\">\n                <span class=\"caption-sm txt-ter\">Gesti\u00F3n - Impulso Procesal</span>\n                <span class=\"body-base-1\" [ngClass]=\"{'title-no-read': read === false}\">{{titulo}}</span>\n                <div class=\"body-base-1 txt-sec row-text-1\">\n                    <span>{{text1}}</span>\n                    @if (origen) {\n                    <span>-</span>\n                    <span>{{origen}}</span>\n                    }\n                </div>\n            </div>\n        </div>\n        <div class=\"ctn-icons\">\n            @if (hasDocuments) {\n            <div class=\"row-text-1\">\n                <ius-icon-sm iconName=\"icon-attach-file\" class=\"txt-sec\"></ius-icon-sm>\n            </div>\n            }\n            <div class=\"row-text-2\">\n                <div class=\"icon-dot\" [ngClass]=\"{'icon-dot-f': read === false}\"></div>\n                <span class=\"body-sm txt-ter fecha\">{{fechaPrincipal | date: 'd MMM yyyy'}}</span>\n                <span class=\"buttons-hove\">\n                    <ius-button-circle-tertiary iconName=\"icon-mark-chat-read\"\n                        [iusPopoverContent]=\"read ? 'Marcar como no le\u00EDdo' : 'Marcar como le\u00EDdo'\"\n                        (buttonClicked)=\"clickButtonRead($event)\"></ius-button-circle-tertiary>\n                    <ius-button-circle-tertiary iconName=\"icon-content-copy\"\n                        iusPopoverContent=\"Copiar informaci\u00F3n\"\n                        (buttonClicked)=\"clickButtonCopy($event)\"></ius-button-circle-tertiary>\n                    <ius-button-circle-tertiary iconName=\"icon-edit\"\n                        iusPopoverContent=\"Editar\"\n                        (buttonClicked)=\"clickButtonEdit($event)\"></ius-button-circle-tertiary>\n                    <ius-button-circle-tertiary iconName=\"icon-delete\"\n                        iusPopoverContent=\"Eliminar\"\n                        (buttonClicked)=\"clickButtonDelete($event)\"></ius-button-circle-tertiary>\n                </span>\n            </div>\n            <ius-icon-sm [iconName]=\"collapse ? 'icon-keyboard-arrow-down' : 'icon-keyboard-arrow-up'\"\n                class=\"txt-pry\"></ius-icon-sm>\n        </div>\n    </div>\n    <div class=\"ctn-collapse-card\" [ngClass]=\"{'collapsed': collapse}\">\n        <ius-simple-divider></ius-simple-divider>\n        <div class=\"ctn-clp\">\n            <div class=\"ctn-info-clp\">\n                <div class=\"text-info\">\n                    <span class=\"body-base-1 txt-pry\">{{descripcion}}</span>\n                </div>\n            </div>\n            <div class=\"buttons-clp\">\n                @if (hasDocuments) {\n                <ius-button-menu-link iconName=\"icon-attach-file\" iconColor=\"#184FDB\"\n                    iusPopoverContent=\"Ver documentos\"\n                    (buttonClicked)=\"clickButtonDocs($event)\"></ius-button-menu-link>\n                }\n            </div>\n        </div>\n    </div>\n</div>", styles: [".h1{font-family:Roboto,sans-serif;font-size:2.375rem;font-weight:500;line-height:46px}.h2{font-family:Roboto,sans-serif;font-size:1.875rem;font-weight:700;line-height:38px}.h3{font-family:Roboto,sans-serif;font-size:1.5rem;font-weight:500;line-height:32px}.h4{font-family:Roboto,sans-serif;font-size:1.25rem;font-weight:700;line-height:26px}.h5{font-family:Roboto,sans-serif;font-size:1.125rem;font-weight:500;line-height:24px;letter-spacing:.18px}.label-large{font-family:Roboto,sans-serif;font-size:1rem;font-weight:500;line-height:22px}.body-large{font-family:Rubik,sans-serif;font-size:1rem;font-weight:400;line-height:22px}.label-base{font-family:Rubik,sans-serif;font-size:.875rem;font-weight:500;line-height:20px;letter-spacing:.28px}.body-base{font-family:Rubik,sans-serif;font-size:.875rem;font-weight:400;line-height:20px;font-style:italic;letter-spacing:.28px}.body-base-1,.body-base-1-1{font-family:Rubik,sans-serif;font-size:.875rem;font-weight:400;line-height:20px;letter-spacing:.28px}.body-sm{font-family:Rubik,sans-serif;font-size:.75rem;font-weight:400;line-height:16px;letter-spacing:.28px}.body-sm-italic{font-family:Rubik,sans-serif;font-size:.75rem;font-weight:400;line-height:16px;font-style:italic;letter-spacing:.28px}.caption-sm{font-family:Rubik,sans-serif;font-size:.75rem;font-weight:500;line-height:16px;letter-spacing:.28px}.caption-sm-italic{font-family:Rubik,sans-serif;font-size:.75rem;font-weight:500;line-height:16px;font-style:italic;letter-spacing:.28px}.ctn-gnrl{position:relative;display:flex;flex-direction:column;cursor:pointer;padding:8px 12px;box-sizing:border-box;border-radius:4px;border:1px solid #eaeaea}.ctn-gnrl:hover{border:1px solid #C4DFFF;box-shadow:0 1px 3px #0000001f,0 1px 2px #00000014}.ctn-gnrl:hover .fecha{display:none;pointer-events:none}.ctn-gnrl:hover .buttons-hove{display:flex;pointer-events:auto}.ctn-card{position:relative;display:flex;align-items:center;gap:24px}.ctn-inf{display:flex;flex:1 0 0;align-items:center;gap:16px}.icon-article-person{color:#434343}.info{display:flex;flex:1 0 0;flex-direction:column;align-items:flex-start}.title-no-read{font-weight:500}.ctn-icons{display:flex;align-items:center;gap:16px}.icon-dot{background-color:transparent;display:none;align-items:center;width:8px;height:8px;aspect-ratio:1/1;border-radius:100px}.icon-dot-f{display:flex;background-color:#2167ff}.fecha{width:76px}.buttons-hove{display:none;pointer-events:none;gap:4px}.ctn-collapse-card{max-height:1000px;overflow:hidden;transition:max-height .3s ease-in-out}.ctn-collapse-card.collapsed{max-height:0px}.ctn-clp{display:flex;gap:8px}.buttons-clp{display:flex;padding:4px;flex-direction:column;width:44px;box-sizing:border-box;gap:4px;justify-content:center}.ctn-info-clp{display:flex;padding:4px 8px;flex-direction:column;gap:12px;flex:1 0 0}.text-info{display:flex;flex-direction:column;align-items:flex-start;flex:1 0 0}ius-simple-divider{margin:8px 0}.row-text-1{display:flex;align-items:center;gap:8px}.row-text-2{display:flex;align-items:center;gap:4px}.txt-pry{color:#333}.txt-sec{color:#595959}.txt-ter{color:#8c8c8c}\n"] }]
+                    ], template: "<div class=\"ctn-gnrl\" (click)=\"toggleCollapse()\">\r\n    <div class=\"ctn-card\">\r\n        <div class=\"ctn-inf\">\r\n            <ius-icon-sm iconName=\"icon-article-person\" class=\"icon-article-person\"></ius-icon-sm>\r\n            <div class=\"info\">\r\n                <span class=\"caption-sm txt-ter\">Gesti\u00F3n - Impulso Procesal</span>\r\n                <span class=\"body-base-1\" [ngClass]=\"{'title-no-read': read === false}\">{{titulo}}</span>\r\n                <div class=\"body-base-1 txt-sec row-text-1\">\r\n                    <span>{{text1}}</span>\r\n                    @if (origen) {\r\n                    <span>-</span>\r\n                    <span>{{origen}}</span>\r\n                    }\r\n                </div>\r\n            </div>\r\n        </div>\r\n        <div class=\"ctn-icons\">\r\n            @if (hasDocuments) {\r\n            <div class=\"row-text-1\">\r\n                <ius-icon-sm iconName=\"icon-attach-file\" class=\"txt-sec\"></ius-icon-sm>\r\n            </div>\r\n            }\r\n            <div class=\"row-text-2\">\r\n                <div class=\"icon-dot\" [ngClass]=\"{'icon-dot-f': read === false}\"></div>\r\n                <span class=\"body-sm txt-ter fecha\">{{fechaPrincipal | date: 'd MMM yyyy'}}</span>\r\n                <span class=\"buttons-hove\">\r\n                    <ius-button-circle-tertiary iconName=\"icon-mark-chat-read\"\r\n                        [iusPopoverContent]=\"read ? 'Marcar como no le\u00EDdo' : 'Marcar como le\u00EDdo'\"\r\n                        (buttonClicked)=\"clickButtonRead($event)\"></ius-button-circle-tertiary>\r\n                    <ius-button-circle-tertiary iconName=\"icon-content-copy\"\r\n                        iusPopoverContent=\"Copiar informaci\u00F3n\"\r\n                        (buttonClicked)=\"clickButtonCopy($event)\"></ius-button-circle-tertiary>\r\n                    <ius-button-circle-tertiary iconName=\"icon-edit\"\r\n                        iusPopoverContent=\"Editar\"\r\n                        (buttonClicked)=\"clickButtonEdit($event)\"></ius-button-circle-tertiary>\r\n                    <ius-button-circle-tertiary iconName=\"icon-delete\"\r\n                        iusPopoverContent=\"Eliminar\"\r\n                        (buttonClicked)=\"clickButtonDelete($event)\"></ius-button-circle-tertiary>\r\n                </span>\r\n            </div>\r\n            <ius-icon-sm [iconName]=\"collapse ? 'icon-keyboard-arrow-down' : 'icon-keyboard-arrow-up'\"\r\n                class=\"txt-pry\"></ius-icon-sm>\r\n        </div>\r\n    </div>\r\n    <div class=\"ctn-collapse-card\" [ngClass]=\"{'collapsed': collapse}\">\r\n        <ius-simple-divider></ius-simple-divider>\r\n        <div class=\"ctn-clp\">\r\n            <div class=\"ctn-info-clp\">\r\n                <div class=\"text-info\">\r\n                    <span class=\"body-base-1 txt-pry\">{{descripcion}}</span>\r\n                </div>\r\n            </div>\r\n            <div class=\"buttons-clp\">\r\n                @if (hasDocuments) {\r\n                <ius-button-menu-link iconName=\"icon-attach-file\" iconColor=\"#184FDB\"\r\n                    iusPopoverContent=\"Ver documentos\"\r\n                    (buttonClicked)=\"clickButtonDocs($event)\"></ius-button-menu-link>\r\n                }\r\n            </div>\r\n        </div>\r\n    </div>\r\n</div>", styles: [".h1{font-family:Roboto,sans-serif;font-size:2.375rem;font-weight:500;line-height:46px}.h2{font-family:Roboto,sans-serif;font-size:1.875rem;font-weight:700;line-height:38px}.h3{font-family:Roboto,sans-serif;font-size:1.5rem;font-weight:500;line-height:32px}.h4{font-family:Roboto,sans-serif;font-size:1.25rem;font-weight:700;line-height:26px}.h5{font-family:Roboto,sans-serif;font-size:1.125rem;font-weight:500;line-height:24px;letter-spacing:.18px}.label-large{font-family:Roboto,sans-serif;font-size:1rem;font-weight:500;line-height:22px}.body-large{font-family:Rubik,sans-serif;font-size:1rem;font-weight:400;line-height:22px}.label-base{font-family:Rubik,sans-serif;font-size:.875rem;font-weight:500;line-height:20px;letter-spacing:.28px}.body-base{font-family:Rubik,sans-serif;font-size:.875rem;font-weight:400;line-height:20px;font-style:italic;letter-spacing:.28px}.body-base-1,.body-base-1-1{font-family:Rubik,sans-serif;font-size:.875rem;font-weight:400;line-height:20px;letter-spacing:.28px}.body-sm{font-family:Rubik,sans-serif;font-size:.75rem;font-weight:400;line-height:16px;letter-spacing:.28px}.body-sm-italic{font-family:Rubik,sans-serif;font-size:.75rem;font-weight:400;line-height:16px;font-style:italic;letter-spacing:.28px}.caption-sm{font-family:Rubik,sans-serif;font-size:.75rem;font-weight:500;line-height:16px;letter-spacing:.28px}.caption-sm-italic{font-family:Rubik,sans-serif;font-size:.75rem;font-weight:500;line-height:16px;font-style:italic;letter-spacing:.28px}.ctn-gnrl{position:relative;display:flex;flex-direction:column;cursor:pointer;padding:8px 12px;box-sizing:border-box;border-radius:4px;border:1px solid #eaeaea}.ctn-gnrl:hover{border:1px solid #C4DFFF;box-shadow:0 1px 3px #0000001f,0 1px 2px #00000014}.ctn-gnrl:hover .fecha{display:none;pointer-events:none}.ctn-gnrl:hover .buttons-hove{display:flex;pointer-events:auto}.ctn-card{position:relative;display:flex;align-items:center;gap:24px}.ctn-inf{display:flex;flex:1 0 0;align-items:center;gap:16px}.icon-article-person{color:#434343}.info{display:flex;flex:1 0 0;flex-direction:column;align-items:flex-start}.title-no-read{font-weight:500}.ctn-icons{display:flex;align-items:center;gap:16px}.icon-dot{background-color:transparent;display:none;align-items:center;width:8px;height:8px;aspect-ratio:1/1;border-radius:100px}.icon-dot-f{display:flex;background-color:#2167ff}.fecha{width:76px}.buttons-hove{display:none;pointer-events:none;gap:4px}.ctn-collapse-card{max-height:1000px;overflow:hidden;transition:max-height .3s ease-in-out}.ctn-collapse-card.collapsed{max-height:0px}.ctn-clp{display:flex;gap:8px}.buttons-clp{display:flex;padding:4px;flex-direction:column;width:44px;box-sizing:border-box;gap:4px;justify-content:center}.ctn-info-clp{display:flex;padding:4px 8px;flex-direction:column;gap:12px;flex:1 0 0}.text-info{display:flex;flex-direction:column;align-items:flex-start;flex:1 0 0}ius-simple-divider{margin:8px 0}.row-text-1{display:flex;align-items:center;gap:8px}.row-text-2{display:flex;align-items:center;gap:4px}.txt-pry{color:#333}.txt-sec{color:#595959}.txt-ter{color:#8c8c8c}\n"] }]
         }], ctorParameters: () => [{ type: i1$1.DatePipe }], propDecorators: { priority: [{
                 type: Input
             }], hasDocuments: [{
@@ -7666,11 +7670,11 @@ class InputCardComponent {
         event.preventDefault();
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: InputCardComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "17.3.12", type: InputCardComponent, isStandalone: true, selector: "ius-input-card", inputs: { textInputCvv: "textInputCvv", textInputMonth: "textInputMonth", textInputYear: "textInputYear", required: "required", disabled: "disabled", isEnableClearText: "isEnableClearText", showHelpText: "showHelpText", labelSuperior: "labelSuperior", labelInferior: "labelInferior", iconInput: "iconInput", initialTextCvv: "initialTextCvv", initialTextMonth: "initialTextMonth", initialTextYear: "initialTextYear" }, outputs: { onChangesValueMonth: "onChangesValueMonth", onChangesValueYear: "onChangesValueYear", onChangesValueCVV: "onChangesValueCVV", onEnterKey: "onEnterKey" }, viewQueries: [{ propertyName: "yearInput", first: true, predicate: ["yearInput"], descendants: true }], ngImport: i0, template: "<div class=\"container-general\">\r\n  @if (labelSuperior) {\r\n  <div class=\"container-label-sup\" [ngClass]=\"{\r\n      disabled: disabled\r\n    }\">\r\n    @if(!disabled && required){\r\n    <div class=\"icon-dot\" aria-hidden=\"true\"></div>\r\n    }\r\n    <label class=\"label-text\" [id]=\"'label-' + labelSuperior\">{{ labelSuperior }}</label>\r\n    @if(!disabled && showHelpText){\r\n    <ius-icon-md iconName=\"icon-help\" class=\"icon-color-help\" role=\"img\"\r\n      aria-label=\"Informaci\u00F3n de ayuda\"></ius-icon-md>\r\n    }\r\n    <span aria-hidden=\"true\">:</span>\r\n  </div>\r\n  }\r\n\r\n  <div class=\"inputs-wrapper\">\r\n    <div class=\"inputs-container\">\r\n      @if (iconInput) {\r\n      <ius-icon-md [iconName]=\"iconInput\" class=\"icon-color\" aria-hidden=\"true\"></ius-icon-md>\r\n      }\r\n\r\n      <div class=\"card-date-container container-card\" role=\"group\" aria-labelledby=\"label-fecha\" [ngClass]=\"{\r\n          disabled: disabled,\r\n          focused: isFocused,\r\n          alert: !isFocused && isAlertText && !disabled\r\n        }\">\r\n        <!-- MES -->\r\n        <input type=\"text\" maxlength=\"2\" inputmode=\"numeric\" class=\"date-input\" id=\"month-input\" placeholder=\"MM\"\r\n          aria-label=\"Mes (MM)\" [disabled]=\"disabled\" (input)=\"onChangeMonth($event)\" (keydown)=\"onKeyDown($event)\"\r\n          [(ngModel)]=\"textInputMonth\" (drop)=\"onDropBlock($event)\" (dragover)=\"onDragOverBlock($event)\" />\r\n\r\n        <span class=\"separator\" aria-hidden=\"true\">/</span>\r\n\r\n        <!-- A\u00D1O -->\r\n        <input type=\"text\" maxlength=\"4\" inputmode=\"numeric\" class=\"date-input year\" id=\"year-input\" placeholder=\"AAAA\"\r\n          aria-label=\"A\u00F1o (AAAA)\" [disabled]=\"disabled\" (input)=\"onChangeYear($event)\" (keydown)=\"onKeyDown($event)\"\r\n          [(ngModel)]=\"textInputYear\" (drop)=\"onDropBlock($event)\" (dragover)=\"onDragOverBlock($event)\" #yearInput />\r\n      </div>\r\n\r\n      <div class=\"container-card cvv-container\" role=\"group\" aria-labelledby=\"label-cvv\" [ngClass]=\"{\r\n          disabled: disabled,\r\n          focused: isFocused,\r\n          alert: !isFocused && isAlertText && !disabled\r\n        }\">\r\n        <input type=\"text\" maxlength=\"3\" inputmode=\"numeric\" class=\"cvv-input\" id=\"cvv-input\" placeholder=\"CVV\"\r\n          aria-label=\"CVV (3 d\u00EDgitos)\" [disabled]=\"disabled\" (input)=\"onChangeCVV($event)\" (keydown)=\"onKeyDown($event)\"\r\n          [(ngModel)]=\"textInputCvv\" (drop)=\"onDropBlock($event)\" (dragover)=\"onDragOverBlock($event)\" />\r\n      </div>\r\n    </div>\r\n\r\n    @if (!disabled && isEnableClearText) {\r\n    <button class=\"button-delete\" type=\"button\" aria-label=\"Limpiar formulario\" (click)=\"clearSearch()\">\r\n      <ius-icon-md iconName=\"icon-cancel\" class=\"icon-color-cancel\" aria-hidden=\"true\"></ius-icon-md>\r\n    </button>\r\n    }\r\n  </div>\r\n\r\n  @if (labelInferior && isFocused) {\r\n  <span class=\"label-inf\" role=\"status\" aria-live=\"polite\">{{ labelInferior }}</span>\r\n  } @if (labelInferior && !isFocused && isAlertText) {\r\n  <span class=\"label-inf\" role=\"alert\" [ngClass]=\"{\r\n      alert: !isFocused && isAlertText && !disabled\r\n    }\">{{ labelInferior }}</span>\r\n  }\r\n</div>", styles: [".h1{font-family:Roboto,sans-serif;font-size:2.375rem;font-weight:500;line-height:46px}.h2{font-family:Roboto,sans-serif;font-size:1.875rem;font-weight:700;line-height:38px}.h3{font-family:Roboto,sans-serif;font-size:1.5rem;font-weight:500;line-height:32px}.h4{font-family:Roboto,sans-serif;font-size:1.25rem;font-weight:700;line-height:26px}.h5{font-family:Roboto,sans-serif;font-size:1.125rem;font-weight:500;line-height:24px;letter-spacing:.18px}.label-large{font-family:Roboto,sans-serif;font-size:1rem;font-weight:500;line-height:22px}.body-large{font-family:Rubik,sans-serif;font-size:1rem;font-weight:400;line-height:22px}.label-base{font-family:Rubik,sans-serif;font-size:.875rem;font-weight:500;line-height:20px;letter-spacing:.28px}.body-base{font-family:Rubik,sans-serif;font-size:.875rem;font-weight:400;line-height:20px;font-style:italic;letter-spacing:.28px}.body-base-1,.body-base-1-1{font-family:Rubik,sans-serif;font-size:.875rem;font-weight:400;line-height:20px;letter-spacing:.28px}.body-sm{font-family:Rubik,sans-serif;font-size:.75rem;font-weight:400;line-height:16px;letter-spacing:.28px}.body-sm-italic{font-family:Rubik,sans-serif;font-size:.75rem;font-weight:400;line-height:16px;font-style:italic;letter-spacing:.28px}.caption-sm{font-family:Rubik,sans-serif;font-size:.75rem;font-weight:500;line-height:16px;letter-spacing:.28px}.caption-sm-italic{font-family:Rubik,sans-serif;font-size:.75rem;font-weight:500;line-height:16px;font-style:italic;letter-spacing:.28px}.container-general{position:relative;height:100%}.container-card{display:flex;padding:10px 12px;justify-content:flex-start;align-items:center;gap:4px;border:1px solid #f5f5f5;border-radius:8px;background:#f5f5f5;font-family:Rubik,sans-serif;font-size:.875rem;font-weight:400;line-height:20px;letter-spacing:.28px;transition:all .2s ease-in-out}.container-card:hover:not(.disabled):not(.focused):not(.alert){background:#edf6ff}.container-card.focused{border:1px solid #0581BC;background:#edf6ff}.container-card.disabled{background:#f5f5f5}.container-card.disabled .icon-color,.container-card.disabled input{color:#bfbfbf}.container-card.disabled input::placeholder{color:#bfbfbf;opacity:1}.container-card.alert{border:1px solid #DB2E2A;background:#fff4f0}.icon-color{color:#595959}.icon-color-cancel{color:#013169}.container-card input,.card-date-container input{display:flex;align-items:center;border:none;outline:none;background-color:transparent;font-family:Rubik,sans-serif;font-size:.875rem;font-weight:400;line-height:20px;letter-spacing:.28px}.container-card input:disabled,.card-date-container input:disabled{color:#bfbfbf}.button-delete{display:flex;align-items:center;justify-content:center;background:none;border:none;cursor:pointer;padding:0;color:#595959}.button-delete:hover{color:#013169}.container-label-sup{display:flex;align-items:center;gap:4px;margin-bottom:8px;color:#333;font-family:Roboto,sans-serif;font-size:.875rem;font-weight:500;line-height:20px;letter-spacing:.28px}.container-label-sup.disabled{color:#bfbfbf}.icon-dot{display:flex;align-items:center;width:4px;height:4px;aspect-ratio:1/1;background-color:#db2e2a;border-radius:100px}.icon-color-help{color:#8c8c8c}.label-inf{display:flex;position:absolute;top:calc(100% + 4px);left:0;margin-top:4px;color:#595959;font-family:Roboto,sans-serif;font-size:.75rem;font-style:italic;font-weight:500;line-height:16px;letter-spacing:.24px}.label-inf.alert{color:#931224}.label-text{cursor:pointer}.inputs-wrapper{position:relative}.inputs-container{display:flex;gap:12px;align-items:center}.cvv-container{padding:10px 8px;flex-shrink:0}.cvv-input{display:flex;align-items:center;border:none;outline:none;background-color:transparent;font-family:Rubik,sans-serif;font-size:.875rem;font-weight:400;line-height:20px;letter-spacing:.28px;text-align:center;width:45px;flex:0 0 auto}.card-date-container{display:flex;align-items:center;justify-content:center;gap:4px;flex:1 1 auto}.date-input{border:none;outline:none;background:transparent;font-size:.875rem;width:30px;text-align:center;flex:0 0 auto}.date-input.year{width:50px}.separator{margin:0 4px;opacity:.6;flex:0 0 auto}input::-webkit-outer-spin-button,input::-webkit-inner-spin-button{-webkit-appearance:none;margin:0}\n"], dependencies: [{ kind: "component", type: IconMdComponent, selector: "ius-icon-md", inputs: ["iconName", "color"] }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1$3.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$3.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$3.MaxLengthValidator, selector: "[maxlength][formControlName],[maxlength][formControl],[maxlength][ngModel]", inputs: ["maxlength"] }, { kind: "directive", type: i1$3.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1$1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }] }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "17.3.12", type: InputCardComponent, isStandalone: true, selector: "ius-input-card", inputs: { textInputCvv: "textInputCvv", textInputMonth: "textInputMonth", textInputYear: "textInputYear", required: "required", disabled: "disabled", isEnableClearText: "isEnableClearText", showHelpText: "showHelpText", labelSuperior: "labelSuperior", labelInferior: "labelInferior", iconInput: "iconInput", initialTextCvv: "initialTextCvv", initialTextMonth: "initialTextMonth", initialTextYear: "initialTextYear" }, outputs: { onChangesValueMonth: "onChangesValueMonth", onChangesValueYear: "onChangesValueYear", onChangesValueCVV: "onChangesValueCVV", onEnterKey: "onEnterKey" }, viewQueries: [{ propertyName: "yearInput", first: true, predicate: ["yearInput"], descendants: true }], ngImport: i0, template: "<div class=\"container-general\">\r\n  @if (labelSuperior) {\r\n  <div class=\"container-label-sup\" [ngClass]=\"{\r\n      disabled: disabled\r\n    }\">\r\n    @if(!disabled && required){\r\n    <div class=\"icon-dot\" aria-hidden=\"true\"></div>\r\n    }\r\n    <label class=\"label-text\" [id]=\"'label-' + labelSuperior\">{{ labelSuperior }}</label>\r\n    @if(!disabled && showHelpText){\r\n    <ius-icon-md iconName=\"icon-help\" class=\"icon-color-help\" role=\"img\"\r\n      aria-label=\"Informaci\u00F3n de ayuda\"></ius-icon-md>\r\n    }\r\n    <span aria-hidden=\"true\">:</span>\r\n  </div>\r\n  }\r\n\r\n  <div class=\"inputs-wrapper\">\r\n    <div class=\"inputs-container\">\r\n      @if (iconInput) {\r\n      <ius-icon-md [iconName]=\"iconInput\" class=\"icon-color\" aria-hidden=\"true\"></ius-icon-md>\r\n      }\r\n\r\n      <div class=\"card-date-container container-card\" role=\"group\" aria-labelledby=\"label-fecha\" [ngClass]=\"{\r\n          disabled: disabled,\r\n          focused: isFocused,\r\n          alert: !isFocused && isAlertText && !disabled\r\n        }\">\r\n        <!-- MES -->\r\n        <input type=\"text\" maxlength=\"2\" inputmode=\"numeric\" class=\"date-input\" id=\"month-input\" placeholder=\"MM\"\r\n          aria-label=\"Mes (MM)\" [disabled]=\"disabled\" (input)=\"onChangeMonth($event)\" (keydown)=\"onKeyDown($event)\"\r\n          [(ngModel)]=\"textInputMonth\" (drop)=\"onDropBlock($event)\" (dragover)=\"onDragOverBlock($event)\" />\r\n\r\n        <span class=\"separator\" aria-hidden=\"true\">/</span>\r\n\r\n        <!-- A\u00D1O -->\r\n        <input type=\"text\" maxlength=\"4\" inputmode=\"numeric\" class=\"date-input year\" id=\"year-input\" placeholder=\"AAAA\"\r\n          aria-label=\"A\u00F1o (AAAA)\" [disabled]=\"disabled\" (input)=\"onChangeYear($event)\" (keydown)=\"onKeyDown($event)\"\r\n          [(ngModel)]=\"textInputYear\" (drop)=\"onDropBlock($event)\" (dragover)=\"onDragOverBlock($event)\" #yearInput />\r\n      </div>\r\n\r\n      <div class=\"container-card cvv-container\" role=\"group\" aria-labelledby=\"label-cvv\" [ngClass]=\"{\r\n          disabled: disabled,\r\n          focused: isFocused,\r\n          alert: !isFocused && isAlertText && !disabled\r\n        }\">\r\n        <input type=\"text\" maxlength=\"3\" inputmode=\"numeric\" class=\"cvv-input\" id=\"cvv-input\" placeholder=\"CVV\"\r\n          aria-label=\"CVV (3 d\u00EDgitos)\" [disabled]=\"disabled\" (input)=\"onChangeCVV($event)\" (keydown)=\"onKeyDown($event)\"\r\n          [(ngModel)]=\"textInputCvv\" (drop)=\"onDropBlock($event)\" (dragover)=\"onDragOverBlock($event)\" />\r\n      </div>\r\n    </div>\r\n\r\n    @if (!disabled && isEnableClearText) {\r\n    <button class=\"button-delete\" type=\"button\" aria-label=\"Limpiar formulario\" (click)=\"clearSearch()\">\r\n      <ius-icon-md iconName=\"icon-cancel\" class=\"icon-color-cancel\" aria-hidden=\"true\"></ius-icon-md>\r\n    </button>\r\n    }\r\n  </div>\r\n\r\n  @if (labelInferior && isFocused) {\r\n  <span class=\"label-inf\" role=\"status\" aria-live=\"polite\">{{ labelInferior }}</span>\r\n  } @if (labelInferior && !isFocused && isAlertText) {\r\n  <span class=\"label-inf\" role=\"alert\" [ngClass]=\"{\r\n      alert: !isFocused && isAlertText && !disabled\r\n    }\">{{ labelInferior }}</span>\r\n  }\r\n</div>", styles: [".h1{font-family:Roboto,sans-serif;font-size:2.375rem;font-weight:500;line-height:46px}.h2{font-family:Roboto,sans-serif;font-size:1.875rem;font-weight:700;line-height:38px}.h3{font-family:Roboto,sans-serif;font-size:1.5rem;font-weight:500;line-height:32px}.h4{font-family:Roboto,sans-serif;font-size:1.25rem;font-weight:700;line-height:26px}.h5{font-family:Roboto,sans-serif;font-size:1.125rem;font-weight:500;line-height:24px;letter-spacing:.18px}.label-large{font-family:Roboto,sans-serif;font-size:1rem;font-weight:500;line-height:22px}.body-large{font-family:Rubik,sans-serif;font-size:1rem;font-weight:400;line-height:22px}.label-base{font-family:Rubik,sans-serif;font-size:.875rem;font-weight:500;line-height:20px;letter-spacing:.28px}.body-base{font-family:Rubik,sans-serif;font-size:.875rem;font-weight:400;line-height:20px;font-style:italic;letter-spacing:.28px}.body-base-1,.body-base-1-1{font-family:Rubik,sans-serif;font-size:.875rem;font-weight:400;line-height:20px;letter-spacing:.28px}.body-sm{font-family:Rubik,sans-serif;font-size:.75rem;font-weight:400;line-height:16px;letter-spacing:.28px}.body-sm-italic{font-family:Rubik,sans-serif;font-size:.75rem;font-weight:400;line-height:16px;font-style:italic;letter-spacing:.28px}.caption-sm{font-family:Rubik,sans-serif;font-size:.75rem;font-weight:500;line-height:16px;letter-spacing:.28px}.caption-sm-italic{font-family:Rubik,sans-serif;font-size:.75rem;font-weight:500;line-height:16px;font-style:italic;letter-spacing:.28px}.container-general{position:relative;height:100%}.container-card{display:flex;padding:10px 12px;justify-content:flex-start;align-items:center;gap:4px;border:1px solid #f5f5f5;border-radius:8px;background:#f5f5f5;font-family:Rubik,sans-serif;font-size:.875rem;font-weight:400;line-height:20px;letter-spacing:.28px;transition:all .2s ease-in-out}.container-card:hover:not(.disabled):not(.focused):not(.alert){background:#edf6ff}.container-card.focused{border:1px solid #0581BC;background:#edf6ff}.container-card.disabled{background:#f5f5f5}.container-card.disabled .icon-color,.container-card.disabled input{color:#bfbfbf}.container-card.disabled input::placeholder{color:#bfbfbf;opacity:1}.container-card.alert{border:1px solid #DB2E2A;background:#fff4f0}.icon-color{color:#595959}.icon-color-cancel{color:#013169}.container-card input,.card-date-container input{display:flex;align-items:center;border:none;outline:none;background-color:transparent;font-family:Rubik,sans-serif;font-size:.875rem;font-weight:400;line-height:20px;letter-spacing:.28px}.container-card input:disabled,.card-date-container input:disabled{color:#bfbfbf}.button-delete{display:flex;align-items:center;justify-content:center;background:none;border:none;cursor:pointer;padding:0;color:#595959}.button-delete:hover{color:#013169}.container-label-sup{display:flex;align-items:center;gap:4px;margin-bottom:8px;color:#333;font-family:Rubik,sans-serif;font-size:.875rem;font-weight:500;line-height:20px;letter-spacing:.28px}.container-label-sup.disabled{color:#bfbfbf}.icon-dot{display:flex;align-items:center;width:4px;height:4px;aspect-ratio:1/1;background-color:#db2e2a;border-radius:100px}.icon-color-help{color:#8c8c8c}.label-inf{display:flex;position:absolute;top:calc(100% + 4px);left:0;margin-top:4px;color:#595959;font-family:Roboto,sans-serif;font-size:.75rem;font-style:italic;font-weight:500;line-height:16px;letter-spacing:.24px}.label-inf.alert{color:#931224}.label-text{cursor:pointer}.inputs-wrapper{position:relative}.inputs-container{display:flex;gap:12px;align-items:center}.cvv-container{padding:10px 8px;flex-shrink:0}.cvv-input{display:flex;align-items:center;border:none;outline:none;background-color:transparent;font-family:Rubik,sans-serif;font-size:.875rem;font-weight:400;line-height:20px;letter-spacing:.28px;text-align:center;width:45px;flex:0 0 auto}.card-date-container{display:flex;align-items:center;justify-content:center;gap:4px;flex:1 1 auto}.date-input{border:none;outline:none;background:transparent;font-size:.875rem;width:30px;text-align:center;flex:0 0 auto}.date-input.year{width:50px}.separator{margin:0 4px;opacity:.6;flex:0 0 auto}input::-webkit-outer-spin-button,input::-webkit-inner-spin-button{-webkit-appearance:none;margin:0}\n"], dependencies: [{ kind: "component", type: IconMdComponent, selector: "ius-icon-md", inputs: ["iconName", "color"] }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1$3.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$3.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$3.MaxLengthValidator, selector: "[maxlength][formControlName],[maxlength][formControl],[maxlength][ngModel]", inputs: ["maxlength"] }, { kind: "directive", type: i1$3.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1$1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }] }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: InputCardComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'ius-input-card', standalone: true, imports: [IconMdComponent, FormsModule, CommonModule], template: "<div class=\"container-general\">\r\n  @if (labelSuperior) {\r\n  <div class=\"container-label-sup\" [ngClass]=\"{\r\n      disabled: disabled\r\n    }\">\r\n    @if(!disabled && required){\r\n    <div class=\"icon-dot\" aria-hidden=\"true\"></div>\r\n    }\r\n    <label class=\"label-text\" [id]=\"'label-' + labelSuperior\">{{ labelSuperior }}</label>\r\n    @if(!disabled && showHelpText){\r\n    <ius-icon-md iconName=\"icon-help\" class=\"icon-color-help\" role=\"img\"\r\n      aria-label=\"Informaci\u00F3n de ayuda\"></ius-icon-md>\r\n    }\r\n    <span aria-hidden=\"true\">:</span>\r\n  </div>\r\n  }\r\n\r\n  <div class=\"inputs-wrapper\">\r\n    <div class=\"inputs-container\">\r\n      @if (iconInput) {\r\n      <ius-icon-md [iconName]=\"iconInput\" class=\"icon-color\" aria-hidden=\"true\"></ius-icon-md>\r\n      }\r\n\r\n      <div class=\"card-date-container container-card\" role=\"group\" aria-labelledby=\"label-fecha\" [ngClass]=\"{\r\n          disabled: disabled,\r\n          focused: isFocused,\r\n          alert: !isFocused && isAlertText && !disabled\r\n        }\">\r\n        <!-- MES -->\r\n        <input type=\"text\" maxlength=\"2\" inputmode=\"numeric\" class=\"date-input\" id=\"month-input\" placeholder=\"MM\"\r\n          aria-label=\"Mes (MM)\" [disabled]=\"disabled\" (input)=\"onChangeMonth($event)\" (keydown)=\"onKeyDown($event)\"\r\n          [(ngModel)]=\"textInputMonth\" (drop)=\"onDropBlock($event)\" (dragover)=\"onDragOverBlock($event)\" />\r\n\r\n        <span class=\"separator\" aria-hidden=\"true\">/</span>\r\n\r\n        <!-- A\u00D1O -->\r\n        <input type=\"text\" maxlength=\"4\" inputmode=\"numeric\" class=\"date-input year\" id=\"year-input\" placeholder=\"AAAA\"\r\n          aria-label=\"A\u00F1o (AAAA)\" [disabled]=\"disabled\" (input)=\"onChangeYear($event)\" (keydown)=\"onKeyDown($event)\"\r\n          [(ngModel)]=\"textInputYear\" (drop)=\"onDropBlock($event)\" (dragover)=\"onDragOverBlock($event)\" #yearInput />\r\n      </div>\r\n\r\n      <div class=\"container-card cvv-container\" role=\"group\" aria-labelledby=\"label-cvv\" [ngClass]=\"{\r\n          disabled: disabled,\r\n          focused: isFocused,\r\n          alert: !isFocused && isAlertText && !disabled\r\n        }\">\r\n        <input type=\"text\" maxlength=\"3\" inputmode=\"numeric\" class=\"cvv-input\" id=\"cvv-input\" placeholder=\"CVV\"\r\n          aria-label=\"CVV (3 d\u00EDgitos)\" [disabled]=\"disabled\" (input)=\"onChangeCVV($event)\" (keydown)=\"onKeyDown($event)\"\r\n          [(ngModel)]=\"textInputCvv\" (drop)=\"onDropBlock($event)\" (dragover)=\"onDragOverBlock($event)\" />\r\n      </div>\r\n    </div>\r\n\r\n    @if (!disabled && isEnableClearText) {\r\n    <button class=\"button-delete\" type=\"button\" aria-label=\"Limpiar formulario\" (click)=\"clearSearch()\">\r\n      <ius-icon-md iconName=\"icon-cancel\" class=\"icon-color-cancel\" aria-hidden=\"true\"></ius-icon-md>\r\n    </button>\r\n    }\r\n  </div>\r\n\r\n  @if (labelInferior && isFocused) {\r\n  <span class=\"label-inf\" role=\"status\" aria-live=\"polite\">{{ labelInferior }}</span>\r\n  } @if (labelInferior && !isFocused && isAlertText) {\r\n  <span class=\"label-inf\" role=\"alert\" [ngClass]=\"{\r\n      alert: !isFocused && isAlertText && !disabled\r\n    }\">{{ labelInferior }}</span>\r\n  }\r\n</div>", styles: [".h1{font-family:Roboto,sans-serif;font-size:2.375rem;font-weight:500;line-height:46px}.h2{font-family:Roboto,sans-serif;font-size:1.875rem;font-weight:700;line-height:38px}.h3{font-family:Roboto,sans-serif;font-size:1.5rem;font-weight:500;line-height:32px}.h4{font-family:Roboto,sans-serif;font-size:1.25rem;font-weight:700;line-height:26px}.h5{font-family:Roboto,sans-serif;font-size:1.125rem;font-weight:500;line-height:24px;letter-spacing:.18px}.label-large{font-family:Roboto,sans-serif;font-size:1rem;font-weight:500;line-height:22px}.body-large{font-family:Rubik,sans-serif;font-size:1rem;font-weight:400;line-height:22px}.label-base{font-family:Rubik,sans-serif;font-size:.875rem;font-weight:500;line-height:20px;letter-spacing:.28px}.body-base{font-family:Rubik,sans-serif;font-size:.875rem;font-weight:400;line-height:20px;font-style:italic;letter-spacing:.28px}.body-base-1,.body-base-1-1{font-family:Rubik,sans-serif;font-size:.875rem;font-weight:400;line-height:20px;letter-spacing:.28px}.body-sm{font-family:Rubik,sans-serif;font-size:.75rem;font-weight:400;line-height:16px;letter-spacing:.28px}.body-sm-italic{font-family:Rubik,sans-serif;font-size:.75rem;font-weight:400;line-height:16px;font-style:italic;letter-spacing:.28px}.caption-sm{font-family:Rubik,sans-serif;font-size:.75rem;font-weight:500;line-height:16px;letter-spacing:.28px}.caption-sm-italic{font-family:Rubik,sans-serif;font-size:.75rem;font-weight:500;line-height:16px;font-style:italic;letter-spacing:.28px}.container-general{position:relative;height:100%}.container-card{display:flex;padding:10px 12px;justify-content:flex-start;align-items:center;gap:4px;border:1px solid #f5f5f5;border-radius:8px;background:#f5f5f5;font-family:Rubik,sans-serif;font-size:.875rem;font-weight:400;line-height:20px;letter-spacing:.28px;transition:all .2s ease-in-out}.container-card:hover:not(.disabled):not(.focused):not(.alert){background:#edf6ff}.container-card.focused{border:1px solid #0581BC;background:#edf6ff}.container-card.disabled{background:#f5f5f5}.container-card.disabled .icon-color,.container-card.disabled input{color:#bfbfbf}.container-card.disabled input::placeholder{color:#bfbfbf;opacity:1}.container-card.alert{border:1px solid #DB2E2A;background:#fff4f0}.icon-color{color:#595959}.icon-color-cancel{color:#013169}.container-card input,.card-date-container input{display:flex;align-items:center;border:none;outline:none;background-color:transparent;font-family:Rubik,sans-serif;font-size:.875rem;font-weight:400;line-height:20px;letter-spacing:.28px}.container-card input:disabled,.card-date-container input:disabled{color:#bfbfbf}.button-delete{display:flex;align-items:center;justify-content:center;background:none;border:none;cursor:pointer;padding:0;color:#595959}.button-delete:hover{color:#013169}.container-label-sup{display:flex;align-items:center;gap:4px;margin-bottom:8px;color:#333;font-family:Roboto,sans-serif;font-size:.875rem;font-weight:500;line-height:20px;letter-spacing:.28px}.container-label-sup.disabled{color:#bfbfbf}.icon-dot{display:flex;align-items:center;width:4px;height:4px;aspect-ratio:1/1;background-color:#db2e2a;border-radius:100px}.icon-color-help{color:#8c8c8c}.label-inf{display:flex;position:absolute;top:calc(100% + 4px);left:0;margin-top:4px;color:#595959;font-family:Roboto,sans-serif;font-size:.75rem;font-style:italic;font-weight:500;line-height:16px;letter-spacing:.24px}.label-inf.alert{color:#931224}.label-text{cursor:pointer}.inputs-wrapper{position:relative}.inputs-container{display:flex;gap:12px;align-items:center}.cvv-container{padding:10px 8px;flex-shrink:0}.cvv-input{display:flex;align-items:center;border:none;outline:none;background-color:transparent;font-family:Rubik,sans-serif;font-size:.875rem;font-weight:400;line-height:20px;letter-spacing:.28px;text-align:center;width:45px;flex:0 0 auto}.card-date-container{display:flex;align-items:center;justify-content:center;gap:4px;flex:1 1 auto}.date-input{border:none;outline:none;background:transparent;font-size:.875rem;width:30px;text-align:center;flex:0 0 auto}.date-input.year{width:50px}.separator{margin:0 4px;opacity:.6;flex:0 0 auto}input::-webkit-outer-spin-button,input::-webkit-inner-spin-button{-webkit-appearance:none;margin:0}\n"] }]
+            args: [{ selector: 'ius-input-card', standalone: true, imports: [IconMdComponent, FormsModule, CommonModule], template: "<div class=\"container-general\">\r\n  @if (labelSuperior) {\r\n  <div class=\"container-label-sup\" [ngClass]=\"{\r\n      disabled: disabled\r\n    }\">\r\n    @if(!disabled && required){\r\n    <div class=\"icon-dot\" aria-hidden=\"true\"></div>\r\n    }\r\n    <label class=\"label-text\" [id]=\"'label-' + labelSuperior\">{{ labelSuperior }}</label>\r\n    @if(!disabled && showHelpText){\r\n    <ius-icon-md iconName=\"icon-help\" class=\"icon-color-help\" role=\"img\"\r\n      aria-label=\"Informaci\u00F3n de ayuda\"></ius-icon-md>\r\n    }\r\n    <span aria-hidden=\"true\">:</span>\r\n  </div>\r\n  }\r\n\r\n  <div class=\"inputs-wrapper\">\r\n    <div class=\"inputs-container\">\r\n      @if (iconInput) {\r\n      <ius-icon-md [iconName]=\"iconInput\" class=\"icon-color\" aria-hidden=\"true\"></ius-icon-md>\r\n      }\r\n\r\n      <div class=\"card-date-container container-card\" role=\"group\" aria-labelledby=\"label-fecha\" [ngClass]=\"{\r\n          disabled: disabled,\r\n          focused: isFocused,\r\n          alert: !isFocused && isAlertText && !disabled\r\n        }\">\r\n        <!-- MES -->\r\n        <input type=\"text\" maxlength=\"2\" inputmode=\"numeric\" class=\"date-input\" id=\"month-input\" placeholder=\"MM\"\r\n          aria-label=\"Mes (MM)\" [disabled]=\"disabled\" (input)=\"onChangeMonth($event)\" (keydown)=\"onKeyDown($event)\"\r\n          [(ngModel)]=\"textInputMonth\" (drop)=\"onDropBlock($event)\" (dragover)=\"onDragOverBlock($event)\" />\r\n\r\n        <span class=\"separator\" aria-hidden=\"true\">/</span>\r\n\r\n        <!-- A\u00D1O -->\r\n        <input type=\"text\" maxlength=\"4\" inputmode=\"numeric\" class=\"date-input year\" id=\"year-input\" placeholder=\"AAAA\"\r\n          aria-label=\"A\u00F1o (AAAA)\" [disabled]=\"disabled\" (input)=\"onChangeYear($event)\" (keydown)=\"onKeyDown($event)\"\r\n          [(ngModel)]=\"textInputYear\" (drop)=\"onDropBlock($event)\" (dragover)=\"onDragOverBlock($event)\" #yearInput />\r\n      </div>\r\n\r\n      <div class=\"container-card cvv-container\" role=\"group\" aria-labelledby=\"label-cvv\" [ngClass]=\"{\r\n          disabled: disabled,\r\n          focused: isFocused,\r\n          alert: !isFocused && isAlertText && !disabled\r\n        }\">\r\n        <input type=\"text\" maxlength=\"3\" inputmode=\"numeric\" class=\"cvv-input\" id=\"cvv-input\" placeholder=\"CVV\"\r\n          aria-label=\"CVV (3 d\u00EDgitos)\" [disabled]=\"disabled\" (input)=\"onChangeCVV($event)\" (keydown)=\"onKeyDown($event)\"\r\n          [(ngModel)]=\"textInputCvv\" (drop)=\"onDropBlock($event)\" (dragover)=\"onDragOverBlock($event)\" />\r\n      </div>\r\n    </div>\r\n\r\n    @if (!disabled && isEnableClearText) {\r\n    <button class=\"button-delete\" type=\"button\" aria-label=\"Limpiar formulario\" (click)=\"clearSearch()\">\r\n      <ius-icon-md iconName=\"icon-cancel\" class=\"icon-color-cancel\" aria-hidden=\"true\"></ius-icon-md>\r\n    </button>\r\n    }\r\n  </div>\r\n\r\n  @if (labelInferior && isFocused) {\r\n  <span class=\"label-inf\" role=\"status\" aria-live=\"polite\">{{ labelInferior }}</span>\r\n  } @if (labelInferior && !isFocused && isAlertText) {\r\n  <span class=\"label-inf\" role=\"alert\" [ngClass]=\"{\r\n      alert: !isFocused && isAlertText && !disabled\r\n    }\">{{ labelInferior }}</span>\r\n  }\r\n</div>", styles: [".h1{font-family:Roboto,sans-serif;font-size:2.375rem;font-weight:500;line-height:46px}.h2{font-family:Roboto,sans-serif;font-size:1.875rem;font-weight:700;line-height:38px}.h3{font-family:Roboto,sans-serif;font-size:1.5rem;font-weight:500;line-height:32px}.h4{font-family:Roboto,sans-serif;font-size:1.25rem;font-weight:700;line-height:26px}.h5{font-family:Roboto,sans-serif;font-size:1.125rem;font-weight:500;line-height:24px;letter-spacing:.18px}.label-large{font-family:Roboto,sans-serif;font-size:1rem;font-weight:500;line-height:22px}.body-large{font-family:Rubik,sans-serif;font-size:1rem;font-weight:400;line-height:22px}.label-base{font-family:Rubik,sans-serif;font-size:.875rem;font-weight:500;line-height:20px;letter-spacing:.28px}.body-base{font-family:Rubik,sans-serif;font-size:.875rem;font-weight:400;line-height:20px;font-style:italic;letter-spacing:.28px}.body-base-1,.body-base-1-1{font-family:Rubik,sans-serif;font-size:.875rem;font-weight:400;line-height:20px;letter-spacing:.28px}.body-sm{font-family:Rubik,sans-serif;font-size:.75rem;font-weight:400;line-height:16px;letter-spacing:.28px}.body-sm-italic{font-family:Rubik,sans-serif;font-size:.75rem;font-weight:400;line-height:16px;font-style:italic;letter-spacing:.28px}.caption-sm{font-family:Rubik,sans-serif;font-size:.75rem;font-weight:500;line-height:16px;letter-spacing:.28px}.caption-sm-italic{font-family:Rubik,sans-serif;font-size:.75rem;font-weight:500;line-height:16px;font-style:italic;letter-spacing:.28px}.container-general{position:relative;height:100%}.container-card{display:flex;padding:10px 12px;justify-content:flex-start;align-items:center;gap:4px;border:1px solid #f5f5f5;border-radius:8px;background:#f5f5f5;font-family:Rubik,sans-serif;font-size:.875rem;font-weight:400;line-height:20px;letter-spacing:.28px;transition:all .2s ease-in-out}.container-card:hover:not(.disabled):not(.focused):not(.alert){background:#edf6ff}.container-card.focused{border:1px solid #0581BC;background:#edf6ff}.container-card.disabled{background:#f5f5f5}.container-card.disabled .icon-color,.container-card.disabled input{color:#bfbfbf}.container-card.disabled input::placeholder{color:#bfbfbf;opacity:1}.container-card.alert{border:1px solid #DB2E2A;background:#fff4f0}.icon-color{color:#595959}.icon-color-cancel{color:#013169}.container-card input,.card-date-container input{display:flex;align-items:center;border:none;outline:none;background-color:transparent;font-family:Rubik,sans-serif;font-size:.875rem;font-weight:400;line-height:20px;letter-spacing:.28px}.container-card input:disabled,.card-date-container input:disabled{color:#bfbfbf}.button-delete{display:flex;align-items:center;justify-content:center;background:none;border:none;cursor:pointer;padding:0;color:#595959}.button-delete:hover{color:#013169}.container-label-sup{display:flex;align-items:center;gap:4px;margin-bottom:8px;color:#333;font-family:Rubik,sans-serif;font-size:.875rem;font-weight:500;line-height:20px;letter-spacing:.28px}.container-label-sup.disabled{color:#bfbfbf}.icon-dot{display:flex;align-items:center;width:4px;height:4px;aspect-ratio:1/1;background-color:#db2e2a;border-radius:100px}.icon-color-help{color:#8c8c8c}.label-inf{display:flex;position:absolute;top:calc(100% + 4px);left:0;margin-top:4px;color:#595959;font-family:Roboto,sans-serif;font-size:.75rem;font-style:italic;font-weight:500;line-height:16px;letter-spacing:.24px}.label-inf.alert{color:#931224}.label-text{cursor:pointer}.inputs-wrapper{position:relative}.inputs-container{display:flex;gap:12px;align-items:center}.cvv-container{padding:10px 8px;flex-shrink:0}.cvv-input{display:flex;align-items:center;border:none;outline:none;background-color:transparent;font-family:Rubik,sans-serif;font-size:.875rem;font-weight:400;line-height:20px;letter-spacing:.28px;text-align:center;width:45px;flex:0 0 auto}.card-date-container{display:flex;align-items:center;justify-content:center;gap:4px;flex:1 1 auto}.date-input{border:none;outline:none;background:transparent;font-size:.875rem;width:30px;text-align:center;flex:0 0 auto}.date-input.year{width:50px}.separator{margin:0 4px;opacity:.6;flex:0 0 auto}input::-webkit-outer-spin-button,input::-webkit-inner-spin-button{-webkit-appearance:none;margin:0}\n"] }]
         }], propDecorators: { yearInput: [{
                 type: ViewChild,
                 args: ['yearInput']
@@ -7875,7 +7879,7 @@ class CreateTicketComponent {
         });
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: CreateTicketComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "17.3.12", type: CreateTicketComponent, isStandalone: true, selector: "ius-create-ticket", inputs: { tipos: "tipos", razones: "razones", loading: "loading", lastResult: "lastResult" }, outputs: { submitTicket: "submitTicket", closeForm: "closeForm" }, ngImport: i0, template: "<ius-drawer-container-right [titleDrawer]=\"'Crear Ticket'\" (onDrawerClosed)=\"onClose()\"\n  [percentProgressBar]=\"percentProgressBar\">\n  <div class=\"form between-xs\">\n    <div class=\"content\">\n      <ius-section-collapse-drawer-parent textTitle=\"Informaci\u00F3n general\" [disabled]=\"false\"\n        [isActive]=\"isExpandGeneralInformation\" (buttonClicked)=\"onExpandGeneralInformation()\">\n        <div class=\"section\">\n          <div class=\"select\">\n            <ius-input-select componentId=\"ticketType\" [required]=\"true\" [showHelpText]=\"true\" labelSuperior=\"Tipo de ticket\"\n              labelInput=\"Selecciona una opci\u00F3n\" [textInput]=\"typeSelected?.tipo\">\n              @for (type of tipos; track type) {\n              <ius-option (optionClick)=\"onSetValueType(type)\">\n                {{ type.tipo }}\n              </ius-option>\n              }\n            </ius-input-select>\n          </div>\n          <div class=\"select\">\n            <ius-input-select componentId=\"ticketReason\" [required]=\"true\" [showHelpText]=\"true\" labelSuperior=\"Raz\u00F3n del ticket\"\n              labelInput=\"Selecciona una opci\u00F3n\" [textInput]=\"reasonSelected?.razon\">\n              @for (reason of razones; track reason) {\n              <ius-option (optionClick)=\"onSetValueReason(reason)\">\n                {{ reason.razon }}\n              </ius-option>\n              }\n            </ius-input-select>\n          </div>\n          <div class=\"select\">\n            <ius-input-textfield componentId=\"tituloTicket\" [initialText]=\"tituloTicket\" [required]=\"true\" [showHelpText]=\"true\"\n              labelSuperior=\"Titulo o asunto para el ticket\" labelInput=\"Defina brevemente un asunto o titulo\"\n              (onChangesValueEvent)=\"onSetValueTituloTicket($event)\">\n            </ius-input-textfield>\n          </div>\n          <div class=\"select\">\n            <ius-input-large componentId=\"descripcionTicket\" [initialText]=\"descripcionTicket\" [required]=\"true\" [showHelpText]=\"true\"\n              labelSuperior=\"Descripcion del ticket\" labelInput=\"Describe tu idea o petici\u00F3n para el ticket\"\n              (onChangesValueEvent)=\"onSetValueDescripcionTicket($event)\">\n            </ius-input-large>\n          </div>\n        </div>\n      </ius-section-collapse-drawer-parent>\n    </div>\n\n    <div class=\"footer\">\n      <div class=\"toolbar\">\n        <div class=\"toolbar-btn\">\n          <ius-button-dynamic [labelDefault]=\"'Crear ticket'\" [labelSuccess]=\"'Agregando'\" [labelError]=\"'Error'\"\n            [loading]=\"loading\" [result]=\"lastResult\" (buttonClicked)=\"createTicket()\">\n          </ius-button-dynamic>\n        </div>\n        <div class=\"toolbar-btn\">\n          <ius-button-standard-secondary (buttonClicked)=\"onClose()\">Cancelar</ius-button-standard-secondary>\n        </div>\n      </div>\n    </div>\n  </div>\n</ius-drawer-container-right>\n", styles: [".h1{font-family:Roboto,sans-serif;font-size:2.375rem;font-weight:500;line-height:46px}.h2{font-family:Roboto,sans-serif;font-size:1.875rem;font-weight:700;line-height:38px}.h3{font-family:Roboto,sans-serif;font-size:1.5rem;font-weight:500;line-height:32px}.h4{font-family:Roboto,sans-serif;font-size:1.25rem;font-weight:700;line-height:26px}.h5{font-family:Roboto,sans-serif;font-size:1.125rem;font-weight:500;line-height:24px;letter-spacing:.18px}.label-large{font-family:Roboto,sans-serif;font-size:1rem;font-weight:500;line-height:22px}.body-large{font-family:Rubik,sans-serif;font-size:1rem;font-weight:400;line-height:22px}.label-base{font-family:Rubik,sans-serif;font-size:.875rem;font-weight:500;line-height:20px;letter-spacing:.28px}.body-base{font-family:Rubik,sans-serif;font-size:.875rem;font-weight:400;line-height:20px;font-style:italic;letter-spacing:.28px}.body-base-1,.body-base-1-1{font-family:Rubik,sans-serif;font-size:.875rem;font-weight:400;line-height:20px;letter-spacing:.28px}.body-sm{font-family:Rubik,sans-serif;font-size:.75rem;font-weight:400;line-height:16px;letter-spacing:.28px}.body-sm-italic{font-family:Rubik,sans-serif;font-size:.75rem;font-weight:400;line-height:16px;font-style:italic;letter-spacing:.28px}.caption-sm{font-family:Rubik,sans-serif;font-size:.75rem;font-weight:500;line-height:16px;letter-spacing:.28px}.caption-sm-italic{font-family:Rubik,sans-serif;font-size:.75rem;font-weight:500;line-height:16px;font-style:italic;letter-spacing:.28px}.form{display:flex;height:100%;flex-direction:column}.section{display:flex;padding:0 8px;flex-direction:column}.content{display:flex;flex-direction:column}.select{display:flex;padding:8px 16px;flex-direction:column;justify-content:center;gap:8px;align-self:stretch}.footer{display:flex;flex-direction:column;justify-content:flex-end;align-items:center;gap:10px;flex:1 0 0;align-self:stretch}.toolbar{display:flex;padding:12px 16px;flex-direction:column;justify-content:flex-end;align-items:center;gap:8px;align-self:stretch}.toolbar-btn{width:100%}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "component", type: ButtonDynamicComponent, selector: "ius-button-dynamic", inputs: ["labelDefault", "labelSuccess", "labelError", "disabled", "loading", "result", "autoReset", "autoResetDelay"], outputs: ["buttonClicked"] }, { kind: "component", type: ButtonStandardSecondaryComponent, selector: "ius-button-standard-secondary", inputs: ["disabled"], outputs: ["buttonClicked"] }, { kind: "component", type: DrawerContainerRightComponent, selector: "ius-drawer-container-right", inputs: ["titleDrawer", "percentProgressBar"], outputs: ["onPressedBackEvent", "onDrawerClosed"] }, { kind: "component", type: SectionCollapseDrawerParentComponent, selector: "ius-section-collapse-drawer-parent", inputs: ["isActive", "disabled", "textTitle", "iconName"], outputs: ["buttonClicked"] }, { kind: "component", type: InputSelectComponent, selector: "ius-input-select", inputs: ["componentId", "required", "disabled", "showHelpText", "error", "labelSuperior", "labelInferior", "errorText", "labelInput", "iconInput", "textInput", "maxlenght", "inputType"], outputs: ["onChangesValueEvent", "onEnterKey", "onBlurEvent"] }, { kind: "component", type: InputTextfieldComponent, selector: "ius-input-textfield", inputs: ["textInput", "required", "disabled", "isEnableClearText", "showHelpText", "error", "labelSuperior", "labelInferior", "errorText", "labelInput", "iconInput", "inputType", "maxlenght", "initialText"], outputs: ["onChangesValueEvent", "onEnterKey", "onBlurEvent"] }, { kind: "component", type: OptionComponent, selector: "ius-option", inputs: ["disabled", "checked", "leadingIcon"], outputs: ["optionClick"] }, { kind: "component", type: InputLargeComponent, selector: "ius-input-large", inputs: ["textInput", "required", "disabled", "showHelpText", "rows", "error", "labelSuperior", "labelInferior", "errorText", "labelInput", "maxlenght", "initialText"], outputs: ["onChangesValueEvent", "onEnterKey", "onBlurEvent"] }] }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "17.3.12", type: CreateTicketComponent, isStandalone: true, selector: "ius-create-ticket", inputs: { tipos: "tipos", razones: "razones", loading: "loading", lastResult: "lastResult" }, outputs: { submitTicket: "submitTicket", closeForm: "closeForm" }, ngImport: i0, template: "<ius-drawer-container-right [titleDrawer]=\"'Crear Ticket'\" (onDrawerClosed)=\"onClose()\"\r\n  [percentProgressBar]=\"percentProgressBar\">\r\n  <div class=\"form between-xs\">\r\n    <div class=\"content\">\r\n      <ius-section-collapse-drawer-parent textTitle=\"Informaci\u00F3n general\" [disabled]=\"false\"\r\n        [isActive]=\"isExpandGeneralInformation\" (buttonClicked)=\"onExpandGeneralInformation()\">\r\n        <div class=\"section\">\r\n          <div class=\"select\">\r\n            <ius-input-select componentId=\"ticketType\" [required]=\"true\" [showHelpText]=\"true\" labelSuperior=\"Tipo de ticket\"\r\n              labelInput=\"Selecciona una opci\u00F3n\" [textInput]=\"typeSelected?.tipo\">\r\n              @for (type of tipos; track type) {\r\n              <ius-option (optionClick)=\"onSetValueType(type)\">\r\n                {{ type.tipo }}\r\n              </ius-option>\r\n              }\r\n            </ius-input-select>\r\n          </div>\r\n          <div class=\"select\">\r\n            <ius-input-select componentId=\"ticketReason\" [required]=\"true\" [showHelpText]=\"true\" labelSuperior=\"Raz\u00F3n del ticket\"\r\n              labelInput=\"Selecciona una opci\u00F3n\" [textInput]=\"reasonSelected?.razon\">\r\n              @for (reason of razones; track reason) {\r\n              <ius-option (optionClick)=\"onSetValueReason(reason)\">\r\n                {{ reason.razon }}\r\n              </ius-option>\r\n              }\r\n            </ius-input-select>\r\n          </div>\r\n          <div class=\"select\">\r\n            <ius-input-textfield componentId=\"tituloTicket\" [initialText]=\"tituloTicket\" [required]=\"true\" [showHelpText]=\"true\"\r\n              labelSuperior=\"Titulo o asunto para el ticket\" labelInput=\"Defina brevemente un asunto o titulo\"\r\n              (onChangesValueEvent)=\"onSetValueTituloTicket($event)\">\r\n            </ius-input-textfield>\r\n          </div>\r\n          <div class=\"select\">\r\n            <ius-input-large componentId=\"descripcionTicket\" [initialText]=\"descripcionTicket\" [required]=\"true\" [showHelpText]=\"true\"\r\n              labelSuperior=\"Descripcion del ticket\" labelInput=\"Describe tu idea o petici\u00F3n para el ticket\"\r\n              (onChangesValueEvent)=\"onSetValueDescripcionTicket($event)\">\r\n            </ius-input-large>\r\n          </div>\r\n        </div>\r\n      </ius-section-collapse-drawer-parent>\r\n    </div>\r\n\r\n    <div class=\"footer\">\r\n      <div class=\"toolbar\">\r\n        <div class=\"toolbar-btn\">\r\n          <ius-button-dynamic [labelDefault]=\"'Crear ticket'\" [labelSuccess]=\"'Agregando'\" [labelError]=\"'Error'\"\r\n            [loading]=\"loading\" [result]=\"lastResult\" (buttonClicked)=\"createTicket()\">\r\n          </ius-button-dynamic>\r\n        </div>\r\n        <div class=\"toolbar-btn\">\r\n          <ius-button-standard-secondary (buttonClicked)=\"onClose()\">Cancelar</ius-button-standard-secondary>\r\n        </div>\r\n      </div>\r\n    </div>\r\n  </div>\r\n</ius-drawer-container-right>\r\n", styles: [".h1{font-family:Roboto,sans-serif;font-size:2.375rem;font-weight:500;line-height:46px}.h2{font-family:Roboto,sans-serif;font-size:1.875rem;font-weight:700;line-height:38px}.h3{font-family:Roboto,sans-serif;font-size:1.5rem;font-weight:500;line-height:32px}.h4{font-family:Roboto,sans-serif;font-size:1.25rem;font-weight:700;line-height:26px}.h5{font-family:Roboto,sans-serif;font-size:1.125rem;font-weight:500;line-height:24px;letter-spacing:.18px}.label-large{font-family:Roboto,sans-serif;font-size:1rem;font-weight:500;line-height:22px}.body-large{font-family:Rubik,sans-serif;font-size:1rem;font-weight:400;line-height:22px}.label-base{font-family:Rubik,sans-serif;font-size:.875rem;font-weight:500;line-height:20px;letter-spacing:.28px}.body-base{font-family:Rubik,sans-serif;font-size:.875rem;font-weight:400;line-height:20px;font-style:italic;letter-spacing:.28px}.body-base-1,.body-base-1-1{font-family:Rubik,sans-serif;font-size:.875rem;font-weight:400;line-height:20px;letter-spacing:.28px}.body-sm{font-family:Rubik,sans-serif;font-size:.75rem;font-weight:400;line-height:16px;letter-spacing:.28px}.body-sm-italic{font-family:Rubik,sans-serif;font-size:.75rem;font-weight:400;line-height:16px;font-style:italic;letter-spacing:.28px}.caption-sm{font-family:Rubik,sans-serif;font-size:.75rem;font-weight:500;line-height:16px;letter-spacing:.28px}.caption-sm-italic{font-family:Rubik,sans-serif;font-size:.75rem;font-weight:500;line-height:16px;font-style:italic;letter-spacing:.28px}.form{display:flex;height:100%;flex-direction:column}.section{display:flex;padding:0 8px;flex-direction:column}.content{display:flex;flex-direction:column}.select{display:flex;padding:8px 16px;flex-direction:column;justify-content:center;gap:8px;align-self:stretch}.footer{display:flex;flex-direction:column;justify-content:flex-end;align-items:center;gap:10px;flex:1 0 0;align-self:stretch}.toolbar{display:flex;padding:12px 16px;flex-direction:column;justify-content:flex-end;align-items:center;gap:8px;align-self:stretch}.toolbar-btn{width:100%}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "component", type: ButtonDynamicComponent, selector: "ius-button-dynamic", inputs: ["labelDefault", "labelSuccess", "labelError", "disabled", "loading", "result", "autoReset", "autoResetDelay"], outputs: ["buttonClicked"] }, { kind: "component", type: ButtonStandardSecondaryComponent, selector: "ius-button-standard-secondary", inputs: ["disabled"], outputs: ["buttonClicked"] }, { kind: "component", type: DrawerContainerRightComponent, selector: "ius-drawer-container-right", inputs: ["titleDrawer", "percentProgressBar"], outputs: ["onPressedBackEvent", "onDrawerClosed"] }, { kind: "component", type: SectionCollapseDrawerParentComponent, selector: "ius-section-collapse-drawer-parent", inputs: ["isActive", "disabled", "textTitle", "iconName"], outputs: ["buttonClicked"] }, { kind: "component", type: InputSelectComponent, selector: "ius-input-select", inputs: ["componentId", "required", "disabled", "showHelpText", "error", "labelSuperior", "labelInferior", "errorText", "labelInput", "iconInput", "textInput", "maxlenght", "inputType"], outputs: ["onChangesValueEvent", "onEnterKey", "onBlurEvent"] }, { kind: "component", type: InputTextfieldComponent, selector: "ius-input-textfield", inputs: ["textInput", "required", "disabled", "isEnableClearText", "showHelpText", "error", "labelSuperior", "labelInferior", "errorText", "labelInput", "iconInput", "inputType", "maxlenght", "initialText"], outputs: ["onChangesValueEvent", "onEnterKey", "onBlurEvent"] }, { kind: "component", type: OptionComponent, selector: "ius-option", inputs: ["disabled", "checked", "leadingIcon"], outputs: ["optionClick"] }, { kind: "component", type: InputLargeComponent, selector: "ius-input-large", inputs: ["textInput", "required", "disabled", "showHelpText", "rows", "error", "labelSuperior", "labelInferior", "errorText", "labelInput", "maxlenght", "initialText"], outputs: ["onChangesValueEvent", "onEnterKey", "onBlurEvent"] }] }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: CreateTicketComponent, decorators: [{
             type: Component,
@@ -7889,7 +7893,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.12", ngImpo
                         InputTextfieldComponent,
                         OptionComponent,
                         InputLargeComponent,
-                    ], template: "<ius-drawer-container-right [titleDrawer]=\"'Crear Ticket'\" (onDrawerClosed)=\"onClose()\"\n  [percentProgressBar]=\"percentProgressBar\">\n  <div class=\"form between-xs\">\n    <div class=\"content\">\n      <ius-section-collapse-drawer-parent textTitle=\"Informaci\u00F3n general\" [disabled]=\"false\"\n        [isActive]=\"isExpandGeneralInformation\" (buttonClicked)=\"onExpandGeneralInformation()\">\n        <div class=\"section\">\n          <div class=\"select\">\n            <ius-input-select componentId=\"ticketType\" [required]=\"true\" [showHelpText]=\"true\" labelSuperior=\"Tipo de ticket\"\n              labelInput=\"Selecciona una opci\u00F3n\" [textInput]=\"typeSelected?.tipo\">\n              @for (type of tipos; track type) {\n              <ius-option (optionClick)=\"onSetValueType(type)\">\n                {{ type.tipo }}\n              </ius-option>\n              }\n            </ius-input-select>\n          </div>\n          <div class=\"select\">\n            <ius-input-select componentId=\"ticketReason\" [required]=\"true\" [showHelpText]=\"true\" labelSuperior=\"Raz\u00F3n del ticket\"\n              labelInput=\"Selecciona una opci\u00F3n\" [textInput]=\"reasonSelected?.razon\">\n              @for (reason of razones; track reason) {\n              <ius-option (optionClick)=\"onSetValueReason(reason)\">\n                {{ reason.razon }}\n              </ius-option>\n              }\n            </ius-input-select>\n          </div>\n          <div class=\"select\">\n            <ius-input-textfield componentId=\"tituloTicket\" [initialText]=\"tituloTicket\" [required]=\"true\" [showHelpText]=\"true\"\n              labelSuperior=\"Titulo o asunto para el ticket\" labelInput=\"Defina brevemente un asunto o titulo\"\n              (onChangesValueEvent)=\"onSetValueTituloTicket($event)\">\n            </ius-input-textfield>\n          </div>\n          <div class=\"select\">\n            <ius-input-large componentId=\"descripcionTicket\" [initialText]=\"descripcionTicket\" [required]=\"true\" [showHelpText]=\"true\"\n              labelSuperior=\"Descripcion del ticket\" labelInput=\"Describe tu idea o petici\u00F3n para el ticket\"\n              (onChangesValueEvent)=\"onSetValueDescripcionTicket($event)\">\n            </ius-input-large>\n          </div>\n        </div>\n      </ius-section-collapse-drawer-parent>\n    </div>\n\n    <div class=\"footer\">\n      <div class=\"toolbar\">\n        <div class=\"toolbar-btn\">\n          <ius-button-dynamic [labelDefault]=\"'Crear ticket'\" [labelSuccess]=\"'Agregando'\" [labelError]=\"'Error'\"\n            [loading]=\"loading\" [result]=\"lastResult\" (buttonClicked)=\"createTicket()\">\n          </ius-button-dynamic>\n        </div>\n        <div class=\"toolbar-btn\">\n          <ius-button-standard-secondary (buttonClicked)=\"onClose()\">Cancelar</ius-button-standard-secondary>\n        </div>\n      </div>\n    </div>\n  </div>\n</ius-drawer-container-right>\n", styles: [".h1{font-family:Roboto,sans-serif;font-size:2.375rem;font-weight:500;line-height:46px}.h2{font-family:Roboto,sans-serif;font-size:1.875rem;font-weight:700;line-height:38px}.h3{font-family:Roboto,sans-serif;font-size:1.5rem;font-weight:500;line-height:32px}.h4{font-family:Roboto,sans-serif;font-size:1.25rem;font-weight:700;line-height:26px}.h5{font-family:Roboto,sans-serif;font-size:1.125rem;font-weight:500;line-height:24px;letter-spacing:.18px}.label-large{font-family:Roboto,sans-serif;font-size:1rem;font-weight:500;line-height:22px}.body-large{font-family:Rubik,sans-serif;font-size:1rem;font-weight:400;line-height:22px}.label-base{font-family:Rubik,sans-serif;font-size:.875rem;font-weight:500;line-height:20px;letter-spacing:.28px}.body-base{font-family:Rubik,sans-serif;font-size:.875rem;font-weight:400;line-height:20px;font-style:italic;letter-spacing:.28px}.body-base-1,.body-base-1-1{font-family:Rubik,sans-serif;font-size:.875rem;font-weight:400;line-height:20px;letter-spacing:.28px}.body-sm{font-family:Rubik,sans-serif;font-size:.75rem;font-weight:400;line-height:16px;letter-spacing:.28px}.body-sm-italic{font-family:Rubik,sans-serif;font-size:.75rem;font-weight:400;line-height:16px;font-style:italic;letter-spacing:.28px}.caption-sm{font-family:Rubik,sans-serif;font-size:.75rem;font-weight:500;line-height:16px;letter-spacing:.28px}.caption-sm-italic{font-family:Rubik,sans-serif;font-size:.75rem;font-weight:500;line-height:16px;font-style:italic;letter-spacing:.28px}.form{display:flex;height:100%;flex-direction:column}.section{display:flex;padding:0 8px;flex-direction:column}.content{display:flex;flex-direction:column}.select{display:flex;padding:8px 16px;flex-direction:column;justify-content:center;gap:8px;align-self:stretch}.footer{display:flex;flex-direction:column;justify-content:flex-end;align-items:center;gap:10px;flex:1 0 0;align-self:stretch}.toolbar{display:flex;padding:12px 16px;flex-direction:column;justify-content:flex-end;align-items:center;gap:8px;align-self:stretch}.toolbar-btn{width:100%}\n"] }]
+                    ], template: "<ius-drawer-container-right [titleDrawer]=\"'Crear Ticket'\" (onDrawerClosed)=\"onClose()\"\r\n  [percentProgressBar]=\"percentProgressBar\">\r\n  <div class=\"form between-xs\">\r\n    <div class=\"content\">\r\n      <ius-section-collapse-drawer-parent textTitle=\"Informaci\u00F3n general\" [disabled]=\"false\"\r\n        [isActive]=\"isExpandGeneralInformation\" (buttonClicked)=\"onExpandGeneralInformation()\">\r\n        <div class=\"section\">\r\n          <div class=\"select\">\r\n            <ius-input-select componentId=\"ticketType\" [required]=\"true\" [showHelpText]=\"true\" labelSuperior=\"Tipo de ticket\"\r\n              labelInput=\"Selecciona una opci\u00F3n\" [textInput]=\"typeSelected?.tipo\">\r\n              @for (type of tipos; track type) {\r\n              <ius-option (optionClick)=\"onSetValueType(type)\">\r\n                {{ type.tipo }}\r\n              </ius-option>\r\n              }\r\n            </ius-input-select>\r\n          </div>\r\n          <div class=\"select\">\r\n            <ius-input-select componentId=\"ticketReason\" [required]=\"true\" [showHelpText]=\"true\" labelSuperior=\"Raz\u00F3n del ticket\"\r\n              labelInput=\"Selecciona una opci\u00F3n\" [textInput]=\"reasonSelected?.razon\">\r\n              @for (reason of razones; track reason) {\r\n              <ius-option (optionClick)=\"onSetValueReason(reason)\">\r\n                {{ reason.razon }}\r\n              </ius-option>\r\n              }\r\n            </ius-input-select>\r\n          </div>\r\n          <div class=\"select\">\r\n            <ius-input-textfield componentId=\"tituloTicket\" [initialText]=\"tituloTicket\" [required]=\"true\" [showHelpText]=\"true\"\r\n              labelSuperior=\"Titulo o asunto para el ticket\" labelInput=\"Defina brevemente un asunto o titulo\"\r\n              (onChangesValueEvent)=\"onSetValueTituloTicket($event)\">\r\n            </ius-input-textfield>\r\n          </div>\r\n          <div class=\"select\">\r\n            <ius-input-large componentId=\"descripcionTicket\" [initialText]=\"descripcionTicket\" [required]=\"true\" [showHelpText]=\"true\"\r\n              labelSuperior=\"Descripcion del ticket\" labelInput=\"Describe tu idea o petici\u00F3n para el ticket\"\r\n              (onChangesValueEvent)=\"onSetValueDescripcionTicket($event)\">\r\n            </ius-input-large>\r\n          </div>\r\n        </div>\r\n      </ius-section-collapse-drawer-parent>\r\n    </div>\r\n\r\n    <div class=\"footer\">\r\n      <div class=\"toolbar\">\r\n        <div class=\"toolbar-btn\">\r\n          <ius-button-dynamic [labelDefault]=\"'Crear ticket'\" [labelSuccess]=\"'Agregando'\" [labelError]=\"'Error'\"\r\n            [loading]=\"loading\" [result]=\"lastResult\" (buttonClicked)=\"createTicket()\">\r\n          </ius-button-dynamic>\r\n        </div>\r\n        <div class=\"toolbar-btn\">\r\n          <ius-button-standard-secondary (buttonClicked)=\"onClose()\">Cancelar</ius-button-standard-secondary>\r\n        </div>\r\n      </div>\r\n    </div>\r\n  </div>\r\n</ius-drawer-container-right>\r\n", styles: [".h1{font-family:Roboto,sans-serif;font-size:2.375rem;font-weight:500;line-height:46px}.h2{font-family:Roboto,sans-serif;font-size:1.875rem;font-weight:700;line-height:38px}.h3{font-family:Roboto,sans-serif;font-size:1.5rem;font-weight:500;line-height:32px}.h4{font-family:Roboto,sans-serif;font-size:1.25rem;font-weight:700;line-height:26px}.h5{font-family:Roboto,sans-serif;font-size:1.125rem;font-weight:500;line-height:24px;letter-spacing:.18px}.label-large{font-family:Roboto,sans-serif;font-size:1rem;font-weight:500;line-height:22px}.body-large{font-family:Rubik,sans-serif;font-size:1rem;font-weight:400;line-height:22px}.label-base{font-family:Rubik,sans-serif;font-size:.875rem;font-weight:500;line-height:20px;letter-spacing:.28px}.body-base{font-family:Rubik,sans-serif;font-size:.875rem;font-weight:400;line-height:20px;font-style:italic;letter-spacing:.28px}.body-base-1,.body-base-1-1{font-family:Rubik,sans-serif;font-size:.875rem;font-weight:400;line-height:20px;letter-spacing:.28px}.body-sm{font-family:Rubik,sans-serif;font-size:.75rem;font-weight:400;line-height:16px;letter-spacing:.28px}.body-sm-italic{font-family:Rubik,sans-serif;font-size:.75rem;font-weight:400;line-height:16px;font-style:italic;letter-spacing:.28px}.caption-sm{font-family:Rubik,sans-serif;font-size:.75rem;font-weight:500;line-height:16px;letter-spacing:.28px}.caption-sm-italic{font-family:Rubik,sans-serif;font-size:.75rem;font-weight:500;line-height:16px;font-style:italic;letter-spacing:.28px}.form{display:flex;height:100%;flex-direction:column}.section{display:flex;padding:0 8px;flex-direction:column}.content{display:flex;flex-direction:column}.select{display:flex;padding:8px 16px;flex-direction:column;justify-content:center;gap:8px;align-self:stretch}.footer{display:flex;flex-direction:column;justify-content:flex-end;align-items:center;gap:10px;flex:1 0 0;align-self:stretch}.toolbar{display:flex;padding:12px 16px;flex-direction:column;justify-content:flex-end;align-items:center;gap:8px;align-self:stretch}.toolbar-btn{width:100%}\n"] }]
         }], propDecorators: { tipos: [{
                 type: Input
             }], razones: [{