// Stamp icon library — each is a pure SVG with two render modes:
//  - "flat"     : clean monochrome fill
//  - "textured" : rubber-stamp style (slight rotation, ink noise, imperfect edges)
// All icons render into a 100x100 viewBox. Pass color + filled state.

const _stampPaths = {
  tapioca: (
    // Folded half-circle tapioca with a brush-stroke fill
    <g>
      <path d="M 20 62 Q 50 18 80 62 Q 65 72 50 72 Q 35 72 20 62 Z" fill="currentColor"/>
      <path d="M 30 60 Q 50 40 70 60" stroke="currentColor" strokeOpacity="0.35" strokeWidth="2" fill="none" strokeLinecap="round"/>
      <circle cx="42" cy="54" r="2" fill="currentColor" fillOpacity="0.4"/>
      <circle cx="58" cy="50" r="1.5" fill="currentColor" fillOpacity="0.4"/>
      <circle cx="52" cy="58" r="1.5" fill="currentColor" fillOpacity="0.4"/>
    </g>
  ),
  bread: (
    <g>
      <path d="M 22 55 Q 28 32 50 32 Q 72 32 78 55 Q 78 70 50 70 Q 22 70 22 55 Z" fill="currentColor"/>
      <path d="M 34 42 L 40 62 M 46 38 L 50 66 M 58 40 L 56 64 M 66 44 L 62 62" stroke="white" strokeOpacity="0.35" strokeWidth="2" strokeLinecap="round"/>
    </g>
  ),
  coffee: (
    <g>
      <path d="M 25 35 L 70 35 L 66 72 Q 66 78 60 78 L 35 78 Q 29 78 29 72 Z" fill="currentColor"/>
      <path d="M 70 42 Q 82 42 82 52 Q 82 62 70 62" stroke="currentColor" strokeWidth="5" fill="none" strokeLinecap="round"/>
      <path d="M 40 20 Q 42 26 40 30 M 50 18 Q 52 24 50 28 M 60 20 Q 62 26 60 30" stroke="currentColor" strokeWidth="3" fill="none" strokeLinecap="round" opacity="0.55"/>
    </g>
  ),
  nail: (
    // Nail polish bottle
    <g>
      <rect x="38" y="48" width="24" height="28" rx="3" fill="currentColor"/>
      <rect x="42" y="32" width="16" height="14" fill="currentColor"/>
      <rect x="44" y="22" width="12" height="12" rx="2" fill="currentColor"/>
      <circle cx="50" cy="62" r="4" fill="white" fillOpacity="0.3"/>
    </g>
  ),
  scissors: (
    <g>
      <circle cx="32" cy="68" r="10" fill="none" stroke="currentColor" strokeWidth="5"/>
      <circle cx="68" cy="68" r="10" fill="none" stroke="currentColor" strokeWidth="5"/>
      <path d="M 38 60 L 72 24 M 62 60 L 28 24" stroke="currentColor" strokeWidth="5" strokeLinecap="round"/>
      <circle cx="50" cy="48" r="3" fill="currentColor"/>
    </g>
  ),
  acai: (
    <g>
      <path d="M 20 45 Q 20 38 28 38 L 72 38 Q 80 38 80 45 L 74 70 Q 72 78 64 78 L 36 78 Q 28 78 26 70 Z" fill="currentColor"/>
      <circle cx="38" cy="46" r="3.5" fill="white" fillOpacity="0.4"/>
      <circle cx="50" cy="44" r="3.5" fill="white" fillOpacity="0.4"/>
      <circle cx="62" cy="46" r="3.5" fill="white" fillOpacity="0.4"/>
      <circle cx="44" cy="52" r="3" fill="white" fillOpacity="0.35"/>
      <circle cx="56" cy="52" r="3" fill="white" fillOpacity="0.35"/>
    </g>
  ),
  star: (
    <g>
      <path d="M 50 18 L 59 40 L 82 42 L 64 57 L 70 80 L 50 67 L 30 80 L 36 57 L 18 42 L 41 40 Z" fill="currentColor"/>
    </g>
  ),
  heart: (
    <g>
      <path d="M 50 78 C 20 58 18 38 32 28 C 44 20 50 32 50 32 C 50 32 56 20 68 28 C 82 38 80 58 50 78 Z" fill="currentColor"/>
    </g>
  ),
  pizza: (
    <g>
      <path d="M 50 18 L 82 74 Q 50 86 18 74 Z" fill="currentColor"/>
      <circle cx="42" cy="48" r="4" fill="white" fillOpacity="0.45"/>
      <circle cx="58" cy="54" r="4" fill="white" fillOpacity="0.45"/>
      <circle cx="50" cy="66" r="3.5" fill="white" fillOpacity="0.45"/>
    </g>
  ),
  meal: (
    // Plate with fork on the left and knife on the right (outside the plate)
    <g>
      <ellipse cx="50" cy="70" rx="28" ry="5" fill="currentColor" fillOpacity="0.25"/>
      <circle cx="50" cy="56" r="20" fill="currentColor"/>
      <circle cx="50" cy="56" r="13" fill="currentColor" fillOpacity="0.0" stroke="white" strokeOpacity="0.25" strokeWidth="2"/>
      {/* Fork — outside left */}
      <line x1="14" y1="18" x2="14" y2="34" stroke="currentColor" strokeWidth="2.5" strokeLinecap="round"/>
      <line x1="20" y1="18" x2="20" y2="34" stroke="currentColor" strokeWidth="2.5" strokeLinecap="round"/>
      <line x1="26" y1="18" x2="26" y2="34" stroke="currentColor" strokeWidth="2.5" strokeLinecap="round"/>
      <rect x="12" y="32" width="16" height="5" rx="1" fill="currentColor"/>
      <line x1="20" y1="37" x2="20" y2="86" stroke="currentColor" strokeWidth="4" strokeLinecap="round"/>
      {/* Knife — outside right */}
      <path d="M 76 16 Q 76 44 80 50 Q 84 44 84 16 Z" fill="currentColor"/>
      <line x1="80" y1="50" x2="80" y2="86" stroke="currentColor" strokeWidth="4" strokeLinecap="round"/>
    </g>
  ),
  house: (
    // Simple line-drawn house: pitched roof, square body, sill line, X at peak
    <g fill="none" stroke="currentColor" strokeWidth="5" strokeLinecap="round" strokeLinejoin="round">
      <path d="M 12 54 L 50 16 L 88 54"/>
      <path d="M 22 46 L 22 88 L 78 88 L 78 46"/>
      <line x1="28" y1="80" x2="64" y2="80" strokeWidth="3"/>
      <path d="M 46 12 L 54 22 M 54 12 L 46 22" strokeWidth="3"/>
    </g>
  ),
  fish: (
    <g>
      <path d="M 76 50 Q 60 28 28 38 Q 20 42 18 50 Q 20 58 28 62 Q 60 72 76 50 Z" fill="currentColor"/>
      <path d="M 76 50 L 92 36 L 88 50 L 92 64 Z" fill="currentColor"/>
      <circle cx="34" cy="48" r="3.5" fill="white" fillOpacity="0.55"/>
      <line x1="44" y1="40" x2="44" y2="60" stroke="white" strokeOpacity="0.2" strokeWidth="1.5" strokeLinecap="round"/>
      <line x1="54" y1="36" x2="54" y2="64" stroke="white" strokeOpacity="0.2" strokeWidth="1.5" strokeLinecap="round"/>
      <line x1="64" y1="38" x2="64" y2="62" stroke="white" strokeOpacity="0.2" strokeWidth="1.5" strokeLinecap="round"/>
    </g>
  ),
  paw: (
    // Animal paw: central pad + 4 toe beans
    <g>
      <ellipse cx="50" cy="68" rx="20" ry="16" fill="currentColor"/>
      <ellipse cx="24" cy="44" rx="7" ry="10" fill="currentColor"/>
      <ellipse cx="40" cy="30" rx="7" ry="11" fill="currentColor"/>
      <ellipse cx="60" cy="30" rx="7" ry="11" fill="currentColor"/>
      <ellipse cx="76" cy="44" rx="7" ry="10" fill="currentColor"/>
    </g>
  ),
  wine_glass: (
    // Stemmed wine glass
    <g>
      <path d="M 28 16 Q 28 50 50 56 Q 72 50 72 16 Z" fill="currentColor"/>
      <rect x="48" y="56" width="4" height="22" fill="currentColor"/>
      <rect x="30" y="80" width="40" height="4" rx="2" fill="currentColor"/>
      <path d="M 34 22 Q 34 42 50 48" stroke="white" strokeOpacity="0.35" strokeWidth="2" fill="none" strokeLinecap="round"/>
    </g>
  ),
  wine_bottle: (
    // Tall wine bottle with label
    <g>
      <rect x="42" y="8" width="16" height="6" rx="1" fill="currentColor"/>
      <rect x="44" y="14" width="12" height="18" fill="currentColor"/>
      <path d="M 44 32 Q 36 38 36 50 L 36 86 Q 36 90 40 90 L 60 90 Q 64 90 64 86 L 64 50 Q 64 38 56 32 Z" fill="currentColor"/>
      <rect x="40" y="56" width="20" height="20" fill="white" fillOpacity="0.3"/>
    </g>
  ),
  pasta: (
    // Pasta twirled around a fork
    <g>
      <ellipse cx="50" cy="78" rx="30" ry="5" fill="currentColor" fillOpacity="0.25"/>
      <ellipse cx="50" cy="46" rx="32" ry="14" fill="currentColor"/>
      <path d="M 22 40 Q 36 36 50 40 M 24 46 Q 42 42 60 48 M 28 52 Q 46 48 70 50" fill="none" stroke="white" strokeOpacity="0.35" strokeWidth="1.5" strokeLinecap="round"/>
      {/* Fork tines peeking above the pasta */}
      <line x1="40" y1="20" x2="40" y2="36" stroke="currentColor" strokeWidth="3" strokeLinecap="round"/>
      <line x1="50" y1="18" x2="50" y2="36" stroke="currentColor" strokeWidth="3" strokeLinecap="round"/>
      <line x1="60" y1="20" x2="60" y2="36" stroke="currentColor" strokeWidth="3" strokeLinecap="round"/>
      {/* Fork handle below the pasta */}
      <rect x="46" y="58" width="8" height="22" rx="2" fill="currentColor"/>
    </g>
  ),
  beer_bottle: (
    // Stout beer bottle with label
    <g>
      <rect x="42" y="10" width="16" height="6" rx="1" fill="currentColor"/>
      <rect x="44" y="16" width="12" height="16" fill="currentColor"/>
      <path d="M 44 32 Q 34 38 34 50 L 34 84 Q 34 90 40 90 L 60 90 Q 66 90 66 84 L 66 50 Q 66 38 56 32 Z" fill="currentColor"/>
      <rect x="38" y="54" width="24" height="22" fill="white" fillOpacity="0.3"/>
    </g>
  ),
  beer_glass: (
    // Beer mug with foam head and handle
    <g>
      <path d="M 26 32 L 32 86 Q 32 88 34 88 L 60 88 Q 62 88 62 86 L 68 32 Z" fill="currentColor"/>
      <path d="M 68 42 Q 84 42 84 60 Q 84 78 68 78" stroke="currentColor" strokeWidth="5" fill="none" strokeLinecap="round"/>
      <circle cx="34" cy="26" r="6" fill="currentColor"/>
      <circle cx="44" cy="22" r="7" fill="currentColor"/>
      <circle cx="56" cy="22" r="7" fill="currentColor"/>
      <circle cx="66" cy="26" r="6" fill="currentColor"/>
      <rect x="27" y="28" width="40" height="6" fill="currentColor"/>
      <path d="M 38 46 L 42 80 M 48 44 L 50 80 M 58 46 L 56 78" stroke="white" strokeOpacity="0.3" strokeWidth="1.5" strokeLinecap="round" fill="none"/>
    </g>
  ),
  shirt: (
    // T-shirt for laundry
    <g>
      <path d="M 38 18 L 22 28 L 14 42 L 26 52 L 32 46 L 32 84 Q 32 86 34 86 L 66 86 Q 68 86 68 84 L 68 46 L 74 52 L 86 42 L 78 28 L 62 18 Q 58 30 50 30 Q 42 30 38 18 Z" fill="currentColor"/>
      <path d="M 38 18 Q 50 28 62 18" fill="none" stroke="white" strokeOpacity="0.35" strokeWidth="1.5"/>
    </g>
  ),
  ladybird: (
    // Symmetric ladybird tilted -15° as a group. Colors are baked in
    // (red body, black head/wedge/spots/antennae) — does NOT follow the
    // business primary color the way other icons do. Per-wing spot
    // constellations rotated 15° toward the head so they read as "wings
    // tucked back".
    <g transform="rotate(-15 50 55)">
      <path d="M 44 16 Q 36 6 30 4" fill="none" stroke="#1a1a1a" strokeWidth="2.4" strokeLinecap="round"/>
      <path d="M 56 16 Q 64 6 70 4" fill="none" stroke="#1a1a1a" strokeWidth="2.4" strokeLinecap="round"/>
      <circle cx="30" cy="4" r="2.6" fill="#1a1a1a"/>
      <circle cx="70" cy="4" r="2.6" fill="#1a1a1a"/>
      <ellipse cx="50" cy="22" rx="18" ry="12" fill="#1a1a1a"/>
      <circle cx="50" cy="58" r="30" fill="#D32F2F"/>
      <path d="M 50 30 L 40 86 L 60 86 Z" fill="#1a1a1a"/>
      <g transform="rotate(15 32 62)">
        <circle cx="32" cy="48" r="4" fill="#1a1a1a"/>
        <circle cx="28" cy="64" r="4" fill="#1a1a1a"/>
        <circle cx="38" cy="76" r="3.5" fill="#1a1a1a"/>
      </g>
      <g transform="rotate(-15 68 62)">
        <circle cx="68" cy="48" r="4" fill="#1a1a1a"/>
        <circle cx="72" cy="64" r="4" fill="#1a1a1a"/>
        <circle cx="62" cy="76" r="3.5" fill="#1a1a1a"/>
      </g>
    </g>
  ),
  mate: (
    // Classic transparent plastic cup (Rio beach mate) with scalloped foam
    // crown sitting on the rim. Body uses currentColor.
    <g>
      <path d="M 30 22 L 70 22 L 66 86 Q 66 88 64 88 L 36 88 Q 34 88 34 86 Z" fill="currentColor"/>
      <ellipse cx="50" cy="22" rx="20" ry="3" fill="currentColor" fillOpacity="0.55"/>
      <path d="M 28 22 Q 32 14 38 18 Q 44 12 50 18 Q 56 12 62 18 Q 68 14 72 22 Q 68 26 50 26 Q 32 26 28 22 Z" fill="white" stroke="currentColor" strokeOpacity="0.55" strokeWidth="1.5" strokeLinejoin="round"/>
      <path d="M 40 30 L 40 80" stroke="white" strokeOpacity="0.3" strokeWidth="2" strokeLinecap="round"/>
    </g>
  ),
  wrap: (
    // Tilted paper-wrapped wrap, cut end exposed showing the filling.
    // Single interior diagonal line near the back hints at the paper fold.
    <g transform="rotate(-28 50 50)">
      {/* depth shadow */}
      <g transform="translate(-5 5)" opacity="0.5">
        <path d="M 22 40 L 78 40 L 86 50 L 78 60 L 22 60 Q 12 60 12 50 Q 12 40 22 40 Z" fill="currentColor"/>
      </g>
      {/* main wrap body, smooth rounded back */}
      <path d="M 22 40 L 78 40 L 86 50 L 78 60 L 22 60 Q 12 60 12 50 Q 12 40 22 40 Z" fill="currentColor"/>
      {/* single diagonal interior fold line near the back */}
      <path d="M 16 44 L 28 56" stroke="white" strokeOpacity="0.45" strokeWidth="1.6" strokeLinecap="round"/>
      {/* cross-section filling */}
      <path d="M 78 40 L 86 50 L 78 60 Z" fill="white" fillOpacity="0.7"/>
      <circle cx="80" cy="46" r="1.6" fill="currentColor"/>
      <circle cx="82" cy="50" r="1.6" fill="currentColor"/>
      <circle cx="80" cy="54" r="1.6" fill="currentColor"/>
      {/* fold lines along the wrap */}
      <path d="M 40 41 Q 42 50 40 59 M 54 41 Q 56 50 54 59 M 68 41 Q 70 50 68 59" stroke="white" strokeOpacity="0.28" strokeWidth="1.4" fill="none" strokeLinecap="round"/>
    </g>
  ),
};

