/**
 * Supremo Maps — stili del front-end.
 *
 * Volutamente scarni: il plugin gira dentro temi che non conosce, e più
 * decisioni visive prende, più litiga con loro. Qui c'è solo ciò che serve
 * perché la mappa funzioni e il testo sia leggibile.
 *
 * @package SupremoMaps
 */

.supremo-map {
	margin: 0 0 1.5rem;
}

.supremo-map__canvas {
	width: 100%;
	/* L'altezza arriva inline dallo shortcode: è l'unico modo per farla
	   decidere a chi inserisce la mappa senza generare una classe per valore. */
	min-height: 200px;
	border-radius: 12px;
	/* Leaflet disegna tile e controlli oltre il raggio degli angoli: senza
	   questo gli angoli arrotondati non si vedrebbero. */
	overflow: hidden;
	background: #e9ecef;
	z-index: 0;
}

/* Testo riservato agli screen reader: nasconderlo con display:none lo
   toglierebbe anche a loro. */
.supremo-map__sr-only {
	position: absolute;
	width: 1px;
	height: 1px;
	padding: 0;
	margin: -1px;
	overflow: hidden;
	clip: rect(0 0 0 0);
	white-space: nowrap;
	border: 0;
}

/* ── Popup ─────────────────────────────────────────────────────────────── */

.supremo-map__popup {
	display: flex;
	flex-direction: column;
	gap: .25rem;
	font-size: .9375rem;
	line-height: 1.45;
}

.supremo-map__popup-title {
	font-size: 1rem;
	font-weight: 700;
}

.supremo-map__popup-address,
.supremo-map__popup-descr {
	color: #4b5563;
}

.supremo-map__popup-link {
	margin-top: .25rem;
	font-weight: 600;
	text-underline-offset: 2px;
}

/* ── Elenco testuale ───────────────────────────────────────────────────── */

.supremo-map__list {
	margin: 1rem 0 0;
	padding: 0;
	list-style: none;
	display: grid;
	gap: .75rem;
}

.supremo-map__list-item {
	display: flex;
	flex-direction: column;
	gap: .125rem;
	padding: .75rem 1rem;
	border: 1px solid #e5e7eb;
	border-radius: 8px;
}

.supremo-map__list-title {
	font-weight: 700;
}

.supremo-map__list-address,
.supremo-map__list-descr {
	color: #4b5563;
	font-size: .9375rem;
}

.supremo-map__list-link {
	margin-top: .25rem;
	font-weight: 600;
	align-self: flex-start;
	text-underline-offset: 2px;
}

.supremo-map__notice {
	padding: .75rem 1rem;
	border-left: 4px solid #d63638;
	background: #fcf0f1;
	font-size: .9375rem;
}

@media (min-width: 640px) {
	.supremo-map__list {
		grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
	}
}
