/* ASW mobile polish B — account, buttons, wrap, pathways, cookie, hero overlay
   Complements mobile.css; does not alter auth logic. */

/* —— Hero overlay (HEALTHIER / STRONGER / …): restore readable lines ≤1024 ——
   Root cause: Elementor page-14 custom CSS sets .as-hero__overlay { display:none }
   under @media (max-width:1024px), which collapses <br> into HEALTHIERSTRONGER…
   for textContent/a11y. Desktop (>1024) already stacks correctly. */
@media (max-width: 1024px) {
	.elementor-14 .as-hero__media {
		position: relative !important;
		overflow: hidden !important;
	}

	.elementor-14 .as-hero__overlay {
		display: block !important;
		position: absolute !important;
		inset: auto 10px 12px auto !important;
		width: auto !important;
		max-width: min(48%, 10.5rem) !important;
		z-index: 2;
		pointer-events: none;
		text-align: right !important;
		padding: 0 !important;
		margin: 0 !important;
		background: transparent !important;
	}

	.elementor-14 .as-hero__overlay .elementor-heading-title {
		display: block !important;
		margin: 0 !important;
		padding: 0 !important;
		white-space: normal !important;
		overflow-wrap: normal !important;
		word-break: normal !important;
		font-size: clamp(0.75rem, 2.8vw, 0.9rem) !important;
		line-height: 1.5 !important;
		letter-spacing: 0.05em !important;
		font-weight: 600 !important;
		text-transform: uppercase !important;
		color: #fff !important;
		text-shadow:
			0 1px 2px rgba(6, 28, 74, 0.85),
			0 0 10px rgba(6, 28, 74, 0.55);
	}

	/* Ensure <br> create real line breaks (some engines report display:inline when hidden) */
	.elementor-14 .as-hero__overlay .elementor-heading-title br {
		display: block !important;
		content: "" !important;
		margin: 0 !important;
		line-height: 0 !important;
	}
}

@media (max-width: 430px) {
	.elementor-14 .as-hero__overlay {
		max-width: min(52%, 9.5rem) !important;
		right: 8px !important;
		bottom: 10px !important;
	}
}

@media (prefers-reduced-motion: reduce) {
	.elementor-14 .as-hero__overlay,
	.elementor-14 .as-hero__overlay * {
		animation: none !important;
		transition: none !important;
	}
}

:root {
	--asw-navy: #061c4a;
	--asw-gold: #d99614;
	--asw-cream: #f7f5f1;
	--asw-ink: #2c3340;
}

