/* Use this file if you want the default elevation data attributes in your project */
@use "../helpers";
@use "../variables";

.db-interactive-elevation,
[data-interactive="elevation"] {
	cursor: pointer;
	box-shadow: variables.$db-elevation-md;

	@media screen and (prefers-reduced-motion: no-preference) {
		transition: box-shadow variables.$db-transition-duration-fast
			variables.$db-transition-timing-functional;
	}

	@include helpers.hover {
		box-shadow: variables.$db-elevation-lg;
	}

	@include helpers.active {
		box-shadow: variables.$db-elevation-sm;
	}
}