updates

- more opactiy in qr code in second display
- disable all actions while waiting for qr pay

app/views/foodcourt/qrpay/init.html.erb

@@ -252,6 +252,50 @@
 </div>
 
 <script defer type="text/javascript">
+
+// disable actions while waiting for payment
+$(document).ready(function() {
+  $('button, a').not('#cancel-btn').each(function() {
+    const $element = $(this);
+
+    if ($element.is('button')) {
+      $element.prop('disabled', true);
+    }
+
+    // Disable links and dropdowns
+    $element.addClass('disabled');
+    $element.css({
+      'pointer-events': 'none',
+      'opacity': '0.5',
+      'cursor': 'not-allowed'
+    });
+
+    // Prevent click actions
+    $element.on('click', function(e) {
+      e.preventDefault();
+      e.stopImmediatePropagation();
+    });
+  });
+
+  // Specifically disable Bootstrap dropdowns
+  $('.dropdown-toggle').not('#cancel-btn').each(function() {
+    const $dropdown = $(this);
+
+    // Remove Bootstrap functionality
+    $dropdown.removeAttr('data-bs-toggle');
+    $dropdown.off('click.bs.dropdown');
+
+    // Add visual
+    $dropdown.addClass('disabled');
+    $dropdown.css({
+      'pointer-events': 'none',
+      'opacity': '0.5',
+      'cursor': 'not-allowed'
+    });
+  });
+});
+
+// payment success
 $(document).ready(function() {
   const $paymentWaiting = $('.payment-waiting');
   const amountToReceive = <%= number_with_precision(@sale_data.grand_total, precision: precision.to_i) %>;

app/views/foodcourt/second_display/_second_display.html.erb

@@ -1,7 +1,7 @@
 <div class="row clearfix h-100">
   <!-- First Column: Invoice Details -->
   <div class="col-12 h-100" id="second_display_order_items">
-    <div class="card h-100" style="opacity: 0.85; background-color: #f8f9fa;">
+    <div class="card h-100" style="opacity: 0.95; background-color: #f8f9fa;">
       <div class="card-header bg-primary text-white">
         <h4 class="mb-0">Invoice Details</h4>
       </div>
@@ -51,7 +51,7 @@
 
   <!-- Second Column: MMQR Payment -->
   <div class="col-12 d-flex flex-column h-100 hidden" id="mmqr_payment">
-    <div class="card h-100" style="opacity: 0.85;">
+    <div class="card h-100" style="opacity: 0.95;">
       <div class="card-header text-white" style="background-color: #ffc107;">
         <h4 class="mb-0">MMQR Payment Option</h4>
       </div>