/*
 Theme Name:   Tema Gustamodena 2026
 Theme URI:    https://gustamodena.it
 Description:  Child theme di GeneratePress per la ripartenza di gustamodena.it
 Author:       Luigi Guaitoli
 Template:     generatepress
 Version:      0.2
*/

/* ==========================================================================
   DESIGN TOKENS — versione definitiva, confermata con Luigi l'11/08/2026
   dopo revisione visiva. Sostituisce la bozza v0.1. Vedi
   docs/gustamodena-brief-design-system.md.
   ========================================================================== */

:root {
	/* Colori principali — bordeaux storico confermato (era già usato per i link) */
	--gm-color-primary: #880000;
	--gm-color-primary-hover: #5c0000;
	--gm-color-secondary: #e8a93c;    /* oro/ambra — accento, badge sponsor, dettagli. Uso con parsimonia, non dominante */
	--gm-color-background: #fff4ce;   /* giallo caldo chiaro — sfondo pagina, continuità con la memoria storica del sito -> modificato 28.08.26, era fff6d9 */
	--gm-color-surface: #ffffff;      /* sfondo card/box contenuto */
	--gm-color-surface-alt: #f5eedb;  /* riga alternata nelle liste (recensioni, post, ecc.) */
	--gm-color-surface-neutral: #f0ebe3; /* sfondo mini-card "ultimi 5" in home (brief rifiniture §4.3) */
	--gm-color-content-bg: var(--gm-color-surface); /* sfondo del blocco contenuti principale (.gm-locale) — pagina resta gialla, un solo token da cambiare qui */
	--gm-color-text: #2e1500;         /* bruno scuro — testo principale */
	--gm-color-text-muted: #7a6a52;   /* testo secondario/didascalie */
	--gm-color-link: #880000;
	--gm-color-link-hover: #5c0000;
	--gm-color-border: #e8d9b0;

	/* Stati semantici (locali, recensioni, moderazione, ecc.) */
	--gm-color-success: #4a7c3a;      /* badge "attivo" */
	--gm-color-warning: #b8860b;      /* badge "in moderazione/in attesa" */
	--gm-color-danger: #a33a3a;       /* badge "chiuso" */

	/* Tipografia — sistema a due font della stessa famiglia (confermato 11/08/2026) */
	--gm-font-ui: 'Nunito Sans', sans-serif;   /* titoli, pulsanti, etichette, navigazione, dati strutturati */
	--gm-font-content: 'Nunito', sans-serif;    /* SOLO testo lungo generato dagli utenti: recensioni, post, commenti, risposte */

	/* Spaziature (scala 8px) */
	--gm-space-xs: 4px;
	--gm-space-sm: 8px;
	--gm-space-md: 16px;
	--gm-space-lg: 24px;
	--gm-space-xl: 40px;

	/* Raggio bordi */
	--gm-radius: 8px;
	--gm-radius-pill: 20px;  /* badge di stato — confermati "a pillola" */
}

/* ==========================================================================
   Stili di base
   ========================================================================== */

body {
	background-color: var(--gm-color-background);
	color: var(--gm-color-text);
	font-family: var(--gm-font-ui);
}

h1, h2, h3, h4, h5, h6 {
	font-family: var(--gm-font-ui);
	font-weight: 700;
	color: var(--gm-color-primary);
}

a {
	color: var(--gm-color-link);
}

a:hover {
	color: var(--gm-color-link-hover);
}

/* Testo lungo generato dagli utenti: recensioni, post forum, commenti, risposte.
   Applicare questa classe al contenitore del testo in TUTTI i template che
   mostrano contenuto utente (single-recensione.php, single-forum-post.php,
   liste commenti/risposte). NON usarla per etichette, date, nomi utente:
   quelli restano in --gm-font-ui. */
.gm-content-utente {
	font-family: var(--gm-font-content);
	font-size: 17px; /* aggiornato luigi 18.08.2026 , prima era 15px */
	line-height: 1.7;
	color: var(--gm-color-text);
}

/* ==========================================================================
   Componenti base — riusare, non scrivere CSS ad hoc per nuovi template
   (brief design system §3).
   ========================================================================== */

.gm-btn {
	font-family: var(--gm-font-ui);
	font-weight: 600;
	font-size: 14px;
	border-radius: var(--gm-radius);
	padding: 9px 16px;
	border: none;
	cursor: pointer;
	display: inline-flex;
	align-items: center;
	gap: 6px;
	text-decoration: none;
}
.gm-btn:disabled {
	opacity: 0.6;
	cursor: default;
}

.gm-icona {
	flex-shrink: 0;
}

.gm-btn-primary {
	background: var(--gm-color-primary);
	color: #fff;
}
.gm-btn-primary:hover {
	background: var(--gm-color-primary-hover);
	color: #fff;
}

.gm-btn-secondary {
	background: transparent;
	color: var(--gm-color-primary);
	border: 1.5px solid var(--gm-color-primary);
}
.gm-btn-secondary:hover {
	background: var(--gm-color-background);
}

/* Badge di stato — sempre a pillola, mai squadrati (confermato 11/08/2026).
   "categoria" e "voto" non erano nel file consegnato da Luigi (che copre
   solo attivo/chiuso/in-attesa/sponsor) — aggiunti qui coerenti con la
   palette per coprire i badge già in uso in single-locale.php (categoria
   locale) e single-recensione.php (voto), decisione presa con Luigi in
   sessione. */
.gm-badge {
	font-family: var(--gm-font-ui);
	font-weight: 600;
	font-size: 12px;
	padding: 4px 12px;
	border-radius: var(--gm-radius-pill);
	display: inline-block;
	color: #fff;
	text-decoration: none;
}
.gm-badge-attivo { background: var(--gm-color-success); }
.gm-badge-chiuso { background: var(--gm-color-danger); }
.gm-badge-in-attesa { background: var(--gm-color-warning); }
.gm-badge-sponsor { background: var(--gm-color-secondary); color: var(--gm-color-text); }
.gm-badge-categoria { background: var(--gm-color-primary); }
.gm-badge-voto { background: var(--gm-color-secondary); color: var(--gm-color-text); }
/* Spesa stimata dallo storico attualizzato per inflazione, non osservata di
   recente (brief gustamodena-brief-spesa-media-attualizzata.md §5) — tono
   volutamente neutro/dimesso, diverso dai badge di stato colorati sopra,
   per non dare troppo peso visivo a un dato incerto per definizione. */
.gm-badge-stima {
	background: var(--gm-color-surface-alt);
	color: var(--gm-color-text-muted);
	border: 1px solid var(--gm-color-border);
	font-size: 11px;
	font-weight: 500;
	padding: 2px 8px;
}

