/*
 * Component "Avísame" (form.lts-avisame): alta a la llista general de Brevo via
 * AJAX lts_subscribe (LTS Core). JS: assets/js/avisame.js. Es carrega només a les
 * pàgines el contingut de les quals porta la classe lts-avisame (functions.php).
 * Per defecte, sobre fons clar; dins d'un cover o d'un fons fosc canvia els tokens.
 */

.lts-avisame {
	--av-text: var(--lts-principal, #1a1a1a);
	--av-muted: var(--lts-secundario, #4a4a4a);
	--av-field-bg: #fff;
	--av-field-border: #cfcfcf;
	--av-ok: var(--lts-principal, #1a1a1a);
	--av-err: #b3261e;
	max-width: 560px;
	margin: 28px auto 0;
	text-align: center;
	color: var(--av-text);
}
.wp-block-cover .lts-avisame,
.has-fondo-oscuro-background-color .lts-avisame,
.lts-section--dark .lts-avisame {
	--av-text: var(--lts-fondo-claro, #fdfdfd);
	--av-muted: rgba(253, 253, 253, 0.72);
	--av-field-bg: rgba(255, 255, 255, 0.08);
	--av-field-border: rgba(253, 253, 253, 0.38);
	--av-ok: var(--lts-acento, #fd9840);
	--av-err: #ff9b8f;
}

.lts-avisame__row {
	display: flex;
	gap: 10px;
}
.lts-avisame__input {
	flex: 1;
	min-width: 0;
	padding: 13px 16px;
	border: 1px solid var(--av-field-border);
	border-radius: 4px;
	background: var(--av-field-bg);
	color: var(--av-text);
	font-family: var(--wp--preset--font-family--tenor);
	font-size: 16px; /* 16px: iOS no fa zoom en enfocar */
	line-height: 1.2;
	transition: border-color 0.2s ease;
}
.lts-avisame__input::placeholder { color: var(--av-muted); opacity: 1; }
.lts-avisame__input:focus { outline: none; border-color: var(--lts-acento); }
.lts-avisame__input:focus-visible { outline: 2px solid var(--lts-acento); outline-offset: 2px; }
.lts-avisame__input[aria-invalid="true"] { border-color: var(--av-err); }

/* Com els botons plens de la web (lts-theme.css: .wp-block-button:not(.is-style-outline)). */
.lts-avisame .lts-avisame__btn {
	flex: none;
	margin: 0;
	padding: 14px 26px;
	border: 2px solid var(--lts-acento);
	border-radius: 4px;
	background-color: var(--lts-acento);
	color: var(--lts-fondo-oscuro);
	font-family: var(--wp--preset--font-family--tenor);
	font-size: 15px;
	line-height: 1;
	white-space: nowrap;
	cursor: pointer;
	transition: background-color 0.2s ease, border-color 0.2s ease, color 0.2s ease;
}
.lts-avisame .lts-avisame__btn:hover,
.lts-avisame .lts-avisame__btn:focus-visible {
	background-color: var(--lts-secundario);
	border-color: var(--lts-secundario);
	color: var(--lts-fondo-claro);
}
.lts-avisame .lts-avisame__btn[disabled] { opacity: 0.65; cursor: wait; }

.lts-avisame__msg {
	min-height: 1.4em;
	margin: 12px 0 0;
	font-size: 0.95rem;
	line-height: 1.4;
}
.lts-avisame__msg:empty { min-height: 0; margin: 0; }
.lts-avisame__msg.is-ok { color: var(--av-ok); }
.lts-avisame__msg.is-err { color: var(--av-err); }

.lts-avisame__legal {
	margin: 14px auto 0;
	max-width: 46ch;
	color: var(--av-muted);
	font-size: 0.8rem;
	line-height: 1.5;
}
.lts-avisame__legal a { color: inherit; text-decoration: underline; text-underline-offset: 2px; }
.lts-avisame__legal a:hover { color: var(--lts-acento); }

/* Estat final: amaga el camp i deixa només la confirmació. */
.lts-avisame.is-done .lts-avisame__row { display: none; }
.lts-avisame.is-done .lts-avisame__msg { font-size: 1.05rem; margin-top: 0; }

.lts-avisame__sr,
.lts-avisame__hp {
	position: absolute !important;
	width: 1px;
	height: 1px;
	padding: 0;
	margin: -1px;
	overflow: hidden;
	clip: rect(0, 0, 0, 0);
	white-space: nowrap;
	border: 0;
}

/* Destí de l'àncora #avisame sense motion (salt natiu): no quedar sota el header. */
#avisame { scroll-margin-top: var(--lts-header-h, 90px); }

@media (max-width: 520px) {
	.lts-avisame__row { flex-direction: column; }
	.lts-avisame .lts-avisame__btn { width: 100%; }
}
