/**
 * Reusable, opt-in responsive scale for commerce and account forms.
 * Add `cie-commerce-form-scale` to a page body when its layout is approved.
 */

/* The registration invitation belongs only to the logged-out Login state. */
body.logged-in.page-id-4310 .elementor-element-c20e95a {
	display: none !important;
}

/* Give Account (including its endpoints) and Login one shared compact page edge. */
body:is(.page-id-22134, .page-id-4310) #content.site-content > .ast-container {
	padding-block: var(--cie-section-padding-block-compact) !important;
}

/* Keep Login's outer edge single-owned; Elementor otherwise adds 50–100px. */
body.page-id-4310 .elementor-element-4bf9682 > .e-con-inner {
	padding-block: 0 !important;
}

/* Keep Account's outer edge single-owned; Astra otherwise adds 60px on desktop. */
body.page-id-22134 #primary.content-area {
	margin-block: 0 !important;
}

/* Use a quieter, neutral profile-card treatment at every Account breakpoint. */
body.page-id-22134 #content .um-account :is(
	.um-account-side,
	.um-account-meta.uimob340-show.uimob500-show
) {
	border: 1px solid #d8e0d3 !important;
	border-radius: 22px !important;
	background: #f7f8f6 !important;
	box-shadow: 0 8px 24px rgba(70, 89, 97, 0.06);
}

body.page-id-22134 #content .um-account :is(
	.um-account-side,
	.um-account-meta.uimob340-show.uimob500-show
) .um-account-meta-img img {
	border: 2px solid #aab7a2 !important;
	background: #fff;
	box-shadow: none !important;
}

body.page-id-22134 #content .um-account :is(
	.um-account-side,
	.um-account-meta.uimob340-show.uimob500-show
) .um-account-name > a {
	color: #465961 !important;
	text-decoration: none !important;
}

body.page-id-22134 #content .um-account :is(
	.um-account-side,
	.um-account-meta.uimob340-show.uimob500-show
) .um-account-profile-link a {
	color: #63725d !important;
	text-decoration-color: rgba(99, 114, 93, 0.45) !important;
}

@media (max-width: 1023px) {
	body.page-id-22134 #content .um-account .um-form > form {
		display: block !important;
		grid-template-columns: none !important;
		gap: 0 !important;
	}

	body.page-id-22134 #content .um-account .um-account-side {
		display: none !important;
	}

	body.page-id-22134 #content .um-account .um-account-meta.uimob340-show.uimob500-show {
		display: grid !important;
		grid-template-columns: 72px minmax(0, 1fr);
		align-items: center;
		gap: 18px;
		width: 100% !important;
		min-height: 110px;
		padding: 18px 20px !important;
		box-sizing: border-box;
	}

	body.page-id-22134 #content .um-account .um-account-meta.uimob340-show.uimob500-show .um-account-meta-img {
		width: 72px !important;
		height: 72px !important;
		margin: 0 !important;
	}

	body.page-id-22134 #content .um-account .um-account-meta.uimob340-show.uimob500-show .um-account-meta-img :is(a, img) {
		display: block;
		width: 72px !important;
		height: 72px !important;
	}

	body.page-id-22134 #content .um-account .um-account-meta.uimob340-show.uimob500-show .um-account-name {
		min-width: 0;
		margin: 0 !important;
		padding: 0 !important;
		font-size: 18px !important;
		line-height: 1.3 !important;
		text-align: left !important;
	}

	body.page-id-22134 #content .um-account .um-account-meta.uimob340-show.uimob500-show .um-account-profile-link {
		margin-top: 5px !important;
		font-size: 14px !important;
		line-height: 1.4 !important;
	}

	body.page-id-22134 #content .um-account .um-account-main {
		display: block !important;
		float: none !important;
		width: 100% !important;
		max-width: none !important;
		margin: 0 !important;
		padding: 0 !important;
		border: 0 !important;
		border-radius: 0 !important;
		background: transparent !important;
		box-shadow: none !important;
		box-sizing: border-box;
	}

	body.page-id-22134 #content .um-account .um-account-main > .um-account-nav {
		display: block !important;
		width: 100% !important;
		margin: 0 0 10px !important;
	}

	body.page-id-22134 #content .um-account .um-account-main > .um-account-nav > a {
		display: flex !important;
		align-items: center !important;
		justify-content: space-between !important;
		width: 100% !important;
		min-height: 56px;
		padding: 12px 18px !important;
		border: 2px solid #465961 !important;
		border-radius: 16px !important;
		background: #465961 !important;
		color: #fff !important;
		font-size: clamp(18px, 2.344vw, 20px) !important;
		line-height: 1.35 !important;
		font-weight: 600 !important;
		text-align: center !important;
		box-sizing: border-box;
	}

	body.page-id-22134 #content .um-account .um-account-main > .um-account-nav > a.current {
		border-color: #a6ce39 !important;
		background: #a6ce39 !important;
		color: #111 !important;
	}

	body.page-id-22134 #content .um-account .um-account-main > .um-account-nav > a > :is(.ico, .arr) {
		position: static !important;
		inset: auto !important;
		transform: none !important;
		display: flex !important;
		flex: 0 0 auto;
		align-items: center;
		justify-content: center;
		width: 30px;
		line-height: 1 !important;
	}

	body.page-id-22134 #content .um-account .um-account-main > .um-account-nav > a > .ico {
		order: -1;
		margin: 0 !important;
	}

	body.page-id-22134 #content .um-account .um-account-main > .um-account-nav > a > .arr {
		margin: 0 !important;
	}

	body.page-id-22134 #content .um-account .um-account-main > .um-account-nav > a > :is(.ico, .arr) > i {
		line-height: 1 !important;
	}

	body.page-id-22134 #content .um-account .um-account-main > .um-account-tab {
		float: none !important;
		width: 100% !important;
		max-width: none !important;
		margin: 0 0 16px !important;
		padding: clamp(24px, 3.125vw, 30px) !important;
		border: 2px solid #d9dfe1 !important;
		border-radius: clamp(20px, 2.5vw, 28px) !important;
		background: #f5f5f5 !important;
		box-sizing: border-box;
	}
}

