/* ==========================================================================
   Evergreen Webinar — Registration Page
   ========================================================================== */

.ewp-reg-wrap {
	display: flex;
	justify-content: center;
	padding: 48px 20px;
	font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
}

.ewp-reg-card {
	width: 100%;
	/* --ewp-reg-max-width is set inline per-webinar (admin setting); falls
	   back to the original 460px if that's ever missing for any reason. */
	max-width: var(--ewp-reg-max-width, 460px);
	background: #fff;
	border-radius: 18px;
	box-shadow: 0 20px 50px -18px rgba(16, 18, 35, .25);
	overflow: hidden;
	border: 1px solid #eceef2;
}

.ewp-reg-visual {
	background: linear-gradient(135deg, #4f46e5 0%, #7c3aed 100%);
	color: #fff;
	padding: 36px 32px 30px;
}
.ewp-reg-eyebrow {
	display: inline-block;
	font-size: 11px;
	font-weight: 700;
	letter-spacing: 1.2px;
	text-transform: uppercase;
	background: rgba(255,255,255,.16);
	color: #ffffff !important;
	padding: 5px 10px;
	border-radius: 999px;
	margin-bottom: 14px;
}
.ewp-reg-title { font-size: 24px; font-weight: 700; line-height: 1.3; margin: 0 0 10px; color: #ffffff !important; }
.ewp-reg-meta { display: flex; align-items: center; gap: 6px; font-size: 13px; color: #ffffff !important; opacity: .9; margin: 0 0 10px; }
.ewp-reg-sub { font-size: 14px; color: #ffffff !important; opacity: .9; margin: 0; line-height: 1.5; }

.ewp-registration-form { padding: 30px 32px 32px; }
.ewp-field { margin-bottom: 18px; }

/* Honeypot: positioned off-screen rather than display:none, since some
   bots specifically skip (or specifically target) display:none fields. */
.ewp-hp-field {
	position: absolute;
	left: -9999px;
	top: -9999px;
	width: 1px;
	height: 1px;
	overflow: hidden;
	opacity: 0;
	pointer-events: none;
}
.ewp-field label {
	display: block;
	margin-bottom: 6px;
	font-weight: 600;
	font-size: 13px;
	color: #374151;
}
.ewp-field input {
	width: 100%;
	padding: 12px 14px;
	border: 1.5px solid #e5e7eb;
	border-radius: 10px;
	box-sizing: border-box;
	font-size: 14px;
	transition: border-color .15s ease, box-shadow .15s ease;
}
.ewp-field input:focus {
	outline: none;
	border-color: #4f46e5;
	box-shadow: 0 0 0 3px rgba(79, 70, 229, .12);
}

.ewp-submit-btn {
	width: 100%;
	padding: 14px;
	background: linear-gradient(135deg, #4f46e5, #4338ca);
	color: #fff;
	border: none;
	border-radius: 10px;
	font-weight: 700;
	font-size: 15px;
	cursor: pointer;
	transition: transform .15s ease, box-shadow .15s ease;
	box-shadow: 0 8px 20px -8px rgba(79, 70, 229, .6);
}
.ewp-submit-btn:hover { transform: translateY(-1px); }
.ewp-submit-btn:disabled { opacity: .7; cursor: default; transform: none; }

.ewp-form-message { color: #dc2626; font-size: 13px; margin-top: 12px; text-align: center; }
.ewp-reg-privacy { text-align: center; font-size: 11.5px; color: #9ca3af; margin-top: 14px; margin-bottom: 0; }

@media (max-width: 480px) {
	.ewp-reg-wrap { padding: 24px 14px; }
	.ewp-reg-visual, .ewp-registration-form { padding-left: 22px; padding-right: 22px; }
	.ewp-reg-title { font-size: 21px; }
}

/* ---------- Fallback content when the shortcode has no webinar attached ---------- */
.ewp-reg-admin-notice {
	max-width: 520px;
	margin: 40px auto;
	padding: 16px 18px;
	background: #fffbeb;
	border: 1px solid #fde68a;
	border-radius: 10px;
	font-size: 14px;
	line-height: 1.6;
}
.ewp-reg-admin-notice p { margin: 0 0 6px; }
.ewp-reg-admin-notice p:last-child { margin-bottom: 0; }
.ewp-reg-fallback-list {
	max-width: 520px;
	margin: 24px auto;
	padding: 20px;
	background: #fff;
	border: 1px solid #e5e7eb;
	border-radius: 10px;
}
.ewp-reg-fallback-list p { margin: 0 0 10px; font-weight: 600; }
.ewp-reg-fallback-list ul { margin: 0; padding: 0; list-style: none; }
.ewp-reg-fallback-list li { margin-bottom: 8px; }
.ewp-reg-fallback-list a {
	display: block;
	padding: 10px 14px;
	border-radius: 8px;
	background: #f9fafb;
	color: #4f46e5;
	text-decoration: none;
	font-weight: 600;
}
.ewp-reg-fallback-list a:hover { background: #eef2ff; }
