// Shared Plarrot brand primitives — logo, colors, tokens
// Exported on window for consumption by direction-a.jsx and direction-b.jsx.

const PLARROT = {
  // Core palette — from the provided brand system
  rust: '#C2410C',        // primary accent (burnt orange)
  rustDeep: '#9A2E07',
  rustBright: '#E85A1C',
  cream: '#F5EFE6',       // warm off-white
  creamDim: '#EAE2D4',
  ink: '#1A1412',         // warm near-black
  inkSoft: '#2A211C',
  inkMute: 'rgba(26,20,18,0.58)',
  inkFaint: 'rgba(26,20,18,0.18)',
  line: 'rgba(26,20,18,0.1)',
};

function PlarrotLogo({ size = 28 }) {
  return (
    <img
      src="images/logo.svg"
      height={size}
      alt="Plarrot"
      style={{ display: 'block', flexShrink: 0, width: 'auto' }}
    />
  );
}

// Decorative quarter-circle tile pattern (matches Frame 7/8 in the brand).
// Renders as an inline SVG that tiles. Used as a background motif.
function PlarrotPattern({ size = 80, fg = PLARROT.rust, bg = PLARROT.cream, opacity = 1 }) {
  const id = 'pat-' + Math.random().toString(36).slice(2, 8);
  return (
    <svg width="100%" height="100%" style={{ position: 'absolute', inset: 0, opacity }}>
      <defs>
        <pattern id={id} x="0" y="0" width={size} height={size} patternUnits="userSpaceOnUse">
          <rect width={size} height={size} fill={bg} />
          {/* Four quarter-circles — the signature geometric tile */}
          <path d={`M0 0 A ${size} ${size} 0 0 1 ${size} ${size} L 0 ${size} Z`} fill={fg} opacity="0.9" />
          <circle cx={size} cy="0" r={size * 0.42} fill={fg} opacity="0.55" />
        </pattern>
      </defs>
      <rect width="100%" height="100%" fill={`url(#${id})`} />
    </svg>
  );
}

// Multilingual word-stack — the brand's signature device.
// Same phrase in many languages, stacked, as a visual rhythm.
const MULTILINGUAL_STACK = [
  { lang: 'en',    text: 'Translate your website.' },
  { lang: 'fr',    text: 'Traduisez votre site web.' },
  { lang: 'de',    text: 'Übersetzen Sie Ihre Website.' },
  { lang: 'es',    text: 'Traduce tu sitio web.' },
  { lang: 'ja',    text: 'ウェブサイトを翻訳。' },
  { lang: 'ar',    text: 'ترجم موقعك الإلكتروني.', rtl: true },
  { lang: 'zh',    text: '翻译您的网站。' },
  { lang: 'ru',    text: 'Переведите ваш сайт.' },
  { lang: 'pt',    text: 'Traduza seu site.' },
  { lang: 'hi',    text: 'अपनी वेबसाइट का अनुवाद करें।' },
  { lang: 'ko',    text: '웹사이트를 번역하세요.' },
  { lang: 'it',    text: 'Traduci il tuo sito web.' },
];

Object.assign(window, { PLARROT, PlarrotLogo, PlarrotPattern, MULTILINGUAL_STACK });
