@towsila/expo-ui-library 1.0.0

package/src/assets/customIcons/phone_light.svg

@@ -0,0 +1,36 @@
+<svg width="148" height="177" viewBox="0 0 148 177" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path d="M89.9004 0C82.6273 1.37235 75.3599 2.7673 68.0983 4.18487C49.4903 7.81741 30.9202 11.5984 12.3879 15.5279L7.89075 16.4821L9.62486 21.0963C26.3613 65.6477 43.9883 109.823 62.506 153.621C63.155 155.156 63.8051 156.69 64.4562 158.225L66.8489 163.906L72.8031 162.233C95.7939 155.7 118.718 148.932 141.576 141.929L147.886 140.294L145.683 133.874C130.726 95.7823 115.097 57.9377 98.7954 20.3402C95.8523 13.5521 92.8873 6.772 89.9004 0C92.0113 7.09406 94.1441 14.1801 96.2988 21.2581C108.233 60.4611 120.839 99.4171 134.117 138.126L138.225 130.071C115.083 136.068 92.0069 142.3 68.9977 148.767L77.3445 152.775C76.6977 151.24 76.0498 149.704 75.4008 148.169C56.8831 104.371 37.4748 60.9489 17.1759 17.9037L14.4129 23.4721C32.5649 18.0507 50.679 12.4808 68.7553 6.76245C75.8094 4.53091 82.8578 2.27676 89.9004 0ZM89.9004 0" fill="black"/>
+<g filter="url(#filter0_d_1714_14952)">
+<path d="M139.9 136C117.734 142 72.9004 154.3 70.9004 155.5L13.4004 19.5L89.9004 0L139.9 136Z" fill="url(#paint0_linear_1714_14952)" shape-rendering="crispEdges"/>
+</g>
+<path d="M49.4004 14.5C49.5842 14.555 49.7667 14.6052 49.9479 14.6506C51.5791 15.0589 53.1071 15.0756 54.5321 14.7006C55.9571 14.3256 57.2791 13.5589 58.4979 12.4006C58.6334 12.2719 58.7675 12.1384 58.9004 12C58.7166 11.945 58.5341 11.8948 58.3529 11.8494C56.7217 11.4411 55.1937 11.4244 53.7687 11.7994C52.3437 12.1744 51.0217 12.9411 49.8029 14.0994C49.6674 14.2281 49.5333 14.3616 49.4004 14.5Z" fill="black"/>
+<path d="M60.9004 11.5C60.9862 11.5795 61.0706 11.6542 61.1537 11.724C61.9012 12.3529 62.5375 12.5923 63.0625 12.4423C63.5875 12.2923 64.0012 11.7529 64.3037 10.824C64.3373 10.7208 64.3695 10.6128 64.4004 10.5C64.3146 10.4205 64.2302 10.3458 64.1471 10.276C63.3996 9.64713 62.7633 9.40771 62.2383 9.55771C61.7133 9.70771 61.2996 10.2471 60.9971 11.176C60.9635 11.2792 60.9313 11.3872 60.9004 11.5Z" fill="black"/>
+<mask id="path-5-inside-1_1714_14952" fill="white">
+<ellipse cx="78.3637" cy="75.0586" rx="23.5" ry="26.5" transform="rotate(-24.3175 78.3637 75.0586)"/>
+</mask>
+<ellipse cx="78.3637" cy="75.0586" rx="23.5" ry="26.5" transform="rotate(-24.3175 78.3637 75.0586)" fill="#13AC6F"/>
+<path d="M99.7787 65.3815C100.677 67.8552 101.252 70.4133 101.481 72.9771C102.541 83.2 97.2563 93.7555 88.3496 97.1571C77.1969 101.776 64.2749 94.2941 59.6825 83.5004C59.6825 83.5004 59.6825 83.5004 59.6825 83.5004C54.6166 72.9206 57.5412 58.2783 68.3777 52.9602C76.8166 48.5235 88.2309 51.5332 95.2028 59.0847C96.9756 60.9509 98.5161 63.0723 99.7787 65.3815C98.8807 62.9078 97.6434 60.5347 96.0823 58.3593C90.0666 49.6259 77.5459 44.1973 66.5246 48.8594C52.3547 54.4883 47.939 73.1305 54.2148 85.9711C54.2148 85.9711 54.2148 85.9711 54.2148 85.9711C59.7045 99.167 76.6139 108.173 90.2027 101.258C100.985 96.0672 105.185 83.0827 102.606 72.7964C102.005 70.1872 101.042 67.6902 99.7787 65.3815ZM99.7787 65.3815" fill="black" mask="url(#path-5-inside-1_1714_14952)"/>
+<path d="M94.7437 40.7761C93.5148 40.2587 92.286 39.7413 91.0571 39.2239C91.0212 39.3952 90.9852 39.5664 90.9493 39.7377C90.3023 42.8205 89.6552 45.9034 89.0082 48.9862C88.9723 49.1575 88.9363 49.3287 88.9004 49.5C88.9978 49.3546 89.0952 49.2092 89.1926 49.0638C90.9455 46.4466 92.6985 43.8295 94.4515 41.2123C94.5489 41.0669 94.6463 40.9215 94.7437 40.7761Z" fill="#13AC6F"/>
+<path d="M50.4211 46.4008C49.7406 47.1336 49.0602 47.8664 48.3797 48.5992C48.5134 48.6892 48.6471 48.7792 48.7807 48.8692C51.187 50.4895 53.5932 52.1097 55.9994 53.73C56.133 53.82 56.2667 53.91 56.4004 54C56.3007 53.8733 56.2011 53.7467 56.1014 53.62C54.3076 51.3403 52.5138 49.0605 50.72 46.7808C50.6204 46.6541 50.5207 46.5275 50.4211 46.4008Z" fill="#13AC6F"/>
+<path d="M74.3993 30.4334C73.0667 30.4778 71.7341 30.5222 70.4015 30.5666C70.4431 30.8155 70.4848 31.0644 70.5264 31.3133C71.2761 35.7933 72.0258 40.2733 72.7754 44.7533C72.8171 45.0022 72.8587 45.2511 72.9004 45.5C72.9254 45.2489 72.9504 44.9978 72.9753 44.7467C73.425 40.2267 73.8747 35.7067 74.3243 31.1867C74.3493 30.9356 74.3743 30.6845 74.3993 30.4334Z" fill="#13AC6F"/>
+<path d="M109.372 107.478C110.391 106.159 111.41 104.841 112.429 103.522C112.22 103.413 112.011 103.304 111.803 103.196C108.044 101.239 104.285 99.2826 100.527 97.3261C100.318 97.2174 100.109 97.1087 99.9004 97C100.058 97.1746 100.216 97.3493 100.374 97.5239C103.215 100.667 106.057 103.811 108.898 106.954C109.056 107.129 109.214 107.304 109.372 107.478Z" fill="#13AC6F"/>
+<path d="M69.93 115.657C71.2436 115.886 72.5572 116.114 73.8708 116.343C73.8713 116.145 73.8718 115.948 73.8723 115.751C73.8812 112.198 73.89 108.645 73.8989 105.092C73.8994 104.895 73.8999 104.697 73.9004 104.5C73.8342 104.686 73.768 104.872 73.7019 105.058C72.5107 108.405 71.3196 111.752 70.1285 115.099C70.0623 115.285 69.9961 115.471 69.93 115.657Z" fill="#13AC6F"/>
+<path d="M89.4774 111.474C90.426 111.158 91.3747 110.842 92.3234 110.526C92.258 110.409 92.1926 110.291 92.1273 110.174C90.9504 108.067 89.7734 105.959 88.5965 103.851C88.5312 103.734 88.4658 103.617 88.4004 103.5C88.4183 103.633 88.4363 103.766 88.4542 103.899C88.7773 106.291 89.1004 108.683 89.4235 111.076C89.4415 111.209 89.4594 111.341 89.4774 111.474Z" fill="#13AC6F"/>
+<path d="M67.4004 77C67.8808 77.5123 68.3657 78.0176 68.8552 78.5159C71.6494 81.3604 74.5918 83.9775 77.6827 86.3671L79.8806 88.0605L81.0309 85.1556C81.8639 83.0624 82.6106 80.9427 83.271 78.7964C85.0767 72.9281 86.2372 66.8612 86.7525 60.5958C86.8098 59.8997 86.8591 59.2011 86.9004 58.5C86.5405 59.103 86.1885 59.7085 85.8445 60.3164C82.7486 65.7878 80.2978 71.4576 78.4921 77.326C77.8317 79.4723 77.2576 81.6451 76.7698 83.8444L80.1181 82.6329C76.6851 80.7678 73.1038 79.1303 69.3741 77.7201C68.7208 77.4731 68.0629 77.2331 67.4004 77Z" fill="#F6FFFC"/>
+<defs>
+<filter id="filter0_d_1714_14952" x="0.000391006" y="0" width="143.3" height="176.9" filterUnits="userSpaceOnUse" color-interpolation-filters="sRGB">
+<feFlood flood-opacity="0" result="BackgroundImageFix"/>
+<feColorMatrix in="SourceAlpha" type="matrix" values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 127 0" result="hardAlpha"/>
+<feOffset dx="-5" dy="13"/>
+<feGaussianBlur stdDeviation="4.2"/>
+<feComposite in2="hardAlpha" operator="out"/>
+<feColorMatrix type="matrix" values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0.25 0"/>
+<feBlend mode="normal" in2="BackgroundImageFix" result="effect1_dropShadow_1714_14952"/>
+<feBlend mode="normal" in="SourceGraphic" in2="effect1_dropShadow_1714_14952" result="shape"/>
+</filter>
+<linearGradient id="paint0_linear_1714_14952" x1="76.6504" y1="0" x2="76.6504" y2="155.5" gradientUnits="userSpaceOnUse">
+<stop stop-color="#F6FFFC" stop-opacity="0.84"/>
+<stop offset="1" stop-color="#F6FFFC"/>
+</linearGradient>
+</defs>
+</svg>

