::-webkit-calendar-picker-indicator looked like a possible candidate. Setting the background color on this changes the color behind the icon (as expected). However I can't find any parameter that has an effect on the icon color itself.
The Shadow DOM style sets a background-image which can not be interacted with in CSS (except for filter). One option is to replace the whole image where you can set any fill color and this method will be forward-compatible in case Chrome decides to inherit the icon color from color later on, at the cost of having a "hardcoded" icon:
After that you can play around with hue-rotate to change the hue. hue-rotate(240deg) turns it blue, hue-rotate(120deg) turns it green etc. If you want to get a really specific color you should check out this question on how to transform black into any given color using only CSS filters.
1.) Make the text below the header bold, bigger, and white.
2.) Make the Date heading white
3.) Make the button background red
4. ) and The background color of the share icon box to be black.
5.) What is the css selector to change this bar from white?
One of those challenges was getting the timezone right, believe it or not. You would think this would be fairly simple, but the iCloud calendar is not an easy-to-use tool, especially compared to Google Calendar, in my opinion. Here are two examples:
df19127ead