/*
 * Ethereal Precision — widgets atômicos do Elementor (editor V4).
 *
 * Carregado só com o Elementor ativo E com os widgets atômicos ligados
 * (inc/compat/elementor.php). Nada aqui vale sozinho: cada regra depende
 * de uma classe que você põe no campo "Classes" do elemento atômico, como
 * a ep-escuro do style.css.
 *
 *   ep-botao       Botão (e o Enviar do formulário): fundo Destaque e
 *                  texto "sobre o destaque", como os botões do kit.
 *   ep-divisor     Divisor: cor da Borda.
 *   ep-formulario  Formulário: rótulos, campos, caixas de seleção e o
 *                  Enviar com as cores da paleta.
 *
 * Tudo usa as variáveis da paleta, então troca no modo escuro e dentro da
 * seção escura (ep-escuro) sem regra a mais.
 *
 * Por que o seletor é mais pesado que o normal: o Elementor escreve os
 * padrões dos atômicos com ".elementor .e-…-base" e, no editor, os
 * reescreve depois de todas as folhas da página. Ganhar pela ordem dos
 * arquivos funcionaria no site e não no editor; por isso a regra do tema
 * ganha pelo peso (uma classe a mais). Consequência: no elemento que tem a
 * classe do tema, a cor é a do tema — para outra cor, tire a classe.
 */

/* Botão: no widget Botão ou no Enviar do formulário. */
.elementor .ep-botao:is(.e-button-base, .e-form-submit-button-base),
.elementor .ep-botao:is(.e-button-base, .e-form-submit-button-base):is(:hover, :focus-visible),
.elementor .ep-formulario .e-form-submit-button-base,
.elementor .ep-formulario .e-form-submit-button-base:is(:hover, :focus-visible) {
	background-color: var(--ep-accent);
	color: var(--ep-on-accent);
}

/* Divisor. */
.elementor .ep-divisor.e-divider-base {
	background-color: var(--ep-outline-variant);
}

/* Formulário: rótulos. */
.elementor .ep-formulario .e-form-label-base {
	color: var(--ep-on-surface);
}

/* Campos. O fundo é o do cartão: sem ele, no modo escuro o navegador
   escurece o campo e o texto padrão do Elementor (escuro) some. */
.elementor .ep-formulario :is(.e-form-input-base, .e-form-textarea-base, .e-form-select-base, .e-form-date-picker-base, .e-form-time-picker-base, .e-form-file-upload-base) {
	border-color: var(--ep-outline-variant);
	background-color: var(--ep-card);
	color: var(--ep-on-surface);
}

.elementor .ep-formulario :is(.e-form-input-base, .e-form-textarea-base)::placeholder {
	color: var(--ep-on-surface-variant);
}

/* Caixa de seleção e opção. */
.elementor .ep-formulario :is(.e-form-checkbox-base, .e-form-radio-button-base) {
	border-color: var(--ep-outline-variant);
}

.elementor .ep-formulario .e-form-checkbox-base {
	color: var(--ep-on-accent); /* o visto */
}

.elementor .ep-formulario .e-form-checkbox-base:checked {
	border-color: var(--ep-accent);
	background-color: var(--ep-accent);
}

.elementor .ep-formulario .e-form-radio-button-base::before {
	background-color: var(--ep-accent);
}

/* Foco: a borda vai para a cor de foco do tema (o Elementor tira o
   contorno desses campos e usa só um cinza na borda). */
.elementor .ep-formulario :is(.e-form-input-base, .e-form-textarea-base, .e-form-select-base, .e-form-date-picker-base, .e-form-time-picker-base, .e-form-file-upload-base, .e-form-checkbox-base, .e-form-radio-button-base):focus {
	border-color: var(--ep-focus);
}