/* ============ 首页透明菜单样式修复 ============ */

/**
 * 修复两个问题（借鉴 finalshell 主题 header-transparent-fix.css）：
 * 1. 透明菜单初始状态文字为白色，与白色背景模块重叠导致看不清 → 改为深色文字
 * 2. 滚动后 .navbar-now 状态菜单被隐藏 → 强制悬浮显示（固定顶部 + 白色背景 + 深色文字）
 *
 * 滚动状态说明（由 JS 滚动事件控制）：
 * - 初始状态：body 有 .header-transparent，无 navbar-now / navbar-sticky
 * - 向下滚动：添加 .navbar-now
 * - 向上滚动：添加 .navbar-sticky
 * - 滚回顶部：移除两个状态类
 */

/* ============ 全局导航显示修复（所有页面，解决滚动后菜单消失） ============ */
/* navbar-now（向下滚动）与 navbar-sticky（向上滚动）状态强制悬浮显示 */
.site-header.navbar-now,
.site-header.navbar-sticky {
    position: fixed !important;
    top: 0 !important;
    left: 0 !important;
    right: 0 !important;
    z-index: 1000 !important;
    background-color: #ffffff !important;
    box-shadow: 0 2px 12px rgba(43, 39, 27, 0.08) !important;
    transform: translateY(0) !important;
    opacity: 1 !important;
    visibility: visible !important;
    display: block !important;
}

/* 滚动状态下文字保持深色 */
.site-header.navbar-now .navbar .nav-list > .menu-item > a,
.site-header.navbar-now .navbar .actions .action-btn,
.site-header.navbar-now .navbar .actions .action-btn i,
.site-header.navbar-now .navbar .burger i,
.site-header.navbar-sticky .navbar .nav-list > .menu-item > a,
.site-header.navbar-sticky .navbar .actions .action-btn,
.site-header.navbar-sticky .navbar .actions .action-btn i,
.site-header.navbar-sticky .navbar .burger i {
    color: #2b271b !important;
}

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

.header-transparent .site-header:not(.navbar-now):not(.navbar-sticky) .navbar .actions .action-btn .badge {
    color: #6b6353 !important;
}

/* 语言切换下拉框颜色 */
.header-transparent .site-header:not(.navbar-now):not(.navbar-sticky) .navbar .actions .translateSelectLanguage {
    color: #2b271b !important;
    background-color: transparent !important;
}

/* 菜单与图标 hover：金色（浅金背景 + 金色文字） */
.header-transparent .site-header:not(.navbar-now):not(.navbar-sticky) .navbar .nav-list > .menu-item > a:hover,
.header-transparent .site-header:not(.navbar-now):not(.navbar-sticky) .navbar .nav-list > .menu-item.current-menu-item > a,
.header-transparent .site-header:not(.navbar-now):not(.navbar-sticky) .navbar .actions .action-btn:hover {
    color: #d9a815 !important;
}

.header-transparent .site-header:not(.navbar-now):not(.navbar-sticky) .navbar .actions .action-btn:hover {
    background-color: rgba(245, 193, 46, 0.12) !important;
}

/* 初始状态菜单背景保持透明，可正常看到下方模块 */
.header-transparent .site-header:not(.navbar-now):not(.navbar-sticky) {
    background: transparent !important;
    background-color: transparent !important;
    box-shadow: none !important;
}

/* ============ 滚动后 navbar-now 状态：强制悬浮显示 + 白色背景 + 深色文字 ============ */
.header-transparent .site-header.navbar-now {
    position: fixed !important;
    top: 0 !important;
    left: 0 !important;
    right: 0 !important;
    z-index: 1000 !important;
    background: #ffffff !important;
    background-color: #ffffff !important;
    box-shadow: 0 2px 12px rgba(43, 39, 27, 0.08) !important;
    transform: translateY(0) !important;
    opacity: 1 !important;
    visibility: visible !important;
    display: block !important;
    animation: htm-header-slide-down 0.3s ease !important;
}

@keyframes htm-header-slide-down {
    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 .actions .action-btn i,
.header-transparent .site-header.navbar-now .navbar .action-hover-menu .avatar-warp,
.header-transparent .site-header.navbar-now .navbar .burger i {
    color: #2b271b !important;
}

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

.header-transparent .site-header.navbar-now .navbar .actions .action-btn:hover {
    background-color: rgba(245, 193, 46, 0.12) !important;
}

/* ============ 向上滚动 navbar-sticky 状态：固定显示 + 白色背景 + 深色文字 ============ */
.header-transparent .site-header.navbar-sticky {
    position: fixed !important;
    top: 0 !important;
    left: 0 !important;
    right: 0 !important;
    z-index: 1000 !important;
    background: #ffffff !important;
    background-color: #ffffff !important;
    box-shadow: 0 2px 12px rgba(43, 39, 27, 0.08) !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 .actions .action-btn i,
.header-transparent .site-header.navbar-sticky .navbar .action-hover-menu .avatar-warp,
.header-transparent .site-header.navbar-sticky .navbar .burger i {
    color: #2b271b !important;
}

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

.header-transparent .site-header.navbar-sticky .navbar .actions .action-btn:hover {
    background-color: rgba(245, 193, 46, 0.12) !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: #2b271b !important;
}

.header-transparent .site-header .navbar .menu-dropdown li a:hover,
.header-transparent .site-header .navbar .sub-menu li a:hover {
    color: #d9a815 !important;
    background-color: rgba(245, 193, 46, 0.12) !important;
}

/* ============ 站内搜索下拉框：白色背景 ============ */
.header-transparent .site-header .navbar-search {
    background: #ffffff !important;
    background-color: #ffffff !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: #2b271b !important;
    }

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

/* ============ 防止被原主题的 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;
    }
}