/**
 * Estilizações do Ninja Forms
 * Utilize as classes a seguir no widget WordPress do Thrive para ativar o estilo.
 *
 * nf-default                     Aumento dos elementos do formulário para seguir a linha "grande" do Thrive
 * nf-white-placeholder           Placeholder em branco para campos com fundo escuro
 */
 
/* Aumento dos elementos do formulário */
.nf-default .nf-form-layout .ninja-forms-field.nf-element {
  background-color: white !important;
  border-radius: 5px;
  padding: 10px;
}
.nf-default .nf-form-layout textarea.ninja-forms-field.nf-element{
  height: 100px;
}
.nf-default .nf-form-layout .ninja-forms-field.nf-element[type="button"] {
  border-radius: 5px;
  padding: 20px 10px; 
  border: 0 none;
  opacity: 0.8;
}
.nf-default .nf-form-layout .ninja-forms-field.nf-element[type="button"]:hover {
  opacity: 1;
}

 
/* Placeholder branco para formulários com campos escuros */
.nf-white-placeholder .nf-form-layout .ninja-forms-field.nf-element::-webkit-input-placeholder {
  color: white;
}
.nf-white-placeholder .nf-form-layout .ninja-forms-field.nf-element::-moz-placeholder {
  color: white;
}
.nf-white-placeholder .nf-form-layout .ninja-forms-field.nf-element:-ms-input-placeholder {
  color: white;
}
.nf-white-placeholder .nf-form-layout .ninja-forms-field.nf-element:-moz-placeholder {
  color: white;
}


/* Faz o botão ocupar metade do espaço e Centraliza o botão de submissão do Ninja Forms */
.nf-btn-center .nf-form-layout .submit-container {
  text-align: center !important;
}
.nf-btn-right .nf-form-layout .submit-container {
  text-align: right !important;
}
/* Coloca o botão ocupando toda a largura */
.nf-btn-full .nf-form-cont .submit-container input[type="button"] {
  width: 100% !important;
}
/* Faz o botão ocupar metade da largura disponível (mas não centraliza) */
.nf-btn-half .nf-form-cont .submit-container input[type="button"] {
  width: 50% !important;
}
/* Tamanho das caixas de texto */
.nf-form-cont .nf-form-layout textarea.small { height: 100px !important; }
.nf-form-cont .nf-form-layout textarea.medium { height: 200px !important; }
.nf-form-cont .nf-form-layout textarea.big { height: 300px !important; }

