/**
 * EM News — stili frontend.
 *
 * Regola di progetto: tutto ciò che può stare inline sta inline nei partial
 * (pattern anti-Elementor). Qui resta solo ciò che inline non può fare:
 * griglia responsive, stati hover, pseudo-elementi, troncamento righe.
 * Un solo !important in tutto il file, documentato dove compare.
 */

.em-news {
	container-type: inline-size;
	container-name: emnews;
}

/* ------------------------------------------------------------------
   Griglia
   ------------------------------------------------------------------ */

.em-news .em-news__grid {
	list-style: none;
	margin: 0;
	padding: 0;
}

.em-news .em-news__grid--cols {
	grid-template-columns: repeat(var(--em-news-cols, 4), minmax(0, 1fr));
}

.em-news .em-news__grid--auto {
	grid-template-columns: repeat(auto-fill, minmax(var(--em-news-card-min, 260px), 1fr));
}

.em-news .em-news__grid--lista {
	grid-template-columns: 1fr;
	gap: 0;
}

@container emnews (max-width: 1024px) {
	.em-news .em-news__grid--cols {
		grid-template-columns: repeat(var(--em-news-cols-tablet, 2), minmax(0, 1fr));
	}
}

@container emnews (max-width: 700px) {
	.em-news .em-news__grid--cols {
		grid-template-columns: repeat(var(--em-news-cols-mobile, 1), minmax(0, 1fr));
	}
	.em-news .em-news__grid--auto { grid-template-columns: 1fr; }
}

/* Fallback per browser senza container queries. */
@supports not (container-type: inline-size) {
	@media (max-width: 1024px) {
		.em-news .em-news__grid--cols {
			grid-template-columns: repeat(var(--em-news-cols-tablet, 2), minmax(0, 1fr));
		}
	}
	@media (max-width: 767px) {
		.em-news .em-news__grid--cols {
			grid-template-columns: repeat(var(--em-news-cols-mobile, 1), minmax(0, 1fr));
		}
		.em-news .em-news__grid--auto { grid-template-columns: 1fr; }
	}
}

/* ------------------------------------------------------------------
   Card
   ------------------------------------------------------------------ */

.em-news .em-news__card {
	transition: box-shadow .25s ease, transform .25s ease;
}

.em-news .em-news__img {
	position: absolute;
	inset: 0;
	width: 100%;
	height: 100%;
	object-fit: cover;
	transition: transform .45s ease;
}

.em-news .em-news__card--lista { border-radius: 0; box-shadow: none; }

.em-news--hover-lift .em-news__card:not(.em-news__card--lista):hover,
.em-news--hover-both .em-news__card:not(.em-news__card--lista):hover {
	transform: translateY(-4px);
	box-shadow: var(--em-news-shadow-hover, 0 4px 10px rgba(0, 0, 0, .06), 0 16px 40px rgba(0, 0, 0, .10));
}

.em-news--hover-zoom .em-news__card:hover {
	box-shadow: var(--em-news-shadow-hover, 0 4px 10px rgba(0, 0, 0, .06), 0 16px 40px rgba(0, 0, 0, .10));
}

.em-news--hover-zoom .em-news__card:hover .em-news__img,
.em-news--hover-both .em-news__card:hover .em-news__img {
	transform: scale(var(--em-news-zoom, 1.045));
}

