import { useState } from "react"
import Image from 'next/image'
export function LogoMark({ size }: { size: number }) {
    const [imgOk, setImgOk] = useState(true)

    return (
        <div
            className="relative flex-shrink-0 rounded-lg overflow-hidden"
            style={{ width: size, height: 200 }}
        >
            {imgOk ? (
                <Image
                    src="/logo.png"
                    alt="MEBS 4PL"
                    width={size}
                    height={size}
                    className="object-contain"
                    onError={() => setImgOk(false)}
                />
            ) : (
                <div
                    className="w-full h-full flex items-center justify-center bg-[#1A56DB] text-white font-bold rounded-lg"
                    style={{ fontSize: size * 0.42 }}
                >
                    M
                </div>
            )}
        </div>
    )
}