package/src/assets/customIcons/shield.svg

@@ -0,0 +1,4 @@
+<svg width="20" height="20" viewBox="0 0 20 20" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path d="M13.125 6.875C12.9832 6.95733 12.8434 7.04141 12.7056 7.12723C11.4657 7.89962 10.389 8.81339 9.47565 9.86852C9.04777 10.3628 8.65573 10.8881 8.29954 11.4445L9.2572 11.4051C8.65206 10.9629 8.00421 10.5642 7.31366 10.2091C7.16931 10.1349 7.02309 10.0626 6.875 9.99219C6.94844 10.1388 7.02375 10.2835 7.10092 10.4263C7.47009 11.1094 7.88197 11.7489 8.33655 12.3449C8.65561 12.5781 9.08111 12.6383 9.29421 12.3055C9.79377 11.8733 10.2575 11.41 10.6854 10.9157C11.5987 9.86055 12.3488 8.66406 12.9355 7.32619C13.0007 7.17754 13.0638 7.02714 13.125 6.875Z" fill="currentColor"/>
+<path d="M18.0898 4.38945C17.2623 4.18655 16.4341 3.97624 15.6222 3.73636C13.7191 3.19452 11.9477 2.36348 10.1828 1.47023C10.0953 1.42625 9.90799 1.4337 9.81716 1.47023C7.19589 2.58106 4.58727 3.29814 1.78462 3.68982C1.47925 3.73802 1.22665 4.03663 1.20073 4.3447C0.941429 7.28705 1.48074 10.3898 3.03829 12.9944C4.58828 15.5941 6.93303 17.614 9.73426 18.7848C9.85928 18.8382 10.1385 18.8329 10.2657 18.7848C14.9311 16.655 18.1457 11.8819 18.2111 6.95541C18.2415 6.09264 18.197 5.24552 18.0898 4.38945C18.0905 5.25223 18.0328 6.09067 17.9083 6.92772C17.2926 11.7067 13.9173 15.7445 9.73426 17.4652H10.2657C7.89099 16.3557 5.76183 14.4615 4.41547 12.1799C3.04558 9.8834 2.49748 7.16918 2.61951 4.43421L2.03562 5.08909C4.83768 4.58561 7.67812 3.60733 10.1828 2.27977H9.81716C11.659 3.02716 13.5807 3.70616 15.5526 4.0323C16.3949 4.18066 17.2433 4.29149 18.0898 4.38945ZM18.0898 4.38945" fill="currentColor"/>
+</svg>

package/src/assets/customIcons/trash.svg

@@ -0,0 +1,9 @@
+<svg width="25" height="25" viewBox="0 0 25 25" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path d="M5.46875 5.46875C5.4625 6.22379 5.45892 6.97867 5.45799 7.73338C5.45251 12.2078 5.54058 16.6763 5.72219 21.1389C5.69736 22.2518 6.76128 23.4681 8.00781 23.4246C9.50491 23.4457 11.002 23.4562 12.4991 23.4562C13.9968 23.4562 15.4945 23.4457 16.9922 23.4246C18.2411 23.4712 19.2952 22.2423 19.2779 21.1379C19.4594 16.6763 19.5475 12.2078 19.542 7.73338C19.5411 6.97867 19.5375 6.22379 19.5312 5.46875C19.431 6.21714 19.3335 6.9657 19.2386 7.71442C18.676 12.1533 18.207 16.598 17.8316 21.0486C17.7789 21.5849 17.4268 21.9037 16.9922 21.8879C15.4945 21.8668 13.9968 21.8563 12.4991 21.8563C11.002 21.8563 9.50491 21.8668 8.00781 21.8879C7.57366 21.9038 7.21414 21.5807 7.16889 21.0566C6.79297 16.598 6.32396 12.1533 5.7614 7.71442C5.66651 6.9657 5.56896 6.21714 5.46875 5.46875Z" fill="currentColor"/>
+<path d="M3.90625 5.46875H21.0938Z" fill="currentColor"/>
+<path d="M3.90625 4.66875C3.69408 4.65874 3.49059 4.73425 3.34056 4.88445C3.19054 5.03431 3.10625 5.24656 3.10625 5.46875C3.10625 5.69094 3.19054 5.90319 3.34056 6.05305C3.49059 6.20325 3.69408 6.27876 3.90625 6.26875C4.19271 6.25542 4.47917 6.24208 4.76562 6.22875C9.92188 5.98875 15.0781 5.74875 20.2344 5.50875C20.5208 5.49542 20.8073 5.48208 21.0938 5.46875C20.8073 5.45542 20.5208 5.44208 20.2344 5.42875C15.0781 5.18875 9.92188 4.94875 4.76562 4.70875C4.47917 4.69542 4.19271 4.68208 3.90625 4.66875Z" fill="currentColor"/>
+<path d="M17.0675 4.98943C16.5342 4.99483 16.0009 5.00023 15.4676 5.00563C15.48 4.97116 15.4593 4.76498 15.425 4.63068C15.1057 3.12821 13.0732 2.36557 11.1934 2.27853C9.56173 2.12953 7.62843 2.65572 7.05643 4.39711C6.98992 4.5908 6.93852 4.79445 6.91895 4.9977C6.91895 4.9977 6.91895 4.9977 6.91895 4.9977C6.91185 4.79322 6.93709 4.58165 6.97929 4.3759C7.30017 2.51488 9.41706 1.56533 11.1934 1.52196C13.1182 1.40658 15.8123 1.66592 16.8673 4.15086C16.9628 4.41065 17.0362 4.61606 17.0675 4.98943Z" fill="currentColor"/>
+<path d="M10.3002 9C9.76686 9 9.23353 9 8.7002 9C8.71353 9.2 8.72686 9.4 8.7402 9.6C8.9802 13.2 9.2202 16.8 9.4602 20.4C9.47353 20.6 9.48686 20.8 9.5002 21C9.51353 20.8 9.52686 20.6 9.5402 20.4C9.7802 16.8 10.0202 13.2 10.2602 9.6C10.2735 9.4 10.2869 9.2 10.3002 9Z" fill="currentColor"/>
+<path d="M13.3002 9C12.7669 9 12.2335 9 11.7002 9C11.7135 9.2 11.7269 9.4 11.7402 9.6C11.9802 13.2 12.2202 16.8 12.4602 20.4C12.4735 20.6 12.4869 20.8 12.5002 21C12.5135 20.8 12.5269 20.6 12.5402 20.4C12.7802 16.8 13.0202 13.2 13.2602 9.6C13.2735 9.4 13.2869 9.2 13.3002 9Z" fill="currentColor"/>
+<path d="M16.3002 9C15.7669 9 15.2335 9 14.7002 9C14.7135 9.2 14.7269 9.4 14.7402 9.6C14.9802 13.2 15.2202 16.8 15.4602 20.4C15.4735 20.6 15.4869 20.8 15.5002 21C15.5135 20.8 15.5269 20.6 15.5402 20.4C15.7802 16.8 16.0202 13.2 16.2602 9.6C16.2735 9.4 16.2869 9.2 16.3002 9Z" fill="currentColor"/>
+</svg>

package/src/assets/customIcons/warning.svg