@media (max-width: 767px) {
	/* —— Text: wrap words, never letter-by-letter —— */
	.elementor-heading-title,
	.elementor-widget-text-editor,
	.elementor-widget-text-editor p,
	.elementor-button-text,
	.woocommerce,
	.woocommerce-page {
		overflow-wrap: break-word;
		word-break: normal;
		hyphens: manual;
		max-width: 100%;
	}

	.as-inner-programs-grid .elementor-heading-title,
	.as-inner-programs-grid .elementor-widget-text-editor,
	.as-inner-programs-grid .elementor-widget-text-editor p {
		overflow-wrap: break-word !important;
		word-break: normal !important;
	}

	/* —— Buttons: readable, wrap, tap targets —— */
	a.elementor-button,
	.elementor-button,
	.woocommerce a.button,
	.woocommerce button.button,
	.woocommerce input.button,
	.asw-replenish .asw-r-btn,
	.asw-replenish button.asw-r-btn {
		white-space: normal !important;
		height: auto !important;
		min-height: 44px;
		max-width: 100%;
		box-sizing: border-box;
		line-height: 1.3 !important;
		padding-block: 0.85rem !important;
		padding-inline: 1rem !important;
		overflow: visible !important;
		text-overflow: clip !important;
	}

	.elementor-button .elementor-button-text,
	.elementor-button .elementor-button-content-wrapper {
		white-space: normal !important;
		overflow: visible !important;
		text-overflow: clip !important;
		max-width: 100%;
	}

	/* Full-width primary CTAs in content cards / forms */
	.woocommerce-form-login .woocommerce-button,
	.woocommerce-form-register .woocommerce-button,
	.fluentform .ff-btn-submit,
	.asw-replenish .asw-r-card .asw-r-btn,
	.asw-replenish .asw-r-side-cta .asw-r-btn {
		width: 100% !important;
		display: inline-flex !important;
		justify-content: center;
		align-items: center;
	}

	/* —— CookieAdmin: keep revisit + banner off primary controls —— */
	.cky-btn-revisit-wrapper {
		bottom: max(12px, env(safe-area-inset-bottom, 0px)) !important;
		left: 12px !important;
		right: auto !important;
		z-index: 99990 !important;
	}

	.cky-consent-container {
		z-index: 99999 !important;
	}

	body.cky-consent-bar-bottom,
	body:has(.cky-consent-container:not(.cky-hide):not([style*="display: none"])) {
		padding-bottom: 0;
	}

	/* —— Support pathway cards: less padded, readable —— */
	.as-pathway-card,
	.as-pathway-card > .e-con-inner,
	.as-med-independent,
	.as-med-independent > .e-con-inner {
		padding-top: 24px !important;
		padding-bottom: 24px !important;
	}

	.as-pathway-card .elementor-heading-title {
		font-size: clamp(1.15rem, 5.2vw, 1.45rem) !important;
		line-height: 1.25 !important;
		letter-spacing: 0.02em !important;
	}

	.as-pathway-card .elementor-widget-text-editor p,
	.as-med-independent .elementor-widget-text-editor p {
		font-size: 0.95rem !important;
		line-height: 1.5 !important;
	}

	/* —— Home hero: keep eyebrow/heading inside viewport —— */
	.as-hero .elementor-heading-title {
		white-space: normal !important;
		overflow-wrap: break-word !important;
		word-break: normal !important;
		max-width: 100% !important;
	}

	.as-hero a.elementor-button {
		width: min(100%, 22rem);
	}
}

/* Header logo: keep brand mark visible + sized (empty alt fixed in account-tabs.js) */
.elementor-location-header .elementor-widget-image img,
.elementor-location-header img.attachment-large,
.elementor-location-header img.wp-image-41 {
	display: inline-block !important;
	visibility: visible !important;
	opacity: 1 !important;
	max-height: 72px !important;
	width: auto !important;
	height: auto !important;
	object-fit: contain !important;
}

.elementor-location-header .elementor-widget-image a {
	display: inline-flex !important;
	align-items: center !important;
}

/* Mobile: header bar was ~61px while logo is 72px — grow the bar, center mark */
@media (max-width: 767px) {
	.elementor-location-header,
	.elementor-location-header > .elementor-element-d638db1,
	.elementor-location-header .elementor-element-d638db1 {
		min-height: 112px !important;
		align-items: center !important;
		box-sizing: border-box !important;
		overflow: visible !important;
	}

	.elementor-location-header .elementor-element-d638db1 {
		padding-top: 16px !important;
		padding-bottom: 16px !important;
	}

	.elementor-location-header .elementor-element-2d0d18f,
	.elementor-location-header .elementor-element-2568f1a {
		min-height: 80px !important;
		align-items: center !important;
		display: flex !important;
	}

	.elementor-location-header .elementor-widget-image,
	.elementor-location-header .elementor-widget-image .elementor-widget-container,
	.elementor-location-header .elementor-widget-image a {
		overflow: visible !important;
		line-height: 0 !important;
		align-self: center !important;
	}

	.elementor-location-header .elementor-widget-image img,
	.elementor-location-header img.attachment-large,
	.elementor-location-header img.wp-image-41 {
		max-height: 72px !important;
	}
}

/* Mobile + tablet (burger): pull menu toggle tight to the right.
   Nav wrap was flex-growing wide + justify:center → ~100px empty right of toggle. */
