diff --git a/frontend/src/components/domain/unified-wizard/wizards/CustomerOrderWizard.tsx b/frontend/src/components/domain/unified-wizard/wizards/CustomerOrderWizard.tsx
index dc81cf57..d69c77b7 100644
--- a/frontend/src/components/domain/unified-wizard/wizards/CustomerOrderWizard.tsx
+++ b/frontend/src/components/domain/unified-wizard/wizards/CustomerOrderWizard.tsx
@@ -1,4 +1,5 @@
 import React, { useState, useEffect } from 'react';
+import { useTranslation } from 'react-i18next';
 import { WizardStep, WizardStepProps } from '../../../ui/WizardModal/WizardModal';
 import { AdvancedOptionsSection } from '../../../ui/AdvancedOptionsSection';
 import Tooltip from '../../../ui/Tooltip/Tooltip';
@@ -27,6 +28,7 @@ interface WizardDataProps extends WizardStepProps {
 
 // Step 1: Customer Selection
 const CustomerSelectionStep: React.FC<WizardDataProps> = ({ data, onDataChange }) => {
+  const { t } = useTranslation('wizards');
   const { currentTenant } = useTenant();
   const [searchQuery, setSearchQuery] = useState('');
   const [showNewCustomerForm, setShowNewCustomerForm] = useState(false);
@@ -85,7 +87,7 @@ const CustomerSelectionStep: React.FC<WizardDataProps> = ({ data, onDataChange }
       setCustomers(result);
     } catch (err: any) {
       console.error('Error loading customers:', err);
-      setError('Error loading customers');
+      setError(t('customerOrder.messages.errorLoadingCustomers'));
     } finally {
       setLoading(false);
     }
@@ -104,10 +106,10 @@ const CustomerSelectionStep: React.FC<WizardDataProps> = ({ data, onDataChange }
       <div className="text-center pb-4 border-b border-[var(--border-primary)]">
         <Users className="w-12 h-12 mx-auto mb-3 text-[var(--color-primary)]" />
         <h3 className="text-lg font-semibold text-[var(--text-primary)] mb-2">
-          Select Customer
+          {t('customerOrder.customerSelection.title')}
         </h3>
         <p className="text-sm text-[var(--text-secondary)]">
-          Search for an existing customer or create a new one
+          {t('customerOrder.customerSelection.subtitle')}
         </p>
       </div>
 
@@ -120,7 +122,7 @@ const CustomerSelectionStep: React.FC<WizardDataProps> = ({ data, onDataChange }
       {loading ? (
         <div className="flex items-center justify-center py-12">
           <Loader2 className="w-8 h-8 animate-spin text-[var(--color-primary)]" />
-          <span className="ml-3 text-[var(--text-secondary)]">Loading customers...</span>
+          <span className="ml-3 text-[var(--text-secondary)]">{t('customerOrder.messages.loadingCustomers')}</span>
         </div>
       ) : !showNewCustomerForm ? (
         <>
@@ -131,7 +133,7 @@ const CustomerSelectionStep: React.FC<WizardDataProps> = ({ data, onDataChange }
               type="text"
               value={searchQuery}
               onChange={(e) => setSearchQuery(e.target.value)}
-              placeholder="Search customer by name..."
+              placeholder={t('customerOrder.customerSelection.searchPlaceholder')}
               className="w-full pl-10 pr-4 py-3 border border-[var(--border-secondary)] rounded-lg focus:outline-none focus:ring-2 focus:ring-[var(--color-primary)] bg-[var(--bg-primary)] text-[var(--text-primary)]"
             />
           </div>
@@ -141,8 +143,8 @@ const CustomerSelectionStep: React.FC<WizardDataProps> = ({ data, onDataChange }
             {filteredCustomers.length === 0 ? (
               <div className="text-center py-8 border-2 border-dashed border-[var(--border-secondary)] rounded-lg">
                 <Users className="w-12 h-12 mx-auto mb-3 text-[var(--text-tertiary)]" />
-                <p className="text-[var(--text-secondary)] mb-1">No customers found</p>
-                <p className="text-sm text-[var(--text-tertiary)]">Try a different search term</p>
+                <p className="text-[var(--text-secondary)] mb-1">{t('customerOrder.messages.noCustomersFound')}</p>
+                <p className="text-sm text-[var(--text-tertiary)]">{t('customerOrder.messages.tryDifferentSearch')}</p>
               </div>
             ) : (
               filteredCustomers.map((customer) => (
@@ -186,7 +188,7 @@ const CustomerSelectionStep: React.FC<WizardDataProps> = ({ data, onDataChange }
                             ? 'bg-orange-100 text-orange-700 dark:bg-orange-900/30 dark:text-orange-300'
                             : 'bg-blue-100 text-blue-700 dark:bg-blue-900/30 dark:text-blue-300'
                         }`}>
-                          {customer.customer_type}
+                          {t(`customerOrder.customerTypes.${customer.customer_type}`)}
                         </span>
                         {customer.phone && <span>📱 {customer.phone}</span>}
                       </div>
@@ -203,7 +205,7 @@ const CustomerSelectionStep: React.FC<WizardDataProps> = ({ data, onDataChange }
             className="w-full p-4 border-2 border-dashed border-[var(--border-secondary)] rounded-lg hover:border-[var(--color-primary)] transition-colors text-[var(--text-secondary)] hover:text-[var(--color-primary)] flex items-center justify-center gap-2"
           >
             <Plus className="w-5 h-5" />
-            <span className="font-medium">Create new customer</span>
+            <span className="font-medium">{t('customerOrder.customerSelection.createNew')}</span>
           </button>
         </>
       ) : (
@@ -212,61 +214,61 @@ const CustomerSelectionStep: React.FC<WizardDataProps> = ({ data, onDataChange }
           <div className="p-4 bg-[var(--bg-secondary)]/30 rounded-lg border border-[var(--border-secondary)]">
             <h4 className="font-semibold text-[var(--text-primary)] mb-4 flex items-center gap-2">
               <Plus className="w-5 h-5" />
-              New Customer
+              {t('customerOrder.messages.newCustomerHeader')}
             </h4>
 
             <div className="grid grid-cols-1 md:grid-cols-2 gap-4">
               <div className="md:col-span-2">
                 <label className="block text-sm font-medium text-[var(--text-secondary)] mb-2">
-                  Customer Name *
+                  {t('customerOrder.customerSelection.customerName')} *
                 </label>
                 <input
                   type="text"
                   value={newCustomer.name}
                   onChange={(e) => handleNewCustomerChange({ name: e.target.value })}
-                  placeholder="E.g., The Mill Restaurant"
+                  placeholder={t('customerOrder.customerSelection.customerNamePlaceholder')}
                   className="w-full px-3 py-2 border border-[var(--border-secondary)] rounded-lg focus:outline-none focus:ring-2 focus:ring-[var(--color-primary)] bg-[var(--bg-primary)] text-[var(--text-primary)]"
                 />
               </div>
 
               <div>
                 <label className="block text-sm font-medium text-[var(--text-secondary)] mb-2">
-                  Customer Type *
+                  {t('customerOrder.customerSelection.customerType')} *
                 </label>
                 <select
                   value={newCustomer.type}
                   onChange={(e) => handleNewCustomerChange({ type: e.target.value })}
                   className="w-full px-3 py-2 border border-[var(--border-secondary)] rounded-lg focus:outline-none focus:ring-2 focus:ring-[var(--color-primary)] bg-[var(--bg-primary)] text-[var(--text-primary)]"
                 >
-                  <option value="retail">Retail</option>
-                  <option value="wholesale">Wholesale</option>
-                  <option value="event">Event</option>
-                  <option value="restaurant">Restaurant</option>
+                  <option value="retail">{t('customerOrder.customerTypes.retail')}</option>
+                  <option value="wholesale">{t('customerOrder.customerTypes.wholesale')}</option>
+                  <option value="event">{t('customerOrder.customerTypes.event')}</option>
+                  <option value="restaurant">{t('customerOrder.customerTypes.restaurant')}</option>
                 </select>
               </div>
 
               <div>
                 <label className="block text-sm font-medium text-[var(--text-secondary)] mb-2">
-                  Phone *
+                  {t('customerOrder.customerSelection.phone')} *
                 </label>
                 <input
                   type="tel"
                   value={newCustomer.phone}
                   onChange={(e) => handleNewCustomerChange({ phone: e.target.value })}
-                  placeholder="+34 123 456 789"
+                  placeholder={t('customerOrder.customerSelection.phonePlaceholder')}
                   className="w-full px-3 py-2 border border-[var(--border-secondary)] rounded-lg focus:outline-none focus:ring-2 focus:ring-[var(--color-primary)] bg-[var(--bg-primary)] text-[var(--text-primary)]"
                 />
               </div>
 
               <div className="md:col-span-2">
                 <label className="block text-sm font-medium text-[var(--text-secondary)] mb-2">
-                  Email (Optional)
+                  {t('customerOrder.customerSelection.email')} ({t('common.optional')})
                 </label>
                 <input
                   type="email"
                   value={newCustomer.email}
                   onChange={(e) => handleNewCustomerChange({ email: e.target.value })}
-                  placeholder="contact@restaurant.com"
+                  placeholder={t('customerOrder.customerSelection.emailPlaceholder')}
                   className="w-full px-3 py-2 border border-[var(--border-secondary)] rounded-lg focus:outline-none focus:ring-2 focus:ring-[var(--color-primary)] bg-[var(--bg-primary)] text-[var(--text-primary)]"
                 />
               </div>
@@ -276,7 +278,7 @@ const CustomerSelectionStep: React.FC<WizardDataProps> = ({ data, onDataChange }
               onClick={() => handleCustomerChange(selectedCustomer, false)}
               className="mt-4 text-sm text-[var(--text-secondary)] hover:text-[var(--text-primary)]"
             >
-              ← Back to customer list
+              ← {t('customerOrder.customerSelection.backToList')}
             </button>
           </div>
         </>
@@ -287,6 +289,7 @@ const CustomerSelectionStep: React.FC<WizardDataProps> = ({ data, onDataChange }
 
 // Step 2: Order Items
 const OrderItemsStep: React.FC<WizardDataProps> = ({ data, onDataChange }) => {
+  const { t } = useTranslation('wizards');
   const { currentTenant } = useTenant();
   const [orderItems, setOrderItems] = useState(data.orderItems || []);
   const [products, setProducts] = useState<any[]>([]);
@@ -318,7 +321,7 @@ const OrderItemsStep: React.FC<WizardDataProps> = ({ data, onDataChange }) => {
       setProducts(finishedProducts);
     } catch (err: any) {
       console.error('Error loading products:', err);
-      setError('Error loading products');
+      setError(t('customerOrder.messages.errorLoadingProducts'));
     } finally {
       setLoading(false);
     }
@@ -377,10 +380,10 @@ const OrderItemsStep: React.FC<WizardDataProps> = ({ data, onDataChange }) => {
       <div className="text-center pb-4 border-b border-[var(--border-primary)]">
         <Package className="w-12 h-12 mx-auto mb-3 text-[var(--color-primary)]" />
         <h3 className="text-lg font-semibold text-[var(--text-primary)] mb-2">
-          Order Items
+          {t('customerOrder.orderItems.title')}
         </h3>
         <p className="text-sm text-[var(--text-secondary)]">
-          Customer: <span className="font-semibold">{data.customer?.name || 'New Customer'}</span>
+          {t('customerOrder.orderItems.customer')}: <span className="font-semibold">{data.customer?.name || t('customerOrder.messages.newCustomer')}</span>
         </p>
       </div>
 
@@ -393,29 +396,29 @@ const OrderItemsStep: React.FC<WizardDataProps> = ({ data, onDataChange }) => {
       {loading ? (
         <div className="flex items-center justify-center py-12">
           <Loader2 className="w-8 h-8 animate-spin text-[var(--color-primary)]" />
-          <span className="ml-3 text-[var(--text-secondary)]">Loading products...</span>
+          <span className="ml-3 text-[var(--text-secondary)]">{t('customerOrder.messages.loadingProducts')}</span>
         </div>
       ) : (
         <>
           <div className="space-y-3">
             <div className="flex items-center justify-between">
               <label className="block text-sm font-medium text-[var(--text-secondary)]">
-                Order Products
+                {t('customerOrder.orderItems.orderProducts')}
               </label>
               <button
                 onClick={handleAddItem}
                 className="px-3 py-1.5 text-sm bg-[var(--color-primary)] text-white rounded-md hover:bg-[var(--color-primary)]/90 transition-colors flex items-center gap-1"
               >
                 <Plus className="w-4 h-4" />
-                Add Product
+                {t('customerOrder.messages.addProduct')}
               </button>
             </div>
 
             {orderItems.length === 0 ? (
               <div className="text-center py-12 border-2 border-dashed border-[var(--border-secondary)] rounded-lg text-[var(--text-tertiary)]">
                 <Package className="w-12 h-12 mx-auto mb-3 opacity-50" />
-                <p className="mb-2">No products in order</p>
-                <p className="text-sm">Click "Add Product" to start</p>
+                <p className="mb-2">{t('customerOrder.messages.noProductsInOrder')}</p>
+                <p className="text-sm">{t('customerOrder.messages.clickAddProduct')}</p>
               </div>
             ) : (
               <div className="space-y-3">
@@ -426,7 +429,7 @@ const OrderItemsStep: React.FC<WizardDataProps> = ({ data, onDataChange }) => {
                   >
                     <div className="flex items-center justify-between">
                       <span className="text-sm font-semibold text-[var(--text-primary)]">
-                        Product #{index + 1}
+                        {t('customerOrder.orderItems.productNumber', { number: index + 1 })}
                       </span>
                       <button
                         onClick={() => handleRemoveItem(index)}
@@ -439,14 +442,14 @@ const OrderItemsStep: React.FC<WizardDataProps> = ({ data, onDataChange }) => {
                     <div className="grid grid-cols-1 md:grid-cols-2 gap-3">
                       <div className="md:col-span-2">
                         <label className="block text-xs font-medium text-[var(--text-secondary)] mb-1">
-                          Product *
+                          {t('customerOrder.orderItems.product')} *
                         </label>
                         <select
                           value={item.productId}
                           onChange={(e) => handleUpdateItem(index, 'productId', e.target.value)}
                           className="w-full px-3 py-2 text-sm border border-[var(--border-secondary)] rounded-lg focus:outline-none focus:ring-2 focus:ring-[var(--color-primary)] bg-[var(--bg-primary)] text-[var(--text-primary)]"
                         >
-                          <option value="">Select product...</option>
+                          <option value="">{t('customerOrder.orderItems.selectProduct')}</option>
                           {products.map((product) => (
                             <option key={product.id} value={product.id}>
                               {product.name} - €{(product.average_cost || product.last_purchase_price || 0).toFixed(2)} / {product.unit_of_measure}
@@ -457,7 +460,7 @@ const OrderItemsStep: React.FC<WizardDataProps> = ({ data, onDataChange }) => {
 
                       <div>
                         <label className="block text-xs font-medium text-[var(--text-secondary)] mb-1">
-                          Quantity *
+                          {t('customerOrder.orderItems.quantity')} *
                         </label>
                         <input
                           type="number"
@@ -471,7 +474,7 @@ const OrderItemsStep: React.FC<WizardDataProps> = ({ data, onDataChange }) => {
 
                       <div>
                         <label className="block text-xs font-medium text-[var(--text-secondary)] mb-1">
-                          Unit Price (€)
+                          {t('customerOrder.orderItems.unitPrice')}
                         </label>
                         <input
                           type="number"
@@ -485,13 +488,13 @@ const OrderItemsStep: React.FC<WizardDataProps> = ({ data, onDataChange }) => {
 
                       <div className="md:col-span-2">
                         <label className="block text-xs font-medium text-[var(--text-secondary)] mb-1">
-                          Special Requirements (Optional)
+                          {t('customerOrder.orderItems.specialRequirements')} ({t('common.optional')})
                         </label>
                         <input
                           type="text"
                           value={item.customRequirements}
                           onChange={(e) => handleUpdateItem(index, 'customRequirements', e.target.value)}
-                          placeholder="E.g., No nuts, extra chocolate..."
+                          placeholder={t('customerOrder.orderItems.specialRequirementsPlaceholder')}
                           className="w-full px-3 py-2 text-sm border border-[var(--border-secondary)] rounded-lg focus:outline-none focus:ring-2 focus:ring-[var(--color-primary)] bg-[var(--bg-primary)] text-[var(--text-primary)]"
                         />
                       </div>
@@ -499,7 +502,7 @@ const OrderItemsStep: React.FC<WizardDataProps> = ({ data, onDataChange }) => {
 
                     <div className="pt-2 border-t border-[var(--border-primary)] text-sm">
                       <span className="font-semibold text-[var(--text-primary)]">
-                        Subtotal: €{item.subtotal.toFixed(2)}
+                        {t('customerOrder.orderItems.subtotal')}: €{item.subtotal.toFixed(2)}
                       </span>
                     </div>
                   </div>
@@ -510,7 +513,7 @@ const OrderItemsStep: React.FC<WizardDataProps> = ({ data, onDataChange }) => {
             {orderItems.length > 0 && (
               <div className="p-4 bg-gradient-to-r from-[var(--color-primary)]/5 to-[var(--color-primary)]/10 rounded-lg border-2 border-[var(--color-primary)]/20">
                 <div className="flex justify-between items-center">
-                  <span className="text-lg font-semibold text-[var(--text-primary)]">Order Total:</span>
+                  <span className="text-lg font-semibold text-[var(--text-primary)]">{t('customerOrder.messages.orderTotal')}:</span>
                   <span className="text-2xl font-bold text-[var(--color-primary)]">
                     €{calculateTotal().toFixed(2)}
                   </span>
@@ -526,6 +529,7 @@ const OrderItemsStep: React.FC<WizardDataProps> = ({ data, onDataChange }) => {
 
 // Step 3: Delivery & Payment with ALL fields
 const DeliveryPaymentStep: React.FC<WizardDataProps> = ({ data, onDataChange }) => {
+  const { t } = useTranslation('wizards');
   const [orderData, setOrderData] = useState({
     // Required fields
     requestedDeliveryDate: data.requestedDeliveryDate || '',
@@ -613,10 +617,10 @@ const DeliveryPaymentStep: React.FC<WizardDataProps> = ({ data, onDataChange })
       <div className="text-center pb-4 border-b border-[var(--border-primary)]">
         <Truck className="w-12 h-12 mx-auto mb-3 text-[var(--color-primary)]" />
         <h3 className="text-lg font-semibold text-[var(--text-primary)] mb-2">
-          Delivery & Payment Details
+          {t('customerOrder.deliveryPayment.title')}
         </h3>
         <p className="text-sm text-[var(--text-secondary)]">
-          Configure delivery, payment, and order details
+          {t('customerOrder.deliveryPayment.subtitle')}
         </p>
       </div>
 
@@ -625,7 +629,7 @@ const DeliveryPaymentStep: React.FC<WizardDataProps> = ({ data, onDataChange })
         <div>
           <label className="block text-sm font-medium text-[var(--text-secondary)] mb-2">
             <Calendar className="w-4 h-4 inline mr-1.5" />
-            Requested Delivery Date *
+            {t('customerOrder.deliveryPayment.requestedDeliveryDate')} *
           </label>
           <input
             type="date"
@@ -638,17 +642,17 @@ const DeliveryPaymentStep: React.FC<WizardDataProps> = ({ data, onDataChange })
 
         <div>
           <label className="block text-sm font-medium text-[var(--text-secondary)] mb-2">
-            Order Number (Read-only - Auto-generated)
-            <Tooltip content="Automatically generated by backend on order creation (format: ORD-YYYYMMDD-####)">
+            {t('customerOrder.deliveryPayment.orderNumberLabel')}
+            <Tooltip content={t('customerOrder.deliveryPayment.orderNumberTooltip')}>
               <Info className="inline w-4 h-4 ml-1 text-[var(--text-tertiary)]" />
             </Tooltip>
           </label>
           <input
             type="text"
-            value={orderData.orderNumber || 'Auto-generated on save'}
+            value={orderData.orderNumber || t('customerOrder.deliveryPayment.autoGeneratedLabel')}
             readOnly
             disabled
-            placeholder="Will be generated automatically"
+            placeholder={t('customerOrder.deliveryPayment.autoGeneratedPlaceholder')}
             className="w-full px-3 py-2 border border-[var(--border-secondary)] rounded-lg bg-[var(--bg-secondary)] text-[var(--text-tertiary)] cursor-not-allowed"
           />
         </div>
@@ -656,54 +660,54 @@ const DeliveryPaymentStep: React.FC<WizardDataProps> = ({ data, onDataChange })
 
       {/* Basic Order Info */}
       <div className="border-t border-[var(--border-primary)] pt-4">
-        <h4 className="text-sm font-semibold text-[var(--text-primary)] mb-3">Basic Order Information</h4>
+        <h4 className="text-sm font-semibold text-[var(--text-primary)] mb-3">{t('customerOrder.sections.basicInfo')}</h4>
         <div className="grid grid-cols-1 md:grid-cols-3 gap-4">
           <div>
             <label className="block text-sm font-medium text-[var(--text-secondary)] mb-2">
-              Order Type
+              {t('customerOrder.deliveryPayment.orderType')}
             </label>
             <select
               value={orderData.orderType}
               onChange={(e) => handleOrderDataChange({ ...orderData, orderType: e.target.value })}
               className="w-full px-3 py-2 border border-[var(--border-secondary)] rounded-lg focus:outline-none focus:ring-2 focus:ring-[var(--color-primary)] bg-[var(--bg-primary)] text-[var(--text-primary)]"
             >
-              <option value="standard">Standard</option>
-              <option value="custom">Custom</option>
-              <option value="bulk">Bulk</option>
-              <option value="urgent">Urgent</option>
+              <option value="standard">{t('customerOrder.orderTypes.standard')}</option>
+              <option value="custom">{t('customerOrder.orderTypes.custom')}</option>
+              <option value="bulk">{t('customerOrder.orderTypes.bulk')}</option>
+              <option value="urgent">{t('customerOrder.orderTypes.urgent')}</option>
             </select>
           </div>
 
           <div>
             <label className="block text-sm font-medium text-[var(--text-secondary)] mb-2">
-              Priority
+              {t('customerOrder.deliveryPayment.priority')}
             </label>
             <select
               value={orderData.priority}
               onChange={(e) => handleOrderDataChange({ ...orderData, priority: e.target.value })}
               className="w-full px-3 py-2 border border-[var(--border-secondary)] rounded-lg focus:outline-none focus:ring-2 focus:ring-[var(--color-primary)] bg-[var(--bg-primary)] text-[var(--text-primary)]"
             >
-              <option value="low">Low</option>
-              <option value="normal">Normal</option>
-              <option value="high">High</option>
-              <option value="urgent">Urgent</option>
+              <option value="low">{t('customerOrder.priorities.low')}</option>
+              <option value="normal">{t('customerOrder.priorities.normal')}</option>
+              <option value="high">{t('customerOrder.priorities.high')}</option>
+              <option value="urgent">{t('customerOrder.priorities.urgent')}</option>
             </select>
           </div>
 
           <div>
             <label className="block text-sm font-medium text-[var(--text-secondary)] mb-2">
-              Status
+              {t('customerOrder.deliveryPayment.status')}
             </label>
             <select
               value={orderData.status}
               onChange={(e) => handleOrderDataChange({ ...orderData, status: e.target.value })}
               className="w-full px-3 py-2 border border-[var(--border-secondary)] rounded-lg focus:outline-none focus:ring-2 focus:ring-[var(--color-primary)] bg-[var(--bg-primary)] text-[var(--text-primary)]"
             >
-              <option value="pending">Pending</option>
-              <option value="confirmed">Confirmed</option>
-              <option value="in_production">In Production</option>
-              <option value="ready">Ready</option>
-              <option value="delivered">Delivered</option>
+              <option value="pending">{t('customerOrder.statuses.pending')}</option>
+              <option value="confirmed">{t('customerOrder.statuses.confirmed')}</option>
+              <option value="in_production">{t('customerOrder.statuses.in_production')}</option>
+              <option value="ready">{t('customerOrder.statuses.ready')}</option>
+              <option value="delivered">{t('customerOrder.statuses.delivered')}</option>
             </select>
           </div>
         </div>
@@ -711,12 +715,12 @@ const DeliveryPaymentStep: React.FC<WizardDataProps> = ({ data, onDataChange })
 
       {/* Delivery Details */}
       <div className="border-t border-[var(--border-primary)] pt-4">
-        <h4 className="text-sm font-semibold text-[var(--text-primary)] mb-3">Delivery Details</h4>
+        <h4 className="text-sm font-semibold text-[var(--text-primary)] mb-3">{t('customerOrder.sections.deliveryInfo')}</h4>
         <div className="space-y-4">
           <div>
             <label className="block text-sm font-medium text-[var(--text-secondary)] mb-2">
               <Truck className="w-4 h-4 inline mr-1.5" />
-              Delivery Method
+              {t('customerOrder.deliveryPayment.deliveryMethod')}
             </label>
             <div className="grid grid-cols-1 md:grid-cols-3 gap-3">
               <button
@@ -728,8 +732,8 @@ const DeliveryPaymentStep: React.FC<WizardDataProps> = ({ data, onDataChange })
                     : 'border-[var(--border-secondary)]'
                 }`}
               >
-                <p className="font-semibold text-sm">Pickup</p>
-                <p className="text-xs text-[var(--text-tertiary)]">Customer pickup</p>
+                <p className="font-semibold text-sm">{t('customerOrder.deliveryMethods.pickup')}</p>
+                <p className="text-xs text-[var(--text-tertiary)]">{t('customerOrder.deliveryMethods.pickupDesc')}</p>
               </button>
               <button
                 type="button"
@@ -740,8 +744,8 @@ const DeliveryPaymentStep: React.FC<WizardDataProps> = ({ data, onDataChange })
                     : 'border-[var(--border-secondary)]'
                 }`}
               >
-                <p className="font-semibold text-sm">Delivery</p>
-                <p className="text-xs text-[var(--text-tertiary)]">Home delivery</p>
+                <p className="font-semibold text-sm">{t('customerOrder.deliveryMethods.delivery')}</p>
+                <p className="text-xs text-[var(--text-tertiary)]">{t('customerOrder.deliveryMethods.deliveryDesc')}</p>
               </button>
               <button
                 type="button"
@@ -752,8 +756,8 @@ const DeliveryPaymentStep: React.FC<WizardDataProps> = ({ data, onDataChange })
                     : 'border-[var(--border-secondary)]'
                 }`}
               >
-                <p className="font-semibold text-sm">Shipping</p>
-                <p className="text-xs text-[var(--text-tertiary)]">Courier service</p>
+                <p className="font-semibold text-sm">{t('customerOrder.deliveryMethods.shipping')}</p>
+                <p className="text-xs text-[var(--text-tertiary)]">{t('customerOrder.deliveryMethods.shippingDesc')}</p>
               </button>
             </div>
           </div>
@@ -762,12 +766,12 @@ const DeliveryPaymentStep: React.FC<WizardDataProps> = ({ data, onDataChange })
             <div>
               <label className="block text-sm font-medium text-[var(--text-secondary)] mb-2">
                 <MapPin className="w-4 h-4 inline mr-1.5" />
-                Delivery Address *
+                {t('customerOrder.messages.deliveryAddress')} *
               </label>
               <textarea
                 value={orderData.deliveryAddress}
                 onChange={(e) => handleOrderDataChange({ ...orderData, deliveryAddress: e.target.value })}
-                placeholder="Street, number, floor, postal code, city..."
+                placeholder={t('customerOrder.deliveryPayment.deliveryAddressPlaceholder')}
                 rows={2}
                 className="w-full px-3 py-2 border border-[var(--border-secondary)] rounded-lg focus:outline-none focus:ring-2 focus:ring-[var(--color-primary)] bg-[var(--bg-primary)] text-[var(--text-primary)]"
               />
@@ -777,26 +781,26 @@ const DeliveryPaymentStep: React.FC<WizardDataProps> = ({ data, onDataChange })
           <div className="grid grid-cols-1 md:grid-cols-2 gap-4">
             <div>
               <label className="block text-sm font-medium text-[var(--text-secondary)] mb-2">
-                Delivery Contact Name
+                {t('customerOrder.deliveryPayment.deliveryContactName')}
               </label>
               <input
                 type="text"
                 value={orderData.deliveryContactName}
                 onChange={(e) => handleOrderDataChange({ ...orderData, deliveryContactName: e.target.value })}
-                placeholder="Contact person"
+                placeholder={t('customerOrder.deliveryPayment.deliveryContactNamePlaceholder')}
                 className="w-full px-3 py-2 border border-[var(--border-secondary)] rounded-lg focus:outline-none focus:ring-2 focus:ring-[var(--color-primary)] bg-[var(--bg-primary)] text-[var(--text-primary)]"
               />
             </div>
 
             <div>
               <label className="block text-sm font-medium text-[var(--text-secondary)] mb-2">
-                Delivery Contact Phone
+                {t('customerOrder.deliveryPayment.deliveryContactPhone')}
               </label>
               <input
                 type="tel"
                 value={orderData.deliveryContactPhone}
                 onChange={(e) => handleOrderDataChange({ ...orderData, deliveryContactPhone: e.target.value })}
-                placeholder="+34 123 456 789"
+                placeholder={t('customerOrder.deliveryPayment.phoneNumberPlaceholder')}
                 className="w-full px-3 py-2 border border-[var(--border-secondary)] rounded-lg focus:outline-none focus:ring-2 focus:ring-[var(--color-primary)] bg-[var(--bg-primary)] text-[var(--text-primary)]"
               />
             </div>
@@ -806,60 +810,60 @@ const DeliveryPaymentStep: React.FC<WizardDataProps> = ({ data, onDataChange })
 
       {/* Payment Details */}
       <div className="border-t border-[var(--border-primary)] pt-4">
-        <h4 className="text-sm font-semibold text-[var(--text-primary)] mb-3">Payment Details</h4>
+        <h4 className="text-sm font-semibold text-[var(--text-primary)] mb-3">{t('customerOrder.sections.paymentInfo')}</h4>
         <div className="grid grid-cols-1 md:grid-cols-2 gap-4">
           <div>
             <label className="block text-sm font-medium text-[var(--text-secondary)] mb-2">
               <CreditCard className="w-4 h-4 inline mr-1.5" />
-              Payment Method
+              {t('customerOrder.messages.paymentMethod')}
             </label>
             <select
               value={orderData.paymentMethod}
               onChange={(e) => handleOrderDataChange({ ...orderData, paymentMethod: e.target.value })}
               className="w-full px-3 py-2 border border-[var(--border-secondary)] rounded-lg focus:outline-none focus:ring-2 focus:ring-[var(--color-primary)] bg-[var(--bg-primary)] text-[var(--text-primary)]"
             >
-              <option value="cash">Cash</option>
-              <option value="card">Card</option>
-              <option value="bank_transfer">Bank Transfer</option>
-              <option value="invoice">Invoice</option>
-              <option value="account">Account</option>
+              <option value="cash">{t('customerOrder.paymentMethods.cash')}</option>
+              <option value="card">{t('customerOrder.paymentMethods.card')}</option>
+              <option value="bank_transfer">{t('customerOrder.paymentMethods.bank_transfer')}</option>
+              <option value="invoice">{t('customerOrder.paymentMethods.invoice')}</option>
+              <option value="account">{t('customerOrder.paymentMethods.account')}</option>
             </select>
           </div>
 
           <div>
             <label className="block text-sm font-medium text-[var(--text-secondary)] mb-2">
-              Payment Terms
+              {t('customerOrder.deliveryPayment.paymentTerms')}
             </label>
             <select
               value={orderData.paymentTerms}
               onChange={(e) => handleOrderDataChange({ ...orderData, paymentTerms: e.target.value })}
               className="w-full px-3 py-2 border border-[var(--border-secondary)] rounded-lg focus:outline-none focus:ring-2 focus:ring-[var(--color-primary)] bg-[var(--bg-primary)] text-[var(--text-primary)]"
             >
-              <option value="immediate">Immediate</option>
-              <option value="net_30">Net 30</option>
-              <option value="net_60">Net 60</option>
+              <option value="immediate">{t('customerOrder.paymentTerms.immediate')}</option>
+              <option value="net_30">{t('customerOrder.paymentTerms.net_30')}</option>
+              <option value="net_60">{t('customerOrder.paymentTerms.net_60')}</option>
             </select>
           </div>
 
           <div>
             <label className="block text-sm font-medium text-[var(--text-secondary)] mb-2">
-              Payment Status
+              {t('customerOrder.deliveryPayment.paymentStatus')}
             </label>
             <select
               value={orderData.paymentStatus}
               onChange={(e) => handleOrderDataChange({ ...orderData, paymentStatus: e.target.value })}
               className="w-full px-3 py-2 border border-[var(--border-secondary)] rounded-lg focus:outline-none focus:ring-2 focus:ring-[var(--color-primary)] bg-[var(--bg-primary)] text-[var(--text-primary)]"
             >
-              <option value="pending">Pending</option>
-              <option value="partial">Partial</option>
-              <option value="paid">Paid</option>
-              <option value="overdue">Overdue</option>
+              <option value="pending">{t('customerOrder.paymentStatuses.pending')}</option>
+              <option value="partial">{t('customerOrder.paymentStatuses.partial')}</option>
+              <option value="paid">{t('customerOrder.paymentStatuses.paid')}</option>
+              <option value="overdue">{t('customerOrder.paymentStatuses.overdue')}</option>
             </select>
           </div>
 
           <div>
             <label className="block text-sm font-medium text-[var(--text-secondary)] mb-2">
-              Payment Due Date
+              {t('customerOrder.deliveryPayment.paymentDueDate')}
             </label>
             <input
               type="date"
@@ -873,18 +877,18 @@ const DeliveryPaymentStep: React.FC<WizardDataProps> = ({ data, onDataChange })
 
       {/* Order Summary */}
       <div className="p-4 bg-[var(--bg-secondary)]/50 rounded-lg border border-[var(--border-secondary)]">
-        <h4 className="font-semibold text-[var(--text-primary)] mb-3">Order Summary</h4>
+        <h4 className="font-semibold text-[var(--text-primary)] mb-3">{t('customerOrder.sections.orderSummary')}</h4>
         <div className="space-y-2 text-sm">
           <div className="flex justify-between">
-            <span className="text-[var(--text-secondary)]">Customer:</span>
-            <span className="font-medium">{data.customer?.name || 'New Customer'}</span>
+            <span className="text-[var(--text-secondary)]">{t('customerOrder.orderItems.customer')}:</span>
+            <span className="font-medium">{data.customer?.name || t('customerOrder.messages.newCustomer')}</span>
           </div>
           <div className="flex justify-between">
-            <span className="text-[var(--text-secondary)]">Products:</span>
-            <span className="font-medium">{data.orderItems?.length || 0} items</span>
+            <span className="text-[var(--text-secondary)]">{t('customerOrder.deliveryPayment.products')}:</span>
+            <span className="font-medium">{data.orderItems?.length || 0} {t('customerOrder.messages.items')}</span>
           </div>
           <div className="flex justify-between">
-            <span className="text-[var(--text-secondary)]">Total:</span>
+            <span className="text-[var(--text-secondary)]">{t('customerOrder.messages.total')}:</span>
             <span className="font-semibold text-lg text-[var(--color-primary)]">
               €{data.totalAmount?.toFixed(2) || '0.00'}
             </span>
@@ -894,18 +898,18 @@ const DeliveryPaymentStep: React.FC<WizardDataProps> = ({ data, onDataChange })
 
       {/* Advanced Options */}
       <AdvancedOptionsSection
-        title="Advanced Options"
-        description="Optional fields for comprehensive order management"
+        title={t('customerOrder.sections.advancedOptions')}
+        description={t('customerOrder.sections.advancedOptionsDescription')}
       >
         {/* Pricing Details */}
         <div className="space-y-4">
           <h5 className="text-xs font-semibold text-[var(--text-secondary)] uppercase tracking-wider">
-            Pricing Details
+            {t('customerOrder.sections.pricingDetails')}
           </h5>
           <div className="grid grid-cols-1 md:grid-cols-2 gap-4">
             <div>
               <label className="block text-sm font-medium text-[var(--text-secondary)] mb-2">
-                Discount (%)
+                {t('customerOrder.deliveryPayment.discount')}
               </label>
               <input
                 type="number"
@@ -921,7 +925,7 @@ const DeliveryPaymentStep: React.FC<WizardDataProps> = ({ data, onDataChange })
 
             <div>
               <label className="block text-sm font-medium text-[var(--text-secondary)] mb-2">
-                Delivery Fee (€)
+                {t('customerOrder.deliveryPayment.deliveryFee')}
               </label>
               <input
                 type="number"
@@ -939,12 +943,12 @@ const DeliveryPaymentStep: React.FC<WizardDataProps> = ({ data, onDataChange })
         {/* Production & Scheduling */}
         <div className="space-y-4 border-t border-[var(--border-primary)] pt-4">
           <h5 className="text-xs font-semibold text-[var(--text-secondary)] uppercase tracking-wider">
-            Production & Scheduling
+            {t('customerOrder.sections.productionScheduling')}
           </h5>
           <div className="grid grid-cols-1 md:grid-cols-2 gap-4">
             <div>
               <label className="block text-sm font-medium text-[var(--text-secondary)] mb-2">
-                Production Start Date
+                {t('customerOrder.deliveryPayment.productionStartDate')}
               </label>
               <input
                 type="date"
@@ -956,7 +960,7 @@ const DeliveryPaymentStep: React.FC<WizardDataProps> = ({ data, onDataChange })
 
             <div>
               <label className="block text-sm font-medium text-[var(--text-secondary)] mb-2">
-                Production Due Date
+                {t('customerOrder.deliveryPayment.productionDueDate')}
               </label>
               <input
                 type="date"
@@ -968,38 +972,38 @@ const DeliveryPaymentStep: React.FC<WizardDataProps> = ({ data, onDataChange })
 
             <div>
               <label className="block text-sm font-medium text-[var(--text-secondary)] mb-2">
-                Production Batch Number
+                {t('customerOrder.deliveryPayment.productionBatchNumber')}
               </label>
               <input
                 type="text"
                 value={orderData.productionBatchNumber}
                 onChange={(e) => handleOrderDataChange({ ...orderData, productionBatchNumber: e.target.value })}
-                placeholder="BATCH-001"
+                placeholder={t('customerOrder.messages.productionBatchNumberPlaceholder')}
                 className="w-full px-3 py-2 border border-[var(--border-secondary)] rounded-lg focus:outline-none focus:ring-2 focus:ring-[var(--color-primary)] bg-[var(--bg-primary)] text-[var(--text-primary)]"
               />
             </div>
 
             <div>
               <label className="block text-sm font-medium text-[var(--text-secondary)] mb-2">
-                Delivery Time Window
+                {t('customerOrder.deliveryPayment.deliveryTimeWindow')}
               </label>
               <input
                 type="text"
                 value={orderData.deliveryTimeWindow}
                 onChange={(e) => handleOrderDataChange({ ...orderData, deliveryTimeWindow: e.target.value })}
-                placeholder="E.g., 9:00 AM - 11:00 AM"
+                placeholder={t('customerOrder.deliveryPayment.deliveryTimeWindowPlaceholder')}
                 className="w-full px-3 py-2 border border-[var(--border-secondary)] rounded-lg focus:outline-none focus:ring-2 focus:ring-[var(--color-primary)] bg-[var(--bg-primary)] text-[var(--text-primary)]"
               />
             </div>
 
             <div className="md:col-span-2">
               <label className="block text-sm font-medium text-[var(--text-secondary)] mb-2">
-                Production Notes
+                {t('customerOrder.deliveryPayment.productionNotes')}
               </label>
               <textarea
                 value={orderData.productionNotes}
                 onChange={(e) => handleOrderDataChange({ ...orderData, productionNotes: e.target.value })}
-                placeholder="Special production requirements or notes"
+                placeholder={t('customerOrder.deliveryPayment.productionNotesPlaceholder')}
                 rows={2}
                 className="w-full px-3 py-2 border border-[var(--border-secondary)] rounded-lg focus:outline-none focus:ring-2 focus:ring-[var(--color-primary)] bg-[var(--bg-primary)] text-[var(--text-primary)]"
               />
@@ -1010,51 +1014,51 @@ const DeliveryPaymentStep: React.FC<WizardDataProps> = ({ data, onDataChange })
         {/* Fulfillment & Tracking */}
         <div className="space-y-4 border-t border-[var(--border-primary)] pt-4">
           <h5 className="text-xs font-semibold text-[var(--text-secondary)] uppercase tracking-wider">
-            Fulfillment & Tracking
+            {t('customerOrder.sections.fulfillmentTracking')}
           </h5>
           <div className="grid grid-cols-1 md:grid-cols-2 gap-4">
             <div>
               <label className="block text-sm font-medium text-[var(--text-secondary)] mb-2">
-                Shipping Tracking Number
+                {t('customerOrder.deliveryPayment.shippingTrackingNumber')}
               </label>
               <input
                 type="text"
                 value={orderData.shippingTrackingNumber}
                 onChange={(e) => handleOrderDataChange({ ...orderData, shippingTrackingNumber: e.target.value })}
-                placeholder="Tracking number"
+                placeholder={t('customerOrder.deliveryPayment.shippingTrackingNumberPlaceholder')}
                 className="w-full px-3 py-2 border border-[var(--border-secondary)] rounded-lg focus:outline-none focus:ring-2 focus:ring-[var(--color-primary)] bg-[var(--bg-primary)] text-[var(--text-primary)]"
               />
             </div>
 
             <div>
               <label className="block text-sm font-medium text-[var(--text-secondary)] mb-2">
-                Shipping Carrier
+                {t('customerOrder.deliveryPayment.shippingCarrier')}
               </label>
               <input
                 type="text"
                 value={orderData.shippingCarrier}
                 onChange={(e) => handleOrderDataChange({ ...orderData, shippingCarrier: e.target.value })}
-                placeholder="E.g., DHL, UPS, FedEx"
+                placeholder={t('customerOrder.deliveryPayment.shippingCarrierPlaceholder')}
                 className="w-full px-3 py-2 border border-[var(--border-secondary)] rounded-lg focus:outline-none focus:ring-2 focus:ring-[var(--color-primary)] bg-[var(--bg-primary)] text-[var(--text-primary)]"
               />
             </div>
 
             <div>
               <label className="block text-sm font-medium text-[var(--text-secondary)] mb-2">
-                Pickup Location
+                {t('customerOrder.deliveryPayment.pickupLocation')}
               </label>
               <input
                 type="text"
                 value={orderData.pickupLocation}
                 onChange={(e) => handleOrderDataChange({ ...orderData, pickupLocation: e.target.value })}
-                placeholder="Store location for pickup"
+                placeholder={t('customerOrder.deliveryPayment.pickupLocationPlaceholder')}
                 className="w-full px-3 py-2 border border-[var(--border-secondary)] rounded-lg focus:outline-none focus:ring-2 focus:ring-[var(--color-primary)] bg-[var(--bg-primary)] text-[var(--text-primary)]"
               />
             </div>
 
             <div>
               <label className="block text-sm font-medium text-[var(--text-secondary)] mb-2">
-                Actual Delivery Date
+                {t('customerOrder.deliveryPayment.actualDeliveryDate')}
               </label>
               <input
                 type="date"
@@ -1069,51 +1073,51 @@ const DeliveryPaymentStep: React.FC<WizardDataProps> = ({ data, onDataChange })
         {/* Source & Channel */}
         <div className="space-y-4 border-t border-[var(--border-primary)] pt-4">
           <h5 className="text-xs font-semibold text-[var(--text-secondary)] uppercase tracking-wider">
-            Source & Channel
+            {t('customerOrder.sections.sourceChannel')}
           </h5>
           <div className="grid grid-cols-1 md:grid-cols-2 gap-4">
             <div>
               <label className="block text-sm font-medium text-[var(--text-secondary)] mb-2">
-                Order Source
+                {t('customerOrder.deliveryPayment.orderSource')}
               </label>
               <select
                 value={orderData.orderSource}
                 onChange={(e) => handleOrderDataChange({ ...orderData, orderSource: e.target.value })}
                 className="w-full px-3 py-2 border border-[var(--border-secondary)] rounded-lg focus:outline-none focus:ring-2 focus:ring-[var(--color-primary)] bg-[var(--bg-primary)] text-[var(--text-primary)]"
               >
-                <option value="manual">Manual</option>
-                <option value="phone">Phone</option>
-                <option value="email">Email</option>
-                <option value="website">Website</option>
-                <option value="app">Mobile App</option>
+                <option value="manual">{t('customerOrder.orderSources.manual')}</option>
+                <option value="phone">{t('customerOrder.orderSources.phone')}</option>
+                <option value="email">{t('customerOrder.orderSources.email')}</option>
+                <option value="website">{t('customerOrder.orderSources.website')}</option>
+                <option value="app">{t('customerOrder.orderSources.app')}</option>
               </select>
             </div>
 
             <div>
               <label className="block text-sm font-medium text-[var(--text-secondary)] mb-2">
-                Sales Channel
+                {t('customerOrder.deliveryPayment.salesChannel')}
               </label>
               <select
                 value={orderData.salesChannel}
                 onChange={(e) => handleOrderDataChange({ ...orderData, salesChannel: e.target.value })}
                 className="w-full px-3 py-2 border border-[var(--border-secondary)] rounded-lg focus:outline-none focus:ring-2 focus:ring-[var(--color-primary)] bg-[var(--bg-primary)] text-[var(--text-primary)]"
               >
-                <option value="direct">Direct</option>
-                <option value="wholesale">Wholesale</option>
-                <option value="retail">Retail</option>
-                <option value="online">Online</option>
+                <option value="direct">{t('customerOrder.salesChannels.direct')}</option>
+                <option value="wholesale">{t('customerOrder.salesChannels.wholesale')}</option>
+                <option value="retail">{t('customerOrder.salesChannels.retail')}</option>
+                <option value="online">{t('customerOrder.salesChannels.online')}</option>
               </select>
             </div>
 
             <div className="md:col-span-2">
               <label className="block text-sm font-medium text-[var(--text-secondary)] mb-2">
-                Sales Representative ID
+                {t('customerOrder.deliveryPayment.salesRepId')}
               </label>
               <input
                 type="text"
                 value={orderData.salesRepId}
                 onChange={(e) => handleOrderDataChange({ ...orderData, salesRepId: e.target.value })}
-                placeholder="Sales rep ID or name"
+                placeholder={t('customerOrder.deliveryPayment.salesRepIdPlaceholder')}
                 className="w-full px-3 py-2 border border-[var(--border-secondary)] rounded-lg focus:outline-none focus:ring-2 focus:ring-[var(--color-primary)] bg-[var(--bg-primary)] text-[var(--text-primary)]"
               />
             </div>
@@ -1123,30 +1127,30 @@ const DeliveryPaymentStep: React.FC<WizardDataProps> = ({ data, onDataChange })
         {/* Communication & Notes */}
         <div className="space-y-4 border-t border-[var(--border-primary)] pt-4">
           <h5 className="text-xs font-semibold text-[var(--text-secondary)] uppercase tracking-wider">
-            Communication & Notes
+            {t('customerOrder.sections.communicationNotes')}
           </h5>
           <div className="grid grid-cols-1 gap-4">
             <div>
               <label className="block text-sm font-medium text-[var(--text-secondary)] mb-2">
-                Customer Purchase Order #
+                {t('customerOrder.deliveryPayment.customerPurchaseOrder')}
               </label>
               <input
                 type="text"
                 value={orderData.customerPurchaseOrder}
                 onChange={(e) => handleOrderDataChange({ ...orderData, customerPurchaseOrder: e.target.value })}
-                placeholder="Customer's PO number"
+                placeholder={t('customerOrder.deliveryPayment.customerPurchaseOrderPlaceholder')}
                 className="w-full px-3 py-2 border border-[var(--border-secondary)] rounded-lg focus:outline-none focus:ring-2 focus:ring-[var(--color-primary)] bg-[var(--bg-primary)] text-[var(--text-primary)]"
               />
             </div>
 
             <div>
               <label className="block text-sm font-medium text-[var(--text-secondary)] mb-2">
-                Delivery Instructions
+                {t('customerOrder.deliveryPayment.deliveryInstructions')}
               </label>
               <textarea
                 value={orderData.deliveryInstructions}
                 onChange={(e) => handleOrderDataChange({ ...orderData, deliveryInstructions: e.target.value })}
-                placeholder="Special delivery instructions"
+                placeholder={t('customerOrder.deliveryPayment.deliveryInstructionsPlaceholder')}
                 rows={2}
                 className="w-full px-3 py-2 border border-[var(--border-secondary)] rounded-lg focus:outline-none focus:ring-2 focus:ring-[var(--color-primary)] bg-[var(--bg-primary)] text-[var(--text-primary)]"
               />
@@ -1154,12 +1158,12 @@ const DeliveryPaymentStep: React.FC<WizardDataProps> = ({ data, onDataChange })
 
             <div>
               <label className="block text-sm font-medium text-[var(--text-secondary)] mb-2">
-                Special Instructions
+                {t('customerOrder.deliveryPayment.specialInstructions')}
               </label>
               <textarea
                 value={orderData.specialInstructions}
                 onChange={(e) => handleOrderDataChange({ ...orderData, specialInstructions: e.target.value })}
-                placeholder="Any special requirements or instructions"
+                placeholder={t('customerOrder.deliveryPayment.specialInstructionsPlaceholder')}
                 rows={2}
                 className="w-full px-3 py-2 border border-[var(--border-secondary)] rounded-lg focus:outline-none focus:ring-2 focus:ring-[var(--color-primary)] bg-[var(--bg-primary)] text-[var(--text-primary)]"
               />
@@ -1167,12 +1171,12 @@ const DeliveryPaymentStep: React.FC<WizardDataProps> = ({ data, onDataChange })
 
             <div>
               <label className="block text-sm font-medium text-[var(--text-secondary)] mb-2">
-                Internal Notes
+                {t('customerOrder.deliveryPayment.internalNotes')}
               </label>
               <textarea
                 value={orderData.internalNotes}
                 onChange={(e) => handleOrderDataChange({ ...orderData, internalNotes: e.target.value })}
-                placeholder="Internal notes (not visible to customer)"
+                placeholder={t('customerOrder.deliveryPayment.internalNotesPlaceholder')}
                 rows={2}
                 className="w-full px-3 py-2 border border-[var(--border-secondary)] rounded-lg focus:outline-none focus:ring-2 focus:ring-[var(--color-primary)] bg-[var(--bg-primary)] text-[var(--text-primary)]"
               />
@@ -1180,12 +1184,12 @@ const DeliveryPaymentStep: React.FC<WizardDataProps> = ({ data, onDataChange })
 
             <div>
               <label className="block text-sm font-medium text-[var(--text-secondary)] mb-2">
-                Customer Notes
+                {t('customerOrder.deliveryPayment.customerNotes')}
               </label>
               <textarea
                 value={orderData.customerNotes}
                 onChange={(e) => handleOrderDataChange({ ...orderData, customerNotes: e.target.value })}
-                placeholder="Notes from/for the customer"
+                placeholder={t('customerOrder.deliveryPayment.customerNotesPlaceholder')}
                 rows={2}
                 className="w-full px-3 py-2 border border-[var(--border-secondary)] rounded-lg focus:outline-none focus:ring-2 focus:ring-[var(--color-primary)] bg-[var(--bg-primary)] text-[var(--text-primary)]"
               />
@@ -1196,7 +1200,7 @@ const DeliveryPaymentStep: React.FC<WizardDataProps> = ({ data, onDataChange })
         {/* Notifications */}
         <div className="space-y-4 border-t border-[var(--border-primary)] pt-4">
           <h5 className="text-xs font-semibold text-[var(--text-secondary)] uppercase tracking-wider">
-            Notifications
+            {t('customerOrder.sections.notifications')}
           </h5>
           <div className="grid grid-cols-1 md:grid-cols-2 gap-4">
             <div className="flex items-center gap-2">
@@ -1207,7 +1211,7 @@ const DeliveryPaymentStep: React.FC<WizardDataProps> = ({ data, onDataChange })
                 className="rounded border-[var(--border-secondary)] text-[var(--color-primary)] focus:ring-[var(--color-primary)]"
               />
               <label className="text-sm text-[var(--text-secondary)]">
-                Notify on Status Change
+                {t('customerOrder.deliveryPayment.notifyOnStatusChange')}
               </label>
             </div>
 
@@ -1219,32 +1223,32 @@ const DeliveryPaymentStep: React.FC<WizardDataProps> = ({ data, onDataChange })
                 className="rounded border-[var(--border-secondary)] text-[var(--color-primary)] focus:ring-[var(--color-primary)]"
               />
               <label className="text-sm text-[var(--text-secondary)]">
-                Notify on Delivery
+                {t('customerOrder.deliveryPayment.notifyOnDelivery')}
               </label>
             </div>
 
             <div>
               <label className="block text-sm font-medium text-[var(--text-secondary)] mb-2">
-                Notification Email
+                {t('customerOrder.deliveryPayment.notificationEmail')}
               </label>
               <input
                 type="email"
                 value={orderData.customerNotificationEmail}
                 onChange={(e) => handleOrderDataChange({ ...orderData, customerNotificationEmail: e.target.value })}
-                placeholder="customer@email.com"
+                placeholder={t('customerOrder.deliveryPayment.notificationEmailPlaceholder')}
                 className="w-full px-3 py-2 border border-[var(--border-secondary)] rounded-lg focus:outline-none focus:ring-2 focus:ring-[var(--color-primary)] bg-[var(--bg-primary)] text-[var(--text-primary)]"
               />
             </div>
 
             <div>
               <label className="block text-sm font-medium text-[var(--text-secondary)] mb-2">
-                Notification Phone
+                {t('customerOrder.deliveryPayment.notificationPhone')}
               </label>
               <input
                 type="tel"
                 value={orderData.customerNotificationPhone}
                 onChange={(e) => handleOrderDataChange({ ...orderData, customerNotificationPhone: e.target.value })}
-                placeholder="+34 123 456 789"
+                placeholder={t('customerOrder.deliveryPayment.phoneNumberPlaceholder')}
                 className="w-full px-3 py-2 border border-[var(--border-secondary)] rounded-lg focus:outline-none focus:ring-2 focus:ring-[var(--color-primary)] bg-[var(--bg-primary)] text-[var(--text-primary)]"
               />
             </div>
@@ -1254,7 +1258,7 @@ const DeliveryPaymentStep: React.FC<WizardDataProps> = ({ data, onDataChange })
         {/* Quality & Requirements */}
         <div className="space-y-4 border-t border-[var(--border-primary)] pt-4">
           <h5 className="text-xs font-semibold text-[var(--text-secondary)] uppercase tracking-wider">
-            Quality & Requirements
+            {t('customerOrder.sections.qualityRequirements')}
           </h5>
           <div className="grid grid-cols-1 md:grid-cols-2 gap-4">
             <div className="flex items-center gap-2">
@@ -1265,48 +1269,48 @@ const DeliveryPaymentStep: React.FC<WizardDataProps> = ({ data, onDataChange })
                 className="rounded border-[var(--border-secondary)] text-[var(--color-primary)] focus:ring-[var(--color-primary)]"
               />
               <label className="text-sm text-[var(--text-secondary)]">
-                Quality Check Required
+                {t('customerOrder.deliveryPayment.qualityCheckRequired')}
               </label>
             </div>
 
             <div>
               <label className="block text-sm font-medium text-[var(--text-secondary)] mb-2">
-                Quality Check Status
+                {t('customerOrder.deliveryPayment.qualityCheckStatus')}
               </label>
               <select
                 value={orderData.qualityCheckStatus}
                 onChange={(e) => handleOrderDataChange({ ...orderData, qualityCheckStatus: e.target.value })}
                 className="w-full px-3 py-2 border border-[var(--border-secondary)] rounded-lg focus:outline-none focus:ring-2 focus:ring-[var(--color-primary)] bg-[var(--bg-primary)] text-[var(--text-primary)]"
               >
-                <option value="">Not Started</option>
-                <option value="pending">Pending</option>
-                <option value="passed">Passed</option>
-                <option value="failed">Failed</option>
+                <option value="">{t('customerOrder.qualityCheckStatuses.not_started')}</option>
+                <option value="pending">{t('customerOrder.qualityCheckStatuses.pending')}</option>
+                <option value="passed">{t('customerOrder.qualityCheckStatuses.passed')}</option>
+                <option value="failed">{t('customerOrder.qualityCheckStatuses.failed')}</option>
               </select>
             </div>
 
             <div>
               <label className="block text-sm font-medium text-[var(--text-secondary)] mb-2">
-                Packaging Instructions
+                {t('customerOrder.deliveryPayment.packagingInstructions')}
               </label>
               <input
                 type="text"
                 value={orderData.packagingInstructions}
                 onChange={(e) => handleOrderDataChange({ ...orderData, packagingInstructions: e.target.value })}
-                placeholder="Special packaging requirements"
+                placeholder={t('customerOrder.deliveryPayment.packagingInstructionsPlaceholder')}
                 className="w-full px-3 py-2 border border-[var(--border-secondary)] rounded-lg focus:outline-none focus:ring-2 focus:ring-[var(--color-primary)] bg-[var(--bg-primary)] text-[var(--text-primary)]"
               />
             </div>
 
             <div>
               <label className="block text-sm font-medium text-[var(--text-secondary)] mb-2">
-                Labeling Requirements
+                {t('customerOrder.deliveryPayment.labelingRequirements')}
               </label>
               <input
                 type="text"
                 value={orderData.labelingRequirements}
                 onChange={(e) => handleOrderDataChange({ ...orderData, labelingRequirements: e.target.value })}
-                placeholder="Custom label requirements"
+                placeholder={t('customerOrder.deliveryPayment.labelingRequirementsPlaceholder')}
                 className="w-full px-3 py-2 border border-[var(--border-secondary)] rounded-lg focus:outline-none focus:ring-2 focus:ring-[var(--color-primary)] bg-[var(--bg-primary)] text-[var(--text-primary)]"
               />
             </div>
@@ -1316,7 +1320,7 @@ const DeliveryPaymentStep: React.FC<WizardDataProps> = ({ data, onDataChange })
         {/* Additional Options */}
         <div className="space-y-4 border-t border-[var(--border-primary)] pt-4">
           <h5 className="text-xs font-semibold text-[var(--text-secondary)] uppercase tracking-wider">
-            Additional Options
+            {t('customerOrder.sections.additionalOptions')}
           </h5>
           <div className="grid grid-cols-1 gap-4">
             <div className="flex items-center gap-2">
@@ -1327,20 +1331,20 @@ const DeliveryPaymentStep: React.FC<WizardDataProps> = ({ data, onDataChange })
                 className="rounded border-[var(--border-secondary)] text-[var(--color-primary)] focus:ring-[var(--color-primary)]"
               />
               <label className="text-sm text-[var(--text-secondary)]">
-                Recurring Order
+                {t('customerOrder.deliveryPayment.recurringOrder')}
               </label>
             </div>
 
             {orderData.isRecurring && (
               <div>
                 <label className="block text-sm font-medium text-[var(--text-secondary)] mb-2">
-                  Recurring Schedule
+                  {t('customerOrder.deliveryPayment.recurringSchedule')}
                 </label>
                 <input
                   type="text"
                   value={orderData.recurringSchedule}
                   onChange={(e) => handleOrderDataChange({ ...orderData, recurringSchedule: e.target.value })}
-                  placeholder="E.g., Weekly on Mondays, Every 2 weeks"
+                  placeholder={t('customerOrder.deliveryPayment.recurringSchedulePlaceholder')}
                   className="w-full px-3 py-2 border border-[var(--border-secondary)] rounded-lg focus:outline-none focus:ring-2 focus:ring-[var(--color-primary)] bg-[var(--bg-primary)] text-[var(--text-primary)]"
                 />
               </div>
@@ -1348,8 +1352,8 @@ const DeliveryPaymentStep: React.FC<WizardDataProps> = ({ data, onDataChange })
 
             <div>
               <label className="block text-sm font-medium text-[var(--text-secondary)] mb-2">
-                Tags
-                <Tooltip content="Comma-separated tags for easier search and filtering">
+                {t('customerOrder.deliveryPayment.tags')}
+                <Tooltip content={t('customerOrder.deliveryPayment.tagsTooltip')}>
                   <Info className="inline w-4 h-4 ml-1 text-[var(--text-tertiary)]" />
                 </Tooltip>
               </label>
@@ -1357,22 +1361,22 @@ const DeliveryPaymentStep: React.FC<WizardDataProps> = ({ data, onDataChange })
                 type="text"
                 value={orderData.tags}
                 onChange={(e) => handleOrderDataChange({ ...orderData, tags: e.target.value })}
-                placeholder="urgent, vip, wholesale"
+                placeholder={t('customerOrder.deliveryPayment.tagsPlaceholder')}
                 className="w-full px-3 py-2 border border-[var(--border-secondary)] rounded-lg focus:outline-none focus:ring-2 focus:ring-[var(--color-primary)] bg-[var(--bg-primary)] text-[var(--text-primary)]"
               />
             </div>
 
             <div>
               <label className="block text-sm font-medium text-[var(--text-secondary)] mb-2">
-                Metadata (JSON)
-                <Tooltip content="Additional custom data in JSON format">
+                {t('customerOrder.deliveryPayment.metadata')}
+                <Tooltip content={t('customerOrder.deliveryPayment.metadataTooltip')}>
                   <Info className="inline w-4 h-4 ml-1 text-[var(--text-tertiary)]" />
                 </Tooltip>
               </label>
               <textarea
                 value={orderData.metadata}
                 onChange={(e) => handleOrderDataChange({ ...orderData, metadata: e.target.value })}
-                placeholder='{"custom_field": "value"}'
+                placeholder={t('customerOrder.deliveryPayment.metadataPlaceholder')}
                 rows={2}
                 className="w-full px-3 py-2 border border-[var(--border-secondary)] rounded-lg focus:outline-none focus:ring-2 focus:ring-[var(--color-primary)] bg-[var(--bg-primary)] text-[var(--text-primary)] font-mono text-xs"
               />
@@ -1390,7 +1394,7 @@ export const CustomerOrderWizardSteps = (
 ): WizardStep[] => [
   {
     id: 'customer-selection',
-    title: 'Select Customer',
+    title: 'customerOrder.customerSelection.title',
     component: (props) => <CustomerSelectionStep {...props} data={data} onDataChange={setData} />,
     validate: () => {
       return !!(data.customer || (data.showNewCustomerForm && data.newCustomerName && data.newCustomerPhone));
@@ -1398,7 +1402,7 @@ export const CustomerOrderWizardSteps = (
   },
   {
     id: 'order-items',
-    title: 'Order Items',
+    title: 'customerOrder.orderItems.title',
     component: (props) => <OrderItemsStep {...props} data={data} onDataChange={setData} />,
     validate: () => {
       return !!(data.orderItems && data.orderItems.length > 0);
@@ -1406,7 +1410,7 @@ export const CustomerOrderWizardSteps = (
   },
   {
     id: 'delivery-payment',
-    title: 'Delivery & Payment',
+    title: 'customerOrder.deliveryPayment.title',
     component: (props) => <DeliveryPaymentStep {...props} data={data} onDataChange={setData} />,
     validate: () => {
       return !!(