.elementor-4201 .elementor-element.elementor-element-76dfc4c{--display:flex;--min-height:600px;--flex-direction:column;--container-widget-width:calc( ( 1 - var( --container-widget-flex-grow ) ) * 100% );--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;--justify-content:center;--align-items:center;--border-radius:15px 15px 15px 15px;}.elementor-4201 .elementor-element.elementor-element-76dfc4c:not(.elementor-motion-effects-element-type-background), .elementor-4201 .elementor-element.elementor-element-76dfc4c > .elementor-motion-effects-container > .elementor-motion-effects-layer{background-color:#F0F0F0;}.elementor-4201 .elementor-element.elementor-element-b0b07e0{--display:flex;}#elementor-popup-modal-4201 .dialog-widget-content{animation-duration:1.2s;border-radius:15px 15px 15px 15px;box-shadow:2px 8px 77px 2px rgba(0, 0, 0, 0.23);}#elementor-popup-modal-4201 .dialog-message{width:50vw;height:auto;}#elementor-popup-modal-4201{justify-content:center;align-items:center;pointer-events:all;}#elementor-popup-modal-4201 .dialog-close-button{display:flex;}@media(min-width:768px){.elementor-4201 .elementor-element.elementor-element-76dfc4c{--content-width:1200px;}.elementor-4201 .elementor-element.elementor-element-b0b07e0{--width:70%;}}/* Start custom CSS for html, class: .elementor-element-17f0fd3 *//* Container principal */
.chat-container {
  max-width: 1000px;
  margin: auto;
  padding: 10px;
  padding: 10px;
  font-family: "Inter", sans-serif;
  font-size: 24px;
}

/* Mensagem */
.chat-msg {
  display: flex;
  align-items: center;
  gap: 20px;
  margin-bottom: 50px;
  line-height: 1.5;
}

/* Avatar */
.msg-avatar {
  width: 50px;
  height: 50px;
  object-fit: cover;
  box-shadow: 0 2px 6px rgba(0,0,0,0.15);
}

.msg-avatar:hover {
    animation: mouse 0.5s ease-out;
}

@keyframes mouse {
    100% { transform: scale(1.2); }
}
/* Inputs */
.input {
  width: 100%;
  padding: 10px 12px;
  border: 1px solid #d0d0d0;
  border-radius: 10px;
  font-size: 15px;
  outline: none;
  transition: all 0.2s ease;
}

.input:focus {
  border-color: #0073e6;
  box-shadow: 0 0 0 3px rgba(0,115,230,0.1);
}

/* Botões */
.btn {
  background: #0073e6;
  color: #fff;
  border: none;
  padding: 10px 18px;
  border-radius: 8px;
  cursor: pointer;
  transition: background 0.3s ease;
  width: 100%;
}

.btn:hover {
  background: #080808;
}

.btn-secundario {
  background: #0000;
  color: #000;
}

.btn-row {
  display: flex;
  justify-content: space-between;
  gap: 10px;
  margin-top: 10px;
}

/* Animação de esmaecimento */
.fade-in {
  animation: fadeInUp 0.6s ease forwards;
}

@keyframes fadeInUp {
  from {
    opacity: 0;
    transform: translateY(20px);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}
/*alerta do e-mail invalido */
.email-erro {
  display: none;
  color: red;
  font-size: 13px;
  margin-bottom: 5px;
}

.input-erro {
  border-color: red !important;
  outline: none;
}


/* ===== Opções de consumo (Grade 2x2) - correção para preencher todo o bloco ===== */
.opcoes-consumo {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 2px;
  margin-bottom: 15px;
  box-sizing: border-box;
}

/* Label funciona como container (sem padding) */
.opcao-consumo {
  position: relative;
  display: block;
  cursor: pointer;
  border-radius: 14px;
  transition: transform 0.18s ease, box-shadow 0.18s ease;
  user-select: none;
  overflow: hidden;
  border: 2px solid transparent; /* borda neutra que pode mudar no hover */
}

/* O span preenche todo o label e é o elemento visual */
.opcao-consumo > span {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  height: 100%;
  min-height: 64px;           /* altura mínima do botão */
  box-sizing: border-box;
  padding: 14px;              /* controle do espaçamento interno do botão */
  border-radius: 13px;        /* mesmo radius do label para cobrir tudo */
  background: #fff;        /* cor padrão */
  color: #000;                /* texto padrão */
  transition: background 0.18s ease, color 0.18s ease, transform 0.12s ease;
}

/* Hover aplicado ao conjunto */
.opcao-consumo:hover > span {
  transform: translateY(-2px);
  background: #f0f0f0;
  border-color: #0073e6;
}

/* Oculta o input padrão (mantém acessibilidade) */
.opcao-consumo input[type="radio"] {
  position: absolute;
  opacity: 0;
  pointer-events: none;
}

/* Estado selecionado — agora preenche TODO o botão (o span) */
.opcao-consumo input[type="radio"]:checked + span {
  background: #080808; /* cor de seleção */
  color: #ffffff;
  box-shadow: 0 8px 20px rgba(0,0,0,0.12);
}

/* melhora visual em mobile (opcional) */
@media (max-width:480px) {
  .opcoes-consumo { grid-template-columns: 1fr; gap: 8px; }
  .opcao-consumo > span { padding: 14px; min-height: 56px; }
}/* End custom CSS */
/* Start custom CSS for container, class: .elementor-element-76dfc4c */.mesh-test{
background-color:hsla(141,0%,85%,1);
background-image:
radial-gradient(at 87% 26%, hsla(228,0%,95%,1) 0px, transparent 50%),
radial-gradient(at 83% 96%, hsla(103,100%,82%,1) 0px, transparent 50%),
radial-gradient(at 52% 94%, hsla(111,100%,36%,1) 0px, transparent 50%),
radial-gradient(at 13% 41%, hsla(90,100%,97%,1) 0px, transparent 50%);

animation: gradient 10s ease infinite;
    background-size: 150% 150%;
}

@keyframes gradient {
	0% {
		background-position: 0% 20%;
	}
	25% {
		background-position: 100% 10%;
	}
	50% {
		background-position: 20% 70%;
	}
	100% {
		background-position: 0% 20%;
	}
}/* End custom CSS */