/*
 * Member-centre polish layer (2026-10-16 meeting follow-up).
 * Loaded last on account pages; scoped to the account page body so the
 * brand header/footer, static pages and Customizer CSS stay untouched.
 * Spacing values follow the Figma member-centre frame (2341:2573):
 * label→field 20, field group gap 40, hint 8, eyebrow→title 8 (scaled to
 * the site's smaller type).
 */

/* 1. Keep content clear of the brand footer wave.
 * The footer uses margin-top:-205px and its wave image starts 120px into
 * the footer, so the last block needs ~125px of room plus breathing space. */
body.woocommerce-account.inbetween-account-r3 [data-elementor-type="wp-page"] .woocommerce {
	padding-bottom: 110px !important; /* my-account-r3.css forces 0 !important */
}
/* On the dashboard the public case list follows and clears the wave itself. */
body.woocommerce-account.inbetween-account-r3 [data-elementor-type="wp-page"] .woocommerce:has(+ .inbetween-account-public-cases) {
	padding-bottom: 0 !important;
}

/* 2. Form fields: label → control, group spacing, hint text. */
body.woocommerce-account .woocommerce :is(.woocommerce-form-row, .form-row) {
	margin-bottom: 28px;
}
body.woocommerce-account .woocommerce :is(.woocommerce-form-row, .form-row) > label,
body.woocommerce-account .inbetween-payment form > label,
body.woocommerce-account .inbetween-five-rounds-compose form > label,
body.woocommerce-account .inbetween-round-image-upload > label {
	display: block;
	margin-bottom: 14px;
	line-height: 1.5;
}
body.woocommerce-account #customer_login :is(.woocommerce-form-row, .form-row) > label {
	margin-bottom: 14px !important; /* auth form labels are forced to 10px elsewhere */
}
body.woocommerce-account .inbetween-payment form > label {
	margin-bottom: 28px;
}
body.woocommerce-account .inbetween-payment form > label > input {
	display: block;
	margin-top: 14px;
}
body.woocommerce-account .woocommerce :is(small, .description, #account_display_name_description) {
	display: block;
	margin-top: 8px;
	line-height: 1.6;
}

/* 3. Text fields: vertically centred text (line-height must fit the box). */
body.woocommerce-account .woocommerce :is(input[type=text], input[type=email], input[type=password], input[type=date], input[type=number], input[type=tel], input[type=search], select) {
	box-sizing: border-box;
	min-height: 48px;
	padding-top: 0;
	padding-bottom: 0;
	line-height: 46px;
}
body.woocommerce-account .woocommerce input[type=date] {
	line-height: normal;
	padding-top: 12px;
	padding-bottom: 12px;
}

/* 4. Buttons and badges: centred label text.
 * Only icon buttons change layout model; the icon span pushed the label
 * off-centre (measured 5px above / 2px below). */
body.woocommerce-account .woocommerce :is(button, .button):has(> .inbetween-dashboard-icon) {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: 8px;
	line-height: 1.3;
}
body.woocommerce-account .woocommerce :is(.inbetween-status-badge, .inbetween-five-rounds-badge) {
	display: inline-flex;
	align-items: center;
	gap: 4px;
	line-height: 1.4;
}

/* 5. Headings, descriptions and actions inside member blocks. */
body.woocommerce-account .woocommerce-MyAccount-content :is(h2, h3) {
	margin-bottom: 12px;
}
body.woocommerce-account .woocommerce-MyAccount-content :is(h2, h3) + p {
	margin-top: 0;
}
body.woocommerce-account .woocommerce-MyAccount-content p + :is(.button, a.button, form, .inbetween-privacy-note, table) {
	margin-top: 20px;
}
body.woocommerce-account .woocommerce-MyAccount-content .inbetween-payment > * + * {
	margin-top: 14px;
}

/* 6. Five rounds: question header, image block, compose area. */
body.woocommerce-account .inbetween-five-rounds-current-heading {
	display: flex;
	align-items: center;
	gap: 12px;
	margin-bottom: 20px;
}
body.woocommerce-account .inbetween-five-rounds-question-label {
	margin: 0 0 16px;
}
body.woocommerce-account .inbetween-round-images {
	margin-bottom: 28px;
}
body.woocommerce-account .inbetween-round-images > strong {
	display: block;
	margin-bottom: 8px;
}
body.woocommerce-account .inbetween-round-images > p {
	margin: 0 0 20px;
}
body.woocommerce-account .inbetween-round-image-upload > input {
	margin-bottom: 16px;
}
body.woocommerce-account .inbetween-five-rounds-compose small {
	margin: 10px 0 20px;
}
body.woocommerce-account .inbetween-five-rounds-submit {
	display: flex;
	align-items: center;
	flex-wrap: wrap;
	gap: 12px 16px;
}
body.woocommerce-account .inbetween-five-rounds-submit + * {
	margin-top: 16px;
}

body.woocommerce-account .inbetween-five-rounds-question {
	padding: 24px 28px !important;
}
body.woocommerce-account .inbetween-five-rounds-fixed {
	padding-bottom: 16px !important;
}
body.woocommerce-account .inbetween-five-rounds-fixed > * + * {
	margin-top: 8px;
}

/* 7. Side rail help card. */
body.woocommerce-account .inbetween-dashboard-help {
	padding: 20px 18px;
}
body.woocommerce-account .inbetween-dashboard-help > strong {
	display: block;
	margin-bottom: 8px;
}
body.woocommerce-account .inbetween-dashboard-help > p {
	margin: 0 0 16px;
	line-height: 1.7;
}

