/**
 * Theme Name:       Horizon West Happenings
 * Theme URI:        https://horizonwesthappenings.com
 * Description:      Custom theme for the Horizon West Happenings
 * Author:           JiveDig
 * Author URI:       https://thestizmedia.com
 * Version:          2.0.0
 * Text Domain:      horizonwesthappenings
 * License:          GPL-2.0-or-later
 * License URI:      http://www.gnu.org/licenses/gpl-2.0.html
 *
 * Font Scale:       https://utopia.fyi/type/calculator/?c=400,16,1.2,1200,18,1.333,4,1,&s=0.75|0.5|0.25,1.5|2|3|4|6,s-l&g=s,l,xl,12
 * Fluid Spacing:    https://utopia.fyi/space/calculator/?c=400,16,1.2,1240,32,1.25,5,2,&s=0.75|0.5,1.5|2|4|6,s-l&g=s,l,xl,12
 */

/**
 * # Root
 */

 :root {
	--transition: all var(--transition-duration) var(--transition-easing);
	--transition-duration: 0.2s;
	--transition-easing: ease-in-out;
	--entry-transition: background-color var(--transition-duration) var(--transition-easing),
	                    color var(--transition-duration) var(--transition-easing),
	                    outline var(--transition-duration) var(--transition-easing),
	                    filter var(--transition-duration) var(--transition-easing),
	                    transform var(--transition-duration) var(--transition-easing);
}

/**
 * # Utility
 */

.has-auto-margin-top {
	margin-top: auto !important;
}

.is-style-heading {
	font-family: var(--wp--preset--font-family--geologica);
	font-style: normal;
	font-weight: 700;
	line-height: 1.25;
}

.has-z-index-1 {
	z-index: 1;
}

.term-button-links {
	list-style: none;
	display: flex;
	flex-wrap: wrap;
	gap: 8px;
	padding: 0;
	margin: 0;
}

.term-button-links a {
	display: inline-flex;
	padding: 6px 12px;
	background-color: var(--wp--preset--color--base-2);
	color: rgba(0, 0, 0, 0.5);
	text-decoration: none;
	border-radius: 100vw;
}

/**
 * # Header
 */

@media screen and (max-width: 799px) {

	:target {
		scroll-margin-top: 16px;
	}
}

@media screen and (min-width: 800px) {

	:target {
		scroll-margin-top: 116px;
	}

	body:not(.page-template-blank) header {
		position: sticky;
		top: calc( 0px + var( --wp-admin--admin-bar--height, 0px ) );
		background-color: var(--wp--preset--color--base);
		border-bottom: 3px solid var(--wp--preset--color--base-2);
		z-index: 100;
	}
}

/**
 * # Lists
 */

:where(ul, ol) {
	padding-inline-start: var(--wp--preset--spacing--20);
}

/**
 * # Forms
 */

/* Gravity Forms has it's own filter in inc/gravity.php */
textarea,
input[type="text"],
input[type="email"],
input[type="number"],
input[type="tel"],
input[type="url"],
input[type="search"],
input[type="password"] {
	padding: var(--wp--preset--spacing--10) var(--wp--preset--spacing--20);
	background-color: var(--wp--preset--color--base-2);
	border: 2px solid var(--wp--preset--color--base-3);
}

/* Placeholder */

textarea::placeholder,
input::placeholder {
	color: var(--wp--preset--color--contrast-2) !important;
}

/**
 * # Content
 */

.wp-block-post-content > * + :is(h2)  {
	margin-block-start: var(--wp--preset--spacing--50);
}

.wp-block-post-content {

	> p:has(img:first-child:last-child),
	> figure:has(img) {
		--wp--style--global--content-size: 860px;

		img {
			width: 100%;
			border-radius: var(--wp--preset--border-radius--default);
		}
	}
}

/**
 * # Images
 */

.wp-block-image > a,
.wp-block-image > figure > a {
	display: block;
}

/**
 * # Media Text
 */

.wp-block-media-text__content:has(> .wp-block-group:first-child:last-child) {
	padding: 0;
}

/**
 * # Read More Link
 */

.wp-block-read-more {

	&:hover,
	&:focus-visible {
		background-color: var(--wp--preset--color--primary);
		color: var(--wp--preset--color--base);
	}
}

