/**
 * Stili della sezione Eventi (plugin The Events Calendar, viste V2).
 * Enqueue condizionale in inc/assets.php: caricato SOLO su archivio/singolo
 * eventi, mai altrove. Strategia: mappare le custom property `--tec-*` del
 * plugin sui token del tema (theme.json) + un set mirato di regole per
 * avvicinare le viste al design. Gli override dei template PHP vivono in
 * theme/tribe/events/.
 *
 * Palette di progetto: accent plum + highlight rosa (come news/donazioni),
 * NON il verde del mockup (design-reference, superato).
 */

/* ============================================================
   1. Testata scura "Prossimi eventi" (override default-template.php)
   Coerente con .cmt-blog-head / cmt/page-head; full-bleed (figlia diretta
   di .site-main, che è full width) e a filo header.
   ============================================================ */

.cmt-events-head {
	display: flex;
	align-items: center;
	min-height: clamp(220px, 26vw, 320px);
	background: var(--wp--preset--color--inverse);
	padding-block: var(--wp--preset--spacing--l);
	text-align: center;
}

.cmt-events-head > .cmt-container {
	width: 100%;
}

.cmt-events-head__eyebrow {
	margin: 0 0 var(--wp--preset--spacing--xxs);
	color: var(--wp--preset--color--highlight);
	font-size: var(--wp--preset--font-size--small);
	font-weight: 700;
	letter-spacing: 0.12em;
	text-transform: uppercase;
}

.cmt-events-head__title {
	margin: 0;
	color: var(--wp--preset--color--base);
}

/* ============================================================
   2. Mappatura variabili TEC → token del tema
   ============================================================ */

.tribe-common.tribe-common {
	/* Font di sistema del tema (Nunito) come base di TEC. NB: valore REALE, non
	   `inherit`: TEC applica `font-family: var(--tec-font-family-sans-serif)` su
	   decine di elementi e con `inherit` ricadevano sul default "Helvetica Neue".
	   I titoli tornano al font heading via le regole dirette più sotto. */
	--tec-font-family-sans-serif: var(--wp--preset--font-family--system);
	--tec-font-family-base: var(--wp--preset--font-family--system);
	--tec-border-radius-default: var(--wp--custom--radius--medium);

	/* Accent / bottoni / stati attivi → plum */
	--tec-color-accent-primary: var(--wp--preset--color--accent);
	--tec-color-accent-primary-hover: var(--wp--preset--color--accent-dark);
	--tec-color-accent-primary-active: var(--wp--preset--color--accent-dark);
	--tec-color-accent-primary-background: var(--wp--preset--color--accent);
	--tec-color-button-primary: var(--wp--preset--color--accent);
	--tec-color-button-primary-hover: var(--wp--preset--color--accent-dark);
	--tec-color-button-primary-active: var(--wp--preset--color--accent-dark);
	--tec-color-accent-secondary: var(--wp--preset--color--accent);
	--tec-color-accent-secondary-hover: var(--wp--preset--color--accent-dark);

	/* Testo */
	--tec-color-text-primary: var(--wp--preset--color--contrast);
	--tec-color-text-primary-hover: var(--wp--preset--color--accent);
	--tec-color-text-secondary: var(--wp--preset--color--gray-600);
	--tec-color-text-events-title: var(--wp--preset--color--contrast);
	--tec-color-link-primary: var(--wp--preset--color--accent);
	--tec-color-link-accent: var(--wp--preset--color--accent);
	--tec-color-link-accent-hover: var(--wp--preset--color--accent-dark);

	/* Sfondi / bordi */
	--tec-color-background: var(--wp--preset--color--raised);
	--tec-color-background-secondary: var(--wp--preset--color--gray-100);
	--tec-color-border-default: var(--wp--preset--color--gray-300);
	--tec-color-border-secondary: var(--wp--preset--color--gray-300);
	--tec-color-border-tertiary: var(--wp--preset--color--gray-300);
}

.tribe-events-view {
	--tec-color-background-events: transparent;
	background-color: transparent;
}

/* Singolo evento: usa il template CLASSICO (non wrappato in .tribe-common),
   ma le sue meta/descrizione usano comunque var(--tec-font-family-sans-serif),
   che lì ricadrebbe sul default "Helvetica Neue". Ridichiariamo la variabile
   sul body single così l'intera pagina eredita il font del tema. */
