/********************************************************/
/*
/*      Block CSS
/*
/********************************************************/
.wp-block-post-content {
	/* Gutenberg style override */
	:root & :where(.is-layout-constrained) > * {
		margin-block-start: 0;
	}
	
	:root & :where(.is-layout-flow) > * {
		&.wp-block-buttons {
			margin-block-start: 2.5em;
		}
	} 
	
	/* Full-width background support */
	& > .has-background:not(.alignfull) {
		position: relative;
		
		&::before {
			content: '';
			position: absolute;
			top: 0;
			left: calc((var(--wp--custom--viewport-width) - 100%) / 2 * -1);
			width: var(--wp--custom--viewport-width);
			height: 100%;
			background-color: inherit;
			z-index: -1;
		}
	}
	
	/* First block top margin adjustments */
	/* Remove if theme does not have blocks that go behind the header */
	& > :first-child {
		/* Move some blocks behind the header */
		&:is(.wp-block-cover) {
			margin-block-start: calc(var(--wp--custom--stickied-header-height) * -1) !important;
		}
		
		/* All other blocks are positioned after the header */
		& {
			margin-block-start: calc(var(--wp--custom--header-height) - var(--wp--custom--stickied-header-height)) !important;
		}
	}
	
	/* Block alignments */
	& > :not(.alignleft, .alignright, .alignwide, .alignfull):is(:not(.alignleft, .alignright, .alignwide, .alignfull)) {
		/* margin-left: 0 !important; */
		margin-left: calc(var(--wp--custom--wide-pad) - var(--wp--custom--outer-pad)) !important;
		margin-right: auto !important;
		
		body.wp-admin & {
			margin-left: var(--wp--custom--outer-pad) !important;
			
			&:has(> .components-placeholder) {
				margin-left: auto !important;
			}
		}
	}
}

/************************************************************/
/* Gutenberg blocks
/************************************************************/
/******************************/
/* Columns
/******************************/
/* Responsive-adjusted style */
.wp-block-columns.responsive-adjust {
	@media (width <= 1000px) {
		flex-wrap: wrap !important;
		
		.wp-block-column {
			flex-basis: 100% !important;
		}
	}
}

/******************************/
/* Cover
/******************************/
.wp-block-cover {
	min-height: 380px;
	
	&.multiply > .wp-block-cover__background {
		mix-blend-mode: multiply;
	}
	
	/* Responsive ****************************************************/
	@media (width <= 1200px) {
		min-height: 300px;
	}
	
	@media (width <= 1000px) {
		min-height: 275px;
	}
	
	@media (width <= 800px) {
		min-height: 240px;
	}
}

/******************************/
/* Group
/******************************/
.wp-block-group {
	position: relative;
	
	/* Gradients/Circles style variations */
	&:is([class*="gradient"], [class*="circle"]) {
		overflow: clip;
		
		&:not(:has(> .components-placeholder:only-child))::after {
			content: '';
			position: absolute;
			height: auto;
			background-repeat: no-repeat;
			opacity: 1;
			pointer-events: none;
			transition: opacity var(--wp--custom--speed--medium);
		}
		
		/* Gradients */
		&[class*="gradient"] {
			&:not(:has(> .components-placeholder:only-child))::after {
				left: var(--wp--preset--spacing--1-5);
				bottom: var(--wp--preset--spacing--1-5);
				width: calc(100% - (var(--wp--preset--spacing--1-5) * 2));
				aspect-ratio: 410/109;
				background-size: cover;
				scale: 1 -1;
			}
			
			/* Light gradient */
			&[class*="is-style-light-gradient"]::after {
				background-image: url(../images/gradient-rect-tall-beige.png);
			}
			
			/* Dark gradient */
			&[class*="is-dark-light-gradient"]::after {
				background-image: url(../images/gradient-rect-tall-dark-blue.png);
			}
		}
		
		/* Circles */
		&[class*="circle"] {
			&:not(:has(> .components-placeholder:only-child))::after {
				left: 10%;
				top: 2.5%;
				width: 150%;
				aspect-ratio: 497/496;
				background-size: contain;
			}
			
			/* Light circle */
			&[class*="is-style-light-circle"]::after {
				background-image: url(../images/gradient-circle-thin-beige-xl.png);
			}
			
			/* Dark circle */
			/* &[class*="is-style-dark-circle"]::after {
				background-image: url(../images/gradient-circle-thin-dark-blue.png);
			} */
		}
		
		/* 'On hover' variations */
		&[class*="on-hover"]:not(:hover, :focus, :active)::after {
			opacity: 0;
		}
	}
	
	/* Responsive ****************************************************/
	@media (width <= 800px) {
		&.is-layout-flex:not(.is-vertical) {
			flex-wrap: wrap;
		}
	}
}

