/**
 * Eventi con data da definire — riquadro data.
 *
 * Il riquadro del tema NON cambia dimensione: resta 100x100px in lista e
 * 72x72px sovrapposto all'immagine. Dentro ci va il mese sopra e l'anno sotto,
 * al posto di giorno e mese.
 *
 * Il problema è che il nome del mese non ha lunghezza fissa: "Marzo" sono 5
 * lettere, "Settembre" 9. Il corpo del testo scende al crescere del nome, così
 * la parola sta sempre dentro senza allargare il riquadro. La classe la
 * assegna il PHP: vedi proloco_tbd_month_size_class() in
 * framework/eventi-data-da-definire.php
 *
 * Le misure sono su due livelli:
 *   base      → sta nei 76px utili del riquadro così com'è (padding 12px)
 *   con :has()→ il padding interno scende a 4px, restano 92px utili e il testo
 *               può essere più grande. La scatola resta 100x100 perché il tema
 *               usa box-sizing: border-box.
 */

.proloco-tbd__month,
.proloco-tbd__year {
	display: block;
	width: 100%;
	text-align: center;
	text-transform: uppercase;
	line-height: 1.1;
	letter-spacing: 0;
	/* Ultima spiaggia: se un font più largo del previsto non ci sta, la parola
	   va a capo dentro al riquadro invece di uscirne. */
	overflow-wrap: break-word;
}

/* --- Riquadro 100x100 (lista eventi, scheda evento, homepage) ------------ */

/* Marzo, Aprile, Maggio, Giugno, Luglio, Agosto */
.proloco-tbd__month {
	font-size: 17px;
	font-weight: 700;
}

/* Gennaio, Ottobre */
.proloco-tbd__month--medium {
	font-size: 14px;
}

/* Febbraio, Novembre, Dicembre */
.proloco-tbd__month--long {
	font-size: 12px;
}

/* Settembre */
.proloco-tbd__month--xlong {
	font-size: 11px;
}

.proloco-tbd__year {
	font-size: 13px;
	font-weight: 600;
	opacity: 0.9;
}

/* Padding interno ridotto: stessa scatola, più spazio per la parola. */
.bt-post--start-date:has(.proloco-tbd__month),
.bt-tribe-event--start-date:has(.proloco-tbd__month) {
	padding-left: 4px;
	padding-right: 4px;
}

.bt-post--start-date:has(.proloco-tbd__month) .proloco-tbd__month,
.bt-tribe-event--start-date:has(.proloco-tbd__month) .proloco-tbd__month {
	font-size: 19px;
}

.bt-post--start-date:has(.proloco-tbd__month) .proloco-tbd__month--medium,
.bt-tribe-event--start-date:has(.proloco-tbd__month) .proloco-tbd__month--medium {
	font-size: 17px;
}

.bt-post--start-date:has(.proloco-tbd__month) .proloco-tbd__month--long,
.bt-tribe-event--start-date:has(.proloco-tbd__month) .proloco-tbd__month--long {
	font-size: 15px;
}

.bt-post--start-date:has(.proloco-tbd__month) .proloco-tbd__month--xlong,
.bt-tribe-event--start-date:has(.proloco-tbd__month) .proloco-tbd__month--xlong {
	font-size: 13px;
}

/* --- Riquadro 72x72 sovrapposto all'immagine (vista griglia) ------------- */

.bt-start-date .proloco-tbd__month {
	font-size: 13px;
}

.bt-start-date .proloco-tbd__month--medium {
	font-size: 11px;
}

.bt-start-date .proloco-tbd__month--long {
	font-size: 10px;
}

.bt-start-date .proloco-tbd__month--xlong {
	font-size: 9px;
}

.bt-start-date .proloco-tbd__year {
	font-size: 11px;
}

.bt-start-date:has(.proloco-tbd__month) {
	padding-left: 4px;
	padding-right: 4px;
}

/* --- Vista elenco di The Events Calendar --------------------------------- */

.tribe-events-calendar-list__event-date-tag--tbd .tribe-events-calendar-list__event-date-tag-datetime {
	justify-content: center;
}

/* Su schermi stretti quel riquadro scende a 54px di larghezza. */
@media (max-width: 767.98px) {
	.tribe-events-calendar-list__event-date-tag--tbd .proloco-tbd__month {
		font-size: 13px;
	}

	.tribe-events-calendar-list__event-date-tag--tbd .proloco-tbd__month--medium {
		font-size: 11px;
	}

	.tribe-events-calendar-list__event-date-tag--tbd .proloco-tbd__month--long,
	.tribe-events-calendar-list__event-date-tag--tbd .proloco-tbd__month--xlong {
		font-size: 10px;
	}

	.tribe-events-calendar-list__event-date-tag--tbd .proloco-tbd__year {
		font-size: 11px;
	}
}

/* --- Box "Dettagli" della scheda evento ---------------------------------- */

.proloco-tbd-meta-item .tribe-events-meta-value {
	font-weight: 600;
}