/* ============================================================
   Parque Girasoles · Asesor virtual
   Paleta: azul cielo #11a6df (primary asesor)
           naranja  #e9570a (paleta sitio)
           amarillo #fdc64c (acento)
   ============================================================ */

#pga-root{
  --pga-azul:#11a6df;
  --pga-azul-osc:#0e8cbf;
  --pga-azul-suave:#E6F4FB;
  --pga-naranja:#e9570a;
  --pga-amarillo:#fdc64c;
  --pga-marfil:#FCF9F7;
  --pga-crema:#FEF2EB;
  --pga-texto:#1F2D3E;
  --pga-texto-suave:#52647A;
  --pga-linea:rgba(17,166,223,.18);
  --pga-wa:#25D366;
  --pga-wa-osc:#1ea952;

  position:fixed; bottom:24px; right:24px; z-index:99999;
  font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif;
}

/* ============================================================
   LAUNCHER (FAB único circular)
   ============================================================ */
#pga-root .pga-launcher{
  position:relative;
  display:inline-flex; align-items:center; justify-content:center;
  background:var(--pga-azul); color:#fff; border:0;
  width:64px; height:64px; border-radius:50%;
  box-shadow:
    0 12px 30px -8px rgba(17,166,223,.45),
    0 4px 12px rgba(17,166,223,.18);
  cursor:pointer;
  transition:transform .25s ease, background .25s ease, box-shadow .25s ease;
}
#pga-root .pga-launcher:hover{
  transform:translateY(-3px);
  background:var(--pga-azul-osc);
  box-shadow:
    0 16px 36px -8px rgba(17,166,223,.55),
    0 6px 14px rgba(17,166,223,.22);
}

#pga-root .pga-icon-open,
#pga-root .pga-icon-close{
  display:inline-flex; align-items:center; justify-content:center;
  width:30px; height:30px;
  position:relative; z-index:2;
}
#pga-root .pga-icon-svg{ width:100%; height:100%; }
#pga-root .pga-icon-close{ display:none; }
#pga-root[data-open] .pga-icon-open{ display:none; }
#pga-root[data-open] .pga-icon-close{ display:inline-flex; }
#pga-root[data-open] .pga-pulse{ display:none; }

/* ============================================================
   ONDAS (ripple/pulse) — estilo durantia.mx
   ============================================================ */
#pga-root .pga-pulse{
  position:absolute; inset:0; border-radius:50%;
  background:var(--pga-azul);
  opacity:.55;
  animation:pga-pulse 2.4s cubic-bezier(.4,0,.2,1) infinite;
  pointer-events:none;
  z-index:1;
}
#pga-root .pga-pulse-2{ animation-delay:1.2s; opacity:.4; }
@keyframes pga-pulse{
  0%   { transform:scale(1);    opacity:.55; }
  70%  { transform:scale(2.1);  opacity:0;   }
  100% { transform:scale(2.1);  opacity:0;   }
}
@media (prefers-reduced-motion: reduce){
  #pga-root .pga-pulse{ animation:none; opacity:0; }
}

/* ============================================================
   PANEL DE CHAT
   ============================================================ */
#pga-root .pga-panel[hidden]{ display:none !important; }
#pga-root .pga-panel{
  position:fixed; bottom:100px; right:24px;
  width:380px; max-width:calc(100vw - 28px);
  height:min(620px, calc(100vh - 140px));
  background:var(--pga-marfil);
  border-radius:18px;
  box-shadow:
    0 26px 60px -14px rgba(17,166,223,.35),
    0 10px 24px rgba(17,166,223,.18);
  display:flex; flex-direction:column; overflow:hidden;
  animation:pga-up .3s ease;
}
@keyframes pga-up{
  from{ opacity:0; transform:translateY(20px); }
  to  { opacity:1; transform:translateY(0);    }
}