/* Gradients style variations */
.wp-block-group[class*="gradient"] {
	overflow: clip;
}

/******************************/
/* Image
/******************************/
.wp-block-image {
	margin-block-end: unset;
	
	/* Fill style variations */
	:has(> &[class*="is-style-fill"]) {
		position: relative;
		
		&.wp-block-column {
			align-self: stretch;
		}
		
		& > [class*="is-style-fill"] {
			&:not(.cover, .contain) * {
				object-fit: cover;
			}
			
			/* Fill width */
			&.is-style-fill-width,
			&.is-style-fill-width * {
				width: 100% !important;
			}
			
			/* Fill height */
			&.is-style-fill-height,
			&.is-style-fill-height * {
				height: 100% !important;
			}
			
			/* Fill both */	
			&.is-style-fill-both,
			&.is-style-fill-both * {
				width: 100% !important;
				height: 100% !important;
			}
			
			&.is-style-fill-both * {
				position: absolute;
				inset: 0;
			}
		}
	}
	
	/* Backend style */
	&[class*="is-style-fill"]:not(.is-resized) .components-resizable-box__container {
		display: contents !important;
	}
	
	/* Responsive ****************************************************/
	@media (width <= 800px) {
		&, & img {
			max-height: 60svh;
			object-fit: cover;
		}
	}
}

/******************************/
/* List
/******************************/
ul.wp-block-list {
	&:is(ul) {
		padding-inline-start: unset !important;
		
		& > li {
			display: flex;
			align-items: baseline;
			column-gap: var(--wp--preset--spacing--0-50);
			list-style: unset;
			
			&::before {
				content: '-';
			}
			
			& + li {
				margin-block-start: var(--wp--preset--spacing--0-25);
			}
			
			:is(div, b, strong, em):not([role="textbox"]) {
				display: contents;
			}
		}
	}
	
	&:is(ol) {
		padding-inline-start: 24px !important;
	}
}

/******************************/
/* Media-text
/******************************/
.wp-block-media-text {
	grid-template-columns: 48.75% 40% !important;
	justify-content: space-between;
	
	&.has-media-on-the-right {
		grid-template-columns: 40% 48.75% !important;
	}
	
	.wp-block-media-text__media {
		position: relative;
		overflow: clip;
		
		&::after {
			content: '';
			position: absolute;
			left: 2.5%;
			bottom: 2.5%;
			width: auto;
			max-width: 95%;
			height: 40%;
			aspect-ratio: 410/109;
			scale: 1 -1;
			background-image: url(../images/gradient-rect-tall-beige.png);
			background-size: cover;
			background-repeat: no-repeat;
			pointer-events: none;
		}
	}
	
	.wp-block-media-text__content {
		display: flex;
		flex-direction: column;
		justify-content: space-between;
		height: 100%;
		padding-inline: unset;
		
		& > * {
			margin-block: unset;
			
			& + * {
				margin-block-start: 1em;
			}
			
			&.wp-block-group {
				display: flex;
				flex-direction: column;
			}
		}
	}
	
	/* Responsive ****************************************************/
	@media (width <= 1200px) {
		grid-template-columns: 48.75% 45% !important;
		
		&.has-media-on-the-right {
			grid-template-columns: 45% 48.75% !important;
		}
	}
	
	@media (width <= 1000px) {
		grid-template-columns: 48.75% 48.75% !important;
		
		&.has-media-on-the-right {
			grid-template-columns: 48.75% 48.75%!important;
		}
	}
	
	@media (width <= 800px) {
		grid-template-columns: 65% 20% 1fr !important;
		row-gap: var(--wp--preset--spacing--3);
		
		&.has-media-on-the-right {
			grid-template-columns: 1fr 20% 65% !important;
		}
		
		.wp-block-media-text__media {
			grid-row: 1 !important;
			grid-column: 1;
			max-height: 60svh;
			
			.has-media-on-the-right > & {
				grid-column: 3;
			}
		}
		
		.wp-block-media-text__content {
			grid-row: 2 !important;
			grid-column: 1 / span 2;
			
			.has-media-on-the-right > & {
				grid-column: 2 / span 2;
				text-align: right;
				
				& > .wp-block-group {
					align-items: end;
				}
			}
		}
	}
	
	@media (width <= 700px) {
		grid-template-columns: 75% 20% 1fr !important;
		
		&.has-media-on-the-right {
			grid-template-columns: 1fr 20% 75% !important;
		}
	}
}