.single-tribe_events {
	--tec-font-family-sans-serif: var(--wp--preset--font-family--system);
	--tec-font-family-base: var(--wp--preset--font-family--system);
}

/* Font del sito su TEC. Le variabili --tec-font-* impostate a `inherit` sopra
   non bastano: bottone, date e descrizioni ricadono comunque sullo stack di
   default del plugin ("Helvetica Neue"). Assegniamo quindi i font in modo
   diretto e con specificità sufficiente a battere le regole di TEC. */

/* Corpo: font di sistema del tema (Nunito). Il bottone porta due classi
   (.tribe-common-c-btn.tribe-events-c-search__button): le combino per battere
   la regola TEC `.tribe-common button.tribe-common-c-btn` (specificità 0,2,1). */
.tribe-common,
.tribe-events .tribe-events-c-search__button.tribe-common-c-btn,
.tribe-events input,
.tribe-events .tribe-events-calendar-list__event-datetime-wrapper,
.tribe-events .tribe-events-calendar-list__event-description,
.tribe-events .tribe-events-calendar-day__event-datetime-wrapper,
.tribe-events .tribe-events-calendar-day__event-description {
	font-family: var(--wp--preset--font-family--system);
}

/* Titoli evento: font heading del tema (Poppins). NB: il numero-giorno NON è
   qui — nel design usa il font-ui (Nunito), vedi la regola daynum in sezione 5. */
.tribe-events .tribe-events-calendar-list__event-title,
.tribe-events .tribe-events-calendar-day__event-title,
.tribe-events .tribe-events-calendar-month__calendar-event-title,
.tribe-common h1,
.tribe-common h2,
.tribe-common h3 {
	font-family: var(--wp--preset--font-family--heading);
}

/* ============================================================
   3. Ingombro: allinea il container TEC a .cmt-container del tema
   ============================================================ */

.tribe-events .tribe-common-l-container {
	max-width: var(--wp--style--global--wide-size, 1200px);
	padding-inline: var(--cmt-gutter);
	/* TEC applica un padding-top di 96px al container (regola più specifica della
	   nostra): sommato al margine della vista raddoppiava lo stacco dalla testata.
	   Il design vuole ~80px sopra la barra, garantiti dal solo margine della vista
	   qui sotto — !important per battere la specificità di TEC. */
	padding-block-start: 0 !important;
}

/* Respiro verticale della vista (le regole .site-main > * azzerano i margini). */
.site-main > .tribe-events-view {
	margin-block: var(--wp--preset--spacing--xl);
}

/* ============================================================
   4. Barra: ricerca (Trova eventi) + selettore viste (Elenco/Mese/Giorno)
   ============================================================ */

/* Bottone submit "Trova eventi": stessa identità di .cmt-button (accent plum,
   testo base, uppercase, pill). Colori applicati anche in direct-value oltre
   alle variabili --tec-*, così il fondo resta plum a prescindere dall'ordine
   di caricamento di TEC (che di default lo rende blu). */
.tribe-events .tribe-events-c-search__button,
.tribe-events .tribe-common-c-btn.tribe-events-c-search__button {
	background-color: var(--wp--preset--color--accent);
	color: var(--wp--preset--color--base);
	border: 0;
	border-radius: var(--wp--custom--radius--medium);
	font-weight: 700;
	letter-spacing: 0.09em;
	text-transform: uppercase;
	transition: background-color 0.2s ease;
}

.tribe-events .tribe-events-c-search__button:hover,
.tribe-events .tribe-events-c-search__button:focus,
.tribe-events .tribe-common-c-btn.tribe-events-c-search__button:hover,
.tribe-events .tribe-common-c-btn.tribe-events-c-search__button:focus {
	background-color: var(--wp--preset--color--accent-dark);
	color: var(--wp--preset--color--base);
}

/* Campo di ricerca: 16px come il design (TEC lo rende a 14px), testo scuro e
   placeholder muto dai token del tema. */
.tribe-events .tribe-common-form-control-text__input {
	font-size: 1rem !important; /* 16px */
	color: var(--wp--preset--color--contrast) !important;
}

.tribe-events .tribe-common-form-control-text__input::placeholder {
	color: var(--wp--preset--color--gray-600) !important;
	opacity: 1;
}