/* Header */
#pga-root .pga-head{
  background:linear-gradient(135deg, var(--pga-azul) 0%, var(--pga-azul-osc) 100%);
  color:#fff;
  padding:16px 18px;
  display:flex; align-items:center; gap:12px;
}
#pga-root .pga-head-icon{
  width:42px; height:42px; border-radius:50%;
  background:rgba(255,255,255,.18);
  display:flex; align-items:center; justify-content:center;
  color:#fff;
}
#pga-root .pga-head-icon .pga-icon-svg{ width:24px; height:24px; }
#pga-root .pga-head-title{
  font-size:1.05rem; font-weight:700; margin:0;
  color:#fff; line-height:1.1; letter-spacing:.01em;
}
#pga-root .pga-head-sub{
  margin:3px 0 0; font-size:.74rem;
  color:rgba(255,255,255,.85); letter-spacing:.03em;
}
#pga-root .pga-close{
  margin-left:auto; background:transparent; border:0;
  color:rgba(255,255,255,.8); cursor:pointer; padding:6px;
}
#pga-root .pga-close:hover{ color:#fff; }
#pga-root .pga-close svg{ width:20px; height:20px; }

/* Messages container */
#pga-root .pga-messages{
  flex:1; overflow-y:auto;
  padding:18px;
  background:var(--pga-marfil);
}
#pga-root .pga-msg{
  margin-bottom:14px; max-width:88%;
  animation:pga-fade .25s ease;
}
@keyframes pga-fade{
  from{ opacity:0; transform:translateY(4px); }
  to  { opacity:1; transform:translateY(0);   }
}

/* Mensaje del bot */
#pga-root .pga-msg.bot{
  background:#fff;
  border:1px solid var(--pga-linea);
  border-radius:14px 14px 14px 4px;
  padding:12px 14px;
  font-size:.92rem; color:var(--pga-texto); line-height:1.55;
  margin-right:auto;
}
#pga-root .pga-msg.bot strong{ color:var(--pga-azul-osc); }
#pga-root .pga-msg.bot ul,
#pga-root .pga-msg.bot ol{ padding-left:18px; margin:6px 0; }
#pga-root .pga-msg.bot li{ margin:3px 0; }
#pga-root .pga-msg.bot p{ margin:0 0 .5em; }
#pga-root .pga-msg.bot p:last-child{ margin-bottom:0; }

/* Mensaje del usuario */
#pga-root .pga-msg.user{
  background:var(--pga-azul); color:#fff;
  border-radius:14px 14px 4px 14px;
  padding:10px 14px; font-size:.92rem;
  margin-left:auto;
}

/* ============================================================
   ACCIONES (botones inline en respuestas)
   ============================================================ */
#pga-root .pga-actions{
  margin-top:10px;
  display:flex; flex-direction:column; gap:6px;
}
#pga-root .pga-action{
  display:inline-block;
  background:#fff;
  border:1px solid var(--pga-linea);
  color:var(--pga-azul-osc);
  border-radius:10px;
  padding:9px 12px;
  font-size:.85rem; font-weight:600;
  cursor:pointer; text-align:left;
  text-decoration:none;
  transition:.2s;
  font-family:inherit;
}
#pga-root .pga-action:hover{
  border-color:var(--pga-azul);
  background:var(--pga-azul-suave);
  transform:translateX(2px);
}
#pga-root .pga-action.wa{
  background:var(--pga-wa); color:#fff; border-color:var(--pga-wa);
}
#pga-root .pga-action.wa:hover{
  background:var(--pga-wa-osc); color:#fff; border-color:var(--pga-wa-osc);
}
#pga-root .pga-action.tel{
  background:var(--pga-naranja); color:#fff; border-color:var(--pga-naranja);
}
#pga-root .pga-action.tel:hover{ background:#c44a09; }
#pga-root .pga-action::before{
  display:inline-block; width:16px; margin-right:6px;
  font-weight:700;
}
#pga-root .pga-action.wa::before{ content:"›"; }
#pga-root .pga-action.tel::before{ content:"☎"; }
#pga-root .pga-action.mail::before{ content:"✉"; }

/* ============================================================
   QUICK REPLIES (chips iniciales)
   ============================================================ */
