/* =========================================================
   CoinASX V137 - FULL SITE THEME
   原则：
   1. 深色纯黑
   2. 大字白，小字灰白
   3. 浅色白底，黑字，灰色辅助
   4. 红绿交易色不破坏
   5. 不改变尺寸/位置/点击/业务逻辑
   ========================================================= */

html{
  color-scheme:dark;

  --cx-bg:#000000;
  --cx-bg-2:#090a0c;
  --cx-panel:#111316;
  --cx-panel-2:#181b1f;
  --cx-panel-3:#202329;

  --cx-border:#292d33;
  --cx-border-soft:#202329;

  --cx-text:#ffffff;
  --cx-text-2:#eef0f2;
  --cx-sub:#a2a7af;
  --cx-muted:#717780;
  --cx-placeholder:#5f656d;

  --cx-overlay:rgba(0,0,0,.68);
  --cx-shadow:0 10px 30px rgba(0,0,0,.32);

  --cx-green:#16c784;
  --cx-red:#ea3943;
  --cx-accent:#baff21;

  --cx-scroll:#333840;
}

/* ===== 浅色 ===== */
html.cx-theme-light,
html[data-theme="light"],
html[data-cx-theme="light"]{
  color-scheme:light;

  --cx-bg:#ffffff;
  --cx-bg-2:#fafbfc;
  --cx-panel:#f4f5f7;
  --cx-panel-2:#eceef1;
  --cx-panel-3:#e5e8ec;

  --cx-border:#dfe2e6;
  --cx-border-soft:#e9ebee;

  --cx-text:#111317;
  --cx-text-2:#292d33;
  --cx-sub:#747b84;
  --cx-muted:#989fa8;
  --cx-placeholder:#a8aeb6;

  --cx-overlay:rgba(16,19,24,.28);
  --cx-shadow:0 10px 30px rgba(15,23,42,.08);

  --cx-green:#0fa772;
  --cx-red:#df4155;
  --cx-accent:#8fdc13;

  --cx-scroll:#c7ccd2;
}

/* ===== 深色明确锁定 ===== */
html.cx-theme-dark,
html[data-theme="dark"],
html[data-cx-theme="dark"]{
  color-scheme:dark;

  --cx-bg:#000000;
  --cx-bg-2:#090a0c;
  --cx-panel:#111316;
  --cx-panel-2:#181b1f;
  --cx-panel-3:#202329;

  --cx-border:#292d33;
  --cx-border-soft:#202329;

  --cx-text:#ffffff;
  --cx-text-2:#eef0f2;
  --cx-sub:#a2a7af;
  --cx-muted:#717780;
  --cx-placeholder:#5f656d;

  --cx-overlay:rgba(0,0,0,.68);
  --cx-shadow:0 10px 30px rgba(0,0,0,.32);

  --cx-green:#16c784;
  --cx-red:#ea3943;
  --cx-accent:#baff21;
}

/* =========================================================
   1. 根节点 / 页面容器
   ========================================================= */
html,
body,
#app,
#app > div,
.appContent,
.mainBackground,
.main-background,
.page,
.page-wrap,
.page-container,
.content,
.container{
  background-color:var(--cx-bg)!important;
  color:var(--cx-text-2)!important;
}

/* 常见二开页面 */
.home,
.new-home,
.trade,
.deliveryContract,
.login,
.register,
.assets,
.asset,
.quotes,
.market,
.userCenter,
.user-center,
.financial,
.c2c,
.customerService,
.helpCenter{
  background-color:var(--cx-bg)!important;
  color:var(--cx-text-2)!important;
}

/* =========================================================
   2. 原站主题工具类
   ========================================================= */
.textColor{
  color:var(--cx-text)!important;
}

.textColor1{
  color:var(--cx-sub)!important;
}

.textColor2,
.text-grey,
.text-gray,
.text-muted{
  color:var(--cx-sub)!important;
}

.mainBackground{
  background:var(--cx-bg)!important;
}

