/* 卡片核销页面样式：颜色跟随主题变量 var(--c-primary) 等 */
body {
    background: var(--c-bg, #f0f4ff);
    font-family: var(--c-font, 'PingFang SC');
    color: var(--c-text, #1a1f2e);
    min-width: auto !important;
}

.cv-wrap { max-width: 1200px; margin: 30px auto; padding: 0 20px; }

.cv-head { display: flex; align-items: center; justify-content: space-between; margin-bottom: 22px; }
.cv-head h1 { font-size: 26px; font-weight: 700; letter-spacing: 3px; margin: 0; padding-left: 14px; border-left: 5px solid var(--c-primary, #1e5bff); line-height: 26px; }
.cv-head a { font-size: 14px; color: #888; text-decoration: none; }
.cv-head a:hover { color: var(--c-primary, #1e5bff); }

.cv-main { display: flex; gap: 24px; align-items: flex-start; }

.cv-card { flex: 0 0 420px; box-sizing: border-box; background: var(--c-card, #fff); border-radius: var(--c-radius, 8px); box-shadow: var(--c-shadow); padding: 28px 26px; }
.cv-card-top { display: flex; align-items: center; gap: 18px; }
.cv-card-logobox { width: 84px; height: 84px; flex: 0 0 84px; display: flex; align-items: center; justify-content: center; }
.cv-card-logo { width: 84px; height: 84px; border-radius: 12px; object-fit: contain; background: #f5f7fa; padding: 6px; box-sizing: border-box; max-width: 84px; max-height: 84px; }
.cv-card-name { font-size: 20px; font-weight: 700; margin-bottom: 8px; }
.cv-card-tag { display: inline-block; margin-left: 8px; padding: 2px 10px; border-radius: 12px; background: var(--c-secondary, #dbeafe); color: var(--c-primary, #1e5bff); font-size: 12px; font-weight: 500; vertical-align: 2px; }
.cv-card-line { font-size: 13px; color: #888; line-height: 1.9; }
.cv-card-line em { font-style: normal; color: var(--c-text, #1a1f2e); font-weight: 600; }

.cv-card-amount { margin-top: 22px; padding: 18px 0; border-top: 1px dashed #e5e7eb; border-bottom: 1px dashed #e5e7eb; text-align: center; }
.cv-card-amount .cv-amount-tip { font-size: 13px; color: #999; margin-bottom: 6px; }
.cv-card-amount .cv-amount-num { font-size: 34px; font-weight: 700; color: var(--c-primary, #1e5bff); line-height: 1.2; }
.cv-card-amount .cv-amount-num small { font-size: 18px; font-weight: 600; }

.cv-change { margin-top: 18px; width: 100%; height: 42px; line-height: 42px; border: 1px solid var(--c-primary, #1e5bff); background: transparent; color: var(--c-primary, #1e5bff); border-radius: var(--c-radius, 8px); font-size: 15px; cursor: pointer; transition: 0.2s; }
.cv-change:hover { background: var(--c-primary, #1e5bff); color: #fff; }
.cv-change.loading { opacity: 0.6; }

.cv-tip { margin-top: 16px; font-size: 12px; color: #999; line-height: 1.8; max-height: 120px; overflow: auto; }

/* 左侧列：空态 / 卡片 / 同步日志 竖排 */
.cv-side { flex: 0 0 420px; box-sizing: border-box; }

/* 未识别前的空态 */
.cv-empty {
    background: var(--c-card, #fff);
    border: 1px solid var(--c-border, #e5e7eb);
    border-radius: var(--c-radius, 8px);
    box-shadow: var(--c-shadow);
    padding: 46px 20px 40px;
    text-align: center;
}
.cv-empty-ico { width: 86px; height: 58px; margin: 0 auto 18px; position: relative; border: 2px dashed var(--c-primary, #1e5bff); border-radius: 9px; opacity: 0.55; }
.cv-empty-ico em { position: absolute; left: 50%; top: 50%; width: 26px; height: 26px; margin: -13px 0 0 -13px; border: 2px solid var(--c-primary, #1e5bff); border-radius: 6px; transform: rotate(45deg); opacity: 0.8; }
.cv-empty-txt { font-size: 16px; font-weight: 600; color: var(--c-text, #1a1f2e); }
.cv-empty-sub { margin-top: 8px; font-size: 13px; color: #999; line-height: 1.7; }

/* 同步提示（输入框下方，逐条滚动的核销进度） */
.cv-log { margin-top: 22px; background: #111827; border-radius: var(--c-radius, 8px); overflow: hidden; box-shadow: var(--c-shadow); }
.cv-log-head { display: flex; align-items: center; gap: 8px; padding: 11px 16px; background: rgba(255, 255, 255, 0.06); color: #9ca3af; font-size: 13px; letter-spacing: 1px; }
.cv-log-dot { width: 8px; height: 8px; border-radius: 50%; background: #2bab6a; box-shadow: 0 0 0 0 rgba(43, 171, 106, 0.6); animation: cvPulse 1.6s infinite; }
@keyframes cvPulse {
    0% { box-shadow: 0 0 0 0 rgba(43, 171, 106, 0.55); }
    70% { box-shadow: 0 0 0 8px rgba(43, 171, 106, 0); }
    100% { box-shadow: 0 0 0 0 rgba(43, 171, 106, 0); }
}
.cv-log-body { height: 172px; overflow-y: auto; padding: 10px 16px 12px; font-family: Consolas, Monaco, monospace; font-size: 12.5px; line-height: 1.9; color: #cbd5e1; }
.cv-log-line { display: flex; gap: 10px; white-space: pre-wrap; word-break: break-all; }
.cv-log-line i { font-style: normal; color: #64748b; flex: 0 0 auto; }
.cv-log-line.wait { color: #64748b; }
.cv-log-line.info > span { color: #93c5fd; }
.cv-log-line.ok > span { color: #6ee7b7; }
.cv-log-line.warn > span { color: #fcd34d; }
.cv-log-line.err > span { color: #fca5a5; }

.cv-form { flex: 1; min-width: 0; box-sizing: border-box; background: var(--c-card, #fff); border-radius: var(--c-radius, 8px); box-shadow: var(--c-shadow); padding: 32px 30px; }
.cv-mode { display: flex; align-items: center; gap: 14px; margin-bottom: 20px; }
.cv-mode-label { font-size: 14px; color: #888; }
.cv-mode-item { padding: 8px 24px; border-radius: 22px; border: 1px solid #dcdfe6; background: #fff; color: #666; font-size: 14px; cursor: pointer; transition: 0.2s; }
.cv-mode-item:hover { border-color: var(--c-primary, #1e5bff); color: var(--c-primary, #1e5bff); }
.cv-mode-item.active { background: var(--c-primary, #1e5bff); border-color: var(--c-primary, #1e5bff); color: #fff; font-weight: 600; }

.cv-input { width: 100%; box-sizing: border-box; height: 54px; line-height: 54px; padding: 0 16px; border: 1px solid #dcdfe6; border-radius: var(--c-radius, 8px); font-size: 16px; letter-spacing: 2px; font-family: Consolas, Monaco, monospace; color: var(--c-text, #1a1f2e); outline: none; transition: 0.2s; }
.cv-input:focus { border-color: var(--c-primary, #1e5bff); box-shadow: 0 0 0 3px rgba(30, 91, 255, 0.12); }

.cv-submit { width: 100%; height: 54px; margin-top: 22px; border: 0; border-radius: var(--c-radius, 8px); background: var(--c-primary, #1e5bff); color: #fff; font-size: 18px; letter-spacing: 6px; cursor: pointer; transition: 0.2s; }
.cv-submit:hover { opacity: 0.9; }
.cv-submit:disabled { opacity: 0.6; cursor: default; }

.cv-ok { display: none; max-width: 600px; margin: 36px auto 60px; background: var(--c-card, #fff); border-radius: var(--c-radius, 8px); box-shadow: var(--c-shadow); padding: 44px 34px; text-align: center; }
.cv-ok-icon { width: 76px; height: 76px; border-radius: 50%; background: #e8f7ee; color: #2bab6a; font-size: 40px; line-height: 76px; margin: 0 auto 14px; }
.cv-ok-title { font-size: 24px; font-weight: 700; margin-bottom: 8px; }
.cv-ok-sub { font-size: 13px; color: #999; margin-bottom: 22px; }
.cv-ok-row { display: flex; justify-content: space-between; align-items: center; padding: 13px 6px; border-bottom: 1px dashed #e5e7eb; font-size: 14px; }
.cv-ok-row span { color: #888; }
.cv-ok-row b { font-weight: 600; font-family: Consolas, Monaco, monospace; word-break: break-all; text-align: right; }
.cv-ok-row b.cv-ok-amt { color: var(--c-primary, #1e5bff); font-size: 18px; }
.cv-ok-btn { margin-top: 28px; height: 46px; line-height: 46px; padding: 0 40px; border: 0; border-radius: var(--c-radius, 8px); background: var(--c-primary, #1e5bff); color: #fff; font-size: 16px; cursor: pointer; }
.cv-ok-btn.plain { background: #fff; color: var(--c-primary, #1e5bff); border: 1px solid var(--c-primary, #1e5bff); margin-left: 12px; }

/* ================= 参照版式：左表单 + 右订单预估 ================= */
.cv-panel { flex: 1; min-width: 0; }

.cv-formcard { background: var(--c-card, #fff); border-radius: var(--c-radius, 8px); box-shadow: var(--c-shadow); padding: 26px 28px 24px; }
.cv-form-title { font-size: 18px; font-weight: 700; margin-bottom: 18px; }

.cv-tabs { display: flex; gap: 12px; margin-bottom: 20px; }
.cv-tab { padding: 9px 26px; border-radius: 6px; border: 1px solid #dcdfe6; background: #fff; color: #666; font-size: 14px; cursor: pointer; text-decoration: none; transition: 0.2s; }
.cv-tab:hover { border-color: #0e9f6e; color: #0e9f6e; }
.cv-tab.active { background: #0e9f6e; border-color: #0e9f6e; color: #fff; font-weight: 600; }

.cv-grid2 { display: flex; gap: 20px; }
.cv-grid2 .cv-field { flex: 1; min-width: 0; }
.cv-label { display: block; font-size: 14px; color: #333; margin-bottom: 8px; }

.cv-select { width: 100%; box-sizing: border-box; height: 46px; line-height: 46px; padding: 0 12px; border: 1px solid #dcdfe6; border-radius: var(--c-radius, 8px); font-size: 14px; color: var(--c-text, #1a1f2e); background: #fff; outline: none; transition: 0.2s; }
.cv-select:focus { border-color: #0e9f6e; box-shadow: 0 0 0 3px rgba(14, 159, 110, 0.12); }

.cv-err { margin-top: 6px; font-size: 12px; color: #e34d59; }
.cv-notice { margin-top: 14px; font-size: 13px; color: #e34d59; line-height: 1.8; word-break: break-all; }
.cv-notice:empty { display: none; }

.cv-textarea { height: auto; line-height: 1.8; padding: 12px 16px; font-size: 14px; letter-spacing: 1px; resize: vertical; font-family: Consolas, Monaco, monospace; }
.cv-input-sm { height: 44px; line-height: 44px; font-size: 14px; letter-spacing: 1px; }

/* 收款账户 */
.cv-addpay { margin-top: 8px; font-size: 13px; }
.cv-addpay a { color: #0e9f6e; text-decoration: none; }
.cv-addpay a:hover { text-decoration: underline; }

#cv-paypanel { margin-top: 12px; padding: 16px 16px 14px; border: 1px dashed #c9d2dd; border-radius: var(--c-radius, 8px); background: #fafbfc; }
.cv-paytype { display: flex; gap: 24px; margin-bottom: 12px; font-size: 14px; }
.cv-paytype label { cursor: pointer; display: flex; align-items: center; gap: 5px; }
.cv-paytype input { accent-color: #0e9f6e; }
.cv-paypanel-btns { margin-top: 12px; display: flex; gap: 10px; }
.cv-pay-save { height: 36px; line-height: 36px; padding: 0 22px; border: 0; border-radius: 6px; background: #0e9f6e; color: #fff; font-size: 13px; cursor: pointer; }
.cv-pay-save:hover { opacity: 0.9; }
.cv-pay-cancel { height: 36px; line-height: 34px; padding: 0 22px; border: 1px solid #dcdfe6; border-radius: 6px; background: #fff; color: #666; font-size: 13px; cursor: pointer; }

.cv-agree { display: flex; align-items: center; gap: 8px; margin-top: 18px; font-size: 13px; color: #333; cursor: pointer; }
.cv-agree input { width: 16px; height: 16px; accent-color: #0e9f6e; }

/* 右侧栏 */
.cv-side2 { flex: 0 0 300px; box-sizing: border-box; }

.cv-est { background: var(--c-card, #fff); border-radius: var(--c-radius, 8px); box-shadow: var(--c-shadow); padding: 20px 20px 16px; }
.cv-est-title { font-size: 15px; font-weight: 700; margin-bottom: 14px; }
.cv-est-row { display: flex; justify-content: space-between; align-items: center; padding: 7px 0; font-size: 13px; }
.cv-est-row span { color: #888; }
.cv-est-row b { font-weight: 600; max-width: 180px; text-align: right; word-break: break-all; }
.cv-est-total { margin-top: 12px; padding-top: 14px; border-top: 1px solid #eef0f3; }
.cv-est-total-label { font-size: 13px; color: #888; }
.cv-est-total-num { font-size: 26px; font-weight: 700; color: #0e9f6e; margin-top: 4px; }
.cv-est-total-sub { margin-top: 4px; font-size: 12px; color: #b0b6bf; }

.cv-tips { margin-top: 16px; background: var(--c-card, #fff); border-radius: var(--c-radius, 8px); box-shadow: var(--c-shadow); padding: 16px 20px; }
.cv-tips-title { font-size: 14px; font-weight: 700; margin-bottom: 8px; }
.cv-tips-item { font-size: 12px; color: #999; line-height: 2; }

.cv-submit2 { width: 100%; height: 50px; margin-top: 16px; border: 0; border-radius: var(--c-radius, 8px); background: #0e9f6e; color: #fff; font-size: 17px; letter-spacing: 4px; cursor: pointer; transition: 0.2s; }
.cv-submit2:hover { opacity: 0.9; }
.cv-submit2:disabled { opacity: 0.6; cursor: default; }

.cv-save { display: block; text-align: center; margin-top: 14px; font-size: 13px; color: #999; text-decoration: none; }
.cv-save:hover { color: #0e9f6e; }

/* 窄屏：右侧栏换行到下方 */
@media (max-width: 960px){
    .cv-main { flex-direction: column; }
    .cv-side2 { flex: auto; width: 100%; }
    .cv-grid2 { flex-direction: column; gap: 0; }
}

/* 微调：卡种宽 / 面值窄，与参照一致；提示居中 */
.cv-grid2 .cv-field:first-child { flex: 1.5; }
.cv-notice { text-align: center; }

/* 收款账户未选/未添加：红框提示 */
.cv-select.cv-invalid { border-color: #e34d59; }
.cv-select.cv-invalid:focus { border-color: #e34d59; box-shadow: 0 0 0 3px rgba(227, 77, 89, 0.12); }

/* 卡号卡密未填/位数不符：红框提示 */
.cv-input.cv-invalid { border-color: #e34d59; }
.cv-input.cv-invalid:focus { border-color: #e34d59; box-shadow: 0 0 0 3px rgba(227, 77, 89, 0.12); }