.container.data-v-6f825acf { min-height: 100vh; background: #f5f5f5; padding: 24rpx; } .status-bar.data-v-6f825acf { display: flex; justify-content: flex-end; align-items: center; margin-bottom: 24rpx; } .bluetooth-status.data-v-6f825acf { display: flex; align-items: center; font-size: 26rpx; color: #999; } .bluetooth-status.connected.data-v-6f825acf { color: #3366ff; } .status-icon.data-v-6f825acf { margin-right: 8rpx; } .info-card.data-v-6f825acf { background: #fff; border-radius: 16rpx; padding: 24rpx; margin-bottom: 24rpx; display: flex; justify-content: space-between; } .info-item.data-v-6f825acf { display: flex; flex-direction: column; align-items: center; } .info-label.data-v-6f825acf { font-size: 24rpx; color: #999; margin-bottom: 8rpx; } .info-value.data-v-6f825acf { font-size: 32rpx; font-weight: 600; color: #333; } .info-value.price-text.data-v-6f825acf { color: #3366ff; } .display-card.data-v-6f825acf { background: #fff; border-radius: 16rpx; padding: 48rpx 24rpx; margin-bottom: 24rpx; display: flex; flex-direction: column; align-items: center; } .display-icon.data-v-6f825acf { font-size: 64rpx; margin-bottom: 16rpx; } .display-title.data-v-6f825acf { font-size: 28rpx; color: #999; margin-bottom: 24rpx; } .display-value-wrap.data-v-6f825acf { display: flex; align-items: baseline; margin-bottom: 32rpx; } .display-value.data-v-6f825acf { font-size: 96rpx; font-weight: 700; color: #333; } .display-unit.data-v-6f825acf { font-size: 32rpx; color: #999; margin-left: 8rpx; } .mode-switch.data-v-6f825acf { display: flex; background: #f5f5f5; border-radius: 12rpx; padding: 8rpx; margin-bottom: 32rpx; width: 100%; } .mode-btn.data-v-6f825acf { flex: 1; text-align: center; padding: 16rpx; font-size: 28rpx; color: #666; border-radius: 8rpx; transition: all 0.3s; } .mode-btn.active.data-v-6f825acf { background: #3366ff; color: #fff; font-weight: 600; } .manual-input.data-v-6f825acf { display: flex; align-items: center; gap: 16rpx; margin-bottom: 32rpx; width: 100%; padding: 0 24rpx; } .manual-input input.data-v-6f825acf { flex: 1; height: 80rpx; border: 2rpx solid #e5e7eb; border-radius: 12rpx; padding: 0 24rpx; font-size: 48rpx; font-weight: 600; color: #333; text-align: center; } .input-unit.data-v-6f825acf { font-size: 32rpx; color: #999; font-weight: 600; } .quick-input.data-v-6f825acf { display: flex; flex-wrap: wrap; gap: 16rpx; justify-content: center; } .quick-btn.data-v-6f825acf { padding: 16rpx 32rpx; background: #f0fdf4; border: 2rpx solid #3366ff; border-radius: 24rpx; font-size: 26rpx; color: #3366ff; font-weight: 600; transition: all 0.2s; } .quick-btn.data-v-6f825acf:active { background: #3366ff; color: #fff; } .control-row.data-v-6f825acf { display: flex; gap: 32rpx; } .control-btn.data-v-6f825acf { display: flex; flex-direction: column; align-items: center; padding: 20rpx 48rpx; background: #f5f5f5; border-radius: 12rpx; font-size: 24rpx; color: #666; } .control-icon.data-v-6f825acf { font-size: 36rpx; margin-bottom: 8rpx; } .count-controls.data-v-6f825acf { display: flex; gap: 48rpx; margin-bottom: 32rpx; } .count-btn.data-v-6f825acf { width: 80rpx; height: 80rpx; border-radius: 50%; display: flex; align-items: center; justify-content: center; font-size: 48rpx; font-weight: 300; } .count-btn.minus.data-v-6f825acf { background: #f87171; color: #fff; } .count-btn.plus.data-v-6f825acf { background: #3366ff; color: #fff; } .amount-card.data-v-6f825acf { background: linear-gradient(135deg, #fef3c7 0%, #fde68a 100%); border-radius: 16rpx; padding: 32rpx; margin-bottom: 32rpx; display: flex; flex-direction: column; align-items: center; } .amount-title.data-v-6f825acf { font-size: 28rpx; color: #92400e; margin-bottom: 12rpx; } .amount-value-wrap.data-v-6f825acf { display: flex; align-items: baseline; } .amount-currency.data-v-6f825acf { font-size: 36rpx; font-weight: 600; color: #f59e0b; } .amount-num.data-v-6f825acf { font-size: 72rpx; font-weight: 700; color: #f59e0b; margin-left: 8rpx; } .region-card.data-v-6f825acf { background: #fff; border-radius: 16rpx; padding: 24rpx; margin-bottom: 32rpx; } .region-title.data-v-6f825acf { font-size: 28rpx; font-weight: 600; color: #333; margin-bottom: 20rpx; } .region-row.data-v-6f825acf { margin-bottom: 16rpx; } .region-item.data-v-6f825acf { display: flex; align-items: center; justify-content: space-between; } .region-label.data-v-6f825acf { font-size: 26rpx; color: #999; width: 120rpx; } .region-select.data-v-6f825acf { flex: 1; display: flex; align-items: center; justify-content: space-between; padding: 20rpx 24rpx; background: #f8fafc; border-radius: 12rpx; font-size: 28rpx; color: #333; } .region-select.disabled.data-v-6f825acf { color: #ccc; background: #f0f0f0; } .arrow.data-v-6f825acf { font-size: 20rpx; color: #999; margin-left: 16rpx; } .custom-region.data-v-6f825acf { margin-top: 20rpx; padding-top: 20rpx; border-top: 1rpx solid #f0f0f0; } .region-input.data-v-6f825acf { flex: 1; padding: 20rpx 24rpx; background: #f8fafc; border-radius: 12rpx; font-size: 28rpx; margin-left: 16rpx; } .picker-overlay.data-v-6f825acf { position: fixed; top: 0; left: 0; right: 0; bottom: 0; background: rgba(0, 0, 0, 0.5); z-index: 1000; display: flex; align-items: flex-end; } .picker-content.data-v-6f825acf { width: 100%; background: #fff; border-radius: 24rpx 24rpx 0 0; max-height: 70vh; } .picker-header.data-v-6f825acf { display: flex; align-items: center; justify-content: space-between; padding: 28rpx 32rpx; border-bottom: 1rpx solid #f0f0f0; } .picker-title.data-v-6f825acf { font-size: 32rpx; font-weight: 600; color: #333; } .picker-close.data-v-6f825acf { font-size: 32rpx; color: #999; padding: 8rpx; } .picker-list.data-v-6f825acf { max-height: 60vh; } .picker-item.data-v-6f825acf { padding: 28rpx 32rpx; font-size: 30rpx; color: #333; border-bottom: 1rpx solid #f8fafc; } .picker-item.active.data-v-6f825acf { color: #3366ff; font-weight: 600; } .confirm-btn.data-v-6f825acf { background: linear-gradient(135deg, #3366ff 0%, #254edb 100%); border-radius: 48rpx; padding: 32rpx; text-align: center; font-size: 34rpx; font-weight: 600; color: #fff; box-shadow: 0 8rpx 24rpx rgba(16, 185, 129, 0.3); } .confirm-btn.data-v-6f825acf:active { opacity: 0.85; }