<template>
  <div class="page flex h-screen flex-col bg-#fff">
    <div class="flex main pos-relative">
      <div class="side-left flex-1 h-full flex justify-center items-center left-bg">
        <div class="flex flex-col h-full pt-150px pb-100px items-center justify-between">
          <div class="text-#fff text-40px lh-60px font-bold text-center">
            <div>EJET Partner</div>
            <div>Referral Program</div>
          </div>
          <img src="@/assets/images/zc_logo.png" class="w-260px h-36px" alt="" srcset="" />
        </div>
      </div>
      <div class="side-right w-50% flex items-center justify-center">
        <div class="pos-relative">
          <slot></slot>
        </div>
      </div>
    </div>
  </div>
</template>

<script setup lang="ts">
</script>

<style scoped lang="less">
.page {
  .main {
    min-height: calc(100vh);
    height: fit-content;

    .left-bg {
      background-image: url('@/assets/images/login_bg.png');
      background-size: cover;
      background-position: center;
    }
  }
}
</style>