@@ -0,0 +1,5 @@
+<svg width="20" height="20" viewBox="0 0 20 20" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path d="M3.34353 17.4316C4.16442 17.485 4.98532 17.5356 5.80622 17.5836C9.4236 17.7952 13.041 17.9549 16.6584 18.0628C16.9822 18.0696 17.3089 17.9903 17.5961 17.8339C17.8835 17.6781 18.1306 17.4454 18.3044 17.1648C18.4788 16.8846 18.5793 16.5573 18.5917 16.2246C18.6048 15.892 18.5296 15.5551 18.3746 15.2575C17.0538 12.6631 15.7035 10.0846 14.3236 7.52198C13.4845 5.96349 12.6344 4.41088 11.7734 2.86414C11.096 1.48886 8.895 1.52874 8.27029 2.88642C6.13822 7.05453 4.08257 11.2636 2.10325 15.5137C2.08425 15.5538 2.06721 15.5947 2.05218 15.6363C1.98485 15.8218 1.95836 16.0197 1.97328 16.2121C1.99116 16.4477 2.07142 16.6746 2.20047 16.8644C2.32916 17.0545 2.50619 17.207 2.70624 17.3047C2.90615 17.4028 3.12848 17.4458 3.34353 17.4316C3.12837 17.4178 2.92107 17.3474 2.74708 17.2327C2.57278 17.1184 2.43215 16.9602 2.34065 16.7807C2.24874 16.6013 2.20607 16.4012 2.21483 16.2067C2.22174 16.0477 2.26264 15.8927 2.33223 15.7545C2.34778 15.7236 2.36474 15.6935 2.38303 15.6644C4.84172 11.6724 7.22409 7.63922 9.53013 3.56499C9.71999 3.20758 10.2928 3.24746 10.4302 3.58759C11.2474 5.15767 12.0757 6.72204 12.9149 8.28053C14.2947 10.8431 15.7041 13.3898 17.1429 15.9207C17.1923 16.0016 17.2209 16.0967 17.224 16.1942C17.2272 16.2917 17.2048 16.3914 17.1582 16.4803C17.1118 16.5693 17.0413 16.6473 16.9544 16.7035C16.8677 16.7598 16.7648 16.7941 16.6583 16.8004C13.041 16.9084 9.4236 17.0681 5.80622 17.2796C4.98532 17.3276 4.16442 17.3783 3.34353 17.4316ZM3.34353 17.4316" fill="currentColor"/>
+<path d="M9.77554 7.63233C9.77554 7.63233 9.77554 7.63233 9.77554 7.63233C9.73031 7.8057 9.68773 7.97893 9.64782 8.15204C9.31668 9.58845 9.16893 11.0162 9.20459 12.4354C9.24909 13.3871 10.7499 13.3871 10.7949 12.4353C10.8032 12.3154 10.8102 12.1955 10.8158 12.0755C10.8848 10.6076 10.7571 9.13049 10.4329 7.64412C10.4274 7.58469 10.4096 7.52849 10.3823 7.4796C10.3549 7.43066 10.3181 7.38907 10.2758 7.35756C10.2632 7.34808 10.25 7.3395 10.2365 7.33185C10.205 7.31402 10.1717 7.30128 10.138 7.29374C10.0899 7.28293 10.0412 7.28284 9.99637 7.29212C9.95222 7.30119 9.91176 7.31926 9.87794 7.34357C9.84407 7.36785 9.81687 7.39832 9.79773 7.43141C9.77855 7.46449 9.76743 7.50014 9.7641 7.53473C9.76073 7.56934 9.76513 7.60286 9.77554 7.63233C9.77554 7.63233 9.77554 7.63233 9.77554 7.63233C9.78374 7.60214 9.79802 7.57557 9.81586 7.55438C9.8337 7.53314 9.85505 7.51727 9.87712 7.50719C9.89919 7.49706 9.92194 7.4927 9.94286 7.49326C9.9638 7.49378 9.9829 7.49919 9.99847 7.50771C10.0143 7.51636 10.0266 7.52819 10.0345 7.54089C10.04 7.54978 10.0435 7.55907 10.0451 7.56802C10.0457 7.57186 10.0461 7.57563 10.0461 7.57929C10.046 7.59148 10.0423 7.60229 10.0364 7.6102C10.0306 7.61815 10.0225 7.62318 10.0143 7.62479C9.55212 9.07387 9.28653 10.5325 9.21756 12.0004C9.21192 12.1204 9.20759 12.2405 9.20458 12.3606L10.7949 12.3605C10.6972 10.9443 10.416 9.53672 9.95149 8.13775C9.8955 7.96916 9.83685 7.80068 9.77554 7.63233ZM9.77554 7.63233" fill="currentColor"/>
+<path d="M10 15.5176C9.84548 15.5176 9.69444 15.4718 9.56596 15.3859C9.43749 15.3001 9.33735 15.1781 9.27822 15.0353C9.21909 14.8925 9.20362 14.7355 9.23376 14.5839C9.26391 14.4324 9.33831 14.2932 9.44757 14.1839C9.55683 14.0746 9.69604 14.0002 9.84759 13.9701C9.99913 13.9399 10.1562 13.9554 10.299 14.0145C10.4417 14.0737 10.5637 14.1738 10.6496 14.3023C10.7354 14.4308 10.7813 14.5818 10.7813 14.7363C10.7813 14.9435 10.6989 15.1422 10.5524 15.2888C10.4059 15.4353 10.2072 15.5176 10 15.5176Z" fill="currentColor"/>
+</svg>

package/src/assets/icons/google.svg

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

package/src/assets/images/bg_dark.svg

@@ -0,0 +1,5 @@
+<svg width="393" height="317" viewBox="0 0 393 317" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path fill-rule="evenodd" clip-rule="evenodd" d="M200.73 79.3379V100.78H207.631V148.219H216.695V131.523H221.469V125.316L231.912 131.523H234.47V116.087H245.75H259.459V150.338C259.459 150.338 271.65 140.388 278.25 132.838C290.928 118.338 299.51 97.8379 302.652 75.7037C306.75 46.8379 298.243 0.285645 298.243 0.285645L313.678 1.83789L317.883 36.3903V0.285645H320.25L320.75 33.3378H321.25L322.088 0.285645H324.25V36.3903L329.25 1.83789L343.25 0.285645C343.25 0.285645 334.398 46.7092 340.25 75.7037C345.121 99.8379 351.25 116.316 363.25 132.838C370.159 142.35 385.75 152.838 385.75 152.838V138.338L390.75 140.838V147.838H393.25V152.838V316.338H374.864H368.597H350.994H350.211H339.477H322.088H304.7H301.096H285.497H283.708H274.985H273.979H259.459H249.996H234.47H216.695H207.631H192.267H185.699H170.294H166.117H151.97H144.268H131.825H127.317H120.9H109.976H107.171H96.2467H90.3515H85.3219H65.6996H57.5696H46.9957H36.4204H28.2794H25.8464H14.0358H10.8912H0.25V144.865H8.62387V125.874H25.8464V76.671H36.4204V87.13H46.9957V96.7057H57.5696V131.075H65.6996V123.121H68.5943V120.59H87.4561V123.121H90.3515V155.984H96.2467V103.47H99.1428V100.939H118.004V103.47H120.9V138.893H127.317V117.121H130.212V114.59H149.074V117.121H151.97V125.316L158.023 134.333V140.449H166.117V131.075H170.294V120.121H185.699V114.532L192.267 106.781V100.78H199.169V79.3379H200.73Z" fill="#111111" fill-opacity="0.2" stroke="#111111" stroke-width="0.5"/>
+<path fill-rule="evenodd" clip-rule="evenodd" d="M278.68 138.314V152.218H274.814V206.323H269.735V189.661H267.061V185.636L261.211 189.661H259.777V179.651L252.777 165.144L245.778 179.651V213.69H242.492V220.305H237.643V193.308H233.625L233.793 182.107H229.143V178.899H224.431L223.706 159.499L222.982 178.899H222.075V182.107H220.853L221.301 212.105H220.433V198.871L210.691 189.661V206.323H200.95V193.308H194.936V185.636L184.635 197.28V185.636L170.824 201.248V315.338H181.125H184.635H194.497H194.936H200.95H210.691H220.433H222.452H231.191H232.193H237.08H237.643H245.778H251.08H259.777H269.735H274.814H283.421H287.1H295.731H298.071H305.996H310.311H317.282H319.808H323.403H329.523H331.094H337.214H340.517H343.335H354.328H358.882H364.806H370.731H375.291H376.655H383.271H385.033H390.994V204.148H386.303L386.632 182.107H376.655V150.202H370.731V156.984H364.806V163.194H358.882V195.206H354.328V180.322H352.706V146.838H351.083V128.838H339.75V160.381C339.75 160.381 328.25 130.338 325.75 109.338C325.75 133.838 331.75 170.381 331.75 170.381H325.025L321.75 86.3379H320.75L318.75 170.381H311.25C311.25 170.381 316.25 130.838 316.75 109.338C312.75 136.338 302.605 160.381 302.605 160.381V151.284H298.071V157.206H295.731V180.322H287.1V171.51L283.421 166.484V152.218H279.554V138.314H278.68Z" fill="#111111" fill-opacity="0.2"/>
+<path fill-rule="evenodd" clip-rule="evenodd" d="M84.3105 138.789H84.988V152.692H87.9836V166.959L90.8342 171.985V180.796H97.5206V195.68H99.3337V201.759H102.847V191.957L105.474 186.11V180.796H106.731V179.155H114.917V180.796H116.174V194.914H118.959V171.945H120.216V170.303H128.403V171.945H129.66V211.832H132.218V180.796H133.475V179.155H141.662V180.796H142.918V195.68H146.447V163.668H151.036V157.458H155.626V150.676H160.216V182.581H167.946L167.691 204.622H171.326V315.812H0.75V201.722L11.4501 186.11V197.754L19.4306 186.11V193.783H24.0894V206.797H31.6368V190.135L39.1839 199.345V212.579H39.8563L39.5092 182.581H40.4565V179.373H41.1586L41.72 159.973L42.2817 179.373H45.9318V182.581H49.5344L49.4047 193.783H52.5177V220.779H56.274V214.164H58.8197V180.126L64.2427 165.618L69.6659 180.126V190.135H70.7762L75.3088 186.11V190.135H77.3809V206.797H81.3152V152.692H84.3105V138.789Z" fill="#111111" fill-opacity="0.2"/>
+</svg>

package/src/assets/images/bg_dark_v1.svg

