.animated-icon{display:inline-block;--transition-duration:0.2s}.animated-icon svg g{transition:opacity var(--transition-duration) ease-in-out}.animated-icon.unfilled svg g[id$=-grey]{opacity:1}.animated-icon.filled svg g[id$=-grey],.animated-icon.unfilled svg g[id$=-filled]{opacity:0}.animated-icon.filled svg g[id$=-filled]{opacity:1}.animated-icon.unfilled[data-animation-type=hover]:hover svg g[id$=-grey]{opacity:0!important}.animated-icon.filled[data-animation-type=hover]:hover svg g[id$=-grey],.animated-icon.unfilled[data-animation-type=hover]:hover svg g[id$=-filled]{opacity:1!important}.animated-icon.filled[data-animation-type=hover]:hover svg g[id$=-filled],.animated-icon[data-animation-type=scroll][data-scrolled=true] svg g[id$=-grey]{opacity:0!important}.animated-icon[data-animation-type=scroll][data-scrolled=true] svg g[id$=-filled]{opacity:1!important}