/* Liste con righe alternate — recensioni, post forum, locali, ecc.
   Pattern ripreso direttamente dal vecchio sito. Non ancora adottata da
   nessun template esistente (usare al prossimo restyling, non ad-hoc). */
.gm-list-row {
	display: flex;
	justify-content: space-between;
	padding: 12px 16px;
	background: var(--gm-color-surface);
}
.gm-list-row:nth-child(even) {
	background: var(--gm-color-surface-alt);
}

/* ==========================================================================
   single-locale.php — struttura e layout, in attesa del restyling completo
   (prossimo step della sequenza, brief design-system §4). I colori/font
   qui sotto già ereditano i token definitivi sopra.
   Vedi docs/gustamodena-brief-template-locale.md §4.
   ========================================================================== */

.gm-locale {
	width: 100%;
	max-width: 960px; /* aggiornato luigi 18.08.2026, prima era 780px */
	margin: var(--gm-space-xl) auto;
	padding: var(--gm-space-lg) var(--gm-space-md);
	background: var(--gm-color-content-bg);
	border: 1px solid var(--gm-color-border);
	border-radius: var(--gm-radius);
	box-sizing: border-box;
}

/* Scheda locale: più largo del blocco base .gm-locale (780px) perché la
   griglia orari a 7 colonne (Lun-Dom, minmax 110px + gap) ci sta solo da
   ~900px di contenuto in su — sotto quella soglia il settimo giorno va a
   capo. #gm-locale è l'unico main con questo id, non tocca gli altri
   template che condividono la classe .gm-locale. */
#gm-locale {
	max-width: 960px;
}

/* Form "Scrivi una recensione": uniformato alla stessa larghezza delle altre
   sezioni della scheda locale (brief responsive §5), era rimasto a 780px
   ereditando solo la regola base .gm-locale. */
#gm-recensione-scrivi {
	max-width: 960px;
}

.gm-muted {
	color: var(--gm-color-text-muted);
}

.gm-banner {
	padding: var(--gm-space-sm) var(--gm-space-md);
	margin-bottom: var(--gm-space-lg);
	border-radius: var(--gm-radius);
	border: 1px solid var(--gm-color-warning);
	background: color-mix(in srgb, var(--gm-color-warning) 15%, var(--gm-color-surface));
}

.gm-locale__header {
	margin-bottom: var(--gm-space-lg);
}

.gm-locale__nome {
	margin-bottom: var(--gm-space-sm);
}

.gm-locale__badges {
	display: flex;
	flex-wrap: wrap;
	gap: var(--gm-space-sm);
}

.gm-locale__spesa {
	margin-top: var(--gm-space-sm);
	color: var(--gm-color-text-muted);
	font-weight: 600;
}

.gm-locale__section {
	margin-bottom: var(--gm-space-xl);
	padding-bottom: var(--gm-space-lg);
	border-bottom: 1px solid var(--gm-color-border);
}

.gm-locale__section:last-child {
	border-bottom: none;
}

.gm-locale__section h2 {
	margin-bottom: var(--gm-space-md);
}

/* Telefono/sito/social — spostati sotto l'indirizzo nell'header (prima
   erano in una sezione "Contatti" a parte, eliminata: "Richiedi
   Informazioni" vive già nel pannello interazioni). */
.gm-locale__contatti-brevi {
	display: flex;
	flex-wrap: wrap;
	gap: var(--gm-space-md);
	margin-bottom: var(--gm-space-sm);
}

.gm-locale__contatto {
	display: inline-flex;
	align-items: center;
	gap: 4px;
	color: var(--gm-color-text-muted);
	font-size: 0.9rem;
}
.gm-locale__contatto .gm-icona {
	width: 16px;
	height: 16px;
}
.gm-locale__contatto:hover {
	color: var(--gm-color-link-hover);
}

/* Griglia 7 colonne Lun-Dom (rifinitura brief cappelli e rifiniture,
   sostituisce il modello a chip orizzontali). auto-fit + minmax invece di
   una larghezza colonna fissa: sul sito non esistono ancora media query,
   ogni layout multi-colonna si affida al reflow naturale della grid (stesso
   pattern di .gm-cruscotto__grid) — su schermi stretti le colonne vanno a
   capo da sole invece di schiacciarsi. */
.gm-locale__orari-grid {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(110px, 1fr));
	gap: var(--gm-space-md);
}

.gm-locale__orari-giorno h3 {
	margin: 0 0 var(--gm-space-xs);
	color: var(--gm-color-primary);
	font-size: 0.95rem;
}

.gm-locale__orari-giorno ul {
	list-style: none;
	margin: 0;
	padding: 0;
	display: flex;
	flex-direction: column;
	gap: var(--gm-space-xs);
}

.gm-locale__orari-giorno li {
	font-size: 0.85rem;
	line-height: 1.3;
}

.gm-locale__orario-ore {
	display: block;
	font-weight: 600;
}

.gm-locale__orario-etichetta {
	display: block;
	color: var(--gm-color-text-muted);
}

.gm-locale__orario-chiuso {
	font-size: 0.85rem;
	margin: 0;
}

.gm-tag-gruppo {
	margin-bottom: var(--gm-space-md);
}

.gm-tag-gruppo h3 {
	font-size: 1rem;
	margin-bottom: var(--gm-space-sm);
}

.gm-tag-cloud {
	display: flex;
	flex-wrap: wrap;
	align-items: baseline;
	gap: var(--gm-space-sm) var(--gm-space-md);
}

.gm-tag {
	display: inline-block;
	color: var(--gm-color-primary);
	background: var(--gm-color-surface);
	border: 1px solid var(--gm-color-border);
	border-radius: var(--gm-radius);
	padding: 2px 10px;
	line-height: 1.4;
	text-decoration: none;
}

/* Tag cliccabili (docs/gustamodena-brief-tag-cloud.md §5): stesso aspetto dei
   tag semplici, solo un feedback hover a indicare che sono link verso /tag/{slug}/. */
a.gm-tag:hover {
	border-color: var(--gm-color-primary);
}

.gm-tag--peso-1 { font-size: 0.8rem; }
.gm-tag--peso-2 { font-size: 0.95rem; }
.gm-tag--peso-3 { font-size: 1.1rem; }
.gm-tag--peso-4 { font-size: 1.3rem; font-weight: 600; }
.gm-tag--peso-5 { font-size: 1.5rem; font-weight: 700; border-color: var(--gm-color-secondary); }

/* Listato locali per tag (/tag/{slug}/, docs/gustamodena-brief-tag-cloud.md
   §3.4) — stesso pattern "box" già in uso per .gm-recensione (sfondo,
   bordo, padding), dentro il contenitore .gm-locale riusato dal template. */
.gm-tag-locali-list {
	list-style: none;
	margin: 0;
	padding: 0;
}

