/* ==================== 父级菜单激活状态方案 ==================== */
/* 当子菜单激活时，父级菜单的视觉反馈 */

/* ==================== 方案 1：左侧细指示条（推荐）==================== */

.sidebar--parent-variant-1 .sidebar__nav-link--parent-active {
  background: rgba(120, 119, 198, 0.04); /* 更浅的背景 */
  color: var(--text-primary, #ffffff);
}

.sidebar--parent-variant-1 .sidebar__nav-link--parent-active::before {
  opacity: 0.5; /* 半透明指示条 */
  transform: scaleY(1);
  box-shadow: none; /* 无发光效果 */
  width: 2px; /* 更细的指示条 */
}

.sidebar--parent-variant-1 .sidebar__nav-link--parent-active .sidebar__nav-icon {
  background: rgba(120, 119, 198, 0.1); /* 浅色块 */
  border-radius: 0.5rem; /* 圆角 */
  color: rgba(120, 119, 198, 0.8); /* 半透明紫色 */
}

.sidebar--parent-variant-1 .sidebar__nav-link--parent-active .sidebar__nav-text {
  font-weight: 500; /* 中等粗细 */
}

.sidebar--parent-variant-1 .sidebar__nav-link--parent-active .sidebar__nav-chevron {
  color: var(--glow-purple, #7877c6); /* 箭头高亮 */
}

/* ==================== 方案 2：仅图标高亮 ==================== */

.sidebar--parent-variant-2 .sidebar__nav-link--parent-active {
  background: transparent;
  color: var(--text-primary, #ffffff);
}

.sidebar--parent-variant-2 .sidebar__nav-link--parent-active::before {
  display: none;
}

.sidebar--parent-variant-2 .sidebar__nav-link--parent-active .sidebar__nav-icon {
  background: rgba(120, 119, 198, 0.12);
  border-radius: 0.5rem;
  color: rgba(120, 119, 198, 0.8);
}

.sidebar--parent-variant-2 .sidebar__nav-link--parent-active .sidebar__nav-text {
  font-weight: 500;
  color: var(--text-primary, #ffffff);
}

.sidebar--parent-variant-2 .sidebar__nav-link--parent-active .sidebar__nav-chevron {
  color: var(--glow-purple, #7877c6);
  transform: rotate(90deg); /* 旋转箭头表示展开 */
}

/* ==================== 方案 3：上边框高亮 ==================== */

.sidebar--parent-variant-3 .sidebar__nav-link--parent-active {
  background: rgba(120, 119, 198, 0.03);
  color: var(--text-primary, #ffffff);
  border-top: 2px solid rgba(120, 119, 198, 0.3);
  border-bottom: 2px solid rgba(120, 119, 198, 0.3);
}

.sidebar--parent-variant-3 .sidebar__nav-link--parent-active::before {
  display: none;
}

.sidebar--parent-variant-3 .sidebar__nav-link--parent-active .sidebar__nav-icon {
  background: rgba(120, 119, 198, 0.1);
  border-radius: 0.5rem;
  color: rgba(120, 119, 198, 0.7);
}

.sidebar--parent-variant-3 .sidebar__nav-link--parent-active .sidebar__nav-chevron {
  color: var(--glow-purple, #7877c6);
}

/* ==================== 方案 4：背景渐变 ==================== */

.sidebar--parent-variant-4 .sidebar__nav-link--parent-active {
  background: linear-gradient(
    90deg,
    rgba(120, 119, 198, 0.08) 0%,
    rgba(120, 119, 198, 0.02) 50%,
    transparent 100%
  );
  color: var(--text-primary, #ffffff);
}

.sidebar--parent-variant-4 .sidebar__nav-link--parent-active::before {
  opacity: 0.4;
  transform: scaleY(1);
  width: 2px;
}

.sidebar--parent-variant-4 .sidebar__nav-link--parent-active .sidebar__nav-icon {
  background: rgba(120, 119, 198, 0.12);
  border-radius: 0.5rem;
  color: rgba(120, 119, 198, 0.8);
}

.sidebar--parent-variant-4 .sidebar__nav-link--parent-active .sidebar__nav-chevron {
  color: var(--glow-purple, #7877c6);
}

/* ==================== 方案 5：呼吸效果 ==================== */

.sidebar--parent-variant-5 .sidebar__nav-link--parent-active {
  background: rgba(120, 119, 198, 0.05);
  color: var(--text-primary, #ffffff);
  position: relative;
}

.sidebar--parent-variant-5 .sidebar__nav-link--parent-active::before {
  opacity: 0.6;
  transform: scaleY(1);
  width: 2px;
  animation: parentPulse 2s ease-in-out infinite;
}

@keyframes parentPulse {
  0%, 100% {
    opacity: 0.4;
  }
  50% {
    opacity: 0.8;
  }
}

.sidebar--parent-variant-5 .sidebar__nav-link--parent-active .sidebar__nav-icon {
  background: rgba(120, 119, 198, 0.1);
  border-radius: 0.5rem;
  color: rgba(120, 119, 198, 0.8);
}

.sidebar--parent-variant-5 .sidebar__nav-link--parent-active .sidebar__nav-chevron {
  color: var(--glow-purple, #7877c6);
  animation: chevronPulse 2s ease-in-out infinite;
}

@keyframes chevronPulse {
  0%, 100% {
    opacity: 0.6;
  }
  50% {
    opacity: 1;
  }
}

/* ==================== 方案 6：连接线强调 ==================== */

.sidebar--parent-variant-6 .sidebar__nav-link--parent-active {
  background: rgba(120, 119, 198, 0.04);
  color: var(--text-primary, #ffffff);
}

.sidebar--parent-variant-6 .sidebar__nav-link--parent-active::before {
  display: none;
}

/* 加强子菜单连接线 */
.sidebar--parent-variant-6 .sidebar__nav-item--parent-active .sidebar__submenu-list::before {
  background: linear-gradient(
    180deg,
    var(--glow-purple, #7877c6) 0%,
    rgba(120, 119, 198, 0.5) 50%,
    rgba(120, 119, 198, 0.2) 100%
  );
  width: 2px;
}

.sidebar--parent-variant-6 .sidebar__nav-link--parent-active .sidebar__nav-icon {
  background: rgba(120, 119, 198, 0.1);
  border-radius: 0.5rem;
  color: rgba(120, 119, 198, 0.8);
}

.sidebar--parent-variant-6 .sidebar__nav-link--parent-active .sidebar__nav-chevron {
  color: var(--glow-purple, #7877c6);
}

/* ==================== 默认方案（无变体类时）==================== */
/* 使用方案1作为默认 */

.sidebar__nav-link--parent-active {
  background: rgba(120, 119, 198, 0.04);
  color: var(--text-primary, #ffffff);
}

.sidebar__nav-link--parent-active::before {
  opacity: 0.5;
  transform: scaleY(1);
  box-shadow: none;
  width: 2px;
}

.sidebar__nav-link--parent-active .sidebar__nav-icon {
  background: rgba(120, 119, 198, 0.1);
  border-radius: 0.5rem; /* 圆角 */
  color: rgba(120, 119, 198, 0.8); /* 半透明紫色 */
}

.sidebar__nav-link--parent-active .sidebar__nav-text {
  font-weight: 500;
}

.sidebar__nav-link--parent-active .sidebar__nav-chevron {
  color: var(--glow-purple, #7877c6);
}

/* ==================== 子菜单展开状态加强 ==================== */

/* 当父级激活且子菜单展开时，添加额外的视觉连接 */
.sidebar__nav-item--parent-active.sidebar__nav-item--open .sidebar__submenu {
  border-left: 2px solid rgba(120, 119, 198, 0.15);
}

/* 子菜单容器背景 */
.sidebar__nav-item--parent-active .sidebar__submenu {
  background: rgba(120, 119, 198, 0.02);
  border-radius: 0 0.5rem 0.5rem 0;
}

/* ==================== 收起状态适配 ==================== */

.sidebar--collapsed .sidebar__nav-link--parent-active {
  background: transparent;
}

.sidebar--collapsed .sidebar__nav-link--parent-active::before {
  display: none;
}

.sidebar--collapsed .sidebar__nav-link--parent-active .sidebar__nav-icon {
  background: rgba(120, 119, 198, 0.15);
  color: #ffffff; /* 图标变白色 */
}

/* ==================== 无障碍访问 ==================== */

@media (prefers-reduced-motion: reduce) {
  .sidebar--parent-variant-5 .sidebar__nav-link--parent-active::before,
  .sidebar--parent-variant-5 .sidebar__nav-link--parent-active .sidebar__nav-chevron {
    animation: none !important;
  }
}