/* global React */
/* eslint-disable */
function LangSwitcher() {
  const lang = window.getLang ? window.getLang() : 'es';
  const wrap = { display:'flex', gap:3, alignItems:'center' };
  const base = {
    border:'1px solid var(--border,#e2e8f0)',
    borderRadius:5,
    background:'transparent',
    color:'var(--text-mute,#94a3b8)',
    cursor:'pointer',
    fontSize:11,
    fontWeight:700,
    padding:'3px 8px',
    letterSpacing:'.05em',
    lineHeight:1,
    transition:'all .12s',
    fontFamily:'inherit',
  };
  const active = {
    background:'var(--accent,#6c5ce7)',
    color:'#fff',
    border:'1px solid transparent',
  };
  return (
    <div style={wrap}>
      {['ES','FR','EN'].map(l => (
        <button
          key={l}
          style={lang === l.toLowerCase() ? {...base, ...active} : base}
          onClick={() => window.setLang && window.setLang(l.toLowerCase())}
        >{l}</button>
      ))}
    </div>
  );
}
window.LangSwitcher = LangSwitcher;