/* 顶部导航 & 标签栏 滚动悬浮（sticky）
   注意：html/body 上的 overflow-x:hidden 会让浏览器把 body 当成滚动容器，
   position:sticky 就失效了 ⇒ 统一改用 overflow-x:clip（是否裁剪但仍是文档滚动）*/

html, body {
  /* 现代浏览器：裁剪但不建立滚动容器，sticky 才生效；!important 压过页面里的 overflow-x:hidden */
  overflow-x: clip !important;
  overflow-y: visible !important;
}

.top {
  position: sticky;
  top: 0;
  z-index: 60;
}

/* 标签栏贴在顶栏下方，滚动时一起悬浮 */
.tabs {
  position: sticky;
  top: 66px;
  z-index: 55;
  background: #F7F6FA;
  padding: 10px 0 8px;
  margin-bottom: 8px;
  box-shadow: 0 6px 14px -10px rgba(30, 50, 90, .35);
}

/* 飞儿（樱花粉）主题下换底色，避免露出一条突兀的灰 */
body.hz-theme-sakura .tabs {
  background: #FDF6F8;
}

/* 墨青（中性）主题 */
body.hz-theme-neutral .tabs {
  background: #F4F6FA;
}

/* 顶栏与标签栏之间的分隔，滚动时更清楚 */
.top {
  box-shadow: 0 2px 14px rgba(30, 50, 90, .18);
}

@media (max-width: 680px) {
  .top { height: 54px; }
  .tabs {
    top: 54px;
    padding: 8px 0 6px;
  }
}
