@charset "utf-8";
/* VISSONIC Ask visual skin
   Only CSS. No HTML/JS/UEditor/function code changed.
   Scope: existing Ask template class names only. */

:root{
  --vis-green:#338C56;
  --vis-green-dark:#277346;
  --vis-green-soft:#EAF5EF;
  --vis-bg:#F5F5F7;
  --vis-card:#FFFFFF;
  --vis-text:#202124;
  --vis-muted:#6B7280;
  --vis-light:#9CA3AF;
  --vis-line:#E5E7EB;
  --vis-red:#E74C3C;
  --vis-orange:#F59E0B;
  --vis-blue:#2563EB;
  --vis-radius:14px;
  --vis-radius-sm:8px;
  --vis-shadow:0 10px 30px rgba(15,23,42,.07);
  --vis-shadow-sm:0 4px 14px rgba(15,23,42,.055);
}

html{background:var(--vis-bg);}
body.askpn,body{
  background:var(--vis-bg)!important;
  color:var(--vis-text);
  font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,"Helvetica Neue",Arial,"Noto Sans",sans-serif;
  font-size:14px;
  line-height:1.65;
}
a{color:var(--vis-green);transition:color .2s ease,background .2s ease,border .2s ease,box-shadow .2s ease,transform .2s ease;}
a:hover{color:var(--vis-green-dark);text-decoration:none;}
img{max-width:100%;}

/* Layout */
.mian-body.container{
  width:1140px!important;
  max-width:calc(100% - 32px)!important;
  margin:0 auto!important;
  padding:26px 0 70px!important;
  display:flex;
  align-items:flex-start;
  gap:24px;
  float:none!important;
  clear:both;
}
.aside-left.col-md-9{
  float:none!important;
  flex:1 1 auto;
  width:auto!important;
  max-width:calc(100% - 324px);
  padding:0!important;
}
.aside-right.col-md-3{
  float:none!important;
  flex:0 0 300px;
  width:300px!important;
  padding:0!important;
}
.main_box,.main_box_a{width:100%;}

