/*
Theme Name:   Perma
Theme URI:    https://ceja.org
Author:       Ricky de Laveaga
Author URI:   https://artact.io
Description:  Frost Child Theme
Tags:         block-patterns, block-styles, custom-colors, custom-logo, custom-menu, editor-style, full-site-editing, one-column, template-editing, threaded-comments, translation-ready, wide-blocks
Template:     frost
Requires at least: 6.4
Tested up to: 6.4
Requires PHP: 7.0
Version:      1.0.8
License:      GNU General Public License v2 or later
License URI:  http://www.gnu.org/licenses/gpl-2.0.html
Text Domain:  perma

Perma WordPress Theme, (C) 2023-2024 CEJA.
Perma is distributed under the terms of the GNU GPL.
*/

/* utility classes */

.dib {
	display: inline-block;
}

/* overrides */

h1 strong,
h2 strong {
	font-weight: var(--wp--custom--font-weight--black);
}

h3 strong,
h4 strong,
h5 strong,
h6 strong {
	font-weight: var(--wp--custom--font-weight--bold);
}

.has-base-color.wp-block-button__link.wp-element-button {
	color: var(--wp--preset--color--ultra) !important;
}

.contrast .wp-block-button__link.wp-element-button {
	background-color: var(--wp--preset--color--contrast) !important;
	color: var(--wp--preset--color--ultra) !important;
}

a:where(:not(.wp-element-button)) {
	color: inherit;
}

a:where(:not(.wp-element-button)):hover {
	color: inherit;
}

a, a:focus, a:hover, a:not(.wp-element-button) {
	text-decoration-thickness: auto; /* 1px */
}

#wp--skip-link--target:has(.entry-content .has-base-ultra-gradient-background),
header:has(+ main .entry-content .has-base-ultra-gradient-background) {
	background-color: var(--wp--preset--color--ultra);
}

#wp--skip-link--target:has(.entry-content .has-base-ultra-gradient-background) {
	background: var(--wp--preset--gradient--base-ultra) !important;
}

.page-template-page-wide .entry-content.alignwide ul.is-style-no-disc li {
	padding-bottom: var(--wp--preset--spacing--small)
}

footer #can_embed_form_inner h2,
footer #can_embed_form_inner h4,
footer #can_embed_form_inner #action_info {
	display: none;
}

#can_embed_form h3,
.event_campaign #can_embed_form > h2,
.letter #can_embed_form h2.line {
	border-bottom: 0 !important;
}

#can_embed_form #d_sharing {
	border-top-color: transparent !important;
	border-top-style: none !important;
}

.can_button,
#donate_auto_modal input[type="submit"],
#donate_auto_modal .button,
#donate_make_recurring_modal input[type="submit"],
#donate_make_recurring_modal .button,
#can_embed_form input[type="submit"],
#can_embed_form .button {
	background-color: var(--wp--preset--color--primary) !important;
	border-radius: 5px !important;
	color: var(--wp--preset--color--ultra) !important;
	font-size: var(--wp--preset--font-size--x-small) !important;
	padding: 15px 30px !important;
	text-align: center !important;
	text-transform: capitalize !important;
}

.has-primary-background-color .can_button,
.has-primary-background-color #donate_auto_modal input[type="submit"],
.has-primary-background-color #donate_auto_modal .button,
.has-primary-background-color #donate_make_recurring_modal input[type="submit"],
.has-primary-background-color #donate_make_recurring_modal .button,
.has-primary-background-color #can_embed_form input[type="submit"],
.has-primary-background-color #can_embed_form .button {
	background-color: var(--wp--preset--color--contrast) !important;
}

.contrast .wp-block-button__link.wp-element-button:hover,
.has-base-color.wp-block-button__link.wp-element-button:hover,
.wp-element-button:hover,
.wp-block-button__link:hover,
.can_button:hover,
#donate_auto_modal input[type="submit"]:hover,
#donate_auto_modal .button:hover,
#donate_make_recurring_modal input[type="submit"]:hover,
#donate_make_recurring_modal .button:hover,
#can_embed_form input[type="submit"]:hover,
#can_embed_form .button:hover {
	background-color: var(--wp--preset--color--neutral) !important;
	color: var(--wp--preset--color--contrast) !important;
}

