feat: improve email copy UX with colored alerts and mailto button

- Green success alert for copied confirmation
- Blue info alert with BCC privacy tip
- Mailto button opens email program with BCC recipients
- Alerts stack vertically instead of overlapping

lib/mv_web/live/member_live/index.ex

@@ -146,7 +146,7 @@ defmodule MvWeb.MemberLive.Index do
           socket
           |> push_event("copy_to_clipboard", %{text: email_string})
           |> put_flash(
-            :info,
+            :success,
             ngettext(
               "Copied %{count} email address to clipboard",
               "Copied %{count} email addresses to clipboard",
@@ -154,6 +154,10 @@ defmodule MvWeb.MemberLive.Index do
               count: email_count
             )
           )
+          |> put_flash(
+            :warning,
+            gettext("Tip: Paste email addresses into the BCC field for privacy compliance")
+          )
 
         {:noreply, socket}
       end

lib/mv_web/live/member_live/index.html.heex

@@ -12,6 +12,14 @@
         <.icon name="hero-clipboard-document" />
         {gettext("Copy emails")} ({Enum.count(@members, &(&1.id in @selected_members))})
       </.button>
+      <.button
+        :if={Enum.any?(@members, &(&1.id in @selected_members))}
+        href={"mailto:?bcc=#{@members |> Enum.filter(&(&1.id in @selected_members and &1.email)) |> Enum.map(& &1.email) |> Enum.join(",")}"}
+        aria-label={gettext("Open email program with BCC recipients")}
+      >
+        <.icon name="hero-envelope" />
+        {gettext("Open in email program")}
+      </.button>
       <.button variant="primary" navigate={~p"/members/new"}>
         <.icon name="hero-plus" /> {gettext("New Member")}
       </.button>