fix: resolve dialog scrolling overlap by transition to flex layout and native overflow-y-auto

shop/components/admin/create-product-dialog.tsx

@@ -135,9 +135,8 @@ export function CreateProductDialog({ children, categories, product }: { childre
         </DialogHeader>
 
         <Form {...form}>
-          <form onSubmit={form.handleSubmit(onSubmit)} className="space-y-6 flex flex-col">
-            <ScrollArea className="pr-4" style={{ maxHeight: 'calc(90vh - 220px)' }}>
-              <div className="space-y-6 py-4">
+          <form onSubmit={form.handleSubmit(onSubmit)} className="flex flex-col gap-4 overflow-hidden flex-1 min-h-0">
+            <div className="flex-1 overflow-y-auto pr-4 space-y-6 py-4 min-h-0">
                 <div className="grid grid-cols-2 gap-4">
                   <FormField
                     control={form.control}
@@ -473,7 +472,6 @@ export function CreateProductDialog({ children, categories, product }: { childre
                   )}
                 </div>
             </div>
-            </ScrollArea>
 
             <DialogFooter className="pt-4 border-t border-slate-200 dark:border-white/10">
               <Button type="button" variant="ghost" onClick={() => setOpen(false)} className="text-slate-500 hover:text-slate-900 dark:text-slate-400 dark:hover:text-white">Abbrechen</Button>