.guest-access-form{

	width:100%;

}

.guest-access-wrapper{

	width:100%;

}

.guest-access{

	position:relative;
	width:100%;
	display:flex;
	align-items:center;

}

.guest-access-form #guest-access-code{

	width:100%;
	height:48px;
	border:none;
	outline:none;
	background:transparent;
	font-family:'Oswald',sans-serif;
	font-size:22px;
	letter-spacing:3px;
	color:#444;
	text-align:center;
	padding:0 80px 0 18px;
	box-sizing:border-box;

}

#guest-access-code::placeholder{

	color:#555;
	letter-spacing:3px;

}

#guest-access-code:focus::placeholder{

	color:transparent;

}

#guest-access-button{

	position:relative;
	z-index:999999;
	pointer-events:auto;
	border:none;
	background:transparent;
	cursor:pointer;
	padding:0;
	display:flex;
	align-items:center;
	justify-content:center;
	-webkit-appearance:none;
	appearance:none;

}

#guest-access-button img{

	display:block;
	user-select:none;
	-webkit-user-drag:none;
	pointer-events:none;

}

.guest-access-form #guest-access-eye{

	position:absolute;
	right:72px;
	top:50%;
	transform:translateY(-50%);
	width:20px;
	height:20px;
	display:flex;
	align-items:center;
	justify-content:center;
	cursor:pointer;
	z-index:5;

}

.guest-access-form #guest-access-eye img{

	width:20px;
	height:20px;
	display:block;

}

.guest-access-remember{

	margin-top:18px;
	text-align:center;

}

.guest-access-remember label{

	display:inline-flex;
	align-items:center;
	gap:10px;
	cursor:pointer;
	font-size:16px;
	font-family:'Oswald',sans-serif;
	color:#666666;

}

.guest-access-remember input[type="checkbox"]{

	appearance: none;
	-webkit-appearance: none;
	width:18px;
	height:18px;
	margin: 0;
	border: 2px solid #E3A18F;
	border-radius: 3px;
	background: #fff;
	cursor:pointer;
	position: relative;

}

.guest-access-remember input[type="checkbox"]:checked{

	background: #E3A18F;
	border-color: #E3A18F;

}

.guest-access-remember input[type="checkbox"]:checked::after{

	content: "";
	position: absolute;
	left: 5px;
	top: 1px;
	width: 4px;
	height: 9px;
	border: solid #ffffff;
	border-width: 0 2px 2px 0;
	transform: rotate(45deg);

}

.vdp-login-error{

	margin-top:16px;
	text-align:center;
	color:#b00020;
	font-size:15px;
	font-family:'Oswald',sans-serif;
	font-weight:500;

}

@media (max-width:767px){

	#guest-access-code{
		font-size:20px;
	}
	.guest-remember label{
		font-size:15px;
	}

}
/* ---------------------------------------------------------
   Cambio password
   --------------------------------------------------------- */

.vdp-change-password-form {
	display: flex;
	flex-direction: column;
	gap: 6px;
	max-width: 420px;
}

.vdp-change-password-form label {
	font-family: 'Oswald', sans-serif;
	font-size: 12px;
	letter-spacing: 0.16em;
	text-transform: uppercase;
	color: #b08a82;
	margin-top: 14px;
}

.vdp-change-password-form input {
	background: rgba(255, 248, 244, 0.72);
	border: 1px solid rgba(120, 90, 80, 0.10);
	box-shadow: none;
	padding: 12px 14px;
	font-size: 16px;
	color: #2f2f2f;
}

.vdp-change-password-hint {
	font-size: 14px;
	color: #8a8a8a;
	margin: 10px 0 0;
}

/*
 * Gli !important servono: senza, il CSS di Elementor riempie
 * il pulsante di rosso al passaggio del mouse, perché tratta
 * ogni <button> come i pulsanti del tema.
 */
.vdp-change-password-btn,
.vdp-change-password-btn:hover,
.vdp-change-password-btn:focus,
.vdp-change-password-btn:active {
	display: inline-flex;
	align-items: center;
	gap: 12px;
	background: none !important;
	background-color: transparent !important;
	border: none !important;
	box-shadow: none !important;
	padding: 0 !important;
	margin-top: 22px;
	cursor: pointer;
	font-family: 'Oswald', sans-serif;
	font-size: 15px;
	letter-spacing: 0.16em;
	text-transform: uppercase;
	color: #2f2f2f !important;
	transition: color 0.2s ease;
}

