Add back-in-stock notification signup form

NotifyMeForm.tsx replaces the disabled Add-to-cart button's spot once
a product/variant is out of stock — POSTs to the new
/api/stock-notifications route, which forwards to the backend's new
stock-notifications collection. Threaded product.numericId (not the
commerce slug id) into AddToCartButton/AddToCartInlineButton for this,
same split WishlistButton already uses.

Co-Authored-By: Claude Sonnet 5 <noreply@anthropic.com>

app/components/AddToCartButton.tsx

@@ -3,6 +3,7 @@
 import { useEffect, useRef, useState } from "react";
 import { addToCart, useCart } from "../lib/cart";
 import { useCartFly } from "./CartFly";
+import { NotifyMeForm } from "./NotifyMeForm";
 
 const FEEDBACK_MS = 2000;
 
@@ -17,6 +18,7 @@ export function AddToCartButton({
   label,
   className,
   productId = "todo-karten",
+  numericId,
   outOfStock = false,
   maxQty = null,
   variants = [],
@@ -27,6 +29,10 @@ export function AddToCartButton({
    * ProductSpotlight passes the actual CMS-selected spotlight product's id
    * explicitly, since that can now be a different product. */
   productId?: string;
+  /** Payload's real numeric product id (`product.numericId`) — only used to
+   * scope a NotifyMeForm signup once out of stock, never for the cart/
+   * checkout path itself (that stays on the slug `productId` above). */
+  numericId: number;
   /** Product-level — only meaningful when `variants` is empty, same split as
    * AddToCartInlineButton. */
   outOfStock?: boolean;
@@ -151,6 +157,7 @@ export function AddToCartButton({
           <span className="[grid-area:1/1]">{added ? "Hinzugefügt ✓" : displayLabel}</span>
         </span>
       </button>
+      {currentlyOutOfStock && <NotifyMeForm productId={numericId} variantName={variants.length > 0 ? (selectedVariant ?? "") : ""} />}
     </div>
   );
 }