@import "~sass-mq/mq";

@import "./core/fonts";
@import "./core/base";
@import "./core/typography";
@import "./core/global";

@import "./components/buttons";
@import "./components/forms";
@import "./components/lists";
@import "./components/menus";

@import "./core-blocks/wp-buttons";

.editor-styles-wrapper {
	.button {
		height: auto !important;
		font-size: 1.125rem !important;
		padding: 1.125rem 1.375rem !important;
		background-color: var(--wp--custom--colors--theme) !important;
		border-radius: var(--wp--custom--border-radius-lg) !important;
		border: 1px solid var(--wp--custom--colors--theme) !important;
		color: var(--wp--custom--colors--white) !important;
		&.is-style-white,
		&.is-style-transparent {
			display: inline-flex !important;
			background-color: transparent !important;
			color: var(--wp--custom--colors--theme) !important;
			border: 1px solid var(--wp--custom--colors--theme) !important;
		}
		&.is-style-white.down-arrow-circle-icon {
			padding: 9px 20px 9px 12px !important;
		}
		&.is-style-secondary {
			display: inline-flex !important;
			background-color: transparent !important;
			color: var(--wp--custom--colors--theme) !important;
			border: none !important;
		}
	}
	.wp-block-button {
		&.is-style-white {
			.wp-block-button__link {
				color: var(--wp--custom--colors--theme) !important;
				background-color: transparent !important;
				&:hover {
					color: var(--wp--custom--colors--cp-navy) !important;
				}
			}
		}
		&.is-style-secondary {
			&.right-arrow-white-icon {
				.wp-block-button__link {
					color: var(--wp--custom--colors--white) !important;
					&::before {
						content: url("../img/button-icons/right-arrow-white.svg") !important;
					}
					&:hover {
						&::before {
							content: url("../img/button-icons/right-arrow-cp-navy.svg") !important;
						}
					}
				}
			}
			&.play-white {
				.wp-block-button__link {
					&::before {
						content: url("../img/button-icons/play-white.svg") !important;
					}
					&:hover {
						&::before {
							content: url("../img/button-icons/play-cp-navy.svg") !important;
						}
					}
				}
			}
		}

		&.is-style-link {
			.wp-block-button__link {
				color: var(--wp--custom--colors--theme) !important;
				&:hover {
					color: var(--wp--custom--colors--cp-navy) !important;
				}
			}
		}
		&.is-style-outline-theme {
			.wp-block-button__link {
				background-color: transparent !important;
			}
		}
		&.is-style-outline-white {
			.wp-block-button__link {
				&:hover {
					background-color: transparent !important;
				}
			}
		}
	}
}