/**
 * # Avatar
 */

.wp-block-avatar {
	border: .2em solid transparent;
	border-radius: 100vw;
	background:
		linear-gradient(white, white) padding-box,
		linear-gradient(to top, var(--wp--preset--color--primary) 30%, var(--wp--preset--color--secondary) 70%) border-box;
}

.avatar {
	border-radius: 100vw;
}

/**
 * # Entries
 *
 * Including HWH Business block styles.
 */

.hwh-business,
.hwh-business *,
.wp-block-post,
.wp-block-post *,
.wp-block-term:where(.hwh_location),
.wp-block-term:where(.hwh_location) * {
	transition: var(--entry-transition);
}

.hwh-business,
.wp-block-post:where(.post,.hwh_directory),
.wp-block-term:where(.hwh_location) {
	border-radius: var(--wp--preset--border-radius--default);

	&:hover,
	&:focus-visible {
		background-color: var(--wp--preset--color--base-2);

		.wp-block-post-terms:where(.taxonomy-hwh_category) {
			a:not(:hover, :focus-visible) {
				background-color: var(--wp--preset--color--base-3);
			}
		}

		.wp-block-read-more:not(:hover, :focus-visible) {
			background-color: var(--wp--preset--color--base-3);
		}
	}
}

.wp-block-post-title a:where(:hover, :focus-visible) {
	color: var(--wp--preset--color--primary);
}

/* Only do the movement hover animations on desktop. */
@media (hover: hover) and (pointer: fine) {
	.hwh-business,
	.wp-block-post:where(.post,.hwh_directory),
	.wp-block-term:where(.hwh_location) {

		&:hover,
		&:focus-visible {
			transform: translateY(-4px);

			.hwh-business__image,
			.wp-block-post-featured-image:where(.is-style-radius, .is-style-half-radius),
			.wp-block-term-image {
				transform: scale(1.05) rotate(-1deg);
				filter: brightness(1.1);
			}
		}
	}
}

/* # Home */

#hero {
	text-shadow: 0 2px 4px rgba(0,0,0,0.15);
}

@media screen and (max-width: 599px) {
	#hero {
		aspect-ratio: unset !important;
	}
}

/* # Posts | Single */

body.single-post .wp-block-post-date__modified-date:before {
	content: "(Updated: ";
}
body.single-post .wp-block-post-date__modified-date:after {
	content: ")";
}

/* # About / Team */

.team-member,
.team-member * {
	transition: var(--entry-transition);
}

.team-member:hover,
.team-member:focus-visible {
	img {
		transform: scale(1.05) rotate(-1deg);
		filter: brightness(1.15);
	}

	.wp-block-group {
		transform: translateY(-4px);
	}
}

/* # Directory */

/* ## Archive Directory */

.wp-block-post-terms:where(.taxonomy-hwh_location) a {
	display: inline-flex;
	align-items: center;
	gap: 0.1em;
}