/* 8. Public case component: Figma status colours (dot coloured, text dark). */
body.woocommerce-account .inbetween-account-public-cases {
	padding-bottom: 40px !important;
}
.inbetween-public-cases__eyebrow {
	margin-bottom: 8px !important;
}
.inbetween-public-cases__legend .is-neutral::first-letter,
.inbetween-public-cases__status.is-neutral > span { color: #7cde59; }
.inbetween-public-cases__legend .is-info::first-letter,
.inbetween-public-cases__status.is-info > span { color: #9a6a00; }
.inbetween-public-cases__legend .is-warning::first-letter,
.inbetween-public-cases__status.is-warning > span { color: #f4cc4a; }
.inbetween-public-cases__legend .is-success::first-letter,
.inbetween-public-cases__status.is-success > span { color: #5e5a8a; }
.inbetween-public-cases__legend > span {
	display: inline-block; /* lets ::first-letter colour just the dot */
}
/* public-cases.css colours the label text with `body .inbetween-public-cases .is-*` !important. */
body .inbetween-public-cases .inbetween-public-cases__legend > span,
body .inbetween-public-cases .inbetween-public-cases__status {
	color: #3f5533 !important;
}

/* 9. A1 delivered page (Figma 2434:5234, STEP 3/3): postman + two exits.
 * Figma spacing between note, postman, list and buttons is 40px (scaled to
 * 32/32/40). pdf-functions.css styles these with #inbetween-story-flow, so the
 * id is repeated here. The note keeps a 24px bottom margin from an untraced
 * rule; the postman's 8px top margin makes the visible gap 32px. */
body.inbetween-account-r3--story #inbetween-story-flow .inbetween-pdf-delivered > .inbetween-pdf-delivered__note {
	line-height: 1.8 !important;
}
body.inbetween-account-r3--story #inbetween-story-flow .inbetween-pdf-delivered > .inbetween-pdf-delivered__postman {
	display: block !important;
	width: min(498px, 100%) !important;
	height: auto !important;
	margin: 8px auto 32px !important;
}
body.inbetween-account-r3--story #inbetween-story-flow .inbetween-pdf-delivered > ul {
	margin: 0 auto 40px !important;
}
body.inbetween-account-r3--story #inbetween-story-flow .inbetween-pdf-delivered > .inbetween-pdf-delivered__actions {
	display: flex !important;
	flex-direction: column !important;
	align-items: center !important;
	gap: 24px !important;
	margin-top: 0 !important;
}
body.inbetween-account-r3--story #inbetween-story-flow .inbetween-pdf-delivered > .inbetween-pdf-delivered__actions > a.button {
	display: inline-flex !important;
	align-items: center !important;
	justify-content: center !important;
	width: min(502px, 100%) !important;
	max-width: none !important;
	min-height: 48px !important;
	margin: 0 !important;
	border-radius: 999px !important;
	background: transparent !important;
}
body.inbetween-account-r3--story #inbetween-story-flow .inbetween-pdf-delivered > .inbetween-pdf-delivered__actions > a.inbetween-pdf-delivered__cases {
	border: 1px solid #a8ce76 !important;
	color: #719746 !important;
}
body.inbetween-account-r3--story #inbetween-story-flow .inbetween-pdf-delivered > .inbetween-pdf-delivered__actions > a.inbetween-pdf-delivered__account {
	border: 1px solid #3f5533 !important;
	color: #3f5533 !important;
}

/* 10. Account page hero title: the title row is a column flexbox with
 * align-items:flex-start, so between ~600-1000px the <h1> and its divider sat
 * up to 234px left of centre while the eyebrow/description stayed centred. */
body.woocommerce-account .inbetween-r3-account-heading__title-row {
	align-items: center !important;
}
@media (max-width: 767px) {
	body.woocommerce-account .inbetween-r3-account-heading__title-row {
		margin-bottom: 12px !important;
	}
}

