refactor: convert legacy color classes to tailwind syntax

Replace all custom `bg-*` utility classes across Vue components with Tailwind's arbitrary hex color notation (e.g. `bg-[#f7f7f7]`). Remove redundant hardcoded background color definitions from src/static/scss/background.scss, clean up template formatting, and update gradient button styles to use direct hex values.

src/pages-order/order/components/OrderCard/index.vue

@@ -1,8 +1,5 @@
 <template>
-  <view
-    class="order-card bg-white border-box p-12 rounded-12 m-12"
-    @click.stop="handleCardClick"
-  >
+  <view class="order-card bg-white border-box p-12 rounded-12 m-12" @click.stop="handleCardClick">
     <!-- 卡片头部 -->
     <view class="card-header flex items-center">
       <view class="status-info flex items-center flex-full">
@@ -11,13 +8,10 @@
           {{ getOrderTypeName() }}
         </view>
       </view>
-      <view
-        v-if="orderData.status !== 'pending'"
-        :class="[
-          'status-tag font-size-12',
-          `tag-${orderData.orderStatus || orderData.workOrderStatus}`,
-        ]"
-      >
+      <view v-if="orderData.status !== 'pending'" :class="[
+        'status-tag font-size-12',
+        `tag-${orderData.orderStatus || orderData.workOrderStatus}`,
+      ]">
         {{ getStatusText(orderData.orderStatus || orderData.workOrderStatus) }}
       </view>
     </view>
@@ -27,9 +21,8 @@
 
     <view v-if="orderData.orderStatus === '0'" class="text-right">
       <button
-        class="go-pay border-box border-none font-size-14 color-white bg-FF3D60 rounded-5 inline-block text-center line-height-30"
-        @click.stop="handleCardClick"
-      >
+        class="go-pay border-box border-none font-size-14 color-white bg-[#ff3d60] rounded-5 inline-block text-center line-height-30"
+        @click.stop="handleCardClick">
         去支付
       </button>
     </view>