/* nav.css */

/* Styles for the sticky navigation header */
.header-bg {
    background-color: #002A3D; /* Match card backgrounds */
    border-bottom: 1px solid #365D80;
}

.nav-link {
    border-bottom: 3px solid transparent;
    transition: color 0.2s, border-color 0.2s;
}

.nav-link:hover {
    color: #67e8f9; /* text-accent */
}

.nav-link.active {
    color: #ffffff;
    border-bottom-color: #67e8f9; /* text-accent */
}

/* Utility to hide protected links when logged out */
.sub-nav-links.hide-protected .js-protected-link {
    display: none;
}

/* Responsive Navigation Styles */
@media (max-width: 1024px) { /* lg breakpoint in Tailwind */
    .sub-nav-links {
        display: none;
        flex-direction: column;
        width: 100%;
        text-align: center;
        padding-top: 1rem;
        padding-bottom: 1rem;
    }

    .sub-nav-links.show {
        display: flex;
    }

    .sub-nav-links a {
        padding: 0.75rem 1rem;
        border-bottom: 1px solid #365D80;
        width: 100%;
    }
    .sub-nav-links a:last-child {
        border-bottom: none;
    }
}