/* ============================================================================
 * 左侧菜单统一规范 · menu-kit.css          （v643，2026-09-23 定稿）
 * ----------------------------------------------------------------------------
 * 【基准】以下数值全部来自 Vue 原生菜单（Element Plus）的真实计算样式实测，
 *         不是拍脑袋定的。原生菜单本身不动，它是唯一基准。
 *
 *   位置        字号    字重    padding-left   行高/最小高   颜色
 *   顶级项      19px    400     20px           56px         rgba(184,199,206) / 选中 #fff
 *   子项        19px    400     40px           50px         rgba(184,199,206) / 选中 #fff
 *   分组标题    19px    400     20px           56px         rgba(255,255,255,.92)
 *
 * 【为什么用 !important】
 *   各注入脚本（tech-menu.js / ymdd-menu.js / merchant-menu.js / mch-admin-entry.js）
 *   是用行内 style 写样式的，外链 CSS 正常情况下盖不过行内样式，所以这里必须 !important。
 *
 * 【以后新增模块怎么做】
 *   1) 菜单项加 class：分组标题用 .mk-title，普通行用 .mk-row，文字用 .mk-name，右侧小字用 .mk-num
 *   2) 或者直接调 menu-kit.js 暴露的 window.MenuKit.addGroup({...})，它会把类名和 DOM 结构都摆好
 *   3) 不要再自己写 font-size / padding / line-height —— 交给本文件统管
 * ========================================================================== */

/* ---------- 分组标题（「壹秒到家」「技术组考勤」「商家资料库」这种）---------- */
.tech-group-title,
.ymdd-group-title,
.mch-group-title,
.mk-title {
  font-size: 19px !important;
  font-weight: 400 !important;
  line-height: 56px !important;
  min-height: 56px !important;
  padding: 0 12px 0 20px !important;
  color: rgba(255, 255, 255, .92) !important;
  display: flex !important;
  align-items: center !important;
  box-sizing: border-box !important;
}
.tech-group-title:hover,
.ymdd-group-title:hover,
.mch-group-title:hover,
.mk-title:hover {
  color: #fff !important;
  background: rgba(255, 255, 255, .10) !important;
}

/* ---------- 菜单行（注入的叶子项 / 可点击行）---------- */
.tech-row,
.ymdd-row,
.mch-row,
.mk-row {
  font-size: 19px !important;
  font-weight: 400 !important;
  line-height: 50px !important;
  min-height: 50px !important;
  padding: 0 12px 0 40px !important;
  color: rgba(184, 199, 206) !important;
  display: flex !important;
  align-items: center !important;
  box-sizing: border-box !important;
}
.tech-row:hover,
.ymdd-row:hover,
.mch-row:hover,
.mk-row:hover {
  color: #fff !important;
  background: rgba(255, 255, 255, .10) !important;
}

/* 文字与数字：继承行上的字号/颜色，避免各脚本各写一套 */
.tech-row  .tech-name, .ymdd-row .ymdd-name, .mch-row .mch-name,
.mk-row .mk-name {
  font-size: inherit !important;
  font-weight: inherit !important;
  line-height: inherit !important;
  color: inherit !important;
}
.mch-num, .mk-num {
  font-size: 13px !important;
  color: inherit !important;
  opacity: .55 !important;
}

/* 分组标题里的图标：与原生顶级项的图标位对齐（原生图标区约 20px 宽） */
.tech-group-title .tech-ico,
.ymdd-group-title .ymdd-ico,
.mch-group-title .mch-ico,
.mk-title .mk-ico {
  width: 20px !important;
  height: 20px !important;
  flex: 0 0 20px !important;
  margin-right: 8px !important;
  opacity: .95 !important;
}

/* 行内的小方块/小圆点（地区树的层级符号）：与 40px 缩进对齐 */
.mch-sq, .mch-dot, .mk-sq, .mk-dot {
  margin-left: 0 !important;
  margin-right: 10px !important;
  opacity: .5 !important;
}

/* 展开箭头 */
.tech-caret, .ymdd-caret, .mch-caret, .mk-caret {
  margin-left: auto !important;
  font-size: 11px !important;
  opacity: .75 !important;
}

/* ---------- 「管理」这类小徽章：不要抢文字的位置，也别把行撑高 ---------- */
.mch-admin-badge,
.mk-badge {
  flex: 0 0 auto !important;
  margin: 0 8px 0 0 !important;
  padding: 2px 6px !important;
  border-radius: 3px !important;
  font-size: 11px !important;
  line-height: 16px !important;
  font-weight: 400 !important;
  background: rgba(255, 255, 255, .18) !important;
  color: #fff !important;
  opacity: .9 !important;
}

/* 分类行（水果店/商超这种）加粗一点点，但不要比原生更粗 */
.mch-cat > .mch-row,
.mk-cat > .mk-row {
  font-weight: 500 !important;
}

/* ==================== v645：菜单归位后的缩进对齐 ==================== */
/* 被移进「常规管理」的两个叶子项 / 「渠道经理专用」分组里的子项：
   统一按「子项」缩进（40px），字号与其它子项一致（19px/400）。
   ⚠️ 必须放在 menu-kit.css 里，靠 !important 盖过 Element 的顶级项内边距。 */
.el-menu--inline > li.mk-moved,
.el-menu--inline > li.mk-moved > div,
ul.mk-inline > li.mk-moved {
  padding-left: 40px !important;
  font-size: 19px !important;
  font-weight: 400 !important;
  line-height: 50px !important;
  min-height: 50px !important;
  color: rgba(184, 199, 206) !important;
  box-sizing: border-box !important;
}
.el-menu--inline > li.mk-moved:hover,
ul.mk-inline > li.mk-moved:hover {
  color: #fff !important;
  background: rgba(255, 255, 255, .10) !important;
}
/* 新建的「渠道经理专用」分组标题：与「常规管理」这种原生分组标题完全一致 */
li.mk-sub > .mk-sub-title {
  font-size: 19px !important;
  font-weight: 400 !important;
  line-height: 56px !important;
  min-height: 56px !important;
  padding: 0 12px 0 20px !important;
  color: rgba(255, 255, 255, .92) !important;
  display: flex !important;
  align-items: center !important;
  cursor: pointer;
  box-sizing: border-box !important;
}
li.mk-sub > .mk-sub-title:hover {
  color: #fff !important;
  background: rgba(255, 255, 255, .10) !important;
}