/* ---------------------------------------------------------------------------
   Mobile-Banner zwischen den News (serverseitig via s:banners)
   Slots werden im News-Template an jeder 2. Position gerendert,
   sind aber nur auf Mobile sichtbar.
   --------------------------------------------------------------------------- */

/* Auf Desktop ausgeblendet - dort stehen die Banner in der linken Spalte */
.news-banner-mobile,
.news-banner-mobile-row {
	display: none;
}

@media only screen and (max-width: 1160px) {

	/* Slot-Reihe: bis zu 3 Banner nebeneinander */
	.news-banner-mobile-row {
		display: flex;
		gap: 10px;
		justify-content: center;
		align-items: flex-start;
		margin: 15px 0;
		clear: both;
	}

	/* Inline-Banner zwischen den News einblenden */
	.news-banner-mobile {
		display: block;
		margin: 15px 0;
		text-align: center;
		clear: both;
	}

	/* Banner innerhalb einer Reihe: Abstand uebernimmt die Reihe,
	   bei schmalen Screens duerfen die Banner schrumpfen */
	.news-banner-mobile-row .news-banner-mobile {
		margin: 0;
		clear: none;
		flex: 0 1 auto;
		min-width: 0;
	}

	.news-banner-mobile .banner {
		display: inline-block;
		max-width: 100%;
		margin: 0 auto;
	}

	.news-banner-mobile .banner img {
		max-width: 100%;
		height: auto;
	}

	/* Doppelung vermeiden: die linke Banner-Spalte auf Mobile ausblenden,
	   da diese Banner jetzt zwischen den News erscheinen.
	   (Nur .banner-left; Menue/Promo bei Bedarf separat behandeln.) */
	.banner-left {
		display: none;
	}
}
