/*
 * Privatbüro Plus: Terminliste (Modern Events Calendar, Listenansicht „classic“, z. B. /termine).
 * Wird auf Seiten mit [MEC]-Shortcode geladen, siehe wp-content/novamira-sandbox/pbp-termine-liste.php.
 * Desktop bleibt wie von MEC vorgegeben; auf dem Handy ein festes Raster:
 *   Bild | Datum  Uhrzeit
 *   Bild | Titel
 *   Bild | Ort
 */

@media (max-width: 767px) {
	.mec-wrap .mec-event-list-classic .mec-event-article {
		display: grid;
		grid-template-columns: 72px max-content minmax(0, 1fr);
		column-gap: 14px;
		row-gap: 6px;
		align-items: start;
		padding: 16px 0;
		margin-bottom: 8px;
	}

	/* Clearfix-Pseudoelemente von MEC würden sonst zu Rasterzellen */
	.mec-wrap .mec-event-list-classic .mec-event-article::before,
	.mec-wrap .mec-event-list-classic .mec-event-article::after {
		display: none;
	}

	.mec-wrap .mec-event-list-classic .mec-event-image {
		grid-column: 1;
		grid-row: 1 / span 3;
		float: none;
		width: 72px;
		margin: 0;
	}

	.mec-wrap .mec-event-list-classic .mec-event-image img {
		display: block;
		width: 72px;
		height: 72px;
		object-fit: cover;
		border-radius: 8px;
	}

	.mec-wrap .mec-event-list-classic .mec-event-date,
	.mec-wrap .mec-event-list-classic .mec-event-time {
		grid-row: 1;
		display: flex;
		align-items: center;
		gap: 4px;
		margin: 0;
		font-size: 13px;
		line-height: 1.4;
		white-space: nowrap;
	}

	.mec-wrap .mec-event-list-classic .mec-event-date {
		grid-column: 2;
	}

	.mec-wrap .mec-event-list-classic .mec-event-time {
		grid-column: 3;
		min-width: 0;
	}

	.mec-wrap .mec-event-list-classic .mec-event-date i,
	.mec-wrap .mec-event-list-classic .mec-event-time i {
		margin: 0;
	}

	.mec-wrap .mec-event-list-classic .mec-event-time .mec-time-details {
		display: inline;
	}

	/* Titel: normale Schreibweise, lange Wörter trennen statt abschneiden */
	.mec-wrap .mec-event-list-classic .mec-event-title {
		grid-column: 2 / -1;
		grid-row: 2;
		margin: 2px 0 0;
		/* Avada (responsive Typografie) und ein Inline-Stil setzen 22px !important; auf dem Handy kleiner, damit weniger getrennt wird */
		font-size: 19px !important;
		line-height: 1.25 !important;
		letter-spacing: 0;
		text-transform: none;
		-webkit-hyphens: auto;
		hyphens: auto;
		hyphenate-limit-chars: 8 3 3;
		overflow-wrap: break-word;
		text-wrap: pretty;
	}

	.mec-wrap .mec-event-list-classic .mec-event-title a {
		text-transform: none;
	}

	/* Ort: linksbündig unter dem Titel statt rechts schwebend */
	.mec-wrap .mec-event-list-classic .mec-event-detail {
		grid-column: 2 / -1;
		grid-row: 3;
		float: none;
		width: auto;
		margin: 0;
		overflow: visible;
		text-align: left;
	}

	.mec-wrap .mec-event-list-classic .mec-event-loc-place {
		display: flex;
		align-items: baseline;
		gap: 6px;
		margin: 0;
		font-size: 14px;
		line-height: 1.4;
		text-align: left;
	}

	.mec-wrap .mec-event-list-classic .mec-event-loc-place i {
		flex: none;
		margin: 0;
	}
}