.gm-tag-locali-list__item {
	display: flex;
	flex-wrap: wrap;
	gap: var(--gm-space-md);
	background: var(--gm-color-surface);
	border: 1px solid var(--gm-color-border);
	border-radius: var(--gm-radius);
	padding: var(--gm-space-md);
	margin-bottom: var(--gm-space-md);
}

.gm-tag-locali-list__img {
	flex: 0 0 120px;
	width: 120px;
	height: 90px;
	object-fit: cover;
	border-radius: var(--gm-radius);
}

.gm-tag-locali-list__corpo {
	flex: 1 1 240px;
	min-width: 0;
}

.gm-tag-locali-list__tag {
	margin: var(--gm-space-xs) 0 0;
	color: var(--gm-color-primary);
	font-size: 0.85rem;
}

.gm-tag-locali-list__nome {
	font-weight: 600;
	font-size: 1.1rem;
}

.gm-tag-locali-list__categoria {
	margin-left: var(--gm-space-sm);
	color: var(--gm-color-text-muted);
	font-size: 0.9rem;
}

.gm-tag-locali-list__indirizzo {
	margin: var(--gm-space-xs) 0 0;
	color: var(--gm-color-text-muted);
	font-size: 0.9rem;
}

.gm-tag-locali-list__stats {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: var(--gm-space-sm);
	margin: var(--gm-space-xs) 0;
}

.gm-tag-locali-list__prezzo {
	color: var(--gm-color-text-muted);
	font-size: 0.9rem;
}

.gm-stats {
	display: flex;
	flex-wrap: wrap;
	gap: var(--gm-space-xl);
}

.gm-stat {
	display: flex;
	flex-direction: column;
}

.gm-stat__valore {
	font-family: var(--gm-font-ui);
	font-size: 1.6rem;
	color: var(--gm-color-primary);
}

.gm-stat__label {
	color: var(--gm-color-text-muted);
	font-size: 0.85rem;
}

.gm-recensioni-list {
	list-style: none;
	margin: 0;
	padding: 0;
}

.gm-recensione {
	background: var(--gm-color-surface);
	border: 1px solid var(--gm-color-border);
	border-radius: var(--gm-radius);
	padding: var(--gm-space-md);
	margin-bottom: var(--gm-space-md);
}

.gm-recensione__meta {
	display: flex;
	flex-wrap: wrap;
	gap: var(--gm-space-sm);
	align-items: center;
	margin-bottom: var(--gm-space-xs);
	color: var(--gm-color-text-muted);
	font-size: 0.9rem;
}

.gm-recensione__voto-testo {
	font-style: italic;
	color: var(--gm-color-text-muted);
}

.gm-cappelli {
	display: inline-flex;
	align-items: center;
	gap: 2px;
	vertical-align: middle;
}

.gm-cappelli__icona {
	display: block;
	width: 18px;
	height: 23px;
}

.gm-cappelli__numero {
	margin-left: var(--gm-space-xs);
	color: var(--gm-color-secondary);
	font-weight: 700;
}

/* Archivio recensioni generale: pagina più larga di .gm-locale (780px) per
   ospitare la tabella fedele allo screenshot storico condiviso da Luigi.
   Selettore doppia classe per vincere sulla regola base indipendentemente
   dall'ordine nel foglio di stile. */
.gm-locale.gm-recensioni-archive {
	max-width: 1100px;
}

.gm-tabella-scroll {
	overflow-x: auto;
}

.gm-recensioni-tabella {
	width: 100%;
	border-collapse: collapse;
	font-size: 0.9rem;
}

.gm-recensioni-tabella th,
.gm-recensioni-tabella td {
	padding: var(--gm-space-sm) var(--gm-space-md);
	text-align: left;
	white-space: nowrap;
	border-bottom: 1px solid var(--gm-color-border);
}

.gm-recensioni-tabella th {
	color: var(--gm-color-primary);
	font-family: var(--gm-font-ui);
}

/* Riga alternata: stesso pattern del design system (.gm-list-row), qui
   applicato a un vero <table> invece del div flessibile generico. */
.gm-recensioni-tabella tbody tr:nth-child(even) {
	background: var(--gm-color-surface-alt);
}

.gm-recensioni-tabella__valutazione {
	white-space: normal;
}

.gm-recensioni-tabella__valutazione .gm-recensione__voto-testo {
	margin-left: var(--gm-space-xs);
}

/* Colonna "motivazione" dello storico punti: testo libero (specie sui tipi
   storici senza etichetta mappata), non un valore breve — niente nowrap
   ereditato dalla tabella base, stesso principio già usato per la colonna
   valutazione qui sopra. */
.gm-rating-tabella__motivazione {
	white-space: normal;
}

/* Tab "Recensioni" / "Punti rating" sul profilo utente — prima occorrenza
   di questo pattern nel tema (brief profilo-punti-rating-modifica-dedicata
   §1.4), tenuto minimale: due pulsanti, un pannello visibile alla volta. */
.gm-tabs__nav {
	display: flex;
	gap: var(--gm-space-md);
	border-bottom: 2px solid var(--gm-color-border);
	margin-bottom: var(--gm-space-md);
}

.gm-tabs__btn {
	font-family: var(--gm-font-ui);
	font-weight: 700;
	font-size: 1rem;
	background: none;
	border: none;
	border-bottom: 3px solid transparent;
	margin-bottom: -2px;
	padding: var(--gm-space-sm) var(--gm-space-xs);
	color: var(--gm-color-text-muted);
	cursor: pointer;
}

.gm-tabs__btn.is-active {
	color: var(--gm-color-primary);
	border-bottom-color: var(--gm-color-primary);
}

.gm-tabs__panel {
	display: none;
}

.gm-tabs__panel.is-active {
	display: block;
}

/* Saldo punti in cima alla tab "Punti rating": stesso componente .gm-stat
   di "In sintesi" (stesso numero, §1.3 del brief — riuso visivo intenzionale,
   non un ricalcolo), ma qui fuori dalla griglia .gm-stats, isolato — serve
   solo lo spazio sotto prima della tabella. */
.gm-rating-saldo {
	margin-bottom: var(--gm-space-md);
}

.gm-immagine-evidenza img {
	width: 100%;
	height: auto;
	border-radius: var(--gm-radius);
}

.gm-galleria {
	display: grid;
	grid-template-columns: repeat(auto-fill, minmax(120px, 1fr));
	gap: var(--gm-space-sm);
	margin-top: var(--gm-space-sm);
}

.gm-galleria img {
	width: 100%;
	height: 100px;
	object-fit: cover;
	border-radius: var(--gm-radius);
}

.gm-mappa__iframe {
	width: 100%;
	height: 320px;
	border: 1px solid var(--gm-color-border);
	border-radius: var(--gm-radius);
}

