/* Shared layout */
.cf-shell { display: flex; flex-direction: column; min-height: 100vh; }
.cf-container { width: 100%; max-width: var(--cf-max, 720px); margin: 0 auto; padding: 0 20px; box-sizing: border-box; }
.cf-header { padding: 36px 0 18px; }
.cf-header-logo { display: block; margin: 0 auto 14px; max-width: 140px; height: auto; }
.cf-header-title { margin: 0 0 8px; font-size: 28px; font-weight: 700; text-align: center; line-height: 1.25; }
.cf-header-subtitle { margin: 0; font-size: 16px; text-align: center; opacity: 0.85; line-height: 1.55; }
.cf-embed-wrap { flex: 1; padding: 18px 0 36px; }
.cf-embed-wrap iframe { width: 100%; border: 0; display: block; min-height: 600px; }
.cf-footer { padding: 22px 0 30px; font-size: 13px; opacity: 0.85; }
.cf-footer-logo { display: block; margin: 0 auto 8px; max-width: 80px; height: auto; opacity: 0.85; }
.cf-footer-text { text-align: center; margin: 0; line-height: 1.55; }

.cf-preview-banner {
	position: sticky; top: 0; z-index: 9999;
	background: #ffd54a; color: #5a3e00; text-align: center;
	padding: 6px 12px; font-size: 12px; font-weight: 600;
	border-bottom: 1px solid #d6a724;
}

/* Iframe embed mode — transparent bg, tight padding, fits in any parent container */
.cf-is-iframe { background: transparent !important; }
/* In iframe mode the form should be its natural height — no forced 100vh,
   otherwise the body/embed-wrap fill a full viewport and overflow (scrollbar). */
.cf-is-iframe.cf-campaign-page { min-height: 0; }
.cf-is-iframe .cf-shell { min-height: 0; }
.cf-is-iframe .cf-embed-wrap { min-height: 0; }
.cf-is-iframe .cf-header { padding: 18px 0 8px; }
.cf-is-iframe .cf-embed-wrap { padding: 8px 0 18px; }
.cf-is-iframe .cf-embed-wrap > .cf-container,
.cf-is-iframe .cf-header,
.cf-is-iframe .cf-footer { background: transparent !important; box-shadow: none !important; }
.cf-is-iframe .cf-container { max-width: 100% !important; padding: 0 14px; }
/* WP admin bar shouldn't show inside iframe */
.cf-is-iframe #wpadminbar { display: none !important; }
html:has(body.cf-is-iframe), body.cf-is-iframe { margin-top: 0 !important; }

/* Theme: minimal */
.cf-theme-minimal { background: #ffffff; color: #111827; }
.cf-theme-minimal .cf-header-title { color: #0f172a; }
.cf-theme-minimal .cf-header-subtitle { color: #475569; }
.cf-theme-minimal .cf-footer { border-top: 1px solid #eef2f7; color: #64748b; }

/* Theme: bold */
.cf-theme-bold { background: var(--cf-accent); color: #fff; }
.cf-theme-bold .cf-header-title { color: #fff; font-size: 34px; letter-spacing: -0.5px; }
.cf-theme-bold .cf-header-subtitle { color: rgba(255,255,255,0.85); }
.cf-theme-bold .cf-embed-wrap > .cf-container {
	background: #fff; color: #111827; border-radius: 18px; padding: 28px 24px;
	box-shadow: 0 24px 60px rgba(0,0,0,0.18);
}
.cf-theme-bold .cf-footer { color: rgba(255,255,255,0.8); }

/* Theme: dark */
.cf-theme-dark { background: #0b0d11; color: #e5e7eb; }
.cf-theme-dark .cf-header-title { color: #f8fafc; }
.cf-theme-dark .cf-header-subtitle { color: #94a3b8; }
.cf-theme-dark .cf-embed-wrap > .cf-container {
	background: #161a22; border: 1px solid #232936; border-radius: 16px; padding: 26px 22px;
}
.cf-theme-dark .cf-footer { color: #64748b; border-top: 1px solid #1c212b; }

/* Theme: soft */
.cf-theme-soft { background: linear-gradient(180deg, #fefdfb 0%, #f3f0ea 100%); color: #2a2218; }
.cf-theme-soft .cf-header-title { color: #1c1810; font-weight: 700; }
.cf-theme-soft .cf-header-subtitle { color: #6b5f4e; }
.cf-theme-soft .cf-embed-wrap > .cf-container {
	background: #fff; border-radius: 14px; padding: 26px 22px;
	box-shadow: 0 8px 30px rgba(80, 60, 30, 0.08);
}
.cf-theme-soft .cf-footer { color: #6b5f4e; }

/* Theme: gradient */
.cf-theme-gradient {
	background: linear-gradient(135deg, var(--cf-accent) 0%, #ec4899 50%, #8b5cf6 100%);
	color: #fff;
}
.cf-theme-gradient .cf-header-title { color: #fff; font-size: 36px; font-weight: 800; letter-spacing: -0.5px; }
.cf-theme-gradient .cf-header-subtitle { color: rgba(255,255,255,0.92); }
.cf-theme-gradient .cf-embed-wrap > .cf-container {
	background: rgba(255,255,255,0.96); color: #111827; backdrop-filter: blur(8px);
	border-radius: 22px; padding: 30px 24px;
	box-shadow: 0 30px 80px rgba(0,0,0,0.2);
}
.cf-theme-gradient .cf-footer { color: rgba(255,255,255,0.85); }

/* Theme: brand (clean white + accent borders) */
.cf-theme-brand { background: #ffffff; color: #111827; }
.cf-theme-brand .cf-header { border-bottom: 4px solid var(--cf-accent); }
.cf-theme-brand .cf-header-title { color: #0f172a; }
.cf-theme-brand .cf-header-subtitle { color: var(--cf-accent); font-weight: 600; }
.cf-theme-brand .cf-footer { border-top: 1px solid #eef2f7; color: #64748b; }

@media (max-width: 600px) {
	.cf-header-title { font-size: 24px !important; }
	.cf-header { padding: 24px 0 12px; }
	.cf-embed-wrap > .cf-container { padding: 18px 14px !important; border-radius: 12px; }
}