#can_embed_form #action_welcome_message #action_welcome_message_inner {
	background-color: inherit !important;
	border-color: var(--wp--preset--color--base) !important;
}

/* styles only in the editor? adding here to fix search icon alignment */
.wp-block-search .wp-block-search__button {
	align-items: center;
	/* border-radius: initial; */
	display: flex;
	height: auto;
	justify-content: center;
}

:where(.wp-block-search__button-inside .wp-block-search__inside-wrapper) {
	border: none;
	padding: 0;
}

:where(.wp-block-search__button-inside .wp-block-search__inside-wrapper) .wp-block-search__input,
.wp-block-search__button-only .wp-block-search__inside-wrapper .wp-block-search__input:has(+ .wp-block-search__button[aria-expanded='true']) {
	border-top-left-radius: 5px;
	border-bottom-left-radius: 5px;
	padding: 0 8px;
}

:where(.wp-block-search__button-only .wp-block-search__inside-wrapper) .wp-block-search__input {
	border: none;
}

.wp-block-search__button-inside .wp-block-search__button,
.wp-block-search__button-only .wp-block-search__button[aria-expanded='true'] {
	border-top-left-radius: 0;
	border-bottom-left-radius: 0;
	margin-left: 0;
}

body .is-layout-flow .staff-card h2,
body .is-layout-flow .staff-card p {
	margin-block-start: calc(var(--wp--custom--spacing--gap) / 2);
}

body .is-layout-flow .staff-grid h2,
body .is-layout-flow .staff-grid h3,
body .is-layout-flow .staff-grid p {
	margin-block-start: calc(var(--wp--custom--spacing--gap) / 3);
}

body .is-layout-flow .staff-grid h2 a {
	text-decoration: none;
}

body .is-layout-flow .staff-grid h2 a:focus,
body .is-layout-flow .staff-grid h2 a:hover {
	text-decoration: revert;
}

body .is-layout-flow .staff-card p,
body .is-layout-flow .staff-grid p {
	line-height: var(--wp--custom--line-height--heading);
}

.staff-grid .wp-block-image {
	margin-bottom: calc(var(--wp--custom--spacing--gap) / 1.25);
}

.home .wp-block-query .wp-block-query-pagination {
	visibility: hidden;
}

.site-header {
	position: sticky;
	top: 0px;
	z-index: 2;
}

.site-header .sticky-nav {
	margin-top: 0;
	padding-top: 15px;
	padding-bottom: 15px;
	width: 100%;
	background-color: var(--wp--preset--color--neutral);
	background-color: color-mix(in srgb, var(--wp--preset--color--neutral) 80%, transparent);
}

.site-header .sticky-nav .logo-only {
	width: 64px;
}

.site-header .sticky-nav .text-only {
	display: none;
}

.site-header .sticky-nav .logo-text {
	gap: 8px;
	align-items: flex-end;
}

/*.wp-block-site-logo {
	max-width: 76%;
}

@media screen and (min-width: 913px) {
	.wp-block-site-logo {
		max-width: 25%;
	}
}

@media screen and (min-width: 1024px) {
	.wp-block-site-logo {
		max-width: 76%;
	}
}*/

/*
https://github.com/WordPress/gutenberg/issues/12684
*/

.full-link a:after {
	display:block;
	position:absolute;
	left:0;
	top:0;
	width:100%;
	height:100%;
	content:'';
}

/* -- Images -- */

img.alignleft {
	display: block;
	float: left;
	margin-block-end: 12px;
	margin-inline-end: 12px;
}

img.alignright {
	display: block;
	float: right;
	margin-block-end: 12px;
	margin-inline-start: 12px;
}

p:has(img.alignleft):after,
p:has(img.alignright):after {
	content: "";
	display: table;
	clear: both;
}

.gt_selector {
	background-color: rgba(255, 255, 255, 0.5);
	border-radius: 5px;
	font-size: 1rem;
	padding: 4px;
}

.wp-block-jetpack-slideshow .wp-block-jetpack-slideshow_pagination.swiper-pagination-bullets, 
.wp-block-jetpack-slideshow .wp-block-jetpack-slideshow_pagination.swiper-pagination-custom {
	justify-content: center;
}

/* Modal */

