import React from 'react';
import { Compass } from 'lucide-react';

interface EmptyStateProps {
  title?: string;
  description?: string;
}

export const EmptyState: React.FC<EmptyStateProps> = ({
  title = 'No journeys found',
  description = 'Try adjusting your filters to discover more expeditions.',
}) => {
  return (
    <div className="flex flex-col items-center justify-center py-16 text-center">
      <Compass className="w-16 h-16 text-[var(--ink-muted)] mb-4" />
      <h3 className="text-2xl font-display font-semibold text-[var(--ink)] mb-2">{title}</h3>
      <p className="text-[var(--ink-muted)] max-w-md">{description}</p>
    </div>
  );
};