'use client';

import React from 'react';
import { Box } from './Box';
import { Stack } from './Stack';
import { Text } from './Text';
import { LoadingSpinner } from './LoadingSpinner';

interface AuthLoadingProps {
  message?: string;
}

export function AuthLoading({ message = 'Authenticating...' }: AuthLoadingProps) {
  return (
    <Box style={{ minHeight: '100vh', display: 'flex', alignItems: 'center', justifyContent: 'center', backgroundColor: '#0f1115' }}>
      <Stack align="center" gap={4}>
        <LoadingSpinner size={12} />
        <Text color="text-gray-400">{message}</Text>
      </Stack>
    </Box>
  );
}