
[icon]:before,
[class*="icon:"]:before,
[class*="icon-after:"]:after,
[class*="icon-text:"]:before,
[class*="icon-text-after:"]:after {
	display: inline-block;
    background-color: currentColor;
	width: 1em;
	height: 1em;
	content: "";
	mask-size: 1em;
    position: relative;
    top: .2em;
}
[icon]:before,
[class*="icon:"]:before,
[class*="icon-text:"]:before {
    margin-left: .4em;
    mask-image: var(--svg);
}
[class*="icon-after:"]:after,
[class*="icon-text-after:"]:after {
    margin-right: .4em;
    mask-image: var(--svg-after);
}

/* flag & emoji */
[icon][icon*="emoji"]:before,
[class*="icon:"][class*="emoji"]:before,
[class*="icon-after:"][class*="emoji"]:after {
    background-color: initial;
	background-size: 1em;
    mask-image: initial;
}
[icon][icon*="emoji"]:before,
[class*="icon:"][class*="emoji"]:before {
    background-image: var(--svg);
}
[class*="icon-after:"][class*="emoji"]:after {
    background-image: var(--svg-after);
}

/* text */
[class*="icon-text:"],
[class*="icon-text-after:"] {
	--a-bg-color: white;
}
[class*="icon-text:"]:before,
[class*="icon-text-after:"]:after {
	background-size: calc( 1em * 100 / 85 );
    mask-image: initial;
	width: calc( 2.25em * 100 / 85 );
	height: initial;
    padding: .1em 0;
	line-height: 1;
    top: initial;
    transform: scale(1);
	-webkit-text-fill-color: var(--a-bg-color);
	text-align: center;
	letter-spacing: normal;
    font-size: .85em;
	font-weight: 600;
}
[class*="icon-text:"]:before {
    content: var(--icon-text);
}
[class*="icon-text-after:"]:after {
    content: var(--icon-text-after);
}
[class*="color:"][class*="icon-text:"]:hover:before,
[class*="color:"][class*="icon-text-after:"]:hover:after {
	-webkit-text-fill-color: var(--a-text-color);
}
[class*="color:"][class*="icon-text:"]:focus:before,
[class*="color:"][class*="icon-text-after:"]:focus:after {
	-webkit-text-fill-color: var(--a-text-color);
}

.neon[class*="icon-after:"]:after,
.neon[class*="icon-text-after:"]:after {
	color: var(--a-neon-color);
}




