/* ============================================================================
 * Campliment admin shell — cmp-admin.css
 *
 * Visual system ported from the real prototype's admin Shell component
 * (prototypes/runnerscamp-2026-05/js/admin-app.js:318-506) — that prototype
 * renders every value as an inline JSX style object, not a CSS file, so this
 * is a direct re-derivation onto real classes + CSS custom properties, not a
 * copy-paste. Values (navy #0F1E2C, accent #E85D2F, 232px sidebar, 8px card
 * radius, etc.) are cited from that file's line numbers inline below.
 *
 * Mechanics (WP-chrome suppression, .ss-shell root, view-pane show/hide) are
 * modeled on Insightment's AdminV2 shell (insightment/src/AdminV2/Shell.php)
 * — the one other bolt-on SimpleSuite module with its own standalone admin
 * page, per Glenn's direction to build Campliment the same way rather than
 * live only inside a Hub tab.
 *
 * @since 0.1.0
 */

.cmp-app {
	--cmp-navy: #0F1E2C;          /* admin-app.js:330 */
	--cmp-navy-light: #1F3346;    /* admin-app.js:12 (admin.css scrollbar) */
	--cmp-accent: #E85D2F;        /* admin-app.js:344, 426 */
	--cmp-accent-dark: #D14620;
	--cmp-text-dark: #111827;
	--cmp-text-muted: #6B7280;    /* admin-app.js:358-364 */
	--cmp-border: #E5E7EB;        /* admin-app.js:472 */
	--cmp-sidebar-text: #E5E7EB;
	--cmp-sidebar-text-dim: #D1D5DB;
	--cmp-font-sans: 'Plus Jakarta Sans', -apple-system, BlinkMacSystemFont, sans-serif;
	--cmp-font-mono: 'JetBrains Mono', ui-monospace, monospace;
	--cmp-radius-card: 8px;
	--cmp-radius-btn: 6px;
	--cmp-radius-pill: 999px;

	/* CMP-0006: badge semantic colors — pulled out of inline style=
	   attributes in class-cmp-module.php (camp status badge, Stripe
	   Configured/Not-configured badges) so they're token-sourced like
	   everything else in this file. Same hex values as before, just named. */
	--cmp-badge-neutral-bg: #F3F4F6;
	--cmp-badge-neutral-text: #374151;
	--cmp-badge-success-bg: #DCFCE7;
	--cmp-badge-success-text: #046b04;
	--cmp-badge-danger-bg: #FEE2E2;
	--cmp-badge-danger-text: #a00;

	display: grid;
	grid-template-columns: 232px 1fr;   /* admin-app.js:322 */
	min-height: 100vh;
	font-family: var(--cmp-font-sans);
	color: var(--cmp-text-dark);
	background: #F4F5F7;
}

/* ── Sidebar ─────────────────────────────────────────────────────────── */

.cmp-sidebar {
	background: var(--cmp-navy);
	color: var(--cmp-sidebar-text);
	position: sticky;
	top: 0;
	height: 100vh;
	overflow-y: auto;
	display: flex;
	flex-direction: column;
}

.cmp-sidebar-logo {
	display: flex;
	align-items: center;
	gap: 10px;
	padding: 20px 18px;
	border-bottom: 1px solid rgba(255, 255, 255, 0.08);
}

.cmp-sidebar-logo-mark {
	width: 32px;
	height: 32px;
	border-radius: var(--cmp-radius-card);
	background: linear-gradient(135deg, var(--cmp-accent), var(--cmp-accent-dark));
	display: flex;
	align-items: center;
	justify-content: center;
	color: #fff;
	font-weight: 700;
	font-size: 13px;
	flex-shrink: 0;
}

.cmp-sidebar-logo-text b {
	display: block;
	font-size: 14px;
	font-weight: 700;
	color: #fff;
}

.cmp-sidebar-logo-text span {
	display: block;
	font-size: 11px;
	color: var(--cmp-text-muted);
}

.cmp-sidebar-nav {
	flex: 1;
	padding: 16px 10px;
	overflow-y: auto;
}

.cmp-sidebar-section {
	font-size: 10px;
	font-weight: 700;
	letter-spacing: 1.5px;
	text-transform: uppercase;
	color: var(--cmp-text-muted);
	padding: 12px 10px 6px;
}

.cmp-nav-item {
	display: flex;
	align-items: center;
	gap: 10px;
	width: 100%;
	text-align: left;
	background: none;
	border: 0;
	border-left: 3px solid transparent;
	border-radius: var(--cmp-radius-btn);
	padding: 9px 10px;
	margin-bottom: 2px;
	font-family: inherit;
	font-size: 13px;
	font-weight: 500;
	color: var(--cmp-sidebar-text-dim);
	cursor: pointer;
}

.cmp-nav-item:hover {
	background: rgba(255, 255, 255, 0.04);
}

/* The runtime toggles the literal class "active" on [data-ss-view] nav
   elements — see ss-hub/assets/js/ss-admin-runtime.js:397-399. */
.cmp-nav-item.active {
	background: rgba(232, 93, 47, 0.12);
	border-left-color: var(--cmp-accent);
	color: #fff;
	font-weight: 600;
}

.cmp-nav-item svg {
	width: 16px;
	height: 16px;
	flex-shrink: 0;
}

.cmp-sidebar-footer {
	padding: 12px 18px;
	font-size: 11px;
	color: var(--cmp-text-muted);
	border-top: 1px solid rgba(255, 255, 255, 0.08);
}

/* ── Main / topbar ───────────────────────────────────────────────────── */

.cmp-main {
	display: flex;
	flex-direction: column;
	min-width: 0;
}

.cmp-topbar {
	background: #fff;
	border-bottom: 1px solid var(--cmp-border);
	position: sticky;
	top: 32px; /* clears the WP admin bar, which we keep (unlike AdminV2 — see class-cmp-shell.php) */
	z-index: 10;
	padding: 14px 32px;
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 16px;
}

.cmp-breadcrumb {
	font-size: 12px;
	color: var(--cmp-text-muted);
	margin: 0 0 2px;
}

.cmp-topbar h1 {
	font-size: 20px;
	font-weight: 700;
	margin: 0;
	color: var(--cmp-text-dark);
}

.cmp-content {
	flex: 1;
	padding: 28px 32px;
	overflow-y: auto;
}

/* ── View panes — required by ss-admin-runtime's zero-network router.
   [data-ss-viewpane] elements get .active toggled by SSAdmin.showView(); we
   just supply the show/hide CSS. ss-hub/assets/js/ss-admin-runtime.js:391-402 */

.cmp-view {
	display: none;
}

.cmp-view.active {
	display: block;
}

/* ── Shared content primitives (admin-app.js Card/StatCard/Badge, lines
   471-506) — reused as-is for now; components get their own pass later. */

.cmp-card {
	background: #fff;
	border: 1px solid var(--cmp-border);
	border-radius: var(--cmp-radius-card);
	padding: 20px;
	margin-bottom: 20px;
}

.cmp-card h2 {
	font-size: 16px;
	font-weight: 700;
	margin: 0 0 14px;
}

.cmp-card h3 {
	font-size: 14px;
	font-weight: 700;
	margin: 20px 0 12px;
}

.cmp-table {
	width: 100%;
	border-collapse: collapse;
	font-size: 13px;
}

.cmp-table th,
.cmp-table td {
	text-align: left;
	padding: 10px 12px;
	border-bottom: 1px solid var(--cmp-border);
}

.cmp-table th {
	font-size: 11px;
	font-weight: 600;
	text-transform: uppercase;
	color: var(--cmp-text-muted);
	letter-spacing: 0.5px;
}

.cmp-badge {
	display: inline-flex;
	align-items: center;
	border-radius: var(--cmp-radius-pill);
	padding: 3px 10px;
	font-size: 11px;
	font-weight: 600;
}

/* CMP-0006: neutral/success/danger badge variants — replaces the inline
   style= hex that class-cmp-module.php used to bake into its echo strings
   (camp status badge, Stripe Configured/Not-configured badges). */
