// Shared WhatsApp icon
function WAIcon({ size = 16, color = "currentColor" }) {
  return (
    <svg width={size} height={size} viewBox="0 0 24 24" fill={color} aria-hidden="true">
      <path d="M17.47 14.38c-.3-.15-1.77-.87-2.04-.97-.27-.1-.47-.15-.67.15-.2.3-.77.97-.94 1.17-.17.2-.35.22-.65.07-.3-.15-1.26-.46-2.4-1.48-.89-.79-1.48-1.77-1.66-2.07-.17-.3-.02-.46.13-.61.13-.13.3-.35.45-.52.15-.17.2-.3.3-.5.1-.2.05-.37-.02-.52-.07-.15-.67-1.62-.92-2.22-.24-.58-.49-.5-.67-.51l-.57-.01c-.2 0-.52.07-.79.37-.27.3-1.04 1.02-1.04 2.49s1.06 2.89 1.21 3.09c.15.2 2.1 3.2 5.08 4.49.71.31 1.26.49 1.69.63.71.22 1.36.19 1.87.12.57-.09 1.77-.72 2.02-1.42.25-.7.25-1.3.17-1.42-.07-.13-.27-.2-.57-.35zM12.04 21.5h-.01a9.46 9.46 0 0 1-4.82-1.32l-.35-.2-3.59.94.96-3.5-.22-.36a9.44 9.44 0 0 1-1.45-5.04c0-5.22 4.25-9.47 9.48-9.47 2.53 0 4.91.99 6.7 2.78a9.42 9.42 0 0 1 2.78 6.7c0 5.22-4.26 9.47-9.48 9.47zm8.06-17.53A11.36 11.36 0 0 0 12.04 0C5.64 0 .43 5.2.43 11.6c0 2.04.54 4.04 1.56 5.8L.34 24l6.75-1.77a11.6 11.6 0 0 0 5.55 1.42h.01c6.4 0 11.61-5.2 11.61-11.6 0-3.1-1.21-6.02-3.4-8.21z"/>
    </svg>
  );
}
window.WAIcon = WAIcon;

function PreHeader() {
  return (
    <div style={{
      background: "var(--ink)",
      color: "var(--cream)",
      fontSize: 11,
      letterSpacing: ".08em",
    }}>
      <div style={{
        maxWidth: 1280, margin: "0 auto",
        padding: "10px 20px",
        display: "flex", alignItems: "center", justifyContent: "space-between",
        gap: 12, flexWrap: "wrap",
      }}>
        <a href="https://wa.me/493055550184" target="_blank" rel="noreferrer" style={{
          display: "inline-flex", alignItems: "center", gap: 8,
          color: "var(--cream)",
        }}>
          <WAIcon size={14} color="var(--rose)" />
          <span style={{ letterSpacing: ".14em", textTransform: "uppercase" }}>WhatsApp</span>
        </a>
        <div style={{
          display: "inline-flex", alignItems: "center", gap: 10,
          color: "rgba(244,234,220,.8)",
          fontSize: 11,
        }}>
          <span>Kantstraße 112</span>
          <span style={{ opacity: .4 }}>·</span>
          <span>Berlin</span>
        </div>
      </div>
    </div>
  );
}
window.PreHeader = PreHeader;
