metag-sdk-ionic 1.2.11 → 1.3.0-security

package/dist/src/app/pages/slides/dpi-front/slide1.component.js

@@ -18,7 +18,7 @@ export class DpiFrontComponent {
             i0.ɵɵlistener("click", function DpiFrontComponent_Template_ion_button_click_10_listener() { return ctx.openCamera(); });
             i0.ɵɵtext(11, "Tomar una foto");
             i0.ɵɵelementEnd()()();
-        } }, dependencies: [IonicModule, i1.IonButton], styles: [".content[_ngcontent-%COMP%] {\r\n    padding: 10px;\r\n    align-items: center;\r\n    justify-content: center;\r\n    height: 100vh;\r\n    background-color: #fff;\r\n    font-size: 18px;\r\n    background-image: url('assets/imagesIdvision/background.png');\r\n\r\n    background-size: cover;\r\n    background-repeat: no-repeat;\r\n    background-position: center;\r\n    \r\n}\r\n\r\n\r\nh2[_ngcontent-%COMP%] {\r\n    font-size: 1.5em;\r\n    font-weight: bold;\r\n    color: var(--orange-primary, orange);\r\n    text-align: center;\r\n    margin-top: 20px;\r\n  }\r\n  \r\n  p[_ngcontent-%COMP%] {\r\n    font-size: 1em;\r\n    color: #666;\r\n    text-align: center;\r\n    margin: 0;\r\n  }\r\n  \r\n  ion-grid[_ngcontent-%COMP%] {\r\n    margin-top: 20px;\r\n  }\r\n  \r\n  ion-row[_ngcontent-%COMP%] {\r\n    margin: 15px 0;\r\n    display: flex;\r\n    justify-content: center;\r\n    align-items: center;\r\n  }\r\n  \r\n  ion-col[_ngcontent-%COMP%] {\r\n    display: flex;\r\n    flex-direction: column;\r\n    align-items: center;\r\n    text-align: center;\r\n  }\r\n  \r\n  ion-icon[_ngcontent-%COMP%] {\r\n    font-size: 3em; // Tama\u00F1o del \u00EDcono para que sea m\u00E1s destacado\r\n    color: #ff8c00; // Color similar al amarillo-naranja\r\n    margin-bottom: 10px;\r\n  }\r\n\r\n.container-text[_ngcontent-%COMP%] {\r\n  text-align: justify !important;\r\n    width: 180px;\r\n}\r\n\r\np[_ngcontent-%COMP%] {\r\n  text-align: start;\r\n}\r\n\r\n.p-center[_ngcontent-%COMP%]{\r\ntext-align: center;\r\n}\r\n\r\n.p-justify[_ngcontent-%COMP%]{\r\n  text-align: start;\r\n  }\r\n\r\n.head[_ngcontent-%COMP%] {\r\n    padding: 30px;\r\n    margin-top: 75px;\r\n    margin-bottom: 20px;\r\n}\r\n\r\n\r\n.verify-container[_ngcontent-%COMP%] {\r\n   // padding: 60px;\r\n    display: flex;\r\n    flex-direction: column;\r\n    align-items: center;\r\n    justify-content: center;\r\n    height: 40%; // Ocupa todo el espacio disponible en el ion-content\r\n    text-align: center;\r\n    //background-color: black;\r\n}\r\n\r\n.fixed-footer[_ngcontent-%COMP%] {\r\n    position: fixed;\r\n    bottom: 0;\r\n    left: 0;\r\n    width: 100%;\r\n    padding: 0px 10px 25px 10px;\r\n    // background-color: black; // Color de fondo, opcional\r\n   // box-shadow: 0 -2px 10px rgba(0, 0, 0, 0.1); // Sombra suave para que resalte\r\n  \r\n    ion-button {\r\n      width: 90%;\r\n      max-width: 300px;\r\n      margin: 0 auto;\r\n      background-color: #ffcc00;\r\n      color: #ffffff;\r\n      font-weight: bold;\r\n      border-radius: 20px;\r\n  \r\n      &:hover {\r\n        background-color: #ffb300;\r\n      }\r\n  \r\n      &:active {\r\n        background-color: #e6a800;\r\n      }\r\n    }\r\n  }\r\n\r\n  .dpi-container[_ngcontent-%COMP%] {\r\n    display: flex;\r\n    //width: 100%;\r\n    justify-content: center;\r\n    align-items: center;\r\n    height: 50vh;\r\n  }\r\n.dpi-image[_ngcontent-%COMP%] {\r\n    width: 200px;\r\n}\r\n\r\n.image-container[_ngcontent-%COMP%] {\r\n    width: 100px;\r\n    max-width: 90px;\r\n}\r\n\r\n.col-confirmation[_ngcontent-%COMP%] {\r\n  margin-top: 100px;\r\n  padding: 20px;\r\n  display: flex;\r\n  flex-direction: column;\r\n  gap: 20px; \n\r\n}\r\n\r\n.image-item[_ngcontent-%COMP%] {\r\n  margin-top: 50px;\r\n  padding-top: 70px;\r\n}\r\n\r\n.font-confirmation[_ngcontent-%COMP%] {\r\n  font-size: 26px;\r\n  text-align: center;\r\n  // color: #005da9;\r\n  color: var(--purple-primary);\r\n  font-weight: bold;\r\n}\r\n\r\n\r\n.rounded-input[_ngcontent-%COMP%] {\r\n  margin-top: 15px;\r\n  background-color: #f4f6fc; \n\r\n  border-radius: 10px; \n\r\n  padding: 5px 5px; \n\r\n  box-shadow: 0px 4px 6px rgba(0, 0, 0, 0.1); \n\r\n  --ion-border-color: transparent; \n\r\n}\r\n\r\nion-input[_ngcontent-%COMP%] {\r\n  text-align: center;\r\n  color: var(--orange-primary);\r\n  --padding-start: 8px;\r\n}\r\n\r\n.custom-footer[_ngcontent-%COMP%] {\r\n  position: fixed;\r\n  bottom: 0;\r\n  left: 0;\r\n  width: 100%;\r\n  padding: 10px;\r\n  display: flex;\r\n  justify-content: space-between; \n\r\n  background-color: #ffffff; \n\r\n  //box-shadow: 0 -2px 10px rgba(0, 0, 0, 0.1); \n\r\n}\r\n\r\n.custom-footer[_ngcontent-%COMP%]   ion-button[_ngcontent-%COMP%] {\r\n  flex: 0 0 48%; \n\r\n}\r\n\r\n.custom-footer[_ngcontent-%COMP%]   .left-button[_ngcontent-%COMP%] {\r\n  max-width: 140px;\r\n  color: black;\r\n\r\n  --background: white;\r\n\r\n  --color: var(--purple-primary);\r\n\r\n  --border-radius: 20px;\r\n  --border-color: white;\r\n  margin-right: auto; \n\r\n  --box-shadow: 0 2px 6px 0 rgb(0, 0, 0, 0.0);\r\n\r\n}\r\n\r\n.custom-footer[_ngcontent-%COMP%]   .right-button[_ngcontent-%COMP%] {\r\n  margin-left: auto; \n\r\n}\r\n\r\n.tutorial-head[_ngcontent-%COMP%] {\r\n  padding-top:50px;\r\n  display: flex;\r\n  justify-content: center;\r\n  align-items: center;\r\n  color: black;\r\n}\r\n\r\n.center-container[_ngcontent-%COMP%] {\r\n  display: flex;\r\n  justify-content: center;\r\n  align-items: center;\r\n  height: 60vh; \n\r\n  width: 100%;\r\n}\r\n\r\n.tutorial-title[_ngcontent-%COMP%] {\r\n  text-align: center;\r\n}\r\n\r\n.rounded-input[_ngcontent-%COMP%]   ion-input[_ngcontent-%COMP%] {\r\n  font-size: 14px; \n\r\n  color: #333; \n\r\n}\r\n\r\n.rounded-input[_ngcontent-%COMP%]::part(native) {\r\n  background: transparent; \n\r\n}\r\n\r\n.p-info[_ngcontent-%COMP%]{\r\n  font-weight: bold;\r\n  color: #714e93\r\n}\r\n\r\n.custom-button[_ngcontent-%COMP%] {\r\n    --background: var(--purple-primary, #82298F) !important;\r\n    --background-hover: var(--purple-secondary, #2b0d30) !important;\r\n    --background-activated: var(--purple-secondary, #2b0d30) !important;\r\n    --color: #ffffff !important;\r\n    --border-radius: 20px !important;\r\n    --padding-top: 10px !important;\r\n    --padding-bottom: 10px !important;\r\n    --box-shadow: 0 2px 6px 0 rgba(0, 0, 0, 0.25) !important;\r\n    text-transform: none;\r\n\r\n      pointer-events: auto;\r\n\r\n  }"] }); }
+        } }, dependencies: [IonicModule, i1.IonButton], styles: [".content[_ngcontent-%COMP%] {\n    padding: 10px;\n    align-items: center;\n    justify-content: center;\n    height: 100vh;\n    background-color: #fff;\n    font-size: 18px;\n    background-image: url('assets/imagesIdvision/background.png');\n\n    background-size: cover;\n    background-repeat: no-repeat;\n    background-position: center;\n    \n}\n\n\nh2[_ngcontent-%COMP%] {\n    font-size: 1.5em;\n    font-weight: bold;\n    color: var(--orange-primary, orange);\n    text-align: center;\n    margin-top: 20px;\n  }\n  \n  p[_ngcontent-%COMP%] {\n    font-size: 1em;\n    color: #666;\n    text-align: center;\n    margin: 0;\n  }\n  \n  ion-grid[_ngcontent-%COMP%] {\n    margin-top: 20px;\n  }\n  \n  ion-row[_ngcontent-%COMP%] {\n    margin: 15px 0;\n    display: flex;\n    justify-content: center;\n    align-items: center;\n  }\n  \n  ion-col[_ngcontent-%COMP%] {\n    display: flex;\n    flex-direction: column;\n    align-items: center;\n    text-align: center;\n  }\n  \n  ion-icon[_ngcontent-%COMP%] {\n    font-size: 3em; // Tama\u00F1o del \u00EDcono para que sea m\u00E1s destacado\n    color: #ff8c00; // Color similar al amarillo-naranja\n    margin-bottom: 10px;\n  }\n\n.container-text[_ngcontent-%COMP%] {\n  text-align: justify !important;\n    width: 180px;\n}\n\np[_ngcontent-%COMP%] {\n  text-align: start;\n}\n\n.p-center[_ngcontent-%COMP%]{\ntext-align: center;\n}\n\n.p-justify[_ngcontent-%COMP%]{\n  text-align: start;\n  }\n\n.head[_ngcontent-%COMP%] {\n    padding: 30px;\n    margin-top: 75px;\n    margin-bottom: 20px;\n}\n\n\n.verify-container[_ngcontent-%COMP%] {\n   // padding: 60px;\n    display: flex;\n    flex-direction: column;\n    align-items: center;\n    justify-content: center;\n    height: 40%; // Ocupa todo el espacio disponible en el ion-content\n    text-align: center;\n    //background-color: black;\n}\n\n.fixed-footer[_ngcontent-%COMP%] {\n    position: fixed;\n    bottom: 0;\n    left: 0;\n    width: 100%;\n    padding: 0px 10px 25px 10px;\n    // background-color: black; // Color de fondo, opcional\n   // box-shadow: 0 -2px 10px rgba(0, 0, 0, 0.1); // Sombra suave para que resalte\n  \n    ion-button {\n      width: 90%;\n      max-width: 300px;\n      margin: 0 auto;\n      background-color: #ffcc00;\n      color: #ffffff;\n      font-weight: bold;\n      border-radius: 20px;\n  \n      &:hover {\n        background-color: #ffb300;\n      }\n  \n      &:active {\n        background-color: #e6a800;\n      }\n    }\n  }\n\n  .dpi-container[_ngcontent-%COMP%] {\n    display: flex;\n    //width: 100%;\n    justify-content: center;\n    align-items: center;\n    height: 50vh;\n  }\n.dpi-image[_ngcontent-%COMP%] {\n    width: 200px;\n}\n\n.image-container[_ngcontent-%COMP%] {\n    width: 100px;\n    max-width: 90px;\n}\n\n.col-confirmation[_ngcontent-%COMP%] {\n  margin-top: 100px;\n  padding: 20px;\n  display: flex;\n  flex-direction: column;\n  gap: 20px; \n\n}\n\n.image-item[_ngcontent-%COMP%] {\n  margin-top: 50px;\n  padding-top: 70px;\n}\n\n.font-confirmation[_ngcontent-%COMP%] {\n  font-size: 26px;\n  text-align: center;\n  // color: #005da9;\n  color: var(--purple-primary);\n  font-weight: bold;\n}\n\n\n.rounded-input[_ngcontent-%COMP%] {\n  margin-top: 15px;\n  background-color: #f4f6fc; \n\n  border-radius: 10px; \n\n  padding: 5px 5px; \n\n  box-shadow: 0px 4px 6px rgba(0, 0, 0, 0.1); \n\n  --ion-border-color: transparent; \n\n}\n\nion-input[_ngcontent-%COMP%] {\n  text-align: center;\n  color: var(--orange-primary);\n  --padding-start: 8px;\n}\n\n.custom-footer[_ngcontent-%COMP%] {\n  position: fixed;\n  bottom: 0;\n  left: 0;\n  width: 100%;\n  padding: 10px;\n  display: flex;\n  justify-content: space-between; \n\n  background-color: #ffffff; \n\n  //box-shadow: 0 -2px 10px rgba(0, 0, 0, 0.1); \n\n}\n\n.custom-footer[_ngcontent-%COMP%]   ion-button[_ngcontent-%COMP%] {\n  flex: 0 0 48%; \n\n}\n\n.custom-footer[_ngcontent-%COMP%]   .left-button[_ngcontent-%COMP%] {\n  max-width: 140px;\n  color: black;\n\n  --background: white;\n\n  --color: var(--purple-primary);\n\n  --border-radius: 20px;\n  --border-color: white;\n  margin-right: auto; \n\n  --box-shadow: 0 2px 6px 0 rgb(0, 0, 0, 0.0);\n\n}\n\n.custom-footer[_ngcontent-%COMP%]   .right-button[_ngcontent-%COMP%] {\n  margin-left: auto; \n\n}\n\n.tutorial-head[_ngcontent-%COMP%] {\n  padding-top:50px;\n  display: flex;\n  justify-content: center;\n  align-items: center;\n  color: black;\n}\n\n.center-container[_ngcontent-%COMP%] {\n  display: flex;\n  justify-content: center;\n  align-items: center;\n  height: 60vh; \n\n  width: 100%;\n}\n\n.tutorial-title[_ngcontent-%COMP%] {\n  text-align: center;\n}\n\n.rounded-input[_ngcontent-%COMP%]   ion-input[_ngcontent-%COMP%] {\n  font-size: 14px; \n\n  color: #333; \n\n}\n\n.rounded-input[_ngcontent-%COMP%]::part(native) {\n  background: transparent; \n\n}\n\n.p-info[_ngcontent-%COMP%]{\n  font-weight: bold;\n  color: #714e93\n}\n\n.custom-button[_ngcontent-%COMP%] {\n    --background: var(--purple-primary, #82298F) !important;\n    --background-hover: var(--purple-secondary, #2b0d30) !important;\n    --background-activated: var(--purple-secondary, #2b0d30) !important;\n    --color: #ffffff !important;\n    --border-radius: 20px !important;\n    --padding-top: 10px !important;\n    --padding-bottom: 10px !important;\n    --box-shadow: 0 2px 6px 0 rgba(0, 0, 0, 0.25) !important;\n    text-transform: none;\n\n      pointer-events: auto;\n\n  }"] }); }
 }
 (() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(DpiFrontComponent, [{
         type: Component,
@@ -37,9 +37,9 @@ export class DpiFrontComponent {
         <ion-button class="custom-button" expand="block" (click)="openCamera()">Tomar una foto</ion-button>
       </div>
     </div>
-  `, styles: ["\r\n.content {\r\n    padding: 10px;\r\n    align-items: center;\r\n    justify-content: center;\r\n    height: 100vh;\r\n    background-color: #fff;\r\n    font-size: 18px;\r\n    background-image: url('assets/imagesIdvision/background.png');\r\n\r\n    background-size: cover;\r\n    background-repeat: no-repeat;\r\n    background-position: center;\r\n    \r\n}\r\n\r\n\r\nh2 {\r\n    font-size: 1.5em;\r\n    font-weight: bold;\r\n    color: var(--orange-primary, orange);\r\n    text-align: center;\r\n    margin-top: 20px;\r\n  }\r\n  \r\n  p {\r\n    font-size: 1em;\r\n    color: #666;\r\n    text-align: center;\r\n    margin: 0;\r\n  }\r\n  \r\n  ion-grid {\r\n    margin-top: 20px;\r\n  }\r\n  \r\n  ion-row {\r\n    margin: 15px 0;\r\n    display: flex;\r\n    justify-content: center;\r\n    align-items: center;\r\n  }\r\n  \r\n  ion-col {\r\n    display: flex;\r\n    flex-direction: column;\r\n    align-items: center;\r\n    text-align: center;\r\n  }\r\n  \r\n  ion-icon {\r\n    font-size: 3em; // Tama\u00F1o del \u00EDcono para que sea m\u00E1s destacado\r\n    color: #ff8c00; // Color similar al amarillo-naranja\r\n    margin-bottom: 10px;\r\n  }\r\n\r\n.container-text {\r\n  text-align: justify !important;\r\n    width: 180px;\r\n}\r\n\r\np {\r\n  text-align: start;\r\n}\r\n\r\n.p-center{\r\ntext-align: center;\r\n}\r\n\r\n.p-justify{\r\n  text-align: start;\r\n  }\r\n\r\n.head {\r\n    padding: 30px;\r\n    margin-top: 75px;\r\n    margin-bottom: 20px;\r\n}\r\n\r\n\r\n.verify-container {\r\n   // padding: 60px;\r\n    display: flex;\r\n    flex-direction: column;\r\n    align-items: center;\r\n    justify-content: center;\r\n    height: 40%; // Ocupa todo el espacio disponible en el ion-content\r\n    text-align: center;\r\n    //background-color: black;\r\n}\r\n\r\n.fixed-footer {\r\n    position: fixed;\r\n    bottom: 0;\r\n    left: 0;\r\n    width: 100%;\r\n    padding: 0px 10px 25px 10px;\r\n    // background-color: black; // Color de fondo, opcional\r\n   // box-shadow: 0 -2px 10px rgba(0, 0, 0, 0.1); // Sombra suave para que resalte\r\n  \r\n    ion-button {\r\n      width: 90%;\r\n      max-width: 300px;\r\n      margin: 0 auto;\r\n      background-color: #ffcc00;\r\n      color: #ffffff;\r\n      font-weight: bold;\r\n      border-radius: 20px;\r\n  \r\n      &:hover {\r\n        background-color: #ffb300;\r\n      }\r\n  \r\n      &:active {\r\n        background-color: #e6a800;\r\n      }\r\n    }\r\n  }\r\n\r\n  .dpi-container {\r\n    display: flex;\r\n    //width: 100%;\r\n    justify-content: center;\r\n    align-items: center;\r\n    height: 50vh;\r\n  }\r\n.dpi-image {\r\n    width: 200px;\r\n}\r\n\r\n.image-container {\r\n    width: 100px;\r\n    max-width: 90px;\r\n}\r\n\r\n.col-confirmation {\r\n  margin-top: 100px;\r\n  padding: 20px;\r\n  display: flex;\r\n  flex-direction: column;\r\n  gap: 20px; /* Ajusta el espacio entre los elementos */\r\n}\r\n\r\n.image-item {\r\n  margin-top: 50px;\r\n  padding-top: 70px;\r\n}\r\n\r\n.font-confirmation {\r\n  font-size: 26px;\r\n  text-align: center;\r\n  // color: #005da9;\r\n  color: var(--purple-primary);\r\n  font-weight: bold;\r\n}\r\n\r\n\r\n.rounded-input {\r\n  margin-top: 15px;\r\n  background-color: #f4f6fc; /* Color de fondo suave */\r\n  border-radius: 10px; /* Bordes redondeados */\r\n  padding: 5px 5px; /* Espaciado interno */\r\n  box-shadow: 0px 4px 6px rgba(0, 0, 0, 0.1); /* Sombra suave */\r\n  --ion-border-color: transparent; /* Quita cualquier borde por defecto */\r\n}\r\n\r\nion-input {\r\n  text-align: center;\r\n  color: var(--orange-primary);\r\n  --padding-start: 8px;\r\n}\r\n\r\n.custom-footer {\r\n  position: fixed;\r\n  bottom: 0;\r\n  left: 0;\r\n  width: 100%;\r\n  padding: 10px;\r\n  display: flex;\r\n  justify-content: space-between; /* Alinea los botones a los extremos */\r\n  background-color: #ffffff; /* Fondo opcional */\r\n  //box-shadow: 0 -2px 10px rgba(0, 0, 0, 0.1); /* Sombra opcional */\r\n}\r\n\r\n.custom-footer ion-button {\r\n  flex: 0 0 48%; /* Los botones ocupan casi la mitad del espacio */\r\n}\r\n\r\n.custom-footer .left-button {\r\n  max-width: 140px;\r\n  color: black;\r\n\r\n  --background: white;\r\n\r\n  --color: var(--purple-primary);\r\n\r\n  --border-radius: 20px;\r\n  --border-color: white;\r\n  margin-right: auto; /* Opcional si necesitas ajustes de margen */\r\n  --box-shadow: 0 2px 6px 0 rgb(0, 0, 0, 0.0);\r\n\r\n}\r\n\r\n.custom-footer .right-button {\r\n  margin-left: auto; /* Opcional si necesitas ajustes de margen */\r\n}\r\n\r\n.tutorial-head {\r\n  padding-top:50px;\r\n  display: flex;\r\n  justify-content: center;\r\n  align-items: center;\r\n  color: black;\r\n}\r\n\r\n.center-container {\r\n  display: flex;\r\n  justify-content: center;\r\n  align-items: center;\r\n  height: 60vh; /* Ajusta este valor si quieres m\u00E1s o menos espacio vertical */\r\n  width: 100%;\r\n}\r\n\r\n.tutorial-title {\r\n  text-align: center;\r\n}\r\n\r\n.rounded-input ion-input {\r\n  font-size: 14px; /* Tama\u00F1o de texto */\r\n  color: #333; /* Color del texto */\r\n}\r\n\r\n.rounded-input::part(native) {\r\n  background: transparent; /* Fondo transparente para evitar conflictos */\r\n}\r\n\r\n.p-info{\r\n  font-weight: bold;\r\n  color: #714e93\r\n}\r\n\r\n.custom-button {\r\n    --background: var(--purple-primary, #82298F) !important;\r\n    --background-hover: var(--purple-secondary, #2b0d30) !important;\r\n    --background-activated: var(--purple-secondary, #2b0d30) !important;\r\n    --color: #ffffff !important;\r\n    --border-radius: 20px !important;\r\n    --padding-top: 10px !important;\r\n    --padding-bottom: 10px !important;\r\n    --box-shadow: 0 2px 6px 0 rgba(0, 0, 0, 0.25) !important;\r\n    text-transform: none;\r\n\r\n      pointer-events: auto;\r\n\r\n  }\r\n  "] }]
+  `, styles: ["\n.content {\n    padding: 10px;\n    align-items: center;\n    justify-content: center;\n    height: 100vh;\n    background-color: #fff;\n    font-size: 18px;\n    background-image: url('assets/imagesIdvision/background.png');\n\n    background-size: cover;\n    background-repeat: no-repeat;\n    background-position: center;\n    \n}\n\n\nh2 {\n    font-size: 1.5em;\n    font-weight: bold;\n    color: var(--orange-primary, orange);\n    text-align: center;\n    margin-top: 20px;\n  }\n  \n  p {\n    font-size: 1em;\n    color: #666;\n    text-align: center;\n    margin: 0;\n  }\n  \n  ion-grid {\n    margin-top: 20px;\n  }\n  \n  ion-row {\n    margin: 15px 0;\n    display: flex;\n    justify-content: center;\n    align-items: center;\n  }\n  \n  ion-col {\n    display: flex;\n    flex-direction: column;\n    align-items: center;\n    text-align: center;\n  }\n  \n  ion-icon {\n    font-size: 3em; // Tama\u00F1o del \u00EDcono para que sea m\u00E1s destacado\n    color: #ff8c00; // Color similar al amarillo-naranja\n    margin-bottom: 10px;\n  }\n\n.container-text {\n  text-align: justify !important;\n    width: 180px;\n}\n\np {\n  text-align: start;\n}\n\n.p-center{\ntext-align: center;\n}\n\n.p-justify{\n  text-align: start;\n  }\n\n.head {\n    padding: 30px;\n    margin-top: 75px;\n    margin-bottom: 20px;\n}\n\n\n.verify-container {\n   // padding: 60px;\n    display: flex;\n    flex-direction: column;\n    align-items: center;\n    justify-content: center;\n    height: 40%; // Ocupa todo el espacio disponible en el ion-content\n    text-align: center;\n    //background-color: black;\n}\n\n.fixed-footer {\n    position: fixed;\n    bottom: 0;\n    left: 0;\n    width: 100%;\n    padding: 0px 10px 25px 10px;\n    // background-color: black; // Color de fondo, opcional\n   // box-shadow: 0 -2px 10px rgba(0, 0, 0, 0.1); // Sombra suave para que resalte\n  \n    ion-button {\n      width: 90%;\n      max-width: 300px;\n      margin: 0 auto;\n      background-color: #ffcc00;\n      color: #ffffff;\n      font-weight: bold;\n      border-radius: 20px;\n  \n      &:hover {\n        background-color: #ffb300;\n      }\n  \n      &:active {\n        background-color: #e6a800;\n      }\n    }\n  }\n\n  .dpi-container {\n    display: flex;\n    //width: 100%;\n    justify-content: center;\n    align-items: center;\n    height: 50vh;\n  }\n.dpi-image {\n    width: 200px;\n}\n\n.image-container {\n    width: 100px;\n    max-width: 90px;\n}\n\n.col-confirmation {\n  margin-top: 100px;\n  padding: 20px;\n  display: flex;\n  flex-direction: column;\n  gap: 20px; /* Ajusta el espacio entre los elementos */\n}\n\n.image-item {\n  margin-top: 50px;\n  padding-top: 70px;\n}\n\n.font-confirmation {\n  font-size: 26px;\n  text-align: center;\n  // color: #005da9;\n  color: var(--purple-primary);\n  font-weight: bold;\n}\n\n\n.rounded-input {\n  margin-top: 15px;\n  background-color: #f4f6fc; /* Color de fondo suave */\n  border-radius: 10px; /* Bordes redondeados */\n  padding: 5px 5px; /* Espaciado interno */\n  box-shadow: 0px 4px 6px rgba(0, 0, 0, 0.1); /* Sombra suave */\n  --ion-border-color: transparent; /* Quita cualquier borde por defecto */\n}\n\nion-input {\n  text-align: center;\n  color: var(--orange-primary);\n  --padding-start: 8px;\n}\n\n.custom-footer {\n  position: fixed;\n  bottom: 0;\n  left: 0;\n  width: 100%;\n  padding: 10px;\n  display: flex;\n  justify-content: space-between; /* Alinea los botones a los extremos */\n  background-color: #ffffff; /* Fondo opcional */\n  //box-shadow: 0 -2px 10px rgba(0, 0, 0, 0.1); /* Sombra opcional */\n}\n\n.custom-footer ion-button {\n  flex: 0 0 48%; /* Los botones ocupan casi la mitad del espacio */\n}\n\n.custom-footer .left-button {\n  max-width: 140px;\n  color: black;\n\n  --background: white;\n\n  --color: var(--purple-primary);\n\n  --border-radius: 20px;\n  --border-color: white;\n  margin-right: auto; /* Opcional si necesitas ajustes de margen */\n  --box-shadow: 0 2px 6px 0 rgb(0, 0, 0, 0.0);\n\n}\n\n.custom-footer .right-button {\n  margin-left: auto; /* Opcional si necesitas ajustes de margen */\n}\n\n.tutorial-head {\n  padding-top:50px;\n  display: flex;\n  justify-content: center;\n  align-items: center;\n  color: black;\n}\n\n.center-container {\n  display: flex;\n  justify-content: center;\n  align-items: center;\n  height: 60vh; /* Ajusta este valor si quieres m\u00E1s o menos espacio vertical */\n  width: 100%;\n}\n\n.tutorial-title {\n  text-align: center;\n}\n\n.rounded-input ion-input {\n  font-size: 14px; /* Tama\u00F1o de texto */\n  color: #333; /* Color del texto */\n}\n\n.rounded-input::part(native) {\n  background: transparent; /* Fondo transparente para evitar conflictos */\n}\n\n.p-info{\n  font-weight: bold;\n  color: #714e93\n}\n\n.custom-button {\n    --background: var(--purple-primary, #82298F) !important;\n    --background-hover: var(--purple-secondary, #2b0d30) !important;\n    --background-activated: var(--purple-secondary, #2b0d30) !important;\n    --color: #ffffff !important;\n    --border-radius: 20px !important;\n    --padding-top: 10px !important;\n    --padding-bottom: 10px !important;\n    --box-shadow: 0 2px 6px 0 rgba(0, 0, 0, 0.25) !important;\n    text-transform: none;\n\n      pointer-events: auto;\n\n  }\n  "] }]
     }], null, { openCamera: [{
             type: Input
         }] }); })();
