أريد منك تنفيذ ميزة جديدة في نظام ERP:

########################################
# ميزة: طباعة الطلب (Invoice + Service Tickets)
########################################

عند الانتهاء من إنشاء الطلب، يجب أن يكون هناك زر واحد اسمه:

📌 "طباعة الطلب"

هذا الزر عند الضغط عليه يجب أن يقوم بما يلي:

1) طباعة **الفاتورة الكاملة** الخاصة بالطلب  
2) طباعة **قصاصات الخدمات** لكل خدمة موجودة في الطلب  

ويتم طباعتها معاً في أمر طباعة واحد.  
وأيضاً عند الضغط على **Ctrl + P** في المتصفح، يجب أن تتم طباعة نفس النتيجة (الاثنين معاً).

========================================
# المتطلبات الفنية
========================================

### 1) في صفحة الطباعة
أنشئ عنصر رئيسي يحتوي على:
- قسم الفاتورة (invoice-section#)
- قسم قصاصات الخدمات (service-tickets-section#)

مثل هذا:

<div id="print-root">
    <div id="invoice-section">عرض الفاتورة</div>
    <div id="service-tickets-section">قصاصات الخدمات</div>
</div>

### 2) زر "طباعة الطلب"
يجب أن ينفذ:
window.print();

### 3) CSS للطباعة
استخدم @media print بحيث:

- يتم إخفاء كل عناصر الصفحة الأخرى مثل الأزرار والقائمة الجانبية
- يتم طباعة **invoice-section** أولاً
- ثم **service-ticket** لكل خدمة ويكون كل تذكرة لها page-break بعد الطباعة

أضِف هذا في ملف CSS:

@media print {
  .print-actions, .navbar, .sidebar { display: none !important; }

  #print-root {
    display: block;
  }

  #invoice-section {
    width: 58mm;
    margin: 0 auto;
    page-break-after: always;
  }

  #service-tickets-section {
    width: 58mm;
    margin: 0 auto;
  }

  .service-ticket {
    page-break-after: always;
  }
}

### 4) عند الضغط على Ctrl + P
يجب أن يظهر نفس شكل الطباعة:  
الصفحتان (الفاتورة + القصاصات).

### 5) كل قصاصة خدمة يجب أن تحتوي على:
- اسم العميل
- رقم الطلب
- اسم الخدمة
- الموظف المنفذ
- وقت الخدمة
- باركود للسطر (orderId-lineId)

### 6) زر “طباعة الفاتورة” و “طباعة قصاصات الخدمات”
ابقهم كما هم، لكن زر "طباعة الطلب" يجمعهما معاً.

########################################
# END
########################################
