@datatechsolutions/ui 2.7.138 → 2.7.140

package/dist/{chunk-5IE2FIWT.js → chunk-WXI7OCNY.js}

@@ -656,7 +656,7 @@ function LoadingSpinner({ className }) {
   return /* @__PURE__ */ jsxRuntime.jsxs(
     "svg",
     {
-      className: clsx__default.default("h-4 w-4 animate-spin", className),
+      className: clsx__default.default("h-4 w-4 animate-spin motion-reduce:animate-none", className),
       xmlns: "http://www.w3.org/2000/svg",
       fill: "none",
       viewBox: "0 0 24 24",
@@ -766,7 +766,8 @@ function IconButton({
       isIosColor && finalColor === "ios-red" && "text-[#FF3B30] dark:text-[#FF453A]",
       isIosColor && finalColor === "ios-green" && "text-[#34C759] dark:text-[#30D158]",
       isIosColor && finalColor === "ios-orange" && "text-[#FF9500] dark:text-[#FF9F0A]",
-      isIosColor && finalColor === "ios-purple" && "text-[#AF52DE] dark:text-[#BF5AF2]"
+      isIosColor && finalColor === "ios-purple" && "text-[#AF52DE] dark:text-[#BF5AF2]",
+      !isIosColor && "text-slate-700 dark:text-slate-300"
     ),
     outline: clsx__default.default(
       "bg-transparent border",
@@ -954,6 +955,7 @@ var Input = React11.forwardRef(
     const helperId = `${inputId}-helper`;
     const [isFocused, setIsFocused] = React11.useState(false);
     const [showPassword, setShowPassword] = React11.useState(false);
+    const prefersReducedMotion2 = framerMotion.useReducedMotion();
     const hasValue = value !== void 0 && value !== "";
     const characterCount = typeof value === "string" ? value.length : 0;
     const isOverLimit = maxCharacters ? characterCount > maxCharacters : false;
@@ -988,14 +990,14 @@ var Input = React11.forwardRef(
         liquid-surface h-12 w-full rounded-xl border-0
         px-4 py-3 text-base
         text-slate-900 dark:text-white
-        placeholder:text-slate-400 dark:placeholder:text-slate-500
+        placeholder:text-slate-500 dark:placeholder:text-slate-500
         transition-all duration-200
         disabled:cursor-not-allowed disabled:opacity-50
       ` : `
         liquid-surface h-11 w-full rounded-xl
         px-3.5 py-2.5 text-base
         text-slate-900 dark:text-white
-        placeholder:text-slate-400 dark:placeholder:text-slate-500
+        placeholder:text-slate-500 dark:placeholder:text-slate-500
         transition-all duration-200
         disabled:cursor-not-allowed disabled:opacity-50
       `;
@@ -1023,7 +1025,7 @@ var Input = React11.forwardRef(
           exit: { opacity: 0, scale: 0.8 },
           transition: { duration: 0.15 },
           onClick: togglePassword,
-          className: "p-1 rounded-full text-slate-400 hover:text-slate-600 dark:hover:text-slate-300 hover:bg-white/40 dark:hover:bg-white/[0.08] transition-colors",
+          className: "p-2 min-h-[44px] min-w-[44px] flex items-center justify-center rounded-full text-slate-400 hover:text-slate-600 dark:hover:text-slate-300 hover:bg-white/40 dark:hover:bg-white/[0.08] transition-colors",
           "aria-label": showPassword ? t("hidePassword") : t("showPassword"),
           children: showPassword ? /* @__PURE__ */ jsxRuntime.jsx(solid.EyeSlashIcon, { className: "h-5 w-5" }) : /* @__PURE__ */ jsxRuntime.jsx(solid.EyeIcon, { className: "h-5 w-5" })
         }
@@ -1037,7 +1039,8 @@ var Input = React11.forwardRef(
           exit: { opacity: 0, scale: 0.8 },
           transition: { duration: 0.15 },
           onClick: handleClear,
-          className: "p-1 rounded-full text-slate-400 hover:text-slate-600 dark:hover:text-slate-300 hover:bg-white/40 dark:hover:bg-white/[0.08] transition-colors",
+          className: "p-2 min-h-[44px] min-w-[44px] flex items-center justify-center rounded-full text-slate-400 hover:text-slate-600 dark:hover:text-slate-300 hover:bg-white/40 dark:hover:bg-white/[0.08] transition-colors",
+          "aria-label": "Clear input",
           children: /* @__PURE__ */ jsxRuntime.jsx(solid.XMarkIcon, { className: "h-5 w-5" })
         }
       ) })
@@ -1065,7 +1068,7 @@ var Input = React11.forwardRef(
             children: successMessage
           }
         ),
-        !error && !successMessage && helperText && /* @__PURE__ */ jsxRuntime.jsx("p", { id: helperId, className: "text-sm text-slate-500 dark:text-slate-400", children: helperText })
+        !error && !successMessage && helperText && /* @__PURE__ */ jsxRuntime.jsx("p", { id: helperId, className: "text-sm text-slate-600 dark:text-slate-400", children: helperText })
       ] }),
       showCharacterCount && /* @__PURE__ */ jsxRuntime.jsxs(
         "span",
@@ -1108,16 +1111,33 @@ var Input = React11.forwardRef(
               ...props
             }
           ),
-          /* @__PURE__ */ jsxRuntime.jsx(
+          prefersReducedMotion2 ? /* @__PURE__ */ jsxRuntime.jsx(
+            "label",
+            {
+              htmlFor: inputId,
+              className: `
+                  absolute left-3.5 pointer-events-none
+                  text-slate-500 dark:text-slate-400
+                  transition-all duration-200
+                  ${icon ? "left-11" : ""}
+                `,
+              style: {
+                top: hasValue || isFocused ? "0.5rem" : "50%",
+                transform: hasValue || isFocused ? "none" : "translateY(-50%)",
+                fontSize: hasValue || isFocused ? "0.75rem" : "1rem"
+              },
+              children: label
+            }
+          ) : /* @__PURE__ */ jsxRuntime.jsx(
             framerMotion.motion.label,
             {
               htmlFor: inputId,
               className: `
-                absolute left-3.5 pointer-events-none
-                text-slate-500 dark:text-slate-400
-                transition-all duration-200
-                ${icon ? "left-11" : ""}
-              `,
+                  absolute left-3.5 pointer-events-none
+                  text-slate-500 dark:text-slate-400
+                  transition-all duration-200
+                  ${icon ? "left-11" : ""}
+                `,
               initial: false,
               animate: {
                 top: hasValue || isFocused ? "0.5rem" : "50%",
@@ -1589,11 +1609,11 @@ var Select = React11.forwardRef(
               cursor-pointer
             `,
             children: [
-              /* @__PURE__ */ jsxRuntime.jsx("span", { className: selectedOption ? "" : "text-slate-400", children: selectedOption?.label || placeholder }),
+              /* @__PURE__ */ jsxRuntime.jsx("span", { className: selectedOption ? "" : "text-slate-500", children: selectedOption?.label || placeholder }),
               /* @__PURE__ */ jsxRuntime.jsx(
                 solid.ChevronDownIcon,
                 {
-                  className: `h-5 w-5 text-slate-400 transition-transform duration-200
+                  className: `h-5 w-5 text-slate-500 transition-transform duration-200
                 ${isOpen ? "rotate-180" : ""}`
                 }
               )
@@ -1630,7 +1650,7 @@ var Select = React11.forwardRef(
             }
           ) })
         ] }),
-        error && /* @__PURE__ */ jsxRuntime.jsx("p", { className: "text-sm text-ios-red", children: error })
+        error && /* @__PURE__ */ jsxRuntime.jsx("p", { className: "text-sm text-ios-red", role: "alert", "aria-live": "polite", children: error })
       ] });
     }
     return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "space-y-1.5", children: [
@@ -1662,11 +1682,11 @@ var Select = React11.forwardRef(
         /* @__PURE__ */ jsxRuntime.jsx(
           solid.ChevronDownIcon,
           {
-            className: "absolute right-3 top-1/2 -translate-y-1/2 h-5 w-5 text-slate-400 pointer-events-none"
+            className: "absolute right-3 top-1/2 -translate-y-1/2 h-5 w-5 text-slate-500 pointer-events-none"
           }
         )
       ] }),
