.mostrarfrase {
  display: none !important;
}

.fab input.main {
  background-size: 127px !important;
  width: 138px !important;
  height: 119px !important;
  background-repeat: no-repeat;
}

.rcpntncampograndems    {
  background-image: url(https://milla-files.s3.us-south.cloud-object-storage.appdomain.cloud/milla/avatar_animado_milla.gif) !important;
}

.fab.show input.main:checked {
  background-image: none !important;
}

.navegacao {
  margin-right: 6px !important;
  margin-top: 5px !important;
}

.botaochat {
  font-size: 19px !important;
  margin-right: 5px !important;
  color: #dddddd !important;
  display: inline-block !important;
  border: none !important;
}

.logotipos {
  margin-top: 5px !important;
  margin-left: 10px !important;
  margin-right: 35px !important;
  margin-bottom: 5px !important;
}

/* --- REFORMULANDO APENAS A RESPONSIVIDADE (TELA E IFRAME) --- */

.tela {
  /* Removi a margem negativa que causava scroll horizontal lateral */
  margin: 0px 16px 0px -102px !important;
  bottom: -9px !important;
  right: 90px !important;
  z-index: 30 !important;
}

.chat {
  width: 30vw !important;
  min-width: 320px !important; /* Garante que não fique fino demais */
  height: 65vh !important;
  display: flex !important;
  flex-direction: column !important; /* Essencial para o iframe respeitar o topo */
  overflow: hidden !important;
}

#instanciaIframe {
  flex-grow: 1 !important; /* Faz o iframe ocupar o espaço que sobra */
  height: auto !important; /* Deixa o flex-grow controlar a altura */
  overflow: hidden !important;
  background-color: #e9e9e9 !important;
}

#instanciaIframe iframe,
.iframe22rcpntucuruvi > iframe {
  width: 100% !important;
  height: 100% !important; /* Ocupa 100% do container pai (#instanciaIframe) */
  border: none !important;
}

/* --- MEDIA QUERIES REFORMULADAS --- */

@media (max-width: 500px) {
  .tela {
    bottom: 77px !important;
    right: 0 !important;
    left: 0 !important;
    margin: 0 auto !important;
    display: flex !important;
    justify-content: center !important;
    width: 100% !important;
    z-index: 99999999999 !important;
  }

  .chat {
    width: 93vw !important;
    height: 80vh !important;
  }

  .agent-face {
    width: 86vw;
    margin-left: 5.5vw !important;
  }
}

@media (max-width: 320px) {
  .tela {
    bottom: 91px !important;
  }
  .chat {
    width: 92vw !important;
    height: 81vh !important;
  }
  div.half {
    width: 70px !important;
    height: 42px !important;
  }
  .circle {
    width: 90px !important;
    height: 64px !important;
  }
}

@media (max-height: 500px) {
  .chat {
    height: 76vh !important;
  }
}