/* Live transactions table: shared by index.html and transactions.html. */
.txns-head { display: flex; align-items: center; justify-content: space-between; gap: 12px; margin-bottom: 14px; flex-wrap: wrap; }
.card .txns-head h2 { margin: 0; }
.live { display: inline-flex; align-items: center; gap: 6px; font-size: 12px; font-weight: 600; color: var(--muted); }
.live::before { content: ""; width: 8px; height: 8px; border-radius: 50%; background: #c4c8d6; }
.live.on { color: #0d6b3c; }
.live.on::before { background: #22c55e; box-shadow: 0 0 0 3px #22c55e33; }
.table-scroll { overflow-x: auto; }
table { width: 100%; border-collapse: collapse; font-size: 13px; }
th { text-align: left; font-size: 11px; text-transform: uppercase; letter-spacing: .04em; color: var(--muted); font-weight: 600; padding: 0 10px 8px; border-bottom: 1px solid var(--border); white-space: nowrap; }
td { padding: 10px; border-bottom: 1px solid var(--border); white-space: nowrap; vertical-align: middle; }
td.event { white-space: normal; min-width: 180px; color: var(--muted); }
#txn-rows tr[data-ref] { cursor: pointer; }
#txn-rows tr[data-ref]:hover td { background: #f8f9fc; }
td.ref a { color: var(--brand); text-decoration: none; }
td.ref a:hover { text-decoration: underline; }
td.ref { font-family: ui-monospace, SFMono-Regular, Menlo, monospace; font-size: 12px; }
td.num { text-align: right; font-variant-numeric: tabular-nums; }
th.num { text-align: right; }
tr.flash td { animation: flash 1.2s ease-out; }
@keyframes flash { from { background: #fff6d6; } to { background: transparent; } }
.badge { display: inline-block; padding: 3px 9px; border-radius: 999px; font-size: 12px; font-weight: 600; background: #eef0f6; color: var(--muted); }
.badge.success { background: #e4f6ec; color: #0d6b3c; }
.badge.failed { background: #fde8e8; color: #b42318; }
.badge.pin_required, .badge.otp_required, .badge.awaiting_transfer { background: #fff4d6; color: #8a5a00; }
.empty td { text-align: center; color: var(--muted); padding: 24px 10px; white-space: normal; }