I want the first item in a list in my navigation to stay underlined, and the rest to underline on hover, with the first item only not underlining until I hover on another list item. I have already tried the first child selector to try ad it but it does not seem to work.

I have already tried the child selector on the first li item but had no luck. I’m a bit unsure of how to approach it.

.nav__links a {
        padding-block: 5px;
        color: var(--text-dark);
        border-bottom: 3px solid transparent;
    }

    .nav__links a:hover {
        border-color: var(--btn-primary-color);
    }