TF-4004 Apply new design for create rule view on web

lib/features/base/widget/default_field/default_input_field_widget.dart

@@ -9,6 +9,8 @@ typedef OnTextChange = void Function(String text);
 class DefaultInputFieldWidget extends StatelessWidget {
   final TextEditingController textEditingController;
   final String? hintText;
+  final String? errorText;
+  final Color? inputColor;
   final FocusNode? focusNode;
   final OnTextChange? onTextChange;
   final OnTextSubmitted? onTextSubmitted;
@@ -17,7 +19,9 @@ class DefaultInputFieldWidget extends StatelessWidget {
     super.key,
     required this.textEditingController,
     this.hintText,
+    this.errorText,
     this.focusNode,
+    this.inputColor,
     this.onTextChange,
     this.onTextSubmitted,
   });
@@ -29,16 +33,22 @@ class DefaultInputFieldWidget extends StatelessWidget {
       maxLines: 1,
       textInputAction: TextInputAction.next,
       textStyle: ThemeUtils.textStyleBodyBody3(
-        color: AppColor.m3SurfaceBackground,
+        color: inputColor ?? AppColor.m3SurfaceBackground,
       ),
       focusNode: focusNode,
       onTextSubmitted: onTextSubmitted,
       onTextChange: onTextChange,
       decoration: InputDecoration(
-        constraints: const BoxConstraints(maxHeight: 40),
+        constraints: BoxConstraints(
+          maxHeight: errorText?.isNotEmpty == true ? 60 : 40,
+        ),
         filled: true,
-        fillColor: Colors.white,
-        contentPadding: const EdgeInsetsDirectional.only(start: 12, end: 8),
+        fillColor: errorText?.isNotEmpty == true
+            ? AppColor.colorInputBackgroundErrorVerifyName
+            : Colors.white,
+        contentPadding: errorText?.isNotEmpty == true
+          ? const EdgeInsetsDirectional.only(start: 12, end: 8)
+          : const EdgeInsetsDirectional.only(start: 12, end: 8, top: 12, bottom: 12),
         enabledBorder: const OutlineInputBorder(
           borderRadius: BorderRadius.all(Radius.circular(10)),
           borderSide: BorderSide(width: 1, color: AppColor.m3Neutral90),
@@ -51,8 +61,18 @@ class DefaultInputFieldWidget extends StatelessWidget {
           borderRadius: BorderRadius.all(Radius.circular(10)),
           borderSide: BorderSide(width: 1, color: AppColor.primaryColor),
         ),
+        errorBorder: const OutlineInputBorder(
+          borderRadius: BorderRadius.all(Radius.circular(10)),
+          borderSide: BorderSide(width: 1, color: AppColor.redFF3347),
+        ),
+        focusedErrorBorder: const OutlineInputBorder(
+          borderRadius: BorderRadius.all(Radius.circular(10)),
+          borderSide: BorderSide(width: 1, color: AppColor.redFF3347),
+        ),
         hintText: hintText,
         hintStyle: ThemeUtils.textStyleBodyBody3(color: AppColor.m3Tertiary),
+        errorText: errorText,
+        errorStyle: ThemeUtils.textStyleBodyBody3(color: AppColor.redFF3347),
       ),
     );
   }