/*
Theme Name: Flatsome Child
Description: This is a child theme for Flatsome Theme
Author: UX Themes
Template: flatsome
Version: 3.002
*/

/*************** ADD CUSTOM CSS HERE.   ***************/

:root {
	interpolate-size: allow-keywords;
	
	--fs-color-success-darker: color-mix(in srgb, var(--fs-color-success) 50%, #000000);
	--fs-color-success-lighter: color-mix(in srgb, var(--fs-color-success) 50%, #ffffff);
	--fs-100: clamp(0.8rem, 0.165vw + 0.759rem, 0.891rem);
	--fs-200: clamp(1rem, 0.341vw + 0.915rem, 1.188rem);
	--fs-300: clamp(1.25rem, 0.605vw + 1.099rem, 1.583rem);
	--fs-400: clamp(1.563rem, 0.996vw + 1.314rem, 2.11rem);
	--fs-500: clamp(1.953rem, 1.563vw + 1.562rem, 2.813rem);
	--fs-600: clamp(2.441rem, 2.378vw + 1.847rem, 3.749rem);
	--fs-700: clamp(3.052rem, 3.538vw + 2.167rem, 4.998rem);
}

body {
	
	main, footer, .mfp-content, .page-title {
		font: normal normal normal var(--fs-200)/1.5 inherit, sans-serif, system-ui;
		
		:is(h1, h2, h3, h4, h5, h6, p, ul, ol, li, form, select, label, legend, button:not(.toggle), .button:not(.icon)) {margin-block: 0; margin-inline: 0;}
		:is(p, ul, ol, button:not(.toggle), .button:not(.icon)):has(+ :is(h1, h2, h3, h4, h5, h6)) {margin-block-end: 2em;}
		:is(h1, h2, h3, h4, h5, h6, p, ul, ol, blockquote, form, label, legend, button:not(.toggle), .button:not(.icon)):has(+ :is(p, ul, ol, blockquote, button, form, .button)) {margin-block-end: 0.75em;}
		
		ul:not([class]) {padding-inline-start: 1.25em;}
		ol:not([class]) {padding-inline-start: 1.75em;}
		
		:is(ul, ol):not([class]) {
			
			li, .col-inner & li {
				margin-inline: 0px;
			}
			
		}
		
		ul:has(.recent-blog-posts-li) {
			padding: 0;
		}

		h1 {font-size: var(--fs-500);}
		h2 {font-size: var(--fs-400);}
		h3 {font-size: var(--fs-300);}
		h4 {font-size: var(--fs-200);}
		h5 {font-size: var(--fs-200);}
		h6 {font-size: var(--fs-100);}
		h1, h2, h3, h4, h5 h6 {font-weight: bold};
		blockquote, .product-short-description {font-size: var(--fs-200);}

		.fs-100 :is(h1, h2, h3, h4, h5, h6, p, ul, ol) {font-size: var(--fs-100);}
		.fs-200 :is(h1, h2, h3, h4, h5, h6, p, ul, ol) {font-size: var(--fs-200);}
		.fs-300 :is(h1, h2, h3, h4, h5, h6, p, ul, ol) {font-size: var(--fs-300);}
		.fs-400 :is(h1, h2, h3, h4, h5, h6, p, ul, ol) {font-size: var(--fs-400);}
		.fs-500 :is(h1, h2, h3, h4, h5, h6, p, ul, ol) {font-size: var(--fs-500);}
		.fs-600 :is(h1, h2, h3, h4, h5, h6, p, ul, ol) {font-size: var(--fs-600);}
		.fs-700 :is(h1, h2, h3, h4, h5, h6, p, ul, ol) {font-size: var(--fs-700);}
		
		iframe, svg {
			display: block;
		}
		
	}
	
	.balance, .page-title {
		text-wrap: balance;
	}
	
}

.header-shadow .header-wrapper, .header-wrapper.stuck, .layout-shadow #wrapper {
	box-shadow: unset;
}

/*BEGIN - Flatsome fixes*/

#customer_details {
	display: grid;
	grid: auto / 100%;
	place-content: start;
	gap: 1em;
	
	& > .clear:nth-child(2),
	.woocommerce-billing-fields,
	.woocommerce-billing-fields__field-wrapper,
	.woocommerce-shipping-fields__field-wrapper {
		display: grid;
		grid: auto / 100%;
		place-content: start;
		gap: 1em;
	}
	
	.woocommerce-billing-fields__field-wrapper,
	.woocommerce-shipping-fields__field-wrapper {

		> * {
			margin: 0 !important;
		}

		input, select, textarea {
			margin: 0 !important;
		}

		.form-row-first, .form-row-last {
			float: unset;
			width: unset;
		}
		
	}
	
}

