.rfw-app-button {
	white-space: nowrap;

	svg {
		max-width: inherit;
		max-height: inherit;

		circle {
			stroke: currentcolor;
		}
	}

	&[hidden] {
		display: none !important;
	}

	// Add a gap between the SVG icon and text when the icon is on the right side.
	// `:last-child` is to prevent this style apply on the loading <Spinner>.
	&--icon-position-right.has-icon svg:last-child {
		margin-left: wpVariables.$grid-unit;
	}

	/**
	 * Reset the padding when a button contains both text and icon.
	 *
	 * @see https://github.com/WordPress/gutenberg/blob/%40wordpress/components%4012.0.8/packages/components/src/button/style.scss#L292
	 * @see https://github.com/WordPress/gutenberg/blob/%40wordpress/components%4012.0.8/packages/components/src/button/style.scss#L15
	 */
	&--icon-with-text.has-icon {
		padding: calc(wpVariables.$grid-unit-15 / 2) wpVariables.$grid-unit-15;
	}
}