/* 11. Dashboard "my case" strip: own public number + status set by the admin dropdown. */
body.woocommerce-account .inbetween-own-case {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	justify-content: center;
	gap: 8px 20px;
	margin: 20px auto 28px;
	padding: 14px 20px;
	max-width: 640px;
	border: 1px solid #dfe6d6;
	border-radius: 14px;
	background: rgba(255, 255, 255, .72);
	color: #3f5533;
	line-height: 1.6;
}
body.woocommerce-account .inbetween-own-case__label {
	font-weight: 700;
	color: #ed7971;
}
body.woocommerce-account .inbetween-own-case__item {
	display: inline-flex;
	align-items: center;
	gap: 6px;
}
body.woocommerce-account .inbetween-own-case__item strong {
	font-size: 1.05em;
	line-height: 1.6;
}
body.woocommerce-account .inbetween-own-case .inbetween-public-cases__status {
	display: inline-flex;
	align-items: center;
	gap: 4px;
	color: #3f5533 !important;
}
body.woocommerce-account .inbetween-own-case .inbetween-public-cases__status.is-neutral > span { color: #7cde59; }
body.woocommerce-account .inbetween-own-case .inbetween-public-cases__status.is-info > span { color: #9a6a00; }
body.woocommerce-account .inbetween-own-case .inbetween-public-cases__status.is-warning > span { color: #f4cc4a; }
body.woocommerce-account .inbetween-own-case .inbetween-public-cases__status.is-success > span { color: #5e5a8a; }
body.woocommerce-account .inbetween-own-case__note {
	flex-basis: 100%;
	text-align: center;
	color: #80827e;
	font-size: .85em;
}

/* 12. Figma 1920 alignment (2026-10-17): account entry / register form
 * (STEP 1/3 2427:5826 and member centre 2341:2573) and the STEP 2/3 writing
 * header (2429:3663). Values hit the Figma numbers at 1920px and scale down to
 * the previous sizes at 1024px; phones keep the M6-tested layout.
 * Titles use a 12KB subset of jf open huninn (SIL OFL 1.1, renamed as a
 * modified version; licence in assets/fonts/Huninn-LICENSE.txt). */
@font-face {
	font-family: "InBetween Rounded Subset";
	src: url("fonts/inbetween-rounded-subset.woff2") format("woff2");
	font-weight: 400;
	font-style: normal;
	font-display: swap;
}
@media (min-width: 1024px) {
	body.woocommerce-account.inbetween-account-r3 .inbetween-pdf-member-banner h1,
	body.woocommerce-account.inbetween-account-r3 .inbetween-pdf-entry .inbetween-account-intro--auth h1,
	body.woocommerce-account.inbetween-account-r3 .inbetween-pdf-entry .inbetween-account-intro--auth > h2,
	body.woocommerce-account #inbetween-story-flow .inbetween-pdf-flow > h2 {
		font-family: "InBetween Rounded Subset", "Noto Sans TC", sans-serif !important;
		font-weight: 400 !important;
		line-height: 1.4 !important;
		letter-spacing: 0 !important;
		color: #3f5533 !important;
	}
	body.woocommerce-account.inbetween-account-r3 .inbetween-pdf-member-banner h1 {
		font-size: clamp(28px, 2.917vw, 56px) !important;
	}
	body.woocommerce-account.inbetween-account-r3 .inbetween-pdf-entry .inbetween-account-intro--auth h1,
	body.woocommerce-account.inbetween-account-r3 .inbetween-pdf-entry .inbetween-account-intro--auth > h2,
	body.woocommerce-account #inbetween-story-flow .inbetween-pdf-flow > h2 {
		font-size: clamp(28px, 2.084vw, 40px) !important;
		margin: 8px 0 0 !important;
	}
	/* Eyebrow: STEP 22px/180%, member centre 20px/160%, both #ED7971. */
	body.woocommerce-account.inbetween-account-r3 .inbetween-pdf-entry--story .inbetween-account-intro--auth p.inbetween-eyebrow,
	body.woocommerce-account #inbetween-story-flow .inbetween-pdf-flow > .inbetween-pdf-flow__step {
		font-size: clamp(14px, 1.146vw, 22px) !important;
		line-height: 1.8 !important;
		font-weight: 500 !important;
		letter-spacing: .005em !important;
		color: #ed7971 !important;
	}
	body.woocommerce-account.inbetween-account-r3 .inbetween-pdf-entry--member .inbetween-account-intro--auth p.inbetween-eyebrow {
		font-size: clamp(14px, 1.042vw, 20px) !important;
		line-height: 1.6 !important;
		font-weight: 500 !important;
		letter-spacing: .005em !important;
		color: #ed7971 !important;
	}
	/* Intro copy 22px/180% medium, dark green. */
	body.woocommerce-account.inbetween-account-r3 .inbetween-pdf-entry .inbetween-account-intro--auth > p:not(.inbetween-eyebrow),
	body.woocommerce-account #inbetween-story-flow .inbetween-pdf-flow:not(.inbetween-pdf-delivered) > p:not(.inbetween-pdf-flow__step) {
		font-size: clamp(14px, 1.146vw, 22px) !important;
		line-height: 1.8 !important;
		font-weight: 500 !important;
		letter-spacing: .005em !important;
		color: #3f5533 !important;
		max-width: none !important;
	}
	body.woocommerce-account.inbetween-account-r3 .inbetween-pdf-entry .inbetween-account-intro--auth {
		max-width: none !important;
		width: auto !important;
	}
	/* Register form: 416px column, 18px labels, 52px fields, 48px button. */
	body.woocommerce-account.inbetween-account-r3 .inbetween-pdf-entry #customer_login.inbetween-pdf-auth {
		width: clamp(320px, 21.667vw, 416px) !important;
		max-width: 100% !important;
	}
	body.woocommerce-account.inbetween-account-r3 .inbetween-pdf-entry #customer_login.inbetween-pdf-auth form > .form-row > label,
	body.woocommerce-account.inbetween-account-r3 .inbetween-pdf-entry #customer_login.inbetween-pdf-auth form > .woocommerce-form-row > label {
		font-size: clamp(16px, .9375vw, 18px) !important;
		line-height: 1.4 !important;
		font-weight: 500 !important;
		letter-spacing: .005em !important;
		color: #3f5533 !important;
		margin-bottom: 20px !important;
	}
	body.woocommerce-account.inbetween-account-r3 .inbetween-pdf-entry #customer_login.inbetween-pdf-auth :is(input[type=email], input[type=password], input[type=text]) {
		height: 52px !important;
		min-height: 52px !important;
		padding: 0 18px !important;
		line-height: 50px !important;
		font-size: clamp(16px, .9375vw, 18px) !important;
		border: 1px solid #868784 !important;
		background-color: #faf8f4 !important;
	}
	body.woocommerce-account.inbetween-account-r3 .inbetween-pdf-entry #customer_login.inbetween-pdf-auth :is(.form-row, .woocommerce-form-row) {
		margin-bottom: 40px !important;
	}
	body.woocommerce-account.inbetween-account-r3 .inbetween-pdf-entry #customer_login.inbetween-pdf-auth .form-row:has(+ #inbetween-password-rule) {
		margin-bottom: 8px !important;
	}
	body.woocommerce-account.inbetween-account-r3 .inbetween-pdf-entry #customer_login.inbetween-pdf-auth #inbetween-password-rule {
		margin: 0 0 40px !important;
		font-size: clamp(13px, 1.146vw, 22px) !important;
		line-height: 1.8 !important;
		font-weight: 500 !important;
		letter-spacing: .005em !important;
		color: #868784 !important;
		white-space: nowrap;
	}
	body.woocommerce-account.inbetween-account-r3 .inbetween-pdf-entry #customer_login.inbetween-pdf-auth :is(.woocommerce-privacy-policy-text p, .inbetween-registration-challenge .description) {
		font-size: clamp(14px, .834vw, 16px) !important;
		line-height: 1.7 !important;
		color: #868784 !important;
	}
	body.woocommerce-account.inbetween-account-r3 .inbetween-pdf-entry #customer_login.inbetween-pdf-auth form button.button.woocommerce-form-register__submit {
		width: 100% !important;
		height: 48px !important;
		min-height: 48px !important;
		padding: 0 24px !important;
		border-radius: 999px !important;
		background: #a8d176 !important;
		border-color: #a8d176 !important;
		color: #f5f5f5 !important;
		font-size: clamp(14px, .9375vw, 18px) !important;
		line-height: 1.4 !important;
		font-weight: 500 !important;
		letter-spacing: .005em !important;
		display: inline-flex !important;
		align-items: center !important;
		justify-content: center !important;
	}
	body.woocommerce-account.inbetween-account-r3 .inbetween-pdf-entry #customer_login.inbetween-pdf-auth form > .form-row:last-of-type {
		margin: 32px 0 0 !important;
	}
	body.woocommerce-account.inbetween-account-r3 .inbetween-pdf-entry #customer_login.inbetween-pdf-auth .inbetween-pdf-auth__switch {
		display: block !important;
		margin-top: 28px !important;
		padding: 0 !important;
		font-size: clamp(16px, 1.146vw, 22px) !important;
		line-height: 1.4 !important;
		font-weight: 500 !important;
		color: #4f6b45 !important;
		opacity: .8;
		text-align: center !important;
	}
	body.woocommerce-account.inbetween-account-r3 .inbetween-pdf-entry #customer_login.inbetween-pdf-auth .inbetween-pdf-auth__note {
		width: min(900px, 90vw) !important;
		max-width: none !important;
		margin: 28px 0 0 !important; /* pdf-functions.css centres it with left:50% + translateX(-50%) */
		font-size: clamp(14px, 1.146vw, 22px) !important;
		line-height: 1.8 !important;
		font-weight: 500 !important;
		letter-spacing: .005em !important;
		color: #868784 !important;
		opacity: .8;
		text-align: center !important;
	}
	/* Figma: title top → intro 140, intro → first label 80. */
	body.woocommerce-account.inbetween-account-r3 .inbetween-pdf-entry .inbetween-account-intro--auth > p:nth-of-type(2) {
		margin-top: 18px !important;
	}
	body.woocommerce-account.inbetween-account-r3 .inbetween-pdf-entry .inbetween-account-intro--auth {
		margin-bottom: 80px !important;
	}
	/* Privacy notice and the Cloudflare check are required extras not drawn in
	 * Figma; keep them compact between the last field and the button. */
	body.woocommerce-account.inbetween-account-r3 .inbetween-pdf-entry #customer_login.inbetween-pdf-auth form > p.woocommerce-form-row:has(#reg_password_confirmation) {
		margin-bottom: 24px !important;
	}
	body.woocommerce-account.inbetween-account-r3 .inbetween-pdf-entry #customer_login.inbetween-pdf-auth .inbetween-registration-challenge {
		margin-top: 16px !important;
	}
	body.woocommerce-account.inbetween-account-r3 .inbetween-pdf-entry #customer_login.inbetween-pdf-auth .inbetween-registration-challenge .description {
		margin-bottom: 0 !important;
	}
	body.woocommerce-account.inbetween-account-r3 .inbetween-pdf-entry #customer_login.inbetween-pdf-auth form > .form-row:last-of-type {
		margin-top: 24px !important;
	}
}

