patterns/shared/2-blocks/button/button.scss

.button {
	display: inline-block;
	text-align: center;
	
	font: inherit;
	line-height: inherit;
	background: none;
	cursor: pointer;
	
	padding: 0.3em 0.5em 0.2em;
	border: 1px solid $color--brand-primary;
	border-radius: -cdd-em(4);
	
	& + & {
		margin-top: 0.5em;
	}
	
	transition: color 0.2s ease, border-color 0.2s ease;
	
	&, &:link, &:visited {
		color: $color--brand-primary;
	}
	
	&:hover, &:focus, &:not(&--novisited):visited {
		border-color: $color--brand-primary-alternate;
		color: $color--brand-primary-alternate;
	}
	
	&--secondary {
		&, &:link, &:visited {
			border-color: $color--brand-secondary;
			color: $color--brand-secondary;
		}
		
		&:hover, &:focus, &:not(.button--novisited):visited {
			border-color: $color--brand-secondary-alternate;
			color: $color--brand-secondary-alternate;
		}
	}
	
	&:disabled, &--disabled {
		border-color: $color--passive-dark;
		color: $color--passive-dark;
	}
}