#pga-root .pga-quick-inline{
  display:flex; flex-direction:column; gap:6px;
  margin:6px 0 14px;
  animation:pga-fade .25s ease;
}
#pga-root .pga-quick-btn{
  background:#fff;
  border:1px solid var(--pga-linea);
  color:var(--pga-azul-osc);
  border-radius:10px;
  padding:9px 12px;
  font-size:.85rem; font-weight:600;
  cursor:pointer;
  transition:.2s;
  text-align:left;
  font-family:inherit;
  line-height:1.25;
}
#pga-root .pga-quick-btn:hover{
  border-color:var(--pga-azul);
  background:var(--pga-azul-suave);
}

/* ============================================================
   INPUT ROW
   ============================================================ */
#pga-root .pga-input-row{
  display:flex; align-items:center; gap:8px;
  padding:10px 14px;
  background:#fff;
  border-top:1px solid var(--pga-linea);
}
#pga-root .pga-input-row input{
  flex:1; background:transparent; border:0;
  font-size:.92rem; padding:10px 4px;
  color:var(--pga-texto); font-family:inherit;
}
#pga-root .pga-input-row input:focus{ outline:none; }
#pga-root .pga-input-row button{
  background:var(--pga-azul); border:0; color:#fff;
  width:38px; height:38px; border-radius:50%;
  display:flex; align-items:center; justify-content:center;
  cursor:pointer; transition:background .2s ease;
}
#pga-root .pga-input-row button:hover{ background:var(--pga-azul-osc); }
#pga-root .pga-input-row button svg{ width:18px; height:18px; }

#pga-root .pga-foot{
  text-align:center; font-size:.7rem;
  color:var(--pga-texto-suave);
  padding:8px 18px 12px; margin:0; background:#fff;
}

/* ============================================================
   TYPING INDICATOR
   ============================================================ */
#pga-root .pga-typing{ display:inline-block; margin:4px 0; }
#pga-root .pga-typing span{
  display:inline-block; width:6px; height:6px;
  border-radius:50%; background:var(--pga-azul);
  margin:0 2px;
  animation:pga-typing 1.2s infinite ease-in-out;
}
#pga-root .pga-typing span:nth-child(2){ animation-delay:.15s; }
#pga-root .pga-typing span:nth-child(3){ animation-delay:.30s; }
@keyframes pga-typing{
  0%,80%,100%{ opacity:.3; transform:scale(.8); }
  40%        { opacity:1;  transform:scale(1);  }
}

/* Scrollbar */
#pga-root .pga-messages::-webkit-scrollbar{ width:6px; }
#pga-root .pga-messages::-webkit-scrollbar-thumb{
  background:var(--pga-linea); border-radius:3px;
}

/* ============================================================
   RESPONSIVE
   ============================================================ */
@media (max-width:600px){
  #pga-root{ bottom:18px; right:14px; }
  #pga-root .pga-launcher{ width:58px; height:58px; }
  #pga-root .pga-icon-open,
  #pga-root .pga-icon-close{ width:26px; height:26px; }
  #pga-root .pga-panel{
    bottom:88px; right:14px; left:14px;
    width:auto;
    height:calc(100vh - 110px);
    max-height:calc(100dvh - 110px);
  }
}

/* ============================================================
   REUBICAR Y LIMPIAR FABs PREVIOS DEL SITIO
   ============================================================ */

/* Instantio cart FAB — subir por encima del asesor */
body .ins-fixed-toogle.ins-hori-right{
  bottom:100px !important;
  right:24px !important;
  z-index:99998 !important;
}
@media (max-width:600px){
  body .ins-fixed-toogle.ins-hori-right{
    bottom:84px !important;
    right:14px !important;
  }
}

/* Esconder cualquier WhatsApp residual (wpt-whatsapp, hostinger-reach, etc.) */
body .wptwa-widget,
body .wptwa-toggle,
body #wptwa-widget,
body .wptwa-container,
body div[class*="wptwa-"],
body div[id*="wptwa-"],
body div[class*="whatsapp-widget"],
body .hostinger-reach-fab,
body .hostinger-reach-widget{
  display:none !important;
  visibility:hidden !important;
}

/* Botón "back-to-top" de Flatsome — desplazar para no chocar */
body #top-link.back-to-top{
  bottom:170px !important;
}
@media (max-width:600px){
  body #top-link.back-to-top{ bottom:150px !important; }
}