/**
 * MyBoxOffice — la STRUTTURA dei riquadri della lista d'attesa.
 *
 * ⚠️ Qui dentro non c'e' nessun colore, nessuna dimensione di carattere, nessun
 * margine e nessun bordo dei riquadri: quelli li decide l'admin da
 * «Personalizza → Stile Box Biglietti → 🔔 Lista d'attesa», e scriverli anche
 * qui vorrebbe dire che due comandi si contendono la stessa proprieta' — con il
 * risultato che l'admin muove un cursore e non succede niente.
 *
 * Qui c'e' solo COMPORTAMENTO: cosa sta in fila, cosa va a capo, cosa e'
 * cliccabile. Regola d'oro del progetto: il layout strutturale puo' restare
 * fisso, lo stile no.
 *
 * Selettori proprietari `mybo-*`: nessuna dipendenza dal tema o da Elementor.
 *
 * @author  Fabio Vangelista
 */

/* --- il selettore «quanti posti cerchi» ------------------------------------ */

.mybo-waitlist-qty {
	display: flex;
	align-items: center;
	justify-content: space-between;
	flex-wrap: wrap;
	gap: 10px;
}

.mybo-waitlist-qty__pick {
	display: flex;
	gap: 6px;
	flex-wrap: wrap;
}

.mybo-waitlist-qty__opt {
	min-width: 38px;
	min-height: 38px; /* soglia del tocco su telefono */
	display: inline-flex;
	align-items: center;
	justify-content: center;
	cursor: pointer;
	font: inherit;
	color: inherit;
	background: transparent;
	border: 1px solid currentColor;
	border-radius: 7px;
	opacity: .55;
}

/* Acceso: si distingue dagli altri senza inventare un colore che l'admin non
   controlla — usa il colore del testo del riquadro, che invece controlla. */
.mybo-waitlist-qty__opt.is-on {
	opacity: 1;
	font-weight: 700;
	box-shadow: inset 0 0 0 1px currentColor;
}

/* --- i pulsanti ------------------------------------------------------------ */
/* Colori, misure e bordi arrivano dal gruppo «🔘 Pulsanti della lista
   d'attesa». Qui solo quello che li rende pulsanti. */

.mybo-waitlist-join__button,
.mybo-presale-notice__button,
.mybo-waitlist-missed__rejoin {
	display: block;
	width: 100%;
	box-sizing: border-box;
	cursor: pointer;
	font: inherit;
	text-decoration: none;
	border: 0;
}

/* --- il link per togliersi dalla lista ------------------------------------- */
/* Deve costare un tocco ed essere sempre in chiaro, mai nascosto in fondo. */

.mybo-waitlist-status__leave {
	display: inline-block;
	margin-top: 10px;
	padding: 6px 2px;
	background: none;
	border: 0;
	font: inherit;
	color: inherit;
	opacity: .75;
	text-decoration: underline;
	cursor: pointer;
}

.mybo-waitlist-status__leave:hover {
	opacity: 1;
}

/* --- quando qualcosa non ha funzionato ------------------------------------- */
/* Nasce solo se serve, e usa il colore del riquadro: un rosso inventato qui
   sarebbe l'unico colore della funzione che l'admin non può cambiare. */

.mybo-waitlist-error {
	margin: 10px 0 0;
	font-weight: 700;
}

/* --- il conto alla rovescia ------------------------------------------------ */

.mybo-presale-notice__countdown {
	font-variant-numeric: tabular-nums; /* le cifre non ballano mentre scorre */
}

/* --- su telefono ----------------------------------------------------------- */
/* Solo struttura: niente !important su proprieta' che l'admin governa, o gli
   impedirebbe di regolarle per schermo. */

@media (max-width: 767px) {
	.mybo-waitlist-qty {
		flex-direction: column;
		align-items: stretch;
	}
	.mybo-waitlist-qty__pick {
		justify-content: space-between;
	}
	.mybo-waitlist-qty__opt {
		flex: 1;
	}
}