/* /////////////////
Nav Styles
////////////////// */
.menu-container .menu-container__inner {
	visibility: visible;
    transform: translateX(0%);
}
@media screen and (min-width: 1400px) {
	body a.custom-logo-link {
		height: 60px;
	}
}

/* ////////////////////
 * Images
 * ////////////////// */
body {
	figure a:has(svg):hover, 
	figure a:has(svg):focus {
		filter: brightness(1.05);
		scale: 1;
	}
}

/* ///////////////////
Typography
////////////////// */
::selection {
    color: var(--wp--preset--color--dark, #222) !important;
}

/* //////////////////
Accordion
////////////////// */
span.wp-block-accordion-heading__toggle-icon,
span.wp-block-accordion-heading__toggle-icon::after {
    height: calc(2.75rem + .5vw);
    width: calc(2.75rem + .5vw);
	min-width: calc(2.75rem + .5vw);
}

/* ////////////////
 * Fly Out
 /////////////////// */
#flyoutButton:hover {
	cursor: pointer;
}
#flyout {
    position: fixed;
    inset: 0;
    z-index: 9990;
	height: 100%;
	pointer-events: none;
	opacity: 0;
	background: color-mix(in srgb, var(--wp--preset--color--dark), transparent 30%);
	backdrop-filter: blur(5px);
}
#flyoutHolder {
	overflow-y: auto;
	width: clamp(40%, 45rem, 90%);
	opacity: 0;
    transform: translateX(100%);
	transition: opacity .3s ease, transform .3s ease;
	height: 100%;
}

body.flyout-open {
	#flyout {
		pointer-events: auto;
		opacity: 1;
	}
	#flyoutHolder {
		opacity: 1;
		transform: translateX(0%);
	}
	.wp-block-post-content {
		pointer-events: none;
	}
	&:hover {
		cursor: zoom-out;
	}
	&::after {
		opacity: 1;
	}
	header.wp-block-template-part::after {
		opacity: 1;
	}
	#flyoutContent {
		pointer-events: auto;
		cursor: auto;
	}
}
#flyoutContent svg {
	width: auto;
}

/* ////////////////////
Events Organiser
////////////////// */
ul.eo-events {
    list-style: none;
    padding: 0;
    display: grid;
    justify-content: center;
    gap: 2em;
	li {
		display: flex;
		flex-direction: column;
		gap: 0.25em;
		text-align: center;
		.event__title {
			font-size: calc(2.5rem + 1vw);
			font-weight: 700;
			line-height: 1;
		}
	}
}

/* /////////////////
Scroll To Div
////////////////// */
html {
	scroll-behavior: smooth;
}
div#scrollDestination {
    border: 1px solid transparent;
    border-radius: 1em;
}
.scroll-btn-clicked div#scrollDestination {
	animation-name: pulseBorder;
	animation-duration: 1s;
	animation-iteration-count: 2;
	animation-timing-function: ease;
	animation-delay: 0.5s;
}

@keyframes pulseBorder {
	0% {
		border-color: transparent;
	}
	50% {
		border-color: var(--wp--preset--color--primary);
	}
	100% {
		border-color: transparent;
	}
}