/* OTR base styles for the unified event page.
 * Only targets OTR-specific markup to avoid bleeding into the rest of the theme.
 */

.page-template-page-otr-event .otr-event-shell {
	font-family: var(--otr-font-family-sans);
	color: var(--otr-text-primary);
	background: var(--otr-surface-bg-alt);
	font-size: var(--otr-font-size-body);
	line-height: var(--otr-line-height-body);
}

/* GeneratePress layout: the OTR event page includes its own sidebar.
 * Ensure the theme sidebar does not consume horizontal space.
 */
.page-template-page-otr-event .widget-area {
	display: none;
}

.page-template-page-otr-event .content-area,
.page-template-default .content-area,
.error404 .content-area {
	width: 100%;
	float: none;
    flex: 0 0 100%;
}

/* Make the light-grey background visible behind the full-bleed OTR shell. */
.page-template-page-otr-event .site-content,
.page-template-page-otr-event.separate-containers .inside-article {
	background: var(--otr-surface-bg-alt);
}

/* GeneratePress adds container padding around article/content.
 * The Figma layout uses full-bleed sections (video, overview block, interactions).
 */
.page-template-page-otr-event .inside-article,
.page-template-page-otr-event .entry-content {
	padding: 0;
}

.page-template-page-otr-event .entry-content {
	margin: 0;
}

.page-template-page-otr-event .otr-video {
	margin-bottom: 0;
	padding-bottom: 56.25%; /* 16:9 aspect ratio */
	position: relative;
}

.page-template-page-otr-event .otr-video iframe,
.page-template-page-otr-event .otr-video video {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	object-fit: cover;
}

.page-template-page-otr-event .otr-video__fallback {
	margin: 0;
	color: var(--otr-text-secondary);
	font-size: var(--otr-font-size-meta);
	line-height: var(--otr-line-height-meta);
}

.page-template-page-otr-event .otr-h1 {
	font-size: var(--otr-font-size-h1);
	line-height: var(--otr-line-height-h1);
	font-weight: var(--otr-font-weight-bold);
	margin: 0 0 var(--otr-space-4);
}

.page-template-page-otr-event .otr-h2 {
	font-size: var(--otr-font-size-h2);
	line-height: var(--otr-line-height-h2);
	font-weight: var(--otr-font-weight-bold);
	margin: 0 0 var(--otr-space-3);
}

.page-template-page-otr-event .otr-h3 {
	font-size: var(--otr-font-size-h3);
	line-height: var(--otr-line-height-h3);
	font-weight: var(--otr-font-weight-bold);
	margin: 0 0 var(--otr-space-3);
}

.page-template-page-otr-event .otr-h4 {
	font-size: var(--otr-font-size-h4);
	line-height: var(--otr-line-height-h4);
	font-weight: var(--otr-font-weight-bold);
	margin: 0 0 var(--otr-space-3);
}

.page-template-page-otr-event .otr-meta {
	font-size: var(--otr-font-size-meta);
	line-height: var(--otr-line-height-meta);
	font-weight: var(--otr-font-weight-regular);
	color: var(--otr-text-tertiary);
}

.page-template-page-otr-event .otr-meta--sm {
	font-size: var(--otr-font-size-meta-sm);
	line-height: var(--otr-line-height-meta-sm);
	font-weight: var(--otr-font-weight-regular);
	color: var(--otr-text-tertiary);
}

body.um-page-login .um-field-checkbox,
body.um-page-password-reset .um-field-checkbox {
	margin-bottom: 25px;
}

body.um-page-login .entry-title,
body.um-page-password-reset .entry-title {
	font-size: var(--otr-font-size-h3);
	line-height: var(--otr-line-height-h3);
	font-weight: var(--otr-font-weight-bold);
}

body.um-page-login .entry-content,
body.um-page-password-reset .entry-content {
	margin-top: 0;
}

@media (min-width: 768px) {
	.site {
		padding-top: 15px;
	}

	body.um-page-login .entry-title,
	body.um-page-password-reset .entry-title {
		text-align: center;
	}
}