优化套餐信息区域排版：1)改进容器样式，增加圆角和阴影；2)美化套餐元数据标签；3)将服务列表改为无序列表结构；4)添加响应式布局和悬停效果

pending_bookings.php

@@ -403,20 +403,88 @@ try {
         .package-info {
             background: #f8f9fa;
             border: 1px solid #e9ecef;
-            border-radius: 4px;
-            padding: 15px;
-            margin-bottom: 15px;
+            border-radius: 8px;
+            padding: 20px;
+            margin-bottom: 20px;
             display: none;
+            box-shadow: 0 2px 8px rgba(0, 0, 0, 0.08);
+            transition: all 0.3s ease;
+        }
+        
+        .package-info:hover {
+            box-shadow: 0 4px 12px rgba(0, 0, 0, 0.12);
         }
         
         .package-details {
-            margin-bottom: 10px;
+            margin-bottom: 15px;
+        }
+        
+        .package-details h4 {
+            margin: 0 0 12px 0;
+            color: #2c3e50;
+            font-size: 18px;
+            font-weight: 600;
         }
         
         .package-meta {
             display: flex;
-            gap: 20px;
-            margin: 10px 0;
+            gap: 16px;
+            margin: 15px 0;
+            flex-wrap: wrap;
+            align-items: center;
+        }
+        
+        .package-meta span {
+            background: #e3f2fd;
+            color: #1976d2;
+            padding: 6px 12px;
+            border-radius: 20px;
+            font-size: 14px;
+            font-weight: 500;
+        }
+        
+        #packageServices_<?php echo $submission['id']; ?> {
+            margin-top: 15px;
+            padding: 15px;
+            background: #ffffff;
+            border: 1px solid #e0e0e0;
+            border-radius: 6px;
+        }
+        
+        #packageServices_<?php echo $submission['id']; ?> strong {
+            color: #2c3e50;
+            font-size: 16px;
+            display: block;
+            margin-bottom: 10px;
+        }
+        
+        #packageServices_<?php echo $submission['id']; ?> br {
+            display: none;
+        }
+        
+        #packageServices_<?php echo $submission['id']; ?>::before {
+            content: '';
+        }
+        
+        #packageServices_<?php echo $submission['id']; ?>::after {
+            content: '';
+        }
+        
+        .service-list {
+            margin: 10px 0 0 20px;
+            padding: 0;
+        }
+        
+        .service-list li {
+            margin-bottom: 6px;
+            color: #424242;
+            line-height: 1.6;
+            font-size: 15px;
+        }
+        
+        .service-list li::marker {
+            color: #1976d2;
+            font-weight: bold;
         }
         
         .booking-detail-item {
@@ -855,8 +923,8 @@ try {
                 const servicesContainer = document.getElementById('packageServices_' + submissionId);
                 if (servicesContainer) {
                     if (services && services.length > 0) {
-                        servicesContainer.innerHTML = '<strong>包含服务:</strong><br>' + 
-                            services.map(service => `• ${service}`).join('<br>');
+                        servicesContainer.innerHTML = '<strong>包含服务:</strong><ul class="service-list">' + 
+                            services.map(service => `<li>${service}</li>`).join('') + '</ul>';
                     } else {
                         servicesContainer.innerHTML = '';
                     }