/* docs/features/technical/coin-presentation/ */

.currency-icon {
  display: inline-block;
  width: 1.15em;
  height: 1.15em;
  vertical-align: -0.2em;
  flex-shrink: 0;
  object-fit: contain;
  filter: drop-shadow(0 1px 1px rgba(0, 0, 0, 0.35));
}

.currency-icon--lg {
  width: 1.45em;
  height: 1.45em;
  vertical-align: -0.28em;
}

.currency-icon--diamond {
  filter: drop-shadow(0 0 4px rgba(180, 220, 255, 0.35));
}

.currency-icon--vip {
  filter: drop-shadow(0 0 5px rgba(255, 200, 140, 0.45))
    drop-shadow(0 1px 1px rgba(0, 0, 0, 0.4));
}

/* Honor Badge — Arena-themed wallet currency
   (docs/features/technical/honor-badge-currency/). Warm metallic glow keeps
   it visually distinct from the cool gem family (sapphire / diamond). */
.currency-icon--honor_badge {
  filter: drop-shadow(0 0 5px rgba(255, 196, 116, 0.5))
    drop-shadow(0 1px 1px rgba(0, 0, 0, 0.45));
}

.currency-icon--favor {
  filter: drop-shadow(0 0 6px rgba(255, 215, 120, 0.55))
    drop-shadow(0 1px 1px rgba(0, 0, 0, 0.4));
}

/* Soul Prism — merchant-only currency (docs/features/game-engine/soul-merchant/). */
.currency-icon--soul_prism {
  filter: drop-shadow(0 0 6px rgba(180, 140, 255, 0.55))
    drop-shadow(0 1px 1px rgba(0, 0, 0, 0.4));
}

.currency-inline,
.currency-amount {
  display: inline-flex;
  align-items: center;
  gap: 0.2em;
  vertical-align: middle;
}

.currency-amount__value {
  font-weight: 700;
  font-variant-numeric: tabular-nums;
  line-height: 1;
}

.currency-wallet {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: calc(var(--gs-u-h) * 0.65) calc(var(--gs-u-w) * 1.1);
  margin: 0 0 calc(var(--gs-u-h) * 1);
  padding: calc(var(--gs-u-h) * 0.5) calc(var(--gs-u-h) * 0.65);
  border-radius: var(--gs-radius-sm);
  background: rgba(6, 4, 14, 0.55);
  border: 1px solid var(--gs-border-gold-warm-subtle);
  font-size: var(--gs-text-sm);
}

.currency-wallet__item {
  display: inline-flex;
  align-items: center;
  gap: calc(var(--gs-u-h) * 0.35);
}

.currency-wallet__value {
  font-weight: 700;
  font-variant-numeric: tabular-nums;
  color: #f0e8dc;
}

.booster-pack__price-row {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex-wrap: wrap;
  gap: calc(var(--gs-u-h) * 0.25) calc(var(--gs-u-w) * 0.35);
}

.booster-pack__gem-or {
  font-size: var(--gs-text-2xs);
  font-weight: 700;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  opacity: 0.85;
}