/* 侧边栏自定义样式 - 现代简约风格 */

/* 侧边栏基础样式 */
body .vertical-menu,
body[data-sidebar="light"] .vertical-menu,
html body .vertical-menu,
html body[data-sidebar="light"] .vertical-menu {
  background-color: #f8f9fa !important;
  border-right: 1px solid #e9ecef !important;
  box-shadow: 0 0 15px rgba(0, 0, 0, 0.03) !important;
}

/* 菜单容器样式 */
body #sidebar-menu,
body[data-sidebar="light"] #sidebar-menu,
html body #sidebar-menu,
html body[data-sidebar="light"] #sidebar-menu {
  background-color: #f8f9fa !important;
  padding: 10px !important;
}

/* 菜单项基础样式 */
body #sidebar-menu ul li a,
body[data-sidebar="light"] #sidebar-menu ul li a,
html body #sidebar-menu ul li a,
html body[data-sidebar="light"] #sidebar-menu ul li a {
  color: #495057 !important;
  font-weight: 500 !important;
  padding: 12px 15px !important;
  border-radius: 8px !important;
  margin-bottom: 3px !important;
  transition: all 0.3s ease !important;
}

/* 菜单项图标样式 */
body #sidebar-menu ul li a i,
body[data-sidebar="light"] #sidebar-menu ul li a i,
html body #sidebar-menu ul li a i,
html body[data-sidebar="light"] #sidebar-menu ul li a i {
  color: #6c757d !important;
  font-size: 18px !important;
  margin-right: 10px !important;
  transition: all 0.3s ease !important;
}

/* 鼠标悬停效果 */
body #sidebar-menu ul li a:hover,
body[data-sidebar="light"] #sidebar-menu ul li a:hover,
html body #sidebar-menu ul li a:hover,
html body[data-sidebar="light"] #sidebar-menu ul li a:hover {
  color: #007bff !important;
  background-color: rgba(0, 123, 255, 0.08) !important;
  transform: translateX(3px) !important;
}

body #sidebar-menu ul li a:hover i,
body[data-sidebar="light"] #sidebar-menu ul li a:hover i,
html body #sidebar-menu ul li a:hover i,
html body[data-sidebar="light"] #sidebar-menu ul li a:hover i {
  color: #007bff !important;
}

/* 活动菜单项样式 */
body #sidebar-menu ul li.mm-active > a,
body[data-sidebar="light"] #sidebar-menu ul li.mm-active > a,
html body #sidebar-menu ul li.mm-active > a,
html body[data-sidebar="light"] #sidebar-menu ul li.mm-active > a {
  color: #007bff !important;
  background-color: rgba(0, 123, 255, 0.12) !important;
  font-weight: 600 !important;
  box-shadow: 0 2px 6px rgba(0, 123, 255, 0.15) !important;
}

body #sidebar-menu ul li.mm-active > a i,
body[data-sidebar="light"] #sidebar-menu ul li.mm-active > a i,
html body #sidebar-menu ul li.mm-active > a i,
html body[data-sidebar="light"] #sidebar-menu ul li.mm-active > a i {
  color: #007bff !important;
}

/* 子菜单容器样式 */
body #sidebar-menu ul .sub-menu,
body[data-sidebar="light"] #sidebar-menu ul .sub-menu,
html body #sidebar-menu ul .sub-menu,
html body[data-sidebar="light"] #sidebar-menu ul .sub-menu {
  background-color: transparent !important;
  padding-left: 30px !important;
  margin-top: 3px !important;
}

/* 子菜单项样式 */
body #sidebar-menu ul .sub-menu li a,
body[data-sidebar="light"] #sidebar-menu ul .sub-menu li a,
html body #sidebar-menu ul .sub-menu li a,
html body[data-sidebar="light"] #sidebar-menu ul .sub-menu li a {
  color: #6c757d !important;
  font-weight: 400 !important;
  padding: 8px 15px !important;
  font-size: 0.9rem !important;
  border-radius: 6px !important;
}

/* 子菜单项悬停效果 */
body #sidebar-menu ul .sub-menu li a:hover,
body[data-sidebar="light"] #sidebar-menu ul .sub-menu li a:hover,
html body #sidebar-menu ul .sub-menu li a:hover,
html body[data-sidebar="light"] #sidebar-menu ul .sub-menu li a:hover {
  color: #007bff !important;
  background-color: rgba(0, 123, 255, 0.05) !important;
}

/* 子菜单活动项样式 */
body #sidebar-menu ul .sub-menu li.mm-active > a,
body[data-sidebar="light"] #sidebar-menu ul .sub-menu li.mm-active > a,
html body #sidebar-menu ul .sub-menu li.mm-active > a,
html body[data-sidebar="light"] #sidebar-menu ul .sub-menu li.mm-active > a {
  color: #007bff !important;
  background-color: rgba(0, 123, 255, 0.08) !important;
  font-weight: 500 !important;
}

/* 菜单箭头样式 */
body .metismenu .has-arrow:after,
body[data-sidebar="light"] .metismenu .has-arrow:after,
html body .metismenu .has-arrow:after,
html body[data-sidebar="light"] .metismenu .has-arrow:after {
  border-color: #adb5bd !important;
  width: 0.5em !important;
  height: 0.5em !important;
  right: 1.5em !important;
  transition: all 0.3s ease !important;
}

/* 活动菜单箭头样式 */
body .metismenu .mm-active > .has-arrow:after,
body[data-sidebar="light"] .metismenu .mm-active > .has-arrow:after,
html body .metismenu .mm-active > .has-arrow:after,
html body[data-sidebar="light"] .metismenu .mm-active > .has-arrow:after {
  border-color: #007bff !important;
  transform: rotate(-135deg) translateY(-50%) !important;
}

/* 滚动条样式 */
body .simplebar-scrollbar:before,
body[data-sidebar="light"] .simplebar-scrollbar:before,
html body .simplebar-scrollbar:before,
html body[data-sidebar="light"] .simplebar-scrollbar:before {
  background-color: rgba(0, 123, 255, 0.3) !important;
  border-radius: 10px !important;
}

/* 菜单标签样式 */
body #sidebar-menu ul li a span.badge,
body[data-sidebar="light"] #sidebar-menu ul li a span.badge,
html body #sidebar-menu ul li a span.badge,
html body[data-sidebar="light"] #sidebar-menu ul li a span.badge {
  background-color: #007bff !important;
  color: #ffffff !important;
  padding: 4px 8px !important;
  font-size: 0.7rem !important;
  border-radius: 30px !important;
  margin-left: 5px !important;
  box-shadow: 0 2px 4px rgba(0, 123, 255, 0.2) !important;
}

/* 移动端菜单按钮颜色 */
body .vertical-menu-btn,
body[data-sidebar="light"] .vertical-menu-btn,
html body .vertical-menu-btn,
html body[data-sidebar="light"] .vertical-menu-btn {
  color: #495057 !important;
}