/* 自定义导航栏样式 */
header {
    position: relative;
    z-index: 1000;
}

/* 首页导航栏初始状态 */
body.page-home header {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    z-index: 1000;
}

body.page-home header .header-content {
    background-color: transparent !important;
    border-bottom: none !important;
    padding: 1.5rem 0;
    transition: all 0.3s ease;
}

body.page-home header .header-content .logo img {
    filter: brightness(0) invert(1);
    transition: filter 0.3s ease;
}

body.page-home header .header-content .nav-link {
    color: white !important;
    transition: color 0.3s ease;
}

body.page-home header .header-content .nav-link img {
    filter: brightness(0) invert(1);
    transition: filter 0.3s ease;
}

/* 首页导航栏悬停状态 */
body.page-home header .header-content:hover {
    background-color: white !important;
}

body.page-home header .header-content:hover .logo img {
    filter: none;
}

body.page-home header .header-content:hover .nav-link {
    color: black !important;
}

body.page-home header .header-content:hover .nav-link img {
    filter: none;
}

/* 首页导航栏滚动状态 */
body.page-home header .header-content.scrolled {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    background-color: white !important;
    box-shadow: 0 2px 10px rgba(0, 0, 0, 0.1);
    padding: 0.4rem 0;
}

body.page-home header .header-content.scrolled .logo img {
    filter: none;
}

body.page-home header .header-content.scrolled .nav-link {
    color: black !important;
}

body.page-home header .header-content.scrolled .nav-link img {
    filter: none;
}

/* 其他页面导航栏初始状态 */
body:not(.page-home) header .header-content {
    background-color: white !important;
    border-bottom: 1px solid #eee;
    padding: 1.5rem 0;
}

body:not(.page-home) header .header-content .logo img {
    filter: none;
}

body:not(.page-home) header .header-content .nav-link {
    color: black !important;
}

body:not(.page-home) header .header-content .nav-link img {
    filter: none;
}

/* 其他页面导航栏滚动状态 */
body:not(.page-home) header .header-content.scrolled {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    background-color: white !important;
    box-shadow: 0 2px 10px rgba(0, 0, 0, 0.1);
    padding: 0.4rem 0;
}

/* 首页手机导航栏初始状态 */
body.page-home header .header-mobile {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    background-color: transparent !important;
    border-bottom: none !important;
    transition: all 0.3s ease;
    z-index: 1000;
}

body.page-home header .header-mobile .mobile-content .mobile-open-menu img,
body.page-home header .header-mobile .mobile-content .mobile-open-search img,
body.page-home header .header-mobile .mobile-content .mb-account-icon img,
body.page-home header .header-mobile .mobile-content .m-cart img {
    filter: brightness(0) invert(1);
    transition: filter 0.3s ease;
}

body.page-home header .header-mobile .mobile-content .center img {
    filter: brightness(0) invert(1);
    transition: filter 0.3s ease;
}

/* 首页手机导航栏滚动状态 */
body.page-home header .header-mobile.scrolled {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    background-color: white !important;
    box-shadow: 0 2px 10px rgba(0, 0, 0, 0.1);
    border-bottom: none !important;
    z-index: 1000;
}

body.page-home header .header-mobile.scrolled .mobile-content .mobile-open-menu img,
body.page-home header .header-mobile.scrolled .mobile-content .mobile-open-search img,
body.page-home header .header-mobile.scrolled .mobile-content .mb-account-icon img,
body.page-home header .header-mobile.scrolled .mobile-content .m-cart img {
    filter: none;
    transition: filter 0.3s ease;
}

body.page-home header .header-mobile.scrolled .mobile-content .center img {
    filter: none;
    transition: filter 0.3s ease;
}

/* 其他页面手机导航栏初始状态 */
body:not(.page-home) header .header-mobile {
    background-color: white !important;
    border-bottom: 1px solid #eee;
}

body:not(.page-home) header .header-mobile .mobile-content .mobile-open-menu img,
body:not(.page-home) header .header-mobile .mobile-content .mobile-open-search img,
body:not(.page-home) header .header-mobile .mobile-content .mb-account-icon img,
body:not(.page-home) header .header-mobile .mobile-content .m-cart img {
    filter: none;
}

body:not(.page-home) header .header-mobile .mobile-content .center img {
    filter: none;
}

/* 其他页面手机导航栏滚动状态 */
body:not(.page-home) header .header-mobile.scrolled {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    background-color: white !important;
    box-shadow: 0 2px 10px rgba(0, 0, 0, 0.1);
    border-bottom: none !important;
    z-index: 1000;
}

/* 确保顶部栏样式正确 */
.header-top {
    background-color: rgba(0, 0, 0, 0.1);
    transition: background-color 0.3s ease;
}

body.page-home .header-top {
    background-color: rgba(0, 0, 0, 0.1);
}

/* 平滑过渡动画 */
header .header-content,
header .header-content *,
header .header-mobile,
header .header-mobile * {
    transition: all 0.3s ease;
}

/* 确保下拉菜单样式正确 */
header .header-content .dropdown-menu {
    background-color: white;
    border: 1px solid rgba(0, 0, 0, 0.15);
    border-radius: 0.25rem;
}

header .header-content .dropdown-item {
    color: black;
    transition: background-color 0.2s ease;
}

header .header-content .dropdown-item:hover {
    background-color: #f8f9fa;
    color: black;
}

/* 确保导航栏在首页的层级正确 */
body.page-home {
    padding-top: 0;
}

/* 确保导航栏在其他页面的层级正确 */
body:not(.page-home) header {
    position: relative;
}

/* 确保导航栏在滚动时的层级正确 */
header .header-content.scrolled,
header .header-mobile.scrolled {
    z-index: 9999;
}