/******************************/
/* Separator
/******************************/
.wp-block-separator {
	width: 100%;
}

/******************************/
/* Spacer
/******************************/
.wp-block-spacer {
	max-height: 100svh;
}

/******************************/
/* Video
/******************************/
.wp-block-video {
	position: relative;
	
	&::before,
	&::after {
		content: '';
		position: absolute;
		opacity: 1;
		pointer-events: none;
		transition: opacity var(--wp--custom--speed--medium);
	}
	
	&.played::before,
	&.played::after {
		opacity: 0;
	}
	
	&::before {
		inset: 0;
		width: 100%;
		height: 100%;
		background-color: var(--wp--preset--color--ebony-clay-blue);
		opacity: .45;
		mix-blend-mode: multiply;
		z-index: 1;
	}
	
	&::after {
		height: auto;
		background-repeat: no-repeat;
		top: 50%;
		left: 50%;
		width: 12.5%;
		height: auto;
		max-height: 50%;
		aspect-ratio: 1;
		background-image: url(../images/play.svg);
		background-size: contain;
		translate: -50% -50%;
		z-index: 2;
	}
}

/************************************************************/
/* Cake blocks
/************************************************************/
/******************************/
/* Accordions (+ sub-blocks)
/******************************/
.wp-block-cke-accordions {
	& > .wp-block-cke-accordion-item {
		background-color: unset;
		padding: unset;
		border-radius: unset;
		
		& ~ .wp-block-cke-accordion-item {
			margin-block-start: unset;
		}
		
		& > .wp-block-cke-accordion-head {
			display: block;
			padding: var(--wp--preset--spacing--1) var(--wp--preset--spacing--0-75) var(--wp--preset--spacing--0-75);
			border-block-end: 2px solid var(--wp--custom--color--default--accent);
			
			& > .wp-block-heading {
				display: flex;
				justify-content: space-between;
				align-items: center;
				gap: var(--wp--preset--spacing--0-50);
				width: 100%;
				min-width: 100%;
				color: var(--wp--custom--color--default--accent);
				transition: color var(--wp--custom--speed--medium);
				
				:is(:hover, :focus, :active) > & {
					color: var(--wp--custom--color--default--text);
				}
				
				&::after {
					content: '+';
					display: inline-block;
					min-width: 26px;
					font-family: inherit;
					font-size: var(--wp--preset--font-size--x-large);
					line-height: inherit;
					font-weight: inherit;
					text-align: center;
					color: inherit;
				}
				
				input:checked + .wp-block-cke-accordion-item > .wp-block-cke-accordion-head > &::after {
					content: '-';
				}
			}
		}
		
		& > .wp-block-cke-accordion-body {
			& > .wp-block-cke-accordion-body__inner > * {
				margin-block: unset;
				margin-inline: var(--wp--preset--spacing--0-75);
				
				& + * {
					margin-block-start: 1em;
				}
				
				&:first-child {
					margin-block-start: var(--wp--preset--spacing--1);
				}
				
				&:last-child {
					margin-block-end: var(--wp--preset--spacing--1);
				}
			} 
		}
	}
}

