diff --git a/src/components/layout/mobile/more-sheet.tsx b/src/components/layout/mobile/more-sheet.tsx
index 45debe8..5dc5db4 100644
--- a/src/components/layout/mobile/more-sheet.tsx
+++ b/src/components/layout/mobile/more-sheet.tsx
@@ -65,7 +65,7 @@ export function MoreSheet({
More
-
+
{MORE_ITEMS.map((item) => {
const Icon = item.icon;
return (
@@ -74,9 +74,12 @@ export function MoreSheet({
-
+
{item.label}
diff --git a/src/components/ui/dialog.tsx b/src/components/ui/dialog.tsx
index 18864f4..9f079d6 100644
--- a/src/components/ui/dialog.tsx
+++ b/src/components/ui/dialog.tsx
@@ -43,7 +43,12 @@ const DialogContent = React.forwardRef<
// individually so tailwind-merge doesn't collapse our centering classes.
// (Don't use `inset-0` + `sm:inset-auto` here - twMerge sees that as a
// conflict and silently strips `sm:left-[50%]` / `sm:top-[50%]`.)
- 'fixed top-0 right-0 bottom-0 left-0 z-50 grid w-full gap-4 border-0 bg-background p-6 shadow-lg duration-200',
+ // Padding: tighter on mobile (16px) so multi-field forms keep useful
+ // working width on a 390px iPhone; original 24px restored at sm+.
+ // Long forms get an internal scroll cap so the close button + footer
+ // stay reachable without scrolling the whole page.
+ 'fixed top-0 right-0 bottom-0 left-0 z-50 grid w-full gap-4 border-0 bg-background p-4 shadow-lg duration-200 sm:p-6',
+ 'max-h-[100dvh] overflow-y-auto sm:max-h-[calc(100dvh-2rem)]',
'data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0',
'sm:top-[50%] sm:right-auto sm:bottom-auto sm:left-[50%] sm:max-w-lg sm:translate-x-[-50%] sm:translate-y-[-50%] sm:border sm:rounded-lg',
'sm:data-[state=closed]:zoom-out-95 sm:data-[state=open]:zoom-in-95 sm:data-[state=closed]:slide-out-to-left-1/2 sm:data-[state=closed]:slide-out-to-top-[48%] sm:data-[state=open]:slide-in-from-left-1/2 sm:data-[state=open]:slide-in-from-top-[48%]',
diff --git a/src/components/ui/input.tsx b/src/components/ui/input.tsx
index 2b54981..97898b1 100644
--- a/src/components/ui/input.tsx
+++ b/src/components/ui/input.tsx
@@ -3,10 +3,17 @@ import * as React from 'react';
import { cn } from '@/lib/utils';
const Input = React.forwardRef>(
- ({ className, type, ...props }, ref) => {
+ ({ className, type, inputMode, ...props }, ref) => {
+ // Default `type=number` to a numeric keyboard on mobile when the caller
+ // didn't explicitly override `inputMode`. Without this, iOS shows the
+ // full QWERTY keyboard for prices/dimensions/etc. — common audit gripe.
+ // `decimal` covers both whole numbers and decimals; if the caller wants
+ // strict integer input they pass `inputMode="numeric"` explicitly.
+ const resolvedInputMode = inputMode ?? (type === 'number' ? 'decimal' : undefined);
return (