// Full wordmark: the product mark (envelope-in-speech-bubble) plus the
// product name. Inherits currentColor so it follows the surrounding text.
const Logo = () => {
	return (
		<svg
			width="160"
			height="28"
			viewBox="0 0 160 28"
			fill="none"
			xmlns="http://www.w3.org/2000/svg"
			className="rbfb-logo"
			aria-hidden="true"
			focusable="false"
		>
			<g transform="scale(1.4)">
				<path
					fill="currentColor"
					d="M2 4.5A1.5 1.5 0 0 1 3.5 3h13A1.5 1.5 0 0 1 18 4.5v8a1.5 1.5 0 0 1-1.5 1.5h-6.09l-3.7 2.96A.6.6 0 0 1 5.75 16.5V14H3.5A1.5 1.5 0 0 1 2 12.5v-8Zm2.1.9a.6.6 0 0 0-.35 1.09l5.9 3.93a.6.6 0 0 0 .7 0l5.9-3.93a.6.6 0 0 0-.35-1.09H4.1Zm11.9 2.72-5.23 3.48a1.8 1.8 0 0 1-2.04 0L4 8.12v4.13c0 .14.11.25.25.25h11.5a.25.25 0 0 0 .25-.25V8.12Z"
				/>
			</g>
			<text
				x="32"
				y="19"
				fill="currentColor"
				fontFamily="inherit"
				fontSize="15"
				fontWeight="600"
			>
				Brevo Bridge
			</text>
		</svg>
	);
};

export default Logo;