.inputBackground{
  background:var(--cx-panel)!important;
  color:var(--cx-text)!important;
}

.tabBackground,
.tabBackground1,
.bgFooter{
  background:var(--cx-bg-2)!important;
  color:var(--cx-text)!important;
}

.border-b-color,
.border-grey,
.border-gray{
  border-color:var(--cx-border)!important;
}

.diviLine,
.line,
.divider,
.split-line{
  background-color:var(--cx-border-soft)!important;
}

/* =========================================================
   3. 标题 / 正文 / 辅助字
   ========================================================= */
h1,h2,h3,h4,h5,h6,
.title,
.page-title,
.s
.card-title,
.header-title{
  color:var(--c
}

p,
span,
label,
li,
td,
th{
  border-color:inherit;
}

.subtitle,
.desc,
.description,
.tip,
.tips,
.hint,
.helper,
.caption,
.meta{
  color:var(--cx-sub)!important;
}

/* =========================================================
   4. 输入框 / 表单 / 搜索框
   ================
input,
textarea,
select{
  co
  caret-color:var(--cx-text)!important;
}

input::placeholder,
textarea::placeholder{
  color:var(--cx-pl
  -webkit-text-fill-color:var(--cx-placeholder)!important;
}

input:disabled,
textarea:disabled,
select:disabled{
  color:var(--cx-muted)!important;
  -webkit-text-fill-color:var(--cx-muted)!important;
  opacity:1!important;
}

.iptbox,
.input-box,
.input-wrap,
.input-wrapper,
.search-box,
.search-input,
.select-box,
.select-wrap,
.form-control,
.form-item{
  background-color:var(--cx-panel)!important;
  border-color:var(--cx-border)!important;
  color:var(--cx-text)!important;
}

/* =========================================================
   5. 卡片 / 区块 / 容器
   ========================================================= */
.card,
.panel,
.box,
.module,
.section-card,
.market-card,
.asset-card,
.quote-card,
.order-card,
.info-card,
.wallet-card,
.list-card{
  background-color:var(--cx-panel)!important;
  border-color:var(--cx-border)!important;
  color:var(--cx-text-2)!important;
}

/* =========================================================
   6. 原生按钮与业务按钮
   不强制覆盖红绿业务按钮
   ========================================================= */
button,
.button,
.btn{
  border-color:var(--cx-border);
}

button:not(.bg-green):not(.bg-red):not(.btnMain):not(.buyandSell),
.button:not(.bg-green):not(.bg-red),
.btn:not(.bg-green):not(.bg-red):not(.btnMain){
  color:var(--cx-text);
}

/* 业务红绿继续保持 */
.text-green,
.up,
.green,
[class*="up-color"]{
  color:var(--cx-green)!important;
}

.text-red,
.down,
.red,
[class*="down-color"]{
  color:var(--cx-red)!important;
}

.bg-green{
  background-color:var(--cx-green)!important;
  color:#fff!important;
}

.bg-red{
  background-color:var(--cx-red)!important;
  color:#fff!important;
}

/* =========================================================
   7. Vant 全站组件
   ========================================================= */
.van-nav-bar,
.van-tabbar,
.van-tabs__nav,
.van-cell,
.van-cell-group,
.van-collapse-item__content,
.van-collapse-item__title,
.van-list,
.van-grid-item__content,
.van-sidebar,
.van-sidebar-item,
.van-dropdown-menu__bar,
.van-dropdown-item__content,
.van-action-sheet,
.van-popup,
.van-dialog,
.van-picker,
.van-picker__toolbar,
.van-calendar,
.van-calendar__header,
.van-calendar__body,
.van-datetime-picker,
.van-number-keyboard,
.van-password-input,
.van-search,
.van-field,
.van-form{
  background-color:var(--cx-bg)!important;
  color:var(--cx-text-2)!important;
  border-color:var(--cx-border)!important;
}

.van-cell,
.van-field,
.van-grid-item__content,
.van-sidebar-item{
  background-color:var(--cx-panel)!important;
}

.van-cell__title,
.van-cell__value,
.van-field__label,
.van-field__control,
.van-nav-bar__title,
.van-dialog__header,
.van-picker__title,
.van-action-sheet__header{
  color:var(--cx-text)!important;
}

.van-cell__label,
.van-field__error-message,
.van-picker-column__item,
.van-tab,
.van-tabbar-item,
.van-sidebar-item{
  color:var(--cx-sub)!important;
}

.van-tab--active,
.van-tabbar-item--active,
.van-sidebar-item--select{
  color:var(--cx-text)!important;
}

.van-hairline--top-bottom::after,
.van-hairline--bottom::after,
.van-hairline--top::after,
.van-cell::after,
.van-dialog__footer,
.van-dialog__cancel,
.van-dialog__confirm{
  border-color:var(--cx-border)!important;
}

/* Overlay / Popup */
.van-overlay{
  background:var(--cx-overlay)!important;
}

.van-popup,
.van-dialog,
.van-action-sheet{
  box-shadow:var(--cx-shadow)!important;
}

/* Toast 不使用纯黑固定色 */
.van-toast{
  background:var(--cx-panel-3)!important;
  color:var(--cx-text)!important;
}

/* Loading */
.van-loading__text{
  color:var(--cx-sub)!important;
}

/* =========================================================
   8. 导航栏 / 顶部 / 底部
   ========================================================= */
header,
.header,
.topbar,
.top-bar,
.navbar,
.nav-bar,
.bottom,
.footer,
.footer-nav,
.bottom-nav{
  border-color:var(--cx-border)!important;
}

.van-tabbar{
  background:var(--cx-bg-2)!important;
}

.van-tabbar-item{
  background:transparent!important;
}

/* =========================================================
   9. 表格 / 列表 / 行情
   ========================================================= */
table,
thead,
tbody,
tr,
th,
td,
.list,
.list-item,
.row,
.table-row{
  border-color:var(--cx-border)!important;
}

th,
.table-head,
.list-head{
  color:var(--cx-sub)!important;
}

td,
.table-cell,
.list-item{
  color:var(--cx-text-2)!important;
}

/* =========================================================
   10. 交易所盘口 / K线外围 / 委托区
   ========================================================= */
.deep-data,
.order-book,
.orderbook,
.trade-panel,
.trade-buy-sell,
.contract-header,
.position,
.position-panel,
.entrust,
.entrust-panel{
  background-color:var(--cx-bg)!important;
  border-color:var(--cx-border)!important;
}

.deep-data .textColor{
  color:var(--cx-text-2)!important;
}

.deep-data .text-grey{
  color:var(--cx-sub)!important;
}

/* 不碰 canvas/svg K线真实颜色 */
canvas{
  color-scheme:auto;
}

/* =========================================================
   11. 首页 / 行情 / 资产 / 登录 二开区域
   ========================================================= */
.market-header,
.notice-row,
.market-search,
.quick-icon,
.cx84-market-tabs,
.cx92-mini-card,
.cx134-social-row,
.cx136-social,
.cx136-next,
.cx105-trade-nav,
.cx108-sheet,
.cx108-option,
.cx113-theme-toggle,
.cx114-theme-toggle,
.cx125-contract-nav,
.cx127-position-tabs{
  border-color:var(--cx-border)!important;
}

.market-search,
.quick-icon,
.cx92-mini-card,
.cx134-social-row,
.cx136-social,
.cx136-next,
.cx108-option,
.cx113-theme-toggle,
.cx114-theme-toggle{
  background-color:var(--cx-panel)!important;
  color:var(--cx-text)!important;
}

/* =========================================================
   12. 空状态 / 骨架 / Badge / Tag
   ========================================================= */
.empty,
.empty-state,
.no-data,
.noTips,
.van-empty__description{
  color:var(--cx-sub)!important;
}

.van-skeleton__row,
.van-skeleton__title{
  background:var(--cx-panel-2)!important;
}

.tag,
.badge:not(.up):not(.down),
.van-tag:not(.van-tag--success):not(.van-tag--danger){
  background:var(--cx-panel-2)!important;
  color:var(--cx-sub)!important;
  border-color:var(--cx-border)!important;
}

/* =========================================================
   13. Checkbox / Radio / Switch
   ========================================================= */
.van-checkbox__icon .van-icon,
.van-radio__icon .van-icon{
  border-color:var(--cx-border)!important;
  background:var(--cx-panel)!important;
}

.van-checkbox__icon--checked .van-icon,
.van-radio__icon--checked .van-icon{
  background:var(--cx-text)!important;
  border-color:var(--cx-text)!important;
  color:var(--cx-bg)!important;
}

.van-switch:not(.van-switch--on){
  background:var(--cx-panel-3)!important;
}

/* =========================================================
   14. Slider / Progress
   ========================================================= */
.vue-slider-rail,
.van-slider{
  background:var(--cx-border)!important;
}

.vue-slider-dot-handle,
.custom-step.active,
.van-slider__button{
  background:var(--cx-text)!important;
  border-color:var(--cx-text)!important;
}

.van-progress{
  background:var(--cx-panel-3)!important;
}

/* =========================================================
   15. 滚动条
   ========================================================= */
*{
  scrollbar-color:var(--cx-scroll) transparent;
}

*::-webkit-scrollbar{
  width:5px;
  height:5px;
}

*::-webkit-scrollbar-track{
  background:transparent;
}

*::-webkit-scrollbar-thumb{
  background:var(--cx-scroll);
  border-radius:8px;
}

/* =========================================================
   16. 图片 / Logo / Banner 不反色
   ========================================================= */
img,
video,
canvas,
svg{
  filter:none;
}

/* =========================================================
   17. 常见 inline 白底/灰底补丁
   只在主题容器内处理明确背景，不动红绿按钮
   ========================================================= */
html.cx-theme-dark [style*="background-color: rgb(255, 255, 255)"],
html[data-theme="dark"] [style*="background-color: rgb(255, 255, 255)"],
html[data-cx-theme="dark"] [style*="background-color: rgb(255, 255, 255)"]{
  background-color:var(--cx-panel)!important;
}

html.cx-theme-dark [style*="background: rgb(255, 255, 255)"],
html[data-theme="dark"] [style*="background: rgb(255, 255, 255)"],
html[data-cx-theme="dark"] [style*="background: rgb(255, 255, 255)"]{
  background:var(--cx-panel)!important;
}

html.cx-theme-dark [style*="background-color: rgb(243, 243, 243)"],
html[data-theme="dark"] [style*="background-color: rgb(243, 243, 243)"],
html[data-cx-theme="dark"] [style*="background-color: rgb(243, 243, 243)"]{
  background-color:var(--cx-bg-2)!important;
}

html.cx-theme-light [style*="background-color: rgb(0, 0, 0)"],
html[data-theme="light"] [style*="background-color: rgb(0, 0, 0)"],
html[data-cx-theme="light"] [style*="background-color: rgb(0, 0, 0)"]{
  background-color:var(--cx-bg)!important;
}

/* =========================================================
   18. Focus / Active 状态
   ========================================================= */
input:focus,
textarea:focus,
select:focus,
.iptbox:focus-within,
.input-box:focus-within{
  border-color:var(--cx-text)!important;
  outline:none!important;
}

a{
  color:inherit;
}

/* =========================================================
   19. 禁止实时行情因主题transition闪动
   ========================================================= */
.deep-data *,
.order-book *,
.orderbook *,
.market-card .price,
.quote-price,
.price-item,
.price-content{
  transition:none!important;
  animation-duration:0s!important;
}

/* 只有静态容器平滑切换主题 */
body,
.appContent,
.mainBackground,
.van-popup,
.van-dialog,
.van-action-sheet,
.van-cell,
.inputBackground,
.tabBackground,
.card,
.panel{
  transition:
    background-color .14s ease,
    color .14s ease,
    border-color .14s ease!important;
}
