diff --git a/admin-spa/src/components/filters/DateRange.tsx b/admin-spa/src/components/filters/DateRange.tsx
index 50df1c5..ac09e30 100644
--- a/admin-spa/src/components/filters/DateRange.tsx
+++ b/admin-spa/src/components/filters/DateRange.tsx
@@ -50,7 +50,7 @@ export default function DateRange({ value, onChange }: Props) {
   }, [preset, start, end]);
 
   return (
-    <div className="flex flex-col gap-2 w-full">
+    <div className="flex flex-col lg:flex-row gap-2 w-full">
       <Select value={preset} onValueChange={(v) => setPreset(v)}>
         <SelectTrigger className="w-full">
           <SelectValue placeholder={__("Last 7 days")} />
@@ -66,10 +66,10 @@ export default function DateRange({ value, onChange }: Props) {
       </Select>
 
       {preset === "custom" && (
-        <div className="flex flex-col gap-2 w-full">
+        <div className="flex flex-col lg:flex-row gap-2 w-full">
           <input
             type="date"
-            className="w-full border border-input rounded-md px-3 py-2 text-sm bg-background ring-offset-background focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 disabled:cursor-not-allowed disabled:opacity-50 [&::-webkit-calendar-picker-indicator]:cursor-pointer"
+            className="w-full border !bg-transparent !border-input !rounded-md !shadow-sm px-3 py-2 text-sm bg-background ring-offset-background focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 disabled:cursor-not-allowed disabled:opacity-50 [&::-webkit-calendar-picker-indicator]:cursor-pointer"
             style={{ WebkitAppearance: 'none', MozAppearance: 'textfield' } as any}
             value={start || ""}
             onChange={(e) => setStart(e.target.value || undefined)}
@@ -77,7 +77,7 @@ export default function DateRange({ value, onChange }: Props) {
           />
           <input
             type="date"
-            className="w-full border border-input rounded-md px-3 py-2 text-sm bg-background ring-offset-background focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 disabled:cursor-not-allowed disabled:opacity-50 [&::-webkit-calendar-picker-indicator]:cursor-pointer"
+            className="w-full border !bg-transparent !border-input !rounded-md !shadow-sm px-3 py-2 text-sm bg-background ring-offset-background focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 disabled:cursor-not-allowed disabled:opacity-50 [&::-webkit-calendar-picker-indicator]:cursor-pointer"
             style={{ WebkitAppearance: 'none', MozAppearance: 'textfield' } as any}
             value={end || ""}
             onChange={(e) => setEnd(e.target.value || undefined)}
diff --git a/admin-spa/src/routes/Orders/Edit.tsx b/admin-spa/src/routes/Orders/Edit.tsx
index 329e20e..68f9677 100644
--- a/admin-spa/src/routes/Orders/Edit.tsx
+++ b/admin-spa/src/routes/Orders/Edit.tsx
@@ -6,9 +6,10 @@ import { OrdersApi } from '@/lib/api';
 import { showErrorToast, showSuccessToast, getPageLoadErrorMessage } from '@/lib/errorHandling';
 import { ErrorCard } from '@/components/ErrorCard';
 import { LoadingState } from '@/components/LoadingState';
-import { ArrowLeft } from 'lucide-react';
 import { __, sprintf } from '@/lib/i18n';
 import { usePageHeader } from '@/contexts/PageHeaderContext';
+import { Button } from '@/components/ui/button';
+import { useFABConfig } from '@/hooks/useFABConfig';
 
 export default function OrdersEdit() {
   const { id } = useParams();
@@ -16,6 +17,9 @@ export default function OrdersEdit() {
   const nav = useNavigate();
   const qc = useQueryClient();
   const { setPageHeader, clearPageHeader } = usePageHeader();
+  
+  // Hide FAB on edit page
+  useFABConfig('none');
 
   const countriesQ = useQuery({ queryKey: ['countries'], queryFn: OrdersApi.countries });
   const paymentsQ  = useQuery({ queryKey: ['payments'], queryFn: OrdersApi.payments });
@@ -58,29 +62,22 @@ export default function OrdersEdit() {
 
   const order = orderQ.data || {};
 
-  // Set page header
+  // Set page header with back button
   useEffect(() => {
-    if (order.number) {
-      setPageHeader(sprintf(__('Edit Order #%s'), order.number));
-    } else {
-      setPageHeader(__('Edit Order'));
-    }
+    const backButton = (
+      <Button size="sm" variant="ghost" onClick={() => nav(`/orders/${orderId}`)}>
+        {__('Back')}
+      </Button>
+    );
+    const title = order.number 
+      ? sprintf(__('Edit Order #%s'), order.number)
+      : __('Edit Order');
+    setPageHeader(title, backButton);
     return () => clearPageHeader();
-  }, [order.number, setPageHeader, clearPageHeader]);
+  }, [order.number, orderId, setPageHeader, clearPageHeader, nav]);
 
   return (
     <div className="space-y-4">
-      <div className="flex flex-wrap items-center gap-2">
-        <button 
-          className="border rounded-md px-3 py-2 text-sm flex items-center gap-2" 
-          onClick={() => nav(`/orders/${orderId}`)}
-        >
-          <ArrowLeft className="w-4 h-4" /> {__('Back')}
-        </button>
-        <h2 className="text-lg font-semibold flex-1 min-w-[160px]">
-          {sprintf(__('Edit Order #%s'), orderId)}
-        </h2>
-      </div>
 
       <OrderForm
         mode="edit"
diff --git a/admin-spa/src/routes/Orders/New.tsx b/admin-spa/src/routes/Orders/New.tsx
index 894d8ce..b1652e0 100644
--- a/admin-spa/src/routes/Orders/New.tsx
+++ b/admin-spa/src/routes/Orders/New.tsx
@@ -8,11 +8,15 @@ import { showErrorToast, showSuccessToast } from '@/lib/errorHandling';
 import { __, sprintf } from '@/lib/i18n';
 import { usePageHeader } from '@/contexts/PageHeaderContext';
 import { Button } from '@/components/ui/button';
+import { useFABConfig } from '@/hooks/useFABConfig';
 
 export default function OrdersNew() {
   const nav = useNavigate();
   const qc = useQueryClient();
   const { setPageHeader, clearPageHeader } = usePageHeader();
+  
+  // Hide FAB on new order page
+  useFABConfig('none');
 
   // Countries from Woo (allowed + default + states)
   const countriesQ = useQuery({ queryKey: ['countries'], queryFn: OrdersApi.countries });
@@ -40,20 +44,19 @@ export default function OrdersNew() {
   // Prefer global store currency injected by PHP
   const { currency: storeCurrency, symbol: storeSymbol } = getStoreCurrency();
 
-  // Set page header
+  // Set page header with back button
   useEffect(() => {
-    setPageHeader(__('New Order'));
+    const backButton = (
+      <Button size="sm" variant="ghost" onClick={() => nav('/orders')}>
+        {__('Back')}
+      </Button>
+    );
+    setPageHeader(__('New Order'), backButton);
     return () => clearPageHeader();
-  }, [setPageHeader, clearPageHeader]);
+  }, [setPageHeader, clearPageHeader, nav]);
 
   return (
     <div className="space-y-4">
-      <div className="flex items-center justify-between">
-        <h2 className="text-lg font-semibold">{__('New Order')}</h2>
-        <div className="flex gap-2">
-          <button className="border rounded-md px-3 py-2 text-sm" onClick={() => nav('/orders')}>{__('Cancel')}</button>
-        </div>
-      </div>
 
       <OrderForm
         mode="create"