'use client';

import React from 'react';
import Image from 'next/image';

interface AuthLayoutProps {
  children: React.ReactNode;
  backgroundImage?: string;
}

const AuthLayout: React.FC<AuthLayoutProps> = ({ children, backgroundImage }) => {
  return (
    <div className="relative min-h-screen w-full overflow-hidden">
      {/* Background Image */}
      <Image
        src={backgroundImage || '/default-auth-bg.png'}
        alt="Auth Background"
        fill
        priority
        className="object-cover z-0"
      />

      {/* Gradient overlay (optional for better readability) */}
     
      {/* Foreground content */}
      <div className="relative z-20 flex items-center justify-end min-h-screen p-6">
        <div className="w-full max-w-md">
          {children}
        </div>
      </div>
    </div>
  );
};

export default AuthLayout;