.aaw-icon-wrapper {
	display: flex;
	width: 100%;
	justify-content: flex-start;
}

.aaw-icon-link {
	display: inline-flex;
	text-decoration: none;
}

.aaw-icon-inner {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	line-height: 1;
}

.aaw-icon-inner i {
	display: inline-block;
	line-height: 1;
}

.aaw-icon-inner svg {
	display: inline-block;
	fill: currentColor;
}

/* Gradient mode: Font Awesome (and most icon fonts) draw the glyph via the
   ::before pseudo-element, so the gradient clip has to target that, not the
   empty <i> element itself. */
.aaw-icon-gradient i,
.aaw-icon-gradient i::before {
	background-image: var( --aaw-icon-gradient );
	-webkit-background-clip: text;
	background-clip: text;
	color: transparent;
	-webkit-text-fill-color: transparent;
	display: inline-block;
}

/* Gradient mode: uploaded SVG icons fall back to the first gradient color,
   since a true gradient fill requires an inline <svg> with its own <defs>. */
.aaw-icon-gradient svg {
	fill: var( --aaw-icon-gradient-fallback );
}