/* Correção do menu do Thrive em mobile */
@media (max-width: 767px) { #tve_editor .thrv_widget_menu.fix ul.tve_w_menu.tve_horizontal.tve-m-expanded {
  right: 0px;
} }
/* Ajusta o texto de resposta do Ninja Forms para ficar com texto branco */
.nf-response-white .nf-response-msg p {
  color: white !important;
  font-size: 16px !important;
}
/* Ajusta o comportamento de colunas no mobile: evita quebras (2 a 6 colunas) */
@media (max-width: 767px) {
  .nowrap .tcb-flex-row.tcb--cols--2 .tcb-flex-col,
  .nowrap .tcb-flex-row.tcb-resized.tcb--cols--2 .tcb-flex-col {
    max-width: 50% !important;
    width: 50% !important;
  }
  .nowrap .tcb-flex-row.tcb--cols--3 .tcb-flex-col,
  .nowrap .tcb-flex-row.tcb-resized.tcb--cols--3 .tcb-flex-col {
    max-width: 33.3333333% !important;
    width: 33.3333333% !important;
  }
  .nowrap .tcb-flex-row.tcb--cols--4 .tcb-flex-col,
  .nowrap .tcb-flex-row.tcb-resized.tcb--cols--4 .tcb-flex-col {
    max-width: 25% !important;
    width: 25% !important;
  }
  .nowrap .tcb-flex-row.tcb--cols--5 .tcb-flex-col,
  .nowrap .tcb-flex-row.tcb-resized.tcb--cols--5 .tcb-flex-col {
    max-width: 20% !important;
    width: 20% !important;
  }
  .nowrap .tcb-flex-row.tcb--cols--6 .tcb-flex-col,
  .nowrap .tcb-flex-row.tcb-resized.tcb--cols--6 .tcb-flex-col {
    max-width: 16.6666666% !important;
    width: 16.6666666% !important;
  }
  .nowrap .tcb-flex-row,
  .nowrap .tcb-flex-row.tcb-resized {
    flex-direction: row !important;
  }
}/*nowrap*/
/* Faz cada coluna ocupar 50% do espaço, e quebrar de acordo */
@media (max-width: 767px) {
  .wrap2 .tcb-flex-row .tcb-flex-col,
  .wrap2 .tcb-flex-row.tcb-resized .tcb-flex-col {
    max-width: 50% !important;
    width: 50% !important;
  }
  .wrap2 .tcb-flex-row,
  .wrap2 .tcb-flex-row.tcb-resized {
    flex-direction: row !important;
  }
}/*wrap2*/
/* Faz cada coluna ocupar 50% do espaço, e quebrar de acordo */
@media (max-width: 767px) {
  .wrap3 .tcb-flex-row .tcb-flex-col,
  .wrap3 .tcb-flex-row.tcb-resized .tcb-flex-col {
    max-width: 33.3333333% !important;
    width: 33.3333333% !important;
  }
  .wrap3 .tcb-flex-row,
  .wrap3 .tcb-flex-row.tcb-resized {
    flex-direction: row !important;
  }
}/*wrap3*/
/* Faz cada coluna ocupar 50% do espaço, e quebrar de acordo */
@media (max-width: 767px) {
  .wrap4 .tcb-flex-row .tcb-flex-col,
  .wrap4 .tcb-flex-row.tcb-resized .tcb-flex-col {
    max-width: 25% !important;
    width: 25% !important;
  }
  .wrap4 .tcb-flex-row,
  .wrap4 .tcb-flex-row.tcb-resized {
    flex-direction: row !important;
  }
}/*wrap4*/


/* Seta todo o formulário para usar Open Sans */
.nf-open-sans .nf-form-cont,
.nf-open-sans .nf-form-cont input,
.nf-open-sans .nf-form-cont textarea {
  font-family: Open Sans !important;
}

@media (max-width: 480px) {
  /* Corrige diagramação do Ninja Forms em todo form mobile no Thrive */
  .tve_wp_shortcode .nf-form-cont .nf-field-container.email-container,
  .tve_wp_shortcode .nf-form-cont .nf-field-container.textbox-container,
  .tve_wp_shortcode .nf-form-cont .nf-field-container.textarea-container {
    width: 100% !important;
    margin-left: 0px !important;
    margin-right: 0px !important;
  }
}

/* Um estilo base para Ninja Forms */
.nf-base .nf-form-cont input,
.nf-base .nf-form-cont textarea {
  padding: 20px 20px;
  font-size: 20px;
  border-radius: 10px;
  border-width: 2px;
}
.nf-base .nf-form-cont textarea {
  height: 100px !important;
}

/* Um estilo de formulário qualquer (1º uso: LP Carta Consulta) */
.nf-style1 .nf-form-cont input,
.nf-style1 .nf-form-cont textarea {
  padding: 20px 20px;
  font-size: 20px;
  border-radius: 10px;
  background-color: white;
  border: 2px solid #E8EDF2;
  color: #a3adb6;
}
.nf-style1 .nf-form-cont textarea {
  padding: 20px 20px;
  font-size: 20px;
  height: 100px !important;
  border-radius: 10px;
  border: 2px solid #E8EDF2;
}
.nf-style1 .nf-form-cont input[type="button"] {
  background-color: #ff2e8a;
  font-size: 22px;
  color: white;
  font-weight: bold;
}
.nf-style1 .nf-form-cont input[type="button"]:hover {
  background: #88d95d;
}
.nf-style1 .nf-response-msg {
  border: 2px solid #ff2e8a;
  background-color: #ff2e8a;
  padding: 20px;
}
.nf-style1 .nf-response-msg p {
  color: white;
  font-size: 16px;
}

