feat: premium UI overhaul, AI suggestions, WAHA WhatsApp integration

PREMIUM UI:
- All animations: fade-up, scale-in, stagger children, confetti celebration
- Glass effects, gradient icons, premium card hover states
- Custom CSS: shimmer, pulse-ring, bounce, counter-roll animations
- Smooth progress bar with gradient

AI-POWERED (GPT-4o-mini nano model):
- Smart amount suggestions based on peer data (/api/ai/suggest)
- Social proof: '42 people pledged · Average £85'
- AI-generated nudge text for conversion
- AI fuzzy matching for bank reconciliation
- AI reminder message generation

WAHA WHATSAPP INTEGRATION:
- Auto-send pledge receipt with bank details via WhatsApp
- 4-step reminder sequence: gentle → nudge → urgent → final
- Chatbot: donors reply PAID, HELP, CANCEL, STATUS
- Volunteer notification on new pledges
- WhatsApp status in dashboard settings
- Webhook endpoint for incoming messages

DONOR FLOW (CRO):
- Amount step: AI suggestions, Gift Aid preview, social proof, haptic feedback
- Payment step: trust signals, fee comparison, benefit badges
- Identity step: email/phone toggle, WhatsApp reminder indicator
- Bank instructions: tap-to-copy each field, WhatsApp delivery confirmation
- Confirmation: confetti, pulse animation, share CTA, WhatsApp receipt

COMPOSE:
- Added WAHA env vars + qc-comms network for WhatsApp access

pledge-now-pay-later/src/app/dashboard/settings/page.tsx

@@ -5,7 +5,8 @@ import { Card, CardContent, CardHeader, CardTitle, CardDescription } from "@/com
 import { Button } from "@/components/ui/button"
 import { Input } from "@/components/ui/input"
 import { Label } from "@/components/ui/label"
-import { Building2, CreditCard, Palette, Check, Loader2, AlertCircle } from "lucide-react"
+import { Building2, CreditCard, Palette, Check, Loader2, AlertCircle, MessageCircle, Radio } from "lucide-react"
+import { Badge } from "@/components/ui/badge"
 
 interface OrgSettings {
   name: string
@@ -210,6 +211,9 @@ export default function SettingsPage() {
         </CardContent>
       </Card>
 
+      {/* WhatsApp (WAHA) */}
+      <WhatsAppStatus />
+
       {/* Branding */}
       <Card>
         <CardHeader>
@@ -264,3 +268,60 @@ export default function SettingsPage() {
     </div>
   )
 }
+
+function WhatsAppStatus() {
+  const [status, setStatus] = useState<{ connected: boolean; session: string; version?: string } | null>(null)
+  const [checking, setChecking] = useState(true)
+
+  useEffect(() => {
+    fetch("/api/whatsapp/send")
+      .then(r => r.json())
+      .then(data => setStatus(data))
+      .catch(() => setStatus({ connected: false, session: "default" }))
+      .finally(() => setChecking(false))
+  }, [])
+
+  return (
+    <Card className={status?.connected ? "border-[#25D366]/30" : ""}>
+      <CardHeader>
+        <CardTitle className="text-lg flex items-center gap-2">
+          <MessageCircle className="h-5 w-5 text-[#25D366]" /> WhatsApp Integration
+          {checking ? (
+            <Loader2 className="h-4 w-4 animate-spin text-muted-foreground" />
+          ) : status?.connected ? (
+            <Badge variant="success" className="gap-1"><Radio className="h-3 w-3" /> Connected</Badge>
+          ) : (
+            <Badge variant="warning">Not Connected</Badge>
+          )}
+        </CardTitle>
+        <CardDescription>
+          Send pledge receipts, payment reminders, and bank details via WhatsApp.
+          Donors can reply PAID, HELP, or CANCEL.
+        </CardDescription>
+      </CardHeader>
+      <CardContent className="space-y-3">
+        {status?.connected ? (
+          <div className="rounded-xl bg-[#25D366]/5 border border-[#25D366]/20 p-4 space-y-2">
+            <p className="text-sm font-medium text-[#25D366]">✅ WhatsApp is active</p>
+            <p className="text-xs text-muted-foreground">
+              Session: {status.session} · WAHA {status.version || ""}
+            </p>
+            <div className="text-xs text-muted-foreground space-y-1 mt-2 pt-2 border-t border-[#25D366]/10">
+              <p><strong>Auto-sends:</strong> Pledge receipts with bank details</p>
+              <p><strong>Reminders:</strong> Gentle → Nudge → Urgent → Final</p>
+              <p><strong>Chatbot:</strong> Donors reply PAID, HELP, CANCEL, STATUS</p>
+            </div>
+          </div>
+        ) : (
+          <div className="rounded-xl bg-warm-amber/5 border border-warm-amber/20 p-4 space-y-2">
+            <p className="text-sm font-medium text-warm-amber">WhatsApp not connected</p>
+            <p className="text-xs text-muted-foreground">
+              Connect a WhatsApp number in WAHA ({`waha.quikcue.com`}) to enable automatic messaging.
+              The app works without it — messages will be skipped.
+            </p>
+          </div>
+        )}
+      </CardContent>
+    </Card>
+  )
+}