diff --git a/resources/views/approval/approve-form.blade.php b/resources/views/approval/approve-form.blade.php
index 6ab83d3..f582a13 100644
--- a/resources/views/approval/approve-form.blade.php
+++ b/resources/views/approval/approve-form.blade.php
@@ -24,7 +24,7 @@
                             <!-- Remark Textbox -->
                             <div style="margin-top: 20px; text-align: left;">
                                 <label for="remark" style="font-size: 14px; color: #333;">Remark</label>
-                                <textarea id="remark" style="width:100%; height:100px; padding:10px; margin-top:5px; border:1px solid #ddd; border-radius:5px;"></textarea>
+                                <textarea id="remark" maxlength="60" style="width:100%; height:100px; padding:10px; margin-top:5px; border:1px solid #ddd; border-radius:5px;"></textarea>
                             </div>
 
                             <!-- Buttons -->
@@ -60,6 +60,19 @@
             const remark = document.getElementById("remark").value.trim();
             const id = document.getElementById("requestId").value;
             const level = document.getElementById("level").value;
+            const errorDiv = document.getElementById("remarkError");
+
+            if (remark == "") {
+                errorDiv.innerText = "Remark is mandatory.";
+                errorDiv.style.display = "block";
+                return;
+            }
+
+            if (remark.length > 60) {
+                errorDiv.innerText = "Remark must be within 60 characters.";
+                errorDiv.style.display = "block";
+                return;
+            }
 
             fetch('/characteristic/approve-save', {
                 method: 'POST',
diff --git a/resources/views/approval/hold-form.blade.php b/resources/views/approval/hold-form.blade.php
index dc62aab..f549b2c 100644
--- a/resources/views/approval/hold-form.blade.php
+++ b/resources/views/approval/hold-form.blade.php
@@ -24,7 +24,7 @@
                             <!-- Remark Textbox -->
                             <div style="margin-top: 20px; text-align: left;">
                                 <label for="remark" style="font-size: 14px; color: #333;">Remark <span style="color:red;">*</span></label>
-                                <textarea id="remark" style="width:100%; height:100px; padding:10px; margin-top:5px; border:1px solid #ddd; border-radius:5px;"></textarea>
+                                <textarea id="remark" maxlength="60" style="width:100%; height:100px; padding:10px; margin-top:5px; border:1px solid #ddd; border-radius:5px;"></textarea>
                                 <div id="remarkError" style="color:red; font-size:12px; display:none; margin-top:5px;">
                                     Remark is mandatory.
                                 </div>
@@ -64,6 +64,19 @@
             const remark = document.getElementById("remark").value.trim();
             const id = document.getElementById("requestId").value;
             const level = document.getElementById("level").value;
+            const errorDiv = document.getElementById("remarkError");
+
+            if (remark == "") {
+                errorDiv.innerText = "Remark is mandatory.";
+                errorDiv.style.display = "block";
+                return;
+            }
+
+            if (remark.length > 60) {
+                errorDiv.innerText = "Remark must be within 60 characters.";
+                errorDiv.style.display = "block";
+                return;
+            }
 
             fetch('/characteristic/hold-save', {
                 method: 'POST',
diff --git a/resources/views/approval/reject-form.blade.php b/resources/views/approval/reject-form.blade.php
index 0b73069..94d0c14 100644
--- a/resources/views/approval/reject-form.blade.php
+++ b/resources/views/approval/reject-form.blade.php
@@ -24,7 +24,7 @@
                             <!-- Remark Textbox -->
                             <div style="margin-top: 20px; text-align: left;">
                                 <label for="remark" style="font-size: 14px; color: #333;">Remark <span style="color:red;">*</span></label>
-                                <textarea id="remark" style="width:100%; height:100px; padding:10px; margin-top:5px; border:1px solid #ddd; border-radius:5px;"></textarea>
+                                <textarea id="remark" maxlength="60" style="width:100%; height:100px; padding:10px; margin-top:5px; border:1px solid #ddd; border-radius:5px;"></textarea>
                                 <div id="remarkError" style="color:red; font-size:12px; display:none; margin-top:5px;">
                                     Remark is mandatory.
                                 </div>
@@ -63,6 +63,19 @@
             const remark = document.getElementById("remark").value.trim();
             const id = document.getElementById("requestId").value;
             const level = document.getElementById("level").value;
+            const errorDiv = document.getElementById("remarkError");
+
+            if (remark == "") {
+                errorDiv.innerText = "Remark is mandatory.";
+                errorDiv.style.display = "block";
+                return;
+            }
+
+            if (remark.length > 60) {
+                errorDiv.innerText = "Remark must be within 60 characters.";
+                errorDiv.style.display = "block";
+                return;
+            }
 
             fetch('/characteristic/reject-save', {
                 method: 'POST',