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

interface OnboardingErrorProps {
  message: string;
}

export function OnboardingError({ message }: OnboardingErrorProps) {
  return (
    <Box 
      mt={6} 
      display="flex" 
      alignItems="start" 
      gap={3} 
      p={4} 
      rounded="xl" 
      bg="bg-red-500/10" 
      border 
      borderColor="border-red-500/30"
    >
      <Text color="text-red-400" flexShrink={0} mt={0.5}>⚠</Text>
      <Text size="sm" color="text-red-400">{message}</Text>
    </Box>
  );
}