fix(toggle): commits immediately with reduced motion

When `prefers-reduced-motion` is active, the tracker's transition duration becomes 0ms. This can prevent the `transitionend` event from firing, leaving the toggler in a pending state and preventing it from committing the new selection or navigating. Committing immediately in this scenario ensures the toggler functions correctly for users with reduced motion preferences.

Author: seferturan

projects/client/src/lib/components/toggles/Toggler.svelte

@@ -27,16 +27,11 @@
   let trackerElement: HTMLDivElement;
   let pending = $state<{ index: number; href?: string } | null>(null);
 
-  const handleChange = (index: number, href?: string) => {
-    pending = { index, href };
-    trackerIndex.set(index);
-    trackerElement?.classList.add("moving");
-  };
-
-  const handleTransitionEnd = (event: TransitionEvent) => {
-    if (event.propertyName === "opacity" || !pending) return;
+  const prefersReducedMotion = () =>
+    globalThis.matchMedia("(prefers-reduced-motion: reduce)").matches;
 
-    (event.currentTarget as HTMLDivElement).classList.remove("moving");
+  const commit = () => {
+    if (!pending) return;
 
     const { index, href } = pending;
     pending = null;
@@ -49,6 +44,27 @@
     }
   };
 
+  const handleChange = (index: number, href?: string) => {
+    pending = { index, href };
+    trackerIndex.set(index);
+
+    // With reduced motion the tracker transition is 0ms, so transitionend
+    // never fires - commit immediately instead of waiting for it.
+    if (prefersReducedMotion()) {
+      commit();
+      return;
+    }
+
+    trackerElement?.classList.add("moving");
+  };
+
+  const handleTransitionEnd = (event: TransitionEvent) => {
+    if (event.propertyName === "opacity" || !pending) return;
+
+    (event.currentTarget as HTMLDivElement).classList.remove("moving");
+    commit();
+  };
+
   const getTriggerProps = (option: ToggleOption<T>, index: number) => {
     if (option.href) {
       return {