/******************************/
/* Grid
/******************************/
.wp-block-cke-grid {
	/* Responsive ****************************************************/
	@media (width <= 1000px) {
		.acf-innerblocks-container {
			--max-cols: 1;
		}
	}
}

/******************************/
/* Slider
/******************************/
.wp-block-cke-slider {
	position: relative;
	
	&:not(.ready) * {
		transition: unset !important;
	}
	
	&.sliding * {
		pointer-events: none !important;
	}
	
	.slider-items {
		position: relative;
		left: 50%;
		translate: calc((var(--slide-width) + var(--gap)) * (var(--slide) * -1) - (var(--slide-width) / 2));
		transition: translate var(--wp--custom--speed--slower);
		
		& > .wp-block-group,
		& > .block-editor-inner-blocks > .block-editor-block-list__layout > .wp-block-group {
			min-width: calc(min(100%, var(--wp--custom--full-size)) * .45);
			max-width: calc(min(100%, var(--wp--custom--full-size)) * .45);
			height: 100%;
			background-color: transparent;
			border-radius: unset;
			overflow: visible;
			scale: 1;
			translate: 0%;
			/* transition: scale var(--wp--custom--speed--slower), translate var(--wp--custom--speed--slower), z-index 0s calc(var(--wp--custom--speed--slower) /2) allow-discrete; */
			transition: scale var(--wp--custom--speed--slower), translate var(--wp--custom--speed--slower);
			
			&::before,
			&::after {
				content: '';
				position: absolute;
				pointer-events: none;
				width: 100%;
				max-width: calc(75% / (173 / 126));
				height: 70px;
				background-image: url(../images/gradient-rect-small-dark-blue.png);
				background-size: cover;
				background-position: bottom;
				background-repeat: no-repeat;
				opacity: 1;
				z-index: 2;
				transition: max-width var(--wp--custom--speed--slower), top var(--wp--custom--speed--slower);
				animation-name: none;
				animation-duration: var(--wp--custom--speed--slower);
				animation-fill-mode: forwards;
				animation-play-state: paused;
				animation-timing-function: ease;
			}
			
			&:nth-child(odd)::before,
			&:nth-child(odd)::after {
				top: calc(12.5% + 3px);
			}
			
			&:nth-child(even)::before,
			&:nth-child(even)::after {
				top: calc(12.5% - 3px);
			}
			
			&::before {
				left: 0;
				rotate: 90deg;
				transform-origin: top left;
			}
			
			&::after {
				right: 0;
				rotate: -90deg;
				transform-origin: top right;
			}
			
			/* Slide transform */
			&.active {
				z-index: 3;
			}
			
			&:has(+ .active),
			.active + & {
				scale: .75;
				z-index: 2;
				
				&:has(+ .active) {
					translate: 45%;
				}
				
				.active + & {
					translate: -45%;
				}
				
				&::before,
				&::after {
					top: calc(10% - 6px);
					max-width: calc(80% / (173/126));
				}
				
				&:nth-child(odd)::before,
				&:nth-child(odd)::after {
					top: calc(10% + 6px);
				}
				
				&:nth-child(even)::before,
				&:nth-child(even)::after {
					top: calc(10% - 6px);
				}
			}
			
			&:has(+ * + .active),
			.active + * + & {
				scale: .6;
				z-index: 1;
				
				&:has(+ * + .active) {
					translate: 100%;
					
					&::before {
						opacity: 0;
					}
				}
				
				.active + * + & {
					translate: -100%;
					
					&::after {
						opacity: 0;
					}
				}
			}
			
			.sliding > .slider-items > & {
				&::before,
				&::after {
					animation-name: fade-out-in;
					animation-play-state: running;
				}
			}
			
			/* Slide content */
			& > .wp-block-image {
				position: relative;
				width: 100%;
				max-width: 100%;
				height: auto;
				aspect-ratio: 173/126;
				margin-block: unset;
				translate: 0 0;
				transition: width var(--wp--custom--speed--slower), height var(--wp--custom--speed--slower), translate var(--wp--custom--speed--slower);
				
				&::after {
					content: '';
					position: absolute;
					pointer-events: none;
					left: 2.5%;
					bottom: 2.5%;
					width: auto;
					max-width: 95%;
					height: 40%;
					aspect-ratio: 410/109;
					scale: 1 -1;
					background-image: url(../images/gradient-rect-tall-beige.png);
					background-size: cover;
					background-repeat: no-repeat;
					opacity: 0;
					transition: opacity var(--wp--custom--speed--medium);
				}
				
				.active > &::after {
					opacity: 1;
					transition: opacity var(--wp--custom--speed--medium) calc(var(--wp--custom--speed--medium) / 2);
				}
				
				.looping > .slider-items > .wp-block-group > &::after {
					transition: unset;
				}
				
				& + * {
					margin-block-start: var(--wp--preset--spacing--4);
				}
				
				& img {
					position: absolute;
					inset: 0;
					width: 100%;
					height: 100%;
					object-fit: cover;
				}
			}
			
			& > :not(.wp-block-image) {
				transition: opacity var(--wp--custom--speed--medium);
				
				:not(.active) > & {
					opacity: 0;
					pointer-events: none;
				}
			}
		}
		
		& > *,
		& > .block-editor-inner-blocks > .block-editor-block-list__layout > :not(.block-list-appender, .wp-block-query) {
			max-height: unset;
			aspect-ratio: unset;
		}
	}
	
	.controls {
		justify-self: center;
		position: absolute;
		top: calc(var(--slide-image-height, 100%) + calc(var(--wp--preset--spacing--4) / 3));
		margin-block-start: unset;
		
		& > .wp-block-button {
			display: none;
		}
		
		& > .indicators {
			& > span {
				display: flex;
				justify-content: center;
				align-items: center;
				width: 18px;
				height: 18px;
				background-color: transparent;
				border: 1px solid var(--wp--custom--color--default--text);
				
				&.active {
					pointer-events: none;
				}
				
				&::after {
					content: '';
					display: block;
					width: 12px;
					height: 12px;
					background-color: var(--wp--custom--color--default--text);
					border-radius: 50%;
					opacity: 0;
					transition: opacity var(--wp--custom--speed--medium);
				}
				
				&.active::after {
					opacity: 1;
				}
			}
		}
	}
	
	/* Backend style ****************************************************/
	:is(.edit-post-visual-editor, .editor-styles-wrapper) & {
		--slide-width: 100%;
		
		&:is(.is-selected, .has-child-selected) {
			& > .slider-items {
				flex-direction: column !important;
				left: 0 !important;
				translate: unset !important;
				
				& > .block-editor-inner-blocks > .block-editor-block-list__layout > .wp-block-group {
					translate: unset !important;
					scale: 1 !important;
					
					&::before,
					&::after {
						display: none !important;
					}
					
					&:not(.active) > :not(.wp-block-image) {
						opacity: 1 !important;
						pointer-events: all !important;
					}
				}
			}
		}
	}
	
	/* Responsive ****************************************************/
	@media (width <= 1200px) {
		.slider-items {
			& > .wp-block-group,
			& > .block-editor-inner-blocks > .block-editor-block-list__layout > .wp-block-group {
				min-width: calc(min(100%, var(--wp--custom--full-size)) * .6);
				max-width: calc(min(100%, var(--wp--custom--full-size)) * .6);
			}
		}
	}
	
	@media (width <= 900px) {
		.slider-items {
			& > .wp-block-group,
			& > .block-editor-inner-blocks > .block-editor-block-list__layout > .wp-block-group {
				min-width: calc(min(100%, var(--wp--custom--full-size)) * .66);
				max-width: calc(min(100%, var(--wp--custom--full-size)) * .66);
			}
		}
	}
	
	@media (width <= 600px) {
		.slider-items {
			& > .wp-block-group,
			& > .block-editor-inner-blocks > .block-editor-block-list__layout > .wp-block-group {
				min-width: calc(min(100%, var(--wp--custom--full-size)) * .9);
				max-width: calc(min(100%, var(--wp--custom--full-size)) * .9);
				
				&::before,
				&::after {
					display: none;
				}
			}
		}
	}
	
	@media (width <= 450px) {
		.slider-items {
			& > .wp-block-group,
			& > .block-editor-inner-blocks > .block-editor-block-list__layout > .wp-block-group {
				min-width: calc(min(100%, var(--wp--custom--full-size)) * 1);
				max-width: calc(min(100%, var(--wp--custom--full-size)) * 1);
			}
		}
	}
}