@media (max-width: 1024px) {
	.elementor-location-header .elementor-element-d638db1 {
		padding-left: 12px !important;
		padding-right: 10px !important;
		gap: 8px !important;
	}

	.elementor-location-header .elementor-element-2568f1a {
		flex: 0 0 auto !important;
		width: auto !important;
		max-width: none !important;
		margin-left: auto !important;
		padding: 0 !important;
		justify-content: flex-end !important;
		align-items: center !important;
		align-self: center !important;
	}

	.elementor-location-header .elementor-element-e9910be,
	.elementor-location-header .elementor-element-e9910be .elementor-widget-container {
		width: auto !important;
		max-width: none !important;
		margin: 0 !important;
		padding: 0 !important;
	}

	.elementor-location-header .elementor-menu-toggle {
		margin: 0 !important;
		justify-content: center !important;
	}

	.elementor-location-header .elementor-element-2d0d18f {
		padding: 0 !important;
		flex: 0 1 auto !important;
	}
}

/* —— Header nav: more gap + hover must not reflow/shift the bar ——
   Elementor e--pointer-underline + tight 8px pad left items nearly touching;
   font-weight/scale on hover shoves neighbors. */
.elementor-location-header .elementor-nav-menu--main > ul.elementor-nav-menu {
	display: flex !important;
	flex-wrap: nowrap !important;
	align-items: center !important;
	gap: 0.45rem !important;
	column-gap: 0.45rem !important;
}

.elementor-location-header .elementor-nav-menu--main .menu-item {
	margin: 0 !important;
}

.elementor-location-header .elementor-nav-menu--main .elementor-item {
	padding-left: 0.85rem !important;
	padding-right: 0.85rem !important;
	font-weight: 500 !important;
	box-sizing: border-box !important;
	transform: none !important;
}

.elementor-location-header .elementor-nav-menu--main .elementor-item:hover,
.elementor-location-header .elementor-nav-menu--main .elementor-item:focus,
.elementor-location-header .elementor-nav-menu--main .elementor-item.elementor-item-active,
.elementor-location-header .elementor-nav-menu--main .elementor-item.highlighted {
	font-weight: 500 !important;
	transform: none !important;
	letter-spacing: inherit !important;
}

/* Keep underline as absolute paint — never change item box size */
.elementor-location-header .e--pointer-underline .elementor-item {
	position: relative !important;
}

.elementor-location-header .e--pointer-underline .elementor-item::before,
.elementor-location-header .e--pointer-underline .elementor-item::after {
	position: absolute !important;
	left: 0.85rem !important;
	right: 0.85rem !important;
	width: auto !important;
	bottom: 0.35rem !important;
	height: 2px !important;
	pointer-events: none !important;
}

/* —— Home teasers (Boxes / Club / Research): equal card heights —— */
.as-home-teasers {
	align-items: stretch !important;
}

.as-home-teasers > .as-teaser,
.as-home-teasers > .e-con {
	height: 100% !important;
	align-self: stretch !important;
	display: flex !important;
	flex-direction: column !important;
	box-sizing: border-box !important;
}

.as-home-teasers > .as-teaser > .e-con-inner,
.as-home-teasers > .e-con > .e-con-inner {
	flex: 1 1 auto !important;
	display: flex !important;
	flex-direction: column !important;
	justify-content: flex-end !important;
	height: 100% !important;
	min-height: 100% !important;
	box-sizing: border-box !important;
}

@media (max-width: 767px) {
	.as-home-teasers > .as-teaser,
	.as-home-teasers > .e-con {
		min-height: 290px !important;
	}
}

/* —— Journey steps (.as-home-journey-grid): Elementor applies 4×280px grid to the
   OUTER e-con, but its only child is .e-con-inner → inner stuck at ~280px, then
   split into 4×55px columns (destroyed tall strips). Outer = full-width shell;
   inner = real 4-col step grid. —— */
.as-home-journey-grid {
	display: block !important;
	width: 100% !important;
	max-width: 100% !important;
	grid-template-columns: none !important;
	--e-con-grid-template-columns: none !important;
	box-sizing: border-box !important;
}

.as-home-journey-grid > .e-con-inner {
	display: grid !important;
	grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
	--e-con-grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
	width: 100% !important;
	max-width: 100% !important;
	box-sizing: border-box !important;
	gap: 1.25rem !important;
	align-items: stretch !important;
	justify-content: stretch !important;
}

.as-home-journey-grid > .e-con-inner > .e-con,
.as-home-journey-grid > .e-con-inner > .elementor-element {
	width: 100% !important;
	min-width: 0 !important;
	max-width: 100% !important;
	height: auto !important;
	align-self: stretch !important;
}

