@import '../mixins/elevation';
@import '../mixins/surface';

.snackbar {
	@include surface;
	@include elevation(6);

	--color: var(--on-surface-inverse);
	--background: var(--surface-inverse);
	--radius: var(--container-radius); // todo : set this in a way that makes sense

	display: flex;
	flex-flow: row wrap;
	justify-content: space-between;
	align-items: center;
	padding: 1.6rem;
	font-size: 1.4rem;
	line-height: 1.6rem;

	button,
	.button {
		margin: -1.6rem -0.8rem -1.6rem 1.6rem;
	}
}