/* sobre.cash — aviso de salida del invitado, historial de órdenes y tipo de cambio.
   Sólo custom properties del tema (app.css), así sigue cualquier paleta. */

/* ── Tipo de cambio (depositar) ─────────────────────────────────────────── */
.fx-rate { margin-bottom: .9rem; color: var(--muted); font-size: .95rem; }
.fx-rate strong { color: var(--text); font-weight: 700; }
.fx-note { margin-top: .8rem; }
.fx-box .quote { margin: 0; }

/* ── Aviso de salida del invitado ───────────────────────────────────────── */
.lg-dialog {
  width: min(30rem, calc(100vw - 2rem));
  max-height: calc(100dvh - 2rem);
  overflow: auto;
  padding: 1.5rem;
  border: 1px solid var(--line);
  border-top: 4px solid var(--warn);
  border-radius: var(--r-lg);
  background: var(--surface);
  color: var(--text);
  font-family: var(--ui);
}
.lg-dialog::backdrop { background: rgba(25, 33, 61, .14); }
.lg-dialog h2 { font-family: var(--display); font-size: 1.35rem; }
.lg-dialog > * + * { margin-top: 1.1rem; }
.lg-copy > * + * { margin-top: .6rem; }
.lg-balance { padding: .75rem 1rem; border-radius: var(--r-sm); border: 1px solid var(--warn); background: var(--raised); font-weight: 700; }
.lg-actions { justify-content: flex-end; }

/* ── Historial de órdenes (depósitos y retiros) ─────────────────────────── */
.tl-row { align-items: flex-start; }
.tl-row .main { flex: 1; }
.row-actions { margin-top: .5rem; }
.tl-box { margin-top: .75rem; }
.tl { list-style: none; margin: 0; padding: 0 0 0 .9rem; border-left: 2px solid var(--line); }
.tl > li { display: grid; gap: .1rem; padding: .35rem 0; font-size: .875rem; }
.tl-when { color: var(--muted); font-size: .78rem; font-variant-numeric: tabular-nums; }
.tl-what { font-weight: 600; }
.tl-detail { color: var(--text-2); overflow-wrap: anywhere; }