/* 13. STEP 3/3 delivered page at Figma 1920 (2434:5234): note 22px dark green,
 * postman 478 wide, privacy list 22px grey in a 416 column, outline buttons
 * 416×48 on white with 18px text, 40px between list and buttons and between
 * the two buttons. Overrides section 9 (same selectors, later in the file). */
@media (min-width: 1024px) {
	body.inbetween-account-r3--story #inbetween-story-flow .inbetween-pdf-delivered > .inbetween-pdf-delivered__note {
		width: min(498px, 100%) !important;
		max-width: none !important;
		margin: 24px auto 24px !important;
		font-size: clamp(14px, 1.146vw, 22px) !important;
		line-height: 1.8 !important;
		font-weight: 500 !important;
		letter-spacing: .005em !important;
		color: #3f5533 !important;
	}
	body.inbetween-account-r3--story #inbetween-story-flow .inbetween-pdf-delivered > .inbetween-pdf-delivered__postman {
		width: clamp(380px, 24.896vw, 478px) !important;
		margin: 4px auto 72px !important;
	}
	body.inbetween-account-r3--story #inbetween-story-flow .inbetween-pdf-delivered > ul {
		width: clamp(320px, 21.667vw, 416px) !important;
		max-width: 100% !important;
		margin: 0 auto 40px !important;
		font-size: clamp(14px, 1.146vw, 22px) !important;
		line-height: 1.8 !important;
		font-weight: 500 !important;
		letter-spacing: .005em !important;
		color: #868784 !important;
	}
	body.inbetween-account-r3--story #inbetween-story-flow .inbetween-pdf-delivered > ul > li {
		font-size: inherit !important;
		line-height: inherit !important;
		font-weight: inherit !important;
		color: inherit !important;
	}
	body.inbetween-account-r3--story #inbetween-story-flow .inbetween-pdf-delivered > .inbetween-pdf-delivered__actions {
		gap: 40px !important;
	}
	body.inbetween-account-r3--story #inbetween-story-flow .inbetween-pdf-delivered > .inbetween-pdf-delivered__actions > a.button {
		width: clamp(320px, 21.667vw, 416px) !important;
		height: 48px !important;
		min-height: 48px !important;
		padding: 0 24px !important;
		background: #fff !important;
		font-size: clamp(14px, .9375vw, 18px) !important;
		line-height: 1.4 !important;
		font-weight: 500 !important;
		letter-spacing: .005em !important;
	}
	body.inbetween-account-r3--story #inbetween-story-flow .inbetween-pdf-delivered > .inbetween-pdf-delivered__actions > a.inbetween-pdf-delivered__cases {
		border: 1px solid #a8d176 !important;
		color: #a8d176 !important;
	}
	body.inbetween-account-r3--story #inbetween-story-flow .inbetween-pdf-delivered > .inbetween-pdf-delivered__actions > a.inbetween-pdf-delivered__account {
		border: 1px solid #3f5533 !important;
		color: #3f5533 !important;
	}
}