/* Selettore viste (Elenco/Mese/Giorno): etichette maiuscole spaziate; le viste
   inattive in grigio muto, l'attiva scura con underline accent pulito. */
.tribe-events .tribe-events-c-view-selector__list-item-link {
	color: var(--wp--preset--color--gray-600);
	font-size: 0.8125rem; /* 13px, come il design */
	font-weight: 700;
	letter-spacing: 0.08em; /* ~1px */
	text-transform: uppercase;
	text-decoration: none;
	box-shadow: none;
	/* Il link TEC ha border-radius: in stato focus/pressed l'outline `auto` lo
	   seguiva rendendo un box arrotondato scuro. Azzeriamo il raggio e la
	   selezione testo (le tab sono controlli, non testo selezionabile). */
	border-radius: 0;
	-webkit-user-select: none;
	user-select: none;
	transition: color 0.2s ease;
}

.tribe-events .tribe-events-c-view-selector__list-item-link:hover,
.tribe-events .tribe-events-c-view-selector__list-item-link:focus {
	color: var(--wp--preset--color--accent);
}

/* Focus da tastiera: outline accent pulito (rettangolare), non l'anello
   arrotondato di default; nessun indicatore al solo click del mouse. */
.tribe-events .tribe-events-c-view-selector__list-item-link:focus {
	outline: none;
}

.tribe-events .tribe-events-c-view-selector__list-item-link:focus-visible {
	outline: 2px solid var(--wp--preset--color--accent);
	outline-offset: 3px;
}

.tribe-events .tribe-events-c-view-selector__list-item--active .tribe-events-c-view-selector__list-item-link {
	color: var(--wp--preset--color--contrast);
	/* L'underline della vista attiva è l'::after nativo di TEC (barra dritta,
	   height:2px, width:100%), già plum via --tec-color-accent-secondary. NON
	   usare box-shadow inset qui: il link ha border-radius da TEC e la sua
	   ombra seguirebbe gli angoli arrotondati, rendendo una "U" curva. */
	box-shadow: none;
}

/* ============================================================
   4b. Top-bar: nav data (frecce), "Oggi", titolo/datepicker.
   Allineata alla navbar del design (frecce bordate 38x38, chip "Oggi" rosa,
   titolo font-ui 26px bold).
   ============================================================ */

/* Frecce prec./succ.: box quadrato bordato, caret scuro (design 38x38). */
.tribe-events .tribe-events-c-top-bar__nav-link {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 38px !important;
	height: 38px !important;
	border: 1px solid var(--wp--preset--color--gray-300) !important;
	border-radius: 0;
	color: var(--wp--preset--color--contrast) !important;
	transition: border-color 0.2s ease, color 0.2s ease;
}

.tribe-events .tribe-events-c-top-bar__nav-link:hover {
	border-color: var(--wp--preset--color--accent) !important;
	color: var(--wp--preset--color--accent) !important;
}

/* Caret più piccolo dentro il box: TEC lo rende alto 19px, sproporzionato nel
   riquadro 38x38. ~13px come il chevron del design (la larghezza scala da sé). */
.tribe-events .tribe-events-c-top-bar__nav-link-icon-svg {
	width: 8px !important; /* proporzionale all'altezza (aspetto ~11:19) */
	height: 13px !important;
}

/* "Oggi": chip rosa piena, testo bianco maiuscolo (non l'outline di TEC).
   !important perché le classi bottone di TEC (tribe-common-c-btn-border-small)
   restano più specifiche su fondo/bordo/peso. */
.tribe-events .tribe-events-c-top-bar__today-button {
	background-color: var(--wp--preset--color--highlight) !important;
	color: var(--wp--preset--color--base) !important;
	border: 0 !important;
	border-radius: 0 !important;
	font-size: 0.75rem !important; /* 12px */
	font-weight: 700 !important;
	letter-spacing: 0.08em; /* ~1px */
	text-transform: uppercase;
	padding: 9px 16px !important;
}

.tribe-events .tribe-events-c-top-bar__today-button:hover,
.tribe-events .tribe-events-c-top-bar__today-button:focus {
	background-color: var(--wp--preset--color--accent) !important;
	color: var(--wp--preset--color--base) !important;
}

