function Logo1({ footer }) {
  const h = footer ? 52 : 44;
  return (
    <a href="#" className="logo" style={{ padding: 0, background: "none", border: "none" }}>
      <img src="common-articles/Logo Grow Satindica 1.png" height={h} alt="Grow Satindica" style={{ display: "block" }} />
    </a>
  );
}

function StarRating({ rating }) {
  const full = Math.round(parseFloat(rating));
  return (
    <span className="stars">
      {"★".repeat(full)}{"☆".repeat(5 - full)}
    </span>
  );
}

function BenefitIcon({ num }) {
  const icons = {
    "01": (
      <svg viewBox="0 0 40 40" fill="none" stroke="currentColor" strokeWidth="1.4">
        <path d="M4 26h28l4-10H8z"/>
        <circle cx="14" cy="32" r="3"/><circle cx="28" cy="32" r="3"/>
        <path d="M4 26V14h6"/>
      </svg>
    ),
    "02": (
      <svg viewBox="0 0 40 40" fill="none" stroke="currentColor" strokeWidth="1.4">
        <path d="M20 4 6 10v8c0 9 6 16 14 18 8-2 14-9 14-18v-8z"/>
        <path d="m14 20 4 4 8-8"/>
      </svg>
    ),
    "03": (
      <svg viewBox="0 0 40 40" fill="none" stroke="currentColor" strokeWidth="1.4">
        <path d="M34 24a4 4 0 0 1-4 4H14l-8 6V10a4 4 0 0 1 4-4h20a4 4 0 0 1 4 4z"/>
        <circle cx="14" cy="17" r="1.2" fill="currentColor"/>
        <circle cx="20" cy="17" r="1.2" fill="currentColor"/>
        <circle cx="26" cy="17" r="1.2" fill="currentColor"/>
      </svg>
    ),
    "04": (
      <svg viewBox="0 0 40 40" fill="none" stroke="currentColor" strokeWidth="1.4">
        <path d="M20 4c-4 6-8 10-8 16a8 8 0 0 0 16 0c0-6-4-10-8-16z"/>
        <path d="M20 22v14"/>
      </svg>
    ),
  };
  return <span className="ico">{icons[num]}</span>;
}

Object.assign(window, { Logo1, StarRating, BenefitIcon });
