.withRipple {
	--ripple-color: var(--base-hlt-g-hover);
	position: relative;
	-webkit-tap-highlight-color: transparent;
}

.ripple-container {
	position: relative;
}

.ripple-host {
	position: absolute;
	inset: 0;
	overflow: hidden;
	border-radius: inherit;
	pointer-events: none;
	z-index: 0;
}

.ripple-circle {
	position: absolute;
	border-radius: 50%;
	background: var(--ripple-color);
	transform: scale(0);
	transition:
		transform var(--ripple-duration, 225ms) ease-out,
		opacity var(--ripple-duration, 225ms) ease-out;
	pointer-events: none;
}