/* ==========================================================================
   Restyling scheda locale — brief gustamodena-brief-restyling-scheda-locale.md.
   ========================================================================== */

.gm-locale__indirizzo {
	margin-top: 0;
}

.gm-locale__specialita {
	line-height: 1.7;
}

/* Immagine in evidenza accanto ai dati anagrafici in alto (brief responsive
   §6, sostituisce il posizionamento accanto alla specialità più in basso). */
.gm-locale__top {
	display: flex;
	flex-wrap: wrap;
	gap: var(--gm-space-lg);
	align-items: flex-start;
	margin-bottom: var(--gm-space-lg);
}

.gm-locale__top .gm-locale__header {
	flex: 1 1 320px;
	margin-bottom: 0;
}

.gm-locale__top .gm-immagine-evidenza {
	flex: 0 1 320px;
	max-width: 320px;
}

.gm-locale__coperti {
	margin-top: var(--gm-space-sm);
	color: var(--gm-color-text-muted);
}

/* Cruscotto "In sintesi" e pannello interazioni: contenitore distinto
   (bordo + sfondo), coerente con lo stile del vecchio box arancione ma
   nella nuova palette (brief restyling §3-4). */
.gm-cruscotto,
.gm-interazioni {
	border: 1px solid var(--gm-color-border);
	background: var(--gm-color-surface-alt);
	border-radius: var(--gm-radius);
	padding: var(--gm-space-lg);
}

.gm-cruscotto__grid {
	display: grid;
	/* auto-fit + minmax: regge una quinta card futura (presenza in
	   classifiche, brief §3) senza dover essere riprogettata. */
	grid-template-columns: repeat(auto-fit, minmax(130px, 1fr));
	gap: var(--gm-space-lg);
}

.gm-cruscotto__card {
	display: flex;
	flex-direction: column;
	align-items: center;
	text-align: center;
	gap: 4px;
	color: var(--gm-color-primary);
	text-decoration: none;
}
a.gm-cruscotto__card:hover {
	opacity: 0.75;
}

.gm-cruscotto__valore {
	font-family: var(--gm-font-ui);
	font-size: 1.4rem;
	font-weight: 700;
	color: var(--gm-color-primary);
}

.gm-cruscotto__label {
	color: var(--gm-color-text-muted);
	font-size: 0.85rem;
}

.gm-interazioni__azioni {
	display: flex;
	flex-wrap: wrap;
	gap: var(--gm-space-sm);
}

.gm-interazioni__segnala {
	margin: var(--gm-space-md) 0 0;
	color: var(--gm-color-text-muted);
	font-size: 0.85rem;
}

.gm-richiedi-info-form input[type="text"],
.gm-richiedi-info-form textarea {
	width: 100%;
	max-width: 480px;
	margin-top: var(--gm-space-xs);
	font-family: var(--gm-font-ui);
}
.gm-richiedi-info-form label {
	font-weight: 600;
}

.gm-sono-stati-qui {
	display: flex;
	flex-wrap: wrap;
	gap: var(--gm-space-sm);
	list-style: none;
	margin: 0;
	padding: 0;
}

.gm-sono-stati-qui__link {
	position: relative;
	display: inline-block;
}

.gm-sono-stati-qui__avatar {
	width: 40px;
	height: 40px;
	border-radius: 50%;
	object-fit: cover;
	display: flex;
	align-items: center;
	justify-content: center;
	background: var(--gm-color-primary);
	color: #fff;
	font-family: var(--gm-font-ui);
	font-weight: 700;
}

/* Badge col voto sull'avatar — pattern ripreso dal "fumetto" del vecchio
   sito (screenshot storico condiviso in sessione, "Sono stati qui"). */
.gm-sono-stati-qui__voto {
	position: absolute;
	bottom: -4px;
	right: -4px;
	min-width: 18px;
	height: 18px;
	padding: 0 3px;
	display: flex;
	align-items: center;
	justify-content: center;
	border-radius: var(--gm-radius-pill);
	border: 2px solid var(--gm-color-content-bg);
	background: var(--gm-color-secondary);
	color: var(--gm-color-text);
	font-family: var(--gm-font-ui);
	font-size: 0.65rem;
	font-weight: 700;
}

/* Avatar inline riusabile — gm2026_render_avatar_inline() in
   inc/components.php, vedi docs/gustamodena-brief-avatar-diffuso.md. Stesso
   pattern fallback di .gm-sono-stati-qui__avatar sopra (iniziale su cerchio
   colorato), qui in due taglie: grande per l'autore in pagina singola
   (recensione/post forum), piccola per liste dense (commenti, risposte,
   recensioni in scheda locale). */
.gm-avatar-inline {
	border-radius: 50%;
	object-fit: cover;
	vertical-align: middle;
	flex-shrink: 0;
}

.gm-avatar-inline--grande {
	width: 96px;
	height: 96px;
}

.gm-avatar-inline--piccola {
	width: 32px;
	height: 32px;
}

.gm-avatar-inline--assente {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	background: var(--gm-color-primary);
	color: #fff;
	font-family: var(--gm-font-ui);
	font-weight: 700;
}

.gm-avatar-inline--grande.gm-avatar-inline--assente {
	font-size: 2.5rem;
}

.gm-avatar-inline--piccola.gm-avatar-inline--assente {
	font-size: 0.9rem;
}

.gm-interazioni__ultimo-agg {
	margin: 0 0 var(--gm-space-md);
	font-size: 0.85rem;
	font-weight: 600;
	color: var(--gm-color-primary);
}

/* ==========================================================================
   Paginazione — condivisa da tutti i listati paginati del sito.
   ========================================================================== */

.gm-pagination {
	display: flex;
	flex-wrap: wrap;
	gap: var(--gm-space-xs);
	margin-top: var(--gm-space-xl);
	font-family: var(--gm-font-ui);
}

.gm-pagination .page-numbers {
	display: inline-block;
	padding: var(--gm-space-xs) var(--gm-space-sm);
	border: 1px solid var(--gm-color-border);
	border-radius: var(--gm-radius);
	color: var(--gm-color-link);
}

.gm-pagination .page-numbers.current {
	background: var(--gm-color-primary);
	border-color: var(--gm-color-primary);
	color: #fff;
}

.gm-pagination .page-numbers.dots {
	border: none;
}

/* ==========================================================================
   archive-cerca.php — ricerca locali con filtri, Fase 2 (brief
   gustamodena-brief-ricerca-locali-fase2.md). Più largo di .gm-locali-list
   perché ospita lista + mappa affiancate da tablet in su; width:100%
   esplicito perché #content (GeneratePress) è display:flex, senza non si
   estenderebbe fino a max-width (vedi nota già presente più sotto per
   .gm-home).
   ========================================================================== */