-(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassDebugInfo(DpiFrontComponent, { className: "DpiFrontComponent", filePath: "src\\app\\pages\\slides\\dpi-front\\slide1.component.ts", lineNumber: 26 }); })();
+(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassDebugInfo(DpiFrontComponent, { className: "DpiFrontComponent" }); })();
 //# sourceMappingURL=slide1.component.js.map

package/dist/src/app/pages/slides/photo-selfie/photo-selfie.component.js

@@ -67,5 +67,5 @@ export class PhotoSelfieComponent {
     }], null, { openCamera: [{
             type: Input
         }] }); })();
-(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassDebugInfo(PhotoSelfieComponent, { className: "PhotoSelfieComponent", filePath: "src\\app\\pages\\slides\\photo-selfie\\photo-selfie.component.ts", lineNumber: 43 }); })();
+(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassDebugInfo(PhotoSelfieComponent, { className: "PhotoSelfieComponent" }); })();
 //# sourceMappingURL=photo-selfie.component.js.map

package/dist/src/app/pages/slides/slide1/slide1.component.d.ts

@@ -1,11 +1,11 @@
-import { OnInit } from '@angular/core';
-import * as i0 from "@angular/core";
-export declare class Slide1Component implements OnInit {
-    constructor();
-    temp: any;
-    ngOnInit(): void;
-    goToNext(): void;
-    static ɵfac: i0.ɵɵFactoryDeclaration<Slide1Component, never>;
-    static ɵcmp: i0.ɵɵComponentDeclaration<Slide1Component, "app-slide1", never, {}, {}, never, never, false, never>;
-}
+import { OnInit } from '@angular/core';
+import * as i0 from "@angular/core";
+export declare class Slide1Component implements OnInit {
+    constructor();
+    temp: any;
+    ngOnInit(): void;
+    goToNext(): void;
+    static ɵfac: i0.ɵɵFactoryDeclaration<Slide1Component, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<Slide1Component, "app-slide1", never, {}, {}, never, never, false, never>;
+}
 //# sourceMappingURL=slide1.component.d.ts.map

