/* 链接默认样式 */
.product-link {
  /* 基础样式：清除默认下划线、设置文字颜色 */
  text-decoration: none;
  color: #333; /* 默认文字色 */
  display: inline-block; /* 确保padding/margin生效 */
  padding: 1px 1px; /* 增加点击区域，提升体验 */
  border-radius: 4px; /* 圆角，更美观 */
  transition: all 0.2s ease; /* 所有样式变化的过渡动画，0.2秒完成 */
}

/* 鼠标悬停样式 */
.product-link:hover {
  color: #1677ff; /* 蓝色文字（常用主题色） */
  background-color: #f5f7fa; /* 浅灰色背景 */
  text-decoration: underline; /* 下划线（可选） */
  transform: translateY(-1px); /* 轻微上移，增加动态感 */
}

/* 可选：鼠标点击时的按压效果 */
.product-link:active {
  transform: translateY(0); /* 恢复位置 */
  background-color: #e8f3ff; /* 更深一点的背景色 */
}

/* 链接默认样式 */
.link-with-underline {
  /* 基础样式：清除默认下划线、设置文字颜色 */
  text-decoration: underline;
  color: #333; /* 默认文字色 */
  display: inline-block; /* 确保padding/margin生效 */
  padding: 1px 1px; /* 增加点击区域，提升体验 */
  border-radius: 4px; /* 圆角，更美观 */
  transition: all 0.2s ease; /* 所有样式变化的过渡动画，0.2秒完成 */
}

/* 鼠标悬停样式 */
.link-with-underline:hover {
  color: #1677ff; /* 蓝色文字（常用主题色） */
  background-color: #f5f7fa; /* 浅灰色背景 */
  text-decoration: underline; /* 下划线（可选） */
  transform: translateY(-1px); /* 轻微上移，增加动态感 */
}

/* 可选：鼠标点击时的按压效果 */
.link-with-underline:active {
  transform: translateY(0); /* 恢复位置 */
  background-color: #e8f3ff; /* 更深一点的背景色 */
}

.shrink-0 .logo-img {
    /* 核心：宽高只控制一个，另一个auto保持比例，避免变形 */
    width: 100px; /* 直接设置宽度，高度自动适配 */
     /* 可选：如果要限制高度，先调整父容器高度，再设置 */
     /* height: 64px;  */
     /* width: auto; */

     /* 取消多余的max-height，避免冲突 */
     max-height: none;
     /* 确保图片比例不变 */
     object-fit: contain;
     /* 强制生效，覆盖其他样式 */
     !important;
}

.nav-item:hover {
   border-bottom-color: #007bff;
}

  /* 二级菜单项 - 确保三级菜单不会被截断 */
.second-menu-item {
    position: relative;
    overflow: visible !important; /* 防止三级菜单被截断 */
}


/* 三级菜单基础样式 - 修复语法错误 + 统一状态 */
.third-menu {
    position: absolute;
    left: 100%;
    top: 0;
    width: 56px;
    background-color: white !important; /* 修正语法：添加属性名 */
    border: 1px solid #e5e7eb !important; /* 修正语法：标准 border 写法 */
    border-radius: 0.5rem;
    box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.1), 0 2px 4px -1px rgba(0, 0, 0, 0.06);
    opacity: 0;
    visibility: hidden; /* 替换 hidden 属性，更易配合过渡动画 */
    pointer-events: none; /* 未激活时不可点击，避免遮挡 */
    transition: opacity 0.3s ease, visibility 0.3s ease, transform 0.3s ease;
    transform: translateX(8px); /* 添加入场动画 */
    z-index: 9999;
}

/* 核心：hover 二级菜单时显示三级菜单 */
.second-menu-item:hover .third-menu {
    opacity: 1 !important;
    visibility: visible !important; /* 显示菜单（替代 hidden） */
    pointer-events: auto !important; /* 恢复可点击 */
    transform: translateX(0); /* 动画归位 */
}

/* 优化：鼠标停留在三级菜单时也保持显示（防止快速移开消失） */
.second-menu-item:hover .third-menu:hover {
    opacity: 1 !important;
    visibility: visible !important;
}