.gm-cerca {
	width: 100%;
	max-width: 1100px;
	margin: 0 auto;
	padding: var(--gm-space-lg) var(--gm-space-md);
	box-sizing: border-box;
}

.gm-cerca__header {
	margin-bottom: var(--gm-space-lg);
}

.gm-cerca-filtri {
	display: flex;
	flex-wrap: wrap;
	gap: var(--gm-space-lg);
	padding: var(--gm-space-md);
	margin-bottom: var(--gm-space-lg);
	background: var(--gm-color-surface);
	border: 1px solid var(--gm-color-border);
	border-radius: var(--gm-radius);
}

.gm-cerca-filtri__campo {
	display: flex;
	flex-direction: column;
	gap: var(--gm-space-xs);
	position: relative;
	flex: 1 1 200px;
}

.gm-cerca-filtri__campo label,
.gm-cerca-filtri__tags legend,
.gm-cerca-filtri__prezzo legend {
	font-weight: 600;
	font-size: 0.9rem;
}

.gm-cerca-filtri__tags legend,
.gm-cerca-filtri__prezzo legend {
	/* <legend> ha un margin-bottom di default del browser (assente su
	   <label>) che disallineava verticalmente il campo di ricerca tag
	   rispetto a provincia/comune/categoria — azzerato qui. */
	margin: 0;
	padding: 0;
}

.gm-cerca-filtri__campo select,
.gm-cerca-filtri__campo input[type="text"] {
	padding: var(--gm-space-xs) var(--gm-space-sm);
	border: 1px solid var(--gm-color-border);
	border-radius: var(--gm-radius);
	font-family: var(--gm-font-ui);
	background: var(--gm-color-surface);
}

.gm-cerca-filtri__tags,
.gm-cerca-filtri__prezzo,
.gm-cerca-filtri__flag {
	flex: 1 1 220px;
	border: none;
	padding: 0;
	margin: 0;
	display: flex;
	flex-direction: column;
	gap: var(--gm-space-xs);
}

.gm-cerca-tag-chips {
	display: flex;
	flex-wrap: wrap;
	gap: var(--gm-space-xs);
}

.gm-cerca-tag-chip {
	display: inline-flex;
	align-items: center;
	gap: 4px;
	padding: 2px 6px 2px 10px;
	background: var(--gm-color-surface-alt);
	border: 1px solid var(--gm-color-border);
	border-radius: var(--gm-radius-pill);
	font-size: 0.85rem;
}

.gm-cerca-tag-chip__rimuovi {
	background: none;
	border: none;
	cursor: pointer;
	padding: 0 2px;
	font-size: 1rem;
	line-height: 1;
	color: var(--gm-color-text-muted);
}

.gm-cerca-tag-chip__rimuovi:hover {
	color: var(--gm-color-danger);
}

.gm-cerca-filtri__checkbox {
	display: flex;
	align-items: center;
	gap: var(--gm-space-xs);
	font-weight: 400;
	font-size: 0.9rem;
}

.gm-cerca-filtri__azioni {
	display: flex;
	align-items: flex-end;
	gap: var(--gm-space-sm);
	flex: 0 0 auto;
}

.gm-cerca-risultati {
	display: grid;
	grid-template-columns: 1fr;
	gap: var(--gm-space-lg);
	padding: var(--gm-space-md);
	background: var(--gm-color-surface);
	border: 1px solid var(--gm-color-border);
	border-radius: var(--gm-radius);
	box-sizing: border-box;
}

.gm-cerca-lista {
	list-style: none;
	margin: 0;
	padding: 0;
}

.gm-cerca-lista__item {
	display: flex;
	flex-wrap: wrap;
	align-items: baseline;
	gap: var(--gm-space-sm);
	padding: var(--gm-space-sm) 0;
	border-bottom: 1px solid var(--gm-color-border);
}

.gm-cerca-lista__nome {
	font-weight: 600;
}

.gm-cerca-lista__indirizzo {
	color: var(--gm-color-text-muted);
	font-size: 0.9rem;
	flex-basis: 100%;
}

.gm-cerca-lista__stats {
	display: inline-flex;
	align-items: center;
	gap: var(--gm-space-sm);
}

.gm-cerca-lista__prezzo {
	color: var(--gm-color-text-muted);
	font-size: 0.9rem;
}

.gm-cerca-lista__tag {
	flex-basis: 100%;
	font-size: 0.85rem;
	color: var(--gm-color-primary);
}

#gm-cerca-mappa {
	width: 100%;
	height: 420px;
	border: 1px solid var(--gm-color-border);
	border-radius: var(--gm-radius);
}

.gm-cerca-mappa__vuota {
	margin-top: var(--gm-space-sm);
}

@media (min-width: 900px) {
	.gm-cerca-risultati {
		grid-template-columns: 1.2fr 1fr;
		align-items: start;
	}

	.gm-cerca-risultati__mappa {
		position: sticky;
		top: var(--gm-space-lg);
	}
}

/* ==========================================================================
   single-recensione.php
   ========================================================================== */

.gm-breadcrumb {
	display: flex;
	flex-wrap: wrap;
	gap: var(--gm-space-xs);
	color: var(--gm-color-text-muted);
	font-size: 0.85rem;
	margin-bottom: var(--gm-space-lg);
}

/* Blocco autore con avatar grande (§4 di gustamodena-brief-avatar-diffuso.md)
   — separato dalla riga di meta sottostante (cappelli/prezzo/coperti/...),
   che resta testuale e compatta. */
.gm-recensione-page__autore {
	display: flex;
	align-items: center;
	gap: var(--gm-space-sm);
	margin-bottom: var(--gm-space-sm);
}

.gm-recensione-page__autore-nome {
	font-weight: 600;
	font-size: 1.1rem;
}

.gm-recensione-page__meta {
	display: flex;
	flex-direction: column;
	gap: var(--gm-space-xs);
	margin-bottom: var(--gm-space-md);
	color: var(--gm-color-text-muted);
}

.gm-recensione-page__meta-riga {
	margin: 0;
}

.gm-recensione-page__testo {
	line-height: 1.7;
}

.gm-commenti__list {
	list-style: none;
	margin: 0;
	padding: 0;
}

.gm-commento {
	padding: var(--gm-space-md) 0;
	border-bottom: 1px solid var(--gm-color-border);
}

.gm-commento:last-child {
	border-bottom: none;
}

.gm-commento__meta {
	display: flex;
	gap: var(--gm-space-sm);
	align-items: center;
	margin-bottom: var(--gm-space-xs);
}

.gm-servizio-nav p {
	margin: var(--gm-space-xs) 0;
}

