feat: ui update

miniprogram/pages/order/order.wxss

@@ -1,3 +1,4 @@
+/** 订单：下划线筛选 + 描边状态胶囊 + tabular 倒计时 **/
 .page-flex {
   height: 100vh;
   display: flex;
@@ -10,113 +11,87 @@
   height: 0;
 }
 
-.filter-scroll {
-  background: #fff;
-  white-space: nowrap;
+.segbar {
+  position: sticky;
+  top: 0;
+  z-index: 20;
+  margin-top: 36rpx;
+  background: var(--glass);
+  -webkit-backdrop-filter: saturate(180%) blur(20px);
+  backdrop-filter: saturate(180%) blur(20px);
+  border-bottom: 1rpx solid var(--hairline);
 }
 
-.filter-row {
-  display: inline-flex;
-  padding: 20rpx 24rpx;
+.od-list {
+  padding: 40rpx var(--pad) 0;
+  display: flex;
+  flex-direction: column;
+  gap: 40rpx;
 }
 
-.filter-item {
-  flex-shrink: 0;
-  padding: 0 28rpx;
-  height: 56rpx;
-  line-height: 56rpx;
-  border-radius: 28rpx;
-  font-size: 24rpx;
-  color: #3C3C43;
-  background: #F2F2F7;
-  margin-right: 16rpx;
+.od-card {
+  padding-bottom: 36rpx;
+  border-bottom: 1rpx solid var(--hairline);
 }
 
-.filter-item.active {
-  background: #007AFF;
-  color: #fff;
-}
-
-.list {
-  padding: 24rpx;
-}
-
-.order-card {
-  margin-bottom: 20rpx;
-  padding: 28rpx;
-}
-
-.order-top {
+.od-top {
   display: flex;
   align-items: center;
-  justify-content: space-between;
+  gap: 14rpx;
 }
 
-.order-no {
-  font-size: 24rpx;
-  color: #8E8E93;
+.od-no {
+  flex: 1;
+  font-size: 23rpx;
+  color: var(--ink-3);
 }
 
-.order-body {
-  margin-top: 20rpx;
-}
-
-.order-goods {
-  font-size: 30rpx;
-  font-weight: 600;
-  color: #000;
-}
-
-.order-benefit {
-  font-size: 24rpx;
-  color: #8E8E93;
-  margin-top: 6rpx;
-}
-
-.order-bottom {
-  display: flex;
-  align-items: center;
-  justify-content: space-between;
+.od-goods {
   margin-top: 24rpx;
+  font-family: var(--serif);
+  font-size: 34rpx;
+  line-height: 1.35;
 }
 
-.order-amount {
-  font-size: 26rpx;
-  color: #3C3C43;
+.od-benefit {
+  margin-top: 10rpx;
+  font-size: 23rpx;
+  color: var(--ink-2);
 }
 
-.order-amount .num {
-  font-size: 32rpx;
-  font-weight: 600;
-  color: #000;
+.od-bottom {
+  margin-top: 28rpx;
+  display: flex;
+  align-items: center;
+  gap: 20rpx;
 }
 
-.order-actions {
+.od-amount {
+  flex: 1;
+  font-size: 24rpx;
+  color: var(--ink-2);
+}
+
+.od-amount .num {
+  font-family: var(--serif);
+  font-size: 36rpx;
+  color: var(--ink);
+}
+
+.od-actions {
   display: flex;
   align-items: center;
   gap: 16rpx;
 }
 
-.countdown {
-  font-size: 24rpx;
-  color: #8E8E93;
+.od-countdown {
+  font-size: 23rpx;
+  color: var(--ink-3);
+  font-family: var(--serif);
 }
 
-.action-btn {
-  height: 56rpx;
-  padding: 0 28rpx;
-  border-radius: 28rpx;
-  font-size: 24rpx;
-  display: flex;
-  align-items: center;
-}
-
-.action-btn.outline {
-  border: 1rpx solid #C7C7CC;
-  color: #3C3C43;
-}
-
-.action-btn.primary {
-  background: #007AFF;
-  color: #fff;
+.od-refund-input {
+  margin: 0 var(--pad);
+  width: auto;
+  display: block;
 }