.container.data-v-0a633310 { width: 100%; height: 100vh; background-color: #F4F5F7; display: flex; flex-direction: column; overflow: hidden; } /* 状态栏占位:高度由 JS 动态注入 */ .status-bar.data-v-0a633310 { background: #FFF; flex-shrink: 0; } /* 导航栏 */ .nav-bar.data-v-0a633310 { height: 100rpx; background: #FFF; display: flex; align-items: center; padding: 0 30rpx; border-bottom: 1rpx solid #F0F0F0; flex-shrink: 0; } .nav-bar .back-btn.data-v-0a633310 { width: 60rpx; display: flex; align-items: center; } .nav-bar .back-btn .back-arrow.data-v-0a633310 { font-size: 56rpx; color: #333; line-height: 1; margin-top: -6rpx; } .nav-bar .nav-center.data-v-0a633310 { flex: 1; display: flex; align-items: center; justify-content: center; gap: 12rpx; } .nav-bar .nav-center .nav-title-text.data-v-0a633310 { font-size: 32rpx; font-weight: bold; color: #1A1A1A; } .nav-bar .nav-center .online-dot.data-v-0a633310 { width: 14rpx; height: 14rpx; border-radius: 50%; background: #10B981; } .nav-bar .nav-right.data-v-0a633310 { width: 60rpx; } .chat-body.data-v-0a633310 { flex: 1; } .message-list.data-v-0a633310 { padding: 24rpx 30rpx 160rpx; } .tip-row.data-v-0a633310 { padding: 60rpx 0; text-align: center; } .tip-row .tip-text.data-v-0a633310 { font-size: 26rpx; color: #CCC; } .time-stamp-row.data-v-0a633310 { display: flex; justify-content: center; margin: 20rpx 0 30rpx; } .time-stamp.data-v-0a633310 { font-size: 22rpx; color: #BBB; background: rgba(0, 0, 0, 0.05); padding: 4rpx 18rpx; border-radius: 8rpx; } .msg-row.data-v-0a633310 { display: flex; margin-bottom: 44rpx; } .msg-row .avatar.data-v-0a633310 { width: 80rpx; height: 80rpx; border-radius: 50%; flex-shrink: 0; } .msg-row.left .avatar.data-v-0a633310 { margin-right: 18rpx; } .msg-row.right.data-v-0a633310 { justify-content: flex-end; } .msg-row.right .avatar.data-v-0a633310 { margin-left: 18rpx; } .msg-content.data-v-0a633310 { max-width: 520rpx; border-radius: 16rpx; padding: 22rpx 26rpx; font-size: 30rpx; line-height: 1.6; word-break: break-all; } .text-msg.data-v-0a633310 { background: #FFF; color: #333; } .text-msg.shadow.data-v-0a633310 { box-shadow: 0 2rpx 10rpx rgba(0, 0, 0, 0.04); } .text-msg.user-bubble.data-v-0a633310 { background: #FFB700; color: #FFF; } .img-msg.data-v-0a633310 { padding: 8rpx; background: #FFF; border-radius: 12rpx; box-shadow: 0 2rpx 10rpx rgba(0, 0, 0, 0.06); } .img-msg .chat-img.data-v-0a633310 { width: 360rpx; border-radius: 8rpx; display: block; } .file-msg.data-v-0a633310 { display: flex; align-items: center; gap: 20rpx; background: #FFF; min-width: 300rpx; } .file-msg .file-icon-txt.data-v-0a633310 { font-size: 56rpx; flex-shrink: 0; } .file-msg .file-info.data-v-0a633310 { flex: 1; } .file-msg .file-info .file-name.data-v-0a633310 { display: block; font-size: 28rpx; color: #333; margin-bottom: 6rpx; word-break: break-all; } .file-msg .file-info .file-size.data-v-0a633310 { font-size: 22rpx; color: #999; } /* 订单卡片 */ .deposit-card.data-v-0a633310 { background: #FFF; width: 500rpx; border-radius: 20rpx; overflow: hidden; padding: 0; box-shadow: 0 4rpx 20rpx rgba(0, 0, 0, 0.06); } .deposit-card .deposit-header.data-v-0a633310 { padding: 28rpx 28rpx 16rpx; display: flex; justify-content: space-between; align-items: flex-start; } .deposit-card .deposit-header .d-header-left.data-v-0a633310 { flex: 1; } .deposit-card .deposit-header .d-header-left .d-title.data-v-0a633310 { font-size: 32rpx; font-weight: bold; color: #333; } .deposit-card .deposit-header .d-header-left .d-subtitle.data-v-0a633310 { font-size: 22rpx; color: #BBB; margin-top: 6rpx; display: block; } .deposit-card .deposit-header .d-countdown.data-v-0a633310 { display: flex; gap: 4rpx; align-items: center; justify-content: flex-end; } .deposit-card .deposit-header .d-countdown .c-time.data-v-0a633310 { color: #FF9500; font-size: 26rpx; font-weight: bold; } .deposit-card .deposit-header .d-countdown .c-txt.data-v-0a633310 { color: #999; font-size: 22rpx; } .deposit-card .deposit-header .d-paid-tag.data-v-0a633310 { color: #52C41A; font-size: 24rpx; font-weight: bold; } .deposit-card .deposit-body.data-v-0a633310 { padding: 8rpx 28rpx 24rpx; } .deposit-card .deposit-body .d-row.data-v-0a633310 { margin-bottom: 10rpx; font-size: 26rpx; display: flex; } .deposit-card .deposit-body .d-row .label.data-v-0a633310 { color: #AAA; width: 140rpx; } .deposit-card .deposit-body .d-row .val.data-v-0a633310 { color: #333; flex: 1; } .deposit-card .deposit-body .d-row .price.data-v-0a633310 { color: #FF3B30; font-size: 34rpx; font-weight: bold; } .deposit-card .deposit-action.data-v-0a633310 { margin: 0 28rpx 28rpx; height: 76rpx; font-size: 28rpx; background: #FFB700; color: #FFF; border-radius: 38rpx; display: flex; align-items: center; justify-content: center; font-weight: bold; } .deposit-card .deposit-action.paid.data-v-0a633310 { background: #EEE; color: #999; } /* 招聘初始卡片(静态展示用) */ .job-card-msg.data-v-0a633310 { background: #FFF; border-radius: 20rpx; width: 500rpx; padding: 30rpx; box-shadow: 0 4rpx 20rpx rgba(0, 0, 0, 0.04); } .job-card-msg .card-header.data-v-0a633310 { display: flex; justify-content: space-between; margin-bottom: 20rpx; } .job-card-msg .card-header .ch-left.data-v-0a633310 { display: flex; align-items: center; gap: 10rpx; } .job-card-msg .card-header .ch-left .card-title.data-v-0a633310 { font-weight: bold; font-size: 34rpx; } .job-card-msg .card-header .ch-left .urgent-tag.data-v-0a633310 { border: 1rpx solid #FF4D4F; color: #FF4D4F; font-size: 20rpx; padding: 2rpx 10rpx; border-radius: 6rpx; } .job-card-msg .card-header .card-salary.data-v-0a633310 { color: #1F6CFF; font-weight: bold; font-size: 32rpx; } .job-card-msg .card-tags.data-v-0a633310 { display: flex; gap: 12rpx; margin-bottom: 24rpx; } .job-card-msg .card-tags .c-tag.data-v-0a633310 { background: #F5F7FA; color: #888; font-size: 22rpx; padding: 6rpx 16rpx; border-radius: 8rpx; } .job-card-msg .card-meta.data-v-0a633310 { display: flex; flex-direction: column; gap: 10rpx; margin-bottom: 24rpx; } .job-card-msg .card-meta .m-item.data-v-0a633310 { display: flex; align-items: center; gap: 10rpx; } .job-card-msg .card-meta .m-item .m-icon.data-v-0a633310 { width: 24rpx; height: 24rpx; opacity: 0.4; } .job-card-msg .card-meta .m-item text.data-v-0a633310 { font-size: 24rpx; color: #666; } .job-card-msg .card-company.data-v-0a633310 { display: flex; align-items: center; border-top: 1rpx solid #F5F5F5; padding-top: 24rpx; } .job-card-msg .card-company .c-logo.data-v-0a633310 { width: 80rpx; height: 80rpx; border-radius: 12rpx; margin-right: 16rpx; } .job-card-msg .card-company .c-info.data-v-0a633310 { flex: 1; display: flex; align-items: center; gap: 8rpx; } .job-card-msg .card-company .c-info .c-name.data-v-0a633310 { font-size: 28rpx; font-weight: bold; } .job-card-msg .card-company .c-info .v-icon.data-v-0a633310 { width: 28rpx; height: 28rpx; } .job-card-msg .card-company .c-loc.data-v-0a633310 { font-size: 24rpx; color: #999; } /* 测评初始卡片 */ .assessment-card-msg.data-v-0a633310 { background: #FFF; width: 480rpx; padding: 24rpx; display: flex; box-shadow: 0 4rpx 20rpx rgba(0, 0, 0, 0.04); border-radius: 16rpx; } .assessment-card-msg .card-left.data-v-0a633310 { width: 140rpx; height: 140rpx; margin-right: 20rpx; } .assessment-card-msg .card-left .a-cover.data-v-0a633310 { width: 100%; height: 100%; border-radius: 12rpx; } .assessment-card-msg .card-right.data-v-0a633310 { flex: 1; display: flex; flex-direction: column; justify-content: space-between; } .assessment-card-msg .card-right .a-title.data-v-0a633310 { font-weight: bold; font-size: 30rpx; color: #1A1A1A; } .assessment-card-msg .card-right .a-tags.data-v-0a633310 { display: flex; gap: 10rpx; flex-wrap: wrap; } .assessment-card-msg .card-right .a-tags .a-tag.data-v-0a633310 { font-size: 20rpx; color: #999; background: #F5F7FA; padding: 4rpx 12rpx; border-radius: 6rpx; } .assessment-card-msg .card-right .a-price.data-v-0a633310 { color: #FF4D4F; font-weight: bold; font-size: 32rpx; } /* 培训报名初始卡片 */ .training-reg-card.data-v-0a633310 { background: #FFF; width: 480rpx; padding: 30rpx; border-radius: 20rpx; } .training-reg-card .t-card-header.data-v-0a633310 { margin-bottom: 24rpx; } .training-reg-card .t-card-header .t-card-title.data-v-0a633310 { font-weight: bold; font-size: 32rpx; color: #1A1A1A; display: block; margin-bottom: 8rpx; } .training-reg-card .t-card-header .t-card-subtitle.data-v-0a633310 { font-size: 24rpx; color: #999; } .training-reg-card .t-card-body.data-v-0a633310 { margin-bottom: 30rpx; } .training-reg-card .t-card-body .t-item.data-v-0a633310 { display: flex; font-size: 26rpx; margin-bottom: 10rpx; } .training-reg-card .t-card-body .t-item .t-label.data-v-0a633310 { color: #888; width: 140rpx; } .training-reg-card .t-card-body .t-item .t-val.data-v-0a633310 { color: #333; } .training-reg-card .t-card-footer .reg-btn.data-v-0a633310 { width: 100%; height: 72rpx; line-height: 72rpx; background: #1F6CFF; color: #FFF; border-radius: 36rpx; font-size: 28rpx; font-weight: bold; } .training-reg-card .t-card-footer .reg-btn.data-v-0a633310::after { border: none; } /* API 推送的岗位卡片(客服消息循环中使用)*/ .api-job-card.data-v-0a633310 { background: #FFF; width: 460rpx; padding: 28rpx; border-radius: 16rpx; } .api-job-card .jc-header.data-v-0a633310 { display: flex; justify-content: space-between; align-items: center; margin-bottom: 12rpx; } .api-job-card .jc-header .jc-title.data-v-0a633310 { font-size: 30rpx; font-weight: bold; color: #1A1A1A; flex: 1; } .api-job-card .jc-header .jc-salary.data-v-0a633310 { font-size: 28rpx; color: #1F6CFF; font-weight: bold; } .api-job-card .jc-city.data-v-0a633310 { font-size: 24rpx; color: #888; } /* 系统消息 */ .system-msg.data-v-0a633310 { width: 100%; text-align: center; font-size: 24rpx; color: #BBB; padding: 8rpx 20rpx; background: rgba(0, 0, 0, 0.04); border-radius: 8rpx; } /* 底部输入栏 */ .footer-wrap.data-v-0a633310 { position: fixed; bottom: 0; left: 0; right: 0; background: #FFF; border-top: 1rpx solid #EEE; padding-bottom: env(safe-area-inset-bottom); z-index: 1001; } .input-bar.data-v-0a633310 { height: 120rpx; display: flex; align-items: center; padding: 0 24rpx; gap: 20rpx; } .input-bar .bar-icon.data-v-0a633310 { width: 60rpx; height: 60rpx; transition: transform 0.2s; } .input-bar .bar-icon.active.data-v-0a633310 { transform: scale(1.1); } .input-bar .center-area.data-v-0a633310 { flex: 1; } .input-bar .center-area .chat-input.data-v-0a633310 { background: #F7F8FA; height: 80rpx; border-radius: 12rpx; border: 1rpx solid #EEE; padding: 0 24rpx; font-size: 28rpx; } .input-bar .center-area .voice-press-btn.data-v-0a633310 { height: 80rpx; background: #F7F8FA; border: 1rpx solid #DDD; border-radius: 12rpx; display: flex; align-items: center; justify-content: center; font-size: 28rpx; color: #666; } .input-bar .center-area .voice-press-btn.data-v-0a633310:active { background: #E0E0E0; } .panel-section.data-v-0a633310 { height: 0; overflow: hidden; transition: height 0.3s; } .panel-section.show.data-v-0a633310 { height: 400rpx; border-top: 1rpx solid #F2F2F2; } .emoji-panel.data-v-0a633310 { height: 100%; } .emoji-panel .emoji-scroll.data-v-0a633310 { height: 100%; } .emoji-panel .emoji-grid.data-v-0a633310 { display: flex; flex-wrap: wrap; padding: 30rpx; gap: 20rpx; } .emoji-panel .emoji-grid .emoji-item.data-v-0a633310 { font-size: 50rpx; width: 84rpx; text-align: center; } .plus-panel.data-v-0a633310 { height: 100%; display: flex; padding: 40rpx 60rpx; gap: 80rpx; } .plus-panel .panel-item.data-v-0a633310 { display: flex; flex-direction: column; align-items: center; } .plus-panel .panel-item .icon-box.data-v-0a633310 { width: 116rpx; height: 116rpx; background: #FFF; border: 1rpx solid #F0F0F0; border-radius: 28rpx; display: flex; align-items: center; justify-content: center; margin-bottom: 20rpx; box-shadow: 0 4rpx 10rpx rgba(0, 0, 0, 0.03); } .plus-panel .panel-item .icon-box image.data-v-0a633310 { width: 60rpx; height: 60rpx; } .plus-panel .panel-item text.data-v-0a633310 { font-size: 26rpx; color: #777; }