import AuthDivider from "@/components/auth/login/AuthDivider";
import AuthFooter from "@/components/auth/login/AuthFooter";
import AuthHeader from "@/components/auth/login/AuthHeader";
import AuthIllustration from "@/components/auth/login/AuthIllustration";
import LoginForm from "@/components/auth/login/LoginForm";
import SocialLogin from "@/components/auth/login/SocialLogin";
import { ScrollArea } from "@/components/ui/scroll-area";

export default function LoginPage() {
  return (
    <main className="flex min-h-screen w-full flex-col items-center justify-center gap-6 px-4 py-6 md:flex-row md:items-stretch md:justify-center md:gap-8 md:overflow-hidden md:px-8">
      <AuthIllustration />

      <section className="flex w-full max-w-md flex-col justify-center md:w-[42%] md:max-w-120">
        <ScrollArea className="h-[calc(100vh-3rem)] w-full">
          <div className="w-full py-2">
            <AuthHeader authType="login" />
            <LoginForm />
            <AuthDivider />
            <SocialLogin />
            <AuthFooter authType="login" />
          </div>
        </ScrollArea>
      </section>
    </main>
  );
}