import { cn } from '@/lib/cn';

const USE_OFFICIAL = import.meta.env.VITE_USE_OFFICIAL_LOGO === 'true';

/** Fallback logotype (official UQO logo requires authorisation from Service des communications). */
export function Logo({ className, inverted = false, withText = true }: { className?: string; inverted?: boolean; withText?: boolean }) {
  if (USE_OFFICIAL) {
    return <img src={inverted ? '/uqo-logo-white.svg' : '/uqo-logo.svg'} alt="UQO" className={cn('h-8', className)} />;
  }
  const fg = inverted ? '#FFFFFF' : '#00467F';
  return (
    <span className={cn('inline-flex items-center gap-2', className)} aria-label="UQO-Chat">
      <svg width="30" height="30" viewBox="0 0 32 32" aria-hidden="true">
        <rect x="1" y="1" width="30" height="30" rx="8" fill={inverted ? 'rgba(255,255,255,.14)' : '#00467F'} />
        <path d="M8 24V13l8-6 8 6v11h-5v-6h-6v6H8z" fill={inverted ? '#FFFFFF' : '#FFFFFF'} />
        <rect x="21" y="8" width="3" height="4" rx=".6" fill="#78BE20" />
      </svg>
      {withText && (
        <span className="leading-none">
          <span className="block font-bold tracking-tight" style={{ color: fg, fontSize: 17 }}>UQO-Chat</span>
          <span className="block text-[10.5px] font-medium tracking-wide" style={{ color: inverted ? 'rgba(255,255,255,.8)' : '#5B6B7B' }}>
            Tuteur IA — IMM1003 · IMM1033
          </span>
        </span>
      )}
    </span>
  );
}