/* ====================================================================
   Polo80 - Form di iscrizione newsletter [ct_form_newsletter].
   Estende le classi/variabili del design system già definite nel CSS del
   Kit Elementor (--e-global-color-*), come già fatto in menu.css/eventi.css.
   ==================================================================== */

.pop-newsletter-form {
	max-width: 480px;
	margin: 0 auto;
	background-color: var(--e-global-color-panna-crema);
	border: var(--pop-border-width) solid var(--pop-border-color);
	border-radius: 0;
	box-shadow: 6px 6px 0 var(--pop-border-color);
	padding: 36px 32px;
}

.pop-newsletter-form__icona {
	display: flex;
	align-items: center;
	justify-content: center;
	width: 56px;
	height: 56px;
	margin: 0 auto 18px;
	background-color: var(--e-global-color-accent);
	border: var(--pop-border-width) solid var(--pop-border-color);
	border-radius: 50%;
}

.pop-newsletter-form__icona svg {
	width: 26px;
	height: 26px;
	fill: var(--e-global-color-panna-crema);
}

.pop-newsletter-form__intro {
	text-align: center;
	margin: 0 0 22px;
	/* Regola di contrasto del sito: verde scuro su crema/arancione. */
	color: var(--e-global-color-secondary);
	font-weight: 600;
}

.pop-newsletter-form__form {
	display: flex;
	flex-direction: column;
	gap: 16px;
}

.pop-newsletter-form__campo {
	display: flex;
	flex-direction: column;
	gap: 6px;
	font-weight: 600;
	color: var(--e-global-color-secondary);
}

.pop-newsletter-form__campo input[type="email"] {
	padding: 12px 14px;
	background-color: #fff;
	border: var(--pop-border-width) solid var(--pop-border-color);
	border-radius: 6px;
	font-size: 1rem;
	font-weight: 400;
}

.pop-newsletter-form__interessi {
	display: flex;
	flex-wrap: wrap;
	gap: 8px 20px;
	border: none;
	padding: 0;
	margin: 0;
}

.pop-newsletter-form__interessi legend {
	width: 100%;
	font-weight: 600;
	color: var(--e-global-color-secondary);
	margin-bottom: 6px;
	padding: 0;
}

.pop-newsletter-form__interessi label {
	display: flex;
	align-items: center;
	gap: 6px;
	font-weight: 400;
	color: var(--e-global-color-secondary);
}

/* Campo "honeypot" anti-spam: nascosto fuori schermo (non "display:none",
   che alcuni bot sanno riconoscere ed evitare) così resta invisibile e
   ininterrompibile per un utente reale ma un bot che compila tutti i campi
   del form lo riempie comunque — lato server (vedi newsletter-form.php) una
   submission con questo campo valorizzato viene scartata come spam. */
.pop-newsletter-form__honeypot {
	position: absolute;
	left: -9999px;
	width: 1px;
	height: 1px;
	overflow: hidden;
}

.pop-newsletter-form__pulsante {
	align-self: flex-start;
}

.pop-newsletter-form__disiscrizione {
	gap: 0;
}

.pop-newsletter-form__link-disiscrizione {
	background: none;
	border: none;
	padding: 0;
	color: var(--e-global-color-secondary);
	text-decoration: underline;
	font-size: 0.9rem;
	cursor: pointer;
	align-self: flex-start;
	opacity: 0.75;
}

/* ---- Link "Iscriviti alla Newsletter" nel footer del sito. ---- */
.pop-footer-link-newsletter {
	color: var(--e-global-color-panna-crema);
	text-decoration: underline;
	font-weight: 600;
}

.pop-footer-link-newsletter:hover {
	color: var(--e-global-color-accent);
}

.pop-newsletter-form__link-disiscrizione:hover {
	opacity: 1;
}

.pop-newsletter-esito {
	padding: 12px 16px;
	border-radius: 6px;
	font-weight: 600;
	margin-bottom: 16px;
}

.pop-newsletter-esito--ok {
	background-color: #fff;
	color: var(--e-global-color-text);
	border: var(--pop-border-width) solid var(--e-global-color-accent);
}

.pop-newsletter-esito--errore {
	background-color: #fbeaea;
	color: #7a1f1f;
	border: var(--pop-border-width) solid #c0392b;
}