.cmp-badge-neutral {
	background: var(--cmp-badge-neutral-bg);
	color: var(--cmp-badge-neutral-text);
}

.cmp-badge-success {
	background: var(--cmp-badge-success-bg);
	color: var(--cmp-badge-success-text);
}

.cmp-badge-danger {
	background: var(--cmp-badge-danger-bg);
	color: var(--cmp-badge-danger-text);
}

.cmp-form-row {
	margin-bottom: 14px;
}

.cmp-form-row label {
	display: block;
	font-size: 13px;
	font-weight: 600;
	margin-bottom: 4px;
}

.cmp-form-row input[type="text"],
.cmp-form-row input[type="number"],
.cmp-form-row input[type="password"],
.cmp-form-row input[type="email"],
.cmp-form-row input[type="tel"],
.cmp-form-row textarea,
.cmp-form-row select {
	width: 100%;
	max-width: 420px;
	padding: 8px 10px;
	border: 1px solid var(--cmp-border);
	border-radius: var(--cmp-radius-btn);
	font-family: inherit;
	font-size: 13px;
}

/* CMP-0012: grouped optional section + inline field note on the volunteer form */
.cmp-form-group {
	margin: 0 0 14px;
	padding: 12px 14px;
	border: 1px solid var(--cmp-border);
}

.cmp-form-group legend {
	padding: 0 6px;
	font-size: 13px;
	font-weight: 600;
}