/* Search + category navigation */
.sbox{
  background:var(--vis-card);
  border:1px solid rgba(229,231,235,.9);
  border-radius:var(--vis-radius);
  box-shadow:var(--vis-shadow-sm);
  padding:18px 20px;
  margin-bottom:18px;
}
.search{float:none!important;width:100%;max-width:420px;margin:0 18px 12px 0;display:inline-block;vertical-align:middle;position:relative;}
.search form{position:relative;margin:0;}
.searchinput{
  width:100%!important;height:44px!important;line-height:44px!important;
  border:1px solid var(--vis-line)!important;border-radius:999px!important;
  background:#F9FAFB!important;color:var(--vis-text)!important;
  padding:0 52px 0 18px!important;box-shadow:none!important;outline:none!important;
}
.searchinput:focus{border-color:var(--vis-green)!important;background:#fff!important;box-shadow:0 0 0 4px rgba(51,140,86,.11)!important;}
.search-icon{
  position:absolute!important;right:5px!important;top:5px!important;width:34px!important;height:34px!important;
  border-radius:50%;background:var(--vis-green)!important;cursor:pointer;display:block;
}
.search-icon:before{content:"";position:absolute;left:10px;top:9px;width:11px;height:11px;border:2px solid #fff;border-radius:50%;}
.search-icon:after{content:"";position:absolute;left:22px;top:22px;width:8px;height:2px;background:#fff;transform:rotate(45deg);border-radius:2px;}
.search-result,.hot-list{border-radius:10px!important;box-shadow:var(--vis-shadow)!important;border:1px solid var(--vis-line)!important;overflow:hidden;}
.navlist.navbar-nav{float:none!important;display:flex!important;align-items:center;flex-wrap:wrap;gap:8px;margin:0!important;padding:0!important;}
.navlist>li{float:none!important;margin:0!important;position:relative;}
.navlist>li>a.link{
  display:inline-flex!important;align-items:center;min-height:36px;padding:7px 14px!important;
  border-radius:999px;color:#374151!important;background:#F9FAFB;border:1px solid transparent;font-size:14px;
}
.navlist>li>a.link:hover,.navlist>li>a.link.active{color:#fff!important;background:var(--vis-green)!important;border-color:var(--vis-green)!important;}
.navlist .dropdown-menu{border:0!important;border-radius:12px!important;box-shadow:var(--vis-shadow)!important;padding:8px!important;margin-top:8px!important;}
.navlist .dropdown-menu a{display:block;padding:8px 12px!important;border-radius:8px;color:#374151!important;white-space:nowrap;}
.navlist .dropdown-menu a:hover{background:var(--vis-green-soft)!important;color:var(--vis-green-dark)!important;}
.blank10{height:0!important;overflow:hidden;}

/* Index filters */
.article-nav{
  background:var(--vis-card);border:1px solid rgba(229,231,235,.9);border-radius:var(--vis-radius);
  box-shadow:var(--vis-shadow-sm);padding:14px 16px;margin-bottom:18px;
  display:flex;align-items:center;gap:10px;flex-wrap:wrap;
}
.article-nav span,.article-nav button{
  border:1px solid var(--vis-line)!important;background:#fff!important;color:#374151!important;
  border-radius:999px!important;padding:7px 16px!important;line-height:1.4!important;font-size:14px!important;
  cursor:pointer;box-shadow:none!important;min-height:36px;
}
.article-nav span:hover,.article-nav button:hover{border-color:var(--vis-green)!important;color:var(--vis-green)!important;background:var(--vis-green-soft)!important;}
.article-nav span.act{background:var(--vis-green)!important;border-color:var(--vis-green)!important;color:#fff!important;}

/* Question list */
.article-list{background:var(--vis-card);border-radius:var(--vis-radius);box-shadow:var(--vis-shadow);border:1px solid rgba(229,231,235,.9);overflow:hidden;}
.article-ul{list-style:none;margin:0!important;padding:0!important;}
.article-list-item{
  list-style:none!important;display:flex;gap:14px;padding:20px 22px!important;margin:0!important;
  border-bottom:1px solid #EEF0F3;transition:background .18s ease,transform .18s ease;
}
.article-list-item:last-child{border-bottom:0;}
.article-list-item:hover{background:#FBFDFC;}
.list-avter{flex:0 0 46px;width:46px;height:46px;position:relative;text-align:center;color:inherit;}
.list-avter img{width:46px!important;height:46px!important;border-radius:50%!important;object-fit:cover;box-shadow:0 0 0 3px #fff,0 3px 10px rgba(15,23,42,.15);}
.list-avter .svip{position:absolute;right:-2px;bottom:-2px;}
.list-avter .p{width:46px;height:46px;border-radius:50%;display:flex;align-items:center;justify-content:center;background:#FFF1F2;border:1px solid #FFE4E6;}
.list-avter .p.g{background:#F3F4F6;border-color:#E5E7EB;}
.list-avter .rmbb{font-size:12px;color:var(--vis-red);margin-top:3px;font-weight:600;}
.article-list-item>div:last-child{flex:1;min-width:0;}
.went-head{display:flex;align-items:center;gap:8px;margin-bottom:9px;color:var(--vis-text)!important;font-size:16px;font-weight:650;line-height:1.45;}
.went-head:hover{color:var(--vis-green)!important;}
.went-head-text{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;display:block;}
.jxuan{display:inline-flex;align-items:center;gap:4px;background:#FFF7ED;color:#C2410C;border:1px solid #FED7AA;border-radius:999px;padding:2px 8px;font-size:12px;font-weight:600;flex:0 0 auto;}
.tx-list{display:flex;align-items:center;gap:5px;color:var(--vis-muted);font-size:13px;min-width:0;}
.tx-list img{width:24px!important;height:24px!important;border-radius:50%;object-fit:cover;margin-right:-7px;border:2px solid #fff;}
.list-text{color:var(--vis-muted);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
.list-text a{color:var(--vis-green);}
.more-info{color:var(--vis-light);white-space:nowrap;font-size:13px;}
.no_data{padding:58px 20px!important;text-align:center;color:var(--vis-light);font-size:15px;}

/* Sidebar hot posts */
.hot-users{background:var(--vis-card);border-radius:var(--vis-radius);box-shadow:var(--vis-shadow);border:1px solid rgba(229,231,235,.9);padding:18px;margin-bottom:18px;}
.block-head{font-size:16px!important;font-weight:700!important;color:var(--vis-text)!important;margin:0 0 14px!important;padding:0 0 12px!important;border-bottom:1px solid var(--vis-line);display:flex;align-items:center;justify-content:space-between;}
.hot-sw{font-size:13px;font-weight:400;display:flex;align-items:center;gap:8px;}
.hot-sw .listType{color:var(--vis-muted);cursor:pointer;margin:0!important;}
.hot-sw .listType.act,.hot-sw .listType:hover{color:var(--vis-green);font-weight:700;}
.hot-users ul{list-style:none;margin:0!important;padding:0!important;}
.hot-users ul>a{display:block;color:inherit;}
.hot-users li{list-style:none;display:flex;align-items:flex-start;gap:11px;padding:11px 0!important;border-bottom:1px solid #F1F3F5;}
.hot-users ul>a:last-child li{border-bottom:0;}
.hot-user-avter{width:24px!important;height:24px!important;border-radius:7px;background:#F3F4F6;color:var(--vis-muted);display:flex;align-items:center;justify-content:center;font-size:12px;font-weight:700;flex:0 0 24px;}
.hot-users ul>a:nth-child(1) .hot-user-avter,.hot-users ul>a:nth-child(2) .hot-user-avter,.hot-users ul>a:nth-child(3) .hot-user-avter{background:var(--vis-green);color:#fff;}
.hot-user-info{flex:1;min-width:0;}
.hot-nice{font-size:13px;line-height:1.45;color:#374151;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;}
.hot-users a:hover .hot-nice{color:var(--vis-green);}

/* Detail page */
.wenda,.wenti-huifu{background:var(--vis-card);border:1px solid rgba(229,231,235,.9);border-radius:var(--vis-radius);box-shadow:var(--vis-shadow);margin-bottom:18px;overflow:hidden;}
.wenda{padding:24px 26px;}
.wt-head{font-size:22px!important;line-height:1.45!important;margin:0 0 16px!important;font-weight:750!important;color:var(--vis-text)!important;padding-left:18px;position:relative;}
.wt-head:before{content:"";position:absolute;left:0;top:.55em;width:9px;height:9px;border-radius:50%;background:var(--vis-orange);}
.wt-head.solved:before{background:var(--vis-green);}
.wt-desc{font-size:15px;color:#374151;line-height:1.85;padding:0 0 16px;margin-bottom:14px;border-bottom:1px solid var(--vis-line);word-break:break-word;}
.wt-desc p{margin-bottom:10px;}
.wt-bucong,.wt-opt{color:var(--vis-muted);font-size:13px;}
.wt-opt a,.set_recom,.secend-huifu-btn{color:var(--vis-green)!important;}
.wt-opt a:hover,.secend-huifu-btn:hover{text-decoration:underline;}
.huifu-head{padding:16px 22px!important;background:#FBFDFC;border-bottom:1px solid var(--vis-line);display:flex;align-items:center;justify-content:space-between;}
.huifu-head strong{font-size:16px;color:var(--vis-text);}
.huifu-head a{font-size:13px;color:var(--vis-green)!important;}
.huifu-list{list-style:none;margin:0!important;padding:0!important;}
.huifu-li{list-style:none!important;padding:22px!important;border-bottom:1px solid #EEF0F3;}
.huifu-li:last-child{border-bottom:0;}
.huifu-user{display:flex;align-items:center;gap:10px;margin-bottom:12px;}
.huifu-user img{width:40px!important;height:40px!important;border-radius:50%!important;object-fit:cover;box-shadow:0 0 0 3px #fff,0 3px 10px rgba(15,23,42,.13);}
.user-nice .nice{font-weight:650;color:var(--vis-text);font-size:14px;margin:0!important;}
.user-nice .jianjie{font-size:12px;color:var(--vis-light);margin:0!important;}
.dianzan-bnt{min-width:58px;height:34px;border:1px solid var(--vis-line);border-radius:999px;background:#fff;color:var(--vis-muted);display:flex;align-items:center;justify-content:center;gap:4px;cursor:pointer;transition:all .2s ease;}
.dianzan-bnt:hover{border-color:var(--vis-green);background:var(--vis-green-soft);color:var(--vis-green);transform:translateY(-1px);}
.weiguan-people{font-size:12px;color:var(--vis-light);padding-left:50px;margin:-4px 0 12px;}
.huifu-text-box{padding-left:50px;}
.huifu-content{font-size:15px;color:#374151;line-height:1.85;word-break:break-word;}
.huifu-content img,.resetEditer img{max-width:100%;height:auto;border-radius:8px;}
.huifu-time{margin-top:12px;color:var(--vis-light);font-size:13px;display:flex;align-items:center;flex-wrap:wrap;gap:8px;}
.huifu-time .a,.huifu-time a{color:var(--vis-green)!important;}

/* Comment list only, not editor internals */
.secend-huifu{margin-top:14px;background:#F9FAFB;border:1px solid #EEF0F3;border-radius:12px;padding:12px 14px;}
.secend-ul{list-style:none;margin:0!important;padding:0!important;}
.secend-li{list-style:none!important;padding:12px 0!important;border-bottom:1px solid #EEF0F3;}
.secend-li:last-child{border-bottom:0;}
.head-secend{display:flex;align-items:center;gap:8px;color:var(--vis-muted);font-size:13px;}
.head-secend img{width:28px!important;height:28px!important;border-radius:50%!important;object-fit:cover;}
.secend-huifu-text{font-size:13px;color:#4B5563;line-height:1.7;margin:7px 0 0 36px;}
/* intentionally do not style .huifu-area textarea / UEditor generated .edui-* */

/* Ask / edit form pages */
.tiwen_box{background:var(--vis-card);border:1px solid rgba(229,231,235,.9);border-radius:var(--vis-radius);box-shadow:var(--vis-shadow);padding:28px!important;margin:0 auto 24px!important;max-width:920px;}
.tiwen_box.ai_huida{max-width:none;border-radius:0;box-shadow:none;border:0;padding:18px!important;}
.tt-img{text-align:center;margin:0 0 22px!important;}
.tt-img img{max-height:96px;object-fit:contain;}
.tiwen_main{margin:0!important;}
.ti{margin:18px 0 9px!important;color:var(--vis-text)!important;}
.ti big{font-size:15px;font-weight:700;}
.ts{color:#374151;}
.tit_input{height:44px;line-height:44px;border:1px solid var(--vis-line)!important;border-radius:10px!important;background:#F9FAFB!important;padding:0 13px!important;outline:none!important;transition:all .2s ease;width:100%;}
textarea.tit_input{line-height:1.6!important;padding:10px 13px!important;}
.tit_input:focus{border-color:var(--vis-green)!important;background:#fff!important;box-shadow:0 0 0 4px rgba(51,140,86,.10)!important;}
.twnav{display:flex;align-items:center;flex-wrap:wrap;gap:8px;}
.twnav a,.twnav span,.twnav label{border-radius:999px;}
.width100.et.da{display:flex;align-items:center;justify-content:space-between;margin-top:20px!important;}
.sz_button{background:var(--vis-green)!important;color:#fff!important;border:1px solid var(--vis-green)!important;border-radius:999px!important;min-width:112px;height:42px;line-height:40px;padding:0 24px!important;font-size:14px;font-weight:650;box-shadow:0 8px 18px rgba(51,140,86,.22);transition:all .2s ease;}
.sz_button:hover{background:var(--vis-green-dark)!important;border-color:var(--vis-green-dark)!important;transform:translateY(-1px);box-shadow:0 10px 22px rgba(51,140,86,.28);}
#errorTips{color:var(--vis-red);margin-right:12px;}

/* Pagination */
.pagination,.pager{display:flex;justify-content:center;gap:6px;flex-wrap:wrap;margin:22px 0!important;}
.pagination a,.pagination span,.pager a,.pager span{border:1px solid var(--vis-line);background:#fff;border-radius:8px;padding:7px 12px;color:#374151;}
.pagination .active,.pagination a:hover,.pager .active,.pager a:hover{background:var(--vis-green);border-color:var(--vis-green);color:#fff!important;}

@media (max-width:991.98px){
  .mian-body.container{display:block!important;max-width:calc(100% - 24px)!important;padding-top:18px!important;}
  .aside-left.col-md-9,.aside-right.col-md-3{width:100%!important;max-width:100%!important;}
  .aside-right.col-md-3{margin-top:18px;}
  .search{display:block;max-width:none;margin-right:0;}
  .navlist.navbar-nav{margin-top:10px!important;}
  .huifu-text-box,.weiguan-people{padding-left:0;}
}
@media (max-width:575.98px){
  .mian-body.container{max-width:calc(100% - 16px)!important;padding-bottom:40px!important;}
  .sbox,.article-nav,.wenda,.tiwen_box{border-radius:12px;padding:16px!important;}
  .article-list-item{padding:16px!important;gap:10px;}
  .list-avter{width:38px;height:38px;flex-basis:38px;}
  .list-avter img{width:38px!important;height:38px!important;}
  .went-head{font-size:15px;}
  .tx-list{display:block;}
  .more-info{margin-top:4px;}
  .wt-head{font-size:19px!important;}
  .huifu-li{padding:16px!important;}
  .tiwen_box{padding:18px!important;}
  .width100.et.da{display:block;text-align:right;}
}


/* ============================================================
   VISSONIC Ask details patch - CSS only, 2026-06-01
   Covers: sbox horizontal nav, wt-opti user card, huifu-edit answer box,
   and optional ask-hero block supplied separately for manual HTML insertion.
   ============================================================ */

/* 1) Search/category bar: force horizontal navigation */
.mian-body.container .sbox{
  display:flex!important;
  flex-direction:row!important;
  align-items:center!important;
  justify-content:space-between!important;
  gap:16px!important;
  padding:16px 18px!important;
}
.mian-body.container .sbox .search{
  flex:0 0 330px!important;
  width:330px!important;
  max-width:330px!important;
  margin:0!important;
  display:block!important;
}
.mian-body.container .sbox .navlist,
.mian-body.container .sbox ul.navlist,
.mian-body.container .sbox .navbar-nav.navlist,
.mian-body.container .sbox ul.nav.navbar-nav.navbar-right.navlist{
  flex:1 1 auto!important;
  width:auto!important;
  max-width:none!important;
  display:flex!important;
  flex-direction:row!important;
  flex-wrap:wrap!important;
  align-items:center!important;
  justify-content:flex-start!important;
  gap:8px!important;
  float:none!important;
  clear:none!important;
  margin:0!important;
  padding:0!important;
  list-style:none!important;
}
.mian-body.container .sbox .navlist>li,
.mian-body.container .sbox ul.navlist>li,
.mian-body.container .sbox .navbar-nav.navlist>li,
.mian-body.container .sbox ul.nav.navbar-nav.navbar-right.navlist>li{
  float:none!important;
  display:block!important;
  width:auto!important;
  margin:0!important;
  padding:0!important;
  list-style:none!important;
  position:relative!important;
}
.mian-body.container .sbox .navlist>li>a.link,
.mian-body.container .sbox ul.navlist>li>a.link,
.mian-body.container .sbox .navbar-nav.navlist>li>a.link{
  display:inline-flex!important;
  align-items:center!important;
  justify-content:center!important;
  width:auto!important;
  min-width:0!important;
  height:36px!important;
  line-height:34px!important;
  padding:0 14px!important;
  white-space:nowrap!important;
  text-align:center!important;
}
.mian-body.container .sbox .clearfix{display:none!important;}
.mian-body.container .sbox .dropdown-menu{
  left:0!important;
  right:auto!important;
  min-width:150px!important;
  z-index:50!important;
}

/* 2) Right-side personal info card: guest and logged-in states */
.aside-right .wt-opti{
  background:linear-gradient(180deg,#ffffff 0%,#fbfdfc 100%)!important;
  border:1px solid rgba(229,231,235,.95)!important;
  border-radius:var(--vis-radius)!important;
  box-shadow:var(--vis-shadow)!important;
  padding:20px!important;
  margin-bottom:18px!important;
  overflow:hidden!important;
  position:relative!important;
}
.aside-right .wt-opti:before{
  content:"";
  position:absolute;
  left:0;right:0;top:0;height:4px;
  background:linear-gradient(90deg,var(--vis-green),#6fb88b);
}
.aside-right .people-info{
  display:flex!important;
  align-items:center!important;
  gap:12px!important;
  margin:0 0 16px!important;
  min-height:50px!important;
}
.aside-right .people-info>a{
  flex:0 0 50px!important;
  width:50px!important;
  height:50px!important;
  display:block!important;
}
.aside-right .people-info>a img{
  width:50px!important;
  height:50px!important;
  border-radius:50%!important;
  object-fit:cover!important;
  box-shadow:0 0 0 4px #fff,0 8px 18px rgba(15,23,42,.14)!important;
}
.aside-right .people-info-a{
  flex:1 1 auto!important;
  min-width:0!important;
}
.aside-right .people-info-a h3{
  margin:0 0 4px!important;
  padding:0!important;
  font-size:16px!important;
  line-height:1.35!important;
  font-weight:750!important;
  color:var(--vis-text)!important;
  overflow:hidden!important;
  text-overflow:ellipsis!important;
  white-space:nowrap!important;
}
.aside-right .people-info-a h3:empty:before{
  content:"VISSONIC Member";
  color:var(--vis-text);
}
.aside-right .people-info-a div{
  min-height:18px!important;
  color:var(--vis-muted)!important;
  font-size:13px!important;
  line-height:1.4!important;
}
.aside-right .people-info-a div:empty:before{
  content:"Welcome to the support community";
  color:var(--vis-light);
}
.aside-right .people-btn{
  display:flex!important;
  flex-direction:column!important;
  gap:10px!important;
  margin-top:12px!important;
}
.aside-right .people-btn button,
.aside-right .people-btn .tw,
.aside-right .people-btn a{
  width:100%!important;
  height:42px!important;
  line-height:40px!important;
  border-radius:999px!important;
  border:1px solid var(--vis-green)!important;
  background:var(--vis-green)!important;
  color:#fff!important;
  font-size:14px!important;
  font-weight:700!important;
  text-align:center!important;
  box-shadow:0 8px 18px rgba(51,140,86,.22)!important;
  transition:all .2s ease!important;
}
.aside-right .people-btn button:hover,
.aside-right .people-btn .tw:hover,
.aside-right .people-btn a:hover{
  background:var(--vis-green-dark)!important;
  border-color:var(--vis-green-dark)!important;
  transform:translateY(-1px)!important;
}
.aside-right .people-btn i{margin-right:5px!important;}

/* 3) Detail answer editor wrapper: style the surrounding box only */
.huifu-edit{
  background:var(--vis-card)!important;
  border:1px solid rgba(229,231,235,.95)!important;
  border-radius:var(--vis-radius)!important;
  box-shadow:var(--vis-shadow)!important;
  padding:22px!important;
  margin:18px 0 0!important;
  overflow:hidden!important;
}
.huifu-edit:before{
  content:"Write your answer";
  display:block;
  margin:-2px 0 16px;
  padding-left:13px;
  border-left:4px solid var(--vis-green);
  color:var(--vis-text);
  font-size:17px;
  line-height:1.3;
  font-weight:750;
}
.huifu-edit .huifu-user{
  display:flex!important;
  align-items:center!important;
  gap:10px!important;
  margin-bottom:14px!important;
  padding:12px 14px!important;
  background:#F9FAFB!important;
  border:1px solid #EEF0F3!important;
  border-radius:12px!important;
}
.huifu-edit .huifu-user img{
  width:42px!important;
  height:42px!important;
  border-radius:50%!important;
  object-fit:cover!important;
  box-shadow:0 0 0 3px #fff,0 5px 14px rgba(15,23,42,.12)!important;
}
.huifu-edit .user-nice .nice{
  margin:0!important;
  font-size:14px!important;
  font-weight:700!important;
  color:var(--vis-text)!important;
}
.huifu-edit form{
  margin:0!important;
}
.huifu-edit .edit-opt{
  display:flex!important;
  align-items:center!important;
  justify-content:flex-end!important;
  gap:12px!important;
  padding-top:16px!important;
  margin-top:0!important;
}
.huifu-edit .editbutton,
.huifu-edit #CommentButtonDiv{
  display:inline-flex!important;
  align-items:center!important;
  justify-content:center!important;
  min-width:120px!important;
  height:42px!important;
  padding:0 24px!important;
  border-radius:999px!important;
  border:1px solid var(--vis-green)!important;
  background:var(--vis-green)!important;
  color:#fff!important;
  font-size:14px!important;
  font-weight:700!important;
  box-shadow:0 8px 18px rgba(51,140,86,.22)!important;
  transition:all .2s ease!important;
}
.huifu-edit .editbutton:hover,
.huifu-edit #CommentButtonDiv:hover{
  background:var(--vis-green-dark)!important;
  border-color:var(--vis-green-dark)!important;
  transform:translateY(-1px)!important;
}

/* 4) Optional hero banner styles. HTML snippet provided in the reply. */
.ask-hero{
  background:radial-gradient(circle at 10% 20%,rgba(51,140,86,.18),transparent 28%),linear-gradient(135deg,#123824 0%,#277346 48%,#338C56 100%);
  color:#fff;
  padding:54px 0 46px;
  margin:0 0 8px;
  overflow:hidden;
}
.ask-hero .container{width:1140px;max-width:calc(100% - 32px);margin:0 auto;}
.ask-hero-inner{display:flex;align-items:center;justify-content:space-between;gap:34px;}
.ask-hero-kicker{display:inline-flex;align-items:center;padding:5px 11px;border-radius:999px;background:rgba(255,255,255,.14);border:1px solid rgba(255,255,255,.22);font-size:12px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;margin-bottom:14px;}
.ask-hero h1{margin:0 0 14px;font-size:38px;line-height:1.18;font-weight:800;color:#fff;max-width:680px;}
.ask-hero p{margin:0;color:rgba(255,255,255,.82);font-size:16px;line-height:1.75;max-width:680px;}
.ask-hero-actions{display:flex;align-items:center;gap:12px;flex-wrap:wrap;margin-top:24px;}
.ask-hero-primary,.ask-hero-secondary{display:inline-flex;align-items:center;justify-content:center;height:44px;padding:0 22px;border-radius:999px;font-weight:700;text-decoration:none!important;}
.ask-hero-primary{background:#fff;color:var(--vis-green-dark)!important;box-shadow:0 10px 24px rgba(0,0,0,.16);}
.ask-hero-secondary{border:1px solid rgba(255,255,255,.38);color:#fff!important;background:rgba(255,255,255,.08);}
.ask-hero-primary:hover{transform:translateY(-1px);box-shadow:0 14px 30px rgba(0,0,0,.2);}
.ask-hero-secondary:hover{background:rgba(255,255,255,.16);}
.ask-hero-stats{flex:0 0 280px;display:grid;grid-template-columns:1fr 1fr;gap:12px;}
.ask-hero-stat{background:rgba(255,255,255,.12);border:1px solid rgba(255,255,255,.18);border-radius:16px;padding:16px;text-align:center;backdrop-filter:blur(6px);}
.ask-hero-stat strong{display:block;font-size:24px;line-height:1.1;color:#fff;margin-bottom:5px;}
.ask-hero-stat span{font-size:12px;color:rgba(255,255,255,.78);}

@media (max-width:991.98px){
  .mian-body.container .sbox{display:block!important;}
  .mian-body.container .sbox .search{width:100%!important;max-width:none!important;margin:0 0 12px!important;}
  .mian-body.container .sbox .navlist{justify-content:flex-start!important;}
  .ask-hero-inner{display:block;}
  .ask-hero-stats{margin-top:26px;max-width:420px;}
}
@media (max-width:575.98px){
  .mian-body.container .sbox .navlist>li>a.link{height:34px!important;line-height:32px!important;padding:0 11px!important;font-size:13px!important;}
  .aside-right .wt-opti,.huifu-edit{padding:16px!important;}
  .ask-hero{padding:38px 0 34px;}
  .ask-hero h1{font-size:28px;}
  .ask-hero-stats{grid-template-columns:1fr 1fr;gap:8px;}
  .ask-hero-stat{padding:12px 8px;}
}


/* ============================================================
   VISSONIC Ask hero glassmorphism override - 2026-06-01
   Keep current ask-hero HTML; CSS-only visual refinement.
   ============================================================ */
.ask-hero{
  position:relative!important;
  isolation:isolate!important;
  overflow:hidden!important;
  margin:0!important;
  padding:38px 0 34px!important;
  color:var(--vis-text)!important;
  background:
    radial-gradient(circle at 12% 18%,rgba(51,140,86,.22) 0,rgba(51,140,86,.10) 24%,transparent 46%),
    radial-gradient(circle at 86% 12%,rgba(94,171,128,.26) 0,rgba(94,171,128,.10) 25%,transparent 48%),
    radial-gradient(circle at 52% 92%,rgba(51,140,86,.14) 0,rgba(51,140,86,.06) 26%,transparent 52%),
    linear-gradient(135deg,#F3FAF6 0%,#EAF5EF 46%,#F7FAF8 100%)!important;
}
.ask-hero:before,
.ask-hero:after{
  content:"";
  position:absolute;
  z-index:-1;
  border-radius:999px;
  filter:blur(4px);
  pointer-events:none;
}
.ask-hero:before{
  width:420px;height:420px;
  left:-120px;top:-170px;
  background:rgba(51,140,86,.16);
}
.ask-hero:after{
  width:520px;height:520px;
  right:-170px;bottom:-250px;
  background:rgba(94,171,128,.16);
}
.ask-hero .container{
  width:1140px!important;
  max-width:calc(100% - 32px)!important;
  margin:0 auto!important;
  padding:0!important;
}
.ask-hero-inner{
  position:relative!important;
  display:flex!important;
  align-items:stretch!important;
  justify-content:space-between!important;
  gap:24px!important;
  padding:28px!important;
  border:1px solid rgba(255,255,255,.72)!important;
  border-radius:28px!important;
  background:linear-gradient(135deg,rgba(255,255,255,.74),rgba(255,255,255,.46))!important;
  box-shadow:0 22px 60px rgba(33,82,55,.13),inset 0 1px 0 rgba(255,255,255,.75)!important;
  -webkit-backdrop-filter:blur(18px) saturate(150%)!important;
  backdrop-filter:blur(18px) saturate(150%)!important;
  overflow:hidden!important;
}
.ask-hero-inner:before{
  content:"";
  position:absolute;
  inset:1px;
  border-radius:27px;
  background:linear-gradient(120deg,rgba(255,255,255,.55),rgba(255,255,255,0) 40%,rgba(51,140,86,.06));
  pointer-events:none;
}
.ask-hero-content{
  position:relative!important;
  z-index:1!important;
  flex:1 1 auto!important;
  min-width:0!important;
  padding:4px 6px!important;
}
.ask-hero-kicker{
  display:inline-flex!important;
  align-items:center!important;
  gap:8px!important;
  margin:0 0 14px!important;
  padding:7px 12px!important;
  border-radius:999px!important;
  border:1px solid rgba(51,140,86,.22)!important;
  background:rgba(255,255,255,.62)!important;
  color:var(--vis-green-dark)!important;
  box-shadow:0 6px 20px rgba(51,140,86,.08),inset 0 1px 0 rgba(255,255,255,.85)!important;
  -webkit-backdrop-filter:blur(10px)!important;
  backdrop-filter:blur(10px)!important;
  font-size:11px!important;
  line-height:1!important;
  font-weight:800!important;
  letter-spacing:.12em!important;
}
.ask-hero-kicker:before{
  content:"";
  width:7px;height:7px;
  border-radius:50%;
  background:var(--vis-green);
  box-shadow:0 0 0 5px rgba(51,140,86,.12);
}
.ask-hero h1{
  max-width:720px!important;
  margin:0 0 12px!important;
  color:#14241B!important;
  font-size:38px!important;
  line-height:1.14!important;
  font-weight:820!important;
  letter-spacing:-.035em!important;
}
.ask-hero p{
  max-width:700px!important;
  margin:0!important;
  color:#526057!important;
  font-size:15.5px!important;
  line-height:1.74!important;
}
.ask-hero-actions{
  display:flex!important;
  align-items:center!important;
  flex-wrap:wrap!important;
  gap:12px!important;
  margin-top:22px!important;
}
.ask-hero-primary,
.ask-hero-secondary{
  display:inline-flex!important;
  align-items:center!important;
  justify-content:center!important;
  height:43px!important;
  padding:0 21px!important;
  border-radius:999px!important;
  font-size:14px!important;
  font-weight:750!important;
  text-decoration:none!important;
  transition:all .2s ease!important;
}
.ask-hero-primary{
  color:#fff!important;
  border:1px solid var(--vis-green)!important;
  background:linear-gradient(135deg,var(--vis-green),var(--vis-green-dark))!important;
  box-shadow:0 12px 24px rgba(51,140,86,.22)!important;
}
.ask-hero-secondary{
  color:var(--vis-green-dark)!important;
  border:1px solid rgba(51,140,86,.24)!important;
  background:rgba(255,255,255,.58)!important;
  -webkit-backdrop-filter:blur(10px)!important;
  backdrop-filter:blur(10px)!important;
}
.ask-hero-primary:hover,
.ask-hero-secondary:hover{
  transform:translateY(-1px)!important;
  text-decoration:none!important;
}
.ask-hero-primary:hover{box-shadow:0 15px 30px rgba(51,140,86,.28)!important;}
.ask-hero-secondary:hover{background:rgba(255,255,255,.76)!important;border-color:rgba(51,140,86,.36)!important;}
.ask-hero-stats{
  position:relative!important;
  z-index:1!important;
  flex:0 0 286px!important;
  display:grid!important;
  grid-template-columns:1fr 1fr!important;
  gap:12px!important;
  align-content:stretch!important;
}
.ask-hero-stat{
  min-height:92px!important;
  display:flex!important;
  flex-direction:column!important;
  align-items:center!important;
  justify-content:center!important;
  text-align:center!important;
  padding:14px 10px!important;
  border-radius:18px!important;
  border:1px solid rgba(255,255,255,.72)!important;
  background:rgba(255,255,255,.52)!important;
  box-shadow:0 12px 28px rgba(33,82,55,.08),inset 0 1px 0 rgba(255,255,255,.82)!important;
  -webkit-backdrop-filter:blur(14px) saturate(145%)!important;
  backdrop-filter:blur(14px) saturate(145%)!important;
}
.ask-hero-stat strong{
  display:block!important;
  margin:0 0 6px!important;
  color:var(--vis-green-dark)!important;
  font-size:24px!important;
  line-height:1!important;
  font-weight:850!important;
  letter-spacing:-.02em!important;
}
.ask-hero-stat span{
  color:#66736A!important;
  font-size:12px!important;
  line-height:1.35!important;
  font-weight:650!important;
}

/* Reduce the gap between glass hero and ask content */
.ask-hero + .mian-body.container,
.ask-hero ~ .mian-body.container{
  padding-top:22px!important;
}

@media (max-width:991.98px){
  .ask-hero{padding:28px 0 26px!important;}
  .ask-hero-inner{display:block!important;padding:24px!important;border-radius:24px!important;}
  .ask-hero h1{font-size:32px!important;}
  .ask-hero-stats{margin-top:22px!important;max-width:420px!important;}
}
@media (max-width:575.98px){
  .ask-hero .container{max-width:calc(100% - 18px)!important;}
  .ask-hero-inner{padding:19px!important;border-radius:20px!important;}
  .ask-hero h1{font-size:26px!important;line-height:1.18!important;}
  .ask-hero p{font-size:14px!important;}
  .ask-hero-actions{gap:9px!important;}
  .ask-hero-primary,.ask-hero-secondary{height:40px!important;padding:0 16px!important;font-size:13px!important;}
  .ask-hero-stats{grid-template-columns:1fr 1fr!important;gap:9px!important;}
  .ask-hero-stat{min-height:78px!important;border-radius:15px!important;}
  .ask-hero-stat strong{font-size:21px!important;}
}


/* Final small tuning for glass hero buttons and separation */
.ask-hero{
  border-bottom:1px solid rgba(51,140,86,.08)!important;
}
.ask-hero:before{
  opacity:.92!important;
}
.ask-hero:after{
  opacity:.9!important;
}
.ask-hero-primary,
.ask-hero-primary:link,
.ask-hero-primary:visited,
.ask-hero-primary:hover,
.ask-hero-primary:focus{
  color:#ffffff!important;
  text-shadow:0 1px 1px rgba(0,0,0,.12)!important;
}
.ask-hero-secondary,
.ask-hero-secondary:link,
.ask-hero-secondary:visited{
  color:var(--vis-green-dark)!important;
  text-shadow:none!important;
}
.ask-hero-secondary:hover,
.ask-hero-secondary:focus{
  color:var(--vis-green-dark)!important;
  background:rgba(255,255,255,.82)!important;
  border-color:rgba(51,140,86,.42)!important;
}
.ask-hero-actions a{
  opacity:1!important;
}
.ask-hero-inner{
  outline:1px solid rgba(255,255,255,.26)!important;
  outline-offset:-6px!important;
}
.ask-hero-stat{
  background:linear-gradient(145deg,rgba(255,255,255,.64),rgba(255,255,255,.40))!important;
}


/* ============================================================
   Restore old compact VISSONIC Ask hero style - 2026-06-01
   Based on new1_ask vis_ask_bootstrap.css / vis_ask_skin.css.
   Supports preferred HTML: .vis-ask-hero + .vis-ask-kicker.
   Also gracefully simplifies current .ask-hero if still online.
   ============================================================ */

/* Preferred old hero block */
.vis-ask-hero{
  width:1140px!important;
  max-width:calc(100% - 32px)!important;
  margin:26px auto 24px!important;
  padding:32px 36px!important;
  border:1px solid rgba(51,140,86,.14)!important;
  border-radius:22px!important;
  background:
    linear-gradient(135deg,rgba(255,255,255,.96),rgba(248,251,255,.92)),
    radial-gradient(circle at right top,rgba(51,140,86,.14),transparent 38%)!important;
  box-shadow:0 8px 22px rgba(15,23,42,.055)!important;
  box-sizing:border-box!important;
}
.vis-ask-kicker{
  display:inline-flex!important;
  align-items:center!important;
  margin:0 0 8px!important;
  color:var(--vis-green,#338C56)!important;
  font-size:12px!important;
  line-height:1.2!important;
  font-weight:900!important;
  letter-spacing:.13em!important;
  text-transform:uppercase!important;
}
.vis-ask-hero h1{
  margin:0 0 8px!important;
  color:#0f172a!important;
  font-size:36px!important;
  line-height:1.14!important;
  font-weight:900!important;
  letter-spacing:-.02em!important;
}
.vis-ask-hero p{
  max-width:680px!important;
  margin:0!important;
  color:var(--vis-muted,#6b7280)!important;
  font-size:15px!important;
  line-height:1.7!important;
}

/* If the current online HTML is still .ask-hero, make it look like the old compact hero. */
.ask-hero{
  display:block!important;
  width:1140px!important;
  max-width:calc(100% - 32px)!important;
  margin:26px auto 24px!important;
  padding:0!important;
  color:var(--vis-text,#111827)!important;
  background:transparent!important;
  border:0!important;
  box-shadow:none!important;
  overflow:visible!important;
  isolation:auto!important;
}
.ask-hero:before,
.ask-hero:after{
  display:none!important;
  content:none!important;
}
.ask-hero .container{
  width:100%!important;
  max-width:100%!important;
  margin:0!important;
  padding:0!important;
}
.ask-hero-inner{
  display:block!important;
  padding:32px 36px!important;
  border:1px solid rgba(51,140,86,.14)!important;
  border-radius:22px!important;
  background:
    linear-gradient(135deg,rgba(255,255,255,.96),rgba(248,251,255,.92)),
    radial-gradient(circle at right top,rgba(51,140,86,.14),transparent 38%)!important;
  box-shadow:0 8px 22px rgba(15,23,42,.055)!important;
  outline:0!important;
  overflow:hidden!important;
}
.ask-hero-inner:before{
  display:none!important;
  content:none!important;
}
.ask-hero-content{
  display:block!important;
  padding:0!important;
  max-width:760px!important;
}
.ask-hero-kicker{
  display:inline-flex!important;
  align-items:center!important;
  gap:0!important;
  margin:0 0 8px!important;
  padding:0!important;
  border:0!important;
  border-radius:0!important;
  background:transparent!important;
  box-shadow:none!important;
  color:var(--vis-green,#338C56)!important;
  font-size:12px!important;
  line-height:1.2!important;
  font-weight:900!important;
  letter-spacing:.13em!important;
  text-transform:uppercase!important;
  -webkit-backdrop-filter:none!important;
  backdrop-filter:none!important;
}
.ask-hero-kicker:before{display:none!important;content:none!important;}
.ask-hero h1{
  max-width:760px!important;
  margin:0 0 8px!important;
  color:#0f172a!important;
  font-size:36px!important;
  line-height:1.14!important;
  font-weight:900!important;
  letter-spacing:-.02em!important;
}
.ask-hero p{
  max-width:680px!important;
  margin:0!important;
  color:var(--vis-muted,#6b7280)!important;
  font-size:15px!important;
  line-height:1.7!important;
}
/* Old compact hero has no stats/actions; hide current complex additions. */
.ask-hero-actions,
.ask-hero-stats{
  display:none!important;
}
.ask-hero + .mian-body.container,
.ask-hero ~ .mian-body.container,
.vis-ask-hero + .mian-body.container,
.vis-ask-hero ~ .mian-body.container{
  padding-top:0!important;
}

@media(max-width:767.98px){
  .vis-ask-hero,
  .ask-hero{
    max-width:calc(100% - 24px)!important;
    margin:18px auto 18px!important;
  }
  .vis-ask-hero,
  .ask-hero-inner{
    padding:22px 20px!important;
    border-radius:18px!important;
  }
  .vis-ask-hero h1,
  .ask-hero h1{
    font-size:26px!important;
  }
  .vis-ask-hero p,
  .ask-hero p{
    font-size:14px!important;
  }
}