/* ====== Layout base dos formulários ====== */
.uvf-wrap-form{ max-width: 840px; margin: 0 auto; }
.uvf-row{ display:flex; gap:14px; flex-wrap:wrap; }
.uvf-field{ flex: 1 1 320px; margin-bottom:16px; }
.uvf-field.full{ flex-basis:100%; }
.uvf-label{ display:block; font-weight:600; margin-bottom:8px; }
.uvf-note{ font-size:13px; opacity:.8; margin-top:6px; }
.uvf-help{ display:block; font-size:12px; margin-top:6px; color:#b91c1c; }

/* ====== Inputs base ====== */
.uvf-input, .uvf-select, .uvf-textarea, .uvf-file{
  width:100%;
  padding:14px 16px;
  border-radius:12px;
  border:1px solid rgba(0,0,0,.14);
  background:#fff;
  font-size:16px; line-height:1.4;
  transition: border-color .15s ease, box-shadow .15s ease, background-color .15s ease;
}
.uvf-textarea{ min-height:180px; resize:vertical; }

/* ====== Estados ====== */
.uvf-field-error{ border-color:#e11d48 !important; background:#fff1f3 !important; }
.uvf-field-ok   { border-color:#16a34a !important; background:#f0fdf4 !important; }

.uvf-field-ok:focus{
  border-color:#16a34a !important; background:#f0fdf4 !important;
  box-shadow:0 0 0 1px rgba(22,163,74,.15) inset !important;
}
.uvf-field-error:focus{
  border-color:#e11d48 !important; background:#fff1f3 !important;
  box-shadow:0 0 0 1px rgba(225,29,72,.12) inset !important;
}

/* ====== Labels com estado (opcional) ====== */
label.uvf-label-error{ color:#b91c1c !important; }
label.uvf-label-ok   { color:#166534 !important; }

/* ====== Ícones com wrapper (compatível com Avada) ====== */
.uvf-wrap{ position:relative; display:block; }
.uvf-wrap .uvf-target{ padding-right:44px !important; }   /* espaço do ícone */
select.uvf-target{ padding-right:60px !important; }       /* caret + ícone */

.uvf-wrap .uvf-icon{
  position:absolute; right:12px; top:50%; transform:translateY(-50%);
  width:22px; height:22px; pointer-events:none; display:none;
  background-repeat:no-repeat; background-size:22px 22px;
}
/* mostra ícone conforme estado do input/select dentro do wrapper */
.uvf-wrap .uvf-field-ok + .uvf-icon{
  display:block;
  background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 24 24' xmlns='http://www.w3.org/2000/svg' fill='none' stroke='%2316a34a' stroke-width='2'%3E%3Ccircle cx='12' cy='12' r='9'/%3E%3Cpath d='M8 12.5l2.5 2.5L16 9'/%3E%3C/svg%3E");
}
.uvf-wrap .uvf-field-error + .uvf-icon{
  display:block;
  background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 24 24' xmlns='http://www.w3.org/2000/svg' fill='none' stroke='%23e11d48' stroke-width='2'%3E%3Ccircle cx='12' cy='12' r='9'/%3E%3Cpath d='M12 7v6'/%3E%3Ccircle cx='12' cy='17' r='1.5' fill='%23e11d48' stroke='none'/%3E%3C/svg%3E");
}

/* ====== Botões ======
   Usaremos os botões com classes do Avada (fusion-button ...).
   Este arquivo não altera o estilo desses botões — apenas garante spacing coerente. */
.uvf-actions{ margin-top:8px; }
.uvf-actions .fusion-button[disabled],
.uvf-actions button[disabled],
.uvf-actions input[type="submit"][disabled]{
  opacity:.45; cursor:not-allowed; filter:grayscale(.25);
}

/* ====== Alertas ====== */
.uvf-alert{
  position:relative; margin:10px 0;
  border:1px solid #cbd0ff; background:#e9ebff; color:#0c0f66;
  padding:12px 14px; border-radius:10px;
}
.uvf-alert.err{ border-color:#d3cfe6; background:#ecebfa; color:#3d3561; }
.uvf-close{
  position:absolute; top:6px; right:10px;
  background:none; border:0; font-size:18px; cursor:pointer; opacity:.6;
}

/* ====== Ajustes responsivos simples ====== */
@media (max-width: 480px){
  .uvf-row{ gap:10px; }
  .uvf-input, .uvf-select, .uvf-textarea, .uvf-file{ font-size:15px; }
}
/* HOME: CNPJ inline */
form[data-uvf-type="cnpj_home"] .uvf-field { max-width: 360px; margin-left:auto; margin-right:auto; }
form[data-uvf-type="cnpj_home"] .uvf-input { width:100%; }
form[data-uvf-type="cnpj_home"] .uvf-actions { max-width: 360px; margin: 10px auto 0; }
form[data-uvf-type="cnpj_home"] .fusion-button,
form[data-uvf-type="cnpj_home"] button[type="submit"],
form[data-uvf-type="cnpj_home"] input[type="submit"]{
  width:100%;
  display:block;
}
/* HOME: esconder o label e estilizar o placeholder do CNPJ */
form[data-uvf-type="cnpj_home"] .uvf-label { 
  display: none; 
}

form[data-uvf-type="cnpj_home"] .uvf-input::placeholder {
  font-weight: 400;   /* sem negrito */
  opacity: 0.7;       /* leve, tipo Avada */
}

/* (opcional) garantir que o texto digitado não herde bold de temas */
form[data-uvf-type="cnpj_home"] .uvf-input { 
  font-weight: 400; 
}

/* === Patch v2 ===============================================================
   - Checkbox + texto na mesma linha (label .uvf-check e fallback .uvf-wrap)
   - Link "Política de Privacidade": #777777 sublinhado, hover #2900cc
   - Labels sem negrito
   - Regra solicitada: .uvf-field label .uvf-wrap { display:inline-flex; }
   ========================================================================== */
.uvf-wrap-form .uvf-field label.uvf-check{
  display:flex !important;
  flex-direction:row !important;
  align-items:center !important;
  gap:8px !important;
  flex-wrap:nowrap !important;
  line-height:1.35 !important;
}
.uvf-wrap-form .uvf-field label.uvf-check > input[type="checkbox"]{
  display:inline-block !important;
  width:auto !important;
  min-width:auto !important;
  height:auto !important;
  margin:0 !important;
  float:none !important;
  clear:none !important;
  position:static !important;
  vertical-align:middle !important;
  transform:none !important;
}
.uvf-wrap-form .uvf-field label.uvf-check > span{
  display:inline-block !important;
  white-space:normal !important;
}
/* Fallback solicitado */
.uvf-wrap-form .uvf-field label .uvf-wrap{
  display:inline-flex !important;
  align-items:center !important;
  gap:8px !important;
}

/* Política de Privacidade */
.uvf-wrap-form .uvf-pp-link,
.uvf-wrap-form [data-pp-open]{
  color:#777777 !important;
  text-decoration:underline !important;
}
.uvf-wrap-form .uvf-pp-link:hover,
.uvf-wrap-form [data-pp-open]:hover{
  color:#2900cc !important;
}

/* Labels sem negrito */
.uvf-wrap-form .uvf-label{
  font-weight:400 !important;
}

/* === Patch: Select caret spacing ==========================================
   Empurra a seta do <select> para dentro e aumenta padding-right, sem colidir
   com os ícones de ok/erro.
*/
.uvf-select{
  padding-right: 56px !important;              /* antes ~40px */
  background-position: calc(100% - 18px) 50% !important; /* seta 18px da borda */
  background-repeat: no-repeat;
}
/* Estados (erro/ok) mantendo espaço da seta e ícones */
.uvf-field.err .uvf-select,
.uvf-field.ok .uvf-select{
  padding-right: 56px !important;
  background-position: calc(100% - 18px) 50% !important;
}


/* === Select caret spacing (safe with ok/err icons) === */
.uvf-select{
  padding-right: 64px !important; /* espaço extra p/ seta + ícones */
  background-position: calc(100% - 20px) 50% !important;
  background-repeat: no-repeat;
}
.uvf-field.err .uvf-select,
.uvf-field.ok .uvf-select{
  padding-right: 64px !important;
  background-position: calc(100% - 20px) 50% !important;
}

/* Cliente: remover margem superior do bloco do form */
.uvf-wrap-form:has(form[data-uvf-type="cliente"]){
  margin-top: 0 !important;
}



/* === Cliente: remover margens laterais do wrap ============================ */
.uvf-wrap-form:has(form[data-uvf-type="cliente"]) {
  margin-left: 0 !important;
  margin-right: 0 !important;
  width: 100% !important;
  max-width: 100% !important;
}


/* === Ajuste fino: seta do <select> mais para dentro ===================== */
.uvf-select {
  padding-right: 72px !important;
  background-position: calc(100% - 26px) 50% !important;
}
.uvf-field.err .uvf-select,
.uvf-field.ok .uvf-select {
  padding-right: 72px !important;
  background-position: calc(100% - 26px) 50% !important;
}


/* === Ajuste FINAL do chevron do <select> ================================= */
.uvf-select {
  padding-right: 80px !important;
  background-position: calc(100% - 34px) 50% !important;
}
.uvf-field.err .uvf-select,
.uvf-field.ok .uvf-select {
  padding-right: 80px !important;
  background-position: calc(100% - 34px) 50% !important;
}

/* === Forçar chevron custom no <select> (ignora seta nativa) =============== */
.uvf-select {
  -webkit-appearance: none !important;
  -moz-appearance: none !important;
  appearance: none !important;
  background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 24 24' fill='none' stroke='%23777777' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'><polyline points='6 9 12 15 18 9'/></svg>");
  background-repeat: no-repeat !important;
  background-position: calc(100% - 34px) 50% !important; /* 34px da borda */
  background-size: 16px 16px !important;
  padding-right: 80px !important; /* espaço p/ chevron + ícones ok/erro */
}

/* Estados mantêm a posição do chevron */
.uvf-field.err .uvf-select,
.uvf-field.ok .uvf-select {
  background-position: calc(100% - 34px) 50% !important;
  padding-right: 80px !important;
}

/* Remove seta do IE/Edge legado (se aparecer) */
select.uvf-select::-ms-expand { display: none; }

/* === UVF PATCH 2025-10-08 ================================================
   Chevron de <select> sempre visível + espaçamento com ícones de status
---------------------------------------------------------------------------*/
.uvf-select {
  -webkit-appearance: none !important;
  -moz-appearance: none !important;
  appearance: none !important;
  background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='24' height='24' fill='none' stroke='%236b7280' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'><polyline points='6 9 12 15 18 9'/></svg>");
  background-repeat: no-repeat !important;
  background-position: calc(100% - 34px) 50% !important;
  background-size: 16px 16px !important;
  padding-right: 80px !important;
}
.uvf-field.err .uvf-select,
.uvf-field.ok  .uvf-select {
  background-position: calc(100% - 34px) 50% !important;
  padding-right: 80px !important;
}
.uvf-wrap .uvf-icon { right: 12px; z-index: 1; }
/* --- Dicas de Caracteres (Min/Max) --- */
.uvf-field {
  position: relative;
  /* Espaço para o contador/erro */
  padding-bottom: 18px; 
  /* Mantém a margem original */
  margin-bottom: 16px; 
}

.uvf-help,
.uvf-counter {
  display: block;
  font-size: 12px;
  line-height: 1.2;
  position: absolute; 
  /* Alinha na base do .uvf-field */
  bottom: 0; 
}

.uvf-help {
  left: 0;
  color: #b91c1c;
}

.uvf-counter {
  right: 0;
  color: #777;
}