Drop Down Menu hover

Hey @thalakus,

Thanks for pointing this out. This is happening because the theme currently treats the text and the dropdown symbol as two separate interactive elements in the HTML structure.

From a functional mobile/touch accessibility standpoint, this design allows a user to tap the text to visit the page or tap the dropdown symbol to open the submenu without visiting the page.

I’ve added an enhancement request, and our development team will review this further.

In the meantime, you can add this custom CSS code under Appearance > Customize > Additional CSS:

/* 1. Keep the TEXT colored when hovering the whole item */
.sydney-dropdown-li:hover > .sydney-dropdown-link {
    color: #d65050 !important;
}

/* 2. Fix the SVG chevron color (Handles Fill and Stroke) */
.sydney-dropdown-li:hover > .dropdown-symbol svg {
    fill: #d65050;   /* For solid shapes */
    stroke: #d65050; /* For line/outline icons */
    color: #d65050;  /* Fallback */
}

/* 3. Ensure the chevron behaves like a clickable link */
.dropdown-symbol {
    cursor: pointer;
}

The code tells the theme to keep the hover effect whenever you are hovering anywhere near that specific menu item (including the dropdown symbol).

I hope this helps.