/* Refinamento visual premium do chat — carregado por último */
.chat-panel {
  padding: 0 !important;
  border: 1px solid rgba(255,255,255,.16);
  border-radius: 24px;
  background: #ffffff;
  color: #171c1f;
  box-shadow: 0 28px 70px rgba(0,0,0,.34), 0 8px 30px rgba(55,255,227,.08);
}

.chat-panel-header {
  position: relative;
  min-height: 86px;
  padding: 1rem 1.1rem;
  display: flex;
  align-items: center;
  gap: 1rem;
  background: #202427;
  color: #fff;
  border: 0;
}

.chat-panel-header::after {
  content: "";
  position: absolute;
  left: 0;
  right: 0;
  bottom: 0;
  height: 3px;
  background: linear-gradient(90deg, #e0048c 0%, #ef2a9d 35%, #37ffe3 100%);
}

.chat-panel-header > div:first-child {
  position: relative;
  min-height: 48px;
  padding-left: 58px;
  display: flex;
  flex-direction: column;
  justify-content: center;
  background: none !important;
}

.chat-panel-header > div:first-child::before {
  content: "";
  position: absolute;
  left: 0;
  top: 50%;
  width: 44px;
  height: 44px;
  transform: translateY(-50%);
  background: #fff;
  -webkit-mask: url("../images/icon-ma.svg") center / contain no-repeat;
  mask: url("../images/icon-ma.svg") center / contain no-repeat;
}

.chat-panel-header strong {
  color: #fff;
  font-size: 1.02rem;
  line-height: 1.15;
}

.chat-panel-header p {
  margin-top: .28rem;
  color: #d4dad9;
  opacity: 1;
  font-size: .82rem;
}

.chat-close {
  width: 42px;
  height: 42px;
  flex: 0 0 42px;
  border-radius: 50%;
  border: 1px solid rgba(255,255,255,.1);
  background: rgba(255,255,255,.08);
  color: #fff;
}

.chat-close:hover { background: rgba(255,255,255,.15); }

.chat-panel-body,
.chat-messages,
.chat-message-list,
.chat-gate {
  background: #fbfcfc;
  color: #171c1f;
}

.chat-gate { padding: 1.35rem 1rem 1.15rem; }
.chat-gate-intro { margin-bottom: 1.05rem; }

.chat-gate-intro::before {
  content: "Bem-vindo ao Melhor Agente";
  display: inline-flex;
  align-items: center;
  margin-bottom: 1rem;
  padding: .5rem .75rem;
  border-radius: 999px;
  color: #d80b84;
  background: #fff2f8;
  border: 1px solid #f8d8e8;
  font-size: .78rem;
  font-weight: 800;
}

.chat-gate-intro strong,
.chat-subject-fieldset legend {
  display: block;
  color: #171c1f;
  font-size: 1.08rem;
  font-weight: 850;
}

.chat-gate-intro p {
  margin-top: .35rem;
  color: #66706f;
  line-height: 1.45;
}

.chat-form-step label {
  color: #252b2d;
  font-weight: 750;
}

.chat-form-step input[type="text"],
.chat-form-step input[type="email"],
.chat-form-step input[type="tel"] {
  min-height: 46px;
  color: #1c2325;
  background: #fff;
  border: 1px solid #d8e0df;
  border-radius: 12px;
  box-shadow: 0 1px 0 rgba(0,0,0,.02);
}

.chat-form-step input:focus {
  border-color: #42b8aa;
  box-shadow: 0 0 0 4px rgba(55,255,227,.11);
  outline: none;
}

.chat-consent { color: #66706f !important; font-weight: 600 !important; }
.chat-consent span { color: #66706f !important; }
.chat-consent input,
.chat-subject-option input { accent-color: #09b9a5; }

.chat-subject-fieldset { display: grid; gap: .72rem; }
.chat-subject-fieldset legend { margin-bottom: .78rem; }

.chat-subject-option {
  position: relative;
  min-height: 68px;
  display: grid !important;
  grid-template-columns: 22px 1fr;
  align-items: center;
  gap: .72rem;
  padding: .72rem .85rem !important;
  color: #202628 !important;
  background: #fff !important;
  border: 1px solid #dce3e2 !important;
  border-radius: 14px !important;
  box-shadow: 0 4px 14px rgba(20,32,30,.025);
  transition: border-color .2s ease, box-shadow .2s ease, transform .2s ease, background .2s ease;
}

.chat-subject-option:hover {
  transform: translateY(-1px);
  border-color: #90d6cd !important;
  box-shadow: 0 7px 18px rgba(22,68,62,.06);
}

.chat-subject-option:has(input:checked) {
  border-color: #10c9b4 !important;
  background: #f2fcfa !important;
  box-shadow: 0 0 0 3px rgba(16,201,180,.07);
}

.chat-subject-option span {
  position: relative;
  display: flex;
  align-items: center;
  min-height: 40px;
  padding-left: 50px;
  color: #202628 !important;
  font-weight: 800;
  line-height: 1.28;
}

.chat-subject-option span::before {
  content: "";
  position: absolute;
  left: 0;
  top: 50%;
  width: 36px;
  height: 36px;
  transform: translateY(-50%);
  background-repeat: no-repeat;
  background-position: center;
  background-size: contain;
}

.chat-subject-option:nth-of-type(1) span::before { background-image: url("../images/icon-whatsapp.svg"); }
.chat-subject-option:nth-of-type(2) span::before { background-image: url("../images/icon-consultoria.svg"); }
.chat-subject-option:nth-of-type(3) span::before { background-image: url("../images/icon-instagram.svg"); }
.chat-subject-option:nth-of-type(4) span::before { background-image: url("../images/icon-consultoria.svg"); }

.chat-panel button:not(.chat-close) {
  min-height: 44px;
  color: #fff !important;
  background: linear-gradient(95deg, #e0048c 0%, #e9309a 34%, #16c7b4 78%, #0cb8a5 100%) !important;
  border: 0 !important;
  border-radius: 999px !important;
  box-shadow: 0 9px 20px rgba(224,4,140,.15), 0 7px 18px rgba(16,185,165,.12);
  font-weight: 850;
}

.chat-panel button:not(.chat-close):hover {
  transform: translateY(-1px);
  filter: brightness(1.03) saturate(1.03);
}

.chat-panel .chat-back-button {
  color: #087f73 !important;
  background: #fff !important;
  border: 1px solid #45c8b9 !important;
  box-shadow: none !important;
}

.chat-panel .chat-back-button:hover { background: #f3fcfa !important; }

.chat-panel button:disabled {
  color: #7a8583 !important;
  background: #e7eceb !important;
  box-shadow: none !important;
  opacity: 1 !important;
}

.chat-messages { padding: .35rem 0; }

.chat-message-agent {
  color: #26302e !important;
  background: #f0f3f2 !important;
  border: 1px solid #e0e6e4 !important;
  box-shadow: 0 3px 10px rgba(20,30,28,.025);
}

.chat-message-user {
  color: #153b36 !important;
  background: #ddf6f1 !important;
  border: 1px solid #caece5 !important;
}

.chat-form {
  padding: .82rem;
  background: #fff !important;
  border-top: 1px solid #e4e9e8 !important;
}

.chat-form input {
  color: #202628 !important;
  background: #f8faf9 !important;
  border: 1px solid #d7dfdd !important;
  border-radius: 999px !important;
}

.chat-form input:focus {
  border-color: #45c8b9 !important;
  box-shadow: 0 0 0 4px rgba(69,200,185,.11) !important;
}

.chat-form input:disabled {
  color: #7a8583 !important;
  background: #f0f3f2 !important;
}

.chat-gate-status,
.chat-typing-status { color: #687270 !important; }

@media (max-width: 620px) {
  .chat-panel { border-radius: 22px; }
  .chat-panel-header { min-height: 82px; }
  .chat-gate { padding: 1.15rem 1rem; }
  .chat-subject-option { min-height: 64px; }
}