.woocommerce-ordering select {
	margin: 0 !important;
}

.checkout-sidebar {
	display: grid;
	grid: auto / 100%;
	place-content: start;
	gap: 1.5em;
}

.shop-page-title .page-title-inner {
	min-height: 80px;
}

.post_comments {
	display: none;
}

.balance {
	text-wrap: balance;
}

.product-small, .product-small {
	font-size: var(--fs-100);
	
	.product-title {
		font-size: var(--fs-100);
	}
	
	.price-wrapper .price {
		font-size: var(--fs-200);
	}
	
}

.woocommerce-grouped-product-list {
	.button {
		font-size: var(--fs-100);
		line-height: 1.2;
		min-height: unset;
		padding: .5em 1em;
	}
}

.product .summary {
	
	blockquote, 
	.product-short-description {
		font-size: var(--fs-100);
	}
	
	.product-title {
		text-wrap: balance;
	}
	
}


.box-text, .product-info, .product-lightbox-inner {
	display: grid;
	grid: auto / 100%;
	place-content: start;
	gap: 1.25em;
	
	> * {
		margin: 0 !important;
	}
	
	.price {
		margin-block: 0;
		font-size: var(--fs-400);
	}
	
}


.clip {
	
	> .col-inner {
		overflow: clip;
	}
	
}

.price_slider_wrapper {
	
	.price_slider {
		margin: 0 !important;
	}
	
	.price_slider_amount {
		display: flex;
		flex-flow: column-reverse;
		gap: 1.25em;
		align-items: stretch;

		.price_label {
			text-align: start;
		}

	}
	
}

.wp-block-woocommerce-coming-soon {
	width: min(1100px, 100%);
	margin: 0 auto;
	padding: 20px;
	text-align: center;
}

.woocommerce-variation {
	
	> :is(.woocommerce-variation-description, .woocommerce-variation-price, .woocommerce-variation-availability):empty {
		display: none;
	}
	
}
/*END - Flatsome fixes*/

#header {
	background-color: rgb(63 77 60);
	
	.button {
		font-family: Marcellus, sans-serif;
	}
	
}

.mfp-content:has(.ux-mfp-inline-content--video) {
	width: auto !important;
	
	.ux-mfp-inline-content--video {
		text-align: center;
	}
	
	@media only screen and (min-width: 48em) {
		video {
			max-height: 80svh;
			width: auto;
		}
	}
	
}

.col-inner:has(>.grow) {
	display: flex;
	flex-flow: column;
	
	> .grow {
		flex-grow: 1;
	}
	
}

.contain {
	
	img {
		object-fit: contain !important;
		object-position: center !important;
	}
	
}

.flip {
	
	img {
		rotate: 0 1 0 180deg;
	}
	
}

.grid {
	
	&.row {
		height: 100%;
	}
	
}
/*
.expand {
	height: 100%;
	display: flex;
	flex-flow: column;
	
	.box-text {
		flex-grow: 1;
	}
	
	.box-text-inner {
		height: 100%;
		display: grid;
		grid-template-rows: auto 1fr auto auto auto;
		place-items: stretch;
	}
	
	.button:last-of-type {
		margin: 0 !important;
	}
	
}
*/
.placeholder {
	.box-image img {
		background: white;
		padding: 20px;
	}
}

