/* ------------------------------------------------------------------
 * Fix menu mobile (tendina) — GLOBALE, su tutte le pagine.
 * Problema: la barra verde "welcome bar" è fixed in alto (h ~102px, z
 * altissimo) e copriva le prime voci del menu a tendina (il drawer
 * .side_wrap partiva da top:83px, sotto la barra → "CHI SIAMO" e il
 * tasto Close risultavano tagliati).
 * Soluzione: su telefono abbasso il drawer sotto la barra verde.
 * NB: 102px = altezza attuale della welcome bar su mobile (3 righe di
 * testo). Se il testo della barra cambia e va su più righe, aggiornare
 * questo valore.
 * ------------------------------------------------------------------ */
@media (max-width: 767px) {
	.side_wrap {
		top: 102px !important;
		height: calc(100% - 102px) !important;
	}
	/* Il drawer è a tutta larghezza e il tasto di chiusura del tema (.close)
	 * era display:none + senza icona → menu non chiudibile. Lo mostro come X
	 * chiara, tappabile (il click è già agganciato al JS del tema: verificato
	 * che chiude il menu).
	 * IMPORTANTE: la X NON deve stare sopra le voci del menu, altrimenti il tap
	 * reale colpisce il link sotto e naviga invece di chiudere. Perciò spingo
	 * giù tutto il menu (padding-top sul .panel_top) e metto la X in una fascia
	 * dedicata in alto, dove sotto non c'è nessun link. */
	.side_wrap .panel_top { padding-top: 54px !important; }
	.side_wrap .close {
		display: flex !important;
		align-items: center;
		justify-content: center;
		width: 40px !important;
		height: 40px !important;
		top: 7px !important;
		right: 14px !important;
		left: auto !important;
		bottom: auto !important;
		font-size: 0 !important; /* nasconde il testo "Close" */
		background: rgba(42, 28, 24, .12);
		border-radius: 50%;
		z-index: 50 !important;
		cursor: pointer;
	}
	.side_wrap .close::before {
		content: "\00d7"; /* × */
		font-size: 30px;
		line-height: 1;
		color: #2a1c18;
		font-family: Arial, Helvetica, sans-serif;
	}
}
