/* =============================================================================
   MailFlow Engine — Public (frontend) styles.
   Minimal default — l'utente può sovrascrivere via CSS del form o del tema.
   ========================================================================== */

.mailflow-form-wrapper {
	font-family: inherit;
	color: inherit;
	box-sizing: border-box;
	max-width: 100%;
}

.mailflow-form-wrapper *,
.mailflow-form-wrapper *::before,
.mailflow-form-wrapper *::after {
	box-sizing: border-box;
}

.mailflow-form {
	display: flex;
	flex-direction: column;
	gap: 10px;
	margin: 0;
	padding: 0;
}

.mailflow-form-wrapper .mailflow-input {
	width: 100%;
	padding: 11px 14px;
	font-size: 15px;
	font-family: inherit;
	color: #1d2327;
	background: #fff;
	border: 1px solid #c3c4c7;
	border-radius: 6px;
	line-height: 1.3;
	transition: border-color .15s, box-shadow .15s;
}

.mailflow-form-wrapper .mailflow-input:focus {
	outline: none;
	border-color: #2271b1;
	box-shadow: 0 0 0 3px rgba(34, 113, 177, 0.15);
}

.mailflow-form .mailflow-btn, .mailflow-popup .mailflow-btn {
	display: inline-block;
	padding: 11px 22px;
	font-size: 15px;
	font-weight: 500;
	font-family: inherit;
	color: #fff;
	background: #2271b1;
	border: 1px solid #2271b1;
	border-radius: 6px;
	cursor: pointer;
	transition: background .15s, border-color .15s;
}

.mailflow-form .mailflow-btn:hover:not(:disabled), .mailflow-popup .mailflow-btn:hover:not(:disabled) {
	background: #135e96;
	border-color: #135e96;
}

.mailflow-form .mailflow-btn:disabled, .mailflow-popup .mailflow-btn:disabled {
	opacity: .6;
	cursor: not-allowed;
}

.mailflow-form__privacy {
	display: block;
	font-size: 12px;
	color: #646970;
	margin-top: 4px;
	line-height: 1.45;
}

.mailflow-form__message {
	font-size: 14px;
	padding: 0;
	margin: 0;
	border-radius: 6px;
	transition: padding .15s, background .15s;
}

.mailflow-form__message.is-success {
	background: #e7f6ec;
	color: #14532d;
	border: 1px solid #bfe5c8;
	padding: 10px 14px;
}

.mailflow-form__message.is-error {
	background: #fdf0f0;
	color: #78201d;
	border: 1px solid #f0b7b7;
	padding: 10px 14px;
}

.mailflow-checkbox {
	display: flex;
	align-items: flex-start;
	gap: 8px;
	font-size: 13px;
	color: #3c434a;
	cursor: pointer;
}

/* -----------------------------------------------------------------------------
   POPUP
   -------------------------------------------------------------------------- */

.mailflow-popup {
	position: fixed;
	inset: 0;
	z-index: 999999;
	display: flex;
	align-items: center;
	justify-content: center;
	padding: 20px;
	animation: mfpFadeIn .2s ease-out;
}

.mailflow-popup[hidden] { display: none; }

.mailflow-popup__backdrop {
	position: absolute;
	inset: 0;
	background: rgba(15, 23, 42, 0.55);
}

.mailflow-popup__panel {
	position: relative;
	background: #fff;
	border-radius: 12px;
	max-width: 480px;
	width: 100%;
	/* il padding alto e' maggiorato per lasciare posto al bottone di chiusura:
	   con 32px uniformi la X finiva sopra al primo campo del form */
	padding: 46px 32px 32px;
	box-shadow: 0 20px 50px rgba(15, 23, 42, 0.25);
	animation: mfpZoomIn .25s cubic-bezier(.16,1,.3,1);
	max-height: calc(100vh - 40px);
	overflow-y: auto;
}

/* NOTA DI CASCATA — non abbassare questi selettori a classe singola.
   Hello Elementor (e diversi altri temi) stilano i bottoni con
   [type="button"],[type="submit"],button{...}. Un selettore di ATTRIBUTO pesa 0,1,0,
   cioe' quanto una classe: contro .mailflow-btn e' un pareggio, e a parita' di
   specificita' vince chi viene dopo — di norma il tema. Il sintomo su poderelucano
   era la X di chiusura che restava 44px con border-radius 3px invece di 36px tonda.
   Scopare la regola dentro il contenitore (0,2,0) risolve senza ricorrere a !important. */
.mailflow-popup .mailflow-popup__close {
	position: absolute;
	top: 12px;
	right: 12px;
	/* riquadro fisso con centratura flex: il vecchio padding 6px/10px su una glifo "×"
	   lo lasciava otticamente fuori asse, e top/right diversi peggioravano la cosa */
	width: 36px;
	height: 36px;
	display: flex;
	align-items: center;
	justify-content: center;
	padding: 0;
	background: transparent;
	border: 0;
	font-size: 24px;
	line-height: 1;
	color: #8c8f94;
	cursor: pointer;
	border-radius: 50%;
	transition: background .15s, color .15s;
}

.mailflow-popup .mailflow-popup__close:hover {
	background: #f6f7f9;
	color: #1d2327;
}

.mailflow-popup__body {
	padding-top: 4px;
}

button.mailflow-popup-trigger {
	display: inline-block;
	padding: 10px 20px;
	font-size: 14px;
	font-weight: 500;
	color: #fff;
	background: #2271b1;
	border: 0;
	border-radius: 6px;
	cursor: pointer;
	font-family: inherit;
}

button.mailflow-popup-trigger:hover {
	background: #135e96;
}

@keyframes mfpFadeIn {
	from { opacity: 0; }
	to   { opacity: 1; }
}

@keyframes mfpZoomIn {
	from { opacity: 0; transform: scale(.94); }
	to   { opacity: 1; transform: scale(1); }
}

@media (max-width: 600px) {
	.mailflow-popup__panel {
		/* anche qui il posto per la X va conservato, o su mobile torna sul primo campo */
		padding: 44px 20px 24px;
		max-width: 100%;
	}
}