/* 币种图标 - 本地化 SVG 版本 */
.coin-icon {
  width: 40px;
  height: 40px;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 11px;
  font-weight: 700;
  color: #fff;
  background-size: contain;
  background-repeat: no-repeat;
  background-position: center;
  background-color: rgba(255,255,255,0.05);
  flex-shrink: 0;
}
.coin-icon::before { display: none; }

/* 使用本地 SVG 图标文件 */
.coin-icon[data-coin] {
  background-image: url('/static/coins/' attr(data-coin) '.svg');
  background-size: 100% 100%;
  color: transparent;
  font-size: 0;
}

/* 列表中的币种图标（img标签方式） */
.coin-icon-img {
  width: 40px;
  height: 40px;
  border-radius: 50%;
  margin-right: 12px;
  flex-shrink: 0;
  object-fit: cover;
  display: block;
}
.coin-icon-fallback {
  width: 40px;
  height: 40px;
  border-radius: 50%;
  margin-right: 12px;
  flex-shrink: 0;
  display: none;
  align-items: center;
  justify-content: center;
  background: linear-gradient(135deg, #4f8cff, #00d4ff);
  color: #fff;
  font-size: 18px;
}

/* 备用渐变样式（图标文件不存在时的兜底） */
.coin-icon[data-coin="BTC"] { background-image: linear-gradient(135deg, #f7931a, #ffb347); color: #fff; font-size: 10px; letter-spacing: -0.5px; }
.coin-icon[data-coin="ETH"] { background-image: linear-gradient(135deg, #627eea, #8c9eff); color: #fff; }
.coin-icon[data-coin="SOL"] { background-image: linear-gradient(135deg, #9945ff, #14f195); color: #fff; font-size: 9px; }
.coin-icon[data-coin="BNB"] { background-image: linear-gradient(135deg, #f0b90b, #ffd54f); color: #fff; font-size: 10px; }
.coin-icon[data-coin="XRP"] { background-image: linear-gradient(135deg, #23292f, #4a5568); color: #fff; }
.coin-icon[data-coin="DOGE"] { background-image: linear-gradient(135deg, #c2a633, #e8d174); color: #fff; font-size: 10px; }
.coin-icon[data-coin="ADA"] { background-image: linear-gradient(135deg, #0033ad, #0066ff); color: #fff; }
.coin-icon[data-coin="AVAX"] { background-image: linear-gradient(135deg, #e84142, #ff6b6b); color: #fff; }
.coin-icon[data-coin="DOT"] { background-image: linear-gradient(135deg, #e6007a, #ff4d94); color: #fff; font-size: 10px; }
.coin-icon[data-coin="MATIC"] { background-image: linear-gradient(135deg, #8247e5, #a78bfa); color: #fff; font-size: 9px; }
.coin-icon[data-coin="LINK"] { background-image: linear-gradient(135deg, #2a5ada, #5a8dee); color: #fff; }
.coin-icon[data-coin="UNI"] { background-image: linear-gradient(135deg, #ff007a, #ff4d94); color: #fff; }
.coin-icon[data-coin="ATOM"] { background-image: linear-gradient(135deg, #2e3148, #5a6a8a); color: #fff; }
.coin-icon[data-coin="LTC"] { background-image: linear-gradient(135deg, #bfbbbb, #e0e0e0); color: #333; }
.coin-icon[data-coin="ETC"] { background-image: linear-gradient(135deg, #33ff00, #66ff33); color: #fff; }
.coin-icon[data-coin="BCH"] { background-image: linear-gradient(135deg, #8dc351, #b8e986); color: #fff; }
.coin-icon[data-coin="TRX"] { background-image: linear-gradient(135deg, #eb0029, #ff4d5a); color: #fff; }
.coin-icon[data-coin="NEAR"] { background-image: linear-gradient(135deg, #000000, #333333); color: #fff; }
.coin-icon[data-coin="APT"] { background-image: linear-gradient(135deg, #4cd964, #8ce99a); color: #fff; }
.coin-icon[data-coin="OP"] { background-image: linear-gradient(135deg, #ff0420, #ff4d5a); color: #fff; }
.coin-icon[data-coin="FIL"] { background-image: linear-gradient(135deg, #0090ff, #00b4ff); color: #fff; }
.coin-icon[data-coin="ARB"] { background-image: linear-gradient(135deg, #28a0f0, #5cb3ff); color: #fff; }
.coin-icon[data-coin="SUI"] { background-image: linear-gradient(135deg, #6fbcff, #a8d4ff); color: #fff; }
.coin-icon:not([data-coin]) { background-image: linear-gradient(135deg, #4f8cff, #00d4ff); color: #fff; }