metag-sdk-ionic 1.2.6 → 1.2.7-beta-0.2

package/dist/assets/icons/dpi-error.svg

@@ -1,9 +1,9 @@
-<svg width="75" height="75" viewBox="0 0 75 75" fill="none" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
-<rect width="75" height="75" fill="url(#pattern0_111_67)"/>
-<defs>
-<pattern id="pattern0_111_67" patternContentUnits="objectBoundingBox" width="1" height="1">
-<use xlink:href="#image0_111_67" transform="scale(0.015625)"/>
-</pattern>
-<image id="image0_111_67" width="64" height="64" preserveAspectRatio="none" xlink:href="data:image/png;base64,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"/>
-</defs>
-</svg>
+<svg width="75" height="75" viewBox="0 0 75 75" fill="none" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
+<rect width="75" height="75" fill="url(#pattern0_111_67)"/>
+<defs>
+<pattern id="pattern0_111_67" patternContentUnits="objectBoundingBox" width="1" height="1">
+<use xlink:href="#image0_111_67" transform="scale(0.015625)"/>
+</pattern>
+<image id="image0_111_67" width="64" height="64" preserveAspectRatio="none" xlink:href="data:image/png;base64,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"/>
+</defs>
+</svg>

package/dist/assets/icons/video-error.svg

@@ -1,9 +1,9 @@
-<svg width="88" height="88" viewBox="0 0 88 88" fill="none" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
-<rect width="88" height="88" fill="url(#pattern0_111_106)"/>
-<defs>
-<pattern id="pattern0_111_106" patternContentUnits="objectBoundingBox" width="1" height="1">
-<use xlink:href="#image0_111_106" transform="scale(0.0104167)"/>
-</pattern>
-<image id="image0_111_106" width="96" height="96" preserveAspectRatio="none" xlink:href="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAGAAAABgCAYAAADimHc4AAAACXBIWXMAAA7DAAAOwwHHb6hkAAAAGXRFWHRTb2Z0d2FyZQB3d3cuaW5rc2NhcGUub3Jnm+48GgAABTZJREFUeJztnEtsVFUYgL//zFCtY4ephFoTH9UFRCMiRBIJQmIMdSG2QxNrYjRK4iMuJBISXRg0SnThyriUxLhwQzAdLEGxaPAZjUQUqA8S4wMxVp7T6pSGztzfhRSs9F5mtHP/2/Z8q+n8557z53w95z7mnCuqiscOZ53ATMcLMMYLMMYLMMYLMMYLMMYLMMYLMMYLMMYLMMYLMMYLMMYLMMYLMMYLMMYLMMYLMMYLMMYLMMYLMCZdU+lCbmUA3SIsBy4HMnXJqr4MA4cU+dwpb7CvuI1nNLBKRqpaFVHIzlPcJoQV9U8pdvZLwAN0FfdYNH5+Ab3NKzTQrUBzLBnZMCzQQb74XtwNRwsoZOepuM+Y3p0/xmFx5Rvo+PP3OBuNPAkrbhMzo/MBWgJNvxR3o+EjoJBbqUJfvOmYU5Z0uo1VR3+Nq8HQERBAd1xJJIg0lfK98TYYwulLzRmHqi6TWg96Vhw3ZpegshCoINrPV0O7q7m8DZ2CdGtuCGiqNZcpjzAgncXLqiq7pWkuDamHVHmUv++L/sm3IrqOzsF3oqqIOgnH3/nKLnEskXQmI44lKLsMcmhhi6Qiy/TkFgeF3KvakDqoyvOc2/kA16rKdgrN90dVFTUC4l63/pNcdOH1tA+UznzT15rR4ZF+oC3ORCQdzGXV0NFxX74is2iZvVpF1qK6rIbqTooLFtExdGCiYGKeBamwY1znA7QPlFSJHMJ1YVTP9kuhqYU3c09qy+zvFTbX2PkAjUHg1oYFa3sWVE9UJr4BEhmAmAdjJlOiJ7c4cDwikroPpfH/VCfQHhZLjoAEocMjO3EsrflqKJy2sEBipqCEsXSS6wv9R/cCjPECjPECjPECjPECjPECjPECjPECjPECjPECjPECjPECjPECjPECjPECjEmOANXWkEB1KxSmKIkRIMLt9LWOX+7e15qJ+jlvOpCknyTbtDSyTXpzT+Ay3xCUrtMKLyLxroiImyQJAOFWDdhNUBr7e9qTmClopuIFGJMkAUVRWS/qFkg6kxF1C0RlPVC0TqyeJOUccExcsOxfy/f6gX7pzW7XwH0CzDHKra4kYgSI6nNhayfpGDogyMaYU4qNRAjApQuR8bREx6cwyRBw6nj0xriTJwZiymSMTye5vtGwQDIENFxyaWS8sTnkMUV9kNGGdoGbFH0NYWQSqjwYFkiGgKC8OjJe1uj4ZJMqNZEvfuHyg2vkVOVKEZ4CDv3X6lRkR1gsEQJU5Gl6s/MnDPZm5yu6IdaExFXOfL7rjyN0Fl+Q3ODVonSjfFhjbcMuqLwc2lSCdsgURWUjSB+zGn9g9OQ1oO0qugHIxZiHyuHBC3hYQ+dtCs0LA9HHBO6ByL0DZUHXkB98PayA36R3LkckX2ypqmQhOwfnHjy9Se+qcTHVrwVZx+rizqgqogR8B0w8LUxv3pJ88Y7aDhGhZ/YiUrIQANV97B38spptqqF3wqp8JDLzBAh8XPtRqnSxBzj7xpV8dUeGnoSdY3PtiUx5ykgqdL6uB+FXQZ3Fd4EP4kvFHoUeOo/9EmebkZehkmINcDSqzDTiiAtGH4+70ej7gDuLP4q4LuB4POmYURInd9NV+i3uhs9/I9Z5/COp6M3A+3XPxoa9gtxCx4n4X4tAte+MG2Nr7rYAugWWA1cAF9crsTpSAvlZCXa7gC3sH3o7+S/t89SNRDwLmsl4AcZ4AcZ4AcZ4AcZ4AcZ4AcZ4AcZ4AcZ4AcZ4AcZ4AcZ4AcZ4AcZ4AcZ4AcZ4AcZ4AcZ4AcZ4Acb8BfxTgTMAqJiKAAAAAElFTkSuQmCC"/>
-</defs>
-</svg>
+<svg width="88" height="88" viewBox="0 0 88 88" fill="none" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
+<rect width="88" height="88" fill="url(#pattern0_111_106)"/>
+<defs>
+<pattern id="pattern0_111_106" patternContentUnits="objectBoundingBox" width="1" height="1">
+<use xlink:href="#image0_111_106" transform="scale(0.0104167)"/>
+</pattern>
+<image id="image0_111_106" width="96" height="96" preserveAspectRatio="none" xlink:href="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAGAAAABgCAYAAADimHc4AAAACXBIWXMAAA7DAAAOwwHHb6hkAAAAGXRFWHRTb2Z0d2FyZQB3d3cuaW5rc2NhcGUub3Jnm+48GgAABTZJREFUeJztnEtsVFUYgL//zFCtY4ephFoTH9UFRCMiRBIJQmIMdSG2QxNrYjRK4iMuJBISXRg0SnThyriUxLhwQzAdLEGxaPAZjUQUqA8S4wMxVp7T6pSGztzfhRSs9F5mtHP/2/Z8q+n8557z53w95z7mnCuqiscOZ53ATMcLMMYLMMYLMMYLMMYLMMYLMMYLMMYLMMYLMMYLMMYLMMYLMMYLMMYLMMYLMMYLMMYLMMYLMMYLMCZdU+lCbmUA3SIsBy4HMnXJqr4MA4cU+dwpb7CvuI1nNLBKRqpaFVHIzlPcJoQV9U8pdvZLwAN0FfdYNH5+Ab3NKzTQrUBzLBnZMCzQQb74XtwNRwsoZOepuM+Y3p0/xmFx5Rvo+PP3OBuNPAkrbhMzo/MBWgJNvxR3o+EjoJBbqUJfvOmYU5Z0uo1VR3+Nq8HQERBAd1xJJIg0lfK98TYYwulLzRmHqi6TWg96Vhw3ZpegshCoINrPV0O7q7m8DZ2CdGtuCGiqNZcpjzAgncXLqiq7pWkuDamHVHmUv++L/sm3IrqOzsF3oqqIOgnH3/nKLnEskXQmI44lKLsMcmhhi6Qiy/TkFgeF3KvakDqoyvOc2/kA16rKdgrN90dVFTUC4l63/pNcdOH1tA+UznzT15rR4ZF+oC3ORCQdzGXV0NFxX74is2iZvVpF1qK6rIbqTooLFtExdGCiYGKeBamwY1znA7QPlFSJHMJ1YVTP9kuhqYU3c09qy+zvFTbX2PkAjUHg1oYFa3sWVE9UJr4BEhmAmAdjJlOiJ7c4cDwikroPpfH/VCfQHhZLjoAEocMjO3EsrflqKJy2sEBipqCEsXSS6wv9R/cCjPECjPECjPECjPECjPECjPECjPECjPECjPECjPECjPECjPECjPECjPECjEmOANXWkEB1KxSmKIkRIMLt9LWOX+7e15qJ+jlvOpCknyTbtDSyTXpzT+Ay3xCUrtMKLyLxroiImyQJAOFWDdhNUBr7e9qTmClopuIFGJMkAUVRWS/qFkg6kxF1C0RlPVC0TqyeJOUccExcsOxfy/f6gX7pzW7XwH0CzDHKra4kYgSI6nNhayfpGDogyMaYU4qNRAjApQuR8bREx6cwyRBw6nj0xriTJwZiymSMTye5vtGwQDIENFxyaWS8sTnkMUV9kNGGdoGbFH0NYWQSqjwYFkiGgKC8OjJe1uj4ZJMqNZEvfuHyg2vkVOVKEZ4CDv3X6lRkR1gsEQJU5Gl6s/MnDPZm5yu6IdaExFXOfL7rjyN0Fl+Q3ODVonSjfFhjbcMuqLwc2lSCdsgURWUjSB+zGn9g9OQ1oO0qugHIxZiHyuHBC3hYQ+dtCs0LA9HHBO6ByL0DZUHXkB98PayA36R3LkckX2ypqmQhOwfnHjy9Se+qcTHVrwVZx+rizqgqogR8B0w8LUxv3pJ88Y7aDhGhZ/YiUrIQANV97B38spptqqF3wqp8JDLzBAh8XPtRqnSxBzj7xpV8dUeGnoSdY3PtiUx5ykgqdL6uB+FXQZ3Fd4EP4kvFHoUeOo/9EmebkZehkmINcDSqzDTiiAtGH4+70ej7gDuLP4q4LuB4POmYURInd9NV+i3uhs9/I9Z5/COp6M3A+3XPxoa9gtxCx4n4X4tAte+MG2Nr7rYAugWWA1cAF9crsTpSAvlZCXa7gC3sH3o7+S/t89SNRDwLmsl4AcZ4AcZ4AcZ4AcZ4AcZ4AcZ4AcZ4AcZ4AcZ4AcZ4AcZ4AcZ4AcZ4AcZ4AcZ4AcZ4AcZ4AcZ4Acb8BfxTgTMAqJiKAAAAAElFTkSuQmCC"/>
+</defs>
+</svg>

package/dist/assets/imagesIdVision/icons/dpi-error.svg

@@ -1,9 +1,9 @@
-<svg width="75" height="75" viewBox="0 0 75 75" fill="none" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
-<rect width="75" height="75" fill="url(#pattern0_111_67)"/>
-<defs>
-<pattern id="pattern0_111_67" patternContentUnits="objectBoundingBox" width="1" height="1">
-<use xlink:href="#image0_111_67" transform="scale(0.015625)"/>
-</pattern>
-<image id="image0_111_67" width="64" height="64" preserveAspectRatio="none" xlink:href="data:image/png;base64,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"/>
-</defs>
-</svg>
+<svg width="75" height="75" viewBox="0 0 75 75" fill="none" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
+<rect width="75" height="75" fill="url(#pattern0_111_67)"/>
+<defs>
+<pattern id="pattern0_111_67" patternContentUnits="objectBoundingBox" width="1" height="1">
+<use xlink:href="#image0_111_67" transform="scale(0.015625)"/>
+</pattern>
+<image id="image0_111_67" width="64" height="64" preserveAspectRatio="none" xlink:href="data:image/png;base64,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"/>
+</defs>
+</svg>

package/dist/assets/imagesIdVision/icons/video-error.svg

