.fa-svg {
	display: inline-block;
	width: var(--fa-width, calc(var(--fa-height, 1em) * var(--fa-aspect-ratio-value, 1)));
	height: var(--fa-height, 1em);
	aspect-ratio: var(--fa-aspect-ratio, 1 / 1);
	overflow: visible;
	vertical-align: -0.125em;
	fill: currentColor;
	line-height: 1;
	flex-shrink: 0;
}

.fa-svg.fa-rotate-by {
	transform: rotate(var(--fa-rotate-angle, 0deg));
	transform-origin: center;
}

.fa-before::before,
.fa-after::after {
	content: "";
	display: inline-block;
	width: var(--fa-width, calc(var(--fa-height, 1em) * var(--fa-aspect-ratio-value, 1)));
	height: var(--fa-height, 1em);
	aspect-ratio: var(--fa-aspect-ratio, 1 / 1);
	background-color: var(--fa-color, currentColor);
	-webkit-mask-image: var(--fa-icon);
	mask-image: var(--fa-icon);
	-webkit-mask-repeat: no-repeat;
	mask-repeat: no-repeat;
	-webkit-mask-position: center;
	mask-position: center;
	-webkit-mask-size: contain;
	mask-size: contain;
	vertical-align: -0.125em;
	flex-shrink: 0;
}

.fa-before.fa-rotate-by::before,
.fa-after.fa-rotate-by::after {
	transform: rotate(var(--fa-rotate-angle, 0deg));
	transform-origin: center;
}

.fa-before.fa-after[class*="fa-fill-"] {
	position: relative;
	display: inline-block;
	width: var(--fa-width, calc(var(--fa-height, 1em) * var(--fa-aspect-ratio-value, 1)));
	height: var(--fa-height, 1em);
	aspect-ratio: var(--fa-aspect-ratio, 1 / 1);
	line-height: 1;
	vertical-align: -0.125em;
	flex-shrink: 0;
}

.fa-before.fa-after.fa-rotate-by[class*="fa-fill-"] {
	transform: rotate(var(--fa-rotate-angle, 0deg));
	transform-origin: center;
}

.fa-before.fa-after[class*="fa-fill-"]::before,
.fa-before.fa-after[class*="fa-fill-"]::after {
	position: absolute;
	inset: 0;
	width: 100%;
	height: 100%;
}

.fa-before.fa-after[class*="fa-fill-"]::before {
	background-color: var(--fa-base-color, currentColor);
	opacity: var(--fa-base-opacity, 0.35);
}

.fa-before.fa-after[class*="fa-fill-"]::after {
	background-color: var(--fa-fill-color, currentColor);
	clip-path: inset(0 calc(100% - var(--fa-fill, 0%)) 0 0);
}

@supports (background-color: color-mix(in srgb, black 50%, white)) {
	.fa-before.fa-after[class*="fa-fill-"]::before {
		background-color: var(
			--fa-base-color,
			color-mix(in srgb, currentColor 50%, #fff)
		);
	}
}

.fa-fill-10 {--fa-fill: 10%;}
.fa-fill-20 {--fa-fill: 20%;}
.fa-fill-30 {--fa-fill: 30%;}
.fa-fill-40 {--fa-fill: 40%;}
.fa-fill-50 {--fa-fill: 50%;}
.fa-fill-60 {--fa-fill: 60%;}
.fa-fill-70 {--fa-fill: 70%;}
.fa-fill-80 {--fa-fill: 80%;}
.fa-fill-90 {--fa-fill: 90%;}

.fa-2xs {font-size: 0.625em;}
.fa-xs {font-size: 0.75em;}
.fa-sm {font-size: 0.875em;}
.fa-lg {font-size: 1.25em;}
.fa-xl {font-size: 1.5em;}
.fa-2xl {font-size: 2em;}
.fa-1x {font-size: 1em;}
.fa-2x {font-size: 2em;}
.fa-3x {font-size: 3em;}
.fa-4x {font-size: 4em;}
.fa-5x {font-size: 5em;}
.fa-6x {font-size: 6em;}
.fa-7x {font-size: 7em;}
.fa-8x {font-size: 8em;}
.fa-9x {font-size: 9em;}
.fa-10x {font-size: 10em;}

.fa-ul {
    list-style-type: none;
    margin-left: var(--fa-li-margin,2.5em);
    padding-left: 0;
}

.fa-li {
    left: calc(-1*var(--fa-li-width,2em));
    position: absolute;
    text-align: center;
    width: var(--fa-li-width,2em);
    line-height: inherit;
}
.fa-ul>li {
    position: relative;
}
