feat: Hide drag handle on mobile + persist sort order to database

1. Hide Drag Handle on Mobile ✅

   Problem: Drag handle looks messy on mobile
   Solution: Hide on mobile, show only on desktop

   Changes:
   - Added 'hidden md:block' to drag handle
   - Added 'md:pl-8' to content wrapper
   - Mobile: Clean list without drag handle
   - Desktop: Drag handle visible for sorting

   UX Priority: Better mobile experience > sorting on mobile

2. Persist Sort Order to Database ✅

   Backend Implementation:

   A. New API Endpoint
      POST /woonoow/v1/payments/gateways/order
      Body: { category: 'manual'|'online', order: ['id1', 'id2'] }

   B. Save to WordPress Options
      - woonoow_payment_gateway_order_manual
      - woonoow_payment_gateway_order_online

   C. Load Order on Page Load
      GET /payments/gateways returns:
      {
        gateways: [...],
        order: {
          manual: ['bacs', 'cheque', 'cod'],
          online: ['paypal', 'stripe']
        }
      }

   Frontend Implementation:

   A. Save on Drag End
      - Calls API immediately after reorder
      - Shows success toast
      - Reverts on error with error toast

   B. Load Saved Order
      - Extracts order from API response
      - Uses saved order if available
      - Falls back to gateway order if no saved order

   C. Error Handling
      - Try/catch on save
      - Revert order on failure
      - User feedback via toast

3. Flow Diagram

   Page Load:
   ┌─────────────────────────────────────┐
   │ GET /payments/gateways              │
   ├─────────────────────────────────────┤
   │ Returns: { gateways, order }        │
   │ - order.manual: ['bacs', 'cod']     │
   │ - order.online: ['paypal']          │
   └─────────────────────────────────────┘
              ↓
   ┌─────────────────────────────────────┐
   │ Initialize State                    │
   │ - setManualOrder(order.manual)      │
   │ - setOnlineOrder(order.online)      │
   └─────────────────────────────────────┘
              ↓
   ┌─────────────────────────────────────┐
   │ Display Sorted List                 │
   │ - useMemo sorts by saved order      │
   └─────────────────────────────────────┘

   User Drags:
   ┌─────────────────────────────────────┐
   │ User drags item                     │
   └─────────────────────────────────────┘
              ↓
   ┌─────────────────────────────────────┐
   │ handleDragEnd                       │
   │ - Calculate new order               │
   │ - Update state (optimistic)         │
   └─────────────────────────────────────┘
              ↓
   ┌─────────────────────────────────────┐
   │ POST /payments/gateways/order       │
   │ Body: { category, order }           │
   └─────────────────────────────────────┘
              ↓
   ┌─────────────────────────────────────┐
   │ Success: Toast notification         │
   │ Error: Revert + error toast         │
   └─────────────────────────────────────┘

4. Mobile vs Desktop

   Mobile (< 768px):
   ✅ Clean list without drag handle
   ✅ No left padding
   ✅ Better UX
   ❌ No sorting (desktop only)

   Desktop (≥ 768px):
   ✅ Drag handle visible
   ✅ Full sorting capability
   ✅ Visual feedback
   ✅ Keyboard accessible

Benefits:
✅ Order persists across sessions
✅ Order persists across page reloads
✅ Clean mobile UI
✅ Full desktop functionality
✅ Error handling with rollback
✅ Optimistic UI updates

Files Modified:
- PaymentsController.php: New endpoint + load order
- Payments.tsx: Save order + load order + mobile hide
- Database: 2 new options for order storage

includes/Api/PaymentsController.php

@@ -94,6 +94,31 @@ class PaymentsController extends WP_REST_Controller {
                 ],
             ],
         ]);
+        
+        // POST /woonoow/v1/payments/gateways/order
+        register_rest_route($this->namespace, '/' . $this->rest_base . '/gateways/order', [
+            [
+                'methods' => WP_REST_Server::EDITABLE,
+                'callback' => [$this, 'save_gateway_order'],
+                'permission_callback' => [$this, 'check_permission'],
+                'args' => [
+                    'category' => [
+                        'description' => 'Gateway category (manual or online)',
+                        'type' => 'string',
+                        'required' => true,
+                        'enum' => ['manual', 'online'],
+                    ],
+                    'order' => [
+                        'description' => 'Array of gateway IDs in desired order',
+                        'type' => 'array',
+                        'required' => true,
+                        'items' => [
+                            'type' => 'string',
+                        ],
+                    ],
+                ],
+            ],
+        ]);
     }
     
     /**
@@ -106,7 +131,17 @@ class PaymentsController extends WP_REST_Controller {
         try {
             $gateways = PaymentGatewaysProvider::get_gateways();
             
-            $response = rest_ensure_response($gateways);
+            // Get saved order
+            $manual_order = get_option('woonoow_payment_gateway_order_manual', []);
+            $online_order = get_option('woonoow_payment_gateway_order_online', []);
+            
+            $response = rest_ensure_response([
+                'gateways' => $gateways,
+                'order' => [
+                    'manual' => $manual_order,
+                    'online' => $online_order,
+                ],
+            ]);
             
             // Cache for 5 minutes
             $response->header('Cache-Control', 'max-age=300');
@@ -265,6 +300,48 @@ class PaymentsController extends WP_REST_Controller {
         }
     }
     
+    /**
+     * Save gateway order
+     * 
+     * @param WP_REST_Request $request Request object
+     * @return WP_REST_Response|WP_Error Response object or error
+     */
+    public function save_gateway_order(WP_REST_Request $request) {
+        $category = $request->get_param('category');
+        $order = $request->get_param('order');
+        
+        // Validate category
+        if (!in_array($category, ['manual', 'online'], true)) {
+            return new WP_Error(
+                'invalid_category',
+                'Category must be either "manual" or "online"',
+                ['status' => 400]
+            );
+        }
+        
+        // Validate order is array
+        if (!is_array($order)) {
+            return new WP_Error(
+                'invalid_order',
+                'Order must be an array of gateway IDs',
+                ['status' => 400]
+            );
+        }
+        
+        // Save to WordPress options
+        $option_key = 'woonoow_payment_gateway_order_' . $category;
+        update_option($option_key, $order, false);
+        
+        error_log(sprintf('[WooNooW] Saved %s gateway order: %s', $category, implode(', ', $order)));
+        
+        return rest_ensure_response([
+            'success' => true,
+            'message' => 'Gateway order saved successfully',
+            'category' => $category,
+            'order' => $order,
+        ]);
+    }
+    
     /**
      * Check permission
      *