:host-context(html[dir='ltr']) .blocking-issue-title {
padding-left: 8px;
}
:host-context(html[dir='rtl']) .blocking-issue-title {
padding-right: 8px;
}
I'm not sure how fast this selector is. But /deep/ is also expensive, so it might be worth testing.
Longer answer is that that seems like a good question that we probably should have a good answer for.
I'm deeply ignorant in regards to bidirectional text. But it seems like the html[dir='rtl'] rules wouldn't work correctly for documents with bidirectional text, like:
<html dir='ltr>
...
<div>
<my-element> <!-- english text --> </my-element>
</div>
<div dir='rtl'>
<my-element> <!-- hebrew text --></my-element>
</div>
...
</html>
But perhaps I'm just borrowing trouble here.
Cheers,
Arthur