/* =========================================================
   CoinASX V107
   只调整：
   - V105 顶部导航更加紧凑、固定
   - 市价/限价委托控件继续缩小
   - 25/50/75/100 百分比跟随主题
   其他布局不动
   ========================================================= */

html{
  --v107-bg:var(--v106-bg,var(--t-bg,var(--cx-bg,#070908)));
  --v107-panel:var(--v106-panel,var(--t-panel,var(--cx-surface,#17191d)));
  --v107-panel2:var(--v106-panel2,var(--t-panel2,var(--cx-surface-2,#202328)));
  --v107-border:var(--v106-border,var(--t-border,var(--cx-border,#2a2e33)));
  --v107-text:var(--v106-text,var(--t-text,var(--cx-text,#f5f6f7)));
  --v107-muted:var(--v106-muted,var(--t-muted,var(--cx-text-3,#8b9199)));
  --v107-accent:var(--v106-green,var(--t-green,var(--cx-green,#9fe51a)));
}

html.cx-theme-light,
html[data-theme="light"]{
  --v107-bg:#f7f8fa;
  --v107-panel:#ffffff;
  --v107-panel2:#eef1f4;
  --v107-border:#dce1e6;
  --v107-text:#12151a;
  --v107-muted:#7f8791;
  --v107-accent:#78c800;
}

html.cx-theme-dark,
html[data-theme="dark"]{
  --v107-bg:#070908;
  --v107-panel:#17191d;
  --v107-panel2:#202328;
  --v107-border:#2a2e33;
  --v107-text:#f5f6f7;
  --v107-muted:#8b9199;
  --v107-accent:#9fe51a;
}

/* ===== 顶部功能导航：更紧凑 + 固定 ===== */
.cx105-trade-nav{
  position:sticky!important;
  top:0!important;
  z-index:60!important;
  height:46px!important;
  min-height:46px!important;
  padding:5px 12px!important;
  gap:4px!important;
  overflow-x:hidden!important;
  background:var(--v107-bg)!important;
  border-bottom:1px solid var(--v107-border)!important;
  backdrop-filter:blur(12px)!important;
  -webkit-backdrop-filter:blur(12px)!important;
}

.cx105-trade-nav-btn{
  flex:1 1 25%!important;
  min-width:0!important;
  height:34px!important;
  padding:0 6px!important;
  border:1px solid transparent!important;
  border-radius:8px!important;
  background:transparent!important;
  color:var(--v107-muted)!important;
  font-size:12px!important;
  line-height:32px!important;
  font-weight:700!important;
  text-align:center!important;
}

.cx105-trade-nav-btn.active{
  background:var(--v107-panel2)!important;
  border-color:var(--v107-border)!important;
  color:var(--v107-text)!important;
}

.cx105-trade-nav-btn.active:after{
  width:14px!important;
  height:2px!important;
  bottom:1px!important;
  background:var(--v107-accent)!important;
}

/* ===== 市价委托 / 限价委托：继续缩小 ===== */
.trade .trade-buy-sell .mt-22.mb-22.inputBackground{
  height:36px!important;
  min-height:36px!important;
  margin-top:8px!important;
  margin-bottom:7px!important;
  border:1px solid var(--v107-border)!important;
  border-radius:8px!important;
  background:var(--v107-panel2)!important;
  box-shadow:none!important;
}

.trade .trade-buy-sell .mt-22.mb-22.inputBackground > .flex{
  height:34px!important;
  min-height:34px!important;
}

.trade .trade-buy-sell .mt-22.mb-22.inputBackground .pl-16{
  padding-left:9px!important;
  font-size:11.5px!important;
  line-height:34px!important;
  color:var(--v107-text)!important;
}

.trade .trade-buy-sell .mt-22.mb-22.inputBackground img{
  w
  max-width:11px!important;
  height:auto!important;
  p
  opacity:.68!important;
}

/* 可能存在的独立委托 tabs */
.trade .order-type-tabs,
.trade .orderTypeTabs,
.trade [class*="order-type-tab"],
.trade [class*="orderTypeTab"]{
  min-height:30px!important;
  padding:2px!important;
  gap:2px!important;
  border:1px solid var(--v107-border)!important;
  border-radius:8px!important;
  background:var(
}

.trade .order-type-tabs button,
.trade .
.trade [class*="order-type-tab"] button,
.trade [class*="orderTypeTab"] button{
  height:25px!important;
  min-height:25px!important;
  padding:0 9px!important;
  border:0!important;
  border-radius:6px!important;
  font-size:11px!important;
  line-height:25px!important;
  color:var(--v107-muted)!i
}

/* ===== 25 / 50 / 75 / 10
.trade .trade-buy-sell .font-24.w-full.flex.justify-between.items-center{
  height:30px!important;
  padding:
  gap:5px!important;
  color:var(--v107-muted)!important;
}

.trade .trade-buy-sell .tab-item{
  display:flex!important;
  align-items:center!important;
  justify-content:center!important;
  height:26px!important;
  min-height:26px!important;
  padding:0 4px!important;
  border:1px solid var(--v107-border)!important;
  border-radius:7px!important;
  background:var(--v107-panel2)!important;
  color:var(--v107-muted)!important;
  font-size:10.5px!important;
  line-height:24px!important;
  font-weight:650!important;
  box-sizing:border-box!important;
  cursor:pointer!important;
  -webkit-tap-highlight-color:transparent!important;
}

/* 如果 Vue 给百分比添加 active/current/selected 状态，则自动高亮 */
.trade .trade-buy-sell .tab-item.active,
.trade .trade-buy-sell .tab-item.current,
.trade .trade-buy-sell .tab-item.selected{
  color:var(--v107-text)!important;
  border-color:color-mix(in srgb,var(--v107-accent) 55%,var(--v107-border))!important;
  background:color-mix(in srgb,var(--v107-accent) 12%,var(--v107-panel2))!important;
}

/* 主题切换时不闪 */
.cx105-trade-nav,
.cx105-trade-nav-btn,
.trade .trade-buy-sell .mt-22.mb-22.inputBackground,
.trade .trade-buy-sell .tab-item{
  transition:
    background-color .14s ease,
    color .14s ease,
    border-color .14s ease!important;
}

/* ===== 超小屏仍保持四个按钮一行 ===== */
@media(max-width:360px){
  .cx105-trade-nav{
    padding-left:8px!important;
    padding-right:8px!important;
    gap:3px!important;
  }

  .cx105-trade-nav-btn{
    font-size:11px!important;
    padding:0 3px!important;
  }

  .trade .trade-buy-sell .tab-item{
    font-size:10px!important;
    padding:0 2px!important;
  }
}