.as-home-journey-grid .elementor-heading-title,
.as-home-journey-grid .elementor-widget-text-editor,
.as-home-journey-grid .elementor-widget-text-editor p {
	overflow-wrap: break-word !important;
	word-break: normal !important;
	max-width: 100% !important;
}

@media (max-width: 1024px) {
	.as-home-journey-grid > .e-con-inner {
		grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
		--e-con-grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
	}
}

@media (max-width: 767px) {
	.as-home-journey-grid > .e-con-inner {
		grid-template-columns: minmax(0, 1fr) !important;
		--e-con-grid-template-columns: minmax(0, 1fr) !important;
	}
}

/* Consultation page: hero already is the booking page — hide self-link CTA */
body.page-id-523 .as-hero .elementor-element-c800d28,
body.page-id-523 .as-hero a.elementor-button[href*='/consultation'] {
	display: none !important;
}

/* Support Pathways (515): one Book CTA in content (mid as-med-cta).
   Hide hero self-promo + Independent duplicate — Provider keeps Portal. */
body.page-id-515 .as-hero .elementor-element-9a78ec1,
body.page-id-515 .as-hero a.elementor-button[href*='/consultation'],
body.page-id-515 .as-med-independent .elementor-element-f9c99df,
body.page-id-515 .as-med-independent a.elementor-button[href*='/consultation'] {
	display: none !important;
}

/* Mid CTA was Elementor border-radius:4px (boxy); match site pill buttons. */
body.page-id-515 .as-med-cta .elementor-element-f635ca4 .elementor-button,
body.page-id-515 .as-med-cta a.elementor-button {
	border-radius: 999px !important;
}

/* Club (519) + Research/stories (521): keep bottom as-page-cta Book only.
   Hide hero + mid Membership/inner duplicates (same spam as Pathways). */
body.page-id-519 .as-hero .elementor-element-6450427,
body.page-id-519 .as-hero a.elementor-button[href*='/consultation'],
body.page-id-519 .elementor-element-bcc440e,
body.page-id-521 .as-hero .elementor-element-bac91f1,
body.page-id-521 .as-hero a.elementor-button[href*='/consultation'],
body.page-id-521 .as-inner-stories .elementor-element-bbe6f1f,
body.page-id-521 .elementor-element-bbe6f1f {
	display: none !important;
}

/* Pill-round any leftover boxy Elementor 4px CTAs on these pages. */
body.page-id-519 .as-page-cta a.elementor-button,
body.page-id-521 .as-page-cta a.elementor-button {
	border-radius: 999px !important;
}

/* Kit post-6 ≤900px caps .as-hero__media at 240–300px + cover → tablet zoom.
   Apply on Pathways / Club / Research (not home overlay page). */
@media (max-width: 1024px) {
	body.page-id-515 .as-hero .as-hero__media,
	body.page-id-515 .elementor-element-d57d48e,
	body.page-id-519 .as-hero .as-hero__media,
	body.page-id-519 .elementor-element-37a4078,
	body.page-id-521 .as-hero .as-hero__media,
	body.page-id-521 .elementor-element-27613b1 {
		min-height: clamp(300px, 52vw, 440px) !important;
		max-height: none !important;
		height: auto !important;
		aspect-ratio: 4 / 3 !important;
		background-size: cover !important;
		background-position: center 28% !important;
		background-repeat: no-repeat !important;
	}
}

/* —— My Account: Login|Register tabs on ALL viewports (one surface) ——
   Kit: .woocommerce-account #customer_login > div { bg/border/radius/pad }
   Prior polish also carded the form → card-in-card. Tabs label panels. */
body.woocommerce-account .woocommerce {
	padding-left: 0 !important;
	padding-right: 0 !important;
	max-width: 100%;
}

body.woocommerce-account #customer_login.u-columns.col2-set {
	display: flex !important;
	flex-direction: column !important;
	gap: 0 !important;
	width: 100% !important;
	max-width: 28rem;
	margin: 0 auto !important;
	padding: 0.85rem !important;
	background: #fff !important;
	border: 1px solid rgba(6, 28, 74, 0.12) !important;
	border-radius: 16px !important;
	box-shadow: 0 8px 24px rgba(6, 28, 74, 0.05);
	box-sizing: border-box;
}