/*
 * Al passaggio del mouse cambia colore soltanto la freccia,
 * che diventa terracotta come nel resto del sito e nelle mail.
 * La freccia è un SVG che eredita il colore del testo, quindi
 * basta colorare lei e non serve toccare l'immagine.
 */
.vdp-change-password-btn:hover .vdp-change-password-arrow {
	color: #b08a82;
}

.vdp-change-password-arrow {
	width: 28px;
	height: 28px;
	flex-shrink: 0;
}

.vdp-change-password-ok,
.vdp-change-password-ko {
	font-size: 15px;
	line-height: 1.6;
	margin-bottom: 16px;
}

.vdp-change-password-ok {
	color: #1d7a3c;
}

.vdp-change-password-ko {
	color: #b32d2e;
}

/* Campo email nella pagina di accesso */
.guest-access--email {
	margin-bottom: 12px;
}

/* Campo password con occhio, nel cambio password */
.vdp-pwd-field {
	position: relative;
	display: block;
}

.vdp-pwd-field input {
	width: 100%;
	padding-right: 48px;
	box-sizing: border-box;
}

.vdp-pwd-eye {
	position: absolute;
	right: 14px;
	top: 50%;
	transform: translateY(-50%);
	cursor: pointer;
	line-height: 0;
	opacity: 0.55;
}

.vdp-pwd-eye:hover {
	opacity: 1;
}

/*
 * Voce "Cambia la password" nelle Impostazioni.
 *
 * Valori identici a quelli di "Esci dalla Guest Lounge" in
 * logout.css: così le due voci partono uguali, e le eventuali
 * personalizzazioni fatte in Elementor si applicano allo stesso
 * modo a entrambe.
 */
/*
 * display: flex e larghezza fissa, come le altre voci delle
 * Impostazioni.
 *
 * Niente inline-flex: con quello il link si stringe al testo e
 * il margin-left: auto della freccia non ha spazio dove
 * spingersi, lasciandola attaccata alla scritta.
 */
.vdp-settings-link {
	display: flex;
	align-items: center;
	width: 300px;
	max-width: 100%;
	padding-left: 0;
	text-decoration: none;
	color: inherit;
	text-align: left;
}

.vdp-settings-link:hover {
	color: #888 !important;
}

.elementor-widget-shortcode:has(.vdp-settings-link) {
	padding: 0 !important;
}

.e-con:has(> .elementor-widget-shortcode .vdp-settings-link) {
	padding: 0 !important;
}

/*
 * Freccia a 34px e spinta a destra: sono gli stessi valori che
 * le altre voci delle Impostazioni hanno dal CSS di Elementor.
 * Ripetuti qui perché il foglio del plugin viene caricato dopo,
 * e con 16px vincerebbe lui lasciando questa voce spaiata.
 */
.vdp-settings-link-arrow {
	width: 34px;
	height: 34px;
	margin-left: auto;
	flex-shrink: 0;
}


/* ---------------------------------------------------------
   Recupero password
   --------------------------------------------------------- */

.guest-access-reset {
	margin-top: 16px;
	text-align: center;
}

.guest-access-reset a,
.vdp-reset-link {
	font-size: 15px;
	color: #b08a82;
	text-decoration: none;
	border-bottom: 1px solid rgba(176, 138, 130, 0.35);
	padding-bottom: 1px;
}

.guest-access-reset a:hover,
.vdp-reset-link:hover {
	border-bottom-color: #b08a82;
}

.vdp-reset-form {
	display: flex;
	flex-direction: column;
	gap: 6px;
	max-width: 420px;
}

.vdp-reset-form label {
	font-family: 'Oswald', sans-serif;
	font-size: 12px;
	letter-spacing: 0.16em;
	text-transform: uppercase;
	color: #b08a82;
	margin-top: 14px;
}

.vdp-reset-form input {
	background: rgba(255, 248, 244, 0.72);
	border: 1px solid rgba(120, 90, 80, 0.10);
	box-shadow: none;
	padding: 12px 14px;
	font-size: 16px;
	color: #2f2f2f;
}

.vdp-reset-intro,
.vdp-reset-hint {
	font-size: 15px;
	line-height: 1.7;
	color: #8a8a8a;
	margin: 0 0 6px;
}