@@ -1,9 +1,9 @@
-<svg width="88" height="88" viewBox="0 0 88 88" fill="none" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
-<rect width="88" height="88" fill="url(#pattern0_111_106)"/>
-<defs>
-<pattern id="pattern0_111_106" patternContentUnits="objectBoundingBox" width="1" height="1">
-<use xlink:href="#image0_111_106" transform="scale(0.0104167)"/>
-</pattern>
-<image id="image0_111_106" width="96" height="96" preserveAspectRatio="none" xlink:href="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAGAAAABgCAYAAADimHc4AAAACXBIWXMAAA7DAAAOwwHHb6hkAAAAGXRFWHRTb2Z0d2FyZQB3d3cuaW5rc2NhcGUub3Jnm+48GgAABTZJREFUeJztnEtsVFUYgL//zFCtY4ephFoTH9UFRCMiRBIJQmIMdSG2QxNrYjRK4iMuJBISXRg0SnThyriUxLhwQzAdLEGxaPAZjUQUqA8S4wMxVp7T6pSGztzfhRSs9F5mtHP/2/Z8q+n8557z53w95z7mnCuqiscOZ53ATMcLMMYLMMYLMMYLMMYLMMYLMMYLMMYLMMYLMMYLMMYLMMYLMMYLMMYLMMYLMMYLMMYLMMYLMMYLMCZdU+lCbmUA3SIsBy4HMnXJqr4MA4cU+dwpb7CvuI1nNLBKRqpaFVHIzlPcJoQV9U8pdvZLwAN0FfdYNH5+Ab3NKzTQrUBzLBnZMCzQQb74XtwNRwsoZOepuM+Y3p0/xmFx5Rvo+PP3OBuNPAkrbhMzo/MBWgJNvxR3o+EjoJBbqUJfvOmYU5Z0uo1VR3+Nq8HQERBAd1xJJIg0lfK98TYYwulLzRmHqi6TWg96Vhw3ZpegshCoINrPV0O7q7m8DZ2CdGtuCGiqNZcpjzAgncXLqiq7pWkuDamHVHmUv++L/sm3IrqOzsF3oqqIOgnH3/nKLnEskXQmI44lKLsMcmhhi6Qiy/TkFgeF3KvakDqoyvOc2/kA16rKdgrN90dVFTUC4l63/pNcdOH1tA+UznzT15rR4ZF+oC3ORCQdzGXV0NFxX74is2iZvVpF1qK6rIbqTooLFtExdGCiYGKeBamwY1znA7QPlFSJHMJ1YVTP9kuhqYU3c09qy+zvFTbX2PkAjUHg1oYFa3sWVE9UJr4BEhmAmAdjJlOiJ7c4cDwikroPpfH/VCfQHhZLjoAEocMjO3EsrflqKJy2sEBipqCEsXSS6wv9R/cCjPECjPECjPECjPECjPECjPECjPECjPECjPECjPECjPECjPECjPECjPECjEmOANXWkEB1KxSmKIkRIMLt9LWOX+7e15qJ+jlvOpCknyTbtDSyTXpzT+Ay3xCUrtMKLyLxroiImyQJAOFWDdhNUBr7e9qTmClopuIFGJMkAUVRWS/qFkg6kxF1C0RlPVC0TqyeJOUccExcsOxfy/f6gX7pzW7XwH0CzDHKra4kYgSI6nNhayfpGDogyMaYU4qNRAjApQuR8bREx6cwyRBw6nj0xriTJwZiymSMTye5vtGwQDIENFxyaWS8sTnkMUV9kNGGdoGbFH0NYWQSqjwYFkiGgKC8OjJe1uj4ZJMqNZEvfuHyg2vkVOVKEZ4CDv3X6lRkR1gsEQJU5Gl6s/MnDPZm5yu6IdaExFXOfL7rjyN0Fl+Q3ODVonSjfFhjbcMuqLwc2lSCdsgURWUjSB+zGn9g9OQ1oO0qugHIxZiHyuHBC3hYQ+dtCs0LA9HHBO6ByL0DZUHXkB98PayA36R3LkckX2ypqmQhOwfnHjy9Se+qcTHVrwVZx+rizqgqogR8B0w8LUxv3pJ88Y7aDhGhZ/YiUrIQANV97B38spptqqF3wqp8JDLzBAh8XPtRqnSxBzj7xpV8dUeGnoSdY3PtiUx5ykgqdL6uB+FXQZ3Fd4EP4kvFHoUeOo/9EmebkZehkmINcDSqzDTiiAtGH4+70ej7gDuLP4q4LuB4POmYURInd9NV+i3uhs9/I9Z5/COp6M3A+3XPxoa9gtxCx4n4X4tAte+MG2Nr7rYAugWWA1cAF9crsTpSAvlZCXa7gC3sH3o7+S/t89SNRDwLmsl4AcZ4AcZ4AcZ4AcZ4AcZ4AcZ4AcZ4AcZ4AcZ4AcZ4AcZ4AcZ4AcZ4AcZ4AcZ4AcZ4AcZ4AcZ4Acb8BfxTgTMAqJiKAAAAAElFTkSuQmCC"/>
-</defs>
-</svg>
+<svg width="88" height="88" viewBox="0 0 88 88" fill="none" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
+<rect width="88" height="88" fill="url(#pattern0_111_106)"/>
+<defs>
+<pattern id="pattern0_111_106" patternContentUnits="objectBoundingBox" width="1" height="1">
+<use xlink:href="#image0_111_106" transform="scale(0.0104167)"/>
+</pattern>
+<image id="image0_111_106" width="96" height="96" preserveAspectRatio="none" xlink:href="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAGAAAABgCAYAAADimHc4AAAACXBIWXMAAA7DAAAOwwHHb6hkAAAAGXRFWHRTb2Z0d2FyZQB3d3cuaW5rc2NhcGUub3Jnm+48GgAABTZJREFUeJztnEtsVFUYgL//zFCtY4ephFoTH9UFRCMiRBIJQmIMdSG2QxNrYjRK4iMuJBISXRg0SnThyriUxLhwQzAdLEGxaPAZjUQUqA8S4wMxVp7T6pSGztzfhRSs9F5mtHP/2/Z8q+n8557z53w95z7mnCuqiscOZ53ATMcLMMYLMMYLMMYLMMYLMMYLMMYLMMYLMMYLMMYLMMYLMMYLMMYLMMYLMMYLMMYLMMYLMMYLMMYLMCZdU+lCbmUA3SIsBy4HMnXJqr4MA4cU+dwpb7CvuI1nNLBKRqpaFVHIzlPcJoQV9U8pdvZLwAN0FfdYNH5+Ab3NKzTQrUBzLBnZMCzQQb74XtwNRwsoZOepuM+Y3p0/xmFx5Rvo+PP3OBuNPAkrbhMzo/MBWgJNvxR3o+EjoJBbqUJfvOmYU5Z0uo1VR3+Nq8HQERBAd1xJJIg0lfK98TYYwulLzRmHqi6TWg96Vhw3ZpegshCoINrPV0O7q7m8DZ2CdGtuCGiqNZcpjzAgncXLqiq7pWkuDamHVHmUv++L/sm3IrqOzsF3oqqIOgnH3/nKLnEskXQmI44lKLsMcmhhi6Qiy/TkFgeF3KvakDqoyvOc2/kA16rKdgrN90dVFTUC4l63/pNcdOH1tA+UznzT15rR4ZF+oC3ORCQdzGXV0NFxX74is2iZvVpF1qK6rIbqTooLFtExdGCiYGKeBamwY1znA7QPlFSJHMJ1YVTP9kuhqYU3c09qy+zvFTbX2PkAjUHg1oYFa3sWVE9UJr4BEhmAmAdjJlOiJ7c4cDwikroPpfH/VCfQHhZLjoAEocMjO3EsrflqKJy2sEBipqCEsXSS6wv9R/cCjPECjPECjPECjPECjPECjPECjPECjPECjPECjPECjPECjPECjPECjPECjEmOANXWkEB1KxSmKIkRIMLt9LWOX+7e15qJ+jlvOpCknyTbtDSyTXpzT+Ay3xCUrtMKLyLxroiImyQJAOFWDdhNUBr7e9qTmClopuIFGJMkAUVRWS/qFkg6kxF1C0RlPVC0TqyeJOUccExcsOxfy/f6gX7pzW7XwH0CzDHKra4kYgSI6nNhayfpGDogyMaYU4qNRAjApQuR8bREx6cwyRBw6nj0xriTJwZiymSMTye5vtGwQDIENFxyaWS8sTnkMUV9kNGGdoGbFH0NYWQSqjwYFkiGgKC8OjJe1uj4ZJMqNZEvfuHyg2vkVOVKEZ4CDv3X6lRkR1gsEQJU5Gl6s/MnDPZm5yu6IdaExFXOfL7rjyN0Fl+Q3ODVonSjfFhjbcMuqLwc2lSCdsgURWUjSB+zGn9g9OQ1oO0qugHIxZiHyuHBC3hYQ+dtCs0LA9HHBO6ByL0DZUHXkB98PayA36R3LkckX2ypqmQhOwfnHjy9Se+qcTHVrwVZx+rizqgqogR8B0w8LUxv3pJ88Y7aDhGhZ/YiUrIQANV97B38spptqqF3wqp8JDLzBAh8XPtRqnSxBzj7xpV8dUeGnoSdY3PtiUx5ykgqdL6uB+FXQZ3Fd4EP4kvFHoUeOo/9EmebkZehkmINcDSqzDTiiAtGH4+70ej7gDuLP4q4LuB4POmYURInd9NV+i3uhs9/I9Z5/COp6M3A+3XPxoa9gtxCx4n4X4tAte+MG2Nr7rYAugWWA1cAF9crsTpSAvlZCXa7gC3sH3o7+S/t89SNRDwLmsl4AcZ4AcZ4AcZ4AcZ4AcZ4AcZ4AcZ4AcZ4AcZ4AcZ4AcZ4AcZ4AcZ4AcZ4AcZ4AcZ4AcZ4AcZ4Acb8BfxTgTMAqJiKAAAAAElFTkSuQmCC"/>
+</defs>
+</svg>

package/dist/assets/imagesIdVision/no-internet.svg

@@ -1,4 +1,4 @@
-<svg width="139" height="148" viewBox="0 0 139 148" fill="none" xmlns="http://www.w3.org/2000/svg">
-    <path d="M69.4986 18.6125C47.6437 18.6125 27.0935 27.6852 11.6268 44.1626L2.17627 54.242L14.0593 66.9129L23.5099 56.832C35.7969 43.7417 52.1294 36.5329 69.4986 36.5329C86.8664 36.5329 103.208 43.7324 115.486 56.832L117.902 59.422C121.571 60.2468 125.065 61.5788 128.355 63.2731L136.819 54.242L127.369 44.1626C111.902 27.6852 91.3607 18.6125 69.4986 18.6125ZM69.4986 54.4532C56.6136 54.4532 44.4989 59.7904 35.3929 69.5029L25.9424 79.5824L37.8254 92.2533L47.276 82.1724C53.2095 75.8469 61.1079 72.3735 69.4986 72.3735C71.5344 72.3735 73.5368 72.6001 75.4973 73.0025C80.3522 67.7516 86.3118 63.7078 92.9679 61.2072C85.8499 56.9337 77.8878 54.4532 69.4986 54.4532ZM107.366 76.2755C91.1001 76.2755 77.9124 90.3154 77.9124 107.636C77.9124 124.955 91.1001 138.995 107.366 138.995C123.633 138.995 136.819 124.955 136.819 107.636C136.819 90.3154 123.633 76.2755 107.366 76.2755ZM103.158 89.7157H111.574V107.636H103.158V89.7157ZM64.8305 91.168C62.7687 91.9111 60.8097 93.0874 59.159 94.8433L49.7085 104.923L63.581 119.729C62.6644 115.858 62.1186 111.811 62.1186 107.636C62.1186 101.847 63.1046 96.3202 64.8305 91.168ZM103.158 116.596H111.574V125.556H103.158V116.596Z" fill="#FCB332"/>
-    </svg>
+<svg width="139" height="148" viewBox="0 0 139 148" fill="none" xmlns="http://www.w3.org/2000/svg">
+    <path d="M69.4986 18.6125C47.6437 18.6125 27.0935 27.6852 11.6268 44.1626L2.17627 54.242L14.0593 66.9129L23.5099 56.832C35.7969 43.7417 52.1294 36.5329 69.4986 36.5329C86.8664 36.5329 103.208 43.7324 115.486 56.832L117.902 59.422C121.571 60.2468 125.065 61.5788 128.355 63.2731L136.819 54.242L127.369 44.1626C111.902 27.6852 91.3607 18.6125 69.4986 18.6125ZM69.4986 54.4532C56.6136 54.4532 44.4989 59.7904 35.3929 69.5029L25.9424 79.5824L37.8254 92.2533L47.276 82.1724C53.2095 75.8469 61.1079 72.3735 69.4986 72.3735C71.5344 72.3735 73.5368 72.6001 75.4973 73.0025C80.3522 67.7516 86.3118 63.7078 92.9679 61.2072C85.8499 56.9337 77.8878 54.4532 69.4986 54.4532ZM107.366 76.2755C91.1001 76.2755 77.9124 90.3154 77.9124 107.636C77.9124 124.955 91.1001 138.995 107.366 138.995C123.633 138.995 136.819 124.955 136.819 107.636C136.819 90.3154 123.633 76.2755 107.366 76.2755ZM103.158 89.7157H111.574V107.636H103.158V89.7157ZM64.8305 91.168C62.7687 91.9111 60.8097 93.0874 59.159 94.8433L49.7085 104.923L63.581 119.729C62.6644 115.858 62.1186 111.811 62.1186 107.636C62.1186 101.847 63.1046 96.3202 64.8305 91.168ZM103.158 116.596H111.574V125.556H103.158V116.596Z" fill="#FCB332"/>
+    </svg>
     

package/dist/assets/imagesIdVision/shapes.svg

@@ -1 +1 @@
-<svg width="350" height="140" xmlns="http://www.w3.org/2000/svg" style="background:#f6f7f9"><g fill="none" fill-rule="evenodd"><path fill="#F04141" style="mix-blend-mode:multiply" d="M61.905-34.23l96.194 54.51-66.982 54.512L22 34.887z"/><circle fill="#10DC60" style="mix-blend-mode:multiply" cx="155.5" cy="135.5" r="57.5"/><path fill="#3880FF" style="mix-blend-mode:multiply" d="M208.538 9.513l84.417 15.392L223.93 93.93z"/><path fill="#FFCE00" style="mix-blend-mode:multiply" d="M268.625 106.557l46.332-26.75 46.332 26.75v53.5l-46.332 26.75-46.332-26.75z"/><circle fill="#7044FF" style="mix-blend-mode:multiply" cx="299.5" cy="9.5" r="38.5"/><rect fill="#11D3EA" style="mix-blend-mode:multiply" transform="rotate(-60 148.47 37.886)" x="143.372" y="-7.056" width="10.196" height="89.884" rx="5.098"/><path d="M-25.389 74.253l84.86 8.107c5.498.525 9.53 5.407 9.004 10.905a10 10 0 0 1-.057.477l-12.36 85.671a10.002 10.002 0 0 1-11.634 8.42l-86.351-15.226c-5.44-.959-9.07-6.145-8.112-11.584l13.851-78.551a10 10 0 0 1 10.799-8.219z" fill="#7044FF" style="mix-blend-mode:multiply"/><circle fill="#0CD1E8" style="mix-blend-mode:multiply" cx="273.5" cy="106.5" r="20.5"/></g></svg>
+<svg width="350" height="140" xmlns="http://www.w3.org/2000/svg" style="background:#f6f7f9"><g fill="none" fill-rule="evenodd"><path fill="#F04141" style="mix-blend-mode:multiply" d="M61.905-34.23l96.194 54.51-66.982 54.512L22 34.887z"/><circle fill="#10DC60" style="mix-blend-mode:multiply" cx="155.5" cy="135.5" r="57.5"/><path fill="#3880FF" style="mix-blend-mode:multiply" d="M208.538 9.513l84.417 15.392L223.93 93.93z"/><path fill="#FFCE00" style="mix-blend-mode:multiply" d="M268.625 106.557l46.332-26.75 46.332 26.75v53.5l-46.332 26.75-46.332-26.75z"/><circle fill="#7044FF" style="mix-blend-mode:multiply" cx="299.5" cy="9.5" r="38.5"/><rect fill="#11D3EA" style="mix-blend-mode:multiply" transform="rotate(-60 148.47 37.886)" x="143.372" y="-7.056" width="10.196" height="89.884" rx="5.098"/><path d="M-25.389 74.253l84.86 8.107c5.498.525 9.53 5.407 9.004 10.905a10 10 0 0 1-.057.477l-12.36 85.671a10.002 10.002 0 0 1-11.634 8.42l-86.351-15.226c-5.44-.959-9.07-6.145-8.112-11.584l13.851-78.551a10 10 0 0 1 10.799-8.219z" fill="#7044FF" style="mix-blend-mode:multiply"/><circle fill="#0CD1E8" style="mix-blend-mode:multiply" cx="273.5" cy="106.5" r="20.5"/></g></svg>

package/dist/assets/shapes.svg

@@ -1 +1 @@
-<svg width="350" height="140" xmlns="http://www.w3.org/2000/svg" style="background:#f6f7f9"><g fill="none" fill-rule="evenodd"><path fill="#F04141" style="mix-blend-mode:multiply" d="M61.905-34.23l96.194 54.51-66.982 54.512L22 34.887z"/><circle fill="#10DC60" style="mix-blend-mode:multiply" cx="155.5" cy="135.5" r="57.5"/><path fill="#3880FF" style="mix-blend-mode:multiply" d="M208.538 9.513l84.417 15.392L223.93 93.93z"/><path fill="#FFCE00" style="mix-blend-mode:multiply" d="M268.625 106.557l46.332-26.75 46.332 26.75v53.5l-46.332 26.75-46.332-26.75z"/><circle fill="#7044FF" style="mix-blend-mode:multiply" cx="299.5" cy="9.5" r="38.5"/><rect fill="#11D3EA" style="mix-blend-mode:multiply" transform="rotate(-60 148.47 37.886)" x="143.372" y="-7.056" width="10.196" height="89.884" rx="5.098"/><path d="M-25.389 74.253l84.86 8.107c5.498.525 9.53 5.407 9.004 10.905a10 10 0 0 1-.057.477l-12.36 85.671a10.002 10.002 0 0 1-11.634 8.42l-86.351-15.226c-5.44-.959-9.07-6.145-8.112-11.584l13.851-78.551a10 10 0 0 1 10.799-8.219z" fill="#7044FF" style="mix-blend-mode:multiply"/><circle fill="#0CD1E8" style="mix-blend-mode:multiply" cx="273.5" cy="106.5" r="20.5"/></g></svg>
+<svg width="350" height="140" xmlns="http://www.w3.org/2000/svg" style="background:#f6f7f9"><g fill="none" fill-rule="evenodd"><path fill="#F04141" style="mix-blend-mode:multiply" d="M61.905-34.23l96.194 54.51-66.982 54.512L22 34.887z"/><circle fill="#10DC60" style="mix-blend-mode:multiply" cx="155.5" cy="135.5" r="57.5"/><path fill="#3880FF" style="mix-blend-mode:multiply" d="M208.538 9.513l84.417 15.392L223.93 93.93z"/><path fill="#FFCE00" style="mix-blend-mode:multiply" d="M268.625 106.557l46.332-26.75 46.332 26.75v53.5l-46.332 26.75-46.332-26.75z"/><circle fill="#7044FF" style="mix-blend-mode:multiply" cx="299.5" cy="9.5" r="38.5"/><rect fill="#11D3EA" style="mix-blend-mode:multiply" transform="rotate(-60 148.47 37.886)" x="143.372" y="-7.056" width="10.196" height="89.884" rx="5.098"/><path d="M-25.389 74.253l84.86 8.107c5.498.525 9.53 5.407 9.004 10.905a10 10 0 0 1-.057.477l-12.36 85.671a10.002 10.002 0 0 1-11.634 8.42l-86.351-15.226c-5.44-.959-9.07-6.145-8.112-11.584l13.851-78.551a10 10 0 0 1 10.799-8.219z" fill="#7044FF" style="mix-blend-mode:multiply"/><circle fill="#0CD1E8" style="mix-blend-mode:multiply" cx="273.5" cy="106.5" r="20.5"/></g></svg>

