/*
 *MPS Block & Common Styles
 *These styles are used in multiple custom MPS Blocks
 *that would be included on nearly every page.
 *Enqueued in editor also to show icon styles etc.
 */

/*Hide block is used for blocks that are temporarily displayed
on front-end but saved when not in use. */

/*front-end*/
body .is-layout-flex.hide-block,
.hide-block {
	display: none;
}
/*editor*/
.block-editor-block-list__block.hide-block {display: flex;}

/*==Hidden Content & Triggers
Classes are added via Advanced Setting Controls in
Group, Button, Paragraph (link) and Heading Blocks
==*/

/*front-end*/
.mps-hidden-content {display: none;}

/*editor for visibility*/
.block-editor-block-list__block .wp-block-group.mps-hidden-content {
	display: flex;	
}

/*based on fa-xl circle-xmark*/
.mps-close-content {
	border-width: 0px;
	height: 40px;
	width: 40px;
	text-align: center;
	font-size: 1.5em;
}

.close-content-white .fa-circle-xmark {
	color: var(--wp--preset--color--white);
}

.close-content-white .fa-circle-xmark:hover {
	color: var(--wp--preset--color--light-grey);
}

.close-content-blue .fa-circle-xmark {
	color: var(--wp--preset--color--medium-blue);
}

.close-content-blue .fa-circle-xmark:hover {
	color: var(--wp--preset--color--white);
}

.close-content-orange .fa-circle-xmark {
	color: var(--wp--preset--color--medium-orange);
}

.close-content-orange .fa-circle-xmark:hover {
	color: var(--wp--preset--color--medium-orange-half);
}

/*==Content Trigger Styles==*/
/*replace display:inline-block to vertically center fa icons*/
p.content-trigger-angle,
p.content-trigger-caret,
.wp-block-heading.content-trigger-angle,
.wp-block-heading.content-trigger-caret,
.wp-block-heading.content-trigger-angle,
.wp-block-heading.content-trigger-caret,
.wp-block-buttons>.wp-block-button.content-trigger-angle,
.wp-block-buttons>.wp-block-button.content-trigger-caret {
    display: flex;
	align-items: center;
    margin: 0;
}

/*caret-style*/
p.content-trigger-caret.content-closed a::after,
.wp-block-heading.content-trigger-caret.content-closed a::after,
.wp-block-button.content-trigger-caret.content-closed a::after {
	text-rendering: auto;
	-webkit-font-smoothing: antialiased;
	font: var(--fa-font-sharp-solid);
	font-size: 1.2em;
	content: "\f0da";/*caret-right*/
	margin-left: .25em;
	transition: all 0.5s ease;
}

p.content-trigger-caret.content-open a::after,
.wp-block-heading.content-trigger-caret.content-open a::after,
.wp-block-button.content-trigger-caret.content-open a::after {
	text-rendering: auto;
	-webkit-font-smoothing: antialiased;
	font: var(--fa-font-sharp-solid);
	font-size: 1.2em;
	content: "\f0d7";/* caret-down*/
	margin-left: .25em;
	transition: all 0.5s ease;
}

/*angle-style*/
p.content-trigger-angle.content-closed a::after,
.wp-block-heading.content-trigger-angle.content-closed a::after,
.wp-block-button.content-trigger-angle.content-closed a::after {
	text-rendering: auto;
	-webkit-font-smoothing: antialiased;
	font: var(--fa-font-sharp-solid);
	content: "\f105";/*angle-right*/
	margin-left: .15em;
	transition: all 0.5s ease;
}

p.content-trigger-angle.content-open a::after,
.wp-block-heading.content-trigger-angle.content-open a::after,
.wp-block-button.content-trigger-angle.content-open a::after {
	text-rendering: auto;
	-webkit-font-smoothing: antialiased;
	font: var(--fa-font-sharp-solid);
	content: "\f107";/* angle-down*/
	margin-left: .15em;
	transition: all 0.5s ease;
}

/*==override default link color on dark backgrounds==*/
.wp-block-heading.has-white-color.content-trigger-angle a,
.wp-block-heading.has-white-color.content-trigger-caret a {
	color: var(--wp--preset--color--white);	
}

.wp-block-heading.has-white-color.content-trigger-angle a:hover,
.wp-block-heading.has-white-color.content-trigger-caret a:hover{
	color: var(--wp--preset--color--pale-grey);
}

.wp-block-heading.has-logo-lighter-green-color.content-trigger-angle a,
.wp-block-heading.has-logo-lighter-green-color.content-trigger-caret a {
	color: var(--wp--preset--color--logo-lighter-green);
}

