diff --git a/app/dynamic-pay-button/DynamicPayButton.tsx b/app/dynamic-pay-button/DynamicPayButton.tsx
index 69db368..41211c5 100644
--- a/app/dynamic-pay-button/DynamicPayButton.tsx
+++ b/app/dynamic-pay-button/DynamicPayButton.tsx
@@ -72,9 +72,9 @@ export const DynamicPayButton = () => {
           'has-[:focus-visible]:outline-black/30 dark:has-[:focus-visible]:outline-white/20':
             !open,
           'overflow-visible': overflow,
-          'pointer-events-none': loading,
         },
       )}
+      inert={loading ? '' : undefined}
       onAnimationComplete={variant => {
         variant === 'open' && inputRef.current?.focus({ preventScroll: true });
         variant === 'closed' &&
diff --git a/app/dynamic-pay-button/PayButton.tsx b/app/dynamic-pay-button/PayButton.tsx
index db19a16..76a1737 100644
--- a/app/dynamic-pay-button/PayButton.tsx
+++ b/app/dynamic-pay-button/PayButton.tsx
@@ -32,7 +32,6 @@ export const PayButton = ({ className }: PayButtonProps) => {
         },
         className,
       )}
-      disabled={success || loading}
       onClick={handleLoading}
     >
       <AnimateDimension
diff --git a/app/dynamic-pay-button/TabContent.tsx b/app/dynamic-pay-button/TabContent.tsx
index 7d982ac..f484f7e 100644
--- a/app/dynamic-pay-button/TabContent.tsx
+++ b/app/dynamic-pay-button/TabContent.tsx
@@ -73,7 +73,6 @@ const TabContentCard = () => {
                   success,
               },
             )}
-            disabled={success || loading}
             maxLength={3}
             onChange={e => setCcv(e.target.value)}
             pattern="\d*"
diff --git a/types/types.d.ts b/types/types.d.ts
index f85dddb..fea866b 100644
--- a/types/types.d.ts
+++ b/types/types.d.ts
@@ -1,2 +1,8 @@
 declare module 'tailwindcss/lib/util/flattenColorPalette';
 declare module 'tailwindcss/lib/util/color';
+
+declare namespace React {
+  interface HTMLAttributes {
+    inert?: '';
+  }
+}