/* 14. Shared member-area style from the Figma baseline (2026-10-17, user
 * approved): pages in the quote without their own design use the same type,
 * colours, fields and buttons as the designed frames.
 *   title    rounded 40px   #3F5533      eyebrow  20px 500 #ED7971
 *   section  rounded 28px   #3F5533      lead     22px/180% #3F5533
 *   body     18px/160%      #3F5533      muted    18px #868784
 *   label    18px 500       fields 52px high, 18px, #868784 border, #FAF8F4
 *   buttons  48px high, 18px 500; primary #A8D176 fill + #F5F5F5 text,
 *            secondary white with #3F5533 outline
 * Sizes reach the Figma values at 1920px and scale to the older sizes at
 * 1024px; colours apply at every width. Selectors repeat the ids/classes the
 * child theme uses so these rules win without editing the theme. */
:root {
	--ib-ink: #3f5533;
	--ib-muted: #868784;
	--ib-pink: #ed7971;
	--ib-link: #4f6b45;
	--ib-green: #a8d176;
	--ib-on-green: #f5f5f5;
	--ib-field: #faf8f4;
	--ib-title: clamp(28px, 2.084vw, 40px);
	--ib-section: clamp(20px, 1.459vw, 28px);
	--ib-eyebrow: clamp(14px, 1.042vw, 20px);
	--ib-lead: clamp(15px, 1.146vw, 22px);
	--ib-body: clamp(14px, .9375vw, 18px);
	--ib-th: clamp(14px, 1.042vw, 20px);
	--ib-round: "InBetween Rounded Subset", "Noto Sans TC", sans-serif;
}

/* Colours (all widths). */
html body.woocommerce-account.inbetween-account-r3.inbetween-account-r3.inbetween-account-r3 :is(#inbetween-account-page-title, #inbetween-password-title),
html body.woocommerce-account.inbetween-account-r3.inbetween-account-r3.inbetween-account-r3 .woocommerce-MyAccount-content :is(h2, h3, legend),
html body.woocommerce-account.inbetween-account-r3.inbetween-account-r3.inbetween-account-r3 .inbetween-member-identity h2,
html body.inbetween-commerce-r2-page.inbetween-commerce-r2-page.inbetween-commerce-r2-page .elementor-widget-container > h1 {
	color: var(--ib-ink) !important;
}
html body.woocommerce-account.inbetween-account-r3.inbetween-account-r3.inbetween-account-r3 .inbetween-r3-account-heading > p.inbetween-eyebrow,
html body .inbetween-public-cases.inbetween-public-cases .inbetween-public-cases__intro.inbetween-public-cases__intro > p.inbetween-public-cases__eyebrow {
	color: var(--ib-pink) !important;
}
html body.woocommerce-account.inbetween-account-r3.inbetween-account-r3.inbetween-account-r3 .woocommerce-MyAccount-content :is(p, li, dt, dd, label, td, th):not(.inbetween-public-cases *),
html body.woocommerce-account.inbetween-account-r3.inbetween-account-r3.inbetween-account-r3 .inbetween-r3-account-heading > p:not(.inbetween-eyebrow),
html body.woocommerce-account.inbetween-account-r3.inbetween-account-r3.inbetween-account-r3 .inbetween-password-panel :is(p, label) {
	color: var(--ib-ink) !important;
}
html body.woocommerce-account.inbetween-account-r3.inbetween-account-r3.inbetween-account-r3 .woocommerce-MyAccount-content :is(.description, small, time, .inbetween-story-saved-at, .inbetween-story-autosave-status),
html body.woocommerce-account.inbetween-account-r3.inbetween-account-r3.inbetween-account-r3 #inbetween-account-help p {
	color: var(--ib-muted) !important;
}
html body.woocommerce-account.inbetween-account-r3.inbetween-account-r3.inbetween-account-r3 .woocommerce-MyAccount-content p a:not(.button):not(.woocommerce-button),
html body.woocommerce-account.inbetween-account-r3.inbetween-account-r3.inbetween-account-r3 .woocommerce-LostPassword a,
html body.woocommerce-account.inbetween-account-r3.inbetween-account-r3.inbetween-account-r3 .inbetween-password-panel a:not(.button) {
	color: var(--ib-link) !important;
}

/* Buttons: primary = filled green, the rest = white with dark green outline. */
html body.woocommerce-account.inbetween-account-r3.inbetween-account-r3.inbetween-account-r3 :is(.woocommerce-MyAccount-content, #inbetween-account-help, .inbetween-password-panel, #customer_login) :is(a.button, button.button, .woocommerce-button, input[type=submit]):not(.show-password-input),
html body.inbetween-commerce-r2-page.inbetween-commerce-r2-page.inbetween-commerce-r2-page .woocommerce :is(a.button, button.button):not(.show-password-input) {
	display: inline-flex !important;
	align-items: center !important;
	justify-content: center !important;
	min-height: 48px !important;
	height: auto !important;
	padding: 0 32px !important;
	border-radius: 999px !important;
	line-height: 1.4 !important;
	font-weight: 500 !important;
	letter-spacing: .005em !important;
	background: #fff !important;
	border: 1px solid var(--ib-ink) !important;
	color: var(--ib-ink) !important;
	box-shadow: none !important;
}
html body.woocommerce-account.inbetween-account-r3.inbetween-account-r3.inbetween-account-r3 :is(.woocommerce-MyAccount-content, #inbetween-account-help, .inbetween-password-panel, #customer_login) :is(.button.alt, .inbetween-dashboard-card--primary > a.button, button[name=save_account_details], .inbetween-privacy-requests form button.button, .woocommerce-form-login__submit, .woocommerce-form-register__submit, form.lost_reset_password button.button):not(.show-password-input) {
	background: var(--ib-green) !important;
	border-color: var(--ib-green) !important;
	color: var(--ib-on-green) !important;
}
html body.woocommerce-account.inbetween-account-r3.inbetween-account-r3.inbetween-account-r3 #customer_login a:not(.button):not(.inbetween-pdf-auth__switch) {
	color: var(--ib-link) !important;
}

