/* Captivair logo — black "CAPTIV" + red circle with white "AIR" knockout.
   Circle pushed right of the V so the full CAPTIV reads cleanly. */

const CaptivairLogo = ({ height = 40, mono = false, onDark = true }) => {
  // Wider viewBox so the AIR disc sits clear of the V
  const vbW = 440;
  const vbH = 141;
  const w = height * (vbW / vbH);
  const black = onDark ? '#fff' : '#0E0F12';
  const red = mono ? (onDark ? '#fff' : '#0E0F12') : '#C8102E';
  const tag = onDark ? '#9aa0a8' : '#4a4d54';

  return (
    <svg width={w} height={height} viewBox={`0 0 ${vbW} ${vbH}`} xmlns="http://www.w3.org/2000/svg" aria-label="Captivair Pneumatics">
      {/* CAPTIV wordmark */}
      <text x="0" y="78" fill={black} fontFamily="Inter, Arial Black, sans-serif"
            fontWeight="900" fontSize="76" letterSpacing="-2">CAPTIV</text>
      {/* Red AIR disc, sitting clear of the V */}
      <circle cx="338" cy="55" r="55" fill={red}/>
      <text x="289" y="78" fill="#fff" fontFamily="Inter, Arial Black, sans-serif"
            fontWeight="900" fontSize="56" letterSpacing="-1">AIR</text>
      {/* Tagline */}
      <text x="0" y="118" fill={tag} fontFamily="Inter, Arial, sans-serif"
            fontWeight="700" fontSize="22" letterSpacing="3">PNEUMATICS</text>
      <text x="0" y="138" fill={tag} fontFamily="Inter, Arial, sans-serif"
            fontWeight="500" fontSize="13" letterSpacing="1.5">&amp; ENGINEERING SUPPLIES</text>
    </svg>
  );
};

window.CaptivairLogo = CaptivairLogo;