package/dist/src/app/pages/slides/slide1/slide1.component.js

@@ -1,40 +1,40 @@
-import { Component } from '@angular/core';
-import * as i0 from "@angular/core";
-import * as i1 from "@ionic/angular";
-export class Slide1Component {
-    constructor() { }
-    ngOnInit() {
-        this.temp = "";
-    }
-    goToNext() {
-    }
-}
-Slide1Component.ɵfac = function Slide1Component_Factory(__ngFactoryType__) { return new (__ngFactoryType__ || Slide1Component)(); };
-Slide1Component.ɵcmp = /*@__PURE__*/ i0.ɵɵdefineComponent({ type: Slide1Component, selectors: [["app-slide1"]], decls: 17, vars: 0, consts: [["name", "document-outline"], ["name", "videocam-outline"], ["expand", "block", 3, "click"]], template: function Slide1Component_Template(rf, ctx) { if (rf & 1) {
-        i0.ɵɵelementStart(0, "h2");
-        i0.ɵɵtext(1, "Verifiquemos tu identidad");
-        i0.ɵɵelementEnd();
-        i0.ɵɵelementStart(2, "p");
-        i0.ɵɵtext(3, "Para ser verificado, necesitar\u00E1s:");
-        i0.ɵɵelementEnd();
-        i0.ɵɵelementStart(4, "ion-grid")(5, "ion-row")(6, "ion-col");
-        i0.ɵɵelement(7, "ion-icon", 0);
-        i0.ɵɵelementStart(8, "p");
-        i0.ɵɵtext(9, "Sube fotos de documentos que prueben tu identidad");
-        i0.ɵɵelementEnd()()();
-        i0.ɵɵelementStart(10, "ion-row")(11, "ion-col");
-        i0.ɵɵelement(12, "ion-icon", 1);
-        i0.ɵɵelementStart(13, "p");
-        i0.ɵɵtext(14, "Graba un video selfie mientras lees el texto en voz alta");
-        i0.ɵɵelementEnd()()()();
-        i0.ɵɵelementStart(15, "ion-button", 2);
-        i0.ɵɵlistener("click", function Slide1Component_Template_ion_button_click_15_listener() { return ctx.goToNext(); });
-        i0.ɵɵtext(16, "Empecemos");
-        i0.ɵɵelementEnd();
-    } }, dependencies: [i1.IonButton, i1.IonCol, i1.IonGrid, i1.IonIcon, i1.IonRow] });
-(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(Slide1Component, [{
-        type: Component,
-        args: [{ selector: 'app-slide1', template: "\n<h2>Verifiquemos tu identidad</h2>\n<p>Para ser verificado, necesitar\u00E1s:</p>\n<ion-grid>\n  <ion-row>\n    <ion-col>\n      <ion-icon name=\"document-outline\"></ion-icon>\n      <p>Sube fotos de documentos que prueben tu identidad</p>\n    </ion-col>\n  </ion-row>\n  <ion-row>\n    <ion-col>\n      <ion-icon name=\"videocam-outline\"></ion-icon>\n      <p>Graba un video selfie mientras lees el texto en voz alta</p>\n    </ion-col>\n  </ion-row>\n</ion-grid>\n<ion-button expand=\"block\" (click)=\"goToNext()\">Empecemos</ion-button>" }]
-    }], () => [], null); })();
-(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassDebugInfo(Slide1Component, { className: "Slide1Component" }); })();
+import { Component } from '@angular/core';
+import * as i0 from "@angular/core";
+import * as i1 from "@ionic/angular";
+export class Slide1Component {
+    constructor() { }
+    ngOnInit() {
+        this.temp = "";
+    }
+    goToNext() {
+    }
+}
+Slide1Component.ɵfac = function Slide1Component_Factory(__ngFactoryType__) { return new (__ngFactoryType__ || Slide1Component)(); };
+Slide1Component.ɵcmp = /*@__PURE__*/ i0.ɵɵdefineComponent({ type: Slide1Component, selectors: [["app-slide1"]], decls: 17, vars: 0, consts: [["name", "document-outline"], ["name", "videocam-outline"], ["expand", "block", 3, "click"]], template: function Slide1Component_Template(rf, ctx) { if (rf & 1) {
+        i0.ɵɵelementStart(0, "h2");
+        i0.ɵɵtext(1, "Verifiquemos tu identidad");
+        i0.ɵɵelementEnd();
+        i0.ɵɵelementStart(2, "p");
+        i0.ɵɵtext(3, "Para ser verificado, necesitar\u00E1s:");
+        i0.ɵɵelementEnd();
+        i0.ɵɵelementStart(4, "ion-grid")(5, "ion-row")(6, "ion-col");
+        i0.ɵɵelement(7, "ion-icon", 0);
+        i0.ɵɵelementStart(8, "p");
+        i0.ɵɵtext(9, "Sube fotos de documentos que prueben tu identidad");
+        i0.ɵɵelementEnd()()();
+        i0.ɵɵelementStart(10, "ion-row")(11, "ion-col");
+        i0.ɵɵelement(12, "ion-icon", 1);
+        i0.ɵɵelementStart(13, "p");
+        i0.ɵɵtext(14, "Graba un video selfie mientras lees el texto en voz alta");
+        i0.ɵɵelementEnd()()()();
+        i0.ɵɵelementStart(15, "ion-button", 2);
+        i0.ɵɵlistener("click", function Slide1Component_Template_ion_button_click_15_listener() { return ctx.goToNext(); });
+        i0.ɵɵtext(16, "Empecemos");
+        i0.ɵɵelementEnd();
+    } }, dependencies: [i1.IonButton, i1.IonCol, i1.IonGrid, i1.IonIcon, i1.IonRow] });
+(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(Slide1Component, [{
+        type: Component,
+        args: [{ selector: 'app-slide1', template: "\n<h2>Verifiquemos tu identidad</h2>\n<p>Para ser verificado, necesitar\u00E1s:</p>\n<ion-grid>\n  <ion-row>\n    <ion-col>\n      <ion-icon name=\"document-outline\"></ion-icon>\n      <p>Sube fotos de documentos que prueben tu identidad</p>\n    </ion-col>\n  </ion-row>\n  <ion-row>\n    <ion-col>\n      <ion-icon name=\"videocam-outline\"></ion-icon>\n      <p>Graba un video selfie mientras lees el texto en voz alta</p>\n    </ion-col>\n  </ion-row>\n</ion-grid>\n<ion-button expand=\"block\" (click)=\"goToNext()\">Empecemos</ion-button>" }]
+    }], () => [], null); })();
+(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassDebugInfo(Slide1Component, { className: "Slide1Component" }); })();
 //# sourceMappingURL=slide1.component.js.map