package/dist/src/app/app.component.js

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

package/dist/src/app/components/custom-button/custom-button.component.js

@@ -32,11 +32,11 @@ export class CustomButtonComponent {
             i0.ɵɵproperty("ngIf", ctx.showIcon && ctx.icon);
             i0.ɵɵadvance();
             i0.ɵɵtextInterpolate1(" ", ctx.texto, "\n");
-        } }, dependencies: [i1.NgIf, i2.IonButton, i2.IonIcon], styles: [".camera-container[_ngcontent-%COMP%] {\n    position: relative;\n    width: 100%;\n    height: 100vh;\n    display: flex;\n    justify-content: center;\n    align-items: center;\n    background-color: black;\n  }\n  \n  .overlay-image[_ngcontent-%COMP%] {\n    position: absolute;\n    top: 50%;\n    left: 50%;\n    transform: translate(-50%, -50%);\n    width: 90%;\n    max-width: 400px;\n    opacity: 0.6;\n  }\n  \n  .overlay-text[_ngcontent-%COMP%] {\n    position: absolute;\n    top: 10%;\n    left: 50%;\n    transform: translateX(-50%);\n    color: white;\n    text-align: center;\n  }\n  \n  .close-button[_ngcontent-%COMP%] {\n    position: absolute;\n    top: 20px;\n    right: 20px;\n    color: white;\n  }\n  \n  .capture-button[_ngcontent-%COMP%] {\n    position: absolute;\n    bottom: 40px;\n    background-color: #ffcc00;\n    color: white;\n    font-size: 24px;\n    border-radius: 50%;\n    width: 70px;\n    height: 70px;\n  }"] }); }
+        } }, dependencies: [i1.NgIf, i2.IonButton, i2.IonIcon], styles: [".camera-container[_ngcontent-%COMP%] {\r\n    position: relative;\r\n    width: 100%;\r\n    height: 100vh;\r\n    display: flex;\r\n    justify-content: center;\r\n    align-items: center;\r\n    background-color: black;\r\n  }\r\n  \r\n  .overlay-image[_ngcontent-%COMP%] {\r\n    position: absolute;\r\n    top: 50%;\r\n    left: 50%;\r\n    transform: translate(-50%, -50%);\r\n    width: 90%;\r\n    max-width: 400px;\r\n    opacity: 0.6;\r\n  }\r\n  \r\n  .overlay-text[_ngcontent-%COMP%] {\r\n    position: absolute;\r\n    top: 10%;\r\n    left: 50%;\r\n    transform: translateX(-50%);\r\n    color: white;\r\n    text-align: center;\r\n  }\r\n  \r\n  .close-button[_ngcontent-%COMP%] {\r\n    position: absolute;\r\n    top: 20px;\r\n    right: 20px;\r\n    color: white;\r\n  }\r\n  \r\n  .capture-button[_ngcontent-%COMP%] {\r\n    position: absolute;\r\n    bottom: 40px;\r\n    background-color: #ffcc00;\r\n    color: white;\r\n    font-size: 24px;\r\n    border-radius: 50%;\r\n    width: 70px;\r\n    height: 70px;\r\n  }"] }); }
 }
 (() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(CustomButtonComponent, [{
         type: Component,
-        args: [{ selector: 'app-custom-button', template: "<ion-button expand=\"block\"\n[disabled]=\"disabled\"\n(click)=\"onClick()\">\n<ion-icon *ngIf=\"showIcon && icon\" [name]=\"icon\" slot=\"start\"></ion-icon>\n  {{texto}}\n</ion-button>\n\n", styles: [".camera-container {\n    position: relative;\n    width: 100%;\n    height: 100vh;\n    display: flex;\n    justify-content: center;\n    align-items: center;\n    background-color: black;\n  }\n  \n  .overlay-image {\n    position: absolute;\n    top: 50%;\n    left: 50%;\n    transform: translate(-50%, -50%);\n    width: 90%;\n    max-width: 400px;\n    opacity: 0.6;\n  }\n  \n  .overlay-text {\n    position: absolute;\n    top: 10%;\n    left: 50%;\n    transform: translateX(-50%);\n    color: white;\n    text-align: center;\n  }\n  \n  .close-button {\n    position: absolute;\n    top: 20px;\n    right: 20px;\n    color: white;\n  }\n  \n  .capture-button {\n    position: absolute;\n    bottom: 40px;\n    background-color: #ffcc00;\n    color: white;\n    font-size: 24px;\n    border-radius: 50%;\n    width: 70px;\n    height: 70px;\n  }\n  "] }]
+        args: [{ selector: 'app-custom-button', template: "<ion-button expand=\"block\"\r\n[disabled]=\"disabled\"\r\n(click)=\"onClick()\">\r\n<ion-icon *ngIf=\"showIcon && icon\" [name]=\"icon\" slot=\"start\"></ion-icon>\r\n  {{texto}}\r\n</ion-button>\r\n\r\n", styles: [".camera-container {\r\n    position: relative;\r\n    width: 100%;\r\n    height: 100vh;\r\n    display: flex;\r\n    justify-content: center;\r\n    align-items: center;\r\n    background-color: black;\r\n  }\r\n  \r\n  .overlay-image {\r\n    position: absolute;\r\n    top: 50%;\r\n    left: 50%;\r\n    transform: translate(-50%, -50%);\r\n    width: 90%;\r\n    max-width: 400px;\r\n    opacity: 0.6;\r\n  }\r\n  \r\n  .overlay-text {\r\n    position: absolute;\r\n    top: 10%;\r\n    left: 50%;\r\n    transform: translateX(-50%);\r\n    color: white;\r\n    text-align: center;\r\n  }\r\n  \r\n  .close-button {\r\n    position: absolute;\r\n    top: 20px;\r\n    right: 20px;\r\n    color: white;\r\n  }\r\n  \r\n  .capture-button {\r\n    position: absolute;\r\n    bottom: 40px;\r\n    background-color: #ffcc00;\r\n    color: white;\r\n    font-size: 24px;\r\n    border-radius: 50%;\r\n    width: 70px;\r\n    height: 70px;\r\n  }\r\n  "] }]
     }], () => [], { texto: [{
             type: Input
         }], disabled: [{
@@ -48,5 +48,5 @@ export class CustomButtonComponent {
         }], showIcon: [{
             type: Input
         }] }); })();
-(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassDebugInfo(CustomButtonComponent, { className: "CustomButtonComponent" }); })();
+(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassDebugInfo(CustomButtonComponent, { className: "CustomButtonComponent", filePath: "src\\app\\components\\custom-button\\custom-button.component.ts", lineNumber: 8 }); })();
 //# sourceMappingURL=custom-button.component.js.map

package/dist/src/app/home/home.page.js

@@ -23,11 +23,11 @@ export class HomePage {
             i0.ɵɵproperty("translucent", true);
             i0.ɵɵadvance(4);
             i0.ɵɵproperty("fullscreen", true);
-        } }, dependencies: [i1.IonContent, i1.IonHeader, i1.IonTitle, i1.IonToolbar], styles: ["#container[_ngcontent-%COMP%] {\n  text-align: center;\n\n  position: absolute;\n  left: 0;\n  right: 0;\n  top: 50%;\n  transform: translateY(-50%);\n}\n\n#container[_ngcontent-%COMP%]   strong[_ngcontent-%COMP%] {\n  font-size: 20px;\n  line-height: 26px;\n}\n\n#container[_ngcontent-%COMP%]   p[_ngcontent-%COMP%] {\n  font-size: 16px;\n  line-height: 22px;\n\n  color: #8c8c8c;\n\n  margin: 0;\n}\n\n#container[_ngcontent-%COMP%]   a[_ngcontent-%COMP%] {\n  text-decoration: none;\n}"] }); }
+        } }, dependencies: [i1.IonContent, i1.IonHeader, i1.IonTitle, i1.IonToolbar], styles: ["#container[_ngcontent-%COMP%] {\r\n  text-align: center;\r\n\r\n  position: absolute;\r\n  left: 0;\r\n  right: 0;\r\n  top: 50%;\r\n  transform: translateY(-50%);\r\n}\r\n\r\n#container[_ngcontent-%COMP%]   strong[_ngcontent-%COMP%] {\r\n  font-size: 20px;\r\n  line-height: 26px;\r\n}\r\n\r\n#container[_ngcontent-%COMP%]   p[_ngcontent-%COMP%] {\r\n  font-size: 16px;\r\n  line-height: 22px;\r\n\r\n  color: #8c8c8c;\r\n\r\n  margin: 0;\r\n}\r\n\r\n#container[_ngcontent-%COMP%]   a[_ngcontent-%COMP%] {\r\n  text-decoration: none;\r\n}"] }); }
 }
 (() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(HomePage, [{
         type: Component,
-        args: [{ selector: 'app-home', template: "<ion-header [translucent]=\"true\">\n  <ion-toolbar>\n    <ion-title>\n      Blank\n    </ion-title>\n  </ion-toolbar>\n</ion-header>\n\n<ion-content [fullscreen]=\"true\">\n  <ion-header collapse=\"condense\">\n    <ion-toolbar>\n      <ion-title size=\"large\">Blank</ion-title>\n    </ion-toolbar>\n  </ion-header>\n\n  <div id=\"container\">\n    <strong>Ready to create an app?</strong>\n    <p>Start with Ionic <a target=\"_blank\" rel=\"noopener noreferrer\" href=\"https://ionicframework.com/docs/components\">UI Components</a></p>\n  </div>\n</ion-content>\n", styles: ["#container {\n  text-align: center;\n\n  position: absolute;\n  left: 0;\n  right: 0;\n  top: 50%;\n  transform: translateY(-50%);\n}\n\n#container strong {\n  font-size: 20px;\n  line-height: 26px;\n}\n\n#container p {\n  font-size: 16px;\n  line-height: 22px;\n\n  color: #8c8c8c;\n\n  margin: 0;\n}\n\n#container a {\n  text-decoration: none;\n}"] }]
+        args: [{ selector: 'app-home', template: "<ion-header [translucent]=\"true\">\r\n  <ion-toolbar>\r\n    <ion-title>\r\n      Blank\r\n    </ion-title>\r\n  </ion-toolbar>\r\n</ion-header>\r\n\r\n<ion-content [fullscreen]=\"true\">\r\n  <ion-header collapse=\"condense\">\r\n    <ion-toolbar>\r\n      <ion-title size=\"large\">Blank</ion-title>\r\n    </ion-toolbar>\r\n  </ion-header>\r\n\r\n  <div id=\"container\">\r\n    <strong>Ready to create an app?</strong>\r\n    <p>Start with Ionic <a target=\"_blank\" rel=\"noopener noreferrer\" href=\"https://ionicframework.com/docs/components\">UI Components</a></p>\r\n  </div>\r\n</ion-content>\r\n", styles: ["#container {\r\n  text-align: center;\r\n\r\n  position: absolute;\r\n  left: 0;\r\n  right: 0;\r\n  top: 50%;\r\n  transform: translateY(-50%);\r\n}\r\n\r\n#container strong {\r\n  font-size: 20px;\r\n  line-height: 26px;\r\n}\r\n\r\n#container p {\r\n  font-size: 16px;\r\n  line-height: 22px;\r\n\r\n  color: #8c8c8c;\r\n\r\n  margin: 0;\r\n}\r\n\r\n#container a {\r\n  text-decoration: none;\r\n}"] }]
     }], () => [], null); })();
-(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassDebugInfo(HomePage, { className: "HomePage" }); })();
+(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassDebugInfo(HomePage, { className: "HomePage", filePath: "src\\app\\home\\home.page.ts", lineNumber: 8 }); })();
 //# sourceMappingURL=home.page.js.map

package/dist/src/app/pages/id-vision/components/camara-acuerdo-video/camara-acuerdo.video.component.js

