refactor: drop toast + over-engineered extras, add inline admin feedback

Phase 1 cleanup of the personal-site revamp. Backend/architecture untouched;
changes are limited to removing unused complexity and restoring feedback.

Removals
- Toast system: delete react-hot-toast, Toaster, QueryToastBridge, lib/toast,
  the toggle/easter-egg calls, related i18n keys and the dependency.
- Contact protection: remove Turnstile + per-IP rate limiting
  (lib/contact-guard, lib/contact-protection, admin screen, form widget,
  app-config wiring, nav entry, test).
- Speculative specs: delete orders, products, downloads, project-inquiry.

Inline feedback (replaces toast, no new deps)
- Add lib/admin-feedback (withFlash/readFlash) and components/admin/admin-flash,
  rendered centrally by AdminDashboardShell.
- Emit success/error messages for media, site-settings, portfolio, smtp,
  marquee and maintenance actions; pages read them via searchParams.
- Contact form shows validation/delivery errors inline; success still
  redirects to /success.

Docs
- Fix stale paths in frontend-system-* (components/root -> components/admin,
  lib/root-navigation -> lib/admin-navigation, drop phantom src/) and remove
  contact-protection references from docs and CLAUDE.md.
- Add docs/PHASE0_DIAGNOSIS.md (diagnosis report).

Note: proxy.ts self-fetch kept intentionally; it also drives maintenance mode.

components/admin/admin-dashboard-shell.tsx

@@ -15,6 +15,7 @@ import {
 } from "lucide-react";
 import Link from "next/link";
 
+import { AdminFlash } from "@/components/admin/admin-flash";
 import { DashboardLayout } from "@/components/dashboard/dashboard-layout";
 import { MotionFade } from "@/components/motion-fade";
 import { SidebarMaintenanceControl } from "@/components/admin/sidebar-maintenance-control";
@@ -24,6 +25,7 @@ import { Button } from "@/components/ui/button";
 import { buildSiteUrl, getAdminAppPath } from "@/lib/admin-routing";
 import { getMaintenanceMode, getSiteSettingsMediaBindings } from "@/lib/app-config";
 import { getAdminNavigation } from "@/lib/admin-navigation";
+import type { FlashMessages } from "@/lib/admin-feedback";
 
 import { updateMaintenanceModeAction } from "@/app/_admin/maintenance/actions";
 
@@ -40,7 +42,6 @@ type AdminDashboardCopy = {
   localizationSettings?: string;
   marquee?: string;
   smtp?: string;
-  contactProtection?: string;
   logout: string;
   backToSite: string;
 };
