/* Mobile nav — place this <link> AFTER the inline <style> block so it wins the cascade */

/* Hamburger always hidden on desktop */
.nav-hamburger {
    display: none;
}

@media (max-width: 768px) {
    /* Slim bar: only hamburger visible */
    nav {
        display: flex;
        flex-direction: row;
        flex-wrap: wrap;
        justify-content: flex-end;
        align-items: center;
        padding: 0 1.25rem;
        min-height: 48px;
        gap: 0;
    }

    nav > a,
    nav > .nav-item {
        display: none;
        order: 2;
    }

    /* Show and right-align hamburger */
    .nav-hamburger {
        display: flex;
        flex-direction: column;
        justify-content: center;
        gap: 5px;
        background: none;
        border: none;
        cursor: pointer;
        padding: 0.75rem 0;
        min-height: 48px;
        order: 1;
    }

    .nav-hamburger span {
        display: block;
        width: 22px;
        height: 2px;
        background: var(--text-muted);
        transition: transform 0.25s ease, opacity 0.2s ease;
    }

    /* Animate to X when open */
    nav.nav--open .nav-hamburger span:nth-child(1) {
        transform: translateY(7px) rotate(45deg);
    }
    nav.nav--open .nav-hamburger span:nth-child(2) {
        opacity: 0;
    }
    nav.nav--open .nav-hamburger span:nth-child(3) {
        transform: translateY(-7px) rotate(-45deg);
    }

    /* Expand: show all links stacked below hamburger row */
    nav.nav--open > a,
    nav.nav--open > .nav-item {
        display: block;
        flex: 0 0 100%;
        order: 2;
        padding: 0.9rem 0;
        border-bottom: 1px solid var(--border);
    }

    nav.nav--open > .nav-item {
        padding: 0;
    }

    nav.nav--open > .nav-item > a {
        display: block;
        padding: 0.9rem 0;
    }

    /* Dropdown: static, no shadow, no arrow, no hover */
    .dropdown-content {
        position: static;
        transform: none;
        box-shadow: none;
        border: none;
        border-radius: 0;
        background: transparent;
        min-width: auto;
        padding: 0;
        display: none;
        animation: none;
    }

    .dropdown-content::before,
    .dropdown-content::after {
        display: none;
    }

    .dropdown-content a {
        padding: 0.6rem 1rem;
        font-size: 0.75rem;
        border-bottom: 1px solid rgba(255,255,255,0.03);
    }

    /* Disable desktop hover on mobile */
    .nav-item:hover .dropdown-content {
        display: none;
        animation: none;
    }

    /* JS adds .nav-item--open to expand Reports sub-items */
    .nav-item.nav-item--open .dropdown-content {
        display: block;
    }

    /* Indicate Reports is expandable */
    nav.nav--open > .nav-item > a::after {
        content: ' +';
        font-family: var(--font-mono);
        font-size: 0.8em;
        color: var(--accent);
        opacity: 0.7;
    }

    nav.nav--open > .nav-item.nav-item--open > a::after {
        content: ' −';
    }
}