@import "hover.css";

.wp-block-gab-animation-button {
	margin-bottom: 1.5em;

	.wp-block-button__link {
		border: none;
		box-shadow: none;
		cursor: pointer;
		display: inline-block;
		font-size: 1rem;
		line-height: 1.4rem;
		margin: 0;
		padding: 11px 24px;
		text-align: center;
		text-decoration: none;
		white-space: normal;
		word-break: break-all;

		&.gab-small {
			font-size: .6rem;
			line-height: .9rem;
			padding: 7px 14px;
		}

		&.gab-large {
			font-size: 1.4rem;
			line-height: 1.9rem;
			padding: 16px 34px;
		}

		&.gab-x-large {
			font-size: 2rem;
			line-height: 2.8rem;
			padding: 22px 48px;
		}

		&.gab-square {
			border-radius: 0;
		}

		&.gab-circular {
			border-radius: 30px;
		}
	}

	&.gab-small {
		.wp-block-button__link {
			font-size: .6rem;
			line-height: .9rem;
			padding: 7px 14px;
		}
	}

	&.gab-large {
		.wp-block-button__link {
			font-size: 1.4rem;
			line-height: 1.9rem;
			padding: 16px 34px;
		}
	}

	&.gab-x-large {
		.wp-block-button__link {
			font-size: 2rem;
			line-height: 2.8rem;
			padding: 22px 48px;
		}
	}

	&.gab-square {
		.wp-block-button__link {
			border-radius: 0;
		}
	}

	&.gab-circular {
		.wp-block-button__link {
			border-radius: 30px;
		}
	}

	&.aligncenter {
		text-align: center;
	}

	&.alignright {
		text-align: right;
	}
}

.wp-block-button__link:not(.has-background) {
	background-color: $dark-gray-700;
	&:hover,
	&:focus,
	&:active {
		background-color: $dark-gray-700;
	}
}

.wp-block-gab-animation-button.is-style-outline {
	.wp-block-button__link {
		background: transparent;
		border: 2px solid transparent;

		&.has-pale-pink-background-color {
			border-color: #f78da7;
		}

		&.has-vivid-red-background-color {
			border-color: #cf2e2e;
		}

		&.has-luminous-vivid-orange-background-color {
			border-color: #ff6900;
		}

		&.has-luminous-vivid-amber-background-color {
			border-color: #fcb900;
		}

		&.has-light-green-cyan-background-color {
			border-color: #7bdcb5;
		}

		&.has-vivid-green-cyan-background-color {
			border-color: #00d084;
		}

		&.has-pale-cyan-blue-background-color {
			border-color: #8ed1fc;
		}

		&.has-vivid-cyan-blue-background-color {
			border-color: #0693e3;
		}

		&.has-very-light-gray-background-color {
			border-color: #eee;
		}

		&.has-cyan-bluish-gray-background-color {
			border-color: #abb8c3;
		}

		&.has-very-dark-gray-background-color {
			border-color: #313131;
		}
	}

	.wp-block-button__link:not(.has-background) {
		border-color: $dark-gray-700;
		&:hover,
		&:focus,
		&:active {
			border-color: $dark-gray-700;
		}
	}

	.wp-block-button__link:not(.has-text-color) {
		color: $dark-gray-700;
		&:hover,
		&:focus,
		&:active {
			color: $dark-gray-700;
		}
	}
}

.wp-block-button__link:not(.has-text-color) {
	color: $white;
	&:hover,
	&:focus,
	&:active {
		color: $white;
	}
}