/* Indique e Ganhe ([clicklivre_indique]). Mesma identidade do cartão da página:
   Inter, texto #464646, destaque #0E9B87, campos com raio 7 px. Seletores com
   .cl-indique na frente para o tema/Elementor não sobrescreverem botões e campos. */
.cl-indique {
	--cl-ind-destaque: #0e9b87;
	--cl-ind-destaque-escuro: #0b7d6d;
	--cl-ind-texto: #464646;
	--cl-ind-suave: #6b7280;
	--cl-ind-borda: rgba(2, 1, 1, 0.12);
	--cl-ind-erro: #b42318;
	font-family: Inter, "Segoe UI", Roboto, Arial, sans-serif;
	color: var(--cl-ind-texto);
	width: 100%;
}
.cl-indique [hidden] { display: none !important; }

.cl-indique .cl-indique__etapa,
.cl-indique .cl-indique__bloco {
	display: flex;
	flex-direction: column;
	gap: 12px;
	margin: 0;
}
.cl-indique .cl-indique__bloco + .cl-indique__bloco,
.cl-indique .cl-indique__aviso + .cl-indique__bloco { margin-top: 12px; }

.cl-indique .cl-indique__titulo {
	font-family: inherit;
	font-size: 20px;
	line-height: 1.3;
	font-weight: 700;
	color: var(--cl-ind-texto);
	margin: 0;
	text-wrap: balance;
}
.cl-indique .cl-indique__texto,
.cl-indique .cl-indique__ajuda {
	margin: 0;
	font-size: 15px;
	line-height: 1.5;
}
.cl-indique .cl-indique__ajuda { font-size: 13px; color: var(--cl-ind-suave); margin-top: -6px; }

.cl-indique .cl-indique__rotulo {
	font-size: 14px;
	font-weight: 600;
	margin: 4px 0 0;
}
.cl-indique .cl-indique__campo {
	width: 100%;
	box-sizing: border-box;
	font: inherit;
	font-size: 16px; /* 16 px evita o zoom automático do iPhone */
	color: var(--cl-ind-texto);
	background: #fff;
	border: 1px solid var(--cl-ind-borda);
	border-radius: 7px;
	padding: 12px 14px;
	min-height: 48px;
}
.cl-indique .cl-indique__campo:focus {
	outline: 2px solid var(--cl-ind-destaque);
	outline-offset: 1px;
	border-color: var(--cl-ind-destaque);
}
.cl-indique .cl-indique__campo--link { font-size: 14px; background: #f5f7f6; }

.cl-indique .cl-indique__aceite {
	display: flex;
	gap: 10px;
	align-items: flex-start;
	font-size: 14px;
	line-height: 1.45;
	cursor: pointer;
}
.cl-indique .cl-indique__aceite input { width: 18px; height: 18px; margin: 1px 0 0; flex-shrink: 0; accent-color: var(--cl-ind-destaque); }
.cl-indique .cl-indique__aceite a { color: var(--cl-ind-destaque); text-decoration: underline; }

.cl-indique .cl-indique__hp { position: absolute !important; left: -9999px !important; width: 1px; height: 1px; opacity: 0; }

.cl-indique .cl-indique__msg { margin: 0; font-size: 14px; color: var(--cl-ind-erro); min-height: 0; }
.cl-indique .cl-indique__msg:empty { display: none; }

.cl-indique .cl-indique__aviso {
	margin: 0;
	font-size: 14px;
	line-height: 1.45;
	background: #e7f6f3;
	color: #0b5f53;
	border-radius: 7px;
	padding: 10px 12px;
}

.cl-indique .cl-indique__duplicado {
	background: #fff7e6;
	border-radius: 7px;
	padding: 10px 12px;
	font-size: 14px;
}
.cl-indique .cl-indique__duplicado p { margin: 0 0 4px; }

.cl-indique .cl-indique__acoes { display: flex; flex-wrap: wrap; align-items: center; gap: 8px 16px; }

.cl-indique .cl-indique__botao {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 100%;
	box-sizing: border-box;
	min-height: 48px;
	padding: 12px 20px;
	font: inherit;
	font-size: 16px;
	font-weight: 600;
	color: #fff;
	background: var(--cl-ind-destaque);
	border: 0;
	border-radius: 7px;
	text-decoration: none;
	cursor: pointer;
	transition: background-color 0.15s ease;
}
.cl-indique .cl-indique__botao:hover,
.cl-indique .cl-indique__botao:focus-visible { background: var(--cl-ind-destaque-escuro); color: #fff; }
.cl-indique .cl-indique__botao:disabled { opacity: 0.6; cursor: wait; }
.cl-indique .cl-indique__acoes .cl-indique__botao { width: auto; flex: 1 1 auto; }

.cl-indique .cl-indique__botao--whats { background: #25d366; color: #0b3d1f; }
.cl-indique .cl-indique__botao--whats:hover,
.cl-indique .cl-indique__botao--whats:focus-visible { background: #1ebe5b; color: #0b3d1f; }

.cl-indique .cl-indique__botao--claro {
	background: #fff;
	color: var(--cl-ind-destaque);
	border: 2px solid var(--cl-ind-destaque);
}
.cl-indique .cl-indique__botao--claro:hover,
.cl-indique .cl-indique__botao--claro:focus-visible { background: #e7f6f3; color: var(--cl-ind-destaque-escuro); }

.cl-indique .cl-indique__link {
	align-self: flex-start;
	background: none;
	border: 0;
	padding: 4px 0;
	font: inherit;
	font-size: 14px;
	color: var(--cl-ind-destaque);
	text-decoration: underline;
	cursor: pointer;
	min-height: 0;
}
.cl-indique .cl-indique__link:hover { color: var(--cl-ind-destaque-escuro); background: none; }

.cl-indique .cl-indique__erro { margin: 0; font-size: 15px; }

@media (prefers-reduced-motion: reduce) {
	.cl-indique .cl-indique__botao { transition: none; }
}