/* ==========================================================================
   archive-forum.php / archive-forum-categoria.php / single-forum-post.php
   ========================================================================== */

/* CTA "Scrivi un nuovo post", verso la pagina dedicata /forum/scrivi/
   (brief gustamodena-brief-forum-home-categorie.md §1.4/§2.2) — stesso
   spaziamento delle altre sezioni della pagina. */
.gm-forum-cta {
	margin-bottom: var(--gm-space-xl);
}

/* Home forum: griglia fluida di card per categoria (brief §1.3). auto-fit +
   minmax invece di un breakpoint fisso, stesso principio già in uso in
   .gm-locale__orari-grid/.gm-cruscotto__grid: il progetto non ha ancora
   nessuna media query, ogni layout multi-colonna si affida al reflow
   naturale della grid.
   Stessa griglia riusata (stesso valore di minmax(), stesso principio) per
   /locali/ (card provincia) e /{provincia}/ (card categoria) — brief
   gustamodena-brief-locali-navigazione-provincia-categoria.md §1.3/§2.2,
   contenuto diverso (nessuna immagine/descrizione/ultimo elemento), stesso
   layout: selettori aggiunti qui invece di duplicare le regole. */
.gm-forum-categorie,
.gm-provincia-grid,
.gm-categoria-grid {
	list-style: none;
	margin: 0;
	padding: 0;
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
	gap: var(--gm-space-lg);
}

.gm-forum-categorie__card,
.gm-provincia-grid__card,
.gm-categoria-grid__card {
	display: flex;
	flex-direction: column;
	gap: var(--gm-space-xs);
	background: var(--gm-color-content-bg);
	border: 1px solid var(--gm-color-border);
	border-radius: var(--gm-radius);
	padding: var(--gm-space-md);
}

.gm-forum-categorie__img {
	width: 100%;
	height: 140px;
	object-fit: cover;
	border-radius: var(--gm-radius);
	margin-bottom: var(--gm-space-xs);
}

.gm-forum-categorie__titolo,
.gm-provincia-grid__titolo,
.gm-categoria-grid__titolo {
	font-weight: 600;
	font-size: 1.1rem;
}

.gm-forum-categorie__ultimo {
	margin-top: auto;
	padding-top: var(--gm-space-xs);
	border-top: 1px solid var(--gm-color-border);
	font-size: 0.9rem;
}

.gm-forum-post__img {
	max-width: 100%;
	height: auto;
	border-radius: var(--gm-radius);
	margin-bottom: var(--gm-space-md);
}

/* Blocco autore con avatar grande, stesso pattern di
   .gm-recensione-page__autore — vedi gustamodena-brief-avatar-diffuso.md §4. */
.gm-forum-post__autore {
	display: flex;
	align-items: center;
	gap: var(--gm-space-sm);
	margin: var(--gm-space-xs) 0;
}

.gm-forum-post__autore-nome {
	font-weight: 600;
}

.gm-forum-nuovo-post {
	background: var(--gm-color-surface);
	border: 1px solid var(--gm-color-border);
	border-radius: var(--gm-radius);
	padding: var(--gm-space-lg);
	margin-bottom: var(--gm-space-xl);
}

.gm-forum-form label {
	font-weight: 600;
}

.gm-forum-form input[type="text"],
.gm-forum-form select,
.gm-forum-form textarea {
	width: 100%;
	max-width: 480px;
	margin-top: var(--gm-space-xs);
	font-family: var(--gm-font-ui);
}

/* ==========================================================================
   single-utente.php
   ========================================================================== */

.gm-utente-page__header {
	display: flex;
	gap: var(--gm-space-lg);
	align-items: flex-start;
}

.gm-utente-page__avatar {
	width: 96px;
	height: 96px;
	object-fit: cover;
	border-radius: 50%;
	flex-shrink: 0;
}

.gm-utente-page__identita p {
	margin: var(--gm-space-xs) 0;
}

.gm-utente-page__identita .gm-btn {
	margin-top: var(--gm-space-sm);
}

/* ==========================================================================
   Header: ricerca rapida e widget login/profilo — inc/header-ricerca.php,
   inc/header-widget-login.php (brief home-header §3). Entrambi vivono dentro
   .inside-navigation (GeneratePress), quindi come elementi di quella riga
   flex: margin-left:auto sul widget login lo spinge in fondo, coerente con
   la posizione a destra che aveva prima (ma stavolta dentro la struttura
   reale dell'header, non fuori via CSS).
   ========================================================================== */

.gm-header-utente {
	display: flex;
	align-items: center;
	gap: var(--gm-space-md);
	margin-left: auto;
	padding: var(--gm-space-sm) var(--gm-space-md);
	font-size: 0.9rem;
}

.gm-ricerca-header {
	position: relative;
	display: flex;
	align-items: center;
	padding: var(--gm-space-sm) var(--gm-space-md);
}

.gm-ricerca-header input[type="search"] {
	width: 100%;
	max-width: 220px;
	font-family: var(--gm-font-ui);
	font-size: 0.9rem;
	padding: 6px 10px;
	border: 1px solid var(--gm-color-border);
	border-radius: var(--gm-radius);
	background: var(--gm-color-surface);
	color: var(--gm-color-text);
}

.gm-ricerca-header .gm-autocomplete-risultati {
	position: absolute;
	top: 100%;
	left: var(--gm-space-md);
	width: calc(100% - var(--gm-space-md) * 2);
	max-width: 280px;
}

/* ==========================================================================
   Form modifica profilo — inc/profilo-utente.php, single-utente.php
   ========================================================================== */

.gm-notice {
	padding: var(--gm-space-sm) var(--gm-space-md);
	margin-bottom: var(--gm-space-md);
	border-radius: var(--gm-radius);
	border: 1px solid var(--gm-color-border);
}

.gm-notice--success {
	border-color: var(--gm-color-success);
	background: color-mix(in srgb, var(--gm-color-success) 12%, var(--gm-color-surface));
}

.gm-notice--errore {
	border-color: var(--gm-color-danger);
	background: color-mix(in srgb, var(--gm-color-danger) 12%, var(--gm-color-surface));
}

.gm-notice--errore ul {
	margin: 0;
	padding-left: 1.2em;
}

.gm-profilo-modifica {
	background: var(--gm-color-surface);
	border: 1px solid var(--gm-color-border);
	border-radius: var(--gm-radius);
	padding: var(--gm-space-lg);
	margin-bottom: var(--gm-space-xl);
}

.gm-profilo-form label {
	font-weight: 600;
}

.gm-profilo-form input[type="text"],
.gm-profilo-form input[type="email"],
.gm-profilo-form input[type="file"],
.gm-profilo-form input[type="date"],
.gm-profilo-form textarea {
	width: 100%;
	max-width: 480px;
	margin-top: var(--gm-space-xs);
	font-family: var(--gm-font-ui);
}

