.container.data-v-e8db6ceb { min-height: 100vh; background-color: #F8F9FB; display: flex; flex-direction: column; } .status-bar.data-v-e8db6ceb { height: env(safe-area-inset-top); background: #FFF; } .nav-bar.data-v-e8db6ceb { height: 88rpx; background: #FFF; display: flex; align-items: center; justify-content: space-between; padding: 0 30rpx; } .nav-bar .page-title.data-v-e8db6ceb { font-size: 34rpx; font-weight: bold; } .nav-bar .nav-left.data-v-e8db6ceb, .nav-bar .nav-right.data-v-e8db6ceb { width: 60rpx; } .nav-bar .back-icon.data-v-e8db6ceb { width: 40rpx; height: 40rpx; } .content.data-v-e8db6ceb { padding: 120rpx 40rpx 40rpx; flex: 1; display: flex; flex-direction: column; } .success-header.data-v-e8db6ceb { display: flex; flex-direction: column; align-items: center; margin-bottom: 80rpx; } .success-header .check-circle.data-v-e8db6ceb { width: 140rpx; height: 140rpx; background: #67C23A; border-radius: 50%; display: flex; align-items: center; justify-content: center; margin-bottom: 30rpx; } .success-header .check-circle .css-check.data-v-e8db6ceb { width: 60rpx; height: 30rpx; border-left: 7rpx solid #fff; border-bottom: 7rpx solid #fff; transform: rotate(-45deg); margin-top: -10rpx; } .success-header .success-title.data-v-e8db6ceb { font-size: 44rpx; font-weight: bold; color: #1A1A1A; margin-bottom: 16rpx; } .success-header .success-subtitle.data-v-e8db6ceb { font-size: 28rpx; color: #999; } .training-card.data-v-e8db6ceb { background: #FFF; border-radius: 32rpx; padding: 40rpx; box-shadow: 0 4rpx 24rpx rgba(0, 0, 0, 0.03); margin-bottom: 40rpx; } .training-card .card-header.data-v-e8db6ceb { display: flex; justify-content: space-between; align-items: center; margin-bottom: 40rpx; padding-bottom: 30rpx; border-bottom: 1rpx solid #F0F0F0; } .training-card .card-header .job-name.data-v-e8db6ceb { font-size: 36rpx; font-weight: bold; color: #1A1A1A; } .training-card .card-header .status-tag.data-v-e8db6ceb { background: #EBF2FF; color: #1F6CFF; font-size: 22rpx; padding: 6rpx 16rpx; border-radius: 30rpx; } .training-card .step-list.data-v-e8db6ceb { display: flex; flex-direction: column; gap: 40rpx; } .training-card .step-list .step-item.data-v-e8db6ceb { display: flex; align-items: center; position: relative; } .training-card .step-list .step-item.data-v-e8db6ceb::after { content: ""; position: absolute; left: 24rpx; top: 50rpx; bottom: -50rpx; width: 2rpx; background: #EEE; } .training-card .step-list .step-item.data-v-e8db6ceb:last-child::after { display: none; } .training-card .step-list .step-item .step-num.data-v-e8db6ceb { width: 48rpx; height: 48rpx; border-radius: 50%; background: #EEE; color: #999; display: flex; align-items: center; justify-content: center; font-size: 24rpx; font-weight: bold; margin-right: 30rpx; z-index: 1; } .training-card .step-list .step-item .step-info.data-v-e8db6ceb { flex: 1; } .training-card .step-list .step-item .step-info .s-title.data-v-e8db6ceb { font-size: 28rpx; font-weight: bold; color: #333; display: block; margin-bottom: 4rpx; } .training-card .step-list .step-item .step-info .s-desc.data-v-e8db6ceb { font-size: 22rpx; color: #999; display: block; } .training-card .step-list .step-item .step-status.data-v-e8db6ceb { font-size: 24rpx; color: #999; } .training-card .step-list .step-item.active .step-num.data-v-e8db6ceb { background: #E6F7FF; color: #1F6CFF; } .training-card .step-list .step-item.active .step-status.data-v-e8db6ceb { color: #1F6CFF; } .training-card .step-list .step-item.current .step-num.data-v-e8db6ceb { background: #1F6CFF; color: #FFF; } .training-card .step-list .step-item.current .s-title.data-v-e8db6ceb { color: #1F6CFF; } .action-section.data-v-e8db6ceb { margin-top: 60rpx; display: flex; flex-direction: column; align-items: center; } .action-section .start-btn.data-v-e8db6ceb { width: 100%; height: 100rpx; background: #1F6CFF; color: #FFF; border-radius: 50rpx; font-size: 32rpx; font-weight: bold; display: flex; align-items: center; justify-content: center; margin-bottom: 30rpx; box-shadow: 0 10rpx 20rpx rgba(31, 108, 255, 0.2); } .action-section .tip.data-v-e8db6ceb { font-size: 22rpx; color: #BBB; text-align: center; }