$eve-tab-size: 3rem;

.eve-navigation {
    display: flex;
    flex-direction: column;
    list-style: none;
    margin: 0;
    padding: 0;

    li {
        cursor: pointer;
        height: $eve-tab-size;
        padding: 0 $eve-spacing-16;
        display: flex;
        align-items: center;
        text-transform: uppercase;
        font-size: $eve-font-14;
        color: $eve-color-black;

        svg {
            width: 1.25rem;
            height: 1.25rem;
            fill: $eve-color-darker-silver;
            margin-right: $eve-spacing-12;
            flex-shrink: 0;
        }

        &:hover {
            color: $eve-color-blue;

            svg {
                fill: $eve-color-blue;
            }
        }

        &.is-active {
            color: $eve-color-blue;
            position: relative;

            svg {
                fill: $eve-color-blue;
            }

            &::after {
                content: '';
                display: block;
                width: 1px;
                background: $eve-color-blue;
                position: absolute;
                left: 0;
                bottom: 0;
                top: 0;
            }
        }

        &.is-disabled {
            opacity: .5;
            pointer-events: none;
        }
    }
}

