.input-row > span {
  color: #292631;
  font-weight: 700;
}

/* Keep the price/share controls clear of the longer balance label. */
.input-row {
  grid-template-columns: 124px minmax(0, 1fr);
}

.input-row > div {
  width: min(100%, 360px);
  justify-self: end;
}

.hint,
.quick {
  margin-left: 126px;
}

/* Reserve the same suffix column as the price row so both values align. */
.input-row:not(#priceRow) > div::before {
  content: "¢";
  visibility: hidden;
  grid-column: 3;
  grid-row: 1;
}

.input-row:not(#priceRow) > div > button:last-child {
  grid-column: 4;
  grid-row: 1;
}

.input-row .amount-copy {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 3px;
}

.amount-copy b {
  font-size: 15px;
}

.amount-copy small {
  color: #3771c8;
  font-size: 11px;
  font-weight: 500;
  white-space: nowrap;
}

.quick {
  grid-template-columns: repeat(5, minmax(0, 1fr));
}

.wallet-profile-link {
  color: #f5f7fb;
  font-size: 15px;
  font-weight: 800;
  text-decoration: none;
}

.wallet-profile-link:hover {
  color: #70a3ff;
  text-decoration: underline;
}

.wallet-ledger .wallet-available {
  color: #62ddb4;
  font-size: 12px;
  font-weight: 800;
}

.wallet-control-row .wallet-row-controls {
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: flex-end;
  flex-wrap: nowrap;
  gap: 7px;
}

.wallet-control-row .wallet-row-controls > button {
  flex: 0 0 auto;
  white-space: nowrap;
}

.wallet-control-row .wallet-sync-switch {
  display: flex !important;
  flex-direction: row;
  flex: 0 0 auto;
  min-width: 72px;
  white-space: nowrap;
}

@media (max-width: 700px) {
  .input-row > div {
    width: min(100%, 300px);
  }

  .wallet-control-row .wallet-row-controls {
    justify-content: flex-start;
    flex-wrap: wrap;
  }
}