// Styles for both editor and front-end

// Base
@import "base/_mixins.scss";

/* Buttons
-------------------------------------------------------*/
.wp-block-button .wp-block-button__link {
	@include editor-button;
}

.editor-styles-wrapper {
	.wp-block-button__link,
	.wp-block-button__link:active,
	.wp-block-button__link:focus,
	.wp-block-button__link:hover,
	.wp-block-button__link:visited {
		background-color: var(--ebx-primary-color);
	}
}

.wp-block-button__link:not(.has-white-background-color):active,
.wp-block-button__link:not(.has-white-background-color):focus,
.wp-block-button__link:not(.has-white-background-color):hover {
	border-color: transparent;
	background-color: var(--ebx-buttons-hover-background-color);
	color: var(--ebx-buttons-hover-text-color);
}

.wp-block-button.hover-underline .wp-block-button__link:hover,
.wp-block-button.hover-underline .wp-block-button__link:focus {
	color: inherit !important;
}

/* Font Sizes
-------------------------------------------------------*/
@include bp-lg-down {
	.has-4-x-large-font-size,
	.has-3-x-large-font-size {
		font-size: var(--wp--preset--font-size--x-large) !important;
	}

	.has-2-x-large-font-size,
	.has-x-large-font-size {
		font-size: var(--wp--preset--font-size--large) !important;
	}
}