feat: layout padding and scroll added

src/features/authentication/components/UserCompletionForm/PasswordValidation.tsx

@@ -0,0 +1,39 @@
+import { Box, Typography } from '@mui/material';
+import { TickCircle } from 'iconsax-react';
+import { Icon } from '@rkheftan/harmony-ui';
+import { type ValidationItemProps } from '../../types/settingForm';
+
+export function PasswordValidationItem({
+  isValid,
+  label,
+}: ValidationItemProps) {
+  return (
+    <Box
+      sx={{
+        display: 'flex',
+        alignItems: 'center',
+        gap: 1,
+        mb: 0.5,
+        flexWrap: 'wrap',
+      }}
+    >
+      <Icon
+        Component={TickCircle}
+        size="small"
+        color={isValid ? 'success.main' : 'primary.main'}
+        variant={isValid ? 'Bold' : 'Outline'}
+      />
+
+      <Typography
+        variant="body2"
+        color="text.primary"
+        sx={{
+          wordBreak: 'break-word',
+          flex: 1,
+        }}
+      >
+        {label}
+      </Typography>
+    </Box>
+  );
+}