'use client';

import { TopBarControls } from '@/components/ui/shared/TopBarControls';

type AuthPageShellProps = {
  header: React.ReactNode;
  children: React.ReactNode;
};

export function AuthPageShell({ header, children }: AuthPageShellProps) {
  return (
    <div className="relative min-h-[100dvh] app-web-bg flex flex-col justify-center px-4 pb-8 pt-16 sm:px-6 sm:py-12 sm:pt-12 lg:px-8">
      <div className="absolute top-3 right-3 sm:top-4 sm:right-4 z-10">
        <TopBarControls />
      </div>

      <div className="w-full max-w-md mx-auto">
        {header}
        <div className="mt-6 sm:mt-8">{children}</div>
      </div>
    </div>
  );
}
