/* ============================================================
   P16 支付网关 · 模块样式(支付订单 / 收款统计 / 收银台弹窗)
   ------------------------------------------------------------
   复用 app.css 的设计系统变量与基础类(card / stat-grid / stat / toolbar /
   btn / tag / form-row / form-grid / modal / pager / empty / hint),
   本文件只补支付特有的:金额着色、收银台面板、回调报文块、筛选行、趋势条。
   不引入任何外部 CDN。
   ============================================================ */

/* ---------- 金额 ---------- */
.p16-money      { font-weight: 600; font-variant-numeric: tabular-nums; }
.p16-money-in   { color: var(--success); font-weight: 600; }
.p16-money-out  { color: var(--danger);  font-weight: 600; }
.p16-money-big  { font-size: 22px; font-weight: 700; color: var(--danger); font-variant-numeric: tabular-nums; }
.p16-money-sub  { color: var(--text-2); font-size: 12.5px; }

/* ---------- 筛选行 ---------- */
.p16-filter { display: flex; flex-wrap: wrap; gap: 8px; align-items: center; }
.p16-filter input,
.p16-filter select { height: 30px; padding: 0 8px; border: 1px solid var(--border); border-radius: 6px; background: #fff; font-size: 13px; }
.p16-filter input[type="date"] { width: 138px; }
.p16-filter input.p16-w-sm { width: 120px; }
.p16-filter input.p16-w-md { width: 180px; }
.p16-filter input.p16-w-lg { width: 220px; }

/* ---------- 统计卡片补充 ---------- */
.p16-stat-note { color: var(--text-3); font-size: 12px; margin-top: 2px; }
.p16-trend-bar { height: 6px; border-radius: 3px; background: var(--primary-light); position: relative; overflow: hidden; min-width: 60px; }
.p16-trend-bar > i { display: block; height: 100%; background: var(--primary); border-radius: 3px; }

/* ---------- 收银台弹窗 ---------- */
.p16-cashier { display: flex; flex-direction: column; gap: 12px; }
.p16-cashier-head {
    display: flex; align-items: center; justify-content: space-between; gap: 12px;
    background: var(--primary-light); border: 1px solid #dbe2fb; border-radius: var(--radius);
    padding: 12px 14px;
}
.p16-cashier-head .t  { font-size: 13px; color: var(--text-2); }
.p16-cashier-head .n  { font-size: 13px; color: var(--text); word-break: break-all; }
.p16-cashier-body { display: grid; grid-template-columns: 1fr; gap: 10px; }
.p16-pay-code {
    background: #0f172a; color: #a7f3d0; border-radius: var(--radius);
    padding: 10px 12px; font-size: 12.5px; line-height: 1.7;
    word-break: break-all; white-space: pre-wrap; max-height: 160px; overflow: auto;
}
.p16-pay-code.qr { text-align: center; font-family: ui-monospace, Menlo, Consolas, monospace; }
.p16-kv { display: flex; justify-content: space-between; gap: 12px; padding: 7px 0; border-bottom: 1px dashed var(--border); }
.p16-kv:last-child { border-bottom: none; }
.p16-kv > span { color: var(--text-2); flex: 0 0 auto; }
.p16-kv > b { font-weight: 600; text-align: right; word-break: break-all; }
.p16-ops { display: flex; flex-wrap: wrap; gap: 8px; }
.p16-tip { color: var(--text-2); font-size: 12.5px; background: #fbfcfe; border: 1px dashed var(--border); border-radius: var(--radius); padding: 8px 10px; }
.p16-steps { display: flex; flex-wrap: wrap; gap: 6px; align-items: center; color: var(--text-3); font-size: 12.5px; }
.p16-steps b { color: var(--text); }
.p16-steps .sep { color: var(--border); }

/* ---------- 回调/日志报文 ---------- */
.p16-log { display: flex; flex-direction: column; gap: 8px; }
.p16-log-item { border: 1px solid var(--border); border-radius: var(--radius); overflow: hidden; }
.p16-log-head {
    display: flex; align-items: center; gap: 8px; flex-wrap: wrap;
    padding: 8px 10px; background: #fafbfd; border-bottom: 1px solid var(--border); font-size: 12.5px; color: var(--text-2);
}
.p16-log-head .u { flex: 1; word-break: break-all; color: var(--text-3); }
.p16-log-body { padding: 8px 10px; }
.p16-log-body pre {
    background: #0f172a; color: #cbd5e1; border-radius: 6px; padding: 8px 10px;
    font-size: 12px; line-height: 1.6; max-height: 240px; overflow: auto; white-space: pre-wrap; word-break: break-all;
}
.p16-log-body .lbl { font-size: 12px; color: var(--text-3); margin: 6px 0 4px; }
.p16-copy { cursor: pointer; color: var(--primary); font-size: 12.5px; }

/* ---------- 表格内小操作 ---------- */
.p16-row-actions { display: flex; flex-wrap: wrap; gap: 6px; }
.p16-row-actions a, .p16-row-actions button { font-size: 12.5px; }
.p16-detail-head { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; }
.p16-back { color: var(--text-2); font-size: 13px; }