I am building out an accordion drop down menu and I was able to figure out how to overwrite the Title color but I am stuck getting the icon/chevron to match. I am guessing I need to the line of code in Bold Italic. To Over write the default text color I had to use what is in bold in the second line.
<calcite-accordion appearance="transparent" icon-position="start" icon-type="chevron" scale="l" selection-mode="single">
<calcite-accordion-item item-title="Accordion Title" style="background-color:#949494; --calcite-ui-text-2: #ffffff; border-bottom:1px solid #949494">
<ul><li style="background-color: rgb(255, 255, 255); color: rgb(0, 55, 100);">
Accordion body text</li><li style="background-color: rgb(255, 255, 255); color: rgb(0, 55, 100);"><br></li><li style="background-color: rgb(255, 255, 255); color: rgb(0, 55, 100);"><br></li><li style="background-color: rgb(255, 255, 255); color: rgb(0, 55, 100);"><br></li><li style="background-color: rgb(255, 255, 255); color: rgb(0, 55, 100);">
</li></ul>
</calcite-accordion-item>
</calcite-accordion>
</div></div>
I'm stuck on this as well. It would be nice to know how to make the title text bigger too!
This topic might be helpful
How To: Edit the Title, Text, and Chevron Colors of the Accordion Menus in ArcGIS Hub (esri.com)