Help with animated element starting state

On my website, I have 2 animated interactions, one is a dark mode switch that toggles on click (lottie animation) and on a dropdown component where the arrow rotates on click. On both of these the inital state on load for the element is not as it should be. For the arrow I made an on load animation to set its position however this feels like the wrong solution.

Here is my public share link: [LINK](Webflow - Tech Heroes)
(how to access public share link)

The reason the initial state isn’t loading correctly is because you have 2 initial states set for the same Div and Class and it’s defaulting to the wrong one. On the Point Down animation you can just delete the initial state action that you have set up. Once you do that you can delete the Page Load animation as it should work as expected now.

The Lottie interaction has the same issue of 2 initial states being set.

Thank you so much,
It worked,
I’ll do some more research to better understand the “set as initial state”