/* ============================================================================
   左侧菜单 · 收起 / 展开
   站点：car.lxzz1024.top（玛纳斯养护所车辆管理系统）
   配套：js/sidebar-toggle.js（创建按钮 + 状态记忆）
   部署：由 ops/inject_sidebar.py 注入，--off 可一键移除（只删 2 行引用，不动业务代码）

   原理：
     · 侧边栏 .sidebar 是 position:fixed（宽 --sidebar-w），主体 .main 用 margin-left 让位
     · 收起时给 <body> 加 .sidebar-collapsed：
         .sidebar → transform: translateX(-100%) 移出屏幕（不占布局空间）
         .main    → margin-left: 0，内容铺满整屏
     · 按钮动态插到顶栏 .header-left 最前面（汉堡图标，RemixIcon）
   ========================================================================== */

/* --- 1. 顶栏左侧容器改为 flex，让按钮和标题并排 --- */
body .header-left {
  display: flex;
  align-items: center;
  gap: 14px;
}

/* --- 2. 切换按钮 --- */
.sidebar-toggle {
  flex: 0 0 auto;
  width: 34px;
  height: 34px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 0;
  border-radius: 10px;
  cursor: pointer;
  font-size: 18px;
  line-height: 1;
  color: var(--primary-light, #a5f3fc);
  background: rgba(10, 16, 34, 0.92);
  border: 1px solid rgba(34, 211, 238, 0.35);
  box-shadow: 0 6px 20px rgba(2, 6, 18, 0.55);
  -webkit-backdrop-filter: blur(12px);
          backdrop-filter: blur(12px);
  transition: background .2s ease, box-shadow .2s ease, color .2s ease, transform .15s ease;
}
.sidebar-toggle:hover {
  background: rgba(34, 211, 238, 0.18);
  color: #fff;
  box-shadow: 0 0 18px rgba(34, 211, 238, 0.45);
}
.sidebar-toggle:active { transform: scale(0.94); }
.sidebar-toggle:focus-visible { outline: 2px solid rgba(34, 211, 238, 0.6); outline-offset: 2px; }

/* --- 3. 收起 / 展开过渡 ---
   visibility 也纳入过渡：收起时等滑出动画结束后才真正隐藏（否则动画一开内容就没了） */
.sidebar {
  transition: transform .28s cubic-bezier(.4, 0, .2, 1),
              visibility .28s cubic-bezier(.4, 0, .2, 1);
}
.main { transition: margin-left .28s cubic-bezier(.4, 0, .2, 1); }

body.sidebar-collapsed .sidebar {
  transform: translateX(-100%);
  visibility: hidden;      /* 收起后不可点、Tab 也进不去 */
  pointer-events: none;
}
body.sidebar-collapsed .main { margin-left: 0; }

/* --- 4. 尊重「减少动效」偏好 --- */
@media (prefers-reduced-motion: reduce) {
  .sidebar,
  .main,
  .sidebar-toggle { transition: none; }
}