package/dist/src/app/pages/slides/slide2/slide2.component.d.ts

@@ -1,9 +1,9 @@
-import { OnInit } from '@angular/core';
-import * as i0 from "@angular/core";
-export declare class Slide2Component implements OnInit {
-    constructor();
-    ngOnInit(): void;
-    static ɵfac: i0.ɵɵFactoryDeclaration<Slide2Component, never>;
-    static ɵcmp: i0.ɵɵComponentDeclaration<Slide2Component, "app-slide2", never, {}, {}, never, never, false, never>;
-}
+import { OnInit } from '@angular/core';
+import * as i0 from "@angular/core";
+export declare class Slide2Component implements OnInit {
+    constructor();
+    ngOnInit(): void;
+    static ɵfac: i0.ɵɵFactoryDeclaration<Slide2Component, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<Slide2Component, "app-slide2", never, {}, {}, never, never, false, never>;
+}
 //# sourceMappingURL=slide2.component.d.ts.map

package/dist/src/app/pages/slides/slide2/slide2.component.js

@@ -1,18 +1,18 @@
-import { Component } from '@angular/core';
-import * as i0 from "@angular/core";
-export class Slide2Component {
-    constructor() { }
-    ngOnInit() { }
-}
-Slide2Component.ɵfac = function Slide2Component_Factory(__ngFactoryType__) { return new (__ngFactoryType__ || Slide2Component)(); };
-Slide2Component.ɵcmp = /*@__PURE__*/ i0.ɵɵdefineComponent({ type: Slide2Component, selectors: [["app-slide2"]], decls: 2, vars: 0, template: function Slide2Component_Template(rf, ctx) { if (rf & 1) {
-        i0.ɵɵelementStart(0, "p");
-        i0.ɵɵtext(1, " slide2 works!\n");
-        i0.ɵɵelementEnd();
-    } } });
-(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(Slide2Component, [{
-        type: Component,
-        args: [{ selector: 'app-slide2', template: "<p>\n  slide2 works!\n</p>\n" }]
-    }], () => [], null); })();
-(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassDebugInfo(Slide2Component, { className: "Slide2Component" }); })();
+import { Component } from '@angular/core';
+import * as i0 from "@angular/core";
+export class Slide2Component {
+    constructor() { }
+    ngOnInit() { }
+}
+Slide2Component.ɵfac = function Slide2Component_Factory(__ngFactoryType__) { return new (__ngFactoryType__ || Slide2Component)(); };
+Slide2Component.ɵcmp = /*@__PURE__*/ i0.ɵɵdefineComponent({ type: Slide2Component, selectors: [["app-slide2"]], decls: 2, vars: 0, template: function Slide2Component_Template(rf, ctx) { if (rf & 1) {
+        i0.ɵɵelementStart(0, "p");
+        i0.ɵɵtext(1, " slide2 works!\n");
+        i0.ɵɵelementEnd();
+    } } });
+(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(Slide2Component, [{
+        type: Component,
+        args: [{ selector: 'app-slide2', template: "<p>\n  slide2 works!\n</p>\n" }]
+    }], () => [], null); })();
+(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassDebugInfo(Slide2Component, { className: "Slide2Component" }); })();
 //# sourceMappingURL=slide2.component.js.map