.wp-block-post-terms:where(.taxonomy-hwh_location) a::before {
	display: inline-block;
	width: 1em;
	height: 1em;
	vertical-align: middle;
	background-color: currentColor;
	mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' aria-hidden='true'%3E%3Cpath d='M12 9c-.8 0-1.5.7-1.5 1.5S11.2 12 12 12s1.5-.7 1.5-1.5S12.8 9 12 9zm0-5c-3.6 0-6.5 2.8-6.5 6.2 0 .8.3 1.8.9 3.1.5 1.1 1.2 2.3 2 3.6.7 1 3 3.8 3.2 3.9l.4.5.4-.5c.2-.2 2.6-2.9 3.2-3.9.8-1.2 1.5-2.5 2-3.6.6-1.3.9-2.3.9-3.1C18.5 6.8 15.6 4 12 4zm4.3 8.7c-.5 1-1.1 2.2-1.9 3.4-.5.7-1.7 2.2-2.4 3-.7-.8-1.9-2.3-2.4-3-.8-1.2-1.4-2.3-1.9-3.3-.6-1.4-.7-2.2-.7-2.5 0-2.6 2.2-4.7 5-4.7s5 2.1 5 4.7c0 .2-.1 1-.7 2.4z'%3E%3C/path%3E%3C/svg%3E");
	mask-size: contain;
	mask-repeat: no-repeat;
	mask-position: center;
	content: "";
	/* content: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' aria-hidden='true'%3E%3Cpath d='M12 9c-.8 0-1.5.7-1.5 1.5S11.2 12 12 12s1.5-.7 1.5-1.5S12.8 9 12 9zm0-5c-3.6 0-6.5 2.8-6.5 6.2 0 .8.3 1.8.9 3.1.5 1.1 1.2 2.3 2 3.6.7 1 3 3.8 3.2 3.9l.4.5.4-.5c.2-.2 2.6-2.9 3.2-3.9.8-1.2 1.5-2.5 2-3.6.6-1.3.9-2.3.9-3.1C18.5 6.8 15.6 4 12 4zm4.3 8.7c-.5 1-1.1 2.2-1.9 3.4-.5.7-1.7 2.2-2.4 3-.7-.8-1.9-2.3-2.4-3-.8-1.2-1.4-2.3-1.9-3.3-.6-1.4-.7-2.2-.7-2.5 0-2.6 2.2-4.7 5-4.7s5 2.1 5 4.7c0 .2-.1 1-.7 2.4z'%3E%3C/path%3E%3C/svg%3E"); */
}

/* ## Single Directory/Members */

.job-links,
.business-links {
	list-style: none;
	display: flex;
	flex-direction: column;
	gap: var(--wp--preset--spacing--20);
	padding: 0;
	margin: 0;

	a {
		display: flex;
		align-items: center;
		gap: 0.5em;
	}
}
/**
 * # Jobs
 */

/* ## Archive Jobs */

.post-type-archive-hwh_job {

	.wp-block-post:where(.hwh_job):last-child .wp-block-columns {
		border-bottom-left-radius: var(--wp--preset--border-radius--default);
		border-bottom-right-radius: var(--wp--preset--border-radius--default);
	}

	.job-positions {
		font-size: var(--wp--preset--font-size--small);
		overflow: hidden;
		display: -webkit-box;
		-webkit-box-orient: vertical;
		-webkit-line-clamp: 2;
	}
}

/**
 * # Sugar Calendar
 */

/* ## Calendar Block */

.sugar-calendar-block__popover__event {
	overflow: hidden;
}

.sugar-calendar-block__popover__event__container {
	position: relative;

	.sugar-calendar-block__popover__event__container__image {
		width: 100%;
		height: auto;
		aspect-ratio: var(--wp--preset--aspect-ratio--hwh);
		overflow: hidden;
		transition: var(--transition);
	}

	&:hover,
	&:focus-within {
		.sugar-calendar-block__popover__event__container__image {
			transform: rotate(-1deg) scale(1.025);
		}
	}
}

.sugar-calendar-block__popover__event__container__content a::before {
	content: '';
	position: absolute;
	inset: 0;
	width: 100%;
	height: 100%;
}

/* ## Event List Block */

/* ### List & Grid View */

.sugar-calendar-event-list-block__listview__event:not(.happening-soon),
.sugar-calendar-event-list-block__gridview__event:not(.happening-soon) {
	position: relative;
	border-radius: var(--wp--preset--border-radius--half);
	border-top-right-radius: 100vw;
	border-bottom-right-radius: 20vw;
	outline: var(--wp--preset--border-radius--half) solid transparent;
	transition: var(--entry-transition);

	&:hover,
	&:focus-visible {
		/* --event-day-bg: var(--wp--preset--color--base-3); */
		--event-day-bg: white;
		background-color: var(--wp--preset--color--base-2);
		outline-color: var(--wp--preset--color--base-2);
		transform: translateY(-4px);

		.sugar-calendar-event-list-block__listview__event__body__image,
		.sugar-calendar-event-list-block__gridview__event__body__image {
			transform: scale(1.025) rotate(-2deg) translateY(-8px);
			filter: brightness(1.1);
			transition: var(--entry-transition);
		}
	}

	.sugar-calendar-event-list-block__listview__event__body__image,
	.sugar-calendar-event-list-block__gridview__event__body__image {
		transition: var(--entry-transition);
	}

	.sugar-calendar-event-list-block__event__title {
		font-size: var(--wp--preset--font-size--large);

		a:hover,
		a:focus-visible {
			text-decoration: none !important;
		}

		a::before {
			position: absolute;
			inset: 0;
			width: 100%;
			height: 100%;
			z-index: 1;
			content: "";
		}
	}
}