@@ -48,9 +49,9 @@ type AdminDashboardCopy = {
 type AdminDashboardShellProps = {
   copy: AdminDashboardCopy;
   active: "overview" | "maintenance" | "ui-kit" | "portfolio" | "media" | "site-settings" | "smtp" | "marquee";
-  smtpChild?: "settings" | "contact-protection";
   portfolioChild?: "overview" | "projects" | "new-project" | "categories";
   siteSettingsChild?: "brand" | "localization";
+  flash?: FlashMessages;
   logoutAction: () => Promise<void>;
   headerTitle: string;
   headerDescription: string;
@@ -63,9 +64,9 @@ type AdminDashboardShellProps = {
 export async function AdminDashboardShell({
   copy,
   active,
-  smtpChild,
   portfolioChild,
   siteSettingsChild,
+  flash,
   logoutAction,
   headerTitle,
   headerDescription,
@@ -78,7 +79,7 @@ export async function AdminDashboardShell({
     getSiteSettingsMediaBindings(),
     getMaintenanceMode(),
   ]);
-  const sidebarItems = getAdminNavigation(copy, active, smtpChild, portfolioChild, siteSettingsChild);
+  const sidebarItems = getAdminNavigation(copy, active, portfolioChild, siteSettingsChild);
   const normalizedSidebarItems = sidebarItems.filter(
     (item) =>
       item.href !== getAdminAppPath("/maintenance") &&
@@ -155,18 +156,19 @@ export async function AdminDashboardShell({
           <SoundToggle
             ariaLabel="Mute sounds"
             mutedAriaLabel="Unmute sounds"
-            mutedToastLabel="Sound muted"
-            unmutedToastLabel="Sound enabled"
           />
           <ThemeToggle
             ariaLabel="Theme wechseln"
-            lightToastLabel="Light mode enabled"
-            darkToastLabel="Dark mode enabled"
           />
         </div>
       }
     >
       <div className="space-y-6">
+        {flash?.success || flash?.error ? (
+          <MotionFade delay={0.05}>
+            <AdminFlash success={flash.success} error={flash.error} />
+          </MotionFade>
+        ) : null}
         {toolbar ? <MotionFade delay={0.05}>{toolbar}</MotionFade> : null}
         {children}
       </div>

components/admin/admin-flash.tsx

@@ -0,0 +1,38 @@
+import type { FlashMessages } from "@/lib/admin-feedback";
+
+type AdminFlashProps = FlashMessages & {
+  className?: string;
+};
+
+/**
+ * Inline feedback banner for admin pages. Renders a success and/or error
+ * message inside the page (replacing the removed toast system). Purely
+ * presentational — no client state, no data access.
+ */
+export function AdminFlash({ success, error, className }: AdminFlashProps) {
+  if (!success && !error) {
+    return null;
+  }
+
+  return (
+    <div className={className ? `space-y-2 ${className}` : "space-y-2"}>
+      {success ? (
+        <p
+          role="status"
+          aria-live="polite"
+          className="rounded-nested border border-status-success/30 bg-status-success-soft px-4 py-3 text-sm font-medium text-status-success"
+        >
+          {success}
+        </p>
+      ) : null}
+      {error ? (
+        <p
+          role="alert"
+          className="rounded-nested border border-destructive/30 bg-destructive/10 px-4 py-3 text-sm font-medium text-destructive"
+        >
+          {error}
+        </p>
+      ) : null}
+    </div>
+  );
+}

components/admin/contact-protection-form.tsx

@@ -1,137 +0,0 @@
-"use client";
-
-import { useState } from "react";
-
-import { AppCard } from "@/components/ui/app-card";
-import { Button } from "@/components/ui/button";
-import { CardContent, CardDescription, CardHeader, CardTitle } from "@/components/ui/card";
-import { Checkbox } from "@/components/ui/checkbox";
-import { Input } from "@/components/ui/input";
-import { Label } from "@/components/ui/label";
-import type { ContactProtectionFormValues } from "@/lib/contact-protection";
-
-type ContactProtectionFormProps = {
-  action: (formData: FormData) => Promise<void>;
-  initialSettings: ContactProtectionFormValues;
-};
-
-export function ContactProtectionForm({
-  action,
-  initialSettings,
-}: ContactProtectionFormProps) {
-  const [turnstileEnabled, setTurnstileEnabled] = useState(initialSettings.turnstile.enabled);
-  const [rateLimitEnabled, setRateLimitEnabled] = useState(initialSettings.rateLimit.enabled);
-
-  return (
-    <form id="contact-protection-form" action={action} className="grid gap-6 xl:grid-cols-2">
-      <AppCard layer="single">
-        <CardHeader>
-          <CardTitle>Turnstile</CardTitle>
-          <CardDescription>Cloudflare Schutz fuer das Kontaktformular.</CardDescription>
-        </CardHeader>
-        <CardContent className="grid gap-5 p-4 md:grid-cols-2">
-          <div className="space-y-4 md:col-span-2">
-            <label
-              htmlFor="turnstileEnabled"
-              className="flex cursor-pointer items-start gap-3 rounded-nested border border-input bg-card px-4 py-4 transition-colors hover:bg-accent/20"
-            >
-              <Checkbox
-                id="turnstileEnabled"
-                name="turnstileEnabled"
-                checked={turnstileEnabled}
-                onCheckedChange={(checked) => setTurnstileEnabled(checked === true)}
-                className="mt-0.5"
-              />
-              <span className="space-y-1">
-                <span className="block text-sm font-medium text-foreground">Enable Turnstile</span>
-                <span className="block text-xs text-muted-foreground">
-                  {turnstileEnabled
-                    ? "ON: Besucher muessen die Pruefung bestehen."
-                    : "OFF: Kein Turnstile Schutz im Formular."}
-                </span>
-              </span>
-            </label>
-          </div>
-
-          <div className="space-y-2">
-            <Label htmlFor="turnstileSiteKey">Turnstile Site Key</Label>
-            <Input
-              id="turnstileSiteKey"
-              name="turnstileSiteKey"
-              defaultValue={initialSettings.turnstile.siteKey}
-              autoComplete="off"
-            />
-          </div>
-
-          <div className="space-y-2">
-            <Label htmlFor="turnstileSecretKey">Turnstile Secret Key</Label>
-            <Input
-              id="turnstileSecretKey"
-              name="turnstileSecretKey"
-              type="password"
-              defaultValue={initialSettings.turnstile.secretKey}
-              placeholder={initialSettings.turnstile.hasSecretKey ? "Saved secret key will be kept" : "Secret key"}
-              autoComplete="new-password"
-            />
-          </div>
-        </CardContent>
-      </AppCard>
-
-      <AppCard layer="single">
-        <CardHeader>
-          <CardTitle>Rate Limiting</CardTitle>
-          <CardDescription>Begrenzung wiederholter Kontaktanfragen.</CardDescription>
-        </CardHeader>
-        <CardContent className="grid gap-5 p-4 md:grid-cols-2">
-          <div className="space-y-4 md:col-span-2">
-            <label
-              htmlFor="contactRateLimitEnabled"
-              className="flex cursor-pointer items-start gap-3 rounded-nested border border-input bg-card px-4 py-4 transition-colors hover:bg-accent/20"
-            >
-              <Checkbox
-                id="contactRateLimitEnabled"
-                name="contactRateLimitEnabled"
-                checked={rateLimitEnabled}
-                onCheckedChange={(checked) => setRateLimitEnabled(checked === true)}
-                className="mt-0.5"
-              />
-              <span className="space-y-1">
-                <span className="block text-sm font-medium text-foreground">Enable rate limiting</span>
-                <span className="block text-xs text-muted-foreground">
-                  {rateLimitEnabled
-                    ? "ON: Das Formular blockiert zu viele Anfragen pro Zeitfenster."
-                    : "OFF: Keine serverseitige Begrenzung aktiv."}
-                </span>
-              </span>
-            </label>
-          </div>
-
-          <div className="space-y-2">
-            <Label htmlFor="contactRateLimitMaxRequests">Max Requests</Label>
-            <Input
-              id="contactRateLimitMaxRequests"
-              name="contactRateLimitMaxRequests"
-              type="number"
-              min="1"
-              defaultValue={initialSettings.rateLimit.maxRequests}
-            />
-          </div>
-
-          <div className="space-y-2">
-            <Label htmlFor="contactRateLimitWindowMinutes">Window Minutes</Label>
-            <Input
-              id="contactRateLimitWindowMinutes"
-              name="contactRateLimitWindowMinutes"
-              type="number"
-              min="1"
-              defaultValue={initialSettings.rateLimit.windowMinutes}
-            />
-          </div>
-        </CardContent>
-      </AppCard>
-      <div className="xl:col-span-2 flex justify-end">
-        <Button type="submit">Save Protection</Button>
-      </div>
-    </form>
-  );
-}

components/admin/query-toast-bridge.tsx

@@ -1,86 +0,0 @@
-"use client";
-
-import { useEffect, useRef } from "react";
-import { usePathname, useRouter, useSearchParams } from "next/navigation";
-
-import { toast } from "@/lib/toast";
-
-const TOAST_PARAM_NAMES = ["success", "error"] as const;
-const PENDING_TOAST_STORAGE_KEY = "mohfarawati-pending-toast";
-
-export function QueryToastBridge() {
-  const pathname = usePathname();
-  const router = useRouter();
-  const searchParams = useSearchParams();
-  const handledKeyRef = useRef<string | null>(null);
-
-  useEffect(() => {
-    const rawToast = window.sessionStorage.getItem(PENDING_TOAST_STORAGE_KEY);
-
-    if (!rawToast) {
-      return;
-    }
-
-    try {
-      const pendingToast = JSON.parse(rawToast) as {
-        message?: string;
-        type?: "success" | "error";
-      };
-      const localizedMessage = pendingToast.message;
-
-      if (!localizedMessage) {
-        return;
-      }
-
-      if (pendingToast.type === "error") {
-        toast.error(localizedMessage);
-      } else if (pendingToast.type === "success") {
-        toast.success(localizedMessage);
-      } else {
-        toast(localizedMessage);
-      }
-    } finally {
-      window.sessionStorage.removeItem(PENDING_TOAST_STORAGE_KEY);
-    }
-  }, [pathname]);
-
-  useEffect(() => {
-    const successMessage = searchParams.get("success");
-    const errorMessage = searchParams.get("error");
-
-    if (!successMessage && !errorMessage) {
-      handledKeyRef.current = null;
-      return;
-    }
-
-    const handledKey = `${pathname}:${successMessage ?? ""}:${errorMessage ?? ""}`;
-
-    if (handledKeyRef.current === handledKey) {
-      return;
-    }
-
-    handledKeyRef.current = handledKey;
-
-    if (successMessage) {
-      toast.success(successMessage);
-    }
-
-    if (errorMessage) {
-      toast.error(errorMessage);
-    }
-
-    const nextParams = new URLSearchParams(searchParams.toString());
-
-    for (const name of TOAST_PARAM_NAMES) {
-      nextParams.delete(name);
-    }
-
-    const nextQuery = nextParams.toString();
-
-    router.replace(nextQuery ? `${pathname}?${nextQuery}` : pathname, {
-      scroll: false,
-    });
-  }, [pathname, router, searchParams]);
-
-  return null;
-}

components/layout/floating-preferences.tsx

@@ -27,15 +27,11 @@ export function FloatingPreferences({
           <SoundToggle
             ariaLabel={t("soundMute")}
             mutedAriaLabel={t("soundUnmute")}
-            mutedToastLabel={t("soundMuted")}
-            unmutedToastLabel={t("soundEnabled")}
             variant="ghost"
             className="h-9 w-9 rounded-pill border border-transparent bg-transparent text-foreground/80 hover:bg-accent hover:text-foreground"
           />
           <ThemeToggle
             ariaLabel={t("themeToggle")}
-            lightToastLabel={t("themeLight")}
-            darkToastLabel={t("themeDark")}
             variant="ghost"
             className="h-9 w-9 rounded-pill border border-transparent bg-transparent text-foreground/80 hover:bg-accent hover:text-foreground"
           />

components/layout/locale-toggle.tsx

@@ -13,8 +13,6 @@ import {
 import { AppLocale, getLocalizedPath, stripLocalePrefix } from "@/lib/locale";
 import { cn } from "@/lib/utils";
 
-const PENDING_TOAST_STORAGE_KEY = "mohfarawati-pending-toast";
-
 type LocaleToggleProps = {
   locale: string;
   defaultLocale: AppLocale;
@@ -22,12 +20,6 @@ type LocaleToggleProps = {
   showLabel?: boolean;
 };
 
-const localeChangedMessages: Record<AppLocale, string> = {
-  de: "Sprache auf Deutsch gewechselt",
-  en: "Language changed to English",
-  ar: "تم تغيير اللغة إلى العربية",
-};
-
 export function LocaleToggle({
   locale,
   defaultLocale,
@@ -85,22 +77,6 @@ export function LocaleToggle({
           >
             <a
               href={getLocalizedPath(targetLocale, currentPath, defaultLocale)}
-              onClick={() => {
-                const message = localeChangedMessages[targetLocale];
-
-                if (!message) {
-                  return;
-                }
-
-                window.sessionStorage.setItem(
-                  PENDING_TOAST_STORAGE_KEY,
-                  JSON.stringify({
-                    type: "success",
-                    message,
-                    targetLocale,
-                  }),
-                );
-              }}
               className="group flex h-10 w-10 items-center justify-center rounded-full"
             >
               <Image

components/layout/site-header.tsx

@@ -15,7 +15,6 @@ import { ThemeToggle } from "@/components/theme-toggle";
 import { Button } from "@/components/ui/button";
 import { buildAdminUrl } from "@/lib/admin-routing";
 import { getLocalizedPath, stripLocalePrefix } from "@/lib/locale";
-import { toast } from "@/lib/toast";
 import { cn } from "@/lib/utils";
 
 const navItems = [
@@ -211,7 +210,6 @@ export function SiteHeader({
 
     logoClickTimesRef.current = [];
     event.preventDefault();
-    toast(t("logoTripleClick"));
   };
 
   return (
@@ -317,15 +315,11 @@ export function SiteHeader({
               <SoundToggle
                 ariaLabel={t("soundMute")}
                 mutedAriaLabel={t("soundUnmute")}
-                mutedToastLabel={t("soundMuted")}
-                unmutedToastLabel={t("soundEnabled")}
                 variant="ghost"
                 className={desktopControlButtonClassName}
               />
               <ThemeToggle
                 ariaLabel={t("themeToggle")}
-                lightToastLabel={t("themeLight")}
-                darkToastLabel={t("themeDark")}
                 variant="ghost"
                 className={desktopControlButtonClassName}
               />
@@ -467,15 +461,11 @@ export function SiteHeader({
                       <SoundToggle
                         ariaLabel={t("soundMute")}
                         mutedAriaLabel={t("soundUnmute")}
-                        mutedToastLabel={t("soundMuted")}
-                        unmutedToastLabel={t("soundEnabled")}
                         variant="ghost"
                         className={mobileControlButtonClassName}
                       />
                       <ThemeToggle
                         ariaLabel={t("themeToggle")}
-                        lightToastLabel={t("themeLight")}
-                        darkToastLabel={t("themeDark")}
                         variant="ghost"
                         className={mobileControlButtonClassName}
                       />

components/site/contact-form.tsx

@@ -2,12 +2,10 @@
 
 import Link from "next/link";
 
-import { ContactTurnstile } from "@/components/site/contact-turnstile";
 import { Button } from "@/components/ui/button";
 import { Input } from "@/components/ui/input";
 import { Label } from "@/components/ui/label";
 import { Textarea } from "@/components/ui/textarea";
-import type { PublicContactProtectionSettings } from "@/lib/contact-protection";
 
 type ContactFormCopy = {
   name: string;
@@ -25,7 +23,6 @@ type ContactFormProps = {
   locale: string;
   previewHref: string;
   copy: ContactFormCopy;
-  protection: PublicContactProtectionSettings;
 };
 
 export function ContactForm({
@@ -33,7 +30,6 @@ export function ContactForm({
   locale,
   previewHref,
   copy,
-  protection,
 }: ContactFormProps) {
   return (
     <form action={action} className="grid gap-5">
@@ -68,10 +64,6 @@ export function ContactForm({
 
       <p className="text-sm text-muted-foreground">{copy.note}</p>
 
-      {protection.turnstile.enabled ? (
-        <ContactTurnstile siteKey={protection.turnstile.siteKey} />
-      ) : null}
-
       <div className="flex flex-wrap gap-3">
         <Button type="submit">{copy.submit}</Button>
         <Button asChild variant="outline">

components/site/contact-turnstile.tsx

@@ -1,107 +0,0 @@
-"use client";
-
-import { useEffect, useId, useRef, useState } from "react";
-
-declare global {
-  interface Window {
-    turnstile?: {
-      render: (
-        container: HTMLElement,
-        options: {
-          sitekey: string;
-          callback?: (token: string) => void;
-          "expired-callback"?: () => void;
-          "error-callback"?: () => void;
-        },
-      ) => string;
-    };
-  }
-}
-
-type ContactTurnstileProps = {
-  siteKey: string;
-};
-
-export function ContactTurnstile({ siteKey }: ContactTurnstileProps) {
-  const containerRef = useRef<HTMLDivElement | null>(null);
-  const [token, setToken] = useState("");
-  const [error, setError] = useState("");
-  const widgetId = useId();
-
-  useEffect(() => {
-    if (!siteKey || !containerRef.current) {
-      return undefined;
-    }
-
-    let cancelled = false;
-
-    function renderWidget() {
-      if (cancelled || !containerRef.current || !window.turnstile) {
-        return;
-      }
-
-      if (containerRef.current.dataset.widgetMounted === widgetId) {
-        return;
-      }
-
-      containerRef.current.innerHTML = "";
-      window.turnstile.render(containerRef.current, {
-        sitekey: siteKey,
-        callback: (nextToken) => {
-          setToken(nextToken);
-          setError("");
-        },
-        "expired-callback": () => {
-          setToken("");
-          setError("Verification expired. Please try again.");
-        },
-        "error-callback": () => {
-          setToken("");
-          setError("Verification could not be completed.");
-        },
-      });
-      containerRef.current.dataset.widgetMounted = widgetId;
-    }
-
-    function ensureScript() {
-      const existingScript = document.querySelector<HTMLScriptElement>(
-        'script[src="https://challenges.cloudflare.com/turnstile/v0/api.js?render=explicit"]',
-      );
-
-      if (existingScript) {
-        if (window.turnstile) {
-          renderWidget();
-        } else {
-          existingScript.addEventListener("load", renderWidget, { once: true });
-        }
-
-        return;
-      }
-
-      const script = document.createElement("script");
-      script.src = "https://challenges.cloudflare.com/turnstile/v0/api.js?render=explicit";
-      script.async = true;
-      script.defer = true;
-      script.addEventListener("load", renderWidget, { once: true });
-      document.head.appendChild(script);
-    }
-
-    ensureScript();
-
-    return () => {
-      cancelled = true;
-    };
-  }, [siteKey, widgetId]);
-
-  if (!siteKey) {
-    return null;
-  }
-
-  return (
-    <div className="space-y-2">
-      <div ref={containerRef} />
-      <input type="hidden" name="turnstileToken" value={token} />
-      {error ? <p className="text-xs text-destructive">{error}</p> : null}
-    </div>
-  );
-}

components/sound-toggle.tsx

@@ -3,14 +3,11 @@
 import { Volume2, VolumeX } from "lucide-react";
 import { useSound } from "@/components/sound-provider";
 import { Button, type ButtonProps } from "@/components/ui/button";
-import { toast } from "@/lib/toast";
 import { cn } from "@/lib/utils";
 
 type SoundToggleProps = {
   ariaLabel?: string;
   mutedAriaLabel?: string;
-  mutedToastLabel?: string;
-  unmutedToastLabel?: string;
   variant?: ButtonProps["variant"];
   className?: string;
   iconClassName?: string;
@@ -19,8 +16,6 @@ type SoundToggleProps = {
 export function SoundToggle({
   ariaLabel = "Mute sounds",
   mutedAriaLabel = "Unmute sounds",
-  mutedToastLabel = "Sound muted",
-  unmutedToastLabel = "Sound enabled",
   variant = "outline",
   className,
   iconClassName,
@@ -29,7 +24,6 @@ export function SoundToggle({
 
   const handleToggle = () => {
     toggleMuted();
-    toast(isMuted ? unmutedToastLabel : mutedToastLabel);
   };
 
   return (

components/theme-toggle.tsx

@@ -5,14 +5,11 @@ import { useTheme } from "next-themes";
 import { useEffect, useState } from "react";
 import { useSound } from "@/components/sound-provider";
 import { Button, type ButtonProps } from "@/components/ui/button";
-import { toast } from "@/lib/toast";
 import { cn } from "@/lib/utils";
 
 type ThemeToggleProps = {
   ariaLabel?: string;
   label?: string;
-  lightToastLabel?: string;
-  darkToastLabel?: string;
   variant?: ButtonProps["variant"];
   className?: string;
   iconClassName?: string;
@@ -21,8 +18,6 @@ type ThemeToggleProps = {
 export function ThemeToggle({
   ariaLabel = "Toggle theme",
   label,
-  lightToastLabel = "Light mode enabled",
-  darkToastLabel = "Dark mode enabled",
   variant = "outline",
   className,
   iconClassName,
@@ -58,7 +53,6 @@ export function ThemeToggle({
 
     setTheme(nextTheme);
     playSound(nextTheme === "dark" ? "/audio/dark.mp3" : "/audio/light.mp3");
-    toast(nextTheme === "dark" ? darkToastLabel : lightToastLabel);
   };
 
   return (

components/ui/toaster.tsx

@@ -1,32 +0,0 @@
-"use client";
-
-import { Toaster as HotToaster, type ToasterProps } from "react-hot-toast";
-
-type AppToasterProps = ToasterProps & {
-  locale: string;
-};
-
-export function Toaster({ locale, ...props }: AppToasterProps) {
-  const isArabic = locale === "ar";
-
-  const toastClassName = `${isArabic ? "font-arabic tracking-normal" : "font-latin"} text-[13px] leading-5`;
-
-  return (
-    <HotToaster
-      key={locale}
-      {...props}
-      position={props.position ?? (isArabic ? "top-right" : "top-left")}
-      reverseOrder={props.reverseOrder ?? false}
-      toastOptions={{
-        ...props.toastOptions,
-        className:
-          props.toastOptions?.className ??
-          toastClassName,
-        style: {
-          borderRadius: "36px",
-          ...(props.toastOptions?.style ?? {}),
-        },
-      }}
-    />
-  );
-}