/* 侧边栏（抽屉本体） */
.sidebar {
  position: fixed;
  top: 0;
  left: 0;
  width: 220px; /* 和你主内容区的 margin-left 一致 */
  height: 100vh;
  background: #f0fff0; /* 你页面的浅绿背景色 */
  transform: translateX(-100%); /* 默认隐藏 */
  transition: transform 0.3s ease;
  z-index: 99;
  padding: 20px 0;
}

/* 打开状态：抽屉滑出 */
.sidebar.open {
  transform: translateX(0);
}

/* 主内容区：默认状态 */
.main-content {
  margin-left: 0;
  padding: 1px 16px;
  transition: margin-left 0.3s ease;
}

/* 抽屉打开时，主内容区被推开 */
.main-content.pushed {
  margin-left: 220px;
}

/* 手机适配 */
@media (max-width: 768px) {
  .sidebar {
    width: 100%;
  }
  .main-content.pushed {
    margin-left: 0; /* 手机不推开，直接全屏覆盖 */
  }
}

/* 开关按钮 */
.toggle-btn {
  position: fixed;
  top: 10px;
  left: 10px;
  z-index: 100;
  padding: 8px 12px;
  background: #fff;
  border: 1px solid #ccc;
  border-radius: 4px;
  cursor: pointer;
}