@@ -0,0 +1,5 @@
+<svg width="393" height="274" viewBox="0 0 393 274" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path fill-rule="evenodd" clip-rule="evenodd" d="M200.99 0.25V21.6916H207.908V105.131H216.996V79.4348H221.782V73.2282L232.251 79.4348H234.816V63.9987L247.343 41.6258L259.869 63.9987V116.492H265.749V126.693H274.425V85.06H281.616L281.317 67.7858H289.638V62.8383H298.069L299.366 32.9201L300.663 62.8383H302.285V67.7858H304.473L303.671 114.048H305.224V93.638L322.657 79.4348V105.131H340.09V85.06H350.851V73.2282L369.285 91.1844V73.2282L394 97.3036V273.25H375.567H369.285H351.636H350.851H340.09H322.657H305.224H301.611H285.973H284.179H275.434H274.425H259.869H250.381H234.816H216.996H207.908H192.506H185.921H170.477H166.289H152.106H144.384H131.91H127.39H120.957H110.005H107.193H96.241H90.3307H85.2883H65.6161H57.4655H46.8646H36.2624H28.1007H25.6616H13.8208H10.6682H0V101.776H8.39517L7.80661 67.7858H25.6616V18.5831H36.2624V29.042H46.8646V38.6178H57.4655V87.9867H65.6161V65.0331H68.5182V62.5017H87.4279V65.0331H90.3307V112.895H96.241V51.3826H99.1444V48.8511H118.053V51.3826H120.957V86.8045H127.39V65.0331H130.293V62.5017H149.202V65.0331H152.106V73.2282L158.174 82.2443V97.3605H166.289V87.9867H170.477V65.0331H185.921V51.4438L192.506 43.6929V21.6916H199.425V0.25H200.99Z" fill="black" fill-opacity="0.2" stroke="#111111" stroke-width="0.5"/>
+<path fill-rule="evenodd" clip-rule="evenodd" d="M279.43 96.2266V110.13H275.564V164.235H270.485V147.573H267.811V143.548L261.961 147.573H260.527V137.564L253.527 123.056L246.528 137.564V171.602H243.242V178.217H238.393V151.221H234.375L234.543 140.019H229.893V136.811H225.181L224.456 117.411L223.732 136.811H222.825V140.019H221.603L222.051 170.017H221.183V156.783L211.441 147.573V164.235H201.7V151.221H195.686V143.548L185.385 155.192V143.548L171.574 159.16V273.25H181.875H185.385H195.247H195.686H201.7H211.441H221.183H223.202H231.941H232.943H237.83H238.393H246.528H251.83H260.527H270.485H275.564H284.171H287.85H296.481H298.821H306.746H311.061H318.032H320.558H324.153H330.273H331.844H337.964H341.267H344.085H355.078H359.632H365.556H371.481H376.041H377.405H384.021H385.783H391.744V162.06H387.053L387.382 140.019H377.405V108.114H371.481V114.896H365.556V121.106H359.632V153.118H355.078V138.234H353.456V136.593H342.889V138.234H341.267V169.27H337.964V129.383H336.342V127.741H325.775V129.383H324.153V152.352H320.558V138.234H318.936V136.593H308.369V138.234H306.746V143.548L303.355 149.395V159.197H298.821V153.118H296.481V138.234H287.85V129.423L284.171 124.397V110.13H280.304V96.2266H279.43Z" fill="black" fill-opacity="0.2"/>
+<path fill-rule="evenodd" clip-rule="evenodd" d="M84.5605 96.2266H85.238V110.13H88.2336V124.397L91.0842 129.423V138.234H97.7706V153.118H99.5837V159.197H103.097V149.395L105.724 143.548V138.234H106.981V136.593H115.167V138.234H116.424V152.352H119.209V129.383H120.466V127.741H128.653V129.383H129.91V169.27H132.468V138.234H133.725V136.593H141.912V138.234H143.168V153.118H146.697V121.106H151.286V114.896H155.876V108.114H160.466V140.019H168.196L167.941 162.06H171.576V273.25H1V159.16L11.7001 143.548V155.192L19.6806 143.548V151.221H24.3394V164.235H31.8868V147.573L39.4339 156.783V170.017H40.1063L39.7592 140.019H40.7065V136.811H41.4086L41.97 117.411L42.5317 136.811H46.1818V140.019H49.7844L49.6547 151.221H52.7677V178.217H56.524V171.602H59.0697V137.564L64.4927 123.056L69.9159 137.564V147.573H71.0262L75.5588 143.548V147.573H77.6309V164.235H81.5652V110.13H84.5605V96.2266Z" fill="black" fill-opacity="0.2"/>
+</svg>

package/src/assets/images/bg_light.svg

@@ -0,0 +1,5 @@
+<svg width="393" height="317" viewBox="0 0 393 317" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path fill-rule="evenodd" clip-rule="evenodd" d="M200.48 79.3379V100.78H207.381V148.219H216.445V131.523H221.219V125.316L231.662 131.523H234.22V116.087H245.5H259.209V150.338C259.209 150.338 271.4 140.388 278 132.838C290.678 118.338 299.26 97.8379 302.402 75.7037C306.5 46.8379 297.993 0.285645 297.993 0.285645L313.428 1.83789L317.633 36.3903V0.285645H320L320.5 33.3378H321L321.838 0.285645H324V36.3903L329 1.83789L343 0.285645C343 0.285645 334.148 46.7092 340 75.7037C344.871 99.8379 351 116.316 363 132.838C369.909 142.35 385.5 152.838 385.5 152.838V138.338L390.5 140.838V147.838H393V152.838V316.338H374.614H368.347H350.744H349.961H339.227H321.838H304.45H300.846H285.247H283.458H274.735H273.729H259.209H249.746H234.22H216.445H207.381H192.017H185.449H170.044H165.867H151.72H144.018H131.575H127.067H120.65H109.726H106.921H95.9967H90.1015H85.0719H65.4496H57.3196H46.7457H36.1704H28.0294H25.5964H13.7858H10.6412H0V144.865H8.37387V125.874H25.5964V76.671H36.1704V87.13H46.7457V96.7057H57.3196V131.075H65.4496V123.121H68.3443V120.59H87.2061V123.121H90.1015V155.984H95.9967V103.47H98.8928V100.939H117.754V103.47H120.65V138.893H127.067V117.121H129.962V114.59H148.824V117.121H151.72V125.316L157.773 134.333V140.449H165.867V131.075H170.044V120.121H185.449V114.532L192.017 106.781V100.78H198.919V79.3379H200.48Z" fill="white" fill-opacity="0.2" stroke="white" stroke-width="0.5"/>
+<path fill-rule="evenodd" clip-rule="evenodd" d="M278.43 139.314V153.218H274.564V207.323H269.485V190.661H266.811V186.636L260.961 190.661H259.527V180.651L252.527 166.144L245.528 180.651V214.69H242.242V221.305H237.393V194.308H233.375L233.543 183.107H228.893V179.899H224.181L223.456 160.499L222.732 179.899H221.825V183.107H220.603L221.051 213.105H220.183V199.871L210.441 190.661V207.323H200.7V194.308H194.686V186.636L184.385 198.28V186.636L170.574 202.248V316.338H180.875H184.385H194.247H194.686H200.7H210.441H220.183H222.202H230.941H231.943H236.83H237.393H245.528H250.83H259.527H269.485H274.564H283.171H286.85H295.481H297.821H305.746H310.061H317.032H319.558H323.153H329.273H330.844H336.964H340.267H343.085H354.078H358.632H364.556H370.481H375.041H376.405H383.021H384.783H390.744V205.148H386.053L386.382 183.107H376.405V151.202H370.481V157.984H364.556V164.194H358.632V196.206H354.078V181.322H352.456V147.838H350.833V129.838H339.5V161.381C339.5 161.381 328 131.338 325.5 110.338C325.5 134.838 331.5 171.381 331.5 171.381H324.775L321.5 87.3379H320.5L318.5 171.381H311C311 171.381 316 131.838 316.5 110.338C312.5 137.338 302.355 161.381 302.355 161.381V152.284H297.821V158.206H295.481V181.322H286.85V172.51L283.171 167.484V153.218H279.304V139.314H278.43Z" fill="white" fill-opacity="0.2"/>
+<path fill-rule="evenodd" clip-rule="evenodd" d="M83.5605 139.314H84.238V153.218H87.2336V167.484L90.0842 172.51V181.322H96.7706V196.206H98.5837V202.285H102.097V192.483L104.724 186.636V181.322H105.981V179.681H114.167V181.322H115.424V195.44H118.209V172.471H119.466V170.829H127.653V172.471H128.91V212.358H131.468V181.322H132.725V179.681H140.912V181.322H142.168V196.206H145.697V164.194H150.286V157.984H154.876V151.202H159.466V183.107H167.196L166.941 205.148H170.576V316.338H0V202.248L10.7001 186.636V198.28L18.6806 186.636V194.308H23.3394V207.323H30.8868V190.661L38.4339 199.871V213.105H39.1063L38.7592 183.107H39.7065V179.899H40.4086L40.97 160.499L41.5317 179.899H45.1818V183.107H48.7844L48.6547 194.308H51.7678V221.305H55.524V214.69H58.0697V180.652L63.4927 166.144L68.9159 180.652V190.661H70.0262L74.5588 186.636V190.661H76.6309V207.323H80.5652V153.218H83.5605V139.314Z" fill="white" fill-opacity="0.2"/>
+</svg>

package/src/assets/images/bg_light_v1.svg