@media (min-width: 1024px) {
	body.page-id-22134 #content .um-account .um-account-side > ul > li {
		background: transparent !important;
	}

	/* Give desktop Account rows equal edge slots and one vertical alignment owner. */
	body.page-id-22134 #content .um-account .um-account-side > ul > li > a {
		display: flex !important;
		align-items: center !important;
		justify-content: space-between !important;
		padding-inline: 16px !important;
	}

	body.page-id-22134 #content .um-account .um-account-side > ul > li > a > :is(
		.um-account-icon,
		.um-account-arrow
	) {
		position: static !important;
		inset: auto !important;
		transform: none !important;
		display: flex !important;
		flex: 0 0 30px;
		align-items: center;
		justify-content: center;
		width: 30px !important;
		height: 30px;
		margin: 0 !important;
		padding: 0 !important;
		box-sizing: border-box;
		line-height: 1 !important;
	}

	body.page-id-22134 #content .um-account .um-account-side > ul > li > a > .um-account-title {
		flex: 1 1 auto;
		min-width: 0;
		text-align: center;
	}

	body.page-id-22134 #content .um-account .um-account-side > ul > li > a > :is(
		.um-account-icon,
		.um-account-arrow
	) > i {
		line-height: 1 !important;
	}

	/* Correct the icon font's high optical baseline without moving the shared slot. */
	body.page-id-22134 #content .um-account .um-account-side > ul > li > a > .um-account-icon > i {
		transform: translateY(5px) !important;
	}
}

@media (max-width: 1023px) {
	/* Stack Privacy help copy across the full one-column Account mode. */
	body.page-id-22134 .um-account .um-account-tab[data-tab="privacy"] .um-field-label {
		display: grid !important;
		grid-template-columns: minmax(0, 1fr);
		gap: 4px;
	}

	body.page-id-22134 .um-account .um-account-tab[data-tab="privacy"] .um-field-label > label {
		min-width: 0;
		white-space: normal !important;
		overflow-wrap: anywhere;
	}

	body.page-id-22134 .um-account .um-account-tab[data-tab="privacy"] .um-field-label > .um-tip {
		display: block !important;
		width: auto;
		height: auto;
		margin: 0;
		overflow: visible;
		font-size: 0 !important;
		line-height: 0 !important;
		white-space: normal;
		pointer-events: none;
	}

	body.page-id-22134 .um-account .um-account-tab[data-tab="privacy"] .um-field-label > .um-tip > i {
		display: none !important;
	}

	body.page-id-22134 .um-account .um-account-tab[data-tab="privacy"] .um-field-label > .um-tip::before {
		content: none !important;
	}

	body.page-id-22134 .um-account .um-account-tab[data-tab="privacy"] .um-field-label > .um-tip::after {
		content: attr(original-title) !important;
		display: block;
		color: #969b9d;
		font-family: inherit;
		font-size: 14px !important;
		font-weight: 400;
		line-height: 1.45;
		white-space: normal;
		overflow-wrap: anywhere;
	}

	body.page-id-22134 .um-account .um-account-tab[data-tab="privacy"] .um-field-label > .um-clear {
		display: none !important;
	}
}

