/* ===== 天枢PRO - 深空科技风主题 v2 ===== */
/* 严格基于截图配色：深蓝黑+毛玻璃+荧光绿/红+品牌蓝 */

/* 全局背景 - 深空蓝黑渐变 */
html, body {
  background: #0A0E27 !important;
  background-image: radial-gradient(ellipse at 50% 0%, #0D1B3E 0%, #0A0E27 40%, #000000 100%) !important;
  min-height: 100vh;
  color: #FFFFFF !important;
}

/* 星空粒子效果 - 背景微光 */
body::before {
  content: "";
  position: fixed;
  top: 0; left: 0;
  width: 100%; height: 100%;
  pointer-events: none;
  z-index: 0;
  background-image:
    radial-gradient(1px 1px at 10% 15%, rgba(255,255,255,0.5), transparent),
    radial-gradient(1px 1px at 25% 35%, rgba(255,255,255,0.4), transparent),
    radial-gradient(1.5px 1.5px at 40% 60%, rgba(74,144,255,0.4), transparent),
    radial-gradient(1px 1px at 55% 20%, rgba(255,255,255,0.3), transparent),
    radial-gradient(1px 1px at 70% 45%, rgba(0,212,170,0.4), transparent),
    radial-gradient(1.5px 1.5px at 85% 70%, rgba(255,255,255,0.4), transparent),
    radial-gradient(1px 1px at 15% 80%, rgba(74,144,255,0.3), transparent),
    radial-gradient(1px 1px at 60% 85%, rgba(255,255,255,0.25), transparent),
    radial-gradient(1.5px 1.5px at 90% 10%, rgba(0,255,136,0.3), transparent),
    radial-gradient(1px 1px at 35% 5%, rgba(255,255,255,0.4), transparent),
    radial-gradient(1px 1px at 80% 40%, rgba(74,144,255,0.2), transparent),
    radial-gradient(1px 1px at 50% 50%, rgba(255,255,255,0.3), transparent),
    radial-gradient(1px 1px at 5% 65%, rgba(74,144,255,0.3), transparent),
    radial-gradient(1.5px 1.5px at 95% 30%, rgba(0,212,170,0.3), transparent),
    radial-gradient(1px 1px at 45% 90%, rgba(255,255,255,0.35), transparent);
}

/* 确保内容在星空之上 */
#app, .app-container, .main-content,
#loader-wrapper, [class*="container"],
[class*="content"] {
  position: relative;
  z-index: 1;
}

/* ===== Vant 组件适配 ===== */

/* 顶部导航栏 */
.van-nav-bar,
.header-bar, .top-bar {
  background: rgba(10, 14, 39, 0.95) !important;
  border-bottom: 1px solid rgba(74, 144, 255, 0.12) !important;
}

.van-nav-bar__title {
  color: #FFFFFF !important;
  font-size: 18px !important;
  font-weight: 600 !important;
}

.van-nav-bar__icon {
  color: #FFFFFF !important;
}

.van-nav-bar__text {
  color: rgba(255, 255, 255, 0.7) !important;
}

/* 资产大卡片 - 毛玻璃 */
.asset-card, .balance-card, .total-card,
[class*="asset"], [class*="balance"], [class*="total"],
.dashboard-card, .panel-card,
.van-cell-group, .van-cell {
  background: rgba(26, 35, 68, 0.4) !important;
  backdrop-filter: blur(20px) !important;
  -webkit-backdrop-filter: blur(20px) !important;
  border: 1px solid rgba(74, 144, 255, 0.1) !important;
  border-radius: 16px !important;
  box-shadow: 0 8px 32px rgba(0, 0, 0, 0.35), 0 0 1px rgba(74, 144, 255, 0.2) inset !important;
  color: #FFFFFF !important;
}

/* 总资产数值 - 大号白色 */
.total-amount, .balance-amount, .amount-display,
[class*="total-amount"], [class*="balance-amount"],
.big-number, .amount-text, .value-display,
.van-heading--large, .van-heading--h1,
[class*="amount"] [class*="num"],
.price-value, .coin-amount, .token-price {
  color: #FFFFFF !important;
  font-weight: 700 !important;
}

/* 今日盈亏 - 绿色 */
.profit-badge, .pnl-badge, .daily-pnl,
[class*="profit"], [class*="pnl"], [class*="daily"],
.badge-green, .tag-success, .status-success,
.green-badge, .positive-tag {
  color: #00FF88 !important;
  background: rgba(0, 255, 136, 0.1) !important;
  border: 1px solid rgba(0, 255, 136, 0.2) !important;
  border-radius: 20px !important;
}

/* 上涨/盈利色 - 荧光绿 */
.up, .profit, .positive, .green,
.text-success, .color-green, .gain,
[class*="up"], [class*="profit"], [class*="positive"],
.candle-up, .up-candle, .bullish,
[class*="candle-up"], [class*="text-success"] {
  color: #00D4AA !important;
}

/* 下跌/亏损色 - 荧光红 */
.down, .loss, .negative, .red,
.text-error, .color-red, .loss-text,
[class*="down"], [class*="loss"], [class*="negative"],
.candle-down, .down-candle, .bearish,
[class*="candle-down"], [class*="text-error"] {
  color: #FF4D4D !important;
}

/* ===== 按钮行（充值/提现/分享/活动/认证） ===== */
.action-row, .button-row, .quick-actions,
[class*="action"], [class*="button"], .btn-row,
.toolbar, .nav-actions {
  display: flex !important;
  justify-content: space-around !important;
  align-items: center !important;
  gap: 0 !important;
  padding: 12px 0 !important;
}

.action-btn, .quick-btn, .nav-item,
[class*="action-btn"], [class*="quick-btn"],
.circle-btn, .icon-btn {
  display: flex !important;
  flex-direction: column !important;
  align-items: center !important;
  gap: 6px !important;
  color: rgba(255, 255, 255, 0.7) !important;
  font-size: 12px !important;
  padding: 8px 4px !important;
  border-radius: 12px !important;
  background: transparent !important;
}

.action-btn:hover, .quick-btn:hover, .nav-item:hover,
.circle-btn:hover, .icon-btn:hover {
  background: rgba(74, 144, 255, 0.08) !important;
}

/* 圆形图标容器 */
.circle-icon, .icon-circle, .btn-icon,
[class*="circle-icon"], [class*="icon-circle"] {
  width: 48px !important;
  height: 48px !important;
  border-radius: 50% !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  background: rgba(74, 144, 255, 0.12) !important;
  border: 1px solid rgba(74, 144, 255, 0.15) !important;
}


/* ===== 活动Banner - 深空紫渐变 ===== */
.promo-banner, .activity-banner, .promo-strip,
.reward-banner, .ad-banner, .coupon-bar,
[class="promo-banner"], [class="activity-banner"], [class*="promo"], [class*="reward"] {
  background: linear-gradient(135deg, #4A2D8A 0%, #1A0F4A 50%, #0D1B3E 100%) !important;
  border-radius: 8px !important;
  color: #E0E7FF !important;
}

/* ===== 矿机租赁卡片 ===== */
.mining-card, .rental-card, .product-card,
.feature-card, .plan-card, [class*="mining"],
[class*="rental"], [class*="product"], [class*="plan"] {
  background: rgba(13, 27, 62, 0.5) !important;
  backdrop-filter: blur(16px) !important;
  -webkit-backdrop-filter: blur(16px) !important;
  border: 1px solid rgba(74, 144, 255, 0.1) !important;
  border-radius: 12px !important;
  box-shadow: 0 4px 20px rgba(0, 0, 0, 0.3) !important;
}

.mining-stats, .plan-features, .feature-row,
[class*="mining-stat"], [class*="plan-feat"] {
  display: flex !important;
  justify-content: space-between !important;
  align-items: center !important;
  padding: 8px 0 !important;
  border-bottom: 1px solid rgba(74, 144, 255, 0.06) !important;
  color: rgba(255, 255, 255, 0.7) !important;
  font-size: 12px !important;
}

.mining-stats:last-child, .plan-features:last-child,
.feature-row:last-child {
  border-bottom: none !important;
}

.mining-value, .plan-price, .feature-value,
[class*="stat-val"], [class*="plan-price"] {
  color: #4A90FF !important;
  font-weight: 600 !important;
}

.mining-badge, .status-badge, [class*="badge"],
[class*="tag"] {
  display: inline-block !important;
  padding: 2px 8px !important;
  border-radius: 10px !important;
  font-size: 10px !important;
  background: rgba(74, 144, 255, 0.15) !important;
  color: #4A90FF !important;
  border: 1px solid rgba(74, 144, 255, 0.2) !important;
}

/* ===== 行情滚动条 ===== */
.ticker-bar, .price-ticker, .marquee,
[class*="ticker"], [class*="price-scroll"],
.coin-scroll, .market-strip {
  background: rgba(0, 255, 136, 0.06) !important;
  border-radius: 4px !important;
  padding: 4px 8px !important;
  font-size: 12px !important;
  white-space: nowrap !important;
  overflow: hidden !important;
}

.ticker-up, .price-up, .coin-up,
[class*="ticker-up"], [class*="price-up"] {
  color: #00FF88 !important;
}

.ticker-down, .price-down, .coin-down,
[class*="ticker-down"], [class*="price-down"] {
  color: #FF4D4D !important;
}

/* ===== K线图表区域 ===== */
.chart-area, .kline-chart, .price-chart,
[class*="chart"], [class*="kline"], [class*="graph"],
.chart-container, .candlestick-container {
  background: rgba(13, 27, 62, 0.25) !important;
  border: 1px solid rgba(74, 144, 255, 0.08) !important;
  border-radius: 12px !important;
  padding: 12px !important;
}

/* 时间选择器（1H/4H/1D/1W） */
.time-selector, .period-toggle, .chart-period,
[class*="time-selec"], [class*="period"],
.time-pills, .range-buttons {
  display: flex !important;
  gap: 4px !important;
}

.time-pill, .period-btn, .range-btn,
[class*="time-pill"], [class*="period-btn"] {
  padding: 4px 12px !important;
  border-radius: 16px !important;
  font-size: 12px !important;
  color: rgba(255, 255, 255, 0.5) !important;
  background: rgba(74, 144, 255, 0.08) !important;
  border: 1px solid rgba(74, 144, 255, 0.1) !important;
}

.time-pill.active, .period-btn.active, .range-btn.active,
.time-pill.is-active, .period-btn.is-active,
[class*="active"], [class*="is-active"] {
  color: #FFFFFF !important;
  background: rgba(74, 144, 255, 0.25) !important;
  border-color: rgba(74, 144, 255, 0.4) !important;
  font-weight: 600 !important;
}

/* ===== 底部导航栏 ===== */
.van-tabbar, .tab-bar, .bottom-nav,
.nav-bar-bottom, .footer-nav, .main-nav,
[class*="tabbar"], [class*="bottom-nav"],
[class*="footer-nav"], .nav-bar-footer {
  background: rgba(10, 14, 39, 0.95) !important;
  border-top: 1px solid rgba(74, 144, 255, 0.12) !important;
  backdrop-filter: blur(20px) !important;
  -webkit-backdrop-filter: blur(20px) !important;
}

.van-tabbar-item {
  color: rgba(255, 255, 255, 0.5) !important;
  font-size: 10px !important;
}

.van-tabbar-item--active, .tab-active, .nav-active,
[class*="tabbar-item--active"], [class*="nav--active"],
.is-active, .active-tab {
  color: #4A90FF !important;
}

/* 中央浮动按钮（蓝色双向箭头） */
.fab, .float-btn, .trade-btn, .central-btn,
[class*="float"], [class*="fab"],
.center-action, .main-action {
  background: linear-gradient(135deg, #4A90FF 0%, #00D4AA 100%) !important;
  border-radius: 50% !important;
  box-shadow: 0 4px 20px rgba(74, 144, 255, 0.4) !important;
  width: 56px !important;
  height: 56px !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
}

/* ===== 输入框 ===== */
.van-field, .input-field, .text-field,
[class*="input"], [class*="field"],
.form-input, .search-box {
  background: rgba(26, 35, 68, 0.35) !important;
  border: 1px solid rgba(74, 144, 255, 0.12) !important;
  border-radius: 8px !important;
  color: #FFFFFF !important;
}

.van-field__control, .input-control,
[class*="field__control"] {
  color: #FFFFFF !important;
}

.van-field__control::placeholder,
[class*="field__control"]::placeholder {
  color: rgba(255, 255, 255, 0.35) !important;
}

/* ===== 下拉选择/弹出 ===== */
.van-picker, .select-dropdown, .dropdown-menu,
[class*="picker"], [class*="dropdown"],
.select-wrap {
  background: rgba(13, 27, 62, 0.6) !important;
  border: 1px solid rgba(74, 144, 255, 0.12) !important;
  border-radius: 8px !important;
}

.van-picker__title {
  color: #FFFFFF !important;
}

/* ===== 弹窗/模态框 ===== */
.van-popup, .modal-overlay, .dialog-box,
[class*="popup"], [class*="modal"],
.dialog-wrap, .overlay-panel {
  background: rgba(13, 27, 62, 0.6) !important;
  backdrop-filter: blur(20px) !important;
  -webkit-backdrop-filter: blur(20px) !important;
  border-radius: 16px !important;
}

/* ===== 列表项/单元格 ===== */
.van-cell, .list-item, .menu-item,
[class*="cell"], [class*="list-item"],
.menu-row, .option-row {
  background: rgba(26, 35, 68, 0.2) !important;
  border-bottom: 1px solid rgba(74, 144, 255, 0.06) !important;
  color: #FFFFFF !important;
}

.van-cell::after {
  border-bottom-color: rgba(74, 144, 255, 0.06) !important;
}

.van-cell__title {
  color: #FFFFFF !important;
}

.van-cell__value {
  color: rgba(255, 255, 255, 0.6) !important;
}

/* ===== 分割线 ===== */
.divider, .separator, .line-divider,
[class*="divider"], [class*="separator"] {
  border-top: 1px solid rgba(74, 144, 255, 0.08) !important;
}

/* ===== 标签/徽章 ===== */
.van-tag, .badge, .chip, .tag,
[class*="tag"], [class*="badge"],
.chip-component {
  border-radius: 4px !important;
  font-size: 10px !important;
  padding: 2px 6px !important;
}

.van-tag--primary, .tag-blue {
  background: rgba(74, 144, 255, 0.2) !important;
  color: #4A90FF !important;
  border: 1px solid rgba(74, 144, 255, 0.3) !important;
}

.van-tag--success, .tag-green {
  background: rgba(0, 212, 170, 0.2) !important;
  color: #00D4AA !important;
  border: 1px solid rgba(0, 212, 170, 0.3) !important;
}

.van-tag--danger, .tag-red {
  background: rgba(255, 77, 77, 0.2) !important;
  color: #FF4D4D !important;
  border: 1px solid rgba(255, 77, 77, 0.3) !important;
}

/* ===== 进度条 ===== */
.van-progress, .progress-bar, .level-bar,
[class*="progress"], [class*="level"] {
  background: rgba(74, 144, 255, 0.15) !important;
}

.van-progress__pivot {
  background: rgba(74, 144, 255, 0.25) !important;
  color: #4A90FF !important;
  border: 1px solid rgba(74, 144, 255, 0.3) !important;
}

/* ===== Toast提示 ===== */
.van-toast, .toast-message, .tip-popup,
[class*="toast"], [class*="tip"] {
  background: rgba(13, 27, 62, 0.92) !important;
  backdrop-filter: blur(16px) !important;
  -webkit-backdrop-filter: blur(16px) !important;
  border: 1px solid rgba(74, 144, 255, 0.15) !important;
  border-radius: 8px !important;
  color: #FFFFFF !important;
}

/* ===== Loading加载 ===== */
.van-loading, .loading-spinner, .loading-mask,
[class*="loading"] {
  color: #4A90FF !important;
}

/* ===== Tab切换 ===== */
.van-tabs__line, .tab-indicator, .tab-line,
[class*="tabs__line"], [class*="tab-indicator"] {
  background: #4A90FF !important;
}

.van-tab--active, .tab-active,
[class*="tab--active"], [class*="active-tab"] {
  color: #FFFFFF !important;
}

.van-tab {
  color: rgba(255, 255, 255, 0.5) !important;
}

/* ===== 按钮通用 ===== */
.van-button, .btn, button, [class*="button"],
[class*="btn"] {
  border-radius: 8px !important;
}

.van-button--primary, .btn-primary,
[class*="btn-primary"], [class*="button--primary"] {
  background: linear-gradient(135deg, #4A90FF 0%, #00D4AA 100%) !important;
  border: none !important;
  color: #FFFFFF !important;
  box-shadow: 0 4px 16px rgba(74, 144, 255, 0.3) !important;
}

.van-button--default, .btn-default,
[class*="btn-default"] {
  background: rgba(74, 144, 255, 0.15) !important;
  border: 1px solid rgba(74, 144, 255, 0.2) !important;
  color: #4A90FF !important;
}

.van-button--success, .btn-success,
[class*="btn-success"] {
  background: linear-gradient(135deg, #00D4AA 0%, #00FF88 100%) !important;
  border: none !important;
  color: #000000 !important;
}

.van-button--danger, .btn-danger,
[class*="btn-danger"] {
  background: linear-gradient(135deg, #FF4D4D 0%, #FF1744 100%) !important;
  border: none !important;
  color: #FFFFFF !important;
}

/* ===== 空状态 ===== */
.empty-state, .no-data, .empty-tip,
[class*="empty"], [class*="no-data"] {
  color: rgba(255, 255, 255, 0.4) !important;
}

/* ===== 滚动条美化 ===== */
::-webkit-scrollbar {
  width: 4px;
  height: 4px;
}

::-webkit-scrollbar-track {
  background: rgba(10, 14, 39, 0.3);
}

::-webkit-scrollbar-thumb {
  background: rgba(74, 144, 255, 0.3);
  border-radius: 2px;
}

::-webkit-scrollbar-thumb:hover {
  background: rgba(74, 144, 255, 0.5);
}

/* ===== 警告/提示框 ===== */
.van-alert, .alert-box, .notice-tip,
[class*="alert"], [class*="notice"],
.info-box, .tip-panel {
  background: rgba(74, 144, 255, 0.1) !important;
  border: 1px solid rgba(74, 144, 255, 0.2) !important;
  border-radius: 8px !important;
  color: #FFFFFF !important;
}

.van-alert--success {
  background: rgba(0, 212, 170, 0.1) !important;
  border-color: rgba(0, 212, 170, 0.2) !important;
}

.van-alert--danger {
  background: rgba(255, 77, 77, 0.1) !important;
  border-color: rgba(255, 77, 77, 0.2) !important;
}

/* ===== 下拉菜单 ===== */
.van-dropdown-menu, .drop-menu, .dropdown-panel,
[class*="dropdown"], [class*="drop-menu"] {
  background: rgba(10, 14, 39, 0.95) !important;
}

.van-dropdown-menu__title {
  color: rgba(255, 255, 255, 0.7) !important;
}

/* ===== 侧边栏 ===== */
.van-sidebar, .side-nav, .sidebar-menu,
[class*="sidebar"], [class*="side-nav"] {
  background: rgba(10, 14, 39, 0.95) !important;
}

.van-sidebar__item--active {
  color: #4A90FF !important;
  border-left: 3px solid #4A90FF !important;
}

/* ===== 图片上传 ===== */
.van-uploader, .img-upload, .upload-area,
[class*="uploader"], [class*="img-upload"] {
  border: 1px dashed rgba(74, 144, 255, 0.3) !important;
  border-radius: 8px !important;
  background: rgba(26, 35, 68, 0.2) !important;
}

/* ===== 滑块 ===== */
.van-slider, .slider-bar, .range-slider,
[class*="slider"], [class*="range-slider"] {
  color: #4A90FF !important;
}

.van-slider__track {
  background: rgba(74, 144, 255, 0.3) !important;
}

/* ===== 时间选择 ===== */
.van-datetime-picker, .time-picker, .date-picker,
[class*="datetime-picker"], [class*="time-picker"] {
  background: rgba(13, 27, 62, 0.98) !important;
  color: #FFFFFF !important;
}

/* ===== 数字键盘 ===== */
.van-number-keyboard, .key-pad, .numpad,
[class*="number-keyboard"], [class*="key-pad"] {
  background: rgba(10, 14, 39, 0.98) !important;
}

.van-number-keyboard__header {
  color: #FFFFFF !important;
  border-bottom: 1px solid rgba(74, 144, 255, 0.1) !important;
}

/* ===== 开关 ===== */
.van-switch, .toggle-switch, .switch-btn,
[class*="switch"], [class*="toggle"] {
  background: rgba(74, 144, 255, 0.3) !important;
}

.van-switch__on, .switch-on,
[class*="switch__on"] {
  background: #4A90FF !important;
}

/* ===== 复选框 ===== */
.van-checkbox, .check-box, .cb-item,
[class*="checkbox"], [class*="check-box"] {
  color: #FFFFFF !important;
}

.van-checkbox__icon--checked, .cb-checked,
[class*="checkbox__icon--checked"] {
  background: #4A90FF !important;
  border-color: #4A90FF !important;
}

/* ===== 单选框 ===== */
.van-radio, .radio-btn, .rb-item,
[class*="radio"], [class*="radio-btn"] {
  color: #FFFFFF !important;
}

.van-radio__icon--checked, .rb-checked,
[class*="radio__icon--checked"] {
  background: #4A90FF !important;
  border-color: #4A90FF !important;
}

/* ===== 步骤条 ===== */
.van-steps, .step-bar, .steps-indicator,
[class*="steps"], [class*="step"] {
  color: #4A90FF !important;
}

.van-steps__finish {
  color: #4A90FF !important;
}

/* ===== 搜索框 ===== */
.search-bar, .search-input, .filter-bar,
[class*="search"], [class*="filter"] {
  background: rgba(26, 35, 68, 0.35) !important;
  border: 1px solid rgba(74, 144, 255, 0.1) !important;
  border-radius: 20px !important;
}

/* ===== 价格闪烁动画 ===== */
@keyframes price-flash-green {
  0% { color: #00FF88; }
  100% { color: #FFFFFF; }
}

@keyframes price-flash-red {
  0% { color: #FF4D4D; }
  100% { color: #FFFFFF; }
}

.price-up-flash {
  animation: price-flash-green 0.5s ease-out;
}

.price-down-flash {
  animation: price-flash-red 0.5s ease-out;
}
