/* 凯盛集策.精英会 - 统一顶栏（所有页面共用，由 partials/nav.ejs 引入） */
/* 与猎单大厅设计稿 3:2 完全一致：品牌 + 5 项导航 + 手机号 + 退出 */
.ks-nav {
  position: relative;
  z-index: 50;
  height: 64px;
  background: #fff;
  border-bottom: 1px solid #F1E4DC;
  display: flex;
  align-items: center;
  gap: 24px;
  padding: 0 24px;
}
.ks-brand { display: flex; align-items: center; gap: 12px; }
.ks-logo {
  width: 32px; height: 32px; border-radius: 6px;
  background: linear-gradient(135deg, #FF9A5A 0%, #EC5A2D 100%);
  position: relative; flex: none;
  box-shadow: 0 3px 8px rgba(236,90,45,.30);
}
.ks-logo::after {
  content: ""; position: absolute; left: 9px; top: 11px;
  width: 14px; height: 10px;
  background: #fff;
  clip-path: polygon(0 0, 100% 50%, 0 100%);
}
.ks-brand-text { font-size: 18px; font-weight: 700; color: #2B2330; white-space: nowrap; }

.ks-menu { display: flex; align-items: center; gap: 28px; margin-left: auto; }
.ks-navitem {
  font-size: 15px; color: #7C6F79; padding: 6px 0; position: relative;
  white-space: nowrap; text-decoration: none;
}
.ks-navitem:hover { color: #EC5A2D; opacity: 1; }
.ks-navitem.active { color: #EC5A2D; font-weight: 500; }
.ks-navitem.active::after {
  content: ""; position: absolute; left: 50%; transform: translateX(-50%);
  bottom: -21px; width: 24px; height: 2px; border-radius: 1px; background: #EC5A2D;
}

.ks-nav-right { display: flex; align-items: center; gap: 16px; margin-left: 12px; }
.ks-phone { font-size: 13px; color: #7C6F79; }
.ks-logout {
  font-size: 13px; color: #2B2330; text-decoration: none;
  border: 1px solid #EAD7CC; border-radius: 6px; padding: 6px 12px;
}
.ks-logout:hover { color: #EC5A2D; border-color: #EC5A2D; opacity: 1; }

/* ═══════════════════════════════════════════════════════════
   顶栏增强层：吸顶磨砂 / 阴影层次 / 动效 / 汉堡 X 动画（纯表现层）
   ═══════════════════════════════════════════════════════════ */

/* 吸顶 + 磨砂玻璃 + 阴影 */
.ks-nav {
  position: -webkit-sticky; position: sticky; top: 0;
  background: rgba(255,255,255,.86);
  -webkit-backdrop-filter: saturate(180%) blur(10px);
  backdrop-filter: saturate(180%) blur(10px);
  box-shadow: 0 1px 0 rgba(16,24,40,.06);
  transition: box-shadow .2s var(--ease), background .2s var(--ease);
}
.ks-nav.scrolled { box-shadow: 0 4px 16px rgba(16,24,40,.10); }
html[data-theme="dark"] .ks-nav {
  background: rgba(20,22,28,.82);
  box-shadow: 0 1px 0 rgba(255,255,255,.06);
}
html[data-theme="dark"] .ks-nav.scrolled { box-shadow: 0 4px 16px rgba(0,0,0,.35); }

/* 品牌与导航项动效 */
.ks-brand { transition: opacity .15s var(--ease); cursor: default; }
.ks-brand:hover { opacity: .82; }
.ks-navitem { transition: color .15s var(--ease), opacity .15s var(--ease), transform .15s var(--ease); }
.ks-navitem:hover { transform: translateY(-1px); }
.ks-navitem.active::after { transition: width .2s var(--ease); }
.ks-logout { transition: color .15s var(--ease), border-color .15s var(--ease), background .15s var(--ease); }
.ks-logout:hover { background: var(--brand-bg); }
.ks-navlink { color: var(--text-2); font-size: 13px; text-decoration: none; transition: color .15s var(--ease); }
.ks-navlink:hover { color: var(--primary); }
.theme-toggle { transition: color .15s var(--ease), border-color .15s var(--ease), background .15s var(--ease), transform .2s var(--ease); }
.theme-toggle:hover { transform: rotate(15deg); }

/* 汉堡按钮：三道杠 → X 的过渡动画 */
.ks-nav-toggle span { transition: transform .25s var(--ease), opacity .2s var(--ease); }
.ks-nav.menu-open .ks-nav-toggle span:nth-child(1) { transform: translateY(6px) rotate(45deg); }
.ks-nav.menu-open .ks-nav-toggle span:nth-child(2) { opacity: 0; }
.ks-nav.menu-open .ks-nav-toggle span:nth-child(3) { transform: translateY(-6px) rotate(-45deg); }

/* ═══════════════════════════════════════════════════════════
   平台管理 下拉（账户与平台类入口统一收口）
   ═══════════════════════════════════════════════════════════ */
.ks-has-menu { position: relative; cursor: pointer; }
.ks-menu-trigger { display: inline-flex; align-items: center; gap: 4px; }
.ks-caret { font-style: normal; font-size: 11px; transition: transform .2s var(--ease); }
.ks-has-menu.open .ks-caret { transform: rotate(180deg); }
.ks-dropdown {
  position: absolute; top: calc(100% + 14px); left: 50%;
  transform: translateX(-50%) translateY(6px);
  min-width: 184px; padding: 8px;
  background: #fff; border: 1px solid #F1E4DC; border-radius: 12px;
  box-shadow: 0 12px 32px rgba(16,24,40,.14);
  opacity: 0; visibility: hidden; z-index: 60;
  transition: opacity .18s var(--ease), transform .18s var(--ease), visibility .18s var(--ease);
}
.ks-has-menu:hover .ks-dropdown,
.ks-has-menu.open .ks-dropdown {
  opacity: 1; visibility: visible; transform: translateX(-50%) translateY(0);
}
.ks-drop-item {
  display: flex; align-items: center; gap: 8px;
  padding: 9px 12px; border-radius: 8px;
  font-size: 14px; color: #5B5560; text-decoration: none; white-space: nowrap;
  transition: background .15s var(--ease), color .15s var(--ease);
}
.ks-drop-item:hover { background: var(--brand-bg, #FFF3EC); color: #EC5A2D; }
.ks-drop-item.active { color: #EC5A2D; font-weight: 500; }
.ks-drop-item.active::before {
  content: ""; width: 4px; height: 16px; border-radius: 2px;
  background: #EC5A2D; margin-right: -2px;
}
html[data-theme="dark"] .ks-dropdown { background: #1C1F26; border-color: rgba(255,255,255,.08); }
html[data-theme="dark"] .ks-drop-item { color: #C9CBD1; }
html[data-theme="dark"] .ks-drop-item:hover { background: rgba(255,255,255,.06); color: #FF9A5A; }
html[data-theme="dark"] .ks-drop-item.active { color: #FF9A5A; }
html[data-theme="dark"] .ks-drop-item.active::before { background: #FF9A5A; }

/* 移动端：下拉改为菜单内嵌展开 */
@media (max-width: 768px) {
  .ks-dropdown {
    position: static; transform: none; opacity: 1; visibility: visible;
    box-shadow: none; border: none; background: transparent;
    padding: 4px 0 4px 14px; min-width: 0;
  }
  .ks-has-menu:hover .ks-dropdown,
  .ks-has-menu.open .ks-dropdown { transform: none; }
  .ks-caret { transform: rotate(90deg); }
  .ks-has-menu.open .ks-caret { transform: rotate(-90deg); }
}