/* Abrevia Navigation Responsive Colors & Animations */

/* Navigation scroll animations */
#main-nav nav {
    transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
}

/* Logo filter and animations */
.logo-filter {
    filter: brightness(0) invert(1); /* White logo by default */
    transition: all 0.3s ease;
}

#main-nav.nav-scrolled .logo-filter {
    filter: brightness(0); /* Dark logo on white background */
}

/* Default styles for transparent nav */
.nav-link {
    color: white; /* White text on transparent background */
    transition: color 0.3s ease;
}

.nav-link:hover,
.hover-blue:hover {
    color: #DC2626; /* red-600 hover on transparent */
}

.nav-link-blue {
    color: white; /* White for dropdown buttons */
    transition: color 0.3s ease;
}

/* Mobile menu button */
.mobile-menu-button {
    color: white;
    transition: color 0.3s ease;
}

/* Styles when navigation is scrolled (white background) */
#main-nav.nav-scrolled .nav-link,
#main-nav.nav-scrolled .nav-link-blue,
#main-nav.nav-scrolled .mobile-menu-button {
    color: #111827; /* gray-900 - dark text on white background */
}

#main-nav.nav-scrolled .nav-link:hover,
#main-nav.nav-scrolled .hover-blue:hover {
    color: #1e3a8a; /* blue-900 hover on white background */
}

#main-nav.nav-scrolled .nav-link-blue:hover {
    color: #1e3a8a; /* blue-900 hover */
}

/* Group hover for dropdowns */
.group:hover .nav-link-blue {
    color: white; /* Keep white when dropdown is shown on transparent */
}

#main-nav.nav-scrolled .group:hover .nav-link-blue {
    color: #1e3a8a; /* Blue when dropdown is shown on white background */
}

/* Smooth backdrop blur support */
@supports (backdrop-filter: blur(10px)) {
    #main-nav.nav-scrolled nav {
        backdrop-filter: blur(10px);
        -webkit-backdrop-filter: blur(10px);
    }
}