.cmp-field-note {
	margin: 6px 0 0;
	font-size: 12px;
	color: var(--cmp-muted, #6B7280);
}

/* Public volunteer/contact forms (0.4.0, Build Cycle 3) */
.cmp-public-form {
	max-width: 480px;
}

.cmp-form-status {
	min-height: 1.4em;
	margin-bottom: 10px;
	font-size: 13px;
}

.cmp-form-status-ok {
	color: #046b04;
}

.cmp-form-status-error {
	color: #a00;
}

.cmp-btn {
	display: inline-flex;
	align-items: center;
	gap: 6px;
	background: var(--cmp-accent);
	color: #fff;
	border: 0;
	border-radius: var(--cmp-radius-btn);
	padding: 9px 16px;
	font-family: inherit;
	font-size: 13px;
	font-weight: 600;
	cursor: pointer;
}

.cmp-btn:hover {
	background: var(--cmp-accent-dark);
}

/* ============================================================================
 * Build Cycle 4c (2026-09-25) real gap fix, flagged in CLAUDE.md: every
 * design token above (--cmp-accent, --cmp-border, --cmp-radius-btn, etc.) was
 * only ever DEFINED scoped to `.cmp-app` (the admin shell root, :20 above).
 * The public volunteer/contact forms (Build Cycle 3) already use `.cmp-btn`/
 * `.cmp-muted`/`.cmp-form-row` classes that reference those same variables,
 * but render on the public site with no `.cmp-app` ancestor — every var()
 * there was silently resolving to nothing (falling back to the browser
 * default, e.g. a black text-only button instead of the real accent-orange
 * one) on any public page. Never caught before because Cycle 3's own
 * verification only checked the REST contract, not the actual rendered
 * button color. Fixed by re-declaring the same values on :root (a plain
 * duplication, not a rename/removal — `.cmp-app`'s own block is untouched
 * so nothing about the standalone admin shell changes) so any public-facing
 * Campliment form gets its real accent/spacing tokens with zero ancestor
 * requirement, the same guarantee `.cmp-app` already gave the admin shell.
 */
:root {
	--cmp-navy: #0F1E2C;
	--cmp-navy-light: #1F3346;
	--cmp-accent: #E85D2F;
	--cmp-accent-dark: #D14620;
	--cmp-accent-bg: #FFF7ED;     /* prototypes/runnerscamp-2026-05/css/shared.css --rc-accent-bg (existing RCI cream) */
	--cmp-text-dark: #111827;
	--cmp-text-muted: #6B7280;
	--cmp-border: #E5E7EB;
	--cmp-radius-card: 8px;
	--cmp-radius-btn: 6px;
	--cmp-radius-pill: 999px;
	--cmp-badge-success-bg: #DCFCE7;
	--cmp-badge-success-text: #046b04;
	--cmp-badge-danger-bg: #FEE2E2;
	--cmp-badge-danger-text: #a00;
}

.cmp-btn-secondary {
	background: #fff;
	color: var(--cmp-accent);
	border: 1px solid var(--cmp-accent);
}

.cmp-btn-secondary:hover {
	background: #FFF3EE;
}

/* ============================================================================
 * Real multi-step camper registration flow (Build Cycle 4c, 2026-09-25).
 * Mobile-forward per Glenn's explicit ask ("mobile forward, simple and clean
 * interface") — single column, one step visible at a time, large tap
 * targets (44px+ min height on every option/button, per WCAG 2.5.5), and the
 * whole thing fits a 375px viewport with no horizontal scroll. Widens to a
 * centered card above 560px rather than ever going multi-column — a parent
 * filling this out on a phone in a camp parking lot is the primary case,
 * not a secondary one.
 */
.cmp-registration-app {
	--reg-line: #DDD8C8;
	--reg-fg: #1A2233;
	--reg-muted: #5C6478;
	--reg-accent: #E85D2F;
	--reg-navy: #0F1E2C;
	--reg-focus: #2F6FB0;
	--reg-danger: #B0432A;
	--reg-danger-bg: #FBE9E4;
	--reg-success: #1D7A4C;
	--reg-success-bg: #E4F3EA;
	max-width: 100%;
	box-sizing: border-box;
	padding: 56px 16px 88px;
	font-family: 'Inter', -apple-system, BlinkMacSystemFont, sans-serif;
	color: var(--reg-fg);
	-webkit-font-smoothing: antialiased;
}

.cmp-registration-app *,
.cmp-registration-app *::before,
.cmp-registration-app *::after {
	box-sizing: border-box;
}

.cmp-reg-wrap {
	max-width: 640px;
	margin: 0 auto;
}

/* Progress: step label + bar, same pattern as the approved prototype */
.cmp-reg-progress-label {
	display: flex;
	justify-content: space-between;
	font-size: 11px;
	font-weight: 600;
	text-transform: uppercase;
	letter-spacing: 0.5px;
	color: var(--reg-muted);
	margin-bottom: 8px;
}

.cmp-reg-num {
	font-family: 'JetBrains Mono', ui-monospace, monospace;
	font-variant-numeric: tabular-nums;
}

.cmp-reg-progress-bar {
	height: 4px;
	background: var(--reg-line);
	border-radius: 999px;
	overflow: hidden;
	margin-bottom: 18px;
}

.cmp-reg-progress-fill {
	height: 100%;
	background: var(--reg-accent);
	transition: width 0.25s ease;
}

.cmp-reg-error {
	margin: 0 0 14px;
	padding: 12px 14px;
	border-radius: 10px;
	background: var(--reg-danger-bg);
	color: var(--reg-danger);
	font-size: 13.5px;
	line-height: 1.5;
}

.cmp-reg-error[hidden] {
	display: none;
}

.cmp-reg-card {
	background: #fff;
	border: 1px solid var(--reg-line);
	border-radius: 14px;
	padding: 24px 20px;
}

.cmp-reg-card h2 {
	margin: 0 0 8px;
	font-family: 'Fraunces', Georgia, serif;
	font-size: 24px;
	font-weight: 600;
	line-height: 1.2;
	color: var(--reg-fg);
}

.cmp-reg-sub {
	margin: 0 0 22px;
	font-size: 13.5px;
	line-height: 1.5;
	color: var(--reg-muted);
}

.cmp-reg-options {
	display: flex;
	flex-direction: column;
	gap: 10px;
	margin-bottom: 12px;
}

.cmp-reg-option {
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	gap: 3px;
	width: 100%;
	min-height: 56px;
	text-align: left;
	background: #fff;
	border: 1.5px solid var(--reg-line);
	border-radius: 12px;
	padding: 14px 16px;
	font-family: inherit;
	font-size: 14.5px;
	color: var(--reg-fg);
	cursor: pointer;
}

.cmp-reg-option:hover,
.cmp-reg-option:focus-visible {
	border-color: var(--reg-accent);
	background: #FFF8F4;
}

.cmp-reg-option-disabled,
.cmp-reg-option:disabled {
	opacity: 0.5;
	cursor: not-allowed;
}

.cmp-reg-option span {
	color: var(--reg-muted);
	font-size: 12.5px;
}

.cmp-reg-two {
	display: grid;
	grid-template-columns: 1fr;
	gap: 0 14px;
}

/* Form fields, matching the prototype's field style (the theme's own input styles are overridden on purpose) */
.cmp-registration-app .cmp-form-row {
	margin: 0 0 18px;
}

.cmp-registration-app .cmp-form-row label,
.cmp-registration-app .cmp-reg-label {
	display: block;
	margin: 0 0 6px;
	font-size: 12.5px;
	font-weight: 600;
	line-height: 1.4;
	color: var(--reg-fg);
}

.cmp-registration-app .cmp-form-row input[type="text"],
.cmp-registration-app .cmp-form-row input[type="date"],
.cmp-registration-app .cmp-form-row select,
.cmp-registration-app .cmp-form-row textarea {
	display: block;
	width: 100%;
	max-width: none;
	min-height: 46px;
	padding: 11px 12px;
	border: 1px solid var(--reg-line);
	border-radius: 8px;
	background: #fff;
	color: var(--reg-fg);
	font-family: inherit;
	font-size: 15px;
	line-height: 1.4;
	box-shadow: none;
}

.cmp-registration-app .cmp-form-row textarea {
	min-height: 96px;
	resize: vertical;
}

.cmp-registration-app .cmp-form-row input:focus,
.cmp-registration-app .cmp-form-row select:focus,
.cmp-registration-app .cmp-form-row textarea:focus {
	outline: 2px solid var(--reg-focus);
	outline-offset: 1px;
}

/* Yes / No as chips */
.cmp-reg-chip-row {
	display: flex;
	flex-wrap: wrap;
	gap: 10px;
}

.cmp-registration-app .cmp-reg-chip {
	position: relative;
	display: inline-flex;
	align-items: center;
	min-height: 44px;
	margin: 0;
	padding: 9px 20px;
	border: 1px solid var(--reg-line);
	border-radius: 999px;
	background: #fff;
	font-size: 14px;
	font-weight: 500;
	cursor: pointer;
	user-select: none;
}

.cmp-reg-chip input {
	position: absolute;
	opacity: 0;
	pointer-events: none;
}

.cmp-reg-chip:has(input:checked) {
	border-color: var(--reg-accent);
	background: #FDEEE8;
	font-weight: 700;
}

.cmp-reg-chip:has(input:focus-visible) {
	outline: 2px solid var(--reg-focus);
	outline-offset: 2px;
}

.cmp-registration-app .cmp-btn {
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 8px;
	width: 100%;
	min-height: 50px;
	margin: 22px 0 10px;
	padding: 13px 20px;
	border: 0;
	border-radius: 8px;
	background: var(--reg-accent);
	color: #fff;
	font-family: inherit;
	font-size: 15px;
	font-weight: 700;
	cursor: pointer;
}

.cmp-registration-app .cmp-btn:hover {
	background: #D14620;
}

.cmp-registration-app .cmp-btn:disabled {
	opacity: 0.5;
	cursor: not-allowed;
}

.cmp-registration-app .cmp-btn.cmp-btn-secondary {
	background: transparent;
	color: var(--reg-fg);
	border: 1px solid var(--reg-line);
}

.cmp-registration-app .cmp-btn.cmp-btn-secondary:hover {
	background: #F6F3EC;
}

.cmp-reg-link {
	display: block;
	width: 100%;
	text-align: center;
	background: none;
	border: 0;
	color: var(--reg-muted);
	font-family: inherit;
	font-size: 13px;
	text-decoration: underline;
	padding: 10px 0;
	cursor: pointer;
}

.cmp-registration-app .cmp-table {
	width: 100%;
	border-collapse: collapse;
	margin: 6px 0 12px;
	font-size: 14px;
}

.cmp-registration-app .cmp-table th,
.cmp-registration-app .cmp-table td {
	padding: 10px 6px;
	border-bottom: 1px solid var(--reg-line);
	text-align: left;
}

.cmp-reg-total {
	margin: 14px 0;
	padding-top: 14px;
	border-top: 1.5px solid var(--reg-fg);
	font-size: 18px;
	font-weight: 700;
	text-align: right;
}

.cmp-reg-pay {
	margin: 4px 0 8px;
	min-height: 120px;
}

.cmp-reg-pay .sspay-error {
	margin: 12px 0 0;
	padding: 12px 14px;
	border-radius: 10px;
	background: var(--reg-danger-bg);
	color: var(--reg-danger);
	font-size: 13.5px;
	line-height: 1.5;
}

.cmp-reg-pay .sspay-error[hidden] {
	display: none;
}

.cmp-reg-pay .sspay-submit {
	display: flex;
	align-items: center;
	justify-content: center;
	width: 100%;
	min-height: 50px;
	margin: 20px 0 6px;
	border: 0;
	border-radius: 8px;
	background: var(--reg-accent);
	color: #fff;
	font-family: inherit;
	font-size: 15px;
	font-weight: 700;
	cursor: pointer;
}

.cmp-reg-pay .sspay-submit:hover {
	background: #D14620;
}

.cmp-reg-pay .sspay-submit:disabled {
	opacity: 0.5;
	cursor: not-allowed;
}

.cmp-reg-done-icon {
	width: 56px;
	height: 56px;
	margin: 4px auto 16px;
	border-radius: 50%;
	background: var(--reg-success-bg);
	color: var(--reg-success);
	font-size: 28px;
	line-height: 56px;
	text-align: center;
}

.cmp-reg-card:has(.cmp-reg-done-icon) {
	text-align: center;
}

@media (min-width: 560px) {
	.cmp-registration-app {
		padding-top: 72px;
	}
	.cmp-reg-card {
		padding: 32px 36px;
	}
	.cmp-reg-two {
		grid-template-columns: 1fr 1fr;
	}
}

.cmp-muted {
	color: var(--cmp-text-muted);
	font-size: 13px;
}

/* Donate form (0.8.2): preset buttons wrap on a phone; the chosen one is outlined. */
.cmp-donate-presets {
	display: flex;
	flex-wrap: nowrap;
	gap: 8px;
	margin-bottom: 14px;
}

.cmp-donate-footer {
	margin-top: 24px;
	font-size: 12px;
	color: var(--cmp-text-muted, #64748b);
}

.cmp-donate-footer p {
	margin: 0 0 4px;
}

.cmp-donate-honor {
	display: flex;
	flex-wrap: wrap;
	gap: 16px;
	margin-bottom: 14px;
}

.cmp-donate-honor label {
	font-weight: 500;
}

/* Donate form: stacked labels, full-width fields, plain fieldsets, one column on a phone. */
.cmp-donate-app {
	max-width: 560px;
	box-sizing: border-box;
}

.cmp-donate-app *,
.cmp-donate-footer * {
	box-sizing: border-box;
}

.cmp-donate-app .cmp-form-row label {
	display: block;
}

.cmp-donate-app .cmp-form-row input[type="text"],
.cmp-donate-app .cmp-form-row input[type="email"],
.cmp-donate-app .cmp-form-row textarea,
.cmp-donate-app .cmp-form-row select {
	display: block;
	width: 100%;
	margin-top: 4px;
	min-height: 44px;
}

.cmp-donate-app fieldset.cmp-form-row {
	border: 0;
	padding: 0;
	margin: 0 0 14px;
}

.cmp-donate-app fieldset.cmp-form-row legend {
	font-size: 13px;
	font-weight: 600;
	padding: 0;
	margin-bottom: 6px;
}

.cmp-donate-app .cmp-donate-honor input[type="radio"] {
	width: 18px;
	height: 18px;
	margin-right: 4px;
	vertical-align: -3px;
}

/* Preset amounts: one row. Unselected is the cream tint, selected is the accent orange; same radius as .cmp-btn. */
.cmp-donate-preset {
	flex: 1 1 0;
	min-width: 0;
	min-height: 44px;
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	gap: 2px;
	padding: 6px 4px;
	background: var(--cmp-accent-bg);
	color: var(--cmp-text-dark);
	border: 1px solid var(--cmp-border);
	border-radius: var(--cmp-radius-btn);
	font-family: inherit;
	cursor: pointer;
}

.cmp-donate-preset:hover {
	border-color: var(--cmp-accent);
}

.cmp-donate-preset[aria-pressed="true"] {
	background: var(--cmp-accent);
	border-color: var(--cmp-accent);
	color: #fff;
}

.cmp-donate-amt {
	font-size: 16px;
	font-weight: 700;
	line-height: 1.1;
}

.cmp-donate-lbl {
	font-size: 10px;
	font-weight: 500;
	line-height: 1.15;
	text-align: center;
	overflow-wrap: anywhere;
}

.cmp-donate-warning {
	margin: 0 0 14px;
}

.cmp-donate-preview {
	margin: 0 0 14px;
	padding: 12px 14px;
	background: var(--cmp-accent-bg);
	border: 1px solid var(--cmp-accent);
	border-radius: var(--cmp-radius-btn);
	color: var(--cmp-text-dark);
	font-weight: 700;
}

.cmp-donate-app .cmp-btn[disabled] {
	opacity: 0.5;
	cursor: not-allowed;
}

.cmp-donate-placeholders {
	margin-top: 20px;
	padding: 12px 14px;
	background: var(--cmp-accent-bg);
	border: 1px dashed var(--cmp-accent);
	border-radius: var(--cmp-radius-btn);
	font-size: 13px;
}

.cmp-donate-placeholders h3 {
	margin: 0 0 8px;
	font-size: 13px;
}

.cmp-donate-placeholders ul {
	margin: 0;
	padding-left: 18px;
}

.cmp-partner-page section,
.cmp-engage .cmp-card {
	margin-bottom: 28px;
}

.cmp-engage .cmp-card p {
	margin: 0 0 12px;
}

/* Location setup form (front end, mobile first, 2026-10-18) */
form.cmp-location-setup { max-width: 680px; margin: 24px auto 96px; padding: 0 16px; }
.cmp-ls-section { border: 1px solid var(--cmp-border); border-radius: var(--cmp-radius-card, 8px); background: white; margin-bottom: 12px; }
.cmp-ls-section > summary { list-style: none; cursor: pointer; padding: 16px; min-height: 44px; display: flex; flex-direction: column; gap: 2px; }
.cmp-ls-section > summary::-webkit-details-marker { display: none; }
.cmp-ls-section > summary::after { content: "+"; position: absolute; right: 16px; }
.cmp-ls-section { position: relative; }
.cmp-ls-section[open] > summary::after { content: "\2212"; }
.cmp-ls-title { font-weight: 700; font-size: 17px; }
.cmp-ls-hint { font-size: 13px; color: var(--cmp-text-muted); }
.cmp-ls-body { padding: 0 16px 16px; }
.cmp-ls-card { border: 1px solid var(--cmp-border); border-radius: 8px; padding: 12px; margin: 12px 0; }
.cmp-ls-sub > summary { cursor: pointer; padding: 10px 0; font-weight: 600; min-height: 44px; }
form.cmp-location-setup input[type="text"], form.cmp-location-setup input[type="email"], form.cmp-location-setup input[type="tel"], form.cmp-location-setup input[type="number"], form.cmp-location-setup input[type="date"], form.cmp-location-setup select, form.cmp-location-setup textarea { width: 100%; min-height: 44px; box-sizing: border-box; font-size: 16px; }
form.cmp-location-setup input[type="checkbox"] { width: 22px; height: 22px; margin-right: 8px; vertical-align: middle; }
.cmp-ls-savebar { position: sticky; bottom: 0; background: white; border-top: 1px solid var(--cmp-border); padding: 12px 0; display: flex; align-items: center; justify-content: space-between; gap: 12px; }
.cmp-ls-savebar .cmp-btn { min-height: 44px; min-width: 120px; }

/* Location setup wizard (replaces the collapsible sections), 2026-10-18 */
.cmp-ls-progress { margin-bottom: 20px; }
.cmp-ls-progress-label { display: flex; justify-content: space-between; font-size: 12px; font-weight: 700; text-transform: uppercase; letter-spacing: 0.06em; color: var(--cmp-text-muted); margin-bottom: 8px; }
.cmp-ls-progress-bar { height: 6px; background: var(--cmp-border); border-radius: 999px; overflow: hidden; }
.cmp-ls-progress-fill { height: 100%; width: 0; background: var(--cmp-accent); border-radius: 999px; transition: width .25s ease; }
.cmp-ls-step { background: white; border: 1px solid var(--cmp-border); border-radius: 12px; padding: 20px 16px 8px; box-shadow: 0 1px 2px rgba(15,30,44,.05); }
.cmp-ls-step[hidden] { display: none; }
.cmp-ls-step .cmp-ls-title { margin: 0 0 4px; font-size: 22px; line-height: 1.2; }
.cmp-ls-step .cmp-ls-hint { margin: 0 0 16px; font-size: 14px; color: var(--cmp-text-muted); }
.cmp-ls-nav { display: flex; gap: 12px; margin-top: 16px; }
.cmp-ls-btn { flex: 1; min-height: 52px; border-radius: 10px; font-family: inherit; font-size: 16px; font-weight: 700; cursor: pointer; border: 2px solid var(--cmp-accent); transition: background .15s ease, transform .05s ease, box-shadow .15s ease; }
.cmp-ls-btn:active { transform: translateY(1px); }
.cmp-ls-btn:focus-visible { outline: 3px solid rgba(232,93,47,.35); outline-offset: 2px; }
.cmp-ls-back { flex: 0 0 38%; background: white; color: var(--cmp-accent); }
.cmp-ls-back:hover { background: var(--cmp-accent-bg); }
.cmp-ls-next { background: var(--cmp-accent); color: white; box-shadow: 0 2px 6px rgba(232,93,47,.28); }
.cmp-ls-next:hover { background: var(--cmp-accent-dark); border-color: var(--cmp-accent-dark); }
.cmp-ls-next:disabled { opacity: .6; cursor: default; }
@media (min-width: 640px) { .cmp-ls-step { padding: 28px 28px 12px; } .cmp-ls-btn { flex: 0 0 auto; min-width: 200px; } .cmp-ls-back { min-width: 120px; flex: 0 0 auto; } .cmp-ls-nav { justify-content: space-between; } }

.cmp-ls-step .cmp-form-row { max-width: none; }
.cmp-ls-step .cmp-form-row input[type="text"], .cmp-ls-step .cmp-form-row input[type="email"], .cmp-ls-step .cmp-form-row input[type="tel"], .cmp-ls-step .cmp-form-row input[type="number"], .cmp-ls-step .cmp-form-row input[type="date"], .cmp-ls-step .cmp-form-row select, .cmp-ls-step .cmp-form-row textarea { width: 100%; max-width: none; }

.cmp-ls-card[hidden] { display: none; }
.cmp-ls-week-head { display: flex; justify-content: space-between; align-items: center; margin-bottom: 4px; }
.cmp-ls-remove { background: none; border: 0; color: var(--cmp-badge-danger-text); font-weight: 700; font-size: 14px; min-height: 44px; padding: 0 4px; cursor: pointer; }
.cmp-ls-remove:hover { text-decoration: underline; }
.cmp-ls-add { width: 100%; flex: none; background: white; color: var(--cmp-accent); margin: 4px 0 12px; }
.cmp-ls-add:hover { background: var(--cmp-accent-bg); }
.cmp-setup-modal { position: fixed; inset: 0; background: rgba(15,30,44,.6); display: none; align-items: center; justify-content: center; z-index: 100000; padding: 16px; }
.cmp-setup-modal.open { display: flex; }
.cmp-setup-modal-box { background: white; border-radius: 12px; width: 100%; max-width: 760px; height: 90vh; display: flex; flex-direction: column; overflow: hidden; }
.cmp-setup-modal-bar { display: flex; justify-content: space-between; align-items: center; padding: 10px 16px; border-bottom: 1px solid var(--cmp-border); font-weight: 700; }
.cmp-setup-modal-bar button { background: none; border: 0; font-size: 22px; cursor: pointer; min-width: 44px; min-height: 44px; }
.cmp-setup-modal iframe { flex: 1; border: 0; width: 100%; }

/* Email text editor in the location wizard */
.cmp-rte { border: 1px solid var(--cmp-border); border-radius: var(--cmp-radius-card); overflow: hidden; background: white; }
.cmp-rte-bar { display: flex; flex-wrap: wrap; gap: 6px; padding: 8px; border-bottom: 1px solid var(--cmp-border); background: var(--cmp-accent-bg); }
.cmp-rte-btn { min-height: 36px; padding: 0 12px; border: 1px solid var(--cmp-border); border-radius: 999px; background: white; font-family: inherit; font-size: 13px; font-weight: 600; cursor: pointer; text-transform: capitalize; }
.cmp-rte-btn:hover { border-color: var(--cmp-accent); color: var(--cmp-accent); }
.cmp-rte-chip { color: var(--cmp-accent); }
.cmp-rte-area { min-height: 140px; padding: 12px; font-size: 16px; line-height: 1.5; outline: none; }
.cmp-rte-area:focus { box-shadow: inset 0 0 0 2px var(--cmp-accent); }

/* Admin: thinner sidebar, tabs inside a view, camp and application cards (2026-10-18) */
.cmp-app { grid-template-columns: 196px 1fr; }
.cmp-tabs { display: flex; gap: 2px; margin-bottom: 20px; border-bottom: 1px solid var(--cmp-border); overflow-x: auto; }
.cmp-tab { background: transparent; border: 0; border-bottom: 2px solid transparent; padding: 10px 16px; margin-bottom: -1px; font-family: inherit; font-size: 13px; font-weight: 600; color: var(--cmp-text-muted); cursor: pointer; white-space: nowrap; }
.cmp-tab.active { color: var(--cmp-navy); border-bottom-color: var(--cmp-accent); }
.cmp-tabpane { display: none; }
.cmp-tabpane.active { display: block; }
.cmp-camps-head { display: flex; justify-content: space-between; align-items: flex-start; gap: 12px; margin-bottom: 16px; }
.cmp-camps-head h2 { margin: 0 0 2px; }
.cmp-camps-head p { margin: 0; }
.cmp-notice-bar { background: var(--cmp-accent-bg); border: 1px solid var(--cmp-accent); border-radius: var(--cmp-radius-card); padding: 10px 14px; margin-bottom: 16px; font-weight: 600; }
.cmp-camp-card, .cmp-app-card { background: white; border: 1px solid var(--cmp-border); border-radius: var(--cmp-radius-card); margin-bottom: 12px; }
.cmp-camp-card > summary, .cmp-app-card > summary { list-style: none; cursor: pointer; display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 16px; min-height: 44px; }
.cmp-camp-card > summary::-webkit-details-marker, .cmp-app-card > summary::-webkit-details-marker { display: none; }
.cmp-camp-card > summary::after { content: "+"; font-size: 20px; color: var(--cmp-text-muted); margin-left: 4px; }
.cmp-camp-card[open] > summary::after { content: "\2212"; }
.cmp-app-card { margin: 8px 0; background: var(--cmp-accent-bg); }
.cmp-app-card > summary { padding: 12px 14px; justify-content: flex-start; }
.cmp-app-card > summary .cmp-camp-title { flex: 1; }
.cmp-camp-title { display: flex; flex-direction: column; gap: 2px; min-width: 0; }
.cmp-camp-chips { display: flex; flex-wrap: wrap; gap: 6px; align-items: center; }
.cmp-chip { display: inline-block; padding: 3px 10px; border-radius: var(--cmp-radius-pill); background: var(--cmp-badge-neutral-bg); color: var(--cmp-badge-neutral-text); font-size: 12px; font-weight: 600; }
.cmp-camp-body { padding: 0 16px 16px; border-top: 1px solid var(--cmp-border); }
.cmp-camp-body h3 { margin: 16px 0 8px; font-size: 14px; }
.cmp-camp-actions { display: flex; flex-wrap: wrap; gap: 8px; padding: 14px 0 4px; }
.cmp-camp-actions form { margin: 0; }
.cmp-btn-danger { background: white; color: var(--cmp-badge-danger-text); border: 1px solid var(--cmp-badge-danger-bg); }
.cmp-btn-danger:hover { background: var(--cmp-badge-danger-bg); }
.cmp-btn-link { background: none; color: var(--cmp-badge-danger-text); padding: 6px 8px; }
.cmp-btn-link:hover { background: var(--cmp-badge-danger-bg); }
.cmp-week-row { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 10px 0; border-bottom: 1px solid var(--cmp-border); flex-wrap: wrap; }
.cmp-week-row > div:first-child { display: flex; flex-direction: column; gap: 2px; flex: 1; min-width: 160px; }
.cmp-add-week { margin-top: 14px; }
.cmp-add-week-fields { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 8px; }
.cmp-add-week-fields input { flex: 1; min-width: 130px; min-height: 40px; }
.cmp-add-camp { margin-bottom: 16px; }
.cmp-bulk-bar { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; padding: 12px 0 4px; }
.cmp-bulk-bar label { font-weight: 600; font-size: 13px; }
.cmp-facts { display: grid; grid-template-columns: repeat(auto-fit, minmax(200px, 1fr)); gap: 12px; margin: 14px 0; }
.cmp-facts dt { font-size: 11px; text-transform: uppercase; letter-spacing: 0.06em; color: var(--cmp-text-muted); font-weight: 700; }
.cmp-facts dd { margin: 2px 0 0; word-break: break-word; }
.cmp-review-form { display: flex; flex-wrap: wrap; align-items: flex-end; gap: 10px; }
.cmp-review-form .cmp-form-row { margin: 0; }
@media (max-width: 782px) { .cmp-app { grid-template-columns: 1fr; } .cmp-camps-head { flex-direction: column; } }

/* Second-camp picker on the registration form */
.cmp-reg-group { margin: 16px 0 8px; font-size: 14px; font-weight: 700; }
.cmp-reg-option input[type="checkbox"] { width: 22px; height: 22px; margin-right: 10px; flex: none; }
label.cmp-reg-option { display: flex; align-items: center; flex-wrap: wrap; gap: 4px 12px; cursor: pointer; }

/* Registration: how many camps, and the week picker (polish, 2026-10-18) */
.cmp-reg-plan { display: flex; flex-direction: column; gap: 12px; margin: 16px 0 8px; }
.cmp-reg-plan-card { display: flex; align-items: center; gap: 14px; width: 100%; text-align: left; padding: 16px; min-height: 76px; background: white; border: 2px solid var(--cmp-border); border-radius: 12px; font-family: inherit; cursor: pointer; transition: border-color .15s ease, box-shadow .15s ease, transform .05s ease; }
.cmp-reg-plan-card:hover { border-color: var(--cmp-accent); box-shadow: 0 2px 8px rgba(15, 30, 44, .08); }
.cmp-reg-plan-card:active { transform: translateY(1px); }
.cmp-reg-plan-featured { border-color: var(--cmp-accent); background: var(--cmp-accent-bg); }
.cmp-reg-plan-icon { flex: none; width: 44px; height: 44px; border-radius: 50%; display: inline-flex; align-items: center; justify-content: center; background: var(--cmp-navy); color: white; font-weight: 800; font-size: 15px; }
.cmp-reg-plan-featured .cmp-reg-plan-icon { background: var(--cmp-accent); }
.cmp-reg-plan-text { display: flex; flex-direction: column; gap: 2px; flex: 1; min-width: 0; }
.cmp-reg-plan-text strong { font-size: 16px; color: var(--cmp-text-dark); }
.cmp-reg-plan-text span { font-size: 14px; color: var(--cmp-text-muted); }
.cmp-reg-plan-badge { align-self: flex-start; margin-top: 6px; padding: 3px 10px; border-radius: var(--cmp-radius-pill); background: var(--cmp-accent); color: white; font-style: normal; font-size: 12px; font-weight: 700; }
.cmp-reg-plan-go { flex: none; font-size: 28px; color: var(--cmp-text-muted); }
.cmp-reg-hint { margin: 14px 0 0; font-size: 13px; color: var(--cmp-text-muted); text-align: center; }
.cmp-reg-group-card { border: 1px solid var(--cmp-border); border-radius: 12px; padding: 12px; margin: 14px 0; background: white; }
.cmp-reg-group-head { display: flex; flex-direction: column; gap: 2px; margin: 2px 4px 10px; }
.cmp-reg-group-head strong { font-size: 16px; }
.cmp-reg-group-head span { font-size: 13px; color: var(--cmp-text-muted); }
.cmp-reg-tile { position: relative; display: flex; align-items: center; gap: 12px; padding: 14px; min-height: 64px; border: 2px solid var(--cmp-border); border-radius: 10px; margin-top: 8px; cursor: pointer; background: white; transition: border-color .15s ease, background .15s ease; }
.cmp-reg-tile:hover { border-color: var(--cmp-accent); }
.cmp-reg-tile-on { border-color: var(--cmp-accent); background: var(--cmp-accent-bg); }
.cmp-reg-tile-full { opacity: .55; cursor: not-allowed; }
.cmp-reg-tile-input { position: absolute; opacity: 0; width: 1px; height: 1px; }
.cmp-reg-tile-check { flex: none; width: 28px; height: 28px; border-radius: 50%; border: 2px solid var(--cmp-border); display: inline-flex; align-items: center; justify-content: center; font-size: 15px; font-weight: 800; color: transparent; background: white; }
.cmp-reg-tile-on .cmp-reg-tile-check { background: var(--cmp-accent); border-color: var(--cmp-accent); color: white; }
.cmp-reg-tile-input:focus-visible + .cmp-reg-tile-check { outline: 3px solid var(--cmp-accent-bg); box-shadow: 0 0 0 2px var(--cmp-accent); }
.cmp-reg-tile-main { display: flex; flex-direction: column; gap: 2px; flex: 1; min-width: 0; }
.cmp-reg-tile-main strong { font-size: 15px; color: var(--cmp-text-dark); }
.cmp-reg-tile-main span { font-size: 13px; color: var(--cmp-text-muted); }
.cmp-reg-tile-price { display: flex; flex-direction: column; align-items: flex-end; flex: none; }
.cmp-reg-tile-price strong { font-size: 18px; }
.cmp-reg-tile-price span { font-size: 12px; color: var(--cmp-text-muted); }
.cmp-reg-pickbar { position: sticky; bottom: 0; display: flex; align-items: center; justify-content: space-between; gap: 12px; margin: 16px -4px 0; padding: 12px; border-radius: 12px; background: var(--cmp-navy); color: white; }
.cmp-reg-pickbar-saving { background: var(--cmp-accent); }
.cmp-reg-picksummary { font-size: 14px; font-weight: 600; }
.cmp-reg-pickgo { flex: none; min-height: 44px; background: white; color: var(--cmp-navy); }
.cmp-reg-pickgo:disabled { opacity: .5; cursor: default; }

.cmp-reg-weeks-list { display: flex; flex-direction: column; gap: 8px; margin-top: 6px; }
.cmp-reg-week-chip { width: 100%; justify-content: flex-start; min-height: 44px; }

.cmp-reg-pickbar { flex-wrap: wrap; }
.cmp-reg-picksummary { flex: 1 1 200px; min-width: 0; }
.cmp-reg-pickbar .cmp-reg-pickgo { flex: 0 0 auto; width: auto; min-width: 120px; background: white; color: var(--cmp-navy); border: 0; border-radius: 10px; padding: 0 20px; justify-content: center; }

/* Registration polish: attended-before chips, medical none box, five-campers callout */
.cmp-reg-chip-row { justify-content: center; gap: 12px; }
.cmp-registration-app .cmp-reg-chip { justify-content: center; min-width: 110px; min-height: 48px; padding: 10px 24px; border: 2px solid var(--cmp-border); font-size: 15px; font-weight: 600; background: white; transition: border-color .15s ease, background .15s ease; }
.cmp-registration-app .cmp-reg-chip:hover { border-color: var(--cmp-accent); }
.cmp-registration-app .cmp-reg-chip:has(input:checked) { border-color: var(--cmp-accent); background: var(--cmp-accent-bg); color: var(--cmp-accent-dark); font-weight: 700; }
.cmp-reg-none { display: flex; align-items: center; gap: 10px; margin-top: 10px; font-size: 14px; font-weight: 600; cursor: pointer; min-height: 44px; }
.cmp-reg-none input { width: 22px; height: 22px; flex: none; }
.cmp-reg-callout { background: var(--cmp-accent-bg); border: 1px solid var(--cmp-accent); border-radius: 10px; padding: 12px 14px; margin: 0 0 16px; font-size: 14px; font-weight: 600; color: var(--cmp-text-dark); }
.cmp-reg-attended { text-align: center; }

/* Review step: list price per line, then savings and the total */
.cmp-reg-review { width: 100%; }
.cmp-reg-review .cmp-reg-amt { text-align: right; white-space: nowrap; font-weight: 600; }
.cmp-reg-rowsub { display: block; font-size: 13px; color: var(--cmp-text-muted); }
.cmp-reg-summary { margin: 18px 0 8px; border: 1px solid var(--cmp-border); border-radius: 12px; padding: 6px 16px; background: white; }
/* CMP-0027: required agreement on the Review step. */
.cmp-reg-consent { margin: 16px 0; border: 1px solid var(--cmp-border); border-radius: 12px; padding: 12px 16px; background: white; }
.cmp-reg-consent-doc { margin: 0 0 8px; }
.cmp-reg-consent-doc summary { cursor: pointer; font-weight: 600; }
.cmp-reg-consent-text { max-height: 160px; overflow-y: auto; font-size: 14px; padding: 6px 0; }
.cmp-reg-consent-check { display: flex; gap: 10px; align-items: flex-start; font-weight: 600; margin-top: 8px; }
.cmp-reg-consent-check input { width: 22px; height: 22px; flex: none; }
.cmp-reg-sumrow { display: flex; justify-content: space-between; gap: 12px; padding: 10px 0; font-size: 15px; }
.cmp-reg-sumsave { color: var(--cmp-badge-success-text); font-weight: 600; border-top: 1px dashed var(--cmp-border); }
.cmp-reg-savebadge { margin: 6px 0 8px; padding: 8px 12px; border-radius: 8px; background: var(--cmp-badge-success-bg); color: var(--cmp-badge-success-text); font-weight: 700; text-align: center; font-size: 14px; }
.cmp-reg-sumtotal { border-top: 2px solid var(--cmp-navy); font-size: 20px; font-weight: 800; padding-top: 12px; }

/* Conduct and waiver text on public forms: readable size, scrolls instead of filling the page */
.cmp-conduct-text, .cmp-waiver-text { font-size: 14px; line-height: 1.55; max-height: 220px; overflow-y: auto; padding: 12px 14px; margin: 8px 0 12px; background: var(--cmp-accent-bg); border: 1px solid var(--cmp-border); border-radius: var(--cmp-radius-card); }
.cmp-conduct-text p, .cmp-waiver-text p { margin: 0 0 10px; font-size: inherit; line-height: inherit; }
.cmp-conduct-text p:last-child, .cmp-waiver-text p:last-child { margin-bottom: 0; }
fieldset.cmp-form-group[data-cmp-conduct] label { font-size: 15px; display: flex; gap: 10px; align-items: flex-start; }

/* Public forms: two columns on wider screens, one column on a phone */
form.cmp-public-form { display: grid; grid-template-columns: 1fr; gap: 0 20px; max-width: 880px; margin: 0 auto; padding: 0 16px; box-sizing: border-box; }
form.cmp-public-form > * { min-width: 0; }
form.cmp-public-form .cmp-form-row { margin-bottom: 16px; }
@media (min-width: 720px) {
	form.cmp-public-form { grid-template-columns: 1fr 1fr; }
	form.cmp-public-form > .cmp-form-status,
	form.cmp-public-form > .cmp-form-camp,
	form.cmp-public-form > fieldset,
	form.cmp-public-form > button,
	form.cmp-public-form > .cmp-form-row:has(textarea),
	form.cmp-public-form > .cmp-form-row:has(input[type="checkbox"]),
	form.cmp-public-form > .cmp-form-row:has(.cmp-field-note) { grid-column: 1 / -1; }
	form.cmp-public-form fieldset.cmp-form-group { display: grid; grid-template-columns: 1fr 1fr; gap: 0 20px; }
	form.cmp-public-form fieldset.cmp-form-group > legend { grid-column: 1 / -1; }
	form.cmp-public-form fieldset.cmp-qualifications .cmp-form-row,
	form.cmp-public-form fieldset[data-cmp-conduct] > * { grid-column: auto; }
	form.cmp-public-form fieldset[data-cmp-conduct] > legend,
	form.cmp-public-form fieldset[data-cmp-conduct] > .cmp-conduct-text,
	form.cmp-public-form fieldset[data-cmp-conduct] > .cmp-form-row,
	form.cmp-public-form fieldset[data-cmp-conduct] > .cmp-field-note { grid-column: 1 / -1; }
}
form.cmp-public-form button[type="submit"] { justify-self: start; min-height: 48px; padding: 0 28px; font-size: 16px; }

/* Multi-step public forms (volunteer) and breathing room above the footer */
form.cmp-public-form { margin-bottom: 96px; }
form.cmp-public-form .cmp-form-progress, form.cmp-public-form .cmp-form-nav { grid-column: 1 / -1; }
form.cmp-public-form .cmp-form-step { grid-column: 1 / -1; display: grid; grid-template-columns: 1fr; gap: 0 20px; }
form.cmp-public-form .cmp-form-step[hidden] { display: none; }
form.cmp-public-form .cmp-form-nav { margin-top: 8px; }
form.cmp-public-form .cmp-form-submit[hidden], form.cmp-public-form .cmp-form-next[hidden] { display: none; }
form.cmp-public-form.cmp-form-done .cmp-form-step, form.cmp-public-form.cmp-form-done .cmp-form-nav, form.cmp-public-form.cmp-form-done .cmp-form-progress { display: none; }
form.cmp-public-form .cmp-form-status-bottom:empty { display: none; }
form.cmp-public-form.cmp-form-done .cmp-form-status { font-size: 18px; font-weight: 700; padding: 24px 0; text-align: center; grid-column: 1 / -1; }
@media (min-width: 720px) {
	form.cmp-public-form .cmp-form-step { grid-template-columns: 1fr 1fr; }
	form.cmp-public-form .cmp-form-step > .cmp-form-camp,
	form.cmp-public-form .cmp-form-step > fieldset,
	form.cmp-public-form .cmp-form-step > .cmp-form-row:has(textarea),
	form.cmp-public-form .cmp-form-step > .cmp-form-row:has(input[type="checkbox"]),
	form.cmp-public-form .cmp-form-step > .cmp-form-row:has(.cmp-field-note) { grid-column: 1 / -1; }
}

/* Keep the last button clear of the footer (an end spacer survives theme margin rules) */
form.cmp-public-form::after { content: ""; display: block; height: 96px; grid-column: 1 / -1; }

/* Registration polish pass: quieter notes, steadier spacing */
.cmp-reg-fine { margin: -6px 0 18px; font-size: 13px; color: var(--cmp-text-muted); }
.cmp-reg-callout { display: none; }
.cmp-reg-form .cmp-form-row { margin-bottom: 18px; }
.cmp-reg-form .cmp-form-row label { margin-bottom: 6px; }
.cmp-reg-none { margin: 10px 0 0; min-height: 0; gap: 10px; font-size: 14px; font-weight: 500; color: var(--cmp-text-dark); }
.cmp-reg-none input { margin: 0; width: 20px; height: 20px; }
.cmp-reg-attended { margin: 6px 0 22px; }
.cmp-reg-attended .cmp-reg-label { display: block; margin-bottom: 10px; font-weight: 600; }
.cmp-reg-form .cmp-btn { margin-top: 8px; }
.cmp-reg-card { padding-bottom: 28px; }
.cmp-reg-card h2 { margin-bottom: 8px; }
.cmp-reg-sub { margin: 0 0 18px; }

.cmp-reg-more { display: flex; align-items: center; justify-content: space-between; gap: 10px; flex-wrap: wrap; margin: 22px 2px 4px; padding-top: 16px; border-top: 1px dashed var(--cmp-border); }
.cmp-reg-more strong { font-size: 15px; }
.cmp-reg-more .cmp-reg-plan-badge { margin-top: 0; }

/* Medical: "No medical concerns" as a tidy toggle chip, same style as Yes and No */
.cmp-reg-none-row { display: flex; align-items: center; flex-wrap: wrap; gap: 10px 14px; margin-top: 14px; }
.cmp-registration-app .cmp-reg-none-chip { min-width: 0; min-height: 44px; padding: 8px 20px; margin: 0; }
.cmp-registration-app .cmp-reg-none-chip::before { content: ""; width: 18px; height: 18px; margin-right: 10px; flex: none; border: 2px solid var(--cmp-border); border-radius: 50%; background: white; box-sizing: border-box; }
.cmp-registration-app .cmp-reg-none-chip:has(input:checked)::before { background: var(--cmp-accent); border-color: var(--cmp-accent); box-shadow: inset 0 0 0 3px white; }
.cmp-reg-none-hint { font-size: 13px; color: var(--cmp-text-muted); }
.cmp-reg-form textarea:disabled { background: var(--cmp-accent-bg); opacity: .6; }

/* The "Loading registration" placeholder: centered in the same card width as the form */
.cmp-registration-app .cmp-reg-loading { max-width: 680px; margin: 40px auto; padding: 48px 24px; text-align: center; font-size: 16px; color: var(--cmp-text-muted); background: white; border: 1px solid var(--cmp-border); border-radius: 16px; }
.cmp-reg-card { text-align: left; }
.cmp-reg-wrap > .cmp-reg-card:only-child { text-align: center; }
/* Second camp section: the saving pill rides inside the camp box */
.cmp-reg-group-card .cmp-reg-group-head { position: relative; padding-right: 150px; }
.cmp-reg-group-card .cmp-reg-group-head .cmp-reg-plan-badge { position: absolute; right: 4px; top: 2px; margin: 0; }
@media (max-width: 480px) { .cmp-reg-group-card .cmp-reg-group-head { padding-right: 0; } .cmp-reg-group-card .cmp-reg-group-head .cmp-reg-plan-badge { position: static; align-self: flex-start; margin-top: 6px; } }

/* Per-child week picker: two columns, label centered both ways */
.cmp-reg-weeks-list { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; margin-top: 8px; }
.cmp-registration-app .cmp-reg-week-chip { width: 100%; min-height: 60px; padding: 10px 14px; display: flex; align-items: center; justify-content: center; text-align: center; border-radius: 16px; box-sizing: border-box; line-height: 1.3; }
.cmp-registration-app .cmp-reg-week-chip span { display: block; width: 100%; text-align: center; }
@media (max-width: 560px) { .cmp-reg-weeks-list { grid-template-columns: 1fr; } }

/* No medical concerns chip: a true round marker (the label was being forced to block, which squashed it) */
.cmp-registration-app .cmp-reg-none-row .cmp-reg-none-chip { display: inline-flex; align-items: center; justify-content: flex-start; gap: 0; width: auto; }
.cmp-registration-app .cmp-reg-none-row .cmp-reg-none-chip::before { display: inline-block; flex: 0 0 18px; width: 18px; min-width: 18px; height: 18px; margin-right: 10px; border-radius: 50%; }

/* Camps that are not open yet: listed in gray, not selectable */
.cmp-reg-option-soon { position: relative; background: var(--cmp-badge-neutral-bg); border-color: var(--cmp-border); color: var(--cmp-text-muted); cursor: default; opacity: .85; }
.cmp-reg-option-soon strong { color: var(--cmp-text-muted); }
.cmp-reg-option-soon:hover { border-color: var(--cmp-border); box-shadow: none; transform: none; }
.cmp-reg-soon-badge { display: inline-block; align-self: flex-start; margin-top: 6px; padding: 3px 10px; border-radius: var(--cmp-radius-pill); background: white; border: 1px solid var(--cmp-border); font-style: normal; font-size: 12px; font-weight: 700; color: var(--cmp-text-muted); }

/* Week picker bar: aligned with the content column, roomier */
.cmp-reg-pickbar { margin: 18px 0 4px; padding: 14px 16px 14px 20px; border-radius: 14px; box-shadow: 0 6px 18px rgba(15, 30, 44, .18); }
.cmp-reg-picksummary { font-size: 15px; line-height: 1.3; }
.cmp-registration-app .cmp-reg-pickbar .cmp-reg-pickgo { margin: 0; width: auto; min-width: 128px; min-height: 46px; border-radius: 10px; font-size: 15px; font-weight: 700; }
.cmp-registration-app .cmp-reg-pickbar .cmp-reg-pickgo:not(:disabled):hover { background: var(--cmp-accent-bg); }

/* [cmp_contact_chat]: conversational contact form (tokens only) */
.cmp-chat { max-width: 640px; margin: 0 auto; background: white; border: 1px solid var(--cmp-border); border-radius: calc(var(--cmp-radius-card) + 4px); box-shadow: 0 8px 24px rgba(15, 30, 44, 0.08); overflow: hidden; font-family: var(--cmp-font-sans); }
.cmp-chat-head { display: flex; align-items: center; gap: 10px; padding: 14px 18px; background: var(--cmp-navy); color: white; }
.cmp-chat-head strong { font-size: 15px; flex: 1; }
.cmp-chat-dot { width: 10px; height: 10px; border-radius: var(--cmp-radius-pill); background: var(--cmp-accent); }
.cmp-chat-switch { display: none; width: 32px; height: 32px; padding: 0; align-items: center; justify-content: center; border: 1px solid var(--cmp-navy-light); border-radius: var(--cmp-radius-btn); background: transparent; color: var(--cmp-sidebar-text); cursor: pointer; }
.cmp-chat-switch:hover, .cmp-chat-switch:focus-visible { background: var(--cmp-navy-light); color: white; outline: none; }
.cmp-chat-switch .cmp-chat-ico-chat { display: none; }
.cmp-chat-off .cmp-chat-switch .cmp-chat-ico-form { display: none; }
.cmp-chat-off .cmp-chat-switch .cmp-chat-ico-chat { display: block; }
.cmp-chat-log { height: 340px; overflow-y: auto; padding: 18px; display: flex; flex-direction: column; gap: 10px; background: var(--cmp-accent-bg); }
.cmp-chat-row { display: flex; }
.cmp-chat-you { justify-content: flex-end; }
.cmp-chat-bubble { max-width: 82%; padding: 8px 12px; border-radius: 14px; font-size: 14px; line-height: 1.45; white-space: pre-wrap; overflow-wrap: anywhere; }
.cmp-chat-bot .cmp-chat-bubble { background: white; color: var(--cmp-text-dark); border: 1px solid var(--cmp-border); border-bottom-left-radius: 4px; }
.cmp-chat-you .cmp-chat-bubble { background: var(--cmp-accent); color: white; border-bottom-right-radius: 4px; }
.cmp-chat-typing .cmp-chat-bubble { color: var(--cmp-text-muted); letter-spacing: 2px; }
.cmp-chat-tray { padding: 14px 18px 18px; border-top: 1px solid var(--cmp-border); background: white; min-height: 64px; }
.cmp-chat-choices { display: flex; flex-wrap: wrap; gap: 6px; }
.cmp-chat-choice { min-height: 34px; padding: 4px 12px; border: 1px solid var(--cmp-accent); border-radius: var(--cmp-radius-pill); background: white; color: var(--cmp-accent-dark); font: inherit; font-size: 13px; font-weight: 600; cursor: pointer; }
.cmp-chat-choice:hover, .cmp-chat-choice:focus-visible { background: var(--cmp-accent); color: white; outline: none; }
.cmp-chat-input { display: flex; gap: 8px; align-items: flex-end; }
.cmp-chat-input input, .cmp-chat-input textarea { flex: 1; min-width: 0; min-height: 36px; padding: 10px 12px; border: 1px solid var(--cmp-border); border-radius: var(--cmp-radius-btn); font: inherit; font-size: 14px; }
.cmp-chat-input input:focus, .cmp-chat-input textarea:focus { outline: 2px solid var(--cmp-accent); outline-offset: 1px; }
.cmp-chat-send { min-height: 36px; padding: 0 16px; border: 1px solid var(--cmp-accent); border-radius: var(--cmp-radius-btn); background: white; color: var(--cmp-accent-dark); font: inherit; font-size: 14px; font-weight: 500; letter-spacing: 0; text-transform: none; cursor: pointer; }
.cmp-chat-send:hover, .cmp-chat-send:focus-visible { background: var(--cmp-accent); color: white; outline: none; }
.cmp-chat-skip { min-height: 36px; padding: 0 12px; border: 0; background: none; color: var(--cmp-text-muted); font: inherit; text-decoration: underline; cursor: pointer; }
.cmp-chat-error { margin: 8px 0 0; color: var(--cmp-badge-danger-text); font-size: 14px; min-height: 0; }
.cmp-chat-plain { display: block; padding: 18px; }
.cmp-chat-log, .cmp-chat-tray { display: none; }
.cmp-chat.cmp-chat-ready .cmp-chat-log, .cmp-chat.cmp-chat-ready .cmp-chat-tray { display: block; }
.cmp-chat.cmp-chat-ready .cmp-chat-switch { display: inline-flex; }
.cmp-chat.cmp-chat-ready .cmp-chat-plain { display: none; }
.cmp-chat.cmp-chat-ready.cmp-chat-off .cmp-chat-log, .cmp-chat.cmp-chat-ready.cmp-chat-off .cmp-chat-tray { display: none; }
.cmp-chat.cmp-chat-ready.cmp-chat-off .cmp-chat-plain { display: block; }
@media (max-width: 480px) { .cmp-chat { border-radius: var(--cmp-radius-card); } .cmp-chat-log { height: 300px; padding: 14px; } .cmp-chat-bubble { max-width: 90%; } }

@media (min-width: 521px) { .cmp-chat-choices { flex-wrap: nowrap; } .cmp-chat-choice { white-space: nowrap; padding: 4px 10px; } }

.cmp-reg-pickbar { position: static; margin: 16px 0 0; }

/* location header nav: wrap on phones instead of running off the page */
@media (max-width: 520px) { .cmp-loc-nav { gap: 6px 16px !important; width: 100% !important; max-width: 100% !important; min-width: 0 !important; flex-wrap: wrap !important; margin: 0 !important; padding: 0 !important; } .nav-cluster { max-width: 100% !important; min-width: 0 !important; } .simple-header-expanded { flex-wrap: wrap !important; } }

/* registration form: every box the same size (tel, email and number were unstyled, selects ran taller) */
.cmp-registration-app .cmp-form-row input[type="text"],
.cmp-registration-app .cmp-form-row input[type="date"],
.cmp-registration-app .cmp-form-row input[type="tel"],
.cmp-registration-app .cmp-form-row input[type="email"],
.cmp-registration-app .cmp-form-row input[type="number"],
.cmp-registration-app .cmp-form-row select { box-sizing: border-box; display: block; width: 100%; max-width: none; height: 46px; min-height: 46px; padding: 0 12px; border: 1px solid var(--reg-line); border-radius: 8px; background-color: white; color: var(--reg-fg); font-family: inherit; font-size: 15px; line-height: 1.4; box-shadow: none; }
.cmp-registration-app .cmp-form-row textarea { box-sizing: border-box; width: 100%; max-width: none; padding: 11px 12px; font-size: 15px; }