/********************************************************/
/*
/*      Block CSS
/*
/********************************************************/
.wp-block-post-content {
	/* Gutenberg style override */
	:root &:where(.is-layout-constrained) > * {
		margin-block-start: 0;
	}
	
	/* 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-right: auto !important;
		
		body.wp-admin & {
			margin-left: var(--wp--custom--outer-pad) !important;
			
			&:has(> .components-placeholder) {
				margin-left: auto !important;
			}
		}
	}
}

/************************************************************/
/* Gutenberg blocks
/************************************************************/
/******************************/
/* Group
/******************************/
/* Group link hover color inheritance */
.wp-block-group.is-linked[class*="focus-"] > :is(p, .wp-block-heading) {
	color: inherit !important;
	transition: color .3s !important;
}

/******************************/
/* 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) {
		max-height: 50svh;
	}
}
/******************************/
/* 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: '-';
			}
			
			/* Uncomment if bullets are to be SVGs */
			/* &::before {
				--bullet: url('data:image/svg+xml, <svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" viewBox="0 0 125 101"><path transform="translate(-0.000640869 0)" d="M124.17332 0L84.105522 99.542603L0 99.542603L40.069077 0L124.17332 0Z" fill-rule="evenodd"/></svg>');
				
				content: '';
				width: 10px;
				height: auto;
				aspect-ratio: 31/25;
				background-repeat: no-repeat;
				background-position: center;
				background-color: currentcolor;
				
				-webkit-mask: var(--bullet);
				mask: var(--bullet);
			} */
			
			& + 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;
	}
}

/************************************************************/
/* Cake blocks
/************************************************************/
/* Add Cake custom block style overrides here */

/************************************************************/
/* 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%;
	
	& > :is(.wp-block-button__link, input[type="submit"], a) {
		display: inline-block;
		width: max-content;
		max-width: 100%;
		height: 100%;
		transition: scale var(--wp--custom--speed--medium);
		scale: 1;
		/* Add theme.json button style, as well as any additional button style here */
		
		&:is(:hover, :focus, :active) {
			color: var(--wp--custom--color--default--focus) !important;
		}
		
		&:active {
			scale: 0.975;
		}
	}
}

/* Popup open/close buttons */
button:is(.burger-popup-open, .burger-popup-close) {
	position: relative;
	width: 20px;
	height: 20px;
	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--focus);
		}
	}
}

/******************************/
/* 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--1);
		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"], [type="file"], [class*="adminbar"]),
			&.gfield--type-choice label {
				/* Add input/label typography here */
			}
			
			.gfield_required_text {
				display: none;
			}
			
			:is(input, select, textarea):not([type="submit"], [type="button"], [type="file"], [class*="adminbar"], [class*="ui-datepicker"]) {
				width: 100% !important;
				height: auto !important;
				color: var(--wp--custom--color--default--text);
				background-color: transparent;
				padding: var(--wp--preset--spacing--1-5) var(--wp--preset--spacing--2);
				border: unset;
				border-radius: var(--wp--custom--border-radius--large);
				box-sizing: border-box;
				box-shadow: unset !important;
				outline: unset !important;
				resize: none;
				
				&:is(textarea) {
					border-radius: var(--wp--custom--border-radius--small);
				}
			}
			
			/* TODO: ADD DEFAULT STYLE FOR CHECKBOXES AND RADIO BUTTONS */
			/* TODO: ADD DEFAULT STYLE FOR FILE UPLOAD INPUT */
		}
	}
	
	/* Form footer */
	.gform_footer {
		position: relative;
		width: max-content;
		margin-block-start: var(--wp--preset--spacing--2) !important;
		margin-inline: unset !important;
		overflow: clip;
		
		input[type="submit"] {
			font-family: inherit !important;
			font-size: inherit !important;
			font-weight: inherit !important;
			line-height: inherit !important;
			color: inherit !important;
			border: unset !important;
			border-radius: unset !important;
			outline: unset !important;
		}
	}
	
	/* Form error/confirmation messages & Loading icon */
	.gform_validation_errors {
		display: none;
	}
	
	.gfield_validation_message {
		/* Add validation message typography here */
	}
	
	.gform_confirmation_message,
	.gform_confirmation_message > * {
		/* Add confirmation message typography here */
		margin-block: unset;
	}
	
	.gform-loader {
		display: none;
	}
	
	form:has(.gform-loader) {
		position: relative;
		
		& > :is(.gform_body, .gform_footer) :is(input, select, textarea, button) {
			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;
			translate: -50% -50%;
		}
	}
	
	/* Responsive */
	@container form-wrapper (width <= 800px) {
		.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);
		}
	}
}