/* ===========================================================
   星光导航网 · V8 修正层（最后加载）
   1) 搜索分组下拉：白卡片 → 深色毛玻璃
   2) 手机端「分类」悬浮按钮：点了没反应 → 真正可用
   3) 抽屉：菜单在上、全部分类在下，且可折叠
   =========================================================== */

/* ============ 1 · 搜索分组下拉：深色玻璃 ============ */
.header-banner #search-list .dropdown-menu,
.header-banner .simple-group-list .dropdown-menu,
#search-list .dropdown-menu{
  background:rgba(18,13,38,.90)!important;
  -webkit-backdrop-filter:saturate(170%) blur(22px)!important;
  backdrop-filter:saturate(170%) blur(22px)!important;
  border:1px solid rgba(255,255,255,.14)!important;
  border-radius:16px!important;
  padding:6px!important;
  margin-top:8px!important;
  min-width:126px!important;
  box-shadow:0 18px 46px rgba(9,5,25,.45),0 1px 0 rgba(255,255,255,.10) inset!important;
  overflow:hidden!important;
}
.header-banner #search-list .dropdown-menu .search-menu,
.header-banner #search-list .dropdown-menu .dropdown-item{
  display:block!important;
  color:rgba(255,255,255,.80)!important;
  background:transparent!important;
  border-radius:11px!important;
  font-size:13.5px!important;
  line-height:1!important;
  padding:10px 14px!important;
  margin:2px 0!important;
  transition:background .16s,color .16s!important;
}
.header-banner #search-list .dropdown-menu .search-menu:hover,
.header-banner #search-list .dropdown-menu .dropdown-item:hover{
  background:rgba(255,255,255,.10)!important;color:#fff!important;
}
.header-banner #search-list .dropdown-menu .search-menu.active,
.header-banner #search-list .dropdown-menu .dropdown-item.active{
  background:linear-gradient(135deg,#7c3aed 0%,#c026d3 100%)!important;
  color:#fff!important;font-weight:600!important;
  box-shadow:0 6px 18px rgba(124,58,237,.40)!important;
}
/* 触发按钮（常用 ⌄）：玻璃胶囊 */
.header-banner #search-list .dropdown > .btn,
.header-banner #search-list .dropdown > a.btn{
  background:rgba(255,255,255,.16)!important;
  border:1px solid rgba(255,255,255,.26)!important;
  border-radius:999px!important;
  color:#fff!important;
  padding:0 14px!important;
  height:100%!important;
  display:inline-flex!important;align-items:center;
  -webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);
}
.header-banner #search-list .dropdown > .btn:hover,
.header-banner #search-list .dropdown > a.btn:hover{background:rgba(255,255,255,.26)!important;}
.header-banner #search-list .dropdown > .btn .select-item{color:#fff!important;}
.header-banner #search-list .dropdown > .btn .iconfont{color:#fff!important;opacity:.85;}

/* ============ 2 · 手机端「分类」悬浮按钮 + 侧栏抽屉 ============ */
@media (max-width:767.98px){
  /* 悬浮按钮本体：深色玻璃胶囊 */
  body .tools-left .btn-show-side{
    width:44px!important;height:44px!important;
    display:flex!important;align-items:center!important;justify-content:center!important;
    border-radius:14px!important;
    background:rgba(20,14,42,.62)!important;
    -webkit-backdrop-filter:saturate(160%) blur(14px)!important;
    backdrop-filter:saturate(160%) blur(14px)!important;
    border:1px solid rgba(255,255,255,.20)!important;
    box-shadow:0 8px 22px rgba(9,5,25,.28)!important;
    color:#fff!important;
  }
  body .tools-left .btn-show-side i{color:#fff!important;font-size:17px!important;}
  body .tools-left .btn-show-side:active{transform:scale(.94);}

  /* 万一主题侧栏被唤起，也给它正常宽度和皮肤，别成一条 0 宽的怪东西 */
  #layout_aside.aside-body{
    position:fixed!important;top:0!important;bottom:0!important;left:0!important;
    width:min(84vw,330px)!important;max-width:100%!important;
    transform:translateX(-104%)!important;
    transition:transform .32s cubic-bezier(.22,.9,.24,1)!important;
    z-index:1080!important;overflow-y:auto!important;-webkit-overflow-scrolling:touch;
    background:rgba(16,11,36,.94)!important;
    -webkit-backdrop-filter:blur(24px) saturate(160%)!important;
    backdrop-filter:blur(24px) saturate(160%)!important;
    box-shadow:0 0 60px rgba(0,0,0,.5)!important;
  }
  #layout_aside.aside-body.show{transform:translateX(0)!important;}
  #layout_aside .aside-card,
  #layout_aside .aside-card.blur-bg{
    width:100%!important;background:transparent!important;border:0!important;box-shadow:none!important;
  }
  #layout_aside .aside-ul .aside-item>a{color:#fff!important;}
}