.watermark {
	
	& > .col-inner {
		position: relative;
		justify-content: center;
	}
	
	& > .col-inner::before {
		content: '';
		position: absolute;
		align-self: center;
		inset: 50% auto auto 50%;
		translate: -50% -50%;
		width: 100%;
		aspect-ratio: 1 / 1;
		background: url(https://thecentreoflife.com/wp-content/uploads/2025/01/tcol_practitioner_watermark.svg) center center / contain no-repeat;
		animation: pulse 4s ease-in-out 0s infinite alternate;
		opacity: 0.3;
	}
	
	&.delay > .col-inner::before {
		animation-delay: -4s;
	}
	
}

@keyframes pulse {
	0% {
		scale: 1;
		opacity: 0.1;
	}
	100% {
		scale: 1.075;
		opacity: 0.3;
	}
}

textarea.phive_book_additional_notes_text {
	color: #000 !important;
}

.social-icons {
	
	.button.is-outline {
		border: 1px solid var(--fs-color-primary) !important;
		color: var(--fs-color-primary) !important;
	}
	
	.button.icon:not(.is-outline) {
		background-color: var(--fs-color-primary) !important;
		border-color: transparent !important;
	}
	
}

.clip > .col-inner {
	overflow: clip;
}

.portfolio-page-wrapper > .page-title {
	display: none;
}

blockquote {
	padding: unset !important;
	border: unset !important;
	font-size: var(--fs-300);
}

.cart-item.has-icon {
	position: fixed;
	inset: auto 40px 20px auto;
	z-index: 99;
	transform-origin: 0% 100%;
	scale: 1.5;
	margin: 0 !important; 
	
	.header-cart-link {
		background: #1a1a1a !important;
	}
	
}

.shop-page-title.category-page-title.page-title {
    display: none;
}
.button.alt {
    font-size: x-large;
}

.wc-block-components-order-summary-item__individual-prices {
    display: none !important;
}

#cmplz-document {
	max-width: unset !important;
}

.wp-block-woocommerce-checkout-shipping-method-block,
.wp-block-woocommerce-checkout-pickup-options-block {
	display: none;
}

.wc-block-checkout__form fieldset {
	margin-block-end: 0px !important;
}

.wc-block-components-product-metadata {
	font-size: 0.75em !important;
}

.gform_wrapper {
	--gf-form-gap-y: 20px !important;
	--gf-color-primary: var(--fs-color-primary) !important;
	--gf-color-primary-darker: color-mix(in srgb, var(--gf-color-primary), #000 20%) !important;
	--gf-color-primary-lighter: color-mix(in srgb, var(--gf-color-primary), #000 20%) !important;
	
	--gf-color-in-ctrl-primary: var(--fs-color-success) !important;
	--gf-color-in-ctrl-primary-darker: color-mix(in srgb, var(--gf-color-in-ctrl-primary), #000 20%) !important;
	--gf-color-in-ctrl-primary-lighter: color-mix(in srgb, var(--gf-color-in-ctrl-primary), #000 20%) !important;
	--gf-color-in-ctrl: #fff !important;
	
	--gf-ctrl-shadow-color-focus: color-mix(in srgb, var(--fs-color-primary), transparent 60%) !important;
	
	--gf-ctrl-label-color-primary: var(--fs-color-success) !important;
	
	.gform-button--width-full {
		width: 100% !important;
	}
	
	.gform_required_legend {
		display: none;
	}
	
	.ginput_container :is(input, textarea, select) {
		border-radius: 10px !important;
		font-size: var(--fs-200) !important;
		
		&:focus-within {
			color: var(--fs-color-primary) !important;
		}
		
	}
	
	legend, label {
		font-weight: bold !important;
		font-size: var(--fs-300) !important;
	}
	
}

@media only screen and (max-width: 48em) {
/*************** ADD MOBILE ONLY CSS HERE  ***************/


}