@@ -228,16 +228,16 @@ export class CamaraAcuerdoVideoComponent {
             i0.ɵɵproperty("disabled", ctx.isRecording && ctx.timeRemaining > 5);
             i0.ɵɵadvance();
             i0.ɵɵtextInterpolate1(" ", ctx.isRecording ? "Detener Grabaci\u00F3n" : "Iniciar Grabaci\u00F3n", " ");
-        } }, dependencies: [i3.NgIf, i1.IonButton, i1.IonContent, i1.IonIcon], styles: [".video-container[_ngcontent-%COMP%] {\n    position: relative;\n    width: 100%;\n    height: 100%;\n    background: black;\n  \n    video {\n      width: 100%;\n      height: 100%;\n      object-fit: cover;\n    }\n  \n    .overlay {\n      position: absolute;\n      top: 0;\n      left: 0;\n      width: 100%;\n      height: 100%;\n      display: flex;\n      flex-direction: column;\n      justify-content: space-between;\n      align-items: center;\n      background: rgba(0, 0, 0, 0.5);\n  \n      .overlay-text {\n        display: flex;\n        align-items: center; \n        justify-content: center; \n        margin-top: 20px;\n        color: white;\n        font-size: 14px;\n        // text-align: center;\n        gap: 8px;\n  \n        ion-icon {\n            padding-top: 4px;\n          color: red;\n          font-size: 12px;\n        //   margin-left: 5px;\n        }\n      }\n      \n      .instruction-text-1 {\n        color: red;\n        font-size: 14px;\n        text-align: center;\n      }\n  \n      .instruction-text {\n        color: black;\n        text-align: center;\n        padding: 0px 15px;\n      }\n  \n      .button-container {\n        background-color: white;\n        bottom: 20px;\n        padding: 10px;\n        \n        // ion-button {\n        //   width: 100%;\n        // }\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            --background: var(--purple-primary)\n            --background-hover: var(--purple-secondary);\n            --background-activated: var(--purple-secondary);\n            --background-focused: var(--purple-secondary);\n          \n            --color: var(--purple-primary);\n          \n            --border-radius: 20px;\n            --border-color: var(--purple-primary);\n            --border-style: solid;\n            --border-width: 1px;\n          \n            --box-shadow: 0 2px 6px 0 rgb(0, 0, 0, 0.25);\n          \n            --ripple-color: var(--purple-secondary);\n          \n        \n            &:hover {\n              background-color: #ffb300;\n            }\n        \n            &:active {\n              background-color: #e6a800;\n            }\n          }\n      }\n    }\n  }\n  \n  .countdown-overlay[_ngcontent-%COMP%] {\n    position: fixed;\n    top: 0;\n    left: 0;\n    width: 100%;\n    height: 100%;\n    background-color: rgba(0, 0, 0, 0.6);\n    display: flex;\n    align-items: center;\n    justify-content: center;\n    z-index: 1000;\n  \n    .countdown {\n      font-size: 100px;\n      font-weight: bold;\n      color: white;\n    }\n  }\n\n.recording-timer[_ngcontent-%COMP%] {\n    color: red;\n    text-align: center;\n    padding: 0;\n    font-size: 13px;\n}\n.close-button[_ngcontent-%COMP%] {\n    position: absolute;\n    top: 10px;\n    right: 10px;\n    border-radius: 50%;\n    padding: 10px;\n    display: flex;\n    align-items: center;\n    justify-content: center;\n    cursor: pointer;\n  \n    ion-icon {\n      color: white;\n      font-size: 18px;\n    }\n  \n    &:hover {\n      background: rgba(0, 0, 0, 0.7);\n    }\n  }\n\n  video[_ngcontent-%COMP%] {\n    transform: scaleX(-1);\n  }"] }); }
+        } }, dependencies: [i3.NgIf, i1.IonButton, i1.IonContent, i1.IonIcon], styles: [".video-container[_ngcontent-%COMP%] {\r\n    position: relative;\r\n    width: 100%;\r\n    height: 100%;\r\n    background: black;\r\n  \r\n    video {\r\n      width: 100%;\r\n      height: 100%;\r\n      object-fit: cover;\r\n    }\r\n  \r\n    .overlay {\r\n      position: absolute;\r\n      top: 0;\r\n      left: 0;\r\n      width: 100%;\r\n      height: 100%;\r\n      display: flex;\r\n      flex-direction: column;\r\n      justify-content: space-between;\r\n      align-items: center;\r\n      background: rgba(0, 0, 0, 0.5);\r\n  \r\n      .overlay-text {\r\n        display: flex;\r\n        align-items: center; \r\n        justify-content: center; \r\n        margin-top: 20px;\r\n        color: white;\r\n        font-size: 14px;\r\n        // text-align: center;\r\n        gap: 8px;\r\n  \r\n        ion-icon {\r\n            padding-top: 4px;\r\n          color: red;\r\n          font-size: 12px;\r\n        //   margin-left: 5px;\r\n        }\r\n      }\r\n      \r\n      .instruction-text-1 {\r\n        color: red;\r\n        font-size: 14px;\r\n        text-align: center;\r\n      }\r\n  \r\n      .instruction-text {\r\n        color: black;\r\n        text-align: center;\r\n        padding: 0px 15px;\r\n      }\r\n  \r\n      .button-container {\r\n        background-color: white;\r\n        bottom: 20px;\r\n        padding: 10px;\r\n        \r\n        // ion-button {\r\n        //   width: 100%;\r\n        // }\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            --background: var(--purple-primary)\r\n            --background-hover: var(--purple-secondary);\r\n            --background-activated: var(--purple-secondary);\r\n            --background-focused: var(--purple-secondary);\r\n          \r\n            --color: var(--purple-primary);\r\n          \r\n            --border-radius: 20px;\r\n            --border-color: var(--purple-primary);\r\n            --border-style: solid;\r\n            --border-width: 1px;\r\n          \r\n            --box-shadow: 0 2px 6px 0 rgb(0, 0, 0, 0.25);\r\n          \r\n            --ripple-color: var(--purple-secondary);\r\n          \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  }\r\n  \r\n  .countdown-overlay[_ngcontent-%COMP%] {\r\n    position: fixed;\r\n    top: 0;\r\n    left: 0;\r\n    width: 100%;\r\n    height: 100%;\r\n    background-color: rgba(0, 0, 0, 0.6);\r\n    display: flex;\r\n    align-items: center;\r\n    justify-content: center;\r\n    z-index: 1000;\r\n  \r\n    .countdown {\r\n      font-size: 100px;\r\n      font-weight: bold;\r\n      color: white;\r\n    }\r\n  }\r\n\r\n.recording-timer[_ngcontent-%COMP%] {\r\n    color: red;\r\n    text-align: center;\r\n    padding: 0;\r\n    font-size: 13px;\r\n}\r\n.close-button[_ngcontent-%COMP%] {\r\n    position: absolute;\r\n    top: 10px;\r\n    right: 10px;\r\n    border-radius: 50%;\r\n    padding: 10px;\r\n    display: flex;\r\n    align-items: center;\r\n    justify-content: center;\r\n    cursor: pointer;\r\n  \r\n    ion-icon {\r\n      color: white;\r\n      font-size: 18px;\r\n    }\r\n  \r\n    &:hover {\r\n      background: rgba(0, 0, 0, 0.7);\r\n    }\r\n  }\r\n\r\n  video[_ngcontent-%COMP%] {\r\n    transform: scaleX(-1);\r\n  }"] }); }
 }
 (() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(CamaraAcuerdoVideoComponent, [{
         type: Component,
-        args: [{ selector: 'app-acuerdo-video', template: "<ion-content class=\"video-container\">\n    <div *ngIf=\"countdown > 0\" class=\"countdown-overlay\">\n      <div class=\"countdown\">{{ countdown }}</div>\n    </div>\n  \n    <video #videoElement autoplay muted playsinline></video>\n  \n    <div class=\"overlay\">\n      <div class=\"overlay-text\">\n        <p *ngIf=\"!isRecording\">Toca 'Inicia la grabaci\u00F3n' cuando est\u00E9s listo</p>\n        <p *ngIf=\"isRecording\" class=\"recording-text\">\n          Grabando...\n        </p>\n        <div *ngIf=\"isRecording\" class=\"icon-text\"><ion-icon size=\"small\" name=\"radio-button-on-outline\"></ion-icon></div>\n      </div>\n\n      <div class=\"close-button\">\n        <ion-icon name=\"close-outline\" (click)=\"closeOverlayVideo()\"></ion-icon>\n      </div>\n  \n  \n      <div class=\"button-container\">\n        <p class=\"instruction-text-1\">Repite el siguiente texto</p>\n        <p class=\"recording-timer\" *ngIf=\"isRecording\">00:{{ timeRemaining < 10 ? '0' + timeRemaining : timeRemaining }}</p>\n        <p class=\"instruction-text\">Acepto los t\u00E9rminos y condiciones del cr\u00E9dito que estoy solicitando en Fundaci\u00F3n G\u00E9nesis Empresarial</p>\n  \n        <ion-button expand=\"block\" \n        (click)=\"isRecording ? stopRecording() : recordVideo()\" \n        [disabled]=\"isRecording && timeRemaining > 5\">\n        {{ isRecording ? 'Detener Grabaci\u00F3n' : 'Iniciar Grabaci\u00F3n' }}\n      </ion-button>\n      \n      </div>\n    </div>\n  </ion-content>\n  ", styles: [".video-container {\n    position: relative;\n    width: 100%;\n    height: 100%;\n    background: black;\n  \n    video {\n      width: 100%;\n      height: 100%;\n      object-fit: cover;\n    }\n  \n    .overlay {\n      position: absolute;\n      top: 0;\n      left: 0;\n      width: 100%;\n      height: 100%;\n      display: flex;\n      flex-direction: column;\n      justify-content: space-between;\n      align-items: center;\n      background: rgba(0, 0, 0, 0.5);\n  \n      .overlay-text {\n        display: flex;\n        align-items: center; \n        justify-content: center; \n        margin-top: 20px;\n        color: white;\n        font-size: 14px;\n        // text-align: center;\n        gap: 8px;\n  \n        ion-icon {\n            padding-top: 4px;\n          color: red;\n          font-size: 12px;\n        //   margin-left: 5px;\n        }\n      }\n      \n      .instruction-text-1 {\n        color: red;\n        font-size: 14px;\n        text-align: center;\n      }\n  \n      .instruction-text {\n        color: black;\n        text-align: center;\n        padding: 0px 15px;\n      }\n  \n      .button-container {\n        background-color: white;\n        bottom: 20px;\n        padding: 10px;\n        \n        // ion-button {\n        //   width: 100%;\n        // }\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            --background: var(--purple-primary)\n            --background-hover: var(--purple-secondary);\n            --background-activated: var(--purple-secondary);\n            --background-focused: var(--purple-secondary);\n          \n            --color: var(--purple-primary);\n          \n            --border-radius: 20px;\n            --border-color: var(--purple-primary);\n            --border-style: solid;\n            --border-width: 1px;\n          \n            --box-shadow: 0 2px 6px 0 rgb(0, 0, 0, 0.25);\n          \n            --ripple-color: var(--purple-secondary);\n          \n        \n            &:hover {\n              background-color: #ffb300;\n            }\n        \n            &:active {\n              background-color: #e6a800;\n            }\n          }\n      }\n    }\n  }\n  \n  .countdown-overlay {\n    position: fixed;\n    top: 0;\n    left: 0;\n    width: 100%;\n    height: 100%;\n    background-color: rgba(0, 0, 0, 0.6);\n    display: flex;\n    align-items: center;\n    justify-content: center;\n    z-index: 1000;\n  \n    .countdown {\n      font-size: 100px;\n      font-weight: bold;\n      color: white;\n    }\n  }\n\n.recording-timer {\n    color: red;\n    text-align: center;\n    padding: 0;\n    font-size: 13px;\n}\n.close-button {\n    position: absolute;\n    top: 10px;\n    right: 10px;\n    border-radius: 50%;\n    padding: 10px;\n    display: flex;\n    align-items: center;\n    justify-content: center;\n    cursor: pointer;\n  \n    ion-icon {\n      color: white;\n      font-size: 18px;\n    }\n  \n    &:hover {\n      background: rgba(0, 0, 0, 0.7);\n    }\n  }\n\n  video {\n    transform: scaleX(-1);\n  }"] }]
+        args: [{ selector: 'app-acuerdo-video', template: "<ion-content class=\"video-container\">\r\n    <div *ngIf=\"countdown > 0\" class=\"countdown-overlay\">\r\n      <div class=\"countdown\">{{ countdown }}</div>\r\n    </div>\r\n  \r\n    <video #videoElement autoplay muted playsinline></video>\r\n  \r\n    <div class=\"overlay\">\r\n      <div class=\"overlay-text\">\r\n        <p *ngIf=\"!isRecording\">Toca 'Inicia la grabaci\u00F3n' cuando est\u00E9s listo</p>\r\n        <p *ngIf=\"isRecording\" class=\"recording-text\">\r\n          Grabando...\r\n        </p>\r\n        <div *ngIf=\"isRecording\" class=\"icon-text\"><ion-icon size=\"small\" name=\"radio-button-on-outline\"></ion-icon></div>\r\n      </div>\r\n\r\n      <div class=\"close-button\">\r\n        <ion-icon name=\"close-outline\" (click)=\"closeOverlayVideo()\"></ion-icon>\r\n      </div>\r\n  \r\n  \r\n      <div class=\"button-container\">\r\n        <p class=\"instruction-text-1\">Repite el siguiente texto</p>\r\n        <p class=\"recording-timer\" *ngIf=\"isRecording\">00:{{ timeRemaining < 10 ? '0' + timeRemaining : timeRemaining }}</p>\r\n        <p class=\"instruction-text\">Acepto los t\u00E9rminos y condiciones del cr\u00E9dito que estoy solicitando en Fundaci\u00F3n G\u00E9nesis Empresarial</p>\r\n  \r\n        <ion-button expand=\"block\" \r\n        (click)=\"isRecording ? stopRecording() : recordVideo()\" \r\n        [disabled]=\"isRecording && timeRemaining > 5\">\r\n        {{ isRecording ? 'Detener Grabaci\u00F3n' : 'Iniciar Grabaci\u00F3n' }}\r\n      </ion-button>\r\n      \r\n      </div>\r\n    </div>\r\n  </ion-content>\r\n  ", styles: [".video-container {\r\n    position: relative;\r\n    width: 100%;\r\n    height: 100%;\r\n    background: black;\r\n  \r\n    video {\r\n      width: 100%;\r\n      height: 100%;\r\n      object-fit: cover;\r\n    }\r\n  \r\n    .overlay {\r\n      position: absolute;\r\n      top: 0;\r\n      left: 0;\r\n      width: 100%;\r\n      height: 100%;\r\n      display: flex;\r\n      flex-direction: column;\r\n      justify-content: space-between;\r\n      align-items: center;\r\n      background: rgba(0, 0, 0, 0.5);\r\n  \r\n      .overlay-text {\r\n        display: flex;\r\n        align-items: center; \r\n        justify-content: center; \r\n        margin-top: 20px;\r\n        color: white;\r\n        font-size: 14px;\r\n        // text-align: center;\r\n        gap: 8px;\r\n  \r\n        ion-icon {\r\n            padding-top: 4px;\r\n          color: red;\r\n          font-size: 12px;\r\n        //   margin-left: 5px;\r\n        }\r\n      }\r\n      \r\n      .instruction-text-1 {\r\n        color: red;\r\n        font-size: 14px;\r\n        text-align: center;\r\n      }\r\n  \r\n      .instruction-text {\r\n        color: black;\r\n        text-align: center;\r\n        padding: 0px 15px;\r\n      }\r\n  \r\n      .button-container {\r\n        background-color: white;\r\n        bottom: 20px;\r\n        padding: 10px;\r\n        \r\n        // ion-button {\r\n        //   width: 100%;\r\n        // }\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            --background: var(--purple-primary)\r\n            --background-hover: var(--purple-secondary);\r\n            --background-activated: var(--purple-secondary);\r\n            --background-focused: var(--purple-secondary);\r\n          \r\n            --color: var(--purple-primary);\r\n          \r\n            --border-radius: 20px;\r\n            --border-color: var(--purple-primary);\r\n            --border-style: solid;\r\n            --border-width: 1px;\r\n          \r\n            --box-shadow: 0 2px 6px 0 rgb(0, 0, 0, 0.25);\r\n          \r\n            --ripple-color: var(--purple-secondary);\r\n          \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  }\r\n  \r\n  .countdown-overlay {\r\n    position: fixed;\r\n    top: 0;\r\n    left: 0;\r\n    width: 100%;\r\n    height: 100%;\r\n    background-color: rgba(0, 0, 0, 0.6);\r\n    display: flex;\r\n    align-items: center;\r\n    justify-content: center;\r\n    z-index: 1000;\r\n  \r\n    .countdown {\r\n      font-size: 100px;\r\n      font-weight: bold;\r\n      color: white;\r\n    }\r\n  }\r\n\r\n.recording-timer {\r\n    color: red;\r\n    text-align: center;\r\n    padding: 0;\r\n    font-size: 13px;\r\n}\r\n.close-button {\r\n    position: absolute;\r\n    top: 10px;\r\n    right: 10px;\r\n    border-radius: 50%;\r\n    padding: 10px;\r\n    display: flex;\r\n    align-items: center;\r\n    justify-content: center;\r\n    cursor: pointer;\r\n  \r\n    ion-icon {\r\n      color: white;\r\n      font-size: 18px;\r\n    }\r\n  \r\n    &:hover {\r\n      background: rgba(0, 0, 0, 0.7);\r\n    }\r\n  }\r\n\r\n  video {\r\n    transform: scaleX(-1);\r\n  }"] }]
     }], () => [{ type: i1.Platform }, { type: i0.ChangeDetectorRef }, { type: i2.ModalDpiServices }, { type: i1.ModalController }], { videoElement: [{
             type: ViewChild,
             args: ['videoElement', { static: false }]
         }], backFunction: [{
             type: Input
         }] }); })();
-(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassDebugInfo(CamaraAcuerdoVideoComponent, { className: "CamaraAcuerdoVideoComponent" }); })();
+(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassDebugInfo(CamaraAcuerdoVideoComponent, { className: "CamaraAcuerdoVideoComponent", filePath: "src\\app\\pages\\id-vision\\components\\camara-acuerdo-video\\camara-acuerdo.video.component.ts", lineNumber: 10 }); })();
 //# sourceMappingURL=camara-acuerdo.video.component.js.map

package/dist/src/app/pages/id-vision/components/camara-video-selfie/camara-video-selfie.component.js