package/dist/src/app/pages/slides/slide3/slide3.component.d.ts

@@ -1,9 +1,9 @@
-import { OnInit } from '@angular/core';
-import * as i0 from "@angular/core";
-export declare class Slide3Component implements OnInit {
-    constructor();
-    ngOnInit(): void;
-    static ɵfac: i0.ɵɵFactoryDeclaration<Slide3Component, never>;
-    static ɵcmp: i0.ɵɵComponentDeclaration<Slide3Component, "app-slide3", never, {}, {}, never, never, false, never>;
-}
+import { OnInit } from '@angular/core';
+import * as i0 from "@angular/core";
+export declare class Slide3Component implements OnInit {
+    constructor();
+    ngOnInit(): void;
+    static ɵfac: i0.ɵɵFactoryDeclaration<Slide3Component, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<Slide3Component, "app-slide3", never, {}, {}, never, never, false, never>;
+}
 //# sourceMappingURL=slide3.component.d.ts.map

package/dist/src/app/pages/slides/slide3/slide3.component.js

@@ -1,18 +1,18 @@
-import { Component } from '@angular/core';
-import * as i0 from "@angular/core";
-export class Slide3Component {
-    constructor() { }
-    ngOnInit() { }
-}
-Slide3Component.ɵfac = function Slide3Component_Factory(__ngFactoryType__) { return new (__ngFactoryType__ || Slide3Component)(); };
-Slide3Component.ɵcmp = /*@__PURE__*/ i0.ɵɵdefineComponent({ type: Slide3Component, selectors: [["app-slide3"]], decls: 2, vars: 0, template: function Slide3Component_Template(rf, ctx) { if (rf & 1) {
-        i0.ɵɵelementStart(0, "p");
-        i0.ɵɵtext(1, " slide3 works!\n");
-        i0.ɵɵelementEnd();
-    } } });
-(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(Slide3Component, [{
-        type: Component,
-        args: [{ selector: 'app-slide3', template: "<p>\n  slide3 works!\n</p>\n" }]
-    }], () => [], null); })();
-(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassDebugInfo(Slide3Component, { className: "Slide3Component" }); })();
+import { Component } from '@angular/core';
+import * as i0 from "@angular/core";
+export class Slide3Component {
+    constructor() { }
+    ngOnInit() { }
+}
+Slide3Component.ɵfac = function Slide3Component_Factory(__ngFactoryType__) { return new (__ngFactoryType__ || Slide3Component)(); };
+Slide3Component.ɵcmp = /*@__PURE__*/ i0.ɵɵdefineComponent({ type: Slide3Component, selectors: [["app-slide3"]], decls: 2, vars: 0, template: function Slide3Component_Template(rf, ctx) { if (rf & 1) {
+        i0.ɵɵelementStart(0, "p");
+        i0.ɵɵtext(1, " slide3 works!\n");
+        i0.ɵɵelementEnd();
+    } } });
+(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(Slide3Component, [{
+        type: Component,
+        args: [{ selector: 'app-slide3', template: "<p>\n  slide3 works!\n</p>\n" }]
+    }], () => [], null); })();
+(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassDebugInfo(Slide3Component, { className: "Slide3Component" }); })();
 //# sourceMappingURL=slide3.component.js.map

package/dist/src/app/pages/slides/slide4/slide4.component.js

@@ -12,7 +12,7 @@ export class Slide4Component {
 }
 (() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(Slide4Component, [{
         type: Component,
-        args: [{ selector: 'app-slide4', template: "<p>\r\n  slide4 works!\r\n</p>\r\n" }]
+        args: [{ selector: 'app-slide4', template: "<p>\n  slide4 works!\n</p>\n" }]
     }], () => [], null); })();
-(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassDebugInfo(Slide4Component, { className: "Slide4Component", filePath: "src\\app\\pages\\slides\\slide4\\slide4.component.ts", lineNumber: 8 }); })();
+(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassDebugInfo(Slide4Component, { className: "Slide4Component" }); })();
 //# sourceMappingURL=slide4.component.js.map

package/dist/src/app/pages/slides/video-selfie/slide3.component.js

