/* BODHI Dashboard · css/nav.css · 侧栏 nav link + 顶栏系列分段切换
   ⚠ 层叠顺序 = index.html 里 <link> 的先后，别随手调换。*/

/* nav link active */
.nav-link {
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 6px 10px;
  border-radius: 6px;
  color: rgb(87 83 78);
  cursor: pointer;
}
.nav-link:hover { background: rgb(245 245 244); color: rgb(28 25 23); }
.dark .nav-link { color: rgb(168 162 158); }
.dark .nav-link:hover { background: rgb(41 37 36); color: rgb(231 229 228); }
.nav-link.active {
  background: linear-gradient(135deg, #b08642, #8a6730);
  color: #fdfaf4;
  box-shadow: 0 2px 8px rgb(138 103 48 / 0.35);
}
.dark .nav-link.active {
  background: linear-gradient(135deg, #c9a36b, #8a6730);
  color: #1c1917;
  box-shadow: 0 2px 8px rgb(0 0 0 / 0.4);
}
/* 激活态底已是金铜色，金色图标看不清 → 反白/反黑 */
.nav-link.active .nav-icon { filter: brightness(0) invert(1); opacity: 1; }
.dark .nav-link.active .nav-icon { filter: brightness(0); opacity: .85; }

/* 顶栏系列分段切换（佛经故事 / 电影） */
.series-seg {
  display: inline-flex;
  padding: 2px;
  border-radius: 8px;
  background: rgb(245 245 244);
  border: 1px solid rgb(231 229 228);
}
.dark .series-seg { background: rgb(41 37 36); border-color: rgb(68 64 60); }
.series-seg-btn {
  padding: 4px 12px;
  border-radius: 6px;
  font-size: 13px;
  line-height: 1.4;
  color: rgb(120 113 108);
  white-space: nowrap;
  cursor: pointer;
  transition: color .12s, background .12s;
}
.series-seg-btn:hover { color: rgb(28 25 23); }
.dark .series-seg-btn { color: rgb(168 162 158); }
.dark .series-seg-btn:hover { color: rgb(231 229 228); }
.series-seg-btn.active {
  background: linear-gradient(135deg, #b08642, #8a6730);
  color: #fdfaf4;
  box-shadow: 0 1px 3px rgb(138 103 48 / 0.35);
}
.dark .series-seg-btn.active { background: linear-gradient(135deg, #c9a36b, #8a6730); color: #1c1917; }
.series-seg-btn.active .series-seg-icon { filter: brightness(0) invert(1); opacity: 1; }
.dark .series-seg-btn.active .series-seg-icon { filter: brightness(0); opacity: .85; }

/* ── 侧边栏收起（body.sidebar-collapsed；状态存 localStorage，见 main.js setSidebarCollapsed）──
   收成 52px 图标条而非整条藏起：导航仍可点，主区多出 172px。
   选择器带 body + #sidebar，特异性高过 tailwind CDN 的 .w-56（CDN <style> 注在 css/ 之后）。*/
#sidebar { transition: width .15s ease; }
body.sidebar-collapsed #sidebar { width: 3.25rem; }
body.sidebar-collapsed .sidebar-brand { display: none; }
body.sidebar-collapsed .sidebar-head {
  flex-direction: column;
  padding: .5rem .25rem;
  gap: .375rem;
}
body.sidebar-collapsed .sidebar-head img { width: 1.75rem; height: 1.75rem; }
body.sidebar-collapsed #nav { padding: .5rem .25rem; }
body.sidebar-collapsed .nav-link { justify-content: center; padding: 8px 0; }
body.sidebar-collapsed .nav-link .nav-label { display: none; }
body.sidebar-collapsed .sidebar-foot { flex-direction: column; padding: .5rem .25rem; gap: .5rem; }
body.sidebar-collapsed .sidebar-foot #rw-badge { display: none; }
body.sidebar-collapsed .sidebar-foot > div { flex-direction: column; gap: .5rem; }
body.sidebar-collapsed .sidebar-foot #refresh-state { display: none; }
/* 搜索结果面板原按 w-56 侧栏定位（left-60），收起后跟着左移 */
body.sidebar-collapsed #search-results { left: 4.5rem; }

/* 品牌图标（切自 assets/branding/logo-sheet）：nav + 系列分段 */
.nav-link .nav-icon { opacity: .72; transition: opacity .12s; }
.nav-link:hover .nav-icon, .nav-link.active .nav-icon { opacity: 1; }
/* 深色选中态底是白色，金铜图标直接可见；浅色选中态底是深色，同理——无需反色 */
.series-seg-btn { display: inline-flex; align-items: center; gap: 5px; }
.series-seg-icon { width: 14px; height: 14px; opacity: .8; }