Page PDF export: Hide custom panel

[Jonathan Huet]

Hi!

I want to hide a custom panel (like an Info panel, but with a customized icon) when exporting to PDF by using the "PDF stylesheet" option in the "PDF export".

But once exported, my CSS rule is not taken into account. I actually use other CSS rules, to change the headers and they work fine.

This is my Confluence Cloud HTML-rendered panel:

<div class="ak-editor-panel css-1qn6o79" data-panel-type="custom" data-panel-color="#DEEBFF" data-panel-icon=":printer:" data-panel-icon-id="1f5a8" data-panel-icon-text="🖨️" backgroundcolor="#DEEBFF">
<div class="ak-editor-panel__icon">
<span data-emoji-id="1f5a8" data-emoji-short-name=":printer:" data-emoji-text="🖨️">
<span data-testid="image-emoji-:printer:" data-emoji-type="image" class="emoji-common-main-styles emoji-common-node emoji-common-emoji-image css-1np3glt" aria-label=":printer:" title=":printer:">
<img loading="lazy" src="https://pf-emoji-service--cdn.us-east-1.prod.public.atl-paas.net/standard/caa27a19-fc09-4452-b2b4-a301552fd69c/64x64/1f5a8.png" alt=":printer:" data-emoji-short-name=":printer:" data-emoji-id="1f5a8" data-emoji-text="🖨️" class="emoji" width="20" height="20" style="visibility: visible;">
</span>
</span>
</div>
<div class="ak-editor-panel__content"><p data-renderer-start-pos="2">Foo Bar</p>
</div>
</div>

This is my CSS rule with different selectors, but none of them work.

.ak-editor-panel, [data-panel-type="custom"], [data-panel-icon=":printer:"] 
{ 
display: none !important; 
opacity: 0; 
} 

Can anyone help me, please?

Thanks!