@@ -27,45 +27,45 @@ export class VideoSelfieComponent {
             i0.ɵɵlistener("click", function VideoSelfieComponent_Template_ion_button_click_22_listener() { return ctx.openCamera(); });
             i0.ɵɵtext(23, "Abrir la c\u00E1mara");
             i0.ɵɵelementEnd()()();
-        } }, dependencies: [IonicModule, i1.IonButton, i1.IonGrid, i1.IonRow], styles: [".content[_ngcontent-%COMP%] {\r\n    padding: 10px;\r\n    align-items: center;\r\n    justify-content: center;\r\n    height: 100vh;\r\n    background-color: #fff;\r\n    font-size: 18px;\r\n    background-image: url('assets/imagesIdvision/background.png');\r\n\r\n    background-size: cover;\r\n    background-repeat: no-repeat;\r\n    background-position: center;\r\n    \r\n}\r\n\r\n\r\nh2[_ngcontent-%COMP%] {\r\n    font-size: 1.5em;\r\n    font-weight: bold;\r\n    color: var(--orange-primary, orange);\r\n    text-align: center;\r\n    margin-top: 20px;\r\n  }\r\n  \r\n  p[_ngcontent-%COMP%] {\r\n    font-size: 1em;\r\n    color: #666;\r\n    text-align: center;\r\n    margin: 0;\r\n  }\r\n  \r\n  ion-grid[_ngcontent-%COMP%] {\r\n    margin-top: 20px;\r\n  }\r\n  \r\n  ion-row[_ngcontent-%COMP%] {\r\n    margin: 15px 0;\r\n    display: flex;\r\n    justify-content: center;\r\n    align-items: center;\r\n  }\r\n  \r\n  ion-col[_ngcontent-%COMP%] {\r\n    display: flex;\r\n    flex-direction: column;\r\n    align-items: center;\r\n    text-align: center;\r\n  }\r\n  \r\n  ion-icon[_ngcontent-%COMP%] {\r\n    font-size: 3em; // Tama\u00F1o del \u00EDcono para que sea m\u00E1s destacado\r\n    color: #ff8c00; // Color similar al amarillo-naranja\r\n    margin-bottom: 10px;\r\n  }\r\n\r\n.container-text[_ngcontent-%COMP%] {\r\n  text-align: justify !important;\r\n    width: 180px;\r\n}\r\n\r\np[_ngcontent-%COMP%] {\r\n  text-align: start;\r\n}\r\n\r\n.p-center[_ngcontent-%COMP%]{\r\ntext-align: center;\r\n}\r\n\r\n.p-justify[_ngcontent-%COMP%]{\r\n  text-align: start;\r\n  }\r\n\r\n.head[_ngcontent-%COMP%] {\r\n    padding: 30px;\r\n    margin-top: 75px;\r\n    margin-bottom: 20px;\r\n}\r\n\r\n\r\n.verify-container[_ngcontent-%COMP%] {\r\n   // padding: 60px;\r\n    display: flex;\r\n    flex-direction: column;\r\n    align-items: center;\r\n    justify-content: center;\r\n    height: 40%; // Ocupa todo el espacio disponible en el ion-content\r\n    text-align: center;\r\n    //background-color: black;\r\n}\r\n\r\n.fixed-footer[_ngcontent-%COMP%] {\r\n    position: fixed;\r\n    bottom: 0;\r\n    left: 0;\r\n    width: 100%;\r\n    padding: 0px 10px 25px 10px;\r\n    // background-color: black; // Color de fondo, opcional\r\n   // box-shadow: 0 -2px 10px rgba(0, 0, 0, 0.1); // Sombra suave para que resalte\r\n  \r\n    ion-button {\r\n      width: 90%;\r\n      max-width: 300px;\r\n      margin: 0 auto;\r\n      background-color: #ffcc00;\r\n      color: #ffffff;\r\n      font-weight: bold;\r\n      border-radius: 20px;\r\n  \r\n      &:hover {\r\n        background-color: #ffb300;\r\n      }\r\n  \r\n      &:active {\r\n        background-color: #e6a800;\r\n      }\r\n    }\r\n  }\r\n\r\n  .dpi-container[_ngcontent-%COMP%] {\r\n    display: flex;\r\n    //width: 100%;\r\n    justify-content: center;\r\n    align-items: center;\r\n    height: 50vh;\r\n  }\r\n.dpi-image[_ngcontent-%COMP%] {\r\n    width: 200px;\r\n}\r\n\r\n.image-container[_ngcontent-%COMP%] {\r\n    width: 100px;\r\n    max-width: 90px;\r\n}\r\n\r\n.col-confirmation[_ngcontent-%COMP%] {\r\n  margin-top: 100px;\r\n  padding: 20px;\r\n  display: flex;\r\n  flex-direction: column;\r\n  gap: 20px; \n\r\n}\r\n\r\n.image-item[_ngcontent-%COMP%] {\r\n  margin-top: 50px;\r\n  padding-top: 70px;\r\n}\r\n\r\n.font-confirmation[_ngcontent-%COMP%] {\r\n  font-size: 26px;\r\n  text-align: center;\r\n  // color: #005da9;\r\n  color: var(--purple-primary);\r\n  font-weight: bold;\r\n}\r\n\r\n\r\n.rounded-input[_ngcontent-%COMP%] {\r\n  margin-top: 15px;\r\n  background-color: #f4f6fc; \n\r\n  border-radius: 10px; \n\r\n  padding: 5px 5px; \n\r\n  box-shadow: 0px 4px 6px rgba(0, 0, 0, 0.1); \n\r\n  --ion-border-color: transparent; \n\r\n}\r\n\r\nion-input[_ngcontent-%COMP%] {\r\n  text-align: center;\r\n  color: var(--orange-primary);\r\n  --padding-start: 8px;\r\n}\r\n\r\n.custom-footer[_ngcontent-%COMP%] {\r\n  position: fixed;\r\n  bottom: 0;\r\n  left: 0;\r\n  width: 100%;\r\n  padding: 10px;\r\n  display: flex;\r\n  justify-content: space-between; \n\r\n  background-color: #ffffff; \n\r\n  //box-shadow: 0 -2px 10px rgba(0, 0, 0, 0.1); \n\r\n}\r\n\r\n.custom-footer[_ngcontent-%COMP%]   ion-button[_ngcontent-%COMP%] {\r\n  flex: 0 0 48%; \n\r\n}\r\n\r\n.custom-footer[_ngcontent-%COMP%]   .left-button[_ngcontent-%COMP%] {\r\n  max-width: 140px;\r\n  color: black;\r\n\r\n  --background: white;\r\n\r\n  --color: var(--purple-primary);\r\n\r\n  --border-radius: 20px;\r\n  --border-color: white;\r\n  margin-right: auto; \n\r\n  --box-shadow: 0 2px 6px 0 rgb(0, 0, 0, 0.0);\r\n\r\n}\r\n\r\n.custom-footer[_ngcontent-%COMP%]   .right-button[_ngcontent-%COMP%] {\r\n  margin-left: auto; \n\r\n}\r\n\r\n.tutorial-head[_ngcontent-%COMP%] {\r\n  padding-top:50px;\r\n  display: flex;\r\n  justify-content: center;\r\n  align-items: center;\r\n  color: black;\r\n}\r\n\r\n.center-container[_ngcontent-%COMP%] {\r\n  display: flex;\r\n  justify-content: center;\r\n  align-items: center;\r\n  height: 60vh; \n\r\n  width: 100%;\r\n}\r\n\r\n.tutorial-title[_ngcontent-%COMP%] {\r\n  text-align: center;\r\n}\r\n\r\n.rounded-input[_ngcontent-%COMP%]   ion-input[_ngcontent-%COMP%] {\r\n  font-size: 14px; \n\r\n  color: #333; \n\r\n}\r\n\r\n.rounded-input[_ngcontent-%COMP%]::part(native) {\r\n  background: transparent; \n\r\n}\r\n\r\n.p-info[_ngcontent-%COMP%]{\r\n  font-weight: bold;\r\n  color: #714e93\r\n}\r\n\r\n.custom-button[_ngcontent-%COMP%] {\r\n    --background: var(--purple-primary, #82298F) !important;\r\n    --background-hover: var(--purple-secondary, #2b0d30) !important;\r\n    --background-activated: var(--purple-secondary, #2b0d30) !important;\r\n    --color: #ffffff !important;\r\n    --border-radius: 20px !important;\r\n    --padding-top: 10px !important;\r\n    --padding-bottom: 10px !important;\r\n    --box-shadow: 0 2px 6px 0 rgba(0, 0, 0, 0.25) !important;\r\n    text-transform: none;\r\n\r\n      pointer-events: auto;\r\n\r\n  }"] }); }
+        } }, dependencies: [IonicModule, i1.IonButton, i1.IonGrid, i1.IonRow], styles: [".content[_ngcontent-%COMP%] {\n    padding: 10px;\n    align-items: center;\n    justify-content: center;\n    height: 100vh;\n    background-color: #fff;\n    font-size: 18px;\n    background-image: url('assets/imagesIdvision/background.png');\n\n    background-size: cover;\n    background-repeat: no-repeat;\n    background-position: center;\n    \n}\n\n\nh2[_ngcontent-%COMP%] {\n    font-size: 1.5em;\n    font-weight: bold;\n    color: var(--orange-primary, orange);\n    text-align: center;\n    margin-top: 20px;\n  }\n  \n  p[_ngcontent-%COMP%] {\n    font-size: 1em;\n    color: #666;\n    text-align: center;\n    margin: 0;\n  }\n  \n  ion-grid[_ngcontent-%COMP%] {\n    margin-top: 20px;\n  }\n  \n  ion-row[_ngcontent-%COMP%] {\n    margin: 15px 0;\n    display: flex;\n    justify-content: center;\n    align-items: center;\n  }\n  \n  ion-col[_ngcontent-%COMP%] {\n    display: flex;\n    flex-direction: column;\n    align-items: center;\n    text-align: center;\n  }\n  \n  ion-icon[_ngcontent-%COMP%] {\n    font-size: 3em; // Tama\u00F1o del \u00EDcono para que sea m\u00E1s destacado\n    color: #ff8c00; // Color similar al amarillo-naranja\n    margin-bottom: 10px;\n  }\n\n.container-text[_ngcontent-%COMP%] {\n  text-align: justify !important;\n    width: 180px;\n}\n\np[_ngcontent-%COMP%] {\n  text-align: start;\n}\n\n.p-center[_ngcontent-%COMP%]{\ntext-align: center;\n}\n\n.p-justify[_ngcontent-%COMP%]{\n  text-align: start;\n  }\n\n.head[_ngcontent-%COMP%] {\n    padding: 30px;\n    margin-top: 75px;\n    margin-bottom: 20px;\n}\n\n\n.verify-container[_ngcontent-%COMP%] {\n   // padding: 60px;\n    display: flex;\n    flex-direction: column;\n    align-items: center;\n    justify-content: center;\n    height: 40%; // Ocupa todo el espacio disponible en el ion-content\n    text-align: center;\n    //background-color: black;\n}\n\n.fixed-footer[_ngcontent-%COMP%] {\n    position: fixed;\n    bottom: 0;\n    left: 0;\n    width: 100%;\n    padding: 0px 10px 25px 10px;\n    // background-color: black; // Color de fondo, opcional\n   // box-shadow: 0 -2px 10px rgba(0, 0, 0, 0.1); // Sombra suave para que resalte\n  \n    ion-button {\n      width: 90%;\n      max-width: 300px;\n      margin: 0 auto;\n      background-color: #ffcc00;\n      color: #ffffff;\n      font-weight: bold;\n      border-radius: 20px;\n  \n      &:hover {\n        background-color: #ffb300;\n      }\n  \n      &:active {\n        background-color: #e6a800;\n      }\n    }\n  }\n\n  .dpi-container[_ngcontent-%COMP%] {\n    display: flex;\n    //width: 100%;\n    justify-content: center;\n    align-items: center;\n    height: 50vh;\n  }\n.dpi-image[_ngcontent-%COMP%] {\n    width: 200px;\n}\n\n.image-container[_ngcontent-%COMP%] {\n    width: 100px;\n    max-width: 90px;\n}\n\n.col-confirmation[_ngcontent-%COMP%] {\n  margin-top: 100px;\n  padding: 20px;\n  display: flex;\n  flex-direction: column;\n  gap: 20px; \n\n}\n\n.image-item[_ngcontent-%COMP%] {\n  margin-top: 50px;\n  padding-top: 70px;\n}\n\n.font-confirmation[_ngcontent-%COMP%] {\n  font-size: 26px;\n  text-align: center;\n  // color: #005da9;\n  color: var(--purple-primary);\n  font-weight: bold;\n}\n\n\n.rounded-input[_ngcontent-%COMP%] {\n  margin-top: 15px;\n  background-color: #f4f6fc; \n\n  border-radius: 10px; \n\n  padding: 5px 5px; \n\n  box-shadow: 0px 4px 6px rgba(0, 0, 0, 0.1); \n\n  --ion-border-color: transparent; \n\n}\n\nion-input[_ngcontent-%COMP%] {\n  text-align: center;\n  color: var(--orange-primary);\n  --padding-start: 8px;\n}\n\n.custom-footer[_ngcontent-%COMP%] {\n  position: fixed;\n  bottom: 0;\n  left: 0;\n  width: 100%;\n  padding: 10px;\n  display: flex;\n  justify-content: space-between; \n\n  background-color: #ffffff; \n\n  //box-shadow: 0 -2px 10px rgba(0, 0, 0, 0.1); \n\n}\n\n.custom-footer[_ngcontent-%COMP%]   ion-button[_ngcontent-%COMP%] {\n  flex: 0 0 48%; \n\n}\n\n.custom-footer[_ngcontent-%COMP%]   .left-button[_ngcontent-%COMP%] {\n  max-width: 140px;\n  color: black;\n\n  --background: white;\n\n  --color: var(--purple-primary);\n\n  --border-radius: 20px;\n  --border-color: white;\n  margin-right: auto; \n\n  --box-shadow: 0 2px 6px 0 rgb(0, 0, 0, 0.0);\n\n}\n\n.custom-footer[_ngcontent-%COMP%]   .right-button[_ngcontent-%COMP%] {\n  margin-left: auto; \n\n}\n\n.tutorial-head[_ngcontent-%COMP%] {\n  padding-top:50px;\n  display: flex;\n  justify-content: center;\n  align-items: center;\n  color: black;\n}\n\n.center-container[_ngcontent-%COMP%] {\n  display: flex;\n  justify-content: center;\n  align-items: center;\n  height: 60vh; \n\n  width: 100%;\n}\n\n.tutorial-title[_ngcontent-%COMP%] {\n  text-align: center;\n}\n\n.rounded-input[_ngcontent-%COMP%]   ion-input[_ngcontent-%COMP%] {\n  font-size: 14px; \n\n  color: #333; \n\n}\n\n.rounded-input[_ngcontent-%COMP%]::part(native) {\n  background: transparent; \n\n}\n\n.p-info[_ngcontent-%COMP%]{\n  font-weight: bold;\n  color: #714e93\n}\n\n.custom-button[_ngcontent-%COMP%] {\n    --background: var(--purple-primary, #82298F) !important;\n    --background-hover: var(--purple-secondary, #2b0d30) !important;\n    --background-activated: var(--purple-secondary, #2b0d30) !important;\n    --color: #ffffff !important;\n    --border-radius: 20px !important;\n    --padding-top: 10px !important;\n    --padding-bottom: 10px !important;\n    --box-shadow: 0 2px 6px 0 rgba(0, 0, 0, 0.25) !important;\n    text-transform: none;\n\n      pointer-events: auto;\n\n  }"] }); }
 }
 (() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(VideoSelfieComponent, [{
         type: Component,
-        args: [{ selector: 'app-video-selfie', standalone: true, imports: [IonicModule], template: `
-    <div class="content">
-      <div class="head">
-        <h2>Video Selfie</h2>
-        <p class="p-justify">Graba un breve video para completar tu proceso de identificación.</p>
-      </div>
-      <ion-grid class="verify-container">
-        <ion-row>
-          <ion-row>
-            <div class="image-container">
-              <img src="assets/imagesIdvision/Foco.png" alt="" />
-            </div>
-            <div class="container-text">
-              <p>Si estás en interiores, asegúrate de que la luz esté frente a ti, no detrás.</p>
-            </div>
-          </ion-row>
-        </ion-row>
-        <ion-row>
-          <ion-row>
-            <div class="image-container">
-              <img src="assets/imagesIdvision/rostroImage.png" alt="" />
-            </div>
-            <div class="container-text">
-              <p>Asegúrate de que tu rostro sea visible y de no usar anteojos ni sombreros.</p>
-            </div>
-          </ion-row>
-        </ion-row>
-      </ion-grid>
-      <div class="fixed-footer">
-        <ion-button class="custom-button" expand="block" (click)="openCamera()">Abrir la cámara</ion-button>
-      </div>
-    </div>
-  `, styles: ["\r\n.content {\r\n    padding: 10px;\r\n    align-items: center;\r\n    justify-content: center;\r\n    height: 100vh;\r\n    background-color: #fff;\r\n    font-size: 18px;\r\n    background-image: url('assets/imagesIdvision/background.png');\r\n\r\n    background-size: cover;\r\n    background-repeat: no-repeat;\r\n    background-position: center;\r\n    \r\n}\r\n\r\n\r\nh2 {\r\n    font-size: 1.5em;\r\n    font-weight: bold;\r\n    color: var(--orange-primary, orange);\r\n    text-align: center;\r\n    margin-top: 20px;\r\n  }\r\n  \r\n  p {\r\n    font-size: 1em;\r\n    color: #666;\r\n    text-align: center;\r\n    margin: 0;\r\n  }\r\n  \r\n  ion-grid {\r\n    margin-top: 20px;\r\n  }\r\n  \r\n  ion-row {\r\n    margin: 15px 0;\r\n    display: flex;\r\n    justify-content: center;\r\n    align-items: center;\r\n  }\r\n  \r\n  ion-col {\r\n    display: flex;\r\n    flex-direction: column;\r\n    align-items: center;\r\n    text-align: center;\r\n  }\r\n  \r\n  ion-icon {\r\n    font-size: 3em; // Tama\u00F1o del \u00EDcono para que sea m\u00E1s destacado\r\n    color: #ff8c00; // Color similar al amarillo-naranja\r\n    margin-bottom: 10px;\r\n  }\r\n\r\n.container-text {\r\n  text-align: justify !important;\r\n    width: 180px;\r\n}\r\n\r\np {\r\n  text-align: start;\r\n}\r\n\r\n.p-center{\r\ntext-align: center;\r\n}\r\n\r\n.p-justify{\r\n  text-align: start;\r\n  }\r\n\r\n.head {\r\n    padding: 30px;\r\n    margin-top: 75px;\r\n    margin-bottom: 20px;\r\n}\r\n\r\n\r\n.verify-container {\r\n   // padding: 60px;\r\n    display: flex;\r\n    flex-direction: column;\r\n    align-items: center;\r\n    justify-content: center;\r\n    height: 40%; // Ocupa todo el espacio disponible en el ion-content\r\n    text-align: center;\r\n    //background-color: black;\r\n}\r\n\r\n.fixed-footer {\r\n    position: fixed;\r\n    bottom: 0;\r\n    left: 0;\r\n    width: 100%;\r\n    padding: 0px 10px 25px 10px;\r\n    // background-color: black; // Color de fondo, opcional\r\n   // box-shadow: 0 -2px 10px rgba(0, 0, 0, 0.1); // Sombra suave para que resalte\r\n  \r\n    ion-button {\r\n      width: 90%;\r\n      max-width: 300px;\r\n      margin: 0 auto;\r\n      background-color: #ffcc00;\r\n      color: #ffffff;\r\n      font-weight: bold;\r\n      border-radius: 20px;\r\n  \r\n      &:hover {\r\n        background-color: #ffb300;\r\n      }\r\n  \r\n      &:active {\r\n        background-color: #e6a800;\r\n      }\r\n    }\r\n  }\r\n\r\n  .dpi-container {\r\n    display: flex;\r\n    //width: 100%;\r\n    justify-content: center;\r\n    align-items: center;\r\n    height: 50vh;\r\n  }\r\n.dpi-image {\r\n    width: 200px;\r\n}\r\n\r\n.image-container {\r\n    width: 100px;\r\n    max-width: 90px;\r\n}\r\n\r\n.col-confirmation {\r\n  margin-top: 100px;\r\n  padding: 20px;\r\n  display: flex;\r\n  flex-direction: column;\r\n  gap: 20px; /* Ajusta el espacio entre los elementos */\r\n}\r\n\r\n.image-item {\r\n  margin-top: 50px;\r\n  padding-top: 70px;\r\n}\r\n\r\n.font-confirmation {\r\n  font-size: 26px;\r\n  text-align: center;\r\n  // color: #005da9;\r\n  color: var(--purple-primary);\r\n  font-weight: bold;\r\n}\r\n\r\n\r\n.rounded-input {\r\n  margin-top: 15px;\r\n  background-color: #f4f6fc; /* Color de fondo suave */\r\n  border-radius: 10px; /* Bordes redondeados */\r\n  padding: 5px 5px; /* Espaciado interno */\r\n  box-shadow: 0px 4px 6px rgba(0, 0, 0, 0.1); /* Sombra suave */\r\n  --ion-border-color: transparent; /* Quita cualquier borde por defecto */\r\n}\r\n\r\nion-input {\r\n  text-align: center;\r\n  color: var(--orange-primary);\r\n  --padding-start: 8px;\r\n}\r\n\r\n.custom-footer {\r\n  position: fixed;\r\n  bottom: 0;\r\n  left: 0;\r\n  width: 100%;\r\n  padding: 10px;\r\n  display: flex;\r\n  justify-content: space-between; /* Alinea los botones a los extremos */\r\n  background-color: #ffffff; /* Fondo opcional */\r\n  //box-shadow: 0 -2px 10px rgba(0, 0, 0, 0.1); /* Sombra opcional */\r\n}\r\n\r\n.custom-footer ion-button {\r\n  flex: 0 0 48%; /* Los botones ocupan casi la mitad del espacio */\r\n}\r\n\r\n.custom-footer .left-button {\r\n  max-width: 140px;\r\n  color: black;\r\n\r\n  --background: white;\r\n\r\n  --color: var(--purple-primary);\r\n\r\n  --border-radius: 20px;\r\n  --border-color: white;\r\n  margin-right: auto; /* Opcional si necesitas ajustes de margen */\r\n  --box-shadow: 0 2px 6px 0 rgb(0, 0, 0, 0.0);\r\n\r\n}\r\n\r\n.custom-footer .right-button {\r\n  margin-left: auto; /* Opcional si necesitas ajustes de margen */\r\n}\r\n\r\n.tutorial-head {\r\n  padding-top:50px;\r\n  display: flex;\r\n  justify-content: center;\r\n  align-items: center;\r\n  color: black;\r\n}\r\n\r\n.center-container {\r\n  display: flex;\r\n  justify-content: center;\r\n  align-items: center;\r\n  height: 60vh; /* Ajusta este valor si quieres m\u00E1s o menos espacio vertical */\r\n  width: 100%;\r\n}\r\n\r\n.tutorial-title {\r\n  text-align: center;\r\n}\r\n\r\n.rounded-input ion-input {\r\n  font-size: 14px; /* Tama\u00F1o de texto */\r\n  color: #333; /* Color del texto */\r\n}\r\n\r\n.rounded-input::part(native) {\r\n  background: transparent; /* Fondo transparente para evitar conflictos */\r\n}\r\n\r\n.p-info{\r\n  font-weight: bold;\r\n  color: #714e93\r\n}\r\n\r\n.custom-button {\r\n    --background: var(--purple-primary, #82298F) !important;\r\n    --background-hover: var(--purple-secondary, #2b0d30) !important;\r\n    --background-activated: var(--purple-secondary, #2b0d30) !important;\r\n    --color: #ffffff !important;\r\n    --border-radius: 20px !important;\r\n    --padding-top: 10px !important;\r\n    --padding-bottom: 10px !important;\r\n    --box-shadow: 0 2px 6px 0 rgba(0, 0, 0, 0.25) !important;\r\n    text-transform: none;\r\n\r\n      pointer-events: auto;\r\n\r\n  }\r\n  "] }]
+        args: [{ selector: 'app-video-selfie', standalone: true, imports: [IonicModule], template: `
+    <div class="content">
+      <div class="head">
+        <h2>Video Selfie</h2>
+        <p class="p-justify">Graba un breve video para completar tu proceso de identificación.</p>
+      </div>
+      <ion-grid class="verify-container">
+        <ion-row>
+          <ion-row>
+            <div class="image-container">
+              <img src="assets/imagesIdvision/Foco.png" alt="" />
+            </div>
+            <div class="container-text">
+              <p>Si estás en interiores, asegúrate de que la luz esté frente a ti, no detrás.</p>
+            </div>
+          </ion-row>
+        </ion-row>
+        <ion-row>
+          <ion-row>
+            <div class="image-container">
+              <img src="assets/imagesIdvision/rostroImage.png" alt="" />
+            </div>
+            <div class="container-text">
+              <p>Asegúrate de que tu rostro sea visible y de no usar anteojos ni sombreros.</p>
+            </div>
+          </ion-row>
+        </ion-row>
+      </ion-grid>
+      <div class="fixed-footer">
+        <ion-button class="custom-button" expand="block" (click)="openCamera()">Abrir la cámara</ion-button>
+      </div>
+    </div>
+  `, styles: ["\n.content {\n    padding: 10px;\n    align-items: center;\n    justify-content: center;\n    height: 100vh;\n    background-color: #fff;\n    font-size: 18px;\n    background-image: url('assets/imagesIdvision/background.png');\n\n    background-size: cover;\n    background-repeat: no-repeat;\n    background-position: center;\n    \n}\n\n\nh2 {\n    font-size: 1.5em;\n    font-weight: bold;\n    color: var(--orange-primary, orange);\n    text-align: center;\n    margin-top: 20px;\n  }\n  \n  p {\n    font-size: 1em;\n    color: #666;\n    text-align: center;\n    margin: 0;\n  }\n  \n  ion-grid {\n    margin-top: 20px;\n  }\n  \n  ion-row {\n    margin: 15px 0;\n    display: flex;\n    justify-content: center;\n    align-items: center;\n  }\n  \n  ion-col {\n    display: flex;\n    flex-direction: column;\n    align-items: center;\n    text-align: center;\n  }\n  \n  ion-icon {\n    font-size: 3em; // Tama\u00F1o del \u00EDcono para que sea m\u00E1s destacado\n    color: #ff8c00; // Color similar al amarillo-naranja\n    margin-bottom: 10px;\n  }\n\n.container-text {\n  text-align: justify !important;\n    width: 180px;\n}\n\np {\n  text-align: start;\n}\n\n.p-center{\ntext-align: center;\n}\n\n.p-justify{\n  text-align: start;\n  }\n\n.head {\n    padding: 30px;\n    margin-top: 75px;\n    margin-bottom: 20px;\n}\n\n\n.verify-container {\n   // padding: 60px;\n    display: flex;\n    flex-direction: column;\n    align-items: center;\n    justify-content: center;\n    height: 40%; // Ocupa todo el espacio disponible en el ion-content\n    text-align: center;\n    //background-color: black;\n}\n\n.fixed-footer {\n    position: fixed;\n    bottom: 0;\n    left: 0;\n    width: 100%;\n    padding: 0px 10px 25px 10px;\n    // background-color: black; // Color de fondo, opcional\n   // box-shadow: 0 -2px 10px rgba(0, 0, 0, 0.1); // Sombra suave para que resalte\n  \n    ion-button {\n      width: 90%;\n      max-width: 300px;\n      margin: 0 auto;\n      background-color: #ffcc00;\n      color: #ffffff;\n      font-weight: bold;\n      border-radius: 20px;\n  \n      &:hover {\n        background-color: #ffb300;\n      }\n  \n      &:active {\n        background-color: #e6a800;\n      }\n    }\n  }\n\n  .dpi-container {\n    display: flex;\n    //width: 100%;\n    justify-content: center;\n    align-items: center;\n    height: 50vh;\n  }\n.dpi-image {\n    width: 200px;\n}\n\n.image-container {\n    width: 100px;\n    max-width: 90px;\n}\n\n.col-confirmation {\n  margin-top: 100px;\n  padding: 20px;\n  display: flex;\n  flex-direction: column;\n  gap: 20px; /* Ajusta el espacio entre los elementos */\n}\n\n.image-item {\n  margin-top: 50px;\n  padding-top: 70px;\n}\n\n.font-confirmation {\n  font-size: 26px;\n  text-align: center;\n  // color: #005da9;\n  color: var(--purple-primary);\n  font-weight: bold;\n}\n\n\n.rounded-input {\n  margin-top: 15px;\n  background-color: #f4f6fc; /* Color de fondo suave */\n  border-radius: 10px; /* Bordes redondeados */\n  padding: 5px 5px; /* Espaciado interno */\n  box-shadow: 0px 4px 6px rgba(0, 0, 0, 0.1); /* Sombra suave */\n  --ion-border-color: transparent; /* Quita cualquier borde por defecto */\n}\n\nion-input {\n  text-align: center;\n  color: var(--orange-primary);\n  --padding-start: 8px;\n}\n\n.custom-footer {\n  position: fixed;\n  bottom: 0;\n  left: 0;\n  width: 100%;\n  padding: 10px;\n  display: flex;\n  justify-content: space-between; /* Alinea los botones a los extremos */\n  background-color: #ffffff; /* Fondo opcional */\n  //box-shadow: 0 -2px 10px rgba(0, 0, 0, 0.1); /* Sombra opcional */\n}\n\n.custom-footer ion-button {\n  flex: 0 0 48%; /* Los botones ocupan casi la mitad del espacio */\n}\n\n.custom-footer .left-button {\n  max-width: 140px;\n  color: black;\n\n  --background: white;\n\n  --color: var(--purple-primary);\n\n  --border-radius: 20px;\n  --border-color: white;\n  margin-right: auto; /* Opcional si necesitas ajustes de margen */\n  --box-shadow: 0 2px 6px 0 rgb(0, 0, 0, 0.0);\n\n}\n\n.custom-footer .right-button {\n  margin-left: auto; /* Opcional si necesitas ajustes de margen */\n}\n\n.tutorial-head {\n  padding-top:50px;\n  display: flex;\n  justify-content: center;\n  align-items: center;\n  color: black;\n}\n\n.center-container {\n  display: flex;\n  justify-content: center;\n  align-items: center;\n  height: 60vh; /* Ajusta este valor si quieres m\u00E1s o menos espacio vertical */\n  width: 100%;\n}\n\n.tutorial-title {\n  text-align: center;\n}\n\n.rounded-input ion-input {\n  font-size: 14px; /* Tama\u00F1o de texto */\n  color: #333; /* Color del texto */\n}\n\n.rounded-input::part(native) {\n  background: transparent; /* Fondo transparente para evitar conflictos */\n}\n\n.p-info{\n  font-weight: bold;\n  color: #714e93\n}\n\n.custom-button {\n    --background: var(--purple-primary, #82298F) !important;\n    --background-hover: var(--purple-secondary, #2b0d30) !important;\n    --background-activated: var(--purple-secondary, #2b0d30) !important;\n    --color: #ffffff !important;\n    --border-radius: 20px !important;\n    --padding-top: 10px !important;\n    --padding-bottom: 10px !important;\n    --box-shadow: 0 2px 6px 0 rgba(0, 0, 0, 0.25) !important;\n    text-transform: none;\n\n      pointer-events: auto;\n\n  }\n  "] }]
     }], null, { openCamera: [{
             type: Input
         }] }); })();