/* Fields. */
html body.woocommerce-account.inbetween-account-r3.inbetween-account-r3.inbetween-account-r3 :is(.woocommerce-MyAccount-content, .inbetween-password-panel) :is(input[type=text], input[type=email], input[type=password], input[type=tel], input[type=number], input[type=date], select, textarea),
html body.inbetween-commerce-r2-page.inbetween-commerce-r2-page.inbetween-commerce-r2-page .woocommerce :is(input[type=text], input[type=email], input[type=tel], select, textarea) {
	border: 1px solid var(--ib-muted) !important;
	background-color: var(--ib-field) !important;
	color: var(--ib-ink) !important;
	border-radius: 12px !important;
}

@media (min-width: 1024px) {
	/* Page titles. */
	html body.woocommerce-account.inbetween-account-r3.inbetween-account-r3.inbetween-account-r3 :is(#inbetween-account-page-title, #inbetween-password-title),
	html body.inbetween-commerce-r2-page.inbetween-commerce-r2-page.inbetween-commerce-r2-page .elementor-widget-container > h1 {
		font-family: var(--ib-round) !important;
		font-size: var(--ib-title) !important;
		font-weight: 400 !important;
		line-height: 1.4 !important;
		letter-spacing: 0 !important;
	}
	/* Section titles inside the content. */
	html body.woocommerce-account.inbetween-account-r3.inbetween-account-r3.inbetween-account-r3 .woocommerce-MyAccount-content :is(h2, h3, legend):not(.inbetween-public-cases *),
	html body.woocommerce-account.inbetween-account-r3.inbetween-account-r3.inbetween-account-r3 .inbetween-member-identity h2,
	html body.woocommerce-account.inbetween-account-r3.inbetween-account-r3.inbetween-account-r3 #customer_login .inbetween-pdf-auth__panel > h2 {
		font-family: var(--ib-round) !important;
		font-size: var(--ib-section) !important;
		font-weight: 400 !important;
		line-height: 1.4 !important;
		letter-spacing: 0 !important;
		color: var(--ib-ink) !important;
	}
	/* Eyebrows. */
	html body.woocommerce-account.inbetween-account-r3.inbetween-account-r3.inbetween-account-r3 .inbetween-r3-account-heading > p.inbetween-eyebrow,
	html body .inbetween-public-cases.inbetween-public-cases .inbetween-public-cases__intro.inbetween-public-cases__intro > p.inbetween-public-cases__eyebrow {
		font-size: var(--ib-eyebrow) !important;
		font-weight: 500 !important;
		line-height: 1.6 !important;
		letter-spacing: .005em !important;
	}
	/* Lead under a page title. */
	html body.woocommerce-account.inbetween-account-r3.inbetween-account-r3.inbetween-account-r3 .inbetween-r3-account-heading > p:not(.inbetween-eyebrow),
	html body.woocommerce-account.inbetween-account-r3.inbetween-account-r3.inbetween-account-r3 .inbetween-password-heading p {
		font-size: var(--ib-lead) !important;
		line-height: 1.8 !important;
		font-weight: 500 !important;
		letter-spacing: .005em !important;
	}
	/* Body copy in dense member pages. */
	html body.woocommerce-account.inbetween-account-r3.inbetween-account-r3.inbetween-account-r3 .woocommerce-MyAccount-content :is(p, li, dt, dd, td, small, .description):not(.inbetween-public-cases *),
	html body.woocommerce-account.inbetween-account-r3.inbetween-account-r3.inbetween-account-r3 #inbetween-account-help p,
	html body.woocommerce-account.inbetween-account-r3.inbetween-account-r3.inbetween-account-r3 .inbetween-password-panel p {
		font-size: var(--ib-body) !important;
		line-height: 1.6 !important;
	}
	/* Labels. */
	html body.woocommerce-account.inbetween-account-r3.inbetween-account-r3.inbetween-account-r3 :is(.woocommerce-MyAccount-content, .inbetween-password-panel) label:not(.woocommerce-form__label-for-checkbox) {
		font-size: var(--ib-body) !important;
		font-weight: 500 !important;
		line-height: 1.4 !important;
	}
	/* Fields: 52px, 18px. */
	html body.woocommerce-account.inbetween-account-r3.inbetween-account-r3.inbetween-account-r3 :is(.woocommerce-MyAccount-content, .inbetween-password-panel) :is(input[type=text], input[type=email], input[type=password], input[type=tel], input[type=number], select),
	html body.inbetween-commerce-r2-page.inbetween-commerce-r2-page.inbetween-commerce-r2-page .woocommerce :is(input[type=text], input[type=email], input[type=tel], select) {
		height: 52px !important;
		min-height: 52px !important;
		padding: 0 18px !important;
		line-height: 50px !important;
		font-size: var(--ib-body) !important;
	}
	html body.woocommerce-account.inbetween-account-r3.inbetween-account-r3.inbetween-account-r3 .woocommerce-MyAccount-content textarea {
		padding: 14.5px 18px !important;
		font-size: var(--ib-body) !important;
		line-height: 1.6 !important;
	}
	/* Buttons: 48px, 18px. */
	html body.woocommerce-account.inbetween-account-r3.inbetween-account-r3.inbetween-account-r3 :is(.woocommerce-MyAccount-content, #inbetween-account-help, .inbetween-password-panel, #customer_login) :is(a.button, button.button, .woocommerce-button, input[type=submit]):not(.show-password-input),
	html body.inbetween-commerce-r2-page.inbetween-commerce-r2-page.inbetween-commerce-r2-page .woocommerce :is(a.button, button.button):not(.show-password-input) {
		min-height: 48px !important;
		font-size: var(--ib-body) !important;
	}
	/* Tables: header 20px bold (orders). */
	html body.woocommerce-account.inbetween-account-r3.inbetween-account-r3.inbetween-account-r3 .woocommerce-MyAccount-content table:not(.inbetween-public-cases__table) th {
		font-size: var(--ib-th) !important;
		font-weight: 700 !important;
	}
	/* Public case component (designed in 2341:2573): rounded 40px title,
	 * pink subtitle 22px at 80%, header 20px bold, cells 22px at 80%. */
	html body .inbetween-public-cases.inbetween-public-cases .inbetween-public-cases__intro.inbetween-public-cases__intro > h2 {
		font-family: var(--ib-round) !important;
		font-size: var(--ib-title) !important;
		font-weight: 400 !important;
		line-height: 1.4 !important;
		letter-spacing: 0 !important;
		color: var(--ib-ink) !important;
	}
	html body .inbetween-public-cases.inbetween-public-cases .inbetween-public-cases__intro.inbetween-public-cases__intro > p:not(.inbetween-public-cases__eyebrow) {
		font-size: var(--ib-lead) !important;
		line-height: 1.8 !important;
		font-weight: 500 !important;
		color: var(--ib-pink) !important;
		opacity: .8;
	}
	html body .inbetween-public-cases.inbetween-public-cases table.inbetween-public-cases__table.inbetween-public-cases__table th {
		font-size: var(--ib-th) !important;
		font-weight: 700 !important;
		line-height: 1.4 !important;
		color: var(--ib-ink) !important;
	}
	html body .inbetween-public-cases.inbetween-public-cases table.inbetween-public-cases__table.inbetween-public-cases__table td {
		font-size: var(--ib-lead) !important;
		font-weight: 500 !important;
		line-height: 1.4 !important;
		color: rgba(63, 85, 51, .8) !important;
	}
	/* Account navigation rail. */
	html body.woocommerce-account.inbetween-account-r3.inbetween-account-r3.inbetween-account-r3 #inbetween-account-navigation .woocommerce-MyAccount-navigation a {
		font-size: var(--ib-body) !important;
		color: var(--ib-ink) !important;
	}
}