#caModalTitle {
	color: var(--wp--preset--color--contrast);
	font-size: var(--wp--preset--font-size--small);
	margin: 0;
	text-align: center;
	line-height: 1.375;
}

@media screen and (max-width: 992px ) {
	#caModalTitle {
		font-size: var(--wp--preset--font-size--x-small);
	}
}

.modal-centered {
	align-items: center;
	display: flex;
	justify-content: center;
	max-width: calc(100vw - 16px);
}

.modal-header, .modal-body, .modal-footer {
	padding: 0;
	border: 0;
	max-width: 720px;
	display: flex;
	flex-direction: row;
	align-items: center;
	justify-content: center;
	margin: 0;
}

@media screen and (max-width: 639px) {
	.modal-header, .modal-body, .modal-footer {
		width: 288px;
	}
}

@media screen and (min-width: 639px) and (max-width: 992px ) {
	.modal-header, .modal-body, .modal-footer {
		width: 480px;
	}
}

.modal-header {
	margin-bottom: 24px;
	margin-top: 8px;
}

@media screen and (max-width: 992px ) {
	.modal-header {
		margin-bottom: 18px;
	}
}

.ceja-to-cejaaction {
	flex: 1;
	display: flex;
	flex-direction: row;
	justify-content: center;
}

.ceja-to-cejaaction img {
	width: 349px;
	height: 119px;
	display: block;
	max-width: 100%;
}

@media screen and (max-width: 992px ) {
	.ceja-to-cejaaction img {
		width: 233px;
		height: 79px;
	}
}

button.close {
	opacity: 1;
	align-self: flex-start;
	margin-top: 0;
	background: transparent;
	border: 0;
}

.close:hover, .close:focus {
	color: #000;
	cursor: pointer;
}

.ca-close-icon {
	background-image: url(./assets/images/ca-close-icon.webp);
	background-size: 30px;
	width: 30px;
	height: 30px;
	display: block;
}

@media screen and (max-width: 992px ) {
	.ca-close-icon {
		background-size: 20px;
		width: 20px;
		height: 20px;
	}
}

#ca-modal__link {
	display: flex;
	flex-direction: row;
	justify-content: center;
	align-items: center;
	text-decoration: none;
	/* Make this link clickable across device sizes */
	padding: 1.5rem;
	position: relative;
	margin: 0;
	z-index: 1;
}

#ca-modal__link:focus,
#ca-modal__link:hover {
	text-decoration: underline;
}

.ca-modal__link__text {
	color: #30627A;
	font-size: 1.25rem;
	text-transform: uppercase;
	margin-right: 7px;
}

@media screen and (max-width: 992px ) {
	.ca-modal__link__text {
		font-size: 1rem;
	}
}

.ca-modal__link__icon {
	background-image: url(./assets/images/ca-arrow-right.webp);
	background-size: 31px;
	width: 31px;
	height: 31px;
	display: block;
}

@media screen and (max-width: 992px ) {
	.ca-modal__link__icon {
		background-size: 21px;
		width: 21px;
		height: 21px;
	}
}

:popover-open {
	border: 0;
	border-radius: 1.5rem;
	margin: auto;
	padding: 8px;
}

::backdrop {
	backdrop-filter: blur(3px);
	background-color: rgba(0,0,0,0.25);
}

/* end Modal  */

/* media queries */

@media screen and (max-width: 399px) {
	.has-max-72-font-size {
		font-size: var(--wp--preset--font-size--x-large) !important;
	}
}

@media (min-width: 600px) {
	.wp-block-navigation__responsive-container-open:not(.always-shown) {
		display: flex;
	}

	.wp-block-navigation__responsive-container:not(.hidden-by-default):not(.is-menu-open) {
		display: none;
		position: fixed;
		width: auto;
	}
}

/* c3 = 1133; c4 = 901 */
@media (min-width: 1133px) {
	.site-header .sticky-nav .logo-only {
		width: 96px;
	}

	.site-header .sticky-nav .text-only {
		width: 142px;
		display: inline-block;
	}

	.wp-block-navigation__responsive-container-open:not(.always-shown) {
		display: none;
	}

	.wp-block-navigation__responsive-container:not(.hidden-by-default):not(.is-menu-open) {
		background-color: inherit;
		display: block;
		position: relative;
		width: 100%;
		z-index: auto;
	}
}