-      error && /* @__PURE__ */ jsxRuntime.jsx("p", { className: "text-sm text-ios-red", children: error })
+      error && /* @__PURE__ */ jsxRuntime.jsx("p", { className: "text-sm text-ios-red", role: "alert", "aria-live": "polite", children: error })
     ] });
   }
 );
@@ -1714,13 +1734,13 @@ function DropdownSelect({
           ${error ? "border-ios-red ring-4 ring-ios-red/10" : ""}
         `,
         children: [
-          /* @__PURE__ */ jsxRuntime.jsx("span", { className: selectedOption ? "" : "text-slate-400", children: selectedOption?.label || placeholder }),
+          /* @__PURE__ */ jsxRuntime.jsx("span", { className: selectedOption ? "" : "text-slate-500", children: selectedOption?.label || placeholder }),
           /* @__PURE__ */ jsxRuntime.jsx(
             framerMotion.motion.div,
             {
               animate: { rotate: isOpen ? 180 : 0 },
               transition: { duration: 0.2 },
-              children: /* @__PURE__ */ jsxRuntime.jsx(solid.ChevronDownIcon, { className: "h-5 w-5 text-slate-400" })
+              children: /* @__PURE__ */ jsxRuntime.jsx(solid.ChevronDownIcon, { className: "h-5 w-5 text-slate-500" })
             }
           )
         ]
@@ -1764,7 +1784,7 @@ function DropdownSelect({
         }
       )
     ] }) }),
-    error && /* @__PURE__ */ jsxRuntime.jsx("p", { className: "text-sm text-ios-red", children: error })
+    error && /* @__PURE__ */ jsxRuntime.jsx("p", { className: "text-sm text-ios-red", role: "alert", "aria-live": "polite", children: error })
   ] });
 }
 var sizes = {
@@ -2014,24 +2034,46 @@ function HeroSection({
   labelExtra,
   children
 }) {
-  return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "liquid-surface overflow-hidden rounded-2xl", children: [
-    gradient && /* @__PURE__ */ jsxRuntime.jsx("div", { className: `h-1.5 w-full bg-gradient-to-r ${gradient}` }),
-    /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "p-5 sm:p-8", children: [
-      /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center gap-2 text-slate-600 dark:text-white/70", children: [
-        icon,
-        /* @__PURE__ */ jsxRuntime.jsx("span", { className: "text-sm font-medium", children: label }),
-        labelExtra
-      ] }),
-      /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "mt-2 flex flex-wrap items-center justify-between gap-4", children: [
-        /* @__PURE__ */ jsxRuntime.jsx("h1", { className: "text-2xl font-bold tracking-tight text-slate-900 dark:text-white sm:text-4xl", children: title }),
-        actions && /* @__PURE__ */ jsxRuntime.jsx("div", { className: "flex items-center gap-3", children: actions })
-      ] }),
-      /* @__PURE__ */ jsxRuntime.jsx("p", { className: "mt-2 max-w-xl text-sm text-slate-500 dark:text-white/60 sm:mt-3 sm:text-lg", children: subtitle }),
-      toolbar && /* @__PURE__ */ jsxRuntime.jsx("div", { className: "mt-4", children: toolbar }),
-      badges && /* @__PURE__ */ jsxRuntime.jsx("div", { className: "mt-6 flex flex-wrap items-center gap-4", children: badges }),
-      children
-    ] })
-  ] });
+  return /* @__PURE__ */ jsxRuntime.jsxs(
+    "div",
+    {
+      role: "banner",
+      "data-testid": "hero-section",
+      className: "liquid-surface overflow-hidden rounded-2xl",
+      children: [
+        gradient && /* @__PURE__ */ jsxRuntime.jsx("div", { className: `h-1.5 w-full bg-gradient-to-r ${gradient}` }),
+        /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "p-5 sm:p-8", children: [
+          /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center gap-2 text-slate-600 dark:text-white/70", children: [
+            icon,
+            /* @__PURE__ */ jsxRuntime.jsx("span", { className: "text-sm font-medium", children: label }),
+            labelExtra
+          ] }),
+          /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "mt-2 flex flex-wrap items-center justify-between gap-4", children: [
+            /* @__PURE__ */ jsxRuntime.jsx(
+              "h1",
+              {
+                "data-testid": "hero-title",
+                className: "text-2xl font-bold tracking-tight text-slate-900 dark:text-white sm:text-4xl",
+                children: title
+              }
+            ),
+            actions && /* @__PURE__ */ jsxRuntime.jsx("div", { className: "flex items-center gap-3", children: actions })
+          ] }),
+          /* @__PURE__ */ jsxRuntime.jsx(
+            "p",
+            {
+              "data-testid": "hero-subtitle",
+              className: "mt-2 max-w-xl text-sm text-slate-500 dark:text-white/60 sm:mt-3 sm:text-lg",
+              children: subtitle
+            }
+          ),
+          toolbar && /* @__PURE__ */ jsxRuntime.jsx("div", { "data-testid": "hero-toolbar", className: "mt-4", children: toolbar }),
+          badges && /* @__PURE__ */ jsxRuntime.jsx("div", { className: "mt-6 flex flex-wrap items-center gap-4", children: badges }),
+          children
+        ] })
+      ]
+    }
+  );
 }
 var DEFAULT_STYLE_CONFIG = {
   default: {
@@ -2304,6 +2346,9 @@ function StatCard({
   return /* @__PURE__ */ jsxRuntime.jsxs(
     "div",
     {
+      role: "status",
+      "aria-label": label,
+      "data-testid": label ? `stat-card-${label.toLowerCase().replace(/\s+/g, "-")}` : "stat-card",
       onClick,
       className: `group relative overflow-hidden rounded-xl p-5 transition-all duration-200 ${isClickable ? "cursor-pointer" : ""} ${isActive ? `bg-gradient-to-br ${colorConfig.activeGradient} ring-2 ring-offset-2 ${colorConfig.activeRing} shadow-xl` : `liquid-surface hover:shadow-md ${isFiltered ? "ring-indigo-300 dark:ring-indigo-500/50" : isUrgent ? "ring-amber-300 dark:ring-amber-500/50" : ""}`} ${className}`,
       children: [
@@ -2335,6 +2380,7 @@ function StatCard({
           /* @__PURE__ */ jsxRuntime.jsx(
             "p",
             {
+              "data-testid": "stat-card-value",
               className: `mt-4 text-3xl font-bold ${isActive ? "text-white" : isUrgent ? colorConfig.urgentValueColor || colorConfig.valueColor : colorConfig.valueColor}`,
               children: value
             }
@@ -2342,6 +2388,7 @@ function StatCard({
           /* @__PURE__ */ jsxRuntime.jsx(
             "p",
             {
+              "data-testid": "stat-card-label",
               className: `mt-1 text-sm ${isActive ? "text-white/75" : "text-slate-500 dark:text-slate-400"}`,
               children: label
             }
@@ -2645,7 +2692,7 @@ function CircleSpinner({ size, color, className, ariaLabel }) {
     "div",
     {
       className: clsx.clsx(
-        "rounded-full animate-spin",
+        "rounded-full animate-spin motion-reduce:animate-none",
         config.size,
         config.border,
         colors3.track,
@@ -2660,9 +2707,10 @@ function CircleSpinner({ size, color, className, ariaLabel }) {
 function DotsSpinner({ size, color, className, ariaLabel }) {
   const config = sizeConfig[size];
   const colors3 = colorClasses2[color];
+  const prefersReducedMotion2 = framerMotion.useReducedMotion();
   const dotVariants = {
     initial: { scale: 0.8, opacity: 0.4 },
-    animate: { scale: 1, opacity: 1 }
+    animate: prefersReducedMotion2 ? { scale: 1, opacity: 1 } : { scale: 1, opacity: 1 }
   };
   return /* @__PURE__ */ jsxRuntime.jsx("div", { className: clsx.clsx("flex items-center gap-1", className), role: "status", "aria-label": ariaLabel, children: [0, 1, 2].map((index) => /* @__PURE__ */ jsxRuntime.jsx(
     framerMotion.motion.div,
@@ -2675,7 +2723,7 @@ function DotsSpinner({ size, color, className, ariaLabel }) {
       variants: dotVariants,
       initial: "initial",
       animate: "animate",
-      transition: {
+      transition: prefersReducedMotion2 ? { duration: 0 } : {
         duration: 0.5,
         repeat: Infinity,
         repeatType: "reverse",
@@ -2688,16 +2736,17 @@ function DotsSpinner({ size, color, className, ariaLabel }) {
 function PulseSpinner({ size, color, className, ariaLabel }) {
   const config = sizeConfig[size];
   const colors3 = colorClasses2[color];
+  const prefersReducedMotion2 = framerMotion.useReducedMotion();
   return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: clsx.clsx("relative", config.size, className), role: "status", "aria-label": ariaLabel, children: [
     /* @__PURE__ */ jsxRuntime.jsx(
       framerMotion.motion.div,
       {
         className: clsx.clsx("absolute inset-0 rounded-full", colors3.dot),
-        animate: {
+        animate: prefersReducedMotion2 ? {} : {
           scale: [1, 1.5, 1],
           opacity: [0.7, 0, 0.7]
         },
-        transition: {
+        transition: prefersReducedMotion2 ? { duration: 0 } : {
           duration: 1.5,
           repeat: Infinity,
           ease: "easeInOut"
@@ -2732,7 +2781,8 @@ function Spinner({
     {
       size,
       color,
-      className
+      className,
+      ariaLabel
     }
   );
 }
@@ -3037,10 +3087,42 @@ function SegmentedControl({
     chunkUZ3CMNUJ_js.triggerHaptic("light");
     onChange(segmentValue);
   };
+  const handleKeyDown = React11.useCallback(
+    (event) => {
+      if (disabled) return;
+      const currentIndex = normalizedSegments.findIndex((seg) => seg.value === value);
+      let nextIndex = -1;
+      if (event.key === "ArrowRight" || event.key === "ArrowDown") {
+        event.preventDefault();
+        nextIndex = (currentIndex + 1) % normalizedSegments.length;
+      } else if (event.key === "ArrowLeft" || event.key === "ArrowUp") {
+        event.preventDefault();
+        nextIndex = (currentIndex - 1 + normalizedSegments.length) % normalizedSegments.length;
+      } else if (event.key === "Home") {
+        event.preventDefault();
+        nextIndex = 0;
+      } else if (event.key === "End") {
+        event.preventDefault();
+        nextIndex = normalizedSegments.length - 1;
+      }
+      if (nextIndex >= 0) {
+        const nextSegment = normalizedSegments[nextIndex];
+        onChange(nextSegment.value);
+        chunkUZ3CMNUJ_js.triggerHaptic("light");
+        const buttons = containerRef.current?.querySelectorAll("button");
+        buttons?.[nextIndex]?.focus();
+      }
+    },
+    [disabled, normalizedSegments, value, onChange]
+  );
   return /* @__PURE__ */ jsxRuntime.jsxs(
     "div",
     {
       ref: containerRef,
+      role: "tablist",
+      "aria-live": "polite",
+      "data-testid": "segmented-control",
+      onKeyDown: handleKeyDown,
       className: `
         relative inline-flex items-center rounded-xl
         bg-white/40 dark:bg-white/[0.08]
@@ -3067,6 +3149,11 @@ function SegmentedControl({
             "button",
             {
               type: "button",
+              role: "tab",
+              "aria-selected": isSelected,
+              "aria-label": segment.label,
+              tabIndex: isSelected ? 0 : -1,
+              "data-testid": `tab-${segment.value}`,
               onClick: () => handleSelect(segment.value),
               className: `
               relative z-10 flex items-center justify-center gap-1.5
@@ -4262,7 +4349,7 @@ function TableSkeletonRow({
         "div",
         {
           className: clsx__default.default(
-            "h-4 rounded bg-slate-200 dark:bg-slate-700 animate-pulse",
+            "h-4 rounded bg-slate-200 dark:bg-slate-700 animate-pulse motion-reduce:animate-none",
             i === 0 ? "w-32" : i === columns - 1 ? "w-16" : "w-24"
           )
         }
@@ -4943,7 +5030,7 @@ function DynamicIslandNotification({
           icon && /* @__PURE__ */ jsxRuntime.jsx("div", { className: `h-8 w-8 rounded-full ${styles2.iconBg} flex items-center justify-center shrink-0`, children: /* @__PURE__ */ jsxRuntime.jsx("div", { className: "h-5 w-5 text-white", children: icon }) }),
           /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex-1 min-w-0", children: [
             /* @__PURE__ */ jsxRuntime.jsx("p", { className: "text-sm font-semibold truncate", children: title }),
-            message && /* @__PURE__ */ jsxRuntime.jsx("p", { className: "text-xs text-gray-400 truncate", children: message })
+            message && /* @__PURE__ */ jsxRuntime.jsx("p", { className: "text-xs text-gray-500 truncate", children: message })
           ] })
         ] })
       ),
@@ -4954,7 +5041,7 @@ function DynamicIslandNotification({
           /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex-1 min-w-0", children: [
             appName && /* @__PURE__ */ jsxRuntime.jsx("p", { className: `text-[11px] uppercase tracking-wide font-medium ${styles2.accentColor}`, children: appName }),
             /* @__PURE__ */ jsxRuntime.jsx("p", { className: "text-[15px] font-semibold leading-tight", children: title }),
-            message && /* @__PURE__ */ jsxRuntime.jsx("p", { className: "text-[13px] text-gray-400 mt-0.5 truncate", children: message })
+            message && /* @__PURE__ */ jsxRuntime.jsx("p", { className: "text-[13px] text-gray-500 mt-0.5 truncate", children: message })
           ] })
         ] })
       )
@@ -5071,7 +5158,7 @@ function NotificationBellButton() {
       children: [
         /* @__PURE__ */ jsxRuntime.jsx(HeroIcons.BellIcon, { className: "h-5 w-5" }),
         totalCount > 0 ? /* @__PURE__ */ jsxRuntime.jsxs("span", { className: "absolute top-1 right-1 flex h-2 w-2", children: [
-          /* @__PURE__ */ jsxRuntime.jsx("span", { className: "animate-ping absolute inline-flex h-full w-full rounded-full bg-indigo-400 opacity-75" }),
+          /* @__PURE__ */ jsxRuntime.jsx("span", { className: "animate-ping motion-reduce:animate-none absolute inline-flex h-full w-full rounded-full bg-indigo-400 opacity-75" }),
           /* @__PURE__ */ jsxRuntime.jsx("span", { className: "relative inline-flex rounded-full h-2 w-2 bg-indigo-500" })
         ] }) : null
       ]
@@ -5178,7 +5265,7 @@ function NotificationDrawer({
                     {
                       type: "button",
                       onClick: () => onRemove(item.id),
-                      className: "absolute right-2.5 top-2.5 rounded-lg p-1 text-gray-300 opacity-0 transition-all group-hover:opacity-100 hover:text-gray-500 active:scale-95 dark:text-gray-600 dark:hover:text-gray-400",
+                      className: "absolute right-2.5 top-2.5 rounded-lg p-1 text-gray-300 opacity-0 transition-all group-hover:opacity-100 group-focus-within:opacity-100 hover:text-gray-500 active:scale-95 dark:text-gray-600 dark:hover:text-gray-400",
                       "aria-label": t("dismiss"),
                       children: /* @__PURE__ */ jsxRuntime.jsx(HeroIcons.XMarkIcon, { className: "h-3.5 w-3.5" })
                     }
@@ -5383,7 +5470,7 @@ var StatusBadge = React11.forwardRef(function StatusBadge2({ status, label, size
         "data-testid": `status-badge-${status}`,
         className: `inline-flex items-center gap-1.5 rounded-full border font-semibold backdrop-blur-sm ${SIZE_STYLES[size]} ${toneStyle.container} ${className}`,
         children: [
-          IconComponent ? /* @__PURE__ */ jsxRuntime.jsx(IconComponent, { className: `h-3 w-3 ${configuredStatus.animateIcon ? "animate-spin" : ""}` }) : /* @__PURE__ */ jsxRuntime.jsx("span", { className: `h-2 w-2 rounded-full ${toneStyle.dot}` }),
+          IconComponent ? /* @__PURE__ */ jsxRuntime.jsx(IconComponent, { className: `h-3 w-3 ${configuredStatus.animateIcon ? "animate-spin motion-reduce:animate-none" : ""}` }) : /* @__PURE__ */ jsxRuntime.jsx("span", { className: `h-2 w-2 rounded-full ${toneStyle.dot}` }),
           resolvedLabel2
         ]
       }
@@ -5413,11 +5500,14 @@ function GlassModal({
   children,
   panelClassName = "rounded-[2rem]",
   contentClassName = "fixed inset-0 flex items-center justify-center overflow-y-auto p-3 sm:p-5 lg:p-6",
-  zIndex = "z-50"
-}) {
-  return /* @__PURE__ */ jsxRuntime.jsxs(Headless6.Dialog, { open, onClose, className: `relative ${zIndex}`, children: [
-    /* @__PURE__ */ jsxRuntime.jsx(Headless6.DialogBackdrop, { className: "fixed inset-0 bg-slate-900/40 backdrop-blur-md dark:bg-black/50" }),
-    /* @__PURE__ */ jsxRuntime.jsx("div", { className: contentClassName, children: /* @__PURE__ */ jsxRuntime.jsx(Headless6.DialogPanel, { className: panelClassName, children }) })
+  zIndex = "z-50",
+  overlayTestId,
+  panelTestId,
+  ariaLabelledBy
+}) {
+  return /* @__PURE__ */ jsxRuntime.jsxs(Headless6.Dialog, { open, onClose, className: `relative ${zIndex}`, "aria-labelledby": ariaLabelledBy, children: [
+    /* @__PURE__ */ jsxRuntime.jsx(Headless6.DialogBackdrop, { className: "fixed inset-0 bg-slate-900/40 backdrop-blur-md dark:bg-black/50", "data-testid": overlayTestId }),
+    /* @__PURE__ */ jsxRuntime.jsx("div", { className: contentClassName, children: /* @__PURE__ */ jsxRuntime.jsx(Headless6.DialogPanel, { className: panelClassName, "data-testid": panelTestId, children }) })
   ] });
 }
 function Text({ className, ...props }) {
@@ -5920,7 +6010,8 @@ function GlassModalShell({
           type: "button",
           onClick: onClose,
           "aria-label": closeLabel,
-          className: "absolute right-4 top-4 inline-flex h-9 w-9 items-center justify-center rounded-xl text-slate-400 transition hover:bg-white/40 hover:text-slate-700 dark:hover:bg-white/[0.08] dark:hover:text-white",
+          "data-testid": "modal-close",
+          className: "absolute right-4 top-4 inline-flex h-9 w-9 items-center justify-center rounded-xl text-slate-400 transition hover:bg-white/40 hover:text-slate-700 dark:hover:bg-white/[0.08] dark:hover:text-white focus-visible:ring-2 focus-visible:ring-blue-500 focus-visible:ring-offset-2",
           children: /* @__PURE__ */ jsxRuntime.jsx(HeroIcons.XMarkIcon, { className: "h-5 w-5" })
         }
       ),
@@ -5930,14 +6021,14 @@ function GlassModalShell({
       ] }),
       /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex flex-wrap items-start justify-between gap-3 pr-10", children: [
         /* @__PURE__ */ jsxRuntime.jsxs("div", { children: [
-          /* @__PURE__ */ jsxRuntime.jsx("h2", { className: "text-xl font-bold text-slate-900 dark:text-white sm:text-2xl", children: title }),
+          /* @__PURE__ */ jsxRuntime.jsx("h2", { id: "modal-title", "data-testid": "modal-title", className: "text-xl font-bold text-slate-900 dark:text-white sm:text-2xl", children: title }),
           subtitle && /* @__PURE__ */ jsxRuntime.jsx("p", { className: "mt-1 text-sm text-slate-500 dark:text-slate-400", children: subtitle })
         ] }),
         headerActions && /* @__PURE__ */ jsxRuntime.jsx("div", { className: "flex items-center gap-2", children: headerActions })
       ] })
     ] }),
     /* @__PURE__ */ jsxRuntime.jsx("div", { className: "max-h-[72vh] overflow-y-auto px-5 pb-5 sm:px-8 sm:pb-8", children }),
-    footer && /* @__PURE__ */ jsxRuntime.jsx("div", { className: "border-t border-white/20 px-5 py-4 dark:border-white/10 sm:px-8", children: footer })
+    footer && /* @__PURE__ */ jsxRuntime.jsx("div", { "data-testid": "modal-footer", className: "border-t border-white/20 px-5 py-4 dark:border-white/10 sm:px-8", children: footer })
   ] });
   return /* @__PURE__ */ jsxRuntime.jsx(
     GlassModal,
@@ -5946,7 +6037,10 @@ function GlassModalShell({
       onClose,
       contentClassName: "fixed inset-0 overflow-y-auto p-3 sm:p-6",
       panelClassName: `liquid-surface-strong w-full overflow-hidden rounded-2xl mx-auto mt-[4vh] sm:mt-[8vh] ${SIZE_CLASSES2[maxWidth]} ${className}`,
+      ariaLabelledBy: "modal-title",
       zIndex,
+      overlayTestId: "modal-overlay",
+      panelTestId: "modal-panel",
       children: onSubmit ? /* @__PURE__ */ jsxRuntime.jsx("form", { onSubmit: handleSubmit, children: inner }) : inner
     }
   );
@@ -5977,6 +6071,7 @@ function GlassFormModal({
         disabled: isLoading,
         outline: true,
         className: "w-full sm:w-auto",
+        "data-testid": "form-modal-cancel",
         children: cancelLabel
       }
     ),
@@ -5989,11 +6084,12 @@ function GlassFormModal({
         loadingText: submitLabel,
         color: "ios-glass-blue",
         className: "w-full sm:w-auto",
+        "data-testid": "form-modal-submit",
         children: submitLabel
       }
     )
   ] }) }) : void 0;
-  return /* @__PURE__ */ jsxRuntime.jsx(
+  return /* @__PURE__ */ jsxRuntime.jsx("div", { "data-testid": "form-modal", role: "dialog", "aria-modal": "true", "aria-label": title, children: /* @__PURE__ */ jsxRuntime.jsx(
     GlassModalShell,
     {
       open,
@@ -6007,7 +6103,7 @@ function GlassFormModal({
       footer: defaultFooter,
       children
     }
-  );
+  ) });
 }
 function ContextMenu({
   position,
@@ -6648,12 +6744,13 @@ function wrapperClass(error) {
     error ? "focus-within:ring-2 focus-within:ring-offset-2 focus-within:ring-red-400/30" : "focus-within:ring-2 focus-within:ring-offset-2 focus-within:ring-indigo-500 dark:focus-within:ring-offset-gray-900"
   ].join(" ");
 }
-function FieldMeta({ hint, error }) {
+function FieldMeta({ hint, error, errorId, hintId }) {
   if (!hint && !error) return null;
   return /* @__PURE__ */ jsxRuntime.jsx(
     "p",
     {
-      className: `mt-1.5 text-xs ${error ? "text-red-500" : "text-gray-500 dark:text-gray-400"}`,
+      id: error ? errorId : hintId,
+      className: `mt-1.5 text-xs ${error ? "text-red-500" : "text-slate-600 dark:text-gray-400"}`,
       ...error ? { role: "alert", "aria-live": "polite" } : {},
       children: error ?? hint
     }
@@ -6670,23 +6767,32 @@ function FormInput({
   onValueChange,
   ...props
 }) {
-  return /* @__PURE__ */ jsxRuntime.jsxs("div", { children: [
-    label ? /* @__PURE__ */ jsxRuntime.jsxs("label", { className: `mb-1.5 block font-medium text-gray-500 dark:text-gray-400 ${labelClasses[inputSize]}`, children: [
+  const autoId = React11.useId();
+  const inputId = props.id ?? autoId;
+  const errorId = `${inputId}-error`;
+  const hintId = `${inputId}-hint`;
+  const describedBy = error ? errorId : hint ? hintId : void 0;
+  return /* @__PURE__ */ jsxRuntime.jsxs("div", { "data-testid": label ? `field-${label.toLowerCase().replace(/\s+/g, "-")}` : "form-field", children: [
+    label ? /* @__PURE__ */ jsxRuntime.jsxs("label", { htmlFor: inputId, className: `mb-1.5 block font-medium text-gray-500 dark:text-gray-400 ${labelClasses[inputSize]}`, children: [
       label,
       required ? /* @__PURE__ */ jsxRuntime.jsx("span", { className: "ml-0.5 text-red-500", children: "*" }) : null
     ] }) : null,
     /* @__PURE__ */ jsxRuntime.jsx("div", { className: wrapperClass(error), children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: `relative flex items-center ${sizeClasses3[inputSize]} ${className}`, children: [
-      icon ? /* @__PURE__ */ jsxRuntime.jsx("span", { className: "mr-2 text-gray-400 dark:text-gray-500", children: icon }) : null,
+      icon ? /* @__PURE__ */ jsxRuntime.jsx("span", { className: "mr-2 text-gray-400 dark:text-gray-500", "aria-hidden": "true", children: icon }) : null,
       /* @__PURE__ */ jsxRuntime.jsx(
         "input",
         {
           ...props,
-          className: "w-full bg-transparent text-gray-900 placeholder:text-gray-400 focus:outline-none dark:text-white dark:placeholder:text-gray-500",
+          id: inputId,
+          required,
+          "aria-invalid": error ? true : void 0,
+          "aria-describedby": describedBy,
+          className: "w-full bg-transparent text-gray-900 placeholder:text-slate-500 focus:outline-none dark:text-white dark:placeholder:text-gray-500",
           onChange: (event) => onValueChange?.(event.target.value)
         }
       )
     ] }) }),
-    /* @__PURE__ */ jsxRuntime.jsx(FieldMeta, { hint, error })
+    /* @__PURE__ */ jsxRuntime.jsx(FieldMeta, { hint, error, errorId, hintId })
   ] });
 }
 function FormTextarea({
@@ -6699,8 +6805,13 @@ function FormTextarea({
   onValueChange,
   ...props
 }) {
-  return /* @__PURE__ */ jsxRuntime.jsxs("div", { children: [
-    label ? /* @__PURE__ */ jsxRuntime.jsxs("label", { className: `mb-1.5 block font-medium text-gray-500 dark:text-gray-400 ${labelClasses[inputSize]}`, children: [
+  const autoId = React11.useId();
+  const inputId = props.id ?? autoId;
+  const errorId = `${inputId}-error`;
+  const hintId = `${inputId}-hint`;
+  const describedBy = error ? errorId : hint ? hintId : void 0;
+  return /* @__PURE__ */ jsxRuntime.jsxs("div", { "data-testid": label ? `field-${label.toLowerCase().replace(/\s+/g, "-")}` : "form-field", children: [
+    label ? /* @__PURE__ */ jsxRuntime.jsxs("label", { htmlFor: inputId, className: `mb-1.5 block font-medium text-gray-500 dark:text-gray-400 ${labelClasses[inputSize]}`, children: [
       label,
       required ? /* @__PURE__ */ jsxRuntime.jsx("span", { className: "ml-0.5 text-red-500", children: "*" }) : null
     ] }) : null,
@@ -6708,11 +6819,15 @@ function FormTextarea({
       "textarea",
       {
         ...props,
-        className: `w-full resize-y bg-transparent px-3.5 py-2.5 text-gray-900 placeholder:text-gray-400 focus:outline-none dark:text-white dark:placeholder:text-gray-500 ${className}`,
+        id: inputId,
+        required,
+        "aria-invalid": error ? true : void 0,
+        "aria-describedby": describedBy,
+        className: `w-full resize-y bg-transparent px-3.5 py-2.5 text-gray-900 placeholder:text-slate-500 focus:outline-none dark:text-white dark:placeholder:text-gray-500 ${className}`,
         onChange: (event) => onValueChange?.(event.target.value)
       }
     ) }),
-    /* @__PURE__ */ jsxRuntime.jsx(FieldMeta, { hint, error })
+    /* @__PURE__ */ jsxRuntime.jsx(FieldMeta, { hint, error, errorId, hintId })
   ] });
 }
 var priceSizeConfig = {
@@ -6744,9 +6859,14 @@ function FormPriceInput({
   max,
   className = ""
 }) {
+  const autoId = React11.useId();
+  const inputId = autoId;
+  const errorId = `${inputId}-error`;
+  const hintId = `${inputId}-hint`;
+  const describedBy = error ? errorId : hint ? hintId : void 0;
   const sizes3 = priceSizeConfig[priceSize ?? defaultPriceSize(inputSize)];
-  return /* @__PURE__ */ jsxRuntime.jsxs("div", { children: [
-    label ? /* @__PURE__ */ jsxRuntime.jsxs("label", { className: `mb-1.5 block font-medium text-gray-500 dark:text-gray-400 ${labelClasses[inputSize]}`, children: [
+  return /* @__PURE__ */ jsxRuntime.jsxs("div", { "data-testid": label ? `field-${label.toLowerCase().replace(/\s+/g, "-")}` : "form-field", children: [
+    label ? /* @__PURE__ */ jsxRuntime.jsxs("label", { htmlFor: inputId, className: `mb-1.5 block font-medium text-gray-500 dark:text-gray-400 ${labelClasses[inputSize]}`, children: [
       label,
       required ? /* @__PURE__ */ jsxRuntime.jsx("span", { className: "ml-0.5 text-red-500", children: "*" }) : null
     ] }) : null,
@@ -6762,19 +6882,24 @@ function FormPriceInput({
       /* @__PURE__ */ jsxRuntime.jsx(
         "input",
         {
+          id: inputId,
           type: "number",
           step,
           value,
           onChange: (event) => onValueChange?.(event.target.value),
           placeholder,
           disabled,
+          required,
           min,
           max,
-          className: `w-full bg-transparent tabular-nums ${sizes3.input} ${sizes3.padding} text-gray-900 placeholder:text-gray-400 focus:outline-none dark:text-white dark:placeholder:text-gray-500 ${colorClass ?? ""} ${className}`
+          "aria-invalid": error ? true : void 0,
+          "aria-describedby": describedBy,
+          "aria-label": label ? `${label} in ${currencySymbol}` : void 0,
+          className: `w-full bg-transparent tabular-nums ${sizes3.input} ${sizes3.padding} text-gray-900 placeholder:text-slate-500 focus:outline-none dark:text-white dark:placeholder:text-gray-500 ${colorClass ?? ""} ${className}`
         }
       )
     ] }) }),
-    /* @__PURE__ */ jsxRuntime.jsx(FieldMeta, { hint, error })
+    /* @__PURE__ */ jsxRuntime.jsx(FieldMeta, { hint, error, errorId, hintId })
   ] });
 }
 function FormSelect({
@@ -6788,8 +6913,13 @@ function FormSelect({
   options,
   ...props
 }) {
-  return /* @__PURE__ */ jsxRuntime.jsxs("div", { children: [
-    label ? /* @__PURE__ */ jsxRuntime.jsxs("label", { className: `mb-1.5 block font-medium text-gray-500 dark:text-gray-400 ${labelClasses[inputSize]}`, children: [
+  const autoId = React11.useId();
+  const inputId = props.id ?? autoId;
+  const errorId = `${inputId}-error`;
+  const hintId = `${inputId}-hint`;
+  const describedBy = error ? errorId : hint ? hintId : void 0;
+  return /* @__PURE__ */ jsxRuntime.jsxs("div", { "data-testid": label ? `field-${label.toLowerCase().replace(/\s+/g, "-")}` : "form-field", children: [
+    label ? /* @__PURE__ */ jsxRuntime.jsxs("label", { htmlFor: inputId, className: `mb-1.5 block font-medium text-gray-500 dark:text-gray-400 ${labelClasses[inputSize]}`, children: [
       label,
       required ? /* @__PURE__ */ jsxRuntime.jsx("span", { className: "ml-0.5 text-red-500", children: "*" }) : null
     ] }) : null,
@@ -6797,12 +6927,16 @@ function FormSelect({
       "select",
       {
         ...props,
+        id: inputId,
+        required,
+        "aria-invalid": error ? true : void 0,
+        "aria-describedby": describedBy,
         className: `w-full bg-transparent ${sizeClasses3[inputSize]} text-gray-900 focus:outline-none dark:text-white ${className}`,
         onChange: (event) => onValueChange?.(event.target.value),
         children: options.map((option) => /* @__PURE__ */ jsxRuntime.jsx("option", { value: option.value, children: option.label }, option.value))
       }
     ) }),
-    /* @__PURE__ */ jsxRuntime.jsx(FieldMeta, { hint, error })
+    /* @__PURE__ */ jsxRuntime.jsx(FieldMeta, { hint, error, errorId, hintId })
   ] });
 }
 var Form = React11__namespace.default.forwardRef(
@@ -6984,7 +7118,7 @@ function BaseForm({
           color: "ios-glass-blue",
           disabled: isLoading || submitDisabled,
           children: [
-            isLoading && /* @__PURE__ */ jsxRuntime.jsx("span", { className: "h-4 w-4 animate-spin rounded-full border-2 border-white border-t-transparent" }),
+            isLoading && /* @__PURE__ */ jsxRuntime.jsx("span", { className: "h-4 w-4 animate-spin motion-reduce:animate-none rounded-full border-2 border-white border-t-transparent" }),
             submitLabel
           ]
         }
@@ -7305,7 +7439,7 @@ function StepNavigationButtons({
         onClick: onContinue,
         className: `${CONTINUE_BUTTON_CLASSES}${!onBack ? " w-full" : ""}`,
         children: isLoading && showSpinner ? /* @__PURE__ */ jsxRuntime.jsxs("span", { className: "flex items-center justify-center gap-2", children: [
-          /* @__PURE__ */ jsxRuntime.jsx("span", { className: "h-4 w-4 animate-spin rounded-full border-2 border-white border-t-transparent" }),
+          /* @__PURE__ */ jsxRuntime.jsx("span", { className: "h-4 w-4 animate-spin motion-reduce:animate-none rounded-full border-2 border-white border-t-transparent" }),
           displayLabel
         ] }) : displayLabel
       }
@@ -7336,7 +7470,7 @@ function SearchFilterToolbar({
     label
   };
   return /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
-    /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center gap-3", children: [
+    /* @__PURE__ */ jsxRuntime.jsxs("div", { role: "search", "data-testid": "search-toolbar", className: "flex items-center gap-3", children: [
       /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "liquid-surface flex flex-1 items-center gap-2 flex-wrap min-h-12 rounded-xl px-3.5 py-1.5 transition-colors duration-200 focus-within:ring-2 focus-within:ring-offset-2 focus-within:ring-blue-500 dark:focus-within:ring-offset-gray-900", children: [
         /* @__PURE__ */ jsxRuntime.jsx(HeroIcons.MagnifyingGlassIcon, { className: "h-5 w-5 shrink-0 text-slate-400 dark:text-slate-500" }),
         filterPills,
@@ -7347,7 +7481,9 @@ function SearchFilterToolbar({
             value: query,
             onChange: (event) => onQueryChange(event.target.value),
             placeholder,
-            className: "min-w-[100px] flex-1 bg-transparent py-1 text-base text-gray-900 outline-none placeholder:text-slate-400 dark:text-white dark:placeholder:text-slate-500"
+            "aria-label": label,
+            "data-testid": "search-input",
+            className: "min-w-[100px] flex-1 bg-transparent py-1 text-base text-gray-900 outline-none focus-visible:ring-2 focus-visible:ring-blue-500 placeholder:text-slate-400 dark:text-white dark:placeholder:text-slate-500"
           }
         )
       ] }),
@@ -7435,6 +7571,12 @@ function SearchFilterToolbar({
 function isPlainTextTitle(title) {
   return typeof title === "string" || typeof title === "number";
 }
+function getTestIdFromTitle(title) {
+  if (isPlainTextTitle(title)) {
+    return `entity-card-${String(title).toLowerCase().replace(/\s+/g, "-")}`;
+  }
+  return "entity-card";
+}
 function StatusBadgeInternal({ status }) {
   const tCommon = nextIntl.useTranslations("common");
   if (typeof status !== "boolean") {
@@ -7461,9 +7603,24 @@ function EntityCard({
   dragProps
 }) {
   const isInteractive = Boolean(onClick);
+  const plainTextTitle = isPlainTextTitle(title) ? String(title) : void 0;
+  const handleKeyDown = React11.useCallback(
+    (event) => {
+      if (onClick && (event.key === "Enter" || event.key === " ")) {
+        event.preventDefault();
+        onClick();
+      }
+    },
+    [onClick]
+  );
   return /* @__PURE__ */ jsxRuntime.jsxs(
     Card,
     {
+      role: isInteractive ? "article" : "listitem",
+      "aria-label": isInteractive ? plainTextTitle : void 0,
+      "data-testid": getTestIdFromTitle(title),
+      tabIndex: isInteractive ? 0 : void 0,
+      onKeyDown: isInteractive ? handleKeyDown : void 0,
       className: `group overflow-hidden transition-all duration-200 hover:-translate-y-0.5 hover:shadow-md ${isInteractive ? "cursor-pointer" : ""} ${className}`,
       onPress: onClick,
       pressable: isInteractive,
@@ -7472,21 +7629,21 @@ function EntityCard({
         accentGradient && /* @__PURE__ */ jsxRuntime.jsx("div", { className: `h-1.5 w-full bg-gradient-to-r ${accentGradient}` }),
         /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "p-4", children: [
           /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-start justify-between gap-3", children: [
-            /* @__PURE__ */ jsxRuntime.jsx(
+            /* @__PURE__ */ jsxRuntime.jsx("div", { "data-testid": "entity-card-title", children: /* @__PURE__ */ jsxRuntime.jsx(
               ItemSummary,
               {
                 icon,
                 title,
-                subtitle,
+                subtitle: subtitle ? /* @__PURE__ */ jsxRuntime.jsx("span", { "data-testid": "entity-card-subtitle", children: subtitle }) : void 0,
                 iconContainerClassName: "shrink-0",
                 titleClassName: isPlainTextTitle(title) ? "truncate font-semibold text-slate-900 dark:text-white" : "font-semibold text-slate-900 dark:text-white",
                 subtitleClassName: "mt-0.5 text-xs text-slate-500 dark:text-slate-400"
               }
-            ),
+            ) }),
             status !== void 0 && /* @__PURE__ */ jsxRuntime.jsx(StatusBadgeInternal, { status })
           ] }),
           children && /* @__PURE__ */ jsxRuntime.jsx("div", { className: "mt-3", children }),
-          footer && /* @__PURE__ */ jsxRuntime.jsx("div", { className: "mt-3 border-t border-white/30 pt-3 dark:border-white/10 flex gap-2 justify-end opacity-0 transition-opacity duration-200 group-hover:opacity-100", children: footer })
+          footer && /* @__PURE__ */ jsxRuntime.jsx("div", { className: "mt-3 border-t border-white/30 pt-3 dark:border-white/10 flex gap-2 justify-end opacity-0 transition-opacity duration-200 group-hover:opacity-100 group-focus-within:opacity-100", children: footer })
         ] })
       ]
     }
@@ -7635,6 +7792,10 @@ function FilterTileButton({
     {
       type: "button",
       onClick,
+      role: "checkbox",
+      "aria-checked": isActive,
+      "aria-label": label,
+      "data-testid": `filter-tile-${label.toLowerCase().replace(/\s+/g, "-")}`,
       className: `relative overflow-hidden rounded-2xl p-4 text-left transition-all duration-200 focus:outline-none focus-visible:ring-2 focus-visible:ring-offset-2 ${tokens.focusRing} dark:ring-offset-gray-900 ${isActive ? tokens.activeGradient : INACTIVE_CLASSES}`,
       children: [
         /* @__PURE__ */ jsxRuntime.jsx(
@@ -8073,8 +8234,8 @@ function AnalysisSkeleton() {
 }
 
 // src/components/skeletons/shimmer.tsx
-var shimmerClass = "bg-gradient-to-r from-gray-200 via-gray-100 to-gray-200 dark:from-gray-700 dark:via-gray-600 dark:to-gray-700 animate-shimmer bg-[length:200%_100%]";
-var shimmerWhiteClass = "bg-white/20 animate-pulse";
+var shimmerClass = "bg-gradient-to-r from-gray-200 via-gray-100 to-gray-200 dark:from-gray-700 dark:via-gray-600 dark:to-gray-700 animate-shimmer motion-reduce:animate-none bg-[length:200%_100%]";
+var shimmerWhiteClass = "bg-white/20 animate-pulse motion-reduce:animate-none";
 function SectionHeaderSkeleton() {
   return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center gap-3", children: [
     /* @__PURE__ */ jsxRuntime.jsx("div", { className: `h-10 w-10 rounded-lg ${shimmerClass}` }),
@@ -8669,6 +8830,7 @@ function Badge({ color = "zinc", className, ...props }) {
   return /* @__PURE__ */ jsxRuntime.jsx(
     "span",
     {
+      "data-testid": "badge",
       ...props,
       className: clsx__default.default(
         className,
@@ -8883,14 +9045,14 @@ function DynamicIslandConfirm({
       chunkUZ3CMNUJ_js.triggerHaptic("warning");
     }
   }, [open]);
-  return /* @__PURE__ */ jsxRuntime.jsxs(Headless6.Dialog, { open, onClose, className: "relative z-[120]", children: [
+  return /* @__PURE__ */ jsxRuntime.jsxs(Headless6.Dialog, { open, onClose, className: "relative z-[120]", "aria-labelledby": "dynamic-island-title", children: [
     /* @__PURE__ */ jsxRuntime.jsx("div", { className: "fixed inset-0 bg-black/10 backdrop-blur-[2px]" }),
     /* @__PURE__ */ jsxRuntime.jsx("div", { className: "fixed inset-0 flex items-start justify-center pt-3 px-4", children: /* @__PURE__ */ jsxRuntime.jsxs(Headless6.DialogPanel, { className: "w-full max-w-sm rounded-[28px] bg-black/95 p-3 text-white shadow-2xl", children: [
       /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center gap-3 px-2 py-1", children: [
         /* @__PURE__ */ jsxRuntime.jsx("div", { className: `h-9 w-9 shrink-0 rounded-xl ${iconBackground} flex items-center justify-center`, children: icon ?? /* @__PURE__ */ jsxRuntime.jsx(HeroIcons.TrashIcon, { className: "h-5 w-5 text-white" }) }),
         /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "min-w-0", children: [
-          /* @__PURE__ */ jsxRuntime.jsx("p", { className: "text-[11px] uppercase tracking-wide text-gray-400", children: appName }),
-          /* @__PURE__ */ jsxRuntime.jsx("p", { className: "text-sm font-semibold", children: title })
+          /* @__PURE__ */ jsxRuntime.jsx("p", { className: "text-[11px] uppercase tracking-wide text-gray-500", children: appName }),
+          /* @__PURE__ */ jsxRuntime.jsx("p", { id: "dynamic-island-title", className: "text-sm font-semibold", children: title })
         ] })
       ] }),
       /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "mt-2 grid grid-cols-2 gap-2", children: [
@@ -8899,7 +9061,7 @@ function DynamicIslandConfirm({
           {
             type: "button",
             onClick: onClose,
-            className: "rounded-xl bg-white/10 px-3 py-2 text-sm font-medium hover:bg-white/15",
+            className: "rounded-xl bg-white/10 px-3 py-3 text-sm font-medium hover:bg-white/15 focus-visible:ring-2 focus-visible:ring-white/70",
             children: resolvedCancelLabel
           }
         ),
@@ -8908,7 +9070,7 @@ function DynamicIslandConfirm({
           {
             type: "button",
             onClick: onConfirm,
-            className: "rounded-xl bg-ios-red px-3 py-2 text-sm font-semibold text-white hover:bg-ios-red-hover",
+            className: "rounded-xl bg-ios-red px-3 py-3 text-sm font-semibold text-white hover:bg-ios-red-hover focus-visible:ring-2 focus-visible:ring-white/70",
             children: resolvedConfirmLabel
           }
         )
@@ -9460,66 +9622,80 @@ var ACCENT_MAP = {
 function PageEmptyState({ title, message, iconName }) {
   const Icon = ICON_MAP[iconName] || FallbackIcon;
   const accent = ACCENT_MAP[iconName] || ACCENT_MAP["folder-open"];
-  return /* @__PURE__ */ jsxRuntime.jsx("div", { className: "flex items-center justify-center py-20", children: /* @__PURE__ */ jsxRuntime.jsxs(
-    framerMotion.motion.div,
+  const prefersReducedMotion2 = framerMotion.useReducedMotion();
+  const noMotion = { opacity: 1, scale: 1, y: 0 };
+  const noTransition = { duration: 0 };
+  return /* @__PURE__ */ jsxRuntime.jsx(
+    "div",
     {
-      initial: { opacity: 0, scale: 0.95 },
-      animate: { opacity: 1, scale: 1 },
-      transition: springPresets.gentle,
-      className: "liquid-surface w-full max-w-lg rounded-2xl px-8 py-14 text-center",
-      children: [
-        /* @__PURE__ */ jsxRuntime.jsx(
-          framerMotion.motion.div,
-          {
-            initial: { scale: 0.6, opacity: 0 },
-            animate: { scale: 1, opacity: 1 },
-            transition: springPresets.bouncy,
-            className: "mx-auto mb-6",
-            children: /* @__PURE__ */ jsxRuntime.jsx("div", { className: `inline-flex h-20 w-20 items-center justify-center rounded-full backdrop-blur-md border ${accent.container}`, children: /* @__PURE__ */ jsxRuntime.jsx(Icon, { className: `h-10 w-10 ${accent.icon}` }) })
-          }
-        ),
-        /* @__PURE__ */ jsxRuntime.jsx(
-          framerMotion.motion.h3,
-          {
-            initial: { y: 12, opacity: 0 },
-            animate: { y: 0, opacity: 1 },
-            transition: { ...springPresets.default, delay: 0.1 },
-            className: "text-xl font-semibold text-gray-900 dark:text-white",
-            children: title
-          }
-        ),
-        /* @__PURE__ */ jsxRuntime.jsx(
-          framerMotion.motion.p,
-          {
-            initial: { y: 12, opacity: 0 },
-            animate: { y: 0, opacity: 1 },
-            transition: { ...springPresets.default, delay: 0.15 },
-            className: "mt-3 text-sm text-gray-500 dark:text-gray-400 max-w-sm mx-auto leading-relaxed",
-            children: message
-          }
-        ),
-        /* @__PURE__ */ jsxRuntime.jsx(
-          framerMotion.motion.div,
-          {
-            initial: { opacity: 0 },
-            animate: { opacity: 1 },
-            transition: { delay: 0.3 },
-            className: "mt-8 flex items-center justify-center gap-1.5",
-            children: [0, 1, 2].map((i) => /* @__PURE__ */ jsxRuntime.jsx(
+      role: "region",
+      "aria-label": title,
+      "data-testid": "empty-state",
+      className: "flex items-center justify-center py-20",
+      children: /* @__PURE__ */ jsxRuntime.jsxs(
+        framerMotion.motion.div,
+        {
+          initial: prefersReducedMotion2 ? false : { opacity: 0, scale: 0.95 },
+          animate: prefersReducedMotion2 ? noMotion : { opacity: 1, scale: 1 },
+          transition: prefersReducedMotion2 ? noTransition : springPresets.gentle,
+          className: "liquid-surface w-full max-w-lg rounded-2xl px-8 py-14 text-center",
+          children: [
+            /* @__PURE__ */ jsxRuntime.jsx(
               framerMotion.motion.div,
               {
-                initial: { scale: 0 },
-                animate: { scale: 1 },
-                transition: { ...springPresets.bouncy, delay: 0.35 + i * 0.08 },
-                className: "h-1.5 w-1.5 rounded-full bg-gray-300 dark:bg-gray-600"
-              },
-              i
-            ))
-          }
-        )
-      ]
+                initial: prefersReducedMotion2 ? false : { scale: 0.6, opacity: 0 },
+                animate: prefersReducedMotion2 ? noMotion : { scale: 1, opacity: 1 },
+                transition: prefersReducedMotion2 ? noTransition : springPresets.bouncy,
+                className: "mx-auto mb-6",
+                children: /* @__PURE__ */ jsxRuntime.jsx("div", { className: `inline-flex h-20 w-20 items-center justify-center rounded-full backdrop-blur-md border ${accent.container}`, children: /* @__PURE__ */ jsxRuntime.jsx(Icon, { className: `h-10 w-10 ${accent.icon}` }) })
+              }
+            ),
+            /* @__PURE__ */ jsxRuntime.jsx(
+              framerMotion.motion.h3,
+              {
+                "data-testid": "empty-state-title",
+                initial: prefersReducedMotion2 ? false : { y: 12, opacity: 0 },
+                animate: prefersReducedMotion2 ? noMotion : { y: 0, opacity: 1 },
+                transition: prefersReducedMotion2 ? noTransition : { ...springPresets.default, delay: 0.1 },
+                className: "text-xl font-semibold text-gray-900 dark:text-white",
+                children: title
+              }
+            ),
+            /* @__PURE__ */ jsxRuntime.jsx(
+              framerMotion.motion.p,
+              {
+                "data-testid": "empty-state-message",
+                initial: prefersReducedMotion2 ? false : { y: 12, opacity: 0 },
+                animate: prefersReducedMotion2 ? noMotion : { y: 0, opacity: 1 },
+                transition: prefersReducedMotion2 ? noTransition : { ...springPresets.default, delay: 0.15 },
+                className: "mt-3 text-sm text-gray-500 dark:text-gray-400 max-w-sm mx-auto leading-relaxed",
+                children: message
+              }
+            ),
+            /* @__PURE__ */ jsxRuntime.jsx(
+              framerMotion.motion.div,
+              {
+                initial: prefersReducedMotion2 ? false : { opacity: 0 },
+                animate: prefersReducedMotion2 ? noMotion : { opacity: 1 },
+                transition: prefersReducedMotion2 ? noTransition : { delay: 0.3 },
+                className: "mt-8 flex items-center justify-center gap-1.5",
+                children: [0, 1, 2].map((i) => /* @__PURE__ */ jsxRuntime.jsx(
+                  framerMotion.motion.div,
+                  {
+                    initial: prefersReducedMotion2 ? false : { scale: 0 },
+                    animate: prefersReducedMotion2 ? noMotion : { scale: 1 },
+                    transition: prefersReducedMotion2 ? noTransition : { ...springPresets.bouncy, delay: 0.35 + i * 0.08 },
+                    className: "h-1.5 w-1.5 rounded-full bg-gray-300 dark:bg-gray-600"
+                  },
+                  i
+                ))
+              }
+            )
+          ]
+        }
+      )
     }
-  ) });
+  );
 }
 var WINDSOCK_LOADER = { gradient: "from-emerald-500 to-teal-600", accentRing: "ring-emerald-500/30" };
 var FUEL_PRICE_LOADER = { gradient: "from-blue-500 to-indigo-600", accentRing: "ring-blue-500/30" };
@@ -9548,7 +9724,7 @@ function BrandedLoader({
             "div",
             {
               className: clsx__default.default(
-                "absolute -inset-3 animate-ping rounded-3xl opacity-20",
+                "absolute -inset-3 animate-ping motion-reduce:animate-none rounded-3xl opacity-20",
                 `bg-gradient-to-br ${gradient}`
               ),
               style: { animationDuration: "2s" }
@@ -9560,7 +9736,7 @@ function BrandedLoader({
               className: clsx__default.default(
                 "absolute -inset-1.5 rounded-[22px] ring-2",
                 accentRing,
-                "animate-pulse"
+                "animate-pulse motion-reduce:animate-none"
               ),
               style: { animationDuration: "1.5s" }
             }
@@ -9597,7 +9773,7 @@ function BrandedLoader({
               className: clsx__default.default(
                 "h-1.5 w-1.5 rounded-full",
                 `bg-gradient-to-br ${gradient}`,
-                "animate-bounce"
+                "animate-bounce motion-reduce:animate-none"
               ),
               style: { animationDelay: `${i * 150}ms`, animationDuration: "0.8s" }
             },
@@ -9612,7 +9788,7 @@ function BrandedLoader({
               className: clsx__default.default(
                 "h-2 w-2 rounded-full",
                 `bg-gradient-to-br ${gradient}`,
-                "animate-bounce"
+                "animate-bounce motion-reduce:animate-none"
               ),
               style: { animationDelay: `${i * 150}ms`, animationDuration: "0.8s" }
             },
@@ -11159,7 +11335,7 @@ function NotificationBadge({ count, className = "" }) {
   return /* @__PURE__ */ jsxRuntime.jsx(
     "span",
     {
-      className: `absolute -top-1 -right-1 flex items-center justify-center min-w-[18px] h-[18px] px-1 text-[10px] font-bold text-white bg-red-500 rounded-full ring-2 ring-white dark:ring-gray-800 ${count > 0 ? "animate-pulse" : ""} ${className}`,
+      className: `absolute -top-1 -right-1 flex items-center justify-center min-w-[18px] h-[18px] px-1 text-[10px] font-bold text-white bg-red-500 rounded-full ring-2 ring-white dark:ring-gray-800 ${count > 0 ? "animate-pulse motion-reduce:animate-none" : ""} ${className}`,
       children: displayCount
     }
   );
@@ -12389,11 +12565,15 @@ function FilterPill({ icon, label, variant, onRemove }) {
     {
       type: "button",
       onClick: onRemove,
+      role: "option",
+      "aria-selected": true,
+      "aria-label": typeof label === "string" ? label : void 0,
+      "data-testid": "filter-pill",
       className: `liquid-pill liquid-pill-${variant}`,
       children: [
         icon,
         label,
-        /* @__PURE__ */ jsxRuntime.jsx(HeroIcons.XMarkIcon, { className: "liquid-pill-dismiss" })
+        /* @__PURE__ */ jsxRuntime.jsx(HeroIcons.XMarkIcon, { className: "liquid-pill-dismiss", "data-testid": "filter-pill-remove" })
       ]
     }
   );
@@ -12658,7 +12838,7 @@ function DataPagination({
           value: params?.limit ?? effectivePageSize,
           onChange: (event) => handlePageSizeChange(event.target.value),
           disabled: loading,
-          className: "rounded-xl liquid-surface px-2 py-1.5 text-xs font-medium text-slate-700 outline-none dark:text-slate-300",
+          className: "rounded-xl liquid-surface px-2 py-1.5 text-xs font-medium text-slate-700 outline-none focus-visible:ring-2 focus-visible:ring-blue-500 dark:text-slate-300",
           children: pageSizeOptions.map((size) => /* @__PURE__ */ jsxRuntime.jsx("option", { value: size, children: size }, size))
         }
       ),
@@ -12677,7 +12857,7 @@ function DataPagination({
           (page, index) => page === "..." ? /* @__PURE__ */ jsxRuntime.jsx(
             "span",
             {
-              className: "inline-flex h-9 w-6 items-center justify-center text-xs text-slate-400",
+              className: "inline-flex h-9 w-6 items-center justify-center text-xs text-slate-500",
               children: "\u2026"
             },
             `ellipsis-${index}`
@@ -13877,6 +14057,20 @@ function PlatformShell({
     extras
   ] });
 }
+function SkipToContent({
+  targetId = "main-content",
+  label = "Skip to main content"
+}) {
+  return /* @__PURE__ */ jsxRuntime.jsx(
+    "a",
+    {
+      href: `#${targetId}`,
+      className: "sr-only focus:not-sr-only focus:fixed focus:top-4 focus:left-4 focus:z-[9999] focus:rounded-lg focus:bg-white focus:px-4 focus:py-2 focus:text-sm focus:font-semibold focus:text-indigo-600 focus:shadow-lg focus:ring-2 focus:ring-indigo-500 focus:outline-none dark:focus:bg-gray-800 dark:focus:text-indigo-400",
+      "data-testid": "skip-to-content",
+      children: label
+    }
+  );
+}
 
 Object.defineProperty(exports, "LOCALE_FLAGS", {
   enumerable: true,
@@ -14096,6 +14290,7 @@ exports.ServerErrorPage = ServerErrorPage;
 exports.SettingsDialog = SettingsDialog;
 exports.SettingsModal = SettingsModal;
 exports.Sheet = Sheet;
+exports.SkipToContent = SkipToContent;
 exports.SocialLoginButtons = SocialLoginButtons;
 exports.SortableTableHeader = SortableTableHeader;
 exports.Spinner = Spinner;
@@ -14216,5 +14411,5 @@ exports.useGeoMapState = useGeoMapState;
 exports.useNotifications = useNotifications;
 exports.usePlatformShellStore = usePlatformShellStore;
 exports.usePullToRefresh = usePullToRefresh;
-//# sourceMappingURL=chunk-5IE2FIWT.js.map
-//# sourceMappingURL=chunk-5IE2FIWT.js.map
+//# sourceMappingURL=chunk-WXI7OCNY.js.map
+//# sourceMappingURL=chunk-WXI7OCNY.js.map