/* Used by gradient pseudo-elements of slide items */
@keyframes fade-out-in {
	0%   { opacity: 1; }
	33%  { opacity: 0; }
	50%  { opacity: 0; }
	100% { opacity: 1; }
}

/************************************************************/
/* Other blocks/elements
/************************************************************/
/******************************/
/* Limited width
/* (For elements with no
/* max-width control in editor)
/******************************/
h1, h2, h3, h4, h5, h6, p {
	&.limited-width-l {
		&,
		.edit-post-visual-editor .is-root-container & {
			max-width: min(40rem, 100%);
		}
	}
	
	&.limited-width {
		&,
		.edit-post-visual-editor .is-root-container & {
			max-width: min(37.5rem, 100%);
		}
	}
	
	&.limited-width-s {
		&,
		.edit-post-visual-editor .is-root-container & {
			max-width: min(28.125rem, 100%);
		}
	}
	
	&.limited-width-xs {
		&,
		.edit-post-visual-editor .is-root-container & {
			max-width: min(20rem, 100%);
		}
	}
}

/******************************/
/* Buttons
/******************************/
.wp-block-button,
.menu-item.btn,
body:not(.wp-admin, .login) .gfield--type-fileupload .ginput_container_fileupload,
body:not(.wp-admin, .login) .gform_footer {
	position: relative;
	max-width: 100%;
	padding: unset;
	
	& > :is(.wp-block-button__link, a),
	&.gform_footer {
		/* For increased specificity (GForm submit button especially needs it) */
		&:is(.wp-block-button__link, a):is(.wp-block-button__link, a),
		&.gform_footer {
			display: inline-block;
			position: relative;
			width: max-content;
			max-width: 100%;
			height: 100%;
			font-size: var(--wp--preset--font-size--small);
			font-weight: 600;
			color: var(--wp--custom--color--default--bg);
			background-color: var(--wp--custom--color--default--accent);
			padding: var(--wp--preset--spacing--0-75) var(--wp--preset--spacing--1-5) calc(var(--wp--preset--spacing--0-75) - 3px);
			border-radius: var(--wp--custom--border-radius--small);
			transition: color var(--wp--custom--speed--medium), background-color var(--wp--custom--speed--medium), scale var(--wp--custom--speed--medium);
			scale: 1;
			
			&::after {
				content: '';
				position: absolute;
				inset: 0;
				width: 100%;
				height: 100%;
				background-image: var(--wp--custom--effects--noise);
				background-size: contain;
				background-repeat: repeat;
				opacity: .66;
				z-index: -1;
			}
			
			&:is(:hover, :focus, :active) {
				background-color: var(--wp--custom--color--default--focus);
				
				/* When in the backend editor, do not set selected button's bg color to blue, since it obscures the text selection highlight */
				:is(.edit-post-visual-editor, .editor-styles-wrapper) .is-root-container .wp-block-button.is-selected & {
					& {
						background-color: var(--wp--custom--color--default--accent) !important;
					}
					
					.wp-block-button.is-style-light & {
						color: var(--wp--custom--color--default--text) !important;
						background-color: var(--wp--custom--color--default--bg) !important;
					}
				}
			}
			
			&:active {
				scale: 0.975;
			}
		}
	}
	
	/* Light style variation */
	&:is(.is-style-light, .btn-light) {
		& > :is(.wp-block-button__link, a):is(.wp-block-button__link, a) {
			color: var(--wp--custom--color--default--text);
			background-color: var(--wp--custom--color--default--bg);
			
			&:is(:hover, :focus, :active) {
				color: var(--wp--custom--color--default--bg);
				background-color: var(--wp--custom--color--default--focus);
			}
		}
	}
}