@@ -305,11 +305,11 @@ export class CamaraVideoSelfieComponent {
             i0.ɵɵproperty("ngIf", !ctx.isRecording);
             i0.ɵɵadvance();
             i0.ɵɵproperty("ngIf", ctx.isRecording);
-        } }, dependencies: [i5.NgClass, i5.NgIf, i1.IonButton, i1.IonButtons, i1.IonContent, i1.IonHeader, i1.IonIcon, i1.IonLabel, i1.IonSpinner, i1.IonToolbar], styles: [".camera-container[_ngcontent-%COMP%] {\n  justify-content: center;\n  align-items: center;\n  position: relative;\n  display: flex;\n  flex-direction: column;\n  align-items: center;\n  justify-content: center;\n  height: 70%;\n  background-color: #fff;\n}\n\n.video-wrapper[_ngcontent-%COMP%] {\n  position: relative;\n  width: 300px;\n  height: 300px;\n  border-radius: 50%;\n  overflow: hidden;\n}\n\nvideo[_ngcontent-%COMP%] {\n  width: 100%;\n  height: 100%;\n  object-fit: cover;\n  border-radius: 50%;\n}\n\n.progress-ring[_ngcontent-%COMP%] {\n  position: absolute;\n  top: 0;\n  left: 0;\n  transform: rotate(-90deg);\n  \n\n}\n\n.progress-ring__circle[_ngcontent-%COMP%] {\n  fill: transparent;\n  stroke: purple;\n  stroke-width: 12;\n  stroke-dasharray: 945;\n  \n\n  stroke-dashoffset: 880;\n  \n\n  transition: stroke-dashoffset 12s linear;\n  \n\n}\n\n.progress-active[_ngcontent-%COMP%]   .progress-ring__circle[_ngcontent-%COMP%] {\n  animation: _ngcontent-%COMP%_progress-animation 5s linear forwards;\n}\n\n@keyframes _ngcontent-%COMP%_progress-animation {\n  from {\n    stroke-dashoffset: 880;\n  }\n\n  to {\n    stroke-dashoffset: 0;\n  }\n}\n\n.text-container[_ngcontent-%COMP%] {\n  height: 40px;\n  color: black;\n}\n\nion-header[_ngcontent-%COMP%] {\n  --background: #fff;\n  \n\n}\n\n.centered-title[_ngcontent-%COMP%] {\n  text-align: center;\n  width: 100%;\n  \n\n  font-weight: bold;\n}\n\n.fixed-footer[_ngcontent-%COMP%] {\n  position: fixed;\n  bottom: 40px;\n  left: 0;\n  width: 100%;\n  padding: 10px;\n  background-color: #fff; // Color de fondo, opcional\n  // box-shadow: 0 -2px 10px rgba(0, 0, 0, 0.1);\n\n\n  ion-button {\n    width: 90%;\n    max-width: 300px;\n    margin: 0 auto;\n    color: #fff;\n    font-weight: bold;\n    border-radius: 20px;\n\n    --background: #82298F;\n    --background-hover: #82298F;\n    --background-activated: #82298F;\n    --background-focused: #82298F;\n\n    --color: #fff;\n\n    --border-radius: 20px;\n    --border-color: #82298F;\n    ;\n    --border-style: solid;\n    --border-width: 1px;\n\n    --box-shadow: 0 2px 6px 0 rgb(0, 0, 0, 0.25);\n\n    --ripple-color: #82298F;\n\n\n    &:hover {\n      background-color: #82298F;\n    }\n\n    &:active {\n      background-color: #82298F;\n    }\n  }\n}\n\n\n\n\n\nion-header[_ngcontent-%COMP%] {\n  --background: #fff;\n  \n\n  color: #000000;\n  \n\n}\n\nion-toolbar[_ngcontent-%COMP%] {\n  --ion-background-color: #fff !important;\n  --background: #ffffff !important;\n  --color: #000000 !important;\n}\n\n.centered-title[_ngcontent-%COMP%] {\n  flex: 1;\n  text-align: center;\n  \n\n  font-weight: bold;\n  color: #000000;\n  margin: 0;\n  \n\n}\n\nion-buttons[_ngcontent-%COMP%] {\n  justify-content: flex-end;\n  \n\n}\n\n.countdown-overlay[_ngcontent-%COMP%] {\n  position: fixed;\n  top: 0;\n  left: 0;\n  width: 100%;\n  height: 100%;\n  background-color: rgba(0, 0, 0, 0.6);\n  \n\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  margin: 0;\n  padding: 0;\n  z-index: 1000;\n  \n\n  animation: _ngcontent-%COMP%_fadeIn 0.5s ease-out, _ngcontent-%COMP%_fadeOut 0.5s ease-out 2.5s;\n  \n\n  box-sizing: border-box;\n  border-radius: 0px;\n\n}\n\nion-content.custom-content[_ngcontent-%COMP%] {\n  --padding-top: 0;\n  --padding-bottom: 0;\n  margin: 0;\n  padding: 0;\n}\n\n.countdown[_ngcontent-%COMP%] {\n  font-size: 100px;\n  font-weight: bold;\n  color: #fff;\n  animation: _ngcontent-%COMP%_scaleUp 0.5s ease-out, _ngcontent-%COMP%_scaleDown 0.5s ease-out 2.5s;\n  \n\n}\n\n\n\n@keyframes _ngcontent-%COMP%_fadeIn {\n  from {\n    opacity: 0;\n  }\n\n  to {\n    opacity: 1;\n  }\n}\n\n@keyframes _ngcontent-%COMP%_fadeOut {\n  from {\n    opacity: 1;\n  }\n\n  to {\n    opacity: 0;\n  }\n}\n\n\n\n@keyframes _ngcontent-%COMP%_scaleUp {\n  from {\n    transform: scale(0.8);\n    opacity: 0;\n  }\n\n  to {\n    transform: scale(1);\n    opacity: 1;\n  }\n}\n\n@keyframes _ngcontent-%COMP%_scaleDown {\n  from {\n    transform: scale(1);\n    opacity: 1;\n  }\n\n  to {\n    transform: scale(0.8);\n    opacity: 0;\n  }\n}\n\n.red[_ngcontent-%COMP%] {\n  padding: 10px;\n  color: red;\n}\n\n.text-center[_ngcontent-%COMP%] {\n  text-align: center;\n  padding-left: 20%;\n  padding-right: 20%;\n  color: #333;\n}\n\n.loading-overlay[_ngcontent-%COMP%] {\n  position: fixed;\n  top: 0;\n  left: 0;\n  width: 100%;\n  height: 100%;\n  background-color: rgba(0, 0, 0, 0.8);\n  \n\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  z-index: 1000;\n  \n\n  margin: 0;\n  padding: 0;\n  box-sizing: border-box;\n  border-radius: 0px;\n}\n\nion-spinner[_ngcontent-%COMP%] {\n  color: #fff;\n  width: 50px;\n  height: 50px;\n}"] }); }
+        } }, dependencies: [i5.NgClass, i5.NgIf, i1.IonButton, i1.IonButtons, i1.IonContent, i1.IonHeader, i1.IonIcon, i1.IonLabel, i1.IonSpinner, i1.IonToolbar], styles: [".camera-container[_ngcontent-%COMP%] {\r\n  justify-content: center;\r\n  align-items: center;\r\n  position: relative;\r\n  display: flex;\r\n  flex-direction: column;\r\n  align-items: center;\r\n  justify-content: center;\r\n  height: 70%;\r\n  background-color: #fff;\r\n}\r\n\r\n.video-wrapper[_ngcontent-%COMP%] {\r\n  position: relative;\r\n  width: 300px;\r\n  height: 300px;\r\n  border-radius: 50%;\r\n  overflow: hidden;\r\n}\r\n\r\nvideo[_ngcontent-%COMP%] {\r\n  width: 100%;\r\n  height: 100%;\r\n  object-fit: cover;\r\n  border-radius: 50%;\r\n}\r\n\r\n.progress-ring[_ngcontent-%COMP%] {\r\n  position: absolute;\r\n  top: 0;\r\n  left: 0;\r\n  transform: rotate(-90deg);\r\n  \n\r\n}\r\n\r\n.progress-ring__circle[_ngcontent-%COMP%] {\r\n  fill: transparent;\r\n  stroke: purple;\r\n  stroke-width: 12;\r\n  stroke-dasharray: 945;\r\n  \n\r\n  stroke-dashoffset: 880;\r\n  \n\r\n  transition: stroke-dashoffset 12s linear;\r\n  \n\r\n}\r\n\r\n.progress-active[_ngcontent-%COMP%]   .progress-ring__circle[_ngcontent-%COMP%] {\r\n  animation: _ngcontent-%COMP%_progress-animation 5s linear forwards;\r\n}\r\n\r\n@keyframes _ngcontent-%COMP%_progress-animation {\r\n  from {\r\n    stroke-dashoffset: 880;\r\n  }\r\n\r\n  to {\r\n    stroke-dashoffset: 0;\r\n  }\r\n}\r\n\r\n.text-container[_ngcontent-%COMP%] {\r\n  height: 40px;\r\n  color: black;\r\n}\r\n\r\nion-header[_ngcontent-%COMP%] {\r\n  --background: #fff;\r\n  \n\r\n}\r\n\r\n.centered-title[_ngcontent-%COMP%] {\r\n  text-align: center;\r\n  width: 100%;\r\n  \n\r\n  font-weight: bold;\r\n}\r\n\r\n.fixed-footer[_ngcontent-%COMP%] {\r\n  position: fixed;\r\n  bottom: 40px;\r\n  left: 0;\r\n  width: 100%;\r\n  padding: 10px;\r\n  background-color: #fff; // Color de fondo, opcional\r\n  // box-shadow: 0 -2px 10px rgba(0, 0, 0, 0.1);\r\n\r\n\r\n  ion-button {\r\n    width: 90%;\r\n    max-width: 300px;\r\n    margin: 0 auto;\r\n    color: #fff;\r\n    font-weight: bold;\r\n    border-radius: 20px;\r\n\r\n    --background: #82298F;\r\n    --background-hover: #82298F;\r\n    --background-activated: #82298F;\r\n    --background-focused: #82298F;\r\n\r\n    --color: #fff;\r\n\r\n    --border-radius: 20px;\r\n    --border-color: #82298F;\r\n    ;\r\n    --border-style: solid;\r\n    --border-width: 1px;\r\n\r\n    --box-shadow: 0 2px 6px 0 rgb(0, 0, 0, 0.25);\r\n\r\n    --ripple-color: #82298F;\r\n\r\n\r\n    &:hover {\r\n      background-color: #82298F;\r\n    }\r\n\r\n    &:active {\r\n      background-color: #82298F;\r\n    }\r\n  }\r\n}\r\n\r\n\r\n\r\n\r\n\r\nion-header[_ngcontent-%COMP%] {\r\n  --background: #fff;\r\n  \n\r\n  color: #000000;\r\n  \n\r\n}\r\n\r\nion-toolbar[_ngcontent-%COMP%] {\r\n  --ion-background-color: #fff !important;\r\n  --background: #ffffff !important;\r\n  --color: #000000 !important;\r\n}\r\n\r\n.centered-title[_ngcontent-%COMP%] {\r\n  flex: 1;\r\n  text-align: center;\r\n  \n\r\n  font-weight: bold;\r\n  color: #000000;\r\n  margin: 0;\r\n  \n\r\n}\r\n\r\nion-buttons[_ngcontent-%COMP%] {\r\n  justify-content: flex-end;\r\n  \n\r\n}\r\n\r\n.countdown-overlay[_ngcontent-%COMP%] {\r\n  position: fixed;\r\n  top: 0;\r\n  left: 0;\r\n  width: 100%;\r\n  height: 100%;\r\n  background-color: rgba(0, 0, 0, 0.6);\r\n  \n\r\n  display: flex;\r\n  align-items: center;\r\n  justify-content: center;\r\n  margin: 0;\r\n  padding: 0;\r\n  z-index: 1000;\r\n  \n\r\n  animation: _ngcontent-%COMP%_fadeIn 0.5s ease-out, _ngcontent-%COMP%_fadeOut 0.5s ease-out 2.5s;\r\n  \n\r\n  box-sizing: border-box;\r\n  border-radius: 0px;\r\n\r\n}\r\n\r\nion-content.custom-content[_ngcontent-%COMP%] {\r\n  --padding-top: 0;\r\n  --padding-bottom: 0;\r\n  margin: 0;\r\n  padding: 0;\r\n}\r\n\r\n.countdown[_ngcontent-%COMP%] {\r\n  font-size: 100px;\r\n  font-weight: bold;\r\n  color: #fff;\r\n  animation: _ngcontent-%COMP%_scaleUp 0.5s ease-out, _ngcontent-%COMP%_scaleDown 0.5s ease-out 2.5s;\r\n  \n\r\n}\r\n\r\n\n\r\n@keyframes _ngcontent-%COMP%_fadeIn {\r\n  from {\r\n    opacity: 0;\r\n  }\r\n\r\n  to {\r\n    opacity: 1;\r\n  }\r\n}\r\n\r\n@keyframes _ngcontent-%COMP%_fadeOut {\r\n  from {\r\n    opacity: 1;\r\n  }\r\n\r\n  to {\r\n    opacity: 0;\r\n  }\r\n}\r\n\r\n\n\r\n@keyframes _ngcontent-%COMP%_scaleUp {\r\n  from {\r\n    transform: scale(0.8);\r\n    opacity: 0;\r\n  }\r\n\r\n  to {\r\n    transform: scale(1);\r\n    opacity: 1;\r\n  }\r\n}\r\n\r\n@keyframes _ngcontent-%COMP%_scaleDown {\r\n  from {\r\n    transform: scale(1);\r\n    opacity: 1;\r\n  }\r\n\r\n  to {\r\n    transform: scale(0.8);\r\n    opacity: 0;\r\n  }\r\n}\r\n\r\n.red[_ngcontent-%COMP%] {\r\n  padding: 10px;\r\n  color: red;\r\n}\r\n\r\n.text-center[_ngcontent-%COMP%] {\r\n  text-align: center;\r\n  padding-left: 20%;\r\n  padding-right: 20%;\r\n  color: #333;\r\n}\r\n\r\n.loading-overlay[_ngcontent-%COMP%] {\r\n  position: fixed;\r\n  top: 0;\r\n  left: 0;\r\n  width: 100%;\r\n  height: 100%;\r\n  background-color: rgba(0, 0, 0, 0.8);\r\n  \n\r\n  display: flex;\r\n  align-items: center;\r\n  justify-content: center;\r\n  z-index: 1000;\r\n  \n\r\n  margin: 0;\r\n  padding: 0;\r\n  box-sizing: border-box;\r\n  border-radius: 0px;\r\n}\r\n\r\nion-spinner[_ngcontent-%COMP%] {\r\n  color: #fff;\r\n  width: 50px;\r\n  height: 50px;\r\n}"] }); }
 }
 (() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(CamaraVideoSelfieComponent, [{
         type: Component,
-        args: [{ selector: 'app-camara-video-selfie', encapsulation: ViewEncapsulation.Emulated, template: "<ion-content color=\"light\" class=\"custom-content\">\n  <div *ngIf=\"isLoading\" class=\"loading-overlay\">\n    <ion-spinner name=\"crescent\"></ion-spinner>\n  </div> \n  <div *ngIf=\"countdown > 0\" class=\"countdown-overlay\">\n    <div class=\"countdown\">{{ countdown }}</div>\n  </div>\n  <ion-header class=\"ion-no-border\">\n    <ion-toolbar color=\"light\">\n      <!-- <ion-title class=\"centered-title\">Video Selfie</ion-title> -->\n      <ion-buttons slot=\"end\">\n        <ion-button (click)=\"closeOverlayVideo()\" [disabled]=\"!canStopRecording\">\n          <ion-icon name=\"close\" color=\"dark\"></ion-icon>\n        </ion-button>\n      </ion-buttons>\n    </ion-toolbar>\n  </ion-header>\n  <!-- Contenedor de la c\u00E1mara y progresi\u00F3n -->\n  <div class=\"camera-container\">\n    <div class=\"video-wrapper\">\n      <video #videoElement muted autoplay playsinline style=\"transform: scaleX(-1)\"></video>\n      <svg class=\"progress-ring\" #progressRing width=\"300\" height=\"300\">\n        <circle class=\"progress-ring__circle\" cx=\"150\" cy=\"150\" r=\"150\" />\n      </svg>\n    </div>\n    <ion-label [ngClass]=\"{'red': isRecording}\">00:{{ timeRemaining < 10 ? '0' + timeRemaining : timeRemaining\n        }}</ion-label>\n        <p class=\"text-center\">Permanece quieto, con tu rostro en el centro del c\u00EDrculo.</p>\n        <!-- Botones de grabaci\u00F3n -->\n        <div class=\"fixed-footer\">\n          <ion-button class=\"button-grabar\" *ngIf=\"!isRecording\" expand=\"block\" (click)=\"recordVideo()\">Iniciar Grabaci\u00F3n</ion-button>\n          <ion-button *ngIf=\"isRecording\" expand=\"block\" (click)=\"stopRecording()\" [disabled]=\"!canStopRecording\">Detener\n            Grabaci\u00F3n</ion-button>\n        </div>\n  </div>\n</ion-content>", styles: [".camera-container {\n  justify-content: center;\n  align-items: center;\n  position: relative;\n  display: flex;\n  flex-direction: column;\n  align-items: center;\n  justify-content: center;\n  height: 70%;\n  background-color: #fff;\n}\n\n.video-wrapper {\n  position: relative;\n  width: 300px;\n  height: 300px;\n  border-radius: 50%;\n  overflow: hidden;\n}\n\nvideo {\n  width: 100%;\n  height: 100%;\n  object-fit: cover;\n  border-radius: 50%;\n}\n\n.progress-ring {\n  position: absolute;\n  top: 0;\n  left: 0;\n  transform: rotate(-90deg);\n  /* Rotamos el c\u00EDrculo para que la animaci\u00F3n inicie desde arriba */\n}\n\n.progress-ring__circle {\n  fill: transparent;\n  stroke: purple;\n  stroke-width: 12;\n  stroke-dasharray: 945;\n  /* La circunferencia del c\u00EDrculo  880*/\n  stroke-dashoffset: 880;\n  /* Oculto por completo al inicio */\n  transition: stroke-dashoffset 12s linear;\n  /* Esto controlar\u00E1 el llenado progresivo */\n}\n\n.progress-active .progress-ring__circle {\n  animation: progress-animation 5s linear forwards;\n}\n\n@keyframes progress-animation {\n  from {\n    stroke-dashoffset: 880;\n  }\n\n  to {\n    stroke-dashoffset: 0;\n  }\n}\n\n.text-container {\n  height: 40px;\n  color: black;\n}\n\nion-header {\n  --background: #fff;\n  /* Fondo blanco para el header */\n}\n\n.centered-title {\n  text-align: center;\n  width: 100%;\n  /* Asegura que el t\u00EDtulo est\u00E9 centrado */\n  font-weight: bold;\n}\n\n.fixed-footer {\n  position: fixed;\n  bottom: 40px;\n  left: 0;\n  width: 100%;\n  padding: 10px;\n  background-color: #fff; // Color de fondo, opcional\n  // box-shadow: 0 -2px 10px rgba(0, 0, 0, 0.1);\n\n\n  ion-button {\n    width: 90%;\n    max-width: 300px;\n    margin: 0 auto;\n    color: #fff;\n    font-weight: bold;\n    border-radius: 20px;\n\n    --background: #82298F;\n    --background-hover: #82298F;\n    --background-activated: #82298F;\n    --background-focused: #82298F;\n\n    --color: #fff;\n\n    --border-radius: 20px;\n    --border-color: #82298F;\n    ;\n    --border-style: solid;\n    --border-width: 1px;\n\n    --box-shadow: 0 2px 6px 0 rgb(0, 0, 0, 0.25);\n\n    --ripple-color: #82298F;\n\n\n    &:hover {\n      background-color: #82298F;\n    }\n\n    &:active {\n      background-color: #82298F;\n    }\n  }\n}\n\n\n\n\n\nion-header {\n  --background: #fff;\n  /* Fondo blanco */\n  color: #000000;\n  /* Texto negro */\n}\n\nion-toolbar {\n  --ion-background-color: #fff !important;\n  --background: #ffffff !important;\n  --color: #000000 !important;\n}\n\n.centered-title {\n  flex: 1;\n  text-align: center;\n  /* Centrar el t\u00EDtulo */\n  font-weight: bold;\n  color: #000000;\n  margin: 0;\n  /* Quita cualquier margen del t\u00EDtulo */\n}\n\nion-buttons {\n  justify-content: flex-end;\n  /* Alinea el bot\u00F3n a la derecha */\n}\n\n.countdown-overlay {\n  position: fixed;\n  top: 0;\n  left: 0;\n  width: 100%;\n  height: 100%;\n  background-color: rgba(0, 0, 0, 0.6);\n  /* Fondo semi-transparente */\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  margin: 0;\n  padding: 0;\n  z-index: 1000;\n  /* Asegurarse de que est\u00E9 encima de otros elementos */\n  animation: fadeIn 0.5s ease-out, fadeOut 0.5s ease-out 2.5s;\n  /* Animaciones de entrada y salida */\n  box-sizing: border-box;\n  border-radius: 0px;\n\n}\n\nion-content.custom-content {\n  --padding-top: 0;\n  --padding-bottom: 0;\n  margin: 0;\n  padding: 0;\n}\n\n.countdown {\n  font-size: 100px;\n  font-weight: bold;\n  color: #fff;\n  animation: scaleUp 0.5s ease-out, scaleDown 0.5s ease-out 2.5s;\n  /* Escalar en entrada y salida */\n}\n\n/* Animaci\u00F3n para desvanecer la superposici\u00F3n */\n@keyframes fadeIn {\n  from {\n    opacity: 0;\n  }\n\n  to {\n    opacity: 1;\n  }\n}\n\n@keyframes fadeOut {\n  from {\n    opacity: 1;\n  }\n\n  to {\n    opacity: 0;\n  }\n}\n\n/* Animaci\u00F3n para escalar el n\u00FAmero */\n@keyframes scaleUp {\n  from {\n    transform: scale(0.8);\n    opacity: 0;\n  }\n\n  to {\n    transform: scale(1);\n    opacity: 1;\n  }\n}\n\n@keyframes scaleDown {\n  from {\n    transform: scale(1);\n    opacity: 1;\n  }\n\n  to {\n    transform: scale(0.8);\n    opacity: 0;\n  }\n}\n\n.red {\n  padding: 10px;\n  color: red;\n}\n\n.text-center {\n  text-align: center;\n  padding-left: 20%;\n  padding-right: 20%;\n  color: #333;\n}\n\n.loading-overlay {\n  position: fixed;\n  top: 0;\n  left: 0;\n  width: 100%;\n  height: 100%;\n  background-color: rgba(0, 0, 0, 0.8);\n  /* Fondo oscuro semi-transparente */\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  z-index: 1000;\n  /* Aseg\u00FArate de que est\u00E9 por encima del contenido */\n  margin: 0;\n  padding: 0;\n  box-sizing: border-box;\n  border-radius: 0px;\n}\n\nion-spinner {\n  color: #fff;\n  width: 50px;\n  height: 50px;\n}"] }]
+        args: [{ selector: 'app-camara-video-selfie', encapsulation: ViewEncapsulation.Emulated, template: "<ion-content color=\"light\" class=\"custom-content\">\r\n  <div *ngIf=\"isLoading\" class=\"loading-overlay\">\r\n    <ion-spinner name=\"crescent\"></ion-spinner>\r\n  </div> \r\n  <div *ngIf=\"countdown > 0\" class=\"countdown-overlay\">\r\n    <div class=\"countdown\">{{ countdown }}</div>\r\n  </div>\r\n  <ion-header class=\"ion-no-border\">\r\n    <ion-toolbar color=\"light\">\r\n      <!-- <ion-title class=\"centered-title\">Video Selfie</ion-title> -->\r\n      <ion-buttons slot=\"end\">\r\n        <ion-button (click)=\"closeOverlayVideo()\" [disabled]=\"!canStopRecording\">\r\n          <ion-icon name=\"close\" color=\"dark\"></ion-icon>\r\n        </ion-button>\r\n      </ion-buttons>\r\n    </ion-toolbar>\r\n  </ion-header>\r\n  <!-- Contenedor de la c\u00E1mara y progresi\u00F3n -->\r\n  <div class=\"camera-container\">\r\n    <div class=\"video-wrapper\">\r\n      <video #videoElement muted autoplay playsinline style=\"transform: scaleX(-1)\"></video>\r\n      <svg class=\"progress-ring\" #progressRing width=\"300\" height=\"300\">\r\n        <circle class=\"progress-ring__circle\" cx=\"150\" cy=\"150\" r=\"150\" />\r\n      </svg>\r\n    </div>\r\n    <ion-label [ngClass]=\"{'red': isRecording}\">00:{{ timeRemaining < 10 ? '0' + timeRemaining : timeRemaining\r\n        }}</ion-label>\r\n        <p class=\"text-center\">Permanece quieto, con tu rostro en el centro del c\u00EDrculo.</p>\r\n        <!-- Botones de grabaci\u00F3n -->\r\n        <div class=\"fixed-footer\">\r\n          <ion-button class=\"button-grabar\" *ngIf=\"!isRecording\" expand=\"block\" (click)=\"recordVideo()\">Iniciar Grabaci\u00F3n</ion-button>\r\n          <ion-button *ngIf=\"isRecording\" expand=\"block\" (click)=\"stopRecording()\" [disabled]=\"!canStopRecording\">Detener\r\n            Grabaci\u00F3n</ion-button>\r\n        </div>\r\n  </div>\r\n</ion-content>", styles: [".camera-container {\r\n  justify-content: center;\r\n  align-items: center;\r\n  position: relative;\r\n  display: flex;\r\n  flex-direction: column;\r\n  align-items: center;\r\n  justify-content: center;\r\n  height: 70%;\r\n  background-color: #fff;\r\n}\r\n\r\n.video-wrapper {\r\n  position: relative;\r\n  width: 300px;\r\n  height: 300px;\r\n  border-radius: 50%;\r\n  overflow: hidden;\r\n}\r\n\r\nvideo {\r\n  width: 100%;\r\n  height: 100%;\r\n  object-fit: cover;\r\n  border-radius: 50%;\r\n}\r\n\r\n.progress-ring {\r\n  position: absolute;\r\n  top: 0;\r\n  left: 0;\r\n  transform: rotate(-90deg);\r\n  /* Rotamos el c\u00EDrculo para que la animaci\u00F3n inicie desde arriba */\r\n}\r\n\r\n.progress-ring__circle {\r\n  fill: transparent;\r\n  stroke: purple;\r\n  stroke-width: 12;\r\n  stroke-dasharray: 945;\r\n  /* La circunferencia del c\u00EDrculo  880*/\r\n  stroke-dashoffset: 880;\r\n  /* Oculto por completo al inicio */\r\n  transition: stroke-dashoffset 12s linear;\r\n  /* Esto controlar\u00E1 el llenado progresivo */\r\n}\r\n\r\n.progress-active .progress-ring__circle {\r\n  animation: progress-animation 5s linear forwards;\r\n}\r\n\r\n@keyframes progress-animation {\r\n  from {\r\n    stroke-dashoffset: 880;\r\n  }\r\n\r\n  to {\r\n    stroke-dashoffset: 0;\r\n  }\r\n}\r\n\r\n.text-container {\r\n  height: 40px;\r\n  color: black;\r\n}\r\n\r\nion-header {\r\n  --background: #fff;\r\n  /* Fondo blanco para el header */\r\n}\r\n\r\n.centered-title {\r\n  text-align: center;\r\n  width: 100%;\r\n  /* Asegura que el t\u00EDtulo est\u00E9 centrado */\r\n  font-weight: bold;\r\n}\r\n\r\n.fixed-footer {\r\n  position: fixed;\r\n  bottom: 40px;\r\n  left: 0;\r\n  width: 100%;\r\n  padding: 10px;\r\n  background-color: #fff; // Color de fondo, opcional\r\n  // box-shadow: 0 -2px 10px rgba(0, 0, 0, 0.1);\r\n\r\n\r\n  ion-button {\r\n    width: 90%;\r\n    max-width: 300px;\r\n    margin: 0 auto;\r\n    color: #fff;\r\n    font-weight: bold;\r\n    border-radius: 20px;\r\n\r\n    --background: #82298F;\r\n    --background-hover: #82298F;\r\n    --background-activated: #82298F;\r\n    --background-focused: #82298F;\r\n\r\n    --color: #fff;\r\n\r\n    --border-radius: 20px;\r\n    --border-color: #82298F;\r\n    ;\r\n    --border-style: solid;\r\n    --border-width: 1px;\r\n\r\n    --box-shadow: 0 2px 6px 0 rgb(0, 0, 0, 0.25);\r\n\r\n    --ripple-color: #82298F;\r\n\r\n\r\n    &:hover {\r\n      background-color: #82298F;\r\n    }\r\n\r\n    &:active {\r\n      background-color: #82298F;\r\n    }\r\n  }\r\n}\r\n\r\n\r\n\r\n\r\n\r\nion-header {\r\n  --background: #fff;\r\n  /* Fondo blanco */\r\n  color: #000000;\r\n  /* Texto negro */\r\n}\r\n\r\nion-toolbar {\r\n  --ion-background-color: #fff !important;\r\n  --background: #ffffff !important;\r\n  --color: #000000 !important;\r\n}\r\n\r\n.centered-title {\r\n  flex: 1;\r\n  text-align: center;\r\n  /* Centrar el t\u00EDtulo */\r\n  font-weight: bold;\r\n  color: #000000;\r\n  margin: 0;\r\n  /* Quita cualquier margen del t\u00EDtulo */\r\n}\r\n\r\nion-buttons {\r\n  justify-content: flex-end;\r\n  /* Alinea el bot\u00F3n a la derecha */\r\n}\r\n\r\n.countdown-overlay {\r\n  position: fixed;\r\n  top: 0;\r\n  left: 0;\r\n  width: 100%;\r\n  height: 100%;\r\n  background-color: rgba(0, 0, 0, 0.6);\r\n  /* Fondo semi-transparente */\r\n  display: flex;\r\n  align-items: center;\r\n  justify-content: center;\r\n  margin: 0;\r\n  padding: 0;\r\n  z-index: 1000;\r\n  /* Asegurarse de que est\u00E9 encima de otros elementos */\r\n  animation: fadeIn 0.5s ease-out, fadeOut 0.5s ease-out 2.5s;\r\n  /* Animaciones de entrada y salida */\r\n  box-sizing: border-box;\r\n  border-radius: 0px;\r\n\r\n}\r\n\r\nion-content.custom-content {\r\n  --padding-top: 0;\r\n  --padding-bottom: 0;\r\n  margin: 0;\r\n  padding: 0;\r\n}\r\n\r\n.countdown {\r\n  font-size: 100px;\r\n  font-weight: bold;\r\n  color: #fff;\r\n  animation: scaleUp 0.5s ease-out, scaleDown 0.5s ease-out 2.5s;\r\n  /* Escalar en entrada y salida */\r\n}\r\n\r\n/* Animaci\u00F3n para desvanecer la superposici\u00F3n */\r\n@keyframes fadeIn {\r\n  from {\r\n    opacity: 0;\r\n  }\r\n\r\n  to {\r\n    opacity: 1;\r\n  }\r\n}\r\n\r\n@keyframes fadeOut {\r\n  from {\r\n    opacity: 1;\r\n  }\r\n\r\n  to {\r\n    opacity: 0;\r\n  }\r\n}\r\n\r\n/* Animaci\u00F3n para escalar el n\u00FAmero */\r\n@keyframes scaleUp {\r\n  from {\r\n    transform: scale(0.8);\r\n    opacity: 0;\r\n  }\r\n\r\n  to {\r\n    transform: scale(1);\r\n    opacity: 1;\r\n  }\r\n}\r\n\r\n@keyframes scaleDown {\r\n  from {\r\n    transform: scale(1);\r\n    opacity: 1;\r\n  }\r\n\r\n  to {\r\n    transform: scale(0.8);\r\n    opacity: 0;\r\n  }\r\n}\r\n\r\n.red {\r\n  padding: 10px;\r\n  color: red;\r\n}\r\n\r\n.text-center {\r\n  text-align: center;\r\n  padding-left: 20%;\r\n  padding-right: 20%;\r\n  color: #333;\r\n}\r\n\r\n.loading-overlay {\r\n  position: fixed;\r\n  top: 0;\r\n  left: 0;\r\n  width: 100%;\r\n  height: 100%;\r\n  background-color: rgba(0, 0, 0, 0.8);\r\n  /* Fondo oscuro semi-transparente */\r\n  display: flex;\r\n  align-items: center;\r\n  justify-content: center;\r\n  z-index: 1000;\r\n  /* Aseg\u00FArate de que est\u00E9 por encima del contenido */\r\n  margin: 0;\r\n  padding: 0;\r\n  box-sizing: border-box;\r\n  border-radius: 0px;\r\n}\r\n\r\nion-spinner {\r\n  color: #fff;\r\n  width: 50px;\r\n  height: 50px;\r\n}"] }]
     }], () => [{ type: i1.Platform }, { type: i1.ModalController }, { type: i2.DomSanitizer }, { type: i0.Renderer2 }, { type: i1.AlertController }, { type: i0.ChangeDetectorRef }, { type: i3.ModalVideoSelfieServices }, { type: i4.ModalDpiServices }], { videoElement: [{
             type: ViewChild,
             args: ['videoElement']
@@ -325,5 +325,5 @@ export class CamaraVideoSelfieComponent {
         }], closeRequested: [{
             type: Output
         }] }); })();
