/* Codeable Forms - theme presets.
 * These wrap the form in a coloured card to match the reference designs.
 * Colour values are driven by the per-form CSS variables set inline, so the
 * Custom theme reuses the same structure with the admin-chosen palette.
 */

/* ---- Blue + Yellow (SwitchHealth-inspired, default) ---- */
.cf-theme-blue-yellow.cf-form-wrap{
	background:var(--cf-card-bg,#1f3be0);
	color:#fff;padding:30px 28px;border-radius:18px;
	box-shadow:0 18px 40px rgba(16,32,120,.25);
}
.cf-theme-blue-yellow .cf-step-heading{color:#fff;}
.cf-theme-blue-yellow .cf-step-desc,
.cf-theme-blue-yellow .cf-label{color:#fff;}
.cf-theme-blue-yellow .cf-step-heading{position:relative;display:inline-block;}
.cf-theme-blue-yellow .cf-step-heading::after{content:"";display:block;height:4px;width:70px;background:var(--cf-accent,#ffe000);border-radius:99px;margin-top:8px;}
.cf-theme-blue-yellow .cf-input{color:#0b1b46;}
.cf-theme-blue-yellow .cf-req{color:var(--cf-accent,#ffe000);}
.cf-theme-blue-yellow .cf-choice-label{color:#000;}
.cf-theme-blue-yellow .cf-choice-button .cf-choice{color:#0b1b46;}
.cf-theme-blue-yellow .cf-btn-back{color:#fff;border-color:rgba(255,255,255,.5);}
.cf-theme-blue-yellow .cf-progress-dot{background:rgba(255,255,255,.3);}
.cf-theme-blue-yellow .cf-progress-dot.is-active{background:var(--cf-accent,#ffe000);}

/* ---- Green (WhichHealthInsurer-inspired) ---- */
.cf-theme-green.cf-form-wrap{
	background:var(--cf-card-bg,#0d3b32);
	color:#fff;padding:30px 28px;border-radius:14px;
	box-shadow:0 18px 40px rgba(6,40,30,.28);
}
.cf-theme-green .cf-step-heading,
.cf-theme-green .cf-step-desc,
.cf-theme-green .cf-label,
.cf-theme-green .cf-choice-label{color:#fff;text-align:left;}
.cf-theme-green .cf-input{color:#0d2b1c;}
.cf-theme-green .cf-progress-dot.is-active{background:var(--cf-primary,#1aa64b);}
/* White pill radios like the reference "YES / NO" buttons */
.cf-theme-green .cf-choice-button .cf-choice{
	background:#fff;color:#0d2b1c;font-weight:700;justify-content:center;text-transform:uppercase;
	border-color:#fff;
}
.cf-theme-green .cf-choice-button .cf-choice:has(.cf-choice-input:checked){
	box-shadow:0 0 0 3px var(--cf-primary,#1aa64b) inset;background:#f0fff6;
}

/* ---- Neutral light ---- */
.cf-theme-neutral.cf-form-wrap{
	background:#fff;padding:26px 24px;border:1px solid #e5e7eb;border-radius:12px;
	box-shadow:0 6px 24px rgba(0,0,0,.06);
}

/* Custom theme uses the same card treatment as blue-yellow but with chosen colours */
.cf-theme-custom.cf-form-wrap{
	background:var(--cf-card-bg,#fff);color:var(--cf-card-text,#0b1b46);
	padding:28px 26px;border-radius:14px;box-shadow:0 12px 34px rgba(0,0,0,.12);
}
.cf-theme-custom .cf-step-heading,
.cf-theme-custom .cf-label,
.cf-theme-custom .cf-choice-label{color:var(--cf-card-text,#0b1b46);}
.cf-theme-custom .cf-input{color:#0b1b46;}