/* Peso-first presentation; all financial storage and USD input values are unchanged. */
.currency-reference { margin:-12px 0 24px; padding:10px 14px; border-left:2px solid var(--border-strong); color:var(--muted); font-size:11px; line-height:1.6; }
.currency-pair { display:inline-flex; flex-direction:column; gap:3px; max-width:100%; min-width:0; vertical-align:top; font-size:inherit; font-weight:inherit; color:inherit; letter-spacing:normal; text-transform:none; white-space:normal; text-align:inherit; }
.currency-pair .currency-primary { display:block; font-size:inherit; font-weight:inherit; color:inherit; letter-spacing:inherit; text-transform:none; line-height:1.3; overflow-wrap:anywhere; }
.currency-pair .currency-secondary { display:block; font-size:11px; font-weight:400; color:var(--muted); letter-spacing:0; text-transform:none; line-height:1.5; overflow-wrap:anywhere; }
.metric-value .currency-secondary { font-size:12px; }
.metric-foot .currency-pair { font-size:11px; }
.metric-foot .currency-secondary { font-size:10px; }
.rate-price > small { display:block; margin-top:4px; }
.currency-input-preview { display:block; color:var(--muted); font-size:11px; line-height:1.5; font-weight:400; }
.currency-input-preview .currency-pair { font-size:15px; font-weight:600; color:var(--forest); }
.currency-input-preview .currency-secondary { font-size:11px; }
.fx-preset { text-align:left; }
.fx-preset .currency-pair { margin-top:4px; }
@media (max-width:760px) {
  .currency-reference { margin-top:-8px; padding:8px 10px; }
  .progress-row { grid-template-columns:minmax(0,1fr) minmax(0,1fr); }
  .progress-row .progress-track { grid-row:2; grid-column:1/-1; }
  .progress-row > .money { text-align:right; }
}

.currency-pair,.currency-pair .currency-primary,.currency-pair .currency-secondary { overflow:visible; text-overflow:clip; }
.snapshot-net { margin-top:8px; font-size:15px; font-weight:600; color:var(--forest); }
.rate-example-list > div > strong { min-width:0; flex:0 0 auto; text-align:right; }
.rate-example-list > div > span { white-space:normal; }
@media (min-width:761px) {
  .invoice-table { min-width:740px; }
  .invoice-table td:last-child .button { white-space:nowrap; }
}