const STAMP_LIBRARY = [
  { key: 'tapioca', label: 'Tapioca' },
  { key: 'bread', label: 'Pão' },
  { key: 'coffee', label: 'Café' },
  { key: 'acai', label: 'Açaí' },
  { key: 'nail', label: 'Esmalte' },
  { key: 'scissors', label: 'Tesoura' },
  { key: 'pizza', label: 'Pizza' },
  { key: 'meal', label: 'Prato' },
  { key: 'house', label: 'Casa' },
  { key: 'fish', label: 'Peixe' },
  { key: 'paw', label: 'Patinha' },
  { key: 'wine_glass', label: 'Taça' },
  { key: 'wine_bottle', label: 'Vinho' },
  { key: 'pasta', label: 'Macarrão' },
  { key: 'wrap', label: 'Wrap' },
  { key: 'beer_bottle', label: 'Cerveja' },
  { key: 'beer_glass', label: 'Chope' },
  { key: 'mate', label: 'Mate' },
  { key: 'shirt', label: 'Camisa' },
  { key: 'ladybird', label: 'Joaninha' },
  { key: 'heart', label: 'Coração' },
  { key: 'star', label: 'Estrela' },
];

function StampIcon({ icon = 'tapioca', filled = false, style = 'textured', color = '#B5442A', size = 64, seed = 0 }) {
  const path = _stampPaths[icon] || _stampPaths.star;
  const rotation = filled ? ((seed * 37) % 11) - 5 : 0; // -5..+5 deg when stamped

  if (!filled) {
    // Empty: outline ghost
    return (
      <svg width={size} height={size} viewBox="0 0 100 100" style={{ color: 'currentColor', opacity: 0.35 }}>
        <g style={{ color: 'currentColor' }}>
          <g opacity="0.5">{path}</g>
        </g>
      </svg>
    );
  }

  if (style === 'flat') {
    return (
      <svg width={size} height={size} viewBox="0 0 100 100" style={{ color }}>
        {path}
      </svg>
    );
  }

  // Textured rubber-stamp style
  const filterId = `inkNoise-${icon}-${seed}`;
  return (
    <svg width={size} height={size} viewBox="0 0 100 100" style={{ color, transform: `rotate(${rotation}deg)` }}>
      <defs>
        <filter id={filterId} x="-20%" y="-20%" width="140%" height="140%">
          <feTurbulence type="fractalNoise" baseFrequency="0.9" numOctaves="2" seed={seed}/>
          <feDisplacementMap in="SourceGraphic" scale="2.5"/>
          <feComposite in2="SourceGraphic" operator="in"/>
        </filter>
        <filter id={`${filterId}-splat`} x="-20%" y="-20%" width="140%" height="140%">
          <feTurbulence type="fractalNoise" baseFrequency="2.5" numOctaves="3" seed={seed + 10}/>
          <feColorMatrix values="0 0 0 0 0  0 0 0 0 0  0 0 0 0 0  0 0 0 3 -1"/>
          <feComposite in2="SourceGraphic" operator="in"/>
        </filter>
      </defs>
      <g filter={`url(#${filterId})`}>{path}</g>
      {/* ink scratches */}
      <g opacity="0.25" filter={`url(#${filterId}-splat)`}>{path}</g>
    </svg>
  );
}

// A playful "stamped just now" splat pulse
function StampSplash({ color = '#B5442A', size = 80 }) {
  return (
    <svg width={size} height={size} viewBox="0 0 100 100" style={{ pointerEvents: 'none' }}>
      <g fill={color} opacity="0.7">
        <circle cx="50" cy="50" r="8"/>
        <circle cx="22" cy="30" r="3"/>
        <circle cx="75" cy="25" r="4"/>
        <circle cx="80" cy="70" r="3"/>
        <circle cx="18" cy="72" r="3.5"/>
        <circle cx="50" cy="18" r="2.5"/>
        <circle cx="88" cy="50" r="2"/>
      </g>
    </svg>
  );
}

Object.assign(window, { StampIcon, StampSplash, STAMP_LIBRARY });