body.cie-commerce-form-scale {
	--cie-form-page-title-size: clamp(30px, calc(28.568px + 0.447vw), 32px);
	--cie-form-page-title-line: clamp(38px, calc(36.568px + 0.447vw), 40px);
	--cie-form-section-title-size: clamp(22px, calc(20.568px + 0.447vw), 24px);
	--cie-form-section-title-line: clamp(30px, calc(28.568px + 0.447vw), 32px);
	--cie-form-label-size: clamp(15px, calc(14.284px + 0.224vw), 16px);
	--cie-form-label-line: clamp(21px, calc(20.284px + 0.224vw), 22px);
	--cie-form-control-size: clamp(14px, calc(12.568px + 0.447vw), 16px);
	--cie-form-control-height: clamp(44px, calc(42.568px + 0.447vw), 46px);
	--cie-form-row-gap: clamp(12px, calc(10.568px + 0.447vw), 14px);
	--cie-form-label-gap: clamp(4px, calc(2.568px + 0.447vw), 6px);
	--cie-form-section-gap: clamp(20px, calc(17.136px + 0.895vw), 24px);
}

@media (max-width: 767px) {
	body.cie-commerce-form-scale header.entry-header .entry-title {
		font-size: var(--cie-form-page-title-size);
		line-height: var(--cie-form-page-title-line);
	}

	body.cie-commerce-form-scale form.checkout #customer_details :is(
		.woocommerce-billing-fields > h3,
		.woocommerce-shipping-fields > h3,
		.woocommerce-additional-fields > h3
	) {
		margin-bottom: var(--cie-form-section-gap);
		font-size: var(--cie-form-section-title-size);
		line-height: var(--cie-form-section-title-line);
	}

	body.cie-commerce-form-scale.woocommerce-checkout form.checkout #order_review_heading:not(.elementor-widget-woocommerce-checkout-page #order_review_heading) {
		font-size: var(--cie-form-section-title-size);
		line-height: var(--cie-form-section-title-line);
	}

	body.cie-commerce-form-scale form.checkout #customer_details .form-row {
		margin-bottom: var(--cie-form-row-gap);
	}

	body.cie-commerce-form-scale form.checkout #customer_details .form-row > label {
		margin-bottom: var(--cie-form-label-gap);
		font-size: var(--cie-form-label-size);
		line-height: var(--cie-form-label-line);
	}

	body.cie-commerce-form-scale form.checkout #customer_details :is(
		input.input-text,
		select,
		textarea
	),
	body.cie-commerce-form-scale form.checkout #customer_details .select2-selection.select2-selection--single {
		box-sizing: border-box;
		min-height: var(--cie-form-control-height);
		height: var(--cie-form-control-height);
		font-size: var(--cie-form-control-size);
	}

	body.cie-commerce-form-scale form.checkout #customer_details .select2-selection__rendered {
		font-size: var(--cie-form-control-size);
		line-height: calc(var(--cie-form-control-height) - 24px);
	}

	body.cie-commerce-form-scale form.checkout #customer_details .select2-selection__arrow {
		top: calc(var(--cie-form-control-height) / 2);
		height: var(--cie-form-control-height);
	}

	html body.cie-commerce-form-scale.woocommerce-checkout .tel-fields-row :is(#cie-picker-contract-a, .iti):is(#cie-picker-contract-b, .iti) > input.iti__tel-input,
	html body.cie-commerce-form-scale.woocommerce-checkout .tel-fields-row :is(#cie-picker-contract-a, .iti):is(#cie-picker-contract-b, .iti) > input.iti__tel-input[type="tel"] {
		height: var(--cie-form-control-height);
		font-size: var(--cie-form-control-size);
	}
}