/* ========================================================================
   Component: Formatted Token Amount
 ========================================================================== */
.uk-formatted-token-amount {
  color: var(--formatted-token-amount-color);
  column-gap: var(--global-xsmall-gutter);
  white-space: nowrap;
}

.uk-formatted-token-amount .uk-formatted-token-amount-integer {
  color: var(--formatted-token-amount-integer-color);
}

.uk-formatted-token-amount .uk-formatted-token-amount-fractional {
  color: var(--formatted-token-amount-fractional-color);
  font-size: var(--formatted-token-amount-fractional-font-size);
}

.uk-formatted-token-amount .uk-formatted-token-symbol {
  display: inline-block;
  max-width: 120px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

:root {
  --formatted-token-amount-color: var(--global-color);
  --formatted-token-amount-integer-color: var(--formatted-token-amount-color);
  --formatted-token-amount-fractional-color: var(--global-muted-color);
  --formatted-token-amount-fractional-font-size: 0.95rem;
}