mongoDB ;1

import './Loyalty.css'

function Loyalty() {
  return (
    <div className="page">
      <h1>Loyalty Scheme</h1>
      <p className="subtitle">Complete 8 purchases and get free delivery!</p>

      <div className="loyalty-section">
        <h2>Your Rewards</h2>
        <div className="reward-card">
          <p>10% off all dairy products</p>
          <button>Activate</button>
        </div>
        <div className="reward-card">
          <p>15% off your next order</p>
          <button>Activate</button>
        </div>
      </div>

      <div className="loyalty-section">
        <h2>Stamp Card</h2>
        <div className="stamps">
          {Array.from({ length: 8 }).map((_, i) => (
            <div key={i} className="stamp">
              {i === 7 ? 'FREE' : i + 1}
            </div>
          ))}
        </div>
      </div>
    </div>
  )
}

export default Loyalty