/* Add positioning relative to the menu item container */
.elementor-nav-menu .menu-item {
    position: relative;
}

/* Create the vertical line using a pseudo-element */
.elementor-nav-menu .menu-item > a::before {
    content: '';
    position: absolute;
    left: -15px; /* Adjust distance from text */
    top: 50%;
    transform: translateY(-50%);
    width: 3px; /* Line thickness */
    height: 0; /* Start with 0 height */
    background-color: currentColor; /* Matches the text color */
    transition: height 0.3s ease; /* Smooth height animation */
}

/* Expand the line on hover */
.elementor-nav-menu .menu-item:hover > a::before,
.elementor-nav-menu .menu-item.current-menu-item > a::before {
    height: 70%; /* Final height of the line */
}

/* Add some padding to the link to ensure the line doesn't overlap the text */
.elementor-nav-menu .menu-item > a {
    padding-left: 10px;
}