/* ===== 云掌柜：官方 SVG 图标系统 ===== */
.ui-icon{
  width:22px;
  height:22px;
  display:inline-block;
  vertical-align:middle;
  flex:0 0 auto;
  color:#69bfff;
  fill:none;
}

.ui-icon--sm{width:18px;height:18px}
.ui-icon--md{width:22px;height:22px}
.ui-icon--lg{width:26px;height:26px}

.icon-box{
  width:56px;
  height:56px;
  border:1px solid rgba(78,166,255,.42);
  border-radius:16px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  flex:0 0 auto;
  color:#69bfff;
  background:linear-gradient(180deg,rgba(23,69,112,.48),rgba(13,46,80,.48));
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.05),
    0 0 0 1px rgba(0,0,0,.03);
}

.icon-box .ui-icon{
  width:25px;
  height:25px;
  color:inherit;
}

.icon-box--sm{
  width:36px;
  height:36px;
  border-radius:11px;
}
.icon-box--sm .ui-icon{
  width:18px;
  height:18px;
}

.icon-box--metric{
  width:56px;
  height:56px;
  border-radius:15px;
}

.icon-link{
  display:inline-flex;
  align-items:center;
  gap:7px;
}
.icon-link .ui-icon{
  width:17px;
  height:17px;
  transition:transform .18s ease;
}
.icon-link:hover .ui-icon{
  transform:translateX(3px);
}

/* 让旧的单字符图标不再参与显示。
   仅在你已把对应 HTML 换成 SVG 后启用这些类名。 */
.svg-icon-ready .legacy-symbol,
.svg-icon-ready .emoji-icon,
.svg-icon-ready .text-icon{
  display:none !important;
}


/* ===== 云掌柜首页 SVG 图标适配 20260911 ===== */
.trust-item .ico,
.feature-icon,
.issue-icon,
.support-icon{
  display:inline-flex;
  align-items:center;
  justify-content:center;
}

.trust-item .ico .ui-icon{
  width:18px;
  height:18px;
}

.feature-icon .ui-icon,
.issue-icon .ui-icon,
.support-icon .ui-icon{
  width:24px;
  height:24px;
}

.menu-btn .ui-icon{
  width:22px;
  height:22px;
  pointer-events:none;
}

.btn .ui-icon,
.platform-learn .ui-icon,
.issue-card strong .ui-icon{
  margin-left:5px;
}

/* about.html 奖励模式 SVG */
.rate-badge{
  display:flex;
  align-items:center;
  justify-content:center;
}

.rate-badge .ui-icon{
  width:25px;
  height:25px;
}


/* ===== tutorial.html SVG 图标 20260911 ===== */

.acc-head .acc-icon{
  width:24px;
  height:24px;
  display:inline-grid;
  place-items:center;
  flex:0 0 auto;
  margin-left:16px;
  color:#69bfff;
}

.acc-head .acc-icon .ui-icon{
  width:18px;
  height:18px;
  grid-area:1 / 1;
}

.acc-head .acc-icon-minus{
  display:none;
}

.acc-item.open > .acc-head .acc-icon-plus{
  display:none;
}

.acc-item.open > .acc-head .acc-icon-minus{
  display:block;
}

.support-icon{
  display:flex;
  align-items:center;
  justify-content:center;
}

.support-icon .ui-icon{
  width:25px;
  height:25px;
}

.menu-btn{
  align-items:center;
  justify-content:center;
}

.menu-btn .ui-icon{
  width:22px;
  height:22px;
}

.btn.icon-link{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:7px;
}

.btn.icon-link .ui-icon{
  width:17px;
  height:17px;
}


/* ===== app.js 共用 SVG 图标 20260911 ===== */

.external-modal-x{
  display:flex;
  align-items:center;
  justify-content:center;
}

.external-modal-x .ui-icon{
  width:20px;
  height:20px;
}

.external-modal-icon{
  display:flex;
  align-items:center;
  justify-content:center;
}

.external-modal-icon .ui-icon{
  width:28px;
  height:28px;
}

.svg-action-btn{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:7px;
}

.svg-action-btn .ui-icon{
  width:17px;
  height:17px;
}

.copy-success-icon{
  width:16px;
  height:16px;
  margin-left:5px;
  vertical-align:-3px;
}


/* ===== 全站 SVG 最终统一 20260911 ===== */

.svg-arrow-right,
.svg-arrow-left{
  width:16px;
  height:16px;
  vertical-align:-3px;
  flex:0 0 auto;
}

.svg-arrow-right{
  margin-left:6px;
}

.svg-arrow-left{
  margin-right:6px;
}

.menu-btn{
  align-items:center;
  justify-content:center;
}

.menu-btn .ui-icon{
  width:22px;
  height:22px;
}

.check{
  display:inline-flex;
  align-items:center;
  justify-content:center;
}

.check .ui-icon{
  width:17px;
  height:17px;
}

.point-icon,
.feature-icon,
.about-float-icon{
  display:flex;
  align-items:center;
  justify-content:center;
}

.point-icon .ui-icon{
  width:17px;
  height:17px;
}

.feature-icon .ui-icon{
  width:24px;
  height:24px;
}

.about-float-icon .ui-icon{
  width:26px;
  height:26px;
}

.contact-action .svg-arrow-right,
.channel-back .svg-arrow-right,
.platform-link-card .svg-arrow-right{
  transition:transform .18s ease;
}

.contact-action:hover .svg-arrow-right,
.channel-back:hover .svg-arrow-right,
.platform-link-card:hover .svg-arrow-right{
  transform:translateX(3px);
}

/* ===== 云掌柜 Header 最终统一 20260911 ===== */

/* 电脑端：只显示完整导航，不显示汉堡菜单 */
.menu-btn{
  display:none;
  align-items:center;
  justify-content:center;
}

/* SVG 菜单图标尺寸 */
.menu-btn .ui-icon{
  width:22px;
  height:22px;
}

/* Header 高度统一 */
.nav{
  height:76px;
  display:flex;
  align-items:center;
}

/* Logo 统一 */
.brand{
  flex:0 0 auto;
}

.brand img{
  width:34px;
  height:auto;
}

/* 导航文字保持垂直居中 */
.nav-links{
  align-items:center;
}

/* 联系我们按钮统一 */
.nav-actions{
  display:flex;
  align-items:center;
  gap:10px;
}

.nav-actions > .btn{
  min-height:44px;
  padding:0 20px;
}

/* 平板 / 手机才显示菜单 */
@media(max-width:980px){
  .menu-btn{
    display:flex;
  }

  .nav-actions > .btn{
    display:none;
  }
}

/* 手机 Header */
@media(max-width:640px){
  .nav{
    height:68px;
  }

  .brand img{
    width:31px;
  }

  .menu-btn{
    width:44px;
    height:44px;
  }
}
