page.data-v-ab00616a { background-color: #F6F8FB; } .page-container.data-v-ab00616a { min-height: 100vh; background-color: #F6F8FB; display: flex; flex-direction: column; width: 100vw; box-sizing: border-box; } .form-content.data-v-ab00616a { flex: 1; width: 100%; box-sizing: border-box; padding: 24rpx 32rpx 40rpx; } .form-content .form-card.data-v-ab00616a { background-color: #FFFFFF; border-radius: 32rpx; padding: 40rpx 32rpx; box-shadow: 0 10rpx 40rpx rgba(0, 0, 0, 0.03); } .form-content .form-item.data-v-ab00616a { margin-bottom: 48rpx; } .form-content .form-item.data-v-ab00616a:last-child { margin-bottom: 0; } .form-content .form-item .label-row.data-v-ab00616a { display: flex; justify-content: space-between; align-items: center; margin-bottom: 20rpx; padding-left: 8rpx; } .form-content .form-item .label-row .label.data-v-ab00616a { font-size: 28rpx; font-weight: 600; color: #333333; } .form-content .form-item .label-row .optional.data-v-ab00616a { font-size: 26rpx; color: #B3B3B3; font-weight: normal; margin-left: 8rpx; } .form-content .form-item .label-row .tag-missing.data-v-ab00616a { color: #FF7B3B; font-size: 22rpx; background-color: rgba(255, 123, 59, 0.1); padding: 4rpx 14rpx; border-radius: 8rpx; font-weight: 500; } .form-content .form-item .input-box.data-v-ab00616a { position: relative; display: flex; align-items: center; background-color: #F8FAFC; border-radius: 16rpx; padding: 0 24rpx; height: 84rpx; transition: all 0.3s ease; border: 2rpx solid transparent; } .form-content .form-item .input-box.data-v-ab00616a:focus-within { background-color: #EBF1FA; border-color: rgba(31, 108, 255, 0.2); } .form-content .form-item .input-box input.data-v-ab00616a { flex: 1; font-size: 28rpx; color: #1A1A1A; font-weight: 500; height: 100%; } .form-content .form-item .input-box .ph-style.data-v-ab00616a { color: #A0AABF; font-size: 28rpx; font-weight: 400; } .form-content .form-item .input-box .arrow.data-v-ab00616a { width: 14rpx; height: 14rpx; border-right: 3.5rpx solid #B0BACC; border-top: 3.5rpx solid #B0BACC; transform: rotate(45deg); margin-left: 20rpx; border-radius: 2rpx; } .form-content .form-item .input-box .date-picker-wrap.data-v-ab00616a { flex: 1; display: flex; align-items: center; justify-content: space-between; height: 100%; } .form-content .form-item .input-box .date-picker-wrap .date-block.data-v-ab00616a { flex: 1; position: relative; height: 100%; display: flex; align-items: center; } .form-content .form-item .input-box .date-picker-wrap .date-block.right-text.data-v-ab00616a { justify-content: flex-end; } .form-content .form-item .input-box .date-picker-wrap .date-text.data-v-ab00616a { font-size: 28rpx; color: #1A1A1A; font-weight: 500; } .form-content .form-item .input-box .date-picker-wrap .date-text.is-empty.data-v-ab00616a { color: #A0AABF; font-weight: 400; font-size: 28rpx; } .form-content .form-item .input-box .date-picker-wrap .date-separator.data-v-ab00616a { color: #A0AABF; margin: 0 30rpx; font-size: 28rpx; font-weight: 500; } .form-content .form-item .input-box .picker-overlay.data-v-ab00616a { position: absolute; inset: 0; z-index: 10; opacity: 0; width: 100%; height: 100%; } .form-content .form-item .textarea-box.data-v-ab00616a { background-color: #F8FAFC; border-radius: 16rpx; padding: 24rpx; transition: all 0.3s ease; border: 2rpx solid transparent; } .form-content .form-item .textarea-box.data-v-ab00616a:focus-within { background-color: #EBF1FA; border-color: rgba(31, 108, 255, 0.2); } .form-content .form-item .textarea-box textarea.data-v-ab00616a { width: 100%; height: 160rpx; font-size: 28rpx; color: #1A1A1A; line-height: 1.6; font-weight: 400; } .form-content .form-item .textarea-box .ph-style.data-v-ab00616a { color: #A0AABF; font-size: 28rpx; } .form-content .switch-row.data-v-ab00616a { display: flex; justify-content: space-between; align-items: center; padding: 30rpx 8rpx; border-top: 1rpx solid #F0F4FC; margin-top: 20rpx; } .form-content .switch-row.data-v-ab00616a:first-of-type { margin-top: 40rpx; } .form-content .switch-row .s-label.data-v-ab00616a { font-size: 32rpx; font-weight: 500; color: #1A1A1A; } .footer-btn-area.data-v-ab00616a { width: 100vw; box-sizing: border-box; padding: 30rpx 40rpx calc(env(safe-area-inset-bottom) + 30rpx); background-color: transparent; } .footer-btn-area .btn-save.data-v-ab00616a { width: 100%; height: 80rpx; display: flex; justify-content: center; align-items: center; background: linear-gradient(135deg, #1F6CFF 0%, #0052D9 100%); color: #FFFFFF; font-size: 28rpx; font-weight: 600; border-radius: 40rpx; transition: all 0.3s; border: none; box-shadow: 0 12rpx 24rpx rgba(31, 108, 255, 0.25); margin: 0; } .footer-btn-area .btn-save.data-v-ab00616a::after { border: none; } .footer-btn-area .btn-save.data-v-ab00616a:active { opacity: 0.8; transform: scale(0.98); box-shadow: 0 6rpx 12rpx rgba(31, 108, 255, 0.2); } .footer-btn-area .btn-save.is-disabled.data-v-ab00616a { background: #E5E9F2; color: #A0AABF; box-shadow: none; opacity: 1; pointer-events: none; } .switch-row.data-v-ab00616a { display: flex; justify-content: space-between; align-items: center; } .switch-row .switch-left.data-v-ab00616a { display: flex; flex-direction: column; } .switch-row .switch-left .s-label.data-v-ab00616a { font-size: 32rpx; font-weight: 500; color: #1A1A1A; } .switch-row .switch-left .s-hint.data-v-ab00616a { font-size: 24rpx; color: #999999; margin-top: 4rpx; } .picker-popup.data-v-ab00616a { position: fixed; top: 0; left: 0; right: 0; bottom: 0; z-index: 999; } .picker-popup .picker-mask.data-v-ab00616a { position: absolute; top: 0; left: 0; right: 0; bottom: 0; background-color: rgba(0, 0, 0, 0.5); } .picker-popup .picker-content.data-v-ab00616a { position: absolute; bottom: 0; left: 0; right: 0; background-color: #FFFFFF; border-top-left-radius: 24rpx; border-top-right-radius: 24rpx; overflow: hidden; padding-bottom: env(safe-area-inset-bottom); } .picker-popup .picker-content .picker-header.data-v-ab00616a { display: flex; justify-content: space-between; align-items: center; height: 100rpx; padding: 0 40rpx; border-bottom: 1rpx solid #F0F4FC; } .picker-popup .picker-content .picker-header .btn-cancel.data-v-ab00616a { font-size: 30rpx; color: #999999; } .picker-popup .picker-content .picker-header .title.data-v-ab00616a { font-size: 32rpx; color: #333333; font-weight: 600; } .picker-popup .picker-content .picker-header .btn-confirm.data-v-ab00616a { font-size: 30rpx; color: #1F6CFF; } .picker-popup .picker-content .range-tabs-header.data-v-ab00616a { display: flex; border-bottom: 1rpx solid #F0F4FC; } .picker-popup .picker-content .range-tabs-header .tab-item.data-v-ab00616a { flex: 1; display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 30rpx 0; position: relative; } .picker-popup .picker-content .range-tabs-header .tab-item .tab-label.data-v-ab00616a { font-size: 26rpx; color: #666666; margin-bottom: 8rpx; } .picker-popup .picker-content .range-tabs-header .tab-item .tab-val.data-v-ab00616a { font-size: 32rpx; color: #CCCCCC; font-weight: 500; } .picker-popup .picker-content .range-tabs-header .tab-item.active .tab-label.data-v-ab00616a { color: #333333; font-weight: bold; } .picker-popup .picker-content .range-tabs-header .tab-item.active .tab-val.data-v-ab00616a { color: #1F6CFF; } .picker-popup .picker-content .range-tabs-header .tab-item.active.data-v-ab00616a::after { content: ""; position: absolute; left: 0; top: 0; bottom: 0; right: 0; border: 2rpx solid #1F6CFF; pointer-events: none; } .picker-popup .picker-content .picker-view.data-v-ab00616a { width: 100%; height: 400rpx; } .picker-popup .picker-content .picker-item.data-v-ab00616a { line-height: 100rpx; text-align: center; font-size: 32rpx; color: #333333; } .picker-popup .picker-content .picker-bottom-btn-area.data-v-ab00616a { padding: 30rpx 40rpx; padding-bottom: calc(env(safe-area-inset-bottom) + 30rpx); background-color: #FFFFFF; border-top: 1rpx solid #F0F4FC; } .picker-popup .picker-content .picker-bottom-btn-area .btn-bottom.data-v-ab00616a { display: flex; justify-content: center; align-items: center; width: 100%; height: 80rpx; background: linear-gradient(135deg, #1F6CFF 0%, #0052D9 100%); color: #FFFFFF; font-size: 28rpx; font-weight: 600; border-radius: 40rpx; transition: all 0.3s; box-shadow: 0 12rpx 24rpx rgba(31, 108, 255, 0.25); } .picker-popup .picker-content .picker-bottom-btn-area .btn-bottom.data-v-ab00616a:active { opacity: 0.8; transform: scale(0.98); box-shadow: 0 6rpx 12rpx rgba(31, 108, 255, 0.2); }