<div class="viewport-modal">
<div class="modal-header dialog-header">
<i c8yIcon="c8y-mobile-add"></i>
<h4
id="modal-title"
translate
>
Connect smartphone
</h4>
</div>
<c8y-stepper
class="inner-scroll"
[disableDefaultIcons]="{ edit: true, done: false }"
[useStepLabelsAsTitlesOnly]="true"
id="modal-body"
[customClasses]="['m-l-80', 'm-r-80', 'p-t-16 ', 'p-b-16']"
[disableProgressButtons]="true"
linear
>
<cdk-step [label]="connectSmartphoneTitle">
<div class="p-l-24 p-r-24" style="min-height: 385px;">
<div
class="h4 text-center p-t-24 m-b-24 animated fadeInDown"
style="animation-delay: 0.3s"
>
{{ connectSmartphoneTitle | translate }}
</div>
<div class="row overflow-hidden d-flex">
<div
class="col-xs-7 animated fadeInUp"
style="animation-delay: 0.5s"
>
<p
class="m-b-16 lead"
translate
>
Using your smartphone as a source of sensor data is a quick way to start using our IoT
platform.
</p>
<p
class="m-b-16"
translate
>
Use this wizard to connect your smartphone to our IoT platform using the Cumulocity
IoT Sensor App.
</p>
<p
class="m-b-16"
translate
>
We don't collect any personal data. The only data we retrieve from your phone is
sensor data and anonymized application usage data.
</p>
<p class="m-b-16">
<span translate>
Prepare your phone and then click
<strong>Next</strong>
below.
</span>
</p>
</div>
<div
class="col-xs-5 no-gutter animated fadeInUp"
style="animation-delay: 0.3s"
>
<svg width="326" height="362" viewBox="0 0 326 362" fill="none" xmlns="http://www.w3.org/2000/svg">
<path fill-rule="evenodd" clip-rule="evenodd" d="M202.966 250.585L129.345 293.09L109.444 281.6L183.065 239.095L202.966 250.585Z" fill="#E3E5E8" stroke="black" stroke-linejoin="round"/>
<path fill-rule="evenodd" clip-rule="evenodd" d="M139.543 257.158L107.901 311.968L88 300.478L119.641 245.668L139.543 257.158Z" fill="#D4D9DE" stroke="black" stroke-linejoin="round"/>
<path d="M139.543 330.238L107.898 311.968L113.461 302.333V302.261L113.523 302.225L139.543 257.158L147.454 261.725L129.346 293.09L202.966 250.585V263.504L129.283 306.045L147.454 316.536L139.543 330.238Z" fill="#8B96A0" stroke="black" stroke-linejoin="round"/>
<path fill-rule="evenodd" clip-rule="evenodd" d="M171.363 259.519L164.74 242.608L223.706 208.564L230.329 225.475L171.363 259.519Z" fill="var(--c8y-brand-30)" stroke="#212121" stroke-linejoin="round"/>
<path d="M167.583 259.887L171.363 259.519L164.74 242.608L160.959 242.976L167.583 259.887Z" fill="var(--c8y-brand-40)" stroke="#212121" stroke-linejoin="round"/>
<path d="M204.786 231.738C205.187 235.004 202.913 238.251 199.707 238.991C196.501 239.732 193.577 237.684 193.176 234.418C192.775 231.153 195.049 227.905 198.255 227.165C201.461 226.425 204.385 228.472 204.786 231.738Z" fill="#E3E5E8" stroke="#212121"/>
<path fill-rule="evenodd" clip-rule="evenodd" d="M164.624 242.602L120.482 129.892L179.448 95.8475L223.59 208.558L164.624 242.602Z" fill="#8B96A0" stroke="#212121" stroke-linejoin="round"/>
<path d="M164.624 242.602L120.482 129.892L116.702 130.26L160.844 242.97L164.624 242.602Z" fill="#D4D9DE" stroke="#212121" stroke-linejoin="round"/>
<path fill-rule="evenodd" clip-rule="evenodd" d="M120.532 129.837L118.323 124.197L177.289 90.1525L179.498 95.7927L120.532 129.837Z" fill="var(--c8y-brand-30)" stroke="#212121" stroke-linejoin="round"/>
<path fill-rule="evenodd" clip-rule="evenodd" d="M118.164 124.305L114.384 124.673L173.35 90.6287L177.13 90.2605L118.164 124.305Z" fill="var(--c8y-brand-60)" stroke="#212121" stroke-linejoin="round"/>
<path d="M116.702 130.261L120.482 129.893L118.273 124.253L114.493 124.621L116.702 130.261Z" fill="var(--c8y-brand-40)" stroke="#212121" stroke-linejoin="round"/>
<path fill-rule="evenodd" clip-rule="evenodd" d="M207.071 22.4899L199.16 36.1925L179.259 24.7027L187.17 11L207.071 22.4899Z" fill="var(--c8y-brand-40)" stroke="black" stroke-linejoin="round"/>
<path fill-rule="evenodd" clip-rule="evenodd" d="M207.07 95.5705L233.09 50.5034L213.189 39.0135L187.169 84.0806L207.07 95.5705Z" fill="var(--c8y-brand-40)" stroke="black" stroke-linejoin="round"/>
<path fill-rule="evenodd" clip-rule="evenodd" d="M238.715 40.7599L207.071 22.4897L199.159 36.1924L217.33 46.6834L143.647 89.2241V102.143L217.268 59.6385L199.159 91.0029L207.071 95.5705L233.09 50.5034L233.153 50.4672V50.3949L238.715 40.7599Z" fill="var(--c8y-brand-30)" stroke="black" stroke-linejoin="round"/>
<path fill-rule="evenodd" clip-rule="evenodd" d="M217.33 46.6835L143.648 89.2242L123.747 77.7344L197.429 35.1936L217.33 46.6835Z" fill="var(--c8y-brand-60)" stroke="black" stroke-linejoin="round"/>
<path fill-rule="evenodd" clip-rule="evenodd" d="M143.648 89.2241V102.143L123.747 90.6532V77.7343L143.648 89.2241Z" fill="var(--c8y-brand-40)" stroke="black" stroke-linejoin="round"/>
<g opacity="0.05" filter="url(#filter0_f_666_5447)">
<path fill-rule="evenodd" clip-rule="evenodd" d="M161.618 322.178L156.79 320.716L216.347 286.33L221.176 287.792L161.618 322.178Z" fill="#212121"/>
<path fill-rule="evenodd" clip-rule="evenodd" d="M201.965 308.884L128.344 351.389L108.443 339.899L182.064 297.395L201.965 308.884Z" fill="black"/>
</g>
<defs>
<filter id="filter0_f_666_5447" x="100.443" y="278.33" width="128.732" height="81.0587" filterUnits="userSpaceOnUse" color-interpolation-filters="sRGB">
<feFlood flood-opacity="0" result="BackgroundImageFix"/>
<feBlend mode="normal" in="SourceGraphic" in2="BackgroundImageFix" result="shape"/>
<feGaussianBlur stdDeviation="4" result="effect1_foregroundBlur_666_5447"/>
</filter>
</defs>
</svg>
</div>
</div>
</div>
<c8y-stepper-buttons
class="modal-footer d-block bg-component separator-top sticky-bottom"
(onNext)="next($event)"
(onCancel)="cancel()"
></c8y-stepper-buttons>
</cdk-step>
<cdk-step [label]="installAppTitle">
<div class="p-l-24 p-r-24" style="min-height: 385px;">
<div>
<div
class="h4 text-center p-t-8 m-b-8 animated fadeInDown"
style="animation-delay: 0.3s"
>
{{ installAppTitle | translate }}
</div>
<div
class="text-center animated fadeIn"
style="animation-delay: 0.5s"
>
<p translate>
Open
<strong>Google Play Store</strong>
or
<strong>Apple App Store</strong>
on your smartphone.
</p>
<p translate>
Find and install
<strong>Cumulocity IoT Sensor App</strong>
.
</p>
</div>
<div
class="center-block p-t-16 animated fadeInUp"
style="width: 181px; animation-delay: 0.5s"
>
<svg viewBox="0 -10 177 155">
<defs>
<linearGradient
id="sensorapp-icon-c"
x1="50%"
x2="50%"
y1="0%"
y2="100%"
>
<stop
offset="0%"
stop-color="#33AEE1"
/>
<stop
offset="100%"
stop-color="#1776BF"
/>
</linearGradient>
<rect
id="sensorapp-icon-b"
height="102.4"
width="102.4"
x="0"
y="0"
rx="12"
/>
<filter
id="sensorapp-icon-a"
height="225%"
width="225%"
x="-62.5%"
y="-31.2%"
filterUnits="objectBoundingBox"
>
<feOffset
dy="4"
in="SourceAlpha"
result="shadowOffsetOuter1"
/>
<feGaussianBlur
in="shadowOffsetOuter1"
result="shadowBlurOuter1"
stdDeviation="2"
/>
<feColorMatrix
values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0.1 0"
in="shadowBlurOuter1"
result="shadowMatrixOuter1"
/>
<feOffset
dy="8"
in="SourceAlpha"
result="shadowOffsetOuter2"
/>
<feGaussianBlur
in="shadowOffsetOuter2"
result="shadowBlurOuter2"
stdDeviation="4"
/>
<feColorMatrix
values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0.01 0"
in="shadowBlurOuter2"
result="shadowMatrixOuter2"
/>
<feOffset
dy="16"
in="SourceAlpha"
result="shadowOffsetOuter3"
/>
<feGaussianBlur
in="shadowOffsetOuter3"
result="shadowBlurOuter3"
stdDeviation="8"
/>
<feColorMatrix
values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0.03 0"
in="shadowBlurOuter3"
result="shadowMatrixOuter3"
/>
<feOffset
dy="32"
in="SourceAlpha"
result="shadowOffsetOuter4"
/>
<feGaussianBlur
in="shadowOffsetOuter4"
result="shadowBlurOuter4"
stdDeviation="16"
/>
<feColorMatrix
values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0.05 0"
in="shadowBlurOuter4"
result="shadowMatrixOuter4"
/>
<feMerge>
<feMergeNode in="shadowMatrixOuter1" />
<feMergeNode in="shadowMatrixOuter2" />
<feMergeNode in="shadowMatrixOuter3" />
<feMergeNode in="shadowMatrixOuter4" />
</feMerge>
</filter>
</defs>
<g
fill="none"
fill-rule="evenodd"
transform="translate(32)"
>
<use
xlink:href="#sensorapp-icon-b"
fill="#000"
filter="url(#sensorapp-icon-a)"
/>
<use
xlink:href="#sensorapp-icon-b"
fill="url(#sensorapp-icon-c)"
/>
<path
d="M51.5,49.3L51.5,49.3c2.6,0,5,0.5,7.2,1.6c1.4,0.7,2.8,1.7,4,2.8l3.4-3.2c-1.8-1.7-3.7-3.1-5.9-4c-2.6-1.2-5.5-1.8-8.6-1.8h0c-2.1,0-4.2,0.3-6.1,0.8c-3.1,0.9-5.9,2.6-8.4,4.9l3.4,3.2c1.6-1.5,3.4-2.7,5.3-3.4C47.5,49.6,49.4,49.3,51.5,49.3z"
fill="#FFF"
fill-rule="nonzero"
/>
<path
d="M51.5,58L51.5,58c1.9,0,3.5,0.6,4.9,1.6h0c0.2,0.2,0.5,0.4,0.7,0.6l3.4-3.4l0,0h0c-0.8-0.8-1.6-1.4-2.5-1.9v0c-1.9-1.1-4.1-1.7-6.5-1.7h0c-2.3,0-4.4,0.5-6.3,1.6v0c-1,0.5-1.8,1.2-2.7,2c0,0,0,0,0,0l3.4,3.4C47.5,58.8,49.3,58,51.5,58z"
fill="#FFF"
fill-rule="nonzero"
/>
<path
d="M51.6,61.8L51.6,61.8c-1.1,0-2.1,0.4-2.8,1.2l0,0c-0.8,0.8-1.2,1.7-1.2,2.8c0,1.1,0.4,2,1.2,2.8c0,0,0,0,0,0c0.8,0.8,1.7,1.2,2.8,1.2c0,0,0,0,0,0c1.1,0,2-0.4,2.8-1.2l0,0c0.8-0.8,1.2-1.7,1.2-2.8c0-1.1-0.4-2-1.2-2.8c0,0,0,0,0,0C53.7,62.1,52.7,61.8,51.6,61.8z"
fill="#FFF"
fill-rule="nonzero"
/>
<path
d="M51,78.2c0.2,0,0.3,0,0.5,0c0,0,0,0,0,0c3.5,0,6.5-1.2,9-3.6l0,0l-3.4-3.4c0,0,0,0,0,0c-1.4,1.3-3,2.1-4.8,2.2h0c-0.2,0-0.5,0-0.7,0c0,0,0,0,0,0c-2.2,0-4-0.7-5.6-2.2l-3.4,3.4C44.9,76.9,47.7,78.1,51,78.2z"
fill="#FFF"
fill-rule="nonzero"
/>
<path
d="M62.6,77.8c-3.1,3-6.8,4.4-11.1,4.4c-0.5,0-1.1,0-1.6-0.1c-3.7-0.3-6.9-1.8-9.5-4.4L37,81c3.3,3.2,7.2,5.1,11.7,5.6c0.9,0.1,1.9,0.2,2.8,0.2c5.7,0,10.5-1.9,14.5-5.8l0,0L62.6,77.8L62.6,77.8z"
fill="#FFF"
fill-rule="nonzero"
/>
<path
d="M81,38.5C78.7,32.4,72.7,28,65.8,28c-1.6,0-3.1,0.2-4.6,0.7C57.2,22.3,50.1,18,42,18c-12.3,0-22.2,9.8-22.5,22C15,42.6,12,47.5,12,53c0,8.3,6.7,15,15,15h17.4c-0.7-1.6-0.9-3,0-5H27c-5.5,0-10-4.5-10-10c0-4.7,3.3-8.7,7.7-9.7c-0.1-0.9-0.2-1.8-0.2-2.8C24.5,30.8,32.3,23,42,23c7.9,0,14.6,5.2,16.8,12.4c1.9-1.5,4.4-2.4,7-2.4c5.8,0,10.6,4.4,11.2,10H77c5.5,0,10,4.5,10,10c0,5.5-4.5,10-10,10H58.7c0.8,1.5,0.7,3.4,0,5H77c8.3,0,15-6.7,15-15C92,46.1,87.3,40.3,81,38.5z"
fill="#FFF"
fill-rule="nonzero"
/>
<text
fill="#58656D"
font-family="Roboto-Medium, Roboto"
font-size="14"
font-weight="400"
>
<tspan
y="124.7"
x="4.681"
>
Cumulocity IoT
</tspan>
<tspan
y="140.7"
x="15.197"
>
Sensor App
</tspan>
</text>
</g>
</svg>
</div>
</div>
<div class="row overflow-hidden">
<div class="col-xs-6">
<div class="p-16">
<a
class="center-block animated fadeInLeft"
style="width: 171px; animation-delay: 0.35s"
title="Google Play"
href="https://play.google.com/store/apps/details?id=com.softwareag.cumulocity.iotcloudsensor"
>
<svg viewBox="0 0 181 52">
<g
fill="none"
fill-rule="evenodd"
>
<rect
height="51.2"
width="170.4"
fill="#000"
rx="8"
/>
<path
d="M85.2480681,31.4279551 C82.5352946,31.4279551 80.324619,33.4905299 80.324619,36.3333431 C80.324619,39.1580952 82.5352946,41.2387311 85.2480681,41.2387311 C87.9608415,41.2387311 90.1715171,39.1580952 90.1715171,36.3333431 C90.1715171,33.4905299 87.9596375,31.4279551 85.2480681,31.4279551 Z M85.2480681,39.3061961 C83.7622436,39.3061961 82.4799073,38.0804511 82.4799073,36.3333431 C82.4799073,34.568174 83.7622436,33.3604901 85.2480681,33.3604901 C86.7338925,33.3604901 88.0162288,34.568174 88.0162288,36.3333431 C88.0162288,38.0804511 86.7338925,39.3061961 85.2480681,39.3061961 Z M74.5065447,31.4279551 C71.7937712,31.4279551 69.5830956,33.4905299 69.5830956,36.3333431 C69.5830956,39.1580952 71.7937712,41.2387311 74.5065447,41.2387311 C77.2193181,41.2387311 79.4299937,39.1580952 79.4299937,36.3333431 C79.4299937,33.4905299 77.2193181,31.4279551 74.5065447,31.4279551 Z M74.5065447,39.3061961 C73.0195161,39.3061961 71.7383839,38.0804511 71.7383839,36.3333431 C71.7383839,34.568174 73.0207202,33.3604901 74.5065447,33.3604901 C75.9923691,33.3604901 77.2747054,34.568174 77.2747054,36.3333431 C77.2747054,38.0804511 75.9923691,39.3061961 74.5065447,39.3061961 Z M61.7289361,32.9330447 L61.7289361,35.0136805 L66.7089765,35.0136805 C66.5596716,36.1840382 66.1695524,37.0389291 65.5759451,37.6337405 C64.8510939,38.3585917 63.7180625,39.1568912 61.7301401,39.1568912 C58.6645737,39.1568912 56.267267,36.6861361 56.267267,33.6193655 C56.267267,30.552595 58.6645737,28.0818399 61.7301401,28.0818399 C63.3833305,28.0818399 64.5922185,28.7320386 65.4832315,29.5676644 L66.9509949,28.099901 C65.7059848,26.9102782 64.0527944,26 61.7301401,26 C57.5303381,26 54,29.4183595 54,33.6181615 C54,37.8179635 57.5303381,41.236323 61.7301401,41.236323 C63.9974071,41.236323 65.7059848,40.4934107 67.0437084,39.0990957 C68.4187583,37.7240459 68.8462037,35.7915108 68.8462037,34.231034 C68.8462037,33.7482012 68.8088775,33.3014906 68.7342251,32.9306366 L61.7289361,32.9306366 L61.7289361,32.9330447 Z M113.984443,34.550113 C113.576262,33.4544077 112.331252,31.4291592 109.784641,31.4291592 C107.257294,31.4291592 105.158597,33.4170815 105.158597,36.3345472 C105.158597,39.0846469 107.239233,41.2399352 110.026659,41.2399352 C112.274661,41.2399352 113.575058,39.8648853 114.114482,39.0665858 L112.442027,37.9516154 C111.884542,38.7691801 111.122364,39.3074001 110.026659,39.3074001 C108.92975,39.3074001 108.149511,38.8053022 107.648617,37.8215757 L114.207196,35.1088022 L113.984443,34.550113 Z M107.29462,36.1852423 C107.239233,34.2900335 108.762384,33.324368 109.858089,33.324368 C110.71298,33.324368 111.437831,33.7518134 111.678645,34.3646859 L107.29462,36.1852423 Z M101.961787,40.9413254 L104.117075,40.9413254 L104.117075,26.5225671 L101.961787,26.5225671 L101.961787,40.9413254 Z M98.4314488,32.5248644 L98.3567964,32.5248644 C97.8739636,31.9493181 96.9444203,31.4291592 95.7740626,31.4291592 C93.3213686,31.4291592 91.0733668,33.5844475 91.0733668,36.3526082 C91.0733668,39.1027079 93.3213686,41.2399352 95.7740626,41.2399352 C96.9444203,41.2399352 97.8739636,40.7197762 98.3567964,40.1249648 L98.4314488,40.1249648 L98.4314488,40.8305508 C98.4314488,42.7076985 97.4284571,43.7106902 95.8113888,43.7106902 C94.4917263,43.7106902 93.6741616,42.7630858 93.3406338,41.9635822 L91.463486,42.7438207 C92.0029101,44.0442181 93.4333473,45.6420212 95.8113888,45.6420212 C98.3387353,45.6420212 100.474758,44.1561968 100.474758,40.531941 L100.474758,31.7241567 L98.4302447,31.7241567 L98.4302447,32.5248644 L98.4314488,32.5248644 Z M95.9606937,39.3061961 C94.4748693,39.3061961 93.2298592,38.0611859 93.2298592,36.3514042 C93.2298592,34.6235613 94.4748693,33.3604901 95.9606937,33.3604901 C97.4284571,33.3604901 98.5807537,34.6235613 98.5807537,36.3514042 C98.5807537,38.0611859 97.4284571,39.3061961 95.9606937,39.3061961 Z M124.080584,26.5225671 L118.923545,26.5225671 L118.923545,40.9413254 L121.075221,40.9413254 L121.075221,35.4784522 L124.080584,35.4784522 C126.46585,35.4784522 128.810177,33.7518134 128.810177,31.0005097 C128.810177,28.25041 126.46585,26.5225671 124.080584,26.5225671 Z M124.135971,33.4724688 L121.075221,33.4724688 L121.075221,28.5297546 L124.135971,28.5297546 C125.744611,28.5297546 126.658501,29.8614579 126.658501,31.0005097 C126.658501,32.1178882 125.744611,33.4724688 124.135971,33.4724688 Z M137.436147,31.4014655 C135.878078,31.4014655 134.264622,32.0877864 133.596362,33.6085289 L135.507224,34.4056243 C135.915404,33.6085289 136.675173,33.3484494 137.473473,33.3484494 C138.586035,33.3484494 139.717862,34.0167092 139.737128,35.2039239 L139.737128,35.3520247 C139.347008,35.1292714 138.512587,34.7957436 137.492738,34.7957436 C135.433775,34.7957436 133.337487,35.9275709 133.337487,38.0419208 C133.337487,39.9708436 135.025595,41.2134456 136.917192,41.2134456 C138.364486,41.2134456 139.161581,40.564451 139.662475,39.8034777 L139.737128,39.8034777 L139.737128,40.9160399 L141.814151,40.9160399 L141.814151,35.3881468 C141.812947,32.8294945 139.902085,31.4014655 137.436147,31.4014655 Z M137.176067,39.3037879 C136.471685,39.3037879 135.487959,38.9509949 135.487959,38.079247 C135.487959,36.9666848 136.7125,36.5392394 137.769674,36.5392394 C138.716075,36.5392394 139.160377,36.7439315 139.735923,37.0220721 C139.568558,38.3573876 138.418669,39.3037879 137.176067,39.3037879 Z M149.381742,31.7169323 L146.914599,37.9684724 L146.839946,37.9684724 L144.28009,31.7169323 L141.961048,31.7169323 L145.800833,40.4536764 L143.61183,45.3133096 L145.85622,45.3133096 L151.773028,31.7169323 L149.381742,31.7169323 Z M129.997392,40.9413254 L132.149068,40.9413254 L132.149068,26.5225671 L129.997392,26.5225671 L129.997392,40.9413254 Z"
fill="#FFF"
fill-rule="nonzero"
/>
<text
fill="#FFF"
font-family="Roboto-Regular, Roboto"
font-size="12"
letter-spacing=".96"
>
<tspan
y="17.4"
x="55.142"
translate
>
Download on the`Google Play`
</tspan>
</text>
<path
d="M12.7999992,39.4109698 L12.7999992,11.7922439 C12.7999992,10.8284641 13.3587517,9.99536961 14.1695974,9.59999943 L30.1457109,25.5968954 L14.1631721,41.5999975 C13.3557986,41.2034251 12.7999992,40.3722639 12.7999992,39.4109698 Z M35.2141861,30.6717551 L17.745324,40.770461 L31.5225942,26.9753948 L35.2141861,30.6717551 Z M40.6441621,23.6653717 C41.2251919,24.1106831 41.5999975,24.8123612 41.5999975,25.6016069 C41.5999975,26.3789928 41.2365497,27.071248 40.6704472,27.5173717 L36.9598716,29.6625343 L32.8993152,25.5968954 L36.9571133,21.5338234 L40.6441621,23.6653717 Z M17.7555622,10.4335163 L35.2114278,20.5246677 L31.5225942,24.2182336 L17.7555622,10.4335163 Z"
fill="#FFF"
fill-rule="nonzero"
/>
</g>
</svg>
</a>
</div>
</div>
<div class="col-xs-6">
<div class="p-16">
<a
class="center-block animated fadeInRight"
style="width: 171px; animation-delay: 0.35s"
title="Apple Store"
href="http://onelink.to/g39r8w"
>
<svg viewBox="0 0 181 52">
<g
fill="none"
fill-rule="evenodd"
>
<rect
height="51.2"
width="170.4"
fill="#000"
rx="8"
/>
<text
fill="#FFF"
font-family="Helvetica"
font-size="12"
letter-spacing=".96"
>
<tspan
y="17.4"
x="54.4"
translate
>
Download on the`App Store`
</tspan>
</text>
<text
fill="#FFF"
font-family="Helvetica"
font-size="23.2"
>
<tspan
y="41.4"
x="54.4"
>
App Store
</tspan>
</text>
<path
d="M38.5273755,38.1636701 C37.1235711,40.207449 35.6714645,42.2386565 33.378798,42.2812318 C31.1224426,42.323807 30.3990915,40.9506718 27.8243806,40.9506718 C25.2469674,40.9506718 24.4406919,42.2386565 22.3103107,42.323807 C20.0969712,42.4062756 18.4139767,40.1164319 16.9986034,38.081872 C14.10704,33.9219027 11.9000846,26.3195413 14.8682053,21.1890243 C16.3380115,18.6410976 18.9717322,17.0290047 21.8257685,16.9864462 C23.9993852,16.9466199 26.0527362,18.4453856 27.3803717,18.4453856 C28.7100338,18.4453856 31.202327,16.6459449 33.8224691,16.9098778 C34.9192335,16.9549841 37.9974022,17.3498611 39.9742465,20.2297237 C39.8180243,20.3319546 36.3000689,22.3695987 36.3429667,26.6147184 C36.3860334,31.6856972 40.806362,33.3712742 40.8577042,33.394238 C40.8176776,33.5134151 40.1510732,35.8005769 38.5273755,38.1636701 Z M28.9012161,11.3393106 C30.1146826,9.92365046 32.1649936,8.87068442 33.8570913,8.79993243 C34.0732691,10.7663552 33.2786469,12.7354933 32.1050381,14.154422 C30.9290648,15.5708029 29.0040694,16.6741384 27.1148784,16.5268181 C26.8581673,14.6029538 27.8103628,12.5965204 28.9012161,11.3393106 Z"
fill="#FFF"
fill-rule="nonzero"
/>
</g>
</svg>
</a>
</div>
</div>
</div>
<p
class="text-center p-b-24 animated fadeIn"
style="animation-delay: 1s"
translate
>
Click
<strong>Next</strong>
once you have the application installed.
</p>
</div>
<c8y-stepper-buttons
class="modal-footer d-block bg-component separator-top sticky-bottom"
(onBack)="back()"
(onNext)="next($event)"
(onCancel)="cancel()"
></c8y-stepper-buttons>
</cdk-step>
<cdk-step [label]="twoOptionsToConnectTitle">
<div class="p-l-24 p-r-24">
<div
class="h4 text-center m-b-8 animated fadeInDown"
style="animation-delay: 0.3s"
>
{{ twoOptionsToConnectTitle | translate }}
</div>
<div class="row">
<div class="col-xs-6">
<div
class="animated fadeIn"
style="animation-delay: 0.35s"
>
<p
class="text-info"
translate
>
Option 1: QR code scan
</p>
<p translate>
Press
<strong>Scan QR code</strong>
and use the code below.
</p>
</div>
<div class="row overflow-hidden">
<qrcode
class="center-block animated fadeInUp"
style="animation-delay: 0.75s"
*ngIf="registrationData"
[qrdata]="registrationData"
[width]="288"
[errorCorrectionLevel]="'M'"
[elementType]="'svg'"
></qrcode>
</div>
</div>
<div class="col-xs-6">
<div
class="animated fadeIn"
style="animation-delay: 0.55s"
>
<p
class="text-info"
translate
>
Option 2: Manual registration
</p>
<p translate>
Press
<strong>Manual registration</strong>
and enter the following data into your smartphone.
</p>
</div>
<div class="m-t-16 overflow-hidden">
<svg
class="animated fadeInUp"
style="animation-delay: 0.95s"
viewBox="0 0 287 305"
>
<defs>
<rect
id="login-screen-a"
height="306"
width="255"
x="0"
y="0"
/>
<polygon
id="login-screen-c"
points="6.898 5.644 55.186 5.644 55.186 8.153 6.898 8.153"
/>
</defs>
<g
fill="none"
fill-rule="evenodd"
>
<mask
id="login-screen-b"
fill="#fff"
>
<use xlink:href="#login-screen-a" />
</mask>
<g mask="url(#login-screen-b)">
<g transform="translate(2)">
<path
d="M7.38308195,146.47702 L4.61442622,146.47702 C3.09169154,146.47702 1.71398319,147.082069 0.716388292,148.057604 C-0.288641051,149.04041 -0.908444414,150.39865 -0.908444414,151.897853 L-0.908444414,183.448832 C-0.908444414,184.948035 -0.288641051,186.306275 0.716388292,187.28908 C1.71398319,188.264616 3.09169154,188.869665 4.61442622,188.869665 L7.38308195,188.869665 C8.90581663,188.869665 10.283525,188.264616 11.2811199,187.28908 C12.2861492,186.306275 12.9059526,184.948035 12.9059526,183.448832 L12.9059526,151.897853 C12.9059526,150.39865 12.2861492,149.04041 11.2811199,148.057604 C10.283525,147.082069 8.90581663,146.47702 7.38308195,146.47702 Z M253.455992,117.439118 C253.455992,116.57847 253.289564,115.89251 253.006875,115.340103 C252.679825,114.701009 252.195532,114.225904 251.57447,113.879494 C250.346479,113.194557 248.492308,113.061843 246.328777,113.062082 C244.332904,113.06945 242.585176,113.229114 241.417948,113.929711 C240.344603,114.573957 239.641595,115.621252 239.641595,117.439118 L239.641595,171.364789 C239.641595,172.225436 239.808022,172.911396 240.090711,173.463804 C240.417761,174.102898 240.902054,174.578002 241.523116,174.924413 C242.751108,175.60935 244.605278,175.742063 246.768809,175.741825 C248.764682,175.734456 250.51241,175.574793 251.679638,174.874196 C252.752983,174.229949 253.455992,173.182654 253.455992,171.364789 L253.455992,117.439118 Z M7.38308195,98.7408374 L4.61442622,98.7408374 C3.09168636,98.7408374 1.71397154,99.3459143 0.71637263,100.321501 C-0.288644505,101.304341 -0.908444414,102.66263 -0.908444414,104.161888 L-0.908444414,136.905836 C-0.908444414,138.405094 -0.288644505,139.763382 0.71637263,140.746223 C1.71397154,141.721809 3.09168636,142.326886 4.61442622,142.326886 L7.38308195,142.326886 C8.90582182,142.326886 10.2835366,141.721809 11.2811355,140.746223 C12.2861527,139.763382 12.9059526,138.405094 12.9059526,136.905836 L12.9059526,104.161888 C12.9059526,102.66263 12.2861527,101.304341 11.2811355,100.321501 C10.2835366,99.3459143 8.90582182,98.7408374 7.38308195,98.7408374 Z M10.1517377,64.1321048 L1.84577049,64.1321048 C1.08690926,64.1321048 0.400524723,64.4358637 -0.0965613404,64.9250099 C-0.598984265,65.4194076 -0.908444414,66.1027717 -0.908444414,66.8568372 L-0.908444414,83.5121388 C-0.908444414,84.2662044 -0.598984265,84.9495685 -0.0965613404,85.4439662 C0.400524723,85.9331124 1.08690926,86.2368713 1.84577049,86.2368713 L10.1517377,86.2368713 C10.9105989,86.2368713 11.5969835,85.9331124 12.0940695,85.4439662 C12.5964924,84.9495685 12.9059526,84.2662044 12.9059526,83.5121388 L12.9059526,66.8568372 C12.9059526,66.1027717 12.5964924,65.4194076 12.0940695,64.9250099 C11.5969835,64.4358637 10.9105989,64.1321048 10.1517377,64.1321048 Z"
fill="#FFF"
stroke="#CCCDC9"
stroke-width="1.817"
/>
<path
d="M33.5930229,0 L218.954524,0 C236.513532,0 250.747921,14.1590938 250.747921,31.6252212 L250.747921,474.378317 C250.747921,491.844445 236.513532,506.003539 218.954524,506.003539 L33.5930229,506.003539 C16.0340148,506.003539 1.79962623,491.844445 1.79962623,474.378317 L1.79962623,31.6252212 C1.79962623,14.1590938 16.0340148,0 33.5930229,0 Z"
fill="#394852"
/>
<path
d="M240.113079,94.605309 L240.112903,41.9917101 C240.111425,38.1274958 240.096801,35.7038103 239.968443,33.3966696 C239.873818,31.1365982 239.524087,28.8939701 238.925823,26.7114061 C237.960259,22.8182806 235.959037,19.2549752 233.116799,16.3817503 C230.251052,13.5738971 226.679636,11.5845622 222.776513,10.6222317 C220.580421,10.0246985 218.324184,9.67521033 216.049985,9.58049224 C213.822086,9.45757463 211.487399,9.43922122 207.86611,9.43670786 L193.46393,9.40388135 C191.790396,9.24852633 190.120371,9.79656085 188.740954,11.0521406 C187.790606,12.1604422 187.361559,13.6185195 187.557881,15.0597856 C187.622307,16.5426888 187.48783,18.0275822 187.151489,19.5052379 C186.728399,21.5761576 185.66886,23.4648429 184.096596,24.9326967 C182.577145,26.4198303 180.686118,27.4753541 178.619657,27.9907975 C176.447678,28.3449098 174.244818,28.4793325 172.045122,28.3920414 L80.6380774,28.3920414 L79.8614472,28.4120378 C77.9090342,28.4404094 75.9574202,28.2981791 74.0291032,27.9867437 C71.9554369,27.5622112 70.0644085,26.5093879 68.5935749,24.9488037 C67.0984097,23.4355646 66.037438,21.5518946 65.5207919,19.4932962 C65.2546737,18.0198526 65.1206899,16.5256833 65.1203182,15.0285536 C65.3061644,13.5973434 64.8764744,12.1523871 63.8096494,10.9258246 C62.4838688,9.73385222 60.6968025,9.18943733 58.9312627,9.43629496 L44.8087832,9.43670753 C41.1888031,9.43921968 38.854755,9.45755221 36.6284554,9.58028608 C34.3590738,9.67460916 32.107503,10.022496 29.9161911,10.6173905 C26.0061514,11.577993 22.4276689,13.5692594 19.5420579,16.3968097 C16.7196121,19.2502622 14.7203309,22.8065311 13.753019,26.6928366 C13.1522709,28.8800048 12.8009448,31.1270772 12.7057758,33.3920326 C12.5823013,35.6091548 12.5638514,37.9329717 12.5613261,41.537158 L12.5609083,94.6192271 L12.4344679,462.171027 L12.4352833,464.543752 C12.4390636,467.943344 12.4609049,470.196572 12.5790787,472.349831 C12.6735441,474.637526 13.0226185,476.907641 13.6197043,479.117002 C14.5749758,483.153945 16.6149886,486.748754 19.4160901,489.575326 C22.2160058,492.400701 25.7763005,494.458558 29.7745226,495.424772 C31.9691557,496.029561 34.2238023,496.383332 36.4963747,496.479328 C38.8165059,496.609114 41.2524845,496.623894 45.1376167,496.625386 L207.785016,496.625115 C211.409267,496.622466 213.827119,496.603539 216.045392,496.479607 C218.315186,496.384037 220.567506,496.031377 222.759579,495.42824 C226.753167,494.465692 230.277773,492.414883 233.045718,489.598308 C235.822061,486.773186 237.837217,483.176851 238.796896,479.134958 C239.408372,476.922432 239.884421,474.644978 239.968452,472.35078 C240.096822,470.011514 240.111425,467.554568 240.112903,463.637423 L240.113079,94.605309 Z"
fill="#FFF"
stroke="#CCCDC9"
stroke-width="2.725"
/>
<g
fill="#E4E4DF"
transform="translate(109.777 11.934)"
>
<path
d="M42.8910917,6.56372515 C41.0689305,6.56372515 39.591777,5.09438522 39.591777,3.28186257 C39.591777,1.46933992 41.0689305,0 42.8910917,0 C44.7132529,0 46.1904065,1.46933992 46.1904065,3.28186257 C46.1904065,5.09438522 44.7132529,6.56372515 42.8910917,6.56372515 Z"
/>
<rect
height="2.984"
y="1.79"
width="33.593"
rx="1.492"
/>
</g>
<g transform="translate(31 40)">
<g clip-path="url(#clip1_648_20203)" transform="translate(-37, -35)">
<path
d="M124.66 86.8807V74.5365H121.632V89.7988H131.387V86.8807H124.66Z"
fill="#212121"
/>
<path
d="M140.172 74.2635C135.738 74.2635 132.291 77.7275 132.291 82.1362C132.291 86.5658 135.759 90.0088 140.172 90.0088C144.522 90.0088 148.052 86.4818 148.052 82.1362C148.052 77.8115 144.522 74.2635 140.172 74.2635ZM144.984 82.1571C144.984 84.9283 142.883 87.1116 140.172 87.1116C137.461 87.1116 135.339 84.9493 135.339 82.1571C135.339 79.386 137.461 77.2027 140.172 77.2027C142.883 77.2236 144.984 79.386 144.984 82.1571Z"
fill="#212121"
/>
<path
d="M64.0463 77.2236C65.8544 77.2236 67.3681 78.0844 68.3142 79.6589L68.4614 79.9108L71.0684 78.3993L70.9212 78.1474C69.5126 75.7121 66.9476 74.2845 64.0463 74.2845C59.6101 74.2845 56.1621 77.7485 56.1621 82.1571C56.1621 86.5868 59.6311 90.0297 64.0463 90.0297C66.9476 90.0297 69.5126 88.5812 70.9212 86.1669L71.0684 85.915L68.4614 84.4035L68.3142 84.6554C67.3681 86.2299 65.8333 87.0906 64.0463 87.0906C61.3341 87.0906 59.2106 84.9283 59.2106 82.1362C59.1896 79.386 61.3131 77.2236 64.0463 77.2236Z"
fill="#212121"
/>
<path
d="M82.5689 83.7947C82.5689 85.8521 81.4125 87.1117 79.4783 87.1117C77.523 87.1117 76.3667 85.873 76.3667 83.7947V74.5365H73.3391V83.7527C73.3391 87.5105 75.82 90.0508 79.4993 90.0508C83.1575 90.0508 85.6384 87.5105 85.6384 83.7527V74.5365H82.6109V83.7947H82.5689Z"
fill="#212121"
/>
<path
d="M115.787 83.7947C115.787 85.8521 114.631 87.1117 112.697 87.1117C110.741 87.1117 109.585 85.873 109.585 83.7947V74.5365H106.558V83.7527C106.558 87.5105 109.038 90.0508 112.718 90.0508C116.376 90.0508 118.857 87.5105 118.857 83.7527V74.5365H115.829V83.7947H115.787Z"
fill="#212121"
/>
<path
d="M158.109 77.2236C159.918 77.2236 161.431 78.0844 162.377 79.6589L162.525 79.9108L165.132 78.3993L164.984 78.1474C163.576 75.7121 161.011 74.2845 158.109 74.2845C153.673 74.2845 150.225 77.7485 150.225 82.1571C150.225 86.5868 153.694 90.0297 158.109 90.0297C161.011 90.0297 163.576 88.5812 164.984 86.1669L165.132 85.915L162.525 84.4035L162.377 84.6554C161.431 86.2299 159.897 87.0906 158.109 87.0906C155.397 87.0906 153.274 84.9283 153.274 82.1362C153.253 79.386 155.397 77.2236 158.109 77.2236Z"
fill="#212121"
/>
<path
d="M170.766 74.5365H167.739V89.7988H170.766V74.5365Z"
fill="#212121"
/>
<path
d="M173.394 77.4546H177.662V89.7988H180.69V77.4546H184.958V74.5365H173.394V77.4546Z"
fill="#212121"
/>
<path
d="M196.878 74.5365L193.094 80.3307L189.352 74.5365H185.778L191.58 83.3958V89.7988H194.629V83.4168L200.453 74.5365H196.878Z"
fill="#212121"
/>
<path
d="M96.0455 82.4301L91.1047 74.5365H88.4136V89.7988H91.4411V80.4987L95.0783 86.2929H97.0546L100.671 80.5197V89.7988H103.698V74.5365H101.007L96.0455 82.4301Z"
fill="#212121"
/>
<path
d="M123.131 69.3842C125.974 69.3842 128.311 67.0704 128.311 64.2097C128.311 61.3699 125.995 59.0351 123.131 59.0351C120.267 59.0351 117.951 61.3489 117.951 64.2097C117.951 67.0494 120.267 69.3842 123.131 69.3842Z"
fill="#212121"
/>
<path
d="M134.68 59.2136H131.225V69.2057H134.68V59.2136Z"
fill="#212121"
/>
<path
d="M142.773 69.3845C145.616 69.3845 147.953 67.0705 147.953 64.2097C147.953 61.3698 145.637 59.0348 142.773 59.0348C139.91 59.0348 137.594 61.3488 137.594 64.2097C137.615 67.0495 139.91 69.3845 142.773 69.3845Z"
fill="#212121"
/>
<path
d="M156.047 69.3845C158.89 69.3845 161.227 67.0705 161.227 64.2097C161.227 61.3698 158.911 59.0348 156.047 59.0348C153.204 59.0348 150.867 61.3488 150.867 64.2097C150.888 67.0495 153.204 69.3845 156.047 69.3845Z"
fill="#212121"
/>
<path
d="M169.321 69.3845C172.163 69.3845 174.501 67.0705 174.501 64.2097C174.501 61.3698 172.184 59.0348 169.321 59.0348C166.457 59.0348 164.141 61.3488 164.141 64.2097C164.162 67.0495 166.478 69.3845 169.321 69.3845Z"
fill="#212121"
/>
<path
d="M182.594 69.3845C185.437 69.3845 187.774 67.0705 187.774 64.2097C187.774 61.3698 185.458 59.0348 182.594 59.0348C179.752 59.0348 177.414 61.3488 177.414 64.2097C177.414 67.0495 179.731 69.3845 182.594 69.3845Z"
fill="#212121"
/>
<path
d="M194.143 59.2136H190.688V69.2057H194.143V59.2136Z"
fill="#212121"
/>
<path
d="M200.512 59.2136H197.057V69.2057H200.512V59.2136Z"
fill="#212121"
/>
</g>
<g transform="translate(0 91.56)">
<path
d="M182.491525,6.58474576 L2.50847458,6.58474576 C1.90236547,6.58474576 1.35363665,6.83042002 0.956435116,7.22762156 C0.55923358,7.62482309 0.313559322,8.17355191 0.313559322,8.77966102 L0.313559322,38.8813559 C0.313559322,39.487465 0.55923358,40.0361939 0.956435116,40.4333954 C1.35363665,40.8305969 1.90236547,41.0762712 2.50847458,41.0762712 L182.491525,41.0762712 C183.097635,41.0762712 183.646363,40.8305969 184.043565,40.4333954 C184.440766,40.0361939 184.686441,39.487465 184.686441,38.8813559 L184.686441,8.77966102 C184.686441,8.17355191 184.440766,7.62482309 184.043565,7.22762156 C183.646363,6.83042002 183.097635,6.58474576 182.491525,6.58474576 Z"
stroke="#828282"
stroke-width=".627"
/>
<rect
height="10.661"
width="43.898"
x="6.898"
fill="#FFF"
/>
<text
fill="#000"
fill-opacity=".87"
font-family="Roboto-Regular, Roboto"
font-size="7.525"
letter-spacing=".251"
>
<tspan
y="7.627"
x="10.034"
translate
>
Tenant
</tspan>
</text>
<text
fill="#000"
fill-opacity=".87"
font-family="Roboto-Regular, Roboto"
font-size="12"
letter-spacing=".094"
>
<tspan
y="28.305"
x="10.034"
>
{{ this.tenantId }}
</tspan>
</text>
</g>
<g transform="translate(0 153.017)">
<path
d="M182.491525,6.58474576 L2.50847458,6.58474576 C1.90236547,6.58474576 1.35363665,6.83042002 0.956435116,7.22762156 C0.55923358,7.62482309 0.313559322,8.17355191 0.313559322,8.77966102 L0.313559322,38.8813559 C0.313559322,39.487465 0.55923358,40.0361939 0.956435116,40.4333954 C1.35363665,40.8305969 1.90236547,41.0762712 2.50847458,41.0762712 L182.491525,41.0762712 C183.097635,41.0762712 183.646363,40.8305969 184.043565,40.4333954 C184.440766,40.0361939 184.686441,39.487465 184.686441,38.8813559 L184.686441,8.77966102 C184.686441,8.17355191 184.440766,7.62482309 184.043565,7.22762156 C183.646363,6.83042002 183.097635,6.58474576 182.491525,6.58474576 Z"
stroke="#828282"
stroke-width=".627"
/>
<rect
height="10.661"
width="43.898"
x="6.898"
fill="#FFF"
/>
<text
fill="#000"
fill-opacity=".87"
font-family="Roboto-Regular, Roboto"
font-size="7.525"
letter-spacing=".251"
>
<tspan
y="7.627"
x="10.034"
translate
>
Instance
</tspan>
</text>
<text
fill="#000"
fill-opacity=".87"
font-family="Roboto-Regular, Roboto"
font-size="12"
letter-spacing=".094"
>
<tspan
y="28.305"
x="10.034"
>
{{ this.instance }}
</tspan>
</text>
<polygon
fill="#121212"
points="164.8 20.486 169.949 27.175 175.098 20.486"
/>
</g>
<g transform="translate(0 209.458)">
<path
d="M182.491525,6.58474576 L2.50847458,6.58474576 C1.90236547,6.58474576 1.35363665,6.83042002 0.956435116,7.22762156 C0.55923358,7.62482309 0.313559322,8.17355191 0.313559322,8.77966102 L0.313559322,38.8813559 C0.313559322,39.487465 0.55923358,40.0361939 0.956435116,40.4333954 C1.35363665,40.8305969 1.90236547,41.0762712 2.50847458,41.0762712 L182.491525,41.0762712 C183.097635,41.0762712 183.646363,40.8305969 184.043565,40.4333954 C184.440766,40.0361939 184.686441,39.487465 184.686441,38.8813559 L184.686441,8.77966102 C184.686441,8.17355191 184.440766,7.62482309 184.043565,7.22762156 C183.646363,6.83042002 183.097635,6.58474576 182.491525,6.58474576 Z"
stroke="#191919"
stroke-opacity=".32"
stroke-width=".627"
/>
<use
xlink:href="#login-screen-c"
fill="#FFF"
/>
<rect
height="10.661"
width="48.288"
x="6.898"
fill="#FFF"
/>
<text
fill="#000"
fill-opacity=".87"
font-family="Roboto-Regular, Roboto"
font-size="7.525"
letter-spacing=".251"
>
<tspan
y="7.627"
x="10.034"
translate
>
Device ID
</tspan>
</text>
<text
fill="#000"
fill-opacity=".87"
font-family="Roboto-Regular, Roboto"
font-size="12"
letter-spacing=".094"
>
<tspan
y="28.305"
x="10.034"
>
{{ this.deviceId }}
</tspan>
</text>
</g>
</g>
</g>
</g>
</g>
</svg>
</div>
</div>
</div>
</div>
<div class="modal-footer d-block bg-component separator-top sticky-bottom">
<button
class="btn btn-default"
title="{{ 'Cancel' | translate }}"
type="button"
(click)="cancel()"
>
{{ 'Cancel' | translate }}
</button>
<button
class="btn btn-primary btn-pending"
title="{{ waitOrRetry | translate }}"
type="button"
>
{{ waitOrRetry | translate }}
</button>
</div>
</cdk-step>
<cdk-step
[label]="resultTitle"
[stepControl]="resultControl"
></cdk-step>
</c8y-stepper>
<!-- SUCCESS CONTAINER -->
<ng-container *ngIf="success === true">
<div
class="overflow-hidden"
style="height: 430px"
>
<div class="fit-h">
<div class="p-t-24">
<svg width="663" height="571" style="max-height: 230px" class="animated fadeInDown"
viewBox="0 0 663 571" fill="none" xmlns="http://www.w3.org/2000/svg">
<g clip-path="url(#clip0_666_21648)">
<path fill-rule="evenodd" clip-rule="evenodd" d="M344.011 371.799C364.413 383.547 364.407 402.613 343.996 414.366C323.586 426.118 290.476 426.122 270.074 414.374C249.671 402.626 249.678 383.56 270.088 371.807C290.498 360.055 323.608 360.051 344.011 371.799ZM437.243 360.673C457.653 348.921 457.659 329.855 437.257 318.107C416.854 306.359 383.744 306.363 363.334 318.115C342.924 329.868 342.917 348.933 363.32 360.682C383.722 372.43 416.832 372.426 437.243 360.673ZM532.776 262.345C553.553 273.882 554.147 292.936 534.104 304.904C514.061 316.872 480.97 317.222 460.193 305.685C439.416 294.148 438.822 275.094 458.865 263.126C478.909 251.158 512 250.808 532.776 262.345ZM518.508 230.2L543.12 216.028L614.529 257.146L589.916 271.318L518.508 230.2ZM249.299 468.903C269.709 457.151 269.716 438.085 249.313 426.337C228.911 414.589 195.801 414.593 175.391 426.345C154.98 438.098 154.974 457.163 175.376 468.911C195.779 480.659 228.889 480.656 249.299 468.903ZM565.137 203.36L589.749 189.188L661.158 230.306L636.545 244.478L565.137 203.36ZM121.159 459.699L96.5464 473.871L167.955 514.989L192.567 500.817L121.159 459.699ZM111.49 506.379C131.892 518.127 131.886 537.192 111.475 548.945C91.0653 560.697 57.9551 560.701 37.5527 548.953C17.1503 537.205 17.2066 518.168 37.6168 506.416C58.027 494.663 91.0872 494.63 111.49 506.379Z" fill="#D4D9DE"/>
<path fill-rule="evenodd" clip-rule="evenodd" d="M287.106 398.697C274.514 392.288 266.651 377.41 266.651 355.871C266.651 314.449 295.731 264.082 331.603 243.371C349.538 233.016 365.776 232.035 377.53 238.821L355.88 226.321C344.126 219.535 327.888 220.516 309.952 230.871C274.08 251.582 245 301.949 245 343.371C245 364.91 252.863 379.788 265.456 386.197L287.106 398.697Z" fill="url(#paint0_linear_666_21648)" stroke="#212121" stroke-linejoin="round"/>
<path d="M396.554 280.871C396.554 322.292 367.474 372.66 331.602 393.371C295.73 414.082 266.65 397.292 266.65 355.871C266.65 314.449 295.73 264.082 331.602 243.371C367.474 222.66 396.554 239.449 396.554 280.871Z" fill="#0F8814" stroke="#212121" stroke-linejoin="round"/>
<path d="M328.384 364.747L295 345.473L310.724 318.239L328.263 328.365L361.646 270.543L377.491 279.691L328.384 364.747Z" fill="#E3E5E8" stroke="#212121" stroke-linejoin="round"/>
<path fill-rule="evenodd" clip-rule="evenodd" d="M481.881 279.28C481.717 280.207 480.921 281 479.547 281.423C476.904 282.236 473.124 281.374 471.103 279.496C470.093 278.558 469.715 277.543 469.919 276.662L458.638 325.372C458.434 326.254 458.812 327.268 459.822 328.207C461.842 330.084 465.623 330.947 468.266 330.134C469.64 329.711 470.436 328.918 470.6 327.991L481.881 279.28Z" fill="url(#paint1_linear_666_21648)"/>
<path d="M480.675 276.553C482.695 278.43 482.19 280.611 479.547 281.424C476.904 282.237 473.124 281.374 471.104 279.497C469.084 277.62 469.589 275.439 472.232 274.626C474.875 273.813 478.655 274.676 480.675 276.553Z" fill="#8B96A0"/>
<path fill-rule="evenodd" clip-rule="evenodd" d="M467.694 287.278C467.53 288.206 466.734 288.999 465.359 289.422C462.716 290.236 458.935 289.375 456.915 287.499C455.905 286.561 455.526 285.547 455.73 284.665L444.447 333.375C444.242 334.257 444.621 335.271 445.631 336.209C447.651 338.085 451.432 338.946 454.075 338.132C455.45 337.709 456.246 336.916 456.41 335.988L467.694 287.278Z" fill="url(#paint2_linear_666_21648)"/>
<path d="M466.488 284.552C468.508 286.428 468.003 288.609 465.359 289.423C462.716 290.237 458.935 289.376 456.915 287.5C454.895 285.624 455.4 283.443 458.043 282.629C460.687 281.815 464.467 282.676 466.488 284.552Z" fill="#8B96A0"/>
<path fill-rule="evenodd" clip-rule="evenodd" d="M493.63 228.552C493.466 229.479 492.67 230.272 491.295 230.695C488.652 231.508 484.872 230.645 482.852 228.768C481.842 227.83 481.463 226.815 481.667 225.934L470.386 274.644C470.182 275.526 470.561 276.54 471.571 277.479C473.591 279.356 477.371 280.218 480.014 279.405C481.389 278.982 482.185 278.19 482.349 277.262L493.63 228.552Z" fill="url(#paint3_linear_666_21648)"/>
<path d="M492.424 225.824C494.444 227.701 493.939 229.882 491.296 230.695C488.652 231.508 484.872 230.646 482.852 228.769C480.832 226.892 481.337 224.711 483.98 223.898C486.623 223.085 490.404 223.947 492.424 225.824Z" fill="#8B96A0"/>
<path fill-rule="evenodd" clip-rule="evenodd" d="M469.361 227.032C469.197 227.96 468.401 228.752 467.027 229.174C464.385 229.986 460.605 229.12 458.585 227.242C457.575 226.302 457.197 225.287 457.401 224.406L446.122 273.117C445.918 273.999 446.297 275.013 447.307 275.953C449.327 277.832 453.106 278.697 455.749 277.885C457.123 277.463 457.919 276.671 458.083 275.744L469.361 227.032Z" fill="url(#paint4_linear_666_21648)"/>
<path d="M468.155 224.304C470.175 226.183 469.67 228.363 467.027 229.175C464.384 229.986 460.605 229.121 458.585 227.242C456.565 225.364 457.07 223.183 459.713 222.371C462.356 221.56 466.135 222.425 468.155 224.304Z" fill="#8B96A0"/>
<path fill-rule="evenodd" clip-rule="evenodd" d="M501.508 234.49C501.344 235.417 500.548 236.21 499.174 236.632C496.531 237.443 492.751 236.578 490.732 234.699C489.722 233.76 489.343 232.745 489.547 231.863L478.269 280.575C478.065 281.456 478.443 282.471 479.453 283.41C481.473 285.289 485.253 286.154 487.895 285.343C489.269 284.921 490.066 284.129 490.229 283.201L501.508 234.49Z" fill="url(#paint5_linear_666_21648)"/>
<path d="M500.301 231.761C502.321 233.64 501.816 235.821 499.174 236.632C496.531 237.444 492.751 236.579 490.732 234.7C488.712 232.821 489.217 230.64 491.86 229.829C494.502 229.017 498.282 229.883 500.301 231.761Z" fill="#8B96A0"/>
<path fill-rule="evenodd" clip-rule="evenodd" d="M479.445 236.551C479.282 237.478 478.485 238.271 477.111 238.695C474.467 239.509 470.687 238.648 468.666 236.772C467.656 235.834 467.278 234.819 467.482 233.938L456.198 282.648C455.994 283.529 456.373 284.543 457.383 285.482C459.403 287.358 463.183 288.219 465.827 287.405C467.201 286.981 467.998 286.188 468.161 285.261L479.445 236.551Z" fill="url(#paint6_linear_666_21648)"/>
<path d="M478.239 233.824C480.259 235.7 479.754 237.881 477.111 238.695C474.467 239.509 470.687 238.648 468.667 236.772C466.646 234.896 467.152 232.715 469.795 231.901C472.438 231.087 476.219 231.948 478.239 233.824Z" fill="#8B96A0"/>
<path fill-rule="evenodd" clip-rule="evenodd" d="M495.459 176.775C495.114 178.265 495.752 179.98 497.455 181.566C500.861 184.739 507.237 186.195 511.698 184.82C513.928 184.132 515.256 182.866 515.602 181.376L504.113 230.952C503.768 232.442 502.439 233.708 500.209 234.395C495.749 235.771 489.372 234.314 485.966 231.142C484.263 229.556 483.625 227.841 483.97 226.35L495.459 176.775Z" fill="url(#paint7_linear_666_21648)" stroke="#212121" stroke-linejoin="round"/>
<path fill-rule="evenodd" clip-rule="evenodd" d="M468.506 169.987C468.161 171.477 468.799 173.192 470.502 174.778C473.908 177.951 480.285 179.408 484.745 178.032C486.975 177.344 488.304 176.078 488.649 174.588L477.16 224.164C476.815 225.654 475.486 226.92 473.256 227.608C468.796 228.983 462.42 227.526 459.013 224.354C457.31 222.768 456.672 221.053 457.018 219.563L468.506 169.987Z" fill="url(#paint8_linear_666_21648)" stroke="#212121" stroke-linejoin="round"/>
<path fill-rule="evenodd" clip-rule="evenodd" d="M476.041 179.269C475.696 180.759 476.334 182.474 478.037 184.06C481.443 187.233 487.82 188.689 492.28 187.314C494.51 186.626 495.839 185.36 496.184 183.87L484.696 233.446C484.35 234.936 483.022 236.201 480.792 236.889C476.332 238.265 469.955 236.808 466.549 233.636C464.846 232.049 464.208 230.335 464.553 228.844L476.041 179.269Z" fill="url(#paint9_linear_666_21648)" stroke="#212121" stroke-linejoin="round"/>
<path d="M506.932 205.043L521.967 140.115L533.765 196.804L506.932 205.043Z" fill="#8B96A0" stroke="#212121" stroke-linejoin="round"/>
<path fill-rule="evenodd" clip-rule="evenodd" d="M549.478 60.2403C548.406 64.8677 544.28 68.7977 537.356 70.9334C523.507 75.2048 503.706 70.6817 493.13 60.8308C487.842 55.9054 485.861 50.5805 486.934 45.9531L451.261 199.889C450.189 204.517 452.169 209.842 457.458 214.767C468.034 224.618 487.834 229.141 501.683 224.87C508.608 222.734 512.733 218.804 513.805 214.176L549.478 60.2403Z" fill="url(#paint10_linear_666_21648)" stroke="#212121" stroke-linejoin="round"/>
<path d="M511.496 127.921C510.465 131.77 512.749 134.055 516.596 133.024C520.442 131.994 524.4 128.036 525.431 124.188C526.462 120.339 524.178 118.054 520.331 119.084C516.484 120.115 512.527 124.073 511.496 127.921ZM511.812 150.879C507.965 151.909 505.681 149.624 506.712 145.776C507.743 141.927 511.7 137.969 515.547 136.939C519.393 135.908 521.678 138.194 520.647 142.042C519.616 145.89 515.658 149.848 511.812 150.879ZM502.001 163.356C500.97 167.205 503.254 169.49 507.101 168.459C510.948 167.429 514.905 163.471 515.936 159.622C516.967 155.774 514.683 153.489 510.836 154.52C506.989 155.55 503.032 159.508 502.001 163.356ZM502.367 186.561C498.501 187.662 496.146 185.449 497.107 181.619C498.069 177.789 501.982 173.792 505.848 172.691C509.714 171.59 512.069 173.803 511.108 177.633C510.146 181.463 506.233 185.46 502.367 186.561ZM507.924 188.707L506.68 193.348L493.217 196.955L494.461 192.314L507.924 188.707ZM505.569 197.497L504.325 202.138L490.862 205.745L492.105 201.105L505.569 197.497ZM527.915 113.708L529.158 109.068L515.695 112.675L514.451 117.316L527.915 113.708ZM523.475 106.957C519.629 107.988 517.344 105.702 518.376 101.854C519.407 98.006 523.364 94.0479 527.211 93.0172C531.057 91.9865 533.332 94.2748 532.301 98.1229C531.27 101.971 527.322 105.927 523.475 106.957Z" fill="#E3E5E8"/>
<path fill-rule="evenodd" clip-rule="evenodd" d="M429.716 219.537L472.904 144.01L468.755 140.145L425.566 215.673L429.716 219.537Z" fill="#D4D9DE" stroke="#212121" stroke-linejoin="round"/>
<path d="M456.977 210.619L430.779 218.663L471.652 147.246L456.977 210.619Z" fill="#8B96A0" stroke="#212121" stroke-linejoin="round"/>
<path d="M538.591 66.1686C552.515 61.8947 555.196 50.3771 544.579 40.4433C533.961 30.5095 514.067 25.9212 500.143 30.195C486.22 34.4689 483.539 45.9865 494.156 55.9204C504.773 65.8542 524.667 70.4425 538.591 66.1686Z" fill="#E3E5E8" stroke="#212121" stroke-miterlimit="10" stroke-linejoin="round"/>
<path d="M537.406 52.113C548.684 48.6512 550.856 39.3219 542.256 31.2755C533.656 23.2291 517.542 19.5126 506.263 22.9745C494.985 26.4363 492.814 35.7656 501.414 43.812C510.014 51.8584 526.128 55.5749 537.406 52.113Z" fill="#E3E5E8" stroke="#212121" stroke-miterlimit="10" stroke-linejoin="round"/>
<path fill-rule="evenodd" clip-rule="evenodd" d="M488.09 40.3369C486.713 45.1474 488.642 50.7676 494.166 55.9487C504.789 65.9124 524.684 70.4792 538.602 66.1489C545.283 64.0703 549.372 60.3197 550.644 55.8792L549.153 62.3496C547.881 66.7901 543.791 70.5407 537.111 72.6192C523.192 76.9495 503.297 72.3828 492.674 62.4191C487.15 57.238 485.221 51.6178 486.599 46.8073L488.09 40.3369Z" fill="url(#paint11_linear_666_21648)" stroke="#212121" stroke-linejoin="round"/>
<path fill-rule="evenodd" clip-rule="evenodd" d="M496.501 31.1897C495.385 35.0863 496.947 39.6387 501.422 43.8354C510.027 51.9059 526.141 55.605 537.415 52.0975C542.827 50.4138 546.139 47.3758 547.169 43.779L545.961 49.02C544.931 52.6168 541.618 55.6548 536.207 57.3385C524.933 60.846 508.818 57.1469 500.214 49.0764C495.739 44.8797 494.177 40.3273 495.293 36.4308L496.501 31.1897Z" fill="url(#paint12_linear_666_21648)" stroke="#212121" stroke-linejoin="round"/>
<path fill-rule="evenodd" clip-rule="evenodd" d="M504.15 23.5895C503.279 26.6307 504.499 30.1838 507.991 33.4592C514.707 39.7582 527.284 42.6452 536.083 39.9076C540.307 38.5936 542.892 36.2225 543.696 33.4153L542.753 37.5058C541.949 40.313 539.364 42.6841 535.14 43.9982C526.341 46.7357 513.764 43.8487 507.048 37.5497C503.556 34.2743 502.336 30.7212 503.207 27.6801L504.15 23.5895Z" fill="url(#paint13_linear_666_21648)" stroke="#212121" stroke-linejoin="round"/>
<path d="M536.076 39.9197C544.878 37.2178 546.573 29.9365 539.861 23.6564C533.149 17.3763 520.572 14.4757 511.769 17.1776C502.967 19.8795 501.272 27.1608 507.984 33.4409C514.696 39.721 527.273 42.6217 536.076 39.9197Z" fill="#E3E5E8" stroke="#212121" stroke-miterlimit="10" stroke-linejoin="round"/>
<path fill-rule="evenodd" clip-rule="evenodd" d="M512.043 19.083C511.457 21.1289 512.277 23.5192 514.627 25.7227C519.145 29.9602 527.606 31.9025 533.525 30.0608C536.367 29.1768 538.106 27.5817 538.647 25.6931L538.013 28.445C537.472 30.3335 535.732 31.9286 532.891 32.8126C526.972 34.6543 518.51 32.7121 513.992 28.4745C511.643 26.271 510.823 23.8807 511.409 21.8348L512.043 19.083Z" fill="url(#paint14_linear_666_21648)" stroke="#212121" stroke-linejoin="round"/>
<path d="M533.52 30.0684C539.442 28.2507 540.582 23.3523 536.067 19.1274C531.551 14.9026 523.09 12.9512 517.169 14.7689C511.247 16.5865 510.107 21.485 514.622 25.7098C519.138 29.9347 527.599 31.886 533.52 30.0684Z" fill="#E3E5E8" stroke="#212121" stroke-miterlimit="10" stroke-linejoin="round"/>
<path fill-rule="evenodd" clip-rule="evenodd" d="M523.444 12.5566C523.27 13.1608 523.513 13.8669 524.209 14.5181C525.548 15.7704 528.055 16.3452 529.81 15.802C530.652 15.5413 531.168 15.0703 531.328 14.5126L529.654 21.7369C529.494 22.2946 528.978 22.7656 528.136 23.0263C526.381 23.5695 523.874 22.9947 522.535 21.7424C521.839 21.0912 521.596 20.3851 521.77 19.7809L523.444 12.5566Z" fill="url(#paint15_linear_666_21648)" stroke="#212121" stroke-linejoin="round"/>
<path d="M529.81 15.8132C531.565 15.2744 531.903 13.8223 530.565 12.5698C529.226 11.3174 526.718 10.7389 524.962 11.2778C523.207 11.8166 522.869 13.2687 524.207 14.5211C525.546 15.7736 528.054 16.3521 529.81 15.8132Z" fill="#E3E5E8" stroke="#212121" stroke-miterlimit="10" stroke-linejoin="round"/>
</g>
<defs>
<linearGradient id="paint0_linear_666_21648" x1="346.703" y1="190.538" x2="308.102" y2="386.285" gradientUnits="userSpaceOnUse">
<stop stop-color="#A5DAA5"/>
<stop offset="1" stop-color="#0F8814"/>
</linearGradient>
<linearGradient id="paint1_linear_666_21648" x1="473.296" y1="289.78" x2="484.04" y2="296.904" gradientUnits="userSpaceOnUse">
<stop stop-color="#E3E5E8"/>
<stop offset="1" stop-color="#8B96A0"/>
</linearGradient>
<linearGradient id="paint2_linear_666_21648" x1="459.108" y1="297.781" x2="469.85" y2="304.903" gradientUnits="userSpaceOnUse">
<stop stop-color="#E3E5E8"/>
<stop offset="1" stop-color="#8B96A0"/>
</linearGradient>
<linearGradient id="paint3_linear_666_21648" x1="485.045" y1="239.052" x2="495.789" y2="246.175" gradientUnits="userSpaceOnUse">
<stop stop-color="#E3E5E8"/>
<stop offset="1" stop-color="#8B96A0"/>
</linearGradient>
<linearGradient id="paint4_linear_666_21648" x1="460.778" y1="237.528" x2="471.524" y2="244.654" gradientUnits="userSpaceOnUse">
<stop stop-color="#E3E5E8"/>
<stop offset="1" stop-color="#8B96A0"/>
</linearGradient>
<linearGradient id="paint5_linear_666_21648" x1="492.924" y1="244.986" x2="503.671" y2="252.112" gradientUnits="userSpaceOnUse">
<stop stop-color="#E3E5E8"/>
<stop offset="1" stop-color="#8B96A0"/>
</linearGradient>
<linearGradient id="paint6_linear_666_21648" x1="470.859" y1="247.053" x2="481.602" y2="254.176" gradientUnits="userSpaceOnUse">
<stop stop-color="#E3E5E8"/>
<stop offset="1" stop-color="#8B96A0"/>
</linearGradient>
<linearGradient id="paint7_linear_666_21648" x1="506.554" y1="217.692" x2="487.978" y2="211.9" gradientUnits="userSpaceOnUse">
<stop offset="0.235" stop-color="#8B96A0"/>
<stop offset="1" stop-color="#E3E5E8"/>
</linearGradient>
<linearGradient id="paint8_linear_666_21648" x1="479.601" y1="210.905" x2="461.026" y2="205.112" gradientUnits="userSpaceOnUse">
<stop offset="0.235" stop-color="#8B96A0"/>
<stop offset="1" stop-color="#E3E5E8"/>
</linearGradient>
<linearGradient id="paint9_linear_666_21648" x1="487.136" y1="220.186" x2="468.561" y2="214.394" gradientUnits="userSpaceOnUse">
<stop offset="0.235" stop-color="#8B96A0"/>
<stop offset="1" stop-color="#E3E5E8"/>
</linearGradient>
<linearGradient id="paint10_linear_666_21648" x1="542.027" y1="26.2883" x2="433.834" y2="180.556" gradientUnits="userSpaceOnUse">
<stop stop-color="#A5DAA5"/>
<stop offset="1" stop-color="#0F8814"/>
</linearGradient>
<linearGradient id="paint11_linear_666_21648" x1="518.815" y1="53.4293" x2="519.082" y2="70.7422" gradientUnits="userSpaceOnUse">
<stop stop-color="#E3E5E8"/>
<stop offset="1" stop-color="#8B96A0"/>
</linearGradient>
<linearGradient id="paint12_linear_666_21648" x1="521.387" y1="41.7946" x2="521.604" y2="55.8181" gradientUnits="userSpaceOnUse">
<stop stop-color="#E3E5E8"/>
<stop offset="1" stop-color="#8B96A0"/>
</linearGradient>
<linearGradient id="paint13_linear_666_21648" x1="523.574" y1="31.8664" x2="523.742" y2="42.8115" gradientUnits="userSpaceOnUse">
<stop stop-color="#E3E5E8"/>
<stop offset="1" stop-color="#8B96A0"/>
</linearGradient>
<linearGradient id="paint14_linear_666_21648" x1="525.11" y1="24.6512" x2="525.224" y2="32.0143" gradientUnits="userSpaceOnUse">
<stop stop-color="#E3E5E8"/>
<stop offset="1" stop-color="#8B96A0"/>
</linearGradient>
<linearGradient id="paint15_linear_666_21648" x1="526.98" y1="15.6548" x2="529.145" y2="20.6312" gradientUnits="userSpaceOnUse">
<stop stop-color="#E3E5E8"/>
<stop offset="1" stop-color="#8B96A0"/>
</linearGradient>
<clipPath id="clip0_666_21648">
<rect width="662.999" height="570.232" fill="white"/>
</clipPath>
</defs>
</svg>
</div>
<div class="p-l-24 p-r-24 text-center p-t-24">
<h3
class="m-b-8 animated fadeInUp"
style="animation-delay: 0.5s"
>
<strong translate>Smartphone registered</strong>
</h3>
<p
class="p-b-16 animated fadeInUp text-pretty"
style="animation-delay: 0.75s"
translate
>
You can check your sensor's data in the dashboard which has been created for this
smartphone.
</p>
<span
class="text-center animated fadeInUp"
style="animation-delay: 1s"
>
<button
class="btn btn-default"
title="{{ 'Close' | translate }}"
type="button"
(click)="cancel()"
>
{{ 'Close' | translate }}
</button>
<button
class="btn btn-primary"
title="{{ 'Open dashboard' | translate }}"
type="button"
(click)="openDashboard()"
>
{{ 'Open dashboard' | translate }}
</button>
</span>
</div>
</div>
</div>
</ng-container>
<!-- ERROR CONTAINER -->
<ng-container *ngIf="success === false">
<div
class="overflow-hidden"
style="height: 524px"
>
<div
class="fit-h"
>
<div class="p-t-16">
<svg width="683" height="562" style="max-height: 230px;" class="animated fadeInDown"
viewBox="0 0 683 562" fill="none" xmlns="http://www.w3.org/2000/svg">
<path fill-rule="evenodd" clip-rule="evenodd" d="M354.011 312.799C374.413 324.547 374.407 343.613 353.996 355.366C333.586 367.118 300.476 367.122 280.074 355.374C259.671 343.626 259.678 324.56 280.088 312.807C300.498 301.055 333.608 301.051 354.011 312.799ZM447.243 301.673C467.653 289.921 467.659 270.855 447.257 259.107C426.854 247.359 393.744 247.363 373.334 259.115C352.924 270.868 352.917 289.933 373.32 301.682C393.722 313.43 426.832 313.426 447.243 301.673ZM542.776 203.345C563.553 214.882 564.147 233.936 544.104 245.904C524.061 257.872 490.97 258.222 470.193 246.685C449.416 235.148 448.822 216.094 468.865 204.126C488.909 192.158 522 191.808 542.776 203.345ZM528.508 171.2L553.12 157.028L624.529 198.146L599.916 212.318L528.508 171.2ZM259.299 409.903C279.709 398.151 279.716 379.085 259.313 367.337C238.911 355.589 205.801 355.593 185.391 367.345C164.98 379.098 164.974 398.163 185.376 409.911C205.779 421.659 238.889 421.656 259.299 409.903ZM575.137 144.36L599.749 130.188L671.158 171.306L646.545 185.478L575.137 144.36ZM131.159 400.699L106.546 414.871L177.955 455.989L202.567 441.817L131.159 400.699ZM121.49 447.379C141.892 459.127 141.886 478.192 121.475 489.945C101.065 501.697 67.9551 501.701 47.5527 489.953C27.1503 478.205 27.2066 459.168 47.6168 447.416C68.027 435.663 101.087 435.63 121.49 447.379Z" fill="#D4D9DE"/>
<path fill-rule="evenodd" clip-rule="evenodd" d="M519.632 161.544C519.423 165.495 521.93 169.485 527.153 172.5C537.197 178.299 553.482 178.299 563.526 172.5C568.347 169.717 570.855 166.103 571.047 162.456V166.456C570.855 170.103 568.347 173.717 563.526 176.5C553.482 182.299 537.197 182.299 527.153 176.5C521.93 173.485 519.423 169.495 519.632 165.544V161.544Z" fill="url(#paint0_linear_666_21503)" stroke="#212121" stroke-linejoin="round"/>
<path d="M563.526 172.5C573.571 166.701 573.571 157.299 563.526 151.5C553.482 145.701 537.197 145.701 527.153 151.5C517.109 157.299 517.109 166.701 527.153 172.5C537.197 178.299 553.482 178.299 563.526 172.5Z" fill="#E3E5E8" stroke="#212121" stroke-miterlimit="10" stroke-linejoin="round"/>
<path fill-rule="evenodd" clip-rule="evenodd" d="M575.632 193.544C575.423 197.495 577.93 201.485 583.153 204.5C593.197 210.299 609.482 210.299 619.526 204.5C624.347 201.717 626.855 198.103 627.047 194.456V198.456C626.855 202.103 624.347 205.717 619.526 208.5C609.482 214.299 593.197 214.299 583.153 208.5C577.93 205.485 575.423 201.495 575.632 197.544V193.544Z" fill="url(#paint1_linear_666_21503)" stroke="#212121" stroke-linejoin="round"/>
<path d="M619.526 204.5C629.571 198.701 629.571 189.299 619.526 183.5C609.482 177.701 593.197 177.701 583.153 183.5C573.109 189.299 573.109 198.701 583.153 204.5C593.197 210.299 609.482 210.299 619.526 204.5Z" fill="#E3E5E8" stroke="#212121" stroke-miterlimit="10" stroke-linejoin="round"/>
<path fill-rule="evenodd" clip-rule="evenodd" d="M544.823 170V106L558.68 98V162L544.823 170Z" fill="#8B96A0" stroke="#212121" stroke-linejoin="round"/>
<path d="M544.823 106L530.967 98V162L544.823 170V106Z" fill="#D4D9DE" stroke="#212121" stroke-miterlimit="10" stroke-linejoin="round"/>
<path fill-rule="evenodd" clip-rule="evenodd" d="M600.823 202V138L614.68 130V194L600.823 202Z" fill="#8B96A0" stroke="#212121" stroke-linejoin="round"/>
<path d="M600.823 138L586.967 130V194L600.823 202V138Z" fill="#D4D9DE" stroke="#212121" stroke-miterlimit="10" stroke-linejoin="round"/>
<path fill-rule="evenodd" clip-rule="evenodd" d="M530.823 66L516.967 58L530.823 50L544.68 58L530.823 66Z" fill="#E3E5E8" stroke="#212121" stroke-linejoin="round"/>
<path d="M530.823 66L516.967 58V90L530.823 98V66Z" fill="#D4D9DE" stroke="#212121" stroke-miterlimit="10" stroke-linejoin="round"/>
<path d="M544.823 74L530.967 66V98L544.823 106V74Z" fill="#D70F0F" stroke="#212121" stroke-miterlimit="10" stroke-linejoin="round"/>
<path fill-rule="evenodd" clip-rule="evenodd" d="M544.823 74L530.967 66L544.823 58L558.68 66L544.823 74Z" fill="#D70F0F" stroke="#212121" stroke-linejoin="round"/>
<path fill-rule="evenodd" clip-rule="evenodd" d="M558.823 82L544.967 74L558.823 66L572.68 74L558.823 82Z" fill="#E3E5E8" stroke="#212121" stroke-linejoin="round"/>
<path d="M558.823 82L544.967 74V106L558.823 114V82Z" fill="#D4D9DE" stroke="#212121" stroke-miterlimit="10" stroke-linejoin="round"/>
<path fill-rule="evenodd" clip-rule="evenodd" d="M572.823 90L558.967 82L572.823 74L586.68 82L572.823 90Z" fill="#D70F0F" stroke="#212121" stroke-linejoin="round"/>
<path d="M572.823 90L558.967 82V114L572.823 122V90Z" fill="#D70F0F" stroke="#212121" stroke-miterlimit="10" stroke-linejoin="round"/>
<path fill-rule="evenodd" clip-rule="evenodd" d="M586.823 98L572.967 90L586.823 82L600.68 90L586.823 98Z" fill="#E3E5E8" stroke="#212121" stroke-linejoin="round"/>
<path d="M586.823 98L572.967 90V122L586.823 130V98Z" fill="#D4D9DE" stroke="#212121" stroke-miterlimit="10" stroke-linejoin="round"/>
<path fill-rule="evenodd" clip-rule="evenodd" d="M600.823 106L586.967 98L600.823 90L614.68 98L600.823 106Z" fill="#D70F0F" stroke="#212121" stroke-linejoin="round"/>
<path d="M600.823 106L586.967 98V130L600.823 138V106Z" fill="#D70F0F" stroke="#212121" stroke-miterlimit="10" stroke-linejoin="round"/>
<path fill-rule="evenodd" clip-rule="evenodd" d="M600.967 106V138L614.823 130V98L600.967 106Z" fill="#E3E5E8" stroke="#212121" stroke-linejoin="round"/>
<path fill-rule="evenodd" clip-rule="evenodd" d="M614.823 146V114L628.68 106V138L614.823 146Z" fill="#8B96A0" stroke="#212121" stroke-linejoin="round"/>
<path d="M614.823 114L600.967 106V138L614.823 146V114Z" fill="#D4D9DE" stroke="#212121" stroke-miterlimit="10" stroke-linejoin="round"/>
<path fill-rule="evenodd" clip-rule="evenodd" d="M614.823 114L600.967 106L614.823 98L628.68 106L614.823 114Z" fill="#E3E5E8" stroke="#212121" stroke-linejoin="round"/>
<path fill-rule="evenodd" clip-rule="evenodd" d="M295.106 338.697C282.514 332.288 274.651 317.41 274.651 295.871C274.651 254.449 303.731 204.082 339.603 183.371C357.538 173.016 373.776 172.035 385.53 178.821L363.88 166.321C352.126 159.535 335.888 160.516 317.952 170.871C282.08 191.582 253 241.949 253 283.371C253 304.91 260.863 319.788 273.456 326.197L295.106 338.697Z" fill="url(#paint2_linear_666_21503)" stroke="#212121" stroke-linejoin="round"/>
<path d="M404.554 220.871C404.554 262.292 375.474 312.66 339.602 333.371C303.73 354.082 274.65 337.292 274.65 295.871C274.65 254.449 303.73 204.082 339.602 183.371C375.474 162.66 404.554 179.449 404.554 220.871Z" fill="#7E0909" stroke="#212121" stroke-linejoin="round"/>
<path d="M376.952 259.322L361.51 286.068L344.417 276.199L327.324 305.805L312 296.958L329.093 267.352L312 257.483L327.442 230.737L344.535 240.606L361.628 211L376.952 219.847L359.859 249.453L376.952 259.322Z" fill="#E3E5E8" stroke="#212121" stroke-linejoin="round"/>
<defs>
<linearGradient id="paint0_linear_666_21503" x1="545.864" y1="165.915" x2="548.744" y2="178.5" gradientUnits="userSpaceOnUse">
<stop stop-color="#E3E5E8"/>
<stop offset="1" stop-color="#8B96A0"/>
</linearGradient>
<linearGradient id="paint1_linear_666_21503" x1="601.864" y1="197.915" x2="604.744" y2="210.5" gradientUnits="userSpaceOnUse">
<stop stop-color="#E3E5E8"/>
<stop offset="1" stop-color="#8B96A0"/>
</linearGradient>
<linearGradient id="paint2_linear_666_21503" x1="320.631" y1="202.01" x2="379.962" y2="274.996" gradientUnits="userSpaceOnUse">
<stop stop-color="#D70F0F"/>
<stop offset="1" stop-color="#7E0909"/>
</linearGradient>
</defs>
</svg>
</div>
<div class="p-l-24 p-r-24 text-center p-t-24">
<h3
class="m-b-8 animated fadeInUp"
style="animation-delay: 0.5s"
>
<strong>{{ 'Registration unsuccessful' | translate }}</strong>
</h3>
<div
class="animated fadeInUp d-flex"
style="animation-delay: 0.75s"
>
<div class="text-center">
{{ 'The device request expired or one of the following occurred:' | translate }}
<ul class="d-inline-block text-left">
<li>{{ 'Device credentials not received' | translate }}</li>
<li>{{ 'System ID assignment failed' | translate }}</li>
<li>{{ 'External ID update failed' | translate }}</li>
<li>{{ 'Group assignment failed' | translate }}</li>
<li>{{ 'Dashboard creation failed' | translate }}</li>
</ul>
</div>
</div>
<div
class="p-t-16 animated fadeInUp col-xs-4 text-center fit-w"
style="animation-delay: 1s"
>
<button
class="btn btn-default"
title="{{ 'Close' | translate }}"
type="button"
(click)="cancel()"
>
{{ 'Close' | translate }}
</button>
<button
class="btn btn-primary"
title="{{ 'Retry' | translate }}"
type="button"
(click)="retry()"
>
{{ 'Retry' | translate }}
</button>
</div>
</div>
</div>
</div>
</ng-container>
</div>