// =============================================================================
// :: Button
// =============================================================================
/**
 * Scope defined specifically for creating the visual representation of the
 * button component.
 */

// =============================================================================
// :: Button
// =============================================================================
.s-bp-button {
	display: flex;
	flex-wrap: wrap;
	justify-content: flex-start;
	align-items: flex-start;

	.c-button {
		margin-right: 2rem;
		margin-bottom: 2rem;

		&:last-child {
			margin: 0;
		}
	}
}

.s-bp-button-inverted {
	padding: 5rem;

	background-color: $background-color-pink;
}