.wp-block-heading.has-logo-lighter-green-color.content-trigger-angle a:hover,
.wp-block-heading.has-logo-lighter-green-color.content-trigger-caret a:hover{
	color: var(--wp--preset--color--medium-grey);
}

.wp-block-heading.has-dark-grey-color.content-trigger-angle a,
.wp-block-heading.has-dark-grey-color.content-trigger-caret a {
	color: var(--wp--preset--color--dark-grey);
}

.wp-block-heading.has-dark-grey-color.content-trigger-angle a:hover,
.wp-block-heading.has-dark-grey-color.content-trigger-caret a:hover{
	color: var(--wp--preset--color--medium-grey);
}

/*==mps-hidden-content inner block style adjustments==*/
.mps-hidden-content .wp-block-media-text .wp-block-media-text__content {
    padding: 0 6% 0 3%;
}

.mps-hidden-content .wp-block-media-text.has-media-on-the-right + p {
	/*background-color: var(--wp--preset--color--medium-orange-half);*/
	padding-left: 2%;
}

/*==Modifications for wp-jquery-ui-dialog for modals==*/
.ui-widget-overlay {
	background-color: var(--wp--preset--color--medium-blue);
	opacity: 0.9;
}

.ui-dialog {
	box-shadow: 0 3px 6px rgba(0, 59, 93, 0.3);
	border-radius: 0px;
	padding: 30px;
}

.mps-dialog .ui-dialog-titlebar {
	border-bottom: 0px;	
}

.mps-dialog .ui-dialog-content {
	color: var(--wp--preset--color--medium-blue);	
}

.mps-dialog .ui-dialog-title {
	font-family: var(--wp--preset--font-family--roboto);
	font-weight: 400;
	font-size: var(--wp--preset--font-size--medium);
	color: var(--wp--preset--color--medium-blue);
}

.mps-dialog .ui-dialog-buttonpane {
	border-top: 0px;
	padding: 16px 16px 0px;
}

.mps-dialog .ui-dialog-buttonpane .ui-button {
	display: inline-block;
	text-decoration: none;
	height: auto;
	margin: 0;
	padding: .25em 1em;
	cursor: pointer;
	border-width: 0px;
	white-space: nowrap;
	box-sizing: border-box;
	color: var(--wp--preset--color--white);
	background-color: var(--wp--preset--color--medium-blue);
	box-shadow: none;
	vertical-align: middle;
	font-family: var(--wp--preset--font-family--oswald);
	font-weight:400;
	text-transform:uppercase;
	font-size: var(--wp--preset--font-size--small);
}

.mps-dialog .ui-dialog-buttonpane .ui-button:hover {
	background-color: var(--wp--preset--color--medium-blue-half);
}

.mps-dialog .ui-dialog-titlebar .ui-button.ui-dialog-titlebar-close {
	border-width: 0px;
	height: 30px;
	width: 30px;
	margin-top: 5px;
	margin-right: 10px;
	padding: 0px 0px 0px;	
	letter-spacing: 0em;
}

.mps-dialog .ui-dialog-titlebar .ui-button.ui-dialog-titlebar-close::before {
	display: flex;
	justify-content: center;
	align-items: center;
	font: var(--fa-font-sharp-regular);
	font-size: var(--wp--preset--font-size--medium-large);
	content: "\f057";
	color: var(--wp--preset--color--medium-blue);
}

.mps-dialog .ui-button.ui-dialog-titlebar-close:hover::before,
.mps-dialog .ui-button.ui-dialog-titlebar-close:focus::before {
	background-color: var(--wp--preset--color--white);
	color: var(--wp--preset--color--medium-orange);
}

.google-maps {
    position: relative;
    padding-bottom: 75%; /* This is the aspect ratio */
    height: 0;
    overflow: hidden;
}

.google-maps iframe {
    position: absolute;
    top: 0;
    left: 0;
    width: 100% !important;
    height: 100% !important;
}

/*==Modifications for paragraphp - separate on desktop combined on mobile==*/
@media (max-width:959px) {
	.p-desktop {
		display: none;
	}
	
	.p-mobile {
		display: block;
		padding-left: 5vw;
		padding-right: 5vw;
	}
}

@media (min-width:960px) {

	.p-desktop {
		display: block;
	}
	
	.p-mobile {
		display: none;
	}
}

/*==Modifications for Cookie Notice Plugin Buttons to match MPS Style==*/
#cookie-notice .cn-button:not(.cn-button-custom){
	background-color: var(--wp--preset--color--medium-green);
	border: 0px;
	border-radius: 0px;
	font-family: var(--wp--preset--font-family--oswald);
	text-transform: uppercase;
	transition: 0.3s;
}

#cookie-notice .cn-button:not(.cn-button-custom):hover {
	background-color: var(--wp--preset--color--medium-green-alpha-6) !important;
}