/* Calendar-only metrics. Keep the home event strip and content dialogs unchanged. */
.ej-community-events .ej-event-grid {
	--ej-calendar-gap: 16px;
	--ej-calendar-body-padding: 20.8px; /* Existing 26px inset at 80%. */
	/* Three cards at 80% of their former width, with both original gaps retained. */
	width: calc(80% + var(--ej-calendar-gap) * .4);
	margin-inline: auto;
	display: grid;
	grid-template-columns: repeat(3, minmax(0, 1fr));
	gap: var(--ej-calendar-gap);
	align-items: start;
}

.ej-community-events .ej-event-grid > .ej-event-card {
	min-width: 0;
}

.ej-community-events .ej-event-grid .ej-content-card__body {
	padding: var(--ej-calendar-body-padding);
	overflow-wrap: break-word;
}

@media (max-width: 980px) {
	.ej-community-events .ej-event-grid {
		width: 100%;
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}

	/* Keep text comfortably wide; reduce the former 4:3 image height by 20%. */
	.ej-community-events .ej-event-grid .ej-content-card__media {
		aspect-ratio: 5 / 3;
	}
}

@media (max-width: 640px) {
	.ej-community-events .ej-event-grid {
		/* Retain the existing mobile swipe list and its original card widths. */
		display: flex;
		overflow-x: auto;
		scroll-snap-type: x mandatory;
		padding-bottom: 14px;
	}
}