/*
 * Nessun limite di larghezza: con un massimo stretto il
 * messaggio andava a capo prima del testo sotto, e le due
 * righe sembravano scritte a misure diverse.
 */
.vdp-reset-ok,
.vdp-reset-ko {
	font-size: 16px;
	line-height: 1.7;
	margin-bottom: 18px;
}

.vdp-reset-ok { color: #1d7a3c; }
.vdp-reset-ko { color: #b32d2e; }

.vdp-reset-btn,
.vdp-reset-btn:hover,
.vdp-reset-btn:focus,
.vdp-reset-btn:active {
	display: inline-flex;
	align-items: center;
	gap: 12px;
	background: none !important;
	background-color: transparent !important;
	border: none !important;
	box-shadow: none !important;
	padding: 0 !important;
	margin-top: 22px;
	cursor: pointer;
	font-family: 'Oswald', sans-serif;
	font-size: 15px;
	letter-spacing: 0.16em;
	text-transform: uppercase;
	color: #2f2f2f !important;
	transition: color 0.2s ease;
}

.vdp-reset-btn:hover .vdp-reset-arrow {
	color: #b08a82;
}

.vdp-reset-arrow {
	width: 28px;
	height: 28px;
	flex-shrink: 0;
}

/* ---------------------------------------------------------
   Messaggi
   --------------------------------------------------------- */

.vdp-messages {
	display: flex;
	flex-direction: column;
	height: calc(100vh - 260px);
	min-height: 320px;
}

.vdp-messages-thread {
	flex: 1;
	overflow-y: auto;
	/* Si scorre solo in verticale, come in un'app di messaggi. */
	overflow-x: hidden;
	display: flex;
	flex-direction: column;
	gap: 12px;
	padding: 6px 2px 16px;
}

.vdp-messages,
.vdp-messages-index {
	max-width: 100%;
	overflow-x: hidden;
}

.vdp-messages-empty {
	color: #8a8a8a;
	font-size: 15px;
	line-height: 1.7;
}

.vdp-message {
	max-width: 78%;
	display: flex;
	flex-direction: column;
}

/*
 * Il fumetto si adatta al testo invece di allargarsi fino al
 * massimo consentito: il vuoto accanto a "G" veniva da lì.
 */
.vdp-message-bubble {
	width: fit-content;
	max-width: 100%;
}

.vdp-message--guest,
.vdp-message--guest .vdp-message-bubble {
	margin-right: auto;
}

.vdp-message--admin,
.vdp-message--admin .vdp-message-bubble {
	margin-left: auto;
}

/* Nome di chi scrive, sopra al testo, nel terracotta del logo. */
.vdp-message-autore {
	display: block;
	font-family: 'Oswald', sans-serif;
	font-size: 12px;
	letter-spacing: 0.10em;
	text-transform: uppercase;
	color: #C1552E;
	margin-bottom: 4px;
}

.vdp-message-testo {
	display: block;
	white-space: pre-wrap;
}

.vdp-message--guest {
	align-self: flex-end;
	align-items: flex-end;
}

.vdp-message--admin {
	align-self: flex-start;
	align-items: flex-start;
}

.vdp-message-bubble {
	padding: 10px 14px;
	border-radius: 14px;
	font-size: 15px;
	line-height: 1.6;
	/*
	 * Una parola lunghissima senza spazi (o un indirizzo web)
	 * allargava il fumetto oltre lo schermo, e da lì tutta la
	 * pagina scorreva di lato: qui la parola viene spezzata.
	 */
	overflow-wrap: anywhere;
	word-break: break-word;
	max-width: 100%;
}

.vdp-message--guest .vdp-message-bubble {
	/*
	 * Grigio chiaro neutro. Il testo è scuro: sul chiaro il
	 * bianco non si leggerebbe.
	 */
	background: #F2F2F2;
	color: #2f2f2f;
	border-bottom-right-radius: 4px;
}

.vdp-message--admin .vdp-message-bubble {
	background: rgba(227, 161, 143, 0.20);
	color: #2f2f2f;
	border-bottom-left-radius: 4px;
}

.vdp-message-time {
	font-size: 11px;
	color: #a3a3a3;
	margin-top: 3px;
	padding: 0 4px;
}

.vdp-messages-form {
	display: flex;
	align-items: flex-end;
	gap: 10px;
	border-top: 1px solid rgba(120, 90, 80, 0.10);
	padding-top: 14px;
}

.vdp-messages-form textarea {
	flex: 1;
	resize: none;
	background: rgba(255, 248, 244, 0.72);
	border: 1px solid rgba(120, 90, 80, 0.10);
	box-shadow: none;
	padding: 10px 14px;
	/*
	 * 16px non è una scelta estetica: sotto questa misura iOS
	 * ingrandisce da solo la pagina appena si tocca il campo, ed
	 * è quello lo "schermo che si allarga" mentre si scrive.
	 */
	font-size: 16px;
	color: #2f2f2f;
	font-family: inherit;
}

/*
 * Il bordo blu mentre si scrive è il contorno di sistema del
 * browser: lo sostituiamo con il terracotta della lounge.
 */
.vdp-messages-form textarea:focus,
.vdp-messages-form textarea:focus-visible {
	outline: none !important;
	box-shadow: none !important;
	border-color: rgba(176, 138, 130, 0.55) !important;
}

.vdp-messages-send,
.vdp-messages-send:hover,
.vdp-messages-send:focus,
.vdp-messages-send:active {
	/*
	 * Il tema/Elementor colora di serie i pulsanti submit: qui
	 * serve un pulsante "invisibile" che lasci vedere solo la
	 * freccia, quindi lo sfondo va azzerato anche negli stati
	 * hover/focus/active.
	 */
	background: none !important;
	background-color: transparent !important;
	background-image: none !important;
	border: none !important;
	box-shadow: none !important;
	outline: none;
	-webkit-appearance: none;
	appearance: none;
	border-radius: 0 !important;
	padding: 8px;
	cursor: pointer;
	color: #b08a82 !important;
	flex-shrink: 0;
}

/*
 * Anteprima dell'allegato scelto, sopra il campo di scrittura:
 * si vede che la foto c'è, e che manca solo premere invio.
 */
.vdp-messages-anteprima {
	display: flex;
	align-items: center;
	gap: 10px;
	padding: 8px 10px;
	margin-bottom: 8px;
	background: rgba(255, 248, 244, 0.72);
	border: 1px solid rgba(120, 90, 80, 0.10);
	border-radius: 10px;
}

.vdp-messages-anteprima-img {
	width: 46px;
	height: 46px;
	object-fit: cover;
	border-radius: 8px;
}

.vdp-messages-anteprima-nome {
	flex: 1;
	min-width: 0;
	font-size: 13px;
	color: #8a8a8a;
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
}

.vdp-messages-anteprima-invia,
.vdp-messages-anteprima-invia:hover,
.vdp-messages-anteprima-invia:focus {
	background: rgba(227, 161, 143, 0.28) !important;
	border: none !important;
	box-shadow: none !important;
	-webkit-appearance: none;
	appearance: none;
	border-radius: 999px !important;
	padding: 7px 16px;
	font-family: 'Oswald', sans-serif;
	font-size: 13px;
	letter-spacing: 0.12em;
	text-transform: uppercase;
	color: #8a5c4e !important;
	cursor: pointer;
	flex-shrink: 0;
}

.vdp-messages-anteprima-togli,
.vdp-messages-anteprima-togli:hover,
.vdp-messages-anteprima-togli:focus {
	background: none !important;
	border: none !important;
	box-shadow: none !important;
	-webkit-appearance: none;
	appearance: none;
	font-size: 22px;
	line-height: 1;
	color: #b08a82 !important;
	cursor: pointer;
	padding: 0 4px;
}

/* Graffetta: il campo file vero resta nascosto sotto l'icona. */
.vdp-messages-allega {
	display: inline-flex;
	align-items: center;
	cursor: pointer;
	color: #b08a82;
	flex-shrink: 0;
	padding: 8px;
}

.vdp-messages-allega input[type="file"] {
	display: none;
}

.vdp-messages-allega-icon {
	width: 24px;
	height: 24px;
}

/* Allegato dentro il fumetto. */
.vdp-message-allegato {
	margin-top: 8px;
	display: flex;
	flex-direction: column;
	gap: 6px;
}

.vdp-message-allegato img {
	max-width: 100%;
	border-radius: 10px;
	display: block;
}

.vdp-message-allegato-pdf {
	font-size: 14px;
	color: #2f2f2f;
	word-break: break-all;
}

.vdp-message-allegato-salva {
	font-size: 13px;
	color: #b08a82;
	text-decoration: underline;
}

.vdp-message-allegato-ritirato {
	margin-top: 8px;
	font-size: 13px;
	color: #8a8a8a;
	font-style: italic;
}

.vdp-messages-send svg {
	width: 28px;
	height: 28px;
}

/*
 * La freccia è disegnata con "currentColor", ma il tema colora i
 * pulsanti submit con una specificità più alta: qui il colore
 * viene imposto direttamente sul disegno.
 */
/*
 * La freccia di invio nel terracotta pieno del logo: nel rosa
 * smorzato non si distingueva dallo sfondo del campo. Le frecce
 * dell'indice restano tenui, lì non sono l'azione principale.
 */
/*
 * Riposo: ottagono pieno terracotta con la freccia bianca
 * dentro. Alla pressione contorno e freccia passano al grigio,
 * mentre l'area resta terracotta.
 */
.vdp-messages-send .vdp-freccia-area {
	fill: #C1552E !important;
}

.vdp-messages-send .vdp-freccia-bordo {
	fill: #C1552E !important;
}

.vdp-messages-send .vdp-freccia-punta {
	fill: #ffffff !important;
}

.vdp-messages-send:active .vdp-freccia-bordo,
.vdp-messages-send:active .vdp-freccia-punta {
	fill: #9A9A9A !important;
}

.vdp-messages-send svg * {
	stroke: none !important;
}

.vdp-messages-index-arrow,
.vdp-messages-index-arrow * {
	fill: #b08a82 !important;
	stroke: none !important;
}

/*
 * Vista amministratore in due schermate: prima l'indice di chi
 * ha scritto, poi la singola conversazione a tutta larghezza.
 */
.vdp-messages-index {
	display: flex;
	flex-direction: column;
}

.vdp-messages-index-item {
	display: flex;
	align-items: center;
	gap: 10px;
	border-bottom: 1px solid rgba(120, 90, 80, 0.10);
}

.vdp-messages-index-link {
	flex: 1;
	min-width: 0;
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 12px;
	padding: 16px 4px;
	text-decoration: none;
	color: #2f2f2f;
	font-size: 16px;
}

.vdp-messages-index-name {
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
}

/* Cestini: pulsanti senza sfondo, come la freccia di invio. */
.vdp-messages-delete-form {
	margin: 0;
	display: inline-flex;
}

.vdp-messages-delete,
.vdp-messages-delete:hover,
.vdp-messages-delete:focus,
.vdp-messages-delete:active {
	background: none !important;
	background-color: transparent !important;
	background-image: none !important;
	border: none !important;
	box-shadow: none !important;
	-webkit-appearance: none;
	appearance: none;
	border-radius: 0 !important;
	padding: 8px;
	cursor: pointer;
	color: #b08a82 !important;
	flex-shrink: 0;
	line-height: 0;
}

.vdp-messages-delete--small {
	padding: 0 4px;
}

.vdp-messages-delete-icon,
.vdp-messages-delete-icon * {
	fill: none !important;
	stroke: #b08a82 !important;
}

/* L'orario e il cestino del singolo messaggio sulla stessa riga. */
.vdp-message-time {
	display: flex;
	align-items: center;
	gap: 4px;
}

.vdp-messages-index-meta {
	display: flex;
	align-items: center;
	gap: 10px;
	flex-shrink: 0;
}

.vdp-messages-index-date {
	font-size: 12px;
	color: #a3a3a3;
}

.vdp-messages-index-arrow {
	width: 26px;
	height: 26px;
	color: #b08a82;
}

/* Sezione "Scrivi a": ospiti senza conversazione ancora aperta. */
.vdp-messages-index-nuova {
	margin-top: 26px;
}

.vdp-messages-index-titolo {
	font-family: 'Oswald', sans-serif;
	font-size: 13px;
	letter-spacing: 0.18em;
	text-transform: uppercase;
	color: #b08a82;
	margin-bottom: 6px;
}

.vdp-messages-back {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	text-decoration: none;
	color: #2f2f2f;
	font-size: 15px;
	padding-bottom: 10px;
}

.vdp-messages-back-arrow {
	width: 26px;
	height: 26px;
}

.vdp-messages-badge {
	background: #b08a82;
	color: #fff;
	font-size: 11px;
	line-height: 1;
	padding: 3px 6px;
	border-radius: 20px;
}

.vdp-messages--admin .vdp-messages-thread {
	flex: 1;
}

@media (max-width: 640px) {
	.vdp-messages--admin {
		flex-direction: column;
		height: auto;
	}
	.vdp-messages-list {
		width: 100%;
		flex-direction: row;
		flex-wrap: wrap;
	}
}

/* L'anteprima dell'allegato resta nascosta finché non si sceglie un file:
   senza questa regola il display:flex qui sopra vince sull'attributo hidden. */
.vdp-messages-anteprima[hidden] {
	display: none !important;
}

/* Arrivati in cima o in fondo ai messaggi, il trascinamento non passa
   alla pagina: lo skyline resta fermo. */
.vdp-messages-thread {
	overscroll-behavior: contain;
}

/*
 * Chat con la barra in stile WhatsApp.
 *
 * Nelle pagine con una chat aperta la nav bar a cinque icone
 * lascia il posto a una barra fissa: in fondo lo skyline, sopra
 * la riga per scrivere (casetta per tornare alla Home, campo di
 * scrittura con la graffetta dentro, invio). Tutto il resto
 * dello schermo è per i messaggi. È il plugin ad attivarla
 * (classe vdp-chat-mode sul body): se lo script non parte, la
 * pagina resta com'era, con la nav bar normale.
 */
body.vdp-chat-mode .vdp-bottom-nav {
	display: none !important;
}

.vdp-chat-bar {
	position: fixed;
	left: 0;
	right: 0;
	bottom: 0;
	z-index: 9999;
	background: #ffffff;
	/*
	 * Niente margine per la barretta della Home dell'iPhone: lo
	 * skyline arriva fino al bordo dello schermo e la barretta gli
	 * passa sopra, come fanno molte app.
	 */
	padding-bottom: 0;
	will-change: transform;
}

.vdp-chat-extra {
	padding: 0 12px;
}

.vdp-chat-extra .vdp-messages-anteprima {
	margin: 0 0 6px;
}

.vdp-chat-riga {
	display: flex;
	align-items: center;
	gap: 8px;
	padding: 8px 12px 6px;
}

.vdp-chat-home {
	flex-shrink: 0;
	display: flex;
	align-items: center;
	justify-content: center;
	width: 36px;
	height: 36px;
}

.vdp-chat-home img {
	width: 24px;
	height: 24px;
}

.vdp-chat-bar .vdp-messages-form {
	flex: 1;
	border-top: none;
	padding-top: 0;
	align-items: center;
	margin: 0;
}

.vdp-chat-campo {
	position: relative;
	flex: 1;
	display: flex;
}

.vdp-chat-bar .vdp-messages-form textarea {
	width: 100%;
	min-height: 0;
	height: auto;
	padding-right: 44px;
	line-height: 1.35;
	overflow-y: hidden;
}

.vdp-chat-campo .vdp-messages-allega {
	position: absolute;
	right: 8px;
	top: 50%;
	transform: translateY(-50%);
	margin: 0;
}

.vdp-chat-skyline {
	width: 100%;
	/*
	 * La parte alta del riquadro dello skyline è vuota (il disegno
	 * è appoggiato in basso): lo si fa salire sotto la riga per
	 * scrivere, così tra campo e tetti resta meno bianco. Il
	 * disegno non cambia né misura né taglio.
	 */
	margin-top: -30px;
	pointer-events: none;
}

.vdp-chat-riga,
.vdp-chat-extra {
	position: relative;
	z-index: 1;
}

/* Mentre si scrive la tastiera occupa mezzo schermo: sopra di lei
   resta solo la riga per scrivere, come su WhatsApp. */
body.vdp-chat-scrive .vdp-chat-skyline {
	display: none;
}

/*
 * L'ora sta dentro il fumetto, in basso a destra, come su
 * WhatsApp, un po' più grande di prima.
 */
.vdp-message-bubble .vdp-message-time {
	justify-content: flex-end;
	margin-top: 4px;
	padding: 0;
	font-size: 13px;
}

/*
 * Il cestino sta fuori dal fumetto, di fianco, all'altezza
 * dell'ora: a destra dei fumetti a sinistra, a sinistra di
 * quelli a destra (sempre verso il centro dello schermo).
 */
.vdp-message {
	flex-direction: row;
	align-items: flex-end;
	gap: 6px;
}

.vdp-message--admin .vdp-messages-delete-form {
	order: -1;
}

.vdp-message > .vdp-messages-delete-form {
	flex-shrink: 0;
	margin-bottom: 8px;
}