/* Popup open/close buttons */
button:is(.burger-popup-open, .burger-popup-close) {
	position: relative;
	width: 24px;
	height: 24px;
	background-color: transparent;
	padding: unset;
	border: unset;
	cursor: pointer;
	
	& > svg {
		width: 100%;
		height: 100%;
		fill: var(--wp--custom--color--default--text);
		transition: fill var(--wp--custom--speed--fast);
		
		.wp-site-blocks:has(.site-head + #burger-popup:not(:popover-open)) & {
			opacity: 1;
			transition: fill var(--wp--custom--speed--fast), opacity var(--wp--custom--speed--medium) var(--wp--custom--speed--fast);
		}
		
		.wp-site-blocks:has(.site-head + #burger-popup:popover-open) :not(:hover, :focus, :active) > & {
			fill: var(--wp--preset--color--white);
		}
	}
	
	&:is(:hover, :focus, :active) {
		& > svg {
			fill: var(--wp--custom--color--default--accent);
		}
	}
}

/******************************/
/* Forms/inputs
/******************************/
body:not(.wp-admin, .login) .gform_wrapper {
	container-type: inline-size;
	container-name: form-wrapper;
	
	.gform_fields {
		grid-template-columns: repeat(2, minmax(0, 1fr));
		column-gap: var(--wp--preset--spacing--2-5);
		row-gap: var(--wp--preset--spacing--2);
		
		/* Fields */
		.gfield {
			grid-column: span 2;
			
			&.gfield--width-half {
				grid-column: span 1;
			}
			
			:is(input, select, textarea):not([type="submit"], [type="button"], [class*="adminbar"]),
			&.gfield--type-choice label,
			&.gfield--type-fileupload > .ginput_container_fileupload::after,
			&.gfield--type-fileupload .file-name {
				font-family: var(--wp--preset--font-family--matter);
				font-size: var(--wp--preset--font-size--small);
				line-height: 1.2;
				font-weight: 600;
			}
			
			.gfield_required_text {
				display: none;
			}
			
			:is(input, select, textarea):not([type="submit"], [type="button"] [class*="adminbar"], [class*="ui-datepicker"]),
			&.gfield--type-fileupload > .ginput_container_fileupload {
				width: 100% !important;
				height: auto !important;
				color: var(--wp--custom--color--default--text);
				background-color: transparent;
				padding: var(--wp--preset--spacing--1);
				padding-block-end: calc(var(--wp--preset--spacing--1) - 3px);
				border: 1px solid var(--wp--custom--color--default--text);
				border-radius: var(--wp--custom--border-radius--small);
				box-sizing: border-box;
				box-shadow: unset !important;
				outline: unset !important;
				resize: none;
			}
			
			/* File upload input */
			&.gfield--type-fileupload {
				grid-column: span 1 !important;
				margin-block-end: var(--wp--preset--spacing--6);
				
				&, & > .ginput_container_fileupload {
					position: relative;
				}
				
				.ginput_container_fileupload {
					box-sizing: border-box;
					cursor: pointer;
					
					&::before,
					&::after {
						content: '';
						display: block;
					}
					
					&::before {
						position: absolute;
						top: 50%;
						right: var(--wp--preset--spacing--1);
						width: 16px;
						height: auto;
						max-height: 50%;
						aspect-ratio: 113/150;
						background: url(../images/upload.svg) no-repeat center / contain;
						filter: var(--wp--custom--color--pale-oyster-brown--filter);
						pointer-events: none;
						translate: 0 -50%;
					}
					
					&::after, 
					& .file-name {
						max-width: calc(100% - (var(--wp--preset--spacing--1) * 3) - 16px);
					}
					
					body.fr & {
						&::after {
							content: 'Téléverser votre CV';
						}
					}
					
					body.en & {
						&::after {
							content: 'Upload your CV';
						}
					}
					
					.gfield_contains_required > & {
						body.fr & {
							&::after {
								content: 'Téléverser votre CV*';
							}
						}
						
						body.en & {
							&::after {
								content: 'Upload your CV*';
							}
						}
					}
					
					&:has(> .file-name)::after {
						opacity: 0;
					}
					
					:is(input[type="file"], .gform_fileupload_rules, .file-name) {
						position: absolute;
						
						&:is(input[type="file"]) {
							inset: 0;
							width: 100%;
							height: 100%;
							padding: unset !important;
							border: unset !important;
							opacity: 0;
						}
						
						&.gform_fileupload_rules {
							top: calc(100% + var(--wp--preset--spacing--0-50));
							left: 0;
							color: var(--wp--custom--color--default--text);
							margin-block: unset;
							cursor: default;
						}
						
						&.file-name {
							display: block;
							top: 50%;
							left: var(--wp--preset--spacing--1);
							max-width: calc(100% - (var(--wp--preset--spacing--1) * 3) - 16px);
							pointer-events: none;
							translate: 0 -50%;
						}
					}
					
					:is(.gfield_fileupload_progress, .ginput_preview_list, .ginput_preview) {
						display: none !important;
					}
				}
				
				& .gfield_validation_message {
					position: absolute;
					top: calc(100% + var(--wp--preset--spacing--2-5));
				}
			}
		}
	}
	
	/* Form footer */
	.gform_footer {
		position: relative;
		width: max-content;
		padding: unset !important;
		margin-block-start: var(--wp--preset--spacing--2) !important;
		margin-inline: unset !important;
		border: unset !important;
		outline: unset !important;
		overflow: clip;
		
		input[type="submit"] {
			min-height: unset !important;
			height: calc(100% + (var(--wp--preset--spacing--1-5) * 2)) !important;
			font-family: inherit !important;
			font-size: inherit !important;
			font-weight: inherit !important;
			line-height: inherit !important;
			color: inherit !important;
			background-color: unset !important;
			padding: var(--wp--preset--spacing--0-75) var(--wp--preset--spacing--1-5) calc(var(--wp--preset--spacing--0-75) - 3px) !important;
			border: unset !important;
			border-radius: unset !important;
			box-shadow: unset !important;
			outline: unset !important;
		}
	}
	
	/* Form error/confirmation messages & Loading icon */
	.gform_validation_errors {
		display: none;
	}
	
	.gform_confirmation_message,
	.gform_confirmation_message > * {
		margin-block: unset;
	}
	
	.gform-loader {
		display: none;
	}
	
	form:has(.gform-loader) {
		position: relative;
		
		& > :is(.gform_body, .gform_footer) :is(input, select, textarea, button, .gfield--type-fileupload):not([type="file"]) {
			opacity: .5 !important;
			pointer-events: none !important;
		}
		
		&::after {
			content: '';
			position: absolute;
			top: 50%;
			left: 50%;
			width: 100px;
			height: auto;
			aspect-ratio: 1;
			background: url(../images/loading.svg) no-repeat center;
			background-size: contain;
			filter: var(--wp--custom--color--pale-oyster-brown--filter);
			translate: -50% -50%;
		}
	}
	
	/* Responsive ****************************************************/
	@container form-wrapper (width <= 500px) {
		.gfield {
			grid-column: span 2 !important;
		}
	}
	
	@media (width <= 1200px) {
		.gform_fields {
			column-gap: var(--wp--preset--spacing--1);
			row-gap: var(--wp--preset--spacing--1);
		}
	}
}