fix: improve RTL support for Arabic text input and placeholders

Co-Authored-By: Johannes <johannes@formbricks.com>

apps/web/modules/ui/components/input/index.tsx

@@ -19,6 +19,7 @@ const Input = React.forwardRef<HTMLInputElement, InputProps>(({ className, isInv
         isInvalid && "border border-red-500 focus:border-red-500"
       )}
       ref={ref}
+      dir="auto"
       {...props}
     />
   );

apps/web/modules/ui/components/preview-survey/index.tsx

@@ -289,7 +289,7 @@ export const PreviewSurvey = ({
                       <ClientLogo environmentId={environment.id} projectLogo={project.logo} previewSurvey />
                     )}
                   </div>
-                  <div className="z-10 w-full max-w-md rounded-lg border border-transparent" dir="auto">
+                  <div className="z-10 w-full max-w-md rounded-lg border border-transparent">
                     <SurveyInline
                       isPreviewMode={true}
                       survey={{ ...survey, type: "link" }}
@@ -397,7 +397,7 @@ export const PreviewSurvey = ({
                     <ClientLogo environmentId={environment.id} projectLogo={project.logo} previewSurvey />
                   )}
                 </div>
-                <div className="z-0 w-full max-w-4xl rounded-lg border-transparent" dir="auto">
+                <div className="z-0 w-full max-w-4xl rounded-lg border-transparent">
                   <SurveyInline
                     isPreviewMode={true}
                     survey={{ ...survey, type: "link" }}

apps/web/modules/ui/components/survey/index.tsx

@@ -72,5 +72,5 @@ export const SurveyInline = (props: Omit<SurveyContainerProps, "containerId">) =
     }
   }, [isScriptLoaded, renderInline]);
 
-  return <div id={containerId} className="h-full w-full" />;
+  return <div id={containerId} className="h-full w-full" dir="auto" />;
 };