/* ============ 首页透明菜单样式覆盖 ============ */

/**
 * 透明菜单状态说明（由 JS 滚动事件控制）：
 * - 初始状态：仅有 .header-transparent，无 navbar-now / navbar-sticky
 * - 向下滚动（超过 header 高度）：添加 .navbar-now（白色文字 + 隐藏）
 * - 向上滚动：添加 .navbar-sticky（固定显示 + 深色文字 + 白色背景）
 * - 滚回顶部：移除 .navbar-sticky
 */

/* ============ 初始透明状态：深色文字（适配浅色背景） ============ */
.header-transparent .site-header:not(.navbar-sticky) .navbar .nav-list > .menu-item > a,
.header-transparent .site-header:not(.navbar-sticky) .navbar .actions .action-btn,
.header-transparent .site-header:not(.navbar-sticky) .navbar .action-hover-menu .avatar-warp {
    color: #505357 !important;
}

.header-transparent .site-header:not(.navbar-sticky) .navbar .nav-list > .menu-item > a:hover,
.header-transparent .site-header:not(.navbar-sticky) .navbar .actions .action-btn:hover {
    color: #6c5ce7 !important;
}

/* Logo 保持原样 */

/* 顶部图标 hover */
.header-transparent .site-header:not(.navbar-sticky) .navbar .actions .action-btn:hover {
    background-color: rgba(108, 92, 231, 0.08) !important;
}

/* 汉堡菜单图标颜色 */
.header-transparent .site-header:not(.navbar-sticky) .burger span,
.header-transparent .site-header:not(.navbar-sticky) .menu-toggler span {
    background-color: #505357 !important;
}

/* ============ 滚动后 navbar-now 状态：保持显示 + 深色文字 ============ */
/* 你提到的问题：navbar-now 状态下顶部菜单不显示 */
.header-transparent .site-header.navbar-now {
    position: fixed !important;
    top: 0;
    left: 0;
    right: 0;
    z-index: 1000;
    background-color: #ffffff !important;
    background: #ffffff !important;
    box-shadow: 0 2px 12px rgba(0, 0, 0, 0.06) !important;
    transform: translateY(0) !important;
    opacity: 1 !important;
    visibility: visible !important;
    display: block !important;
    animation: slideDown 0.3s ease !important;
}

@keyframes slideDown {
    from { transform: translateY(-100%); }
    to { transform: translateY(0); }
}

/* navbar-now 状态下文字保持深色 */
.header-transparent .site-header.navbar-now .navbar .nav-list > .menu-item > a,
.header-transparent .site-header.navbar-now .navbar .actions .action-btn,
.header-transparent .site-header.navbar-now .navbar .action-hover-menu .avatar-warp {
    color: #505357 !important;
}

.header-transparent .site-header.navbar-now .navbar .nav-list > .menu-item > a:hover,
.header-transparent .site-header.navbar-now .navbar .actions .action-btn:hover {
    color: #6c5ce7 !important;
}

/* ============ 向上滚动 navbar-sticky 状态：固定显示 + 白色背景 + 深色文字 ============ */
.header-transparent .site-header.navbar-sticky {
    position: fixed !important;
    top: 0;
    left: 0;
    right: 0;
    z-index: 1000;
    background-color: #ffffff !important;
    background: #ffffff !important;
    box-shadow: 0 2px 12px rgba(0, 0, 0, 0.06) !important;
    transform: translateY(0) !important;
    opacity: 1 !important;
    visibility: visible !important;
    display: block !important;
}

.header-transparent .site-header.navbar-sticky .navbar .nav-list > .menu-item > a,
.header-transparent .site-header.navbar-sticky .navbar .actions .action-btn,
.header-transparent .site-header.navbar-sticky .navbar .action-hover-menu .avatar-warp {
    color: #505357 !important;
}

.header-transparent .site-header.navbar-sticky .navbar .nav-list > .menu-item > a:hover,
.header-transparent .site-header.navbar-sticky .navbar .actions .action-btn:hover {
    color: #6c5ce7 !important;
}

/* ============ 子菜单统一保持白色背景 + 深色文字 ============ */
.header-transparent .site-header .navbar .menu-dropdown,
.header-transparent .site-header .navbar .sub-menu {
    background-color: #ffffff !important;
}

.header-transparent .site-header .navbar .menu-dropdown li a,
.header-transparent .site-header .navbar .sub-menu li a {
    color: #4a4a62 !important;
}

.header-transparent .site-header .navbar .menu-dropdown li a:hover,
.header-transparent .site-header .navbar .sub-menu li a:hover {
    color: #6c5ce7 !important;
    background-color: rgba(108, 92, 231, 0.08) !important;
}

/* ============ 移动端 ============ */
@media (max-width: 992px) {
    /* 移动端菜单展开时使用白色背景 */
    .header-transparent .site-header .navbar-collapse,
    .header-transparent .site-header .main-nav,
    .header-transparent .site-header .slicknav_nav {
        background-color: #ffffff !important;
    }

    .header-transparent .site-header .navbar .nav-list > .menu-item > a {
        color: #4a4a62 !important;
    }

    /* 移动端固定显示菜单 */
    .header-transparent .site-header.navbar-now,
    .header-transparent .site-header.navbar-sticky {
        position: fixed !important;
        top: 0;
        left: 0;
        right: 0;
        z-index: 1000;
    }
}

/* ============ 防止被原主题的 transform 隐藏 ============ */
.header-transparent .site-header.navbar-now,
.header-transparent .site-header.navbar-sticky {
    transform: translateY(0) !important;
}

/* ============ 无障碍 ============ */
@media (prefers-reduced-motion: reduce) {
    .header-transparent .site-header.navbar-now {
        animation: none !important;
    }
}