/* ============ 3 · 抽屉：全部分类改折叠 + 位置下移 ============ */
@media (max-width:767.98px){
  .mobile-header .mobile-nav .xqg-mcats-wrap{
    margin:6px 14px 16px!important;
    padding:4px 8px 2px!important;
    background:rgba(255,255,255,.06)!important;
    border:1px solid rgba(255,255,255,.10)!important;
    border-radius:16px!important;
  }
  .mobile-header .mobile-nav .xqg-mcats-h{
    display:flex!important;align-items:center!important;gap:8px!important;
    padding:11px 6px!important;margin:0!important;
    font-size:14px!important;font-weight:600!important;color:#fff!important;
    cursor:pointer!important;user-select:none;
    background:none!important;border:0!important;width:100%!important;text-align:left!important;
    -webkit-tap-highlight-color:transparent;
  }
  .mobile-header .mobile-nav .xqg-mcats-h .xqg-cnt{
    font-size:11px!important;font-weight:500!important;color:rgba(255,255,255,.55)!important;
    background:rgba(255,255,255,.10)!important;border-radius:999px!important;padding:2px 8px!important;
    line-height:1.5!important;
  }
  .mobile-header .mobile-nav .xqg-mcats-h .xqg-arrow{
    margin-left:auto!important;width:9px!important;height:9px!important;
    border-right:1.6px solid rgba(255,255,255,.7)!important;
    border-bottom:1.6px solid rgba(255,255,255,.7)!important;
    transform:rotate(45deg) translateY(-2px)!important;
    transition:transform .28s ease!important;
  }
  .mobile-header .mobile-nav .xqg-mcats-wrap.is-open .xqg-cnt{background:rgba(124,58,237,.45)!important;color:#fff!important;}
  .mobile-header .mobile-nav .xqg-mcats-wrap.is-open .xqg-arrow{transform:rotate(-135deg) translateY(-2px)!important;}

  .mobile-header .mobile-nav .xqg-mcats{
    display:grid!important;grid-template-columns:1fr 1fr!important;gap:8px!important;
    max-height:0!important;overflow:hidden!important;opacity:0;
    transition:max-height .35s cubic-bezier(.22,.9,.24,1),opacity .25s ease,padding .3s!important;
    padding:0 2px!important;
  }
  .mobile-header .mobile-nav .xqg-mcats-wrap.is-open .xqg-mcats{
    max-height:1200px!important;opacity:1;padding:2px 2px 8px!important;
  }
}

/* ---------- 3) 搜索分组下拉：手机端点击展开 ---------- */
.header-banner #search-list .dropdown.xqg-open .dropdown-menu{
  display:block!important;
  visibility:visible!important;
  opacity:1!important;
  transform:translateY(0)!important;
  pointer-events:auto!important;
}
.header-banner #search-list .dropdown.xqg-open > a > i,
.header-banner #search-list .dropdown.xqg-open > .btn > i{
  transform:rotate(45deg)!important;
}
.header-banner #search-list .dropdown > .btn,
.header-banner #search-list .dropdown > a.btn{
  min-height:30px!important;
  padding:0 13px!important;
  font-size:12.5px!important;
  display:inline-flex!important;
  align-items:center!important;
}
@media (max-width:767.98px){
  .header-banner #search-list .dropdown .dropdown-menu{
    min-width:132px!important;
    padding:7px!important;
    z-index:120!important;
  }
  .header-banner #search-list .dropdown-menu .search-menu,
  .header-banner #search-list .dropdown-menu .dropdown-item{
    padding:9px 12px!important;
    font-size:13px!important;
  }
  .header-banner #search-list .search-group .search-term{
    padding:7px 14px!important;
    font-size:12.5px!important;
  }
}