/* Titolo/datepicker ("Prossimi eventi"): font-ui 26px bold del design,
   non l'h3 leggero di TEC. */
.tribe-events .tribe-events-c-top-bar__datepicker-button {
	font-size: 1.625rem !important; /* 26px */
	font-weight: 700;
	letter-spacing: -0.015em; /* ~-0.4px */
	color: var(--wp--preset--color--contrast);
}

/* ============================================================
   5. Vista Elenco: riga evento come il design (data | contenuto | immagine)
   ============================================================ */

.tribe-events-calendar-list__event-row {
	display: grid;
	grid-template-columns: 64px 1fr;
	gap: var(--wp--preset--spacing--m);
	align-items: start;
	padding-block: var(--wp--preset--spacing--m);
	border-block-end: 1px solid var(--wp--preset--color--gray-300);
}

/* Colonna data: giorno della settimana sopra, numero grande sotto */
.tribe-events-calendar-list__event-date-tag {
	display: flex;
	flex-direction: column;
	align-items: center;
	line-height: 1;
}

.tribe-events .tribe-events-calendar-list__event-date-tag-weekday {
	font-size: 0.8125rem; /* 13px */
	font-weight: 700;
	text-transform: uppercase;
	letter-spacing: 0.06em; /* ~0.8px */
	color: var(--wp--preset--color--gray-600);
}

/* Numero-giorno: font-ui del design (Nunito), 40px bold, molto stretto.
   Prefisso .tribe-events per battere la classe tipografica TEC (tribe-common-h*)
   sullo stesso elemento. */
.tribe-events .tribe-events-calendar-list__event-date-tag-daynum {
	font-size: clamp(2rem, 3.2vw, 2.5rem) !important; /* fino a 40px */
	line-height: 1.1;
	font-weight: 700;
	letter-spacing: -0.025em; /* ~-1px */
	color: var(--wp--preset--color--contrast);
}

/* Corpo evento: testo a sinistra, immagine a destra */
.tribe-events-calendar-list__event {
	display: grid;
	grid-template-columns: 1fr minmax(220px, 320px);
	gap: var(--wp--preset--spacing--m);
	align-items: start;
}

.tribe-events-calendar-list__event-featured-image-wrapper {
	order: 2;
	margin: 0;
}

/* L'immagine è cliccabile (override featured-image.php): il link è il blocco
   con proporzione e raggio; l'immagine lo riempie. */
.tribe-events-calendar-list__event-featured-image-link {
	display: block;
	aspect-ratio: 4 / 3;
	border-radius: var(--wp--custom--radius--medium);
	overflow: hidden;
}

.tribe-events-calendar-list__event-featured-image-wrapper img {
	display: block;
	width: 100%;
	height: 100%;
	object-fit: cover;
	transition: transform 0.4s ease;
}

.tribe-events-calendar-list__event-featured-image-link:hover img {
	transform: scale(1.04);
}

.tribe-events-calendar-list__event-details {
	order: 1;
	padding: 0;
}

.tribe-events .tribe-events-calendar-list__event-title {
	font-size: clamp(1.5rem, 2.2vw, 1.75rem) !important; /* fino a 28px */
	line-height: 1.2;
	letter-spacing: -0.01em;
	margin-block: 0 var(--wp--preset--spacing--xxs);
}

.tribe-events-calendar-list__event-title-link {
	color: var(--wp--preset--color--contrast);
	text-decoration: none;
}

.tribe-events-calendar-list__event-title-link:hover {
	color: var(--wp--preset--color--accent);
}

/* Data/ora: nel design è testo muto (light), non accent in grassetto. */
.tribe-events .tribe-events-calendar-list__event-datetime-wrapper {
	font-size: 0.9375rem !important; /* 15px */
	color: var(--wp--preset--color--gray-600);
}

.tribe-events .tribe-events-calendar-list__event-venue {
	font-size: 1rem !important; /* 16px */
	color: var(--wp--preset--color--contrast);
}

.tribe-events .tribe-events-calendar-list__event-description {
	margin-block-start: var(--wp--preset--spacing--xs);
	font-size: 1rem !important; /* 16px */
	line-height: 1.56;
	color: var(--wp--preset--color--gray-800);
}

/* Prezzo: 18px bold nel design. Il testo è nello span __price (che eredita la
   size dal contenitore .tribe-common-b3): targetto entrambi. !important per
   battere la classe tipografica responsive di TEC. */