.gm-profilo-form .gm-utente-page__avatar {
	width: 80px;
	height: 80px;
	display: block;
	margin-bottom: var(--gm-space-xs);
}

/* ==========================================================================
   Form scrivi recensione — inc/recensioni-scrittura.php, single-locale.php
   ========================================================================== */

.gm-locale__cta {
	margin-top: var(--gm-space-md);
}

.gm-notice--info {
	border-color: var(--gm-color-secondary);
	background: color-mix(in srgb, var(--gm-color-secondary) 15%, var(--gm-color-surface));
}

.gm-recensione-scrivi-form label {
	font-weight: 600;
}

.gm-recensione-scrivi-form input[type="text"],
.gm-recensione-scrivi-form input[type="date"],
.gm-recensione-scrivi-form input[type="number"],
.gm-recensione-scrivi-form select,
.gm-recensione-scrivi-form textarea {
	width: 100%;
	max-width: 480px;
	margin-top: var(--gm-space-xs);
	font-family: var(--gm-font-ui);
}

.gm-tag-chips {
	display: inline-flex;
	flex-wrap: wrap;
	gap: var(--gm-space-xs);
	margin-bottom: var(--gm-space-xs);
}

.gm-tag-chip {
	display: inline-flex;
	align-items: center;
	background: var(--gm-color-surface);
	border: 1px solid var(--gm-color-border);
	border-radius: 999px;
	padding: 2px 4px 2px 10px;
	font-size: 0.85rem;
}

.gm-tag-chip-rimuovi {
	border: 0;
	background: none;
	cursor: pointer;
	margin-left: 4px;
	padding: 0 6px;
	font-size: 14px;
	line-height: 1;
	color: var(--gm-color-text-muted);
}

.gm-autocomplete-risultati {
	display: none;
	position: relative;
	max-width: 480px;
	border: 1px solid var(--gm-color-border);
	border-radius: var(--gm-radius);
	background: var(--gm-color-surface);
	box-shadow: 0 2px 6px rgba(0, 0, 0, .1);
	max-height: 220px;
	overflow-y: auto;
	z-index: 10;
}

.gm-autocomplete-voce {
	display: block;
	padding: 6px 10px;
	cursor: pointer;
	color: inherit;
	text-decoration: none;
}

.gm-autocomplete-voce:hover {
	background: var(--gm-color-background);
}

/* Nome + località (comune/provincia) nel suggest — aiuta a distinguere gli
   omonimi (richiesta di Luigi dopo l'uso reale, 27/08/2026). */
.gm-autocomplete-voce__localita {
	color: var(--gm-color-text-muted);
	font-size: 0.85em;
}

.gm-autocomplete-voce__localita::before {
	content: ' · ';
}

/* ==========================================================================
   Pagina di conferma invio recensione — inc/recensioni-scrittura.php,
   templates/recensione-inviata.php (brief responsive §4).
   ========================================================================== */

.gm-conferma {
	text-align: center;
	padding: var(--gm-space-xl) var(--gm-space-md);
}

.gm-conferma__testo {
	margin-bottom: var(--gm-space-lg);
	font-size: 1.05rem;
}

/* ==========================================================================
   Home page — front-page.php, inc/home-query.php (brief home-header §2).
   ========================================================================== */

.gm-home__hero {
	/* Piena larghezza reale, non un trucco CSS (brief hero-margine-fix §2):
	   renderizzato via hook generate_after_header, quindi figlio diretto di
	   <body>, fuori da qualunque contenitore con max-width — niente più
	   width:100vw/margini negativi (soffrivano di un bug di shrink-to-fit
	   sul genitore .gm-home, vedi commento in front-page.php). */
	position: relative;
	height: 420px;
	overflow: hidden;
}

.gm-home__hero-track {
	height: 100%;
}

.gm-home__hero-slide {
	position: absolute;
	inset: 0;
	display: flex;
	align-items: center;
	justify-content: center;
	opacity: 0;
	visibility: hidden;
	transition: opacity 1.4s ease;
}

.gm-home__hero-slide.is-active {
	opacity: 1;
	visibility: visible;
}

.gm-home__hero-slide img {
	position: absolute;
	inset: 0;
	width: 100%;
	height: 100%;
	object-fit: cover;
	display: block;
}

/* Overlay testo centrato (orizzontale e verticale) sulla slide, unico
   contenitore per titolo+sottotitolo — pattern fornito da Luigi (brief
   rifiniture §1): sfondo chiaro semi-trasparente, leggibile a prescindere
   dai toni dell'immagine sotto. Testo con i colori normali del tema (eredita
   da h1-h6/body), non più bianco forzato su scrim scuro. */
.gm-home__hero-testo {
	position: relative;
	z-index: 1;
	max-width: 640px;
	margin: 0 var(--gm-space-lg);
	padding: 60px;
	background: rgba(2, 1, 1, 0.40);
	text-align: center;
}

.gm-home__hero-testo h2 {
	margin: 0 0 var(--gm-space-xs);
	color: white;
}

.gm-home__hero-testo p {
	margin: 0;
	color: white;
}

.gm-home__hero-dots {
	position: absolute;
	bottom: var(--gm-space-md);
	right: var(--gm-space-lg);
	display: flex;
	gap: var(--gm-space-xs);
}

.gm-home__hero-dot {
	width: 10px;
	height: 10px;
	border-radius: 50%;
	border: 1.5px solid #fff;
	background: transparent;
	padding: 0;
	cursor: pointer;
}

.gm-home__hero-dot.is-active {
	background: #fff;
}

/* #content (GeneratePress) è display:flex — senza un width esplicito, .gm-home
   (unico flex item reale) si restringe al proprio contenuto massimo invece di
   riempire lo spazio disponibile, restando allineato a sinistra e non centrato
   nel viewport (brief hero-margine-fix §3: stessa causa radice dell'hero,
   verificata dal vivo, riguarda tutta la home non solo il carosello). */
.gm-home {
	width: 100%;
}

.gm-home__contenuto {
	max-width: 1100px;
	margin: var(--gm-space-xl) auto;
	padding: 0 var(--gm-space-md);
}

.gm-home__testo {
	max-width: 780px;
	margin-left: auto;
	margin-right: auto;
	text-align: center;
}

.gm-home__counter-titolo {
	text-align: center;
	margin-bottom: var(--gm-space-lg);
}

.gm-home__counter-items {
	display: flex;
	flex-wrap: wrap;
	justify-content: space-around;
	gap: var(--gm-space-lg);
	text-align: center;
}

.gm-home__counter-numero {
	display: block;
	font-family: var(--gm-font-ui);
	font-weight: 700;
	font-size: 2.2rem;
	color: var(--gm-color-primary);
}

