/* Fund My Solar form styles */

.fms-wrap *,
.fms-wrap *::before,
.fms-wrap *::after {
	box-sizing: border-box;
}

.fms-wrap {
	font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen, Ubuntu, sans-serif;
	color: var(--fms-text, #1a1a1a);
	width: 100%;
	max-width: none;
	margin: 0;
	padding: 0;
}

.fms-shell {
	background: var(--fms-bg, #ffffff);
	border-radius: calc(var(--fms-radius, 12px) * 1.5);
	box-shadow: 0 18px 60px rgba(10, 124, 58, 0.08), 0 4px 12px rgba(0, 0, 0, 0.04);
	overflow: hidden;
	border: 1px solid #e8eee9;
	width: 100%;
	height: 70vh;
	min-height: 520px;
	display: flex;
	flex-direction: column;
}

.fms-header {
	padding: 20px 28px 0;
}

.fms-logo {
	max-height: 36px;
	display: block;
	margin-bottom: 14px;
}

.fms-brand {
	font-weight: 700;
	font-size: 17px;
	color: var(--fms-primary, #0a7c3a);
	margin-bottom: 14px;
}

.fms-progress {
	height: 6px;
	background: #f1f4f2;
	border-radius: 999px;
	overflow: hidden;
}

.fms-progress-bar {
	height: 100%;
	background: linear-gradient(90deg, var(--fms-primary, #0a7c3a), var(--fms-primary-dark, #085c2b));
	border-radius: 999px;
	width: 0%;
	transition: width 0.45s ease;
}

.fms-body {
	padding: 30px 28px 36px;
	position: relative;
	flex: 1 1 auto;
	overflow-y: auto;
	-webkit-overflow-scrolling: touch;
}

.fms-header {
	flex-shrink: 0;
}

.fms-step {
	animation: fmsFadeIn 0.45s ease;
}

@keyframes fmsFadeIn {
	from { opacity: 0; transform: translateY(12px); }
	to   { opacity: 1; transform: translateY(0); }
}

.fms-h {
	font-size: 26px;
	line-height: 1.25;
	font-weight: 700;
	margin: 0 0 10px;
	color: var(--fms-text);
}

.fms-sub {
	font-size: 16px;
	line-height: 1.55;
	color: #4a5b50;
	margin: 0 0 24px;
}

.fms-field {
	display: flex;
	gap: 10px;
	flex-wrap: wrap;
}

.fms-field input {
	flex: 1 1 220px;
	min-width: 0;
	padding: 16px 18px;
	font-size: 17px;
	border: 2px solid #d8e3dc;
	border-radius: var(--fms-radius, 12px);
	background: #fff;
	color: var(--fms-text);
	text-transform: uppercase;
	transition: border-color 0.2s, box-shadow 0.2s;
}

.fms-field input:focus {
	outline: none;
	border-color: var(--fms-primary);
	box-shadow: 0 0 0 4px rgba(10, 124, 58, 0.12);
}

.fms-btn {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	padding: 16px 26px;
	font-size: 16px;
	font-weight: 600;
	border: none;
	border-radius: var(--fms-radius, 12px);
	cursor: pointer;
	transition: transform 0.15s ease, box-shadow 0.2s ease, background 0.2s ease;
	font-family: inherit;
}

.fms-btn-primary {
	background: var(--fms-primary, #0a7c3a);
	color: #fff;
	box-shadow: 0 8px 18px rgba(10, 124, 58, 0.25);
}

.fms-btn-primary:hover {
	background: var(--fms-primary-dark, #085c2b);
	transform: translateY(-1px);
}

.fms-btn-block {
	display: flex;
	width: 100%;
	padding: 18px;
	font-size: 17px;
	margin-top: 8px;
}

.fms-options {
	display: flex;
	flex-direction: column;
	gap: 12px;
	margin-bottom: 22px;
}

.fms-options-grid {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(160px, 1fr));
	gap: 12px;
}

.fms-option {
	padding: 18px 22px;
	background: #f7faf7;
	border: 2px solid #e3ebe5;
	border-radius: var(--fms-radius, 12px);
	font-size: 16px;
	font-weight: 500;
	text-align: left;
	cursor: pointer;
	transition: all 0.18s ease;
	color: var(--fms-text);
	font-family: inherit;
	position: relative;
}

.fms-option:hover {
	border-color: var(--fms-primary, #0a7c3a);
	background: #fff;
	transform: translateY(-2px);
	box-shadow: 0 8px 20px rgba(10, 124, 58, 0.12);
}

.fms-option.fms-option-selected {
	border-color: var(--fms-primary, #0a7c3a);
	background: rgba(10, 124, 58, 0.06);
}

.fms-back {
	background: none;
	border: none;
	color: #6b7c72;
	font-size: 14px;
	padding: 6px 0;
	cursor: pointer;
	font-family: inherit;
}

.fms-back:hover {
	color: var(--fms-primary);
}

.fms-back::before {
	content: "← ";
}

.fms-error {
	color: #c8362a;
	font-size: 14px;
	margin-top: 8px;
	min-height: 18px;
	font-style: normal;
	display: block;
}

.fms-trust {
	display: flex;
	gap: 18px;
	margin-top: 26px;
	font-size: 13px;
	color: #6b7c72;
	flex-wrap: wrap;
}

/* Loading */
.fms-step-loading {
	text-align: center;
	padding: 30px 0;
}

.fms-loader-spinner {
	width: 70px;
	height: 70px;
	border-radius: 50%;
	border: 5px solid #eaf1ec;
	border-top-color: var(--fms-primary, #0a7c3a);
	animation: fmsSpin 0.9s linear infinite;
	margin: 0 auto 22px;
}

@keyframes fmsSpin {
	to { transform: rotate(360deg); }
}

.fms-installer-list {
	margin: 22px auto 18px;
	min-height: 40px;
}

.fms-installer-current {
	display: inline-block;
	background: rgba(10, 124, 58, 0.08);
	color: var(--fms-primary);
	padding: 8px 16px;
	border-radius: 999px;
	font-size: 14px;
	font-weight: 500;
	animation: fmsPulse 0.5s ease;
}

@keyframes fmsPulse {
	from { opacity: 0; transform: scale(0.95); }
	to   { opacity: 1; transform: scale(1); }
}

.fms-loader-progress {
	max-width: 320px;
	margin: 0 auto;
	height: 6px;
	background: #f1f4f2;
	border-radius: 999px;
	overflow: hidden;
}

.fms-loader-progress-bar {
	height: 100%;
	width: 0%;
	background: linear-gradient(90deg, var(--fms-primary), var(--fms-accent, #ffc233));
	transition: width 0.3s linear;
}

/* Results */
.fms-results-top {
	text-align: center;
	margin-bottom: 28px;
}

.fms-results-badge {
	display: inline-block;
	background: rgba(10, 124, 58, 0.1);
	color: var(--fms-primary);
	padding: 6px 14px;
	border-radius: 999px;
	font-size: 13px;
	font-weight: 600;
	margin-bottom: 14px;
}

.fms-savings-box {
	background: linear-gradient(135deg, var(--fms-primary, #0a7c3a), var(--fms-primary-dark, #085c2b));
	color: #fff;
	border-radius: var(--fms-radius, 12px);
	padding: 26px 20px;
	margin: 24px 0 0;
	text-align: center;
	box-shadow: 0 12px 30px rgba(10, 124, 58, 0.25);
}

.fms-savings-amount {
	font-size: 42px;
	font-weight: 800;
	line-height: 1;
	letter-spacing: -0.5px;
}

.fms-savings-label {
	font-size: 14px;
	opacity: 0.9;
	margin-top: 6px;
	text-transform: uppercase;
	letter-spacing: 0.5px;
}

.fms-savings-annual {
	font-size: 15px;
	margin-top: 12px;
	padding-top: 12px;
	border-top: 1px solid rgba(255, 255, 255, 0.22);
}

.fms-cta {
	background: #f7faf7;
	border-radius: var(--fms-radius, 12px);
	padding: 22px;
	border-left: 4px solid var(--fms-accent, #ffc233);
}

.fms-cta h3 {
	margin: 0 0 8px;
	font-size: 19px;
	font-weight: 700;
}

.fms-cta p {
	margin: 0 0 16px;
	font-size: 15px;
	color: #4a5b50;
	line-height: 1.5;
}

/* Contact form */
.fms-form-grid {
	display: flex;
	flex-direction: column;
	gap: 10px;
	margin-bottom: 14px;
}

.fms-form-grid label {
	display: block;
	margin: 0;
	padding: 0;
}

.fms-form-grid label span {
	display: block;
	font-size: 14px;
	font-weight: 600;
	margin-bottom: 6px;
	color: var(--fms-text);
}

.fms-form-grid input {
	width: 100%;
	padding: 14px 16px;
	font-size: 16px;
	border: 2px solid #d8e3dc;
	border-radius: var(--fms-radius, 12px);
	background: #fff;
	color: var(--fms-text);
	font-family: inherit;
	transition: border-color 0.2s, box-shadow 0.2s;
}

.fms-form-grid input:focus {
	outline: none;
	border-color: var(--fms-primary);
	box-shadow: 0 0 0 4px rgba(10, 124, 58, 0.12);
}

.fms-gdpr {
	font-size: 12px;
	color: #768881;
	line-height: 1.5;
	margin: 14px 0 18px;
}

/* Thanks */
.fms-thanks {
	text-align: center;
	padding: 30px 0;
}

.fms-tick {
	width: 84px;
	height: 84px;
	border-radius: 50%;
	background: var(--fms-primary);
	color: #fff;
	font-size: 44px;
	display: flex;
	align-items: center;
	justify-content: center;
	margin: 0 auto 22px;
	animation: fmsPop 0.5s cubic-bezier(0.34, 1.56, 0.64, 1);
}

@keyframes fmsPop {
	from { transform: scale(0); }
	to   { transform: scale(1); }
}

@media (max-width: 540px) {
	.fms-body {
		padding: 24px 18px 30px;
	}
	.fms-h {
		font-size: 22px;
	}
	.fms-savings-amount {
		font-size: 36px;
	}
	.fms-field input,
	.fms-btn {
		padding: 14px 18px;
		font-size: 16px;
	}
}

/* Email capture skip link */
.fms-skip {
	background: none;
	border: none;
	color: #6b7c72;
	font-size: 14px;
	text-decoration: underline;
	cursor: pointer;
	padding: 4px 8px;
}
.fms-skip:hover {
	color: var(--fms-primary, #0a7c3a);
}

/* Turnstile widget container */
.fms-turnstile-wrap {
	margin: 18px 0 6px;
	display: flex;
	justify-content: center;
}
.fms-turnstile-wrap .cf-turnstile {
	display: inline-block;
}

/* Turnstile error message */
.fms-error[data-err="turnstile"] {
	text-align: center;
	margin-top: 6px;
}

/* ──────────────────────────────────────────────────────────────
   FULLSCREEN MODE
   Activated via [fund_my_solar fullscreen="yes"] shortcode.
   Covers the entire viewport as an overlay.
   ────────────────────────────────────────────────────────────── */

.fms-wrap.fms-fullscreen {
	position: fixed;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
	z-index: 99998;
	width: 100vw;
	height: 100vh;
	height: 100dvh;
	margin: 0;
	padding: 0;
	max-width: none;
	overflow-y: auto;
	-webkit-overflow-scrolling: touch;
	background: linear-gradient(160deg, #f4faf6 0%, #e6f1ea 45%, #d4e8da 100%);
	display: flex;
	flex-direction: column;
}

/* Sticky branded header */
.fms-fs-header {
	position: sticky;
	top: 0;
	z-index: 10;
	background: rgba(255, 255, 255, 0.85);
	-webkit-backdrop-filter: blur(8px);
	backdrop-filter: blur(8px);
	border-bottom: 1px solid rgba(10, 124, 58, 0.10);
	padding: 14px 20px;
	display: grid;
	grid-template-columns: 1fr auto 1fr;
	align-items: center;
	gap: 16px;
	flex-shrink: 0;
}
.fms-fs-back {
	justify-self: start;
	display: inline-flex;
	align-items: center;
	gap: 6px;
	background: #fff;
	border: 1.5px solid #e0e8e3;
	border-radius: 999px;
	padding: 8px 16px 8px 12px;
	font-family: inherit;
	font-size: 13px;
	font-weight: 600;
	color: var(--fms-text, #1a1a1a);
	cursor: pointer;
	transition: border-color 0.15s ease, color 0.15s ease;
}
.fms-fs-back:hover {
	border-color: var(--fms-primary, #0a7c3a);
	color: var(--fms-primary, #0a7c3a);
}
.fms-fs-brand {
	justify-self: center;
	font-weight: 700;
	color: var(--fms-primary, #0a7c3a);
	font-size: 18px;
	letter-spacing: -0.3px;
}
.fms-fs-brand img {
	max-height: 38px;
	width: auto;
	vertical-align: middle;
}
.fms-fs-spacer {
	justify-self: end;
	width: 80px;
}

/* In fullscreen, the shell loses its card chrome and becomes
   a centred content holder. */
.fms-wrap.fms-fullscreen .fms-shell {
	background: transparent;
	border: none;
	box-shadow: none;
	border-radius: 0;
	width: 100%;
	max-width: 720px;
	margin: 0 auto;
	height: auto;
	min-height: 0;
	display: block;
	overflow: visible;
}

/* Header inside the shell only shows the progress bar in fullscreen */
.fms-wrap.fms-fullscreen .fms-header {
	padding: 22px 28px 0;
}

/* Body no longer scrolls internally - the whole overlay scrolls */
.fms-wrap.fms-fullscreen .fms-body {
	flex: none;
	overflow: visible;
	padding: 30px 28px 60px;
}

/* Slightly more breathing room on results / contact in fullscreen */
.fms-wrap.fms-fullscreen .fms-savings-box {
	margin: 24px 0;
}

/* Hide the in-step Back buttons in fullscreen mode since the header
   has one. Keep them visible for the inline mode. */
.fms-wrap.fms-fullscreen .fms-back {
	display: none;
}

/* Mobile tuning for fullscreen */
@media (max-width: 640px) {
	.fms-fs-header {
		padding: 10px 14px;
	}
	.fms-fs-back {
		padding: 6px 12px 6px 10px;
		font-size: 12px;
	}
	.fms-fs-back span {
		display: none;
	}
	.fms-fs-brand {
		font-size: 16px;
	}
	.fms-fs-brand img {
		max-height: 30px;
	}
	.fms-fs-spacer {
		width: 36px;
	}
	.fms-wrap.fms-fullscreen .fms-header {
		padding: 16px 18px 0;
	}
	.fms-wrap.fms-fullscreen .fms-body {
		padding: 22px 18px 40px;
	}
}

/* ──────────────────────────────────────────────────────────────
   PRIVACY CHECKBOX
   ────────────────────────────────────────────────────────────── */
.fms-privacy {
	display: flex;
	align-items: flex-start;
	gap: 10px;
	padding: 14px 0 6px;
	font-size: 14px;
	line-height: 1.5;
	color: var(--fms-text, #1a1a1a);
	cursor: pointer;
}
.fms-privacy input[type="checkbox"] {
	margin: 3px 0 0;
	width: 18px;
	height: 18px;
	accent-color: var(--fms-primary, #0a7c3a);
	flex-shrink: 0;
	cursor: pointer;
}
.fms-privacy a {
	color: var(--fms-primary, #0a7c3a);
	text-decoration: underline;
	text-underline-offset: 3px;
}
.fms-privacy a:hover {
	text-decoration: none;
}

/* ──────────────────────────────────────────────────────────────
   START AGAIN LINK
   Sits at the bottom of the form, hidden on step 1.
   ────────────────────────────────────────────────────────────── */
.fms-start-again-wrap {
	display: none; /* JS toggles on for non-postcode steps */
	padding: 8px 28px 22px;
	text-align: center;
}
.fms-start-again {
	background: none;
	border: none;
	color: #6b7c72;
	font-size: 13px;
	cursor: pointer;
	padding: 6px 12px;
	text-decoration: underline;
	text-underline-offset: 3px;
	font-family: inherit;
}
.fms-start-again:hover {
	color: var(--fms-primary, #0a7c3a);
	text-decoration: none;
}

/* ──────────────────────────────────────────────────────────────
   FIXED FOOTER
   White bar pinned to the bottom of the viewport on every step.
   ────────────────────────────────────────────────────────────── */
.fms-fixed-footer {
	position: fixed;
	bottom: 0;
	left: 0;
	right: 0;
	width: 100%;
	background: #ffffff;
	border-top: 1px solid #e8eee9;
	box-shadow: 0 -2px 12px rgba(0, 0, 0, 0.04);
	z-index: 99998;
	padding: 14px 20px 16px;
}
.fms-fixed-footer-inner {
	max-width: 1100px;
	margin: 0 auto;
	display: flex;
	flex-direction: column;
	gap: 6px;
	align-items: center;
	text-align: center;
}
.fms-fixed-footer-text {
	margin: 0;
	font-size: 12.5px;
	line-height: 1.5;
	color: #4a5650;
	max-width: 900px;
}
.fms-fixed-footer-links {
	margin: 0;
	font-size: 12.5px;
}
.fms-fixed-footer-links a {
	color: var(--fms-primary, #0a7c3a);
	text-decoration: underline;
	text-underline-offset: 3px;
}
.fms-fixed-footer-links a:hover {
	text-decoration: none;
}

/* When the fixed footer is present, push the form bottom up so the
   last content isn't hidden behind it. The footer height varies with
   the text length, so we use generous padding. */
.fms-wrap.fms-has-footer {
	padding-bottom: 140px;
}
.fms-wrap.fms-fullscreen.fms-has-footer {
	padding-bottom: 160px;
}

/* On mobile the charity text wraps to multiple lines so we need more
   clearance. */
@media (max-width: 640px) {
	.fms-fixed-footer {
		padding: 12px 16px 14px;
	}
	.fms-fixed-footer-text {
		font-size: 11.5px;
	}
	.fms-fixed-footer-links {
		font-size: 11.5px;
	}
	.fms-wrap.fms-has-footer {
		padding-bottom: 200px;
	}
	.fms-wrap.fms-fullscreen.fms-has-footer {
		padding-bottom: 220px;
	}
}

/* Logo link styling */
.fms-logo-link {
	display: inline-block;
	text-decoration: none;
	color: inherit;
}
.fms-logo-link:hover {
	opacity: 0.85;
}

/* Hide the old trust strip if any stale markup ships - belt and braces */
.fms-trust { display: none !important; }

/* Tighten contact form: hide empty error reservation, smaller error margin */
.fms-form-grid .fms-error {
	margin-top: 4px;
	min-height: 0;
}
.fms-form-grid .fms-error:empty {
	display: none;
}