.tribe-events .tribe-events-calendar-list__event-cost,
.tribe-events .tribe-events-calendar-list__event-cost .tribe-events-c-small-cta__price {
	margin-block-start: var(--wp--preset--spacing--xs);
	font-size: 1.125rem !important; /* 18px */
	font-weight: 700;
	letter-spacing: -0.01em;
	color: var(--wp--preset--color--contrast);
}

/* Separatore di mese ("Luglio 2026"): nel design è un'etichetta bold rosa. */
.tribe-events .tribe-events-calendar-list__month-separator-text {
	font-size: 1rem; /* 16px */
	font-weight: 700;
	letter-spacing: 0.01em;
	color: var(--wp--preset--color--highlight);
}

/* ============================================================
   5b. Vista Giorno: separatori "In corso"/"In programma" + riga evento
   (stesso impianto della lista, senza colonna data). Azzeriamo i margini
   negativi del grid TEC (--gutters) che sforavano a 768.
   ============================================================ */

.tribe-events-calendar-day__type-separator {
	margin-block: var(--wp--preset--spacing--m) var(--wp--preset--spacing--s);
	color: var(--wp--preset--color--highlight);
	font-family: var(--wp--preset--font-family--heading);
	font-weight: 700;
}

/* Neutralizza il sistema griglia gutter di TEC (g-row--gutters/g-col:
   margin negativo + padding) che, col gutter ampio del tema, sforava a 768.
   !important perché i selettori TEC (con classe breakpoint) sono più specifici. */
.tribe-events-calendar-day__event {
	margin-inline: 0 !important;
	padding-block: var(--wp--preset--spacing--m);
	border-block-end: 1px solid var(--wp--preset--color--gray-300);
}

.tribe-events-calendar-day__event-content {
	display: grid;
	grid-template-columns: 1fr minmax(220px, 320px);
	gap: var(--wp--preset--spacing--m);
	align-items: start;
	margin-inline: 0 !important;
	padding-inline: 0 !important;
	max-width: 100%;
}

.tribe-events-calendar-day__event-details {
	padding-inline: 0 !important;
	min-width: 0;
}

.tribe-events-calendar-day__event-featured-image-wrapper {
	order: 2;
	margin: 0;
}

.tribe-events-calendar-day__event-featured-image {
	display: block;
	aspect-ratio: 4 / 3;
	border-radius: var(--wp--custom--radius--medium);
	overflow: hidden;
}

.tribe-events-calendar-day__event-featured-image img {
	width: 100%;
	height: 100%;
	object-fit: cover;
}

.tribe-events-calendar-day__event-details {
	order: 1;
}

.tribe-events .tribe-events-calendar-day__event-title {
	font-size: clamp(1.5rem, 2.2vw, 1.75rem) !important; /* fino a 28px, come la lista */
	line-height: 1.2;
	letter-spacing: -0.01em;
	margin-block: 0 var(--wp--preset--spacing--xxs);
}

.tribe-events-calendar-day__event-title-link {
	color: var(--wp--preset--color--contrast);
	text-decoration: none;
}

.tribe-events-calendar-day__event-title-link:hover {
	color: var(--wp--preset--color--accent);
}

.tribe-events .tribe-events-calendar-day__event-datetime-wrapper {
	font-size: 0.9375rem !important; /* 15px */
	color: var(--wp--preset--color--gray-600);
}

.tribe-events .tribe-events-calendar-day__event-venue {
	font-size: 1rem !important; /* 16px */
	color: var(--wp--preset--color--contrast);
}

.tribe-events .tribe-events-calendar-day__event-description {
	margin-block-start: var(--wp--preset--spacing--xs);
	font-size: 1rem !important; /* 16px */
	line-height: 1.56;
	color: var(--wp--preset--color--gray-800);
}

.tribe-events .tribe-events-calendar-day__event-cost,
.tribe-events .tribe-events-calendar-day__event-cost .tribe-events-c-small-cta__price {
	margin-block-start: var(--wp--preset--spacing--xs);
	font-size: 1.125rem !important; /* 18px */
	font-weight: 700;
	letter-spacing: -0.01em;
	color: var(--wp--preset--color--contrast);
}

/* ============================================================
   5c. Singolo evento (template classico single-event.php)
   ============================================================ */

