/* Keep the revenue controls while rendering revenue in the original chart slot. */
#heroRevenueHistory.revenue-single-controls {
  margin-top: 4px;
  padding-top: 4px;
  border-top: 0;
}
.revenue-single-controls-line,
.revenue-history-screener-controls.revenue-single-controls {
  display: flex;
  align-items: center;
  gap: 8px;
  flex-wrap: wrap;
}
.revenue-single-controls-line {
  color: #9bdcc7;
  font-size: 10px;
}
.revenue-single-controls .revenue-history-controls {
  display: flex;
  gap: 4px;
  flex-wrap: wrap;
}
.revenue-single-controls .revenue-history-controls button.active {
  background: #79e9c4;
  color: #07221a;
}

/* Revenue SVGs use the existing chart classes, so the original dimensions apply. */
#heroSpark > .revenue-single-chart,
.mini-chart-cell > .revenue-single-chart,
.mobile-token-field-value > .revenue-single-chart {
  width: 100%;
  min-width: 0;
}
.revenue-single-chart .revenue-single-caption {
  display: block;
  color: #8eaea4;
  font-size: 9px;
  line-height: 1.2;
  white-space: normal;
}
.mini-chart-cell .revenue-single-caption,
.mobile-token-field-value .revenue-single-caption {
  font-size: 8px;
  line-height: 1.1;
}
.revenue-single-empty {
  color: #9eafa9;
  font-size: 10px;
}

/* Guard against stale duplicate markup from the previous implementation. */
#heroRevenueChart,
.revenue-history-mini {
  display: none !important;
}