.hover-container:hover .hover-target {
    opacity: 1;
}

.hover-target {
    opacity: 0;
    transition: opacity 300ms ease-in-out;
}

.hover-target.MuiIconButton-root {
    transition: opacity 300ms ease-in-out, background-color 150ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;
}

.nav-tab::before {
    background: linear-gradient(270deg, #9132E9 1.08%, #2563EB 100%);
    opacity: 0;
    content: " ";
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    border-radius: 8px;
    transition: opacity 150ms ease-in-out;
}

.nav-tab.active::before {
    opacity: 1;
}

.nav-tab:not(.active):hover::before {
    opacity: 0.25;
}