import { OG_CONSTANT } from "@/app/_lib/helper/const-data";
import { SITE_BASE_URL } from "@/app/_lib/helper/env";
import StudentRegistrationForm from "./StudentRegistrationForm";
import whiteLogo from "@/public/white-logo.png";
import Image from "next/image";
export const metadata = {
  title: "پیش ثبت نام دانش آموز",
  alternates: {
    canonical: `/student-registration`,
  },
  openGraph: {
    ...OG_CONSTANT,
    title: "پیش ثبت نام دانش آموز",
    url: SITE_BASE_URL + "/student-registration",
  },
};
export default function Page() {
  return (
    <main className="std-reg flex pt-[115px] pb-20 items-center min-h-screen bg-gradient-to-tr from-primary-main to-primary-600 w-screen top-0 right-0 max-[1075px]:h-full">
      <div className="absolute left-0 flex flex-col text-white justify-center items-center w-[19%] max-[1245px]:w-[calc(25%)] max-[1075px]:w-[calc(32%)] max-[820px]:hidden ">
        <Image src={whiteLogo} alt="white logo" width={"200"} />
        <span className="text-lg">مجموعه فرهنگی و آموزشی شریف</span>
      </div>
      <div
        style={{ borderRadius: "58px 0px 0px 58px / 107px 0px 0px 107px" }}
        className="p-4 bg-white top-32 w-[calc(75%)] z-20   h-[100%] px-[100px] max-[1125px]:px-[50px] max-[1245px]:w-[calc(70%)] max-[1075px]:w-[calc(65%)]  max-[720px]:w-[calc(85%)] max-[620px]:w-[calc(100%)] max-[620px]:px-0  max-[620px]:!rounded-none"
      >
        <h1 className="mb-10 !mr-[-4.5rem] page-title-2 max-[1125px]:!mr-[-1.5rem]  max-[620px]:!mr-[20px]">
          پیش ثبت نام دانش آموز
        </h1>
        <StudentRegistrationForm />
        {/* <div className="bg-white h-full top-0 absolute z-10 w-auto aspect-[1/4] left-[-75px] rounded-[100%] max-[1075px]:left-[-125px] max-[620px]:hidden"></div> */}
      </div>
    </main>
  );
}