@@ -0,0 +1,5 @@
+<svg width="394" height="274" viewBox="0 0 394 274" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path fill-rule="evenodd" clip-rule="evenodd" d="M200.73 0.25V21.6916H207.631V105.131H216.695V79.4348H221.469V73.2282L231.912 79.4348H234.47V63.9987L246.965 41.6258L259.459 63.9987V116.492H265.325V126.693H273.979V85.06H281.151L280.853 67.7858H289.153V62.8383H297.562L298.857 32.9201L300.15 62.8383H301.768V67.7858H303.95L303.15 114.048H304.7V93.638L322.088 79.4348V105.131H339.477V85.06H350.211V73.2282L368.597 91.1844V73.2282L393.25 97.3036V273.25H374.864H368.597H350.994H350.211H339.477H322.088H304.7H301.096H285.497H283.708H274.985H273.979H259.459H249.996H234.47H216.695H207.631H192.267H185.699H170.294H166.117H151.97H144.268H131.825H127.317H120.9H109.976H107.171H96.2467H90.3515H85.3219H65.6996H57.5697H46.9957H36.4204H28.2794H25.8464H14.0358H10.8912H0.250011V101.776H8.62387L8.03683 67.7858H25.8464V18.5831H36.4204V29.042H46.9957V38.6178H57.5697V87.9867H65.6996V65.0331H68.5943V62.5017H87.4561V65.0331H90.3515V112.895H96.2467V51.3826H99.1428V48.8511H118.004V51.3826H120.9V86.8044H127.317V65.0331H130.212V62.5017H149.074V65.0331H151.97V73.2282L158.023 82.2443V97.3604H166.117V87.9867H170.294V65.0331H185.699V51.4438L192.267 43.6929V21.6916H199.169V0.25H200.73Z" fill="white" fill-opacity="0.2" stroke="white" stroke-width="0.5"/>
+<path fill-rule="evenodd" clip-rule="evenodd" d="M278.68 96.2266V110.13H274.814V164.235H269.735V147.573H267.061V143.548L261.211 147.573H259.777V137.564L252.777 123.056L245.778 137.564V171.602H242.492V178.217H237.643V151.221H233.625L233.793 140.019H229.143V136.811H224.431L223.706 117.411L222.982 136.811H222.075V140.019H220.853L221.301 170.017H220.433V156.783L210.691 147.573V164.235H200.95V151.221H194.936V143.548L184.635 155.192V143.548L170.824 159.16V273.25H181.125H184.635H194.497H194.936H200.95H210.691H220.433H222.452H231.191H232.193H237.08H237.643H245.778H251.08H259.777H269.735H274.814H283.421H287.1H295.731H298.071H305.996H310.311H317.282H319.808H323.403H329.523H331.094H337.214H340.517H343.335H354.328H358.882H364.806H370.731H375.291H376.655H383.271H385.033H390.994V162.06H386.303L386.632 140.019H376.655V108.114H370.731V114.896H364.806V121.106H358.882V153.118H354.328V138.234H352.706V136.593H342.139V138.234H340.517V169.27H337.214V129.383H335.592V127.741H325.025V129.383H323.403V152.352H319.808V138.234H318.186V136.593H307.619V138.234H305.996V143.548L302.605 149.395V159.197H298.071V153.118H295.731V138.234H287.1V129.423L283.421 124.397V110.13H279.554V96.2266H278.68Z" fill="white" fill-opacity="0.2"/>
+<path fill-rule="evenodd" clip-rule="evenodd" d="M83.8105 96.2266H84.488V110.13H87.4836V124.397L90.3342 129.423V138.234H97.0206V153.118H98.8337V159.197H102.347V149.395L104.974 143.548V138.234H106.231V136.593H114.417V138.234H115.674V152.352H118.459V129.383H119.716V127.741H127.903V129.383H129.16V169.27H131.718V138.234H132.975V136.593H141.162V138.234H142.418V153.118H145.947V121.106H150.536V114.896H155.126V108.114H159.716V140.019H167.446L167.191 162.06H170.826V273.25H0.25V159.16L10.9501 143.548V155.192L18.9306 143.548V151.221H23.5894V164.235H31.1368V147.573L38.6839 156.783V170.017H39.3563L39.0092 140.019H39.9565V136.811H40.6586L41.22 117.411L41.7817 136.811H45.4318V140.019H49.0344L48.9047 151.221H52.0177V178.217H55.774V171.602H58.3197V137.564L63.7427 123.056L69.1659 137.564V147.573H70.2762L74.8088 143.548V147.573H76.8809V164.235H80.8152V110.13H83.8105V96.2266Z" fill="white" fill-opacity="0.2"/>
+</svg>

package/src/components/icons/ban.tsx

@@ -0,0 +1,77 @@
+import Svg, { Path, Circle, G, ClipPath, Mask } from "react-native-svg";
+
+interface SuspendedIconProps {
+  size?: number;
+  mainColor?: string;
+  fillColor?:string
+}
+
+export default function SuspendedIcon({ size = 87, mainColor = "#C91C1C", fillColor }: SuspendedIconProps) {
+  const scale = size / 87;
+  const height = 57 * scale;
+
+  return (
+    <Svg width={size} height={height} viewBox="0 0 87 57" fill="none">
+      {/* Background blobs - low opacity */}
+      <Path
+        fillRule="evenodd"
+        clipRule="evenodd"
+        d="M83.3533 12.8998C85.3673 12.8998 87 14.5563 87 16.5998C87 18.6432 85.3673 20.2998 83.3533 20.2998H62.515C64.529 20.2998 66.1617 21.9563 66.1617 23.9998C66.1617 26.0432 64.529 27.6998 62.515 27.6998H73.976C75.9901 27.6998 77.6227 29.3563 77.6227 31.3998C77.6227 33.4432 75.9901 35.0998 73.976 35.0998H68.6759C66.1364 35.0998 64.0778 36.7563 64.0778 38.7998C64.0778 40.1621 65.1198 41.3954 67.2036 42.4998C69.2176 42.4998 70.8503 44.1563 70.8503 46.1998C70.8503 48.2432 69.2176 49.8998 67.2036 49.8998H23.9641C21.9501 49.8998 20.3174 48.2432 20.3174 46.1998C20.3174 44.1563 21.9501 42.4998 23.9641 42.4998H3.64671C1.63269 42.4998 0 40.8432 0 38.7998C0 36.7563 1.63269 35.0998 3.64671 35.0998H24.485C26.499 35.0998 28.1317 33.4432 28.1317 31.3998C28.1317 29.3563 26.499 27.6998 24.485 27.6998H11.4611C9.44706 27.6998 7.81437 26.0432 7.81437 23.9998C7.81437 21.9563 9.44706 20.2998 11.4611 20.2998H32.2994C30.2854 20.2998 28.6527 18.6432 28.6527 16.5998C28.6527 14.5563 30.2854 12.8998 32.2994 12.8998H83.3533ZM83.3533 27.6998C85.3673 27.6998 87 29.3563 87 31.3998C87 33.4432 85.3673 35.0998 83.3533 35.0998C81.3393 35.0998 79.7066 33.4432 79.7066 31.3998C79.7066 29.3563 81.3393 27.6998 83.3533 27.6998Z"
+        fill={mainColor}
+        fillOpacity={0.2}
+      />
+
+      {/* Card white fill */}
+      <Path
+        d="M22.5479 27.171C22.1148 24.4438 23.9745 21.8818 26.7018 21.4486L57.3181 16.5862C60.0453 16.153 62.6073 18.0128 63.0404 20.74L66.9618 45.4306C67.3949 48.1578 65.5352 50.7198 62.8079 51.1529L32.1917 56.0154C29.4644 56.4485 26.9024 54.5888 26.4693 51.8616L22.5479 27.171Z"
+        fill={fillColor}
+      />
+
+      {/* Card border - red */}
+      <Path
+        d="M26.7018 21.4486C29.0708 21.1264 31.4395 20.8015 33.8077 20.474C41.6775 19.3856 49.5426 18.2682 57.4031 17.1216C59.7462 16.727 62.1367 18.5313 62.4162 20.8392C63.6392 29.0827 64.8942 37.3212 66.1812 45.5545C66.5804 47.7606 64.8991 50.0665 62.6825 50.3628C52.477 51.9837 42.2794 53.6537 32.0896 55.373C29.818 55.8189 27.3749 54.111 27.0274 51.7729C25.6208 43.5585 24.1822 35.3492 22.7115 27.145C22.6724 26.9271 22.648 26.7087 22.6385 26.4872C22.4949 24.1493 24.31 21.8371 26.7018 21.4486C24.2984 21.7243 22.2863 23.9983 22.3346 26.4939C22.3352 26.7295 22.3518 26.963 22.3843 27.197C23.5279 35.4532 24.7035 43.7042 25.9111 51.9502C26.2713 54.8931 29.3249 57.1753 32.2937 56.6578C42.5148 55.1355 52.728 53.5639 62.9334 51.943C65.9977 51.5317 68.3066 48.3409 67.7424 45.3066C66.4152 37.0796 65.0559 28.8577 63.6647 20.6409C63.2366 17.6678 60.1303 15.4819 57.233 16.0507C49.4041 17.396 41.5797 18.7703 33.76 20.1737C31.4069 20.5961 29.0541 21.021 26.7018 21.4486ZM26.7018 21.4486"
+        fill={mainColor}
+      />
+
+      {/* No symbol inside card */}
+      <G clipPath="url(#clip0)">
+        <Path
+          d="M57.3638 34.8045C57.4989 36.0774 57.4365 37.3571 57.181 38.5888C56.1998 43.5616 51.9113 47.4588 47.1212 48.0121C41.1013 48.9271 35.0751 44.3608 34.2782 38.471C33.2111 32.6241 37.526 26.4153 43.5332 25.4202C48.259 24.4622 53.5439 26.839 56.0175 31.2631C56.642 32.355 57.0979 33.5525 57.3638 34.8045C57.2297 33.5317 56.892 32.2728 56.3561 31.0905C54.268 26.3015 48.7132 23.1322 43.2979 23.9388C36.4327 24.6685 31.0217 31.8582 32.3029 38.7847C33.2308 45.7673 40.603 50.9268 47.3565 49.4935C52.7553 48.5826 57.0548 43.8483 57.5563 38.648C57.6996 37.3578 57.6306 36.0562 57.3638 34.8045ZM57.3638 34.8045"
+          fill={mainColor}
+        />
+        <Path
+          d="M35.4648 29.5566C35.7544 29.8492 36.046 30.1391 36.3395 30.4264C38.9812 33.0112 41.7815 35.3776 44.7405 37.5254C47.6994 39.6733 50.8169 41.6027 54.093 43.3135C54.457 43.5036 54.823 43.691 55.191 43.8757C54.9013 43.5831 54.6098 43.2932 54.3163 43.006C51.6746 40.4211 48.8743 38.0548 45.9153 35.9069C42.9564 33.759 39.8389 31.8297 36.5628 30.1188C36.1987 29.9287 35.8328 29.7413 35.4648 29.5566Z"
+          fill={mainColor}
+        />
+      </G>
+
+      {/* Decorative lines */}
+      <Path
+        d="M26.1752 20.1243C26.4154 19.91 26.6543 19.6946 26.8921 19.4781C29.0315 17.5292 31.0712 15.4894 33.011 13.3588C34.9508 11.2282 36.7908 9.00664 38.5309 6.69423C38.7243 6.4373 38.9164 6.17924 39.1073 5.92006C38.8671 6.13436 38.6281 6.34978 38.3904 6.56632C36.251 8.51519 34.2113 10.5549 32.2715 12.6856C30.3317 14.8162 28.4917 17.0378 26.7516 19.3502C26.5582 19.6071 26.3661 19.8652 26.1752 20.1243Z"
+        fill={mainColor}
+      />
+      <Path
+        d="M59.8904 15.5706C59.6287 15.3954 59.3662 15.2216 59.1029 15.0493C56.7336 13.4988 54.3015 12.0677 51.8065 10.7562C49.3116 9.44459 46.7538 8.25251 44.1332 7.17993C43.842 7.06076 43.5501 6.94306 43.2574 6.82683C43.5191 7.00207 43.7816 7.17583 44.0448 7.34811C46.4141 8.89867 48.8463 10.3297 51.3412 11.6413C53.8362 12.9529 56.3939 14.1449 59.0145 15.2175C59.3057 15.3367 59.5977 15.4544 59.8904 15.5706Z"
+        fill={mainColor}
+      />
+
+      {/* Small circle */}
+      <Path
+        d="M43.3478 5.13559C43.3364 5.40297 43.2844 5.65899 43.1987 5.89425C42.8547 6.84664 41.9783 7.39707 41.1768 7.40421C40.1601 7.43777 39.3243 6.67751 39.1998 5.79438C39.0446 4.91611 39.6037 3.93431 40.5807 3.65124C41.3451 3.40969 42.3489 3.6615 42.971 4.46048C43.1254 4.65758 43.2541 4.88492 43.3478 5.13559C43.3595 4.86834 43.3254 4.59183 43.2418 4.3224C42.9281 3.23152 41.7084 2.34568 40.3925 2.4661C38.729 2.53682 37.2931 4.30343 37.6196 6.04534C37.8489 7.8027 39.7615 9.03749 41.365 8.58935C42.6535 8.29615 43.5387 7.076 43.499 5.94162C43.495 5.65955 43.4417 5.38607 43.3478 5.13559ZM43.3478 5.13559"
+        fill={mainColor}
+      />
+
+      {/* Shadow fill - low opacity */}
+      <Path
+        d="M24 28.8997C24 28.8997 31.1222 40.0146 38 44.3997C44.0919 48.2837 55.5 50.3996 55.5 50.3996L30.431 54.2564C29.9081 54.3369 29.413 53.9961 29.3014 53.4789L24 28.8997Z"
+        fill={mainColor}
+        fillOpacity={0.3}
+      />
+
+      <ClipPath id="clip0">
+        <Path d="M28.9444 29.1927C28.5113 26.4655 30.371 23.9035 33.0983 23.4704L52.8507 20.3333C55.5779 19.9002 58.1399 21.7599 58.5731 24.4871L61.7102 44.2396C62.1433 46.9668 60.2836 49.5288 57.5563 49.962L37.8039 53.099C35.0766 53.5322 32.5146 51.6724 32.0815 48.9452L28.9444 29.1927Z" 
+        fill={fillColor} />
+      </ClipPath>
+    </Svg>
+  );
+}

