I am trying to build documentation pages for a project using asciidoctor and have a main index.adoc which includes sections from a yaml source file which has line comments meant for callouts. The file renders properly and loads the source file correctly however all of the callouts show up as (#) where # is the number. I want them to be styled similarly to how they are in the asciidoctor docs where it is a blue circle and just the number in white.
I am using highlight.js as the source highlighter and have :icons: font in the header section of the adoc file but no matter what I try I cannot get the proper styling to apply. Everything else is working perfectly, the source file is loaded and displayed properly, including basic source highlighting, its just the callouts in the code and the associated table directly below the code block
Note, this is specifically for rendering HTML not PDF or anything else
EDIT:::
After inspecting the converted HTML the generated HTML I am getting looks like this
<i class="conum" data-value="2"></i><b>(2)</b>
whereas comparing to an online example that is styled properly it looks like
<i class="conum" data-value="2"></i><b>"(" <span class="hljs-number">2</span> ")" </b>