-(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassDebugInfo(VideoSelfieComponent, { className: "VideoSelfieComponent", filePath: "src\\app\\pages\\slides\\video-selfie\\slide3.component.ts", lineNumber: 43 }); })();
+(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassDebugInfo(VideoSelfieComponent, { className: "VideoSelfieComponent" }); })();
 //# sourceMappingURL=slide3.component.js.map

package/dist/src/environments/environment.d.ts

@@ -1,3 +1,5 @@
 export declare const environment: {
     production: boolean;
+    url: string;
+    innova: string;
 };

package/dist/src/environments/environment.js

@@ -2,7 +2,9 @@
 // `ng build` replaces `environment.ts` with `environment.prod.ts`.
 // The list of file replacements can be found in `angular.json`.
 export const environment = {
-    production: false
+    production: false,
+    url: 'https://devgefectivov2.site/idvisionbeta/',
+    innova: `https://innova.genesisempresarial.com/metaGBEProd/validateFace/api/validate`
 };
 /*
  * For easier debugging in development mode, you can import the following file

package/dist/src/environments/environment.js.map

@@ -1 +1 @@
-{"version":3,"file":"environment.js","sourceRoot":"","sources":["../../../src/environments/environment.ts"],"names":[],"mappings":"AAAA,gFAAgF;AAChF,mEAAmE;AACnE,gEAAgE;AAEhE,MAAM,CAAC,MAAM,WAAW,GAAG;IACzB,UAAU,EAAE,KAAK;CAClB,CAAC;AAEF;;;;;;GAMG;AACH,sEAAsE"}
+{"version":3,"file":"environment.js","sourceRoot":"","sources":["../../../src/environments/environment.ts"],"names":[],"mappings":"AAAA,gFAAgF;AAChF,mEAAmE;AACnE,gEAAgE;AAEhE,MAAM,CAAC,MAAM,WAAW,GAAG;IACzB,UAAU,EAAE,KAAK;IACjB,GAAG,EAAE,2CAA2C;IAChD,MAAM,EAAE,6EAA6E;CACtF,CAAC;AAEF;;;;;;GAMG;AACH,sEAAsE"}