@media (min-width: 768px) {
	body.woocommerce-account #customer_login.u-columns.col2-set {
		max-width: 32rem;
		padding: 1.35rem 1.5rem 1.5rem !important;
	}
}

/* Strip kit card chrome from every direct child (tabs + columns) */
body.woocommerce-account #customer_login > div {
	background: transparent !important;
	border: 0 !important;
	border-radius: 0 !important;
	box-shadow: none !important;
	padding: 0 !important;
	margin: 0 !important;
	width: 100% !important;
	max-width: 100% !important;
	float: none !important;
	box-sizing: border-box;
}

body.woocommerce-account #customer_login > .asw-account-tabs {
	display: grid !important;
	grid-template-columns: 1fr 1fr;
	gap: 0.3rem;
	margin: 0 0 1rem !important;
	padding: 0.28rem !important;
	border-radius: 999px !important;
	background: rgba(6, 28, 74, 0.06) !important;
}

body.woocommerce-account .asw-account-tabs__tab {
	appearance: none;
	border: 0;
	border-radius: 999px;
	min-width: 0;
	min-height: 44px;
	padding: 0.55rem 0.5rem;
	background: transparent;
	color: var(--asw-navy);
	font: inherit;
	font-size: clamp(0.75rem, 2vw, 0.95rem);
	font-weight: 600;
	letter-spacing: 0;
	text-transform: uppercase;
	cursor: pointer;
	white-space: nowrap;
}

body.woocommerce-account .asw-account-tabs__tab.is-active,
body.woocommerce-account .asw-account-tabs__tab[aria-selected='true'] {
	background: var(--asw-gold);
	color: var(--asw-navy);
}

body.woocommerce-account .asw-account-tabs__tab:focus-visible,
body.woocommerce-account .woocommerce-button.button:focus-visible {
	outline: 2px solid var(--asw-navy);
	outline-offset: 2px;
}

body.woocommerce-account #customer_login > .u-column1[hidden],
body.woocommerce-account #customer_login > .u-column2[hidden],
body.woocommerce-account #customer_login > .col-1[hidden],
body.woocommerce-account #customer_login > .col-2[hidden] {
	display: none !important;
}

/* Tabs label the panel — drop duplicate Login/Register h2 */
body.woocommerce-account #customer_login:has(.asw-account-tabs) > .u-column1 > h2,
body.woocommerce-account #customer_login:has(.asw-account-tabs) > .u-column2 > h2,
body.woocommerce-account #customer_login:has(.asw-account-tabs) > .col-1 > h2,
body.woocommerce-account #customer_login:has(.asw-account-tabs) > .col-2 > h2 {
	display: none !important;
}

/* Form is content only — no second card */
body.woocommerce-account .woocommerce-form-login,
body.woocommerce-account .woocommerce-form-register {
	background: transparent !important;
	border: 0 !important;
	border-radius: 0 !important;
	padding: 0 !important;
	margin: 0 !important;
	box-shadow: none !important;
	width: 100% !important;
	max-width: 100% !important;
	box-sizing: border-box;
}

body.woocommerce-account .woocommerce form .form-row {
	margin-bottom: 1rem !important;
	width: 100% !important;
}

body.woocommerce-account .woocommerce form .form-row label {
	display: block !important;
	margin-bottom: 0.4rem !important;
	font-size: 0.9rem !important;
	font-weight: 600 !important;
	color: var(--asw-navy) !important;
	line-height: 1.35;
}

body.woocommerce-account .woocommerce form .form-row input.input-text,
body.woocommerce-account .woocommerce form .form-row .woocommerce-Input,
body.woocommerce-account #username,
body.woocommerce-account #password,
body.woocommerce-account #reg_email {
	width: 100% !important;
	max-width: 100% !important;
	min-height: 48px !important;
	height: 48px !important;
	padding: 0.65rem 0.85rem !important;
	font-size: 16px !important;
	line-height: 1.3 !important;
	border-radius: 10px !important;
	border: 1px solid rgba(6, 28, 74, 0.22) !important;
	background: var(--asw-cream) !important;
	color: var(--asw-ink) !important;
	box-sizing: border-box !important;
}