.em-news .em-news__title a { transition: color .2s ease; }
.em-news .em-news__title a:hover { color: var(--em-news-accent, #E53935); }
.em-news .em-news__title a:focus-visible {
	outline: 2px solid var(--em-news-accent, #E53935);
	outline-offset: 3px;
	border-radius: 2px;
}

/* Filetto sopra la data: non replicabile inline. */
.em-news .em-news__card:not(.em-news__card--lista) .em-news__foot::before {
	content: "";
	display: block;
	height: 1px;
	background: var(--em-news-divider, rgba(0, 0, 0, .07));
	margin-bottom: 12px;
}

.em-news .em-news__card.is-new { animation: em-news-in .32s ease both; }

@keyframes em-news-in {
	from { opacity: 0; transform: translateY(10px); }
	to   { opacity: 1; transform: none; }
}

/* ------------------------------------------------------------------
   Strumenti: ricerca e filtri
   ------------------------------------------------------------------ */

.em-news .em-news__search::placeholder { color: #a8a29c; }
.em-news .em-news__search:focus {
	outline: 2px solid var(--em-news-accent, #E53935);
	outline-offset: 1px;
	border-color: transparent;
}

.em-news .em-news__chip {
	transition: background .18s ease, color .18s ease, border-color .18s ease;
}
.em-news .em-news__chip:hover {
	border-color: var(--em-news-accent, #E53935);
	color: var(--em-news-accent, #E53935);
}
.em-news .em-news__chip[aria-pressed="true"] {
	background: var(--em-news-accent, #E53935);
	border-color: var(--em-news-accent, #E53935);
	color: #fff;
}
.em-news .em-news__chip:focus-visible {
	outline: 2px solid var(--em-news-title-color, #16213E);
	outline-offset: 2px;
}

/* ------------------------------------------------------------------
   Carica altro e paginazione
   ------------------------------------------------------------------ */

.em-news .em-news__btn { transition: background .22s ease, color .22s ease; }
.em-news .em-news__btn:hover {
	background: var(--em-news-accent, #E53935);
	color: #fff;
}
.em-news .em-news__btn:focus-visible {
	outline: 2px solid var(--em-news-title-color, #16213E);
	outline-offset: 3px;
}
.em-news .em-news__btn[aria-busy="true"] { opacity: .55; pointer-events: none; }

.em-news .em-news__pager .page-numbers {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-width: 42px;
	height: 42px;
	padding: 0 12px;
	border-radius: 8px;
	border: 1px solid rgba(0, 0, 0, .10);
	background: #fff;
	color: var(--em-news-title-color, #16213E);
	text-decoration: none;
	font-size: 14.5px;
	transition: border-color .18s ease, color .18s ease;
}
.em-news .em-news__pager .page-numbers:hover {
	border-color: var(--em-news-accent, #E53935);
	color: var(--em-news-accent, #E53935);
}
.em-news .em-news__pager .page-numbers.current {
	background: var(--em-news-accent, #E53935);
	border-color: var(--em-news-accent, #E53935);
	color: #fff;
}
.em-news .em-news__pager .page-numbers.dots { border-color: transparent; }

.em-news .em-news__error {
	margin: 18px auto 0;
	max-width: 460px;
	text-align: center;
	font-size: 14.5px;
	color: #a3312d;
}

/* ------------------------------------------------------------------
   Lista orizzontale (sidebar)
   ------------------------------------------------------------------ */

.em-news__hlist .em-news__hitem:last-child { border-bottom: 0; }
.em-news__hlist .em-news__hthumb .em-news__img {
	position: absolute;
	inset: 0;
	width: 100%;
	height: 100%;
	object-fit: cover;
}
.em-news__hlist .em-news__htitle {
	display: -webkit-box;
	-webkit-line-clamp: 3;
	line-clamp: 3;
	-webkit-box-orient: vertical;
	overflow: hidden;
}
.em-news__hlist .em-news__htitle a { transition: color .2s ease; }
.em-news__hlist .em-news__htitle a:hover { color: var(--em-news-accent, #E53935); }

/* ------------------------------------------------------------------
   Livello opzionale: uniforma gli altri widget della sidebar
   ------------------------------------------------------------------ */

.em-news-widget-style { margin-bottom: 34px; }

.em-news-widget-style .widget-title,
.em-news-widget-style .widgettitle,
.em-news-widget-style h2,
.em-news-widget-style h3 {
	font-size: 16px;
	font-weight: 600;
	margin: 0 0 4px;
	padding-bottom: 12px;
	border-bottom: 2px solid var(--em-news-accent, #E53935);
	color: var(--em-news-title-color, #16213E);
}

.em-news-widget-style ul:not(.em-news__hlist) {
	list-style: none;
	margin: 0;
	padding: 0;
}
.em-news-widget-style ul:not(.em-news__hlist) > li {
	border-bottom: 1px solid var(--em-news-divider, rgba(0, 0, 0, .07));
	padding: 0;
}
.em-news-widget-style ul:not(.em-news__hlist) > li:last-child { border-bottom: 0; }
.em-news-widget-style ul:not(.em-news__hlist) > li > a {
	display: inline-block;
	padding: 12px 0;
	font-size: 14.5px;
	color: var(--em-news-title-color, #16213E);
	text-decoration: none;
	transition: color .2s ease;
}
.em-news-widget-style ul:not(.em-news__hlist) > li > a:hover {
	color: var(--em-news-accent, #E53935);
}
.em-news-widget-style ul:not(.em-news__hlist) .children,
.em-news-widget-style ul:not(.em-news__hlist) .sub-menu {
	padding-left: 14px;
	border-top: 1px solid var(--em-news-divider, rgba(0, 0, 0, .07));
}

.em-news-widget-style .tagcloud { display: flex; flex-wrap: wrap; gap: 8px; padding-top: 14px; }
/*
 * Unica eccezione a !important in tutto il plugin: wp_tag_cloud() scrive la
 * dimensione del testo come attributo style inline su ogni link, e senza
 * !important i tag uscirebbero di misure diverse dentro le pillole.
 */
.em-news-widget-style .tagcloud a {
	font-size: 13px !important;
	padding: 6px 13px;
	border-radius: 999px;
	border: 1px solid rgba(0, 0, 0, .12);
	color: #5a5550;
	text-decoration: none;
	transition: border-color .18s ease, color .18s ease;
}
.em-news-widget-style .tagcloud a:hover {
	border-color: var(--em-news-accent, #E53935);
	color: var(--em-news-accent, #E53935);
}

.em-news-widget-style .search-field,
.em-news-widget-style input[type="search"],
.em-news-widget-style input[type="text"] {
	border: 1px solid rgba(0, 0, 0, .12);
	border-radius: 8px;
	padding: 11px 14px;
	font-size: 14px;
	width: 100%;
}
.em-news-widget-style .search-submit,
.em-news-widget-style button[type="submit"] {
	border: 0;
	border-radius: 8px;
	padding: 11px 16px;
	background: var(--em-news-accent, #E53935);
	color: #fff;
	font-size: 14px;
	cursor: pointer;
}

/* ------------------------------------------------------------------
   Preferenze di movimento
   ------------------------------------------------------------------ */

@media (prefers-reduced-motion: reduce) {
	.em-news .em-news__card,
	.em-news .em-news__img,
	.em-news .em-news__btn,
	.em-news .em-news__chip { transition: none; }
	.em-news .em-news__card.is-new { animation: none; }
	.em-news--hover-lift .em-news__card:hover,
	.em-news--hover-both .em-news__card:hover { transform: none; }
	.em-news--hover-zoom .em-news__card:hover .em-news__img,
	.em-news--hover-both .em-news__card:hover .em-news__img { transform: none; }
}
