/* Estilos Gôndolas — identidade visual do formulário da API Soluções Industriais.
   Carregado depois de `iw-form-api` (o CSS que vem com a integração).

   ------------------------------------------------------------------------
   POR QUE ESTE ARQUIVO EXISTE
   ------------------------------------------------------------------------
   O CSS da integração se veste pelas variáveis `--iw-*`, que quem preenche é
   o plugin Industrial Widgets a partir do tema ativo. Neste site o Industrial
   Widgets está DESATIVADO, então nada preenche essas variáveis e o formulário
   cai nos fallbacks do arquivo original: azul `#1c4f7c` no botão, campos de
   fundo branco, rótulo azul-marinho. Num site preto-e-dourado isso aparece na
   hora.

   O CSS adicional do Customizer já vestia o formulário antigo com estes mesmos
   tokens, mas escopado em `.wpforms-container` — classe que sumiu junto com o
   widget do WPForms. Aquelas regras ficam lá de propósito: se o ID for apagado
   em Configurações → Formulário (API), o WPForms volta já estilizado.

   Aqui só se declaram as variáveis e se corrigem as poucas propriedades que o
   arquivo da integração fixa em valor literal (fundo branco do campo, texto
   branco do botão, seta escura do select) — essas não há variável que alcance.

   Tokens: CLAUDE.md § Design tokens. */

.iw-form-api {
	--iw-color-1: #f5c518;          /* dourado do CTA: botão, foco, accent */
	--iw-color-text: #f3f1ea;       /* ink */
	--iw-color-heading: #f3f1ea;
	--iw-color-sucesso: #6ee7a0;    /* o verde padrão (#1e7b45) não se lê no preto */
	--iw-font-body: "Inter", sans-serif;
	--iw-font-heading: "Oswald", sans-serif;
	--iw-button-radius: 10px;
}

/* ----------------------------------------------------------------------
   Campos — o arquivo da integração fixa `background-color: #ffffff`
   literal, sem variável; só um !important daqui alcança.
   ---------------------------------------------------------------------- */
.iw-form-api input:not([type="checkbox"]):not([type="radio"]),
.iw-form-api select,
.iw-form-api textarea,
.iw-form-api .form-control,
.iw-form-api .form-select {
	background-color: #1e1e22 !important;
	border-color: rgba(255, 255, 255, 0.15) !important;
	color: #f3f1ea !important;
}

.iw-form-api ::placeholder {
	color: #a8a49b;
	opacity: 1;
}

/* A seta do <select> é um SVG embutido com `fill='%230e2a4d'` — azul-marinho
   sobre campo quase preto, invisível. Redesenhada em ink. */
.iw-form-api select,
.iw-form-api .form-select {
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='%23f3f1ea'%3E%3Cpath d='M8 11L3 6h10z'/%3E%3C/svg%3E") !important;
}

/* ----------------------------------------------------------------------
   Rótulos
   ---------------------------------------------------------------------- */
.iw-form-api label,
.iw-form-api .form-label,
.iw-form-api .form-check label,
.iw-form-api .form-check-label {
	color: #f3f1ea !important;
	font-family: "Inter", sans-serif !important;
}

/* Todo campo deste formulário vem com class="required", então o asterisco
   aparece cinco vezes: no vermelho padrão (#b3261e) sobre o card preto ele
   vira um borrão escuro. Dourado é o acento do site e se lê. */
.iw-form-api label.required::after {
	color: #f5c518;
}

/* ----------------------------------------------------------------------
   Botão de envio — dourado com texto preto, igual ao "Chamar no WhatsApp"
   ao lado. A integração fixa `color: #ffffff` literal.
   ---------------------------------------------------------------------- */
.iw-form-api button,
.iw-form-api input[type="submit"],
.iw-form-api .btn {
	color: #0a0a0b !important;
	background-color: #f5c518 !important;
	font-family: "Inter", sans-serif !important;
}

/* O spinner do envio é branco no arquivo original — sumiria dentro do botão
   dourado. */
.iw-form-api .spinner-border {
	border-color: rgba(10, 10, 11, 0.3);
	border-top-color: #0a0a0b;
}

/* ----------------------------------------------------------------------
   Confirmação de envio — o título usa Oswald, como todo título do site.
   As cores vêm das variáveis lá em cima; só a fonte precisa ser dita.
   ---------------------------------------------------------------------- */
.iw-form-api-final-titulo {
	font-family: "Oswald", sans-serif;
	text-transform: uppercase;
	letter-spacing: 0.01em;
}