/* Testata scura col titolo evento (variante di .cmt-events-head) */
.cmt-events-head--single {
	text-align: center;
}

.cmt-events-head--single .cmt-events-head__schedule {
	margin-block-start: var(--wp--preset--spacing--xs);
	color: var(--wp--preset--color--text-on-dark);
	font-weight: 700;
}

.cmt-events-head--single .cmt-events-head__cost {
	margin-block: var(--wp--preset--spacing--xxs) 0;
	color: var(--wp--preset--color--base);
	font-weight: 700;
}

/* Contenitore del singolo alla stessa larghezza/gutter delle sezioni del tema */
.single-tribe_events .tribe-events-single {
	max-width: var(--wp--style--global--wide-size, 1200px);
	margin-inline: auto;
	margin-block: var(--wp--preset--spacing--xl);
	padding-inline: var(--cmt-gutter);
}

/* Contenuto testuale più stretto per leggibilità */
.tribe-events-single .tribe-events-single-event-description {
	max-width: var(--wp--style--global--content-size, 768px);
}

/* La data/prezzo in-content duplica la testata scura: nascondi */
.tribe-events-single .tribe-events-schedule {
	display: none;
}

/* Immagine in evidenza: stesso respiro delle sezioni del tema (`l`), non i
   30px di TEC — con `m` il testo della descrizione restava attaccato all'immagine. */
.tribe-events-single .tribe-events-event-image {
	margin-block: var(--wp--preset--spacing--l);
}

.tribe-events-single .tribe-events-event-image img {
	display: block;
	width: 100%;
	height: auto;
	border-radius: var(--wp--custom--radius--large);
}

/* Nav superiore duplicata (stesso prev/succ. del footer): il design la vuole
   solo in fondo. La rimozione elimina anche il vuoto fantasma che lasciava. */
.tribe-events-single #tribe-events-header {
	display: none;
}

/* Blocco meta: nel design è SENZA cornice (solo spaziatura); le colonne
   restano il layout nativo di TEC. L'unica linea del blocco inferiore è quella
   sopra la nav (più sotto). */
/* 3 colonne piene per i dettagli (Dettagli/Organizzatore/Luogo); la mappa NON
   è più tra le colonne ma un blocco full-width sotto (vedi .cmt-event-map). */
.tribe-events-single .tribe-events-event-meta {
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: var(--wp--preset--spacing--l);
	margin-block: var(--wp--preset--spacing--xl) 0;
	padding-block: 0;
	border: 0;
	background: none;
	font-size: 1rem; /* 16px: valori del meta */
	color: var(--wp--preset--color--gray-800);
}

/* I gruppi meta sono celle della griglia: niente larghezze/float nativi TEC. */
.tribe-events-single .tribe-events-meta-group {
	width: auto !important;
	float: none !important;
	margin: 0 !important;
	padding: 0 !important;
}

/* Link del meta allineati al design (via i token del tema, non il blu TEC):
   "+ Google Maps" in accent senza sottolineatura; i link "sito" muti sottoline. */
.tribe-events-single .tribe-events-event-meta a {
	color: var(--wp--preset--color--accent);
}

.tribe-events-single .tribe-events-event-meta .tribe-events-gmap {
	text-decoration: none;
	font-weight: 700;
}

.tribe-events-single .tribe-events-event-meta a:not(.tribe-events-gmap) {
	color: var(--wp--preset--color--gray-800);
	text-decoration: underline;
}

.tribe-events-single .tribe-events-event-meta a:hover {
	color: var(--wp--preset--color--accent);
}

/* Ordine del blocco inferiore: prima le 3 colonne del meta, POI la mappa.
   L'hook after_the_meta di TEC inseriva la mappa in un punto che, nel flusso,
   finiva sopra le colonne; un flex-column sull'articolo + order forza la mappa
   per ultima in modo deterministico. */
/* Blocco mappa full-width sotto le 3 colonne. L'articolo del singolo è un
   flex-row-wrap (layout del tema) e una regola assegna order:2 al blocco meta,
   mentre la mappa eredita order:1 → finiva SOPRA le colonne. Le diamo un order
   più alto del meta così resta per ultima. */
.single-tribe_events .cmt-event-map {
	order: 5 !important;
}

