/* Gap-the-Code · widgets/chat-asesor/chat.css · FASE 2
   Burbuja flotante + panel del asesor. Mobile-first, paleta GTC. */

.gtcchat-launcher{
  position: fixed; right: 16px; bottom: 16px; z-index: 950;
  width: 58px; height: 58px; border-radius: 50%; border: none; cursor: pointer;
  background: linear-gradient(135deg, #442854, #782167 60%, #BA2C69);
  color: #fff; font-size: 26px; line-height: 1;
  box-shadow: 0 8px 24px rgba(68,40,84,.35);
  display: flex; align-items: center; justify-content: center;
  transition: transform .15s ease;
}
.gtcchat-launcher:hover{ transform: scale(1.04); }
.gtcchat-launcher__ico{ font-size: 26px; line-height: 1; }
.gtcchat-launcher__label{ display: none; }
/* En escritorio, la burbuja es una pastilla con texto: se entiende sin adivinar */
@media (min-width: 768px){
  .gtcchat-launcher{ width: auto; height: 56px; border-radius: 999px; padding: 0 22px 0 16px; gap: 10px; }
  .gtcchat-launcher__ico{ font-size: 22px; }
  .gtcchat-launcher__label{ display: inline; font-size: .95rem; font-weight: 700; letter-spacing: .1px; white-space: nowrap; }
  .gtcchat-launcher__hint{ right: 16px; bottom: 84px; }
}
.gtcchat-launcher__hint{
  position: fixed; right: 84px; bottom: 28px; z-index: 950;
  background: #fff; color: #442854; font-size: .82rem; font-weight: 600;
  padding: 8px 12px; border-radius: 999px; box-shadow: 0 4px 16px rgba(68,40,84,.18);
  white-space: nowrap;
}
/* En la página micro móvil, la barra CTA fija vive abajo: subimos la burbuja */
@media (max-width: 767px){
  body.page-micro .gtcchat-launcher{ bottom: 88px; }
  body.page-micro .gtcchat-launcher__hint{ bottom: 100px; }
}

.gtcchat-panel{
  position: fixed; z-index: 960; display: none; flex-direction: column;
  right: 16px; bottom: 84px; width: 372px; max-width: calc(100vw - 32px);
  height: 540px; max-height: calc(100vh - 110px);
  background: #fff; border-radius: 18px; overflow: hidden;
  box-shadow: 0 18px 60px rgba(43,26,53,.35);
  font-family: inherit;
}
.gtcchat-panel.gtcchat-open{ display: flex; }
@media (max-width: 767px){
  .gtcchat-panel{
    right: 0; left: 0; bottom: 0; width: 100%; max-width: 100%;
    height: 86vh; max-height: none; border-radius: 18px 18px 0 0;
  }
  body.page-micro .gtcchat-panel{ bottom: 0; } /* el panel tapa la sticky bar: correcto */
}

.gtcchat-head{
  background: linear-gradient(135deg, #442854, #782167);
  color: #fff; padding: 14px 16px; display: flex; align-items: center; gap: 10px;
}
.gtcchat-head__title{ font-weight: 700; font-size: .98rem; line-height: 1.25; }
.gtcchat-head__sub{ font-size: .74rem; opacity: .85; }
.gtcchat-close{
  margin-left: auto; background: rgba(255,255,255,.15); border: none; color: #fff;
  width: 34px; height: 34px; border-radius: 50%; font-size: 18px; cursor: pointer;
}

.gtcchat-msgs{
  flex: 1; overflow-y: auto; padding: 14px; background: #f7f4fa;
  display: flex; flex-direction: column; gap: 10px;
}
.gtcchat-msg{ max-width: 85%; padding: 10px 13px; border-radius: 14px;
  font-size: .92rem; line-height: 1.45; word-wrap: break-word; }
.gtcchat-msg--bot{ background: #fff; color: #2b1a35; border-bottom-left-radius: 4px;
  box-shadow: 0 1px 4px rgba(68,40,84,.08); align-self: flex-start; }
.gtcchat-msg--user{ background: #442854; color: #fff; border-bottom-right-radius: 4px;
  align-self: flex-end; }
.gtcchat-msg a{ color: #BA2C69; font-weight: 600; }
.gtcchat-msg--bot a{ word-break: break-all; }

.gtcchat-typing{ align-self: flex-start; display: flex; gap: 4px; padding: 12px 14px;
  background: #fff; border-radius: 14px; box-shadow: 0 1px 4px rgba(68,40,84,.08); }
.gtcchat-typing span{ width: 7px; height: 7px; border-radius: 50%; background: #BA2C69;
  animation: gtcchat-blink 1.2s infinite; }
.gtcchat-typing span:nth-child(2){ animation-delay: .2s; }
.gtcchat-typing span:nth-child(3){ animation-delay: .4s; }
@keyframes gtcchat-blink{ 0%,80%,100%{ opacity: .25 } 40%{ opacity: 1 } }

.gtcchat-seeds{ display: flex; flex-wrap: wrap; gap: 6px; padding: 2px 0 4px; }
.gtcchat-seed{
  background: #fff; border: 1px solid #e3d9ec; color: #442854; cursor: pointer;
  border-radius: 999px; padding: 8px 12px; font-size: .8rem; line-height: 1.2;
  transition: all .12s ease; text-align: left;
}
.gtcchat-seed:hover{ border-color: #BA2C69; color: #BA2C69; }

.gtcchat-inputrow{
  display: flex; gap: 8px; padding: 10px; background: #fff; border-top: 1px solid #eee4f2;
}
.gtcchat-input{
  flex: 1; border: 1px solid #e3d9ec; border-radius: 999px; padding: 11px 15px;
  font-size: 16px; /* evita el zoom automático de iOS */
  font-family: inherit; outline: none;
}
.gtcchat-input:focus{ border-color: #BA2C69; }
.gtcchat-send{
  background: #BA2C69; color: #fff; border: none; border-radius: 50%;
  width: 44px; height: 44px; font-size: 18px; cursor: pointer; flex: none;
}
.gtcchat-send:disabled{ opacity: .5; cursor: default; }
.gtcchat-foot{ text-align: center; font-size: .68rem; color: #8a7f92; padding: 0 10px 8px; background: #fff; }
