/* =========================================================
   CoinASX V168 - Gate-like User Center
   只作用于 .userCenter
   ========================================================= */

:root{
  --uc168-bg:#000;
  --uc168-surface:#121417;
  --uc168-surface2:#1b1e23;
  --uc168-border:#24282e;
  --uc168-text:#fff;
  --uc168-sub:#8d949e;
  --uc168-blue:#1769f6;
  --uc168-green:#18c98f;
  --uc168-red:#f04f65;
  --uc168-gold:#d6b75f;
}

html.cx-theme-light,
html[data-theme="light"],
html[data-cx-theme="light"]{
  --uc168-bg:#fff;
  --uc168-surface:#f4f6f8;
  --uc168-surface2:#eceff3;
  --uc168-border:#e2e6eb;
  --uc168-text:#111317;
  --uc168-sub:#727a84;
  --uc168-blue:#1769f6;
  --uc168-green:#0fa875;
  --uc168-red:#df4358;
  --uc168-gold:#9c7a20;
}

.userCenter.appContent{
  background:var(--uc168-bg)!important;
  color:var(--uc168-text)!important;
  padding-bottom:max(110px,calc(88px + env(safe-area-inset-bottom) + 22px))!important;
}

/* 顶栏 */
.userCenter #assetsHead .van-nav-bar{
  background:var(--uc168-bg)!important;
  border:0!important;
}
.userCenter #assetsHead .van-nav-bar__content{
  min-height:56px!important;
  padding:0 14px!important;
}
.userCenter #assetsHead .van-icon{
  color:var(--uc168-text)!important;
}

/* 用户资料区 */
.userCenter .userInfo{
  margin:8px 16px 18px!important;
  padding:12px 0!important;
  min-height:76px!important;

  display:flex!important;
  align-items:center!important;
  gap:14px!important;

  border:0!important;
  border-radius:0!important;
  background:transparent!important;
  box-shadow:none!important;
}

.userCenter .userInfo>.imgBox{
  width:58px!important;
  height:58px!important;
  min-width:58px!important;
  border-radius:50%!important;
  overflow:hidden!important;
  border:1px solid var(--uc168-border)!important;
  background:var(--uc168-surface)!important;
}
.userCenter .userInfo>.imgBox img{
  width:100%!important;
  height:100%!important;
  object-fit:cover!important;
}

.userCenter .userInfo .info{
  flex:1!important;
  min-width:0!important;
}
.userCenter .userInfo .info p{
  margin:0!important;
  color:var(--uc168-text)!important;
  font-size:18px!important;
  line-height:24px!important;
  font-weight:800!important;
  white-space:nowrap!important;
  overflow:hidden!important;
  text-overflow:ellipsis!important;
}
.userCenter .userInfo .info span{
  display:block!important;
  margin-top:5px!important;
  color:var(--uc168-sub)!important;
  font-size:12px!important;
  line-height:16px!important;
}

/* 认证/VIP辅助 */
.userCenter .cx168-user-tags{
  display:flex!important;
  align-items:center!important;
  gap:6px!important;
  margin-top:7px!important;
}
.userCenter .cx168-tag{
  display:inline-flex!important;
  align-items:center!important;
  min-height:20px!important;
  padding:0 7px!important;
  border-radius:4px!important;
  font-size:10px!important;
  line-height:16px!important;
  font-weight:750!important;
}
.userCenter .cx168-tag.ok{
  color:var(--uc168-green)!important;
  background:rgba(24,201,143,.12)!important;
}
.userCenter .cx168-tag.vip{
  color:var(--uc168-text)!important;
  background:var(--uc168-surface2)!important;
  border:1px solid var(--uc168-border)!important;
}

/* VIP横向滚动卡 */
.userCenter .cx168-vip-strip{
  display:flex!important;
  gap:10px!important;
  overflow-x:auto!important;
  padding:0 16px 4px!important;
  margin-bottom:22px!important;
  scrollbar-width:none!important;
  -webkit-overflow-scrolling:touch!important;
}
.userCenter .cx168-vip-strip::-webkit-scrollbar{display:none!important}