-(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassDebugInfo(CamaraVideoSelfieComponent, { className: "CamaraVideoSelfieComponent" }); })();
+(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassDebugInfo(CamaraVideoSelfieComponent, { className: "CamaraVideoSelfieComponent", filePath: "src\\app\\pages\\id-vision\\components\\camara-video-selfie\\camara-video-selfie.component.ts", lineNumber: 19 }); })();
 //# sourceMappingURL=camara-video-selfie.component.js.map

package/dist/src/app/pages/id-vision/components/camera-with-overlay/camera-with-overlay.component.js

@@ -231,11 +231,11 @@ export class CameraWithOverlayComponent {
             i0.ɵɵproperty("ngIf", ctx.isLoading);
             i0.ɵɵadvance(5);
             i0.ɵɵproperty("src", ctx.overlaySrc, i0.ɵɵsanitizeUrl);
-        } }, dependencies: [i3.NgIf, i1.IonButton, i1.IonContent, i1.IonFab, i1.IonFabButton, i1.IonIcon, i1.IonSpinner], styles: ["ion-content[_ngcontent-%COMP%] {\n  --background: black;\n  padding: 0;\n  margin: 0;\n  display: flex;\n  justify-content: center;\n  align-items: center;\n  height: 100vh;\n\n}\n\n\n.blink-image[_ngcontent-%COMP%] {\n  animation: _ngcontent-%COMP%_blink 3s infinite;\n}\n\n@keyframes _ngcontent-%COMP%_blink {\n  0%   { opacity: 1; }\n  50%  { opacity: 0; }\n  100% { opacity: 1; }\n}\n\n.modal-container[_ngcontent-%COMP%] {\n  max-width: 400px; // Ajusta el valor seg\u00FAn tus necesidades\n\n}\n\n.camera-overlay[_ngcontent-%COMP%] {\n  position: relative;\n  width: 100vw;\n  height: 100vh;\n  display: flex;\n  justify-content: center;\n  align-items: center;\n  overflow: hidden;\n}\n\n.camera-container[_ngcontent-%COMP%] {\n  width: 100%;\n  height: 100%;\n  position: relative;\n\n  video {\n    width: 100%;\n    height: 100%;\n    object-fit: cover;\n  }\n}\n\n.overlay-frame[_ngcontent-%COMP%] {\n  position: absolute;\n  top: 50%;\n  left: 50%;\n  transform: translate(-50%, -50%);\n  max-width: 86%;\n  max-height: 90%;\n  z-index: 9;\n}\n\n.header-text[_ngcontent-%COMP%] {\n  position: absolute;\n  top: 50px;\n  width: 100%;\n  text-align: center;\n  color: white;\n  z-index: 15;\n\n  p {\n    margin: 0;\n    font-size: 18px;\n  }\n\n  .country {\n    font-weight: bold;\n  }\n}\n\n.button-container[_ngcontent-%COMP%] {\n  position: absolute;\n  bottom: 20px;\n  width: 100%;\n  display: flex;\n  justify-content: center;\n  align-items: center;\n  z-index: 10;\n}\n\n.capture-button[_ngcontent-%COMP%] {\n  width: 70px;\n  height: 70px;\n  border-radius: 50%;\n\n\n  --background: var(--purple-primary);\n    --background-hover: var(--purple-secondary);\n    --background-activated: var(--purple-secondary);\n    --background-focused: var(--purple-secondary);\n  \n    --color: white;\n  \n    --border-color: var(--purple-primary);\n    --border-style: solid;\n    --border-width: 1px;\n  \n    --box-shadow: 0 2px 6px 0 rgb(0, 0, 0, 0.25);\n  \n    --ripple-color: var(--purple-secondary);\n}\n\n.close-button[_ngcontent-%COMP%] {\n  position: absolute;\n  top: 14px;\n  right: 20px;\n  color: white;\n  z-index: 10;\n}\n\n.visible-window[_ngcontent-%COMP%] {\n  position: absolute;\n  top: 50%;\n  left: 50%;\n  transform: translate(-50%, -50%);\n  // width: 70%; \n\n  // height: 45%; \n\n\n  width: 313px;\n  height: 500px;\n\n  max-width: 90%;\n  max-height: 90%;\n  background: transparent;\n  border: 2px solid white; \n\n  border-radius: 10px; \n\n  z-index: 10; \n\n  box-shadow: 0 0 0 100vw rgba(0, 0, 0, 0.65); \n\n}\n.text-help[_ngcontent-%COMP%]   p[_ngcontent-%COMP%]{\n  display: inline-block; \n\n  background-color: white; \n\n  padding:15px; \n\n  border-radius: 5px; \n\n  color: black; \n\n  box-shadow: 0px 4px 6px rgba(0, 0, 0, 0.1); \n\n  animation: _ngcontent-%COMP%_popIn 1s ease-in-out; \n\n  margin-left: 10px;\n  margin-right: 10px;\n\n}\n\n\n\n@keyframes _ngcontent-%COMP%_popIn {\n  0% {\n    transform: scale(0.8); \n\n    opacity: 0; \n\n  }\n  50% {\n    transform: scale(1.1); \n\n    opacity: 1; \n\n  }\n  100% {\n    transform: scale(1); \n\n  }\n}\n\n.loading-overlay[_ngcontent-%COMP%] {\n  position: fixed;\n  top: 0;\n  left: 0;\n  width: 100vw;\n  height: 100vh;\n  background-color: rgba(0, 0, 0, 0.8); \n\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  z-index: 1000; \n\n}\n\nion-spinner[_ngcontent-%COMP%] {\n  color: white;\n  width: 50px;\n  height: 50px;\n}\n\n\n\n.camera-select[_ngcontent-%COMP%] {\n  position: absolute;\n  top: 1rem;\n  left: 1rem;\n  background: rgba(0, 0, 0, 0.7);\n  padding: 0.5rem;\n  border-radius: 0.5rem;\n  z-index: 999;\n  display: flex;\n  align-items: center;\n  color: white;\n\n  label {\n    margin-right: 0.5rem;\n    font-size: 14px;\n  }\n\n  select {\n    background: transparent;\n    color: white;\n    border: 1px solid white;\n    border-radius: 0.3rem;\n    font-size: 14px;\n    padding: 0.2rem;\n  }\n}\n\n.buttonfabCameraChange[_ngcontent-%COMP%] {\n  --background: rgba(0, 0, 0, 0.6);\n  --color: #fff;\n  //box-shadow: 0 2px 6px rgba(0, 0, 0, 0.4);\n  \n\n  \n\n}"] }); }
+        } }, dependencies: [i3.NgIf, i1.IonButton, i1.IonContent, i1.IonFab, i1.IonFabButton, i1.IonIcon, i1.IonSpinner], styles: ["ion-content[_ngcontent-%COMP%] {\r\n  --background: black;\r\n  padding: 0;\r\n  margin: 0;\r\n  display: flex;\r\n  justify-content: center;\r\n  align-items: center;\r\n  height: 100vh;\r\n\r\n}\r\n\r\n\r\n.blink-image[_ngcontent-%COMP%] {\r\n  animation: _ngcontent-%COMP%_blink 3s infinite;\r\n}\r\n\r\n@keyframes _ngcontent-%COMP%_blink {\r\n  0%   { opacity: 1; }\r\n  50%  { opacity: 0; }\r\n  100% { opacity: 1; }\r\n}\r\n\r\n.modal-container[_ngcontent-%COMP%] {\r\n  max-width: 400px; // Ajusta el valor seg\u00FAn tus necesidades\r\n\r\n}\r\n\r\n.camera-overlay[_ngcontent-%COMP%] {\r\n  position: relative;\r\n  width: 100vw;\r\n  height: 100vh;\r\n  display: flex;\r\n  justify-content: center;\r\n  align-items: center;\r\n  overflow: hidden;\r\n}\r\n\r\n.camera-container[_ngcontent-%COMP%] {\r\n  width: 100%;\r\n  height: 100%;\r\n  position: relative;\r\n\r\n  video {\r\n    width: 100%;\r\n    height: 100%;\r\n    object-fit: cover;\r\n  }\r\n}\r\n\r\n.overlay-frame[_ngcontent-%COMP%] {\r\n  position: absolute;\r\n  top: 50%;\r\n  left: 50%;\r\n  transform: translate(-50%, -50%);\r\n  max-width: 86%;\r\n  max-height: 90%;\r\n  z-index: 9;\r\n}\r\n\r\n.header-text[_ngcontent-%COMP%] {\r\n  position: absolute;\r\n  top: 50px;\r\n  width: 100%;\r\n  text-align: center;\r\n  color: white;\r\n  z-index: 15;\r\n\r\n  p {\r\n    margin: 0;\r\n    font-size: 18px;\r\n  }\r\n\r\n  .country {\r\n    font-weight: bold;\r\n  }\r\n}\r\n\r\n.button-container[_ngcontent-%COMP%] {\r\n  position: absolute;\r\n  bottom: 20px;\r\n  width: 100%;\r\n  display: flex;\r\n  justify-content: center;\r\n  align-items: center;\r\n  z-index: 10;\r\n}\r\n\r\n.capture-button[_ngcontent-%COMP%] {\r\n  width: 70px;\r\n  height: 70px;\r\n  border-radius: 50%;\r\n\r\n\r\n  --background: var(--purple-primary);\r\n    --background-hover: var(--purple-secondary);\r\n    --background-activated: var(--purple-secondary);\r\n    --background-focused: var(--purple-secondary);\r\n  \r\n    --color: white;\r\n  \r\n    --border-color: var(--purple-primary);\r\n    --border-style: solid;\r\n    --border-width: 1px;\r\n  \r\n    --box-shadow: 0 2px 6px 0 rgb(0, 0, 0, 0.25);\r\n  \r\n    --ripple-color: var(--purple-secondary);\r\n}\r\n\r\n.close-button[_ngcontent-%COMP%] {\r\n  position: absolute;\r\n  top: 14px;\r\n  right: 20px;\r\n  color: white;\r\n  z-index: 10;\r\n}\r\n\r\n.visible-window[_ngcontent-%COMP%] {\r\n  position: absolute;\r\n  top: 50%;\r\n  left: 50%;\r\n  transform: translate(-50%, -50%);\r\n  // width: 70%; \n\r\n  // height: 45%; \n\r\n\r\n  width: 313px;\r\n  height: 500px;\r\n\r\n  max-width: 90%;\r\n  max-height: 90%;\r\n  background: transparent;\r\n  border: 2px solid white; \n\r\n  border-radius: 10px; \n\r\n  z-index: 10; \n\r\n  box-shadow: 0 0 0 100vw rgba(0, 0, 0, 0.65); \n\r\n}\r\n.text-help[_ngcontent-%COMP%]   p[_ngcontent-%COMP%]{\r\n  display: inline-block; \n\r\n  background-color: white; \n\r\n  padding:15px; \n\r\n  border-radius: 5px; \n\r\n  color: black; \n\r\n  box-shadow: 0px 4px 6px rgba(0, 0, 0, 0.1); \n\r\n  animation: _ngcontent-%COMP%_popIn 1s ease-in-out; \n\r\n  margin-left: 10px;\r\n  margin-right: 10px;\r\n\r\n}\r\n\r\n\n\r\n@keyframes _ngcontent-%COMP%_popIn {\r\n  0% {\r\n    transform: scale(0.8); \n\r\n    opacity: 0; \n\r\n  }\r\n  50% {\r\n    transform: scale(1.1); \n\r\n    opacity: 1; \n\r\n  }\r\n  100% {\r\n    transform: scale(1); \n\r\n  }\r\n}\r\n\r\n.loading-overlay[_ngcontent-%COMP%] {\r\n  position: fixed;\r\n  top: 0;\r\n  left: 0;\r\n  width: 100vw;\r\n  height: 100vh;\r\n  background-color: rgba(0, 0, 0, 0.8); \n\r\n  display: flex;\r\n  align-items: center;\r\n  justify-content: center;\r\n  z-index: 1000; \n\r\n}\r\n\r\nion-spinner[_ngcontent-%COMP%] {\r\n  color: white;\r\n  width: 50px;\r\n  height: 50px;\r\n}\r\n\r\n\r\n\r\n.camera-select[_ngcontent-%COMP%] {\r\n  position: absolute;\r\n  top: 1rem;\r\n  left: 1rem;\r\n  background: rgba(0, 0, 0, 0.7);\r\n  padding: 0.5rem;\r\n  border-radius: 0.5rem;\r\n  z-index: 999;\r\n  display: flex;\r\n  align-items: center;\r\n  color: white;\r\n\r\n  label {\r\n    margin-right: 0.5rem;\r\n    font-size: 14px;\r\n  }\r\n\r\n  select {\r\n    background: transparent;\r\n    color: white;\r\n    border: 1px solid white;\r\n    border-radius: 0.3rem;\r\n    font-size: 14px;\r\n    padding: 0.2rem;\r\n  }\r\n}\r\n\r\n.buttonfabCameraChange[_ngcontent-%COMP%] {\r\n  --background: rgba(0, 0, 0, 0.6);\r\n  --color: #fff;\r\n  //box-shadow: 0 2px 6px rgba(0, 0, 0, 0.4);\r\n  \n\r\n  \n\r\n}"] }); }
 }
 (() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(CameraWithOverlayComponent, [{
         type: Component,
-        args: [{ selector: 'app-camera-overlay', encapsulation: ViewEncapsulation.Emulated, template: "<ion-content color=\"dark\">\n  <div class=\"camera-overlay\">\n    <ion-fab vertical=\"top\" horizontal=\"start\" slot=\"fixed\" *ngIf=\"rearCams.length > 1\">\n      <ion-fab-button\n        class=\"buttonfabCameraChange\"\n        size=\"small\"\n        (click)=\"toggleRearCam()\">\n        <ion-icon name=\"camera-reverse-outline\"></ion-icon>\n      </ion-fab-button>\n    </ion-fab>\n    <!-- \u25B8 Encabezado ---------------------------------------------------- -->\n    <div class=\"header-text\">\n      <div class=\"text-help\">\n        <p>{{ text1 }}</p>\n      </div>\n      <p class=\"country\">{{ text2 }}</p>\n\n      <!-- \u25B8 Selector de c\u00E1maras traseras (solo se muestra si hay varias) -->\n      <!-- <ion-item  class=\"cam-picker\" lines=\"none\">\n        <ion-label>Elegir c\u00E1mara</ion-label>\n        <ion-select interface=\"popover\"\n                    [value]=\"selectedCamId\"\n                    (ionChange)=\"onSelectCam($event)\">\n          <ion-select-option *ngFor=\"let cam of rearCams\"\n                             [value]=\"cam.deviceId\">\n            {{ cam.label }}\n          </ion-select-option>\n        </ion-select>\n      </ion-item>-->\n    </div> \n\n    <!-- \u25B8 Loader mientras inicializa ------------------------------------ -->\n    <div *ngIf=\"isLoading\" class=\"loading-overlay\">\n      <ion-spinner name=\"crescent\"></ion-spinner>\n    </div>\n\n    <!-- \u25B8 Capa oscura con recorte (tu ventana de enfoque) --------------- -->\n    <div class=\"visible-window\"></div>\n\n    <!-- \u25B8 Contenedor del v\u00EDdeo + overlay -------------------------------- -->\n    <div class=\"camera-container\">\n      <video #videoElement autoplay muted playsinline></video>\n      <img [src]=\"overlaySrc\" alt=\"Overlay\" class=\"overlay-frame blink-image\" />\n    </div>\n\n    <!-- \u25B8 Bot\u00F3n de captura ---------------------------------------------- -->\n    <div class=\"button-container\">\n      <ion-button (click)=\"capturePhoto()\"\n                  class=\"capture-button\"\n                  shape=\"round\"\n                  expand=\"block\">\n        <ion-icon name=\"camera-outline\"></ion-icon>\n      </ion-button>\n    </div>\n\n    <!-- \u25B8 Bot\u00F3n de cerrar ------------------------------------------------ -->\n    <ion-button fill=\"clear\"\n                (click)=\"closeOverlay()\"\n                class=\"close-button\">\n      <ion-icon name=\"close-outline\"></ion-icon>\n    </ion-button>\n  </div>\n</ion-content>\n", styles: ["ion-content {\n  --background: black;\n  padding: 0;\n  margin: 0;\n  display: flex;\n  justify-content: center;\n  align-items: center;\n  height: 100vh;\n\n}\n\n\n.blink-image {\n  animation: blink 3s infinite;\n}\n\n@keyframes blink {\n  0%   { opacity: 1; }\n  50%  { opacity: 0; }\n  100% { opacity: 1; }\n}\n\n.modal-container {\n  max-width: 400px; // Ajusta el valor seg\u00FAn tus necesidades\n\n}\n\n.camera-overlay {\n  position: relative;\n  width: 100vw;\n  height: 100vh;\n  display: flex;\n  justify-content: center;\n  align-items: center;\n  overflow: hidden;\n}\n\n.camera-container {\n  width: 100%;\n  height: 100%;\n  position: relative;\n\n  video {\n    width: 100%;\n    height: 100%;\n    object-fit: cover;\n  }\n}\n\n.overlay-frame {\n  position: absolute;\n  top: 50%;\n  left: 50%;\n  transform: translate(-50%, -50%);\n  max-width: 86%;\n  max-height: 90%;\n  z-index: 9;\n}\n\n.header-text {\n  position: absolute;\n  top: 50px;\n  width: 100%;\n  text-align: center;\n  color: white;\n  z-index: 15;\n\n  p {\n    margin: 0;\n    font-size: 18px;\n  }\n\n  .country {\n    font-weight: bold;\n  }\n}\n\n.button-container {\n  position: absolute;\n  bottom: 20px;\n  width: 100%;\n  display: flex;\n  justify-content: center;\n  align-items: center;\n  z-index: 10;\n}\n\n.capture-button {\n  width: 70px;\n  height: 70px;\n  border-radius: 50%;\n\n\n  --background: var(--purple-primary);\n    --background-hover: var(--purple-secondary);\n    --background-activated: var(--purple-secondary);\n    --background-focused: var(--purple-secondary);\n  \n    --color: white;\n  \n    --border-color: var(--purple-primary);\n    --border-style: solid;\n    --border-width: 1px;\n  \n    --box-shadow: 0 2px 6px 0 rgb(0, 0, 0, 0.25);\n  \n    --ripple-color: var(--purple-secondary);\n}\n\n.close-button {\n  position: absolute;\n  top: 14px;\n  right: 20px;\n  color: white;\n  z-index: 10;\n}\n\n.visible-window {\n  position: absolute;\n  top: 50%;\n  left: 50%;\n  transform: translate(-50%, -50%);\n  // width: 70%; /* Ajusta el tama\u00F1o del cuadro */\n  // height: 45%; /* Ajusta el tama\u00F1o del cuadro */\n\n  width: 313px;\n  height: 500px;\n\n  max-width: 90%;\n  max-height: 90%;\n  background: transparent;\n  border: 2px solid white; /* Color y grosor del borde */\n  border-radius: 10px; /* Ajusta para redondear las esquinas */\n  z-index: 10; /* Aseg\u00FArate de que est\u00E9 encima del overlay oscuro */\n  box-shadow: 0 0 0 100vw rgba(0, 0, 0, 0.65); /* Oscurece fuera del cuadro */\n}\n.text-help  p{\n  display: inline-block; /* Hace que solo el texto ocupe espacio */\n  background-color: white; /* Color de fondo del texto */\n  padding:15px; /* Espaciado interno para una mejor visualizaci\u00F3n */\n  border-radius: 5px; /* Opcional, para esquinas redondeadas */\n  color: black; /* Color del texto */\n  box-shadow: 0px 4px 6px rgba(0, 0, 0, 0.1); /* Sombra leve */\n  animation: popIn 1s ease-in-out; /* Agrega la animaci\u00F3n al aparecer */\n  margin-left: 10px;\n  margin-right: 10px;\n\n}\n\n/* Definimos la animaci\u00F3n \"popIn\" */\n@keyframes popIn {\n  0% {\n    transform: scale(0.8); /* Comienza m\u00E1s peque\u00F1o */\n    opacity: 0; /* Empieza invisible */\n  }\n  50% {\n    transform: scale(1.1); /* Crece un poco m\u00E1s de lo normal */\n    opacity: 1; /* Se hace visible */\n  }\n  100% {\n    transform: scale(1); /* Vuelve a su tama\u00F1o normal */\n  }\n}\n\n.loading-overlay {\n  position: fixed;\n  top: 0;\n  left: 0;\n  width: 100vw;\n  height: 100vh;\n  background-color: rgba(0, 0, 0, 0.8); /* Fondo oscuro semi-transparente */\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  z-index: 1000; /* Aseg\u00FArate de que est\u00E9 por encima del contenido */\n}\n\nion-spinner {\n  color: white;\n  width: 50px;\n  height: 50px;\n}\n\n\n\n.camera-select {\n  position: absolute;\n  top: 1rem;\n  left: 1rem;\n  background: rgba(0, 0, 0, 0.7);\n  padding: 0.5rem;\n  border-radius: 0.5rem;\n  z-index: 999;\n  display: flex;\n  align-items: center;\n  color: white;\n\n  label {\n    margin-right: 0.5rem;\n    font-size: 14px;\n  }\n\n  select {\n    background: transparent;\n    color: white;\n    border: 1px solid white;\n    border-radius: 0.3rem;\n    font-size: 14px;\n    padding: 0.2rem;\n  }\n}\n\n.buttonfabCameraChange {\n  --background: rgba(0, 0, 0, 0.6);\n  --color: #fff;\n  //box-shadow: 0 2px 6px rgba(0, 0, 0, 0.4);\n  /* ajusta posici\u00F3n extra si lo necesitas */\n  /* margin-top: 8px; margin-left: 8px; */\n}\n"] }]
+        args: [{ selector: 'app-camera-overlay', encapsulation: ViewEncapsulation.Emulated, template: "<ion-content color=\"dark\">\r\n  <div class=\"camera-overlay\">\r\n    <ion-fab vertical=\"top\" horizontal=\"start\" slot=\"fixed\" *ngIf=\"rearCams.length > 1\">\r\n      <ion-fab-button\r\n        class=\"buttonfabCameraChange\"\r\n        size=\"small\"\r\n        (click)=\"toggleRearCam()\">\r\n        <ion-icon name=\"camera-reverse-outline\"></ion-icon>\r\n      </ion-fab-button>\r\n    </ion-fab>\r\n    <!-- \u25B8 Encabezado ---------------------------------------------------- -->\r\n    <div class=\"header-text\">\r\n      <div class=\"text-help\">\r\n        <p>{{ text1 }}</p>\r\n      </div>\r\n      <p class=\"country\">{{ text2 }}</p>\r\n\r\n      <!-- \u25B8 Selector de c\u00E1maras traseras (solo se muestra si hay varias) -->\r\n      <!-- <ion-item  class=\"cam-picker\" lines=\"none\">\r\n        <ion-label>Elegir c\u00E1mara</ion-label>\r\n        <ion-select interface=\"popover\"\r\n                    [value]=\"selectedCamId\"\r\n                    (ionChange)=\"onSelectCam($event)\">\r\n          <ion-select-option *ngFor=\"let cam of rearCams\"\r\n                             [value]=\"cam.deviceId\">\r\n            {{ cam.label }}\r\n          </ion-select-option>\r\n        </ion-select>\r\n      </ion-item>-->\r\n    </div> \r\n\r\n    <!-- \u25B8 Loader mientras inicializa ------------------------------------ -->\r\n    <div *ngIf=\"isLoading\" class=\"loading-overlay\">\r\n      <ion-spinner name=\"crescent\"></ion-spinner>\r\n    </div>\r\n\r\n    <!-- \u25B8 Capa oscura con recorte (tu ventana de enfoque) --------------- -->\r\n    <div class=\"visible-window\"></div>\r\n\r\n    <!-- \u25B8 Contenedor del v\u00EDdeo + overlay -------------------------------- -->\r\n    <div class=\"camera-container\">\r\n      <video #videoElement autoplay muted playsinline></video>\r\n      <img [src]=\"overlaySrc\" alt=\"Overlay\" class=\"overlay-frame blink-image\" />\r\n    </div>\r\n\r\n    <!-- \u25B8 Bot\u00F3n de captura ---------------------------------------------- -->\r\n    <div class=\"button-container\">\r\n      <ion-button (click)=\"capturePhoto()\"\r\n                  class=\"capture-button\"\r\n                  shape=\"round\"\r\n                  expand=\"block\">\r\n        <ion-icon name=\"camera-outline\"></ion-icon>\r\n      </ion-button>\r\n    </div>\r\n\r\n    <!-- \u25B8 Bot\u00F3n de cerrar ------------------------------------------------ -->\r\n    <ion-button fill=\"clear\"\r\n                (click)=\"closeOverlay()\"\r\n                class=\"close-button\">\r\n      <ion-icon name=\"close-outline\"></ion-icon>\r\n    </ion-button>\r\n  </div>\r\n</ion-content>\r\n", styles: ["ion-content {\r\n  --background: black;\r\n  padding: 0;\r\n  margin: 0;\r\n  display: flex;\r\n  justify-content: center;\r\n  align-items: center;\r\n  height: 100vh;\r\n\r\n}\r\n\r\n\r\n.blink-image {\r\n  animation: blink 3s infinite;\r\n}\r\n\r\n@keyframes blink {\r\n  0%   { opacity: 1; }\r\n  50%  { opacity: 0; }\r\n  100% { opacity: 1; }\r\n}\r\n\r\n.modal-container {\r\n  max-width: 400px; // Ajusta el valor seg\u00FAn tus necesidades\r\n\r\n}\r\n\r\n.camera-overlay {\r\n  position: relative;\r\n  width: 100vw;\r\n  height: 100vh;\r\n  display: flex;\r\n  justify-content: center;\r\n  align-items: center;\r\n  overflow: hidden;\r\n}\r\n\r\n.camera-container {\r\n  width: 100%;\r\n  height: 100%;\r\n  position: relative;\r\n\r\n  video {\r\n    width: 100%;\r\n    height: 100%;\r\n    object-fit: cover;\r\n  }\r\n}\r\n\r\n.overlay-frame {\r\n  position: absolute;\r\n  top: 50%;\r\n  left: 50%;\r\n  transform: translate(-50%, -50%);\r\n  max-width: 86%;\r\n  max-height: 90%;\r\n  z-index: 9;\r\n}\r\n\r\n.header-text {\r\n  position: absolute;\r\n  top: 50px;\r\n  width: 100%;\r\n  text-align: center;\r\n  color: white;\r\n  z-index: 15;\r\n\r\n  p {\r\n    margin: 0;\r\n    font-size: 18px;\r\n  }\r\n\r\n  .country {\r\n    font-weight: bold;\r\n  }\r\n}\r\n\r\n.button-container {\r\n  position: absolute;\r\n  bottom: 20px;\r\n  width: 100%;\r\n  display: flex;\r\n  justify-content: center;\r\n  align-items: center;\r\n  z-index: 10;\r\n}\r\n\r\n.capture-button {\r\n  width: 70px;\r\n  height: 70px;\r\n  border-radius: 50%;\r\n\r\n\r\n  --background: var(--purple-primary);\r\n    --background-hover: var(--purple-secondary);\r\n    --background-activated: var(--purple-secondary);\r\n    --background-focused: var(--purple-secondary);\r\n  \r\n    --color: white;\r\n  \r\n    --border-color: var(--purple-primary);\r\n    --border-style: solid;\r\n    --border-width: 1px;\r\n  \r\n    --box-shadow: 0 2px 6px 0 rgb(0, 0, 0, 0.25);\r\n  \r\n    --ripple-color: var(--purple-secondary);\r\n}\r\n\r\n.close-button {\r\n  position: absolute;\r\n  top: 14px;\r\n  right: 20px;\r\n  color: white;\r\n  z-index: 10;\r\n}\r\n\r\n.visible-window {\r\n  position: absolute;\r\n  top: 50%;\r\n  left: 50%;\r\n  transform: translate(-50%, -50%);\r\n  // width: 70%; /* Ajusta el tama\u00F1o del cuadro */\r\n  // height: 45%; /* Ajusta el tama\u00F1o del cuadro */\r\n\r\n  width: 313px;\r\n  height: 500px;\r\n\r\n  max-width: 90%;\r\n  max-height: 90%;\r\n  background: transparent;\r\n  border: 2px solid white; /* Color y grosor del borde */\r\n  border-radius: 10px; /* Ajusta para redondear las esquinas */\r\n  z-index: 10; /* Aseg\u00FArate de que est\u00E9 encima del overlay oscuro */\r\n  box-shadow: 0 0 0 100vw rgba(0, 0, 0, 0.65); /* Oscurece fuera del cuadro */\r\n}\r\n.text-help  p{\r\n  display: inline-block; /* Hace que solo el texto ocupe espacio */\r\n  background-color: white; /* Color de fondo del texto */\r\n  padding:15px; /* Espaciado interno para una mejor visualizaci\u00F3n */\r\n  border-radius: 5px; /* Opcional, para esquinas redondeadas */\r\n  color: black; /* Color del texto */\r\n  box-shadow: 0px 4px 6px rgba(0, 0, 0, 0.1); /* Sombra leve */\r\n  animation: popIn 1s ease-in-out; /* Agrega la animaci\u00F3n al aparecer */\r\n  margin-left: 10px;\r\n  margin-right: 10px;\r\n\r\n}\r\n\r\n/* Definimos la animaci\u00F3n \"popIn\" */\r\n@keyframes popIn {\r\n  0% {\r\n    transform: scale(0.8); /* Comienza m\u00E1s peque\u00F1o */\r\n    opacity: 0; /* Empieza invisible */\r\n  }\r\n  50% {\r\n    transform: scale(1.1); /* Crece un poco m\u00E1s de lo normal */\r\n    opacity: 1; /* Se hace visible */\r\n  }\r\n  100% {\r\n    transform: scale(1); /* Vuelve a su tama\u00F1o normal */\r\n  }\r\n}\r\n\r\n.loading-overlay {\r\n  position: fixed;\r\n  top: 0;\r\n  left: 0;\r\n  width: 100vw;\r\n  height: 100vh;\r\n  background-color: rgba(0, 0, 0, 0.8); /* Fondo oscuro semi-transparente */\r\n  display: flex;\r\n  align-items: center;\r\n  justify-content: center;\r\n  z-index: 1000; /* Aseg\u00FArate de que est\u00E9 por encima del contenido */\r\n}\r\n\r\nion-spinner {\r\n  color: white;\r\n  width: 50px;\r\n  height: 50px;\r\n}\r\n\r\n\r\n\r\n.camera-select {\r\n  position: absolute;\r\n  top: 1rem;\r\n  left: 1rem;\r\n  background: rgba(0, 0, 0, 0.7);\r\n  padding: 0.5rem;\r\n  border-radius: 0.5rem;\r\n  z-index: 999;\r\n  display: flex;\r\n  align-items: center;\r\n  color: white;\r\n\r\n  label {\r\n    margin-right: 0.5rem;\r\n    font-size: 14px;\r\n  }\r\n\r\n  select {\r\n    background: transparent;\r\n    color: white;\r\n    border: 1px solid white;\r\n    border-radius: 0.3rem;\r\n    font-size: 14px;\r\n    padding: 0.2rem;\r\n  }\r\n}\r\n\r\n.buttonfabCameraChange {\r\n  --background: rgba(0, 0, 0, 0.6);\r\n  --color: #fff;\r\n  //box-shadow: 0 2px 6px rgba(0, 0, 0, 0.4);\r\n  /* ajusta posici\u00F3n extra si lo necesitas */\r\n  /* margin-top: 8px; margin-left: 8px; */\r\n}\r\n"] }]
     }], () => [{ type: i1.Platform }, { type: i1.ModalController }, { type: i2.ModalDpiServices }], { videoElement: [{
             type: ViewChild,
             args: ['videoElement']
@@ -250,5 +250,5 @@ export class CameraWithOverlayComponent {
         }], closeRequested: [{
             type: Output
         }] }); })();
-(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassDebugInfo(CameraWithOverlayComponent, { className: "CameraWithOverlayComponent" }); })();
+(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassDebugInfo(CameraWithOverlayComponent, { className: "CameraWithOverlayComponent", filePath: "src\\app\\pages\\id-vision\\components\\camera-with-overlay\\camera-with-overlay.component.ts", lineNumber: 28 }); })();
 //# sourceMappingURL=camera-with-overlay.component.js.map