fix: WhatsApp banner → thin midnight strip + Collect quick-add appeal picker

WhatsApp notice:
- Was: Ugly amber warning box with margins, breaking layout flow
- Now: Thin edge-to-edge midnight strip below header, same design
  language as the header itself. Green WhatsApp icon, 'Set up →' link,
  subtle × dismiss. Zero layout disruption.

Collect quick-add:
- Was: 'New link' always added to events[0] with no choice
- Now: Multi-appeal orgs see appeal picker buttons. Single-appeal orgs
  see appeal name as subtle label. Quick-add panel has blue border
  treatment matching brand.
- Removed unused AlertTriangle import

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

@@ -113,7 +113,12 @@ export default function CollectPage() {
     }).catch(() => {}).finally(() => setLoading(false))
   }, [])
 
-  const activeEvent = events[0] // Most orgs have one appeal
+  // Quick-add: which appeal does the new link belong to?
+  // Single appeal → auto-select. Multiple → user picks.
+  const [quickAddEventId, setQuickAddEventId] = useState<string | null>(null)
+  const activeEvent = events.length === 1
+    ? events[0]
+    : events.find(e => e.id === quickAddEventId) || events[0]
 
   // ── Actions ──
   const copyLink = async (code: string) => {
@@ -584,24 +589,53 @@ export default function CollectPage() {
 
         {/* Quick add link inline */}
         {showQuickAdd && (
-          <div className="flex gap-2 items-end">
-            <div className="flex-1">
-              <label className="text-[10px] font-bold text-gray-500 block mb-1">
-                New link for &quot;{activeEvent?.name}&quot;
-              </label>
-              <input
-                value={quickLinkName} onChange={e => setQuickLinkName(e.target.value)}
-                placeholder="e.g. Table 5, Imam Yusuf, WhatsApp group"
-                autoFocus onKeyDown={e => e.key === "Enter" && handleQuickAdd()}
-                className="w-full h-10 px-3 border-2 border-gray-200 text-sm focus:border-[#1E40AF] outline-none"
-              />
+          <div className="border-2 border-[#1E40AF] bg-[#1E40AF]/[0.02] p-4 space-y-3">
+            <div className="flex items-center justify-between">
+              <p className="text-sm font-bold text-[#111827]">Create a new pledge link</p>
+              <button onClick={() => { setShowQuickAdd(false); setQuickLinkName(""); setQuickAddEventId(null) }}
+                className="text-xs text-gray-400 hover:text-gray-600">Cancel</button>
+            </div>
+
+            {/* Appeal picker — only shows when there are multiple appeals */}
+            {events.length > 1 && (
+              <div>
+                <label className="text-[10px] font-bold text-gray-500 block mb-1.5">Which appeal is this for?</label>
+                <div className="flex flex-wrap gap-2">
+                  {events.map(ev => (
+                    <button key={ev.id}
+                      onClick={() => setQuickAddEventId(ev.id)}
+                      className={`px-3 py-1.5 text-xs font-bold border-2 transition-colors ${
+                        activeEvent?.id === ev.id
+                          ? "border-[#1E40AF] bg-[#1E40AF]/5 text-[#1E40AF]"
+                          : "border-gray-200 text-gray-500 hover:border-gray-300"
+                      }`}>
+                      {ev.name}
+                    </button>
+                  ))}
+                </div>
+              </div>
+            )}
+
+            <div className="flex gap-2 items-end">
+              <div className="flex-1">
+                <label className="text-[10px] font-bold text-gray-500 block mb-1">
+                  Link name
+                  {events.length === 1 && activeEvent && (
+                    <span className="text-gray-400 font-normal"> · {activeEvent.name}</span>
+                  )}
+                </label>
+                <input
+                  value={quickLinkName} onChange={e => setQuickLinkName(e.target.value)}
+                  placeholder="e.g. Table 5, Imam Yusuf, WhatsApp group"
+                  autoFocus onKeyDown={e => e.key === "Enter" && handleQuickAdd()}
+                  className="w-full h-10 px-3 border-2 border-gray-200 text-sm focus:border-[#1E40AF] outline-none"
+                />
+              </div>
+              <button onClick={handleQuickAdd} disabled={quickCreating || !quickLinkName.trim()}
+                className="h-10 bg-[#1E40AF] px-4 text-xs font-bold text-white disabled:opacity-40">
+                {quickCreating ? <Loader2 className="h-3.5 w-3.5 animate-spin" /> : "Create"}
+              </button>
             </div>
-            <button onClick={handleQuickAdd} disabled={quickCreating || !quickLinkName.trim()}
-              className="h-10 bg-[#1E40AF] px-4 text-xs font-bold text-white disabled:opacity-40">
-              {quickCreating ? <Loader2 className="h-3.5 w-3.5 animate-spin" /> : "Create"}
-            </button>
-            <button onClick={() => { setShowQuickAdd(false); setQuickLinkName("") }}
-              className="h-10 px-3 text-xs text-gray-400 hover:text-gray-600">Cancel</button>
           </div>
         )}