.userCenter .cx168-vip-card{
  flex:0 0 70%!important;
  min-width:250px!important;
  max-width:360px!important;
  height:96px!important;
  padding:16px!important;
  border-radius:14px!important;
  border:1px solid var(--uc168-border)!important;
  background:
    linear-gradient(135deg,rgba(255,255,255,.02),rgba(255,255,255,0)),
    var(--uc168-surface)!important;
  position:relative!important;
  overflow:hidden!important;
}
.userCenter .cx168-vip-card:after{
  content:"";
  position:absolute!important;
  right:-22px!important;
  bottom:-28px!important;
  width:105px!important;
  height:72px!important;
  border-radius:18px!important;
  transform:rotate(-10deg)!important;
  background:linear-gradient(135deg,#e3bd6d,#b98932)!important;
  opacity:.95!important;
}
.userCenter .cx168-vip-card.second:after{
  background:linear-gradient(135deg,#2f7cf6,#18c98f)!important;
}
.userCenter .cx168-vip-title{
  position:relative!important;
  z-index:2!important;
  color:var(--uc168-text)!important;
  font-size:16px!important;
  line-height:22px!important;
  font-weight:800!important;
}
.userCenter .cx168-vip-sub{
  position:relative!important;
  z-index:2!important;
  margin-top:8px!important;
  color:var(--uc168-gold)!important;
  font-size:12px!important;
  line-height:18px!important;
}

/* 内容区 */
.userCenter .content{
  padding:0 16px!important;
  background:transparent!important;
}

/* 分组 */
.userCenter .content .listBox{
  margin:0 0 24px!important;
  padding:0!important;
  border:0!important;
  background:transparent!important;
  box-shadow:none!important;
}
.userCenter .content .list-title{
  margin:0 0 14px!important;
  padding:0!important;
  background:transparent!important;
  color:var(--uc168-text)!important;
  font-size:17px!important;
  line-height:22px!important;
  font-weight:800!important;
}

/* 4列功能网格 */
.userCenter .content .list-cont{
  margin:0!important;
  padding:0!important;
  display:grid!important;
  grid-template-columns:repeat(4,minmax(0,1fr))!important;
  column-gap:8px!important;
  row-gap:22px!important;
  list-style:none!important;

  border:0!important;
  border-radius:0!important;
  background:transparent!important;
  overflow:visible!important;
}

.userCenter .content .list-cont>li{
  min-width:0!important;
  min-height:74px!important;
  padding:0!important;
  margin:0!important;

  display:flex!important;
  flex-direction:column!important;
  align-items:center!important;
  justify-content:flex-start!important;
  gap:7px!important;

  border:0!important;
  background:transparent!important;
  color:var(--uc168-text)!important;

  cursor:pointer!important;
  -webkit-tap-highlight-color:transparent!important;
  transition:transform .12s ease,opacity .12s ease!important;
}
.userCenter .content .list-cont>li:active{
  transform:scale(.94)!important;
  opacity:.72!important;
}

/* 原left容器改成纵向 */
.userCenter .content .list-cont>li>.left{
  width:100%!important;
  min-width:0!important;
  display:flex!important;
  flex-direction:column!important;
  align-items:center!important;
  gap:7px!important;
}

/* 图标去卡片，只保留企业级白线图标 */
.userCenter .content .list-cont>li>.left>.imgBox{
  width:34px!important;
  height:34px!important;
  min-width:34px!important;

  display:flex!important;
  align-items:center!important;
  justify-content:center!important;

  border:0!important;
  border-radius:0!important;
  background:transparent!important;
  box-shadow:none!important;
  overflow:visible!important;
}
.userCenter .content .list-cont>li>.left>.imgBox img{
  width:28px!important;
  height:28px!important;
  max-width:28px!important;
  max-height:28px!important;
  object-fit:contain!important;
  opacity:.96!important;
  filter:none!important;
}

/* 功能名称 */
.userCenter .content .list-cont>li>.left>span{
  width:100%!important;
  min-height:18px!important;
  color:var(--uc168-text)!important;
  font-size:11.5px!important;
  line-height:16px!important;
  font-weight:520!important;
  text-align:center!important;
  white-space:normal!important;
  overflow:visible!important;
  text-overflow:clip!important;
}

/* 右侧状态/箭头移到标签下面 */
.userCenter .content .list-cont>li>.right{
  position:absolute!important;
  top:30px!important;
  right:calc(50% - 28px)!important;
  display:flex!important;
  align-items:center!important;
  gap:3px!important;
  color:var(--uc168-sub)!important;
}
.userCenter .content .list-cont>li>.right>img{
  display:none!important;
}
.userCenter .content .list-cont>li>.right .red{
  min-height:16px!important;
  padding:0 4px!important;
  border-radius:3px!important;
  font-size:8px!important;
  line-height:14px!important;
  color:var(--uc168-red)!important;
  background:rgba(240,79,101,.12)!important;
}

/* 退出单独变成全宽按钮 */
.userCenter li[data-uc168-type="logout"]{
  grid-column:1 / -1!important;
  min-height:44px!important;
  flex-direction:row!important;
  justify-content:center!important;
  border:1px solid rgba(240,79,101,.24)!important;
  border-radius:10px!important;
  background:rgba(240,79,101,.06)!important;
}
.userCenter li[data-uc168-type="logout"]>.left{
  width:auto!important;
  flex-direction:row!important;
}
.userCenter li[data-uc168-type="logout"]>.left>.imgBox{
  width:22px!important;
  height:22px!important;
  min-width:22px!important;
}
.userCenter li[data-uc168-type="logout"]>.left>.imgBox img{
  width:18px!important;
  height:18px!important;
}
.userCenter li[data-uc168-type="logout"]>.left>span{
  width:auto!important;
  color:var(--uc168-red)!important;
  font-weight:750!important;
}
.userCenter li[data-uc168-type="logout"]>.right{
  display:none!important;
}

/* 关于区域 */
.userCenter .cx168-about-row{
  margin:8px 0 0!important;
  min-height:54px!important;
  padding:0 4px!important;

  display:flex!important;
  align-items:center!important;
  justify-content:space-between!important;

  border-top:1px solid var(--uc168-border)!important;
  color:var(--uc168-text)!important;
}
.userCenter .cx168-about-left{
  display:flex!important;
  align-items:center!important;
  gap:9px!important;
  font-size:16px!important;
  font-weight:650!important;
}
.userCenter .cx168-about-icon{
  width:20px!important;
  height:20px!important;
  border:1px solid var(--uc168-text)!important;
  border-radius:50%!important;
  display:flex!important;
  align-items:center!important;
  justify-content:center!important;
  font-size:12px!important;
  font-weight:800!important;
}
.userCenter .cx168-about-version{
  color:var(--uc168-sub)!important;
  font-size:12px!important;
}

/* 移除V167安全提示 */
.userCenter .cx167-security-note{
  display:none!important;
}

/* 小屏 */
@media(max-width:390px){
  .userCenter .content{
    padding-left:12px!important;
    padding-right:12px!important;
  }
  .userCenter .cx168-vip-strip{
    padding-left:12px!important;
    padding-right:12px!important;
  }
  .userCenter .userInfo{
    margin-left:12px!important;
    margin-right:12px!important;
  }
  .userCenter .content .list-cont{
    column-gap:4px!important;
    row-gap:19px!important;
  }
  .userCenter .content .list-cont>li>.left>.imgBox{
    width:31px!important;
    height:31px!important;
    min-width:31px!important;
  }
  .userCenter .content .list-cont>li>.left>.imgBox img{
    width:25px!important;
    height:25px!important;
    max-width:25px!important;
    max-height:25px!important;
  }
  .userCenter .content .list-cont>li>.left>span{
    font-size:10.8px!important;
  }
}

/* V169：分组标题只保留文字 */
.userCenter .content .listBox{
    background:transparent!important;
    border:0!important;
    border-radius:0!important;
    box-shadow:none!important;
    outline:none!important;
    padding:0!important;
}

.userCenter .content .list-title{
    display:block!important;
    width:auto!important;
    height:auto!important;
    margin:26px 0 18px!important;
    padding:0!important;
    background:transparent!important;
    border:0!important;
    border-radius:0!important;
    box-shadow:none!important;
    color:var(--uc168-text)!important;
    font-size:17px!important;
    font-weight:800!important;
    line-height:24px!important;
}

/* COINASX-UC-V169-START */

/*
 * 用户中心分组标题优化
 * 常用功能 / 账户与安全 / 通用设置 / 更多
 * 目标：
 * 1. 清除外部长条卡片
 * 2. 清除背景、边框、阴影
 * 3. 只保留标题文字
 * 4. 不修改原 Vue / JS / 点击事件
 */

/* ---------- 分组外层透明化 ---------- */

.userCenter .content .listBox,
.user-center .content .listBox,
.userCenter .list-box,
.user-center .list-box {
    background: transparent !important;
    background-image: none !important;

    border: 0 !important;
    outline: 0 !important;

    border-radius: 0 !important;
    box-shadow: none !important;

    padding-left: 0 !important;
    padding-right: 0 !important;
}

/* ---------- 标题纯文字 ---------- */

.userCenter .content .list-title,
.user-center .content .list-title,
.userCenter .list-title,
.user-center .list-title,
.userCenter .section-title,
.user-center .section-title {
    display: flex !important;
    align-items: center !important;

    width: auto !important;
    min-height: 24px !important;
    height: auto !important;

    margin: 28px 0 16px !important;
    padding: 0 !important;

    background: transparent !important;
    background-image: none !important;

    border: 0 !important;
    outline: 0 !important;
    border-radius: 0 !important;
    box-shadow: none !important;

    color: var(--uc168-text, #ffffff) !important;

    font-size: 17px !important;
    font-weight: 700 !important;
    line-height: 24px !important;
    letter-spacing: 0 !important;
}

/* ---------- 去掉标题区域伪元素卡片 ---------- */

.userCenter .list-title::before,
.userCenter .list-title::after,
.user-center .list-title::before,
.user-center .list-title::after,
.userCenter .section-title::before,
.userCenter .section-title::after {
    background: transparent !important;
    border: 0 !important;
    box-shadow: none !important;
}

/* ---------- 深色主题 ---------- */

html.dark .userCenter .list-title,
html.dark .user-center .list-title,
[data-theme="dark"] .userCenter .list-title,
[data-theme="dark"] .user-center .list-title {
    color: #f5f7fa !important;
}

/* ---------- 浅色主题 ---------- */

html.light .userCenter .list-title,
html.light .user-center .list-title,
[data-theme="light"] .userCenter .list-title,
[data-theme="light"] .user-center .list-title {
    color: #111318 !important;
}

/* ---------- 手机端 ---------- */

@media (max-width: 768px) {
    .userCenter .content .list-title,
    .user-center .content .list-title,
    .userCenter .list-title,
    .user-center .list-title,
    .userCenter .section-title,
    .user-center .section-title {
        margin-top: 24px !important;
        margin-bottom: 14px !important;

        font-size: 16px !important;
        line-height: 22px !important;
    }
}

/* ---------- 超小屏幕 ---------- */

@media (max-width: 375px) {
    .userCenter .content .list-title,
    .user-center .content .list-title,
    .userCenter .list-title,
    .user-center .list-title {
        font-size: 15px !important;
        margin-top: 21px !important;
        margin-bottom: 12px !important;
    }
}

/* COINASX-UC-V169-END */