.cmt-event-map {
	margin-block-start: var(--wp--preset--spacing--l);
}

.cmt-event-map iframe {
	display: block;
	width: 100%;
	height: 320px;
	border: 0;
	border-radius: var(--wp--custom--radius--medium);
	filter: grayscale(0.15);
}

/* Titoli colonna (Dettagli/Organizzatore/Luogo): nel design sono Nunito 24px
   scuri, NON l'etichetta accent maiuscola. */
.tribe-events-single .tribe-events-single-section-title {
	font-family: var(--wp--preset--font-family--system);
	font-size: 1.5rem; /* 24px */
	line-height: 1.2;
	font-weight: 700;
	letter-spacing: -0.01em;
	text-transform: none;
	color: var(--wp--preset--color--contrast);
	margin-block-end: var(--wp--preset--spacing--m);
}

/* Etichette (Inizio:, Numero di telefono, Email): 15px bold scuro. */
.tribe-events-single .tribe-events-meta-label,
.tribe-events-single .tribe-events-event-meta dt {
	font-size: 0.9375rem; /* 15px */
	font-weight: 700;
	color: var(--wp--preset--color--contrast);
}

/* Mappa del luogo */
.tribe-events-single .tribe-events-venue-map,
.tribe-events-single .tribe-events-gmap {
	width: 100%;
	max-width: none;
	margin: 0;
}

.tribe-events-single .tribe-events-venue-map iframe,
.tribe-events-single #tribe-events-gmap {
	width: 100% !important;
	height: 220px !important;
	border-radius: var(--wp--custom--radius--medium);
}

/* Navigazione evento prec./succ. Il wrapper #tribe-events-footer porta già un
   border-top di TEC: lo usiamo come UNICA linea del blocco inferiore (col
   margine/padding del design) e azzeriamo bordo e margini della nav interna,
   che altrimenti raddoppiavano la linea e aprivano un vuoto. */
.tribe-events-single #tribe-events-footer {
	margin-block-start: var(--wp--preset--spacing--xl);
	padding-block-start: var(--wp--preset--spacing--l);
	border-block-start: 1px solid var(--wp--preset--color--gray-300);
}

.tribe-events-single .tribe-events-nav-pagination {
	margin: 0;
	padding: 0;
	border: 0;
}

.tribe-events-single .tribe-events-sub-nav {
	display: flex;
	justify-content: space-between;
	gap: var(--wp--preset--spacing--s);
	list-style: none;
	margin: 0;
	padding: 0;
}

/* Link "Tutti gli Eventi" in alto: accent (affordance di ritorno). */
.tribe-events-single .tribe-events-back a {
	color: var(--wp--preset--color--accent);
	text-decoration: none;
	font-weight: 700;
}

/* Nav in fondo: link scuri 15px bold, come il design. */
.tribe-events-single .tribe-events-sub-nav a {
	color: var(--wp--preset--color--contrast);
	text-decoration: none;
	font-weight: 700;
	font-size: 0.9375rem; /* 15px */
}

.tribe-events-single .tribe-events-sub-nav a:hover {
	color: var(--wp--preset--color--accent);
}

/* ============================================================
   6. Responsive (breakpoint di famiglia 1024 / 767)
   ============================================================ */

@media (max-width: 1024px) {
	.tribe-events-calendar-list__event,
	.tribe-events-calendar-day__event-content {
		grid-template-columns: 1fr minmax(160px, 240px);
		gap: var(--wp--preset--spacing--s);
	}
}

@media (max-width: 767px) {
	.tribe-events-calendar-list__event-row {
		grid-template-columns: 52px 1fr;
		gap: var(--wp--preset--spacing--s);
	}

	.tribe-events-calendar-list__event,
	.tribe-events-calendar-day__event-content {
		grid-template-columns: 1fr;
	}

	.tribe-events-calendar-list__event-featured-image-wrapper,
	.tribe-events-calendar-day__event-featured-image-wrapper {
		order: 0;
		margin-block-end: var(--wp--preset--spacing--xs);
	}

	/* Meta del singolo: da 3 colonne a stack su mobile. */
	.tribe-events-single .tribe-events-event-meta {
		grid-template-columns: 1fr;
		gap: var(--wp--preset--spacing--m);
	}

	.cmt-event-map iframe {
		height: 260px;
	}
}