/* Logo颜色修改样式 */

.nav-logo img {
    transition: filter 0.3s ease, transform 0.3s ease;
}

/* 默认Logo颜色 - 可以根据需要调整 */
.nav-logo img.logo-blue {
    filter: hue-rotate(200deg) saturate(1.2) brightness(1.1);
}

.nav-logo img.logo-red {
    filter: hue-rotate(0deg) saturate(1.5) brightness(1.1);
}

.nav-logo img.logo-green {
    filter: hue-rotate(120deg) saturate(1.3) brightness(1.1);
}

.nav-logo img.logo-purple {
    filter: hue-rotate(270deg) saturate(1.4) brightness(1.1);
}

.nav-logo img.logo-orange {
    filter: hue-rotate(30deg) saturate(1.6) brightness(1.2);
}

.nav-logo img.logo-pink {
    filter: hue-rotate(320deg) saturate(1.5) brightness(1.2);
}

.nav-logo img.logo-yellow {
    filter: hue-rotate(60deg) saturate(1.8) brightness(1.3);
}

.nav-logo img.logo-cyan {
    filter: hue-rotate(180deg) saturate(1.4) brightness(1.1);
}

/* 特殊效果 */
.nav-logo img.logo-grayscale {
    filter: grayscale(100%) brightness(1.1);
}

.nav-logo img.logo-sepia {
    filter: sepia(100%) saturate(1.2) brightness(1.1);
}

.nav-logo img.logo-invert {
    filter: invert(100%) brightness(1.1);
}

/* 动态颜色变化 */
.nav-logo img.logo-dynamic {
    animation: logoColorCycle 8s infinite;
}

@keyframes logoColorCycle {
    0% { filter: hue-rotate(0deg) saturate(1.5) brightness(1.1); }
    16.66% { filter: hue-rotate(60deg) saturate(1.5) brightness(1.1); }
    33.33% { filter: hue-rotate(120deg) saturate(1.5) brightness(1.1); }
    50% { filter: hue-rotate(180deg) saturate(1.5) brightness(1.1); }
    66.66% { filter: hue-rotate(240deg) saturate(1.5) brightness(1.1); }
    83.33% { filter: hue-rotate(300deg) saturate(1.5) brightness(1.1); }
    100% { filter: hue-rotate(360deg) saturate(1.5) brightness(1.1); }
}

/* 自定义颜色支持 */
.nav-logo img.logo-custom {
    filter: var(--custom-logo-filter, hue-rotate(0deg) saturate(1.2) brightness(1.1));
}

/* 悬停效果 */
.nav-logo:hover img {
    transform: scale(1.05);
}

.nav-logo:hover img.logo-hover-blue {
    filter: hue-rotate(200deg) saturate(1.5) brightness(1.3);
}

.nav-logo:hover img.logo-hover-red {
    filter: hue-rotate(0deg) saturate(1.8) brightness(1.3);
}

.nav-logo:hover img.logo-hover-green {
    filter: hue-rotate(120deg) saturate(1.6) brightness(1.3);
}

.nav-logo:hover img.logo-hover-purple {
    filter: hue-rotate(270deg) saturate(1.7) brightness(1.3);
}

/* 品牌色彩主题 */
.nav-logo img.brand-primary {
    filter: hue-rotate(210deg) saturate(1.3) brightness(1.1) contrast(1.1);
}

.nav-logo img.brand-secondary {
    filter: hue-rotate(45deg) saturate(1.4) brightness(1.2) contrast(1.05);
}

.nav-logo img.brand-accent {
    filter: hue-rotate(300deg) saturate(1.6) brightness(1.15) contrast(1.1);
}

/* 时间段自动颜色 */
.nav-logo img.auto-morning {
    filter: hue-rotate(45deg) saturate(1.4) brightness(1.3); /* 温暖的橙色 */
}

.nav-logo img.auto-afternoon {
    filter: hue-rotate(200deg) saturate(1.2) brightness(1.1); /* 清爽的蓝色 */
}

.nav-logo img.auto-evening {
    filter: hue-rotate(270deg) saturate(1.3) brightness(0.9); /* 深沉的紫色 */
}

.nav-logo img.auto-night {
    filter: hue-rotate(240deg) saturate(0.8) brightness(0.8); /* 深蓝夜色 */
}

/* 节日主题颜色 */
.nav-logo img.holiday-christmas {
    filter: hue-rotate(0deg) saturate(1.8) brightness(1.2) contrast(1.2);
    animation: christmasGlow 2s ease-in-out infinite alternate;
}

@keyframes christmasGlow {
    0% { filter: hue-rotate(0deg) saturate(1.8) brightness(1.2) contrast(1.2); }
    100% { filter: hue-rotate(120deg) saturate(1.6) brightness(1.1) contrast(1.1); }
}

.nav-logo img.holiday-newyear {
    filter: hue-rotate(45deg) saturate(2) brightness(1.4) contrast(1.3);
    animation: newYearSparkle 1.5s ease-in-out infinite;
}

@keyframes newYearSparkle {
    0%, 100% { filter: hue-rotate(45deg) saturate(2) brightness(1.4) contrast(1.3); }
    50% { filter: hue-rotate(60deg) saturate(1.8) brightness(1.6) contrast(1.2); }
}

/* 响应式调整 */
@media (max-width: 768px) {
    .nav-logo img {
        transition-duration: 0.2s;
    }
    
    .nav-logo:hover img {
        transform: scale(1.02);
    }
}

/* 暗色主题适配 - 实心 Logo 保持原色 */
@media (prefers-color-scheme: dark) {
    body.dark-mode .nav-logo img {
        filter: none;
    }
    
    .nav-logo img.logo-dynamic {
        animation-duration: 10s;
    }
}

/* 减少动画效果（用户偏好） */
@media (prefers-reduced-motion: reduce) {
    .nav-logo img {
        transition: none;
        animation: none;
    }
    
    .nav-logo img.logo-dynamic,
    .nav-logo img.holiday-christmas,
    .nav-logo img.holiday-newyear {
        animation: none;
    }
}