package/src/components/icons/chatIcon.tsx

@@ -0,0 +1,19 @@
+import Svg, { Path } from "react-native-svg";
+import { IconType } from "../../types/icon";
+
+
+export default function ChatIcon({ 
+  width = 21, 
+  height = 21, 
+  fillColor = "transparent",
+  borderColor = "black",
+}: IconType) {
+  return (
+    <Svg width={width} height={height} viewBox="0 0 21 21" fill="none">
+        <Path d="M10.2812 19.4939C15.2518 19.4939 19.2812 15.4645 19.2812 10.4939C19.2812 5.52333 15.2518 1.4939 10.2812 1.4939C5.31069 1.4939 1.28125 5.52333 1.28125 10.4939C1.28125 11.9815 1.64218 13.3849 2.28125 14.6211L1.28125 19.4939L6.15405 18.4939C7.39029 19.133 8.79362 19.4939 10.2812 19.4939Z" 
+        fill={fillColor}/>
+        <Path d="M10.2812 19.4939C11.2982 19.5944 12.3463 19.5181 13.3658 19.2542C17.1072 18.3477 20.2133 14.676 20.3503 10.4939C20.7604 5.12869 15.8952 -0.10833 10.2812 0.00166595C9.43091 -0.00372839 8.57682 0.0963 7.74859 0.301739C3.16859 1.36292 -0.230757 5.90555 0.0117993 10.4939C0.0642458 12.1212 0.523322 13.7285 1.32697 15.1144L1.22893 14.4051C0.980801 16.0469 0.745727 17.6913 0.523709 19.3384C0.360814 19.9348 0.824424 20.3366 1.43671 20.2514C3.03813 19.8068 4.63688 19.3491 6.23294 18.8783L5.97383 18.8425C6.37324 19.0096 6.78261 19.1473 7.19722 19.2543C8.21582 19.5181 9.26573 19.5945 10.2812 19.4939C9.26534 19.3944 8.28385 19.1285 7.38649 18.7167C7.0211 18.5492 6.6694 18.3579 6.33426 18.1453C6.2752 18.1208 6.13648 18.0914 6.07515 18.1095C4.42269 18.3054 2.7729 18.5143 1.12579 18.7364L2.03879 19.6494C2.48344 18.0479 2.91503 16.4438 3.33357 14.8371C3.35972 14.664 3.32394 14.2788 3.23553 14.1278C2.72318 12.9755 2.49424 11.7253 2.5507 10.4939C2.6593 7.04218 5.22776 3.97719 8.47013 3.21367C9.06031 3.06736 9.66834 2.99123 10.2812 2.98613C14.2552 2.86299 18.0352 6.27119 18.2122 10.4939C18.4548 13.7608 16.4801 17.2305 13.1764 18.7165C12.2783 19.1285 11.2985 19.3943 10.2812 19.4939ZM10.2812 19.4939" 
+        fill={borderColor}/>
+    </Svg>
+  );
+}

package/src/components/icons/homeIcon.tsx

@@ -0,0 +1,25 @@
+import Svg, { Path } from "react-native-svg";
+import { IconType } from "../../types/icon";
+
+
+export default function HomeIcon({ 
+  width = 21, 
+  height = 20, 
+  fillColor = "#13AC6F",
+  borderColor = "#111111",
+}: IconType) {
+  return (
+    <Svg width={width} height={height} viewBox="0 0 21 20" fill="none">
+      {/* Interior fill — transparent when inactive */}
+      <Path
+        d="M15.1797 19.1138H5.17969C4.07512 19.1138 3.17969 18.2183 3.17969 17.1138V10.6138H1.17969L10.1797 1.11377L19.1797 10.1138H17.1797V17.1138C17.1797 18.2183 16.2843 19.1138 15.1797 19.1138Z"
+        fill={fillColor}
+      />
+      {/* Border/outline — always visible, color follows theme */}
+      <Path
+        d="M5.17969 19.1138C6.17298 19.1671 7.16627 19.2178 8.15957 19.2658C10.4996 19.3788 12.8396 19.4771 15.1797 19.5606C16.481 19.6325 17.7284 18.4758 17.7297 17.1138C17.7997 14.7804 17.8551 12.4471 17.8957 10.1138L17.1797 10.8297C17.8464 10.8413 18.513 10.8517 19.1797 10.8609L20.9767 10.877L19.708 9.58543C17.9281 7.75574 16.1358 5.9385 14.331 4.13371C13.1358 2.9385 11.9351 1.74875 10.729 0.564465L10.1748 6.91414e-05L9.61574 0.579506C6.64468 3.77358 3.71095 7.00303 0.814547 10.2678L-0.000202537 11.0907L1.17969 11.1168C1.84635 11.0949 2.51302 11.0719 3.17969 11.0477L2.74574 10.6138C2.82444 12.7804 2.91582 14.9471 3.01989 17.1138C3.02249 17.1723 3.02738 17.2299 3.03462 17.2877C3.15066 18.3698 4.17559 19.1927 5.17969 19.1138C4.16879 19.0784 3.34196 18.192 3.33765 17.2634C3.33626 17.2134 3.3369 17.1638 3.33948 17.1138C3.44355 14.9471 3.53494 12.7804 3.61363 10.6138L3.59732 10.1647L3.17969 10.1798C2.51302 10.1556 1.84635 10.1326 1.17969 10.1108L1.54483 10.9597C4.64843 7.89118 7.7147 4.78729 10.7436 1.64803L9.63038 1.66307C10.8147 2.8692 12.0044 4.06987 13.1996 5.26508C15.0044 7.06987 16.8217 8.86221 18.6514 10.6421L19.1797 9.36659C18.513 9.37579 17.8464 9.38619 17.1797 9.39779L16.4515 9.41046L16.4637 10.1138C16.5043 12.4471 16.5596 14.7804 16.6297 17.1138C16.6828 17.8824 16.009 18.6469 15.1797 18.6669C12.8396 18.7504 10.4996 18.8487 8.15957 18.9618C7.16627 19.0098 6.17298 19.0604 5.17969 19.1138ZM5.17969 19.1138"
+        fill={borderColor}
+      />
+    </Svg>
+  );
+}