/* 14b. Small text that kept older sizes/colours: help card, member number,
 * status badges, five-round progress, public case summary/legend/status. */
html body.woocommerce-account.inbetween-account-r3.inbetween-account-r3.inbetween-account-r3 :is(#inbetween-account-help > strong, .inbetween-member-identity strong, .inbetween-rounds-summary, .inbetween-five-rounds-progress__copy strong, .inbetween-five-rounds-fixed strong, .inbetween-round-images strong, .inbetween-five-rounds-history__copy strong, .inbetween-five-rounds-history__action, .woocommerce-orders-table th a) {
	color: var(--ib-ink) !important;
}
html body.woocommerce-account.inbetween-account-r3.inbetween-account-r3.inbetween-account-r3 :is(.inbetween-meta-label, .inbetween-five-rounds-history__copy > span:not(:first-child)) {
	color: var(--ib-muted) !important;
}
html body .inbetween-public-cases.inbetween-public-cases :is(.inbetween-public-cases__count-note, .inbetween-public-cases__updated, .inbetween-public-cases__updated time) {
	color: rgba(63, 85, 51, .8) !important;
}
@media (min-width: 1024px) {
	html body.woocommerce-account.inbetween-account-r3.inbetween-account-r3.inbetween-account-r3 :is(#inbetween-account-help > strong, .inbetween-five-rounds-progress__copy strong, .inbetween-five-rounds-fixed strong, .inbetween-round-images strong, .inbetween-five-rounds-history__copy strong) {
		font-size: var(--ib-body) !important;
		font-weight: 500 !important;
	}
	html body.woocommerce-account.inbetween-account-r3.inbetween-account-r3.inbetween-account-r3 :is(.inbetween-meta-label, .inbetween-five-rounds-history__copy > span, .inbetween-five-rounds-history__action) {
		font-size: clamp(13px, .834vw, 16px) !important;
	}
	html body.woocommerce-account.inbetween-account-r3.inbetween-account-r3.inbetween-account-r3 :is(.inbetween-status-badge, .inbetween-status-badge *, .inbetween-five-rounds-badge) {
		font-size: clamp(12px, .834vw, 16px) !important;
	}
	html body .inbetween-public-cases.inbetween-public-cases :is(.inbetween-public-cases__count-note, .inbetween-public-cases__updated, .inbetween-public-cases__updated time) {
		font-size: var(--ib-lead) !important;
		line-height: 1.8 !important;
		font-weight: 500 !important;
	}
	html body .inbetween-public-cases.inbetween-public-cases .inbetween-public-cases__legend > span {
		font-size: var(--ib-body) !important;
		font-weight: 500 !important;
		color: var(--ib-ink) !important;
	}
	html body .inbetween-public-cases.inbetween-public-cases td .inbetween-public-cases__status {
		font-size: inherit !important;
		font-weight: 500 !important;
		color: inherit !important;
	}
}
@media (min-width: 1024px) {
	/* Narrow five-round rail: the case number would break at section size. */
	html body.woocommerce-account.inbetween-account-r3.inbetween-account-r3.inbetween-account-r3 .woocommerce-MyAccount-content .inbetween-five-rounds-rail > h2 {
		font-size: clamp(16px, 1.146vw, 22px) !important;
		word-break: keep-all;
	}
}

/* 15. Full-width member banners (client 2026-10-20 「會員中心要滿版」; Figma 2341:2573, 2434:5234).
   The logged-in page heading, the guest 「我的關係」 banner and the story STEP block span the viewport and,
   like every other page's top photo, start at y=0 under the translucent header.
   Generated by scripts/member-fullbleed-css.py; --ib-acc-hd = header height (140px x header zoom, 80px <=1024). */
