page { background: #f7f7f7; } .statistics-container { padding: 20rpx; box-sizing: border-box; } .user-info { background: #FFFFFF; border-radius: 20rpx; padding: 30rpx; } .user-info .name { font-size: 32rpx; font-weight: bold; color: #333333; margin-bottom: 30rpx; display: flex; align-items: center; justify-content: space-between; } .user-info .address { font-size: 28rpx; font-weight: 400; color: #666666; padding-bottom: 30rpx; margin-bottom: 30rpx; border-bottom: 1px solid #EAEAEA; display: flex; align-items: center; justify-content: space-between; } .user-info .text { font-size: 30rpx; font-weight: 500; color: #333333; line-height: 46rpx; } .user-info .time { font-size: 30rpx; font-weight: 500; color: #999999; margin-top: 20rpx; } .card { background: #fff; border-radius: 20rpx; padding: 30rpx; margin-top: 20rpx; } .card .title { font-size: 34rpx; font-weight: bold; color: #333333; display: flex; align-items: center; margin-left: -30rpx; margin-bottom: 39rpx; position: relative; } .card .title:before { content: ''; display: block; width: 10rpx; height: 28rpx; background: #3A80E7; border-radius: 4rpx; margin-right: 20rpx; } .tag { display: inline-block; line-height: 40rpx; height: 40rpx; border-radius: 20rpx; font-size: 26rpx; font-weight: 500; padding: 0 20rpx; margin-right: 30rpx; } .blue { background: rgba(79, 148, 255, 0.14); color: #4F94FF; } .orange { background: rgba(255, 120, 60, 0.14); color: #FF783C; } .green { background: rgba(4, 184, 173, 0.14); color: #04B8AD; } .red { color: #FA1919; background: rgba(255, 48, 27, 0.14); } .tel-btn { width: 126rpx; height: 0; } .step-time { font-size: 26rpx; font-weight: 400; color: #999999; margin: 20rpx 0 30rpx; } .content { display: flex; font-weight: 400; color: #999999; } .label { white-space: nowrap; font-size: 30rpx; margin-bottom: 22rpx; } .value { color: #333; } .step-title { font-size: 32rpx; font-weight: 500; color: #333333; margin-left: -.5em; } .wux-step__icon { width: 20rpx!important; height: 20rpx!important; margin-left: 15rpx!important; border: none!important; background: #999999!important; } .wux-step--process .wux-step__icon { background: #3A80E7!important; } .wux-step--vertical .wux-step__ft { padding-top: 20rpx!important; } .bottom-btn-block { height: 200rpx; } .bottom-btn { background: #f7f7f7; display: flex; align-items: center; justify-content: space-between; padding: 20rpx 99rpx 20rpx; padding-bottom: calc(env(safe-area-inset-bottom) + 10rpx); position: fixed; bottom: 0; width: 100%; left: 0; box-sizing: border-box; z-index: 999; } .bottom-btn2 { background: #f7f7f7; display: flex; align-items: center; justify-content: center; padding: 20rpx 99rpx 20rpx; padding-bottom: calc(env(safe-area-inset-bottom) + 10rpx); position: fixed; bottom: 0; width: 100%; left: 0; box-sizing: border-box; z-index: 10; } .btn { width: 240rpx; height: 76rpx; border-radius: 38rpx; color: #fff; display: flex; align-items: center; justify-content: center; text-align: center; font-size: 32rpx; font-weight: bold; } .btn-blue { background: linear-gradient(87deg, #81B5FB 0%, #3E92FF 100%); } .btn-orange { background: linear-gradient(87deg, #FB9D5B 0%, #FF783C 100%); }