package/src/components/icons/profileIcon.tsx

@@ -0,0 +1,29 @@
+import Svg, { Circle, ClipPath, Defs, G, Path, Rect } from "react-native-svg";
+import { IconType } from "../../types/icon";
+
+
+export default function ProfileIcon({ 
+  width = 24, 
+  height = 24, 
+  fillColor = "transparent",
+  borderColor = "black",
+}: IconType) {
+  return (
+    <Svg width={width} height={height} viewBox="0 0 24 24" fill="none">
+      <G clip-path="url(#clip0_1714_15011)">
+        <Path d="M5 18C5 15.7909 6.79086 14 9 14H15C17.2091 14 19 15.7909 19 18C19 19.1046 18.1046 20 17 20H7C5.89543 20 5 19.1046 5 18Z" 
+        fill={fillColor}/>
+        <Path d="M9 14C9.58084 14.0667 10.1617 14.13 10.7425 14.19C12.1617 14.3366 13.5808 14.4633 15 14.5701C16.8308 14.7003 18.2 16.3708 18.0871 18C18.0627 18.5789 17.5354 19.0413 17 19.0132C16.3333 19.0044 15.6667 19 15 19C12.3333 19 9.66667 19.0703 7 19.2108C6.36249 19.2859 5.65648 18.754 5.59116 18C5.46379 16.7079 6.13873 15.2938 7.39201 14.5449C7.8676 14.2564 8.41864 14.0661 9 14C8.41916 13.9326 7.80839 13.997 7.23144 14.2005C5.71722 14.7116 4.50033 16.2472 4.40884 18C4.29171 19.3767 5.50686 20.7659 7 20.7892C9.66667 20.9297 12.3333 21 15 21C15.6667 21 16.3333 20.9956 17 20.9868C18.5952 21.0105 19.9891 19.5518 19.9129 18C19.9036 15.3679 17.4305 13.1961 15 13.4299C13.5808 13.5367 12.1617 13.6634 10.7425 13.81C10.1617 13.87 9.58084 13.9333 9 14ZM9 14" 
+        fill={borderColor}/>
+        <Circle cx={width/2} cy={width/4+1} r={width/8+1} transform="rotate(-180 12 7)" fill={fillColor}/>
+        <Path d="M8 7C8.06655 6.58039 8.19513 6.18295 8.37549 5.82218C9.09666 4.36153 10.6396 3.5962 12 3.75C13.7277 3.89656 15.0307 5.41925 15 7C15.0307 8.58075 13.7277 10.1034 12 10.25C10.6396 10.4038 9.09666 9.63846 8.37549 8.17782C8.19513 7.81704 8.06655 7.41961 8 7C7.93315 7.4194 7.93536 7.85901 8.01407 8.29518C8.29724 10.0557 9.98238 11.6461 12 11.75C14.5335 12.0002 17.0729 9.68054 17 7C17 7 17 7 17 7C17.0729 4.31946 14.5336 1.99983 12 2.25C9.98238 2.35389 8.29724 3.94429 8.01407 5.70482C7.93536 6.14099 7.93315 6.5806 8 7ZM8 7" 
+        fill={borderColor}/>
+        </G>
+        <Defs>
+        <ClipPath id="clip0_1714_15011">
+        <Rect width={width} height={height} fill={fillColor}/>
+        </ClipPath>
+        </Defs>
+    </Svg>
+  );
+}

package/src/components/icons/settingsIcon.tsx

@@ -0,0 +1,22 @@
+import Svg, { Path } from "react-native-svg";
+import { IconType } from "../../types/icon";
+
+
+export default function SettingsIcon({ 
+  width = 24, 
+  height = 24, 
+  fillColor = "transparent",
+  borderColor = "black",
+}: IconType) {
+  return (
+    <Svg width={width} height={height} viewBox="0 0 24 24" fill="none">
+      <Path d="M5.39783 5.87909C4.46809 6.88119 3.79297 8.0704 3.39988 9.34448L4.99919 10.2678C6.33252 11.0376 6.33252 12.9621 4.99919 13.7319L3.39817 14.6563C3.59338 15.2863 3.86134 15.9046 4.20504 16.4999C4.54873 17.0952 4.95015 17.6363 5.39816 18.1204L6.99921 17.196C8.33255 16.4262 9.99921 17.3885 9.99921 18.9281L9.99921 20.7749C11.2991 21.0715 12.6666 21.0814 13.9993 20.7773L13.9993 18.9282C13.9993 17.3886 15.666 16.4263 16.9993 17.1961L18.6007 18.1207C19.5304 17.1186 20.2056 15.9294 20.5987 14.6553L18.9993 13.7319C17.666 12.9621 17.666 11.0376 18.9993 10.2678L20.6004 9.34342C20.4051 8.7134 20.1372 8.09517 19.7935 7.49989C19.4498 6.90458 19.0484 6.3634 18.6003 5.87932L16.9993 6.80368C15.666 7.57348 13.9993 6.61123 13.9993 5.07162L13.9993 3.22489C12.6994 2.92828 11.3319 2.91835 9.99921 3.22248L9.99921 5.0716C9.99921 6.6112 8.33255 7.57345 6.99921 6.80365L5.39783 5.87909Z" 
+        fill={fillColor}/>
+        <Path d="M3.39988 9.34448C3.81465 8.22471 4.44596 7.20017 5.24116 6.34417C5.3428 6.23465 5.44709 6.12784 5.55387 6.02387L5.2914 6.06343C5.8099 6.3981 6.32885 6.732 6.84825 7.06513C8.22623 8.04452 10.4986 6.90475 10.4832 5.0716C10.508 4.45523 10.5319 3.83885 10.5548 3.22248L10.1228 3.76418C11.3634 3.53166 12.6439 3.58327 13.8451 3.9008L13.306 3.22489C13.287 3.84047 13.2688 4.45605 13.2515 5.07162C13.1117 7.08657 15.6348 8.6416 17.4252 7.54134C17.9655 7.24471 18.5054 6.94731 19.0448 6.64914L17.948 6.48311C18.35 6.93589 18.7006 7.43261 18.9939 7.96155C19.2873 8.4904 19.5218 9.04874 19.6916 9.625L20.1247 8.51951C19.5872 8.82106 19.0501 9.12337 18.5135 9.42646C16.5658 10.4192 16.5446 13.5746 18.5006 14.5956C19.0329 14.905 19.5655 15.2135 20.0986 15.5213C20.0987 15.5213 20.0987 15.5213 20.0987 15.5213L19.6431 14.3605C19.2911 15.5038 18.6848 16.5672 17.877 17.4492L19.0943 17.2657C18.5586 16.9609 18.0224 16.6568 17.4858 16.3535C15.6323 15.1885 12.9551 16.7836 13.0787 18.9282C13.0884 19.5445 13.099 20.1609 13.1105 20.7773L13.8015 19.9107C12.6269 20.2054 11.3799 20.2347 10.1774 19.994L10.8001 20.7749C10.7848 20.1593 10.7685 19.5437 10.7514 18.9281C10.7954 16.8997 8.27837 15.5698 6.68833 16.6576C6.16525 16.9841 5.6426 17.3113 5.12041 17.6393L5.80585 17.7431C5.35918 17.2975 4.96038 16.7997 4.61825 16.2613C4.27598 15.723 3.99114 15.1455 3.773 14.5402L3.59437 14.9961C4.11462 14.6648 4.63441 14.3326 5.15376 13.9997C5.97092 13.5045 6.36883 12.476 6.15336 11.6018C6.01632 10.9839 5.59144 10.4511 5.04949 10.1807C4.50006 9.9012 3.95019 9.62246 3.39988 9.34448C3.91577 9.68208 4.4321 10.0189 4.94888 10.355C5.41321 10.6533 5.71796 11.1491 5.77948 11.6698C5.87987 12.4156 5.47871 13.1585 4.84461 13.4642C4.29661 13.7475 3.74906 14.0316 3.20196 14.3165L2.92351 14.4938L3.02333 14.7724C3.20291 15.4514 3.46171 16.1126 3.79183 16.7385C4.1217 17.3644 4.52381 17.9568 4.99047 18.4977L5.31808 18.8263L5.67591 18.6015C6.22108 18.3133 6.76581 18.0243 7.31009 17.7345C8.19155 17.2332 9.34346 18.0216 9.24704 18.9281C9.2299 19.5437 9.21365 20.1593 9.19829 20.7749L9.21472 21.4332L9.82104 21.5557C11.2401 21.915 12.7497 21.9496 14.1971 21.6439L14.9011 21.4694L14.8882 20.7773C14.8996 20.1609 14.9102 19.5445 14.92 18.9282C14.903 18.1378 15.8948 17.6146 16.5128 18.0387C17.0438 18.3518 17.5752 18.6641 18.1071 18.9757L18.7968 19.3681L19.3245 18.7922C20.3476 17.7036 21.115 16.3771 21.5542 14.9501L21.7893 14.188L21.0987 13.7893C21.0987 13.7893 21.0987 13.7893 21.0986 13.7893C20.5655 13.4815 20.032 13.1744 19.498 12.8682C18.842 12.5434 18.8208 11.4622 19.485 11.1091C20.0158 10.796 20.5461 10.482 21.076 10.1673L21.7392 9.77345L21.5091 9.06185C21.2812 8.35386 20.9721 7.67352 20.5931 7.03823C20.2144 6.40277 19.764 5.80932 19.2527 5.27553L18.7496 4.75182L18.1559 5.1095C17.6279 5.42756 17.1005 5.7464 16.5734 6.06601C15.8923 6.55486 14.7465 5.99161 14.7471 5.07162C14.7298 4.45605 14.7117 3.84047 14.6926 3.22489L14.6748 2.65105L14.1535 2.54898C12.7331 2.26656 11.257 2.31293 9.87559 2.68077L9.42786 2.80066L9.44358 3.22248C9.46656 3.83885 9.49043 4.45523 9.51519 5.0716C9.64032 6.17338 8.24369 7.15188 7.15018 6.54218C6.60198 6.25893 6.05334 5.97646 5.50426 5.69475L5.34402 5.61255L5.24179 5.73432C5.14115 5.85391 5.04376 5.97597 4.94972 6.10032C4.21379 7.07242 3.68706 8.18559 3.39988 9.34448ZM3.39988 9.34448" 
+        fill={borderColor}/>
+        <Path d="M14 12C13.9334 12.2099 13.8375 12.398 13.7219 12.5596C13.2518 13.2149 12.5159 13.3913 12 13.25C11.3376 13.0775 10.9952 12.5154 11 12C10.9952 11.4846 11.3376 10.9225 12 10.75C12.5159 10.6087 13.2518 10.7851 13.7219 11.4404C13.8375 11.602 13.9334 11.7901 14 12C14.0668 11.7904 14.0973 11.56 14.0833 11.3231C14.0512 10.3678 13.1731 9.36636 12 9.25C10.5318 9.02573 8.95304 10.3848 9 12C9 12 9 12 9 12C8.95304 13.6152 10.5318 14.9743 12 14.75C13.1731 14.6336 14.0512 13.6322 14.0833 12.6769C14.0973 12.44 14.0668 12.2096 14 12ZM14 12" 
+        fill={borderColor}/>
+    </Svg>
+  );
+}
+

