sj-miniprogram/unpackage/dist/dev/mp-weixin/pages/assessment/assessment.wxss

.container.data-v-cc3734ea {
  width: 100%;
  height: 100vh;
  background-color: #F8F9FB;
  position: relative;
  overflow: hidden;
}
.loading-box.data-v-cc3734ea {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  height: 80vh;
  padding-top: 200rpx;
}
.loading-box .loading-spinner.data-v-cc3734ea {
  width: 60rpx;
  height: 60rpx;
  border: 6rpx solid #f3f3f3;
  border-top: 6rpx solid #1F6CFF;
  border-radius: 50%;
  animation: spin-cc3734ea 1s linear infinite;
}
.loading-box .loading-text.data-v-cc3734ea {
  margin-top: 20rpx;
  font-size: 28rpx;
  color: #999;
}
@keyframes spin-cc3734ea {
0% {
    transform: rotate(0deg);
}
100% {
    transform: rotate(360deg);
}
}
.fixed-header.data-v-cc3734ea {
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  z-index: 100;
}
.gradient-section.data-v-cc3734ea {
  background: linear-gradient(180deg, #1F6CFF 0%, #FFFFFF 100%);
  padding: 0 40rpx 20rpx;
}
.search-bar.data-v-cc3734ea {
  background: rgba(255, 255, 255, 0.95);
  border-radius: 40rpx;
  display: flex;
  align-items: center;
  padding: 0 30rpx;
  box-shadow: 0 4rpx 20rpx rgba(31, 108, 255, 0.1);
  margin-right: 200rpx;
  height: 100%;
}
.search-bar .search-icon.data-v-cc3734ea {
  width: 32rpx;
  height: 32rpx;
  margin-right: 20rpx;
  opacity: 0.4;
}
.search-bar .search-input.data-v-cc3734ea {
  flex: 1;
  font-size: 28rpx;
}
.search-bar .ph-color.data-v-cc3734ea {
  color: #999;
}
.white-section.data-v-cc3734ea {
  background: #FFF;
  padding-bottom: 0;
}
.horizontal-tabs-wrap.data-v-cc3734ea {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 20rpx 40rpx;
}
.horizontal-tabs-wrap .main-tabs.data-v-cc3734ea {
  display: flex;
  gap: 40rpx;
}
.horizontal-tabs-wrap .main-tabs .main-tab.data-v-cc3734ea {
  font-size: 34rpx;
  font-weight: bold;
  color: #888;
  position: relative;
  padding-bottom: 10rpx;
}
.horizontal-tabs-wrap .main-tabs .main-tab.active.data-v-cc3734ea {
  color: #1A1A1A;
}
.horizontal-tabs-wrap .main-tabs .main-tab.active.data-v-cc3734ea:after {
  content: "";
  position: absolute;
  left: 50%;
  bottom: 0;
  transform: translateX(-50%);
  width: 36rpx;
  height: 6rpx;
  background: #1F6CFF;
  border-radius: 3rpx;
}
.horizontal-tabs-wrap .record-text.data-v-cc3734ea {
  font-size: 28rpx;
  color: #1F6CFF;
}
.filter-row.data-v-cc3734ea {
  display: flex;
  justify-content: space-between;
  padding: 20rpx 40rpx 20rpx;
}
.filter-row .filter-item.data-v-cc3734ea {
  font-size: 28rpx;
  color: #333;
  font-weight: 500;
  display: flex;
  align-items: center;
  transition: all 0.3s;
}
.filter-row .filter-item.active.data-v-cc3734ea {
  color: #1F6CFF;
}
.filter-row .filter-item .arrow-down.data-v-cc3734ea {
  width: 24rpx;
  height: 24rpx;
  margin-left: 8rpx;
  opacity: 0.3;
  transition: transform 0.3s;
}
.filter-row .filter-item .arrow-down.rotate.data-v-cc3734ea {
  transform: rotate(180deg);
  opacity: 0.8;
}
.dropdown-wrapper.data-v-cc3734ea {
  position: absolute;
  top: 100%;
  left: 0;
  right: 0;
  height: calc(100vh - 100%);
  z-index: 99;
}
.dropdown-wrapper .mask.data-v-cc3734ea {
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background: rgba(0, 0, 0, 0.4);
  animation: fadeIn-cc3734ea 0.3s ease-out;
}
.dropdown-wrapper .dropdown-content.data-v-cc3734ea {
  background: #FFF;
  position: relative;
  z-index: 1;
  border-top: 1rpx solid #F0F0F0;
  border-radius: 0 0 32rpx 32rpx;
  padding: 10rpx 0;
  max-height: 60vh;
  overflow-y: auto;
  animation: slideDown-cc3734ea 0.3s ease-out;
}
.dropdown-wrapper .dropdown-content .option-item.data-v-cc3734ea {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 30rpx 40rpx;
  font-size: 28rpx;
  color: #333;
}
.dropdown-wrapper .dropdown-content .option-item.data-v-cc3734ea:active {
  background: #F8F9FB;
}
.dropdown-wrapper .dropdown-content .option-item.selected.data-v-cc3734ea {
  color: #1F6CFF;
  font-weight: bold;
}
.dropdown-wrapper .dropdown-content .option-item .check-icon.data-v-cc3734ea {
  width: 32rpx;
  height: 32rpx;
}
@keyframes fadeIn-cc3734ea {
from {
    opacity: 0;
}
to {
    opacity: 1;
}
}
@keyframes slideDown-cc3734ea {
from {
    transform: translateY(-20%);
    opacity: 0;
}
to {
    transform: translateY(0);
    opacity: 1;
}
}
.scroll-body.data-v-cc3734ea {
  position: fixed;
  left: 0;
  right: 0;
  bottom: 0;
  background-color: #F8F9FB;
}
.assessment-list.data-v-cc3734ea {
  padding: 30rpx 40rpx;
  display: flex;
  flex-direction: column;
  gap: 30rpx;
}
.training-list.data-v-cc3734ea {
  padding: 30rpx 40rpx;
  display: flex;
  flex-direction: column;
  gap: 30rpx;
}
.training-card.data-v-cc3734ea {
  background: #FFF;
  border-radius: 32rpx;
  padding: 32rpx;
  box-shadow: 0 4rpx 24rpx rgba(0, 0, 0, 0.03);
}
.training-card .t-title.data-v-cc3734ea {
  font-size: 32rpx;
  font-weight: bold;
  color: #1A1A1A;
  line-height: 1.4;
  display: block;
  margin-bottom: 20rpx;
}
.training-card .tag-row.data-v-cc3734ea {
  display: flex;
  gap: 10rpx;
  margin: 12rpx 0;
}
.training-card .tag-row .tag-badge.data-v-cc3734ea {
  font-size: 20rpx;
  color: #999;
  background: #F5F7FA;
  padding: 6rpx 14rpx;
  border-radius: 6rpx;
}
.training-card .tag-row .tag-badge.type-tag.data-v-cc3734ea {
  color: #1F6CFF;
  background: rgba(31, 108, 255, 0.08);
}
.training-card .tag-row .tag-badge.category-tag.data-v-cc3734ea {
  color: #FF9500;
  background: rgba(255, 149, 0, 0.08);
}
.training-card .info-list.data-v-cc3734ea {
  margin-top: 24rpx;
  display: flex;
  flex-direction: column;
  gap: 16rpx;
}
.training-card .info-list .info-item.data-v-cc3734ea {
  display: flex;
  align-items: center;
}
.training-card .info-list .info-item .i-icon.data-v-cc3734ea {
  width: 28rpx;
  height: 28rpx;
  margin-right: 16rpx;
  opacity: 0.5;
}
.training-card .info-list .info-item .i-text.data-v-cc3734ea {
  font-size: 26rpx;
  color: #666;
}
.training-card .info-list .info-item .ending-tag.data-v-cc3734ea {
  font-size: 22rpx;
  color: #FF4D4F;
  margin-left: 20rpx;
}
.video-card.data-v-cc3734ea {
  background: #FFF;
  border-radius: 32rpx;
  overflow: hidden;
  box-shadow: 0 4rpx 24rpx rgba(0, 0, 0, 0.03);
}
.video-card .video-cover-wrap.data-v-cc3734ea {
  width: 100%;
  height: 380rpx;
  position: relative;
}
.video-card .video-cover-wrap .v-cover.data-v-cc3734ea {
  width: 100%;
  height: 100%;
}
.video-card .video-cover-wrap .play-overlay.data-v-cc3734ea {
  position: absolute;
  left: 50%;
  top: 50%;
  transform: translate(-50%, -50%);
}
.video-card .video-cover-wrap .play-overlay .play-icon.data-v-cc3734ea {
  width: 100rpx;
  height: 100rpx;
  opacity: 0.9;
}
.video-card .video-cover-wrap .v-bottom-info.data-v-cc3734ea {
  position: absolute;
  left: 0;
  right: 0;
  bottom: 0;
  height: 80rpx;
  background: linear-gradient(180deg, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0.5) 100%);
  padding: 0 24rpx;
  display: flex;
  justify-content: space-between;
  align-items: center;
  color: #FFF;
  font-size: 24rpx;
}
.video-card .video-cover-wrap .v-bottom-info .m-icon.data-v-cc3734ea {
  width: 24rpx;
  height: 24rpx;
  margin-right: 8rpx;
}
.video-card .video-cover-wrap .v-bottom-info .play-mini-icon.data-v-cc3734ea {
  width: 0;
  height: 0;
  border-left: 12rpx solid #FFF;
  border-top: 8rpx solid transparent;
  border-bottom: 8rpx solid transparent;
  margin-right: 10rpx;
}
.video-card .video-cover-wrap .v-bottom-info .v-info-left.data-v-cc3734ea, .video-card .video-cover-wrap .v-bottom-info .v-info-right.data-v-cc3734ea {
  display: flex;
  align-items: center;
}
.video-card .video-cover-wrap .live-status.data-v-cc3734ea {
  position: absolute;
  right: 24rpx;
  top: 24rpx;
  border-radius: 8rpx;
  padding: 4rpx 12rpx;
  font-size: 22rpx;
  color: #FFF;
}
.video-card .video-cover-wrap .live-status.streaming.data-v-cc3734ea {
  background: #FF4D4F;
}
.video-card .video-cover-wrap .live-status.upcoming.data-v-cc3734ea {
  background: #1F6CFF;
}
.video-card .video-cover-wrap .live-status.not-started.data-v-cc3734ea {
  background: #999;
}
.video-card .video-cover-wrap .live-status.finished.data-v-cc3734ea {
  background: #666;
}
.video-card .v-content.data-v-cc3734ea {
  padding: 24rpx;
}
.video-card .v-content .v-title.data-v-cc3734ea {
  font-size: 32rpx;
  font-weight: bold;
  color: #1A1A1A;
}
.video-card .v-content .v-title-row.data-v-cc3734ea {
  display: flex;
  justify-content: space-between;
  align-items: center;
}
.video-card .v-content .spectators.data-v-cc3734ea {
  display: flex;
  align-items: center;
  color: #999;
  font-size: 24rpx;
}
.video-card .v-content .spectators .s-icon.data-v-cc3734ea {
  width: 24rpx;
  height: 24rpx;
  margin-right: 8rpx;
}
.job-card.data-v-cc3734ea {
  background: #FFF;
  border-radius: 32rpx;
  padding: 24rpx;
  display: flex;
  box-shadow: 0 4rpx 24rpx rgba(0, 0, 0, 0.03);
  position: relative;
}
.job-card .card-left.data-v-cc3734ea {
  width: 220rpx;
  height: 220rpx;
  flex-shrink: 0;
  margin-right: 24rpx;
}
.job-card .card-left .cover-img.data-v-cc3734ea {
  width: 100%;
  height: 100%;
  border-radius: 16rpx;
}
.job-card .card-right.data-v-cc3734ea {
  flex: 1;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
}
.job-card .card-right .top-line.data-v-cc3734ea {
  display: flex;
  justify-content: space-between;
  align-items: center;
}
.job-card .card-right .top-line .job-title.data-v-cc3734ea {
  font-size: 34rpx;
  font-weight: bold;
  color: #1A1A1A;
}
.job-card .card-right .top-line .job-level-tag.data-v-cc3734ea {
  font-size: 22rpx;
  color: #1F6CFF;
  background: rgba(31, 108, 255, 0.1);
  padding: 4rpx 12rpx;
  border-radius: 8rpx;
}
.job-card .card-right .tag-row.data-v-cc3734ea {
  display: flex;
  gap: 10rpx;
  margin: 12rpx 0;
}
.job-card .card-right .tag-row .tag-badge.data-v-cc3734ea {
  font-size: 20rpx;
  color: #999;
  background: #F5F7FA;
  padding: 6rpx 14rpx;
  border-radius: 6rpx;
}
.job-card .card-right .tag-row .tag-badge.type-tag.data-v-cc3734ea {
  color: #1F6CFF;
  background: rgba(31, 108, 255, 0.08);
}
.job-card .card-right .tag-row .tag-badge.category-tag.data-v-cc3734ea {
  color: #FF9500;
  background: rgba(255, 149, 0, 0.08);
}
.job-card .card-right .desc-text.data-v-cc3734ea {
  font-size: 24rpx;
  color: #888;
  line-height: 1.4;
  margin-bottom: 16rpx;
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
  line-clamp: 2;
  overflow: hidden;
}
.job-card .card-right .btn-wrap.data-v-cc3734ea {
  display: flex;
  justify-content: flex-end;
  gap: 10rpx;
}
.job-card .card-right .btn-wrap .consult-btn.data-v-cc3734ea {
  margin: 0;
  background: #FFB700;
  color: #FFF;
  border-radius: 30rpx;
  height: 56rpx;
  line-height: 56rpx;
  padding: 0 36rpx;
  font-size: 26rpx;
  font-weight: bold;
}
.job-card .card-right .btn-wrap .consult-btn.data-v-cc3734ea::after {
  border: none;
}
.job-card .card-right .btn-wrap .start-btn.data-v-cc3734ea {
  margin: 0;
  background: linear-gradient(135deg, #1F6CFF 0%, #0056FF 100%);
  color: #FFF;
  border-radius: 30rpx;
  height: 56rpx;
  line-height: 56rpx;
  padding: 0 36rpx;
  font-size: 26rpx;
  font-weight: bold;
}
.job-card .card-right .btn-wrap .start-btn.data-v-cc3734ea::after {
  border: none;
}
.job-card .card-right .btn-wrap .apply-btn.data-v-cc3734ea {
  margin: 0;
  background: #1F6CFF;
  color: #FFF;
  border-radius: 30rpx;
  height: 56rpx;
  line-height: 56rpx;
  padding: 0 36rpx;
  font-size: 26rpx;
  font-weight: bold;
}
.job-card .card-right .btn-wrap .apply-btn.data-v-cc3734ea::after {
  border: none;
}
.job-card .card-right .btn-wrap .applied-btn.data-v-cc3734ea {
  margin: 0;
  background: #E0E0E0;
  color: #999;
  border-radius: 30rpx;
  height: 56rpx;
  line-height: 56rpx;
  padding: 0 36rpx;
  font-size: 26rpx;
  font-weight: bold;
}
.job-card .card-right .btn-wrap .applied-btn.data-v-cc3734ea::after {
  border: none;
}
.job-card .card-right .btn-wrap .retry-btn.data-v-cc3734ea {
  margin: 0;
  background: #E8F0FF;
  color: #2B5CFF;
  border-radius: 30rpx;
  height: 56rpx;
  line-height: 56rpx;
  padding: 0 36rpx;
  font-size: 26rpx;
  font-weight: bold;
}
.job-card .card-right .btn-wrap .retry-btn.data-v-cc3734ea::after {
  border: none;
}
.job-card .card-right .btn-wrap .report-btn.data-v-cc3734ea {
  margin: 0;
  background: #E8F0FF;
  color: #2B5CFF;
  border-radius: 30rpx;
  height: 56rpx;
  line-height: 56rpx;
  padding: 0 36rpx;
  font-size: 26rpx;
  font-weight: bold;
}
.job-card .card-right .btn-wrap .report-btn.data-v-cc3734ea::after {
  border: none;
}
.job-card .card-right .btn-wrap .report-btn.disabled.data-v-cc3734ea {
  background: #F0F2F5;
  color: #C0C4CC;
  pointer-events: none;
}
.text-ellipsis-2.data-v-cc3734ea {
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
  line-clamp: 2;
  overflow: hidden;
}
.no-data.data-v-cc3734ea {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  padding: 100rpx 0;
}
.no-data .empty-icon.data-v-cc3734ea {
  width: 200rpx;
  height: 200rpx;
  margin-bottom: 20rpx;
  opacity: 0.5;
}
.no-data text.data-v-cc3734ea {
  font-size: 28rpx;
  color: #999;
}
.no-more.data-v-cc3734ea {
  text-align: center;
  font-size: 26rpx;
  color: #BBB;
  padding: 40rpx 0;
}
.tabbar-placeholder.data-v-cc3734ea {
  height: 180rpx;
}
.card-anim.data-v-cc3734ea {
  animation: fadeUp-cc3734ea 0.6s ease-out backwards;
}
.card-anim.data-v-cc3734ea:nth-child(1) {
  animation-delay: 0.1s;
}
.card-anim.data-v-cc3734ea:nth-child(2) {
  animation-delay: 0.2s;
}
.card-anim.data-v-cc3734ea:nth-child(3) {
  animation-delay: 0.3s;
}
.card-anim.data-v-cc3734ea:nth-child(4) {
  animation-delay: 0.4s;
}
.card-anim.data-v-cc3734ea:nth-child(5) {
  animation-delay: 0.5s;
}
@keyframes fadeUp-cc3734ea {
from {
    opacity: 0;
    transform: translateY(30rpx);
}
to {
    opacity: 1;
    transform: translateY(0);
}
}