/* =============================================
   /portal/assets/css/portal.nav.dropdown.css
   普通下拉菜单样式（从portal.nav.css抽离出来）
 ============================================== */ 
 
/* =================== PC 二级菜单（hover 下拉）（这是仅有二级菜单时的样式） =================== */

/* 包含子菜单的导航项 */
.portal-nav-item-with-children {
  position: relative;
  display: flex;
  align-items: center;
  height: var(--portal-nav-height);
}

/* 一级菜单（有子菜单）样式 */
.portal-nav-link.has-children {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  cursor: pointer;
}

/* 二级菜单容器（外层：悬浮感 + 箭头 + 动画，不滚动） */
.portal-submenu {
  position: absolute;
  top: 100%;
  left: 0;

  /* 悬浮感：毛玻璃 + 半透明背景 */
  background: rgba(255, 255, 255, 0.96);
  backdrop-filter: blur(12px);
  -webkit-backdrop-filter: blur(12px);

  border-radius: 12px;      /* ⭐ 圆角升级：从 8px → 12px */
  /*box-shadow: 0 8px 24px rgba(15, 23, 42, 0.08);   /* 注销，改成下面升级版 */
  box-shadow: 0 8px 24px rgba(0, 0, 0, 0.18);     /* ⭐ 阴影升级：与用户菜单一致 */
  z-index: 2000;

  /* 外层不能裁剪，否则箭头会被裁掉 */
  overflow: visible;

  /* 动画初始状态：隐藏 + 下移 + 不可点击 */
  opacity: 0;
  transform: translateY(6px);
  pointer-events: none;
  transition:
    opacity 0.22s ease,
    transform 0.22s cubic-bezier(0.33, 1, 0.68, 1);
}

/* hover 展开：淡入 + 上滑 + 可点击 */
.portal-nav-item-with-children:hover .portal-submenu {
  opacity: 1;
  transform: translateY(0);
  pointer-events: auto;
}

/* 内层：真正滚动的容器 */
.portal-submenu-inner {
  padding: 12px 0;      /* 上下内边距 *//* 二级菜单选中的hover容器距离（上下，左右）间距 */ /* ⭐ 原来是 padding: 4px 0; 现在改成 12px 0; */
  
  /* ⭐ 新增：控制宽度，不被内容撑开 */
  min-width: 180px;
  max-width: 220px;
  box-sizing: border-box;

  min-height: 120px;   /* ⭐ 最小高度（关键） */
  max-height: 260px;   /* ⭐ 超过这个高度就开始滚动 */
  overflow-y: auto;    /* ⭐ 只让内部滚动，不撑高弹窗（实测加了这行代码会导致下拉弹窗箭头被裁剪不显示） */
}

/* 二级菜单项 */
.portal-submenu-inner a {
  display: block;
  padding: 6px 14px;
  color: #111;

  /* ⭐ 修改：允许换行，避免撑宽 */
  white-space: normal;
  word-break: break-word;

  border-bottom: 1px solid #d1d5db;
}

/* 第一个二级菜单顶部也加分割线 */
.portal-submenu-inner a:first-child {
  border-top: 1px solid #d1d5db;
}

/* hover 样式 */
.portal-submenu-inner a:hover {
  background: var(--portal-nav-hover);
  color: var(--portal-nav-hover-text);
}

/* 普通下拉菜单顶部箭头（指向一级菜单） */
.portal-submenu::before {
  content: "";
  position: absolute;
  top: -6px;              /* 箭头在弹窗上方 6px */
  left: 20px;             /* 水平位置可微调 */

  width: 0;
  height: 0;

  border-left: 6px solid transparent;
  border-right: 6px solid transparent;
  border-bottom: 6px solid rgba(255, 255, 255, 0.96);

  backdrop-filter: blur(12px);
  -webkit-backdrop-filter: blur(12px);

  z-index: 2100;
}

/* ============================
   普通下拉菜单滚动条美化（阿里云风格）
   ============================ */

/* Chrome / Edge / Safari */
.portal-submenu-inner::-webkit-scrollbar {
  width: 6px;   /* 细滚动条 */
}

.portal-submenu-inner::-webkit-scrollbar-thumb {
  background: rgba(0, 0, 0, 0.25);  /* 半透明深灰 */
  border-radius: 999px;             /* 圆角 */
}

.portal-submenu-inner::-webkit-scrollbar-track {
  background: transparent;          /* 轨道透明 */
}

/* Firefox */
.portal-submenu-inner {
  scrollbar-width: thin;                            /* 细滚动条 */
  scrollbar-color: rgba(0,0,0,0.25) transparent;    /* 颜色 */
}

/* =========================== PC端二级菜单（hover 普通下拉样式）---结束--- =========================== */