package/src/components/reusable/templatePage.tsx

@@ -0,0 +1,94 @@
+import { KeyboardAvoidingView, Platform, ScrollView, View, Text, Image } from "react-native";
+import { Fonts, textSize } from "../../tokens/typography";
+import { useAppTheme } from "../../context/ThemeContext";
+import BgDark from "../../assets/images/bg_dark.svg";
+import BgLight from "../../assets/images/bg_light.svg";
+
+interface TemplateProps{
+    title: string;
+    subtitle: string;
+    body: React.ReactNode;
+    footer?: React.ReactNode;
+    marginTop?:number;
+}
+export default function TemplatePage({title, subtitle, body, footer, marginTop=-120}: TemplateProps){
+    const {colors, isDark} = useAppTheme();
+    return (
+    <KeyboardAvoidingView
+      style={{ flex: 1, backgroundColor: colors.background.main }}
+      behavior={Platform.OS === "ios" ? "padding" : undefined}
+    >
+      <ScrollView
+        contentContainerStyle={{ flexGrow: 1 }}
+        showsVerticalScrollIndicator={false}
+        keyboardShouldPersistTaps="handled"
+      >
+        {/* Green header */}
+        <View style={{
+          backgroundColor: colors.primary,
+          paddingTop: 70,
+          paddingBottom: 90,
+          height: "50%",
+          overflow: "hidden",
+        }}>
+          <Text style={{
+            fontFamily: Fonts.montserrat.bold,
+            fontSize: textSize.xxl,
+            color: colors.text.primary,
+            textAlign: "center",
+            marginBottom: 10,
+          }}>
+            {title}
+          </Text>
+          <Text style={{
+            fontFamily: Fonts.montserrat.regular,
+            fontSize: textSize.sm,
+            color: colors.text.primary,
+            textAlign: "center",
+            alignSelf:"center",
+            maxWidth: 240,
+          }}>
+            {subtitle}
+          </Text>
+          <View
+  style={{
+    position: "absolute",
+    left: 0,
+    right: 0,
+    top: 110,
+    bottom: 0,
+  }}
+>
+  {isDark ? (
+    <BgDark
+      width="100%"
+      height="100%"
+      style={{ flex: 1 }}
+      preserveAspectRatio="xMinYMin meet"
+    />
+  ) : (
+    <BgLight
+      width="100%"
+      height="100%"
+      style={{ flex: 1 }}
+      preserveAspectRatio="xMinYMin meet"
+    />
+  )}
+</View>
+        </View>
+        {/* Floating white card */}
+        <View style={{
+          backgroundColor: colors.background.card,
+          borderRadius: 10,
+          marginTop: marginTop,
+          marginHorizontal: 25,
+          padding: 20,
+        //   paddingTop: 28,
+        }}>
+          {body}
+        </View>
+        {footer}
+      </ScrollView>
+    </KeyboardAvoidingView>
+  );
+}

package/src/components/reusable/templateSubPage.tsx

@@ -0,0 +1,66 @@
+import { View, Text, ScrollView } from "react-native";
+import PageTopBar from "../ui/PageTopBar";
+import Button from "../ui/button";
+import { useAppTheme } from "../../context/ThemeContext";
+import ErrorMessage from "../ui/error";
+import { textSize } from "../../tokens/typography";
+import SharpButton from "../ui/sharpButton";
+
+interface Props {
+  title: string;
+  text: string;
+  children: React.ReactNode;
+  buttonText?: string;
+  handleFunction?: () => void;
+  error?: string;
+  onBack: () => void;
+  loading?:boolean;
+}
+
+export default function TemplateSubPage({
+  title,
+  text,
+  children,
+  buttonText,
+  handleFunction,
+  error,
+  onBack,
+  loading,
+}: Props) {
+  const { colors } = useAppTheme();
+
+  return (
+    <View style={{
+      flex: 1,
+      paddingBottom: 60,
+      paddingTop: 80,
+      paddingHorizontal: 20,
+    }}>
+      <PageTopBar title={title} description={text} onBack={onBack} />
+      <ScrollView
+        style={{ flex: 1 }}
+        showsVerticalScrollIndicator={false}
+        contentContainerStyle={{ flexGrow: 1 }}
+      >
+        <View style={{ flex: 1, gap: 20, marginTop: 20 }}>
+          {error && (
+            <ErrorMessage message={error} position="center" fontSize={textSize.md} />
+          )}
+          {children}
+        </View>
+
+        {buttonText && (
+          <View style={{ marginTop: 32 }}>
+            <SharpButton
+              text={buttonText}
+              bgColor={colors.primary}
+              onPress={handleFunction}
+              height={50}
+              loading={loading}
+            />
+          </View>
+        )}
+      </ScrollView>
+    </View>
+  );
+}

package/src/components/screens/AccountStatusScreen.tsx

@@ -0,0 +1,102 @@
+import { ScrollView, View, Text } from "react-native";
+import { useAppTheme } from "../../context/ThemeContext";
+import { Fonts, textSize } from "../../tokens/typography";
+import SharpButton from "../ui/sharpButton";
+
+interface StatusProps{
+    icon?: React.ReactNode;
+    title:string;
+    description: string;
+    primaryLabel?:string;
+    onPrimaryPress?:()=>void;
+    secondaryLabel?:string;
+    onSecondaryPress?:()=>void;
+    loading?:boolean;
+    primaryButtonColor?:string;
+    secondaryButtonColor?:string;
+}
+
+export default function AccountStatusScreen({icon, title, description, primaryLabel,onPrimaryPress, secondaryLabel, onSecondaryPress, loading, primaryButtonColor, secondaryButtonColor}: StatusProps){
+   const {colors, isDark} = useAppTheme();
+
+  return (
+    <ScrollView
+      showsVerticalScrollIndicator={false}
+      contentContainerStyle={{
+        flexGrow: 1,
+        justifyContent: "center",
+      }}
+    >
+      <View
+        style={{
+          alignItems: "center",
+          paddingHorizontal:20
+        }}
+      >
+        <View
+          style={{
+            marginBottom: 24,
+          }}
+        >
+          {icon}
+        </View>
+
+        <Text
+          style={{
+            fontFamily: Fonts.montserrat.bold,
+            fontSize: textSize.xl,
+            color: colors.text.primary,
+            textAlign: "center",
+            marginBottom: 12,
+          }}
+        >
+          {title}
+        </Text>
+
+        <Text
+          style={{
+            fontFamily: Fonts.montserrat.regular,
+            fontSize: textSize.sm,
+            color: colors.text.secondary,
+            textAlign: "center",
+            lineHeight: 24,
+            marginBottom: 30,
+          }}
+        >
+          {description}
+        </Text>
+
+        <View
+          style={{
+            width: "100%",
+            gap: 12,
+          }}
+        >
+          {primaryLabel && (
+            <View style={{paddingHorizontal:30}}>
+            <SharpButton
+              text={primaryLabel}
+              bgColor={primaryButtonColor ?? colors.semantic.error}
+              textColor={colors.text.primary}
+              onPress={onPrimaryPress}
+              loading={loading}
+            />
+            </View>
+          )}
+
+          {secondaryLabel && (
+            <View style={{paddingHorizontal:30}}>
+            <SharpButton
+              text={secondaryLabel}
+              bgColor={colors.background.main ?? "transparent"}
+              borderColor={secondaryButtonColor ?? colors.semantic.border}
+              textColor={secondaryButtonColor ?? colors.semantic.border}
+              onPress={onSecondaryPress}
+            />
+            </View>
+          )}
+        </View>
+      </View>
+    </ScrollView>
+    )
+}