/* pages/order/detail/detail.wxss */ page { width: 750rpx; min-height: 100vh; background: linear-gradient(180deg, #ebf4fd 0%, #FFF 100%); padding-bottom: 50rpx; background-attachment: fixed; } .navBar { position: fixed; left: 25rpx; z-index: 10; border: 1px solid #ccc; border-radius: 50px; width: 165rpx; background: #fff; display: flex; flex-direction: row; justify-content: space-around; padding-right: 14rpx; height: 30px; opacity: 0.8; } .topBg { width: 750rpx; position: relative; z-index: 1; padding: 150rpx 30rpx 0; overflow: hidden; } .topBg .bg { height: 536rpx; } .topBg .title { font-size: 40rpx; font-weight: 500; color: #191C27; margin-bottom: 32rpx; } .zhifu { width: 702rpx; height: 230rpx; background: #FFFFFF; border-radius: 12rpx; margin: 24rpx 0; flex-direction: column; justify-content: space-between; align-items: flex-start; padding: 24rpx; } .zhifu .tips { font-size: 32rpx; font-weight: 500; color: #191C27; } .zhifu .price { font-size: 26rpx; color: #666666; } .zhifu .footer .btn { width: 152rpx; height: 60rpx; border-radius: 30rpx; text-align: center; line-height: 60rpx; font-size: 28rpx; margin-right: 24rpx; } .contioner { width: 702rpx; background: #FFFFFF; border-radius: 12rpx; margin: 0 auto 24rpx; padding: 0rpx 24rpx 32rpx; } .contioner .tit { font-size: 32rpx; font-weight: 500; color: #191C27; padding: 32rpx 0; } .payMessage .items { padding-bottom: 24rpx; } .payMessage .items .le .message { width: 120rpx; height: 120rpx; background: #FFFFFF; border-radius: 4rpx; border: 1px solid #EDEDED; margin-right: 24rpx; } .payMessage .items .le .name { font-size: 28rpx; color: #191C27; width: 505rpx; height: 70rpx; margin-bottom: 24rpx; } .payMessage .items .le .num { font-size: 28rpx; color: #999999; } .payMessage .items .lr { font-size: 28rpx; color: #191C27; } .payMessage .items .footer { margin-top: 20rpx; color: #191C27; font-size: 28rpx; } .payMessage .items .footer .content { margin-left: 32rpx; font-size: 24rpx; color: #191C27; } .payMessage .items .footer .t2 { color: #999999; } .payMessage .items .footer .price { margin-left: auto; } .orderMessage .items { padding: 32rpx 0; font-size: 28rpx; color: #191C27; } .orderMessage .items .lr.color { color: #FF663D; } .payMessage .allPrice { padding-top: 24rpx; font-size: 28rpx; color: #191C27; } .payMessage .allPrice .num { font-size: 40rpx; font-weight: 500; margin-left: 12rpx; } .footerBoxs { padding: 16rpx 0 0; } .footerBoxs .footerItems { padding: 16rpx 0; font-size: 28rpx; } .footerBoxs .footerItems .les { color: #999999; } .footerBoxs .footerItems .lrs { color: #191C27; text-align: right; } .footerBoxs .footerItems .btn { font-size: 22rpx; color: #191C27; line-height: 34rpx; width: 82rpx; height: 34rpx; border-radius: 4rpx; border: 1px solid #CCCCCC; margin-left: 16rpx; } .statusBox { width: 702rpx; background: #FFFFFF; border-radius: 12rpx; margin: 24rpx 0; padding: 32rpx 24rpx; } .statusBox .statusTips { font-size: 32rpx; font-weight: bold; color: #191C27; } .statusBox .statusTime { font-size: 26rpx; color: #666666; margin-top: 24rpx; } .statusBox .statusBtn { margin: 32rpx 0; } .statusBox .statusBtn .btn { width: 152rpx; height: 60rpx; line-height: 60rpx; border-radius: 30rpx; margin-right: 24rpx; font-size: 24rpx; } .statusBox .statusFooter { margin-top: 32rpx; } .statusFooter .top .lr text { font-size: 26rpx; color: #191C27; } .statusFooter .top .lr image { width: 39rpx; height: 39rpx; margin-right: 10rpx; } .statusFooter .top .le { font-size: 32rpx; font-weight: 500; color: #191C27; } .statusFooter .bottom { font-size: 28rpx; color: #191C27; margin-top: 32rpx; padding: 24rpx; background: #f6f6f6; border-radius: 8rpx; } .remarks { padding-top: 32rpx; font-size: 28rpx; color: #666666; }