body.woocommerce-account .woocommerce form .form-row input.input-text:focus,
body.woocommerce-account .woocommerce form .form-row .woocommerce-Input:focus {
	outline: 2px solid var(--asw-gold);
	outline-offset: 1px;
	border-color: var(--asw-navy) !important;
	background: #fff !important;
}

body.woocommerce-account .password-input {
	display: flex !important;
	align-items: stretch;
	position: relative;
	width: 100%;
	box-sizing: border-box;
}

body.woocommerce-account .password-input input.input-text {
	padding-right: 3rem !important;
}

body.woocommerce-account .show-password-input {
	position: absolute !important;
	right: 0.35rem !important;
	top: 50% !important;
	transform: translateY(-50%);
	width: 44px !important;
	height: 44px !important;
	min-width: 44px !important;
	display: inline-flex !important;
	align-items: center;
	justify-content: center;
	z-index: 2;
}

body.woocommerce-account .woocommerce-form-login .woocommerce-form__label-for-checkbox {
	display: flex !important;
	align-items: center;
	gap: 0.55rem;
	margin: 0.25rem 0 1rem !important;
	font-weight: 500 !important;
	width: 100%;
}

body.woocommerce-account .woocommerce-form-login .woocommerce-form__label-for-checkbox input {
	width: 1.15rem;
	height: 1.15rem;
	accent-color: var(--asw-navy);
}

body.woocommerce-account .woocommerce-button.button,
body.woocommerce-account button.woocommerce-button {
	width: 100% !important;
	min-height: 48px !important;
	margin: 0.25rem 0 0.75rem !important;
	border-radius: 999px !important;
	background: var(--asw-gold) !important;
	border-color: var(--asw-gold) !important;
	color: var(--asw-navy) !important;
	font-weight: 700 !important;
	letter-spacing: 0.06em !important;
	text-transform: uppercase;
	font-size: 0.9rem !important;
}

body.woocommerce-account .woocommerce-LostPassword,
body.woocommerce-account .woocommerce-form-login .lost_password {
	margin: 0.35rem 0 0 !important;
	text-align: center;
}

body.woocommerce-account .woocommerce-LostPassword a,
body.woocommerce-account a.woocommerce-privacy-policy-link {
	color: var(--asw-navy) !important;
	text-decoration: underline;
	text-underline-offset: 2px;
}

body.woocommerce-account .woocommerce-error,
body.woocommerce-account .woocommerce-message,
body.woocommerce-account .woocommerce-info {
	width: 100% !important;
	max-width: 100% !important;
	box-sizing: border-box;
	margin: 0 0 1rem !important;
	padding: 0.85rem 1rem !important;
	border-radius: 10px;
	overflow-wrap: break-word;
	word-break: normal;
}

body.woocommerce-account .woocommerce-privacy-policy-text,
body.woocommerce-account .woocommerce-form-register > p {
	font-size: 0.88rem !important;
	line-height: 1.45 !important;
	color: var(--asw-ink);
	overflow-wrap: break-word;
}

body.woocommerce-account .elementor-heading-title {
	overflow-wrap: break-word !important;
}

@media (max-width: 767px) {
	.asw-replenish .asw-r-modal .asw-r-btn,
	.asw-replenish [class*='modal'] .asw-r-btn {
		white-space: normal !important;
		height: auto !important;
		min-height: 44px !important;
	}
}

/* UIDB-A11Y-001 remaining: Elementor + Replenish focus (account tabs already above) */
@media (max-width: 767px) {
	.elementor-button:focus-visible,
	.asw-replenish .asw-r-btn:focus-visible {
		outline: 2px solid #061c4a !important;
		outline-offset: 2px !important;
	}
}

/* Desktop nav: kit post-6 forces hamburger ≤1399px.
   Align with Elementor tablet breakpoint (1024): horizontal nav from 1025 up. */
@media (min-width: 1025px) {
	.elementor-location-header .elementor-menu-toggle {
		display: none !important;
	}
	.elementor-location-header .elementor-nav-menu--main {
		display: flex !important;
	}
	.elementor-location-header .elementor-nav-menu--dropdown {
		display: none !important;
	}
}