Not getting colored annotations from Zotero

[tafluv]

I'm trying to create a template for zotero integration plugin. I'm using the chunk of the script from @tallguyjenks template (see below), but all annotations get extracted in yellow highlight regardless of original zotero color. I tried to create a highlights.css file to fix the issue, but it didn't work (might be a wrong code in it - I'm new to this). Maybe I'm missing specific plugin needed to make this work? Can someone help, please. Fyi, I don't want to instal the whole vault, I'm just trying to re-create some of the templates.

Notes

Highlight Color	Meaning
Magenta	Definitions
Red	Controversial/Disagreement with current research
Orange	Follow up on reference/Read more about concept
Yellow	Limitations/Knowledge gaps
Green	Important To Me
Blue	Interesting piece of knowledge
Purple	Relevant materials/Methods details
Grey	Other

{% for annotation in annotations -%}
{%- if annotation.annotatedText -%}
- "{{annotation.annotatedText | escape}}” Page {{annotation.page}}
{%- endif %}
{%- if annotation.imageRelativePath -%}
![[{{annotation.imageRelativePath}}]] {%- endif %}
{%- if annotation.comment %}
- {{annotation.comment}}
{%- endif %}
{% endfor %}

[tallguyjenks]

i use the highlighter plugin and the template i use uses span HTML tags with the CSS class for the highlighter plugin to map the colors to

| <mark class="hltr-grey">Highlight Color</mark> | Meaning                       |
| ---------------------------------------------- | ----------------------------- |
| <mark class="hltr-red">Red</mark>              | Disagree with Author          |
| <mark class="hltr-orange">Orange</mark>        | Important Point By Author     |
| <mark class="hltr-yellow">Yellow</mark>        | Interesting Point             |
| <mark class="hltr-green">Green</mark>          | Important To Me               |
| <mark class="hltr-blue">Blue</mark>            | Notes After Initial Iteration |
| <mark class="hltr-purple">Purple</mark>        | Literary Note To Lookup Later |