/**
 * Public registration form ([cbyos_registration]). Neutral, self-contained
 * styling that sits comfortably inside the front-end theme's content column.
 */
/* Full-width pale-blue top band, reusing the theme's .page-hero styling. The
   100vw breakout keeps it edge-to-edge even though the shortcode renders inside
   the page content wrapper. */
.cbyos-reg-topband { width: 100vw; margin-left: calc(50% - 50vw); }
/* Match the theme's block-flow spacing (block-gap 1.5rem, no element margins)
   so the band's height matches the Contact page's, instead of the browser's
   larger default h1/p margins. */
.cbyos-reg-topband .page-hero__inner > * { margin-block: 1.5rem 0; }
.cbyos-reg-topband .page-hero__inner > :first-child { margin-block-start: 0; }
.cbyos-reg { max-width: 720px; margin: clamp(2rem, 5vw, 3rem) auto 0; padding: 0 1.25rem; box-sizing: border-box; }
.cbyos-reg__error {
	background: #fdecea; border: 1px solid #e6a6a1; color: #8a2018;
	padding: .75rem 1rem; border-radius: 8px; margin: 0 0 1rem;
}
.cbyos-reg__box {
	border: 1px solid #e2e2e6; border-radius: 12px; padding: 1rem 1.25rem 1.25rem;
	margin: 0 0 1rem; background: #fff;
}
.cbyos-reg__box > legend {
	font-weight: 700; padding: 0 .4rem; font-size: 1.05rem;
	display: flex; align-items: center; gap: .5rem;
}
.cbyos-reg__grid {
	display: grid; grid-template-columns: 1fr 1fr; gap: .85rem 1rem;
}
.cbyos-reg__grid label {
	display: block; font-size: .9rem; font-weight: 600; min-width: 0;
}
.cbyos-reg__grid label > input,
.cbyos-reg__grid label > select,
.cbyos-reg__grid label > textarea { margin-top: .3rem; }
.cbyos-reg__grid .cbyos-reg__slotwrap { grid-column: 1 / -1; }
.cbyos-reg__grid .cbyos-reg__full { grid-column: 1 / -1; }
.cbyos-reg__req { color: #d63638; margin-left: 2px; }
.cbyos-reg input,
.cbyos-reg select,
.cbyos-reg textarea {
	font: inherit; padding: .55rem .6rem; border: 1px solid #c7c7cc; border-radius: 8px;
	background: #fff; width: 100%; box-sizing: border-box;
}
.cbyos-reg textarea { resize: vertical; min-height: 3rem; }
/* iOS renders date inputs with a fixed native width that overflows the field.
   appearance:none + min-width:0 lets them shrink; because that also strips the
   native height, the value pseudo reserves one line so an empty field keeps the
   same height as the text inputs. */
.cbyos-reg input[type="date"] { -webkit-appearance: none; appearance: none; min-width: 0; max-width: 100%; }
.cbyos-reg input[type="date"]::-webkit-date-and-time-value { min-height: 1.5em; text-align: left; }
.cbyos-reg input:focus,
.cbyos-reg select:focus,
.cbyos-reg textarea:focus { outline: 2px solid #2271b1; outline-offset: 1px; }
/* Checkbox rows sit inline (label to the right of the box), not stacked. */
.cbyos-reg__grid label.cbyos-reg__check { display: flex; align-items: center; gap: .5rem; font-weight: 500; }
.cbyos-reg__check > input { width: auto; margin-top: 0; }
.cbyos-reg select[disabled] { background: #f2f2f4; color: #8c8f94; }
.cbyos-reg__snum { font-weight: 700; }
.cbyos-reg__remove {
	margin-left: auto; border: none; background: #f2f2f4; color: #7a7a80;
	width: 26px; height: 26px; border-radius: 50%; cursor: pointer; font-size: 18px; line-height: 1;
}
.cbyos-reg__remove:hover { background: #f4d7d5; color: #8a2018; }
.cbyos-reg__slotnote { margin: .5rem 0 0; font-size: .9rem; color: #3a7a52; min-height: 1.1em; }
.cbyos-reg__add {
	border: 1px dashed #9aa0a6; background: #fafafa; color: #333; cursor: pointer;
	padding: .6rem 1rem; border-radius: 8px; font: inherit; font-weight: 600; margin: 0 0 1.25rem;
}
.cbyos-reg__add:hover { background: #f0f0f2; }
.cbyos-reg__foot { text-align: center; }
.cbyos-reg__fee { font-size: .9rem; color: #555; margin: 0 0 .75rem; }
.cbyos-reg__submit {
	display: inline-block; background: #2271b1; color: #fff; border: none; cursor: pointer;
	padding: .8rem 1.6rem; border-radius: 10px; font: inherit; font-weight: 700; font-size: 1.05rem;
	text-decoration: none;
}
.cbyos-reg__submit:hover { background: #185a92; }
.cbyos-reg__secure { font-size: .82rem; color: #787c82; margin: .7rem 0 0; }
.cbyos-reg--closed, .cbyos-reg--done, .cbyos-reg--cancelled { text-align: center; padding: 1rem 0 2rem; }
.cbyos-reg__closedtitle { font-size: 1.4rem; }

/* Full-width photo hero for the thank-you / invitation-only states. Breaks out
   of the theme's content column to span the viewport, with a dark scrim so the
   overlaid white text stays legible. */
.cbyos-reg-hero {
	margin-left: calc(50% - 50vw);
	margin-right: calc(50% - 50vw);
	position: relative;
	min-height: 62vh;
	display: flex;
	align-items: center;
	justify-content: center;
	background-size: cover;
	/* Desktop: bias upward so her eyes/head aren't cropped. */
	background-position: center 22%;
	text-align: center;
	overflow: hidden;
}
/* Mobile: bias toward the right so her clapping hands stay in frame. */
@media (max-width: 700px) {
	.cbyos-reg-hero { background-position: 72% 30%; }
}
.cbyos-reg-hero--plain { background: #1f2937; }
.cbyos-reg-hero__scrim { position: absolute; inset: 0; background: rgba(0, 0, 0, .55); }
.cbyos-reg-hero__inner { position: relative; z-index: 1; max-width: 760px; padding: 3.5rem 1.5rem; color: #fff; }
.cbyos-reg-hero__inner h1 { color: #fff; font-size: clamp(1.9rem, 5vw, 3.1rem); line-height: 1.12; margin: 0 0 1rem; }
.cbyos-reg-hero__inner p { color: #f2f2f2; font-size: clamp(1.05rem, 2.4vw, 1.3rem); margin: 0 0 1.6rem; }
.cbyos-reg-hero__btn {
	display: inline-block; background: #f4b23e; color: #1a1a1a; font-weight: 700;
	padding: .85rem 1.9rem; border-radius: 10px; text-decoration: none; font-size: 1.05rem;
}
.cbyos-reg-hero__btn:hover { background: #e0a02f; }
.cbyos-reg-hero__link { color: #f4b23e; font-weight: 700; text-decoration: underline; }
.cbyos-reg-hero__link:hover { color: #ffce6b; }

@media (max-width: 540px) {
	.cbyos-reg__grid { grid-template-columns: 1fr; }
}

/* Hide the site's shared footer photo band on the registration page only. This
   stylesheet is enqueued solely where the [cbyos_registration] shortcode renders,
   so no other page is affected. */
.prefooter-band { display: none; }
