refactor(forms): update placeholders for improved clarity and user guidance

- Made the placeholder in InputGroup optional for better flexibility.
- Updated various form components (CreateCompany, CreateCustomer, CreateNotification, CreateCompanyCategory) to provide more descriptive placeholders, enhancing user understanding of expected input.
- Ensured consistency in placeholder text across different fields to improve overall user experience.

src/components/forms/notifications/CreateNotification.tsx

@@ -39,7 +39,7 @@ const CreateNotificationForm = () => {
             name="title"
             label="Title"
             type="text"
-            placeholder="Enter title"
+            placeholder="Short headline shown to recipients"
           />
           {errors.title && (
             <p className="mt-1 text-sm text-red-500">{errors.title.message}</p>
@@ -52,7 +52,6 @@ const CreateNotificationForm = () => {
             label="schedule at"
             range={false}
             timePicker
-            placeholder="Select schedule date"
           />
         </div>
         <div className="flex flex-col gap-2">
@@ -67,7 +66,7 @@ const CreateNotificationForm = () => {
             })}
             items={targets}
             label="target"
-            placeholder="Select target"
+            placeholder="Choose who this applies to"
             name="target"
           />
           {errors.target && (
@@ -82,7 +81,11 @@ const CreateNotificationForm = () => {
             {...register("recipient")}
             label="recipient"
             items={recipient ?? []}
-            placeholder="Select recipient"
+            placeholder={
+              recipient && recipient.length > 0
+                ? "Choose recipients"
+                : ""
+            }
             name="recipient"
           />
         </div>
@@ -92,7 +95,7 @@ const CreateNotificationForm = () => {
             {...register("channels")}
             label="channels"
             items={channels ?? []}
-            placeholder="Select channels"
+            placeholder="Email, push, or both"
             name="channels"
           />
         </div>
@@ -107,7 +110,6 @@ const CreateNotificationForm = () => {
             name="link"
             label="Link"
             type="url"
-            placeholder="Enter link"
           />
           {errors.link && (
             <p className="mt-1 text-sm text-red-500">{errors.link.message}</p>
@@ -124,7 +126,7 @@ const CreateNotificationForm = () => {
             })}
             items={priorities}
             label="Priority"
-            placeholder="Select priority"
+            placeholder="Choose urgency"
             name="priority"
           />
           {errors.priority && (
@@ -144,7 +146,7 @@ const CreateNotificationForm = () => {
             })}
             items={types}
             label="type"
-            placeholder="Select type"
+            placeholder="Info, warning, alert, or reject"
             name="type"
           />
           {errors.type && (
@@ -162,7 +164,7 @@ const CreateNotificationForm = () => {
             })}
             label="Description"
             name="description"
-            placeholder="Enter description"
+            placeholder="Main message — include context and any action needed"
           />
         </div>
         <div className="md:col-span-2">