body.inbetween-account-r3 { --ib-acc-hd: 140px; }
@media (min-width: 1025px) and (max-width: 1056px) { body.inbetween-account-r3 { --ib-acc-hd: 73.28px; } }
@media (min-width: 1057px) and (max-width: 1088px) { body.inbetween-account-r3 { --ib-acc-hd: 75.61px; } }
@media (min-width: 1089px) and (max-width: 1120px) { body.inbetween-account-r3 { --ib-acc-hd: 77.95px; } }
@media (min-width: 1121px) and (max-width: 1152px) { body.inbetween-account-r3 { --ib-acc-hd: 80.28px; } }
@media (min-width: 1153px) and (max-width: 1184px) { body.inbetween-account-r3 { --ib-acc-hd: 82.61px; } }
@media (min-width: 1185px) and (max-width: 1216px) { body.inbetween-account-r3 { --ib-acc-hd: 84.95px; } }
@media (min-width: 1217px) and (max-width: 1248px) { body.inbetween-account-r3 { --ib-acc-hd: 87.28px; } }
@media (min-width: 1249px) and (max-width: 1280px) { body.inbetween-account-r3 { --ib-acc-hd: 89.61px; } }
@media (min-width: 1281px) and (max-width: 1312px) { body.inbetween-account-r3 { --ib-acc-hd: 91.95px; } }
@media (min-width: 1313px) and (max-width: 1344px) { body.inbetween-account-r3 { --ib-acc-hd: 94.28px; } }
@media (min-width: 1345px) and (max-width: 1376px) { body.inbetween-account-r3 { --ib-acc-hd: 96.61px; } }
@media (min-width: 1377px) and (max-width: 1408px) { body.inbetween-account-r3 { --ib-acc-hd: 98.95px; } }
@media (min-width: 1409px) and (max-width: 1440px) { body.inbetween-account-r3 { --ib-acc-hd: 101.28px; } }
@media (min-width: 1441px) and (max-width: 1472px) { body.inbetween-account-r3 { --ib-acc-hd: 103.61px; } }
@media (min-width: 1473px) and (max-width: 1504px) { body.inbetween-account-r3 { --ib-acc-hd: 105.95px; } }
@media (min-width: 1505px) and (max-width: 1536px) { body.inbetween-account-r3 { --ib-acc-hd: 108.28px; } }
@media (min-width: 1537px) and (max-width: 1568px) { body.inbetween-account-r3 { --ib-acc-hd: 110.61px; } }
@media (min-width: 1569px) and (max-width: 1600px) { body.inbetween-account-r3 { --ib-acc-hd: 112.95px; } }
@media (min-width: 1601px) and (max-width: 1632px) { body.inbetween-account-r3 { --ib-acc-hd: 115.28px; } }
@media (min-width: 1633px) and (max-width: 1664px) { body.inbetween-account-r3 { --ib-acc-hd: 117.61px; } }
@media (min-width: 1665px) and (max-width: 1696px) { body.inbetween-account-r3 { --ib-acc-hd: 119.95px; } }
@media (min-width: 1697px) and (max-width: 1728px) { body.inbetween-account-r3 { --ib-acc-hd: 122.28px; } }
@media (min-width: 1729px) and (max-width: 1760px) { body.inbetween-account-r3 { --ib-acc-hd: 124.61px; } }
@media (min-width: 1761px) and (max-width: 1792px) { body.inbetween-account-r3 { --ib-acc-hd: 126.95px; } }
@media (min-width: 1793px) and (max-width: 1824px) { body.inbetween-account-r3 { --ib-acc-hd: 129.28px; } }
@media (min-width: 1825px) and (max-width: 1856px) { body.inbetween-account-r3 { --ib-acc-hd: 131.61px; } }
@media (min-width: 1857px) and (max-width: 1888px) { body.inbetween-account-r3 { --ib-acc-hd: 133.95px; } }
@media (min-width: 1889px) and (max-width: 1919px) { body.inbetween-account-r3 { --ib-acc-hd: 136.28px; } }
@media (min-width: 1920px) and (max-width: 1939px) { body.inbetween-account-r3 { --ib-acc-hd: 138.54px; } }
@media (max-width: 1024px) { body.inbetween-account-r3 { --ib-acc-hd: 80px; } }
/* No top padding on the page shell; the page wrapper clips the scrollbar-width overhang (no horizontal scroll). */
body.woocommerce-account.inbetween-account-r3 .elementor .inb-account-shell { padding-top: 0 !important; }
body.woocommerce-account.inbetween-account-r3 [data-elementor-type="wp-page"] { overflow-x: clip; }
body.woocommerce-account.inbetween-account-r3:not(.inbetween-account-r3--story) .inbetween-r3-account-heading, body.woocommerce-account.inbetween-account-r3 .inbetween-pdf-member-banner, body.woocommerce-account.inbetween-account-r3 #inbetween-story-flow .inbetween-pdf-flow {
  box-sizing: border-box !important; width: 100vw !important; max-width: none !important; align-self: stretch !important;
  margin-left: calc(50% - 50vw) !important; margin-right: 0 !important; border-radius: 0 !important;
  margin-top: calc(-1 * var(--ib-acc-hd)) !important;
}
/* The part under the header is a transparent top border, so each breakpoint keeps its own padding;
   the background starts at the border edge and runs behind the header. */
body.woocommerce-account.inbetween-account-r3:not(.inbetween-account-r3--story) .inbetween-r3-account-heading, body.woocommerce-account.inbetween-account-r3 .inbetween-pdf-member-banner, body.woocommerce-account.inbetween-account-r3 #inbetween-story-flow .inbetween-pdf-flow { border-top: var(--ib-acc-hd) solid transparent !important; background-origin: border-box !important; }
/* The guest banner has a fixed height: keep it for the content and add the border on top. */
body.woocommerce-account.inbetween-account-r3 .inbetween-pdf-member-banner { box-sizing: content-box !important; }
/* Story page: the 16px top margin of the content column (<=1024) would leave a strip under the header. */
body.woocommerce-account.inbetween-account-r3.inbetween-account-r3--story .inbetween-account-main { margin-top: 0 !important; }