<template>
    <div class="h-screen flex flex-col flex-col-reverse md:flex-row">
        <div class="basis-1/2 flexBox">
            <div class="w-full md:w-[43.75vw] text-primaryTextColor space-y-[2vw]">
              <!-- <div class="content mb-[3vw]">
                <p class="font-bold text-[1.901vw]">ورود به Shinan Learning</p>
                <p class="text-[0.938vw] leading-[1.406vw] mt-[0.5vw]">
                  لورم ایپسوم متن ساختگی با تولید سادگی نامفهوم از صنعت چاپ و با
                  استفاده از طراحان گرافیک است چاپگرها و متون بلکه روزنامه و مجله در
                  ستون و سطرآنچنان که لازم است و برای شرایط فعلی تکنولوژی مورد نیاز و
                  کاربردهای متنوع با هدف بهبود ابزارهای کاربردی می باشد کتابهای زیادی
                  در شصت و سه درصد گذشته حال و آینده
                </p>
              </div>
         
              <nuxt-link  class="greenButton" to="/signup">ثبت نام</nuxt-link> -->
              <login-pageLogin-svg />
            </div>
          </div>
      <div class="basis-1/2 bg-secondaryGreen flexBox">
              <svg
              class="absolute top-0 left-0 w-[17.031vw h-[6.927vw]"
              viewBox="0 0 293 133" fill="none" xmlns="http://www.w3.org/2000/svg">
                <mask id="path-1-inside-1_277_3524" fill="white">
                <path d="M0 0H293V133H0V0Z"/>
                </mask>
                <path d="M0 0H293V133H0V0Z" fill="#DDECEC"/>
                <path d="M293 132H0V134H293V132Z" fill="#E5E5E5" mask="url(#path-1-inside-1_277_3524)"/>
                <path d="M50.1488 72.6553C50.1488 71.0563 49.8231 69.6943 49.1717 68.5691C48.5795 67.3847 47.5727 66.3483 46.1515 65.46C44.9078 64.631 43.5458 63.9499 42.0653 63.417C40.5848 62.8248 38.749 62.2029 36.5578 61.5515C35.0181 61.0778 33.4192 60.5448 31.761 59.9526C30.1028 59.3604 28.5927 58.709 27.2307 57.9983C23.3221 56.0441 20.4204 53.7937 18.5253 51.2472C16.6895 48.6416 15.7716 45.651 15.7716 42.2754C15.7716 38.7814 16.7487 35.7316 18.703 33.1259C20.7165 30.461 23.4406 28.4179 26.8753 26.9967C30.3101 25.5754 34.1298 24.8647 38.3344 24.8647C42.5983 24.8647 46.4476 25.6642 49.8823 27.2631C53.3763 28.8621 56.13 31.1421 58.1435 34.1031C60.157 37.0048 61.1637 40.3804 61.1637 44.2297H50.06C50.06 40.9134 49.0236 38.3077 46.9509 36.4126C44.8782 34.5176 41.9764 33.5701 38.2456 33.5701C34.6924 33.5701 31.909 34.3695 29.8956 35.9685C27.8821 37.5082 26.8753 39.6105 26.8753 42.2754C26.8753 44.8219 28.2374 46.9538 30.9615 48.6712C32.2644 49.5003 33.656 50.2109 35.1365 50.8031C36.617 51.3361 38.3936 51.9283 40.4663 52.5797C43.0128 53.4088 45.0263 54.1194 46.5068 54.7116C48.0465 55.3038 49.6158 56.0441 51.2148 56.9324C54.6495 58.7682 57.1664 60.9889 58.7653 63.5946C60.4235 66.1411 61.2526 69.1021 61.2526 72.4776C61.2526 75.9716 60.3346 79.0214 58.4988 81.6271C56.663 84.2328 54.0277 86.2463 50.593 87.6675C47.2174 89.0888 43.2497 89.7995 38.6897 89.7995C34.3667 89.7995 30.3101 89.0296 26.52 87.4899C22.7299 85.9502 19.6505 83.6702 17.2817 80.65C14.9721 77.6298 13.8173 73.9877 13.8173 69.7239H24.9211C24.9211 73.3363 26.1055 76.1493 28.4743 78.1627C30.9023 80.117 34.3075 81.0941 38.6897 81.0941C42.3022 81.0941 45.1151 80.3539 47.1286 78.8734C49.1421 77.3929 50.1488 75.3202 50.1488 72.6553ZM81.4419 89H70.7823V42.0978H81.4419V89ZM69.9829 29.7504C69.9829 28.0922 70.5159 26.7302 71.5818 25.6642C72.707 24.5982 74.2171 24.0653 76.1121 24.0653C77.948 24.0653 79.4285 24.5982 80.5536 25.6642C81.6788 26.7302 82.2414 28.0922 82.2414 29.7504C82.2414 31.4085 81.6788 32.7706 80.5536 33.8366C79.4285 34.8433 77.948 35.3467 76.1121 35.3467C74.2171 35.3467 72.707 34.8433 71.5818 33.8366C70.5159 32.7706 69.9829 31.4085 69.9829 29.7504ZM90.9343 64.8382C90.9343 60.0414 91.7337 55.8664 93.3327 52.3132C94.9316 48.76 97.1228 46.0359 99.9061 44.1408C102.749 42.1866 106.035 41.2095 109.766 41.2095C115.155 41.2095 119.36 43.0749 122.38 46.8057L122.824 42.0978H132.507V87.5787C132.507 90.7766 131.766 93.8857 130.286 96.9059C128.865 99.9261 126.525 102.443 123.268 104.456C120.071 106.47 115.984 107.477 111.01 107.477C107.575 107.477 104.229 106.766 100.972 105.345C97.7742 103.983 95.3462 102.147 93.688 99.8373L98.5736 93.5303C101.831 97.3204 105.798 99.2155 110.477 99.2155C114.149 99.2155 116.932 98.2087 118.827 96.1952C120.781 94.241 121.758 91.3984 121.758 87.6675V84.6473C118.738 88.1413 114.711 89.8883 109.677 89.8883C105.947 89.8883 102.66 88.8816 99.8173 86.8681C97.0339 84.8546 94.8428 82.012 93.2438 78.3404C91.7041 74.6095 90.9343 70.2865 90.9343 65.3712V64.8382ZM101.683 66.0819C101.683 70.8195 102.601 74.5503 104.436 77.2744C106.331 79.9393 108.967 81.2718 112.342 81.2718C116.665 81.2718 119.804 79.4656 121.758 75.8532V55.0669C119.686 51.573 116.577 49.826 112.431 49.826C108.996 49.826 106.331 51.2176 104.436 54.001C102.601 56.7251 101.683 60.7521 101.683 66.0819ZM153.06 42.0978L153.416 47.7829C156.91 43.4006 161.529 41.2095 167.273 41.2095C177.104 41.2095 182.049 46.9242 182.108 58.3536V89H171.448V58.5313C171.389 55.4519 170.708 53.2311 169.405 51.8691C168.162 50.507 166.059 49.826 163.098 49.826C161.026 49.826 159.16 50.3589 157.502 51.4249C155.903 52.4316 154.659 53.8529 153.771 55.6887V89H143.023V42.0978H153.06ZM226.431 89H215.327V25.8419H226.431V89ZM248.744 42.0978L249.099 47.7829C252.593 43.4006 257.212 41.2095 262.956 41.2095C272.787 41.2095 277.732 46.9242 277.791 58.3536V89H267.131V58.5313C267.072 55.4519 266.391 53.2311 265.088 51.8691C263.845 50.507 261.742 49.826 258.781 49.826C256.709 49.826 254.843 50.3589 253.185 51.4249C251.586 52.4316 250.342 53.8529 249.454 55.6887V89H238.706V42.0978H248.744Z" fill="url(#paint0_linear_277_3524)"/>
                <defs>
                <linearGradient id="paint0_linear_277_3524" x1="146.5" y1="0" x2="146.5" y2="133" gradientUnits="userSpaceOnUse">
                <stop stop-color="#878787" stop-opacity="0.19"/>
                <stop offset="0.7" stop-color="#878787" stop-opacity="0"/>
                </linearGradient>
                </defs>
                </svg>
                
                <login-pageCheck-otp v-if="showCheckOtpForm" />
                <login-pageLogin-form  v-else/>
      </div>
    </div>
  </template>

  <script setup>
  definePageMeta({
    middleware : 'guest'
})
 const showCheckOtpForm = useState('showCheckOtpForm', () => false)
  </script>