// Brand logo renderer — uses real SVG marks for well-known brands, falls back to initials.
const BRAND_COLORS = {
"Stripe": ["#635BFF", "#A89FFF"],
"PayPal": ["#003087", "#009CDE"],
"Holded": ["#0061FF", "#60A5FA"],
"Odoo": ["#714B67", "#9F6B8F"],
"QuickBooks": ["#2CA01C", "#6FCF53"],
"Sage": ["#00D639", "#5EEF7F"],
"SAP": ["#0FAAFF", "#1B78D9"],
"Xero": ["#13B5EA", "#5FD3F4"],
"Shopify": ["#95BF47", "#5E8E3E"],
"WooCommerce": ["#7F54B3", "#A97FD1"],
"Amazon": ["#FF9900", "#232F3E"],
"Google Ads": ["#4285F4", "#EA4335"],
"Meta Ads": ["#1877F2", "#42A5F5"],
"TikTok Ads": ["#000000", "#FF0050"],
"TikTok": ["#000000", "#FF0050"],
"Mailchimp": ["#FFE01B", "#241C15"],
"HubSpot": ["#FF7A59", "#FFAA8D"],
"Salesforce": ["#00A1E0", "#5BC8EF"],
"POS": ["#0A1230", "#5B8CFF"],
"Slack": ["#611F69", "#E01E5A"],
"Notion": ["#000000", "#999999"],
"BBVA": ["#004481", "#1973B8"],
"Santander": ["#EC0000", "#FF4D4D"],
"CaixaBank": ["#007EAE", "#FFC72C"],
"Sabadell": ["#00A0DF", "#5BC8EF"],
"ING": ["#FF6200", "#FF9347"],
"Revolut": ["#0666EB", "#191C1F"],
"Zoho": ["#E42527", "#FDB813"]
};
// Inline SVG marks (simplified, trademark-safe geometric interpretations)
const BRAND_SVG = {
"Stripe": (s) => (
S
),
"Shopify": (s) => (
S
),
"Amazon": (s) => (
a.
),
"PayPal": (s) => (
P
),
"Meta Ads": (s) => (
),
"Google Ads": (s) => (
),
"Slack": (s) => (
),
"Notion": (s) => (
N
),
"HubSpot": (s) => (
H
),
"Salesforce": (s) => (
),
"BBVA": (s) => (
BBVA
),
"Santander": (s) => (
),
"CaixaBank": (s) => (
),
"ING": (s) => (
ING
),
"Revolut": (s) => (
R
),
"Sabadell": (s) => (
SBD
),
"WooCommerce": (s) => (
W
),
"Holded": (s) => (
h
),
"Odoo": (s) => (
odo
),
"SAP": (s) => (
SAP
),
"Xero": (s) => (
X
),
"QuickBooks": (s) => (
qb
),
"Zoho": (s) => (
Zoho
),
"TikTok": (s) => (
♪
),
"TikTok Ads": (s) => (
♪
),
};
const BrandLogo = ({ name, size = 28 }) => {
if (!name) return null;
if (BRAND_SVG[name]) return BRAND_SVG[name](size);
const colors = BRAND_COLORS[name] || ["#0A1230", "#5B8CFF"];
const initials = String(name).split(/[\s·]+/).filter(Boolean).map(w => w[0]).slice(0, 2).join("").toUpperCase();
return (
{initials}
);
};
window.BrandLogo = BrandLogo;