.sugar-calendar-event-list-block__event__desc {
	text-wrap: pretty;
}

/* ### List View */

.sugar-calendar-event-list-block__listview__event,
.sugar-calendar-event-list-block__listview__event__body {
	align-items: center;
}

.sugar-calendar-event-list-block__plain-view {

	.sugar-calendar-event-list-block__event__title {
		font-size: var(--wp--preset--font-size--medium) !important;
	}
}

.sugar-calendar-event-list-block__listview__event__day__block {
	background: var(--event-day-bg, var(--wp--preset--color--base-2)) !important;
	transition: background var(--transition-duration) var(--transition-easing);
}

.sugar-calendar-event-list-block .sugar-calendar-event-list-block__base-container .sugar-calendar-event-list-block__listview__event__day__block {
	border-radius: var(--wp--preset--border-radius--half);
}

.sugar-calendar-event-list-block .sugar-calendar-event-list-block__base-container .sugar-calendar-event-list-block__listview__event__body__image {
	flex: 0 0 33.3333%;
}

/* .sugar-calendar-event-list-block__listview__event__body__image, */
.sugar-calendar-event-list-block__gridview__event__body__image {
	margin-block-end: var(--wp--preset--spacing--20) !important;
}

.sugar-calendar-event-list-block__listview__event__body__image__container,
.sugar-calendar-event-list-block__gridview__event__body__image__container {
	/* height: 100% !important; */
	/* background-color: var(--wp--preset--color--base-2) !important; */
	background-color: var(--wp--preset--color--base-3) !important;
	background-size: contain !important;
	border-radius: var(--wp--preset--border-radius--default) !important;
}

.sugar-calendar-event-list-block .sugar-calendar-event-list-block__base-container .sugar-calendar-event-list-block__event__datetime {
	flex-wrap: wrap !important;
}

.home .sugar-calendar-event-list-block .sugar-calendar-event-list-block__base-container .sugar-calendar-event-list-block__event__datetime {
	justify-content: center !important;
}

/* ### Grid View */

.sugar-calendar-event-list-block__gridview__event__body__content {
	text-align: center !important;
}

/* ## Single Event */

.sc-frontend-single-event {
	p:empty {
		display: none;
	}
}

.sc-frontend-single-event__details,
#sc-recurring-upcoming-occurrences {
	padding: var(--wp--preset--spacing--30);
	background-color: var(--wp--preset--color--base-2);
	border-radius: var(--wp--preset--border-radius--default);
}

.sc-frontend-single-event__details-row {
	gap: 8px !important;
}

.sc-frontend-single-event__details-row:not(:first-child) {
	margin-block-start: var(--wp--preset--spacing--20);
}

.sc-frontend-single-event__details__label {
	flex: 1 0 100%;
}

.sc-frontend-single-event__details__val {
	font-size: 90%;
}

.sc-recurring-upcoming-occurrences__title {
	margin-block-end: 8px;
	font-weight: 700;
	text-wrap: pretty;
}

.sc-recurring-upcoming-occurrences__events {
	font-size: var(--wp--preset--font-size--small);
}

/**
 * # Gravity Forms
 */

.gform-theme--api,
.gform-theme--framework {
	--gf-ctrl-border-color-focus: transparent !important;
	--gf-ctrl-outline-color-focus: var(--wp--preset--color--primary) !important;
}

.gform-theme--foundation .gform_fields {
	--gf-form-gap-x: 8px;
	--gf-form-gap-y: var(--wp--preset--spacing--50);
}

.gform-theme--foundation .gform_footer,
.gform-theme--foundation .gform_page_footer {
	/* --gf-form-footer-margin-y-start: 0; */
}

div.gform_confirmation_message {
	background-color: var(--wp--preset--color--base-2);
	padding: 8px 16px;
	border: 1px solid var(--wp--preset--color--base-3);
	border-radius: var(--wp--preset--border-radius--default);
}
