import autonomyLogo from '../assets/icon.png';

export function BrandMark({ dark = false }: { dark?: boolean }) {
  return (
    <div className={`flex items-center gap-3 ${dark ? 'text-[#111827]' : 'text-white'}`}>
      <span className="grid h-8 w-8 place-items-center overflow-hidden rounded-lg bg-white ring-1 ring-white/25">
        <img className="h-7 w-7 object-contain" src={autonomyLogo} alt="" />
      </span>
      <span className="text-[24px] font-black tracking-[0] sm:text-[24px]">
        Autonomy <span className={dark ? 'text-[#4f46e5]' : 'text-[#67e8f9]'}>Studio</span>
      </span>
    </div>
  );
}