.gm-home__counter-label {
	display: block;
	color: var(--gm-color-text-muted);
	font-size: 0.9rem;
}

.gm-home__liste-grid {
	display: grid;
	grid-template-columns: repeat(4, 1fr);
	gap: var(--gm-space-lg);
	align-items: start;
}

/* Le colonne 1fr hanno un min-width implicito pari al contenuto: senza
   azzerarlo, un elemento .gm-ultimi5__item con testo nowrap lungo spinge la
   sua colonna oltre la quota, sforando il contenitore a destra (le altre
   colonne non si stringono di conseguenza). */
.gm-home__lista {
	min-width: 0;
}

.gm-home__lista--principale {
	grid-column: span 1;
}

.gm-home__lista h2 {
	font-size: 1.1rem;
	margin-bottom: var(--gm-space-sm);
	text-align: center;
}

.gm-home__lista-items {
	list-style: none;
	margin: 0;
	padding: 0;
}

/* Ogni elemento delle quattro liste "ultimi 5" è una mini-card "inscatolata"
   (brief rifiniture §4.3), due righe (aggiornamento su richiesta di Luigi —
   un locale/titolo lungo da solo può già riempire una riga singola,
   lasciando il resto troncato via dall'ellissi; con due righe ognuna tronca
   per conto suo, quindi cappelli/utente/secondo termine hanno sempre spazio
   garantito). */
.gm-ultimi5__item {
	display: block;
	border: 1px solid var(--gm-color-primary);
	background: var(--gm-color-surface-neutral);
	border-radius: var(--gm-radius);
	padding: var(--gm-space-sm) var(--gm-space-md);
	margin-bottom: var(--gm-space-sm);
}

.gm-ultimi5__item a {
	display: block;
	text-decoration: none;
}

.gm-ultimi5__riga {
	display: block;
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
}

.gm-ultimi5__riga + .gm-ultimi5__riga {
	margin-top: 2px;
}

.gm-home__locali-grid {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(160px, 1fr));
	justify-content: center;
	gap: var(--gm-space-md);
}

.gm-home__locale-card {
	display: block;
	border: 1px solid var(--gm-color-border);
	border-radius: var(--gm-radius);
	overflow: hidden;
	background: var(--gm-color-surface);
	text-decoration: none;
	color: inherit;
}

.gm-home__locale-card img {
	width: 100%;
	height: 110px;
	object-fit: cover;
	display: block;
	background: var(--gm-color-surface-alt);
}

.gm-home__locale-card-nome {
	display: block;
	padding: var(--gm-space-sm);
	font-weight: 600;
	font-size: 0.9rem;
}

/* ==========================================================================
   Responsive — breakpoint unico 768px, solo via media query, nessun markup
   duplicato (brief gustamodena-brief-responsive.md §1). Non toccare i blocchi
   già verificati funzionanti (§2 del brief): scheda locale (griglia orari,
   in sintesi, interazioni, sono stati qui), forum, recensione singola con
   commenti, modifica profilo, tag cloud — quei layout si affidano già al
   reflow naturale (flex-wrap / grid auto-fit) e non necessitano di regole qui.
   ========================================================================== */

@media (max-width: 768px) {

	/* Tabella recensioni (archive-recensioni.php) → card, stesso <table>
	   semantico, solo un data-label per cella (brief responsive §3). */
	.gm-recensioni-tabella,
	.gm-recensioni-tabella thead,
	.gm-recensioni-tabella tbody,
	.gm-recensioni-tabella th,
	.gm-recensioni-tabella td,
	.gm-recensioni-tabella tr {
		display: block;
	}
	.gm-recensioni-tabella thead {
		display: none;
	}
	.gm-recensioni-tabella tr {
		margin-bottom: var(--gm-space-md);
		border: 1px solid var(--gm-color-border);
		border-radius: var(--gm-radius);
		padding: var(--gm-space-sm);
	}
	.gm-recensioni-tabella td {
		display: flex;
		flex-direction: column;
		align-items: flex-start;
		gap: 2px;
		padding: 6px 0;
		white-space: normal;
		border-bottom: none;
	}
	.gm-recensioni-tabella td::before {
		content: attr(data-label);
		font-weight: 600;
		font-size: 0.75rem;
		text-transform: uppercase;
		letter-spacing: 0.02em;
		color: var(--gm-color-text-muted);
	}

	/* Immagine in evidenza: impilata sotto i dati anagrafici invece che
	   accanto (brief responsive §6). */
	.gm-locale__top {
		flex-direction: column;
	}
	.gm-locale__top .gm-immagine-evidenza {
		max-width: 100%;
		flex-basis: auto;
	}

	/* Home: hero più basso, liste e counter impilati (brief home-header §2). */
	.gm-home__hero {
		height: 260px;
	}
	.gm-home__liste-grid {
		grid-template-columns: 1fr;
	}
	.gm-home__counter-items {
		justify-content: space-between;
		gap: var(--gm-space-md);
	}
	.gm-home__counter-numero {
		font-size: 1.6rem;
	}

	/* Header: la ricerca rapida sparisce dalla nav su mobile (rimane il
	   toggle menu, coerente col comportamento nav standard di GeneratePress)
	   — non c'è spazio per input + toggle + widget login sulla stessa riga. */
	.gm-ricerca-header {
		display: none;
	}
}

/* ==========================================================================
   Registrazione, login, recupero password "vestiti" — inc/registrazione.php,
   templates/registrati.php, templates/accedi.php,
   templates/password-dimenticata.php (brief registrazione-nuovo-utente).
   ========================================================================== */

.gm-auth-page {
	max-width: 480px;
}

.gm-auth-form .gm-campo {
	margin-bottom: var(--gm-space-md);
}

.gm-auth-form label {
	font-weight: 600;
}

.gm-auth-form label.gm-checkbox {
	display: flex;
	align-items: flex-start;
	gap: var(--gm-space-xs);
	font-weight: 400;
}

.gm-auth-form input[type="text"],
.gm-auth-form input[type="email"],
.gm-auth-form input[type="password"] {
	width: 100%;
	margin-top: var(--gm-space-xs);
	font-family: var(--gm-font-ui);
	box-sizing: border-box;
}

.gm-testo-successo {
	color: var(--gm-color-success);
}

.gm-testo-errore {
	color: var(--gm-color-danger);
}

/* Honeypot (§1.5 del brief): visibile nel markup, non type="hidden" — i bot
   semplici lo riempirebbero comunque — nascosto solo via posizionamento
   fuori schermo. */
.gm-hp-field {
	position: absolute;
	left: -9999px;
	width: 1px;
	height: 1px;
	overflow: hidden;
}
