/* ==========================================
   Register Start Page
   ========================================== */

/* Event Banner */
.event-banner {
	text-align: center;
	margin-bottom: 1.5rem;
	padding: 1rem;
	background: linear-gradient(135deg, #1c6017 0%, #219119 100%);
	color: white;
	border-radius: 8px;
	max-width: 400px;
	width: 100%;
}
.event-banner .event-name {
	font-size: 1.25rem;
	font-weight: 600;
	margin-bottom: 0.25rem;
}
.event-banner .event-details {
	font-size: 0.875rem;
	opacity: 0.9;
}

/* Warning Callout (legacy - kept for backwards compatibility) */
.warning-callout {
	display: flex;
	align-items: flex-start;
	gap: 0.75rem;
	background: #fff8e6;
	border: 1px solid #f0c36d;
	border-radius: 6px;
	padding: 0.875rem 1rem;
	margin-bottom: 1.25rem;
	font-size: 0.875rem;
	color: #856404;
	line-height: 1.4;
}
.warning-callout i {
	color: #d4a012;
	font-size: 1.125rem;
	flex-shrink: 0;
	margin-top: 0.125rem;
}

/* Warning Note (subtle, at bottom) */
.warning-note {
	text-align: center;
	font-size: 0.8125rem;
	color: #888;
	margin-top: 1.5rem;
	margin-bottom: 0;
	line-height: 1.4;
}

/* Intro text under heading */
.intro-text {
	color: #666;
	font-size: 0.9375rem;
	margin-bottom: 1.5rem;
	text-align: center;
	line-height: 1.5;
}

/* Alternative action link */
.alt-action {
	text-align: center;
	margin-top: 1.25rem;
	font-size: 0.875rem;
	color: #666;
}
.alt-action a {
	color: #219119;
	text-decoration: none;
}
.alt-action a:hover {
	text-decoration: underline;
}

/* Check Email Message Screen */
.check-email-message {
	text-align: center;
	padding: 1rem 0;
}
.check-email-message > i {
	font-size: 4rem;
	color: #15c508;
	margin-bottom: 1rem;
}
.check-email-message h2 {
	font-size: 1.5rem;
	margin-bottom: 1rem;
}
.check-email-message p {
	color: #555;
	margin-bottom: 0.75rem;
}
.check-email-message .email-sent-to {
	background: #f7fafc;
	padding: 0.75rem;
	border-radius: 4px;
	margin: 1rem 0;
}
.check-email-message .email-sent-to strong {
	color: #2d3748;
	word-break: break-all;
}
.check-email-message .note {
	font-size: 0.8125rem;
	color: #888;
	font-style: italic;
}

/* Code Entry Section */
.code-entry-section {
	margin-top: 1.5rem;
	text-align: center;
}
.code-entry-section .code-intro {
	font-size: 0.875rem;
	color: #666;
	margin-bottom: 0.75rem;
}
.code-input-row {
	display: flex;
	justify-content: center;
	align-items: center;
	gap: 0.75rem;
}
.code-input {
	width: 120px;
	font-size: 1.25rem;
	font-family: 'SF Mono', 'Consolas', monospace;
	letter-spacing: 0.25rem;
	text-align: center;
	padding: 0.5rem 0.75rem;
	border: 2px solid #ddd;
	border-radius: 4px;
}
.code-input:focus {
	border-color: #219119;
	outline: none;
}
.code-error {
	color: #dc3545;
	font-size: 0.875rem;
	margin-bottom: 0.75rem;
	padding: 0.5rem;
	background: #fff5f5;
	border-radius: 4px;
}

/* Person Selection List (onboard.php) */
.person-select-list {
	display: flex;
	flex-direction: column;
	gap: 0.75rem;
	margin: 1rem 0;
}
.person-option {
	display: flex;
	align-items: flex-start;
	cursor: pointer;
}
.person-option input[type="radio"] {
	margin: 0.25rem 0.5rem 0 0;
	flex-shrink: 0;
}
.person-name {
	font-style: normal;
}
.person-login-info {
	font-style: normal;
	color: #666;
	font-size: 0.875rem;
	margin-left: 0.5rem;
}

/* Manual Date Toggle */
.manual-toggle {
	font-size: 0.75rem;
	font-weight: normal;
	color: #666;
	cursor: pointer;
	display: inline-flex;
	align-items: center;
	gap: 0.25rem;
	margin-left: auto;
}
.manual-toggle input[type="checkbox"] {
	margin: 0;
	width: auto;
}

/* Family Choice Step */
.family-preview {
	background: #f8f9fa;
	border: 1px solid #e9ecef;
	border-radius: 6px;
	padding: 1rem;
	margin: 1rem 0;
}
.family-preview h4 {
	font-size: 0.875rem;
	color: #666;
	margin-bottom: 0.5rem;
}
.family-preview ul {
	list-style: none;
	padding: 0;
	margin: 0;
}
.family-preview li {
	padding: 0.375rem 0;
	font-size: 0.9375rem;
	color: #333;
}
.family-preview li i {
	width: 1.25rem;
	color: #219119;
	margin-right: 0.5rem;
}
.family-choice-buttons {
	flex-direction: column;
	gap: 0.75rem;
}
.family-choice-buttons .button {
	width: 100%;
	justify-content: center;
}
.button-secondary {
	background: #6c757d;
}
.button-secondary:hover {
	background: #5a6268;
}

/* Mobile adjustments */
@media (max-width: 480px) {
	.event-banner {
		margin-left: -1rem;
		margin-right: -1rem;
		border-radius: 0;
		max-width: none;
	}
	.login-box {
		padding: 1rem;
	}
	.check-email-message > i {
		font-size: 3rem;
	}
}
