Combining last-of-type and hover

Combining last-of-type and hover

I have the following html structure:
<ul>
<li>
<a href="#"> Superlevel 1 </a>
<span class="actions">Somes actions</span>
<ul>
<li>
<a href="#">Level 1 </a>
<span class="actions">Other actions</span>
<ul>
<li>
<a href="#">Sub-Level1</a>
<span class="actions">Sub Level actions</span>
</li>
<li>
<a href="#">Sub-Level1</a>
<span class="actions">Sub Level actions</span>
</li>
</ul>
</li>
</ul>
<li>
</ul>
The css is this:
.treeview li .actions {
float: left;
padding: 0 15px;
visibility: hidden;
}
.treeview li:hover > .actions {
visibility: visible;
}
The problem is that when I pass the mouse over the last li (sub-level 1)
the .actions of its parents Level1 and Superlevel1 are displayed. I would
like only sub-level1 .actions to be displayed.
So I have tried to replace last css block by:
.treeview li:hover:last-of-type > .actions {
visibility: visible;
}
but the last-of-type pseudo-selector is applied to li not to li:hover.
Any idea of how to combine these two pseudo-selectors ?