/* WPeMatico RSS Feed Reader — frontend layouts */

.wpe_rss-feed .wpe_rss-item {
	margin-bottom: 1.5em;
}
.wpe_rss-feed .wpe_rss-title h2,
.wpe_rss-feed .wpe_rss-title h3 {
	margin: 0 0 .3em;
}
.wpe_rss-feed .wpe_rss-metadata {
	font-size: .85em;
	opacity: .7;
	margin-bottom: .5em;
}
.wpe_rss-feed .wpe_rss-thumb img {
	display: block;
	width: 100%;
	height: auto;
}
/* Hide broken thumbnails when a feed item has no image. */
.wpe_rss-feed .wpe_rss-thumb img[src=""] {
	display: none;
}

/* Grid */
.wpe_rss-layout-grid {
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: 24px;
}
.wpe_rss-layout-grid .wpe_rss-item {
	margin-bottom: 0;
}
.wpe_rss-layout-grid .wpe_rss-thumb {
	margin-bottom: .6em;
}

/* Excerpt & Thumbnail */
.wpe_rss-layout-excerpt_thumbnail .wpe_rss-item {
	display: flex;
	gap: 18px;
	align-items: flex-start;
}
.wpe_rss-layout-excerpt_thumbnail .wpe_rss-thumb {
	flex: 0 0 220px;
}
.wpe_rss-layout-excerpt_thumbnail .wpe_rss-body {
	flex: 1 1 auto;
	min-width: 0;
}

/* Keep description images inside their column in any layout. */
.wpe_rss-feed .wpe_rss-description img {
	max-width: 100%;
	height: auto;
}

/* Grid and Excerpt & Thumbnail are compact card views: trim each item's
   description so full-content feeds don't create giant, uneven cards. The card
   already shows the item image as its thumbnail, so hide media embedded in the
   content that would otherwise blow the card height up. */
.wpe_rss-layout-grid .wpe_rss-description,
.wpe_rss-layout-excerpt_thumbnail .wpe_rss-description {
	display: -webkit-box;
	-webkit-box-orient: vertical;
	overflow: hidden;
}
.wpe_rss-layout-grid .wpe_rss-description {
	-webkit-line-clamp: 5;
	line-clamp: 5;
}
.wpe_rss-layout-excerpt_thumbnail .wpe_rss-description {
	-webkit-line-clamp: 4;
	line-clamp: 4;
}
.wpe_rss-layout-grid .wpe_rss-description img,
.wpe_rss-layout-grid .wpe_rss-description figure,
.wpe_rss-layout-grid .wpe_rss-description iframe,
.wpe_rss-layout-excerpt_thumbnail .wpe_rss-description img,
.wpe_rss-layout-excerpt_thumbnail .wpe_rss-description figure,
.wpe_rss-layout-excerpt_thumbnail .wpe_rss-description iframe {
	display: none;
}

@media (max-width: 782px) {
	.wpe_rss-layout-grid {
		grid-template-columns: 1fr;
	}
	.wpe_rss-layout-excerpt_thumbnail .wpe_rss-item {
		flex-direction: column;
	}
	.wpe_rss-layout-excerpt_thumbnail .wpe_rss-thumb {
		flex-basis: auto;
		width: 100%;
	}
}

/* The presets always print the <img>, so an item with no image needs its thumb hidden.
   The second rule is the fallback where :has() is unsupported. */
.wpe_rss-thumb:has(img[src=""]),
.wpe_rss-thumb:has(img:not([src])) {
	display: none;
}
.wpe_rss-thumb img[src=""],
.wpe_rss-thumb img:not([src]) {
	display: none;
}
