.dts-epr-context {
	width: 100%;
}

/*
 * EventPrime's Performer and Organizer single templates do not use the same
 * wrapper structure. The performer hook is rendered inside .ep-box-wrap,
 * which adds 15px horizontal padding, while the organizer hook is rendered
 * outside that padded wrapper. Compensate only on Artist pages so both DTS
 * context lists occupy the exact same content width.
 */
.emagic .ep-box-wrap.ep-view-container > .dts-epr-context--artist {
	--dts-epr-ep-gutter: 15px;
	margin-left: calc(-1 * var(--dts-epr-ep-gutter));
	margin-right: calc(-1 * var(--dts-epr-ep-gutter));
	width: calc(100% + (2 * var(--dts-epr-ep-gutter)));
}

/* Keep the replacement section clearly separated from the EventPrime profile
   card. Program pages control their own Elementor spacing. */
.dts-epr-context--artist,
.dts-epr-context--scene,
body.dts-epr-event-type-context .dts-epr-context--program {
	margin-top: clamp(58px, 5vw, 72px);
}

/* Base section heading, also used by the standalone Program Elementor widget. */
.dts-epr-context__title {
	color: var(--theme-color-title, #111);
	font-family: var(--theme-font-h5_font-family, Montserrat, sans-serif);
	font-size: var(--theme-font-h5_font-size, 23px);
	font-weight: var(--theme-font-h5_font-weight, 700);
	font-style: var(--theme-font-h5_font-style, normal);
	line-height: var(--theme-font-h5_line-height, 1.2174em);
	letter-spacing: var(--theme-font-h5_letter-spacing, 0);
	text-transform: var(--theme-font-h5_text-transform, none);
	margin: 0 0 clamp(28px, 2.5vw, 36px);
}

/*
 * EventPrime applies `body .emagic h1...h6` with greater specificity than the
 * stable DTS list rules. Use a context-specific selector to prevent that
 * generic typography reset from changing the DTS heading metrics.
 */
body .emagic .dts-epr-context .dts-epr-context__title {
	color: var(--theme-color-title, #111);
	font-family: var(--theme-font-h5_font-family, Montserrat, sans-serif);
	font-size: var(--theme-font-h5_font-size, 23px);
	font-weight: var(--theme-font-h5_font-weight, 700);
	font-style: var(--theme-font-h5_font-style, normal);
	line-height: var(--theme-font-h5_line-height, 1.2174em);
	letter-spacing: var(--theme-font-h5_letter-spacing, 0);
	text-transform: var(--theme-font-h5_text-transform, none);
	margin: 0 0 clamp(28px, 2.5vw, 36px);
}

/*
 * The rows keep the untouched stable homepage widget markup and widget.css.
 * EventPrime's generic `body .emagic h3 { font-weight:500; ... }` otherwise
 * wins the cascade on Artist/Scene pages. Reassert only the exact stable h3
 * metrics here, with enough specificity to neutralize EventPrime's reset.
 */
body .emagic .dts-epr-context .dts-epr-widget__details h3 {
	font-size: clamp(23px, 1.9vw, 31px);
	font-weight: 650;
	font-style: normal;
	line-height: 1.2;
	margin: 0 0 13px;
	overflow: visible;
	white-space: normal;
}

/*
 * Program pages render the shared rows inside Elementor rather than inside
 * EventPrime's .emagic wrapper. BoxOffice defines its normal h3 weight as
 * 700 and Elementor/page CSS may therefore win in that context depending on
 * load order. Lock only the Program widget titles to the exact stable DTS
 * list value used by widget.css. The anchor is included so neither theme nor
 * Elementor link typography can make it appear heavier.
 */
body .elementor .dts-epr-context--program .dts-epr-widget__details h3,
body .elementor .dts-epr-context--program .dts-epr-widget__details h3 a {
	font-weight: 650;
}

.dts-epr-context__empty,
.dts-epr-context__notice {
	border-block: 1px solid rgba(17, 17, 17, .18);
	color: var(--theme-color-text, #666);
	margin: 0;
	padding: 40px 0;
}

.dts-epr-context__more-wrap {
	display: flex;
	justify-content: center;
	padding-top: clamp(28px, 3vw, 36px);
}

/* No independent visual skin: retain the native BoxOffice/Elementor button. */
.dts-epr-context__more[disabled] {
	cursor: wait;
	opacity: .55;
}

@media (max-width: 767px) {
	.dts-epr-context--artist,
	.dts-epr-context--scene,
	body.dts-epr-event-type-context .dts-epr-context--program {
		margin-top: 42px;
	}

	.dts-epr-context__title {
		font-size: 20px;
		margin-bottom: 26px;
	}

	body .emagic .dts-epr-context .dts-epr-context__title {
		font-size: 20px;
		margin-bottom: 26px;
	}

	body .emagic .dts-epr-context .dts-epr-widget__details h3 {
		font-size: 21px;
		margin-bottom: 10px;
	}

	.dts-epr-context__more-wrap {
		padding-top: 26px;
	}
}