export const BRAND = {
  name: "Vectrum",
  domain: "vectrum.cc",
  tagline: "A calm home for your code",
};

/** The Vectrum mark: a circle and a "V" whose overlap is cut out. */
export function LogoMark({ size = 28, className = "" }: { size?: number; className?: string }) {
  return (
    <svg viewBox="0 0 32 32" width={size} height={size} className={`shrink-0 ${className}`} aria-hidden>
      <path
        fill="var(--fg)"
        fillRule="evenodd"
        d="M2 13a8.5 8.5 0 1 0 17 0a8.5 8.5 0 1 0-17 0ZM11.54 7.69Q10 4 14 4H26Q30 4 28.46 7.69L21.54 24.31Q20 28 18.46 24.31Z"
      />
    </svg>
  );
}

export function Logo({ size = 28, className = "" }: { size?: number; className?: string }) {
  return (
    <span className={`inline-flex items-center gap-2 ${className}`}>
      <LogoMark size={size} />
      <span className="text-[15px] font-semibold tracking-[-0.01em]">{BRAND.name}</span>
    </span>
  );
}