import { Wallet } from 'lucide-react';

interface LogoProps {
  size?: 'sm' | 'md' | 'lg';
  showText?: boolean;
}

const sizeMap = {
  sm: {
    icon: 24,
    text: 'text-lg',
  },
  md: {
    icon: 32,
    text: 'text-xl',
  },
  lg: {
    icon: 40,
    text: 'text-2xl',
  },
};

export function Logo({ size = 'md', showText = true }: LogoProps) {
  const { icon, text } = sizeMap[size];

  return (
    <div className="flex items-center gap-2">
      <div className="flex items-center justify-center">
        <Wallet className="text-emerald-500" size={icon} strokeWidth={2} />
      </div>
      {showText && (
        <span className={`font-bold text-slate-100 ${text}`}>Finanzas</span>
      )}
    </div>
  );
}